@nova-design-system/nova-react 3.0.0-beta.43 → 3.0.0-beta.45

package/dist/cjs/nv-iconbutton_2.entry-BsXvYbCi.js

@@ -1,163 +0,0 @@
-'use strict';
-
-var index = require('./index-C8UfzrMI.js');
-var clsx297c1ffe = require('./clsx-297c1ffe-BtxeOLZW.js');
-require('react');
-
-const nvIconbuttonCss = "nv-iconbutton.root{display:inline-flex;justify-content:center;align-items:center;font-style:normal;font-weight:500;font-family:\"TT Norms Pro\", sans-serif;transition:background-color 150ms ease-out;height:fit-content;width:fit-content}nv-iconbutton.size-xs{padding:var(--button-xs-icon-button-padding);gap:var(--button-xs-gap);border-radius:var(--button-xs-border-radius);line-height:var(--button-xs-line-height);font-size:var(--button-xs-font-size)}nv-iconbutton.size-sm{padding:var(--button-sm-icon-button-padding);gap:var(--button-sm-gap);border-radius:var(--button-sm-border-radius);line-height:var(--button-sm-line-height);font-size:var(--button-sm-font-size)}nv-iconbutton.size-md{padding:var(--button-md-icon-button-padding);gap:var(--button-md-gap);border-radius:var(--button-md-border-radius);line-height:var(--button-md-line-height);font-size:var(--button-md-font-size)}nv-iconbutton.size-lg{padding:var(--button-lg-icon-button-padding);gap:var(--button-lg-gap);border-radius:var(--button-lg-border-radius);line-height:var(--button-lg-line-height);font-size:var(--button-lg-font-size)}nv-iconbutton.emphasis-high{background:var(--components-button-high-background);border:1px solid var(--components-button-high-border);color:var(--components-button-high-text)}nv-iconbutton.emphasis-high:hover{background:var(--components-button-high-background-hover);color:var(--components-button-high-text-hover)}nv-iconbutton.emphasis-high:focus,nv-iconbutton.emphasis-high:focus-within{outline:none}nv-iconbutton.emphasis-high:focus-visible,nv-iconbutton.emphasis-high:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-iconbutton.emphasis-high:disabled{background:var(--components-button-high-background);color:var(--components-button-high-text);opacity:0.5;cursor:not-allowed;box-shadow:none}nv-iconbutton.emphasis-high nv-icon>svg{color:var(--components-button-high-icon)}nv-iconbutton.emphasis-medium{background:var(--components-button-medium-background);border:1px solid var(--components-button-medium-border);color:var(--components-button-medium-text)}nv-iconbutton.emphasis-medium:hover{background:var(--components-button-medium-background-hover);color:var(--components-button-medium-text-hover)}nv-iconbutton.emphasis-medium:focus,nv-iconbutton.emphasis-medium:focus-within{outline:none}nv-iconbutton.emphasis-medium:focus-visible,nv-iconbutton.emphasis-medium:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-iconbutton.emphasis-medium:disabled{background:var(--components-button-medium-background);color:var(--components-button-medium-text);opacity:0.5;cursor:not-allowed;box-shadow:none}nv-iconbutton.emphasis-medium nv-icon>svg{color:var(--components-button-medium-icon)}nv-iconbutton.emphasis-low{background:var(--components-button-low-background);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text)}nv-iconbutton.emphasis-low:hover{background:var(--components-button-low-background-hover);color:var(--components-button-low-text-hover)}nv-iconbutton.emphasis-low:focus,nv-iconbutton.emphasis-low:focus-within{outline:none}nv-iconbutton.emphasis-low:focus-visible,nv-iconbutton.emphasis-low:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-iconbutton.emphasis-low:disabled{background:var(--components-button-low-background);color:var(--components-button-low-text);opacity:0.5;cursor:not-allowed;box-shadow:none}nv-iconbutton.emphasis-low nv-icon>svg{color:var(--components-button-low-icon)}nv-iconbutton.emphasis-lower{background:var(--components-button-lower-background);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text)}nv-iconbutton.emphasis-lower:hover{background:var(--components-button-lower-background-hover);color:var(--components-button-lower-text-hover)}nv-iconbutton.emphasis-lower:focus,nv-iconbutton.emphasis-lower:focus-within{outline:none}nv-iconbutton.emphasis-lower:focus-visible,nv-iconbutton.emphasis-lower:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-iconbutton.emphasis-lower:disabled{background:var(--components-button-lower-background);color:var(--components-button-lower-text);opacity:0.5;cursor:not-allowed;box-shadow:none}nv-iconbutton.emphasis-lower nv-icon>svg{color:var(--components-button-lower-icon)}nv-iconbutton.loading [slot=leading-icon]{display:none}nv-iconbutton.shape-rounded{border-radius:var(--radius-rounded-full)}";
-const NvIconbuttonStyle0 = nvIconbuttonCss;
-
-const NvIconbutton = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        /****************************************************************************/
-        //#region PROPERTIES
-        /**
-         * Determines how large or small the button appears, allowing for
-         * customization of the button's dimensions to fit different design
-         * specifications and user needs.
-         */
-        this.size = 'md';
-        /**
-         * Adjusts the button’s emphasis to make it more or less visually prominent
-         * to users. Use this to draw attention to important actions or reduce focus
-         * on less critical ones.
-         */
-        this.emphasis = 'high';
-        /**
-         * Set this to true to show a spinner on the button, letting users know that
-         * their action is being processed. It helps improve user experience by
-         * indicating ongoing activities. The icon is not displayed when the button
-         * is loading. Also, the button is disabled. If you want to disable the
-         * button, it is not possible. It is automatically disabled when loading.
-         */
-        this.loading = false;
-        /**
-         * Disables the button, preventing user interaction.
-         */
-        this.disabled = false;
-        /**
-         * Makes the button look active when it’s within a compatible component
-         * like a button group.
-         */
-        this.active = false;
-        /**
-         * Sets the button type to control its function in forms. Use 'submit' to send
-         * form data, 'reset' to clear the form, or 'button' for a standard button
-         * that doesn’t interact with form submission by default.
-         */
-        this.type = 'button';
-        /**
-         * Sets the shape of the button. Choose between square and rounded.
-         */
-        this.shape = 'square';
-        //#endregion PROPERTIES
-        /****************************************************************************/
-        //#region METHODS
-        /**
-         * Handles form-related actions when the button is clicked.
-         * - Submits the form if the button type is 'submit'.
-         * - Resets the form if the button type is 'reset'.
-         * @param {Event} event - The click event.
-         */
-        this.handleClick = (event) => {
-            var _a, _b, _c, _d;
-            if (this.disabled) {
-                event.preventDefault();
-                return;
-            }
-            if (this.type === 'submit') {
-                (_b = (_a = this.internals) === null || _a === void 0 ? void 0 : _a.form) === null || _b === void 0 ? void 0 : _b.requestSubmit();
-            }
-            if (this.type === 'reset') {
-                (_d = (_c = this.internals) === null || _c === void 0 ? void 0 : _c.form) === null || _d === void 0 ? void 0 : _d.reset();
-            }
-        };
-    }
-    //#endregion METHODS
-    /****************************************************************************/
-    //#region WATCHERS
-    handleLoadingChange(loading) {
-        this.loading = loading;
-        this.disabled = loading;
-    }
-    handleDisabledChange(disabled) {
-        if (this.loading) {
-            this.disabled = this.loading;
-        }
-        else {
-            this.disabled = disabled;
-        }
-    }
-    //#endregion WATCHERS
-    /****************************************************************************/
-    //#region EVENTS
-    handleKeyDown(event) {
-        if (event.key === 'Enter' || event.key === ' ') {
-            event.preventDefault();
-            this.el.click();
-        }
-    }
-    handleTouchStart(event) {
-        if (event.touches.length > 1)
-            return;
-        event.preventDefault();
-        this.el.click();
-    }
-    //#endregion EVENTS
-    /****************************************************************************/
-    //#region LIFECYCLE
-    componentWillLoad() {
-        if (this.loading) {
-            this.disabled = this.loading;
-        }
-    }
-    //#endregion LIFECYCLE
-    /****************************************************************************/
-    //#region RENDER
-    render() {
-        return (index.h(index.Host, { key: '3cb0f36cea2cfcefe2792893742fa7478068377f', role: "button", type: this.type, tabindex: "0", disabled: this.disabled ? true : undefined, class: clsx297c1ffe.clsx('root', `size-${this.size}`, `emphasis-${this.emphasis}`, this.loading && 'loading', `shape-${this.shape}`), onClick: this.handleClick }, this.loading && index.h("nv-loader", { key: '9e982898299e460a1828c6a52cc4f0560bb13c68', size: this.size }), !this.loading && index.h("nv-icon", { key: 'b8f0337dd42132b28d8a7d75d0cdce9ebebb1fc4', name: this.name, size: this.size }), index.h("slot", { key: '31aaff45c890e8eaf961b3cb82136caabbbe0eaf' })));
-    }
-    static get formAssociated() { return true; }
-    get el() { return index.getElement(this); }
-    static get watchers() { return {
-        "loading": ["handleLoadingChange"],
-        "disabled": ["handleDisabledChange"]
-    }; }
-};
-NvIconbutton.style = NvIconbuttonStyle0;
-
-const nvLoaderCss = "@keyframes rotation{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}nv-loader{display:inline-block;position:relative;aspect-ratio:1/1;border-radius:9999px;color:inherit}nv-loader.size-xs{width:var(--loader-size-xs);height:var(--loader-size-xs)}nv-loader.size-xs::before,nv-loader.size-xs::after{content:\" \";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-xs::before{content:\" \";border:calc(var(--loader-size-xs) / 10) solid;opacity:0.3}nv-loader.size-xs::after{content:\" \";border-top:calc(var(--loader-size-xs) / 10) solid transparent;border-left:calc(var(--loader-size-xs) / 10) solid transparent;border-right:calc(var(--loader-size-xs) / 10) solid transparent;border-bottom:calc(var(--loader-size-xs) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-sm{width:var(--loader-size-sm);height:var(--loader-size-sm)}nv-loader.size-sm::before,nv-loader.size-sm::after{content:\" \";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-sm::before{content:\" \";border:calc(var(--loader-size-sm) / 10) solid;opacity:0.3}nv-loader.size-sm::after{content:\" \";border-top:calc(var(--loader-size-sm) / 10) solid transparent;border-left:calc(var(--loader-size-sm) / 10) solid transparent;border-right:calc(var(--loader-size-sm) / 10) solid transparent;border-bottom:calc(var(--loader-size-sm) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-md{width:var(--loader-size-md);height:var(--loader-size-md)}nv-loader.size-md::before,nv-loader.size-md::after{content:\" \";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-md::before{content:\" \";border:calc(var(--loader-size-md) / 10) solid;opacity:0.3}nv-loader.size-md::after{content:\" \";border-top:calc(var(--loader-size-md) / 10) solid transparent;border-left:calc(var(--loader-size-md) / 10) solid transparent;border-right:calc(var(--loader-size-md) / 10) solid transparent;border-bottom:calc(var(--loader-size-md) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-lg{width:var(--loader-size-lg);height:var(--loader-size-lg)}nv-loader.size-lg::before,nv-loader.size-lg::after{content:\" \";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-lg::before{content:\" \";border:calc(var(--loader-size-lg) / 10) solid;opacity:0.3}nv-loader.size-lg::after{content:\" \";border-top:calc(var(--loader-size-lg) / 10) solid transparent;border-left:calc(var(--loader-size-lg) / 10) solid transparent;border-right:calc(var(--loader-size-lg) / 10) solid transparent;border-bottom:calc(var(--loader-size-lg) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-xl{width:var(--loader-size-xl);height:var(--loader-size-xl)}nv-loader.size-xl::before,nv-loader.size-xl::after{content:\" \";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-xl::before{content:\" \";border:calc(var(--loader-size-xl) / 10) solid;opacity:0.3}nv-loader.size-xl::after{content:\" \";border-top:calc(var(--loader-size-xl) / 10) solid transparent;border-left:calc(var(--loader-size-xl) / 10) solid transparent;border-right:calc(var(--loader-size-xl) / 10) solid transparent;border-bottom:calc(var(--loader-size-xl) / 10) solid;animation:rotation 1s linear infinite}nv-loader.color-brand::before{border-color:var(--components-loader-brand-background);opacity:1}nv-loader.color-brand::after{border-bottom-color:var(--components-loader-brand-foreground)}nv-loader.color-white::before{border-color:var(--components-loader-white-background);opacity:1}nv-loader.color-white::after{border-bottom-color:var(--components-loader-white-foreground)}";
-const NvLoaderStyle0 = nvLoaderCss;
-
-const NvLoader = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        /****************************************************************************/
-        //#region PROPERTIES
-        /**
-         * Choose the size of the loader to best fit your application’s needs, whether
-         * it’s a small spinner for subtle loading indicators or a large one for more
-         * prominent displays.
-         */
-        this.size = 'md';
-    }
-    //#endregion PROPERTIES
-    /****************************************************************************/
-    //#region RENDER
-    /* <slot> empty to force rendering change */
-    render() {
-        return (index.h(index.Host, { key: '9e9d2153c7fbb074e143bf01409eca65ec7ba08c', class: clsx297c1ffe.clsx(this.size && `size-${this.size}`, this.color && `color-${this.color}`) }));
-    }
-};
-NvLoader.style = NvLoaderStyle0;
-
-exports.nv_iconbutton = NvIconbutton;
-exports.nv_loader = NvLoader;

