@adea-ai/ui 0.85.0 → 0.88.0

package/dist/components/ui/field/number-field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"number-field.js","names":["createEffect","createSignal","JSX","FormField","Input","NumberFieldProps","label","hint","value","min","max","integer","onChange","class","onBlur","EventHandler","HTMLInputElement","FocusEvent","NumberField","props","draft","setDraft","String","error","setError","validate","raw","next","Number","isFinite","isInteger","_$createComponent","children","type","step","required","onInput","event","currentTarget","nextError","_$createComponent"],"sources":["../../../../src/components/ui/field/number-field.tsx"],"sourcesContent":["import { createEffect, createSignal, type JSX } from 'solid-js'\nimport { FormField } from './field'\nimport { Input } from '../input/input'\n\nexport type NumberFieldProps = {\n  label: string\n  hint?: string\n  value: number\n  min: number\n  max: number\n  integer?: boolean\n  onChange: (value: number) => void\n  class?: string\n  onBlur?: JSX.EventHandler<HTMLInputElement, FocusEvent>\n}\n\n/**\n * A controlled numeric field that keeps an editable draft while validating\n * range and integer constraints. Invalid drafts are announced and restored\n * to the latest controlled value when focus leaves the input.\n */\nexport function NumberField(props: NumberFieldProps) {\n  const [draft, setDraft] = createSignal(String(props.value))\n  const [error, setError] = createSignal('')\n  const integer = () => props.integer ?? true\n\n  createEffect(() => {\n    setDraft(String(props.value))\n  })\n\n  const validate = (raw: string) => {\n    if (!raw) return `${props.label} is required.`\n    const next = Number(raw)\n    if (!Number.isFinite(next)) return `${props.label} must be a valid number.`\n    if (integer() && !Number.isInteger(next)) {\n      return `${props.label} must be a whole number.`\n    }\n    if (next < props.min || next > props.max) {\n      return `${props.label} must be between ${props.min} and ${props.max}.`\n    }\n    return ''\n  }\n\n  return (\n    <FormField label={props.label} hint={props.hint} error={error()} class={props.class}>\n      <Input\n        type=\"number\"\n        value={draft()}\n        min={props.min}\n        max={props.max}\n        step={integer() ? 1 : 'any'}\n        required\n        onInput={(event) => {\n          const raw = event.currentTarget.value\n          setDraft(raw)\n          const nextError = validate(raw)\n          setError(nextError)\n          if (!nextError) props.onChange(Number(raw))\n        }}\n        onBlur={(event) => {\n          const nextError = validate(draft())\n          if (nextError) {\n            setDraft(String(props.value))\n            setError('')\n          }\n          props.onBlur?.(event)\n        }}\n      />\n    </FormField>\n  )\n}\n"],"mappings":";;;;;;;;;;AAqBA,SAAgBkB,YAAYC,OAAyB;CACnD,MAAM,CAACC,OAAOC,YAAYpB,aAAaqB,OAAOH,MAAMX,KAAK,CAAC;CAC1D,MAAM,CAACe,OAAOC,YAAYvB,aAAa,EAAE;CACzC,MAAMU,gBAAgBQ,MAAMR,WAAW;CAEvCX,mBAAmB;EACjBqB,SAASC,OAAOH,MAAMX,KAAK,CAAC;CAC9B,CAAC;CAED,MAAMiB,YAAYC,QAAgB;EAChC,IAAI,CAACA,KAAK,OAAO,GAAGP,MAAMb,MAAK;EAC/B,MAAMqB,OAAOC,OAAOF,GAAG;EACvB,IAAI,CAACE,OAAOC,SAASF,IAAI,GAAG,OAAO,GAAGR,MAAMb,MAAK;EACjD,IAAIK,QAAQ,KAAK,CAACiB,OAAOE,UAAUH,IAAI,GACrC,OAAO,GAAGR,MAAMb,MAAK;EAEvB,IAAIqB,OAAOR,MAAMV,OAAOkB,OAAOR,MAAMT,KACnC,OAAO,GAAGS,MAAMb,MAAK,mBAAoBa,MAAMV,IAAG,OAAQU,MAAMT,IAAG;EAErE,OAAO;CACT;CAEA,OAAAqB,gBACG5B,WAAS;EAAA,IAACG,QAAK;GAAA,OAAEa,MAAMb;EAAK;EAAA,IAAEC,OAAI;GAAA,OAAEY,MAAMZ;EAAI;EAAA,IAAEgB,QAAK;GAAA,OAAEA,MAAM;EAAC;EAAA,KAAA,WAAA;GAAA,OAASJ,MAAMN;EAAK;EAAA,IAAAmB,WAAA;GAAA,OAAAD,gBAChF3B,OAAK;IACJ6B,MAAI;IAAA,IACJzB,QAAK;KAAA,OAAEY,MAAM;IAAC;IAAA,IACdX,MAAG;KAAA,OAAEU,MAAMV;IAAG;IAAA,IACdC,MAAG;KAAA,OAAES,MAAMT;IAAG;IAAA,IACdwB,OAAI;KAAA,OAAEvB,QAAQ,IAAI,IAAI;IAAK;IAC3BwB,UAAQ;IACRC,UAAUC,UAAU;KAClB,MAAMX,MAAMW,MAAMC,cAAc9B;KAChCa,SAASK,GAAG;KACZ,MAAMa,YAAYd,SAASC,GAAG;KAC9BF,SAASe,SAAS;KAClB,IAAI,CAACA,WAAWpB,MAAMP,SAASgB,OAAOF,GAAG,CAAC;IAC5C;IACAZ,SAASuB,UAAU;KAEjB,IADkBZ,SAASL,MAAM,CAC7BmB,GAAW;MACblB,SAASC,OAAOH,MAAMX,KAAK,CAAC;MAC5BgB,SAAS,EAAE;KACb;KACAL,MAAML,SAASuB,KAAK;IACtB;GAAC,CAAA;EAAA;CAAA,CAAA;AAIT"}

package/dist/components/ui/input/index.d.ts

@@ -1,2 +1,3 @@
 export { Input, type InputProps } from './input';
+export { InputControl, type InputControlProps } from './input-control';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/ui/input/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/input/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/input/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAA;AAChD,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,iBAAiB,CAAA"}

package/dist/components/ui/input/index.js

@@ -1,2 +1,3 @@
+import { InputControl } from "./input-control.js";
 import { Input } from "./input.js";
-export { Input };
+export { Input, InputControl };

package/dist/components/ui/input/input-control.d.ts

@@ -0,0 +1,11 @@
+import type { ComponentProps } from 'solid-js';
+/**
+ * InputControl.
+ *
+ * A styled native input with no optional suggestion-list behavior. Use this
+ * when a consumer needs only the control; `Input` adds native datalist
+ * suggestions for forms that need them.
+ */
+export type InputControlProps = ComponentProps<'input'>;
+export declare function InputControl(props: InputControlProps): import("solid-js").JSX.Element;
+//# sourceMappingURL=input-control.d.ts.map

package/dist/components/ui/input/input-control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-control.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/input/input-control.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAI9C;;;;;;GAMG;AACH,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,OAAO,CAAC,CAAA;AAEvD,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,kCAwBpD"}

package/dist/components/ui/input/input-control.js

@@ -0,0 +1,24 @@
+import { cn } from "../../../lib/utils.js";
+import { mergeProps, spread, template } from "solid-js/web";
+import { splitProps } from "solid-js";
+//#region src/components/ui/input/input-control.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<input data-slot=input>`);
+function InputControl(props) {
+	const [local, rest] = splitProps(props, ["class", "type"]);
+	return (() => {
+		var _el$ = _tmpl$();
+		spread(_el$, mergeProps({
+			get type() {
+				return local.type ?? "text";
+			},
+			get ["class"]() {
+				return cn("h-control-md w-full min-w-0 rounded-md border border-input bg-transparent px-control-md py-1 text-sm", "transition-[color,box-shadow,border-color] ease-out outline-none", "placeholder:text-muted-foreground", "selection:bg-primary selection:text-primary-foreground", "file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground", "focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle", "aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive-subtle", "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50", "read-only:bg-surface-hover", local.class);
+			}
+		}, rest), false, false);
+		return _el$;
+	})();
+}
+//#endregion
+export { InputControl };
+
+//# sourceMappingURL=input-control.js.map

package/dist/components/ui/input/input-control.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-control.js","names":["ComponentProps","splitProps","cn","InputControlProps","InputControl","props","local","rest","_el$","_tmpl$","_$spread","_$mergeProps","type","class","_$mergeProps"],"sources":["../../../../src/components/ui/input/input-control.tsx"],"sourcesContent":["import type { ComponentProps } from 'solid-js'\nimport { splitProps } from 'solid-js'\nimport { cn } from '#lib/utils'\n\n/**\n * InputControl.\n *\n * A styled native input with no optional suggestion-list behavior. Use this\n * when a consumer needs only the control; `Input` adds native datalist\n * suggestions for forms that need them.\n */\nexport type InputControlProps = ComponentProps<'input'>\n\nexport function InputControl(props: InputControlProps) {\n  const [local, rest] = splitProps(props, ['class', 'type'])\n\n  return (\n    <input\n      data-slot=\"input\"\n      type={local.type ?? 'text'}\n      class={cn(\n        'h-control-md w-full min-w-0 rounded-md border border-input bg-transparent px-control-md py-1 text-sm',\n        'transition-[color,box-shadow,border-color] ease-out outline-none',\n        'placeholder:text-muted-foreground',\n        'selection:bg-primary selection:text-primary-foreground',\n        'file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground',\n        /* A pointer click on a text field is a typing affordance, so the ring\n         appears where the user agent already matches :focus-visible. */\n        'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n        'aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive-subtle',\n        'disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n        'read-only:bg-surface-hover',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n"],"mappings":";;;;;AAaA,SAAgBI,aAAaC,OAA0B;CACrD,MAAM,CAACC,OAAOC,QAAQN,WAAWI,OAAO,CAAC,SAAS,MAAM,CAAC;CAEzD,cAAA;EAAA,IAAAG,OAAAC,OAAA;EAAAC,OAAAF,MAAAG,WAAA;GAAA,IAGIC,OAAI;IAAA,OAAEN,MAAMM,QAAQ;GAAM;GAAA,KAAA,WAAA;IAAA,OACnBV,GACL,wGACA,oEACA,qCACA,0DACA,kHAGA,oFACA,4FACA,gFACA,8BACAI,MAAMO,KACR;GAAC;EAAA,GACGN,IAAI,GAAA,OAAA,KAAA;EAAA,OAAAC;CAAA,EAAA,CAAA;AAGd"}

