@nvidia-elements/core 0.2.2 → 0.2.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (141) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/dist/accordion/accordion2.js +39 -39
  3. package/dist/alert/alert-group2.js +14 -14
  4. package/dist/alert/alert2.js +20 -20
  5. package/dist/avatar/avatar-group2.js +1 -1
  6. package/dist/avatar/avatar2.js +6 -6
  7. package/dist/badge/badge2.js +21 -21
  8. package/dist/breadcrumb/breadcrumb2.js +12 -12
  9. package/dist/bundles/index.d.ts +418 -1802
  10. package/dist/bundles/index.js +6 -6
  11. package/dist/button/button.d.ts +5 -2
  12. package/dist/button/button2.js +13 -13
  13. package/dist/button/button2.js.map +1 -1
  14. package/dist/button-group/button-group2.js +15 -15
  15. package/dist/card/card2.js +17 -17
  16. package/dist/chat-message/chat-message2.js +7 -7
  17. package/dist/checkbox/checkbox-group2.js +7 -7
  18. package/dist/checkbox/checkbox2.js +7 -7
  19. package/dist/color/color2.js +7 -7
  20. package/dist/combobox/combobox2.js +10 -10
  21. package/dist/copy-button/copy-button2.js +10 -10
  22. package/dist/custom-elements-jsx.d.ts +346 -613
  23. package/dist/custom-elements-vue.d.ts +346 -613
  24. package/dist/custom-elements.json +4870 -14220
  25. package/dist/data.html.json +252 -168
  26. package/dist/data.snippets.json +42 -42
  27. package/dist/date/date2.js +7 -7
  28. package/dist/datetime/datetime2.js +7 -7
  29. package/dist/dialog/dialog-footer2.js +6 -6
  30. package/dist/dialog/dialog-header2.js +6 -6
  31. package/dist/dialog/dialog2.js +19 -19
  32. package/dist/divider/divider2.js +5 -5
  33. package/dist/dot/dot2.js +8 -8
  34. package/dist/drawer/drawer-content2.js +6 -6
  35. package/dist/drawer/drawer-footer2.js +6 -6
  36. package/dist/drawer/drawer-header2.js +6 -6
  37. package/dist/drawer/drawer2.js +19 -19
  38. package/dist/dropdown/dropdown-footer2.js +6 -6
  39. package/dist/dropdown/dropdown-header2.js +6 -6
  40. package/dist/dropdown/dropdown2.js +16 -16
  41. package/dist/dropdown-group/dropdown-group.js +16 -16
  42. package/dist/dropzone/dropzone.d.ts +1 -404
  43. package/dist/dropzone/dropzone2.js +14 -14
  44. package/dist/dropzone/dropzone2.js.map +1 -1
  45. package/dist/file/file2.js +1 -1
  46. package/dist/format-datetime/format-datetime2.js +10 -10
  47. package/dist/format-number/format-number2.js +16 -16
  48. package/dist/format-relative-time/format-relative-time2.js +7 -7
  49. package/dist/forms/control/control2.js +19 -19
  50. package/dist/forms/control-group/control-group2.js +6 -6
  51. package/dist/forms/control-message/control-message2.js +9 -9
  52. package/dist/grid/cell/cell2.js +1 -1
  53. package/dist/grid/column/column2.js +10 -10
  54. package/dist/grid/footer/footer2.js +6 -6
  55. package/dist/grid/grid2.js +12 -12
  56. package/dist/grid/header/header2.js +9 -9
  57. package/dist/grid/placeholder/placeholder2.js +1 -1
  58. package/dist/grid/row/row2.js +9 -9
  59. package/dist/icon/icon2.js +15 -15
  60. package/dist/icon-button/icon-button2.js +9 -9
  61. package/dist/index.js +4 -4
  62. package/dist/input/input-group2.js +1 -1
  63. package/dist/input/input2.js +6 -6
  64. package/dist/internal/controllers/keynav-grid.controller.js +39 -39
  65. package/dist/internal/controllers/type-button.controller.examples.js.map +1 -1
  66. package/dist/internal/controllers/type-button.controller.examples.json +1 -1
  67. package/dist/internal/controllers/type-command.controller.d.ts +10 -1
  68. package/dist/internal/controllers/type-command.controller.js +23 -14
  69. package/dist/internal/controllers/type-command.controller.js.map +1 -1
  70. package/dist/internal/controllers/type-native-popover.utils.js +7 -7
  71. package/dist/internal/index.d.ts +0 -1
  72. package/dist/internal/index.js +40 -41
  73. package/dist/internal/services/global.service.js +1 -1
  74. package/dist/logo/logo2.js +6 -6
  75. package/dist/menu/menu-item.d.ts +4 -2
  76. package/dist/menu/menu-item2.js +12 -12
  77. package/dist/menu/menu-item2.js.map +1 -1
  78. package/dist/menu/menu2.js +10 -10
  79. package/dist/month/month2.js +7 -7
  80. package/dist/notification/notification-group2.js +11 -11
  81. package/dist/notification/notification2.js +22 -22
  82. package/dist/page/page-panel/page-panel-content2.js +1 -1
  83. package/dist/page/page-panel/page-panel-footer2.js +6 -6
  84. package/dist/page/page-panel/page-panel-header2.js +6 -6
  85. package/dist/page/page-panel/page-panel2.js +14 -14
  86. package/dist/page/page2.js +9 -9
  87. package/dist/page-header/page-header2.js +1 -1
  88. package/dist/page-loader/page-loader2.js +10 -10
  89. package/dist/pagination/pagination.d.ts +1 -404
  90. package/dist/pagination/pagination2.js +17 -17
  91. package/dist/pagination/pagination2.js.map +1 -1
  92. package/dist/panel/panel2.js +21 -21
  93. package/dist/password/password2.js +7 -7
  94. package/dist/preferences-input/preferences-input.d.ts +1 -404
  95. package/dist/preferences-input/preferences-input2.js +9 -9
  96. package/dist/preferences-input/preferences-input2.js.map +1 -1
  97. package/dist/progress-bar/progress-bar2.js +8 -8
  98. package/dist/progress-ring/progress-ring2.js +15 -15
  99. package/dist/progressive-filter-chip/progressive-filter-chip2.js +15 -15
  100. package/dist/pulse/pulse2.js +6 -6
  101. package/dist/radio/radio-group2.js +7 -7
  102. package/dist/radio/radio2.js +7 -7
  103. package/dist/range/range2.js +5 -5
  104. package/dist/resize-handle/resize-handle.d.ts +1 -404
  105. package/dist/resize-handle/resize-handle2.js +16 -16
  106. package/dist/resize-handle/resize-handle2.js.map +1 -1
  107. package/dist/search/search2.js +8 -8
  108. package/dist/select/select2.js +18 -18
  109. package/dist/skeleton/skeleton2.js +7 -7
  110. package/dist/sort-button/sort-button.d.ts +4 -2
  111. package/dist/sort-button/sort-button2.js +19 -19
  112. package/dist/sort-button/sort-button2.js.map +1 -1
  113. package/dist/sparkline/sparkline2.js +14 -14
  114. package/dist/star-rating/star-rating2.js +6 -6
  115. package/dist/steps/steps.d.ts +4 -2
  116. package/dist/steps/steps2.js +36 -36
  117. package/dist/steps/steps2.js.map +1 -1
  118. package/dist/switch/switch-group2.js +6 -6
  119. package/dist/switch/switch2.js +7 -7
  120. package/dist/tabs/tabs-group2.js +21 -21
  121. package/dist/tabs/tabs.d.ts +4 -2
  122. package/dist/tabs/tabs2.js +30 -30
  123. package/dist/tabs/tabs2.js.map +1 -1
  124. package/dist/tag/tag.d.ts +5 -2
  125. package/dist/tag/tag2.js +20 -20
  126. package/dist/tag/tag2.js.map +1 -1
  127. package/dist/textarea/textarea2.js +1 -1
  128. package/dist/time/time2.js +7 -7
  129. package/dist/toast/toast2.js +21 -21
  130. package/dist/toggletip/toggletip-footer2.js +6 -6
  131. package/dist/toggletip/toggletip-header2.js +6 -6
  132. package/dist/toggletip/toggletip2.js +17 -17
  133. package/dist/toolbar/toolbar2.js +11 -11
  134. package/dist/tooltip/tooltip2.js +16 -16
  135. package/dist/tree/tree-node2.js +30 -30
  136. package/dist/tree/tree2.js +14 -14
  137. package/dist/week/week2.js +7 -7
  138. package/package.json +3 -3
  139. package/dist/internal/base/button.d.ts +0 -114
  140. package/dist/internal/base/button.js +0 -117
  141. package/dist/internal/base/button.js.map +0 -1
