@nvidia-elements/core 0.0.9 → 0.0.11

package/dist/internal/controllers/type-touch.controller.examples.json

@@ -2,7 +2,7 @@
   "entrypoint": "@nvidia-elements/core/internal/controllers/type-touch.controller.examples.json",
   "items": [
     {
-      "id": "core-internal-controllers-type-touch.controller_touch-demo",
+      "id": "internal-controllers-type-touch.controller-touch-demo",
       "name": "TouchDemo",
       "template": "<type-touch-controller-demo-element></type-touch-controller-demo-element>\n<script type=\"module\">\n  const element = document.querySelector(\"type-touch-controller-demo-element\");\n  const container = document.querySelector(\"#touch-demo-container\");\n  element.addEventListener(\"nve-touch-start\", (e) => console.log(e.type));\n  element.addEventListener(\"nve-touch-move\", (position) => {\n    console.log(position.type);\n    element.style.left = position.x + \"px\";\n    element.style.top = position.y + \"px\";\n  });\n  element.addEventListener(\"nve-touch-end\", (e) => console.log(e.type));\n</script>\n",
       "summary": "Touch controller with drag-to-move behavior dispatching start, move, and end events.",

package/dist/internal/services/global.service.js

@@ -19,7 +19,7 @@ var a = class {
 				i18nRegistry: {},
 				audit: {}
 			}
-		}, globalThis.NVE_ELEMENTS.state.versions = Array.from(new Set([...globalThis.NVE_ELEMENTS.state.versions, "0.0.9"])), globalThis.NVE_ELEMENTS.state.scopedRegistry ??= {}, globalThis.NVE_ELEMENTS.state.scopedRegistry["0.0.9"] = i(), globalThis.NVE_ELEMENTS.state.versions.length > 1 && globalThis.NVE_ELEMENTS.state.env !== "production" && console.warn(e(), `\n\n${JSON.stringify(globalThis.NVE_ELEMENTS.state.versions, null, 2)}`);
+		}, globalThis.NVE_ELEMENTS.state.versions = Array.from(new Set([...globalThis.NVE_ELEMENTS.state.versions, "0.0.11"])), globalThis.NVE_ELEMENTS.state.scopedRegistry ??= {}, globalThis.NVE_ELEMENTS.state.scopedRegistry["0.0.11"] = i(), globalThis.NVE_ELEMENTS.state.versions.length > 1 && globalThis.NVE_ELEMENTS.state.env !== "production" && console.warn(e(), `\n\n${JSON.stringify(globalThis.NVE_ELEMENTS.state.versions, null, 2)}`);
 	}
 	get state() {
 		return globalThis.NVE_ELEMENTS.state;

package/dist/logo/logo.examples.json

@@ -3,7 +3,7 @@
   "entrypoint": "@nvidia-elements/core/logo/logo.examples.json",
   "items": [
     {
-      "id": "core-logo_default",
+      "id": "logo",
       "name": "Default",
       "template": "<nve-logo aria-label=\"NVIDIA\"></nve-logo>\n",
       "summary": "Default NVIDIA logo with aria-label for accessibility. Use for brand identification in headers, footers, and loading states.",
@@ -12,7 +12,7 @@
       "tags": []
     },
     {
-      "id": "core-logo_size",
+      "id": "logo-size",
       "name": "Size",
       "template": "<div nve-layout=\"row gap:xs\">\n  <nve-logo size=\"sm\" color=\"green-mint\" aria-label=\"green mint\">Gm</nve-logo>\n  <nve-logo color=\"green-mint\" aria-label=\"green mint\">Gm</nve-logo>\n  <nve-logo size=\"lg\" color=\"green-mint\" aria-label=\"green mint\">Gm</nve-logo>\n</div>\n",
       "summary": "Logo size variants (sm, md, lg) for different contexts. Use smaller sizes for dense layouts like toolbars, larger sizes for prominent brand placement.",
@@ -23,7 +23,7 @@
       ]
     },
     {
-      "id": "core-logo_slotted-icons",
+      "id": "logo-slotted-icons",
       "name": "SlottedIcons",
       "template": "<div nve-layout=\"row gap:xs\">\n  <nve-logo color=\"pink-rose\" aria-label=\"pink rose large\" size=\"lg\">\n    <nve-icon name=\"star\"></nve-icon>\n  </nve-logo>\n  <nve-logo color=\"pink-rose\" aria-label=\"pink rose medium\" size=\"md\">\n    <nve-icon name=\"star\"></nve-icon>\n  </nve-logo>\n  <nve-logo color=\"pink-rose\" aria-label=\"pink rose small\" size=\"sm\">\n    <nve-icon name=\"star\"></nve-icon>\n  </nve-logo>\n  <nve-logo color=\"red-cardinal\" aria-label=\"red cardinal\">\n    <nve-icon name=\"star\"></nve-icon>\n  </nve-logo>\n  <nve-logo color=\"green-grass\" aria-label=\"green grass\">\n    <nve-icon name=\"star\"></nve-icon>\n  </nve-logo>\n  <nve-logo color=\"blue-cobalt\" aria-label=\"blue cobalt\">\n    <nve-icon name=\"star\"></nve-icon>\n  </nve-logo>\n</div>\n",
       "summary": "Custom icons slotted into the logo container. Ideal for product icons, team badges, or custom brand marks within the standard logo shape.",
@@ -34,7 +34,7 @@
       ]
     },
     {
-      "id": "core-logo_color",
+      "id": "logo-color",
       "name": "Color",
       "template": "<div nve-layout=\"row gap:xs align:wrap\">\n  <nve-logo aria-label=\"NVIDIA\"></nve-logo>\n  <nve-logo color=\"red-cardinal\" aria-label=\"red cardinal\">Rc</nve-logo>\n  <nve-logo color=\"gray-slate\" aria-label=\"gray slate\">Gs</nve-logo>\n  <nve-logo color=\"gray-denim\" aria-label=\"gray denim\">Gd</nve-logo>\n  <nve-logo color=\"blue-indigo\" aria-label=\"blue indigo\">Bi</nve-logo>\n  <nve-logo color=\"blue-cobalt\" aria-label=\"blue cobalt\">Bc</nve-logo>\n  <nve-logo color=\"blue-sky\" aria-label=\"blue sky\">Bs</nve-logo>\n  <nve-logo color=\"teal-cyan\" aria-label=\"teal cyan\">Tc</nve-logo>\n  <nve-logo color=\"green-mint\" aria-label=\"green mint\">Gm</nve-logo>\n  <nve-logo color=\"teal-seafoam\" aria-label=\"teal seafoam\">Ts</nve-logo>\n  <nve-logo color=\"green-grass\" aria-label=\"green grass\">Gg</nve-logo>\n  <nve-logo color=\"yellow-amber\" aria-label=\"yellow amber\">Ya</nve-logo>\n  <nve-logo color=\"orange-pumpkin\" aria-label=\"orange pumpkin\">Op</nve-logo>\n  <nve-logo color=\"red-tomato\" aria-label=\"red tomato\">Rt</nve-logo>\n  <nve-logo color=\"pink-magenta\" aria-label=\"pink magenta\">Pm</nve-logo>\n  <nve-logo color=\"purple-plum\" aria-label=\"purple plum\">Pp</nve-logo>\n  <nve-logo color=\"purple-violet\" aria-label=\"purple violet\">Pv</nve-logo>\n  <nve-logo color=\"purple-lavender\" aria-label=\"purple lavender\">Pl</nve-logo>\n  <nve-logo color=\"pink-rose\" aria-label=\"pink rose\">Pr</nve-logo>\n  <nve-logo color=\"green-jade\" aria-label=\"green jade\">Gj</nve-logo>\n  <nve-logo color=\"lime-pear\" aria-label=\"lime pear\">Lp</nve-logo>\n  <nve-logo color=\"yellow-nova\" aria-label=\"yellow nova\">Yn</nve-logo>\n  <nve-logo color=\"brand-green\" aria-label=\"brand green\">Bg</nve-logo>\n</div>\n",
       "summary": "All available logo color options. Use colors to differentiate products, teams, or categories within NVIDIA applications.",
@@ -43,7 +43,7 @@
       "tags": []
     },
     {
-      "id": "core-logo_light-theme",
+      "id": "logo-light-theme",
       "name": "LightTheme",
       "template": "<div\n  nve-theme=\"root light\"\n  nve-layout=\"row gap:xs align:wrap pad:sm\"\n  style=\"background: var(--nve-sys-layer-container-background) !important\"\n>\n  <nve-logo aria-label=\"NVIDIA\"></nve-logo>\n  <nve-logo color=\"red-cardinal\" aria-label=\"red cardinal\">Rc</nve-logo>\n  <nve-logo color=\"gray-slate\" aria-label=\"gray slate\">Gs</nve-logo>\n  <nve-logo color=\"gray-denim\" aria-label=\"gray denim\">Gd</nve-logo>\n  <nve-logo color=\"blue-indigo\" aria-label=\"blue indigo\">Bi</nve-logo>\n  <nve-logo color=\"blue-cobalt\" aria-label=\"blue cobalt\">Bc</nve-logo>\n  <nve-logo color=\"blue-sky\" aria-label=\"blue sky\">Bs</nve-logo>\n  <nve-logo color=\"teal-cyan\" aria-label=\"teal cyan\">Tc</nve-logo>\n  <nve-logo color=\"green-mint\" aria-label=\"green mint\">Gm</nve-logo>\n  <nve-logo color=\"teal-seafoam\" aria-label=\"teal seafoam\">Ts</nve-logo>\n  <nve-logo color=\"green-grass\" aria-label=\"green grass\">Gg</nve-logo>\n  <nve-logo color=\"yellow-amber\" aria-label=\"yellow amber\">Ya</nve-logo>\n  <nve-logo color=\"orange-pumpkin\" aria-label=\"orange pumpkin\">Op</nve-logo>\n  <nve-logo color=\"red-tomato\" aria-label=\"red tomato\">Rt</nve-logo>\n  <nve-logo color=\"pink-magenta\" aria-label=\"pink magenta\">Pm</nve-logo>\n  <nve-logo color=\"purple-plum\" aria-label=\"purple plum\">Pp</nve-logo>\n  <nve-logo color=\"purple-violet\" aria-label=\"purple violet\">Pv</nve-logo>\n  <nve-logo color=\"purple-lavender\" aria-label=\"purple lavender\">Pl</nve-logo>\n  <nve-logo color=\"pink-rose\" aria-label=\"pink rose\">Pr</nve-logo>\n  <nve-logo color=\"green-jade\" aria-label=\"green jade\">Gj</nve-logo>\n  <nve-logo color=\"lime-pear\" aria-label=\"lime pear\">Lp</nve-logo>\n  <nve-logo color=\"yellow-nova\" aria-label=\"yellow nova\">Yn</nve-logo>\n  <nve-logo color=\"brand-green\" aria-label=\"brand green\">Bg</nve-logo>\n</div>\n",
       "summary": "Logo colors optimized for light theme backgrounds. Ensures proper contrast and visibility when used in light mode interfaces.",
@@ -54,7 +54,7 @@
       ]
     },
     {
-      "id": "core-logo_dark-theme",
+      "id": "logo-dark-theme",
       "name": "DarkTheme",
       "template": "<div nve-theme=\"root dark\" nve-layout=\"row gap:xs align:wrap pad:sm\">\n  <nve-logo aria-label=\"NVIDIA\"></nve-logo>\n  <nve-logo color=\"red-cardinal\" aria-label=\"red cardinal\">Rc</nve-logo>\n  <nve-logo color=\"gray-slate\" aria-label=\"gray slate\">Gs</nve-logo>\n  <nve-logo color=\"gray-denim\" aria-label=\"gray denim\">Gd</nve-logo>\n  <nve-logo color=\"blue-indigo\" aria-label=\"blue indigo\">Bi</nve-logo>\n  <nve-logo color=\"blue-cobalt\" aria-label=\"blue cobalt\">Bc</nve-logo>\n  <nve-logo color=\"blue-sky\" aria-label=\"blue sky\">Bs</nve-logo>\n  <nve-logo color=\"teal-cyan\" aria-label=\"teal cyan\">Tc</nve-logo>\n  <nve-logo color=\"green-mint\" aria-label=\"green mint\">Gm</nve-logo>\n  <nve-logo color=\"teal-seafoam\" aria-label=\"teal seafoam\">Ts</nve-logo>\n  <nve-logo color=\"green-grass\" aria-label=\"green grass\">Gg</nve-logo>\n  <nve-logo color=\"yellow-amber\" aria-label=\"yellow amber\">Ya</nve-logo>\n  <nve-logo color=\"orange-pumpkin\" aria-label=\"orange pumpkin\">Op</nve-logo>\n  <nve-logo color=\"red-tomato\" aria-label=\"red tomato\">Rt</nve-logo>\n  <nve-logo color=\"pink-magenta\" aria-label=\"pink magenta\">Pm</nve-logo>\n  <nve-logo color=\"purple-plum\" aria-label=\"purple plum\">Pp</nve-logo>\n  <nve-logo color=\"purple-violet\" aria-label=\"purple violet\">Pv</nve-logo>\n  <nve-logo color=\"purple-lavender\" aria-label=\"purple lavender\">Pl</nve-logo>\n  <nve-logo color=\"pink-rose\" aria-label=\"pink rose\">Pr</nve-logo>\n  <nve-logo color=\"green-jade\" aria-label=\"green jade\">Gj</nve-logo>\n  <nve-logo color=\"lime-pear\" aria-label=\"lime pear\">Lp</nve-logo>\n  <nve-logo color=\"yellow-nova\" aria-label=\"yellow nova\">Yn</nve-logo>\n  <nve-logo color=\"brand-green\" aria-label=\"brand green\">Bg</nve-logo>\n</div>\n",
       "summary": "Logo colors optimized for dark theme backgrounds. Ensures proper contrast and visibility when used in dark mode interfaces.",

package/dist/logo/logo2.js

@@ -12,7 +12,7 @@ var c = class extends a {
 	static {
 		this.metadata = {
 			tag: "nve-logo",
-			version: "0.0.9"
+			version: "0.0.11"
 		};
 	}
 	render() {

package/dist/menu/menu-item2.js

@@ -13,7 +13,7 @@ var s = class extends t {
 	static {
 		this.metadata = {
 			tag: "nve-menu-item",
-			version: "0.0.9",
+			version: "0.0.11",
 			parents: ["nve-menu"]
 		};
 	}

package/dist/menu/menu.examples.json

@@ -3,7 +3,7 @@
   "entrypoint": "@nvidia-elements/core/menu/menu.examples.json",
   "items": [
     {
-      "id": "core-menu_default",
+      "id": "menu",
       "name": "Default",
       "template": "<nve-menu>\n  <nve-menu-item>item 1</nve-menu-item>\n  <nve-menu-item>item 2</nve-menu-item>\n  <nve-menu-item>item 3</nve-menu-item>\n  <nve-menu-item>item 4</nve-menu-item>\n</nve-menu>\n",
       "summary": "Basic menu with simple text items for the default menu structure and styling.",
@@ -12,7 +12,7 @@
       "tags": []
     },
     {
-      "id": "core-menu_dropdown",
+      "id": "menu-dropdown",
       "name": "Dropdown",
       "template": "<nve-button popovertarget=\"dropdown-menu\">dropdown</nve-button>\n<nve-dropdown id=\"dropdown-menu\">\n  <nve-menu>\n    <nve-menu-item><nve-icon name=\"person\"></nve-icon> profile</nve-menu-item>\n    <nve-menu-item><nve-icon name=\"gear\"></nve-icon> settings</nve-menu-item>\n    <nve-menu-item><nve-icon name=\"star\"></nve-icon> favorites</nve-menu-item>\n    <nve-divider></nve-divider>\n    <nve-menu-item><nve-icon name=\"logout\"></nve-icon> logout</nve-menu-item>\n  </nve-menu>\n</nve-dropdown>\n",
       "summary": "Menu with keyboard navigation and ARIA disclosure pattern inside a dropdown. Use when menu items need accessible focus management and arrow key navigation.",
@@ -23,7 +23,7 @@
       ]
     },
     {
-      "id": "core-menu_selected",
+      "id": "menu-selected",
       "name": "Selected",
       "template": "<nve-menu>\n  <nve-menu-item>item 1</nve-menu-item>\n  <nve-menu-item selected>item 2</nve-menu-item>\n  <nve-menu-item>item 3</nve-menu-item>\n  <nve-menu-item>item 4</nve-menu-item>\n</nve-menu>\n",
       "summary": "Menu with a selected item showing the visual state for user-selected options.",
@@ -32,7 +32,7 @@
       "tags": []
     },
     {
-      "id": "core-menu_current",
+      "id": "menu-current",
       "name": "Current",
       "template": "<nve-menu>\n  <nve-menu-item>item 1</nve-menu-item>\n  <nve-menu-item current=\"page\">item 2</nve-menu-item>\n  <nve-menu-item>item 3</nve-menu-item>\n  <nve-menu-item>item 4</nve-menu-item>\n</nve-menu>\n",
       "summary": "Menu with a current page item showing the visual state for the active/current page in navigation.",
@@ -41,7 +41,7 @@
       "tags": []
     },
     {
-      "id": "core-menu_border-background",
+      "id": "menu-border-background",
       "name": "BorderBackground",
       "template": "<nve-menu>\n  <nve-menu-item>item 1</nve-menu-item>\n  <nve-menu-item current=\"page\" style=\"--border-background: var(--nve-ref-color-brand-green-900)\">item 2</nve-menu-item>\n  <nve-menu-item>item 3</nve-menu-item>\n  <nve-menu-item>item 4</nve-menu-item>\n</nve-menu>\n",
       "summary": "By default Menu will show a blue border on the selected item. You can change the border color by setting `--border-background` on the `<nve-menu-item>`",
@@ -52,7 +52,7 @@
       ]
     },
     {
-      "id": "core-menu_disabled",
+      "id": "menu-disabled",
       "name": "Disabled",
       "template": "<nve-menu>\n  <nve-menu-item>item 1</nve-menu-item>\n  <nve-menu-item disabled>item 2</nve-menu-item>\n  <nve-menu-item>item 3</nve-menu-item>\n  <nve-menu-item>item 4</nve-menu-item>\n</nve-menu>\n",
       "summary": "Menu with disabled items showing unavailable options while maintaining visual context.",
@@ -63,7 +63,7 @@
       ]
     },
     {
-      "id": "core-menu_icons",
+      "id": "menu-icons",
       "name": "Icons",
       "template": "<nve-menu>\n  <nve-menu-item><nve-icon name=\"person\"></nve-icon> profile</nve-menu-item>\n  <nve-menu-item><nve-icon name=\"gear\"></nve-icon> settings</nve-menu-item>\n  <nve-menu-item><nve-icon name=\"star\"></nve-icon> favorites</nve-menu-item>\n  <nve-menu-item><nve-icon name=\"logout\"></nve-icon> logout</nve-menu-item>\n</nve-menu>\n",
       "summary": "Menu items with icons to add visual context and improve usability.",
@@ -72,7 +72,7 @@
       "tags": []
     },
     {
-      "id": "core-menu_links",
+      "id": "menu-links",
       "name": "Links",
       "template": "<nve-menu>\n  <nve-menu-item><nve-icon name=\"person\"></nve-icon><a href=\"#\">profile</a></nve-menu-item>\n  <nve-menu-item><nve-icon name=\"gear\"></nve-icon> <a href=\"#\">settings</a></nve-menu-item>\n  <nve-menu-item><nve-icon name=\"star\"></nve-icon> <a href=\"#\">favorites</a></nve-menu-item>\n  <nve-menu-item><nve-icon name=\"logout\"></nve-icon> <a href=\"#\">logout</a></nve-menu-item>\n</nve-menu>\n",
       "summary": "Menu items with links for navigation functionality within menu structures.",
@@ -81,7 +81,7 @@
       "tags": []
     },
     {
-      "id": "core-menu_suffix",
+      "id": "menu-suffix",
       "name": "Suffix",
       "template": "<nve-menu>\n  <nve-menu-item><kbd slot=\"suffix\" nve-text=\"code flat\">CMD + C</kbd></nve-menu-item>\n</nve-menu>\n",
       "summary": "Menu item features a default slot for content, along with a suffix slot for displaying elements such as keyboard shortcuts at the end of the menu item container.",
@@ -90,7 +90,7 @@
       "tags": []
     },
     {
-      "id": "core-menu_scroll",
+      "id": "menu-scroll",
       "name": "Scroll",
       "template": "<nve-menu style=\"--max-height: 150px\">\n  <nve-menu-item>item 1</nve-menu-item>\n  <nve-menu-item>item 2</nve-menu-item>\n  <nve-menu-item>item 3</nve-menu-item>\n  <nve-menu-item>item 4</nve-menu-item>\n  <nve-menu-item>item 5</nve-menu-item>\n  <nve-menu-item>item 6</nve-menu-item>\n</nve-menu>\n",
       "summary": "Menu with constrained height showing scrollable behavior when content exceeds container limits.",
@@ -101,7 +101,7 @@
       ]
     },
     {
-      "id": "core-menu_complex",
+      "id": "menu-complex",
       "name": "Complex",
       "template": "<nve-button popovertarget=\"dropdown-menu\">dropdown</nve-button>\n<nve-dropdown id=\"dropdown-menu\">\n  <nve-search rounded>\n    <input type=\"search\" placeholder=\"search tools\" aria-label=\"search apps\" />\n  </nve-search>\n  <nve-menu>\n    <nve-menu-item> <nve-logo color=\"pink-rose\" size=\"sm\">Db</nve-logo> Debugger </nve-menu-item>\n    <nve-menu-item> <nve-logo color=\"blue-cobalt\" size=\"sm\">TM</nve-logo> Task Manager </nve-menu-item>\n    <nve-menu-item> <nve-logo color=\"yellow-nova\" size=\"sm\">CI</nve-logo> CI Services </nve-menu-item>\n    <nve-divider></nve-divider>\n    <nve-menu-item> <nve-logo size=\"sm\"></nve-logo> All Apps </nve-menu-item>\n  </nve-menu>\n</nve-dropdown>\n",
       "summary": "Use a dropdown menu with search and branded logos for application selection interfaces.",
@@ -112,7 +112,7 @@
       ]
     },
     {
-      "id": "core-menu_vertical-navigation-drawer",
+      "id": "menu-vertical-navigation-drawer",
       "name": "VerticalNavigationDrawer",
       "template": "<nve-page>\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-page-header>\n  <main nve-layout=\"column gap:md pad:md\">\n    <nve-button popovertarget=\"menu-drawer\">toggle drawer</nve-button>\n  </main>\n  <nve-drawer position=\"right\" size=\"sm\" modal closable id=\"menu-drawer\">\n    <nve-drawer-header>\n      <h3 nve-text=\"heading\">Drawer</h3>\n    </nve-drawer-header>\n    <nve-drawer-content>\n      <nve-menu>\n        <nve-menu-item>item 1</nve-menu-item>\n        <nve-menu-item current=\"page\">item 2</nve-menu-item>\n        <nve-menu-item>item 3</nve-menu-item>\n        <nve-menu-item>item 4</nve-menu-item>\n      </nve-menu>\n    </nve-drawer-content>\n  </nve-drawer>\n</nve-page>\n",
       "summary": "Use a navigation drawer to overlay page content for out-of-context navigation.",
@@ -123,7 +123,7 @@
       ]
     },
     {
-      "id": "core-menu_vertical-navigation-panel",
+      "id": "menu-vertical-navigation-panel",
       "name": "VerticalNavigationPanel",
       "template": "<nve-page>\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-page-header>\n  <nve-page-panel slot=\"left\" expanded style=\"max-width: 280px\">\n    <nve-page-panel-header>\n      <h3 nve-text=\"heading\">Drawer</h3>\n    </nve-page-panel-header>\n    <nve-page-panel-content>\n      <nve-menu>\n        <nve-menu-item>item 1</nve-menu-item>\n        <nve-menu-item current=\"page\">item 2</nve-menu-item>\n        <nve-menu-item>item 3</nve-menu-item>\n        <nve-menu-item>item 4</nve-menu-item>\n      </nve-menu>\n    </nve-page-panel-content>\n  </nve-page-panel>\n  <main nve-layout=\"column gap:md pad:md\">\n    <p nve-text=\"body\">Content</p>\n  </main>\n</nve-page>\n",
       "summary": "Use an inline navigation panel to push page content aside when navigation is contextual to the page.",
@@ -134,7 +134,7 @@
       ]
     },
     {
-      "id": "core-menu_item-tooltip",
+      "id": "menu-item-tooltip",
       "name": "ItemTooltip",
       "template": "<nve-menu>\n  <nve-menu-item>item 1</nve-menu-item>\n  <nve-menu-item popovertarget=\"menu-tooltip\" id=\"menu-item-2\">\n    item 2\n    <nve-icon id=\"menu-anchor\" size=\"md\" name=\"exclamation-triangle\" style=\"margin-left: auto\"></nve-icon>\n    <nve-tooltip anchor=\"menu-anchor\" open-delay=\"2000\" id=\"menu-tooltip\">This is a warning tooltip</nve-tooltip>\n  </nve-menu-item>\n  <nve-menu-item>item 3</nve-menu-item>\n</nve-menu>\n",
       "summary": "Use a tooltip on a menu item to provide extra context and warnings.",
@@ -146,7 +146,7 @@
       ]
     },
     {
-      "id": "core-menu_danger-status",
+      "id": "menu-danger-status",
       "name": "DangerStatus",
       "template": "<nve-menu>\n  <nve-menu-item status=\"danger\">default</nve-menu-item>\n  <nve-menu-item status=\"danger\" disabled>disabled</nve-menu-item>\n  <nve-menu-item status=\"danger\" selected>selected</nve-menu-item>\n  <nve-menu-item status=\"danger\" current=\"page\">current</nve-menu-item>\n  <nve-menu-item status=\"danger\"><nve-icon name=\"gear\"></nve-icon> icon left</nve-menu-item>\n  <nve-menu-item status=\"danger\"\n    >icon right <nve-icon id=\"warning-icon\" size=\"md\" name=\"exclamation-triangle\" style=\"margin-left: auto\"></nve-icon\n  ></nve-menu-item>\n</nve-menu>\n",
       "summary": "Menu items with danger status styling for destructive actions like delete or logout operations.",

package/dist/menu/menu2.js

@@ -16,7 +16,7 @@ var d = class extends c {
 	static {
 		this.metadata = {
 			tag: "nve-menu",
-			version: "0.0.9",
+			version: "0.0.11",
 			children: ["nve-menu-item", "nve-divider"]
 		};
 	}

package/dist/month/month.examples.json

@@ -3,7 +3,7 @@
   "entrypoint": "@nvidia-elements/core/month/month.examples.json",
   "items": [
     {
-      "id": "core-month_default",
+      "id": "month",
       "name": "Default",
       "template": "<nve-month>\n  <label>label</label>\n  <input type=\"month\" />\n  <nve-control-message>message</nve-control-message>\n</nve-month>\n",
       "summary": "Basic month picker with label and validation message. Use for selecting a month and year in forms, such as expiry dates or report periods.",
@@ -12,7 +12,7 @@
       "tags": []
     },
     {
-      "id": "core-month_datalist",
+      "id": "month-datalist",
       "name": "Datalist",
       "template": "<nve-month>\n  <label>label</label>\n  <input type=\"month\" />\n  <nve-control-message>message</nve-control-message>\n  <datalist>\n    <option value=\"2018-04\"></option>\n    <option value=\"2018-05\"></option>\n    <option value=\"2018-06\"></option>\n  </datalist>\n</nve-month>\n",
       "summary": "Month picker with predefined suggestions via datalist. Ideal for guiding users toward common or expected month selections.",
@@ -21,7 +21,7 @@
       "tags": []
     },
     {
-      "id": "core-month_vertical",
+      "id": "month-vertical",
       "name": "Vertical",
       "template": "<div nve-layout=\"column gap:lg full\">\n  <nve-month>\n    <label>label</label>\n    <input type=\"month\" />\n    <nve-control-message>message</nve-control-message>\n  </nve-month>\n  <nve-month>\n    <label>disabled</label>\n    <input type=\"month\" disabled />\n    <nve-control-message>message</nve-control-message>\n  </nve-month>\n  <nve-month>\n    <label>success</label>\n    <input type=\"month\" />\n    <nve-control-message status=\"success\">message</nve-control-message>\n  </nve-month>\n  <nve-month>\n    <label>error</label>\n    <input type=\"month\" />\n    <nve-control-message status=\"error\">message</nve-control-message>\n  </nve-month>\n</div>\n",
       "summary": "Vertical layout month inputs showing all validation states including disabled, success, and error. Use for stacked form layouts where labels appear above inputs.",
@@ -32,7 +32,7 @@
       ]
     },
     {
-      "id": "core-month_horizontal",
+      "id": "month-horizontal",
       "name": "Horizontal",
       "template": "<div nve-layout=\"column gap:lg full\">\n  <nve-month layout=\"horizontal\">\n    <label>label</label>\n    <input type=\"month\" />\n    <nve-control-message>message</nve-control-message>\n  </nve-month>\n  <nve-month layout=\"horizontal\">\n    <label>disabled</label>\n    <input type=\"month\" disabled />\n    <nve-control-message>message</nve-control-message>\n  </nve-month>\n  <nve-month layout=\"horizontal\">\n    <label>success</label>\n    <input type=\"month\" />\n    <nve-control-message status=\"success\">message</nve-control-message>\n  </nve-month>\n  <nve-month layout=\"horizontal\">\n    <label>error</label>\n    <input type=\"month\" />\n    <nve-control-message status=\"error\">message</nve-control-message>\n  </nve-month>\n</div>\n",
       "summary": "Horizontal layout month inputs with side-by-side labels. Ideal for compact forms or when aligning labels with other horizontal form controls.",

package/dist/month/month2.js

@@ -19,7 +19,7 @@ var l = class extends r {
 	static {
 		this.metadata = {
 			tag: "nve-month",
-			version: "0.0.9"
+			version: "0.0.11"
 		};
 	}
 	static {

package/dist/notification/notification-group2.js

@@ -20,7 +20,7 @@ var l = class extends o {
 	static {
 		this.metadata = {
 			tag: "nve-notification-group",
-			version: "0.0.9",
+			version: "0.0.11",
 			children: ["nve-notification"]
 		};
 	}

package/dist/notification/notification.examples.json

@@ -3,7 +3,7 @@
   "entrypoint": "@nvidia-elements/core/notification/notification.examples.json",
   "items": [
     {
-      "id": "core-notification_default",
+      "id": "notification",
       "name": "Default",
       "template": "<nve-notification id=\"notification\" position=\"top\" close-timeout=\"2000\">\n  <h3 nve-text=\"label\">Notification</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-button popovertarget=\"notification\">button</nve-button>\n",
       "summary": "Basic notification with auto-dismiss timeout for temporary feedback messages. Use notifications for system-generated alerts, confirmations, or status updates that don't require immediate user action, automatically dismissing after a set duration.",
@@ -12,7 +12,7 @@
       "tags": []
     },
     {
-      "id": "core-notification_actions",
+      "id": "notification-actions",
       "name": "Actions",
       "template": "<nve-notification position=\"center\">\n  <h3 nve-text=\"label\">Notification</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n  <div nve-layout=\"row gap:sm align:right\">\n    <nve-button container=\"inline\">Dismiss</nve-button>\n    <nve-button container=\"inline\">Accept</nve-button>\n  </div>\n</nve-notification>\n",
       "summary": "Notification with actions for immediate user response. Use notifications with actions when the notification requires user decision-making (like \"Retry\", \"View Details\", or \"Undo\"), making the next step clear and reducing friction in error recovery or task completion flows.",
@@ -21,7 +21,7 @@
       "tags": []
     },
     {
-      "id": "core-notification_custom-status",
+      "id": "notification-custom-status",
       "name": "CustomStatus",
       "template": "<nve-notification style=\"--status-color: var(--nve-ref-color-purple-plum-800)\" position=\"center\">\n  <h3 nve-text=\"label\">Notification</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n  <nve-icon slot=\"icon\" name=\"sparkles\" aria-label=\"Info\"></nve-icon>\n  <div nve-layout=\"row align:right\">\n    <nve-button container=\"inline\">Action</nve-button>\n  </div>\n</nve-notification>\n",
       "summary": "Custom status color for notification. Use custom status color and icon slot to convey a different meaning than the default status color. Use sparingly as it can add unnecessary cognitive load to the user.",
@@ -32,7 +32,7 @@
       ]
     },
     {
-      "id": "core-notification_visual",
+      "id": "notification-visual",
       "name": "Visual",
       "template": "<nve-notification position=\"center\">\n  <h3 nve-text=\"label\">Notification</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n",
       "summary": "Standard notification layout with title and body content in centered positioning for consistent notification structure.",
@@ -43,7 +43,7 @@
       ]
     },
     {
-      "id": "core-notification_content-wrap",
+      "id": "notification-content-wrap",
       "name": "ContentWrap",
       "template": "<nve-notification position=\"center\">\n  <h3 nve-text=\"label\">Notification</h3>\n  <p nve-text=\"body\" style=\"width: 230px\">\n    some text content in a notification with some really long text in it that just keeps going...\n  </p>\n</nve-notification>\n",
       "summary": "Notification with text wrapping for longer content. Use when notification messages exceed single-line length, but keep content concise for better readability and user comprehension.",
@@ -54,7 +54,7 @@
       ]
     },
     {
-      "id": "core-notification_events",
+      "id": "notification-events",
       "name": "Events",
       "template": "<nve-notification id=\"notification\" position=\"top\" close-timeout=\"2000\" closable>\n  <h3 nve-text=\"label\">Notification</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-button popovertarget=\"notification\">button</nve-button>\n<script type=\"module\">\n  const notification = document.querySelector(\"nve-notification\");\n  notification.addEventListener(\"beforetoggle\", () => console.log(\"beforetoggle\"));\n  notification.addEventListener(\"toggle\", () => console.log(\"toggle\"));\n  notification.addEventListener(\"close\", () => console.log(\"close\"));\n  notification.addEventListener(\"open\", () => console.log(\"open\"));\n</script>\n",
       "summary": "Event handling for notification lifecycle events. Useful for adding custom behavior when notification state changes.",
@@ -65,7 +65,7 @@
       ]
     },
     {
-      "id": "core-notification_interactive-group",
+      "id": "notification-interactive-group",
       "name": "InteractiveGroup",
       "template": "<nve-notification-group position=\"bottom\" alignment=\"end\" id=\"group\"></nve-notification-group>\n<nve-button>generate</nve-button>\n<script type=\"module\">\n  const button = document.querySelector(\"nve-button\");\n  button.addEventListener(\"click\", () => {\n    const notification = document.createElement(\"nve-notification\");\n    notification.closable = true;\n    notification.status = [\"warning\", \"danger\", \"success\", \"accent\", undefined][Math.floor(Math.random() * 5)];\n    notification.innerHTML =\n      '<h3 nve-text=\"label\">' +\n      (notification.status ?? \"default\") +\n      '</h3><p nve-text=\"body\">some text content in a notification</p>';\n    notification.closeTimeout = 1000 * (document.querySelectorAll(\"nve-notification\").length + 1);\n    notification.addEventListener(\"close\", () => notification.remove(), { once: true });\n    notification.position = \"bottom\";\n    notification.alignment = \"end\";\n    document.querySelector(\"nve-notification-group\").prepend(notification);\n  });\n</script>\n",
       "summary": "Dynamic notification group with programmatic creation and stacking. Perfect for toast-style notifications generated by user actions or system events, with progressive timeout and automatic removal patterns for managing many notifications.",
@@ -74,7 +74,7 @@
       "tags": []
     },
     {
-      "id": "core-notification_status",
+      "id": "notification-status",
       "name": "Status",
       "template": "<nve-notification-group position=\"center\">\n  <nve-notification>\n    <h3 nve-text=\"label\">Default</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n  <nve-notification status=\"accent\">\n    <h3 nve-text=\"label\">Accent</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n  <nve-notification status=\"success\">\n    <h3 nve-text=\"label\">Success</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n  <nve-notification status=\"warning\">\n    <h3 nve-text=\"label\">Warning</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n  <nve-notification status=\"danger\">\n    <h3 nve-text=\"label\">Danger</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n</nve-notification-group>\n",
       "summary": "Notification status variants for different message types and severity levels. Use status to convey message importance: success for confirmations, warning for cautions, danger for errors, and accent for general information requiring attention.",
@@ -83,7 +83,7 @@
       "tags": []
     },
     {
-      "id": "core-notification_alignment",
+      "id": "notification-alignment",
       "name": "Alignment",
       "template": "<nve-notification position=\"top\">\n  <h3 nve-text=\"label\">Top</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-notification position=\"top\" alignment=\"start\">\n  <h3 nve-text=\"label\">Top Start</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-notification position=\"top\" alignment=\"end\">\n  <h3 nve-text=\"label\">Top End</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-notification position=\"right\">\n  <h3 nve-text=\"label\">Right</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-notification position=\"right\" alignment=\"start\">\n  <h3 nve-text=\"label\">Right Start</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-notification position=\"right\" alignment=\"end\">\n  <h3 nve-text=\"label\">Right End</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-notification position=\"bottom\">\n  <h3 nve-text=\"label\">Bottom</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-notification position=\"bottom\" alignment=\"start\">\n  <h3 nve-text=\"label\">Bottom Start</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-notification position=\"bottom\" alignment=\"end\">\n  <h3 nve-text=\"label\">Bottom End</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-notification position=\"left\">\n  <h3 nve-text=\"label\">Left</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-notification position=\"left\" alignment=\"start\">\n  <h3 nve-text=\"label\">Left Start</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-notification position=\"left\" alignment=\"end\">\n  <h3 nve-text=\"label\">Left End</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n",
       "summary": "Notification positioning and alignment options for flexible screen placement. Use consistent positioning for notification types: bottom-right for success confirmations, top-center for warnings, accommodating different screen sizes and user attention patterns.",
@@ -94,7 +94,7 @@
       ]
     },
     {
-      "id": "core-notification_position",
+      "id": "notification-position",
       "name": "Position",
       "template": "<nve-notification position=\"top\">\n  <h3 nve-text=\"label\">Position Top</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-notification position=\"right\">\n  <h3 nve-text=\"label\">Position Right</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-notification position=\"bottom\">\n  <h3 nve-text=\"label\">Position Bottom</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-notification position=\"left\">\n  <h3 nve-text=\"label\">Position Left</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n",
       "summary": "Basic notification positioning at screen edges without alignment specification. Use edge positions for standard notification placement, choosing position based on content importance and user workflow patterns.",
@@ -105,7 +105,7 @@
       ]
     },
     {
-      "id": "core-notification_position-group",
+      "id": "notification-position-group",
       "name": "PositionGroup",
       "template": "<nve-notification-group position=\"top\">\n  <nve-notification closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n  <nve-notification closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n  <nve-notification closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n</nve-notification-group>\n<nve-notification-group position=\"right\">\n  <nve-notification closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n  <nve-notification closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n  <nve-notification closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n</nve-notification-group>\n<nve-notification-group position=\"bottom\">\n  <nve-notification closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n  <nve-notification closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n  <nve-notification closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n</nve-notification-group>\n<nve-notification-group position=\"left\">\n  <nve-notification closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n  <nve-notification closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n  <nve-notification closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">some text content in a notification</p>\n  </nve-notification>\n</nve-notification-group>\n",
       "summary": "Grouped notifications with consistent positioning for stacking many messages. Use notification groups to manage many alerts in an organized queue, maintaining visual consistency and providing users with a clear notification center.",
@@ -116,7 +116,7 @@
       ]
     },
     {
-      "id": "core-notification_drawer",
+      "id": "notification-drawer",
       "name": "Drawer",
       "template": "<nve-drawer closable position=\"right\">\n  <nve-drawer-header>\n    <h3 nve-text=\"heading semibold sm\">Notifications</h3>\n  </nve-drawer-header>\n  <nve-notification closable container=\"flat\">\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">This is a notification in a notification drawer, messages should be succinct.</p>\n  </nve-notification>\n  <nve-notification status=\"accent\" container=\"flat\" closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">This is a notification in a notification drawer, messages should be succinct.</p>\n  </nve-notification>\n  <nve-notification status=\"success\" container=\"flat\" closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">This is a notification in a notification drawer, messages should be succinct.</p>\n  </nve-notification>\n  <nve-notification status=\"warning\" container=\"flat\" closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">This is a notification in a notification drawer, messages should be succinct.</p>\n  </nve-notification>\n  <nve-notification status=\"danger\" container=\"flat\" closable>\n    <h3 nve-text=\"label\">Notification</h3>\n    <p nve-text=\"body\">This is a notification in a notification drawer, messages should be succinct.</p>\n  </nve-notification>\n  <nve-drawer-footer>\n    <div nve-layout=\"grid gap:sm span-items:6\">\n      <nve-button interaction=\"destructive\" container=\"flat\">Clear All</nve-button>\n      <nve-button>Mark All as Read</nve-button>\n    </div>\n  </nve-drawer-footer>\n</nve-drawer>\n",
       "summary": "Notification center pattern using drawer for persistent notification management. Perfect for applications with frequent notifications, allowing users to review, manage, and act on many notifications in a dedicated space with bulk actions.",
@@ -127,7 +127,7 @@
       ]
     },
     {
-      "id": "core-notification_shadow-root",
+      "id": "notification-shadow-root",
       "name": "ShadowRoot",
       "template": "<test-notification-shadow-root></test-notification-shadow-root>\n<script type=\"module\">\n  customElements.define(\n    \"test-notification-shadow-root\",\n    class TestNotificationShadowRoot extends HTMLElement {\n      constructor() {\n        super();\n        this._shadow = this.attachShadow({ mode: \"open\" });\n        const template = document.createElement(\"template\");\n        template.innerHTML = `\n        <nve-notification position=\"top\">\n          top\n        </nve-notification>\n        <nve-notification position=\"top\" alignment=\"start\">\n          top start\n        </nve-notification>\n        <nve-notification position=\"top\" alignment=\"end\">\n          top end\n        </nve-notification>\n        <nve-notification position=\"right\">\n          right\n        </nve-notification>\n        <nve-notification position=\"right\" alignment=\"start\">\n          right start\n        </nve-notification>\n        <nve-notification position=\"right\" alignment=\"end\">\n          right end\n        </nve-notification>\n        <nve-notification position=\"bottom\">\n          bottom\n        </nve-notification>\n        <nve-notification position=\"bottom\" alignment=\"start\">\n          bottom start\n        </nve-notification>\n        <nve-notification position=\"bottom\" alignment=\"end\">\n          bottom end\n        </nve-notification>\n        <nve-notification position=\"left\">\n          left\n        </nve-notification>\n        <nve-notification position=\"left\" alignment=\"start\">\n          left start\n        </nve-notification>\n        <nve-notification position=\"left\" alignment=\"end\">\n          left end\n        </nve-notification>\n      `;\n        this._shadow.appendChild(template.content);\n      }\n    },\n  );\n</script>\n",
       "summary": "Notification functionality within shadow DOM for Web Component architectures. Verifies proper notification positioning and behavior when used inside encapsulated component boundaries, essential for component libraries.",
@@ -138,7 +138,7 @@
       ]
     },
     {
-      "id": "core-notification_legacy-behavior-trigger",
+      "id": "notification-legacy-behavior-trigger",
       "name": "LegacyBehaviorTrigger",
       "template": "<nve-notification trigger=\"notification-btn\" behavior-trigger hidden closable position=\"bottom\" close-timeout=\"2000\">\n  <h3 nve-text=\"label\">notification</h3>\n  <p nve-text=\"body\">some text content in a notification</p>\n</nve-notification>\n<nve-button id=\"notification-btn\">show</nve-button>\n",
       "summary": "Legacy behavior-trigger pattern for automatic notification lifecycle management. Deprecated approach with manual trigger attribute, prefer modern popovertarget API for cleaner notification triggering.",
@@ -149,7 +149,7 @@
       ]
     },
     {
-      "id": "core-notification_layers",
+      "id": "notification-layers",
       "name": "Layers",
       "template": "<nve-button>Notification</nve-button>\n<nve-button popovertarget=\"dialog\">Dialog</nve-button>\n<nve-notification-group position=\"bottom\" alignment=\"end\" id=\"group\"></nve-notification-group>\n<nve-dialog id=\"dialog\" modal closable>\n  <nve-dialog-header>\n    <h3 nve-text=\"heading semibold\">Notification</h3>\n  </nve-dialog-header>\n  <p nve-text=\"body\">This should not cause the dialog to close</p>\n</nve-dialog>\n<script type=\"module\">\n  const button = document.querySelector(\"nve-button\");\n  button.addEventListener(\"click\", () => {\n    const notification = document.createElement(\"nve-notification\");\n    notification.closable = true;\n    notification.status = [\"warning\", \"danger\", \"success\", \"accent\", undefined][Math.floor(Math.random() * 5)];\n    notification.innerHTML =\n      '<h3 nve-text=\"label\">' +\n      (notification.status ?? \"default\") +\n      '</h3><p nve-text=\"body\">some text content in a notification</p>';\n    notification.closeTimeout = 3000 * (document.querySelectorAll(\"nve-notification\").length + 1);\n    notification.addEventListener(\"close\", () => notification.remove(), { once: true });\n    notification.position = \"bottom\";\n    notification.alignment = \"end\";\n    document.querySelector(\"nve-notification-group\").prepend(notification);\n  });\n</script>\n",
       "summary": "Notification layering with modal dialogs for proper stacking context. Ensures notifications appear above dialogs without interfering with modal interactions, crucial for complex UI layering scenarios.",

package/dist/notification/notification2.js

@@ -32,7 +32,7 @@ var m = class extends d {
 	static {
 		this.metadata = {
 			tag: "nve-notification",
-			version: "0.0.9"
+			version: "0.0.11"
 		};
 	}
 	static {

package/dist/page/page-panel/page-panel-content2.js

@@ -9,7 +9,7 @@ var i = class extends n {
 	static {
 		this.metadata = {
 			tag: "nve-page-panel-content",
-			version: "0.0.9"
+			version: "0.0.11"
 		};
 	}
 	render() {

package/dist/page/page-panel/page-panel-footer2.js

@@ -14,7 +14,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-page-panel-footer",
-			version: "0.0.9"
+			version: "0.0.11"
 		};
 	}
 	render() {

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

@@ -14,7 +14,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-page-panel-header",
-			version: "0.0.9"
+			version: "0.0.11"
 		};
 	}
 	render() {

package/dist/page/page-panel/page-panel2.js

@@ -23,7 +23,7 @@ var h = class extends d {
 	static {
 		this.metadata = {
 			tag: "nve-page-panel",
-			version: "0.0.9",
+			version: "0.0.11",
 			parents: ["nve-page"]
 		};
 	}