npm - @helixui/library - Versions diffs - 0.3.1 → 0.3.3 - Mend

@helixui/library 0.3.1 → 0.3.3

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

package/dist/shared/hx-badge-DYB1Pnym.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"hx-badge-DYB1Pnym.js","sources":["../../src/components/hx-badge/hx-badge.styles.ts","../../src/components/hx-badge/hx-badge.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixBadgeStyles = css`\n :host {\n display: inline-block;\n }\n\n .badge {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--hx-space-1, 0.25rem);\n border-radius: var(--hx-badge-border-radius, var(--hx-border-radius-md, 0.375rem));\n background-color: var(--hx-badge-bg, var(--hx-color-primary-500, #2563eb));\n color: var(--hx-badge-color, var(--hx-color-neutral-0, #ffffff));\n font-family: var(--hx-badge-font-family, var(--hx-font-family-sans, sans-serif));\n font-weight: var(--hx-badge-font-weight, var(--hx-font-weight-semibold, 600));\n line-height: var(--hx-line-height-tight, 1.25);\n white-space: nowrap;\n vertical-align: middle;\n position: relative;\n }\n\n /* ─── Size Variants ─── */\n\n .badge--sm {\n font-size: var(--hx-badge-font-size, var(--hx-font-size-2xs, 0.625rem));\n padding: var(--hx-badge-padding-y, var(--hx-space-0-5, 0.125rem))\n var(--hx-badge-padding-x, var(--hx-space-1-5, 0.375rem));\n }\n\n .badge--md {\n font-size: var(--hx-badge-font-size, var(--hx-font-size-xs, 0.75rem));\n padding: var(--hx-badge-padding-y, var(--hx-space-1, 0.25rem))\n var(--hx-badge-padding-x, var(--hx-space-2, 0.5rem));\n }\n\n .badge--lg {\n font-size: var(--hx-badge-font-size, var(--hx-font-size-sm, 0.875rem));\n padding: var(--hx-badge-padding-y, var(--hx-space-1, 0.25rem))\n var(--hx-badge-padding-x, var(--hx-space-3, 0.75rem));\n }\n\n /* ─── Style Variants ─── */\n\n .badge--primary {\n --hx-badge-bg: var(--hx-color-primary-500, #2563eb);\n --hx-badge-color: var(--hx-color-neutral-0, #ffffff);\n --hx-badge-pulse-color: var(--hx-color-primary-500, #2563eb);\n }\n\n .badge--secondary {\n --hx-badge-bg: var(--hx-badge-secondary-bg, var(--hx-color-neutral-100, #f3f4f6));\n --hx-badge-color: var(--hx-badge-secondary-color, var(--hx-color-neutral-700, #374151));\n --hx-badge-pulse-color: var(--hx-badge-secondary-bg, var(--hx-color-neutral-100, #f3f4f6));\n }\n\n .badge--success {\n --hx-badge-bg: var(--hx-color-success-700, #15803d);\n --hx-badge-color: var(--hx-color-neutral-0, #ffffff);\n --hx-badge-pulse-color: var(--hx-color-success-700, #15803d);\n }\n\n .badge--warning {\n --hx-badge-bg: var(--hx-color-warning-500, #eab308);\n --hx-badge-color: var(--hx-color-neutral-900, #1a1a1a);\n --hx-badge-pulse-color: var(--hx-color-warning-500, #eab308);\n }\n\n .badge--error {\n --hx-badge-bg: var(--hx-color-error-500, #dc2626);\n --hx-badge-color: var(--hx-color-neutral-0, #ffffff);\n --hx-badge-pulse-color: var(--hx-color-error-500, #dc2626);\n }\n\n .badge--neutral {\n --hx-badge-bg: var(--hx-color-neutral-200, #e5e7eb);\n --hx-badge-color: var(--hx-color-neutral-700, #374151);\n --hx-badge-pulse-color: var(--hx-color-neutral-200, #e5e7eb);\n }\n\n .badge--info {\n --hx-badge-bg: var(--hx-badge-info-bg, var(--hx-color-info-700, #0369a1));\n --hx-badge-color: var(--hx-badge-info-color, var(--hx-color-neutral-0, #ffffff));\n --hx-badge-pulse-color: var(--hx-badge-info-bg, var(--hx-color-info-700, #0369a1));\n }\n\n /* ─── Pill Mode ─── */\n\n .badge--pill {\n border-radius: var(--hx-badge-border-radius, var(--hx-border-radius-full, 9999px));\n }\n\n /* ─── Dot Indicator (empty + pulse) ─── */\n\n .badge--dot {\n width: var(--hx-badge-dot-size, var(--hx-size-2, 0.5rem));\n height: var(--hx-badge-dot-size, var(--hx-size-2, 0.5rem));\n padding: 0;\n border-radius: var(--hx-border-radius-full, 9999px);\n }\n\n /* ─── Pulse Animation ─── */\n\n @keyframes wc-badge-pulse {\n 0%,\n 100% {\n opacity: 1;\n }\n 50% {\n opacity: 0.5;\n }\n }\n\n .badge--pulse {\n animation: wc-badge-pulse var(--hx-badge-pulse-duration, var(--hx-duration-slow, 2s))\n var(--hx-badge-pulse-easing, var(--hx-ease-in-out, ease-in-out)) infinite;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .badge--pulse {\n animation: none;\n }\n }\n\n /* ─── Remove Button ─── */\n\n .badge__remove-button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n background: none;\n border: none;\n padding: 0;\n margin-inline-start: var(--hx-space-1, 0.25rem);\n cursor: pointer;\n color: inherit;\n opacity: 0.7;\n border-radius: var(--hx-border-radius-sm, 0.125rem);\n line-height: 0;\n }\n\n .badge__remove-button:hover {\n opacity: 1;\n }\n\n .badge__remove-button:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid var(--hx-focus-ring-color, currentColor);\n outline-offset: var(--hx-focus-ring-offset, 1px);\n }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixBadgeStyles } from './hx-badge.styles.js';\n\n/**\n * A small status indicator for notifications, counts, and labels.\n *\n * @summary Presentational badge for status indicators, notification counts, and labels.\n *\n * @tag hx-badge\n *\n * @slot - Default slot for badge content (text, number). When empty with pulse enabled, renders as a dot indicator.\n * @slot prefix - Icon or content rendered before the badge text.\n *\n * @fires {CustomEvent<void>} hx-remove - Dispatched when the user clicks the remove button.\n *\n * @csspart badge - The badge element.\n * @csspart remove-button - The remove/dismiss button.\n *\n * @cssprop [--hx-badge-bg=var(--hx-color-primary-500)] - Badge background color. The primary override point.\n * @cssprop [--hx-badge-color=var(--hx-color-neutral-0)] - Badge text color. The primary override point.\n * @cssprop [--hx-badge-font-size] - Badge font size (set per size variant).\n * @cssprop [--hx-badge-font-weight=var(--hx-font-weight-semibold)] - Badge font weight.\n * @cssprop [--hx-badge-font-family=var(--hx-font-family-sans)] - Badge font family.\n * @cssprop [--hx-badge-border-radius=var(--hx-border-radius-md)] - Badge border radius.\n * @cssprop [--hx-badge-padding-x] - Badge horizontal padding (set per size variant).\n * @cssprop [--hx-badge-padding-y] - Badge vertical padding (set per size variant).\n * @cssprop [--hx-badge-pulse-color] - Pulse color matching variant background with reduced opacity.\n * @cssprop [--hx-badge-dot-size=var(--hx-size-2)] - Dot indicator size when rendered without content.\n * @cssprop [--hx-badge-secondary-bg=var(--hx-color-neutral-100)] - Background for the secondary variant.\n * @cssprop [--hx-badge-secondary-color=var(--hx-color-neutral-700)] - Text color for the secondary variant.\n * @cssprop [--hx-badge-info-bg=var(--hx-color-info-700)] - Background for the info variant.\n * @cssprop [--hx-badge-info-color=var(--hx-color-neutral-0)] - Text color for the info variant.\n */\n@customElement('hx-badge')\nexport class HelixBadge extends LitElement {\n static override styles = [tokenStyles, helixBadgeStyles];\n\n /**\n * Visual style variant of the badge.\n * @attr variant\n */\n @property({ type: String, reflect: true })\n variant: 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'neutral' | 'info' =\n 'primary';\n\n /**\n * Size of the badge.\n * @attr size\n */\n @property({ type: String, reflect: true })\n size: 'sm' | 'md' | 'lg' = 'md';\n\n /**\n * Whether the badge uses fully rounded (pill) styling.\n * @attr pill\n */\n @property({ type: Boolean, reflect: true })\n pill = false;\n\n /**\n * Whether the badge displays an animated pulse for attention.\n * @attr pulse\n */\n @property({ type: Boolean, reflect: true })\n pulse = false;\n\n /**\n * Whether the badge renders a dismiss button.\n * @attr removable\n */\n @property({ type: Boolean, reflect: true })\n removable = false;\n\n /**\n * Numeric count to display. When set, renders the count as badge content.\n * When count exceeds `max`, displays `${max}+` (e.g. `99+`).\n * @attr count\n */\n @property({ type: Number, reflect: true })\n count: number | undefined = undefined;\n\n /**\n * Maximum count value before truncation to `${max}+`. Defaults to 99.\n * @attr max\n */\n @property({ type: Number, reflect: true })\n max = 99;\n\n /**\n * Accessible label for the dot indicator mode (pulse + empty slot).\n * Required for WCAG 4.1.2 compliance when using the dot indicator pattern.\n * Example: `dot-label=\"3 new messages\"`.\n * @attr dot-label\n */\n @property({ type: String, attribute: 'dot-label' })\n dotLabel = '';\n\n /**\n * Accessible label for the remove button. Should describe what is being removed.\n * Defaults to \"Remove\". For better accessibility, include context: e.g. \"Remove Critical badge\".\n * @attr remove-label\n */\n @property({ type: String, attribute: 'remove-label' })\n removeLabel = 'Remove';\n\n /**\n * Tracks whether the default slot has assigned content.\n */\n @state()\n private _hasSlotContent = false;\n\n // ─── Slot Change Handling ───\n\n private _handleSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n const nodes = slot.assignedNodes({ flatten: true });\n // Check if any assigned node has non-whitespace content\n this._hasSlotContent = 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 // ─── Event Handling ───\n\n private _handleRemove(): void {\n this.dispatchEvent(\n new CustomEvent('hx-remove', {\n bubbles: true,\n composed: true,\n }),\n );\n }\n\n // ─── Count Display ───\n\n private get _countDisplay(): string {\n if (this.count === undefined) return '';\n return this.count > this.max ? `${this.max}+` : String(this.count);\n }\n\n // ─── Render ───\n\n override render() {\n const hasCount = this.count !== undefined;\n const isDot = !this._hasSlotContent && !hasCount && this.pulse;\n\n const classes = {\n badge: true,\n [`badge--${this.variant}`]: true,\n [`badge--${this.size}`]: true,\n 'badge--pill': this.pill,\n 'badge--pulse': this.pulse,\n 'badge--dot': isDot,\n };\n\n return html`\n <span\n part=\"badge\"\n class=${classMap(classes)}\n role=${isDot && this.dotLabel ? 'img' : nothing}\n aria-label=${isDot && this.dotLabel ? this.dotLabel : nothing}\n aria-live=${hasCount ? 'polite' : nothing}\n >\n <slot name=\"prefix\"></slot>\n ${hasCount ? this._countDisplay : html`<slot @slotchange=${this._handleSlotChange}></slot>`}\n ${this.removable\n ? html`<button\n part=\"remove-button\"\n class=\"badge__remove-button\"\n aria-label=${this.removeLabel}\n @click=${this._handleRemove}\n >\n <svg viewBox=\"0 0 12 12\" aria-hidden=\"true\" width=\"10\" height=\"10\">\n <path\n d=\"M2.22 2.22a.75.75 0 011.06 0L6 4.94l2.72-2.72a.75.75 0 011.06 1.06L7.06 6l2.72 2.72a.75.75 0 01-1.06 1.06L6 7.06 3.28 9.78a.75.75 0 01-1.06-1.06L4.94 6 2.22 3.28a.75.75 0 010-1.06z\"\n fill=\"currentColor\"\n />\n </svg>\n </button>`\n : nothing}\n </span>\n `;\n }\n}\n\nexport type WcBadge = HelixBadge;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-badge': HelixBadge;\n }\n}\n"],"names":["helixBadgeStyles","css","HelixBadge","LitElement","e","nodes","node","hasCount","isDot","classes","html","classMap","nothing","tokenStyles","__decorateClass","property","state","customElement"],"mappings":"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"}

