@kitn.ai/ui 0.26.0 → 0.28.0

package/dist/ui/checkbox-group.d.ts

@@ -0,0 +1,83 @@
+import { JSX } from 'solid-js';
+/** One choice in a {@link CheckboxGroup}. */
+export interface CheckboxOption<T = string> {
+    /** The value this row selects. Compared to the group's `value` by identity. */
+    value: T;
+    /** The row's visible label. */
+    label: JSX.Element;
+    /** Optional second line under the label. */
+    description?: JSX.Element;
+    /** Disable this row alone (the group's `disabled` disables all of them). */
+    disabled?: boolean;
+}
+export interface CheckboxGroupProps<T = string> extends Omit<JSX.HTMLAttributes<HTMLDivElement>, 'onChange' | 'children'> {
+    /**
+     * The choices, in display order. Rendered in full: the kit never truncates,
+     * re-orders or de-duplicates a consumer's option list.
+     */
+    options: readonly CheckboxOption<T>[];
+    /** The selected values. Each option is checked when its `value` is in here (by identity). */
+    value?: readonly T[];
+    /**
+     * The shared form-control name every box in the group carries, so a native form
+     * submits the whole selection under one key and `FormData.getAll(name)` reads it back.
+     *
+     * UNLIKE {@link RadioGroup}, this has no default. A radio group needs a shared `name`
+     * for the browser to make the set exclusive and arrow-navigable, so one is generated
+     * when none is given; checkboxes are independent controls and need nothing to behave
+     * correctly. Generating a name here would submit the selection under a random key,
+     * which is worse than submitting nothing.
+     */
+    name?: string;
+    /** Disable every row. */
+    disabled?: boolean;
+    /** Accessible name for the group. Rendered as `aria-label` on the `group`. */
+    label?: string;
+    /**
+     * Fires on every toggle with the NEXT selection, plus the option that moved and
+     * which way it went. The next selection is a fresh array — the group holds no state
+     * of its own, so `value` is yours to own.
+     */
+    onChange?: (value: T[], option: CheckboxOption<T>, checked: boolean) => void;
+    /** Fires when a box loses focus — the commit point for a form field. */
+    onOptionBlur?: () => void;
+    /** Extra classes for each row. */
+    itemClass?: string;
+    /**
+     * Presentation slot. Replaces the default label/description column with whatever
+     * you return, so a row can carry media, a badge or a price without a second
+     * checkbox component existing. The control, the row chrome and the group semantics
+     * stay ours.
+     */
+    children?: (option: CheckboxOption<T>, state: {
+        checked: boolean;
+        disabled: boolean;
+    }) => JSX.Element;
+}
+/**
+ * A vertical set of checkbox rows in a bordered, divided list — the kit's standard
+ * "pick any number" control, and {@link RadioGroup}'s sibling: same options shape,
+ * same row chrome, same presentation slot, multi-value instead of single.
+ *
+ * Every row is a real `<input type="checkbox">` inside a `<label>`, so clicking
+ * anywhere on the row toggles it and the keyboard behaviour (a tab stop per box,
+ * Space to toggle) is the browser's rather than a reimplementation. The wrapper is
+ * `role="group"`, not `role="listbox"`: the boxes are independent controls and
+ * nothing here overrides what they already announce.
+ *
+ * Everything not listed in `CheckboxGroupProps` is forwarded to the group element, so
+ * `id`, `aria-labelledby`, any other `aria-*` and any `data-*` hook land where a form
+ * expects them. No validation is applied — "at least one" is your application's rule,
+ * not the kit's.
+ *
+ * ```tsx
+ * <CheckboxGroup
+ *   label="Environments"
+ *   name="env"
+ *   options={[{ value: 'prod', label: 'Production' }, { value: 'staging', label: 'Staging' }]}
+ *   value={envs()}
+ *   onChange={setEnvs}
+ * />
+ * ```
+ */
+export declare function CheckboxGroup<T = string>(props: CheckboxGroupProps<T>): JSX.Element;

package/dist/ui/checkbox.d.ts

@@ -0,0 +1,40 @@
+import { JSX } from 'solid-js';
+export interface CheckboxProps extends Omit<JSX.InputHTMLAttributes<HTMLInputElement>, 'type' | 'children'> {
+    /**
+     * The mixed / partially-checked state ("some of the things below are ticked").
+     *
+     * `indeterminate` is a DOM PROPERTY with no HTML attribute, so it cannot be set
+     * from markup — every caller that wanted it used to reach for a `ref` plus a
+     * `createEffect`. That effect now lives in here, once, and callers pass a prop.
+     *
+     * Note that the property is purely visual plus an accessibility hint: a checkbox
+     * whose `indeterminate` is true still reports `checked === false` and submits
+     * accordingly. A native indeterminate checkbox already announces as "mixed", so
+     * this component does not stamp `aria-checked="mixed"` on top of it — pass one
+     * yourself if you also want the attribute in the DOM.
+     */
+    indeterminate?: boolean;
+}
+/**
+ * A checkbox. A REAL `<input type="checkbox">` behind `appearance: none`, styled by
+ * the kit's `.kai-checkbox` rule, never a `<div>` wearing `role="checkbox"`.
+ *
+ * That is the whole design: the native control brings keyboard operation (Space),
+ * the `:focus-visible` ring, form participation via `name` / `value`, and correct
+ * screen-reader announcement — all of it for free and all of it correct. Every
+ * accessibility defect this kit's control audit found was in a control that had
+ * replaced the native element with something hand-rolled.
+ *
+ * Everything not listed in `CheckboxProps` is forwarded to the input, so `id`,
+ * `name`, `value`, `required`, `disabled`, `aria-*` and any `data-*` hook behave
+ * exactly as they do on a plain `<input>`.
+ *
+ * Validation is deliberately absent. `required` is passed through to the native
+ * attribute and nothing else — whether an unchecked box is an error is the
+ * consuming application's call, not the kit's.
+ *
+ * ```tsx
+ * <Checkbox name="notify" checked={on()} onChange={(e) => setOn(e.currentTarget.checked)} />
+ * ```
+ */
+export declare function Checkbox(props: CheckboxProps): JSX.Element;

package/dist/ui/dock.d.ts

