@alfadocs/ui-kit 0.70.0 → 0.71.0

package/dist/_chunks/radiograph-panel.agent-CAX-C3g3.js

@@ -1,558 +0,0 @@
-import { c as E } from "./createLucideIcon-CrFbzy84.js";
-import { jsxs as c, jsx as e, Fragment as Q } from "react/jsx-runtime";
-import { forwardRef as W, useState as h, useRef as X, useImperativeHandle as ee, useMemo as ae, useCallback as U, useEffect as re } from "react";
-import { useTranslation as M } from "react-i18next";
-import { D as y } from "./dialog-ZNuboNmy.js";
-import { B as R } from "./button-DD_0Xdmr.js";
-import { I as v } from "./icon-button-LqoiKcUN.js";
-import { B as L } from "./badge-DCOqV9mI.js";
-import { F as V } from "./form-field-BOm9hK35.js";
-import { T as ie } from "./text-area-Bt3p7Pt0.js";
-import { F as de, U as oe } from "./file-upload-DwZcAK8D.js";
-import { D as se } from "./date-picker-Dl9RKxaV.js";
-import { D as te } from "./date-range-picker-CTUeR6Bj.js";
-import { E as _ } from "./empty-state-BLy7tigq.js";
-import { E as ne } from "./eye-LHlSU38h.js";
-import { T as le } from "./trash-2-rPAKaRgB.js";
-import { C as ce } from "./chevron-left-CX1jqD2M.js";
-import { C as pe } from "./chevron-right-BrpYejk0.js";
-import { Z as me, a as ue } from "./zoom-out-CgVtf2Wx.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 he = [
-  ["circle", { cx: "5", cy: "6", r: "3", key: "1qnov2" }],
-  ["path", { d: "M12 6h5a2 2 0 0 1 2 2v7", key: "1yj91y" }],
-  ["path", { d: "m15 9-3-3 3-3", key: "1lwv8l" }],
-  ["circle", { cx: "19", cy: "18", r: "3", key: "1qljk2" }],
-  ["path", { d: "M12 18H7a2 2 0 0 1-2-2V9", key: "16sdep" }],
-  ["path", { d: "m9 15 3 3-3 3", key: "1m3kbl" }]
-], A = E("git-compare-arrows", he);
-/**
- * @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 ge = [
-  ["path", { d: "M12 12h.01", key: "1mp3jc" }],
-  [
-    "path",
-    {
-      d: "M14 15.4641a4 4 0 0 1-4 0L7.52786 19.74597 A 1 1 0 0 0 7.99303 21.16211 10 10 0 0 0 16.00697 21.16211 1 1 0 0 0 16.47214 19.74597z",
-      key: "1y4lzb"
-    }
-  ],
-  [
-    "path",
-    {
-      d: "M16 12a4 4 0 0 0-2-3.464l2.472-4.282a1 1 0 0 1 1.46-.305 10 10 0 0 1 4.006 6.94A1 1 0 0 1 21 12z",
-      key: "163ggk"
-    }
-  ],
-  [
-    "path",
-    {
-      d: "M8 12a4 4 0 0 1 2-3.464L7.528 4.254a1 1 0 0 0-1.46-.305 10 10 0 0 0-4.006 6.94A1 1 0 0 0 3 12z",
-      key: "1l9i0b"
-    }
-  ]
-], Ae = E("radiation", ge), T = ["ds:scale-100", "ds:scale-150", "ds:scale-200"];
-function fe(a, i) {
-  return [...a].sort((d, p) => d.date === p.date ? 0 : d.date ? p.date ? (d.date < p.date ? -1 : 1) * (i ? -1 : 1) : -1 : 1);
-}
-function ve(a, i) {
-  if (!a.date) return !i.from && !i.to;
-  const d = /* @__PURE__ */ new Date(`${a.date}T00:00:00`);
-  return !(i.from && d < i.from || i.to && d > i.to);
-}
-function xe(a) {
-  const i = (d) => String(d).padStart(2, "0");
-  return `${a.getFullYear()}-${i(a.getMonth() + 1)}-${i(a.getDate())}`;
-}
-function ye({ kind: a }) {
-  const { t: i } = M(), d = i(`radiographPanel.kind.${a}`, {
-    defaultValue: {
-      periapical: "Periapical",
-      bitewing: "Bitewing",
-      panoramic: "Panoramic",
-      other: "Other"
-    }[a]
-  });
-  return /* @__PURE__ */ e(L, { variant: "neutral", size: "sm", children: d });
-}
-function be({
-  state: a,
-  toothLabel: i,
-  onClose: d,
-  onIndexChange: p
-}) {
-  const { t: n } = M(), [m, g] = h(0);
-  re(() => {
-    g(0);
-  }, [a == null ? void 0 : a.index, a == null ? void 0 : a.compare]);
-  const f = (a == null ? void 0 : a.films) ?? [], t = a ? f[a.index] : void 0;
-  return /* @__PURE__ */ e(
-    y.Root,
-    {
-      open: a !== null,
-      onOpenChange: (l) => {
-        l || (g(0), d());
-      },
-      children: /* @__PURE__ */ c(y.Content, { size: "fullscreen", "aria-describedby": void 0, children: [
-        /* @__PURE__ */ e(y.Header, { children: /* @__PURE__ */ e(y.Title, { children: a != null && a.compare ? n("radiographPanel.viewer.compareTitle", {
-          defaultValue: "{{tooth}} — comparison",
-          tooth: i
-        }) : n("radiographPanel.viewer.title", {
-          defaultValue: "{{tooth}} — radiograph",
-          tooth: i
-        }) }) }),
-        /* @__PURE__ */ e(y.Body, { children: a != null && a.compare ? /* @__PURE__ */ e("div", { className: "ds:grid ds:grid-cols-2 ds:gap-[var(--spacing-md)]", children: f.slice(0, 2).map((l) => /* @__PURE__ */ c(
-          "figure",
-          {
-            className: "ds:flex ds:flex-col ds:items-center ds:gap-[var(--spacing-xs)]",
-            children: [
-              /* @__PURE__ */ e("div", { className: "ds:flex ds:items-center ds:justify-center ds:overflow-hidden ds:rounded-[var(--radius-md)] ds:bg-[var(--muted)] ds:p-[var(--spacing-xs)]", children: /* @__PURE__ */ e(
-                "img",
-                {
-                  src: l.thumbnailUrl ?? l.url,
-                  alt: l.alt ?? i,
-                  className: "ds:max-h-full ds:max-w-full ds:object-contain"
-                }
-              ) }),
-              /* @__PURE__ */ e("figcaption", { className: "type-meta ds:text-[color:var(--muted-foreground)]", children: l.date })
-            ]
-          },
-          l.id
-        )) }) : /* @__PURE__ */ c("div", { className: "ds:flex ds:flex-col ds:items-center ds:gap-[var(--spacing-sm)]", children: [
-          /* @__PURE__ */ e("div", { className: "ds:flex ds:max-h-full ds:items-center ds:justify-center ds:overflow-hidden ds:rounded-[var(--radius-md)] ds:bg-[var(--muted)] ds:p-[var(--spacing-sm)]", children: /* @__PURE__ */ e(
-            "img",
-            {
-              src: (t == null ? void 0 : t.thumbnailUrl) ?? (t == null ? void 0 : t.url),
-              alt: (t == null ? void 0 : t.alt) ?? i,
-              className: [
-                "ds:max-h-full ds:max-w-full ds:object-contain",
-                "ds:origin-center ds:transition-transform ds:motion-reduce:transition-none",
-                T[m]
-              ].join(" ")
-            }
-          ) }),
-          /* @__PURE__ */ c("div", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-sm)]", children: [
-            /* @__PURE__ */ e(
-              v,
-              {
-                icon: /* @__PURE__ */ e(ce, { "aria-hidden": "true" }),
-                "aria-label": n("radiographPanel.viewer.prev", {
-                  defaultValue: "Previous radiograph"
-                }),
-                size: "sm",
-                flipIconInRtl: !0,
-                disabled: !a || a.index === 0,
-                onClick: () => a && p(Math.max(0, a.index - 1))
-              }
-            ),
-            /* @__PURE__ */ e(
-              "span",
-              {
-                "aria-live": "polite",
-                className: "type-meta ds:text-[color:var(--muted-foreground)]",
-                children: n("radiographPanel.viewer.position", {
-                  defaultValue: "{{current}} / {{total}}",
-                  current: ((a == null ? void 0 : a.index) ?? 0) + 1,
-                  total: f.length
-                })
-              }
-            ),
-            /* @__PURE__ */ e(
-              v,
-              {
-                icon: /* @__PURE__ */ e(pe, { "aria-hidden": "true" }),
-                "aria-label": n("radiographPanel.viewer.next", {
-                  defaultValue: "Next radiograph"
-                }),
-                size: "sm",
-                flipIconInRtl: !0,
-                disabled: !a || a.index >= f.length - 1,
-                onClick: () => a && p(Math.min(f.length - 1, a.index + 1))
-              }
-            ),
-            /* @__PURE__ */ e(
-              "span",
-              {
-                "aria-hidden": "true",
-                className: "ds:ms-[var(--spacing-xs)] ds:me-[var(--spacing-xs)] ds:h-[var(--spacing-md)] ds:w-px ds:bg-[var(--border)]"
-              }
-            ),
-            /* @__PURE__ */ e(
-              v,
-              {
-                icon: /* @__PURE__ */ e(me, { "aria-hidden": "true" }),
-                "aria-label": n("radiographPanel.viewer.zoomOut", {
-                  defaultValue: "Zoom out"
-                }),
-                size: "sm",
-                disabled: m === 0,
-                onClick: () => g((l) => Math.max(0, l - 1))
-              }
-            ),
-            /* @__PURE__ */ e(
-              v,
-              {
-                icon: /* @__PURE__ */ e(ue, { "aria-hidden": "true" }),
-                "aria-label": n("radiographPanel.viewer.zoomIn", {
-                  defaultValue: "Zoom in"
-                }),
-                size: "sm",
-                disabled: m === T.length - 1,
-                onClick: () => g((l) => Math.min(T.length - 1, l + 1))
-              }
-            )
-          ] }),
-          t != null && t.note ? /* @__PURE__ */ e("p", { className: "type-body-sm ds:text-[color:var(--muted-foreground)]", children: t.note }) : null
-        ] }) })
-      ] })
-    }
-  );
-}
-const Ee = W(function({
-  id: i,
-  toothId: d,
-  toothLabel: p,
-  radiographs: n = [],
-  onAddRadiograph: m,
-  onDeleteRadiograph: g,
-  title: f,
-  "aria-label": t,
-  className: l,
-  ...Z
-}, $) {
-  const { t: o } = M(), [q, x] = h(null), [N, H] = h([]), [C, K] = h(!0), [z, G] = h({}), [b, S] = h(null), [w, I] = h(void 0), [j, B] = h(""), P = X(n);
-  P.current = n, ee(
-    $,
-    () => ({
-      getRadiographs: () => P.current,
-      openViewer: (r) => {
-        const s = P.current.findIndex((u) => u.id === r);
-        s >= 0 && x({ films: P.current, index: s, compare: !1 });
-      },
-      closeViewer: () => x(null)
-    }),
-    []
-  );
-  const F = f ?? o("radiographPanel.title", { defaultValue: "Imaging" }), O = p ?? (d ? o("radiographPanel.toothLabel", {
-    defaultValue: "Tooth {{id}}",
-    id: d
-  }) : ""), D = ae(
-    () => fe(
-      n.filter((r) => ve(r, z)),
-      C
-    ),
-    [n, z, C]
-  ), Y = U((r) => {
-    H(
-      (s) => s.includes(r) ? s.filter((u) => u !== r) : [...s, r].slice(-2)
-    );
-  }, []), J = U(() => {
-    !b || !m || (m({
-      fileName: b,
-      date: w ? xe(w) : void 0,
-      note: j || void 0
-    }), S(null), B(""), I(void 0));
-  }, [b, w, j, m]);
-  return /* @__PURE__ */ c(
-    "section",
-    {
-      "data-component": "radiograph-panel",
-      "data-component-id": i,
-      "data-tooth": d ?? void 0,
-      "aria-label": t ?? F,
-      className: [
-        "ds:flex ds:flex-col ds:gap-[var(--spacing-md)] ds:p-[var(--spacing-md)]",
-        l
-      ].filter(Boolean).join(" "),
-      ...Z,
-      children: [
-        /* @__PURE__ */ c("header", { className: "ds:sticky ds:top-0 ds:z-[1] ds:bg-[color:var(--background)] ds:py-[var(--spacing-2xs)] ds:flex ds:items-center ds:gap-[var(--spacing-sm)]", children: [
-          /* @__PURE__ */ e("h2", { className: "ds:m-0 type-title-card ds:text-[color:var(--foreground)]", children: d ? O : F }),
-          d ? /* @__PURE__ */ e(L, { variant: "info", size: "sm", children: n.length }) : null
-        ] }),
-        d ? /* @__PURE__ */ c(Q, { children: [
-          m ? /* @__PURE__ */ c("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]", children: [
-            /* @__PURE__ */ e(
-              V,
-              {
-                label: o("radiographPanel.upload.file", {
-                  defaultValue: "Image file"
-                }),
-                children: /* @__PURE__ */ e(
-                  de,
-                  {
-                    accept: { "image/*": [".png", ".jpg", ".jpeg", ".webp"] },
-                    variant: "both",
-                    showPreview: !0,
-                    onDrop: (r) => {
-                      var s;
-                      return S(((s = r[0]) == null ? void 0 : s.name) ?? null);
-                    }
-                  }
-                )
-              }
-            ),
-            /* @__PURE__ */ e(
-              V,
-              {
-                label: o("radiographPanel.upload.date", {
-                  defaultValue: "Acquisition date"
-                }),
-                children: /* @__PURE__ */ e(se, { value: w, onChange: (r) => I(r) })
-              }
-            ),
-            /* @__PURE__ */ e(
-              V,
-              {
-                label: o("radiographPanel.upload.note", {
-                  defaultValue: "Note (optional)"
-                }),
-                children: /* @__PURE__ */ e(
-                  ie,
-                  {
-                    rows: 2,
-                    value: j,
-                    onChange: (r) => B(r.target.value),
-                    placeholder: o("radiographPanel.upload.notePlaceholder", {
-                      defaultValue: "E.g. routine check, apical lesion…"
-                    })
-                  }
-                )
-              }
-            ),
-            /* @__PURE__ */ e(
-              R,
-              {
-                intent: "primary",
-                size: "sm",
-                startIcon: /* @__PURE__ */ e(oe, { "aria-hidden": "true" }),
-                disabled: !b,
-                onClick: J,
-                className: "ds:self-start",
-                children: o("radiographPanel.upload.submit", { defaultValue: "Upload" })
-              }
-            )
-          ] }) : null,
-          /* @__PURE__ */ c("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]", children: [
-            /* @__PURE__ */ c("div", { className: "ds:flex ds:flex-wrap ds:items-end ds:justify-between ds:gap-[var(--spacing-sm)]", children: [
-              /* @__PURE__ */ e(
-                V,
-                {
-                  label: o("radiographPanel.history.range", {
-                    defaultValue: "Date range"
-                  }),
-                  children: /* @__PURE__ */ e(te, { value: z, onChange: G })
-                }
-              ),
-              /* @__PURE__ */ c("div", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-xs)]", children: [
-                /* @__PURE__ */ e(
-                  R,
-                  {
-                    intent: "ghost",
-                    size: "sm",
-                    onClick: () => K((r) => !r),
-                    children: C ? o("radiographPanel.history.sortNewest", {
-                      defaultValue: "Newest first"
-                    }) : o("radiographPanel.history.sortOldest", {
-                      defaultValue: "Oldest first"
-                    })
-                  }
-                ),
-                /* @__PURE__ */ e(
-                  R,
-                  {
-                    intent: "ghost",
-                    size: "sm",
-                    startIcon: /* @__PURE__ */ e(A, { "aria-hidden": "true" }),
-                    disabled: N.length !== 2,
-                    onClick: () => {
-                      const r = n.filter(
-                        (s) => N.includes(s.id)
-                      );
-                      r.length === 2 && x({ films: r, index: 0, compare: !0 });
-                    },
-                    children: o("radiographPanel.history.compare", {
-                      defaultValue: "Compare"
-                    })
-                  }
-                )
-              ] })
-            ] }),
-            D.length === 0 ? /* @__PURE__ */ e(
-              _,
-              {
-                variant: "first-use",
-                title: o("radiographPanel.history.emptyTitle", {
-                  defaultValue: "No radiographs yet"
-                }),
-                description: o("radiographPanel.history.emptyBody", {
-                  defaultValue: "Upload the first film for this tooth."
-                })
-              }
-            ) : /* @__PURE__ */ e("ul", { className: "ds:m-0 ds:flex ds:list-none ds:flex-col ds:gap-[var(--spacing-xs)] ds:p-0", children: D.map((r, s) => {
-              const u = N.includes(r.id), k = r.date ?? String(s + 1);
-              return /* @__PURE__ */ c(
-                "li",
-                {
-                  "data-radiograph-id": r.id,
-                  "data-selected": u,
-                  className: "ds:flex ds:items-center ds:gap-[var(--spacing-sm)] ds:rounded-[var(--radius-md)] ds:border ds:border-[color:var(--card-border)] ds:bg-[var(--card)] ds:p-[var(--spacing-xs)] ds:data-[selected=true]:border-[color:var(--info-foreground)]",
-                  children: [
-                    /* @__PURE__ */ e(
-                      "img",
-                      {
-                        src: r.thumbnailUrl ?? r.url,
-                        alt: r.alt ?? "",
-                        className: "ds:h-16 ds:w-12 ds:shrink-0 ds:rounded-[var(--radius-sm)] ds:object-cover"
-                      }
-                    ),
-                    /* @__PURE__ */ c("div", { className: "ds:flex ds:min-w-0 ds:flex-1 ds:flex-col ds:gap-[var(--spacing-2xs)]", children: [
-                      /* @__PURE__ */ e("span", { className: "type-body-sm ds:text-[color:var(--foreground)]", children: r.date }),
-                      /* @__PURE__ */ e(ye, { kind: r.kind ?? "periapical" })
-                    ] }),
-                    /* @__PURE__ */ e(
-                      v,
-                      {
-                        icon: /* @__PURE__ */ e(ne, { "aria-hidden": "true" }),
-                        "aria-label": o("radiographPanel.history.view", {
-                          defaultValue: "View radiograph {{film}}",
-                          film: k
-                        }),
-                        size: "sm",
-                        intent: "ghost",
-                        onClick: () => x({
-                          films: D,
-                          index: s,
-                          compare: !1
-                        })
-                      }
-                    ),
-                    /* @__PURE__ */ e(
-                      v,
-                      {
-                        icon: /* @__PURE__ */ e(A, { "aria-hidden": "true" }),
-                        "aria-label": u ? o("radiographPanel.history.compareRemove", {
-                          defaultValue: "Remove {{film}} from comparison",
-                          film: k
-                        }) : o("radiographPanel.history.compareAdd", {
-                          defaultValue: "Select {{film}} for comparison",
-                          film: k
-                        }),
-                        "aria-pressed": u,
-                        size: "sm",
-                        intent: u ? "secondary" : "ghost",
-                        onClick: () => Y(r.id)
-                      }
-                    ),
-                    g ? /* @__PURE__ */ e(
-                      v,
-                      {
-                        icon: /* @__PURE__ */ e(le, { "aria-hidden": "true" }),
-                        "aria-label": o("radiographPanel.history.delete", {
-                          defaultValue: "Delete radiograph {{film}}",
-                          film: k
-                        }),
-                        size: "sm",
-                        intent: "ghost",
-                        onClick: () => g(r.id)
-                      }
-                    ) : null
-                  ]
-                },
-                r.id
-              );
-            }) })
-          ] })
-        ] }) : /* @__PURE__ */ e(
-          _,
-          {
-            variant: "first-use",
-            title: o("radiographPanel.noTooth.title", {
-              defaultValue: "No tooth selected"
-            }),
-            description: o("radiographPanel.noTooth.body", {
-              defaultValue: "Select a tooth on the chart to view its radiographs."
-            })
-          }
-        ),
-        /* @__PURE__ */ e(
-          be,
-          {
-            state: q,
-            toothLabel: O,
-            onClose: () => x(null),
-            onIndexChange: (r) => x((s) => s && { ...s, index: r })
-          }
-        )
-      ]
-    }
-  );
-}), Le = {
-  id: "radiograph-panel",
-  // pick — open a specific film in the viewer; view_change — the viewer is a
-  // view surface over the host-owned films.
-  capabilities: ["pick", "view_change"],
-  state: {
-    radiographs: {
-      // A9: structural refs only (id + kind) — never the free-text `note`,
-      // service dates, or consumer-hosted image URLs in the always-on snapshot.
-      type: "Array<{ id: string; kind?: string }>",
-      descriptionKey: "ui.agent.radiographPanel.state.radiographs",
-      description: "Structural references (id + kind) to the films shown for the selected tooth.",
-      read: (a) => a.getRadiographs().map((i) => ({ id: i.id, kind: i.kind ?? "periapical" }))
-    }
-  },
-  actions: {
-    view_radiograph: {
-      safety: "read",
-      argsType: "{ id: string }",
-      argsSchema: {
-        type: "object",
-        properties: { id: { type: "string" } },
-        required: ["id"]
-      },
-      idempotent: !0,
-      descriptionKey: "ui.agent.radiographPanel.actions.viewRadiograph",
-      description: "Open a film in the fullscreen viewer by id.",
-      invoke: (a, i) => {
-        a.openViewer(i.id);
-      }
-    },
-    close_viewer: {
-      safety: "read",
-      idempotent: !0,
-      descriptionKey: "ui.agent.radiographPanel.actions.closeViewer",
-      description: "Close the fullscreen radiograph viewer.",
-      invoke: (a) => {
-        a.closeViewer();
-      }
-    }
-  },
-  domHooks: {
-    root: { attr: "data-component", value: "radiograph-panel" },
-    instanceId: {
-      attr: "data-component-id",
-      sourceProp: "id",
-      description: "Sourced from the id prop."
-    },
-    item: {
-      attr: "data-radiograph-id",
-      description: "Each film row (`<li>`) carries its radiograph id as `data-radiograph-id`. The panel root additionally carries the selected tooth's FDI id as `data-tooth`."
-    }
-  }
-};
-export {
-  Ee as R,
-  Ae as a,
-  Le as r
-};
-//# sourceMappingURL=radiograph-panel.agent-CAX-C3g3.js.map