@nvidia-elements/core 2.19.0 → 2.20.0

package/dist/month/month2.js

@@ -8,7 +8,10 @@ import o from "./month.js";
 import { html as s } from "lit";
 import { property as c } from "lit/decorators/property.js";
 //#region src/month/month.ts
-var l = class extends r {
+var l = { expand: "expand" }, u = class extends r {
+	get i18nDefaults() {
+		return l;
+	}
 	static {
 		this.styles = t([
 			...r.styles,
@@ -19,7 +22,7 @@ var l = class extends r {
 	static {
 		this.metadata = {
 			tag: "nve-month",
-			version: "2.19.0"
+			version: "2.20.0"
 		};
 	}
 	static {
@@ -32,8 +35,8 @@ var l = class extends r {
 n([c({
 	type: String,
 	reflect: !0
-})], l.prototype, "container", void 0), l = n([e()], l);
+})], u.prototype, "container", void 0), u = n([e()], u);
 //#endregion
-export { l as Month };
+export { u as Month };
 
 //# sourceMappingURL=month2.js.map

package/dist/month/month2.js.map

@@ -1 +1 @@
-{"version":3,"file":"month2.js","names":[],"sources":["../../src/month/month.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 { ContainerElement } from '@nvidia-elements/core/internal';\nimport { scopedRegistry, useStyles } from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { inputStyles } from '@nvidia-elements/core/input';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport styles from './month.css?inline';\n\n/**\n * @element nve-month\n * @description A month picker is a control that enables users to choose a month value.\n * @documentation https://nvidia.github.io/elements/docs/elements/month/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/month\n * @cssprop --padding\n * @cssprop --font-size\n * @cssprop --height\n * @cssprop --background\n * @cssprop --border-radius\n * @cssprop --border\n * @cssprop --cursor\n * @csspart icon-button - The calendar icon button element\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/month\n */\n@scopedRegistry()\nexport class Month extends Control implements ContainerElement {\n  /**\n   * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.\n   * Use when embedding within another container such as a toolbar.\n   */\n  @property({ type: String, reflect: true }) container?: 'flat';\n\n  static styles = useStyles([...Control.styles, inputStyles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-month',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [IconButton.metadata.tag]: IconButton\n  };\n\n  protected get suffixContent() {\n    return html`<nve-icon-button part=\"icon-button\" .ariaLabel=${this.i18n.expand} icon-name=\"calendar\" container=\"inline\" @click=${this.showPicker}></nve-icon-button>`;\n  }\n}\n"],"mappings":";;;;;;;;;;AA6BO,IAAM,IAAN,cAAoB,EAAoC;;EAO7C,KAAA,SAAA,EAAU;GAAC,GAAG,EAAQ;GAAQ;GAAa;EAAM,CAAC;;;EAEvC,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;;EAE4B,KAAA,qBAAA,GACzB,EAAW,SAAS,MAAM,EAC7B;;CAEA,IAAc,gBAAgB;EAC5B,OAAO,CAAI,mDAAkD,KAAK,KAAK,OAAO,oDAAkD,KAAK,WAAW;CAClJ;AACF;AAhBG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,GAN1C,IAAA,EAAA,CAAA,EAAe,CAAA,GAAA,CAAA"}
+{"version":3,"file":"month2.js","names":[],"sources":["../../src/month/month.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 { ContainerElement } from '@nvidia-elements/core/internal';\nimport { scopedRegistry, useStyles } from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { inputStyles } from '@nvidia-elements/core/input';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport type { I18nDefaults } from '@nvidia-elements/foundations/internal/i18n';\nimport styles from './month.css?inline';\n\nconst i18nDefaults = {\n  expand: 'expand'\n} satisfies I18nDefaults;\n\n/**\n * @element nve-month\n * @description A month picker is a control that enables users to choose a month value.\n * @documentation https://nvidia.github.io/elements/docs/elements/month/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/month\n * @cssprop --padding\n * @cssprop --font-size\n * @cssprop --height\n * @cssprop --background\n * @cssprop --border-radius\n * @cssprop --border\n * @cssprop --cursor\n * @csspart icon-button - The calendar icon button element\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/month\n */\n@scopedRegistry()\nexport class Month extends Control implements ContainerElement {\n  protected override get i18nDefaults(): I18nDefaults {\n    return i18nDefaults;\n  }\n\n  /**\n   * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.\n   * Use when embedding within another container such as a toolbar.\n   */\n  @property({ type: String, reflect: true }) container?: 'flat';\n\n  static styles = useStyles([...Control.styles, inputStyles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-month',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [IconButton.metadata.tag]: IconButton\n  };\n\n  protected get suffixContent() {\n    return html`<nve-icon-button part=\"icon-button\" .ariaLabel=${this.i18n.expand} icon-name=\"calendar\" container=\"inline\" @click=${this.showPicker}></nve-icon-button>`;\n  }\n}\n"],"mappings":";;;;;;;;;;AAaA,IAAM,IAAe,EACnB,QAAQ,SACV,GAmBa,IAAN,cAAoB,EAAoC;CAC7D,IAAuB,eAA6B;EAClD,OAAO;CACT;;EAQgB,KAAA,SAAA,EAAU;GAAC,GAAG,EAAQ;GAAQ;GAAa;EAAM,CAAC;;;EAEvC,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;;EAE4B,KAAA,qBAAA,GACzB,EAAW,SAAS,MAAM,EAC7B;;CAEA,IAAc,gBAAgB;EAC5B,OAAO,CAAI,mDAAkD,KAAK,KAAK,OAAO,oDAAkD,KAAK,WAAW;CAClJ;AACF;AAhBG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,GAV1C,IAAA,EAAA,CAAA,EAAe,CAAA,GAAA,CAAA"}

package/dist/notification/notification-group2.js

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

package/dist/notification/notification2.js

@@ -1,20 +1,26 @@
-import { I18nController as e } from "../internal/controllers/i18n.controller.js";
-import { attachInternals as t } from "../internal/utils/a11y.js";
-import { TypeNativePopoverController as n } from "../internal/controllers/type-native-popover.controller.js";
-import { scopedRegistry as r } from "../internal/decorators/scoped-registry.js";
-import { useStyles as i } from "../internal/styles/index.js";
-import { popoverStyles as a } from "../internal/styles/popover2.js";
-import { statusIcons as o } from "../internal/types/index.js";
-import s from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
-import { Icon as c } from "../icon/icon2.js";
-import { IconButton as l } from "../icon-button/icon-button2.js";
-import u from "./notification.js";
-import { LitElement as d, html as f } from "lit";
-import { property as p } from "lit/decorators/property.js";
+import { attachInternals as e } from "../internal/utils/a11y.js";
+import { TypeNativePopoverController as t } from "../internal/controllers/type-native-popover.controller.js";
+import { scopedRegistry as n } from "../internal/decorators/scoped-registry.js";
+import { useStyles as r } from "../internal/styles/index.js";
+import { popoverStyles as i } from "../internal/styles/popover2.js";
+import { statusIcons as a } from "../internal/types/index.js";
+import o from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
+import { Icon as s } from "../icon/icon2.js";
+import { IconButton as c } from "../icon-button/icon-button2.js";
+import l from "./notification.js";
+import { LitElement as u, html as d } from "lit";
+import { property as f } from "lit/decorators/property.js";
+import { I18nController as p } from "@nvidia-elements/foundations/internal/i18n";
 //#region src/notification/notification.ts
-var m = class extends d {
-	constructor(...t) {
-		super(...t), this.anchor = globalThis.document?.body, this.closable = !1, this.closeTimeout = 0, this.#e = new e(this), this.i18n = this.#e.i18n, this.inline = !1;
+var m = {
+	close: "close",
+	danger: "danger",
+	information: "information",
+	success: "success",
+	warning: "warning"
+}, h = class extends u {
+	constructor(...e) {
+		super(...e), this.anchor = globalThis.document?.body, this.closable = !1, this.closeTimeout = 0, this.#e = new p(this, m), this.i18n = this.#e.i18n, this.inline = !1;
 	}
 	#e;
 	get popoverType() {
@@ -26,34 +32,34 @@ var m = class extends d {
 	#t;
 	#n;
 	get #r() {
-		return f`<slot name="icon"><nve-icon .name="${o[this.status]}" .ariaLabel="${(this.status ? this.i18n[this.status] : void 0) ?? this.i18n.information}" part="status-icon"></nve-icon></slot>${this.closable ? f`<nve-icon-button part="icon-button" @click="${this.hidePopover}" icon-name="cancel" size="sm" container="flat" .ariaLabel="${this.i18n.close}"></nve-icon-button>` : ""}<slot></slot>`;
+		return d`<slot name="icon"><nve-icon .name="${a[this.status]}" .ariaLabel="${(this.status ? this.i18n[this.status] : void 0) ?? this.i18n.information}" part="status-icon"></nve-icon></slot>${this.closable ? d`<nve-icon-button part="icon-button" @click="${this.hidePopover}" icon-name="cancel" size="sm" container="flat" .ariaLabel="${this.i18n.close}"></nve-icon-button>` : ""}<slot></slot>`;
 	}
 	static {
-		this.styles = i([a, u]);
+		this.styles = r([i, l]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-notification",
-			version: "2.19.0"
+			version: "2.20.0"
 		};
 	}
 	static {
 		this.elementDefinitions = {
-			[c.metadata.tag]: c,
-			[l.metadata.tag]: l
+			[s.metadata.tag]: s,
+			[c.metadata.tag]: c
 		};
 	}
 	render() {
-		return f`<div internal-host>${this.#r}</div>`;
+		return d`<div internal-host>${this.#r}</div>`;
 	}
 	connectedCallback() {
-		super.connectedCallback(), t(this), this.#n = new MutationObserver(() => this.#i()), this.#n.observe(this, { attributeFilter: ["hidden"] }), this._internals.role = "alert", this.#i();
+		super.connectedCallback(), e(this), this.#n = new MutationObserver(() => this.#i()), this.#n.observe(this, { attributeFilter: ["hidden"] }), this._internals.role = "alert", this.#i();
 	}
 	disconnectedCallback() {
 		this.#a(), this.#n?.disconnect(), this.#n = void 0, super.disconnectedCallback();
 	}
 	async firstUpdated(e) {
-		super.firstUpdated(e), this.popoverInline ? this.setAttribute("nve-popover", "") : this.typeNativePopoverController = new n(this), this.#i();
+		super.firstUpdated(e), this.popoverInline ? this.setAttribute("nve-popover", "") : this.typeNativePopoverController = new t(this), this.#i();
 	}
 	updated(e) {
 		super.updated(e), (e.has("closeTimeout") || e.has("container") || e.has("inline")) && this.#i();
@@ -71,27 +77,27 @@ var m = class extends d {
 		this.#t !== void 0 && (clearTimeout(this.#t), this.#t = void 0);
 	}
 };
-s([p({ type: String })], m.prototype, "anchor", void 0), s([p({ type: String })], m.prototype, "trigger", void 0), s([p({
+o([f({ type: String })], h.prototype, "anchor", void 0), o([f({ type: String })], h.prototype, "trigger", void 0), o([f({
 	type: String,
 	reflect: !0
-})], m.prototype, "position", void 0), s([p({
+})], h.prototype, "position", void 0), o([f({
 	type: String,
 	reflect: !0
-})], m.prototype, "alignment", void 0), s([p({
+})], h.prototype, "alignment", void 0), o([f({
 	type: Boolean,
 	reflect: !0,
 	attribute: "behavior-trigger"
-})], m.prototype, "behaviorTrigger", void 0), s([p({ type: Boolean })], m.prototype, "closable", void 0), s([p({
+})], h.prototype, "behaviorTrigger", void 0), o([f({ type: Boolean })], h.prototype, "closable", void 0), o([f({
 	type: Number,
 	attribute: "close-timeout"
-})], m.prototype, "closeTimeout", void 0), s([p({
+})], h.prototype, "closeTimeout", void 0), o([f({
 	type: String,
 	reflect: !0
-})], m.prototype, "status", void 0), s([p({
+})], h.prototype, "status", void 0), o([f({
 	type: String,
 	reflect: !0
-})], m.prototype, "container", void 0), s([p({ type: Object })], m.prototype, "i18n", void 0), s([p({ type: Boolean })], m.prototype, "inline", void 0), m = s([r()], m);
+})], h.prototype, "container", void 0), o([f({ type: Object })], h.prototype, "i18n", void 0), o([f({ type: Boolean })], h.prototype, "inline", void 0), h = o([n()], h);
 //#endregion
-export { m as Notification };
+export { h as Notification };
 
 //# sourceMappingURL=notification2.js.map

package/dist/notification/notification2.js.map

@@ -1 +1 @@
-{"version":3,"file":"notification2.js","names":[],"sources":["../../src/notification/notification.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { PropertyValues } from 'lit';\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport type { PopoverAlign, PopoverType, SupportStatus, PopoverPosition } from '@nvidia-elements/core/internal';\nimport {\n  attachInternals,\n  popoverStyles,\n  statusIcons,\n  useStyles,\n  I18nController,\n  TypeNativePopoverController,\n  scopedRegistry\n} from '@nvidia-elements/core/internal';\nimport styles from './notification.css?inline';\n\n/**\n * @element nve-notification\n * @description Displays real time updates without interrupting the user's workflow to communicate an important message or status.\n * @documentation https://nvidia.github.io/elements/docs/elements/notification/\n * @since 0.6.0\n * @entrypoint \\@nvidia-elements/core/notification\n * @event beforetoggle - Dispatched on a popover just before showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/beforetoggle_event)\n * @event toggle - Dispatched on a popover element just after showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event)\n * @event open - Dispatched when the notification opens.\n * @event close - Dispatched when the notification closes.\n * @slot - The message communicated by the notification.\n * @slot icon - content slot for the status icon\n * @cssprop --border-radius\n * @cssprop --background\n * @cssprop --color\n * @cssprop --padding\n * @cssprop --box-shadow\n * @cssprop --min-width\n * @cssprop --width\n * @cssprop --max-width\n * @cssprop --border\n * @cssprop --status-border\n * @cssprop --gap\n * @cssprop --status-color\n * @cssprop --animation-duration - Duration of notification open/close animations\n * @csspart status-icon - The status icon element\n * @csspart icon-button - The close icon button element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/alertdialog/\n */\n@scopedRegistry()\nexport class Notification extends LitElement {\n  /**\n   * (optional) By default the popover will automatically anchor itself relative to the trigger element.\n   * Pass an optional custom anchor element as an idref string within the same render root or a HTMLElement DOM reference.\n   */\n  @property({ type: String }) anchor: string | HTMLElement = globalThis.document?.body;\n\n  /**\n   * @deprecated Use the popover API instead.\n   * The trigger defines what element triggers an `open` interaction event.\n   * A trigger can accept a idref string within the same render root or a HTMLElement DOM reference.\n   */\n  @property({ type: String }) trigger: string | HTMLElement;\n\n  /**\n   * Sets the side position of the popover relative to the provided anchor element.\n   */\n  @property({ type: String, reflect: true }) position: PopoverPosition;\n\n  /**\n   * Sets the alignment of the popover relative to the provided anchor element.\n   */\n  @property({ type: String, reflect: true }) alignment: PopoverAlign;\n\n  /**\n   * @deprecated Use the popover API instead.\n   * Determines if popover visibility behavior should be automatically controlled by the trigger.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'behavior-trigger' }) behaviorTrigger: boolean;\n\n  /**\n   * Determines if a close button should render within notification.\n   */\n  @property({ type: Boolean }) closable = false;\n\n  /**\n   * A delayed `close` event will occur determined from the provided millisecond value.\n   */\n  @property({ type: Number, attribute: 'close-timeout' }) closeTimeout = 0;\n\n  /**\n   * Determines the visual status of the notification.\n   */\n  @property({ type: String, reflect: true }) status: SupportStatus;\n\n  /**\n   * Flat container option applies when embedding within another containing element such as a drawer.\n   */\n  @property({ type: String, reflect: true }) container?: 'flat';\n\n  #i18nController: I18nController<this> = new I18nController<this>(this);\n\n  /**\n   * Enables updating internal string values for internationalization.\n   */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  /**\n   * @private\n   */\n  @property({ type: Boolean }) inline = false;\n\n  /** @private */\n  get popoverType(): PopoverType {\n    return 'manual';\n  }\n\n  /** @private */\n  get popoverInline() {\n    return this.parentElement?.localName === 'nve-notification-group' || this.inline || this.container === 'flat';\n  }\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  protected typeNativePopoverController: TypeNativePopoverController<Notification>;\n\n  #closeTimeout?: ReturnType<typeof setTimeout>;\n\n  #hiddenAttributeObserver?: MutationObserver;\n\n  get #popoverContent() {\n    return html`\n    <slot name=\"icon\"><nve-icon .name=${statusIcons[this.status]} .ariaLabel=${(this.status ? (this.i18n as Record<string, string>)[this.status] : undefined) ?? this.i18n.information} part=\"status-icon\"></nve-icon></slot>\n    ${this.closable ? html`<nve-icon-button part=\"icon-button\" @click=${this.hidePopover} icon-name=\"cancel\" size=\"sm\" container=\"flat\" .ariaLabel=${this.i18n.close}></nve-icon-button>` : ''}\n    <slot></slot>`;\n  }\n\n  static styles = useStyles([popoverStyles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-notification',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon,\n    [IconButton.metadata.tag]: IconButton\n  };\n\n  render() {\n    return html`\n    <div internal-host>\n      ${this.#popoverContent}\n    </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this.#hiddenAttributeObserver = new MutationObserver(() => this.#syncInlineCloseTimeout());\n    this.#hiddenAttributeObserver.observe(this, { attributeFilter: ['hidden'] });\n    this._internals.role = 'alert';\n    this.#syncInlineCloseTimeout();\n  }\n\n  disconnectedCallback() {\n    this.#clearCloseTimeout();\n    this.#hiddenAttributeObserver?.disconnect();\n    this.#hiddenAttributeObserver = undefined;\n    super.disconnectedCallback();\n  }\n\n  async firstUpdated(props: PropertyValues<this>) {\n    super.firstUpdated(props);\n\n    if (!this.popoverInline) {\n      this.typeNativePopoverController = new TypeNativePopoverController<Notification>(this);\n    } else {\n      this.setAttribute('nve-popover', '');\n    }\n\n    this.#syncInlineCloseTimeout();\n  }\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n\n    if (props.has('closeTimeout') || props.has('container') || props.has('inline')) {\n      this.#syncInlineCloseTimeout();\n    }\n  }\n\n  hidePopover(): void {\n    this.#clearCloseTimeout();\n\n    if (this.popoverInline) {\n      this.dispatchEvent(new CustomEvent('close', { bubbles: true, composed: true }));\n    } else {\n      super.hidePopover();\n    }\n  }\n\n  /**\n   * The popover controller provides this functionality.\n   * But when the notification is in inline mode the\n   * controller does not run so this sets it up directly.\n   */\n  #syncInlineCloseTimeout() {\n    this.#clearCloseTimeout();\n\n    if (this.popoverInline && this.closeTimeout && !this.hidden) {\n      this.#closeTimeout = setTimeout(() => this.hidePopover(), this.closeTimeout);\n    }\n  }\n\n  #clearCloseTimeout() {\n    if (this.#closeTimeout !== undefined) {\n      clearTimeout(this.#closeTimeout);\n      this.#closeTimeout = undefined;\n    }\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"notification2.js","names":[],"sources":["../../src/notification/notification.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { PropertyValues } from 'lit';\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport type { PopoverAlign, PopoverType, SupportStatus, PopoverPosition } from '@nvidia-elements/core/internal';\nimport {\n  attachInternals,\n  popoverStyles,\n  statusIcons,\n  useStyles,\n  TypeNativePopoverController,\n  scopedRegistry\n} from '@nvidia-elements/core/internal';\nimport { I18nController, type I18nDefaults } from '@nvidia-elements/foundations/internal/i18n';\nimport styles from './notification.css?inline';\n\nconst i18nDefaults = {\n  close: 'close',\n  danger: 'danger',\n  information: 'information',\n  success: 'success',\n  warning: 'warning'\n} satisfies I18nDefaults;\n\n/**\n * @element nve-notification\n * @description Displays real time updates without interrupting the user's workflow to communicate an important message or status.\n * @documentation https://nvidia.github.io/elements/docs/elements/notification/\n * @since 0.6.0\n * @entrypoint \\@nvidia-elements/core/notification\n * @event beforetoggle - Dispatched on a popover just before showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/beforetoggle_event)\n * @event toggle - Dispatched on a popover element just after showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event)\n * @event open - Dispatched when the notification opens.\n * @event close - Dispatched when the notification closes.\n * @slot - The message communicated by the notification.\n * @slot icon - content slot for the status icon\n * @cssprop --border-radius\n * @cssprop --background\n * @cssprop --color\n * @cssprop --padding\n * @cssprop --box-shadow\n * @cssprop --min-width\n * @cssprop --width\n * @cssprop --max-width\n * @cssprop --border\n * @cssprop --status-border\n * @cssprop --gap\n * @cssprop --status-color\n * @cssprop --animation-duration - Duration of notification open/close animations\n * @csspart status-icon - The status icon element\n * @csspart icon-button - The close icon button element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/alertdialog/\n */\n@scopedRegistry()\nexport class Notification extends LitElement {\n  /**\n   * (optional) By default the popover will automatically anchor itself relative to the trigger element.\n   * Pass an optional custom anchor element as an idref string within the same render root or a HTMLElement DOM reference.\n   */\n  @property({ type: String }) anchor: string | HTMLElement = globalThis.document?.body;\n\n  /**\n   * @deprecated Use the popover API instead.\n   * The trigger defines what element triggers an `open` interaction event.\n   * A trigger can accept a idref string within the same render root or a HTMLElement DOM reference.\n   */\n  @property({ type: String }) trigger: string | HTMLElement;\n\n  /**\n   * Sets the side position of the popover relative to the provided anchor element.\n   */\n  @property({ type: String, reflect: true }) position: PopoverPosition;\n\n  /**\n   * Sets the alignment of the popover relative to the provided anchor element.\n   */\n  @property({ type: String, reflect: true }) alignment: PopoverAlign;\n\n  /**\n   * @deprecated Use the popover API instead.\n   * Determines if popover visibility behavior should be automatically controlled by the trigger.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'behavior-trigger' }) behaviorTrigger: boolean;\n\n  /**\n   * Determines if a close button should render within notification.\n   */\n  @property({ type: Boolean }) closable = false;\n\n  /**\n   * A delayed `close` event will occur determined from the provided millisecond value.\n   */\n  @property({ type: Number, attribute: 'close-timeout' }) closeTimeout = 0;\n\n  /**\n   * Determines the visual status of the notification.\n   */\n  @property({ type: String, reflect: true }) status: SupportStatus;\n\n  /**\n   * Flat container option applies when embedding within another containing element such as a drawer.\n   */\n  @property({ type: String, reflect: true }) container?: 'flat';\n\n  #i18nController: I18nController<this> = new I18nController<this>(this, i18nDefaults);\n\n  /**\n   * Enables updating internal string values for internationalization.\n   */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  /**\n   * @private\n   */\n  @property({ type: Boolean }) inline = false;\n\n  /** @private */\n  get popoverType(): PopoverType {\n    return 'manual';\n  }\n\n  /** @private */\n  get popoverInline() {\n    return this.parentElement?.localName === 'nve-notification-group' || this.inline || this.container === 'flat';\n  }\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  protected typeNativePopoverController: TypeNativePopoverController<Notification>;\n\n  #closeTimeout?: ReturnType<typeof setTimeout>;\n\n  #hiddenAttributeObserver?: MutationObserver;\n\n  get #popoverContent() {\n    return html`\n    <slot name=\"icon\"><nve-icon .name=${statusIcons[this.status]} .ariaLabel=${(this.status ? (this.i18n as Record<string, string>)[this.status] : undefined) ?? this.i18n.information} part=\"status-icon\"></nve-icon></slot>\n    ${this.closable ? html`<nve-icon-button part=\"icon-button\" @click=${this.hidePopover} icon-name=\"cancel\" size=\"sm\" container=\"flat\" .ariaLabel=${this.i18n.close}></nve-icon-button>` : ''}\n    <slot></slot>`;\n  }\n\n  static styles = useStyles([popoverStyles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-notification',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon,\n    [IconButton.metadata.tag]: IconButton\n  };\n\n  render() {\n    return html`\n    <div internal-host>\n      ${this.#popoverContent}\n    </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this.#hiddenAttributeObserver = new MutationObserver(() => this.#syncInlineCloseTimeout());\n    this.#hiddenAttributeObserver.observe(this, { attributeFilter: ['hidden'] });\n    this._internals.role = 'alert';\n    this.#syncInlineCloseTimeout();\n  }\n\n  disconnectedCallback() {\n    this.#clearCloseTimeout();\n    this.#hiddenAttributeObserver?.disconnect();\n    this.#hiddenAttributeObserver = undefined;\n    super.disconnectedCallback();\n  }\n\n  async firstUpdated(props: PropertyValues<this>) {\n    super.firstUpdated(props);\n\n    if (!this.popoverInline) {\n      this.typeNativePopoverController = new TypeNativePopoverController<Notification>(this);\n    } else {\n      this.setAttribute('nve-popover', '');\n    }\n\n    this.#syncInlineCloseTimeout();\n  }\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n\n    if (props.has('closeTimeout') || props.has('container') || props.has('inline')) {\n      this.#syncInlineCloseTimeout();\n    }\n  }\n\n  hidePopover(): void {\n    this.#clearCloseTimeout();\n\n    if (this.popoverInline) {\n      this.dispatchEvent(new CustomEvent('close', { bubbles: true, composed: true }));\n    } else {\n      super.hidePopover();\n    }\n  }\n\n  /**\n   * The popover controller provides this functionality.\n   * But when the notification is in inline mode the\n   * controller does not run so this sets it up directly.\n   */\n  #syncInlineCloseTimeout() {\n    this.#clearCloseTimeout();\n\n    if (this.popoverInline && this.closeTimeout && !this.hidden) {\n      this.#closeTimeout = setTimeout(() => this.hidePopover(), this.closeTimeout);\n    }\n  }\n\n  #clearCloseTimeout() {\n    if (this.#closeTimeout !== undefined) {\n      clearTimeout(this.#closeTimeout);\n      this.#closeTimeout = undefined;\n    }\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;AAoBA,IAAM,IAAe;CACnB,OAAO;CACP,QAAQ;CACR,aAAa;CACb,SAAS;CACT,SAAS;AACX,GAgCa,IAAN,cAA2B,EAAW;;EA4DL,aAvDqB,KAAA,SAAA,WAAW,UAAU,MA4BxC,KAAA,WAAA,IAK+B,KAAA,eAAA,GAY/B,KAAA,KAAA,IAAI,EAAqB,MAAM,CAAY,GAKhD,KAAA,OAAA,KAAK,GAAgB,MAKlB,KAAA,SAAA;;CAVtC;CAaA,IAAI,cAA2B;EAC7B,OAAO;CACT;CAGA,IAAI,gBAAgB;EAClB,OAAO,KAAK,eAAe,cAAc,4BAA4B,KAAK,UAAU,KAAK,cAAc;CACzG;CAOA;CAEA;CAEA,IAAI,KAAkB;EACpB,OAAO,CAAI,sCACyB,EAAY,KAAK,QAAQ,iBAAe,KAAK,SAAU,KAAK,KAAgC,KAAK,UAAU,KAAA,MAAc,KAAK,KAAK,YAAY,yCACjL,KAAK,WAAW,CAAI,+CAA8C,KAAK,YAAY,8DAA4D,KAAK,KAAK,MAAM,wBAAuB,GAAG;CAE7L;;EAEgB,KAAA,SAAA,EAAU,CAAC,GAAe,CAAM,CAAC;;;EAEtB,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;;EAE4B,KAAA,qBAAA;IACzB,EAAK,SAAS,MAAM;IACpB,EAAW,SAAS,MAAM;EAC7B;;CAEA,SAAS;EACP,OAAO,CAAI,sBAEP,KAAK,GAAgB;CAG3B;CAEA,oBAAoB;EAMlB,AALA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,KAAK,KAA2B,IAAI,uBAAuB,KAAK,GAAwB,CAAC,GACzF,KAAK,GAAyB,QAAQ,MAAM,EAAE,iBAAiB,CAAC,QAAQ,EAAE,CAAC,GAC3E,KAAK,WAAW,OAAO,SACvB,KAAK,GAAwB;CAC/B;CAEA,uBAAuB;EAIrB,AAHA,KAAK,GAAmB,GACxB,KAAK,IAA0B,WAAW,GAC1C,KAAK,KAA2B,KAAA,GAChC,MAAM,qBAAqB;CAC7B;CAEA,MAAM,aAAa,GAA6B;EAS9C,AARA,MAAM,aAAa,CAAK,GAEnB,KAAK,gBAGR,KAAK,aAAa,eAAe,EAAE,IAFnC,KAAK,8BAA8B,IAAI,EAA0C,IAAI,GAKvF,KAAK,GAAwB;CAC/B;CAEA,QAAQ,GAA6B;EAGnC,AAFA,MAAM,QAAQ,CAAK,IAEf,EAAM,IAAI,cAAc,KAAK,EAAM,IAAI,WAAW,KAAK,EAAM,IAAI,QAAQ,MAC3E,KAAK,GAAwB;CAEjC;CAEA,cAAoB;EAGlB,AAFA,KAAK,GAAmB,GAEpB,KAAK,gBACP,KAAK,cAAc,IAAI,YAAY,SAAS;GAAE,SAAS;GAAM,UAAU;EAAK,CAAC,CAAC,IAE9E,MAAM,YAAY;CAEtB;CAOA,KAA0B;EAGxB,AAFA,KAAK,GAAmB,GAEpB,KAAK,iBAAiB,KAAK,gBAAgB,CAAC,KAAK,WACnD,KAAK,KAAgB,iBAAiB,KAAK,YAAY,GAAG,KAAK,YAAY;CAE/E;CAEA,KAAqB;EACnB,AAAI,KAAK,OAAkB,KAAA,MACzB,aAAa,KAAK,EAAa,GAC/B,KAAK,KAAgB,KAAA;CAEzB;AACF;AAxKG,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA,GAOzB,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,WAAA,KAAA,CAAA,GAKzB,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,GAKxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,GAMxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;AAAmB,CAAC,CAAA,GAAA,EAAA,WAAA,mBAAA,KAAA,CAAA,GAKxE,EAAA,CAAA,EAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,GAK1B,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,WAAW;AAAgB,CAAC,CAAA,GAAA,EAAA,WAAA,gBAAA,KAAA,CAAA,GAKrD,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA,GAKxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,GAOxC,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GAKzB,EAAA,CAAA,EAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA,GA7D5B,IAAA,EAAA,CAAA,EAAe,CAAA,GAAA,CAAA"}

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

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

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

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

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

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

package/dist/page/page-panel/page-panel.d.ts

@@ -27,17 +27,10 @@ import type { Size } from '@nvidia-elements/core/internal';
  *
  */
 export declare class PagePanel extends LitElement {
-    #private;
     /**
      * Sets the max size of the panel.
      */
     size?: Size;
-    /**
-     * Enables updating internal string values for internationalization.
-     */
-    i18n: Partial<import("@nvidia-elements/core/internal").I18nStrings & {
-        __set: boolean;
-    }>;
     static styles: import("lit").CSSResult[];
     static readonly metadata: {
         tag: string;

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

@@ -1,23 +1,21 @@
-import { I18nController as e } from "../../internal/controllers/i18n.controller.js";
-import { appendRootNodeStyle as t } from "../../internal/utils/dom.js";
-import { attachInternals as n } from "../../internal/utils/a11y.js";
-import { TypeExpandableController as r } from "../../internal/controllers/type-expandable.controller.js";
-import { useStyles as i } from "../../internal/styles/index.js";
-import a from "../../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
-import o from "./page-panel.js";
-import s from "./page-panel.global.js";
-import { LitElement as c, html as l } from "lit";
-import { property as u } from "lit/decorators/property.js";
+import { appendRootNodeStyle as e } from "../../internal/utils/dom.js";
+import { attachInternals as t } from "../../internal/utils/a11y.js";
+import { TypeExpandableController as n } from "../../internal/controllers/type-expandable.controller.js";
+import { useStyles as r } from "../../internal/styles/index.js";
+import i from "../../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
+import a from "./page-panel.js";
+import o from "./page-panel.global.js";
+import { LitElement as s, html as c } from "lit";
+import { property as l } from "lit/decorators/property.js";
 //#region src/page/page-panel/page-panel.ts
-var d = class extends c {
-	#e;
+var u = class extends s {
 	static {
-		this.styles = i([o]);
+		this.styles = r([a]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-page-panel",
-			version: "2.19.0",
+			version: "2.20.0",
 			parents: ["nve-page"]
 		};
 	}
@@ -25,23 +23,23 @@ var d = class extends c {
 		return [...super.observedAttributes, "hidden"];
 	}
 	constructor() {
-		super(), this.#e = new e(this), this.i18n = this.#e.i18n, new r(this, { useHidden: !0 });
+		super(), new n(this, { useHidden: !0 });
 	}
 	render() {
-		return l`<div internal-host><div part="_header"><slot name="header"></slot><slot name="actions"></slot></div><div class="content"><slot></slot></div><div><slot name="footer"></slot></div></div>`;
+		return c`<div internal-host><div part="_header"><slot name="header"></slot><slot name="actions"></slot></div><div class="content"><slot></slot></div><div><slot name="footer"></slot></div></div>`;
 	}
 	connectedCallback() {
-		super.connectedCallback(), n(this), this._internals.states.delete("reopened"), t(this, s), this._internals.role = "region";
+		super.connectedCallback(), t(this), this._internals.states.delete("reopened"), e(this, o), this._internals.role = "region";
 	}
 	attributeChangedCallback(e, t, n) {
 		super.attributeChangedCallback(e, t, n), e === "hidden" && t !== null && n === null && this.isConnected && this._internals.states.add("reopened");
 	}
 };
-a([u({
+i([l({
 	type: String,
 	reflect: !0
-})], d.prototype, "size", void 0), a([u({ type: Object })], d.prototype, "i18n", void 0);
+})], u.prototype, "size", void 0);
 //#endregion
-export { d as PagePanel };
+export { u as PagePanel };
 
 //# sourceMappingURL=page-panel2.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"page-panel2.js","names":[],"sources":["../../../src/page/page-panel/page-panel.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport type { Size } from '@nvidia-elements/core/internal';\nimport {\n  appendRootNodeStyle,\n  attachInternals,\n  I18nController,\n  TypeExpandableController,\n  useStyles\n} from '@nvidia-elements/core/internal';\nimport styles from './page-panel.css?inline';\nimport globalStyles from './page-panel.global.css?inline';\n\n/**\n * @element nve-page-panel\n * @description Child panel for embedded panels within the page component. Typically used for left/right/bottom page slot positions.\n * @documentation https://nvidia.github.io/elements/docs/elements/page/\n * @entrypoint \\@nvidia-elements/core/page\n * @since 1.15.0\n * @event open - Dispatched after an invoker command removes `hidden` and opens the panel.\n * @event close - Dispatched after an invoker command sets `hidden` and closes the panel.\n * @slot - `nve-page-panel-content` elements that provide the panel body.\n * @slot actions - slot for action / dismiss buttons\n * @command --open - Removes `hidden` and dispatches `open`.\n * @command --close - Sets `hidden` and dispatches `close`.\n * @command --toggle - Toggles `hidden` and dispatches `open` or `close`.\n * @cssprop --background\n * @cssprop --border\n * @cssprop --color\n * @cssprop --gap\n * @cssprop --padding\n * @cssprop --height\n * @cssprop --width\n * @cssprop --max-width\n * @cssprop --max-height\n * @cssprop --animation-duration - Duration of panel open/close animations\n * @aria https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/region_role\n *\n */\nexport class PagePanel extends LitElement {\n  /**\n   * Sets the max size of the panel.\n   */\n  @property({ type: String, reflect: true }) size?: Size;\n\n  #i18nController: I18nController<this> = new I18nController<this>(this);\n\n  /**\n   * Enables updating internal string values for internationalization.\n   */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-page-panel',\n    version: '0.0.0',\n    parents: ['nve-page']\n  };\n\n  static get observedAttributes() {\n    return [...super.observedAttributes, 'hidden'];\n  }\n\n  constructor() {\n    super();\n    new TypeExpandableController(this, { useHidden: true });\n  }\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  render() {\n    return html`\n    <div internal-host>\n      <div part=\"_header\">\n        <slot name=\"header\"></slot>\n        <slot name=\"actions\"></slot>\n      </div>\n      <div class=\"content\">\n        <slot></slot>\n      </div>\n      <div>\n        <slot name=\"footer\"></slot>\n      </div>\n    </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.states.delete('reopened');\n    appendRootNodeStyle(this, globalStyles);\n    this._internals.role = 'region';\n  }\n\n  attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null) {\n    super.attributeChangedCallback(name, oldValue, newValue);\n    if (name === 'hidden' && oldValue !== null && newValue === null && this.isConnected) {\n      this._internals.states.add('reopened');\n    }\n  }\n}\n"],"mappings":";;;;;;;;;;;AA0CA,IAAa,IAAb,cAA+B,EAAW;CAMxC;;EAOgB,KAAA,SAAA,EAAU,CAAC,CAAM,CAAC;;;EAEP,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;GACT,SAAS,CAAC,UAAU;EACtB;;CAEA,WAAW,qBAAqB;EAC9B,OAAO,CAAC,GAAG,MAAM,oBAAoB,QAAQ;CAC/C;CAEA,cAAc;EAEZ,AADA,MAAM,GApBgC,KAAA,KAAA,IAAI,EAAqB,IAAI,GAKlC,KAAA,OAAA,KAAK,GAAgB,MAgBtD,IAAI,EAAyB,MAAM,EAAE,WAAW,GAAK,CAAC;CACxD;CAKA,SAAS;EACP,OAAO,CAAI;CAcb;CAEA,oBAAoB;EAKlB,AAJA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO,OAAO,UAAU,GACxC,EAAoB,MAAM,CAAY,GACtC,KAAK,WAAW,OAAO;CACzB;CAEA,yBAAyB,GAAc,GAAyB,GAAyB;EAEvF,AADA,MAAM,yBAAyB,GAAM,GAAU,CAAQ,GACnD,MAAS,YAAY,MAAa,QAAQ,MAAa,QAAQ,KAAK,eACtE,KAAK,WAAW,OAAO,IAAI,UAAU;CAEzC;AACF;AA5DG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GAOxC,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA"}
+{"version":3,"file":"page-panel2.js","names":[],"sources":["../../../src/page/page-panel/page-panel.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport type { Size } from '@nvidia-elements/core/internal';\nimport {\n  appendRootNodeStyle,\n  attachInternals,\n  TypeExpandableController,\n  useStyles\n} from '@nvidia-elements/core/internal';\nimport styles from './page-panel.css?inline';\nimport globalStyles from './page-panel.global.css?inline';\n\n/**\n * @element nve-page-panel\n * @description Child panel for embedded panels within the page component. Typically used for left/right/bottom page slot positions.\n * @documentation https://nvidia.github.io/elements/docs/elements/page/\n * @entrypoint \\@nvidia-elements/core/page\n * @since 1.15.0\n * @event open - Dispatched after an invoker command removes `hidden` and opens the panel.\n * @event close - Dispatched after an invoker command sets `hidden` and closes the panel.\n * @slot - `nve-page-panel-content` elements that provide the panel body.\n * @slot actions - slot for action / dismiss buttons\n * @command --open - Removes `hidden` and dispatches `open`.\n * @command --close - Sets `hidden` and dispatches `close`.\n * @command --toggle - Toggles `hidden` and dispatches `open` or `close`.\n * @cssprop --background\n * @cssprop --border\n * @cssprop --color\n * @cssprop --gap\n * @cssprop --padding\n * @cssprop --height\n * @cssprop --width\n * @cssprop --max-width\n * @cssprop --max-height\n * @cssprop --animation-duration - Duration of panel open/close animations\n * @aria https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/region_role\n *\n */\nexport class PagePanel extends LitElement {\n  /**\n   * Sets the max size of the panel.\n   */\n  @property({ type: String, reflect: true }) size?: Size;\n\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-page-panel',\n    version: '0.0.0',\n    parents: ['nve-page']\n  };\n\n  static get observedAttributes() {\n    return [...super.observedAttributes, 'hidden'];\n  }\n\n  constructor() {\n    super();\n    new TypeExpandableController(this, { useHidden: true });\n  }\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  render() {\n    return html`\n    <div internal-host>\n      <div part=\"_header\">\n        <slot name=\"header\"></slot>\n        <slot name=\"actions\"></slot>\n      </div>\n      <div class=\"content\">\n        <slot></slot>\n      </div>\n      <div>\n        <slot name=\"footer\"></slot>\n      </div>\n    </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.states.delete('reopened');\n    appendRootNodeStyle(this, globalStyles);\n    this._internals.role = 'region';\n  }\n\n  attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null) {\n    super.attributeChangedCallback(name, oldValue, newValue);\n    if (name === 'hidden' && oldValue !== null && newValue === null && this.isConnected) {\n      this._internals.states.add('reopened');\n    }\n  }\n}\n"],"mappings":";;;;;;;;;;AAyCA,IAAa,IAAb,cAA+B,EAAW;;EAMxB,KAAA,SAAA,EAAU,CAAC,CAAM,CAAC;;;EAEP,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;GACT,SAAS,CAAC,UAAU;EACtB;;CAEA,WAAW,qBAAqB;EAC9B,OAAO,CAAC,GAAG,MAAM,oBAAoB,QAAQ;CAC/C;CAEA,cAAc;EAEZ,AADA,MAAM,GACN,IAAI,EAAyB,MAAM,EAAE,WAAW,GAAK,CAAC;CACxD;CAKA,SAAS;EACP,OAAO,CAAI;CAcb;CAEA,oBAAoB;EAKlB,AAJA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO,OAAO,UAAU,GACxC,EAAoB,MAAM,CAAY,GACtC,KAAK,WAAW,OAAO;CACzB;CAEA,yBAAyB,GAAc,GAAyB,GAAyB;EAEvF,AADA,MAAM,yBAAyB,GAAM,GAAU,CAAQ,GACnD,MAAS,YAAY,MAAa,QAAQ,MAAa,QAAQ,KAAK,eACtE,KAAK,WAAW,OAAO,IAAI,UAAU;CAEzC;AACF;AArDG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA"}

package/dist/page/page2.js

@@ -16,7 +16,7 @@ var c = class extends a {
 	static {
 		this.metadata = {
 			tag: "nve-page",
-			version: "2.19.0"
+			version: "2.20.0"
 		};
 	}
 	static {

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

@@ -12,7 +12,7 @@ var s = class extends a {
 	static {
 		this.metadata = {
 			tag: "nve-page-header",
-			version: "2.19.0"
+			version: "2.20.0"
 		};
 	}
 	render() {

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

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

package/dist/pagination/pagination2.js

@@ -1,39 +1,46 @@
-import { I18nController as e } from "../internal/controllers/i18n.controller.js";
-import { keyNavigationList as t } from "../internal/controllers/keynav-list.controller.js";
-import { attachInternals as n } from "../internal/utils/a11y.js";
-import { typeSSR as r } from "../internal/controllers/type-ssr.controller.js";
-import { scopedRegistry as i } from "../internal/decorators/scoped-registry.js";
-import { useStyles as a } from "../internal/styles/index.js";
-import { formatStandardNumber as o } from "../internal/utils/objects.js";
-import s from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
-import { IconButton as c } from "../icon-button/icon-button2.js";
-import { Select as l } from "../select/select2.js";
-import u from "./pagination.js";
-import { LitElement as d, html as f, nothing as p } from "lit";
-import { property as m } from "lit/decorators/property.js";
+import { keyNavigationList as e } from "../internal/controllers/keynav-list.controller.js";
+import { attachInternals as t } from "../internal/utils/a11y.js";
+import { typeSSR as n } from "../internal/controllers/type-ssr.controller.js";
+import { scopedRegistry as r } from "../internal/decorators/scoped-registry.js";
+import { useStyles as i } from "../internal/styles/index.js";
+import { formatStandardNumber as a } from "../internal/utils/objects.js";
+import o from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
+import { IconButton as s } from "../icon-button/icon-button2.js";
+import { Select as c } from "../select/select2.js";
+import l from "./pagination.js";
+import { LitElement as u, html as d, nothing as f } from "lit";
+import { property as p } from "lit/decorators/property.js";
+import { I18nController as m } from "@nvidia-elements/foundations/internal/i18n";
 import { FormControlMixin as h } from "@nvidia-elements/forms/mixins";
 //#region src/pagination/pagination.ts
-var g = class extends h(d) {
+var g = {
+	of: "of",
+	previous: "previous",
+	next: "next",
+	start: "start",
+	end: "end",
+	currentPage: "current page"
+}, _ = class extends h(u) {
 	#e;
 	static {
-		this.styles = a([u]);
+		this.styles = i([l]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-pagination",
-			version: "2.19.0",
+			version: "2.20.0",
 			valueSchema: { type: "number" }
 		};
 	}
 	static {
 		this.elementDefinitions = {
-			[c.metadata.tag]: c,
-			[l.metadata.tag]: l
+			[s.metadata.tag]: s,
+			[c.metadata.tag]: c
 		};
 	}
 	get keynavListConfig() {
 		return {
-			items: this.shadowRoot.querySelectorAll(`${c.metadata.tag}, input, select`),
+			items: this.shadowRoot.querySelectorAll(`${s.metadata.tag}, input, select`),
 			layout: "horizontal"
 		};
 	}
@@ -48,29 +55,29 @@ var g = class extends h(d) {
 	}
 	get #i() {
 		let e = (this.value - 1) * this.step + 1, t = Math.min(this.value * this.step, this.items || Infinity);
-		return `${o(e)}-${o(t)}`;
+		return `${a(e)}-${a(t)}`;
 	}
 	get #a() {
-		return this.items ? f`<label><slot name="suffix-label">${this.i18n.of} ${o(this.items)}</slot></label>` : p;
+		return this.items ? d`<label><slot name="suffix-label">${this.i18n.of} ${a(this.items)}</slot></label>` : f;
 	}
 	get #o() {
-		return f`<nve-icon-button part="icon-button previous-icon-button" @click="${() => this.#m(this.value - 1)}" .disabled="${this.disabled || this.#t <= this.step}" .ariaLabel="${this.i18n.previous}" container="inline" icon-name="chevron" direction="left"></nve-icon-button>`;
+		return d`<nve-icon-button part="icon-button previous-icon-button" @click="${() => this.#m(this.value - 1)}" .disabled="${this.disabled || this.#t <= this.step}" .ariaLabel="${this.i18n.previous}" container="inline" icon-name="chevron" direction="left"></nve-icon-button>`;
 	}
 	get #s() {
-		return f`<nve-icon-button part="icon-button next-icon-button" @click="${() => this.#m(this.value + 1)}" .disabled="${this.disabled || this.#t >= this.items}" .ariaLabel="${this.i18n.next}" container="inline" icon-name="chevron" direction="right"></nve-icon-button>`;
+		return d`<nve-icon-button part="icon-button next-icon-button" @click="${() => this.#m(this.value + 1)}" .disabled="${this.disabled || this.#t >= this.items}" .ariaLabel="${this.i18n.next}" container="inline" icon-name="chevron" direction="right"></nve-icon-button>`;
 	}
 	get #c() {
-		return f`<nve-icon-button part="icon-button start-icon-button" @click="${() => this.#m(1)}" .disabled="${this.disabled || this.#t <= this.step}" .ariaLabel="${this.i18n.start}" container="inline" icon-name="arrow-stop" direction="left"></nve-icon-button>`;
+		return d`<nve-icon-button part="icon-button start-icon-button" @click="${() => this.#m(1)}" .disabled="${this.disabled || this.#t <= this.step}" .ariaLabel="${this.i18n.start}" container="inline" icon-name="arrow-stop" direction="left"></nve-icon-button>`;
 	}
 	get #l() {
-		return f`<nve-icon-button part="icon-button end-icon-button" @click="${() => this.#m(this.items / this.step)}" .disabled="${this.disabled || (this.value - 1) * this.step + this.step >= this.items}" .ariaLabel="${this.i18n.end}" container="inline" icon-name="arrow-stop" direction="right"></nve-icon-button>`;
+		return d`<nve-icon-button part="icon-button end-icon-button" @click="${() => this.#m(this.items / this.step)}" .disabled="${this.disabled || (this.value - 1) * this.step + this.step >= this.items}" .ariaLabel="${this.i18n.end}" container="inline" icon-name="arrow-stop" direction="right"></nve-icon-button>`;
 	}
 	#u;
 	get #d() {
-		return this.disableStep ? f`<label>${this.#i} </label>` : f`<nve-select part="select" .container="${this.container}"><select .ariaLabel="${this.i18n.currentPage}" @change="${(e) => this.#p(parseInt(e.target.value, 10))}" value="${this.step}" .disabled="${this.disabled || this.disableStep}">${this.stepSizes.map((e) => f`<option ?selected="${this.step === e}" value="${e}">${e}</option>`)}</select><div class="select-label">${this.#i}</div></nve-select>`;
+		return this.disableStep ? d`<label>${this.#i} </label>` : d`<nve-select part="select" .container="${this.container}"><select .ariaLabel="${this.i18n.currentPage}" @change="${(e) => this.#p(parseInt(e.target.value, 10))}" value="${this.step}" .disabled="${this.disabled || this.disableStep}">${this.stepSizes.map((e) => d`<option ?selected="${this.step === e}" value="${e}">${e}</option>`)}</select><div class="select-label">${this.#i}</div></nve-select>`;
 	}
 	render() {
-		return f`<div internal-host role="presentation">${this.skippable && this.items ? f`${this.#c} ${this.#o} ${this.#d} ${this.#a} ${this.#s} ${this.#l}` : f`${this.#d} ${this.#a} ${this.#o} ${this.#s}`}</div>`;
+		return d`<div internal-host role="presentation">${this.skippable && this.items ? d`${this.#c} ${this.#o} ${this.#d} ${this.#a} ${this.#s} ${this.#l}` : d`${this.#d} ${this.#a} ${this.#o} ${this.#s}`}</div>`;
 	}
 	constructor() {
 		super(), this.step = 10, this.stepSizes = [
@@ -78,10 +85,10 @@ var g = class extends h(d) {
 			20,
 			50,
 			100
-		], this.#e = new e(this), this.i18n = this.#e.i18n, this.value = 1;
+		], this.#e = new m(this, g), this.i18n = this.#e.i18n, this.value = 1;
 	}
 	async connectedCallback() {
-		super.connectedCallback(), n(this), this._internals.role = "toolbar", await this.updateComplete, this.#f();
+		super.connectedCallback(), t(this), this._internals.role = "toolbar", await this.updateComplete, this.#f();
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback(), this.#u?.unobserve(this);
@@ -107,21 +114,21 @@ var g = class extends h(d) {
 		}));
 	}
 };
-s([m({ type: Number })], g.prototype, "step", void 0), s([m({
+o([p({ type: Number })], _.prototype, "step", void 0), o([p({
 	type: Array,
 	attribute: "step-sizes"
-})], g.prototype, "stepSizes", void 0), s([m({ type: Number })], g.prototype, "items", void 0), s([m({ type: Boolean })], g.prototype, "skippable", void 0), s([m({
+})], _.prototype, "stepSizes", void 0), o([p({ type: Number })], _.prototype, "items", void 0), o([p({ type: Boolean })], _.prototype, "skippable", void 0), o([p({
 	type: Boolean,
 	attribute: "disable-step"
-})], g.prototype, "disableStep", void 0), s([m({
+})], _.prototype, "disableStep", void 0), o([p({
 	type: String,
 	reflect: !0
-})], g.prototype, "container", void 0), s([m({ type: Object })], g.prototype, "i18n", void 0), g = s([
-	r(),
-	t(),
-	i()
-], g);
+})], _.prototype, "container", void 0), o([p({ type: Object })], _.prototype, "i18n", void 0), _ = o([
+	n(),
+	e(),
+	r()
+], _);
 //#endregion
-export { g as Pagination };
+export { _ as Pagination };
 
 //# sourceMappingURL=pagination2.js.map