npm - @helixui/library - Versions diffs - 1.0.1 → 1.1.2 - Mend

@helixui/library 1.0.1 → 1.1.2

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.

Files changed (466) hide show

package/dist/shared/hx-combobox-CivfelTS.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"hx-combobox-CivfelTS.js","sources":["../../src/components/hx-combobox/hx-combobox.styles.ts","../../src/components/hx-combobox/hx-combobox.ts"],"sourcesContent":["import { css } from 'lit';\n\n// prettier-ignore\nexport const helixComboboxStyles = css`:host{display:block}:host([disabled]){opacity:var(--hx-opacity-disabled, .5);pointer-events:none}*{box-sizing:border-box}.field{display:flex;flex-direction:column;gap:var(--hx-space-1, .25rem);font-family:var(--hx-combobox-font-family, var(--hx-font-family-sans, sans-serif));position:relative}.field__label{display:flex;align-items:baseline;gap:var(--hx-space-1, .25rem);font-size:var(--hx-font-size-sm, .875rem);font-weight:var(--hx-font-weight-medium, 500);color:var(--hx-combobox-label-color, var(--hx-color-neutral-700, #343a40));line-height:var(--hx-line-height-normal, 1.5)}.field__required-marker{color:var(--hx-combobox-error-color, var(--hx-color-error-text, #b91c1c));font-weight:var(--hx-font-weight-bold, 700)}.field__input-wrapper{position:relative;display:flex;align-items:center;border:var(--hx-border-width-thin, 1px) solid var(--hx-combobox-border-color, var(--hx-color-neutral-300, #ced4da));border-radius:var(--hx-combobox-border-radius, var(--hx-border-radius-md, .375rem));background-color:var(--hx-combobox-bg, var(--hx-color-neutral-0, #ffffff));transition:border-color var(--hx-transition-fast, .15s ease),box-shadow var(--hx-transition-fast, .15s ease)}.field__input-wrapper:focus-within{border-color:var(--hx-combobox-focus-ring-color, var(--hx-focus-ring-color, #2563eb));box-shadow:0 0 0 var(--hx-focus-ring-width, 2px) color-mix(in srgb,var(--hx-combobox-focus-ring-color, var(--hx-focus-ring-color, #2563eb)) calc(var(--hx-focus-ring-opacity, .25) * 100%),transparent)}.field--error .field__input-wrapper{border-color:var(--hx-combobox-error-color, var(--hx-color-error-500, #dc3545))}.field--error .field__input-wrapper:focus-within{border-color:var(--hx-combobox-error-color, var(--hx-color-error-500, #dc3545));box-shadow:0 0 0 var(--hx-focus-ring-width, 2px) color-mix(in srgb,var(--hx-combobox-error-color, var(--hx-color-error-500, #dc3545)) calc(var(--hx-focus-ring-opacity, .25) * 100%),transparent)}.field__prefix,.field__suffix{display:flex;align-items:center;padding:0 var(--hx-space-2, .5rem);color:var(--hx-color-neutral-500, #6c757d);flex-shrink:0}.field__input{flex:1;min-width:0;min-height:var(--hx-input-height-md, var(--hx-size-10, 2.5rem));border:none;background:transparent;outline:none;font-family:inherit;font-size:var(--hx-font-size-md, 1rem);line-height:var(--hx-line-height-normal, 1.5);color:var(--hx-combobox-color, var(--hx-color-neutral-800, #212529));padding:var(--hx-space-2, .5rem) var(--hx-space-3, .75rem)}.field__input::placeholder{color:var(--hx-color-neutral-400, #adb5bd)}.field__input--sm{min-height:var(--hx-input-height-sm, var(--hx-size-8, 2rem));font-size:var(--hx-font-size-sm, .875rem);padding:var(--hx-space-1, .25rem) var(--hx-space-3, .75rem)}.field__input--lg{min-height:var(--hx-input-height-lg, var(--hx-size-12, 3rem));font-size:var(--hx-font-size-lg, 1.125rem);padding:var(--hx-space-3, .75rem) var(--hx-space-4, 1rem)}.field__clear-button,.field__loading-indicator{display:flex;align-items:center;justify-content:center;margin-inline-end:var(--hx-space-2, .5rem);flex-shrink:0;color:var(--hx-color-neutral-400, #adb5bd)}.field__clear-button{width:1.25rem;height:1.25rem;border:none;background:transparent;cursor:pointer;padding:0;border-radius:var(--hx-border-radius-full, 9999px);transition:color var(--hx-transition-fast, .15s ease)}.field__clear-button:hover{color:var(--hx-color-neutral-700, #343a40)}.field__clear-button:focus-visible{outline:var(--hx-focus-ring-width, 2px) solid var(--hx-combobox-focus-ring-color, var(--hx-focus-ring-color, var(--hx-color-primary-500)));outline-offset:var(--hx-focus-ring-offset, 2px)}.field__loading-indicator{width:1rem;height:1rem}.field__loading-spinner{width:1rem;height:1rem;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:hx-spin .7s linear infinite}@keyframes hx-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.field__loading-spinner{animation:none}}.field__listbox{position:absolute;top:calc(100% + var(--hx-space-1, .25rem));left:0;right:0;z-index:var(--hx-z-index-dropdown, 100);background-color:var(--hx-combobox-listbox-bg, var(--hx-color-neutral-0, #ffffff));border:var(--hx-border-width-thin, 1px) solid var(--hx-combobox-border-color, var(--hx-color-neutral-300, #ced4da));border-radius:var(--hx-combobox-border-radius, var(--hx-border-radius-md, .375rem));box-shadow:var( --hx-combobox-listbox-shadow, 0 4px 16px color-mix(in srgb, var(--hx-color-neutral-900, #0d1117) 12%, transparent) );max-height:var(--hx-combobox-listbox-max-height, 16rem);overflow:hidden;display:flex;flex-direction:column}.field__listbox[hidden]{display:none}.field__options{overflow-y:auto;flex:1;padding:var(--hx-space-1, .25rem) 0}.field__option{display:flex;align-items:center;gap:var(--hx-space-2, .5rem);padding:var(--hx-space-2, .5rem) var(--hx-space-3, .75rem);font-size:var(--hx-font-size-md, 1rem);color:var(--hx-combobox-color, var(--hx-color-neutral-800, #212529));cursor:pointer;user-select:none;-webkit-user-select:none;transition:background-color var(--hx-transition-fast, .15s ease)}.field__option:hover{background-color:var(--hx-combobox-option-hover-bg, var(--hx-color-primary-50, #eff6ff))}.field__option--selected{background-color:var(--hx-combobox-option-selected-bg, var(--hx-color-primary-100, #dbeafe));font-weight:var(--hx-font-weight-medium, 500)}.field__option--focused{background-color:var(--hx-combobox-option-hover-bg, var(--hx-color-primary-50, #eff6ff));outline:var(--hx-focus-ring-width, 2px) solid var(--hx-combobox-focus-ring-color, var(--hx-focus-ring-color, var(--hx-color-primary-500)));outline-offset:var(--hx-combobox-option-focus-ring-offset, -2px)}.field__option--focused.field__option--selected{background-color:var(--hx-combobox-option-selected-bg, var(--hx-color-primary-100, #dbeafe))}.field__option--disabled{opacity:var(--hx-opacity-disabled, .5);cursor:not-allowed;pointer-events:none}.field__option-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.field__no-options{padding:var(--hx-space-3, .75rem);text-align:center;color:var(--hx-color-neutral-400, #adb5bd);font-size:var(--hx-font-size-sm, .875rem)}.field__sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.field__help-text,.field__error{font-size:var(--hx-font-size-xs, .75rem);line-height:var(--hx-line-height-normal, 1.5)}.field__help-text{color:var(--hx-color-neutral-500, #6c757d)}.field__error{color:var(--hx-combobox-error-color, var(--hx-color-error-text, #b91c1c))}@media(prefers-reduced-motion:reduce){.field__input-wrapper,.field__option,.field__clear-button,.field__chip-remove{transition:none}}:host([multiple]) .field__input-wrapper{flex-wrap:wrap;padding:var(--hx-space-1, .25rem);gap:var(--hx-space-1, .25rem);align-items:center}:host([multiple]) .field__input{min-width:8rem;padding:var(--hx-space-1, .25rem) var(--hx-space-2, .5rem);flex-shrink:1}.field__chip{display:inline-flex;align-items:center;gap:var(--hx-space-1, .25rem);padding:0 var(--hx-space-1, .25rem) 0 var(--hx-space-2, .5rem);height:1.5rem;background-color:var(--hx-combobox-chip-bg, var(--hx-color-primary-100, #dbeafe));color:var(--hx-combobox-chip-color, var(--hx-color-primary-800, #1e40af));border-radius:var(--hx-border-radius-full, 9999px);font-size:var(--hx-font-size-sm, .875rem);white-space:nowrap;max-width:12rem;flex-shrink:0}.field__chip-label{overflow:hidden;text-overflow:ellipsis;max-width:8rem}.field__chip-remove{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:1rem;height:1rem;border:none;background:none;cursor:pointer;padding:0;color:inherit;opacity:.7;border-radius:50%;line-height:1;transition:opacity var(--hx-transition-fast, .15s ease)}.field__chip-remove:hover{opacity:1;background-color:var(--hx-combobox-chip-remove-hover-bg, var(--hx-color-primary-200, #bfdbfe))}.field__chip-remove:focus-visible{outline:var(--hx-focus-ring-width, 2px) solid var(--hx-combobox-focus-ring-color, var(--hx-focus-ring-color, var(--hx-color-primary-500)));outline-offset:var(--hx-focus-ring-offset, 2px);opacity:1}`;\n","import { LitElement, html, nothing, type PropertyValues } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixComboboxStyles } from './hx-combobox.styles.js';\n\n// ─── Internal option model ───\n\n// P1-7: Exported so TypeScript consumers can type option arrays programmatically\nexport interface ComboboxOption {\n value: string;\n label: string;\n disabled: boolean;\n}\n\n// P2-13: Exported size type for TypeScript consumers\nexport type HxComboboxSize = 'sm' | 'md' | 'lg';\n\n// P2-6: Module-level counter for deterministic, collision-free IDs\nlet _comboboxIdCounter = 0;\n\n/**\n * A form-associated combobox component combining a text input with a listbox\n * for autocomplete and typeahead. Supports filtering, free-text entry,\n * keyboard navigation, and async option loading.\n *\n * @summary Form-associated combobox with autocomplete, filtering, and keyboard navigation.\n *\n * @tag hx-combobox\n *\n * @slot option - Slot for `<option>` elements that populate the listbox.\n * @slot prefix - Content to display before the text input.\n * @slot suffix - Content to display after the text input.\n * @slot empty-label - Content shown when no options match the filter.\n * @slot label - Custom label content (overrides the label property).\n * @slot error - Custom error content (overrides the error property).\n * @slot help-text - Custom help text content (overrides the helpText property).\n *\n * @fires {CustomEvent<{value: string}>} hx-input - Dispatched on each keystroke as the user types.\n * @fires {CustomEvent<{value: string}>} hx-change - Dispatched when an option is selected.\n * @fires {CustomEvent<void>} hx-clear - Dispatched when the clear button is activated.\n * @fires {CustomEvent<void>} hx-show - Dispatched when the listbox opens.\n * @fires {CustomEvent<void>} hx-hide - Dispatched when the listbox closes.\n *\n * @csspart input - The native text input element.\n * @csspart listbox - The dropdown panel containing options.\n * @csspart trigger - The input wrapper element acting as the combobox trigger.\n * @csspart clear-button - The button that clears the current value.\n * @csspart loading-indicator - The loading spinner shown during async operations.\n *\n * @cssprop [--hx-combobox-bg=var(--hx-color-neutral-0)] - Input background color.\n * @cssprop [--hx-combobox-color=var(--hx-color-neutral-800)] - Input text color.\n * @cssprop [--hx-combobox-border-color=var(--hx-color-neutral-300)] - Border color.\n * @cssprop [--hx-combobox-border-radius=var(--hx-border-radius-md)] - Border radius.\n * @cssprop [--hx-combobox-font-family=var(--hx-font-family-sans)] - Font family.\n * @cssprop [--hx-combobox-focus-ring-color=var(--hx-focus-ring-color)] - Focus ring color.\n * @cssprop [--hx-combobox-error-color=var(--hx-color-error-500)] - Error state color.\n * @cssprop [--hx-combobox-label-color=var(--hx-color-neutral-700)] - Label text color.\n * @cssprop [--hx-combobox-listbox-bg=var(--hx-color-neutral-0)] - Listbox background color.\n * @cssprop [--hx-combobox-option-hover-bg=var(--hx-color-primary-50)] - Option hover background.\n * @cssprop [--hx-combobox-option-selected-bg=var(--hx-color-primary-100)] - Selected option background.\n */\n@customElement('hx-combobox')\nexport class HelixCombobox extends LitElement {\n static override styles = [tokenStyles, helixComboboxStyles];\n\n // ─── Form Association ───\n\n /** Marks this element as form-associated for ElementInternals support. @internal */\n static formAssociated = true;\n\n /** Holds the ElementInternals instance used for form value and validity management. @internal */\n private _internals: ElementInternals;\n\n constructor() {\n super();\n /** @internal */\n this._internals = this.attachInternals();\n }\n\n // ─── Stable IDs ───\n\n // P2-6: Use module-level counter instead of Math.random() to guarantee uniqueness\n /** @internal */\n private _id = `hx-combobox-${++_comboboxIdCounter}`;\n /** @internal */\n private _listboxId = `${this._id}-listbox`;\n /** @internal */\n private _helpTextId = `${this._id}-help`;\n /** @internal */\n private _errorId = `${this._id}-error`;\n /** @internal */\n private _labelId = `${this._id}-label`;\n /** @internal */\n private _liveRegionId = `${this._id}-live`;\n\n // ─── Public Properties ───\n\n /**\n * The visible label text for the combobox.\n * @attr label\n */\n @property({ type: String })\n label = '';\n\n /**\n * Placeholder text shown in the input when no value is entered.\n * @attr placeholder\n */\n @property({ type: String })\n placeholder = '';\n\n /**\n * The current value of the combobox.\n * @attr value\n */\n @property({ type: String, reflect: true })\n value = '';\n\n /**\n * Whether the combobox is required for form submission.\n * @attr required\n */\n @property({ type: Boolean, reflect: true })\n required = false;\n\n /**\n * Whether the combobox is disabled.\n * @attr disabled\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * The name used for form submission.\n * @attr name\n */\n @property({ type: String })\n name = '';\n\n /**\n * Error message to display. When set, the field enters an error state.\n * @attr error\n */\n @property({ type: String })\n error = '';\n\n /**\n * Help text displayed below the combobox for guidance.\n * @attr help-text\n */\n @property({ type: String, attribute: 'help-text' })\n helpText = '';\n\n /**\n * Size variant of the combobox.\n * @attr hx-size\n */\n @property({ type: String, attribute: 'hx-size', reflect: true })\n size: HxComboboxSize = 'md';\n\n /**\n * Whether multiple options can be selected.\n * @attr multiple\n */\n @property({ type: Boolean, reflect: true })\n multiple = false;\n\n /**\n * Whether the combobox shows a clear button when a value is set.\n * @attr clearable\n */\n @property({ type: Boolean, reflect: true })\n clearable = false;\n\n /**\n * Whether the combobox is in a loading state (shows spinner).\n * @attr loading\n */\n @property({ type: Boolean, reflect: true })\n loading = false;\n\n /**\n * Debounce delay in milliseconds for the filter input event.\n * @attr filter-debounce\n */\n @property({ type: Number, attribute: 'filter-debounce' })\n filterDebounce = 0;\n\n /**\n * Accessible name for screen readers, if different from the visible label.\n * @attr aria-label\n */\n @property({ type: String, attribute: 'aria-label' })\n override ariaLabel: string | null = null;\n\n /**\n * Text shown when no options match the current filter.\n * @attr label-no-options\n */\n @property({ type: String, attribute: 'label-no-options' })\n labelNoOptions = 'No options found';\n\n /**\n * Validation message shown when the field is required but empty.\n * @attr label-required\n */\n @property({ type: String, attribute: 'label-required' })\n labelRequired = 'Please select an option.';\n\n /**\n * Generates the accessible label for multi-select chip remove buttons.\n * @param label - the option label text\n */\n @property({ attribute: false })\n labelRemoveOption: (label: string) => string = (label) => `Remove ${label}`;\n\n // ─── Internal State ───\n\n /** Parsed option models derived from slotted `<option>` and `<optgroup>` elements. @internal */\n @state() private _options: ComboboxOption[] = [];\n /** Current text typed in the input, used to filter the option list. @internal */\n @state() private _filterText = '';\n /** Whether the listbox dropdown is currently visible. @internal */\n @state() private _open = false;\n /** Zero-based index of the keyboard-focused option within the filtered list; -1 means none. @internal */\n @state() private _focusedOptionIndex = -1;\n /** Whether the named error slot contains projected content. @internal */\n @state() private _hasErrorSlot = false;\n /** Live-region announcement text describing the current number of filtered options. @internal */\n @state() private _filterAnnouncement = '';\n\n // ─── Queries ───\n\n /** Reference to the native text input element inside the shadow DOM. @internal */\n @query('.field__input')\n private _input: HTMLInputElement | undefined;\n\n // ─── Debounce timer ───\n\n /** @internal */\n private _debounceTimer: ReturnType<typeof setTimeout> | null = null;\n\n // ─── Multiple Selection ───\n\n // P0-1: Derive selected values Set from the comma-separated value property\n /** @internal */\n private get _selectedValuesSet(): Set<string> {\n if (!this.multiple || !this.value) return new Set();\n return new Set(this.value.split(',').filter(Boolean));\n }\n\n // ─── Filtered options ───\n\n /** @internal */\n private get _filteredOptions(): ComboboxOption[] {\n if (!this._filterText) return this._options;\n const lower = this._filterText.toLowerCase();\n return this._options.filter((o) => o.label.toLowerCase().includes(lower));\n }\n\n // ─── Lifecycle ───\n\n override connectedCallback(): void {\n super.connectedCallback();\n document.addEventListener('click', this._handleOutsideClick);\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n document.removeEventListener('click', this._handleOutsideClick);\n if (this._debounceTimer !== null) {\n clearTimeout(this._debounceTimer);\n }\n }\n\n override updated(changedProperties: PropertyValues<this>): void {\n super.updated(changedProperties);\n if (changedProperties.has('value')) {\n this._updateFormValue();\n this._updateValidity();\n }\n }\n\n // ─── Form Integration ───\n\n /** Returns the associated form element, if any. */\n get form(): HTMLFormElement | null {\n return this._internals.form;\n }\n\n /** Returns the validation message. */\n get validationMessage(): string {\n return this._internals.validationMessage;\n }\n\n /** Returns the ValidityState object. */\n get validity(): ValidityState {\n return this._internals.validity;\n }\n\n /** Checks whether the combobox satisfies its constraints. */\n checkValidity(): boolean {\n return this._internals.checkValidity();\n }\n\n /** Reports validity and shows the browser's constraint validation UI. */\n reportValidity(): boolean {\n return this._internals.reportValidity();\n }\n\n /** @internal */\n private _updateFormValue(): void {\n this._internals.setFormValue(this.value || null);\n }\n\n /** @internal */\n private _updateValidity(): void {\n if (this.required && !this.value) {\n this._internals.setValidity(\n { valueMissing: true },\n this.error || this.labelRequired,\n this._input,\n );\n } else {\n this._internals.setValidity({});\n }\n }\n\n /** Called by the browser when the owning form resets. */\n formResetCallback(): void {\n this.value = '';\n this._filterText = '';\n this._internals.setFormValue(null);\n }\n\n /** Called when the browser restores form state (e.g., bfcache navigation). */\n // P1-6: Correct signature per WHATWG spec — includes mode param and all state types\n formStateRestoreCallback(\n state: string | File | FormData | null,\n _mode?: 'restore' | 'autocomplete',\n ): void {\n if (typeof state === 'string') {\n this.value = state;\n }\n }\n\n /** Called when a parent fieldset is disabled/enabled. */\n formDisabledCallback(disabled: boolean): void {\n this.disabled = disabled;\n }\n\n // ─── Option Syncing from Slot ───\n\n /** @internal */\n private _handleSlotChange(): void {\n this._readOptions();\n }\n\n /** @internal */\n private _parseOption(el: HTMLOptionElement): ComboboxOption {\n return { value: el.value, label: el.textContent?.trim() ?? el.value, disabled: el.disabled };\n }\n\n /** @internal */\n private _readOptions(): void {\n const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot[name=\"option\"]');\n if (!slot) return;\n\n const parsed: ComboboxOption[] = [];\n\n for (const el of slot.assignedElements({ flatten: true })) {\n if (el instanceof HTMLOptionElement) {\n parsed.push(this._parseOption(el));\n } else if (el instanceof HTMLOptGroupElement) {\n for (const child of Array.from(el.children)) {\n if (child instanceof HTMLOptionElement) parsed.push(this._parseOption(child));\n }\n }\n }\n\n this._options = parsed;\n }\n\n // ─── Slot Change Handlers ───\n\n /** @internal */\n private _handleErrorSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasErrorSlot = slot.assignedNodes({ flatten: true }).length > 0;\n }\n\n // ─── Dropdown Control ───\n\n /** @internal */\n private _openDropdown(): void {\n if (this.disabled || this._open) return;\n this._open = true;\n this._focusedOptionIndex = -1;\n this.dispatchEvent(new CustomEvent<void>('hx-show', { bubbles: true, composed: true }));\n }\n\n /** @internal */\n private _closeDropdown(): void {\n if (!this._open) return;\n this._open = false;\n this._focusedOptionIndex = -1;\n this.dispatchEvent(new CustomEvent<void>('hx-hide', { bubbles: true, composed: true }));\n }\n\n // ─── Input Handling ───\n\n /** @internal */\n private _handleInput(e: Event): void {\n const input = e.target as HTMLInputElement;\n this._filterText = input.value;\n\n if (!this._open) {\n this._openDropdown();\n }\n\n this._focusedOptionIndex = -1;\n\n if (this.filterDebounce > 0) {\n if (this._debounceTimer !== null) {\n clearTimeout(this._debounceTimer);\n }\n this._debounceTimer = setTimeout(() => {\n this._emitInput();\n this._announceFilterResults();\n }, this.filterDebounce);\n } else {\n this._emitInput();\n this._announceFilterResults();\n }\n }\n\n /** @internal */\n private _announceFilterResults(): void {\n const count = this._filteredOptions.length;\n this._filterAnnouncement =\n count === 0\n ? 'No matching options'\n : `${count} ${count === 1 ? 'option' : 'options'} available`;\n }\n\n /** @internal */\n private _emitInput(): void {\n this.dispatchEvent(\n new CustomEvent<{ value: string }>('hx-input', {\n bubbles: true,\n composed: true,\n detail: { value: this._filterText },\n }),\n );\n }\n\n /** @internal */\n private _handleFocus(): void {\n this._openDropdown();\n }\n\n // ─── Keyboard Navigation ───\n\n /** @internal */\n private _handleKeydown(e: KeyboardEvent): void {\n if (this.disabled) return;\n\n const filtered = this._filteredOptions;\n const enabledIndices = filtered\n .map((o, i) => ({ o, i }))\n .filter(({ o }) => !o.disabled)\n .map(({ i }) => i);\n\n switch (e.key) {\n case 'ArrowDown': {\n e.preventDefault();\n if (!this._open) {\n this._openDropdown();\n this._focusedOptionIndex = enabledIndices.length > 0 ? (enabledIndices[0] ?? 0) : -1;\n break;\n }\n const nextDown = enabledIndices.find((i) => i > this._focusedOptionIndex);\n this._focusedOptionIndex =\n nextDown !== undefined ? nextDown : (enabledIndices[0] ?? this._focusedOptionIndex);\n break;\n }\n case 'ArrowUp': {\n e.preventDefault();\n if (!this._open) {\n this._openDropdown();\n const lastEnabled = enabledIndices[enabledIndices.length - 1];\n this._focusedOptionIndex = lastEnabled !== undefined ? lastEnabled : -1;\n break;\n }\n const prevUp = [...enabledIndices].reverse().find((i) => i < this._focusedOptionIndex);\n const lastEnabledUp = enabledIndices[enabledIndices.length - 1];\n this._focusedOptionIndex =\n prevUp !== undefined ? prevUp : (lastEnabledUp ?? this._focusedOptionIndex);\n break;\n }\n case 'Enter': {\n e.preventDefault();\n if (!this._open) {\n this._openDropdown();\n break;\n }\n if (this._focusedOptionIndex >= 0 && this._focusedOptionIndex < filtered.length) {\n const opt = filtered[this._focusedOptionIndex];\n if (opt) this._selectOption(opt);\n }\n break;\n }\n case 'Escape': {\n e.preventDefault();\n this._closeDropdown();\n this._filterText = '';\n if (this._input) this._input.value = '';\n break;\n }\n case 'Tab': {\n this._closeDropdown();\n break;\n }\n // P1-1: Home/End keyboard navigation for option list\n case 'Home': {\n e.preventDefault();\n if (!this._open) this._openDropdown();\n this._focusedOptionIndex = enabledIndices.length > 0 ? (enabledIndices[0] ?? -1) : -1;\n break;\n }\n case 'End': {\n e.preventDefault();\n if (!this._open) this._openDropdown();\n this._focusedOptionIndex =\n enabledIndices.length > 0 ? (enabledIndices[enabledIndices.length - 1] ?? -1) : -1;\n break;\n }\n default:\n break;\n }\n }\n\n // ─── Selection ───\n\n // P0-1: Handle both single and multiple selection modes\n /** @internal */\n private _selectOption(option: ComboboxOption): void {\n if (option.disabled) return;\n if (this.multiple) {\n const current = this._selectedValuesSet;\n const next = new Set(current);\n if (next.has(option.value)) {\n next.delete(option.value);\n } else {\n next.add(option.value);\n }\n this.value = [...next].join(',');\n // Keep dropdown open for multiple selection so user can pick more\n } else {\n this.value = option.value;\n this._closeDropdown();\n }\n this._filterText = '';\n if (this._input) this._input.value = '';\n this._dispatchChange();\n }\n\n // P0-1: Remove a single value from multi-selection\n /** @internal */\n private _removeValue(val: string): void {\n const next = this._selectedValuesSet;\n next.delete(val);\n this.value = [...next].join(',');\n this._dispatchChange();\n }\n\n // ─── Clear ───\n\n /** @internal */\n private _handleClear(e: Event): void {\n e.stopPropagation();\n this.value = '';\n this._filterText = '';\n if (this._input) {\n this._input.value = '';\n this._input.focus();\n }\n this._internals.setFormValue(null);\n this._updateValidity();\n this.dispatchEvent(new CustomEvent<void>('hx-clear', { bubbles: true, composed: true }));\n }\n\n // ─── Event Dispatchers ───\n\n /** @internal */\n private _dispatchChange(): void {\n this.dispatchEvent(\n new CustomEvent<{ value: string }>('hx-change', {\n bubbles: true,\n composed: true,\n detail: { value: this.value },\n }),\n );\n }\n\n // ─── Outside Click Handler ───\n\n /** @internal */\n private _handleOutsideClick = (e: MouseEvent): void => {\n if (this._open && !e.composedPath().includes(this)) {\n this._closeDropdown();\n }\n };\n\n // ─── Public Methods ───\n\n /** Moves focus to the text input. */\n override focus(options?: FocusOptions): void {\n this._input?.focus(options);\n }\n\n // ─── Render Helpers ───\n\n /** @internal */\n private _optionId(index: number): string {\n return `${this._id}-option-${index}`;\n }\n\n /** @internal */\n private get _displayValue(): string {\n // P0-1: In multiple mode, chips render selected values — input shows only filter text\n if (this.multiple) return '';\n if (!this.value) return '';\n const opt = this._options.find((o) => o.value === this.value);\n return opt ? opt.label : this.value;\n }\n\n /** @internal */\n private _renderOptions() {\n const filtered = this._filteredOptions;\n\n if (filtered.length === 0) {\n return html`\n <slot name=\"empty-label\">\n <div class=\"field__no-options\">${this.labelNoOptions}</div>\n </slot>\n `;\n }\n\n return repeat(\n filtered,\n (opt) => opt.value,\n (opt, index) => {\n // P0-1: Use Set membership for multiple mode, direct equality for single mode\n const isSelected = this.multiple\n ? this._selectedValuesSet.has(opt.value)\n : opt.value === this.value;\n const isFocused = index === this._focusedOptionIndex;\n\n return html`\n <div\n id=${this._optionId(index)}\n part=\"option\"\n role=\"option\"\n class=${classMap({\n field__option: true,\n 'field__option--selected': isSelected,\n 'field__option--focused': isFocused,\n 'field__option--disabled': opt.disabled,\n })}\n aria-selected=${isSelected ? 'true' : nothing}\n aria-disabled=${opt.disabled ? 'true' : nothing}\n @click=${() => this._selectOption(opt)}\n >\n <span class=\"field__option-label\">${opt.label}</span>\n </div>\n `;\n },\n );\n }\n\n // ─── Main Render ───\n\n override render() {\n const hasError = !!this.error;\n const showClear = this.clearable && !!this.value && !this.disabled;\n\n const fieldClasses = {\n field: true,\n 'field--error': hasError,\n 'field--disabled': this.disabled,\n 'field--required': this.required,\n 'field--open': this._open,\n };\n\n const inputClasses = {\n field__input: true,\n [`field__input--${this.size}`]: true,\n };\n\n const describedBy =\n [\n hasError || this._hasErrorSlot ? this._errorId : null,\n this.helpText ? this._helpTextId : null,\n ]\n .filter(Boolean)\n .join(' ') || undefined;\n\n const activedescendant =\n this._open && this._focusedOptionIndex >= 0\n ? this._optionId(this._focusedOptionIndex)\n : undefined;\n\n return html`\n <div part=\"field\" class=${classMap(fieldClasses)}>\n \n <slot name=\"label\">\n ${this.label\n ? html`<label id=${this._labelId} for=${this._id} part=\"label\" class=\"field__label\">\n ${this.label}\n ${this.required\n ? html`<span class=\"field__required-marker\" aria-hidden=\"true\">*</span>`\n : nothing}\n </label>`\n : nothing}\n </slot>\n\n \n <div part=\"trigger\" class=\"field__input-wrapper\">\n \n <slot name=\"prefix\" class=\"field__prefix\"></slot>\n\n \n ${this.multiple && this._selectedValuesSet.size > 0\n ? [...this._selectedValuesSet].map((val) => {\n const opt = this._options.find((o) => o.value === val);\n const label = opt ? opt.label : val;\n return html`\n <span class=\"field__chip\">\n <span class=\"field__chip-label\">${label}</span>\n <button\n type=\"button\"\n class=\"field__chip-remove\"\n aria-label=${this.labelRemoveOption(label)}\n @click=${(e: Event) => {\n e.stopPropagation();\n this._removeValue(val);\n }}\n >\n <svg\n width=\"8\"\n height=\"8\"\n viewBox=\"0 0 8 8\"\n fill=\"none\"\n aria-hidden=\"true\"\n focusable=\"false\"\n >\n <path\n d=\"M1 1L7 7M7 1L1 7\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n />\n </svg>\n </button>\n </span>\n `;\n })\n : nothing}\n\n \n <input\n part=\"input\"\n type=\"text\"\n id=${this._id}\n class=${classMap(inputClasses)}\n role=\"combobox\"\n aria-expanded=${this._open ? 'true' : 'false'}\n aria-autocomplete=\"list\"\n aria-controls=${this._listboxId}\n aria-activedescendant=${ifDefined(activedescendant)}\n aria-invalid=${hasError ? 'true' : nothing}\n aria-describedby=${ifDefined(describedBy)}\n aria-required=${this.required ? 'true' : nothing}\n aria-label=${ifDefined(this.ariaLabel || undefined)}\n aria-labelledby=${ifDefined(this.label && !this.ariaLabel ? this._labelId : undefined)}\n aria-busy=${this.loading ? 'true' : nothing}\n .value=${this._filterText || (this._open ? '' : this._displayValue)}\n placeholder=${ifDefined(this.placeholder || undefined)}\n ?disabled=${this.disabled}\n ?required=${this.required}\n name=${ifDefined(this.name || undefined)}\n autocomplete=\"off\"\n @input=${this._handleInput}\n @focus=${this._handleFocus}\n @keydown=${this._handleKeydown}\n />\n\n \n ${this.loading\n ? html`\n <div part=\"loading-indicator\" class=\"field__loading-indicator\" aria-hidden=\"true\">\n <div class=\"field__loading-spinner\"></div>\n </div>\n `\n : nothing}\n\n \n ${showClear\n ? html`\n <button\n part=\"clear-button\"\n type=\"button\"\n class=\"field__clear-button\"\n aria-label=${`Clear ${this.label || this.ariaLabel || 'selection'}`}\n tabindex=\"0\"\n @click=${this._handleClear}\n >\n <svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n aria-hidden=\"true\"\n focusable=\"false\"\n >\n <path\n d=\"M1 1L11 11M11 1L1 11\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n />\n </svg>\n </button>\n `\n : nothing}\n\n \n <slot name=\"suffix\" class=\"field__suffix\"></slot>\n </div>\n\n \n <div\n part=\"listbox\"\n role=\"listbox\"\n id=${this._listboxId}\n class=\"field__listbox\"\n aria-label=${ifDefined(this.label || this.ariaLabel || undefined)}\n aria-multiselectable=${this.multiple ? 'true' : nothing}\n ?hidden=${!this._open}\n >\n <div class=\"field__options\">${this._renderOptions()}</div>\n </div>\n\n \n <slot name=\"option\" @slotchange=${this._handleSlotChange} style=\"display:none;\"></slot>\n\n \n <slot name=\"error\" @slotchange=${this._handleErrorSlotChange}>\n ${hasError\n ? html`<div part=\"error\" class=\"field__error\" id=${this._errorId} role=\"alert\">\n ${this.error}\n </div>`\n : nothing}\n </slot>\n\n \n ${this.helpText && !hasError\n ? html`\n <div part=\"help-text\" class=\"field__help-text\" id=${this._helpTextId}>\n <slot name=\"help-text\">${this.helpText}</slot>\n </div>\n `\n : nothing}\n\n \n <div id=${this._liveRegionId} aria-live=\"polite\" aria-atomic=\"true\" class=\"field__sr-only\">\n ${this._filterAnnouncement}\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-combobox': HelixCombobox;\n }\n}\n\nexport type { HelixCombobox as HxCombobox };\n"],"names":["helixComboboxStyles","css","_comboboxIdCounter","HelixCombobox","LitElement","label","lower","o","changedProperties","state","_mode","disabled","el","_a","slot","parsed","child","input","count","filtered","enabledIndices","i","nextDown","lastEnabled","prevUp","lastEnabledUp","opt","option","current","next","val","options","index","html","repeat","isSelected","isFocused","classMap","nothing","hasError","showClear","fieldClasses","inputClasses","describedBy","activedescendant","e","ifDefined","tokenStyles","__decorateClass","property","query","customElement"],"mappings":"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"}