@@ -38,6 +38,19 @@ export interface DockProps {
     unread?: boolean;
     /** Disable the launcher. */
     disabled?: boolean;
+    /** Suppress the dock's own built-in mobile `[part="close"]` X. Off (rendered) by
+     *  default — the built-in X is the FALLBACK close route for panel content with no
+     *  header of its own, which is the general case the dock has to cover since it
+     *  never reads what it holds. Set `true` when the slotted/composed content
+     *  supplies its own close affordance in its own header row (e.g. `ChatThread`'s
+     *  `headerEndContent`) — with both present the two X's stack, one floating over
+     *  the other's row, which is exactly the "doesn't look intentional" feedback this
+     *  prop exists to let a caller avoid. TRADEOFF: the mobile panel reserves a
+     *  padding band above its content so the built-in X never paints over it; that
+     *  band stays reserved unless you set `hideClose` true, so only set it once your
+     *  own control is actually in place — otherwise you get the band with no X to
+     *  justify it. */
+    hideClose?: boolean;
     /** Where focus lands on open. Defaults to `content`. */
     focusOnOpen?: DockFocusOnOpen;
     /** Controlled open state. When set, the component never changes it itself — drive it
@@ -68,6 +81,35 @@ export interface DockProps {
 export declare function DockLauncherGlyph(): JSX.Element;
 /** The built-in open glyph. Exported for the same reason as {@link DockLauncherGlyph}. */
 export declare function DockCloseGlyph(): JSX.Element;
+export interface DockLauncherImageProps {
+    /** The icon URL. */
+    src: string;
+    /** Alt text — usually left empty: the launcher BUTTON already carries the
+     *  accessible name (Dock derives it from `label`/`openLabel`/`closeLabel`),
+     *  so a second name on the icon inside it would be redundant, not missing. */
+    alt?: string;
+}
+/**
+ * A branded launcher icon with a built-in fallback to {@link DockLauncherGlyph}
+ * on load failure — a dead link, or a placeholder URL nobody swapped for a
+ * real asset yet (exactly what shipped in `kai dev`'s own `owner-widget`
+ * fixture: `launcherIcon: "https://example.com/logo.png"`, which never
+ * resolves, so the FAB rendered a permanently broken image). Decides loudly
+ * with one `console.warn` naming the failing URL, then swaps — never a
+ * silent broken-image icon sitting in the corner of someone's page.
+ *
+ * Lives here, not on {@link Dock} itself: `Dock`'s `launcher` prop is
+ * deliberately ANY content (an emoji, a "Support" text pill, this image,
+ * whatever a consumer slots in) and the dock never inspects what it's
+ * holding — teaching it to specifically understand "this might be an
+ * `<img>` that can 404" would be the one prop where that boundary breaks.
+ * This is a plain sibling component a `launcher` value can be built FROM,
+ * same relationship `DockLauncherGlyph`/`DockCloseGlyph` already have to
+ * `Dock`. The construct engine's `emitDockLauncher` (codegen.ts) renders
+ * `<DockLauncherImage src={...} />` for a construct-authored `launcherIcon`
+ * rather than hand-rolling the same onError dance in emitted output.
+ */
+export declare function DockLauncherImage(props: DockLauncherImageProps): JSX.Element;
 /**
  * Dock — a corner-docked launcher button with a panel that opens above it.
  *
@@ -94,6 +136,15 @@ export declare function DockCloseGlyph(): JSX.Element;
  *   own menus; swallowing a key from a page you are a guest on is a decide-quietly move.
  * - **No focus trap**, deliberately, unlike `kai-dialog`. The page staying usable is
  *   the whole point of "docked", which is also why the panel is `aria-modal="false"`.
+ * - **Mobile close route.** At <=480px the panel goes full-bleed and the launcher
+ *   hides while it is open — a floating launcher over a full-bleed panel is not an
+ *   obvious close affordance. The panel gets its own `[part="close"]` X, top-right,
+ *   CSS-gated by the SAME media query and `[data-expanded]`, so it needs no viewport
+ *   JS. Desktop is unaffected: the launcher keeps toggling and no X ever renders.
+ *   This is the FALLBACK route, for panel content with no header of its own to hold
+ *   a close control — content that does (a `ChatThread` using `headerEndContent`,
+ *   say) passes `hideClose` to drop this X instead of stacking a second one over
+ *   its own header row.
  *
  * WHAT IT REFUSES: it never aborts a request, never persists its own open state, never
  * decides what "unread" means, and never clears `unread` on open — writing over a

package/dist/ui/icon.d.ts

@@ -1,4 +1,7 @@
 import { JSX } from 'solid-js';
+/** Every curated icon name, sorted. Derived from `NAMED_ICONS` so a gallery,
+ *  a story control or a test can never drift from the map itself. */
+export declare const ICON_NAMES: readonly string[];
 /** Render an item icon.
  *
  *  Resolution order:

package/dist/ui/input.d.ts

@@ -1,4 +1,7 @@
 import { JSX } from 'solid-js';
+import { CaseMode } from '../primitives/field-mask.js';
+import { FieldSemanticType } from '../primitives/field-semantics.js';
+import { CopyPolicy, InputMaskRejectReason } from '../primitives/input-mask.js';
 export interface InputProps extends Omit<JSX.InputHTMLAttributes<HTMLInputElement>, 'onInput' | 'onChange' | 'size'> {
     /** Field label rendered above the control and linked via `for`/`id`. */
     label?: string;
@@ -14,12 +17,55 @@ export interface InputProps extends Omit<JSX.InputHTMLAttributes<HTMLInputElemen
     leading?: JSX.Element;
     /** Trailing affix (icon, inline button). Rendered inside the field row, after the input. */
     trailing?: JSX.Element;
-    /** Fires per keystroke with the current value. */
+    /** Fires per keystroke with the current value — the CANONICAL value when a mask is
+     *  active (digits for `tel`/`ssn`/`credit-card`, the formatted text for
+     *  `custom`), and the raw text of the field otherwise. */
     onValueInput?: (value: string) => void;
-    /** Fires on commit (blur) with the current value. */
+    /** Fires on commit (blur) with the current value; canonical when a mask is active. */
     onValueChange?: (value: string) => void;
+    /** Tier-2 mask pattern: `#` a digit, `@` an alphanumeric, `*` an obscurable
+     *  alphanumeric, everything else a positional literal (`@@@-####`).
+     *
+     *  The literal `default` is the OPT-IN sentinel: it resolves to the default format of
+     *  `semantic` (`tel` → `###-###-####`). It cannot collide with a real pattern — `default`
+     *  as a format is eight literals with no fill position, i.e. a field that can hold
+     *  nothing — and an opt-in token is needed because decision 1 forbids a bare semantic
+     *  type from starting to mask on its own. */
+    format?: string;
+    /** The placeholder guide shown at unfilled positions, aligned position-for-position
+     *  with `format` (`   -   -    `, `mm/dd/yyyy`). Without it the field shows only up
+     *  to the last typed character. */
+    guide?: string;
+    /** Tier-1 semantic type. On its own it applies `inputmode` / `autocomplete` /
+     *  `spellcheck` / `autocorrect` / `autocapitalize` and decides the canonical value —
+     *  it never starts masking by itself. */
+    semantic?: FieldSemanticType;
+    /** Case folding applied to typed and pasted text. Defaults to `preserve`. */
+    caseMode?: CaseMode;
+    /** What a copy or cut of a masked field puts on the clipboard. Defaults to `canonical`. */
+    copyPolicy?: CopyPolicy;
+    /** A mask refused, or partly refused, some content — `full`, `wrong-class`,
+     *  `over-capacity`, or `format-change-clipped`. Not a scalar and therefore not an
+     *  attribute: the facade projects this onto its `kai-input-rejected` event.
+     *
+     *  NOT an error state. `format-change-clipped` in particular fires on a routine
+     *  reactive `format` change, so this widget deliberately does not touch `invalid` —
+     *  validity belongs to the consumer, and stays there. */
+    onMaskReject?: (detail: {
+        reason: InputMaskRejectReason;
+        data: string;
+    }) => void;
 }
+/** The `format` value that means: resolve the default format of the semantic type.
+ *
+ *  EXPORTED because `src/elements/input.tsx` has to recognise the same sentinel when it
+ *  resolves a seeded value ahead of the masker, and a restated literal there would fail
+ *  SILENTLY if this string ever changed: `format === 'default'` would simply go false and
+ *  `compileMask('default')` would compile seven literals, garbling the seed with no error
+ *  anywhere. One exported constant instead of two copies of a magic string. */
+export declare const DEFAULT_FORMAT = "default";
 export declare const FIELD_BASE = "w-full rounded-md border border-input bg-background px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:opacity-50 disabled:pointer-events-none";
