@reforma/components 0.0.0-stage → 0.1.0

package/dist/Input/Input.js

@@ -0,0 +1,323 @@
+import { mergeRefs as K, cn as Y, roundNumber as $, clamp as L } from "@reforma/lib";
+import { useRunner as J } from "@reforma/lib/useRunner";
+import { useRef as P, useEffect as _, useLayoutEffect as Q, useMemo as O, useCallback as D, use as Z } from "react";
+import { useContextProps as ee, InputContext as te, Provider as re, Group as ne, DEFAULT_SLOT as ae, NumberField as se, TextField as oe, Input as U, NumberFieldStateContext as ie } from "react-aria-components";
+import { Show as le } from "../Show/Show.js";
+import { useSlotContextProps as ue, filterSlots as V, SlotContext as ce } from "../Slot/Slot.js";
+import { Text as M } from "../Text/Text.js";
+import R from "./Input.module.css.js";
+import { jsx as m, jsxs as fe } from "react/jsx-runtime";
+const de = {
+  [ae]: {},
+  prefix: {},
+  suffix: {}
+}, me = ["input", "textarea", "select", "button", "a[href]", '[role="button"]', '[role="link"]', '[role="listbox"]', '[role="option"]', "[data-scrub-handle]"].join(","), z = /* @__PURE__ */ new Set(["email", "password", "search", "tel", "text", "url"]), Le = "control", ye = {
+  style: "decimal",
+  useGrouping: !1
+};
+function be({
+  formatOptions: r = ye,
+  inputRef: n,
+  fieldRef: e,
+  htmlSize: t,
+  slot: a,
+  placeholder: s,
+  onSubmit: d,
+  step: l,
+  interactionStep: b,
+  shiftStep: h,
+  roundTo: g,
+  ...c
+}) {
+  const f = Object.hasOwn(c, "value"), y = c.value, o = f && (y == null || Number.isNaN(y)) ? Number.NaN : y;
+  return /* @__PURE__ */ m(se, {
+    formatOptions: r,
+    slot: a,
+    "aria-label": "Enter a number",
+    ...c,
+    step: b ?? l,
+    ...f ? {
+      value: o
+    } : {},
+    children: /* @__PURE__ */ m(he, {
+      inputRef: n,
+      fieldRef: e,
+      htmlSize: t,
+      placeholder: s,
+      onSubmit: d,
+      step: l,
+      interactionStep: b,
+      shiftStep: h,
+      roundTo: g,
+      ...c
+    })
+  });
+}
+function he({
+  step: r = 1,
+  interactionStep: n = r,
+  shiftStep: e = n * 10,
+  minValue: t,
+  maxValue: a,
+  roundTo: s,
+  inputRef: d,
+  fieldRef: l,
+  htmlSize: b,
+  isDisabled: h,
+  isReadOnly: g,
+  placeholder: c,
+  onKeyDown: f,
+  onSubmit: y
+}) {
+  const o = Z(ie);
+  J(l, {
+    value: Number.isFinite(o.numberValue) ? o.numberValue : 0,
+    onChange: o.setNumberValue,
+    min: t,
+    max: a,
+    step: n,
+    shiftStep: e,
+    option: !0,
+    disabled: h || g
+  });
+  const p = D(() => {
+    if (s == null || s <= 0 || !Number.isFinite(s) || !o)
+      return;
+    const i = o.numberValue;
+    if (!Number.isFinite(i))
+      return;
+    const E = $(i, s, t ?? 0), N = L(t ?? -1 / 0, E, a ?? 1 / 0);
+    N !== o.numberValue && o.setNumberValue(N);
+  }, [s, t, a, o]), A = D((i) => {
+    if (i.key === "Enter" && y && (i.preventDefault(), s != null && s > 0 && p(), requestAnimationFrame(() => y())), f?.(i), !i.defaultPrevented) {
+      if (i.key === "Enter" && s != null && s > 0) {
+        p();
+        return;
+      }
+      if (i.shiftKey && !i.altKey && !i.ctrlKey && !i.metaKey && (i.key === "ArrowUp" || i.key === "ArrowDown")) {
+        i.preventDefault();
+        const E = Number.isFinite(o.numberValue) ? o.numberValue : 0, N = i.key === "ArrowUp" ? 1 : -1, F = L(o.minValue ?? -1 / 0, E + e * N, o.maxValue ?? 1 / 0);
+        o.setNumberValue(F);
+      }
+    }
+  }, [f, y, p, s, e, o]);
+  return /* @__PURE__ */ m(U, {
+    className: R.input,
+    ref: d,
+    size: b,
+    placeholder: c,
+    onBlur: p,
+    onKeyDown: A
+  });
+}
+function pe(r) {
+  const n = {};
+  for (const [e, t] of Object.entries(r))
+    e.startsWith("data-") && typeof t == "string" && (n[e] = t);
+  return n;
+}
+function ge({
+  inputRef: r,
+  onSubmit: n,
+  onKeyDown: e,
+  onKeyUp: t,
+  inputMode: a,
+  onPaste: s,
+  spellCheck: d,
+  autoComplete: l,
+  htmlSize: b,
+  ...h
+}) {
+  const g = D((f) => {
+    f.key === "Enter" && n && (f.preventDefault(), requestAnimationFrame(() => n())), e?.(f);
+  }, [n, e]), c = h["aria-label"] ?? h.placeholder;
+  return /* @__PURE__ */ m(oe, {
+    ...h,
+    "aria-label": c,
+    children: /* @__PURE__ */ m(U, {
+      ref: r,
+      className: R.input,
+      size: b,
+      inputMode: a,
+      autoComplete: l,
+      onKeyDown: g,
+      onKeyUp: t,
+      onPaste: s,
+      spellCheck: d,
+      ...pe(h)
+    })
+  });
+}
+function Ne(r) {
+  const n = ue(r), [e, t] = ee(n, n.inputRef, te), a = P(null), s = K(a, t), d = P(null), {
+    ref: l,
+    slot: b,
+    variant: h = "filled",
+    size: g = "md",
+    htmlSize: c = 1,
+    hug: f,
+    prefix: y,
+    suffix: o,
+    children: p,
+    className: A,
+    autoFocus: i,
+    onPress: E,
+    onSubmit: N,
+    scrubHandle: F,
+    isActive: j,
+    isDisabled: x,
+    isInvalid: v,
+    isReadOnly: C,
+    ...I
+  } = e, G = typeof b == "string" || typeof b == "number" ? b : void 0, B = K(d, l);
+  _(() => {
+    const u = a.current;
+    if (u?.closest('[role="gridcell"]'))
+      return we(u);
+  }, []), _(() => {
+    if (!i)
+      return;
+    const u = setTimeout(() => {
+      a.current?.focus();
+    }, 50);
+    return () => clearTimeout(u);
+  }, [i]), Q(() => {
+    if (!f)
+      return;
+    const u = a.current, w = d.current;
+    if (!u || !w)
+      return;
+    const T = () => {
+      w.style.setProperty("--reforma-input-hug-ch", String(Math.max(c, u.value.length, 1)));
+    };
+    return T(), u.addEventListener("input", T), () => {
+      u.removeEventListener("input", T), w.style.removeProperty("--reforma-input-hug-ch");
+    };
+  }, [f, c, I.value, I.defaultValue]);
+  const H = O(() => V(p, "prefix", y ? /* @__PURE__ */ m(M, {
+    slot: "prefix",
+    className: R.textPrefix,
+    children: y
+  }) : void 0), [p, y]), X = O(() => V(p, "suffix", o ? /* @__PURE__ */ m(M, {
+    slot: "suffix",
+    className: R.textSuffix,
+    children: o
+  }) : void 0), [p, o]), q = (u) => {
+    const w = a.current;
+    u.button !== 0 || !w || x || xe(u.target, u.currentTarget) || (u.preventDefault(), w.focus(), Ie(w, u.clientX));
+  }, W = () => {
+    a.current?.focus(), x || E?.();
+  };
+  return /* @__PURE__ */ m(re, {
+    values: [[ce, {
+      slots: de
+    }]],
+    children: /* @__PURE__ */ fe(ne, {
+      ref: B,
+      slot: G,
+      className: Y(R.field, A),
+      "data-variant": h,
+      "data-size": g,
+      "data-active": j || void 0,
+      "data-disabled": x || void 0,
+      "data-invalid": v || void 0,
+      "data-readonly": C || void 0,
+      "data-hug": f || void 0,
+      "data-pressable": E && !x || void 0,
+      "data-modal-drag-exclude": !0,
+      isDisabled: x,
+      isInvalid: v,
+      isReadOnly: C,
+      onPointerDown: q,
+      onClick: W,
+      children: [/* @__PURE__ */ m(le, {
+        when: F,
+        children: /* @__PURE__ */ m("div", {
+          className: R.scrubHandle,
+          "data-scrub-handle": !0
+        })
+      }), H, I.type === "number" ? /* @__PURE__ */ m(be, {
+        inputRef: s,
+        fieldRef: d,
+        htmlSize: c,
+        className: "contents",
+        isDisabled: x,
+        isInvalid: v,
+        isReadOnly: C,
+        onSubmit: N,
+        ...I
+      }) : /* @__PURE__ */ m(ge, {
+        inputRef: s,
+        className: "contents",
+        onSubmit: N,
+        htmlSize: c,
+        isDisabled: x,
+        isInvalid: v,
+        isReadOnly: C,
+        ...I
+      }), X]
+    })
+  });
+}
+function xe(r, n) {
+  return r instanceof Element && !!r.closest(me) && n.contains(r);
+}
+const k = /* @__PURE__ */ new Set();
+let S;
+function we(r) {
+  if (k.add(r), !S) {
+    const n = (e) => {
+      const t = e.target;
+      !(t instanceof HTMLInputElement) || !k.has(t) || !Ee(t, e) || (e.preventDefault(), e.stopPropagation(), Re(t, e));
+    };
+    document.addEventListener("keydown", n, !0), S = () => {
+      document.removeEventListener("keydown", n, !0), S = void 0;
+    };
+  }
+  return () => {
+    k.delete(r), k.size === 0 && S?.();
+  };
+}
+function Ee(r, n) {
+  if (n.key !== "ArrowLeft" && n.key !== "ArrowRight" || n.isComposing || r.disabled || r.readOnly || !z.has(r.type))
+    return !1;
+  const e = r.selectionStart, t = r.selectionEnd;
+  return e == null || t == null ? !1 : n.altKey || n.ctrlKey || n.metaKey || n.shiftKey || e !== t ? !0 : n.key === "ArrowLeft" ? e > 0 : t < r.value.length;
+}
+function Re(r, n) {
+  const e = r.selectionStart ?? 0, t = r.selectionEnd ?? e, a = n.key === "ArrowRight" ? 1 : -1, s = r.value.length;
+  try {
+    if (n.altKey || n.ctrlKey || n.metaKey) {
+      if (n.shiftKey)
+        r.setSelectionRange(a < 0 ? 0 : e, a < 0 ? t : s, a < 0 ? "backward" : "forward");
+      else {
+        const l = a < 0 ? 0 : s;
+        r.setSelectionRange(l, l);
+      }
+      return;
+    }
+    if (n.shiftKey) {
+      const l = r.selectionDirection === "backward";
+      a > 0 ? r.setSelectionRange(l && e !== t ? e + 1 : e, l && e !== t ? t : Math.min(s, t + 1), l && e + 1 < t ? "backward" : "forward") : r.setSelectionRange(l || e === t ? Math.max(0, e - 1) : e, l || e === t ? t : t - 1, !l && e < t - 1 ? "forward" : "backward");
+      return;
+    }
+    const d = e === t ? e + a : a > 0 ? t : e;
+    r.setSelectionRange(d, d);
+  } catch {
+  }
+}
+function Ie(r, n) {
+  if (!z.has(r.type))
+    return;
+  const e = r.getBoundingClientRect(), t = n <= e.left ? 0 : r.value.length;
+  try {
+    r.setSelectionRange(t, t);
+  } catch {
+  }
+}
+Ne.displayName = "Input";
+export {
+  Le as INPUT_CONTROL_AFFIX,
+  Ne as Input
+};
+//# sourceMappingURL=Input.js.map

