npm - @helixui/library - Versions diffs - 1.1.2-next.1 → 1.1.2-next.10 - Mend

@helixui/library 1.1.2-next.1 → 1.1.2-next.10

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 (150) hide show

package/dist/shared/hx-time-picker-BpCRsh_z.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"hx-time-picker-BpCRsh_z.js","sources":["../../src/components/hx-time-picker/hx-time-picker.styles.ts","../../src/components/hx-time-picker/hx-time-picker.ts"],"sourcesContent":["import { css } from 'lit';\n\n// prettier-ignore\nexport const helixTimePickerStyles = css`:host{display:block;position:relative}: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-time-picker-font-family, var(--hx-font-family-sans, sans-serif))}.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-time-picker-label-color, var(--hx-color-neutral-700));line-height:var(--hx-line-height-normal, 1.5)}.field__required-marker{color:var(--hx-time-picker-error-color, var(--hx-color-error-text, #b91c1c));font-weight:var(--hx-font-weight-bold, 700)}.field__combobox{position:relative;display:flex;align-items:center;border:var(--hx-border-width-thin, 1px) solid var(--hx-time-picker-border-color, var(--hx-color-neutral-300));border-radius:var(--hx-time-picker-border-radius, var(--hx-border-radius-md, .375rem));background-color:var(--hx-time-picker-bg, var(--hx-color-neutral-0));transition:border-color var(--hx-transition-fast, .15s ease),box-shadow var(--hx-transition-fast, .15s ease);overflow:visible}.field__combobox:focus-within{border-color:var(--hx-time-picker-focus-ring-color, var(--hx-focus-ring-color));box-shadow:0 0 0 var(--hx-focus-ring-width, 2px) color-mix(in srgb,var(--hx-time-picker-focus-ring-color, var(--hx-focus-ring-color)) calc(var(--hx-focus-ring-opacity, .25) 100%),transparent)}.field--error .field__combobox{border-color:var(--hx-time-picker-error-color, var(--hx-color-error-500))}.field--error .field__combobox:focus-within{border-color:var(--hx-time-picker-error-color, var(--hx-color-error-500));box-shadow:0 0 0 var(--hx-focus-ring-width, 2px) color-mix(in srgb,var(--hx-time-picker-error-color, var(--hx-color-error-500)) calc(var(--hx-focus-ring-opacity, .25) * 100%),transparent)}.field__input{flex:1;border:none;outline:none;background:transparent;padding:var(--hx-space-2, .5rem) var(--hx-space-3, .75rem);font-family:inherit;font-size:var(--hx-font-size-md, 1rem);color:var(--hx-time-picker-color, var(--hx-color-neutral-800));line-height:var(--hx-line-height-normal, 1.5);min-height:var(--hx-size-10, 2.5rem);width:100%;cursor:text}.field__input::placeholder{color:var(--hx-color-neutral-400)}.field__input:disabled{cursor:not-allowed}.field__toggle{display:flex;align-items:center;justify-content:center;border:none;background:transparent;padding:0 var(--hx-space-3, .75rem);color:var(--hx-time-picker-chevron-color, var(--hx-color-neutral-500));cursor:pointer;height:100%;min-height:var(--hx-size-10, 2.5rem);flex-shrink:0;border-inline-start:var(--hx-border-width-thin, 1px) solid var(--hx-time-picker-border-color, var(--hx-color-neutral-300))}.field__toggle:focus-visible{outline:var(--hx-focus-ring-width, 2px) solid var(--hx-time-picker-focus-ring-color, var(--hx-focus-ring-color));outline-offset:-2px;border-radius:0 var(--hx-time-picker-border-radius, var(--hx-border-radius-md, .375rem))}.field__listbox{position:absolute;top:calc(100% + var(--hx-space-1, .25rem));inset-inline-start:0;inset-inline-end:0;z-index:var(--hx-z-index-dropdown, 1000);background-color:var(--hx-time-picker-listbox-bg, var(--hx-color-neutral-0));border:var(--hx-border-width-thin, 1px) solid var(--hx-time-picker-border-color, var(--hx-color-neutral-300));border-radius:var(--hx-time-picker-border-radius, var(--hx-border-radius-md, .375rem));box-shadow:var( --hx-time-picker-listbox-shadow, 0 4px 16px color-mix(in srgb, var(--hx-color-neutral-900) 12%, transparent) );max-height:var(--hx-time-picker-listbox-max-height, 16rem);overflow-y:auto;padding:var(--hx-space-1, .25rem) 0;list-style:none;margin:0}@media(prefers-reduced-motion:no-preference){.field__listbox{animation:hx-listbox-enter var(--hx-transition-fast, .15s ease) forwards}}@keyframes hx-listbox-enter{0%{opacity:0;transform:translateY(-.25rem)}to{opacity:1;transform:translateY(0)}}.field__option{display:flex;align-items:center;padding:var(--hx-space-2, .5rem) var(--hx-space-3, .75rem);font-size:var(--hx-font-size-md, 1rem);font-family:inherit;color:var(--hx-time-picker-option-color, var(--hx-color-neutral-800));cursor:pointer;transition:background-color var(--hx-transition-fast, .15s ease);line-height:var(--hx-line-height-normal, 1.5)}.field__option:hover,.field__option--active{background-color:var(--hx-time-picker-option-hover-bg, var(--hx-color-primary-50));color:var(--hx-time-picker-option-hover-color, var(--hx-color-primary-700))}.field__option--selected{background-color:var(--hx-time-picker-option-selected-bg, var(--hx-color-primary-100));color:var(--hx-time-picker-option-selected-color, var(--hx-color-primary-800));font-weight:var(--hx-font-weight-medium, 500)}.field__option--selected.field__option--active{background-color:var(--hx-time-picker-option-selected-bg, var(--hx-color-primary-100))}@media(prefers-reduced-motion:reduce){.field__combobox,.field__option{transition:none}}.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)}.field__error{color:var(--hx-time-picker-error-color, var(--hx-color-error-text, #b91c1c))}`;\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 { live } from 'lit/directives/live.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixTimePickerStyles } from './hx-time-picker.styles.js';\n\n// ─── Time Slot ───────────────────────────────────────────────────────────────\n\ninterface TimeSlot {\n /** HH:MM in 24-hour format — canonical internal value. /\n value: string;\n /* Display label respecting the component's `format` property. /\n label: string;\n}\n\n// ─── Helpers ─────────────────────────────────────────────────────────────────\n\n/* Parse \"HH:MM\" into { hours, minutes }. Returns null when the string is not valid. /\nfunction parseHHMM(raw: string): { hours: number; minutes: number } \| null {\n const match = /^(\\d{1,2}):(\\d{2})$/.exec(raw.trim());\n if (!match) return null;\n const hours = parseInt(match[1] ?? '0', 10);\n const minutes = parseInt(match[2] ?? '0', 10);\n if (hours < 0 \|\| hours > 23 \|\| minutes < 0 \|\| minutes > 59) return null;\n return { hours, minutes };\n}\n\n/* Format { hours, minutes } as zero-padded \"HH:MM\". /\nfunction toHHMM(hours: number, minutes: number): string {\n return `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}`;\n}\n\n/* Convert a 24-hour HH:MM value to a 12-hour display string (e.g. \"02:30 PM\"). /\nfunction to12h(value: string): string {\n const parsed = parseHHMM(value);\n if (!parsed) return value;\n const { hours, minutes } = parsed;\n const period = hours < 12 ? 'AM' : 'PM';\n const h = hours % 12 === 0 ? 12 : hours % 12;\n return `${String(h).padStart(2, '0')}:${String(minutes).padStart(2, '0')} ${period}`;\n}\n\n/\n Generate ordered time slots between `minTime` and `maxTime` (inclusive) at\n * `stepMinutes` intervals. Both bounds are HH:MM strings; defaults fall back\n * to \"00:00\" / \"23:59\".\n /\nfunction generateSlots(\n minTime: string,\n maxTime: string,\n stepMinutes: number,\n format: '12h' \| '24h',\n): TimeSlot[] {\n const minParsed = parseHHMM(minTime) ?? { hours: 0, minutes: 0 };\n const maxParsed = parseHHMM(maxTime) ?? { hours: 23, minutes: 59 };\n\n const minTotal = minParsed.hours 60 + minParsed.minutes;\n const maxTotal = maxParsed.hours * 60 + maxParsed.minutes;\n\n // Guard against degenerate step values\n const step = Math.max(1, Math.round(stepMinutes));\n\n const slots: TimeSlot[] = [];\n for (let t = minTotal; t <= maxTotal; t += step) {\n const h = Math.floor(t / 60) % 24;\n const m = t % 60;\n const value = toHHMM(h, m);\n slots.push({\n value,\n label: format === '12h' ? to12h(value) : value,\n });\n }\n return slots;\n}\n\n/** Clamp a raw HH:MM value to the [min, max] range; return '' when value is empty. /\nfunction clampValue(value: string, minTime: string, maxTime: string): string {\n if (!value) return '';\n const parsed = parseHHMM(value);\n if (!parsed) return '';\n\n const total = parsed.hours 60 + parsed.minutes;\n const minParsed = parseHHMM(minTime) ?? { hours: 0, minutes: 0 };\n const maxParsed = parseHHMM(maxTime) ?? { hours: 23, minutes: 59 };\n const minTotal = minParsed.hours * 60 + minParsed.minutes;\n const maxTotal = maxParsed.hours * 60 + maxParsed.minutes;\n\n if (total < minTotal) return toHHMM(minParsed.hours, minParsed.minutes);\n if (total > maxTotal) return toHHMM(maxParsed.hours, maxParsed.minutes);\n return toHHMM(parsed.hours, parsed.minutes);\n}\n\n/*\n Attempt to parse a user-typed string (12 h or 24 h) into an HH:MM value.\n * Returns null when the string cannot be resolved.\n /\nfunction parseUserInput(raw: string): string \| null {\n const trimmed = raw.trim().toUpperCase();\n\n // 24-hour \"HH:MM\" or \"H:MM\"\n const hhmm = parseHHMM(trimmed);\n if (hhmm) return toHHMM(hhmm.hours, hhmm.minutes);\n\n // 12-hour patterns: \"2:30 PM\", \"2:30PM\", \"02:30 AM\", \"230 pm\", \"2 PM\"\n const twelve =\n /^(\\d{1,2})(?::(\\d{2}))?\\s(AM\|PM)$/.exec(trimmed) ??\n /^(\\d{1,2})(\\d{2})\\s(AM\|PM)$/.exec(trimmed);\n\n if (twelve) {\n let hours = parseInt(twelve[1] ?? '0', 10);\n const minutes = twelve[2] !== undefined ? parseInt(twelve[2], 10) : 0;\n const period = twelve[3] ?? '';\n if (hours < 1 \|\| hours > 12 \|\| minutes < 0 \|\| minutes > 59) return null;\n if (period === 'AM') {\n hours = hours === 12 ? 0 : hours;\n } else {\n hours = hours === 12 ? 12 : hours + 12;\n }\n return toHHMM(hours, minutes);\n }\n\n return null;\n}\n\n// ─── Component ───────────────────────────────────────────────────────────────\n\n/\n A time-picker component with a combobox pattern: a text input with format\n * masking and a dropdown listbox of pre-generated time slots.\n \n @summary Form-associated time picker with 12h/24h format support and dropdown listbox.\n \n @tag hx-time-picker\n \n @slot label - Custom label content; overrides the rendered label element when used.\n * @slot help-text - Help text displayed below the field.\n * @slot error - Custom error content; overrides the `error` property.\n \n @fires {CustomEvent<{value: string}>} hx-change - Dispatched when the selected time changes. Detail value is HH:MM (24h).\n \n @csspart label - The label element.\n * @csspart input - The text input element.\n * @csspart toggle - The clock icon toggle button.\n * @csspart listbox - The dropdown `<ul>` element.\n * @csspart option - Each `<li>` option in the listbox.\n \n @cssprop [--hx-time-picker-bg=var(--hx-color-neutral-0)] - Input background color.\n * @cssprop [--hx-time-picker-color=var(--hx-color-neutral-800)] - Input text color.\n * @cssprop [--hx-time-picker-border-color=var(--hx-color-neutral-300)] - Border color.\n * @cssprop [--hx-time-picker-border-radius=var(--hx-border-radius-md)] - Border radius.\n * @cssprop [--hx-time-picker-font-family=var(--hx-font-family-sans)] - Font family.\n * @cssprop [--hx-time-picker-focus-ring-color=var(--hx-focus-ring-color)] - Focus ring color.\n * @cssprop [--hx-time-picker-error-color=var(--hx-color-error-500)] - Error state color.\n * @cssprop [--hx-time-picker-label-color=var(--hx-color-neutral-700)] - Label text color.\n * @cssprop [--hx-time-picker-chevron-color=var(--hx-color-neutral-500)] - Toggle chevron color.\n * @cssprop [--hx-time-picker-listbox-bg=var(--hx-color-neutral-0)] - Listbox background.\n * @cssprop [--hx-time-picker-listbox-max-height=16rem] - Maximum height of the dropdown.\n * @cssprop [--hx-time-picker-listbox-shadow=0 4px 16px color-mix(in srgb, var(--hx-color-neutral-900) 12%, transparent)] - Box shadow for the dropdown listbox.\n * @cssprop [--hx-time-picker-option-color=var(--hx-color-neutral-800)] - Option text color.\n * @cssprop [--hx-time-picker-option-hover-bg=var(--hx-color-primary-50)] - Option hover background.\n * @cssprop [--hx-time-picker-option-hover-color=var(--hx-color-primary-700)] - Option hover text color.\n * @cssprop [--hx-time-picker-option-selected-bg=var(--hx-color-primary-100)] - Selected option background.\n * @cssprop [--hx-time-picker-option-selected-color=var(--hx-color-primary-800)] - Selected option text color.\n /\n@customElement('hx-time-picker')\nexport class HelixTimePicker extends LitElement {\n static override styles = [tokenStyles, helixTimePickerStyles];\n\n // ─── Form Association ───\n\n /\n Declares this element as form-associated so it participates in native form submission.\n * @internal\n /\n static formAssociated = true;\n\n /\n ElementInternals instance used for form participation and constraint validation.\n * @internal\n /\n private readonly _internals: ElementInternals;\n\n constructor() {\n super();\n /* @internal /\n this._internals = this.attachInternals();\n }\n\n // ─── Properties ───\n\n /\n The name submitted with the form. Value is always HH:MM (24-hour).\n * @attr name\n /\n @property({ type: String })\n name = '';\n\n /\n The current value in HH:MM (24-hour) format.\n * @attr value\n /\n @property({ type: String, reflect: true })\n value = '';\n\n /\n The earliest selectable time in HH:MM format.\n * @attr min\n /\n @property({ type: String })\n min = '00:00';\n\n /\n The latest selectable time in HH:MM format.\n * @attr max\n /\n @property({ type: String })\n max = '23:59';\n\n /\n Step interval between dropdown options, in minutes. Defaults to 30.\n * @attr step\n /\n @property({ type: Number })\n step = 30;\n\n /\n The visible label text for the field.\n * @attr label\n /\n @property({ type: String })\n label = '';\n\n /\n Whether the field is required for form submission.\n * @attr required\n /\n @property({ type: Boolean, reflect: true })\n required = false;\n\n /\n Whether the field is disabled.\n * @attr disabled\n /\n @property({ type: Boolean, reflect: true })\n disabled = false;\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 Display format for the time input. '12h' shows AM/PM; '24h' is bare HH:MM.\n * @attr format\n /\n @property({ type: String, reflect: true })\n format: '12h' \| '24h' = '12h';\n\n // ─── Internal State ───\n\n /\n Whether the dropdown listbox is currently open.\n * @internal\n /\n @state() private _open = false;\n /\n Index of the currently keyboard-active option in the listbox; -1 when none is active.\n * @internal\n /\n @state() private _activeIndex = -1;\n /\n The display string shown in the text input, formatted according to the current `format` property.\n * @internal\n /\n @state() private _inputDisplayValue = '';\n /\n Whether the label slot has slotted content assigned to it.\n * @internal\n /\n @state() private _hasLabelSlot = false;\n /\n Whether the error slot has slotted content assigned to it.\n * @internal\n /\n @state() private _hasErrorSlot = false;\n /\n Whether the help-text slot has slotted content assigned to it.\n * @internal\n /\n @state() private _hasHelpSlot = false;\n /\n The ID of the slotted label element, used for aria-labelledby cross-root linking.\n * @internal\n /\n @state() private _slottedLabelId = '';\n\n // ─── Stable IDs (monotonically incrementing counter for SSR safety) ───\n\n /\n Monotonically incrementing counter used to generate unique element IDs across instances.\n * @internal\n /\n private static _instanceCount = 0;\n\n /\n Unique ID for this component instance, used as the input element's `id` attribute.\n * @internal\n /\n private readonly _id = `hx-time-picker-${++HelixTimePicker._instanceCount}`;\n /\n Unique ID for the listbox element, referenced by `aria-controls` on the combobox input.\n * @internal\n /\n private readonly _listboxId = `${this._id}-listbox`;\n /\n Unique ID for the error message element, referenced by `aria-describedby` on the input.\n * @internal\n /\n private readonly _errorId = `${this._id}-error`;\n /\n Unique ID for the help text element, referenced by `aria-describedby` on the input.\n * @internal\n /\n private readonly _helpId = `${this._id}-help`;\n\n // ─── Query References ───\n\n /\n Reference to the text input element inside the shadow DOM.\n * @internal\n /\n @query('.field__input')\n private _inputEl: HTMLInputElement \| undefined;\n\n /\n Reference to the listbox `<ul>` element inside the shadow DOM.\n * @internal\n /\n @query('.field__listbox')\n private _listboxEl: HTMLUListElement \| undefined;\n\n // ─── Memoized slot generation (avoids regenerating on every render call) ───\n\n /\n Memoized array of generated time slots; null until first access.\n * @internal\n /\n private _cachedSlots: TimeSlot[] \| null = null;\n /\n Cache key composed of min, max, step, and format; used to detect when slots must be regenerated.\n * @internal\n /\n private _slotsKey = '';\n\n /\n Lazily generates and caches the list of time slots based on current min, max, step, and format.\n * @internal\n /\n private get _slots(): TimeSlot[] {\n const key = `${this.min}\|${this.max}\|${this.step}\|${this.format}`;\n if (this._cachedSlots === null \|\| key !== this._slotsKey) {\n this._slotsKey = key;\n this._cachedSlots = generateSlots(this.min, this.max, this.step, this.format);\n }\n return this._cachedSlots;\n }\n\n // ─── Outside-click handler (bound reference for add/removeEventListener) ───\n\n /\n Closes the listbox when a click is detected outside the component; bound for stable add/removeEventListener calls.\n * @internal\n /\n private readonly _handleOutsideClick = (e: MouseEvent): void => {\n if (!this.isConnected) return;\n if (!this.contains(e.target as Node) && !this.shadowRoot?.contains(e.target as Node)) {\n this._closeListbox();\n }\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 }\n\n override willUpdate(changed: PropertyValues<this>): void {\n // Keep display value in sync whenever the canonical value or format changes\n if (changed.has('value') \|\| changed.has('format')) {\n this._inputDisplayValue = this.value\n ? this.format === '12h'\n ? to12h(this.value)\n : this.value\n : '';\n }\n }\n\n override updated(changed: PropertyValues<this>): void {\n super.updated(changed);\n if (changed.has('value')) {\n this._internals.setFormValue(this.value \|\| null);\n this._updateValidity();\n }\n // When the listbox opens, scroll the selected (or active) option into view\n if ((changed as Map<PropertyKey, unknown>).has('_open') && this._open) {\n this._scrollActiveOptionIntoView();\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 field 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 _updateValidity(): void {\n if (this.required && !this.value) {\n this._internals.setValidity(\n { valueMissing: true },\n this.error \|\| 'Please select a time.',\n this._inputEl ?? undefined,\n );\n } else {\n this._internals.setValidity({});\n }\n }\n\n /* @internal /\n formResetCallback(): void {\n this.value = '';\n this._inputDisplayValue = '';\n this._internals.setFormValue(null);\n this._closeListbox();\n }\n\n /* @internal /\n formStateRestoreCallback(\n state: string \| File \| FormData,\n _mode: 'restore' \| 'autocomplete' = 'restore',\n ): void {\n // Only string states are valid for this component; ignore File/FormData\n if (typeof state !== 'string') return;\n // Validate and clamp before assigning; ignore out-of-spec values\n const clamped = clampValue(state, this.min, this.max);\n this.value = clamped;\n }\n\n /* @internal /\n formDisabledCallback(disabled: boolean): void {\n this.disabled = disabled;\n }\n\n // ─── Listbox helpers ───\n\n /* @internal /\n private _openListbox(): void {\n if (this._open) return;\n // Pre-set active index to currently selected slot (or 0)\n const selectedIndex = this._slots.findIndex((s) => s.value === this.value);\n this._activeIndex = selectedIndex >= 0 ? selectedIndex : 0;\n this._open = true;\n }\n\n /* @internal /\n private _closeListbox(): void {\n if (!this._open) return;\n this._open = false;\n this._activeIndex = -1;\n }\n\n /* @internal /\n private _scrollActiveOptionIntoView(): void {\n if (!this._listboxEl) return;\n const active = this._listboxEl.querySelector<HTMLElement>('.field__option--active');\n active?.scrollIntoView({ block: 'nearest' });\n }\n\n /* @internal /\n private _selectSlot(slot: TimeSlot): void {\n const clamped = clampValue(slot.value, this.min, this.max);\n this.value = clamped;\n this._closeListbox();\n this._dispatchChange(clamped);\n }\n\n // ─── Slot tracking ───\n\n /* @internal /\n private _handleLabelSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n const nodes = slot.assignedNodes({ flatten: true });\n this._hasLabelSlot = nodes.length > 0;\n if (this._hasLabelSlot) {\n // Forward aria-labelledby: ensure the slotted label element has an ID so\n // the shadow-DOM input can reference it via aria-labelledby (A-03).\n const labelEl = nodes.find((n) => n.nodeType === Node.ELEMENT_NODE) as\n \| HTMLElement\n \| undefined;\n if (labelEl) {\n if (!labelEl.id) {\n labelEl.id = `${this._id}-slotted-label`;\n }\n this._slottedLabelId = labelEl.id;\n }\n } else {\n this._slottedLabelId = '';\n }\n }\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 /* @internal /\n private _handleHelpSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasHelpSlot = slot.assignedNodes({ flatten: true }).length > 0;\n }\n\n // ─── Event Dispatch ───\n\n /* @internal /\n private _dispatchChange(value: string): void {\n this.dispatchEvent(\n new CustomEvent<{ value: string }>('hx-change', {\n bubbles: true,\n composed: true,\n detail: { value },\n }),\n );\n }\n\n // ─── Input Handlers ───\n\n /* @internal /\n private _handleInputClick(): void {\n if (!this.disabled) this._openListbox();\n }\n\n /* @internal /\n private _handleToggleClick(e: MouseEvent): void {\n e.stopPropagation();\n if (this.disabled) return;\n if (this._open) {\n this._closeListbox();\n } else {\n this._openListbox();\n this._inputEl?.focus();\n }\n }\n\n /* @internal /\n private _handleInputInput(e: Event): void {\n const target = e.target as HTMLInputElement;\n this._inputDisplayValue = target.value;\n // Open the listbox as the user types\n if (!this._open) this._openListbox();\n }\n\n /* @internal /\n private _handleInputChange(e: Event): void {\n const target = e.target as HTMLInputElement;\n const raw = target.value.trim();\n\n if (!raw) {\n // User cleared the field\n this.value = '';\n this._internals.setFormValue(null);\n this._updateValidity();\n this._dispatchChange('');\n return;\n }\n\n const parsed = parseUserInput(raw);\n if (parsed) {\n const clamped = clampValue(parsed, this.min, this.max);\n this.value = clamped;\n this._dispatchChange(clamped);\n } else {\n // Revert display to last known good value\n this._inputDisplayValue = this.value\n ? this.format === '12h'\n ? to12h(this.value)\n : this.value\n : '';\n }\n }\n\n /* @internal /\n private _handleInputKeyDown(e: KeyboardEvent): void {\n switch (e.key) {\n case 'ArrowDown':\n e.preventDefault();\n if (!this._open) {\n this._openListbox();\n } else {\n this._activeIndex = Math.min(this._activeIndex + 1, this._slots.length - 1);\n this._scrollActiveOptionIntoView();\n }\n break;\n\n case 'ArrowUp':\n e.preventDefault();\n if (this._open) {\n this._activeIndex = Math.max(this._activeIndex - 1, 0);\n this._scrollActiveOptionIntoView();\n }\n break;\n\n case 'Enter':\n if (this._open && this._activeIndex >= 0) {\n e.preventDefault();\n const slot = this._slots[this._activeIndex];\n if (slot) this._selectSlot(slot);\n }\n break;\n\n case 'Escape':\n e.preventDefault();\n this._closeListbox();\n break;\n\n case 'Home':\n if (this._open) {\n e.preventDefault();\n this._activeIndex = 0;\n this._scrollActiveOptionIntoView();\n }\n break;\n\n case 'End':\n if (this._open) {\n e.preventDefault();\n this._activeIndex = this._slots.length - 1;\n this._scrollActiveOptionIntoView();\n }\n break;\n\n case 'Tab':\n this._closeListbox();\n break;\n }\n }\n\n /* @internal /\n private _handleOptionPointerDown(e: MouseEvent): void {\n // Prevent the input from losing focus when clicking an option\n e.preventDefault();\n }\n\n /* @internal /\n private _handleOptionClick(slot: TimeSlot): void {\n this._selectSlot(slot);\n this._inputEl?.focus();\n }\n\n /* @internal /\n private _handleOptionMouseEnter(index: number): void {\n this._activeIndex = index;\n }\n\n // ─── Public API ───\n\n /* Moves focus to the time input element. /\n override focus(options?: FocusOptions): void {\n this._inputEl?.focus(options);\n }\n\n // ─── Render ───\n\n override render() {\n const hasError = !!this.error \|\| this._hasErrorSlot;\n const slots = this._slots;\n\n const fieldClasses = {\n field: true,\n 'field--error': hasError,\n 'field--disabled': this.disabled,\n 'field--required': this.required,\n };\n\n const activeDescendant =\n this._open && this._activeIndex >= 0\n ? `${this._listboxId}-option-${this._activeIndex}`\n : undefined;\n\n const placeholder = this.format === '12h' ? 'hh:mm AM' : 'hh:mm';\n\n // WCAG 1.3.1: the help-text div with _helpId always renders in the DOM unconditionally.\n // Always include _helpId in describedBy — an empty target is harmless for AT and ensures\n // the link is established immediately without waiting for the slotchange event to fire.\n const describedBy =\n [hasError ? this._errorId : null, this._helpId].filter(Boolean).join(' ') \|\| undefined;\n\n return html`\n <div part=\"field\" class=${classMap(fieldClasses)}>\n <!-- Label -->\n <slot name=\"label\" @slotchange=${this._handleLabelSlotChange}>\n ${this.label\n ? html`\n <label part=\"label\" class=\"field__label\" for=${this._id}>\n ${this.label}\n ${this.required\n ? html`<span class=\"field__required-marker\" aria-hidden=\"true\"></span>`\n : nothing}\n </label>\n `\n : nothing}\n </slot>\n\n <!-- Combobox wrapper; role=\"combobox\" lives on the input per ARIA 1.2 -->\n <div class=\"field__combobox\">\n <input\n part=\"input\"\n class=\"field__input\"\n id=${this._id}\n type=\"text\"\n inputmode=\"text\"\n autocomplete=\"off\"\n spellcheck=\"false\"\n role=\"combobox\"\n aria-expanded=${this._open ? 'true' : 'false'}\n aria-haspopup=\"listbox\"\n .value=${live(this._inputDisplayValue)}\n placeholder=${placeholder}\n ?required=${this.required}\n ?disabled=${this.disabled}\n name=${ifDefined(this.name \|\| undefined)}\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-labelledby=${ifDefined(\n this._hasLabelSlot && this._slottedLabelId ? this._slottedLabelId : undefined,\n )}\n @click=${this._handleInputClick}\n @input=${this._handleInputInput}\n @change=${this._handleInputChange}\n @keydown=${this._handleInputKeyDown}\n />\n\n <!-- Toggle button -->\n <button\n part=\"toggle\"\n type=\"button\"\n class=\"field__toggle\"\n tabindex=\"-1\"\n aria-label=${this._open ? 'Close time picker' : 'Open time picker'}\n ?disabled=${this.disabled}\n @click=${this._handleToggleClick}\n >\n <!-- Clock icon -->\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <circle cx=\"8\" cy=\"8\" r=\"6.5\" stroke=\"currentColor\" stroke-width=\"1.25\" />\n <path\n d=\"M8 4.5V8L10.5 10\"\n stroke=\"currentColor\"\n stroke-width=\"1.25\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n\n <!-- Dropdown listbox: always in DOM so aria-controls is never a dangling reference (WCAG 4.1.2). Hidden via the boolean hidden attribute when closed. -->\n <ul\n part=\"listbox\"\n class=\"field__listbox\"\n id=${this._listboxId}\n role=\"listbox\"\n aria-label=${this.label \|\| 'Time options'}\n ?hidden=${!this._open}\n >\n ${this._open\n ? repeat(\n slots,\n (slot) => slot.value,\n (slot, index) => {\n const isSelected = slot.value === this.value;\n const isActive = index === this._activeIndex;\n return html`\n <li\n part=\"option\"\n class=${classMap({\n field__option: true,\n 'field__option--selected': isSelected,\n 'field__option--active': isActive,\n })}\n id=\"${this._listboxId}-option-${index}\"\n role=\"option\"\n aria-selected=${isSelected ? 'true' : 'false'}\n @pointerdown=${this._handleOptionPointerDown}\n @click=${() => this._handleOptionClick(slot)}\n @mouseenter=${() => this._handleOptionMouseEnter(index)}\n >\n ${slot.label}\n </li>\n `;\n },\n )\n : nothing}\n </ul>\n </div>\n\n <!-- Error slot / property -->\n <slot name=\"error\" @slotchange=${this._handleErrorSlotChange}>\n ${this.error\n ? html`\n <div part=\"error\" class=\"field__error\" id=${this._errorId} role=\"alert\">\n ${this.error}\n </div>\n `\n : nothing}\n </slot>\n\n <!-- Help slot -->\n <div part=\"help-text\" class=\"field__help-text\" id=${this._helpId}>\n <slot name=\"help-text\" @slotchange=${this._handleHelpSlotChange}></slot>\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-time-picker': HelixTimePicker;\n }\n}\n"],"names":["helixTimePickerStyles","css","parseHHMM","raw","match","hours","minutes","toHHMM","to12h","value","parsed","period","h","generateSlots","minTime","maxTime","stepMinutes","format","minParsed","maxParsed","minTotal","maxTotal","step","slots","t","m","clampValue","total","parseUserInput","trimmed","hhmm","twelve","HelixTimePicker","LitElement","_a","key","changed","state","_mode","clamped","disabled","selectedIndex","s","active","slot","nodes","labelEl","n","target","index","options","hasError","fieldClasses","activeDescendant","placeholder","describedBy","html","classMap","nothing","live","ifDefined","repeat","isSelected","isActive","tokenStyles","__decorateClass","property","query","customElement"],"mappings":"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"}
1	+ {"version":3,"file":"hx-time-picker-BpCRsh_z.js","sources":["../../src/components/hx-time-picker/hx-time-picker.styles.ts","../../src/components/hx-time-picker/hx-time-picker.ts"],"sourcesContent":["import { css } from 'lit';\n\n// prettier-ignore\nexport const helixTimePickerStyles = css`:host{display:block;position:relative}: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-time-picker-font-family, var(--hx-font-family-sans, sans-serif))}.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-time-picker-label-color, var(--hx-color-neutral-700));line-height:var(--hx-line-height-normal, 1.5)}.field__required-marker{color:var(--hx-time-picker-error-color, var(--hx-color-error-text, #b91c1c));font-weight:var(--hx-font-weight-bold, 700)}.field__combobox{position:relative;display:flex;align-items:center;border:var(--hx-border-width-thin, 1px) solid var(--hx-time-picker-border-color, var(--hx-color-neutral-300));border-radius:var(--hx-time-picker-border-radius, var(--hx-border-radius-md, .375rem));background-color:var(--hx-time-picker-bg, var(--hx-color-neutral-0));transition:border-color var(--hx-transition-fast, .15s ease),box-shadow var(--hx-transition-fast, .15s ease);overflow:visible}.field__combobox:focus-within{border-color:var(--hx-time-picker-focus-ring-color, var(--hx-focus-ring-color));box-shadow:0 0 0 var(--hx-focus-ring-width, 2px) color-mix(in srgb,var(--hx-time-picker-focus-ring-color, var(--hx-focus-ring-color)) calc(var(--hx-focus-ring-opacity, .25) 100%),transparent)}.field--error .field__combobox{border-color:var(--hx-time-picker-error-color, var(--hx-color-error-500))}.field--error .field__combobox:focus-within{border-color:var(--hx-time-picker-error-color, var(--hx-color-error-500));box-shadow:0 0 0 var(--hx-focus-ring-width, 2px) color-mix(in srgb,var(--hx-time-picker-error-color, var(--hx-color-error-500)) calc(var(--hx-focus-ring-opacity, .25) * 100%),transparent)}.field__input{flex:1;border:none;outline:none;background:transparent;padding:var(--hx-space-2, .5rem) var(--hx-space-3, .75rem);font-family:inherit;font-size:var(--hx-font-size-md, 1rem);color:var(--hx-time-picker-color, var(--hx-color-neutral-800));line-height:var(--hx-line-height-normal, 1.5);min-height:var(--hx-size-10, 2.5rem);width:100%;cursor:text}.field__input::placeholder{color:var(--hx-color-neutral-400)}.field__input:disabled{cursor:not-allowed}.field__toggle{display:flex;align-items:center;justify-content:center;border:none;background:transparent;padding:0 var(--hx-space-3, .75rem);color:var(--hx-time-picker-chevron-color, var(--hx-color-neutral-500));cursor:pointer;height:100%;min-height:var(--hx-size-10, 2.5rem);flex-shrink:0;border-inline-start:var(--hx-border-width-thin, 1px) solid var(--hx-time-picker-border-color, var(--hx-color-neutral-300))}.field__toggle:focus-visible{outline:var(--hx-focus-ring-width, 2px) solid var(--hx-time-picker-focus-ring-color, var(--hx-focus-ring-color));outline-offset:-2px;border-radius:0 var(--hx-time-picker-border-radius, var(--hx-border-radius-md, .375rem))}.field__listbox{position:absolute;top:calc(100% + var(--hx-space-1, .25rem));inset-inline-start:0;inset-inline-end:0;z-index:var(--hx-z-index-dropdown, 1000);background-color:var(--hx-time-picker-listbox-bg, var(--hx-color-neutral-0));border:var(--hx-border-width-thin, 1px) solid var(--hx-time-picker-border-color, var(--hx-color-neutral-300));border-radius:var(--hx-time-picker-border-radius, var(--hx-border-radius-md, .375rem));box-shadow:var( --hx-time-picker-listbox-shadow, 0 4px 16px color-mix(in srgb, var(--hx-color-neutral-900) 12%, transparent) );max-height:var(--hx-time-picker-listbox-max-height, 16rem);overflow-y:auto;padding:var(--hx-space-1, .25rem) 0;list-style:none;margin:0}@media(prefers-reduced-motion:no-preference){.field__listbox{animation:hx-listbox-enter var(--hx-transition-fast, .15s ease) forwards}}@keyframes hx-listbox-enter{0%{opacity:0;transform:translateY(-.25rem)}to{opacity:1;transform:translateY(0)}}.field__option{display:flex;align-items:center;padding:var(--hx-space-2, .5rem) var(--hx-space-3, .75rem);font-size:var(--hx-font-size-md, 1rem);font-family:inherit;color:var(--hx-time-picker-option-color, var(--hx-color-neutral-800));cursor:pointer;transition:background-color var(--hx-transition-fast, .15s ease);line-height:var(--hx-line-height-normal, 1.5)}.field__option:hover,.field__option--active{background-color:var(--hx-time-picker-option-hover-bg, var(--hx-color-primary-50));color:var(--hx-time-picker-option-hover-color, var(--hx-color-primary-700))}.field__option--selected{background-color:var(--hx-time-picker-option-selected-bg, var(--hx-color-primary-100));color:var(--hx-time-picker-option-selected-color, var(--hx-color-primary-800));font-weight:var(--hx-font-weight-medium, 500)}.field__option--selected.field__option--active{background-color:var(--hx-time-picker-option-selected-bg, var(--hx-color-primary-100))}@media(prefers-reduced-motion:reduce){.field__combobox,.field__option{transition:none}}.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)}.field__error{color:var(--hx-time-picker-error-color, var(--hx-color-error-text, #b91c1c))}`;\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 { live } from 'lit/directives/live.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixTimePickerStyles } from './hx-time-picker.styles.js';\n\n// ─── Time Slot ───────────────────────────────────────────────────────────────\n\ninterface TimeSlot {\n /** HH:MM in 24-hour format — canonical internal value. /\n value: string;\n /* Display label respecting the component's `format` property. /\n label: string;\n}\n\n// ─── Helpers ─────────────────────────────────────────────────────────────────\n\n/* Parse \"HH:MM\" into { hours, minutes }. Returns null when the string is not valid. /\nfunction parseHHMM(raw: string): { hours: number; minutes: number } \| null {\n const match = /^(\\d{1,2}):(\\d{2})$/.exec(raw.trim());\n if (!match) return null;\n const hours = parseInt(match[1] ?? '0', 10);\n const minutes = parseInt(match[2] ?? '0', 10);\n if (hours < 0 \|\| hours > 23 \|\| minutes < 0 \|\| minutes > 59) return null;\n return { hours, minutes };\n}\n\n/* Format { hours, minutes } as zero-padded \"HH:MM\". /\nfunction toHHMM(hours: number, minutes: number): string {\n return `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}`;\n}\n\n/* Convert a 24-hour HH:MM value to a 12-hour display string (e.g. \"02:30 PM\"). /\nfunction to12h(value: string): string {\n const parsed = parseHHMM(value);\n if (!parsed) return value;\n const { hours, minutes } = parsed;\n const period = hours < 12 ? 'AM' : 'PM';\n const h = hours % 12 === 0 ? 12 : hours % 12;\n return `${String(h).padStart(2, '0')}:${String(minutes).padStart(2, '0')} ${period}`;\n}\n\n/\n Generate ordered time slots between `minTime` and `maxTime` (inclusive) at\n * `stepMinutes` intervals. Both bounds are HH:MM strings; defaults fall back\n * to \"00:00\" / \"23:59\".\n /\nfunction generateSlots(\n minTime: string,\n maxTime: string,\n stepMinutes: number,\n format: '12h' \| '24h',\n): TimeSlot[] {\n const minParsed = parseHHMM(minTime) ?? { hours: 0, minutes: 0 };\n const maxParsed = parseHHMM(maxTime) ?? { hours: 23, minutes: 59 };\n\n const minTotal = minParsed.hours 60 + minParsed.minutes;\n const maxTotal = maxParsed.hours * 60 + maxParsed.minutes;\n\n // Guard against degenerate step values\n const step = Math.max(1, Math.round(stepMinutes));\n\n const slots: TimeSlot[] = [];\n for (let t = minTotal; t <= maxTotal; t += step) {\n const h = Math.floor(t / 60) % 24;\n const m = t % 60;\n const value = toHHMM(h, m);\n slots.push({\n value,\n label: format === '12h' ? to12h(value) : value,\n });\n }\n return slots;\n}\n\n/** Clamp a raw HH:MM value to the [min, max] range; return '' when value is empty. /\nfunction clampValue(value: string, minTime: string, maxTime: string): string {\n if (!value) return '';\n const parsed = parseHHMM(value);\n if (!parsed) return '';\n\n const total = parsed.hours 60 + parsed.minutes;\n const minParsed = parseHHMM(minTime) ?? { hours: 0, minutes: 0 };\n const maxParsed = parseHHMM(maxTime) ?? { hours: 23, minutes: 59 };\n const minTotal = minParsed.hours * 60 + minParsed.minutes;\n const maxTotal = maxParsed.hours * 60 + maxParsed.minutes;\n\n if (total < minTotal) return toHHMM(minParsed.hours, minParsed.minutes);\n if (total > maxTotal) return toHHMM(maxParsed.hours, maxParsed.minutes);\n return toHHMM(parsed.hours, parsed.minutes);\n}\n\n/*\n Attempt to parse a user-typed string (12 h or 24 h) into an HH:MM value.\n * Returns null when the string cannot be resolved.\n /\nfunction parseUserInput(raw: string): string \| null {\n const trimmed = raw.trim().toUpperCase();\n\n // 24-hour \"HH:MM\" or \"H:MM\"\n const hhmm = parseHHMM(trimmed);\n if (hhmm) return toHHMM(hhmm.hours, hhmm.minutes);\n\n // 12-hour patterns: \"2:30 PM\", \"2:30PM\", \"02:30 AM\", \"230 pm\", \"2 PM\"\n const twelve =\n /^(\\d{1,2})(?::(\\d{2}))?\\s(AM\|PM)$/.exec(trimmed) ??\n /^(\\d{1,2})(\\d{2})\\s(AM\|PM)$/.exec(trimmed);\n\n if (twelve) {\n let hours = parseInt(twelve[1] ?? '0', 10);\n const minutes = twelve[2] !== undefined ? parseInt(twelve[2], 10) : 0;\n const period = twelve[3] ?? '';\n if (hours < 1 \|\| hours > 12 \|\| minutes < 0 \|\| minutes > 59) return null;\n if (period === 'AM') {\n hours = hours === 12 ? 0 : hours;\n } else {\n hours = hours === 12 ? 12 : hours + 12;\n }\n return toHHMM(hours, minutes);\n }\n\n return null;\n}\n\n// ─── Component ───────────────────────────────────────────────────────────────\n\n/\n A time-picker component with a combobox pattern: a text input with format\n * masking and a dropdown listbox of pre-generated time slots.\n \n @summary Form-associated time picker with 12h/24h format support and dropdown listbox.\n \n @tag hx-time-picker\n \n @slot label - Custom label content; overrides the rendered label element when used.\n * @slot help-text - Help text displayed below the field.\n * @slot error - Custom error content; overrides the `error` property.\n \n @fires {CustomEvent<{value: string}>} hx-change - Dispatched when the selected time changes. Detail value is HH:MM (24h).\n \n @csspart label - The label element.\n * @csspart input - The text input element.\n * @csspart toggle - The clock icon toggle button.\n * @csspart listbox - The dropdown `<ul>` element.\n * @csspart option - Each `<li>` option in the listbox.\n * @csspart field - The outer field wrapper element.\n * @csspart error - The error message element.\n * @csspart help-text - The help text element.\n \n @cssprop [--hx-time-picker-bg=var(--hx-color-neutral-0)] - Input background color.\n * @cssprop [--hx-time-picker-color=var(--hx-color-neutral-800)] - Input text color.\n * @cssprop [--hx-time-picker-border-color=var(--hx-color-neutral-300)] - Border color.\n * @cssprop [--hx-time-picker-border-radius=var(--hx-border-radius-md)] - Border radius.\n * @cssprop [--hx-time-picker-font-family=var(--hx-font-family-sans)] - Font family.\n * @cssprop [--hx-time-picker-focus-ring-color=var(--hx-focus-ring-color)] - Focus ring color.\n * @cssprop [--hx-time-picker-error-color=var(--hx-color-error-500)] - Error state color.\n * @cssprop [--hx-time-picker-label-color=var(--hx-color-neutral-700)] - Label text color.\n * @cssprop [--hx-time-picker-chevron-color=var(--hx-color-neutral-500)] - Toggle chevron color.\n * @cssprop [--hx-time-picker-listbox-bg=var(--hx-color-neutral-0)] - Listbox background.\n * @cssprop [--hx-time-picker-listbox-max-height=16rem] - Maximum height of the dropdown.\n * @cssprop [--hx-time-picker-listbox-shadow=0 4px 16px color-mix(in srgb, var(--hx-color-neutral-900) 12%, transparent)] - Box shadow for the dropdown listbox.\n * @cssprop [--hx-time-picker-option-color=var(--hx-color-neutral-800)] - Option text color.\n * @cssprop [--hx-time-picker-option-hover-bg=var(--hx-color-primary-50)] - Option hover background.\n * @cssprop [--hx-time-picker-option-hover-color=var(--hx-color-primary-700)] - Option hover text color.\n * @cssprop [--hx-time-picker-option-selected-bg=var(--hx-color-primary-100)] - Selected option background.\n * @cssprop [--hx-time-picker-option-selected-color=var(--hx-color-primary-800)] - Selected option text color.\n /\n@customElement('hx-time-picker')\nexport class HelixTimePicker extends LitElement {\n static override styles = [tokenStyles, helixTimePickerStyles];\n\n // ─── Form Association ───\n\n /\n Declares this element as form-associated so it participates in native form submission.\n * @internal\n /\n static formAssociated = true;\n\n /\n ElementInternals instance used for form participation and constraint validation.\n * @internal\n /\n private readonly _internals: ElementInternals;\n\n constructor() {\n super();\n /* @internal /\n this._internals = this.attachInternals();\n }\n\n // ─── Properties ───\n\n /\n The name submitted with the form. Value is always HH:MM (24-hour).\n * @attr name\n /\n @property({ type: String })\n name = '';\n\n /\n The current value in HH:MM (24-hour) format.\n * @attr value\n /\n @property({ type: String, reflect: true })\n value = '';\n\n /\n The earliest selectable time in HH:MM format.\n * @attr min\n /\n @property({ type: String })\n min = '00:00';\n\n /\n The latest selectable time in HH:MM format.\n * @attr max\n /\n @property({ type: String })\n max = '23:59';\n\n /\n Step interval between dropdown options, in minutes. Defaults to 30.\n * @attr step\n /\n @property({ type: Number })\n step = 30;\n\n /\n The visible label text for the field.\n * @attr label\n /\n @property({ type: String })\n label = '';\n\n /\n Whether the field is required for form submission.\n * @attr required\n /\n @property({ type: Boolean, reflect: true })\n required = false;\n\n /\n Whether the field is disabled.\n * @attr disabled\n /\n @property({ type: Boolean, reflect: true })\n disabled = false;\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 Display format for the time input. '12h' shows AM/PM; '24h' is bare HH:MM.\n * @attr format\n /\n @property({ type: String, reflect: true })\n format: '12h' \| '24h' = '12h';\n\n // ─── Internal State ───\n\n /\n Whether the dropdown listbox is currently open.\n * @internal\n /\n @state() private _open = false;\n /\n Index of the currently keyboard-active option in the listbox; -1 when none is active.\n * @internal\n /\n @state() private _activeIndex = -1;\n /\n The display string shown in the text input, formatted according to the current `format` property.\n * @internal\n /\n @state() private _inputDisplayValue = '';\n /\n Whether the label slot has slotted content assigned to it.\n * @internal\n /\n @state() private _hasLabelSlot = false;\n /\n Whether the error slot has slotted content assigned to it.\n * @internal\n /\n @state() private _hasErrorSlot = false;\n /\n Whether the help-text slot has slotted content assigned to it.\n * @internal\n /\n @state() private _hasHelpSlot = false;\n /\n The ID of the slotted label element, used for aria-labelledby cross-root linking.\n * @internal\n /\n @state() private _slottedLabelId = '';\n\n // ─── Stable IDs (monotonically incrementing counter for SSR safety) ───\n\n /\n Monotonically incrementing counter used to generate unique element IDs across instances.\n * @internal\n /\n private static _instanceCount = 0;\n\n /\n Unique ID for this component instance, used as the input element's `id` attribute.\n * @internal\n /\n private readonly _id = `hx-time-picker-${++HelixTimePicker._instanceCount}`;\n /\n Unique ID for the listbox element, referenced by `aria-controls` on the combobox input.\n * @internal\n /\n private readonly _listboxId = `${this._id}-listbox`;\n /\n Unique ID for the error message element, referenced by `aria-describedby` on the input.\n * @internal\n /\n private readonly _errorId = `${this._id}-error`;\n /\n Unique ID for the help text element, referenced by `aria-describedby` on the input.\n * @internal\n /\n private readonly _helpId = `${this._id}-help`;\n\n // ─── Query References ───\n\n /\n Reference to the text input element inside the shadow DOM.\n * @internal\n /\n @query('.field__input')\n private _inputEl: HTMLInputElement \| undefined;\n\n /\n Reference to the listbox `<ul>` element inside the shadow DOM.\n * @internal\n /\n @query('.field__listbox')\n private _listboxEl: HTMLUListElement \| undefined;\n\n // ─── Memoized slot generation (avoids regenerating on every render call) ───\n\n /\n Memoized array of generated time slots; null until first access.\n * @internal\n /\n private _cachedSlots: TimeSlot[] \| null = null;\n /\n Cache key composed of min, max, step, and format; used to detect when slots must be regenerated.\n * @internal\n /\n private _slotsKey = '';\n\n /\n Lazily generates and caches the list of time slots based on current min, max, step, and format.\n * @internal\n /\n private get _slots(): TimeSlot[] {\n const key = `${this.min}\|${this.max}\|${this.step}\|${this.format}`;\n if (this._cachedSlots === null \|\| key !== this._slotsKey) {\n this._slotsKey = key;\n this._cachedSlots = generateSlots(this.min, this.max, this.step, this.format);\n }\n return this._cachedSlots;\n }\n\n // ─── Outside-click handler (bound reference for add/removeEventListener) ───\n\n /\n Closes the listbox when a click is detected outside the component; bound for stable add/removeEventListener calls.\n * @internal\n /\n private readonly _handleOutsideClick = (e: MouseEvent): void => {\n if (!this.isConnected) return;\n if (!this.contains(e.target as Node) && !this.shadowRoot?.contains(e.target as Node)) {\n this._closeListbox();\n }\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 }\n\n override willUpdate(changed: PropertyValues<this>): void {\n // Keep display value in sync whenever the canonical value or format changes\n if (changed.has('value') \|\| changed.has('format')) {\n this._inputDisplayValue = this.value\n ? this.format === '12h'\n ? to12h(this.value)\n : this.value\n : '';\n }\n }\n\n override updated(changed: PropertyValues<this>): void {\n super.updated(changed);\n if (changed.has('value')) {\n this._internals.setFormValue(this.value \|\| null);\n this._updateValidity();\n }\n // When the listbox opens, scroll the selected (or active) option into view\n if ((changed as Map<PropertyKey, unknown>).has('_open') && this._open) {\n this._scrollActiveOptionIntoView();\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 field 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 _updateValidity(): void {\n if (this.required && !this.value) {\n this._internals.setValidity(\n { valueMissing: true },\n this.error \|\| 'Please select a time.',\n this._inputEl ?? undefined,\n );\n } else {\n this._internals.setValidity({});\n }\n }\n\n /* @internal /\n formResetCallback(): void {\n this.value = '';\n this._inputDisplayValue = '';\n this._internals.setFormValue(null);\n this._closeListbox();\n }\n\n /* @internal /\n formStateRestoreCallback(\n state: string \| File \| FormData,\n _mode: 'restore' \| 'autocomplete' = 'restore',\n ): void {\n // Only string states are valid for this component; ignore File/FormData\n if (typeof state !== 'string') return;\n // Validate and clamp before assigning; ignore out-of-spec values\n const clamped = clampValue(state, this.min, this.max);\n this.value = clamped;\n }\n\n /* @internal /\n formDisabledCallback(disabled: boolean): void {\n this.disabled = disabled;\n }\n\n // ─── Listbox helpers ───\n\n /* @internal /\n private _openListbox(): void {\n if (this._open) return;\n // Pre-set active index to currently selected slot (or 0)\n const selectedIndex = this._slots.findIndex((s) => s.value === this.value);\n this._activeIndex = selectedIndex >= 0 ? selectedIndex : 0;\n this._open = true;\n }\n\n /* @internal /\n private _closeListbox(): void {\n if (!this._open) return;\n this._open = false;\n this._activeIndex = -1;\n }\n\n /* @internal /\n private _scrollActiveOptionIntoView(): void {\n if (!this._listboxEl) return;\n const active = this._listboxEl.querySelector<HTMLElement>('.field__option--active');\n active?.scrollIntoView({ block: 'nearest' });\n }\n\n /* @internal /\n private _selectSlot(slot: TimeSlot): void {\n const clamped = clampValue(slot.value, this.min, this.max);\n this.value = clamped;\n this._closeListbox();\n this._dispatchChange(clamped);\n }\n\n // ─── Slot tracking ───\n\n /* @internal /\n private _handleLabelSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n const nodes = slot.assignedNodes({ flatten: true });\n this._hasLabelSlot = nodes.length > 0;\n if (this._hasLabelSlot) {\n // Forward aria-labelledby: ensure the slotted label element has an ID so\n // the shadow-DOM input can reference it via aria-labelledby (A-03).\n const labelEl = nodes.find((n) => n.nodeType === Node.ELEMENT_NODE) as\n \| HTMLElement\n \| undefined;\n if (labelEl) {\n if (!labelEl.id) {\n labelEl.id = `${this._id}-slotted-label`;\n }\n this._slottedLabelId = labelEl.id;\n }\n } else {\n this._slottedLabelId = '';\n }\n }\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 /* @internal /\n private _handleHelpSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasHelpSlot = slot.assignedNodes({ flatten: true }).length > 0;\n }\n\n // ─── Event Dispatch ───\n\n /* @internal /\n private _dispatchChange(value: string): void {\n this.dispatchEvent(\n new CustomEvent<{ value: string }>('hx-change', {\n bubbles: true,\n composed: true,\n detail: { value },\n }),\n );\n }\n\n // ─── Input Handlers ───\n\n /* @internal /\n private _handleInputClick(): void {\n if (!this.disabled) this._openListbox();\n }\n\n /* @internal /\n private _handleToggleClick(e: MouseEvent): void {\n e.stopPropagation();\n if (this.disabled) return;\n if (this._open) {\n this._closeListbox();\n } else {\n this._openListbox();\n this._inputEl?.focus();\n }\n }\n\n /* @internal /\n private _handleInputInput(e: Event): void {\n const target = e.target as HTMLInputElement;\n this._inputDisplayValue = target.value;\n // Open the listbox as the user types\n if (!this._open) this._openListbox();\n }\n\n /* @internal /\n private _handleInputChange(e: Event): void {\n const target = e.target as HTMLInputElement;\n const raw = target.value.trim();\n\n if (!raw) {\n // User cleared the field\n this.value = '';\n this._internals.setFormValue(null);\n this._updateValidity();\n this._dispatchChange('');\n return;\n }\n\n const parsed = parseUserInput(raw);\n if (parsed) {\n const clamped = clampValue(parsed, this.min, this.max);\n this.value = clamped;\n this._dispatchChange(clamped);\n } else {\n // Revert display to last known good value\n this._inputDisplayValue = this.value\n ? this.format === '12h'\n ? to12h(this.value)\n : this.value\n : '';\n }\n }\n\n /* @internal /\n private _handleInputKeyDown(e: KeyboardEvent): void {\n switch (e.key) {\n case 'ArrowDown':\n e.preventDefault();\n if (!this._open) {\n this._openListbox();\n } else {\n this._activeIndex = Math.min(this._activeIndex + 1, this._slots.length - 1);\n this._scrollActiveOptionIntoView();\n }\n break;\n\n case 'ArrowUp':\n e.preventDefault();\n if (this._open) {\n this._activeIndex = Math.max(this._activeIndex - 1, 0);\n this._scrollActiveOptionIntoView();\n }\n break;\n\n case 'Enter':\n if (this._open && this._activeIndex >= 0) {\n e.preventDefault();\n const slot = this._slots[this._activeIndex];\n if (slot) this._selectSlot(slot);\n }\n break;\n\n case 'Escape':\n e.preventDefault();\n this._closeListbox();\n break;\n\n case 'Home':\n if (this._open) {\n e.preventDefault();\n this._activeIndex = 0;\n this._scrollActiveOptionIntoView();\n }\n break;\n\n case 'End':\n if (this._open) {\n e.preventDefault();\n this._activeIndex = this._slots.length - 1;\n this._scrollActiveOptionIntoView();\n }\n break;\n\n case 'Tab':\n this._closeListbox();\n break;\n }\n }\n\n /* @internal /\n private _handleOptionPointerDown(e: MouseEvent): void {\n // Prevent the input from losing focus when clicking an option\n e.preventDefault();\n }\n\n /* @internal /\n private _handleOptionClick(slot: TimeSlot): void {\n this._selectSlot(slot);\n this._inputEl?.focus();\n }\n\n /* @internal /\n private _handleOptionMouseEnter(index: number): void {\n this._activeIndex = index;\n }\n\n // ─── Public API ───\n\n /* Moves focus to the time input element. /\n override focus(options?: FocusOptions): void {\n this._inputEl?.focus(options);\n }\n\n // ─── Render ───\n\n override render() {\n const hasError = !!this.error \|\| this._hasErrorSlot;\n const slots = this._slots;\n\n const fieldClasses = {\n field: true,\n 'field--error': hasError,\n 'field--disabled': this.disabled,\n 'field--required': this.required,\n };\n\n const activeDescendant =\n this._open && this._activeIndex >= 0\n ? `${this._listboxId}-option-${this._activeIndex}`\n : undefined;\n\n const placeholder = this.format === '12h' ? 'hh:mm AM' : 'hh:mm';\n\n // WCAG 1.3.1: the help-text div with _helpId always renders in the DOM unconditionally.\n // Always include _helpId in describedBy — an empty target is harmless for AT and ensures\n // the link is established immediately without waiting for the slotchange event to fire.\n const describedBy =\n [hasError ? this._errorId : null, this._helpId].filter(Boolean).join(' ') \|\| undefined;\n\n return html`\n <div part=\"field\" class=${classMap(fieldClasses)}>\n <!-- Label -->\n <slot name=\"label\" @slotchange=${this._handleLabelSlotChange}>\n ${this.label\n ? html`\n <label part=\"label\" class=\"field__label\" for=${this._id}>\n ${this.label}\n ${this.required\n ? html`<span class=\"field__required-marker\" aria-hidden=\"true\"></span>`\n : nothing}\n </label>\n `\n : nothing}\n </slot>\n\n <!-- Combobox wrapper; role=\"combobox\" lives on the input per ARIA 1.2 -->\n <div class=\"field__combobox\">\n <input\n part=\"input\"\n class=\"field__input\"\n id=${this._id}\n type=\"text\"\n inputmode=\"text\"\n autocomplete=\"off\"\n spellcheck=\"false\"\n role=\"combobox\"\n aria-expanded=${this._open ? 'true' : 'false'}\n aria-haspopup=\"listbox\"\n .value=${live(this._inputDisplayValue)}\n placeholder=${placeholder}\n ?required=${this.required}\n ?disabled=${this.disabled}\n name=${ifDefined(this.name \|\| undefined)}\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-labelledby=${ifDefined(\n this._hasLabelSlot && this._slottedLabelId ? this._slottedLabelId : undefined,\n )}\n @click=${this._handleInputClick}\n @input=${this._handleInputInput}\n @change=${this._handleInputChange}\n @keydown=${this._handleInputKeyDown}\n />\n\n <!-- Toggle button -->\n <button\n part=\"toggle\"\n type=\"button\"\n class=\"field__toggle\"\n tabindex=\"-1\"\n aria-label=${this._open ? 'Close time picker' : 'Open time picker'}\n ?disabled=${this.disabled}\n @click=${this._handleToggleClick}\n >\n <!-- Clock icon -->\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <circle cx=\"8\" cy=\"8\" r=\"6.5\" stroke=\"currentColor\" stroke-width=\"1.25\" />\n <path\n d=\"M8 4.5V8L10.5 10\"\n stroke=\"currentColor\"\n stroke-width=\"1.25\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n\n <!-- Dropdown listbox: always in DOM so aria-controls is never a dangling reference (WCAG 4.1.2). Hidden via the boolean hidden attribute when closed. -->\n <ul\n part=\"listbox\"\n class=\"field__listbox\"\n id=${this._listboxId}\n role=\"listbox\"\n aria-label=${this.label \|\| 'Time options'}\n ?hidden=${!this._open}\n >\n ${this._open\n ? repeat(\n slots,\n (slot) => slot.value,\n (slot, index) => {\n const isSelected = slot.value === this.value;\n const isActive = index === this._activeIndex;\n return html`\n <li\n part=\"option\"\n class=${classMap({\n field__option: true,\n 'field__option--selected': isSelected,\n 'field__option--active': isActive,\n })}\n id=\"${this._listboxId}-option-${index}\"\n role=\"option\"\n aria-selected=${isSelected ? 'true' : 'false'}\n @pointerdown=${this._handleOptionPointerDown}\n @click=${() => this._handleOptionClick(slot)}\n @mouseenter=${() => this._handleOptionMouseEnter(index)}\n >\n ${slot.label}\n </li>\n `;\n },\n )\n : nothing}\n </ul>\n </div>\n\n <!-- Error slot / property -->\n <slot name=\"error\" @slotchange=${this._handleErrorSlotChange}>\n ${this.error\n ? html`\n <div part=\"error\" class=\"field__error\" id=${this._errorId} role=\"alert\">\n ${this.error}\n </div>\n `\n : nothing}\n </slot>\n\n <!-- Help slot -->\n <div part=\"help-text\" class=\"field__help-text\" id=${this._helpId}>\n <slot name=\"help-text\" @slotchange=${this._handleHelpSlotChange}></slot>\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-time-picker': HelixTimePicker;\n }\n}\n"],"names":["helixTimePickerStyles","css","parseHHMM","raw","match","hours","minutes","toHHMM","to12h","value","parsed","period","h","generateSlots","minTime","maxTime","stepMinutes","format","minParsed","maxParsed","minTotal","maxTotal","step","slots","t","m","clampValue","total","parseUserInput","trimmed","hhmm","twelve","HelixTimePicker","LitElement","_a","key","changed","state","_mode","clamped","disabled","selectedIndex","s","active","slot","nodes","labelEl","n","target","index","options","hasError","fieldClasses","activeDescendant","placeholder","describedBy","html","classMap","nothing","live","ifDefined","repeat","isSelected","isActive","tokenStyles","__decorateClass","property","query","customElement"],"mappings":"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"}

