@helixui/library 0.1.0

package/dist/components/hx-tabs/hx-tab.d.ts

@@ -0,0 +1,69 @@
+import { LitElement } from 'lit';
+/**
+ * An individual tab button, designed to be used inside an `<hx-tabs>` container.
+ * Must be placed in the `tab` named slot of `<hx-tabs>`.
+ *
+ * @summary Presentational tab button that activates a corresponding panel.
+ *
+ * @tag hx-tab
+ *
+ * @slot - Default slot for the tab label text or content.
+ * @slot prefix - Icon or content rendered before the label.
+ * @slot suffix - Icon or content rendered after the label.
+ *
+ * @csspart tab - The underlying button element.
+ * @csspart prefix - The container for prefix slot content (e.g. icons).
+ * @csspart suffix - The container for suffix slot content (e.g. badges).
+ *
+ * @cssprop [--hx-tabs-tab-color=var(--hx-color-neutral-600, #495057)] - Inactive tab text color.
+ * @cssprop [--hx-tabs-tab-active-color=var(--hx-color-primary-600, #1d4ed8)] - Active tab text color.
+ * @cssprop [--hx-tabs-tab-hover-color=var(--hx-color-neutral-800, #212529)] - Tab hover text color.
+ * @cssprop [--hx-tabs-tab-hover-bg=var(--hx-color-neutral-50, #f8f9fa)] - Tab hover background.
+ * @cssprop [--hx-tabs-tab-font-size=var(--hx-font-size-md, 1rem)] - Tab font size.
+ * @cssprop [--hx-tabs-tab-font-weight=var(--hx-font-weight-medium, 500)] - Tab font weight.
+ * @cssprop [--hx-tabs-tab-active-font-weight=var(--hx-font-weight-semibold, 600)] - Active tab font weight.
+ * @cssprop [--hx-tabs-tab-padding-x=var(--hx-space-4, 1rem)] - Horizontal tab padding.
+ * @cssprop [--hx-tabs-tab-padding-y=var(--hx-space-2, 0.5rem)] - Vertical tab padding.
+ * @cssprop [--hx-tabs-indicator-color=var(--hx-color-primary-500, #2563eb)] - Active indicator color.
+ * @cssprop [--hx-tabs-indicator-size=2px] - Active indicator thickness.
+ * @cssprop [--hx-tabs-focus-ring-color=var(--hx-focus-ring-color, #2563eb)] - Focus ring color.
+ */
+export declare class HelixTab extends LitElement {
+    static styles: import('lit').CSSResult[];
+    /**
+     * The name of the `<hx-tab-panel>` this tab controls. Must match the `name`
+     * attribute on the corresponding `<hx-tab-panel>`.
+     * @attr panel
+     */
+    panel: string;
+    /**
+     * Whether this tab is currently selected. Managed by the parent `<hx-tabs>`.
+     * @attr selected
+     */
+    selected: boolean;
+    /**
+     * Whether this tab is disabled. Prevents selection and keyboard navigation.
+     * @attr disabled
+     */
+    disabled: boolean;
+    /**
+     * The id of the panel this tab controls. Set by the parent `<hx-tabs>` to establish the
+     * aria-controls relationship on the inner button element (which carries role="tab").
+     * @internal
+     */
+    controls: string;
+    /** @internal */
+    private _hasPrefixSlot;
+    /** @internal */
+    private _hasSuffixSlot;
+    private _handleClick;
+    private _handlePrefixSlotChange;
+    private _handleSuffixSlotChange;
+    render(): import('lit-html').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'hx-tab': HelixTab;
+    }
+}
+//# sourceMappingURL=hx-tab.d.ts.map

package/dist/components/hx-tabs/hx-tab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-tab.d.ts","sourceRoot":"","sources":["../../../src/components/hx-tabs/hx-tab.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;AAKhD;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,qBACa,QAAS,SAAQ,UAAU;IACtC,OAAgB,MAAM,4BAAiC;IAIvD;;;;OAIG;IAEH,KAAK,SAAM;IAEX;;;OAGG;IAEH,QAAQ,UAAS;IAEjB;;;OAGG;IAEH,QAAQ,UAAS;IAEjB;;;;OAIG;IAEH,QAAQ,SAAM;IAId,gBAAgB;IACP,OAAO,CAAC,cAAc,CAAS;IACxC,gBAAgB;IACP,OAAO,CAAC,cAAc,CAAS;IAIxC,OAAO,CAAC,YAAY;IAkBpB,OAAO,CAAC,uBAAuB;IAK/B,OAAO,CAAC,uBAAuB;IAOtB,MAAM;CAsBhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,QAAQ,EAAE,QAAQ,CAAC;KACpB;CACF"}

