naive-ui 2.38.2 → 2.40.0

package/lib/menu/src/Menu.js

@@ -12,8 +12,8 @@ const seemly_1 = require("seemly");
 const interface_1 = require("../../layout/src/interface");
 const _mixins_1 = require("../../_mixins");
 const _utils_1 = require("../../_utils");
-const utils_1 = require("./utils");
 const styles_1 = require("../styles");
+const utils_1 = require("./utils");
 const useCheckDeprecated_1 = require("./useCheckDeprecated");
 const context_1 = require("./context");
 const Submenu_1 = require("./Submenu");
@@ -68,6 +68,7 @@ exports.menuProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), {
     items: Array, onOpenNamesChange: [Function, Array], onSelect: [Function, Array], onExpandedNamesChange: [Function, Array], expandedNames: Array, defaultExpandedNames: Array });
 exports.default = (0, vue_1.defineComponent)({
     name: 'Menu',
+    inheritAttrs: false,
     props: exports.menuProps,
     setup(props) {
         if (process.env.NODE_ENV !== 'production') {
@@ -107,7 +108,7 @@ exports.default = (0, vue_1.defineComponent)({
                 }
             });
         });
-        const treeKeysLevelOneRef = (0, vue_1.computed)(() => new Set(treeMateRef.value.treeNodes.map((e) => e.key)));
+        const treeKeysLevelOneRef = (0, vue_1.computed)(() => new Set(treeMateRef.value.treeNodes.map(e => e.key)));
         const { watchProps } = props;
         const uncontrolledValueRef = (0, vue_1.ref)(null);
         if (watchProps === null || watchProps === void 0 ? void 0 : watchProps.includes('defaultValue')) {
@@ -124,9 +125,9 @@ exports.default = (0, vue_1.defineComponent)({
         const initUncontrolledExpandedKeys = () => {
             uncontrolledExpandedKeysRef.value = props.defaultExpandAll
                 ? treeMateRef.value.getNonLeafKeys()
-                : props.defaultExpandedNames ||
-                    props.defaultExpandedKeys ||
-                    treeMateRef.value.getPath(mergedValueRef.value, {
+                : props.defaultExpandedNames
+                    || props.defaultExpandedKeys
+                    || treeMateRef.value.getPath(mergedValueRef.value, {
                         includeSelf: false
                     }).keyPath;
         };
@@ -190,14 +191,14 @@ exports.default = (0, vue_1.defineComponent)({
         }
         function toggleExpand(key) {
             const currentExpandedKeys = Array.from(mergedExpandedKeysRef.value);
-            const index = currentExpandedKeys.findIndex((expanededKey) => expanededKey === key);
+            const index = currentExpandedKeys.findIndex(expanededKey => expanededKey === key);
             if (~index) {
                 currentExpandedKeys.splice(index, 1);
             }
             else {
                 if (props.accordion) {
                     if (treeKeysLevelOneRef.value.has(key)) {
-                        const closeKeyIndex = currentExpandedKeys.findIndex((e) => treeKeysLevelOneRef.value.has(e));
+                        const closeKeyIndex = currentExpandedKeys.findIndex(e => treeKeysLevelOneRef.value.has(e));
                         if (closeKeyIndex > -1) {
                             currentExpandedKeys.splice(closeKeyIndex, 1);
                         }
@@ -220,8 +221,8 @@ exports.default = (0, vue_1.defineComponent)({
             ]);
             if (props.accordion) {
                 treeKeysLevelOneRef.value.forEach((firstLevelKey) => {
-                    if (nextExpandedKeys.has(firstLevelKey) &&
-                        !selectedKeyPath.includes(firstLevelKey)) {
+                    if (nextExpandedKeys.has(firstLevelKey)
+                        && !selectedKeyPath.includes(firstLevelKey)) {
                         nextExpandedKeys.delete(firstLevelKey);
                     }
                 });
@@ -246,61 +247,61 @@ exports.default = (0, vue_1.defineComponent)({
                 vars['--n-item-text-color'] = self.itemTextColorInverted;
                 vars['--n-item-text-color-hover'] = self.itemTextColorHoverInverted;
                 vars['--n-item-text-color-active'] = self.itemTextColorActiveInverted;
-                vars['--n-item-text-color-child-active'] =
-                    self.itemTextColorChildActiveInverted;
-                vars['--n-item-text-color-child-active-hover'] =
-                    self.itemTextColorChildActiveInverted;
-                vars['--n-item-text-color-active-hover'] =
-                    self.itemTextColorActiveHoverInverted;
+                vars['--n-item-text-color-child-active']
+                    = self.itemTextColorChildActiveInverted;
+                vars['--n-item-text-color-child-active-hover']
+                    = self.itemTextColorChildActiveInverted;
+                vars['--n-item-text-color-active-hover']
+                    = self.itemTextColorActiveHoverInverted;
                 vars['--n-item-icon-color'] = self.itemIconColorInverted;
                 vars['--n-item-icon-color-hover'] = self.itemIconColorHoverInverted;
                 vars['--n-item-icon-color-active'] = self.itemIconColorActiveInverted;
-                vars['--n-item-icon-color-active-hover'] =
-                    self.itemIconColorActiveHoverInverted;
-                vars['--n-item-icon-color-child-active'] =
-                    self.itemIconColorChildActiveInverted;
-                vars['--n-item-icon-color-child-active-hover'] =
-                    self.itemIconColorChildActiveHoverInverted;
-                vars['--n-item-icon-color-collapsed'] =
-                    self.itemIconColorCollapsedInverted;
-                vars['--n-item-text-color-horizontal'] =
-                    self.itemTextColorHorizontalInverted;
-                vars['--n-item-text-color-hover-horizontal'] =
-                    self.itemTextColorHoverHorizontalInverted;
-                vars['--n-item-text-color-active-horizontal'] =
-                    self.itemTextColorActiveHorizontalInverted;
-                vars['--n-item-text-color-child-active-horizontal'] =
-                    self.itemTextColorChildActiveHorizontalInverted;
-                vars['--n-item-text-color-child-active-hover-horizontal'] =
-                    self.itemTextColorChildActiveHoverHorizontalInverted;
-                vars['--n-item-text-color-active-hover-horizontal'] =
-                    self.itemTextColorActiveHoverHorizontalInverted;
-                vars['--n-item-icon-color-horizontal'] =
-                    self.itemIconColorHorizontalInverted;
-                vars['--n-item-icon-color-hover-horizontal'] =
-                    self.itemIconColorHoverHorizontalInverted;
-                vars['--n-item-icon-color-active-horizontal'] =
-                    self.itemIconColorActiveHorizontalInverted;
-                vars['--n-item-icon-color-active-hover-horizontal'] =
-                    self.itemIconColorActiveHoverHorizontalInverted;
-                vars['--n-item-icon-color-child-active-horizontal'] =
-                    self.itemIconColorChildActiveHorizontalInverted;
-                vars['--n-item-icon-color-child-active-hover-horizontal'] =
-                    self.itemIconColorChildActiveHoverHorizontalInverted;
+                vars['--n-item-icon-color-active-hover']
+                    = self.itemIconColorActiveHoverInverted;
+                vars['--n-item-icon-color-child-active']
+                    = self.itemIconColorChildActiveInverted;
+                vars['--n-item-icon-color-child-active-hover']
+                    = self.itemIconColorChildActiveHoverInverted;
+                vars['--n-item-icon-color-collapsed']
+                    = self.itemIconColorCollapsedInverted;
+                vars['--n-item-text-color-horizontal']
+                    = self.itemTextColorHorizontalInverted;
+                vars['--n-item-text-color-hover-horizontal']
+                    = self.itemTextColorHoverHorizontalInverted;
+                vars['--n-item-text-color-active-horizontal']
+                    = self.itemTextColorActiveHorizontalInverted;
+                vars['--n-item-text-color-child-active-horizontal']
+                    = self.itemTextColorChildActiveHorizontalInverted;
+                vars['--n-item-text-color-child-active-hover-horizontal']
+                    = self.itemTextColorChildActiveHoverHorizontalInverted;
+                vars['--n-item-text-color-active-hover-horizontal']
+                    = self.itemTextColorActiveHoverHorizontalInverted;
+                vars['--n-item-icon-color-horizontal']
+                    = self.itemIconColorHorizontalInverted;
+                vars['--n-item-icon-color-hover-horizontal']
+                    = self.itemIconColorHoverHorizontalInverted;
+                vars['--n-item-icon-color-active-horizontal']
+                    = self.itemIconColorActiveHorizontalInverted;
+                vars['--n-item-icon-color-active-hover-horizontal']
+                    = self.itemIconColorActiveHoverHorizontalInverted;
+                vars['--n-item-icon-color-child-active-horizontal']
+                    = self.itemIconColorChildActiveHorizontalInverted;
+                vars['--n-item-icon-color-child-active-hover-horizontal']
+                    = self.itemIconColorChildActiveHoverHorizontalInverted;
                 vars['--n-arrow-color'] = self.arrowColorInverted;
                 vars['--n-arrow-color-hover'] = self.arrowColorHoverInverted;
                 vars['--n-arrow-color-active'] = self.arrowColorActiveInverted;
-                vars['--n-arrow-color-active-hover'] =
-                    self.arrowColorActiveHoverInverted;
-                vars['--n-arrow-color-child-active'] =
-                    self.arrowColorChildActiveInverted;
-                vars['--n-arrow-color-child-active-hover'] =
-                    self.arrowColorChildActiveHoverInverted;
+                vars['--n-arrow-color-active-hover']
+                    = self.arrowColorActiveHoverInverted;
+                vars['--n-arrow-color-child-active']
+                    = self.arrowColorChildActiveInverted;
+                vars['--n-arrow-color-child-active-hover']
+                    = self.arrowColorChildActiveHoverInverted;
                 vars['--n-item-color-hover'] = self.itemColorHoverInverted;
                 vars['--n-item-color-active'] = self.itemColorActiveInverted;
                 vars['--n-item-color-active-hover'] = self.itemColorActiveHoverInverted;
-                vars['--n-item-color-active-collapsed'] =
-                    self.itemColorActiveCollapsedInverted;
+                vars['--n-item-color-active-collapsed']
+                    = self.itemColorActiveCollapsedInverted;
             }
             else {
                 vars['--n-group-text-color'] = self.groupTextColor;
@@ -309,46 +310,46 @@ exports.default = (0, vue_1.defineComponent)({
                 vars['--n-item-text-color-hover'] = self.itemTextColorHover;
                 vars['--n-item-text-color-active'] = self.itemTextColorActive;
                 vars['--n-item-text-color-child-active'] = self.itemTextColorChildActive;
-                vars['--n-item-text-color-child-active-hover'] =
-                    self.itemTextColorChildActiveHover;
+                vars['--n-item-text-color-child-active-hover']
+                    = self.itemTextColorChildActiveHover;
                 vars['--n-item-text-color-active-hover'] = self.itemTextColorActiveHover;
                 vars['--n-item-icon-color'] = self.itemIconColor;
                 vars['--n-item-icon-color-hover'] = self.itemIconColorHover;
                 vars['--n-item-icon-color-active'] = self.itemIconColorActive;
                 vars['--n-item-icon-color-active-hover'] = self.itemIconColorActiveHover;
                 vars['--n-item-icon-color-child-active'] = self.itemIconColorChildActive;
-                vars['--n-item-icon-color-child-active-hover'] =
-                    self.itemIconColorChildActiveHover;
+                vars['--n-item-icon-color-child-active-hover']
+                    = self.itemIconColorChildActiveHover;
                 vars['--n-item-icon-color-collapsed'] = self.itemIconColorCollapsed;
                 vars['--n-item-text-color-horizontal'] = self.itemTextColorHorizontal;
-                vars['--n-item-text-color-hover-horizontal'] =
-                    self.itemTextColorHoverHorizontal;
-                vars['--n-item-text-color-active-horizontal'] =
-                    self.itemTextColorActiveHorizontal;
-                vars['--n-item-text-color-child-active-horizontal'] =
-                    self.itemTextColorChildActiveHorizontal;
-                vars['--n-item-text-color-child-active-hover-horizontal'] =
-                    self.itemTextColorChildActiveHoverHorizontal;
-                vars['--n-item-text-color-active-hover-horizontal'] =
-                    self.itemTextColorActiveHoverHorizontal;
+                vars['--n-item-text-color-hover-horizontal']
+                    = self.itemTextColorHoverHorizontal;
+                vars['--n-item-text-color-active-horizontal']
+                    = self.itemTextColorActiveHorizontal;
+                vars['--n-item-text-color-child-active-horizontal']
+                    = self.itemTextColorChildActiveHorizontal;
+                vars['--n-item-text-color-child-active-hover-horizontal']
+                    = self.itemTextColorChildActiveHoverHorizontal;
+                vars['--n-item-text-color-active-hover-horizontal']
+                    = self.itemTextColorActiveHoverHorizontal;
                 vars['--n-item-icon-color-horizontal'] = self.itemIconColorHorizontal;
-                vars['--n-item-icon-color-hover-horizontal'] =
-                    self.itemIconColorHoverHorizontal;
-                vars['--n-item-icon-color-active-horizontal'] =
-                    self.itemIconColorActiveHorizontal;
-                vars['--n-item-icon-color-active-hover-horizontal'] =
-                    self.itemIconColorActiveHoverHorizontal;
-                vars['--n-item-icon-color-child-active-horizontal'] =
-                    self.itemIconColorChildActiveHorizontal;
-                vars['--n-item-icon-color-child-active-hover-horizontal'] =
-                    self.itemIconColorChildActiveHoverHorizontal;
+                vars['--n-item-icon-color-hover-horizontal']
+                    = self.itemIconColorHoverHorizontal;
+                vars['--n-item-icon-color-active-horizontal']
+                    = self.itemIconColorActiveHorizontal;
+                vars['--n-item-icon-color-active-hover-horizontal']
+                    = self.itemIconColorActiveHoverHorizontal;
+                vars['--n-item-icon-color-child-active-horizontal']
+                    = self.itemIconColorChildActiveHorizontal;
+                vars['--n-item-icon-color-child-active-hover-horizontal']
+                    = self.itemIconColorChildActiveHoverHorizontal;
                 vars['--n-arrow-color'] = self.arrowColor;
                 vars['--n-arrow-color-hover'] = self.arrowColorHover;
                 vars['--n-arrow-color-active'] = self.arrowColorActive;
                 vars['--n-arrow-color-active-hover'] = self.arrowColorActiveHover;
                 vars['--n-arrow-color-child-active'] = self.arrowColorChildActive;
-                vars['--n-arrow-color-child-active-hover'] =
-                    self.arrowColorChildActiveHover;
+                vars['--n-arrow-color-child-active-hover']
+                    = self.arrowColorChildActiveHover;
                 vars['--n-item-color-hover'] = self.itemColorHover;
                 vars['--n-item-color-active'] = self.itemColorActive;
                 vars['--n-item-color-active-hover'] = self.itemColorActiveHover;
@@ -458,23 +459,27 @@ exports.default = (0, vue_1.defineComponent)({
     render() {
         const { mergedClsPrefix, mode, themeClass, onRender } = this;
         onRender === null || onRender === void 0 ? void 0 : onRender();
-        const renderMenuItemNodes = () => this.tmNodes.map((tmNode) => (0, utils_1.itemRenderer)(tmNode, this.$props));
+        const renderMenuItemNodes = () => this.tmNodes.map(tmNode => (0, utils_1.itemRenderer)(tmNode, this.$props));
         const horizontal = mode === 'horizontal';
         const finalResponsive = horizontal && this.responsive;
-        const renderMainNode = () => ((0, vue_1.h)("div", { role: mode === 'horizontal' ? 'menubar' : 'menu', class: [
+        const renderMainNode = () => (0, vue_1.h)('div', (0, vue_1.mergeProps)(this.$attrs, {
+            role: mode === 'horizontal' ? 'menubar' : 'menu',
+            class: [
                 `${mergedClsPrefix}-menu`,
                 themeClass,
                 `${mergedClsPrefix}-menu--${mode}`,
                 finalResponsive && `${mergedClsPrefix}-menu--responsive`,
                 this.mergedCollapsed && `${mergedClsPrefix}-menu--collapsed`
-            ], style: this.cssVars }, finalResponsive ? ((0, vue_1.h)(vueuc_1.VOverflow, { ref: "overflowRef", onUpdateOverflow: this.onUpdateOverflow, getCounter: this.getCounter, onUpdateCount: this.onUpdateCount, updateCounter: this.updateCounter, style: {
+            ],
+            style: this.cssVars
+        }), finalResponsive ? ((0, vue_1.h)(vueuc_1.VOverflow, { ref: "overflowRef", onUpdateOverflow: this.onUpdateOverflow, getCounter: this.getCounter, onUpdateCount: this.onUpdateCount, updateCounter: this.updateCounter, style: {
                 width: '100%',
                 display: 'flex',
                 overflow: 'hidden'
             } }, {
             default: renderMenuItemNodes,
             counter: this.renderCounter
-        })) : (renderMenuItemNodes())));
+        })) : (renderMenuItemNodes()));
         return finalResponsive ? ((0, vue_1.h)(vueuc_1.VResizeObserver, { onResize: this.onResize }, { default: renderMainNode })) : (renderMainNode());
     }
 });

package/lib/menu/src/MenuDivider.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="vue/jsx" />
 declare const _default: import("vue").DefineComponent<{}, () => JSX.Element | null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
 export default _default;

package/lib/menu/src/MenuDivider.js

@@ -5,7 +5,6 @@ const context_1 = require("./context");
 exports.default = (0, vue_1.defineComponent)({
     name: 'MenuDivider',
     setup() {
-        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         const NMenu = (0, vue_1.inject)(context_1.menuInjectionKey);
         const { mergedClsPrefixRef, isHorizontalRef } = NMenu;
         return () => isHorizontalRef.value ? null : ((0, vue_1.h)("div", { class: `${mergedClsPrefixRef.value}-menu-divider` }));

package/lib/menu/src/MenuOption.d.ts

@@ -49,111 +49,7 @@ export declare const NMenuOption: import("vue").DefineComponent<{
     maxIconSize: import("vue").ComputedRef<number>;
     activeIconSize: import("vue").ComputedRef<number>;
     mergedTheme: import("vue").Ref<{
-        common: {
-            baseColor: string;
-            primaryColor: string;
-            primaryColorHover: string;
-            primaryColorPressed: string;
-            primaryColorSuppl: string;
-            infoColor: string;
-            infoColorHover: string;
-            infoColorPressed: string;
-            infoColorSuppl: string;
-            successColor: string;
-            successColorHover: string;
-            successColorPressed: string;
-            successColorSuppl: string;
-            warningColor: string;
-            warningColorHover: string;
-            warningColorPressed: string;
-            warningColorSuppl: string;
-            errorColor: string;
-            errorColorHover: string;
-            errorColorPressed: string;
-            errorColorSuppl: string;
-            textColorBase: string;
-            textColor1: string;
-            textColor2: string;
-            textColor3: string;
-            textColorDisabled: string;
-            placeholderColor: string;
-            placeholderColorDisabled: string;
-            iconColor: string;
-            iconColorHover: string;
-            iconColorPressed: string;
-            iconColorDisabled: string;
-            opacity1: string;
-            opacity2: string;
-            opacity3: string;
-            opacity4: string;
-            opacity5: string;
-            dividerColor: string;
-            borderColor: string;
-            closeIconColor: string;
-            closeIconColorHover: string;
-            closeIconColorPressed: string;
-            closeColorHover: string;
-            closeColorPressed: string;
-            clearColor: string;
-            clearColorHover: string;
-            clearColorPressed: string;
-            scrollbarColor: string;
-            scrollbarColorHover: string;
-            scrollbarWidth: string;
-            scrollbarHeight: string;
-            scrollbarBorderRadius: string;
-            progressRailColor: string;
-            railColor: string;
-            popoverColor: string;
-            tableColor: string;
-            cardColor: string;
-            modalColor: string;
-            bodyColor: string;
-            tagColor: string;
-            avatarColor: string;
-            invertedColor: string;
-            inputColor: string;
-            codeColor: string;
-            tabColor: string;
-            actionColor: string;
-            tableHeaderColor: string;
-            hoverColor: string;
-            tableColorHover: string;
-            tableColorStriped: string;
-            pressedColor: string;
-            opacityDisabled: string;
-            inputColorDisabled: string;
-            buttonColor2: string;
-            buttonColor2Hover: string;
-            buttonColor2Pressed: string;
-            boxShadow1: string;
-            boxShadow2: string;
-            boxShadow3: string;
-            fontFamily: string;
-            fontFamilyMono: string;
-            fontWeight: string;
-            fontWeightStrong: string;
-            cubicBezierEaseInOut: string;
-            cubicBezierEaseOut: string;
-            cubicBezierEaseIn: string;
-            borderRadius: string;
-            borderRadiusSmall: string;
-            fontSize: string;
-            fontSizeMini: string;
-            fontSizeTiny: string;
-            fontSizeSmall: string;
-            fontSizeMedium: string;
-            fontSizeLarge: string;
-            fontSizeHuge: string;
-            lineHeight: string;
-            heightMini: string;
-            heightTiny: string;
-            heightSmall: string;
-            heightMedium: string;
-            heightLarge: string;
-            heightHuge: string;
-            name: "common";
-        };
+        common: import("../..").ThemeCommonVars;
         self: {
             itemColorHoverInverted: string;
             itemColorActiveInverted: string;

package/lib/menu/src/MenuOption.js

@@ -49,10 +49,10 @@ exports.NMenuOption = (0, vue_1.defineComponent)({
             mergedTheme: NMenu.mergedThemeRef,
             menuProps,
             dropdownEnabled: (0, vooks_1.useMemo)(() => {
-                return (props.root &&
-                    mergedCollapsedRef.value &&
-                    menuProps.mode !== 'horizontal' &&
-                    !mergedDisabledRef.value);
+                return (props.root
+                    && mergedCollapsedRef.value
+                    && menuProps.mode !== 'horizontal'
+                    && !mergedDisabledRef.value);
             }),
             selected: (0, vooks_1.useMemo)(() => {
                 if (NMenu.mergedValueRef.value === props.internalKey)

package/lib/menu/src/MenuOptionContent.js

@@ -42,7 +42,6 @@ exports.default = (0, vue_1.defineComponent)({
         isEllipsisPlaceholder: Boolean
     },
     setup(props) {
-        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         const { props: menuProps } = (0, vue_1.inject)(context_1.menuInjectionKey);
         return {
             menuProps,

package/lib/menu/src/MenuOptionGroup.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="vue/jsx" />
 import { type PropType } from 'vue';
 import type { TmNode } from './interface';
 export declare const menuItemGroupProps: {

package/lib/menu/src/MenuOptionGroup.js

@@ -5,7 +5,6 @@ const vue_1 = require("vue");
 const _utils_1 = require("../../_utils");
 const use_menu_child_1 = require("./use-menu-child");
 const use_menu_child_props_1 = require("./use-menu-child-props");
-// eslint-disable-next-line import/no-cycle
 const utils_1 = require("./utils");
 const context_1 = require("./context");
 exports.menuItemGroupProps = Object.assign(Object.assign({}, use_menu_child_props_1.useMenuChildProps), { tmNode: {
@@ -24,7 +23,6 @@ exports.NMenuOptionGroup = (0, vue_1.defineComponent)({
         (0, vue_1.provide)(context_1.menuItemGroupInjectionKey, {
             paddingLeftRef: MenuChild.paddingLeft
         });
-        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         const { mergedClsPrefixRef, props: menuProps } = (0, vue_1.inject)(context_1.menuInjectionKey);
         return function () {
             const { value: mergedClsPrefix } = mergedClsPrefixRef;
@@ -37,10 +35,10 @@ exports.NMenuOptionGroup = (0, vue_1.defineComponent)({
                         paddingLeft !== undefined ? `padding-left: ${paddingLeft}px;` : ''
                     ] }),
                     (0, _utils_1.render)(props.title),
-                    props.extra ? (0, vue_1.h)(vue_1.Fragment, null,
-                        " ",
-                        (0, _utils_1.render)(props.extra)) : null),
-                (0, vue_1.h)("div", null, props.tmNodes.map((tmNode) => (0, utils_1.itemRenderer)(tmNode, menuProps)))));
+                    props.extra ? ((0, vue_1.h)(vue_1.Fragment, null,
+                        ' ',
+                        (0, _utils_1.render)(props.extra))) : null),
+                (0, vue_1.h)("div", null, props.tmNodes.map(tmNode => (0, utils_1.itemRenderer)(tmNode, menuProps)))));
         };
     }
 });

package/lib/menu/src/Submenu.d.ts

@@ -72,111 +72,7 @@ export declare const NSubmenu: import("vue").DefineComponent<{
 }, {
     menuProps: import("./Menu").MenuSetupProps;
     mergedTheme: import("vue").Ref<{
-        common: {
-            baseColor: string;
-            primaryColor: string;
-            primaryColorHover: string;
-            primaryColorPressed: string;
-            primaryColorSuppl: string;
-            infoColor: string;
-            infoColorHover: string;
-            infoColorPressed: string;
-            infoColorSuppl: string;
-            successColor: string;
-            successColorHover: string;
-            successColorPressed: string;
-            successColorSuppl: string;
-            warningColor: string;
-            warningColorHover: string;
-            warningColorPressed: string;
-            warningColorSuppl: string;
-            errorColor: string;
-            errorColorHover: string;
-            errorColorPressed: string;
-            errorColorSuppl: string;
-            textColorBase: string;
-            textColor1: string;
-            textColor2: string;
-            textColor3: string;
-            textColorDisabled: string;
-            placeholderColor: string;
-            placeholderColorDisabled: string;
-            iconColor: string;
-            iconColorHover: string;
-            iconColorPressed: string;
-            iconColorDisabled: string;
-            opacity1: string;
-            opacity2: string;
-            opacity3: string;
-            opacity4: string;
-            opacity5: string;
-            dividerColor: string;
-            borderColor: string;
-            closeIconColor: string;
-            closeIconColorHover: string;
-            closeIconColorPressed: string;
-            closeColorHover: string;
-            closeColorPressed: string;
-            clearColor: string;
-            clearColorHover: string;
-            clearColorPressed: string;
-            scrollbarColor: string;
-            scrollbarColorHover: string;
-            scrollbarWidth: string;
-            scrollbarHeight: string;
-            scrollbarBorderRadius: string;
-            progressRailColor: string;
-            railColor: string;
-            popoverColor: string;
-            tableColor: string;
-            cardColor: string;
-            modalColor: string;
-            bodyColor: string;
-            tagColor: string;
-            avatarColor: string;
-            invertedColor: string;
-            inputColor: string;
-            codeColor: string;
-            tabColor: string;
-            actionColor: string;
-            tableHeaderColor: string;
-            hoverColor: string;
-            tableColorHover: string;
-            tableColorStriped: string;
-            pressedColor: string;
-            opacityDisabled: string;
-            inputColorDisabled: string;
-            buttonColor2: string;
-            buttonColor2Hover: string;
-            buttonColor2Pressed: string;
-            boxShadow1: string;
-            boxShadow2: string;
-            boxShadow3: string;
-            fontFamily: string;
-            fontFamilyMono: string;
-            fontWeight: string;
-            fontWeightStrong: string;
-            cubicBezierEaseInOut: string;
-            cubicBezierEaseOut: string;
-            cubicBezierEaseIn: string;
-            borderRadius: string;
-            borderRadiusSmall: string;
-            fontSize: string;
-            fontSizeMini: string;
-            fontSizeTiny: string;
-            fontSizeSmall: string;
-            fontSizeMedium: string;
-            fontSizeLarge: string;
-            fontSizeHuge: string;
-            lineHeight: string;
-            heightMini: string;
-            heightTiny: string;
-            heightSmall: string;
-            heightMedium: string;
-            heightLarge: string;
-            heightHuge: string;
-            name: "common";
-        };
+        common: import("../..").ThemeCommonVars;
         self: {
             itemColorHoverInverted: string;
             itemColorActiveInverted: string;

package/lib/menu/src/Submenu.js

@@ -9,7 +9,6 @@ const vooks_1 = require("vooks");
 const _internal_1 = require("../../_internal");
 const dropdown_1 = require("../../dropdown");
 const MenuOptionContent_1 = __importDefault(require("./MenuOptionContent"));
-// eslint-disable-next-line import/no-cycle
 const utils_1 = require("./utils");
 const use_menu_child_1 = require("./use-menu-child");
 const use_menu_child_props_1 = require("./use-menu-child-props");
@@ -92,8 +91,8 @@ exports.NSubmenu = (0, vue_1.defineComponent)({
                 return !NMenu.mergedExpandedKeysRef.value.includes(props.internalKey);
             }),
             dropdownEnabled: (0, vue_1.computed)(() => {
-                return (!mergedDisabledRef.value &&
-                    (menuProps.mode === 'horizontal' || mergedCollapsedRef.value));
+                return (!mergedDisabledRef.value
+                    && (menuProps.mode === 'horizontal' || mergedCollapsedRef.value));
             }),
             handlePopoverShowChange,
             handleClick
@@ -112,7 +111,7 @@ exports.NSubmenu = (0, vue_1.defineComponent)({
             return ((0, vue_1.h)(_internal_1.NFadeInExpandTransition, null, {
                 default: () => {
                     const { tmNodes, collapsed } = this;
-                    return !collapsed ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-submenu-children`, role: "menu" }, tmNodes.map((item) => (0, utils_1.itemRenderer)(item, this.menuProps)))) : null;
+                    return !collapsed ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-submenu-children`, role: "menu" }, tmNodes.map(item => (0, utils_1.itemRenderer)(item, this.menuProps)))) : null;
                 }
             }));
         };

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

@@ -1,5 +1,5 @@
-import { type TreeNode } from 'treemate';
-import { type VNodeChild, type HTMLAttributes } from 'vue';
+import type { TreeNode } from 'treemate';
+import type { HTMLAttributes, VNodeChild } from 'vue';
 export type Key = string | number;
 export interface MenuOptionSharedPart {
     key?: Key;