@nvidia-elements/core 0.0.6 → 0.0.8

package/dist/page-header/page-header.examples.js.map

@@ -1 +1 @@
-{"version":3,"file":"page-header.examples.js","names":[],"sources":["../../src/page-header/page-header.examples.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html } from 'lit';\nimport '@nvidia-elements/core/page-header/define.js';\nimport '@nvidia-elements/core/logo/define.js';\nimport '@nvidia-elements/core/button/define.js';\nimport '@nvidia-elements/core/menu/define.js';\nimport '@nvidia-elements/core/dropdown/define.js';\nimport '@nvidia-elements/core/search/define.js';\nimport '@nvidia-elements/core/icon/define.js';\nimport '@nvidia-elements/core/icon-button/define.js';\n\nexport default {\n  title: 'Elements/Page Header',\n  component: 'nve-page-header',\n};\n\n/**\n * @summary Basic page header with logo, navigation links, and user actions in a standard layout structure.\n */\nexport const Default = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <nve-button selected container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"chat-bubble\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"search\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"switch-apps\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\">EL</nve-icon-button>\n</nve-page-header>\n  `\n  }\n};\n\n/**\n * @summary Use dropdowns and menus to allow progressive disclosure of extra navigation or global user actions.\n */\nexport const DropdownMenu = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <nve-button selected container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\" popovertarget=\"page-header-dropdown\">EL</nve-icon-button>\n</nve-page-header>\n<nve-dropdown position=\"bottom\" id=\"page-header-dropdown\">\n  <nve-menu>\n    <nve-menu-item><nve-icon name=\"person\"></nve-icon> Menu Item</nve-menu-item>\n    <nve-menu-item><nve-icon name=\"gear\"></nve-icon> Menu Item</nve-menu-item>\n    <nve-menu-item><nve-icon name=\"star\"></nve-icon> Menu Item</nve-menu-item>\n    <nve-divider></nve-divider>\n    <nve-menu-item><nve-icon name=\"logout\"></nve-icon> Menu Item</nve-menu-item>\n  </nve-menu>\n</nve-dropdown>\n  `\n  }\n};\n\n/**\n * @summary Use a Icon Button to represent collapsible top-level navigation, optimal for mobile or constrained viewport sizes.\n */\nexport const MenuButton = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-icon-button slot=\"prefix\" container=\"flat\" icon-name=\"menu\" aria-label=\"menu\"></nve-icon-button>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <nve-button selected container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"chat-bubble\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"search\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"switch-apps\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\">EL</nve-icon-button>\n</nve-page-header>\n  `\n  }\n};\n\n/**\n * @summary Use the Logo element when representing an application that is part of a suite of applications in a given problem domain.\n */\nexport const AppLogo = {\n  render: () => html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"yellow-nova\">AV</nve-logo>\n  <h2 nve-text=\"heading\" slot=\"prefix\">Infrastructure</h2>\n  <nve-button container=\"flat\" selected><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"chat-bubble\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"search\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"switch-apps\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\">EL</nve-icon-button>\n</nve-page-header>\n  `\n};\n\n/**\n * @summary Page header with primary navigation positioned after the logo and branding area.\n */\nexport const PrefixNavigation = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <nve-button container=\"flat\"><a href=\"#\">Features</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Guide</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Docs</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Teams</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n  <nve-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\"><a href=\"#\">Start Building</a></nve-button>\n</nve-page-header>\n  `\n  }\n};\n\n/**\n * @summary Page header with navigation centered in the available space for balanced visual hierarchy.\n */\nexport const CenterNavigation = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <div nve-layout=\"row align:center gap:xxs full\">\n    <nve-button container=\"flat\"><a href=\"#\">Features</a></nve-button>\n    <nve-button container=\"flat\"><a href=\"#\">Guide</a></nve-button>\n    <nve-button container=\"flat\"><a href=\"#\">Docs</a></nve-button>\n    <nve-button container=\"flat\"><a href=\"#\">Teams</a></nve-button>\n  </div>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n  <nve-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\"><a href=\"#\">Start Building</a></nve-button>\n</nve-page-header>\n  `\n  }\n};\n\n/**\n * @summary Page header with all navigation positioned at the end for common and persistent user actions between page navigation.\n */\nexport const SuffixNavigation = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Features</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Guide</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Docs</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Teams</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n  <nve-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\"><a href=\"#\">Start Building</a></nve-button>\n</nve-page-header>\n  `\n  }\n};\n\n/**\n * @summary Page header with integrated search functionality for content discovery within the application.\n */\nexport const Search = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <nve-button container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-search slot=\"suffix\" rounded style=\"width: 220px\">\n    <input type=\"search\" aria-label=\"search\" />\n  </nve-search>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n</nve-page-header>\n  `\n  }\n};\n\n/**\n * @summary Page header displaying user information and avatar for personalized application experiences.\n */\nexport const UserDetail = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <nve-button container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\">GH</nve-icon-button>\n  <div slot=\"suffix\" nve-layout=\"column gap:md\">\n    <p nve-text=\"label sm trim:none\">Grace Hopper</p>\n    <p nve-text=\"body sm muted trim:none nowrap\">infra-0087ef65-19e80</p>\n  </div>\n</nve-page-header>\n  `\n  }\n};"],"mappings":";AAGA,IAAA,IAAS"}
+{"version":3,"file":"page-header.examples.js","names":[],"sources":["../../src/page-header/page-header.examples.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html } from 'lit';\nimport '@nvidia-elements/core/page-header/define.js';\nimport '@nvidia-elements/core/logo/define.js';\nimport '@nvidia-elements/core/button/define.js';\nimport '@nvidia-elements/core/menu/define.js';\nimport '@nvidia-elements/core/dropdown/define.js';\nimport '@nvidia-elements/core/search/define.js';\nimport '@nvidia-elements/core/icon/define.js';\nimport '@nvidia-elements/core/icon-button/define.js';\n\nexport default {\n  title: 'Elements/Page Header',\n  component: 'nve-page-header',\n};\n\n/**\n * @summary Basic page header with logo, navigation links, and user actions in a standard layout structure.\n */\nexport const Default = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <nve-button selected container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"chat-bubble\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"search\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"switch-apps\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\">EL</nve-icon-button>\n</nve-page-header>\n  `\n  }\n};\n\n/**\n * @summary Use dropdowns and menus to allow progressive disclosure of extra navigation or global user actions.\n */\nexport const DropdownMenu = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <nve-button selected container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\" popovertarget=\"page-header-dropdown\">EL</nve-icon-button>\n</nve-page-header>\n<nve-dropdown position=\"bottom\" id=\"page-header-dropdown\">\n  <nve-menu>\n    <nve-menu-item><nve-icon name=\"person\"></nve-icon> Menu Item</nve-menu-item>\n    <nve-menu-item><nve-icon name=\"gear\"></nve-icon> Menu Item</nve-menu-item>\n    <nve-menu-item><nve-icon name=\"star\"></nve-icon> Menu Item</nve-menu-item>\n    <nve-divider></nve-divider>\n    <nve-menu-item><nve-icon name=\"logout\"></nve-icon> Menu Item</nve-menu-item>\n  </nve-menu>\n</nve-dropdown>\n  `\n  }\n};\n\n/**\n * @summary Use a Icon Button to represent collapsible top-level navigation, optimal for mobile or constrained viewport sizes.\n */\nexport const MenuButton = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-icon-button slot=\"prefix\" container=\"flat\" icon-name=\"menu\" aria-label=\"menu\"></nve-icon-button>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <nve-button selected container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"chat-bubble\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"search\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"switch-apps\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\">EL</nve-icon-button>\n</nve-page-header>\n  `\n  }\n};\n\n/**\n * @summary Use the Logo element when representing an application that is part of a suite of applications in a given problem domain.\n */\nexport const AppLogo = {\n  render: () => html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"yellow-nova\">AV</nve-logo>\n  <h2 nve-text=\"heading\" slot=\"prefix\">Infrastructure</h2>\n  <nve-button container=\"flat\" selected><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"chat-bubble\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"search\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"switch-apps\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\">EL</nve-icon-button>\n</nve-page-header>\n  `\n};\n\n/**\n * @summary Page header with primary navigation positioned after the logo and branding area.\n */\nexport const PrefixNavigation = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <nve-button container=\"flat\"><a href=\"#\">Features</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Guide</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Docs</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Teams</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n  <nve-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\"><a href=\"#\">Start Building</a></nve-button>\n</nve-page-header>\n  `\n  }\n};\n\n/**\n * @summary Page header with navigation centered in the available space for balanced visual hierarchy.\n */\nexport const CenterNavigation = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <div nve-layout=\"row align:center gap:xxs full\">\n    <nve-button container=\"flat\"><a href=\"#\">Features</a></nve-button>\n    <nve-button container=\"flat\"><a href=\"#\">Guide</a></nve-button>\n    <nve-button container=\"flat\"><a href=\"#\">Docs</a></nve-button>\n    <nve-button container=\"flat\"><a href=\"#\">Teams</a></nve-button>\n  </div>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n  <nve-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\"><a href=\"#\">Start Building</a></nve-button>\n</nve-page-header>\n  `\n  }\n};\n\n/**\n * @summary Page header with all navigation positioned at the end for common and persistent user actions between page navigation.\n */\nexport const SuffixNavigation = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Features</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Guide</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Docs</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Teams</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n  <nve-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\"><a href=\"#\">Start Building</a></nve-button>\n</nve-page-header>\n  `\n  }\n};\n\n/**\n * @summary Page header with integrated search functionality for content discovery within the application.\n */\nexport const Search = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <nve-button container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-search slot=\"suffix\" rounded style=\"width: 220px\">\n    <input type=\"search\" aria-label=\"search\" />\n  </nve-search>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n</nve-page-header>\n  `\n  }\n};\n\n/**\n * @summary Page header displaying user information and avatar for personalized application experiences.\n */\nexport const UserDetail = {\n  render: () => {\n    return html`\n<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <nve-button container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\">GH</nve-icon-button>\n  <div slot=\"suffix\" nve-layout=\"column gap:md\">\n    <p nve-text=\"label sm trim:none\">Grace Hopper</p>\n    <p nve-text=\"body sm muted trim:none nowrap\">infra-0087ef65-19e80</p>\n  </div>\n</nve-page-header>\n  `\n  }\n};"],"mappings":";AAGA,IAAA,IAAS"}

package/dist/page-header/page-header.examples.json

