@nvidia-elements/core 0.0.7 → 0.0.8
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 +18 -16
- package/README.md +1 -1
- package/dist/accordion/accordion-group.js.map +1 -1
- package/dist/accordion/accordion.js.map +1 -1
- package/dist/accordion/accordion2.js +4 -4
- package/dist/alert/alert-group.js.map +1 -1
- package/dist/alert/alert-group2.js +1 -1
- package/dist/alert/alert-group2.js.map +1 -1
- package/dist/alert/alert.global.js.map +1 -1
- package/dist/alert/alert.js.map +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/badge.js.map +1 -1
- package/dist/badge/badge2.js +2 -2
- package/dist/badge/badge2.js.map +1 -1
- package/dist/breadcrumb/breadcrumb.js.map +1 -1
- package/dist/breadcrumb/breadcrumb2.js +2 -2
- package/dist/breadcrumb/breadcrumb2.js.map +1 -1
- package/dist/bundles/index.js +3 -3
- package/dist/button/button.js.map +1 -1
- package/dist/button/button2.js +1 -1
- package/dist/button-group/button-group.global.js.map +1 -1
- package/dist/button-group/button-group.js +1 -1
- package/dist/button-group/button-group.js.map +1 -1
- package/dist/button-group/button-group2.js +3 -3
- package/dist/button-group/button-group2.js.map +1 -1
- package/dist/card/card-header.js.map +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.map +1 -1
- package/dist/checkbox/checkbox2.js +1 -1
- package/dist/color/color.global.js.map +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.json +1 -23
- package/dist/data.snippets.json +42 -42
- 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/dot.js.map +1 -1
- package/dist/dot/dot2.js +1 -1
- package/dist/drawer/drawer-content.js.map +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/dropdown.js.map +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/dropzone/dropzone2.js.map +1 -1
- package/dist/file/file.global.js.map +1 -1
- package/dist/file/file2.js +1 -1
- package/dist/format-datetime/format-datetime2.js +1 -1
- package/dist/format-relative-time/format-relative-time2.js +1 -1
- package/dist/forms/control/control.js.map +1 -1
- package/dist/forms/control/control2.js +2 -2
- package/dist/forms/control/control2.js.map +1 -1
- package/dist/forms/control-group/control-group.js.map +1 -1
- package/dist/forms/control-group/control-group2.js +23 -24
- package/dist/forms/control-group/control-group2.js.map +1 -1
- package/dist/forms/control-message/control-message2.js +1 -1
- package/dist/forms/utils/states.d.ts +1 -1
- package/dist/forms/utils/states.js +25 -25
- package/dist/forms/utils/states.js.map +1 -1
- package/dist/grid/cell/cell2.js +1 -1
- package/dist/grid/column/column.js.map +1 -1
- package/dist/grid/column/column2.js +23 -23
- package/dist/grid/column/column2.js.map +1 -1
- package/dist/grid/define.js.map +1 -1
- package/dist/grid/footer/footer.js.map +1 -1
- package/dist/grid/footer/footer2.js +1 -1
- package/dist/grid/grid.global.js.map +1 -1
- package/dist/grid/grid.js.map +1 -1
- package/dist/grid/grid2.js +31 -31
- package/dist/grid/grid2.js.map +1 -1
- package/dist/grid/header/header2.js +24 -25
- package/dist/grid/header/header2.js.map +1 -1
- package/dist/grid/placeholder/placeholder2.js +1 -1
- package/dist/grid/row/row.js.map +1 -1
- package/dist/grid/row/row2.js +1 -1
- package/dist/icon/define.js.map +1 -1
- package/dist/icon/icon.js.map +1 -1
- package/dist/icon/icon2.js +2 -2
- package/dist/icon-button/icon-button.js.map +1 -1
- package/dist/icon-button/icon-button2.js +1 -1
- package/dist/index.js +1 -1
- package/dist/input/input-group.global.js.map +1 -1
- package/dist/input/input-group.js.map +1 -1
- package/dist/input/input-group2.js +1 -1
- package/dist/input/input.js.map +1 -1
- package/dist/input/input2.js +1 -1
- package/dist/internal/index.js +40 -40
- package/dist/internal/services/global.service.js +1 -1
- package/dist/internal/utils/dom.d.ts +0 -2
- package/dist/internal/utils/dom.js +12 -15
- package/dist/internal/utils/dom.js.map +1 -1
- package/dist/logo/logo.js.map +1 -1
- package/dist/logo/logo2.js +1 -1
- package/dist/menu/menu-item.js.map +1 -1
- package/dist/menu/menu-item2.js +1 -1
- package/dist/menu/menu.global.js.map +1 -1
- package/dist/menu/menu2.js +1 -1
- package/dist/menu/menu2.js.map +1 -1
- package/dist/month/month2.js +1 -1
- package/dist/notification/notification-group2.js +1 -1
- package/dist/notification/notification.js.map +1 -1
- package/dist/notification/notification2.js +1 -1
- package/dist/page/page-panel/page-panel-content.js.map +1 -1
- package/dist/page/page-panel/page-panel-content2.js +1 -1
- package/dist/page/page-panel/page-panel-footer2.js +1 -1
- package/dist/page/page-panel/page-panel-header2.js +1 -1
- package/dist/page/page-panel/page-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/panel-content.js.map +1 -1
- package/dist/panel/panel-footer.js.map +1 -1
- package/dist/panel/panel2.js +4 -4
- package/dist/password/password2.js +1 -1
- package/dist/preferences-input/preferences-input2.js +1 -1
- package/dist/progress-bar/progress-bar2.js +1 -1
- package/dist/progress-ring/progress-ring.js.map +1 -1
- package/dist/progress-ring/progress-ring2.js +1 -1
- package/dist/progress-ring/progress-ring2.js.map +1 -1
- package/dist/progressive-filter-chip/progressive-filter-chip.global.js.map +1 -1
- package/dist/progressive-filter-chip/progressive-filter-chip.js.map +1 -1
- 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/pulse2.js +1 -1
- package/dist/radio/radio-group2.js +1 -1
- package/dist/radio/radio2.js +1 -1
- package/dist/range/range.global.js.map +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/steps.js.map +1 -1
- package/dist/steps/steps2.js +4 -4
- package/dist/steps/steps2.js.map +1 -1
- 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.js.map +1 -1
- package/dist/tabs/tabs.global.js.map +1 -1
- package/dist/tabs/tabs.js.map +1 -1
- package/dist/tabs/tabs2.js +3 -3
- package/dist/tabs/tabs2.js.map +1 -1
- package/dist/tag/tag.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/toast.js +1 -1
- package/dist/toast/toast.js.map +1 -1
- package/dist/toast/toast2.js +1 -1
- package/dist/toggletip/toggletip-footer2.js +1 -1
- package/dist/toggletip/toggletip-header.js.map +1 -1
- package/dist/toggletip/toggletip-header2.js +1 -1
- package/dist/toggletip/toggletip.js.map +1 -1
- package/dist/toggletip/toggletip2.js +1 -1
- package/dist/toolbar/toolbar.js.map +1 -1
- package/dist/toolbar/toolbar2.js +2 -2
- package/dist/toolbar/toolbar2.js.map +1 -1
- package/dist/tooltip/tooltip.js.map +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 +5 -5
package/dist/drawer/drawer2.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown.js","names":[],"sources":["../../src/dropdown/dropdown.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n --nve-sys-interaction-background: var(--nve-sys-interaction-background-300);\n --nve-sys-interaction-field-background: var(--nve-sys-interaction-background-300);\n --nve-sys-layer-popover-arrow-padding: 0px;\n --nve-sys-layer-popover-arrow-offset: 0px;\n --nve-sys-layer-popover-offset: 0px;\n --arrow-transform: translate(0, -2px) rotate(-45deg);\n --border: var(--nve-ref-border-width-sm) solid var(--nve-ref-border-color-muted);\n --border-radius: var(--nve-ref-border-radius-md);\n --background: var(--nve-sys-layer-overlay-background);\n --color: var(--nve-sys-layer-overlay-color);\n --padding: var(--nve-ref-size-400);\n --box-shadow: var(--nve-ref-shadow-400);\n --width: fit-content;\n --min-width: fit-content;\n --gap: var(--nve-ref-space-sm);\n --_divider-padding: var(--padding);\n}\n\n[internal-host] {\n padding: var(--padding);\n border-radius: var(--border-radius);\n border: var(--border);\n background: var(--background);\n color: var(--color);\n box-shadow: var(--box-shadow);\n gap: var(--nve-ref-space-sm);\n width: var(--width);\n min-width: var(--min-width);\n outline: 0;\n}\n\n[internal-host]::backdrop {\n background: transparent;\n}\n\n.header {\n display: flex;\n gap: var(--gap);\n}\n\n.header:has(nve-icon-button) {\n min-height: var(--nve-ref-size-300);\n}\n\nnve-icon-button {\n position: absolute;\n top: var(--nve-ref-size-200);\n right: var(--nve-ref-size-200);\n z-index: 99;\n}\n\n.arrow {\n width: var(--nve-ref-size-400);\n height: var(--nve-ref-size-400);\n background: var(--background);\n transform: var(--arrow-transform);\n border-top-left-radius: var(--nve-ref-border-radius-xs);\n position: absolute;\n border-left: var(--border);\n border-top: var(--border);\n}\n\n:host([position*='top']) {\n --arrow-transform: translate(0, -2px) rotate(-45deg);\n}\n\n:host([position*='right']) {\n --arrow-transform: translate(2px, 0) rotate(45deg);\n}\n\n:host([position*='bottom']) {\n --arrow-transform: translate(0, -1px) rotate(45deg);\n}\n\n:host([position*='left']) {\n --arrow-transform: translate(-2px, 0) rotate(45deg);\n}\n\n::slotted(nve-menu)
|
|
1
|
+
{"version":3,"file":"dropdown.js","names":[],"sources":["../../src/dropdown/dropdown.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n --nve-sys-interaction-background: var(--nve-sys-interaction-background-300);\n --nve-sys-interaction-field-background: var(--nve-sys-interaction-background-300);\n --nve-sys-layer-popover-arrow-padding: 0px;\n --nve-sys-layer-popover-arrow-offset: 0px;\n --nve-sys-layer-popover-offset: 0px;\n --arrow-transform: translate(0, -2px) rotate(-45deg);\n --border: var(--nve-ref-border-width-sm) solid var(--nve-ref-border-color-muted);\n --border-radius: var(--nve-ref-border-radius-md);\n --background: var(--nve-sys-layer-overlay-background);\n --color: var(--nve-sys-layer-overlay-color);\n --padding: var(--nve-ref-size-400);\n --box-shadow: var(--nve-ref-shadow-400);\n --width: fit-content;\n --min-width: fit-content;\n --gap: var(--nve-ref-space-sm);\n --_divider-padding: var(--padding);\n}\n\n[internal-host] {\n padding: var(--padding);\n border-radius: var(--border-radius);\n border: var(--border);\n background: var(--background);\n color: var(--color);\n box-shadow: var(--box-shadow);\n gap: var(--nve-ref-space-sm);\n width: var(--width);\n min-width: var(--min-width);\n outline: 0;\n}\n\n[internal-host]::backdrop {\n background: transparent;\n}\n\n.header {\n display: flex;\n gap: var(--gap);\n}\n\n.header:has(nve-icon-button) {\n min-height: var(--nve-ref-size-300);\n}\n\nnve-icon-button {\n position: absolute;\n top: var(--nve-ref-size-200);\n right: var(--nve-ref-size-200);\n z-index: 99;\n}\n\n.arrow {\n width: var(--nve-ref-size-400);\n height: var(--nve-ref-size-400);\n background: var(--background);\n transform: var(--arrow-transform);\n border-top-left-radius: var(--nve-ref-border-radius-xs);\n position: absolute;\n border-left: var(--border);\n border-top: var(--border);\n}\n\n:host([position*='top']) {\n --arrow-transform: translate(0, -2px) rotate(-45deg);\n}\n\n:host([position*='right']) {\n --arrow-transform: translate(2px, 0) rotate(45deg);\n}\n\n:host([position*='bottom']) {\n --arrow-transform: translate(0, -1px) rotate(45deg);\n}\n\n:host([position*='left']) {\n --arrow-transform: translate(-2px, 0) rotate(45deg);\n}\n\n::slotted(nve-menu) {\n --width: 100%;\n}\n\n::slotted(nve-divider) {\n margin: 0 calc(-1 * var(--_divider-padding));\n}\n"],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropzone2.js","names":["#i18nController","#preventDefaults","#toggleHighlighted","#addFiles","#handleClick","#handleDragEnter","#handleDragOver","#handleDragLeave","#handleDrop","#removeEmptyNodes","#formatFileTypeSpecifiers","#handleFileInputChange"],"sources":["../../src/dropzone/dropzone.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { query } from 'lit/decorators/query.js';\nimport {
|
|
1
|
+
{"version":3,"file":"dropzone2.js","names":["#i18nController","#preventDefaults","#toggleHighlighted","#addFiles","#handleClick","#handleDragEnter","#handleDragOver","#handleDragLeave","#handleDrop","#removeEmptyNodes","#formatFileTypeSpecifiers","#handleFileInputChange"],"sources":["../../src/dropzone/dropzone.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { query } from 'lit/decorators/query.js';\nimport {\n formatFileSize,\n useStyles,\n removeEmptyTextNode,\n I18nController,\n scopedRegistry\n} from '@nvidia-elements/core/internal';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport styles from './dropzone.css?inline';\nimport { FormControlMixin } from '@nvidia-elements/forms/mixin';\nimport { fileTypeValidator, fileSizeValidator, getFileTypeSpecifiers } from './dropzone.util';\n\n/**\n * @element nve-dropzone\n * @description A dropzone form control that enables users to drag and drop files onto it.\n * @since 1.29.0\n * @entrypoint \\@nvidia-elements/core/dropzone\n * @event change - Dispatched when the value has changed (files located in event.target)\n * @slot - use only when custom messaging requires it\n * @cssprop --background\n * @cssprop --border-color\n * @cssprop --border-radius\n * @cssprop --padding\n * @cssprop --min-height\n * @cssprop --color\n * @slot icon - default slot for icon\n * @slot content - default slot for content\n * @csspart icon - The upload icon element\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file\n * @stable false\n */\n@scopedRegistry()\nexport class Dropzone extends FormControlMixin<typeof LitElement, File[]>(LitElement) {\n @property()\n accept: string = `image/gif, image/jpeg, image/png, image/svg+xml`;\n\n @property({ attribute: 'max-file-size', type: Number })\n maxFileSize: number = 2 * 1024 ** 2;\n\n #i18nController: I18nController<this> = new I18nController<this>(this);\n\n /**\n * Enables internal string values to update for internationalization.\n */\n @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n @query('#dropzone-input')\n private fileInput: HTMLInputElement;\n\n static styles = useStyles([styles]);\n\n static readonly metadata = {\n tag: 'nve-dropzone',\n version: '0.0.0',\n validators: [fileTypeValidator, fileSizeValidator],\n valueSchema: {\n type: 'array' as const,\n items: {\n type: 'object' as const,\n properties: {\n name: { type: 'string' as const },\n size: { type: 'number' as const },\n type: { type: 'string' as const }\n }\n }\n }\n };\n\n static elementDefinitions = {\n [Icon.metadata.tag]: Icon\n };\n\n formResetCallback() {\n this.value = [];\n this.requestUpdate();\n }\n\n constructor() {\n super();\n this.value = [];\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n this.setAttribute('nve-control', '');\n globalThis.document.addEventListener('dragover', this.#preventDefaults);\n globalThis.document.addEventListener('drop', this.#preventDefaults);\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback();\n globalThis.document.removeEventListener('dragover', this.#preventDefaults);\n globalThis.document.removeEventListener('drop', this.#preventDefaults);\n }\n\n #preventDefaults(event: Event) {\n event.preventDefault();\n event.stopPropagation();\n }\n\n #handleClick() {\n this.fileInput.click();\n }\n\n #handleDragEnter(event: DragEvent) {\n this.#preventDefaults(event);\n this.#toggleHighlighted(true);\n }\n\n #handleDragOver(event: DragEvent) {\n this.#preventDefaults(event);\n this.#toggleHighlighted(true);\n }\n\n #handleDragLeave(event: DragEvent) {\n this.#preventDefaults(event);\n this.#toggleHighlighted(false);\n }\n\n #handleDrop(event: DragEvent) {\n this.#preventDefaults(event);\n this.#toggleHighlighted(false);\n\n const files = Array.from(event.dataTransfer!.files);\n this.#addFiles(files);\n }\n\n #handleFileInputChange(event: Event) {\n this.#preventDefaults(event);\n\n const files = Array.from(this.fileInput.files!);\n this.#addFiles(files);\n\n this.fileInput.value = '';\n }\n\n #addFiles(files: File[]) {\n this.value = [...(this.value ?? []), ...files];\n this.dispatchChangeEvent();\n }\n\n #formatFileTypeSpecifiers(acceptTypes: string) {\n const types = getFileTypeSpecifiers(acceptTypes);\n\n if (types.length === 1) {\n return types[0]!.toUpperCase();\n }\n\n const lastType = types.pop();\n return `${types.join(', ').toUpperCase()} or ${lastType!.toUpperCase()}`;\n }\n\n #toggleHighlighted(highlighted: boolean) {\n this.toggleAttribute('highlighted', highlighted);\n }\n\n #removeEmptyNodes(e: Event) {\n (e.target as HTMLSlotElement).assignedNodes().forEach((node: Node) => removeEmptyTextNode(node));\n }\n\n render() {\n return html`<div internal-host>\n <div class=\"container\"\n @click=${this.#handleClick} \n @dragenter=${this.#handleDragEnter}\n @dragover=${this.#handleDragOver}\n @dragleave=${this.#handleDragLeave}\n @drop=${this.#handleDrop}>\n <svg class=\"border\" width=\"100%\" height=\"100%\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect width=\"100%\" height=\"100%\" fill=\"none\" rx=\"4\" ry=\"4\" stroke=\"currentColor\" stroke-width=\"2\" stroke-dasharray=\"6,6\" stroke-dashoffset=\"0\" stroke-linecap=\"square\" />\n </svg>\n <slot name=\"icon\"><nve-icon part=\"icon\" class=\"icon\" name=\"upload\"></nve-icon></slot>\n <slot @slotchange=${this.#removeEmptyNodes}>\n <div class=\"text-center\">\n <div class=\"text-bold\">${this.i18n.dragAndDrop} ${this.i18n.files} ${this.i18n.or} <span class=\"text-emphasized\">${this.i18n.browseFiles}</span></div>\n <div class=\"text-muted\">${this.#formatFileTypeSpecifiers(this.accept)} — ${this.i18n.maxFileSize} ${formatFileSize(this.maxFileSize)}</div>\n </div>\n </slot>\n <input id=\"dropzone-input\" type=\"file\" accept=${this.accept} @change=${this.#handleFileInputChange} multiple hidden></input>\n </div>\n </div>`;\n }\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"file.global.js","names":[],"sources":["../../src/file/file.global.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\nnve-file > input
|
|
1
|
+
{"version":3,"file":"file.global.js","names":[],"sources":["../../src/file/file.global.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\nnve-file > input {\n color: var(--color);\n}\n\nnve-file > input::file-selector-button {\n background: var(--background);\n padding: var(--padding);\n height: var(--height);\n width: var(--width);\n border-radius: var(--border-radius);\n border: var(--border);\n text-decoration: var(--text-decoration);\n font-weight: var(--font-weight);\n font-size: var(--font-size);\n cursor: var(--cursor);\n gap: var(--gap);\n margin-inline-end: var(--nve-ref-space-sm);\n display: inline-flex;\n place-items: center;\n appearance: none;\n line-height: 1.2em;\n}\n\nnve-file > input::file-selector-button:hover {\n --color: var(--nve-sys-interaction-hover-color);\n --background: var(--nve-sys-interaction-background);\n}\n\nnve-file > input::file-selector-button:active {\n --color: var(--nve-sys-interaction-active-color);\n --background: var(--nve-sys-interaction-background);\n}\n"],"mappings":""}
|
package/dist/file/file2.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"control.js","names":[],"sources":["../../../src/forms/control/control.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n --cursor: pointer;\n --accent-color: var(--nve-sys-accent-secondary-background);\n --color: var(--nve-sys-interaction-field-color);\n --label-color: var(--nve-sys-interaction-field-color);\n --label-text-transform: capitalize;\n --label-font-weight: var(--nve-ref-font-weight-medium);\n --label-font-size: var(--nve-ref-font-size-100);\n --control-width: 100%;\n --control-height: var(--nve-sys-interaction-field-height);\n --_label-width: var(--label-width, 180px);\n --nve-sys-interaction-state-base: var(--background, var(--nve-sys-layer-canvas-background));\n --opacity: 1;\n --filter: none;\n contain: content;\n}\n\n:host([nve-control='inline']) {\n --control-height: auto;\n}\n\n::slotted(*) {\n color-scheme: var(--nve-sys-color-scheme);\n font-family: inherit;\n}\n\n::slotted(label) {\n font-weight: var(--label-font-weight) !important;\n font-size: var(--label-font-size) !important;\n color: var(--label-color) !important;\n cursor: var(--cursor) !important;\n text-transform: var(--label-text-transform) !important;\n display: inline-block !important;\n line-height: 1em !important;\n align-self: center !important;\n}\n\n::slotted(label::first-letter) {\n text-transform: capitalize;\n}\n\n:host(:state(disabled)),\n:host(:state(disabled)) ::slotted(nve-control-message:not([status]))
|
|
1
|
+
{"version":3,"file":"control.js","names":[],"sources":["../../../src/forms/control/control.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n --cursor: pointer;\n --accent-color: var(--nve-sys-accent-secondary-background);\n --color: var(--nve-sys-interaction-field-color);\n --label-color: var(--nve-sys-interaction-field-color);\n --label-text-transform: capitalize;\n --label-font-weight: var(--nve-ref-font-weight-medium);\n --label-font-size: var(--nve-ref-font-size-100);\n --control-width: 100%;\n --control-height: var(--nve-sys-interaction-field-height);\n --_label-width: var(--label-width, 180px);\n --nve-sys-interaction-state-base: var(--background, var(--nve-sys-layer-canvas-background));\n --opacity: 1;\n --filter: none;\n contain: content;\n}\n\n:host([nve-control='inline']) {\n --control-height: auto;\n}\n\n::slotted(*) {\n color-scheme: var(--nve-sys-color-scheme);\n font-family: inherit;\n}\n\n::slotted(label) {\n font-weight: var(--label-font-weight) !important;\n font-size: var(--label-font-size) !important;\n color: var(--label-color) !important;\n cursor: var(--cursor) !important;\n text-transform: var(--label-text-transform) !important;\n display: inline-block !important;\n line-height: 1em !important;\n align-self: center !important;\n}\n\n::slotted(label::first-letter) {\n text-transform: capitalize;\n}\n\n:host(:state(disabled)),\n:host(:state(disabled)) ::slotted(nve-control-message:not([status])) {\n --cursor: not-allowed;\n}\n\n:host(:state(disabled)) {\n --opacity: var(--nve-ref-opacity-500);\n}\n\n:host(:state(invalid)) ::slotted(nve-control-message:not([error], [status])) {\n display: none;\n}\n\n:host([fit-content]) {\n --control-width: fit-content;\n --label-width: fit-content;\n --width: fit-content;\n}\n\n:host([nve-control]) ::slotted(input:focus),\n:host([nve-control]) ::slotted(select:focus),\n:host([nve-control]) ::slotted(textarea:focus),\n:host([nve-control]:focus-within) [internal-host]:has(nve-icon-button:focus) [input],\n[internal-host]:has(nve-icon-button) {\n outline: 0 !important;\n}\n\n@container style(--control-type: custom) {\n [input] {\n outline: 0 !important;\n }\n}\n\n::slotted(nve-button[nve-control]) {\n width: 100%;\n}\n\n[input] {\n cursor: var(--cursor);\n min-height: var(--control-height);\n opacity: var(--opacity);\n filter: var(--filter);\n grid-area: input;\n display: flex;\n line-height: 1;\n}\n\n:host([nve-control='inline']) {\n [internal-host] {\n min-height: var(--control-height);\n }\n\n [input] {\n min-height: min-content;\n }\n}\n\nslot {\n line-height: 1;\n width: 100%;\n}\n\nslot[name='label'] {\n grid-area: label;\n display: inline-flex;\n align-self: center;\n}\n\nslot[name='messages'] {\n grid-area: messages;\n display: inline-flex;\n}\n\n[name='messages']:not(:has-slotted),\n[name='label']:not(:has-slotted) {\n display: none !important;\n}\n\n[internal-host] {\n display: grid;\n width: 100%;\n gap: var(--nve-ref-space-xs);\n grid-template-columns: 1fr 1fr 1fr;\n grid-template-rows: auto;\n grid-template-areas: 'input input input';\n}\n\n:host([nve-control='inline']) [internal-host] {\n align-items: center;\n grid-template-columns: auto 1fr 1fr;\n\n slot[name='label'],\n slot[name='messages'] {\n align-items: center;\n }\n\n & ::slotted(label) {\n font-weight: var(--nve-ref-font-weight-regular) !important;\n color: var(--color) !important;\n width: 100%;\n }\n\n slot[name='label'] {\n line-height: 1;\n width: 100%;\n }\n}\n\n:host([layout='horizontal']) [internal-host],\n:host([layout='horizontal-inline']) [internal-host] {\n grid-template-columns: var(--_label-width) 1fr minmax(0, var(--_label-width));\n}\n\n/** block controls */\n[internal-host] {\n &:has([name='label']:has-slotted) {\n grid-template-areas:\n 'label label label'\n 'input input input';\n }\n\n &:has([name='messages']:has-slotted) {\n grid-template-areas:\n 'input input input'\n 'messages messages messages';\n }\n\n &:has([name='label']:has-slotted):has([name='messages']:has-slotted) {\n grid-template-areas:\n 'label label label'\n 'input input input'\n 'messages messages messages';\n }\n}\n\n:host([layout='horizontal']),\n:host([layout='horizontal-inline']) {\n [internal-host] {\n &:has([name='messages']:has-slotted) {\n grid-template-areas:\n 'label input input'\n '. messages messages';\n }\n\n &:not(:has([name='messages']:has-slotted)) {\n grid-template-areas: 'label input input';\n }\n }\n}\n\n/** inline controls */\n:host([nve-control='inline']) {\n [internal-host] {\n grid-template-areas: 'input input input';\n\n &:has([name='label']:has-slotted) {\n grid-template-areas: 'input label label';\n }\n\n &:has([name='messages']:has-slotted) {\n grid-template-areas:\n 'input input input'\n 'messages messages messages';\n }\n\n &:has([name='label']:has-slotted):has([name='messages']:has-slotted) {\n grid-template-areas:\n 'input label label'\n 'messages messages messages';\n }\n }\n}\n"],"mappings":""}
|
|
@@ -25,7 +25,7 @@ var C = class extends v {
|
|
|
25
25
|
}
|
|
26
26
|
#r;
|
|
27
27
|
get input() {
|
|
28
|
-
return !b && !this.#r && (this.#r = (this.querySelector("slot")?.assignedElements()?.find((e) => e.matches("input, select, selectmenu, textarea, [nve-control]
|
|
28
|
+
return !b && !this.#r && (this.#r = (this.querySelector("slot")?.assignedElements()?.find((e) => e.matches("input, select, selectmenu, textarea, [nve-control]")) ?? Array.from(this.shadowRoot.querySelector("slot")?.assignedElements({ flatten: !0 }) ?? []).find((e) => e.matches("input, select, selectmenu, textarea, [nve-control]"))) || this.querySelector(d)), this.#r;
|
|
29
29
|
}
|
|
30
30
|
get prefixContent() {
|
|
31
31
|
return x;
|
|
@@ -40,7 +40,7 @@ var C = class extends v {
|
|
|
40
40
|
static {
|
|
41
41
|
this.metadata = {
|
|
42
42
|
tag: "nve-control",
|
|
43
|
-
version: "0.0.
|
|
43
|
+
version: "0.0.8"
|
|
44
44
|
};
|
|
45
45
|
}
|
|
46
46
|
render() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"control2.js","names":["#i18nController","#label","#messages","#input","#onRootSlotchange","#onInputSlotchange","#onFitTextUpdate","#observers","#updateStyleStates","#setupInput","#setupFitText","#polyfillShowPicker","#updateAssociations","#getCharacterWidth","#assignLabel"],"sources":["../../../src/forms/control/control.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { TemplateResult } from 'lit';\nimport { LitElement, html, nothing, isServer } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport {\n attachInternals,\n useStyles,\n associateLabel,\n associateAriaDescribedBy,\n associateDataList,\n appendRootNodeStyle,\n getAttributeListChanges,\n I18nController,\n hostAttr,\n typeSSR\n} from '@nvidia-elements/core/internal';\nimport type { ControlMessage } from '../control-message/control-message.js';\nimport {\n setupControlValidationStates,\n setupControlStates,\n setupControlStatusStates,\n inputQuery\n} from '../utils/states.js';\nimport { setupControlLayoutStates } from '../utils/layout.js';\nimport globalStyles from './control.global.css?inline';\nimport styles from './control.css?inline';\n\n/**\n * @element nve-control\n * @description Wraps a form input with its associated label and validation messages, managing layout and accessibility associations.\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/forms\n * @slot - Control input element\n * @slot label - Label element\n * @cssprop --cursor\n * @cssprop --accent-color\n * @cssprop --color\n * @cssprop --label-color\n * @cssprop --label-width\n * @cssprop --label-font-weight\n * @cssprop --label-font-size\n * @cssprop --control-width\n * @cssprop --control-height\n\n * @aria https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals\n * @package true\n */\n@typeSSR()\nexport class Control extends LitElement {\n /** Set current visual state for control. This overrides any validation states active. */\n @property({ type: String }) status: 'warning' | 'error' | 'success' | 'disabled';\n\n /** Set current control + label + control message layout. Layouts will collapse based on available container space. */\n @property({ type: String, reflect: true }) layout:\n | 'vertical'\n | 'vertical-inline'\n | 'horizontal'\n | 'horizontal-inline';\n\n /** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */\n @property({ type: Boolean, reflect: true, attribute: 'fit-text' }) fitText = false;\n\n /** Sets the input to match native default content block */\n @property({ type: Boolean, reflect: true, attribute: 'fit-content' }) fitContent = false;\n\n #i18nController: I18nController<this> = new I18nController<this>(this);\n\n /** Enables internal string values to update for internationalization. */\n @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n /** Set the visual prominence of the control */\n @property({ type: String, reflect: true }) prominence: 'muted';\n\n get #label() {\n return this.shadowRoot\n ?.querySelector<HTMLSlotElement>('slot[name=\"label\"]')\n ?.assignedElements({ flatten: true })?.[0] as HTMLLabelElement;\n }\n\n get #messages() {\n return (this.shadowRoot\n ?.querySelector<HTMLSlotElement>('slot[name=\"messages\"]')\n ?.assignedElements({ flatten: true }) ?? []) as ControlMessage[];\n }\n\n #input: HTMLInputElement;\n\n /** @private */\n get input(): HTMLInputElement {\n if (!isServer && !this.#input) {\n const slotted =\n this.querySelector('slot')\n ?.assignedElements()\n ?.find(i => i.matches(inputQuery)) ??\n Array.from(this.shadowRoot!.querySelector('slot')?.assignedElements({ flatten: true }) ?? []).find(i =>\n i.matches(inputQuery)\n );\n this.#input = (slotted ? slotted : this.querySelector(inputQuery)) as HTMLInputElement;\n }\n\n return this.#input;\n }\n\n /** @private */\n protected get prefixContent(): typeof nothing | TemplateResult {\n return nothing;\n }\n\n /** @private */\n protected get suffixContent(): typeof nothing | TemplateResult {\n return nothing;\n }\n\n @hostAttr({ attribute: 'nve-control' }) protected nveControl = '';\n\n /** @private */\n declare _internals: ElementInternals;\n\n #observers: (MutationObserver | ResizeObserver)[] = [];\n\n protected _associateDatalist = true;\n\n static styles = useStyles([styles]);\n\n static readonly metadata = {\n tag: 'nve-control',\n version: '0.0.0'\n };\n\n render() {\n return this.nveControl !== 'inline'\n ? html`\n <div internal-host part=\"_internal-host\">\n <slot name=\"label\" part=\"_label\"></slot>\n <div input part=\"_input\">\n ${this.prefixContent}\n <slot></slot>\n ${this.suffixContent}\n </div>\n <slot name=\"messages\" part=\"_messages\"></slot>\n </div>\n `\n : html`\n <div internal-host part=\"_internal-host\">\n <div input part=\"_input\"><slot interaction-state></slot></div>\n <slot name=\"label\" part=\"_label\"></slot>\n <slot name=\"messages\" part=\"_messages\"></slot>\n </div>\n `;\n }\n\n connectedCallback() {\n super.connectedCallback();\n attachInternals(this);\n appendRootNodeStyle(this, globalStyles);\n this.shadowRoot!.addEventListener('slotchange', this.#onRootSlotchange);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.shadowRoot!.removeEventListener('slotchange', this.#onRootSlotchange);\n this.shadowRoot!.removeEventListener('slotchange', this.#onInputSlotchange);\n if (this.fitText && this.input) {\n this.input.removeEventListener('input', this.#onFitTextUpdate);\n this.input.removeEventListener('change', this.#onFitTextUpdate);\n }\n this.#observers.forEach(observer => observer.disconnect());\n this.#observers.length = 0;\n }\n\n #onRootSlotchange = () => {\n this.#updateStyleStates();\n\n if (this.input && this.#observers.length === 0) {\n this.#setupInput();\n this.#setupFitText();\n }\n };\n\n /** Resets control value to initial attribute value and clears any active validation rules. */\n reset() {\n this.input.value = this.input.getAttribute('value') ?? '';\n this.requestUpdate();\n this.dispatchEvent(new CustomEvent('reset', { bubbles: true, composed: true }));\n }\n\n #setupInput() {\n setupControlValidationStates(this, this.#messages);\n\n this.#observers.push(\n ...setupControlStates(this),\n ...setupControlStatusStates(this, this.#messages),\n setupControlLayoutStates(this),\n getAttributeListChanges(this, ['hidden', 'status'], () => this.#updateStyleStates())\n );\n\n this.#polyfillShowPicker();\n this.#updateAssociations();\n this.shadowRoot!.addEventListener('slotchange', this.#onInputSlotchange);\n }\n\n #onInputSlotchange = () => {\n this.#updateStyleStates();\n this.#updateAssociations();\n };\n\n #setupFitText() {\n if (this.fitText) {\n this.#getCharacterWidth();\n this.input.addEventListener('input', this.#onFitTextUpdate);\n this.input.addEventListener('change', this.#onFitTextUpdate);\n }\n }\n\n #onFitTextUpdate = () => {\n this.#getCharacterWidth();\n };\n\n #getCharacterWidth() {\n if (this.input.tagName === 'INPUT') {\n const offset = this.input.type !== 'text' ? 4 : 0;\n this.style.setProperty('--control-width', `${this.input.value.length + offset}ch`);\n this.input.style.setProperty('max-width', `${this.input.value.length + 2}ch`, 'important');\n } else if (this.input.tagName === 'SELECT') {\n this.style.setProperty(\n '--control-width',\n `${(this.input as unknown as HTMLSelectElement).options[(this.input as unknown as HTMLSelectElement).selectedIndex]!.textContent!.length + 4}ch`\n );\n }\n }\n\n #polyfillShowPicker() {\n if (!this.input.showPicker) {\n this.input.showPicker = () => this.input.focus();\n }\n }\n\n #updateStyleStates() {\n if (this.input) {\n this.toggleAttribute('multiple', this.input?.multiple);\n this.input?.hasAttribute('size') ? this.setAttribute('size', '') : this.removeAttribute('size');\n }\n }\n\n #updateAssociations() {\n this.#assignLabel();\n associateLabel(this.#label, this.input);\n associateAriaDescribedBy(Array.from(this.#messages), this.input);\n\n if (this._associateDatalist) {\n associateDataList(this.querySelector<HTMLDataListElement>('datalist')!, this.input);\n }\n }\n\n #assignLabel() {\n const label =\n this.querySelector('label') ||\n (this.shadowRoot!.querySelector('slot')!\n .assignedNodes({ flatten: true })\n .find((i: Node) => (i as HTMLElement).tagName === 'LABEL') as HTMLLabelElement);\n if (label) {\n label.slot = 'label';\n }\n }\n\n protected showPicker() {\n try {\n this.input.showPicker();\n } catch {\n //\n }\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"control2.js","names":["#i18nController","#label","#messages","#input","#onRootSlotchange","#onInputSlotchange","#onFitTextUpdate","#observers","#updateStyleStates","#setupInput","#setupFitText","#polyfillShowPicker","#updateAssociations","#getCharacterWidth","#assignLabel"],"sources":["../../../src/forms/control/control.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { TemplateResult } from 'lit';\nimport { LitElement, html, nothing, isServer } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport {\n attachInternals,\n useStyles,\n associateLabel,\n associateAriaDescribedBy,\n associateDataList,\n appendRootNodeStyle,\n getAttributeListChanges,\n I18nController,\n hostAttr,\n typeSSR\n} from '@nvidia-elements/core/internal';\nimport type { ControlMessage } from '../control-message/control-message.js';\nimport {\n setupControlValidationStates,\n setupControlStates,\n setupControlStatusStates,\n inputQuery\n} from '../utils/states.js';\nimport { setupControlLayoutStates } from '../utils/layout.js';\nimport globalStyles from './control.global.css?inline';\nimport styles from './control.css?inline';\n\n/**\n * @element nve-control\n * @description Wraps a form input with its associated label and validation messages, managing layout and accessibility associations.\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/forms\n * @slot - Control input element\n * @slot label - Label element\n * @cssprop --cursor\n * @cssprop --accent-color\n * @cssprop --color\n * @cssprop --label-color\n * @cssprop --label-width\n * @cssprop --label-font-weight\n * @cssprop --label-font-size\n * @cssprop --control-width\n * @cssprop --control-height\n\n * @aria https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals\n * @package true\n */\n@typeSSR()\nexport class Control extends LitElement {\n /** Set current visual state for control. This overrides any validation states active. */\n @property({ type: String }) status: 'warning' | 'error' | 'success' | 'disabled';\n\n /** Set current control + label + control message layout. Layouts will collapse based on available container space. */\n @property({ type: String, reflect: true }) layout:\n | 'vertical'\n | 'vertical-inline'\n | 'horizontal'\n | 'horizontal-inline';\n\n /** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */\n @property({ type: Boolean, reflect: true, attribute: 'fit-text' }) fitText = false;\n\n /** Sets the input to match native default content block */\n @property({ type: Boolean, reflect: true, attribute: 'fit-content' }) fitContent = false;\n\n #i18nController: I18nController<this> = new I18nController<this>(this);\n\n /** Enables internal string values to update for internationalization. */\n @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n /** Set the visual prominence of the control */\n @property({ type: String, reflect: true }) prominence: 'muted';\n\n get #label() {\n return this.shadowRoot\n ?.querySelector<HTMLSlotElement>('slot[name=\"label\"]')\n ?.assignedElements({ flatten: true })?.[0] as HTMLLabelElement;\n }\n\n get #messages() {\n return (this.shadowRoot\n ?.querySelector<HTMLSlotElement>('slot[name=\"messages\"]')\n ?.assignedElements({ flatten: true }) ?? []) as ControlMessage[];\n }\n\n #input: HTMLInputElement;\n\n /** @private */\n get input(): HTMLInputElement {\n if (!isServer && !this.#input) {\n const slotted =\n this.querySelector('slot')\n ?.assignedElements()\n ?.find(i => i.matches(inputQuery)) ??\n Array.from(this.shadowRoot!.querySelector('slot')?.assignedElements({ flatten: true }) ?? []).find(i =>\n i.matches(inputQuery)\n );\n this.#input = (slotted ? slotted : this.querySelector(inputQuery)) as HTMLInputElement;\n }\n\n return this.#input;\n }\n\n /** @private */\n protected get prefixContent(): typeof nothing | TemplateResult {\n return nothing;\n }\n\n /** @private */\n protected get suffixContent(): typeof nothing | TemplateResult {\n return nothing;\n }\n\n @hostAttr({ attribute: 'nve-control' }) protected nveControl = '';\n\n /** @private */\n declare _internals: ElementInternals;\n\n #observers: (MutationObserver | ResizeObserver)[] = [];\n\n protected _associateDatalist = true;\n\n static styles = useStyles([styles]);\n\n static readonly metadata = {\n tag: 'nve-control',\n version: '0.0.0'\n };\n\n render() {\n return this.nveControl !== 'inline'\n ? html`\n <div internal-host part=\"_internal-host\">\n <slot name=\"label\" part=\"_label\"></slot>\n <div input part=\"_input\">\n ${this.prefixContent}\n <slot></slot>\n ${this.suffixContent}\n </div>\n <slot name=\"messages\" part=\"_messages\"></slot>\n </div>\n `\n : html`\n <div internal-host part=\"_internal-host\">\n <div input part=\"_input\"><slot interaction-state></slot></div>\n <slot name=\"label\" part=\"_label\"></slot>\n <slot name=\"messages\" part=\"_messages\"></slot>\n </div>\n `;\n }\n\n connectedCallback() {\n super.connectedCallback();\n attachInternals(this);\n appendRootNodeStyle(this, globalStyles);\n this.shadowRoot!.addEventListener('slotchange', this.#onRootSlotchange);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.shadowRoot!.removeEventListener('slotchange', this.#onRootSlotchange);\n this.shadowRoot!.removeEventListener('slotchange', this.#onInputSlotchange);\n if (this.fitText && this.input) {\n this.input.removeEventListener('input', this.#onFitTextUpdate);\n this.input.removeEventListener('change', this.#onFitTextUpdate);\n }\n this.#observers.forEach(observer => observer.disconnect());\n this.#observers.length = 0;\n }\n\n #onRootSlotchange = () => {\n this.#updateStyleStates();\n\n if (this.input && this.#observers.length === 0) {\n this.#setupInput();\n this.#setupFitText();\n }\n };\n\n /** Resets control value to initial attribute value and clears any active validation rules. */\n reset() {\n this.input.value = this.input.getAttribute('value') ?? '';\n this.requestUpdate();\n this.dispatchEvent(new CustomEvent('reset', { bubbles: true, composed: true }));\n }\n\n #setupInput() {\n setupControlValidationStates(this, this.#messages);\n\n this.#observers.push(\n ...setupControlStates(this),\n ...setupControlStatusStates(this, this.#messages),\n setupControlLayoutStates(this),\n getAttributeListChanges(this, ['hidden', 'status'], () => this.#updateStyleStates())\n );\n\n this.#polyfillShowPicker();\n this.#updateAssociations();\n this.shadowRoot!.addEventListener('slotchange', this.#onInputSlotchange);\n }\n\n #onInputSlotchange = () => {\n this.#updateStyleStates();\n this.#updateAssociations();\n };\n\n #setupFitText() {\n if (this.fitText) {\n this.#getCharacterWidth();\n this.input.addEventListener('input', this.#onFitTextUpdate);\n this.input.addEventListener('change', this.#onFitTextUpdate);\n }\n }\n\n #onFitTextUpdate = () => {\n this.#getCharacterWidth();\n };\n\n #getCharacterWidth() {\n if (this.input.tagName === 'INPUT') {\n const offset = this.input.type !== 'text' ? 4 : 0;\n this.style.setProperty('--control-width', `${this.input.value.length + offset}ch`);\n this.input.style.setProperty('max-width', `${this.input.value.length + 2}ch`, 'important');\n } else if (this.input.tagName === 'SELECT') {\n this.style.setProperty(\n '--control-width',\n `${(this.input as unknown as HTMLSelectElement).options[(this.input as unknown as HTMLSelectElement).selectedIndex]!.textContent!.length + 4}ch`\n );\n }\n }\n\n #polyfillShowPicker() {\n if (!this.input.showPicker) {\n this.input.showPicker = () => this.input.focus();\n }\n }\n\n #updateStyleStates() {\n if (this.input) {\n this.toggleAttribute('multiple', this.input?.multiple);\n this.input?.hasAttribute('size') ? this.setAttribute('size', '') : this.removeAttribute('size');\n }\n }\n\n #updateAssociations() {\n this.#assignLabel();\n associateLabel(this.#label, this.input);\n associateAriaDescribedBy(Array.from(this.#messages), this.input);\n\n if (this._associateDatalist) {\n associateDataList(this.querySelector<HTMLDataListElement>('datalist')!, this.input);\n }\n }\n\n #assignLabel() {\n const label =\n this.querySelector('label') ||\n (this.shadowRoot!.querySelector('slot')!\n .assignedNodes({ flatten: true })\n .find((i: Node) => (i as HTMLElement).tagName === 'LABEL') as HTMLLabelElement);\n if (label) {\n label.slot = 'label';\n }\n }\n\n protected showPicker() {\n try {\n this.input.showPicker();\n } catch {\n //\n }\n }\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"control-group.js","names":[],"sources":["../../../src/forms/control-group/control-group.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n --color: var(--nve-sys-interaction-field-color);\n --opacity: 1;\n --label-color: var(--nve-sys-interaction-field-color);\n --label-text-transform: capitalize;\n --label-font-weight: var(--nve-ref-font-weight-medium);\n --label-font-size: var(--nve-ref-font-size-100);\n --_label-width: var(--label-width, 180px);\n}\n\n[internal-host] {\n color: var(--color);\n opacity: var(--opacity);\n}\n\n::slotted(label) {\n font-weight: var(--label-font-weight) !important;\n font-size: var(--label-font-size) !important;\n color: var(--label-color) !important;\n cursor: var(--cursor) !important;\n text-transform: var(--label-text-transform) !important;\n}\n\n:host([layout*='horizontal-inline']) ::slotted([nve-control]),\n:host([layout*='vertical-inline']) ::slotted([nve-control])
|
|
1
|
+
{"version":3,"file":"control-group.js","names":[],"sources":["../../../src/forms/control-group/control-group.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n --color: var(--nve-sys-interaction-field-color);\n --opacity: 1;\n --label-color: var(--nve-sys-interaction-field-color);\n --label-text-transform: capitalize;\n --label-font-weight: var(--nve-ref-font-weight-medium);\n --label-font-size: var(--nve-ref-font-size-100);\n --_label-width: var(--label-width, 180px);\n}\n\n[internal-host] {\n color: var(--color);\n opacity: var(--opacity);\n}\n\n::slotted(label) {\n font-weight: var(--label-font-weight) !important;\n font-size: var(--label-font-size) !important;\n color: var(--label-color) !important;\n cursor: var(--cursor) !important;\n text-transform: var(--label-text-transform) !important;\n}\n\n:host([layout*='horizontal-inline']) ::slotted([nve-control]),\n:host([layout*='vertical-inline']) ::slotted([nve-control]) {\n --control-height: var(--nve-sys-interaction-field-height);\n}\n\nslot[name='label'] {\n grid-area: label;\n display: block;\n align-self: center;\n}\n\nslot[name='messages'] {\n grid-area: messages;\n display: block;\n}\n\n.input-slot {\n grid-area: input;\n display: flex;\n flex-flow: column wrap;\n gap: var(--nve-ref-space-sm) var(--nve-ref-space-md);\n width: fit-content;\n}\n\n:host([layout*='-inline']) .input-slot {\n flex-direction: row;\n}\n\n[name='messages']:not(:has-slotted),\n[name='label']:not(:has-slotted) {\n display: none !important;\n}\n\n/* fallback for :has-slotted */\n.no-messages {\n & slot[name='messages'] {\n display: none !important;\n }\n}\n\n/* fallback for :has-slotted */\n.no-label {\n & slot[name='label'] {\n display: none !important;\n }\n}\n\n[internal-host] {\n display: grid;\n gap: var(--nve-ref-space-xs);\n align-items: start;\n grid-template-columns: 1fr 1fr 1fr;\n grid-template-rows: auto;\n grid-template-areas:\n 'label label label'\n 'input input input'\n 'messages messages messages';\n\n &.no-messages {\n grid-template-areas:\n 'label label label'\n 'input input input';\n }\n\n &.no-label {\n & slot[name='messages'] {\n grid-template-areas:\n 'input input input'\n 'messages messages messages';\n }\n }\n\n &.no-label.no-messages {\n grid-template-areas: 'input input input';\n }\n}\n\n:host([layout='vertical-inline']) [internal-host] {\n grid-template-areas:\n 'label label label'\n 'input input input'\n 'messages messages messages';\n}\n\n:host([layout='vertical-inline']) [internal-host].no-messages {\n grid-template-areas:\n 'label label label'\n 'input input input';\n}\n\n:host([layout='horizontal']) [internal-host] {\n grid-template-columns: var(--_label-width) minmax(auto, max-content) auto;\n grid-template-areas:\n 'label input input'\n '. messages messages';\n}\n\n:host([layout='horizontal']) [internal-host].no-messages {\n grid-template-areas: 'label input input';\n}\n\n:host([layout='horizontal-inline']) [internal-host] {\n grid-template-columns: var(--_label-width) minmax(auto, max-content) auto;\n grid-template-areas:\n 'label input input'\n '. messages messages';\n}\n\n:host([layout='horizontal-inline']) [internal-host].no-messages {\n grid-template-areas: 'label input input';\n}\n\n:host([layout='horizontal']) slot[name='label'] {\n align-self: start;\n}\n\n:host([layout='horizontal']) ::slotted(label) {\n align-self: start !important;\n}\n"],"mappings":""}
|
|
@@ -1,64 +1,63 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import
|
|
7
|
-
import d from "
|
|
8
|
-
import {
|
|
9
|
-
import { property as m } from "lit/decorators/property.js";
|
|
1
|
+
import { associateAriaDescribedBy as e, associateAriaLabel as t, associateControlGroup as n, attachInternals as r } from "../../internal/utils/a11y.js";
|
|
2
|
+
import { __decorate as i } from "../../_virtual/_@oxc-project_runtime@0.123.0/helpers/decorate.js";
|
|
3
|
+
import { useStyles as a } from "../../internal/styles/index.js";
|
|
4
|
+
import { inputQuery as o, setupControlGroupStates as s, setupControlStatusStates as c } from "../utils/states.js";
|
|
5
|
+
import { setupControlLayoutStates as l } from "../utils/layout.js";
|
|
6
|
+
import u from "./control-group.js";
|
|
7
|
+
import { LitElement as d, html as f } from "lit";
|
|
8
|
+
import { property as p } from "lit/decorators/property.js";
|
|
10
9
|
//#region src/forms/control-group/control-group.ts
|
|
11
|
-
var
|
|
10
|
+
var m = class extends d {
|
|
12
11
|
get label() {
|
|
13
12
|
return this.querySelector?.("label");
|
|
14
13
|
}
|
|
15
14
|
get inputs() {
|
|
16
|
-
return this.querySelectorAll ? Array.from(this.querySelectorAll(
|
|
15
|
+
return this.querySelectorAll ? Array.from(this.querySelectorAll(o)) : [];
|
|
17
16
|
}
|
|
18
17
|
get #e() {
|
|
19
|
-
return this.querySelectorAll ? Array.from(this.querySelectorAll(
|
|
18
|
+
return this.querySelectorAll ? Array.from(this.querySelectorAll("nve-control-message")) : [];
|
|
20
19
|
}
|
|
21
20
|
#t = [];
|
|
22
21
|
static {
|
|
23
|
-
this.styles =
|
|
22
|
+
this.styles = a([u]);
|
|
24
23
|
}
|
|
25
24
|
static {
|
|
26
25
|
this.metadata = {
|
|
27
26
|
tag: "nve-control-group",
|
|
28
|
-
version: "0.0.
|
|
27
|
+
version: "0.0.8"
|
|
29
28
|
};
|
|
30
29
|
}
|
|
31
30
|
render() {
|
|
32
|
-
return
|
|
31
|
+
return f`<div internal-host class="${this.#e.length ? "" : "no-messages"} ${this.label ? "" : "no-label"}"><slot name="label"></slot><slot class="input-slot"></slot><slot name="messages"></slot></div>`;
|
|
33
32
|
}
|
|
34
33
|
connectedCallback() {
|
|
35
|
-
super.connectedCallback(),
|
|
34
|
+
super.connectedCallback(), r(this), this._internals.role = "group";
|
|
36
35
|
}
|
|
37
36
|
firstUpdated(e) {
|
|
38
37
|
super.firstUpdated(e), this.#t = [
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
...
|
|
38
|
+
s(this),
|
|
39
|
+
l(this),
|
|
40
|
+
...c(this, this.#e)
|
|
42
41
|
], this.#n(), this.shadowRoot.addEventListener("slotchange", () => this.#n());
|
|
43
42
|
}
|
|
44
43
|
disconnectedCallback() {
|
|
45
44
|
super.disconnectedCallback(), this.#t.forEach((e) => e.disconnect());
|
|
46
45
|
}
|
|
47
46
|
#n() {
|
|
48
|
-
this.#r(),
|
|
47
|
+
this.#r(), t(this.label, this), e(Array.from(this.querySelectorAll("nve-control-message")), this), n(Array.from(this.inputs));
|
|
49
48
|
}
|
|
50
49
|
#r() {
|
|
51
50
|
this.label && (this.label.slot = "label");
|
|
52
51
|
}
|
|
53
52
|
};
|
|
54
|
-
|
|
53
|
+
i([p({
|
|
55
54
|
type: String,
|
|
56
55
|
reflect: !0
|
|
57
|
-
})],
|
|
56
|
+
})], m.prototype, "layout", void 0), i([p({
|
|
58
57
|
type: String,
|
|
59
58
|
reflect: !0
|
|
60
|
-
})],
|
|
59
|
+
})], m.prototype, "prominence", void 0);
|
|
61
60
|
//#endregion
|
|
62
|
-
export {
|
|
61
|
+
export { m as ControlGroup };
|
|
63
62
|
|
|
64
63
|
//# sourceMappingURL=control-group2.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"control-group2.js","names":["#messages","#observers","#updateAssociations","#assignLabel"],"sources":["../../../src/forms/control-group/control-group.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 {\n attachInternals,\n useStyles,\n associateAriaLabel,\n associateAriaDescribedBy,\n associateControlGroup
|
|
1
|
+
{"version":3,"file":"control-group2.js","names":["#messages","#observers","#updateAssociations","#assignLabel"],"sources":["../../../src/forms/control-group/control-group.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 {\n attachInternals,\n useStyles,\n associateAriaLabel,\n associateAriaDescribedBy,\n associateControlGroup\n} from '@nvidia-elements/core/internal';\nimport type { ControlMessage } from '../control-message/control-message.js';\nimport { setupControlStatusStates, setupControlGroupStates, inputQuery } from '../utils/states.js';\nimport { setupControlLayoutStates } from '../utils/layout.js';\nimport styles from './control-group.css?inline';\n\n/**\n * @element nve-control-group\n * @description Groups many related form controls under a shared label and validation context for semantically linked inputs.\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/forms\n * @slot - Control input elements\n * @cssprop --color\n * @cssprop --label-color\n * @cssprop --label-text-transform\n * @cssprop --label-font-weight\n * @cssprop --label-font-size\n * @aria https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals\n * @package true\n */\nexport class ControlGroup extends LitElement {\n /** Set each slotted control + label + control message layout */\n @property({ type: String, reflect: true }) layout:\n | 'vertical'\n | 'vertical-inline'\n | 'horizontal'\n | 'horizontal-inline';\n\n /** Set the visual prominence of the control group */\n @property({ type: String, reflect: true }) prominence: 'muted';\n\n get label() {\n return this.querySelector?.<HTMLLabelElement>('label');\n }\n\n get inputs() {\n return this.querySelectorAll ? Array.from(this.querySelectorAll<HTMLInputElement>(inputQuery)) : [];\n }\n\n get #messages() {\n return this.querySelectorAll ? Array.from(this.querySelectorAll<ControlMessage>('nve-control-message')) : [];\n }\n\n #observers: (MutationObserver | ResizeObserver)[] = [];\n\n static styles = useStyles([styles]);\n\n static readonly metadata = {\n tag: 'nve-control-group',\n version: '0.0.0'\n };\n\n /** @private */\n declare _internals: ElementInternals;\n\n render() {\n return html`\n <div internal-host class=\"${this.#messages.length ? '' : 'no-messages'} ${this.label ? '' : 'no-label'}\">\n <slot name=\"label\"></slot>\n <slot class=\"input-slot\"></slot>\n <slot name=\"messages\"></slot>\n </div>\n `;\n }\n\n connectedCallback() {\n super.connectedCallback();\n attachInternals(this);\n this._internals.role = 'group';\n }\n\n firstUpdated(props: PropertyValues<this>) {\n super.firstUpdated(props);\n this.#observers = [\n setupControlGroupStates(this),\n setupControlLayoutStates(this),\n ...setupControlStatusStates(this, this.#messages)\n ];\n this.#updateAssociations();\n this.shadowRoot!.addEventListener('slotchange', () => this.#updateAssociations());\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.#observers.forEach(observer => observer.disconnect());\n }\n\n #updateAssociations() {\n this.#assignLabel();\n associateAriaLabel(this.label as HTMLElement, this);\n associateAriaDescribedBy(Array.from(this.querySelectorAll<ControlMessage>('nve-control-message')), this);\n associateControlGroup(Array.from(this.inputs));\n }\n\n #assignLabel() {\n if (this.label) {\n this.label.slot = 'label';\n }\n }\n}\n"],"mappings":";;;;;;;;;AAgCA,IAAa,IAAb,cAAkC,EAAW;CAW3C,IAAI,QAAQ;AACV,SAAO,KAAK,gBAAkC,QAAQ;;CAGxD,IAAI,SAAS;AACX,SAAO,KAAK,mBAAmB,MAAM,KAAK,KAAK,iBAAmC,EAAW,CAAC,GAAG,EAAE;;CAGrG,KAAA,IAAgB;AACd,SAAO,KAAK,mBAAmB,MAAM,KAAK,KAAK,iBAAiC,sBAAsB,CAAC,GAAG,EAAE;;CAG9G,KAAoD,EAAE;;gBAEtC,EAAU,CAAC,EAAO,CAAC;;;kBAER;GACzB,KAAK;GACL,SAAS;GACV;;CAKD,SAAS;AACP,SAAO,CAAI,6BACmB,MAAA,EAAe,SAAS,KAAK,cAAc,GAAG,KAAK,QAAQ,KAAK,WAAW;;CAQ3G,oBAAoB;AAGlB,EAFA,MAAM,mBAAmB,EACzB,EAAgB,KAAK,EACrB,KAAK,WAAW,OAAO;;CAGzB,aAAa,GAA6B;AAQxC,EAPA,MAAM,aAAa,EAAM,EACzB,MAAA,IAAkB;GAChB,EAAwB,KAAK;GAC7B,EAAyB,KAAK;GAC9B,GAAG,EAAyB,MAAM,MAAA,EAAKA;GACxC,EACD,MAAA,GAA0B,EAC1B,KAAK,WAAY,iBAAiB,oBAAoB,MAAA,GAA0B,CAAC;;CAGnF,uBAAuB;AAErB,EADA,MAAM,sBAAsB,EAC5B,MAAA,EAAgB,SAAQ,MAAY,EAAS,YAAY,CAAC;;CAG5D,KAAsB;AAIpB,EAHA,MAAA,GAAmB,EACnB,EAAmB,KAAK,OAAsB,KAAK,EACnD,EAAyB,MAAM,KAAK,KAAK,iBAAiC,sBAAsB,CAAC,EAAE,KAAK,EACxG,EAAsB,MAAM,KAAK,KAAK,OAAO,CAAC;;CAGhD,KAAe;AACb,EAAI,KAAK,UACP,KAAK,MAAM,OAAO;;;GA1ErB,EAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,UAAA,KAAA,EAAA,KAOzC,EAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,cAAA,KAAA,EAAA"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { ControlGroup } from '../control-group/control-group.js';
|
|
2
2
|
import { ControlMessage } from '../control-message/control-message.js';
|
|
3
3
|
import { Control } from '../control/control.js';
|
|
4
|
-
export declare const inputQuery = "input, select, selectmenu, textarea, [nve-control]
|
|
4
|
+
export declare const inputQuery = "input, select, selectmenu, textarea, [nve-control]";
|
|
5
5
|
/**
|
|
6
6
|
* Adds validation states to custom element
|
|
7
7
|
* :state(valid) form control is in a valid state
|
|
@@ -1,29 +1,29 @@
|
|
|
1
|
-
import { getAttributeChanges as e, getAttributeListChanges as t, getElementUpdate as n, matchesElementName as r
|
|
2
|
-
import { ControlMessage as
|
|
1
|
+
import { getAttributeChanges as e, getAttributeListChanges as t, getElementUpdate as n, matchesElementName as r } from "../../internal/utils/dom.js";
|
|
2
|
+
import { ControlMessage as i } from "../control-message/control-message2.js";
|
|
3
3
|
//#region src/forms/utils/states.ts
|
|
4
|
-
var
|
|
5
|
-
function
|
|
4
|
+
var a = "input, select, selectmenu, textarea, [nve-control]";
|
|
5
|
+
function o(e, t) {
|
|
6
6
|
if (!e.input.form?.noValidate && !e.input.formNoValidate && !e.input.hasAttribute("formnovalidate")) {
|
|
7
|
-
|
|
7
|
+
f(t);
|
|
8
8
|
let n = () => {
|
|
9
|
-
e.input.validity?.valid && (e._internals.states.delete("invalid"), e._internals.states.add("valid"), e.status = null),
|
|
9
|
+
e.input.validity?.valid && (e._internals.states.delete("invalid"), e._internals.states.add("valid"), e.status = null), m(e, t);
|
|
10
10
|
}, r = () => {
|
|
11
|
-
e.status = null, e._internals.states.delete("valid"), e._internals.states.delete("invalid"),
|
|
11
|
+
e.status = null, e._internals.states.delete("valid"), e._internals.states.delete("invalid"), f(t);
|
|
12
12
|
};
|
|
13
13
|
e.input.addEventListener("blur", () => {
|
|
14
14
|
e.input.checkValidity(), n();
|
|
15
15
|
}), e.input.addEventListener("input", () => {
|
|
16
16
|
n();
|
|
17
17
|
}), e.input.addEventListener("invalid", () => {
|
|
18
|
-
t.find((e) => e.error) && (
|
|
18
|
+
t.find((e) => e.error) && (f(t), p(e, t)), e.status = "error", e._internals.states.delete("valid"), e._internals.states.add("invalid");
|
|
19
19
|
}), e.addEventListener("reset", () => r()), e.input.form?.addEventListener("reset", () => r());
|
|
20
20
|
}
|
|
21
21
|
e.shadowRoot.addEventListener("slotchange", () => {
|
|
22
|
-
let t = Array.from(e.querySelectorAll(i
|
|
22
|
+
let t = Array.from(e.querySelectorAll(i.metadata.tag));
|
|
23
23
|
e._internals.states.delete("valid"), e._internals.states.delete("invalid"), t.find((e) => !e.hidden && (e.status === "error" || e.error)) ? e._internals.states.add("invalid") : e._internals.states.add("valid");
|
|
24
24
|
});
|
|
25
25
|
}
|
|
26
|
-
function
|
|
26
|
+
function s(e) {
|
|
27
27
|
let t = [], r = e._internals.states;
|
|
28
28
|
return e.input.checked ? r.add("checked") : r.delete("checked"), e.input.indeterminate ? r.add("indeterminate") : r.delete("indeterminate"), e.input.addEventListener("focus", () => e._internals.states.add("focus")), e.input.addEventListener("input", () => e._internals.states.add("dirty")), e.input.addEventListener("blur", () => {
|
|
29
29
|
e._internals.states.add("touched"), e._internals.states.delete("focus");
|
|
@@ -33,36 +33,36 @@ function c(e) {
|
|
|
33
33
|
e._internals.states.delete("touched"), e._internals.states.delete("dirty"), e._internals.states.delete("error"), e._internals.states.delete("success"), e.requestUpdate();
|
|
34
34
|
}), t.push(n(e.input, "readonly", (e) => e === "" || e ? r.add("readonly") : r.delete("readonly")), n(e.input, "checked", () => e.input.checked ? r.add("checked") : r.delete("checked")), n(e.input, "disabled", (e) => e === "" || e ? r.add("disabled") : r.delete("disabled")), n(e.input, "indeterminate", () => e.input.indeterminate ? r.add("indeterminate") : r.delete("indeterminate"))), t;
|
|
35
35
|
}
|
|
36
|
-
function
|
|
37
|
-
return
|
|
36
|
+
function c(t) {
|
|
37
|
+
return l(t), e(t, "disabled", () => l(t));
|
|
38
38
|
}
|
|
39
|
-
function
|
|
39
|
+
function l(e) {
|
|
40
40
|
Array.from(e.inputs).find((e) => e.disabled) ? e._internals.states.add("disabled") : e._internals.states.delete("disabled");
|
|
41
41
|
}
|
|
42
|
-
function
|
|
43
|
-
|
|
44
|
-
let
|
|
45
|
-
return
|
|
42
|
+
function u(e, n) {
|
|
43
|
+
d(e, n.find((e) => !e.hidden));
|
|
44
|
+
let a = [];
|
|
45
|
+
return a.push(t(e, ["hidden", "status"], (t) => {
|
|
46
46
|
let n = t.target;
|
|
47
|
-
r(n,
|
|
47
|
+
r(n, i) && d(e, n);
|
|
48
48
|
})), e.shadowRoot.addEventListener("slotchange", () => {
|
|
49
|
-
let t = Array.from(e.querySelectorAll(i
|
|
49
|
+
let t = Array.from(e.querySelectorAll(i.metadata.tag)).find((e) => e.status && !e.hidden);
|
|
50
50
|
e._internals.states.delete("error"), e._internals.states.delete("success"), t && e._internals.states.add(t.status);
|
|
51
|
-
}),
|
|
51
|
+
}), a;
|
|
52
52
|
}
|
|
53
|
-
function
|
|
53
|
+
function d(e, t) {
|
|
54
54
|
e._internals.states.delete("error"), e._internals.states.delete("success"), t?.status?.length && !t?.hidden && e._internals.states.add(t.status);
|
|
55
55
|
}
|
|
56
|
-
function
|
|
56
|
+
function f(e) {
|
|
57
57
|
e.filter((e) => e.hasAttribute("error")).forEach((e) => e.setAttribute("hidden", ""));
|
|
58
58
|
}
|
|
59
|
-
function
|
|
59
|
+
function p(e, t) {
|
|
60
60
|
t.find((t) => t.error && e.input.validity[t.error])?.removeAttribute("hidden");
|
|
61
61
|
}
|
|
62
|
-
function
|
|
62
|
+
function m(e, t) {
|
|
63
63
|
t.find((e) => e.error) && e.input.validity.valid && t.filter((t) => t.error && !e.input.validity[t.error]).forEach((e) => e.setAttribute("hidden", ""));
|
|
64
64
|
}
|
|
65
65
|
//#endregion
|
|
66
|
-
export {
|
|
66
|
+
export { a as inputQuery, c as setupControlGroupStates, s as setupControlStates, u as setupControlStatusStates, o as setupControlValidationStates };
|
|
67
67
|
|
|
68
68
|
//# sourceMappingURL=states.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"states.js","names":[],"sources":["../../../src/forms/utils/states.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n getAttributeChanges,\n getAttributeListChanges,\n getElementUpdate,\n matchesElementName,\n tagSelector\n} from '@nvidia-elements/core/internal';\nimport type { ControlGroup } from '../control-group/control-group.js';\nimport { ControlMessage } from '../control-message/control-message.js';\nimport type { Control } from '../control/control.js';\n\nexport const inputQuery = 'input, select, selectmenu, textarea, [nve-control], [nve-control]';\n\n/**\n * Adds validation states to custom element\n * :state(valid) form control is in a valid state\n * :state(invalid) form control is in a invalid state\n */\nexport function setupControlValidationStates(control: Control, messages: ControlMessage[]) {\n if (\n !control.input.form?.noValidate &&\n !control.input.formNoValidate &&\n !control.input.hasAttribute('formnovalidate')\n ) {\n hideAllValidationMessages(messages);\n\n /**\n * updateValidityState() logic triggered by input blur() or input() change events\n */\n const updateValidityState = () => {\n if (control.input.validity?.valid) {\n control._internals.states.delete('invalid');\n control._internals.states.add('valid');\n control.status = null!;\n }\n\n hideInactiveValidationMessages(control, messages);\n };\n\n const resetValidityState = () => {\n control.status = null!;\n control._internals.states.delete('valid');\n control._internals.states.delete('invalid');\n hideAllValidationMessages(messages);\n };\n\n control.input.addEventListener('blur', () => {\n control.input.checkValidity();\n updateValidityState();\n });\n\n control.input.addEventListener('input', () => {\n updateValidityState();\n });\n\n control.input.addEventListener('invalid', () => {\n if (messages.find(m => m.error)) {\n hideAllValidationMessages(messages);\n showActiveValidationMessages(control, messages);\n }\n\n control.status = 'error';\n control._internals.states.delete('valid');\n control._internals.states.add('invalid');\n });\n\n control.addEventListener('reset', () => resetValidityState());\n control.input.form?.addEventListener('reset', () => resetValidityState());\n }\n\n control.shadowRoot!.addEventListener('slotchange', () => {\n const messages = Array.from(control.querySelectorAll<ControlMessage>(tagSelector(ControlMessage.metadata.tag)));\n control._internals.states.delete('valid');\n control._internals.states.delete('invalid');\n if (messages.find(m => !m.hidden && (m.status === 'error' || m.error))) {\n control._internals.states.add('invalid');\n } else {\n control._internals.states.add('valid');\n }\n });\n}\n\n/**\n * Adds control interaction states to custom element\n * :state(checked) form control is in a checked state\n * :state(disabled) form control is in a disabled state\n * :state(readonly) form control is in a readonly state\n * :state(touched) form control received focus and then blurred\n * :state(dirty) user modified the form control\n */\nexport function setupControlStates(control: Control) {\n const observers: MutationObserver[] = [];\n const states = control._internals.states;\n control.input.checked ? states.add('checked') : states.delete('checked');\n control.input.indeterminate ? states.add('indeterminate') : states.delete('indeterminate');\n control.input.addEventListener('focus', () => control._internals.states.add('focus'));\n control.input.addEventListener('input', () => control._internals.states.add('dirty'));\n control.input.addEventListener('blur', () => {\n control._internals.states.add('touched');\n control._internals.states.delete('focus');\n });\n\n control.input.getRootNode().addEventListener('change', (e: Event) => {\n if ((e.target as HTMLInputElement).name === control.input?.name) {\n control.input.checked ? states.add('checked') : states.delete('checked');\n }\n });\n\n control.input.form?.addEventListener('reset', () => {\n control._internals.states.delete('touched');\n control._internals.states.delete('dirty');\n control._internals.states.delete('error');\n control._internals.states.delete('success');\n control.requestUpdate();\n });\n\n observers.push(\n getElementUpdate(control.input, 'readonly', value =>\n (value === '' ? true : value) ? states.add('readonly') : states.delete('readonly')\n ),\n getElementUpdate(control.input, 'checked', () =>\n control.input.checked ? states.add('checked') : states.delete('checked')\n ),\n getElementUpdate(control.input, 'disabled', value =>\n (value === '' ? true : value) ? states.add('disabled') : states.delete('disabled')\n ),\n getElementUpdate(control.input, 'indeterminate', () =>\n control.input.indeterminate ? states.add('indeterminate') : states.delete('indeterminate')\n )\n );\n return observers;\n}\n\n/**\n * Adds control group interaction states to custom element\n * :state(disabled) any form control within group is in a disabled state\n */\nexport function setupControlGroupStates(controlGroup: ControlGroup) {\n toggleControlGroupDisabledState(controlGroup);\n return getAttributeChanges(controlGroup, 'disabled', () => toggleControlGroupDisabledState(controlGroup));\n}\n\nexport function toggleControlGroupDisabledState(controlGroup: ControlGroup) {\n if (Array.from(controlGroup.inputs).find(i => i.disabled)) {\n controlGroup._internals.states.add('disabled');\n } else {\n controlGroup._internals.states.delete('disabled');\n }\n}\n\n/**\n * Adds control status states to custom element\n * :state(error) form control is in a error state\n * :state(success) form control is in a success state\n */\nexport function setupControlStatusStates(control: Control | ControlGroup, messages: ControlMessage[]) {\n updateControlStatusState(control, messages.find(m => !m.hidden)!);\n const observers: MutationObserver[] = [];\n observers.push(\n getAttributeListChanges(control, ['hidden', 'status'], mutation => {\n const target = mutation.target as ControlMessage;\n if (matchesElementName(target, ControlMessage)) {\n updateControlStatusState(control, target);\n }\n })\n );\n\n control.shadowRoot!.addEventListener('slotchange', () => {\n const messages = Array.from(control.querySelectorAll<ControlMessage>(tagSelector(ControlMessage.metadata.tag)));\n const message = messages.find(m => m.status && !m.hidden);\n control._internals.states.delete('error');\n control._internals.states.delete('success');\n if (message) {\n control._internals.states.add(message.status!);\n }\n });\n\n return observers;\n}\n\nexport function updateControlStatusState(control: Control | ControlGroup, message: ControlMessage) {\n control._internals.states.delete('error');\n control._internals.states.delete('success');\n\n if (message?.status?.length && !message?.hidden) {\n control._internals.states.add(message.status);\n }\n}\n\nexport function showNonValidationMessages(messages: ControlMessage[]) {\n messages.filter(m => !m.hasAttribute('error')).forEach(m => m.removeAttribute('hidden'));\n}\n\nexport function hideAllValidationMessages(messages: ControlMessage[]) {\n messages.filter(m => m.hasAttribute('error')).forEach(m => m.setAttribute('hidden', ''));\n}\n\nexport function showActiveValidationMessages(control: Control, messages: ControlMessage[]) {\n messages.find(m => m.error && control.input.validity[m.error])?.removeAttribute('hidden');\n}\n\nexport function hideInactiveValidationMessages(control: Control, messages: ControlMessage[]) {\n if (messages.find(m => m.error) && control.input.validity.valid) {\n messages.filter(m => m.error && !control.input.validity[m.error!]).forEach(m => m.setAttribute('hidden', ''));\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"states.js","names":[],"sources":["../../../src/forms/utils/states.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n getAttributeChanges,\n getAttributeListChanges,\n getElementUpdate,\n matchesElementName\n} from '@nvidia-elements/core/internal';\nimport type { ControlGroup } from '../control-group/control-group.js';\nimport { ControlMessage } from '../control-message/control-message.js';\nimport type { Control } from '../control/control.js';\n\nexport const inputQuery = 'input, select, selectmenu, textarea, [nve-control]';\n\n/**\n * Adds validation states to custom element\n * :state(valid) form control is in a valid state\n * :state(invalid) form control is in a invalid state\n */\nexport function setupControlValidationStates(control: Control, messages: ControlMessage[]) {\n if (\n !control.input.form?.noValidate &&\n !control.input.formNoValidate &&\n !control.input.hasAttribute('formnovalidate')\n ) {\n hideAllValidationMessages(messages);\n\n /**\n * updateValidityState() logic triggered by input blur() or input() change events\n */\n const updateValidityState = () => {\n if (control.input.validity?.valid) {\n control._internals.states.delete('invalid');\n control._internals.states.add('valid');\n control.status = null!;\n }\n\n hideInactiveValidationMessages(control, messages);\n };\n\n const resetValidityState = () => {\n control.status = null!;\n control._internals.states.delete('valid');\n control._internals.states.delete('invalid');\n hideAllValidationMessages(messages);\n };\n\n control.input.addEventListener('blur', () => {\n control.input.checkValidity();\n updateValidityState();\n });\n\n control.input.addEventListener('input', () => {\n updateValidityState();\n });\n\n control.input.addEventListener('invalid', () => {\n if (messages.find(m => m.error)) {\n hideAllValidationMessages(messages);\n showActiveValidationMessages(control, messages);\n }\n\n control.status = 'error';\n control._internals.states.delete('valid');\n control._internals.states.add('invalid');\n });\n\n control.addEventListener('reset', () => resetValidityState());\n control.input.form?.addEventListener('reset', () => resetValidityState());\n }\n\n control.shadowRoot!.addEventListener('slotchange', () => {\n const messages = Array.from(control.querySelectorAll<ControlMessage>(ControlMessage.metadata.tag));\n control._internals.states.delete('valid');\n control._internals.states.delete('invalid');\n if (messages.find(m => !m.hidden && (m.status === 'error' || m.error))) {\n control._internals.states.add('invalid');\n } else {\n control._internals.states.add('valid');\n }\n });\n}\n\n/**\n * Adds control interaction states to custom element\n * :state(checked) form control is in a checked state\n * :state(disabled) form control is in a disabled state\n * :state(readonly) form control is in a readonly state\n * :state(touched) form control received focus and then blurred\n * :state(dirty) user modified the form control\n */\nexport function setupControlStates(control: Control) {\n const observers: MutationObserver[] = [];\n const states = control._internals.states;\n control.input.checked ? states.add('checked') : states.delete('checked');\n control.input.indeterminate ? states.add('indeterminate') : states.delete('indeterminate');\n control.input.addEventListener('focus', () => control._internals.states.add('focus'));\n control.input.addEventListener('input', () => control._internals.states.add('dirty'));\n control.input.addEventListener('blur', () => {\n control._internals.states.add('touched');\n control._internals.states.delete('focus');\n });\n\n control.input.getRootNode().addEventListener('change', (e: Event) => {\n if ((e.target as HTMLInputElement).name === control.input?.name) {\n control.input.checked ? states.add('checked') : states.delete('checked');\n }\n });\n\n control.input.form?.addEventListener('reset', () => {\n control._internals.states.delete('touched');\n control._internals.states.delete('dirty');\n control._internals.states.delete('error');\n control._internals.states.delete('success');\n control.requestUpdate();\n });\n\n observers.push(\n getElementUpdate(control.input, 'readonly', value =>\n (value === '' ? true : value) ? states.add('readonly') : states.delete('readonly')\n ),\n getElementUpdate(control.input, 'checked', () =>\n control.input.checked ? states.add('checked') : states.delete('checked')\n ),\n getElementUpdate(control.input, 'disabled', value =>\n (value === '' ? true : value) ? states.add('disabled') : states.delete('disabled')\n ),\n getElementUpdate(control.input, 'indeterminate', () =>\n control.input.indeterminate ? states.add('indeterminate') : states.delete('indeterminate')\n )\n );\n return observers;\n}\n\n/**\n * Adds control group interaction states to custom element\n * :state(disabled) any form control within group is in a disabled state\n */\nexport function setupControlGroupStates(controlGroup: ControlGroup) {\n toggleControlGroupDisabledState(controlGroup);\n return getAttributeChanges(controlGroup, 'disabled', () => toggleControlGroupDisabledState(controlGroup));\n}\n\nexport function toggleControlGroupDisabledState(controlGroup: ControlGroup) {\n if (Array.from(controlGroup.inputs).find(i => i.disabled)) {\n controlGroup._internals.states.add('disabled');\n } else {\n controlGroup._internals.states.delete('disabled');\n }\n}\n\n/**\n * Adds control status states to custom element\n * :state(error) form control is in a error state\n * :state(success) form control is in a success state\n */\nexport function setupControlStatusStates(control: Control | ControlGroup, messages: ControlMessage[]) {\n updateControlStatusState(control, messages.find(m => !m.hidden)!);\n const observers: MutationObserver[] = [];\n observers.push(\n getAttributeListChanges(control, ['hidden', 'status'], mutation => {\n const target = mutation.target as ControlMessage;\n if (matchesElementName(target, ControlMessage)) {\n updateControlStatusState(control, target);\n }\n })\n );\n\n control.shadowRoot!.addEventListener('slotchange', () => {\n const messages = Array.from(control.querySelectorAll<ControlMessage>(ControlMessage.metadata.tag));\n const message = messages.find(m => m.status && !m.hidden);\n control._internals.states.delete('error');\n control._internals.states.delete('success');\n if (message) {\n control._internals.states.add(message.status!);\n }\n });\n\n return observers;\n}\n\nexport function updateControlStatusState(control: Control | ControlGroup, message: ControlMessage) {\n control._internals.states.delete('error');\n control._internals.states.delete('success');\n\n if (message?.status?.length && !message?.hidden) {\n control._internals.states.add(message.status);\n }\n}\n\nexport function showNonValidationMessages(messages: ControlMessage[]) {\n messages.filter(m => !m.hasAttribute('error')).forEach(m => m.removeAttribute('hidden'));\n}\n\nexport function hideAllValidationMessages(messages: ControlMessage[]) {\n messages.filter(m => m.hasAttribute('error')).forEach(m => m.setAttribute('hidden', ''));\n}\n\nexport function showActiveValidationMessages(control: Control, messages: ControlMessage[]) {\n messages.find(m => m.error && control.input.validity[m.error])?.removeAttribute('hidden');\n}\n\nexport function hideInactiveValidationMessages(control: Control, messages: ControlMessage[]) {\n if (messages.find(m => m.error) && control.input.validity.valid) {\n messages.filter(m => m.error && !control.input.validity[m.error!]).forEach(m => m.setAttribute('hidden', ''));\n }\n}\n"],"mappings":"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"}
|