package/dist/shared/{hx-copy-button-CLBA31to.js → hx-copy-button--0dymSvw.js} RENAMED Viewed

@@ -144,6 +144,7 @@ let e = class extends u {
    * value. Prevents zero/negative timeouts that would cause the success state
    * to immediately revert with no visible or audible feedback.
    */
+  /** @internal */
   _effectiveDuration() {
     return Math.max(this.feedbackDuration, g);
   }
@@ -152,19 +153,24 @@ let e = class extends u {
    * not in the set of valid sizes. Prevents `button--xl` and similar class
    * names that have no matching CSS rule.
    */
+  /** @internal */
   _effectiveSize() {
     return w.has(this.size) ? this.size : "md";
   }
+  /** @internal */
   _clearFeedbackTimer() {
     this._feedbackTimer !== null && (clearTimeout(this._feedbackTimer), this._feedbackTimer = null);
   }
+  /** @internal */
   async _copyToClipboard() {
     await navigator.clipboard.writeText(this.value);
   }
   // ─── Event Handling ───
+  /** @internal */
   _handleClick() {
     this.disabled || this._performCopy();
   }
+  /** @internal */
   async _performCopy() {
     try {
       await this._copyToClipboard();
@@ -189,6 +195,7 @@ let e = class extends u {
     }, this._effectiveDuration());
   }
   // ─── Render Helpers ───
+  /** @internal */
   _buttonClasses() {
     return {
       button: !0,
@@ -196,6 +203,7 @@ let e = class extends u {
       "button--copied": this._copied
     };
   }
+  /** @internal */
   _renderIcon() {
     return a`
       <span part="icon" class="icon">
@@ -257,4 +265,4 @@ e = t([
 export {
   e as H
 };
-//# sourceMappingURL=hx-copy-button-CLBA31to.js.map
+//# sourceMappingURL=hx-copy-button--0dymSvw.js.map

package/dist/shared/{hx-copy-button-CLBA31to.js.map → hx-copy-button--0dymSvw.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"hx-copy-button-CLBA31to.js","sources":["../../src/components/hx-copy-button/hx-copy-button.styles.ts","../../src/components/hx-copy-button/hx-copy-button.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixCopyButtonStyles = css`\n :host {\n display: inline-block;\n }\n\n :host([disabled]) {\n pointer-events: none;\n }\n\n .button {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--hx-space-2);\n border: var(--hx-border-width-thin) solid var(--hx-copy-button-border-color, transparent);\n border-radius: var(--hx-copy-button-border-radius, var(--hx-border-radius-md));\n background-color: var(--hx-copy-button-bg, transparent);\n color: var(--hx-copy-button-color, var(--hx-color-primary-500));\n cursor: pointer;\n transition:\n background-color var(--hx-transition-fast),\n color var(--hx-transition-fast),\n border-color var(--hx-transition-fast),\n box-shadow var(--hx-transition-fast);\n text-decoration: none;\n user-select: none;\n -webkit-user-select: none;\n flex-shrink: 0;\n font-family: var(--hx-font-family-sans);\n font-weight: var(--hx-font-weight-medium);\n white-space: nowrap;\n }\n\n .button:focus-visible {\n outline: var(--hx-focus-ring-width) solid\n var(--hx-copy-button-focus-ring-color, var(--hx-focus-ring-color));\n outline-offset: var(--hx-focus-ring-offset);\n }\n\n .button:hover {\n filter: brightness(var(--hx-filter-brightness-hover, 0.9));\n }\n\n .button:active {\n filter: brightness(var(--hx-filter-brightness-active, 0.8));\n }\n\n /* ─── Size Variants ─── /\n\n .button--sm {\n padding: var(--hx-space-1);\n min-width: var(--hx-size-8);\n height: var(--hx-size-8);\n font-size: var(--hx-font-size-sm);\n }\n\n .button--md {\n padding: var(--hx-space-2);\n min-width: var(--hx-size-10);\n height: var(--hx-size-10);\n font-size: var(--hx-font-size-md);\n }\n\n .button--lg {\n padding: var(--hx-space-3);\n min-width: var(--hx-size-12);\n height: var(--hx-size-12);\n font-size: var(--hx-font-size-lg);\n }\n\n / ─── Copied / Success State ─── /\n\n .button--copied {\n color: var(--hx-color-success-text, var(--hx-color-primary-500));\n / Secondary non-color indicator required per WCAG 1.4.1 (use of color).\n A border provides visual differentiation for users with color blindness. /\n border-color: var(--hx-color-success-500, var(--hx-color-primary-500));\n }\n\n / ─── Icon Container ─── /\n\n .icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 1em;\n height: 1em;\n line-height: 1;\n pointer-events: none;\n flex-shrink: 0;\n }\n\n / ─── Disabled ─── /\n\n .button[disabled] {\n cursor: not-allowed;\n opacity: var(--hx-opacity-disabled);\n }\n\n / ─── Screen Reader Only ─── /\n\n .sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n }\n\n / ─── Reduced Motion ─── /\n\n @media (prefers-reduced-motion: reduce) {\n .button {\n transition: none;\n }\n }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixCopyButtonStyles } from './hx-copy-button.styles.js';\n\n/* Minimum allowed value for feedbackDuration (ms). /\nconst MIN_FEEDBACK_DURATION = 300;\n\n/* Allowed size values for runtime validation. /\nconst VALID_SIZES = new Set(['sm', 'md', 'lg']);\n\n/\n A clipboard copy button component that writes a given value to the system\n * clipboard. Provides idle and success states with configurable feedback\n * duration, slot-based icon overrides, and an accessible live region that\n * announces copy completion to screen reader users.\n \n The `aria-label` reflects the current copy state: idle shows `label`,\n * copied state appends \" — Copied\" so screen reader users who re-focus the\n * button after copy receive an accurate accessible name.\n \n Note: `aria-pressed` is intentionally NOT used. This is not a toggle button;\n * copied is a transient feedback state, not a persistent on/off toggle.\n \n @summary One-click clipboard copy with accessible success feedback.\n \n @tag hx-copy-button\n \n @slot - Optional label text rendered inside the button alongside the icon.\n * @slot copy-icon - Icon shown in the idle (pre-copy) state.\n * @slot success-icon - Icon shown after a successful clipboard write.\n \n @fires {CustomEvent<{value: string}>} hx-copy - Dispatched after the value\n * has been successfully written to the clipboard.\n * @fires {CustomEvent<{value: string; error: unknown}>} hx-copy-error - Dispatched\n * when the clipboard write fails (permission denied, iframe restriction, etc.).\n * The `error` detail contains the caught error for diagnostic use.\n \n @csspart button - The native button element.\n * @csspart icon - The icon container span wrapping the active icon slot.\n \n @cssprop [--hx-copy-button-bg=transparent] - Button background color.\n * @cssprop [--hx-copy-button-color=var(--hx-color-primary-500)] - Icon and text color.\n * @cssprop [--hx-copy-button-border-color=transparent] - Button border color.\n * @cssprop [--hx-copy-button-border-radius=var(--hx-border-radius-md)] - Button border radius.\n * @cssprop [--hx-copy-button-focus-ring-color=var(--hx-focus-ring-color)] - Focus ring color.\n /\n@customElement('hx-copy-button')\nexport class HelixCopyButton extends LitElement {\n static override styles = [tokenStyles, helixCopyButtonStyles];\n\n // ─── Public Properties ───\n\n /\n The text value to write to the clipboard on click. Required for the\n * component to perform a copy operation.\n * @attr value\n /\n @property({ type: String })\n value = '';\n\n /\n Accessible label applied as `aria-label` and `title` on the button.\n * @attr label\n /\n @property({ type: String })\n label = 'Copy to clipboard';\n\n /\n Duration in milliseconds to display the success (copied) state before\n * reverting to the idle state. Values below 300 ms are clamped to 300 ms\n * to ensure the success announcement remains visible long enough for\n * assistive technology and human perception.\n * @attr feedback-duration\n /\n @property({ type: Number, attribute: 'feedback-duration' })\n feedbackDuration = 2000;\n\n /\n Visual size of the button. Maps to fixed height and padding tokens.\n * Accepts: 'sm' \| 'md' \| 'lg'. Invalid values are silently coerced to 'md'.\n \n Accessibility (WCAG 2.5.8): The `sm` variant uses `--hx-size-8` for\n * its minimum width and height. Ensure this token resolves to at least 24×24 px\n * (WCAG 2.5.8 AA minimum target size). For touch-primary interfaces such as\n * mobile clinical apps, prefer `md` or `lg` to meet the 44×44 px recommended\n * target size (WCAG 2.5.5 AAA / Apple HIG / Android guidelines).\n \n @attr hx-size\n /\n @property({ type: String, reflect: true, attribute: 'hx-size' })\n size: 'sm' \| 'md' \| 'lg' = 'md';\n\n /\n Whether the button is disabled. When true, click events are suppressed\n * and clipboard writes do not occur.\n * @attr disabled\n /\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /\n Text announced to screen readers and appended to aria-label after a\n * successful copy. Also used as the content of the aria-live announcement.\n * @attr label-copied\n /\n @property({ type: String, attribute: 'label-copied' })\n labelCopied = 'Copied';\n\n // ─── Private State ───\n\n /* True while the success feedback window is active. /\n @state() private _copied = false;\n\n /* Non-empty string shown in the aria-live region; cleared when not active. /\n @state() private _announcement = '';\n\n /* Timeout handle used to revert the copied state. /\n private _feedbackTimer: ReturnType<typeof setTimeout> \| null = null;\n\n // ─── Lifecycle ───\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this._clearFeedbackTimer();\n }\n\n // ─── Private Helpers ───\n\n /\n Returns the effective feedback duration, clamped to the minimum allowed\n * value. Prevents zero/negative timeouts that would cause the success state\n * to immediately revert with no visible or audible feedback.\n /\n private _effectiveDuration(): number {\n return Math.max(this.feedbackDuration, MIN_FEEDBACK_DURATION);\n }\n\n /\n Returns the effective size, falling back to 'md' if the runtime value is\n * not in the set of valid sizes. Prevents `button--xl` and similar class\n * names that have no matching CSS rule.\n /\n private _effectiveSize(): 'sm' \| 'md' \| 'lg' {\n return VALID_SIZES.has(this.size) ? this.size : 'md';\n }\n\n private _clearFeedbackTimer(): void {\n if (this._feedbackTimer !== null) {\n clearTimeout(this._feedbackTimer);\n this._feedbackTimer = null;\n }\n }\n\n private async _copyToClipboard(): Promise<void> {\n await navigator.clipboard.writeText(this.value);\n }\n\n // ─── Event Handling ───\n\n private _handleClick(): void {\n if (this.disabled) {\n return;\n }\n\n void this._performCopy();\n }\n\n private async _performCopy(): Promise<void> {\n try {\n await this._copyToClipboard();\n } catch (error: unknown) {\n // Clipboard write failed — notify consumers and announce failure.\n this._announcement = 'Copy failed';\n\n /\n Dispatched when the clipboard write fails (permission denied, iframe\n * restriction, browser security policy, etc.).\n * @event hx-copy-error\n /\n this.dispatchEvent(\n new CustomEvent<{ value: string; error: unknown }>('hx-copy-error', {\n bubbles: true,\n composed: true,\n detail: { value: this.value, error },\n }),\n );\n return;\n }\n\n this._clearFeedbackTimer();\n this._copied = true;\n this._announcement = this.labelCopied;\n\n /\n Dispatched after the value has been successfully written to the\n * clipboard.\n * @event hx-copy\n */\n this.dispatchEvent(\n new CustomEvent<{ value: string }>('hx-copy', {\n bubbles: true,\n composed: true,\n detail: { value: this.value },\n }),\n );\n\n this._feedbackTimer = setTimeout(() => {\n this._copied = false;\n this._announcement = '';\n this._feedbackTimer = null;\n }, this._effectiveDuration());\n }\n\n // ─── Render Helpers ───\n\n private _buttonClasses() {\n const size = this._effectiveSize();\n return {\n button: true,\n [`button--${size}`]: true,\n 'button--copied': this._copied,\n };\n }\n\n private _renderIcon() {\n // Show success-icon slot when copied, copy-icon slot otherwise.\n return html`\n <span part=\"icon\" class=\"icon\">\n ${this._copied\n ? html`<slot name=\"success-icon\"></slot>`\n : html`<slot name=\"copy-icon\"></slot>`}\n </span>\n `;\n }\n\n // ─── Render ───\n\n override render() {\n // Reflect copied state in aria-label so re-focused button has an accurate\n // accessible name (WCAG 1.3.1). The live region handles the initial\n // announcement; this covers re-focus scenarios.\n const ariaLabel = this._copied ? `${this.label} — ${this.labelCopied}` : this.label;\n\n return html`\n <button\n part=\"button\"\n class=${classMap(this._buttonClasses())}\n type=\"button\"\n ?disabled=${this.disabled}\n aria-label=${ariaLabel}\n title=${this.label}\n @click=${this._handleClick}\n >\n ${this._renderIcon()}\n <slot></slot>\n </button>\n\n <span aria-live=\"polite\" aria-atomic=\"true\" class=\"sr-only\">\n ${this._announcement \|\| nothing}\n </span>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-copy-button': HelixCopyButton;\n }\n}\n"],"names":["helixCopyButtonStyles","css","MIN_FEEDBACK_DURATION","VALID_SIZES","HelixCopyButton","LitElement","error","html","ariaLabel","classMap","nothing","tokenStyles","__decorateClass","property","state","customElement"],"mappings":"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"}
1	+ {"version":3,"file":"hx-copy-button--0dymSvw.js","sources":["../../src/components/hx-copy-button/hx-copy-button.styles.ts","../../src/components/hx-copy-button/hx-copy-button.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixCopyButtonStyles = css`\n :host {\n display: inline-block;\n }\n\n :host([disabled]) {\n pointer-events: none;\n }\n\n .button {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--hx-space-2);\n border: var(--hx-border-width-thin) solid var(--hx-copy-button-border-color, transparent);\n border-radius: var(--hx-copy-button-border-radius, var(--hx-border-radius-md));\n background-color: var(--hx-copy-button-bg, transparent);\n color: var(--hx-copy-button-color, var(--hx-color-primary-500));\n cursor: pointer;\n transition:\n background-color var(--hx-transition-fast),\n color var(--hx-transition-fast),\n border-color var(--hx-transition-fast),\n box-shadow var(--hx-transition-fast);\n text-decoration: none;\n user-select: none;\n -webkit-user-select: none;\n flex-shrink: 0;\n font-family: var(--hx-font-family-sans);\n font-weight: var(--hx-font-weight-medium);\n white-space: nowrap;\n }\n\n .button:focus-visible {\n outline: var(--hx-focus-ring-width) solid\n var(--hx-copy-button-focus-ring-color, var(--hx-focus-ring-color));\n outline-offset: var(--hx-focus-ring-offset);\n }\n\n .button:hover {\n filter: brightness(var(--hx-filter-brightness-hover, 0.9));\n }\n\n .button:active {\n filter: brightness(var(--hx-filter-brightness-active, 0.8));\n }\n\n /* ─── Size Variants ─── /\n\n .button--sm {\n padding: var(--hx-space-1);\n min-width: var(--hx-size-8);\n height: var(--hx-size-8);\n font-size: var(--hx-font-size-sm);\n }\n\n .button--md {\n padding: var(--hx-space-2);\n min-width: var(--hx-size-10);\n height: var(--hx-size-10);\n font-size: var(--hx-font-size-md);\n }\n\n .button--lg {\n padding: var(--hx-space-3);\n min-width: var(--hx-size-12);\n height: var(--hx-size-12);\n font-size: var(--hx-font-size-lg);\n }\n\n / ─── Copied / Success State ─── /\n\n .button--copied {\n color: var(--hx-color-success-text, var(--hx-color-primary-500));\n / Secondary non-color indicator required per WCAG 1.4.1 (use of color).\n A border provides visual differentiation for users with color blindness. /\n border-color: var(--hx-color-success-500, var(--hx-color-primary-500));\n }\n\n / ─── Icon Container ─── /\n\n .icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 1em;\n height: 1em;\n line-height: 1;\n pointer-events: none;\n flex-shrink: 0;\n }\n\n / ─── Disabled ─── /\n\n .button[disabled] {\n cursor: not-allowed;\n opacity: var(--hx-opacity-disabled);\n }\n\n / ─── Screen Reader Only ─── /\n\n .sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n }\n\n / ─── Reduced Motion ─── /\n\n @media (prefers-reduced-motion: reduce) {\n .button {\n transition: none;\n }\n }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixCopyButtonStyles } from './hx-copy-button.styles.js';\n\n/* Minimum allowed value for feedbackDuration (ms). /\nconst MIN_FEEDBACK_DURATION = 300;\n\n/* Allowed size values for runtime validation. /\nconst VALID_SIZES = new Set(['sm', 'md', 'lg']);\n\n/\n A clipboard copy button component that writes a given value to the system\n * clipboard. Provides idle and success states with configurable feedback\n * duration, slot-based icon overrides, and an accessible live region that\n * announces copy completion to screen reader users.\n \n The `aria-label` reflects the current copy state: idle shows `label`,\n * copied state appends \" — Copied\" so screen reader users who re-focus the\n * button after copy receive an accurate accessible name.\n \n Note: `aria-pressed` is intentionally NOT used. This is not a toggle button;\n * copied is a transient feedback state, not a persistent on/off toggle.\n \n @summary One-click clipboard copy with accessible success feedback.\n \n @tag hx-copy-button\n \n @slot - Optional label text rendered inside the button alongside the icon.\n * @slot copy-icon - Icon shown in the idle (pre-copy) state.\n * @slot success-icon - Icon shown after a successful clipboard write.\n \n @fires {CustomEvent<{value: string}>} hx-copy - Dispatched after the value\n * has been successfully written to the clipboard.\n * @fires {CustomEvent<{value: string; error: unknown}>} hx-copy-error - Dispatched\n * when the clipboard write fails (permission denied, iframe restriction, etc.).\n * The `error` detail contains the caught error for diagnostic use.\n \n @csspart button - The native button element.\n * @csspart icon - The icon container span wrapping the active icon slot.\n \n @cssprop [--hx-copy-button-bg=transparent] - Button background color.\n * @cssprop [--hx-copy-button-color=var(--hx-color-primary-500)] - Icon and text color.\n * @cssprop [--hx-copy-button-border-color=transparent] - Button border color.\n * @cssprop [--hx-copy-button-border-radius=var(--hx-border-radius-md)] - Button border radius.\n * @cssprop [--hx-copy-button-focus-ring-color=var(--hx-focus-ring-color)] - Focus ring color.\n /\n@customElement('hx-copy-button')\nexport class HelixCopyButton extends LitElement {\n static override styles = [tokenStyles, helixCopyButtonStyles];\n\n // ─── Public Properties ───\n\n /\n The text value to write to the clipboard on click. Required for the\n * component to perform a copy operation.\n * @attr value\n /\n @property({ type: String })\n value = '';\n\n /\n Accessible label applied as `aria-label` and `title` on the button.\n * @attr label\n /\n @property({ type: String })\n label = 'Copy to clipboard';\n\n /\n Duration in milliseconds to display the success (copied) state before\n * reverting to the idle state. Values below 300 ms are clamped to 300 ms\n * to ensure the success announcement remains visible long enough for\n * assistive technology and human perception.\n * @attr feedback-duration\n /\n @property({ type: Number, attribute: 'feedback-duration' })\n feedbackDuration = 2000;\n\n /\n Visual size of the button. Maps to fixed height and padding tokens.\n * Accepts: 'sm' \| 'md' \| 'lg'. Invalid values are silently coerced to 'md'.\n \n Accessibility (WCAG 2.5.8): The `sm` variant uses `--hx-size-8` for\n * its minimum width and height. Ensure this token resolves to at least 24×24 px\n * (WCAG 2.5.8 AA minimum target size). For touch-primary interfaces such as\n * mobile clinical apps, prefer `md` or `lg` to meet the 44×44 px recommended\n * target size (WCAG 2.5.5 AAA / Apple HIG / Android guidelines).\n \n @attr hx-size\n /\n @property({ type: String, reflect: true, attribute: 'hx-size' })\n size: 'sm' \| 'md' \| 'lg' = 'md';\n\n /\n Whether the button is disabled. When true, click events are suppressed\n * and clipboard writes do not occur.\n * @attr disabled\n /\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /\n Text announced to screen readers and appended to aria-label after a\n * successful copy. Also used as the content of the aria-live announcement.\n * @attr label-copied\n /\n @property({ type: String, attribute: 'label-copied' })\n labelCopied = 'Copied';\n\n // ─── Private State ───\n\n /* True while the success feedback window is active. /\n /* @internal /\n @state() private _copied = false;\n\n /* Non-empty string shown in the aria-live region; cleared when not active. /\n /* @internal /\n @state() private _announcement = '';\n\n /* Timeout handle used to revert the copied state. /\n /* @internal /\n private _feedbackTimer: ReturnType<typeof setTimeout> \| null = null;\n\n // ─── Lifecycle ───\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this._clearFeedbackTimer();\n }\n\n // ─── Private Helpers ───\n\n /\n Returns the effective feedback duration, clamped to the minimum allowed\n * value. Prevents zero/negative timeouts that would cause the success state\n * to immediately revert with no visible or audible feedback.\n /\n /* @internal /\n private _effectiveDuration(): number {\n return Math.max(this.feedbackDuration, MIN_FEEDBACK_DURATION);\n }\n\n /\n Returns the effective size, falling back to 'md' if the runtime value is\n * not in the set of valid sizes. Prevents `button--xl` and similar class\n * names that have no matching CSS rule.\n /\n /* @internal /\n private _effectiveSize(): 'sm' \| 'md' \| 'lg' {\n return VALID_SIZES.has(this.size) ? this.size : 'md';\n }\n\n /* @internal /\n private _clearFeedbackTimer(): void {\n if (this._feedbackTimer !== null) {\n clearTimeout(this._feedbackTimer);\n this._feedbackTimer = null;\n }\n }\n\n /* @internal /\n private async _copyToClipboard(): Promise<void> {\n await navigator.clipboard.writeText(this.value);\n }\n\n // ─── Event Handling ───\n\n /* @internal /\n private _handleClick(): void {\n if (this.disabled) {\n return;\n }\n\n void this._performCopy();\n }\n\n /* @internal /\n private async _performCopy(): Promise<void> {\n try {\n await this._copyToClipboard();\n } catch (error: unknown) {\n // Clipboard write failed — notify consumers and announce failure.\n this._announcement = 'Copy failed';\n\n /\n Dispatched when the clipboard write fails (permission denied, iframe\n * restriction, browser security policy, etc.).\n * @event hx-copy-error\n /\n this.dispatchEvent(\n new CustomEvent<{ value: string; error: unknown }>('hx-copy-error', {\n bubbles: true,\n composed: true,\n detail: { value: this.value, error },\n }),\n );\n return;\n }\n\n this._clearFeedbackTimer();\n this._copied = true;\n this._announcement = this.labelCopied;\n\n /\n Dispatched after the value has been successfully written to the\n * clipboard.\n * @event hx-copy\n /\n this.dispatchEvent(\n new CustomEvent<{ value: string }>('hx-copy', {\n bubbles: true,\n composed: true,\n detail: { value: this.value },\n }),\n );\n\n this._feedbackTimer = setTimeout(() => {\n this._copied = false;\n this._announcement = '';\n this._feedbackTimer = null;\n }, this._effectiveDuration());\n }\n\n // ─── Render Helpers ───\n\n /* @internal /\n private _buttonClasses() {\n const size = this._effectiveSize();\n return {\n button: true,\n [`button--${size}`]: true,\n 'button--copied': this._copied,\n };\n }\n\n /* @internal */\n private _renderIcon() {\n // Show success-icon slot when copied, copy-icon slot otherwise.\n return html`\n <span part=\"icon\" class=\"icon\">\n ${this._copied\n ? html`<slot name=\"success-icon\"></slot>`\n : html`<slot name=\"copy-icon\"></slot>`}\n </span>\n `;\n }\n\n // ─── Render ───\n\n override render() {\n // Reflect copied state in aria-label so re-focused button has an accurate\n // accessible name (WCAG 1.3.1). The live region handles the initial\n // announcement; this covers re-focus scenarios.\n const ariaLabel = this._copied ? `${this.label} — ${this.labelCopied}` : this.label;\n\n return html`\n <button\n part=\"button\"\n class=${classMap(this._buttonClasses())}\n type=\"button\"\n ?disabled=${this.disabled}\n aria-label=${ariaLabel}\n title=${this.label}\n @click=${this._handleClick}\n >\n ${this._renderIcon()}\n <slot></slot>\n </button>\n\n <span aria-live=\"polite\" aria-atomic=\"true\" class=\"sr-only\">\n ${this._announcement \|\| nothing}\n </span>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-copy-button': HelixCopyButton;\n }\n}\n"],"names":["helixCopyButtonStyles","css","MIN_FEEDBACK_DURATION","VALID_SIZES","HelixCopyButton","LitElement","error","html","ariaLabel","classMap","nothing","tokenStyles","__decorateClass","property","state","customElement"],"mappings":";;;;AAEO,MAAMA,IAAwBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;ACKrC,MAAMC,IAAwB,KAGxBC,IAAc,oBAAI,IAAI,CAAC,MAAM,MAAM,IAAI,CAAC;AAuCvC,IAAMC,IAAN,cAA8BC,EAAW;AAAA,EAAzC,cAAA;AAAA,UAAA,GAAA,SAAA,GAWL,KAAA,QAAQ,IAOR,KAAA,QAAQ,qBAUR,KAAA,mBAAmB,KAenB,KAAA,OAA2B,MAQ3B,KAAA,WAAW,IAQX,KAAA,cAAc,UAML,KAAQ,UAAU,IAIlB,KAAQ,gBAAgB,IAIjC,KAAQ,iBAAuD;AAAA,EAAA;AAAA;AAAA,EAItD,uBAA6B;AACpC,UAAM,qBAAA,GACN,KAAK,oBAAA;AAAA,EACP;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUQ,qBAA6B;AACnC,WAAO,KAAK,IAAI,KAAK,kBAAkBH,CAAqB;AAAA,EAC9D;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQQ,iBAAqC;AAC3C,WAAOC,EAAY,IAAI,KAAK,IAAI,IAAI,KAAK,OAAO;AAAA,EAClD;AAAA;AAAA,EAGQ,sBAA4B;AAClC,IAAI,KAAK,mBAAmB,SAC1B,aAAa,KAAK,cAAc,GAChC,KAAK,iBAAiB;AAAA,EAE1B;AAAA;AAAA,EAGA,MAAc,mBAAkC;AAC9C,UAAM,UAAU,UAAU,UAAU,KAAK,KAAK;AAAA,EAChD;AAAA;AAAA;AAAA,EAKQ,eAAqB;AAC3B,IAAI,KAAK,YAIJ,KAAK,aAAA;AAAA,EACZ;AAAA;AAAA,EAGA,MAAc,eAA8B;AAC1C,QAAI;AACF,YAAM,KAAK,iBAAA;AAAA,IACb,SAASG,GAAgB;AAEvB,WAAK,gBAAgB,eAOrB,KAAK;AAAA,QACH,IAAI,YAA+C,iBAAiB;AAAA,UAClE,SAAS;AAAA,UACT,UAAU;AAAA,UACV,QAAQ,EAAE,OAAO,KAAK,OAAO,OAAAA,EAAA;AAAA,QAAM,CACpC;AAAA,MAAA;AAEH;AAAA,IACF;AAEA,SAAK,oBAAA,GACL,KAAK,UAAU,IACf,KAAK,gBAAgB,KAAK,aAO1B,KAAK;AAAA,MACH,IAAI,YAA+B,WAAW;AAAA,QAC5C,SAAS;AAAA,QACT,UAAU;AAAA,QACV,QAAQ,EAAE,OAAO,KAAK,MAAA;AAAA,MAAM,CAC7B;AAAA,IAAA,GAGH,KAAK,iBAAiB,WAAW,MAAM;AACrC,WAAK,UAAU,IACf,KAAK,gBAAgB,IACrB,KAAK,iBAAiB;AAAA,IACxB,GAAG,KAAK,oBAAoB;AAAA,EAC9B;AAAA;AAAA;AAAA,EAKQ,iBAAiB;AAEvB,WAAO;AAAA,MACL,QAAQ;AAAA,MACR,CAAC,WAHU,KAAK,eAAA,CAGA,EAAE,GAAG;AAAA,MACrB,kBAAkB,KAAK;AAAA,IAAA;AAAA,EAE3B;AAAA;AAAA,EAGQ,cAAc;AAEpB,WAAOC;AAAA;AAAA,UAED,KAAK,UACHA,uCACAA,iCAAoC;AAAA;AAAA;AAAA,EAG9C;AAAA;AAAA,EAIS,SAAS;AAIhB,UAAMC,IAAY,KAAK,UAAU,GAAG,KAAK,KAAK,MAAM,KAAK,WAAW,KAAK,KAAK;AAE9E,WAAOD;AAAA;AAAA;AAAA,gBAGKE,EAAS,KAAK,gBAAgB,CAAC;AAAA;AAAA,oBAE3B,KAAK,QAAQ;AAAA,qBACZD,CAAS;AAAA,gBACd,KAAK,KAAK;AAAA,iBACT,KAAK,YAAY;AAAA;AAAA,UAExB,KAAK,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA,UAKlB,KAAK,iBAAiBE,CAAO;AAAA;AAAA;AAAA,EAGrC;AACF;AAlOaN,EACK,SAAS,CAACO,GAAaX,CAAqB;AAU5DY,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAVfT,EAWX,WAAA,SAAA,CAAA;AAOAQ,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAjBfT,EAkBX,WAAA,SAAA,CAAA;AAUAQ,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,WAAW,qBAAqB;AAAA,GA3B/CT,EA4BX,WAAA,oBAAA,CAAA;AAeAQ,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM,WAAW,WAAW;AAAA,GA1CpDT,EA2CX,WAAA,QAAA,CAAA;AAQAQ,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAlD/BT,EAmDX,WAAA,YAAA,CAAA;AAQAQ,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,WAAW,gBAAgB;AAAA,GA1D1CT,EA2DX,WAAA,eAAA,CAAA;AAMiBQ,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAjEIV,EAiEM,WAAA,WAAA,CAAA;AAIAQ,EAAA;AAAA,EAAhBE,EAAA;AAAM,GArEIV,EAqEM,WAAA,iBAAA,CAAA;AArENA,IAANQ,EAAA;AAAA,EADNG,EAAc,gBAAgB;AAAA,GAClBX,CAAA;"}

package/dist/shared/{hx-counter-D-1NXzGs.js → hx-counter-Duf00H7p.js} RENAMED Viewed

@@ -1,5 +1,5 @@
-import { css as h, LitElement as c, html as m } from "lit";
-import { property as r, state as p, customElement as d } from "lit/decorators.js";
+import { css as h, LitElement as c, html as p } from "lit";
+import { property as r, state as m, customElement as d } from "lit/decorators.js";
 import { classMap as f } from "lit/directives/class-map.js";
 import { tokenStyles as _ } from "@helixui/tokens/lit";
 const y = h`
@@ -40,99 +40,108 @@ const y = h`
     }
   }
 `;
-var v = Object.defineProperty, x = Object.getOwnPropertyDescriptor, s = (e, a, o, n) => {
-  for (var i = n > 1 ? void 0 : n ? x(a, o) : a, l = e.length - 1, u; l >= 0; l--)
-    (u = e[l]) && (i = (n ? u(a, o, i) : u(i)) || i);
-  return n && i && v(a, o, i), i;
+var v = Object.defineProperty, x = Object.getOwnPropertyDescriptor, a = (t, i, o, n) => {
+  for (var s = n > 1 ? void 0 : n ? x(i, o) : i, l = t.length - 1, u; l >= 0; l--)
+    (u = t[l]) && (s = (n ? u(i, o, s) : u(s)) || s);
+  return n && s && v(i, o, s), s;
 };
-let t = class extends c {
+let e = class extends c {
   constructor() {
     super(...arguments), this.value = 0, this.duration = 1e3, this.easing = "ease-out", this.format = "integer", this.prefix = "", this.suffix = "", this.size = "md", this._displayValue = 0, this._animationId = null, this._startTime = null, this._startValue = 0, this._prefersReducedMotion = !1;
   }
   // ─── Lifecycle ───
   connectedCallback() {
     super.connectedCallback();
-    const e = window.matchMedia("(prefers-reduced-motion: reduce)");
-    this._prefersReducedMotion = e.matches, this._prefersReducedMotion ? this._displayValue = this.value : this._startAnimation();
+    const t = this.getAttribute("size");
+    if (t !== null && !this.hasAttribute("hx-size") && (this.size = t), typeof window > "u") {
+      this._displayValue = this.value;
+      return;
+    }
+    const i = window.matchMedia("(prefers-reduced-motion: reduce)");
+    this._prefersReducedMotion = i.matches, this._prefersReducedMotion ? this._displayValue = this.value : this._startAnimation();
   }
   disconnectedCallback() {
     super.disconnectedCallback(), this._cancelAnimation();
   }
-  updated(e) {
-    e.has("value") && e.get("value") !== void 0 && (this._prefersReducedMotion ? this._displayValue = this.value : (this._startValue = this._displayValue, this._startTime = null, this._startAnimation()));
+  updated(t) {
+    super.updated(t), t.has("value") && t.get("value") !== void 0 && (this._prefersReducedMotion ? this._displayValue = this.value : (this._startValue = this._displayValue, this._startTime = null, this._startAnimation()));
   }
   // ─── Animation ───
+  /** @internal */
   _cancelAnimation() {
     this._animationId !== null && (cancelAnimationFrame(this._animationId), this._animationId = null);
   }
-  _applyEasing(e) {
+  /** @internal */
+  _applyEasing(t) {
     switch (this.easing) {
       case "linear":
-        return e;
+        return t;
       case "ease-in":
-        return e * e;
+        return t * t;
       case "ease-out":
-        return e * (2 - e);
+        return t * (2 - t);
       case "ease-in-out":
-        return e < 0.5 ? 2 * e * e : -1 + (4 - 2 * e) * e;
+        return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t;
     }
   }
+  /** @internal */
   _startAnimation() {
     this._cancelAnimation();
-    const e = (a) => {
-      this._startTime === null && (this._startTime = a);
-      const o = a - this._startTime, n = Math.min(o / this.duration, 1), i = this._applyEasing(n);
-      this._displayValue = this._startValue + (this.value - this._startValue) * i, n < 1 ? this._animationId = requestAnimationFrame(e) : (this._displayValue = this.value, this._animationId = null);
+    const t = (i) => {
+      this._startTime === null && (this._startTime = i);
+      const o = i - this._startTime, n = Math.min(o / this.duration, 1), s = this._applyEasing(n);
+      this._displayValue = this._startValue + (this.value - this._startValue) * s, n < 1 ? this._animationId = requestAnimationFrame(t) : (this._displayValue = this.value, this._animationId = null);
     };
-    this._animationId = requestAnimationFrame(e);
+    this._animationId = requestAnimationFrame(t);
   }
   // ─── Formatting ───
+  /** @internal */
   _formatValue() {
-    const e = this.format === "integer" ? Math.round(this._displayValue) : parseFloat(this._displayValue.toFixed(2));
-    return `${this.prefix}${e.toLocaleString()}${this.suffix}`;
+    const t = this.format === "integer" ? Math.round(this._displayValue) : parseFloat(this._displayValue.toFixed(2));
+    return `${this.prefix}${t.toLocaleString()}${this.suffix}`;
   }
   // ─── Render ───
   render() {
-    const e = {
+    const t = {
       counter: !0,
       [`counter--${this.size}`]: !0
     };
-    return m`
-      <span part="counter" class=${f(e)} aria-live="polite" aria-atomic="true">
+    return p`
+      <span part="counter" class=${f(t)} aria-live="polite" aria-atomic="true">
         ${this._formatValue()}
       </span>
     `;
   }
 };