package/dist/components/hx-tabs/hx-tab.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const helixTabStyles: import('lit').CSSResult;
+//# sourceMappingURL=hx-tab.styles.d.ts.map

package/dist/components/hx-tabs/hx-tab.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-tab.styles.d.ts","sourceRoot":"","sources":["../../../src/components/hx-tabs/hx-tab.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,yBA4F1B,CAAC"}

package/dist/components/hx-tabs/hx-tabs.d.ts

@@ -0,0 +1,97 @@
+import { LitElement } from 'lit';
+/**
+ * A tabbed content organizer that manages a set of `<hx-tab>` and `<hx-tab-panel>` children.
+ * Supports horizontal and vertical orientations, automatic and manual activation modes,
+ * and full keyboard navigation per the ARIA Authoring Practices Guide.
+ *
+ * @summary Tab container that organizes content into selectable panels.
+ *
+ * @tag hx-tabs
+ *
+ * @slot tab - Slot for `<hx-tab>` elements. Rendered inside the tablist.
+ * @slot - Default slot for `<hx-tab-panel>` elements.
+ *
+ * @fires {CustomEvent<{tabId: string, index: number}>} hx-tab-change - Dispatched when the active tab changes.
+ *
+ * @csspart tablist - The tablist container element.
+ * @csspart panels - The panel content container element.
+ *
+ * @cssprop [--hx-tabs-border-color=var(--hx-color-neutral-200, #e9ecef)] - Tablist border color.
+ * @cssprop [--hx-tabs-border-width=1px] - Tablist border width.
+ * @cssprop [--hx-tabs-vertical-width=12rem] - Width of the tablist in vertical orientation.
+ * @cssprop [--hx-tabs-gap=0] - Gap between the tablist and panels container.
+ * @cssprop [--hx-tabs-tab-color=var(--hx-color-neutral-600, #495057)] - Inactive tab text color.
+ * @cssprop [--hx-tabs-tab-active-color=var(--hx-color-primary-600, #1d4ed8)] - Active tab text color.
+ * @cssprop [--hx-tabs-tab-hover-color=var(--hx-color-neutral-800, #212529)] - Tab hover text color.
+ * @cssprop [--hx-tabs-tab-hover-bg=var(--hx-color-neutral-50, #f8f9fa)] - Tab hover background.
+ * @cssprop [--hx-tabs-tab-font-size=var(--hx-font-size-md, 1rem)] - Tab font size.
+ * @cssprop [--hx-tabs-tab-font-weight=var(--hx-font-weight-medium, 500)] - Tab font weight.
+ * @cssprop [--hx-tabs-tab-active-font-weight=var(--hx-font-weight-semibold, 600)] - Active tab font weight.
+ * @cssprop [--hx-tabs-tab-padding-x=var(--hx-space-4, 1rem)] - Horizontal tab padding.
+ * @cssprop [--hx-tabs-tab-padding-y=var(--hx-space-2, 0.5rem)] - Vertical tab padding.
+ * @cssprop [--hx-tabs-indicator-color=var(--hx-color-primary-500, #2563eb)] - Active indicator color.
+ * @cssprop [--hx-tabs-indicator-size=2px] - Active indicator thickness.
+ * @cssprop [--hx-tabs-focus-ring-color=var(--hx-focus-ring-color, #2563eb)] - Focus ring color for tabs and panels.
+ * @cssprop [--hx-tabs-panel-padding=var(--hx-space-4, 1rem)] - Panel inner padding.
+ * @cssprop [--hx-tabs-panel-color=var(--hx-color-neutral-700, #343a40)] - Panel text color.
+ */
+export declare class HelixTabs extends LitElement {
+    static styles: import('lit').CSSResult[];
+    /** @internal */
+    private _id;
+    /**
+     * The layout orientation of the tabs.
+     * @attr orientation
+     */
+    orientation: 'horizontal' | 'vertical';
+    /**
+     * Controls how keyboard navigation activates tabs.
+     * In `automatic` mode, focus also activates the tab.
+     * In `manual` mode, focus moves independently; Space or Enter activates.
+     * @attr activation
+     */
+    activation: 'manual' | 'automatic';
+    /**
+     * Accessible label for the tablist. Rendered as `aria-label` on the tablist container.
+     * Provide a brief description of what the tabs represent (e.g., "Patient record sections").
+     * @attr label
+     */
+    label: string;
+    /** @internal */
+    private _activePanel;
+    /** @internal */
+    private _cachedTabs;
+    /** @internal */
+    private _cachedPanels;
+    /** @internal */
+    private _observer;
+    /**
+     * Gets or sets the zero-based index of the currently selected tab.
+     * Setting this programmatically activates the tab at the given index.
+     */
+    get selectedIndex(): number;
+    set selectedIndex(index: number);
+    private _getTabs;
+    private _getPanels;
+    private _getEnabledTabs;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    firstUpdated(): void;
+    updated(changedProperties: Map<string, unknown>): void;
+    private _syncTabsAndPanels;
+    private _updateTabsAndPanels;
+    private _activateTab;
+    /** @internal */
+    private _handleTabSelect;
+    /** @internal */
+    private _handleSlotChange;
+    /** @internal */
+    private _handleKeydown;
+    render(): import('lit-html').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'hx-tabs': HelixTabs;
+    }
+}
+//# sourceMappingURL=hx-tabs.d.ts.map

