@nvidia-elements/core 2.18.4 → 2.19.1
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 +23 -0
- package/dist/_virtual/_rolldown/runtime.js +17 -0
- package/dist/accordion/accordion2.js +60 -57
- package/dist/accordion/accordion2.js.map +1 -1
- package/dist/alert/alert-group2.js +1 -1
- package/dist/alert/alert2.js +37 -31
- package/dist/alert/alert2.js.map +1 -1
- package/dist/avatar/avatar-group2.js +1 -1
- package/dist/avatar/avatar2.js +1 -1
- package/dist/badge/badge.d.ts +0 -6
- package/dist/badge/badge2.js +31 -36
- package/dist/badge/badge2.js.map +1 -1
- package/dist/breadcrumb/breadcrumb2.js +1 -1
- package/dist/bundles/index.d.ts +31 -27
- package/dist/bundles/index.js +8 -8
- 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/color.d.ts +2 -0
- package/dist/color/color2.js +7 -4
- package/dist/color/color2.js.map +1 -1
- package/dist/combobox/combobox.d.ts +2 -0
- package/dist/combobox/combobox2.js +14 -6
- package/dist/combobox/combobox2.js.map +1 -1
- package/dist/copy-button/copy-button2.js +26 -23
- package/dist/copy-button/copy-button2.js.map +1 -1
- package/dist/custom-elements-jsx.d.ts +6 -4
- package/dist/custom-elements-vue.d.ts +6 -4
- package/dist/custom-elements.json +90 -174
- package/dist/data.html.json +10 -10
- package/dist/data.snippets.json +60 -60
- package/dist/date/date.d.ts +2 -0
- package/dist/date/date2.js +7 -4
- package/dist/date/date2.js.map +1 -1
- package/dist/datetime/datetime.d.ts +2 -0
- package/dist/datetime/datetime2.js +7 -4
- package/dist/datetime/datetime2.js.map +1 -1
- package/dist/dialog/dialog-footer2.js +1 -1
- package/dist/dialog/dialog-header2.js +1 -1
- package/dist/dialog/dialog2.js +27 -27
- package/dist/dialog/dialog2.js.map +1 -1
- package/dist/divider/divider2.js +1 -1
- package/dist/dot/dot2.js +1 -1
- package/dist/drag-handle/drag-handle2.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/drawer2.js +27 -27
- package/dist/drawer/drawer2.js.map +1 -1
- package/dist/dropdown/dropdown-footer2.js +1 -1
- package/dist/dropdown/dropdown-header2.js +1 -1
- package/dist/dropdown/dropdown2.js +23 -23
- package/dist/dropdown/dropdown2.js.map +1 -1
- package/dist/dropdown-group/dropdown-group.js +1 -1
- package/dist/dropzone/dropzone2.js +28 -22
- package/dist/dropzone/dropzone2.js.map +1 -1
- package/dist/file/file2.js +1 -1
- package/dist/format-bytes/format-bytes2.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/format-truncate/format-truncate2.js +1 -1
- package/dist/forms/control/control.d.ts +3 -0
- package/dist/forms/control/control2.js +34 -31
- package/dist/forms/control/control2.js.map +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 +26 -21
- package/dist/gauge/gauge2.js.map +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/iframe/iframe2.js +1 -1
- package/dist/index.js +5 -6
- package/dist/input/input-group2.js +1 -1
- package/dist/input/input2.js +1 -1
- package/dist/internal/index.d.ts +1 -2
- package/dist/internal/index.js +150 -33
- package/dist/internal/index.js.map +1 -0
- package/dist/internal/types/index.d.ts +1 -1
- package/dist/internal/types/index.js.map +1 -1
- package/dist/logo/logo2.js +1 -1
- package/dist/menu/menu-group2.js +1 -1
- package/dist/menu/menu-item2.js +1 -1
- package/dist/menu/menu2.js +1 -1
- package/dist/month/month.d.ts +2 -0
- package/dist/month/month2.js +7 -4
- package/dist/month/month2.js.map +1 -1
- package/dist/notification/notification-group2.js +1 -1
- package/dist/notification/notification2.js +38 -32
- package/dist/notification/notification2.js.map +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-panel.d.ts +0 -7
- package/dist/page/page-panel/page-panel2.js +18 -20
- package/dist/page/page-panel/page-panel2.js.map +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 +45 -38
- package/dist/pagination/pagination2.js.map +1 -1
- package/dist/panel/panel2.js +43 -38
- package/dist/panel/panel2.js.map +1 -1
- package/dist/password/password.d.ts +2 -0
- package/dist/password/password2.js +10 -4
- package/dist/password/password2.js.map +1 -1
- package/dist/preferences-input/preferences-input2.js +32 -27
- package/dist/preferences-input/preferences-input2.js.map +1 -1
- package/dist/progress-bar/progress-bar2.js +1 -1
- package/dist/progress-dot/progress-dot2.js +17 -17
- package/dist/progress-dot/progress-dot2.js.map +1 -1
- package/dist/progress-ring/progress-ring2.js +27 -22
- package/dist/progress-ring/progress-ring2.js.map +1 -1
- package/dist/progressive-filter-chip/progressive-filter-chip2.js +30 -30
- package/dist/progressive-filter-chip/progressive-filter-chip2.js.map +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 +17 -17
- package/dist/resize-handle/resize-handle2.js.map +1 -1
- package/dist/search/search2.js +1 -1
- package/dist/select/select2.js +44 -41
- package/dist/select/select2.js.map +1 -1
- package/dist/skeleton/skeleton2.js +1 -1
- package/dist/sort-button/sort-button2.js +20 -20
- package/dist/sort-button/sort-button2.js.map +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/tabs-item-group2.js +1 -1
- package/dist/tabs/tabs2.js +2 -2
- package/dist/tag/tag2.js +19 -19
- package/dist/tag/tag2.js.map +1 -1
- package/dist/textarea/textarea2.js +1 -1
- package/dist/time/time.d.ts +2 -0
- package/dist/time/time2.js +7 -4
- package/dist/time/time2.js.map +1 -1
- package/dist/toast/toast2.js +35 -29
- package/dist/toast/toast2.js.map +1 -1
- package/dist/toggletip/toggletip-footer2.js +1 -1
- package/dist/toggletip/toggletip-header2.js +1 -1
- package/dist/toggletip/toggletip2.js +25 -25
- package/dist/toggletip/toggletip2.js.map +1 -1
- package/dist/toolbar/toolbar2.js +1 -1
- package/dist/tooltip/tooltip2.js +1 -1
- package/dist/tree/tree-node.d.ts +6 -0
- package/dist/tree/tree-node2.js +43 -30
- package/dist/tree/tree-node2.js.map +1 -1
- package/dist/tree/tree.examples.js.map +1 -1
- package/dist/tree/tree.examples.json +9 -0
- package/dist/tree/tree2.js +1 -1
- package/dist/week/week.d.ts +2 -0
- package/dist/week/week2.js +7 -4
- package/dist/week/week2.js.map +1 -1
- package/package.json +4 -4
- package/dist/internal/controllers/i18n.controller.d.ts +0 -19
- package/dist/internal/controllers/i18n.controller.examples.js +0 -6
- package/dist/internal/controllers/i18n.controller.examples.js.map +0 -1
- package/dist/internal/controllers/i18n.controller.examples.json +0 -16
- package/dist/internal/controllers/i18n.controller.js +0 -38
- package/dist/internal/controllers/i18n.controller.js.map +0 -1
- package/dist/internal/services/i18n.service.d.ts +0 -64
- package/dist/internal/services/i18n.service.js +0 -73
- package/dist/internal/services/i18n.service.js.map +0 -1
package/dist/button/button2.js
CHANGED
package/dist/card/card2.js
CHANGED
|
@@ -16,7 +16,7 @@ var d = class extends c {
|
|
|
16
16
|
static {
|
|
17
17
|
this.metadata = {
|
|
18
18
|
tag: "nve-card",
|
|
19
|
-
version: "2.
|
|
19
|
+
version: "2.19.1"
|
|
20
20
|
};
|
|
21
21
|
}
|
|
22
22
|
render() {
|
|
@@ -37,7 +37,7 @@ var f = class extends c {
|
|
|
37
37
|
static {
|
|
38
38
|
this.metadata = {
|
|
39
39
|
tag: "nve-card-header",
|
|
40
|
-
version: "2.
|
|
40
|
+
version: "2.19.1",
|
|
41
41
|
parents: ["nve-card"]
|
|
42
42
|
};
|
|
43
43
|
}
|
|
@@ -53,7 +53,7 @@ var p = class extends c {
|
|
|
53
53
|
static {
|
|
54
54
|
this.metadata = {
|
|
55
55
|
tag: "nve-card-content",
|
|
56
|
-
version: "2.
|
|
56
|
+
version: "2.19.1",
|
|
57
57
|
parents: ["nve-card"]
|
|
58
58
|
};
|
|
59
59
|
}
|
|
@@ -70,7 +70,7 @@ var p = class extends c {
|
|
|
70
70
|
static {
|
|
71
71
|
this.metadata = {
|
|
72
72
|
tag: "nve-card-footer",
|
|
73
|
-
version: "2.
|
|
73
|
+
version: "2.19.1",
|
|
74
74
|
parents: ["nve-card"]
|
|
75
75
|
};
|
|
76
76
|
}
|
package/dist/color/color.d.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import type { ContainerElement } from '@nvidia-elements/core/internal';
|
|
2
2
|
import { Control } from '@nvidia-elements/core/forms';
|
|
3
3
|
import { IconButton } from '@nvidia-elements/core/icon-button';
|
|
4
|
+
import type { I18nDefaults } from '@nvidia-elements/foundations/internal/i18n';
|
|
4
5
|
/**
|
|
5
6
|
* @element nve-color
|
|
6
7
|
* @description A color picker is a control that enables users to choose a color value.
|
|
@@ -13,6 +14,7 @@ import { IconButton } from '@nvidia-elements/core/icon-button';
|
|
|
13
14
|
*/
|
|
14
15
|
export declare class Color extends Control implements ContainerElement {
|
|
15
16
|
#private;
|
|
17
|
+
protected get i18nDefaults(): I18nDefaults;
|
|
16
18
|
/**
|
|
17
19
|
* Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
|
|
18
20
|
* Use when embedding within another container such as a toolbar.
|
package/dist/color/color2.js
CHANGED
|
@@ -10,7 +10,10 @@ import l from "./color.js";
|
|
|
10
10
|
import { html as u } from "lit";
|
|
11
11
|
import { property as d } from "lit/decorators/property.js";
|
|
12
12
|
//#region src/color/color.ts
|
|
13
|
-
var f = class extends a {
|
|
13
|
+
var f = { expand: "expand" }, p = class extends a {
|
|
14
|
+
get i18nDefaults() {
|
|
15
|
+
return f;
|
|
16
|
+
}
|
|
14
17
|
static {
|
|
15
18
|
this.styles = r([
|
|
16
19
|
...a.styles,
|
|
@@ -21,7 +24,7 @@ var f = class extends a {
|
|
|
21
24
|
static {
|
|
22
25
|
this.metadata = {
|
|
23
26
|
tag: "nve-color",
|
|
24
|
-
version: "2.
|
|
27
|
+
version: "2.19.1"
|
|
25
28
|
};
|
|
26
29
|
}
|
|
27
30
|
static {
|
|
@@ -43,8 +46,8 @@ var f = class extends a {
|
|
|
43
46
|
i([d({
|
|
44
47
|
type: String,
|
|
45
48
|
reflect: !0
|
|
46
|
-
})],
|
|
49
|
+
})], p.prototype, "container", void 0), p = i([n()], p);
|
|
47
50
|
//#endregion
|
|
48
|
-
export {
|
|
51
|
+
export { p as Color };
|
|
49
52
|
|
|
50
53
|
//# sourceMappingURL=color2.js.map
|
package/dist/color/color2.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"color2.js","names":[],"sources":["../../src/color/color.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 { appendRootNodeStyle, openEyeDropper, scopedRegistry, useStyles } from '@nvidia-elements/core/internal';\nimport type { ContainerElement } from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport { inputStyles } from '@nvidia-elements/core/input';\nimport globalStyles from './color.global.css?inline';\nimport styles from './color.css?inline';\n\n/**\n * @element nve-color\n * @description A color picker is a control that enables users to choose a color value.\n * @documentation https://nvidia.github.io/elements/docs/elements/color/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/color\n * @cssprop --cursor\n * @csspart icon-button - The eye dropper icon button element\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/color\n */\n@scopedRegistry()\nexport class Color extends Control implements ContainerElement {\n /**\n * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.\n * Use when embedding within another container such as a toolbar.\n */\n @property({ type: String, reflect: true }) container?: 'flat';\n\n static styles = useStyles([...Control.styles, inputStyles, styles]);\n\n static readonly metadata = {\n tag: 'nve-color',\n version: '0.0.0'\n };\n\n static elementDefinitions = {\n [IconButton.metadata.tag]: IconButton\n };\n\n protected get suffixContent() {\n return html`<nve-icon-button part=\"icon-button\" .role=${'button'} .ariaLabel=${this.i18n.expand} icon-name=\"dropper\" container=\"inline\" @click=${() => this.#select()}></nve-icon-button>`;\n }\n\n connectedCallback() {\n super.connectedCallback();\n appendRootNodeStyle(this, globalStyles);\n if (this.input.value === '#000000') {\n const color = getComputedStyle(this).getPropertyValue('--background').trim();\n if (color.includes('#')) {\n this.input.value = color;\n }\n }\n }\n\n async #select() {\n this.input.value = await openEyeDropper();\n this.input.dispatchEvent(new Event('input', { bubbles: true }));\n this.input.dispatchEvent(new Event('change', { bubbles: true }));\n }\n}\n"],"mappings":";;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"color2.js","names":[],"sources":["../../src/color/color.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 { appendRootNodeStyle, openEyeDropper, scopedRegistry, useStyles } from '@nvidia-elements/core/internal';\nimport type { ContainerElement } from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport { inputStyles } from '@nvidia-elements/core/input';\nimport globalStyles from './color.global.css?inline';\nimport type { I18nDefaults } from '@nvidia-elements/foundations/internal/i18n';\nimport styles from './color.css?inline';\n\nconst i18nDefaults = {\n expand: 'expand'\n} satisfies I18nDefaults;\n\n/**\n * @element nve-color\n * @description A color picker is a control that enables users to choose a color value.\n * @documentation https://nvidia.github.io/elements/docs/elements/color/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/color\n * @cssprop --cursor\n * @csspart icon-button - The eye dropper icon button element\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/color\n */\n@scopedRegistry()\nexport class Color extends Control implements ContainerElement {\n protected override get i18nDefaults(): I18nDefaults {\n return i18nDefaults;\n }\n\n /**\n * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.\n * Use when embedding within another container such as a toolbar.\n */\n @property({ type: String, reflect: true }) container?: 'flat';\n\n static styles = useStyles([...Control.styles, inputStyles, styles]);\n\n static readonly metadata = {\n tag: 'nve-color',\n version: '0.0.0'\n };\n\n static elementDefinitions = {\n [IconButton.metadata.tag]: IconButton\n };\n\n protected get suffixContent() {\n return html`<nve-icon-button part=\"icon-button\" .role=${'button'} .ariaLabel=${this.i18n.expand} icon-name=\"dropper\" container=\"inline\" @click=${() => this.#select()}></nve-icon-button>`;\n }\n\n connectedCallback() {\n super.connectedCallback();\n appendRootNodeStyle(this, globalStyles);\n if (this.input.value === '#000000') {\n const color = getComputedStyle(this).getPropertyValue('--background').trim();\n if (color.includes('#')) {\n this.input.value = color;\n }\n }\n }\n\n async #select() {\n this.input.value = await openEyeDropper();\n this.input.dispatchEvent(new Event('input', { bubbles: true }));\n this.input.dispatchEvent(new Event('change', { bubbles: true }));\n }\n}\n"],"mappings":";;;;;;;;;;;;AAcA,IAAM,IAAe,EACnB,QAAQ,SACV,GAaa,IAAN,cAAoB,EAAoC;CAC7D,IAAuB,eAA6B;EAClD,OAAO;CACT;;EAQgB,KAAA,SAAA,EAAU;GAAC,GAAG,EAAQ;GAAQ;GAAa;EAAM,CAAC;;;EAEvC,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;;EAE4B,KAAA,qBAAA,GACzB,EAAW,SAAS,MAAM,EAC7B;;CAEA,IAAc,gBAAgB;EAC5B,OAAO,CAAI,8CAA6C,SAAS,gBAAc,KAAK,KAAK,OAAO,yDAAuD,KAAK,GAAQ,EAAE;CACxK;CAEA,oBAAoB;EAGlB,IAFA,MAAM,kBAAkB,GACxB,EAAoB,MAAM,CAAY,GAClC,KAAK,MAAM,UAAU,WAAW;GAClC,IAAM,IAAQ,iBAAiB,IAAI,CAAC,CAAC,iBAAiB,cAAc,CAAC,CAAC,KAAK;GAC3E,AAAI,EAAM,SAAS,GAAG,MACpB,KAAK,MAAM,QAAQ;EAEvB;CACF;CAEA,MAAM,KAAU;EAGd,AAFA,KAAK,MAAM,QAAQ,MAAM,EAAe,GACxC,KAAK,MAAM,cAAc,IAAI,MAAM,SAAS,EAAE,SAAS,GAAK,CAAC,CAAC,GAC9D,KAAK,MAAM,cAAc,IAAI,MAAM,UAAU,EAAE,SAAS,GAAK,CAAC,CAAC;CACjE;AACF;AAjCG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,GAV1C,IAAA,EAAA,CAAA,EAAe,CAAA,GAAA,CAAA"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import type { PropertyValues } from 'lit';
|
|
2
2
|
import { nothing } from 'lit';
|
|
3
3
|
import type { ContainerElement } from '@nvidia-elements/core/internal';
|
|
4
|
+
import type { I18nDefaults } from '@nvidia-elements/foundations/internal/i18n';
|
|
4
5
|
import { Control } from '@nvidia-elements/core/forms';
|
|
5
6
|
import { Menu, MenuItem } from '@nvidia-elements/core/menu';
|
|
6
7
|
import { Dropdown } from '@nvidia-elements/core/dropdown';
|
|
@@ -43,6 +44,7 @@ import { Checkbox } from '@nvidia-elements/core/checkbox';
|
|
|
43
44
|
*/
|
|
44
45
|
export declare class Combobox extends Control implements ContainerElement {
|
|
45
46
|
#private;
|
|
47
|
+
protected get i18nDefaults(): I18nDefaults;
|
|
46
48
|
/**
|
|
47
49
|
* Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
|
|
48
50
|
* Use when embedding within another container such as a toolbar.
|
|
@@ -17,10 +17,18 @@ import { html as _, isServer as v, nothing as y } from "lit";
|
|
|
17
17
|
import { property as b } from "lit/decorators/property.js";
|
|
18
18
|
import { ifDefined as x } from "lit/directives/if-defined.js";
|
|
19
19
|
//#region src/combobox/combobox.ts
|
|
20
|
-
var S =
|
|
20
|
+
var S = {
|
|
21
|
+
select: "select",
|
|
22
|
+
selected: "selected",
|
|
23
|
+
noResults: "no results",
|
|
24
|
+
create: "create"
|
|
25
|
+
}, C = class extends l {
|
|
21
26
|
constructor(...e) {
|
|
22
27
|
super(...e), this.#p = [], this.#m = !1, this._associateDatalist = !1, this.#w = /* @__PURE__ */ new Map();
|
|
23
28
|
}
|
|
29
|
+
get i18nDefaults() {
|
|
30
|
+
return S;
|
|
31
|
+
}
|
|
24
32
|
static {
|
|
25
33
|
this.styles = a([
|
|
26
34
|
...l.styles,
|
|
@@ -31,7 +39,7 @@ var S = class extends l {
|
|
|
31
39
|
static {
|
|
32
40
|
this.metadata = {
|
|
33
41
|
tag: "nve-combobox",
|
|
34
|
-
version: "2.
|
|
42
|
+
version: "2.19.1"
|
|
35
43
|
};
|
|
36
44
|
}
|
|
37
45
|
static {
|
|
@@ -270,16 +278,16 @@ var S = class extends l {
|
|
|
270
278
|
s([b({
|
|
271
279
|
type: String,
|
|
272
280
|
reflect: !0
|
|
273
|
-
})],
|
|
281
|
+
})], C.prototype, "container", void 0), s([b({
|
|
274
282
|
type: String,
|
|
275
283
|
reflect: !0,
|
|
276
284
|
attribute: "tag-layout"
|
|
277
|
-
})],
|
|
285
|
+
})], C.prototype, "tagLayout", void 0), s([b({
|
|
278
286
|
type: Boolean,
|
|
279
287
|
reflect: !0,
|
|
280
288
|
attribute: "behavior-create"
|
|
281
|
-
})],
|
|
289
|
+
})], C.prototype, "behaviorCreate", void 0), C = s([i()], C);
|
|
282
290
|
//#endregion
|
|
283
|
-
export {
|
|
291
|
+
export { C as Combobox };
|
|
284
292
|
|
|
285
293
|
//# sourceMappingURL=combobox2.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"combobox2.js","names":[],"sources":["../../src/combobox/combobox.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, isServer, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport type { ContainerElement } from '@nvidia-elements/core/internal';\nimport {\n createLightDismiss,\n focusElementTimeout,\n getDisplayValue,\n getElementUpdate,\n getPropertyChanges,\n scopedRegistry,\n useStyles\n} from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { inputStyles } from '@nvidia-elements/core/input';\nimport { Menu, MenuItem } from '@nvidia-elements/core/menu';\nimport { Dropdown } from '@nvidia-elements/core/dropdown';\nimport { Tag } from '@nvidia-elements/core/tag';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport { Checkbox } from '@nvidia-elements/core/checkbox';\nimport styles from './combobox.css?inline';\n\n/**\n * @element nve-combobox\n * @description An editable combobox with autocomplete behavior and selection support.\n * @documentation https://nvidia.github.io/elements/docs/elements/combobox/\n * @since 0.17.0\n * @entrypoint \\@nvidia-elements/core/combobox\n * @slot - default slot for an input and a datalist/select element\n * @slot prefix-icon - slot for icon before the input\n * @slot footer - slot for dropdown footer content\n * @cssprop --scroll-height\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 --cursor\n * @cssprop --font-weight\n * @cssprop --width\n * @cssprop --border-color\n * @cssprop --max-height\n * @cssprop --text-transform\n * @csspart tag - The tag element for selected items\n * @csspart dropdown - The dropdown popup element\n * @csspart menu - The menu element\n * @csspart menu-item - The menu item elements\n * @csspart checkbox - The checkbox element\n * @csspart icon - The icon element\n * @event scroll - Fires when the user scrolls the dropdown option list. Throttled to one dispatch per animation frame. `detail: { scrollTop, scrollHeight, clientHeight }`.\n * @event create - Fires when the user confirms a value that doesn't match any existing option and the `behavior-create` attribute exists. `detail: { value }`.\n * @csspart create-option - The menu item element for creating new options\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-autocomplete-list/\n */\n@scopedRegistry()\nexport class Combobox extends Control implements ContainerElement {\n /**\n * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.\n * Use when embedding within another container such as a toolbar.\n */\n @property({ type: String, reflect: true }) container: 'flat';\n\n /** Manage inline tag rendering for many-item select */\n @property({ type: String, reflect: true, attribute: 'tag-layout' }) tagLayout: 'hidden' | 'wrap';\n\n /** Enable creation of new options when the input value doesn't match any existing option. Dispatches a `create` event with `{ value }` detail. */\n @property({ type: Boolean, reflect: true, attribute: 'behavior-create' }) behaviorCreate: boolean;\n\n static styles = useStyles([...Control.styles, inputStyles, styles]);\n\n static readonly metadata = {\n tag: 'nve-combobox',\n version: '0.0.0'\n };\n\n static elementDefinitions = {\n [Checkbox.metadata.tag]: Checkbox,\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 /**\n * If a <select> exists, on focus all options show by default.\n * If a <datalist> exists, on focus only options that match the current input value show.\n */\n\n #_datalist: HTMLSelectElement | null;\n get #datalist(): HTMLSelectElement | null {\n if (!this.#_datalist) {\n this.#_datalist = this.shadowRoot\n ? ((this.shadowRoot\n .querySelector('slot')\n ?.assignedElements({ flatten: true })\n ?.find(i => i.tagName === 'DATALIST' || i.tagName === 'SELECT') ??\n this.querySelector('datalist, select')) as HTMLSelectElement)\n : null;\n }\n return this.#_datalist;\n }\n\n #_select: HTMLSelectElement | null;\n get #select(): HTMLSelectElement | null {\n if (!this.#_select) {\n this.#_select = this.shadowRoot\n ? ((this.shadowRoot\n .querySelector('slot')\n ?.assignedElements({ flatten: true })\n ?.find(i => i.tagName === 'SELECT') ?? this.querySelector('select')) as HTMLSelectElement)\n : null;\n }\n return this.#_select;\n }\n\n get #options(): HTMLOptionElement[] {\n return Array.from(this.#datalist?.options ? this.#datalist.options : []);\n }\n\n get #items() {\n return Array.from(this.shadowRoot!.querySelectorAll<MenuItem>(MenuItem.metadata.tag));\n }\n\n get #dropdown() {\n return this.shadowRoot!.querySelector<Dropdown>(Dropdown.metadata.tag);\n }\n\n get #input() {\n return this.shadowRoot!.querySelector('[input]');\n }\n\n get #tags() {\n return this.shadowRoot!.querySelector('.tags');\n }\n\n get #hasAvailableOptions() {\n return this.#options.find(o => !o.disabled && !o.hidden);\n }\n\n get #hasFooterContent() {\n return !!this.querySelector('[slot=\"footer\"]');\n }\n\n get #showCreateItem(): boolean {\n if (!this.behaviorCreate || this.input?.disabled) return false;\n const value = this.input?.value.trim();\n if (!value) return false;\n return !this.#findOptionMatch(value);\n }\n\n #findOptionMatch(value: string): HTMLOptionElement | undefined {\n const lower = value.toLowerCase();\n return this.#options.find(o => {\n const display = o.textContent!.trim() || o.value;\n return display.toLowerCase() === lower || o.value.toLowerCase() === lower;\n });\n }\n\n #observers: (MutationObserver | ResizeObserver)[] = [];\n #syncPending = false;\n\n protected _associateDatalist = false;\n\n protected get prefixContent() {\n return this.#select?.multiple && !this.#tagLayoutIsHidden\n ? html`\n <div class=\"tags-label\" aria-hidden=\"true\">${this.#select.selectedOptions.length} ${this.i18n.selected}</div>\n <div class=\"tags\">\n ${Array.from<HTMLOptionElement>(this.#select.selectedOptions).map(\n o => html`\n <nve-tag part=\"tag\" readonly color=\"gray-slate\" closable .value=${o.value} @click=${() => this.#selectValue(o)}>${getDisplayValue(o)}</nve-tag>`\n )}\n </div>`\n : html`<slot name=\"prefix-icon\"></slot>`;\n }\n\n get #tagLayoutIsHidden() {\n return this.tagLayout === 'hidden';\n }\n\n get #largeOptionsList() {\n return (this.#datalist?.options?.length ?? 0) > 50;\n }\n\n get #isPristine() {\n return !this._internals.states.has('dirty');\n }\n\n protected get suffixContent() {\n if (isServer) return nothing;\n const options = this.#options;\n const largeOptionsList = this.#largeOptionsList;\n const isPristine = this.#isPristine;\n const visibleOptions = options.filter(o => !o.hidden).filter(o => !(o.value === '' && o.disabled));\n const hasNoResults = visibleOptions.filter(o => !o.disabled).length === 0;\n const showCreateItem = this.#showCreateItem;\n return html`\n <nve-dropdown part=\"dropdown\" .popoverType=${'manual'} .modal=${false} @open=${this.#openDropdown} @close=${this.#closeDropdown} hidden .anchor=${this.#input as HTMLElement} position=\"bottom\">\n <nve-menu part=\"menu\" role=\"listbox\" style=\"--width: 100%; --min-width: fit-content\" aria-label=${ifDefined(this.i18n.select)}>\n ${visibleOptions.map(\n o => html`\n <nve-menu-item part=\"menu-item\" .option=${getDisplayValue(o)} role=\"option\" @click=${() => this.#selectValue(o)} ?selected=${o.selected} aria-selected=${o.selected ? 'true' : 'false'} ?disabled=${o.disabled} aria-label=${getDisplayValue(o)}>\n ${this.#getOptionCheckbox(o)}\n ${largeOptionsList || isPristine ? getDisplayValue(o) : html`<span role=\"presentation\">${(o.label ? o.label : o.value)?.split('')?.map((c, ci) => html`<span ?matches=${this.#characterAtIndexMatches(c, ci)}>${c}</span>`)}</span>`}\n </nve-menu-item>`\n )}\n ${hasNoResults && !showCreateItem ? html`<nve-menu-item part=\"menu-item\" .value=${''} disabled>${this.i18n.noResults}</nve-menu-item>` : nothing}\n ${\n showCreateItem\n ? html`<nve-menu-item part=\"create-option\" role=\"button\" aria-label=${`${this.i18n.create} \"${this.input?.value.trim()}\"`} @click=${this.#onCreateItemClick}>\n <nve-icon part=\"icon\" name=\"add\" size=\"sm\"></nve-icon> \"${this.input?.value.trim()}\"\n </nve-menu-item>`\n : nothing\n }\n </nve-menu>\n <slot name=\"footer\"></slot>\n </nve-dropdown>`;\n }\n\n #getOptionCheckbox(o: HTMLOptionElement) {\n const select = this.#select;\n if (select?.multiple && this.#largeOptionsList) {\n return html`<input aria-hidden=\"true\" type=\"checkbox\" .checked=${o.selected} .disabled=${o.disabled} .name=${o.selected ? 'check' : undefined} />`;\n } else if (select?.multiple) {\n /* eslint-disable @nvidia-elements/lint/no-missing-control-label */\n return html`<nve-checkbox part=\"checkbox\"><input aria-hidden=\"true\" type=\"checkbox\" .checked=${o.selected} .disabled=${o.disabled} .name=${o.selected ? 'check' : undefined} /></nve-checkbox>`;\n } else if (select) {\n return html`<nve-icon part=\"icon\" name=\"check\" size=\"sm\"></nve-icon>`;\n } else {\n return nothing;\n }\n }\n\n async firstUpdated(props: PropertyValues<this>) {\n super.firstUpdated(props);\n this.shadowRoot!.addEventListener('slotchange', () => this.#onSlottedChildMutation());\n await this.updateComplete;\n this.#setupSingleSelect();\n this.#setupMultipleSelect();\n this.#setupAutoCompleteKeyEvents();\n this.#setupMenuItemUpdateEvents();\n this.#setupOpenKeyEvents();\n this.#setupOverflowListener();\n this.#setupSlotStates();\n await this.#setupLightDismiss();\n this.input.setAttribute('list', '');\n this.input.autocomplete = 'off';\n }\n\n connectedCallback() {\n super.connectedCallback();\n const observer = new MutationObserver(() => this.#onSlottedChildMutation());\n observer.observe(this, {\n childList: true,\n subtree: true,\n attributes: true,\n attributeFilter: ['selected', 'disabled', 'value'],\n characterData: true\n });\n this.#observers.push(observer);\n this.#setupOptionObservers();\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.#observers.forEach(observer => observer.disconnect());\n this.#cleanupOptionObservers();\n }\n\n reset() {\n this.#dropdown!.hidePopover();\n if (this.#select) {\n this.#select.selectedIndex = -1;\n }\n super.reset();\n }\n\n /** Select all options provided */\n selectAll() {\n this.#options.forEach(o => (o.selected = true));\n this.requestUpdate();\n this.#select!.dispatchEvent(new Event('input', { bubbles: true }));\n this.#select!.dispatchEvent(new Event('change', { bubbles: true }));\n }\n\n #setupSingleSelect() {\n if (this.#select && !this.#select.multiple) {\n this.#setupInitialValue();\n this.#syncSelectValueStates();\n }\n }\n\n #setupMultipleSelect() {\n if (this.#select?.multiple) {\n this.#setupInitialValue();\n this.#syncSelectValueStates();\n this._internals.states.add('multiple');\n }\n }\n\n #setupInitialValue() {\n const selected = Array.from(this.#select!.selectedOptions).find((o: HTMLOptionElement) =>\n o.hasAttribute('selected')\n );\n if (selected && !this.#select!.multiple && !this.input.defaultValue) {\n this.input.value = getDisplayValue(selected);\n }\n }\n\n #updateInputValue() {\n if (!this.#select!.multiple && !this.input.defaultValue) {\n this.input.value = getDisplayValue(\n Array.from(this.#select!.selectedOptions).find(o => o.value === this.#select!.value)!\n );\n }\n }\n\n #syncSelectValueStates() {\n this.#observers.push(\n getElementUpdate(this.#select!, 'value', () => {\n this.#updateInputValue();\n this.requestUpdate();\n })\n );\n }\n\n #trackedOptions = new Map<HTMLOptionElement, ReturnType<typeof getPropertyChanges>>();\n\n #setupOptionObservers() {\n this.#_datalist = null;\n this.#_select = null;\n this.#syncOptionSelectedStates();\n this.requestUpdate();\n }\n\n #cleanupOptionObservers() {\n this.#trackedOptions.forEach(cleanup => cleanup?.());\n this.#trackedOptions.clear();\n }\n\n #syncOptionSelectedStates() {\n if (!this.isConnected) return;\n this.#options.forEach(o => {\n if (!this.#trackedOptions.has(o)) {\n this.#trackedOptions.set(\n o,\n getPropertyChanges(o, 'selected', () => this.requestUpdate())\n );\n }\n });\n }\n\n #onSlottedChildMutation() {\n if (!this.#syncPending) {\n this.#syncPending = true;\n queueMicrotask(() => {\n this.#syncPending = false;\n if (!this.isConnected) return;\n this.#_datalist = null;\n this.#_select = null;\n this.#cleanupStaleTrackedOptions();\n this.#syncOptionSelectedStates();\n this.requestUpdate();\n });\n }\n }\n\n #cleanupStaleTrackedOptions() {\n const currentOptions = new Set(this.#options);\n for (const [tracked, cleanup] of this.#trackedOptions) {\n if (!currentOptions.has(tracked)) {\n cleanup?.();\n this.#trackedOptions.delete(tracked);\n }\n }\n }\n\n #openDropdown() {\n this.#dropdown!.hidden = false;\n }\n\n #closeDropdown() {\n this.#dropdown!.hidden = true;\n this._internals.states.delete('dirty');\n this.#validateSingleSelectValue();\n }\n\n #setupAutoCompleteKeyEvents() {\n this.addEventListener('keydown', (e: KeyboardEvent) => {\n const value = this.input.value.trim();\n\n if (e.code === 'Tab') {\n if (this.#hasAvailableOptions && this.#dropdown!.matches(':popover-open') && value !== '') {\n e.preventDefault();\n // the menu item option property caches/stores the option value instead of value to prevent unnecessary lit lifecycle updates for each menu item\n this.#setInputValue((this.#items[0] as MenuItem & { option: string }).option);\n this.#setSelectValue(\n this.#options.find(\n o => (o.label ? o.label : o.value) === (this.#items[0] as MenuItem & { option: string }).option\n )!\n );\n }\n this.#dropdown!.hidePopover();\n }\n\n if (e.code === 'Enter' && this.behaviorCreate && !this.input.disabled && value) {\n const match = this.#findOptionMatch(value);\n if (match) {\n this.#selectValue(match);\n } else {\n e.preventDefault();\n e.stopImmediatePropagation();\n this.#dispatchCreate();\n }\n }\n });\n }\n\n #setupMenuItemUpdateEvents() {\n this.input.addEventListener('input', () => this.#filterOptions());\n this.shadowRoot!.addEventListener('slotchange', () => this.#filterOptions());\n }\n\n async #setupLightDismiss() {\n const dropdown = this.#dropdown!;\n await dropdown.updateComplete;\n const options = {\n element: dropdown.shadowRoot!.querySelector<HTMLElement>('[internal-host]')!,\n focusElement: this.input\n };\n createLightDismiss(options, () => {\n if (this.#dropdown!.matches(':popover-open')) {\n this.#dropdown!.hidePopover();\n }\n });\n }\n\n #setupOpenKeyEvents() {\n this.#tags?.addEventListener('pointerup', () => {\n if (this.tagLayout !== 'wrap') return;\n this.input.focus();\n setTimeout(() => this.#openListBox(), 0);\n });\n\n this.input.addEventListener('pointerdown', () => {\n this.#openListBox();\n });\n\n this.addEventListener('keydown', (e: KeyboardEvent) => {\n if (e.code !== 'Tab' && e.code !== 'Escape') {\n this.#openListBox();\n }\n\n if (e?.code === 'ArrowDown' && (this.getRootNode() as ShadowRoot).activeElement === this.input) {\n this.#dropdown!.tabIndex = 0;\n this.#items[0]?.focus();\n e.preventDefault();\n }\n });\n }\n\n #selectValue(option: { selected?: boolean; label?: string; value?: string }) {\n if (!this.#select?.multiple) {\n this.#setInputValue(getDisplayValue(option));\n this.#dropdown!.hidePopover();\n focusElementTimeout(this.input);\n }\n\n if (this.#select) {\n option.selected = !option.selected;\n this.#setSelectValue(option);\n }\n\n this.requestUpdate();\n }\n\n #onCreateItemClick() {\n this.#dispatchCreate();\n }\n\n #dispatchCreate() {\n const value = this.input.value.trim();\n if (value) {\n this.dispatchEvent(new CustomEvent('create', { detail: { value }, bubbles: true, composed: true }));\n this.input.value = '';\n this.#dropdown!.hidePopover();\n focusElementTimeout(this.input);\n this.requestUpdate();\n }\n }\n\n #characterAtIndexMatches(character: string, index: number) {\n if (this.#hasAvailableOptions) {\n return this.input.value.toLowerCase()[index]?.toLowerCase() === character.toLowerCase();\n }\n return false;\n }\n\n #filterOptions() {\n this.#options.forEach(option => {\n const hasLabel = option.textContent!.trim().length;\n if (hasLabel) {\n const matchesLabel = option.textContent!.toLocaleLowerCase().includes(this.input?.value.toLowerCase());\n option.hidden = !matchesLabel;\n } else {\n const matchesValue = option.value.toLocaleLowerCase().includes(this.input?.value.toLowerCase());\n option.hidden = !matchesValue;\n }\n });\n this.requestUpdate();\n }\n\n #openListBox() {\n if (!this.input.disabled && !this.#dropdown!.matches(':popover-open')) {\n if (this.#select) {\n this.#options.forEach(option => (option.hidden = false));\n this.requestUpdate();\n } else {\n this.#filterOptions();\n }\n this.#dropdown!.style.setProperty('--min-width', `${this.#input!.getBoundingClientRect().width}px`);\n // explicitly provide source as the performance optimizations in the suffixContent getter prevent the dropdown from setting its anchor/trigger reliably\n this.#dropdown!.showPopover({ source: this.#input as HTMLElement });\n this.#dropdown!.tabIndex = -1;\n }\n }\n\n #validateSingleSelectValue() {\n const invalidInputValue =\n this.#select &&\n !this.#select.multiple &&\n !this.#options.filter(o => !(o.value === '' && o.disabled)).find(o => getDisplayValue(o) === this.input.value);\n if (invalidInputValue) {\n this.#options.forEach(o => (o.selected = false));\n this.#setInputValue('');\n this.#setSelectValue({ value: '', selected: false });\n }\n }\n\n #setInputValue(value: string) {\n this.input.value = value;\n this.input.dispatchEvent(new Event('input', { bubbles: true }));\n this.input.dispatchEvent(new Event('change', { bubbles: true }));\n }\n\n #setSelectValue(option: { value?: string; selected?: boolean }) {\n const found = [...this.#options, { value: '', selected: null as boolean | null }].find(\n o => o.value === option.value\n );\n if (found) found.selected = option.selected ?? null;\n\n if (this.#select && !this.#select.multiple) {\n this.#select.value = option.value!;\n }\n\n this.#select?.dispatchEvent(new Event('input', { bubbles: true }));\n this.#select?.dispatchEvent(new Event('change', { bubbles: true }));\n }\n\n #setupOverflowListener() {\n if (this.#select?.multiple && !this.#tagLayoutIsHidden) {\n if (this.#select.selectedOptions.length > 1) {\n // only calculate initial overflow if many tags exist\n this.#updateMultipleOverflow(this.#tags!.getBoundingClientRect().width);\n }\n const observer = new ResizeObserver(entries => this.#updateMultipleOverflow(entries[0]!.contentRect.width));\n this.#observers.push(observer);\n observer.observe(this.#tags!);\n }\n }\n\n #updateMultipleOverflow(tagWidth: number) {\n const INPUT_MIN_WIDTH = 100;\n if (this.#select?.multiple && tagWidth > this.#input!.getBoundingClientRect().width - INPUT_MIN_WIDTH) {\n this._internals.states.add('multiple-overflow');\n } else {\n this._internals.states.delete('multiple-overflow');\n }\n }\n\n #setupSlotStates() {\n this.#setSlotStates();\n this.shadowRoot!.addEventListener('slotchange', () => this.#setSlotStates());\n }\n\n #setSlotStates() {\n if (this.#hasFooterContent) {\n this._internals.states.add('footer-content');\n } else {\n this._internals.states.delete('footer-content');\n }\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"combobox2.js","names":[],"sources":["../../src/combobox/combobox.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, isServer, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport type { ContainerElement } from '@nvidia-elements/core/internal';\nimport type { I18nDefaults } from '@nvidia-elements/foundations/internal/i18n';\nimport {\n createLightDismiss,\n focusElementTimeout,\n getDisplayValue,\n getElementUpdate,\n getPropertyChanges,\n scopedRegistry,\n useStyles\n} from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { inputStyles } from '@nvidia-elements/core/input';\nimport { Menu, MenuItem } from '@nvidia-elements/core/menu';\nimport { Dropdown } from '@nvidia-elements/core/dropdown';\nimport { Tag } from '@nvidia-elements/core/tag';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport { Checkbox } from '@nvidia-elements/core/checkbox';\nimport styles from './combobox.css?inline';\n\nconst comboboxI18nDefaults = {\n select: 'select',\n selected: 'selected',\n noResults: 'no results',\n create: 'create'\n} satisfies I18nDefaults;\n\n/**\n * @element nve-combobox\n * @description An editable combobox with autocomplete behavior and selection support.\n * @documentation https://nvidia.github.io/elements/docs/elements/combobox/\n * @since 0.17.0\n * @entrypoint \\@nvidia-elements/core/combobox\n * @slot - default slot for an input and a datalist/select element\n * @slot prefix-icon - slot for icon before the input\n * @slot footer - slot for dropdown footer content\n * @cssprop --scroll-height\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 --cursor\n * @cssprop --font-weight\n * @cssprop --width\n * @cssprop --border-color\n * @cssprop --max-height\n * @cssprop --text-transform\n * @csspart tag - The tag element for selected items\n * @csspart dropdown - The dropdown popup element\n * @csspart menu - The menu element\n * @csspart menu-item - The menu item elements\n * @csspart checkbox - The checkbox element\n * @csspart icon - The icon element\n * @event scroll - Fires when the user scrolls the dropdown option list. Throttled to one dispatch per animation frame. `detail: { scrollTop, scrollHeight, clientHeight }`.\n * @event create - Fires when the user confirms a value that doesn't match any existing option and the `behavior-create` attribute exists. `detail: { value }`.\n * @csspart create-option - The menu item element for creating new options\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-autocomplete-list/\n */\n@scopedRegistry()\nexport class Combobox extends Control implements ContainerElement {\n protected override get i18nDefaults(): I18nDefaults {\n return comboboxI18nDefaults;\n }\n\n /**\n * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.\n * Use when embedding within another container such as a toolbar.\n */\n @property({ type: String, reflect: true }) container: 'flat';\n\n /** Manage inline tag rendering for many-item select */\n @property({ type: String, reflect: true, attribute: 'tag-layout' }) tagLayout: 'hidden' | 'wrap';\n\n /** Enable creation of new options when the input value doesn't match any existing option. Dispatches a `create` event with `{ value }` detail. */\n @property({ type: Boolean, reflect: true, attribute: 'behavior-create' }) behaviorCreate: boolean;\n\n static styles = useStyles([...Control.styles, inputStyles, styles]);\n\n static readonly metadata = {\n tag: 'nve-combobox',\n version: '0.0.0'\n };\n\n static elementDefinitions = {\n [Checkbox.metadata.tag]: Checkbox,\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 /**\n * If a <select> exists, on focus all options show by default.\n * If a <datalist> exists, on focus only options that match the current input value show.\n */\n\n #_datalist: HTMLSelectElement | null;\n get #datalist(): HTMLSelectElement | null {\n if (!this.#_datalist) {\n this.#_datalist = this.shadowRoot\n ? ((this.shadowRoot\n .querySelector('slot')\n ?.assignedElements({ flatten: true })\n ?.find(i => i.tagName === 'DATALIST' || i.tagName === 'SELECT') ??\n this.querySelector('datalist, select')) as HTMLSelectElement)\n : null;\n }\n return this.#_datalist;\n }\n\n #_select: HTMLSelectElement | null;\n get #select(): HTMLSelectElement | null {\n if (!this.#_select) {\n this.#_select = this.shadowRoot\n ? ((this.shadowRoot\n .querySelector('slot')\n ?.assignedElements({ flatten: true })\n ?.find(i => i.tagName === 'SELECT') ?? this.querySelector('select')) as HTMLSelectElement)\n : null;\n }\n return this.#_select;\n }\n\n get #options(): HTMLOptionElement[] {\n return Array.from(this.#datalist?.options ? this.#datalist.options : []);\n }\n\n get #items() {\n return Array.from(this.shadowRoot!.querySelectorAll<MenuItem>(MenuItem.metadata.tag));\n }\n\n get #dropdown() {\n return this.shadowRoot!.querySelector<Dropdown>(Dropdown.metadata.tag);\n }\n\n get #input() {\n return this.shadowRoot!.querySelector('[input]');\n }\n\n get #tags() {\n return this.shadowRoot!.querySelector('.tags');\n }\n\n get #hasAvailableOptions() {\n return this.#options.find(o => !o.disabled && !o.hidden);\n }\n\n get #hasFooterContent() {\n return !!this.querySelector('[slot=\"footer\"]');\n }\n\n get #showCreateItem(): boolean {\n if (!this.behaviorCreate || this.input?.disabled) return false;\n const value = this.input?.value.trim();\n if (!value) return false;\n return !this.#findOptionMatch(value);\n }\n\n #findOptionMatch(value: string): HTMLOptionElement | undefined {\n const lower = value.toLowerCase();\n return this.#options.find(o => {\n const display = o.textContent!.trim() || o.value;\n return display.toLowerCase() === lower || o.value.toLowerCase() === lower;\n });\n }\n\n #observers: (MutationObserver | ResizeObserver)[] = [];\n #syncPending = false;\n\n protected _associateDatalist = false;\n\n protected get prefixContent() {\n return this.#select?.multiple && !this.#tagLayoutIsHidden\n ? html`\n <div class=\"tags-label\" aria-hidden=\"true\">${this.#select.selectedOptions.length} ${this.i18n.selected}</div>\n <div class=\"tags\">\n ${Array.from<HTMLOptionElement>(this.#select.selectedOptions).map(\n o => html`\n <nve-tag part=\"tag\" readonly color=\"gray-slate\" closable .value=${o.value} @click=${() => this.#selectValue(o)}>${getDisplayValue(o)}</nve-tag>`\n )}\n </div>`\n : html`<slot name=\"prefix-icon\"></slot>`;\n }\n\n get #tagLayoutIsHidden() {\n return this.tagLayout === 'hidden';\n }\n\n get #largeOptionsList() {\n return (this.#datalist?.options?.length ?? 0) > 50;\n }\n\n get #isPristine() {\n return !this._internals.states.has('dirty');\n }\n\n protected get suffixContent() {\n if (isServer) return nothing;\n const options = this.#options;\n const largeOptionsList = this.#largeOptionsList;\n const isPristine = this.#isPristine;\n const visibleOptions = options.filter(o => !o.hidden).filter(o => !(o.value === '' && o.disabled));\n const hasNoResults = visibleOptions.filter(o => !o.disabled).length === 0;\n const showCreateItem = this.#showCreateItem;\n return html`\n <nve-dropdown part=\"dropdown\" .popoverType=${'manual'} .modal=${false} @open=${this.#openDropdown} @close=${this.#closeDropdown} hidden .anchor=${this.#input as HTMLElement} position=\"bottom\">\n <nve-menu part=\"menu\" role=\"listbox\" style=\"--width: 100%; --min-width: fit-content\" aria-label=${ifDefined(this.i18n.select)}>\n ${visibleOptions.map(\n o => html`\n <nve-menu-item part=\"menu-item\" .option=${getDisplayValue(o)} role=\"option\" @click=${() => this.#selectValue(o)} ?selected=${o.selected} aria-selected=${o.selected ? 'true' : 'false'} ?disabled=${o.disabled} aria-label=${getDisplayValue(o)}>\n ${this.#getOptionCheckbox(o)}\n ${largeOptionsList || isPristine ? getDisplayValue(o) : html`<span role=\"presentation\">${(o.label ? o.label : o.value)?.split('')?.map((c, ci) => html`<span ?matches=${this.#characterAtIndexMatches(c, ci)}>${c}</span>`)}</span>`}\n </nve-menu-item>`\n )}\n ${hasNoResults && !showCreateItem ? html`<nve-menu-item part=\"menu-item\" .value=${''} disabled>${this.i18n.noResults}</nve-menu-item>` : nothing}\n ${\n showCreateItem\n ? html`<nve-menu-item part=\"create-option\" role=\"button\" aria-label=${`${this.i18n.create} \"${this.input?.value.trim()}\"`} @click=${this.#onCreateItemClick}>\n <nve-icon part=\"icon\" name=\"add\" size=\"sm\"></nve-icon> \"${this.input?.value.trim()}\"\n </nve-menu-item>`\n : nothing\n }\n </nve-menu>\n <slot name=\"footer\"></slot>\n </nve-dropdown>`;\n }\n\n #getOptionCheckbox(o: HTMLOptionElement) {\n const select = this.#select;\n if (select?.multiple && this.#largeOptionsList) {\n return html`<input aria-hidden=\"true\" type=\"checkbox\" .checked=${o.selected} .disabled=${o.disabled} .name=${o.selected ? 'check' : undefined} />`;\n } else if (select?.multiple) {\n /* eslint-disable @nvidia-elements/lint/no-missing-control-label */\n return html`<nve-checkbox part=\"checkbox\"><input aria-hidden=\"true\" type=\"checkbox\" .checked=${o.selected} .disabled=${o.disabled} .name=${o.selected ? 'check' : undefined} /></nve-checkbox>`;\n } else if (select) {\n return html`<nve-icon part=\"icon\" name=\"check\" size=\"sm\"></nve-icon>`;\n } else {\n return nothing;\n }\n }\n\n async firstUpdated(props: PropertyValues<this>) {\n super.firstUpdated(props);\n this.shadowRoot!.addEventListener('slotchange', () => this.#onSlottedChildMutation());\n await this.updateComplete;\n this.#setupSingleSelect();\n this.#setupMultipleSelect();\n this.#setupAutoCompleteKeyEvents();\n this.#setupMenuItemUpdateEvents();\n this.#setupOpenKeyEvents();\n this.#setupOverflowListener();\n this.#setupSlotStates();\n await this.#setupLightDismiss();\n this.input.setAttribute('list', '');\n this.input.autocomplete = 'off';\n }\n\n connectedCallback() {\n super.connectedCallback();\n const observer = new MutationObserver(() => this.#onSlottedChildMutation());\n observer.observe(this, {\n childList: true,\n subtree: true,\n attributes: true,\n attributeFilter: ['selected', 'disabled', 'value'],\n characterData: true\n });\n this.#observers.push(observer);\n this.#setupOptionObservers();\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.#observers.forEach(observer => observer.disconnect());\n this.#cleanupOptionObservers();\n }\n\n reset() {\n this.#dropdown!.hidePopover();\n if (this.#select) {\n this.#select.selectedIndex = -1;\n }\n super.reset();\n }\n\n /** Select all options provided */\n selectAll() {\n this.#options.forEach(o => (o.selected = true));\n this.requestUpdate();\n this.#select!.dispatchEvent(new Event('input', { bubbles: true }));\n this.#select!.dispatchEvent(new Event('change', { bubbles: true }));\n }\n\n #setupSingleSelect() {\n if (this.#select && !this.#select.multiple) {\n this.#setupInitialValue();\n this.#syncSelectValueStates();\n }\n }\n\n #setupMultipleSelect() {\n if (this.#select?.multiple) {\n this.#setupInitialValue();\n this.#syncSelectValueStates();\n this._internals.states.add('multiple');\n }\n }\n\n #setupInitialValue() {\n const selected = Array.from(this.#select!.selectedOptions).find((o: HTMLOptionElement) =>\n o.hasAttribute('selected')\n );\n if (selected && !this.#select!.multiple && !this.input.defaultValue) {\n this.input.value = getDisplayValue(selected);\n }\n }\n\n #updateInputValue() {\n if (!this.#select!.multiple && !this.input.defaultValue) {\n this.input.value = getDisplayValue(\n Array.from(this.#select!.selectedOptions).find(o => o.value === this.#select!.value)!\n );\n }\n }\n\n #syncSelectValueStates() {\n this.#observers.push(\n getElementUpdate(this.#select!, 'value', () => {\n this.#updateInputValue();\n this.requestUpdate();\n })\n );\n }\n\n #trackedOptions = new Map<HTMLOptionElement, ReturnType<typeof getPropertyChanges>>();\n\n #setupOptionObservers() {\n this.#_datalist = null;\n this.#_select = null;\n this.#syncOptionSelectedStates();\n this.requestUpdate();\n }\n\n #cleanupOptionObservers() {\n this.#trackedOptions.forEach(cleanup => cleanup?.());\n this.#trackedOptions.clear();\n }\n\n #syncOptionSelectedStates() {\n if (!this.isConnected) return;\n this.#options.forEach(o => {\n if (!this.#trackedOptions.has(o)) {\n this.#trackedOptions.set(\n o,\n getPropertyChanges(o, 'selected', () => this.requestUpdate())\n );\n }\n });\n }\n\n #onSlottedChildMutation() {\n if (!this.#syncPending) {\n this.#syncPending = true;\n queueMicrotask(() => {\n this.#syncPending = false;\n if (!this.isConnected) return;\n this.#_datalist = null;\n this.#_select = null;\n this.#cleanupStaleTrackedOptions();\n this.#syncOptionSelectedStates();\n this.requestUpdate();\n });\n }\n }\n\n #cleanupStaleTrackedOptions() {\n const currentOptions = new Set(this.#options);\n for (const [tracked, cleanup] of this.#trackedOptions) {\n if (!currentOptions.has(tracked)) {\n cleanup?.();\n this.#trackedOptions.delete(tracked);\n }\n }\n }\n\n #openDropdown() {\n this.#dropdown!.hidden = false;\n }\n\n #closeDropdown() {\n this.#dropdown!.hidden = true;\n this._internals.states.delete('dirty');\n this.#validateSingleSelectValue();\n }\n\n #setupAutoCompleteKeyEvents() {\n this.addEventListener('keydown', (e: KeyboardEvent) => {\n const value = this.input.value.trim();\n\n if (e.code === 'Tab') {\n if (this.#hasAvailableOptions && this.#dropdown!.matches(':popover-open') && value !== '') {\n e.preventDefault();\n // the menu item option property caches/stores the option value instead of value to prevent unnecessary lit lifecycle updates for each menu item\n this.#setInputValue((this.#items[0] as MenuItem & { option: string }).option);\n this.#setSelectValue(\n this.#options.find(\n o => (o.label ? o.label : o.value) === (this.#items[0] as MenuItem & { option: string }).option\n )!\n );\n }\n this.#dropdown!.hidePopover();\n }\n\n if (e.code === 'Enter' && this.behaviorCreate && !this.input.disabled && value) {\n const match = this.#findOptionMatch(value);\n if (match) {\n this.#selectValue(match);\n } else {\n e.preventDefault();\n e.stopImmediatePropagation();\n this.#dispatchCreate();\n }\n }\n });\n }\n\n #setupMenuItemUpdateEvents() {\n this.input.addEventListener('input', () => this.#filterOptions());\n this.shadowRoot!.addEventListener('slotchange', () => this.#filterOptions());\n }\n\n async #setupLightDismiss() {\n const dropdown = this.#dropdown!;\n await dropdown.updateComplete;\n const options = {\n element: dropdown.shadowRoot!.querySelector<HTMLElement>('[internal-host]')!,\n focusElement: this.input\n };\n createLightDismiss(options, () => {\n if (this.#dropdown!.matches(':popover-open')) {\n this.#dropdown!.hidePopover();\n }\n });\n }\n\n #setupOpenKeyEvents() {\n this.#tags?.addEventListener('pointerup', () => {\n if (this.tagLayout !== 'wrap') return;\n this.input.focus();\n setTimeout(() => this.#openListBox(), 0);\n });\n\n this.input.addEventListener('pointerdown', () => {\n this.#openListBox();\n });\n\n this.addEventListener('keydown', (e: KeyboardEvent) => {\n if (e.code !== 'Tab' && e.code !== 'Escape') {\n this.#openListBox();\n }\n\n if (e?.code === 'ArrowDown' && (this.getRootNode() as ShadowRoot).activeElement === this.input) {\n this.#dropdown!.tabIndex = 0;\n this.#items[0]?.focus();\n e.preventDefault();\n }\n });\n }\n\n #selectValue(option: { selected?: boolean; label?: string; value?: string }) {\n if (!this.#select?.multiple) {\n this.#setInputValue(getDisplayValue(option));\n this.#dropdown!.hidePopover();\n focusElementTimeout(this.input);\n }\n\n if (this.#select) {\n option.selected = !option.selected;\n this.#setSelectValue(option);\n }\n\n this.requestUpdate();\n }\n\n #onCreateItemClick() {\n this.#dispatchCreate();\n }\n\n #dispatchCreate() {\n const value = this.input.value.trim();\n if (value) {\n this.dispatchEvent(new CustomEvent('create', { detail: { value }, bubbles: true, composed: true }));\n this.input.value = '';\n this.#dropdown!.hidePopover();\n focusElementTimeout(this.input);\n this.requestUpdate();\n }\n }\n\n #characterAtIndexMatches(character: string, index: number) {\n if (this.#hasAvailableOptions) {\n return this.input.value.toLowerCase()[index]?.toLowerCase() === character.toLowerCase();\n }\n return false;\n }\n\n #filterOptions() {\n this.#options.forEach(option => {\n const hasLabel = option.textContent!.trim().length;\n if (hasLabel) {\n const matchesLabel = option.textContent!.toLocaleLowerCase().includes(this.input?.value.toLowerCase());\n option.hidden = !matchesLabel;\n } else {\n const matchesValue = option.value.toLocaleLowerCase().includes(this.input?.value.toLowerCase());\n option.hidden = !matchesValue;\n }\n });\n this.requestUpdate();\n }\n\n #openListBox() {\n if (!this.input.disabled && !this.#dropdown!.matches(':popover-open')) {\n if (this.#select) {\n this.#options.forEach(option => (option.hidden = false));\n this.requestUpdate();\n } else {\n this.#filterOptions();\n }\n this.#dropdown!.style.setProperty('--min-width', `${this.#input!.getBoundingClientRect().width}px`);\n // explicitly provide source as the performance optimizations in the suffixContent getter prevent the dropdown from setting its anchor/trigger reliably\n this.#dropdown!.showPopover({ source: this.#input as HTMLElement });\n this.#dropdown!.tabIndex = -1;\n }\n }\n\n #validateSingleSelectValue() {\n const invalidInputValue =\n this.#select &&\n !this.#select.multiple &&\n !this.#options.filter(o => !(o.value === '' && o.disabled)).find(o => getDisplayValue(o) === this.input.value);\n if (invalidInputValue) {\n this.#options.forEach(o => (o.selected = false));\n this.#setInputValue('');\n this.#setSelectValue({ value: '', selected: false });\n }\n }\n\n #setInputValue(value: string) {\n this.input.value = value;\n this.input.dispatchEvent(new Event('input', { bubbles: true }));\n this.input.dispatchEvent(new Event('change', { bubbles: true }));\n }\n\n #setSelectValue(option: { value?: string; selected?: boolean }) {\n const found = [...this.#options, { value: '', selected: null as boolean | null }].find(\n o => o.value === option.value\n );\n if (found) found.selected = option.selected ?? null;\n\n if (this.#select && !this.#select.multiple) {\n this.#select.value = option.value!;\n }\n\n this.#select?.dispatchEvent(new Event('input', { bubbles: true }));\n this.#select?.dispatchEvent(new Event('change', { bubbles: true }));\n }\n\n #setupOverflowListener() {\n if (this.#select?.multiple && !this.#tagLayoutIsHidden) {\n if (this.#select.selectedOptions.length > 1) {\n // only calculate initial overflow if many tags exist\n this.#updateMultipleOverflow(this.#tags!.getBoundingClientRect().width);\n }\n const observer = new ResizeObserver(entries => this.#updateMultipleOverflow(entries[0]!.contentRect.width));\n this.#observers.push(observer);\n observer.observe(this.#tags!);\n }\n }\n\n #updateMultipleOverflow(tagWidth: number) {\n const INPUT_MIN_WIDTH = 100;\n if (this.#select?.multiple && tagWidth > this.#input!.getBoundingClientRect().width - INPUT_MIN_WIDTH) {\n this._internals.states.add('multiple-overflow');\n } else {\n this._internals.states.delete('multiple-overflow');\n }\n }\n\n #setupSlotStates() {\n this.#setSlotStates();\n this.shadowRoot!.addEventListener('slotchange', () => this.#setSlotStates());\n }\n\n #setSlotStates() {\n if (this.#hasFooterContent) {\n this._internals.states.add('footer-content');\n } else {\n this._internals.states.delete('footer-content');\n }\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,19 +1,22 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import
|
|
4
|
-
import r from "../
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import
|
|
9
|
-
import c from "
|
|
10
|
-
import {
|
|
11
|
-
import {
|
|
1
|
+
import { scopedRegistry as e } from "../internal/decorators/scoped-registry.js";
|
|
2
|
+
import { useStyles as t } from "../internal/styles/index.js";
|
|
3
|
+
import n from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
|
|
4
|
+
import { Icon as r } from "../icon/icon2.js";
|
|
5
|
+
import { Button as i } from "../button/button2.js";
|
|
6
|
+
import { Tooltip as a } from "../tooltip/tooltip2.js";
|
|
7
|
+
import { Toast as o } from "../toast/toast2.js";
|
|
8
|
+
import s from "./copy-button.js";
|
|
9
|
+
import { html as c, nothing as l } from "lit";
|
|
10
|
+
import { property as u } from "lit/decorators/property.js";
|
|
11
|
+
import { I18nController as d } from "@nvidia-elements/foundations/internal/i18n";
|
|
12
12
|
import { state as f } from "lit/decorators/state.js";
|
|
13
13
|
//#region src/copy-button/copy-button.ts
|
|
14
|
-
var p =
|
|
15
|
-
|
|
16
|
-
|
|
14
|
+
var p = {
|
|
15
|
+
copy: "copy",
|
|
16
|
+
copied: "copied"
|
|
17
|
+
}, m = class extends i {
|
|
18
|
+
constructor(...e) {
|
|
19
|
+
super(...e), this.copied = !1, this.showToast = !1, this.showTooltip = !1, this.#e = new d(this, p), this.i18n = this.#e.i18n, this.#t = () => {
|
|
17
20
|
this.behaviorCopy && navigator.clipboard.writeText(this.value).then(() => {
|
|
18
21
|
this.showToast = !0, this.copied = !0;
|
|
19
22
|
}).catch((e) => {
|
|
@@ -27,23 +30,23 @@ var p = class extends a {
|
|
|
27
30
|
}
|
|
28
31
|
#e;
|
|
29
32
|
static {
|
|
30
|
-
this.styles =
|
|
33
|
+
this.styles = t([...i.styles, s]);
|
|
31
34
|
}
|
|
32
35
|
static {
|
|
33
36
|
this.metadata = {
|
|
34
37
|
tag: "nve-copy-button",
|
|
35
|
-
version: "2.
|
|
38
|
+
version: "2.19.1"
|
|
36
39
|
};
|
|
37
40
|
}
|
|
38
41
|
static {
|
|
39
42
|
this.elementDefinitions = {
|
|
40
|
-
[
|
|
41
|
-
[
|
|
42
|
-
[
|
|
43
|
+
[r.metadata.tag]: r,
|
|
44
|
+
[o.metadata.tag]: o,
|
|
45
|
+
[a.metadata.tag]: a
|
|
43
46
|
};
|
|
44
47
|
}
|
|
45
48
|
render() {
|
|
46
|
-
return
|
|
49
|
+
return c`<div id="btn" internal-host interaction-state focus-within><slot></slot>${this.copied ? c`<nve-icon part="icon" name="check" status="success" .size="${this.size}" aria-hidden="true"></nve-icon>` : c`<slot name="icon"><nve-icon part="icon" name="copy" .size="${this.size}" aria-hidden="true"></nve-icon></slot>`}</div>${this.showToast ? c`<nve-toast part="toast" @close="${this.#n}" status="success" anchor="btn" position="top" close-timeout="1500">${this.i18n.copied}</nve-toast>` : l} ${this.showTooltip && !this.showToast ? c`<nve-tooltip part="tooltip" exportparts="arrow:tooltip-arrow" anchor="btn">${this.ariaLabel ?? this.i18n.copy}</nve-tooltip>` : l}`;
|
|
47
50
|
}
|
|
48
51
|
connectedCallback() {
|
|
49
52
|
super.connectedCallback(), this.addEventListener("click", this.#t), this.addEventListener("mouseenter", this.#r), this.addEventListener("mouseleave", this.#i);
|
|
@@ -58,12 +61,12 @@ var p = class extends a {
|
|
|
58
61
|
#r;
|
|
59
62
|
#i;
|
|
60
63
|
};
|
|
61
|
-
|
|
64
|
+
n([f()], m.prototype, "copied", void 0), n([f()], m.prototype, "showToast", void 0), n([f()], m.prototype, "showTooltip", void 0), n([u({ type: Object })], m.prototype, "i18n", void 0), n([u({
|
|
62
65
|
type: Boolean,
|
|
63
66
|
reflect: !0,
|
|
64
67
|
attribute: "behavior-copy"
|
|
65
|
-
})],
|
|
68
|
+
})], m.prototype, "behaviorCopy", void 0), n([u({ type: String })], m.prototype, "value", void 0), m = n([e()], m);
|
|
66
69
|
//#endregion
|
|
67
|
-
export {
|
|
70
|
+
export { m as CopyButton };
|
|
68
71
|
|
|
69
72
|
//# sourceMappingURL=copy-button2.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"copy-button2.js","names":[],"sources":["../../src/copy-button/copy-button.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { state } from 'lit/decorators/state.js';\nimport { useStyles, I18nController,
|
|
1
|
+
{"version":3,"file":"copy-button2.js","names":[],"sources":["../../src/copy-button/copy-button.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { state } from 'lit/decorators/state.js';\nimport { useStyles, scopedRegistry } from '@nvidia-elements/core/internal';\nimport { I18nController, type I18nDefaults } from '@nvidia-elements/foundations/internal/i18n';\nimport { Button } from '@nvidia-elements/core/button';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport { Toast } from '@nvidia-elements/core/toast';\nimport { Tooltip } from '@nvidia-elements/core/tooltip';\nimport styles from './copy-button.css?inline';\n\nconst i18nDefaults = {\n copy: 'copy',\n copied: 'copied'\n} satisfies I18nDefaults;\n\n/**\n * @element nve-copy-button\n * @description A copy button is a button that easily enables the copy to clipboard pattern.\n * @documentation https://nvidia.github.io/elements/docs/elements/copy-button/\n * @since 1.1.4\n * @entrypoint \\@nvidia-elements/core/copy-button\n * @slot - Text label displayed before the copy icon.\n * @slot icon - slot for custom icon\n * @cssprop --color\n * @cssprop --background\n * @cssprop --border-radius\n * @cssprop --padding\n * @cssprop --height\n * @cssprop --min-width\n * @cssprop --font-size\n * @cssprop --line-height\n * @csspart icon - The icon element\n * @csspart toast - The toast notification element\n * @csspart tooltip - The tooltip element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/button/\n *\n */\n@scopedRegistry()\nexport class CopyButton extends Button {\n @state() private copied = false;\n\n @state() private showToast = false;\n\n @state() private showTooltip = false;\n\n #i18nController: I18nController<this> = new I18nController<this>(this, i18nDefaults);\n\n /**\n * Enables internal string values to update for internationalization.\n */\n @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n /**\n * Determines if the copy button should auto write to clipboard by the trigger.\n */\n @property({ type: Boolean, reflect: true, attribute: 'behavior-copy' }) behaviorCopy: boolean;\n\n /**\n * Defines the value that copies to the user clipboard. Use `aria-label` to set the tooltip hint.\n */\n @property({ type: String }) value: string;\n\n static styles = useStyles([...Button.styles, styles]);\n\n static readonly metadata = {\n tag: 'nve-copy-button',\n version: '0.0.0'\n };\n\n static elementDefinitions = {\n [Icon.metadata.tag]: Icon,\n [Toast.metadata.tag]: Toast,\n [Tooltip.metadata.tag]: Tooltip\n };\n\n render() {\n return html`\n <div id=\"btn\" internal-host interaction-state focus-within>\n <slot></slot>\n ${\n this.copied\n ? html`<nve-icon part=\"icon\" name=\"check\" status=\"success\" .size=${this.size} aria-hidden=\"true\"></nve-icon>`\n : html`<slot name=\"icon\"><nve-icon part=\"icon\" name=\"copy\" .size=${this.size} aria-hidden=\"true\"></nve-icon></slot>`\n }\n </div>\n ${this.showToast ? html`<nve-toast part=\"toast\" @close=${this.#close} status=\"success\" anchor=\"btn\" position=\"top\" close-timeout=\"1500\">${this.i18n.copied}</nve-toast>` : nothing}\n ${this.showTooltip && !this.showToast ? html`<nve-tooltip part=\"tooltip\" exportparts=\"arrow:tooltip-arrow\" anchor=\"btn\">${this.ariaLabel ?? this.i18n.copy}</nve-tooltip>` : nothing}\n `;\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.addEventListener('click', this.#copy);\n this.addEventListener('mouseenter', this.#openTooltip);\n this.addEventListener('mouseleave', this.#closeTooltip);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('click', this.#copy);\n this.removeEventListener('mouseenter', this.#openTooltip);\n this.removeEventListener('mouseleave', this.#closeTooltip);\n }\n\n #copy = () => {\n if (this.behaviorCopy) {\n navigator.clipboard\n .writeText(this.value)\n .then(() => {\n this.showToast = true;\n this.copied = true;\n })\n .catch(err => {\n this.showToast = false;\n console.error(err);\n });\n }\n };\n\n #close() {\n this.showToast = false;\n this.copied = false;\n this.showTooltip = false;\n }\n\n #openTooltip = () => {\n this.showTooltip = true;\n };\n\n #closeTooltip = () => {\n this.showTooltip = false;\n };\n}\n"],"mappings":";;;;;;;;;;;;;AAcA,IAAM,IAAe;CACnB,MAAM;CACN,QAAQ;AACV,GAyBa,IAAN,cAAyB,EAAO;;EA2Ff,aA1FI,KAAA,SAAA,IAEG,KAAA,YAAA,IAEE,KAAA,cAAA,IAES,KAAA,KAAA,IAAI,EAAqB,MAAM,CAAY,GAKhD,KAAA,OAAA,KAAK,GAAgB,MAsD1C,KAAA,WAAA;GACZ,AAAI,KAAK,gBACP,UAAU,UACP,UAAU,KAAK,KAAK,CAAC,CACrB,WAAW;IAEV,AADA,KAAK,YAAY,IACjB,KAAK,SAAS;GAChB,CAAC,CAAC,CACD,OAAM,MAAO;IAEZ,AADA,KAAK,YAAY,IACjB,QAAQ,MAAM,CAAG;GACnB,CAAC;EAEP,GAQqB,KAAA,WAAA;GACnB,KAAK,cAAc;EACrB,GAEsB,KAAA,WAAA;GACpB,KAAK,cAAc;EACrB;;CAtFA;;EAiBgB,KAAA,SAAA,EAAU,CAAC,GAAG,EAAO,QAAQ,CAAM,CAAC;;;EAEzB,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;;EAE4B,KAAA,qBAAA;IACzB,EAAK,SAAS,MAAM;IACpB,EAAM,SAAS,MAAM;IACrB,EAAQ,SAAS,MAAM;EAC1B;;CAEA,SAAS;EACP,OAAO,CAAI,2EAIL,KAAK,SACD,CAAI,8DAA6D,KAAK,KAAK,oCAC3E,CAAI,8DAA6D,KAAK,KAAK,yCAChF,QAEF,KAAK,YAAY,CAAI,mCAAkC,KAAK,GAAO,sEAAqE,KAAK,KAAK,OAAO,gBAAgB,EAAQ,GACjL,KAAK,eAAe,CAAC,KAAK,YAAY,CAAI,8EAA8E,KAAK,aAAa,KAAK,KAAK,KAAK,kBAAkB;CAEhL;CAEA,oBAAoB;EAIlB,AAHA,MAAM,kBAAkB,GACxB,KAAK,iBAAiB,SAAS,KAAK,EAAK,GACzC,KAAK,iBAAiB,cAAc,KAAK,EAAY,GACrD,KAAK,iBAAiB,cAAc,KAAK,EAAa;CACxD;CAEA,uBAAuB;EAIrB,AAHA,MAAM,qBAAqB,GAC3B,KAAK,oBAAoB,SAAS,KAAK,EAAK,GAC5C,KAAK,oBAAoB,cAAc,KAAK,EAAY,GACxD,KAAK,oBAAoB,cAAc,KAAK,EAAa;CAC3D;CAEA;CAeA,KAAS;EAGP,AAFA,KAAK,YAAY,IACjB,KAAK,SAAS,IACd,KAAK,cAAc;CACrB;CAEA;CAIA;AAGF;AA7FG,EAAA,CAAA,EAAM,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA,GAEN,EAAA,CAAA,EAAM,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,GAEN,EAAA,CAAA,EAAM,CAAA,GAAA,EAAA,WAAA,eAAA,KAAA,CAAA,GAON,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GAKzB,EAAA,CAAA,EAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;AAAgB,CAAC,CAAA,GAAA,EAAA,WAAA,gBAAA,KAAA,CAAA,GAKrE,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,SAAA,KAAA,CAAA,GAvB3B,IAAA,EAAA,CAAA,EAAe,CAAA,GAAA,CAAA"}
|
|
@@ -322,8 +322,6 @@ export type BadgeProps = {
|
|
|
322
322
|
container?: "flat" | undefined;
|
|
323
323
|
/** Determines the visual prominence or weight */
|
|
324
324
|
prominence?: "emphasis" | undefined;
|
|
325
|
-
/** Enables updating internal string values for internationalization. */
|
|
326
|
-
i18n?: string;
|
|
327
325
|
};
|
|
328
326
|
|
|
329
327
|
export type BreadcrumbProps = {};
|
|
@@ -2722,8 +2720,6 @@ export type PagePanelProps = {
|
|
|
2722
2720
|
|
|
2723
2721
|
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
2724
2722
|
size?: "sm" | "md" | "lg" | undefined;
|
|
2725
|
-
/** Enables updating internal string values for internationalization. */
|
|
2726
|
-
i18n?: string;
|
|
2727
2723
|
/** Dispatched after an invoker command removes `hidden` and opens the panel. */
|
|
2728
2724
|
onopen?: (e: CustomEvent<never>) => void;
|
|
2729
2725
|
/** Dispatched after an invoker command sets `hidden` and closes the panel. */
|
|
@@ -4080,6 +4076,12 @@ Determines if popover visibility behavior should be automatically controlled by
|
|
|
4080
4076
|
};
|
|
4081
4077
|
|
|
4082
4078
|
export type TreeNodeProps = {
|
|
4079
|
+
/** Command to invoke on a node title click or Enter on its header. */
|
|
4080
|
+
command?: string;
|
|
4081
|
+
/** ID of the element that receives the command. */
|
|
4082
|
+
commandfor?: string | null;
|
|
4083
|
+
/** Direct command target, taking precedence over commandfor. */
|
|
4084
|
+
commandForElement?: HTMLElement | null;
|
|
4083
4085
|
/** Indicates whether collapsible content is currently visible or hidden from the user. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)
|
|
4084
4086
|
- `true` The associated content expands and becomes visible to the user.
|
|
4085
4087
|
|
|
@@ -243,8 +243,6 @@ type BadgeProps = {
|
|
|
243
243
|
container?: "flat" | undefined;
|
|
244
244
|
/** Determines the visual prominence or weight */
|
|
245
245
|
prominence?: "emphasis" | undefined;
|
|
246
|
-
/** Enables updating internal string values for internationalization. */
|
|
247
|
-
i18n?: string;
|
|
248
246
|
};
|
|
249
247
|
|
|
250
248
|
type BreadcrumbProps = {};
|
|
@@ -2572,8 +2570,6 @@ type PagePanelProps = {
|
|
|
2572
2570
|
|
|
2573
2571
|
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
2574
2572
|
size?: "sm" | "md" | "lg" | undefined;
|
|
2575
|
-
/** Enables updating internal string values for internationalization. */
|
|
2576
|
-
i18n?: string;
|
|
2577
2573
|
/** Dispatched after an invoker command removes `hidden` and opens the panel. */
|
|
2578
2574
|
onopen?: (e: CustomEvent<never>) => void;
|
|
2579
2575
|
/** Dispatched after an invoker command sets `hidden` and closes the panel. */
|
|
@@ -3841,6 +3837,12 @@ Determines if popover visibility behavior should be automatically controlled by
|
|
|
3841
3837
|
};
|
|
3842
3838
|
|
|
3843
3839
|
type TreeNodeProps = {
|
|
3840
|
+
/** Command to invoke on a node title click or Enter on its header. */
|
|
3841
|
+
command?: string;
|
|
3842
|
+
/** ID of the element that receives the command. */
|
|
3843
|
+
commandfor?: string | null;
|
|
3844
|
+
/** Direct command target, taking precedence over commandfor. */
|
|
3845
|
+
commandForElement?: HTMLElement | null;
|
|
3844
3846
|
/** Indicates whether collapsible content is currently visible or hidden from the user. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)
|
|
3845
3847
|
- `true` The associated content expands and becomes visible to the user.
|
|
3846
3848
|
|