@nvidia-elements/core 2.2.3 → 2.3.0

package/dist/custom-elements.json

@@ -2694,6 +2694,14 @@
             "package": "@nvidia-elements/core/file"
           }
         },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "@nvidia-elements/core/format-bytes"
+          }
+        },
         {
           "kind": "js",
           "name": "*",
@@ -9305,7 +9313,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "Dialog is a component that appears above main content. A modal dialog displays critical information that requires user attention and interrupts user flow. [MDN Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API)",
+          "description": "Dialog is a component that appears above main content. A modal dialog displays critical information that requires user attention and interrupts user flow.",
           "name": "Dialog",
           "cssProperties": [
             {
@@ -9769,7 +9777,7 @@
             "since": "0.6.0",
             "status": "stable",
             "behavior": "popover",
-            "markdown": "## nve-dialog\n\nDialog is a component that appears above main content. A modal dialog displays critical information that requires user attention and interrupts user flow. [MDN Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API)\n\n### Example\n\n```html\n<nve-button popovertarget=\"dialog\">button</nve-button>\n<nve-dialog id=\"dialog\" modal closable>\n  <nve-dialog-header>\n    <h3 nve-text=\"heading semibold\">title</h3>\n  </nve-dialog-header>\n  <p nve-text=\"body\">some text content in a closable dialog</p>\n</nve-dialog>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/dialog/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | Dialog body content displayed between the header and footer. |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| position | `'center' \\| 'top' \\| 'bottom' \\| 'left' \\| 'right'` | Sets the side position of the popover relative to the provided anchor element. For dialog the anchor defaults to the document body. - `center` Centers the popover directly over the anchor element. - `top` Positions the popover above the anchor element. - `bottom` Positions the popover below the anchor element. - `left` Positions the popover to the left side of the anchor element. - `right` Positions the popover to the right side of the anchor element. |\n| alignment | `'start' \\| 'end' \\| 'center'` | Determines the alignment of the popover relative to the provided anchor element. - `start` Aligns the popover to the beginning edge of the anchor for left or top alignment. - `end` Aligns the popover to the ending edge of the anchor for right or bottom alignment. - `center` Centers the popover along the anchor's edge for balanced positioning. |\n| size | `'sm' \\| 'md' \\| 'lg' \\| undefined` | Controls the visual scale of an element to match its importance and available space. - `sm` Compact size for dense layouts or secondary elements with less visual prominence. - `md` Standard size that works well in most contexts and provides balanced visibility. - `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. |\n| closable | `boolean` | Indicates whether the user can dismiss or close the element. - `true` The element displays a close control and the user can dismiss it. - `false` The user cannot close the element and must dismiss it programmatically. |\n| modal | `boolean` | Determines if a dialog should have a modal backdrop that visually overlays the UI. |\n| anchor | property: `string \\| HTMLElement`; attribute: `string` | Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. |\n| i18n |  | Enables internal string values to update for internationalization. |\n\n### Events\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| beforetoggle | `CustomEvent` | Dispatched on a popover just before showing or hiding. [MDN](https://mdn.dev/HTMLElement/beforetoggle_event) |\n| toggle | `CustomEvent` | Dispatched on a popover element just after showing or hiding. [MDN](https://mdn.dev/HTMLElement/toggle_event) |\n| open | `CustomEvent` | Dispatched when the dialog opens. |\n| close | `CustomEvent` | Dispatched when the dialog closes. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --border | `string` | [MDN](https://mdn.dev/CSS/border) |\n| --border-radius | `string` | [MDN](https://mdn.dev/CSS/border-radius) |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --padding | `string` | [MDN](https://mdn.dev/CSS/padding) |\n| --box-shadow | `string` | [MDN](https://mdn.dev/CSS/box-shadow) |\n| --gap | `string` | [MDN](https://mdn.dev/CSS/gap) |\n| --max-width | `string` | [MDN](https://mdn.dev/CSS/max-width) |\n| --min-height | `string` | [MDN](https://mdn.dev/CSS/min-height) |\n| --max-height | `string` | [MDN](https://mdn.dev/CSS/max-height) |\n| --animation-duration | `string` | Duration of dialog open/close animations [MDN](https://mdn.dev/CSS/animation-duration) |"
+            "markdown": "## nve-dialog\n\nDialog is a component that appears above main content. A modal dialog displays critical information that requires user attention and interrupts user flow.\n\n### Example\n\n```html\n<nve-button popovertarget=\"dialog\">button</nve-button>\n<nve-dialog id=\"dialog\" modal closable>\n  <nve-dialog-header>\n    <h3 nve-text=\"heading semibold\">title</h3>\n  </nve-dialog-header>\n  <p nve-text=\"body\">some text content in a closable dialog</p>\n</nve-dialog>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/dialog/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | Dialog body content displayed between the header and footer. |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| position | `'center' \\| 'top' \\| 'bottom' \\| 'left' \\| 'right'` | Sets the side position of the popover relative to the provided anchor element. For dialog the anchor defaults to the document body. - `center` Centers the popover directly over the anchor element. - `top` Positions the popover above the anchor element. - `bottom` Positions the popover below the anchor element. - `left` Positions the popover to the left side of the anchor element. - `right` Positions the popover to the right side of the anchor element. |\n| alignment | `'start' \\| 'end' \\| 'center'` | Determines the alignment of the popover relative to the provided anchor element. - `start` Aligns the popover to the beginning edge of the anchor for left or top alignment. - `end` Aligns the popover to the ending edge of the anchor for right or bottom alignment. - `center` Centers the popover along the anchor's edge for balanced positioning. |\n| size | `'sm' \\| 'md' \\| 'lg' \\| undefined` | Controls the visual scale of an element to match its importance and available space. - `sm` Compact size for dense layouts or secondary elements with less visual prominence. - `md` Standard size that works well in most contexts and provides balanced visibility. - `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. |\n| closable | `boolean` | Indicates whether the user can dismiss or close the element. - `true` The element displays a close control and the user can dismiss it. - `false` The user cannot close the element and must dismiss it programmatically. |\n| modal | `boolean` | Determines if a dialog should have a modal backdrop that visually overlays the UI. |\n| anchor | property: `string \\| HTMLElement`; attribute: `string` | Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. |\n| i18n |  | Enables internal string values to update for internationalization. |\n\n### Events\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| beforetoggle | `CustomEvent` | Dispatched on a popover just before showing or hiding. [MDN](https://mdn.dev/HTMLElement/beforetoggle_event) |\n| toggle | `CustomEvent` | Dispatched on a popover element just after showing or hiding. [MDN](https://mdn.dev/HTMLElement/toggle_event) |\n| open | `CustomEvent` | Dispatched when the dialog opens. |\n| close | `CustomEvent` | Dispatched when the dialog closes. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --border | `string` | [MDN](https://mdn.dev/CSS/border) |\n| --border-radius | `string` | [MDN](https://mdn.dev/CSS/border-radius) |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --padding | `string` | [MDN](https://mdn.dev/CSS/padding) |\n| --box-shadow | `string` | [MDN](https://mdn.dev/CSS/box-shadow) |\n| --gap | `string` | [MDN](https://mdn.dev/CSS/gap) |\n| --max-width | `string` | [MDN](https://mdn.dev/CSS/max-width) |\n| --min-height | `string` | [MDN](https://mdn.dev/CSS/min-height) |\n| --max-height | `string` | [MDN](https://mdn.dev/CSS/max-height) |\n| --animation-duration | `string` | Duration of dialog open/close animations [MDN](https://mdn.dev/CSS/animation-duration) |"
           }
         }
       ],