@@ -5,7 +5,7 @@
     {
       "id": "core-page-header_default",
       "name": "Default",
-      "template": "<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <nve-button selected container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"chat-bubble\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"search\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"switch-apps\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\">EL</nve-icon-button>\n</nve-page-header>\n",
+      "template": "<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <nve-button selected container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"chat-bubble\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"search\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"switch-apps\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\">EL</nve-icon-button>\n</nve-page-header>\n",
       "summary": "Basic page header with logo, navigation links, and user actions in a standard layout structure.",
       "description": "",
       "composition": true,
@@ -14,7 +14,7 @@
     {
       "id": "core-page-header_dropdown-menu",
       "name": "DropdownMenu",
-      "template": "<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <nve-button selected container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\" popovertarget=\"page-header-dropdown\"\n    >EL</nve-icon-button\n  >\n</nve-page-header>\n<nve-dropdown position=\"bottom\" id=\"page-header-dropdown\">\n  <nve-menu>\n    <nve-menu-item><nve-icon name=\"person\"></nve-icon> Menu Item</nve-menu-item>\n    <nve-menu-item><nve-icon name=\"gear\"></nve-icon> Menu Item</nve-menu-item>\n    <nve-menu-item><nve-icon name=\"star\"></nve-icon> Menu Item</nve-menu-item>\n    <nve-divider></nve-divider>\n    <nve-menu-item><nve-icon name=\"logout\"></nve-icon> Menu Item</nve-menu-item>\n  </nve-menu>\n</nve-dropdown>\n",
+      "template": "<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <nve-button selected container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\" popovertarget=\"page-header-dropdown\"\n    >EL</nve-icon-button\n  >\n</nve-page-header>\n<nve-dropdown position=\"bottom\" id=\"page-header-dropdown\">\n  <nve-menu>\n    <nve-menu-item><nve-icon name=\"person\"></nve-icon> Menu Item</nve-menu-item>\n    <nve-menu-item><nve-icon name=\"gear\"></nve-icon> Menu Item</nve-menu-item>\n    <nve-menu-item><nve-icon name=\"star\"></nve-icon> Menu Item</nve-menu-item>\n    <nve-divider></nve-divider>\n    <nve-menu-item><nve-icon name=\"logout\"></nve-icon> Menu Item</nve-menu-item>\n  </nve-menu>\n</nve-dropdown>\n",
       "summary": "Use dropdowns and menus to allow progressive disclosure of extra navigation or global user actions.",
       "description": "",
       "composition": true,
@@ -23,7 +23,7 @@
     {
       "id": "core-page-header_menu-button",
       "name": "MenuButton",
-      "template": "<nve-page-header>\n  <nve-icon-button slot=\"prefix\" container=\"flat\" icon-name=\"menu\" aria-label=\"menu\"></nve-icon-button>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <nve-button selected container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"chat-bubble\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"search\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"switch-apps\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\">EL</nve-icon-button>\n</nve-page-header>\n",
+      "template": "<nve-page-header>\n  <nve-icon-button slot=\"prefix\" container=\"flat\" icon-name=\"menu\" aria-label=\"menu\"></nve-icon-button>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <nve-button selected container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"chat-bubble\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"search\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" container=\"flat\" icon-name=\"switch-apps\"></nve-icon-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\">EL</nve-icon-button>\n</nve-page-header>\n",
       "summary": "Use a Icon Button to represent collapsible top-level navigation, optimal for mobile or constrained viewport sizes.",
       "description": "",
       "composition": true,
@@ -41,7 +41,7 @@
     {
       "id": "core-page-header_prefix-navigation",
       "name": "PrefixNavigation",
-      "template": "<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <nve-button container=\"flat\"><a href=\"#\">Features</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Guide</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Docs</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Teams</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n  <nve-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\"><a href=\"#\">Start Building</a></nve-button>\n</nve-page-header>\n",
+      "template": "<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <nve-button container=\"flat\"><a href=\"#\">Features</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Guide</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Docs</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Teams</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n  <nve-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\"><a href=\"#\">Start Building</a></nve-button>\n</nve-page-header>\n",
       "summary": "Page header with primary navigation positioned after the logo and branding area.",
       "description": "",
       "composition": true,
@@ -50,7 +50,7 @@
     {
       "id": "core-page-header_center-navigation",
       "name": "CenterNavigation",
-      "template": "<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <div nve-layout=\"row align:center gap:xxs full\">\n    <nve-button container=\"flat\"><a href=\"#\">Features</a></nve-button>\n    <nve-button container=\"flat\"><a href=\"#\">Guide</a></nve-button>\n    <nve-button container=\"flat\"><a href=\"#\">Docs</a></nve-button>\n    <nve-button container=\"flat\"><a href=\"#\">Teams</a></nve-button>\n  </div>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n  <nve-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\"><a href=\"#\">Start Building</a></nve-button>\n</nve-page-header>\n",
+      "template": "<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <div nve-layout=\"row align:center gap:xxs full\">\n    <nve-button container=\"flat\"><a href=\"#\">Features</a></nve-button>\n    <nve-button container=\"flat\"><a href=\"#\">Guide</a></nve-button>\n    <nve-button container=\"flat\"><a href=\"#\">Docs</a></nve-button>\n    <nve-button container=\"flat\"><a href=\"#\">Teams</a></nve-button>\n  </div>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n  <nve-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\"><a href=\"#\">Start Building</a></nve-button>\n</nve-page-header>\n",
       "summary": "Page header with navigation centered in the available space for balanced visual hierarchy.",
       "description": "",
       "composition": true,
@@ -59,7 +59,7 @@
     {
       "id": "core-page-header_suffix-navigation",
       "name": "SuffixNavigation",
-      "template": "<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Features</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Guide</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Docs</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Teams</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n  <nve-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\"><a href=\"#\">Start Building</a></nve-button>\n</nve-page-header>\n",
+      "template": "<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Features</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Guide</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Docs</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Teams</a></nve-button>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n  <nve-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\"><a href=\"#\">Start Building</a></nve-button>\n</nve-page-header>\n",
       "summary": "Page header with all navigation positioned at the end for common and persistent user actions between page navigation.",
       "description": "",
       "composition": true,
@@ -68,7 +68,7 @@
     {
       "id": "core-page-header_search",
       "name": "Search",
-      "template": "<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <nve-button container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-search slot=\"suffix\" rounded style=\"width: 220px\">\n    <input type=\"search\" aria-label=\"search\" />\n  </nve-search>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n</nve-page-header>\n",
+      "template": "<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <nve-button container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-search slot=\"suffix\" rounded style=\"width: 220px\">\n    <input type=\"search\" aria-label=\"search\" />\n  </nve-search>\n  <nve-button slot=\"suffix\" container=\"flat\"><a href=\"#\">Login</a></nve-button>\n</nve-page-header>\n",
       "summary": "Page header with integrated search functionality for content discovery within the application.",
       "description": "",
       "composition": true,
@@ -77,7 +77,7 @@
     {
       "id": "core-page-header_user-detail",
       "name": "UserDetail",
-      "template": "<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\"></nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">NVIDIA</h2>\n  <nve-button container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\">GH</nve-icon-button>\n  <div slot=\"suffix\" nve-layout=\"column gap:md\">\n    <p nve-text=\"label sm trim:none\">Grace Hopper</p>\n    <p nve-text=\"body sm muted trim:none nowrap\">infra-0087ef65-19e80</p>\n  </div>\n</nve-page-header>\n",
+      "template": "<nve-page-header>\n  <nve-logo slot=\"prefix\" size=\"sm\" color=\"brand-green\">NV</nve-logo>\n  <h2 slot=\"prefix\" nve-text=\"heading sm\">Infrastructure</h2>\n  <nve-button container=\"flat\"><a href=\"#\">Link 1</a></nve-button>\n  <nve-button container=\"flat\"><a href=\"#\">Link 2</a></nve-button>\n  <nve-icon-button slot=\"suffix\" interaction=\"emphasis\" size=\"sm\">GH</nve-icon-button>\n  <div slot=\"suffix\" nve-layout=\"column gap:md\">\n    <p nve-text=\"label sm trim:none\">Grace Hopper</p>\n    <p nve-text=\"body sm muted trim:none nowrap\">infra-0087ef65-19e80</p>\n  </div>\n</nve-page-header>\n",
       "summary": "Page header displaying user information and avatar for personalized application experiences.",
       "description": "",
       "composition": true,

package/dist/page-header/page-header.js

@@ -1,5 +1,5 @@
 //#region src/page-header/page-header.css?inline
-var e = ":host{--background: var(--nve-sys-layer-shell-background);--padding: var(--nve-ref-space-xs) var(--nve-ref-space-lg);--border-bottom: var(--nve-ref-border-width-sm) solid var(--nve-ref-border-color-muted);--margin-inline: var(--nve-ref-space-lg);contain:initial;height:48px;width:100%}[internal-host]{background:var(--background);padding:var(--padding);border-bottom:var(--border-bottom);display:flex;flex-direction:row;place-items:center flex-start;justify-content:space-between;line-height:0;height:100%}slot{display:flex;flex-direction:row;place-items:center flex-start;margin:0;min-height:0}slot:not([name]){width:100%;margin-inline:var(--margin-inline)}::slotted(h1[slot=\"prefix\"]),::slotted(h2[slot=\"prefix\"]),::slotted(a[slot=\"prefix\"]){font-size:var(--nve-ref-font-size-200)!important;font-weight:var(--nve-ref-font-weight-semibold)!important;color:var(--nve-sys-text-muted-color)!important;margin:0!important;text-wrap:nowrap!important;text-decoration:none!important}::slotted(h1[slot=\"prefix\"]):before,::slotted(h2[slot=\"prefix\"]):before,::slotted(a[slot=\"prefix\"]):before,::slotted(h1[slot=\"prefix\"]):after,::slotted(h2[slot=\"prefix\"]):after,::slotted(a[slot=\"prefix\"]):after{display:none!important}[internal-host]{--gap: var(--nve-ref-space-xxs)}slot{gap:var(--gap)}::slotted([slot=\"prefix\"]:not([container=\"flat\"])){margin-inline-end:var(--gap)!important}::slotted([slot=\"suffix\"]:not([container=\"flat\"])){margin-inline-start:var(--gap)!important}::slotted(nve-icon-button[interaction][slot=\"suffix\"]:last-child){margin-inline-start:var(--nve-ref-space-md)!important}";
+var e = ":host{--background: var(--nve-sys-layer-shell-background);--padding: var(--nve-ref-space-xs) var(--nve-ref-space-lg);--border-bottom: var(--nve-ref-border-width-sm) solid var(--nve-ref-border-color-muted);--margin-inline: var(--nve-ref-space-lg);contain:initial;height:48px;width:100%}[internal-host]{background:var(--background);padding:var(--padding);border-bottom:var(--border-bottom);display:flex;flex-direction:row;place-items:center flex-start;justify-content:space-between;line-height:0;height:100%}slot{display:flex;flex-direction:row;place-items:center flex-start;margin:0;min-height:0}slot:not([name]){width:100%;margin-inline:var(--margin-inline)}::slotted(h1[slot=\"prefix\"]),::slotted(h2[slot=\"prefix\"]),::slotted(a[slot=\"prefix\"]){font-size:var(--nve-ref-font-size-200)!important;font-weight:var(--nve-ref-font-weight-semibold)!important;color:var(--nve-sys-text-muted-color)!important;margin:0!important;text-wrap:nowrap!important;text-decoration:none!important}::slotted(h1[slot=\"prefix\"]):before,::slotted(h2[slot=\"prefix\"]):before,::slotted(a[slot=\"prefix\"]):before,::slotted(h1[slot=\"prefix\"]):after,::slotted(h2[slot=\"prefix\"]):after,::slotted(a[slot=\"prefix\"]):after{display:none!important}::slotted(a),::slotted(span){text-wrap:nowrap!important}[internal-host]{--gap: var(--nve-ref-space-xxs)}slot{gap:var(--gap)}::slotted([slot=\"prefix\"]:not([container=\"flat\"])){margin-inline-end:var(--gap)!important}::slotted([slot=\"suffix\"]:not([container=\"flat\"])){margin-inline-start:var(--gap)!important}::slotted(nve-icon-button[interaction][slot=\"suffix\"]:last-child){margin-inline-start:var(--nve-ref-space-md)!important}";
 //#endregion
 export { e as default };
 

package/dist/page-header/page-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"page-header.js","names":[],"sources":["../../src/page-header/page-header.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n  --background: var(--nve-sys-layer-shell-background);\n  --padding: var(--nve-ref-space-xs) var(--nve-ref-space-lg);\n  --border-bottom: var(--nve-ref-border-width-sm) solid var(--nve-ref-border-color-muted);\n  --margin-inline: var(--nve-ref-space-lg);\n  contain: initial;\n  height: 48px;\n  width: 100%;\n}\n\n[internal-host] {\n  background: var(--background);\n  padding: var(--padding);\n  border-bottom: var(--border-bottom);\n  display: flex;\n  flex-direction: row;\n  place-items: center flex-start;\n  justify-content: space-between;\n  line-height: 0;\n  height: 100%;\n}\n\nslot {\n  display: flex;\n  flex-direction: row;\n  place-items: center flex-start;\n  margin: 0;\n  min-height: 0;\n}\n\nslot:not([name]) {\n  width: 100%;\n  margin-inline: var(--margin-inline);\n}\n\n::slotted(h1[slot='prefix']),\n::slotted(h2[slot='prefix']),\n::slotted(a[slot='prefix']) {\n  font-size: var(--nve-ref-font-size-200) !important;\n  font-weight: var(--nve-ref-font-weight-semibold) !important;\n  color: var(--nve-sys-text-muted-color) !important;\n  margin: 0 !important;\n  text-wrap: nowrap !important;\n  text-decoration: none !important;\n}\n\n::slotted(h1[slot='prefix'])::before,\n::slotted(h2[slot='prefix'])::before,\n::slotted(a[slot='prefix'])::before,\n::slotted(h1[slot='prefix'])::after,\n::slotted(h2[slot='prefix'])::after,\n::slotted(a[slot='prefix'])::after {\n  display: none !important;\n}\n\n/* gap spacing, not API exposed yet as this is still stabilizing */\n[internal-host] {\n  --gap: var(--nve-ref-space-xxs);\n}\n\nslot {\n  gap: var(--gap);\n}\n\n::slotted([slot='prefix']:not([container='flat'])) {\n  margin-inline-end: var(--gap) !important;\n}\n\n::slotted([slot='suffix']:not([container='flat'])) {\n  margin-inline-start: var(--gap) !important;\n}\n\n::slotted(nve-icon-button[interaction][slot='suffix']:last-child) {\n  margin-inline-start: var(--nve-ref-space-md) !important;\n}\n"],"mappings":""}
+{"version":3,"file":"page-header.js","names":[],"sources":["../../src/page-header/page-header.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n  --background: var(--nve-sys-layer-shell-background);\n  --padding: var(--nve-ref-space-xs) var(--nve-ref-space-lg);\n  --border-bottom: var(--nve-ref-border-width-sm) solid var(--nve-ref-border-color-muted);\n  --margin-inline: var(--nve-ref-space-lg);\n  contain: initial;\n  height: 48px;\n  width: 100%;\n}\n\n[internal-host] {\n  background: var(--background);\n  padding: var(--padding);\n  border-bottom: var(--border-bottom);\n  display: flex;\n  flex-direction: row;\n  place-items: center flex-start;\n  justify-content: space-between;\n  line-height: 0;\n  height: 100%;\n}\n\nslot {\n  display: flex;\n  flex-direction: row;\n  place-items: center flex-start;\n  margin: 0;\n  min-height: 0;\n}\n\nslot:not([name]) {\n  width: 100%;\n  margin-inline: var(--margin-inline);\n}\n\n::slotted(h1[slot='prefix']),\n::slotted(h2[slot='prefix']),\n::slotted(a[slot='prefix']) {\n  font-size: var(--nve-ref-font-size-200) !important;\n  font-weight: var(--nve-ref-font-weight-semibold) !important;\n  color: var(--nve-sys-text-muted-color) !important;\n  margin: 0 !important;\n  text-wrap: nowrap !important;\n  text-decoration: none !important;\n}\n\n::slotted(h1[slot='prefix'])::before,\n::slotted(h2[slot='prefix'])::before,\n::slotted(a[slot='prefix'])::before,\n::slotted(h1[slot='prefix'])::after,\n::slotted(h2[slot='prefix'])::after,\n::slotted(a[slot='prefix'])::after {\n  display: none !important;\n}\n\n::slotted(a),\n::slotted(span) {\n  text-wrap: nowrap !important;\n}\n\n/* gap spacing, not API exposed yet as this is still stabilizing */\n[internal-host] {\n  --gap: var(--nve-ref-space-xxs);\n}\n\nslot {\n  gap: var(--gap);\n}\n\n::slotted([slot='prefix']:not([container='flat'])) {\n  margin-inline-end: var(--gap) !important;\n}\n\n::slotted([slot='suffix']:not([container='flat'])) {\n  margin-inline-start: var(--gap) !important;\n}\n\n::slotted(nve-icon-button[interaction][slot='suffix']:last-child) {\n  margin-inline-start: var(--nve-ref-space-md) !important;\n}\n"],"mappings":""}

package/dist/page-header/page-header2.js

@@ -10,7 +10,7 @@ var a = class extends r {
 	static {
 		this.metadata = {
 			tag: "nve-page-header",
-			version: "0.0.6"
+			version: "0.0.8"
 		};
 	}
 	render() {

package/dist/page-loader/page-loader2.js

@@ -18,7 +18,7 @@ var u = class extends s {
 	static {
 		this.metadata = {
 			tag: "nve-page-loader",
-			version: "0.0.6"
+			version: "0.0.8"
 		};
 	}
 	static {

package/dist/pagination/pagination.d.ts

@@ -30,6 +30,8 @@ declare const Pagination_base: {
         readonly _validators: import('@nvidia-elements/forms').Validator[];
         readonly _internals: ElementInternals;
         connectedCallback(): void;
+        disconnectedCallback(): void;
+        _stopInternalPropagation: (event: Event) => void;
         attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
         _handleAttributeChange(name: string, newValue: string): void;
         formResetCallback(): void;
@@ -398,7 +400,6 @@ declare const Pagination_base: {
         tabIndex: number;
         blur(): void;
         focus(options?: FocusOptions): void;
-        disconnectedCallback?(): void;
         requestUpdate?(name?: string, oldValue?: unknown): void;
     };
     formAssociated: boolean;

package/dist/pagination/pagination2.js

@@ -21,7 +21,7 @@ var g = class extends h(d) {
 	static {
 		this.metadata = {
 			tag: "nve-pagination",
-			version: "0.0.6",
+			version: "0.0.8",
 			valueSchema: { type: "number" }
 		};
 	}

package/dist/panel/panel-content.js.map

@@ -1 +1 @@
-{"version":3,"file":"panel-content.js","names":[],"sources":["../../src/panel/panel-content.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n  --padding: var(--nve-ref-size-300) var(--nve-ref-size-400);\n  padding: var(--padding);\n  color: var(--color);\n  flex-grow: 1;\n  width: 100%;\n  contain: none;\n}\n\n::slotted(nve-menu),\n::slotted(nve-menu) {\n  --width: 100%;\n}\n"],"mappings":""}
+{"version":3,"file":"panel-content.js","names":[],"sources":["../../src/panel/panel-content.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n  --padding: var(--nve-ref-size-300) var(--nve-ref-size-400);\n  padding: var(--padding);\n  color: var(--color);\n  flex-grow: 1;\n  width: 100%;\n  contain: none;\n}\n\n::slotted(nve-menu) {\n  --width: 100%;\n}\n"],"mappings":""}

package/dist/panel/panel-footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"panel-footer.js","names":[],"sources":["../../src/panel/panel-footer.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n  --padding: var(--nve-ref-size-300) var(--nve-ref-size-400);\n  --border-top: var(--nve-ref-border-width-sm) solid var(--nve-ref-border-color-muted);\n  --gap: var(--nve-ref-space-sm);\n}\n\nfooter[internal-host] {\n  padding: var(--padding);\n  border-top: var(--border-top);\n  color: var(--color);\n  display: flex;\n  place-items: flex-start;\n  gap: var(--gap);\n\n  ::slotted(nve-button),\n  ::slotted(nve-button) {\n    flex-grow: 1;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"panel-footer.js","names":[],"sources":["../../src/panel/panel-footer.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n  --padding: var(--nve-ref-size-300) var(--nve-ref-size-400);\n  --border-top: var(--nve-ref-border-width-sm) solid var(--nve-ref-border-color-muted);\n  --gap: var(--nve-ref-space-sm);\n}\n\nfooter[internal-host] {\n  padding: var(--padding);\n  border-top: var(--border-top);\n  color: var(--color);\n  display: flex;\n  place-items: flex-start;\n  gap: var(--gap);\n\n  ::slotted(nve-button) {\n    flex-grow: 1;\n  }\n}\n"],"mappings":""}

package/dist/panel/panel2.js

@@ -21,7 +21,7 @@ var g = class extends f {
 	static {
 		this.metadata = {
 			tag: "nve-panel-header",
-			version: "0.0.6"
+			version: "0.0.8"
 		};
 	}
 	render() {
@@ -37,7 +37,7 @@ var g = class extends f {
 	static {
 		this.metadata = {
 			tag: "nve-panel-content",
-			version: "0.0.6"
+			version: "0.0.8"
 		};
 	}
 	render() {
@@ -50,7 +50,7 @@ var g = class extends f {
 	static {
 		this.metadata = {
 			tag: "nve-panel-footer",
-			version: "0.0.6"
+			version: "0.0.8"
 		};
 	}
 	render() {
@@ -69,7 +69,7 @@ var g = class extends f {
 	static {
 		this.metadata = {
 			tag: "nve-panel",
-			version: "0.0.6"
+			version: "0.0.8"
 		};
 	}
 	static {

package/dist/password/password2.js

@@ -23,7 +23,7 @@ var u = class extends r {
 	static {
 		this.metadata = {
 			tag: "nve-password",
-			version: "0.0.6"
+			version: "0.0.8"
 		};
 	}
 	static {

package/dist/preferences-input/preferences-input.d.ts

@@ -40,6 +40,8 @@ declare const PreferencesInput_base: {
         readonly _validators: import('@nvidia-elements/forms').Validator[];
         readonly _internals: ElementInternals;
         connectedCallback(): void;
+        disconnectedCallback(): void;
+        _stopInternalPropagation: (event: Event) => void;
         attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
         _handleAttributeChange(name: string, newValue: string): void;
         formResetCallback(): void;
@@ -408,7 +410,6 @@ declare const PreferencesInput_base: {
         tabIndex: number;
         blur(): void;
         focus(options?: FocusOptions): void;
-        disconnectedCallback?(): void;
         requestUpdate?(name?: string, oldValue?: unknown): void;
     };
     formAssociated: boolean;

package/dist/preferences-input/preferences-input2.js

@@ -43,7 +43,7 @@ var x = class extends g(d) {
 	static {
 		this.metadata = {
 			tag: "nve-preferences-input",
-			version: "0.0.6",
+			version: "0.0.8",
 			valueSchema: {
 				type: "object",
 				properties: {

package/dist/progress-bar/progress-bar2.js

@@ -16,7 +16,7 @@ var c = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-progress-bar",
-			version: "0.0.6"
+			version: "0.0.8"
 		};
 	}
 	render() {

package/dist/progress-ring/progress-ring.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress-ring.js","names":[],"sources":["../../src/progress-ring/progress-ring.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n  --background-color: var(--nve-sys-interaction-background);\n  --ring-color: var(--nve-sys-accent-secondary-background);\n  --ring-background-opacity: 1;\n  --ring-width: 2px;\n  --width: var(--nve-ref-size-800);\n  --height: var(--nve-ref-size-800);\n  --animation-duration: calc(var(--nve-ref-animation-duration-400) * 2.5);\n\n  width: var(--width);\n  height: var(--height);\n  container-type: size;\n}\n\n:host([size='xxs']) {\n  --ring-width: 3px;\n  --width: var(--nve-ref-size-300);\n  --height: var(--nve-ref-size-300);\n}\n\n:host([size='xs']) {\n  --ring-width: 3px;\n  --width: var(--nve-ref-size-400);\n  --height: var(--nve-ref-size-400);\n}\n\n:host([size='sm']) {\n  --ring-width: 2.5px;\n  --width: var(--nve-ref-size-600);\n  --height: var(--nve-ref-size-600);\n}\n\n:host([size='lg']) {\n  --width: var(--nve-ref-size-1000);\n  --height: var(--nve-ref-size-1000);\n}\n\n:host([size='xl']) {\n  --ring-width: 1px;\n  --width: calc(2 * var(--nve-ref-space-xxxl));\n  --height: calc(2 * var(--nve-ref-space-xxxl));\n}\n\n[internal-host] {\n  display: flex;\n  place-items: center;\n  place-content: center;\n  height: 100%;\n}\n\nsvg {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n\ncircle.background {\n  fill: var(--background-color);\n  opacity: var(--ring-background-opacity);\n  stroke: none;\n}\n\ncircle.ring {\n  fill: none;\n  stroke: var(--ring-color);\n  stroke-width: var(--ring-width);\n  stroke-linecap: round;\n  transform-origin: 50% 50%;\n  transform: rotate(-90deg);\n  transition: all 0.2s ease-in-out 0s;\n}\n\n:host([status='success']) {\n  --ring-color: var(--nve-sys-support-success-emphasis-color);\n  --background-color: var(--nve-sys-support-success-muted-color);\n}\n\n:host([status='warning']) {\n  --ring-color: var(--nve-sys-support-warning-emphasis-color);\n  --background-color: var(--nve-sys-support-warning-muted-color);\n}\n\n:host([status='danger']) {\n  --ring-color: var(--nve-sys-support-danger-emphasis-color);\n  --background-color: var(--nve-sys-support-danger-muted-color);\n}\n\n:host([status='neutral']) {\n  --ring-background-opacity: 0.5;\n  --ring-color: var(--color, var(--nve-sys-interaction-color));\n  --background-color: var(--color, var(--nve-sys-interaction-color));\n}\n\n:host([status='accent']) [internal-host]:not([indeterminate]) circle.background {\n  stroke: var(--background-color);\n  fill: none;\n  stroke-width: var(--ring-width);\n}\n\n:host([status='accent']) [internal-host][indeterminate] circle.background {\n  display: none;\n}\n\n:host([status='neutral']) [internal-host]:not([indeterminate]) circle.background {\n  stroke: var(--background-color);\n  fill: none;\n  stroke-width: var(--ring-width);\n}\n\n:host([status='neutral']) [internal-host][indeterminate] circle.background {\n  display: none;\n}\n\n[internal-host][indeterminate] circle.ring {\n  animation: var(--animation-duration) linear 0s infinite normal none running spin-infinite;\n}\n\n::slotted(nve-icon),\n::slotted(nve-icon),\nnve-icon {\n  --width: 50cqw;\n  --height: 50cqh;\n  --color: var(--ring-color);\n}\n\n@keyframes spin-infinite {\n  0% {\n    stroke-dasharray: 0.01px, 43.97px;\n    transform: rotate(0deg);\n  }\n\n  50% {\n    stroke-dasharray: 21.99px, 21.99px;\n    transform: rotate(450deg);\n  }\n\n  100% {\n    stroke-dasharray: 0.01px, 43.97px;\n    transform: rotate(1080deg);\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"progress-ring.js","names":[],"sources":["../../src/progress-ring/progress-ring.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n  --background-color: var(--nve-sys-interaction-background);\n  --ring-color: var(--nve-sys-accent-secondary-background);\n  --ring-background-opacity: 1;\n  --ring-width: 2px;\n  --width: var(--nve-ref-size-800);\n  --height: var(--nve-ref-size-800);\n  --animation-duration: calc(var(--nve-ref-animation-duration-400) * 2.5);\n\n  width: var(--width);\n  height: var(--height);\n  container-type: size;\n}\n\n:host([size='xxs']) {\n  --ring-width: 3px;\n  --width: var(--nve-ref-size-300);\n  --height: var(--nve-ref-size-300);\n}\n\n:host([size='xs']) {\n  --ring-width: 3px;\n  --width: var(--nve-ref-size-400);\n  --height: var(--nve-ref-size-400);\n}\n\n:host([size='sm']) {\n  --ring-width: 2.5px;\n  --width: var(--nve-ref-size-600);\n  --height: var(--nve-ref-size-600);\n}\n\n:host([size='lg']) {\n  --width: var(--nve-ref-size-1000);\n  --height: var(--nve-ref-size-1000);\n}\n\n:host([size='xl']) {\n  --ring-width: 1px;\n  --width: calc(2 * var(--nve-ref-space-xxxl));\n  --height: calc(2 * var(--nve-ref-space-xxxl));\n}\n\n[internal-host] {\n  display: flex;\n  place-items: center;\n  place-content: center;\n  height: 100%;\n}\n\nsvg {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n\ncircle.background {\n  fill: var(--background-color);\n  opacity: var(--ring-background-opacity);\n  stroke: none;\n}\n\ncircle.ring {\n  fill: none;\n  stroke: var(--ring-color);\n  stroke-width: var(--ring-width);\n  stroke-linecap: round;\n  transform-origin: 50% 50%;\n  transform: rotate(-90deg);\n  transition: all 0.2s ease-in-out 0s;\n}\n\n:host([status='success']) {\n  --ring-color: var(--nve-sys-support-success-emphasis-color);\n  --background-color: var(--nve-sys-support-success-muted-color);\n}\n\n:host([status='warning']) {\n  --ring-color: var(--nve-sys-support-warning-emphasis-color);\n  --background-color: var(--nve-sys-support-warning-muted-color);\n}\n\n:host([status='danger']) {\n  --ring-color: var(--nve-sys-support-danger-emphasis-color);\n  --background-color: var(--nve-sys-support-danger-muted-color);\n}\n\n:host([status='neutral']) {\n  --ring-background-opacity: 0.5;\n  --ring-color: var(--color, var(--nve-sys-interaction-color));\n  --background-color: var(--color, var(--nve-sys-interaction-color));\n}\n\n:host([status='accent']) [internal-host]:not([indeterminate]) circle.background {\n  stroke: var(--background-color);\n  fill: none;\n  stroke-width: var(--ring-width);\n}\n\n:host([status='accent']) [internal-host][indeterminate] circle.background {\n  display: none;\n}\n\n:host([status='neutral']) [internal-host]:not([indeterminate]) circle.background {\n  stroke: var(--background-color);\n  fill: none;\n  stroke-width: var(--ring-width);\n}\n\n:host([status='neutral']) [internal-host][indeterminate] circle.background {\n  display: none;\n}\n\n[internal-host][indeterminate] circle.ring {\n  animation: var(--animation-duration) linear 0s infinite normal none running spin-infinite;\n}\n\n::slotted(nve-icon),\nnve-icon {\n  --width: 50cqw;\n  --height: 50cqh;\n  --color: var(--ring-color);\n}\n\n@keyframes spin-infinite {\n  0% {\n    stroke-dasharray: 0.01px, 43.97px;\n    transform: rotate(0deg);\n  }\n\n  50% {\n    stroke-dasharray: 21.99px, 21.99px;\n    transform: rotate(450deg);\n  }\n\n  100% {\n    stroke-dasharray: 0.01px, 43.97px;\n    transform: rotate(1080deg);\n  }\n}\n"],"mappings":""}

package/dist/progress-ring/progress-ring2.js

@@ -20,7 +20,7 @@ var f = class extends c {
 	static {
 		this.metadata = {
 			tag: "nve-progress-ring",
-			version: "0.0.6"
+			version: "0.0.8"
 		};
 	}
 	static {

package/dist/progress-ring/progress-ring2.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress-ring2.js","names":["#i18nController","#hasStatusIconContent","#updateStatusIcon"],"sources":["../../src/progress-ring/progress-ring.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { PropertyValues } from 'lit';\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport type { Size, SupportStatus } from '@nvidia-elements/core/internal';\nimport { attachInternals, I18nController, scopedRegistry, statusIcons, useStyles } from '@nvidia-elements/core/internal';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport styles from './progress-ring.css?inline';\n\n/**\n * @element nve-progress-ring\n * @description The `progress-ring` component shows the status of a pending task. It also serves the basis of the page loading element.\n * @since 0.17.0\n * @entrypoint \\@nvidia-elements/core/progress-ring\n * @slot - Content to display in the ring center. Defaults to a status icon.\n * @slot status-icon - (deprecated) Use the default slot instead.\n * @cssprop --background-color\n * @cssprop --ring-color\n * @cssprop --ring-background-opacity\n * @cssprop --ring-width\n * @cssprop --width\n * @cssprop --height\n * @cssprop --animation-duration\n * @cssprop --color\n * @csspart icon - The icon element\n * @aria https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/progressbar_role\n */\n@scopedRegistry()\nexport class ProgressRing extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-progress-ring',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon\n  };\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  /** The current `value` of the progress ring. When not set, an indeterminate animation will show. */\n  @property({ type: Number }) value?: number;\n\n  /** The `max` value of the progress ring that the `value` is proportionally scaled to. */\n  @property({ type: Number }) max? = 100;\n\n  /** Four visual treatments represent the `status` of tasks. When `status` changes to `warning`, `success`, or `danger`, the component embeds appropriate icons. */\n  @property({ type: String, reflect: true }) status?: SupportStatus | 'neutral' = 'neutral';\n\n  /** T-shirt `size` of the progress indicator, used to scale the ring. */\n  @property({ type: String, reflect: true }) size?: Size | 'xxs' | 'xs' | 'xl';\n\n  #i18nController: I18nController<this> = new I18nController<this>(this);\n\n  /** Enables updating internal string values for internationalization. */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  @queryAssignedElements({ slot: 'status-icon' })\n  private _deprecatedStatusIconSlot!: Element[];\n\n  /**\n   * Tracks presence of content presence in deprecated status-icon slot.\n   */\n  #hasStatusIconContent = false;\n\n  render() {\n    return html`\n      <div internal-host ?indeterminate=${this.value === undefined}>\n        <svg viewBox=\"0 0 16 16\" role=\"presentation\">\n          <circle cx=\"8px\" cy=\"8px\" r=\"6.5px\" class=\"background\"></circle>\n          <circle cx=\"8px\" cy=\"8px\" r=\"6.5px\" class=\"ring\"\n            stroke-dasharray=${`${((this.value ?? 0) / (this.max ?? 100)) * 44}px 44px`}>\n          </circle>\n        </svg>\n        <slot>\n          ${\n            this.status !== 'accent' && !this.#hasStatusIconContent\n              ? html`<nve-icon part=\"icon\" .name=${this.status ? statusIcons[this.status] : undefined} .status=${this.status as SupportStatus} aria-hidden=\"true\"></nve-icon>`\n              : ''\n          }\n        </slot>\n        <slot name=\"status-icon\" @slotchange=${this.#updateStatusIcon}></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'progressbar';\n  }\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n    this._internals.ariaValueNow = `${this.value === undefined ? '' : this.value}`;\n    this._internals.ariaValueMax = `${this.max}`;\n    const i18nRecord = this.i18n as Record<string, string | undefined>;\n    this._internals.ariaLabel =\n      (this.status && i18nRecord[this.status] && i18nRecord[this.status] !== 'neutral'\n        ? i18nRecord[this.status]!\n        : this.i18n.information) ?? null;\n  }\n\n  #updateStatusIcon() {\n    this.#hasStatusIconContent = this._deprecatedStatusIconSlot.length > 0;\n    this.requestUpdate();\n  }\n}\n"],"mappings":";;;;;;;;;;;;AA+BO,IAAA,IAAA,cAA2B,EAAW;;0BAmBR,mBAG6C,uBAQ7C,MAAA,EAAqB;;;gBA7BxC,EAAU,CAAC,EAAO,CAAC;;;kBAER;GACzB,KAAK;GACL,SAAS;GACV;;;4BAE2B,GACzB,EAAK,SAAS,MAAM,GACtB;;CAiBD,KAAwC,IAAI,EAAqB,KAAK;CAWtE,KAAwB;CAExB,SAAS;AACP,SAAO,CAAI,sCAC2B,KAAK,UAAU,KAAA,EAAU,oLAIpC,IAAK,KAAK,SAAS,MAAM,KAAK,OAAO,OAAQ,GAAG,SAAS,yBAK5E,KAAK,WAAW,YAAY,CAAC,MAAA,IACzB,CAAI,gCAA+B,KAAK,SAAS,EAAY,KAAK,UAAU,KAAA,EAAU,aAAW,KAAK,OAAwB,oCAC9H,GACL,+CAEoC,MAAA,EAAuB;;CAKpE,oBAAoB;AAGlB,EAFA,MAAM,mBAAmB,EACzB,EAAgB,KAAK,EACrB,KAAK,WAAW,OAAO;;CAGzB,QAAQ,GAA6B;AAGnC,EAFA,MAAM,QAAQ,EAAM,EACpB,KAAK,WAAW,eAAe,GAAG,KAAK,UAAU,KAAA,IAAY,KAAK,KAAK,SACvE,KAAK,WAAW,eAAe,GAAG,KAAK;EACvC,IAAM,IAAa,KAAK;AACxB,OAAK,WAAW,aACb,KAAK,UAAU,EAAW,KAAK,WAAW,EAAW,KAAK,YAAY,YACnE,EAAW,KAAK,UAChB,KAAK,KAAK,gBAAgB;;CAGlC,KAAoB;AAElB,EADA,MAAA,IAA6B,KAAK,0BAA0B,SAAS,GACrE,KAAK,eAAe;;;GAhErB,EAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,EAAA,EAAA,WAAA,SAAA,KAAA,EAAA,KAG1B,EAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,EAAA,EAAA,WAAA,OAAA,KAAA,EAAA,KAG1B,EAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,UAAA,KAAA,EAAA,KAGzC,EAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,QAAA,KAAA,EAAA,KAKzC,EAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,EAAA,EAAA,WAAA,QAAA,KAAA,EAAA,KAE1B,EAAsB,EAAE,MAAM,eAAe,CAAC,CAAA,EAAA,EAAA,WAAA,6BAAA,KAAA,EAAA,SAjChD,GAAgB,CAAA,EAAA,EAAA"}
+{"version":3,"file":"progress-ring2.js","names":["#i18nController","#hasStatusIconContent","#updateStatusIcon"],"sources":["../../src/progress-ring/progress-ring.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { PropertyValues } from 'lit';\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport type { Size, SupportStatus } from '@nvidia-elements/core/internal';\nimport {\n  attachInternals,\n  I18nController,\n  scopedRegistry,\n  statusIcons,\n  useStyles\n} from '@nvidia-elements/core/internal';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport styles from './progress-ring.css?inline';\n\n/**\n * @element nve-progress-ring\n * @description The `progress-ring` component shows the status of a pending task. It also serves the basis of the page loading element.\n * @since 0.17.0\n * @entrypoint \\@nvidia-elements/core/progress-ring\n * @slot - Content to display in the ring center. Defaults to a status icon.\n * @slot status-icon - (deprecated) Use the default slot instead.\n * @cssprop --background-color\n * @cssprop --ring-color\n * @cssprop --ring-background-opacity\n * @cssprop --ring-width\n * @cssprop --width\n * @cssprop --height\n * @cssprop --animation-duration\n * @cssprop --color\n * @csspart icon - The icon element\n * @aria https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/progressbar_role\n */\n@scopedRegistry()\nexport class ProgressRing extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-progress-ring',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon\n  };\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  /** The current `value` of the progress ring. When not set, an indeterminate animation will show. */\n  @property({ type: Number }) value?: number;\n\n  /** The `max` value of the progress ring that the `value` is proportionally scaled to. */\n  @property({ type: Number }) max? = 100;\n\n  /** Four visual treatments represent the `status` of tasks. When `status` changes to `warning`, `success`, or `danger`, the component embeds appropriate icons. */\n  @property({ type: String, reflect: true }) status?: SupportStatus | 'neutral' = 'neutral';\n\n  /** T-shirt `size` of the progress indicator, used to scale the ring. */\n  @property({ type: String, reflect: true }) size?: Size | 'xxs' | 'xs' | 'xl';\n\n  #i18nController: I18nController<this> = new I18nController<this>(this);\n\n  /** Enables updating internal string values for internationalization. */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  @queryAssignedElements({ slot: 'status-icon' })\n  private _deprecatedStatusIconSlot!: Element[];\n\n  /**\n   * Tracks presence of content presence in deprecated status-icon slot.\n   */\n  #hasStatusIconContent = false;\n\n  render() {\n    return html`\n      <div internal-host ?indeterminate=${this.value === undefined}>\n        <svg viewBox=\"0 0 16 16\" role=\"presentation\">\n          <circle cx=\"8px\" cy=\"8px\" r=\"6.5px\" class=\"background\"></circle>\n          <circle cx=\"8px\" cy=\"8px\" r=\"6.5px\" class=\"ring\"\n            stroke-dasharray=${`${((this.value ?? 0) / (this.max ?? 100)) * 44}px 44px`}>\n          </circle>\n        </svg>\n        <slot>\n          ${\n            this.status !== 'accent' && !this.#hasStatusIconContent\n              ? html`<nve-icon part=\"icon\" .name=${this.status ? statusIcons[this.status] : undefined} .status=${this.status as SupportStatus} aria-hidden=\"true\"></nve-icon>`\n              : ''\n          }\n        </slot>\n        <slot name=\"status-icon\" @slotchange=${this.#updateStatusIcon}></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'progressbar';\n  }\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n    this._internals.ariaValueNow = `${this.value === undefined ? '' : this.value}`;\n    this._internals.ariaValueMax = `${this.max}`;\n    const i18nRecord = this.i18n as Record<string, string | undefined>;\n    this._internals.ariaLabel =\n      (this.status && i18nRecord[this.status] && i18nRecord[this.status] !== 'neutral'\n        ? i18nRecord[this.status]!\n        : this.i18n.information) ?? null;\n  }\n\n  #updateStatusIcon() {\n    this.#hasStatusIconContent = this._deprecatedStatusIconSlot.length > 0;\n    this.requestUpdate();\n  }\n}\n"],"mappings":";;;;;;;;;;;;AAqCO,IAAA,IAAA,cAA2B,EAAW;;0BAmBR,mBAG6C,uBAQ7C,MAAA,EAAqB;;;gBA7BxC,EAAU,CAAC,EAAO,CAAC;;;kBAER;GACzB,KAAK;GACL,SAAS;GACV;;;4BAE2B,GACzB,EAAK,SAAS,MAAM,GACtB;;CAiBD,KAAwC,IAAI,EAAqB,KAAK;CAWtE,KAAwB;CAExB,SAAS;AACP,SAAO,CAAI,sCAC2B,KAAK,UAAU,KAAA,EAAU,oLAIpC,IAAK,KAAK,SAAS,MAAM,KAAK,OAAO,OAAQ,GAAG,SAAS,yBAK5E,KAAK,WAAW,YAAY,CAAC,MAAA,IACzB,CAAI,gCAA+B,KAAK,SAAS,EAAY,KAAK,UAAU,KAAA,EAAU,aAAW,KAAK,OAAwB,oCAC9H,GACL,+CAEoC,MAAA,EAAuB;;CAKpE,oBAAoB;AAGlB,EAFA,MAAM,mBAAmB,EACzB,EAAgB,KAAK,EACrB,KAAK,WAAW,OAAO;;CAGzB,QAAQ,GAA6B;AAGnC,EAFA,MAAM,QAAQ,EAAM,EACpB,KAAK,WAAW,eAAe,GAAG,KAAK,UAAU,KAAA,IAAY,KAAK,KAAK,SACvE,KAAK,WAAW,eAAe,GAAG,KAAK;EACvC,IAAM,IAAa,KAAK;AACxB,OAAK,WAAW,aACb,KAAK,UAAU,EAAW,KAAK,WAAW,EAAW,KAAK,YAAY,YACnE,EAAW,KAAK,UAChB,KAAK,KAAK,gBAAgB;;CAGlC,KAAoB;AAElB,EADA,MAAA,IAA6B,KAAK,0BAA0B,SAAS,GACrE,KAAK,eAAe;;;GAhErB,EAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,EAAA,EAAA,WAAA,SAAA,KAAA,EAAA,KAG1B,EAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,EAAA,EAAA,WAAA,OAAA,KAAA,EAAA,KAG1B,EAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,UAAA,KAAA,EAAA,KAGzC,EAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,QAAA,KAAA,EAAA,KAKzC,EAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,EAAA,EAAA,WAAA,QAAA,KAAA,EAAA,KAE1B,EAAsB,EAAE,MAAM,eAAe,CAAC,CAAA,EAAA,EAAA,WAAA,6BAAA,KAAA,EAAA,SAjChD,GAAgB,CAAA,EAAA,EAAA"}

package/dist/progressive-filter-chip/progressive-filter-chip.global.js.map

@@ -1 +1 @@
-{"version":3,"file":"progressive-filter-chip.global.js","names":[],"sources":["../../src/progressive-filter-chip/progressive-filter-chip.global.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\nnve-progressive-filter-chip,\nnve-progressive-filter-chip {\n  &:has([status='error']) {\n    --background: transparent;\n  }\n\n  input::placeholder,\n  textarea::placeholder {\n    color: var(--nve-sys-text-placeholder-color) !important;\n  }\n\n  nve-select:not(:state(multiple)),\n  nve-select:not(:state(multiple)) {\n    --padding: 0 var(--nve-ref-size-200);\n  }\n\n  nve-select:not(:state(multiple))::part(caret),\n  nve-select:not(:state(multiple))::part(caret) {\n    display: none;\n  }\n}\n\nnve-progressive-filter-chip input::-webkit-search-cancel-button,\nnve-progressive-filter-chip input::-webkit-calendar-picker-indicator,\nnve-progressive-filter-chip input::-webkit-search-cancel-button,\nnve-progressive-filter-chip input::-webkit-calendar-picker-indicator {\n  opacity: 0 !important;\n  display: none !important;\n}\n"],"mappings":""}
+{"version":3,"file":"progressive-filter-chip.global.js","names":[],"sources":["../../src/progressive-filter-chip/progressive-filter-chip.global.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\nnve-progressive-filter-chip {\n  &:has([status='error']) {\n    --background: transparent;\n  }\n\n  input::placeholder,\n  textarea::placeholder {\n    color: var(--nve-sys-text-placeholder-color) !important;\n  }\n\n  nve-select:not(:state(multiple)) {\n    --padding: 0 var(--nve-ref-size-200);\n  }\n\n  nve-select:not(:state(multiple))::part(caret) {\n    display: none;\n  }\n}\n\nnve-progressive-filter-chip input::-webkit-search-cancel-button,\nnve-progressive-filter-chip input::-webkit-calendar-picker-indicator {\n  opacity: 0 !important;\n  display: none !important;\n}\n"],"mappings":""}

package/dist/progressive-filter-chip/progressive-filter-chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"progressive-filter-chip.js","names":[],"sources":["../../src/progressive-filter-chip/progressive-filter-chip.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n  --gap: 1px;\n  --border-radius: var(--nve-ref-border-radius-sm);\n  --background: color-mix(\n    in oklab,\n    var(--nve-sys-interaction-field-background) 95%,\n    var(--nve-sys-interaction-state-mix)\n  );\n  width: fit-content;\n  min-width: fit-content;\n  contain: initial;\n  --border: none;\n}\n\n[internal-host] {\n  gap: var(--gap);\n  border-radius: var(--border-radius);\n  background: var(--background);\n  display: flex;\n  overflow: hidden;\n  border: var(--border);\n}\n\n[nve-control],\n::slotted(nve-button),\n::slotted(nve-button) {\n  --font-weight: var(--nve-ref-font-weight-medium);\n  --border-radius: 0;\n  --width: fit-content;\n}\n\n::slotted([nve-control]),\n::slotted([nve-control]) {\n  --font-weight: var(--nve-ref-font-weight-medium);\n  --border-radius: 0;\n}\n\n[internal-host] > :nth-child(2) {\n  --font-weight: var(--nve-ref-font-weight-regular);\n}\n\nnve-select:not(:state(multiple))::part(caret) {\n  display: none;\n}\n\nnve-icon-button {\n  --border-radius: 0;\n  --padding: var(--nve-ref-size-300);\n}\n"],"mappings":""}
+{"version":3,"file":"progressive-filter-chip.js","names":[],"sources":["../../src/progressive-filter-chip/progressive-filter-chip.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n  --gap: 1px;\n  --border-radius: var(--nve-ref-border-radius-sm);\n  --background: color-mix(\n    in oklab,\n    var(--nve-sys-interaction-field-background) 95%,\n    var(--nve-sys-interaction-state-mix)\n  );\n  width: fit-content;\n  min-width: fit-content;\n  contain: initial;\n  --border: none;\n}\n\n[internal-host] {\n  gap: var(--gap);\n  border-radius: var(--border-radius);\n  background: var(--background);\n  display: flex;\n  overflow: hidden;\n  border: var(--border);\n}\n\n[nve-control],\n::slotted(nve-button) {\n  --font-weight: var(--nve-ref-font-weight-medium);\n  --border-radius: 0;\n  --width: fit-content;\n}\n\n::slotted([nve-control]) {\n  --font-weight: var(--nve-ref-font-weight-medium);\n  --border-radius: 0;\n}\n\n[internal-host] > :nth-child(2) {\n  --font-weight: var(--nve-ref-font-weight-regular);\n}\n\nnve-select:not(:state(multiple))::part(caret) {\n  display: none;\n}\n\nnve-icon-button {\n  --border-radius: 0;\n  --padding: var(--nve-ref-size-300);\n}\n"],"mappings":""}

package/dist/progressive-filter-chip/progressive-filter-chip2.js

@@ -23,7 +23,7 @@ var b = class extends h {
 	static {
 		this.metadata = {
 			tag: "nve-progressive-filter-chip",
-			version: "0.0.6"
+			version: "0.0.8"
 		};
 	}
 	static {
@@ -55,7 +55,7 @@ var b = class extends h {
 	#i(e) {
 		if (e.target && e.target.assignedElements().length) {
 			this.#a();
-			let e = Array.from(this.shadowRoot.querySelector("slot:not([name])").assignedElements()).filter((e) => e.matches("input, select, nve-button, nve-button, [nve-control], [nve-control]"));
+			let e = Array.from(this.shadowRoot.querySelector("slot:not([name])").assignedElements()).filter((e) => e.matches("input, select, nve-button, [nve-control]"));
 			e.forEach((e) => e.slot = t()), this.inputs = e.length ? e : this.inputs;
 		}
 	}

package/dist/progressive-filter-chip/progressive-filter-chip2.js.map

@@ -1 +1 @@
-{"version":3,"file":"progressive-filter-chip2.js","names":["#i18nController","#removeItem","#getControlTemplate","#typeClosableController","#createItems","#resetItems"],"sources":["../../src/progressive-filter-chip/progressive-filter-chip.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { state } from 'lit/decorators/state.js';\nimport {\n  appendRootNodeStyle,\n  attachInternals,\n  generateId,\n  I18nController,\n  scopedRegistry,\n  TypeClosableController,\n  typeSSR,\n  useStyles\n} from '@nvidia-elements/core/internal';\nimport { Input } from '@nvidia-elements/core/input';\nimport { Select } from '@nvidia-elements/core/select';\nimport { Date } from '@nvidia-elements/core/date';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport globalStyles from './progressive-filter-chip.global.css?inline';\nimport styles from './progressive-filter-chip.css?inline';\n\n/**\n * @element nve-progressive-filter-chip\n * @description A filter chip is a control that enables users to select many options from a set of choices.\n * @since 0.16.0\n * @entrypoint \\@nvidia-elements/core/progressive-filter-chip\n * @slot - default slot for content\n * @event close - Dispatched when the filter chip closes.\n * @cssprop --gap\n * @cssprop --border-radius\n * @cssprop --border\n * @cssprop --background\n * @cssprop --font-weight\n * @cssprop --padding\n * @cssprop --width\n * @csspart select - The select element\n * @csspart date - The date input element\n * @csspart input - The input element\n * @csspart icon-button - The icon button element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/toolbar/\n */\n@typeSSR()\n@scopedRegistry()\nexport class ProgressiveFilterChip extends LitElement {\n  static readonly metadata = {\n    tag: 'nve-progressive-filter-chip',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Input.metadata.tag]: Input,\n    [Select.metadata.tag]: Select,\n    [Date.metadata.tag]: Date,\n    [IconButton.metadata.tag]: IconButton\n  };\n\n  /** Determines if a close button should render within filter chip */\n  @property({ type: Boolean }) closable: boolean;\n\n  #i18nController: I18nController<this> = new I18nController<this>(this);\n\n  /** Enables updating internal string values for internationalization. */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  @state() private inputs: Element[] = [];\n\n  static styles = useStyles([styles]);\n\n  #typeClosableController = new TypeClosableController(this);\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  #getControlTemplate(el: Element) {\n    const slot = html`<slot name=${el.slot} @slotchange=${this.#removeItem}></slot>`;\n    if (el.tagName === 'SELECT') {\n      return html`<nve-select part=\"select\" multiple-overflow ?fit-text=${!(el as HTMLSelectElement).multiple}>${slot}</nve-select>`;\n    } else if (el.tagName === 'INPUT' && (el as HTMLInputElement).type === 'date') {\n      return html`<nve-date part=\"date\">${slot}</nve-date>`;\n    } else if (el.tagName === 'INPUT') {\n      return html`<nve-input part=\"input\">${slot}</nve-input>`;\n    } else {\n      return slot;\n    }\n  }\n\n  render() {\n    return html`\n    <div internal-host>\n      ${this.inputs.map(el => this.#getControlTemplate(el))}\n      ${this.closable ? html`<nve-icon-button part=\"icon-button\" exportparts=\"icon:icon-button-icon\" @click=${() => this.#typeClosableController.close()} .ariaLabel=${this.i18n.close} icon-name=\"cancel\"></nve-icon-button>` : nothing}\n    </div>\n    <slot hidden-slot @slotchange=${this.#createItems}></slot>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'toolbar';\n    this.setAttribute('nve-control', '');\n    appendRootNodeStyle(this, globalStyles);\n  }\n\n  #removeItem(e: Event) {\n    if (!(e.target as HTMLSlotElement).assignedElements().length) {\n      this.#resetItems();\n    }\n  }\n\n  #createItems(e: Event) {\n    if (e.target && (e.target as HTMLSlotElement).assignedElements().length) {\n      this.#resetItems();\n      const items = Array.from(\n        this.shadowRoot!.querySelector<HTMLSlotElement>('slot:not([name])')!.assignedElements()\n      ).filter(i => i.matches('input, select, nve-button, nve-button, [nve-control], [nve-control]'));\n      items.forEach(i => (i.slot = generateId()));\n      this.inputs = items.length ? items : this.inputs;\n    }\n  }\n\n  #resetItems() {\n    Array.from(this.shadowRoot!.querySelectorAll('slot'))\n      .flatMap(i => i.assignedElements())\n      .forEach(i => (i.slot = ''));\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AA6CO,IAAA,IAAA,cAAoC,EAAW;;2BAmBjB,MAAA,EAAqB,oBAEnB,EAAE;;;kBApBZ;GACzB,KAAK;GACL,SAAS;GACV;;;4BAE2B;IACzB,EAAM,SAAS,MAAM;IACrB,EAAO,SAAS,MAAM;IACtB,EAAK,SAAS,MAAM;IACpB,EAAW,SAAS,MAAM;GAC5B;;CAKD,KAAwC,IAAI,EAAqB,KAAK;;gBAOtD,EAAU,CAAC,EAAO,CAAC;;CAEnC,KAA0B,IAAI,EAAuB,KAAK;CAK1D,GAAoB,GAAa;EAC/B,IAAM,IAAO,CAAI,eAAc,EAAG,KAAK,iBAAe,MAAA,EAAiB;AAQrE,SAPE,EAAG,YAAY,WACV,CAAI,0DAAyD,CAAE,EAAyB,SAAS,IAAG,EAAK,iBACvG,EAAG,YAAY,WAAY,EAAwB,SAAS,SAC9D,CAAI,yBAAyB,EAAK,eAChC,EAAG,YAAY,UACjB,CAAI,2BAA2B,EAAK,gBAEpC;;CAIX,SAAS;AACP,SAAO,CAAI,sBAEP,KAAK,OAAO,KAAI,MAAM,MAAA,EAAyB,EAAG,CAAC,CAAC,GACpD,KAAK,WAAW,CAAI,yFAAwF,MAAA,EAA6B,OAAO,CAAC,gBAAc,KAAK,KAAK,MAAM,2CAA0C,EAAQ,uCAErM,MAAA,EAAkB;;CAIpD,oBAAoB;AAKlB,EAJA,MAAM,mBAAmB,EACzB,EAAgB,KAAK,EACrB,KAAK,WAAW,OAAO,WACvB,KAAK,aAAa,eAAe,GAAG,EACpC,EAAoB,MAAM,EAAa;;CAGzC,GAAY,GAAU;AACpB,EAAM,EAAE,OAA2B,kBAAkB,CAAC,UACpD,MAAA,GAAkB;;CAItB,GAAa,GAAU;AACrB,MAAI,EAAE,UAAW,EAAE,OAA2B,kBAAkB,CAAC,QAAQ;AACvE,SAAA,GAAkB;GAClB,IAAM,IAAQ,MAAM,KAClB,KAAK,WAAY,cAA+B,mBAAmB,CAAE,kBAAkB,CACxF,CAAC,QAAO,MAAK,EAAE,QAAQ,sEAAsE,CAAC;AAE/F,GADA,EAAM,SAAQ,MAAM,EAAE,OAAO,GAAY,CAAE,EAC3C,KAAK,SAAS,EAAM,SAAS,IAAQ,KAAK;;;CAI9C,KAAc;AACZ,QAAM,KAAK,KAAK,WAAY,iBAAiB,OAAO,CAAC,CAClD,SAAQ,MAAK,EAAE,kBAAkB,CAAC,CAClC,SAAQ,MAAM,EAAE,OAAO,GAAI;;;GAnE/B,EAAS,EAAE,MAAM,SAAS,CAAC,CAAA,EAAA,EAAA,WAAA,YAAA,KAAA,EAAA,KAK3B,EAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,EAAA,EAAA,WAAA,QAAA,KAAA,EAAA,KAE1B,GAAO,CAAA,EAAA,EAAA,WAAA,UAAA,KAAA,EAAA,SAvBT,GAAS,EACT,GAAgB,CAAA,EAAA,EAAA"}
+{"version":3,"file":"progressive-filter-chip2.js","names":["#i18nController","#removeItem","#getControlTemplate","#typeClosableController","#createItems","#resetItems"],"sources":["../../src/progressive-filter-chip/progressive-filter-chip.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { state } from 'lit/decorators/state.js';\nimport {\n  appendRootNodeStyle,\n  attachInternals,\n  generateId,\n  I18nController,\n  scopedRegistry,\n  TypeClosableController,\n  typeSSR,\n  useStyles\n} from '@nvidia-elements/core/internal';\nimport { Input } from '@nvidia-elements/core/input';\nimport { Select } from '@nvidia-elements/core/select';\nimport { Date } from '@nvidia-elements/core/date';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport globalStyles from './progressive-filter-chip.global.css?inline';\nimport styles from './progressive-filter-chip.css?inline';\n\n/**\n * @element nve-progressive-filter-chip\n * @description A filter chip is a control that enables users to select many options from a set of choices.\n * @since 0.16.0\n * @entrypoint \\@nvidia-elements/core/progressive-filter-chip\n * @slot - default slot for content\n * @event close - Dispatched when the filter chip closes.\n * @cssprop --gap\n * @cssprop --border-radius\n * @cssprop --border\n * @cssprop --background\n * @cssprop --font-weight\n * @cssprop --padding\n * @cssprop --width\n * @csspart select - The select element\n * @csspart date - The date input element\n * @csspart input - The input element\n * @csspart icon-button - The icon button element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/toolbar/\n */\n@typeSSR()\n@scopedRegistry()\nexport class ProgressiveFilterChip extends LitElement {\n  static readonly metadata = {\n    tag: 'nve-progressive-filter-chip',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Input.metadata.tag]: Input,\n    [Select.metadata.tag]: Select,\n    [Date.metadata.tag]: Date,\n    [IconButton.metadata.tag]: IconButton\n  };\n\n  /** Determines if a close button should render within filter chip */\n  @property({ type: Boolean }) closable: boolean;\n\n  #i18nController: I18nController<this> = new I18nController<this>(this);\n\n  /** Enables updating internal string values for internationalization. */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  @state() private inputs: Element[] = [];\n\n  static styles = useStyles([styles]);\n\n  #typeClosableController = new TypeClosableController(this);\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  #getControlTemplate(el: Element) {\n    const slot = html`<slot name=${el.slot} @slotchange=${this.#removeItem}></slot>`;\n    if (el.tagName === 'SELECT') {\n      return html`<nve-select part=\"select\" multiple-overflow ?fit-text=${!(el as HTMLSelectElement).multiple}>${slot}</nve-select>`;\n    } else if (el.tagName === 'INPUT' && (el as HTMLInputElement).type === 'date') {\n      return html`<nve-date part=\"date\">${slot}</nve-date>`;\n    } else if (el.tagName === 'INPUT') {\n      return html`<nve-input part=\"input\">${slot}</nve-input>`;\n    } else {\n      return slot;\n    }\n  }\n\n  render() {\n    return html`\n    <div internal-host>\n      ${this.inputs.map(el => this.#getControlTemplate(el))}\n      ${this.closable ? html`<nve-icon-button part=\"icon-button\" exportparts=\"icon:icon-button-icon\" @click=${() => this.#typeClosableController.close()} .ariaLabel=${this.i18n.close} icon-name=\"cancel\"></nve-icon-button>` : nothing}\n    </div>\n    <slot hidden-slot @slotchange=${this.#createItems}></slot>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'toolbar';\n    this.setAttribute('nve-control', '');\n    appendRootNodeStyle(this, globalStyles);\n  }\n\n  #removeItem(e: Event) {\n    if (!(e.target as HTMLSlotElement).assignedElements().length) {\n      this.#resetItems();\n    }\n  }\n\n  #createItems(e: Event) {\n    if (e.target && (e.target as HTMLSlotElement).assignedElements().length) {\n      this.#resetItems();\n      const items = Array.from(\n        this.shadowRoot!.querySelector<HTMLSlotElement>('slot:not([name])')!.assignedElements()\n      ).filter(i => i.matches('input, select, nve-button, [nve-control]'));\n      items.forEach(i => (i.slot = generateId()));\n      this.inputs = items.length ? items : this.inputs;\n    }\n  }\n\n  #resetItems() {\n    Array.from(this.shadowRoot!.querySelectorAll('slot'))\n      .flatMap(i => i.assignedElements())\n      .forEach(i => (i.slot = ''));\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AA6CO,IAAA,IAAA,cAAoC,EAAW;;2BAmBjB,MAAA,EAAqB,oBAEnB,EAAE;;;kBApBZ;GACzB,KAAK;GACL,SAAS;GACV;;;4BAE2B;IACzB,EAAM,SAAS,MAAM;IACrB,EAAO,SAAS,MAAM;IACtB,EAAK,SAAS,MAAM;IACpB,EAAW,SAAS,MAAM;GAC5B;;CAKD,KAAwC,IAAI,EAAqB,KAAK;;gBAOtD,EAAU,CAAC,EAAO,CAAC;;CAEnC,KAA0B,IAAI,EAAuB,KAAK;CAK1D,GAAoB,GAAa;EAC/B,IAAM,IAAO,CAAI,eAAc,EAAG,KAAK,iBAAe,MAAA,EAAiB;AAQrE,SAPE,EAAG,YAAY,WACV,CAAI,0DAAyD,CAAE,EAAyB,SAAS,IAAG,EAAK,iBACvG,EAAG,YAAY,WAAY,EAAwB,SAAS,SAC9D,CAAI,yBAAyB,EAAK,eAChC,EAAG,YAAY,UACjB,CAAI,2BAA2B,EAAK,gBAEpC;;CAIX,SAAS;AACP,SAAO,CAAI,sBAEP,KAAK,OAAO,KAAI,MAAM,MAAA,EAAyB,EAAG,CAAC,CAAC,GACpD,KAAK,WAAW,CAAI,yFAAwF,MAAA,EAA6B,OAAO,CAAC,gBAAc,KAAK,KAAK,MAAM,2CAA0C,EAAQ,uCAErM,MAAA,EAAkB;;CAIpD,oBAAoB;AAKlB,EAJA,MAAM,mBAAmB,EACzB,EAAgB,KAAK,EACrB,KAAK,WAAW,OAAO,WACvB,KAAK,aAAa,eAAe,GAAG,EACpC,EAAoB,MAAM,EAAa;;CAGzC,GAAY,GAAU;AACpB,EAAM,EAAE,OAA2B,kBAAkB,CAAC,UACpD,MAAA,GAAkB;;CAItB,GAAa,GAAU;AACrB,MAAI,EAAE,UAAW,EAAE,OAA2B,kBAAkB,CAAC,QAAQ;AACvE,SAAA,GAAkB;GAClB,IAAM,IAAQ,MAAM,KAClB,KAAK,WAAY,cAA+B,mBAAmB,CAAE,kBAAkB,CACxF,CAAC,QAAO,MAAK,EAAE,QAAQ,2CAA2C,CAAC;AAEpE,GADA,EAAM,SAAQ,MAAM,EAAE,OAAO,GAAY,CAAE,EAC3C,KAAK,SAAS,EAAM,SAAS,IAAQ,KAAK;;;CAI9C,KAAc;AACZ,QAAM,KAAK,KAAK,WAAY,iBAAiB,OAAO,CAAC,CAClD,SAAQ,MAAK,EAAE,kBAAkB,CAAC,CAClC,SAAQ,MAAM,EAAE,OAAO,GAAI;;;GAnE/B,EAAS,EAAE,MAAM,SAAS,CAAC,CAAA,EAAA,EAAA,WAAA,YAAA,KAAA,EAAA,KAK3B,EAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,EAAA,EAAA,WAAA,QAAA,KAAA,EAAA,KAE1B,GAAO,CAAA,EAAA,EAAA,WAAA,UAAA,KAAA,EAAA,SAvBT,GAAS,EACT,GAAgB,CAAA,EAAA,EAAA"}

package/dist/pulse/pulse2.js

@@ -13,7 +13,7 @@ var c = class extends a {
 	static {
 		this.metadata = {
 			tag: "nve-pulse",
-			version: "0.0.6"
+			version: "0.0.8"
 		};
 	}
 	static {

package/dist/radio/radio-group2.js

@@ -12,7 +12,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-radio-group",
-			version: "0.0.6",
+			version: "0.0.8",
 			children: [
 				"label",
 				"nve-control-message",

package/dist/radio/radio2.js

@@ -15,7 +15,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-radio",
-			version: "0.0.6",
+			version: "0.0.8",
 			children: [
 				"label",
 				"input",

package/dist/range/range.global.js.map

@@ -1 +1 @@
-{"version":3,"file":"range.global.js","names":[],"sources":["../../src/range/range.global.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\nnve-range input[type='range']::-webkit-slider-thumb,\nnve-range input[type='range']::-webkit-slider-thumb {\n  width: var(--thumb-width);\n  height: var(--thumb-height);\n  background: var(--thumb-background);\n  border-radius: 50%;\n  box-shadow: var(--thumb-border);\n  margin-block-start: calc((var(--track-height) - var(--thumb-height)) / 2);\n  appearance: var(--_appearance);\n  filter: var(--filter);\n}\n\nnve-range input[type='range']::-webkit-slider-runnable-track,\nnve-range input[type='range']::-webkit-slider-runnable-track {\n  background: transparent;\n  height: var(--track-height);\n  border-radius: var(--nve-ref-border-radius-lg);\n  align-self: center;\n}\n\nnve-range:has(datalist) input[type='range']::-webkit-slider-container {\n  min-block-size: auto;\n}\n\nnve-range[orientation='vertical'] input[type='range']::-webkit-slider-container,\nnve-range[orientation='vertical'] input[type='range']::-webkit-slider-container {\n  display: flex;\n  align-items: center;\n  overflow: visible;\n}\n\nnve-range[orientation='vertical'] input[type='range']::-webkit-slider-runnable-track,\nnve-range[orientation='vertical'] input[type='range']::-webkit-slider-runnable-track {\n  width: 100%;\n  height: 100%;\n}\n\nnve-range[orientation='vertical'] input[type='range']::-webkit-slider-thumb,\nnve-range[orientation='vertical'] input[type='range']::-webkit-slider-thumb {\n  margin: 0;\n}\n"],"mappings":""}
+{"version":3,"file":"range.global.js","names":[],"sources":["../../src/range/range.global.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\nnve-range input[type='range']::-webkit-slider-thumb {\n  width: var(--thumb-width);\n  height: var(--thumb-height);\n  background: var(--thumb-background);\n  border-radius: 50%;\n  box-shadow: var(--thumb-border);\n  margin-block-start: calc((var(--track-height) - var(--thumb-height)) / 2);\n  appearance: var(--_appearance);\n  filter: var(--filter);\n}\n\nnve-range input[type='range']::-webkit-slider-runnable-track {\n  background: transparent;\n  height: var(--track-height);\n  border-radius: var(--nve-ref-border-radius-lg);\n  align-self: center;\n}\n\nnve-range:has(datalist) input[type='range']::-webkit-slider-container {\n  min-block-size: auto;\n}\n\nnve-range[orientation='vertical'] input[type='range']::-webkit-slider-container {\n  display: flex;\n  align-items: center;\n  overflow: visible;\n}\n\nnve-range[orientation='vertical'] input[type='range']::-webkit-slider-runnable-track {\n  width: 100%;\n  height: 100%;\n}\n\nnve-range[orientation='vertical'] input[type='range']::-webkit-slider-thumb {\n  margin: 0;\n}\n"],"mappings":""}

package/dist/range/range2.js

@@ -17,7 +17,7 @@ var d = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-range",
-			version: "0.0.6"
+			version: "0.0.8"
 		};
 	}
 	connectedCallback() {

package/dist/resize-handle/resize-handle.d.ts

@@ -27,6 +27,8 @@ declare const ResizeHandle_base: {
         readonly _validators: import('@nvidia-elements/forms').Validator[];
         readonly _internals: ElementInternals;
         connectedCallback(): void;
+        disconnectedCallback(): void;
+        _stopInternalPropagation: (event: Event) => void;
         attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
         _handleAttributeChange(name: string, newValue: string): void;
         formResetCallback(): void;
@@ -395,7 +397,6 @@ declare const ResizeHandle_base: {
         tabIndex: number;
         blur(): void;
         focus(options?: FocusOptions): void;
-        disconnectedCallback?(): void;
         requestUpdate?(name?: string, oldValue?: unknown): void;
     };
     formAssociated: boolean;

package/dist/resize-handle/resize-handle2.js

@@ -18,7 +18,7 @@ var u = class extends l(a) {
 	static {
 		this.metadata = {
 			tag: "nve-resize-handle",
-			version: "0.0.6",
+			version: "0.0.8",
 			valueSchema: { type: "number" }
 		};
 	}

package/dist/search/search2.js

@@ -22,7 +22,7 @@ var l = class extends r {
 	static {
 		this.metadata = {
 			tag: "nve-search",
-			version: "0.0.6"
+			version: "0.0.8"
 		};
 	}
 	static {

package/dist/select/select2.js

@@ -26,7 +26,7 @@ var b = class extends u {
 	static {
 		this.metadata = {
 			tag: "nve-select",
-			version: "0.0.6"
+			version: "0.0.8"
 		};
 	}
 	static {

package/dist/skeleton/skeleton2.js

@@ -15,7 +15,7 @@ var s = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-skeleton",
-			version: "0.0.6"
+			version: "0.0.8"
 		};
 	}
 	render() {

package/dist/sort-button/sort-button.d.ts

@@ -36,4 +36,5 @@ export declare class SortButton extends BaseButton {
     render(): import('lit-html').TemplateResult<1>;
     constructor();
     connectedCallback(): void;
+    disconnectedCallback(): void;
 }