package/dist/components/hx-tabs/hx-tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-tabs.d.ts","sourceRoot":"","sources":["../../../src/components/hx-tabs/hx-tabs.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;AAUhD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,qBACa,SAAU,SAAQ,UAAU;IACvC,OAAgB,MAAM,4BAAkC;IAIxD,gBAAgB;IAChB,OAAO,CAAC,GAAG,CAAmC;IAI9C;;;OAGG;IAEH,WAAW,EAAE,YAAY,GAAG,UAAU,CAAgB;IAEtD;;;;;OAKG;IAEH,UAAU,EAAE,QAAQ,GAAG,WAAW,CAAe;IAEjD;;;;OAIG;IAEH,KAAK,SAAM;IAIX,gBAAgB;IACP,OAAO,CAAC,YAAY,CAAM;IAInC,gBAAgB;IAChB,OAAO,CAAC,WAAW,CAA2B;IAC9C,gBAAgB;IAChB,OAAO,CAAC,aAAa,CAAgC;IACrD,gBAAgB;IAChB,OAAO,CAAC,SAAS,CAAiC;IAIlD;;;OAGG;IACH,IAAI,aAAa,IAAI,MAAM,CAE1B;IAED,IAAI,aAAa,CAAC,KAAK,EAAE,MAAM,EAK9B;IAED,OAAO,CAAC,QAAQ;IAOhB,OAAO,CAAC,UAAU;IASlB,OAAO,CAAC,eAAe;IAMd,iBAAiB,IAAI,IAAI;IAgBzB,oBAAoB,IAAI,IAAI;IAQ5B,YAAY,IAAI,IAAI;IAWpB,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAS/D,OAAO,CAAC,kBAAkB;IAuB1B,OAAO,CAAC,oBAAoB;IA2B5B,OAAO,CAAC,YAAY;IA2BpB,gBAAgB;IAChB,OAAO,CAAC,gBAAgB,CAQtB;IAEF,gBAAgB;IAChB,OAAO,CAAC,iBAAiB,CAevB;IAEF,gBAAgB;IAChB,OAAO,CAAC,cAAc,CA6DpB;IAIO,MAAM;CAkBhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,SAAS,CAAC;KACtB;CACF"}

package/dist/components/hx-tabs/hx-tabs.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const helixTabsStyles: import('lit').CSSResult;
+//# sourceMappingURL=hx-tabs.styles.d.ts.map

package/dist/components/hx-tabs/hx-tabs.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-tabs.styles.d.ts","sourceRoot":"","sources":["../../../src/components/hx-tabs/hx-tabs.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,eAAe,yBA4E3B,CAAC"}