@@ -10484,7 +10492,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "Drawer are to display content that is out of context of the rest of the page (notifications, navigation, settings). Or use [Panel](./docs/elements/panel/) inline as its content couples with or closely relates to the content on the page (details, extra actions/options). [MDN Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API)",
+          "description": "A drawer displays content separate from the rest of the page, such as notifications, navigation, and settings.",
           "name": "Drawer",
           "cssProperties": [
             {
@@ -10910,7 +10918,7 @@
             "since": "0.16.0",
             "status": "stable",
             "behavior": "popover",
-            "markdown": "## nve-drawer\n\nDrawer are to display content that is out of context of the rest of the page (notifications, navigation, settings). Or use [Panel](./docs/elements/panel/) inline as its content couples with or closely relates to the content on the page (details, extra actions/options). [MDN Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API)\n\n### Example\n\n```html\n<nve-drawer id=\"drawer\" closable modal>\n  <nve-drawer-header>\n    <h3 nve-text=\"heading semibold sm\">Drawer Header</h3>\n  </nve-drawer-header>\n  <nve-drawer-content>\n    <p nve-text=\"body\">drawer content</p>\n  </nve-drawer-content>\n  <nve-drawer-footer>\n    <p nve-text=\"body\">drawer footer</p>\n  </nve-drawer-footer>\n</nve-drawer>\n<nve-button popovertarget=\"drawer\">button</nve-button>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/drawer/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | Drawer body content displayed between the header and footer. |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| position | `'left' \\| 'right' \\| 'bottom' \\| 'top'` | Sets the side position of the popover relative to the provided anchor element. For drawer the anchor defaults to the document body. |\n| size | `'sm' \\| 'md' \\| 'lg' \\| undefined` | Controls the visual scale of an element to match its importance and available space. - `sm` Compact size for dense layouts or secondary elements with less visual prominence. - `md` Standard size that works well in most contexts and provides balanced visibility. - `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. |\n| closable | `boolean` | Indicates whether the user can dismiss or close the element. - `true` The element displays a close control and the user can dismiss it. - `false` The user cannot close the element and must dismiss it programmatically. |\n| modal | `boolean` | Determines if a drawer should have a modal backdrop that visually overlays the UI. |\n| anchor | property: `string \\| HTMLElement`; attribute: `string` | Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. |\n| inline | `boolean` | Create a inline layout effect while retaining the a11y characteristics and top layer behavior (light dismiss, focus trap, non interactive background) https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/ |\n| i18n |  | Enables internal string values to update for internationalization. |\n\n### Events\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| beforetoggle | `CustomEvent` | Dispatched on a popover just before showing or hiding. [MDN](https://mdn.dev/HTMLElement/beforetoggle_event) |\n| toggle | `CustomEvent` | Dispatched on a popover element just after showing or hiding. [MDN](https://mdn.dev/HTMLElement/toggle_event) |\n| open | `CustomEvent` | Dispatched when the drawer opens. |\n| close | `CustomEvent` | Dispatched when the drawer closes. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --border | `string` | [MDN](https://mdn.dev/CSS/border) |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --padding | `string` | [MDN](https://mdn.dev/CSS/padding) |\n| --box-shadow | `string` | [MDN](https://mdn.dev/CSS/box-shadow) |\n| --gap | `string` | [MDN](https://mdn.dev/CSS/gap) |\n| --top | `string` | [MDN](https://mdn.dev/CSS/top) |\n| --max-width | `string` | [MDN](https://mdn.dev/CSS/max-width) |\n| --width | `string` | [MDN](https://mdn.dev/CSS/width) |\n| --animation-duration | `string` | Duration of drawer open/close animations [MDN](https://mdn.dev/CSS/animation-duration) |"
+            "markdown": "## nve-drawer\n\nA drawer displays content separate from the rest of the page, such as notifications, navigation, and settings.\n\n### Example\n\n```html\n<nve-drawer id=\"drawer\" closable modal>\n  <nve-drawer-header>\n    <h3 nve-text=\"heading semibold sm\">Drawer Header</h3>\n  </nve-drawer-header>\n  <nve-drawer-content>\n    <p nve-text=\"body\">drawer content</p>\n  </nve-drawer-content>\n  <nve-drawer-footer>\n    <p nve-text=\"body\">drawer footer</p>\n  </nve-drawer-footer>\n</nve-drawer>\n<nve-button popovertarget=\"drawer\">button</nve-button>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/drawer/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | Drawer body content displayed between the header and footer. |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| position | `'left' \\| 'right' \\| 'bottom' \\| 'top'` | Sets the side position of the popover relative to the provided anchor element. For drawer the anchor defaults to the document body. |\n| size | `'sm' \\| 'md' \\| 'lg' \\| undefined` | Controls the visual scale of an element to match its importance and available space. - `sm` Compact size for dense layouts or secondary elements with less visual prominence. - `md` Standard size that works well in most contexts and provides balanced visibility. - `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. |\n| closable | `boolean` | Indicates whether the user can dismiss or close the element. - `true` The element displays a close control and the user can dismiss it. - `false` The user cannot close the element and must dismiss it programmatically. |\n| modal | `boolean` | Determines if a drawer should have a modal backdrop that visually overlays the UI. |\n| anchor | property: `string \\| HTMLElement`; attribute: `string` | Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. |\n| inline | `boolean` | Create a inline layout effect while retaining the a11y characteristics and top layer behavior (light dismiss, focus trap, non interactive background) https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/ |\n| i18n |  | Enables internal string values to update for internationalization. |\n\n### Events\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| beforetoggle | `CustomEvent` | Dispatched on a popover just before showing or hiding. [MDN](https://mdn.dev/HTMLElement/beforetoggle_event) |\n| toggle | `CustomEvent` | Dispatched on a popover element just after showing or hiding. [MDN](https://mdn.dev/HTMLElement/toggle_event) |\n| open | `CustomEvent` | Dispatched when the drawer opens. |\n| close | `CustomEvent` | Dispatched when the drawer closes. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --border | `string` | [MDN](https://mdn.dev/CSS/border) |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --padding | `string` | [MDN](https://mdn.dev/CSS/padding) |\n| --box-shadow | `string` | [MDN](https://mdn.dev/CSS/box-shadow) |\n| --gap | `string` | [MDN](https://mdn.dev/CSS/gap) |\n| --top | `string` | [MDN](https://mdn.dev/CSS/top) |\n| --max-width | `string` | [MDN](https://mdn.dev/CSS/max-width) |\n| --width | `string` | [MDN](https://mdn.dev/CSS/width) |\n| --animation-duration | `string` | Duration of drawer open/close animations [MDN](https://mdn.dev/CSS/animation-duration) |"
           }
         }
       ],