package/dist/Input/Input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.js","sources":["../../src/Input/Input.tsx"],"sourcesContent":["import { clamp, cn, mergeRefs, roundNumber } from '@reforma/lib';\nimport { useRunner } from '@reforma/lib/useRunner';\nimport {\n    use,\n    useCallback,\n    useEffect,\n    useLayoutEffect,\n    useMemo,\n    useRef,\n    type MouseEventHandler,\n    type PointerEventHandler,\n    type ReactNode,\n    type Ref,\n    type RefObject,\n} from 'react';\nimport {\n    Input as AriaInput,\n    NumberField as AriaNumberField,\n    TextField as AriaTextField,\n    Group,\n    InputContext,\n    NumberFieldStateContext,\n    Provider,\n    useContextProps,\n    type NumberFieldProps as AriaNumberFieldProps,\n    type TextFieldProps as AriaTextFieldProps,\n} from 'react-aria-components';\n\nimport { Show } from '../Show';\nimport { DEFAULT_SLOT, filterSlots, SlotContext, useSlotContextProps } from '../Slot';\nimport { Text } from '../Text';\nimport styles from './Input.module.css';\n\nconst INPUT_SLOTS = { [DEFAULT_SLOT]: {}, prefix: {}, suffix: {} };\nconst INTERACTIVE_FIELD_TARGET_SELECTOR = [\n    'input',\n    'textarea',\n    'select',\n    'button',\n    'a[href]',\n    '[role=\"button\"]',\n    '[role=\"link\"]',\n    '[role=\"listbox\"]',\n    '[role=\"option\"]',\n    '[data-scrub-handle]',\n].join(',');\nconst TEXT_SELECTION_INPUT_TYPES = new Set(['email', 'password', 'search', 'tel', 'text', 'url']);\n\nexport type InputVariant = 'filled' | 'bordered' | 'transparent' | 'inline';\nexport type InputSize = 'xs' | 'sm' | 'md' | 'lg';\n\n/**\n * Opt-in flush control affix for slotted prefix/suffix (buttons, icons).\n *\n * @example\n * <Input>\n *   <Button slot=\"suffix\" data-input-affix={INPUT_CONTROL_AFFIX}>Apply</Button>\n * </Input>\n */\nexport const INPUT_CONTROL_AFFIX = 'control';\n\ntype NumberInputProps = Omit<AriaNumberFieldProps, 'type' | 'spellCheck'> & {\n    type: 'number';\n    inputRef?: Ref<HTMLInputElement>;\n    interactionStep?: number;\n    shiftStep?: number;\n    roundTo?: number;\n    /** RAC NumberField omits this — wire onto the inner input. */\n    placeholder?: string;\n};\n\nexport type TextInputProps = Omit<AriaTextFieldProps, 'type' | 'size' | 'spellCheck'> & {\n    placeholder?: string;\n    inputRef?: Ref<HTMLInputElement | null>;\n    type: 'text' | 'email' | 'password' | 'search' | 'tel' | 'url';\n    inputMode?: React.HTMLAttributes<HTMLInputElement>['inputMode'];\n    onChange?: (value: string) => void;\n    onPaste?: React.ClipboardEventHandler<HTMLInputElement>;\n};\n\ntype ReformaInputProps = {\n    ref?: Ref<HTMLDivElement | null>;\n    variant?: InputVariant;\n    size?: InputSize;\n    htmlSize?: number;\n    /** Size the field to the typed value instead of filling the parent. Works with `type=\"number\"`. */\n    hug?: boolean;\n    prefix?: string; // NOTE: use slots if you need non-string content\n    suffix?: string; // NOTE: use slots if you need non-string content\n    children?: ReactNode;\n    className?: string;\n    isDisabled?: boolean;\n    isInvalid?: boolean;\n    isReadOnly?: boolean;\n    isActive?: boolean;\n    autoFocus?: boolean;\n    onPress?: () => void;\n    onSubmit?: () => void;\n    scrubHandle?: boolean;\n    spellCheck?: boolean;\n};\n\nexport type InputProps = (ReformaInputProps & NumberInputProps) | (ReformaInputProps & TextInputProps);\n\nconst DEFAULT_NUMBER_FORMAT: Intl.NumberFormatOptions = {\n    style: 'decimal',\n    useGrouping: false,\n};\n\nfunction NumberInput({\n    formatOptions = DEFAULT_NUMBER_FORMAT,\n    inputRef,\n    fieldRef,\n    htmlSize,\n    slot,\n    placeholder,\n    onSubmit,\n    step,\n    interactionStep,\n    shiftStep,\n    roundTo,\n    ...props\n}: NumberInputProps & {\n    fieldRef: RefObject<HTMLDivElement | null>;\n    htmlSize: number;\n    onSubmit?: () => void;\n}) {\n    // Controlled empty must stay controlled — Aria treats a missing/`undefined`\n    // `value` as uncontrolled; NaN is NumberField's empty sentinel.\n    const isControlled = Object.hasOwn(props, 'value');\n    const rawValue = props.value;\n    const value = (isControlled && (rawValue == null || Number.isNaN(rawValue)))\n        ? Number.NaN\n        : rawValue;\n\n    return (\n        <AriaNumberField\n            formatOptions={ formatOptions }\n            slot={ slot }\n            aria-label=\"Enter a number\"\n            { ...props }\n            step={ interactionStep ?? step }\n            { ...(isControlled ? { value } : {}) }\n        >\n            <NumberInputInner\n                inputRef={ inputRef }\n                fieldRef={ fieldRef }\n                htmlSize={ htmlSize }\n                placeholder={ placeholder }\n                onSubmit={ onSubmit }\n                step={ step }\n                interactionStep={ interactionStep }\n                shiftStep={ shiftStep }\n                roundTo={ roundTo }\n                { ...props }\n            />\n        </AriaNumberField>\n    );\n}\n\nfunction NumberInputInner({\n    step = 1,\n    interactionStep = step,\n    shiftStep = interactionStep * 10,\n    minValue,\n    maxValue,\n    roundTo,\n    inputRef,\n    fieldRef,\n    htmlSize,\n    isDisabled,\n    isReadOnly,\n    placeholder,\n    onKeyDown,\n    onSubmit,\n}: NumberInputProps & {\n    fieldRef: RefObject<HTMLDivElement | null>;\n    htmlSize: number;\n    onSubmit?: () => void;\n}) {\n    const state = use(NumberFieldStateContext)!;\n\n    useRunner(fieldRef, {\n        value: Number.isFinite(state.numberValue) ? state.numberValue : 0,\n        onChange: state.setNumberValue,\n        min: minValue,\n        max: maxValue,\n        step: interactionStep,\n        shiftStep,\n        option: true,\n        disabled: isDisabled || isReadOnly,\n    });\n\n    const snapToStep = useCallback(\n        () => {\n            if (roundTo == null || roundTo <= 0 || !Number.isFinite(roundTo) || !state) {\n                return;\n            }\n\n            const current = state.numberValue;\n\n            if (!Number.isFinite(current)) {\n                return;\n            }\n\n            const rounded = roundNumber(current, roundTo, minValue ?? 0);\n            const finalValue = clamp(minValue ?? -Infinity, rounded, maxValue ?? Infinity);\n\n            if (finalValue !== state.numberValue) {\n                state.setNumberValue(finalValue);\n            }\n        },\n        [roundTo, minValue, maxValue, state]\n    );\n\n    const handleKeyDown = useCallback(\n        (e: React.KeyboardEvent<HTMLInputElement>) => {\n            // Mirror text Input onSubmit — snap first, then defer so RAC onChange /\n            // keyup still land on this field before a parent unmounts it.\n            if (e.key === 'Enter' && onSubmit) {\n                e.preventDefault();\n\n                if (roundTo != null && roundTo > 0) {\n                    snapToStep();\n                }\n\n                requestAnimationFrame(() => onSubmit());\n            }\n\n            // RAC NumberField onKeyDown is BaseEvent; callers pass DOM KeyboardEvent handlers.\n            onKeyDown?.(e as Parameters<NonNullable<typeof onKeyDown>>[0]);\n\n            if (e.defaultPrevented) {\n                return;\n            }\n\n            if (e.key === 'Enter' && roundTo != null && roundTo > 0) {\n                snapToStep();\n\n                return;\n            }\n\n            if (e.shiftKey\n                && !e.altKey\n                && !e.ctrlKey\n                && !e.metaKey\n                && (e.key === 'ArrowUp' || e.key === 'ArrowDown')) {\n                e.preventDefault();\n                const current = Number.isFinite(state.numberValue) ? state.numberValue : 0;\n                const direction = e.key === 'ArrowUp' ? 1 : -1;\n                const next = clamp(\n                    state.minValue ?? -Infinity,\n                    current + shiftStep * direction,\n                    state.maxValue ?? Infinity\n                );\n\n                state.setNumberValue(next);\n            }\n        },\n        [onKeyDown, onSubmit, snapToStep, roundTo, shiftStep, state]\n    );\n\n    // NOTE: Any other props AriaInput receives from AriaNumberField (context)\n    return (\n        <AriaInput\n            className={ styles.input }\n            ref={ inputRef }\n            size={ htmlSize }\n            placeholder={ placeholder }\n            onBlur={ snapToStep }\n            onKeyDown={ handleKeyDown }\n        />\n    );\n}\n\n/** Data attributes on TextField land on the wrapper. Password managers read the input. */\nfunction inputDataAttributes(props: object): Record<string, string> {\n    const attributes: Record<string, string> = {};\n\n    for (const [key, value] of Object.entries(props)) {\n        if (key.startsWith('data-') && typeof value === 'string') {\n            attributes[key] = value;\n        }\n    }\n\n    return attributes;\n}\n\nfunction TextInput({\n    inputRef,\n    onSubmit,\n    onKeyDown,\n    onKeyUp,\n    inputMode,\n    onPaste,\n    spellCheck,\n    autoComplete,\n    htmlSize,\n    ...props\n}: TextInputProps & {\n    onSubmit?: () => void;\n    onKeyDown?: React.KeyboardEventHandler<HTMLInputElement>;\n    onKeyUp?: React.KeyboardEventHandler<HTMLInputElement>;\n    htmlSize: number;\n    spellCheck?: boolean;\n}) {\n    const handleKeyDown = useCallback((e: React.KeyboardEvent<HTMLInputElement>) => {\n        if (e.key === 'Enter' && onSubmit) {\n            e.preventDefault();\n\n            // Defer to let keyup fire inside the current DOM before any parent unmounts\n            requestAnimationFrame(() => onSubmit());\n        }\n\n        onKeyDown?.(e);\n    }, [onSubmit, onKeyDown]);\n\n    const ariaLabel = props['aria-label'] ?? props.placeholder;\n\n    return (\n        <AriaTextField { ...props } aria-label={ ariaLabel }>\n            <AriaInput\n                ref={ inputRef }\n                className={ styles.input }\n                size={ htmlSize }\n                inputMode={ inputMode }\n                autoComplete={ autoComplete }\n                onKeyDown={ handleKeyDown }\n                onKeyUp={ onKeyUp }\n                onPaste={ onPaste }\n                spellCheck={ spellCheck }\n                { ...inputDataAttributes(props) }\n            />\n        </AriaTextField>\n    );\n}\n\nexport function Input(props: InputProps) {\n    // SlotContext / InputContext first; local props win; defaults after merge.\n    const slotMerged = useSlotContextProps(props);\n    const [mergedProps, mergedInputRef] = useContextProps(slotMerged, slotMerged.inputRef, InputContext);\n\n    // <input> ref\n    const _inputRef = useRef<HTMLInputElement>(null);\n    // eslint-disable-next-line react-hooks/refs -- mergeRefs composes; it does not read `.current`\n    const inputRef = mergeRefs(_inputRef, mergedInputRef);\n\n    // <Group> ref — exposed so useRunner can attach pointer listeners to the whole field\n    const _fieldRef = useRef<HTMLDivElement>(null);\n\n    const {\n        ref,\n        slot,\n        variant = 'filled',\n        size = 'md',\n        htmlSize = 1,\n        hug,\n        prefix,\n        suffix,\n        children,\n        className,\n        autoFocus,\n        onPress,\n        onSubmit,\n        scrubHandle,\n        isActive,\n        isDisabled,\n        isInvalid,\n        isReadOnly,\n        ...inputProps\n    } = mergedProps as InputProps & { slot?: unknown };\n    const domSlot = (typeof slot === 'string' || typeof slot === 'number') ? slot : undefined;\n\n    const fieldRef = mergeRefs(_fieldRef, ref as Ref<HTMLDivElement>);\n\n    useEffect(() => {\n        const input = _inputRef.current;\n\n        if (!input?.closest('[role=\"gridcell\"]')) {\n            return;\n        }\n\n        return bindGridCaret(input);\n    }, []);\n\n    useEffect(() => {\n        if (!autoFocus) {\n            return;\n        }\n\n        const timer = setTimeout(() => {\n            _inputRef.current?.focus();\n        }, 50);\n\n        return () => clearTimeout(timer);\n    }, [autoFocus]);\n\n    useLayoutEffect(() => {\n        if (!hug) {\n            return;\n        }\n\n        const input = _inputRef.current;\n        const field = _fieldRef.current;\n\n        if (!input || !field) {\n            return;\n        }\n\n        const sync = () => {\n            field.style.setProperty(\n                '--reforma-input-hug-ch',\n                String(Math.max(htmlSize, input.value.length, 1))\n            );\n        };\n\n        sync();\n        input.addEventListener('input', sync);\n\n        return () => {\n            input.removeEventListener('input', sync);\n            field.style.removeProperty('--reforma-input-hug-ch');\n        };\n    }, [hug, htmlSize, inputProps.value, inputProps.defaultValue]);\n\n    const prefixSlot = useMemo(\n        (): ReactNode => filterSlots(\n            children,\n            'prefix',\n            prefix ? <Text slot=\"prefix\" className={ styles.textPrefix }>{prefix}</Text> : undefined\n        ),\n        [children, prefix]\n    );\n    const suffixSlot = useMemo(\n        (): ReactNode => filterSlots(\n            children,\n            'suffix',\n            suffix ? <Text slot=\"suffix\" className={ styles.textSuffix }>{suffix}</Text> : undefined\n        ),\n        [children, suffix]\n    );\n\n    const handleContainerPointerDown: PointerEventHandler<HTMLDivElement> = (event) => {\n        const input = _inputRef.current;\n\n        if (event.button !== 0 || !input || isDisabled || shouldKeepTargetFocus(event.target, event.currentTarget)) {\n            return;\n        }\n\n        event.preventDefault();\n        input.focus();\n        placeCaretAtFieldEdge(input, event.clientX);\n    };\n\n    const handleContainerClick: MouseEventHandler<HTMLDivElement> = () => {\n        _inputRef.current?.focus();\n\n        if (!isDisabled) {\n            onPress?.();\n        }\n    };\n\n    return (\n        <Provider values={ [[SlotContext, { slots: INPUT_SLOTS }]] }>\n            <Group\n                ref={ fieldRef }\n                slot={ domSlot }\n                className={ cn(styles.field, className) }\n                data-variant={ variant }\n                data-size={ size }\n                data-active={ isActive || undefined }\n                data-disabled={ isDisabled || undefined }\n                data-invalid={ isInvalid || undefined }\n                data-readonly={ isReadOnly || undefined }\n                data-hug={ hug || undefined }\n                data-pressable={ (onPress && !isDisabled) || undefined }\n                data-modal-drag-exclude\n                isDisabled={ isDisabled }\n                isInvalid={ isInvalid }\n                isReadOnly={ isReadOnly }\n                onPointerDown={ handleContainerPointerDown }\n                onClick={ handleContainerClick }\n            >\n                <Show when={ scrubHandle }>\n                    <div className={ styles.scrubHandle } data-scrub-handle />\n                </Show>\n\n                {prefixSlot}\n\n                {inputProps.type === 'number'\n                    ? (\n                        <NumberInput\n                            inputRef={ inputRef }\n                            fieldRef={ _fieldRef }\n                            htmlSize={ htmlSize }\n                            className=\"contents\"\n                            isDisabled={ isDisabled }\n                            isInvalid={ isInvalid }\n                            isReadOnly={ isReadOnly }\n                            onSubmit={ onSubmit }\n                            { ...inputProps }\n                        />\n                    )\n                    : (\n                        <TextInput\n                            inputRef={ inputRef }\n                            className=\"contents\"\n                            onSubmit={ onSubmit }\n                            htmlSize={ htmlSize }\n                            isDisabled={ isDisabled }\n                            isInvalid={ isInvalid }\n                            isReadOnly={ isReadOnly }\n                            { ...inputProps }\n                        />\n                    )}\n\n                {suffixSlot}\n            </Group>\n        </Provider>\n    );\n}\n\nfunction shouldKeepTargetFocus(target: EventTarget, field: HTMLElement): boolean {\n    return target instanceof Element\n      && Boolean(target.closest(INTERACTIVE_FIELD_TARGET_SELECTOR))\n      && field.contains(target);\n}\n\nconst gridCaretInputs = new Set<HTMLInputElement>();\nlet unbindGridCaret: (() => void) | undefined;\n\nfunction bindGridCaret(input: HTMLInputElement): () => void {\n    gridCaretInputs.add(input);\n\n    if (!unbindGridCaret) {\n        const onKeyDown = (event: KeyboardEvent) => {\n            const target = event.target;\n\n            if (!(target instanceof HTMLInputElement) || !gridCaretInputs.has(target) || !arrowMovesCaret(target, event)) {\n                return;\n            }\n\n            event.preventDefault();\n            event.stopPropagation();\n            moveCaret(target, event);\n        };\n\n        document.addEventListener('keydown', onKeyDown, true);\n        unbindGridCaret = () => {\n            document.removeEventListener('keydown', onKeyDown, true);\n            unbindGridCaret = undefined;\n        };\n    }\n\n    return () => {\n        gridCaretInputs.delete(input);\n\n        if (gridCaretInputs.size === 0) {\n            unbindGridCaret?.();\n        }\n    };\n}\n\nfunction arrowMovesCaret(input: HTMLInputElement, event: KeyboardEvent): boolean {\n    if (event.key !== 'ArrowLeft' && event.key !== 'ArrowRight') {\n        return false;\n    }\n\n    if (event.isComposing || input.disabled || input.readOnly || !TEXT_SELECTION_INPUT_TYPES.has(input.type)) {\n        return false;\n    }\n\n    const start = input.selectionStart;\n    const end = input.selectionEnd;\n\n    if (start == null || end == null) {\n        return false;\n    }\n\n    if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey || start !== end) {\n        return true;\n    }\n\n    return event.key === 'ArrowLeft' ? start > 0 : end < input.value.length;\n}\n\nfunction moveCaret(input: HTMLInputElement, event: KeyboardEvent) {\n    const start = input.selectionStart ?? 0;\n    const end = input.selectionEnd ?? start;\n    const direction = event.key === 'ArrowRight' ? 1 : -1;\n    const length = input.value.length;\n\n    try {\n        if (event.altKey || event.ctrlKey || event.metaKey) {\n            if (event.shiftKey) {\n                input.setSelectionRange(\n                    direction < 0 ? 0 : start,\n                    direction < 0 ? end : length,\n                    direction < 0 ? 'backward' : 'forward'\n                );\n            }\n            else {\n                const edge = direction < 0 ? 0 : length;\n\n                input.setSelectionRange(edge, edge);\n            }\n\n            return;\n        }\n\n        if (event.shiftKey) {\n            const backward = input.selectionDirection === 'backward';\n\n            if (direction > 0) {\n                input.setSelectionRange(\n                    backward && start !== end ? start + 1 : start,\n                    backward && start !== end ? end : Math.min(length, end + 1),\n                    backward && start + 1 < end ? 'backward' : 'forward'\n                );\n            }\n            else {\n                input.setSelectionRange(\n                    backward || start === end ? Math.max(0, start - 1) : start,\n                    backward || start === end ? end : end - 1,\n                    !backward && start < end - 1 ? 'forward' : 'backward'\n                );\n            }\n\n            return;\n        }\n\n        const next = start === end ? start + direction : direction > 0 ? end : start;\n\n        input.setSelectionRange(next, next);\n    }\n    catch {\n        // Some browsers reject selection APIs for non-text controls despite input.type checks.\n    }\n}\n\nfunction placeCaretAtFieldEdge(input: HTMLInputElement, clientX: number) {\n    if (!TEXT_SELECTION_INPUT_TYPES.has(input.type)) {\n        return;\n    }\n\n    const rect = input.getBoundingClientRect();\n    const offset = clientX <= rect.left ? 0 : input.value.length;\n\n    try {\n        input.setSelectionRange(offset, offset);\n    }\n    catch {\n        // Some browsers reject selection APIs for non-text controls despite input.type checks.\n    }\n}\n\nInput.displayName = 'Input';\n"],"names":["INPUT_SLOTS","DEFAULT_SLOT","INTERACTIVE_FIELD_TARGET_SELECTOR","TEXT_SELECTION_INPUT_TYPES","INPUT_CONTROL_AFFIX","DEFAULT_NUMBER_FORMAT","NumberInput","formatOptions","inputRef","fieldRef","htmlSize","slot","placeholder","onSubmit","step","interactionStep","shiftStep","roundTo","props","isControlled","rawValue","value","AriaNumberField","NumberInputInner","minValue","maxValue","isDisabled","isReadOnly","onKeyDown","state","use","NumberFieldStateContext","useRunner","snapToStep","useCallback","current","rounded","roundNumber","finalValue","clamp","handleKeyDown","e","direction","next","AriaInput","styles","inputDataAttributes","attributes","key","TextInput","onKeyUp","inputMode","onPaste","spellCheck","autoComplete","ariaLabel","AriaTextField","Input","slotMerged","useSlotContextProps","mergedProps","mergedInputRef","useContextProps","InputContext","_inputRef","useRef","mergeRefs","_fieldRef","ref","variant","size","hug","prefix","suffix","children","className","autoFocus","onPress","scrubHandle","isActive","isInvalid","inputProps","domSlot","useEffect","input","bindGridCaret","timer","useLayoutEffect","field","sync","prefixSlot","useMemo","filterSlots","Text","suffixSlot","handleContainerPointerDown","event","shouldKeepTargetFocus","placeCaretAtFieldEdge","handleContainerClick","Provider","SlotContext","Group","cn","_jsx","Show","target","gridCaretInputs","unbindGridCaret","arrowMovesCaret","moveCaret","start","end","length","edge","backward","clientX","rect","offset"],"mappings":"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"}

package/dist/Input/Input.module.css

@@ -0,0 +1 @@
+@layer components{.Input_field_qrtqYW{--reforma-input-gap: var(--spacing-sm);--reforma-input-height: var(--spacing-36);--reforma-input-radius: var(--radius-lg);--reforma-input-padding-inline: var(--spacing-10);--reforma-input-padding-block: var(--spacing-6);--reforma-input-bg: var(--color-secondary);--reforma-input-border-width: 1px;--reforma-input-border: transparent;--reforma-input-border-hover: var(--color-secondary-muted-border);--reforma-input-border-focus: var(--color-primary);--reforma-input-color: var(--color-secondary-content);display:inline-flex;position:relative;align-items:center;gap:var(--reforma-input-gap);box-sizing:border-box;border-radius:calc(var(--reforma-input-radius) * var(--squircle-radius-factor));padding-inline:var(--reforma-input-padding-inline);width:100%;min-width:var(--reforma-input-height);height:var(--reforma-input-height);overflow:hidden;corner-shape:superellipse(var(--squircle-value));transition-duration:var(--transition-duration-fast);transition-property:background-color,border-color;transition-timing-function:var(--ease-in-out);cursor:text;outline:none;border:var(--reforma-input-border-width) solid var(--reforma-input-border);background-color:var(--reforma-input-bg);color:var(--reforma-input-color)}.Input_field_qrtqYW[data-size=xs]{--reforma-input-height: var(--spacing-24);--reforma-input-radius: var(--radius-sm);--reforma-input-padding-inline: var(--spacing-8);--reforma-input-padding-block: var(--spacing-4);font-weight:400;font-size:var(--text-sm);line-height:var(--leading-sm);font-family:Onest,sans-serif;letter-spacing:0}.Input_field_qrtqYW[data-size=sm]{--reforma-input-height: var(--spacing-30);--reforma-input-radius: var(--radius-md);--reforma-input-padding-inline: var(--spacing-8);--reforma-input-padding-block: var(--spacing-4);font-weight:400;font-size:var(--text-sm);line-height:var(--leading-sm);font-family:Onest,sans-serif;letter-spacing:0}.Input_field_qrtqYW[data-size=md]{--reforma-input-height: var(--spacing-36);--reforma-input-radius: var(--radius-lg);--reforma-input-padding-inline: var(--spacing-10);--reforma-input-padding-block: var(--spacing-6);font-weight:400;font-size:var(--text-md);line-height:var(--leading-md);font-family:Onest,sans-serif;letter-spacing:0}.Input_field_qrtqYW[data-size=lg]{--reforma-input-height: var(--spacing-56);--reforma-input-radius: var(--radius-xl);--reforma-input-padding-inline: var(--spacing-16);--reforma-input-padding-block: var(--spacing-12);font-weight:400;font-size:var(--text-xl);line-height:var(--leading-xl);font-family:Onest,sans-serif;letter-spacing:0}.Input_field_qrtqYW[data-variant=filled]{--reforma-input-bg: var(--color-secondary);--reforma-input-border: transparent;--reforma-input-color: var(--color-secondary-content);--reforma-input-border-hover: var(--color-secondary-muted-border);--reforma-input-border-focus: var(--color-primary)}.Input_field_qrtqYW[data-variant=bordered]{--reforma-input-bg: transparent;--reforma-input-border: var(--color-secondary-border);--reforma-input-color: var(--color-secondary-content);--reforma-input-border-hover: var(--color-secondary-border-hover);--reforma-input-border-focus: var(--color-primary)}.Input_field_qrtqYW[data-variant=transparent]{--reforma-input-bg: transparent;--reforma-input-border: transparent;--reforma-input-color: var(--color-text);--reforma-input-border-hover: var(--color-secondary-muted);--reforma-input-border-focus: var(--color-secondary-muted)}.Input_field_qrtqYW[data-variant=inline]{--reforma-input-bg: transparent;--reforma-input-border: transparent;--reforma-input-color: var(--color-text);--reforma-input-border-hover: transparent;--reforma-input-border-focus: transparent;--reforma-input-height: auto;--reforma-input-padding-inline: 0;--reforma-input-padding-block: 0;--reforma-input-radius: 0;font:inherit}.Input_field_qrtqYW:hover:not(:focus-within):not([data-active]):not([data-disabled]){border-color:var(--reforma-input-border-hover)}.Input_field_qrtqYW:focus-within,.Input_field_qrtqYW[data-active]{border-color:var(--reforma-input-border-focus)}.Input_field_qrtqYW[data-disabled]{opacity:var(--opacity-disabled);cursor:not-allowed;pointer-events:none}.Input_field_qrtqYW[data-pressable]{cursor:pointer}.Input_field_qrtqYW[data-invalid]{border-color:var(--color-danger-border)}.Input_field_qrtqYW[data-invalid]:hover:not(:focus-within):not([data-active]):not([data-disabled]){border-color:var(--color-danger-border-hover)}.Input_field_qrtqYW[data-invalid]:focus-within{border-color:var(--color-danger)}.Input_input_222klx{-webkit-appearance:none;-moz-appearance:none;flex:1;align-self:stretch;appearance:none;cursor:inherit;box-sizing:border-box;margin:0;outline:none;border:none;background:transparent;padding-inline:0;padding-block:var(--reforma-input-padding-block);width:100%;min-width:0;color:inherit;font:inherit}.Input_field_qrtqYW:not(:has([slot=prefix])) .Input_input_222klx{margin-inline-start:calc(var(--reforma-input-padding-inline) * -1);padding-inline-start:var(--reforma-input-padding-inline)}.Input_field_qrtqYW:not(:has([slot=suffix])) .Input_input_222klx{margin-inline-end:calc(var(--reforma-input-padding-inline) * -1);padding-inline-end:var(--reforma-input-padding-inline)}.Input_field_qrtqYW:has(.Input_textSuffix_IYbqRJ) .Input_input_222klx{margin-inline-end:calc(var(--reforma-input-gap) * -1);padding-inline-end:var(--reforma-input-gap)}.Input_input_222klx::-moz-placeholder{opacity:var(--opacity-placeholder);color:currentColor}.Input_input_222klx::placeholder{opacity:var(--opacity-placeholder);color:currentColor}.Input_input_222klx[type=number]{-moz-appearance:textfield}.Input_input_222klx[type=number]::-webkit-inner-spin-button,.Input_input_222klx[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.Input_field_qrtqYW[data-hug]{flex:none;width:auto;min-width:unset;--reforma-input-hug-ch: 1}.Input_field_qrtqYW[data-hug] .Input_input_222klx{flex:none;box-sizing:content-box;width:calc(var(--reforma-input-hug-ch) * 1ch);min-width:1ch}.Input_field_qrtqYW[data-hug]:not(:has([slot=prefix])) .Input_input_222klx{margin-inline-start:0;padding-inline-start:0}.Input_field_qrtqYW[data-hug]:not(:has([slot=suffix])) .Input_input_222klx{margin-inline-end:0;padding-inline-end:0}.Input_field_qrtqYW[data-hug]:has(.Input_textSuffix_IYbqRJ) .Input_input_222klx{margin-inline-end:0;padding-inline-end:0}.Input_input_222klx[type=search]::-webkit-search-decoration,.Input_input_222klx[type=search]::-webkit-search-cancel-button,.Input_input_222klx[type=search]::-webkit-search-results-button,.Input_input_222klx[type=search]::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none}.Input_field_qrtqYW [slot=prefix],.Input_field_qrtqYW [slot=suffix]{display:flex;flex-shrink:0;justify-content:center;align-items:center}.Input_field_qrtqYW:has([slot=suffix][data-input-affix=control]){--reforma-input-control-affix-inset: var(--spacing-2);gap:var(--spacing-4);padding-inline-end:var(--reforma-input-control-affix-inset)}.Input_field_qrtqYW:has([slot=prefix][data-input-affix=control]){--reforma-input-control-affix-inset: var(--spacing-2);gap:var(--spacing-4);padding-inline-start:var(--reforma-input-control-affix-inset)}.Input_field_qrtqYW [data-input-affix=control]{align-self:center;height:calc(var(--reforma-input-height) - var(--reforma-input-control-affix-inset, var(--spacing-2)) * 2)}.Input_field_qrtqYW [data-input-affix=control][data-icon-only]{--reforma-input-icon-affix-size: calc(var(--reforma-input-height) - var(--reforma-input-control-affix-inset, var(--spacing-2)) * 2);flex-shrink:0;box-sizing:border-box;border-radius:calc((var(--reforma-input-radius) - var(--reforma-input-control-affix-inset, var(--spacing-2))) * var(--squircle-radius-factor));padding:0;width:var(--reforma-input-icon-affix-size);min-width:var(--reforma-input-icon-affix-size);max-width:var(--reforma-input-icon-affix-size);height:var(--reforma-input-icon-affix-size);corner-shape:superellipse(var(--squircle-value))}.Input_field_qrtqYW [data-reveal-on-field-hover]{opacity:0;transition:opacity var(--transition-duration-fast) var(--ease-in-out);pointer-events:none}.Input_field_qrtqYW:hover [data-reveal-on-field-hover],.Input_field_qrtqYW:focus-within [data-reveal-on-field-hover]{opacity:1;pointer-events:auto}@media(hover:none){.Input_field_qrtqYW [data-reveal-on-field-hover]{opacity:1;pointer-events:auto}}.Input_textPrefix_FUDCBZ,.Input_textSuffix_IYbqRJ{opacity:var(--opacity-inactive);pointer-events:none;white-space:pre}.Input_scrubHandle_LfvCs9{position:absolute;top:0;bottom:0;left:0;transform:translate(calc(var(--spacing-2) * -1));z-index:1;cursor:ew-resize;width:var(--reforma-input-padding-inline)}.Input_field_qrtqYW:has([slot=prefix]) .Input_scrubHandle_LfvCs9{width:calc(var(--reforma-input-padding-inline) + var(--reforma-input-gap) + var(--reforma-input-height))}}

package/dist/Input/Input.module.css.js

@@ -0,0 +1,16 @@
+const t = "Input_field_qrtqYW", e = "Input_input_222klx", n = "Input_textSuffix_IYbqRJ", u = "Input_textPrefix_FUDCBZ", f = "Input_scrubHandle_LfvCs9", x = {
+  field: t,
+  input: e,
+  textSuffix: n,
+  textPrefix: u,
+  scrubHandle: f
+};
+export {
+  x as default,
+  t as field,
+  e as input,
+  f as scrubHandle,
+  u as textPrefix,
+  n as textSuffix
+};
+//# sourceMappingURL=Input.module.css.js.map

package/dist/Input/Input.module.css.js.map

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

package/dist/Input/PasswordInput.d.ts

@@ -0,0 +1,12 @@
+import { type Ref } from 'react';
+import { type InputProps } from './Input';
+export interface PasswordInputProps extends Omit<InputProps, 'type' | 'suffix'> {
+    autoComplete?: string;
+    placeholder?: string;
+    ref?: Ref<HTMLInputElement>;
+}
+export declare function PasswordInput({ className, isDisabled, size, ...props }: PasswordInputProps): import("react").JSX.Element;
+export declare namespace PasswordInput {
+    var displayName: string;
+}
+//# sourceMappingURL=PasswordInput.d.ts.map

package/dist/Input/PasswordInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PasswordInput.d.ts","sourceRoot":"","sources":["../../src/Input/PasswordInput.tsx"],"names":[],"mappings":"AACA,OAAO,EAAY,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AAG3C,OAAO,EAA8B,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAEtE,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,QAAQ,CAAC;IAC3E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC/B;AASD,wBAAgB,aAAa,CAAC,EAC1B,SAAS,EACT,UAAU,EACV,IAAW,EACX,GAAG,KAAK,EACX,EAAE,kBAAkB,+BAyCpB;yBA9Ce,aAAa"}

package/dist/Input/PasswordInput.js

@@ -0,0 +1,54 @@
+import { Eye as m, EyeClosed as l } from "@reforma/icons/20";
+import { useState as f } from "react";
+import { Button as w } from "../Button/Button.js";
+import { Input as c, INPUT_CONTROL_AFFIX as P } from "./Input.js";
+import { jsx as o } from "react/jsx-runtime";
+const n = {
+  xs: 12,
+  sm: 14,
+  md: 16,
+  lg: 20
+};
+function h({
+  className: a,
+  isDisabled: r,
+  size: t = "md",
+  ...e
+}) {
+  const [s, i] = f(!1), d = () => {
+    i((u) => !u);
+  }, p = {
+    ...e,
+    size: t,
+    type: s ? "text" : "password",
+    className: a,
+    isDisabled: r,
+    autoComplete: e.autoComplete ?? "current-password"
+  };
+  return /* @__PURE__ */ o(c, {
+    ...p,
+    children: /* @__PURE__ */ o(w, {
+      slot: "suffix",
+      "data-input-affix": P,
+      type: "button",
+      variant: "filling",
+      size: "xs",
+      iconOnly: !0,
+      isDisabled: r,
+      tooltip: s ? "Hide password" : "Show password",
+      onPress: d,
+      children: s ? /* @__PURE__ */ o(m, {
+        "aria-hidden": "true",
+        size: n[t]
+      }) : /* @__PURE__ */ o(l, {
+        "aria-hidden": "true",
+        size: n[t]
+      })
+    })
+  });
+}
+h.displayName = "PasswordInput";
+export {
+  h as PasswordInput
+};
+//# sourceMappingURL=PasswordInput.js.map

package/dist/Input/PasswordInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PasswordInput.js","sources":["../../src/Input/PasswordInput.tsx"],"sourcesContent":["import { Eye, EyeClosed } from '@reforma/icons/20';\nimport { useState, type Ref } from 'react';\n\nimport { Button } from '../Button';\nimport { Input, INPUT_CONTROL_AFFIX, type InputProps } from './Input';\n\nexport interface PasswordInputProps extends Omit<InputProps, 'type' | 'suffix'> {\n    autoComplete?: string;\n    placeholder?: string;\n    ref?: Ref<HTMLInputElement>;\n}\n\nconst ICON_SIZE_MAP = {\n    xs: 12,\n    sm: 14,\n    md: 16,\n    lg: 20,\n};\n\nexport function PasswordInput({\n    className,\n    isDisabled,\n    size = 'md',\n    ...props\n}: PasswordInputProps) {\n    const [showPassword, setShowPassword] = useState(false);\n\n    const handleTogglePassword = () => {\n        setShowPassword(prev => !prev);\n    };\n\n    const inputProps = {\n        ...props,\n        size,\n        type: showPassword ? 'text' : 'password',\n        className,\n        isDisabled,\n        autoComplete: props.autoComplete ?? 'current-password',\n    } as InputProps;\n\n    return (\n        <Input\n            { ...inputProps }\n        >\n            <Button\n                slot=\"suffix\"\n                data-input-affix={ INPUT_CONTROL_AFFIX }\n                type=\"button\"\n                variant=\"filling\"\n                size=\"xs\"\n                iconOnly\n                isDisabled={ isDisabled }\n                tooltip={ showPassword ? 'Hide password' : 'Show password' }\n                onPress={ handleTogglePassword }\n            >\n                {showPassword\n                    ? (\n                        <Eye aria-hidden=\"true\" size={ ICON_SIZE_MAP[size] } />\n                    )\n                    : (\n                        <EyeClosed aria-hidden=\"true\" size={ ICON_SIZE_MAP[size] } />\n                    )}\n            </Button>\n        </Input>\n    );\n}\n\nPasswordInput.displayName = 'PasswordInput';\n\n"],"names":["ICON_SIZE_MAP","PasswordInput","className","isDisabled","size","props","showPassword","setShowPassword","useState","handleTogglePassword","prev","inputProps","Input","Button","INPUT_CONTROL_AFFIX","_jsx","Eye","EyeClosed"],"mappings":";;;;;AAKA,MAAMA,IAAgB;AAAA,EACpB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AACO,SAASC,EAAc;AAAA,EAC5B,WAAAC;AAAA,EACA,YAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,GAAGC;AACL,GAAG;AACD,QAAM,CAACC,GAAcC,CAAe,IAAIC,EAAS,EAAK,GAChDC,IAAuB,MAAM;AACjC,IAAAF,EAAgB,CAAAG,MAAQ,CAACA,CAAI;AAAA,EAC/B,GACMC,IAAa;AAAA,IACjB,GAAGN;AAAA,IACH,MAAAD;AAAA,IACA,MAAME,IAAe,SAAS;AAAA,IAC9B,WAAAJ;AAAA,IACA,YAAAC;AAAA,IACA,cAAcE,EAAM,gBAAgB;AAAA,EAAA;AAEtC,2BAAyBO,GAAO;AAAA,IAC9B,GAAGD;AAAA,IACH,4BAA4BE,GAAQ;AAAA,MAClC,MAAM;AAAA,MACN,oBAAoBC;AAAA,MACpB,MAAM;AAAA,MACN,SAAS;AAAA,MACT,MAAM;AAAA,MACN,UAAU;AAAA,MACV,YAAAX;AAAA,MACA,SAASG,IAAe,kBAAkB;AAAA,MAC1C,SAASG;AAAA,MACT,UAAUH,IAA4BS,gBAAAA,EAAKC,GAAK;AAAA,QAC9C,eAAe;AAAA,QACf,MAAMhB,EAAcI,CAAI;AAAA,MAAA,CACzB,IAAiBW,gBAAAA,EAAKE,GAAW;AAAA,QAChC,eAAe;AAAA,QACf,MAAMjB,EAAcI,CAAI;AAAA,MAAA,CACzB;AAAA,IAAA,CACF;AAAA,EAAA,CACF;AACH;AACAH,EAAc,cAAc;"}

package/dist/Input/SearchInput.d.ts

@@ -0,0 +1,21 @@
+import { type ReactNode, type Ref } from 'react';
+import { type InputProps } from './Input';
+export interface SearchInputProps extends Omit<InputProps, 'type' | 'prefix' | 'suffix'> {
+    autoComplete?: string;
+    placeholder?: string;
+    ref?: Ref<HTMLInputElement>;
+    /**
+     * Override prefix / suffix via slots (`slot="prefix"` / `slot="suffix"`).
+     * Default prefix is the search icon; default suffix is the clear button when non-empty.
+     */
+    children?: ReactNode;
+}
+/**
+ * Search field with a default search prefix icon and a clear suffix.
+ * Pass `slot="prefix"` / `slot="suffix"` children to replace either default.
+ */
+export declare function SearchInput({ children, size, isDisabled, value, defaultValue, onChange, onKeyDown, autoComplete, ...props }: SearchInputProps): import("react").JSX.Element;
+export declare namespace SearchInput {
+    var displayName: string;
+}
+//# sourceMappingURL=SearchInput.d.ts.map

package/dist/Input/SearchInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../src/Input/SearchInput.tsx"],"names":[],"mappings":"AACA,OAAO,EAAgC,KAAK,SAAS,EAAE,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AAI/E,OAAO,EAA8B,KAAK,UAAU,EAAkB,MAAM,SAAS,CAAC;AAEtF,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,QAAQ,GAAG,QAAQ,CAAC;IACpF,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAC5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACxB;AASD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EACxB,QAAQ,EACR,IAAW,EACX,UAAU,EACV,KAAK,EACL,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,GAAG,KAAK,EACX,EAAE,gBAAgB,+BAuElB;yBAjFe,WAAW"}

package/dist/Input/SearchInput.js

@@ -0,0 +1,66 @@
+import { Search as O, Close as P } from "@reforma/icons/14";
+import { useState as _ } from "react";
+import { Button as z } from "../Button/Button.js";
+import { filterSlots as u } from "../Slot/Slot.js";
+import { Input as V, INPUT_CONTROL_AFFIX as j } from "./Input.js";
+import { jsxs as w, jsx as e } from "react/jsx-runtime";
+const A = {
+  xs: 12,
+  sm: 14,
+  md: 16,
+  lg: 20
+};
+function D({
+  children: n,
+  size: r = "md",
+  isDisabled: i,
+  value: s,
+  defaultValue: p,
+  onChange: m,
+  onKeyDown: d,
+  autoComplete: h,
+  ...x
+}) {
+  const a = s !== void 0, [C, S] = _(() => String(p ?? "")), o = a ? String(s ?? "") : C, l = A[r], c = (t) => {
+    a || S(t), m?.(t);
+  }, f = () => c(""), y = (t) => {
+    t.key === "Escape" && o && (t.preventDefault(), f()), d?.(t);
+  }, I = u(n, "prefix", /* @__PURE__ */ e(O, {
+    slot: "prefix",
+    "aria-hidden": !0,
+    size: l
+  })), g = u(n, "suffix", o ? /* @__PURE__ */ e(z, {
+    slot: "suffix",
+    "data-input-affix": j,
+    type: "button",
+    variant: "filling",
+    size: "xs",
+    iconOnly: !0,
+    isDisabled: i,
+    "aria-label": "Clear search",
+    tooltip: "Clear",
+    onPress: f,
+    children: /* @__PURE__ */ e(P, {
+      "aria-hidden": !0,
+      size: l
+    })
+  }) : null), N = {
+    ...x,
+    size: r,
+    type: "search",
+    isDisabled: i,
+    value: o,
+    onChange: c,
+    onKeyDown: y,
+    autoComplete: h ?? "off"
+  };
+  return /* @__PURE__ */ w(V, {
+    ...N,
+    children: [I, g]
+  });
+}
+D.displayName = "SearchInput";
+export {
+  D as SearchInput
+};
+//# sourceMappingURL=SearchInput.js.map

package/dist/Input/SearchInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchInput.js","sources":["../../src/Input/SearchInput.tsx"],"sourcesContent":["import { Close, Search } from '@reforma/icons/14';\nimport { useState, type KeyboardEvent, type ReactNode, type Ref } from 'react';\n\nimport { Button } from '../Button';\nimport { filterSlots } from '../Slot';\nimport { Input, INPUT_CONTROL_AFFIX, type InputProps, type InputSize } from './Input';\n\nexport interface SearchInputProps extends Omit<InputProps, 'type' | 'prefix' | 'suffix'> {\n    autoComplete?: string;\n    placeholder?: string;\n    ref?: Ref<HTMLInputElement>;\n    /**\n     * Override prefix / suffix via slots (`slot=\"prefix\"` / `slot=\"suffix\"`).\n     * Default prefix is the search icon; default suffix is the clear button when non-empty.\n     */\n    children?: ReactNode;\n}\n\nconst ICON_SIZE_MAP: Record<InputSize, number> = {\n    xs: 12,\n    sm: 14,\n    md: 16,\n    lg: 20,\n};\n\n/**\n * Search field with a default search prefix icon and a clear suffix.\n * Pass `slot=\"prefix\"` / `slot=\"suffix\"` children to replace either default.\n */\nexport function SearchInput({\n    children,\n    size = 'md',\n    isDisabled,\n    value,\n    defaultValue,\n    onChange,\n    onKeyDown,\n    autoComplete,\n    ...props\n}: SearchInputProps) {\n    const isControlled = value !== undefined;\n    const [uncontrolledValue, setUncontrolledValue] = useState(() => String(defaultValue ?? ''));\n    const currentValue = isControlled ? String(value ?? '') : uncontrolledValue;\n    const iconSize = ICON_SIZE_MAP[size];\n\n    const handleChange = (next: string) => {\n        if (!isControlled) {\n            setUncontrolledValue(next);\n        }\n\n        onChange?.(next as never);\n    };\n\n    const clear = () => handleChange('');\n\n    const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n        if (event.key === 'Escape' && currentValue) {\n            event.preventDefault();\n            clear();\n        }\n\n        (onKeyDown as ((event: KeyboardEvent<HTMLInputElement>) => void) | undefined)?.(event);\n    };\n\n    const prefix = filterSlots(\n        children,\n        'prefix',\n        <Search slot=\"prefix\" aria-hidden size={ iconSize } />\n    );\n\n    const suffix = filterSlots(\n        children,\n        'suffix',\n        currentValue\n            ? (\n                <Button\n                    slot=\"suffix\"\n                    data-input-affix={ INPUT_CONTROL_AFFIX }\n                    type=\"button\"\n                    variant=\"filling\"\n                    size=\"xs\"\n                    iconOnly\n                    isDisabled={ isDisabled }\n                    aria-label=\"Clear search\"\n                    tooltip=\"Clear\"\n                    onPress={ clear }\n                >\n                    <Close aria-hidden size={ iconSize } />\n                </Button>\n            )\n            : null\n    );\n\n    const inputProps = {\n        ...props,\n        size,\n        type: 'search' as const,\n        isDisabled,\n        value: currentValue,\n        onChange: handleChange,\n        onKeyDown: handleKeyDown,\n        autoComplete: autoComplete ?? 'off',\n    } as InputProps;\n\n    return (\n        <Input { ...inputProps }>\n            { prefix }\n            { suffix }\n        </Input>\n    );\n}\n\nSearchInput.displayName = 'SearchInput';\n"],"names":["ICON_SIZE_MAP","SearchInput","children","size","isDisabled","value","defaultValue","onChange","onKeyDown","autoComplete","props","isControlled","uncontrolledValue","setUncontrolledValue","useState","currentValue","iconSize","handleChange","next","clear","handleKeyDown","event","prefix","filterSlots","Search","suffix","Button","INPUT_CONTROL_AFFIX","Close","inputProps","Input"],"mappings":";;;;;;AAMA,MAAMA,IAAgB;AAAA,EACpB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAMO,SAASC,EAAY;AAAA,EAC1B,UAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,YAAAC;AAAA,EACA,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,GAAGC;AACL,GAAG;AACD,QAAMC,IAAeN,MAAU,QACzB,CAACO,GAAmBC,CAAoB,IAAIC,EAAS,MAAM,OAAOR,KAAgB,EAAE,CAAC,GACrFS,IAAeJ,IAAe,OAAON,KAAS,EAAE,IAAIO,GACpDI,IAAWhB,EAAcG,CAAI,GAC7Bc,IAAe,CAAAC,MAAQ;AAC3B,IAAKP,KACHE,EAAqBK,CAAI,GAE3BX,IAAWW,CAAI;AAAA,EACjB,GACMC,IAAQ,MAAMF,EAAa,EAAE,GAC7BG,IAAgB,CAAAC,MAAS;AAC7B,IAAIA,EAAM,QAAQ,YAAYN,MAC5BM,EAAM,eAAA,GACNF,EAAA,IAEFX,IAAYa,CAAK;AAAA,EACnB,GACMC,IAASC,EAAYrB,GAAU,4BAA4BsB,GAAQ;AAAA,IACvE,MAAM;AAAA,IACN,eAAe;AAAA,IACf,MAAMR;AAAA,EAAA,CACP,CAAC,GACIS,IAASF,EAAYrB,GAAU,UAAUa,sBAAiCW,GAAQ;AAAA,IACtF,MAAM;AAAA,IACN,oBAAoBC;AAAA,IACpB,MAAM;AAAA,IACN,SAAS;AAAA,IACT,MAAM;AAAA,IACN,UAAU;AAAA,IACV,YAAAvB;AAAA,IACA,cAAc;AAAA,IACd,SAAS;AAAA,IACT,SAASe;AAAA,IACT,4BAA4BS,GAAO;AAAA,MACjC,eAAe;AAAA,MACf,MAAMZ;AAAA,IAAA,CACP;AAAA,EAAA,CACF,IAAI,IAAI,GACHa,IAAa;AAAA,IACjB,GAAGnB;AAAA,IACH,MAAAP;AAAA,IACA,MAAM;AAAA,IACN,YAAAC;AAAA,IACA,OAAOW;AAAA,IACP,UAAUE;AAAA,IACV,WAAWG;AAAA,IACX,cAAcX,KAAgB;AAAA,EAAA;AAEhC,2BAA0BqB,GAAO;AAAA,IAC/B,GAAGD;AAAA,IACH,UAAU,CAACP,GAAQG,CAAM;AAAA,EAAA,CAC1B;AACH;AACAxB,EAAY,cAAc;"}