package/dist/components/hx-tabs/index.d.ts

@@ -0,0 +1,4 @@
+export { HelixTabs } from './hx-tabs.js';
+export { HelixTab } from './hx-tab.js';
+export { HelixTabPanel } from './hx-tab-panel.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/hx-tabs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/hx-tabs/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/components/hx-tabs/index.js

@@ -0,0 +1,7 @@
+import { H as b, a as l, b as s } from "../../shared/hx-tab-panel-8p6KfVzz.js";
+export {
+  b as HelixTab,
+  l as HelixTabPanel,
+  s as HelixTabs
+};
+//# sourceMappingURL=index.js.map

package/dist/components/hx-tabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/hx-tag/hx-tag.d.ts

@@ -0,0 +1,97 @@
+import { LitElement } from 'lit';
+/**
+ * A compact label for categorization, filtering, and selection.
+ *
+ * @summary Compact tag/chip for categorization, filtering, and selection.
+ *
+ * @tag hx-tag
+ *
+ * @slot - Default slot for tag label text.
+ * @slot prefix - Icon or avatar rendered before the label.
+ * @slot suffix - Content rendered after the label.
+ *
+ * @fires {CustomEvent<void>} hx-remove - Dispatched when the user clicks the remove button.
+ *
+ * @csspart base - The root tag element.
+ * @csspart prefix - The prefix slot wrapper.
+ * @csspart label - The label slot wrapper.
+ * @csspart suffix - The suffix slot wrapper.
+ * @csspart remove-button - The remove/dismiss button.
+ *
+ * @cssprop [--hx-tag-bg=var(--hx-color-neutral-100)] - Tag background color.
+ * @cssprop [--hx-tag-color=var(--hx-color-neutral-700)] - Tag text color.
+ * @cssprop [--hx-tag-border-color=var(--hx-color-neutral-200)] - Tag border color.
+ * @cssprop [--hx-tag-font-size] - Tag font size (set per size variant).
+ * @cssprop [--hx-tag-font-weight=var(--hx-font-weight-medium)] - Tag font weight.
+ * @cssprop [--hx-tag-font-family=var(--hx-font-family-sans)] - Tag font family.
+ * @cssprop [--hx-tag-border-radius=var(--hx-border-radius-sm)] - Tag border radius (non-pill mode).
+ * @cssprop [--hx-tag-border-radius-pill=var(--hx-border-radius-full)] - Border radius in pill mode. Independent of --hx-tag-border-radius so consumer overrides don't break pill shape.
+ * @cssprop [--hx-tag-padding-x] - Tag horizontal padding (set per size variant).
+ * @cssprop [--hx-tag-padding-y] - Tag vertical padding (set per size variant).
+ *
+ * @note Visual style variants (filled/outlined/ghost) are not supported. This component
+ * intentionally provides only filled-style tags with color variation via the `variant` prop.
+ *
+ * @note aria-live removal announcements are the consuming application's responsibility.
+ * When a tag is removed from the DOM, applications should announce the change via their
+ * own aria-live region to inform screen reader users of clinical data filter changes.
+ */
+export declare class HelixTag extends LitElement {
+    static styles: import('lit').CSSResult[];
+    /**
+     * Visual style variant of the tag.
+     * @attr variant
+     */
+    variant: 'default' | 'primary' | 'success' | 'warning' | 'danger';
+    /**
+     * Size of the tag.
+     * @attr hx-size
+     * @note The attribute name is `hx-size` (not `size`) to avoid conflict with the native
+     * `size` attribute. Storybook autodocs controls bind to the property name `size`; when
+     * writing HTML or Drupal Twig templates always use the `hx-size` attribute name.
+     */
+    size: 'sm' | 'md' | 'lg';
+    /**
+     * Whether the tag uses fully rounded (pill) styling.
+     * @attr pill
+     */
+    pill: boolean;
+    /**
+     * Whether the tag renders a dismiss button.
+     * @attr removable
+     */
+    removable: boolean;
+    /**
+     * Whether the tag is disabled. When disabled, interactions are suppressed.
+     * @attr disabled
+     */
+    disabled: boolean;
+    /**
+     * Text from the default slot only (excludes prefix/suffix slotted content).
+     * Used to build the remove button's aria-label without polluting it with icon text.
+     * @internal
+     */
+    private _defaultSlotText;
+    /** @internal Whether the prefix slot has assigned content. */
+    private _hasPrefix;
+    /** @internal Whether the suffix slot has assigned content. */
+    private _hasSuffix;
+    /** @internal */
+    private _handleRemove;
+    /** @internal Updates _defaultSlotText from only the default slot's text nodes. */
+    private _onDefaultSlotChange;
+    /** @internal */
+    private _onPrefixSlotChange;
+    /** @internal */
+    private _onSuffixSlotChange;
+    render(): import('lit-html').TemplateResult<1>;
+}
+export type HxTag = HelixTag;
+/** @deprecated Use {@link HxTag} instead. The `Wc` prefix was a legacy alias. */
+export type WcTag = HelixTag;
+declare global {
+    interface HTMLElementTagNameMap {
+        'hx-tag': HelixTag;
+    }
+}
+//# sourceMappingURL=hx-tag.d.ts.map