@@ -11214,7 +11222,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "Generic dropdown element for rendering a variety of different content such as interactive navigation or form controls. [MDN Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API)",
+          "description": "Generic dropdown element for rendering a variety of different content such as interactive navigation or form controls.",
           "name": "Dropdown",
           "cssProperties": [
             {
@@ -11439,11 +11447,11 @@
           ],
           "events": [
             {
-              "description": "Dispatched on a popover just before showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/beforetoggle_event)",
+              "description": "Dispatched on a popover just before showing or hiding.",
               "name": "beforetoggle"
             },
             {
-              "description": "Dispatched on a popover element just after showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event)",
+              "description": "Dispatched on a popover element just after showing or hiding.",
               "name": "toggle"
             },
             {
@@ -11623,7 +11631,7 @@
             "since": "0.6.0",
             "status": "stable",
             "behavior": "popover",
-            "markdown": "## nve-dropdown\n\nGeneric dropdown element for rendering a variety of different content such as interactive navigation or form controls. [MDN Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API)\n\n### Example\n\n```html\n<nve-button popovertarget=\"dropdown\">button</nve-button>\n<nve-dropdown id=\"dropdown\">dropdown content</nve-dropdown>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/dropdown/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | default slot for dropdown content |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| anchor | property: `string \\| HTMLElement`; attribute: `string` | Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. |\n| position | `'center' \\| 'top' \\| 'bottom' \\| 'left' \\| 'right'` | Sets the side position of the popover relative to the provided anchor element. - `center` Centers the popover directly over the anchor element. - `top` Positions the popover above the anchor element. - `bottom` Positions the popover below the anchor element. - `left` Positions the popover to the left side of the anchor element. - `right` Positions the popover to the right side of the anchor element. |\n| alignment | `'start' \\| 'end' \\| 'center'` | Determines the alignment of the popover relative to the provided anchor element. - `start` Aligns the popover to the beginning edge of the anchor for left or top alignment. - `end` Aligns the popover to the ending edge of the anchor for right or bottom alignment. - `center` Centers the popover along the anchor's edge for balanced positioning. |\n| closable | `boolean` | Indicates whether the user can dismiss or close the element. - `true` The element displays a close control and the user can dismiss it. - `false` The user cannot close the element and must dismiss it programmatically. |\n| arrow | `boolean` | Determines if an arrow renders. |\n| i18n |  | Enables internal string values to update for internationalization. |\n\n### Events\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| beforetoggle | `CustomEvent` | Dispatched on a popover just before showing or hiding. [MDN](https://mdn.dev/HTMLElement/beforetoggle_event) |\n| toggle | `CustomEvent` | Dispatched on a popover element just after showing or hiding. [MDN](https://mdn.dev/HTMLElement/toggle_event) |\n| open | `CustomEvent` | Dispatched when the dropdown opens. |\n| close | `CustomEvent` | Dispatched when the dropdown closes. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --border | `string` | [MDN](https://mdn.dev/CSS/border) |\n| --border-radius | `string` | [MDN](https://mdn.dev/CSS/border-radius) |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --padding | `string` | [MDN](https://mdn.dev/CSS/padding) |\n| --box-shadow | `string` | [MDN](https://mdn.dev/CSS/box-shadow) |\n| --width | `string` | [MDN](https://mdn.dev/CSS/width) |\n| --min-width | `string` | [MDN](https://mdn.dev/CSS/min-width) |\n| --gap | `string` | [MDN](https://mdn.dev/CSS/gap) |\n| --arrow-transform | `string` | Transform applied to the popover arrow |\n| --animation-duration | `string` | Duration of dropdown open/close animations [MDN](https://mdn.dev/CSS/animation-duration) |"
+            "markdown": "## nve-dropdown\n\nGeneric dropdown element for rendering a variety of different content such as interactive navigation or form controls.\n\n### Example\n\n```html\n<nve-button popovertarget=\"dropdown\">button</nve-button>\n<nve-dropdown id=\"dropdown\">dropdown content</nve-dropdown>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/dropdown/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | default slot for dropdown content |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| anchor | property: `string \\| HTMLElement`; attribute: `string` | Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. |\n| position | `'center' \\| 'top' \\| 'bottom' \\| 'left' \\| 'right'` | Sets the side position of the popover relative to the provided anchor element. - `center` Centers the popover directly over the anchor element. - `top` Positions the popover above the anchor element. - `bottom` Positions the popover below the anchor element. - `left` Positions the popover to the left side of the anchor element. - `right` Positions the popover to the right side of the anchor element. |\n| alignment | `'start' \\| 'end' \\| 'center'` | Determines the alignment of the popover relative to the provided anchor element. - `start` Aligns the popover to the beginning edge of the anchor for left or top alignment. - `end` Aligns the popover to the ending edge of the anchor for right or bottom alignment. - `center` Centers the popover along the anchor's edge for balanced positioning. |\n| closable | `boolean` | Indicates whether the user can dismiss or close the element. - `true` The element displays a close control and the user can dismiss it. - `false` The user cannot close the element and must dismiss it programmatically. |\n| arrow | `boolean` | Determines if an arrow renders. |\n| i18n |  | Enables internal string values to update for internationalization. |\n\n### Events\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| beforetoggle | `CustomEvent` | Dispatched on a popover just before showing or hiding. |\n| toggle | `CustomEvent` | Dispatched on a popover element just after showing or hiding. |\n| open | `CustomEvent` | Dispatched when the dropdown opens. |\n| close | `CustomEvent` | Dispatched when the dropdown closes. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --border | `string` | [MDN](https://mdn.dev/CSS/border) |\n| --border-radius | `string` | [MDN](https://mdn.dev/CSS/border-radius) |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --padding | `string` | [MDN](https://mdn.dev/CSS/padding) |\n| --box-shadow | `string` | [MDN](https://mdn.dev/CSS/box-shadow) |\n| --width | `string` | [MDN](https://mdn.dev/CSS/width) |\n| --min-width | `string` | [MDN](https://mdn.dev/CSS/min-width) |\n| --gap | `string` | [MDN](https://mdn.dev/CSS/gap) |\n| --arrow-transform | `string` | Transform applied to the popover arrow |\n| --animation-duration | `string` | Duration of dropdown open/close animations [MDN](https://mdn.dev/CSS/animation-duration) |"
           }
         }
       ],