package/dist/components/ui/input/input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/input/input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAI9C;;;;;;;;;;;GAWG;AACH,MAAM,MAAM,UAAU,GAAG,cAAc,CAAC,OAAO,CAAC,GAAG;IACjD,gFAAgF;IAChF,WAAW,CAAC,EAAE,SAAS,MAAM,EAAE,CAAA;CAChC,CAAA;AAED,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,kCAoCtC"}
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/input/input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAK9C;;;;;;;;;;;GAWG;AACH,MAAM,MAAM,UAAU,GAAG,cAAc,CAAC,OAAO,CAAC,GAAG;IACjD,gFAAgF;IAChF,WAAW,CAAC,EAAE,SAAS,MAAM,EAAE,CAAA;CAChC,CAAA;AAED,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,kCA+CtC"}

package/dist/components/ui/input/input.js

@@ -1,51 +1,79 @@
-import { cn } from "../../../lib/utils.js";
-import { createComponent, effect, insert, memo, mergeProps, setAttribute, spread, template } from "solid-js/web";
+import { useFormFieldControl } from "../../../lib/form-field.js";
+import { InputControl } from "./input-control.js";
+import { createComponent, effect, insert, memo, mergeProps, setAttribute, template } from "solid-js/web";
 import { For, Show, createUniqueId, splitProps } from "solid-js";
 //#region src/components/ui/input/input.tsx
