naive-ui 2.43.1 → 2.44.0

package/lib/dialog/src/dialogProps.d.ts

@@ -39,4 +39,4 @@ declare const dialogProps: {
 };
 export type DialogProps = ExtractPublicPropTypes<typeof dialogProps>;
 export { dialogProps };
-export declare const dialogPropKeys: ("type" | "content" | "title" | "icon" | "onClose" | "action" | "loading" | "showIcon" | "bordered" | "closable" | "iconPlacement" | "contentClass" | "contentStyle" | "closeFocusable" | "negativeText" | "positiveText" | "positiveButtonProps" | "negativeButtonProps" | "titleClass" | "titleStyle" | "actionClass" | "actionStyle" | "onPositiveClick" | "onNegativeClick")[];
+export declare const dialogPropKeys: ("type" | "title" | "showIcon" | "bordered" | "closable" | "onClose" | "icon" | "content" | "contentClass" | "contentStyle" | "loading" | "iconPlacement" | "action" | "closeFocusable" | "negativeText" | "positiveText" | "positiveButtonProps" | "negativeButtonProps" | "titleClass" | "titleStyle" | "actionClass" | "actionStyle" | "onPositiveClick" | "onNegativeClick")[];

package/lib/dialog/src/styles/index.cssr.js

@@ -46,23 +46,23 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('dialog', `
  border-color .3s var(--n-bezier),
  background-color .3s var(--n-bezier),
  color .3s var(--n-bezier);
- `, [(0, cssr_1.cE)('icon', {
-  color: 'var(--n-icon-color)'
-}), (0, cssr_1.cM)('bordered', {
-  border: 'var(--n-border)'
-}), (0, cssr_1.cM)('icon-top', [(0, cssr_1.cE)('close', {
-  margin: 'var(--n-close-margin)'
-}), (0, cssr_1.cE)('icon', {
-  margin: 'var(--n-icon-margin)'
-}), (0, cssr_1.cE)('content', {
-  textAlign: 'center'
-}), (0, cssr_1.cE)('title', {
-  justifyContent: 'center'
-}), (0, cssr_1.cE)('action', {
-  justifyContent: 'center'
-})]), (0, cssr_1.cM)('icon-left', [(0, cssr_1.cE)('icon', {
-  margin: 'var(--n-icon-margin)'
-}), (0, cssr_1.cM)('closable', [(0, cssr_1.cE)('title', `
+ `, [(0, cssr_1.cE)('icon', `
+ color: var(--n-icon-color);
+ `), (0, cssr_1.cM)('bordered', `
+ border: var(--n-border);
+ `), (0, cssr_1.cM)('icon-top', [(0, cssr_1.cE)('close', `
+ margin: var(--n-close-margin);
+ `), (0, cssr_1.cE)('icon', `
+ margin: var(--n-icon-margin);
+ `), (0, cssr_1.cE)('content', `
+ text-align: center;
+ `), (0, cssr_1.cE)('title', `
+ justify-content: center;
+ `), (0, cssr_1.cE)('action', `
+ justify-content: center;
+ `)]), (0, cssr_1.cM)('icon-left', [(0, cssr_1.cE)('icon', `
+ margin: var(--n-icon-margin);
+ `), (0, cssr_1.cM)('closable', [(0, cssr_1.cE)('title', `
  padding-right: calc(var(--n-close-size) + 6px);
  `)])]), (0, cssr_1.cE)('close', `
  position: absolute;

package/lib/divider/src/Divider.d.ts

@@ -79,8 +79,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         fontWeight: string;
     }, any>>>;
 }>> & Readonly<{}>, {
-    readonly dashed: boolean;
     readonly vertical: boolean;
+    readonly dashed: boolean;
     readonly titlePlacement: "left" | "right" | "center";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/lib/drawer/src/Drawer.d.ts

@@ -645,13 +645,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         }, any>;
     }>>>;
 }>> & Readonly<{}>, {
-    readonly show: boolean;
-    readonly autoFocus: boolean;
     readonly placement: Placement;
+    readonly show: boolean;
     readonly displayDirective: "show" | "if";
     readonly resizable: boolean;
     readonly blockScroll: boolean;
     readonly closeOnEsc: boolean;
+    readonly autoFocus: boolean;
     readonly maskClosable: boolean;
     readonly showMask: boolean | "transparent";
     readonly nativeScrollbar: boolean;

package/lib/drawer/src/DrawerBodyWrapper.d.ts

@@ -196,9 +196,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     onEsc: PropType<(e: KeyboardEvent) => void>;
 }>> & Readonly<{}>, {
     show: boolean | undefined;
-    autoFocus: boolean;
     resizable: boolean;
     blockScroll: boolean;
+    autoFocus: boolean;
     trapFocus: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/lib/dropdown/index.d.ts

@@ -1,3 +1,4 @@
 export { dropdownProps, default as NDropdown } from './src/Dropdown';
 export type { DropdownProps } from './src/Dropdown';
 export type { DropdownDividerOption, DropdownGroupOption, DropdownMenuProps, NodeProps as DropdownNodeProps, DropdownOption, DropdownRenderOption } from './src/interface';
+export type * from './src/public-types';

package/lib/dropdown/src/Dropdown.d.ts

@@ -3,6 +3,7 @@ import type { PropType, Ref } from 'vue';
 import type { FollowerPlacement } from 'vueuc';
 import type { ExtractPublicPropTypes, MaybeArray } from '../../_utils';
 import type { DropdownMenuProps, DropdownMixedOption, NodeProps, OnUpdateValue, OnUpdateValueImpl, RenderIcon, RenderIconImpl, RenderLabel, RenderLabelImpl, RenderOption, RenderOptionImpl } from './interface';
+import type { DropdownSize } from './public-types';
 export interface DropdownInjection {
     renderLabelRef: Ref<RenderLabelImpl | undefined>;
     renderIconRef: Ref<RenderIconImpl | undefined>;
@@ -279,10 +280,7 @@ export declare const dropdownProps: {
         readonly type: BooleanConstructor;
         readonly default: true;
     };
-    readonly size: {
-        readonly type: PropType<"small" | "medium" | "large" | "huge">;
-        readonly default: "medium";
-    };
+    readonly size: PropType<DropdownSize>;
     readonly inverted: BooleanConstructor;
     readonly placement: {
         readonly type: PropType<FollowerPlacement>;
@@ -650,10 +648,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         readonly type: BooleanConstructor;
         readonly default: true;
     };
-    readonly size: {
-        readonly type: PropType<"small" | "medium" | "large" | "huge">;
-        readonly default: "medium";
-    };
+    readonly size: PropType<DropdownSize>;
     readonly inverted: BooleanConstructor;
     readonly placement: {
         readonly type: PropType<FollowerPlacement>;
@@ -1133,10 +1128,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         readonly type: BooleanConstructor;
         readonly default: true;
     };
-    readonly size: {
-        readonly type: PropType<"small" | "medium" | "large" | "huge">;
-        readonly default: "medium";
-    };
+    readonly size: PropType<DropdownSize>;
     readonly inverted: BooleanConstructor;
     readonly placement: {
         readonly type: PropType<FollowerPlacement>;
@@ -1245,28 +1237,27 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     readonly minWidth: NumberConstructor;
     readonly maxWidth: NumberConstructor;
 }>> & Readonly<{}>, {
-    readonly options: DropdownMixedOption[];
-    readonly size: "small" | "medium" | "large" | "huge";
-    readonly to: string | boolean | HTMLElement;
     readonly disabled: boolean;
-    readonly show: boolean | undefined;
-    readonly flip: boolean;
+    readonly raw: boolean;
     readonly width: number | "trigger";
     readonly duration: number;
-    readonly raw: boolean;
+    readonly scrollable: boolean;
+    readonly trigger: import("../../popover").PopoverTrigger;
+    readonly to: string | boolean | HTMLElement;
     readonly placement: FollowerPlacement;
+    readonly options: DropdownMixedOption[];
+    readonly show: boolean | undefined;
     readonly keyboard: boolean;
     readonly showArrow: boolean;
-    readonly trigger: import("../../popover").PopoverTrigger;
     readonly arrow: boolean | undefined;
     readonly defaultShow: boolean;
     readonly delay: number;
     readonly arrowPointToCenter: boolean;
     readonly displayDirective: "show" | "if";
+    readonly flip: boolean;
     readonly animated: boolean;
     readonly overlap: boolean;
     readonly keepAliveOnHover: boolean;
-    readonly scrollable: boolean;
     readonly internalDeactivateImmediately: boolean;
     readonly internalSyncTargetWithParent: boolean;
     readonly internalInheritedEventHandlers: import("../../popover/src/Popover").TriggerEventHandlers[];

package/lib/dropdown/src/Dropdown.js

@@ -24,10 +24,7 @@ const dropdownBaseProps = {
         type: Boolean,
         default: true
     },
-    size: {
-        type: String,
-        default: 'medium'
-    },
+    size: String,
     inverted: Boolean,
     placement: {
         type: String,
@@ -125,7 +122,11 @@ exports.default = (0, vue_1.defineComponent)({
                 Escape: handleKeydownEsc
             }
         }, keyboardEnabledRef);
-        const { mergedClsPrefixRef, inlineThemeDisabled } = (0, _mixins_1.useConfig)(props);
+        const { mergedClsPrefixRef, inlineThemeDisabled, mergedComponentPropsRef } = (0, _mixins_1.useConfig)(props);
+        const mergedSizeRef = (0, vue_1.computed)(() => {
+            var _a, _b;
+            return (props.size || ((_b = (_a = mergedComponentPropsRef === null || mergedComponentPropsRef === void 0 ? void 0 : mergedComponentPropsRef.value) === null || _a === void 0 ? void 0 : _a.Dropdown) === null || _b === void 0 ? void 0 : _b.size) || 'medium');
+        });
         const themeRef = (0, _mixins_1.useTheme)('Dropdown', '-dropdown', index_cssr_1.default, styles_1.dropdownLight, props, mergedClsPrefixRef);
         (0, vue_1.provide)(context_1.dropdownInjectionKey, {
             labelFieldRef: (0, vue_1.toRef)(props, 'labelField'),
@@ -238,7 +239,8 @@ exports.default = (0, vue_1.defineComponent)({
             }
         }
         const cssVarsRef = (0, vue_1.computed)(() => {
-            const { size, inverted } = props;
+            const { inverted } = props;
+            const size = mergedSizeRef.value;
             const { common: { cubicBezierEaseInOut }, self } = themeRef.value;
             const { padding, dividerColor, borderRadius, optionOpacityDisabled, [(0, _utils_1.createKey)('optionIconSuffixWidth', size)]: optionIconSuffixWidth, [(0, _utils_1.createKey)('optionSuffixWidth', size)]: optionSuffixWidth, [(0, _utils_1.createKey)('optionIconPrefixWidth', size)]: optionIconPrefixWidth, [(0, _utils_1.createKey)('optionPrefixWidth', size)]: optionPrefixWidth, [(0, _utils_1.createKey)('fontSize', size)]: fontSize, [(0, _utils_1.createKey)('optionHeight', size)]: optionHeight, [(0, _utils_1.createKey)('optionIconSize', size)]: optionIconSize } = self;
             const vars = {
@@ -286,7 +288,7 @@ exports.default = (0, vue_1.defineComponent)({
             return vars;
         });
         const themeClassHandle = inlineThemeDisabled
-            ? (0, _mixins_1.useThemeClass)('dropdown', (0, vue_1.computed)(() => `${props.size[0]}${props.inverted ? 'i' : ''}`), cssVarsRef, props)
+            ? (0, _mixins_1.useThemeClass)('dropdown', (0, vue_1.computed)(() => `${mergedSizeRef.value[0]}${props.inverted ? 'i' : ''}`), cssVarsRef, props)
             : undefined;
         return {
             mergedClsPrefix: mergedClsPrefixRef,

package/lib/dropdown/src/DropdownMenu.d.ts

@@ -40,8 +40,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: null;
     };
 }>> & Readonly<{}>, {
-    showArrow: boolean;
     scrollable: boolean;
+    showArrow: boolean;
     tmNodes: TreeNode<import("../..").MenuOption, import("../..").MenuGroupOption, import("../../menu/src/interface").MenuIgnoredOption>[];
     parentKey: string | number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/lib/dropdown/src/DropdownOption.d.ts

@@ -69,8 +69,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     props: PropType<HTMLAttributes>;
     scrollable: BooleanConstructor;
 }>> & Readonly<{}>, {
-    placement: FollowerPlacement;
     scrollable: boolean;
+    placement: FollowerPlacement;
     parentKey: string | number | null;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/lib/dropdown/src/public-types.d.ts

@@ -0,0 +1 @@
+export type DropdownSize = 'small' | 'medium' | 'large' | 'huge';

package/lib/dropdown/src/public-types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/dynamic-input/src/DynamicInput.d.ts

@@ -1799,7 +1799,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         create: string;
     }>;
     rtlEnabled: import("vue").Ref<import("../../config-provider/src/internal-interface").RtlItem | undefined, import("../../config-provider/src/internal-interface").RtlItem | undefined> | undefined;
-    buttonSize: import("vue").ComputedRef<import("../../button/src/interface").Size | undefined>;
+    buttonSize: import("vue").ComputedRef<import("../../button").ButtonSize | undefined>;
     mergedClsPrefix: import("vue").Ref<string, string>;
     NFormItem: import("../../_mixins/use-form-item").FormItemInjection | null;
     uncontrolledValue: import("vue").Ref<any[], any[]>;
@@ -3021,10 +3021,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         }, any>;
     }>>>;
 }>> & Readonly<{}>, {
-    readonly placeholder: string;
     readonly disabled: boolean;
-    readonly min: number;
     readonly defaultValue: any[];
+    readonly placeholder: string;
+    readonly min: number;
     readonly preset: "input" | "pair";
     readonly keyPlaceholder: string;
     readonly valuePlaceholder: string;

package/lib/dynamic-tags/index.d.ts

@@ -1,3 +1,4 @@
 export { dynamicTagsProps, default as NDynamicTags } from './src/DynamicTags';
 export type { DynamicTagsProps, DynamicTagsSlots } from './src/DynamicTags';
 export type { DynamicTagsInputSlotProps, DynamicTagsOption, DynamicTagsTriggerSlotProps } from './src/interface';
+export type * from './src/public-types';

package/lib/dynamic-tags/src/DynamicTags.d.ts

@@ -2,11 +2,9 @@ import type { CSSProperties, PropType, SlotsType, VNode, VNodeChild } from 'vue'
 import type { ExtractPublicPropTypes, MaybeArray } from '../../_utils';
 import type { InputProps } from '../../input';
 import type { DynamicTagsInputSlotProps, DynamicTagsOption, DynamicTagsTriggerSlotProps, OnCreate, OnUpdateValue } from './interface';
+import type { DynamicTagsSize } from './public-types';
 export declare const dynamicTagsProps: {
-    size: {
-        type: PropType<"small" | "medium" | "large">;
-        default: string;
-    };
+    size: PropType<DynamicTagsSize>;
     closable: {
         type: BooleanConstructor;
         default: boolean;
@@ -1176,10 +1174,7 @@ export interface DynamicTagsSlots {
     default?: () => VNode[];
 }
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    size: {
-        type: PropType<"small" | "medium" | "large">;
-        default: string;
-    };
+    size: PropType<DynamicTagsSize>;
     closable: {
         type: BooleanConstructor;
         default: boolean;
@@ -2381,7 +2376,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         scrollTo: (options: ScrollToOptions) => void;
     } | null>;
     localizedAdd: import("vue").ComputedRef<string>;
-    inputSize: import("vue").ComputedRef<"small" | "medium" | "tiny">;
+    inputSize: import("vue").ComputedRef<"tiny" | "small" | "medium">;
+    mergedSize: import("vue").ComputedRef<DynamicTagsSize>;
     inputValue: import("vue").Ref<string, string>;
     showInput: import("vue").Ref<boolean, boolean>;
     inputForceFocused: import("vue").Ref<boolean, boolean>;
@@ -2815,10 +2811,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     themeClass: import("vue").Ref<string, string> | undefined;
     onRender: (() => void) | undefined;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    size: {
-        type: PropType<"small" | "medium" | "large">;
-        default: string;
-    };
+    size: PropType<DynamicTagsSize>;
     closable: {
         type: BooleanConstructor;
         default: boolean;
@@ -3981,12 +3974,11 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         }, any>;
     }>>>;
 }>> & Readonly<{}>, {
-    type: "default" | "error" | "info" | "warning" | "success" | "primary";
-    size: "small" | "medium" | "large";
     disabled: boolean | undefined;
-    round: boolean;
+    type: "default" | "info" | "warning" | "error" | "success" | "primary";
     closable: boolean;
     defaultValue: (string | DynamicTagsOption)[];
+    round: boolean;
     onCreate: OnCreate;
 }, SlotsType<DynamicTagsSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/lib/dynamic-tags/src/DynamicTags.js

@@ -17,10 +17,7 @@ const tag_1 = require("../../tag");
 const common_props_1 = __importDefault(require("../../tag/src/common-props"));
 const styles_1 = require("../styles");
 const index_cssr_1 = __importDefault(require("./styles/index.cssr"));
-exports.dynamicTagsProps = Object.assign(Object.assign(Object.assign({}, _mixins_1.useTheme.props), common_props_1.default), { size: {
-        type: String,
-        default: 'medium'
-    }, closable: {
+exports.dynamicTagsProps = Object.assign(Object.assign(Object.assign({}, _mixins_1.useTheme.props), common_props_1.default), { size: String, closable: {
         type: Boolean,
         default: true
     }, defaultValue: {
@@ -44,7 +41,13 @@ exports.default = (0, vue_1.defineComponent)({
                 }
             });
         }
-        const { mergedClsPrefixRef, inlineThemeDisabled } = (0, _mixins_1.useConfig)(props);
+        const { mergedClsPrefixRef, inlineThemeDisabled, mergedComponentPropsRef } = (0, _mixins_1.useConfig)(props);
+        const mergedSizeRef = (0, vue_1.computed)(() => {
+            var _a, _b;
+            return (props.size
+                || ((_b = (_a = mergedComponentPropsRef === null || mergedComponentPropsRef === void 0 ? void 0 : mergedComponentPropsRef.value) === null || _a === void 0 ? void 0 : _a.DynamicTags) === null || _b === void 0 ? void 0 : _b.size)
+                || 'medium');
+        });
         const { localeRef } = (0, _mixins_1.useLocale)('DynamicTags');
         const formItem = (0, _mixins_1.useFormItem)(props);
         const { mergedDisabledRef } = formItem;
@@ -60,7 +63,7 @@ exports.default = (0, vue_1.defineComponent)({
             return localeRef.value.add;
         });
         const inputSizeRef = (0, vue_1.computed)(() => {
-            return (0, _utils_1.smallerSize)(props.size);
+            return (0, _utils_1.smallerSize)(mergedSizeRef.value);
         });
         const triggerDisabledRef = (0, vue_1.computed)(() => {
             return (mergedDisabledRef.value
@@ -126,6 +129,7 @@ exports.default = (0, vue_1.defineComponent)({
             inputInstRef,
             localizedAdd: localizedAddRef,
             inputSize: inputSizeRef,
+            mergedSize: mergedSizeRef,
             inputValue: inputValueRef,
             showInput: showInputRef,
             inputForceFocused: inputForceFocusedRef,
@@ -148,9 +152,9 @@ exports.default = (0, vue_1.defineComponent)({
         onRender === null || onRender === void 0 ? void 0 : onRender();
         return ((0, vue_1.h)(space_1.NSpace, { class: [`${mergedClsPrefix}-dynamic-tags`, this.themeClass], size: "small", style: cssVars, theme: mergedTheme.peers.Space, themeOverrides: mergedTheme.peerOverrides.Space, itemStyle: "display: flex;" }, {
             default: () => {
-                const { mergedTheme, tagClass, tagStyle, type, round, size, color, closable, mergedDisabled, showInput, inputValue, inputClass, inputStyle, inputSize, inputForceFocused, triggerDisabled, handleInputKeyDown, handleInputBlur, handleAddClick, handleCloseClick, handleInputConfirm, $slots } = this;
+                const { mergedTheme, tagClass, tagStyle, type, round, mergedSize, color, closable, mergedDisabled, showInput, inputValue, inputClass, inputStyle, inputSize, inputForceFocused, triggerDisabled, handleInputKeyDown, handleInputBlur, handleAddClick, handleCloseClick, handleInputConfirm, $slots } = this;
                 return this.mergedValue
-                    .map((tag, index) => renderTag ? (renderTag(tag, index)) : ((0, vue_1.h)(tag_1.NTag, { key: index, theme: mergedTheme.peers.Tag, themeOverrides: mergedTheme.peerOverrides.Tag, class: tagClass, style: tagStyle, type: type, round: round, size: size, color: color, closable: closable, disabled: mergedDisabled, onClose: () => {
+                    .map((tag, index) => renderTag ? (renderTag(tag, index)) : ((0, vue_1.h)(tag_1.NTag, { key: index, theme: mergedTheme.peers.Tag, themeOverrides: mergedTheme.peerOverrides.Tag, class: tagClass, style: tagStyle, type: type, round: round, size: mergedSize, color: color, closable: closable, disabled: mergedDisabled, onClose: () => {
                         handleCloseClick(index);
                     } }, {
                     default: () => (typeof tag === 'string' ? tag : tag.label)

package/lib/dynamic-tags/src/public-types.d.ts

@@ -0,0 +1 @@
+export type DynamicTagsSize = 'small' | 'medium' | 'large';

package/lib/dynamic-tags/src/public-types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/empty/src/Empty.d.ts

@@ -202,7 +202,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         iconSizeHuge: string;
     }, any>>>;
 }>> & Readonly<{}>, {
-    size: "small" | "medium" | "large" | "tiny" | "huge";
+    size: "tiny" | "small" | "medium" | "large" | "huge";
     showIcon: boolean;
     showDescription: boolean;
 }, SlotsType<EmptySlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/lib/flex/src/Flex.d.ts

@@ -107,11 +107,11 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         gapLarge: string;
     }, any>>>;
 }>> & Readonly<{}>, {
-    readonly inline: boolean;
-    readonly size: number | [number, number] | "small" | "medium" | "large";
     readonly reverse: boolean;
-    readonly wrap: boolean;
+    readonly size: number | "small" | "medium" | "large" | [number, number];
     readonly vertical: boolean;
+    readonly inline: boolean;
     readonly justify: import("csstype").Property.JustifyContent;
+    readonly wrap: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/lib/form/src/Form.d.ts

@@ -1,6 +1,7 @@
 import type { ExtractPropTypes, PropType } from 'vue';
 import type { ExtractPublicPropTypes } from '../../_utils';
-import type { FormInst, FormRules, FormValidateMessages, LabelAlign, LabelPlacement, Size } from './interface';
+import type { FormInst, FormRules, FormValidateMessages, LabelAlign, LabelPlacement } from './interface';
+import type { FormSize } from './public-types';
 export declare const formProps: {
     readonly inline: BooleanConstructor;
     readonly labelWidth: PropType<number | string>;
@@ -15,7 +16,7 @@ export declare const formProps: {
     };
     readonly rules: PropType<FormRules>;
     readonly disabled: BooleanConstructor;
-    readonly size: PropType<Size>;
+    readonly size: PropType<FormSize>;
     readonly showRequireMark: {
         readonly type: PropType<boolean | undefined>;
         readonly default: undefined;
@@ -147,7 +148,7 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     };
     readonly rules: PropType<FormRules>;
     readonly disabled: BooleanConstructor;
-    readonly size: PropType<Size>;
+    readonly size: PropType<FormSize>;
     readonly showRequireMark: {
         readonly type: PropType<boolean | undefined>;
         readonly default: undefined;
@@ -278,7 +279,7 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     };
     readonly rules: PropType<FormRules>;
     readonly disabled: BooleanConstructor;
-    readonly size: PropType<Size>;
+    readonly size: PropType<FormSize>;
     readonly showRequireMark: {
         readonly type: PropType<boolean | undefined>;
         readonly default: undefined;
@@ -394,9 +395,9 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
         labelFontWeight: string;
     }, any>>>;
 }>> & Readonly<{}>, {
-    readonly inline: boolean;
     readonly disabled: boolean;
     readonly onSubmit: (e: Event) => void;
+    readonly inline: boolean;
     readonly labelPlacement: LabelPlacement;
     readonly model: Record<string, any>;
     readonly showRequireMark: boolean | undefined;

package/lib/form/src/Form.js

@@ -57,6 +57,15 @@ exports.default = (0, vue_1.defineComponent)({
                 maxChildLabelWidthRef.value = currentWidth;
             }
         };
+        function invalidateLabelWidth() {
+            var _a;
+            for (const key of (0, _utils_1.keysOf)(formItems)) {
+                const formItemInstances = formItems[key];
+                for (const formItemInstance of formItemInstances) {
+                    (_a = formItemInstance.invalidateLabelWidth) === null || _a === void 0 ? void 0 : _a.call(formItemInstance);
+                }
+            }
+        }
         function validate(validateCallback_1) {
             return __awaiter(this, arguments, void 0, function* (validateCallback, shouldRuleBeApplied = () => true) {
                 return yield new Promise((resolve, reject) => {
@@ -115,7 +124,8 @@ exports.default = (0, vue_1.defineComponent)({
         (0, vue_1.provide)(context_1.formItemInstsInjectionKey, { formItems });
         const formExposedMethod = {
             validate,
-            restoreValidation
+            restoreValidation,
+            invalidateLabelWidth
         };
         return Object.assign(formExposedMethod, {
             mergedClsPrefix: mergedClsPrefixRef

package/lib/form/src/FormItem.d.ts

@@ -1,6 +1,6 @@
-import type { CSSProperties, ExtractPropTypes, LabelHTMLAttributes, PropType, VNodeChild } from 'vue';
+import type { CSSProperties, ExtractPropTypes, LabelHTMLAttributes, PropType, SlotsType, VNodeChild } from 'vue';
 import type { ExtractPublicPropTypes } from '../../_utils';
-import type { FormItemInternalValidate, FormItemRule, LabelAlign, LabelPlacement } from './interface';
+import type { FormItemInternalValidate, FormItemRule, FormItemSlots, LabelAlign, LabelPlacement } from './interface';
 export declare const formItemProps: {
     readonly label: StringConstructor;
     readonly labelWidth: PropType<string | number>;
@@ -133,7 +133,7 @@ export declare const formItemProps: {
 };
 export type FormItemSetupProps = ExtractPropTypes<typeof formItemProps>;
 export type FormItemProps = ExtractPublicPropTypes<typeof formItemProps>;
-export declare const formItemPropKeys: ("label" | "size" | "first" | "required" | "path" | "theme" | "themeOverrides" | "builtinThemeOverrides" | "contentClass" | "contentStyle" | "labelPlacement" | "labelAlign" | "labelStyle" | "labelWidth" | "showRequireMark" | "requireMarkPlacement" | "showFeedback" | "showLabel" | "rulePath" | "rule" | "ignorePathChange" | "validationStatus" | "feedback" | "feedbackClass" | "feedbackStyle" | "labelProps")[];
+export declare const formItemPropKeys: ("label" | "size" | "theme" | "themeOverrides" | "builtinThemeOverrides" | "contentClass" | "contentStyle" | "first" | "labelPlacement" | "labelAlign" | "labelStyle" | "required" | "labelWidth" | "showRequireMark" | "requireMarkPlacement" | "showFeedback" | "showLabel" | "path" | "rulePath" | "rule" | "ignorePathChange" | "validationStatus" | "feedback" | "feedbackClass" | "feedbackStyle" | "labelProps")[];
 declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     readonly label: StringConstructor;
     readonly labelWidth: PropType<string | number>;
@@ -286,9 +286,10 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     onRender: (() => void) | undefined;
     validate: import("./interface").FormItemValidate;
     restoreValidation: () => void;
+    invalidateLabelWidth: () => void;
     path?: string;
     internalValidate: FormItemInternalValidate;
-    mergedSize: import("vue").ComputedRef<import("./interface").Size>;
+    mergedSize: import("vue").ComputedRef<import("./public-types").FormItemSize>;
     validationErrored: import("vue").Ref<boolean, boolean>;
     validationWarned: import("vue").Ref<boolean, boolean>;
     mergedLabelStyle: import("vue").ComputedRef<import("vue").StyleValue[]>;
@@ -296,7 +297,7 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     mergedLabelAlign: import("vue").ComputedRef<LabelAlign | undefined>;
     mergedShowRequireMark: import("vue").ComputedRef<boolean | undefined>;
     mergedRequireMarkPlacement: import("vue").ComputedRef<"left" | "right" | "right-hanging">;
-    mergedValidationStatus: import("vue").ComputedRef<"error" | "warning" | "success" | undefined>;
+    mergedValidationStatus: import("vue").ComputedRef<"warning" | "error" | "success" | undefined>;
     mergedShowFeedback: import("vue").ComputedRef<boolean>;
     mergedShowLabel: import("vue").ComputedRef<boolean>;
     isAutoLabelWidth: import("vue").ComputedRef<boolean>;
@@ -451,5 +452,5 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     readonly showFeedback: boolean | undefined;
     readonly showLabel: boolean | undefined;
     readonly ignorePathChange: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}, SlotsType<FormItemSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/lib/form/src/FormItem.js

@@ -70,6 +70,7 @@ function wrapValidator(validator, async) {
 exports.default = (0, vue_1.defineComponent)({
     name: 'FormItem',
     props: exports.formItemProps,
+    slots: Object,
     setup(props) {
         (0, _utils_1.useInjectionInstanceCollection)(context_1.formItemInstsInjectionKey, 'formItems', (0, vue_1.toRef)(props, 'path'));
         const { mergedClsPrefixRef, inlineThemeDisabled } = (0, _mixins_1.useConfig)(props);
@@ -82,6 +83,7 @@ exports.default = (0, vue_1.defineComponent)({
         const { mergedLabelPlacement: labelPlacementRef, mergedLabelAlign: labelTextAlignRef, mergedRequireMarkPlacement: mergedRequireMarkPlacementRef } = formItemMiscRefs;
         const renderExplainsRef = (0, vue_1.ref)([]);
         const feedbackIdRef = (0, vue_1.ref)((0, seemly_1.createId)());
+        const labelElementRef = (0, vue_1.ref)(null);
         const mergedDisabledRef = NForm
             ? (0, vue_1.toRef)(NForm.props, 'disabled')
             : (0, vue_1.ref)(false);
@@ -91,6 +93,18 @@ exports.default = (0, vue_1.defineComponent)({
                 return;
             restoreValidation();
         });
+        function invalidateLabelWidth() {
+            if (!formItemMiscRefs.isAutoLabelWidth.value)
+                return;
+            const labelElement = labelElementRef.value;
+            if (labelElement !== null) {
+                const memoizedWhitespace = labelElement.style.whiteSpace;
+                labelElement.style.whiteSpace = 'nowrap';
+                labelElement.style.width = '';
+                NForm === null || NForm === void 0 ? void 0 : NForm.deriveMaxChildLabelWidth(Number(getComputedStyle(labelElement).width.slice(0, -2)));
+                labelElement.style.whiteSpace = memoizedWhitespace;
+            }
+        }
         function restoreValidation() {
             renderExplainsRef.value = [];
             validationErroredRef.value = false;
@@ -273,21 +287,10 @@ exports.default = (0, vue_1.defineComponent)({
         const exposedRef = {
             validate,
             restoreValidation,
-            internalValidate
+            internalValidate,
+            invalidateLabelWidth
         };
-        const labelElementRef = (0, vue_1.ref)(null);
-        (0, vue_1.onMounted)(() => {
-            if (!formItemMiscRefs.isAutoLabelWidth.value)
-                return;
-            const labelElement = labelElementRef.value;
-            if (labelElement !== null) {
-                const memoizedWhitespace = labelElement.style.whiteSpace;
-                labelElement.style.whiteSpace = 'nowrap';
-                labelElement.style.width = '';
-                NForm === null || NForm === void 0 ? void 0 : NForm.deriveMaxChildLabelWidth(Number(getComputedStyle(labelElement).width.slice(0, -2)));
-                labelElement.style.whiteSpace = memoizedWhitespace;
-            }
-        });
+        (0, vue_1.onMounted)(invalidateLabelWidth);
         const cssVarsRef = (0, vue_1.computed)(() => {
             var _a;
             const { value: size } = mergedSizeRef;