@nvidia-elements/core 2.22.0 → 2.22.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 +6 -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.d.ts +1 -0
- 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/checkbox.js +1 -1
- package/dist/checkbox/checkbox.js.map +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/custom-elements-jsx.d.ts +1 -0
- package/dist/custom-elements-vue.d.ts +1 -0
- package/dist/custom-elements.json +5 -1
- package/dist/data.html.json +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/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 +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-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/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/iframe/iframe2.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/joystick/joystick2.js +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/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-dot/progress-dot2.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/select2.js +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/tabs-item-group2.js +1 -1
- package/dist/tabs/tabs.d.ts +1 -0
- package/dist/tabs/tabs.global.js +1 -1
- package/dist/tabs/tabs.global.js.map +1 -1
- package/dist/tabs/tabs2.js +2 -2
- package/dist/tabs/tabs2.js.map +1 -1
- 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/logo/logo2.js
CHANGED
package/dist/menu/menu-group2.js
CHANGED
package/dist/menu/menu-item2.js
CHANGED
package/dist/menu/menu2.js
CHANGED
package/dist/month/month2.js
CHANGED
package/dist/page/page2.js
CHANGED
package/dist/panel/panel2.js
CHANGED
|
@@ -26,7 +26,7 @@ var g = {
|
|
|
26
26
|
static {
|
|
27
27
|
this.metadata = {
|
|
28
28
|
tag: "nve-panel-header",
|
|
29
|
-
version: "2.22.
|
|
29
|
+
version: "2.22.1"
|
|
30
30
|
};
|
|
31
31
|
}
|
|
32
32
|
render() {
|
|
@@ -42,7 +42,7 @@ var g = {
|
|
|
42
42
|
static {
|
|
43
43
|
this.metadata = {
|
|
44
44
|
tag: "nve-panel-content",
|
|
45
|
-
version: "2.22.
|
|
45
|
+
version: "2.22.1"
|
|
46
46
|
};
|
|
47
47
|
}
|
|
48
48
|
render() {
|
|
@@ -55,7 +55,7 @@ var g = {
|
|
|
55
55
|
static {
|
|
56
56
|
this.metadata = {
|
|
57
57
|
tag: "nve-panel-footer",
|
|
58
|
-
version: "2.22.
|
|
58
|
+
version: "2.22.1"
|
|
59
59
|
};
|
|
60
60
|
}
|
|
61
61
|
render() {
|
|
@@ -74,7 +74,7 @@ var g = {
|
|
|
74
74
|
static {
|
|
75
75
|
this.metadata = {
|
|
76
76
|
tag: "nve-panel",
|
|
77
|
-
version: "2.22.
|
|
77
|
+
version: "2.22.1"
|
|
78
78
|
};
|
|
79
79
|
}
|
|
80
80
|
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/select2.js
CHANGED
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.22.
|
|
26
|
+
version: "2.22.1",
|
|
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.22.
|
|
72
|
+
version: "2.22.1",
|
|
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/tabs.d.ts
CHANGED
|
@@ -49,6 +49,7 @@ export declare class TabsItem extends TabsItem_base {
|
|
|
49
49
|
* @entrypoint \@nvidia-elements/core/tabs
|
|
50
50
|
* @slot - default slot for tab-item
|
|
51
51
|
* @cssprop --gap
|
|
52
|
+
* @cssprop --indicator-animation-duration - Duration of selection indicator movement.
|
|
52
53
|
* @cssprop --indicator-background
|
|
53
54
|
* @cssprop --indicator-border-radius
|
|
54
55
|
* @cssprop --indicator-height
|
package/dist/tabs/tabs.global.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
// src/tabs/tabs.global.css?inline
|
|
2
|
-
var e = "nve-tabs{anchor-scope:--selected,--selected-group;--indicator-background: var(--nve-sys-accent-secondary-background);--indicator-height: var(--nve-ref-border-width-xl);--indicator-border-radius: var(--nve-ref-border-radius-sm);&:after{background:var(--indicator-background);height:var(--indicator-height);border-radius:var(--indicator-border-radius);position:fixed;display:block;content:\"\";width:anchor-size(width);transition:left var(--
|
|
2
|
+
var e = "nve-tabs{anchor-scope:--selected,--selected-group;--indicator-animation-duration: var(--nve-ref-animation-duration-150);--indicator-background: var(--nve-sys-accent-secondary-background);--indicator-height: var(--nve-ref-border-width-xl);--indicator-border-radius: var(--nve-ref-border-radius-sm);&:after{background:var(--indicator-background);height:var(--indicator-height);border-radius:var(--indicator-border-radius);position:fixed;display:block;content:\"\";width:anchor-size(width);transition:left var(--indicator-animation-duration) var(--nve-ref-animation-easing-100);position-anchor:--selected;top:calc(anchor(bottom) - var(--indicator-height));left:anchor(left);z-index:-1}&[borderless]:after{display:none!important}}nve-tabs[vertical]{&:after{width:var(--indicator-height);height:anchor-size(height);transition:top var(--indicator-animation-duration) var(--nve-ref-animation-easing-100);top:anchor(top)}}nve-tabs[vertical]:dir(rtl):after{left:auto;right:anchor(right)}nve-tabs-item[selected]{anchor-name:--selected}nve-tabs-item-group:has(>nve-tabs-item[selected]){anchor-name:--selected-group}nve-tabs:has(>nve-tabs-item-group>nve-tabs-item[selected]):after{position-anchor:--selected-group}";
|
|
3
3
|
export { e as default };
|
|
4
4
|
|
|
5
5
|
//# sourceMappingURL=tabs.global.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.global.js","names":["tabs_global_default"],"sources":["../../src/tabs/tabs.global.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\nnve-tabs {\n anchor-scope: --selected, --selected-group;\n --indicator-background: var(--nve-sys-accent-secondary-background);\n --indicator-height: var(--nve-ref-border-width-xl);\n --indicator-border-radius: var(--nve-ref-border-radius-sm);\n\n &::after {\n background: var(--indicator-background);\n height: var(--indicator-height);\n border-radius: var(--indicator-border-radius);\n position: fixed;\n display: block;\n content: '';\n width: anchor-size(width);\n transition: left var(--
|
|
1
|
+
{"version":3,"file":"tabs.global.js","names":["tabs_global_default"],"sources":["../../src/tabs/tabs.global.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\nnve-tabs {\n anchor-scope: --selected, --selected-group;\n --indicator-animation-duration: var(--nve-ref-animation-duration-150);\n --indicator-background: var(--nve-sys-accent-secondary-background);\n --indicator-height: var(--nve-ref-border-width-xl);\n --indicator-border-radius: var(--nve-ref-border-radius-sm);\n\n &::after {\n background: var(--indicator-background);\n height: var(--indicator-height);\n border-radius: var(--indicator-border-radius);\n position: fixed;\n display: block;\n content: '';\n width: anchor-size(width);\n transition: left var(--indicator-animation-duration) var(--nve-ref-animation-easing-100);\n position-anchor: --selected;\n top: calc(anchor(bottom) - var(--indicator-height));\n left: anchor(left);\n z-index: -1;\n }\n\n &[borderless]::after {\n display: none !important;\n }\n}\n\nnve-tabs[vertical] {\n &::after {\n width: var(--indicator-height);\n height: anchor-size(height);\n transition: top var(--indicator-animation-duration) var(--nve-ref-animation-easing-100);\n top: anchor(top);\n }\n}\n\nnve-tabs[vertical]:dir(rtl)::after {\n left: auto;\n right: anchor(right);\n}\n\nnve-tabs-item[selected] {\n anchor-name: --selected;\n}\n\nnve-tabs-item-group:has(> nve-tabs-item[selected]) {\n anchor-name: --selected-group;\n}\n\nnve-tabs:has(> nve-tabs-item-group > nve-tabs-item[selected])::after {\n position-anchor: --selected-group;\n}\n"],"mappings":""}
|
package/dist/tabs/tabs2.js
CHANGED
|
@@ -21,7 +21,7 @@ var y = class extends _(m) {
|
|
|
21
21
|
static {
|
|
22
22
|
this.metadata = {
|
|
23
23
|
tag: "nve-tabs-item",
|
|
24
|
-
version: "2.22.
|
|
24
|
+
version: "2.22.1",
|
|
25
25
|
parents: ["nve-tabs", "nve-tabs-item-group"]
|
|
26
26
|
};
|
|
27
27
|
}
|
|
@@ -65,7 +65,7 @@ var b = class extends m {
|
|
|
65
65
|
static {
|
|
66
66
|
this.metadata = {
|
|
67
67
|
tag: "nve-tabs",
|
|
68
|
-
version: "2.22.
|
|
68
|
+
version: "2.22.1",
|
|
69
69
|
children: ["nve-tabs-item", "nve-tabs-item-group"]
|
|
70
70
|
};
|
|
71
71
|
}
|
package/dist/tabs/tabs2.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs2.js","names":["tabsItemStyleSheet","_decorate","tabsStyleSheet","globalStyles","__decorate","tabs_global_default","tabs_item_default","tabs_default","TabsItem","ButtonFormControlMixin","LitElement","useStyles","props","appendAnchorName","removeAnchorName","property","audit","stateSelected","Tabs","_args","#keynavController","KeyNavigationListController","#knownItems","#syncFromItems","records","record","#syncItems","#items","item","#syncAccessoryTabState","items","index","previousItems","#onClick","path","event","candidate","#selectTab","getTabItems","appendRootNodeStyle","attachInternals","#observeItems","#itemsObserver","group","isTabItemTabbable","tabItem","queryAssignedElements"],"sources":["../../src/tabs/tabs.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { PropertyValues } from 'lit';\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport { ButtonFormControlMixin } from '@nvidia-elements/forms/mixins';\nimport type { KeynavListConfig } from '@nvidia-elements/core/internal';\nimport {\n stateSelected,\n useStyles,\n KeyNavigationListController,\n attachInternals,\n audit,\n appendRootNodeStyle,\n appendAnchorName,\n removeAnchorName\n} from '@nvidia-elements/core/internal';\nimport type { TabsItemGroup } from './tabs-item-group.js';\nimport { getTabItems, isTabItemTabbable } from './utils.js';\nimport globalStyles from './tabs.global.css?inline';\nimport tabsItemStyleSheet from './tabs-item.css?inline';\nimport tabsStyleSheet from './tabs.css?inline';\n\n/**\n * @element nve-tabs-item\n * @description Represents an individual tab within a tablist, providing a selectable button for switching between content views.\n * @documentation https://nvidia.github.io/elements/docs/elements/tabs/\n * @since 0.10.0\n * @entrypoint \\@nvidia-elements/core/tabs\n * @slot - The label displayed for the tab.\n * @slot prefix - Decoration before the label.\n * @slot suffix - Supporting content after the label.\n * @cssprop --gap - Spacing between the label and decoration.\n * @cssprop --font-size\n * @cssprop --width\n * @cssprop --padding\n * @cssprop --font-size\n * @cssprop --font-weight\n * @cssprop --border-radius\n * @cssprop --color\n * @cssprop --height\n * @cssprop --cursor\n * @cssprop --text-transform\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n * @responsive false\n */\n@audit()\n@stateSelected<TabsItem>()\nexport class TabsItem extends ButtonFormControlMixin(LitElement) {\n /**\n * Determines which tab item the user selects, defaults to false.\n */\n @property({ type: Boolean, reflect: true }) selected = false;\n\n static styles = useStyles([tabsItemStyleSheet]);\n\n static readonly metadata = {\n tag: 'nve-tabs-item',\n version: '0.0.0',\n parents: ['nve-tabs', 'nve-tabs-item-group']\n };\n\n render() {\n return html`\n <div internal-host focus-within>\n <slot name=\"prefix\"></slot>\n <div id=\"label\"><slot></slot></div>\n <slot name=\"suffix\"></slot>\n </div>\n `;\n }\n\n constructor() {\n super();\n this.type = 'button';\n }\n\n connectedCallback() {\n super.connectedCallback();\n this._internals.role = 'tab';\n }\n\n updated(props: PropertyValues<this>) {\n super.updated(props);\n\n if (props.has('selected')) {\n if (this.selected) {\n appendAnchorName(this, '--selected');\n } else {\n removeAnchorName(this, '--selected');\n }\n }\n }\n}\n\n/**\n * @element nve-tabs\n * @description Tabs provide a selection UX, typically used for swapping content shown on a page, or within a navigation context.\n * @documentation https://nvidia.github.io/elements/docs/elements/tabs/\n * @since 0.10.0\n * @entrypoint \\@nvidia-elements/core/tabs\n * @slot - default slot for tab-item\n * @cssprop --gap\n * @cssprop --indicator-background\n * @cssprop --indicator-border-radius\n * @cssprop --indicator-height\n * @cssprop --border-inset\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n * @responsive false\n */\n@audit()\nexport class Tabs extends LitElement {\n /**\n * Determines whether the tabs should display in a vertical layout vs. defaulting to horizontal.\n */\n @property({ type: Boolean, reflect: true }) vertical = false;\n\n /**\n * Determines whether the tabs should display a border on selected items vs. defaults to show border.\n */\n @property({ type: Boolean, reflect: true }) borderless = false;\n\n /**\n * Determines whether the tabs should handle selection behavior vs. defaults to off.\n */\n @property({ type: Boolean, attribute: 'behavior-select' }) behaviorSelect = false;\n\n static styles = useStyles([tabsStyleSheet]);\n\n static readonly metadata = {\n tag: 'nve-tabs',\n version: '0.0.0',\n children: ['nve-tabs-item', 'nve-tabs-item-group']\n };\n\n /** @private */\n get keynavListConfig(): KeynavListConfig {\n const items = this.#items;\n return {\n items,\n initialItem: items.find(item => item.selected),\n layout: this.vertical ? 'vertical' : 'horizontal',\n dir: getComputedStyle(this).direction\n };\n }\n\n @queryAssignedElements() private entries!: HTMLElement[];\n\n get #items(): TabsItem[] {\n return getTabItems(this.entries ?? []);\n }\n\n #keynavController = new KeyNavigationListController(this);\n #knownItems: TabsItem[] = [];\n #itemsObserver?: MutationObserver;\n\n /** @private */\n declare _internals: ElementInternals;\n\n render() {\n return html`\n <div internal-host>\n <slot @slotchange=${this.#syncItems}></slot>\n </div>\n `;\n }\n\n connectedCallback() {\n super.connectedCallback();\n appendRootNodeStyle(this, globalStyles);\n attachInternals(this);\n this._internals.role = 'tablist';\n this.addEventListener('click', this.#onClick);\n this.#observeItems();\n if (this.hasUpdated) this.#syncAccessoryTabState();\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('click', this.#onClick);\n this.#itemsObserver?.disconnect();\n }\n\n firstUpdated() {\n this.#itemsObserver = new MutationObserver(this.#syncFromItems);\n this.#observeItems();\n }\n\n updated(props: PropertyValues<this>) {\n super.updated(props);\n this._internals.ariaOrientation = this.vertical ? 'vertical' : 'horizontal';\n }\n\n #observeItems() {\n this.#itemsObserver?.observe(this, {\n childList: true,\n subtree: true,\n attributes: true,\n attributeFilter: ['tabindex', 'href', 'slot']\n });\n }\n\n #syncFromItems = (records: MutationRecord[]) => {\n if (records.some(record => record.type === 'childList' || record.attributeName === 'slot')) {\n void this.#syncItems();\n } else if (records.some(record => this.#items.some(item => item.contains(record.target)))) {\n this.#syncAccessoryTabState();\n }\n };\n\n #syncItems = async () => {\n const items = this.#items;\n if (items.length === this.#knownItems.length && items.every((item, index) => item === this.#knownItems[index])) {\n this.#syncAccessoryTabState();\n return;\n }\n\n const previousItems = this.#knownItems;\n this.#knownItems = items;\n await Promise.all(items.map(item => item.updateComplete));\n if (items !== this.#knownItems) return;\n\n this.#keynavController.refreshItems(previousItems);\n this.#syncAccessoryTabState();\n };\n\n #syncAccessoryTabState() {\n this.querySelectorAll<TabsItemGroup>(':scope > nve-tabs-item-group').forEach(group => {\n const item = getTabItems([group])[0];\n group.accessoryTabEnabled = !!item && isTabItemTabbable(item);\n });\n }\n\n #selectTab(tabItem: HTMLElement & { matches: Element['matches']; disabled?: boolean; selected?: boolean }) {\n if (!this.behaviorSelect || !tabItem.matches('nve-tabs-item') || tabItem.disabled) {\n return;\n }\n\n this.keynavListConfig.items.forEach((i: HTMLElement) => ((i as TabsItem).selected = false));\n tabItem.selected = true;\n }\n\n #onClick = (event: Event) => {\n const path = event.composedPath();\n const item = this.#items.find(candidate => path.includes(candidate));\n if (item) this.#selectTab(item);\n };\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tabs2.js","names":["tabsItemStyleSheet","_decorate","tabsStyleSheet","globalStyles","__decorate","tabs_global_default","tabs_item_default","tabs_default","TabsItem","ButtonFormControlMixin","LitElement","useStyles","props","appendAnchorName","removeAnchorName","property","audit","stateSelected","Tabs","_args","#keynavController","KeyNavigationListController","#knownItems","#syncFromItems","records","record","#syncItems","#items","item","#syncAccessoryTabState","items","index","previousItems","#onClick","path","event","candidate","#selectTab","getTabItems","appendRootNodeStyle","attachInternals","#observeItems","#itemsObserver","group","isTabItemTabbable","tabItem","queryAssignedElements"],"sources":["../../src/tabs/tabs.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { PropertyValues } from 'lit';\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport { ButtonFormControlMixin } from '@nvidia-elements/forms/mixins';\nimport type { KeynavListConfig } from '@nvidia-elements/core/internal';\nimport {\n stateSelected,\n useStyles,\n KeyNavigationListController,\n attachInternals,\n audit,\n appendRootNodeStyle,\n appendAnchorName,\n removeAnchorName\n} from '@nvidia-elements/core/internal';\nimport type { TabsItemGroup } from './tabs-item-group.js';\nimport { getTabItems, isTabItemTabbable } from './utils.js';\nimport globalStyles from './tabs.global.css?inline';\nimport tabsItemStyleSheet from './tabs-item.css?inline';\nimport tabsStyleSheet from './tabs.css?inline';\n\n/**\n * @element nve-tabs-item\n * @description Represents an individual tab within a tablist, providing a selectable button for switching between content views.\n * @documentation https://nvidia.github.io/elements/docs/elements/tabs/\n * @since 0.10.0\n * @entrypoint \\@nvidia-elements/core/tabs\n * @slot - The label displayed for the tab.\n * @slot prefix - Decoration before the label.\n * @slot suffix - Supporting content after the label.\n * @cssprop --gap - Spacing between the label and decoration.\n * @cssprop --font-size\n * @cssprop --width\n * @cssprop --padding\n * @cssprop --font-size\n * @cssprop --font-weight\n * @cssprop --border-radius\n * @cssprop --color\n * @cssprop --height\n * @cssprop --cursor\n * @cssprop --text-transform\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n * @responsive false\n */\n@audit()\n@stateSelected<TabsItem>()\nexport class TabsItem extends ButtonFormControlMixin(LitElement) {\n /**\n * Determines which tab item the user selects, defaults to false.\n */\n @property({ type: Boolean, reflect: true }) selected = false;\n\n static styles = useStyles([tabsItemStyleSheet]);\n\n static readonly metadata = {\n tag: 'nve-tabs-item',\n version: '0.0.0',\n parents: ['nve-tabs', 'nve-tabs-item-group']\n };\n\n render() {\n return html`\n <div internal-host focus-within>\n <slot name=\"prefix\"></slot>\n <div id=\"label\"><slot></slot></div>\n <slot name=\"suffix\"></slot>\n </div>\n `;\n }\n\n constructor() {\n super();\n this.type = 'button';\n }\n\n connectedCallback() {\n super.connectedCallback();\n this._internals.role = 'tab';\n }\n\n updated(props: PropertyValues<this>) {\n super.updated(props);\n\n if (props.has('selected')) {\n if (this.selected) {\n appendAnchorName(this, '--selected');\n } else {\n removeAnchorName(this, '--selected');\n }\n }\n }\n}\n\n/**\n * @element nve-tabs\n * @description Tabs provide a selection UX, typically used for swapping content shown on a page, or within a navigation context.\n * @documentation https://nvidia.github.io/elements/docs/elements/tabs/\n * @since 0.10.0\n * @entrypoint \\@nvidia-elements/core/tabs\n * @slot - default slot for tab-item\n * @cssprop --gap\n * @cssprop --indicator-animation-duration - Duration of selection indicator movement.\n * @cssprop --indicator-background\n * @cssprop --indicator-border-radius\n * @cssprop --indicator-height\n * @cssprop --border-inset\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n * @responsive false\n */\n@audit()\nexport class Tabs extends LitElement {\n /**\n * Determines whether the tabs should display in a vertical layout vs. defaulting to horizontal.\n */\n @property({ type: Boolean, reflect: true }) vertical = false;\n\n /**\n * Determines whether the tabs should display a border on selected items vs. defaults to show border.\n */\n @property({ type: Boolean, reflect: true }) borderless = false;\n\n /**\n * Determines whether the tabs should handle selection behavior vs. defaults to off.\n */\n @property({ type: Boolean, attribute: 'behavior-select' }) behaviorSelect = false;\n\n static styles = useStyles([tabsStyleSheet]);\n\n static readonly metadata = {\n tag: 'nve-tabs',\n version: '0.0.0',\n children: ['nve-tabs-item', 'nve-tabs-item-group']\n };\n\n /** @private */\n get keynavListConfig(): KeynavListConfig {\n const items = this.#items;\n return {\n items,\n initialItem: items.find(item => item.selected),\n layout: this.vertical ? 'vertical' : 'horizontal',\n dir: getComputedStyle(this).direction\n };\n }\n\n @queryAssignedElements() private entries!: HTMLElement[];\n\n get #items(): TabsItem[] {\n return getTabItems(this.entries ?? []);\n }\n\n #keynavController = new KeyNavigationListController(this);\n #knownItems: TabsItem[] = [];\n #itemsObserver?: MutationObserver;\n\n /** @private */\n declare _internals: ElementInternals;\n\n render() {\n return html`\n <div internal-host>\n <slot @slotchange=${this.#syncItems}></slot>\n </div>\n `;\n }\n\n connectedCallback() {\n super.connectedCallback();\n appendRootNodeStyle(this, globalStyles);\n attachInternals(this);\n this._internals.role = 'tablist';\n this.addEventListener('click', this.#onClick);\n this.#observeItems();\n if (this.hasUpdated) this.#syncAccessoryTabState();\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('click', this.#onClick);\n this.#itemsObserver?.disconnect();\n }\n\n firstUpdated() {\n this.#itemsObserver = new MutationObserver(this.#syncFromItems);\n this.#observeItems();\n }\n\n updated(props: PropertyValues<this>) {\n super.updated(props);\n this._internals.ariaOrientation = this.vertical ? 'vertical' : 'horizontal';\n }\n\n #observeItems() {\n this.#itemsObserver?.observe(this, {\n childList: true,\n subtree: true,\n attributes: true,\n attributeFilter: ['tabindex', 'href', 'slot']\n });\n }\n\n #syncFromItems = (records: MutationRecord[]) => {\n if (records.some(record => record.type === 'childList' || record.attributeName === 'slot')) {\n void this.#syncItems();\n } else if (records.some(record => this.#items.some(item => item.contains(record.target)))) {\n this.#syncAccessoryTabState();\n }\n };\n\n #syncItems = async () => {\n const items = this.#items;\n if (items.length === this.#knownItems.length && items.every((item, index) => item === this.#knownItems[index])) {\n this.#syncAccessoryTabState();\n return;\n }\n\n const previousItems = this.#knownItems;\n this.#knownItems = items;\n await Promise.all(items.map(item => item.updateComplete));\n if (items !== this.#knownItems) return;\n\n this.#keynavController.refreshItems(previousItems);\n this.#syncAccessoryTabState();\n };\n\n #syncAccessoryTabState() {\n this.querySelectorAll<TabsItemGroup>(':scope > nve-tabs-item-group').forEach(group => {\n const item = getTabItems([group])[0];\n group.accessoryTabEnabled = !!item && isTabItemTabbable(item);\n });\n }\n\n #selectTab(tabItem: HTMLElement & { matches: Element['matches']; disabled?: boolean; selected?: boolean }) {\n if (!this.behaviorSelect || !tabItem.matches('nve-tabs-item') || tabItem.disabled) {\n return;\n }\n\n this.keynavListConfig.items.forEach((i: HTMLElement) => ((i as TabsItem).selected = false));\n tabItem.selected = true;\n }\n\n #onClick = (event: Event) => {\n const path = event.composedPath();\n const item = this.#items.find(candidate => path.includes(candidate));\n if (item) this.#selectTab(item);\n };\n}\n"],"mappings":"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"}
|
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