naive-ui 2.23.1 → 2.24.2

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

@@ -170,26 +170,21 @@ declare const _default: import("vue").DefineComponent<{
         };
     }>;
     mergedClsPrefix: import("vue").Ref<string>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    title?: unknown;
-    headerStyle?: unknown;
-    footerStyle?: unknown;
-    bodyStyle?: unknown;
-    bodyContentStyle?: unknown;
-    nativeScrollbar?: unknown;
-    scrollbarProps?: unknown;
-    closable?: unknown;
-} & {
-    closable: boolean;
-    nativeScrollbar: boolean;
-} & {
-    title?: string | undefined;
-    bodyStyle?: string | CSSProperties | undefined;
-    headerStyle?: string | CSSProperties | undefined;
-    footerStyle?: string | CSSProperties | undefined;
-    scrollbarProps?: ScrollbarProps | undefined;
-    bodyContentStyle?: string | CSSProperties | 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<{
+    title: {
+        type: StringConstructor;
+    };
+    headerStyle: PropType<string | CSSProperties>;
+    footerStyle: PropType<string | CSSProperties>;
+    bodyStyle: PropType<string | CSSProperties>;
+    bodyContentStyle: PropType<string | CSSProperties>;
+    nativeScrollbar: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    scrollbarProps: PropType<ScrollbarProps>;
+    closable: BooleanConstructor;
+}>>, {
     closable: boolean;
     nativeScrollbar: boolean;
 }>;

package/lib/drawer/src/DrawerContent.js

@@ -36,16 +36,16 @@ exports.default = (0, vue_1.defineComponent)({
     },
     render() {
         const { title, mergedClsPrefix, nativeScrollbar, mergedTheme, bodyStyle, bodyContentStyle, headerStyle, footerStyle, scrollbarProps, closable, $slots } = this;
-        return ((0, vue_1.h)("div", { class: [
+        return ((0, vue_1.h)("div", { role: "none", class: [
                 `${mergedClsPrefix}-drawer-content`,
                 nativeScrollbar &&
                     `${mergedClsPrefix}-drawer-content--native-scrollbar`
             ] },
-            $slots.header || title || closable ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-drawer-header`, style: headerStyle },
-                (0, vue_1.h)("div", { class: `${mergedClsPrefix}-drawer-header__main` }, $slots.header !== undefined ? $slots.header() : title),
+            $slots.header || title || closable ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-drawer-header`, style: headerStyle, role: "none" },
+                (0, vue_1.h)("div", { class: `${mergedClsPrefix}-drawer-header__main`, role: "heading", "aria-level": "1" }, $slots.header !== undefined ? $slots.header() : title),
                 closable && ((0, vue_1.h)(_internal_1.NBaseClose, { onClick: this.handleCloseClick, clsPrefix: mergedClsPrefix, class: `${mergedClsPrefix}-drawer-header__close` })))) : null,
-            nativeScrollbar ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-drawer-body`, style: bodyStyle },
-                (0, vue_1.h)("div", { class: `${mergedClsPrefix}-drawer-body-content-wrapper`, style: bodyContentStyle }, $slots))) : ((0, vue_1.h)(_internal_1.NScrollbar, Object.assign({ themeOverrides: mergedTheme.peerOverrides.Scrollbar, theme: mergedTheme.peers.Scrollbar }, scrollbarProps, { class: `${mergedClsPrefix}-drawer-body`, contentClass: `${mergedClsPrefix}-drawer-body-content-wrapper`, contentStyle: bodyContentStyle }), $slots)),
-            $slots.footer ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-drawer-footer`, style: footerStyle }, $slots.footer())) : null));
+            nativeScrollbar ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-drawer-body`, style: bodyStyle, role: "none" },
+                (0, vue_1.h)("div", { class: `${mergedClsPrefix}-drawer-body-content-wrapper`, style: bodyContentStyle, role: "none" }, $slots))) : ((0, vue_1.h)(_internal_1.NScrollbar, Object.assign({ themeOverrides: mergedTheme.peerOverrides.Scrollbar, theme: mergedTheme.peers.Scrollbar }, scrollbarProps, { class: `${mergedClsPrefix}-drawer-body`, contentClass: `${mergedClsPrefix}-drawer-body-content-wrapper`, contentStyle: bodyContentStyle }), $slots)),
+            $slots.footer ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-drawer-footer`, style: footerStyle, role: "none" }, $slots.footer())) : null));
     }
 });

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