package/dist/shared/{hx-tree-item-DTDIBRrI.js → hx-tree-item-C1PhX-HE.js} RENAMED Viewed

@@ -1,5 +1,5 @@
-import { css as b, LitElement as _, nothing as f, html as x } from "lit";
-import { property as p, state as c, customElement as g, query as w } from "lit/decorators.js";
+import { css as b, LitElement as _, nothing as p, html as x } from "lit";
+import { property as m, state as c, customElement as g, query as w } from "lit/decorators.js";
 import { tokenStyles as y } from "@helixui/tokens/lit";
 import { classMap as I } from "lit/directives/class-map.js";
 const C = b`
@@ -25,10 +25,10 @@ const C = b`
     border-radius: var(--hx-border-radius-sm, 0.25rem);
   }
 `;
-var S = Object.defineProperty, k = Object.getOwnPropertyDescriptor, m = (e, t, i, s) => {
-  for (var r = s > 1 ? void 0 : s ? k(t, i) : t, n = e.length - 1, o; n >= 0; n--)
+var k = Object.defineProperty, S = Object.getOwnPropertyDescriptor, f = (e, t, i, s) => {
+  for (var r = s > 1 ? void 0 : s ? S(t, i) : t, n = e.length - 1, o; n >= 0; n--)
     (o = e[n]) && (r = (s ? o(t, i, r) : o(r)) || r);
-  return s && r && S(t, i, r), r;
+  return s && r && k(t, i, r), r;
 };
 let d = class extends _ {
   constructor() {
@@ -160,8 +160,31 @@ let d = class extends _ {
         e.preventDefault(), this._focusItem(t.length - 1);
         break;
       }
+      default: {
+        if (e.key.length === 1) {
+          e.preventDefault();
+          const a = this._findTypeaheadMatch(e.key.toLowerCase(), i);
+          a !== -1 && this._focusItem(a);
+        }
+        break;
+      }
     }
   }
+  /**
+   * Finds the next visible item (starting after `currentIndex`, wrapping around) whose
+   * label text begins with the given lowercase character. Returns -1 if no match.
+   * @internal
+   */
+  _findTypeaheadMatch(e, t) {
+    const i = this._getVisibleItems();
+    if (i.length === 0) return -1;
+    for (let s = 1; s <= i.length; s++) {
+      const r = (t + s) % i.length, n = i[r];
+      if (n && n.labelText.toLowerCase().startsWith(e))
+        return r;
+    }
+    return -1;
+  }
   /** @internal */
   _handleFocusIn(e) {
     e.target === e.currentTarget && this._getVisibleItems().length > 0 && this._focusItem(this._currentIndex);
@@ -209,7 +232,7 @@ let d = class extends _ {
         role="tree"
         tabindex=${e}
         aria-label=${this.label || "Tree"}
-        aria-multiselectable=${this.selection === "none" ? f : this.selection === "multiple" ? "true" : "false"}
+        aria-multiselectable=${this.selection === "none" ? p : this.selection === "multiple" ? "true" : "false"}
         @hx-tree-item-select=${this._handleTreeItemSelect}
         @keydown=${this._handleKeyDown}
         @focusin=${this._handleFocusIn}
@@ -220,19 +243,19 @@ let d = class extends _ {
   }
 };
 d.styles = [y, C];
-m([
-  p({ type: String, reflect: !0 })
+f([
+  m({ type: String, reflect: !0 })
 ], d.prototype, "label", 2);
-m([
-  p({ type: String, reflect: !0 })
+f([
+  m({ type: String, reflect: !0 })
 ], d.prototype, "selection", 2);
-m([
+f([
   c()
 ], d.prototype, "_currentIndex", 2);
-m([
+f([
   c()
 ], d.prototype, "_hasVisibleItems", 2);
-d = m([
+d = f([
   g("hx-tree-view")
 ], d);
 const E = b`