package/dist/components/hx-tag/hx-tag.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-tag.d.ts","sourceRoot":"","sources":["../../../src/components/hx-tag/hx-tag.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;AAMhD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,qBACa,QAAS,SAAQ,UAAU;IACtC,OAAgB,MAAM,4BAAiC;IAEvD;;;OAGG;IAEH,OAAO,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAa;IAE9E;;;;;;OAMG;IAEH,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAEhC;;;OAGG;IAEH,IAAI,UAAS;IAEb;;;OAGG;IAEH,SAAS,UAAS;IAElB;;;OAGG;IAEH,QAAQ,UAAS;IAIjB;;;;OAIG;IACM,OAAO,CAAC,gBAAgB,CAAM;IAEvC,8DAA8D;IACrD,OAAO,CAAC,UAAU,CAAS;IAEpC,8DAA8D;IACrD,OAAO,CAAC,UAAU,CAAS;IAIpC,gBAAgB;IAChB,OAAO,CAAC,aAAa;IAUrB,kFAAkF;IAClF,OAAO,CAAC,oBAAoB;IAU5B,gBAAgB;IAChB,OAAO,CAAC,mBAAmB;IAK3B,gBAAgB;IAChB,OAAO,CAAC,mBAAmB;IAOlB,MAAM;CAgDhB;AAED,MAAM,MAAM,KAAK,GAAG,QAAQ,CAAC;AAE7B,iFAAiF;AACjF,MAAM,MAAM,KAAK,GAAG,QAAQ,CAAC;AAE7B,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,QAAQ,EAAE,QAAQ,CAAC;KACpB;CACF"}

package/dist/components/hx-tag/hx-tag.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const helixTagStyles: import('lit').CSSResult;
+//# sourceMappingURL=hx-tag.styles.d.ts.map

package/dist/components/hx-tag/hx-tag.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-tag.styles.d.ts","sourceRoot":"","sources":["../../../src/components/hx-tag/hx-tag.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,yBAiI1B,CAAC"}

package/dist/components/hx-tag/index.d.ts

@@ -0,0 +1,2 @@
+export { HelixTag } from './hx-tag.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/hx-tag/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/hx-tag/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC"}

package/dist/components/hx-tag/index.js

@@ -0,0 +1,5 @@
+import { H as o } from "../../shared/hx-tag-BP7HJ6_0.js";
+export {
+  o as HelixTag
+};
+//# sourceMappingURL=index.js.map

package/dist/components/hx-tag/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/hx-text/hx-text.d.ts

