@nova-design-system/nova-webcomponents 3.28.0 → 3.30.0

package/dist/esm/nv-menuitem.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, a as createEvent, h, d as Host, e as getElement } from './index-BCjiE1MF.js';
+import { r as registerInstance, a as createEvent, h, d as Host, e as getElement } from './index-CTmBvINI.js';
 
 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)}`;
 
@@ -45,7 +45,7 @@ const NvMenuitem = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'b377cf654cd4d0cc7e257c10606977db86087e31', role: "menuitem", tabindex: this.disabled ? '-1' : '0' }, this.icon && h("nv-icon", { key: '409b0902ea54323d4dd778816a244f4ea64d986d', name: this.icon }), h("slot", { key: 'd5c5c4a9ab1e3c70ba6fe052e11cfff212bf93aa' }), this.label && h("span", { key: '0b1e3892dfb16bd1f1d19f72b29f4d4dd396ccdf', "data-scope": "text" }, this.label), this.shortcut && !this.hasSubmenu && h("kbd", { key: 'a099a45ed14e3922c3fe25d3b0e1f0d257101e4b' }, this.shortcut), this.hasSubmenu && h("nv-icon", { key: '6c61d48ac2f3927ad7b33673bc9ed196f733e30a', name: "chevron-right" })));
+        return (h(Host, { key: '052f7822782c1a50cfc207dc6c7090e9ae7ddb23', role: "menuitem", tabindex: this.disabled ? '-1' : '0' }, this.icon && h("nv-icon", { key: 'b6fb4a24573d6ce2a65d1fbec49f25084aca4efc', name: this.icon }), h("slot", { key: 'dd4b413f909db1b13a642411532b4980fe495bcf' }), this.label && h("span", { key: '06e14c729b5d1a8c7fb58797fcf345eb15d02be4', "data-scope": "text" }, this.label), this.shortcut && !this.hasSubmenu && h("kbd", { key: '53802fa02a1c643b8f04ec71365115c469016e65' }, this.shortcut), this.hasSubmenu && h("nv-icon", { key: 'ef8e14ab9147ef7cba4e160a053e4900aac9a927', name: "chevron-right" })));
     }
     get el() { return getElement(this); }
 };

package/dist/esm/nv-notification-bullet.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, d as Host, e as getElement } from './index-BCjiE1MF.js';
+import { r as registerInstance, h, d as Host, e as getElement } from './index-CTmBvINI.js';
 
 const nvNotificationBulletCss = () => `nv-notification-bullet{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sidebar-notification-bullet-size);max-width:var(--sidebar-notification-bullet-size);height:var(--sidebar-notification-bullet-size);padding:0 var(--spacing-1);border-radius:var(--radius-rounded-full);font-size:var(--sidebar-notification-bullet-font-size);font-weight:var(--sidebar-notification-bullet-font-weight);white-space:nowrap;flex-shrink:0;position:relative;}nv-notification-bullet.nv-notification-bullet-brand .nv-notification-bullet{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sidebar-notification-bullet-size);max-width:var(--sidebar-notification-bullet-size);height:var(--sidebar-notification-bullet-size);padding:0 var(--spacing-1);border-radius:var(--radius-rounded-full);font-size:var(--sidebar-notification-bullet-font-size);font-weight:var(--sidebar-notification-bullet-font-weight);white-space:nowrap;flex-shrink:0}nv-notification-bullet.nv-notification-bullet-brand .nv-notification-bullet.nv-notification-bullet-high{background-color:var(--color-brand-500);color:var(--color-feedback-neutral-high-contrast-title)}nv-notification-bullet.nv-notification-bullet-brand .nv-notification-bullet.nv-notification-bullet-low{background-color:var(--color-brand-50);color:var(--color-brand-600);border:1px solid var(--color-brand-600)}nv-notification-bullet{}nv-notification-bullet.nv-notification-bullet-neutral{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sidebar-notification-bullet-size);max-width:var(--sidebar-notification-bullet-size);height:var(--sidebar-notification-bullet-size);padding:0 var(--spacing-1);border-radius:var(--radius-rounded-full);font-size:var(--sidebar-notification-bullet-font-size);font-weight:var(--sidebar-notification-bullet-font-weight);white-space:nowrap;flex-shrink:0}nv-notification-bullet.nv-notification-bullet-neutral .nv-notification-bullet.nv-notification-bullet-high{background-color:var(--color-feedback-neutral-high-contrast-background);color:var(--color-feedback-neutral-high-contrast-title)}nv-notification-bullet.nv-notification-bullet-neutral .nv-notification-bullet.nv-notification-bullet-low{background-color:var(--color-feedback-neutral-low-background);color:var(--color-feedback-neutral-low-text);border-radius:var(--radius-rounded-full)}nv-notification-bullet{}nv-notification-bullet.nv-notification-bullet-with-cross-border::before{content:"";position:absolute;top:55%;left:45%;transform:translate(-50%, -50%);width:calc(var(--sidebar-notification-bullet-size) + 1.5px);height:calc(var(--sidebar-notification-bullet-size) * 1.5);border-radius:var(--radius-rounded-full);background-color:var(--nv-component-background, var(--nv-sidebarnavitem-background, var(--color-interaction-container-neutral-background)));z-index:-1;pointer-events:none}nv-notification-bullet{}nv-sidebar[collapsed] nv-notification-bullet.nv-notification-bullet-with-cross-border::before{width:calc(var(--sidebar-notification-bullet-size-reduced) * 1.5);height:calc(var(--sidebar-notification-bullet-size-reduced) * 1.5)}nv-notification-bullet{}nv-notification-bullet .nv-notification-bullet.nv-notification-bullet-reduced,nv-sidebar[collapsed] nv-notification-bullet .nv-notification-bullet{width:var(--sidebar-notification-bullet-size-reduced);height:var(--sidebar-notification-bullet-size-reduced);min-width:var(--sidebar-notification-bullet-size-reduced);max-width:var(--sidebar-notification-bullet-size-reduced);min-height:var(--sidebar-notification-bullet-size-reduced);max-height:var(--sidebar-notification-bullet-size-reduced);padding:0;font-size:0}`;
 

package/dist/esm/nv-notification.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, a as createEvent, h, d as Host, e as getElement } from './index-BCjiE1MF.js';
-import { F as FeedbackColors, N as NotificationPosition } from './constants-BReL3Lsa.js';
+import { r as registerInstance, a as createEvent, h, d as Host, e as getElement } from './index-CTmBvINI.js';
+import { F as FeedbackColors, N as NotificationPosition } from './constants-gOKBmbgZ.js';
 import { u as useCollapse } from './collapse.animation-DZDm0vSK.js';
 import { u as useFade } from './fade.animation-DcRL9lcm.js';
 import './style-value-types.es-xlgmw4x8.js';
@@ -162,7 +162,7 @@ const NvNotification = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '6d78033613b4f5d8c90fd3f0228e90f28272a7ca', role: this.getAriaRole(), "aria-live": this.getAriaLive(), "aria-atomic": true, "aria-labelledby": this.getHeadingId() ?? null, "aria-describedby": this.getMessageId() ?? null, tabindex: "-1" }, h("div", { key: '0a2e82809525643861c44462bbf85bb670b56bb9', "data-scope": "container", ref: el => (this.container = el) }, this.dismissible && (h("button", { key: '46ce066fba0d63bce346697b512051e9fdbf939c', "data-scope": "dismiss", type: "button", onClick: this.dismiss.bind(this) }, h("nv-icon", { key: '25ce721523d04886ff700923310b0fea3e6eeea5', name: "x", size: "sm" }))), h("nv-icon", { key: '060dfd8b52e92af64a6f5d80f18b520e3fa2db4e', name: this.icon ?? this.getDefaultIcon(), size: "md", "data-scope": "icon" }), h("div", { key: '0b60d8005cd53a7bb4f8cbb7d1e2c67337f5b73d', "data-scope": "content" }, (this.heading || this.headingSlot) && (h("p", { key: '549d7ee40542d3579e13c6e31dc313ba3a261f81', id: this.getHeadingId(), "data-scope": "heading" }, h("slot", { key: 'c5c067b17e2b7456b6ddf7a7747e51c9924cd50f', name: "heading" }, this.heading))), (this.message || this.messageSlot) && (h("p", { key: '3de5ab6bf9a77bb0843cd04b945f40b3b16417db', id: this.getMessageId(), "data-scope": "message" }, h("slot", { key: '5bcc2b2842907f35d3e8b9f1be3c2045c5ad8a0f', name: "content" }, this.message))), this.actionsSlot && (h("div", { key: 'e06454ce135e9869b9c7a9faea3e6f082ddc0e8a', "data-scope": "actions" }, h("slot", { key: 'eed113cd7f2d9ae51493f2cd8b9a175db6e7f4aa', name: "actions" })))))));
+        return (h(Host, { key: '32af1308aa22ce8228416fcce23ce5b75111895b', role: this.getAriaRole(), "aria-live": this.getAriaLive(), "aria-atomic": true, "aria-labelledby": this.getHeadingId() ?? null, "aria-describedby": this.getMessageId() ?? null, tabindex: "-1" }, h("div", { key: 'e63deeef95ae6c0e3fe1d8ce178c5dbe9d82f88c', "data-scope": "container", ref: el => (this.container = el) }, this.dismissible && (h("button", { key: '1b66875001f685293d83bbe90a85b297b335c024', "data-scope": "dismiss", type: "button", onClick: this.dismiss.bind(this) }, h("nv-icon", { key: 'b1be8798751f60f41925ea92e40df697eb15fa42', name: "x", size: "sm" }))), h("nv-icon", { key: 'a922d93bddb729fa7674199d438833544d48da2e', name: this.icon ?? this.getDefaultIcon(), size: "md", "data-scope": "icon" }), h("div", { key: 'a55e449e8e17560a70d3d40ff3b9e7e2855fbbac', "data-scope": "content" }, (this.heading || this.headingSlot) && (h("p", { key: 'd4c7b85c8b9c5c488b86ba4c8f0c456b8ea3ca2d', id: this.getHeadingId(), "data-scope": "heading" }, h("slot", { key: 'e1ef0d24ae77ee788c63d66bed7fee308f3f9d13', name: "heading" }, this.heading))), (this.message || this.messageSlot) && (h("p", { key: 'cd7d469058230fec03311e485da0360766633dd0', id: this.getMessageId(), "data-scope": "message" }, h("slot", { key: 'cd5000e571c1a7b19bbb0f59e58e938ee4e51361', name: "content" }, this.message))), this.actionsSlot && (h("div", { key: 'b0a19b512cc2fbce22907ac28828429202378e75', "data-scope": "actions" }, h("slot", { key: 'd40e04eb94154b319c8e212c76f1d932942137d0', name: "actions" })))))));
     }
     get el() { return getElement(this); }
 };

package/dist/esm/nv-notificationcontainer.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, d as Host } from './index-BCjiE1MF.js';
+import { r as registerInstance, h, d as Host } from './index-CTmBvINI.js';
 
 const nvNotificationcontainerCss = () => `nv-notificationcontainer{position:fixed;display:flex;flex-direction:column;padding:var(--spacing-2);padding-top:0;z-index:9999;pointer-events:none;width:100%;max-width:512px}nv-notificationcontainer.position-top-right{top:0;right:0}nv-notificationcontainer.position-top-right nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer.position-top-left{top:0;left:0}nv-notificationcontainer.position-top-left nv-notification{margin-bottom:var(--spacing-2)}nv-notificationcontainer.position-top-center{top:0;left:50%;transform:translateX(-50%)}nv-notificationcontainer.position-top-center nv-notification{margin-bottom:var(--spacing-2)}nv-notificationcontainer.position-bottom-right{bottom:0;right:0;flex-direction:column-reverse}nv-notificationcontainer.position-bottom-right nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer.position-bottom-left{bottom:0;left:0;flex-direction:column-reverse}nv-notificationcontainer.position-bottom-left nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer.position-bottom-center{bottom:0;left:50%;transform:translateX(-50%);flex-direction:column-reverse}nv-notificationcontainer.position-bottom-center nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer>*{pointer-events:auto}`;
 
@@ -16,7 +16,7 @@ const NvNotificationContainer = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'd2c471aaac0f76edade303331718d2b0f7c6bb39', class: `position-${this.position}` }, h("slot", { key: '48bbc563523bfb107bbbd2cc60561ccb87f9968c' })));
+        return (h(Host, { key: '3618bd72eb82ee09c8c971d83ea3e0dbb58f6fbf', class: `position-${this.position}` }, h("slot", { key: 'ed0d1b37dd23e984365a92d45c6ecae31a5bbac9' })));
     }
 };
 NvNotificationContainer.style = nvNotificationcontainerCss();

package/dist/esm/nv-pagination-nav.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, a as createEvent, h, d as Host } from './index-BCjiE1MF.js';
+import { r as registerInstance, a as createEvent, h, d as Host } from './index-CTmBvINI.js';
 
 /**
  * Generates a pagination range with page numbers and ellipsis items.
@@ -175,7 +175,7 @@ const NvPaginationNav = class {
     render() {
         const isFirstPage = this.currentPage === 1;
         const isLastPage = this.currentPage === this.totalPages;
-        return (h(Host, { key: 'b2255fce4e03cee8ff370086aac31df5c69d275d' }, h("nav", { key: 'a136b7193f9b00a68e6ee626802dee19fd762531', "data-scope": "pagination-nav", "aria-label": "Pagination navigation" }, this.isOnlyIcon ? (h("nv-iconbutton", { name: "chevron-left", size: "md", emphasis: "lower", disabled: isFirstPage, onClick: () => this.handlePageChange(this.currentPage - 1), "data-scope": "previous-iconbutton", "aria-label": this.previousButtonLabel })) : (h("nv-button", { size: "md", emphasis: "lower", disabled: isFirstPage, onClick: () => this.handlePageChange(this.currentPage - 1), "data-scope": "previous-button" }, h("nv-icon", { slot: "leading-icon", name: "chevron-left" }), this.previousButtonLabel)), h("ol", { key: '5bebe0e3f5c8f1799ed8980752fbed7aadbcac01', "data-scope": "page-list" }, calculatePaginationRange({
+        return (h(Host, { key: '2aecff38a5777b1e229b04110e774d4ac708e940' }, h("nav", { key: 'a470aab7d30178269f25eb794b447b6478ed274d', "data-scope": "pagination-nav", "aria-label": "Pagination navigation" }, this.isOnlyIcon ? (h("nv-iconbutton", { name: "chevron-left", size: "md", emphasis: "lower", disabled: isFirstPage, onClick: () => this.handlePageChange(this.currentPage - 1), "data-scope": "previous-iconbutton", "aria-label": this.previousButtonLabel })) : (h("nv-button", { size: "md", emphasis: "lower", disabled: isFirstPage, onClick: () => this.handlePageChange(this.currentPage - 1), "data-scope": "previous-button" }, h("nv-icon", { slot: "leading-icon", name: "chevron-left" }), this.previousButtonLabel)), h("ol", { key: '4ea58c4f536310c0d60354da84d9fd650a16dc67', "data-scope": "page-list" }, calculatePaginationRange({
             currentPage: this.currentPage,
             totalCount: this.totalCount,
             pageSize: this.pageSize,

package/dist/esm/nv-paginationtable.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, a as createEvent, h, d as Host } from './index-BCjiE1MF.js';
+import { r as registerInstance, a as createEvent, h, d as Host } from './index-CTmBvINI.js';
 
 /**
  * Pagination table utility functions for nv-paginationtable component
@@ -35,6 +35,19 @@ function interpolate(template, values, fallback) {
 function isFirstPage(pageIndex) {
     return pageIndex === 0;
 }
+/**
+ * Returns the 1-based page number to show in the page label.
+ * When there are no pages (empty/filtered-to-zero dataset), returns 0 so
+ * the label reads e.g. "Page 0 of 0" instead of "Page 1 of 0".
+ * @param {number} pageIndex - Current page index (zero-based)
+ * @param {number} pageCount - Total number of pages
+ * @returns {number} The page number to display (1-based, or 0 when no pages)
+ */
+function getDisplayPageNumber(pageIndex, pageCount) {
+    if (pageCount <= 0)
+        return 0;
+    return pageIndex + 1;
+}
 /**
  * Checks if navigation to the last/next page is possible
  * @param {number} pageIndex - Current page index (zero-based)
@@ -207,10 +220,13 @@ const NvPaginationtable = class {
         const atFirstPage = isFirstPage(this.pageIndex);
         const atLastPage = isLastPage(this.pageIndex, this.pageCount);
         // Use fallback values to handle undefined props (can happen when frameworks pass undefined explicitly)
-        const pageLabel = interpolate(this.labelPage, { pageIndex: this.pageIndex + 1, pageCount: this.pageCount }, 'Page {pageIndex} of {pageCount}');
+        const pageLabel = interpolate(this.labelPage, {
+            pageIndex: getDisplayPageNumber(this.pageIndex, this.pageCount),
+            pageCount: this.pageCount,
+        }, 'Page {pageIndex} of {pageCount}');
         const totalLabel = interpolate(this.labelTotal, { rowCount: this.rowCount }, 'Total: {rowCount} rows');
         const pageSizeOptions = generatePageSizeOptions(this.labelPageSizeOption ?? '{pageSize} per page');
-        return (h(Host, { key: '0556d5f0dc69faa503b504ec87c47819f92d565d' }, !this.hideControls && (h("div", { key: 'b097a2bda8c09b88db038c1039133a7ec2571247', "data-scope": "controls" }, !this.hideFirstLast && (h("nv-iconbutton", { key: '29841590c99ee7534d1d41933c4eb155a9b9a9db', name: "chevrons-left", emphasis: "lower", size: "sm", disabled: atFirstPage, onClick: () => this.firstPage() })), !this.hidePrevNext && (h("nv-iconbutton", { key: '9d075e5ea8ee0f1b77de4da5072862d076579778', name: "chevron-left", emphasis: "lower", size: "sm", disabled: atFirstPage, onClick: () => this.previousPage() })), !this.hidePrevNext && (h("nv-iconbutton", { key: '712ebb3f14e02945b20d57b85a891550a1e09e95', name: "chevron-right", emphasis: "lower", size: "sm", disabled: atLastPage, onClick: () => this.nextPage() })), !this.hideFirstLast && (h("nv-iconbutton", { key: '1982d2de200284b3bc70dd51bea9c452b2791038', name: "chevrons-right", emphasis: "lower", size: "sm", disabled: atLastPage, onClick: () => this.lastPage() })))), h("span", { key: '8c2f7473c47f4fcb9a8373c8b7030a7f56e8b682', "data-scope": "page-label" }, pageLabel), h("span", { key: '527cd649cf4e8ba1d62451d6910401076d555b86', "data-scope": "total" }, totalLabel), h("div", { key: '2bf99bd31d9d46059fc6ab52f6e20878ce2dea64', "data-scope": "per-page" }, h("nv-fieldselect", { key: '4f55796d8cccdf9f50792eb3ff3d448cdae8de07', value: String(this.pageSize), onValueChanged: this.handlePageSizeChange, options: pageSizeOptions })), h("slot", { key: '9b1dc7edf5dd4ed4be02705a11a3c04f5bcc81bd' })));
+        return (h(Host, { key: '5f0e4d93600b77cf9b54b99a1ccffb1048c389fe', role: "navigation", "aria-label": "Pagination" }, !this.hideControls && (h("div", { key: '5226510a0d4cabba98d7aafaa7e3cd7d413b2d8a', "data-scope": "controls" }, !this.hideFirstLast && (h("nv-iconbutton", { key: 'bdcb8d93cdf24821ab5cdedc0413a77f163e19a1', name: "chevrons-left", emphasis: "lower", size: "sm", disabled: atFirstPage, onClick: () => this.firstPage() })), !this.hidePrevNext && (h("nv-iconbutton", { key: '822cfe5bd177ebbdce436f0f850fad9a86aae1c5', name: "chevron-left", emphasis: "lower", size: "sm", disabled: atFirstPage, onClick: () => this.previousPage() })), !this.hidePrevNext && (h("nv-iconbutton", { key: 'fd0aa10dee6b72d816b6801c03e5be7fb9a3698d', name: "chevron-right", emphasis: "lower", size: "sm", disabled: atLastPage, onClick: () => this.nextPage() })), !this.hideFirstLast && (h("nv-iconbutton", { key: 'a5b8fa71a51d0157dc37b908f972c0d830b44b00', name: "chevrons-right", emphasis: "lower", size: "sm", disabled: atLastPage, onClick: () => this.lastPage() })))), h("span", { key: '0b09d7507a9d1f3dbabbb37265d6949243290b1b', "data-scope": "page-label" }, pageLabel), h("span", { key: '275c4a1ca625a0afc68bfff46fc3e2872e0f76c3', "data-scope": "total" }, totalLabel), h("div", { key: '8a329ccc7baaac9f580aed7d2a53ed7f940c123a', "data-scope": "per-page" }, h("nv-fieldselect", { key: '83c644de7d30e63e0a96ccccaefb311acdd7617c', value: String(this.pageSize), onValueChanged: this.handlePageSizeChange, options: pageSizeOptions })), h("slot", { key: '190b8c8587c25ca449339a6ea1bbd85bed06d35f' })));
     }
     static get watchers() { return {
         "pageIndex": [{

package/dist/esm/nv-popover.entry.js

@@ -1,4 +1,4 @@
-import { S as StencilCore, r as registerInstance, a as createEvent, h, d as Host, e as getElement } from './index-BCjiE1MF.js';
+import { S as StencilCore, r as registerInstance, a as createEvent, h, d as Host, e as getElement } from './index-CTmBvINI.js';
 import { u as useFade } from './fade.animation-DcRL9lcm.js';
 import { u as useGrow } from './grow.animation-D7ep_aVl.js';
 import './style-value-types.es-xlgmw4x8.js';
@@ -1957,7 +1957,7 @@ const NvPopover = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '8f9429a26146be5feff838bff9861c8016bcae72' }, h("slot", { key: '507917d729f202d0ec29e2011b0aae958a4474b5', name: "trigger" }), h("div", { key: 'cc85ae4610b0554b2cddd2fb62a8e8df5b8de21f', "data-scope": "popover", "data-strategy": this.strategy, hidden: true, ref: el => (this.popoverElement = el) }, this.hasArrow && (h("div", { key: 'e53a79dc2a4d439271d55391ad087c0db8abaf19', "data-scope": "arrow", ref: el => (this.arrowElement = el) })), h("slot", { key: 'ef72627c588727dff2f558133d46e1689a89fc24', name: "content" }))));
+        return (h(Host, { key: '01b6cff8203a7e1ffe5b05aeea7f8e35238ac9bb' }, h("slot", { key: '63264f349fbc817a8b4efe7272715942fc307863', name: "trigger" }), h("div", { key: '0a251a4447bbe7481a71465ac2402aeb156ba537', "data-scope": "popover", "data-strategy": this.strategy, hidden: true, ref: el => (this.popoverElement = el) }, this.hasArrow && (h("div", { key: 'c958f8cd4c8f19d4ac7e8779cb4555a5b9dbfc01', "data-scope": "arrow", ref: el => (this.arrowElement = el) })), h("slot", { key: '72d516982d54945924c88372a54d19ba568a4e4a', name: "content" }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/nv-row.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, d as Host } from './index-BCjiE1MF.js';
+import { r as registerInstance, h, d as Host } from './index-CTmBvINI.js';
 
 const nvRowCss = () => `nv-row{display:flex;flex-wrap:wrap;margin-right:calc(var(--spacing-4) * -1);margin-left:calc(var(--spacing-4) * -1);row-gap:var(--spacing-4)}`;
 
@@ -9,7 +9,7 @@ const NvRow = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'fa7853dd84c1d35ff72147a7b622f62fe89ee29b' }, h("slot", { key: '48edd35ada0b2df00b61a2522ac8ff33063b7831' })));
+        return (h(Host, { key: '6363fba1008818b66f1eeb4ade8949f56c7c23b0' }, h("slot", { key: '2a2399121ac20fb577a29c93ba764f196352a9b8' })));
     }
 };
 NvRow.style = nvRowCss();

package/dist/esm/nv-sidebar.entry.js

@@ -1,11 +1,15 @@
-import { r as registerInstance, a as createEvent, h, d as Host, e as getElement } from './index-BCjiE1MF.js';
+import { r as registerInstance, a as createEvent, h, d as Host, e as getElement } from './index-CTmBvINI.js';
 
-const nvSidebarCss = () => `nv-sidebarnavitem a,nv-sidebarnavitem a:link,nv-sidebarnavitem a:visited,nv-sidebarnavitem a:hover,nv-sidebarnavitem a:active,nv-sidebarnavsubitem a,nv-sidebarnavsubitem a:link,nv-sidebarnavsubitem a:visited,nv-sidebarnavsubitem a:hover,nv-sidebarnavsubitem a:active{color:inherit !important;text-decoration:none !important}nv-sidebar{display:flex;flex-direction:column;position:relative;height:100vh;background-color:var(--components-sidebar-background);border-right:var(--sidebar-divider-size) solid var(--components-sidebar-border);transition:width 0.3s ease;width:var(--sidebar-width)}nv-sidebar[collapsed]{width:var(--sidebar-width-collapsed)}nv-sidebar[collapsed] [data-hide-on-collapsed]{display:none !important}nv-sidebar[collapsed] .nv-sidebar-container{padding:var(--sidebar-padding-y) var(--sidebar-padding-x-collapsed)}nv-sidebar .nv-sidebar-container{display:flex;flex-direction:column;flex:1;overflow:hidden;padding:var(--sidebar-padding-y) var(--sidebar-padding-x);gap:var(--sidebar-gap-y)}nv-sidebar .nv-sidebar-toggle{position:absolute;top:var(--sidebar-collapsible-button-position-top);right:calc(-1 * var(--sidebar-collapsible-button-position-right));display:flex;align-items:center;justify-content:center;padding:var(--sidebar-collapsible-button-padding);background-color:var(--components-sidebar-background);border:1px solid var(--color-content-low-border);border-radius:var(--radius-rounded-full);cursor:pointer;transition:transform 0.2s ease;z-index:10}nv-sidebar .nv-sidebar-toggle:hover{background-color:var(--color-interaction-container-neutral-background-hover)}nv-sidebar .nv-sidebar-toggle:focus,nv-sidebar .nv-sidebar-toggle:focus-within{outline:none}nv-sidebar .nv-sidebar-toggle:focus-visible,nv-sidebar .nv-sidebar-toggle:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-sidebar .nv-sidebar-toggle nv-icon{width:var(--sidebar-collapsible-button-icon-size);height:var(--sidebar-collapsible-button-icon-size);color:var(--color-interaction-container-neutral-icon)}nv-sidebar .nv-sidebar-toggle nv-icon:hover{color:var(--color-interaction-container-neutral-icon-hover)}`;
+const nvSidebarCss = () => `nv-sidebarnavitem a,nv-sidebarnavitem a:link,nv-sidebarnavitem a:visited,nv-sidebarnavitem a:hover,nv-sidebarnavitem a:active,nv-sidebarnavsubitem a,nv-sidebarnavsubitem a:link,nv-sidebarnavsubitem a:visited,nv-sidebarnavsubitem a:hover,nv-sidebarnavsubitem a:active{color:inherit !important;text-decoration:none !important}nv-sidebar{display:flex;flex-direction:column;position:relative;height:100vh;background-color:var(--components-sidebar-background);border-right:var(--sidebar-divider-size) solid var(--components-sidebar-border);transition:width 0.3s ease;width:var(--sidebar-width)}nv-sidebar[collapsed]{width:var(--sidebar-width-collapsed)}nv-sidebar[collapsed] [data-hide-on-collapsed]{display:none !important}nv-sidebar[collapsed] .nv-sidebar-container{padding:var(--sidebar-padding-y) var(--sidebar-padding-x-collapsed)}nv-sidebar[resizing]{transition:none}nv-sidebar .nv-sidebar-container{display:flex;flex-direction:column;flex:1;overflow:hidden;padding:var(--sidebar-padding-y) var(--sidebar-padding-x);gap:var(--sidebar-gap-y)}nv-sidebar .nv-sidebar-toggle{position:absolute;top:var(--sidebar-collapsible-button-position-top);right:calc(-1 * var(--sidebar-collapsible-button-position-right));display:flex;align-items:center;justify-content:center;padding:var(--sidebar-collapsible-button-padding);background-color:var(--components-sidebar-background);border:1px solid var(--color-content-low-border);border-radius:var(--radius-rounded-full);cursor:pointer;transition:transform 0.2s ease;z-index:10}nv-sidebar .nv-sidebar-toggle:hover{background-color:var(--color-interaction-container-neutral-background-hover)}nv-sidebar .nv-sidebar-toggle:focus,nv-sidebar .nv-sidebar-toggle:focus-within{outline:none}nv-sidebar .nv-sidebar-toggle:focus-visible,nv-sidebar .nv-sidebar-toggle:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-sidebar .nv-sidebar-toggle nv-icon{width:var(--sidebar-collapsible-button-icon-size);height:var(--sidebar-collapsible-button-icon-size);color:var(--color-interaction-container-neutral-icon)}nv-sidebar .nv-sidebar-toggle nv-icon:hover{color:var(--color-interaction-container-neutral-icon-hover)}nv-sidebar .nv-sidebar-resize-handle{position:absolute;top:0;right:calc(-1 * var(--sidebar-divider-size));width:4px;height:100%;cursor:col-resize;background-color:transparent;transition:background-color 0.15s ease;z-index:9;user-select:none;touch-action:none}nv-sidebar .nv-sidebar-resize-handle:hover,nv-sidebar .nv-sidebar-resize-handle:focus-visible{background-color:var(--color-interaction-container-branded-high-background)}nv-sidebar .nv-sidebar-resize-handle:focus,nv-sidebar .nv-sidebar-resize-handle:focus-within{outline:none}nv-sidebar .nv-sidebar-resize-handle:focus-visible,nv-sidebar .nv-sidebar-resize-handle:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}`;
 
+const KEYBOARD_STEP = 8;
 const NvSidebar = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.openChanged = createEvent(this, "openChanged", 3);
+        this.widthChanged = createEvent(this, "widthChanged", 3);
+        this.resizeStartX = 0;
+        this.resizeStartWidth = 0;
         /****************************************************************************/
         //#region PROPERTIES
         /**
@@ -31,6 +35,23 @@ const NvSidebar = class {
          * - low: Less prominent appearance
          */
         this.notificationEmphasis = 'high';
+        /**
+         * When true, the sidebar can be resized horizontally by dragging its right edge.
+         * Only active when the sidebar is open (not collapsed).
+         */
+        this.resizable = false;
+        /**
+         * Minimum width in pixels when resizing.
+         */
+        this.minWidth = 200;
+        /**
+         * Maximum width in pixels when resizing.
+         */
+        this.maxWidth = 480;
+        //#endregion PROPERTIES
+        /****************************************************************************/
+        //#region STATE
+        this.resizing = false;
         //#endregion EVENTS
         /****************************************************************************/
         //#region METHODS
@@ -40,6 +61,81 @@ const NvSidebar = class {
                 this.open = !this.open;
             }
         };
+        this.handleResizeStart = (event) => {
+            if (event.button !== 0)
+                return;
+            if (this.resizing)
+                return;
+            if (!this.canResize())
+                return;
+            event.preventDefault();
+            this.resizing = true;
+            this.resizeStartX = event.clientX;
+            // clientWidth excludes the border, matching the CSS width that drives `--sidebar-width`
+            this.resizeStartWidth = this.el.clientWidth;
+            // Pointer capture routes subsequent pointer events to the handle even when
+            // the pointer leaves it, so releasing outside the window still fires pointerup
+            event.currentTarget.setPointerCapture(event.pointerId);
+        };
+        this.handleResizeMove = (event) => {
+            if (!this.resizing || !this.canResize())
+                return;
+            const delta = event.clientX - this.resizeStartX;
+            this.width = this.clampWidth(this.resizeStartWidth + delta);
+        };
+        this.handleResizeEnd = (event) => {
+            if (!this.resizing)
+                return;
+            this.releasePointerCapture(event);
+            this.resizing = false;
+            if (this.width != null) {
+                this.widthChanged.emit(this.width);
+            }
+        };
+        this.handleResizeCancel = (event) => {
+            // Pointer cancel means the interaction was aborted (browser gesture, system
+            // event). Release capture and drop the drag, but do not emit widthChanged
+            // since the value was not committed by the user.
+            if (!this.resizing)
+                return;
+            this.releasePointerCapture(event);
+            this.resizing = false;
+        };
+        this.cancelResize = () => {
+            if (!this.resizing)
+                return;
+            this.resizing = false;
+        };
+        this.handleResizeKeyDown = (event) => {
+            if (!this.canResize())
+                return;
+            const [min, max] = this.getBounds();
+            const current = this.width ?? this.el.clientWidth;
+            let next = null;
+            switch (event.key) {
+                case 'ArrowLeft':
+                    next = current - KEYBOARD_STEP;
+                    break;
+                case 'ArrowRight':
+                    next = current + KEYBOARD_STEP;
+                    break;
+                case 'Home':
+                    next = min;
+                    break;
+                case 'End':
+                    next = max;
+                    break;
+                default:
+                    return;
+            }
+            event.preventDefault();
+            const currentClamped = this.clampWidth(current);
+            const nextClamped = this.clampWidth(next);
+            if (nextClamped === currentClamped)
+                return;
+            this.width = nextClamped;
+            this.widthChanged.emit(this.width);
+        };
         /**
          * Sets the active state of navigation items based on activePath
          */
@@ -115,6 +211,48 @@ const NvSidebar = class {
             });
         };
     }
+    getBounds() {
+        // Fall back to the built-in defaults if a consumer passes a non-finite bound
+        const rawMin = Number.isFinite(this.minWidth) ? this.minWidth : 200;
+        const rawMax = Number.isFinite(this.maxWidth) ? this.maxWidth : 480;
+        return [Math.min(rawMin, rawMax), Math.max(rawMin, rawMax)];
+    }
+    clampWidth(value) {
+        const [min, max] = this.getBounds();
+        return Math.round(Math.min(Math.max(value, min), max));
+    }
+    canResize() {
+        return this.resizable && !(this.type === 'collapsible' && !this.open);
+    }
+    getAriaValueNow() {
+        if (this.width != null)
+            return this.clampWidth(this.width);
+        const [min] = this.getBounds();
+        return this.clampWidth(this.el?.clientWidth || min);
+    }
+    applyWidthStyle() {
+        if (this.width == null) {
+            this.el.style.removeProperty('--sidebar-width');
+            return;
+        }
+        if (!Number.isFinite(this.width)) {
+            // Guard against NaN/Infinity which would otherwise loop through @Watch('width') forever
+            this.width = undefined;
+            return;
+        }
+        const clamped = this.clampWidth(this.width);
+        if (clamped !== this.width) {
+            this.width = clamped;
+            return; // @Watch('width') will re-enter and apply the clamped value
+        }
+        this.el.style.setProperty('--sidebar-width', `${clamped}px`);
+    }
+    releasePointerCapture(event) {
+        const target = event.currentTarget;
+        if (target?.hasPointerCapture(event.pointerId)) {
+            target.releasePointerCapture(event.pointerId);
+        }
+    }
     handleCollapsedSideEffects(isCollapsed) {
         if (!isCollapsed) {
             return;
@@ -131,11 +269,32 @@ const NvSidebar = class {
     }
     onOpenChanged(newValue, oldValue) {
         this.handleCollapsedSideEffects(this.type === 'collapsible' && !newValue);
+        // Cancel any in-progress resize if the sidebar is programmatically collapsed
+        if (this.type === 'collapsible' && !newValue) {
+            this.cancelResize();
+        }
         // Only emit event when open state actually changes (not on re-render with same value)
         if (this.type === 'collapsible' && newValue !== oldValue) {
             this.openChanged.emit(newValue);
         }
     }
+    onWidthChanged() {
+        this.applyWidthStyle();
+    }
+    onBoundsChanged() {
+        // Re-clamp the current width against the new bounds so visuals and ARIA stay within range
+        if (this.width != null) {
+            const clamped = this.clampWidth(this.width);
+            if (clamped !== this.width) {
+                this.width = clamped;
+            }
+        }
+    }
+    onResizableChanged(newValue) {
+        if (!newValue) {
+            this.cancelResize();
+        }
+    }
     //#endregion WATCHERS
     /****************************************************************************/
     //#region LIFECYCLE
@@ -143,6 +302,7 @@ const NvSidebar = class {
         this.setActiveNavItems();
         this.setupMutationObserver();
         this.handleCollapsedSideEffects(this.type === 'collapsible' && !this.open);
+        this.applyWidthStyle();
     }
     disconnectedCallback() {
         if (this.mutationObserver) {
@@ -157,9 +317,11 @@ const NvSidebar = class {
     //#region RENDER
     render() {
         const isCollapsed = this.type === 'collapsible' && !this.open;
-        return (h(Host, { key: '7c77dc107335664b3844b38579f53c8805de09ca', role: "navigation", collapsed: isCollapsed ? true : undefined, "notification-intention": this.notificationIntention, "notification-emphasis": this.notificationEmphasis, "aria-expanded": this.type === 'collapsible' ? String(this.open) : undefined }, h("div", { key: '00e9958d45d311168ab3024eda4d0a45813a8152', class: "nv-sidebar-container" }, h("slot", { key: '047f6bda1730f65c403f6aefe52b7c06192001c3' })), this.type === 'collapsible' && (h("button", { key: '51174b4f74614dc1eb1bfc78aacc542d8c938a02', class: "nv-sidebar-toggle", onClick: this.handleToggle, "aria-label": this.open ? 'Collapse sidebar' : 'Expand sidebar' }, h("nv-icon", { key: '75fc4ce9ac319be982534d502d5c019ff7d8ebdf', name: this.open
+        const showResizeHandle = this.resizable && !isCollapsed;
+        const [ariaValueMin, ariaValueMax] = this.getBounds();
+        return (h(Host, { key: '24fa9b232e27fe864d6984bf947d9720ffd1804d', role: "navigation", collapsed: isCollapsed ? true : undefined, resizing: this.resizing ? true : undefined, "notification-intention": this.notificationIntention, "notification-emphasis": this.notificationEmphasis, "aria-expanded": this.type === 'collapsible' ? String(this.open) : undefined }, h("div", { key: 'c9d15e38ab0b18c34858fca91376439f300e2f61', class: "nv-sidebar-container" }, h("slot", { key: 'fe732ec38f8848dfc3516ee2a601d8ceb313b559' })), this.type === 'collapsible' && (h("button", { key: '53f9de5d7318cdea02abe6928dda4b488d43e0a8', class: "nv-sidebar-toggle", onClick: this.handleToggle, "aria-label": this.open ? 'Collapse sidebar' : 'Expand sidebar' }, h("nv-icon", { key: 'ea42dca24abed9ec5981027b0f5ac5ae9aaa3b1f', name: this.open
                 ? 'layout-sidebar-left-collapse'
-                : 'layout-sidebar-right-collapse', size: "sm" })))));
+                : 'layout-sidebar-right-collapse', size: "sm" }))), showResizeHandle && (h("div", { key: '1f28ce72b3eb61223d708d519761ab9eef182f2e', class: "nv-sidebar-resize-handle", role: "separator", "aria-orientation": "vertical", "aria-label": "Resize sidebar", "aria-valuenow": this.getAriaValueNow(), "aria-valuemin": ariaValueMin, "aria-valuemax": ariaValueMax, tabIndex: 0, onPointerDown: this.handleResizeStart, onPointerMove: this.handleResizeMove, onPointerUp: this.handleResizeEnd, onPointerCancel: this.handleResizeCancel, onKeyDown: this.handleResizeKeyDown }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -168,6 +330,18 @@ const NvSidebar = class {
             }],
         "open": [{
                 "onOpenChanged": 0
+            }],
+        "width": [{
+                "onWidthChanged": 0
+            }],
+        "minWidth": [{
+                "onBoundsChanged": 0
+            }],
+        "maxWidth": [{
+                "onBoundsChanged": 0
+            }],
+        "resizable": [{
+                "onResizableChanged": 0
             }]
     }; }
 };

package/dist/esm/nv-sidebarcontent.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, d as Host } from './index-BCjiE1MF.js';
+import { r as registerInstance, h, d as Host } from './index-CTmBvINI.js';
 
 const nvSidebarcontentCss = () => `nv-sidebarcontent{display:flex;flex-direction:column;flex:1;overflow-y:auto;overflow-x:hidden}`;
 
@@ -9,7 +9,7 @@ const NvSidebarcontent = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '1892ab4b2c7698bb6c0e2baae242650f3a967947', role: "list" }, h("slot", { key: 'a971f991f52e65f4bd83dafeee2cbdf7c4b6de51' })));
+        return (h(Host, { key: '85b6fd48dca4c6889c16453ba53e6bdcb692782a', role: "list" }, h("slot", { key: 'f2a2860c6bcd8a1196f191f6af2f3be28713d792' })));
     }
 };
 NvSidebarcontent.style = nvSidebarcontentCss();

package/dist/esm/nv-sidebardivider.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, d as Host } from './index-BCjiE1MF.js';
+import { r as registerInstance, h, d as Host } from './index-CTmBvINI.js';
 
 const nvSidebardividerCss = () => `nv-sidebardivider{display:block;height:var(--sidebar-divider-size);background-color:var(--components-sidebar-divider)}`;
 
@@ -9,7 +9,7 @@ const NvSidebardivider = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return h(Host, { key: 'f8b607a8376e9e27d33ff13da96765bf46231cc0', role: "separator", "aria-orientation": "horizontal" });
+        return h(Host, { key: '31125496c90eb141cd70a69ac24f5d2b2165821c', role: "separator", "aria-orientation": "horizontal" });
     }
 };
 NvSidebardivider.style = nvSidebardividerCss();

package/dist/esm/nv-sidebarfooter.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, d as Host } from './index-BCjiE1MF.js';
+import { r as registerInstance, h, d as Host } from './index-CTmBvINI.js';
 
 const nvSidebarfooterCss = () => `nv-sidebarfooter{display:block;margin-top:auto}`;
 
@@ -9,7 +9,7 @@ const NvSidebarfooter = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '4ef8bb09df1cca9008062f4dc8f0252472da6a66' }, h("slot", { key: 'b30037ecc79272287a5ad134b1b17ce9516d14c7' })));
+        return (h(Host, { key: '1d281299e81cf2081b6e77f3a47e75c8efe699fa' }, h("slot", { key: 'd0211b2b36ae6dc31f1a63e82eb8cc7c58c8e56a' })));
     }
 };
 NvSidebarfooter.style = nvSidebarfooterCss();

package/dist/esm/nv-sidebargroup.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, d as Host } from './index-BCjiE1MF.js';
+import { r as registerInstance, h, d as Host } from './index-CTmBvINI.js';
 
 const nvSidebargroupCss = () => `nv-sidebargroup{display:flex;flex-direction:column;gap:var(--sidebar-group-gap-y)}nv-sidebargroup .nv-sidebargroup-label{display:block;font-size:var(--font-size-sm);line-height:var(--line-height-sm);font-weight:var(--font-weight-medium-emphasis);color:var(--color-content-lower-text);letter-spacing:0;padding:var(--sidebar-title-padding-y) var(--sidebar-title-padding-x)}nv-sidebar[collapsed] nv-sidebargroup .nv-sidebargroup-label{display:none}`;
 
@@ -10,7 +10,7 @@ const NvSidebargroup = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'e23656515b0882eaeed7a9a3b5c772deab41cd9c', role: "group", "aria-label": this.label }, this.label && h("div", { key: '41600406fb5fd8f3845464260ccbcb3845d52b37', class: "nv-sidebargroup-label" }, this.label), h("slot", { key: '14303ef78c5da82c9a6d94d09a1e9341ade5bee4' })));
+        return (h(Host, { key: '039c251fd46c3c178d1fc5329cbf676947f9f736', role: "group", "aria-label": this.label }, this.label && h("div", { key: 'f2fc7cbbe469ab8f71caa86ec62ed98347c1072a', class: "nv-sidebargroup-label" }, this.label), h("slot", { key: '67cf9ff6aa2f61feaf1c3966e7975fbf5273229c' })));
     }
 };
 NvSidebargroup.style = nvSidebargroupCss();

package/dist/esm/nv-sidebarheader.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, d as Host } from './index-BCjiE1MF.js';
+import { r as registerInstance, h, d as Host } from './index-CTmBvINI.js';
 
 const nvSidebarheaderCss = () => `nv-sidebarheader{display:block}`;
 
@@ -9,7 +9,7 @@ const NvSidebarheader = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '5e0b6bdc78618f3e434b62b6f6e4d60c220895ce' }, h("slot", { key: 'ae0f11bea6f4f9bbe5376d0870453648dc4acc77' })));
+        return (h(Host, { key: 'f29fff2d903edbcea70de45e3aca5e7049872464' }, h("slot", { key: 'e5854558583d51d0dba078da41311fedcaeb9bc5' })));
     }
 };
 NvSidebarheader.style = nvSidebarheaderCss();

package/dist/esm/nv-sidebarlogo.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, d as Host } from './index-BCjiE1MF.js';
+import { r as registerInstance, h, d as Host } from './index-CTmBvINI.js';
 
 const nvSidebarlogoCss = () => `nv-sidebarlogo{display:block}nv-sidebarlogo .nv-sidebarlogo-container{display:flex;align-items:center;gap:var(--spacing-3)}nv-sidebarlogo .nv-sidebarlogo-full,nv-sidebarlogo .nv-sidebarlogo-collapsed{height:var(--spacing-8);width:auto;object-fit:contain}nv-sidebarlogo .nv-sidebarlogo-collapsed{display:none}nv-sidebarlogo .nv-sidebarlogo-title{font-size:var(--nv-sidebarlogo-font-size, var(--font-size-md));font-weight:var(--nv-sidebarlogo-font-weight, var(--font-weight-high-emphasis));font-family:var(--nv-sidebarlogo-font-family, inherit);color:var(--color-content-high-text);white-space:nowrap;overflow:hidden;transition:opacity 0.2s ease, max-width 0.3s ease, margin-left 0.3s ease;max-width:200px;opacity:1}nv-sidebar[collapsed] nv-sidebarlogo .nv-sidebarlogo-full{display:none}nv-sidebar[collapsed] nv-sidebarlogo .nv-sidebarlogo-collapsed{display:block}nv-sidebar[collapsed] nv-sidebarlogo .nv-sidebarlogo-title{max-width:0;opacity:0;margin-left:0}nv-sidebar[collapsed] nv-sidebarlogo .nv-sidebarlogo-container{justify-content:center;align-items:center;gap:0;width:100%;min-height:var(--spacing-12);padding:0}`;
 
@@ -19,7 +19,7 @@ const NvSidebarlogo = class {
     render() {
         const logoSrc = this.logo || this.defaultLogo;
         const collapsedLogoSrc = this.collapsedLogo || this.defaultCollapsedLogo;
-        return (h(Host, { key: '4a4ce90770480c97bbe8d940cf30f75b838de6c4' }, h("div", { key: '0ff88ef0a319410b0162f79738c13b3eb304fccb', class: "nv-sidebarlogo-container" }, h("img", { key: '6e94515fac21420295752374392e24de5079f013', src: logoSrc, alt: this.label || 'Logo', class: "nv-sidebarlogo-full" }), h("img", { key: '88f326b233a44c0e4bbc1efbeabfa619f27366a2', src: collapsedLogoSrc, alt: this.label || 'Logo', class: "nv-sidebarlogo-collapsed" }), h("slot", { key: 'bb09f8c0b8df53e8e3a47cc70235ca1599420ec1', name: "label" }), this.label && h("span", { key: 'b711afc9977d86decc2f475b457e8a8d6ed507f0', class: "nv-sidebarlogo-title" }, this.label))));
+        return (h(Host, { key: '6c8f69d79da3f6f308489b440951c4c70bbf1607' }, h("div", { key: '614c4925f8e26fbcb53387f0d166d51435a67759', class: "nv-sidebarlogo-container" }, h("img", { key: 'e6e6d3b5a024179c7e0042a3fd2be330379fd1c5', src: logoSrc, alt: this.label || 'Logo', class: "nv-sidebarlogo-full" }), h("img", { key: 'f58059a9ec0ddc7840e77fcd3ec64d1e30b87a13', src: collapsedLogoSrc, alt: this.label || 'Logo', class: "nv-sidebarlogo-collapsed" }), h("slot", { key: '2f895cfb6487af387d501bb0d22f39967a08b83a', name: "label" }), this.label && h("span", { key: 'df6039eb0a010bc547a3017ca50be61b9929337d', class: "nv-sidebarlogo-title" }, this.label))));
     }
 };
 NvSidebarlogo.style = nvSidebarlogoCss();

package/dist/esm/nv-sidebarnavitem.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, d as Host, e as getElement } from './index-BCjiE1MF.js';
+import { r as registerInstance, h, d as Host, e as getElement } from './index-CTmBvINI.js';
 
 const nvSidebarnavitemCss = () => `nv-sidebarnavitem{display:flex;flex-direction:column;gap:0}nv-sidebarnavitem .nv-sidebarnavitem-trigger{display:flex;align-items:center;gap:var(--sidebar-item-gap-x);padding:var(--sidebar-item-padding-y) var(--sidebar-item-padding-x);border-radius:var(--sidebar-item-radius);cursor:pointer;transition:all 0.15s ease;font-size:var(--sidebar-item-font-size);font-weight:var(--font-weight-medium-emphasis);color:var(--color-content-low-text);background:var(--components-sidebar-background);text-decoration:none;--nv-component-background:var(--components-sidebar-background);--nv-sidebarnavitem-background:var(--components-sidebar-background)}nv-sidebarnavitem .nv-sidebarnavitem-trigger:hover{background-color:var(--color-interaction-container-neutral-background-hover);color:var(--color-content-medium-text);--nv-component-background:var(--color-interaction-container-neutral-background-hover);--nv-sidebarnavitem-background:var(--color-interaction-container-neutral-background-hover)}nv-sidebarnavitem .nv-sidebarnavitem-trigger:focus,nv-sidebarnavitem .nv-sidebarnavitem-trigger:focus-within{outline:none}nv-sidebarnavitem .nv-sidebarnavitem-trigger:focus-visible,nv-sidebarnavitem .nv-sidebarnavitem-trigger:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-sidebarnavitem[active] .nv-sidebarnavitem-trigger{background-color:var(--color-interaction-container-neutral-background-active);color:var(--color-interaction-container-neutral-text-active);font-weight:var(--font-weight-medium-emphasis);--nv-component-background:var(--color-interaction-container-neutral-background-active);--nv-sidebarnavitem-background:var(--color-interaction-container-neutral-background-active)}nv-sidebarnavitem .nv-sidebarnavitem-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;color:inherit;width:var(--sidebar-item-icon-size);height:var(--sidebar-item-icon-size);position:relative}nv-sidebar[collapsed] nv-sidebarnavitem .nv-sidebarnavitem-icon{overflow:visible;margin:0;justify-content:center}nv-sidebar[collapsed] nv-sidebarnavitem .nv-sidebarnavitem-icon nv-notification-bullet{position:absolute;transform:translate(50%, -50%);z-index:1;--sidebar-notification-bullet-size-reduced:calc(     var(--sidebar-item-icon-size) * 0.4   )}nv-sidebarnavitem .nv-sidebarnavitem-content{flex:1;display:flex;align-items:center}nv-sidebarnavitem .nv-sidebarnavitem-content a{color:inherit !important;text-decoration:none !important;font-weight:var(--font-weight-medium-emphasis) !important;flex:1}nv-sidebarnavitem .nv-sidebarnavitem-trailing{display:flex;align-items:center;gap:var(--spacing-2);margin-left:auto}nv-sidebarnavitem .nv-sidebarnavitem-chevron{transition:transform 0.2s ease;color:inherit}nv-sidebarnavitem[open] .nv-sidebarnavitem-chevron{transform:rotate(180deg)}nv-sidebarnavitem .nv-sidebarnavitem-subitems{display:flex;flex-direction:column;gap:0;max-height:0;overflow:hidden;opacity:0;transition:max-height 0.3s ease, opacity 0.2s ease;padding-left:0}nv-sidebarnavitem[open] .nv-sidebarnavitem-subitems{opacity:1;margin-top:var(--spacing-1)}nv-sidebar[collapsed] nv-sidebarnavitem .nv-sidebarnavitem-trigger{justify-content:center;gap:0;padding:var(--sidebar-item-padding-y-collapsed) var(--sidebar-item-padding-x-collapsed)}nv-sidebar[collapsed] nv-sidebarnavitem .nv-sidebarnavitem-content{display:none}nv-sidebar[collapsed] nv-sidebarnavitem .nv-sidebarnavitem-trailing,nv-sidebar[collapsed] nv-sidebarnavitem .nv-sidebarnavitem-chevron{display:none}`;
 
@@ -271,7 +271,7 @@ const NvSidebarnavitem = class {
     render() {
         const showNotificationBullet = this.notificationCount !== undefined && this.notificationCount > 0;
         const notificationSize = this.isSidebarCollapsed ? 'reduced' : 'default';
-        return (h(Host, { key: '9fe0814616178746b91e3fd1ed085b69a24c5a59', role: "listitem" }, h("div", { key: 'ab54bdb0b6ef411626cc7c12656f6dced81f4140', class: "nv-sidebarnavitem-trigger", onClick: this.handleToggle, "aria-expanded": this.collapsible ? String(this.open) : undefined, "aria-current": this.active && !this.collapsible ? 'page' : undefined }, this.icon && (h("div", { key: '11c80c2443e30989b15b3439281794ef822b8a1a', class: "nv-sidebarnavitem-icon" }, h("nv-icon", { key: '2254b2be9015f66e42f8bf3c7b81d26469d230aa', name: this.icon, size: "md" }), showNotificationBullet && this.isSidebarCollapsed && (h("nv-notification-bullet", { key: 'bbf6f175b464a195886d8df1bde3f87fbaa56931', count: this.notificationCount, size: notificationSize, contrastingBorder: true })))), h("div", { key: 'a9b148ef62b4a58cb17ef63ab89dd1772ec10334', class: "nv-sidebarnavitem-content" }, h("slot", { key: 'ad8cc1679a186eedfe2d04100b5312cca5eab311' })), h("div", { key: '0716bcb01d00275d03d3780163d1c404a37bb0d4', class: "nv-sidebarnavitem-trailing" }, h("slot", { key: 'c714d7e45b82dbd964d522402a62afc4ca65852d', name: "trailing" }), showNotificationBullet && !this.isSidebarCollapsed && (h("nv-notification-bullet", { key: 'd854b2a57aaf1975bf01e5c7688d690ebf0d0b81', count: this.notificationCount, size: notificationSize })), this.collapsible && (h("nv-icon", { key: '3bafbebf228375155a6dc010982211cdda6ad455', name: "chevron-down", size: "sm", class: "nv-sidebarnavitem-chevron" })))), this.collapsible && this.hasSubitems && (h("div", { key: '710a6a6c3437dc74bd1f380cc5428e23f3fa7967', class: "nv-sidebarnavitem-subitems", ref: el => {
+        return (h(Host, { key: '5d7b7d92812e20fa0ff6765506afc26965bcad19', role: "listitem" }, h("div", { key: '080e96026b2b1d8ed1edfe3b291aea27b3ef6a29', class: "nv-sidebarnavitem-trigger", onClick: this.handleToggle, "aria-expanded": this.collapsible ? String(this.open) : undefined, "aria-current": this.active && !this.collapsible ? 'page' : undefined }, this.icon && (h("div", { key: 'e97b9141eaf73fb363374227b59317bdf40289a3', class: "nv-sidebarnavitem-icon" }, h("nv-icon", { key: '1c7f7bbf4fd36963873b70a65786e4f89463e636', name: this.icon, size: "md" }), showNotificationBullet && this.isSidebarCollapsed && (h("nv-notification-bullet", { key: '53151726d69a262a40e3eae7751757081e7cc70e', count: this.notificationCount, size: notificationSize, contrastingBorder: true })))), h("div", { key: '1a0a208300d3d17e7c1ecce3db5a307167be730e', class: "nv-sidebarnavitem-content" }, h("slot", { key: 'e92c48e3d9c71d767fe7e775c97d6da678f132e5' })), h("div", { key: '0f436e17da2cfadb01096eaa7854ad2c2ed2a4b3', class: "nv-sidebarnavitem-trailing" }, h("slot", { key: '71d23bd377b11c2bf5eaf17c25e26df33b4d9b53', name: "trailing" }), showNotificationBullet && !this.isSidebarCollapsed && (h("nv-notification-bullet", { key: '1d6c4ab8f326d39bd7b452d8b0fe44577369b9f4', count: this.notificationCount, size: notificationSize })), this.collapsible && (h("nv-icon", { key: '13f4eb6174a76790bac429227d05de1beae4b4ee', name: "chevron-down", size: "sm", class: "nv-sidebarnavitem-chevron" })))), this.collapsible && this.hasSubitems && (h("div", { key: '6d5a87e10c7394663237f466d36871fe7cce48ae', class: "nv-sidebarnavitem-subitems", ref: el => {
                 // Only update ref and initialize if element changed or not yet initialized
                 if (el !== this.subitemsRef) {
                     this.subitemsRef = el;
@@ -286,7 +286,7 @@ const NvSidebarnavitem = class {
                         });
                     }
                 }
-            } }, h("slot", { key: '0fbabb90cc3df4b7cea085eb108dfd7898929a8a', name: "subitems" })))));
+            } }, h("slot", { key: '6790db049f61ca41292bfd865884548a5a5da5d0', name: "subitems" })))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/nv-sidebarnavsubitem.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, d as Host } from './index-BCjiE1MF.js';
+import { r as registerInstance, h, d as Host } from './index-CTmBvINI.js';
 
 const nvSidebarnavsubitemCss = () => `nv-sidebarnavsubitem{display:flex;align-items:center;gap:var(--spacing-2);padding:var(--sidebar-item-padding-y) var(--sidebar-item-padding-x) var(--sidebar-item-padding-y) calc(var(--sidebar-sub-item-padding-left) + var(--sidebar-item-padding-x));cursor:pointer;transition:all 0.15s ease;position:relative;min-height:var(--spacing-10);background-color:var(--color-interaction-container-neutral-background);border-radius:var(--sidebar-item-radius);--nv-component-background:var(--color-interaction-container-neutral-background)}nv-sidebarnavsubitem:hover{background-color:var(--color-interaction-container-neutral-background-hover);--nv-component-background:var(--color-interaction-container-neutral-background-hover)}nv-sidebarnavsubitem:focus,nv-sidebarnavsubitem:focus-within{outline:none}nv-sidebarnavsubitem:focus-visible,nv-sidebarnavsubitem:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-sidebarnavsubitem .nv-sidebarnavsubitem-indicator{display:none}nv-sidebarnavsubitem .nv-sidebarnavsubitem-content{flex:1;display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--font-size-sm);color:var(--color-content-medium-text);text-decoration:none;font-weight:var(--font-weight-medium-emphasis)}nv-sidebarnavsubitem .nv-sidebarnavsubitem-content a{color:inherit !important;text-decoration:none !important;font-weight:var(--font-weight-medium-emphasis) !important;flex:1}nv-sidebarnavsubitem:hover .nv-sidebarnavsubitem-content{color:var(--color-content-medium-text)}nv-sidebarnavsubitem[active]{background-color:var(--color-interaction-container-neutral-background-active);--nv-component-background:var(--color-interaction-container-neutral-background-active)}nv-sidebarnavsubitem[active] .nv-sidebarnavsubitem-content{color:var(--color-interaction-container-neutral-text-active);font-weight:var(--font-weight-high-emphasis)}nv-sidebarnavsubitem .nv-sidebarnavsubitem-trailing{display:flex;align-items:center}nv-sidebar[collapsed] nv-sidebarnavsubitem .nv-sidebarnavsubitem-content{max-width:0;opacity:0;margin:0;overflow:hidden;transition:opacity 0.2s ease, max-width 0.2s ease}nv-sidebar[collapsed] nv-sidebarnavsubitem .nv-sidebarnavsubitem-indicator{margin-right:0;width:var(--spacing-6);justify-content:center}nv-sidebar[collapsed] nv-sidebarnavsubitem .nv-sidebarnavsubitem-trailing{display:none}`;
 
@@ -22,7 +22,7 @@ const NvSidebarnavsubitem = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '05f74ef3cf6f93804e4446fe23977d8773deb7e2', role: "listitem", "aria-current": this.active ? 'page' : undefined }, h("div", { key: 'f1f2db51fbff9c2f58ba317cb5fcbe1805cd189b', class: "nv-sidebarnavsubitem-indicator" }), h("div", { key: 'c476dfbda77ee7bcca1338ef8d8b103806e6e3a7', class: "nv-sidebarnavsubitem-content" }, h("slot", { key: 'b80cb20a4f13b691cbd31c344d442f8a23585a26' })), h("div", { key: '383dc01158c4752506a6069be9abe2e20b83b9e4', class: "nv-sidebarnavsubitem-trailing" }, h("slot", { key: '2c63f696dd64ef8f680f3b85959d756952fd8db4', name: "trailing" }))));
+        return (h(Host, { key: '868adf5adb19818ca6caab0f866bfd9c2bf1c6f6', role: "listitem", "aria-current": this.active ? 'page' : undefined }, h("div", { key: '212d3e04dde99a698081e8ffc3aa39e696883794', class: "nv-sidebarnavsubitem-indicator" }), h("div", { key: '2ac964d11cdc914e329a0b6edcc6753d8182e60d', class: "nv-sidebarnavsubitem-content" }, h("slot", { key: 'be2a8d0b2e81f6f299ae9574c1358cfba28ed1a9' })), h("div", { key: '62e4e65e5c502c379851201cf038c6ca49ec051d', class: "nv-sidebarnavsubitem-trailing" }, h("slot", { key: '45cb80e9cbc0ab886ff7124035e781ae7f616f75', name: "trailing" }))));
     }
 };
 NvSidebarnavsubitem.style = nvSidebarnavsubitemCss();

package/dist/esm/nv-split.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, a as createEvent, h, d as Host, e as getElement } from './index-BCjiE1MF.js';
+import { r as registerInstance, a as createEvent, h, d as Host, e as getElement } from './index-CTmBvINI.js';
 
 const nvSplitCss = () => `nv-split{display:flex;width:100%;height:100%;position:relative}nv-split[direction=horizontal]{flex-direction:row}nv-split[direction=vertical]{flex-direction:column}nv-split .nv-split-gutter{position:absolute;z-index:10;background:transparent;display:flex;align-items:center;justify-content:center;flex:0 0 auto;transition:background-color 0.2s ease}nv-split .nv-split-gutter::after{content:"";position:absolute;background:var(--components-splitter-line-background);transition:background-color 0.2s ease}nv-split .nv-split-gutter:hover::after{background:var(--components-splitter-line-background-hover)}nv-split .nv-split-gutter::before{content:"";background:var(--components-splitter-handle-background);position:absolute;background-repeat:no-repeat;background-position:center;transition:all 0.2s ease;pointer-events:none}nv-split[direction=horizontal]>.nv-split-gutter{width:var(--splitter-gutter);top:0;bottom:0;transform:translateX(-50%);cursor:col-resize}nv-split[direction=horizontal]>.nv-split-gutter::after{width:var(--splitter-line-width);background-color:var(--components-splitter-line-background);height:100%;left:50%;top:0%;transform:translateX(-50%)}nv-split[direction=horizontal]>.nv-split-gutter:hover::after{background-color:var(--components-splitter-line-background-hover)}nv-split[direction=horizontal]>.nv-split-gutter:active::after{background-color:var(--components-splitter-line-background-active)}nv-split[direction=horizontal]>.nv-split-gutter::before{background-color:var(--components-splitter-handle-background);width:var(--splitter-handle-wide);height:var(--splitter-handle-long);border-radius:var(--splitter-handle-radius);z-index:11;transition:all 0.2s ease}nv-split[direction=horizontal]>.nv-split-gutter:hover::before{background-color:var(--components-splitter-handle-background-hover)}nv-split[direction=horizontal]>.nv-split-gutter:active::before{background-color:var(--components-splitter-handle-background-active)}nv-split[direction=vertical]>.nv-split-gutter{height:var(--splitter-gutter);left:0;right:0;transform:translateY(-50%);cursor:row-resize}nv-split[direction=vertical]>.nv-split-gutter::after{height:var(--splitter-line-width);background-color:var(--components-splitter-line-background);width:100%;top:50%;left:0%;transform:translateY(-50%)}nv-split[direction=vertical]>.nv-split-gutter:hover::after{background-color:var(--components-splitter-line-background-hover)}nv-split[direction=vertical]>.nv-split-gutter:active::after{background-color:var(--components-splitter-line-background-active)}nv-split[direction=vertical]>.nv-split-gutter::before{background-color:var(--components-splitter-handle-background);width:var(--splitter-handle-long);height:var(--splitter-handle-wide);border-radius:var(--splitter-handle-radius);z-index:11;transition:all 0.2s ease}nv-split[direction=vertical]>.nv-split-gutter:hover::before{background-color:var(--components-splitter-handle-background-hover)}nv-split[direction=vertical]>.nv-split-gutter:active::before{background-color:var(--components-splitter-handle-background-active)}nv-split[data-dragging=true]>.nv-split-gutter::after{background:var(--components-splitter-line-background-active)}nv-split>[slot=pane]{box-sizing:border-box;flex:1 1 auto;overflow:hidden;min-width:0;min-height:0;display:flex;flex-direction:column;margin:0 !important}nv-split>[slot=pane]>nv-split{flex:1 1 auto;width:100%;height:100%}`;
 
@@ -321,7 +321,7 @@ const NvSplit = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '8ad8bebda77f9868b9715280c0157f247057026d', "data-dragging": this.isDragging.toString() }, h("slot", { key: '8ca002feab0c3cd7755a5f1f53864e4e20585420', name: "pane" }), h("slot", { key: 'f7f7352ed8c326ec263f6d617bcd84fea02689ea', name: "gutter" })));
+        return (h(Host, { key: '91f106634a9f04a3b6aced262ea84e75b294255e', "data-dragging": this.isDragging.toString() }, h("slot", { key: '17fb1041dc82b510d8c303208891a2eb455b885a', name: "pane" }), h("slot", { key: '4900d19af850f103a191769ef23c0cd5d2531375', name: "gutter" }), h("slot", { key: 'bfad8d859270f46094655103f10182c25c2c94fe' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {