@nvidia-elements/core 2.15.5 → 2.17.0

package/dist/data.html.json

@@ -2710,6 +2710,11 @@
           "description": "Controls the visual scale of an element to match its importance and available space.\n- `sm` Compact size for dense layouts or secondary elements with less visual prominence.\n\n- `md` Standard size that works well in most contexts and provides balanced visibility.\n\n- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts.",
           "values": [{ "name": "sm" }, { "name": "md" }, { "name": "lg" }]
         },
+        {
+          "name": "appearance",
+          "description": "Selects the outline or solid form of the named icon. Solid icons use an optional `-solid` asset and fall back to\nthe outline form when that asset is unavailable.",
+          "values": [{ "name": "outline" }, { "name": "solid" }]
+        },
         {
           "name": "container",
           "description": "Determines the container of the button. Flat suits nesting within other containers or more muted style. Inline suits inline content such as text.",
@@ -3140,6 +3145,17 @@
         }
       ]
     },
+    {
+      "name": "nve-iframe",
+      "description": "An iframe component that syncs with the parent document's theme and template content. Use when needing to render dynamically generated or isolated content.\n---\n\n\n### **Slots:**\n - _default_ - A template containing the iframe body content.\n- **head** - A template containing content inserted into the iframe head.\n\n### **CSS Properties:**\n - **--border** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border) _(default: undefined)_\n- **--width** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/width) _(default: undefined)_\n- **--height** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/height) _(default: undefined)_",
+      "attributes": [{ "name": "aria-label", "values": [] }],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://nvidia.github.io/elements/docs/elements/iframe/"
+        }
+      ]
+    },
     {
       "name": "nve-input-group",
       "description": "Visually combines many related input controls into a unified composite field with shared styling.\n---\n\n\n### **Slots:**\n - _default_ - Control input elements\n\n### **CSS Properties:**\n - **--background** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/background) _(default: undefined)_\n- **--color** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/color) _(default: undefined)_\n- **--border-radius** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius) _(default: undefined)_\n- **--gap** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/gap) _(default: undefined)_\n- **--border** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border) _(default: undefined)_\n- **--padding** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/padding) _(default: undefined)_\n- **--label-color** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/color) _(default: undefined)_\n- **--label-text-transform** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-transform) _(default: undefined)_\n- **--label-font-weight** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight) _(default: undefined)_\n- **--label-font-size** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/font-size) _(default: undefined)_",
@@ -4112,6 +4128,32 @@
         }
       ]
     },
+    {
+      "name": "nve-progress-dot",
+      "description": "An inline visual indicator that shows the progress of an ongoing task with an unknown completion percentage.\n---\n\n\n### **CSS Properties:**\n - **--color** - Dot color. Defaults to the inherited text color. [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/color) _(default: undefined)_\n- **--width** - Indicator width. [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/width) _(default: undefined)_\n- **--height** - Indicator height. [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/height) _(default: undefined)_\n- **--animation-duration** - Duration of one animation cycle. Set to 0s for static dots. [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-duration) _(default: undefined)_",
+      "attributes": [
+        {
+          "name": "size",
+          "description": "Controls the visual scale of an element to match its importance and available space.\n- `sm` Compact size for dense layouts or secondary elements with less visual prominence.\n\n- `md` Standard size that works well in most contexts and provides balanced visibility.\n\n- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts.",
+          "values": [{ "name": "sm" }, { "name": "md" }, { "name": "lg" }]
+        },
+        {
+          "name": "i18n",
+          "description": "Enables updating the default loading label for internationalization.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "WAI-ARIA Reference",
+          "url": "https://www.w3.org/TR/wai-aria-1.2/#progressbar"
+        },
+        {
+          "name": "Documentation",
+          "url": "https://nvidia.github.io/elements/docs/elements/progress-dot/"
+        }
+      ]
+    },
     {
       "name": "nve-progress-ring",
       "description": "The `progress-ring` component shows the status of a pending task. It also serves the basis of the page loading element.\n---\n\n\n### **Slots:**\n - _default_ - Content to display in the ring center. Defaults to a status icon.\n\n### **CSS Properties:**\n - **--background-color** -  _(default: undefined)_\n- **--ring-color** -  _(default: undefined)_\n- **--ring-background-opacity** -  _(default: undefined)_\n- **--ring-width** -  _(default: undefined)_\n- **--width** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/width) _(default: undefined)_\n- **--height** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/height) _(default: undefined)_\n- **--animation-duration** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-duration) _(default: undefined)_\n- **--color** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/color) _(default: undefined)_\n\n### **CSS Parts:**\n - **icon** - The icon element",

package/dist/date/date2.js

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

package/dist/datetime/datetime2.js

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

package/dist/dialog/dialog-footer2.js

@@ -11,7 +11,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-dialog-footer",
-			version: "2.15.5",
+			version: "2.17.0",
 			parents: ["nve-dialog"]
 		};
 	}

