@craftzbay/ui 0.10.0 → 0.11.1

package/dist-lib/components/ui/TagInput.js

@@ -1,66 +1,66 @@
 "use client";
-import { jsxs as u, jsx as o } from "react/jsx-runtime";
-import { forwardRef as q, useState as I, useCallback as A } from "react";
+import { jsxs as f, jsx as o } from "react/jsx-runtime";
+import { forwardRef as q, useState as k, useCallback as A } from "react";
 import { X as G } from "../../icons/index.js";
-import { cn as f } from "../../lib/utils.js";
+import { cn as m } from "../../lib/utils.js";
 import { useStrings as J } from "../../hooks/use-strings.js";
 import { formatString as L } from "../../lib/strings.js";
 import { useFieldIds as O } from "../../hooks/use-field-ids.js";
 const P = q(function({
-  value: a,
-  defaultValue: N = [],
+  value: s,
+  defaultValue: B = [],
   onChange: i,
-  label: m,
-  hideLabel: k,
-  description: s,
-  placeholder: B,
+  label: a,
+  hideLabel: E,
+  description: l,
+  placeholder: D,
   max: g,
   disabled: p,
-  error: l,
-  separators: E = ["Enter", ","],
-  id: D,
-  "aria-describedby": S,
-  "aria-label": T,
-  className: j
-}, F) {
-  const [K, $] = I(N), [n, d] = I(""), r = a ?? K, h = J(), z = B ?? h.tagInput.placeholder, c = !!l, b = c && l !== !0, { fieldId: x, helperId: H, errorId: M, describedBy: R } = O(D, {
-    hasHelper: !!s,
-    hasError: b,
-    extra: S
-  }), v = A(
+  error: c,
+  separators: S = ["Enter", ","],
+  id: b,
+  "aria-describedby": T,
+  "aria-label": j,
+  className: F
+}, K) {
+  const [$, z] = k(B), [n, d] = k(""), r = s ?? $, h = J(), x = D ?? h.tagInput.placeholder, u = !!c, v = u && c !== !0, { fieldId: y, helperId: H, errorId: M, describedBy: R } = O(b, {
+    hasHelper: !!l,
+    hasError: v,
+    extra: T
+  }), w = A(
     (e) => {
-      a === void 0 && $(e), i == null || i(e);
+      s === void 0 && z(e), i == null || i(e);
     },
-    [i, a]
-  ), y = (e) => {
+    [i, s]
+  ), I = (e) => {
     const t = e.trim();
-    !t || r.includes(t) || g !== void 0 && r.length >= g || v([...r, t]);
-  }, w = (e) => v(r.filter((t, _) => _ !== e)), X = (e) => {
-    E.includes(e.key) ? (e.preventDefault(), y(n), d("")) : e.key === "Backspace" && !n && r.length && w(r.length - 1);
+    !t || r.includes(t) || g !== void 0 && r.length >= g || w([...r, t]);
+  }, N = (e) => w(r.filter((t, _) => _ !== e)), X = (e) => {
+    S.includes(e.key) ? (e.preventDefault(), I(n), d("")) : e.key === "Backspace" && !n && r.length && N(r.length - 1);
   };
-  return /* @__PURE__ */ u("div", { ref: F, className: f("flex flex-col gap-1.5", j), children: [
-    m && /* @__PURE__ */ o(
+  return /* @__PURE__ */ f("div", { ref: K, className: m("flex flex-col gap-1.5", F), children: [
+    a && /* @__PURE__ */ o(
       "label",
       {
-        htmlFor: x,
-        className: f("text-foreground text-sm font-medium", k && "sr-only"),
-        children: m
+        htmlFor: y,
+        className: m("text-foreground text-sm font-medium", E && "sr-only"),
+        children: a
       }
     ),
-    /* @__PURE__ */ u(
+    /* @__PURE__ */ f(
       "div",
       {
-        className: f(
+        className: m(
           // Cap growth at ~3 chip rows and scroll inside — an unbounded field
           // pushes the surrounding layout around as tags are added.
           "bg-card flex max-h-24 min-h-9 w-full flex-wrap items-center gap-1.5 overflow-y-auto rounded-md border px-2 py-1.5",
           "transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out)]",
           "focus-within:ring-offset-background focus-within:ring-2 focus-within:ring-offset-2",
-          c ? "border-danger focus-within:border-danger focus-within:ring-danger" : "border-border focus-within:border-accent focus-within:ring-ring",
+          u ? "border-danger focus-within:border-danger focus-within:ring-danger" : "border-border-input focus-within:border-accent focus-within:ring-ring",
           p && "pointer-events-none opacity-50"
         ),
         children: [
-          r.map((e, t) => /* @__PURE__ */ u(
+          r.map((e, t) => /* @__PURE__ */ f(
             "span",
             {
               className: "bg-background-muted inline-flex items-center gap-1 rounded-sm px-2 py-0.5 text-xs",
@@ -70,8 +70,8 @@ const P = q(function({
                   "button",
                   {
                     type: "button",
-                    onClick: () => w(t),
-                    className: "text-foreground-muted hover:bg-background-subtle hover:text-foreground focus-visible:ring-ring rounded-sm p-0.5 outline-none focus-visible:ring-2",
+                    onClick: () => N(t),
+                    className: "text-foreground-muted hover:bg-background-subtle hover:text-foreground focus-visible:ring-ring focus-visible:ring-offset-background relative rounded-sm p-0.5 outline-none before:absolute before:-inset-1.5 before:content-[''] focus-visible:ring-2 focus-visible:ring-offset-1",
                     "aria-label": L(h.tagInput.remove, { tag: e }),
                     children: /* @__PURE__ */ o(G, { className: "size-3", "aria-hidden": !0 })
                   }
@@ -83,25 +83,25 @@ const P = q(function({
           /* @__PURE__ */ o(
             "input",
             {
-              id: x,
+              id: y,
               value: n,
               disabled: p,
               onChange: (e) => d(e.target.value),
               onKeyDown: X,
               onBlur: () => {
-                n && (y(n), d(""));
+                n && (I(n), d(""));
               },
-              placeholder: r.length === 0 ? z : void 0,
-              "aria-label": T,
-              "aria-invalid": c || void 0,
+              placeholder: r.length === 0 ? x : void 0,
+              "aria-label": j ?? (a || b ? void 0 : x),
+              "aria-invalid": u || void 0,
               "aria-describedby": R,
-              className: "placeholder:text-foreground-subtle min-w-[8ch] flex-1 bg-transparent text-sm outline-none"
+              className: "placeholder:text-foreground-subtle min-w-[8ch] flex-1 bg-transparent text-lg outline-none md:text-sm"
             }
           )
         ]
       }
     ),
-    b ? /* @__PURE__ */ o("p", { id: M, role: "alert", className: "text-danger-text text-xs", children: l }) : s ? /* @__PURE__ */ o("p", { id: H, className: "text-foreground-subtle text-xs", children: s }) : null
+    v ? /* @__PURE__ */ o("p", { id: M, className: "text-danger-text text-xs", children: c }) : l ? /* @__PURE__ */ o("p", { id: H, className: "text-foreground-subtle text-xs", children: l }) : null
   ] });
 });
 P.displayName = "TagInput";

package/dist-lib/components/ui/TagInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagInput.js","sources":["../../../src/components/ui/TagInput.tsx"],"sourcesContent":["'use client';\n\nimport { forwardRef, useCallback, useState, type KeyboardEvent, type ReactNode } from 'react';\nimport { X } from '@/icons';\nimport { cn } from '@/lib/utils';\nimport { useStrings } from '@/hooks/use-strings';\nimport { formatString } from '@/lib/strings';\nimport { useFieldIds } from '@/hooks/use-field-ids';\n\nexport interface TagInputProps {\n  /** Controlled list of tags. */\n  value?: string[];\n  /** Default tags when uncontrolled. */\n  defaultValue?: string[];\n  /** Called when the tag list changes. */\n  onChange?: (tags: string[]) => void;\n  /** Visible label rendered above the field. */\n  label?: ReactNode;\n  /** Visually conceal the label while keeping it for screen readers. */\n  hideLabel?: boolean;\n  /** Hint below the field. Hidden while `error` is set. */\n  description?: ReactNode;\n  /** Placeholder shown inside the inline input. */\n  placeholder?: string;\n  /** Maximum number of tags. */\n  max?: number;\n  /** Disable the editor. */\n  disabled?: boolean;\n  /**\n   * Validation state. `true` only paints the danger border; a ReactNode also\n   * renders the message below the field and wires `aria-describedby`.\n   */\n  error?: boolean | ReactNode;\n  /** Treat these characters as separators (default: Enter + comma). */\n  separators?: string[];\n  /** Consumer-supplied id for the inline input. */\n  id?: string;\n  /** Extra ids to append to `aria-describedby`. */\n  'aria-describedby'?: string;\n  'aria-label'?: string;\n  className?: string;\n}\n\n/**\n * Chip-based multi-value input. Press Enter or comma to add. Backspace on an\n * empty input removes the last tag.\n */\nexport const TagInput = forwardRef<HTMLDivElement, TagInputProps>(function TagInput(\n  {\n    value,\n    defaultValue = [],\n    onChange,\n    label,\n    hideLabel,\n    description,\n    placeholder: placeholderProp,\n    max,\n    disabled,\n    error,\n    separators = ['Enter', ','],\n    id,\n    'aria-describedby': ariaDescribedby,\n    'aria-label': ariaLabel,\n    className,\n  },\n  ref,\n) {\n  const [internal, setInternal] = useState<string[]>(defaultValue);\n  const [draft, setDraft] = useState('');\n  const tags = value ?? internal;\n\n  const strings = useStrings();\n  const placeholder = placeholderProp ?? strings.tagInput.placeholder;\n  const isError = Boolean(error);\n  const hasErrorMessage = isError && error !== true;\n  const { fieldId, helperId, errorId, describedBy } = useFieldIds(id, {\n    hasHelper: Boolean(description),\n    hasError: hasErrorMessage,\n    extra: ariaDescribedby,\n  });\n\n  const update = useCallback(\n    (next: string[]) => {\n      if (value === undefined) setInternal(next);\n      onChange?.(next);\n    },\n    [onChange, value],\n  );\n\n  const commit = (raw: string) => {\n    const t = raw.trim();\n    if (!t || tags.includes(t) || (max !== undefined && tags.length >= max)) return;\n    update([...tags, t]);\n  };\n\n  const remove = (idx: number) => update(tags.filter((_, i) => i !== idx));\n\n  const onKey = (e: KeyboardEvent<HTMLInputElement>) => {\n    if (separators.includes(e.key)) {\n      e.preventDefault();\n      commit(draft);\n      setDraft('');\n    } else if (e.key === 'Backspace' && !draft && tags.length) {\n      remove(tags.length - 1);\n    }\n  };\n\n  return (\n    <div ref={ref} className={cn('flex flex-col gap-1.5', className)}>\n      {label && (\n        <label\n          htmlFor={fieldId}\n          className={cn('text-foreground text-sm font-medium', hideLabel && 'sr-only')}\n        >\n          {label}\n        </label>\n      )}\n      <div\n        className={cn(\n          // Cap growth at ~3 chip rows and scroll inside — an unbounded field\n          // pushes the surrounding layout around as tags are added.\n          'bg-card flex max-h-24 min-h-9 w-full flex-wrap items-center gap-1.5 overflow-y-auto rounded-md border px-2 py-1.5',\n          'transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out)]',\n          'focus-within:ring-offset-background focus-within:ring-2 focus-within:ring-offset-2',\n          isError\n            ? 'border-danger focus-within:border-danger focus-within:ring-danger'\n            : 'border-border focus-within:border-accent focus-within:ring-ring',\n          disabled && 'pointer-events-none opacity-50',\n        )}\n      >\n        {tags.map((t, i) => (\n          <span\n            key={`${t}-${i}`}\n            className=\"bg-background-muted inline-flex items-center gap-1 rounded-sm px-2 py-0.5 text-xs\"\n          >\n            {t}\n            <button\n              type=\"button\"\n              onClick={() => remove(i)}\n              className=\"text-foreground-muted hover:bg-background-subtle hover:text-foreground focus-visible:ring-ring rounded-sm p-0.5 outline-none focus-visible:ring-2\"\n              aria-label={formatString(strings.tagInput.remove, { tag: t })}\n            >\n              <X className=\"size-3\" aria-hidden />\n            </button>\n          </span>\n        ))}\n        <input\n          id={fieldId}\n          value={draft}\n          disabled={disabled}\n          onChange={(e) => setDraft(e.target.value)}\n          onKeyDown={onKey}\n          onBlur={() => {\n            if (draft) {\n              commit(draft);\n              setDraft('');\n            }\n          }}\n          placeholder={tags.length === 0 ? placeholder : undefined}\n          aria-label={ariaLabel}\n          aria-invalid={isError || undefined}\n          aria-describedby={describedBy}\n          className=\"placeholder:text-foreground-subtle min-w-[8ch] flex-1 bg-transparent text-sm outline-none\"\n        />\n      </div>\n      {hasErrorMessage ? (\n        <p id={errorId} role=\"alert\" className=\"text-danger-text text-xs\">\n          {error}\n        </p>\n      ) : description ? (\n        <p id={helperId} className=\"text-foreground-subtle text-xs\">\n          {description}\n        </p>\n      ) : null}\n    </div>\n  );\n});\nTagInput.displayName = 'TagInput';\n"],"names":["TagInput","forwardRef","value","defaultValue","onChange","label","hideLabel","description","placeholderProp","max","disabled","error","separators","id","ariaDescribedby","ariaLabel","className","ref","internal","setInternal","useState","draft","setDraft","tags","strings","useStrings","placeholder","isError","hasErrorMessage","fieldId","helperId","errorId","describedBy","useFieldIds","update","useCallback","next","commit","raw","remove","idx","_","i","onKey","cn","jsx","jsxs","t","formatString","X"],"mappings":"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"}
+{"version":3,"file":"TagInput.js","sources":["../../../src/components/ui/TagInput.tsx"],"sourcesContent":["'use client';\n\nimport { forwardRef, useCallback, useState, type KeyboardEvent, type ReactNode } from 'react';\nimport { X } from '@/icons';\nimport { cn } from '@/lib/utils';\nimport { useStrings } from '@/hooks/use-strings';\nimport { formatString } from '@/lib/strings';\nimport { useFieldIds } from '@/hooks/use-field-ids';\n\nexport interface TagInputProps {\n  /** Controlled list of tags. */\n  value?: string[];\n  /** Default tags when uncontrolled. */\n  defaultValue?: string[];\n  /** Called when the tag list changes. */\n  onChange?: (tags: string[]) => void;\n  /** Visible label rendered above the field. */\n  label?: ReactNode;\n  /** Visually conceal the label while keeping it for screen readers. */\n  hideLabel?: boolean;\n  /** Hint below the field. Hidden while `error` is set. */\n  description?: ReactNode;\n  /** Placeholder shown inside the inline input. */\n  placeholder?: string;\n  /** Maximum number of tags. */\n  max?: number;\n  /** Disable the editor. */\n  disabled?: boolean;\n  /**\n   * Validation state. `true` only paints the danger border; a ReactNode also\n   * renders the message below the field and wires `aria-describedby`.\n   */\n  error?: boolean | ReactNode;\n  /** Treat these characters as separators (default: Enter + comma). */\n  separators?: string[];\n  /** Consumer-supplied id for the inline input. */\n  id?: string;\n  /** Extra ids to append to `aria-describedby`. */\n  'aria-describedby'?: string;\n  'aria-label'?: string;\n  className?: string;\n}\n\n/**\n * Chip-based multi-value input. Press Enter or comma to add. Backspace on an\n * empty input removes the last tag.\n */\nexport const TagInput = forwardRef<HTMLDivElement, TagInputProps>(function TagInput(\n  {\n    value,\n    defaultValue = [],\n    onChange,\n    label,\n    hideLabel,\n    description,\n    placeholder: placeholderProp,\n    max,\n    disabled,\n    error,\n    separators = ['Enter', ','],\n    id,\n    'aria-describedby': ariaDescribedby,\n    'aria-label': ariaLabel,\n    className,\n  },\n  ref,\n) {\n  const [internal, setInternal] = useState<string[]>(defaultValue);\n  const [draft, setDraft] = useState('');\n  const tags = value ?? internal;\n\n  const strings = useStrings();\n  const placeholder = placeholderProp ?? strings.tagInput.placeholder;\n  const isError = Boolean(error);\n  const hasErrorMessage = isError && error !== true;\n  const { fieldId, helperId, errorId, describedBy } = useFieldIds(id, {\n    hasHelper: Boolean(description),\n    hasError: hasErrorMessage,\n    extra: ariaDescribedby,\n  });\n\n  const update = useCallback(\n    (next: string[]) => {\n      if (value === undefined) setInternal(next);\n      onChange?.(next);\n    },\n    [onChange, value],\n  );\n\n  const commit = (raw: string) => {\n    const t = raw.trim();\n    if (!t || tags.includes(t) || (max !== undefined && tags.length >= max)) return;\n    update([...tags, t]);\n  };\n\n  const remove = (idx: number) => update(tags.filter((_, i) => i !== idx));\n\n  const onKey = (e: KeyboardEvent<HTMLInputElement>) => {\n    if (separators.includes(e.key)) {\n      e.preventDefault();\n      commit(draft);\n      setDraft('');\n    } else if (e.key === 'Backspace' && !draft && tags.length) {\n      remove(tags.length - 1);\n    }\n  };\n\n  return (\n    <div ref={ref} className={cn('flex flex-col gap-1.5', className)}>\n      {label && (\n        <label\n          htmlFor={fieldId}\n          className={cn('text-foreground text-sm font-medium', hideLabel && 'sr-only')}\n        >\n          {label}\n        </label>\n      )}\n      <div\n        className={cn(\n          // Cap growth at ~3 chip rows and scroll inside — an unbounded field\n          // pushes the surrounding layout around as tags are added.\n          'bg-card flex max-h-24 min-h-9 w-full flex-wrap items-center gap-1.5 overflow-y-auto rounded-md border px-2 py-1.5',\n          'transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out)]',\n          'focus-within:ring-offset-background focus-within:ring-2 focus-within:ring-offset-2',\n          isError\n            ? 'border-danger focus-within:border-danger focus-within:ring-danger'\n            : 'border-border-input focus-within:border-accent focus-within:ring-ring',\n          disabled && 'pointer-events-none opacity-50',\n        )}\n      >\n        {tags.map((t, i) => (\n          <span\n            key={`${t}-${i}`}\n            className=\"bg-background-muted inline-flex items-center gap-1 rounded-sm px-2 py-0.5 text-xs\"\n          >\n            {t}\n            <button\n              type=\"button\"\n              onClick={() => remove(i)}\n              // 16px glyph box + halo → ≥24px hit area (WCAG 2.5.8) without growing the chip.\n              className=\"text-foreground-muted hover:bg-background-subtle hover:text-foreground focus-visible:ring-ring focus-visible:ring-offset-background relative rounded-sm p-0.5 outline-none before:absolute before:-inset-1.5 before:content-[''] focus-visible:ring-2 focus-visible:ring-offset-1\"\n              aria-label={formatString(strings.tagInput.remove, { tag: t })}\n            >\n              <X className=\"size-3\" aria-hidden />\n            </button>\n          </span>\n        ))}\n        <input\n          id={fieldId}\n          value={draft}\n          disabled={disabled}\n          onChange={(e) => setDraft(e.target.value)}\n          onKeyDown={onKey}\n          onBlur={() => {\n            if (draft) {\n              commit(draft);\n              setDraft('');\n            }\n          }}\n          placeholder={tags.length === 0 ? placeholder : undefined}\n          // Unlabelled field: fall back to the placeholder. A consumer `id`\n          // implies an external <label htmlFor>.\n          aria-label={ariaLabel ?? (label || id ? undefined : placeholder)}\n          aria-invalid={isError || undefined}\n          aria-describedby={describedBy}\n          className=\"placeholder:text-foreground-subtle min-w-[8ch] flex-1 bg-transparent text-lg outline-none md:text-sm\"\n        />\n      </div>\n      {hasErrorMessage ? (\n        <p id={errorId} className=\"text-danger-text text-xs\">\n          {error}\n        </p>\n      ) : description ? (\n        <p id={helperId} className=\"text-foreground-subtle text-xs\">\n          {description}\n        </p>\n      ) : null}\n    </div>\n  );\n});\nTagInput.displayName = 'TagInput';\n"],"names":["TagInput","forwardRef","value","defaultValue","onChange","label","hideLabel","description","placeholderProp","max","disabled","error","separators","id","ariaDescribedby","ariaLabel","className","ref","internal","setInternal","useState","draft","setDraft","tags","strings","useStrings","placeholder","isError","hasErrorMessage","fieldId","helperId","errorId","describedBy","useFieldIds","update","useCallback","next","commit","raw","remove","idx","_","i","onKey","cn","jsx","jsxs","t","formatString","X"],"mappings":"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"}

package/dist-lib/components/ui/Textarea.js

@@ -1,77 +1,88 @@
 "use client";
-import { jsxs as $, jsx as s } from "react/jsx-runtime";
-import { forwardRef as j, useId as k, useRef as F, useCallback as B, useEffect as E } from "react";
-import { cn as c } from "../../lib/utils.js";
-const M = j(function({
-  className: h,
-  label: a,
-  helperText: n,
-  error: r,
-  autoResize: t,
-  minRows: v = 3,
-  maxRows: f = 12,
-  hideLabel: y,
-  id: H,
+import { jsxs as Y, jsx as n } from "react/jsx-runtime";
+import { forwardRef as $, useRef as q, useCallback as A, useEffect as H } from "react";
+import { cn as b } from "../../lib/utils.js";
+import { useFieldIds as D } from "../../hooks/use-field-ids.js";
+const G = $(function({
+  className: N,
+  label: p,
+  helperText: a,
+  error: i,
+  autoResize: r,
+  minRows: d = 3,
+  maxRows: m = 12,
+  hideLabel: E,
+  id: T,
   onChange: l,
-  value: u,
-  defaultValue: g,
-  ...N
-}, i) {
-  const I = k(), o = H ?? I, m = `${o}-helper`, b = `${o}-error`, x = F(null), w = (e) => {
-    x.current = e, typeof i == "function" ? i(e) : i && (i.current = e);
-  }, d = B(() => {
-    const e = x.current;
-    if (!e || !t) return;
+  value: g,
+  defaultValue: x,
+  "aria-describedby": j,
+  "aria-invalid": c,
+  ...k
+}, s) {
+  const w = !!i || c === !0 || c === "true", { fieldId: h, helperId: I, errorId: M, describedBy: O } = D(T, {
+    hasHelper: !!a,
+    hasError: !!i,
+    extra: j
+  }), f = q(null), W = (e) => {
+    f.current = e, typeof s == "function" ? s(e) : s && (s.current = e);
+  }, o = A(() => {
+    const e = f.current;
+    if (!e || !r) return;
+    const t = getComputedStyle(e), v = parseFloat(t.lineHeight) || 20, y = (parseFloat(t.paddingTop) || 0) + (parseFloat(t.paddingBottom) || 0), u = (parseFloat(t.borderTopWidth) || 0) + (parseFloat(t.borderBottomWidth) || 0), S = v * d + y + u, F = v * m + y + u;
     e.style.height = "auto";
-    const p = (parseFloat(getComputedStyle(e).lineHeight) || 20) * f;
-    e.style.height = `${Math.min(e.scrollHeight, p)}px`, e.style.overflowY = e.scrollHeight > p ? "auto" : "hidden";
-  }, [t, f]);
-  return E(() => {
-    t && d();
-  }, [t, d, u, g]), /* @__PURE__ */ $("div", { className: c("flex flex-col gap-1.5", h), children: [
-    a && /* @__PURE__ */ s(
+    const B = e.scrollHeight + u;
+    e.style.height = `${Math.min(Math.max(B, S), F)}px`, e.style.overflowY = B > F ? "auto" : "hidden";
+  }, [r, d, m]);
+  return H(() => {
+    r && o();
+  }, [r, o, g, x]), H(() => {
+    const e = f.current;
+    if (!r || !e || typeof ResizeObserver > "u") return;
+    const t = new ResizeObserver(() => o());
+    return t.observe(e), () => t.disconnect();
+  }, [r, o]), /* @__PURE__ */ Y("div", { className: b("flex flex-col gap-1.5", N), children: [
+    p && /* @__PURE__ */ n(
       "label",
       {
-        htmlFor: o,
-        className: c(
-          "text-sm font-medium text-foreground",
-          y && "sr-only"
-        ),
-        children: a
+        htmlFor: h,
+        className: b("text-foreground text-sm font-medium", E && "sr-only"),
+        children: p
       }
     ),
-    /* @__PURE__ */ s(
+    /* @__PURE__ */ n(
       "textarea",
       {
-        ref: w,
-        id: o,
-        rows: v,
-        value: u,
-        defaultValue: g,
+        ref: W,
+        id: h,
+        rows: d,
+        value: g,
+        defaultValue: x,
         onChange: (e) => {
-          l == null || l(e), t && d();
+          l == null || l(e), r && o();
         },
-        "aria-invalid": !!r || void 0,
-        "aria-describedby": r ? b : n ? m : void 0,
-        className: c(
-          "rounded-md border bg-card px-3 py-2 text-lg md:text-sm text-foreground",
+        "aria-invalid": w ? !0 : c,
+        "aria-describedby": O,
+        className: b(
+          "bg-card text-foreground rounded-md border px-3 py-2 text-lg md:text-sm",
           "placeholder:text-foreground-subtle",
           "transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out)]",
           "outline-none",
-          "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+          "focus-visible:ring-ring focus-visible:ring-2 focus-visible:ring-offset-2",
           "focus-visible:ring-offset-background",
-          "disabled:opacity-50 disabled:cursor-not-allowed",
-          r ? "border-danger focus-visible:border-danger focus-visible:ring-danger" : "border-border-input focus-visible:border-accent",
-          t ? "resize-none" : "resize-y min-h-20"
+          "disabled:cursor-not-allowed disabled:opacity-50",
+          "border-border-input focus-visible:border-accent",
+          "aria-invalid:border-danger aria-invalid:focus-visible:border-danger aria-invalid:focus-visible:ring-danger",
+          r ? "resize-none" : "min-h-20 resize-y"
         ),
-        ...N
+        ...k
       }
     ),
-    r ? /* @__PURE__ */ s("p", { id: b, role: "alert", className: "text-xs text-danger-text", children: r }) : n ? /* @__PURE__ */ s("p", { id: m, className: "text-xs text-foreground-subtle", children: n }) : null
+    i ? /* @__PURE__ */ n("p", { id: M, className: "text-danger-text text-xs", children: i }) : a ? /* @__PURE__ */ n("p", { id: I, className: "text-foreground-subtle text-xs", children: a }) : null
   ] });
 });
-M.displayName = "Textarea";
+G.displayName = "Textarea";
 export {
-  M as Textarea
+  G as Textarea
 };
 //# sourceMappingURL=Textarea.js.map

package/dist-lib/components/ui/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.js","sources":["../../../src/components/ui/Textarea.tsx"],"sourcesContent":["'use client';\n\nimport {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  type TextareaHTMLAttributes,\n  type ReactNode,\n} from 'react';\nimport { cn } from '@/lib/utils';\n\nexport interface TextareaProps\n  extends TextareaHTMLAttributes<HTMLTextAreaElement> {\n  /** Visible label above the field. */\n  label?: ReactNode;\n  /** Hint below the field. Hidden when `error` is set. */\n  helperText?: ReactNode;\n  /** Validation message. Sets `aria-invalid`. */\n  error?: ReactNode;\n  /** Grow vertically as content is added. */\n  autoResize?: boolean;\n  /** Minimum rows when `autoResize`. Defaults to 3. */\n  minRows?: number;\n  /** Maximum rows before scrolling when `autoResize`. Defaults to 12. */\n  maxRows?: number;\n  /** Visually hide the label while keeping it accessible. */\n  hideLabel?: boolean;\n}\n\n/**\n * Multi-line text input. With `autoResize`, height tracks content from\n * `minRows` to `maxRows`. Without it, behaves like a native `<textarea>`.\n *\n * @example Comment box\n *   <Textarea label=\"Note\" autoResize minRows={3} maxRows={10} />\n *\n * @example With error\n *   <Textarea label=\"Description\"\n *             error={errors.description?.message}\n *             {...register('description')} />\n *\n * @do Default to `autoResize` for multi-line free-form input.\n * @dont Add `resize-none` without auto-resize — users will be stuck with a\n *       3-line box for long content.\n */\nexport const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(function Textarea(\n  {\n    className,\n    label,\n    helperText,\n    error,\n    autoResize,\n    minRows = 3,\n    maxRows = 12,\n    hideLabel,\n    id,\n    onChange,\n    value,\n    defaultValue,\n    ...props\n  },\n  ref,\n) {\n  const autoId = useId();\n  const fieldId = id ?? autoId;\n  const helperId = `${fieldId}-helper`;\n  const errorId = `${fieldId}-error`;\n  const innerRef = useRef<HTMLTextAreaElement | null>(null);\n\n  // Stash a ref locally and forward to the consumer.\n  const setRef = (node: HTMLTextAreaElement | null) => {\n    innerRef.current = node;\n    if (typeof ref === 'function') ref(node);\n    else if (ref) (ref as React.MutableRefObject<HTMLTextAreaElement | null>).current = node;\n  };\n\n  const recompute = useCallback(() => {\n    const el = innerRef.current;\n    if (!el || !autoResize) return;\n    el.style.height = 'auto';\n    const lineHeight = parseFloat(getComputedStyle(el).lineHeight) || 20;\n    const maxH = lineHeight * maxRows;\n    el.style.height = `${Math.min(el.scrollHeight, maxH)}px`;\n    el.style.overflowY = el.scrollHeight > maxH ? 'auto' : 'hidden';\n  }, [autoResize, maxRows]);\n\n  useEffect(() => {\n    if (autoResize) recompute();\n  }, [autoResize, recompute, value, defaultValue]);\n\n  return (\n    <div className={cn('flex flex-col gap-1.5', className)}>\n      {label && (\n        <label\n          htmlFor={fieldId}\n          className={cn(\n            'text-sm font-medium text-foreground',\n            hideLabel && 'sr-only',\n          )}\n        >\n          {label}\n        </label>\n      )}\n      <textarea\n        ref={setRef}\n        id={fieldId}\n        rows={minRows}\n        value={value}\n        defaultValue={defaultValue}\n        onChange={(e) => {\n          onChange?.(e);\n          if (autoResize) recompute();\n        }}\n        aria-invalid={Boolean(error) || undefined}\n        aria-describedby={error ? errorId : helperText ? helperId : undefined}\n        className={cn(\n          'rounded-md border bg-card px-3 py-2 text-lg md:text-sm text-foreground',\n          'placeholder:text-foreground-subtle',\n          'transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out)]',\n          'outline-none',\n          'focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n          'focus-visible:ring-offset-background',\n          'disabled:opacity-50 disabled:cursor-not-allowed',\n          error\n            ? 'border-danger focus-visible:border-danger focus-visible:ring-danger'\n            : 'border-border-input focus-visible:border-accent',\n          autoResize ? 'resize-none' : 'resize-y min-h-20',\n        )}\n        {...props}\n      />\n      {error ? (\n        <p id={errorId} role=\"alert\" className=\"text-xs text-danger-text\">\n          {error}\n        </p>\n      ) : helperText ? (\n        <p id={helperId} className=\"text-xs text-foreground-subtle\">\n          {helperText}\n        </p>\n      ) : null}\n    </div>\n  );\n});\n\nTextarea.displayName = 'Textarea';\n"],"names":["Textarea","forwardRef","className","label","helperText","error","autoResize","minRows","maxRows","hideLabel","id","onChange","value","defaultValue","props","ref","autoId","useId","fieldId","helperId","errorId","innerRef","useRef","setRef","node","recompute","useCallback","el","maxH","useEffect","cn","jsx"],"mappings":";;;;AA+CO,MAAMA,IAAWC,EAA+C,SACrE;AAAA,EACE,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,YAAAC;AAAA,EACA,OAAAC;AAAA,EACA,YAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,SAAAC,IAAU;AAAA,EACV,WAAAC;AAAA,EACA,IAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAASC,EAAA,GACTC,IAAUR,KAAMM,GAChBG,IAAW,GAAGD,CAAO,WACrBE,IAAU,GAAGF,CAAO,UACpBG,IAAWC,EAAmC,IAAI,GAGlDC,IAAS,CAACC,MAAqC;AACnD,IAAAH,EAAS,UAAUG,GACf,OAAOT,KAAQ,aAAYA,EAAIS,CAAI,IAC9BT,MAAMA,EAA2D,UAAUS;AAAA,EACtF,GAEMC,IAAYC,EAAY,MAAM;AAClC,UAAMC,IAAKN,EAAS;AACpB,QAAI,CAACM,KAAM,CAACrB,EAAY;AACxB,IAAAqB,EAAG,MAAM,SAAS;AAElB,UAAMC,KADa,WAAW,iBAAiBD,CAAE,EAAE,UAAU,KAAK,MACxCnB;AAC1B,IAAAmB,EAAG,MAAM,SAAS,GAAG,KAAK,IAAIA,EAAG,cAAcC,CAAI,CAAC,MACpDD,EAAG,MAAM,YAAYA,EAAG,eAAeC,IAAO,SAAS;AAAA,EACzD,GAAG,CAACtB,GAAYE,CAAO,CAAC;AAExB,SAAAqB,EAAU,MAAM;AACd,IAAIvB,KAAYmB,EAAA;AAAA,EAClB,GAAG,CAACnB,GAAYmB,GAAWb,GAAOC,CAAY,CAAC,qBAG5C,OAAA,EAAI,WAAWiB,EAAG,yBAAyB5B,CAAS,GAClD,UAAA;AAAA,IAAAC,KACC,gBAAA4B;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAASb;AAAA,QACT,WAAWY;AAAA,UACT;AAAA,UACArB,KAAa;AAAA,QAAA;AAAA,QAGd,UAAAN;AAAA,MAAA;AAAA,IAAA;AAAA,IAGL,gBAAA4B;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAKR;AAAA,QACL,IAAIL;AAAA,QACJ,MAAMX;AAAA,QACN,OAAAK;AAAA,QACA,cAAAC;AAAA,QACA,UAAU,CAAC,MAAM;AACf,UAAAF,KAAA,QAAAA,EAAW,IACPL,KAAYmB,EAAA;AAAA,QAClB;AAAA,QACA,gBAAc,EAAQpB,KAAU;AAAA,QAChC,oBAAkBA,IAAQe,IAAUhB,IAAae,IAAW;AAAA,QAC5D,WAAWW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACAzB,IACI,wEACA;AAAA,UACJC,IAAa,gBAAgB;AAAA,QAAA;AAAA,QAE9B,GAAGQ;AAAA,MAAA;AAAA,IAAA;AAAA,IAELT,IACC,gBAAA0B,EAAC,KAAA,EAAE,IAAIX,GAAS,MAAK,SAAQ,WAAU,4BACpC,aACH,IACEhB,sBACD,KAAA,EAAE,IAAIe,GAAU,WAAU,kCACxB,aACH,IACE;AAAA,EAAA,GACN;AAEJ,CAAC;AAEDnB,EAAS,cAAc;"}
+{"version":3,"file":"Textarea.js","sources":["../../../src/components/ui/Textarea.tsx"],"sourcesContent":["'use client';\n\nimport {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useRef,\n  type TextareaHTMLAttributes,\n  type ReactNode,\n} from 'react';\nimport { cn } from '@/lib/utils';\nimport { useFieldIds } from '@/hooks/use-field-ids';\n\nexport interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {\n  /** Visible label above the field. */\n  label?: ReactNode;\n  /** Hint below the field. Hidden when `error` is set. */\n  helperText?: ReactNode;\n  /** Validation message. Sets `aria-invalid`. */\n  error?: ReactNode;\n  /** Grow vertically as content is added. */\n  autoResize?: boolean;\n  /** Minimum rows when `autoResize`. Defaults to 3. */\n  minRows?: number;\n  /** Maximum rows before scrolling when `autoResize`. Defaults to 12. */\n  maxRows?: number;\n  /** Visually hide the label while keeping it accessible. */\n  hideLabel?: boolean;\n}\n\n/**\n * Multi-line text input. With `autoResize`, height tracks content from\n * `minRows` to `maxRows`. Without it, behaves like a native `<textarea>`.\n *\n * @example Comment box\n *   <Textarea label=\"Note\" autoResize minRows={3} maxRows={10} />\n *\n * @example With error\n *   <Textarea label=\"Description\"\n *             error={errors.description?.message}\n *             {...register('description')} />\n *\n * @do Default to `autoResize` for multi-line free-form input.\n * @dont Add `resize-none` without auto-resize — users will be stuck with a\n *       3-line box for long content.\n */\nexport const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(function Textarea(\n  {\n    className,\n    label,\n    helperText,\n    error,\n    autoResize,\n    minRows = 3,\n    maxRows = 12,\n    hideLabel,\n    id,\n    onChange,\n    value,\n    defaultValue,\n    'aria-describedby': ariaDescribedby,\n    'aria-invalid': ariaInvalid,\n    ...props\n  },\n  ref,\n) {\n  const isError = Boolean(error) || ariaInvalid === true || ariaInvalid === 'true';\n  const { fieldId, helperId, errorId, describedBy } = useFieldIds(id, {\n    hasHelper: Boolean(helperText),\n    hasError: Boolean(error),\n    extra: ariaDescribedby,\n  });\n  const innerRef = useRef<HTMLTextAreaElement | null>(null);\n\n  // Stash a ref locally and forward to the consumer.\n  const setRef = (node: HTMLTextAreaElement | null) => {\n    innerRef.current = node;\n    if (typeof ref === 'function') ref(node);\n    else if (ref) (ref as React.MutableRefObject<HTMLTextAreaElement | null>).current = node;\n  };\n\n  const recompute = useCallback(() => {\n    const el = innerRef.current;\n    if (!el || !autoResize) return;\n    const cs = getComputedStyle(el);\n    const lineHeight = parseFloat(cs.lineHeight) || 20;\n    // scrollHeight includes padding but not borders; the element is border-box.\n    const padding = (parseFloat(cs.paddingTop) || 0) + (parseFloat(cs.paddingBottom) || 0);\n    const border = (parseFloat(cs.borderTopWidth) || 0) + (parseFloat(cs.borderBottomWidth) || 0);\n    const minH = lineHeight * minRows + padding + border;\n    const maxH = lineHeight * maxRows + padding + border;\n    el.style.height = 'auto';\n    const content = el.scrollHeight + border;\n    el.style.height = `${Math.min(Math.max(content, minH), maxH)}px`;\n    el.style.overflowY = content > maxH ? 'auto' : 'hidden';\n  }, [autoResize, minRows, maxRows]);\n\n  useEffect(() => {\n    if (autoResize) recompute();\n  }, [autoResize, recompute, value, defaultValue]);\n\n  // Width changes re-wrap the text, so recompute on resize too.\n  useEffect(() => {\n    const el = innerRef.current;\n    if (!autoResize || !el || typeof ResizeObserver === 'undefined') return;\n    const ro = new ResizeObserver(() => recompute());\n    ro.observe(el);\n    return () => ro.disconnect();\n  }, [autoResize, recompute]);\n\n  return (\n    <div className={cn('flex flex-col gap-1.5', className)}>\n      {label && (\n        <label\n          htmlFor={fieldId}\n          className={cn('text-foreground text-sm font-medium', hideLabel && 'sr-only')}\n        >\n          {label}\n        </label>\n      )}\n      <textarea\n        ref={setRef}\n        id={fieldId}\n        rows={minRows}\n        value={value}\n        defaultValue={defaultValue}\n        onChange={(e) => {\n          onChange?.(e);\n          if (autoResize) recompute();\n        }}\n        aria-invalid={isError ? true : ariaInvalid}\n        aria-describedby={describedBy}\n        className={cn(\n          'bg-card text-foreground rounded-md border px-3 py-2 text-lg md:text-sm',\n          'placeholder:text-foreground-subtle',\n          'transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out)]',\n          'outline-none',\n          'focus-visible:ring-ring focus-visible:ring-2 focus-visible:ring-offset-2',\n          'focus-visible:ring-offset-background',\n          'disabled:cursor-not-allowed disabled:opacity-50',\n          'border-border-input focus-visible:border-accent',\n          'aria-invalid:border-danger aria-invalid:focus-visible:border-danger aria-invalid:focus-visible:ring-danger',\n          autoResize ? 'resize-none' : 'min-h-20 resize-y',\n        )}\n        {...props}\n      />\n      {error ? (\n        <p id={errorId} className=\"text-danger-text text-xs\">\n          {error}\n        </p>\n      ) : helperText ? (\n        <p id={helperId} className=\"text-foreground-subtle text-xs\">\n          {helperText}\n        </p>\n      ) : null}\n    </div>\n  );\n});\n\nTextarea.displayName = 'Textarea';\n"],"names":["Textarea","forwardRef","className","label","helperText","error","autoResize","minRows","maxRows","hideLabel","id","onChange","value","defaultValue","ariaDescribedby","ariaInvalid","props","ref","isError","fieldId","helperId","errorId","describedBy","useFieldIds","innerRef","useRef","setRef","node","recompute","useCallback","el","cs","lineHeight","padding","border","minH","maxH","content","useEffect","ro","cn","jsx"],"mappings":"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"}

package/dist-lib/components/ui/Timeline.js

@@ -1,52 +1,56 @@
 "use client";
-import { jsx as i, jsxs as s } from "react/jsx-runtime";
-import { forwardRef as a } from "react";
-import { cn as n } from "../../lib/utils.js";
-const d = a(function({ className: e, children: l, ...m }, r) {
-  return /* @__PURE__ */ i("ol", { ref: r, className: n("relative flex flex-col gap-6", e), ...m, children: l });
+import { jsx as t, jsxs as a } from "react/jsx-runtime";
+import { forwardRef as s } from "react";
+import { cn as l } from "../../lib/utils.js";
+const c = s(function({ className: i, children: r, ...n }, m) {
+  return /* @__PURE__ */ t("ol", { ref: m, className: l("relative flex flex-col gap-6", i), ...n, children: r });
 });
-d.displayName = "Timeline";
-const f = a(function({ bullet: e, isLast: l, className: m, children: r, ...o }, c) {
-  return /* @__PURE__ */ s("li", { ref: c, className: n("relative flex gap-4 pb-1", m), ...o, children: [
-    /* @__PURE__ */ s("div", { className: "relative flex shrink-0 flex-col items-center", children: [
-      /* @__PURE__ */ i("div", { className: "border-border bg-card text-foreground-muted flex size-6 items-center justify-center rounded-full border", children: e ?? /* @__PURE__ */ i("span", { className: "bg-accent size-2 rounded-full", "aria-hidden": !0 }) }),
-      !l && /* @__PURE__ */ i("span", { className: "bg-border mt-1 w-px flex-1", "aria-hidden": !0 })
+c.displayName = "Timeline";
+const u = s(function({ bullet: i, isLast: r, className: n, children: m, ...o }, d) {
+  return /* @__PURE__ */ a("li", { ref: d, className: l("relative flex gap-4 pb-1", n), ...o, children: [
+    /* @__PURE__ */ a("div", { className: "relative flex shrink-0 flex-col items-center", children: [
+      /* @__PURE__ */ t("div", { className: "border-border bg-card text-foreground-muted flex size-6 items-center justify-center rounded-full border", children: i ?? /* @__PURE__ */ t("span", { className: "bg-accent size-2 rounded-full", "aria-hidden": !0 }) }),
+      !r && /* @__PURE__ */ t("span", { className: "bg-border mt-1 w-px flex-1", "aria-hidden": !0 })
     ] }),
-    /* @__PURE__ */ i("div", { className: "min-w-0 flex-1 pb-4", children: r })
+    /* @__PURE__ */ t("div", { className: "min-w-0 flex-1 pb-4", children: m })
   ] });
 });
-f.displayName = "TimelineItem";
-function u({ className: t, children: e, dateTime: l, ...m }) {
-  return /* @__PURE__ */ i(
+u.displayName = "TimelineItem";
+function f(e) {
+  if (!(!e || Number.isNaN(Date.parse(e))))
+    return e;
+}
+function p({ className: e, children: i, dateTime: r, ...n }) {
+  return /* @__PURE__ */ t(
     "time",
     {
-      dateTime: l ?? (typeof e == "string" ? e : void 0),
-      className: n("text-foreground-subtle block text-xs", t),
-      ...m,
-      children: e
+      dateTime: f(r ?? (typeof i == "string" ? i : void 0)),
+      className: l("text-foreground-subtle block text-xs", e),
+      ...n,
+      children: i
     }
   );
 }
-u.displayName = "TimelineTime";
-function p({
-  className: t,
-  children: e
+p.displayName = "TimelineTime";
+function x({
+  className: e,
+  children: i
 }) {
-  return /* @__PURE__ */ i("p", { className: n("text-sm font-medium", t), children: e });
+  return /* @__PURE__ */ t("p", { className: l("text-sm font-medium", e), children: i });
 }
-p.displayName = "TimelineTitle";
-function x({
-  className: t,
-  children: e
+x.displayName = "TimelineTitle";
+function N({
+  className: e,
+  children: i
 }) {
-  return /* @__PURE__ */ i("p", { className: n("text-foreground-muted mt-0.5 text-sm", t), children: e });
+  return /* @__PURE__ */ t("p", { className: l("text-foreground-muted mt-0.5 text-sm", e), children: i });
 }
-x.displayName = "TimelineDescription";
+N.displayName = "TimelineDescription";
 export {
-  d as Timeline,
-  x as TimelineDescription,
-  f as TimelineItem,
-  u as TimelineTime,
-  p as TimelineTitle
+  c as Timeline,
+  N as TimelineDescription,
+  u as TimelineItem,
+  p as TimelineTime,
+  x as TimelineTitle
 };
 //# sourceMappingURL=Timeline.js.map

package/dist-lib/components/ui/Timeline.js.map

@@ -1 +1 @@
-{"version":3,"file":"Timeline.js","sources":["../../../src/components/ui/Timeline.tsx"],"sourcesContent":["'use client';\n\nimport { forwardRef, type HTMLAttributes, type ReactNode, type TimeHTMLAttributes } from 'react';\nimport { cn } from '@/lib/utils';\n\nexport type TimelineProps = HTMLAttributes<HTMLOListElement>;\n\nexport const Timeline = forwardRef<HTMLOListElement, TimelineProps>(function Timeline(\n  { className, children, ...props },\n  ref,\n) {\n  return (\n    <ol ref={ref} className={cn('relative flex flex-col gap-6', className)} {...props}>\n      {children}\n    </ol>\n  );\n});\nTimeline.displayName = 'Timeline';\n\nexport interface TimelineItemProps extends HTMLAttributes<HTMLLIElement> {\n  /** Optional bullet override. Default: small accent dot. */\n  bullet?: ReactNode;\n  /** Hide the connector line below this item — use for the last item. */\n  isLast?: boolean;\n}\n\nexport const TimelineItem = forwardRef<HTMLLIElement, TimelineItemProps>(function TimelineItem(\n  { bullet, isLast, className, children, ...props },\n  ref,\n) {\n  return (\n    <li ref={ref} className={cn('relative flex gap-4 pb-1', className)} {...props}>\n      <div className=\"relative flex shrink-0 flex-col items-center\">\n        <div className=\"border-border bg-card text-foreground-muted flex size-6 items-center justify-center rounded-full border\">\n          {bullet ?? <span className=\"bg-accent size-2 rounded-full\" aria-hidden />}\n        </div>\n        {!isLast && <span className=\"bg-border mt-1 w-px flex-1\" aria-hidden />}\n      </div>\n      <div className=\"min-w-0 flex-1 pb-4\">{children}</div>\n    </li>\n  );\n});\nTimelineItem.displayName = 'TimelineItem';\n\nexport interface TimelineTimeProps extends TimeHTMLAttributes<HTMLTimeElement> {\n  /** Machine-readable value (ISO 8601). Defaults to `children` when it is a string. */\n  dateTime?: string;\n  children: ReactNode;\n}\n\nexport function TimelineTime({ className, children, dateTime, ...props }: TimelineTimeProps) {\n  return (\n    <time\n      dateTime={dateTime ?? (typeof children === 'string' ? children : undefined)}\n      className={cn('text-foreground-subtle block text-xs', className)}\n      {...props}\n    >\n      {children}\n    </time>\n  );\n}\nTimelineTime.displayName = 'TimelineTime';\n\nexport function TimelineTitle({\n  className,\n  children,\n}: {\n  className?: string;\n  children: ReactNode;\n}) {\n  return <p className={cn('text-sm font-medium', className)}>{children}</p>;\n}\nTimelineTitle.displayName = 'TimelineTitle';\n\nexport function TimelineDescription({\n  className,\n  children,\n}: {\n  className?: string;\n  children: ReactNode;\n}) {\n  return <p className={cn('text-foreground-muted mt-0.5 text-sm', className)}>{children}</p>;\n}\nTimelineDescription.displayName = 'TimelineDescription';\n"],"names":["Timeline","forwardRef","className","children","props","ref","jsx","cn","TimelineItem","bullet","isLast","jsxs","TimelineTime","dateTime","TimelineTitle","TimelineDescription"],"mappings":";;;;AAOO,MAAMA,IAAWC,EAA4C,SAClE,EAAE,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAA,GAC1BC,GACA;AACA,SACE,gBAAAC,EAAC,MAAA,EAAG,KAAAD,GAAU,WAAWE,EAAG,gCAAgCL,CAAS,GAAI,GAAGE,GACzE,UAAAD,EAAA,CACH;AAEJ,CAAC;AACDH,EAAS,cAAc;AAShB,MAAMQ,IAAeP,EAA6C,SACvE,EAAE,QAAAQ,GAAQ,QAAAC,GAAQ,WAAAR,GAAW,UAAAC,GAAU,GAAGC,EAAA,GAC1CC,GACA;AACA,SACE,gBAAAM,EAAC,QAAG,KAAAN,GAAU,WAAWE,EAAG,4BAA4BL,CAAS,GAAI,GAAGE,GACtE,UAAA;AAAA,IAAA,gBAAAO,EAAC,OAAA,EAAI,WAAU,gDACb,UAAA;AAAA,MAAA,gBAAAL,EAAC,OAAA,EAAI,WAAU,2GACZ,UAAAG,KAAU,gBAAAH,EAAC,UAAK,WAAU,iCAAgC,eAAW,GAAA,CAAC,EAAA,CACzE;AAAA,MACC,CAACI,KAAU,gBAAAJ,EAAC,UAAK,WAAU,8BAA6B,eAAW,GAAA,CAAC;AAAA,IAAA,GACvE;AAAA,IACA,gBAAAA,EAAC,OAAA,EAAI,WAAU,uBAAuB,UAAAH,EAAA,CAAS;AAAA,EAAA,GACjD;AAEJ,CAAC;AACDK,EAAa,cAAc;AAQpB,SAASI,EAAa,EAAE,WAAAV,GAAW,UAAAC,GAAU,UAAAU,GAAU,GAAGT,KAA4B;AAC3F,SACE,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,UAAUO,MAAa,OAAOV,KAAa,WAAWA,IAAW;AAAA,MACjE,WAAWI,EAAG,wCAAwCL,CAAS;AAAA,MAC9D,GAAGE;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;AACAS,EAAa,cAAc;AAEpB,SAASE,EAAc;AAAA,EAC5B,WAAAZ;AAAA,EACA,UAAAC;AACF,GAGG;AACD,2BAAQ,KAAA,EAAE,WAAWI,EAAG,uBAAuBL,CAAS,GAAI,UAAAC,GAAS;AACvE;AACAW,EAAc,cAAc;AAErB,SAASC,EAAoB;AAAA,EAClC,WAAAb;AAAA,EACA,UAAAC;AACF,GAGG;AACD,2BAAQ,KAAA,EAAE,WAAWI,EAAG,wCAAwCL,CAAS,GAAI,UAAAC,GAAS;AACxF;AACAY,EAAoB,cAAc;"}
+{"version":3,"file":"Timeline.js","sources":["../../../src/components/ui/Timeline.tsx"],"sourcesContent":["'use client';\n\nimport { forwardRef, type HTMLAttributes, type ReactNode, type TimeHTMLAttributes } from 'react';\nimport { cn } from '@/lib/utils';\n\nexport type TimelineProps = HTMLAttributes<HTMLOListElement>;\n\nexport const Timeline = forwardRef<HTMLOListElement, TimelineProps>(function Timeline(\n  { className, children, ...props },\n  ref,\n) {\n  return (\n    <ol ref={ref} className={cn('relative flex flex-col gap-6', className)} {...props}>\n      {children}\n    </ol>\n  );\n});\nTimeline.displayName = 'Timeline';\n\nexport interface TimelineItemProps extends HTMLAttributes<HTMLLIElement> {\n  /** Optional bullet override. Default: small accent dot. */\n  bullet?: ReactNode;\n  /** Hide the connector line below this item — use for the last item. */\n  isLast?: boolean;\n}\n\nexport const TimelineItem = forwardRef<HTMLLIElement, TimelineItemProps>(function TimelineItem(\n  { bullet, isLast, className, children, ...props },\n  ref,\n) {\n  return (\n    <li ref={ref} className={cn('relative flex gap-4 pb-1', className)} {...props}>\n      <div className=\"relative flex shrink-0 flex-col items-center\">\n        <div className=\"border-border bg-card text-foreground-muted flex size-6 items-center justify-center rounded-full border\">\n          {bullet ?? <span className=\"bg-accent size-2 rounded-full\" aria-hidden />}\n        </div>\n        {!isLast && <span className=\"bg-border mt-1 w-px flex-1\" aria-hidden />}\n      </div>\n      <div className=\"min-w-0 flex-1 pb-4\">{children}</div>\n    </li>\n  );\n});\nTimelineItem.displayName = 'TimelineItem';\n\nexport interface TimelineTimeProps extends TimeHTMLAttributes<HTMLTimeElement> {\n  /** Machine-readable value (ISO 8601). Defaults to `children` when it is a string. */\n  dateTime?: string;\n  children: ReactNode;\n}\n\n/** Accept only values `Date` can parse — an invalid `dateTime` is worse than none. */\nfunction validDateTime(v: string | undefined): string | undefined {\n  if (!v || Number.isNaN(Date.parse(v))) return undefined;\n  return v;\n}\n\nexport function TimelineTime({ className, children, dateTime, ...props }: TimelineTimeProps) {\n  return (\n    <time\n      dateTime={validDateTime(dateTime ?? (typeof children === 'string' ? children : undefined))}\n      className={cn('text-foreground-subtle block text-xs', className)}\n      {...props}\n    >\n      {children}\n    </time>\n  );\n}\nTimelineTime.displayName = 'TimelineTime';\n\nexport function TimelineTitle({\n  className,\n  children,\n}: {\n  className?: string;\n  children: ReactNode;\n}) {\n  return <p className={cn('text-sm font-medium', className)}>{children}</p>;\n}\nTimelineTitle.displayName = 'TimelineTitle';\n\nexport function TimelineDescription({\n  className,\n  children,\n}: {\n  className?: string;\n  children: ReactNode;\n}) {\n  return <p className={cn('text-foreground-muted mt-0.5 text-sm', className)}>{children}</p>;\n}\nTimelineDescription.displayName = 'TimelineDescription';\n"],"names":["Timeline","forwardRef","className","children","props","ref","jsx","cn","TimelineItem","bullet","isLast","jsxs","validDateTime","v","TimelineTime","dateTime","TimelineTitle","TimelineDescription"],"mappings":";;;;AAOO,MAAMA,IAAWC,EAA4C,SAClE,EAAE,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAA,GAC1BC,GACA;AACA,SACE,gBAAAC,EAAC,MAAA,EAAG,KAAAD,GAAU,WAAWE,EAAG,gCAAgCL,CAAS,GAAI,GAAGE,GACzE,UAAAD,EAAA,CACH;AAEJ,CAAC;AACDH,EAAS,cAAc;AAShB,MAAMQ,IAAeP,EAA6C,SACvE,EAAE,QAAAQ,GAAQ,QAAAC,GAAQ,WAAAR,GAAW,UAAAC,GAAU,GAAGC,EAAA,GAC1CC,GACA;AACA,SACE,gBAAAM,EAAC,QAAG,KAAAN,GAAU,WAAWE,EAAG,4BAA4BL,CAAS,GAAI,GAAGE,GACtE,UAAA;AAAA,IAAA,gBAAAO,EAAC,OAAA,EAAI,WAAU,gDACb,UAAA;AAAA,MAAA,gBAAAL,EAAC,OAAA,EAAI,WAAU,2GACZ,UAAAG,KAAU,gBAAAH,EAAC,UAAK,WAAU,iCAAgC,eAAW,GAAA,CAAC,EAAA,CACzE;AAAA,MACC,CAACI,KAAU,gBAAAJ,EAAC,UAAK,WAAU,8BAA6B,eAAW,GAAA,CAAC;AAAA,IAAA,GACvE;AAAA,IACA,gBAAAA,EAAC,OAAA,EAAI,WAAU,uBAAuB,UAAAH,EAAA,CAAS;AAAA,EAAA,GACjD;AAEJ,CAAC;AACDK,EAAa,cAAc;AAS3B,SAASI,EAAcC,GAA2C;AAChE,MAAI,GAACA,KAAK,OAAO,MAAM,KAAK,MAAMA,CAAC,CAAC;AACpC,WAAOA;AACT;AAEO,SAASC,EAAa,EAAE,WAAAZ,GAAW,UAAAC,GAAU,UAAAY,GAAU,GAAGX,KAA4B;AAC3F,SACE,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,UAAUM,EAAcG,MAAa,OAAOZ,KAAa,WAAWA,IAAW,OAAU;AAAA,MACzF,WAAWI,EAAG,wCAAwCL,CAAS;AAAA,MAC9D,GAAGE;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;AACAW,EAAa,cAAc;AAEpB,SAASE,EAAc;AAAA,EAC5B,WAAAd;AAAA,EACA,UAAAC;AACF,GAGG;AACD,2BAAQ,KAAA,EAAE,WAAWI,EAAG,uBAAuBL,CAAS,GAAI,UAAAC,GAAS;AACvE;AACAa,EAAc,cAAc;AAErB,SAASC,EAAoB;AAAA,EAClC,WAAAf;AAAA,EACA,UAAAC;AACF,GAGG;AACD,2BAAQ,KAAA,EAAE,WAAWI,EAAG,wCAAwCL,CAAS,GAAI,UAAAC,GAAS;AACxF;AACAc,EAAoB,cAAc;"}