-t.styles = [_, y];
-s([
+e.styles = [_, y];
+a([
   r({ type: Number })
-], t.prototype, "value", 2);
-s([
+], e.prototype, "value", 2);
+a([
   r({ type: Number })
-], t.prototype, "duration", 2);
-s([
+], e.prototype, "duration", 2);
+a([
   r({ type: String })
-], t.prototype, "easing", 2);
-s([
+], e.prototype, "easing", 2);
+a([
   r({ type: String })
-], t.prototype, "format", 2);
-s([
+], e.prototype, "format", 2);
+a([
   r({ type: String })
-], t.prototype, "prefix", 2);
-s([
+], e.prototype, "prefix", 2);
+a([
   r({ type: String })
-], t.prototype, "suffix", 2);
-s([
-  r({ type: String, reflect: !0 })
-], t.prototype, "size", 2);
-s([
-  p()
-], t.prototype, "_displayValue", 2);
-t = s([
+], e.prototype, "suffix", 2);
+a([
+  r({ type: String, reflect: !0, attribute: "hx-size" })
+], e.prototype, "size", 2);
+a([
+  m()
+], e.prototype, "_displayValue", 2);
+e = a([
   d("hx-counter")
-], t);
+], e);
 export {
-  t as H
+  e as H
 };
-//# sourceMappingURL=hx-counter-D-1NXzGs.js.map
+//# sourceMappingURL=hx-counter-Duf00H7p.js.map