@@ -1,8 +1,8 @@
1
- import { generateId as e, sameOrderedStringArray as t, uniqueNonEmptyStrings as n } from "../internal/utils/dom.js";
2
- import { attachInternals as r } from "../internal/utils/a11y.js";
3
- import { __decorate as i } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
4
- import { audit as a } from "../internal/controllers/audit.controller.js";
5
- import { useStyles as o } from "../internal/styles/index.js";
1
+ import { audit as e } from "../internal/controllers/audit.controller.js";
2
+ import { generateId as t, sameOrderedStringArray as n, uniqueNonEmptyStrings as r } from "../internal/utils/dom.js";
3
+ import { attachInternals as i } from "../internal/utils/a11y.js";
4
+ import { useStyles as a } from "../internal/styles/index.js";
5
+ import { __decorate as o } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
6
6
  import { Tabs as s } from "./tabs2.js";
7
7
  import c from "./tabs-group.js";
8
8
  import { LitElement as l, html as u } from "lit";
@@ -28,12 +28,12 @@ var m, h = class extends l {
28
28
  };
29
29
  }
30
30
  static {
31
- this.styles = o([c]);
31
+ this.styles = a([c]);
32
32
  }
33
33
  static {
34
34
  this.metadata = {
35
35
  tag: "nve-tabs-group",
36
- version: "0.2.2",
36
+ version: "0.2.3",
37
37
  children: ["nve-tabs"]
38
38
  };
39
39
  }
@@ -55,7 +55,7 @@ var m, h = class extends l {
55
55
  return u`<div internal-host><slot @slotchange="${this.#t}"></slot>${this.panelValues.map((e) => u`<slot name="${e}" @slotchange="${this.#n}"></slot>`)}</div>`;
56
56
  }
57
57
  connectedCallback() {
58
- super.connectedCallback(), r(this), this._internals.role = "group", this.addEventListener("command", this.#r);
58
+ super.connectedCallback(), i(this), this._internals.role = "group", this.addEventListener("command", this.#r);
59
59
  }
60
60
  firstUpdated() {
61
61
  this.updateComplete.then(() => {
@@ -79,18 +79,18 @@ var m, h = class extends l {
79
79
  e && (this.#e = new MutationObserver(() => this.#a()), this.#e.observe(e, m.subtreeObserverInit));
80
80
  }
81
81
  #a() {
82
- let e = this.#d(), t = n(e.map((e) => e.value)), r = this.#m(e);
83
- if (!r) {
82
+ let e = this.#d(), t = r(e.map((e) => e.value)), n = this.#m(e);
83
+ if (!n) {
84
84
  e.forEach((e) => e.selected = !1), this.#s(t, "");
85
85
  return;
86
86
  }
87
- this.#o(e, r, {
87
+ this.#o(e, n, {
88
88
  emitEvent: !1,
89
89
  nextPanelValues: t
90
90
  });
91
91
  }
92
- #o(e, t, r) {
93
- let { emitEvent: i } = r, a = r.nextPanelValues ?? n(e.map((e) => e.value)), o = this.selectedValue !== t.value || !t.selected || e.some((e) => e !== t && e.selected);
92
+ #o(e, t, n) {
93
+ let { emitEvent: i } = n, a = n.nextPanelValues ?? r(e.map((e) => e.value)), o = this.selectedValue !== t.value || !t.selected || e.some((e) => e !== t && e.selected);
94
94
  e.forEach((e) => {
95
95
  e.selected = e === t;
96
96
  }), this.#s(a, t.value), i && o && this.dispatchEvent(new CustomEvent("select", {
@@ -99,8 +99,8 @@ var m, h = class extends l {
99
99
  detail: { value: t.value }
100
100
  }));
101
101
  }
102
- #s(e, n) {
103
- t(this.panelValues, e) || (this.panelValues = e), this.selectedValue !== n && (this.selectedValue = n);
102
+ #s(e, t) {
103
+ n(this.panelValues, e) || (this.panelValues = e), this.selectedValue !== t && (this.selectedValue = t);
104
104
  }
105
105
  #c() {
106
106
  let e = this.#d(), t = new Map(e.filter((e) => this.#p(e)).map((e) => [e.value, e]));
@@ -108,16 +108,16 @@ var m, h = class extends l {
108
108
  this.#l(e, t);
109
109
  });
110
110
  }
111
- #l(t, n) {
112
- let r = n.get(t.name), i = t.assignedElements({ flatten: !0 });
111
+ #l(e, n) {
112
+ let r = n.get(e.name), i = e.assignedElements({ flatten: !0 });
113
113
  if (!r) {
114
114
  i.forEach((e) => {
115
115
  e.hidden = !0;
116
116
  });
117
117
  return;
118
118
  }