package/dist/dialog/dialog-header2.js

@@ -11,7 +11,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-dialog-header",
-			version: "2.15.5",
+			version: "2.17.0",
 			parents: ["nve-dialog"]
 		};
 	}

package/dist/dialog/dialog2.js

@@ -30,7 +30,7 @@ var h = class extends f {
 	static {
 		this.metadata = {
 			tag: "nve-dialog",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	static {

package/dist/divider/divider2.js

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

package/dist/dot/dot2.js

@@ -16,7 +16,7 @@ var l = class extends o {
 	static {
 		this.metadata = {
 			tag: "nve-dot",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	render() {

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

@@ -13,7 +13,7 @@ var c = class extends s(a) {
 	static {
 		this.metadata = {
 			tag: "nve-drag-handle",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	static {

package/dist/drawer/drawer-content2.js

@@ -11,7 +11,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-drawer-content",
-			version: "2.15.5",
+			version: "2.17.0",
 			parents: ["nve-drawer"]
 		};
 	}

package/dist/drawer/drawer-footer2.js

@@ -11,7 +11,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-drawer-footer",
-			version: "2.15.5",
+			version: "2.17.0",
 			parents: ["nve-drawer"]
 		};
 	}

package/dist/drawer/drawer-header2.js

@@ -11,7 +11,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-drawer-header",
-			version: "2.15.5",
+			version: "2.17.0",
 			parents: ["nve-drawer"]
 		};
 	}

package/dist/drawer/drawer2.js

@@ -30,7 +30,7 @@ var p = class extends u {
 	static {
 		this.metadata = {
 			tag: "nve-drawer",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	static {

package/dist/dropdown/dropdown-footer2.js

@@ -11,7 +11,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-dropdown-footer",
-			version: "2.15.5",
+			version: "2.17.0",
 			parents: ["nve-dropdown"]
 		};
 	}

package/dist/dropdown/dropdown-header2.js

@@ -11,7 +11,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-dropdown-header",
-			version: "2.15.5",
+			version: "2.17.0",
 			parents: ["nve-dropdown"]
 		};
 	}

package/dist/dropdown/dropdown2.js

@@ -21,7 +21,7 @@ var p = class extends l {
 	static {
 		this.metadata = {
 			tag: "nve-dropdown",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	static {

package/dist/dropdown-group/dropdown-group.js

@@ -14,7 +14,7 @@ var d = class extends c {
 	static {
 		this.metadata = {
 			tag: "nve-dropdown-group",
-			version: "2.15.5",
+			version: "2.17.0",
 			children: ["nve-dropdown"]
 		};
 	}

package/dist/dropzone/dropzone2.js

@@ -20,7 +20,7 @@ var g = class extends m(d) {
 	static {
 		this.metadata = {
 			tag: "nve-dropzone",
-			version: "2.15.5",
+			version: "2.17.0",
 			validators: [l, c],
 			valueSchema: {
 				type: "array",

package/dist/file/file2.js

@@ -11,7 +11,7 @@ var a = class extends n {
 	static {
 		this.metadata = {
 			tag: "nve-file",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	connectedCallback() {

package/dist/format-bytes/format-bytes2.js

@@ -95,7 +95,7 @@ var g = class extends a {
 	static {
 		this.metadata = {
 			tag: "nve-format-bytes",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	get #e() {

package/dist/format-datetime/format-datetime2.js

@@ -13,7 +13,7 @@ var c = class extends a {
 	static {
 		this.metadata = {
 			tag: "nve-format-datetime",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	get #e() {

package/dist/format-number/format-number2.js

@@ -29,7 +29,7 @@ var c = [
 	static {
 		this.metadata = {
 			tag: "nve-format-number",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	get #e() {

package/dist/format-relative-time/format-relative-time2.js

@@ -53,7 +53,7 @@ var c = {
 	static {
 		this.metadata = {
 			tag: "nve-format-relative-time",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	#e;

package/dist/format-truncate/format-truncate2.js

@@ -19,7 +19,7 @@ var d = class extends c {
 	static {
 		this.metadata = {
 			tag: "nve-format-truncate",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	#e;

package/dist/forms/control/control2.js

@@ -48,7 +48,7 @@ var C = class extends v {
 	static {
 		this.metadata = {
 			tag: "nve-control",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	render() {

package/dist/forms/control-group/control-group2.js

@@ -24,7 +24,7 @@ var m = class extends d {
 	static {
 		this.metadata = {
 			tag: "nve-control-group",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	render() {

package/dist/forms/control-message/control-message2.js

@@ -23,7 +23,7 @@ var l = {
 	static {
 		this.metadata = {
 			tag: "nve-control-message",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	static {

package/dist/gauge/gauge2.js

@@ -40,7 +40,7 @@ var l = {
 	static {
 		this.metadata = {
 			tag: "nve-gauge",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	#e;

package/dist/grid/cell/cell2.js

@@ -10,7 +10,7 @@ var a = class extends r {
 	static {
 		this.metadata = {
 			tag: "nve-grid-cell",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	render() {

package/dist/grid/column/column2.js

@@ -13,7 +13,7 @@ var c = class r extends a {
 	static {
 		this.metadata = {
 			tag: "nve-grid-column",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	get #e() {

package/dist/grid/footer/footer2.js

@@ -15,7 +15,7 @@ var s = class extends a {
 	static {
 		this.metadata = {
 			tag: "nve-grid-footer",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	static {

package/dist/grid/grid2.js

@@ -23,7 +23,7 @@ var y = class extends g {
 	static {
 		this.metadata = {
 			tag: "nve-grid",
-			version: "2.15.5",
+			version: "2.17.0",
 			children: [
 				d.metadata.tag,
 				f.metadata.tag,

package/dist/grid/header/header2.js

@@ -19,7 +19,7 @@ var m = class extends d {
 	static {
 		this.metadata = {
 			tag: "nve-grid-header",
-			version: "2.15.5",
+			version: "2.17.0",
 			children: [c.metadata.tag]
 		};
 	}

package/dist/grid/placeholder/placeholder2.js

@@ -10,7 +10,7 @@ var a = class extends r {
 	static {
 		this.metadata = {
 			tag: "nve-grid-placeholder",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	render() {

package/dist/grid/row/row2.js

@@ -15,7 +15,7 @@ var u = class extends s {
 	static {
 		this.metadata = {
 			tag: "nve-grid-row",
-			version: "2.15.5",
+			version: "2.17.0",
 			children: [a.metadata.tag]
 		};
 	}

package/dist/icon/icon2.js

@@ -16,7 +16,7 @@ var f = class e extends o {
 	static {
 		this.metadata = {
 			tag: "nve-icon",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	static {
@@ -103,7 +103,7 @@ a([l({
 })], f.prototype, "name", void 0), a([d()], f.prototype, "svg", void 0);
 function p(t) {
 	if (typeof globalThis.customElements?.get == "function") {
-		let n = e(t.metadata.version), i = e("2.15.5");
+		let n = e(t.metadata.version), i = e("2.17.0");
 		n.minor <= i.minor && n.major <= i.major && (t._icons = {
 			...t._icons,
 			...r

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

@@ -35,6 +35,11 @@ export declare class IconButton extends Button {
      * Sets size of the icon button.
      */
     size?: Size;
+    /**
+     * Selects the outline or solid form of the named icon. Solid icons use an optional `-solid` asset and fall back to
+     * the outline form when that asset is unavailable.
+     */
+    appearance?: 'outline' | 'solid';
     static styles: import("lit").CSSResult[];
     static readonly metadata: {
         tag: string;

package/dist/icon-button/icon-button2.js

@@ -15,14 +15,14 @@ var l = class extends a {
 	static {
 		this.metadata = {
 			tag: "nve-icon-button",
-			version: "2.15.5"
+			version: "2.17.0"
 		};
 	}
 	static {
 		this.elementDefinitions = { [i.metadata.tag]: i };
 	}
 	render() {
-		return s`<div internal-host interaction-state focus-within aria-hidden="true"><slot @slotchange="${(t) => e(t.target)}"><nve-icon .name="${this.iconName}" .direction="${this.direction}" .size="${this.size}" aria-hidden="true" part="icon"></nve-icon></slot></div><slot name="anchor"></slot>`;
+		return s`<div internal-host interaction-state focus-within aria-hidden="true"><slot @slotchange="${(t) => e(t.target)}"><nve-icon .name="${this.iconName}" .appearance="${this.appearance}" .direction="${this.direction}" .size="${this.size}" aria-hidden="true" part="icon"></nve-icon></slot></div><slot name="anchor"></slot>`;
 	}
 };
 r([c({
@@ -34,7 +34,7 @@ r([c({
 })], l.prototype, "direction", void 0), r([c({
 	type: String,
 	reflect: !0
-})], l.prototype, "size", void 0), l = r([t()], l);
+})], l.prototype, "size", void 0), r([c({ type: String })], l.prototype, "appearance", void 0), l = r([t()], l);
 //#endregion
 export { l as IconButton };
 

package/dist/icon-button/icon-button2.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon-button2.js","names":[],"sources":["../../src/icon-button/icon-button.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport type { Size } from '@nvidia-elements/core/internal';\nimport { removeEmptySlotWhitespace, scopedRegistry, useStyles } from '@nvidia-elements/core/internal';\nimport { Button } from '@nvidia-elements/core/button';\nimport type { IconName } from '@nvidia-elements/core/icon';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport styles from './icon-button.css?inline';\n\n/**\n * @element nve-icon-button\n * @description An icon button is a button that displays only an icon without a visual label.\n * @documentation https://nvidia.github.io/elements/docs/elements/icon-button/\n * @since 0.2.1\n * @entrypoint \\@nvidia-elements/core/icon-button\n * @slot - default slot for custom icons\n * @cssprop --border-radius\n * @cssprop --padding\n * @cssprop --line-height\n * @cssprop --gap\n * @cssprop --height\n * @cssprop --width\n * @cssprop --font-size\n * @cssprop --color\n * @cssprop --background\n * @csspart icon - The icon element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/button/\n */\n@scopedRegistry()\nexport class IconButton extends Button {\n  /**\n   * Sets the icon name, which determines which icon to display.\n   */\n  @property({ type: String, attribute: 'icon-name' }) iconName: IconName;\n\n  /**\n   * Sets the direction of the icon.\n   * Only supported by expand-panel/collapse-panel (horizontal axis) and arrow/caret/chevron icons (4-directions)\n   */\n  @property({ type: String, reflect: true }) direction: 'up' | 'down' | 'left' | 'right';\n\n  /**\n   * Sets size of the icon button.\n   */\n  @property({ type: String, reflect: true }) size?: Size;\n\n  static styles = useStyles([...Button.styles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-icon-button',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon\n  };\n\n  render() {\n    return html`\n      <div internal-host interaction-state focus-within aria-hidden=\"true\">\n        <slot @slotchange=${(e: Event) => removeEmptySlotWhitespace(e.target as HTMLSlotElement)}>\n          <nve-icon .name=${this.iconName} .direction=${this.direction} .size=${this.size} aria-hidden=\"true\" part=\"icon\"></nve-icon>\n        </slot>\n      </div>\n      <slot name=\"anchor\"></slot>\n    `;\n  }\n}\n"],"mappings":";;;;;;;;;;AAgCO,IAAM,IAAN,cAAyB,EAAO;;EAiBrB,KAAA,SAAA,EAAU,CAAC,GAAG,EAAO,QAAQ,CAAM,CAAC;;;EAEzB,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;;EAE4B,KAAA,qBAAA,GACzB,EAAK,SAAS,MAAM,EACvB;;CAEA,SAAS;EACP,OAAO,CAAI,4FAEc,MAAa,EAA0B,EAAE,MAAyB,EAAE,qBACrE,KAAK,SAAS,gBAAc,KAAK,UAAU,WAAS,KAAK,KAAK;CAKxF;AACF;AAlCG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,WAAW;AAAY,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,GAMjD,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,GAKxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GAhB1C,IAAA,EAAA,CAAA,EAAe,CAAA,GAAA,CAAA"}
+{"version":3,"file":"icon-button2.js","names":[],"sources":["../../src/icon-button/icon-button.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport type { Size } from '@nvidia-elements/core/internal';\nimport { removeEmptySlotWhitespace, scopedRegistry, useStyles } from '@nvidia-elements/core/internal';\nimport { Button } from '@nvidia-elements/core/button';\nimport type { IconName } from '@nvidia-elements/core/icon';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport styles from './icon-button.css?inline';\n\n/**\n * @element nve-icon-button\n * @description An icon button is a button that displays only an icon without a visual label.\n * @documentation https://nvidia.github.io/elements/docs/elements/icon-button/\n * @since 0.2.1\n * @entrypoint \\@nvidia-elements/core/icon-button\n * @slot - default slot for custom icons\n * @cssprop --border-radius\n * @cssprop --padding\n * @cssprop --line-height\n * @cssprop --gap\n * @cssprop --height\n * @cssprop --width\n * @cssprop --font-size\n * @cssprop --color\n * @cssprop --background\n * @csspart icon - The icon element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/button/\n */\n@scopedRegistry()\nexport class IconButton extends Button {\n  /**\n   * Sets the icon name, which determines which icon to display.\n   */\n  @property({ type: String, attribute: 'icon-name' }) iconName: IconName;\n\n  /**\n   * Sets the direction of the icon.\n   * Only supported by expand-panel/collapse-panel (horizontal axis) and arrow/caret/chevron icons (4-directions)\n   */\n  @property({ type: String, reflect: true }) direction: 'up' | 'down' | 'left' | 'right';\n\n  /**\n   * Sets size of the icon button.\n   */\n  @property({ type: String, reflect: true }) size?: Size;\n\n  /**\n   * Selects the outline or solid form of the named icon. Solid icons use an optional `-solid` asset and fall back to\n   * the outline form when that asset is unavailable.\n   */\n  @property({ type: String }) appearance?: 'outline' | 'solid';\n\n  static styles = useStyles([...Button.styles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-icon-button',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon\n  };\n\n  render() {\n    return html`\n      <div internal-host interaction-state focus-within aria-hidden=\"true\">\n        <slot @slotchange=${(e: Event) => removeEmptySlotWhitespace(e.target as HTMLSlotElement)}>\n          <nve-icon .name=${this.iconName} .appearance=${this.appearance} .direction=${this.direction} .size=${this.size} aria-hidden=\"true\" part=\"icon\"></nve-icon>\n        </slot>\n      </div>\n      <slot name=\"anchor\"></slot>\n    `;\n  }\n}\n"],"mappings":";;;;;;;;;;AAgCO,IAAM,IAAN,cAAyB,EAAO;;EAuBrB,KAAA,SAAA,EAAU,CAAC,GAAG,EAAO,QAAQ,CAAM,CAAC;;;EAEzB,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;;EAE4B,KAAA,qBAAA,GACzB,EAAK,SAAS,MAAM,EACvB;;CAEA,SAAS;EACP,OAAO,CAAI,4FAEc,MAAa,EAA0B,EAAE,MAAyB,EAAE,qBACrE,KAAK,SAAS,iBAAe,KAAK,WAAW,gBAAc,KAAK,UAAU,WAAS,KAAK,KAAK;CAKvH;AACF;AAxCG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,WAAW;AAAY,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,GAMjD,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,GAKxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GAMxC,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,cAAA,KAAA,CAAA,GAtB3B,IAAA,EAAA,CAAA,EAAe,CAAA,GAAA,CAAA"}

package/dist/iframe/define.d.ts

@@ -0,0 +1,6 @@
+import { Iframe } from './iframe.js';
+declare global {
+    interface HTMLElementTagNameMap {
+        'nve-iframe': Iframe;
+    }
+}

package/dist/iframe/define.js

@@ -0,0 +1,7 @@
+import { define as e } from "../internal/utils/dom.js";
+import { Iframe as t } from "./iframe2.js";
+//#region src/iframe/define.ts
+e(t);
+//#endregion
+
+//# sourceMappingURL=define.js.map

package/dist/iframe/define.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"define.js","names":[],"sources":["../../src/iframe/define.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { define } from '@nvidia-elements/core/internal';\nimport { Iframe } from './iframe.js';\n\ndefine(Iframe);\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nve-iframe': Iframe;\n  }\n}\n"],"mappings":";;;AAMA,EAAO,CAAM"}

package/dist/iframe/iframe.d.ts

@@ -0,0 +1,28 @@
+import { LitElement, type PropertyValues } from 'lit';
+/**
+ * @element nve-iframe
+ * @description An iframe component that syncs with the parent document's theme and template content. Use when needing to render dynamically generated or isolated content.
+ * @since 0.0.0
+ * @entrypoint \@nvidia-elements/core/iframe
+ * @documentation https://nvidia.github.io/elements/docs/elements/iframe/
+ * @slot - A template containing the iframe body content.
+ * @slot head - A template containing content inserted into the iframe head.
+ * @cssprop --border
+ * @cssprop --width
+ * @cssprop --height
+ * @beta
+ */
+export declare class Iframe extends LitElement {
+    #private;
+    static styles: import("lit").CSSResult[];
+    static readonly metadata: {
+        tag: string;
+        version: string;
+    };
+    static get observedAttributes(): string[];
+    render(): import("lit-html").TemplateResult<1>;
+    connectedCallback(): void;
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
+    firstUpdated(props: PropertyValues<this>): void;
+    disconnectedCallback(): void;
+}

package/dist/iframe/iframe.examples.js

@@ -0,0 +1,6 @@
+//#region src/iframe/iframe.examples.ts
+var e = "";
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=iframe.examples.js.map

package/dist/iframe/iframe.examples.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"iframe.examples.js","names":[],"sources":["../../src/iframe/iframe.examples.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html } from 'lit';\nimport '@nvidia-elements/core/iframe/define.js';\n\nexport default {\n  title: 'Elements/Iframe',\n  component: 'nve-iframe'\n};\n\n/**\n * @summary Supplies the iframe with Elements themes, utilities, fonts, and component registrations through its head template. Use this structure because iframe documents do not inherit resources from the parent document.\n */\nexport const Default = {\n  render: () => html`\n<nve-iframe aria-label=\"Elements iframe example\">\n  <template slot=\"head\">\n    <title>Elements iframe example</title>\n    <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/@nvidia-elements/themes/dist/bundles/index.css\" />\n    <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/@nvidia-elements/themes/dist/fonts/inter.css\" />\n    <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/@nvidia-elements/styles/dist/bundles/index.css\" />\n    <script type=\"module\" src=\"https://cdn.jsdelivr.net/npm/@nvidia-elements/core/dist/bundles/index.min.js\"></script>\n  </template>\n  <template>\n    <nve-alert status=\"success\">isolated iframe content</nve-alert>\n  </template>\n</nve-iframe>\n  `\n};\n\n/**\n * @summary Synchronizes the iframe height with expandable content so the host layout avoids empty space or internal scrollbars. Use for previews whose intrinsic height changes after interaction.\n * @tags test-case\n */\nexport const DynamicHeight = {\n  render: () => html`\n<nve-iframe aria-label=\"Dynamic height iframe example\" style=\"--border: 1px solid red\">\n  <template slot=\"head\">\n    <title>Dynamic iframe height</title>\n    <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/@nvidia-elements/themes/dist/bundles/index.css\" />\n    <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/@nvidia-elements/themes/dist/fonts/inter.css\" />\n    <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/@nvidia-elements/styles/dist/bundles/index.css\" />\n    <script type=\"module\" src=\"https://cdn.jsdelivr.net/npm/@nvidia-elements/core/dist/bundles/index.min.js\"></script>\n  </template>\n  <template>\n    <nve-accordion behavior-expand>\n      <nve-accordion-header>\n        <h2 nve-text=\"heading xs medium\" slot=\"prefix\">Dynamic height in iframe</h2>\n      </nve-accordion-header>\n      <nve-accordion-content>\n        The iframe expands when this content opens and contracts when it closes.\n      </nve-accordion-content>\n    </nve-accordion>\n  </template>\n</nve-iframe>\n  `\n};\n\n/**\n * @summary Overrides intrinsic iframe dimensions with `--width` and `--height` to create a stable preview viewport. Use when you need to inspect embedded content at a fixed size regardless of its rendered bounds.\n * @tags test-case\n */\nexport const FixedSize = {\n  render: () => html`\n<nve-iframe aria-label=\"Fixed-size iframe example\" style=\"--height: 256px; --width: 256px; --border: 1px solid red\">\n  <template><p style=\"height: 128px; width: 128px; margin: 1px; outline: 1px solid yellow;\">override iframe size</p></template>\n</nve-iframe>\n  `\n};\n\n/**\n * @summary The iframe browsing-context boundary clips popovers at its viewport and prevents them from escaping. Keep overlays inside the frame, or render them outside the iframe when they must overlap surrounding content.\n * @tags test-case\n */\nexport const OverflowClip = {\n  render: () => html`\n<nve-iframe aria-label=\"Overflow clipping iframe example\" style=\"--height: 150px; --border: 1px solid red\">\n  <template slot=\"head\">\n    <title>Clipped iframe popover</title>\n    <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/@nvidia-elements/themes/dist/bundles/index.css\" />\n    <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/@nvidia-elements/themes/dist/fonts/inter.css\" />\n    <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/@nvidia-elements/styles/dist/bundles/index.css\" />\n    <script type=\"module\" src=\"https://cdn.jsdelivr.net/npm/@nvidia-elements/core/dist/bundles/index.min.js\"></script>\n  </template>\n  <template>\n    <div nve-layout=\"pad:md\">\n      <nve-dropdown id=\"dropdown\">Popovers <strong>are clipped</strong> by the iframe.</nve-dropdown>\n      <nve-button popovertarget=\"dropdown\">Open popover</nve-button>\n    </div>\n  </template>\n</nve-iframe>\n  `\n};\n\n/**\n * @summary Regenerates the iframe document when its source template changes. Use for live previews or generated output that must stay synchronized with edits made in the parent document.\n * @tags test-case\n */\nexport const DynamicallyUpdatedContent = {\n  render: () => html`\n<nve-iframe id=\"property-example\" aria-label=\"Dynamically updated iframe example\">\n  <template>\n    <p nve-text=\"body\">Initial iframe content.</p>\n  </template>\n</nve-iframe>\n<script type=\"module\">\n  document.querySelector('#property-example template').innerHTML =\n    '<p nve-text=\"body\">This template was dynamically updated.</p>';\n</script>\n  `\n};\n"],"mappings":";AAGA,IAAA,IAAS"}