+export declare const FIELD_INVALID = "border-destructive dark:border-red-400/70";
 /**
  * `Input`: the token-themed single-line text field shell. A label/hint/error
  * stack around a field row that holds an optional `leading` affix, the

package/dist/ui/radio.d.ts

@@ -0,0 +1,85 @@
+import { JSX } from 'solid-js';
+export interface RadioProps extends Omit<JSX.InputHTMLAttributes<HTMLInputElement>, 'type' | 'children'> {
+}
+/**
+ * A single radio button. A REAL `<input type="radio">` behind `appearance: none`,
+ * styled by the kit's `.kai-radio` rule, never a `<div role="radio">`.
+ *
+ * The native element is what makes a set of radios a GROUP: browsers give same-`name`
+ * radios one tab stop, arrow-key navigation between them, mutual exclusion and form
+ * participation, and screen readers announce "2 of 4". None of that is reimplementable
+ * for free, and every hand-rolled radio in this kit's control audit had lost some of it.
+ *
+ * Use {@link RadioGroup} for a set. Reach for a bare `Radio` when you are laying the
+ * group out yourself — give every member the same `name`.
+ *
+ * Everything not listed in `RadioProps` is forwarded to the input, so `id`, `name`,
+ * `value`, `required`, `disabled`, `aria-*` and any `data-*` hook behave exactly as
+ * they do on a plain `<input>`. No validation is applied: `required` reaches the
+ * native attribute and stops there.
+ */
+export declare function Radio(props: RadioProps): JSX.Element;
+/** One choice in a {@link RadioGroup}. */
+export interface RadioOption<T = string> {
+    /** The value this row selects. Compared to the group's `value` by identity. */
+    value: T;
+    /** The row's visible label. */
+    label: JSX.Element;
+    /** Optional second line under the label. */
+    description?: JSX.Element;
+    /** Disable this row alone (the group's `disabled` disables all of them). */
+    disabled?: boolean;
+}
+export interface RadioGroupProps<T = string> extends Omit<JSX.HTMLAttributes<HTMLDivElement>, 'onChange' | 'children'> {
+    /** The choices, in display order. */
+    options: readonly RadioOption<T>[];
+    /** The selected value. Matched against each option's `value` by identity. */
+    value?: T;
+    /**
+     * The shared form-control name every radio in the group carries — what makes the
+     * browser treat them as one control. Defaults to a generated id, so the group is
+     * exclusive and keyboard-navigable even when nothing is being submitted.
+     */
+    name?: string;
+    /** Disable every row. */
+    disabled?: boolean;
+    /** Accessible name for the group. Rendered as `aria-label` on the `radiogroup`. */
+    label?: string;
+    /** Fires with the newly selected value (and its option) on selection. */
+    onChange?: (value: T, option: RadioOption<T>) => void;
+    /** Fires when a radio loses focus — the commit point for a form field. */
+    onOptionBlur?: () => void;
+    /** Extra classes for each row. */
+    itemClass?: string;
+    /**
+     * Presentation slot. Replaces the default label/description column with whatever
+     * you return, so a row can carry media, a badge or a price without a second radio
+     * component existing. The control, the row chrome and the group semantics stay ours.
+     */
+    children?: (option: RadioOption<T>, state: {
+        checked: boolean;
+        disabled: boolean;
+    }) => JSX.Element;
+}
+/**
+ * A vertical set of radio rows in a bordered, divided list — the kit's standard
+ * "pick exactly one" control.
+ *
+ * The group is a `role="radiogroup"` wrapper around real `<input type="radio">`s that
+ * share a `name`, so the keyboard behaviour (one tab stop, arrows to move) is the
+ * browser's and not a reimplementation. Clicking anywhere on a row selects it, because
+ * each row is a `<label>`.
+ *
+ * Everything not listed in `RadioGroupProps` is forwarded to the group element, so
+ * `id`, `aria-*` and any `data-*` hook land where a form expects them.
+ *
+ * ```tsx
+ * <RadioGroup
+ *   label="Severity"
+ *   options={[{ value: 'blocking', label: 'Blocking' }, { value: 'cosmetic', label: 'Cosmetic' }]}
+ *   value={severity()}
+ *   onChange={setSeverity}
+ * />
+ * ```
+ */
+export declare function RadioGroup<T = string>(props: RadioGroupProps<T>): JSX.Element;

package/dist/ui/select.d.ts

@@ -0,0 +1,71 @@
+import { JSX } from 'solid-js';
+/** One choice in a {@link Select}. */
+export interface SelectOption<T = string> {
+    /** The value this row selects. Compared to the select's `value` by identity. */
+    value: T;
+    /** Visible text. Defaults to `String(value)`. Native `<option>`s hold text, not markup. */
+    label?: string;
+    /** Disable this option alone (the select's `disabled` disables the whole control). */
+    disabled?: boolean;
+}
+export interface SelectProps<T = string> extends Omit<JSX.SelectHTMLAttributes<HTMLSelectElement>, 'value' | 'children'> {
+    /**
+     * The choices, in display order. Rendered in full: the kit never truncates,
+     * re-orders or de-duplicates a consumer's option list.
+     *
+     * Omit it and pass `children` instead when you need `<optgroup>`s or anything else
+     * a flat list cannot express.
+     */
+    options?: readonly SelectOption<T>[];
+    /**
+     * The selected value, matched against each option's `value` by IDENTITY (so a
+     * numeric enum selects on the number, not on its string form). Pass an array for a
+     * `multiple` select.
+     */
+    value?: T | readonly T[];
+    /**
+     * Text for a leading, disabled, empty-valued option — the "nothing chosen yet" row.
+     * Omitted means no such row is rendered at all; there is no default placeholder,
+     * because inventing one would put words in the consumer's UI.
+     */
+    placeholder?: string;
+    /** Force the invalid (destructive-border) state. Matches `Input`'s. */
+    invalid?: boolean;
+    /** Raw `<option>` / `<optgroup>` children, for lists `options` cannot express.
+     *  `value` still drives the selection when you use these: it is applied to the
+     *  rendered options rather than quietly doing nothing. */
+    children?: JSX.Element;
+    /** Extra classes for the positioning wrapper that holds the chevron. */
+    containerClass?: string;
+}
+/**
+ * A select. A REAL native `<select>` behind `appearance: none`, in a box consistent
+ * with {@link Input}, with the kit's own chevron drawn over it.
+ *
+ * **Native, not a listbox, and that is the design.** A hand-built popup can be made to
+ * look identical and cannot be made to behave identically: the native control brings
+ * the platform picker on mobile, type-ahead on desktop, form participation, and the
+ * OS's own accessibility tree. This kit's control audit found every one of its
+ * accessibility defects in a control that had replaced a native element.
+ *
+ * The trade is that the *dropdown list itself* stays OS chrome — it renders outside the
+ * page and no stylesheet reaches it. What the kit can do is make it follow the kit's
+ * light/dark mode rather than the OS's, which `color-scheme` on the element host
+ * already does (`src/elements/styles.css`). Styling the closed control and leaving the
+ * open list to the platform is the whole of the bargain.
+ *
+ * Everything not listed in `SelectProps` is forwarded to the `<select>`, so `id`,
+ * `name`, `required`, `disabled`, `multiple`, `size`, `aria-*`, any `data-*` hook and
+ * the DOM events behave exactly as they do on a plain select. No validation is
+ * applied: `required` reaches the native attribute and stops there.
+ *
+ * ```tsx
+ * <Select
+ *   options={[{ value: 'low' }, { value: 'high', label: 'High priority' }]}
+ *   value={sev()}
+ *   placeholder="Choose a severity…"
+ *   onChange={(e) => setSev(e.currentTarget.value)}
+ * />
+ * ```
+ */
+export declare function Select<T = string>(props: SelectProps<T>): JSX.Element;