119
- r.id ||= e(), i.forEach((n, i) => {
120
- n.id ||= e(), !r.hasAttribute("aria-controls") && i === 0 && r.setAttribute("aria-controls", n.id), n.hasAttribute("aria-labelledby") || n.setAttribute("aria-labelledby", r.id), n.hasAttribute("role") || n.setAttribute("role", "tabpanel"), n.hidden = t.name !== this.selectedValue;
119
+ r.id ||= t(), i.forEach((n, i) => {
120
+ n.id ||= t(), !r.hasAttribute("aria-controls") && i === 0 && r.setAttribute("aria-controls", n.id), n.hasAttribute("aria-labelledby") || n.setAttribute("aria-labelledby", r.id), n.hasAttribute("role") || n.setAttribute("role", "tabpanel"), n.hidden = e.name !== this.selectedValue;
121
121
  });
122
122
  }
123
123
  #u() {
@@ -137,10 +137,10 @@ var m, h = class extends l {
137
137
  return e.find((e) => this.#p(e) && e.selected) ?? e.find((e) => this.#p(e));
138
138
  }
139
139
  };
140
- i([p({ flatten: !0 })], h.prototype, "defaultSlotElements", void 0), i([d({
140
+ o([p({ flatten: !0 })], h.prototype, "defaultSlotElements", void 0), o([d({
141
141
  type: String,
142
142
  reflect: !0
143
- })], h.prototype, "alignment", void 0), i([f()], h.prototype, "panelValues", void 0), i([f()], h.prototype, "selectedValue", void 0), h = m = i([a()], h);
143
+ })], h.prototype, "alignment", void 0), o([f()], h.prototype, "panelValues", void 0), o([f()], h.prototype, "selectedValue", void 0), h = m = o([e()], h);
144
144
  //#endregion
145
145
  export { h as TabsGroup };
146
146
 
@@ -1,5 +1,6 @@
1
1
  import { PropertyValues, LitElement } from 'lit';
2
- import { KeynavListConfig, BaseButton } from '../internal';
2
+ import { KeynavListConfig } from '../internal';
3
+ declare const TabsItem_base: import('@nvidia-elements/forms/mixins').ButtonFormControlMixinReturn<typeof LitElement>;
3
4
  /**
4
5
  * @element nve-tabs-item
5
6
  * @description Represents an individual tab within a tablist, providing a selectable button for switching between content views.
@@ -23,7 +24,7 @@ import { KeynavListConfig, BaseButton } from '../internal';
23
24
  * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/
24
25
  * @responsive false
25
26
  */
26
- export declare class TabsItem extends BaseButton {
27
+ export declare class TabsItem extends TabsItem_base {
27
28
  /**
28
29
  * Determines which tab item the user selects, defaults to false.
29
30
  */
@@ -83,3 +84,4 @@ export declare class Tabs extends LitElement {
83
84
  disconnectedCallback(): void;
84
85
  updated(props: PropertyValues<this>): void;
85
86
  }
87
+ export {};
@@ -1,31 +1,31 @@
1
- import { appendAnchorName as e, appendRootNodeStyle as t, removeAnchorName as n } from "../internal/utils/dom.js";
2
- import { attachInternals as r } from "../internal/utils/a11y.js";
3
- import { stateSelected as i } from "../internal/controllers/state-selected.controller.js";
4
- import { __decorate as a } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
5
- import { BaseButton as o } from "../internal/base/button.js";
6
- import { audit as s } from "../internal/controllers/audit.controller.js";
7
- import { keyNavigationList as c } from "../internal/controllers/keynav-list.controller.js";
8
- import { useStyles as l } from "../internal/styles/index.js";
9
- import u from "./tabs.global.js";
10
- import d from "./tabs-item.js";
11
- import f from "./tabs.js";
12
- import { LitElement as p, html as m } from "lit";
13
- import { property as h } from "lit/decorators/property.js";
1
+ import { audit as e } from "../internal/controllers/audit.controller.js";
2
+ import { appendAnchorName as t, appendRootNodeStyle as n, removeAnchorName as r } from "../internal/utils/dom.js";
3
+ import { keyNavigationList as i } from "../internal/controllers/keynav-list.controller.js";
4
+ import { attachInternals as a } from "../internal/utils/a11y.js";
5
+ import { stateSelected as o } from "../internal/controllers/state-selected.controller.js";
6
+ import { useStyles as s } from "../internal/styles/index.js";
7
+ import { __decorate as c } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
8
+ import l from "./tabs.global.js";
9
+ import u from "./tabs-item.js";
10
+ import d from "./tabs.js";
11
+ import { LitElement as f, html as p } from "lit";
12
+ import { property as m } from "lit/decorators/property.js";
13
+ import { ButtonFormControlMixin as h } from "@nvidia-elements/forms/mixins";
14
14
  import { queryAssignedElements as g } from "lit/decorators/query-assigned-elements.js";
15
15
  //#region src/tabs/tabs.ts
16
- var _ = class extends o {
16
+ var _ = class extends h(f) {
17
17
  static {
18
- this.styles = l([d]);
18
+ this.styles = s([u]);
19
19
  }
20
20
  static {
21
21
  this.metadata = {
22
22
  tag: "nve-tabs-item",
23
- version: "0.2.2",
23
+ version: "0.2.3",
24
24
  parents: ["nve-tabs"]
25
25
  };
26
26
  }
27
27
  render() {
28
- return m`<div internal-host focus-within><slot></slot></div>`;
28
+ return p`<div internal-host focus-within><slot></slot></div>`;
29
29
  }
30
30
  constructor() {
31
31
  super(), this.selected = !1, this.type = "button";
@@ -33,27 +33,27 @@ var _ = class extends o {
33
33
  connectedCallback() {
34
34
  super.connectedCallback(), this._internals.role = "tab";
35
35
  }
36
- updated(t) {
37
- t.has("selected") && (this.selected ? e(this, "--selected") : n(this, "--selected"));
36
+ updated(e) {
37
+ super.updated(e), e.has("selected") && (this.selected ? t(this, "--selected") : r(this, "--selected"));
38
38
  }
39
39
  };
40
- a([h({
40
+ c([m({
41
41
  type: Boolean,
42
42
  reflect: !0
43
- })], _.prototype, "selected", void 0), _ = a([s(), i()], _);
44
- var v = class extends p {
43
+ })], _.prototype, "selected", void 0), _ = c([e(), o()], _);
44
+ var v = class extends f {
45
45
  constructor(...e) {
46
46
  super(...e), this.vertical = !1, this.borderless = !1, this.behaviorSelect = !1, this.#t = (e) => {
47
47
  this.#e(e.target);
48
48
  };
49
49
  }
50
50
  static {
51
- this.styles = l([f]);
51
+ this.styles = s([d]);
52
52
  }
53
53
  static {
54
54
  this.metadata = {
55
55
  tag: "nve-tabs",
56
- version: "0.2.2",
56
+ version: "0.2.3",
57
57
  children: ["nve-tabs-item"]
58
58
  };
59
59
  }
@@ -67,10 +67,10 @@ var v = class extends p {
67
67
  !this.behaviorSelect || !e.matches("nve-tabs-item") || e.disabled || (this.keynavListConfig.items.forEach((e) => e.selected = !1), e.selected = !0);
68
68
  }
69
69
  render() {
70
- return m`<div internal-host><slot></slot></div>`;
70
+ return p`<div internal-host><slot></slot></div>`;
71
71
  }
72
72
  connectedCallback() {
73
- super.connectedCallback(), t(this, u), r(this), this._internals.role = "tablist", this.addEventListener("click", this.#t);
73
+ super.connectedCallback(), n(this, l), a(this), this._internals.role = "tablist", this.addEventListener("click", this.#t);
74
74
  }
75
75
  disconnectedCallback() {
76
76
  super.disconnectedCallback(), this.removeEventListener("click", this.#t);
@@ -80,16 +80,16 @@ var v = class extends p {
80
80
  super.updated(e), this._internals.ariaOrientation = this.vertical ? "vertical" : "horizontal";
81
81
  }
82
82
  };
83
- a([h({
83
+ c([m({
84
84
  type: Boolean,
85
85
  reflect: !0
86
- })], v.prototype, "vertical", void 0), a([h({
86
+ })], v.prototype, "vertical", void 0), c([m({
87
87
  type: Boolean,
88
88
  reflect: !0
89
- })], v.prototype, "borderless", void 0), a([h({
89
+ })], v.prototype, "borderless", void 0), c([m({
90
90
  type: Boolean,
91
91
  attribute: "behavior-select"
92
- })], v.prototype, "behaviorSelect", void 0), a([g()], v.prototype, "items", void 0), v = a([s(), c()], v);
92
+ })], v.prototype, "behaviorSelect", void 0), c([g()], v.prototype, "items", void 0), v = c([e(), i()], v);
93
93
  //#endregion
94
94
  export { v as Tabs, _ as TabsItem };
95
95
 
@@ -1 +1 @@
1
- {"version":3,"file":"tabs2.js","names":["#selectTab","#onClick"],"sources":["../../src/tabs/tabs.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 { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport type { KeynavListConfig } from '@nvidia-elements/core/internal';\nimport {\n BaseButton,\n stateSelected,\n useStyles,\n keyNavigationList,\n attachInternals,\n audit,\n appendRootNodeStyle,\n appendAnchorName,\n removeAnchorName\n} from '@nvidia-elements/core/internal';\nimport globalStyles from './tabs.global.css?inline';\nimport tabsItemStyleSheet from './tabs-item.css?inline';\nimport tabsStyleSheet from './tabs.css?inline';\n\n/**\n * @element nve-tabs-item\n * @description Represents an individual tab within a tablist, providing a selectable button for switching between content views.\n * @since 0.10.0\n * @entrypoint \\@nvidia-elements/core/tabs\n * @slot - default slot for content\n * @cssprop --font-size\n * @cssprop --border-width\n * @cssprop --border-height\n * @cssprop --border-top\n * @cssprop --border-background\n * @cssprop --width\n * @cssprop --padding\n * @cssprop --font-size\n * @cssprop --font-weight\n * @cssprop --border-radius\n * @cssprop --color\n * @cssprop --height\n * @cssprop --cursor\n * @cssprop --text-transform\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n * @responsive false\n */\n@audit()\n@stateSelected<TabsItem>()\nexport class TabsItem extends BaseButton {\n /**\n * Determines which tab item the user selects, defaults to false.\n */\n @property({ type: Boolean, reflect: true }) selected = false;\n\n static styles = useStyles([tabsItemStyleSheet]);\n\n static readonly metadata = {\n tag: 'nve-tabs-item',\n version: '0.0.0',\n parents: ['nve-tabs']\n };\n\n render() {\n return html`\n <div internal-host focus-within>\n <slot></slot>\n </div>\n `;\n }\n\n constructor() {\n super();\n this.type = 'button';\n }\n\n connectedCallback() {\n super.connectedCallback();\n this._internals.role = 'tab';\n }\n\n updated(props: PropertyValues<this>) {\n if (props.has('selected')) {\n if (this.selected) {\n appendAnchorName(this, '--selected');\n } else {\n removeAnchorName(this, '--selected');\n }\n }\n }\n}\n\n/**\n * @element nve-tabs\n * @description Tabs provide a selection UX, typically used for swapping content shown on a page, or within a navigation context.\n * @since 0.10.0\n * @entrypoint \\@nvidia-elements/core/tabs\n * @slot - default slot for tab-item\n * @cssprop --gap\n * @cssprop --indicator-background\n * @cssprop --indicator-border-radius\n * @cssprop --indicator-height\n * @cssprop --border-inset\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n * @responsive false\n */\n@audit()\n@keyNavigationList<Tabs>()\nexport class Tabs extends LitElement {\n /**\n * Determines whether the tabs should display in a vertical layout vs. defaulting to horizontal.\n */\n @property({ type: Boolean, reflect: true }) vertical = false;\n\n /**\n * Determines whether the tabs should display a border on selected items vs. defaults to show border.\n */\n @property({ type: Boolean, reflect: true }) borderless = false;\n\n /**\n * Determines whether the tabs should handle selection behavior vs. defaults to off.\n */\n @property({ type: Boolean, attribute: 'behavior-select' }) behaviorSelect = false;\n\n static styles = useStyles([tabsStyleSheet]);\n\n static readonly metadata = {\n tag: 'nve-tabs',\n version: '0.0.0',\n children: ['nve-tabs-item']\n };\n\n /** @private */\n get keynavListConfig(): KeynavListConfig {\n return {\n items: this.items,\n layout: this.vertical ? 'vertical' : 'horizontal'\n };\n }\n\n @queryAssignedElements() private items!: TabsItem[];\n\n /** @private */\n declare _internals: ElementInternals;\n\n #selectTab(tabItem: HTMLElement & { matches: Element['matches']; disabled?: boolean; selected?: boolean }) {\n if (!this.behaviorSelect || !tabItem.matches('nve-tabs-item') || tabItem.disabled) {\n return;\n }\n\n this.keynavListConfig.items.forEach((i: HTMLElement) => ((i as TabsItem).selected = false));\n tabItem.selected = true;\n }\n\n render() {\n return html`\n <div internal-host>\n <slot></slot>\n </div>\n `;\n }\n\n connectedCallback() {\n super.connectedCallback();\n appendRootNodeStyle(this, globalStyles);\n attachInternals(this);\n this._internals.role = 'tablist';\n this.addEventListener('click', this.#onClick);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('click', this.#onClick);\n }\n\n #onClick = (e: Event) => {\n this.#selectTab(e.target as HTMLElement & { matches: Element['matches']; disabled?: boolean; selected?: boolean });\n };\n\n updated(props: PropertyValues<this>) {\n super.updated(props);\n this._internals.ariaOrientation = this.vertical ? 'vertical' : 'horizontal';\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;AAgDO,IAAA,IAAA,cAAuB,EAAW;;gBAMvB,EAAU,CAAC,CAAkB,CAAC;;;kBAEnB;GACzB,KAAK;GACL,SAAS;GACT,SAAS,CAAC,UAAU;EACtB;;CAEA,SAAS;EACP,OAAO,CAAI;CAKb;CAEA,cAAc;EAEZ,AADA,MAAM,mBAnB+C,IAoBrD,KAAK,OAAO;CACd;CAEA,oBAAoB;EAElB,AADA,MAAM,kBAAkB,GACxB,KAAK,WAAW,OAAO;CACzB;CAEA,QAAQ,GAA6B;EACnC,AAAI,EAAM,IAAI,UAAU,MAClB,KAAK,WACP,EAAiB,MAAM,YAAY,IAEnC,EAAiB,MAAM,YAAY;CAGzC;AACF;GArCG,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,UAN3C,EAAM,GACN,EAAwB,CAAA,GAAA,CAAA;AA4DlB,IAAA,IAAA,cAAmB,EAAW;;+BAIoB,sBAKE,0BAKmB,eAqDhE,MAAa;GACvB,KAAKA,GAAW,EAAE,MAA+F;EACnH;;;gBArDgB,EAAU,CAAC,CAAc,CAAC;;;kBAEf;GACzB,KAAK;GACL,SAAS;GACT,UAAU,CAAC,eAAe;EAC5B;;CAGA,IAAI,mBAAqC;EACvC,OAAO;GACL,OAAO,KAAK;GACZ,QAAQ,KAAK,WAAW,aAAa;EACvC;CACF;CAOA,GAAW,GAAgG;EACrG,CAAC,KAAK,kBAAkB,CAAC,EAAQ,QAAQ,eAAe,KAAK,EAAQ,aAIzE,KAAK,iBAAiB,MAAM,SAAS,MAAoB,EAAgB,WAAW,EAAM,GAC1F,EAAQ,WAAW;CACrB;CAEA,SAAS;EACP,OAAO,CAAI;CAKb;CAEA,oBAAoB;EAKlB,AAJA,MAAM,kBAAkB,GACxB,EAAoB,MAAM,CAAY,GACtC,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO,WACvB,KAAK,iBAAiB,SAAS,KAAKC,EAAQ;CAC9C;CAEA,uBAAuB;EAErB,AADA,MAAM,qBAAqB,GAC3B,KAAK,oBAAoB,SAAS,KAAKA,EAAQ;CACjD;CAEA;CAIA,QAAQ,GAA6B;EAEnC,AADA,MAAM,QAAQ,CAAK,GACnB,KAAK,WAAW,kBAAkB,KAAK,WAAW,aAAa;CACjE;AACF;GAvEG,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,MAKzC,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,cAAA,KAAA,CAAA,MAKzC,EAAS;CAAE,MAAM;CAAS,WAAW;AAAkB,CAAC,CAAA,GAAA,EAAA,WAAA,kBAAA,KAAA,CAAA,MAkBxD,EAAsB,CAAA,GAAA,EAAA,WAAA,SAAA,KAAA,CAAA,UAlCxB,EAAM,GACN,EAAwB,CAAA,GAAA,CAAA"}
1
+ {"version":3,"file":"tabs2.js","names":["#selectTab","#onClick"],"sources":["../../src/tabs/tabs.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 { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport { ButtonFormControlMixin } from '@nvidia-elements/forms/mixins';\nimport type { KeynavListConfig } from '@nvidia-elements/core/internal';\nimport {\n stateSelected,\n useStyles,\n keyNavigationList,\n attachInternals,\n audit,\n appendRootNodeStyle,\n appendAnchorName,\n removeAnchorName\n} from '@nvidia-elements/core/internal';\nimport globalStyles from './tabs.global.css?inline';\nimport tabsItemStyleSheet from './tabs-item.css?inline';\nimport tabsStyleSheet from './tabs.css?inline';\n\n/**\n * @element nve-tabs-item\n * @description Represents an individual tab within a tablist, providing a selectable button for switching between content views.\n * @since 0.10.0\n * @entrypoint \\@nvidia-elements/core/tabs\n * @slot - default slot for content\n * @cssprop --font-size\n * @cssprop --border-width\n * @cssprop --border-height\n * @cssprop --border-top\n * @cssprop --border-background\n * @cssprop --width\n * @cssprop --padding\n * @cssprop --font-size\n * @cssprop --font-weight\n * @cssprop --border-radius\n * @cssprop --color\n * @cssprop --height\n * @cssprop --cursor\n * @cssprop --text-transform\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n * @responsive false\n */\n@audit()\n@stateSelected<TabsItem>()\nexport class TabsItem extends ButtonFormControlMixin(LitElement) {\n /**\n * Determines which tab item the user selects, defaults to false.\n */\n @property({ type: Boolean, reflect: true }) selected = false;\n\n static styles = useStyles([tabsItemStyleSheet]);\n\n static readonly metadata = {\n tag: 'nve-tabs-item',\n version: '0.0.0',\n parents: ['nve-tabs']\n };\n\n render() {\n return html`\n <div internal-host focus-within>\n <slot></slot>\n </div>\n `;\n }\n\n constructor() {\n super();\n this.type = 'button';\n }\n\n connectedCallback() {\n super.connectedCallback();\n this._internals.role = 'tab';\n }\n\n updated(props: PropertyValues<this>) {\n super.updated(props);\n\n if (props.has('selected')) {\n if (this.selected) {\n appendAnchorName(this, '--selected');\n } else {\n removeAnchorName(this, '--selected');\n }\n }\n }\n}\n\n/**\n * @element nve-tabs\n * @description Tabs provide a selection UX, typically used for swapping content shown on a page, or within a navigation context.\n * @since 0.10.0\n * @entrypoint \\@nvidia-elements/core/tabs\n * @slot - default slot for tab-item\n * @cssprop --gap\n * @cssprop --indicator-background\n * @cssprop --indicator-border-radius\n * @cssprop --indicator-height\n * @cssprop --border-inset\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n * @responsive false\n */\n@audit()\n@keyNavigationList<Tabs>()\nexport class Tabs extends LitElement {\n /**\n * Determines whether the tabs should display in a vertical layout vs. defaulting to horizontal.\n */\n @property({ type: Boolean, reflect: true }) vertical = false;\n\n /**\n * Determines whether the tabs should display a border on selected items vs. defaults to show border.\n */\n @property({ type: Boolean, reflect: true }) borderless = false;\n\n /**\n * Determines whether the tabs should handle selection behavior vs. defaults to off.\n */\n @property({ type: Boolean, attribute: 'behavior-select' }) behaviorSelect = false;\n\n static styles = useStyles([tabsStyleSheet]);\n\n static readonly metadata = {\n tag: 'nve-tabs',\n version: '0.0.0',\n children: ['nve-tabs-item']\n };\n\n /** @private */\n get keynavListConfig(): KeynavListConfig {\n return {\n items: this.items,\n layout: this.vertical ? 'vertical' : 'horizontal'\n };\n }\n\n @queryAssignedElements() private items!: TabsItem[];\n\n /** @private */\n declare _internals: ElementInternals;\n\n #selectTab(tabItem: HTMLElement & { matches: Element['matches']; disabled?: boolean; selected?: boolean }) {\n if (!this.behaviorSelect || !tabItem.matches('nve-tabs-item') || tabItem.disabled) {\n return;\n }\n\n this.keynavListConfig.items.forEach((i: HTMLElement) => ((i as TabsItem).selected = false));\n tabItem.selected = true;\n }\n\n render() {\n return html`\n <div internal-host>\n <slot></slot>\n </div>\n `;\n }\n\n connectedCallback() {\n super.connectedCallback();\n appendRootNodeStyle(this, globalStyles);\n attachInternals(this);\n this._internals.role = 'tablist';\n this.addEventListener('click', this.#onClick);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('click', this.#onClick);\n }\n\n #onClick = (e: Event) => {\n this.#selectTab(e.target as HTMLElement & { matches: Element['matches']; disabled?: boolean; selected?: boolean });\n };\n\n updated(props: PropertyValues<this>) {\n super.updated(props);\n this._internals.ariaOrientation = this.vertical ? 'vertical' : 'horizontal';\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;AAgDO,IAAA,IAAA,cAAuB,EAAuB,CAAU,EAAE;;gBAM/C,EAAU,CAAC,CAAkB,CAAC;;;kBAEnB;GACzB,KAAK;GACL,SAAS;GACT,SAAS,CAAC,UAAU;EACtB;;CAEA,SAAS;EACP,OAAO,CAAI;CAKb;CAEA,cAAc;EAEZ,AADA,MAAM,mBAnB+C,IAoBrD,KAAK,OAAO;CACd;CAEA,oBAAoB;EAElB,AADA,MAAM,kBAAkB,GACxB,KAAK,WAAW,OAAO;CACzB;CAEA,QAAQ,GAA6B;EAGnC,AAFA,MAAM,QAAQ,CAAK,GAEf,EAAM,IAAI,UAAU,MAClB,KAAK,WACP,EAAiB,MAAM,YAAY,IAEnC,EAAiB,MAAM,YAAY;CAGzC;AACF;GAvCG,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,UAN3C,EAAM,GACN,EAAwB,CAAA,GAAA,CAAA;AA8DlB,IAAA,IAAA,cAAmB,EAAW;;+BAIoB,sBAKE,0BAKmB,eAqDhE,MAAa;GACvB,KAAKA,GAAW,EAAE,MAA+F;EACnH;;;gBArDgB,EAAU,CAAC,CAAc,CAAC;;;kBAEf;GACzB,KAAK;GACL,SAAS;GACT,UAAU,CAAC,eAAe;EAC5B;;CAGA,IAAI,mBAAqC;EACvC,OAAO;GACL,OAAO,KAAK;GACZ,QAAQ,KAAK,WAAW,aAAa;EACvC;CACF;CAOA,GAAW,GAAgG;EACrG,CAAC,KAAK,kBAAkB,CAAC,EAAQ,QAAQ,eAAe,KAAK,EAAQ,aAIzE,KAAK,iBAAiB,MAAM,SAAS,MAAoB,EAAgB,WAAW,EAAM,GAC1F,EAAQ,WAAW;CACrB;CAEA,SAAS;EACP,OAAO,CAAI;CAKb;CAEA,oBAAoB;EAKlB,AAJA,MAAM,kBAAkB,GACxB,EAAoB,MAAM,CAAY,GACtC,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO,WACvB,KAAK,iBAAiB,SAAS,KAAKC,EAAQ;CAC9C;CAEA,uBAAuB;EAErB,AADA,MAAM,qBAAqB,GAC3B,KAAK,oBAAoB,SAAS,KAAKA,EAAQ;CACjD;CAEA;CAIA,QAAQ,GAA6B;EAEnC,AADA,MAAM,QAAQ,CAAK,GACnB,KAAK,WAAW,kBAAkB,KAAK,WAAW,aAAa;CACjE;AACF;GAvEG,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,MAKzC,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,cAAA,KAAA,CAAA,MAKzC,EAAS;CAAE,MAAM;CAAS,WAAW;AAAkB,CAAC,CAAA,GAAA,EAAA,WAAA,kBAAA,KAAA,CAAA,MAkBxD,EAAsB,CAAA,GAAA,EAAA,WAAA,SAAA,KAAA,CAAA,UAlCxB,EAAM,GACN,EAAwB,CAAA,GAAA,CAAA"}
package/dist/tag/tag.d.ts CHANGED
@@ -1,5 +1,7 @@
1
- import { Color, Prominence, BaseButton } from '../internal';
1
+ import { LitElement } from 'lit';
2
+ import { Color, Prominence } from '../internal';
2
3
  import { Icon } from '../icon';
4
+ declare const Tag_base: import('@nvidia-elements/forms/mixins').ButtonFormControlMixinReturn<typeof LitElement>;
3
5
  /**
4
6
  * @element nve-tag
5
7
  * @description A interactive element that represents a category or group of content. Typically used to filter or organize content for one to many relations.
@@ -22,7 +24,7 @@ import { Icon } from '../icon';
22
24
  * @csspart icon - The icon element
23
25
  * @aria https://www.w3.org/WAI/ARIA/apg/patterns/button/
24
26
  */
25
- export declare class Tag extends BaseButton {
27
+ export declare class Tag extends Tag_base {
26
28
  #private;
27
29
  static styles: import('lit').CSSResult[];
28
30
  static readonly metadata: {
@@ -45,3 +47,4 @@ export declare class Tag extends BaseButton {
45
47
  render(): import('lit-html').TemplateResult<1>;
46
48
  constructor();
47
49
  }
50
+ export {};
package/dist/tag/tag2.js CHANGED
@@ -1,45 +1,45 @@
1
- import { __decorate as e } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
2
- import { BaseButton as t } from "../internal/base/button.js";
3
- import { I18nController as n } from "../internal/controllers/i18n.controller.js";
4
- import { TypeClosableController as r } from "../internal/controllers/type-closable.controller.js";
5
- import { scopedRegistry as i } from "../internal/decorators/scoped-registry.js";
6
- import { colorStateStyles as a, useStyles as o } from "../internal/styles/index.js";
7
- import { Icon as s } from "../icon/icon2.js";
8
- import c from "./tag.js";
9
- import { html as l } from "lit";
1
+ import { I18nController as e } from "../internal/controllers/i18n.controller.js";
2
+ import { TypeClosableController as t } from "../internal/controllers/type-closable.controller.js";
3
+ import { scopedRegistry as n } from "../internal/decorators/scoped-registry.js";
4
+ import { colorStateStyles as r, useStyles as i } from "../internal/styles/index.js";
5
+ import { __decorate as a } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
6
+ import { Icon as o } from "../icon/icon2.js";
7
+ import s from "./tag.js";
8
+ import { LitElement as c, html as l } from "lit";
10
9
  import { property as u } from "lit/decorators/property.js";
11
- import { ifDefined as d } from "lit/directives/if-defined.js";
10
+ import { ButtonFormControlMixin as d } from "@nvidia-elements/forms/mixins";
11
+ import { ifDefined as f } from "lit/directives/if-defined.js";
12
12
  //#region src/tag/tag.ts
13
- var f = class extends t {
13
+ var p = class extends d(c) {
14
14
  static {
15
- this.styles = o([a, c]);
15
+ this.styles = i([r, s]);
16
16
  }
17
17
  static {
18
18
  this.metadata = {
19
19
  tag: "nve-tag",
20
- version: "0.2.2"
20
+ version: "0.2.3"
21
21
  };
22
22
  }
23
23
  static {
24
- this.elementDefinitions = { [s.metadata.tag]: s };
24
+ this.elementDefinitions = { [o.metadata.tag]: o };
25
25
  }
26
26
  #e;
27
27
  #t;
28
28
  render() {
29
- return l`<div internal-host interaction-state focus-within><slot></slot>${this.closable ? l`<nve-icon part="icon" @click="${() => this.#t.close()}" container="flat" name="cancel" size="sm" role="img" aria-label="${d(this.i18n.close)}"></nve-icon>` : ""}</div>`;
29
+ return l`<div internal-host interaction-state focus-within><slot></slot>${this.closable ? l`<nve-icon part="icon" @click="${() => this.#t.close()}" container="flat" name="cancel" size="sm" role="img" aria-label="${f(this.i18n.close)}"></nve-icon>` : ""}</div>`;
30
30
  }
31
31
  constructor() {
32
- super(), this.closable = !1, this.#e = new n(this), this.i18n = this.#e.i18n, this.#t = new r(this), this.type = "button";
32
+ super(), this.closable = !1, this.#e = new e(this), this.i18n = this.#e.i18n, this.#t = new t(this), this.type = "button";
33
33
  }
34
34
  };
35
- e([u({ type: Boolean })], f.prototype, "closable", void 0), e([u({
35
+ a([u({ type: Boolean })], p.prototype, "closable", void 0), a([u({
36
36
  type: String,
37
37
  reflect: !0
38
- })], f.prototype, "color", void 0), e([u({
38
+ })], p.prototype, "color", void 0), a([u({
39
39
  type: String,
40
40
  reflect: !0
41
- })], f.prototype, "prominence", void 0), e([u({ type: Object })], f.prototype, "i18n", void 0), f = e([i()], f);
41
+ })], p.prototype, "prominence", void 0), a([u({ type: Object })], p.prototype, "i18n", void 0), p = a([n()], p);
42
42
  //#endregion
43
- export { f as Tag };
43
+ export { p as Tag };
44
44
 
45
45
  //# sourceMappingURL=tag2.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"tag2.js","names":["#typeClosableController","#i18nController"],"sources":["../../src/tag/tag.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 { ifDefined } from 'lit/directives/if-defined.js';\nimport type { Color, Prominence } from '@nvidia-elements/core/internal';\nimport {\n I18nController,\n BaseButton,\n TypeClosableController,\n useStyles,\n colorStateStyles,\n scopedRegistry\n} from '@nvidia-elements/core/internal';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport styles from './tag.css?inline';\n\n/**\n * @element nve-tag\n * @description A interactive element that represents a category or group of content. Typically used to filter or organize content for one to many relations.\n * @since 0.10.0\n * @entrypoint \\@nvidia-elements/core/tag\n * @slot - default slot for content\n * @cssprop --background\n * @cssprop --color\n * @cssprop --gap\n * @cssprop --font-size\n * @cssprop --padding\n * @cssprop --border\n * @cssprop --border-radius\n * @cssprop --font-weight\n * @cssprop --cursor\n * @cssprop --height\n * @cssprop --width\n * @cssprop --max-width\n * @cssprop --text-decoration\n * @csspart icon - The icon element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/button/\n */\n@scopedRegistry()\nexport class Tag extends BaseButton {\n static styles = useStyles([colorStateStyles, styles]);\n\n static readonly metadata = {\n tag: 'nve-tag',\n version: '0.0.0'\n };\n\n static elementDefinitions = {\n [Icon.metadata.tag]: Icon\n };\n\n /** Determines if tag is closable, if true, the component renders a close icon. */\n @property({ type: Boolean }) closable = false;\n\n /** Determines the color of the tag. */\n @property({ type: String, reflect: true }) color: Color;\n\n /** Determines the visual prominence or weight */\n @property({ type: String, reflect: true }) prominence?: Extract<Prominence, 'emphasis'>;\n\n #i18nController: I18nController<this> = new I18nController<this>(this);\n\n /** Updates internal string values for internationalization. */\n @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n #typeClosableController = new TypeClosableController(this);\n\n render() {\n return html`\n <div internal-host interaction-state focus-within>\n <slot></slot>\n ${this.closable ? html`<nve-icon part=\"icon\" @click=${() => this.#typeClosableController.close()} container=\"flat\" name=\"cancel\" size=\"sm\" role=\"img\" aria-label=${ifDefined(this.i18n.close)}></nve-icon>` : ''}\n </div>\n `;\n }\n\n constructor() {\n super();\n this.type = 'button';\n }\n}\n"],"mappings":";;;;;;;;;;;;AAyCO,IAAA,IAAA,cAAkB,EAAW;;gBAClB,EAAU,CAAC,GAAkB,CAAM,CAAC;;;kBAEzB;GACzB,KAAK;GACL,SAAS;EACX;;;4BAE4B,GACzB,EAAK,SAAS,MAAM,EACvB;;CAWA;CAKA;CAEA,SAAS;EACP,OAAO,CAAI,kEAGL,KAAK,WAAW,CAAI,uCAAsC,KAAKA,GAAwB,MAAM,EAAE,oEAAkE,EAAU,KAAK,KAAK,KAAK,EAAE,iBAAgB,GAAG;CAGvN;CAEA,cAAc;EAEZ,AADA,MAAM,mBAzBgC,cAQA,IAAI,EAAqB,IAAI,eAGlC,KAAKC,GAAgB,gBAE9B,IAAI,EAAuB,IAAI,GAavD,KAAK,OAAO;CACd;AACF;GA5BG,EAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,MAG1B,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,SAAA,KAAA,CAAA,MAGxC,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,cAAA,KAAA,CAAA,MAKxC,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,UAzB3B,EAAe,CAAA,GAAA,CAAA"}
1
+ {"version":3,"file":"tag2.js","names":["#typeClosableController","#i18nController"],"sources":["../../src/tag/tag.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 { ifDefined } from 'lit/directives/if-defined.js';\nimport { ButtonFormControlMixin } from '@nvidia-elements/forms/mixins';\nimport type { Color, Prominence } from '@nvidia-elements/core/internal';\nimport {\n I18nController,\n TypeClosableController,\n useStyles,\n colorStateStyles,\n scopedRegistry\n} from '@nvidia-elements/core/internal';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport styles from './tag.css?inline';\n\n/**\n * @element nve-tag\n * @description A interactive element that represents a category or group of content. Typically used to filter or organize content for one to many relations.\n * @since 0.10.0\n * @entrypoint \\@nvidia-elements/core/tag\n * @slot - default slot for content\n * @cssprop --background\n * @cssprop --color\n * @cssprop --gap\n * @cssprop --font-size\n * @cssprop --padding\n * @cssprop --border\n * @cssprop --border-radius\n * @cssprop --font-weight\n * @cssprop --cursor\n * @cssprop --height\n * @cssprop --width\n * @cssprop --max-width\n * @cssprop --text-decoration\n * @csspart icon - The icon element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/button/\n */\n@scopedRegistry()\nexport class Tag extends ButtonFormControlMixin(LitElement) {\n static styles = useStyles([colorStateStyles, styles]);\n\n static readonly metadata = {\n tag: 'nve-tag',\n version: '0.0.0'\n };\n\n static elementDefinitions = {\n [Icon.metadata.tag]: Icon\n };\n\n /** Determines if tag is closable, if true, the component renders a close icon. */\n @property({ type: Boolean }) closable = false;\n\n /** Determines the color of the tag. */\n @property({ type: String, reflect: true }) color: Color;\n\n /** Determines the visual prominence or weight */\n @property({ type: String, reflect: true }) prominence?: Extract<Prominence, 'emphasis'>;\n\n #i18nController: I18nController<this> = new I18nController<this>(this);\n\n /** Updates internal string values for internationalization. */\n @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n #typeClosableController = new TypeClosableController(this);\n\n render() {\n return html`\n <div internal-host interaction-state focus-within>\n <slot></slot>\n ${this.closable ? html`<nve-icon part=\"icon\" @click=${() => this.#typeClosableController.close()} container=\"flat\" name=\"cancel\" size=\"sm\" role=\"img\" aria-label=${ifDefined(this.i18n.close)}></nve-icon>` : ''}\n </div>\n `;\n }\n\n constructor() {\n super();\n this.type = 'button';\n }\n}\n"],"mappings":";;;;;;;;;;;;AAyCO,IAAA,IAAA,cAAkB,EAAuB,CAAU,EAAE;;gBAC1C,EAAU,CAAC,GAAkB,CAAM,CAAC;;;kBAEzB;GACzB,KAAK;GACL,SAAS;EACX;;;4BAE4B,GACzB,EAAK,SAAS,MAAM,EACvB;;CAWA;CAKA;CAEA,SAAS;EACP,OAAO,CAAI,kEAGL,KAAK,WAAW,CAAI,uCAAsC,KAAKA,GAAwB,MAAM,EAAE,oEAAkE,EAAU,KAAK,KAAK,KAAK,EAAE,iBAAgB,GAAG;CAGvN;CAEA,cAAc;EAEZ,AADA,MAAM,mBAzBgC,cAQA,IAAI,EAAqB,IAAI,eAGlC,KAAKC,GAAgB,gBAE9B,IAAI,EAAuB,IAAI,GAavD,KAAK,OAAO;CACd;AACF;GA5BG,EAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,MAG1B,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,SAAA,KAAA,CAAA,MAGxC,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,cAAA,KAAA,CAAA,MAKxC,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,UAzB3B,EAAe,CAAA,GAAA,CAAA"}
@@ -9,7 +9,7 @@ var r = class extends t {
9
9
  static {
10
10
  this.metadata = {
11
11
  tag: "nve-textarea",
12
- version: "0.2.2"
12
+ version: "0.2.3"
13
13
  };
14
14
  }
15
15
  };
@@ -1,6 +1,6 @@
1
- import { __decorate as e } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
2
- import { scopedRegistry as t } from "../internal/decorators/scoped-registry.js";
3
- import { useStyles as n } from "../internal/styles/index.js";
1
+ import { scopedRegistry as e } from "../internal/decorators/scoped-registry.js";
2
+ import { useStyles as t } from "../internal/styles/index.js";
3
+ import { __decorate as n } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
4
4
  import { Control as r } from "../forms/control/control2.js";
5
5
  import { IconButton as i } from "../icon-button/icon-button2.js";
6
6
  import { inputStyles as a } from "../input/input2.js";
@@ -10,7 +10,7 @@ import { property as c } from "lit/decorators/property.js";
10
10
  //#region src/time/time.ts
11
11
  var l = class extends r {
12
12
  static {
13
- this.styles = n([
13
+ this.styles = t([
14
14
  ...r.styles,
15
15
  a,
16
16
  o
@@ -19,7 +19,7 @@ var l = class extends r {
19
19
  static {
20
20
  this.metadata = {
21
21
  tag: "nve-time",
22
- version: "0.2.2"
22
+ version: "0.2.3"
23
23
  };
24
24
  }
25
25
  static {
@@ -29,10 +29,10 @@ var l = class extends r {
29
29
  return s`<nve-icon-button part="icon-button" .ariaLabel="${this.i18n.expand}" icon-name="clock" container="inline" @click="${this.showPicker}"></nve-icon-button>`;
30
30
  }
31
31
  };
32
- e([c({
32
+ n([c({
33
33
  type: String,
34
34
  reflect: !0
35
- })], l.prototype, "container", void 0), l = e([t()], l);
35
+ })], l.prototype, "container", void 0), l = n([e()], l);
36
36
  //#endregion
37
37
  export { l as Time };
38
38
 
@@ -1,12 +1,12 @@
1
- import { attachInternals as e } from "../internal/utils/a11y.js";
2
- import { __decorate as t } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
3
- import { audit as n } from "../internal/controllers/audit.controller.js";
4
- import { I18nController as r } from "../internal/controllers/i18n.controller.js";
5
- import { TypeNativePopoverController as i } from "../internal/controllers/type-native-popover.controller.js";
6
- import { scopedRegistry as a } from "../internal/decorators/scoped-registry.js";
7
- import { useStyles as o } from "../internal/styles/index.js";
8
- import { popoverStyles as s } from "../internal/styles/popover2.js";
9
- import { statusIcons as c } from "../internal/types/index.js";
1
+ import { audit as e } from "../internal/controllers/audit.controller.js";
2
+ import { I18nController as t } from "../internal/controllers/i18n.controller.js";
3
+ import { attachInternals as n } from "../internal/utils/a11y.js";
4
+ import { TypeNativePopoverController as r } from "../internal/controllers/type-native-popover.controller.js";
5
+ import { scopedRegistry as i } from "../internal/decorators/scoped-registry.js";
6
+ import { useStyles as a } from "../internal/styles/index.js";
7
+ import { popoverStyles as o } from "../internal/styles/popover2.js";
8
+ import { statusIcons as s } from "../internal/types/index.js";
9
+ import { __decorate as c } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
10
10
  import { Icon as l } from "../icon/icon2.js";
11
11
  import { IconButton as u } from "../icon-button/icon-button2.js";
12
12
  import d from "./toast.js";
@@ -15,15 +15,15 @@ import { property as h } from "lit/decorators/property.js";
15
15
  //#region src/toast/toast.ts
16
16
  var g = class extends f {
17
17
  constructor(...e) {
18
- super(...e), this.position = "top", this.closable = !1, this.closeTimeout = 0, this.#e = new r(this), this.i18n = this.#e.i18n, this.popoverType = "manual", this.typeNativePopoverController = new i(this);
18
+ super(...e), this.position = "top", this.closable = !1, this.closeTimeout = 0, this.#e = new t(this), this.i18n = this.#e.i18n, this.popoverType = "manual", this.typeNativePopoverController = new r(this);
19
19
  }
20
20
  static {
21
- this.styles = o([s, d]);
21
+ this.styles = a([o, d]);
22
22
  }
23
23
  static {
24
24
  this.metadata = {
25
25
  tag: "nve-toast",
26
- version: "0.2.2"
26
+ version: "0.2.3"
27
27
  };
28
28
  }
29
29
  static {
@@ -34,32 +34,32 @@ var g = class extends f {
34
34
  }
35
35
  #e;
36
36
  render() {
37
- return p`<div internal-host><slot name="prefix">${this.status === "muted" ? m : p`<nve-icon part="prefix-icon" .name="${c[this.status]}" .ariaLabel="${this.i18n[this.status] ?? this.i18n.information}"></nve-icon>`}</slot>${this.closable ? p`<nve-icon-button part="icon-button" exportparts="icon:icon-button-icon" @click="${this.hidePopover}" icon-name="cancel" container="flat" .ariaLabel="${this.i18n.close}"></nve-icon-button>` : m}<slot></slot></div>`;
37
+ return p`<div internal-host><slot name="prefix">${this.status === "muted" ? m : p`<nve-icon part="prefix-icon" .name="${s[this.status]}" .ariaLabel="${this.i18n[this.status] ?? this.i18n.information}"></nve-icon>`}</slot>${this.closable ? p`<nve-icon-button part="icon-button" exportparts="icon:icon-button-icon" @click="${this.hidePopover}" icon-name="cancel" container="flat" .ariaLabel="${this.i18n.close}"></nve-icon-button>` : m}<slot></slot></div>`;
38
38
  }
39
39
  connectedCallback() {
40
- super.connectedCallback(), e(this), this._internals.role = "alert";
40
+ super.connectedCallback(), n(this), this._internals.role = "alert";
41
41
  }
42
42
  };
43
- t([h({ type: String })], g.prototype, "anchor", void 0), t([h({ type: String })], g.prototype, "trigger", void 0), t([h({
43
+ c([h({ type: String })], g.prototype, "anchor", void 0), c([h({ type: String })], g.prototype, "trigger", void 0), c([h({
44
44
  type: String,
45
45
  reflect: !0
46
- })], g.prototype, "position", void 0), t([h({
46
+ })], g.prototype, "position", void 0), c([h({
47
47
  type: String,
48
48
  reflect: !0
49
- })], g.prototype, "alignment", void 0), t([h({
49
+ })], g.prototype, "alignment", void 0), c([h({
50
50
  type: String,
51
51
  reflect: !0
52
- })], g.prototype, "prominence", void 0), t([h({
52
+ })], g.prototype, "prominence", void 0), c([h({
53
53
  type: Boolean,
54
54
  reflect: !0,
55
55
  attribute: "behavior-trigger"
56
- })], g.prototype, "behaviorTrigger", void 0), t([h({ type: Boolean })], g.prototype, "closable", void 0), t([h({
56
+ })], g.prototype, "behaviorTrigger", void 0), c([h({ type: Boolean })], g.prototype, "closable", void 0), c([h({
57
57
  type: Number,
58
58
  attribute: "close-timeout"
59
- })], g.prototype, "closeTimeout", void 0), t([h({
59
+ })], g.prototype, "closeTimeout", void 0), c([h({
60
60
  type: String,
61
61
  reflect: !0
62
- })], g.prototype, "status", void 0), t([h({ type: Object })], g.prototype, "i18n", void 0), g = t([a(), n({ excessiveInstanceLimit: 50 })], g);
62
+ })], g.prototype, "status", void 0), c([h({ type: Object })], g.prototype, "i18n", void 0), g = c([i(), e({ excessiveInstanceLimit: 50 })], g);
63
63
  //#endregion
64
64
  export { g as Toast };
65
65
 
@@ -1,17 +1,17 @@
1
- import { __decorate as e } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
2
- import { audit as t } from "../internal/controllers/audit.controller.js";
3
- import { useStyles as n } from "../internal/styles/index.js";
1
+ import { audit as e } from "../internal/controllers/audit.controller.js";
2
+ import { useStyles as t } from "../internal/styles/index.js";
3
+ import { __decorate as n } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
4
4
  import r from "./toggletip-footer.js";
5
5
  import { LitElement as i, html as a } from "lit";
6
6
  //#region src/toggletip/toggletip-footer.ts
7
7
  var o = class extends i {
8
8
  static {
9
- this.styles = n([r]);
9
+ this.styles = t([r]);
10
10
  }
11
11
  static {
12
12
  this.metadata = {
13
13
  tag: "nve-toggletip-footer",
14
- version: "0.2.2",
14
+ version: "0.2.3",
15
15
  parents: ["nve-toggletip"]
16
16
  };
17
17
  }
@@ -22,7 +22,7 @@ var o = class extends i {
22
22
  super.connectedCallback(), this.slot = "footer";
23
23
  }
24
24
  };
25
- o = e([t()], o);
25
+ o = n([e()], o);
26
26
  //#endregion
27
27
  export { o as ToggletipFooter };
28
28
 
@@ -1,17 +1,17 @@
1
- import { __decorate as e } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
2
- import { audit as t } from "../internal/controllers/audit.controller.js";
3
- import { useStyles as n } from "../internal/styles/index.js";
1
+ import { audit as e } from "../internal/controllers/audit.controller.js";
2
+ import { useStyles as t } from "../internal/styles/index.js";
3
+ import { __decorate as n } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
4
4
  import r from "./toggletip-header.js";
5
5
  import { LitElement as i, html as a } from "lit";
6
6
  //#region src/toggletip/toggletip-header.ts
7
7
  var o = class extends i {
8
8
  static {
9
- this.styles = n([r]);
9
+ this.styles = t([r]);
10
10
  }
11
11
  static {
12
12
  this.metadata = {
13
13
  tag: "nve-toggletip-header",
14
- version: "0.2.2",
14
+ version: "0.2.3",
15
15
  parents: ["nve-toggletip"]
16
16
  };
17
17
  }
@@ -22,7 +22,7 @@ var o = class extends i {
22
22
  super.connectedCallback(), this.slot = "header";
23
23
  }
24
24
  };
25
- o = e([t()], o);
25
+ o = n([e()], o);
26
26
  //#endregion
27
27
  export { o as ToggletipHeader };
28
28