@@ -430,6 +453,13 @@ let l = class extends _ {
   get hasChildItems() {
     return this._hasChildren;
   }
+  /**
+   * The text content of the item's label slot, used for typeahead keyboard navigation.
+   * Returns an empty string until the label slot has been assigned.
+   */
+  get labelText() {
+    return this._labelText;
+  }
   /**
    * Recompute all cached ARIA metadata in a single DOM pass.
    * Called on connect, slotchange, and whenever structural context may change.
@@ -561,7 +591,7 @@ let l = class extends _ {
     ` : x`<span class="expand-placeholder" aria-hidden="true"></span>`;
   }
   render() {
-    const e = this._hasChildren ? String(this.expanded) : f, t = this._selectable ? String(this.selected) : f;
+    const e = this._hasChildren ? String(this.expanded) : p, t = this._selectable ? String(this.selected) : p;
     return x`
       <div part="item" class="item">
         <div
@@ -571,7 +601,7 @@ let l = class extends _ {
           tabindex=${this._rovingActive ? "0" : "-1"}
           aria-expanded=${e}
           aria-selected=${t}
-          aria-disabled=${this.disabled ? "true" : f}
+          aria-disabled=${this.disabled ? "true" : p}
           aria-level=${this._level}
           aria-posinset=${this._posInSet}
           aria-setsize=${this._setSize}
@@ -591,6 +621,7 @@ let l = class extends _ {
           class=${I({ children: !0, "children--expanded": this.expanded })}
           role="group"
           aria-label=${this._labelText ? `${this._labelText} children` : "children"}
+          aria-hidden=${!this.expanded || p}
         >
           <div class="children-inner">
             <slot name="children" @slotchange=${this._handleChildrenSlotChange}></slot>
@@ -602,13 +633,13 @@ let l = class extends _ {
 };
 l.styles = [y, E];
 h([
-  p({ type: Boolean, reflect: !0 })
+  m({ type: Boolean, reflect: !0 })
 ], l.prototype, "expanded", 2);
 h([
-  p({ type: Boolean, reflect: !0 })
+  m({ type: Boolean, reflect: !0 })
 ], l.prototype, "selected", 2);
 h([
-  p({ type: Boolean, reflect: !0 })
+  m({ type: Boolean, reflect: !0 })
 ], l.prototype, "disabled", 2);
 h([
   c()
@@ -641,4 +672,4 @@ export {
   l as H,
   d as a
 };
-//# sourceMappingURL=hx-tree-item-DTDIBRrI.js.map
+//# sourceMappingURL=hx-tree-item-C1PhX-HE.js.map

package/dist/shared/hx-tree-item-C1PhX-HE.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"hx-tree-item-C1PhX-HE.js","sources":["../../src/components/hx-tree-view/hx-tree-view.styles.ts","../../src/components/hx-tree-view/hx-tree-view.ts","../../src/components/hx-tree-view/hx-tree-item.styles.ts","../../src/components/hx-tree-view/hx-tree-item.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixTreeViewStyles = css`\n :host {\n display: block;\n contain: layout style;\n font-family: var(--hx-tree-font-family, var(--hx-font-family-sans, sans-serif));\n }\n\n * {\n box-sizing: border-box;\n }\n\n .tree {\n display: block;\n outline: none;\n }\n\n .tree:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-focus-ring-color, var(--hx-color-primary-400, #60a5fa));\n outline-offset: var(--hx-focus-ring-offset, 2px);\n border-radius: var(--hx-border-radius-sm, 0.25rem);\n }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixTreeViewStyles } from './hx-tree-view.styles.js';\nimport type { HelixTreeItem, HxTreeItemSelectDetail } from './hx-tree-item.js';\nimport { devWarn } from '../../utils/dev-warn.js';\n\n/** Selection mode for the tree. */\nexport type TreeSelection = 'none' | 'single' | 'multiple';\n\n/** Detail type for the `hx-select` event. */\nexport interface HxSelectDetail {\n /** The tree item that was selected or deselected. */\n item: HelixTreeItem;\n /** Whether the item is now selected. */\n selected: boolean;\n}\n\n/**\n * A hierarchical tree component for navigating nested data structures.\n * Used in healthcare applications for org charts, ICD-10 code hierarchies, and department navigation.\n *\n * Implements WAI-ARIA tree view pattern with `role=\"tree\"` on the container\n * and `role=\"treeitem\"` on each item. Supports `aria-label` via the `label` property\n * for screen reader identification. Full keyboard navigation: Arrow keys for movement,\n * Enter/Space for selection, Home/End for first/last item.\n *\n * ## Scale Limits\n *\n * This component renders all tree items simultaneously in the DOM. It is suitable for\n * trees with up to ~500 visible items. For large taxonomies (e.g., ICD-10 with 70,000+\n * codes), use async/lazy loading: only render top-level nodes initially and populate\n * child nodes on `hx-select` or expand events. The component exposes the `expanded`\n * property on `hx-tree-item` for programmatic control of subtrees, enabling consumer-level\n * virtualization strategies without requiring changes to this component.\n *\n * @summary Hierarchical tree view with expand/collapse and keyboard navigation.\n *\n * @tag hx-tree-view\n *\n * @slot - Default slot for hx-tree-item elements.\n *\n * @fires {CustomEvent<HxSelectDetail>} hx-select - Dispatched when a tree item is selected or deselected.\n *\n * @csspart tree - The tree container element with role=\"tree\".\n *\n * @cssprop [--hx-tree-font-family=var(--hx-font-family-sans)] - Tree font family.\n */\n@customElement('hx-tree-view')\nexport class HelixTreeView extends LitElement {\n static override styles = [tokenStyles, helixTreeViewStyles];\n\n // ─── Properties ───\n\n /**\n * Accessible label for the tree. Applied as `aria-label` on the tree container.\n * Provides context to screen readers about the tree's purpose.\n * @attr label\n */\n @property({ type: String, reflect: true })\n label = '';\n\n /**\n * Selection mode for the tree.\n * - `none` — items cannot be selected\n * - `single` — only one item can be selected at a time\n * - `multiple` — multiple items can be selected\n * @attr selection\n */\n @property({ type: String, reflect: true })\n selection: 'none' | 'single' | 'multiple' = 'none';\n\n // ─── Internal State ───\n\n /** @internal */\n @state() private _currentIndex = 0;\n\n /** Tracks whether the tree has any visible items, to decide the container tabindex. */\n /** @internal */\n @state() private _hasVisibleItems = false;\n\n // ─── Visible items cache ───\n\n /**\n * Cached flat list of visible items (depth-first, respects collapsed nodes).\n * Set to null to invalidate; rebuilt on next access.\n * @internal\n */\n private _cachedVisibleItems: HelixTreeItem[] | null = null;\n\n /**\n * Invalidate the visible-items cache. Call after any expand/collapse or structural change.\n * @internal\n */\n private _invalidateVisibleItemsCache(): void {\n this._cachedVisibleItems = null;\n }\n\n // ─── Internal Helpers ───\n\n /**\n * Returns a flat ordered list of all visible (not inside a collapsed item) hx-tree-items\n * in depth-first order. Result is cached; invalidated on expand/collapse/slotchange.\n */\n /** @internal */\n private _getVisibleItems(): HelixTreeItem[] {\n if (!this._cachedVisibleItems) {\n this._cachedVisibleItems = this._collectVisibleItems(this);\n }\n return this._cachedVisibleItems;\n }\n\n /** @internal */\n private _collectVisibleItems(container: Element): HelixTreeItem[] {\n const items: HelixTreeItem[] = [];\n for (const child of Array.from(container.children)) {\n if (child.tagName.toLowerCase() === 'hx-tree-item') {\n const item = child as HelixTreeItem;\n items.push(item);\n if (item.expanded) {\n items.push(...this._collectVisibleItems(item));\n }\n } else {\n items.push(...this._collectVisibleItems(child));\n }\n }\n return items;\n }\n\n /** @internal */\n private _getSelectedItems(): HelixTreeItem[] {\n return Array.from(this.querySelectorAll<HelixTreeItem>('hx-tree-item[selected]'));\n }\n\n /**\n * Updates the roving tabindex across all visible items so that only the\n * item at `activeIndex` has `tabindex=\"0\"`. All others receive `tabindex=\"-1\"`.\n * This is called whenever the active item changes (navigation, initial render).\n */\n /** @internal */\n private _updateRovingTabindex(items: HelixTreeItem[], activeIndex: number): void {\n items.forEach((item, i) => {\n item.setRovingActive(i === activeIndex);\n });\n }\n\n /** @internal */\n private _focusItem(index: number): void {\n const items = this._getVisibleItems();\n if (items.length === 0) return;\n const clamped = Math.max(0, Math.min(index, items.length - 1));\n this._currentIndex = clamped;\n this._updateRovingTabindex(items, clamped);\n items[clamped]?.focus();\n }\n\n // ─── Event Handling ───\n\n /** @internal */\n private _handleTreeItemSelect(e: Event): void {\n if (!(e instanceof CustomEvent)) return;\n const event = e as CustomEvent<HxTreeItemSelectDetail>;\n const item = event.detail.item;\n\n if (this.selection === 'none') return;\n\n if (this.selection === 'single') {\n const wasSelected = item.selected;\n this._getSelectedItems().forEach((i) => {\n i.selected = false;\n });\n item.selected = !wasSelected;\n } else if (this.selection === 'multiple') {\n item.selected = !item.selected;\n }\n\n this.dispatchEvent(\n new CustomEvent<HxSelectDetail>('hx-select', {\n bubbles: true,\n composed: true,\n detail: { item, selected: item.selected },\n }),\n );\n }\n\n /** @internal */\n private _handleKeyDown(e: KeyboardEvent): void {\n const items = this._getVisibleItems();\n if (items.length === 0) return;\n\n let currentIndex = this._currentIndex;\n const focused = document.activeElement;\n\n for (let i = 0; i < items.length; i++) {\n if (items[i] === focused || items[i]?.shadowRoot?.activeElement) {\n currentIndex = i;\n break;\n }\n }\n\n switch (e.key) {\n case 'ArrowDown': {\n e.preventDefault();\n // Intentional design: wrap-around from last to first item provides\n // a continuous navigation loop, consistent with the component's\n // circular keyboard navigation model.\n const next = currentIndex < items.length - 1 ? currentIndex + 1 : 0;\n this._focusItem(next);\n break;\n }\n case 'ArrowUp': {\n e.preventDefault();\n // Intentional design: wrap-around from first to last item (see ArrowDown note).\n const prev = currentIndex > 0 ? currentIndex - 1 : items.length - 1;\n this._focusItem(prev);\n break;\n }\n case 'ArrowLeft': {\n e.preventDefault();\n const currentItem = items[currentIndex];\n if (!currentItem) break;\n if (currentItem.expanded && currentItem.hasChildItems) {\n currentItem.expanded = false;\n this._invalidateVisibleItemsCache();\n } else {\n const parentItem = currentItem.parentElement?.closest('hx-tree-item') as\n | HelixTreeItem\n | undefined;\n if (parentItem) {\n const parentIndex = items.indexOf(parentItem);\n if (parentIndex >= 0) {\n this._focusItem(parentIndex);\n }\n }\n }\n break;\n }\n case 'ArrowRight': {\n e.preventDefault();\n const currentItem = items[currentIndex];\n if (!currentItem) break;\n if (currentItem.hasChildItems) {\n if (!currentItem.expanded) {\n currentItem.expanded = true;\n this._invalidateVisibleItemsCache();\n } else {\n this._focusItem(currentIndex + 1);\n }\n }\n break;\n }\n case 'Home': {\n e.preventDefault();\n this._focusItem(0);\n break;\n }\n case 'End': {\n e.preventDefault();\n this._focusItem(items.length - 1);\n break;\n }\n default: {\n // WAI-ARIA APG typeahead: a printable character moves focus to the next visible\n // item whose label starts with that character (case-insensitive).\n if (e.key.length === 1) {\n e.preventDefault();\n const matchIndex = this._findTypeaheadMatch(e.key.toLowerCase(), currentIndex);\n if (matchIndex !== -1) {\n this._focusItem(matchIndex);\n }\n }\n break;\n }\n }\n }\n\n /**\n * Finds the next visible item (starting after `currentIndex`, wrapping around) whose\n * label text begins with the given lowercase character. Returns -1 if no match.\n * @internal\n */\n private _findTypeaheadMatch(char: string, currentIndex: number): number {\n const items = this._getVisibleItems();\n if (items.length === 0) return -1;\n for (let i = 1; i <= items.length; i++) {\n const index = (currentIndex + i) % items.length;\n const item = items[index];\n if (item && item.labelText.toLowerCase().startsWith(char)) {\n return index;\n }\n }\n return -1;\n }\n\n /** @internal */\n private _handleFocusIn(e: FocusEvent): void {\n // With roving tabindex, the tree container (tabindex=\"-1\") should only receive\n // focus when the tree is empty. If focus does land on the container (e.g. the\n // tree is empty or programmatic focus), redirect to the active item if present.\n if (e.target === e.currentTarget) {\n const items = this._getVisibleItems();\n if (items.length > 0) {\n this._focusItem(this._currentIndex);\n }\n }\n }\n\n /**\n * Compute and push ARIA position metadata (level, posInSet, setSize, selectable) to all\n * direct hx-tree-item children of a container in a single O(n) pass.\n * Each item also recurses for its own children, building the full tree in O(total-items) total.\n * @internal\n */\n private _updateAriaMetadataForContainer(container: Element, level: number): void {\n const selectable = this.selection === 'single' || this.selection === 'multiple';\n const children = Array.from(container.children).filter(\n (c) => c.tagName.toLowerCase() === 'hx-tree-item',\n ) as HelixTreeItem[];\n const setSize = children.length;\n children.forEach((item, index) => {\n item.setAriaMetadata(level, index + 1, setSize, selectable);\n // Recurse into child items so the full tree is updated in one traversal\n this._updateAriaMetadataForContainer(item, level + 1);\n });\n }\n\n /**\n * Initializes the roving tabindex after items are first slotted in.\n * Ensures the active item (index 0 by default) has tabindex=\"0\" from the start,\n * so a Tab into the tree lands directly on the first item without a redirect.\n * Also updates `_hasVisibleItems` so the container tabindex re-renders correctly.\n * Pushes O(n) ARIA metadata to all items to replace the O(n^2) per-item ancestor walk.\n */\n /** @internal */\n private _handleSlotChange(): void {\n this._invalidateVisibleItemsCache();\n // Push ARIA metadata from parent in a single O(n) traversal\n this._updateAriaMetadataForContainer(this, 1);\n const items = this._getVisibleItems();\n this._hasVisibleItems = items.length > 0;\n if (items.length === 0) return;\n // Clamp _currentIndex in case items were removed.\n const clamped = Math.min(this._currentIndex, items.length - 1);\n this._currentIndex = clamped;\n this._updateRovingTabindex(items, clamped);\n }\n\n // ─── Lifecycle ───\n\n override firstUpdated(): void {\n if (!this.label) {\n devWarn(\n 'hx-tree-view',\n 'No accessible label provided. Set the `label` attribute on hx-tree-view so screen readers can identify this tree (WCAG 4.1.2).',\n );\n }\n }\n\n // ─── Render ───\n\n override render() {\n // Roving tabindex pattern (WCAG 2.4.3 Fix):\n // The tree container is NOT a Tab stop (tabindex=\"-1\"). Tab focus goes\n // directly to the active item, which carries tabindex=\"0\". The container\n // is only a landing target (tabindex=\"0\") when the tree is empty.\n const containerTabindex = this._hasVisibleItems ? '-1' : '0';\n\n return html`\n <div\n part=\"tree\"\n class=\"tree\"\n role=\"tree\"\n tabindex=${containerTabindex}\n aria-label=${this.label || 'Tree'}\n aria-multiselectable=${this.selection === 'none'\n ? nothing\n : this.selection === 'multiple'\n ? 'true'\n : 'false'}\n @hx-tree-item-select=${this._handleTreeItemSelect}\n @keydown=${this._handleKeyDown}\n @focusin=${this._handleFocusIn}\n >\n <slot @slotchange=${this._handleSlotChange}></slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-tree-view': HelixTreeView;\n }\n}\n\n/** Canonical type alias for HelixTreeView. Use this when typing hx-tree-view element references. */\nexport type HxTreeView = HelixTreeView;\n\n/** @deprecated Use {@link HxTreeView} instead. The `Wc` prefix was a legacy naming convention. */\nexport type WcTreeView = HelixTreeView;\n","import { css } from 'lit';\n\nexport const helixTreeItemStyles = css`\n :host {\n display: block;\n contain: layout style;\n }\n\n * {\n box-sizing: border-box;\n }\n\n /* ─── Item Container ─── */\n\n .item {\n display: block;\n }\n\n /* ─── Item Row ─── */\n\n .item-row {\n display: flex;\n align-items: center;\n gap: var(--hx-tree-item-gap, var(--hx-space-2, 0.5rem));\n padding: var(--hx-tree-item-padding-y, var(--hx-space-1, 0.25rem))\n var(--hx-tree-item-padding-x, var(--hx-space-2, 0.5rem));\n padding-inline-start: calc(\n var(--hx-tree-item-padding-x, var(--hx-space-2, 0.5rem)) + var(--_indent-level, 0) *\n var(--hx-tree-indent-size, 1.5rem)\n );\n border-radius: var(--hx-tree-item-border-radius, var(--hx-border-radius-sm, 0.25rem));\n cursor: pointer;\n outline: none;\n color: var(--hx-tree-item-color, var(--hx-color-neutral-900, #111827));\n font-family: var(--hx-tree-item-font-family, var(--hx-font-family-sans, sans-serif));\n font-size: var(--hx-tree-item-font-size, var(--hx-font-size-sm, 0.875rem));\n line-height: var(--hx-line-height-normal, 1.5);\n transition: background-color var(--hx-transition-fast, 150ms ease);\n user-select: none;\n }\n\n .item-row:hover {\n background-color: var(--hx-tree-item-hover-bg, var(--hx-color-neutral-100, #f3f4f6));\n }\n\n .item-row:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-tree-item-focus-ring-color, var(--hx-focus-ring-color, var(--hx-color-primary-500)));\n outline-offset: var(--hx-focus-ring-offset, -2px);\n }\n\n /* ─── Selected State ─── */\n\n :host([selected]) .item-row {\n background-color: var(--hx-tree-item-selected-bg, var(--hx-color-primary-100, #dbeafe));\n color: var(--hx-tree-item-selected-color, var(--hx-color-primary-800, #1e40af));\n }\n\n :host([selected]) .item-row:hover {\n background-color: var(--hx-tree-item-selected-hover-bg, var(--hx-color-primary-200, #bfdbfe));\n }\n\n /* ─── Disabled State ─── */\n\n :host([disabled]) .item-row {\n opacity: var(--hx-opacity-disabled, 0.5);\n cursor: not-allowed;\n pointer-events: none;\n }\n\n /* ─── Expand Icon ─── */\n\n .expand-icon {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: var(--hx-space-4, 1rem);\n height: var(--hx-space-4, 1rem);\n }\n\n .expand-btn {\n display: flex;\n align-items: center;\n justify-content: center;\n width: var(--hx-space-4, 1rem);\n height: var(--hx-space-4, 1rem);\n padding: 0;\n border: none;\n background: transparent;\n color: var(--hx-tree-item-expand-icon-color, var(--hx-color-neutral-500, #6b7280));\n cursor: pointer;\n border-radius: var(--hx-border-radius-sm, 0.25rem);\n transition: transform var(--hx-transition-fast, 150ms ease);\n pointer-events: auto;\n }\n\n .expand-btn:hover {\n background-color: var(\n --hx-tree-item-expand-hover-bg,\n var(--hx-overlay-black-6, rgba(0, 0, 0, 0.06))\n );\n }\n\n .expand-btn:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-tree-item-focus-ring-color, var(--hx-focus-ring-color, var(--hx-color-primary-500)));\n outline-offset: var(--hx-focus-ring-offset, 2px);\n }\n\n .expand-btn svg {\n width: var(--hx-space-3, 0.75rem);\n height: var(--hx-space-3, 0.75rem);\n stroke: currentColor;\n fill: none;\n stroke-width: 2;\n stroke-linecap: round;\n stroke-linejoin: round;\n transition: transform var(--hx-transition-fast, 150ms ease);\n }\n\n :host([expanded]) .expand-btn svg {\n transform: rotate(90deg);\n }\n\n .expand-placeholder {\n display: block;\n width: var(--hx-space-4, 1rem);\n flex-shrink: 0;\n }\n\n /* ─── Icon Slot ─── */\n\n .item-icon {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n color: var(--hx-tree-item-icon-color, var(--hx-color-neutral-500, #6b7280));\n }\n\n .item-icon:empty {\n display: none;\n }\n\n /* ─── Label ─── */\n\n .item-label {\n flex: 1;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n /* ─── Children (animated) ─── */\n\n .children {\n display: grid;\n grid-template-rows: 0fr;\n transition: grid-template-rows var(--hx-transition-base, 200ms ease);\n --_indent-level: calc(var(--_indent-level, 0) + 1);\n }\n\n .children--expanded {\n grid-template-rows: 1fr;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .item-row,\n .expand-btn,\n .expand-btn svg,\n .children {\n transition: none;\n }\n }\n\n .children-inner {\n overflow: hidden;\n }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixTreeItemStyles } from './hx-tree-item.styles.js';\n\n/** Detail type for the `hx-tree-item-select` event. */\nexport interface HxTreeItemSelectDetail {\n /** The tree item that was selected or activated. */\n item: HelixTreeItem;\n}\n\n/**\n * A tree item used within an hx-tree-view component.\n * Supports expand/collapse, selection, keyboard navigation, and icon/children slots.\n *\n * @summary Individual item within an hx-tree-view hierarchical tree.\n *\n * @tag hx-tree-item\n *\n * @slot - Default slot for the item label content. This text is also used to label the children group.\n * @slot icon - Custom icon shown before the label.\n * @slot children - Nested hx-tree-item elements for sub-tree.\n *\n * @csspart item - The outer item container.\n * @csspart row - The interactive item row (contains expand icon, icon slot, and label).\n * @csspart expand-icon - The expand/collapse toggle button.\n * @csspart label - The label text content area.\n * @csspart children - The children container.\n *\n * @cssprop [--hx-tree-item-color=var(--hx-color-neutral-900)] - Item text color.\n * @cssprop [--hx-tree-item-hover-bg=var(--hx-color-neutral-100)] - Hover background color.\n * @cssprop [--hx-tree-item-selected-bg=var(--hx-color-primary-100)] - Selected background color.\n * @cssprop [--hx-tree-item-selected-color=var(--hx-color-primary-800)] - Selected text color.\n * @cssprop [--hx-tree-item-padding-x=var(--hx-space-2)] - Horizontal padding.\n * @cssprop [--hx-tree-item-padding-y=var(--hx-space-1)] - Vertical padding.\n * @cssprop [--hx-tree-indent-size=1.5rem] - Indentation size per level.\n *\n * @fires {CustomEvent<HxTreeItemSelectDetail>} hx-tree-item-select - Dispatched when this item is clicked or activated via keyboard.\n */\n@customElement('hx-tree-item')\nexport class HelixTreeItem extends LitElement {\n static override styles = [tokenStyles, helixTreeItemStyles];\n\n // ─── Properties ───\n\n /**\n * Whether the item is expanded (showing children).\n * @attr expanded\n */\n @property({ type: Boolean, reflect: true })\n expanded = false;\n\n /**\n * Whether the item is selected.\n * @attr selected\n */\n @property({ type: Boolean, reflect: true })\n selected = false;\n\n /**\n * Whether the item is disabled (non-interactive).\n * @attr disabled\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n // ─── Internal State ───\n\n /**\n * Tracks whether any elements are assigned to the children slot, controlling expand icon visibility.\n * @internal\n */\n @state() private _hasChildren = false;\n\n /**\n * Whether this item is the roving-tabindex active item in the tree.\n * @internal\n */\n @state() private _rovingActive = false;\n\n /**\n * Text content from the default slot, used to label the children group for screen readers.\n * @internal\n */\n @state() private _labelText = '';\n\n /**\n * Cached ARIA position metadata. Computed once on connect and on slotchange\n * of the parent container, avoiding repeated DOM traversal on every render.\n * @internal\n */\n @state() private _level = 1;\n /**\n * One-based position of this item within its sibling set, set as aria-posinset.\n * @internal\n */\n @state() private _posInSet = 1;\n /**\n * Total count of sibling hx-tree-item elements at the same level, set as aria-setsize.\n * @internal\n */\n @state() private _setSize = 1;\n /**\n * Whether the owning hx-tree-view supports item selection (single or multiple mode).\n * @internal\n */\n @state() private _selectable = false;\n\n /** @internal */\n @query('.item-row') private _itemRowEl!: HTMLElement | null;\n\n // ─── Computed ARIA ───\n\n /**\n * Whether this item has slotted children.\n * @returns True if one or more elements are assigned to the children slot.\n */\n get hasChildItems(): boolean {\n return this._hasChildren;\n }\n\n /**\n * The text content of the item's label slot, used for typeahead keyboard navigation.\n * Returns an empty string until the label slot has been assigned.\n */\n get labelText(): string {\n return this._labelText;\n }\n\n /**\n * Recompute all cached ARIA metadata in a single DOM pass.\n * Called on connect, slotchange, and whenever structural context may change.\n * @internal\n */\n private _updateAriaMetadata(): void {\n // Compute nesting level by counting ancestor hx-tree-item elements.\n let level = 1;\n let el: Element | null = this.parentElement;\n while (el) {\n if (el.tagName.toLowerCase() === 'hx-tree-item') level++;\n el = el.parentElement;\n }\n this._level = level;\n\n // Compute position-in-set and set-size from sibling hx-tree-item elements.\n const parent = this.parentElement;\n if (parent) {\n const siblings = Array.from(parent.children).filter(\n (c) => c.tagName.toLowerCase() === 'hx-tree-item',\n );\n this._posInSet = siblings.indexOf(this) + 1;\n this._setSize = siblings.length;\n } else {\n this._posInSet = 1;\n this._setSize = 1;\n }\n\n // Determine if the owning tree supports selection.\n const tree = this.closest('hx-tree-view');\n if (tree) {\n const selection = tree.getAttribute('selection');\n this._selectable = selection === 'single' || selection === 'multiple';\n } else {\n this._selectable = false;\n }\n }\n\n /**\n * Set ARIA position metadata from the parent hx-tree-view in a single O(n) pass.\n * Calling this avoids the O(n^2) ancestor-walk + sibling-iteration in _updateAriaMetadata\n * when the parent already knows the layout.\n * @internal\n */\n setAriaMetadata(level: number, posInSet: number, setSize: number, selectable: boolean): void {\n this._level = level;\n this._posInSet = posInSet;\n this._setSize = setSize;\n this._selectable = selectable;\n }\n\n // ─── Lifecycle ───\n\n override connectedCallback(): void {\n super.connectedCallback();\n this._updateAriaMetadata();\n }\n\n // ─── Children Detection ───\n\n /**\n * Updates _hasChildren and recomputes ARIA metadata when the children slot assignment changes.\n * @internal\n */\n private _handleChildrenSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasChildren = slot.assignedElements().length > 0;\n this._updateAriaMetadata();\n }\n\n /**\n * Captures the text content from the default (label) slot for use on the children group label.\n * @internal\n */\n private _handleLabelSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n const nodes = slot.assignedNodes({ flatten: true });\n this._labelText = nodes\n .map((n) => n.textContent ?? '')\n .join('')\n .trim();\n }\n\n // ─── Event Handlers ───\n\n /**\n * Toggles the expanded state when the expand/collapse button is clicked, stopping event propagation.\n * @internal\n */\n private _handleExpandClick(e: Event): void {\n e.stopPropagation();\n if (this.disabled) return;\n this.expanded = !this.expanded;\n }\n\n /**\n * Dispatches the hx-tree-item-select event when the item is activated via click or keyboard.\n * @internal\n */\n private _handleRowClick(): void {\n if (this.disabled) return;\n this.dispatchEvent(\n new CustomEvent<HxTreeItemSelectDetail>('hx-tree-item-select', {\n bubbles: true,\n composed: true,\n detail: { item: this },\n }),\n );\n }\n\n /**\n * Handles keyboard interaction for the tree item, including expand/collapse, activation, and delegation of list-navigation keys to the parent tree.\n * @internal\n */\n private _handleKeyDown(e: KeyboardEvent): void {\n if (this.disabled) return;\n\n switch (e.key) {\n case 'ArrowRight':\n e.preventDefault();\n if (this._hasChildren && !this.expanded) {\n this.expanded = true;\n }\n break;\n case 'ArrowLeft':\n e.preventDefault();\n if (this._hasChildren && this.expanded) {\n this.expanded = false;\n }\n break;\n case 'Enter':\n case ' ':\n e.preventDefault();\n this._handleRowClick();\n break;\n case 'ArrowDown':\n case 'ArrowUp':\n case 'Home':\n case 'End':\n // Bubble up to hx-tree-view for navigation\n break;\n }\n }\n\n // ─── Public API ───\n\n /**\n * Sets the roving tabindex state for this item.\n * When `active` is true, the item row gets `tabindex=\"0\"` making it the\n * Tab-reachable item in the tree. All other items should be set to false.\n * Called by the parent hx-tree-view to manage the roving tabindex pattern.\n */\n setRovingActive(active: boolean): void {\n this._rovingActive = active;\n }\n\n /** Focus this item's interactive row element. */\n override focus(): void {\n this._itemRowEl?.focus();\n }\n\n // ─── Render ───\n\n /**\n * Renders the expand/collapse chevron button, or a placeholder span when the item has no children.\n * @internal\n */\n private _renderExpandIcon() {\n if (!this._hasChildren) {\n return html`<span class=\"expand-placeholder\" aria-hidden=\"true\"></span>`;\n }\n return html`\n <button\n part=\"expand-icon\"\n class=\"expand-btn\"\n tabindex=\"-1\"\n aria-label=\"${this.expanded ? 'Collapse' : 'Expand'}\"\n @click=${this._handleExpandClick}\n >\n <svg viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n <polyline points=\"6 4 10 8 6 12\" />\n </svg>\n </button>\n `;\n }\n\n override render() {\n const ariaExpanded = this._hasChildren ? String(this.expanded) : nothing;\n const ariaSelected = this._selectable ? String(this.selected) : nothing;\n\n return html`\n <div part=\"item\" class=\"item\">\n <div\n part=\"row\"\n class=\"item-row\"\n role=\"treeitem\"\n tabindex=${this._rovingActive ? '0' : '-1'}\n aria-expanded=${ariaExpanded}\n aria-selected=${ariaSelected}\n aria-disabled=${this.disabled ? 'true' : nothing}\n aria-level=${this._level}\n aria-posinset=${this._posInSet}\n aria-setsize=${this._setSize}\n @click=${this._handleRowClick}\n @keydown=${this._handleKeyDown}\n >\n ${this._renderExpandIcon()}\n <span class=\"item-icon\">\n <slot name=\"icon\"></slot>\n </span>\n <span part=\"label\" class=\"item-label\">\n <slot @slotchange=${this._handleLabelSlotChange}></slot>\n </span>\n </div>\n <div\n part=\"children\"\n class=${classMap({ children: true, 'children--expanded': this.expanded })}\n role=\"group\"\n aria-label=${this._labelText ? `${this._labelText} children` : 'children'}\n aria-hidden=${!this.expanded || nothing}\n >\n <div class=\"children-inner\">\n <slot name=\"children\" @slotchange=${this._handleChildrenSlotChange}></slot>\n </div>\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-tree-item': HelixTreeItem;\n }\n}\n\n/** Canonical type alias for HelixTreeItem. Use this when typing hx-tree-item element references. */\nexport type HxTreeItem = HelixTreeItem;\n\n/** @deprecated Use {@link HxTreeItem} instead. The `Wc` prefix was a legacy naming convention. */\nexport type WcTreeItem = HelixTreeItem;\n"],"names":["helixTreeViewStyles","css","HelixTreeView","LitElement","container","items","child","item","activeIndex","i","index","clamped","_a","wasSelected","currentIndex","focused","_b","next","prev","currentItem","parentItem","_c","parentIndex","matchIndex","char","level","selectable","children","c","setSize","containerTabindex","html","nothing","tokenStyles","__decorateClass","property","state","customElement","helixTreeItemStyles","HelixTreeItem","el","parent","siblings","tree","selection","posInSet","slot","nodes","n","active","ariaExpanded","ariaSelected","classMap","query"],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@helixui/library",
-  "version": "1.1.2-next.1",
+  "version": "1.1.2-next.10",
   "description": "Enterprise Web Component Library built with Lit 3.x",
   "type": "module",
   "sideEffects": [
@@ -43,7 +43,7 @@
   "customElements": "custom-elements.json",
   "dependencies": {
     "lit": "^3.3.2",
-    "@helixui/tokens": "0.3.4-next.1"
+    "@helixui/tokens": "0.3.4-next.10"
   },
   "peerDependencies": {
     "@floating-ui/dom": "^1.7.6"
@@ -100,7 +100,7 @@
     "test:batch:4": "vitest run \"hx-prose/|hx-radio-group/|hx-rating/|hx-select/|hx-side-nav/|hx-skeleton/|hx-slider/|hx-spinner/|hx-split-button/|hx-split-panel/|hx-stack/|hx-status-indicator/|hx-steps/|hx-structured-list/\" --reporter=verbose",
     "test:batch:5": "vitest run \"hx-switch/|hx-tabs/|hx-tag/|hx-text/|hx-text-input/|hx-textarea/|hx-theme/|hx-time-picker/|hx-toast/|hx-toggle-button/|hx-tooltip/|hx-top-nav/|hx-tree-view/|hx-visually-hidden/\" --reporter=verbose",
     "test:component": "vitest run --reporter=verbose",
-    "cem": "custom-elements-manifest analyze --litelement --globs \"src/components/**/*.ts\" --exclude \"**/*.stories.ts\" --exclude \"**/*.styles.ts\"",
+    "cem": "custom-elements-manifest analyze --litelement --globs \"src/components/**/*.ts\" --exclude \"**/*.stories.ts\" --exclude \"**/*.styles.ts\" && node ../../scripts/validate-cem.mjs",
     "cem:watch": "custom-elements-manifest analyze --litelement --globs \"src/components/**/*.ts\" --exclude \"**/*.stories.ts\" --exclude \"**/*.styles.ts\" --watch",
     "build:cdn": "node scripts/build-cdn.mjs",
     "generate:drupal-libraries": "node scripts/generate-drupal-libraries.js",

package/dist/shared/hx-avatar-7p1cj3lG.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"hx-avatar-7p1cj3lG.js","sources":["../../src/components/hx-avatar/hx-avatar.styles.ts","../../src/components/hx-avatar/hx-avatar.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixAvatarStyles = css`\n :host {\n display: inline-block;\n }\n\n /* P2-5: Respect the HTML hidden attribute — custom elements with explicit display ignore it otherwise. */\n :host([hidden]) {\n display: none !important;\n }\n\n /* P0-2: Wrapper provides the positioning context for the badge slot, outside overflow: hidden. */\n .avatar-wrapper {\n position: relative;\n display: inline-flex;\n }\n\n .avatar {\n display: flex;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n width: var(--hx-avatar-size);\n height: var(--hx-avatar-size);\n background-color: var(--hx-avatar-bg, var(--hx-color-primary-100));\n color: var(--hx-avatar-color, var(--hx-color-primary-700));\n border-radius: var(--hx-avatar-border-radius);\n flex-shrink: 0;\n }\n\n /* ─── Size Variants ─── */\n\n .avatar--xs {\n --hx-avatar-size: var(--hx-size-6, 1.5rem);\n --hx-avatar-font-size: var(--hx-font-size-2xs, 0.625rem);\n }\n\n .avatar--sm {\n --hx-avatar-size: var(--hx-size-8, 2rem);\n --hx-avatar-font-size: var(--hx-font-size-xs, 0.75rem);\n }\n\n .avatar--md {\n --hx-avatar-size: var(--hx-size-10, 2.5rem);\n --hx-avatar-font-size: var(--hx-font-size-sm, 0.875rem);\n }\n\n .avatar--lg {\n --hx-avatar-size: var(--hx-size-12, 3rem);\n --hx-avatar-font-size: var(--hx-font-size-md, 1rem);\n }\n\n .avatar--xl {\n --hx-avatar-size: var(--hx-size-16, 4rem);\n --hx-avatar-font-size: var(--hx-font-size-lg, 1.125rem);\n }\n\n /* ─── Shape Variants ─── */\n\n .avatar--circle {\n --hx-avatar-border-radius: 50%;\n }\n\n .avatar--square {\n --hx-avatar-border-radius: var(--hx-border-radius-md, 0.375rem);\n }\n\n /* ─── Image ─── */\n\n .avatar__image {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n }\n\n /* ─── Initials ─── */\n\n .avatar__initials {\n font-family: var(--hx-font-family-sans, sans-serif);\n font-size: var(--hx-avatar-font-size);\n font-weight: var(--hx-font-weight-semibold, 600);\n line-height: 1;\n text-transform: uppercase;\n letter-spacing: var(--hx-letter-spacing-wide, 0.025em);\n user-select: none;\n }\n\n /* ─── Fallback Icon ─── */\n\n .avatar__fallback-icon {\n width: 60%;\n height: 60%;\n color: var(--hx-avatar-color, var(--hx-color-primary-700));\n }\n\n /* ─── Badge Slot ─── */\n\n /* P0-2: Positioned relative to .avatar-wrapper — outside the overflow: hidden on .avatar. */\n .avatar__badge {\n position: absolute;\n bottom: 0;\n right: 0;\n }\n\n /* P2-2: Hide the badge wrapper when no slot content is present, preserving slotchange detection. */\n .avatar__badge--hidden {\n display: none;\n }\n\n /* P1-B: Windows High Contrast Mode — avatar background is stripped by the system,\n leaving no visual boundary. Add a border so the avatar remains perceivable.\n WCAG 1.4.11 Non-text Contrast (Level AA). */\n @media (forced-colors: active) {\n .avatar {\n border: 2px solid ButtonText;\n }\n }\n`;\n","import { LitElement, html, nothing, 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 { helixAvatarStyles } from './hx-avatar.styles.js';\nimport { devWarn } from '../../utils/dev-warn.js';\n\n/**\n * A user avatar component that displays an image, initials, or a fallback icon.\n * Supports a badge slot for status indicator overlays.\n *\n * @summary User avatar with image, initials, and fallback icon support for healthcare applications.\n *\n * @tag hx-avatar\n *\n * @slot - Default slot for custom avatar content. Overrides src and initials when slotted content is present.\n * @slot badge - Status indicator overlay, positioned at the bottom-right of the avatar container.\n *\n * @csspart avatar - The outer container element.\n * @csspart image - The img element shown when src is provided.\n * @csspart initials - The initials text span shown as a fallback.\n * @csspart fallback-icon - The SVG person silhouette shown when no src or initials are available.\n * @csspart badge - The badge slot container.\n *\n * @cssprop [--hx-avatar-size] - Computed width and height from the size variant.\n * @cssprop [--hx-avatar-border-radius] - Circle = 50%, Square = var(--hx-border-radius-md).\n * @cssprop [--hx-avatar-bg=var(--hx-color-primary-100)] - Background color of the avatar container.\n * @cssprop [--hx-avatar-color=var(--hx-color-primary-700)] - Text and icon color inside the avatar.\n * @cssprop [--hx-avatar-font-size] - Font size for the initials text, set per size variant.\n */\n@customElement('hx-avatar')\nexport class HelixAvatar extends LitElement {\n static override styles = [tokenStyles, helixAvatarStyles];\n\n /**\n * Image URL. When provided and successfully loaded, displays the image.\n * @attr src\n */\n @property({ type: String })\n src: string | undefined = undefined;\n\n /**\n * Accessible label for the image. Required when `src` is provided.\n * Used as the container's aria-label in image mode.\n * @attr alt\n */\n @property({ type: String })\n alt = '';\n\n /**\n * Human-readable accessible name for non-image states (initials, fallback icon).\n * In healthcare contexts, provide the full person name (e.g., \"Dr. Jane Doe\") rather than\n * relying on raw initials, which screen readers announce as individual letters.\n * When set, takes precedence over raw initials and the generic \"Avatar\" fallback.\n * @attr label\n */\n @property({ type: String })\n label = '';\n\n /**\n * Fallback initials text displayed when no image is available.\n * @attr initials\n */\n @property({ type: String })\n initials = '';\n\n /**\n * Size variant of the avatar.\n * @attr hx-size\n */\n @property({ type: String, reflect: true, attribute: 'hx-size' })\n size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'md';\n\n /**\n * Shape variant of the avatar.\n * @attr shape\n */\n @property({ type: String, reflect: true })\n shape: 'circle' | 'square' = 'circle';\n\n /**\n * Tracks whether the image failed to load, triggering the fallback chain.\n * @internal\n */\n @state()\n private _imgError = false;\n\n /**\n * Tracks whether the default slot has assigned content.\n * @internal\n */\n @state()\n private _hasDefaultSlot = false;\n\n /**\n * Tracks whether the badge slot has assigned content.\n * @internal\n */\n @state()\n private _hasBadgeSlot = false;\n\n // ─── Lifecycle ───\n\n // P1-A / P2-B: Use willUpdate() instead of updated() for property validation\n // and derived state. willUpdate() runs before render() and does not schedule\n // a second update cycle when @state() properties are mutated.\n override willUpdate(changedProperties: PropertyValues<this>): void {\n // P0-1: Reset image error state when src changes so a new valid src renders correctly.\n if (changedProperties.has('src')) {\n this._imgError = false;\n }\n\n // P1-2: Warn when src is provided without alt — silent accessibility failure in healthcare UIs.\n if (changedProperties.has('src') || changedProperties.has('alt')) {\n if (this.src && !this.alt) {\n devWarn(\n 'hx-avatar',\n 'Accessibility: \"alt\" attribute is required when \"src\" is provided. ' +\n 'Without alt text, screen readers announce a non-descriptive label. ' +\n 'Add alt=\"Full name or description\" to your hx-avatar element.',\n );\n }\n }\n\n // P2-A: Warn when initials are used without label — screen readers announce\n // raw initials as individual letters (e.g., \"J D\") instead of a name.\n if (changedProperties.has('initials') || changedProperties.has('label')) {\n if (this.initials && !this.label) {\n devWarn(\n 'hx-avatar',\n 'Accessibility: \"label\" attribute is recommended when \"initials\" is provided. ' +\n 'Without label, screen readers announce raw initials as individual letters. ' +\n 'Add label=\"Full Name\" to your hx-avatar element.',\n );\n }\n }\n\n // P2-1: Warn when invalid size or shape attribute values are used (e.g., from Twig templates).\n const validSizes: ReadonlyArray<string> = ['xs', 'sm', 'md', 'lg', 'xl'];\n if (changedProperties.has('size') && !validSizes.includes(this.size)) {\n devWarn(\n 'hx-avatar',\n `Invalid hx-size=\"${String(this.size)}\". Valid values: xs, sm, md, lg, xl. Rendering with \"md\".`,\n );\n }\n const validShapes: ReadonlyArray<string> = ['circle', 'square'];\n if (changedProperties.has('shape') && !validShapes.includes(this.shape)) {\n devWarn(\n 'hx-avatar',\n `Invalid shape=\"${String(this.shape)}\". Valid values: circle, square. Rendering with \"circle\".`,\n );\n }\n }\n\n // ─── Slot Change Handling ───\n\n /** @internal */\n private _handleSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n const nodes = slot.assignedNodes({ flatten: true });\n this._hasDefaultSlot = nodes.some((node) => {\n if (node.nodeType === Node.ELEMENT_NODE) return true;\n if (node.nodeType === Node.TEXT_NODE) {\n return (node.textContent ?? '').trim().length > 0;\n }\n return false;\n });\n }\n\n /** @internal */\n private _handleBadgeSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n const nodes = slot.assignedNodes({ flatten: true });\n this._hasBadgeSlot = nodes.some((node) => {\n if (node.nodeType === Node.ELEMENT_NODE) return true;\n if (node.nodeType === Node.TEXT_NODE) {\n return (node.textContent ?? '').trim().length > 0;\n }\n return false;\n });\n\n // P2-C: Warn when badge slot content lacks an accessible name.\n // A plain <span class=\"dot\"></span> badge is invisible to screen readers.\n if (this._hasBadgeSlot) {\n const hasAccessibleName = nodes.some((node) => {\n if (node.nodeType === Node.ELEMENT_NODE) {\n const el = node as Element;\n return (\n el.hasAttribute('aria-label') ||\n el.hasAttribute('aria-labelledby') ||\n !!el.getAttribute('role')\n );\n }\n return false;\n });\n if (!hasAccessibleName) {\n devWarn(\n 'hx-avatar',\n 'Accessibility: badge slot content should have an accessible name ' +\n '(aria-label, role, etc.). Without it, the badge is invisible to screen readers.',\n );\n }\n }\n }\n\n // ─── Image Error Handling ───\n\n /** @internal */\n private _handleImgError(): void {\n this._imgError = true;\n }\n\n // ─── Fallback Icon ───\n\n /** @internal */\n private _renderFallbackIcon() {\n return html`\n <svg\n part=\"fallback-icon\"\n class=\"avatar__fallback-icon\"\n viewBox=\"0 0 24 24\"\n aria-hidden=\"true\"\n fill=\"currentColor\"\n >\n <path\n d=\"M12 12c2.7 0 4.8-2.1 4.8-4.8S14.7 2.4 12 2.4 7.2 4.5 7.2 7.2 9.3 12 12 12zm0 2.4c-3.2 0-9.6 1.6-9.6 4.8v2.4h19.2v-2.4c0-3.2-6.4-4.8-9.6-4.8z\"\n />\n </svg>\n `;\n }\n\n // ─── Render ───\n\n override render() {\n const src = this.src;\n const showSlot = this._hasDefaultSlot;\n const showImage = !showSlot && !!src && !this._imgError;\n const showInitials = !showSlot && !showImage && !!this.initials.trim();\n const showFallback = !showSlot && !showImage && !showInitials;\n\n // P1-1 / P1-7: Use label property for human-readable accessible name in non-image states.\n const ariaLabel = showImage\n ? this.alt || this.label || 'Avatar'\n : showInitials\n ? this.label || this.initials\n : this.label || 'Avatar';\n\n // P2-1: Safe class fallback for invalid attribute values supplied via HTML/Twig.\n const validSizes: ReadonlyArray<string> = ['xs', 'sm', 'md', 'lg', 'xl'];\n const validShapes: ReadonlyArray<string> = ['circle', 'square'];\n const sizeClass = validSizes.includes(this.size) ? this.size : 'md';\n const shapeClass = validShapes.includes(this.shape) ? this.shape : 'circle';\n\n const classes = {\n avatar: true,\n [`avatar--${sizeClass}`]: true,\n [`avatar--${shapeClass}`]: true,\n };\n\n // P2-2: Badge wrapper is hidden (not removed) when empty so slotchange detection still works.\n const badgeClasses = {\n avatar__badge: true,\n 'avatar__badge--hidden': !this._hasBadgeSlot,\n };\n\n return html`\n <div class=\"avatar-wrapper\">\n <div\n part=\"avatar\"\n class=${classMap(classes)}\n role=${showSlot ? nothing : 'img'}\n aria-label=${showSlot ? nothing : ariaLabel}\n >\n <slot @slotchange=${this._handleSlotChange}></slot>\n ${showImage && src\n ? html`<img\n part=\"image\"\n class=\"avatar__image\"\n src=${src}\n alt=${this.alt}\n aria-hidden=\"true\"\n loading=\"lazy\"\n @error=${this._handleImgError}\n />`\n : nothing}\n ${showInitials\n ? html`<span part=\"initials\" class=\"avatar__initials\">${this.initials.trim()}</span>`\n : nothing}\n ${showFallback ? this._renderFallbackIcon() : nothing}\n </div>\n <span part=\"badge\" class=${classMap(badgeClasses)}>\n <slot name=\"badge\" @slotchange=${this._handleBadgeSlotChange}></slot>\n </span>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-avatar': HelixAvatar;\n }\n}\n"],"names":["helixAvatarStyles","css","HelixAvatar","LitElement","changedProperties","validSizes","devWarn","validShapes","e","nodes","node","el","html","src","showSlot","showImage","showInitials","showFallback","ariaLabel","sizeClass","shapeClass","classes","badgeClasses","classMap","nothing","tokenStyles","__decorateClass","property","state","customElement"],"mappings":"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"}