package/dist/ui/slider.d.ts

@@ -0,0 +1,65 @@
+import { JSX } from 'solid-js';
+export interface SliderProps extends Omit<JSX.InputHTMLAttributes<HTMLInputElement>, 'type' | 'children' | 'min' | 'max' | 'step' | 'value'> {
+    /**
+     * Lowest selectable value. REQUIRED, and deliberately so.
+     *
+     * A range with no `min`/`max` is not a slider, it is a slider-shaped guess, and the
+     * guess belongs to whoever knows what the number means. `SliderWidget` reading a
+     * JSON-Schema field still defaults an absent `minimum` to 0 — that is the WIDGET's
+     * decision about a consumer-authored schema, and it stays there rather than being
+     * quietly adopted by every caller of this component.
+     */
+    min: number;
+    /** Highest selectable value. REQUIRED for the same reason as `min`. */
+    max: number;
+    /** Granularity. Omitted means the native default (1); `'any'` means continuous. */
+    step?: number | 'any';
+    /** The current value. Controlled — drive it from `onInput`. Omit for uncontrolled. */
+    value?: number;
+    /** Initial value when uncontrolled. */
+    defaultValue?: number;
+    /**
+     * Show the current value beside the track. Off by default.
+     *
+     * Two shapes, because one is not enough and three would be too many. `true` renders
+     * the raw number, which is what most sliders want. A FUNCTION renders whatever it
+     * returns, because plenty of sliders are not counting bare numbers: `60%`, `3 of 5`,
+     * `1m 30s`. A boolean alone cannot express those, and a formatter alone would make
+     * the common case read `valueLabel={(v) => v}`.
+     *
+     * The readout is `aria-hidden`. The input already reports the same number through
+     * `aria-valuenow` / `aria-valuetext`, so an exposed copy would be announced twice.
+     *
+     * NOTE ON STRUCTURE: with a readout the component renders a flex row around the
+     * input; without one it is still a bare `<input>` and nothing changes for existing
+     * callers. Toggling this at runtime therefore rebuilds the input element, which is
+     * fine for a control panel and not something a real app does mid-drag.
+     */
+    valueLabel?: boolean | ((value: number) => JSX.Element);
+}
+/**
+ * A slider. A REAL `<input type="range">` behind `appearance: none`, styled by the
+ * kit's `.kai-range` rule, never a `<div>` with a drag handler.
+ *
+ * The native control brings the whole keyboard contract (arrows, Home, End,
+ * PageUp/PageDown), pointer and touch dragging, form participation via `name`, and
+ * the `slider` role with a live value announcement — all of it for free and all of it
+ * correct. Every accessibility defect this kit's control audit found was in a control
+ * that had replaced the native element with something hand-rolled.
+ *
+ * What the component adds is the **filled track**. `.kai-range` paints the portion
+ * left of the thumb from a `--kai-range-fill` custom property, and until now every
+ * caller computed that percentage itself. It is arithmetic over `min`, `max` and the
+ * current value — three things this component already has — so no consumer should
+ * ever write it again.
+ *
+ * Everything not listed in `SliderProps` is forwarded to the input, so `id`, `name`,
+ * `disabled`, `required`, `aria-*` and any `data-*` hook behave exactly as they do on
+ * a plain `<input>`. No clamping and no validation is applied: a value outside
+ * `min`..`max` is the browser's business, not ours.
+ *
+ * ```tsx
+ * <Slider min={0} max={100} step={5} value={v()} onInput={(e) => setV(e.currentTarget.valueAsNumber)} />
+ * ```
+ */
+export declare function Slider(props: SliderProps): JSX.Element;

package/dist/ui/switch.d.ts