package/dist/shared/hx-breadcrumb-item-TKRcrMYc.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"hx-breadcrumb-item-TKRcrMYc.js","sources":["../../src/components/hx-breadcrumb/hx-breadcrumb.styles.ts","../../src/components/hx-breadcrumb/hx-breadcrumb.ts","../../src/components/hx-breadcrumb/hx-breadcrumb-item.styles.ts","../../src/components/hx-breadcrumb/hx-breadcrumb-item.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixBreadcrumbStyles = css`\n :host {\n display: block;\n font-family: var(\n --hx-breadcrumb-font-family,\n var(--hx-font-family-sans, system-ui, sans-serif)\n );\n font-size: var(--hx-breadcrumb-font-size, var(--hx-font-size-sm, 0.875rem));\n }\n\n [part='nav'] {\n /* nav landmark — no additional styling needed */\n }\n\n [part='list'] {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n list-style: none;\n margin: 0;\n padding: 0;\n gap: 0;\n }\n\n /* Hide middle items when collapsed via maxItems */\n ::slotted([data-bc-hidden]) {\n display: none;\n }\n\n /* Visually hide the separator slot — used only to read text content.\n * display:none is intentional: the slot contains no interactive or focusable\n * content. If a future change adds focusable elements to this slot, switch to\n * visibility:hidden + position:absolute to preserve focus reachability. */\n .separator-slot {\n display: none;\n }\n`;\n","import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixBreadcrumbStyles } from './hx-breadcrumb.styles.js';\n\n/**\n * Hierarchical page path navigation showing current location in site structure.\n *\n * @summary Navigation breadcrumb showing the page hierarchy. Works with Drupal's breadcrumb system.\n *\n * @tag hx-breadcrumb\n *\n * @slot - Default slot for hx-breadcrumb-item children.\n * @slot separator - Optional separator element. Its text content overrides the `separator` property.\n *\n * @csspart nav - The nav landmark element.\n * @csspart list - The ordered list containing items.\n *\n * @cssprop [--hx-breadcrumb-separator-content='/'] - Separator character between items.\n * NOTE: If overriding this custom property directly in CSS (rather than via the `separator`\n * attribute), the value MUST be quoted: `--hx-breadcrumb-separator-content: \">\"`. An unquoted\n * value is invalid for the CSS `content` property and will silently render nothing.\n * @cssprop [--hx-breadcrumb-separator-color=var(--hx-color-neutral-400)] - Separator color.\n * @cssprop [--hx-breadcrumb-separator-gap=var(--hx-space-1)] - Horizontal gap around separators.\n * @cssprop [--hx-breadcrumb-font-size=var(--hx-font-size-sm)] - Font size.\n * @cssprop [--hx-breadcrumb-link-color=var(--hx-color-primary-600)] - Link color.\n * @cssprop [--hx-breadcrumb-link-hover-color=var(--hx-color-primary-700)] - Link hover color.\n * @cssprop [--hx-breadcrumb-text-color=var(--hx-color-neutral-700)] - Current page text color.\n * @cssprop [--hx-breadcrumb-item-max-width] - Max-width for item text truncation (e.g. `12rem`).\n */\n@customElement('hx-breadcrumb')\nexport class HelixBreadcrumb extends LitElement {\n static override styles = [tokenStyles, helixBreadcrumbStyles];\n\n /**\n * Per-instance counter used to generate stable, deterministic IDs for the\n * injected JSON-LD script tags. Deterministic IDs (vs Math.random()) allow\n * SSR frameworks to match server-rendered script tags during hydration.\n */\n private static _instanceCounter = 0;\n\n /**\n * The separator character displayed between breadcrumb items.\n * @attr separator\n */\n @property({ type: String })\n separator = '/';\n\n /**\n * The accessible label for the nav landmark.\n * @attr label\n */\n @property({ type: String })\n label = 'Breadcrumb';\n\n /**\n * Maximum number of items to show before collapsing middle items with an ellipsis.\n * Set to 0 (default) to show all items. The ellipsis is a keyboard-accessible\n * button; activating it expands the full breadcrumb by setting maxItems to 0.\n * @attr max-items\n */\n @property({ type: Number, attribute: 'max-items' })\n maxItems = 0;\n\n /**\n * When true, injects a JSON-LD BreadcrumbList structured data script into the document head.\n *\n * NOTE: Drupal manages `<head>` content via its own render pipeline. Injecting a\n * `<script>` directly via `document.head.appendChild()` in a Drupal context:\n * 1. Bypasses Drupal's deduplication and `hook_html_head_alter()` hook.\n * 2. Is not cacheable by Drupal's page cache.\n * 3. Will be wiped on BigPipe partial page replacements.\n *\n * For Drupal integrations, leave `json-ld` false and use the structured data\n * Twig template instead (see `hx-breadcrumb.twig` in the component directory).\n *\n * @attr json-ld\n */\n @property({ type: Boolean, attribute: 'json-ld' })\n jsonLd = false;\n\n private _ellipsisItem: Element | null = null;\n private _jsonLdScript: HTMLScriptElement | null = null;\n private _boundEllipsisClick: (e: Event) => void = () => undefined;\n private _boundEllipsisKeydown: (e: KeyboardEvent) => void = () => undefined;\n\n /**\n * Tracks which items had their `current` attribute set by this component\n * (as opposed to set by a consumer/Drupal template). This lets us re-evaluate\n * positional current-page detection on each slotchange without incorrectly\n * treating a previously component-set `current` attribute as a consumer-set\n * explicit override.\n */\n private readonly _managedCurrentItems = new WeakSet<Element>();\n\n /**\n * Stable per-instance ID used to tag the injected script element so that\n * multiple hx-breadcrumb instances on the same page don't produce conflicting\n * or duplicate structured-data blocks. Each instance owns exactly one script\n * tag identified by this ID; any stale tag from a previous render cycle is\n * removed before a new one is inserted.\n *\n * Uses a static counter (not Math.random()) so IDs are deterministic across\n * server and client renders, enabling SSR hydration matching.\n */\n private readonly _jsonLdId = `hx-breadcrumb-ld-${++HelixBreadcrumb._instanceCounter}`;\n\n // ─── Item Helpers ───\n\n /** Returns only real breadcrumb items, excluding the managed ellipsis element. */\n private _getBreadcrumbItems(slot: HTMLSlotElement): Element[] {\n return slot\n .assignedElements({ flatten: true })\n .filter(\n (el) =>\n el.tagName.toLowerCase() === 'hx-breadcrumb-item' &&\n !el.classList.contains('hx-bc-ellipsis'),\n );\n }\n\n /**\n * Applies aria/state attributes to the item list.\n *\n * Current-page detection: if any item has an explicit `current` attribute\n * (e.g. set by a Drupal Twig template), that item is treated as the current\n * page. Otherwise the last item is the current page (default behaviour).\n *\n * This separation allows Drupal to control current-page marking without\n * relying on item order.\n */\n private _applyItemAttributes(items: Element[]): void {\n // Detect consumer-set 'current' attributes. An item has an explicit consumer\n // current if it has the 'current' attribute AND the component did not set it\n // (tracked via _managedCurrentItems). This prevents component-managed state\n // from being misread as a consumer override on subsequent slotchange events.\n const hasExplicitCurrent = items.some(\n (el) => el.hasAttribute('current') && !this._managedCurrentItems.has(el),\n );\n\n items.forEach((item, i) => {\n const el = item as HTMLElement;\n const isLast = i === items.length - 1;\n\n // Separator hiding: always positional — last item has no trailing separator.\n if (isLast) {\n el.setAttribute('data-bc-last', '');\n } else {\n el.removeAttribute('data-bc-last');\n }\n\n // Current-page marker: explicit consumer attribute wins over positional last.\n // The item component renders aria-current=\"page\" on its inner element\n // based on this attribute (see hx-breadcrumb-item.ts).\n if (!hasExplicitCurrent) {\n if (isLast) {\n el.setAttribute('current', '');\n this._managedCurrentItems.add(el);\n } else {\n el.removeAttribute('current');\n this._managedCurrentItems.delete(el);\n }\n }\n // When hasExplicitCurrent is true, leave 'current' attributes as-is so\n // consumer or Drupal template markup is not overridden.\n });\n }\n\n // ─── Slot Handling ───\n\n private _handleSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n const items = this._getBreadcrumbItems(slot);\n\n // Handle collapse behaviour\n if (this.maxItems > 0 && items.length > this.maxItems) {\n this._applyCollapse(items);\n } else {\n this._removeCollapse(items);\n }\n\n this._applyItemAttributes(items);\n\n if (this.jsonLd) {\n this._updateJsonLd(items);\n }\n }\n\n private _handleSeparatorSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n const assigned = slot.assignedElements({ flatten: true });\n if (assigned.length > 0) {\n const text = (assigned[0] as HTMLElement).textContent?.trim() ?? '';\n this.style.setProperty('--hx-breadcrumb-separator-content', JSON.stringify(text));\n }\n }\n\n // ─── Collapse ───\n\n private _applyCollapse(items: Element[]): void {\n // Show only first and last; hide all middle items\n items.forEach((item, i) => {\n const el = item as HTMLElement;\n if (i === 0 || i === items.length - 1) {\n el.removeAttribute('data-bc-hidden');\n } else {\n el.setAttribute('data-bc-hidden', '');\n }\n });\n\n // Create the ellipsis element once\n if (!this._ellipsisItem) {\n const ellipsis = document.createElement('hx-breadcrumb-item');\n ellipsis.classList.add('hx-bc-ellipsis');\n\n // Keyboard-accessible expand button. Events handled via host-level delegation\n // in _handleEllipsisClick / _handleEllipsisKeydown.\n const btn = document.createElement('button');\n btn.type = 'button';\n btn.textContent = '…';\n btn.setAttribute('aria-label', 'Show all breadcrumb items');\n ellipsis.appendChild(btn);\n\n this._ellipsisItem = ellipsis;\n }\n\n // Insert ellipsis after first item only if not already correctly placed\n const firstItem = items[0];\n if (!firstItem) return;\n if (this._ellipsisItem.previousElementSibling !== firstItem) {\n firstItem.after(this._ellipsisItem);\n }\n }\n\n private _removeCollapse(items: Element[]): void {\n items.forEach((item) => {\n (item as HTMLElement).removeAttribute('data-bc-hidden');\n });\n\n if (this._ellipsisItem?.isConnected) {\n this._ellipsisItem.remove();\n }\n }\n\n private _handleEllipsisClick(e: Event): void {\n if ((e.target as Element)?.closest?.('.hx-bc-ellipsis')) {\n this._expandBreadcrumb();\n }\n }\n\n private _handleEllipsisKeydown(e: KeyboardEvent): void {\n if (e.key === 'Enter' || e.key === ' ') {\n if ((e.target as Element)?.closest?.('.hx-bc-ellipsis')) {\n e.preventDefault();\n this._expandBreadcrumb();\n }\n }\n }\n\n /**\n * Expands a collapsed breadcrumb by resetting maxItems to 0.\n * Called by the ellipsis expand button (click or Enter/Space).\n */\n private _expandBreadcrumb(): void {\n this.maxItems = 0;\n // updated() will detect the maxItems change and call _removeCollapse.\n }\n\n // ─── JSON-LD ───\n\n /**\n * JSON-LD ListItem entry with typed fields to avoid Record<string, unknown>.\n */\n private _buildListItem(\n item: Element,\n position: number,\n ): { '@type': string; position: number; name: string; item?: string } {\n const href = (item as HTMLElement).getAttribute('href');\n const name = (item as HTMLElement).textContent?.trim() ?? '';\n const entry: { '@type': string; position: number; name: string; item?: string } = {\n '@type': 'ListItem',\n position,\n name,\n };\n if (href) entry.item = href;\n return entry;\n }\n\n private _updateJsonLd(items: Element[]): void {\n const schema = {\n '@context': 'https://schema.org',\n '@type': 'BreadcrumbList',\n itemListElement: items.map((item, i) => this._buildListItem(item, i + 1)),\n };\n\n if (!this._jsonLdScript) {\n // Dedup guard: remove any stale script with this instance's ID before\n // creating a fresh one. This handles the edge case where the element was\n // reconnected to the DOM after being disconnected without the script\n // reference being re-established.\n document.getElementById(this._jsonLdId)?.remove();\n\n this._jsonLdScript = document.createElement('script');\n this._jsonLdScript.type = 'application/ld+json';\n this._jsonLdScript.id = this._jsonLdId;\n this._jsonLdScript.setAttribute('data-hx-breadcrumb', '');\n document.head.appendChild(this._jsonLdScript);\n }\n\n this._jsonLdScript.textContent = JSON.stringify(schema);\n }\n\n private _removeJsonLd(): void {\n this._jsonLdScript?.remove();\n this._jsonLdScript = null;\n }\n\n // ─── Lifecycle ───\n\n override connectedCallback(): void {\n super.connectedCallback();\n this._boundEllipsisClick = this._handleEllipsisClick.bind(this);\n this._boundEllipsisKeydown = this._handleEllipsisKeydown.bind(this);\n this.addEventListener('click', this._boundEllipsisClick);\n this.addEventListener('keydown', this._boundEllipsisKeydown as EventListener);\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.removeEventListener('click', this._boundEllipsisClick);\n this.removeEventListener('keydown', this._boundEllipsisKeydown as EventListener);\n this._removeJsonLd();\n }\n\n override updated(changedProperties: Map<string, unknown>): void {\n super.updated(changedProperties);\n\n if (changedProperties.has('separator')) {\n // JSON.stringify wraps the string in quotes so the value is valid\n // for use in the CSS `content` property (e.g. '/' becomes '\"/\"').\n this.style.setProperty('--hx-breadcrumb-separator-content', JSON.stringify(this.separator));\n }\n\n if (changedProperties.has('maxItems')) {\n // Re-evaluate collapse state when maxItems changes programmatically\n // (e.g. when the expand button resets maxItems to 0).\n const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot:not([name])');\n if (slot) {\n const items = this._getBreadcrumbItems(slot);\n if (this.maxItems > 0 && items.length > this.maxItems) {\n this._applyCollapse(items);\n } else {\n this._removeCollapse(items);\n }\n this._applyItemAttributes(items);\n }\n }\n\n if (changedProperties.has('jsonLd')) {\n if (this.jsonLd) {\n // json-ld toggled on after initial render — inject script immediately.\n const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot:not([name])');\n if (slot) {\n this._updateJsonLd(this._getBreadcrumbItems(slot));\n }\n } else {\n // json-ld toggled off — remove existing script.\n this._removeJsonLd();\n }\n }\n }\n\n // ─── Render ───\n\n override render() {\n return html`\n <nav part=\"nav\" aria-label=${this.label}>\n <ol part=\"list\">\n <slot @slotchange=${this._handleSlotChange}></slot>\n </ol>\n </nav>\n <slot\n name=\"separator\"\n class=\"separator-slot\"\n @slotchange=${this._handleSeparatorSlotChange}\n ></slot>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-breadcrumb': HelixBreadcrumb;\n }\n}\n","import { css } from 'lit';\n\nexport const helixBreadcrumbItemStyles = css`\n :host {\n display: inline-flex;\n align-items: center;\n }\n\n [part='item'] {\n display: contents;\n }\n\n [part='link'] {\n color: var(--hx-breadcrumb-link-color, var(--hx-color-primary-600));\n text-decoration: none;\n cursor: pointer;\n font-family: inherit;\n font-size: inherit;\n max-width: var(--hx-breadcrumb-item-max-width);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n [part='link']:hover {\n color: var(--hx-breadcrumb-link-hover-color, var(--hx-color-primary-700));\n text-decoration: underline;\n }\n\n [part='link']:focus-visible {\n outline: 2px solid var(--hx-focus-ring-color, var(--hx-color-primary-500));\n outline-offset: 2px;\n border-radius: var(--hx-border-radius-sm, 0.125rem);\n }\n\n [part='text'] {\n color: var(--hx-breadcrumb-text-color, var(--hx-color-neutral-700));\n font-family: inherit;\n font-size: inherit;\n max-width: var(--hx-breadcrumb-item-max-width);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .separator {\n margin-inline: var(--hx-breadcrumb-separator-gap, var(--hx-space-1, 0.25rem));\n color: var(--hx-breadcrumb-separator-color, var(--hx-color-neutral-400));\n user-select: none;\n }\n\n .separator::before {\n content: var(--hx-breadcrumb-separator-content, '/');\n }\n\n /* Normalize buttons slotted into breadcrumb items (e.g. the expand-ellipsis button). */\n ::slotted(button) {\n background: none;\n border: none;\n cursor: pointer;\n font: inherit;\n color: inherit;\n padding: 0;\n }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixBreadcrumbItemStyles } from './hx-breadcrumb-item.styles.js';\n\n/**\n * A single breadcrumb navigation item.\n *\n * @summary A navigation item within an hx-breadcrumb component. Renders as a link when `href` is\n * provided, or as static text for the current page item. The current page item is determined by\n * the `current` attribute (set explicitly or automatically by the parent `hx-breadcrumb`).\n *\n * @tag hx-breadcrumb-item\n *\n * @slot - The link or page text content. Accepts text, HTML, or icon elements.\n *\n * @csspart item - Wrapper around the link or text content.\n * @csspart link - The anchor element when href is provided (non-current items only).\n * @csspart text - The span element for the current page or items without href.\n * @csspart separator - The separator element rendered after non-last items.\n *\n * @cssprop [--hx-breadcrumb-link-color=var(--hx-color-primary-600)] - Link text color.\n * @cssprop [--hx-breadcrumb-link-hover-color=var(--hx-color-primary-700)] - Link hover text color.\n * @cssprop [--hx-breadcrumb-text-color=var(--hx-color-neutral-700)] - Current page text color.\n * @cssprop [--hx-breadcrumb-separator-content='/'] - Separator character displayed after non-last items.\n * @cssprop [--hx-breadcrumb-separator-color=var(--hx-color-neutral-400)] - Separator color.\n * @cssprop [--hx-breadcrumb-separator-gap=var(--hx-space-1)] - Horizontal margin around separator.\n * @cssprop [--hx-breadcrumb-item-max-width] - Optional max-width for text truncation.\n */\n@customElement('hx-breadcrumb-item')\nexport class HelixBreadcrumbItem extends LitElement {\n static override styles = [tokenStyles, helixBreadcrumbItemStyles];\n\n override connectedCallback(): void {\n super.connectedCallback();\n // Only apply role=\"listitem\" when this item is a direct child of an\n // hx-breadcrumb element. Setting the role unconditionally when used\n // standalone (outside a list context) creates an invalid ARIA hierarchy\n // because listitem requires a list ancestor.\n //\n // IMPORTANT: If programmatically creating an ellipsis element, set aria-hidden\n // BEFORE inserting into the DOM. connectedCallback fires on insertion and sets\n // role=\"listitem\"; setting aria-hidden after would momentarily expose an\n // un-hidden listitem to the accessibility tree.\n if (this.closest('hx-breadcrumb') !== null) {\n this.setAttribute('role', 'listitem');\n } else {\n this.removeAttribute('role');\n }\n }\n\n /**\n * The URL for this breadcrumb link. Omit for the current page item.\n * When `current` is true, this attribute is ignored and the item always\n * renders as static text per WAI-ARIA APG breadcrumb guidance.\n * @attr href\n */\n @property({ type: String, reflect: true })\n href: string | undefined = undefined;\n\n /**\n * Whether this is the last item in the breadcrumb trail. Set by the parent\n * hx-breadcrumb component via the `data-bc-last` boolean attribute. When\n * present the trailing separator is hidden.\n *\n * @attr data-bc-last\n * @internal\n */\n @property({ type: Boolean, attribute: 'data-bc-last', reflect: true })\n dataBcLast = false;\n\n /**\n * Marks this item as the current page. When set, the item always renders as\n * static text (never a navigable link) and `aria-current=\"page\"` is placed on\n * the inner text element per WAI-ARIA APG breadcrumb guidance, yielding the\n * canonical AT announcement (\"current page, Patient Records\").\n *\n * Can be set explicitly by consumers (e.g. Drupal Twig templates) to override\n * the default positional last-item detection in `hx-breadcrumb`. When any item\n * in the breadcrumb has an explicit `current` attribute, the parent will not\n * override it.\n *\n * @attr current\n */\n @property({ type: Boolean, reflect: true })\n current = false;\n\n override render() {\n // Per WAI-ARIA APG, the current page item MUST NOT be a navigable link.\n // aria-current=\"page\" is placed on the inner element (not the listitem host)\n // for canonical AT announcement (\"current page, Patient Records\" vs\n // \"current page, list item\").\n return html`\n <span part=\"item\">\n ${this.current\n ? html`<span part=\"text\" aria-current=\"page\"><slot></slot></span>`\n : this.href\n ? html`<a part=\"link\" href=${this.href}><slot></slot></a>`\n : html`<span part=\"text\"><slot></slot></span>`}\n </span>\n ${!this.dataBcLast\n ? html`<span class=\"separator\" part=\"separator\" aria-hidden=\"true\"></span>`\n : nothing}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-breadcrumb-item': HelixBreadcrumbItem;\n }\n}\n"],"names":["helixBreadcrumbStyles","css","HelixBreadcrumb","LitElement","slot","el","items","hasExplicitCurrent","item","isLast","assigned","text","_a","ellipsis","btn","firstItem","_b","position","href","name","entry","schema","i","changedProperties","html","tokenStyles","__decorateClass","property","customElement","helixBreadcrumbItemStyles","HelixBreadcrumbItem","nothing"],"mappings":"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"}

