@alfadocs/ui-kit 0.1.10 → 0.2.0

package/dist/_chunks/accordion-DOmxGEWU.js

@@ -0,0 +1,228 @@
+import { jsx as d, jsxs as D } from "react/jsx-runtime";
+import { forwardRef as g, useContext as E, useRef as b, useState as S, useEffect as H, useCallback as M, useMemo as q, createContext as B } from "react";
+import * as u from "@radix-ui/react-accordion";
+import { c as m } from "./index-D2ZczOXr.js";
+import { u as F } from "./use-direction-D6rvvG9G.js";
+import { c as G } from "./compose-refs-C0k0tdqF.js";
+import { C as J } from "./chevron-down-BX_NP2Yh.js";
+import { u as K } from "./registry-C9nwlNyL.js";
+const L = {
+  id: "accordion",
+  capabilities: ["expand", "select_single", "select_multiple"],
+  state: {
+    openItems: {
+      type: "string[]",
+      description: "Ids (values) of currently-expanded items. Single-mode accordions return an array with 0 or 1 entries.",
+      read: (a) => a.getOpenItems()
+    }
+  },
+  actions: {
+    expand: {
+      safety: "read",
+      argsType: "{ itemId: string }",
+      description: "Expand the item with the given value.",
+      invoke: (a, t) => {
+        a.expand(t.itemId);
+      }
+    },
+    collapse: {
+      safety: "read",
+      argsType: "{ itemId: string }",
+      description: "Collapse the item with the given value.",
+      invoke: (a, t) => {
+        a.collapse(t.itemId);
+      }
+    },
+    clear: {
+      safety: "read",
+      description: "Collapse all items. Only meaningful for multi-mode accordions; single-mode equivalent to collapsing the active item.",
+      invoke: (a) => {
+        a.clear();
+      }
+    }
+  },
+  domHooks: {
+    root: { attr: "data-component", value: "accordion" },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop."
+    },
+    item: {
+      attr: "data-item-id",
+      description: "Each Accordion.Item emits its value as data-item-id."
+    }
+  }
+}, x = B({
+  variant: "default"
+}), Q = m("", {
+  variants: {
+    variant: {
+      default: "ds:divide-y ds:divide-border",
+      card: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]",
+      separated: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]"
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+}), U = m("", {
+  variants: {
+    variant: {
+      default: "",
+      card: "ds:bg-[var(--card)] ds:border ds:border-[var(--card-border,var(--border))] ds:rounded-[var(--radius-lg)] ds:overflow-hidden",
+      separated: "ds:border ds:border-border ds:rounded-[var(--radius-md)] ds:overflow-hidden"
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+}), W = m(
+  [
+    "ds:overflow-hidden",
+    "ds:data-[state=open]:animate-[accordion-down_calc(var(--animation-duration)*1.5)_var(--ease-out)]",
+    "ds:data-[state=closed]:animate-[accordion-up_calc(var(--animation-duration)*1.5)_var(--ease-in)]"
+  ].join(" ")
+), X = m(
+  "ds:ms-auto ds:size-4 ds:shrink-0 ds:transition-transform ds:duration-[calc(var(--animation-duration)*1.5)] ds:ease-[var(--ease-out)] ds:motion-reduce:transition-none ds:group-data-[state=open]:rotate-180"
+), Y = m(
+  [
+    "ds:group ds:flex ds:w-full ds:items-center ds:[min-block-size:var(--min-target-size)]",
+    "ds:py-[var(--spacing-md)] ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
+    "ds:text-start ds:font-medium ds:hover:underline",
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+    "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+    "ds:disabled:cursor-not-allowed ds:disabled:opacity-50",
+    "ds:transition-all ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none"
+  ].join(" ")
+), V = g(
+  ({ variant: a = "default", className: t, children: n, id: r, ...p }, h) => {
+    const v = b(null), N = G(h, v), R = F(v), c = p, A = p.type === "multiple", y = c.value !== void 0, [_, T] = S(
+      () => {
+        const e = c.defaultValue;
+        return e !== void 0 ? e : A ? [] : "";
+      }
+    ), k = c.value, i = y ? k : _, l = b(i);
+    H(() => {
+      l.current = i;
+    }, [i]);
+    const f = c.onValueChange, o = M(
+      (e) => {
+        y || T(e), f == null || f(e);
+      },
+      [y, f]
+    ), j = q(
+      () => ({
+        getOpenItems: () => {
+          const e = l.current;
+          return Array.isArray(e) ? [...e] : e ? [e] : [];
+        },
+        expand: (e) => {
+          const s = l.current;
+          if (Array.isArray(s)) {
+            if (s.includes(e)) return;
+            o([...s, e]);
+          } else {
+            if (s === e) return;
+            o(e);
+          }
+        },
+        collapse: (e) => {
+          const s = l.current;
+          if (Array.isArray(s)) {
+            if (!s.includes(e)) return;
+            o(s.filter((z) => z !== e));
+          } else s === e && o("");
+        },
+        clear: () => {
+          const e = l.current;
+          Array.isArray(e) ? o([]) : o("");
+        }
+      }),
+      [o]
+    );
+    K(L, j, r);
+    const O = A ? {
+      value: Array.isArray(i) ? i : [],
+      onValueChange: (e) => o(e)
+    } : {
+      value: typeof i == "string" ? i : "",
+      onValueChange: (e) => o(e)
+    }, {
+      value: $,
+      defaultValue: ee,
+      onValueChange: ae,
+      ...P
+    } = c;
+    return /* @__PURE__ */ d(x.Provider, { value: { variant: a ?? "default" }, children: /* @__PURE__ */ d(
+      u.Root,
+      {
+        ref: N,
+        dir: R,
+        id: r,
+        "data-component": "accordion",
+        "data-component-id": r,
+        className: Q({ variant: a, className: t }),
+        ...P,
+        ...O,
+        children: n
+      }
+    ) });
+  }
+);
+V.displayName = "Accordion";
+const C = g(
+  ({ variant: a, className: t, children: n, ...r }, p) => {
+    const { variant: h } = E(x), v = a ?? h;
+    return /* @__PURE__ */ d(
+      u.Item,
+      {
+        ref: p,
+        className: U({ variant: v, className: t }),
+        ...r,
+        children: n
+      }
+    );
+  }
+);
+C.displayName = "AccordionItem";
+const w = g(
+  ({ className: a, children: t, ...n }, r) => /* @__PURE__ */ d(u.Header, { className: "ds:flex", children: /* @__PURE__ */ D(
+    u.Trigger,
+    {
+      ref: r,
+      className: Y({ className: a }),
+      ...n,
+      children: [
+        t,
+        /* @__PURE__ */ d(J, { "aria-hidden": "true", className: X() })
+      ]
+    }
+  ) })
+);
+w.displayName = "AccordionTrigger";
+const I = g(
+  ({ className: a, children: t, ...n }, r) => /* @__PURE__ */ d(
+    u.Content,
+    {
+      ref: r,
+      className: W({ className: a }),
+      ...n,
+      children: /* @__PURE__ */ d("div", { className: "ds:pb-[var(--spacing-md)] ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]", children: t })
+    }
+  )
+);
+I.displayName = "AccordionContent";
+const ce = Object.assign(V, {
+  Item: C,
+  Trigger: w,
+  Content: I
+});
+export {
+  ce as A,
+  I as a,
+  C as b,
+  w as c,
+  L as d
+};
+//# sourceMappingURL=accordion-DOmxGEWU.js.map

package/dist/_chunks/{agenda-card-DwLIxgi7.js → agenda-card-CalZqycc.js}

@@ -3,7 +3,7 @@ import { forwardRef as v } from "react";
 import { c as h } from "./index-D2ZczOXr.js";
 import { useTranslation as b } from "react-i18next";
 import { A as x } from "./avatar-Dcr6XuDQ.js";
-import { B as y } from "./badge-mrstWxve.js";
+import { B as y } from "./badge-DKFbntoa.js";
 import { C as N } from "./chevron-right-BrpYejk0.js";
 const C = h(
   [
@@ -111,7 +111,16 @@ const k = {
             t,
             s.treatment ? /* @__PURE__ */ e("span", { className: "type-eyebrow ds:text-[color:var(--muted-foreground)] ds:truncate", children: s.treatment }) : null
           ] }),
-          s.status && s.status !== "confirmed" ? /* @__PURE__ */ e(y, { variant: k[s.status], size: "sm", withDot: !0, className: "ds:shrink-0", children: i(`ui.agendaCard.status.${s.status}`, s.status) }) : null,
+          s.status && s.status !== "confirmed" ? /* @__PURE__ */ e(
+            y,
+            {
+              variant: k[s.status],
+              size: "sm",
+              withDot: !0,
+              className: "ds:shrink-0",
+              children: i(`ui.agendaCard.status.${s.status}`, s.status)
+            }
+          ) : null,
           r ? /* @__PURE__ */ e(
             N,
             {
@@ -129,4 +138,4 @@ export {
   T as A,
   w as i
 };
-//# sourceMappingURL=agenda-card-DwLIxgi7.js.map
+//# sourceMappingURL=agenda-card-CalZqycc.js.map

package/dist/_chunks/{agenda-tray-DUvengGQ.js → agenda-tray-3ffFDQZC.js}

@@ -1,21 +1,21 @@
 import { jsx as a, jsxs as n } from "react/jsx-runtime";
-import { forwardRef as M, useRef as A, useMemo as z, useImperativeHandle as C } from "react";
-import { c as R } from "./index-D2ZczOXr.js";
-import { useTranslation as S } from "react-i18next";
-import { I as j } from "./icon-button-Wnnde5lc.js";
-import { S as _ } from "./skeleton-dtqyF09N.js";
-import { E } from "./empty-state-DQPtRp2b.js";
-import { A as P } from "./agenda-card-DwLIxgi7.js";
-import { u as H } from "./registry-C9nwlNyL.js";
-import { c as K } from "./createLucideIcon-CrFbzy84.js";
-import { P as L } from "./plus-CYKNmfuA.js";
+import { forwardRef as R, useRef as u, useImperativeHandle as z, useMemo as C } from "react";
+import { c as S } from "./index-D2ZczOXr.js";
+import { useTranslation as j } from "react-i18next";
+import { I as _ } from "./icon-button-C4CGcYuz.js";
+import { S as E } from "./skeleton-CZbwyJAA.js";
+import { E as P } from "./empty-state-3CLJIXSj.js";
+import { A as H } from "./agenda-card-CalZqycc.js";
+import { u as K } from "./registry-C9nwlNyL.js";
+import { c as L } from "./createLucideIcon-CrFbzy84.js";
+import { P as V } from "./plus-CYKNmfuA.js";
 /**
  * @license lucide-react v1.8.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const V = [
+const q = [
   ["path", { d: "M8 2v4", key: "1cmpym" }],
   ["path", { d: "M16 2v4", key: "4m81vk" }],
   ["rect", { width: "18", height: "18", x: "3", y: "4", rx: "2", key: "1hopcy" }],
@@ -26,7 +26,7 @@ const V = [
   ["path", { d: "M8 18h.01", key: "lrp35t" }],
   ["path", { d: "M12 18h.01", key: "mhygvu" }],
   ["path", { d: "M16 18h.01", key: "kzsmim" }]
-], q = K("calendar-days", V), B = {
+], B = L("calendar-days", q), D = {
   id: "agenda-tray",
   capabilities: ["select_single"],
   state: {
@@ -64,7 +64,7 @@ const V = [
       description: "Stable appointment id emitted on each rendered AgendaCard inside the tray."
     }
   }
-}, D = R(
+}, F = S(
   [
     "ds:flex ds:flex-col",
     "ds:rounded-[var(--radius-md)] ds:shadow-[var(--shadow-card)]",
@@ -82,85 +82,88 @@ const V = [
       size: "sm"
     }
   }
-), F = M(
+), G = R(
   ({
     id: t,
     items: s,
-    title: u,
-    caption: l,
-    size: m = "sm",
+    title: f,
+    caption: c,
+    size: l = "sm",
     onOpenAppointment: d,
-    onAddAppointment: p,
-    addLabel: f,
-    loading: y = !1,
-    emptyTitle: v,
-    emptyDescription: x,
-    className: k,
-    ...T
-  }, w) => {
-    const { t: r } = S(), g = u ?? r("ui.agendaTray.title", "Today's appointments"), N = f ?? r("ui.agendaTray.add", "Add appointment"), b = !y && s.length === 0;
+    onAddAppointment: m,
+    addLabel: v,
+    loading: p = !1,
+    emptyTitle: x,
+    emptyDescription: k,
+    className: T,
+    ...w
+  }, N) => {
+    const { t: r } = j(), y = f ?? r("ui.agendaTray.title", "Today's appointments"), b = v ?? r("ui.agendaTray.add", "Add appointment"), I = !p && s.length === 0;
     let i;
-    y ? i = /* @__PURE__ */ a("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)] ds:p-[var(--spacing-sm)]", children: [0, 1, 2].map((e) => /* @__PURE__ */ a(_, { variant: "rectangular", height: "2.5rem" }, e)) }) : b ? i = /* @__PURE__ */ a("div", { className: "ds:p-[var(--spacing-md)]", children: /* @__PURE__ */ a(
-      E,
+    p ? i = /* @__PURE__ */ a("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)] ds:p-[var(--spacing-sm)]", children: [0, 1, 2].map((e) => /* @__PURE__ */ a(E, { variant: "rectangular", height: "2.5rem" }, e)) }) : I ? i = /* @__PURE__ */ a("div", { className: "ds:p-[var(--spacing-md)]", children: /* @__PURE__ */ a(
+      P,
       {
         variant: "first-use",
         size: "sm",
-        title: v ?? r("ui.agendaTray.empty.title", "No appointments"),
-        description: x ?? r(
+        title: x ?? r("ui.agendaTray.empty.title", "No appointments"),
+        description: k ?? r(
           "ui.agendaTray.empty.description",
           "New appointments will appear here."
         )
       }
     ) }) : i = /* @__PURE__ */ a("ul", { className: "ds:flex ds:list-none ds:flex-col", children: s.map((e) => /* @__PURE__ */ a(
-      P,
+      H,
       {
         item: e,
-        size: m,
+        size: l,
         onActivate: d,
         "data-appointment-id": e.id
       },
       e.id
     )) });
-    const o = A(s);
+    const o = u(s);
     o.current = s;
-    const c = z(
+    const g = u(null);
+    z(N, () => g.current, []);
+    const M = C(
       () => ({
         getItems: () => o.current.map((e) => ({
           id: e.id,
           status: e.status ?? "confirmed"
         })),
         selectItem: (e) => {
-          const h = o.current.find((I) => I.id === e);
+          const h = o.current.find((A) => A.id === e);
           h && (d == null || d(h));
         }
       }),
       [d]
     );
-    return C(w, () => c, [c]), H(B, c, t), /* @__PURE__ */ n(
+    return K(D, M, t), /* @__PURE__ */ n(
       "section",
       {
-        "aria-label": g,
+        ref: g,
+        "aria-label": y,
         "data-component": "agenda-tray",
         "data-component-id": t,
-        className: D({ size: m, className: k }),
-        ...T,
+        className: F({ size: l, className: T }),
+        ...w,
         children: [
           /* @__PURE__ */ n("header", { className: "ds:flex ds:items-center ds:justify-between ds:gap-[var(--spacing-sm)] ds:p-[var(--spacing-sm)]", children: [
             /* @__PURE__ */ n("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-2xs)] ds:min-w-0", children: [
               /* @__PURE__ */ n("h3", { className: "ds:m-0 ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)] type-title-card", children: [
-                /* @__PURE__ */ a(q, { "aria-hidden": "true", className: "ds:size-4" }),
-                g
+                /* @__PURE__ */ a(B, { "aria-hidden": "true", className: "ds:size-4" }),
+                y
               ] }),
-              l ? /* @__PURE__ */ a("span", { className: "type-eyebrow ds:text-[color:var(--muted-foreground)]", children: l }) : null
+              c ? /* @__PURE__ */ a("span", { className: "type-eyebrow ds:text-[color:var(--muted-foreground)]", children: c }) : null
             ] }),
-            p ? /* @__PURE__ */ a(
-              j,
+            m ? /* @__PURE__ */ a(
+              _,
               {
-                icon: /* @__PURE__ */ a(L, {}),
+                icon: /* @__PURE__ */ a(V, {}),
                 intent: "outline",
                 size: "sm",
-                "aria-label": N,
-                onClick: p
+                "aria-label": b,
+                onClick: m
               }
             ) : null
           ] }),
@@ -170,9 +173,9 @@ const V = [
     );
   }
 );
-F.displayName = "AgendaTray";
+G.displayName = "AgendaTray";
 export {
-  F as A,
-  B as a
+  G as A,
+  D as a
 };
-//# sourceMappingURL=agenda-tray-DUvengGQ.js.map
+//# sourceMappingURL=agenda-tray-3ffFDQZC.js.map