@@ -0,0 +1,90 @@
+import { LitElement } from 'lit';
+/**
+ * A semantic typography wrapper that applies consistent text styles using design tokens.
+ *
+ * @summary Presentational text wrapper for consistent typography across variants, weights, and colors.
+ *
+ * @tag hx-text
+ *
+ * @slot - Default slot for text content.
+ *
+ * @csspart base - The inner element (tag determined by the `as` property).
+ *
+ * @cssprop [--hx-text-font-size] - Font size (set per variant).
+ * @cssprop [--hx-text-font-weight] - Font weight (overridden by weight prop).
+ * @cssprop [--hx-text-line-height] - Line height (set per variant).
+ * @cssprop [--hx-text-letter-spacing] - Letter spacing (set per variant).
+ * @cssprop [--hx-text-color] - Text color (set per color prop).
+ *
+ * @example
+ * <!-- Drupal/Twig usage (CDN):
+ *   <hx-text variant="body" color="default">Patient name here</hx-text>
+ *   <hx-text variant="label" weight="semibold">Date of Birth</hx-text>
+ *   <hx-text variant="caption" color="subtle">Last reviewed on 2026-03-05</hx-text>
+ *   <!-- Truncate (boolean attr — omit to disable, include to enable): -->
+ *   <hx-text truncate>Long patient note that gets clipped</hx-text>
+ *   <!-- Multi-line clamp (numeric attr): -->
+ *   <hx-text lines="3">Paragraph of clinical notes...</hx-text>
+ *   <!-- Semantic element override: -->
+ *   <hx-text as="p" variant="body">Paragraph-level content.</hx-text>
+ *   <hx-text as="strong" variant="label">Bold label</hx-text>
+ * -->
+ */
+export declare class HelixText extends LitElement {
+    static styles: import('lit').CSSResult[];
+    /**
+     * Typography variant controlling font size, line height, and letter spacing.
+     *
+     * Note: The public variant set (body / body-sm / body-lg / label / label-sm / caption / code /
+     * overline) intentionally extends the original audit spec (body / lead / small / caption /
+     * overline). `lead` and `small` were replaced with the more granular `body-lg`, `body-sm`,
+     * `label`, `label-sm`, and `code` variants to better serve healthcare UI density requirements.
+     * There are no `lead` or `small` variants — consumers must use `body-lg` and `body-sm`
+     * respectively.
+     *
+     * @attr variant
+     */
+    variant: 'body' | 'body-sm' | 'body-lg' | 'label' | 'label-sm' | 'caption' | 'code' | 'overline';
+    /**
+     * Font weight override. When unset, the variant's default weight is used.
+     * @attr weight
+     */
+    weight: 'regular' | 'medium' | 'semibold' | 'bold' | undefined;
+    /**
+     * Semantic color intent.
+     * @attr color
+     */
+    color: 'default' | 'subtle' | 'disabled' | 'inverse' | 'danger' | 'success' | 'warning';
+    /**
+     * When true, clips text to a single line with an ellipsis overflow.
+     * @attr truncate
+     */
+    truncate: boolean;
+    /**
+     * Maximum number of lines to display before clamping with ellipsis.
+     * When set, overrides `truncate`. Set to 0 to disable.
+     * @attr lines
+     */
+    lines: number;
+    /**
+     * The HTML element to render as the inner base element.
+     * Use to produce semantically appropriate markup (e.g., `p`, `strong`, `em`).
+     * Defaults to `span` for inline usage.
+     *
+     * In Drupal Twig: `<hx-text as="p" variant="body">...</hx-text>`
+     *
+     * @attr as
+     */
+    as: 'span' | 'p' | 'strong' | 'em' | 'div';
+    /** Validates `as` against the allowed element list to prevent injection. */
+    private get _safeTag();
+    render(): import('lit-html').TemplateResult;
+}
+/** @deprecated Use `HelixText` directly. Kept for backward compatibility. */
+export type WcText = HelixText;
+declare global {
+    interface HTMLElementTagNameMap {
+        'hx-text': HelixText;
+    }
+}
+//# sourceMappingURL=hx-text.d.ts.map

package/dist/components/hx-text/hx-text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-text.d.ts","sourceRoot":"","sources":["../../../src/components/hx-text/hx-text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AASjC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,qBACa,SAAU,SAAQ,UAAU;IACvC,OAAgB,MAAM,4BAAkC;IAExD;;;;;;;;;;;OAWG;IAEH,OAAO,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,UAAU,GAAG,SAAS,GAAG,MAAM,GAAG,UAAU,CACvF;IAET;;;OAGG;IAEH,MAAM,EAAE,SAAS,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,GAAG,SAAS,CAAa;IAE3E;;;OAGG;IAEH,KAAK,EAAE,SAAS,GAAG,QAAQ,GAAG,UAAU,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,CAC3E;IAEZ;;;OAGG;IAEH,QAAQ,UAAS;IAEjB;;;;OAIG;IAEH,KAAK,SAAK;IAEV;;;;;;;;OAQG;IAEH,EAAE,EAAE,MAAM,GAAG,GAAG,GAAG,QAAQ,GAAG,IAAI,GAAG,KAAK,CAAU;IAEpD,4EAA4E;IAC5E,OAAO,KAAK,QAAQ,GAGnB;IAEQ,MAAM;CA8BhB;AAED,6EAA6E;AAC7E,MAAM,MAAM,MAAM,GAAG,SAAS,CAAC;AAE/B,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,SAAS,CAAC;KACtB;CACF"}