package/dist/shared/hx-button-SAbf4_jC.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"hx-button-SAbf4_jC.js","sources":["../../src/components/hx-button/hx-button.styles.ts","../../src/components/hx-button/hx-button.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixButtonStyles = css`\n :host {\n display: inline-block;\n }\n\n :host([disabled]) {\n pointer-events: none;\n opacity: var(--hx-opacity-disabled, 0.5);\n }\n\n /* ─── Base Button ─── */\n\n .button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--hx-space-2, 0.5rem);\n border: var(--hx-border-width-thin, 1px) solid var(--hx-button-border-color, transparent);\n border-radius: var(--hx-button-border-radius, var(--hx-border-radius-md, 0.375rem));\n background-color: var(--hx-button-bg, var(--hx-color-primary-500, #2563eb));\n color: var(--hx-button-color, var(--hx-color-neutral-0, #ffffff));\n font-family: var(--hx-button-font-family, var(--hx-font-family-sans, sans-serif));\n font-weight: var(--hx-button-font-weight, var(--hx-font-weight-semibold, 600));\n line-height: var(--hx-line-height-tight, 1.25);\n cursor: pointer;\n transition:\n background-color var(--hx-transition-fast, 150ms ease),\n color var(--hx-transition-fast, 150ms ease),\n border-color var(--hx-transition-fast, 150ms ease),\n box-shadow var(--hx-transition-fast, 150ms ease);\n text-decoration: none;\n white-space: nowrap;\n user-select: none;\n -webkit-user-select: none;\n }\n\n .button:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-button-focus-ring-color, var(--hx-focus-ring-color, #2563eb));\n outline-offset: var(--hx-focus-ring-offset, 2px);\n }\n\n .button:hover {\n filter: brightness(var(--hx-filter-brightness-hover, 0.9));\n }\n\n .button:active {\n filter: brightness(var(--hx-filter-brightness-active, 0.8));\n }\n\n /* ─── Size Variants ─── */\n\n .button--sm {\n padding: var(--hx-space-1, 0.25rem) var(--hx-space-3, 0.75rem);\n font-size: var(--hx-font-size-sm, 0.875rem);\n min-height: var(--hx-size-8, 2rem);\n }\n\n .button--md {\n padding: var(--hx-space-2, 0.5rem) var(--hx-space-4, 1rem);\n font-size: var(--hx-font-size-md, 1rem);\n min-height: var(--hx-size-10, 2.5rem);\n }\n\n .button--lg {\n padding: var(--hx-space-3, 0.75rem) var(--hx-space-6, 1.5rem);\n font-size: var(--hx-font-size-lg, 1.125rem);\n min-height: var(--hx-size-12, 3rem);\n }\n\n /* ─── Style Variants ─── */\n\n .button--primary {\n --hx-button-bg: var(--hx-color-primary-500, #2563eb);\n --hx-button-color: var(--hx-color-neutral-0, #ffffff);\n --hx-button-border-color: transparent;\n }\n\n .button--secondary {\n --hx-button-bg: transparent;\n --hx-button-color: var(--hx-color-primary-500, #2563eb);\n --hx-button-border-color: var(--hx-color-primary-500, #2563eb);\n }\n\n .button--secondary:hover {\n --hx-button-bg: var(--hx-color-primary-50, #eff6ff);\n }\n\n .button--tertiary {\n --hx-button-bg: var(--hx-color-neutral-100, #f1f5f9);\n --hx-button-color: var(--hx-color-neutral-900, #0f172a);\n --hx-button-border-color: transparent;\n }\n\n .button--tertiary:hover {\n --hx-button-bg: var(--hx-color-neutral-200, #e2e8f0);\n }\n\n .button--danger {\n --hx-button-bg: var(--hx-color-error-500, #dc2626);\n --hx-button-color: var(--hx-color-neutral-0, #ffffff);\n --hx-button-border-color: transparent;\n }\n\n .button--danger:hover {\n --hx-button-bg: var(--hx-color-error-600, #b91c1c);\n }\n\n .button--ghost {\n --hx-button-bg: transparent;\n --hx-button-color: var(--hx-color-primary-500, #2563eb);\n --hx-button-border-color: transparent;\n }\n\n .button--ghost:hover {\n --hx-button-bg: var(--hx-color-neutral-100, #f1f5f9);\n }\n\n .button--outline {\n --hx-button-bg: transparent;\n --hx-button-color: var(--hx-color-neutral-900, #0f172a);\n --hx-button-border-color: var(--hx-color-neutral-300, #cbd5e1);\n }\n\n .button--outline:hover {\n --hx-button-bg: var(--hx-color-neutral-50, #f8fafc);\n }\n\n /* ─── Disabled ─── */\n\n .button[disabled] {\n cursor: not-allowed;\n }\n\n /* ─── Loading State ─── */\n\n .button--loading {\n position: relative;\n cursor: wait;\n }\n\n .button__spinner {\n width: 1em;\n height: 1em;\n flex-shrink: 0;\n animation: hx-spin var(--hx-duration-spinner, 750ms) linear infinite;\n }\n\n @keyframes hx-spin {\n to {\n transform: rotate(360deg);\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n .button__spinner {\n animation: none;\n opacity: var(--hx-opacity-muted, 0.6);\n }\n }\n\n /* ─── Prefix / Suffix / Label ─── */\n\n .button__prefix,\n .button__suffix {\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n }\n\n .button__label {\n flex: 1 1 auto;\n }\n`;\n","import { LitElement, html, nothing, type TemplateResult } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixButtonStyles } from './hx-button.styles.js';\n\n/**\n * A production-grade button component for user interaction. Supports multiple\n * visual variants, sizes, loading state, prefix/suffix slots, anchor rendering,\n * and full ElementInternals form association.\n *\n * @summary Primary interactive element for triggering actions and form submission.\n *\n * @tag hx-button\n *\n * @slot - Default slot for button label text or content.\n * @slot prefix - Icon or content rendered before the label.\n * @slot suffix - Icon or content rendered after the label.\n *\n * @fires {CustomEvent<{originalEvent: MouseEvent}>} hx-click - Dispatched when\n * the button is clicked and is neither disabled nor loading.\n *\n * @csspart button - The native button or anchor element.\n * @csspart label - The label text wrapper span.\n * @csspart prefix - The prefix slot container span.\n * @csspart suffix - The suffix slot container span.\n * @csspart spinner - The loading spinner SVG element.\n *\n * @cssprop [--hx-button-bg=var(--hx-color-primary-500)] - Button background color.\n * @cssprop [--hx-button-color=var(--hx-color-neutral-0)] - Button text color.\n * @cssprop [--hx-button-border-color=transparent] - Button border color.\n * @cssprop [--hx-button-border-radius=var(--hx-border-radius-md)] - Button border radius.\n * @cssprop [--hx-button-font-family=var(--hx-font-family-sans)] - Button font family.\n * @cssprop [--hx-button-font-weight=var(--hx-font-weight-semibold)] - Button font weight.\n * @cssprop [--hx-button-focus-ring-color=var(--hx-focus-ring-color)] - Focus ring color.\n */\n@customElement('hx-button')\nexport class HelixButton extends LitElement {\n static override styles = [tokenStyles, helixButtonStyles];\n\n // ─── Form Association ───\n\n static formAssociated = true;\n\n private _internals: ElementInternals;\n\n constructor() {\n super();\n this._internals = this.attachInternals();\n }\n\n // ─── Public Properties ───\n\n /**\n * Visual style variant of the button.\n * @attr variant\n */\n @property({ type: String, reflect: true })\n variant: 'primary' | 'secondary' | 'tertiary' | 'danger' | 'ghost' | 'outline' = 'primary';\n\n /**\n * Size of the button.\n * @attr hx-size\n */\n @property({ type: String, reflect: true, attribute: 'hx-size' })\n size: 'sm' | 'md' | 'lg' = 'md';\n\n /**\n * Whether the button is disabled. Prevents all interaction and form actions.\n * @attr disabled\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * Whether the button is in a loading state. Shows spinner, prevents interaction,\n * and sets aria-busy. Does not set the disabled attribute.\n * @attr loading\n */\n @property({ type: Boolean, reflect: true })\n loading = false;\n\n /**\n * The type attribute for the underlying button element. Ignored when href is set.\n * @attr type\n */\n @property({ type: String })\n type: 'button' | 'submit' | 'reset' = 'button';\n\n /**\n * When set, renders an anchor element instead of a button.\n * @attr href\n */\n @property({ type: String })\n href: string | undefined = undefined;\n\n /**\n * Anchor target attribute. Only used when href is set.\n * @attr target\n */\n @property({ type: String })\n target: string | undefined = undefined;\n\n /**\n * Form field name submitted via ElementInternals.setFormValue on submit.\n * @attr name\n */\n @property({ type: String })\n name: string | undefined = undefined;\n\n /**\n * Form field value submitted via ElementInternals.setFormValue on submit.\n * @attr value\n */\n @property({ type: String })\n value: string | undefined = undefined;\n\n /**\n * Accessible label forwarded to the inner button/anchor. Required for icon-only usage.\n * @attr aria-label\n */\n @property({ type: String, reflect: true, attribute: 'aria-label' })\n override ariaLabel: string | null = null;\n\n // ─── Form API ───\n\n /** Returns the associated form element, if any. */\n get form(): HTMLFormElement | null {\n return this._internals.form;\n }\n\n // ─── Event Handling ───\n\n /** @private */\n private _handleClick(e: MouseEvent): void {\n if (this.disabled || this.loading) {\n e.preventDefault();\n e.stopPropagation();\n return;\n }\n\n /**\n * Dispatched when the button is clicked.\n * @event hx-click\n */\n this.dispatchEvent(\n new CustomEvent('hx-click', {\n bubbles: true,\n composed: true,\n detail: { originalEvent: e },\n }),\n );\n\n // Handle form submission/reset if form-associated and not in anchor mode\n if (this.href === undefined && this.type === 'submit' && this._internals.form) {\n if (this.name !== undefined && this.value !== undefined) {\n this._internals.setFormValue(this.value);\n }\n this._internals.form.requestSubmit();\n } else if (this.href === undefined && this.type === 'reset' && this._internals.form) {\n this._internals.form.reset();\n }\n }\n\n // ─── Render Helpers ───\n\n /** @private */\n private _renderSpinner(): TemplateResult {\n return html`\n <svg\n class=\"button__spinner\"\n part=\"spinner\"\n aria-hidden=\"true\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n >\n <circle\n class=\"button__spinner-track\"\n cx=\"12\"\n cy=\"12\"\n r=\"10\"\n stroke=\"currentColor\"\n stroke-width=\"3\"\n opacity=\"0.3\"\n />\n <path\n class=\"button__spinner-arc\"\n d=\"M12 2a10 10 0 0 1 10 10\"\n stroke=\"currentColor\"\n stroke-width=\"3\"\n stroke-linecap=\"round\"\n />\n </svg>\n `;\n }\n\n /** @private */\n private _renderInner(): TemplateResult {\n return html`\n ${this.loading ? this._renderSpinner() : nothing}\n <span part=\"prefix\" class=\"button__prefix\">\n <slot name=\"prefix\"></slot>\n </span>\n <span part=\"label\" class=\"button__label\">\n <slot></slot>\n </span>\n <span part=\"suffix\" class=\"button__suffix\">\n <slot name=\"suffix\"></slot>\n </span>\n `;\n }\n\n // ─── Render ───\n\n override render() {\n const classes = {\n button: true,\n [`button--${this.variant}`]: true,\n [`button--${this.size}`]: true,\n 'button--loading': this.loading,\n };\n\n if (this.href !== undefined) {\n return html`\n <a\n part=\"button\"\n class=${classMap(classes)}\n href=${this.disabled || this.loading ? nothing : ifDefined(this.href)}\n target=${ifDefined(this.target)}\n rel=${this.target === '_blank' ? 'noopener noreferrer' : nothing}\n aria-label=${this.ariaLabel ?? nothing}\n aria-disabled=${this.disabled ? 'true' : nothing}\n aria-busy=${this.loading ? 'true' : nothing}\n @click=${this._handleClick}\n >\n ${this._renderInner()}\n </a>\n `;\n }\n\n return html`\n <button\n part=\"button\"\n class=${classMap(classes)}\n ?disabled=${this.disabled}\n type=${this.type}\n aria-label=${this.ariaLabel ?? nothing}\n aria-busy=${this.loading ? 'true' : nothing}\n @click=${this._handleClick}\n >\n ${this._renderInner()}\n </button>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-button': HelixButton;\n }\n}\n"],"names":["helixButtonStyles","css","HelixButton","LitElement","e","html","nothing","classes","classMap","ifDefined","tokenStyles","__decorateClass","property","customElement"],"mappings":"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"}

package/dist/shared/hx-checkbox-group-CIIijwmc.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"hx-checkbox-group-CIIijwmc.js","sources":["../../src/components/hx-checkbox-group/hx-checkbox-group.styles.ts","../../src/components/hx-checkbox-group/hx-checkbox-group.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixCheckboxGroupStyles = css`\n :host {\n display: block;\n }\n\n :host([disabled]) {\n opacity: var(--hx-opacity-disabled);\n cursor: not-allowed;\n }\n\n * {\n box-sizing: border-box;\n }\n\n /* ─── Fieldset ─── */\n\n .fieldset {\n border: none;\n margin: 0;\n padding: 0;\n display: flex;\n flex-direction: column;\n gap: var(--hx-space-2);\n font-family: var(--hx-font-family-sans);\n }\n\n /* ─── Legend ─── */\n\n .fieldset__legend {\n display: flex;\n align-items: baseline;\n gap: var(--hx-space-1);\n font-size: var(--hx-font-size-sm);\n font-weight: var(--hx-font-weight-medium);\n color: var(--hx-checkbox-group-label-color, var(--hx-color-neutral-700));\n line-height: var(--hx-line-height-normal);\n padding: 0;\n margin-bottom: var(--hx-space-1);\n }\n\n .fieldset__required-marker {\n color: var(--hx-checkbox-group-error-color, var(--hx-color-error-500, #dc3545));\n font-weight: var(--hx-font-weight-bold);\n }\n\n /* ─── Items Container ─── */\n\n .fieldset__items {\n display: flex;\n flex-direction: column;\n gap: var(--hx-checkbox-group-gap, var(--hx-space-3));\n }\n\n :host([orientation='horizontal']) .fieldset__items {\n flex-direction: row;\n flex-wrap: wrap;\n }\n\n /* ─── Error State ─── */\n\n .fieldset--error .fieldset__legend {\n color: var(--hx-checkbox-group-error-color, var(--hx-color-error-500, #dc3545));\n }\n\n /* ─── Help Text & Error Messages ─── */\n\n .fieldset__help-text {\n font-size: var(--hx-font-size-xs);\n color: var(--hx-checkbox-group-help-text-color, var(--hx-color-neutral-500));\n line-height: var(--hx-line-height-normal);\n }\n\n .fieldset__error {\n font-size: var(--hx-font-size-xs);\n color: var(--hx-checkbox-group-error-color, var(--hx-color-error-500, #dc3545));\n line-height: var(--hx-line-height-normal);\n }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixCheckboxGroupStyles } from './hx-checkbox-group.styles.js';\nimport type { HelixCheckbox } from '../hx-checkbox/hx-checkbox.js';\n\n/** Monotonic counter for stable, SSR-safe IDs. */\nlet _uid = 0;\n\n/**\n * A form-associated checkbox group that manages a set of `<hx-checkbox>` children.\n *\n * @summary Form-associated checkbox group with label, validation, help text, and multi-value form submission.\n *\n * @tag hx-checkbox-group\n *\n * @slot - `<hx-checkbox>` elements.\n * @slot label - Rich HTML group label (overrides the label property when used).\n * @slot error - Custom error content (overrides the error property).\n * @slot help - Group-level help text.\n *\n * @fires {CustomEvent<{values: string[]}>} hx-change - Dispatched when any child checkbox changes.\n *\n * @csspart group - The fieldset wrapper.\n * @csspart label - The legend/label.\n * @csspart help-text - The help text container.\n * @csspart error-message - The error message container.\n *\n * @cssprop [--hx-checkbox-group-gap=var(--hx-space-3, 0.75rem)] - Gap between checkbox items.\n * @cssprop [--hx-checkbox-group-label-color=var(--hx-color-neutral-700, #343a40)] - Label text color.\n * @cssprop [--hx-checkbox-group-error-color=var(--hx-color-error-500, #dc3545)] - Error message color.\n * @cssprop [--hx-checkbox-group-help-text-color=var(--hx-color-neutral-500)] - Help text color.\n *\n * @drupal\n * Form-associated; render via Twig:\n * ```twig\n * <hx-checkbox-group name=\"{{ field_name }}\" label=\"{{ label }}\"{{ required ? ' required' : '' }}>\n * {% for option in options %}\n * <hx-checkbox value=\"{{ option.value }}\" label=\"{{ option.label }}\"></hx-checkbox>\n * {% endfor %}\n * </hx-checkbox-group>\n * ```\n * The `name` attribute propagates automatically to child checkboxes — no Drupal behavior required.\n */\n@customElement('hx-checkbox-group')\nexport class HelixCheckboxGroup extends LitElement {\n static override styles = [tokenStyles, helixCheckboxGroupStyles];\n\n // ─── Form Association ───\n\n static formAssociated = true;\n\n private _internals: ElementInternals;\n\n constructor() {\n super();\n this._internals = this.attachInternals();\n }\n\n // ─── Properties ───\n\n /**\n * The name used for form submission. Passed to child `hx-checkbox` elements.\n * @attr name\n */\n @property({ type: String })\n name = '';\n\n /**\n * The fieldset legend/label text.\n * @attr label\n */\n @property({ type: String })\n label = '';\n\n /**\n * Whether at least one checkbox must be checked for form submission.\n * @attr required\n */\n @property({ type: Boolean, reflect: true })\n required = false;\n\n /**\n * Whether the entire group 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 group enters an error state.\n * @attr error\n */\n @property({ type: String })\n error = '';\n\n /**\n * Layout orientation of the checkbox items.\n * @attr orientation\n */\n @property({ type: String, reflect: true })\n orientation: 'vertical' | 'horizontal' = 'vertical';\n\n @state() private _hasErrorSlot = false;\n @state() private _hasHelpSlot = false;\n\n // ─── Internal IDs ───\n\n private _groupId = `hx-checkbox-group-${++_uid}`;\n private _helpTextId = `${this._groupId}-help`;\n private _errorId = `${this._groupId}-error`;\n\n // ─── Slot Handlers ───\n\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 private _handleHelpSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasHelpSlot = slot.assignedNodes({ flatten: true }).length > 0;\n }\n\n // ─── Lifecycle ───\n\n override connectedCallback(): void {\n super.connectedCallback();\n this.addEventListener('hx-change', this._handleCheckboxChange as EventListener);\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.removeEventListener('hx-change', this._handleCheckboxChange as EventListener);\n }\n\n override updated(changedProperties: Map<string, unknown>): void {\n super.updated(changedProperties);\n if (changedProperties.has('disabled')) {\n this._syncCheckboxes();\n }\n if (changedProperties.has('name')) {\n this._syncCheckboxNames();\n }\n if (changedProperties.has('required')) {\n this._updateValidity();\n }\n }\n\n override firstUpdated(changedProperties: Map<string, unknown>): void {\n super.firstUpdated(changedProperties);\n this._syncCheckboxes();\n this._syncCheckboxNames();\n const checkedValues = this._getCheckedValues();\n this._updateFormValue(checkedValues);\n this._updateValidity(checkedValues);\n }\n\n // ─── Checkbox Management ───\n\n private _getCheckboxes(): HelixCheckbox[] {\n return Array.from(this.children).filter((c): c is HelixCheckbox => c.tagName === 'HX-CHECKBOX');\n }\n\n private _getCheckedValues(): string[] {\n return this._getCheckboxes()\n .filter((cb) => cb.checked)\n .map((cb) => cb.value);\n }\n\n private _syncCheckboxes(): void {\n const checkboxes = this._getCheckboxes();\n checkboxes.forEach((cb) => {\n cb.disabled = this.disabled;\n });\n }\n\n private _syncCheckboxNames(): void {\n if (!this.name) return;\n const checkboxes = this._getCheckboxes();\n checkboxes.forEach((cb) => {\n cb.name = this.name;\n });\n }\n\n // ─── Event Handling ───\n\n private _handleCheckboxChange = (e: CustomEvent<{ checked: boolean; value: string }>): void => {\n // Only intercept events from direct hx-checkbox children — do not re-intercept\n // the hx-change we dispatch ourselves from this element.\n if (e.target === this) return;\n\n e.stopImmediatePropagation();\n\n const values = this._getCheckedValues();\n this._updateFormValue(values);\n this._updateValidity(values);\n\n /**\n * Dispatched when any child checkbox changes.\n * @event hx-change\n */\n this.dispatchEvent(\n new CustomEvent('hx-change', {\n bubbles: true,\n composed: true,\n detail: { values },\n }),\n );\n };\n\n private _handleSlotChange(): void {\n this._syncCheckboxes();\n this._syncCheckboxNames();\n const checkedValues = this._getCheckedValues();\n this._updateFormValue(checkedValues);\n this._updateValidity(checkedValues);\n }\n\n // ─── Form Integration ───\n\n private _updateFormValue(values: string[]): void {\n if (values.length === 0) {\n this._internals.setFormValue(null);\n return;\n }\n const formData = new FormData();\n values.forEach((v) => formData.append(this.name, v));\n this._internals.setFormValue(formData);\n }\n\n private _updateValidity(values?: string[]): void {\n const checkedValues = values ?? this._getCheckedValues();\n if (this.required && checkedValues.length === 0) {\n const firstCheckbox = this._getCheckboxes()[0];\n this._internals.setValidity(\n { valueMissing: true },\n this.error || 'Please select at least one option.',\n firstCheckbox,\n );\n } else {\n this._internals.setValidity({});\n }\n }\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 group 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 /** Called by the form when it resets. */\n formResetCallback(): void {\n const checkboxes = this._getCheckboxes();\n checkboxes.forEach((cb) => {\n cb.checked = false;\n });\n this._internals.setFormValue(null);\n this._updateValidity([]);\n }\n\n /** Called when the form restores state (e.g., back/forward navigation). */\n formStateRestoreCallback(state: string | File | FormData): void {\n if (!(state instanceof FormData)) return;\n const restoredValues = state.getAll(this.name).map((v) => String(v));\n const checkboxes = this._getCheckboxes();\n checkboxes.forEach((cb) => {\n cb.checked = restoredValues.includes(cb.value);\n });\n this._updateFormValue(restoredValues);\n this._updateValidity(restoredValues);\n }\n\n // ─── Render ───\n\n override render() {\n const hasError = !!this.error || this._hasErrorSlot;\n\n const fieldsetClasses = {\n fieldset: true,\n 'fieldset--error': hasError,\n 'fieldset--disabled': this.disabled,\n 'fieldset--required': this.required,\n };\n\n const describedBy =\n [hasError ? this._errorId : null, this._hasHelpSlot ? this._helpTextId : null]\n .filter(Boolean)\n .join(' ') || undefined;\n\n return html`\n <fieldset\n part=\"group\"\n class=${classMap(fieldsetClasses)}\n aria-describedby=${describedBy ?? nothing}\n >\n <legend part=\"label\" class=\"fieldset__legend\">\n <slot name=\"label\">${this.label}</slot>\n ${this.required\n ? html`<span class=\"fieldset__required-marker\" aria-hidden=\"true\">*</span>`\n : nothing}\n </legend>\n\n <div class=\"fieldset__items\">\n <slot @slotchange=${this._handleSlotChange}></slot>\n </div>\n\n ${hasError\n ? html`<div part=\"error-message\" class=\"fieldset__error\" id=${this._errorId} role=\"alert\">\n <slot name=\"error\" @slotchange=${this._handleErrorSlotChange}> ${this.error} </slot>\n </div>`\n : html`<slot name=\"error\" @slotchange=${this._handleErrorSlotChange}></slot>`}\n\n <div part=\"help-text\" class=\"fieldset__help-text\" id=${this._helpTextId}>\n <slot name=\"help\" @slotchange=${this._handleHelpSlotChange}></slot>\n </div>\n </fieldset>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-checkbox-group': HelixCheckboxGroup;\n }\n}\n"],"names":["helixCheckboxGroupStyles","css","_uid","HelixCheckboxGroup","LitElement","values","slot","changedProperties","checkedValues","c","cb","formData","v","firstCheckbox","state","restoredValues","hasError","fieldsetClasses","describedBy","html","classMap","nothing","tokenStyles","__decorateClass","property","customElement"],"mappings":"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"}