package/dist/shared/hx-counter-Duf00H7p.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"hx-counter-Duf00H7p.js","sources":["../../src/components/hx-counter/hx-counter.styles.ts","../../src/components/hx-counter/hx-counter.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixCounterStyles = css`\n :host {\n display: inline-block;\n }\n\n .counter {\n display: inline-flex;\n align-items: baseline;\n font-family: var(--hx-counter-font-family, var(--hx-font-family-sans, sans-serif));\n font-weight: var(--hx-counter-font-weight, var(--hx-font-weight-bold, 700));\n color: var(--hx-counter-color, var(--hx-color-neutral-900, #111827));\n line-height: var(--hx-line-height-tight, 1.25);\n font-variant-numeric: tabular-nums;\n }\n\n /* ─── Size Variants ─── */\n\n .counter--sm {\n font-size: var(--hx-counter-font-size-sm, var(--hx-font-size-xl, 1.25rem));\n }\n\n .counter--md {\n font-size: var(--hx-counter-font-size-md, var(--hx-font-size-3xl, 1.875rem));\n }\n\n .counter--lg {\n font-size: var(--hx-counter-font-size-lg, var(--hx-font-size-5xl, 3rem));\n }\n\n /* ─── Reduced Motion ─── */\n\n @media (prefers-reduced-motion: reduce) {\n .counter {\n /* Animation is handled in JS — reduced-motion consumers\n will see the final value immediately via the component logic */\n }\n }\n`;\n","import { LitElement, html, type PropertyValues } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixCounterStyles } from './hx-counter.styles.js';\nimport { devWarn } from '../../utils/dev-warn.js';\n\nexport type CounterSize = 'sm' | 'md' | 'lg';\nexport type CounterEasing = 'linear' | 'ease-in' | 'ease-out' | 'ease-in-out';\nexport type CounterFormat = 'integer' | 'decimal';\n\n/**\n * Animated number counter that counts from 0 (or the previous value) to the\n * target value using requestAnimationFrame. Respects prefers-reduced-motion.\n *\n * @summary Displays an animated numeric counter that transitions to a target value.\n *\n * @tag hx-counter\n *\n * @csspart counter - The outer counter element.\n *\n * @cssprop [--hx-counter-font-family=var(--hx-font-family-sans)] - Font family.\n * @cssprop [--hx-counter-font-weight=var(--hx-font-weight-bold)] - Font weight.\n * @cssprop [--hx-counter-color=var(--hx-color-neutral-900)] - Counter text color.\n * @cssprop [--hx-counter-font-size-sm=var(--hx-font-size-xl)] - Font size at sm.\n * @cssprop [--hx-counter-font-size-md=var(--hx-font-size-3xl)] - Font size at md.\n * @cssprop [--hx-counter-font-size-lg=var(--hx-font-size-5xl)] - Font size at lg.\n */\n@customElement('hx-counter')\nexport class HelixCounter extends LitElement {\n static override styles = [tokenStyles, helixCounterStyles];\n\n /**\n * The target numeric value to count to.\n * @attr value\n */\n @property({ type: Number })\n value = 0;\n\n /**\n * Animation duration in milliseconds.\n * @attr duration\n */\n @property({ type: Number })\n duration = 1000;\n\n /**\n * Easing function applied to the animation progress.\n * @attr easing\n */\n @property({ type: String })\n easing: CounterEasing = 'ease-out';\n\n /**\n * Number format. 'integer' rounds to the nearest whole number;\n * 'decimal' shows two decimal places.\n * @attr format\n */\n @property({ type: String })\n format: CounterFormat = 'integer';\n\n /**\n * String prepended to the formatted value (e.g., '$').\n * @attr prefix\n */\n @property({ type: String })\n prefix = '';\n\n /**\n * String appended to the formatted value (e.g., '%').\n * @attr suffix\n */\n @property({ type: String })\n suffix = '';\n\n /**\n * Size variant controlling font size.\n * @attr hx-size\n */\n @property({ type: String, reflect: true, attribute: 'hx-size' })\n size: CounterSize = 'md';\n\n // ─── Internal State ───\n\n /** @internal */\n @state() private _displayValue = 0;\n\n /** @internal */\n private _animationId: number | null = null;\n /** @internal */\n private _startTime: number | null = null;\n /** @internal */\n private _startValue = 0;\n /** @internal */\n private _prefersReducedMotion = false;\n\n // ─── Lifecycle ───\n\n override connectedCallback(): void {\n super.connectedCallback();\n // Backward compat: accept legacy `size` attribute. When present and `hx-size`\n // is not set, map the value and emit a deprecation warning.\n const legacySize = this.getAttribute('size');\n if (legacySize !== null && !this.hasAttribute('hx-size')) {\n devWarn('hx-counter', 'The \"size\" attribute is deprecated. Use \"hx-size\" instead.');\n this.size = legacySize as CounterSize;\n }\n\n // Guard for SSR — window.matchMedia and requestAnimationFrame are unavailable server-side\n if (typeof window === 'undefined') {\n this._displayValue = this.value;\n return;\n }\n\n const mq = window.matchMedia('(prefers-reduced-motion: reduce)');\n this._prefersReducedMotion = mq.matches;\n\n if (this._prefersReducedMotion) {\n this._displayValue = this.value;\n } else {\n this._startAnimation();\n }\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this._cancelAnimation();\n }\n\n override updated(changedProps: PropertyValues<this>): void {\n super.updated(changedProps);\n if (changedProps.has('value') && changedProps.get('value') !== undefined) {\n if (this._prefersReducedMotion) {\n this._displayValue = this.value;\n } else {\n this._startValue = this._displayValue;\n this._startTime = null;\n this._startAnimation();\n }\n }\n }\n\n // ─── Animation ───\n\n /** @internal */\n private _cancelAnimation(): void {\n if (this._animationId !== null) {\n cancelAnimationFrame(this._animationId);\n this._animationId = null;\n }\n }\n\n /** @internal */\n private _applyEasing(t: number): number {\n switch (this.easing) {\n case 'linear':\n return t;\n case 'ease-in':\n return t * t;\n case 'ease-out':\n return t * (2 - t);\n case 'ease-in-out':\n return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t;\n }\n }\n\n /** @internal */\n private _startAnimation(): void {\n this._cancelAnimation();\n\n const step = (timestamp: number): void => {\n if (this._startTime === null) {\n this._startTime = timestamp;\n }\n\n const elapsed = timestamp - this._startTime;\n const rawProgress = Math.min(elapsed / this.duration, 1);\n const easedProgress = this._applyEasing(rawProgress);\n\n this._displayValue = this._startValue + (this.value - this._startValue) * easedProgress;\n\n if (rawProgress < 1) {\n this._animationId = requestAnimationFrame(step);\n } else {\n this._displayValue = this.value;\n this._animationId = null;\n }\n };\n\n this._animationId = requestAnimationFrame(step);\n }\n\n // ─── Formatting ───\n\n /** @internal */\n private _formatValue(): string {\n const num =\n this.format === 'integer'\n ? Math.round(this._displayValue)\n : parseFloat(this._displayValue.toFixed(2));\n\n return `${this.prefix}${num.toLocaleString()}${this.suffix}`;\n }\n\n // ─── Render ───\n\n override render() {\n const classes = {\n counter: true,\n [`counter--${this.size}`]: true,\n };\n\n return html`\n <span part=\"counter\" class=${classMap(classes)} aria-live=\"polite\" aria-atomic=\"true\">\n ${this._formatValue()}\n </span>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-counter': HelixCounter;\n }\n}\n"],"names":["helixCounterStyles","css","HelixCounter","LitElement","legacySize","mq","changedProps","step","timestamp","elapsed","rawProgress","easedProgress","num","classes","html","classMap","tokenStyles","__decorateClass","property","state","customElement"],"mappings":";;;;AAEO,MAAMA,IAAqBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;AC2B3B,IAAMC,IAAN,cAA2BC,EAAW;AAAA,EAAtC,cAAA;AAAA,UAAA,GAAA,SAAA,GAQL,KAAA,QAAQ,GAOR,KAAA,WAAW,KAOX,KAAA,SAAwB,YAQxB,KAAA,SAAwB,WAOxB,KAAA,SAAS,IAOT,KAAA,SAAS,IAOT,KAAA,OAAoB,MAKX,KAAQ,gBAAgB,GAGjC,KAAQ,eAA8B,MAEtC,KAAQ,aAA4B,MAEpC,KAAQ,cAAc,GAEtB,KAAQ,wBAAwB;AAAA,EAAA;AAAA;AAAA,EAIvB,oBAA0B;AACjC,UAAM,kBAAA;AAGN,UAAMC,IAAa,KAAK,aAAa,MAAM;AAO3C,QANIA,MAAe,QAAQ,CAAC,KAAK,aAAa,SAAS,MAErD,KAAK,OAAOA,IAIV,OAAO,SAAW,KAAa;AACjC,WAAK,gBAAgB,KAAK;AAC1B;AAAA,IACF;AAEA,UAAMC,IAAK,OAAO,WAAW,kCAAkC;AAC/D,SAAK,wBAAwBA,EAAG,SAE5B,KAAK,wBACP,KAAK,gBAAgB,KAAK,QAE1B,KAAK,gBAAA;AAAA,EAET;AAAA,EAES,uBAA6B;AACpC,UAAM,qBAAA,GACN,KAAK,iBAAA;AAAA,EACP;AAAA,EAES,QAAQC,GAA0C;AACzD,UAAM,QAAQA,CAAY,GACtBA,EAAa,IAAI,OAAO,KAAKA,EAAa,IAAI,OAAO,MAAM,WACzD,KAAK,wBACP,KAAK,gBAAgB,KAAK,SAE1B,KAAK,cAAc,KAAK,eACxB,KAAK,aAAa,MAClB,KAAK,gBAAA;AAAA,EAGX;AAAA;AAAA;AAAA,EAKQ,mBAAyB;AAC/B,IAAI,KAAK,iBAAiB,SACxB,qBAAqB,KAAK,YAAY,GACtC,KAAK,eAAe;AAAA,EAExB;AAAA;AAAA,EAGQ,aAAa,GAAmB;AACtC,YAAQ,KAAK,QAAA;AAAA,MACX,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO,IAAI;AAAA,MACb,KAAK;AACH,eAAO,KAAK,IAAI;AAAA,MAClB,KAAK;AACH,eAAO,IAAI,MAAM,IAAI,IAAI,IAAI,MAAM,IAAI,IAAI,KAAK;AAAA,IAAA;AAAA,EAEtD;AAAA;AAAA,EAGQ,kBAAwB;AAC9B,SAAK,iBAAA;AAEL,UAAMC,IAAO,CAACC,MAA4B;AACxC,MAAI,KAAK,eAAe,SACtB,KAAK,aAAaA;AAGpB,YAAMC,IAAUD,IAAY,KAAK,YAC3BE,IAAc,KAAK,IAAID,IAAU,KAAK,UAAU,CAAC,GACjDE,IAAgB,KAAK,aAAaD,CAAW;AAEnD,WAAK,gBAAgB,KAAK,eAAe,KAAK,QAAQ,KAAK,eAAeC,GAEtED,IAAc,IAChB,KAAK,eAAe,sBAAsBH,CAAI,KAE9C,KAAK,gBAAgB,KAAK,OAC1B,KAAK,eAAe;AAAA,IAExB;AAEA,SAAK,eAAe,sBAAsBA,CAAI;AAAA,EAChD;AAAA;AAAA;AAAA,EAKQ,eAAuB;AAC7B,UAAMK,IACJ,KAAK,WAAW,YACZ,KAAK,MAAM,KAAK,aAAa,IAC7B,WAAW,KAAK,cAAc,QAAQ,CAAC,CAAC;AAE9C,WAAO,GAAG,KAAK,MAAM,GAAGA,EAAI,gBAAgB,GAAG,KAAK,MAAM;AAAA,EAC5D;AAAA;AAAA,EAIS,SAAS;AAChB,UAAMC,IAAU;AAAA,MACd,SAAS;AAAA,MACT,CAAC,YAAY,KAAK,IAAI,EAAE,GAAG;AAAA,IAAA;AAG7B,WAAOC;AAAA,mCACwBC,EAASF,CAAO,CAAC;AAAA,UAC1C,KAAK,cAAc;AAAA;AAAA;AAAA,EAG3B;AACF;AA7LaX,EACK,SAAS,CAACc,GAAahB,CAAkB;AAOzDiB,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAPfhB,EAQX,WAAA,SAAA,CAAA;AAOAe,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAdfhB,EAeX,WAAA,YAAA,CAAA;AAOAe,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GArBfhB,EAsBX,WAAA,UAAA,CAAA;AAQAe,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA7BfhB,EA8BX,WAAA,UAAA,CAAA;AAOAe,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GApCfhB,EAqCX,WAAA,UAAA,CAAA;AAOAe,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA3CfhB,EA4CX,WAAA,UAAA,CAAA;AAOAe,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM,WAAW,WAAW;AAAA,GAlDpDhB,EAmDX,WAAA,QAAA,CAAA;AAKiBe,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAxDIjB,EAwDM,WAAA,iBAAA,CAAA;AAxDNA,IAANe,EAAA;AAAA,EADNG,EAAc,YAAY;AAAA,GACdlB,CAAA;"}