-var _tmpl$ = /*#__PURE__*/ template(`<input data-slot=input>`);
-var _tmpl$2 = /*#__PURE__*/ template(`<datalist>`);
-var _tmpl$3 = /*#__PURE__*/ template(`<option>`);
+var _tmpl$ = /*#__PURE__*/ template(`<datalist>`);
+var _tmpl$2 = /*#__PURE__*/ template(`<option>`);
 function Input(props) {
 	const [local, rest] = splitProps(props, [
 		"class",
 		"type",
+		"id",
 		"list",
-		"suggestions"
+		"suggestions",
+		"aria-label",
+		"aria-labelledby",
+		"aria-describedby",
+		"aria-invalid",
+		"aria-errormessage"
 	]);
+	const field = useFormFieldControl("control", {
+		id: local.id,
+		"aria-label": local["aria-label"],
+		"aria-labelledby": local["aria-labelledby"],
+		"aria-describedby": local["aria-describedby"],
+		"aria-invalid": local["aria-invalid"],
+		"aria-errormessage": local["aria-errormessage"]
+	});
 	const suggestionsId = createUniqueId();
 	const listId = () => local.list ?? `input-suggestions-${suggestionsId}`;
-	return [(() => {
-		var _el$ = _tmpl$();
-		spread(_el$, mergeProps({
-			get type() {
-				return local.type ?? "text";
-			},
-			get list() {
-				return memo(() => !!local.suggestions)() ? listId() : local.list;
-			},
-			get ["class"]() {
-				return cn("h-control-md w-full min-w-0 rounded-md border border-input bg-transparent px-control-md py-1 text-sm", "transition-[color,box-shadow,border-color] ease-out outline-none", "placeholder:text-muted-foreground", "selection:bg-primary selection:text-primary-foreground", "file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground", "focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle", "aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive-subtle", "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50", "read-only:bg-surface-hover", local.class);
-			}
-		}, rest), false, false);
-		return _el$;
-	})(), createComponent(Show, {
+	return [createComponent(InputControl, mergeProps(rest, {
+		get ["class"]() {
+			return local.class;
+		},
+		get type() {
+			return local.type;
+		},
+		get id() {
+			return field?.id ?? local.id;
+		},
+		get list() {
+			return memo(() => !!local.suggestions)() ? listId() : local.list;
+		},
+		get ["aria-label"]() {
+			return local["aria-label"];
+		},
+		get ["aria-labelledby"]() {
+			return field?.["aria-labelledby"] ?? local["aria-labelledby"];
+		},
+		get ["aria-describedby"]() {
+			return field?.["aria-describedby"] ?? local["aria-describedby"];
+		},
+		get ["aria-invalid"]() {
+			return field?.["aria-invalid"] ?? local["aria-invalid"];
+		},
+		get ["aria-errormessage"]() {
+			return field?.["aria-errormessage"] ?? local["aria-errormessage"];
+		}
+	})), createComponent(Show, {
 		get when() {
 			return local.suggestions;
 		},
 		children: (suggestions) => (() => {
-			var _el$2 = _tmpl$2();
-			insert(_el$2, createComponent(For, {
+			var _el$ = _tmpl$();
+			insert(_el$, createComponent(For, {
 				get each() {
 					return suggestions();
 				},
 				children: (value) => (() => {
-					var _el$3 = _tmpl$3();
-					_el$3.value = value;
-					return _el$3;
+					var _el$2 = _tmpl$2();
+					_el$2.value = value;
+					return _el$2;
 				})()
 			}));
-			effect(() => setAttribute(_el$2, "id", listId()));
-			return _el$2;
+			effect(() => setAttribute(_el$, "id", listId()));
+			return _el$;
 		})()
 	})];
 }

package/dist/components/ui/input/input.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.js","names":["ComponentProps","createUniqueId","For","Show","splitProps","cn","InputProps","suggestions","Input","props","local","rest","suggestionsId","listId","list","_el$","_tmpl$","_$spread","_$mergeProps","type","_$memo","class","_$createComponent","when","children","_el$2","_tmpl$2","_$insert","each","value","_el$3","_tmpl$3","_$effect","_$setAttribute","_$mergeProps","_$memo","_$createComponent","_$setAttribute"],"sources":["../../../../src/components/ui/input/input.tsx"],"sourcesContent":["import type { ComponentProps } from 'solid-js'\nimport { createUniqueId, For, Show, splitProps } from 'solid-js'\nimport { cn } from '#lib/utils'\n\n/**\n * Input.\n *\n * Deliberately a plain `<input>` rather than a Kobalte TextField part. The\n * styling contract is what a consumer needs from an input; validation,\n * description and error wiring come from `Field`, which composes this. Keeping\n * them separate is what lets an input sit inside a custom control without\n * inheriting a form's ARIA graph.\n *\n * Height comes from `h-control-md`; an input cannot be given a new height\n * without a new token, which is what keeps it aligned with Button and Select.\n */\nexport type InputProps = ComponentProps<'input'> & {\n  /** Native text suggestions; custom values remain valid and submit unchanged. */\n  suggestions?: readonly string[]\n}\n\nexport function Input(props: InputProps) {\n  const [local, rest] = splitProps(props, ['class', 'type', 'list', 'suggestions'])\n  const suggestionsId = createUniqueId()\n  const listId = () => local.list ?? `input-suggestions-${suggestionsId}`\n\n  return (\n    <>\n      <input\n        data-slot=\"input\"\n        type={local.type ?? 'text'}\n        list={local.suggestions ? listId() : local.list}\n        class={cn(\n          'h-control-md w-full min-w-0 rounded-md border border-input bg-transparent px-control-md py-1 text-sm',\n          'transition-[color,box-shadow,border-color] ease-out outline-none',\n          'placeholder:text-muted-foreground',\n          'selection:bg-primary selection:text-primary-foreground',\n          'file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground',\n          /* A pointer click on a text field is a typing affordance, so the ring\n           appears where the user agent already matches :focus-visible. */\n          'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n          'aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive-subtle',\n          'disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n          'read-only:bg-surface-hover',\n          local.class\n        )}\n        {...rest}\n      />\n      <Show when={local.suggestions}>\n        {(suggestions) => (\n          <datalist id={listId()}>\n            <For each={suggestions()}>{(value) => <option value={value} />}</For>\n          </datalist>\n        )}\n      </Show>\n    </>\n  )\n}\n"],"mappings":";;;;;;;AAqBA,SAAgBQ,MAAMC,OAAmB;CACvC,MAAM,CAACC,OAAOC,QAAQP,WAAWK,OAAO;EAAC;EAAS;EAAQ;EAAQ;CAAa,CAAC;CAChF,MAAMG,gBAAgBX,eAAe;CACrC,MAAMY,eAAeH,MAAMI,QAAQ,qBAAqBF;CAExD,OAAA,QAAA;EAAA,IAAAG,OAAAC,OAAA;EAAAC,OAAAF,MAAAG,WAAA;GAAA,IAIMC,OAAI;IAAA,OAAET,MAAMS,QAAQ;GAAM;GAAA,IAC1BL,OAAI;IAAA,OAAEM,WAAA,CAAA,CAAAV,MAAMH,WAAW,CAAA,CAAA,IAAGM,OAAO,IAAIH,MAAMI;GAAI;GAAA,KAAA,WAAA;IAAA,OACxCT,GACL,wGACA,oEACA,qCACA,0DACA,kHAGA,oFACA,4FACA,gFACA,8BACAK,MAAMW,KACR;GAAC;EAAA,GACGV,IAAI,GAAA,OAAA,KAAA;EAAA,OAAAI;CAAA,EAAA,CAAA,GAAAO,gBAETnB,MAAI;EAAA,IAACoB,OAAI;GAAA,OAAEb,MAAMH;EAAW;EAAAiB,WACzBjB,uBAAW;GAAA,IAAAkB,QAAAC,QAAA;GAAAC,OAAAF,OAAAH,gBAERpB,KAAG;IAAA,IAAC0B,OAAI;KAAA,OAAErB,YAAY;IAAC;IAAAiB,WAAIK,iBAAK;KAAA,IAAAC,QAAAC,QAAA;KAAAD,MAAAD,QAAoBA;KAAK,OAAAC;IAAA,EAAA,CAAA;GAAI,CAAA,CAAA;GAAAE,aAAAC,aAAAR,OAAA,MADlDZ,OAAO,CAAC,CAAA;GAAA,OAAAY;EAAA,EAAA,CAAA;CAGvB,CAAA,CAAA;AAIT"}
+{"version":3,"file":"input.js","names":["ComponentProps","createUniqueId","For","Show","splitProps","useFormFieldControl","InputControl","InputProps","suggestions","Input","props","local","rest","field","id","suggestionsId","listId","list","_$createComponent","_$mergeProps","class","type","_$memo","aria-label","aria-labelledby","aria-describedby","aria-invalid","aria-errormessage","when","children","_el$","_tmpl$","_$insert","each","value","_el$2","_tmpl$2","_$effect","_$setAttribute","_$createComponent","_$mergeProps","_$memo","_$setAttribute"],"sources":["../../../../src/components/ui/input/input.tsx"],"sourcesContent":["import type { ComponentProps } from 'solid-js'\nimport { createUniqueId, For, Show, splitProps } from 'solid-js'\nimport { useFormFieldControl } from '#lib/form-field'\nimport { InputControl } from './input-control'\n\n/**\n * Input.\n *\n * Deliberately a plain `<input>` rather than a Kobalte TextField part. The\n * styling contract is what a consumer needs from an input; validation,\n * description and error wiring come from `Field`, which composes this. Keeping\n * them separate is what lets an input sit inside a custom control without\n * inheriting a form's ARIA graph.\n *\n * Height comes from `h-control-md`; an input cannot be given a new height\n * without a new token, which is what keeps it aligned with Button and Select.\n */\nexport type InputProps = ComponentProps<'input'> & {\n  /** Native text suggestions; custom values remain valid and submit unchanged. */\n  suggestions?: readonly string[]\n}\n\nexport function Input(props: InputProps) {\n  const [local, rest] = splitProps(props, [\n    'class',\n    'type',\n    'id',\n    'list',\n    'suggestions',\n    'aria-label',\n    'aria-labelledby',\n    'aria-describedby',\n    'aria-invalid',\n    'aria-errormessage',\n  ])\n  const field = useFormFieldControl('control', {\n    id: local.id,\n    'aria-label': local['aria-label'],\n    'aria-labelledby': local['aria-labelledby'],\n    'aria-describedby': local['aria-describedby'],\n    'aria-invalid': local['aria-invalid'],\n    'aria-errormessage': local['aria-errormessage'],\n  })\n  const suggestionsId = createUniqueId()\n  const listId = () => local.list ?? `input-suggestions-${suggestionsId}`\n\n  return (\n    <>\n      <InputControl\n        {...rest}\n        class={local.class}\n        type={local.type}\n        id={field?.id ?? local.id}\n        list={local.suggestions ? listId() : local.list}\n        aria-label={local['aria-label']}\n        aria-labelledby={field?.['aria-labelledby'] ?? local['aria-labelledby']}\n        aria-describedby={field?.['aria-describedby'] ?? local['aria-describedby']}\n        aria-invalid={field?.['aria-invalid'] ?? local['aria-invalid']}\n        aria-errormessage={field?.['aria-errormessage'] ?? local['aria-errormessage']}\n      />\n      <Show when={local.suggestions}>\n        {(suggestions) => (\n          <datalist id={listId()}>\n            <For each={suggestions()}>{(value) => <option value={value} />}</For>\n          </datalist>\n        )}\n      </Show>\n    </>\n  )\n}\n"],"mappings":";;;;;;;AAsBA,SAAgBS,MAAMC,OAAmB;CACvC,MAAM,CAACC,OAAOC,QAAQR,WAAWM,OAAO;EACtC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CAAmB,CACpB;CACD,MAAMG,QAAQR,oBAAoB,WAAW;EAC3CS,IAAIH,MAAMG;EACV,cAAcH,MAAM;EACpB,mBAAmBA,MAAM;EACzB,oBAAoBA,MAAM;EAC1B,gBAAgBA,MAAM;EACtB,qBAAqBA,MAAM;CAC7B,CAAC;CACD,MAAMI,gBAAgBd,eAAe;CACrC,MAAMe,eAAeL,MAAMM,QAAQ,qBAAqBF;CAExD,OAAA,CAAAG,gBAEKZ,cAAYa,WACPP,MAAI;EAAA,KAAA,WAAA;GAAA,OACDD,MAAMS;EAAK;EAAA,IAClBC,OAAI;GAAA,OAAEV,MAAMU;EAAI;EAAA,IAChBP,KAAE;GAAA,OAAED,OAAOC,MAAMH,MAAMG;EAAE;EAAA,IACzBG,OAAI;GAAA,OAAEK,WAAA,CAAA,CAAAX,MAAMH,WAAW,CAAA,CAAA,IAAGQ,OAAO,IAAIL,MAAMM;EAAI;EAAA,KAAA,gBAAA;GAAA,OACnCN,MAAM;EAAa;EAAA,KAAA,qBAAA;GAAA,OACdE,QAAQ,sBAAsBF,MAAM;EAAkB;EAAA,KAAA,sBAAA;GAAA,OACrDE,QAAQ,uBAAuBF,MAAM;EAAmB;EAAA,KAAA,kBAAA;GAAA,OAC5DE,QAAQ,mBAAmBF,MAAM;EAAe;EAAA,KAAA,uBAAA;GAAA,OAC3CE,QAAQ,wBAAwBF,MAAM;EAAoB;CAAA,CAAA,CAAA,GAAAO,gBAE9Ef,MAAI;EAAA,IAACyB,OAAI;GAAA,OAAEjB,MAAMH;EAAW;EAAAqB,WACzBrB,uBAAW;GAAA,IAAAsB,OAAAC,OAAA;GAAAC,OAAAF,MAAAZ,gBAERhB,KAAG;IAAA,IAAC+B,OAAI;KAAA,OAAEzB,YAAY;IAAC;IAAAqB,WAAIK,iBAAK;KAAA,IAAAC,QAAAC,QAAA;KAAAD,MAAAD,QAAoBA;KAAK,OAAAC;IAAA,EAAA,CAAA;GAAI,CAAA,CAAA;GAAAE,aAAAC,aAAAR,MAAA,MADlDd,OAAO,CAAC,CAAA;GAAA,OAAAc;EAAA,EAAA,CAAA;CAGvB,CAAA,CAAA;AAIT"}

package/dist/components/ui/input-group/index.d.ts

@@ -1,2 +1,3 @@
 export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, type InputGroupAddonProps, } from './input-group';
+export { SecretInputGroup, type SecretInputGroupProps } from './secret-input-group';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/ui/input-group/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/input-group/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EACV,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,cAAc,EACd,KAAK,oBAAoB,GAC1B,MAAM,eAAe,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/input-group/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EACV,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,cAAc,EACd,KAAK,oBAAoB,GAC1B,MAAM,eAAe,CAAA;AACtB,OAAO,EAAE,gBAAgB,EAAE,KAAK,qBAAqB,EAAE,MAAM,sBAAsB,CAAA"}

package/dist/components/ui/input-group/index.js

@@ -1,2 +1,3 @@
 import { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText } from "./input-group.js";
-export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText };
+import { SecretInputGroup } from "./secret-input-group.js";
+export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, SecretInputGroup };

package/dist/components/ui/input-group/input-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input-group.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/input-group/input-group.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,MAAM,UAAU,CAAA;AAInD;;;;;;;;;;;;GAYG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,eAiBtD;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,CAAC,eAe7D;AAED,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,MAAM,CAAC,GAAG;IAC1D,2EAA2E;IAC3E,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;CACxB,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,eAiB1D;AAED,gEAAgE;AAChE,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,QAAQ,CAAC,eAoB/D;AAED,+EAA+E;AAC/E,wBAAgB,cAAc,CAAC,KAAK,EAAE,cAAc,CAAC,MAAM,CAAC,GAAG;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAA;CAAE,eAGxF"}
+{"version":3,"file":"input-group.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/input-group/input-group.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,MAAM,UAAU,CAAA;AAKnD;;;;;;;;;;;;GAYG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,eAiBtD;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,CAAC,eAqC7D;AAED,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,MAAM,CAAC,GAAG;IAC1D,2EAA2E;IAC3E,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;CACxB,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,eAiB1D;AAED,gEAAgE;AAChE,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,QAAQ,CAAC,eAoB/D;AAED,+EAA+E;AAC/E,wBAAgB,cAAc,CAAC,KAAK,EAAE,cAAc,CAAC,MAAM,CAAC,GAAG;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAA;CAAE,eAGxF"}

package/dist/components/ui/input-group/input-group.js

@@ -1,4 +1,5 @@
 import { cn } from "../../../lib/utils.js";
+import { useFormFieldControl } from "../../../lib/form-field.js";
 import { insert, mergeProps, spread, template } from "solid-js/web";
 import { splitProps } from "solid-js";
 //#region src/components/ui/input-group/input-group.tsx
@@ -25,18 +26,54 @@ function InputGroup(props) {
 	return (() => {
 		var _el$ = _tmpl$();
 		spread(_el$, mergeProps({ get ["class"]() {
-			return cn("border-input flex h-control-md w-full min-w-0 items-center gap-1.5 rounded-md border bg-transparent px-control-sm", "transition-[color,box-shadow,border-color] ease-out", "focus-within:border-ring focus-within:ring-3 focus-within:ring-primary-subtle", "has-[[aria-invalid=true]]:border-destructive has-[[aria-invalid=true]]:ring-3 has-[[aria-invalid=true]]:ring-destructive-subtle", "has-[input:disabled]:pointer-events-none has-[input:disabled]:cursor-not-allowed has-[input:disabled]:opacity-50", local.class);
+			return cn("border-input flex h-control-md w-full min-w-0 items-center gap-1.5 rounded-md border bg-transparent px-control-sm", "transition-[color,box-shadow,border-color] ease-out", "focus-within:border-ring focus-within:ring-3 focus-within:ring-primary-subtle", "has-[[aria-invalid=true]]:border-destructive has-[[aria-invalid=true]]:ring-3 has-[[aria-invalid=true]]:ring-destructive-subtle", "has-[input:disabled]:cursor-not-allowed has-[input:disabled]:opacity-50", local.class);
 		} }, rest), false, false);
 		return _el$;
 	})();
 }
 function InputGroupInput(props) {
-	const [local, rest] = splitProps(props, ["class"]);
+	const [local, rest] = splitProps(props, [
+		"class",
+		"id",
+		"aria-label",
+		"aria-labelledby",
+		"aria-describedby",
+		"aria-invalid",
+		"aria-errormessage"
+	]);
+	const field = useFormFieldControl("control", {
+		id: local.id,
+		"aria-label": local["aria-label"],
+		"aria-labelledby": local["aria-labelledby"],
+		"aria-describedby": local["aria-describedby"],
+		"aria-invalid": local["aria-invalid"],
+		"aria-errormessage": local["aria-errormessage"]
+	});
 	return (() => {
 		var _el$2 = _tmpl$2();
-		spread(_el$2, mergeProps({ get ["class"]() {
-			return cn("h-full min-w-0 flex-1 bg-transparent text-sm outline-none", "placeholder:text-muted-foreground", "disabled:cursor-not-allowed", local.class);
-		} }, rest), false, false);
+		spread(_el$2, mergeProps({
+			get id() {
+				return field?.id ?? local.id;
+			},
+			get ["aria-label"]() {
+				return local["aria-label"];
+			},
+			get ["aria-labelledby"]() {
+				return field?.["aria-labelledby"] ?? local["aria-labelledby"];
+			},
+			get ["aria-describedby"]() {
+				return field?.["aria-describedby"] ?? local["aria-describedby"];
+			},
+			get ["aria-invalid"]() {
+				return field?.["aria-invalid"] ?? local["aria-invalid"];
+			},
+			get ["aria-errormessage"]() {
+				return field?.["aria-errormessage"] ?? local["aria-errormessage"];
+			},
+			get ["class"]() {
+				return cn("h-full min-w-0 flex-1 bg-transparent text-sm outline-none", "placeholder:text-muted-foreground", "disabled:cursor-not-allowed", local.class);
+			}
+		}, rest), false, false);
 		return _el$2;
 	})();
 }

package/dist/components/ui/input-group/input-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"input-group.js","names":["ComponentProps","JSX","splitProps","cn","InputGroup","props","local","rest","_el$","_tmpl$","_$spread","_$mergeProps","class","InputGroupInput","_el$2","_tmpl$2","InputGroupAddonProps","align","InputGroupAddon","_el$3","_tmpl$3","_$insert","children","InputGroupButton","_el$4","_tmpl$4","InputGroupText","Element","_el$5","_tmpl$5","_$mergeProps"],"sources":["../../../../src/components/ui/input-group/input-group.tsx"],"sourcesContent":["import type { ComponentProps, JSX } from 'solid-js'\nimport { splitProps } from 'solid-js'\nimport { cn } from '#lib/utils'\n\n/**\n * InputGroup.\n *\n * A field with attached chrome: a leading icon, a unit, a trailing button, a\n * clear affordance. The point of the component is that the adornments and the\n * input share *one* border and *one* focus ring, so the group reads as a single\n * control. Two separate elements side by side always drift — the ring appears\n * on the wrong box, or the border doubles where they meet.\n *\n * The focus ring therefore lives on the group and follows `focus-within`. A\n * group containing several focusable things still reads as focused once, which\n * is the correct affordance: the user is somewhere inside it.\n */\nexport function InputGroup(props: ComponentProps<'div'>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <div\n      data-slot=\"input-group\"\n      class={cn(\n        'border-input flex h-control-md w-full min-w-0 items-center gap-1.5 rounded-md border bg-transparent px-control-sm',\n        'transition-[color,box-shadow,border-color] ease-out',\n        'focus-within:border-ring focus-within:ring-3 focus-within:ring-primary-subtle',\n        'has-[[aria-invalid=true]]:border-destructive has-[[aria-invalid=true]]:ring-3 has-[[aria-invalid=true]]:ring-destructive-subtle',\n        'has-[input:disabled]:pointer-events-none has-[input:disabled]:cursor-not-allowed has-[input:disabled]:opacity-50',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\nexport function InputGroupInput(props: ComponentProps<'input'>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <input\n      data-slot=\"input-group-input\"\n      class={cn(\n        'h-full min-w-0 flex-1 bg-transparent text-sm outline-none',\n        'placeholder:text-muted-foreground',\n        'disabled:cursor-not-allowed',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\nexport type InputGroupAddonProps = ComponentProps<'span'> & {\n  /** Which edge the adornment sits on; also sets the pointer-events rule. */\n  align?: 'start' | 'end'\n}\n\n/**\n * A non-interactive adornment. `pointer-events-none` by default, because an\n * adornment that swallows a click makes the whole control feel dead just to\n * the left of the caret — the most annoying possible bug. Pass `align=\"end\"`\n * and a real element when the adornment must be clickable.\n */\nexport function InputGroupAddon(props: InputGroupAddonProps) {\n  const [local, rest] = splitProps(props, ['class', 'align', 'children'])\n\n  return (\n    <span\n      data-slot=\"input-group-addon\"\n      class={cn(\n        'text-muted-foreground flex shrink-0 items-center gap-1.5 text-sm select-none',\n        '[&_svg]:pointer-events-none [&_svg]:size-4',\n        { 'order-first': local.align !== 'end', 'order-last': local.align === 'end' },\n        local.class\n      )}\n      {...rest}\n    >\n      {local.children}\n    </span>\n  )\n}\n\n/** A clickable trailing button, sized to the group's height. */\nexport function InputGroupButton(props: ComponentProps<'button'>) {\n  const [local, rest] = splitProps(props, ['class', 'children'])\n\n  return (\n    <button\n      type=\"button\"\n      data-slot=\"input-group-button\"\n      class={cn(\n        'text-muted-foreground -me-1 flex size-6 shrink-0 items-center justify-center rounded-sm',\n        'transition-colors ease-out outline-none hover:bg-surface-hover hover:text-foreground',\n        'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n        'disabled:pointer-events-none disabled:opacity-50',\n        '[&_svg]:size-3.5',\n        local.class\n      )}\n      {...rest}\n    >\n      {local.children}\n    </button>\n  )\n}\n\n/** Text that reads as a value but is not an input, e.g. a unit or a suffix. */\nexport function InputGroupText(props: ComponentProps<'span'> & { children?: JSX.Element }) {\n  const [local, rest] = splitProps(props, ['class'])\n  return <span class={cn('text-muted-foreground text-sm', local.class)} {...rest} />\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAiBA,SAAgBI,WAAWC,OAA8B;CACvD,MAAM,CAACC,OAAOC,QAAQL,WAAWG,OAAO,CAAC,OAAO,CAAC;CAEjD,cAAA;EAAA,IAAAG,OAAAC,OAAA;EAAAC,OAAAF,MAAAG,WAAA,EAAA,KAAA,WAAA;GAAA,OAGWR,GACL,qHACA,uDACA,iFACA,mIACA,oHACAG,MAAMM,KACR;EAAC,EAAA,GACGL,IAAI,GAAA,OAAA,KAAA;EAAA,OAAAC;CAAA,EAAA,CAAA;AAGd;AAEA,SAAgBK,gBAAgBR,OAAgC;CAC9D,MAAM,CAACC,OAAOC,QAAQL,WAAWG,OAAO,CAAC,OAAO,CAAC;CAEjD,cAAA;EAAA,IAAAS,QAAAC,QAAA;EAAAL,OAAAI,OAAAH,WAAA,EAAA,KAAA,WAAA;GAAA,OAGWR,GACL,6DACA,qCACA,+BACAG,MAAMM,KACR;EAAC,EAAA,GACGL,IAAI,GAAA,OAAA,KAAA;EAAA,OAAAO;CAAA,EAAA,CAAA;AAGd;;;;;;;AAaA,SAAgBI,gBAAgBb,OAA6B;CAC3D,MAAM,CAACC,OAAOC,QAAQL,WAAWG,OAAO;EAAC;EAAS;EAAS;CAAU,CAAC;CAEtE,cAAA;EAAA,IAAAc,QAAAC,QAAA;EAAAV,OAAAS,OAAAR,WAAA,EAAA,KAAA,WAAA;GAAA,OAGWR,GACL,gFACA,8CACA;IAAE,eAAeG,MAAMW,UAAU;IAAO,cAAcX,MAAMW,UAAU;GAAM,GAC5EX,MAAMM,KACR;EAAC,EAAA,GACGL,IAAI,GAAA,OAAA,IAAA;EAAAc,OAAAF,aAEPb,MAAMgB,QAAQ;EAAA,OAAAH;CAAA,EAAA,CAAA;AAGrB;;AAGA,SAAgBI,iBAAiBlB,OAAiC;CAChE,MAAM,CAACC,OAAOC,QAAQL,WAAWG,OAAO,CAAC,SAAS,UAAU,CAAC;CAE7D,cAAA;EAAA,IAAAmB,QAAAC,QAAA;EAAAf,OAAAc,OAAAb,WAAA,EAAA,KAAA,WAAA;GAAA,OAIWR,GACL,2FACA,wFACA,oFACA,oDACA,oBACAG,MAAMM,KACR;EAAC,EAAA,GACGL,IAAI,GAAA,OAAA,IAAA;EAAAc,OAAAG,aAEPlB,MAAMgB,QAAQ;EAAA,OAAAE;CAAA,EAAA,CAAA;AAGrB;;AAGA,SAAgBE,eAAerB,OAA4D;CACzF,MAAM,CAACC,OAAOC,QAAQL,WAAWG,OAAO,CAAC,OAAO,CAAC;CACjD,cAAA;EAAA,IAAAuB,QAAAC,QAAA;EAAAnB,OAAAkB,OAAAjB,WAAA,EAAA,KAAA,WAAA;GAAA,OAAoBR,GAAG,iCAAiCG,MAAMM,KAAK;EAAC,EAAA,GAAML,IAAI,GAAA,OAAA,KAAA;EAAA,OAAAqB;CAAA,EAAA,CAAA;AAChF"}
+{"version":3,"file":"input-group.js","names":["ComponentProps","JSX","splitProps","useFormFieldControl","cn","InputGroup","props","local","rest","_el$","_tmpl$","_$spread","_$mergeProps","class","InputGroupInput","field","id","_el$2","_tmpl$2","aria-label","aria-labelledby","aria-describedby","aria-invalid","aria-errormessage","InputGroupAddonProps","align","InputGroupAddon","_el$3","_tmpl$3","_$insert","children","InputGroupButton","_el$4","_tmpl$4","InputGroupText","Element","_el$5","_tmpl$5","_$mergeProps"],"sources":["../../../../src/components/ui/input-group/input-group.tsx"],"sourcesContent":["import type { ComponentProps, JSX } from 'solid-js'\nimport { splitProps } from 'solid-js'\nimport { useFormFieldControl } from '#lib/form-field'\nimport { cn } from '#lib/utils'\n\n/**\n * InputGroup.\n *\n * A field with attached chrome: a leading icon, a unit, a trailing button, a\n * clear affordance. The point of the component is that the adornments and the\n * input share *one* border and *one* focus ring, so the group reads as a single\n * control. Two separate elements side by side always drift — the ring appears\n * on the wrong box, or the border doubles where they meet.\n *\n * The focus ring therefore lives on the group and follows `focus-within`. A\n * group containing several focusable things still reads as focused once, which\n * is the correct affordance: the user is somewhere inside it.\n */\nexport function InputGroup(props: ComponentProps<'div'>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <div\n      data-slot=\"input-group\"\n      class={cn(\n        'border-input flex h-control-md w-full min-w-0 items-center gap-1.5 rounded-md border bg-transparent px-control-sm',\n        'transition-[color,box-shadow,border-color] ease-out',\n        'focus-within:border-ring focus-within:ring-3 focus-within:ring-primary-subtle',\n        'has-[[aria-invalid=true]]:border-destructive has-[[aria-invalid=true]]:ring-3 has-[[aria-invalid=true]]:ring-destructive-subtle',\n        'has-[input:disabled]:cursor-not-allowed has-[input:disabled]:opacity-50',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\nexport function InputGroupInput(props: ComponentProps<'input'>) {\n  const [local, rest] = splitProps(props, [\n    'class',\n    'id',\n    'aria-label',\n    'aria-labelledby',\n    'aria-describedby',\n    'aria-invalid',\n    'aria-errormessage',\n  ])\n  const field = useFormFieldControl('control', {\n    id: local.id,\n    'aria-label': local['aria-label'],\n    'aria-labelledby': local['aria-labelledby'],\n    'aria-describedby': local['aria-describedby'],\n    'aria-invalid': local['aria-invalid'],\n    'aria-errormessage': local['aria-errormessage'],\n  })\n\n  return (\n    <input\n      data-slot=\"input-group-input\"\n      id={field?.id ?? local.id}\n      aria-label={local['aria-label']}\n      aria-labelledby={field?.['aria-labelledby'] ?? local['aria-labelledby']}\n      aria-describedby={field?.['aria-describedby'] ?? local['aria-describedby']}\n      aria-invalid={field?.['aria-invalid'] ?? local['aria-invalid']}\n      aria-errormessage={field?.['aria-errormessage'] ?? local['aria-errormessage']}\n      class={cn(\n        'h-full min-w-0 flex-1 bg-transparent text-sm outline-none',\n        'placeholder:text-muted-foreground',\n        'disabled:cursor-not-allowed',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\nexport type InputGroupAddonProps = ComponentProps<'span'> & {\n  /** Which edge the adornment sits on; also sets the pointer-events rule. */\n  align?: 'start' | 'end'\n}\n\n/**\n * A non-interactive adornment. `pointer-events-none` by default, because an\n * adornment that swallows a click makes the whole control feel dead just to\n * the left of the caret — the most annoying possible bug. Pass `align=\"end\"`\n * and a real element when the adornment must be clickable.\n */\nexport function InputGroupAddon(props: InputGroupAddonProps) {\n  const [local, rest] = splitProps(props, ['class', 'align', 'children'])\n\n  return (\n    <span\n      data-slot=\"input-group-addon\"\n      class={cn(\n        'text-muted-foreground flex shrink-0 items-center gap-1.5 text-sm select-none',\n        '[&_svg]:pointer-events-none [&_svg]:size-4',\n        { 'order-first': local.align !== 'end', 'order-last': local.align === 'end' },\n        local.class\n      )}\n      {...rest}\n    >\n      {local.children}\n    </span>\n  )\n}\n\n/** A clickable trailing button, sized to the group's height. */\nexport function InputGroupButton(props: ComponentProps<'button'>) {\n  const [local, rest] = splitProps(props, ['class', 'children'])\n\n  return (\n    <button\n      type=\"button\"\n      data-slot=\"input-group-button\"\n      class={cn(\n        'text-muted-foreground -me-1 flex size-6 shrink-0 items-center justify-center rounded-sm',\n        'transition-colors ease-out outline-none hover:bg-surface-hover hover:text-foreground',\n        'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n        'disabled:pointer-events-none disabled:opacity-50',\n        '[&_svg]:size-3.5',\n        local.class\n      )}\n      {...rest}\n    >\n      {local.children}\n    </button>\n  )\n}\n\n/** Text that reads as a value but is not an input, e.g. a unit or a suffix. */\nexport function InputGroupText(props: ComponentProps<'span'> & { children?: JSX.Element }) {\n  const [local, rest] = splitProps(props, ['class'])\n  return <span class={cn('text-muted-foreground text-sm', local.class)} {...rest} />\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAkBA,SAAgBK,WAAWC,OAA8B;CACvD,MAAM,CAACC,OAAOC,QAAQN,WAAWI,OAAO,CAAC,OAAO,CAAC;CAEjD,cAAA;EAAA,IAAAG,OAAAC,OAAA;EAAAC,OAAAF,MAAAG,WAAA,EAAA,KAAA,WAAA;GAAA,OAGWR,GACL,qHACA,uDACA,iFACA,mIACA,2EACAG,MAAMM,KACR;EAAC,EAAA,GACGL,IAAI,GAAA,OAAA,KAAA;EAAA,OAAAC;CAAA,EAAA,CAAA;AAGd;AAEA,SAAgBK,gBAAgBR,OAAgC;CAC9D,MAAM,CAACC,OAAOC,QAAQN,WAAWI,OAAO;EACtC;EACA;EACA;EACA;EACA;EACA;EACA;CAAmB,CACpB;CACD,MAAMS,QAAQZ,oBAAoB,WAAW;EAC3Ca,IAAIT,MAAMS;EACV,cAAcT,MAAM;EACpB,mBAAmBA,MAAM;EACzB,oBAAoBA,MAAM;EAC1B,gBAAgBA,MAAM;EACtB,qBAAqBA,MAAM;CAC7B,CAAC;CAED,cAAA;EAAA,IAAAU,QAAAC,QAAA;EAAAP,OAAAM,OAAAL,WAAA;GAAA,IAGII,KAAE;IAAA,OAAED,OAAOC,MAAMT,MAAMS;GAAE;GAAA,KAAA,gBAAA;IAAA,OACbT,MAAM;GAAa;GAAA,KAAA,qBAAA;IAAA,OACdQ,QAAQ,sBAAsBR,MAAM;GAAkB;GAAA,KAAA,sBAAA;IAAA,OACrDQ,QAAQ,uBAAuBR,MAAM;GAAmB;GAAA,KAAA,kBAAA;IAAA,OAC5DQ,QAAQ,mBAAmBR,MAAM;GAAe;GAAA,KAAA,uBAAA;IAAA,OAC3CQ,QAAQ,wBAAwBR,MAAM;GAAoB;GAAA,KAAA,WAAA;IAAA,OACtEH,GACL,6DACA,qCACA,+BACAG,MAAMM,KACR;GAAC;EAAA,GACGL,IAAI,GAAA,OAAA,KAAA;EAAA,OAAAS;CAAA,EAAA,CAAA;AAGd;;;;;;;AAaA,SAAgBS,gBAAgBpB,OAA6B;CAC3D,MAAM,CAACC,OAAOC,QAAQN,WAAWI,OAAO;EAAC;EAAS;EAAS;CAAU,CAAC;CAEtE,cAAA;EAAA,IAAAqB,QAAAC,QAAA;EAAAjB,OAAAgB,OAAAf,WAAA,EAAA,KAAA,WAAA;GAAA,OAGWR,GACL,gFACA,8CACA;IAAE,eAAeG,MAAMkB,UAAU;IAAO,cAAclB,MAAMkB,UAAU;GAAM,GAC5ElB,MAAMM,KACR;EAAC,EAAA,GACGL,IAAI,GAAA,OAAA,IAAA;EAAAqB,OAAAF,aAEPpB,MAAMuB,QAAQ;EAAA,OAAAH;CAAA,EAAA,CAAA;AAGrB;;AAGA,SAAgBI,iBAAiBzB,OAAiC;CAChE,MAAM,CAACC,OAAOC,QAAQN,WAAWI,OAAO,CAAC,SAAS,UAAU,CAAC;CAE7D,cAAA;EAAA,IAAA0B,QAAAC,QAAA;EAAAtB,OAAAqB,OAAApB,WAAA,EAAA,KAAA,WAAA;GAAA,OAIWR,GACL,2FACA,wFACA,oFACA,oDACA,oBACAG,MAAMM,KACR;EAAC,EAAA,GACGL,IAAI,GAAA,OAAA,IAAA;EAAAqB,OAAAG,aAEPzB,MAAMuB,QAAQ;EAAA,OAAAE;CAAA,EAAA,CAAA;AAGrB;;AAGA,SAAgBE,eAAe5B,OAA4D;CACzF,MAAM,CAACC,OAAOC,QAAQN,WAAWI,OAAO,CAAC,OAAO,CAAC;CACjD,cAAA;EAAA,IAAA8B,QAAAC,QAAA;EAAA1B,OAAAyB,OAAAxB,WAAA,EAAA,KAAA,WAAA;GAAA,OAAoBR,GAAG,iCAAiCG,MAAMM,KAAK;EAAC,EAAA,GAAML,IAAI,GAAA,OAAA,KAAA;EAAA,OAAA4B;CAAA,EAAA,CAAA;AAChF"}

package/dist/components/ui/input-group/secret-input-group.d.ts

@@ -0,0 +1,11 @@
+import { type ComponentProps, type JSX } from 'solid-js';
+export type SecretInputGroupProps = {
+    value: string;
+    disabled: boolean;
+    onChange: JSX.EventHandler<HTMLInputElement, Event>;
+    onClear?: () => void;
+    class?: string;
+} & Pick<ComponentProps<'input'>, 'id' | 'aria-label' | 'aria-describedby' | 'aria-invalid'>;
+/** A password input with an optional keyboard-accessible clear action. */
+export declare function SecretInputGroup(props: SecretInputGroupProps): JSX.Element;
+//# sourceMappingURL=secret-input-group.d.ts.map

package/dist/components/ui/input-group/secret-input-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"secret-input-group.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/input-group/secret-input-group.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA0B,KAAK,cAAc,EAAE,KAAK,GAAG,EAAE,MAAM,UAAU,CAAA;AAKhF,MAAM,MAAM,qBAAqB,GAAG;IAClC,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,OAAO,CAAA;IACjB,QAAQ,EAAE,GAAG,CAAC,YAAY,CAAC,gBAAgB,EAAE,KAAK,CAAC,CAAA;IACnD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,IAAI,GAAG,YAAY,GAAG,kBAAkB,GAAG,cAAc,CAAC,CAAA;AAE5F,0EAA0E;AAC1E,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,eA2C5D"}

package/dist/components/ui/input-group/secret-input-group.js

@@ -0,0 +1,67 @@
+import { FormFieldContext } from "../../../lib/form-field.js";
+import { ActionButton } from "../../composites/action-button/action-button.js";
+import { InputGroup, InputGroupInput } from "./input-group.js";
+import { createComponent, mergeProps } from "solid-js/web";
+import { splitProps, useContext } from "solid-js";
+//#region src/components/ui/input-group/secret-input-group.tsx
+/** A password input with an optional keyboard-accessible clear action. */
+function SecretInputGroup(props) {
+	const field = useContext(FormFieldContext);
+	const [local, rest] = splitProps(props, [
+		"value",
+		"disabled",
+		"onChange",
+		"onClear",
+		"aria-label",
+		"class"
+	]);
+	const input = createComponent(InputGroupInput, mergeProps(rest, {
+		get ["aria-label"]() {
+			return local["aria-label"] ?? (field ? void 0 : "New API key");
+		},
+		type: "password",
+		autocomplete: "new-password",
+		get value() {
+			return local.value;
+		},
+		get disabled() {
+			return local.disabled;
+		},
+		get onInput() {
+			return local.onChange;
+		}
+	}));
+	if (!local.onClear) return createComponent(InputGroup, {
+		get ["class"]() {
+			return local.class;
+		},
+		children: input
+	});
+	return createComponent(InputGroup, {
+		get ["class"]() {
+			return local.class;
+		},
+		get children() {
+			return [input, createComponent(ActionButton, {
+				"data-slot": "input-group-button",
+				variant: "ghost",
+				size: "xs",
+				"class": "-me-1 h-6 min-w-0 shrink-0 px-2",
+				get disabled() {
+					return local.disabled;
+				},
+				get tooltip() {
+					return local.disabled ? "This API key is managed by policy" : "Clear API key";
+				},
+				tooltipSide: "top",
+				"aria-label": "Clear API key",
+				onClick: () => local.onClear?.(),
+				children: "Clear"
+			})];
+		}
+	});
+}
+//#endregion
+export { SecretInputGroup };
+
+//# sourceMappingURL=secret-input-group.js.map

package/dist/components/ui/input-group/secret-input-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"secret-input-group.js","names":["splitProps","useContext","ComponentProps","JSX","ActionButton","FormFieldContext","InputGroup","InputGroupInput","SecretInputGroupProps","value","disabled","onChange","EventHandler","HTMLInputElement","Event","onClear","class","Pick","SecretInputGroup","props","field","local","rest","input","_$createComponent","_$mergeProps","aria-label","undefined","type","autocomplete","onInput","children","variant","size","tooltip","tooltipSide","onClick","_$createComponent","_$mergeProps"],"sources":["../../../../src/components/ui/input-group/secret-input-group.tsx"],"sourcesContent":["import { splitProps, useContext, type ComponentProps, type JSX } from 'solid-js'\nimport { ActionButton } from '../../composites/action-button'\nimport { FormFieldContext } from '#lib/form-field'\nimport { InputGroup, InputGroupInput } from './input-group'\n\nexport type SecretInputGroupProps = {\n  value: string\n  disabled: boolean\n  onChange: JSX.EventHandler<HTMLInputElement, Event>\n  onClear?: () => void\n  class?: string\n} & Pick<ComponentProps<'input'>, 'id' | 'aria-label' | 'aria-describedby' | 'aria-invalid'>\n\n/** A password input with an optional keyboard-accessible clear action. */\nexport function SecretInputGroup(props: SecretInputGroupProps) {\n  const field = useContext(FormFieldContext)\n  const [local, rest] = splitProps(props, [\n    'value',\n    'disabled',\n    'onChange',\n    'onClear',\n    'aria-label',\n    'class',\n  ])\n\n  const input = (\n    <InputGroupInput\n      {...rest}\n      aria-label={local['aria-label'] ?? (field ? undefined : 'New API key')}\n      type=\"password\"\n      autocomplete=\"new-password\"\n      value={local.value}\n      disabled={local.disabled}\n      onInput={local.onChange}\n    />\n  )\n\n  if (!local.onClear) return <InputGroup class={local.class}>{input}</InputGroup>\n\n  return (\n    <InputGroup class={local.class}>\n      {input}\n      <ActionButton\n        data-slot=\"input-group-button\"\n        variant=\"ghost\"\n        size=\"xs\"\n        class=\"-me-1 h-6 min-w-0 shrink-0 px-2\"\n        disabled={local.disabled}\n        tooltip={local.disabled ? 'This API key is managed by policy' : 'Clear API key'}\n        tooltipSide=\"top\"\n        aria-label=\"Clear API key\"\n        onClick={() => local.onClear?.()}\n      >\n        Clear\n      </ActionButton>\n    </InputGroup>\n  )\n}\n"],"mappings":";;;;;;;AAcA,SAAgBkB,iBAAiBC,OAA8B;CAC7D,MAAMC,QAAQnB,WAAWI,gBAAgB;CACzC,MAAM,CAACgB,OAAOC,QAAQtB,WAAWmB,OAAO;EACtC;EACA;EACA;EACA;EACA;EACA;CAAO,CACR;CAED,MAAMI,QAAKC,gBACRjB,iBAAekB,WACVH,MAAI;EAAA,KAAA,gBAAA;GAAA,OACID,MAAM,kBAAkBD,QAAQO,KAAAA,IAAY;EAAc;EACtEC,MAAI;EACJC,cAAY;EAAA,IACZpB,QAAK;GAAA,OAAEY,MAAMZ;EAAK;EAAA,IAClBC,WAAQ;GAAA,OAAEW,MAAMX;EAAQ;EAAA,IACxBoB,UAAO;GAAA,OAAET,MAAMV;EAAQ;CAAA,CAAA,CAAA;CAI3B,IAAI,CAACU,MAAMN,SAAS,OAAAS,gBAAQlB,YAAU;EAAA,KAAA,WAAA;GAAA,OAAQe,MAAML;EAAK;EAAAe,UAAGR;CAAK,CAAA;CAEjE,OAAAC,gBACGlB,YAAU;EAAA,KAAA,WAAA;GAAA,OAAQe,MAAML;EAAK;EAAA,IAAAe,WAAA;GAAA,OAAA,CAC3BR,OAAKC,gBACLpB,cAAY;IAAA,aAAA;IAEX4B,SAAO;IACPC,MAAI;IAAA,SAAA;IAAA,IAEJvB,WAAQ;KAAA,OAAEW,MAAMX;IAAQ;IAAA,IACxBwB,UAAO;KAAA,OAAEb,MAAMX,WAAW,sCAAsC;IAAe;IAC/EyB,aAAW;IAAA,cAAA;IAEXC,eAAef,MAAMN,UAAU;IAACgB,UAAA;GAAA,CAAA,CAAA;EAAA;CAAA,CAAA;AAMxC"}

package/dist/components/ui/native-select/native-select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"native-select.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/native-select/native-select.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAI9C,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG;IACzD,mEAAmE;IACnE,OAAO,CAAC,EAAE,SAAS,kBAAkB,EAAE,CAAA;IACvC,2EAA2E;IAC3E,YAAY,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAA;CACjD,CAAA;AAkCD;;;;;;;;;GASG;AACH,MAAM,MAAM,kBAAkB,GAAG,QAAQ,CAAC;IACxC,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAC,CAAA;AAEF,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,kCAoDpD"}
+{"version":3,"file":"native-select.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/native-select/native-select.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAK9C,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG;IACzD,mEAAmE;IACnE,OAAO,CAAC,EAAE,SAAS,kBAAkB,EAAE,CAAA;IACvC,2EAA2E;IAC3E,YAAY,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAA;CACjD,CAAA;AAkCD;;;;;;;;;GASG;AACH,MAAM,MAAM,kBAAkB,GAAG,QAAQ,CAAC;IACxC,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAC,CAAA;AAEF,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,kCA6EpD"}

package/dist/components/ui/native-select/native-select.js

@@ -1,4 +1,5 @@
 import { cn } from "../../../lib/utils.js";
+import { useFormFieldControl } from "../../../lib/form-field.js";
 import { createComponent, effect, insert, mergeProps, spread, template, use } from "solid-js/web";
 import { ChevronDownIcon } from "lucide-solid";
 import { For, Show, createEffect, onMount, splitProps } from "solid-js";
@@ -25,8 +26,22 @@ function NativeSelect(props) {
 		"class",
 		"children",
 		"defaultValue",
-		"options"
+		"options",
+		"id",
+		"aria-label",
+		"aria-labelledby",
+		"aria-describedby",
+		"aria-invalid",
+		"aria-errormessage"
 	]);