package/dist/shared/hx-container-BXZBaOGG.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"hx-container-BXZBaOGG.js","sources":["../../src/components/hx-container/hx-container.styles.ts","../../src/components/hx-container/hx-container.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixContainerStyles = css`\n :host {\n display: block;\n width: 100%;\n background-color: var(--hx-container-bg, transparent);\n box-sizing: border-box;\n }\n\n /* ─── Vertical Padding Variants ─── */\n\n /* Defensive reset: ensures zero vertical padding even if a future base rule adds it */\n :host([padding='none']) {\n padding-top: 0;\n padding-bottom: 0;\n }\n\n :host([padding='sm']) {\n padding-top: var(--hx-space-6, 1.5rem);\n padding-bottom: var(--hx-space-6, 1.5rem);\n }\n\n :host([padding='md']) {\n padding-top: var(--hx-space-12, 3rem);\n padding-bottom: var(--hx-space-12, 3rem);\n }\n\n :host([padding='lg']) {\n padding-top: var(--hx-space-16, 4rem);\n padding-bottom: var(--hx-space-16, 4rem);\n }\n\n :host([padding='xl']) {\n padding-top: var(--hx-space-24, 6rem);\n padding-bottom: var(--hx-space-24, 6rem);\n }\n\n :host([padding='2xl']) {\n padding-top: var(--hx-space-32, 8rem);\n padding-bottom: var(--hx-space-32, 8rem);\n }\n\n /* ─── Inner Container ─── */\n\n .container__inner {\n margin-left: auto;\n margin-right: auto;\n padding-left: var(--hx-container-gutter, var(--hx-space-6, 1.5rem));\n padding-right: var(--hx-container-gutter, var(--hx-space-6, 1.5rem));\n box-sizing: border-box;\n width: 100%;\n }\n\n /* ─── Width Variants ─── */\n\n .container__inner--full {\n max-width: none;\n }\n\n .container__inner--content {\n max-width: var(--hx-container-max-width, var(--hx-container-content, 1152px));\n }\n\n .container__inner--narrow {\n max-width: var(--hx-container-max-width, var(--hx-container-narrow, 768px));\n }\n\n .container__inner--sm {\n max-width: var(--hx-container-max-width, var(--hx-container-sm, 640px));\n }\n\n .container__inner--md {\n max-width: var(--hx-container-max-width, var(--hx-container-md, 768px));\n }\n\n .container__inner--lg {\n max-width: var(--hx-container-max-width, var(--hx-container-lg, 1024px));\n }\n\n .container__inner--xl {\n max-width: var(--hx-container-max-width, var(--hx-container-xl, 1280px));\n }\n`;\n","import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixContainerStyles } from './hx-container.styles.js';\n\n/**\n * A layout container that constrains content width and provides\n * consistent vertical spacing and horizontal gutters.\n *\n * Uses a two-layer model: the outer host spans full width (background,\n * vertical padding), while the inner wrapper constrains max-width,\n * centers content, and applies horizontal gutters.\n *\n * @summary Layout primitive for constraining content width with consistent spacing.\n *\n * @tag hx-container\n *\n * @slot - Default slot for container content.\n *\n * @csspart inner - The inner wrapper that constrains max-width and applies gutters.\n *\n * @cssprop [--hx-container-bg=transparent] - Background color on the outer wrapper.\n * @cssprop [--hx-container-gutter=var(--hx-space-6)] - Horizontal padding on the inner box.\n * @cssprop [--hx-container-max-width] - Override the max-width set by the width property.\n * @cssprop [--hx-container-content=72rem] - Max-width for the content width preset.\n * @cssprop [--hx-container-narrow=48rem] - Max-width for the narrow width preset.\n * @cssprop [--hx-container-sm=640px] - Max-width for the sm width preset.\n * @cssprop [--hx-container-md=768px] - Max-width for the md width preset.\n * @cssprop [--hx-container-lg=1024px] - Max-width for the lg width preset.\n * @cssprop [--hx-container-xl=1280px] - Max-width for the xl width preset.\n */\n@customElement('hx-container')\nexport class HelixContainer extends LitElement {\n static override styles = [tokenStyles, helixContainerStyles];\n\n /**\n * Controls the max-width of the inner content wrapper.\n * @attr width\n * @example\n * // Width presets and their default max-width values:\n * // full → no max-width constraint\n * // content → 72rem (1152px)\n * // narrow → 48rem (768px) — override with --hx-container-narrow\n * // sm → 640px — override with --hx-container-sm\n * // md → 768px — override with --hx-container-md\n * // lg → 1024px — override with --hx-container-lg\n * // xl → 1280px — override with --hx-container-xl\n */\n @property({ type: String, reflect: true })\n width: 'full' | 'content' | 'narrow' | 'sm' | 'md' | 'lg' | 'xl' = 'content';\n\n /**\n * Vertical padding applied to the outer wrapper.\n * @attr padding\n */\n @property({ type: String, reflect: true })\n padding: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' = 'none';\n\n // ─── Render ───\n\n override render() {\n const classes = {\n container__inner: true,\n [`container__inner--${this.width}`]: true,\n };\n\n return html`\n <div part=\"inner\" class=${classMap(classes)}>\n <slot></slot>\n </div>\n `;\n }\n}\n\n/** @deprecated Use `HelixContainer` directly. Alias kept for backward compatibility. */\nexport type WcContainer = HelixContainer;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-container': HelixContainer;\n }\n}\n"],"names":["helixContainerStyles","css","HelixContainer","LitElement","classes","html","classMap","tokenStyles","__decorateClass","property","customElement"],"mappings":";;;;AAEO,MAAMA,IAAuBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;AC+B7B,IAAMC,IAAN,cAA6BC,EAAW;AAAA,EAAxC,cAAA;AAAA,UAAA,GAAA,SAAA,GAiBL,KAAA,QAAmE,WAOnE,KAAA,UAAsD;AAAA,EAAA;AAAA;AAAA,EAI7C,SAAS;AAChB,UAAMC,IAAU;AAAA,MACd,kBAAkB;AAAA,MAClB,CAAC,qBAAqB,KAAK,KAAK,EAAE,GAAG;AAAA,IAAA;AAGvC,WAAOC;AAAA,gCACqBC,EAASF,CAAO,CAAC;AAAA;AAAA;AAAA;AAAA,EAI/C;AACF;AAxCaF,EACK,SAAS,CAACK,GAAaP,CAAoB;AAgB3DQ,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAhB9BP,EAiBX,WAAA,SAAA,CAAA;AAOAM,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAvB9BP,EAwBX,WAAA,WAAA,CAAA;AAxBWA,IAANM,EAAA;AAAA,EADNE,EAAc,cAAc;AAAA,GAChBR,CAAA;"}

package/dist/shared/hx-drawer-CenIAGuR.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"hx-drawer-CenIAGuR.js","sources":["../../src/components/hx-drawer/hx-drawer.styles.ts","../../src/components/hx-drawer/hx-drawer.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixDrawerStyles = css`\n /* P2-03: Explicit [hidden] rule to survive CSS resets that may override the UA stylesheet. */\n [hidden] {\n display: none !important;\n }\n\n :host {\n display: contents;\n }\n\n :host([contained]) {\n display: block;\n position: relative;\n overflow: hidden;\n }\n\n /* ─── Overlay ─── */\n\n .drawer-overlay {\n position: fixed;\n inset: 0;\n z-index: var(--hx-z-index-modal, 400);\n display: flex;\n pointer-events: none;\n visibility: hidden;\n }\n\n :host([contained]) .drawer-overlay {\n position: absolute;\n }\n\n .drawer-overlay.is-open {\n pointer-events: auto;\n visibility: visible;\n }\n\n /* ─── Backdrop ─── */\n\n .drawer-backdrop {\n position: absolute;\n inset: 0;\n background-color: var(--hx-drawer-backdrop-color, var(--hx-color-neutral-900));\n opacity: 0;\n transition: opacity var(--hx-duration-300, 300ms) var(--hx-ease-out, ease-out);\n }\n\n .drawer-overlay.is-open .drawer-backdrop {\n opacity: var(--hx-drawer-backdrop-opacity, 0.5);\n }\n\n @media (prefers-reduced-motion: reduce) {\n .drawer-backdrop {\n transition: none;\n }\n }\n\n /* ─── Panel ─── */\n\n .drawer-panel {\n position: absolute;\n display: flex;\n flex-direction: column;\n background-color: var(--hx-drawer-bg, var(--hx-color-neutral-0));\n color: var(--hx-drawer-color, var(--hx-color-neutral-900));\n box-shadow: var(--hx-drawer-shadow, var(--hx-shadow-xl));\n overflow: hidden;\n outline: none;\n z-index: 1;\n transition:\n transform var(--hx-duration-300, 300ms) var(--hx-ease-out, ease-out),\n opacity var(--hx-duration-300, 300ms) var(--hx-ease-out, ease-out);\n opacity: 0;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .drawer-panel {\n transition: none;\n }\n }\n\n /* ─── Placement: end (default — right) ─── */\n\n :host([placement='end']) .drawer-panel,\n :host(:not([placement])) .drawer-panel {\n top: 0;\n right: 0;\n bottom: 0;\n width: var(--_drawer-size, var(--hx-drawer-size-md, 30rem));\n max-width: 100%;\n transform: translateX(100%);\n }\n\n :host([placement='end']) .drawer-overlay.is-open .drawer-panel,\n :host(:not([placement])) .drawer-overlay.is-open .drawer-panel {\n transform: translateX(0);\n opacity: 1;\n }\n\n /* ─── Placement: start (left) ─── */\n\n :host([placement='start']) .drawer-panel {\n top: 0;\n left: 0;\n bottom: 0;\n width: var(--_drawer-size, var(--hx-drawer-size-md, 30rem));\n max-width: 100%;\n transform: translateX(-100%);\n }\n\n :host([placement='start']) .drawer-overlay.is-open .drawer-panel {\n transform: translateX(0);\n opacity: 1;\n }\n\n /* ─── Placement: top ─── */\n\n :host([placement='top']) .drawer-panel {\n top: 0;\n left: 0;\n right: 0;\n height: var(--_drawer-size, var(--hx-drawer-size-md, 30rem));\n max-height: 100%;\n width: 100%;\n transform: translateY(-100%);\n }\n\n :host([placement='top']) .drawer-overlay.is-open .drawer-panel {\n transform: translateY(0);\n opacity: 1;\n }\n\n /* ─── Placement: bottom ─── */\n\n :host([placement='bottom']) .drawer-panel {\n bottom: 0;\n left: 0;\n right: 0;\n height: var(--_drawer-size, var(--hx-drawer-size-md, 30rem));\n max-height: 100%;\n width: 100%;\n transform: translateY(100%);\n }\n\n :host([placement='bottom']) .drawer-overlay.is-open .drawer-panel {\n transform: translateY(0);\n opacity: 1;\n }\n\n /* ─── Header ─── */\n\n .drawer-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--hx-spacing-4, 1rem);\n padding: var(\n --hx-drawer-header-padding,\n var(--hx-spacing-5, 1.25rem) var(--hx-spacing-6, 1.5rem)\n );\n border-bottom: var(--hx-border-width-1, 1px) solid\n var(--hx-drawer-header-border-color, var(--hx-color-neutral-200));\n flex-shrink: 0;\n }\n\n .drawer-title {\n margin: 0;\n flex: 1 1 auto;\n font-family: var(--hx-font-family-sans);\n font-size: var(--hx-font-size-lg);\n font-weight: var(--hx-font-weight-semibold);\n line-height: var(--hx-line-height-snug);\n color: var(--hx-drawer-title-color, var(--hx-color-neutral-900));\n }\n\n .drawer-header-actions {\n display: flex;\n align-items: center;\n gap: var(--hx-spacing-2, 0.5rem);\n flex-shrink: 0;\n }\n\n .drawer-close-button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 2rem;\n height: 2rem;\n padding: 0;\n border: none;\n border-radius: var(--hx-border-radius-md, 0.375rem);\n background: transparent;\n color: var(--hx-color-neutral-500);\n cursor: pointer;\n flex-shrink: 0;\n transition: background-color var(--hx-duration-100, 100ms) ease;\n }\n\n .drawer-close-button:hover {\n background-color: var(--hx-color-neutral-100);\n color: var(--hx-color-neutral-900);\n }\n\n .drawer-close-button:focus-visible {\n outline: 2px solid var(--hx-color-primary-600);\n outline-offset: 2px;\n }\n\n /* ─── Body ─── */\n\n .drawer-body {\n flex: 1 1 auto;\n padding: var(--hx-drawer-body-padding, var(--hx-spacing-6, 1.5rem));\n overflow-y: auto;\n overscroll-behavior: contain;\n }\n\n /* ─── Footer ─── */\n\n .drawer-footer {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: var(--hx-spacing-3, 0.75rem);\n padding: var(--hx-drawer-footer-padding, var(--hx-spacing-4, 1rem) var(--hx-spacing-6, 1.5rem));\n border-top: var(--hx-border-width-1, 1px) solid\n var(--hx-drawer-footer-border-color, var(--hx-color-neutral-200));\n flex-shrink: 0;\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 { ifDefined } from 'lit/directives/if-defined.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixDrawerStyles } from './hx-drawer.styles.js';\n\n// Module-level counter for stable, SSR-safe IDs (avoids Math.random() hydration mismatch)\nlet _hxDrawerIdCounter = 0;\n\ntype DrawerPlacement = 'start' | 'end' | 'top' | 'bottom';\ntype DrawerSizePreset = 'sm' | 'md' | 'lg' | 'full';\ntype DrawerSize = DrawerSizePreset | (string & Record<never, never>);\n\nconst DRAWER_SIZE_MAP: Record<DrawerSizePreset, string> = {\n sm: '20rem',\n md: '30rem',\n lg: '40rem',\n full: '100%',\n};\n\nconst FOCUSABLE_SELECTORS = [\n 'a[href]',\n 'area[href]',\n 'button:not([disabled])',\n 'input:not([disabled])',\n 'select:not([disabled])',\n 'textarea:not([disabled])',\n '[tabindex]:not([tabindex=\"-1\"])',\n 'details > summary',\n].join(',');\n\n/**\n * A slide-in drawer panel that can appear from any edge of the viewport.\n * Supports focus trapping, overlay backdrop, keyboard navigation, and full\n * ARIA labelling for enterprise healthcare accessibility requirements.\n *\n * @summary Slide-in panel overlay from any viewport edge.\n *\n * @tag hx-drawer\n *\n * @slot label - The drawer title text.\n * @slot header-actions - Action buttons displayed in the header near the close button.\n * @slot - Default slot for the drawer body content.\n * @slot footer - Action buttons or footer content.\n *\n * @fires {CustomEvent<void>} hx-show - Fired when the drawer begins to open.\n * @fires {CustomEvent<void>} hx-after-show - Fired after the drawer open animation completes.\n * @fires {CustomEvent<void>} hx-hide - Fired when the drawer begins to close.\n * @fires {CustomEvent<void>} hx-after-hide - Fired after the drawer close animation completes.\n * @fires {CustomEvent<void>} hx-initial-focus - Fired when initial focus is set inside the drawer. Cancelable to override focus behavior.\n *\n * @csspart overlay - The full-screen overlay container (includes backdrop and panel).\n * @csspart panel - The drawer panel itself.\n * @csspart header - The header region containing the title and actions.\n * @csspart title - The drawer title element.\n * @csspart close-button - The built-in close button.\n * @csspart body - The scrollable body region.\n * @csspart footer - The footer region.\n *\n * @attr [label] - Accessible label for the dialog when no visible label slot is provided.\n *\n * @cssprop [--hx-drawer-bg=var(--hx-color-neutral-0)] - Drawer panel background color.\n * @cssprop [--hx-drawer-color=var(--hx-color-neutral-900)] - Drawer panel text color.\n * @cssprop [--hx-drawer-shadow=var(--hx-shadow-xl)] - Drawer panel box shadow.\n * @cssprop [--hx-drawer-backdrop-color=var(--hx-color-neutral-900)] - Backdrop color.\n * @cssprop [--hx-drawer-backdrop-opacity=0.5] - Backdrop opacity.\n * @cssprop [--hx-drawer-header-padding] - Padding inside the header.\n * @cssprop [--hx-drawer-header-border-color=var(--hx-color-neutral-200)] - Header border color.\n * @cssprop [--hx-drawer-title-color=var(--hx-color-neutral-900)] - Title text color.\n * @cssprop [--hx-drawer-body-padding] - Padding inside the body.\n * @cssprop [--hx-drawer-footer-padding] - Padding inside the footer.\n * @cssprop [--hx-drawer-footer-border-color=var(--hx-color-neutral-200)] - Footer border color.\n */\n@customElement('hx-drawer')\nexport class HelixDrawer extends LitElement {\n static override styles = [tokenStyles, helixDrawerStyles];\n\n // ─── Queries ───\n\n @query('.drawer-overlay')\n private _overlayEl!: HTMLElement | null;\n\n @query('.drawer-panel')\n private _panelEl!: HTMLElement | null;\n\n // ─── Internal state ───\n\n @state()\n private _isOpen = false;\n\n @state()\n private _hasHeaderActionsSlot = false;\n\n @state()\n private _hasFooterSlot = false;\n\n @state()\n private _hasLabelSlot = false;\n\n private _cachedFocusableElements: HTMLElement[] = [];\n private _triggerElement: HTMLElement | null = null;\n private _animationTimeout: ReturnType<typeof setTimeout> | null = null;\n private _previousBodyOverflow: string | null = null;\n private _siblingAriaHiddenElements: Element[] = [];\n\n private readonly _titleId = `hx-drawer-title-${++_hxDrawerIdCounter}`;\n\n // ─── Public Properties ───\n\n /**\n * Controls whether the drawer is open.\n * @attr open\n */\n @property({ type: Boolean, reflect: true })\n open = false;\n\n /**\n * Which edge of the viewport the drawer slides in from.\n * @attr placement\n */\n @property({ type: String, reflect: true })\n placement: DrawerPlacement = 'end';\n\n /**\n * The size of the drawer panel. Use 'sm', 'md', 'lg', 'full', or any valid CSS length.\n * @attr size\n */\n @property({ type: String, reflect: true })\n size: DrawerSize = 'md';\n\n /**\n * When true, the drawer is constrained to its positioned parent instead of the viewport.\n * The host element must have `position: relative` (or the library handles it via :host).\n * @attr contained\n */\n @property({ type: Boolean, reflect: true })\n contained = false;\n\n /**\n * When true, the header (title, header-actions, close button) is hidden.\n * @attr no-header\n */\n @property({ type: Boolean, reflect: true, attribute: 'no-header' })\n noHeader = false;\n\n /**\n * When true, the footer slot is hidden.\n * @attr no-footer\n */\n @property({ type: Boolean, reflect: true, attribute: 'no-footer' })\n noFooter = false;\n\n /**\n * Accessible label for the dialog when the `label` slot is not populated.\n * When the `label` slot is used, `aria-labelledby` takes precedence.\n * @attr label\n */\n @property({ type: String })\n label = '';\n\n // ─── Lifecycle ───\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this._removeListeners();\n if (this._animationTimeout !== null) {\n clearTimeout(this._animationTimeout);\n }\n this._restoreBodyScroll();\n }\n\n override updated(changedProperties: Map<string, unknown>): void {\n super.updated(changedProperties);\n\n if (changedProperties.has('open')) {\n if (this.open) {\n this._openDrawer();\n } else {\n this._closeDrawer();\n }\n }\n\n if (changedProperties.has('size')) {\n this._applySizeVar();\n }\n }\n\n // ─── Public Methods ───\n\n /** Opens the drawer. */\n show(): void {\n this.open = true;\n }\n\n /** Closes the drawer. */\n hide(): void {\n this.open = false;\n }\n\n // ─── Private: Size CSS variable ───\n\n private _applySizeVar(): void {\n const resolvedSize = DRAWER_SIZE_MAP[this.size as DrawerSizePreset] ?? this.size;\n this.style.setProperty('--_drawer-size', resolvedSize);\n }\n\n // ─── Private: Open / Close ───\n\n private _lockBodyScroll(): void {\n if (this.contained) return;\n this._previousBodyOverflow = document.body.style.overflow;\n document.body.style.overflow = 'hidden';\n }\n\n private _restoreBodyScroll(): void {\n if (this._previousBodyOverflow === null) return;\n document.body.style.overflow = this._previousBodyOverflow;\n this._previousBodyOverflow = null;\n }\n\n private _openDrawer(): void {\n // Capture trigger for focus restoration (P2-04: use instanceof guard)\n const active = document.activeElement;\n this._triggerElement = active instanceof HTMLElement ? active : null;\n\n // P1-05: clear any pending animation timeout before scheduling a new one\n if (this._animationTimeout !== null) {\n clearTimeout(this._animationTimeout);\n this._animationTimeout = null;\n }\n\n this._applySizeVar();\n this._lockBodyScroll();\n this._hideBackgroundFromScreenReaders();\n\n // Dispatch hx-show before visual update\n this.dispatchEvent(new CustomEvent('hx-show', { bubbles: true, composed: true }));\n\n // Transition to open state\n void this.updateComplete\n .then(() => {\n this._isOpen = true;\n this._addListeners();\n\n // Set initial focus after next render\n return this.updateComplete;\n })\n .then(() => {\n this._cachedFocusableElements = this._getFocusableElements();\n this._setInitialFocus();\n\n // Dispatch hx-after-show after animation duration\n const duration = this._getAnimationDuration();\n this._animationTimeout = setTimeout(() => {\n this.dispatchEvent(new CustomEvent('hx-after-show', { bubbles: true, composed: true }));\n }, duration);\n })\n .catch(console.error);\n }\n\n private _closeDrawer(): void {\n // P1-05: clear any pending animation timeout before scheduling a new one\n if (this._animationTimeout !== null) {\n clearTimeout(this._animationTimeout);\n this._animationTimeout = null;\n }\n\n this._isOpen = false;\n this._removeListeners();\n this._cachedFocusableElements = [];\n this._restoreBodyScroll();\n this._restoreBackgroundForScreenReaders();\n\n this.dispatchEvent(new CustomEvent('hx-hide', { bubbles: true, composed: true }));\n\n // Restore focus to the trigger\n const duration = this._getAnimationDuration();\n this._animationTimeout = setTimeout(() => {\n this.dispatchEvent(new CustomEvent('hx-after-hide', { bubbles: true, composed: true }));\n if (this._triggerElement && typeof this._triggerElement.focus === 'function') {\n this._triggerElement.focus();\n }\n this._triggerElement = null;\n }, duration);\n }\n\n private _getAnimationDuration(): number {\n if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) return 0;\n return 300;\n }\n\n // ─── Background aria-hidden management (P1-03) ───\n\n private _hideBackgroundFromScreenReaders(): void {\n if (this.contained) return;\n this._siblingAriaHiddenElements = [];\n Array.from(document.body.children).forEach((child) => {\n if (child === this || child.contains(this)) return;\n if (!child.hasAttribute('aria-hidden')) {\n child.setAttribute('aria-hidden', 'true');\n this._siblingAriaHiddenElements.push(child);\n }\n });\n }\n\n private _restoreBackgroundForScreenReaders(): void {\n this._siblingAriaHiddenElements.forEach((el) => {\n el.removeAttribute('aria-hidden');\n });\n this._siblingAriaHiddenElements = [];\n }\n\n // ─── Event Listeners (P1-01: use only document listener, not overlay) ───\n\n private _addListeners(): void {\n document.addEventListener('keydown', this._handleKeyDown);\n }\n\n private _removeListeners(): void {\n document.removeEventListener('keydown', this._handleKeyDown);\n }\n\n // ─── Keyboard Handler ───\n\n private _handleKeyDown = (e: KeyboardEvent): void => {\n if (!this._isOpen) return;\n\n if (e.key === 'Escape') {\n e.preventDefault();\n this.open = false;\n return;\n }\n\n if (e.key === 'Tab') {\n this._trapFocus(e);\n }\n };\n\n // ─── Focus ───\n\n private _setInitialFocus(): void {\n const event = new CustomEvent('hx-initial-focus', {\n bubbles: true,\n composed: true,\n cancelable: true,\n });\n this.dispatchEvent(event);\n\n if (!event.defaultPrevented) {\n const focusable = this._cachedFocusableElements;\n if (focusable.length > 0 && focusable[0]) {\n focusable[0].focus();\n } else {\n this._panelEl?.focus();\n }\n }\n }\n\n private _getFocusableElements(): HTMLElement[] {\n const shadowFocusable = Array.from(\n this.shadowRoot?.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTORS) ?? [],\n );\n\n const slots = this.shadowRoot?.querySelectorAll<HTMLSlotElement>('slot') ?? [];\n const lightFocusable: HTMLElement[] = [];\n\n slots.forEach((slot) => {\n slot.assignedElements({ flatten: true }).forEach((el) => {\n if (el instanceof HTMLElement) {\n if (el.matches(FOCUSABLE_SELECTORS)) {\n lightFocusable.push(el);\n }\n el.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTORS).forEach((child) => {\n lightFocusable.push(child);\n });\n }\n });\n });\n\n return [...shadowFocusable, ...lightFocusable].filter(\n (el) => !el.hasAttribute('disabled') && el.getAttribute('tabindex') !== '-1',\n );\n }\n\n private _trapFocus(e: KeyboardEvent): void {\n const focusable =\n this._cachedFocusableElements.length > 0\n ? this._cachedFocusableElements\n : this._getFocusableElements();\n\n if (focusable.length === 0) {\n e.preventDefault();\n return;\n }\n\n const [first, ...rest] = focusable;\n const last = rest.length > 0 ? rest[rest.length - 1] : first;\n\n if (!first || !last) return;\n\n // P1-02: Use document.activeElement for reliable detection of slotted (light DOM) elements.\n // shadowRoot.activeElement returns the <slot> host for slotted content, not the actual element.\n const active = document.activeElement as HTMLElement | null;\n\n if (e.shiftKey) {\n if (active === first) {\n e.preventDefault();\n last.focus();\n }\n } else {\n if (active === last) {\n e.preventDefault();\n first.focus();\n }\n }\n }\n\n // ─── Overlay Click ───\n\n private _handleOverlayClick = (e: MouseEvent): void => {\n // Only close when clicking the overlay itself (backdrop), not the panel\n const target = e.target as HTMLElement;\n if (target === this._overlayEl || target.classList.contains('drawer-backdrop')) {\n this.open = false;\n }\n };\n\n // ─── Slot change handlers ───\n\n private _handleHeaderActionsSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasHeaderActionsSlot = slot.assignedNodes({ flatten: true }).length > 0;\n }\n\n private _handleFooterSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasFooterSlot = slot.assignedNodes({ flatten: true }).length > 0;\n }\n\n private _handleLabelSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasLabelSlot = slot.assignedNodes({ flatten: true }).length > 0;\n }\n\n // ─── Render Helpers ───\n\n private _renderHeader() {\n if (this.noHeader) return nothing;\n\n return html`\n <div part=\"header\" class=\"drawer-header\">\n <p part=\"title\" id=${this._titleId} class=\"drawer-title\">\n <slot name=\"label\" @slotchange=${this._handleLabelSlotChange}></slot>\n </p>\n <div class=\"drawer-header-actions\">\n ${this._hasHeaderActionsSlot\n ? html`<slot\n name=\"header-actions\"\n @slotchange=${this._handleHeaderActionsSlotChange}\n ></slot>`\n : html`<slot\n name=\"header-actions\"\n @slotchange=${this._handleHeaderActionsSlotChange}\n style=\"display:none\"\n ></slot>`}\n <button\n part=\"close-button\"\n class=\"drawer-close-button\"\n aria-label=\"Close drawer\"\n @click=${() => {\n this.open = false;\n }}\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"></line>\n <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"></line>\n </svg>\n </button>\n </div>\n </div>\n `;\n }\n\n private _renderFooter() {\n if (this.noFooter) return nothing;\n\n return html`\n <div part=\"footer\" class=\"drawer-footer\" ?hidden=${!this._hasFooterSlot}>\n <slot name=\"footer\" @slotchange=${this._handleFooterSlotChange}></slot>\n </div>\n `;\n }\n\n // ─── Render ───\n\n override render() {\n const overlayClasses = {\n 'drawer-overlay': true,\n 'is-open': this._isOpen,\n };\n\n // P1-06: ensure the dialog always has an accessible name.\n // Priority: aria-labelledby (slot) > aria-label (prop) > aria-label (fallback \"Drawer\")\n const ariaLabelledby = this._hasLabelSlot ? this._titleId : undefined;\n const ariaLabel = !this._hasLabelSlot ? this.label || 'Drawer' : undefined;\n\n return html`\n <div\n part=\"overlay\"\n class=${classMap(overlayClasses)}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby=${ifDefined(ariaLabelledby)}\n aria-label=${ifDefined(ariaLabel)}\n tabindex=\"-1\"\n @click=${this._handleOverlayClick}\n >\n <div class=\"drawer-backdrop\" aria-hidden=\"true\"></div>\n <div part=\"panel\" class=\"drawer-panel\" tabindex=\"-1\" role=\"document\">\n ${this._renderHeader()}\n <div part=\"body\" class=\"drawer-body\">\n <slot></slot>\n </div>\n ${this._renderFooter()}\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-drawer': HelixDrawer;\n }\n}\n"],"names":["helixDrawerStyles","css","_hxDrawerIdCounter","DRAWER_SIZE_MAP","FOCUSABLE_SELECTORS","HelixDrawer","LitElement","target","changedProperties","resolvedSize","active","duration","child","el","event","focusable","_a","shadowFocusable","slots","_b","lightFocusable","slot","first","rest","last","nothing","html","overlayClasses","ariaLabelledby","ariaLabel","classMap","ifDefined","tokenStyles","__decorateClass","query","state","property","customElement"],"mappings":";;;;;AAEO,MAAMA,IAAoBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;ACMjC,IAAIC,IAAqB;AAMzB,MAAMC,IA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"}