package/dist/components/hx-text/hx-text.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const helixTextStyles: import('lit').CSSResult;
+//# sourceMappingURL=hx-text.styles.d.ts.map

package/dist/components/hx-text/hx-text.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-text.styles.d.ts","sourceRoot":"","sources":["../../../src/components/hx-text/hx-text.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,eAAe,yBAqJ3B,CAAC"}

package/dist/components/hx-text/index.d.ts

@@ -0,0 +1,2 @@
+export { HelixText } from './hx-text.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/hx-text/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/hx-text/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC"}

package/dist/components/hx-text/index.js

@@ -0,0 +1,5 @@
+import { H as o } from "../../shared/hx-text-DDSH1alC.js";
+export {
+  o as HelixText
+};
+//# sourceMappingURL=index.js.map

package/dist/components/hx-text/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/hx-text-input/hx-text-input.d.ts

@@ -0,0 +1,188 @@
+import { LitElement } from 'lit';
+/**
+ * A text input component with label, validation, and form association.
+ * Supports accessible labeling via `label` property, `aria-label` attribute, or the `label` slot.
+ * Uses `aria-invalid`, `aria-describedby`, and `aria-required` on the native input for screen reader support.
+ * Error messages are announced via `role="alert"`. Keyboard navigation follows native input behavior.
+ *
+ * @summary Form-associated text input with built-in label, error, and help text.
+ *
+ * @tag hx-text-input
+ *
+ * @slot label - Custom label content (overrides the label property). Use for Drupal Form API rendered labels.
+ * @slot prefix - Content rendered before the input (e.g., icon).
+ * @slot suffix - Content rendered after the input (e.g., icon or button).
+ * @slot help-text - Custom help text content (overrides the helpText property).
+ * @slot error - Custom error content (overrides the error property). Use for Drupal Form API rendered errors.
+ *
+ * @fires {CustomEvent<{value: string}>} hx-input - Dispatched on every keystroke as the user types.
+ * @fires {CustomEvent<{value: string}>} hx-change - Dispatched when the input loses focus after its value changed.
+ *
+ * @csspart field - The outer field container.
+ * @csspart label - The label element.
+ * @csspart input-wrapper - The wrapper around prefix, input, and suffix.
+ * @csspart input - The native input element.
+ * @csspart help-text - The help text container.
+ * @csspart error - The error message container.
+ *
+ * @cssprop [--hx-input-bg=var(--hx-color-neutral-0)] - Input background color.
+ * @cssprop [--hx-input-color=var(--hx-color-neutral-800)] - Input text color.
+ * @cssprop [--hx-input-border-color=var(--hx-color-neutral-300)] - Input border color.
+ * @cssprop [--hx-input-border-radius=var(--hx-border-radius-md)] - Input border radius.
+ * @cssprop [--hx-input-font-family=var(--hx-font-family-sans)] - Input font family.
+ * @cssprop [--hx-input-focus-ring-color=var(--hx-focus-ring-color)] - Focus ring color.
+ * @cssprop [--hx-input-error-color=var(--hx-color-error-500)] - Error state color.
+ * @cssprop [--hx-input-label-color=var(--hx-color-neutral-700)] - Label text color.
+ * @cssprop [--hx-input-sm-font-size=0.875rem] - Font size for the sm size variant.
+ * @cssprop [--hx-input-lg-font-size=1.125rem] - Font size for the lg size variant.
+ */
+export declare class HelixTextInput extends LitElement {
+    static styles: import('lit').CSSResult[];
+    /** @internal */
+    static formAssociated: boolean;
+    /** @internal */
+    private _internals;
+    constructor();
+    /**
+     * The visible label text for the input.
+     * @attr label
+     */
+    label: string;
+    /**
+     * Placeholder text shown when the input is empty.
+     * @attr placeholder
+     */
+    placeholder: string;
+    /**
+     * The current value of the input.
+     * @attr value
+     */
+    value: string;
+    /**
+     * The type of the native input element.
+     * @attr type
+     */
+    type: 'text' | 'email' | 'password' | 'tel' | 'url' | 'search' | 'number' | 'date';
+    /**
+     * Whether the input is required for form submission.
+     * @attr required
+     */
+    required: boolean;
+    /**
+     * Whether the input is disabled.
+     * @attr disabled
+     */
+    disabled: boolean;
+    /**
+     * Error message to display. When set, the input enters an error state.
+     * @attr error
+     */
+    error: string;
+    /**
+     * Help text displayed below the input for guidance.
+     * @attr help-text
+     */
+    helpText: string;
+    /**
+     * The name of the input, used for form submission.
+     * @attr name
+     */
+    name: string;
+    /**
+     * Accessible name for screen readers, if different from the visible label.
+     * @attr aria-label
+     */
+    ariaLabel: string | null;
+    /**
+     * Whether the input is read-only.
+     * @attr readonly
+     */
+    readonly: boolean;
+    /**
+     * Minimum number of characters allowed.
+     * @attr minlength
+     */
+    minlength: number | undefined;
+    /**
+     * Maximum number of characters allowed.
+     * @attr maxlength
+     */
+    maxlength: number | undefined;
+    /**
+     * A regular expression pattern the value must match for form validation.
+     * @attr pattern
+     */
+    pattern: string;
+    /**
+     * Hint for the browser's autocomplete feature. Accepts standard HTML autocomplete values.
+     * @attr autocomplete
+     */
+    autocomplete: string;
+    /**
+     * Visual size of the input field.
+     * @attr hx-size
+     */
+    size: 'sm' | 'md' | 'lg';
+    /** @internal */
+    private _input;
+    /** @internal */
+    private _hasLabelSlot;
+    /** @internal */
+    private _hasErrorSlot;
+    /** @internal */
+    private _hasPrefixSlot;
+    /** @internal */
+    private _hasSuffixSlot;
+    /** @internal */
+    private _hasHelpTextSlot;
+    /** @internal */
+    private _handleLabelSlotChange;
+    /** @internal */
+    private _handleErrorSlotChange;
+    /** @internal */
+    private _handlePrefixSlotChange;
+    /** @internal */
+    private _handleSuffixSlotChange;
+    /** @internal */
+    private _handleHelpTextSlotChange;
+    updated(changedProperties: Map<string, unknown>): void;
+    /** Returns the associated form element, if any. */
+    get form(): HTMLFormElement | null;
+    /** Returns the validation message. */
+    get validationMessage(): string;
+    /** Returns the ValidityState object. */
+    get validity(): ValidityState;
+    /** Checks whether the input satisfies its constraints. */
+    checkValidity(): boolean;
+    /** Reports validity and shows the browser's constraint validation UI. */
+    reportValidity(): boolean;
+    /** @internal */
+    private _updateValidity;
+    formResetCallback(): void;
+    formStateRestoreCallback(state: string): void;
+    /** @internal */
+    private _handleInput;
+    /** @internal */
+    private _handleChange;
+    /** Moves focus to the input element. */
+    focus(options?: FocusOptions): void;
+    /** Selects all text in the input. */
+    select(): void;
+    /** @internal */
+    private _inputId;
+    /** @internal */
+    private _helpTextId;
+    /** @internal */
+    private _errorId;
+    render(): import('lit-html').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'hx-text-input': HelixTextInput;
+    }
+}
+/** Primary type alias for hx-text-input */
+export type HxTextInput = HelixTextInput;
+/** @deprecated Use HxTextInput instead */
+export type WcTextInput = HelixTextInput;
+//# sourceMappingURL=hx-text-input.d.ts.map

package/dist/components/hx-text-input/hx-text-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-text-input.d.ts","sourceRoot":"","sources":["../../../src/components/hx-text-input/hx-text-input.ts"],"names":[],"mappings":"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"}