package/dist/cjs/nv-menu.entry-DFEYw_KZ.js

@@ -1,227 +0,0 @@
-'use strict';
-
-var index = require('./index-C8UfzrMI.js');
-require('react');
-
-const nvMenuCss = "nv-menuitem{display:flex;align-items:center;max-width:300px;width:100vw;font-size:var(--menu-contextual-item-font-size);font-weight:var(--menu-contextual-item-font-weight);color:var(--components-menu-contextual-item-content);border-radius:var(--menu-contextual-item-radius);gap:var(--menu-contextual-item-gap-x);padding:var(--menu-contextual-item-padding-y) var(--menu-contextual-item-padding-x);transition:background-color 150ms ease-out;cursor:pointer}nv-menuitem:hover,nv-menuitem:focus,nv-menuitem:focus-within{background-color:var(--components-menu-contextual-item-background-hover);color:var(--components-menu-contextual-item-content-hover)}nv-menuitem *{pointer-events:none}nv-menuitem kbd{color:var(--components-menu-contextual-item-shortcut)}nv-menuitem [data-scope=text]{margin-right:auto}nv-menuitem[disabled]:not([disabled=false]){cursor:unset;background-color:unset;color:var(--components-menu-contextual-item-content-disabled)}nv-menu{display:inline-block;position:relative}nv-menu:has([fluid]:not([fluid=false])){display:block}nv-menu nv-popover{display:unset}nv-menu nv-popover [data-scope=popover]{background-color:transparent !important;padding:0 !important}nv-menu [slot=content]{padding:var(--menu-contextual-padding-y) var(--menu-contextual-padding-x);border-radius:var(--menu-contextual-radius);gap:var(--menu-contextual-gap-y);background-color:var(--components-menu-contextual-background);border-color:var(--components-menu-contextual-border);display:flex;flex-direction:column}nv-menu nv-menu[open]:not([open=false])>nv-menuitem{background-color:var(--components-menu-contextual-item-background-hover);color:var(--components-menu-contextual-item-content-hover)}nv-menu hr{display:block;margin:var(--menu-contextual-divider-padding-top) var(--menu-contextual-divider-padding-x) var(--menu-contextual-divider-padding-bottom) var(--menu-contextual-divider-padding-x)}";
-const NvMenuStyle0 = nvMenuCss;
-
-const NvMenu = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.menuitemSelected = index.createEvent(this, "menuitemSelected");
-        this.isHandlingKeyDown = false;
-        /****************************************************************************/
-        //#region PROPERTIES
-        /**
-         * Use this to toggle the initial visibility of the menu, by default the menu
-         * is hidden.
-         */
-        this.open = false;
-        /**
-         * Use this if the menu is nested inside another menu. This will prevent the
-         * parent menu from closing when the child menu is opened.
-         */
-        this.nested = false;
-        /**
-         * Use this to disable the menu from closing automatically when a menu item is
-         * selected.
-         */
-        this.disableCloseOnSelect = false;
-        /**
-         * Decides where the menu shows up next to the button it’s linked to (above,
-         * below, to the sides). If there isn’t enough room, it will adjust its
-         * position on the axis to fit on the screen, so users can always see it.
-         */
-        this.placement = 'bottom-end';
-        /**
-         * Parsed items stored in state.
-         */
-        this.parsedItems = [];
-    }
-    /**
-     * Watcher to parse the items when the `items` property changes.
-     * @param {string} newValue - The new value of the `items` property.
-     */
-    handleItemsChange(newValue) {
-        if (typeof newValue === 'string') {
-            try {
-                this.parsedItems = JSON.parse(newValue);
-            }
-            catch (error) {
-                console.error('Error parsing menu items:', error);
-                this.parsedItems = [];
-            }
-        }
-    }
-    //#endregion PROPERTIES
-    /****************************************************************************/
-    //#region METHODS
-    /**
-     * Opens the menu.
-     */
-    async show() {
-        this.open = true;
-    }
-    /**
-     * Closes the menu.
-     */
-    async close() {
-        this.open = false;
-    }
-    handleMenuItemSelect(event) {
-        if (this.disableCloseOnSelect)
-            return;
-        if (event.detail.hasSubmenu)
-            return;
-        this.open = false;
-    }
-    handleKeydown(event) {
-        // If the menu is not open, check if the trigger is focused
-        // and the user presses Enter or ArrowDown, open the menu
-        if (!this.open) {
-            if ((event.key === 'Enter' ||
-                event.key === 'ArrowDown' ||
-                event.key === ' ') &&
-                document.activeElement === this.triggerElement) {
-                event.preventDefault();
-                this.show();
-                // Then, put the focus on the first menuitem
-                const firstMenuItem = this.popoverElement.querySelector('nv-menuitem');
-                if (firstMenuItem) {
-                    requestAnimationFrame(() => firstMenuItem.focus());
-                }
-            }
-            return;
-        }
-        if (this.isHandlingKeyDown)
-            return;
-        this.isHandlingKeyDown = true;
-        if (event.key === 'ArrowDown' ||
-            event.key === 'ArrowUp' ||
-            event.key === 'ArrowLeft' ||
-            event.key === 'ArrowRight' ||
-            event.key === 'Escape') {
-            event.preventDefault();
-        }
-        if (event.key === 'Escape' && !this.nested) {
-            this.close();
-            this.triggerElement.focus();
-            this.isHandlingKeyDown = false;
-            return;
-        }
-        const menuContent = this.el.querySelector('[slot="content"]');
-        const menuItems = Array.from(menuContent.childNodes).filter(item => { var _a; return (_a = item.matches) === null || _a === void 0 ? void 0 : _a.call(item, 'nv-menuitem, nv-menu'); });
-        let currentIndex = menuItems.indexOf(document.activeElement);
-        if (currentIndex === -1)
-            currentIndex = menuItems.indexOf(document.activeElement.parentElement);
-        if (currentIndex === -1 &&
-            menuItems.find(item => item.matches('nv-menu[open]'))) {
-            this.isHandlingKeyDown = false;
-            return;
-        }
-        if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {
-            menuItems.forEach(item => {
-                if (item.matches('nv-menu'))
-                    item.close();
-            });
-        }
-        if (event.key === 'ArrowDown') {
-            let nextIndex = (currentIndex + 1) % menuItems.length;
-            while (menuItems[nextIndex].matches('nv-menuitem[disabled]')) {
-                nextIndex = (nextIndex + 1) % menuItems.length;
-            }
-            const nextFocusable = menuItems[nextIndex];
-            if (nextFocusable.matches('nv-menuitem')) {
-                nextFocusable.focus();
-            }
-            else if (nextFocusable.matches('nv-menu')) {
-                nextFocusable.querySelector('nv-menuitem').focus();
-            }
-        }
-        if (event.key === 'ArrowUp') {
-            let prevIndex = (currentIndex - 1 + menuItems.length) % menuItems.length;
-            while (menuItems[prevIndex].matches('nv-menuitem[disabled]')) {
-                prevIndex = (prevIndex - 1 + menuItems.length) % menuItems.length;
-            }
-            const prevFocusable = menuItems[prevIndex];
-            if (prevFocusable.matches('nv-menuitem')) {
-                prevFocusable.focus();
-            }
-            else if (prevFocusable.matches('nv-menu')) {
-                prevFocusable.querySelector('nv-menuitem').focus();
-            }
-        }
-        if (event.key === 'ArrowRight') {
-            const submenu = menuItems[currentIndex];
-            if (!submenu.matches('nv-menu')) {
-                this.isHandlingKeyDown = false;
-                return;
-            }
-            submenu.show();
-        }
-        if (event.key === 'ArrowLeft' && this.nested) {
-            if (menuItems.find(item => item.matches('nv-menu[open]'))) {
-                this.isHandlingKeyDown = false;
-                return;
-            }
-            this.close();
-            this.triggerElement.focus();
-        }
-        this.isHandlingKeyDown = false;
-    }
-    handleOpenChanged(event) {
-        if (event.target === this.el.querySelector('nv-popover')) {
-            this.open = event.detail;
-        }
-        const triggerHasFocus = this.triggerElement === document.activeElement;
-        const triggerHasFocusVisible = this.triggerElement.matches(':focus-visible');
-        if (triggerHasFocus && triggerHasFocusVisible)
-            this.focusFirstItem();
-    }
-    focusFirstItem() {
-        const firstButton = this.popoverElement.querySelector('nv-menuitem');
-        if (firstButton) {
-            requestAnimationFrame(() => firstButton.focus());
-        }
-    }
-    //#endregion EVENTS
-    /****************************************************************************/
-    //#region LIFECYCLE
-    componentWillLoad() {
-        this.triggerElement = Array.from(this.el.children).find(child => {
-            return child.getAttribute('slot') === 'trigger';
-        });
-        // If the items attribute is provided, parse its value.
-        if (this.items) {
-            this.handleItemsChange(this.items);
-        }
-    }
-    //#endregion LIFECYCLE
-    /****************************************************************************/
-    //#region RENDER
-    /**
-     * Generates menu items from the `items` property.
-     * @param {MenuItem[]} items - The items to display in the menu.
-     * @returns {HTMLElement[]} The rendered items.
-     */
-    renderMenuItems(items) {
-        return items.map(item => {
-            var _a;
-            if (item.hasSubmenu && ((_a = item.submenuItems) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-                return (index.h("nv-menu", { nested: true, placement: "right-start", items: JSON.stringify(item.submenuItems) }, index.h("nv-menuitem", { slot: "trigger", "has-submenu": true, disabled: item.disabled, icon: item.icon, shortcut: item.shortcut, id: item.value, name: item.label, label: item.label })));
-            }
-            return (index.h("nv-menuitem", { disabled: item.disabled, icon: item.icon, shortcut: item.shortcut, id: item.value, name: item.label, label: item.label }));
-        });
-    }
-    render() {
-        return (index.h(index.Host, { key: '6730d203996374ae1f875271c8a8dfcecbcfe471' }, index.h("slot", { key: 'e3ac0dd17601af87add2b1e36aff9a8176996646', name: "trigger" }), index.h("nv-popover", { key: 'ad1d65fd742aa445e6601587d5bdd45955dc7e93', ref: el => (this.popoverElement = el), triggerMode: "click", triggerElement: this.triggerElement, placement: this.placement, nested: this.nested, open: this.open }, this.parsedItems.length > 0 ? (index.h("ul", { slot: "content" }, this.renderMenuItems(this.parsedItems))) : (index.h("slot", { name: "content" })))));
-    }
-    get el() { return index.getElement(this); }
-    static get watchers() { return {
-        "items": ["handleItemsChange"]
-    }; }
-};
-NvMenu.style = NvMenuStyle0;
-
-exports.nv_menu = NvMenu;