package/dist/shared/hx-image-CzkOEeO4.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"hx-image-CzkOEeO4.js","sources":["../../src/components/hx-image/hx-image.styles.ts","../../src/components/hx-image/hx-image.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixImageStyles = css`\n :host {\n display: block;\n }\n\n .image__container {\n position: relative;\n display: block;\n overflow: hidden;\n margin: 0;\n padding: 0;\n aspect-ratio: var(--_ratio, var(--hx-image-aspect-ratio));\n border-radius: var(--_radius, var(--hx-image-border-radius, 0));\n }\n\n .image__container--error {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: var(--hx-image-fallback-min-height, 3rem);\n background-color: var(--hx-color-neutral-100, #f3f4f6);\n color: var(--hx-color-neutral-500, #6b7280);\n }\n\n .image__img {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: var(--_fit, var(--hx-image-object-fit, cover));\n }\n\n .image__caption {\n display: none;\n padding: var(--hx-image-caption-padding, 0.5rem 0 0);\n color: var(--hx-image-caption-color, var(--hx-color-neutral-600, #4b5563));\n font-size: var(--hx-image-caption-font-size, 0.875rem);\n }\n\n .image__caption--visible {\n display: block;\n }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixImageStyles } from './hx-image.styles.js';\n\n/**\n * An accessible image wrapper with lazy loading, fallback support, aspect ratio control,\n * responsive image (srcset/sizes) support, and optional caption.\n *\n * @summary Accessible image wrapper with lazy loading, fallback, srcset, and aspect ratio control.\n *\n * @tag hx-image\n *\n * @slot fallback - Custom content shown when the image fails to load and no fallback-src is set.\n * @slot caption - Optional caption content rendered in a figcaption element below the image.\n *\n * @csspart base - The inner img element.\n * @csspart caption - The figcaption element (visible only when caption content is present).\n *\n * @cssprop [--hx-image-object-fit] - Controls how the image fills its container. Maps to object-fit.\n * @cssprop [--hx-image-border-radius] - Border radius of the image. Overridden by the `rounded` prop.\n * @cssprop [--hx-image-aspect-ratio] - Aspect ratio of the image container. Overridden by the `ratio` prop.\n * @cssprop [--hx-image-caption-color] - Text color for the caption.\n * @cssprop [--hx-image-caption-font-size] - Font size for the caption.\n * @cssprop [--hx-image-caption-padding] - Padding for the caption.\n * @cssprop [--hx-image-fallback-min-height] - Minimum height of the error/fallback container.\n *\n * @fires hx-load - Dispatched when the image has successfully loaded.\n * @fires hx-error - Dispatched when the image fails to load (including after fallback-src also fails).\n */\n@customElement('hx-image')\nexport class HelixImage extends LitElement {\n static override styles = [tokenStyles, helixImageStyles];\n\n /**\n * The URL of the image to display.\n * @attr src\n */\n @property({ type: String, reflect: true })\n src = '';\n\n /**\n * Accessible text description of the image.\n * Required for informative images. Use the `decorative` prop for decorative images\n * instead of setting this to an empty string — explicit decorative intent is preferred.\n * @attr alt\n */\n @property({ type: String, reflect: true })\n alt: string | undefined = undefined;\n\n /**\n * Marks the image as decorative (hidden from screen readers).\n * Use this instead of `alt=\"\"` to make decorative intent explicit in markup.\n * When set, the inner img receives `alt=\"\"` and `role=\"presentation\"`.\n * @attr decorative\n */\n @property({ type: Boolean, reflect: true })\n decorative = false;\n\n /**\n * Width of the image element.\n * @attr width\n */\n @property({ reflect: true })\n width: number | string | undefined = undefined;\n\n /**\n * Height of the image element.\n * @attr height\n */\n @property({ reflect: true })\n height: number | string | undefined = undefined;\n\n /**\n * Loading strategy for the image.\n * @attr loading\n */\n @property({ type: String, reflect: true })\n loading: 'lazy' | 'eager' = 'lazy';\n\n /**\n * How the image should be resized to fit its container.\n * Maps to CSS object-fit.\n * @attr fit\n */\n @property({ type: String, reflect: true })\n fit: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down' | undefined = undefined;\n\n /**\n * CSS aspect-ratio value (e.g. \"16/9\", \"1\", \"4/3\").\n * When set, the container maintains this ratio.\n * @attr ratio\n */\n @property({ type: String, reflect: true })\n ratio: string | undefined = undefined;\n\n /**\n * Border radius for the image.\n * Boolean attribute (or `true`) applies the theme's medium radius token.\n * A string value is used directly as a CSS border-radius value (e.g. \"1rem\", \"50%\").\n *\n * Note: When set as an HTML attribute (`<hx-image rounded>`), Lit receives the value as\n * an empty string (`''`). When set programmatically (`el.rounded = true`), it receives\n * a boolean. Both forms apply the theme radius token.\n *\n * @attr rounded\n */\n @property({ reflect: true })\n rounded: boolean | string | undefined = undefined;\n\n /**\n * Fallback image URL shown when the primary src fails to load.\n * @attr fallback-src\n */\n @property({ type: String, attribute: 'fallback-src', reflect: true })\n fallbackSrc: string | undefined = undefined;\n\n /**\n * A comma-separated list of image candidates for responsive images.\n * Passed directly to the inner img's srcset attribute.\n * Enables Drupal responsive image styles and browser-native image selection.\n * @attr srcset\n */\n @property({ type: String, reflect: true })\n srcset: string | undefined = undefined;\n\n /**\n * Media conditions indicating which image size to use alongside srcset.\n * Works in conjunction with the `srcset` attribute.\n * @attr sizes\n */\n @property({ type: String, reflect: true })\n sizes: string | undefined = undefined;\n\n @state()\n private _error = false;\n\n @state()\n private _usedFallbackSrc = false;\n\n @state()\n private _hasCaptionSlot = false;\n\n private _handleLoad(): void {\n this.dispatchEvent(new CustomEvent('hx-load', { bubbles: true, composed: true }));\n }\n\n private _handleError(): void {\n if (!this._error && this.fallbackSrc && !this._usedFallbackSrc) {\n // Try the fallback-src before showing the fallback slot\n this._usedFallbackSrc = true;\n return;\n }\n this._error = true;\n this.dispatchEvent(new CustomEvent('hx-error', { bubbles: true, composed: true }));\n }\n\n private _onCaptionSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasCaptionSlot = slot.assignedNodes({ flatten: true }).length > 0;\n }\n\n private _computeBorderRadius(): string | undefined {\n if (this.rounded === true || this.rounded === '' || this.rounded === 'true') {\n return 'var(--hx-border-radius-md, 0.375rem)';\n }\n if (typeof this.rounded === 'string' && this.rounded.length > 0 && this.rounded !== 'false') {\n return this.rounded;\n }\n return undefined;\n }\n\n private _currentSrc(): string {\n if (this._usedFallbackSrc && this.fallbackSrc) {\n return this.fallbackSrc;\n }\n return this.src;\n }\n\n override render() {\n const isDecorative = this.decorative || this.alt === '';\n const altText = isDecorative ? '' : (this.alt ?? '');\n const borderRadius = this._computeBorderRadius();\n const showCaption = this._hasCaptionSlot;\n\n const containerStyles = {\n ...(this.ratio ? { '--_ratio': this.ratio } : {}),\n ...(this.fit ? { '--_fit': this.fit } : {}),\n ...(borderRadius ? { '--_radius': borderRadius } : {}),\n ...(this.width != null\n ? { width: typeof this.width === 'number' ? `${this.width}px` : this.width }\n : {}),\n ...(this.height != null\n ? { height: typeof this.height === 'number' ? `${this.height}px` : this.height }\n : {}),\n };\n\n if (this._error) {\n return html`\n <figure\n class=\"image__container image__container--error\"\n style=${styleMap(containerStyles)}\n role=\"alert\"\n aria-live=\"polite\"\n >\n <slot name=\"fallback\"></slot>\n </figure>\n `;\n }\n\n return html`\n <figure class=\"image__container\" style=${styleMap(containerStyles)}>\n <img\n part=\"base\"\n class=\"image__img\"\n src=${this._currentSrc() || nothing}\n alt=${altText}\n role=${isDecorative ? 'presentation' : nothing}\n loading=${this.loading}\n width=${this.width != null ? this.width : nothing}\n height=${this.height != null ? this.height : nothing}\n srcset=${this.srcset ?? nothing}\n sizes=${this.sizes ?? nothing}\n @load=${this._handleLoad}\n @error=${this._handleError}\n />\n <figcaption\n part=\"caption\"\n class=${classMap({ image__caption: true, 'image__caption--visible': showCaption })}\n >\n <slot name=\"caption\" @slotchange=${this._onCaptionSlotChange}></slot>\n </figcaption>\n </figure>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-image': HelixImage;\n }\n}\n"],"names":["helixImageStyles","css","HelixImage","LitElement","e","slot","isDecorative","altText","borderRadius","showCaption","containerStyles","html","styleMap","nothing","classMap","tokenStyles","__decorateClass","property","state","customElement"],"mappings":"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"}