@@ -13238,6 +13246,371 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "/src/format-bytes/define.js",
+      "declarations": [],
+      "exports": []
+    },
+    {
+      "kind": "javascript-module",
+      "path": "/src/format-bytes/format-bytes.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "Formats a byte count as localized, human-readable decimal or binary units.",
+          "name": "FormatBytes",
+          "slots": [
+            {
+              "description": "Numeric byte count to format (such as 1048576). Serves as fallback before hydration.",
+              "name": ""
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "number | undefined",
+                "_sourceAliases": [],
+                "values": [
+                  {
+                    "value": "number",
+                    "description": ""
+                  }
+                ]
+              },
+              "description": "Optional byte count for values supplied by JavaScript or bound data.\nBy default, the component formats the element's text content, which also serves as the SSR fallback.\nWhen both are present, this property takes precedence.",
+              "attribute": "value"
+            },
+            {
+              "kind": "field",
+              "name": "display",
+              "type": {
+                "text": "'decimal' | 'binary'",
+                "_sourceAliases": [
+                  "FormatBytesDisplay"
+                ],
+                "values": [
+                  {
+                    "value": "decimal",
+                    "description": ""
+                  },
+                  {
+                    "value": "binary",
+                    "description": ""
+                  }
+                ]
+              },
+              "default": "'decimal'",
+              "description": "Unit system: 'decimal' uses powers of 1000 and 'binary' uses powers of 1024.",
+              "attribute": "display"
+            },
+            {
+              "kind": "field",
+              "name": "unit",
+              "type": {
+                "text": "'b' | 'kb' | 'mb' | 'gb' | 'tb' | 'pb' | undefined",
+                "_sourceAliases": [
+                  "FormatBytesUnit"
+                ],
+                "values": [
+                  {
+                    "value": "b",
+                    "description": ""
+                  },
+                  {
+                    "value": "kb",
+                    "description": ""
+                  },
+                  {
+                    "value": "mb",
+                    "description": ""
+                  },
+                  {
+                    "value": "gb",
+                    "description": ""
+                  },
+                  {
+                    "value": "tb",
+                    "description": ""
+                  },
+                  {
+                    "value": "pb",
+                    "description": ""
+                  }
+                ]
+              },
+              "description": "Optional unit magnitude. When omitted, the component selects a unit from the byte count.",
+              "attribute": "unit"
+            },
+            {
+              "kind": "field",
+              "name": "unitDisplay",
+              "type": {
+                "text": "'short' | 'long'",
+                "_sourceAliases": [
+                  "FormatBytesUnitDisplay"
+                ],
+                "values": [
+                  {
+                    "value": "short",
+                    "description": ""
+                  },
+                  {
+                    "value": "long",
+                    "description": ""
+                  }
+                ]
+              },
+              "default": "'short'",
+              "description": "Unit label length: 'short' renders labels such as 'mb'; 'long' renders labels such as 'megabytes'.",
+              "attribute": "unit-display"
+            },
+            {
+              "kind": "field",
+              "name": "locale",
+              "type": {
+                "text": "string | undefined",
+                "_sourceAliases": [],
+                "values": [
+                  {
+                    "value": "string",
+                    "description": ""
+                  }
+                ]
+              },
+              "description": "Language tag (such as en-US or de-DE) used to format the number.\nDefaults to document.documentElement.lang or the runtime default.",
+              "attribute": "locale"
+            },
+            {
+              "kind": "field",
+              "name": "minimumFractionDigits",
+              "type": {
+                "text": "number | undefined",
+                "_sourceAliases": [],
+                "values": [
+                  {
+                    "value": "number",
+                    "description": ""
+                  }
+                ]
+              },
+              "description": "Pad fraction output to at least this many digits.",
+              "attribute": "minimum-fraction-digits"
+            },
+            {
+              "kind": "field",
+              "name": "maximumFractionDigits",
+              "type": {
+                "text": "number | undefined",
+                "_sourceAliases": [],
+                "values": [
+                  {
+                    "value": "number",
+                    "description": ""
+                  }
+                ]
+              },
+              "description": "Round fraction output to at most this many digits. Defaults to two effective digits after the decimal point.",
+              "attribute": "maximum-fraction-digits"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "value",
+              "type": {
+                "text": "number | undefined",
+                "_sourceAliases": [],
+                "values": [
+                  {
+                    "value": "number",
+                    "description": ""
+                  }
+                ]
+              },
+              "description": "Optional byte count for values supplied by JavaScript or bound data.\nBy default, the component formats the element's text content, which also serves as the SSR fallback.\nWhen both are present, this property takes precedence.",
+              "fieldName": "value"
+            },
+            {
+              "name": "display",
+              "type": {
+                "text": "'decimal' | 'binary'",
+                "_sourceAliases": [
+                  "FormatBytesDisplay"
+                ],
+                "values": [
+                  {
+                    "value": "decimal",
+                    "description": ""
+                  },
+                  {
+                    "value": "binary",
+                    "description": ""
+                  }
+                ]
+              },
+              "default": "'decimal'",
+              "description": "Unit system: 'decimal' uses powers of 1000 and 'binary' uses powers of 1024.",
+              "fieldName": "display"
+            },
+            {
+              "name": "unit",
+              "type": {
+                "text": "'b' | 'kb' | 'mb' | 'gb' | 'tb' | 'pb' | undefined",
+                "_sourceAliases": [
+                  "FormatBytesUnit"
+                ],
+                "values": [
+                  {
+                    "value": "b",
+                    "description": ""
+                  },
+                  {
+                    "value": "kb",
+                    "description": ""
+                  },
+                  {
+                    "value": "mb",
+                    "description": ""
+                  },
+                  {
+                    "value": "gb",
+                    "description": ""
+                  },
+                  {
+                    "value": "tb",
+                    "description": ""
+                  },
+                  {
+                    "value": "pb",
+                    "description": ""
+                  }
+                ]
+              },
+              "description": "Optional unit magnitude. When omitted, the component selects a unit from the byte count.",
+              "fieldName": "unit"
+            },
+            {
+              "name": "unit-display",
+              "type": {
+                "text": "'short' | 'long'",
+                "_sourceAliases": [
+                  "FormatBytesUnitDisplay"
+                ],
+                "values": [
+                  {
+                    "value": "short",
+                    "description": ""
+                  },
+                  {
+                    "value": "long",
+                    "description": ""
+                  }
+                ]
+              },
+              "default": "'short'",
+              "description": "Unit label length: 'short' renders labels such as 'mb'; 'long' renders labels such as 'megabytes'.",
+              "fieldName": "unitDisplay"
+            },
+            {
+              "name": "locale",
+              "type": {
+                "text": "string | undefined",
+                "_sourceAliases": [],
+                "values": [
+                  {
+                    "value": "string",
+                    "description": ""
+                  }
+                ]
+              },
+              "description": "Language tag (such as en-US or de-DE) used to format the number.\nDefaults to document.documentElement.lang or the runtime default.",
+              "fieldName": "locale"
+            },
+            {
+              "name": "minimum-fraction-digits",
+              "type": {
+                "text": "number | undefined",
+                "_sourceAliases": [],
+                "values": [
+                  {
+                    "value": "number",
+                    "description": ""
+                  }
+                ]
+              },
+              "description": "Pad fraction output to at least this many digits.",
+              "fieldName": "minimumFractionDigits"
+            },
+            {
+              "name": "maximum-fraction-digits",
+              "type": {
+                "text": "number | undefined",
+                "_sourceAliases": [],
+                "values": [
+                  {
+                    "value": "number",
+                    "description": ""
+                  }
+                ]
+              },
+              "description": "Round fraction output to at most this many digits. Defaults to two effective digits after the decimal point.",
+              "fieldName": "maximumFractionDigits"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "nve-format-bytes",
+          "customElement": true,
+          "metadata": {
+            "unitTests": true,
+            "apiReview": true,
+            "performance": true,
+            "stable": true,
+            "vqa": true,
+            "responsive": true,
+            "themes": true,
+            "aria": "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/data",
+            "entrypoint": "@nvidia-elements/core/format-bytes",
+            "example": "<div nve-layout=\"column gap:sm\">\n  <nve-format-bytes>1024</nve-format-bytes>\n  <nve-format-bytes>1048576</nve-format-bytes>\n  <nve-format-bytes>1073741824</nve-format-bytes>\n</div>",
+            "package": true,
+            "documentation": "https://nvidia.github.io/elements/docs/elements/format-bytes/",
+            "since": "0.0.0",
+            "status": "stable",
+            "behavior": "content",
+            "markdown": "## nve-format-bytes\n\nFormats a byte count as localized, human-readable decimal or binary units.\n\n### Example\n\n```html\n<div nve-layout=\"column gap:sm\">\n  <nve-format-bytes>1024</nve-format-bytes>\n  <nve-format-bytes>1048576</nve-format-bytes>\n  <nve-format-bytes>1073741824</nve-format-bytes>\n</div>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/format-bytes/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | Numeric byte count to format (such as 1048576). Serves as fallback before hydration. |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| value | `number \\| undefined` | Optional byte count for values supplied by JavaScript or bound data. By default, the component formats the element's text content, which also serves as the SSR fallback. When both are present, this property takes precedence. |\n| display | `'decimal' \\| 'binary'` | Unit system: 'decimal' uses powers of 1000 and 'binary' uses powers of 1024. |\n| unit | `'b' \\| 'kb' \\| 'mb' \\| 'gb' \\| 'tb' \\| 'pb' \\| undefined` | Optional unit magnitude. When omitted, the component selects a unit from the byte count. |\n| unitDisplay (unit-display) | `'short' \\| 'long'` | Unit label length: 'short' renders labels such as 'mb'; 'long' renders labels such as 'megabytes'. |\n| locale | `string \\| undefined` | Language tag (such as en-US or de-DE) used to format the number. Defaults to document.documentElement.lang or the runtime default. |\n| minimumFractionDigits (minimum-fraction-digits) | `number \\| undefined` | Pad fraction output to at least this many digits. |\n| maximumFractionDigits (maximum-fraction-digits) | `number \\| undefined` | Round fraction output to at most this many digits. Defaults to two effective digits after the decimal point. |"
+          }
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "FormatBytes",
+          "declaration": {
+            "name": "FormatBytes",
+            "module": "/src/format-bytes/format-bytes.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "/src/format-bytes/index.js",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "module": "home/runner/work/elements/elements/projects/core/src/format-bytes/format-bytes.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "/src/format-datetime/define.js",
@@ -16513,13 +16886,13 @@
             "themes": true,
             "aria": "https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/progressbar_role",
             "entrypoint": "@nvidia-elements/core/gauge",
-            "example": "<div nve-layout=\"row gap:sm\">\n  <nve-gauge value=\"50\">50%</nve-gauge>\n  <nve-gauge status=\"accent\" value=\"66\">66%</nve-gauge>\n</div>",
+            "example": "<nve-gauge status=\"accent\" value=\"66\">66%</nve-gauge>",
             "package": true,
             "documentation": "https://nvidia.github.io/elements/docs/elements/gauge/",
             "since": "2.0.4",
             "status": "beta",
             "behavior": "content",
-            "markdown": "## nve-gauge\n\nUse a gauge to show system resource usage.\n\n### Example\n\n```html\n<div nve-layout=\"row gap:sm\">\n  <nve-gauge value=\"50\">50%</nve-gauge>\n  <nve-gauge status=\"accent\" value=\"66\">66%</nve-gauge>\n</div>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/gauge/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | Content to display in the gauge center. |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| value | `number` | The current `value` of the gauge. |\n| max | `number` | The `max` value of the gauge that the `value` is proportionally scaled to. |\n| status | `'accent' \\| 'warning' \\| 'success' \\| 'danger' \\| 'neutral' \\| undefined` | Four visual treatments represent the `status` of tasks. - `accent` Highlights important actions or draws attention to primary interactive elements. - `warning` Indicates cautionary actions that require careful consideration before proceeding. - `success` Represents positive outcomes, confirmations, or constructive actions. - `danger` Signals destructive or irreversible actions that need extra attention and confirmation. |\n| shape | `'half' \\| undefined` | Determines the gauge shape. Set `half` for a compact semi-circular arc. |\n| thumb | `'fill' \\| 'dot' \\| 'needle'` | Controls the value indicator. Set `dot` for only the end dot or `needle` for a pointer. |\n| size | `'sm' \\| 'md' \\| 'lg' \\| undefined` | Controls the visual scale of an element to match its importance and available space. - `sm` Compact size for dense layouts or secondary elements with less visual prominence. - `md` Standard size that works well in most contexts and provides balanced visibility. - `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. |\n| i18n |  | Enables updating internal string values for internationalization. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --track-width | `string` | [MDN](https://mdn.dev/CSS/width) |\n| --accent-color | `string` | [MDN](https://mdn.dev/CSS/accent-color) |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --needle-background | `string` |  |\n| --track-background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --thumb-background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --width | `string` | [MDN](https://mdn.dev/CSS/width) |\n| --height | `string` | [MDN](https://mdn.dev/CSS/height) |\n| --font-size | `string` | [MDN](https://mdn.dev/CSS/font-size) |\n| --gap | `string` | [MDN](https://mdn.dev/CSS/gap) |"
+            "markdown": "## nve-gauge\n\nUse a gauge to show system resource usage.\n\n### Example\n\n```html\n<nve-gauge status=\"accent\" value=\"66\">66%</nve-gauge>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/gauge/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | Content to display in the gauge center. |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| value | `number` | The current `value` of the gauge. |\n| max | `number` | The `max` value of the gauge that the `value` is proportionally scaled to. |\n| status | `'accent' \\| 'warning' \\| 'success' \\| 'danger' \\| 'neutral' \\| undefined` | Four visual treatments represent the `status` of tasks. - `accent` Highlights important actions or draws attention to primary interactive elements. - `warning` Indicates cautionary actions that require careful consideration before proceeding. - `success` Represents positive outcomes, confirmations, or constructive actions. - `danger` Signals destructive or irreversible actions that need extra attention and confirmation. |\n| shape | `'half' \\| undefined` | Determines the gauge shape. Set `half` for a compact semi-circular arc. |\n| thumb | `'fill' \\| 'dot' \\| 'needle'` | Controls the value indicator. Set `dot` for only the end dot or `needle` for a pointer. |\n| size | `'sm' \\| 'md' \\| 'lg' \\| undefined` | Controls the visual scale of an element to match its importance and available space. - `sm` Compact size for dense layouts or secondary elements with less visual prominence. - `md` Standard size that works well in most contexts and provides balanced visibility. - `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. |\n| i18n |  | Enables updating internal string values for internationalization. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --track-width | `string` | [MDN](https://mdn.dev/CSS/width) |\n| --accent-color | `string` | [MDN](https://mdn.dev/CSS/accent-color) |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --needle-background | `string` |  |\n| --track-background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --thumb-background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --width | `string` | [MDN](https://mdn.dev/CSS/width) |\n| --height | `string` | [MDN](https://mdn.dev/CSS/height) |\n| --font-size | `string` | [MDN](https://mdn.dev/CSS/font-size) |\n| --gap | `string` | [MDN](https://mdn.dev/CSS/gap) |"
           }
         }
       ],
