@nvidia-elements/core 2.7.3 → 2.8.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +35 -0
- package/README.md +8 -0
- package/dist/_virtual/{_@oxc-project_runtime@0.139.0 → _@oxc-project_runtime@0.147.0}/helpers/esm/decorate.js +1 -1
- package/dist/accordion/accordion.examples.json +9 -9
- package/dist/accordion/accordion2.js +5 -5
- package/dist/accordion/accordion2.js.map +1 -1
- package/dist/alert/alert-group2.js +2 -2
- package/dist/alert/alert-group2.js.map +1 -1
- package/dist/alert/alert.examples.json +3 -3
- package/dist/alert/alert2.js +2 -2
- package/dist/alert/alert2.js.map +1 -1
- package/dist/avatar/avatar-group2.js +1 -1
- package/dist/avatar/avatar-group2.js.map +1 -1
- package/dist/avatar/avatar2.js +2 -2
- package/dist/avatar/avatar2.js.map +1 -1
- package/dist/badge/badge.examples.json +2 -2
- package/dist/badge/badge2.js +2 -2
- package/dist/badge/badge2.js.map +1 -1
- package/dist/breadcrumb/breadcrumb.examples.json +1 -1
- package/dist/breadcrumb/breadcrumb2.js +2 -2
- package/dist/breadcrumb/breadcrumb2.js.map +1 -1
- package/dist/bundles/index.d.ts +8 -0
- package/dist/bundles/index.js +6 -6
- package/dist/button/button.examples.json +3 -3
- package/dist/button/button2.js +2 -2
- package/dist/button/button2.js.map +1 -1
- package/dist/button-group/button-group2.js +2 -2
- package/dist/button-group/button-group2.js.map +1 -1
- package/dist/card/card.examples.json +2 -2
- package/dist/card/card2.js +5 -5
- package/dist/card/card2.js.map +1 -1
- package/dist/chat-message/chat-message.examples.json +4 -4
- package/dist/chat-message/chat-message2.js +2 -2
- package/dist/chat-message/chat-message2.js.map +1 -1
- package/dist/checkbox/checkbox-group2.js +2 -2
- package/dist/checkbox/checkbox-group2.js.map +1 -1
- package/dist/checkbox/checkbox2.js +2 -2
- package/dist/checkbox/checkbox2.js.map +1 -1
- package/dist/color/color2.js +2 -2
- package/dist/color/color2.js.map +1 -1
- package/dist/combobox/combobox.examples.js.map +1 -1
- package/dist/combobox/combobox.examples.json +5 -5
- package/dist/combobox/combobox2.js +7 -5
- package/dist/combobox/combobox2.js.map +1 -1
- package/dist/copy-button/copy-button.examples.json +2 -2
- package/dist/copy-button/copy-button2.js +2 -2
- package/dist/copy-button/copy-button2.js.map +1 -1
- package/dist/custom-elements-jsx.d.ts +5 -1
- package/dist/custom-elements-vue.d.ts +5 -1
- package/dist/custom-elements.json +50 -34
- package/dist/data.html.json +2 -2
- package/dist/date/date2.js +2 -2
- package/dist/date/date2.js.map +1 -1
- package/dist/datetime/datetime2.js +2 -2
- package/dist/datetime/datetime2.js.map +1 -1
- package/dist/dialog/dialog-footer2.js +2 -2
- package/dist/dialog/dialog-footer2.js.map +1 -1
- package/dist/dialog/dialog-header2.js +2 -2
- package/dist/dialog/dialog-header2.js.map +1 -1
- package/dist/dialog/dialog.examples.json +3 -3
- package/dist/dialog/dialog2.js +2 -2
- package/dist/dialog/dialog2.js.map +1 -1
- package/dist/divider/divider.examples.json +1 -1
- package/dist/divider/divider2.js +2 -2
- package/dist/divider/divider2.js.map +1 -1
- package/dist/dot/dot2.js +2 -2
- package/dist/dot/dot2.js.map +1 -1
- package/dist/drawer/drawer-content2.js +2 -2
- package/dist/drawer/drawer-content2.js.map +1 -1
- package/dist/drawer/drawer-footer2.js +2 -2
- package/dist/drawer/drawer-footer2.js.map +1 -1
- package/dist/drawer/drawer-header2.js +2 -2
- package/dist/drawer/drawer-header2.js.map +1 -1
- package/dist/drawer/drawer2.js +2 -2
- package/dist/drawer/drawer2.js.map +1 -1
- package/dist/dropdown/dropdown-footer2.js +2 -2
- package/dist/dropdown/dropdown-footer2.js.map +1 -1
- package/dist/dropdown/dropdown-header2.js +2 -2
- package/dist/dropdown/dropdown-header2.js.map +1 -1
- package/dist/dropdown/dropdown2.js +2 -2
- package/dist/dropdown/dropdown2.js.map +1 -1
- package/dist/dropdown-group/dropdown-group.examples.json +4 -4
- package/dist/dropdown-group/dropdown-group.js +2 -2
- package/dist/dropdown-group/dropdown-group.js.map +1 -1
- package/dist/dropzone/dropzone.examples.json +1 -1
- package/dist/dropzone/dropzone2.js +2 -2
- package/dist/dropzone/dropzone2.js.map +1 -1
- package/dist/file/file2.js +1 -1
- package/dist/file/file2.js.map +1 -1
- package/dist/format-bytes/format-bytes2.js +2 -2
- package/dist/format-bytes/format-bytes2.js.map +1 -1
- package/dist/format-datetime/format-datetime.examples.json +3 -3
- package/dist/format-datetime/format-datetime2.js +2 -2
- package/dist/format-datetime/format-datetime2.js.map +1 -1
- package/dist/format-number/format-number2.js +2 -2
- package/dist/format-number/format-number2.js.map +1 -1
- 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/format-truncate/format-truncate.examples.json +4 -4
- package/dist/format-truncate/format-truncate2.js +2 -2
- package/dist/format-truncate/format-truncate2.js.map +1 -1
- package/dist/forms/actions.examples.json +1 -1
- package/dist/forms/control/control.examples.json +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-group2.js +2 -2
- package/dist/forms/control-group/control-group2.js.map +1 -1
- package/dist/forms/control-message/control-message2.js +2 -2
- package/dist/forms/control-message/control-message2.js.map +1 -1
- package/dist/forms/validation.examples.js.map +1 -1
- package/dist/gauge/gauge.examples.json +2 -2
- package/dist/gauge/gauge2.js +2 -2
- package/dist/gauge/gauge2.js.map +1 -1
- package/dist/grid/cell/cell2.js +1 -1
- package/dist/grid/cell/cell2.js.map +1 -1
- package/dist/grid/column/column2.js +2 -2
- package/dist/grid/column/column2.js.map +1 -1
- package/dist/grid/footer/footer2.js +2 -2
- package/dist/grid/footer/footer2.js.map +1 -1
- package/dist/grid/grid.examples.js.map +1 -1
- package/dist/grid/grid.examples.json +34 -34
- package/dist/grid/grid2.js +2 -2
- package/dist/grid/grid2.js.map +1 -1
- package/dist/grid/header/header2.js +2 -2
- package/dist/grid/header/header2.js.map +1 -1
- package/dist/grid/placeholder/placeholder2.js +1 -1
- package/dist/grid/placeholder/placeholder2.js.map +1 -1
- package/dist/grid/row/row2.js +2 -2
- package/dist/grid/row/row2.js.map +1 -1
- package/dist/icon/icon2.js +3 -3
- package/dist/icon/icon2.js.map +1 -1
- package/dist/icon-button/icon-button2.js +2 -2
- package/dist/icon-button/icon-button2.js.map +1 -1
- package/dist/index.js +1 -1
- package/dist/input/input-group2.js +1 -1
- package/dist/input/input-group2.js.map +1 -1
- package/dist/input/input2.js +2 -2
- package/dist/input/input2.js.map +1 -1
- package/dist/internal/controllers/audit.controller.js +9 -7
- package/dist/internal/controllers/audit.controller.js.map +1 -1
- package/dist/internal/controllers/gesture.controller.examples.js.map +1 -1
- package/dist/internal/controllers/gesture.controller.js +1 -3
- package/dist/internal/controllers/gesture.controller.js.map +1 -1
- package/dist/internal/controllers/i18n.controller.examples.js.map +1 -1
- package/dist/internal/controllers/i18n.controller.js.map +1 -1
- package/dist/internal/controllers/keynav-grid.controller.examples.json +1 -1
- package/dist/internal/controllers/keynav-grid.controller.js.map +1 -1
- package/dist/internal/controllers/keynav-list.controller.examples.json +1 -1
- package/dist/internal/controllers/keynav-list.controller.js +1 -4
- package/dist/internal/controllers/keynav-list.controller.js.map +1 -1
- package/dist/internal/controllers/keynav-spatial.controller.js.map +1 -1
- package/dist/internal/controllers/popover.examples.json +2 -2
- package/dist/internal/controllers/state-scroll.controller.js.map +1 -1
- package/dist/internal/controllers/type-anchor.controller.js.map +1 -1
- package/dist/internal/controllers/type-closable.controller.js.map +1 -1
- package/dist/internal/controllers/type-expandable.controller.js.map +1 -1
- package/dist/internal/controllers/type-native-popover.controller.js.map +1 -1
- package/dist/internal/controllers/type-native-popover.utils.js +2 -2
- package/dist/internal/controllers/type-native-popover.utils.js.map +1 -1
- package/dist/internal/controllers/type-selectable.controller.js.map +1 -1
- package/dist/internal/controllers/type-ssr.controller.js.map +1 -1
- package/dist/internal/services/global.service.js +1 -1
- package/dist/internal/services/global.utils.js.map +1 -1
- package/dist/internal/services/log.service.js.map +1 -1
- package/dist/internal/services/transition.service.js.map +1 -1
- package/dist/internal/utils/dom.js +2 -1
- package/dist/internal/utils/dom.js.map +1 -1
- package/dist/internal/utils/strings.js +1 -1
- package/dist/internal/utils/strings.js.map +1 -1
- package/dist/logo/logo.examples.json +1 -1
- package/dist/logo/logo2.js +2 -2
- package/dist/logo/logo2.js.map +1 -1
- package/dist/menu/menu-item2.js +2 -2
- package/dist/menu/menu-item2.js.map +1 -1
- package/dist/menu/menu.examples.js.map +1 -1
- package/dist/menu/menu.examples.json +4 -4
- package/dist/menu/menu2.js +2 -2
- package/dist/menu/menu2.js.map +1 -1
- package/dist/month/month2.js +2 -2
- package/dist/month/month2.js.map +1 -1
- package/dist/notification/notification-group2.js +2 -2
- package/dist/notification/notification-group2.js.map +1 -1
- package/dist/notification/notification.examples.json +3 -3
- package/dist/notification/notification2.js +2 -2
- package/dist/notification/notification2.js.map +1 -1
- package/dist/page/page-panel/page-panel-content2.js +1 -1
- package/dist/page/page-panel/page-panel-content2.js.map +1 -1
- package/dist/page/page-panel/page-panel-footer2.js +2 -2
- package/dist/page/page-panel/page-panel-footer2.js.map +1 -1
- package/dist/page/page-panel/page-panel-header2.js +2 -2
- package/dist/page/page-panel/page-panel-header2.js.map +1 -1
- package/dist/page/page-panel/page-panel2.js +2 -2
- package/dist/page/page-panel/page-panel2.js.map +1 -1
- package/dist/page/page.examples.json +10 -10
- package/dist/page/page2.js +2 -2
- package/dist/page/page2.js.map +1 -1
- package/dist/page-header/page-header.examples.json +1 -1
- package/dist/page-header/page-header2.js +1 -1
- package/dist/page-header/page-header2.js.map +1 -1
- package/dist/page-loader/page-loader2.js +2 -2
- package/dist/page-loader/page-loader2.js.map +1 -1
- package/dist/pagination/pagination.examples.json +6 -6
- package/dist/pagination/pagination2.js +2 -2
- package/dist/pagination/pagination2.js.map +1 -1
- package/dist/panel/panel2.js +5 -5
- package/dist/panel/panel2.js.map +1 -1
- package/dist/password/password2.js +2 -2
- package/dist/password/password2.js.map +1 -1
- package/dist/polyfills/index.js +1 -1
- package/dist/polyfills/index.js.map +1 -1
- package/dist/preferences-input/preferences-input.examples.json +1 -1
- package/dist/preferences-input/preferences-input2.js +2 -2
- package/dist/preferences-input/preferences-input2.js.map +1 -1
- package/dist/progress-bar/progress-bar.examples.json +1 -1
- package/dist/progress-bar/progress-bar2.js +2 -2
- package/dist/progress-bar/progress-bar2.js.map +1 -1
- package/dist/progress-ring/progress-ring2.js +2 -2
- package/dist/progress-ring/progress-ring2.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 +2 -2
- package/dist/pulse/pulse2.js.map +1 -1
- package/dist/radio/radio-group2.js +2 -2
- package/dist/radio/radio-group2.js.map +1 -1
- package/dist/radio/radio2.js +2 -2
- package/dist/radio/radio2.js.map +1 -1
- package/dist/range/range.examples.json +1 -1
- package/dist/range/range2.js +4 -4
- package/dist/range/range2.js.map +1 -1
- package/dist/resize-handle/resize-handle.examples.json +4 -4
- package/dist/resize-handle/resize-handle2.js +2 -2
- package/dist/resize-handle/resize-handle2.js.map +1 -1
- package/dist/search/search2.js +2 -2
- package/dist/search/search2.js.map +1 -1
- package/dist/select/select2.js +2 -2
- package/dist/select/select2.js.map +1 -1
- package/dist/skeleton/skeleton2.js +2 -2
- package/dist/skeleton/skeleton2.js.map +1 -1
- package/dist/sort-button/sort-button2.js +2 -2
- package/dist/sort-button/sort-button2.js.map +1 -1
- package/dist/sparkline/sparkline.examples.json +2 -2
- package/dist/sparkline/sparkline.utils.js +1 -3
- package/dist/sparkline/sparkline.utils.js.map +1 -1
- package/dist/sparkline/sparkline2.js +8 -6
- package/dist/sparkline/sparkline2.js.map +1 -1
- package/dist/star-rating/star-rating2.js +2 -2
- package/dist/star-rating/star-rating2.js.map +1 -1
- package/dist/steps/steps2.js +3 -3
- package/dist/steps/steps2.js.map +1 -1
- package/dist/switch/switch-group2.js +2 -2
- package/dist/switch/switch-group2.js.map +1 -1
- package/dist/switch/switch2.js +2 -2
- package/dist/switch/switch2.js.map +1 -1
- package/dist/tabs/tabs-group2.js +2 -2
- package/dist/tabs/tabs-group2.js.map +1 -1
- package/dist/tabs/tabs.examples.json +4 -4
- package/dist/tabs/tabs2.js +3 -3
- package/dist/tabs/tabs2.js.map +1 -1
- package/dist/tag/tag.d.ts +2 -0
- package/dist/tag/tag.examples.js.map +1 -1
- package/dist/tag/tag.examples.json +20 -3
- package/dist/tag/tag.js +1 -1
- package/dist/tag/tag.js.map +1 -1
- package/dist/tag/tag2.js +3 -3
- package/dist/tag/tag2.js.map +1 -1
- package/dist/textarea/textarea.d.ts +7 -1
- package/dist/textarea/textarea.examples.js.map +1 -1
- package/dist/textarea/textarea.examples.json +22 -0
- package/dist/textarea/textarea.js +1 -1
- package/dist/textarea/textarea.js.map +1 -1
- package/dist/textarea/textarea2.js +10 -3
- package/dist/textarea/textarea2.js.map +1 -1
- package/dist/time/time2.js +2 -2
- package/dist/time/time2.js.map +1 -1
- package/dist/toast/toast.examples.json +1 -1
- package/dist/toast/toast2.js +2 -2
- package/dist/toast/toast2.js.map +1 -1
- package/dist/toggletip/toggletip-footer2.js +2 -2
- package/dist/toggletip/toggletip-footer2.js.map +1 -1
- package/dist/toggletip/toggletip-header2.js +2 -2
- package/dist/toggletip/toggletip-header2.js.map +1 -1
- package/dist/toggletip/toggletip2.js +2 -2
- package/dist/toggletip/toggletip2.js.map +1 -1
- package/dist/toolbar/toolbar2.js +2 -2
- package/dist/toolbar/toolbar2.js.map +1 -1
- package/dist/tooltip/tooltip.examples.js.map +1 -1
- package/dist/tooltip/tooltip.examples.json +2 -2
- package/dist/tooltip/tooltip2.js +2 -2
- package/dist/tooltip/tooltip2.js.map +1 -1
- package/dist/tree/tree-node2.js +2 -2
- package/dist/tree/tree-node2.js.map +1 -1
- package/dist/tree/tree.examples.js.map +1 -1
- package/dist/tree/tree2.js +2 -2
- package/dist/tree/tree2.js.map +1 -1
- package/dist/week/week2.js +2 -2
- package/dist/week/week2.js.map +1 -1
- package/package.json +9 -9
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropzone2.js","names":[
|
|
1
|
+
{"version":3,"file":"dropzone2.js","names":[],"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/mixins';\nimport { fileTypeValidator, fileSizeValidator, getFileTypeSpecifiers } from './dropzone.util';\n\n/* eslint-disable jsdoc/no-types */\n// Explicit JSDoc type because the CEM analyzer loses the inherited generic specialization.\n\n/**\n * @element nve-dropzone\n * @description A dropzone form control that enables users to drag and drop files onto it.\n * @documentation https://nvidia.github.io/elements/docs/elements/dropzone/\n * @since 1.29.0\n * @entrypoint \\@nvidia-elements/core/dropzone\n * @property {File[]} value - Files selected or dropped by the user. Assign files through the JavaScript property; the HTML `value` attribute is not supported.\n * @event change - Dispatched when the value has changed (files located in event.target)\n * @slot - Custom messaging that replaces the default upload instructions.\n * @cssprop --background\n * @cssprop --border-color\n * @cssprop --border-radius\n * @cssprop --padding\n * @cssprop --min-height\n * @cssprop --color\n * @slot icon - Custom icon that replaces the default upload icon.\n * @csspart icon - The upload icon element\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file\n */\n@scopedRegistry()\nexport class Dropzone extends FormControlMixin<typeof LitElement, File[]>(LitElement) {\n /** Comma-separated file extensions or MIME types accepted by the dropzone. */\n @property()\n accept: string = `image/gif, image/jpeg, image/png, image/svg+xml`;\n\n /** File size limit in bytes. */\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 /** @protected */\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=\"dropzone-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=\"dropzone-text-center\">\n <div class=\"dropzone-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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"}
|
package/dist/file/file2.js
CHANGED
package/dist/file/file2.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"file2.js","names":[],"sources":["../../src/file/file.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { CSSResult } from 'lit';\nimport { appendRootNodeStyle, useStyles } from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport styles from './file.css?inline';\nimport globalStyles from './file.global.css?inline';\n\n/**\n * @element nve-file\n * @description A file picker is a control that enables users to choose a file value.\n * @documentation https://nvidia.github.io/elements/docs/elements/file/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/file\n * @cssprop --background\n * @cssprop --padding\n * @cssprop --border-radius\n * @cssprop --border\n * @cssprop --font-weight\n * @cssprop --font-size\n * @cssprop --text-decoration\n * @cssprop --cursor\n * @cssprop --gap\n * @cssprop --height\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file\n */\nexport class File extends Control {\n static styles: CSSResult[] = useStyles([...Control.styles, styles]);\n\n static readonly metadata = {\n tag: 'nve-file',\n version: '0.0.0'\n };\n\n connectedCallback() {\n super.connectedCallback();\n appendRootNodeStyle(this, globalStyles);\n }\n}\n"],"mappings":";;;;;;AA2BA,IAAa,IAAb,cAA0B,EAAQ;;
|
|
1
|
+
{"version":3,"file":"file2.js","names":[],"sources":["../../src/file/file.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { CSSResult } from 'lit';\nimport { appendRootNodeStyle, useStyles } from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport styles from './file.css?inline';\nimport globalStyles from './file.global.css?inline';\n\n/**\n * @element nve-file\n * @description A file picker is a control that enables users to choose a file value.\n * @documentation https://nvidia.github.io/elements/docs/elements/file/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/file\n * @cssprop --background\n * @cssprop --padding\n * @cssprop --border-radius\n * @cssprop --border\n * @cssprop --font-weight\n * @cssprop --font-size\n * @cssprop --text-decoration\n * @cssprop --cursor\n * @cssprop --gap\n * @cssprop --height\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file\n */\nexport class File extends Control {\n static styles: CSSResult[] = useStyles([...Control.styles, styles]);\n\n static readonly metadata = {\n tag: 'nve-file',\n version: '0.0.0'\n };\n\n connectedCallback() {\n super.connectedCallback();\n appendRootNodeStyle(this, globalStyles);\n }\n}\n"],"mappings":";;;;;;AA2BA,IAAa,IAAb,cAA0B,EAAQ;;EACH,KAAA,SAAA,EAAU,CAAC,GAAG,EAAQ,QAAQ,CAAM,CAAC;;;EAEvC,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;CAEA,oBAAoB;EAElB,AADA,MAAM,kBAAkB,GACxB,EAAoB,MAAM,CAAY;CACxC;AACF"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { LogService as e } from "../internal/services/log.service.js";
|
|
2
2
|
import { typeSSR as t } from "../internal/controllers/type-ssr.controller.js";
|
|
3
3
|
import { useStyles as n } from "../internal/styles/index.js";
|
|
4
|
-
import r from "../_virtual/_@oxc-project_runtime@0.
|
|
4
|
+
import r from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
|
|
5
5
|
import i from "./format-bytes.js";
|
|
6
6
|
import { LitElement as a, html as o } from "lit";
|
|
7
7
|
import { property as s } from "lit/decorators/property.js";
|
|
@@ -95,7 +95,7 @@ var g = class extends a {
|
|
|
95
95
|
static {
|
|
96
96
|
this.metadata = {
|
|
97
97
|
tag: "nve-format-bytes",
|
|
98
|
-
version: "2.
|
|
98
|
+
version: "2.8.1"
|
|
99
99
|
};
|
|
100
100
|
}
|
|
101
101
|
get #e() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"format-bytes2.js","names":["#rawValue","#resolvedLocale","#parsedValue","#warnInvalidOption","#numberFormatOptions","#formattedBytes","#hasValidConfiguration","#resolveAutoUnit","#roundNumber","#formatNumber","#formatLabel","#onSlotChange"],"sources":["../../src/format-bytes/format-bytes.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 { LogService, typeSSR, useStyles } from '@nvidia-elements/core/internal';\nimport styles from './format-bytes.css?inline';\n\nexport type FormatBytesDisplay = 'decimal' | 'binary';\nexport type FormatBytesUnit = 'b' | 'kb' | 'mb' | 'gb' | 'tb' | 'pb';\nexport type FormatBytesUnitDisplay = 'short' | 'long';\n\ninterface UnitLabels {\n short: string;\n singular: string;\n plural: string;\n}\n\nconst UNITS: readonly FormatBytesUnit[] = ['b', 'kb', 'mb', 'gb', 'tb', 'pb'];\nconst DISPLAYS: readonly FormatBytesDisplay[] = ['decimal', 'binary'];\nconst UNIT_DISPLAYS: readonly FormatBytesUnitDisplay[] = ['short', 'long'];\n\nconst DECIMAL_LABELS: Record<FormatBytesUnit, UnitLabels> = {\n b: { short: 'B', singular: 'byte', plural: 'bytes' },\n kb: { short: 'kB', singular: 'kilobyte', plural: 'kilobytes' },\n mb: { short: 'MB', singular: 'megabyte', plural: 'megabytes' },\n gb: { short: 'GB', singular: 'gigabyte', plural: 'gigabytes' },\n tb: { short: 'TB', singular: 'terabyte', plural: 'terabytes' },\n pb: { short: 'PB', singular: 'petabyte', plural: 'petabytes' }\n};\n\nconst BINARY_LABELS: Record<FormatBytesUnit, UnitLabels> = {\n b: { short: 'B', singular: 'byte', plural: 'bytes' },\n kb: { short: 'KiB', singular: 'kibibyte', plural: 'kibibytes' },\n mb: { short: 'MiB', singular: 'mebibyte', plural: 'mebibytes' },\n gb: { short: 'GiB', singular: 'gibibyte', plural: 'gibibytes' },\n tb: { short: 'TiB', singular: 'tebibyte', plural: 'tebibytes' },\n pb: { short: 'PiB', singular: 'pebibyte', plural: 'pebibytes' }\n};\n\nfunction isDisplay(value: unknown): value is FormatBytesDisplay {\n return DISPLAYS.some(display => display === value);\n}\n\nfunction isUnit(value: unknown): value is FormatBytesUnit {\n return UNITS.some(unit => unit === value);\n}\n\nfunction isUnitDisplay(value: unknown): value is FormatBytesUnitDisplay {\n return UNIT_DISPLAYS.some(unitDisplay => unitDisplay === value);\n}\n\n/**\n * @element nve-format-bytes\n * @description Formats a byte count as localized, human-readable decimal or binary units.\n * @documentation https://nvidia.github.io/elements/docs/elements/format-bytes/\n * @since 0.0.0\n * @entrypoint \\@nvidia-elements/core/format-bytes\n * @slot - Numeric byte count to format (such as 1048576). Serves as fallback before hydration.\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/data\n */\n@typeSSR()\nexport class FormatBytes extends LitElement {\n static styles = useStyles([styles]);\n\n static readonly metadata = {\n tag: 'nve-format-bytes',\n version: '0.0.0'\n };\n\n /**\n * Optional byte count for values supplied by JavaScript or bound data.\n * By default, the component formats the element's text content, which also serves as the SSR fallback.\n * When both are present, this property takes precedence.\n */\n @property({ type: Number }) value?: number;\n\n /**\n * Unit system: 'decimal' uses powers of 1000 and 'binary' uses powers of 1024.\n */\n @property({ type: String }) display: FormatBytesDisplay = 'decimal';\n\n /**\n * Optional unit magnitude. When omitted, the component selects a unit from the byte count.\n */\n @property({ type: String }) unit?: FormatBytesUnit;\n\n /**\n * Unit label length: 'short' renders labels such as 'MB'; 'long' renders labels such as 'megabytes'.\n */\n @property({ type: String, attribute: 'unit-display' }) unitDisplay: FormatBytesUnitDisplay = 'short';\n\n /**\n * Language tag (such as en-US or de-DE) used to format the number.\n * Defaults to document.documentElement.lang or the runtime default.\n */\n @property({ type: String }) locale?: string;\n\n /**\n * Pad fraction output to at least this many digits.\n */\n @property({ type: Number, attribute: 'minimum-fraction-digits' }) minimumFractionDigits?: number;\n\n /**\n * Round fraction output to at most this many digits. Defaults to two effective digits after the decimal point.\n */\n @property({ type: Number, attribute: 'maximum-fraction-digits' }) maximumFractionDigits?: number;\n\n get #rawValue(): string {\n const value = Number.isNaN(this.value) ? (this.getAttribute('value') ?? this.value) : this.value;\n return String(value ?? this.textContent?.trim() ?? '');\n }\n\n get #resolvedLocale(): string | undefined {\n return this.locale ?? (globalThis.document?.documentElement?.lang || undefined);\n }\n\n get #parsedValue(): number | null {\n const rawValue = this.#rawValue;\n if (!rawValue) return null;\n\n const numericValue = Number(rawValue);\n if (Number.isFinite(numericValue)) return numericValue;\n\n LogService.warn(`format-bytes: invalid numeric value \"${rawValue}\"`);\n return null;\n }\n\n #resolveAutoUnit(value: number, display: FormatBytesDisplay): FormatBytesUnit {\n const base = display === 'binary' ? 1024 : 1000;\n const absoluteValue = Math.abs(value);\n\n for (let index = UNITS.length - 1; index > 0; index--) {\n const unit = UNITS[index];\n if (unit && absoluteValue >= base ** index) return unit;\n }\n\n return 'b';\n }\n\n #formatLabel(unit: FormatBytesUnit, convertedValue: number): string {\n const labels = this.display === 'binary' ? BINARY_LABELS[unit] : DECIMAL_LABELS[unit];\n if (this.unitDisplay === 'short') return labels.short;\n return Math.abs(convertedValue) === 1 ? labels.singular : labels.plural;\n }\n\n #warnInvalidOption(name: string, value: unknown): void {\n LogService.warn(`format-bytes: invalid ${name} value \"${String(value)}\"`);\n }\n\n #hasValidConfiguration(): boolean {\n if (!isDisplay(this.display)) {\n this.#warnInvalidOption('display', this.display);\n return false;\n }\n if (!isUnitDisplay(this.unitDisplay)) {\n this.#warnInvalidOption('unit-display', this.unitDisplay);\n return false;\n }\n if (this.unit !== undefined && !isUnit(this.unit)) {\n this.#warnInvalidOption('unit', this.unit);\n return false;\n }\n return true;\n }\n\n get #numberFormatOptions(): Intl.NumberFormatOptions {\n const effectiveMaximumFractionDigits = this.maximumFractionDigits ?? Math.max(this.minimumFractionDigits ?? 0, 2);\n return {\n minimumFractionDigits: this.minimumFractionDigits,\n maximumFractionDigits: effectiveMaximumFractionDigits\n };\n }\n\n #roundNumber(value: number): number {\n return Number(\n new Intl.NumberFormat('en-US-u-nu-latn', {\n ...this.#numberFormatOptions,\n useGrouping: false\n }).format(value)\n );\n }\n\n #formatNumber(value: number): string {\n return new Intl.NumberFormat(this.#resolvedLocale, this.#numberFormatOptions).format(value);\n }\n\n get #formattedBytes(): string {\n const rawValue = this.#rawValue;\n if (!rawValue) return '';\n\n const numericValue = this.#parsedValue;\n if (numericValue === null) return rawValue;\n if (!this.#hasValidConfiguration()) return rawValue;\n\n const resolvedUnit = this.unit ?? this.#resolveAutoUnit(numericValue, this.display);\n const unitIndex = UNITS.indexOf(resolvedUnit);\n const base = this.display === 'binary' ? 1024 : 1000;\n const convertedValue = numericValue / base ** unitIndex;\n\n try {\n const roundedValue = this.#roundNumber(convertedValue);\n return `${this.#formatNumber(roundedValue)} ${this.#formatLabel(resolvedUnit, roundedValue)}`;\n } catch (error) {\n const message = error instanceof Error ? error.message : String(error);\n LogService.warn(`format-bytes: ${message}`);\n return rawValue;\n }\n }\n\n render() {\n return html`<data internal-host value=${this.#rawValue}>${this.#formattedBytes}<slot @slotchange=${this.#onSlotChange} hidden></slot></data>`;\n }\n\n #onSlotChange() {\n this.requestUpdate();\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"format-bytes2.js","names":[],"sources":["../../src/format-bytes/format-bytes.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 { LogService, typeSSR, useStyles } from '@nvidia-elements/core/internal';\nimport styles from './format-bytes.css?inline';\n\nexport type FormatBytesDisplay = 'decimal' | 'binary';\nexport type FormatBytesUnit = 'b' | 'kb' | 'mb' | 'gb' | 'tb' | 'pb';\nexport type FormatBytesUnitDisplay = 'short' | 'long';\n\ninterface UnitLabels {\n short: string;\n singular: string;\n plural: string;\n}\n\nconst UNITS: readonly FormatBytesUnit[] = ['b', 'kb', 'mb', 'gb', 'tb', 'pb'];\nconst DISPLAYS: readonly FormatBytesDisplay[] = ['decimal', 'binary'];\nconst UNIT_DISPLAYS: readonly FormatBytesUnitDisplay[] = ['short', 'long'];\n\nconst DECIMAL_LABELS: Record<FormatBytesUnit, UnitLabels> = {\n b: { short: 'B', singular: 'byte', plural: 'bytes' },\n kb: { short: 'kB', singular: 'kilobyte', plural: 'kilobytes' },\n mb: { short: 'MB', singular: 'megabyte', plural: 'megabytes' },\n gb: { short: 'GB', singular: 'gigabyte', plural: 'gigabytes' },\n tb: { short: 'TB', singular: 'terabyte', plural: 'terabytes' },\n pb: { short: 'PB', singular: 'petabyte', plural: 'petabytes' }\n};\n\nconst BINARY_LABELS: Record<FormatBytesUnit, UnitLabels> = {\n b: { short: 'B', singular: 'byte', plural: 'bytes' },\n kb: { short: 'KiB', singular: 'kibibyte', plural: 'kibibytes' },\n mb: { short: 'MiB', singular: 'mebibyte', plural: 'mebibytes' },\n gb: { short: 'GiB', singular: 'gibibyte', plural: 'gibibytes' },\n tb: { short: 'TiB', singular: 'tebibyte', plural: 'tebibytes' },\n pb: { short: 'PiB', singular: 'pebibyte', plural: 'pebibytes' }\n};\n\nfunction isDisplay(value: unknown): value is FormatBytesDisplay {\n return DISPLAYS.some(display => display === value);\n}\n\nfunction isUnit(value: unknown): value is FormatBytesUnit {\n return UNITS.some(unit => unit === value);\n}\n\nfunction isUnitDisplay(value: unknown): value is FormatBytesUnitDisplay {\n return UNIT_DISPLAYS.some(unitDisplay => unitDisplay === value);\n}\n\n/**\n * @element nve-format-bytes\n * @description Formats a byte count as localized, human-readable decimal or binary units.\n * @documentation https://nvidia.github.io/elements/docs/elements/format-bytes/\n * @since 0.0.0\n * @entrypoint \\@nvidia-elements/core/format-bytes\n * @slot - Numeric byte count to format (such as 1048576). Serves as fallback before hydration.\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/data\n */\n@typeSSR()\nexport class FormatBytes extends LitElement {\n static styles = useStyles([styles]);\n\n static readonly metadata = {\n tag: 'nve-format-bytes',\n version: '0.0.0'\n };\n\n /**\n * Optional byte count for values supplied by JavaScript or bound data.\n * By default, the component formats the element's text content, which also serves as the SSR fallback.\n * When both are present, this property takes precedence.\n */\n @property({ type: Number }) value?: number;\n\n /**\n * Unit system: 'decimal' uses powers of 1000 and 'binary' uses powers of 1024.\n */\n @property({ type: String }) display: FormatBytesDisplay = 'decimal';\n\n /**\n * Optional unit magnitude. When omitted, the component selects a unit from the byte count.\n */\n @property({ type: String }) unit?: FormatBytesUnit;\n\n /**\n * Unit label length: 'short' renders labels such as 'MB'; 'long' renders labels such as 'megabytes'.\n */\n @property({ type: String, attribute: 'unit-display' }) unitDisplay: FormatBytesUnitDisplay = 'short';\n\n /**\n * Language tag (such as en-US or de-DE) used to format the number.\n * Defaults to document.documentElement.lang or the runtime default.\n */\n @property({ type: String }) locale?: string;\n\n /**\n * Pad fraction output to at least this many digits.\n */\n @property({ type: Number, attribute: 'minimum-fraction-digits' }) minimumFractionDigits?: number;\n\n /**\n * Round fraction output to at most this many digits. Defaults to two effective digits after the decimal point.\n */\n @property({ type: Number, attribute: 'maximum-fraction-digits' }) maximumFractionDigits?: number;\n\n get #rawValue(): string {\n const value = Number.isNaN(this.value) ? (this.getAttribute('value') ?? this.value) : this.value;\n return String(value ?? this.textContent?.trim() ?? '');\n }\n\n get #resolvedLocale(): string | undefined {\n return this.locale ?? (globalThis.document?.documentElement?.lang || undefined);\n }\n\n get #parsedValue(): number | null {\n const rawValue = this.#rawValue;\n if (!rawValue) return null;\n\n const numericValue = Number(rawValue);\n if (Number.isFinite(numericValue)) return numericValue;\n\n LogService.warn(`format-bytes: invalid numeric value \"${rawValue}\"`);\n return null;\n }\n\n #resolveAutoUnit(value: number, display: FormatBytesDisplay): FormatBytesUnit {\n const base = display === 'binary' ? 1024 : 1000;\n const absoluteValue = Math.abs(value);\n\n for (let index = UNITS.length - 1; index > 0; index--) {\n const unit = UNITS[index];\n if (unit && absoluteValue >= base ** index) return unit;\n }\n\n return 'b';\n }\n\n #formatLabel(unit: FormatBytesUnit, convertedValue: number): string {\n const labels = this.display === 'binary' ? BINARY_LABELS[unit] : DECIMAL_LABELS[unit];\n if (this.unitDisplay === 'short') return labels.short;\n return Math.abs(convertedValue) === 1 ? labels.singular : labels.plural;\n }\n\n #warnInvalidOption(name: string, value: unknown): void {\n LogService.warn(`format-bytes: invalid ${name} value \"${String(value)}\"`);\n }\n\n #hasValidConfiguration(): boolean {\n if (!isDisplay(this.display)) {\n this.#warnInvalidOption('display', this.display);\n return false;\n }\n if (!isUnitDisplay(this.unitDisplay)) {\n this.#warnInvalidOption('unit-display', this.unitDisplay);\n return false;\n }\n if (this.unit !== undefined && !isUnit(this.unit)) {\n this.#warnInvalidOption('unit', this.unit);\n return false;\n }\n return true;\n }\n\n get #numberFormatOptions(): Intl.NumberFormatOptions {\n const effectiveMaximumFractionDigits = this.maximumFractionDigits ?? Math.max(this.minimumFractionDigits ?? 0, 2);\n return {\n minimumFractionDigits: this.minimumFractionDigits,\n maximumFractionDigits: effectiveMaximumFractionDigits\n };\n }\n\n #roundNumber(value: number): number {\n return Number(\n new Intl.NumberFormat('en-US-u-nu-latn', {\n ...this.#numberFormatOptions,\n useGrouping: false\n }).format(value)\n );\n }\n\n #formatNumber(value: number): string {\n return new Intl.NumberFormat(this.#resolvedLocale, this.#numberFormatOptions).format(value);\n }\n\n get #formattedBytes(): string {\n const rawValue = this.#rawValue;\n if (!rawValue) return '';\n\n const numericValue = this.#parsedValue;\n if (numericValue === null) return rawValue;\n if (!this.#hasValidConfiguration()) return rawValue;\n\n const resolvedUnit = this.unit ?? this.#resolveAutoUnit(numericValue, this.display);\n const unitIndex = UNITS.indexOf(resolvedUnit);\n const base = this.display === 'binary' ? 1024 : 1000;\n const convertedValue = numericValue / base ** unitIndex;\n\n try {\n const roundedValue = this.#roundNumber(convertedValue);\n return `${this.#formatNumber(roundedValue)} ${this.#formatLabel(resolvedUnit, roundedValue)}`;\n } catch (error) {\n const message = error instanceof Error ? error.message : String(error);\n LogService.warn(`format-bytes: ${message}`);\n return rawValue;\n }\n }\n\n render() {\n return html`<data internal-host value=${this.#rawValue}>${this.#formattedBytes}<slot @slotchange=${this.#onSlotChange} hidden></slot></data>`;\n }\n\n #onSlotChange() {\n this.requestUpdate();\n }\n}\n"],"mappings":"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"}
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
{
|
|
33
33
|
"id": "format-datetime-granular",
|
|
34
34
|
"name": "Granular",
|
|
35
|
-
"template": "<div nve-layout=\"column gap:sm\">\n <nve-format-datetime weekday=\"long\" month=\"short\" day=\"numeric\" year=\"numeric\"
|
|
35
|
+
"template": "<div nve-layout=\"column gap:sm\">\n <nve-format-datetime weekday=\"long\" month=\"short\" day=\"numeric\" year=\"numeric\">2023-07-28T04:20:17.434Z</nve-format-datetime>\n <nve-format-datetime month=\"long\" year=\"numeric\">2023-07-28T04:20:17.434Z</nve-format-datetime>\n</div>\n",
|
|
36
36
|
"summary": "Granular date part options for precise formatting control. Use when presets don't match your layout, such as weekday and month only. Do not combine with date-style or time-style; style presets take priority if both appear.",
|
|
37
37
|
"description": "",
|
|
38
38
|
"composition": false,
|
|
@@ -68,7 +68,7 @@
|
|
|
68
68
|
{
|
|
69
69
|
"id": "format-datetime-time-zone",
|
|
70
70
|
"name": "TimeZone",
|
|
71
|
-
"template": "<div nve-layout=\"column gap:sm\">\n <nve-format-datetime date-style=\"long\" time-style=\"long\" time-zone=\"America/New_York\"
|
|
71
|
+
"template": "<div nve-layout=\"column gap:sm\">\n <nve-format-datetime date-style=\"long\" time-style=\"long\" time-zone=\"America/New_York\">2023-07-28T04:20:17.434Z</nve-format-datetime>\n <nve-format-datetime date-style=\"long\" time-style=\"long\" time-zone=\"Asia/Tokyo\">2023-07-28T04:20:17.434Z</nve-format-datetime>\n</div>\n",
|
|
72
72
|
"summary": "Time zone conversion for displaying dates in a specific region. Use for global teams, scheduling interfaces, or when UTC or server timestamps need a fixed time zone.",
|
|
73
73
|
"description": "",
|
|
74
74
|
"composition": false,
|
|
@@ -77,7 +77,7 @@
|
|
|
77
77
|
{
|
|
78
78
|
"id": "format-datetime-time-zone-name",
|
|
79
79
|
"name": "TimeZoneName",
|
|
80
|
-
"template": "<div nve-layout=\"column gap:sm\">\n <nve-format-datetime
|
|
80
|
+
"template": "<div nve-layout=\"column gap:sm\">\n <nve-format-datetime locale=\"en-US\" month=\"long\" day=\"numeric\" year=\"numeric\" hour=\"numeric\" minute=\"2-digit\" time-zone=\"America/New_York\" time-zone-name=\"short\">2023-07-28T04:20:17.434Z</nve-format-datetime>\n <nve-format-datetime locale=\"en-US\" month=\"long\" day=\"numeric\" year=\"numeric\" hour=\"numeric\" minute=\"2-digit\" time-zone=\"America/New_York\" time-zone-name=\"long\">2023-07-28T04:20:17.434Z</nve-format-datetime>\n</div>\n",
|
|
81
81
|
"summary": "Time zone name labels in short and long form alongside the formatted date. Use with granular options when the viewer needs to know which time zone applies, such as meeting schedulers or cross-region dashboards.",
|
|
82
82
|
"description": "",
|
|
83
83
|
"composition": false,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { LogService as e } from "../internal/services/log.service.js";
|
|
2
2
|
import { typeSSR as t } from "../internal/controllers/type-ssr.controller.js";
|
|
3
3
|
import { useStyles as n } from "../internal/styles/index.js";
|
|
4
|
-
import r from "../_virtual/_@oxc-project_runtime@0.
|
|
4
|
+
import r from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
|
|
5
5
|
import i from "./format-datetime.js";
|
|
6
6
|
import { LitElement as a, html as o } from "lit";
|
|
7
7
|
import { property as s } from "lit/decorators/property.js";
|
|
@@ -13,7 +13,7 @@ var c = class extends a {
|
|
|
13
13
|
static {
|
|
14
14
|
this.metadata = {
|
|
15
15
|
tag: "nve-format-datetime",
|
|
16
|
-
version: "2.
|
|
16
|
+
version: "2.8.1"
|
|
17
17
|
};
|
|
18
18
|
}
|
|
19
19
|
get #e() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"format-datetime2.js","names":[
|
|
1
|
+
{"version":3,"file":"format-datetime2.js","names":[],"sources":["../../src/format-datetime/format-datetime.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 { useStyles, typeSSR, LogService } from '@nvidia-elements/core/internal';\nimport styles from './format-datetime.css?inline';\n\n/**\n * @element nve-format-datetime\n * @description Formats a date/time value as localized text using the Intl.DateTimeFormat API. Renders inside a semantic time element.\n * Granular options (weekday, year, month, day, hour, minute, second) mirror the Intl.DateTimeFormat API. 'numeric' omits zero-padding, '2-digit' zero-pads.\n * @documentation https://nvidia.github.io/elements/docs/elements/format-datetime/\n * @since 0.0.0\n * @entrypoint \\@nvidia-elements/core/format-datetime\n * @slot - Date string to format (such as 2023-07-28T04:20:17.434Z). Serves as fallback before hydration.\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/time\n */\n@typeSSR()\nexport class FormatDatetime extends LitElement {\n static styles = useStyles([styles]);\n\n static readonly metadata = {\n tag: 'nve-format-datetime',\n version: '0.0.0'\n };\n\n /**\n * Optional date string for values supplied by JavaScript or bound data.\n * By default, the component formats the element's text content, which also serves as the SSR fallback.\n * When both are present, this property takes precedence.\n */\n @property({ type: String }) date?: string;\n\n /**\n * Language tag (such as en-US, de-DE). Defaults to document.documentElement.lang or browser default.\n */\n @property({ type: String }) locale?: string;\n\n /**\n * Weekday representation: 'long' | 'short' | 'narrow'.\n */\n @property({ type: String }) weekday?: 'long' | 'short' | 'narrow';\n\n /**\n * Year representation: 'numeric' | '2-digit'.\n */\n @property({ type: String }) year?: 'numeric' | '2-digit';\n\n /**\n * Month representation: 'numeric' | '2-digit' | 'long' | 'short' | 'narrow'.\n */\n @property({ type: String }) month?: 'numeric' | '2-digit' | 'long' | 'short' | 'narrow';\n\n /**\n * Day representation: 'numeric' | '2-digit'.\n */\n @property({ type: String }) day?: 'numeric' | '2-digit';\n\n /**\n * Hour representation: 'numeric' | '2-digit'.\n */\n @property({ type: String }) hour?: 'numeric' | '2-digit';\n\n /**\n * Minute representation: 'numeric' | '2-digit'.\n */\n @property({ type: String }) minute?: 'numeric' | '2-digit';\n\n /**\n * Second representation: 'numeric' | '2-digit'.\n */\n @property({ type: String }) second?: 'numeric' | '2-digit';\n\n /**\n * Preset date formatting style: 'full' | 'long' | 'medium' | 'short'.\n * Preset styles take precedence over granular date and time part options.\n */\n @property({ type: String, attribute: 'date-style' }) dateStyle?: 'full' | 'long' | 'medium' | 'short';\n\n /**\n * Preset time formatting style: 'full' | 'long' | 'medium' | 'short'.\n * Preset styles take precedence over granular date and time part options.\n */\n @property({ type: String, attribute: 'time-style' }) timeStyle?: 'full' | 'long' | 'medium' | 'short';\n\n /**\n * Time zone name display: 'long' | 'short'. Use it with granular options only; preset styles ignore it.\n */\n @property({ type: String, attribute: 'time-zone-name' }) timeZoneName?: 'long' | 'short';\n\n /**\n * IANA time zone identifier (such as 'America/New_York', 'UTC').\n */\n @property({ type: String, attribute: 'time-zone' }) timeZone?: string;\n\n get #dateValue(): string {\n return this.date ?? this.textContent?.trim() ?? '';\n }\n\n get #resolvedLocale(): string | undefined {\n return this.locale ?? (globalThis.document?.documentElement?.lang || undefined);\n }\n\n get #formattedDate(): string {\n const iso = this.#dateValue;\n if (!iso) return '';\n\n const date = this.#parseDate(iso);\n if (!date) return iso;\n\n try {\n return new Intl.DateTimeFormat(this.#resolvedLocale, this.#formatOptions).format(date);\n } catch (e) {\n LogService.warn(`format-datetime: ${(e as Error).message}`);\n return iso;\n }\n }\n\n get #formatOptions(): Intl.DateTimeFormatOptions {\n return this.#hasPresetStyle ? this.#presetFormatOptions : this.#granularFormatOptions;\n }\n\n get #hasPresetStyle(): boolean {\n return this.dateStyle !== undefined || this.timeStyle !== undefined;\n }\n\n get #presetFormatOptions(): Intl.DateTimeFormatOptions {\n const options: Intl.DateTimeFormatOptions = {};\n\n if (this.dateStyle) options.dateStyle = this.dateStyle;\n if (this.timeStyle) options.timeStyle = this.timeStyle;\n if (this.timeZone) options.timeZone = this.timeZone;\n\n return options;\n }\n\n get #granularFormatOptions(): Intl.DateTimeFormatOptions {\n const options: Intl.DateTimeFormatOptions = {};\n\n if (this.weekday) options.weekday = this.weekday;\n if (this.year) options.year = this.year;\n if (this.month) options.month = this.month;\n if (this.day) options.day = this.day;\n if (this.hour) options.hour = this.hour;\n if (this.minute) options.minute = this.minute;\n if (this.second) options.second = this.second;\n if (this.timeZoneName) options.timeZoneName = this.timeZoneName;\n if (this.timeZone) options.timeZone = this.timeZone;\n\n return options;\n }\n\n #parseDate(iso: string): Date | null {\n const date = new Date(iso);\n if (!isNaN(date.getTime())) return date;\n\n LogService.warn(`format-datetime: invalid date value \"${iso}\"`);\n return null;\n }\n\n render() {\n return html`<time internal-host datetime=${this.#dateValue}>${this.#formattedDate}<slot @slotchange=${this.#onSlotChange} hidden></slot></time>`;\n }\n\n #onSlotChange() {\n this.requestUpdate();\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { LogService as e } from "../internal/services/log.service.js";
|
|
2
2
|
import { typeSSR as t } from "../internal/controllers/type-ssr.controller.js";
|
|
3
3
|
import { useStyles as n } from "../internal/styles/index.js";
|
|
4
|
-
import r from "../_virtual/_@oxc-project_runtime@0.
|
|
4
|
+
import r from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
|
|
5
5
|
import i from "./format-number.js";
|
|
6
6
|
import { LitElement as a, html as o } from "lit";
|
|
7
7
|
import { property as s } from "lit/decorators/property.js";
|
|
@@ -29,7 +29,7 @@ var c = [
|
|
|
29
29
|
static {
|
|
30
30
|
this.metadata = {
|
|
31
31
|
tag: "nve-format-number",
|
|
32
|
-
version: "2.
|
|
32
|
+
version: "2.8.1"
|
|
33
33
|
};
|
|
34
34
|
}
|
|
35
35
|
get #e() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"format-number2.js","names":[
|
|
1
|
+
{"version":3,"file":"format-number2.js","names":[],"sources":["../../src/format-number/format-number.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 { useStyles, typeSSR, LogService } from '@nvidia-elements/core/internal';\nimport styles from './format-number.css?inline';\n\nexport type FormatNumberStyle = 'decimal' | 'currency' | 'percent' | 'unit';\nexport type CurrencyDisplayOption = 'symbol' | 'code' | 'name' | 'narrowSymbol';\nexport type CurrencySignOption = 'standard' | 'accounting';\nexport type NotationOption = 'standard' | 'scientific' | 'engineering' | 'compact';\nexport type CompactDisplayOption = 'short' | 'long';\nexport type UnitDisplayOption = 'short' | 'long' | 'narrow';\nexport type SignDisplayOption = 'auto' | 'never' | 'always' | 'exceptZero';\n\nconst STRING_KEYS: [keyof FormatNumber, string][] = [\n ['currency', 'currency'],\n ['currencyDisplay', 'currencyDisplay'],\n ['currencySign', 'currencySign'],\n ['notation', 'notation'],\n ['compactDisplay', 'compactDisplay'],\n ['unit', 'unit'],\n ['unitDisplay', 'unitDisplay'],\n ['signDisplay', 'signDisplay']\n];\n\nconst NUMBER_KEYS: [keyof FormatNumber, string][] = [\n ['minimumFractionDigits', 'minimumFractionDigits'],\n ['maximumFractionDigits', 'maximumFractionDigits'],\n ['minimumIntegerDigits', 'minimumIntegerDigits']\n];\n\n/**\n * @element nve-format-number\n * @description A localized number formatter for currencies, percentages, units, and compact notation, backed by Intl.NumberFormat.\n * Provide a `currency` attribute when `formatStyle` is `currency`, and a `unit` attribute when `formatStyle` is `unit`.\n * @documentation https://nvidia.github.io/elements/docs/elements/format-number/\n * @since 0.0.0\n * @entrypoint \\@nvidia-elements/core/format-number\n * @slot - Numeric string to format (such as 1234567 or 1234.56). Serves as fallback before hydration.\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/data\n */\n@typeSSR()\nexport class FormatNumber extends LitElement {\n static styles = useStyles([styles]);\n\n static readonly metadata = {\n tag: 'nve-format-number',\n version: '0.0.0'\n };\n\n /**\n * Optional numeric string for values supplied by JavaScript or bound data.\n * By default, the component formats the element's text content, which also serves as the SSR fallback.\n * When both are present, this property takes precedence.\n */\n @property({ type: String }) number?: string;\n\n /**\n * Language tag (such as en-US, de-DE). Defaults to document.documentElement.lang or browser default.\n */\n @property({ type: String }) locale?: string;\n\n /**\n * Formatting style: 'decimal' | 'currency' | 'percent' | 'unit'.\n */\n @property({ type: String, attribute: 'format-style' }) formatStyle: FormatNumberStyle = 'decimal';\n\n /**\n * ISO 4217 currency code (such as USD or EUR). Required when formatStyle is currency.\n */\n @property({ type: String }) currency?: string;\n\n /**\n * Currency sign style: 'standard' | 'accounting'.\n */\n @property({ type: String, attribute: 'currency-sign' }) currencySign?: CurrencySignOption;\n\n /**\n * Currency display style: 'symbol' | 'code' | 'name' | 'narrowSymbol'.\n */\n @property({ type: String, attribute: 'currency-display' }) currencyDisplay?: CurrencyDisplayOption;\n\n /**\n * Unit identifier (such as kilometer or byte). Required when formatStyle is unit.\n */\n @property({ type: String }) unit?: string;\n\n /**\n * Unit display style: 'short' | 'long' | 'narrow'.\n */\n @property({ type: String, attribute: 'unit-display' }) unitDisplay?: UnitDisplayOption;\n\n /**\n * Number notation: 'standard' | 'scientific' | 'engineering' | 'compact'.\n */\n @property({ type: String }) notation?: NotationOption;\n\n /**\n * Compact notation display: 'short' | 'long'. Only applies when notation is compact.\n */\n @property({ type: String, attribute: 'compact-display' }) compactDisplay?: CompactDisplayOption;\n\n /**\n * Sign display: 'auto' | 'never' | 'always' | 'exceptZero'.\n */\n @property({ type: String, attribute: 'sign-display' }) signDisplay?: SignDisplayOption;\n\n /**\n * Grouping separators: 'auto' | 'always' | 'min2' | 'true' | 'false'.\n */\n @property({ type: String, attribute: 'use-grouping' })\n useGrouping?: 'auto' | 'always' | 'min2' | 'true' | 'false' | boolean;\n\n /**\n * Pad fraction output to at least this many digits (0-20).\n */\n @property({ type: Number, attribute: 'minimum-fraction-digits' }) minimumFractionDigits?: number;\n\n /**\n * Round fraction output to at most this many digits (0-20).\n */\n @property({ type: Number, attribute: 'maximum-fraction-digits' }) maximumFractionDigits?: number;\n\n /**\n * Pad integer output to at least this many digits (1-21).\n */\n @property({ type: Number, attribute: 'minimum-integer-digits' }) minimumIntegerDigits?: number;\n\n get #rawValue(): string {\n return this.number ?? this.textContent?.trim() ?? '';\n }\n\n get #resolvedLocale(): string | undefined {\n return this.locale ?? (globalThis.document?.documentElement?.lang || undefined);\n }\n\n get #parsedNumber(): number | null {\n const raw = this.#rawValue;\n if (!raw) return null;\n\n const numericValue = Number(raw);\n if (Number.isFinite(numericValue)) return numericValue;\n\n LogService.warn(`format-number: invalid numeric value \"${raw}\"`);\n return null;\n }\n\n get #formatOptions(): Intl.NumberFormatOptions {\n const options: Intl.NumberFormatOptions = { style: this.formatStyle };\n\n for (const [prop, key] of STRING_KEYS) {\n const value = this[prop] as string | undefined;\n if (value !== undefined) (options as Record<string, unknown>)[key] = value;\n }\n\n for (const [prop, key] of NUMBER_KEYS) {\n const value = this[prop] as number | undefined;\n if (value !== undefined) (options as Record<string, unknown>)[key] = value;\n }\n\n if (this.useGrouping !== undefined) {\n const grouping = this.useGrouping === 'false' ? false : this.useGrouping === 'true' ? true : this.useGrouping;\n (options as Record<string, unknown>).useGrouping = grouping;\n }\n\n return options;\n }\n\n get #formattedNumber(): string {\n const raw = this.#rawValue;\n if (!raw) return '';\n\n const numericValue = this.#parsedNumber;\n if (numericValue === null) return raw;\n\n try {\n return new Intl.NumberFormat(this.#resolvedLocale, this.#formatOptions).format(numericValue);\n } catch (e) {\n LogService.warn(`format-number: ${(e as Error).message}`);\n return raw;\n }\n }\n\n render() {\n return html`<data internal-host value=${this.#rawValue}>${this.#formattedNumber}<slot @slotchange=${this.#onSlotChange} hidden></slot></data>`;\n }\n\n #onSlotChange() {\n this.requestUpdate();\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { LogService as e } from "../internal/services/log.service.js";
|
|
2
2
|
import { typeSSR as t } from "../internal/controllers/type-ssr.controller.js";
|
|
3
3
|
import { useStyles as n } from "../internal/styles/index.js";
|
|
4
|
-
import r from "../_virtual/_@oxc-project_runtime@0.
|
|
4
|
+
import r from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
|
|
5
5
|
import i from "./format-relative-time.js";
|
|
6
6
|
import { LitElement as a, html as o } from "lit";
|
|
7
7
|
import { property as s } from "lit/decorators/property.js";
|
|
@@ -53,7 +53,7 @@ var c = {
|
|
|
53
53
|
static {
|
|
54
54
|
this.metadata = {
|
|
55
55
|
tag: "nve-format-relative-time",
|
|
56
|
-
version: "2.
|
|
56
|
+
version: "2.8.1"
|
|
57
57
|
};
|
|
58
58
|
}
|
|
59
59
|
#e;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"format-relative-time2.js","names":[
|
|
1
|
+
{"version":3,"file":"format-relative-time2.js","names":[],"sources":["../../src/format-relative-time/format-relative-time.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 { useStyles, typeSSR, LogService } from '@nvidia-elements/core/internal';\nimport styles from './format-relative-time.css?inline';\n\ntype TimeUnitOption = 'second' | 'minute' | 'hour' | 'day' | 'week' | 'month' | 'year';\n\nconst UNIT_DIVISORS: Record<TimeUnitOption, number> = {\n second: 1000,\n minute: 60000,\n hour: 3600000,\n day: 86400000,\n week: 604800000,\n month: 2592000000,\n year: 31536000000\n};\n\nconst THRESHOLDS: { unit: TimeUnitOption; max: number }[] = [\n { unit: 'second', max: 60 },\n { unit: 'minute', max: 60 },\n { unit: 'hour', max: 24 },\n { unit: 'day', max: 7 },\n { unit: 'week', max: 4 },\n { unit: 'month', max: 12 },\n { unit: 'year', max: Number.POSITIVE_INFINITY }\n];\n\n/**\n * @element nve-format-relative-time\n * @description Formats a date/time value as localized relative text using the Intl.RelativeTimeFormat API. Renders inside a semantic time element.\n * Options mirror the Intl.RelativeTimeFormat API. When unit is 'auto', the component selects the best unit based on the time difference.\n * @documentation https://nvidia.github.io/elements/docs/elements/format-relative-time/\n * @since 0.0.0\n * @entrypoint \\@nvidia-elements/core/format-relative-time\n * @slot - Date string to format (such as 2023-07-28T04:20:17.434Z). Serves as fallback before hydration.\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/time\n */\n@typeSSR()\nexport class FormatRelativeTime extends LitElement {\n static styles = useStyles([styles]);\n\n static readonly metadata = {\n tag: 'nve-format-relative-time',\n version: '0.0.0'\n };\n\n /**\n * Optional date string for values supplied by JavaScript or bound data.\n * By default, the component formats the element's text content, which also serves as the SSR fallback.\n * When both are present, this property takes precedence.\n */\n @property({ type: String }) date?: string;\n\n /**\n * Language tag (such as en-US, de-DE). Defaults to document.documentElement.lang or browser default.\n */\n @property({ type: String }) locale?: string;\n\n /**\n * Numeric formatting: 'always' | 'auto'. When 'auto', enables natural language forms such as 'yesterday' instead of '1 day ago'.\n */\n @property({ type: String }) numeric: 'always' | 'auto' = 'always';\n\n /**\n * Formatting length: 'long' | 'short' | 'narrow'. Controls verbosity (such as '3 days ago' vs '3d ago'). Maps to Intl.RelativeTimeFormat style option.\n */\n @property({ type: String, attribute: 'format-style' }) formatStyle: 'long' | 'short' | 'narrow' = 'long';\n\n /**\n * Time unit: 'second' | 'minute' | 'hour' | 'day' | 'week' | 'month' | 'year' | 'auto'. Use 'auto' to let the component select the most appropriate unit based on the time difference.\n */\n @property({ type: String }) unit: 'second' | 'minute' | 'hour' | 'day' | 'week' | 'month' | 'year' | 'auto' = 'auto';\n\n /**\n * When present, auto-updates the displayed relative time at appropriate intervals.\n */\n @property({ type: Boolean }) sync = false;\n\n #timer?: ReturnType<typeof setTimeout>;\n\n get #dateValue(): string {\n return this.date ?? this.textContent?.trim() ?? '';\n }\n\n get #resolvedLocale(): string | undefined {\n return this.locale ?? (globalThis.document?.documentElement?.lang || undefined);\n }\n\n #computeUnit(diffMs: number): { value: number; unit: Intl.RelativeTimeFormatUnit } {\n const absDiff = Math.abs(diffMs);\n const sign = diffMs < 0 ? -1 : 1;\n\n for (const { unit, max } of THRESHOLDS) {\n const value = Math.round(absDiff / UNIT_DIVISORS[unit]);\n if (value < max) return { value: sign * value, unit };\n }\n return { value: sign * Math.round(absDiff / UNIT_DIVISORS.year), unit: 'year' };\n }\n\n #computeExplicitUnit(diffMs: number, unit: TimeUnitOption): number {\n return Math.round(diffMs / UNIT_DIVISORS[unit]);\n }\n\n #resolveValueAndUnit(diffMs: number): { value: number; unit: Intl.RelativeTimeFormatUnit } {\n if (this.unit === 'auto') {\n return this.#computeUnit(diffMs);\n }\n return { unit: this.unit, value: this.#computeExplicitUnit(diffMs, this.unit) };\n }\n\n get #formattedRelativeTime(): string {\n const iso = this.#dateValue;\n if (!iso) return '';\n\n const target = new Date(iso);\n if (isNaN(target.getTime())) {\n LogService.warn(`format-relative-time: invalid date value \"${iso}\"`);\n return iso;\n }\n\n const { value, unit: resolvedUnit } = this.#resolveValueAndUnit(target.getTime() - Date.now());\n\n try {\n return new Intl.RelativeTimeFormat(this.#resolvedLocale, {\n numeric: this.numeric,\n style: this.formatStyle\n }).format(value, resolvedUnit);\n } catch (e) {\n LogService.warn(`format-relative-time: ${(e as Error).message}`);\n return iso;\n }\n }\n\n #getSyncInterval(): number {\n const iso = this.#dateValue;\n if (!iso) return 60000;\n\n const absDiff = Math.abs(new Date(iso).getTime() - Date.now());\n if (absDiff < 60000) return 10000;\n if (absDiff < 3600000) return 30000;\n if (absDiff < 86400000) return 300000;\n return 3600000;\n }\n\n #startSync() {\n this.#stopSync();\n if (!this.sync) return;\n\n this.#timer = setTimeout(() => {\n this.requestUpdate();\n this.#startSync();\n }, this.#getSyncInterval());\n }\n\n #stopSync() {\n if (this.#timer !== undefined) {\n clearTimeout(this.#timer);\n this.#timer = undefined;\n }\n }\n\n connectedCallback() {\n super.connectedCallback();\n if (this.sync) this.#startSync();\n }\n\n disconnectedCallback() {\n this.#stopSync();\n super.disconnectedCallback();\n }\n\n updated(changed: Map<string, unknown>) {\n if (changed.has('sync')) {\n if (this.sync) {\n this.#startSync();\n } else {\n this.#stopSync();\n }\n }\n }\n\n render() {\n return html`<time internal-host datetime=${this.#dateValue}>${this.#formattedRelativeTime}<slot @slotchange=${this.#onSlotChange} hidden></slot></time>`;\n }\n\n #onSlotChange() {\n this.requestUpdate();\n }\n}\n"],"mappings":"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"}
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
{
|
|
15
15
|
"id": "format-truncate-typography",
|
|
16
16
|
"name": "Typography",
|
|
17
|
-
"template": "<div nve-layout=\"column gap:lg align:stretch\" style=\"max-width: 16rem\">\n <h2 nve-text=\"heading lg\"
|
|
17
|
+
"template": "<div nve-layout=\"column gap:lg align:stretch\" style=\"max-width: 16rem\">\n <h2 nve-text=\"heading lg\"><nve-format-truncate position=\"center\">training-pipeline-2026-08-05-production</nve-format-truncate></h2>\n <p nve-text=\"body\"><nve-format-truncate position=\"center\">training-pipeline-2026-08-05-production</nve-format-truncate></p>\n <code nve-text=\"code sm muted\"><nve-format-truncate position=\"center\">training-pipeline-2026-08-05-production</nve-format-truncate></code>\n</div>\n",
|
|
18
18
|
"summary": "Inherited heading, body, and code styles keep truncated text aligned with surrounding typography. Place the component inside semantic text elements to preserve their visual hierarchy.",
|
|
19
19
|
"description": "",
|
|
20
20
|
"composition": false,
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
{
|
|
26
26
|
"id": "format-truncate-bias",
|
|
27
27
|
"name": "Bias",
|
|
28
|
-
"template": "<div nve-layout=\"column gap:sm\" style=\"max-width: 16rem\">\n <nve-format-truncate position=\"center\" bias=\"start\" preserve=\"10\"
|
|
28
|
+
"template": "<div nve-layout=\"column gap:sm\" style=\"max-width: 16rem\">\n <nve-format-truncate position=\"center\" bias=\"start\" preserve=\"10\">sha256:1234567890abcdef1234567890abcdef</nve-format-truncate>\n <nve-format-truncate position=\"center\" bias=\"end\" preserve=\"10\">sha256:1234567890abcdef1234567890abcdef</nve-format-truncate>\n</div>\n",
|
|
29
29
|
"summary": "Center truncation bias keeps units from either the start or end. Use end bias for shared suffixes and start bias for identifiers with meaningful endings.",
|
|
30
30
|
"description": "",
|
|
31
31
|
"composition": false,
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
{
|
|
37
37
|
"id": "format-truncate-strategy",
|
|
38
38
|
"name": "Strategy",
|
|
39
|
-
"template": "<div nve-layout=\"column gap:sm\" style=\"max-width: 16rem\">\n <nve-format-truncate position=\"center\" strategy=\"character\" preserve=\"8\"
|
|
39
|
+
"template": "<div nve-layout=\"column gap:sm\" style=\"max-width: 16rem\">\n <nve-format-truncate position=\"center\" strategy=\"character\" preserve=\"8\">experiment-👩🏽💻-0123456789abcdef</nve-format-truncate>\n <nve-format-truncate position=\"center\" strategy=\"word\" preserve=\"3\">NVIDIA autonomous vehicle training pipeline production run</nve-format-truncate>\n <nve-format-truncate position=\"center\" strategy=\"path\" preserve=\"2\">/models/checkpoints/production/model.bin</nve-format-truncate>\n</div>\n",
|
|
40
40
|
"summary": "Character, word, and path strategies preserve complete graphemes or meaningful text units. Match the strategy to identifiers, labels, or file paths.",
|
|
41
41
|
"description": "",
|
|
42
42
|
"composition": false,
|
|
@@ -58,7 +58,7 @@
|
|
|
58
58
|
{
|
|
59
59
|
"id": "format-truncate-headings",
|
|
60
60
|
"name": "Headings",
|
|
61
|
-
"template": "<div nve-layout=\"column gap:sm\">\n <h2 nve-text=\"heading lg\" style=\"width: 100%; max-width: 16rem\"
|
|
61
|
+
"template": "<div nve-layout=\"column gap:sm\">\n <h2 nve-text=\"heading lg\" style=\"width: 100%; max-width: 16rem\"><nve-format-truncate position=\"center\">training-pipeline-2026-08-05-production</nve-format-truncate></h2>\n <h2 nve-text=\"heading\" style=\"width: 100%; max-width: 16rem\"><nve-format-truncate position=\"center\">training-pipeline-2026-08-05-production</nve-format-truncate></h2>\n <h2 nve-text=\"heading sm\" style=\"width: 100%; max-width: 16rem\"><nve-format-truncate position=\"center\">training-pipeline-2026-08-05-production</nve-format-truncate></h2>\n</div>\n",
|
|
62
62
|
"summary": "Truncate applies inline to heading text nodes.",
|
|
63
63
|
"description": "",
|
|
64
64
|
"composition": false,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { attachInternals as e } from "../internal/utils/a11y.js";
|
|
2
2
|
import { typeSSR as t } from "../internal/controllers/type-ssr.controller.js";
|
|
3
3
|
import { useStyles as n } from "../internal/styles/index.js";
|
|
4
|
-
import r from "../_virtual/_@oxc-project_runtime@0.
|
|
4
|
+
import r from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
|
|
5
5
|
import { normalizeTruncateString as i, normalizeTruncateText as a, truncateText as o } from "./utils.js";
|
|
6
6
|
import s from "./format-truncate.js";
|
|
7
7
|
import { LitElement as c, html as l } from "lit";
|
|
@@ -19,7 +19,7 @@ var d = class extends c {
|
|
|
19
19
|
static {
|
|
20
20
|
this.metadata = {
|
|
21
21
|
tag: "nve-format-truncate",
|
|
22
|
-
version: "2.
|
|
22
|
+
version: "2.8.1"
|
|
23
23
|
};
|
|
24
24
|
}
|
|
25
25
|
#e;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"format-truncate2.js","names":[
|
|
1
|
+
{"version":3,"file":"format-truncate2.js","names":[],"sources":["../../src/format-truncate/format-truncate.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 { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { attachInternals, useStyles, typeSSR } from '@nvidia-elements/core/internal';\nimport { normalizeTruncateString, normalizeTruncateText, truncateText } from './utils.js';\nimport styles from './format-truncate.css?inline';\n\n/**\n * @element nve-format-truncate\n * @description Truncates text at its start, center, or end while preserving the full text for assistive technology.\n * @documentation https://nvidia.github.io/elements/docs/elements/format-truncate/\n * @since 0.0.0\n * @entrypoint \\@nvidia-elements/core/format-truncate\n * @slot - Text to truncate. The component flattens, trims, and normalizes mixed text and element nodes.\n * @beta\n */\n@typeSSR()\nexport class FormatTruncate extends LitElement {\n static styles = useStyles([styles]);\n\n static readonly metadata = {\n tag: 'nve-format-truncate',\n version: '0.0.0'\n };\n\n /**\n * Location of the ellipsis. Use start or end to preserve one edge, or center to preserve both edges.\n */\n @property({ type: String, reflect: true }) position: 'start' | 'center' | 'end' = 'start';\n\n /**\n * Text unit used for center truncation. Character preserves graphemes, word preserves words, and path preserves path segments.\n */\n @property({ type: String, reflect: true }) strategy: 'character' | 'word' | 'path' = 'character';\n\n /**\n * Edge favored by center truncation. The favored edge keeps at least the configured number of units.\n */\n @property({ type: String, reflect: true }) bias: 'start' | 'end' = 'end';\n\n /**\n * Number of strategy units retained at the biased edge during center truncation.\n */\n @property({ type: Number, reflect: true }) preserve = 6;\n\n /** @private */\n declare _internals: ElementInternals;\n\n #measurementContext?: CanvasRenderingContext2D | null;\n #resizeObserver?: ResizeObserver;\n\n override connectedCallback(): void {\n super.connectedCallback();\n attachInternals(this);\n this.#observeAvailableWidth();\n this.requestUpdate();\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#resizeObserver?.disconnect();\n }\n\n connectedMoveCallback(): void {\n this.#observeAvailableWidth();\n this.requestUpdate();\n }\n\n override render(): TemplateResult {\n const text = this.#slottedText;\n const truncatedText = this.#renderText(text);\n\n if (truncatedText !== text) this.title = text;\n else this.removeAttribute('title');\n\n return html`<span internal-host aria-hidden=\"true\">${truncatedText}</span><span sizing-host aria-hidden=\"true\">${text}</span><slot @slotchange=${this.#onSlotChange}></slot>`;\n }\n\n get #slottedText(): string {\n const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot:not([name])');\n if (slot) return normalizeTruncateText(slot.assignedNodes({ flatten: true }));\n\n const nodes = Array.from(this.childNodes ?? []).filter(isDefaultSlotNode);\n return nodes.length ? normalizeTruncateText(nodes) : normalizeTruncateString(this.textContent ?? '');\n }\n\n #renderText(text: string): string {\n const measureText = this.#createTextMeasurer();\n\n return truncateText(text, {\n position: this.position,\n strategy: this.strategy,\n bias: this.bias,\n preserve: this.preserve,\n availableWidth: this.#availableWidth,\n measureText\n });\n }\n\n get #availableWidth(): number {\n const view = this.ownerDocument?.defaultView;\n if (!view || !this.shadowRoot?.querySelector('[internal-host]')) return Number.POSITIVE_INFINITY;\n\n return getContentWidth(this, view);\n }\n\n #createTextMeasurer(): (text: string) => number {\n const view = this.ownerDocument?.defaultView;\n const context = this.#textMeasurementContext;\n if (!view || !context) return () => 0;\n\n const computedStyles = view.getComputedStyle(this);\n context.font = computedStyles.font;\n\n const letterSpacing = cssPixelValue(computedStyles.letterSpacing);\n const wordSpacing = cssPixelValue(computedStyles.wordSpacing);\n const graphemeSegmenter = new Intl.Segmenter(undefined, { granularity: 'grapheme' });\n\n return text => this.#measureText(text, { context, letterSpacing, wordSpacing, graphemeSegmenter });\n }\n\n #measureText(\n text: string,\n {\n context,\n letterSpacing,\n wordSpacing,\n graphemeSegmenter\n }: {\n context: CanvasRenderingContext2D;\n letterSpacing: number;\n wordSpacing: number;\n graphemeSegmenter: Intl.Segmenter;\n }\n ): number {\n const graphemeSegments = graphemeSegmenter.segment(text);\n const whitespaceCount = Array.from(text.matchAll(/\\s/gu)).length;\n\n return (\n context.measureText(text).width +\n Math.max(0, Array.from(graphemeSegments).length - 1) * letterSpacing +\n whitespaceCount * wordSpacing\n );\n }\n\n get #textMeasurementContext(): CanvasRenderingContext2D | null {\n if (this.#measurementContext === undefined) {\n this.#measurementContext = this.ownerDocument?.createElement('canvas').getContext('2d') ?? null;\n }\n\n return this.#measurementContext;\n }\n\n #observeAvailableWidth(): void {\n if (typeof ResizeObserver === 'undefined') return;\n\n this.#resizeObserver ??= new ResizeObserver(() => {\n if (this.isConnected) this.requestUpdate();\n });\n this.#resizeObserver.disconnect();\n this.#resizeObserver.observe(this);\n }\n\n #onSlotChange = (): void => {\n this.requestUpdate();\n };\n}\n\nfunction getContentWidth(element: HTMLElement, view: Window): number {\n const computedStyles = view.getComputedStyle(element);\n return Math.max(\n 0,\n element.getBoundingClientRect().width -\n cssPixelValue(computedStyles.borderInlineStartWidth) -\n cssPixelValue(computedStyles.borderInlineEndWidth) -\n cssPixelValue(computedStyles.paddingInlineStart) -\n cssPixelValue(computedStyles.paddingInlineEnd)\n );\n}\n\nfunction cssPixelValue(value: string): number {\n const parsed = Number.parseFloat(value);\n return Number.isFinite(parsed) ? parsed : 0;\n}\n\nfunction isDefaultSlotNode(node: Node): boolean {\n return !isElementNode(node) || !node.getAttribute('slot');\n}\n\nfunction isElementNode(node: Node): node is Element {\n return node.nodeType === 1;\n}\n"],"mappings":"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"}
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
{
|
|
15
15
|
"id": "forms-actions-label-action",
|
|
16
16
|
"name": "LabelAction",
|
|
17
|
-
"template": "<nve-input>\n <label>label</label>\n <nve-icon-button
|
|
17
|
+
"template": "<nve-input>\n <label>label</label>\n <nve-icon-button icon-name=\"information-circle\" container=\"flat\" aria-label=\"more details\" slot=\"label\"></nve-icon-button>\n <input type=\"text\" />\n <nve-control-message>message</nve-control-message>\n</nve-input>\n",
|
|
18
18
|
"summary": "Label with an information button to provide contextual help or more details about the field.",
|
|
19
19
|
"description": "",
|
|
20
20
|
"composition": true,
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
{
|
|
17
17
|
"id": "forms-control-responsive",
|
|
18
18
|
"name": "Responsive",
|
|
19
|
-
"template": "<div
|
|
19
|
+
"template": "<div nve-layout=\"column gap:lg\" style=\"padding: 12px; border: 1px solid #ccc; overflow-y: auto; resize: horizontal; max-width: 600px\">\n <nve-input layout=\"horizontal\">\n <label>text label</label>\n <input />\n <nve-control-message>message</nve-control-message>\n </nve-input>\n <nve-select layout=\"horizontal\">\n <label>select label</label>\n <select>\n <option value=\"1\">Option 1</option>\n <option value=\"2\">Option 2</option>\n <option value=\"3\">Option 3</option>\n </select>\n <nve-control-message>message</nve-control-message>\n </nve-select>\n <nve-search layout=\"horizontal-inline\">\n <label>search label</label>\n <input type=\"search\" placeholder=\"search\" />\n </nve-search>\n <nve-checkbox-group layout=\"horizontal-inline\">\n <label>checkbox label</label>\n <nve-checkbox>\n <label>local</label>\n <input type=\"checkbox\" name=\"checkbox-group\" value=\"1\" checked />\n </nve-checkbox>\n <nve-checkbox>\n <label>staging</label>\n <input type=\"checkbox\" name=\"checkbox-group\" value=\"2\" />\n </nve-checkbox>\n <nve-checkbox>\n <label>production</label>\n <input type=\"checkbox\" name=\"checkbox-group\" value=\"3\" />\n </nve-checkbox>\n <nve-control-message>message</nve-control-message>\n </nve-checkbox-group>\n <nve-range layout=\"horizontal-inline\">\n <label>label</label>\n <input type=\"range\" />\n <nve-control-message>message</nve-control-message>\n </nve-range>\n <nve-textarea layout=\"horizontal-inline\">\n <label>label</label>\n <textarea></textarea>\n </nve-textarea>\n</div>\n",
|
|
20
20
|
"summary": "Responsive form controls with layout adaptation in resizable containers.",
|
|
21
21
|
"description": "",
|
|
22
22
|
"composition": true,
|
|
@@ -4,7 +4,7 @@ import { associateAriaDescribedBy as r, associateDataList as i, associateLabel a
|
|
|
4
4
|
import { typeSSR as s } from "../../internal/controllers/type-ssr.controller.js";
|
|
5
5
|
import { hostAttr as c } from "../../internal/decorators/host-attr.js";
|
|
6
6
|
import { useStyles as l } from "../../internal/styles/index.js";
|
|
7
|
-
import u from "../../_virtual/_@oxc-project_runtime@0.
|
|
7
|
+
import u from "../../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
|
|
8
8
|
import { inputQuery as d, setupControlStates as f, setupControlStatusStates as p, setupControlValidationStates as m } from "../utils/states.js";
|
|
9
9
|
import { setupControlLayoutStates as h } from "../utils/layout.js";
|
|
10
10
|
import g from "./control.global.js";
|
|
@@ -48,7 +48,7 @@ var C = class extends v {
|
|
|
48
48
|
static {
|
|
49
49
|
this.metadata = {
|
|
50
50
|
tag: "nve-control",
|
|
51
|
-
version: "2.
|
|
51
|
+
version: "2.8.1"
|
|
52
52
|
};
|
|
53
53
|
}
|
|
54
54
|
render() {
|