package/dist/shared/hx-radio-reSaVmIB.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"hx-radio-reSaVmIB.js","sources":["../../src/components/hx-radio-group/hx-radio-group.styles.ts","../../src/components/hx-radio-group/hx-radio-group.ts","../../src/components/hx-radio-group/hx-radio.styles.ts","../../src/components/hx-radio-group/hx-radio.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixRadioGroupStyles = css`\n :host {\n display: block;\n }\n\n :host([disabled]) {\n opacity: var(--hx-opacity-disabled, 0.5);\n pointer-events: none;\n }\n\n * {\n box-sizing: border-box;\n }\n\n /* ─── Fieldset ─── */\n\n .fieldset {\n border: none;\n margin: 0;\n padding: 0;\n display: flex;\n flex-direction: column;\n gap: var(--hx-space-2, 0.5rem);\n font-family: var(--hx-font-family-sans, sans-serif);\n }\n\n /* ─── Legend ─── */\n\n .fieldset__legend {\n display: flex;\n align-items: baseline;\n gap: var(--hx-space-1, 0.25rem);\n font-size: var(--hx-font-size-sm, 0.875rem);\n font-weight: var(--hx-font-weight-medium, 500);\n color: var(--hx-radio-group-label-color, var(--hx-color-neutral-700, #343a40));\n line-height: var(--hx-line-height-normal, 1.5);\n padding: 0;\n margin-bottom: var(--hx-space-1, 0.25rem);\n }\n\n .fieldset__required-marker {\n color: var(--hx-radio-group-error-color, var(--hx-color-error-text, #b91c1c));\n font-weight: var(--hx-font-weight-bold, 700);\n }\n\n /* ─── Group Container ─── */\n\n .fieldset__group {\n display: flex;\n flex-direction: column;\n gap: var(--hx-radio-group-gap, var(--hx-space-3, 0.75rem));\n }\n\n :host([orientation='horizontal']) .fieldset__group {\n flex-direction: row;\n flex-wrap: wrap;\n }\n\n /* ─── Error State ─── */\n\n .fieldset--error .fieldset__legend {\n color: var(--hx-radio-group-error-color, var(--hx-color-error-text, #b91c1c));\n }\n\n /* ─── Help Text & Error Messages ─── */\n\n .fieldset__help-text {\n font-size: var(--hx-font-size-xs, 0.75rem);\n color: var(--hx-color-neutral-500, #6c757d);\n line-height: var(--hx-line-height-normal, 1.5);\n }\n\n .fieldset__error {\n font-size: var(--hx-font-size-xs, 0.75rem);\n color: var(--hx-radio-group-error-color, var(--hx-color-error-text, #b91c1c));\n line-height: var(--hx-line-height-normal, 1.5);\n }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixRadioGroupStyles } from './hx-radio-group.styles.js';\nimport type { HelixRadio } from './hx-radio.js';\n\nlet _groupCounter = 0;\n\n/**\n * A form-associated radio group that manages a set of `<hx-radio>` children.\n *\n * @summary Form-associated radio group with label, validation, help text, and keyboard navigation.\n *\n * @tag hx-radio-group\n *\n * @slot - `<hx-radio>` elements.\n * @slot error - Custom error content (overrides the error property).\n * @slot help-text - Custom help text content (overrides the helpText property).\n *\n * @fires {CustomEvent<{value: string, checked: boolean}>} hx-change - Dispatched when the selected radio changes.\n *\n * @csspart fieldset - The fieldset wrapper.\n * @csspart legend - The legend/label.\n * @csspart group - The container for radio items.\n * @csspart error - The error message.\n * @csspart help-text - The help text.\n *\n * @cssprop [--hx-radio-group-gap=var(--hx-space-3, 0.75rem)] - Gap between radio items.\n * @cssprop [--hx-radio-group-label-color=var(--hx-color-neutral-700, #343a40)] - Label text color.\n * @cssprop [--hx-radio-group-error-color=var(--hx-color-error-500, #dc3545)] - Error message color.\n */\n@customElement('hx-radio-group')\nexport class HelixRadioGroup extends LitElement {\n static override styles = [tokenStyles, helixRadioGroupStyles];\n\n // ─── Form Association ───\n\n static formAssociated = true;\n\n private _internals: ElementInternals;\n\n constructor() {\n super();\n this._internals = this.attachInternals();\n }\n\n // ─── Properties ───\n\n /**\n * The selected radio's value.\n * @attr value\n */\n @property({ type: String })\n value = '';\n\n /**\n * The name used for form submission.\n * @attr name\n */\n @property({ type: String })\n name = '';\n\n /**\n * The fieldset legend/label text.\n * @attr label\n */\n @property({ type: String })\n label = '';\n\n /**\n * Whether a selection is required for form submission.\n * @attr required\n */\n @property({ type: Boolean, reflect: true })\n required = false;\n\n /**\n * Whether the entire group 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 group enters an error state.\n * @attr error\n */\n @property({ type: String })\n error = '';\n\n /**\n * Help text displayed below the group for guidance.\n * @attr help-text\n */\n @property({ type: String, attribute: 'help-text' })\n helpText = '';\n\n /**\n * Layout orientation of the radio items.\n * @attr orientation\n */\n @property({ type: String, reflect: true })\n orientation: 'vertical' | 'horizontal' = 'vertical';\n\n private get _groupEl(): HTMLElement | null {\n return this.renderRoot?.querySelector('.fieldset__group') ?? null;\n }\n\n @state() private _hasErrorSlot = false;\n\n // ─── Internal IDs ───\n\n private _groupId = `hx-radio-group-${++_groupCounter}`;\n private _helpTextId = `${this._groupId}-help`;\n private _errorId = `${this._groupId}-error`;\n\n // ─── Slot Handlers ───\n\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 // ─── Lifecycle ───\n\n override connectedCallback(): void {\n super.connectedCallback();\n this.addEventListener('hx-radio-select', this._handleRadioSelect as EventListener);\n this.addEventListener('keydown', this._handleKeydown);\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.removeEventListener('hx-radio-select', this._handleRadioSelect as EventListener);\n this.removeEventListener('keydown', this._handleKeydown);\n }\n\n override updated(changedProperties: Map<string, unknown>): void {\n super.updated(changedProperties);\n if (changedProperties.has('value')) {\n this._internals.setFormValue(this.value || null);\n this._syncRadios();\n this._updateValidity();\n }\n if (changedProperties.has('disabled')) {\n this._syncRadios();\n }\n }\n\n override firstUpdated(changedProperties: Map<string, unknown>): void {\n super.firstUpdated(changedProperties);\n this._syncRadios();\n this._updateValidity();\n }\n\n // ─── Radio Management ───\n\n private _cachedRadios: HelixRadio[] | null = null;\n private _individualDisabledStates = new WeakMap<HelixRadio, boolean>();\n\n private _getRadios(): HelixRadio[] {\n if (!this._cachedRadios) {\n this._cachedRadios = Array.from(this.querySelectorAll('hx-radio')) as HelixRadio[];\n }\n return this._cachedRadios;\n }\n\n private _getEnabledRadios(): HelixRadio[] {\n return this._getRadios().filter((radio) => !radio.disabled && !this.disabled);\n }\n\n private _syncRadios(): void {\n const radios = this._getRadios();\n const enabledRadios = this._getEnabledRadios();\n\n radios.forEach((radio) => {\n const isChecked = radio.value === this.value && this.value !== '';\n radio.checked = isChecked;\n\n if (this.disabled) {\n // Store individual disabled state before overriding with group disabled\n if (!this._individualDisabledStates.has(radio)) {\n this._individualDisabledStates.set(radio, radio.disabled);\n }\n radio.disabled = true;\n } else {\n // Restore individual disabled state when group is re-enabled\n const originalDisabled = this._individualDisabledStates.get(radio);\n if (originalDisabled !== undefined) {\n radio.disabled = originalDisabled;\n this._individualDisabledStates.delete(radio);\n }\n }\n });\n\n // Roving tabindex management\n const checkedRadio = enabledRadios.find((r) => r.checked);\n radios.forEach((radio) => {\n radio.tabIndex = -1;\n });\n\n if (checkedRadio) {\n checkedRadio.tabIndex = 0;\n } else if (enabledRadios.length > 0) {\n const firstRadio = enabledRadios[0];\n if (firstRadio) {\n firstRadio.tabIndex = 0;\n }\n }\n }\n\n // ─── Event Handling ───\n\n private _handleRadioSelect = (e: CustomEvent<{ value: string }>): void => {\n e.stopPropagation();\n\n const newValue = e.detail.value;\n if (newValue === this.value) {\n return;\n }\n\n this.value = newValue;\n // Reactive update in updated() will call setFormValue, _syncRadios, _updateValidity\n\n /**\n * Dispatched when the selected radio changes.\n * @event hx-change\n */\n this.dispatchEvent(\n new CustomEvent('hx-change', {\n bubbles: true,\n composed: true,\n detail: { value: this.value, checked: true },\n }),\n );\n };\n\n private _handleKeydown = (e: KeyboardEvent): void => {\n const enabledRadios = this._getEnabledRadios();\n if (enabledRadios.length === 0) {\n return;\n }\n\n const isHandledKey = [\n 'ArrowUp',\n 'ArrowDown',\n 'ArrowLeft',\n 'ArrowRight',\n ' ',\n 'Home',\n 'End',\n ].includes(e.key);\n if (!isHandledKey) {\n return;\n }\n\n e.preventDefault();\n\n // Space: select the currently focused radio without moving focus\n if (e.key === ' ') {\n const targetRadio = (e.target as Element)?.closest?.('hx-radio') as HelixRadio | null;\n if (targetRadio && !targetRadio.disabled) {\n targetRadio.dispatchEvent(\n new CustomEvent('hx-radio-select', {\n bubbles: true,\n composed: true,\n detail: { value: targetRadio.value },\n }),\n );\n }\n return;\n }\n\n const targetRadio = (e.target as Element)?.closest?.('hx-radio') as HelixRadio | null;\n const currentIndex = targetRadio\n ? enabledRadios.indexOf(targetRadio)\n : enabledRadios.findIndex((radio) => radio.checked);\n\n let nextIndex: number;\n if (e.key === 'Home') {\n nextIndex = 0;\n } else if (e.key === 'End') {\n nextIndex = enabledRadios.length - 1;\n } else if (e.key === 'ArrowDown' || e.key === 'ArrowRight') {\n nextIndex = currentIndex === -1 ? 0 : (currentIndex + 1) % enabledRadios.length;\n } else {\n nextIndex = currentIndex <= 0 ? enabledRadios.length - 1 : currentIndex - 1;\n }\n\n const nextRadio = enabledRadios[nextIndex];\n if (nextRadio) {\n nextRadio.focus();\n nextRadio.dispatchEvent(\n new CustomEvent('hx-radio-select', {\n bubbles: true,\n composed: true,\n detail: { value: nextRadio.value },\n }),\n );\n }\n };\n\n private _handleSlotChange(): void {\n this._cachedRadios = null;\n this._syncRadios();\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 group 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 private _updateValidity(): void {\n if (this.required && !this.value) {\n this._internals.setValidity(\n { valueMissing: true },\n this.error || 'Please select an option.',\n this._groupEl ?? undefined,\n );\n } else {\n this._internals.setValidity({});\n }\n }\n\n /** Called by the form when it resets. */\n formResetCallback(): void {\n this.value = '';\n this._internals.setFormValue(null);\n this._syncRadios();\n }\n\n /** Called when the form restores state (e.g., back/forward navigation). */\n formStateRestoreCallback(\n state: string | File | FormData,\n _mode: 'restore' | 'autocomplete',\n ): void {\n if (typeof state === 'string') {\n this.value = state;\n }\n }\n\n // ─── Render ───\n\n override render() {\n const hasError = !!this.error;\n const legendId = `${this._groupId}-legend`;\n\n const fieldsetClasses = {\n fieldset: true,\n 'fieldset--error': hasError,\n 'fieldset--disabled': this.disabled,\n 'fieldset--required': this.required,\n };\n\n // Use _errorId only when there is no slotted error content replacing the internal error div\n const errorDescribedBy = !this._hasErrorSlot && hasError ? this._errorId : nothing;\n const describedBy =\n errorDescribedBy !== nothing ? errorDescribedBy : this.helpText ? this._helpTextId : nothing;\n\n return html`\n <fieldset\n part=\"fieldset\"\n class=${classMap(fieldsetClasses)}\n role=\"radiogroup\"\n aria-labelledby=${this.label ? legendId : nothing}\n aria-describedby=${describedBy}\n aria-required=${this.required ? 'true' : nothing}\n >\n ${this.label\n ? html`\n <legend part=\"legend\" class=\"fieldset__legend\" id=${legendId}>\n ${this.label}\n ${this.required\n ? html`<span class=\"fieldset__required-marker\" aria-hidden=\"true\">*</span>`\n : nothing}\n </legend>\n `\n : nothing}\n\n <div part=\"group\" class=\"fieldset__group\" role=\"none\">\n <slot @slotchange=${this._handleSlotChange}></slot>\n </div>\n\n <slot name=\"error\" @slotchange=${this._handleErrorSlotChange}>\n ${hasError\n ? html`<div part=\"error\" class=\"fieldset__error\" id=${this._errorId} role=\"alert\">\n ${this.error}\n </div>`\n : nothing}\n </slot>\n\n ${this.helpText && !hasError\n ? html`\n <div part=\"help-text\" class=\"fieldset__help-text\" id=${this._helpTextId}>\n <slot name=\"help-text\">${this.helpText}</slot>\n </div>\n `\n : nothing}\n </fieldset>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-radio-group': HelixRadioGroup;\n }\n}\n\n/** @public Type alias for use in test files and consumers. */\nexport type WcRadioGroup = HelixRadioGroup;\n","import { css } from 'lit';\n\nexport const helixRadioStyles = css`\n :host {\n display: block;\n }\n\n :host([disabled]) {\n opacity: var(--hx-opacity-disabled, 0.5);\n pointer-events: none;\n }\n\n * {\n box-sizing: border-box;\n }\n\n .radio {\n display: inline-flex;\n align-items: center;\n gap: var(--hx-space-2, 0.5rem);\n cursor: pointer;\n position: relative;\n font-family: var(--hx-font-family-sans, sans-serif);\n }\n\n .radio--disabled {\n cursor: not-allowed;\n }\n\n /* ─── Hidden Native Input ─── */\n\n .radio__input {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n }\n\n /* ─── Visual Radio Circle ─── */\n\n .radio__control {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: var(--hx-radio-size, var(--hx-size-5, 1.25rem));\n height: var(--hx-radio-size, var(--hx-size-5, 1.25rem));\n border: var(--hx-border-width-medium, 2px) solid\n var(--hx-radio-border-color, var(--hx-color-neutral-300, #ced4da));\n border-radius: var(--hx-border-radius-full, 9999px);\n background-color: var(--hx-color-neutral-0, #ffffff);\n transition:\n border-color var(--hx-transition-fast, 150ms ease),\n background-color var(--hx-transition-fast, 150ms ease),\n box-shadow var(--hx-transition-fast, 150ms ease);\n flex-shrink: 0;\n }\n\n /* ─── Inner Dot ─── */\n\n .radio__dot {\n width: 0;\n height: 0;\n border-radius: var(--hx-border-radius-full, 9999px);\n background-color: var(--hx-radio-dot-color, var(--hx-color-neutral-0, #ffffff));\n transition:\n width var(--hx-transition-fast, 150ms ease),\n height var(--hx-transition-fast, 150ms ease);\n }\n\n /* ─── Checked State ─── */\n\n .radio--checked .radio__control {\n border-color: var(--hx-radio-checked-border-color, var(--hx-color-primary-500, #2563eb));\n background-color: var(--hx-radio-checked-bg, var(--hx-color-primary-500, #2563eb));\n }\n\n .radio--checked .radio__dot {\n width: calc(var(--hx-radio-size, var(--hx-size-5, 1.25rem)) * 0.4);\n height: calc(var(--hx-radio-size, var(--hx-size-5, 1.25rem)) * 0.4);\n }\n\n /* ─── Focus State ─── */\n\n :host(:focus-visible) .radio__control {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-radio-focus-ring-color, var(--hx-focus-ring-color, #2563eb));\n outline-offset: var(--hx-focus-ring-offset, 2px);\n }\n\n /* ─── Hover State ─── */\n\n .radio:not(.radio--disabled):not(.radio--checked):hover .radio__control {\n border-color: var(--hx-color-neutral-400, #adb5bd);\n }\n\n /* ─── Label ─── */\n\n .radio__label {\n font-size: var(--hx-font-size-md, 1rem);\n color: var(--hx-radio-label-color, var(--hx-color-neutral-700, #343a40));\n line-height: var(--hx-line-height-normal, 1.5);\n user-select: none;\n -webkit-user-select: none;\n }\n`;\n","import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixRadioStyles } from './hx-radio.styles.js';\n\n// Module-level counter for stable, SSR-safe IDs (avoids Math.random() hydration mismatch)\nlet _hxRadioIdCounter = 0;\n\n/**\n * An individual radio button, designed to be used inside a `<hx-radio-group>`.\n *\n * @summary Presentational radio button managed by its parent radio group.\n *\n * @tag hx-radio\n *\n * @slot - Custom label content (overrides the label property).\n *\n * @csspart radio - The visual radio circle.\n * @csspart label - The label text.\n *\n * @cssprop [--hx-radio-size=var(--hx-size-5, 1.25rem)] - Radio circle size.\n * @cssprop [--hx-radio-border-color=var(--hx-color-neutral-300, #ced4da)] - Radio border color.\n * @cssprop [--hx-radio-checked-bg=var(--hx-color-primary-500, #2563EB)] - Checked background color.\n * @cssprop [--hx-radio-checked-border-color=var(--hx-color-primary-500, #2563EB)] - Checked border color.\n * @cssprop [--hx-radio-dot-color=var(--hx-color-neutral-0, #ffffff)] - Inner dot color when checked.\n * @cssprop [--hx-radio-focus-ring-color=var(--hx-focus-ring-color, #2563EB)] - Focus ring color.\n * @cssprop [--hx-radio-label-color=var(--hx-color-neutral-700, #343a40)] - Label text color.\n */\n@customElement('hx-radio')\nexport class HelixRadio extends LitElement {\n static override styles = [tokenStyles, helixRadioStyles];\n\n // ─── Properties ───\n\n /**\n * The value this radio represents.\n * @attr value\n */\n @property({ type: String })\n value = '';\n\n /**\n * Visible label text for the radio.\n * @attr label\n */\n @property({ type: String })\n label = '';\n\n /**\n * Whether this radio is disabled.\n * @attr disabled\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * Whether this radio is checked. Managed by the parent group.\n * @attr checked\n */\n @property({ type: Boolean, reflect: true })\n checked = false;\n\n // ─── Lifecycle ───\n\n override connectedCallback(): void {\n super.connectedCallback();\n this.setAttribute('role', 'radio');\n this.setAttribute('aria-checked', String(this.checked));\n this.setAttribute('aria-disabled', String(this.disabled));\n }\n\n override updated(changedProperties: Map<string, unknown>): void {\n super.updated(changedProperties);\n if (changedProperties.has('checked')) {\n this.setAttribute('aria-checked', String(this.checked));\n }\n if (changedProperties.has('disabled')) {\n this.setAttribute('aria-disabled', String(this.disabled));\n }\n }\n\n // ─── Internal IDs ───\n\n private _inputId = `hx-radio-${++_hxRadioIdCounter}`;\n\n // ─── Event Handling ───\n\n private _handleClick(): void {\n if (this.disabled) {\n return;\n }\n\n /**\n * Internal event dispatched to signal selection to the parent group.\n * Not part of the public API.\n * @internal\n */\n this.dispatchEvent(\n new CustomEvent('hx-radio-select', {\n bubbles: true,\n composed: true,\n detail: { value: this.value },\n }),\n );\n }\n\n // ─── Render ───\n\n override render() {\n const classes = {\n radio: true,\n 'radio--checked': this.checked,\n 'radio--disabled': this.disabled,\n };\n\n return html`\n <div class=${classMap(classes)} @click=${this._handleClick}>\n <input\n class=\"radio__input\"\n type=\"radio\"\n id=${this._inputId}\n .checked=${this.checked}\n ?disabled=${this.disabled}\n tabindex=\"-1\"\n aria-hidden=\"true\"\n />\n <span part=\"radio\" class=\"radio__control\" aria-hidden=\"true\">\n <span class=\"radio__dot\"></span>\n </span>\n <span part=\"label\" class=\"radio__label\">\n <slot>${this.label}</slot>\n </span>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-radio': HelixRadio;\n }\n}\n\n/** @public Type alias for use in test files and consumers. */\nexport type WcRadio = HelixRadio;\n"],"names":["helixRadioGroupStyles","css","_groupCounter","HelixRadioGroup","LitElement","newValue","enabledRadios","targetRadio","_b","_a","_d","_c","currentIndex","radio","nextIndex","nextRadio","slot","changedProperties","radios","isChecked","originalDisabled","checkedRadio","r","firstRadio","state","_mode","hasError","legendId","fieldsetClasses","errorDescribedBy","nothing","describedBy","html","classMap","tokenStyles","__decorateClass","property","customElement","helixRadioStyles","_hxRadioIdCounter","HelixRadio","classes"],"mappings":"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"}