@@ -30982,7 +31355,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "Displays real time updates without interrupting the user's workflow to communicate an important message or status. [MDN Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API)",
+          "description": "Displays real time updates without interrupting the user's workflow to communicate an important message or status.",
           "name": "Notification",
           "cssProperties": [
             {
@@ -31527,7 +31900,7 @@
             "since": "0.6.0",
             "status": "stable",
             "behavior": "popover",
-            "markdown": "## nve-notification\n\nDisplays real time updates without interrupting the user's workflow to communicate an important message or status. [MDN Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API)\n\n### Example\n\n```html\n<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```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/notification/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | The message communicated by the notification. |\n| icon | `string` | content slot for the status icon |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| anchor | property: `string \\| HTMLElement`; attribute: `string` | Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. |\n| position | `'center' \\| 'top' \\| 'bottom' \\| 'left' \\| 'right'` | Sets the side position of the popover relative to the provided anchor element. - `center` Centers the popover directly over the anchor element. - `top` Positions the popover above the anchor element. - `bottom` Positions the popover below the anchor element. - `left` Positions the popover to the left side of the anchor element. - `right` Positions the popover to the right side of the anchor element. |\n| alignment | `'start' \\| 'end' \\| 'center'` | Determines the alignment of the popover relative to the provided anchor element. - `start` Aligns the popover to the beginning edge of the anchor for left or top alignment. - `end` Aligns the popover to the ending edge of the anchor for right or bottom alignment. - `center` Centers the popover along the anchor's edge for balanced positioning. |\n| closable | `boolean` | Indicates whether the user can dismiss or close the element. - `true` The element displays a close control and the user can dismiss it. - `false` The user cannot close the element and must dismiss it programmatically. |\n| closeTimeout (close-timeout) | `number` | Sets the automatic dismissal time in milliseconds before the element emits a `close` event. Allow ~200-250ms per word for comfortable reading. - `0` Warning or error messages requiring immediate acknowledgment. - `3000` Brief success or confirmation messages. - `7000` Standard informational messages. - `10000` Messages with actions or requiring user decision. |\n| status | `'accent' \\| 'warning' \\| 'success' \\| 'danger'` | Communicates the intent and semantic meaning of an element to help users understand the outcome of their actions. - `accent` Highlights important actions or draws attention to primary interactive elements. - `warning` Indicates cautionary actions that require careful consideration before proceeding. - `success` Represents positive outcomes, confirmations, or constructive actions. - `danger` Signals destructive or irreversible actions that need extra attention and confirmation. |\n| container | `'flat' \\| undefined` | Flat container option applies when embedding within another containing element such as a drawer. |\n| i18n |  | Enables updating internal string values for internationalization. |\n| hidePopover |  |  |\n\n### Events\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| close | `CustomEvent` | Dispatched when the notification closes. |\n| beforetoggle | `CustomEvent` | Dispatched on a popover just before showing or hiding. [MDN](https://mdn.dev/HTMLElement/beforetoggle_event) |\n| toggle | `CustomEvent` | Dispatched on a popover element just after showing or hiding. [MDN](https://mdn.dev/HTMLElement/toggle_event) |\n| open | `CustomEvent` | Dispatched when the notification opens. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --border-radius | `string` | [MDN](https://mdn.dev/CSS/border-radius) |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --padding | `string` | [MDN](https://mdn.dev/CSS/padding) |\n| --box-shadow | `string` | [MDN](https://mdn.dev/CSS/box-shadow) |\n| --min-width | `string` | [MDN](https://mdn.dev/CSS/min-width) |\n| --width | `string` | [MDN](https://mdn.dev/CSS/width) |\n| --max-width | `string` | [MDN](https://mdn.dev/CSS/max-width) |\n| --border | `string` | [MDN](https://mdn.dev/CSS/border) |\n| --status-border | `string` |  |\n| --gap | `string` | [MDN](https://mdn.dev/CSS/gap) |\n| --status-color | `string` |  |\n| --animation-duration | `string` | Duration of notification open/close animations [MDN](https://mdn.dev/CSS/animation-duration) |"
+            "markdown": "## nve-notification\n\nDisplays real time updates without interrupting the user's workflow to communicate an important message or status.\n\n### Example\n\n```html\n<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```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/notification/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | The message communicated by the notification. |\n| icon | `string` | content slot for the status icon |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| anchor | property: `string \\| HTMLElement`; attribute: `string` | Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. |\n| position | `'center' \\| 'top' \\| 'bottom' \\| 'left' \\| 'right'` | Sets the side position of the popover relative to the provided anchor element. - `center` Centers the popover directly over the anchor element. - `top` Positions the popover above the anchor element. - `bottom` Positions the popover below the anchor element. - `left` Positions the popover to the left side of the anchor element. - `right` Positions the popover to the right side of the anchor element. |\n| alignment | `'start' \\| 'end' \\| 'center'` | Determines the alignment of the popover relative to the provided anchor element. - `start` Aligns the popover to the beginning edge of the anchor for left or top alignment. - `end` Aligns the popover to the ending edge of the anchor for right or bottom alignment. - `center` Centers the popover along the anchor's edge for balanced positioning. |\n| closable | `boolean` | Indicates whether the user can dismiss or close the element. - `true` The element displays a close control and the user can dismiss it. - `false` The user cannot close the element and must dismiss it programmatically. |\n| closeTimeout (close-timeout) | `number` | Sets the automatic dismissal time in milliseconds before the element emits a `close` event. Allow ~200-250ms per word for comfortable reading. - `0` Warning or error messages requiring immediate acknowledgment. - `3000` Brief success or confirmation messages. - `7000` Standard informational messages. - `10000` Messages with actions or requiring user decision. |\n| status | `'accent' \\| 'warning' \\| 'success' \\| 'danger'` | Communicates the intent and semantic meaning of an element to help users understand the outcome of their actions. - `accent` Highlights important actions or draws attention to primary interactive elements. - `warning` Indicates cautionary actions that require careful consideration before proceeding. - `success` Represents positive outcomes, confirmations, or constructive actions. - `danger` Signals destructive or irreversible actions that need extra attention and confirmation. |\n| container | `'flat' \\| undefined` | Flat container option applies when embedding within another containing element such as a drawer. |\n| i18n |  | Enables updating internal string values for internationalization. |\n| hidePopover |  |  |\n\n### Events\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| close | `CustomEvent` | Dispatched when the notification closes. |\n| beforetoggle | `CustomEvent` | Dispatched on a popover just before showing or hiding. [MDN](https://mdn.dev/HTMLElement/beforetoggle_event) |\n| toggle | `CustomEvent` | Dispatched on a popover element just after showing or hiding. [MDN](https://mdn.dev/HTMLElement/toggle_event) |\n| open | `CustomEvent` | Dispatched when the notification opens. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --border-radius | `string` | [MDN](https://mdn.dev/CSS/border-radius) |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --padding | `string` | [MDN](https://mdn.dev/CSS/padding) |\n| --box-shadow | `string` | [MDN](https://mdn.dev/CSS/box-shadow) |\n| --min-width | `string` | [MDN](https://mdn.dev/CSS/min-width) |\n| --width | `string` | [MDN](https://mdn.dev/CSS/width) |\n| --max-width | `string` | [MDN](https://mdn.dev/CSS/max-width) |\n| --border | `string` | [MDN](https://mdn.dev/CSS/border) |\n| --status-border | `string` |  |\n| --gap | `string` | [MDN](https://mdn.dev/CSS/gap) |\n| --status-color | `string` |  |\n| --animation-duration | `string` | Duration of notification open/close animations [MDN](https://mdn.dev/CSS/animation-duration) |"
           }
         }
       ],
