antdv-next 1.5.0 → 1.5.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/_util/hooks/useClosable.d.ts +4 -2
- package/dist/_util/hooks/useClosable.js +9 -3
- package/dist/_util/hooks/useMergeSemantic.d.ts +7 -4
- package/dist/_util/hooks/useMergeSemantic.js +8 -3
- package/dist/_util/statusUtils.d.ts +1 -1
- package/dist/_util/vueNode.d.ts +2 -6
- package/dist/alert/style/index.d.ts +5 -0
- package/dist/alert/style/index.js +2 -1
- package/dist/anchor/Anchor.js +12 -6
- package/dist/antd-with-locales.esm.js +12799 -12587
- package/dist/antd-with-locales.js +82 -82
- package/dist/antd.css +1 -1
- package/dist/antd.esm.js +10540 -10546
- package/dist/antd.js +57 -57
- package/dist/avatar/AvatarGroup.d.ts +4 -1
- package/dist/avatar/AvatarGroup.js +6 -4
- package/dist/avatar/index.d.ts +2 -2
- package/dist/badge/Ribbon.d.ts +4 -1
- package/dist/badge/Ribbon.js +11 -11
- package/dist/badge/index.d.ts +3 -2
- package/dist/badge/index.js +26 -24
- package/dist/border-beam/BorderBeam.d.ts +1 -0
- package/dist/border-beam/BorderBeam.js +30 -11
- package/dist/border-beam/hooks/useBorderSize.d.ts +3 -7
- package/dist/border-beam/hooks/useBorderSize.js +25 -26
- package/dist/border-beam/style/index.js +9 -8
- package/dist/border-beam/util.d.ts +3 -1
- package/dist/border-beam/util.js +4 -1
- package/dist/breadcrumb/Breadcrumb.d.ts +4 -1
- package/dist/breadcrumb/Breadcrumb.js +12 -7
- package/dist/breadcrumb/index.d.ts +2 -2
- package/dist/button/Button.js +5 -14
- package/dist/button/buttonHelper.d.ts +1 -1
- package/dist/button/style/index.js +0 -1
- package/dist/calendar/generateCalendar.d.ts +4 -1
- package/dist/calendar/generateCalendar.js +8 -5
- package/dist/calendar/index.d.ts +2 -2
- package/dist/calendar/locale/sq_AL.d.ts +2 -0
- package/dist/calendar/locale/sq_AL.js +5 -0
- package/dist/card/CardGrid.d.ts +4 -1
- package/dist/card/CardGrid.js +7 -4
- package/dist/card/CardMeta.d.ts +4 -1
- package/dist/card/CardMeta.js +5 -3
- package/dist/card/index.d.ts +3 -3
- package/dist/carousel/index.d.ts +1 -0
- package/dist/carousel/index.js +13 -10
- package/dist/collapse/Collapse.js +2 -4
- package/dist/color-picker/ColorPicker.js +4 -7
- package/dist/color-picker/components/ColorTrigger.js +1 -1
- package/dist/color-picker/style/index.js +1 -0
- package/dist/components.d.ts +25 -21
- package/dist/components.js +4 -3
- package/dist/config-provider/context.d.ts +24 -8
- package/dist/config-provider/define.d.ts +2 -1
- package/dist/config-provider/index.js +10 -0
- package/dist/date-picker/generatePicker/generateRangePicker.js +6 -7
- package/dist/date-picker/generatePicker/generateSinglePicker.js +2 -5
- package/dist/date-picker/generatePicker/useComponents.d.ts +2 -2
- package/dist/date-picker/hooks/useMergedPickerSemantic.d.ts +1 -1
- package/dist/date-picker/hooks/useMergedPickerSemantic.js +7 -3
- package/dist/date-picker/locale/sq_AL.d.ts +6 -0
- package/dist/date-picker/locale/sq_AL.js +72 -0
- package/dist/date-picker/locale/zh_TW.js +2 -2
- package/dist/date-picker/util.d.ts +2 -6
- package/dist/descriptions/hooks/useItems.d.ts +4 -4
- package/dist/descriptions/index.d.ts +4 -1
- package/dist/descriptions/index.js +5 -2
- package/dist/divider/index.d.ts +4 -1
- package/dist/divider/index.js +9 -6
- package/dist/drawer/DrawerPanel.js +5 -3
- package/dist/drawer/index.js +9 -13
- package/dist/drawer/style/index.js +1 -0
- package/dist/dropdown/dropdown.js +4 -6
- package/dist/empty/index.d.ts +4 -1
- package/dist/empty/index.js +5 -2
- package/dist/float-button/BackTop.d.ts +2 -0
- package/dist/float-button/BackTop.js +25 -43
- package/dist/float-button/FloatButtonGroup.d.ts +4 -1
- package/dist/float-button/FloatButtonGroup.js +5 -4
- package/dist/float-button/hooks/useScroll.d.ts +16 -0
- package/dist/float-button/hooks/useScroll.js +80 -0
- package/dist/float-button/index.d.ts +2 -2
- package/dist/float-button/style/button.js +23 -0
- package/dist/form/ErrorList.js +2 -2
- package/dist/form/FormItem/ItemHolder.js +1 -1
- package/dist/form/FormItem/index.js +26 -28
- package/dist/form/context.d.ts +1 -1
- package/dist/form/hooks/useVariant.d.ts +2 -2
- package/dist/form/hooks/useVariant.js +15 -5
- package/dist/form/style/index.js +25 -12
- package/dist/form/types.d.ts +11 -3
- package/dist/form/utils/validateUtil.js +4 -0
- package/dist/image/hooks/usePreviewConfig.d.ts +5 -4
- package/dist/image/index.js +8 -9
- package/dist/index.d.ts +25 -21
- package/dist/index.js +2 -2
- package/dist/input/OTP/index.js +6 -3
- package/dist/input/Password.js +4 -1
- package/dist/input/Search.js +11 -6
- package/dist/input/index.d.ts +1 -1
- package/dist/input/style/token.js +2 -1
- package/dist/input/style/variants.js +1 -1
- package/dist/listy/interface.d.ts +3 -2
- package/dist/listy/style/index.js +5 -1
- package/dist/locale/en_US.js +4 -0
- package/dist/locale/index.d.ts +4 -0
- package/dist/locale/is_IS.js +1 -1
- package/dist/locale/mn_MN.js +1 -1
- package/dist/locale/sq_AL.d.ts +5 -0
- package/dist/locale/sq_AL.js +151 -0
- package/dist/locale/zh_CN.js +4 -0
- package/dist/locale/zh_TW.js +41 -41
- package/dist/masonry/Masonry.js +4 -4
- package/dist/mentions/index.d.ts +1 -0
- package/dist/mentions/index.js +4 -0
- package/dist/menu/MenuItem.js +12 -2
- package/dist/menu/SubMenu.d.ts +1 -1
- package/dist/menu/style/vertical.js +2 -6
- package/dist/message/useMessage.js +4 -4
- package/dist/modal/PurePanel.js +4 -7
- package/dist/notification/index.js +2 -1
- package/dist/notification/useNotification.js +12 -9
- package/dist/package.js +1 -1
- package/dist/package.json.d.ts +4 -0
- package/dist/pagination/Pagination.js +14 -6
- package/dist/pagination/index.d.ts +2 -2
- package/dist/pagination/interface.d.ts +20 -3
- package/dist/popconfirm/index.js +17 -8
- package/dist/popover/PurePanel.js +10 -0
- package/dist/popover/index.js +24 -16
- package/dist/qrcode/index.d.ts +4 -1
- package/dist/qrcode/index.js +16 -13
- package/dist/radio/group.js +2 -2
- package/dist/rate/style/index.js +12 -9
- package/dist/result/index.d.ts +4 -1
- package/dist/result/index.js +7 -4
- package/dist/select/index.js +1 -1
- package/dist/select/style/dropdown.js +4 -0
- package/dist/select/style/index.js +1 -1
- package/dist/select/style/select-input.js +1 -1
- package/dist/select/style/token.js +4 -2
- package/dist/select/useIcons.d.ts +2 -6
- package/dist/skeleton/Skeleton.d.ts +4 -1
- package/dist/skeleton/Skeleton.js +10 -4
- package/dist/skeleton/index.d.ts +2 -2
- package/dist/slider/SliderTooltip.js +5 -0
- package/dist/slider/index.d.ts +5 -1
- package/dist/slider/index.js +9 -9
- package/dist/space/Compact.d.ts +5 -2
- package/dist/space/Compact.js +8 -3
- package/dist/space/index.d.ts +2 -2
- package/dist/space/index.js +3 -3
- package/dist/spin/index.d.ts +4 -1
- package/dist/spin/index.js +7 -5
- package/dist/splitter/Splitter.d.ts +4 -1
- package/dist/splitter/Splitter.js +4 -2
- package/dist/splitter/index.d.ts +2 -2
- package/dist/splitter/style/index.js +2 -1
- package/dist/statistic/Statistic.d.ts +4 -1
- package/dist/statistic/index.d.ts +2 -2
- package/dist/steps/index.js +6 -8
- package/dist/steps/style/index.js +2 -1
- package/dist/table/InternalTable.js +5 -4
- package/dist/table/hooks/useFilter/FilterDropdown.js +2 -2
- package/dist/table/style/radius.js +4 -0
- package/dist/table/style/virtual.js +4 -0
- package/dist/tag/hooks/useColor.d.ts +1 -1
- package/dist/tag/index.js +3 -3
- package/dist/theme/interface/seeds.d.ts +8 -0
- package/dist/theme/themes/seed.js +1 -0
- package/dist/theme/util/alias.js +1 -1
- package/dist/time-picker/locale/sq_AL.d.ts +5 -0
- package/dist/time-picker/locale/sq_AL.js +7 -0
- package/dist/timeline/Timeline.js +5 -7
- package/dist/tooltip/PurePanel.js +5 -0
- package/dist/tooltip/index.d.ts +1 -0
- package/dist/tooltip/index.js +27 -13
- package/dist/tour/index.js +10 -13
- package/dist/tour/panelRender.js +2 -8
- package/dist/transfer/ListBody.js +2 -1
- package/dist/transfer/ListItem.d.ts +1 -0
- package/dist/transfer/ListItem.js +6 -2
- package/dist/transfer/Transfer.d.ts +4 -1
- package/dist/transfer/Transfer.js +5 -2
- package/dist/transfer/index.d.ts +2 -2
- package/dist/transfer/search.js +2 -2
- package/dist/tree/index.d.ts +3 -2
- package/dist/tree/index.js +3 -2
- package/dist/tree/style/index.js +4 -0
- package/dist/tree/utils/dictUtil.js +3 -2
- package/dist/typography/Base/EllipsisTooltip.d.ts +6 -1
- package/dist/typography/Base/EllipsisTooltip.js +2 -2
- package/dist/typography/Base/index.js +9 -26
- package/dist/typography/hooks/useCopyClick.d.ts +1 -1
- package/dist/typography/hooks/useCopyClick.js +5 -15
- package/dist/upload/Upload.js +7 -9
- package/dist/upload/UploadList/ListItem.js +6 -13
- package/dist/upload/UploadList/index.js +8 -2
- package/dist/upload/index.d.ts +2 -2
- package/dist/version/token-meta.json +1 -0
- package/dist/version/token.json +1 -0
- package/dist/watermark/index.d.ts +4 -1
- package/dist/watermark/index.js +2 -1
- package/package.json +13 -9
- package/web-tags.json +1980 -1947
- package/web-types.json +5808 -5730
- package/dist/slider/useRafLock.d.ts +0 -5
- package/dist/slider/useRafLock.js +0 -23
|
@@ -17,6 +17,9 @@ interface AvatarGroupProps extends ComponentBaseProps {
|
|
|
17
17
|
size?: AvatarSize;
|
|
18
18
|
shape?: 'circle' | 'square';
|
|
19
19
|
}
|
|
20
|
+
interface AvatarGroupRef {
|
|
21
|
+
nativeElement: HTMLDivElement;
|
|
22
|
+
}
|
|
20
23
|
declare const AvatarGroup: import("vue").DefineSetupFnComponent<AvatarGroupProps, {}, {}, AvatarGroupProps & {}, import("vue").PublicProps>;
|
|
21
24
|
//#endregion
|
|
22
|
-
export { AvatarGroupProps, AvatarGroup as default };
|
|
25
|
+
export { AvatarGroupProps, AvatarGroupRef, AvatarGroup as default };
|
|
@@ -5,11 +5,11 @@ import { useAvatarProvider } from "./AvatarContext.js";
|
|
|
5
5
|
import style_default from "./style/index.js";
|
|
6
6
|
import Avatar from "./Avatar.js";
|
|
7
7
|
import Popover from "../popover/index.js";
|
|
8
|
-
import { computed, createVNode, defineComponent, isVNode, mergeProps } from "vue";
|
|
8
|
+
import { computed, createVNode, defineComponent, isVNode, mergeProps, shallowRef } from "vue";
|
|
9
9
|
import { clsx } from "@v-c/util";
|
|
10
10
|
import { filterEmpty } from "@v-c/util/dist/props-util";
|
|
11
11
|
//#region src/avatar/AvatarGroup.tsx
|
|
12
|
-
const AvatarGroup = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
|
|
12
|
+
const AvatarGroup = /* @__PURE__ */ defineComponent((props, { slots, attrs, expose }) => {
|
|
13
13
|
const { prefixCls, direction } = useComponentBaseConfig("avatar", props);
|
|
14
14
|
const groupPrefixCls = computed(() => `${prefixCls.value}-group`);
|
|
15
15
|
const rootCls = useCSSVarCls(prefixCls);
|
|
@@ -20,6 +20,8 @@ const AvatarGroup = /* @__PURE__ */ defineComponent((props, { slots, attrs }) =>
|
|
|
20
20
|
shape: props.shape
|
|
21
21
|
};
|
|
22
22
|
}));
|
|
23
|
+
const nativeElementRef = shallowRef();
|
|
24
|
+
expose({ nativeElement: nativeElementRef });
|
|
23
25
|
return () => {
|
|
24
26
|
const { rootClass, max } = props;
|
|
25
27
|
const children = filterEmpty(slots?.default?.() ?? []);
|
|
@@ -48,12 +50,12 @@ const AvatarGroup = /* @__PURE__ */ defineComponent((props, { slots, attrs }) =>
|
|
|
48
50
|
"key": "avatar-popover-key",
|
|
49
51
|
"destroyOnHidden": true
|
|
50
52
|
}, popoverProps), { default: () => [createVNode(Avatar, { "style": mergeStyle }, { default: () => [`+${numOfChildren - mergeCount}`] })] }));
|
|
51
|
-
return createVNode("div", mergeProps(restAttrs, {
|
|
53
|
+
return createVNode("div", mergeProps({ "ref": nativeElementRef }, restAttrs, {
|
|
52
54
|
"class": cls,
|
|
53
55
|
"style": style
|
|
54
56
|
}), [childrenShow]);
|
|
55
57
|
}
|
|
56
|
-
return createVNode("div", mergeProps(restAttrs, {
|
|
58
|
+
return createVNode("div", mergeProps({ "ref": nativeElementRef }, restAttrs, {
|
|
57
59
|
"class": cls,
|
|
58
60
|
"style": style
|
|
59
61
|
}), [childrenWithProps]);
|
package/dist/avatar/index.d.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import Avatar$1, { AvatarEmits, AvatarProps, AvatarSlots } from "./Avatar.js";
|
|
2
|
-
import AvatarGroup, { AvatarGroupProps } from "./AvatarGroup.js";
|
|
2
|
+
import AvatarGroup, { AvatarGroupProps, AvatarGroupRef } from "./AvatarGroup.js";
|
|
3
3
|
//#region src/avatar/index.d.ts
|
|
4
4
|
type CompoundedComponent = typeof Avatar$1 & {
|
|
5
5
|
Group: typeof AvatarGroup;
|
|
6
6
|
};
|
|
7
7
|
declare const Avatar: CompoundedComponent;
|
|
8
8
|
//#endregion
|
|
9
|
-
export { type AvatarEmits, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarSlots, Avatar as default };
|
|
9
|
+
export { type AvatarEmits, AvatarGroup, type AvatarGroupProps, type AvatarGroupRef, type AvatarProps, type AvatarSlots, Avatar as default };
|
package/dist/badge/Ribbon.d.ts
CHANGED
|
@@ -27,10 +27,13 @@ interface RibbonProps extends ComponentBaseProps {
|
|
|
27
27
|
classes?: RibbonClassNamesType;
|
|
28
28
|
styles?: RibbonStylesType;
|
|
29
29
|
}
|
|
30
|
+
interface RibbonRef {
|
|
31
|
+
nativeElement: HTMLDivElement;
|
|
32
|
+
}
|
|
30
33
|
interface RibbonSlots {
|
|
31
34
|
default?: () => any;
|
|
32
35
|
text?: () => any;
|
|
33
36
|
}
|
|
34
37
|
declare const _default: import("vue").DefineSetupFnComponent<RibbonProps, EmptyEmit, SlotsType<RibbonSlots>, RibbonProps, import("vue").PublicProps>;
|
|
35
38
|
//#endregion
|
|
36
|
-
export { RibbonClassNamesType, RibbonProps, RibbonSemanticClassNames, RibbonSemanticName, RibbonSemanticStyles, RibbonSlots, RibbonStylesType, _default as default };
|
|
39
|
+
export { RibbonClassNamesType, RibbonProps, RibbonRef, RibbonSemanticClassNames, RibbonSemanticName, RibbonSemanticStyles, RibbonSlots, RibbonStylesType, _default as default };
|
package/dist/badge/Ribbon.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { useComponentBaseConfig } from "../config-provider/context.js";
|
|
2
|
-
import { useMergeSemantic, useToArr, useToProps } from "../_util/hooks/useMergeSemantic.js";
|
|
2
|
+
import { useMergeSemantic, useSemanticRootStyle, useToArr, useToProps } from "../_util/hooks/useMergeSemantic.js";
|
|
3
3
|
import { getSlotPropsFnRun, toPropsRefs as toPropsRefs$1 } from "../_util/tools.js";
|
|
4
4
|
import { isPresetColor } from "../_util/colors.js";
|
|
5
5
|
import ribbon_default from "./style/ribbon.js";
|
|
6
|
-
import { computed, createVNode, defineComponent, mergeDefaults, mergeProps } from "vue";
|
|
6
|
+
import { computed, createVNode, defineComponent, mergeDefaults, mergeProps, shallowRef } from "vue";
|
|
7
7
|
import { clsx } from "@v-c/util";
|
|
8
8
|
import { getAttrStyleAndClass } from "@v-c/util/dist/props-util";
|
|
9
|
-
var Ribbon_default = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
|
|
9
|
+
var Ribbon_default = /* @__PURE__ */ defineComponent((props, { slots, attrs, expose }) => {
|
|
10
10
|
const { styles, classes: ribbonClassNames } = toPropsRefs$1(props, "classes", "styles");
|
|
11
11
|
const { prefixCls, class: contextClassName, style: contextStyle, direction, classes: contextClassNames, styles: contextStyles } = useComponentBaseConfig("ribbon", props);
|
|
12
12
|
const wrapperCls = computed(() => `${prefixCls.value}-wrapper`);
|
|
@@ -14,10 +14,14 @@ var Ribbon_default = /* @__PURE__ */ defineComponent((props, { slots, attrs }) =
|
|
|
14
14
|
const mergedProps = computed(() => {
|
|
15
15
|
return props;
|
|
16
16
|
});
|
|
17
|
-
const
|
|
17
|
+
const contextIndicatorStyle = useSemanticRootStyle(contextStyle, "indicator");
|
|
18
|
+
const indicatorStyle = useSemanticRootStyle(computed(() => attrs.style), "indicator");
|
|
19
|
+
const [mergedClassNames, mergedStyles] = useMergeSemantic(useToArr(contextClassNames, ribbonClassNames), useToArr(contextStyles, contextIndicatorStyle, styles, indicatorStyle), useToProps(mergedProps));
|
|
20
|
+
const nativeElementRef = shallowRef();
|
|
21
|
+
expose({ nativeElement: nativeElementRef });
|
|
18
22
|
return () => {
|
|
19
23
|
const { placement = "end", color } = props;
|
|
20
|
-
const { className,
|
|
24
|
+
const { className, restAttrs } = getAttrStyleAndClass(attrs);
|
|
21
25
|
const colorInPreset = isPresetColor(props.color, false);
|
|
22
26
|
const ribbonCls = clsx(prefixCls.value, `${prefixCls.value}-placement-${placement}`, {
|
|
23
27
|
[`${prefixCls.value}-rtl`]: direction.value === "rtl",
|
|
@@ -32,16 +36,12 @@ var Ribbon_default = /* @__PURE__ */ defineComponent((props, { slots, attrs }) =
|
|
|
32
36
|
const textNodes = getSlotPropsFnRun(slots, props, "text");
|
|
33
37
|
const children = slots.default?.();
|
|
34
38
|
return createVNode("div", {
|
|
39
|
+
"ref": nativeElementRef,
|
|
35
40
|
"class": clsx(wrapperCls.value, props.rootClass, hashId.value, cssVarCls.value, mergedClassNames.value?.root),
|
|
36
41
|
"style": mergedStyles.value?.root
|
|
37
42
|
}, [children, createVNode("div", mergeProps(restAttrs, {
|
|
38
43
|
"class": clsx(ribbonCls, hashId.value),
|
|
39
|
-
"style": [
|
|
40
|
-
colorStyle,
|
|
41
|
-
mergedStyles.value?.indicator,
|
|
42
|
-
contextStyle.value,
|
|
43
|
-
style
|
|
44
|
-
]
|
|
44
|
+
"style": [colorStyle, mergedStyles.value?.indicator]
|
|
45
45
|
}), [createVNode("span", {
|
|
46
46
|
"class": clsx(`${prefixCls.value}-content`, mergedClassNames.value.content),
|
|
47
47
|
"style": mergedStyles.value?.content
|
package/dist/badge/index.d.ts
CHANGED
|
@@ -5,7 +5,7 @@ import { PresetColorKey } from "../theme/interface/presetColors.js";
|
|
|
5
5
|
import "../theme/interface/index.js";
|
|
6
6
|
import { SizeType } from "../config-provider/SizeContext.js";
|
|
7
7
|
import { PresetStatusColorType } from "../_util/colors.js";
|
|
8
|
-
import _default, { RibbonProps, RibbonSlots } from "./Ribbon.js";
|
|
8
|
+
import _default, { RibbonProps, RibbonRef, RibbonSlots } from "./Ribbon.js";
|
|
9
9
|
import { ComponentBaseProps } from "../config-provider/context.js";
|
|
10
10
|
import { CSSProperties, SlotsType } from "vue";
|
|
11
11
|
import { LiteralUnion } from "@v-c/util/dist/type";
|
|
@@ -51,5 +51,6 @@ declare const Badge: typeof InternalBadge & {
|
|
|
51
51
|
};
|
|
52
52
|
declare const BadgeRibbon: import("vue").DefineSetupFnComponent<RibbonProps, EmptyEmit, SlotsType<RibbonSlots>, RibbonProps, import("vue").PublicProps>;
|
|
53
53
|
type BadgeRibbonProps = RibbonProps;
|
|
54
|
+
type BadgeRibbonRef = RibbonRef;
|
|
54
55
|
//#endregion
|
|
55
|
-
export { BadgeClassNamesType, BadgeProps, BadgeRibbon, BadgeRibbonProps, BadgeSemanticClassNames, BadgeSemanticName, BadgeSemanticStyles, BadgeSlots, BadgeStylesType, Badge as default };
|
|
56
|
+
export { BadgeClassNamesType, BadgeProps, BadgeRibbon, BadgeRibbonProps, BadgeRibbonRef, BadgeSemanticClassNames, BadgeSemanticName, BadgeSemanticStyles, BadgeSlots, BadgeStylesType, Badge as default };
|
package/dist/badge/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { devUseWarning, isDev } from "../_util/warning.js";
|
|
2
2
|
import { useComponentBaseConfig } from "../config-provider/context.js";
|
|
3
|
-
import { useMergeSemantic, useToArr, useToProps } from "../_util/hooks/useMergeSemantic.js";
|
|
3
|
+
import { useMergeSemantic, useSemanticRootStyle, useToArr, useToProps } from "../_util/hooks/useMergeSemantic.js";
|
|
4
4
|
import { clsx as clsx$1, getSlotPropsFnRun, toPropsRefs as toPropsRefs$1 } from "../_util/tools.js";
|
|
5
5
|
import { isPresetColor } from "../_util/colors.js";
|
|
6
6
|
import { formatUnit } from "../_util/styleUtils.js";
|
|
@@ -19,7 +19,6 @@ const InternalBadge = /* @__PURE__ */ defineComponent((props, { slots, attrs, ex
|
|
|
19
19
|
const { class: contextClassName, style: contextStyle, classes: contextClassNames, styles: contextStyles, prefixCls, direction, getPrefixCls } = useComponentBaseConfig("badge", props);
|
|
20
20
|
const { classes, styles } = toPropsRefs$1(props, "classes", "styles");
|
|
21
21
|
const mergedProps = computed(() => props);
|
|
22
|
-
const [mergedClassNames, mergedStyles] = useMergeSemantic(useToArr(contextClassNames, classes), useToArr(contextStyles, styles), useToProps(mergedProps));
|
|
23
22
|
const badgeRef = shallowRef();
|
|
24
23
|
expose({ badgeRef });
|
|
25
24
|
const [hashId, cssVarCls] = style_default(prefixCls);
|
|
@@ -63,34 +62,37 @@ const InternalBadge = /* @__PURE__ */ defineComponent((props, { slots, attrs, ex
|
|
|
63
62
|
watchEffect(() => {
|
|
64
63
|
if (!isHidden.value) isDotRef.value = showAsDot.value;
|
|
65
64
|
});
|
|
66
|
-
const
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
65
|
+
const childrenNodes = computed(() => filterEmpty(slots.default?.() ?? []));
|
|
66
|
+
const hasTextSlot = computed(() => textNodes.value.length > 0);
|
|
67
|
+
const showStatusTextNode = computed(() => !isHidden.value && (hasTextSlot.value ? true : props.text === 0 ? props.showZero : !!props.text && props.text !== true));
|
|
68
|
+
const isStatusBadge = computed(() => Boolean(!childrenNodes.value.length && hasStatus.value && (showStatusTextNode.value || hasStatusValue.value || !ignoreCount.value)));
|
|
69
|
+
const offsetStyle = computed(() => {
|
|
70
|
+
if (!props.offset) return;
|
|
71
71
|
const horizontalOffset = Number.parseInt(props.offset[0], 10);
|
|
72
|
-
const
|
|
73
|
-
const offsetStyle = {
|
|
74
|
-
marginTop: formatUnit(props.offset[1]),
|
|
75
|
-
insetInlineEnd: insetInlineEndUnit
|
|
76
|
-
};
|
|
72
|
+
const insetInlineEnd = direction.value === "rtl" ? horizontalOffset : -horizontalOffset;
|
|
77
73
|
return {
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
...attrs.style
|
|
74
|
+
marginTop: formatUnit(props.offset[1]),
|
|
75
|
+
insetInlineEnd: formatUnit(insetInlineEnd)
|
|
81
76
|
};
|
|
82
77
|
});
|
|
78
|
+
const mergedStyle = computed(() => ({
|
|
79
|
+
...offsetStyle.value,
|
|
80
|
+
...contextStyle.value,
|
|
81
|
+
...attrs.style
|
|
82
|
+
}));
|
|
83
|
+
const legacyStyleKey = computed(() => isStatusBadge.value ? "root" : "indicator");
|
|
84
|
+
const contextLegacyStyle = useSemanticRootStyle(contextStyle, legacyStyleKey);
|
|
85
|
+
const componentLegacyStyle = useSemanticRootStyle(computed(() => attrs.style), legacyStyleKey);
|
|
86
|
+
const [mergedClassNames, mergedStyles] = useMergeSemantic(useToArr(contextClassNames, classes), useToArr(contextStyles, contextLegacyStyle, styles, componentLegacyStyle), useToProps(mergedProps));
|
|
83
87
|
const displayCount = computed(() => displayCountRef.value);
|
|
84
88
|
const isInternalColor = computed(() => isPresetColor(props.color, false));
|
|
85
89
|
return () => {
|
|
86
90
|
const { class: attrClass, style: attrStyle, ...restAttrs } = attrs;
|
|
87
|
-
const children =
|
|
91
|
+
const children = childrenNodes.value;
|
|
88
92
|
let livingCount = countCacheRef.value;
|
|
89
93
|
if (typeof livingCount === "function") livingCount = livingCount();
|
|
90
94
|
const fallbackTitleNode = typeof livingCount === "string" || typeof livingCount === "number" ? livingCount : void 0;
|
|
91
95
|
const titleNode = props.title === null || props.title === false ? void 0 : props.title ?? fallbackTitleNode;
|
|
92
|
-
const hasTextSlot = textNodes.value.length > 0;
|
|
93
|
-
const showStatusTextNode = !isHidden.value && (hasTextSlot ? true : props.text === 0 ? props.showZero : !!props.text && props.text !== true);
|
|
94
96
|
const statusCls = clsx$1(mergedClassNames.value.indicator, {
|
|
95
97
|
[`${prefixCls.value}-status-dot`]: hasStatus.value,
|
|
96
98
|
[`${prefixCls.value}-status-${props.status}`]: !!props.status,
|
|
@@ -107,18 +109,18 @@ const InternalBadge = /* @__PURE__ */ defineComponent((props, { slots, attrs, ex
|
|
|
107
109
|
statusStyle.color = props.color;
|
|
108
110
|
}
|
|
109
111
|
const renderStatusText = (style) => {
|
|
110
|
-
if (!showStatusTextNode) return null;
|
|
112
|
+
if (!showStatusTextNode.value) return null;
|
|
111
113
|
return createVNode("span", {
|
|
112
114
|
"class": `${prefixCls.value}-status-text`,
|
|
113
115
|
"style": style
|
|
114
|
-
}, [hasTextSlot ? textNodes.value : props.text]);
|
|
116
|
+
}, [hasTextSlot.value ? textNodes.value : props.text]);
|
|
115
117
|
};
|
|
116
|
-
if (
|
|
117
|
-
const statusTextColor =
|
|
118
|
+
if (isStatusBadge.value) {
|
|
119
|
+
const statusTextColor = mergedStyles.value.root?.color;
|
|
118
120
|
return createVNode("span", mergeProps(restAttrs, {
|
|
119
121
|
"ref": badgeRef,
|
|
120
122
|
"class": badgeClassName,
|
|
121
|
-
"style": [
|
|
123
|
+
"style": [offsetStyle.value, mergedStyles.value.root]
|
|
122
124
|
}), [createVNode("span", {
|
|
123
125
|
"class": statusCls,
|
|
124
126
|
"style": [mergedStyles.value.indicator, statusStyle]
|
|
@@ -151,8 +153,8 @@ const InternalBadge = /* @__PURE__ */ defineComponent((props, { slots, attrs, ex
|
|
|
151
153
|
"count": displayCount.value,
|
|
152
154
|
"title": titleNode,
|
|
153
155
|
"style": [
|
|
156
|
+
offsetStyle.value,
|
|
154
157
|
mergedStyles.value?.indicator,
|
|
155
|
-
mergedStyle.value,
|
|
156
158
|
scrollNumberStyle
|
|
157
159
|
]
|
|
158
160
|
}, _isSlot(clonedNode) ? clonedNode : { default: () => [clonedNode] }) : null }),
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { useComponentBaseConfig } from "../config-provider/context.js";
|
|
2
2
|
import { genCssVar } from "../theme/util/genStyleUtils.js";
|
|
3
3
|
import { isNonNullable, isNumber } from "../_util/is.js";
|
|
4
|
-
import useBorderSize from "./hooks/useBorderSize.js";
|
|
5
4
|
import { getBorderBeamGradient } from "./util.js";
|
|
5
|
+
import useBorderSize from "./hooks/useBorderSize.js";
|
|
6
6
|
import style_default from "./style/index.js";
|
|
7
7
|
import { Fragment, Teleport, cloneVNode, computed, createVNode, defineComponent, isVNode, shallowRef } from "vue";
|
|
8
8
|
import { clsx } from "@v-c/util";
|
|
@@ -10,6 +10,9 @@ import { filterEmpty } from "@v-c/util/dist/props-util";
|
|
|
10
10
|
import { unrefElement } from "@vueuse/core";
|
|
11
11
|
import { unit } from "@antdv-next/cssinjs";
|
|
12
12
|
//#region src/border-beam/BorderBeam.tsx
|
|
13
|
+
function _isSlot(s) {
|
|
14
|
+
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
|
|
15
|
+
}
|
|
13
16
|
function getInset(width) {
|
|
14
17
|
return typeof width === "string" ? `calc(-1 * ${width})` : `-${width}px`;
|
|
15
18
|
}
|
|
@@ -20,34 +23,46 @@ const BorderBeam = /* @__PURE__ */ defineComponent((props, { attrs, slots }) =>
|
|
|
20
23
|
const [hashId, cssVarCls] = style_default(prefixCls);
|
|
21
24
|
const varName = computed(() => genCssVar(rootCls.value, "border-beam")[0]);
|
|
22
25
|
const hostDom = shallowRef(null);
|
|
23
|
-
const
|
|
26
|
+
const borderWidth = useBorderSize(hostDom);
|
|
24
27
|
const beamGradient = computed(() => getBorderBeamGradient(props.color));
|
|
28
|
+
const mergedCount = computed(() => {
|
|
29
|
+
const { count = 1 } = props;
|
|
30
|
+
return isNumber(count) && Number.isFinite(count) && count >= 1 ? Math.floor(count) : 1;
|
|
31
|
+
});
|
|
32
|
+
const mergedDuration = computed(() => {
|
|
33
|
+
const { duration } = props;
|
|
34
|
+
return isNumber(duration) && duration > 0 ? duration : 6;
|
|
35
|
+
});
|
|
25
36
|
const insetOffset = computed(() => {
|
|
26
37
|
const { outset } = props;
|
|
27
38
|
if (isNonNullable(outset)) return getInset(outset);
|
|
28
|
-
return
|
|
39
|
+
return borderWidth.value.map(getInset).join(" ");
|
|
29
40
|
});
|
|
30
41
|
const setHostDom = (el) => {
|
|
31
42
|
hostDom.value = unrefElement(el) ?? null;
|
|
32
43
|
};
|
|
33
44
|
return () => {
|
|
45
|
+
let _slot;
|
|
34
46
|
const { duration, lineWidth, size } = props;
|
|
35
47
|
const children = filterEmpty(slots.default?.() ?? []);
|
|
36
|
-
const
|
|
48
|
+
const count = mergedCount.value;
|
|
49
|
+
const getBeamStyle = (index) => ({
|
|
37
50
|
...contextStyle?.value ?? {},
|
|
38
51
|
...attrs.style ?? {},
|
|
39
52
|
...beamGradient.value && { [varName.value("beam-gradient")]: beamGradient.value },
|
|
40
53
|
...isNumber(duration) && duration > 0 && { [varName.value("duration")]: `${duration}s` },
|
|
41
54
|
...isNonNullable(lineWidth) && { [varName.value("line-width")]: unit(lineWidth) },
|
|
42
55
|
...isNonNullable(size) && { [varName.value("size")]: unit(size) },
|
|
43
|
-
[varName.value("
|
|
44
|
-
[varName.value("
|
|
45
|
-
};
|
|
46
|
-
const
|
|
56
|
+
...index > 0 && { [varName.value("delay")]: `${-mergedDuration.value * index / count}s` },
|
|
57
|
+
[varName.value("inset-offset")]: insetOffset.value
|
|
58
|
+
});
|
|
59
|
+
const beamCls = clsx(prefixCls.value, contextClassName?.value, props.rootClass, attrs.class, hashId.value, cssVarCls.value);
|
|
60
|
+
const beamNode = hostDom.value ? createVNode(Teleport, { "to": hostDom.value }, _isSlot(_slot = Array.from({ length: count }, (_, index) => createVNode("div", {
|
|
61
|
+
"key": index,
|
|
47
62
|
"aria-hidden": "true",
|
|
48
|
-
"class":
|
|
49
|
-
"style":
|
|
50
|
-
}, null)] }) : null;
|
|
63
|
+
"class": beamCls,
|
|
64
|
+
"style": getBeamStyle(index)
|
|
65
|
+
}, null))) ? _slot : { default: () => [_slot] }) : null;
|
|
51
66
|
const renderChild = () => {
|
|
52
67
|
if (children.length !== 1 || !isVNode(children[0])) return children;
|
|
53
68
|
const child = children[0];
|
|
@@ -69,6 +84,10 @@ const BorderBeam = /* @__PURE__ */ defineComponent((props, { attrs, slots }) =>
|
|
|
69
84
|
type: [String, Array],
|
|
70
85
|
required: false
|
|
71
86
|
},
|
|
87
|
+
count: {
|
|
88
|
+
type: Number,
|
|
89
|
+
required: false
|
|
90
|
+
},
|
|
72
91
|
duration: {
|
|
73
92
|
type: Number,
|
|
74
93
|
required: false
|
|
@@ -1,10 +1,6 @@
|
|
|
1
|
+
import { BorderWidth } from "../util.js";
|
|
1
2
|
import { Ref } from "vue";
|
|
2
3
|
//#region src/border-beam/hooks/useBorderSize.d.ts
|
|
3
|
-
|
|
4
|
-
interface BorderInfo {
|
|
5
|
-
borderWidth: BorderWidth;
|
|
6
|
-
borderRadius: string;
|
|
7
|
-
}
|
|
8
|
-
declare function useBorderSize(domNode: Ref<HTMLElement | SVGElement | null | undefined>): import("vue").ShallowRef<BorderInfo, BorderInfo>;
|
|
4
|
+
declare function useBorderSize(domNode: Ref<HTMLElement | SVGElement | null | undefined>): import("vue").ShallowRef<BorderWidth, BorderWidth>;
|
|
9
5
|
//#endregion
|
|
10
|
-
export {
|
|
6
|
+
export { useBorderSize as default };
|
|
@@ -1,47 +1,46 @@
|
|
|
1
|
+
import { isNumber } from "../../_util/is.js";
|
|
2
|
+
import { isSameBorderWidth } from "../util.js";
|
|
1
3
|
import { shallowRef, watch } from "vue";
|
|
2
4
|
//#region src/border-beam/hooks/useBorderSize.ts
|
|
3
|
-
const
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
function parseBorderWidth(value) {
|
|
13
|
-
const size = Number.parseFloat(value);
|
|
14
|
-
return Number.isFinite(size) ? size : 0;
|
|
5
|
+
const DEFAULT_BORDER_WIDTH = [
|
|
6
|
+
0,
|
|
7
|
+
0,
|
|
8
|
+
0,
|
|
9
|
+
0
|
|
10
|
+
];
|
|
11
|
+
function normalizeValue(val) {
|
|
12
|
+
const size = Number.parseFloat(val);
|
|
13
|
+
return isNumber(size) ? size : 0;
|
|
15
14
|
}
|
|
16
15
|
function useBorderSize(domNode) {
|
|
17
|
-
const
|
|
16
|
+
const borderWidth = shallowRef(DEFAULT_BORDER_WIDTH);
|
|
17
|
+
const setBorderWidth = (next) => {
|
|
18
|
+
if (!isSameBorderWidth(borderWidth.value, next)) borderWidth.value = next;
|
|
19
|
+
};
|
|
18
20
|
watch(domNode, (node) => {
|
|
19
21
|
if (!node) {
|
|
20
|
-
|
|
22
|
+
setBorderWidth(DEFAULT_BORDER_WIDTH);
|
|
21
23
|
return;
|
|
22
24
|
}
|
|
23
25
|
let computedStyle;
|
|
24
26
|
try {
|
|
25
27
|
computedStyle = getComputedStyle(node);
|
|
26
28
|
} catch {
|
|
27
|
-
|
|
29
|
+
setBorderWidth(DEFAULT_BORDER_WIDTH);
|
|
28
30
|
return;
|
|
29
31
|
}
|
|
30
|
-
const { borderTopWidth, borderRightWidth, borderBottomWidth, borderLeftWidth
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
],
|
|
38
|
-
borderRadius
|
|
39
|
-
};
|
|
32
|
+
const { borderTopWidth, borderRightWidth, borderBottomWidth, borderLeftWidth } = computedStyle;
|
|
33
|
+
setBorderWidth([
|
|
34
|
+
normalizeValue(borderTopWidth),
|
|
35
|
+
normalizeValue(borderRightWidth),
|
|
36
|
+
normalizeValue(borderBottomWidth),
|
|
37
|
+
normalizeValue(borderLeftWidth)
|
|
38
|
+
]);
|
|
40
39
|
}, {
|
|
41
40
|
immediate: true,
|
|
42
41
|
flush: "post"
|
|
43
42
|
});
|
|
44
|
-
return
|
|
43
|
+
return borderWidth;
|
|
45
44
|
}
|
|
46
45
|
//#endregion
|
|
47
46
|
export { useBorderSize as default };
|
|
@@ -3,23 +3,23 @@ import { genNoMotionRawStyle } from "../../style/motion/util.js";
|
|
|
3
3
|
import "../util.js";
|
|
4
4
|
import { Keyframes, unit } from "@antdv-next/cssinjs";
|
|
5
5
|
//#region src/border-beam/style/index.ts
|
|
6
|
+
const antBorderBeamMove = new Keyframes("antBorderBeamMove", {
|
|
7
|
+
from: { offsetDistance: "0%" },
|
|
8
|
+
to: { offsetDistance: "100%" }
|
|
9
|
+
});
|
|
6
10
|
const genBorderBeamStyle = (token) => {
|
|
7
|
-
const { componentCls, antCls } = token;
|
|
11
|
+
const { componentCls, antCls, colorPrimary, colorPrimaryHover, lineWidth } = token;
|
|
8
12
|
const [, varRef] = genCssVar(antCls, "border-beam");
|
|
9
|
-
const defaultBeamGradient = `linear-gradient(to left, ${
|
|
10
|
-
const antBorderBeamMove = new Keyframes("antBorderBeamMove", {
|
|
11
|
-
from: { offsetDistance: "0%" },
|
|
12
|
-
to: { offsetDistance: "100%" }
|
|
13
|
-
});
|
|
13
|
+
const defaultBeamGradient = `linear-gradient(to left, ${colorPrimary} 0%, ${colorPrimaryHover} 70%, transparent)`;
|
|
14
14
|
return { [componentCls]: {
|
|
15
15
|
display: "none",
|
|
16
16
|
position: "absolute",
|
|
17
17
|
inset: varRef("inset-offset", "0px"),
|
|
18
|
-
borderRadius:
|
|
18
|
+
borderRadius: "inherit",
|
|
19
19
|
zIndex: 1,
|
|
20
20
|
overflow: "hidden",
|
|
21
21
|
pointerEvents: "none",
|
|
22
|
-
padding: varRef("line-width", unit(
|
|
22
|
+
padding: varRef("line-width", unit(lineWidth)),
|
|
23
23
|
"@supports ((mask-composite: exclude) or (-webkit-mask-composite: xor))": {
|
|
24
24
|
WebkitMask: "linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0)",
|
|
25
25
|
WebkitMaskComposite: "xor",
|
|
@@ -43,6 +43,7 @@ const genBorderBeamStyle = (token) => {
|
|
|
43
43
|
offsetRotate: "auto",
|
|
44
44
|
animationName: antBorderBeamMove,
|
|
45
45
|
animationDuration: varRef("duration", `6s`),
|
|
46
|
+
animationDelay: varRef("delay", "0s"),
|
|
46
47
|
animationTimingFunction: "linear",
|
|
47
48
|
animationIterationCount: "infinite",
|
|
48
49
|
willChange: "offset-distance"
|
|
@@ -5,8 +5,10 @@ interface BorderBeamGradientItem {
|
|
|
5
5
|
}
|
|
6
6
|
type BorderBeamGradient = BorderBeamGradientItem[];
|
|
7
7
|
type BorderBeamColor = string | BorderBeamGradient;
|
|
8
|
+
type BorderWidth = readonly [number, number, number, number];
|
|
8
9
|
declare const DEFAULT_BORDER_BEAM_DURATION = 6;
|
|
9
10
|
declare const MAX_BEAM_COLOR_STOP_PERCENT = 70;
|
|
10
11
|
declare function getBorderBeamGradient(value?: BorderBeamColor): string | undefined;
|
|
12
|
+
declare function isSameBorderWidth(left: BorderWidth, right: BorderWidth): boolean;
|
|
11
13
|
//#endregion
|
|
12
|
-
export { BorderBeamColor, BorderBeamGradient, BorderBeamGradientItem, DEFAULT_BORDER_BEAM_DURATION, MAX_BEAM_COLOR_STOP_PERCENT, getBorderBeamGradient };
|
|
14
|
+
export { BorderBeamColor, BorderBeamGradient, BorderBeamGradientItem, BorderWidth, DEFAULT_BORDER_BEAM_DURATION, MAX_BEAM_COLOR_STOP_PERCENT, getBorderBeamGradient, isSameBorderWidth };
|
package/dist/border-beam/util.js
CHANGED
|
@@ -32,5 +32,8 @@ function getBorderBeamGradient(value) {
|
|
|
32
32
|
const normalizedStops = normalizeGradientItems(normalizeBorderBeamColor(value));
|
|
33
33
|
return normalizedStops.length ? getLinearGradient(...normalizedStops.map((item) => `${item.color} ${item.percent}%`)) : void 0;
|
|
34
34
|
}
|
|
35
|
+
function isSameBorderWidth(left, right) {
|
|
36
|
+
return left[0] === right[0] && left[1] === right[1] && left[2] === right[2] && left[3] === right[3];
|
|
37
|
+
}
|
|
35
38
|
//#endregion
|
|
36
|
-
export { DEFAULT_BORDER_BEAM_DURATION, MAX_BEAM_COLOR_STOP_PERCENT, getBorderBeamGradient };
|
|
39
|
+
export { DEFAULT_BORDER_BEAM_DURATION, MAX_BEAM_COLOR_STOP_PERCENT, getBorderBeamGradient, isSameBorderWidth };
|
|
@@ -76,6 +76,9 @@ interface BreadcrumbProps<T extends AnyObject = AnyObject> extends BreadcrumbEmi
|
|
|
76
76
|
menu: MenuItem;
|
|
77
77
|
}) => any;
|
|
78
78
|
}
|
|
79
|
+
interface BreadcrumbRef {
|
|
80
|
+
nativeElement: HTMLElement;
|
|
81
|
+
}
|
|
79
82
|
interface BreadcrumbEmits {
|
|
80
83
|
clickItem: (item: ItemType, event: MouseEvent) => void;
|
|
81
84
|
[keys: string]: (...args: any[]) => any;
|
|
@@ -107,4 +110,4 @@ declare const Breadcrumb: import("vue").DefineSetupFnComponent<BreadcrumbProps<A
|
|
|
107
110
|
[x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
|
|
108
111
|
}, import("vue").PublicProps>;
|
|
109
112
|
//#endregion
|
|
110
|
-
export { BreadcrumbClassNamesType, BreadcrumbEmits, BreadcrumbEmitsProps, _default as BreadcrumbItem, BreadcrumbItemRenderContext, BreadcrumbItemType, BreadcrumbProps, BreadcrumbSemanticClassNames, BreadcrumbSemanticName, BreadcrumbSemanticStyles, _default$1 as BreadcrumbSeparator, BreadcrumbSeparatorType, BreadcrumbSlots, BreadcrumbStylesType, InternalRouteType, ItemType, Breadcrumb as default };
|
|
113
|
+
export { BreadcrumbClassNamesType, BreadcrumbEmits, BreadcrumbEmitsProps, _default as BreadcrumbItem, BreadcrumbItemRenderContext, BreadcrumbItemType, BreadcrumbProps, BreadcrumbRef, BreadcrumbSemanticClassNames, BreadcrumbSemanticName, BreadcrumbSemanticStyles, _default$1 as BreadcrumbSeparator, BreadcrumbSeparatorType, BreadcrumbSlots, BreadcrumbStylesType, InternalRouteType, ItemType, Breadcrumb as default };
|
|
@@ -6,7 +6,7 @@ import BreadcrumbSeparator from "./BreadcrumbSeparator.js";
|
|
|
6
6
|
import useItemRender from "./useItemRender.js";
|
|
7
7
|
import BreadcrumbItem, { InternalBreadcrumbItem } from "./BreadcrumbItem.js";
|
|
8
8
|
import style_default from "./style/index.js";
|
|
9
|
-
import { cloneVNode, computed, createVNode, defineComponent, isVNode, mergeProps } from "vue";
|
|
9
|
+
import { cloneVNode, computed, createVNode, defineComponent, isVNode, mergeProps, shallowRef } from "vue";
|
|
10
10
|
import { clsx } from "@v-c/util";
|
|
11
11
|
import { filterEmpty } from "@v-c/util/dist/props-util";
|
|
12
12
|
import { DownOutlined } from "@antdv-next/icons";
|
|
@@ -23,7 +23,7 @@ function getPath(params, path) {
|
|
|
23
23
|
});
|
|
24
24
|
return mergedPath;
|
|
25
25
|
}
|
|
26
|
-
const Breadcrumb = /* @__PURE__ */ defineComponent((props, { slots, attrs, emit }) => {
|
|
26
|
+
const Breadcrumb = /* @__PURE__ */ defineComponent((props, { slots, attrs, emit, expose }) => {
|
|
27
27
|
const { prefixCls, direction, class: contextClassName, style: contextStyle, classes: contextClassNames, styles: contextStyles, separator: contextSeparator, dropdownIcon: contextDropdownIcon } = useComponentBaseConfig("breadcrumb", props, ["separator", "dropdownIcon"]);
|
|
28
28
|
const { classes, styles } = toPropsRefs$1(props, "classes", "styles");
|
|
29
29
|
const mergedSeparator = computed(() => {
|
|
@@ -47,6 +47,8 @@ const Breadcrumb = /* @__PURE__ */ defineComponent((props, { slots, attrs, emit
|
|
|
47
47
|
styles: mergedStyles.value
|
|
48
48
|
};
|
|
49
49
|
}));
|
|
50
|
+
const nativeElementRef = shallowRef();
|
|
51
|
+
expose({ nativeElement: nativeElementRef });
|
|
50
52
|
return () => {
|
|
51
53
|
const { params = {}, rootClass } = props;
|
|
52
54
|
const itemRender = slots?.itemRender ? (route, slotParams, routes, paths) => slots.itemRender?.({
|
|
@@ -122,12 +124,15 @@ const Breadcrumb = /* @__PURE__ */ defineComponent((props, { slots, attrs, emit
|
|
|
122
124
|
});
|
|
123
125
|
}
|
|
124
126
|
const { className, style, restAttrs } = getAttrStyleAndClass$1(attrs);
|
|
127
|
+
const breadcrumbClassName = clsx(prefixCls.value, contextClassName.value, { [`${prefixCls}-rtl`]: direction.value === "rtl" }, className, rootClass, mergedClassNames.value?.root, hashId.value, cssVarCls.value);
|
|
128
|
+
const mergedStyle = {
|
|
129
|
+
...mergedStyles.value?.root,
|
|
130
|
+
...style
|
|
131
|
+
};
|
|
125
132
|
return createVNode("nav", mergeProps({
|
|
126
|
-
"
|
|
127
|
-
"
|
|
128
|
-
|
|
129
|
-
...style
|
|
130
|
-
}
|
|
133
|
+
"ref": nativeElementRef,
|
|
134
|
+
"class": breadcrumbClassName,
|
|
135
|
+
"style": mergedStyle
|
|
131
136
|
}, restAttrs), [createVNode("ol", null, [crumbs])]);
|
|
132
137
|
};
|
|
133
138
|
}, {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import _default, { BreadcrumbItemProps, SeparatorType } from "./BreadcrumbItem.js";
|
|
2
2
|
import _default$1 from "./BreadcrumbSeparator.js";
|
|
3
|
-
import Breadcrumb, { BreadcrumbEmits, BreadcrumbItemRenderContext, BreadcrumbProps, BreadcrumbSlots, ItemType } from "./Breadcrumb.js";
|
|
4
|
-
export { type BreadcrumbEmits, _default as BreadcrumbItem, type BreadcrumbItemProps, type BreadcrumbItemRenderContext, type ItemType as BreadcrumbItemType, type BreadcrumbProps, _default$1 as BreadcrumbSeparator, type BreadcrumbSlots, type SeparatorType, Breadcrumb as default };
|
|
3
|
+
import Breadcrumb, { BreadcrumbEmits, BreadcrumbItemRenderContext, BreadcrumbProps, BreadcrumbRef, BreadcrumbSlots, ItemType } from "./Breadcrumb.js";
|
|
4
|
+
export { type BreadcrumbEmits, _default as BreadcrumbItem, type BreadcrumbItemProps, type BreadcrumbItemRenderContext, type ItemType as BreadcrumbItemType, type BreadcrumbProps, type BreadcrumbRef, _default$1 as BreadcrumbSeparator, type BreadcrumbSlots, type SeparatorType, Breadcrumb as default };
|
package/dist/button/Button.js
CHANGED
|
@@ -15,6 +15,7 @@ import { classNames } from "@v-c/util";
|
|
|
15
15
|
import { filterEmpty } from "@v-c/util/dist/props-util";
|
|
16
16
|
import { omit } from "es-toolkit";
|
|
17
17
|
import { toArray } from "es-toolkit/compat";
|
|
18
|
+
import useDelayState from "@v-c/util/dist/hooks/useDelayState";
|
|
18
19
|
//#region src/button/Button.tsx
|
|
19
20
|
function _isSlot(s) {
|
|
20
21
|
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
|
|
@@ -87,7 +88,7 @@ const InternalCompoundedButton = /* @__PURE__ */ defineComponent((props, { slots
|
|
|
87
88
|
const loadingOrDelay = computed(() => {
|
|
88
89
|
return getLoadingConfig(props.loading);
|
|
89
90
|
});
|
|
90
|
-
const innerLoading =
|
|
91
|
+
const [innerLoading, setInnerLoading] = useDelayState(loadingOrDelay.value.loading);
|
|
91
92
|
const hasTwoCNChar = shallowRef(false);
|
|
92
93
|
const buttonRef = shallowRef();
|
|
93
94
|
const isMountRef = shallowRef(true);
|
|
@@ -98,19 +99,9 @@ const InternalCompoundedButton = /* @__PURE__ */ defineComponent((props, { slots
|
|
|
98
99
|
onBeforeUnmount(() => {
|
|
99
100
|
isMountRef.value = true;
|
|
100
101
|
});
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
delayTimer = null;
|
|
105
|
-
innerLoading.value = true;
|
|
106
|
-
}, loadingOrDelay.value.delay);
|
|
107
|
-
else innerLoading.value = loadingOrDelay.value.loading;
|
|
108
|
-
onCleanup(() => {
|
|
109
|
-
if (delayTimer) {
|
|
110
|
-
clearTimeout(delayTimer);
|
|
111
|
-
delayTimer = null;
|
|
112
|
-
}
|
|
113
|
-
});
|
|
102
|
+
watch([() => loadingOrDelay.value.delay, () => loadingOrDelay.value.loading], () => {
|
|
103
|
+
if (loadingOrDelay.value.delay > 0) setInnerLoading(true, { ms: loadingOrDelay.value.delay });
|
|
104
|
+
else setInnerLoading(loadingOrDelay.value.loading, true);
|
|
114
105
|
}, {
|
|
115
106
|
flush: "sync",
|
|
116
107
|
immediate: true
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { CSSProperties, VNodeChild } from "vue";
|
|
2
2
|
//#region src/button/buttonHelper.d.ts
|
|
3
3
|
declare const isTwoCNChar: (string: string) => boolean;
|
|
4
|
-
declare function isUnBorderedButtonVariant(type?: ButtonVariantType): type is "
|
|
4
|
+
declare function isUnBorderedButtonVariant(type?: ButtonVariantType): type is "text" | "link";
|
|
5
5
|
declare function spaceChildren(children: VNodeChild[], needInserted: boolean, style?: CSSProperties, className?: string): VNodeChild[];
|
|
6
6
|
declare const _ButtonTypes: readonly ["default", "primary", "dashed", "link", "text"];
|
|
7
7
|
type ButtonType = (typeof _ButtonTypes)[number];
|