package/dist/shared/hx-slider-CzHOl3Ur.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"hx-slider-CzHOl3Ur.js","sources":["../../src/components/hx-slider/hx-slider.styles.ts","../../src/components/hx-slider/hx-slider.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixSliderStyles = css`\n :host {\n display: block;\n }\n\n :host([disabled]) {\n opacity: var(--hx-opacity-disabled, 0.5);\n pointer-events: none;\n }\n\n * {\n box-sizing: border-box;\n }\n\n /* ─── Container ─── */\n\n .slider {\n display: flex;\n flex-direction: column;\n gap: var(--hx-space-1, 0.25rem);\n font-family: var(--hx-font-family-sans, sans-serif);\n }\n\n /* ─── Label Row ─── */\n\n .slider__label-row {\n display: flex;\n align-items: baseline;\n justify-content: space-between;\n gap: var(--hx-space-2, 0.5rem);\n }\n\n .slider__label {\n font-size: var(--hx-font-size-sm, 0.875rem);\n font-weight: var(--hx-font-weight-medium, 500);\n color: var(--hx-slider-label-color, var(--hx-color-neutral-700, #343a40));\n line-height: var(--hx-line-height-normal, 1.5);\n }\n\n .slider__value-display {\n font-size: var(--hx-font-size-sm, 0.875rem);\n font-weight: var(--hx-font-weight-medium, 500);\n color: var(--hx-slider-value-color, var(--hx-color-neutral-600, #6c757d));\n line-height: var(--hx-line-height-normal, 1.5);\n font-variant-numeric: tabular-nums;\n min-width: var(--hx-size-8, 2rem);\n text-align: right;\n }\n\n /* ─── Track Container ─── */\n\n .slider__track-container {\n position: relative;\n width: 100%;\n }\n\n .slider__track {\n position: relative;\n width: 100%;\n border-radius: var(--hx-border-radius-full, 9999px);\n background-color: var(--hx-slider-track-bg, var(--hx-color-neutral-200, #e9ecef));\n overflow: visible;\n }\n\n /* ─── Size: sm ─── */\n\n .slider--sm .slider__track {\n height: var(--hx-slider-track-height-sm, var(--hx-size-1, 0.25rem));\n }\n\n .slider--sm .slider__input {\n height: var(--hx-slider-track-height-sm, var(--hx-size-1, 0.25rem));\n }\n\n /* ─── Size: md ─── */\n\n .slider--md .slider__track {\n height: var(--hx-slider-track-height-md, var(--hx-size-1-5, 0.375rem));\n }\n\n .slider--md .slider__input {\n height: var(--hx-slider-track-height-md, var(--hx-size-1-5, 0.375rem));\n }\n\n /* ─── Size: lg ─── */\n\n .slider--lg .slider__track {\n height: var(--hx-slider-track-height-lg, var(--hx-size-2, 0.5rem));\n }\n\n .slider--lg .slider__input {\n height: var(--hx-slider-track-height-lg, var(--hx-size-2, 0.5rem));\n }\n\n /* ─── Fill ─── */\n\n .slider__fill {\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n border-radius: var(--hx-border-radius-full, 9999px);\n background-color: var(--hx-slider-fill-bg, var(--hx-color-primary-500, #2563eb));\n pointer-events: none;\n transition: width var(--hx-transition-fast, 150ms ease);\n }\n\n /* Suppress fill animation on initial render — only animate on user interaction */\n :host(:not([data-ready])) .slider__fill {\n transition: none;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .slider__fill {\n transition: none;\n }\n }\n\n /* ─── Native Range Input ─── */\n\n .slider__input {\n position: absolute;\n top: 50%;\n left: 0;\n transform: translateY(-50%);\n width: 100%;\n margin: 0;\n padding: 0;\n opacity: 0;\n cursor: pointer;\n -webkit-appearance: none;\n appearance: none;\n background: transparent;\n border: none;\n outline: none;\n /* Expand the hit area so the thumb is easy to grab */\n padding-block: var(--hx-slider-input-padding-block, 0.75rem);\n }\n\n /* In forced-color mode, restore native outline so the input remains focusable */\n @media (forced-colors: active) {\n .slider__input {\n outline: revert;\n opacity: 1;\n }\n .slider__input:focus-visible {\n outline: 2px solid ButtonText;\n }\n }\n\n .slider__input:disabled {\n cursor: not-allowed;\n }\n\n /* ─── Thumb (visual, :before on a wrapper or via ::after on track) ─── */\n /*\n * The native thumb is hidden (opacity 0 on the input). We render a visible\n * thumb element positioned by --fill-pct (a raw 0–100 number set in JS).\n *\n * Correct alignment formula keeps the thumb centered within the track at\n * both extremes, preventing the left/right halves from clipping outside:\n * left = fillPct% * (1 – thumbSize/100%) + thumbSize * (1 – fillPct/100)\n * Simplified: left = calc(var(--fill-pct,0)*1% + var(--_thumb-size)*(1 - var(--fill-pct,0)/100))\n * Combined with translate(-50%,-50%) this places the thumb center correctly\n * at every position from min to max.\n */\n\n .slider__thumb-visual {\n position: absolute;\n top: 50%;\n /* Corrected position: thumb stays within track at all fill values */\n left: calc(var(--fill-pct, 0) * 1% + var(--_thumb-size, 1rem) * (1 - var(--fill-pct, 0) / 100));\n transform: translate(-50%, -50%);\n border-radius: var(--hx-border-radius-full, 9999px);\n background-color: var(--hx-slider-thumb-bg, var(--hx-color-neutral-0, #ffffff));\n border: var(--hx-slider-thumb-border-width, 2px) solid\n var(--hx-slider-thumb-border-color, var(--hx-color-primary-500, #2563eb));\n box-shadow: var(--hx-slider-thumb-shadow, var(--hx-shadow-sm, 0 1px 2px 0 rgb(0 0 0 / 0.05)));\n pointer-events: none;\n transition:\n box-shadow var(--hx-transition-fast, 150ms ease),\n transform var(--hx-transition-fast, 150ms ease);\n }\n\n @media (prefers-reduced-motion: reduce) {\n .slider__thumb-visual {\n transition: none;\n }\n }\n\n .slider__input:focus-visible ~ .slider__thumb-visual {\n box-shadow:\n 0 0 0 var(--hx-focus-ring-width, 2px)\n var(--hx-slider-focus-ring-color, var(--hx-focus-ring-color, #2563eb)),\n var(--hx-slider-thumb-shadow, var(--hx-shadow-sm, 0 1px 2px 0 rgb(0 0 0 / 0.05)));\n }\n\n /* ─── Thumb sizes ─── */\n\n .slider--sm .slider__thumb-visual {\n --_thumb-size: var(--hx-slider-thumb-size-sm, var(--hx-size-3, 0.75rem));\n width: var(--_thumb-size);\n height: var(--_thumb-size);\n }\n\n .slider--md .slider__thumb-visual {\n --_thumb-size: var(--hx-slider-thumb-size-md, var(--hx-size-4, 1rem));\n width: var(--_thumb-size);\n height: var(--_thumb-size);\n }\n\n .slider--lg .slider__thumb-visual {\n --_thumb-size: var(--hx-slider-thumb-size-lg, var(--hx-size-5, 1.25rem));\n width: var(--_thumb-size);\n height: var(--_thumb-size);\n }\n\n /* ─── Forced colors (Windows High Contrast) ─── */\n @media (forced-colors: active) {\n .slider__fill {\n background-color: Highlight;\n }\n .slider__track {\n background-color: ButtonFace;\n border: 1px solid ButtonText;\n }\n .slider__thumb-visual {\n background-color: ButtonText;\n border-color: ButtonText;\n }\n .slider__input:focus-visible ~ .slider__thumb-visual {\n outline: 2px solid Highlight;\n }\n }\n\n /* ─── Ticks ─── */\n\n .slider__ticks {\n position: relative;\n width: 100%;\n height: var(--hx-size-2, 0.5rem);\n margin-top: var(--hx-space-1, 0.25rem);\n }\n\n .slider__tick {\n position: absolute;\n top: 0;\n width: var(--hx-border-width-thin, 1px);\n height: 100%;\n background-color: var(--hx-slider-tick-color, var(--hx-color-neutral-400, #adb5bd));\n transform: translateX(-50%);\n }\n\n /* ─── Range Labels ─── */\n\n .slider__range-labels {\n display: flex;\n justify-content: space-between;\n font-size: var(--hx-font-size-xs, 0.75rem);\n color: var(--hx-slider-range-label-color, var(--hx-color-neutral-500, #6c757d));\n line-height: var(--hx-line-height-normal, 1.5);\n margin-top: var(--hx-space-0-5, 0.125rem);\n }\n\n /* ─── Help Text ─── */\n\n .slider__help-text {\n font-size: var(--hx-font-size-xs, 0.75rem);\n color: var(--hx-slider-help-text-color, var(--hx-color-neutral-500, #6c757d));\n line-height: var(--hx-line-height-normal, 1.5);\n }\n\n /* ─── Disabled state ─── */\n\n .slider--disabled .slider__fill {\n background-color: var(--hx-color-neutral-400, #adb5bd);\n }\n\n .slider--disabled .slider__thumb-visual {\n border-color: var(--hx-color-neutral-400, #adb5bd);\n }\n`;\n","import { LitElement, TemplateResult, html, nothing } 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 { styleMap } from 'lit/directives/style-map.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixSliderStyles } from './hx-slider.styles.js';\n\n// Module-level counter for stable, SSR-safe IDs (avoids Math.random() hydration mismatch)\nlet _hxSliderIdCounter = 0;\n\n/**\n * A range slider component for selecting a numeric value within a min/max boundary.\n * Supports tick marks, value display, range labels, and native form participation\n * via ElementInternals.\n *\n * The native `<input type=\"range\">` receives `role=\"slider\"` with `aria-valuenow`,\n * `aria-valuemin`, and `aria-valuemax`. Label association uses `aria-labelledby`\n * when a label is present, or `aria-label` as a fallback. Help text is linked via\n * `aria-describedby`. Keyboard navigation follows the native range behavior:\n * Arrow keys increment/decrement by step, Home jumps to min, End jumps to max.\n *\n * @summary Form-associated range slider with label, ticks, and value display.\n *\n * @tag hx-slider\n *\n * @slot label - Custom label content (overrides the label property).\n * @slot help-text - Custom help text content (overrides the helpText property).\n * @slot min-label - Label rendered at the minimum end of the slider.\n * @slot max-label - Label rendered at the maximum end of the slider.\n *\n * @fires {CustomEvent<{value: number}>} hx-input - Dispatched continuously while the user drags.\n * @fires {CustomEvent<{value: number}>} hx-change - Dispatched when the user releases the thumb.\n *\n * @csspart slider - The outer container element.\n * @csspart track - The track background element.\n * @csspart fill - The filled portion of the track showing progress.\n * @csspart thumb - The draggable thumb overlay element.\n * @csspart label - The label element.\n * @csspart value-display - The element displaying the current numeric value.\n * @csspart tick - Each individual tick mark element.\n *\n * @cssprop [--hx-slider-track-bg=var(--hx-color-neutral-200)] - Track background color.\n * @cssprop [--hx-slider-fill-bg=var(--hx-color-primary-500)] - Fill/progress color.\n * @cssprop [--hx-slider-thumb-bg=var(--hx-color-neutral-0)] - Thumb background color.\n * @cssprop [--hx-slider-thumb-border-color=var(--hx-color-primary-500)] - Thumb border color.\n * @cssprop [--hx-slider-thumb-border-width=2px] - Thumb border width.\n * @cssprop [--hx-slider-thumb-shadow=var(--hx-shadow-sm)] - Thumb box shadow.\n * @cssprop [--hx-slider-focus-ring-color=var(--hx-focus-ring-color)] - Focus ring color.\n * @cssprop [--hx-slider-label-color=var(--hx-color-neutral-700)] - Label text color.\n * @cssprop [--hx-slider-value-color=var(--hx-color-neutral-600)] - Value display text color.\n * @cssprop [--hx-slider-tick-color=var(--hx-color-neutral-400)] - Tick mark color.\n * @cssprop [--hx-slider-range-label-color=var(--hx-color-neutral-500)] - Range label text color.\n * @cssprop [--hx-slider-help-text-color=var(--hx-color-neutral-500)] - Help text color.\n */\n@customElement('hx-slider')\nexport class HelixSlider extends LitElement {\n static override styles = [tokenStyles, helixSliderStyles];\n\n // ─── Form Association ───\n\n /** Enables native form participation via ElementInternals. */\n static formAssociated = true;\n\n /** ElementInternals instance for form value, validity, and label association. */\n private _internals: ElementInternals;\n\n constructor() {\n super();\n this._internals = this.attachInternals();\n }\n\n // ─── Properties ───\n\n /**\n * The name submitted with the form.\n * @attr name\n */\n @property({ type: String })\n name = '';\n\n /**\n * The current numeric value of the slider.\n * @attr value\n */\n @property({ type: Number })\n value = 0;\n\n /**\n * The minimum allowed value.\n * @attr min\n */\n @property({ type: Number })\n min = 0;\n\n /**\n * The maximum allowed value.\n * @attr max\n */\n @property({ type: Number })\n max = 100;\n\n /**\n * The stepping interval between values.\n * @attr step\n */\n @property({ type: Number })\n step = 1;\n\n /**\n * Whether the slider is disabled.\n * @attr disabled\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * The visible label text for the slider.\n * @attr label\n */\n @property({ type: String })\n label = '';\n\n /**\n * Help text displayed below the slider for guidance.\n * @attr help-text\n */\n @property({ type: String, attribute: 'help-text' })\n helpText = '';\n\n /**\n * When true, the current value is shown next to the label.\n * @attr show-value\n */\n @property({ type: Boolean, attribute: 'show-value' })\n showValue = false;\n\n /**\n * When true, tick marks are rendered at each step interval.\n * @attr show-ticks\n */\n @property({ type: Boolean, attribute: 'show-ticks' })\n showTicks = false;\n\n /**\n * The size variant of the slider.\n * @attr hx-size\n */\n @property({ type: String, reflect: true, attribute: 'hx-size' })\n size: 'sm' | 'md' | 'lg' = 'md';\n\n /**\n * Human-readable text alternative for the current value, announced by screen readers\n * instead of the numeric value. For example, on a pain scale: \"7 — Moderate-Severe\".\n * @attr aria-valuetext\n */\n @property({ type: String, attribute: 'aria-valuetext' })\n valueText = '';\n\n // ─── Internal State ───\n\n /** Whether the label slot has assigned content. */\n @state() private _hasLabelSlot = false;\n /** Whether the min-label slot has assigned content. */\n @state() private _hasMinLabelSlot = false;\n /** Whether the max-label slot has assigned content. */\n @state() private _hasMaxLabelSlot = false;\n /** Whether the help slot has assigned content. */\n @state() private _hasHelpSlot = false;\n\n // ─── Internal References ───\n\n /** Reference to the native range `<input>` inside shadow DOM. */\n @query('.slider__input')\n private _input!: HTMLInputElement;\n\n // ─── Unique IDs ───\n\n /** Unique ID for the native range input element. */\n private readonly _sliderId = `hx-slider-${++_hxSliderIdCounter}`;\n /** Unique ID for the label element, derived from _sliderId. */\n private readonly _labelId = `${this._sliderId}-label`;\n /** Unique ID for the help text element, derived from _sliderId. */\n private readonly _helpId = `${this._sliderId}-help`;\n\n // ─── Computed Values ───\n\n private _clamp(v: number): number {\n return Math.min(Math.max(v, this.min), this.max);\n }\n\n private _fillPercent(): number {\n const clamped = this._clamp(this.value);\n const range = this.max - this.min;\n if (range === 0) return 0;\n return ((clamped - this.min) / range) * 100;\n }\n\n private _ticks(): number[] {\n if (!this.showTicks) return [];\n const ticks: number[] = [];\n const range = this.max - this.min;\n if (range <= 0 || this.step <= 0) return ticks;\n const count = Math.round(range / this.step);\n for (let i = 0; i <= count; i++) {\n ticks.push((i / count) * 100);\n }\n return ticks;\n }\n\n // ─── Lifecycle ───\n\n override firstUpdated(): void {\n // Enable fill transition after initial render to suppress animation on mount\n requestAnimationFrame(() => this.setAttribute('data-ready', ''));\n }\n\n override updated(changedProperties: Map<string, unknown>): void {\n super.updated(changedProperties);\n // Clamp value to [min, max] after any relevant property change\n if (\n changedProperties.has('value') ||\n changedProperties.has('min') ||\n changedProperties.has('max')\n ) {\n const clamped = this._clamp(this.value);\n if (clamped !== this.value) {\n this.value = clamped;\n return;\n }\n this._internals.setFormValue(String(this.value));\n } else if (changedProperties.has('name')) {\n this._internals.setFormValue(String(this.value));\n }\n // Reflect aria-disabled on host for AT traversal\n if (changedProperties.has('disabled')) {\n if (this.disabled) {\n this.setAttribute('aria-disabled', 'true');\n } else {\n this.removeAttribute('aria-disabled');\n }\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 slider 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 /** Called by the form when it resets. Restores to the declared `value` attribute (default value). */\n formResetCallback(): void {\n const attrValue = this.getAttribute('value');\n const defaultValue = attrValue !== null ? parseFloat(attrValue) : this.min;\n const resetTo = this._clamp(!isNaN(defaultValue) ? defaultValue : this.min);\n this.value = resetTo;\n this._internals.setFormValue(String(resetTo));\n }\n\n /**\n * Called when the form restores state (e.g., back/forward navigation or autofill).\n * @param state - The serialized value to restore.\n * @param _reason - Either \"restore\" (back/forward) or \"autocomplete\".\n */\n formStateRestoreCallback(state: string, _reason: string): void {\n const parsed = parseFloat(state);\n if (!isNaN(parsed)) {\n this.value = this._clamp(parsed);\n }\n }\n\n // ─── Public Methods ───\n\n /** Moves focus to the native range input. */\n override focus(options?: FocusOptions): void {\n this._input?.focus(options);\n }\n\n // ─── Slot Handlers ───\n\n private _handleLabelSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasLabelSlot = slot.assignedNodes({ flatten: true }).length > 0;\n }\n\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 private _handleMinLabelSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasMinLabelSlot = slot.assignedNodes({ flatten: true }).length > 0;\n }\n\n private _handleMaxLabelSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasMaxLabelSlot = slot.assignedNodes({ flatten: true }).length > 0;\n }\n\n // ─── Event Handling ───\n\n private _handleInput(e: Event): void {\n if (this.disabled) return;\n const target = e.target as HTMLInputElement;\n this.value = parseFloat(target.value);\n this._internals.setFormValue(String(this.value));\n\n /**\n * Dispatched continuously while the user drags the thumb.\n * @event hx-input\n */\n this.dispatchEvent(\n new CustomEvent('hx-input', {\n bubbles: true,\n composed: true,\n detail: { value: this.value },\n }),\n );\n }\n\n private _handleChange(e: Event): void {\n if (this.disabled) return;\n const target = e.target as HTMLInputElement;\n this.value = parseFloat(target.value);\n this._internals.setFormValue(String(this.value));\n\n /**\n * Dispatched when the user releases the thumb after dragging.\n * @event hx-change\n */\n this.dispatchEvent(\n new CustomEvent('hx-change', {\n bubbles: true,\n composed: true,\n detail: { value: this.value },\n }),\n );\n }\n\n // ─── Render ───\n\n override render(): TemplateResult {\n const fillPct = this._fillPercent();\n const ticks = this._ticks();\n const hasLabel = !!this.label || this._hasLabelSlot;\n const showRangeLabels = this._hasMinLabelSlot || this._hasMaxLabelSlot;\n\n const containerClasses = {\n slider: true,\n [`slider--${this.size}`]: true,\n 'slider--disabled': this.disabled,\n 'slider--has-ticks': this.showTicks,\n };\n\n const describedBy =\n [this.helpText || this._hasHelpSlot ? this._helpId : null].filter(Boolean).join(' ') ||\n undefined;\n\n return html`\n <div part=\"slider\" class=${classMap(containerClasses)}>\n \n <div class=\"slider__label-row\">\n ${hasLabel\n ? html`<label\n part=\"label\"\n class=\"slider__label\"\n id=${this._labelId}\n for=${this._sliderId}\n >\n <slot name=\"label\" @slotchange=${this._handleLabelSlotChange}>${this.label}</slot>\n </label>`\n : html`<slot name=\"label\" @slotchange=${this._handleLabelSlotChange}></slot>`}\n ${this.showValue\n ? html`<span part=\"value-display\" class=\"slider__value-display\"> ${this.value} </span>`\n : nothing}\n </div>\n\n \n <div class=\"slider__track-container\">\n <div part=\"track\" class=\"slider__track\">\n <div part=\"fill\" class=\"slider__fill\" style=${styleMap({ width: `${fillPct}%` })}></div>\n\n <input\n class=\"slider__input\"\n id=${this._sliderId}\n type=\"range\"\n .value=${live(String(this.value))}\n min=${this.min}\n max=${this.max}\n step=${this.step}\n ?disabled=${this.disabled}\n name=${ifDefined(this.name || undefined)}\n aria-labelledby=${ifDefined(hasLabel ? this._labelId : undefined)}\n aria-valuetext=${ifDefined(this.valueText || undefined)}\n aria-describedby=${ifDefined(describedBy)}\n @input=${this._handleInput}\n @change=${this._handleChange}\n />\n\n \n <span\n part=\"thumb\"\n class=\"slider__thumb-visual\"\n style=${styleMap({ '--fill-pct': String(fillPct) })}\n aria-hidden=\"true\"\n ></span>\n </div>\n </div>\n\n \n ${this.showTicks && ticks.length > 0\n ? html`<div class=\"slider__ticks\">\n ${ticks.map(\n (pct) =>\n html`<span\n part=\"tick\"\n class=\"slider__tick\"\n style=${styleMap({ left: `${pct}%` })}\n ></span>`,\n )}\n </div>`\n : nothing}\n\n \n ${showRangeLabels\n ? html`<div class=\"slider__range-labels\">\n <slot name=\"min-label\" @slotchange=${this._handleMinLabelSlotChange}></slot>\n <slot name=\"max-label\" @slotchange=${this._handleMaxLabelSlotChange}></slot>\n </div>`\n : html`\n \n <slot name=\"min-label\" hidden @slotchange=${this._handleMinLabelSlotChange}></slot>\n <slot name=\"max-label\" hidden @slotchange=${this._handleMaxLabelSlotChange}></slot>\n `}\n\n \n <slot name=\"help-text\" @slotchange=${this._handleHelpSlotChange}>\n ${this.helpText\n ? html`<div part=\"help-text\" class=\"slider__help-text\" id=${this._helpId}>\n ${this.helpText}\n </div>`\n : nothing}\n </slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-slider': HelixSlider;\n }\n}\n"],"names":["helixSliderStyles","css","_hxSliderIdCounter","HelixSlider","LitElement","v","clamped","range","ticks","count","i","changedProperties","attrValue","defaultValue","resetTo","state","_reason","parsed","options","_a","slot","target","fillPct","hasLabel","showRangeLabels","containerClasses","describedBy","html","classMap","nothing","styleMap","live","ifDefined","pct","tokenStyles","__decorateClass","property","query","customElement"],"mappings":";;;;;;;AAEO,MAAMA,IAAoBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;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"}