@@ -1,4 +1,5 @@
-export interface SwitchProps {
+import { JSX } from 'solid-js';
+export interface SwitchProps extends Omit<JSX.ButtonHTMLAttributes<HTMLButtonElement>, 'type' | 'role' | 'aria-checked' | 'children' | 'ref' | 'onChange' | 'onchange' | 'onClick' | 'onclick' | 'onKeyDown' | 'onkeydown'> {
     /** Controlled checked state. When set, the component defers state to the
      *  parent; drive it from `onChange`. Omit for uncontrolled (internal) state. */
     checked?: boolean;
@@ -22,5 +23,11 @@ export interface SwitchProps {
 /**
  * A toggle switch (`role="switch"`). Controlled via `checked`, or uncontrolled
  * from `defaultChecked`. Keyboard-operable (Space/Enter) and theme-tokened.
+ *
+ * Anything not named in `SwitchProps` is forwarded to the inner button, so `id`,
+ * `aria-required` / `aria-invalid` / `aria-describedby` and any `data-*` hook land
+ * on the focusable element without a caller stamping them through a `ref`. The
+ * switch keeps ownership of `type`, `role`, `aria-checked` and the toggle handlers:
+ * those are the control, not decoration.
  */
-export declare function Switch(props: SwitchProps): import("solid-js").JSX.Element;
+export declare function Switch(props: SwitchProps): JSX.Element;

package/dist/upload-TcAHXv9W.js

@@ -0,0 +1 @@
+import{I as a}from"./Icon-DObhsRtm.js";import{c as e,q as i}from"./define-By-uL588.js";var p=[["path",{d:"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4",key:"ih7n3h"}],["polyline",{points:"17 8 12 3 7 8",key:"t8dd8p"}],["line",{x1:"12",x2:"12",y1:"3",y2:"15",key:"widbto"}]],t=o=>e(a,i(o,{name:"Upload",iconNode:p})),r=t;export{r as u};

package/dist/url-scheme-policy-DR5DgvkM.js

@@ -0,0 +1 @@
+const i=["http:","https:","mailto:"],r=["javascript:","vbscript:"];function c(t){try{return new URL(t,"http://_invalid_base").protocol}catch{return}}function o(t){const n=c(t);return n!==void 0&&i.includes(n)}function s(t){const n=c(t);return n!==void 0&&r.includes(n)}export{s as a,o as i};

package/dist/use-card-resolution-DaZqAdWf.js

@@ -0,0 +1 @@
+import{q as D,s as P,g as z,c as i,i as s,S as a,a as b,d as k,b as T,D as q,m as w,t as c,w as A,e as B,H as E,G as F,j as G,x as H,k as m}from"./define-By-uL588.js";import{c as C}from"./cn-DN5AWfiS.js";import{B as K}from"./button-DkuOnGLy.js";import{t as O}from"./triangle-alert-DlQ68ppf.js";import{x as U}from"./x-Z5UntkIJ.js";import{r as _}from"./rotate-ccw-B2xn93py.js";var J=c('<h3 class="text-title font-semibold tracking-tight text-foreground">'),N=c('<p class="text-body text-muted-foreground">'),Q=c("<div>"),V=c('<div role=alert class="flex items-start gap-2 rounded-lg border border-destructive/40 bg-destructive/10 p-3 text-sm text-destructive dark:bg-destructive/15 dark:text-red-400"><span>'),W=c('<div class="text-sm text-foreground">'),X=c('<div class="flex flex-wrap items-center justify-end gap-2 pt-1">'),Y=c('<button type=button part=dismiss aria-label=Dismiss class="absolute right-2.5 top-2.5 z-10 shrink-0 rounded p-1 text-muted-foreground transition-colors hover:bg-accent hover:text-foreground">'),Z=c('<div class="overflow-hidden rounded-lg">');function S(t){const o=D({dense:!1},t),[e,d]=P(o,["heading","description","media","actions","errorMessage","dense","headingId","descriptionId","dismissible","onDismiss","href","target","rel","clickable","onCardClick","class","children"]),g=A(),u=()=>e.headingId??`kai-card-heading-${g}`,v=()=>e.descriptionId??`kai-card-description-${g}`,p=()=>e.errorMessage!==void 0&&e.errorMessage!=="",l=()=>!!e.heading||!!e.description,[x,I]=z(!0),M=r=>{var n;r.stopPropagation(),I(!1),(n=e.onDismiss)==null||n.call(e)},h=()=>!!e.href,f=()=>!h()&&!!e.clickable,y=()=>h()||f(),$=r=>{var n;return(n=e.onCardClick)==null?void 0:n.call(e,r)},R=r=>{f()&&(r.key==="Enter"||r.key===" "||r.key==="Spacebar")&&(r.preventDefault(),$(r))},j=()=>e.rel??(e.target==="_blank"?"noopener noreferrer":void 0),L=[i(a,{get when(){return l()},get children(){var r=Q();return s(r,i(a,{get when(){return e.heading},get children(){var n=J();return s(n,()=>e.heading),b(()=>k(n,"id",u())),n}}),null),s(r,i(a,{get when(){return e.description},get children(){var n=N();return s(n,()=>e.description),b(()=>k(n,"id",v())),n}}),null),b(()=>T(r,C("flex flex-col border-b border-border",e.dense?"gap-0.5 pb-2.5":"gap-1 pb-4"))),r}}),i(a,{get when(){return p()},get fallback(){return[i(a,{get when(){return e.children},get children(){var r=W();return s(r,()=>e.children),r}}),i(a,{get when(){return e.actions},get children(){var r=X();return s(r,()=>e.actions),r}})]},get children(){var r=V(),n=r.firstChild;return s(r,i(O,{size:16,class:"mt-0.5 shrink-0","aria-hidden":"true"}),n),s(n,()=>e.errorMessage),r}})];return i(a,{get when(){return x()},get children(){return i(q,D({get component(){return h()?"a":"div"},part:"card",get href(){return w(()=>!!h())()?e.href:void 0},get target(){return w(()=>!!h())()?e.target:void 0},get rel(){return w(()=>!!h())()?j():void 0},get role(){return f()?"button":void 0},get tabindex(){return f()?0:void 0},get onClick(){return y()?$:void 0},get onKeyDown(){return f()?R:void 0},get class(){return C("relative flex flex-col rounded-xl border border-border bg-card text-card-foreground kai-elevation-sm",e.dense?"gap-2.5 p-3.5":"gap-4 p-5",y()&&"cursor-pointer no-underline transition-colors hover:border-ring hover:bg-accent/40 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",e.class)}},d,{get children(){return[i(a,{get when(){return e.dismissible},get children(){var r=Y();return r.$$click=M,s(r,i(U,{class:"size-3.5","aria-hidden":"true"})),r}}),i(a,{get when(){return e.media},get children(){var r=Z();return s(r,()=>e.media),r}}),L]}}))}})}B(["click"]);var ee=c('<div role=group class="flex flex-wrap items-center gap-x-2 gap-y-1"><span class="min-w-0 text-sm text-muted-foreground"><span class="font-medium text-foreground"></span> <span class=text-foreground></span><span class=text-muted-foreground> \u2014 dismissed');const re={confirm:"Proposed",choice:"Choose",form:"Form",tasks:"Tasks"};function te(t){const o=re[t];return o?`${o}:`:t.length===0?"Card:":`${t.charAt(0).toUpperCase()}${t.slice(1)}:`}function ne(t){const o=()=>te(t.type),e=()=>t.title??"this card",d=()=>t.reopenLabel??"Reopen",g=()=>`${o()} ${e()} \u2014 dismissed`;return i(S,{dense:!0,get class(){return t.class},get children(){var u=ee(),v=u.firstChild,p=v.firstChild,l=p.nextSibling,x=l.nextSibling;return s(p,o),s(x,e),s(u,i(K,{type:"button",variant:"ghost",size:"sm",get class(){return C("ml-auto gap-1.5")},onClick:()=>t.onReopen(),get children(){return[i(_,{size:14,"aria-hidden":"true"}),i(a,{get when(){return d()},get children(){return d()}})]}}),null),b(()=>k(u,"aria-label",g())),u}})}const ie=F();function se(){return E(ie)}const oe=new Set(["action","submit","expired"]);function ae(t){const[o,e]=z(void 0);G(H(t.data,()=>e(void 0),{defer:!0}));const d=m(()=>t.prop()??o()),g=m(()=>d()!==void 0),u=m(()=>{const l=d();return l!==void 0&&oe.has(l.kind)}),v=m(()=>{var l;return((l=d())==null?void 0:l.kind)==="dismissed"}),p=m(()=>t.prop()===void 0&&o()!==void 0);return{resolution:d,isResolved:g,isTerminal:u,isDeferred:v,isOptimistic:p,setLocal:e}}export{S as C,ne as D,ae as a,se as u};

package/dist/{elements/chunks/variant-aurora-qt6Zct8M.js → variant-aurora-BhLuYxJR.js}

@@ -1,4 +1,4 @@
-import{k as f,i as y,c as b,a as w,d as R,b as A,n as S,g as _,h as k,t as M}from"./define-wjHR1MkU.js";import{c as n,h as T,D as W,S as q}from"./create-tween-c4Z8TDYz.js";import{C,a as z}from"./audio-visualizer-D7lB6mvR.js";const P=`
+import{j as f,i as y,c as b,a as w,d as R,b as A,l as S,g as _,h as k,t as M}from"./define-By-uL588.js";import{c as n,h as T,D as W,S as q}from"./create-tween-uPkArjIG.js";import{C,a as z}from"./audio-visualizer-DToYdfSc.js";const P=`
 const float PI = 3.14159265359;
 // Strand phase span: 0.5 + pi (fact sheet section 2's "sigma", the
 // midpoint of the interval [1, 2*pi] with the interpolation knob fixed

package/dist/{variant-aurora-B8II3-I1.js → variant-aurora-CNmfHhcx.js}

@@ -1,7 +1,7 @@
 import { ssr as w, ssrAttribute as d, escape as h, ssrStyleProperty as u, createComponent as R } from "solid-js/web";
 import { createEffect as p, createSignal as A, onCleanup as S } from "solid-js";
-import { c, S as _, h as k, D as C } from "./create-tween-BFT6c-Y8.js";
-import { C as T, a as M } from "./solid-CnavwBye.js";
+import { c, S as _, h as k, D as C } from "./create-tween-C-q-JCM-.js";
+import { C as T, a as M } from "./solid-DruVOXnf.js";
 const W = `
 const float PI = 3.14159265359;
 // Strand phase span: 0.5 + pi (fact sheet section 2's "sigma", the

package/dist/{variant-aurora-CMNWOSJR.js → variant-aurora-D6GsdTPA.js}

@@ -1,7 +1,7 @@
 import { insert as y, createComponent as b, effect as w, setAttribute as R, className as A, setStyleProperty as S, template as k } from "solid-js/web";
 import { createEffect as p, createSignal as C, onCleanup as T } from "solid-js";
-import { c as l, S as _, h as M, D as W } from "./create-tween-CJNlzoaO.js";
-import { C as z, a as P } from "./solid-BtdqNZI7.js";
+import { c as l, S as _, h as M, D as W } from "./create-tween-CRrJXxBd.js";
+import { C as z, a as P } from "./solid-BzCFdL25.js";
 const N = `
 const float PI = 3.14159265359;
 // Strand phase span: 0.5 + pi (fact sheet section 2's "sigma", the

package/dist/{variant-aurora-CcuDMWwQ.js → variant-aurora-DbW_OWL2.js}

@@ -1,4 +1,4 @@
-import{i as y,s as b,c as w,a as R,C as A,t as S,b as _}from"./register-impl-DpE7icIb.js";import{h as f,l as k,d as M,i as T,o as W}from"./kai.es.js";import{c as n,h as q,S as C,D as z}from"./create-tween-CQED4T0g.js";const P=`
+import{i as y,s as b,c as w,a as R,C as A,t as S,b as _}from"./register-impl-B1hLkrI8.js";import{h as f,l as k,d as M,i as T,o as W}from"./kai.es.js";import{c as n,h as q,S as C,D as z}from"./create-tween-DZ3RRDHD.js";const P=`
 const float PI = 3.14159265359;
 // Strand phase span: 0.5 + pi (fact sheet section 2's "sigma", the
 // midpoint of the interval [1, 2*pi] with the interpolation knob fixed

package/dist/{elements/chunks/variant-custom-tJp22_BQ.js → variant-custom-BRvaNHSi.js}

@@ -1 +1 @@
-import{k as g,l as w,c,S as x,i as S,a as m,d as p,b as y,p as h,t as M}from"./define-wjHR1MkU.js";import{c as $,S as A,h as N,D as C}from"./create-tween-c4Z8TDYz.js";import{s as E,a as U,C as j}from"./audio-visualizer-D7lB6mvR.js";var b=M("<div>");const F={"1f":!0,"1i":!0,"1fv":!0,"2f":!0,"3f":!0,"3fv":!0,"4f":!0,"4fv":!0,Matrix2fv:!0,Matrix3fv:!0,Matrix4fv:!0},O=new Set(["1f","1i"]),V={"2f":2,"3f":3,"4f":4,Matrix2fv:4,Matrix3fv:9,Matrix4fv:16};function D(a,e){if(e==null||typeof e!="object")return`uniform "${a}" is not a valid declaration (expected an object with "type" and "value").`;if(F[e.type]!==!0)return`uniform "${a}" has an unrecognized type "${String(e.type)}".`;if(O.has(e.type))return typeof e.value!="number"||!Number.isFinite(e.value)?`uniform "${a}" is declared "${e.type}" (a number) but its value is not a finite number.`:void 0;if(!Array.isArray(e.value)||e.value.some(s=>typeof s!="number"||!Number.isFinite(s)))return`uniform "${a}" is declared "${e.type}" (an array) but its value is not an array of finite numbers.`;const o=V[e.type];if(o!==void 0&&e.value.length!==o)return`uniform "${a}" is declared "${e.type}", which takes exactly ${o} numbers, but its value has ${e.value.length}.`}function k(a,e){const o=a.bands.length?a.bands:[0],s={uColor:{type:"3fv",value:N(a.color)},uIntensity:{type:"1f",value:a.intensity},uSpeed:{type:"1f",value:a.speed},uComplexity:{type:"1f",value:a.complexity},uVolume:{type:"1f",value:a.volume},uBands:{type:"1fv",value:o,arraySize:o.length}};if(!e)return s;for(const[f,v]of Object.entries(e)){const l=D(f,v);if(l)throw new Error(l)}return{...s,...e}}function I(a){const e=$(.3),o=$(1),s=()=>U(a.state,a.listeningAmplitude);g(()=>{const t=E(s());if(s()==="speaking")e.to(.3+.7*a.volume,{duration:0});else{const r=a.frozen?{duration:0}:{duration:.5,ease:"easeOut"};e.to(Array.isArray(t.intensity)&&a.frozen?t.intensity[0]:t.intensity,r)}o.to(a.frozen?0:t.speed,{duration:0})});const f=w(()=>{var t;try{return{uniforms:k({color:a.color??C,intensity:e.value(),speed:o.value(),complexity:a.complexity??.5,volume:a.volume,bands:a.bands},(t=a.shader)==null?void 0:t.uniforms)}}catch(r){return{error:r instanceof Error?r.message:String(r)}}});let v=!1;g(()=>{const{error:t}=f();if(!t){v=!1;return}v||(v=!0,console.error(`<kai-audio-visualizer variant="custom">: ${t}`),a.onUnavailable())});const l=()=>({height:`${j[a.size]}px`,"aspect-ratio":"1"});return c(x,{get when(){var t;return(t=a.shader)==null?void 0:t.fragment},get fallback(){return(()=>{var t=b();return m(r=>{var n=a.state,i=a.class,u=l();return n!==r.e&&p(t,"data-kai-state",r.e=n),i!==r.t&&y(t,r.t=i),r.a=h(t,u,r.a),r},{e:void 0,t:void 0,a:void 0}),t})()},children:t=>c(x,{get when(){return f().uniforms},get fallback(){return(()=>{var r=b();return m(n=>{var i=a.state,u=a.class,d=l();return i!==n.e&&p(r,"data-kai-state",n.e=i),u!==n.t&&y(r,n.t=u),n.a=h(r,d,n.a),n},{e:void 0,t:void 0,a:void 0}),r})()},children:r=>(()=>{var n=b();return S(n,c(A,{get fragment(){return t()},get precision(){return a.size==="icon"||a.size==="sm"?"mediump":"highp"},get uniforms(){return r()},get animateWhenNotVisible(){return a.animateWhenNotVisible},onError:i=>{/not available/i.test(i)?console.warn('<kai-audio-visualizer variant="custom">: shader unavailable',i):console.error('<kai-audio-visualizer variant="custom">: shader error',i),a.onUnavailable()}})),m(i=>{var u=a.state,d=a.class,z=l();return u!==i.e&&p(n,"data-kai-state",i.e=u),d!==i.t&&y(n,i.t=d),i.a=h(n,z,i.a),i},{e:void 0,t:void 0,a:void 0}),n})()})})}export{k as customUniforms,I as default};
+import{j as g,k as w,c,S as x,i as S,a as m,d as p,b as y,n as h,t as M}from"./define-By-uL588.js";import{c as $,S as A,h as j,D as N}from"./create-tween-uPkArjIG.js";import{s as C,a as E,C as U}from"./audio-visualizer-DToYdfSc.js";var b=M("<div>");const F={"1f":!0,"1i":!0,"1fv":!0,"2f":!0,"3f":!0,"3fv":!0,"4f":!0,"4fv":!0,Matrix2fv:!0,Matrix3fv:!0,Matrix4fv:!0},O=new Set(["1f","1i"]),V={"2f":2,"3f":3,"4f":4,Matrix2fv:4,Matrix3fv:9,Matrix4fv:16};function I(a,e){if(e==null||typeof e!="object")return`uniform "${a}" is not a valid declaration (expected an object with "type" and "value").`;if(F[e.type]!==!0)return`uniform "${a}" has an unrecognized type "${String(e.type)}".`;if(O.has(e.type))return typeof e.value!="number"||!Number.isFinite(e.value)?`uniform "${a}" is declared "${e.type}" (a number) but its value is not a finite number.`:void 0;if(!Array.isArray(e.value)||e.value.some(s=>typeof s!="number"||!Number.isFinite(s)))return`uniform "${a}" is declared "${e.type}" (an array) but its value is not an array of finite numbers.`;const o=V[e.type];if(o!==void 0&&e.value.length!==o)return`uniform "${a}" is declared "${e.type}", which takes exactly ${o} numbers, but its value has ${e.value.length}.`}function k(a,e){const o=a.bands.length?a.bands:[0],s={uColor:{type:"3fv",value:j(a.color)},uIntensity:{type:"1f",value:a.intensity},uSpeed:{type:"1f",value:a.speed},uComplexity:{type:"1f",value:a.complexity},uVolume:{type:"1f",value:a.volume},uBands:{type:"1fv",value:o,arraySize:o.length}};if(!e)return s;for(const[f,v]of Object.entries(e)){const l=I(f,v);if(l)throw new Error(l)}return{...s,...e}}function W(a){const e=$(.3),o=$(1),s=()=>E(a.state,a.listeningAmplitude);g(()=>{const t=C(s());if(s()==="speaking")e.to(.3+.7*a.volume,{duration:0});else{const r=a.frozen?{duration:0}:{duration:.5,ease:"easeOut"};e.to(Array.isArray(t.intensity)&&a.frozen?t.intensity[0]:t.intensity,r)}o.to(a.frozen?0:t.speed,{duration:0})});const f=w(()=>{var t;try{return{uniforms:k({color:a.color??N,intensity:e.value(),speed:o.value(),complexity:a.complexity??.5,volume:a.volume,bands:a.bands},(t=a.shader)==null?void 0:t.uniforms)}}catch(r){return{error:r instanceof Error?r.message:String(r)}}});let v=!1;g(()=>{const{error:t}=f();if(!t){v=!1;return}v||(v=!0,console.error(`<kai-audio-visualizer variant="custom">: ${t}`),a.onUnavailable())});const l=()=>({height:`${U[a.size]}px`,"aspect-ratio":"1"});return c(x,{get when(){var t;return(t=a.shader)==null?void 0:t.fragment},get fallback(){return(()=>{var t=b();return m(r=>{var n=a.state,i=a.class,u=l();return n!==r.e&&p(t,"data-kai-state",r.e=n),i!==r.t&&y(t,r.t=i),r.a=h(t,u,r.a),r},{e:void 0,t:void 0,a:void 0}),t})()},children:t=>c(x,{get when(){return f().uniforms},get fallback(){return(()=>{var r=b();return m(n=>{var i=a.state,u=a.class,d=l();return i!==n.e&&p(r,"data-kai-state",n.e=i),u!==n.t&&y(r,n.t=u),n.a=h(r,d,n.a),n},{e:void 0,t:void 0,a:void 0}),r})()},children:r=>(()=>{var n=b();return S(n,c(A,{get fragment(){return t()},get precision(){return a.size==="icon"||a.size==="sm"?"mediump":"highp"},get uniforms(){return r()},get animateWhenNotVisible(){return a.animateWhenNotVisible},onError:i=>{/not available/i.test(i)?console.warn('<kai-audio-visualizer variant="custom">: shader unavailable',i):console.error('<kai-audio-visualizer variant="custom">: shader error',i),a.onUnavailable()}})),m(i=>{var u=a.state,d=a.class,z=l();return u!==i.e&&p(n,"data-kai-state",i.e=u),d!==i.t&&y(n,i.t=d),i.a=h(n,z,i.a),i},{e:void 0,t:void 0,a:void 0}),n})()})})}export{k as customUniforms,W as default};

package/dist/{variant-custom-L16JLLZy.js → variant-custom-BvYHR62b.js}

@@ -1 +1 @@
-import{d as w,i as S,s as c,c as m,e as p,t as M,b as A,C as N}from"./register-impl-DpE7icIb.js";import{h as g,c as C,l as y,S as x,d as h}from"./kai.es.js";import{c as $,S as E,h as U,D as j}from"./create-tween-CQED4T0g.js";var b=M("<div>");const F={"1f":!0,"1i":!0,"1fv":!0,"2f":!0,"3f":!0,"3fv":!0,"4f":!0,"4fv":!0,Matrix2fv:!0,Matrix3fv:!0,Matrix4fv:!0},O=new Set(["1f","1i"]),V={"2f":2,"3f":3,"4f":4,Matrix2fv:4,Matrix3fv:9,Matrix4fv:16};function D(a,e){if(e==null||typeof e!="object")return`uniform "${a}" is not a valid declaration (expected an object with "type" and "value").`;if(F[e.type]!==!0)return`uniform "${a}" has an unrecognized type "${String(e.type)}".`;if(O.has(e.type))return typeof e.value!="number"||!Number.isFinite(e.value)?`uniform "${a}" is declared "${e.type}" (a number) but its value is not a finite number.`:void 0;if(!Array.isArray(e.value)||e.value.some(s=>typeof s!="number"||!Number.isFinite(s)))return`uniform "${a}" is declared "${e.type}" (an array) but its value is not an array of finite numbers.`;const o=V[e.type];if(o!==void 0&&e.value.length!==o)return`uniform "${a}" is declared "${e.type}", which takes exactly ${o} numbers, but its value has ${e.value.length}.`}function z(a,e){const o=a.bands.length?a.bands:[0],s={uColor:{type:"3fv",value:U(a.color)},uIntensity:{type:"1f",value:a.intensity},uSpeed:{type:"1f",value:a.speed},uComplexity:{type:"1f",value:a.complexity},uVolume:{type:"1f",value:a.volume},uBands:{type:"1fv",value:o,arraySize:o.length}};if(!e)return s;for(const[f,v]of Object.entries(e)){const l=D(f,v);if(l)throw new Error(l)}return{...s,...e}}function I(a){const e=$(.3),o=$(1),s=()=>A(a.state,a.listeningAmplitude);g(()=>{const t=w(s());if(s()==="speaking")e.to(.3+.7*a.volume,{duration:0});else{const r=a.frozen?{duration:0}:{duration:.5,ease:"easeOut"};e.to(Array.isArray(t.intensity)&&a.frozen?t.intensity[0]:t.intensity,r)}o.to(a.frozen?0:t.speed,{duration:0})});const f=C(()=>{var t;try{return{uniforms:z({color:a.color??j,intensity:e.value(),speed:o.value(),complexity:a.complexity??.5,volume:a.volume,bands:a.bands},(t=a.shader)==null?void 0:t.uniforms)}}catch(r){return{error:r instanceof Error?r.message:String(r)}}});let v=!1;g(()=>{const{error:t}=f();if(!t){v=!1;return}v||(v=!0,console.error(`<kai-audio-visualizer variant="custom">: ${t}`),a.onUnavailable())});const l=()=>({height:`${N[a.size]}px`,"aspect-ratio":"1"});return y(x,{get when(){var t;return(t=a.shader)==null?void 0:t.fragment},get fallback(){return(()=>{var t=b();return h(r=>{var n=a.state,i=a.class,u=l();return n!==r.e&&c(t,"data-kai-state",r.e=n),i!==r.t&&m(t,r.t=i),r.a=p(t,u,r.a),r},{e:void 0,t:void 0,a:void 0}),t})()},children:t=>y(x,{get when(){return f().uniforms},get fallback(){return(()=>{var r=b();return h(n=>{var i=a.state,u=a.class,d=l();return i!==n.e&&c(r,"data-kai-state",n.e=i),u!==n.t&&m(r,n.t=u),n.a=p(r,d,n.a),n},{e:void 0,t:void 0,a:void 0}),r})()},children:r=>(()=>{var n=b();return S(n,y(E,{get fragment(){return t()},get precision(){return a.size==="icon"||a.size==="sm"?"mediump":"highp"},get uniforms(){return r()},get animateWhenNotVisible(){return a.animateWhenNotVisible},onError:i=>{/not available/i.test(i)?console.warn('<kai-audio-visualizer variant="custom">: shader unavailable',i):console.error('<kai-audio-visualizer variant="custom">: shader error',i),a.onUnavailable()}})),h(i=>{var u=a.state,d=a.class,k=l();return u!==i.e&&c(n,"data-kai-state",i.e=u),d!==i.t&&m(n,i.t=d),i.a=p(n,k,i.a),i},{e:void 0,t:void 0,a:void 0}),n})()})})}export{z as customUniforms,I as default};
+import{d as w,i as S,s as c,c as m,e as p,t as M,b as A,C as N}from"./register-impl-B1hLkrI8.js";import{h as g,c as C,l as y,S as x,d as h}from"./kai.es.js";import{c as $,S as E,h as U,D as j}from"./create-tween-DZ3RRDHD.js";var b=M("<div>");const F={"1f":!0,"1i":!0,"1fv":!0,"2f":!0,"3f":!0,"3fv":!0,"4f":!0,"4fv":!0,Matrix2fv:!0,Matrix3fv:!0,Matrix4fv:!0},O=new Set(["1f","1i"]),V={"2f":2,"3f":3,"4f":4,Matrix2fv:4,Matrix3fv:9,Matrix4fv:16};function D(a,e){if(e==null||typeof e!="object")return`uniform "${a}" is not a valid declaration (expected an object with "type" and "value").`;if(F[e.type]!==!0)return`uniform "${a}" has an unrecognized type "${String(e.type)}".`;if(O.has(e.type))return typeof e.value!="number"||!Number.isFinite(e.value)?`uniform "${a}" is declared "${e.type}" (a number) but its value is not a finite number.`:void 0;if(!Array.isArray(e.value)||e.value.some(s=>typeof s!="number"||!Number.isFinite(s)))return`uniform "${a}" is declared "${e.type}" (an array) but its value is not an array of finite numbers.`;const o=V[e.type];if(o!==void 0&&e.value.length!==o)return`uniform "${a}" is declared "${e.type}", which takes exactly ${o} numbers, but its value has ${e.value.length}.`}function z(a,e){const o=a.bands.length?a.bands:[0],s={uColor:{type:"3fv",value:U(a.color)},uIntensity:{type:"1f",value:a.intensity},uSpeed:{type:"1f",value:a.speed},uComplexity:{type:"1f",value:a.complexity},uVolume:{type:"1f",value:a.volume},uBands:{type:"1fv",value:o,arraySize:o.length}};if(!e)return s;for(const[f,v]of Object.entries(e)){const l=D(f,v);if(l)throw new Error(l)}return{...s,...e}}function I(a){const e=$(.3),o=$(1),s=()=>A(a.state,a.listeningAmplitude);g(()=>{const t=w(s());if(s()==="speaking")e.to(.3+.7*a.volume,{duration:0});else{const r=a.frozen?{duration:0}:{duration:.5,ease:"easeOut"};e.to(Array.isArray(t.intensity)&&a.frozen?t.intensity[0]:t.intensity,r)}o.to(a.frozen?0:t.speed,{duration:0})});const f=C(()=>{var t;try{return{uniforms:z({color:a.color??j,intensity:e.value(),speed:o.value(),complexity:a.complexity??.5,volume:a.volume,bands:a.bands},(t=a.shader)==null?void 0:t.uniforms)}}catch(r){return{error:r instanceof Error?r.message:String(r)}}});let v=!1;g(()=>{const{error:t}=f();if(!t){v=!1;return}v||(v=!0,console.error(`<kai-audio-visualizer variant="custom">: ${t}`),a.onUnavailable())});const l=()=>({height:`${N[a.size]}px`,"aspect-ratio":"1"});return y(x,{get when(){var t;return(t=a.shader)==null?void 0:t.fragment},get fallback(){return(()=>{var t=b();return h(r=>{var n=a.state,i=a.class,u=l();return n!==r.e&&c(t,"data-kai-state",r.e=n),i!==r.t&&m(t,r.t=i),r.a=p(t,u,r.a),r},{e:void 0,t:void 0,a:void 0}),t})()},children:t=>y(x,{get when(){return f().uniforms},get fallback(){return(()=>{var r=b();return h(n=>{var i=a.state,u=a.class,d=l();return i!==n.e&&c(r,"data-kai-state",n.e=i),u!==n.t&&m(r,n.t=u),n.a=p(r,d,n.a),n},{e:void 0,t:void 0,a:void 0}),r})()},children:r=>(()=>{var n=b();return S(n,y(E,{get fragment(){return t()},get precision(){return a.size==="icon"||a.size==="sm"?"mediump":"highp"},get uniforms(){return r()},get animateWhenNotVisible(){return a.animateWhenNotVisible},onError:i=>{/not available/i.test(i)?console.warn('<kai-audio-visualizer variant="custom">: shader unavailable',i):console.error('<kai-audio-visualizer variant="custom">: shader error',i),a.onUnavailable()}})),h(i=>{var u=a.state,d=a.class,k=l();return u!==i.e&&c(n,"data-kai-state",i.e=u),d!==i.t&&m(n,i.t=d),i.a=p(n,k,i.a),i},{e:void 0,t:void 0,a:void 0}),n})()})})}export{z as customUniforms,I as default};

package/dist/{variant-custom-BdvYC7af.js → variant-custom-DMTrEO5w.js}

@@ -1,7 +1,7 @@
 import { createComponent as d, ssr as m, ssrAttribute as s, escape as u, ssrStyle as v } from "solid-js/web";
 import { createEffect as y, createMemo as S, Show as b } from "solid-js";
-import { c as h, D as x, S as $, h as z } from "./create-tween-BFT6c-Y8.js";
-import { s as A, a as C, C as E } from "./solid-CnavwBye.js";
+import { c as h, D as x, S as $, h as z } from "./create-tween-C-q-JCM-.js";
+import { s as A, a as C, C as E } from "./solid-DruVOXnf.js";
 var g = ["<div", ' style="', '"></div>'], k = ["<div", ' style="', '">', "</div>"];
 const w = {
   "1f": !0,