Merge remote-tracking branch 'origin/main' into feat-v3.3
commit
040956819f
|
@ -57,6 +57,43 @@
|
|||
- ๐ ไผๅ Upload ๆไฝๆ้ฎ็ๆ ทๅผ็ป่ใ
|
||||
- ๐ ไฟฎๅค Switch ๅจๆ้ปไธป้ขไธๅ
ณ้ญๆถ็้ข่ฒ้ฎ้ขใ
|
||||
|
||||
## 3.2.15
|
||||
|
||||
`2022-11-10`
|
||||
|
||||
- ๐ Fix the problem of preview image error when `Image` is deleted dynamically
|
||||
|
||||
## 3.2.14
|
||||
|
||||
`2022-11-07`
|
||||
|
||||
- ๐ Fix the problem of dynamic theme failure when custom `prefixCls` [#6063](https://github.com/vueComponent/ant-design-vue/issues/6063)
|
||||
- ๐ Fix `DatePicker` error when using select and other popup components as slots [#6062](https://github.com/vueComponent/ant-design-vue/issues/6062)
|
||||
- ๐ Fix `DirectoryTree` not exposing scrollTo method [#6067](https://github.com/vueComponent/ant-design-vue/issues/6067)
|
||||
- ๐ Fix `RangePicker` popup position does not change [#6073](https://github.com/vueComponent/ant-design-vue/issues/6073)
|
||||
|
||||
## 3.2.13
|
||||
|
||||
`2022-10-08`
|
||||
|
||||
- ๐ Support Vue 3 upgrade tool `@vue/compat` [#5973](https://github.com/vueComponent/ant-design-vue/issues/5973)
|
||||
- ๐ Cascader add tagRender slot [#5954](https://github.com/vueComponent/ant-design-vue/issues/5954)
|
||||
- ๐ Fix image flickering issue when Image preview is closed [#5955](https://github.com/vueComponent/ant-design-vue/issues/5955)
|
||||
- ๐ Fix Tag close icon style display misplaced [#5956](https://github.com/vueComponent/ant-design-vue/issues/5956)
|
||||
- ๐ Fix Table loading property ts type error [#5964](https://github.com/vueComponent/ant-design-vue/issues/5964)
|
||||
- ๐ Fix Transfer deletion exception [#5975](https://github.com/vueComponent/ant-design-vue/issues/5975)
|
||||
- ๐ Fix the scroll shadow display issue of Table fixed column [#5996](https://github.com/vueComponent/ant-design-vue/issues/5996)
|
||||
- ๐ Fix DirectoryTree's default expansion failure issue when customizing fieldNames [#6007](https://github.com/vueComponent/ant-design-vue/issues/6007)
|
||||
|
||||
## 3.2.12
|
||||
|
||||
`2022-09-02`
|
||||
|
||||
- ๐ Fix DescriptionItem labelStyle does not take effect [#5920](https://github.com/vueComponent/ant-design-vue/issues/5920)
|
||||
- ๐ Typography copy button prevents bubbling [##5746](https://github.com/vueComponent/ant-design-vue/issues/5746)
|
||||
- ๐ Fix table merged column scroll shadow occlusion issue [#5786](https://github.com/vueComponent/ant-design-vue/issues/5786)
|
||||
- ๐ Fix the inconsistency between css var and ConfigProvider variables [#5929](https://github.com/vueComponent/ant-design-vue/issues/5929)
|
||||
|
||||
## 3.2.11
|
||||
|
||||
`2022-08-08`
|
||||
|
|
|
@ -57,6 +57,43 @@
|
|||
- ๐ ไผๅ Upload ๆไฝๆ้ฎ็ๆ ทๅผ็ป่ใ
|
||||
- ๐ ไฟฎๅค Switch ๅจๆ้ปไธป้ขไธๅ
ณ้ญๆถ็้ข่ฒ้ฎ้ขใ
|
||||
|
||||
## 3.2.15
|
||||
|
||||
`2022-11-10`
|
||||
|
||||
- ๐ ไฟฎๅค `Image` ๅจๆๅ ้คๆถ๏ผ้ข่งๅพ็้่ฏฏ้ฎ้ข
|
||||
|
||||
## 3.2.14
|
||||
|
||||
`2022-11-07`
|
||||
|
||||
- ๐ ไฟฎๅค่ชๅฎไน `prefixCls` ๆถ๏ผๅจๆไธป้ขๅคฑๆ้ฎ้ข [#6063](https://github.com/vueComponent/ant-design-vue/issues/6063)
|
||||
- ๐ ไฟฎๅค `DatePicker` ไฝฟ็จ select ็ญๅผน็ช็ปไปถไฝไธบๆๆงฝๆถ๏ผๆฅ้้ฎ้ข [#6062](https://github.com/vueComponent/ant-design-vue/issues/6062)
|
||||
- ๐ ไฟฎๅค `DirectoryTree` ๆชๆด้ฒ scrollTo ๆนๆณ [#6067](https://github.com/vueComponent/ant-design-vue/issues/6067)
|
||||
- ๐ ไฟฎๅค `RangePicker` ๅผน็ชไฝ็ฝฎไธๆนๅ้ฎ้ข [#6073](https://github.com/vueComponent/ant-design-vue/issues/6073)
|
||||
|
||||
## 3.2.13
|
||||
|
||||
`2022-10-08`
|
||||
|
||||
- ๐ ๆฏๆ Vue 3 ๅ็บงๅทฅๅ
ท `@vue/compat` [#5973](https://github.com/vueComponent/ant-design-vue/issues/5973)
|
||||
- ๐ Cascader ๆทปๅ tagRender ๆๆงฝ [#5954](https://github.com/vueComponent/ant-design-vue/issues/5954)
|
||||
- ๐ ไฟฎๅค Image ้ข่งๅ
ณ้ญๆถ๏ผๅพ็้ชๅจ้ฎ้ข [#5955](https://github.com/vueComponent/ant-design-vue/issues/5955)
|
||||
- ๐ ไฟฎๅค Tag ๅ
ณ้ญๅพๆ ๆ ทๅผๆพ็คบ้ไฝ [#5956](https://github.com/vueComponent/ant-design-vue/issues/5956)
|
||||
- ๐ ไฟฎๅค Table loading ๅฑๆง ts ็ฑปๅ้่ฏฏ [#5964](https://github.com/vueComponent/ant-design-vue/issues/5964)
|
||||
- ๐ ไฟฎๅค Transfer ๅ ้คๅผๅธธ้ฎ้ข [#5975](https://github.com/vueComponent/ant-design-vue/issues/5975)
|
||||
- ๐ ไฟฎๅค Table ๅบๅฎๅ็ๆปๅจ้ดๅฝฑๆพ็คบ้ฎ้ข [#5996](https://github.com/vueComponent/ant-design-vue/issues/5996)
|
||||
- ๐ ไฟฎๅค DirectoryTree ๅจ่ชๅฎไน fieldNames ๆถ๏ผ้ป่ฎคๅฑๅผๅคฑๆ้ฎ้ข [#6007](https://github.com/vueComponent/ant-design-vue/issues/6007)
|
||||
|
||||
## 3.2.12
|
||||
|
||||
`2022-09-02`
|
||||
|
||||
- ๐ ไฟฎๅค DescriptionItem labelStyle ไธ็ๆ้ฎ้ข [#5920](https://github.com/vueComponent/ant-design-vue/issues/5920)
|
||||
- ๐ Typography ๅคๅถๆ้ฎ้ปๆญขๅๆณก [##5746](https://github.com/vueComponent/ant-design-vue/issues/5746)
|
||||
- ๐ ไฟฎๅค table ๅๅนถๅๆปๅจ้ดๅฝฑ้ฎๆก้ฎ้ข [#5786](https://github.com/vueComponent/ant-design-vue/issues/5786)
|
||||
- ๐ ไฟฎๅค css var ๅ ConfigProvider ๅ้ไธไธ่ด้ฎ้ข [#5929](https://github.com/vueComponent/ant-design-vue/issues/5929)
|
||||
|
||||
## 3.2.11
|
||||
|
||||
`2022-08-08`
|
||||
|
|
22
LICENSE
22
LICENSE
|
@ -44,3 +44,25 @@ NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
|||
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
||||
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
||||
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2019-PRESENT Anthony Fu<https://github.com/antfu>
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
|
|
|
@ -86,7 +86,7 @@ ant-design-vue ๆฏ MIT ๅ่ฎฎ็ๅผๆบ้กน็ฎใไธบไบ้กน็ฎ่ฝๅคๆดๅฅฝ็ๆ็ปญ
|
|||
|
||||
Become a sponsor and get your logo on our README on Github with a link to your site. [[Become a sponsor](https://opencollective.com/ant-design-vue#sponsor)]
|
||||
|
||||
<a href="https://opencollective.com/ant-design-vue/sponsor/0/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/0/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/1/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/1/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/2/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/2/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/3/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/3/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/4/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/4/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/5/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/5/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/6/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/6/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/7/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/7/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/8/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/8/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/9/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/9/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/10/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/10/avatar.svg"></a>
|
||||
<a href="http://www.jeecg.com/" target="_blank"><img src="https://aliyuncdn.antdv.com/jeecg-logo.png" height="64"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/0/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/0/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/1/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/1/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/2/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/2/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/3/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/3/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/4/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/4/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/5/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/5/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/6/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/6/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/7/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/7/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/8/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/8/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/9/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/9/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/10/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/10/avatar.svg"></a>
|
||||
|
||||
## Backers
|
||||
|
||||
|
|
|
@ -80,7 +80,7 @@ ant-design-vue is an MIT-licensed open source project. In order to achieve bette
|
|||
|
||||
Become a sponsor and get your logo on our README on Github with a link to your site. [[Become a sponsor](https://opencollective.com/ant-design-vue#sponsor)]
|
||||
|
||||
<a href="https://opencollective.com/ant-design-vue/sponsor/0/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/0/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/1/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/1/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/2/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/2/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/3/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/3/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/4/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/4/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/5/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/5/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/6/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/6/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/7/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/7/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/8/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/8/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/9/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/9/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/10/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/10/avatar.svg"></a>
|
||||
<a href="http://www.jeecg.com/" target="_blank"><img src="https://aliyuncdn.antdv.com/jeecg-logo.png" height="64"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/0/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/0/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/1/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/1/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/2/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/2/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/3/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/3/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/4/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/4/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/5/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/5/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/6/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/6/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/7/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/7/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/8/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/8/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/9/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/9/avatar.svg"></a> <a href="https://opencollective.com/ant-design-vue/sponsor/10/website" target="_blank"><img src="https://opencollective.com/ant-design-vue/sponsor/10/avatar.svg"></a>
|
||||
|
||||
## [More Sponsor (From Patreonใalipayใwechatใpaypal...)](https://github.com/vueComponent/ant-design-vue/blob/master/BACKERS.md)
|
||||
|
||||
|
|
|
@ -25,7 +25,7 @@ function readLine(input: string) {
|
|||
}
|
||||
|
||||
function splitTableLine(line: string) {
|
||||
line = line.replace('\\|', 'JOIN');
|
||||
line = line.replace(/\\\|/g, 'JOIN');
|
||||
|
||||
const items = line.split('|').map(item => item.trim().replace('JOIN', '|'));
|
||||
|
||||
|
|
|
@ -26,6 +26,7 @@ function isThenable(thing?: PromiseLike<any>): boolean {
|
|||
}
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ActionButton',
|
||||
props: actionButtonProps,
|
||||
setup(props, { slots }) {
|
||||
|
|
|
@ -2,6 +2,7 @@ import { defineComponent, ref, withDirectives } from 'vue';
|
|||
import antInput from './antInputDirective';
|
||||
import PropTypes from './vue-types';
|
||||
const BaseInput = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
props: {
|
||||
value: PropTypes.string.def(''),
|
||||
},
|
||||
|
|
|
@ -11,6 +11,7 @@ import {
|
|||
import { useInjectPortal } from '../vc-trigger/context';
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'Portal',
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
|
|
|
@ -49,6 +49,7 @@ const getParent = (getContainer: GetContainer) => {
|
|||
export type GetContainer = string | HTMLElement | (() => HTMLElement);
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'PortalWrapper',
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
import { defineComponent } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'Portal',
|
||||
inheritAttrs: false,
|
||||
props: ['getContainer'],
|
||||
|
|
|
@ -0,0 +1,34 @@
|
|||
import { isClient } from './is';
|
||||
|
||||
export interface ConfigurableWindow {
|
||||
/*
|
||||
* Specify a custom `window` instance, e.g. working with iframes or in testing environments.
|
||||
*/
|
||||
window?: Window;
|
||||
}
|
||||
|
||||
export interface ConfigurableDocument {
|
||||
/*
|
||||
* Specify a custom `document` instance, e.g. working with iframes or in testing environments.
|
||||
*/
|
||||
document?: Document;
|
||||
}
|
||||
|
||||
export interface ConfigurableNavigator {
|
||||
/*
|
||||
* Specify a custom `navigator` instance, e.g. working with iframes or in testing environments.
|
||||
*/
|
||||
navigator?: Navigator;
|
||||
}
|
||||
|
||||
export interface ConfigurableLocation {
|
||||
/*
|
||||
* Specify a custom `location` instance, e.g. working with iframes or in testing environments.
|
||||
*/
|
||||
location?: Location;
|
||||
}
|
||||
|
||||
export const defaultWindow = /* #__PURE__ */ isClient ? window : undefined;
|
||||
export const defaultDocument = /* #__PURE__ */ isClient ? window.document : undefined;
|
||||
export const defaultNavigator = /* #__PURE__ */ isClient ? window.navigator : undefined;
|
||||
export const defaultLocation = /* #__PURE__ */ isClient ? window.location : undefined;
|
|
@ -0,0 +1,28 @@
|
|||
export const isClient = typeof window !== 'undefined';
|
||||
export const isDef = <T = any>(val?: T): val is T => typeof val !== 'undefined';
|
||||
export const assert = (condition: boolean, ...infos: any[]) => {
|
||||
if (!condition) console.warn(...infos);
|
||||
};
|
||||
const toString = Object.prototype.toString;
|
||||
export const isBoolean = (val: any): val is boolean => typeof val === 'boolean';
|
||||
export const isFunction = <T extends Function>(val: any): val is T => typeof val === 'function';
|
||||
export const isNumber = (val: any): val is number => typeof val === 'number';
|
||||
export const isString = (val: unknown): val is string => typeof val === 'string';
|
||||
export const isObject = (val: any): val is object => toString.call(val) === '[object Object]';
|
||||
export const isWindow = (val: any): val is Window =>
|
||||
typeof window !== 'undefined' && toString.call(val) === '[object Window]';
|
||||
export const now = () => Date.now();
|
||||
export const timestamp = () => +Date.now();
|
||||
export const clamp = (n: number, min: number, max: number) => Math.min(max, Math.max(min, n));
|
||||
export const noop = () => {};
|
||||
export const rand = (min: number, max: number) => {
|
||||
min = Math.ceil(min);
|
||||
max = Math.floor(max);
|
||||
return Math.floor(Math.random() * (max - min + 1)) + min;
|
||||
};
|
||||
export const isIOS =
|
||||
/* #__PURE__ */ isClient &&
|
||||
window?.navigator?.userAgent &&
|
||||
/iP(ad|hone|od)/.test(window.navigator.userAgent);
|
||||
export const hasOwn = <T extends object, K extends keyof T>(val: T, key: K): key is K =>
|
||||
Object.prototype.hasOwnProperty.call(val, key);
|
|
@ -0,0 +1,9 @@
|
|||
import { unref } from 'vue';
|
||||
import type { MaybeComputedRef } from './types';
|
||||
|
||||
/**
|
||||
* Get the value of value/ref/getter.
|
||||
*/
|
||||
export function resolveUnref<T>(r: MaybeComputedRef<T>): T {
|
||||
return typeof r === 'function' ? (r as any)() : unref(r);
|
||||
}
|
|
@ -0,0 +1,15 @@
|
|||
// eslint-disable-next-line no-restricted-imports
|
||||
import { getCurrentInstance, nextTick, onMounted } from 'vue';
|
||||
import type { Fn } from './types';
|
||||
|
||||
/**
|
||||
* Call onMounted() if it's inside a component lifecycle, if not, just call the function
|
||||
*
|
||||
* @param fn
|
||||
* @param sync if set to false, it will run in the nextTick() of Vue
|
||||
*/
|
||||
export function tryOnMounted(fn: Fn, sync = true) {
|
||||
if (getCurrentInstance()) onMounted(fn);
|
||||
else if (sync) fn();
|
||||
else nextTick(fn);
|
||||
}
|
|
@ -0,0 +1,15 @@
|
|||
import { getCurrentScope, onScopeDispose } from 'vue';
|
||||
import type { Fn } from './types';
|
||||
|
||||
/**
|
||||
* Call onScopeDispose() if it's inside a effect scope lifecycle, if not, do nothing
|
||||
*
|
||||
* @param fn
|
||||
*/
|
||||
export function tryOnScopeDispose(fn: Fn) {
|
||||
if (getCurrentScope()) {
|
||||
onScopeDispose(fn);
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
|
@ -0,0 +1,142 @@
|
|||
import type { ComputedRef, Ref, WatchOptions, WatchSource } from 'vue';
|
||||
|
||||
/**
|
||||
* Any function
|
||||
*/
|
||||
export type Fn = () => void;
|
||||
|
||||
/**
|
||||
* A ref that allow to set null or undefined
|
||||
*/
|
||||
export type RemovableRef<T> = Omit<Ref<T>, 'value'> & {
|
||||
get value(): T;
|
||||
set value(value: T | null | undefined);
|
||||
};
|
||||
|
||||
/**
|
||||
* @deprecated Use `RemovableRef`
|
||||
*/
|
||||
export type RemoveableRef<T> = RemovableRef<T>;
|
||||
|
||||
/**
|
||||
* Maybe it's a ref, or a plain value
|
||||
*
|
||||
* ```ts
|
||||
* type MaybeRef<T> = T | Ref<T>
|
||||
* ```
|
||||
*/
|
||||
export type MaybeRef<T> = T | Ref<T>;
|
||||
|
||||
/**
|
||||
* Maybe it's a ref, or a plain value, or a getter function
|
||||
*
|
||||
* ```ts
|
||||
* type MaybeComputedRef<T> = (() => T) | T | Ref<T> | ComputedRef<T>
|
||||
* ```
|
||||
*/
|
||||
export type MaybeComputedRef<T> = MaybeReadonlyRef<T> | MaybeRef<T>;
|
||||
|
||||
/**
|
||||
* Maybe it's a computed ref, or a getter function
|
||||
*
|
||||
* ```ts
|
||||
* type MaybeReadonlyRef<T> = (() => T) | ComputedRef<T>
|
||||
* ```
|
||||
*/
|
||||
export type MaybeReadonlyRef<T> = (() => T) | ComputedRef<T>;
|
||||
|
||||
/**
|
||||
* Make all the nested attributes of an object or array to MaybeRef<T>
|
||||
*
|
||||
* Good for accepting options that will be wrapped with `reactive` or `ref`
|
||||
*
|
||||
* ```ts
|
||||
* UnwrapRef<DeepMaybeRef<T>> === T
|
||||
* ```
|
||||
*/
|
||||
export type DeepMaybeRef<T> = T extends Ref<infer V>
|
||||
? MaybeRef<V>
|
||||
: T extends Array<any> | object
|
||||
? { [K in keyof T]: DeepMaybeRef<T[K]> }
|
||||
: MaybeRef<T>;
|
||||
|
||||
/**
|
||||
* Infers the element type of an array
|
||||
*/
|
||||
export type ElementOf<T> = T extends (infer E)[] ? E : never;
|
||||
|
||||
export type ShallowUnwrapRef<T> = T extends Ref<infer P> ? P : T;
|
||||
|
||||
export type Awaitable<T> = Promise<T> | T;
|
||||
|
||||
export type ArgumentsType<T> = T extends (...args: infer U) => any ? U : never;
|
||||
|
||||
export interface Pausable {
|
||||
/**
|
||||
* A ref indicate whether a pausable instance is active
|
||||
*/
|
||||
isActive: Ref<boolean>;
|
||||
|
||||
/**
|
||||
* Temporary pause the effect from executing
|
||||
*/
|
||||
pause: Fn;
|
||||
|
||||
/**
|
||||
* Resume the effects
|
||||
*/
|
||||
resume: Fn;
|
||||
}
|
||||
|
||||
export interface Stoppable {
|
||||
/**
|
||||
* A ref indicate whether a stoppable instance is executing
|
||||
*/
|
||||
isPending: Ref<boolean>;
|
||||
|
||||
/**
|
||||
* Stop the effect from executing
|
||||
*/
|
||||
stop: Fn;
|
||||
|
||||
/**
|
||||
* Start the effects
|
||||
*/
|
||||
start: Fn;
|
||||
}
|
||||
|
||||
/**
|
||||
* @deprecated Use `Stoppable`
|
||||
*/
|
||||
export type Stopable = Stoppable;
|
||||
|
||||
export interface ConfigurableFlush {
|
||||
/**
|
||||
* Timing for monitoring changes, refer to WatchOptions for more details
|
||||
*
|
||||
* @default 'pre'
|
||||
*/
|
||||
flush?: WatchOptions['flush'];
|
||||
}
|
||||
|
||||
export interface ConfigurableFlushSync {
|
||||
/**
|
||||
* Timing for monitoring changes, refer to WatchOptions for more details.
|
||||
* Unlike `watch()`, the default is set to `sync`
|
||||
*
|
||||
* @default 'sync'
|
||||
*/
|
||||
flush?: WatchOptions['flush'];
|
||||
}
|
||||
|
||||
// Internal Types
|
||||
export type MapSources<T> = {
|
||||
[K in keyof T]: T[K] extends WatchSource<infer V> ? V : never;
|
||||
};
|
||||
export type MapOldSources<T, Immediate> = {
|
||||
[K in keyof T]: T[K] extends WatchSource<infer V>
|
||||
? Immediate extends true
|
||||
? V | undefined
|
||||
: V
|
||||
: never;
|
||||
};
|
|
@ -0,0 +1,24 @@
|
|||
import type { ComponentPublicInstance } from 'vue';
|
||||
import type { MaybeComputedRef, MaybeRef } from './types';
|
||||
import { resolveUnref } from './resolveUnref';
|
||||
|
||||
export type VueInstance = ComponentPublicInstance;
|
||||
export type MaybeElementRef<T extends MaybeElement = MaybeElement> = MaybeRef<T>;
|
||||
export type MaybeComputedElementRef<T extends MaybeElement = MaybeElement> = MaybeComputedRef<T>;
|
||||
export type MaybeElement = HTMLElement | SVGElement | VueInstance | undefined | null;
|
||||
|
||||
export type UnRefElementReturn<T extends MaybeElement = MaybeElement> = T extends VueInstance
|
||||
? Exclude<MaybeElement, VueInstance>
|
||||
: T | undefined;
|
||||
|
||||
/**
|
||||
* Get the dom element of a ref of element or Vue component instance
|
||||
*
|
||||
* @param elRef
|
||||
*/
|
||||
export function unrefElement<T extends MaybeElement>(
|
||||
elRef: MaybeComputedElementRef<T>,
|
||||
): UnRefElementReturn<T> {
|
||||
const plain = resolveUnref(elRef);
|
||||
return (plain as VueInstance)?.$el ?? plain;
|
||||
}
|
|
@ -0,0 +1,65 @@
|
|||
import { ref, watch } from 'vue';
|
||||
import type { MaybeComputedElementRef } from './unrefElement';
|
||||
import type { UseResizeObserverOptions } from './useResizeObserver';
|
||||
import { useResizeObserver } from './useResizeObserver';
|
||||
import { unrefElement } from './unrefElement';
|
||||
|
||||
export interface ElementSize {
|
||||
width: number;
|
||||
height: number;
|
||||
}
|
||||
|
||||
/**
|
||||
* Reactive size of an HTML element.
|
||||
*
|
||||
* @see https://vueuse.org/useElementSize
|
||||
* @param target
|
||||
* @param callback
|
||||
* @param options
|
||||
*/
|
||||
export function useElementSize(
|
||||
target: MaybeComputedElementRef,
|
||||
initialSize: ElementSize = { width: 0, height: 0 },
|
||||
options: UseResizeObserverOptions = {},
|
||||
) {
|
||||
const { box = 'content-box' } = options;
|
||||
const width = ref(initialSize.width);
|
||||
const height = ref(initialSize.height);
|
||||
|
||||
useResizeObserver(
|
||||
target,
|
||||
([entry]) => {
|
||||
const boxSize =
|
||||
box === 'border-box'
|
||||
? entry.borderBoxSize
|
||||
: box === 'content-box'
|
||||
? entry.contentBoxSize
|
||||
: entry.devicePixelContentBoxSize;
|
||||
|
||||
if (boxSize) {
|
||||
width.value = boxSize.reduce((acc, { inlineSize }) => acc + inlineSize, 0);
|
||||
height.value = boxSize.reduce((acc, { blockSize }) => acc + blockSize, 0);
|
||||
} else {
|
||||
// fallback
|
||||
width.value = entry.contentRect.width;
|
||||
height.value = entry.contentRect.height;
|
||||
}
|
||||
},
|
||||
options,
|
||||
);
|
||||
|
||||
watch(
|
||||
() => unrefElement(target),
|
||||
ele => {
|
||||
width.value = ele ? initialSize.width : 0;
|
||||
height.value = ele ? initialSize.height : 0;
|
||||
},
|
||||
);
|
||||
|
||||
return {
|
||||
width,
|
||||
height,
|
||||
};
|
||||
}
|
||||
|
||||
export type UseElementSizeReturn = ReturnType<typeof useElementSize>;
|
|
@ -0,0 +1,94 @@
|
|||
import { tryOnScopeDispose } from './tryOnScopeDispose';
|
||||
import { watch } from 'vue';
|
||||
import type { MaybeComputedElementRef } from './unrefElement';
|
||||
import { unrefElement } from './unrefElement';
|
||||
import { useSupported } from './useSupported';
|
||||
import type { ConfigurableWindow } from './_configurable';
|
||||
import { defaultWindow } from './_configurable';
|
||||
|
||||
export interface ResizeObserverSize {
|
||||
readonly inlineSize: number;
|
||||
readonly blockSize: number;
|
||||
}
|
||||
|
||||
export interface ResizeObserverEntry {
|
||||
readonly target: Element;
|
||||
readonly contentRect: DOMRectReadOnly;
|
||||
readonly borderBoxSize?: ReadonlyArray<ResizeObserverSize>;
|
||||
readonly contentBoxSize?: ReadonlyArray<ResizeObserverSize>;
|
||||
readonly devicePixelContentBoxSize?: ReadonlyArray<ResizeObserverSize>;
|
||||
}
|
||||
|
||||
export type ResizeObserverCallback = (
|
||||
entries: ReadonlyArray<ResizeObserverEntry>,
|
||||
observer: ResizeObserver,
|
||||
) => void;
|
||||
|
||||
export interface UseResizeObserverOptions extends ConfigurableWindow {
|
||||
/**
|
||||
* Sets which box model the observer will observe changes to. Possible values
|
||||
* are `content-box` (the default), `border-box` and `device-pixel-content-box`.
|
||||
*
|
||||
* @default 'content-box'
|
||||
*/
|
||||
box?: ResizeObserverBoxOptions;
|
||||
}
|
||||
|
||||
declare class ResizeObserver {
|
||||
constructor(callback: ResizeObserverCallback);
|
||||
disconnect(): void;
|
||||
observe(target: Element, options?: UseResizeObserverOptions): void;
|
||||
unobserve(target: Element): void;
|
||||
}
|
||||
|
||||
/**
|
||||
* Reports changes to the dimensions of an Element's content or the border-box
|
||||
*
|
||||
* @see https://vueuse.org/useResizeObserver
|
||||
* @param target
|
||||
* @param callback
|
||||
* @param options
|
||||
*/
|
||||
export function useResizeObserver(
|
||||
target: MaybeComputedElementRef,
|
||||
callback: ResizeObserverCallback,
|
||||
options: UseResizeObserverOptions = {},
|
||||
) {
|
||||
const { window = defaultWindow, ...observerOptions } = options;
|
||||
let observer: ResizeObserver | undefined;
|
||||
const isSupported = useSupported(() => window && 'ResizeObserver' in window);
|
||||
|
||||
const cleanup = () => {
|
||||
if (observer) {
|
||||
observer.disconnect();
|
||||
observer = undefined;
|
||||
}
|
||||
};
|
||||
|
||||
const stopWatch = watch(
|
||||
() => unrefElement(target),
|
||||
el => {
|
||||
cleanup();
|
||||
|
||||
if (isSupported.value && window && el) {
|
||||
observer = new ResizeObserver(callback);
|
||||
observer!.observe(el, observerOptions);
|
||||
}
|
||||
},
|
||||
{ immediate: true, flush: 'post' },
|
||||
);
|
||||
|
||||
const stop = () => {
|
||||
cleanup();
|
||||
stopWatch();
|
||||
};
|
||||
|
||||
tryOnScopeDispose(stop);
|
||||
|
||||
return {
|
||||
isSupported,
|
||||
stop,
|
||||
};
|
||||
}
|
||||
|
||||
export type UseResizeObserverReturn = ReturnType<typeof useResizeObserver>;
|
|
@ -0,0 +1,14 @@
|
|||
import { tryOnMounted } from './tryOnMounted';
|
||||
import type { Ref } from 'vue';
|
||||
import { ref } from 'vue';
|
||||
|
||||
export function useSupported(callback: () => unknown, sync = false) {
|
||||
const isSupported = ref() as Ref<boolean>;
|
||||
|
||||
const update = () => (isSupported.value = Boolean(callback()));
|
||||
|
||||
update();
|
||||
|
||||
tryOnMounted(update, sync);
|
||||
return isSupported;
|
||||
}
|
|
@ -366,8 +366,8 @@ export function filterEmpty(children = []) {
|
|||
children.forEach(child => {
|
||||
if (Array.isArray(child)) {
|
||||
res.push(...child);
|
||||
} else if (child && child.type === Fragment) {
|
||||
res.push(...child.children);
|
||||
} else if (child?.type === Fragment) {
|
||||
res.push(...filterEmpty(child.children));
|
||||
} else {
|
||||
res.push(child);
|
||||
}
|
||||
|
|
|
@ -15,6 +15,7 @@ const inlineStyle = {
|
|||
};
|
||||
|
||||
const TransButton = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'TransButton',
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
|
|
|
@ -21,6 +21,7 @@ function isNotGrey(color: string) {
|
|||
return true;
|
||||
}
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'Wave',
|
||||
props: {
|
||||
insertExtraNode: Boolean,
|
||||
|
|
|
@ -72,6 +72,7 @@ export type AffixExpose = {
|
|||
|
||||
export type AffixInstance = ComponentPublicInstance<AffixProps, AffixExpose>;
|
||||
const Affix = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AAffix',
|
||||
props: affixProps(),
|
||||
setup(props, { slots, emit, expose }) {
|
||||
|
|
|
@ -63,6 +63,7 @@ export const alertProps = () => ({
|
|||
export type AlertProps = Partial<ExtractPropTypes<ReturnType<typeof alertProps>>>;
|
||||
|
||||
const Alert = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AAlert',
|
||||
inheritAttrs: false,
|
||||
props: alertProps(),
|
||||
|
|
|
@ -73,6 +73,7 @@ export interface AnchorState {
|
|||
}
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AAnchor',
|
||||
inheritAttrs: false,
|
||||
props: anchorProps(),
|
||||
|
|
|
@ -16,6 +16,7 @@ export const anchorLinkProps = () => ({
|
|||
export type AnchorLinkProps = Partial<ExtractPropTypes<ReturnType<typeof anchorLinkProps>>>;
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AAnchorLink',
|
||||
props: initDefaultProps(anchorLinkProps(), { href: '#' }),
|
||||
slots: ['title'],
|
||||
|
|
|
@ -32,11 +32,11 @@ exports[`renders ./components/anchor/demo/basic.vue correctly 1`] = `
|
|||
exports[`renders ./components/anchor/demo/customizeHighlight.vue correctly 1`] = `
|
||||
<div class="ant-anchor-wrapper" style="max-height: 100vh;">
|
||||
<div class="ant-anchor ant-anchor-fixed">
|
||||
<div class="ant-anchor-ink"><span class="ant-anchor-ink-ball visible" style="top: -4.5px;"></span></div>
|
||||
<div class="ant-anchor-ink"><span class="ant-anchor-ink-ball"></span></div>
|
||||
<div class="ant-anchor-link"><a class="ant-anchor-link-title" href="#components-anchor-demo-basic" title="Basic demo">Basic demo</a>
|
||||
<!---->
|
||||
</div>
|
||||
<div class="ant-anchor-link ant-anchor-link-active"><a class="ant-anchor-link-title ant-anchor-link-title-active" href="#components-anchor-demo-static" title="Static demo">Static demo</a>
|
||||
<div class="ant-anchor-link"><a class="ant-anchor-link-title" href="#components-anchor-demo-static" title="Static demo">Static demo</a>
|
||||
<!---->
|
||||
</div>
|
||||
<div class="ant-anchor-link"><a class="ant-anchor-link-title" href="#API" title="API">API</a>
|
||||
|
|
|
@ -41,6 +41,7 @@ export const AutoCompleteOption = Option;
|
|||
export const AutoCompleteOptGroup = OptGroup;
|
||||
|
||||
const AutoComplete = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AAutoComplete',
|
||||
inheritAttrs: false,
|
||||
props: autoCompleteProps(),
|
||||
|
|
|
@ -37,6 +37,7 @@ export const avatarProps = () => ({
|
|||
export type AvatarProps = Partial<ExtractPropTypes<ReturnType<typeof avatarProps>>>;
|
||||
|
||||
const Avatar = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AAvatar',
|
||||
inheritAttrs: false,
|
||||
props: avatarProps(),
|
||||
|
|
|
@ -27,6 +27,7 @@ export const groupProps = () => ({
|
|||
export type AvatarGroupProps = Partial<ExtractPropTypes<ReturnType<typeof groupProps>>>;
|
||||
|
||||
const Group = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AAvatarGroup',
|
||||
inheritAttrs: false,
|
||||
props: groupProps(),
|
||||
|
|
|
@ -20,37 +20,37 @@ exports[`renders ./components/avatar/demo/basic.vue correctly 1`] = `
|
|||
`;
|
||||
|
||||
exports[`renders ./components/avatar/demo/dynamic.vue correctly 1`] = `
|
||||
<span style="background-color: rgb(245, 106, 0); vertical-align: middle;" class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);">U</span></span>
|
||||
<span style="background-color: rgb(245, 106, 0); vertical-align: middle;" class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="opacity: 0;">U</span></span>
|
||||
<button style="margin-left: 16px; vertical-align: middle;" class="ant-btn ant-btn-sm" type="button">
|
||||
<!----><span>ๆน ๅ</span>
|
||||
</button>
|
||||
`;
|
||||
|
||||
exports[`renders ./components/avatar/demo/group.vue correctly 1`] = `
|
||||
<div class="ant-avatar-group"><span class="ant-avatar ant-avatar-circle ant-avatar-image"><img src="https://joeschmoe.io/api/v1/random"></span><span style="background-color: rgb(245, 106, 0);" class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);">K</span></span>
|
||||
<div class="ant-avatar-group"><span class="ant-avatar ant-avatar-circle ant-avatar-image"><img src="https://joeschmoe.io/api/v1/random"></span><span style="background-color: rgb(245, 106, 0);" class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="opacity: 0;">K</span></span>
|
||||
<!----><span style="background-color: rgb(135, 208, 104);" class="ant-avatar ant-avatar-circle ant-avatar-icon"><span role="img" aria-label="user" class="anticon anticon-user"><svg focusable="false" class="" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></span></span><span style="background-color: rgb(24, 144, 255);" class="ant-avatar ant-avatar-circle ant-avatar-icon"><span role="img" aria-label="user" class="anticon anticon-user"><svg focusable="false" class="" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></span></span>
|
||||
</div>
|
||||
<div class="ant-divider ant-divider-horizontal" role="separator">
|
||||
<!---->
|
||||
</div>
|
||||
<div class="ant-avatar-group"><span class="ant-avatar ant-avatar-circle ant-avatar-image"><img src="https://joeschmoe.io/api/v1/random"></span><span style="background-color: rgb(24, 144, 255);" class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);">K</span></span>
|
||||
<!----><span style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207);" class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);">+2</span></span>
|
||||
<div class="ant-avatar-group"><span class="ant-avatar ant-avatar-circle ant-avatar-image"><img src="https://joeschmoe.io/api/v1/random"></span><span style="background-color: rgb(24, 144, 255);" class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="opacity: 0;">K</span></span>
|
||||
<!----><span style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207);" class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="opacity: 0;">+2</span></span>
|
||||
</div>
|
||||
<div class="ant-divider ant-divider-horizontal" role="separator">
|
||||
<!---->
|
||||
</div>
|
||||
<div class="ant-avatar-group"><span class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-image"><img src="https://joeschmoe.io/api/v1/random"></span><span style="background-color: rgb(24, 144, 255);" class="ant-avatar ant-avatar-lg ant-avatar-circle"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);">K</span></span>
|
||||
<!----><span style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207);" class="ant-avatar ant-avatar-lg ant-avatar-circle"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);">+2</span></span>
|
||||
<div class="ant-avatar-group"><span class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-image"><img src="https://joeschmoe.io/api/v1/random"></span><span style="background-color: rgb(24, 144, 255);" class="ant-avatar ant-avatar-lg ant-avatar-circle"><span class="ant-avatar-string" style="opacity: 0;">K</span></span>
|
||||
<!----><span style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207);" class="ant-avatar ant-avatar-lg ant-avatar-circle"><span class="ant-avatar-string" style="opacity: 0;">+2</span></span>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`renders ./components/avatar/demo/responsive.vue correctly 1`] = `<span class="ant-avatar ant-avatar-circle ant-avatar-icon" style="width: 24px; height: 24px; line-height: 24px; font-size: 12px;"><span role="img" aria-label="ant-design" class="anticon anticon-ant-design"><svg focusable="false" class="" data-icon="ant-design" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M716.3 313.8c19-18.9 19-49.7 0-68.6l-69.9-69.9.1.1c-18.5-18.5-50.3-50.3-95.3-95.2-21.2-20.7-55.5-20.5-76.5.5L80.9 474.2a53.84 53.84 0 000 76.4L474.6 944a54.14 54.14 0 0076.5 0l165.1-165c19-18.9 19-49.7 0-68.6a48.7 48.7 0 00-68.7 0l-125 125.2c-5.2 5.2-13.3 5.2-18.5 0L189.5 521.4c-5.2-5.2-5.2-13.3 0-18.5l314.4-314.2c.4-.4.9-.7 1.3-1.1 5.2-4.1 12.4-3.7 17.2 1.1l125.2 125.1c19 19 49.8 19 68.7 0zM408.6 514.4a106.3 106.2 0 10212.6 0 106.3 106.2 0 10-212.6 0zm536.2-38.6L821.9 353.5c-19-18.9-49.8-18.9-68.7.1a48.4 48.4 0 000 68.6l83 82.9c5.2 5.2 5.2 13.3 0 18.5l-81.8 81.7a48.4 48.4 0 000 68.6 48.7 48.7 0 0068.7 0l121.8-121.7a53.93 53.93 0 00-.1-76.4z"></path></svg></span></span>`;
|
||||
exports[`renders ./components/avatar/demo/responsive.vue correctly 1`] = `<span class="ant-avatar ant-avatar-circle ant-avatar-icon"><span role="img" aria-label="ant-design" class="anticon anticon-ant-design"><svg focusable="false" class="" data-icon="ant-design" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M716.3 313.8c19-18.9 19-49.7 0-68.6l-69.9-69.9.1.1c-18.5-18.5-50.3-50.3-95.3-95.2-21.2-20.7-55.5-20.5-76.5.5L80.9 474.2a53.84 53.84 0 000 76.4L474.6 944a54.14 54.14 0 0076.5 0l165.1-165c19-18.9 19-49.7 0-68.6a48.7 48.7 0 00-68.7 0l-125 125.2c-5.2 5.2-13.3 5.2-18.5 0L189.5 521.4c-5.2-5.2-5.2-13.3 0-18.5l314.4-314.2c.4-.4.9-.7 1.3-1.1 5.2-4.1 12.4-3.7 17.2 1.1l125.2 125.1c19 19 49.8 19 68.7 0zM408.6 514.4a106.3 106.2 0 10212.6 0 106.3 106.2 0 10-212.6 0zm536.2-38.6L821.9 353.5c-19-18.9-49.8-18.9-68.7.1a48.4 48.4 0 000 68.6l83 82.9c5.2 5.2 5.2 13.3 0 18.5l-81.8 81.7a48.4 48.4 0 000 68.6 48.7 48.7 0 0068.7 0l121.8-121.7a53.93 53.93 0 00-.1-76.4z"></path></svg></span></span>`;
|
||||
|
||||
exports[`renders ./components/avatar/demo/type.vue correctly 1`] = `
|
||||
<span class="ant-avatar ant-avatar-circle ant-avatar-icon"><span role="img" aria-label="user" class="anticon anticon-user"><svg focusable="false" class="" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></span></span>
|
||||
<span class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);">U</span></span>
|
||||
<span class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);">USER</span></span>
|
||||
<span class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="opacity: 0;">U</span></span>
|
||||
<span class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="opacity: 0;">USER</span></span>
|
||||
<span class="ant-avatar ant-avatar-circle ant-avatar-image"><img src="https://joeschmoe.io/api/v1/random"></span>
|
||||
<span style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207);" class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);">U</span></span>
|
||||
<span style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207);" class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="opacity: 0;">U</span></span>
|
||||
<span style="background-color: rgb(135, 208, 104);" class="ant-avatar ant-avatar-circle ant-avatar-icon"><span role="img" aria-label="user" class="anticon anticon-user"><svg focusable="false" class="" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></span></span>
|
||||
`;
|
||||
|
|
|
@ -14,7 +14,7 @@ Avatars can be used to represent people or objects. It supports images, `Icon`s,
|
|||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| alt | This attribute defines the alternative text describing the image | string | - | |
|
||||
| crossOrigin | CORS settings attributes | `'anonymous'` \| `'use-credentials'` \| `''` | - | 3.0 |
|
||||
| crossOrigin | cors settings attributes | `'anonymous'` \| `'use-credentials'` \| `''` | - | 3.0 |
|
||||
| draggable | Whether the picture is allowed to be dragged | boolean \| `'true'` \| `'false'` | - | 2.2.0 |
|
||||
| gap | Letter type unit distance between left and right sides | number | 4 | 2.2.0 |
|
||||
| icon | the `Icon` type for an icon avatar, see `Icon` Component | VNode \| slot | - | |
|
||||
|
|
|
@ -19,7 +19,7 @@ cover: https://gw.alipayobjects.com/zos/antfincdn/aBcnbw68hP/Avatar.svg
|
|||
| ๅๆฐ | ่ฏดๆ | ็ฑปๅ | ้ป่ฎคๅผ | ็ๆฌ |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| alt | ๅพๅๆ ๆณๆพ็คบๆถ็ๆฟไปฃๆๆฌ | string | - | |
|
||||
| crossOrigin | CORS ๅฑๆง่ฎพ็ฝฎ | `'anonymous'` \| `'use-credentials'` \| `''` | - | 3.0 |
|
||||
| crossOrigin | cors ๅฑๆง่ฎพ็ฝฎ | `'anonymous'` \| `'use-credentials'` \| `''` | - | 3.0 |
|
||||
| draggable | ๅพ็ๆฏๅฆๅ
่ฎธๆๅจ | boolean \| `'true'` \| `'false'` | - | 2.2.0 |
|
||||
| gap | ๅญ็ฌฆ็ฑปๅ่ท็ฆปๅทฆๅณไธคไพง่พน็ๅไฝๅ็ด | number | 4 | 2.2.0 |
|
||||
| icon | ่ฎพ็ฝฎๅคดๅ็ๅพๆ ็ฑปๅ๏ผๅฏ่ฎพไธบ Icon ็ `type` ๆ VNode | VNode \| slot | - | |
|
||||
|
|
|
@ -32,6 +32,7 @@ export const backTopProps = () => ({
|
|||
export type BackTopProps = Partial<ExtractPropTypes<typeof backTopProps>>;
|
||||
|
||||
const BackTop = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ABackTop',
|
||||
inheritAttrs: false,
|
||||
props: backTopProps(),
|
||||
|
|
|
@ -34,6 +34,7 @@ export const badgeProps = () => ({
|
|||
export type BadgeProps = Partial<ExtractPropTypes<ReturnType<typeof badgeProps>>>;
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ABadge',
|
||||
Ribbon,
|
||||
inheritAttrs: false,
|
||||
|
|
|
@ -16,6 +16,7 @@ export const ribbonProps = () => ({
|
|||
export type RibbonProps = Partial<ExtractPropTypes<ReturnType<typeof ribbonProps>>>;
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ABadgeRibbon',
|
||||
inheritAttrs: false,
|
||||
props: ribbonProps(),
|
||||
|
|
|
@ -18,6 +18,7 @@ const scrollNumberProps = {
|
|||
export type ScrollNumberProps = Partial<ExtractPropTypes<typeof scrollNumberProps>>;
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ScrollNumber',
|
||||
inheritAttrs: false,
|
||||
props: scrollNumberProps,
|
||||
|
|
|
@ -45,6 +45,7 @@ function getOffset(start: number, end: number, unit: -1 | 1) {
|
|||
}
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'SingleNumber',
|
||||
props: {
|
||||
prefixCls: String,
|
||||
|
|
|
@ -1,16 +1,16 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`renders ./components/badge/demo/basic.vue correctly 1`] = `
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count" title="5"><span class="ant-scroll-number-only" style="transition: none;"><p class="ant-scroll-number-only-unit current">5</p></span></sup>
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="opacity: 0;"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count" title="5"><span class="ant-scroll-number-only" style="transition: none;"><p class="ant-scroll-number-only-unit current">5</p></span></sup>
|
||||
<!----></span>
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count" title="0"><span class="ant-scroll-number-only" style="transition: none;"><p class="ant-scroll-number-only-unit current">0</p></span></sup>
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="opacity: 0;"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count" title="0"><span class="ant-scroll-number-only" style="transition: none;"><p class="ant-scroll-number-only-unit current">0</p></span></sup>
|
||||
<!----></span>
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);"><!----></span></span><span role="img" aria-label="clock-circle" style="color: rgb(245, 34, 45);" class="anticon anticon-clock-circle ant-scroll-number-custom-component"><svg focusable="false" class="" data-icon="clock-circle" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"></path><path d="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></span>
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="opacity: 0;"><!----></span></span><span role="img" aria-label="clock-circle" style="color: rgb(245, 34, 45);" class="anticon anticon-clock-circle ant-scroll-number-custom-component"><svg focusable="false" class="" data-icon="clock-circle" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"></path><path d="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></span>
|
||||
<!----></span>
|
||||
`;
|
||||
|
||||
exports[`renders ./components/badge/demo/change.vue correctly 1`] = `
|
||||
<div><span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count" title="5"><span class="ant-scroll-number-only" style="transition: none;"><p class="ant-scroll-number-only-unit current">5</p></span></sup>
|
||||
<div><span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="opacity: 0;"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count" title="5"><span class="ant-scroll-number-only" style="transition: none;"><p class="ant-scroll-number-only-unit current">5</p></span></sup>
|
||||
<!----></span>
|
||||
<div class="ant-btn-group"><button class="ant-btn" type="button">
|
||||
<!----><span role="img" aria-label="minus" class="anticon anticon-minus"><svg focusable="false" class="" data-icon="minus" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M872 474H152c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h720c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8z"></path></svg></span>
|
||||
|
@ -21,7 +21,7 @@ exports[`renders ./components/badge/demo/change.vue correctly 1`] = `
|
|||
<div class="ant-divider ant-divider-horizontal" role="separator">
|
||||
<!---->
|
||||
</div>
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-dot"></sup>
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="opacity: 0;"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-dot"></sup>
|
||||
<!----></span>
|
||||
<button type="button" role="switch" aria-checked="true" class="ant-switch-checked ant-switch">
|
||||
<div class="ant-switch-handle">
|
||||
|
@ -64,7 +64,7 @@ exports[`renders ./components/badge/demo/dot.vue correctly 1`] = `
|
|||
`;
|
||||
|
||||
exports[`renders ./components/badge/demo/link.vue correctly 1`] = `
|
||||
<a href="#"><span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count" title="5"><span class="ant-scroll-number-only" style="transition: none;"><p class="ant-scroll-number-only-unit current">5</p></span></sup>
|
||||
<a href="#"><span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="opacity: 0;"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count" title="5"><span class="ant-scroll-number-only" style="transition: none;"><p class="ant-scroll-number-only-unit current">5</p></span></sup>
|
||||
<!----></span>
|
||||
</a>
|
||||
`;
|
||||
|
@ -78,13 +78,13 @@ exports[`renders ./components/badge/demo/no-wrapper.vue correctly 1`] = `
|
|||
`;
|
||||
|
||||
exports[`renders ./components/badge/demo/overflow.vue correctly 1`] = `
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count ant-badge-multiple-words" title="99"><span class="ant-scroll-number-only" style="transition: none;"><p class="ant-scroll-number-only-unit current">9</p></span><span class="ant-scroll-number-only" style="transition: none;"><p class="ant-scroll-number-only-unit current">9</p></span></sup>
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="opacity: 0;"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count ant-badge-multiple-words" title="99"><span class="ant-scroll-number-only" style="transition: none;"><p class="ant-scroll-number-only-unit current">9</p></span><span class="ant-scroll-number-only" style="transition: none;"><p class="ant-scroll-number-only-unit current">9</p></span></sup>
|
||||
<!----></span>
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count ant-badge-multiple-words" title="100">99+</sup>
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="opacity: 0;"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count ant-badge-multiple-words" title="100">99+</sup>
|
||||
<!----></span>
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count ant-badge-multiple-words" title="99">10+</sup>
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="opacity: 0;"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count ant-badge-multiple-words" title="99">10+</sup>
|
||||
<!----></span>
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count ant-badge-multiple-words" title="1000">999+</sup>
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="opacity: 0;"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count ant-badge-multiple-words" title="1000">999+</sup>
|
||||
<!----></span>
|
||||
`;
|
||||
|
||||
|
@ -246,6 +246,6 @@ exports[`renders ./components/badge/demo/status.vue correctly 1`] = `
|
|||
`;
|
||||
|
||||
exports[`renders ./components/badge/demo/title.vue correctly 1`] = `
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count" title="Custom hover text"><span class="ant-scroll-number-only" style="transition: none;"><p class="ant-scroll-number-only-unit current">5</p></span></sup>
|
||||
<span class="ant-badge"><span class="ant-avatar ant-avatar-lg ant-avatar-square"><span class="ant-avatar-string" style="opacity: 0;"><!----></span></span><sup data-show="true" class="ant-scroll-number ant-badge-count" title="Custom hover text"><span class="ant-scroll-number-only" style="transition: none;"><p class="ant-scroll-number-only-unit current">5</p></span></sup>
|
||||
<!----></span>
|
||||
`;
|
||||
|
|
|
@ -52,6 +52,7 @@ function defaultItemRender(opt: {
|
|||
}
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ABreadcrumb',
|
||||
props: breadcrumbProps(),
|
||||
slots: ['separator', 'itemRender'],
|
||||
|
|
|
@ -17,6 +17,7 @@ export const breadcrumbItemProps = () => ({
|
|||
|
||||
export type BreadcrumbItemProps = Partial<ExtractPropTypes<ReturnType<typeof breadcrumbItemProps>>>;
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ABreadcrumbItem',
|
||||
inheritAttrs: false,
|
||||
__ANT_BREADCRUMB_ITEM: true,
|
||||
|
|
|
@ -11,6 +11,7 @@ export type BreadcrumbSeparatorProps = Partial<
|
|||
>;
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ABreadcrumbSeparator',
|
||||
__ANT_BREADCRUMB_SEPARATOR: true,
|
||||
inheritAttrs: false,
|
||||
|
|
|
@ -25,6 +25,7 @@ const resetStyle = (node: HTMLSpanElement) => {
|
|||
}
|
||||
};
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'LoadingIcon',
|
||||
props: {
|
||||
prefixCls: String,
|
||||
|
|
|
@ -19,6 +19,7 @@ export const GroupSizeContext = createContext<{
|
|||
size: ComputedRef<SizeType>;
|
||||
}>();
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AButtonGroup',
|
||||
props: buttonGroupProps(),
|
||||
setup(props, { slots }) {
|
||||
|
|
|
@ -30,6 +30,7 @@ function isUnBorderedButtonType(type: ButtonType | undefined) {
|
|||
}
|
||||
export { buttonProps };
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AButton',
|
||||
inheritAttrs: false,
|
||||
__ANT_BUTTON: true,
|
||||
|
|
|
@ -49,6 +49,7 @@ export const cardProps = () => ({
|
|||
export type CardProps = Partial<ExtractPropTypes<ReturnType<typeof cardProps>>>;
|
||||
|
||||
const Card = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ACard',
|
||||
props: cardProps(),
|
||||
slots: ['title', 'extra', 'tabBarExtraContent', 'actions', 'cover', 'customTab'],
|
||||
|
|
|
@ -8,6 +8,7 @@ export const cardGridProps = () => ({
|
|||
});
|
||||
export type CardGridProps = Partial<ExtractPropTypes<ReturnType<typeof cardGridProps>>>;
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ACardGrid',
|
||||
__ANT_CARD_GRID: true,
|
||||
props: cardGridProps(),
|
||||
|
|
|
@ -12,6 +12,7 @@ export const cardMetaProps = () => ({
|
|||
});
|
||||
export type CardGridProps = Partial<ExtractPropTypes<ReturnType<typeof cardMetaProps>>>;
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ACardMeta',
|
||||
props: cardMetaProps(),
|
||||
slots: ['title', 'description', 'avatar'],
|
||||
|
|
|
@ -302,11 +302,11 @@ exports[`renders ./components/card/demo/tabs.vue correctly 1`] = `
|
|||
<div class="ant-tabs-nav-wrap">
|
||||
<div class="ant-tabs-nav-list" style="transform: translate(0px, 0px);">
|
||||
<div class="ant-tabs-tab ant-tabs-tab-active">
|
||||
<div role="tab" aria-selected="true" class="ant-tabs-tab-btn" tabindex="0" id="rc-tabs-test-tab-tab1" aria-controls="rc-tabs-test-panel-tab1"><span><span role="img" aria-label="home" class="anticon anticon-home"><svg focusable="false" class="" data-icon="home" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M946.5 505L560.1 118.8l-25.9-25.9a31.5 31.5 0 00-44.4 0L77.5 505a63.9 63.9 0 00-18.8 46c.4 35.2 29.7 63.3 64.9 63.3h42.5V940h691.8V614.3h43.4c17.1 0 33.2-6.7 45.3-18.8a63.6 63.6 0 0018.7-45.3c0-17-6.7-33.1-18.8-45.2zM568 868H456V664h112v204zm217.9-325.7V868H632V640c0-22.1-17.9-40-40-40H432c-22.1 0-40 17.9-40 40v228H238.1V542.3h-96l370-369.7 23.1 23.1L882 542.3h-96.1z"></path></svg></span> tab1</span></div>
|
||||
<div role="tab" aria-selected="true" class="ant-tabs-tab-btn" tabindex="0"><span><span role="img" aria-label="home" class="anticon anticon-home"><svg focusable="false" class="" data-icon="home" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M946.5 505L560.1 118.8l-25.9-25.9a31.5 31.5 0 00-44.4 0L77.5 505a63.9 63.9 0 00-18.8 46c.4 35.2 29.7 63.3 64.9 63.3h42.5V940h691.8V614.3h43.4c17.1 0 33.2-6.7 45.3-18.8a63.6 63.6 0 0018.7-45.3c0-17-6.7-33.1-18.8-45.2zM568 868H456V664h112v204zm217.9-325.7V868H632V640c0-22.1-17.9-40-40-40H432c-22.1 0-40 17.9-40 40v228H238.1V542.3h-96l370-369.7 23.1 23.1L882 542.3h-96.1z"></path></svg></span> tab1</span></div>
|
||||
<!---->
|
||||
</div>
|
||||
<div class="ant-tabs-tab">
|
||||
<div role="tab" aria-selected="false" class="ant-tabs-tab-btn" tabindex="0" id="rc-tabs-test-tab-tab2" aria-controls="rc-tabs-test-panel-tab2">tab2</div>
|
||||
<div role="tab" aria-selected="false" class="ant-tabs-tab-btn" tabindex="0">tab2</div>
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
|
@ -314,7 +314,7 @@ exports[`renders ./components/card/demo/tabs.vue correctly 1`] = `
|
|||
</div>
|
||||
</div>
|
||||
<div class="ant-tabs-nav-operations ant-tabs-nav-operations-hidden">
|
||||
<!----><button type="button" class="ant-tabs-nav-more" style="visibility: hidden; order: 1;" tabindex="-1" aria-hidden="true" aria-haspopup="listbox" aria-controls="rc-tabs-test-more-popup" id="rc-tabs-test-more" aria-expanded="false"><span role="img" aria-label="ellipsis" class="anticon anticon-ellipsis"><svg focusable="false" class="" data-icon="ellipsis" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M176 511a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0z"></path></svg></span></button>
|
||||
<!----><button type="button" class="ant-tabs-nav-more" style="visibility: hidden; order: 1;" tabindex="-1" aria-hidden="true" aria-haspopup="listbox" aria-controls="null-more-popup" id="null-more" aria-expanded="false"><span role="img" aria-label="ellipsis" class="anticon anticon-ellipsis"><svg focusable="false" class="" data-icon="ellipsis" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M176 511a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0z"></path></svg></span></button>
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
|
@ -322,10 +322,10 @@ exports[`renders ./components/card/demo/tabs.vue correctly 1`] = `
|
|||
</div>
|
||||
<div class="ant-tabs-content-holder">
|
||||
<div class="ant-tabs-content ant-tabs-content-top">
|
||||
<div role="tabpanel" tabindex="0" aria-hidden="false" class="ant-tabs-tabpane ant-tabs-tabpane-active" id="rc-tabs-test-panel-tab1" aria-labelledby="rc-tabs-test-tab-tab1">
|
||||
<div role="tabpanel" tabindex="0" aria-hidden="false" class="ant-tabs-tabpane ant-tabs-tabpane-active">
|
||||
<!---->
|
||||
</div>
|
||||
<div role="tabpanel" tabindex="-1" aria-hidden="true" style="display: none;" class="ant-tabs-tabpane" id="rc-tabs-test-panel-tab2" aria-labelledby="rc-tabs-test-tab-tab2">
|
||||
<div role="tabpanel" tabindex="-1" aria-hidden="true" style="display: none;" class="ant-tabs-tabpane">
|
||||
<!---->
|
||||
</div>
|
||||
</div>
|
||||
|
@ -350,15 +350,15 @@ exports[`renders ./components/card/demo/tabs.vue correctly 1`] = `
|
|||
<div class="ant-tabs-nav-wrap">
|
||||
<div class="ant-tabs-nav-list" style="transform: translate(0px, 0px);">
|
||||
<div class="ant-tabs-tab">
|
||||
<div role="tab" aria-selected="false" class="ant-tabs-tab-btn" tabindex="0" id="rc-tabs-test-tab-article" aria-controls="rc-tabs-test-panel-article">article</div>
|
||||
<div role="tab" aria-selected="false" class="ant-tabs-tab-btn" tabindex="0">article</div>
|
||||
<!---->
|
||||
</div>
|
||||
<div class="ant-tabs-tab ant-tabs-tab-active">
|
||||
<div role="tab" aria-selected="true" class="ant-tabs-tab-btn" tabindex="0" id="rc-tabs-test-tab-app" aria-controls="rc-tabs-test-panel-app">app</div>
|
||||
<div role="tab" aria-selected="true" class="ant-tabs-tab-btn" tabindex="0">app</div>
|
||||
<!---->
|
||||
</div>
|
||||
<div class="ant-tabs-tab">
|
||||
<div role="tab" aria-selected="false" class="ant-tabs-tab-btn" tabindex="0" id="rc-tabs-test-tab-project" aria-controls="rc-tabs-test-panel-project">project</div>
|
||||
<div role="tab" aria-selected="false" class="ant-tabs-tab-btn" tabindex="0">project</div>
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
|
@ -366,7 +366,7 @@ exports[`renders ./components/card/demo/tabs.vue correctly 1`] = `
|
|||
</div>
|
||||
</div>
|
||||
<div class="ant-tabs-nav-operations ant-tabs-nav-operations-hidden">
|
||||
<!----><button type="button" class="ant-tabs-nav-more" style="visibility: hidden; order: 1;" tabindex="-1" aria-hidden="true" aria-haspopup="listbox" aria-controls="rc-tabs-test-more-popup" id="rc-tabs-test-more" aria-expanded="false"><span role="img" aria-label="ellipsis" class="anticon anticon-ellipsis"><svg focusable="false" class="" data-icon="ellipsis" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M176 511a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0z"></path></svg></span></button>
|
||||
<!----><button type="button" class="ant-tabs-nav-more" style="visibility: hidden; order: 1;" tabindex="-1" aria-hidden="true" aria-haspopup="listbox" aria-controls="null-more-popup" id="null-more" aria-expanded="false"><span role="img" aria-label="ellipsis" class="anticon anticon-ellipsis"><svg focusable="false" class="" data-icon="ellipsis" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M176 511a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0z"></path></svg></span></button>
|
||||
<!---->
|
||||
</div>
|
||||
<div class="ant-tabs-extra-content"><a href="#">More</a></div>
|
||||
|
@ -374,13 +374,13 @@ exports[`renders ./components/card/demo/tabs.vue correctly 1`] = `
|
|||
</div>
|
||||
<div class="ant-tabs-content-holder">
|
||||
<div class="ant-tabs-content ant-tabs-content-top">
|
||||
<div role="tabpanel" tabindex="-1" aria-hidden="true" style="display: none;" class="ant-tabs-tabpane" id="rc-tabs-test-panel-article" aria-labelledby="rc-tabs-test-tab-article">
|
||||
<div role="tabpanel" tabindex="-1" aria-hidden="true" style="display: none;" class="ant-tabs-tabpane">
|
||||
<!---->
|
||||
</div>
|
||||
<div role="tabpanel" tabindex="0" aria-hidden="false" class="ant-tabs-tabpane ant-tabs-tabpane-active" id="rc-tabs-test-panel-app" aria-labelledby="rc-tabs-test-tab-app">
|
||||
<div role="tabpanel" tabindex="0" aria-hidden="false" class="ant-tabs-tabpane ant-tabs-tabpane-active">
|
||||
<!---->
|
||||
</div>
|
||||
<div role="tabpanel" tabindex="-1" aria-hidden="true" style="display: none;" class="ant-tabs-tabpane" id="rc-tabs-test-panel-project" aria-labelledby="rc-tabs-test-tab-project">
|
||||
<div role="tabpanel" tabindex="-1" aria-hidden="true" style="display: none;" class="ant-tabs-tabpane">
|
||||
<!---->
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -5,64 +5,64 @@ exports[`renders ./components/carousel/demo/autoplay.vue correctly 1`] = `
|
|||
<div class="slick-slider slick-initialized" dir="ltr">
|
||||
<!---->
|
||||
<div class="slick-list">
|
||||
<div class="slick-track" style="opacity: 1; transform: translate3d(0px, 0px, 0px);">
|
||||
<div class="slick-slide slick-cloned" tabindex="-1" data-index="-1" aria-hidden="true" style="width: 0px;">
|
||||
<div class="slick-track" style="width: 900%;">
|
||||
<div class="slick-slide slick-cloned" tabindex="-1" data-index="-1" aria-hidden="true" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>4</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="0" aria-hidden="false" class="slick-slide slick-active slick-current" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="0" aria-hidden="false" class="slick-slide slick-active slick-current" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>1</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>2</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>3</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>4</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>1</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>2</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>3</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>4</h3>
|
||||
|
@ -87,64 +87,64 @@ exports[`renders ./components/carousel/demo/basic.vue correctly 1`] = `
|
|||
<div class="slick-slider slick-initialized" dir="ltr">
|
||||
<!---->
|
||||
<div class="slick-list">
|
||||
<div class="slick-track" style="opacity: 1; transform: translate3d(0px, 0px, 0px);">
|
||||
<div class="slick-slide slick-cloned" tabindex="-1" data-index="-1" aria-hidden="true" style="width: 0px;">
|
||||
<div class="slick-track" style="width: 900%;">
|
||||
<div class="slick-slide slick-cloned" tabindex="-1" data-index="-1" aria-hidden="true" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>4</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="0" aria-hidden="false" class="slick-slide slick-active slick-current" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="0" aria-hidden="false" class="slick-slide slick-active slick-current" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>1</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>2</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>3</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>4</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>1</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>2</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>3</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>4</h3>
|
||||
|
@ -169,64 +169,64 @@ exports[`renders ./components/carousel/demo/customArrows.vue correctly 1`] = `
|
|||
<div class="slick-slider slick-initialized" dir="ltr">
|
||||
<div class="custom-slick-arrow slick-arrow slick-prev" style="left: 10px; z-index: 1; display: block;"><span role="img" aria-label="left-circle" class="anticon anticon-left-circle"><svg focusable="false" class="" data-icon="left-circle" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M603.3 327.5l-246 178a7.95 7.95 0 000 12.9l246 178c5.3 3.8 12.7 0 12.7-6.5V643c0-10.2-4.9-19.9-13.2-25.9L457.4 512l145.4-105.2c8.3-6 13.2-15.6 13.2-25.9V334c0-6.5-7.4-10.3-12.7-6.5z"></path><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"></path></svg></span></div>
|
||||
<div class="slick-list">
|
||||
<div class="slick-track" style="opacity: 1; transform: translate3d(0px, 0px, 0px);">
|
||||
<div class="slick-slide slick-cloned" tabindex="-1" data-index="-1" aria-hidden="true" style="width: 0px;">
|
||||
<div class="slick-track" style="width: 900%;">
|
||||
<div class="slick-slide slick-cloned" tabindex="-1" data-index="-1" aria-hidden="true" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>4</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="0" aria-hidden="false" class="slick-slide slick-active slick-current" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="0" aria-hidden="false" class="slick-slide slick-active slick-current" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>1</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>2</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>3</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>4</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>1</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>2</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>3</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>4</h3>
|
||||
|
@ -250,48 +250,48 @@ exports[`renders ./components/carousel/demo/customPaging.vue correctly 1`] = `
|
|||
<div class="ant-carousel">
|
||||
<div class="slick-slider slick-initialized" dir="ltr"><button type="button" data-role="none" class="slick-arrow slick-prev" style="display: block;"> Previous</button>
|
||||
<div class="slick-list">
|
||||
<div class="slick-track" style="opacity: 1; transform: translate3d(0px, 0px, 0px);">
|
||||
<div class="slick-slide slick-cloned" tabindex="-1" data-index="-1" aria-hidden="true" style="width: 0px;">
|
||||
<div class="slick-track" style="width: 900%;">
|
||||
<div class="slick-slide slick-cloned" tabindex="-1" data-index="-1" aria-hidden="true" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/main/components/carousel/demo/abstract04.jpg"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="0" aria-hidden="false" class="slick-slide slick-active slick-current" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="0" aria-hidden="false" class="slick-slide slick-active slick-current" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/main/components/carousel/demo/abstract01.jpg"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/main/components/carousel/demo/abstract02.jpg"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/main/components/carousel/demo/abstract03.jpg"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/main/components/carousel/demo/abstract04.jpg"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/main/components/carousel/demo/abstract01.jpg"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/main/components/carousel/demo/abstract02.jpg"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/main/components/carousel/demo/abstract03.jpg"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/main/components/carousel/demo/abstract04.jpg"></div>
|
||||
</div>
|
||||
|
@ -313,29 +313,29 @@ exports[`renders ./components/carousel/demo/fade.vue correctly 1`] = `
|
|||
<div class="slick-slider slick-initialized" dir="ltr">
|
||||
<!---->
|
||||
<div class="slick-list">
|
||||
<div class="slick-track" style="opacity: 1;">
|
||||
<div tabindex="-1" data-index="0" aria-hidden="false" class="slick-slide slick-active slick-current" style="outline: none; width: 0px; position: relative; left: 0px; opacity: 1; transition: opacity 500ms ease, visibility 500ms ease;">
|
||||
<div class="slick-track" style="width: 900%;">
|
||||
<div tabindex="-1" data-index="0" aria-hidden="false" class="slick-slide slick-active slick-current" style="outline: none; width: 11.11111111111111%; position: relative; left: 0px; opacity: 1; transition: opacity 500ms ease, visibility 500ms ease;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>1</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px; position: relative; left: 0px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;">
|
||||
<div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%; position: relative; left: -11px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>2</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px; position: relative; left: 0px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;">
|
||||
<div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%; position: relative; left: -22px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>3</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px; position: relative; left: 0px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;">
|
||||
<div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%; position: relative; left: -33px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>4</h3>
|
||||
|
@ -361,64 +361,64 @@ exports[`renders ./components/carousel/demo/position.vue correctly 1`] = `
|
|||
<div class="slick-slider slick-initialized" dir="ltr">
|
||||
<!---->
|
||||
<div class="slick-list">
|
||||
<div class="slick-track" style="opacity: 1; transform: translate3d(0px, 0px, 0px);">
|
||||
<div class="slick-slide slick-cloned" tabindex="-1" data-index="-1" aria-hidden="true" style="width: 0px;">
|
||||
<div class="slick-track" style="width: 900%;">
|
||||
<div class="slick-slide slick-cloned" tabindex="-1" data-index="-1" aria-hidden="true" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>4</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="0" aria-hidden="false" class="slick-slide slick-active slick-current" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="0" aria-hidden="false" class="slick-slide slick-active slick-current" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>1</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>2</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>3</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
|
||||
<div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>4</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>1</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>2</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>3</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
|
||||
<div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
|
||||
<div>
|
||||
<div tabindex="-1" style="width: 100%; display: inline-block;">
|
||||
<h3>4</h3>
|
||||
|
|
|
@ -70,6 +70,7 @@ export const carouselProps = () => ({
|
|||
});
|
||||
export type CarouselProps = Partial<ExtractPropTypes<ReturnType<typeof carouselProps>>>;
|
||||
const Carousel = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ACarousel',
|
||||
inheritAttrs: false,
|
||||
props: carouselProps(),
|
||||
|
|
|
@ -197,3 +197,21 @@ exports[`renders ./components/cascader/demo/suffix.vue correctly 1`] = `
|
|||
<!---->
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`renders ./components/cascader/demo/tagRender.vue correctly 1`] = `
|
||||
<div suffixicon="Shopping Around" class="ant-select ant-cascader ant-select-multiple ant-select-allow-clear">
|
||||
<!---->
|
||||
<!---->
|
||||
<div class="ant-select-selector">
|
||||
<div class="ant-select-selection-overflow">
|
||||
<!---->
|
||||
<div class="ant-select-selection-overflow-item ant-select-selection-overflow-item-suffix" style="opacity: 1;">
|
||||
<div class="ant-select-selection-search" style="width: 0px;"><input type="search" id="rc_select_TEST_OR_SSR" autocomplete="off" class="ant-select-selection-search-input" role="combobox" aria-haspopup="listbox" aria-owns="rc_select_TEST_OR_SSR_list" aria-autocomplete="list" aria-controls="rc_select_TEST_OR_SSR_list" readonly="" unselectable="on" style="opacity: 0;"><span class="ant-select-selection-search-mirror" aria-hidden="true"> </span></div>
|
||||
</div>
|
||||
<!---->
|
||||
</div><span class="ant-select-selection-placeholder">Please select</span>
|
||||
</div>
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
`;
|
||||
|
|
|
@ -12,6 +12,7 @@
|
|||
<fields-name />
|
||||
<suffix />
|
||||
<multipleVue />
|
||||
<tagRender />
|
||||
</demo-sort>
|
||||
</template>
|
||||
<script>
|
||||
|
@ -27,6 +28,7 @@ import Size from './size.vue';
|
|||
import FieldsName from './fields-name.vue';
|
||||
import Suffix from './suffix.vue';
|
||||
import multipleVue from './multiple.vue';
|
||||
import tagRender from './tagRender.vue';
|
||||
|
||||
import CN from '../index.zh-CN.md';
|
||||
import US from '../index.en-US.md';
|
||||
|
@ -47,6 +49,7 @@ export default defineComponent({
|
|||
FieldsName,
|
||||
Suffix,
|
||||
multipleVue,
|
||||
tagRender,
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
|
|
@ -0,0 +1,91 @@
|
|||
<docs>
|
||||
---
|
||||
order: 10
|
||||
title:
|
||||
zh-CN: ่ชๅฎไน tag ๅ
ๅฎน
|
||||
en-US: The custom tag
|
||||
---
|
||||
|
||||
</docs>
|
||||
|
||||
<template>
|
||||
<a-cascader
|
||||
v-model:value="value"
|
||||
multiple
|
||||
:options="options"
|
||||
placeholder="Please select"
|
||||
suffix-icon="Shopping Around"
|
||||
>
|
||||
<template #tagRender="data">
|
||||
<a-tag :key="data.value" color="blue">{{ data.label }}</a-tag>
|
||||
</template>
|
||||
</a-cascader>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent, ref } from 'vue';
|
||||
import type { CascaderProps } from 'ant-design-vue';
|
||||
const options: CascaderProps['options'] = [
|
||||
{
|
||||
value: 'zhejiang',
|
||||
label: 'Zhejiang',
|
||||
children: [
|
||||
{
|
||||
value: 'freezeKey',
|
||||
label: 'freeze',
|
||||
children: [
|
||||
{
|
||||
value: 'key1',
|
||||
label: 'salmon',
|
||||
},
|
||||
{
|
||||
value: 'key2',
|
||||
label: 'beef',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
value: 'fruitsKey',
|
||||
label: 'fruits',
|
||||
children: [
|
||||
{
|
||||
value: 'key11',
|
||||
label: 'apple',
|
||||
},
|
||||
{
|
||||
value: 'key22',
|
||||
label: 'banana',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
value: 'Chinese delicious food',
|
||||
label: 'ไธญๅฝ็พ้ฃ',
|
||||
children: [
|
||||
{
|
||||
value: 'key3',
|
||||
label: 'ๆ้ฅผ',
|
||||
children: [
|
||||
{
|
||||
value: 'key4',
|
||||
label: '่้ป้ฆ
',
|
||||
},
|
||||
{
|
||||
value: 'key5',
|
||||
label: 'ไบไป้ฆ
',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
return {
|
||||
value: ref<string[]>([]),
|
||||
options,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
|
@ -120,6 +120,7 @@ export interface CascaderRef {
|
|||
}
|
||||
|
||||
const Cascader = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ACascader',
|
||||
inheritAttrs: false,
|
||||
props: initDefaultProps(cascaderProps(), {
|
||||
|
@ -298,6 +299,7 @@ const Cascader = defineComponent({
|
|||
...slots,
|
||||
checkable: () => <span class={`${cascaderPrefixCls.value}-checkbox-inner`} />,
|
||||
}}
|
||||
tagRender={props.tagRender || slots.tagRender}
|
||||
displayRender={props.displayRender || slots.displayRender}
|
||||
maxTagPlaceholder={props.maxTagPlaceholder || slots.maxTagPlaceholder}
|
||||
showArrow={formItemInputContext.hasFeedback || props.showArrow}
|
||||
|
|
|
@ -12,6 +12,7 @@ import type { CheckboxChangeEvent, CheckboxProps } from './interface';
|
|||
import { CheckboxGroupContextKey, checkboxProps } from './interface';
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ACheckbox',
|
||||
inheritAttrs: false,
|
||||
__ANT_CHECKBOX: true,
|
||||
|
|
|
@ -6,6 +6,7 @@ import type { CheckboxOptionType } from './interface';
|
|||
import { CheckboxGroupContextKey, checkboxGroupProps } from './interface';
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ACheckboxGroup',
|
||||
props: checkboxGroupProps(),
|
||||
// emits: ['change', 'update:value'],
|
||||
|
|
|
@ -31,6 +31,7 @@ function getActiveKeysArray(activeKey: Key | Key[]) {
|
|||
export { collapseProps };
|
||||
export type CollapseProps = Partial<ExtractPropTypes<ReturnType<typeof collapseProps>>>;
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ACollapse',
|
||||
inheritAttrs: false,
|
||||
props: initDefaultProps(collapseProps(), {
|
||||
|
|
|
@ -11,6 +11,7 @@ import useConfigInject from '../_util/hooks/useConfigInject';
|
|||
export { collapsePanelProps };
|
||||
export type CollapsePanelProps = Partial<ExtractPropTypes<ReturnType<typeof collapsePanelProps>>>;
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ACollapsePanel',
|
||||
inheritAttrs: false,
|
||||
props: initDefaultProps(collapsePanelProps(), {
|
||||
|
|
|
@ -3,6 +3,7 @@ import { collapsePanelProps } from './commonProps';
|
|||
import classNames from '../_util/classNames';
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'PanelContent',
|
||||
props: collapsePanelProps(),
|
||||
setup(props, { slots }) {
|
||||
|
|
|
@ -22,6 +22,7 @@ export const commentProps = () => ({
|
|||
export type CommentProps = Partial<ExtractPropTypes<ReturnType<typeof commentProps>>>;
|
||||
|
||||
const Comment = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AComment',
|
||||
props: commentProps(),
|
||||
slots: ['actions', 'author', 'avatar', 'content', 'datetime'],
|
||||
|
|
|
@ -28,7 +28,7 @@ export function getStyle(globalPrefixCls: string, theme: Theme) {
|
|||
variables[`${type}-color`] = formatColor(baseColor);
|
||||
variables[`${type}-color-disabled`] = colorPalettes[1];
|
||||
variables[`${type}-color-hover`] = colorPalettes[4];
|
||||
variables[`${type}-color-active`] = colorPalettes[7];
|
||||
variables[`${type}-color-active`] = colorPalettes[6];
|
||||
variables[`${type}-color-outline`] = baseColor.clone().setAlpha(0.2).toRgbString();
|
||||
variables[`${type}-color-deprecated-bg`] = colorPalettes[1];
|
||||
variables[`${type}-color-deprecated-border`] = colorPalettes[3];
|
||||
|
|
|
@ -59,7 +59,7 @@ Some components use dynamic style to support wave effect. You can config `csp` p
|
|||
| locale | language package setting, you can find the packages in [ant-design-vue/es/locale](http://unpkg.com/ant-design-vue/es/locale/) | object | - | 1.5.0 |
|
||||
| pageHeader | Unify the ghost of pageHeader ,Ref [pageHeader]\(<(/components/page-header)> | { ghost:boolean } | 'true' | 1.5.0 |
|
||||
| prefixCls | set prefix class | string | ant | |
|
||||
| renderEmpty | set empty content of components. Ref [Empty](/components/empty/) | slot-scope \| Function(componentName: string): ReactNode | - | |
|
||||
| renderEmpty | set empty content of components. Ref [Empty](/components/empty/) | slot-scope \| Function(componentName: string): VNode | - | |
|
||||
| space | Set Space `size`, ref [Space](/components/space) | { size: `small` \| `middle` \| `large` \| `number` } | - | 3.0 |
|
||||
| transformCellText | Table data can be changed again before rendering. The default configuration of general user empty data. | Function({ text, column, record, index }) => any | - | 1.5.4 |
|
||||
| virtual | Disable virtual scroll when set to false | boolean | true | 3.0 |
|
||||
|
|
|
@ -79,6 +79,7 @@ const setGlobalConfig = (params: GlobalConfigProviderProps & { theme?: Theme })
|
|||
}
|
||||
stopWatchEffect = watchEffect(() => {
|
||||
Object.assign(globalConfigBySet, reactive(params));
|
||||
Object.assign(globalConfigForApi, reactive(params));
|
||||
});
|
||||
if (params.theme) {
|
||||
registerTheme(getGlobalPrefixCls(), params.theme);
|
||||
|
@ -112,6 +113,7 @@ export const globalConfig = () => ({
|
|||
});
|
||||
|
||||
const ConfigProvider = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AConfigProvider',
|
||||
inheritAttrs: false,
|
||||
props: configProviderProps(),
|
||||
|
|
|
@ -25,6 +25,7 @@ export default function generateRangePicker<DateType, ExtraProps = {}>(
|
|||
extraProps: ExtraProps,
|
||||
) {
|
||||
const RangePicker = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ARangePicker',
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
|
|
|
@ -29,6 +29,7 @@ export default function generateSinglePicker<DateType, ExtraProps = {}>(
|
|||
...extraProps,
|
||||
};
|
||||
return defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: displayName,
|
||||
inheritAttrs: false,
|
||||
props: comProps,
|
||||
|
|
|
@ -1,8 +1,7 @@
|
|||
import Cell from './Cell';
|
||||
import { getSlot, getClass, getStyle } from '../_util/props-util';
|
||||
import type { FunctionalComponent, VNode } from 'vue';
|
||||
import type { CSSProperties, FunctionalComponent, VNode } from 'vue';
|
||||
import { inject, ref } from 'vue';
|
||||
import type { DescriptionsContextProp } from './index';
|
||||
import { descriptionsContext } from './index';
|
||||
|
||||
interface CellConfig {
|
||||
|
@ -32,29 +31,29 @@ const Row: FunctionalComponent<RowProps> = props => {
|
|||
showContent,
|
||||
labelStyle: rootLabelStyle,
|
||||
contentStyle: rootContentStyle,
|
||||
}: CellConfig & DescriptionsContextProp,
|
||||
}: CellConfig & { labelStyle?: CSSProperties; contentStyle?: CSSProperties },
|
||||
) => {
|
||||
return items.map((item, index) => {
|
||||
const itemProps = item.props || {};
|
||||
const {
|
||||
prefixCls: itemPrefixCls = prefixCls,
|
||||
span = 1,
|
||||
labelStyle,
|
||||
contentStyle,
|
||||
labelStyle = itemProps['label-style'],
|
||||
contentStyle = itemProps['content-style'],
|
||||
label = (item.children as any)?.label?.(),
|
||||
} = item.props || {};
|
||||
} = itemProps;
|
||||
const children = getSlot(item);
|
||||
const className = getClass(item);
|
||||
const style = getStyle(item);
|
||||
const { key } = item;
|
||||
|
||||
if (typeof component === 'string') {
|
||||
return (
|
||||
<Cell
|
||||
key={`${type}-${String(key) || index}`}
|
||||
class={className}
|
||||
style={style}
|
||||
labelStyle={{ ...rootLabelStyle.value, ...labelStyle }}
|
||||
contentStyle={{ ...rootContentStyle.value, ...contentStyle }}
|
||||
labelStyle={{ ...rootLabelStyle, ...labelStyle }}
|
||||
contentStyle={{ ...rootContentStyle, ...contentStyle }}
|
||||
span={span}
|
||||
colon={colon}
|
||||
component={component}
|
||||
|
@ -70,7 +69,7 @@ const Row: FunctionalComponent<RowProps> = props => {
|
|||
<Cell
|
||||
key={`label-${String(key) || index}`}
|
||||
class={className}
|
||||
style={{ ...rootLabelStyle.value, ...style, ...labelStyle }}
|
||||
style={{ ...rootLabelStyle, ...style, ...labelStyle }}
|
||||
span={1}
|
||||
colon={colon}
|
||||
component={component[0]}
|
||||
|
@ -81,7 +80,7 @@ const Row: FunctionalComponent<RowProps> = props => {
|
|||
<Cell
|
||||
key={`content-${String(key) || index}`}
|
||||
class={className}
|
||||
style={{ ...rootContentStyle.value, ...style, ...contentStyle }}
|
||||
style={{ ...rootContentStyle, ...style, ...contentStyle }}
|
||||
span={span * 2 - 1}
|
||||
component={component[1]}
|
||||
itemPrefixCls={itemPrefixCls}
|
||||
|
@ -105,8 +104,8 @@ const Row: FunctionalComponent<RowProps> = props => {
|
|||
component: 'th',
|
||||
type: 'label',
|
||||
showLabel: true,
|
||||
labelStyle,
|
||||
contentStyle,
|
||||
labelStyle: labelStyle.value,
|
||||
contentStyle: contentStyle.value,
|
||||
})}
|
||||
</tr>
|
||||
<tr key={`content-${index}`} class={`${prefixCls}-row`}>
|
||||
|
@ -114,8 +113,8 @@ const Row: FunctionalComponent<RowProps> = props => {
|
|||
component: 'td',
|
||||
type: 'content',
|
||||
showContent: true,
|
||||
labelStyle,
|
||||
contentStyle,
|
||||
labelStyle: labelStyle.value,
|
||||
contentStyle: contentStyle.value,
|
||||
})}
|
||||
</tr>
|
||||
</>
|
||||
|
@ -129,8 +128,8 @@ const Row: FunctionalComponent<RowProps> = props => {
|
|||
type: 'item',
|
||||
showLabel: true,
|
||||
showContent: true,
|
||||
labelStyle,
|
||||
contentStyle,
|
||||
labelStyle: labelStyle.value,
|
||||
contentStyle: contentStyle.value,
|
||||
})}
|
||||
</tr>
|
||||
);
|
||||
|
|
|
@ -46,6 +46,7 @@ export type DescriptionsItemProp = Partial<
|
|||
>;
|
||||
|
||||
export const DescriptionsItem = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ADescriptionsItem',
|
||||
props: descriptionsItemProp(),
|
||||
slots: ['label'],
|
||||
|
@ -157,6 +158,7 @@ export const descriptionsContext: InjectionKey<DescriptionsContextProp> =
|
|||
Symbol('descriptionsContext');
|
||||
|
||||
const Descriptions = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ADescriptions',
|
||||
props: descriptionsProps(),
|
||||
slots: ['title', 'extra'],
|
||||
|
|
|
@ -27,6 +27,7 @@ export const dividerProps = () => ({
|
|||
export type DividerProps = Partial<ExtractPropTypes<ReturnType<typeof dividerProps>>>;
|
||||
|
||||
const Divider = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ADivider',
|
||||
props: dividerProps(),
|
||||
setup(props, { slots }) {
|
||||
|
|
|
@ -95,6 +95,7 @@ export const drawerProps = () => ({
|
|||
export type DrawerProps = Partial<ExtractPropTypes<ReturnType<typeof drawerProps>>>;
|
||||
|
||||
const Drawer = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ADrawer',
|
||||
inheritAttrs: false,
|
||||
props: initDefaultProps(drawerProps(), {
|
||||
|
|
|
@ -12,6 +12,7 @@ const ButtonGroup = Button.Group;
|
|||
export type DropdownButtonProps = Partial<ExtractPropTypes<ReturnType<typeof dropdownButtonProps>>>;
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ADropdownButton',
|
||||
inheritAttrs: false,
|
||||
__ANT_BUTTON: true,
|
||||
|
|
|
@ -15,6 +15,7 @@ import getPlacements from '../tooltip/placements';
|
|||
export type DropdownProps = Partial<ExtractPropTypes<ReturnType<typeof dropdownProps>>>;
|
||||
|
||||
const Dropdown = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ADropdown',
|
||||
inheritAttrs: false,
|
||||
props: initDefaultProps(dropdownProps(), {
|
||||
|
|
|
@ -14,6 +14,7 @@ export interface ErrorListProps {
|
|||
}
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ErrorList',
|
||||
props: ['errors', 'help', 'onDomErrorVisibleChange', 'helpStatus', 'warnings'],
|
||||
setup(props) {
|
||||
|
|
|
@ -99,6 +99,7 @@ function isEqualName(name1: NamePath, name2: NamePath) {
|
|||
}
|
||||
|
||||
const Form = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AForm',
|
||||
inheritAttrs: false,
|
||||
props: initDefaultProps(formProps(), {
|
||||
|
|
|
@ -136,6 +136,7 @@ let indexGuid = 0;
|
|||
const defaultItemNamePrefixCls = 'form_item';
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AFormItem',
|
||||
inheritAttrs: false,
|
||||
__ANT_NEW_FORM_ITEM: true,
|
||||
|
|
|
@ -96,6 +96,7 @@ export const useInjectFormItemContext = () => {
|
|||
};
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AFormItemRest',
|
||||
setup(_, { slots }) {
|
||||
provide(InternalContextKey, defaultInternalContext);
|
||||
|
|
|
@ -23,6 +23,7 @@ export interface FormItemInputProps {
|
|||
}
|
||||
|
||||
const FormItemInput = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
slots: ['help', 'extra', 'errors'],
|
||||
inheritAttrs: false,
|
||||
props: [
|
||||
|
|
|
@ -28,7 +28,7 @@ Controls must injects `useInjectFormItemContext` and calls the corresponding met
|
|||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent, reactive } from 'vue';
|
||||
// sorceCode https://github.com/vueComponent/ant-design-vue/blob/cb3c002e17f0f4f5b3e8d01846069da0e2645aff/components/form/demo/price-input.vue
|
||||
// sourceCode https://github.com/vueComponent/ant-design-vue/blob/cb3c002e17f0f4f5b3e8d01846069da0e2645aff/components/form/demo/price-input.vue
|
||||
import PriceInput from './price-input.vue';
|
||||
import type { Currency } from './price-input.vue';
|
||||
|
||||
|
|
|
@ -111,7 +111,7 @@ But it also has some disadvantages:
|
|||
</a-form-item>
|
||||
```
|
||||
|
||||
As above Form.Item does not know whether to collect `name="a"` or `name=`b\`\`, you can solve this kind of problem in the following two ways:
|
||||
As above Form.Item does not know whether to collect `name="a"` or `name="b"`, you can solve this kind of problem in the following two ways:
|
||||
|
||||
The first is to use multiple `a-form-item`:
|
||||
|
||||
|
|
|
@ -110,7 +110,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/ORmcdeaoO/Form.svg
|
|||
</a-form-item>
|
||||
```
|
||||
|
||||
ๅฆไธ Form.Item ๅนถไธ็ฅ้้่ฆๆถ้ `name="a"` ่ฟๆฏ `name=`b\`\`๏ผไฝ ๅฏไปฅ้่ฟๅฆไธไธ็งๆนๅผๅป่งฃๅณๆญค็ฑป้ฎ้ข๏ผ
|
||||
ๅฆไธ Form.Item ๅนถไธ็ฅ้้่ฆๆถ้ `name="a"` ่ฟๆฏ `name="b"`๏ผไฝ ๅฏไปฅ้่ฟๅฆไธไธ็งๆนๅผๅป่งฃๅณๆญค็ฑป้ฎ้ข๏ผ
|
||||
|
||||
็ฌฌไธ็ง๏ผไฝฟ็จๅคไธช `a-form-item`:
|
||||
|
||||
|
|
|
@ -69,6 +69,7 @@ export const colProps = () => ({
|
|||
export type ColProps = Partial<ExtractPropTypes<ReturnType<typeof colProps>>>;
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ACol',
|
||||
props: colProps(),
|
||||
setup(props, { slots }) {
|
||||
|
|
|
@ -32,6 +32,7 @@ export const rowProps = () => ({
|
|||
export type RowProps = Partial<ExtractPropTypes<ReturnType<typeof rowProps>>>;
|
||||
|
||||
const ARow = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ARow',
|
||||
props: rowProps(),
|
||||
setup(props, { slots }) {
|
||||
|
|
|
@ -17,8 +17,6 @@ exports[`renders ./components/icon/demo/basic.vue correctly 1`] = `
|
|||
</div>
|
||||
`;
|
||||
|
||||
exports[`renders ./components/icon/demo/custom.vue correctly 1`] = `<div class="custom-icons-list"><span style="color: hotpink;" role="img" class="anticon"><svg width="1em" height="1em" fill="currentColor" viewBox="0 0 1024 1024"><path d="M923 283.6c-13.4-31.1-32.6-58.9-56.9-82.8-24.3-23.8-52.5-42.4-84-55.5-32.5-13.5-66.9-20.3-102.4-20.3-49.3 0-97.4 13.5-139.2 39-10 6.1-19.5 12.8-28.5 20.1-9-7.3-18.5-14-28.5-20.1-41.8-25.5-89.9-39-139.2-39-35.5 0-69.9 6.8-102.4 20.3-31.4 13-59.7 31.7-84 55.5-24.4 23.9-43.5 51.7-56.9 82.8-13.9 32.3-21 66.6-21 101.9 0 33.3 6.8 68 20.3 103.3 11.3 29.5 27.5 60.1 48.2 91 32.8 48.9 77.9 99.9 133.9 151.6 92.8 85.7 184.7 144.9 188.6 147.3l23.7 15.2c10.5 6.7 24 6.7 34.5 0l23.7-15.2c3.9-2.5 95.7-61.6 188.6-147.3 56-51.7 101.1-102.7 133.9-151.6 20.7-30.9 37-61.5 48.2-91 13.5-35.3 20.3-70 20.3-103.3 0.1-35.3-7-69.6-20.9-101.9z"></path></svg></span><span style="font-size: 32px;" role="img" class="anticon"><svg viewBox="0 0 1024 1024" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M99.096 315.634s-82.58-64.032-82.58-132.13c0-66.064 33.032-165.162 148.646-148.646 83.37 11.91 99.096 165.162 99.096 165.162l-165.162 115.614zM924.906 315.634s82.58-64.032 82.58-132.13c0-66.064-33.032-165.162-148.646-148.646-83.37 11.91-99.096 165.162-99.096 165.162l165.162 115.614z" fill="#6B676E" p-id="1143"></path><path d="M1024 561.548c0 264.526-229.23 429.42-512.002 429.42S0 826.076 0 561.548 283.96 66.064 512.002 66.064 1024 297.022 1024 561.548z" fill="#FFEBD2" p-id="1144"></path><path d="M330.324 842.126c0 82.096 81.34 148.646 181.678 148.646s181.678-66.55 181.678-148.646H330.324z" fill="#E9D7C3" p-id="1145"></path><path d="M644.13 611.098C594.582 528.516 561.55 512 512.002 512c-49.548 0-82.58 16.516-132.13 99.096-42.488 70.814-78.73 211.264-49.548 247.742 66.064 82.58 165.162 33.032 181.678 33.032 16.516 0 115.614 49.548 181.678-33.032 29.18-36.476-7.064-176.93-49.55-247.74z" fill="#FFFFFF" p-id="1146"></path><path d="M611.098 495.484c0-45.608 36.974-82.58 82.58-82.58 49.548 0 198.194 99.098 198.194 165.162s-79.934 144.904-148.646 99.096c-49.548-33.032-132.128-148.646-132.128-181.678zM412.904 495.484c0-45.608-36.974-82.58-82.58-82.58-49.548 0-198.194 99.098-198.194 165.162s79.934 144.904 148.646 99.096c49.548-33.032 132.128-148.646 132.128-181.678z" fill="#6B676E" p-id="1147"></path><path d="M512.002 726.622c-30.06 0-115.614 5.668-115.614 33.032 0 49.638 105.484 85.24 115.614 82.58 10.128 2.66 115.614-32.944 115.614-82.58-0.002-27.366-85.556-33.032-115.614-33.032z" fill="#464655" p-id="1148"></path><path d="M330.324 495.484m-33.032 0a33.032 33.032 0 1 0 66.064 0 33.032 33.032 0 1 0-66.064 0Z" fill="#464655" p-id="1149"></path><path d="M693.678 495.484m-33.032 0a33.032 33.032 0 1 0 66.064 0 33.032 33.032 0 1 0-66.064 0Z" fill="#464655" p-id="1150"></path></svg></span></div>`;
|
||||
|
||||
exports[`renders ./components/icon/demo/iconfont.vue correctly 1`] = `
|
||||
<div class="ant-space ant-space-horizontal ant-space-align-center">
|
||||
<div class="ant-space-item" style="margin-right: 8px;"><span role="img" class="anticon"><svg width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><use xlink:href="#icon-tuichu"></use></svg></span></div>
|
||||
|
|
|
@ -21,6 +21,7 @@ export const icons = {
|
|||
};
|
||||
|
||||
const InternalPreviewGroup = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AImagePreviewGroup',
|
||||
inheritAttrs: false,
|
||||
props: { previewPrefixCls: String },
|
||||
|
|
|
@ -37,6 +37,7 @@ export const inputNumberProps = () => ({
|
|||
export type InputNumberProps = Partial<ExtractPropTypes<ReturnType<typeof inputNumberProps>>>;
|
||||
|
||||
const InputNumber = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AInputNumber',
|
||||
inheritAttrs: false,
|
||||
props: inputNumberProps(),
|
||||
|
|
|
@ -79,6 +79,7 @@ export const inputNumberProps = () => ({
|
|||
});
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'InnerInputNumber',
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
|
|
|
@ -14,6 +14,7 @@ const STEP_INTERVAL = 200;
|
|||
const STEP_DELAY = 600;
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'StepHandler',
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
|
|
|
@ -15,6 +15,7 @@ import { getMergedStatus, getStatusClassNames } from '../_util/statusUtils';
|
|||
const ClearableInputType = ['text', 'input'];
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ClearableLabeledInput',
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
|
|
|
@ -6,6 +6,7 @@ import type { FocusEventHandler, MouseEventHandler } from '../_util/EventInterfa
|
|||
import useConfigInject from '../_util/hooks/useConfigInject';
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AInputGroup',
|
||||
props: {
|
||||
prefixCls: String,
|
||||
|
@ -36,8 +37,8 @@ export default defineComponent({
|
|||
return (
|
||||
<span
|
||||
class={cls.value}
|
||||
onMouseenter={props.onMouseEnter}
|
||||
onMouseleave={props.onMouseLeave}
|
||||
onMouseenter={props.onMouseenter}
|
||||
onMouseleave={props.onMouseleave}
|
||||
onFocus={props.onFocus}
|
||||
onBlur={props.onBlur}
|
||||
>
|
||||
|
|
|
@ -15,6 +15,7 @@ import omit from '../_util/omit';
|
|||
import CloseCircleFilled from '@ant-design/icons-vue/CloseCircleFilled';
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AInput',
|
||||
inheritAttrs: false,
|
||||
props: inputProps(),
|
||||
|
|
|
@ -17,6 +17,7 @@ const ActionMap = {
|
|||
const defaultIconRender = (visible: boolean) =>
|
||||
visible ? <EyeOutlined /> : <EyeInvisibleOutlined />;
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AInputPassword',
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
|
|
|
@ -23,6 +23,7 @@ const RESIZE_STATUS_RESIZING = 1;
|
|||
const RESIZE_STATUS_RESIZED = 2;
|
||||
|
||||
const ResizableTextArea = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ResizableTextArea',
|
||||
inheritAttrs: false,
|
||||
props: textAreaProps(),
|
||||
|
|
|
@ -18,6 +18,7 @@ import isMobile from '../_util/isMobile';
|
|||
import inputProps from './inputProps';
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'AInputSearch',
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
|
|
|
@ -46,6 +46,7 @@ function setTriggerValue(
|
|||
}
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ATextarea',
|
||||
inheritAttrs: false,
|
||||
props: textAreaProps(),
|
||||
|
|
|
@ -32,20 +32,7 @@ exports[`renders ./components/input/demo/allow-clear.vue correctly 1`] = `
|
|||
</div>
|
||||
`;
|
||||
|
||||
exports[`renders ./components/input/demo/autosize-textarea.vue correctly 1`] = `
|
||||
<div><textarea placeholder="Autosize height based on content lines" class="ant-input" style="height: 0px; min-height: -9007199254740991px; max-height: 9007199254740991px; overflow-y: hidden; resize: none; overflow-x: hidden;"></textarea>
|
||||
<div style="margin: 24px 0px;"></div><textarea placeholder="Autosize height with minimum and maximum number of lines" class="ant-input" style="height: -20px; min-height: -8px; max-height: -20px; overflow-y: hidden; resize: none; overflow-x: hidden;"></textarea>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`renders ./components/input/demo/basic.vue correctly 1`] = `
|
||||
<div class="ant-space ant-space-vertical">
|
||||
<div class="ant-space-item" style="margin-bottom: 8px;"><input placeholder="Basic usage" type="text" class="ant-input"></div>
|
||||
<!---->
|
||||
<div class="ant-space-item"><input placeholder="Lazy usage" type="text" autofocus="" class="ant-input"></div>
|
||||
<!---->
|
||||
</div>
|
||||
`;
|
||||
exports[`renders ./components/input/demo/basic.vue correctly 1`] = `<input placeholder="Basic usage" type="text" class="ant-input">`;
|
||||
|
||||
exports[`renders ./components/input/demo/borderless.vue correctly 1`] = `<input placeholder="Borderless" type="text" class="ant-input ant-input-borderless">`;
|
||||
|
||||
|
|
|
@ -58,6 +58,7 @@ const generateId = (() => {
|
|||
})();
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'ALayoutSider',
|
||||
inheritAttrs: false,
|
||||
props: initDefaultProps(siderProps(), {
|
||||
|
|
|
@ -8,8 +8,8 @@ exports[`renders ./components/layout/demo/basic.vue correctly 1`] = `
|
|||
</section>
|
||||
<section class="ant-layout">
|
||||
<header class="ant-layout-header">Header</header>
|
||||
<section class="ant-layout ant-layout-has-sider">
|
||||
<aside class="ant-layout-sider ant-layout-sider-dark" style="max-width: 200px; min-width: 200px; width: 200px; flex: 0 0 200px;">
|
||||
<section class="ant-layout">
|
||||
<aside class="ant-layout-sider ant-layout-sider-dark" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
|
||||
<div class="ant-layout-sider-children">Sider</div>
|
||||
<!---->
|
||||
</aside>
|
||||
|
@ -19,17 +19,17 @@ exports[`renders ./components/layout/demo/basic.vue correctly 1`] = `
|
|||
</section>
|
||||
<section class="ant-layout">
|
||||
<header class="ant-layout-header">Header</header>
|
||||
<section class="ant-layout ant-layout-has-sider">
|
||||
<section class="ant-layout">
|
||||
<main class="ant-layout-content">Content</main>
|
||||
<aside class="ant-layout-sider ant-layout-sider-dark" style="max-width: 200px; min-width: 200px; width: 200px; flex: 0 0 200px;">
|
||||
<aside class="ant-layout-sider ant-layout-sider-dark" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
|
||||
<div class="ant-layout-sider-children">Sider</div>
|
||||
<!---->
|
||||
</aside>
|
||||
</section>
|
||||
<footer class="ant-layout-footer">Footer</footer>
|
||||
</section>
|
||||
<section class="ant-layout ant-layout-has-sider">
|
||||
<aside class="ant-layout-sider ant-layout-sider-dark" style="max-width: 200px; min-width: 200px; width: 200px; flex: 0 0 200px;">
|
||||
<section class="ant-layout">
|
||||
<aside class="ant-layout-sider ant-layout-sider-dark" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
|
||||
<div class="ant-layout-sider-children">Sider</div>
|
||||
<!---->
|
||||
</aside>
|
||||
|
@ -42,8 +42,8 @@ exports[`renders ./components/layout/demo/basic.vue correctly 1`] = `
|
|||
`;
|
||||
|
||||
exports[`renders ./components/layout/demo/custom-trigger.vue correctly 1`] = `
|
||||
<section class="ant-layout ant-layout-has-sider">
|
||||
<aside class="ant-layout-sider ant-layout-sider-dark" style="max-width: 200px; min-width: 200px; width: 200px; flex: 0 0 200px;">
|
||||
<section class="ant-layout">
|
||||
<aside class="ant-layout-sider ant-layout-sider-dark" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
|
||||
<div class="ant-layout-sider-children">
|
||||
<div class="logo"></div>
|
||||
<ul class="ant-menu ant-menu-root ant-menu-inline ant-menu-dark" role="menu" data-menu-list="true">
|
||||
|
@ -68,8 +68,8 @@ exports[`renders ./components/layout/demo/custom-trigger.vue correctly 1`] = `
|
|||
<!---->
|
||||
</aside>
|
||||
<section class="ant-layout">
|
||||
<header class="ant-layout-header" style="padding: 0px; background: rgb(255, 255, 255);"><span role="img" aria-label="menu-fold" tabindex="-1" class="anticon anticon-menu-fold trigger"><svg focusable="false" class="" data-icon="menu-fold" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM115.4 518.9L271.7 642c5.8 4.6 14.4.5 14.4-6.9V388.9c0-7.4-8.5-11.5-14.4-6.9L115.4 505.1a8.74 8.74 0 000 13.8z"></path></svg></span></header>
|
||||
<main class="ant-layout-content" style="margin: 24px 16px; padding: 24px; min-height: 280px; background: rgb(255, 255, 255);"> Content </main>
|
||||
<header class="ant-layout-header" style="background: rgb(255, 255, 255); padding: 0px;"><span role="img" aria-label="menu-fold" tabindex="-1" class="anticon anticon-menu-fold trigger"><svg focusable="false" class="" data-icon="menu-fold" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM115.4 518.9L271.7 642c5.8 4.6 14.4.5 14.4-6.9V388.9c0-7.4-8.5-11.5-14.4-6.9L115.4 505.1a8.74 8.74 0 000 13.8z"></path></svg></span></header>
|
||||
<main class="ant-layout-content" style="margin: 24px 16px; padding: 24px; background: rgb(255, 255, 255); min-height: 280px;"> Content </main>
|
||||
</section>
|
||||
</section>
|
||||
`;
|
||||
|
@ -167,11 +167,11 @@ exports[`renders ./components/layout/demo/fixed-sider.vue correctly 1`] = `
|
|||
`;
|
||||
|
||||
exports[`renders ./components/layout/demo/responsive.vue correctly 1`] = `
|
||||
<section class="ant-layout ant-layout-has-sider">
|
||||
<aside class="ant-layout-sider ant-layout-sider-dark ant-layout-sider-collapsed ant-layout-sider-below ant-layout-sider-zero-width" style="max-width: 0px; min-width: 0px; width: 0px; flex: 0 0 0px;">
|
||||
<section class="ant-layout">
|
||||
<aside class="ant-layout-sider ant-layout-sider-dark" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
|
||||
<div class="ant-layout-sider-children">
|
||||
<div class="logo"></div>
|
||||
<ul class="ant-menu ant-menu-root ant-menu-vertical ant-menu-inline-collapsed ant-menu-dark" role="menu" data-menu-list="true">
|
||||
<ul class="ant-menu ant-menu-root ant-menu-inline ant-menu-dark" role="menu" data-menu-list="true">
|
||||
<!---->
|
||||
<li class="ant-menu-item" style="padding-left: 24px;" role="menuitem" tabindex="-1" data-menu-id="1" aria-disabled="false">
|
||||
<!----><span class="ant-menu-title-content"><span role="img" aria-label="user" class="anticon anticon-user"><svg focusable="false" class="" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></span><span class="nav-text">nav 1</span></span>
|
||||
|
@ -193,10 +193,11 @@ exports[`renders ./components/layout/demo/responsive.vue correctly 1`] = `
|
|||
<!--teleport start-->
|
||||
<!--teleport end-->
|
||||
</ul>
|
||||
</div><span class="ant-layout-sider-zero-width-trigger ant-layout-sider-zero-width-trigger-left"><span role="img" aria-label="bars" class="anticon anticon-bars"><svg focusable="false" class="" data-icon="bars" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="0 0 1024 1024"><path d="M912 192H328c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h584c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 284H328c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h584c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 284H328c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h584c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM104 228a56 56 0 10112 0 56 56 0 10-112 0zm0 284a56 56 0 10112 0 56 56 0 10-112 0zm0 284a56 56 0 10112 0 56 56 0 10-112 0z"></path></svg></span></span>
|
||||
</div>
|
||||
<!---->
|
||||
</aside>
|
||||
<section class="ant-layout">
|
||||
<header class="ant-layout-header" style="padding: 0px; background: rgb(255, 255, 255);"></header>
|
||||
<header class="ant-layout-header" style="background: rgb(255, 255, 255); padding: 0px;"></header>
|
||||
<main class="ant-layout-content" style="margin: 24px 16px 0px;">
|
||||
<div style="padding: 24px; background: rgb(255, 255, 255); min-height: 360px;">content</div>
|
||||
</main>
|
||||
|
@ -206,8 +207,8 @@ exports[`renders ./components/layout/demo/responsive.vue correctly 1`] = `
|
|||
`;
|
||||
|
||||
exports[`renders ./components/layout/demo/side.vue correctly 1`] = `
|
||||
<section class="ant-layout ant-layout-has-sider" style="min-height: 100vh;">
|
||||
<aside class="ant-layout-sider ant-layout-sider-dark ant-layout-sider-has-trigger" style="max-width: 200px; min-width: 200px; width: 200px; flex: 0 0 200px;">
|
||||
<section class="ant-layout" style="min-height: 100vh;">
|
||||
<aside class="ant-layout-sider ant-layout-sider-dark ant-layout-sider-has-trigger" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
|
||||
<div class="ant-layout-sider-children">
|
||||
<div class="logo"></div>
|
||||
<ul class="ant-menu ant-menu-root ant-menu-inline ant-menu-dark" role="menu" data-menu-list="true">
|
||||
|
@ -264,7 +265,7 @@ exports[`renders ./components/layout/demo/side.vue correctly 1`] = `
|
|||
<div class="ant-layout-sider-trigger" style="width: 200px;"><span role="img" aria-label="left" class="anticon anticon-left"><svg focusable="false" class="" data-icon="left" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M724 218.3V141c0-6.7-7.7-10.4-12.9-6.3L260.3 486.8a31.86 31.86 0 000 50.3l450.8 352.1c5.3 4.1 12.9.4 12.9-6.3v-77.3c0-4.9-2.3-9.6-6.1-12.6l-360-281 360-281.1c3.8-3 6.1-7.7 6.1-12.6z"></path></svg></span></div>
|
||||
</aside>
|
||||
<section class="ant-layout">
|
||||
<header class="ant-layout-header" style="padding: 0px; background: rgb(255, 255, 255);"></header>
|
||||
<header class="ant-layout-header" style="background: rgb(255, 255, 255); padding: 0px;"></header>
|
||||
<main class="ant-layout-content" style="margin: 0px 16px;">
|
||||
<div class="ant-breadcrumb" style="margin: 16px 0px;"><span><span class="ant-breadcrumb-link">User</span><span class="ant-breadcrumb-separator">/</span></span><span><span class="ant-breadcrumb-link">Bill</span><span class="ant-breadcrumb-separator">/</span></span></div>
|
||||
<div style="padding: 24px; background: rgb(255, 255, 255); min-height: 360px;"> Bill is a cat. </div>
|
||||
|
@ -340,11 +341,11 @@ exports[`renders ./components/layout/demo/top-side.vue correctly 1`] = `
|
|||
</header>
|
||||
<main class="ant-layout-content" style="padding: 0px 50px;">
|
||||
<div class="ant-breadcrumb" style="margin: 16px 0px;"><span><span class="ant-breadcrumb-link">Home</span><span class="ant-breadcrumb-separator">/</span></span><span><span class="ant-breadcrumb-link">List</span><span class="ant-breadcrumb-separator">/</span></span><span><span class="ant-breadcrumb-link">App</span><span class="ant-breadcrumb-separator">/</span></span></div>
|
||||
<section class="ant-layout ant-layout-has-sider" style="padding: 24px 0px; background: rgb(255, 255, 255);">
|
||||
<aside style="max-width: 200px; min-width: 200px; width: 200px; background: rgb(255, 255, 255); flex: 0 0 200px;" class="ant-layout-sider ant-layout-sider-dark">
|
||||
<section class="ant-layout" style="padding: 24px 0px; background: rgb(255, 255, 255);">
|
||||
<aside style="background: rgb(255, 255, 255); flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;" class="ant-layout-sider ant-layout-sider-dark">
|
||||
<div class="ant-layout-sider-children">
|
||||
<ul class="ant-menu ant-menu-root ant-menu-inline ant-menu-light" style="height: 100%;" role="menu" data-menu-list="true">
|
||||
<li class="ant-menu-submenu ant-menu-submenu-inline ant-menu-submenu-open ant-menu-submenu-selected" role="none" data-submenu-id="sub1">
|
||||
<li class="ant-menu-submenu ant-menu-submenu-inline ant-menu-submenu-open" role="none" data-submenu-id="sub1">
|
||||
<!---->
|
||||
<div style="padding-left: 24px;" class="ant-menu-submenu-title" tabindex="-1" data-menu-id="sub1" aria-expanded="true" aria-haspopup="true" aria-controls="sub_menu_11_$$_sub1-popup" aria-disabled="false"><span class="ant-menu-title-content"><span><span role="img" aria-label="user" class="anticon anticon-user"><svg focusable="false" class="" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></span> subnav 1 </span></span><i class="ant-menu-submenu-arrow"></i></div>
|
||||
<ul id="sub_menu_11_$$_sub1-popup" class="ant-menu ant-menu-sub ant-menu-inline v-enter-from v-enter-active" data-menu-list="true">
|
||||
|
@ -453,11 +454,11 @@ exports[`renders ./components/layout/demo/top-side-2.vue correctly 1`] = `
|
|||
<!--teleport end-->
|
||||
</ul>
|
||||
</header>
|
||||
<section class="ant-layout ant-layout-has-sider">
|
||||
<aside style="max-width: 200px; min-width: 200px; width: 200px; background: rgb(255, 255, 255); flex: 0 0 200px;" class="ant-layout-sider ant-layout-sider-dark">
|
||||
<section class="ant-layout">
|
||||
<aside style="background: rgb(255, 255, 255); flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;" class="ant-layout-sider ant-layout-sider-dark">
|
||||
<div class="ant-layout-sider-children">
|
||||
<ul class="ant-menu ant-menu-root ant-menu-inline ant-menu-light" style="height: 100%; border-right: 0;" role="menu" data-menu-list="true">
|
||||
<li class="ant-menu-submenu ant-menu-submenu-inline ant-menu-submenu-open ant-menu-submenu-selected" role="none" data-submenu-id="sub1">
|
||||
<li class="ant-menu-submenu ant-menu-submenu-inline ant-menu-submenu-open" role="none" data-submenu-id="sub1">
|
||||
<!---->
|
||||
<div style="padding-left: 24px;" class="ant-menu-submenu-title" tabindex="-1" data-menu-id="sub1" aria-expanded="true" aria-haspopup="true" aria-controls="sub_menu_5_$$_sub1-popup" aria-disabled="false"><span class="ant-menu-title-content"><span><span role="img" aria-label="user" class="anticon anticon-user"><svg focusable="false" class="" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></span> subnav 1 </span></span><i class="ant-menu-submenu-arrow"></i></div>
|
||||
<ul id="sub_menu_5_$$_sub1-popup" class="ant-menu ant-menu-sub ant-menu-inline v-enter-from v-enter-active" data-menu-list="true">
|
||||
|
@ -533,7 +534,7 @@ exports[`renders ./components/layout/demo/top-side-2.vue correctly 1`] = `
|
|||
</aside>
|
||||
<section class="ant-layout" style="padding: 0px 24px 24px;">
|
||||
<div class="ant-breadcrumb" style="margin: 16px 0px;"><span><span class="ant-breadcrumb-link">Home</span><span class="ant-breadcrumb-separator">/</span></span><span><span class="ant-breadcrumb-link">List</span><span class="ant-breadcrumb-separator">/</span></span><span><span class="ant-breadcrumb-link">App</span><span class="ant-breadcrumb-separator">/</span></span></div>
|
||||
<main class="ant-layout-content" style="padding: 24px; margin: 0px; min-height: 280px; background: rgb(255, 255, 255);"> Content </main>
|
||||
<main class="ant-layout-content" style="background: rgb(255, 255, 255); padding: 24px; margin: 0px; min-height: 280px;"> Content </main>
|
||||
</section>
|
||||
</section>
|
||||
</section>
|
||||
|
|
|
@ -20,6 +20,7 @@ type GeneratorArgument = {
|
|||
function generator({ suffixCls, tagName, name }: GeneratorArgument) {
|
||||
return (BasicComponent: typeof Basic) => {
|
||||
const Adapter = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name,
|
||||
props: basicProps(),
|
||||
setup(props, { slots }) {
|
||||
|
@ -39,6 +40,7 @@ function generator({ suffixCls, tagName, name }: GeneratorArgument) {
|
|||
}
|
||||
|
||||
const Basic = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
props: basicProps(),
|
||||
setup(props, { slots }) {
|
||||
return () => createVNode(props.tagName, { class: props.prefixCls }, slots);
|
||||
|
@ -46,6 +48,7 @@ const Basic = defineComponent({
|
|||
});
|
||||
|
||||
const BasicLayout = defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
props: basicProps(),
|
||||
setup(props, { slots }) {
|
||||
const { direction } = useConfigInject('', props);
|
||||
|
|
Some files were not shown because too many files have changed in this diff Show More
Loadingโฆ
Reference in New Issue