package/dist/shared/hx-textarea-BLcReynr.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"hx-textarea-BLcReynr.js","sources":["../../src/components/hx-textarea/hx-textarea.styles.ts","../../src/components/hx-textarea/hx-textarea.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixTextareaStyles = css`\n :host {\n display: block;\n }\n\n :host([disabled]) {\n opacity: var(--hx-opacity-disabled, 0.5);\n pointer-events: none;\n }\n\n * {\n box-sizing: border-box;\n }\n\n .field {\n display: flex;\n flex-direction: column;\n gap: var(--hx-space-1, 0.25rem);\n font-family: var(--hx-input-font-family, var(--hx-font-family-sans, sans-serif));\n }\n\n /* --- Label --- */\n\n .field__label-wrapper {\n display: contents;\n }\n\n .field__label {\n display: flex;\n align-items: baseline;\n gap: var(--hx-space-1, 0.25rem);\n font-size: var(--hx-font-size-sm, 0.875rem);\n font-weight: var(--hx-font-weight-medium, 500);\n color: var(--hx-input-label-color, var(--hx-color-neutral-700, #343a40));\n line-height: var(--hx-line-height-normal, 1.5);\n }\n\n .field__required-marker {\n color: var(--hx-input-error-color, var(--hx-color-error-text, #b91c1c));\n font-weight: var(--hx-font-weight-bold, 700);\n }\n\n /* --- Textarea Wrapper --- */\n\n .field__textarea-wrapper {\n display: flex;\n flex-direction: column;\n border: var(--hx-border-width-thin, 1px) solid\n var(--hx-input-border-color, var(--hx-color-neutral-300, #ced4da));\n border-radius: var(--hx-input-border-radius, var(--hx-border-radius-md, 0.375rem));\n background-color: var(--hx-input-bg, var(--hx-color-neutral-0, #ffffff));\n transition:\n border-color var(--hx-transition-fast, 150ms ease),\n box-shadow var(--hx-transition-fast, 150ms ease);\n overflow: hidden;\n }\n\n .field__textarea-wrapper:focus-within {\n border-color: var(--hx-input-focus-ring-color, var(--hx-focus-ring-color, #2563eb));\n /* Solid fallback for browsers without color-mix() (Chrome < 111, Safari < 16.2) — WCAG 1.4.11 */\n box-shadow: 0 0 0 var(--hx-focus-ring-width, 2px)\n rgba(37, 99, 235, var(--hx-focus-ring-opacity, 0.25));\n box-shadow: 0 0 0 var(--hx-focus-ring-width, 2px)\n color-mix(\n in srgb,\n var(--hx-input-focus-ring-color, var(--hx-focus-ring-color, #2563eb))\n calc(var(--hx-focus-ring-opacity, 0.25) * 100%),\n transparent\n );\n }\n\n /* --- Error State --- */\n\n .field--error .field__textarea-wrapper {\n border-color: var(--hx-input-error-color, var(--hx-color-error-500, #dc3545));\n }\n\n .field--error .field__textarea-wrapper:focus-within {\n border-color: var(--hx-input-error-color, var(--hx-color-error-500, #dc3545));\n /* Solid fallback for browsers without color-mix() — WCAG 1.4.11 */\n box-shadow: 0 0 0 var(--hx-focus-ring-width, 2px)\n rgba(220, 53, 69, var(--hx-focus-ring-opacity, 0.25));\n box-shadow: 0 0 0 var(--hx-focus-ring-width, 2px)\n color-mix(\n in srgb,\n var(--hx-input-error-color, var(--hx-color-error-500, #dc3545))\n calc(var(--hx-focus-ring-opacity, 0.25) * 100%),\n transparent\n );\n }\n\n /* --- Native Textarea --- */\n\n .field__textarea {\n border: none;\n outline: none;\n background: transparent;\n padding: var(--hx-space-2, 0.5rem) var(--hx-space-3, 0.75rem);\n font-family: inherit;\n font-size: var(--hx-font-size-md, 1rem);\n color: var(--hx-input-color, var(--hx-color-neutral-800, #212529));\n line-height: var(--hx-line-height-normal, 1.5);\n min-height: var(--hx-textarea-min-height, var(--hx-size-20, 5rem));\n width: 100%;\n resize: vertical;\n }\n\n .field__textarea::placeholder {\n color: var(--hx-color-neutral-400, #adb5bd);\n }\n\n .field__textarea:disabled {\n cursor: not-allowed;\n }\n\n /* --- Resize Variants --- */\n\n :host([resize='none']) .field__textarea {\n resize: none;\n }\n\n /* resize: vertical is the base default — no override needed for [resize='vertical'] */\n\n :host([resize='both']) .field__textarea {\n resize: both;\n }\n\n :host([resize='auto']) .field__textarea {\n resize: none;\n overflow: hidden;\n }\n\n /* --- Character Counter --- */\n\n .field__counter {\n font-size: var(--hx-font-size-xs, 0.75rem);\n color: var(--hx-color-neutral-500, #6c757d);\n line-height: var(--hx-line-height-normal, 1.5);\n text-align: right;\n }\n\n /* --- Help Text & Error Messages --- */\n\n .field__help-text {\n font-size: var(--hx-font-size-xs, 0.75rem);\n color: var(--hx-color-neutral-500, #6c757d);\n line-height: var(--hx-line-height-normal, 1.5);\n }\n\n .field__error {\n font-size: var(--hx-font-size-xs, 0.75rem);\n color: var(--hx-input-error-color, var(--hx-color-error-text, #b91c1c));\n line-height: var(--hx-line-height-normal, 1.5);\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 { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixTextareaStyles } from './hx-textarea.styles.js';\n\n// Module-level counter for stable, SSR-safe IDs (avoids Math.random() hydration mismatch)\nlet _hxTextareaIdCounter = 0;\n\n/**\n * A multi-line text area component with label, validation, and form association.\n *\n * Uses `aria-invalid` to convey error state and `aria-describedby` to link\n * error/help text to the textarea. Label association is handled through\n * `aria-labelledby` (for slotted labels) or the standard `<label for>` pattern.\n * Supports `aria-label` for cases where a visible label is not present.\n * Validation errors are announced via `role=\"alert\"` (assertive live region).\n *\n * @summary Form-associated textarea with built-in label, error, help text, character counter, and auto-resize.\n *\n * @tag hx-textarea\n *\n * @slot label - Custom label content (overrides the label property). Use for Drupal Form API rendered labels.\n * @slot help-text - Custom help text content (overrides the helpText property).\n * @slot error - Custom error content (overrides the error property). Use for Drupal Form API rendered errors.\n *\n * @fires {CustomEvent<{value: string}>} hx-input - Dispatched on every keystroke as the user types.\n * @fires {CustomEvent<{value: string}>} hx-change - Dispatched when the textarea loses focus after its value changed.\n *\n * @csspart field - The outer field container.\n * @csspart label - The label element.\n * @csspart textarea-wrapper - The wrapper around the textarea.\n * @csspart textarea - The native textarea element.\n * @csspart counter - The character count display.\n * @csspart help-text - The help text container.\n * @csspart error - The error message container.\n *\n * @cssprop [--hx-input-bg=var(--hx-color-neutral-0)] - Input background color.\n * @cssprop [--hx-input-color=var(--hx-color-neutral-800)] - Input text color.\n * @cssprop [--hx-input-border-color=var(--hx-color-neutral-300)] - Input border color.\n * @cssprop [--hx-input-border-radius=var(--hx-border-radius-md)] - Input border radius.\n * @cssprop [--hx-input-font-family=var(--hx-font-family-sans)] - Input font family.\n * @cssprop [--hx-input-focus-ring-color=var(--hx-focus-ring-color)] - Focus ring color.\n * @cssprop [--hx-input-error-color=var(--hx-color-error-500)] - Error state color.\n * @cssprop [--hx-input-label-color=var(--hx-color-neutral-700)] - Label text color.\n * @cssprop [--hx-textarea-min-height=var(--hx-size-20, 5rem)] - Minimum textarea height.\n */\n@customElement('hx-textarea')\nexport class HelixTextarea extends LitElement {\n static override styles = [tokenStyles, helixTextareaStyles];\n\n // ─── Form Association ───\n\n /** Enables the element to participate in form submission and validation. */\n static formAssociated = true;\n\n /** ElementInternals instance for form association, validation, and ARIA. */\n private _internals: ElementInternals;\n\n constructor() {\n super();\n this._internals = this.attachInternals();\n }\n\n // ─── Properties ───\n\n /**\n * The visible label text for the textarea.\n * @attr label\n */\n @property({ type: String })\n label = '';\n\n /**\n * Placeholder text shown when the textarea is empty.\n * @attr placeholder\n */\n @property({ type: String })\n placeholder = '';\n\n /**\n * The current value of the textarea.\n * @attr value\n */\n @property({ type: String })\n value = '';\n\n /**\n * Whether the textarea is required for form submission.\n * @attr required\n */\n @property({ type: Boolean, reflect: true })\n required = false;\n\n /**\n * Whether the textarea 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 textarea enters an error state.\n * @attr error\n */\n @property({ type: String })\n error = '';\n\n /**\n * Help text displayed below the textarea for guidance.\n * @attr help-text\n */\n @property({ type: String, attribute: 'help-text' })\n helpText = '';\n\n /**\n * The name of the textarea, used for form submission.\n * @attr name\n */\n @property({ type: String })\n name = '';\n\n /**\n * The number of visible text rows. Must be a positive integer (minimum 1).\n * Invalid values are clamped to the nearest valid value.\n * @attr rows\n */\n @property({ type: Number })\n rows = 4;\n\n /**\n * Minimum number of characters required.\n * @attr minlength\n */\n @property({ type: Number, attribute: 'minlength' })\n minlength: number | undefined;\n\n /**\n * Maximum number of characters allowed.\n * @attr maxlength\n */\n @property({ type: Number, attribute: 'maxlength' })\n maxlength: number | undefined;\n\n /**\n * Controls how the textarea can be resized. Use 'auto' for auto-grow behavior.\n * @attr resize\n */\n @property({ type: String, reflect: true })\n resize: 'none' | 'vertical' | 'both' | 'auto' = 'vertical';\n\n /**\n * Whether to show a character count below the textarea.\n * @attr show-count\n */\n @property({ type: Boolean, attribute: 'show-count' })\n showCount = false;\n\n /**\n * Accessible name for screen readers, if different from the visible label.\n * @attr aria-label\n */\n @property({ type: String, attribute: 'aria-label' })\n override ariaLabel: string | null = null;\n\n // ─── Internal References ───\n\n /** @internal */\n @query('.field__textarea')\n private _textarea: HTMLTextAreaElement | undefined;\n\n // ─── Slot Tracking ───\n\n /** @internal */\n @state() private _hasLabelSlot = false;\n /** @internal */\n @state() private _hasErrorSlot = false;\n /** @internal */\n @state() private _hasHelpTextSlot = false;\n\n /** @internal */\n private _handleLabelSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasLabelSlot = slot.assignedElements().length > 0;\n if (this._hasLabelSlot) {\n const slottedLabel = slot.assignedElements()[0];\n if (slottedLabel && !slottedLabel.id) {\n slottedLabel.id = `${this._textareaId}-slotted-label`;\n }\n }\n }\n\n /** @internal */\n private _handleErrorSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasErrorSlot = slot.assignedElements().length > 0;\n }\n\n /** @internal */\n private _handleHelpTextSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasHelpTextSlot = slot.assignedElements().length > 0;\n }\n\n // ─── Lifecycle ───\n\n override updated(changedProperties: Map<string, unknown>): void {\n super.updated(changedProperties);\n if (changedProperties.has('rows')) {\n const clamped = Math.max(1, Math.round(this.rows));\n if (clamped !== this.rows) {\n this.rows = clamped;\n }\n }\n if (changedProperties.has('value')) {\n this._internals.setFormValue(this.value);\n }\n if (\n changedProperties.has('value') ||\n changedProperties.has('required') ||\n changedProperties.has('minlength') ||\n changedProperties.has('maxlength')\n ) {\n this._updateValidity();\n }\n // Auto-grow: respond to programmatic value changes\n if (changedProperties.has('value') && this.resize === 'auto' && this._textarea) {\n this._textarea.style.height = 'auto';\n this._textarea.style.height = `${this._textarea.scrollHeight}px`;\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 textarea 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 const anchor = this._textarea ?? undefined;\n if (this.required && !this.value) {\n this._internals.setValidity(\n { valueMissing: true },\n this.error || 'This field is required.',\n anchor,\n );\n } else if (\n this.minlength !== undefined &&\n this.value.length > 0 &&\n this.value.length < this.minlength\n ) {\n this._internals.setValidity(\n { tooShort: true },\n this.error || `Value must be at least ${this.minlength} characters.`,\n anchor,\n );\n } else if (this.maxlength !== undefined && this.value.length > this.maxlength) {\n this._internals.setValidity(\n { tooLong: true },\n this.error || `Value must be ${this.maxlength} characters or fewer.`,\n anchor,\n );\n } else {\n this._internals.setValidity({});\n }\n }\n\n /** Called by the browser when the owning form is reset. */\n formResetCallback(): void {\n this.value = '';\n this._internals.setFormValue('');\n }\n\n /** Called by the browser to restore form state (e.g., back/forward navigation). */\n formStateRestoreCallback(state: string): void {\n this.value = state;\n }\n\n // ─── Event Handling ───\n\n /** @internal */\n private _handleInput(e: Event): void {\n const target = e.target as HTMLTextAreaElement;\n this.value = target.value;\n // Note: setFormValue is called in updated() via the value change — no double-call here (P1-06 fix)\n\n // Auto-grow: reset height then set to scrollHeight\n if (this.resize === 'auto') {\n target.style.height = 'auto';\n target.style.height = `${target.scrollHeight}px`;\n }\n\n /**\n * Dispatched on every keystroke as the user types.\n * @event hx-input\n */\n this.dispatchEvent(\n new CustomEvent('hx-input', {\n bubbles: true,\n composed: true,\n detail: { value: this.value },\n }),\n );\n }\n\n /** @internal */\n private _handleChange(e: Event): void {\n const target = e.target as HTMLTextAreaElement;\n this.value = target.value;\n this._internals.setFormValue(this.value);\n this._updateValidity();\n\n /**\n * Dispatched when the textarea loses focus after its value changed.\n * @event hx-change\n */\n this.dispatchEvent(\n new CustomEvent('hx-change', {\n bubbles: true,\n composed: true,\n detail: { value: this.value },\n }),\n );\n }\n\n // ─── Public Methods ───\n\n /** Moves focus to the textarea element. */\n override focus(options?: FocusOptions): void {\n this._textarea?.focus(options);\n }\n\n /** Selects all text in the textarea. */\n select(): void {\n this._textarea?.select();\n }\n\n // ─── Render ───\n\n /** @internal */\n private _textareaId = `hx-textarea-${++_hxTextareaIdCounter}`;\n /** @internal */\n private _helpTextId = `${this._textareaId}-help`;\n /** @internal */\n private _errorId = `${this._textareaId}-error`;\n /** @internal */\n private _counterId = `${this._textareaId}-counter`;\n\n /** @internal */\n private _renderCounter() {\n if (!this.showCount) return nothing;\n\n const count = this.value.length;\n const display = this.maxlength !== undefined ? `${count} / ${this.maxlength}` : `${count}`;\n\n return html`\n <div part=\"counter\" class=\"field__counter\" id=${this._counterId} aria-live=\"polite\">\n ${display}\n </div>\n `;\n }\n\n override render() {\n const hasError = !!this.error || this._hasErrorSlot;\n\n const fieldClasses = {\n field: true,\n 'field--error': hasError,\n 'field--disabled': this.disabled,\n 'field--required': this.required,\n };\n\n // P0-02 fix: help text container renders when slot is used OR property is set\n const hasHelpText = (!!this.helpText || this._hasHelpTextSlot) && !hasError;\n\n const describedBy =\n [\n hasError ? this._errorId : null,\n hasHelpText ? this._helpTextId : null,\n this.showCount ? this._counterId : null,\n ]\n .filter(Boolean)\n .join(' ') || undefined;\n\n return html`\n <div part=\"field\" class=${classMap(fieldClasses)}>\n <div class=\"field__label-wrapper\">\n <slot name=\"label\" @slotchange=${this._handleLabelSlotChange}>\n ${this.label\n ? html`\n <label part=\"label\" class=\"field__label\" for=${this._textareaId}>\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 </div>\n\n <div part=\"textarea-wrapper\" class=\"field__textarea-wrapper\">\n <textarea\n part=\"textarea\"\n class=\"field__textarea\"\n id=${this._textareaId}\n .value=${live(this.value)}\n placeholder=${ifDefined(this.placeholder || undefined)}\n ?required=${this.required}\n ?disabled=${this.disabled}\n rows=${this.rows}\n minlength=${ifDefined(this.minlength)}\n maxlength=${ifDefined(this.maxlength)}\n name=${ifDefined(this.name || undefined)}\n aria-label=${ifDefined(this.ariaLabel ?? undefined)}\n aria-labelledby=${ifDefined(\n this._hasLabelSlot ? `${this._textareaId}-slotted-label` : undefined,\n )}\n aria-invalid=${hasError ? 'true' : nothing}\n aria-describedby=${ifDefined(describedBy)}\n @input=${this._handleInput}\n @change=${this._handleChange}\n ></textarea>\n </div>\n\n ${this._renderCounter()}\n ${hasError\n ? html`\n <div part=\"error\" class=\"field__error\" id=${this._errorId} role=\"alert\">\n <slot name=\"error\" @slotchange=${this._handleErrorSlotChange}>${this.error}</slot>\n </div>\n `\n : html`<slot name=\"error\" @slotchange=${this._handleErrorSlotChange}></slot>`}\n ${hasHelpText\n ? html`\n <div part=\"help-text\" class=\"field__help-text\" id=${this._helpTextId}>\n <slot name=\"help-text\" @slotchange=${this._handleHelpTextSlotChange}>\n ${this.helpText}\n </slot>\n </div>\n `\n : html`<slot name=\"help-text\" @slotchange=${this._handleHelpTextSlotChange}></slot>`}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-textarea': HelixTextarea;\n }\n}\n\nexport type WcTextarea = HelixTextarea;\n"],"names":["helixTextareaStyles","css","_hxTextareaIdCounter","HelixTextarea","LitElement","slot","slottedLabel","changedProperties","clamped","anchor","state","target","options","_a","nothing","count","display","html","hasError","fieldClasses","hasHelpText","describedBy","classMap","live","ifDefined","tokenStyles","__decorateClass","property","query","customElement"],"mappings":"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"}