@nvidia-elements/core 2.0.4 → 2.1.0
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 +13 -0
- package/dist/_virtual/{_@oxc-project_runtime@0.133.0 → _@oxc-project_runtime@0.139.0}/helpers/esm/decorate.js +2 -2
- package/dist/accordion/accordion.d.ts +13 -12
- package/dist/accordion/accordion2.js +5 -5
- package/dist/accordion/accordion2.js.map +1 -1
- package/dist/accordion/define.d.ts +1 -1
- package/dist/alert/alert-group.d.ts +5 -4
- package/dist/alert/alert-group2.js +2 -2
- package/dist/alert/alert.d.ts +6 -6
- package/dist/alert/alert2.js +2 -2
- package/dist/alert/define.d.ts +1 -1
- package/dist/avatar/avatar-group.d.ts +2 -2
- package/dist/avatar/avatar-group2.js +1 -1
- package/dist/avatar/avatar.d.ts +3 -3
- package/dist/avatar/avatar2.js +2 -2
- package/dist/avatar/define.d.ts +1 -1
- package/dist/badge/badge.d.ts +7 -6
- package/dist/badge/badge2.js +2 -2
- package/dist/badge/badge2.js.map +1 -1
- package/dist/badge/define.d.ts +1 -1
- package/dist/breadcrumb/breadcrumb.d.ts +4 -4
- package/dist/breadcrumb/breadcrumb2.js +2 -2
- package/dist/breadcrumb/breadcrumb2.js.map +1 -1
- package/dist/breadcrumb/define.d.ts +1 -1
- package/dist/bundle.d.ts +136 -67
- package/dist/bundles/index.d.ts +49 -0
- package/dist/bundles/index.js +4 -4
- package/dist/button/button.d.ts +4 -4
- package/dist/button/button2.js +2 -2
- package/dist/button/button2.js.map +1 -1
- package/dist/button/define.d.ts +1 -1
- package/dist/button-group/button-group.d.ts +5 -4
- package/dist/button-group/button-group2.js +2 -2
- package/dist/button-group/define.d.ts +1 -1
- package/dist/card/card.d.ts +9 -9
- package/dist/card/card2.js +5 -5
- package/dist/card/define.d.ts +1 -1
- package/dist/chat-message/chat-message.d.ts +3 -3
- package/dist/chat-message/chat-message2.js +2 -2
- package/dist/chat-message/define.d.ts +1 -1
- package/dist/checkbox/checkbox-group.d.ts +2 -2
- package/dist/checkbox/checkbox-group2.js +2 -2
- package/dist/checkbox/checkbox.d.ts +2 -2
- package/dist/checkbox/checkbox2.js +2 -2
- package/dist/checkbox/define.d.ts +1 -1
- package/dist/color/color.d.ts +5 -5
- package/dist/color/color2.js +2 -2
- package/dist/color/color2.js.map +1 -1
- package/dist/color/define.d.ts +1 -1
- package/dist/combobox/combobox.d.ts +12 -11
- package/dist/combobox/combobox2.js +2 -2
- package/dist/combobox/combobox2.js.map +1 -1
- package/dist/combobox/define.d.ts +1 -1
- package/dist/copy-button/copy-button.d.ts +7 -7
- package/dist/copy-button/copy-button2.js +2 -2
- package/dist/copy-button/copy-button2.js.map +1 -1
- package/dist/copy-button/define.d.ts +1 -1
- package/dist/custom-elements-jsx.d.ts +52 -0
- package/dist/custom-elements-vue.d.ts +52 -0
- package/dist/custom-elements.json +415 -1
- package/dist/data.html.json +67 -0
- package/dist/date/date.d.ts +5 -5
- package/dist/date/date2.js +2 -2
- package/dist/date/define.d.ts +1 -1
- package/dist/datetime/datetime.d.ts +5 -5
- package/dist/datetime/datetime2.js +2 -2
- package/dist/datetime/define.d.ts +1 -1
- package/dist/dialog/define.d.ts +1 -1
- package/dist/dialog/dialog-footer.d.ts +2 -2
- package/dist/dialog/dialog-footer2.js +2 -2
- package/dist/dialog/dialog-header.d.ts +2 -2
- package/dist/dialog/dialog-header2.js +2 -2
- package/dist/dialog/dialog.d.ts +6 -5
- package/dist/dialog/dialog2.js +2 -2
- package/dist/divider/define.d.ts +1 -1
- package/dist/divider/divider.d.ts +4 -3
- package/dist/divider/divider2.js +2 -2
- package/dist/dot/define.d.ts +1 -1
- package/dist/dot/dot.d.ts +3 -3
- package/dist/dot/dot2.js +2 -2
- package/dist/drawer/define.d.ts +1 -1
- package/dist/drawer/drawer-content.d.ts +2 -2
- package/dist/drawer/drawer-content2.js +2 -2
- package/dist/drawer/drawer-footer.d.ts +2 -2
- package/dist/drawer/drawer-footer2.js +2 -2
- package/dist/drawer/drawer-header.d.ts +2 -2
- package/dist/drawer/drawer-header2.js +2 -2
- package/dist/drawer/drawer.d.ts +6 -5
- package/dist/drawer/drawer2.js +2 -2
- package/dist/dropdown/define.d.ts +1 -1
- package/dist/dropdown/dropdown-footer.d.ts +2 -2
- package/dist/dropdown/dropdown-footer2.js +2 -2
- package/dist/dropdown/dropdown-header.d.ts +2 -2
- package/dist/dropdown/dropdown-header2.js +2 -2
- package/dist/dropdown/dropdown.d.ts +6 -5
- package/dist/dropdown/dropdown2.js +2 -2
- package/dist/dropdown-group/define.d.ts +1 -1
- package/dist/dropdown-group/dropdown-group.d.ts +3 -3
- package/dist/dropdown-group/dropdown-group.js +2 -2
- package/dist/dropdown-group/dropdown-group.js.map +1 -1
- package/dist/dropzone/define.d.ts +1 -1
- package/dist/dropzone/dropzone.d.ts +12 -12
- package/dist/dropzone/dropzone.util.d.ts +1 -1
- package/dist/dropzone/dropzone.util.js.map +1 -1
- package/dist/dropzone/dropzone2.js +2 -2
- package/dist/dropzone/dropzone2.js.map +1 -1
- package/dist/file/define.d.ts +1 -1
- package/dist/file/file.d.ts +2 -2
- package/dist/file/file2.js +1 -1
- package/dist/format-datetime/define.d.ts +1 -1
- package/dist/format-datetime/format-datetime.d.ts +2 -2
- package/dist/format-datetime/format-datetime2.js +2 -2
- package/dist/format-datetime/format-datetime2.js.map +1 -1
- package/dist/format-number/define.d.ts +1 -1
- package/dist/format-number/format-number.d.ts +2 -2
- package/dist/format-number/format-number2.js +3 -3
- package/dist/format-number/format-number2.js.map +1 -1
- package/dist/format-relative-time/define.d.ts +1 -1
- package/dist/format-relative-time/format-relative-time.d.ts +2 -2
- package/dist/format-relative-time/format-relative-time2.js +2 -2
- package/dist/format-relative-time/format-relative-time2.js.map +1 -1
- package/dist/forms/control/control.d.ts +4 -3
- package/dist/forms/control/control2.js +2 -2
- package/dist/forms/control/control2.js.map +1 -1
- package/dist/forms/control-group/control-group.d.ts +4 -3
- package/dist/forms/control-group/control-group2.js +2 -2
- package/dist/forms/control-message/control-message.d.ts +4 -4
- package/dist/forms/control-message/control-message2.js +2 -2
- package/dist/forms/define.d.ts +1 -1
- package/dist/forms/utils/layout.d.ts +2 -2
- package/dist/forms/utils/layout.js +1 -1
- package/dist/forms/utils/layout.js.map +1 -1
- package/dist/forms/utils/states.d.ts +2 -2
- package/dist/forms/utils/states.js +1 -1
- package/dist/forms/utils/states.js.map +1 -1
- package/dist/gauge/define.d.ts +6 -0
- package/dist/gauge/define.js +7 -0
- package/dist/gauge/define.js.map +1 -0
- package/dist/gauge/gauge.d.ts +52 -0
- package/dist/gauge/gauge.examples.js +6 -0
- package/dist/gauge/gauge.examples.js.map +1 -0
- package/dist/gauge/gauge.examples.json +147 -0
- package/dist/gauge/gauge.js +6 -0
- package/dist/gauge/gauge.js.map +1 -0
- package/dist/gauge/gauge2.js +106 -0
- package/dist/gauge/gauge2.js.map +1 -0
- package/dist/gauge/index.d.ts +1 -0
- package/dist/gauge/index.js +2 -0
- package/dist/grid/cell/cell.d.ts +2 -2
- package/dist/grid/cell/cell2.js +1 -1
- package/dist/grid/column/column.d.ts +4 -3
- package/dist/grid/column/column2.js +2 -2
- package/dist/grid/column/column2.js.map +1 -1
- package/dist/grid/define.d.ts +1 -1
- package/dist/grid/footer/footer.d.ts +2 -2
- package/dist/grid/footer/footer2.js +2 -2
- package/dist/grid/grid.d.ts +6 -5
- package/dist/grid/grid2.js +2 -2
- package/dist/grid/grid2.js.map +1 -1
- package/dist/grid/header/header.d.ts +4 -3
- package/dist/grid/header/header2.js +2 -2
- package/dist/grid/header/header2.js.map +1 -1
- package/dist/grid/placeholder/placeholder.d.ts +2 -2
- package/dist/grid/placeholder/placeholder2.js +1 -1
- package/dist/grid/row/row.d.ts +2 -2
- package/dist/grid/row/row2.js +2 -2
- package/dist/icon/define.d.ts +1 -1
- package/dist/icon/icon.d.ts +6 -5
- package/dist/icon/icon2.js +3 -3
- package/dist/icon/icon2.js.map +1 -1
- package/dist/icon/icons.js.map +1 -1
- package/dist/icon-button/define.d.ts +1 -1
- package/dist/icon-button/icon-button.d.ts +6 -5
- package/dist/icon-button/icon-button2.js +2 -2
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/dist/input/define.d.ts +1 -1
- package/dist/input/input-group.d.ts +2 -2
- package/dist/input/input-group2.js +1 -1
- package/dist/input/input-group2.js.map +1 -1
- package/dist/input/input.d.ts +3 -3
- package/dist/input/input2.js +2 -2
- package/dist/internal/controllers/audit.controller.d.ts +1 -1
- package/dist/internal/controllers/i18n.controller.d.ts +3 -3
- package/dist/internal/controllers/i18n.controller.js +1 -1
- package/dist/internal/controllers/i18n.controller.js.map +1 -1
- package/dist/internal/controllers/keynav-grid.controller.d.ts +1 -1
- package/dist/internal/controllers/keynav-grid.controller.js.map +1 -1
- package/dist/internal/controllers/keynav-list.controller.d.ts +1 -1
- package/dist/internal/controllers/keynav-list.controller.js.map +1 -1
- package/dist/internal/controllers/state-expanded.controller.d.ts +1 -1
- package/dist/internal/controllers/state-highlighted.controller.d.ts +1 -1
- package/dist/internal/controllers/state-scroll.controller.d.ts +1 -1
- package/dist/internal/controllers/state-selected.controller.d.ts +1 -1
- package/dist/internal/controllers/state-selected.controller.js.map +1 -1
- package/dist/internal/controllers/type-anchor.controller.d.ts +1 -1
- package/dist/internal/controllers/type-anchor.controller.js.map +1 -1
- package/dist/internal/controllers/type-closable.controller.d.ts +1 -1
- package/dist/internal/controllers/type-expandable.controller.d.ts +1 -1
- package/dist/internal/controllers/type-native-popover.controller.d.ts +2 -2
- package/dist/internal/controllers/type-native-popover.controller.js.map +1 -1
- package/dist/internal/controllers/type-native-popover.utils.js.map +1 -1
- package/dist/internal/controllers/type-selectable.controller.d.ts +1 -1
- package/dist/internal/controllers/type-ssr.controller.d.ts +1 -1
- package/dist/internal/controllers/type-ssr.controller.js.map +1 -1
- package/dist/internal/controllers/type-touch.controller.d.ts +2 -2
- package/dist/internal/controllers/type-touch.controller.js.map +1 -1
- package/dist/internal/decorators/host-attr.d.ts +2 -2
- package/dist/internal/services/global.service.d.ts +1 -1
- package/dist/internal/services/global.service.js +1 -1
- package/dist/internal/services/global.service.js.map +1 -1
- package/dist/internal/services/global.utils.js.map +1 -1
- package/dist/internal/services/i18n.service.js.map +1 -1
- package/dist/internal/services/transition.service.js.map +1 -1
- package/dist/internal/styles/index.d.ts +1 -1
- package/dist/internal/types/index.d.ts +3 -3
- package/dist/internal/utils/a11y.js.map +1 -1
- package/dist/internal/utils/audit-logs.js +1 -1
- package/dist/internal/utils/audit.js.map +1 -1
- package/dist/internal/utils/dom.d.ts +1 -1
- package/dist/internal/utils/dom.js +10 -10
- package/dist/internal/utils/dom.js.map +1 -1
- package/dist/internal/utils/focus.js.map +1 -1
- package/dist/internal/utils/objects.js.map +1 -1
- package/dist/internal/utils/strings.js +1 -1
- package/dist/internal/utils/strings.js.map +1 -1
- package/dist/logo/define.d.ts +1 -1
- package/dist/logo/logo.d.ts +3 -3
- package/dist/logo/logo2.js +2 -2
- package/dist/menu/define.d.ts +1 -1
- package/dist/menu/menu-item.d.ts +3 -3
- package/dist/menu/menu-item2.js +2 -2
- package/dist/menu/menu-item2.js.map +1 -1
- package/dist/menu/menu.d.ts +4 -4
- package/dist/menu/menu2.js +2 -2
- package/dist/menu/menu2.js.map +1 -1
- package/dist/month/define.d.ts +1 -1
- package/dist/month/month.d.ts +5 -5
- package/dist/month/month2.js +2 -2
- package/dist/notification/define.d.ts +1 -1
- package/dist/notification/notification-group.d.ts +4 -3
- package/dist/notification/notification-group2.js +2 -2
- package/dist/notification/notification.d.ts +9 -7
- package/dist/notification/notification2.js +2 -2
- package/dist/page/define.d.ts +1 -1
- package/dist/page/page-panel/page-panel-content.d.ts +2 -2
- package/dist/page/page-panel/page-panel-content2.js +1 -1
- package/dist/page/page-panel/page-panel-footer.d.ts +2 -2
- package/dist/page/page-panel/page-panel-footer2.js +2 -2
- package/dist/page/page-panel/page-panel-header.d.ts +2 -2
- package/dist/page/page-panel/page-panel-header2.js +2 -2
- package/dist/page/page-panel/page-panel.d.ts +4 -4
- package/dist/page/page-panel/page-panel2.js +2 -2
- package/dist/page/page.d.ts +2 -2
- package/dist/page/page2.js +2 -2
- package/dist/page-header/define.d.ts +1 -1
- package/dist/page-header/page-header.d.ts +2 -2
- package/dist/page-header/page-header2.js +1 -1
- package/dist/page-loader/define.d.ts +1 -1
- package/dist/page-loader/page-loader.d.ts +5 -4
- package/dist/page-loader/page-loader2.js +2 -2
- package/dist/pagination/define.d.ts +1 -1
- package/dist/pagination/pagination.d.ts +8 -8
- package/dist/pagination/pagination2.js +2 -2
- package/dist/pagination/pagination2.js.map +1 -1
- package/dist/panel/define.d.ts +1 -1
- package/dist/panel/panel.d.ts +10 -10
- package/dist/panel/panel2.js +5 -5
- package/dist/password/define.d.ts +1 -1
- package/dist/password/password.d.ts +5 -5
- package/dist/password/password2.js +2 -2
- package/dist/polyfills/custom-state-set.js.map +1 -1
- package/dist/polyfills/index.d.ts +13 -0
- package/dist/preferences-input/define.d.ts +1 -1
- package/dist/preferences-input/preferences-input.d.ts +13 -13
- package/dist/preferences-input/preferences-input2.js +2 -2
- package/dist/preferences-input/preferences-input2.js.map +1 -1
- package/dist/progress-bar/define.d.ts +1 -1
- package/dist/progress-bar/progress-bar.d.ts +3 -3
- package/dist/progress-bar/progress-bar2.js +2 -2
- package/dist/progress-ring/define.d.ts +1 -1
- package/dist/progress-ring/progress-ring.d.ts +7 -6
- package/dist/progress-ring/progress-ring2.js +4 -4
- package/dist/progress-ring/progress-ring2.js.map +1 -1
- package/dist/progressive-filter-chip/define.d.ts +1 -1
- package/dist/progressive-filter-chip/progressive-filter-chip.d.ts +7 -7
- package/dist/progressive-filter-chip/progressive-filter-chip2.js +2 -2
- package/dist/progressive-filter-chip/progressive-filter-chip2.js.map +1 -1
- package/dist/pulse/define.d.ts +1 -1
- package/dist/pulse/pulse.d.ts +4 -4
- package/dist/pulse/pulse2.js +2 -2
- package/dist/radio/define.d.ts +1 -1
- package/dist/radio/radio-group.d.ts +2 -2
- package/dist/radio/radio-group2.js +2 -2
- package/dist/radio/radio.d.ts +2 -2
- package/dist/radio/radio2.js +2 -2
- package/dist/range/define.d.ts +1 -1
- package/dist/range/range.d.ts +5 -4
- package/dist/range/range2.js +2 -2
- package/dist/resize-handle/define.d.ts +1 -1
- package/dist/resize-handle/resize-handle.d.ts +6 -6
- package/dist/resize-handle/resize-handle2.js +2 -2
- package/dist/resize-handle/resize-handle2.js.map +1 -1
- package/dist/search/define.d.ts +1 -1
- package/dist/search/search.d.ts +5 -5
- package/dist/search/search2.js +2 -2
- package/dist/select/define.d.ts +1 -1
- package/dist/select/select.d.ts +11 -10
- package/dist/select/select2.js +2 -2
- package/dist/select/select2.js.map +1 -1
- package/dist/skeleton/define.d.ts +1 -1
- package/dist/skeleton/skeleton.d.ts +3 -3
- package/dist/skeleton/skeleton2.js +2 -2
- package/dist/skeleton/skeleton2.js.map +1 -1
- package/dist/sort-button/define.d.ts +1 -1
- package/dist/sort-button/sort-button.d.ts +5 -5
- package/dist/sort-button/sort-button2.js +2 -2
- package/dist/sort-button/sort-button2.js.map +1 -1
- package/dist/sparkline/define.d.ts +1 -1
- package/dist/sparkline/sparkline.d.ts +5 -4
- package/dist/sparkline/sparkline.utils.d.ts +1 -1
- package/dist/sparkline/sparkline.utils.js.map +1 -1
- package/dist/sparkline/sparkline2.js +2 -2
- package/dist/sparkline/sparkline2.js.map +1 -1
- package/dist/star-rating/define.d.ts +1 -1
- package/dist/star-rating/star-rating.d.ts +5 -5
- package/dist/star-rating/star-rating2.js +2 -2
- package/dist/star-rating/star-rating2.js.map +1 -1
- package/dist/steps/define.d.ts +1 -1
- package/dist/steps/steps.d.ts +10 -9
- package/dist/steps/steps2.js +3 -3
- package/dist/steps/steps2.js.map +1 -1
- package/dist/switch/define.d.ts +1 -1
- package/dist/switch/switch-group.d.ts +2 -2
- package/dist/switch/switch-group2.js +2 -2
- package/dist/switch/switch.d.ts +2 -2
- package/dist/switch/switch2.js +2 -2
- package/dist/tabs/define.d.ts +1 -1
- package/dist/tabs/tabs-group.d.ts +4 -3
- package/dist/tabs/tabs-group2.js +2 -2
- package/dist/tabs/tabs-group2.js.map +1 -1
- package/dist/tabs/tabs.d.ts +8 -7
- package/dist/tabs/tabs2.js +3 -3
- package/dist/tabs/tabs2.js.map +1 -1
- package/dist/tag/define.d.ts +1 -1
- package/dist/tag/tag.d.ts +6 -6
- package/dist/tag/tag2.js +2 -2
- package/dist/tag/tag2.js.map +1 -1
- package/dist/textarea/define.d.ts +1 -1
- package/dist/textarea/textarea.d.ts +2 -2
- package/dist/textarea/textarea2.js +1 -1
- package/dist/time/define.d.ts +1 -1
- package/dist/time/time.d.ts +5 -5
- package/dist/time/time2.js +2 -2
- package/dist/toast/define.d.ts +1 -1
- package/dist/toast/toast.d.ts +7 -6
- package/dist/toast/toast2.js +2 -2
- package/dist/toggletip/define.d.ts +1 -1
- package/dist/toggletip/toggletip-footer.d.ts +2 -2
- package/dist/toggletip/toggletip-footer2.js +2 -2
- package/dist/toggletip/toggletip-header.d.ts +2 -2
- package/dist/toggletip/toggletip-header2.js +2 -2
- package/dist/toggletip/toggletip.d.ts +6 -5
- package/dist/toggletip/toggletip2.js +2 -2
- package/dist/toolbar/define.d.ts +1 -1
- package/dist/toolbar/toolbar.d.ts +5 -4
- package/dist/toolbar/toolbar2.js +2 -2
- package/dist/toolbar/toolbar2.js.map +1 -1
- package/dist/tooltip/define.d.ts +1 -1
- package/dist/tooltip/tooltip.d.ts +4 -3
- package/dist/tooltip/tooltip2.js +2 -2
- package/dist/tree/define.d.ts +1 -1
- package/dist/tree/tree-node.d.ts +6 -6
- package/dist/tree/tree-node2.js +2 -2
- package/dist/tree/tree-node2.js.map +1 -1
- package/dist/tree/tree.d.ts +5 -4
- package/dist/tree/tree2.js +2 -2
- package/dist/tree/tree2.js.map +1 -1
- package/dist/week/define.d.ts +1 -1
- package/dist/week/week.d.ts +5 -5
- package/dist/week/week2.js +2 -2
- package/package.json +21 -9
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
|
-
import { PopoverPosition, PopoverType
|
|
3
|
-
import {
|
|
2
|
+
import type { PopoverPosition, PopoverType } from '@nvidia-elements/core/internal';
|
|
3
|
+
import { TypeNativePopoverController } from '@nvidia-elements/core/internal';
|
|
4
|
+
import { ProgressRing } from '@nvidia-elements/core/progress-ring';
|
|
4
5
|
/**
|
|
5
6
|
* @element nve-page-loader
|
|
6
7
|
* @description Page Loader is a full-screen version of the `progress-ring` component, for use when the page should remain unusable as the loader displays.
|
|
@@ -23,7 +24,7 @@ export declare class PageLoader extends LitElement {
|
|
|
23
24
|
* @private
|
|
24
25
|
*/
|
|
25
26
|
anchor: HTMLElement;
|
|
26
|
-
static styles: import(
|
|
27
|
+
static styles: import("lit").CSSResult[];
|
|
27
28
|
static readonly metadata: {
|
|
28
29
|
tag: string;
|
|
29
30
|
version: string;
|
|
@@ -33,5 +34,5 @@ export declare class PageLoader extends LitElement {
|
|
|
33
34
|
};
|
|
34
35
|
/** @private */
|
|
35
36
|
_internals: ElementInternals;
|
|
36
|
-
render(): import(
|
|
37
|
+
render(): import("lit").TemplateResult<1>;
|
|
37
38
|
}
|
|
@@ -2,7 +2,7 @@ import { TypeNativePopoverController as e } from "../internal/controllers/type-n
|
|
|
2
2
|
import { scopedRegistry as t } from "../internal/decorators/scoped-registry.js";
|
|
3
3
|
import { useStyles as n } from "../internal/styles/index.js";
|
|
4
4
|
import { popoverStyles as r } from "../internal/styles/popover2.js";
|
|
5
|
-
import
|
|
5
|
+
import i from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
|
|
6
6
|
import { ProgressRing as a } from "../progress-ring/progress-ring2.js";
|
|
7
7
|
import o from "./page-loader.js";
|
|
8
8
|
import { LitElement as s, html as c } from "lit";
|
|
@@ -18,7 +18,7 @@ var u = class extends s {
|
|
|
18
18
|
static {
|
|
19
19
|
this.metadata = {
|
|
20
20
|
tag: "nve-page-loader",
|
|
21
|
-
version: "2.0
|
|
21
|
+
version: "2.1.0"
|
|
22
22
|
};
|
|
23
23
|
}
|
|
24
24
|
static {
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
|
-
import { KeynavListConfig } from '
|
|
3
|
-
import { IconButton } from '
|
|
4
|
-
import { Select } from '
|
|
5
|
-
declare const Pagination_base: import(
|
|
2
|
+
import type { KeynavListConfig } from '@nvidia-elements/core/internal';
|
|
3
|
+
import { IconButton } from '@nvidia-elements/core/icon-button';
|
|
4
|
+
import { Select } from '@nvidia-elements/core/select';
|
|
5
|
+
declare const Pagination_base: import("@nvidia-elements/forms/mixins").FormControlMixinReturn<typeof LitElement, number>;
|
|
6
6
|
/**
|
|
7
7
|
* @element nve-pagination
|
|
8
8
|
* @description Pagination is a control that enables users to navigate through pages of content.
|
|
@@ -55,15 +55,15 @@ export declare class Pagination extends Pagination_base {
|
|
|
55
55
|
/**
|
|
56
56
|
* Enables updating internal string values for internationalization.
|
|
57
57
|
*/
|
|
58
|
-
i18n: Partial<import(
|
|
58
|
+
i18n: Partial<import("@nvidia-elements/core/internal").I18nStrings & {
|
|
59
59
|
__set: boolean;
|
|
60
60
|
}>;
|
|
61
|
-
static styles: import(
|
|
61
|
+
static styles: import("lit").CSSResult[];
|
|
62
62
|
static readonly metadata: {
|
|
63
63
|
tag: string;
|
|
64
64
|
version: string;
|
|
65
65
|
valueSchema: {
|
|
66
|
-
type:
|
|
66
|
+
type: 'number';
|
|
67
67
|
};
|
|
68
68
|
};
|
|
69
69
|
static elementDefinitions: {
|
|
@@ -72,7 +72,7 @@ export declare class Pagination extends Pagination_base {
|
|
|
72
72
|
};
|
|
73
73
|
/** @private */
|
|
74
74
|
get keynavListConfig(): KeynavListConfig;
|
|
75
|
-
render(): import(
|
|
75
|
+
render(): import("lit").TemplateResult<1>;
|
|
76
76
|
constructor();
|
|
77
77
|
connectedCallback(): Promise<void>;
|
|
78
78
|
disconnectedCallback(): void;
|
|
@@ -5,7 +5,7 @@ import { attachInternals as r } from "../internal/utils/a11y.js";
|
|
|
5
5
|
import { typeSSR as i } from "../internal/controllers/type-ssr.controller.js";
|
|
6
6
|
import { scopedRegistry as a } from "../internal/decorators/scoped-registry.js";
|
|
7
7
|
import { useStyles as o } from "../internal/styles/index.js";
|
|
8
|
-
import
|
|
8
|
+
import s from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
|
|
9
9
|
import { IconButton as c } from "../icon-button/icon-button2.js";
|
|
10
10
|
import { Select as l } from "../select/select2.js";
|
|
11
11
|
import u from "./pagination.js";
|
|
@@ -21,7 +21,7 @@ var g = class extends h(d) {
|
|
|
21
21
|
static {
|
|
22
22
|
this.metadata = {
|
|
23
23
|
tag: "nve-pagination",
|
|
24
|
-
version: "2.0
|
|
24
|
+
version: "2.1.0",
|
|
25
25
|
valueSchema: { type: "number" }
|
|
26
26
|
};
|
|
27
27
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pagination2.js","names":["#currentPage","#isLastPage","#isFirstPage","#selectLabel","#label","#previousButton","#setValue","#nextButton","#startButton","#endButton","#select","#setStep","#i18nController","#setupLabelWidth","#resizeObserver"],"sources":["../../src/pagination/pagination.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { FormControlMixin } from '@nvidia-elements/forms/mixins';\nimport type { KeynavListConfig } from '@nvidia-elements/core/internal';\nimport {\n attachInternals,\n I18nController,\n formatStandardNumber,\n keyNavigationList,\n typeSSR,\n useStyles,\n scopedRegistry\n} from '@nvidia-elements/core/internal';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport { Select } from '@nvidia-elements/core/select';\nimport styles from './pagination.css?inline';\n\n/* eslint-disable jsdoc/no-types */\n// explicit jsdoc annotation due to inheritance context lost with CEM generator\n\n/**\n * @element nve-pagination\n * @description Pagination is a control that enables users to navigate through pages of content.\n * @since 0.11.0\n * @entrypoint \\@nvidia-elements/core/pagination\n * @event input - Dispatched when the value (page) has changed\n * @event change - Dispatched when the value (page) has changed\n * @event first-page - Dispatched when the first page is active\n * @event last-page - Dispatched when the last page is active\n * @slot - default slot for content\n * @slot suffix-label - slot for overriding the \"n of total\" label when total is an approximation\n * @cssprop --background\n * @cssprop --font-size\n * @cssprop --width\n * @csspart icon-button - Base part applied to all icon button elements\n * @csspart previous-icon-button - The previous page icon button\n * @csspart next-icon-button - The next page icon button\n * @csspart start-icon-button - The first page icon button\n * @csspart end-icon-button - The last page icon button\n * @csspart select - The page size select element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/toolbar/\n * @property {number} value - value the current page number\n */\n@typeSSR()\n@keyNavigationList<Pagination>()\n@scopedRegistry()\nexport class Pagination extends FormControlMixin<typeof LitElement, number>(LitElement) {\n /**\n * The number of items per page.\n */\n @property({ type: Number }) step = 10;\n /**\n * The array of custom step-size.\n */\n @property({ type: Array }) stepSizes = [10, 20, 50, 100];\n\n /**\n * The total number of items.\n */\n @property({ type: Number }) items: number;\n\n /**\n * Whether the pagination is skippable to start/end.\n */\n @property({ type: Boolean }) skippable: boolean;\n\n /**\n * Whether the step selector has a disabled state.\n */\n @property({ type: Boolean, attribute: 'disable-step' }) disableStep: boolean;\n\n /**\n * Determines the container styles of component. Flat applies when nesting within other containers. Inline applies when placing within other inline content.\n */\n @property({ type: String, reflect: true }) container?: 'flat' | 'inline';\n\n #i18nController: I18nController<this> = new I18nController<this>(this);\n\n /**\n * Enables updating internal string values for internationalization.\n */\n @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n static styles = useStyles([styles]);\n\n static readonly metadata = {\n tag: 'nve-pagination',\n version: '0.0.0',\n valueSchema: {\n type: 'number' as const\n }\n };\n\n static elementDefinitions = {\n [IconButton.metadata.tag]: IconButton,\n [Select.metadata.tag]: Select\n };\n\n /** @private */\n get keynavListConfig(): KeynavListConfig {\n return {\n items: this.shadowRoot!.querySelectorAll<HTMLElement>(`${IconButton.metadata.tag}, input, select`),\n layout: 'horizontal'\n };\n }\n\n get #currentPage() {\n return (this.value! - 1) * this.step + this.step;\n }\n\n get #isLastPage() {\n return this.items / this.value! === this.step;\n }\n\n get #isFirstPage() {\n return this.value === 1;\n }\n\n get #selectLabel() {\n const start = (this.value! - 1) * this.step + 1;\n const end = Math.min(this.value! * this.step, this.items || Infinity);\n return `${formatStandardNumber(start)}-${formatStandardNumber(end)}`;\n }\n\n get #label() {\n return this.items\n ? html`<label><slot name=\"suffix-label\">${this.i18n.of} ${formatStandardNumber(this.items)}</slot></label>`\n : nothing;\n }\n\n get #previousButton() {\n return html`<nve-icon-button part=\"icon-button previous-icon-button\"\n @click=${() => this.#setValue(this.value! - 1)}\n .disabled=${this.disabled || this.#currentPage <= this.step}\n .ariaLabel=${this.i18n.previous}\n container=\"inline\"\n icon-name=\"chevron\"\n direction=\"left\"\n ></nve-icon-button>`;\n }\n\n get #nextButton() {\n return html`<nve-icon-button part=\"icon-button next-icon-button\"\n @click=${() => this.#setValue(this.value! + 1)}\n .disabled=${this.disabled || this.#currentPage >= this.items}\n .ariaLabel=${this.i18n.next}\n container=\"inline\"\n icon-name=\"chevron\"\n direction=\"right\"\n ></nve-icon-button>`;\n }\n\n get #startButton() {\n return html`<nve-icon-button part=\"icon-button start-icon-button\"\n @click=${() => this.#setValue(1)}\n .disabled=${this.disabled || this.#currentPage <= this.step}\n .ariaLabel=${this.i18n.start}\n container=\"inline\"\n icon-name=\"arrow-stop\"\n direction=\"left\"\n ></nve-icon-button>`;\n }\n\n get #endButton() {\n return html`<nve-icon-button part=\"icon-button end-icon-button\"\n @click=${() => this.#setValue(this.items / this.step)}\n .disabled=${this.disabled || (this.value! - 1) * this.step + this.step >= this.items}\n .ariaLabel=${this.i18n.end}\n container=\"inline\"\n icon-name=\"arrow-stop\"\n direction=\"right\"\n ></nve-icon-button>`;\n }\n\n #resizeObserver: ResizeObserver;\n\n get #select() {\n return this.disableStep\n ? html`<label>${this.#selectLabel} </label>`\n : html`\n <nve-select part=\"select\" .container=${this.container}>\n <select\n .ariaLabel=${this.i18n.currentPage}\n @change=${(e: Event) => this.#setStep(parseInt((e.target as HTMLSelectElement).value, 10))}\n value=${this.step}\n .disabled=${this.disabled || this.disableStep}\n >\n ${this.stepSizes.map(i => html`<option ?selected=${this.step === i} value=${i}>${i}</option>`)}\n </select>\n <div class=\"select-label\">${this.#selectLabel}</div>\n </nve-select>\n `;\n }\n\n render() {\n return html`\n <div internal-host role=\"presentation\">\n ${\n this.skippable && this.items\n ? html`\n ${this.#startButton} ${this.#previousButton} ${this.#select} ${this.#label} ${this.#nextButton}\n ${this.#endButton}\n `\n : html` ${this.#select} ${this.#label} ${this.#previousButton} ${this.#nextButton} `\n }\n </div>\n `;\n }\n\n constructor() {\n super();\n this.value = 1;\n }\n\n async connectedCallback() {\n super.connectedCallback();\n attachInternals(this);\n this._internals.role = 'toolbar';\n await this.updateComplete;\n this.#setupLabelWidth();\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#resizeObserver?.unobserve(this);\n }\n\n #setupLabelWidth() {\n const label = this.shadowRoot!.querySelector('.select-label');\n const select = this.shadowRoot!.querySelector('select');\n if (label && select) {\n this.#resizeObserver = new ResizeObserver(\n entries => (select!.style.minWidth = `${entries[0]!.contentRect.width + 36}px`)\n );\n this.#resizeObserver.observe(label);\n }\n }\n\n #setStep(value: number) {\n /* eslint-disable-next-line */\n this.step = value; // stateful due to internalized select element\n this.dispatchEvent(new CustomEvent('step-change', { detail: this.step, bubbles: true, composed: true }));\n this.#setValue(this.value!);\n }\n\n #setValue(value: number) {\n if (this.value !== value) {\n this.value = value;\n this.dispatchInputEvent();\n this.dispatchChangeEvent();\n }\n\n if (this.#isLastPage) {\n this.dispatchEvent(new CustomEvent('last-page', { bubbles: true, composed: true }));\n }\n\n if (this.#isFirstPage) {\n this.dispatchEvent(new CustomEvent('first-page', { bubbles: true, composed: true }));\n }\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"pagination2.js","names":["#currentPage","#isLastPage","#isFirstPage","#selectLabel","#label","#previousButton","#setValue","#nextButton","#startButton","#endButton","#select","#setStep","#i18nController","#setupLabelWidth","#resizeObserver"],"sources":["../../src/pagination/pagination.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { FormControlMixin } from '@nvidia-elements/forms/mixins';\nimport type { KeynavListConfig } from '@nvidia-elements/core/internal';\nimport {\n attachInternals,\n I18nController,\n formatStandardNumber,\n keyNavigationList,\n typeSSR,\n useStyles,\n scopedRegistry\n} from '@nvidia-elements/core/internal';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport { Select } from '@nvidia-elements/core/select';\nimport styles from './pagination.css?inline';\n\n/* eslint-disable jsdoc/no-types */\n// explicit jsdoc annotation due to inheritance context lost with CEM generator\n\n/**\n * @element nve-pagination\n * @description Pagination is a control that enables users to navigate through pages of content.\n * @since 0.11.0\n * @entrypoint \\@nvidia-elements/core/pagination\n * @event input - Dispatched when the value (page) has changed\n * @event change - Dispatched when the value (page) has changed\n * @event first-page - Dispatched when the first page is active\n * @event last-page - Dispatched when the last page is active\n * @slot - default slot for content\n * @slot suffix-label - slot for overriding the \"n of total\" label when total is an approximation\n * @cssprop --background\n * @cssprop --font-size\n * @cssprop --width\n * @csspart icon-button - Base part applied to all icon button elements\n * @csspart previous-icon-button - The previous page icon button\n * @csspart next-icon-button - The next page icon button\n * @csspart start-icon-button - The first page icon button\n * @csspart end-icon-button - The last page icon button\n * @csspart select - The page size select element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/toolbar/\n * @property {number} value - value the current page number\n */\n@typeSSR()\n@keyNavigationList<Pagination>()\n@scopedRegistry()\nexport class Pagination extends FormControlMixin<typeof LitElement, number>(LitElement) {\n /**\n * The number of items per page.\n */\n @property({ type: Number }) step = 10;\n /**\n * The array of custom step-size.\n */\n @property({ type: Array }) stepSizes = [10, 20, 50, 100];\n\n /**\n * The total number of items.\n */\n @property({ type: Number }) items: number;\n\n /**\n * Whether the pagination is skippable to start/end.\n */\n @property({ type: Boolean }) skippable: boolean;\n\n /**\n * Whether the step selector has a disabled state.\n */\n @property({ type: Boolean, attribute: 'disable-step' }) disableStep: boolean;\n\n /**\n * Determines the container styles of component. Flat applies when nesting within other containers. Inline applies when placing within other inline content.\n */\n @property({ type: String, reflect: true }) container?: 'flat' | 'inline';\n\n #i18nController: I18nController<this> = new I18nController<this>(this);\n\n /**\n * Enables updating internal string values for internationalization.\n */\n @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n static styles = useStyles([styles]);\n\n static readonly metadata = {\n tag: 'nve-pagination',\n version: '0.0.0',\n valueSchema: {\n type: 'number' as const\n }\n };\n\n static elementDefinitions = {\n [IconButton.metadata.tag]: IconButton,\n [Select.metadata.tag]: Select\n };\n\n /** @private */\n get keynavListConfig(): KeynavListConfig {\n return {\n items: this.shadowRoot!.querySelectorAll<HTMLElement>(`${IconButton.metadata.tag}, input, select`),\n layout: 'horizontal'\n };\n }\n\n get #currentPage() {\n return (this.value! - 1) * this.step + this.step;\n }\n\n get #isLastPage() {\n return this.items / this.value! === this.step;\n }\n\n get #isFirstPage() {\n return this.value === 1;\n }\n\n get #selectLabel() {\n const start = (this.value! - 1) * this.step + 1;\n const end = Math.min(this.value! * this.step, this.items || Infinity);\n return `${formatStandardNumber(start)}-${formatStandardNumber(end)}`;\n }\n\n get #label() {\n return this.items\n ? html`<label><slot name=\"suffix-label\">${this.i18n.of} ${formatStandardNumber(this.items)}</slot></label>`\n : nothing;\n }\n\n get #previousButton() {\n return html`<nve-icon-button part=\"icon-button previous-icon-button\"\n @click=${() => this.#setValue(this.value! - 1)}\n .disabled=${this.disabled || this.#currentPage <= this.step}\n .ariaLabel=${this.i18n.previous}\n container=\"inline\"\n icon-name=\"chevron\"\n direction=\"left\"\n ></nve-icon-button>`;\n }\n\n get #nextButton() {\n return html`<nve-icon-button part=\"icon-button next-icon-button\"\n @click=${() => this.#setValue(this.value! + 1)}\n .disabled=${this.disabled || this.#currentPage >= this.items}\n .ariaLabel=${this.i18n.next}\n container=\"inline\"\n icon-name=\"chevron\"\n direction=\"right\"\n ></nve-icon-button>`;\n }\n\n get #startButton() {\n return html`<nve-icon-button part=\"icon-button start-icon-button\"\n @click=${() => this.#setValue(1)}\n .disabled=${this.disabled || this.#currentPage <= this.step}\n .ariaLabel=${this.i18n.start}\n container=\"inline\"\n icon-name=\"arrow-stop\"\n direction=\"left\"\n ></nve-icon-button>`;\n }\n\n get #endButton() {\n return html`<nve-icon-button part=\"icon-button end-icon-button\"\n @click=${() => this.#setValue(this.items / this.step)}\n .disabled=${this.disabled || (this.value! - 1) * this.step + this.step >= this.items}\n .ariaLabel=${this.i18n.end}\n container=\"inline\"\n icon-name=\"arrow-stop\"\n direction=\"right\"\n ></nve-icon-button>`;\n }\n\n #resizeObserver: ResizeObserver;\n\n get #select() {\n return this.disableStep\n ? html`<label>${this.#selectLabel} </label>`\n : html`\n <nve-select part=\"select\" .container=${this.container}>\n <select\n .ariaLabel=${this.i18n.currentPage}\n @change=${(e: Event) => this.#setStep(parseInt((e.target as HTMLSelectElement).value, 10))}\n value=${this.step}\n .disabled=${this.disabled || this.disableStep}\n >\n ${this.stepSizes.map(i => html`<option ?selected=${this.step === i} value=${i}>${i}</option>`)}\n </select>\n <div class=\"select-label\">${this.#selectLabel}</div>\n </nve-select>\n `;\n }\n\n render() {\n return html`\n <div internal-host role=\"presentation\">\n ${\n this.skippable && this.items\n ? html`\n ${this.#startButton} ${this.#previousButton} ${this.#select} ${this.#label} ${this.#nextButton}\n ${this.#endButton}\n `\n : html` ${this.#select} ${this.#label} ${this.#previousButton} ${this.#nextButton} `\n }\n </div>\n `;\n }\n\n constructor() {\n super();\n this.value = 1;\n }\n\n async connectedCallback() {\n super.connectedCallback();\n attachInternals(this);\n this._internals.role = 'toolbar';\n await this.updateComplete;\n this.#setupLabelWidth();\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#resizeObserver?.unobserve(this);\n }\n\n #setupLabelWidth() {\n const label = this.shadowRoot!.querySelector('.select-label');\n const select = this.shadowRoot!.querySelector('select');\n if (label && select) {\n this.#resizeObserver = new ResizeObserver(\n entries => (select!.style.minWidth = `${entries[0]!.contentRect.width + 36}px`)\n );\n this.#resizeObserver.observe(label);\n }\n }\n\n #setStep(value: number) {\n /* eslint-disable-next-line */\n this.step = value; // stateful due to internalized select element\n this.dispatchEvent(new CustomEvent('step-change', { detail: this.step, bubbles: true, composed: true }));\n this.#setValue(this.value!);\n }\n\n #setValue(value: number) {\n if (this.value !== value) {\n this.value = value;\n this.dispatchInputEvent();\n this.dispatchChangeEvent();\n }\n\n if (this.#isLastPage) {\n this.dispatchEvent(new CustomEvent('last-page', { bubbles: true, composed: true }));\n }\n\n if (this.#isFirstPage) {\n this.dispatchEvent(new CustomEvent('first-page', { bubbles: true, composed: true }));\n }\n }\n}\n"],"mappings":"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"}
|
package/dist/panel/define.d.ts
CHANGED
package/dist/panel/panel.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
|
-
import { IconButton } from '
|
|
2
|
+
import { IconButton } from '@nvidia-elements/core/icon-button';
|
|
3
3
|
/**
|
|
4
4
|
* @element nve-panel-header
|
|
5
5
|
* @description Displays the title, subtitle, and optional action controls at the top of a panel.
|
|
@@ -15,12 +15,12 @@ import { IconButton } from '../icon-button';
|
|
|
15
15
|
* @deprecated use `nve-page-panel-header` with `nve-page-panel` instead
|
|
16
16
|
*/
|
|
17
17
|
export declare class PanelHeader extends LitElement {
|
|
18
|
-
static styles: import(
|
|
18
|
+
static styles: import("lit").CSSResult[];
|
|
19
19
|
static readonly metadata: {
|
|
20
20
|
tag: string;
|
|
21
21
|
version: string;
|
|
22
22
|
};
|
|
23
|
-
render(): import(
|
|
23
|
+
render(): import("lit").TemplateResult<1>;
|
|
24
24
|
connectedCallback(): void;
|
|
25
25
|
}
|
|
26
26
|
/**
|
|
@@ -34,12 +34,12 @@ export declare class PanelHeader extends LitElement {
|
|
|
34
34
|
* @deprecated use `nve-page-panel-content` with `nve-page-panel` instead
|
|
35
35
|
*/
|
|
36
36
|
export declare class PanelContent extends LitElement {
|
|
37
|
-
static styles: import(
|
|
37
|
+
static styles: import("lit").CSSResult[];
|
|
38
38
|
static readonly metadata: {
|
|
39
39
|
tag: string;
|
|
40
40
|
version: string;
|
|
41
41
|
};
|
|
42
|
-
render(): import(
|
|
42
|
+
render(): import("lit").TemplateResult<1>;
|
|
43
43
|
}
|
|
44
44
|
/**
|
|
45
45
|
* @element nve-panel-footer
|
|
@@ -54,12 +54,12 @@ export declare class PanelContent extends LitElement {
|
|
|
54
54
|
* @deprecated use `nve-page-panel-footer` with `nve-page-panel` instead
|
|
55
55
|
*/
|
|
56
56
|
export declare class PanelFooter extends LitElement {
|
|
57
|
-
static styles: import(
|
|
57
|
+
static styles: import("lit").CSSResult[];
|
|
58
58
|
static readonly metadata: {
|
|
59
59
|
tag: string;
|
|
60
60
|
version: string;
|
|
61
61
|
};
|
|
62
|
-
render(): import(
|
|
62
|
+
render(): import("lit").TemplateResult<1>;
|
|
63
63
|
connectedCallback(): void;
|
|
64
64
|
}
|
|
65
65
|
/**
|
|
@@ -99,7 +99,7 @@ export declare class Panel extends LitElement {
|
|
|
99
99
|
* Sets the proper collapse icon and collapse animation, based on which side of the page the panel occupies.
|
|
100
100
|
*/
|
|
101
101
|
side: 'left' | 'right';
|
|
102
|
-
static styles: import(
|
|
102
|
+
static styles: import("lit").CSSResult[];
|
|
103
103
|
static readonly metadata: {
|
|
104
104
|
tag: string;
|
|
105
105
|
version: string;
|
|
@@ -112,9 +112,9 @@ export declare class Panel extends LitElement {
|
|
|
112
112
|
/**
|
|
113
113
|
* Enables updating internal string values for internationalization.
|
|
114
114
|
*/
|
|
115
|
-
i18n: Partial<import(
|
|
115
|
+
i18n: Partial<import("@nvidia-elements/core/internal").I18nStrings & {
|
|
116
116
|
__set: boolean;
|
|
117
117
|
}>;
|
|
118
|
-
render(): import(
|
|
118
|
+
render(): import("lit").TemplateResult<1>;
|
|
119
119
|
connectedCallback(): void;
|
|
120
120
|
}
|
package/dist/panel/panel2.js
CHANGED
|
@@ -4,7 +4,7 @@ import { stateExpanded as n } from "../internal/controllers/state-expanded.contr
|
|
|
4
4
|
import { TypeExpandableController as r } from "../internal/controllers/type-expandable.controller.js";
|
|
5
5
|
import { scopedRegistry as i } from "../internal/decorators/scoped-registry.js";
|
|
6
6
|
import { useStyles as a } from "../internal/styles/index.js";
|
|
7
|
-
import
|
|
7
|
+
import o from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
|
|
8
8
|
import { IconButton as s } from "../icon-button/icon-button2.js";
|
|
9
9
|
import c from "./panel.js";
|
|
10
10
|
import l from "./panel-header.js";
|
|
@@ -21,7 +21,7 @@ var g = class extends f {
|
|
|
21
21
|
static {
|
|
22
22
|
this.metadata = {
|
|
23
23
|
tag: "nve-panel-header",
|
|
24
|
-
version: "2.0
|
|
24
|
+
version: "2.1.0"
|
|
25
25
|
};
|
|
26
26
|
}
|
|
27
27
|
render() {
|
|
@@ -37,7 +37,7 @@ var g = class extends f {
|
|
|
37
37
|
static {
|
|
38
38
|
this.metadata = {
|
|
39
39
|
tag: "nve-panel-content",
|
|
40
|
-
version: "2.0
|
|
40
|
+
version: "2.1.0"
|
|
41
41
|
};
|
|
42
42
|
}
|
|
43
43
|
render() {
|
|
@@ -50,7 +50,7 @@ var g = class extends f {
|
|
|
50
50
|
static {
|
|
51
51
|
this.metadata = {
|
|
52
52
|
tag: "nve-panel-footer",
|
|
53
|
-
version: "2.0
|
|
53
|
+
version: "2.1.0"
|
|
54
54
|
};
|
|
55
55
|
}
|
|
56
56
|
render() {
|
|
@@ -69,7 +69,7 @@ var g = class extends f {
|
|
|
69
69
|
static {
|
|
70
70
|
this.metadata = {
|
|
71
71
|
tag: "nve-panel",
|
|
72
|
-
version: "2.0
|
|
72
|
+
version: "2.1.0"
|
|
73
73
|
};
|
|
74
74
|
}
|
|
75
75
|
static {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { ContainerElement } from '
|
|
2
|
-
import { Control } from '
|
|
3
|
-
import { IconButton } from '
|
|
1
|
+
import type { ContainerElement } from '@nvidia-elements/core/internal';
|
|
2
|
+
import { Control } from '@nvidia-elements/core/forms';
|
|
3
|
+
import { IconButton } from '@nvidia-elements/core/icon-button';
|
|
4
4
|
/**
|
|
5
5
|
* @element nve-password
|
|
6
6
|
* @description A password is a control that enables users to enter password text.
|
|
@@ -24,7 +24,7 @@ export declare class Password extends Control implements ContainerElement {
|
|
|
24
24
|
*/
|
|
25
25
|
container?: 'flat';
|
|
26
26
|
private pressed;
|
|
27
|
-
static styles: import(
|
|
27
|
+
static styles: import("lit").CSSResult[];
|
|
28
28
|
static readonly metadata: {
|
|
29
29
|
tag: string;
|
|
30
30
|
version: string;
|
|
@@ -32,5 +32,5 @@ export declare class Password extends Control implements ContainerElement {
|
|
|
32
32
|
static elementDefinitions: {
|
|
33
33
|
[IconButton.metadata.tag]: typeof IconButton;
|
|
34
34
|
};
|
|
35
|
-
protected get suffixContent(): import(
|
|
35
|
+
protected get suffixContent(): import("lit").TemplateResult<1>;
|
|
36
36
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { scopedRegistry as e } from "../internal/decorators/scoped-registry.js";
|
|
2
2
|
import { useStyles as t } from "../internal/styles/index.js";
|
|
3
|
-
import
|
|
3
|
+
import n from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
|
|
4
4
|
import { Control as r } from "../forms/control/control2.js";
|
|
5
5
|
import { IconButton as i } from "../icon-button/icon-button2.js";
|
|
6
6
|
import { inputStyles as a } from "../input/input2.js";
|
|
@@ -23,7 +23,7 @@ var u = class extends r {
|
|
|
23
23
|
static {
|
|
24
24
|
this.metadata = {
|
|
25
25
|
tag: "nve-password",
|
|
26
|
-
version: "2.0
|
|
26
|
+
version: "2.1.0"
|
|
27
27
|
};
|
|
28
28
|
}
|
|
29
29
|
static {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"custom-state-set.js","names":[],"sources":["../../src/polyfills/custom-state-set.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nconst SUPPORTS_CUSTOM_STATES = CSS.supports('selector(:state(test))');\n\n/**\n * CustomStateSet Polyfill for :state() syntax downleveled to legacy :--state syntax (Chromium < v123)\n * https://html.spec.whatwg.org/multipage/custom-elements.html#exposing-custom-element-states\n *\n * https://bugzilla.mozilla.org/show_bug.cgi?id=1588763\n */\n\nclass CustomStateSetPolyfill extends Set {\n // not using native private fields due to terser bug\n private _stateSet: CustomStateSet; // eslint-disable-line no-restricted-syntax\n private _element: HTMLElement; // eslint-disable-line no-restricted-syntax\n\n constructor(stateSet: CustomStateSet, element: HTMLElement) {\n super();\n this._stateSet = stateSet;\n this._element = element;\n }\n\n add(state: string) {\n super.add(state);\n try {\n this._stateSet?.add(state.replace('--', ''));\n // try latest syntax :state()\n } catch {\n // else fallback to legacy syntax [state--*]\n this._element.setAttribute(`state--${state.replace('--', '')}`, '');\n }\n return this;\n }\n\n delete(state: string) {\n super.delete(state);\n try {\n this._stateSet?.delete(state);\n } catch {\n this._element.removeAttribute(`state--${state.replace('--', '')}`);\n }\n return true;\n }\n\n clear() {\n for (const state of this) this.delete(state);\n }\n}\n\ncustomStateSetPolyfill();\n\nfunction customStateSetPolyfill() {\n const attachInternals = HTMLElement.prototype.attachInternals;\n Object.defineProperty(HTMLElement.prototype, 'attachInternals', {\n value: function (..._args: unknown[]) {\n const internals = attachInternals.call(this) as unknown as ElementInternals;\n Object.defineProperty(internals, 'states', { value: new CustomStateSetPolyfill(internals.states, this) });\n return internals;\n }\n });\n\n const matches = Element.prototype.matches;\n Object.defineProperty(Element.prototype, 'matches', {\n value: function (text: string) {\n return matches.call(this, replaceToLegacyState(text));\n }\n });\n\n const replaceSync = CSSStyleSheet.prototype.replaceSync;\n Object.defineProperty(CSSStyleSheet.prototype, 'replaceSync', {\n value: function (text: string) {\n replaceSync.call(this, replaceToLegacyState(text));\n }\n });\n}\n\nfunction replaceToLegacyState(value: string) {\n // if the browser does not support :state(*) selectors replace any CSS state selectors with attribute fallbacks [state-*]\n if (!SUPPORTS_CUSTOM_STATES) {\n return value.replace(/:--([^\\)]+)/g, '[state--$1]').replace(/:state\\(([^\\)]+)\\)/g, '[state--$1]');\n } else {\n return value.replace(/:--([^\\)]+)/g, ':state($1)');\n }\n}\n"],"mappings":";AAGA,IAAM,IAAyB,IAAI,SAAS,wBAAwB,GAS9D,IAAN,cAAqC,IAAI;CAKvC,YAAY,GAA0B,GAAsB;EAG1D,AAFA,MAAM,GACN,KAAK,YAAY,GACjB,KAAK,WAAW;CAClB;CAEA,IAAI,GAAe;EACjB,MAAM,IAAI,CAAK;EACf,IAAI;GACF,KAAK,WAAW,IAAI,EAAM,QAAQ,MAAM,EAAE,CAAC;EAE7C,QAAQ;GAEN,KAAK,SAAS,aAAa,UAAU,EAAM,QAAQ,MAAM,EAAE,KAAK,EAAE;EACpE;EACA,OAAO;CACT;CAEA,OAAO,GAAe;EACpB,MAAM,OAAO,CAAK;EAClB,IAAI;GACF,KAAK,WAAW,OAAO,CAAK;EAC9B,QAAQ;GACN,KAAK,SAAS,gBAAgB,UAAU,EAAM,QAAQ,MAAM,EAAE,GAAG;EACnE;EACA,OAAO;CACT;CAEA,QAAQ;EACN,KAAK,IAAM,KAAS,MAAM,KAAK,OAAO,CAAK;CAC7C;AACF;AAEA,EAAuB;AAEvB,SAAS,IAAyB;CAChC,IAAM,IAAkB,YAAY,UAAU;CAC9C,OAAO,eAAe,YAAY,WAAW,mBAAmB,EAC9D,OAAO,SAAU,GAAG,GAAkB;EACpC,IAAM,IAAY,EAAgB,KAAK,IAAI;EAE3C,OADA,OAAO,eAAe,GAAW,UAAU,EAAE,OAAO,IAAI,EAAuB,EAAU,QAAQ,IAAI,EAAE,CAAC,GACjG;CACT,EACF,CAAC;CAED,IAAM,IAAU,QAAQ,UAAU;CAClC,OAAO,eAAe,QAAQ,WAAW,WAAW,EAClD,OAAO,SAAU,GAAc;EAC7B,OAAO,EAAQ,KAAK,MAAM,EAAqB,CAAI,CAAC;CACtD,EACF,CAAC;CAED,IAAM,IAAc,cAAc,UAAU;CAC5C,OAAO,eAAe,cAAc,WAAW,eAAe,EAC5D,OAAO,SAAU,GAAc;EAC7B,EAAY,KAAK,MAAM,EAAqB,CAAI,CAAC;CACnD,EACF,CAAC;AACH;AAEA,SAAS,EAAqB,GAAe;CAGzC,OADG,IAGI,EAAM,QAAQ,gBAAgB,YAAY,IAF1C,EAAM,QAAQ,gBAAgB,aAAa,
|
|
1
|
+
{"version":3,"file":"custom-state-set.js","names":[],"sources":["../../src/polyfills/custom-state-set.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nconst SUPPORTS_CUSTOM_STATES = CSS.supports('selector(:state(test))');\n\n/**\n * CustomStateSet Polyfill for :state() syntax downleveled to legacy :--state syntax (Chromium < v123)\n * https://html.spec.whatwg.org/multipage/custom-elements.html#exposing-custom-element-states\n *\n * https://bugzilla.mozilla.org/show_bug.cgi?id=1588763\n */\n\nclass CustomStateSetPolyfill extends Set {\n // not using native private fields due to terser bug\n private _stateSet: CustomStateSet; // eslint-disable-line no-restricted-syntax\n private _element: HTMLElement; // eslint-disable-line no-restricted-syntax\n\n constructor(stateSet: CustomStateSet, element: HTMLElement) {\n super();\n this._stateSet = stateSet;\n this._element = element;\n }\n\n add(state: string) {\n super.add(state);\n try {\n this._stateSet?.add(state.replace('--', ''));\n // try latest syntax :state()\n } catch {\n // else fallback to legacy syntax [state--*]\n this._element.setAttribute(`state--${state.replace('--', '')}`, '');\n }\n return this;\n }\n\n delete(state: string) {\n super.delete(state);\n try {\n this._stateSet?.delete(state);\n } catch {\n this._element.removeAttribute(`state--${state.replace('--', '')}`);\n }\n return true;\n }\n\n clear() {\n for (const state of this) this.delete(state);\n }\n}\n\ncustomStateSetPolyfill();\n\nfunction customStateSetPolyfill() {\n const attachInternals = HTMLElement.prototype.attachInternals;\n Object.defineProperty(HTMLElement.prototype, 'attachInternals', {\n value: function (..._args: unknown[]) {\n const internals = attachInternals.call(this) as unknown as ElementInternals;\n Object.defineProperty(internals, 'states', { value: new CustomStateSetPolyfill(internals.states, this) });\n return internals;\n }\n });\n\n const matches = Element.prototype.matches;\n Object.defineProperty(Element.prototype, 'matches', {\n value: function (text: string) {\n return matches.call(this, replaceToLegacyState(text));\n }\n });\n\n const replaceSync = CSSStyleSheet.prototype.replaceSync;\n Object.defineProperty(CSSStyleSheet.prototype, 'replaceSync', {\n value: function (text: string) {\n replaceSync.call(this, replaceToLegacyState(text));\n }\n });\n}\n\nfunction replaceToLegacyState(value: string) {\n // if the browser does not support :state(*) selectors replace any CSS state selectors with attribute fallbacks [state-*]\n if (!SUPPORTS_CUSTOM_STATES) {\n return value.replace(/:--([^\\)]+)/g, '[state--$1]').replace(/:state\\(([^\\)]+)\\)/g, '[state--$1]');\n } else {\n return value.replace(/:--([^\\)]+)/g, ':state($1)');\n }\n}\n"],"mappings":";AAGA,IAAM,IAAyB,IAAI,SAAS,wBAAwB,GAS9D,IAAN,cAAqC,IAAI;CAKvC,YAAY,GAA0B,GAAsB;EAG1D,AAFA,MAAM,GACN,KAAK,YAAY,GACjB,KAAK,WAAW;CAClB;CAEA,IAAI,GAAe;EACjB,MAAM,IAAI,CAAK;EACf,IAAI;GACF,KAAK,WAAW,IAAI,EAAM,QAAQ,MAAM,EAAE,CAAC;EAE7C,QAAQ;GAEN,KAAK,SAAS,aAAa,UAAU,EAAM,QAAQ,MAAM,EAAE,KAAK,EAAE;EACpE;EACA,OAAO;CACT;CAEA,OAAO,GAAe;EACpB,MAAM,OAAO,CAAK;EAClB,IAAI;GACF,KAAK,WAAW,OAAO,CAAK;EAC9B,QAAQ;GACN,KAAK,SAAS,gBAAgB,UAAU,EAAM,QAAQ,MAAM,EAAE,GAAG;EACnE;EACA,OAAO;CACT;CAEA,QAAQ;EACN,KAAK,IAAM,KAAS,MAAM,KAAK,OAAO,CAAK;CAC7C;AACF;AAEA,EAAuB;AAEvB,SAAS,IAAyB;CAChC,IAAM,IAAkB,YAAY,UAAU;CAC9C,OAAO,eAAe,YAAY,WAAW,mBAAmB,EAC9D,OAAO,SAAU,GAAG,GAAkB;EACpC,IAAM,IAAY,EAAgB,KAAK,IAAI;EAE3C,OADA,OAAO,eAAe,GAAW,UAAU,EAAE,OAAO,IAAI,EAAuB,EAAU,QAAQ,IAAI,EAAE,CAAC,GACjG;CACT,EACF,CAAC;CAED,IAAM,IAAU,QAAQ,UAAU;CAClC,OAAO,eAAe,QAAQ,WAAW,WAAW,EAClD,OAAO,SAAU,GAAc;EAC7B,OAAO,EAAQ,KAAK,MAAM,EAAqB,CAAI,CAAC;CACtD,EACF,CAAC;CAED,IAAM,IAAc,cAAc,UAAU;CAC5C,OAAO,eAAe,cAAc,WAAW,eAAe,EAC5D,OAAO,SAAU,GAAc;EAC7B,EAAY,KAAK,MAAM,EAAqB,CAAI,CAAC;CACnD,EACF,CAAC;AACH;AAEA,SAAS,EAAqB,GAAe;CAGzC,OADG,IAGI,EAAM,QAAQ,gBAAgB,YAAY,IAF1C,EAAM,QAAQ,gBAAgB,aAAa,CAAC,CAAC,QAAQ,uBAAuB,aAAa;AAIpG"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* - Vitest (happy-dom/js-dom)
|
|
3
|
+
* - Safari
|
|
4
|
+
*
|
|
5
|
+
* Used for Custom Elements Form/A11y APIs
|
|
6
|
+
* https://github.com/whatwg/html/pull/8467
|
|
7
|
+
* https://bugs.webkit.org/show_bug.cgi?id=215911
|
|
8
|
+
* https://bugzilla.mozilla.org/show_bug.cgi?id=1588763
|
|
9
|
+
*/
|
|
10
|
+
import 'construct-style-sheets-polyfill';
|
|
11
|
+
import 'element-internals-polyfill';
|
|
12
|
+
import 'formdata-polyfill';
|
|
13
|
+
import './custom-state-set.js';
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
|
-
import { Icon } from '
|
|
3
|
-
import { Control } from '
|
|
4
|
-
import { Divider } from '
|
|
5
|
-
import { Menu, MenuItem } from '
|
|
6
|
-
import { Switch } from '
|
|
2
|
+
import { Icon } from '@nvidia-elements/core/icon';
|
|
3
|
+
import { Control } from '@nvidia-elements/core/forms';
|
|
4
|
+
import { Divider } from '@nvidia-elements/core/divider';
|
|
5
|
+
import { Menu, MenuItem } from '@nvidia-elements/core/menu';
|
|
6
|
+
import { Switch } from '@nvidia-elements/core/switch';
|
|
7
7
|
export type ColorScheme = 'auto' | 'light' | 'dark' | 'high-contrast';
|
|
8
8
|
export type Scale = 'default' | 'compact' | 'relaxed';
|
|
9
9
|
export type Variant = 'reduced-motion';
|
|
@@ -12,7 +12,7 @@ export interface PreferencesInputValue {
|
|
|
12
12
|
scale?: Scale | string;
|
|
13
13
|
'reduced-motion'?: boolean;
|
|
14
14
|
}
|
|
15
|
-
declare const PreferencesInput_base: import(
|
|
15
|
+
declare const PreferencesInput_base: import("@nvidia-elements/forms/mixins").FormControlMixinReturn<typeof LitElement, PreferencesInputValue>;
|
|
16
16
|
/**
|
|
17
17
|
* @element nve-preferences-input
|
|
18
18
|
* @description A preferences input is a widget for controlling apperance. Stylesheets register to the preferences input by including a css-property, see Standard for an example.
|
|
@@ -37,24 +37,24 @@ export declare class PreferencesInput extends PreferencesInput_base {
|
|
|
37
37
|
/**
|
|
38
38
|
* Enables updating internal string values for internationalization.
|
|
39
39
|
*/
|
|
40
|
-
i18n: Partial<import(
|
|
40
|
+
i18n: Partial<import("@nvidia-elements/core/internal").I18nStrings & {
|
|
41
41
|
__set: boolean;
|
|
42
42
|
}>;
|
|
43
|
-
static styles: import(
|
|
43
|
+
static styles: import("lit").CSSResult[];
|
|
44
44
|
static readonly metadata: {
|
|
45
45
|
tag: string;
|
|
46
46
|
version: string;
|
|
47
47
|
valueSchema: {
|
|
48
|
-
type:
|
|
48
|
+
type: 'object';
|
|
49
49
|
properties: {
|
|
50
50
|
'color-scheme': {
|
|
51
|
-
type:
|
|
51
|
+
type: 'string';
|
|
52
52
|
};
|
|
53
53
|
scale: {
|
|
54
|
-
type:
|
|
54
|
+
type: 'string';
|
|
55
55
|
};
|
|
56
56
|
'reduced-motion': {
|
|
57
|
-
type:
|
|
57
|
+
type: 'boolean';
|
|
58
58
|
};
|
|
59
59
|
};
|
|
60
60
|
};
|
|
@@ -68,7 +68,7 @@ export declare class PreferencesInput extends PreferencesInput_base {
|
|
|
68
68
|
[Switch.metadata.tag]: typeof Switch;
|
|
69
69
|
};
|
|
70
70
|
private activePreferences;
|
|
71
|
-
render(): import(
|
|
71
|
+
render(): import("lit").TemplateResult<1>;
|
|
72
72
|
constructor();
|
|
73
73
|
connectedCallback(): void;
|
|
74
74
|
/** @private */
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { I18nController as e } from "../internal/controllers/i18n.controller.js";
|
|
2
2
|
import { scopedRegistry as t } from "../internal/decorators/scoped-registry.js";
|
|
3
3
|
import { useStyles as n } from "../internal/styles/index.js";
|
|
4
|
-
import
|
|
4
|
+
import r from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
|
|
5
5
|
import { Icon as i } from "../icon/icon2.js";
|
|
6
6
|
import { Control as a } from "../forms/control/control2.js";
|
|
7
7
|
import { Switch as o } from "../switch/switch2.js";
|
|
@@ -43,7 +43,7 @@ var x = class extends g(d) {
|
|
|
43
43
|
static {
|
|
44
44
|
this.metadata = {
|
|
45
45
|
tag: "nve-preferences-input",
|
|
46
|
-
version: "2.0
|
|
46
|
+
version: "2.1.0",
|
|
47
47
|
valueSchema: {
|
|
48
48
|
type: "object",
|
|
49
49
|
properties: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"preferences-input2.js","names":["#setColorScheme","#setScale","#setReducedMotion","#i18nController","#updatePreferences","#update"],"sources":["../../src/preferences-input/preferences-input.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, isServer, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { I18nController, scopedRegistry, useStyles } from '@nvidia-elements/core/internal';\nimport { state } from 'lit/decorators/state.js';\nimport { FormControlMixin } from '@nvidia-elements/forms/mixins';\nimport { type IconName, Icon } from '@nvidia-elements/core/icon';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { Divider } from '@nvidia-elements/core/divider';\nimport { Menu, MenuItem } from '@nvidia-elements/core/menu';\nimport { Switch } from '@nvidia-elements/core/switch';\nimport styles from './preferences-input.css?inline';\n\nexport type ColorScheme = 'auto' | 'light' | 'dark' | 'high-contrast';\nexport type Scale = 'default' | 'compact' | 'relaxed';\nexport type Variant = 'reduced-motion';\n\nconst colorSchemes: ColorScheme[] = ['auto', 'light', 'dark', 'high-contrast'];\nconst scales: Scale[] = ['default', 'compact'];\nconst colorSchemesIcons = {\n auto: 'computer',\n light: 'sun',\n dark: 'moon',\n 'high-contrast': 'circle-half'\n} satisfies Record<ColorScheme, IconName>;\n\nfunction getActivePreferences(element = globalThis.document.documentElement) {\n const computedStyle = getComputedStyle(element);\n\n return {\n light: computedStyle.getPropertyValue('--nve-config-color-scheme-light') === 'true',\n dark: computedStyle.getPropertyValue('--nve-config-color-scheme-dark') === 'true',\n 'high-contrast': computedStyle.getPropertyValue('--nve-config-color-scheme-high-contrast') === 'true',\n compact: computedStyle.getPropertyValue('--nve-config-scale-compact') === 'true',\n 'reduced-motion': computedStyle.getPropertyValue('--nve-config-reduced-motion') === 'true'\n } satisfies Partial<Record<ColorScheme | Scale | Variant, boolean>>;\n}\n\nexport interface PreferencesInputValue {\n 'color-scheme'?: ColorScheme | string;\n scale?: Scale | string;\n 'reduced-motion'?: boolean;\n}\n\n/**\n * @element nve-preferences-input\n * @description A preferences input is a widget for controlling apperance. Stylesheets register to the preferences input by including a css-property, see Standard for an example.\n * @since 1.23.7\n * @entrypoint \\@nvidia-elements/core/preferences-input\n * @event input - Dispatched when the value has changed\n * @event change - Dispatched when the value has changed\n * @cssprop --color\n * @cssprop --width\n * @csspart control - The control wrapper elements that contain the labels and menus\n * @csspart menu - The menu elements that display color scheme and scale options\n * @csspart menu-item - The individual menu item elements for each selectable option\n * @csspart icon - The icon element displayed next to color scheme options\n * @csspart divider - The divider elements that separate preference sections\n * @csspart switch - The switch element for the reduced motion toggle\n *\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/listbox/\n *\n */\n@scopedRegistry()\nexport class PreferencesInput extends FormControlMixin<typeof LitElement, PreferencesInputValue>(LitElement) {\n #i18nController: I18nController<this> = new I18nController<this>(this);\n\n /**\n * Enables updating internal string values for internationalization.\n */\n @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n static styles = useStyles([styles]);\n\n static readonly metadata = {\n tag: 'nve-preferences-input',\n version: '0.0.0',\n valueSchema: {\n type: 'object' as const,\n properties: {\n 'color-scheme': { type: 'string' as const },\n scale: { type: 'string' as const },\n 'reduced-motion': { type: 'boolean' as const }\n }\n }\n };\n\n static elementDefinitions = {\n [Control.metadata.tag]: Control,\n [Divider.metadata.tag]: Divider,\n [Icon.metadata.tag]: Icon,\n [Menu.metadata.tag]: Menu,\n [MenuItem.metadata.tag]: MenuItem,\n [Switch.metadata.tag]: Switch\n };\n\n @state() private activePreferences: ReturnType<typeof getActivePreferences> = {\n light: false,\n dark: false,\n 'high-contrast': false,\n compact: false,\n 'reduced-motion': false\n };\n\n // eslint-disable-next-line max-lines-per-function\n render() {\n return html`\n <div internal-host>\n <nve-control part=\"control\">\n <label>${this.i18n.colorScheme}</label>\n <nve-menu part=\"menu\" nve-control>\n ${colorSchemes.map(\n value => html`\n <nve-menu-item part=\"menu-item\"\n .selected=${this.value?.['color-scheme'] === value}\n .value=${value}\n @click=${() => this.#setColorScheme(value)}\n >\n <nve-icon part=\"icon\" name=${colorSchemesIcons[value]}></nve-icon> ${value}\n </nve-menu-item>\n `\n )}\n </nve-menu>\n </nve-control>\n ${\n this.activePreferences['compact']\n ? html`\n <nve-divider part=\"divider\"></nve-divider>\n <nve-control part=\"control\">\n <label>${this.i18n.scale}</label>\n <nve-menu part=\"menu\" nve-control>\n ${scales.map(\n value => html`\n <nve-menu-item part=\"menu-item\"\n .selected=${this.value?.['scale'] === value}\n .value=${value}\n @click=${() => this.#setScale(value)}\n >\n ${value}\n </nve-menu-item>\n `\n )}\n </nve-menu>\n </nve-control>\n `\n : ''\n }\n ${\n this.activePreferences['reduced-motion']\n ? html`\n <nve-divider part=\"divider\"></nve-divider>\n <nve-switch part=\"switch\">\n <label>${this.i18n.reducedMotion}</label>\n <input\n type=\"checkbox\"\n value=\"reduced-motion\"\n .checked=${this.value?.['reduced-motion']}\n @change=${(e: { target: HTMLInputElement }) => this.#setReducedMotion(e.target.checked)}\n />\n </nve-switch>`\n : ''\n }\n </div>\n `;\n }\n\n constructor() {\n super();\n this.value = {\n 'color-scheme': 'auto',\n 'reduced-motion': false,\n scale: 'default'\n };\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.setAttribute('nve-control', '');\n this.#updatePreferences();\n }\n\n /** @private */\n updateValue(value: PreferencesInputValue) {\n super.updateValue({ ...this.value, ...value });\n this.#updatePreferences();\n }\n\n #updatePreferences() {\n /* istanbul ignore else -- Lit SSR mode is not reachable in browser unit tests. */\n if (!isServer) {\n const preferences = getActivePreferences();\n if (JSON.stringify(this.activePreferences) !== JSON.stringify(preferences)) {\n this.activePreferences = preferences;\n }\n }\n }\n\n #setColorScheme(value: ColorScheme) {\n this.value = { ...this.value, 'color-scheme': value };\n this.#update();\n }\n\n #setScale(value: Scale) {\n this.value = { ...this.value, scale: value };\n this.#update();\n }\n\n #setReducedMotion(value: boolean) {\n this.value = { ...this.value, 'reduced-motion': value };\n this.#update();\n }\n\n #update() {\n this.dispatchInputEvent();\n this.dispatchChangeEvent();\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"preferences-input2.js","names":["#setColorScheme","#setScale","#setReducedMotion","#i18nController","#updatePreferences","#update"],"sources":["../../src/preferences-input/preferences-input.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, isServer, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { I18nController, scopedRegistry, useStyles } from '@nvidia-elements/core/internal';\nimport { state } from 'lit/decorators/state.js';\nimport { FormControlMixin } from '@nvidia-elements/forms/mixins';\nimport { type IconName, Icon } from '@nvidia-elements/core/icon';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { Divider } from '@nvidia-elements/core/divider';\nimport { Menu, MenuItem } from '@nvidia-elements/core/menu';\nimport { Switch } from '@nvidia-elements/core/switch';\nimport styles from './preferences-input.css?inline';\n\nexport type ColorScheme = 'auto' | 'light' | 'dark' | 'high-contrast';\nexport type Scale = 'default' | 'compact' | 'relaxed';\nexport type Variant = 'reduced-motion';\n\nconst colorSchemes: ColorScheme[] = ['auto', 'light', 'dark', 'high-contrast'];\nconst scales: Scale[] = ['default', 'compact'];\nconst colorSchemesIcons = {\n auto: 'computer',\n light: 'sun',\n dark: 'moon',\n 'high-contrast': 'circle-half'\n} satisfies Record<ColorScheme, IconName>;\n\nfunction getActivePreferences(element = globalThis.document.documentElement) {\n const computedStyle = getComputedStyle(element);\n\n return {\n light: computedStyle.getPropertyValue('--nve-config-color-scheme-light') === 'true',\n dark: computedStyle.getPropertyValue('--nve-config-color-scheme-dark') === 'true',\n 'high-contrast': computedStyle.getPropertyValue('--nve-config-color-scheme-high-contrast') === 'true',\n compact: computedStyle.getPropertyValue('--nve-config-scale-compact') === 'true',\n 'reduced-motion': computedStyle.getPropertyValue('--nve-config-reduced-motion') === 'true'\n } satisfies Partial<Record<ColorScheme | Scale | Variant, boolean>>;\n}\n\nexport interface PreferencesInputValue {\n 'color-scheme'?: ColorScheme | string;\n scale?: Scale | string;\n 'reduced-motion'?: boolean;\n}\n\n/**\n * @element nve-preferences-input\n * @description A preferences input is a widget for controlling apperance. Stylesheets register to the preferences input by including a css-property, see Standard for an example.\n * @since 1.23.7\n * @entrypoint \\@nvidia-elements/core/preferences-input\n * @event input - Dispatched when the value has changed\n * @event change - Dispatched when the value has changed\n * @cssprop --color\n * @cssprop --width\n * @csspart control - The control wrapper elements that contain the labels and menus\n * @csspart menu - The menu elements that display color scheme and scale options\n * @csspart menu-item - The individual menu item elements for each selectable option\n * @csspart icon - The icon element displayed next to color scheme options\n * @csspart divider - The divider elements that separate preference sections\n * @csspart switch - The switch element for the reduced motion toggle\n *\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/listbox/\n *\n */\n@scopedRegistry()\nexport class PreferencesInput extends FormControlMixin<typeof LitElement, PreferencesInputValue>(LitElement) {\n #i18nController: I18nController<this> = new I18nController<this>(this);\n\n /**\n * Enables updating internal string values for internationalization.\n */\n @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n static styles = useStyles([styles]);\n\n static readonly metadata = {\n tag: 'nve-preferences-input',\n version: '0.0.0',\n valueSchema: {\n type: 'object' as const,\n properties: {\n 'color-scheme': { type: 'string' as const },\n scale: { type: 'string' as const },\n 'reduced-motion': { type: 'boolean' as const }\n }\n }\n };\n\n static elementDefinitions = {\n [Control.metadata.tag]: Control,\n [Divider.metadata.tag]: Divider,\n [Icon.metadata.tag]: Icon,\n [Menu.metadata.tag]: Menu,\n [MenuItem.metadata.tag]: MenuItem,\n [Switch.metadata.tag]: Switch\n };\n\n @state() private activePreferences: ReturnType<typeof getActivePreferences> = {\n light: false,\n dark: false,\n 'high-contrast': false,\n compact: false,\n 'reduced-motion': false\n };\n\n // eslint-disable-next-line max-lines-per-function\n render() {\n return html`\n <div internal-host>\n <nve-control part=\"control\">\n <label>${this.i18n.colorScheme}</label>\n <nve-menu part=\"menu\" nve-control>\n ${colorSchemes.map(\n value => html`\n <nve-menu-item part=\"menu-item\"\n .selected=${this.value?.['color-scheme'] === value}\n .value=${value}\n @click=${() => this.#setColorScheme(value)}\n >\n <nve-icon part=\"icon\" name=${colorSchemesIcons[value]}></nve-icon> ${value}\n </nve-menu-item>\n `\n )}\n </nve-menu>\n </nve-control>\n ${\n this.activePreferences['compact']\n ? html`\n <nve-divider part=\"divider\"></nve-divider>\n <nve-control part=\"control\">\n <label>${this.i18n.scale}</label>\n <nve-menu part=\"menu\" nve-control>\n ${scales.map(\n value => html`\n <nve-menu-item part=\"menu-item\"\n .selected=${this.value?.['scale'] === value}\n .value=${value}\n @click=${() => this.#setScale(value)}\n >\n ${value}\n </nve-menu-item>\n `\n )}\n </nve-menu>\n </nve-control>\n `\n : ''\n }\n ${\n this.activePreferences['reduced-motion']\n ? html`\n <nve-divider part=\"divider\"></nve-divider>\n <nve-switch part=\"switch\">\n <label>${this.i18n.reducedMotion}</label>\n <input\n type=\"checkbox\"\n value=\"reduced-motion\"\n .checked=${this.value?.['reduced-motion']}\n @change=${(e: { target: HTMLInputElement }) => this.#setReducedMotion(e.target.checked)}\n />\n </nve-switch>`\n : ''\n }\n </div>\n `;\n }\n\n constructor() {\n super();\n this.value = {\n 'color-scheme': 'auto',\n 'reduced-motion': false,\n scale: 'default'\n };\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.setAttribute('nve-control', '');\n this.#updatePreferences();\n }\n\n /** @private */\n updateValue(value: PreferencesInputValue) {\n super.updateValue({ ...this.value, ...value });\n this.#updatePreferences();\n }\n\n #updatePreferences() {\n /* istanbul ignore else -- Lit SSR mode is not reachable in browser unit tests. */\n if (!isServer) {\n const preferences = getActivePreferences();\n if (JSON.stringify(this.activePreferences) !== JSON.stringify(preferences)) {\n this.activePreferences = preferences;\n }\n }\n }\n\n #setColorScheme(value: ColorScheme) {\n this.value = { ...this.value, 'color-scheme': value };\n this.#update();\n }\n\n #setScale(value: Scale) {\n this.value = { ...this.value, scale: value };\n this.#update();\n }\n\n #setReducedMotion(value: boolean) {\n this.value = { ...this.value, 'reduced-motion': value };\n this.#update();\n }\n\n #update() {\n this.dispatchInputEvent();\n this.dispatchChangeEvent();\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
|
-
import { SupportStatus } from '
|
|
2
|
+
import type { SupportStatus } from '@nvidia-elements/core/internal';
|
|
3
3
|
/**
|
|
4
4
|
* @element nve-progress-bar
|
|
5
5
|
* @description A progress bar is a visual indicator of the status of a running task. Under the hood, the component uses the native HTML `progress` element to achieve proper a11y concerns.
|
|
@@ -13,7 +13,7 @@ import { SupportStatus } from '../internal';
|
|
|
13
13
|
* @aria https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/progressbar_role
|
|
14
14
|
*/
|
|
15
15
|
export declare class ProgressBar extends LitElement {
|
|
16
|
-
static styles: import(
|
|
16
|
+
static styles: import("lit").CSSResult[];
|
|
17
17
|
static readonly metadata: {
|
|
18
18
|
tag: string;
|
|
19
19
|
version: string;
|
|
@@ -24,5 +24,5 @@ export declare class ProgressBar extends LitElement {
|
|
|
24
24
|
max?: number | undefined;
|
|
25
25
|
/** Defines visual treatment to represent a ongoing task or support status. */
|
|
26
26
|
status: SupportStatus;
|
|
27
|
-
render(): import(
|
|
27
|
+
render(): import("lit").TemplateResult<1>;
|
|
28
28
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { scopedRegistry as e } from "../internal/decorators/scoped-registry.js";
|
|
2
2
|
import { useStyles as t } from "../internal/styles/index.js";
|
|
3
|
-
import
|
|
3
|
+
import n from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
|
|
4
4
|
import r from "./progress-bar.js";
|
|
5
5
|
import { LitElement as i, html as a } from "lit";
|
|
6
6
|
import { property as o } from "lit/decorators/property.js";
|
|
@@ -16,7 +16,7 @@ var c = class extends i {
|
|
|
16
16
|
static {
|
|
17
17
|
this.metadata = {
|
|
18
18
|
tag: "nve-progress-bar",
|
|
19
|
-
version: "2.0
|
|
19
|
+
version: "2.1.0"
|
|
20
20
|
};
|
|
21
21
|
}
|
|
22
22
|
render() {
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import { PropertyValues
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
1
|
+
import type { PropertyValues } from 'lit';
|
|
2
|
+
import { LitElement } from 'lit';
|
|
3
|
+
import type { Size, SupportStatus } from '@nvidia-elements/core/internal';
|
|
4
|
+
import { Icon } from '@nvidia-elements/core/icon';
|
|
4
5
|
/**
|
|
5
6
|
* @element nve-progress-ring
|
|
6
7
|
* @description The `progress-ring` component shows the status of a pending task. It also serves the basis of the page loading element.
|
|
@@ -20,7 +21,7 @@ import { Icon } from '../icon';
|
|
|
20
21
|
*/
|
|
21
22
|
export declare class ProgressRing extends LitElement {
|
|
22
23
|
#private;
|
|
23
|
-
static styles: import(
|
|
24
|
+
static styles: import("lit").CSSResult[];
|
|
24
25
|
static readonly metadata: {
|
|
25
26
|
tag: string;
|
|
26
27
|
version: string;
|
|
@@ -39,10 +40,10 @@ export declare class ProgressRing extends LitElement {
|
|
|
39
40
|
/** T-shirt `size` of the progress indicator, used to scale the ring. */
|
|
40
41
|
size?: Size | 'xxs' | 'xs' | 'xl';
|
|
41
42
|
/** Enables updating internal string values for internationalization. */
|
|
42
|
-
i18n: Partial<import(
|
|
43
|
+
i18n: Partial<import("@nvidia-elements/core/internal").I18nStrings & {
|
|
43
44
|
__set: boolean;
|
|
44
45
|
}>;
|
|
45
|
-
render(): import(
|
|
46
|
+
render(): import("lit").TemplateResult<1>;
|
|
46
47
|
connectedCallback(): void;
|
|
47
48
|
updated(props: PropertyValues<this>): void;
|
|
48
49
|
}
|