@nvidia-elements/core 2.2.1 → 2.2.2
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.
- package/CHANGELOG.md +10 -0
- package/dist/accordion/accordion2.js +4 -4
- package/dist/alert/alert-group2.js +1 -1
- package/dist/alert/alert2.js +1 -1
- package/dist/avatar/avatar-group2.js +1 -1
- package/dist/avatar/avatar2.js +1 -1
- package/dist/badge/badge2.js +1 -1
- package/dist/breadcrumb/breadcrumb2.js +1 -1
- package/dist/bundles/index.js +2 -2
- package/dist/button/button2.js +1 -1
- package/dist/button-group/button-group2.js +1 -1
- package/dist/card/card2.js +4 -4
- package/dist/chat-message/chat-message2.js +1 -1
- package/dist/checkbox/checkbox-group2.js +1 -1
- package/dist/checkbox/checkbox2.js +1 -1
- package/dist/color/color2.js +1 -1
- package/dist/combobox/combobox2.js +1 -1
- package/dist/copy-button/copy-button2.js +1 -1
- package/dist/date/date2.js +1 -1
- package/dist/datetime/datetime2.js +1 -1
- package/dist/dialog/dialog-footer2.js +1 -1
- package/dist/dialog/dialog-header2.js +1 -1
- package/dist/dialog/dialog2.js +1 -1
- package/dist/divider/divider2.js +1 -1
- package/dist/dot/dot2.js +1 -1
- package/dist/drawer/drawer-content2.js +1 -1
- package/dist/drawer/drawer-footer2.js +1 -1
- package/dist/drawer/drawer-header2.js +1 -1
- package/dist/drawer/drawer.js +1 -1
- package/dist/drawer/drawer.js.map +1 -1
- package/dist/drawer/drawer2.js +1 -1
- package/dist/dropdown/dropdown-footer2.js +1 -1
- package/dist/dropdown/dropdown-header2.js +1 -1
- package/dist/dropdown/dropdown2.js +1 -1
- package/dist/dropdown-group/dropdown-group.js +1 -1
- package/dist/dropzone/dropzone2.js +1 -1
- package/dist/file/file2.js +1 -1
- package/dist/format-datetime/format-datetime2.js +1 -1
- package/dist/format-number/format-number2.js +1 -1
- package/dist/format-relative-time/format-relative-time2.js +1 -1
- package/dist/forms/control/control2.js +1 -1
- package/dist/forms/control-group/control-group2.js +1 -1
- package/dist/forms/control-message/control-message2.js +1 -1
- package/dist/gauge/gauge2.js +1 -1
- package/dist/grid/cell/cell2.js +1 -1
- package/dist/grid/column/column2.js +1 -1
- package/dist/grid/footer/footer2.js +1 -1
- package/dist/grid/grid2.js +1 -1
- package/dist/grid/header/header2.js +1 -1
- package/dist/grid/placeholder/placeholder2.js +1 -1
- package/dist/grid/row/row2.js +1 -1
- package/dist/icon/icon2.js +2 -2
- package/dist/icon-button/icon-button2.js +1 -1
- package/dist/index.js +1 -1
- package/dist/input/input-group2.js +1 -1
- package/dist/input/input2.js +1 -1
- package/dist/internal/services/global.service.js +1 -1
- package/dist/logo/logo2.js +1 -1
- package/dist/menu/menu-item2.js +1 -1
- package/dist/menu/menu2.js +1 -1
- package/dist/month/month2.js +1 -1
- package/dist/notification/notification-group2.js +1 -1
- package/dist/notification/notification2.js +1 -1
- package/dist/page/page-panel/page-panel-content2.js +1 -1
- package/dist/page/page-panel/page-panel-footer2.js +1 -1
- package/dist/page/page-panel/page-panel-header2.js +1 -1
- package/dist/page/page-panel/page-panel2.js +1 -1
- package/dist/page/page2.js +1 -1
- package/dist/page-header/page-header2.js +1 -1
- package/dist/page-loader/page-loader2.js +1 -1
- package/dist/pagination/pagination2.js +1 -1
- package/dist/panel/panel2.js +4 -4
- package/dist/password/password2.js +1 -1
- package/dist/preferences-input/preferences-input2.js +1 -1
- package/dist/progress-bar/progress-bar2.js +1 -1
- package/dist/progress-ring/progress-ring2.js +1 -1
- package/dist/progressive-filter-chip/progressive-filter-chip2.js +1 -1
- package/dist/pulse/pulse2.js +1 -1
- package/dist/radio/radio-group2.js +1 -1
- package/dist/radio/radio2.js +1 -1
- package/dist/range/range2.js +1 -1
- package/dist/resize-handle/resize-handle2.js +1 -1
- package/dist/search/search2.js +1 -1
- package/dist/select/select.js +1 -1
- package/dist/select/select.js.map +1 -1
- package/dist/select/select2.js +2 -2
- package/dist/select/select2.js.map +1 -1
- package/dist/skeleton/skeleton2.js +1 -1
- package/dist/sort-button/sort-button2.js +1 -1
- package/dist/sparkline/sparkline2.js +1 -1
- package/dist/star-rating/star-rating2.js +1 -1
- package/dist/steps/steps2.js +2 -2
- package/dist/switch/switch-group2.js +1 -1
- package/dist/switch/switch2.js +1 -1
- package/dist/tabs/tabs-group2.js +1 -1
- package/dist/tabs/tabs2.js +2 -2
- package/dist/tag/tag2.js +1 -1
- package/dist/textarea/textarea2.js +1 -1
- package/dist/time/time2.js +1 -1
- package/dist/toast/toast2.js +1 -1
- package/dist/toggletip/toggletip-footer2.js +1 -1
- package/dist/toggletip/toggletip-header2.js +1 -1
- package/dist/toggletip/toggletip2.js +1 -1
- package/dist/toolbar/toolbar2.js +1 -1
- package/dist/tooltip/tooltip2.js +1 -1
- package/dist/tree/tree-node2.js +1 -1
- package/dist/tree/tree2.js +1 -1
- package/dist/week/week2.js +1 -1
- package/package.json +1 -1
package/dist/page/page2.js
CHANGED
package/dist/panel/panel2.js
CHANGED
|
@@ -21,7 +21,7 @@ var g = class extends f {
|
|
|
21
21
|
static {
|
|
22
22
|
this.metadata = {
|
|
23
23
|
tag: "nve-panel-header",
|
|
24
|
-
version: "2.2.
|
|
24
|
+
version: "2.2.2"
|
|
25
25
|
};
|
|
26
26
|
}
|
|
27
27
|
render() {
|
|
@@ -37,7 +37,7 @@ var g = class extends f {
|
|
|
37
37
|
static {
|
|
38
38
|
this.metadata = {
|
|
39
39
|
tag: "nve-panel-content",
|
|
40
|
-
version: "2.2.
|
|
40
|
+
version: "2.2.2"
|
|
41
41
|
};
|
|
42
42
|
}
|
|
43
43
|
render() {
|
|
@@ -50,7 +50,7 @@ var g = class extends f {
|
|
|
50
50
|
static {
|
|
51
51
|
this.metadata = {
|
|
52
52
|
tag: "nve-panel-footer",
|
|
53
|
-
version: "2.2.
|
|
53
|
+
version: "2.2.2"
|
|
54
54
|
};
|
|
55
55
|
}
|
|
56
56
|
render() {
|
|
@@ -69,7 +69,7 @@ var g = class extends f {
|
|
|
69
69
|
static {
|
|
70
70
|
this.metadata = {
|
|
71
71
|
tag: "nve-panel",
|
|
72
|
-
version: "2.2.
|
|
72
|
+
version: "2.2.2"
|
|
73
73
|
};
|
|
74
74
|
}
|
|
75
75
|
static {
|
package/dist/pulse/pulse2.js
CHANGED
package/dist/radio/radio2.js
CHANGED
package/dist/range/range2.js
CHANGED
package/dist/search/search2.js
CHANGED
package/dist/select/select.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
//#region src/select/select.css?inline
|
|
2
|
-
var e = ":host{--padding: 0 var(--nve-ref-size-800) 0 var(--nve-ref-size-200);--font-size: var(--nve-ref-font-size-100);--height: var(--nve-ref-size-800);--background: var(--nve-sys-interaction-field-background);--color: var(--nve-sys-interaction-field-color);--border-radius: var(--nve-ref-border-radius-sm);--border: var(--nve-ref-border-width-md) solid transparent;--border-bottom: var(--border);--cursor: pointer;--font-weight: normal;--text-align: start;--scroll-height: 50vh;--_input-background: var(--background);--_icon-color: var(--color);--
|
|
2
|
+
var e = ":host{--padding: 0 var(--nve-ref-size-800) 0 var(--nve-ref-size-200);--font-size: var(--nve-ref-font-size-100);--height: var(--nve-ref-size-800);--background: var(--nve-sys-interaction-field-background);--color: var(--nve-sys-interaction-field-color);--border-radius: var(--nve-ref-border-radius-sm);--border: var(--nve-ref-border-width-md) solid transparent;--border-bottom: var(--border);--gap: var(--nve-ref-space-xxs);--cursor: pointer;--font-weight: normal;--text-align: start;--scroll-height: 50vh;--width: 100%;--control-width: var(--width);--max-width: 100%;--min-width: fit-content;--_input-background: var(--background);--_icon-color: var(--color);--_gap: var(--gap);--size: 1;--_row-height: calc(var(--height) * var(--size) + var(--gap) * (var(--size) - 1));--_height: calc(var(--_row-height) + var(--nve-ref-border-width-md) * 2);contain:initial;width:var(--width);max-width:var(--max-width);min-width:var(--min-width)}:host([fit-text]){--min-width: initial}[internal-host]{position:relative}[input]{scroll-behavior:smooth;scrollbar-color:color-mix(in oklab,var(--nve-sys-scrollbar-thumb-color) 100%,currentColor 20%) var(--nve-sys-scrollbar-track-color);scrollbar-width:var(--nve-sys-scrollbar-width);height:var(--_height);background:var(--background);border:var(--border);border-bottom:var(--border-bottom);border-radius:var(--border-radius);width:var(--control-width);color:var(--color);align-items:center;display:flex;align-content:stretch;position:relative}[name=caret]{right:var(--nve-ref-size-300);align-self:center;pointer-events:none;position:absolute;transition:transform var(--nve-ref-animation-duration-200) cubic-bezier(.4,0,.2,1)}::slotted(select){appearance:none!important;color:var(--color)!important;padding:var(--padding)!important;font-size:var(--font-size)!important;cursor:var(--cursor)!important;font-weight:var(--font-weight)!important;text-align:var(--text-align)!important;height:var(--_height)!important;width:100%!important;border:0!important;background:none!important;display:block!important}[internal-host]:has(nve-menu:focus-within) [input]{outline:0!important}:host(:state(selected)){--font-weight: var(--nve-ref-font-weight-semibold)}:host([fit-content]:state(multiple)) [internal-host]:has(nve-tag) ::slotted(select){width:var(--nve-ref-size-1000)!important}:host(:state(multiple)){--padding: 0 var(--nve-ref-size-300) 0 var(--nve-ref-size-100)}:host(:state(multiple)) [input]{padding:var(--padding)}:host(:state(multiple)) .tags{width:fit-content;display:flex;gap:var(--gap)}:host(:state(multiple)) .tags-label{padding:0 var(--nve-ref-size-200);font-size:var(--font-size);cursor:var(--cursor);font-weight:var(--font-weight);position:absolute;left:0;display:none;pointer-events:none}:host(:state(multiple-overflow)) .tags,:host([multiple-overflow]) .tags{opacity:0;pointer-events:none;position:absolute}:host(:state(multiple-overflow)) .tags-label,:host([multiple-overflow]) .tags-label,.placeholder.tags-label{display:block!important}:host([size]:state(multiple)) .tags,:host([size]:state(multiple)) .tags-label{display:none!important}:host(:state(multiple)) ::slotted(select[multiple]){opacity:0!important}:host(:state(size)) [input]{overflow:auto;display:block}:host(:state(size)) [input] slot:not([name]){display:none}:host([layout*=\"horizontal\"][size]) ::slotted(label){padding-block-start:var(--nve-ref-size-100)!important;align-self:start!important}:host([layout*=\"horizontal\"][size]) slot[name=label]{align-self:start}:host([status=\"error\"]),:host(:state(invalid)),:host(:state(error)){--border: var(--nve-ref-border-width-md) solid var(--nve-sys-support-danger-emphasis-color)}:host([status=\"success\"]),:host(:state(success)){--border: var(--nve-ref-border-width-md) solid var(--nve-sys-support-success-emphasis-color)}:host(:state(disabled)){--border: var(--nve-ref-border-width-md) solid transparent}nve-tag{--background: color-mix(in oklab, var(--color) 15%, var(--_input-background));--padding: var(--nve-ref-size-100) var(--nve-ref-size-200);--cursor: pointer !important}:host(:state(disabled)) nve-tag{pointer-events:none!important;--cursor: not-allowed !important}nve-dropdown{--padding: var(--nve-ref-size-200)}nve-menu{--max-height: var(--scroll-height);--gap: var(--_gap)}nve-menu-item{--text-transform: initial;contain:content;content-visibility:auto}nve-menu-item:not(:state(selected)) nve-icon[name=check]{opacity:0}nve-menu-item nve-icon{--color: inherit}slot:not([name]),slot[name*=option-]{display:contents}:host([container=\"flat\"]){--background: unset;--border-radius: 0;--box-shadow: none;--border-bottom: var(--nve-ref-border-width-md) solid var(--nve-ref-border-color-muted)}:host([container=\"flat\"]) [input]{background:inherit}:host([container=\"flat\"]) nve-tag{--background: var(--nve-sys-interaction-field-background)}:host([container=\"flat\"]:focus-within){--border-bottom: var(--nve-ref-border-width-md) solid var(--nve-ref-border-color-emphasis)}:host([container=\"flat\"][size]){--border-bottom: 0 !important}:host([container=\"flat\"]:focus-within) [input]{outline:0!important}:host([container=\"inline\"]){--border-radius: 0;--box-shadow: none}:host([container=\"inline\"]) [input]{background:inherit}";
|
|
3
3
|
//#endregion
|
|
4
4
|
export { e as default };
|
|
5
5
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.js","names":[],"sources":["../../src/select/select.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n --padding: 0 var(--nve-ref-size-800) 0 var(--nve-ref-size-200);\n --font-size: var(--nve-ref-font-size-100);\n --height: var(--nve-ref-size-800);\n --background: var(--nve-sys-interaction-field-background);\n --color: var(--nve-sys-interaction-field-color);\n --border-radius: var(--nve-ref-border-radius-sm);\n --border: var(--nve-ref-border-width-md) solid transparent;\n --border-bottom: var(--border);\n --cursor: pointer;\n --font-weight: normal;\n --text-align: start;\n --scroll-height: 50vh;\n --_input-background: var(--background);\n --_icon-color: var(--color);\n --
|
|
1
|
+
{"version":3,"file":"select.js","names":[],"sources":["../../src/select/select.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n --padding: 0 var(--nve-ref-size-800) 0 var(--nve-ref-size-200);\n --font-size: var(--nve-ref-font-size-100);\n --height: var(--nve-ref-size-800);\n --background: var(--nve-sys-interaction-field-background);\n --color: var(--nve-sys-interaction-field-color);\n --border-radius: var(--nve-ref-border-radius-sm);\n --border: var(--nve-ref-border-width-md) solid transparent;\n --border-bottom: var(--border);\n --gap: var(--nve-ref-space-xxs);\n --cursor: pointer;\n --font-weight: normal;\n --text-align: start;\n --scroll-height: 50vh;\n --width: 100%;\n --control-width: var(--width);\n --max-width: 100%;\n --min-width: fit-content;\n --_input-background: var(--background);\n --_icon-color: var(--color);\n --_gap: var(--gap);\n --size: 1;\n --_row-height: calc(var(--height) * var(--size) + var(--gap) * (var(--size) - 1));\n --_height: calc(var(--_row-height) + var(--nve-ref-border-width-md) * 2);\n contain: initial;\n width: var(--width);\n max-width: var(--max-width);\n min-width: var(--min-width);\n}\n\n:host([fit-text]) {\n --min-width: initial;\n}\n\n[internal-host] {\n position: relative;\n}\n\n[input] {\n scroll-behavior: smooth;\n scrollbar-color: color-mix(in oklab, var(--nve-sys-scrollbar-thumb-color) 100%, currentColor 20%)\n var(--nve-sys-scrollbar-track-color);\n scrollbar-width: var(--nve-sys-scrollbar-width);\n height: var(--_height);\n background: var(--background);\n border: var(--border);\n border-bottom: var(--border-bottom);\n border-radius: var(--border-radius);\n width: var(--control-width);\n color: var(--color);\n align-items: center;\n display: flex;\n align-content: stretch;\n position: relative;\n}\n\n[name='caret'] {\n right: var(--nve-ref-size-300);\n align-self: center;\n pointer-events: none;\n position: absolute;\n transition: transform var(--nve-ref-animation-duration-200) cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n::slotted(select) {\n appearance: none !important;\n color: var(--color) !important;\n padding: var(--padding) !important;\n font-size: var(--font-size) !important;\n cursor: var(--cursor) !important;\n font-weight: var(--font-weight) !important;\n text-align: var(--text-align) !important;\n height: var(--_height) !important;\n width: 100% !important;\n border: 0 !important;\n background: none !important;\n display: block !important;\n}\n\n[internal-host]:has(nve-menu:focus-within) [input] {\n outline: 0 !important;\n}\n\n:host(:state(selected)) {\n --font-weight: var(--nve-ref-font-weight-semibold);\n}\n\n:host([fit-content]:state(multiple)) [internal-host]:has(nve-tag) ::slotted(select) {\n width: var(--nve-ref-size-1000) !important;\n}\n\n:host(:state(multiple)) {\n --padding: 0 var(--nve-ref-size-300) 0 var(--nve-ref-size-100);\n}\n\n:host(:state(multiple)) [input] {\n padding: var(--padding);\n}\n\n:host(:state(multiple)) .tags {\n width: fit-content;\n display: flex;\n gap: var(--gap);\n}\n\n:host(:state(multiple)) .tags-label {\n padding: 0 var(--nve-ref-size-200);\n font-size: var(--font-size);\n cursor: var(--cursor);\n font-weight: var(--font-weight);\n position: absolute;\n left: 0;\n display: none;\n pointer-events: none;\n}\n\n:host(:state(multiple-overflow)) .tags,\n:host([multiple-overflow]) .tags {\n opacity: 0;\n pointer-events: none;\n position: absolute;\n}\n\n:host(:state(multiple-overflow)) .tags-label,\n:host([multiple-overflow]) .tags-label,\n.placeholder.tags-label {\n display: block !important;\n}\n\n:host([size]:state(multiple)) .tags,\n:host([size]:state(multiple)) .tags-label {\n display: none !important;\n}\n\n:host(:state(multiple)) ::slotted(select[multiple]) {\n opacity: 0 !important;\n}\n\n:host(:state(size)) [input] {\n overflow: auto;\n display: block;\n}\n\n:host(:state(size)) [input] slot:not([name]) {\n display: none;\n}\n\n:host([layout*='horizontal'][size]) ::slotted(label) {\n padding-block-start: var(--nve-ref-size-100) !important;\n align-self: start !important;\n}\n\n:host([layout*='horizontal'][size]) slot[name='label'] {\n align-self: start;\n}\n\n:host([status='error']),\n:host(:state(invalid)),\n:host(:state(error)) {\n --border: var(--nve-ref-border-width-md) solid var(--nve-sys-support-danger-emphasis-color);\n}\n\n:host([status='success']),\n:host(:state(success)) {\n --border: var(--nve-ref-border-width-md) solid var(--nve-sys-support-success-emphasis-color);\n}\n\n:host(:state(disabled)) {\n --border: var(--nve-ref-border-width-md) solid transparent;\n}\n\nnve-tag {\n --background: color-mix(in oklab, var(--color) 15%, var(--_input-background));\n --padding: var(--nve-ref-size-100) var(--nve-ref-size-200);\n --cursor: pointer !important;\n}\n\n:host(:state(disabled)) nve-tag {\n pointer-events: none !important;\n --cursor: not-allowed !important;\n}\n\nnve-dropdown {\n --padding: var(--nve-ref-size-200);\n}\n\nnve-menu {\n --max-height: var(--scroll-height);\n --gap: var(--_gap);\n}\n\nnve-menu-item {\n --text-transform: initial;\n contain: content;\n content-visibility: auto;\n}\n\nnve-menu-item:not(:state(selected)) nve-icon[name='check'] {\n opacity: 0;\n}\n\nnve-menu-item nve-icon {\n --color: inherit;\n}\n\nslot:not([name]),\nslot[name*='option-'] {\n display: contents;\n}\n\n:host([container='flat']) {\n --background: unset;\n --border-radius: 0;\n --box-shadow: none;\n --border-bottom: var(--nve-ref-border-width-md) solid var(--nve-ref-border-color-muted);\n}\n\n:host([container='flat']) [input] {\n background: inherit;\n}\n\n:host([container='flat']) nve-tag {\n --background: var(--nve-sys-interaction-field-background);\n}\n\n:host([container='flat']:focus-within) {\n --border-bottom: var(--nve-ref-border-width-md) solid var(--nve-ref-border-color-emphasis);\n}\n\n:host([container='flat'][size]) {\n --border-bottom: 0 !important;\n}\n\n:host([container='flat']:focus-within) [input] {\n outline: 0 !important;\n}\n\n:host([container='inline']) {\n --border-radius: 0;\n --box-shadow: none;\n}\n\n:host([container='inline']) [input] {\n background: inherit;\n}\n"],"mappings":""}
|
package/dist/select/select2.js
CHANGED
|
@@ -27,7 +27,7 @@ var S = class extends d {
|
|
|
27
27
|
static {
|
|
28
28
|
this.metadata = {
|
|
29
29
|
tag: "nve-select",
|
|
30
|
-
version: "2.2.
|
|
30
|
+
version: "2.2.2"
|
|
31
31
|
};
|
|
32
32
|
}
|
|
33
33
|
static {
|
|
@@ -114,7 +114,7 @@ var S = class extends d {
|
|
|
114
114
|
super.disconnectedCallback(), this.#h();
|
|
115
115
|
}
|
|
116
116
|
async updated(e) {
|
|
117
|
-
super.updated(e), this.#t?.size && this.#t?.size !== 0 ? (this._internals.states.add("size"), this.style.setProperty("--size", `${this.#t
|
|
117
|
+
super.updated(e), this.#t?.size && this.#t?.size !== 0 ? (this._internals.states.add("size"), this.style.setProperty("--size", `${this.#t.size}`)) : (this._internals.states.delete("size"), this.style.removeProperty("--size")), this.#t?.multiple && this.#t?.size === 0 ? this._internals.states.add("multiple") : this._internals.states.delete("multiple");
|
|
118
118
|
}
|
|
119
119
|
#_() {
|
|
120
120
|
this.#t?.size === 0 && i(this.#t, () => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select2.js","names":["#i18nController","#select","#options","#dropdown","#menuItems","#input","#tags","#caret","#placeholderOption","#multipleSelectLabel","#selectValue","#menu","#closeDropdown","#openDropdown","#setupCustomSelectUI","#observers","#syncOptionSelectedStates","#disconnectObservers","#setupOverflowListener","#syncSelectValueStates","#optionObservers","#setupObservers","#updateMultipleOverflow"],"sources":["../../src/select/select.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, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport {\n focusElementTimeout,\n onListboxActivate,\n useStyles,\n i18n,\n I18nController,\n onChildListMutation,\n getElementUpdate,\n scopedRegistry,\n appendRootNodeStyle\n} from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport { Menu, MenuItem } from '@nvidia-elements/core/menu';\nimport { Dropdown } from '@nvidia-elements/core/dropdown';\nimport { Tag } from '@nvidia-elements/core/tag';\nimport styles from './select.css?inline';\nimport globalStyles from './select.global.css?inline';\n\n/**\n * @element nve-select\n * @description A select is a control that enables users to select an option from a list of options.\n * @documentation https://nvidia.github.io/elements/docs/elements/select/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/select\n * @cssprop --padding\n * @cssprop --font-size\n * @cssprop --height\n * @cssprop --background\n * @cssprop --color\n * @cssprop --border-radius\n * @cssprop --border\n * @cssprop --border-bottom\n * @cssprop --cursor\n * @cssprop --font-weight\n * @cssprop --text-align\n * @cssprop --scroll-height\n * @cssprop --width\n * @cssprop --control-width\n * @cssprop --max-width\n * @cssprop --min-width\n * @cssprop --box-shadow\n * @cssprop --max-height\n * @cssprop --text-transform\n * @csspart tag\n * @csspart menu - The dropdown menu element\n * @csspart menu-item - The menu item elements\n * @csspart icon - The icon element\n * @csspart caret - The caret/chevron icon element\n * @csspart dropdown - The dropdown popup element\n * @slot - Select input element\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select\n */\n@i18n<Select>()\n@scopedRegistry()\nexport class Select extends Control {\n static styles = useStyles([...Control.styles, styles]);\n\n static readonly metadata = {\n tag: 'nve-select',\n version: '0.0.0'\n };\n\n static elementDefinitions = {\n [Icon.metadata.tag]: Icon,\n [Dropdown.metadata.tag]: Dropdown,\n [Menu.metadata.tag]: Menu,\n [MenuItem.metadata.tag]: MenuItem,\n [Tag.metadata.tag]: Tag\n };\n\n /** Flat container option applies when embedding the component within another containing element */\n @property({ type: String, reflect: true }) container?: 'flat' | 'inline';\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 get #select() {\n return this.input as unknown as HTMLSelectElement;\n }\n\n get #options() {\n return Array.from(this.#select?.options ? this.#select.options : []);\n }\n\n get #dropdown() {\n return this.shadowRoot!.querySelector<Dropdown>(Dropdown.metadata.tag);\n }\n\n get #menuItems() {\n return this.shadowRoot!.querySelectorAll<MenuItem>(MenuItem.metadata.tag);\n }\n\n get #input() {\n return this.shadowRoot!.querySelector<HTMLElement>('[input]');\n }\n\n get #tags() {\n return this.shadowRoot!.querySelector('.tags');\n }\n\n get #caret() {\n return this.shadowRoot!.querySelector<Icon>('[name=\"caret\"]');\n }\n\n get #placeholderOption() {\n return this.#options.find(o => o.selected && o.hidden && o.disabled);\n }\n\n #observers: (MutationObserver | ResizeObserver)[] = [];\n\n get #multipleSelectLabel() {\n const option = this.#placeholderOption;\n const label = option ? option.innerText : `${this.#select.selectedOptions.length} ${this.i18n.selected}`;\n return html`<div class=\"tags-label ${option ? 'placeholder' : ''}\" aria-hidden=\"true\">${label}</div>`;\n }\n\n protected get prefixContent() {\n return this.#select?.multiple && this.#select?.size === 0\n ? html`\n ${this.#multipleSelectLabel}\n <div class=\"tags\">\n ${this.#options\n .filter(o => o.selected && o !== this.#placeholderOption)\n .map(\n o => html`\n <nve-tag part=\"tag\" readonly color=\"gray-slate\" closable .value=${o.value} @click=${() => this.#selectValue(o, false)}>${o.textContent}</nve-tag>`\n )}\n </div>`\n : nothing;\n }\n\n get #menu() {\n return html`\n <nve-menu part=\"menu\" role=\"listbox\" style=\"--width: 100%; --min-width: fit-content\" aria-label=${ifDefined(this.i18n.select)}>\n ${this.#options\n .filter(o => o !== this.#placeholderOption)\n .map(\n (o, i) => html`\n <nve-menu-item part=\"menu-item\" role=\"option\" @click=${() => this.#selectValue(o, !o.selected)} ?selected=${o.selected} ?disabled=${o.disabled} ?hidden=${!!o.hidden} aria-selected=${o.selected}>\n <slot name=\"option-${i + 1}\">\n <nve-icon part=\"icon\" name=\"check\" size=\"sm\" aria-hidden=\"true\"></nve-icon> ${o.innerText}\n </slot>\n </nve-menu-item>`\n )}\n </nve-menu>`;\n }\n\n protected get suffixContent() {\n return this.#select?.size === 0\n ? html`\n <nve-icon name=\"caret\" part=\"caret\" direction=\"down\" size=\"sm\" aria-hidden=\"true\"></nve-icon>\n <nve-dropdown part=\"dropdown\" @close=${this.#closeDropdown} @open=${this.#openDropdown} hidden .anchor=${this.#input as HTMLElement} position=\"bottom\">\n ${this.#menu}\n </nve-dropdown>`\n : this.#menu;\n }\n\n async firstUpdated(props: PropertyValues<this>) {\n super.firstUpdated(props);\n await this.updateComplete;\n this.#setupCustomSelectUI();\n }\n\n #syncSelectValueStates() {\n this.#observers.push(\n getElementUpdate(this.#select, 'value', () => this.requestUpdate()),\n onChildListMutation(this.#select, () => this.requestUpdate(), { attributes: true, subtree: true }),\n onChildListMutation(this.#select, () => this.#syncOptionSelectedStates(), { subtree: true })\n );\n }\n\n #optionObservers = new Map<HTMLOptionElement, MutationObserver>();\n\n #setupObservers() {\n this.#disconnectObservers();\n this.#setupOverflowListener();\n this.#syncSelectValueStates();\n this.#syncOptionSelectedStates();\n }\n\n #disconnectObservers() {\n this.#observers.forEach(observer => observer.disconnect());\n this.#observers = [];\n this.#optionObservers.clear();\n }\n\n #syncOptionSelectedStates() {\n const options = new Set(this.#options);\n\n this.#optionObservers.forEach((observer, option) => {\n if (!options.has(option)) {\n observer.disconnect();\n this.#optionObservers.delete(option);\n this.#observers = this.#observers.filter(o => o !== observer);\n }\n });\n\n this.#options.forEach(o => {\n if (!this.#optionObservers.has(o)) {\n const observer = getElementUpdate(o, 'selected', () => this.requestUpdate());\n this.#optionObservers.set(o, observer);\n this.#observers.push(observer);\n }\n });\n }\n\n connectedCallback() {\n super.connectedCallback();\n appendRootNodeStyle(this, globalStyles);\n void this.updateComplete.then(() => {\n if (this.isConnected) {\n this.#setupObservers();\n }\n });\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.#disconnectObservers();\n }\n\n async updated(props: PropertyValues<this>) {\n super.updated(props);\n if (this.#select?.size && this.#select?.size !== 0) {\n this._internals.states.add('size');\n this.style.setProperty('--size', `${this.#select?.size + 0.75}`);\n } else {\n this._internals.states.delete('size');\n this.style.removeProperty('--size');\n }\n\n if (this.#select?.multiple && this.#select?.size === 0) {\n this._internals.states.add('multiple');\n } else {\n this._internals.states.delete('multiple');\n }\n }\n\n #setupCustomSelectUI() {\n if (this.#select?.size === 0) {\n onListboxActivate(this.#select, () => {\n this.requestUpdate(); // update menu items\n this.#dropdown!.style.setProperty('--min-width', `${this.#input!.getBoundingClientRect().width}px`);\n this.#dropdown!.showPopover();\n focusElementTimeout(this.#menuItems[0] as HTMLElement);\n });\n }\n }\n\n #openDropdown() {\n this.#dropdown!.hidden = false;\n this.#caret!.direction = 'up';\n }\n\n #closeDropdown() {\n this.#dropdown!.hidden = true;\n this.#caret!.direction = 'down';\n }\n\n #setupOverflowListener() {\n const observer = new ResizeObserver(entries => this.#updateMultipleOverflow(entries[0]!.contentRect.width));\n this.#observers.push(observer);\n observer.observe(this.#input!);\n }\n\n async #selectValue(option: HTMLOptionElement, selected: boolean) {\n if (this.#select.multiple || (!this.#select.multiple && option.value !== this.#select.value)) {\n option.selected = selected;\n }\n\n // native select only the first selected option determines the select input value\n if (this.#select.selectedOptions.length < 1) {\n this.#select.value = selected ? option.value : '';\n }\n\n this.#select.dispatchEvent(new Event('input', { bubbles: true }));\n this.#select.dispatchEvent(new Event('change', { bubbles: true }));\n this.requestUpdate();\n\n if (!this.#select.multiple && this.#dropdown) {\n this.#dropdown.hidePopover();\n } else {\n await this.updateComplete;\n this.#updateMultipleOverflow(this.#input!.getBoundingClientRect().width);\n }\n }\n\n #updateMultipleOverflow(width: number) {\n const tags = this.#tags;\n if (this.#select?.multiple && tags && tags.getBoundingClientRect().width > width - 48) {\n this._internals.states.add('multiple-overflow');\n } else {\n this._internals.states.delete('multiple-overflow');\n }\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"select2.js","names":["#i18nController","#select","#options","#dropdown","#menuItems","#input","#tags","#caret","#placeholderOption","#multipleSelectLabel","#selectValue","#menu","#closeDropdown","#openDropdown","#setupCustomSelectUI","#observers","#syncOptionSelectedStates","#disconnectObservers","#setupOverflowListener","#syncSelectValueStates","#optionObservers","#setupObservers","#updateMultipleOverflow"],"sources":["../../src/select/select.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, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport {\n focusElementTimeout,\n onListboxActivate,\n useStyles,\n i18n,\n I18nController,\n onChildListMutation,\n getElementUpdate,\n scopedRegistry,\n appendRootNodeStyle\n} from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport { Menu, MenuItem } from '@nvidia-elements/core/menu';\nimport { Dropdown } from '@nvidia-elements/core/dropdown';\nimport { Tag } from '@nvidia-elements/core/tag';\nimport styles from './select.css?inline';\nimport globalStyles from './select.global.css?inline';\n\n/**\n * @element nve-select\n * @description A select is a control that enables users to select an option from a list of options.\n * @documentation https://nvidia.github.io/elements/docs/elements/select/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/select\n * @cssprop --padding\n * @cssprop --font-size\n * @cssprop --height\n * @cssprop --background\n * @cssprop --color\n * @cssprop --border-radius\n * @cssprop --border\n * @cssprop --border-bottom\n * @cssprop --cursor\n * @cssprop --font-weight\n * @cssprop --text-align\n * @cssprop --scroll-height\n * @cssprop --width\n * @cssprop --control-width\n * @cssprop --max-width\n * @cssprop --min-width\n * @cssprop --box-shadow\n * @cssprop --max-height\n * @cssprop --text-transform\n * @csspart tag\n * @csspart menu - The dropdown menu element\n * @csspart menu-item - The menu item elements\n * @csspart icon - The icon element\n * @csspart caret - The caret/chevron icon element\n * @csspart dropdown - The dropdown popup element\n * @slot - Select input element\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select\n */\n@i18n<Select>()\n@scopedRegistry()\nexport class Select extends Control {\n static styles = useStyles([...Control.styles, styles]);\n\n static readonly metadata = {\n tag: 'nve-select',\n version: '0.0.0'\n };\n\n static elementDefinitions = {\n [Icon.metadata.tag]: Icon,\n [Dropdown.metadata.tag]: Dropdown,\n [Menu.metadata.tag]: Menu,\n [MenuItem.metadata.tag]: MenuItem,\n [Tag.metadata.tag]: Tag\n };\n\n /** Flat container option applies when embedding the component within another containing element */\n @property({ type: String, reflect: true }) container?: 'flat' | 'inline';\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 get #select() {\n return this.input as unknown as HTMLSelectElement;\n }\n\n get #options() {\n return Array.from(this.#select?.options ? this.#select.options : []);\n }\n\n get #dropdown() {\n return this.shadowRoot!.querySelector<Dropdown>(Dropdown.metadata.tag);\n }\n\n get #menuItems() {\n return this.shadowRoot!.querySelectorAll<MenuItem>(MenuItem.metadata.tag);\n }\n\n get #input() {\n return this.shadowRoot!.querySelector<HTMLElement>('[input]');\n }\n\n get #tags() {\n return this.shadowRoot!.querySelector('.tags');\n }\n\n get #caret() {\n return this.shadowRoot!.querySelector<Icon>('[name=\"caret\"]');\n }\n\n get #placeholderOption() {\n return this.#options.find(o => o.selected && o.hidden && o.disabled);\n }\n\n #observers: (MutationObserver | ResizeObserver)[] = [];\n\n get #multipleSelectLabel() {\n const option = this.#placeholderOption;\n const label = option ? option.innerText : `${this.#select.selectedOptions.length} ${this.i18n.selected}`;\n return html`<div class=\"tags-label ${option ? 'placeholder' : ''}\" aria-hidden=\"true\">${label}</div>`;\n }\n\n protected get prefixContent() {\n return this.#select?.multiple && this.#select?.size === 0\n ? html`\n ${this.#multipleSelectLabel}\n <div class=\"tags\">\n ${this.#options\n .filter(o => o.selected && o !== this.#placeholderOption)\n .map(\n o => html`\n <nve-tag part=\"tag\" readonly color=\"gray-slate\" closable .value=${o.value} @click=${() => this.#selectValue(o, false)}>${o.textContent}</nve-tag>`\n )}\n </div>`\n : nothing;\n }\n\n get #menu() {\n return html`\n <nve-menu part=\"menu\" role=\"listbox\" style=\"--width: 100%; --min-width: fit-content\" aria-label=${ifDefined(this.i18n.select)}>\n ${this.#options\n .filter(o => o !== this.#placeholderOption)\n .map(\n (o, i) => html`\n <nve-menu-item part=\"menu-item\" role=\"option\" @click=${() => this.#selectValue(o, !o.selected)} ?selected=${o.selected} ?disabled=${o.disabled} ?hidden=${!!o.hidden} aria-selected=${o.selected}>\n <slot name=\"option-${i + 1}\">\n <nve-icon part=\"icon\" name=\"check\" size=\"sm\" aria-hidden=\"true\"></nve-icon> ${o.innerText}\n </slot>\n </nve-menu-item>`\n )}\n </nve-menu>`;\n }\n\n protected get suffixContent() {\n return this.#select?.size === 0\n ? html`\n <nve-icon name=\"caret\" part=\"caret\" direction=\"down\" size=\"sm\" aria-hidden=\"true\"></nve-icon>\n <nve-dropdown part=\"dropdown\" @close=${this.#closeDropdown} @open=${this.#openDropdown} hidden .anchor=${this.#input as HTMLElement} position=\"bottom\">\n ${this.#menu}\n </nve-dropdown>`\n : this.#menu;\n }\n\n async firstUpdated(props: PropertyValues<this>) {\n super.firstUpdated(props);\n await this.updateComplete;\n this.#setupCustomSelectUI();\n }\n\n #syncSelectValueStates() {\n this.#observers.push(\n getElementUpdate(this.#select, 'value', () => this.requestUpdate()),\n onChildListMutation(this.#select, () => this.requestUpdate(), { attributes: true, subtree: true }),\n onChildListMutation(this.#select, () => this.#syncOptionSelectedStates(), { subtree: true })\n );\n }\n\n #optionObservers = new Map<HTMLOptionElement, MutationObserver>();\n\n #setupObservers() {\n this.#disconnectObservers();\n this.#setupOverflowListener();\n this.#syncSelectValueStates();\n this.#syncOptionSelectedStates();\n }\n\n #disconnectObservers() {\n this.#observers.forEach(observer => observer.disconnect());\n this.#observers = [];\n this.#optionObservers.clear();\n }\n\n #syncOptionSelectedStates() {\n const options = new Set(this.#options);\n\n this.#optionObservers.forEach((observer, option) => {\n if (!options.has(option)) {\n observer.disconnect();\n this.#optionObservers.delete(option);\n this.#observers = this.#observers.filter(o => o !== observer);\n }\n });\n\n this.#options.forEach(o => {\n if (!this.#optionObservers.has(o)) {\n const observer = getElementUpdate(o, 'selected', () => this.requestUpdate());\n this.#optionObservers.set(o, observer);\n this.#observers.push(observer);\n }\n });\n }\n\n connectedCallback() {\n super.connectedCallback();\n appendRootNodeStyle(this, globalStyles);\n void this.updateComplete.then(() => {\n if (this.isConnected) {\n this.#setupObservers();\n }\n });\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.#disconnectObservers();\n }\n\n async updated(props: PropertyValues<this>) {\n super.updated(props);\n if (this.#select?.size && this.#select?.size !== 0) {\n this._internals.states.add('size');\n this.style.setProperty('--size', `${this.#select.size}`);\n } else {\n this._internals.states.delete('size');\n this.style.removeProperty('--size');\n }\n\n if (this.#select?.multiple && this.#select?.size === 0) {\n this._internals.states.add('multiple');\n } else {\n this._internals.states.delete('multiple');\n }\n }\n\n #setupCustomSelectUI() {\n if (this.#select?.size === 0) {\n onListboxActivate(this.#select, () => {\n this.requestUpdate(); // update menu items\n this.#dropdown!.style.setProperty('--min-width', `${this.#input!.getBoundingClientRect().width}px`);\n this.#dropdown!.showPopover();\n focusElementTimeout(this.#menuItems[0] as HTMLElement);\n });\n }\n }\n\n #openDropdown() {\n this.#dropdown!.hidden = false;\n this.#caret!.direction = 'up';\n }\n\n #closeDropdown() {\n this.#dropdown!.hidden = true;\n this.#caret!.direction = 'down';\n }\n\n #setupOverflowListener() {\n const observer = new ResizeObserver(entries => this.#updateMultipleOverflow(entries[0]!.contentRect.width));\n this.#observers.push(observer);\n observer.observe(this.#input!);\n }\n\n async #selectValue(option: HTMLOptionElement, selected: boolean) {\n if (this.#select.multiple || (!this.#select.multiple && option.value !== this.#select.value)) {\n option.selected = selected;\n }\n\n // native select only the first selected option determines the select input value\n if (this.#select.selectedOptions.length < 1) {\n this.#select.value = selected ? option.value : '';\n }\n\n this.#select.dispatchEvent(new Event('input', { bubbles: true }));\n this.#select.dispatchEvent(new Event('change', { bubbles: true }));\n this.requestUpdate();\n\n if (!this.#select.multiple && this.#dropdown) {\n this.#dropdown.hidePopover();\n } else {\n await this.updateComplete;\n this.#updateMultipleOverflow(this.#input!.getBoundingClientRect().width);\n }\n }\n\n #updateMultipleOverflow(width: number) {\n const tags = this.#tags;\n if (this.#select?.multiple && tags && tags.getBoundingClientRect().width > width - 48) {\n this._internals.states.add('multiple-overflow');\n } else {\n this._internals.states.delete('multiple-overflow');\n }\n }\n}\n"],"mappings":"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"}
|
package/dist/steps/steps2.js
CHANGED
|
@@ -23,7 +23,7 @@ var v = class extends h(d) {
|
|
|
23
23
|
static {
|
|
24
24
|
this.metadata = {
|
|
25
25
|
tag: "nve-steps-item",
|
|
26
|
-
version: "2.2.
|
|
26
|
+
version: "2.2.2",
|
|
27
27
|
parents: ["nve-steps"]
|
|
28
28
|
};
|
|
29
29
|
}
|
|
@@ -69,7 +69,7 @@ var y = class extends d {
|
|
|
69
69
|
static {
|
|
70
70
|
this.metadata = {
|
|
71
71
|
tag: "nve-steps",
|
|
72
|
-
version: "2.2.
|
|
72
|
+
version: "2.2.2",
|
|
73
73
|
children: ["nve-steps-item"]
|
|
74
74
|
};
|
|
75
75
|
}
|
package/dist/switch/switch2.js
CHANGED
package/dist/tabs/tabs-group2.js
CHANGED
package/dist/tabs/tabs2.js
CHANGED
|
@@ -20,7 +20,7 @@ var _ = class extends h(f) {
|
|
|
20
20
|
static {
|
|
21
21
|
this.metadata = {
|
|
22
22
|
tag: "nve-tabs-item",
|
|
23
|
-
version: "2.2.
|
|
23
|
+
version: "2.2.2",
|
|
24
24
|
parents: ["nve-tabs"]
|
|
25
25
|
};
|
|
26
26
|
}
|
|
@@ -53,7 +53,7 @@ var v = class extends f {
|
|
|
53
53
|
static {
|
|
54
54
|
this.metadata = {
|
|
55
55
|
tag: "nve-tabs",
|
|
56
|
-
version: "2.2.
|
|
56
|
+
version: "2.2.2",
|
|
57
57
|
children: ["nve-tabs-item"]
|
|
58
58
|
};
|
|
59
59
|
}
|
package/dist/tag/tag2.js
CHANGED
package/dist/time/time2.js
CHANGED
package/dist/toast/toast2.js
CHANGED
package/dist/toolbar/toolbar2.js
CHANGED
package/dist/tooltip/tooltip2.js
CHANGED
package/dist/tree/tree-node2.js
CHANGED
package/dist/tree/tree2.js
CHANGED
package/dist/week/week2.js
CHANGED