@@ -1,12 +1,12 @@
-import { Ref, InjectionKey } from 'vue';
+import { Ref } from 'vue';
 import type { MergedTheme } from '../../_mixins';
 import type { DrawerTheme } from '../styles';
 export declare type DrawerBodyInjection = Ref<HTMLElement | null> | null;
-export declare const drawerBodyInjectionKey: InjectionKey<DrawerBodyInjection>;
+export declare const drawerBodyInjectionKey: import("vue").InjectionKey<DrawerBodyInjection>;
 export interface DrawerInjection {
     isMountedRef: Ref<boolean>;
     mergedThemeRef: Ref<MergedTheme<DrawerTheme>>;
     mergedClsPrefixRef: Ref<string>;
     doUpdateShow: (show: boolean) => void;
 }
-export declare const drawerInjectionKey: InjectionKey<DrawerInjection>;
+export declare const drawerInjectionKey: import("vue").InjectionKey<DrawerInjection>;

package/lib/drawer/src/interface.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.drawerInjectionKey = exports.drawerBodyInjectionKey = void 0;
-exports.drawerBodyInjectionKey = Symbol('drawerBody');
-exports.drawerInjectionKey = Symbol('drawer');
+const create_injection_key_1 = require("../../_utils/vue/create-injection-key");
+exports.drawerBodyInjectionKey = (0, create_injection_key_1.createInjectionKey)('n-drawer-body');
+exports.drawerInjectionKey = (0, create_injection_key_1.createInjectionKey)('n-drawer');

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