+	const field = useFormFieldControl("control", {
+		id: local.id,
+		"aria-label": local["aria-label"],
+		"aria-labelledby": local["aria-labelledby"],
+		"aria-describedby": local["aria-describedby"],
+		"aria-invalid": local["aria-invalid"],
+		"aria-errormessage": local["aria-errormessage"]
+	});
 	let select;
 	createEffect(() => {
 		if (!select) return;
@@ -40,9 +55,29 @@ function NativeSelect(props) {
 		use((element) => {
 			select = element;
 		}, _el$2);
-		spread(_el$2, mergeProps({ get ["class"]() {
-			return cn("h-control-md min-w-0 appearance-none rounded-md border border-input bg-transparent px-control-md pr-9 text-sm", "transition-[color,box-shadow,border-color] ease-out outline-none", "focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle", "aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive-subtle", "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 dark:bg-input/30", local.class);
-		} }, rest), false, true);
+		spread(_el$2, mergeProps({
+			get id() {
+				return field?.id ?? local.id;
+			},
+			get ["aria-label"]() {
+				return local["aria-label"];
+			},
+			get ["aria-labelledby"]() {
+				return field?.["aria-labelledby"] ?? local["aria-labelledby"];
+			},
+			get ["aria-describedby"]() {
+				return field?.["aria-describedby"] ?? local["aria-describedby"];
+			},
+			get ["aria-invalid"]() {
+				return field?.["aria-invalid"] ?? local["aria-invalid"];
+			},
+			get ["aria-errormessage"]() {
+				return field?.["aria-errormessage"] ?? local["aria-errormessage"];
+			},
+			get ["class"]() {
+				return cn("h-control-md min-w-0 appearance-none rounded-md border border-input bg-transparent px-control-md pr-9 text-sm", "transition-[color,box-shadow,border-color] ease-out outline-none", "focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle", "aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive-subtle", "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 dark:bg-input/30", local.class);
+			}
+		}, rest), false, true);
 		insert(_el$2, createComponent(Show, {
 			get when() {
 				return local.options;

package/dist/components/ui/native-select/native-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"native-select.js","names":["ChevronDownIcon","ComponentProps","createEffect","For","onMount","Show","splitProps","cn","NativeSelectProps","options","NativeSelectOption","defaultValue","setSelectedValue","select","HTMLSelectElement","value","multiple","undefined","Array","isArray","selected","Set","map","String","option","has","initializeDefaultSelection","defaultValues","defaultSelected","Readonly","label","disabled","NativeSelect","props","local","rest","Boolean","_el$","_tmpl$","_el$2","firstChild","_$use","element","_$spread","_$mergeProps","class","_$insert","_$createComponent","when","fallback","children","each","_el$3","_tmpl$2","_$effect","_$mergeProps","_$createComponent"],"sources":["../../../../src/components/ui/native-select/native-select.tsx"],"sourcesContent":["import { ChevronDownIcon } from 'lucide-solid'\nimport type { ComponentProps } from 'solid-js'\nimport { createEffect, For, onMount, Show, splitProps } from 'solid-js'\nimport { cn } from '#lib/utils'\n\nexport type NativeSelectProps = ComponentProps<'select'> & {\n  /** Render the choices from data instead of raw option children. */\n  options?: readonly NativeSelectOption[]\n  /** Initialize an uncontrolled selection after its native options mount. */\n  defaultValue?: ComponentProps<'select'>['value']\n}\n\nfunction setSelectedValue(\n  select: HTMLSelectElement,\n  value: ComponentProps<'select'>['value'],\n  multiple: boolean\n) {\n  if (value === undefined) return\n\n  if (multiple && Array.isArray(value)) {\n    const selected = new Set(value.map(String))\n    for (const option of select.options) option.selected = selected.has(option.value)\n    return\n  }\n\n  select.value = String(Array.isArray(value) ? (value[0] ?? '') : value)\n}\n\nfunction initializeDefaultSelection(\n  select: HTMLSelectElement,\n  value: ComponentProps<'select'>['value'],\n  multiple: boolean\n) {\n  if (value === undefined) return\n\n  const defaultValues =\n    multiple && Array.isArray(value)\n      ? new Set(value.map(String))\n      : new Set([String(Array.isArray(value) ? (value[0] ?? '') : value)])\n\n  for (const option of select.options) option.defaultSelected = defaultValues.has(option.value)\n  setSelectedValue(select, value, multiple)\n}\n\n/**\n * NativeSelect.\n *\n * A styled native `<select>` for compact, finite choices. Use `Select` when the\n * list needs a custom popover, typed options, or runtime filtering; this keeps\n * the browser's built-in keyboard, form, option, and label behavior.\n *\n * Translated from shadcn/ui's MIT-licensed NativeSelect wrapper to SolidJS and\n * the Adea token system; see the root NOTICE for source and attribution.\n */\nexport type NativeSelectOption = Readonly<{\n  value: string\n  label: string\n  disabled?: boolean\n}>\n\nexport function NativeSelect(props: NativeSelectProps) {\n  const [local, rest] = splitProps(props, ['class', 'children', 'defaultValue', 'options'])\n  let select: HTMLSelectElement | undefined\n\n  // Set selection after native options exist; setting select.value before its\n  // children are mounted makes browsers fall back to the first option.\n  createEffect(() => {\n    if (!select) return\n    setSelectedValue(select, rest.value, Boolean(rest.multiple))\n  })\n  onMount(() => {\n    if (select && rest.value === undefined) {\n      initializeDefaultSelection(select, local.defaultValue, Boolean(rest.multiple))\n    }\n  })\n\n  return (\n    <span data-slot=\"native-select-wrapper\" class=\"relative inline-flex min-w-0\">\n      <select\n        ref={(element) => {\n          select = element\n        }}\n        data-slot=\"native-select\"\n        class={cn(\n          'h-control-md min-w-0 appearance-none rounded-md border border-input bg-transparent px-control-md pr-9 text-sm',\n          'transition-[color,box-shadow,border-color] ease-out outline-none',\n          'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n          'aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive-subtle',\n          'disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 dark:bg-input/30',\n          local.class\n        )}\n        {...rest}\n      >\n        <Show when={local.options} fallback={local.children}>\n          {(options) => (\n            <For each={options()}>\n              {(option) => (\n                <option value={option.value} disabled={option.disabled}>\n                  {option.label}\n                </option>\n              )}\n            </For>\n          )}\n        </Show>\n      </select>\n      <ChevronDownIcon\n        data-slot=\"native-select-icon\"\n        aria-hidden=\"true\"\n        class=\"pointer-events-none absolute end-2 top-1/2 size-4 -translate-y-1/2 text-muted-foreground\"\n      />\n    </span>\n  )\n}\n"],"mappings":";;;;;;;AAYA,SAASY,iBACPC,QACAE,OACAC,UACA;CACA,IAAID,UAAUE,KAAAA,GAAW;CAEzB,IAAID,YAAYE,MAAMC,QAAQJ,KAAK,GAAG;EACpC,MAAMK,WAAW,IAAIC,IAAIN,MAAMO,IAAIC,MAAM,CAAC;EAC1C,KAAK,MAAMC,UAAUX,OAAOJ,SAASe,OAAOJ,WAAWA,SAASK,IAAID,OAAOT,KAAK;EAChF;CACF;CAEAF,OAAOE,QAAQQ,OAAOL,MAAMC,QAAQJ,KAAK,IAAKA,MAAM,MAAM,KAAMA,KAAK;AACvE;AAEA,SAASW,2BACPb,QACAE,OACAC,UACA;CACA,IAAID,UAAUE,KAAAA,GAAW;CAEzB,MAAMU,gBACJX,YAAYE,MAAMC,QAAQJ,KAAK,IAC3B,IAAIM,IAAIN,MAAMO,IAAIC,MAAM,CAAC,oBACzB,IAAIF,IAAI,CAACE,OAAOL,MAAMC,QAAQJ,KAAK,IAAKA,MAAM,MAAM,KAAMA,KAAK,CAAC,CAAC;CAEvE,KAAK,MAAMS,UAAUX,OAAOJ,SAASe,OAAOI,kBAAkBD,cAAcF,IAAID,OAAOT,KAAK;CAC5FH,iBAAiBC,QAAQE,OAAOC,QAAQ;AAC1C;AAkBA,SAAgBgB,aAAaC,OAA0B;CACrD,MAAM,CAACC,OAAOC,QAAQ7B,WAAW2B,OAAO;EAAC;EAAS;EAAY;EAAgB;CAAS,CAAC;CACxF,IAAIpB;CAIJX,mBAAmB;EACjB,IAAI,CAACW,QAAQ;EACbD,iBAAiBC,QAAQsB,KAAKpB,OAAOqB,QAAQD,KAAKnB,QAAQ,CAAC;CAC7D,CAAC;CACDZ,cAAc;EACZ,IAAIS,UAAUsB,KAAKpB,UAAUE,KAAAA,GAC3BS,2BAA2Bb,QAAQqB,MAAMvB,cAAcyB,QAAQD,KAAKnB,QAAQ,CAAC;CAEjF,CAAC;CAED,cAAA;EAAA,IAAAqB,OAAAC,OAAA,GAAAC,QAAAF,KAAAG;EAAAC,KAGYC,YAAY;GAChB7B,SAAS6B;EACX,GAACH,KAAA;EAAAI,OAAAJ,OAAAK,WAAA,EAAA,KAAA,WAAA;GAAA,OAEMrC,GACL,iHACA,oEACA,oFACA,4FACA,iGACA2B,MAAMW,KACR;EAAC,EAAA,GACGV,IAAI,GAAA,OAAA,IAAA;EAAAW,OAAAP,OAAAQ,gBAEP1C,MAAI;GAAA,IAAC2C,OAAI;IAAA,OAAEd,MAAMzB;GAAO;GAAA,IAAEwC,WAAQ;IAAA,OAAEf,MAAMgB;GAAQ;GAAAA,WAC/CzC,YAAOsC,gBACN5C,KAAG;IAAA,IAACgD,OAAI;KAAA,OAAE1C,QAAQ;IAAC;IAAAyC,WAChB1B,kBAAM;KAAA,IAAA4B,QAAAC,QAAA;KAAAP,OAAAM,aAEH5B,OAAOM,KAAK;KAAAwB,aAAAF,MAAArB,WADwBP,OAAOO,QAAQ;KAAAuB,aAAAF,MAAArC,QAAvCS,OAAOT,KAAK;KAAA,OAAAqC;IAAA,EAAA,CAAA;GAG5B,CAAA;EAEJ,CAAA,CAAA;EAAAN,OAAAT,MAAAU,gBAGJ/C,iBAAe;GAAA,aAAA;GAAA,eAAA;GAAA,SAAA;EAAA,CAAA,GAAA,IAAA;EAAA,OAAAqC;CAAA,EAAA,CAAA;AAOtB"}
+{"version":3,"file":"native-select.js","names":["ChevronDownIcon","ComponentProps","createEffect","For","onMount","Show","splitProps","useFormFieldControl","cn","NativeSelectProps","options","NativeSelectOption","defaultValue","setSelectedValue","select","HTMLSelectElement","value","multiple","undefined","Array","isArray","selected","Set","map","String","option","has","initializeDefaultSelection","defaultValues","defaultSelected","Readonly","label","disabled","NativeSelect","props","local","rest","field","id","Boolean","_el$","_tmpl$","_el$2","firstChild","_$use","element","_$spread","_$mergeProps","aria-label","aria-labelledby","aria-describedby","aria-invalid","aria-errormessage","class","_$insert","_$createComponent","when","fallback","children","each","_el$3","_tmpl$2","_$effect","_$mergeProps","_$createComponent"],"sources":["../../../../src/components/ui/native-select/native-select.tsx"],"sourcesContent":["import { ChevronDownIcon } from 'lucide-solid'\nimport type { ComponentProps } from 'solid-js'\nimport { createEffect, For, onMount, Show, splitProps } from 'solid-js'\nimport { useFormFieldControl } from '#lib/form-field'\nimport { cn } from '#lib/utils'\n\nexport type NativeSelectProps = ComponentProps<'select'> & {\n  /** Render the choices from data instead of raw option children. */\n  options?: readonly NativeSelectOption[]\n  /** Initialize an uncontrolled selection after its native options mount. */\n  defaultValue?: ComponentProps<'select'>['value']\n}\n\nfunction setSelectedValue(\n  select: HTMLSelectElement,\n  value: ComponentProps<'select'>['value'],\n  multiple: boolean\n) {\n  if (value === undefined) return\n\n  if (multiple && Array.isArray(value)) {\n    const selected = new Set(value.map(String))\n    for (const option of select.options) option.selected = selected.has(option.value)\n    return\n  }\n\n  select.value = String(Array.isArray(value) ? (value[0] ?? '') : value)\n}\n\nfunction initializeDefaultSelection(\n  select: HTMLSelectElement,\n  value: ComponentProps<'select'>['value'],\n  multiple: boolean\n) {\n  if (value === undefined) return\n\n  const defaultValues =\n    multiple && Array.isArray(value)\n      ? new Set(value.map(String))\n      : new Set([String(Array.isArray(value) ? (value[0] ?? '') : value)])\n\n  for (const option of select.options) option.defaultSelected = defaultValues.has(option.value)\n  setSelectedValue(select, value, multiple)\n}\n\n/**\n * NativeSelect.\n *\n * A styled native `<select>` for compact, finite choices. Use `Select` when the\n * list needs a custom popover, typed options, or runtime filtering; this keeps\n * the browser's built-in keyboard, form, option, and label behavior.\n *\n * Translated from shadcn/ui's MIT-licensed NativeSelect wrapper to SolidJS and\n * the Adea token system; see the root NOTICE for source and attribution.\n */\nexport type NativeSelectOption = Readonly<{\n  value: string\n  label: string\n  disabled?: boolean\n}>\n\nexport function NativeSelect(props: NativeSelectProps) {\n  const [local, rest] = splitProps(props, [\n    'class',\n    'children',\n    'defaultValue',\n    'options',\n    'id',\n    'aria-label',\n    'aria-labelledby',\n    'aria-describedby',\n    'aria-invalid',\n    'aria-errormessage',\n  ])\n  const field = useFormFieldControl('control', {\n    id: local.id,\n    'aria-label': local['aria-label'],\n    'aria-labelledby': local['aria-labelledby'],\n    'aria-describedby': local['aria-describedby'],\n    'aria-invalid': local['aria-invalid'],\n    'aria-errormessage': local['aria-errormessage'],\n  })\n  let select: HTMLSelectElement | undefined\n\n  // Set selection after native options exist; setting select.value before its\n  // children are mounted makes browsers fall back to the first option.\n  createEffect(() => {\n    if (!select) return\n    setSelectedValue(select, rest.value, Boolean(rest.multiple))\n  })\n  onMount(() => {\n    if (select && rest.value === undefined) {\n      initializeDefaultSelection(select, local.defaultValue, Boolean(rest.multiple))\n    }\n  })\n\n  return (\n    <span data-slot=\"native-select-wrapper\" class=\"relative inline-flex min-w-0\">\n      <select\n        ref={(element) => {\n          select = element\n        }}\n        data-slot=\"native-select\"\n        id={field?.id ?? local.id}\n        aria-label={local['aria-label']}\n        aria-labelledby={field?.['aria-labelledby'] ?? local['aria-labelledby']}\n        aria-describedby={field?.['aria-describedby'] ?? local['aria-describedby']}\n        aria-invalid={field?.['aria-invalid'] ?? local['aria-invalid']}\n        aria-errormessage={field?.['aria-errormessage'] ?? local['aria-errormessage']}\n        class={cn(\n          'h-control-md min-w-0 appearance-none rounded-md border border-input bg-transparent px-control-md pr-9 text-sm',\n          'transition-[color,box-shadow,border-color] ease-out outline-none',\n          'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n          'aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive-subtle',\n          'disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 dark:bg-input/30',\n          local.class\n        )}\n        {...rest}\n      >\n        <Show when={local.options} fallback={local.children}>\n          {(options) => (\n            <For each={options()}>\n              {(option) => (\n                <option value={option.value} disabled={option.disabled}>\n                  {option.label}\n                </option>\n              )}\n            </For>\n          )}\n        </Show>\n      </select>\n      <ChevronDownIcon\n        data-slot=\"native-select-icon\"\n        aria-hidden=\"true\"\n        class=\"pointer-events-none absolute end-2 top-1/2 size-4 -translate-y-1/2 text-muted-foreground\"\n      />\n    </span>\n  )\n}\n"],"mappings":";;;;;;;;AAaA,SAASa,iBACPC,QACAE,OACAC,UACA;CACA,IAAID,UAAUE,KAAAA,GAAW;CAEzB,IAAID,YAAYE,MAAMC,QAAQJ,KAAK,GAAG;EACpC,MAAMK,WAAW,IAAIC,IAAIN,MAAMO,IAAIC,MAAM,CAAC;EAC1C,KAAK,MAAMC,UAAUX,OAAOJ,SAASe,OAAOJ,WAAWA,SAASK,IAAID,OAAOT,KAAK;EAChF;CACF;CAEAF,OAAOE,QAAQQ,OAAOL,MAAMC,QAAQJ,KAAK,IAAKA,MAAM,MAAM,KAAMA,KAAK;AACvE;AAEA,SAASW,2BACPb,QACAE,OACAC,UACA;CACA,IAAID,UAAUE,KAAAA,GAAW;CAEzB,MAAMU,gBACJX,YAAYE,MAAMC,QAAQJ,KAAK,IAC3B,IAAIM,IAAIN,MAAMO,IAAIC,MAAM,CAAC,oBACzB,IAAIF,IAAI,CAACE,OAAOL,MAAMC,QAAQJ,KAAK,IAAKA,MAAM,MAAM,KAAMA,KAAK,CAAC,CAAC;CAEvE,KAAK,MAAMS,UAAUX,OAAOJ,SAASe,OAAOI,kBAAkBD,cAAcF,IAAID,OAAOT,KAAK;CAC5FH,iBAAiBC,QAAQE,OAAOC,QAAQ;AAC1C;AAkBA,SAAgBgB,aAAaC,OAA0B;CACrD,MAAM,CAACC,OAAOC,QAAQ9B,WAAW4B,OAAO;EACtC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CAAmB,CACpB;CACD,MAAMG,QAAQ9B,oBAAoB,WAAW;EAC3C+B,IAAIH,MAAMG;EACV,cAAcH,MAAM;EACpB,mBAAmBA,MAAM;EACzB,oBAAoBA,MAAM;EAC1B,gBAAgBA,MAAM;EACtB,qBAAqBA,MAAM;CAC7B,CAAC;CACD,IAAIrB;CAIJZ,mBAAmB;EACjB,IAAI,CAACY,QAAQ;EACbD,iBAAiBC,QAAQsB,KAAKpB,OAAOuB,QAAQH,KAAKnB,QAAQ,CAAC;CAC7D,CAAC;CACDb,cAAc;EACZ,IAAIU,UAAUsB,KAAKpB,UAAUE,KAAAA,GAC3BS,2BAA2Bb,QAAQqB,MAAMvB,cAAc2B,QAAQH,KAAKnB,QAAQ,CAAC;CAEjF,CAAC;CAED,cAAA;EAAA,IAAAuB,OAAAC,OAAA,GAAAC,QAAAF,KAAAG;EAAAC,KAGYC,YAAY;GAChB/B,SAAS+B;EACX,GAACH,KAAA;EAAAI,OAAAJ,OAAAK,WAAA;GAAA,IAEDT,KAAE;IAAA,OAAED,OAAOC,MAAMH,MAAMG;GAAE;GAAA,KAAA,gBAAA;IAAA,OACbH,MAAM;GAAa;GAAA,KAAA,qBAAA;IAAA,OACdE,QAAQ,sBAAsBF,MAAM;GAAkB;GAAA,KAAA,sBAAA;IAAA,OACrDE,QAAQ,uBAAuBF,MAAM;GAAmB;GAAA,KAAA,kBAAA;IAAA,OAC5DE,QAAQ,mBAAmBF,MAAM;GAAe;GAAA,KAAA,uBAAA;IAAA,OAC3CE,QAAQ,wBAAwBF,MAAM;GAAoB;GAAA,KAAA,WAAA;IAAA,OACtE3B,GACL,iHACA,oEACA,oFACA,4FACA,iGACA2B,MAAMkB,KACR;GAAC;EAAA,GACGjB,IAAI,GAAA,OAAA,IAAA;EAAAkB,OAAAZ,OAAAa,gBAEPlD,MAAI;GAAA,IAACmD,OAAI;IAAA,OAAErB,MAAMzB;GAAO;GAAA,IAAE+C,WAAQ;IAAA,OAAEtB,MAAMuB;GAAQ;GAAAA,WAC/ChD,YAAO6C,gBACNpD,KAAG;IAAA,IAACwD,OAAI;KAAA,OAAEjD,QAAQ;IAAC;IAAAgD,WAChBjC,kBAAM;KAAA,IAAAmC,QAAAC,QAAA;KAAAP,OAAAM,aAEHnC,OAAOM,KAAK;KAAA+B,aAAAF,MAAA5B,WADwBP,OAAOO,QAAQ;KAAA8B,aAAAF,MAAA5C,QAAvCS,OAAOT,KAAK;KAAA,OAAA4C;IAAA,EAAA,CAAA;GAG5B,CAAA;EAEJ,CAAA,CAAA;EAAAN,OAAAd,MAAAe,gBAGJvD,iBAAe;GAAA,aAAA;GAAA,eAAA;GAAA,SAAA;EAAA,CAAA,GAAA,IAAA;EAAA,OAAAwC;CAAA,EAAA,CAAA;AAOtB"}

package/dist/components/ui/progress/progress.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"progress.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/progress/progress.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,IAAI,eAAe,EAAE,MAAM,wBAAwB,CAAA;AACpE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAI9C;;;;;;;;;;GAUG;AACH,MAAM,MAAM,aAAa,GAAG,cAAc,CAAC,OAAO,eAAe,CAAC,GAAG;IACnE;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,qEAAqE;IACrE,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,kCAmC5C"}
+{"version":3,"file":"progress.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/progress/progress.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,IAAI,eAAe,EAAE,MAAM,wBAAwB,CAAA;AACpE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAI9C;;;;;;;;;;GAUG;AACH,MAAM,MAAM,aAAa,GAAG,cAAc,CAAC,OAAO,eAAe,CAAC,GAAG;IACnE;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,qEAAqE;IACrE,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,kCAuC5C"}