package/dist/cjs/nv-menuitem.entry-BeTXOtir.js

@@ -1,58 +0,0 @@
-'use strict';
-
-var index = require('./index-C8UfzrMI.js');
-require('react');
-
-const nvMenuitemCss = "nv-menuitem{display:flex;align-items:center;max-width:300px;width:100vw;font-size:var(--menu-contextual-item-font-size);font-weight:var(--menu-contextual-item-font-weight);color:var(--components-menu-contextual-item-content);border-radius:var(--menu-contextual-item-radius);gap:var(--menu-contextual-item-gap-x);padding:var(--menu-contextual-item-padding-y) var(--menu-contextual-item-padding-x);transition:background-color 150ms ease-out;cursor:pointer}nv-menuitem:hover,nv-menuitem:focus,nv-menuitem:focus-within{background-color:var(--components-menu-contextual-item-background-hover);color:var(--components-menu-contextual-item-content-hover)}nv-menuitem *{pointer-events:none}nv-menuitem kbd{color:var(--components-menu-contextual-item-shortcut)}nv-menuitem [data-scope=text]{margin-right:auto}nv-menuitem[disabled]:not([disabled=false]){cursor:unset;background-color:unset;color:var(--components-menu-contextual-item-content-disabled)}";
-const NvMenuitemStyle0 = nvMenuitemCss;
-
-const NvMenuitem = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.menuitemSelected = index.createEvent(this, "menuitemSelected");
-        /**
-         * Disables the item, preventing user interaction.
-         */
-        this.disabled = false;
-        /**
-         * If the menu item has a submenu, the a caret icon will be displayed.
-         */
-        this.hasSubmenu = false;
-    }
-    handleMenuItemSelect(event) {
-        // If the element is disabled, stop propagation
-        if (this.disabled) {
-            event.stopPropagation();
-            return;
-        }
-        this.menuitemSelected.emit({
-            id: this.el.id,
-            name: this.name,
-            hasSubmenu: this.hasSubmenu,
-        });
-    }
-    handleClick(event) {
-        this.handleMenuItemSelect(event);
-    }
-    handleKeyDown(event) {
-        if (event.key === 'Enter' || event.key === ' ') {
-            const activeElement = document.activeElement;
-            if (activeElement &&
-                activeElement.tagName === 'NV-MENUITEM' &&
-                !activeElement.hasAttribute('has-submenu')) {
-                event.preventDefault();
-                this.el.click();
-            }
-        }
-    }
-    //#endregion EVENTS
-    /****************************************************************************/
-    //#region RENDER
-    render() {
-        return (index.h(index.Host, { key: '3a80bda645a8c28a9cc660271d02a0bc3a786f84', role: "menuitem", tabindex: this.disabled ? '-1' : '0' }, this.icon && index.h("nv-icon", { key: '13f890147ad70cbc7134bc4c0036bc23328ae522', name: this.icon }), index.h("slot", { key: 'b5d97c5b7171caf26e7d4592ef711f36e261a382' }), this.label && index.h("span", { key: 'fc763d260c77a61a85847815bfeb27255474ae4d', "data-scope": "text" }, this.label), this.shortcut && !this.hasSubmenu && index.h("kbd", { key: '40685c6af8789f943a59c61065786a8f67f9d49b' }, this.shortcut), this.hasSubmenu && index.h("nv-icon", { key: 'ba77aeaaadefddb9bb8403710b1b12ef4a698dee', name: "chevron-right" })));
-    }
-    get el() { return index.getElement(this); }
-};
-NvMenuitem.style = NvMenuitemStyle0;
-
-exports.nv_menuitem = NvMenuitem;