@@ -21,37 +21,37 @@ const slide_in_from_top_1 = __importDefault(require("../../../_styles/transition
 const slide_in_from_bottom_1 = __importDefault(require("../../../_styles/transitions/slide-in-from-bottom"));
 
 const fade_in_cssr_1 = __importDefault(require("../../../_styles/transitions/fade-in.cssr")); // vars:
-// --line-height
-// --color
-// --text-color
-// --box-shadow
-// --bezier
-// --bezier-out
-// --bezier-in
-// --body-padding
-// --header-padding
-// --footer-padding
-// --title-font-size
-// --title-text-color
-// --title-font-weight
-// --header-border-bottom
-// --footer-border-top
-// --close-color
-// --close-color-hover
-// --close-color-pressed
-// --close-size
+// --n-line-height
+// --n-color
+// --n-text-color
+// --n-box-shadow
+// --n-bezier
+// --n-bezier-out
+// --n-bezier-in
+// --n-body-padding
+// --n-header-padding
+// --n-footer-padding
+// --n-title-font-size
+// --n-title-text-color
+// --n-title-font-weight
+// --n-header-border-bottom
+// --n-footer-border-top
+// --n-close-color
+// --n-close-color-hover
+// --n-close-color-pressed
+// --n-close-size
 
 
 exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('drawer', `
- line-height: var(--line-height);
+ line-height: var(--n-line-height);
  position: absolute;
  pointer-events: all;
- box-shadow: var(--box-shadow);
+ box-shadow: var(--n-box-shadow);
  transition:
- background-color .3s var(--bezier),
- color .3s var(--bezier);
- background-color: var(--color);
- color: var(--text-color);
+ background-color .3s var(--n-bezier),
+ color .3s var(--n-bezier);
+ background-color: var(--n-color);
+ color: var(--n-text-color);
  box-sizing: border-box;
  `, [(0, slide_in_from_right_1.default)(), (0, slide_in_from_left_1.default)(), (0, slide_in_from_top_1.default)(), (0, slide_in_from_bottom_1.default)(), (0, cssr_1.cM)('native-scrollbar', [(0, cssr_1.cB)('drawer-content-wrapper', `
  overflow: auto;
@@ -67,30 +67,31 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('drawer', `
  overflow: auto;
  `)]), (0, cssr_1.cB)('drawer-body', `
  flex: 1 0 0;
+ overflow: hidden;
  `), (0, cssr_1.cB)('drawer-body-content-wrapper', `
  box-sizing: border-box;
- padding: var(--body-padding);
+ padding: var(--n-body-padding);
  `), (0, cssr_1.cB)('drawer-header', `
- font-weight: var(--title-font-weight);
+ font-weight: var(--n-title-font-weight);
  line-height: 1;
- font-size: var(--title-font-size);
- color: var(--title-text-color);
- padding: var(--header-padding);
- transition: border .3s var(--bezier);
- border-bottom: 1px solid var(--divider-color);
- border-bottom: var(--header-border-bottom);
+ font-size: var(--n-title-font-size);
+ color: var(--n-title-text-color);
+ padding: var(--n-header-padding);
+ transition: border .3s var(--n-bezier);
+ border-bottom: 1px solid var(--n-divider-color);
+ border-bottom: var(--n-header-border-bottom);
  display: flex;
  justify-content: space-between;
  align-items: center;
  `, [(0, cssr_1.cE)('close', `
- transition: color .3s var(--bezier);
- font-size: var(--close-size);
+ transition: color .3s var(--n-bezier);
+ font-size: var(--n-close-size);
  `)]), (0, cssr_1.cB)('drawer-footer', `
  display: flex;
  justify-content: flex-end;
- border-top: var(--footer-border-top);
- transition: border .3s var(--bezier);
- padding: var(--footer-padding);
+ border-top: var(--n-footer-border-top);
+ transition: border .3s var(--n-bezier);
+ padding: var(--n-footer-padding);
  `)]), (0, cssr_1.cM)('right-placement', `
  top: 0;
  bottom: 0;
@@ -129,6 +130,6 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('drawer', `
  `, [(0, fade_in_cssr_1.default)({
   enterDuration: '0.2s',
   leaveDuration: '0.2s',
-  enterCubicBezier: 'var(--bezier-in)',
-  leaveCubicBezier: 'var(--bezier-out)'
+  enterCubicBezier: 'var(--n-bezier-in)',
+  leaveCubicBezier: 'var(--n-bezier-out)'
 })])]);

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

@@ -1,4 +1,4 @@
-import { PropType, CSSProperties, InjectionKey, Ref } from 'vue';
+import { PropType, CSSProperties, Ref } from 'vue';
 import { Key, TreeNode } from 'treemate';
 import { FollowerPlacement } from 'vueuc';
 import { MaybeArray, ExtractPublicPropTypes } from '../../_utils';
@@ -18,7 +18,7 @@ export interface DropdownInjection {
     doSelect: OnUpdateValueImpl;
     doUpdateShow: (value: boolean) => void;
 }
-export declare const dropdownInjectionKey: InjectionKey<DropdownInjection>;
+export declare const dropdownInjectionKey: import("vue").InjectionKey<DropdownInjection>;
 declare const dropdownProps: {
     readonly theme: PropType<import("../../_mixins").Theme<"Dropdown", {
         optionHeightSmall: string;
@@ -321,6 +321,7 @@ declare const dropdownProps: {
         type: PropType<import("../../popover/src/Popover").TriggerEventHandlers[]>;
         default: () => never[];
     };
+    readonly internalTrapFocus: BooleanConstructor;
     readonly onShow: PropType<MaybeArray<(value: boolean) => void> | undefined>;
     readonly onHide: PropType<MaybeArray<(value: boolean) => void> | undefined>;
     readonly arrow: {
@@ -633,6 +634,7 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<import("../../popover/src/Popover").TriggerEventHandlers[]>;
         default: () => never[];
     };
+    readonly internalTrapFocus: BooleanConstructor;
     readonly onShow: PropType<MaybeArray<(value: boolean) => void> | undefined>;
     readonly onHide: PropType<MaybeArray<(value: boolean) => void> | undefined>;
     readonly arrow: {
@@ -830,87 +832,8 @@ declare const _default: import("vue").DefineComponent<{
     mergedShow: import("vue").ComputedRef<boolean>;
     doUpdateShow: (value: boolean) => void;
     cssVars: import("vue").ComputedRef<any>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    readonly theme?: unknown;
-    readonly themeOverrides?: unknown;
-    readonly builtinThemeOverrides?: unknown;
-    readonly animated?: unknown;
-    readonly keyboard?: unknown;
-    readonly size?: unknown;
-    readonly inverted?: unknown;
-    readonly placement?: unknown;
-    readonly onSelect?: unknown;
-    readonly options?: unknown;
-    readonly showArrow?: unknown;
-    readonly renderLabel?: unknown;
-    readonly renderIcon?: unknown;
-    readonly labelField?: unknown;
-    readonly keyField?: unknown;
-    readonly childrenField?: unknown;
-    readonly value?: unknown;
-    readonly show?: unknown;
-    readonly defaultShow?: unknown;
-    readonly trigger?: unknown;
-    readonly delay?: unknown;
-    readonly duration?: unknown;
-    readonly raw?: unknown;
-    readonly x?: unknown;
-    readonly y?: unknown;
-    readonly disabled?: unknown;
-    readonly getDisabled?: unknown;
-    readonly displayDirective?: unknown;
-    readonly arrowStyle?: unknown;
-    readonly flip?: unknown;
-    readonly width?: unknown;
-    readonly overlap?: unknown;
-    readonly internalExtraClass?: unknown;
-    readonly onClickoutside?: unknown;
-    readonly 'onUpdate:show'?: unknown;
-    readonly onUpdateShow?: unknown;
-    readonly zIndex?: unknown;
-    readonly to?: unknown;
-    readonly internalSyncTargetWithParent?: unknown;
-    readonly internalInheritedEventHandlers?: unknown;
-    readonly onShow?: unknown;
-    readonly onHide?: unknown;
-    readonly arrow?: unknown;
-    readonly minWidth?: unknown;
-    readonly maxWidth?: unknown;
-} & {
-    size: "small" | "medium" | "large" | "huge";
-    flip: boolean;
-    disabled: boolean;
-    duration: number;
-    raw: boolean;
-    placement: FollowerPlacement;
-    overlap: boolean;
-    keyField: string;
-    trigger: import("../../popover").PopoverTrigger;
-    showArrow: boolean;
-    delay: number;
-    displayDirective: "show" | "if";
-    animated: boolean;
-    defaultShow: boolean;
-    internalExtraClass: string[];
-    internalSyncTargetWithParent: boolean;
-    internalInheritedEventHandlers: import("../../popover/src/Popover").TriggerEventHandlers[];
-    options: DropdownMixedOption[];
-    labelField: string;
-    keyboard: boolean;
-    inverted: boolean;
-    childrenField: string;
-} & {
-    value?: Key | null | undefined;
-    show?: boolean | undefined;
-    x?: number | undefined;
-    y?: number | undefined;
-    maxWidth?: number | undefined;
-    minWidth?: number | undefined;
-    width?: number | "trigger" | undefined;
-    zIndex?: number | undefined;
-    onSelect?: MaybeArray<OnUpdateValue> | undefined;
-    to?: string | boolean | HTMLElement | undefined;
-    theme?: import("../../_mixins").Theme<"Dropdown", {
+}, 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 theme: PropType<import("../../_mixins").Theme<"Dropdown", {
         optionHeightSmall: string;
         optionHeightMedium: string;
         optionHeightLarge: string;
@@ -979,8 +902,8 @@ declare const _default: import("vue").DefineComponent<{
             arrowHeight: string;
             padding: string;
         }, any>;
-    }> | undefined;
-    themeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Dropdown", {
+    }>>;
+    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Dropdown", {
         optionHeightSmall: string;
         optionHeightMedium: string;
         optionHeightLarge: string;
@@ -1049,8 +972,8 @@ declare const _default: import("vue").DefineComponent<{
             arrowHeight: string;
             padding: string;
         }, any>;
-    }>> | undefined;
-    builtinThemeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Dropdown", {
+    }>>>;
+    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Dropdown", {
         optionHeightSmall: string;
         optionHeightMedium: string;
         optionHeightLarge: string;
@@ -1119,18 +1042,108 @@ declare const _default: import("vue").DefineComponent<{
             arrowHeight: string;
             padding: string;
         }, any>;
-    }>> | undefined;
-    renderIcon?: RenderIcon | undefined;
-    renderLabel?: RenderLabel | undefined;
-    arrowStyle?: string | CSSProperties | undefined;
-    onClickoutside?: ((e: MouseEvent) => void) | undefined;
-    getDisabled?: (() => boolean) | undefined;
-    "onUpdate:show"?: MaybeArray<(value: boolean) => void> | undefined;
-    onUpdateShow?: MaybeArray<(value: boolean) => void> | undefined;
-    onShow?: MaybeArray<(value: boolean) => void> | undefined;
-    onHide?: MaybeArray<(value: boolean) => void> | undefined;
-    arrow?: boolean | undefined;
-}>, {
+    }>>>;
+    readonly animated: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly keyboard: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly size: {
+        readonly type: PropType<"small" | "medium" | "large" | "huge">;
+        readonly default: "medium";
+    };
+    readonly inverted: BooleanConstructor;
+    readonly placement: {
+        readonly type: PropType<FollowerPlacement>;
+        readonly default: "bottom";
+    };
+    readonly onSelect: PropType<MaybeArray<OnUpdateValue>>;
+    readonly options: {
+        readonly type: PropType<DropdownMixedOption[]>;
+        readonly default: () => never[];
+    };
+    readonly showArrow: BooleanConstructor;
+    readonly renderLabel: PropType<RenderLabel>;
+    readonly renderIcon: PropType<RenderIcon>;
+    readonly labelField: {
+        readonly type: StringConstructor;
+        readonly default: "label";
+    };
+    readonly keyField: {
+        readonly type: StringConstructor;
+        readonly default: "key";
+    };
+    readonly childrenField: {
+        readonly type: StringConstructor;
+        readonly default: "children";
+    };
+    readonly value: PropType<Key | null>;
+    readonly show: {
+        type: PropType<boolean | undefined>;
+        default: undefined;
+    };
+    readonly defaultShow: BooleanConstructor;
+    readonly trigger: {
+        type: PropType<import("../../popover").PopoverTrigger>;
+        default: string;
+    };
+    readonly delay: {
+        type: NumberConstructor;
+        default: number;
+    };
+    readonly duration: {
+        type: NumberConstructor;
+        default: number;
+    };
+    readonly raw: BooleanConstructor;
+    readonly x: NumberConstructor;
+    readonly y: NumberConstructor;
+    readonly disabled: BooleanConstructor;
+    readonly getDisabled: PropType<() => boolean>;
+    readonly displayDirective: {
+        type: PropType<"show" | "if">;
+        default: string;
+    };
+    readonly arrowStyle: PropType<string | CSSProperties>;
+    readonly flip: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    readonly width: {
+        type: PropType<number | "trigger">;
+        default: undefined;
+    };
+    readonly overlap: BooleanConstructor;
+    readonly internalExtraClass: {
+        type: PropType<string[]>;
+        default: () => never[];
+    };
+    readonly onClickoutside: PropType<(e: MouseEvent) => void>;
+    readonly 'onUpdate:show': PropType<MaybeArray<(value: boolean) => void>>;
+    readonly onUpdateShow: PropType<MaybeArray<(value: boolean) => void>>;
+    readonly zIndex: NumberConstructor;
+    readonly to: {
+        type: PropType<string | boolean | HTMLElement>;
+        default: undefined;
+    };
+    readonly internalSyncTargetWithParent: BooleanConstructor;
+    readonly internalInheritedEventHandlers: {
+        type: PropType<import("../../popover/src/Popover").TriggerEventHandlers[]>;
+        default: () => never[];
+    };
+    readonly internalTrapFocus: BooleanConstructor;
+    readonly onShow: PropType<MaybeArray<(value: boolean) => void> | undefined>;
+    readonly onHide: PropType<MaybeArray<(value: boolean) => void> | undefined>;
+    readonly arrow: {
+        type: PropType<boolean | undefined>;
+        default: undefined;
+    };
+    readonly minWidth: NumberConstructor;
+    readonly maxWidth: NumberConstructor;
+}>>, {
     size: "small" | "medium" | "large" | "huge";
     show: boolean | undefined;
     flip: boolean;
@@ -1146,6 +1159,7 @@ declare const _default: import("vue").DefineComponent<{
     showArrow: boolean;
     delay: number;
     displayDirective: "show" | "if";
+    internalTrapFocus: boolean;
     animated: boolean;
     defaultShow: boolean;
     internalExtraClass: string[];

package/lib/dropdown/src/Dropdown.js

@@ -14,7 +14,7 @@ const _utils_1 = require("../../_utils");
 const styles_1 = require("../styles");
 const DropdownMenu_1 = __importDefault(require("./DropdownMenu"));
 const index_cssr_1 = __importDefault(require("./styles/index.cssr"));
-exports.dropdownInjectionKey = Symbol('dropdown');
+exports.dropdownInjectionKey = (0, _utils_1.createInjectionKey)('n-dropdown');
 const dropdownBaseProps = {
     animated: {
         type: Boolean,
@@ -241,46 +241,48 @@ exports.default = (0, vue_1.defineComponent)({
                 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 = {
-                    '--bezier': cubicBezierEaseInOut,
-                    '--font-size': fontSize,
-                    '--padding': padding,
-                    '--border-radius': borderRadius,
-                    '--option-height': optionHeight,
-                    '--option-prefix-width': optionPrefixWidth,
-                    '--option-icon-prefix-width': optionIconPrefixWidth,
-                    '--option-suffix-width': optionSuffixWidth,
-                    '--option-icon-suffix-width': optionIconSuffixWidth,
-                    '--option-icon-size': optionIconSize,
-                    '--divider-color': dividerColor,
-                    '--option-opacity-disabled': optionOpacityDisabled
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-font-size': fontSize,
+                    '--n-padding': padding,
+                    '--n-border-radius': borderRadius,
+                    '--n-option-height': optionHeight,
+                    '--n-option-prefix-width': optionPrefixWidth,
+                    '--n-option-icon-prefix-width': optionIconPrefixWidth,
+                    '--n-option-suffix-width': optionSuffixWidth,
+                    '--n-option-icon-suffix-width': optionIconSuffixWidth,
+                    '--n-option-icon-size': optionIconSize,
+                    '--n-divider-color': dividerColor,
+                    '--n-option-opacity-disabled': optionOpacityDisabled
                 };
                 // writing like this is the fastest method
                 if (inverted) {
-                    vars['--color'] = self.colorInverted;
-                    vars['--option-color-hover'] = self.optionColorHoverInverted;
-                    vars['--option-color-active'] = self.optionColorActiveInverted;
-                    vars['--option-text-color'] = self.optionTextColorInverted;
-                    vars['--option-text-color-hover'] = self.optionTextColorHoverInverted;
-                    vars['--option-text-color-active'] =
+                    vars['--n-color'] = self.colorInverted;
+                    vars['--n-option-color-hover'] = self.optionColorHoverInverted;
+                    vars['--n-option-color-active'] = self.optionColorActiveInverted;
+                    vars['--n-option-text-color'] = self.optionTextColorInverted;
+                    vars['--n-option-text-color-hover'] =
+                        self.optionTextColorHoverInverted;
+                    vars['--n-option-text-color-active'] =
                         self.optionTextColorActiveInverted;
-                    vars['--option-text-color-child-active'] =
+                    vars['--n-option-text-color-child-active'] =
                         self.optionTextColorChildActiveInverted;
-                    vars['--prefix-color'] = self.prefixColorInverted;
-                    vars['--suffix-color'] = self.suffixColorInverted;
-                    vars['--group-header-text-color'] = self.groupHeaderTextColorInverted;
+                    vars['--n-prefix-color'] = self.prefixColorInverted;
+                    vars['--n-suffix-color'] = self.suffixColorInverted;
+                    vars['--n-group-header-text-color'] =
+                        self.groupHeaderTextColorInverted;
                 }
                 else {
-                    vars['--color'] = self.color;
-                    vars['--option-color-hover'] = self.optionColorHover;
-                    vars['--option-color-active'] = self.optionColorActive;
-                    vars['--option-text-color'] = self.optionTextColor;
-                    vars['--option-text-color-hover'] = self.optionTextColorHover;
-                    vars['--option-text-color-active'] = self.optionTextColorActive;
-                    vars['--option-text-color-child-active'] =
+                    vars['--n-color'] = self.color;
+                    vars['--n-option-color-hover'] = self.optionColorHover;
+                    vars['--n-option-color-active'] = self.optionColorActive;
+                    vars['--n-option-text-color'] = self.optionTextColor;
+                    vars['--n-option-text-color-hover'] = self.optionTextColorHover;
+                    vars['--n-option-text-color-active'] = self.optionTextColorActive;
+                    vars['--n-option-text-color-child-active'] =
                         self.optionTextColorChildActive;
-                    vars['--prefix-color'] = self.prefixColor;
-                    vars['--suffix-color'] = self.suffixColor;
-                    vars['--group-header-text-color'] = self.groupHeaderTextColor;
+                    vars['--n-prefix-color'] = self.prefixColor;
+                    vars['--n-suffix-color'] = self.suffixColor;
+                    vars['--n-group-header-text-color'] = self.groupHeaderTextColor;
                 }
                 return vars;
             })

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

@@ -3,9 +3,10 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         required: true;
     };
-}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    clsPrefix?: unknown;
-} & {
-    clsPrefix: string;
-} & {}>, {}>;
+}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    clsPrefix: {
+        type: StringConstructor;
+        required: true;
+    };
+}>>, {}>;
 export default _default;

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

@@ -13,15 +13,20 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<string | number | null>;
         default: null;
     };
-}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    clsPrefix?: unknown;
-    tmNode?: unknown;
-    parentKey?: unknown;
-} & {
-    clsPrefix: string;
-    tmNode: TreeNode<import("../..").MenuOption, import("../..").MenuGroupOption, import("../../menu/src/interface").MenuIgnoredOption>;
-    parentKey: string | number | null;
-} & {}>, {
+}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    clsPrefix: {
+        type: StringConstructor;
+        required: true;
+    };
+    tmNode: {
+        type: PropType<TreeNode<import("../..").MenuOption, import("../..").MenuGroupOption, import("../../menu/src/interface").MenuIgnoredOption>>;
+        required: true;
+    };
+    parentKey: {
+        type: PropType<string | number | null>;
+        default: null;
+    };
+}>>, {
     parentKey: string | number | null;
 }>;
 export default _default;

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

@@ -12,11 +12,14 @@ declare const _default: import("vue").DefineComponent<{
     showIcon: import("vue").Ref<boolean>;
     hasSubmenu: import("vue").Ref<boolean>;
     renderLabel: import("vue").Ref<import("./interface").RenderLabelImpl | undefined>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    clsPrefix?: unknown;
-    tmNode?: unknown;
-} & {
-    clsPrefix: string;
-    tmNode: Record<string, any>;
-} & {}>, {}>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    clsPrefix: {
+        type: StringConstructor;
+        required: true;
+    };
+    tmNode: {
+        type: ObjectConstructor;
+        required: true;
+    };
+}>>, {}>;
 export default _default;