@@ -47432,7 +47805,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "A contextual popup that displays a status. Toasts are [triggered](https://w3c.github.io/aria/#tooltip) by clicking, focusing, or tapping an element and cannot have interactive elements within them. [MDN Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API)",
+          "description": "A contextual popup that displays a status. Toasts are [triggered](https://w3c.github.io/aria/#tooltip) by clicking, focusing, or tapping an element and cannot have interactive elements within them.",
           "name": "Toast",
           "cssProperties": [
             {
@@ -47950,7 +48323,7 @@
             "since": "0.6.0",
             "status": "stable",
             "behavior": "popover",
-            "markdown": "## nve-toast\n\nA contextual popup that displays a status. Toasts are [triggered](https://w3c.github.io/aria/#tooltip) by clicking, focusing, or tapping an element and cannot have interactive elements within them. [MDN Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API)\n\n### Example\n\n```html\n<nve-toast id=\"toast\" close-timeout=\"1500\">hello there</nve-toast>\n<nve-button popovertarget=\"toast\">button</nve-button>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/toast/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | The message communicated by the toast. |\n| prefix | `string` | custom status icon slot |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| anchor | property: `string \\| HTMLElement`; attribute: `string` | Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. |\n| position | `'center' \\| 'top' \\| 'bottom' \\| 'left' \\| 'right'` | Sets the side position of the popover relative to the provided anchor element. - `center` Centers the popover directly over the anchor element. - `top` Positions the popover above the anchor element. - `bottom` Positions the popover below the anchor element. - `left` Positions the popover to the left side of the anchor element. - `right` Positions the popover to the right side of the anchor element. |\n| alignment | `'start' \\| 'end' \\| 'center'` | Determines the alignment of the popover relative to the provided anchor element. - `start` Aligns the popover to the beginning edge of the anchor for left or top alignment. - `end` Aligns the popover to the ending edge of the anchor for right or bottom alignment. - `center` Centers the popover along the anchor's edge for balanced positioning. |\n| prominence | `'muted'` | Sets the visual prominence of the toast. |\n| closable | `boolean` | Indicates whether the user can dismiss or close the element. - `true` The element displays a close control and the user can dismiss it. - `false` The user cannot close the element and must dismiss it programmatically. |\n| closeTimeout (close-timeout) | `number` | Sets the automatic dismissal time in milliseconds before the element emits a `close` event. Allow ~200-250ms per word for comfortable reading. - `0` Warning or error messages requiring immediate acknowledgment. - `3000` Brief success or confirmation messages. - `7000` Standard informational messages. - `10000` Messages with actions or requiring user decision. |\n| status | `'accent' \\| 'warning' \\| 'success' \\| 'danger'` | Communicates the intent and semantic meaning of an element to help users understand the outcome of their actions. - `accent` Highlights important actions or draws attention to primary interactive elements. - `warning` Indicates cautionary actions that require careful consideration before proceeding. - `success` Represents positive outcomes, confirmations, or constructive actions. - `danger` Signals destructive or irreversible actions that need extra attention and confirmation. |\n| i18n |  | Updates internal string values for internationalization. |\n\n### Events\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| beforetoggle | `CustomEvent` | Dispatched on a popover just before showing or hiding. [MDN](https://mdn.dev/HTMLElement/beforetoggle_event) |\n| toggle | `CustomEvent` | Dispatched on a popover element just after showing or hiding. [MDN](https://mdn.dev/HTMLElement/toggle_event) |\n| open | `CustomEvent` | Dispatched when the toast opens. |\n| close | `CustomEvent` | Dispatched when the toast closes. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --padding | `string` | [MDN](https://mdn.dev/CSS/padding) |\n| --justify-content | `string` | [MDN](https://mdn.dev/CSS/justify-content) |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --border-radius | `string` | [MDN](https://mdn.dev/CSS/border-radius) |\n| --border | `string` | [MDN](https://mdn.dev/CSS/border) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --font-size | `string` | [MDN](https://mdn.dev/CSS/font-size) |\n| --font-weight | `string` | [MDN](https://mdn.dev/CSS/font-weight) |\n| --box-shadow | `string` | [MDN](https://mdn.dev/CSS/box-shadow) |\n| --gap | `string` | [MDN](https://mdn.dev/CSS/gap) |\n| --animation-duration | `string` | Duration of toast open/close animations [MDN](https://mdn.dev/CSS/animation-duration) |"
+            "markdown": "## nve-toast\n\nA contextual popup that displays a status. Toasts are [triggered](https://w3c.github.io/aria/#tooltip) by clicking, focusing, or tapping an element and cannot have interactive elements within them.\n\n### Example\n\n```html\n<nve-toast id=\"toast\" close-timeout=\"1500\">hello there</nve-toast>\n<nve-button popovertarget=\"toast\">button</nve-button>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/toast/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | The message communicated by the toast. |\n| prefix | `string` | custom status icon slot |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| anchor | property: `string \\| HTMLElement`; attribute: `string` | Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. |\n| position | `'center' \\| 'top' \\| 'bottom' \\| 'left' \\| 'right'` | Sets the side position of the popover relative to the provided anchor element. - `center` Centers the popover directly over the anchor element. - `top` Positions the popover above the anchor element. - `bottom` Positions the popover below the anchor element. - `left` Positions the popover to the left side of the anchor element. - `right` Positions the popover to the right side of the anchor element. |\n| alignment | `'start' \\| 'end' \\| 'center'` | Determines the alignment of the popover relative to the provided anchor element. - `start` Aligns the popover to the beginning edge of the anchor for left or top alignment. - `end` Aligns the popover to the ending edge of the anchor for right or bottom alignment. - `center` Centers the popover along the anchor's edge for balanced positioning. |\n| prominence | `'muted'` | Sets the visual prominence of the toast. |\n| closable | `boolean` | Indicates whether the user can dismiss or close the element. - `true` The element displays a close control and the user can dismiss it. - `false` The user cannot close the element and must dismiss it programmatically. |\n| closeTimeout (close-timeout) | `number` | Sets the automatic dismissal time in milliseconds before the element emits a `close` event. Allow ~200-250ms per word for comfortable reading. - `0` Warning or error messages requiring immediate acknowledgment. - `3000` Brief success or confirmation messages. - `7000` Standard informational messages. - `10000` Messages with actions or requiring user decision. |\n| status | `'accent' \\| 'warning' \\| 'success' \\| 'danger'` | Communicates the intent and semantic meaning of an element to help users understand the outcome of their actions. - `accent` Highlights important actions or draws attention to primary interactive elements. - `warning` Indicates cautionary actions that require careful consideration before proceeding. - `success` Represents positive outcomes, confirmations, or constructive actions. - `danger` Signals destructive or irreversible actions that need extra attention and confirmation. |\n| i18n |  | Updates internal string values for internationalization. |\n\n### Events\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| beforetoggle | `CustomEvent` | Dispatched on a popover just before showing or hiding. [MDN](https://mdn.dev/HTMLElement/beforetoggle_event) |\n| toggle | `CustomEvent` | Dispatched on a popover element just after showing or hiding. [MDN](https://mdn.dev/HTMLElement/toggle_event) |\n| open | `CustomEvent` | Dispatched when the toast opens. |\n| close | `CustomEvent` | Dispatched when the toast closes. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --padding | `string` | [MDN](https://mdn.dev/CSS/padding) |\n| --justify-content | `string` | [MDN](https://mdn.dev/CSS/justify-content) |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --border-radius | `string` | [MDN](https://mdn.dev/CSS/border-radius) |\n| --border | `string` | [MDN](https://mdn.dev/CSS/border) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --font-size | `string` | [MDN](https://mdn.dev/CSS/font-size) |\n| --font-weight | `string` | [MDN](https://mdn.dev/CSS/font-weight) |\n| --box-shadow | `string` | [MDN](https://mdn.dev/CSS/box-shadow) |\n| --gap | `string` | [MDN](https://mdn.dev/CSS/gap) |\n| --animation-duration | `string` | Duration of toast open/close animations [MDN](https://mdn.dev/CSS/animation-duration) |"
           }
         }
       ],
