naive-ui 2.24.6 → 2.25.2

package/lib/_mixins/use-form-item.d.ts

@@ -1,10 +1,12 @@
 import { ComputedRef, Ref } from 'vue';
+import type { FormValidationStatus } from '../form/src/interface';
 declare type FormItemSize = 'small' | 'medium' | 'large';
 declare type AllowedSize = 'tiny' | 'small' | 'medium' | 'large' | 'huge' | number;
 export interface FormItemInjection {
     path: Ref<string | undefined>;
     disabled: Ref<boolean>;
     mergedSize: ComputedRef<FormItemSize>;
+    mergedValidationStatus: ComputedRef<FormValidationStatus | undefined>;
     restoreValidation: () => void;
     handleContentBlur: () => void;
     handleContentFocus: () => void;
@@ -20,10 +22,12 @@ interface UseFormItemOptions<T> {
 interface UseFormItemProps<T> {
     size?: T;
     disabled?: boolean;
+    status?: FormValidationStatus;
 }
 export interface UseFormItem<T> {
     mergedSizeRef: ComputedRef<T>;
     mergedDisabledRef: ComputedRef<boolean>;
+    mergedStatusRef: ComputedRef<FormValidationStatus | undefined>;
     nTriggerFormBlur: () => void;
     nTriggerFormChange: () => void;
     nTriggerFormFocus: () => void;

package/lib/_mixins/use-form-item.js

@@ -33,6 +33,12 @@ function useFormItem(props, { defaultSize = 'medium', mergedSize, mergedDisabled
             }
             return false;
         });
+    const mergedStatusRef = (0, vue_1.computed)(() => {
+        const { status } = props;
+        if (status)
+            return status;
+        return NFormItem === null || NFormItem === void 0 ? void 0 : NFormItem.mergedValidationStatus.value;
+    });
     (0, vue_1.onBeforeUnmount)(() => {
         if (NFormItem) {
             NFormItem.restoreValidation();
@@ -41,6 +47,7 @@ function useFormItem(props, { defaultSize = 'medium', mergedSize, mergedDisabled
     return {
         mergedSizeRef,
         mergedDisabledRef,
+        mergedStatusRef,
         nTriggerFormBlur() {
             if (NFormItem) {
                 NFormItem.handleContentBlur();

package/lib/_mixins/use-hljs.js

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const vue_1 = require("vue");
-const ConfigProvider_1 = require("../config-provider/src/ConfigProvider");
+const context_1 = require("../config-provider/src/context");
 const _utils_1 = require("../_utils");
 function useHljs(props, shouldHighlightRef) {
-    const NConfigProvider = (0, vue_1.inject)(ConfigProvider_1.configProviderInjectionKey, null);
+    const NConfigProvider = (0, vue_1.inject)(context_1.configProviderInjectionKey, null);
     if (process.env.NODE_ENV !== 'production') {
         const warnHljs = () => {
             if (!props.hljs && !(NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedHljsRef.value)) {

package/lib/_mixins/use-locale.js

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const vue_1 = require("vue");
 const locales_1 = require("../locales");
-const ConfigProvider_1 = require("../config-provider/src/ConfigProvider");
+const context_1 = require("../config-provider/src/context");
 function useLocale(ns) {
-    const { mergedLocaleRef, mergedDateLocaleRef } = (0, vue_1.inject)(ConfigProvider_1.configProviderInjectionKey, null) || {};
+    const { mergedLocaleRef, mergedDateLocaleRef } = (0, vue_1.inject)(context_1.configProviderInjectionKey, null) || {};
     const localeRef = (0, vue_1.computed)(() => {
         var _a, _b;
         return (_b = (_a = mergedLocaleRef === null || mergedLocaleRef === void 0 ? void 0 : mergedLocaleRef.value) === null || _a === void 0 ? void 0 : _a[ns]) !== null && _b !== void 0 ? _b : locales_1.enUS[ns];

package/lib/_mixins/use-style.js

@@ -27,7 +27,7 @@ function useStyle(mountId, style, clsPrefixRef) {
             ssr: ssrAdapter
         });
         index_cssr_1.default.mount({
-            id: 'naive-ui/global',
+            id: 'n-global',
             head: true,
             anchorMetaName: common_1.cssrAnchorMetaName,
             ssr: ssrAdapter

package/lib/_mixins/use-theme.d.ts

@@ -42,7 +42,7 @@ export declare type MergedTheme<T> = T extends Theme<unknown, infer V, infer W>
     peers: W;
     peerOverrides: ExtractMergedPeerOverrides<T>;
 } : T;
-declare function useTheme<N, T, R>(resolveId: Exclude<keyof GlobalTheme, 'common'>, mountId: string, style: CNode | undefined, defaultTheme: Theme<N, T, R>, props: UseThemeProps<Theme<N, T, R>>, clsPrefixRef?: Ref<string | undefined>): ComputedRef<MergedTheme<Theme<N, T, R>>>;
+declare function useTheme<N, T, R>(resolveId: Exclude<keyof GlobalTheme, 'common' | 'name'>, mountId: string, style: CNode | undefined, defaultTheme: Theme<N, T, R>, props: UseThemeProps<Theme<N, T, R>>, clsPrefixRef?: Ref<string | undefined>): ComputedRef<MergedTheme<Theme<N, T, R>>>;
 declare namespace useTheme {
     var props: {
         readonly theme: ObjectConstructor;

package/lib/_mixins/use-theme.js

@@ -9,7 +9,7 @@ const vue_1 = require("vue");
 const lodash_1 = require("lodash");
 const vue3_ssr_1 = require("@css-render/vue3-ssr");
 const index_cssr_1 = __importDefault(require("../_styles/global/index.cssr"));
-const ConfigProvider_1 = require("../config-provider/src/ConfigProvider");
+const context_1 = require("../config-provider/src/context");
 const common_1 = require("./common");
 function createTheme(theme) {
     return theme;
@@ -30,7 +30,7 @@ function useTheme(resolveId, mountId, style, defaultTheme, props, clsPrefixRef)
                 ssr: ssrAdapter
             });
             index_cssr_1.default.mount({
-                id: 'naive-ui/global',
+                id: 'n-global',
                 head: true,
                 anchorMetaName: common_1.cssrAnchorMetaName,
                 ssr: ssrAdapter
@@ -43,7 +43,7 @@ function useTheme(resolveId, mountId, style, defaultTheme, props, clsPrefixRef)
             (0, vue_1.onBeforeMount)(mountStyle);
         }
     }
-    const NConfigProvider = (0, vue_1.inject)(ConfigProvider_1.configProviderInjectionKey, null);
+    const NConfigProvider = (0, vue_1.inject)(context_1.configProviderInjectionKey, null);
     const mergedThemeRef = (0, vue_1.computed)(() => {
         var _a;
         // keep props to make theme overrideable

package/lib/_utils/css/color-to-class.d.ts

@@ -0,0 +1 @@
+export declare function color2Class(color: string): string;

package/lib/_utils/css/color-to-class.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.color2Class = void 0;
+function color2Class(color) {
+    return color.replace(/#|\(|\)|,|\s/g, '_');
+}
+exports.color2Class = color2Class;

package/lib/_utils/css/format-length.d.ts

@@ -3,5 +3,5 @@ interface FormatLengthOptions {
     offset?: number;
     attachPx?: boolean;
 }
-declare function formatLength<T extends number | string | null | undefined | any>(length: T, { c, offset, attachPx }?: FormatLengthOptions): T extends null ? null : T extends undefined ? undefined : T extends string | number ? string : T;
-export default formatLength;
+export declare function formatLength<T extends number | string | null | undefined | any>(length: T, { c, offset, attachPx }?: FormatLengthOptions): T extends null ? null : T extends undefined ? undefined : T extends string | number ? string : T;
+export {};

package/lib/_utils/css/format-length.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.formatLength = void 0;
 const pureNumberRegex = /^(\d|\.)+$/;
 const numberRegex = /(\d|\.)+/;
 function formatLength(length, { c = 1, offset = 0, attachPx = true } = {}) {
@@ -30,4 +31,4 @@ function formatLength(length, { c = 1, offset = 0, attachPx = true } = {}) {
     }
     return length;
 }
-exports.default = formatLength;
+exports.formatLength = formatLength;

package/lib/_utils/css/index.d.ts

@@ -1 +1,2 @@
-export { default as formatLength } from './format-length';
+export { formatLength } from './format-length';
+export { color2Class } from './color-to-class';

package/lib/_utils/css/index.js

@@ -1,8 +1,7 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.formatLength = void 0;
+exports.color2Class = exports.formatLength = void 0;
 var format_length_1 = require("./format-length");
-Object.defineProperty(exports, "formatLength", { enumerable: true, get: function () { return __importDefault(format_length_1).default; } });
+Object.defineProperty(exports, "formatLength", { enumerable: true, get: function () { return format_length_1.formatLength; } });
+var color_to_class_1 = require("./color-to-class");
+Object.defineProperty(exports, "color2Class", { enumerable: true, get: function () { return color_to_class_1.color2Class; } });

package/lib/_utils/cssr/index.d.ts

@@ -3,10 +3,9 @@ declare const namespace = "n";
 declare const prefix: string;
 declare const c: import("css-render").createCNode<import("css-render").CSelector>, find: import("css-render").CFindTarget;
 declare const cB: import("css-render").createCNode<string | import("css-render").CLazySelector<string>>, cE: import("css-render").createCNode<string | import("css-render").CLazySelector<string>>, cM: import("css-render").createCNode<string | import("css-render").CLazySelector<string>>, cNotM: import("css-render").createCNode<string | import("css-render").CLazySelector<string>>;
-declare function insideFormItem(status: string | null, style: CNode): CNode;
 declare function insideModal(style: CNode): CNode;
 declare function insidePopover(style: CNode): CNode;
 declare function asModal(style: CProperties): CNode;
 declare const cCB: typeof cB;
-export { c, cB, cE, cM, cNotM, cCB, insideFormItem, insideModal, insidePopover, asModal, prefix, namespace, find };
+export { c, cB, cE, cM, cNotM, cCB, insideModal, insidePopover, asModal, prefix, namespace, find };
 export { createKey } from './create-key';

package/lib/_utils/cssr/index.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.createKey = exports.find = exports.namespace = exports.prefix = exports.asModal = exports.insidePopover = exports.insideModal = exports.insideFormItem = exports.cCB = exports.cNotM = exports.cM = exports.cE = exports.cB = exports.c = void 0;
+exports.createKey = exports.find = exports.namespace = exports.prefix = exports.asModal = exports.insidePopover = exports.insideModal = exports.cCB = exports.cNotM = exports.cM = exports.cE = exports.cB = exports.c = void 0;
 /* eslint-disable @typescript-eslint/restrict-template-expressions */
 const css_render_1 = __importDefault(require("css-render"));
 const plugin_bem_1 = __importDefault(require("@css-render/plugin-bem"));
@@ -28,20 +28,6 @@ exports.cB = cB;
 exports.cE = cE;
 exports.cM = cM;
 exports.cNotM = cNotM;
-function insideFormItem(status, style) {
-    if (status === null)
-        return style;
-    return c([
-        ({ props: { bPrefix } }) => c(`${bPrefix || prefix}form-item`, [
-            c(`${bPrefix || prefix}form-item-blank`, [
-                c(`&${bPrefix || prefix}form-item-blank${modifierPrefix}${status}`, [
-                    style
-                ])
-            ])
-        ])
-    ]);
-}
-exports.insideFormItem = insideFormItem;
 function insideModal(style) {
     return c(({ props: { bPrefix } }) => `${bPrefix || prefix}modal, ${bPrefix || prefix}drawer`, [style]);
 }

package/lib/_utils/index.d.ts

@@ -1,7 +1,7 @@
-export { call, keep, omit, flatten, getSlot, getVNodeChildren, keysOf, render, getFirstSlotVNode, createDataKey, createRefSetter, createInjectionKey } from './vue';
+export { call, keep, omit, flatten, getSlot, getVNodeChildren, keysOf, render, getFirstSlotVNode, createDataKey, createRefSetter, createInjectionKey, resolveSlot, resolveSlotWithProps, resolveWrappedSlot, isSlotEmpty } from './vue';
 export type { MaybeArray } from './vue';
 export { warn, warnOnce, throwError, smallerSize, largerSize, getTitleAttribute } from './naive';
 export type { ExtractPublicPropTypes, ExtractInternalPropTypes, Mutable } from './naive';
-export { formatLength } from './css';
+export { formatLength, color2Class } from './css';
 export { createKey } from './cssr';
 export * from './composable';

package/lib/_utils/index.js

@@ -10,7 +10,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.createKey = exports.formatLength = exports.getTitleAttribute = exports.largerSize = exports.smallerSize = exports.throwError = exports.warnOnce = exports.warn = exports.createInjectionKey = exports.createRefSetter = exports.createDataKey = exports.getFirstSlotVNode = exports.render = exports.keysOf = exports.getVNodeChildren = exports.getSlot = exports.flatten = exports.omit = exports.keep = exports.call = void 0;
+exports.createKey = exports.color2Class = exports.formatLength = exports.getTitleAttribute = exports.largerSize = exports.smallerSize = exports.throwError = exports.warnOnce = exports.warn = exports.isSlotEmpty = exports.resolveWrappedSlot = exports.resolveSlotWithProps = exports.resolveSlot = exports.createInjectionKey = exports.createRefSetter = exports.createDataKey = exports.getFirstSlotVNode = exports.render = exports.keysOf = exports.getVNodeChildren = exports.getSlot = exports.flatten = exports.omit = exports.keep = exports.call = void 0;
 var vue_1 = require("./vue");
 Object.defineProperty(exports, "call", { enumerable: true, get: function () { return vue_1.call; } });
 Object.defineProperty(exports, "keep", { enumerable: true, get: function () { return vue_1.keep; } });
@@ -24,6 +24,10 @@ Object.defineProperty(exports, "getFirstSlotVNode", { enumerable: true, get: fun
 Object.defineProperty(exports, "createDataKey", { enumerable: true, get: function () { return vue_1.createDataKey; } });
 Object.defineProperty(exports, "createRefSetter", { enumerable: true, get: function () { return vue_1.createRefSetter; } });
 Object.defineProperty(exports, "createInjectionKey", { enumerable: true, get: function () { return vue_1.createInjectionKey; } });
+Object.defineProperty(exports, "resolveSlot", { enumerable: true, get: function () { return vue_1.resolveSlot; } });
+Object.defineProperty(exports, "resolveSlotWithProps", { enumerable: true, get: function () { return vue_1.resolveSlotWithProps; } });
+Object.defineProperty(exports, "resolveWrappedSlot", { enumerable: true, get: function () { return vue_1.resolveWrappedSlot; } });
+Object.defineProperty(exports, "isSlotEmpty", { enumerable: true, get: function () { return vue_1.isSlotEmpty; } });
 var naive_1 = require("./naive");
 Object.defineProperty(exports, "warn", { enumerable: true, get: function () { return naive_1.warn; } });
 Object.defineProperty(exports, "warnOnce", { enumerable: true, get: function () { return naive_1.warnOnce; } });
@@ -33,6 +37,7 @@ Object.defineProperty(exports, "largerSize", { enumerable: true, get: function (
 Object.defineProperty(exports, "getTitleAttribute", { enumerable: true, get: function () { return naive_1.getTitleAttribute; } });
 var css_1 = require("./css");
 Object.defineProperty(exports, "formatLength", { enumerable: true, get: function () { return css_1.formatLength; } });
+Object.defineProperty(exports, "color2Class", { enumerable: true, get: function () { return css_1.color2Class; } });
 var cssr_1 = require("./cssr");
 Object.defineProperty(exports, "createKey", { enumerable: true, get: function () { return cssr_1.createKey; } });
 __exportStar(require("./composable"), exports);

package/lib/_utils/vue/index.d.ts

@@ -10,5 +10,5 @@ export { getFirstSlotVNode } from './get-first-slot-vnode';
 export { createDataKey } from './create-data-key';
 export { createRefSetter } from './create-ref-setter';
 export { createInjectionKey } from './create-injection-key';
-export { resolveSlot } from './resolve-slot';
+export { resolveSlot, resolveWrappedSlot, resolveSlotWithProps, isSlotEmpty } from './resolve-slot';
 export type { MaybeArray } from './call';

package/lib/_utils/vue/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.resolveSlot = exports.createInjectionKey = exports.createRefSetter = exports.createDataKey = exports.getFirstSlotVNode = exports.render = exports.keysOf = exports.call = exports.flatten = exports.omit = exports.keep = exports.getVNodeChildren = exports.getSlot = void 0;
+exports.isSlotEmpty = exports.resolveSlotWithProps = exports.resolveWrappedSlot = exports.resolveSlot = exports.createInjectionKey = exports.createRefSetter = exports.createDataKey = exports.getFirstSlotVNode = exports.render = exports.keysOf = exports.call = exports.flatten = exports.omit = exports.keep = exports.getVNodeChildren = exports.getSlot = void 0;
 var get_slot_1 = require("./get-slot");
 Object.defineProperty(exports, "getSlot", { enumerable: true, get: function () { return get_slot_1.getSlot; } });
 var get_v_node_children_1 = require("./get-v-node-children");
@@ -27,3 +27,6 @@ var create_injection_key_1 = require("./create-injection-key");
 Object.defineProperty(exports, "createInjectionKey", { enumerable: true, get: function () { return create_injection_key_1.createInjectionKey; } });
 var resolve_slot_1 = require("./resolve-slot");
 Object.defineProperty(exports, "resolveSlot", { enumerable: true, get: function () { return resolve_slot_1.resolveSlot; } });
+Object.defineProperty(exports, "resolveWrappedSlot", { enumerable: true, get: function () { return resolve_slot_1.resolveWrappedSlot; } });
+Object.defineProperty(exports, "resolveSlotWithProps", { enumerable: true, get: function () { return resolve_slot_1.resolveSlotWithProps; } });
+Object.defineProperty(exports, "isSlotEmpty", { enumerable: true, get: function () { return resolve_slot_1.isSlotEmpty; } });

package/lib/_utils/vue/resolve-slot.d.ts

@@ -1,2 +1,8 @@
-import { Slot, VNodeChild } from 'vue';
-export declare function resolveSlot(slot: Slot | undefined, fallback: () => VNodeChild[]): VNodeChild;
+import { Slot, VNodeArrayChildren } from 'vue';
+/**
+ * We shouldn't use the following functions with slot flags `_: 1, 2, 3`
+ */
+export declare function resolveSlot(slot: Slot | undefined, fallback: () => VNodeArrayChildren): VNodeArrayChildren;
+export declare function resolveSlotWithProps<T>(slot: Slot | undefined, props: T, fallback: (props: T) => VNodeArrayChildren): VNodeArrayChildren;
+export declare function resolveWrappedSlot(slot: Slot | undefined, wrapper: (children: VNodeArrayChildren) => VNodeArrayChildren): VNodeArrayChildren | null;
+export declare function isSlotEmpty(slot: Slot | undefined): boolean;

package/lib/_utils/vue/resolve-slot.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.resolveSlot = void 0;
+exports.isSlotEmpty = exports.resolveWrappedSlot = exports.resolveSlotWithProps = exports.resolveSlot = void 0;
 const vue_1 = require("vue");
 function ensureValidVNode(vnodes) {
     return vnodes.some((child) => {
@@ -10,7 +10,8 @@ function ensureValidVNode(vnodes) {
         if (child.type === vue_1.Comment) {
             return false;
         }
-        if (child.type === vue_1.Fragment && !ensureValidVNode(child.children)) {
+        if (child.type === vue_1.Fragment &&
+            !ensureValidVNode(child.children)) {
             return false;
         }
         return true;
@@ -18,7 +19,25 @@ function ensureValidVNode(vnodes) {
         ? vnodes
         : null;
 }
+/**
+ * We shouldn't use the following functions with slot flags `_: 1, 2, 3`
+ */
 function resolveSlot(slot, fallback) {
     return (slot && ensureValidVNode(slot())) || fallback();
 }
 exports.resolveSlot = resolveSlot;
+function resolveSlotWithProps(slot, props, fallback) {
+    return (slot && ensureValidVNode(slot(props))) || fallback(props);
+}
+exports.resolveSlotWithProps = resolveSlotWithProps;
+function resolveWrappedSlot(slot, wrapper) {
+    const children = slot && ensureValidVNode(slot());
+    if (children)
+        return wrapper(children);
+    return null;
+}
+exports.resolveWrappedSlot = resolveWrappedSlot;
+function isSlotEmpty(slot) {
+    return !(slot && ensureValidVNode(slot()));
+}
+exports.isSlotEmpty = isSlotEmpty;

package/lib/affix/src/Affix.js

@@ -58,7 +58,7 @@ exports.default = (0, vue_1.defineComponent)({
     props: exports.affixProps,
     setup(props) {
         const { mergedClsPrefixRef } = (0, _mixins_1.useConfig)(props);
-        (0, _mixins_1.useStyle)('Affix', index_cssr_1.default, mergedClsPrefixRef);
+        (0, _mixins_1.useStyle)('-affix', index_cssr_1.default, mergedClsPrefixRef);
         let scrollTarget = null;
         const stickToTopRef = (0, vue_1.ref)(false);
         const stickToBottomRef = (0, vue_1.ref)(false);

package/lib/alert/src/Alert.js

@@ -42,7 +42,7 @@ exports.default = (0, vue_1.defineComponent)({
     props: alertProps,
     setup(props) {
         const { mergedClsPrefixRef } = (0, _mixins_1.useConfig)(props);
-        const themeRef = (0, _mixins_1.useTheme)('Alert', 'Alert', index_cssr_1.default, styles_1.alertLight, props, mergedClsPrefixRef);
+        const themeRef = (0, _mixins_1.useTheme)('Alert', '-alert', index_cssr_1.default, styles_1.alertLight, props, mergedClsPrefixRef);
         const cssVars = (0, vue_1.computed)(() => {
             const { common: { cubicBezierEaseInOut }, self } = themeRef.value;
             const { fontSize, borderRadius, titleFontWeight, lineHeight, iconSize, iconMargin, closeSize, closeMargin, padding } = self;

package/lib/anchor/src/AnchorAdapter.js

@@ -36,7 +36,7 @@ exports.default = (0, vue_1.defineComponent)({
     props: anchorProps,
     setup(props, { slots }) {
         const { mergedClsPrefixRef } = (0, _mixins_1.useConfig)(props);
-        const themeRef = (0, _mixins_1.useTheme)('Anchor', 'Anchor', index_cssr_1.default, styles_1.anchorLight, props, mergedClsPrefixRef);
+        const themeRef = (0, _mixins_1.useTheme)('Anchor', '-anchor', index_cssr_1.default, styles_1.anchorLight, props, mergedClsPrefixRef);
         const anchorRef = (0, vue_1.ref)(null);
         const cssVarsRef = (0, vue_1.computed)(() => {
             const { self: { railColor, linkColor, railColorActive, linkTextColor, linkTextColorHover, linkTextColorPressed, linkTextColorActive, linkFontSize, railWidth, linkPadding, borderRadius }, common: { cubicBezierEaseInOut } } = themeRef.value;

package/lib/auto-complete/src/AutoComplete.d.ts

@@ -1,5 +1,6 @@
 import { PropType, InputHTMLAttributes } from 'vue';
 import { TreeNode } from 'treemate';
+import { FollowerPlacement } from 'vueuc';
 import { RenderOption, RenderLabel } from '../../_internal/select-menu/src/interface';
 import { MaybeArray } from '../../_utils';
 import type { ExtractPublicPropTypes } from '../../_utils';
@@ -31,6 +32,10 @@ declare const autoCompleteProps: {
         readonly default: undefined;
     };
     readonly placeholder: StringConstructor;
+    readonly placement: {
+        readonly type: PropType<FollowerPlacement>;
+        readonly default: "bottom-start";
+    };
     readonly value: StringConstructor;
     readonly blurAfterSelect: BooleanConstructor;
     readonly clearAfterSelect: BooleanConstructor;
@@ -426,6 +431,10 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: undefined;
     };
     readonly placeholder: StringConstructor;
+    readonly placement: {
+        readonly type: PropType<FollowerPlacement>;
+        readonly default: "bottom-start";
+    };
     readonly value: StringConstructor;
     readonly blurAfterSelect: BooleanConstructor;
     readonly clearAfterSelect: BooleanConstructor;
@@ -809,6 +818,7 @@ declare const _default: import("vue").DefineComponent<{
     mergedSize: import("vue").ComputedRef<"small" | "medium" | "large">;
     mergedDisabled: import("vue").ComputedRef<boolean>;
     active: import("vue").ComputedRef<boolean>;
+    mergedStatus: import("vue").ComputedRef<import("../../form/src/interface").FormValidationStatus | undefined>;
     handleClear: () => void;
     handleFocus: (e: FocusEvent) => void;
     handleBlur: (e: FocusEvent) => void;
@@ -1101,6 +1111,10 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: undefined;
     };
     readonly placeholder: StringConstructor;
+    readonly placement: {
+        readonly type: PropType<FollowerPlacement>;
+        readonly default: "bottom-start";
+    };
     readonly value: StringConstructor;
     readonly blurAfterSelect: BooleanConstructor;
     readonly clearAfterSelect: BooleanConstructor;
@@ -1471,10 +1485,11 @@ declare const _default: import("vue").DefineComponent<{
 }>>, {
     disabled: boolean | undefined;
     to: string | boolean | HTMLElement;
+    options: AutoCompleteOptions;
     loading: boolean;
     bordered: boolean | undefined;
+    placement: FollowerPlacement;
     clearable: boolean;
-    options: AutoCompleteOptions;
     defaultValue: string | null;
     blurAfterSelect: boolean;
     clearAfterSelect: boolean;

package/lib/auto-complete/src/AutoComplete.js

@@ -31,7 +31,10 @@ const autoCompleteProps = Object.assign(Object.assign({}, _mixins_1.useTheme.pro
     }, disabled: {
         type: Boolean,
         default: undefined
-    }, placeholder: String, value: String, blurAfterSelect: Boolean, clearAfterSelect: Boolean, getShow: Function, inputProps: Object, renderOption: Function, renderLabel: Function, size: String, options: {
+    }, placeholder: String, placement: {
+        type: String,
+        default: 'bottom-start'
+    }, value: String, blurAfterSelect: Boolean, clearAfterSelect: Boolean, getShow: Function, inputProps: Object, renderOption: Function, renderLabel: Function, size: String, options: {
         type: Array,
         default: () => []
     }, zIndex: Number, 'onUpdate:value': [Function, Array], onUpdateValue: [Function, Array], onSelect: [Function, Array], onBlur: [Function, Array], onFocus: [Function, Array], 
@@ -50,7 +53,7 @@ exports.default = (0, vue_1.defineComponent)({
         }
         const { mergedBorderedRef, namespaceRef, mergedClsPrefixRef } = (0, _mixins_1.useConfig)(props);
         const formItem = (0, _mixins_1.useFormItem)(props);
-        const { mergedSizeRef, mergedDisabledRef } = formItem;
+        const { mergedSizeRef, mergedDisabledRef, mergedStatusRef } = formItem;
         const triggerElRef = (0, vue_1.ref)(null);
         const menuInstRef = (0, vue_1.ref)(null);
         const uncontrolledValueRef = (0, vue_1.ref)(props.defaultValue);
@@ -58,7 +61,7 @@ exports.default = (0, vue_1.defineComponent)({
         const mergedValueRef = (0, vooks_1.useMergedState)(controlledValueRef, uncontrolledValueRef);
         const canBeActivatedRef = (0, vue_1.ref)(false);
         const isComposingRef = (0, vue_1.ref)(false);
-        const themeRef = (0, _mixins_1.useTheme)('AutoComplete', 'AutoComplete', index_cssr_1.default, styles_1.autoCompleteLight, props, mergedClsPrefixRef);
+        const themeRef = (0, _mixins_1.useTheme)('AutoComplete', '-auto-complete', index_cssr_1.default, styles_1.autoCompleteLight, props, mergedClsPrefixRef);
         const selectOptionsRef = (0, vue_1.computed)(() => {
             return (0, utils_2.mapAutoCompleteOptionsToSelectOptions)(props.options);
         });
@@ -196,6 +199,7 @@ exports.default = (0, vue_1.defineComponent)({
             mergedSize: mergedSizeRef,
             mergedDisabled: mergedDisabledRef,
             active: activeRef,
+            mergedStatus: mergedStatusRef,
             handleClear,
             handleFocus,
             handleBlur,
@@ -235,13 +239,13 @@ exports.default = (0, vue_1.defineComponent)({
                                 });
                             }
                             const { mergedTheme } = this;
-                            return ((0, vue_1.h)(input_1.NInput, { theme: mergedTheme.peers.Input, themeOverrides: mergedTheme.peerOverrides.Input, bordered: this.mergedBordered, value: this.mergedValue, placeholder: this.placeholder, size: this.mergedSize, disabled: this.mergedDisabled, clearable: this.clearable, loading: this.loading, inputProps: this.inputProps, onClear: this.handleClear, onFocus: this.handleFocus, onUpdateValue: this.handleInput, onBlur: this.handleBlur }, {
+                            return ((0, vue_1.h)(input_1.NInput, { status: this.mergedStatus, theme: mergedTheme.peers.Input, themeOverrides: mergedTheme.peerOverrides.Input, bordered: this.mergedBordered, value: this.mergedValue, placeholder: this.placeholder, size: this.mergedSize, disabled: this.mergedDisabled, clearable: this.clearable, loading: this.loading, inputProps: this.inputProps, onClear: this.handleClear, onFocus: this.handleFocus, onUpdateValue: this.handleInput, onBlur: this.handleBlur }, {
                                 suffix: this.$slots.suffix,
                                 prefix: this.$slots.prefix
                             }));
                         }
                     }),
-                    (0, vue_1.h)(vueuc_1.VFollower, { show: this.active, to: this.adjustedTo, containerClass: this.namespace, zIndex: this.zIndex, teleportDisabled: this.adjustedTo === _utils_1.useAdjustedTo.tdkey, placement: "bottom-start", width: "target" }, {
+                    (0, vue_1.h)(vueuc_1.VFollower, { show: this.active, to: this.adjustedTo, containerClass: this.namespace, zIndex: this.zIndex, teleportDisabled: this.adjustedTo === _utils_1.useAdjustedTo.tdkey, placement: this.placement, width: "target" }, {
                         default: () => ((0, vue_1.h)(vue_1.Transition, { name: "fade-in-scale-up-transition", appear: this.isMounted }, {
                             default: () => this.active
                                 ? (0, vue_1.withDirectives)((0, vue_1.h)(_internal_1.NInternalSelectMenu, { clsPrefix: mergedClsPrefix, ref: "menuInstRef", theme: this.mergedTheme.peers.InternalSelectMenu, themeOverrides: this.mergedTheme.peerOverrides

package/lib/avatar/src/Avatar.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.avatarProps = void 0;
 const vue_1 = require("vue");
 const vueuc_1 = require("vueuc");
-const AvatarGroup_1 = require("./AvatarGroup");
+const context_1 = require("./context");
 const Tag_1 = require("../../tag/src/Tag");
 const _mixins_1 = require("../../_mixins");
 const styles_1 = require("../styles");
@@ -49,7 +49,7 @@ exports.default = (0, vue_1.defineComponent)({
                 }
             }
         };
-        const NAvatarGroup = (0, vue_1.inject)(AvatarGroup_1.avatarGroupInjectionKey, null);
+        const NAvatarGroup = (0, vue_1.inject)(context_1.avatarGroupInjectionKey, null);
         const mergedSizeRef = (0, vue_1.computed)(() => {
             const { size } = props;
             if (size)
@@ -59,7 +59,7 @@ exports.default = (0, vue_1.defineComponent)({
                 return avatarGroupSize;
             return 'medium';
         });
-        const themeRef = (0, _mixins_1.useTheme)('Avatar', 'Avatar', index_cssr_1.default, styles_1.avatarLight, props, mergedClsPrefixRef);
+        const themeRef = (0, _mixins_1.useTheme)('Avatar', '-avatar', index_cssr_1.default, styles_1.avatarLight, props, mergedClsPrefixRef);
         const TagInjection = (0, vue_1.inject)(Tag_1.tagInjectionKey, null);
         const mergedRoundRef = (0, vue_1.computed)(() => {
             if (NAvatarGroup)

package/lib/avatar/src/AvatarGroup.d.ts

@@ -7,7 +7,6 @@ export interface AvatarGroupInjection {
 interface AvatarOption {
     src: string;
 }
-export declare const avatarGroupInjectionKey: import("vue").InjectionKey<AvatarGroupInjection>;
 declare const avatarGroupProps: {
     readonly max: NumberConstructor;
     readonly maxStyle: PropType<string | CSSProperties>;

package/lib/avatar/src/AvatarGroup.js

@@ -3,13 +3,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.avatarGroupInjectionKey = void 0;
 const vue_1 = require("vue");
 const Avatar_1 = __importDefault(require("./Avatar"));
 const _mixins_1 = require("../../_mixins");
-const _utils_1 = require("../../_utils");
 const avatar_group_cssr_1 = __importDefault(require("./styles/avatar-group.cssr"));
-exports.avatarGroupInjectionKey = (0, _utils_1.createInjectionKey)('n-avatar-group');
+const context_1 = require("./context");
 const avatarGroupProps = {
     max: Number,
     maxStyle: [Object, String],
@@ -25,8 +23,8 @@ exports.default = (0, vue_1.defineComponent)({
     props: avatarGroupProps,
     setup(props) {
         const { mergedClsPrefixRef } = (0, _mixins_1.useConfig)(props);
-        (0, _mixins_1.useStyle)('AvatarGroup', avatar_group_cssr_1.default, mergedClsPrefixRef);
-        (0, vue_1.provide)(exports.avatarGroupInjectionKey, props);
+        (0, _mixins_1.useStyle)('-avatar-group', avatar_group_cssr_1.default, mergedClsPrefixRef);
+        (0, vue_1.provide)(context_1.avatarGroupInjectionKey, props);
         const restOptionsRef = (0, vue_1.computed)(() => {
             const { max } = props;
             if (max === undefined)

package/lib/avatar/src/context.d.ts

@@ -0,0 +1,2 @@
+import type { AvatarGroupInjection } from './AvatarGroup';
+export declare const avatarGroupInjectionKey: import("vue").InjectionKey<AvatarGroupInjection>;

package/lib/avatar/src/context.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.avatarGroupInjectionKey = void 0;
+const _utils_1 = require("../../_utils");
+exports.avatarGroupInjectionKey = (0, _utils_1.createInjectionKey)('n-avatar-group');

package/lib/back-top/src/BackTop.js

@@ -96,7 +96,7 @@ exports.default = (0, vue_1.defineComponent)({
                 (_b = props.onHide) === null || _b === void 0 ? void 0 : _b.call(props);
             }
         });
-        const themeRef = (0, _mixins_1.useTheme)('BackTop', 'BackTop', index_cssr_1.default, styles_1.backTopLight, props, mergedClsPrefixRef);
+        const themeRef = (0, _mixins_1.useTheme)('BackTop', '-back-top', index_cssr_1.default, styles_1.backTopLight, props, mergedClsPrefixRef);
         function init() {
             var _a;
             if (scrollListenerRegistered)

package/lib/badge/src/Badge.js

@@ -30,7 +30,7 @@ exports.default = (0, vue_1.defineComponent)({
     props: badgeProps,
     setup(props) {
         const { mergedClsPrefixRef } = (0, _mixins_1.useConfig)(props);
-        const themeRef = (0, _mixins_1.useTheme)('Badge', 'Badge', index_cssr_1.default, styles_1.badgeLight, props, mergedClsPrefixRef);
+        const themeRef = (0, _mixins_1.useTheme)('Badge', '-badge', index_cssr_1.default, styles_1.badgeLight, props, mergedClsPrefixRef);
         const appearedRef = (0, vue_1.ref)(false);
         const handleAfterEnter = () => {
             appearedRef.value = true;

package/lib/breadcrumb/src/Breadcrumb.js

@@ -19,7 +19,7 @@ exports.default = (0, vue_1.defineComponent)({
     props: breadcrumbProps,
     setup(props) {
         const { mergedClsPrefixRef } = (0, _mixins_1.useConfig)(props);
-        const themeRef = (0, _mixins_1.useTheme)('Breadcrumb', 'Breadcrumb', index_cssr_1.default, styles_1.breadcrumbLight, props, mergedClsPrefixRef);
+        const themeRef = (0, _mixins_1.useTheme)('Breadcrumb', '-breadcrumb', index_cssr_1.default, styles_1.breadcrumbLight, props, mergedClsPrefixRef);
         (0, vue_1.provide)(exports.breadcrumbInjectionKey, {
             separatorRef: (0, vue_1.toRef)(props, 'separator'),
             mergedClsPrefixRef

package/lib/button/src/Button.d.ts

@@ -1320,6 +1320,8 @@ declare const Button: import("vue").DefineComponent<{
         rippleDuration: string;
     }, any>>>;
 }, {
+    themeClass?: import("vue").Ref<string> | undefined;
+    onRender?: (() => void) | undefined;
     selfElRef: import("vue").Ref<HTMLElement | null>;
     waveElRef: import("vue").Ref<{
         play: () => void;
@@ -1366,13 +1368,13 @@ declare const Button: import("vue").DefineComponent<{
         '--n-text-color-pressed': string;
         '--n-text-color-focus': string;
         '--n-text-color-disabled': string;
-        fontWeight: string;
+        'font-weight': string;
         '--n-bezier': string;
         '--n-bezier-ease-out': string;
         '--n-ripple-duration': string;
         '--n-opacity-disabled': string;
         '--n-wave-opacity': string;
-    }>;
+    }> | undefined;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     readonly color: StringConstructor;
     readonly textColor: StringConstructor;