@nvidia-elements/core 0.0.10 → 0.0.12

package/dist/progressive-filter-chip/progressive-filter-chip.examples.json

@@ -3,7 +3,7 @@
   "entrypoint": "@nvidia-elements/core/progressive-filter-chip/progressive-filter-chip.examples.json",
   "items": [
     {
-      "id": "core-progressive-filter-chip_default",
+      "id": "progressive-filter-chip",
       "name": "Default",
       "template": "<nve-progressive-filter-chip closable>\n  <nve-select>\n    <select aria-label=\"dataset\">\n      <option>workload</option>\n      <option selected>instance</option>\n    </select>\n  </nve-select>\n  <nve-select>\n    <select aria-label=\"condition\">\n      <option>sort by</option>\n      <option selected>filter by</option>\n    </select>\n  </nve-select>\n  <nve-select>\n    <select aria-label=\"filter\">\n      <option selected>utilization</option>\n      <option>status</option>\n    </select>\n  </nve-select>\n</nve-progressive-filter-chip>\n",
       "summary": "Basic progressive filter chip with cascading select dropdowns for multi-criteria filtering.",
@@ -12,7 +12,7 @@
       "tags": []
     },
     {
-      "id": "core-progressive-filter-chip_layer",
+      "id": "progressive-filter-chip-layer",
       "name": "Layer",
       "template": "<nve-progressive-filter-chip closable>\n  <nve-select>\n    <select aria-label=\"dataset\">\n      <option>workload</option>\n      <option selected>instance</option>\n    </select>\n  </nve-select>\n  <nve-select>\n    <select aria-label=\"condition\">\n      <option>sort by</option>\n      <option selected>filter by</option>\n    </select>\n  </nve-select>\n  <nve-select>\n    <select aria-label=\"filter\">\n      <option selected>utilization</option>\n      <option>status</option>\n    </select>\n  </nve-select>\n</nve-progressive-filter-chip>\n",
       "summary": "Progressive filter chip with proper layer stacking within dropdown contexts.",
@@ -21,7 +21,7 @@
       "tags": []
     },
     {
-      "id": "core-progressive-filter-chip_multiple",
+      "id": "progressive-filter-chip-multiple",
       "name": "Multiple",
       "template": "<nve-progressive-filter-chip closable>\n  <nve-select>\n    <select aria-label=\"dataset\">\n      <option selected>status</option>\n      <option>workload</option>\n    </select>\n  </nve-select>\n  <nve-select>\n    <select aria-label=\"condition\">\n      <option selected>filter by</option>\n      <option>sort by</option>\n    </select>\n  </nve-select>\n  <nve-select>\n    <select multiple aria-label=\"filter\">\n      <option selected>progress</option>\n      <option>pending</option>\n      <option>success</option>\n      <option>failed</option>\n    </select>\n  </nve-select>\n</nve-progressive-filter-chip>\n",
       "summary": "Progressive filter chip with multi-select dropdown for filtering by many values simultaneously.",
@@ -30,7 +30,7 @@
       "tags": []
     },
     {
-      "id": "core-progressive-filter-chip_text-input",
+      "id": "progressive-filter-chip-text-input",
       "name": "TextInput",
       "template": "<nve-progressive-filter-chip closable>\n  <nve-select>\n    <select aria-label=\"dataset\">\n      <option selected>memory</option>\n      <option>CPU</option>\n    </select>\n  </nve-select>\n  <nve-select>\n    <select aria-label=\"condition\">\n      <option selected>greater than</option>\n      <option>less than</option>\n      <option>equal to</option>\n    </select>\n  </nve-select>\n  <nve-input>\n    <input type=\"number\" min=\"0\" max=\"100\" value=\"50\" aria-label=\"filter\" />\n  </nve-input>\n</nve-progressive-filter-chip>\n",
       "summary": "Progressive filter chip with numeric text input for threshold-based filtering (greater than, less than).",
@@ -39,7 +39,7 @@
       "tags": []
     },
     {
-      "id": "core-progressive-filter-chip_date-range",
+      "id": "progressive-filter-chip-date-range",
       "name": "DateRange",
       "template": "<nve-progressive-filter-chip>\n  <nve-select>\n    <select aria-label=\"date type\">\n      <option>recording date</option>\n      <option>process date</option>\n    </select>\n  </nve-select>\n  <nve-date>\n    <input type=\"date\" value=\"2022-05-11\" aria-label=\"start date\" />\n  </nve-date>\n  <nve-date>\n    <input type=\"date\" value=\"2022-12-07\" aria-label=\"end date\" />\n  </nve-date>\n</nve-progressive-filter-chip>\n",
       "summary": "Progressive filter chip with date picker inputs for filtering by date range criteria.",
@@ -48,7 +48,7 @@
       "tags": []
     },
     {
-      "id": "core-progressive-filter-chip_custom",
+      "id": "progressive-filter-chip-custom",
       "name": "Custom",
       "template": "<nve-progressive-filter-chip closable>\n  <nve-select>\n    <select aria-label=\"dataset\">\n      <option>GPS</option>\n      <option selected>Cellular</option>\n    </select>\n  </nve-select>\n  <nve-select>\n    <select aria-label=\"condition\">\n      <option>contains</option>\n      <option>excludes</option>\n    </select>\n  </nve-select>\n  <nve-button style=\"width: 190px\" popovertarget=\"map-dropdown\">37.3706254,-121.9671894</nve-button>\n</nve-progressive-filter-chip>\n<nve-dropdown id=\"map-dropdown\">\n  <nve-input>\n    <nve-icon-button icon-name=\"map-pin\" readonly></nve-icon-button>\n    <input value=\"37.3706254,-121.9671894\" disabled aria-label=\"map coordinates\" />\n  </nve-input>\n  <img src=\"static/images/test-map-2.webp\" width=\"300px\" alt=\"non-interactive demo map\" />\n</nve-dropdown>\n",
       "summary": "Progressive filter chip with custom button trigger opening a map coordinate picker dropdown.",
@@ -57,7 +57,7 @@
       "tags": []
     },
     {
-      "id": "core-progressive-filter-chip_validation",
+      "id": "progressive-filter-chip-validation",
       "name": "Validation",
       "template": "<div nve-layout=\"column gap:lg\">\n  <nve-progressive-filter-chip closable>\n    <nve-input>\n      <input type=\"text\" value=\"validation\" required aria-label=\"validation\" />\n      <nve-control-message error=\"valueMissing\">required</nve-control-message>\n    </nve-input>\n    <nve-input>\n      <input type=\"text\" aria-label=\"validation\" />\n    </nve-input>\n  </nve-progressive-filter-chip>\n  <nve-progressive-filter-chip closable>\n    <nve-input status=\"error\">\n      <input type=\"text\" value=\"manual validation\" formnovalidate aria-label=\"manual validation\" />\n    </nve-input>\n    <nve-input>\n      <input type=\"text\" aria-label=\"validation\" />\n    </nve-input>\n  </nve-progressive-filter-chip>\n</div>\n",
       "summary": "Progressive filter chip with input validation states showing required field and error styling.",

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.10"
+			version: "0.0.12"
 		};
 	}
 	static {

package/dist/pulse/pulse.examples.json

@@ -3,7 +3,7 @@
   "entrypoint": "@nvidia-elements/core/pulse/pulse.examples.json",
   "items": [
     {
-      "id": "core-pulse_default",
+      "id": "pulse",
       "name": "Default",
       "template": "<div nve-layout=\"row align:center\">\n  <nve-pulse aria-label=\"pulse component\"></nve-pulse>\n</div>\n",
       "summary": "Animated pulse indicator with aria-label for accessibility. Use to draw attention to live updates, active connections, or real-time status.",
@@ -12,7 +12,7 @@
       "tags": []
     },
     {
-      "id": "core-pulse_status",
+      "id": "pulse-status",
       "name": "Status",
       "template": "<div nve-layout=\"row gap:sm pad:md\">\n  <nve-pulse></nve-pulse>\n  <nve-pulse status=\"accent\"></nve-pulse>\n  <nve-pulse status=\"warning\"></nve-pulse>\n  <nve-pulse status=\"danger\"></nve-pulse>\n</div>\n",
       "summary": "Pulse status variants for different severity levels. Use accent for highlights, warning for caution states, and danger for critical alerts.",
@@ -21,7 +21,7 @@
       "tags": []
     },
     {
-      "id": "core-pulse_size",
+      "id": "pulse-size",
       "name": "Size",
       "template": "<div nve-layout=\"row align:center\">\n  <nve-pulse size=\"xs\"></nve-pulse>\n  <nve-pulse size=\"sm\"></nve-pulse>\n  <nve-pulse size=\"md\"></nve-pulse>\n  <nve-pulse size=\"lg\"></nve-pulse>\n</div>\n",
       "summary": "Pulse size variants from extra-small to large. Choose sizes based on context—smaller for inline indicators, larger for prominent status displays.",
@@ -32,7 +32,7 @@
       ]
     },
     {
-      "id": "core-pulse_inline",
+      "id": "pulse-inline",
       "name": "Inline",
       "template": "<div nve-layout=\"row gap:xs align:center\">\n  <nve-pulse status=\"danger\"></nve-pulse>\n  Live Status\n</div>\n",
       "summary": "Pulse used inline with text labels. Ideal for status indicators in lists, tables, or headers to show real-time or live states.",

package/dist/pulse/pulse2.js

@@ -13,7 +13,7 @@ var c = class extends a {
 	static {
 		this.metadata = {
 			tag: "nve-pulse",
-			version: "0.0.10"
+			version: "0.0.12"
 		};
 	}
 	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.10",
+			version: "0.0.12",
 			children: [
 				"label",
 				"nve-control-message",

package/dist/radio/radio.examples.json

@@ -3,7 +3,7 @@
   "entrypoint": "@nvidia-elements/core/radio/radio.examples.json",
   "items": [
     {
-      "id": "core-radio_default",
+      "id": "radio",
       "name": "Default",
       "template": "<nve-radio-group>\n  <label>label</label>\n  <nve-radio>\n    <label>radio 1</label>\n    <input type=\"radio\" checked />\n  </nve-radio>\n  <nve-radio>\n    <label>radio 2</label>\n    <input type=\"radio\" />\n  </nve-radio>\n  <nve-radio>\n    <label>radio 3</label>\n    <input type=\"radio\" />\n  </nve-radio>\n  <nve-control-message>message</nve-control-message>\n</nve-radio-group>\n",
       "summary": "Basic radio button group for mutually exclusive single-choice selection from many options.",
@@ -12,7 +12,7 @@
       "tags": []
     },
     {
-      "id": "core-radio_vertical-group",
+      "id": "radio-vertical-group",
       "name": "VerticalGroup",
       "template": "<div nve-layout=\"column gap:lg align:stretch\">\n  <nve-radio-group>\n    <label>label</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-control-message>message</nve-control-message>\n  </nve-radio-group>\n  <nve-radio-group>\n    <label>disabled</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked disabled />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" disabled />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" disabled />\n    </nve-radio>\n    <nve-control-message>disabled message</nve-control-message>\n  </nve-radio-group>\n  <nve-radio-group>\n    <label>success</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-control-message status=\"success\">success message</nve-control-message>\n  </nve-radio-group>\n  <nve-radio-group>\n    <label>error</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-control-message status=\"error\">error message</nve-control-message>\n  </nve-radio-group>\n</div>\n",
       "summary": "Radio groups with vertical layout including validation states for disabled, success, and error.",
@@ -21,7 +21,7 @@
       "tags": []
     },
     {
-      "id": "core-radio_vertical-inline-group",
+      "id": "radio-vertical-inline-group",
       "name": "VerticalInlineGroup",
       "template": "<div nve-layout=\"column gap:lg align:stretch\">\n  <nve-radio-group layout=\"vertical-inline\">\n    <label>label</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-control-message>message</nve-control-message>\n  </nve-radio-group>\n  <nve-radio-group layout=\"vertical-inline\">\n    <label>disabled</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked disabled />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" disabled />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" disabled />\n    </nve-radio>\n    <nve-control-message>disabled message</nve-control-message>\n  </nve-radio-group>\n  <nve-radio-group layout=\"vertical-inline\">\n    <label>success</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-control-message status=\"success\">success message</nve-control-message>\n  </nve-radio-group>\n  <nve-radio-group layout=\"vertical-inline\">\n    <label>error</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-control-message status=\"error\">error message</nve-control-message>\n  </nve-radio-group>\n</div>\n",
       "summary": "Radio groups with vertical inline layout for compact vertical stacking with inline label positioning.",
@@ -32,7 +32,7 @@
       ]
     },
     {
-      "id": "core-radio_horizontal-group",
+      "id": "radio-horizontal-group",
       "name": "HorizontalGroup",
       "template": "<div nve-layout=\"column gap:lg align:stretch\">\n  <nve-radio-group layout=\"horizontal\">\n    <label>label</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-control-message>message</nve-control-message>\n  </nve-radio-group>\n  <nve-radio-group layout=\"horizontal\">\n    <label>disabled</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked disabled />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" disabled />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" disabled />\n    </nve-radio>\n    <nve-control-message>disabled message</nve-control-message>\n  </nve-radio-group>\n  <nve-radio-group layout=\"horizontal\">\n    <label>success</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-control-message status=\"success\">success message</nve-control-message>\n  </nve-radio-group>\n  <nve-radio-group layout=\"horizontal\">\n    <label>error</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-control-message status=\"error\">error message</nve-control-message>\n  </nve-radio-group>\n</div>\n",
       "summary": "Radio groups with horizontal layout for options arranged in a row, ideal for limited choices.",
@@ -43,7 +43,7 @@
       ]
     },
     {
-      "id": "core-radio_horizontal-inline-group",
+      "id": "radio-horizontal-inline-group",
       "name": "HorizontalInlineGroup",
       "template": "<div nve-layout=\"column gap:lg align:stretch\">\n  <nve-radio-group layout=\"horizontal-inline\">\n    <label>label</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-control-message>message</nve-control-message>\n  </nve-radio-group>\n  <nve-radio-group layout=\"horizontal-inline\">\n    <label>disabled</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked disabled />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" disabled />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" disabled />\n    </nve-radio>\n    <nve-control-message>disabled message</nve-control-message>\n  </nve-radio-group>\n  <nve-radio-group layout=\"horizontal-inline\">\n    <label>success</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-control-message status=\"success\">success message</nve-control-message>\n  </nve-radio-group>\n  <nve-radio-group layout=\"horizontal-inline\">\n    <label>error</label>\n    <nve-radio>\n      <label>radio 1</label>\n      <input type=\"radio\" checked />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 2</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-radio>\n      <label>radio 3</label>\n      <input type=\"radio\" />\n    </nve-radio>\n    <nve-control-message status=\"error\">error message</nve-control-message>\n  </nve-radio-group>\n</div>\n",
       "summary": "Radio groups with horizontal inline layout for space-efficient horizontal arrangement with inline labels.",

package/dist/radio/radio2.js

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

package/dist/range/range.examples.json

@@ -3,7 +3,7 @@
   "entrypoint": "@nvidia-elements/core/range/range.examples.json",
   "items": [
     {
-      "id": "core-range_default",
+      "id": "range",
       "name": "Default",
       "template": "<nve-range>\n  <label>label</label>\n  <input type=\"range\" />\n  <nve-control-message>message</nve-control-message>\n</nve-range>\n",
       "summary": "Basic range component for numeric value selection, providing a simple slider interface for adjusting values within a defined range.",
@@ -12,7 +12,7 @@
       "tags": []
     },
     {
-      "id": "core-range_datalist",
+      "id": "range-datalist",
       "name": "Datalist",
       "template": "<nve-range>\n  <label>label</label>\n  <input type=\"range\" />\n  <nve-control-message>message</nve-control-message>\n  <datalist>\n    <option value=\"0\">0</option>\n    <option value=\"25\"></option>\n    <option value=\"50\"></option>\n    <option value=\"75\"></option>\n    <option value=\"100\"></option>\n  </datalist>\n</nve-range>\n",
       "summary": "Range with datalist for visual tick marks and labeled values, enabling users to see available options and precisely select predetermined values.",
@@ -21,7 +21,7 @@
       "tags": []
     },
     {
-      "id": "core-range_datalist-with-steps",
+      "id": "range-datalist-with-steps",
       "name": "DatalistWithSteps",
       "template": "<nve-range>\n  <label>label</label>\n  <input type=\"range\" min=\"0\" max=\"100\" step=\"10\" />\n  <datalist>\n    <option value=\"0\">0</option>\n    <option value=\"10\">10</option>\n    <option value=\"20\">20</option>\n    <option value=\"30\">30</option>\n    <option value=\"40\">40</option>\n    <option value=\"50\">50</option>\n    <option value=\"60\">60</option>\n    <option value=\"70\">70</option>\n    <option value=\"80\">80</option>\n    <option value=\"90\">90</option>\n    <option value=\"100\">100</option>\n  </datalist>\n</nve-range>\n",
       "summary": "Range with combined step increments and datalist labels, ensuring precise value selection with clear visual indicators at each valid step position.",
@@ -30,7 +30,7 @@
       "tags": []
     },
     {
-      "id": "core-range_step",
+      "id": "range-step",
       "name": "Step",
       "template": "<nve-range>\n  <label>label</label>\n  <input type=\"range\" min=\"0\" max=\"100\" step=\"20\" />\n  <nve-control-message>message</nve-control-message>\n</nve-range>\n",
       "summary": "Range with defined step increments for discrete value selection, constraining the slider to specific intervals for controlled input precision.",
@@ -39,7 +39,7 @@
       "tags": []
     },
     {
-      "id": "core-range_vertical",
+      "id": "range-vertical",
       "name": "Vertical",
       "template": "<div nve-layout=\"column gap:lg full\">\n  <nve-range>\n    <label>label</label>\n    <input type=\"range\" />\n    <nve-control-message>message</nve-control-message>\n  </nve-range>\n  <nve-range>\n    <label>disabled</label>\n    <input type=\"range\" disabled />\n    <nve-control-message>message</nve-control-message>\n  </nve-range>\n  <nve-range>\n    <label>success</label>\n    <input type=\"range\" />\n    <nve-control-message status=\"success\">message</nve-control-message>\n  </nve-range>\n  <nve-range>\n    <label>error</label>\n    <input type=\"range\" />\n    <nve-control-message status=\"error\">message</nve-control-message>\n  </nve-range>\n</div>\n",
       "summary": "Vertical layout configuration for stacked form arrangements, displaying label, slider, and message in a column format with support for states including disabled, success, and error feedback.",
@@ -50,7 +50,7 @@
       ]
     },
     {
-      "id": "core-range_horizontal",
+      "id": "range-horizontal",
       "name": "Horizontal",
       "template": "<div nve-layout=\"column gap:lg full\">\n  <nve-range layout=\"horizontal\">\n    <label>label</label>\n    <input type=\"range\" />\n    <nve-control-message>message</nve-control-message>\n  </nve-range>\n  <nve-range layout=\"horizontal\">\n    <label>disabled</label>\n    <input type=\"range\" disabled />\n    <nve-control-message>message</nve-control-message>\n  </nve-range>\n  <nve-range layout=\"horizontal\">\n    <label>success</label>\n    <input type=\"range\" />\n    <nve-control-message status=\"success\">message</nve-control-message>\n  </nve-range>\n  <nve-range layout=\"horizontal\">\n    <label>error</label>\n    <input type=\"range\" />\n    <nve-control-message status=\"error\">message</nve-control-message>\n  </nve-range>\n</div>\n",
       "summary": "Horizontal layout configuration for inline form arrangements, positioning label and slider side-by-side for compact displays with support for states including disabled, success, and error feedback.",
@@ -61,7 +61,7 @@
       ]
     },
     {
-      "id": "core-range_orientation-vertical",
+      "id": "range-orientation-vertical",
       "name": "OrientationVertical",
       "template": "<div style=\"height: 200px\">\n  <nve-range orientation=\"vertical\">\n    <label>label</label>\n    <input type=\"range\" />\n    <nve-control-message>message</nve-control-message>\n  </nve-range>\n</div>\n",
       "summary": "Vertical range slider for space-constrained layouts or controls where bottom-to-top value selection is intuitive, such as volume or equalizer adjustments.",
@@ -70,7 +70,7 @@
       "tags": []
     },
     {
-      "id": "core-range_orientation-vertical-datalist",
+      "id": "range-orientation-vertical-datalist",
       "name": "OrientationVerticalDatalist",
       "template": "<div style=\"height: 250px\">\n  <nve-range orientation=\"vertical\">\n    <label>label</label>\n    <input type=\"range\" />\n    <datalist>\n      <option value=\"0\">0</option>\n      <option value=\"25\">25</option>\n      <option value=\"50\">50</option>\n      <option value=\"75\">75</option>\n      <option value=\"100\">100</option>\n    </datalist>\n  </nve-range>\n</div>\n",
       "summary": "Vertical range slider with datalist tick marks and labeled values for precise value selection in vertical layouts.",
@@ -79,7 +79,7 @@
       "tags": []
     },
     {
-      "id": "core-range_custom-styles",
+      "id": "range-custom-styles",
       "name": "CustomStyles",
       "template": "<nve-range\n  style=\"\n    --background: #76b900;\n    --track-background: red;\n    --track-height: 4px;\n    --track-border-radius: 16px;\n    --thumb-background: black;\n    --thumb-border: inset 0 0 0 2px white;\n    --thumb-width: 14px;\n    --thumb-height: 14px;\n  \"\n>\n  <input type=\"range\" aria-label=\"range\" />\n</nve-range>\n",
       "summary": "Range component can have its visual styles overwritten to achieve custom themes.",

package/dist/range/range2.js

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

package/dist/resize-handle/resize-handle.examples.json

@@ -3,7 +3,7 @@
   "entrypoint": "@nvidia-elements/core/resize-handle/resize-handle.examples.json",
   "items": [
     {
-      "id": "core-resize-handle_default",
+      "id": "resize-handle",
       "name": "Default",
       "template": "<nve-resize-handle></nve-resize-handle>\n",
       "summary": "Basic horizontal resize handle for draggable panel dividers and split pane interfaces.",
@@ -12,7 +12,7 @@
       "tags": []
     },
     {
-      "id": "core-resize-handle_vertical",
+      "id": "resize-handle-vertical",
       "name": "Vertical",
       "template": "<div style=\"height: 200px\">\n  <nve-resize-handle orientation=\"vertical\"></nve-resize-handle>\n</div>\n",
       "summary": "Vertical resize handle for side-by-side panel layouts and horizontal split panes.",
@@ -21,7 +21,7 @@
       "tags": []
     },
     {
-      "id": "core-resize-handle_split-horizontal",
+      "id": "resize-handle-split-horizontal",
       "name": "SplitHorizontal",
       "template": "<section\n  id=\"split-horizontal-demo\"\n  style=\"\n    display: grid;\n    width: 250px;\n    height: 250px;\n    grid-template-rows: 1fr auto 1fr;\n    border: 1px solid var(--nve-ref-border-color);\n  \"\n>\n  <div style=\"background: hsla(0, 0%, 65%, 0.1)\"></div>\n  <nve-resize-handle min=\"20\" max=\"230\" value=\"125\" step=\"20\"></nve-resize-handle>\n  <div></div>\n</section>\n<script type=\"module\">\n  const handle = document.querySelector(\"#split-horizontal-demo nve-resize-handle\");\n  const split = document.querySelector(\"#split-horizontal-demo\");\n  handle.addEventListener(\"input\", (e) => (split.style.gridTemplateRows = \"1fr auto \" + e.target.value + \"px\"));\n</script>\n",
       "summary": "Horizontal split pane with draggable divider that adjusts top and bottom panel heights.",
@@ -30,7 +30,7 @@
       "tags": []
     },
     {
-      "id": "core-resize-handle_split-vertical",
+      "id": "resize-handle-split-vertical",
       "name": "SplitVertical",
       "template": "<section\n  id=\"split-vertical-demo\"\n  style=\"\n    display: grid;\n    width: 250px;\n    height: 250px;\n    grid-template-columns: 1fr auto 1fr;\n    border: 1px solid var(--nve-ref-border-color);\n  \"\n>\n  <div style=\"background: hsla(0, 0%, 65%, 0.1)\"></div>\n  <nve-resize-handle orientation=\"vertical\" min=\"20\" max=\"230\" value=\"125\" step=\"20\"></nve-resize-handle>\n  <div></div>\n</section>\n<script type=\"module\">\n  const handle = document.querySelector(\"#split-vertical-demo nve-resize-handle\");\n  const split = document.querySelector(\"#split-vertical-demo\");\n  handle.addEventListener(\"input\", (e) => (split.style.gridTemplateColumns = e.target.value + \"px auto 1fr\"));\n</script>\n",
       "summary": "Vertical split pane with draggable divider that adjusts left and right panel widths.",
@@ -39,7 +39,7 @@
       "tags": []
     },
     {
-      "id": "core-resize-handle_form",
+      "id": "resize-handle-form",
       "name": "Form",
       "template": "<form id=\"form-demo\" nve-layout=\"column gap:lg\">\n  <section\n    style=\"\n      display: grid;\n      width: 250px;\n      height: 250px;\n      grid-template-rows: 1fr auto 1fr;\n      border: 1px solid var(--nve-ref-border-color);\n    \"\n  >\n    <div></div>\n    <nve-resize-handle name=\"resize\" min=\"20\" max=\"230\" value=\"125\" step=\"20\"></nve-resize-handle>\n    <div style=\"background: hsla(0, 0%, 65%, 0.1)\"></div>\n  </section>\n  <nve-button>submit</nve-button>\n</form>\n<script type=\"module\">\n  const form = document.querySelector(\"#form-demo\");\n  const split = document.querySelector(\"#form-demo section\");\n  const handle = document.querySelector(\"#form-demo nve-resize-handle\");\n  form.addEventListener(\"submit\", (e) => {\n    e.preventDefault();\n    console.log(Object.fromEntries(new FormData(form)));\n    console.log(handle.form);\n  });\n  handle.addEventListener(\"change\", (e) => {\n    console.log(\"change\", e.target.value);\n  });\n  handle.addEventListener(\"input\", (e) => {\n    console.log(\"input\", e.target.value);\n    split.style.gridTemplateRows = \"1fr auto \" + e.target.value + \"px\";\n  });\n</script>\n",
       "summary": "Resize handle as a form control with name attribute for submitting resize values.",
@@ -48,7 +48,7 @@
       "tags": []
     },
     {
-      "id": "core-resize-handle_prevent-default",
+      "id": "resize-handle-prevent",
       "name": "PreventDefault",
       "template": "<form id=\"prevent-default-demo\" nve-layout=\"column gap:lg\">\n  <section\n    style=\"\n      display: grid;\n      width: 250px;\n      height: 250px;\n      grid-template-rows: 1fr auto 1fr;\n      border: 1px solid var(--nve-ref-border-color);\n    \"\n  >\n    <div></div>\n    <nve-resize-handle name=\"resize\" min=\"20\" max=\"230\" value=\"125\" step=\"20\"></nve-resize-handle>\n    <div style=\"background: hsla(0, 0%, 65%, 0.1)\"></div>\n  </section>\n</form>\n<script type=\"module\">\n  const split = document.querySelector(\"#prevent-default-demo section\");\n  const handle = document.querySelector(\"#prevent-default-demo nve-resize-handle\");\n  handle.addEventListener(\"toggle\", (e) => {\n    e.preventDefault();\n    console.log(\"toggle defaultPrevented:\", e.defaultPrevented);\n  });\n  handle.addEventListener(\"input\", (e) => {\n    split.style.gridTemplateRows = \"1fr auto \" + e.target.value + \"px\";\n  });\n</script>\n",
       "summary": "Resize handle with prevented default toggle to disable snap-to-boundary on double-click. Use when the default collapse/expand behavior conflicts with custom resize constraints or when you need full control over toggle logic.",
@@ -57,7 +57,7 @@
       "tags": []
     },
     {
-      "id": "core-resize-handle_line-width",
+      "id": "resize-handle-line-width",
       "name": "LineWidth",
       "template": "<div style=\"height: 200px\">\n  <nve-resize-handle orientation=\"vertical\" style=\"--line-width: 6px\"></nve-resize-handle>\n</div>\n",
       "summary": "Custom line width styling for resize handle visibility using CSS custom property.",

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.10",
+			version: "0.0.12",
 			valueSchema: { type: "number" }
 		};
 	}

package/dist/search/search.examples.json

@@ -3,7 +3,7 @@
   "entrypoint": "@nvidia-elements/core/search/search.examples.json",
   "items": [
     {
-      "id": "core-search_default",
+      "id": "search",
       "name": "Default",
       "template": "<nve-search>\n  <label>label</label>\n  <input type=\"search\" />\n  <nve-control-message>message</nve-control-message>\n</nve-search>\n",
       "summary": "Basic search input with label and message for query entry and filtering data.",
@@ -12,7 +12,7 @@
       "tags": []
     },
     {
-      "id": "core-search_inline",
+      "id": "search-inline",
       "name": "Inline",
       "template": "<nve-search rounded>\n  <input type=\"search\" aria-label=\"search\" placeholder=\"search\" />\n</nve-search>\n",
       "summary": "Rounded search input without visible label for compact inline placement in headers or toolbars.",
@@ -21,7 +21,7 @@
       "tags": []
     },
     {
-      "id": "core-search_datalist",
+      "id": "search-datalist",
       "name": "Datalist",
       "template": "<nve-search rounded>\n  <input type=\"search\" aria-label=\"search\" placeholder=\"search\" />\n  <datalist>\n    <option value=\"search result 1\"></option>\n    <option value=\"search result 2\"></option>\n    <option value=\"search result 3\"></option>\n  </datalist>\n</nve-search>\n",
       "summary": "Search input with datalist providing autocomplete suggestions for quick query selection from recent searches.",
@@ -30,7 +30,7 @@
       "tags": []
     },
     {
-      "id": "core-search_vertical",
+      "id": "search-vertical",
       "name": "Vertical",
       "template": "<div nve-layout=\"column gap:lg full\">\n  <nve-search>\n    <label>label</label>\n    <input type=\"search\" placeholder=\"search\" />\n    <nve-control-message>message</nve-control-message>\n  </nve-search>\n  <nve-search>\n    <label>disabled</label>\n    <input type=\"search\" disabled />\n    <nve-control-message>message</nve-control-message>\n  </nve-search>\n  <nve-search>\n    <label>success</label>\n    <input type=\"search\" placeholder=\"search\" />\n    <nve-control-message status=\"success\">message</nve-control-message>\n  </nve-search>\n  <nve-search>\n    <label>error</label>\n    <input type=\"search\" placeholder=\"search\" />\n    <nve-control-message status=\"error\">message</nve-control-message>\n  </nve-search>\n</div>\n",
       "summary": "Search inputs with vertical layout including validation states for disabled, success, and error.",
@@ -41,7 +41,7 @@
       ]
     },
     {
-      "id": "core-search_horizontal",
+      "id": "search-horizontal",
       "name": "Horizontal",
       "template": "<div nve-layout=\"column gap:lg full\">\n  <nve-search layout=\"horizontal\">\n    <label>label</label>\n    <input type=\"search\" placeholder=\"search\" />\n    <nve-control-message>message</nve-control-message>\n  </nve-search>\n  <nve-search layout=\"horizontal\">\n    <label>disabled</label>\n    <input type=\"search\" disabled />\n    <nve-control-message>message</nve-control-message>\n  </nve-search>\n  <nve-search layout=\"horizontal\">\n    <label>success</label>\n    <input type=\"search\" placeholder=\"search\" />\n    <nve-control-message status=\"success\">message</nve-control-message>\n  </nve-search>\n  <nve-search layout=\"horizontal\">\n    <label>error</label>\n    <input type=\"search\" placeholder=\"search\" />\n    <nve-control-message status=\"error\">message</nve-control-message>\n  </nve-search>\n</div>\n",
       "summary": "Search inputs with horizontal layout showing validation states for inline forms and compact layouts.",

package/dist/search/search2.js

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