@@ -48887,7 +49260,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "A contextual popup that displays a plaintext description. Tooltips are [triggered](https://w3c.github.io/aria/#tooltip) by hovering, focusing, or tapping an element and cannot have interactive elements within them. [MDN Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API)",
+          "description": "A contextual popup that displays a plaintext description. Trigger tooltips by hovering, focusing, or tapping an element and cannot have interactive elements within them.",
           "name": "Tooltip",
           "cssProperties": [
             {
@@ -49275,7 +49648,7 @@
             "since": "0.6.0",
             "status": "stable",
             "behavior": "popover",
-            "markdown": "## nve-tooltip\n\nA contextual popup that displays a plaintext description. Tooltips are [triggered](https://w3c.github.io/aria/#tooltip) by hovering, focusing, or tapping an element and cannot have interactive elements within them. [MDN Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API)\n\n### Example\n\n```html\n<nve-tooltip id=\"tooltip\">hello there</nve-tooltip>\n<nve-button interestfor=\"tooltip\">button</nve-button>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/tooltip/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | Noninteractive text or other descriptive content shown in the tooltip. |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| anchor | property: `string \\| HTMLElement`; attribute: `string` | Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. |\n| position | `'center' \\| 'top' \\| 'bottom' \\| 'left' \\| 'right'` | Sets the side position of the popover relative to the provided anchor element. - `center` Centers the popover directly over the anchor element. - `top` Positions the popover above the anchor element. - `bottom` Positions the popover below the anchor element. - `left` Positions the popover to the left side of the anchor element. - `right` Positions the popover to the right side of the anchor element. |\n| alignment | `'start' \\| 'end' \\| 'center'` | Determines the alignment of the popover relative to the provided anchor element. - `start` Aligns the popover to the beginning edge of the anchor for left or top alignment. - `end` Aligns the popover to the ending edge of the anchor for right or bottom alignment. - `center` Centers the popover along the anchor's edge for balanced positioning. |\n| status | `'muted'` | visual treatment to represent a ongoing task or support status |\n\n### Events\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| beforetoggle | `CustomEvent` | Dispatched on a popover just before showing or hiding. [MDN](https://mdn.dev/HTMLElement/beforetoggle_event) |\n| toggle | `CustomEvent` | Dispatched on a popover element just after showing or hiding. [MDN](https://mdn.dev/HTMLElement/toggle_event) |\n| open | `CustomEvent` | Dispatched when the tooltip opens. |\n| close | `CustomEvent` | Dispatched when the tooltip closes. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --border-radius | `string` | [MDN](https://mdn.dev/CSS/border-radius) |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --padding | `string` | [MDN](https://mdn.dev/CSS/padding) |\n| --box-shadow | `string` | [MDN](https://mdn.dev/CSS/box-shadow) |\n| --font-size | `string` | [MDN](https://mdn.dev/CSS/font-size) |\n| --font-weight | `string` | [MDN](https://mdn.dev/CSS/font-weight) |\n| --arrow-transform | `string` |  |\n| --width | `string` | [MDN](https://mdn.dev/CSS/width) |\n| --height | `string` | [MDN](https://mdn.dev/CSS/height) |\n| --border | `string` | [MDN](https://mdn.dev/CSS/border) |\n| --animation-duration | `string` | Duration of tooltip open/close animations [MDN](https://mdn.dev/CSS/animation-duration) |"
+            "markdown": "## nve-tooltip\n\nA contextual popup that displays a plaintext description. Trigger tooltips by hovering, focusing, or tapping an element and cannot have interactive elements within them.\n\n### Example\n\n```html\n<nve-tooltip id=\"tooltip\">hello there</nve-tooltip>\n<nve-button interestfor=\"tooltip\">button</nve-button>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/tooltip/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | Noninteractive text or other descriptive content shown in the tooltip. |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| anchor | property: `string \\| HTMLElement`; attribute: `string` | Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. |\n| position | `'center' \\| 'top' \\| 'bottom' \\| 'left' \\| 'right'` | Sets the side position of the popover relative to the provided anchor element. - `center` Centers the popover directly over the anchor element. - `top` Positions the popover above the anchor element. - `bottom` Positions the popover below the anchor element. - `left` Positions the popover to the left side of the anchor element. - `right` Positions the popover to the right side of the anchor element. |\n| alignment | `'start' \\| 'end' \\| 'center'` | Determines the alignment of the popover relative to the provided anchor element. - `start` Aligns the popover to the beginning edge of the anchor for left or top alignment. - `end` Aligns the popover to the ending edge of the anchor for right or bottom alignment. - `center` Centers the popover along the anchor's edge for balanced positioning. |\n| status | `'muted'` | visual treatment to represent a ongoing task or support status |\n\n### Events\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| beforetoggle | `CustomEvent` | Dispatched on a popover just before showing or hiding. [MDN](https://mdn.dev/HTMLElement/beforetoggle_event) |\n| toggle | `CustomEvent` | Dispatched on a popover element just after showing or hiding. [MDN](https://mdn.dev/HTMLElement/toggle_event) |\n| open | `CustomEvent` | Dispatched when the tooltip opens. |\n| close | `CustomEvent` | Dispatched when the tooltip closes. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --border-radius | `string` | [MDN](https://mdn.dev/CSS/border-radius) |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --padding | `string` | [MDN](https://mdn.dev/CSS/padding) |\n| --box-shadow | `string` | [MDN](https://mdn.dev/CSS/box-shadow) |\n| --font-size | `string` | [MDN](https://mdn.dev/CSS/font-size) |\n| --font-weight | `string` | [MDN](https://mdn.dev/CSS/font-weight) |\n| --arrow-transform | `string` |  |\n| --width | `string` | [MDN](https://mdn.dev/CSS/width) |\n| --height | `string` | [MDN](https://mdn.dev/CSS/height) |\n| --border | `string` | [MDN](https://mdn.dev/CSS/border) |\n| --animation-duration | `string` | Duration of tooltip open/close animations [MDN](https://mdn.dev/CSS/animation-duration) |"
           }
         }
       ],