@alfadocs/ui-kit 1.4.6 → 1.4.8

package/dist/_chunks/anamnesis-summary-card-BvaSnAbI.js

@@ -0,0 +1,302 @@
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import { forwardRef as W, useId as Y, useMemo as L, useImperativeHandle as J } from "react";
+import { c as h } from "./index-D2ZczOXr.js";
+import { useTranslation as Q } from "react-i18next";
+import { B as A } from "./badge-DCOqV9mI.js";
+import { C as f } from "./card-DPmk26CL.js";
+import { K as X, a as Z } from "./key-value-pair-DGkGlgCF.js";
+import { S as w } from "./skeleton-CZbwyJAA.js";
+import { a as ee, T as ae } from "./tooltip-DvmfrNvB.js";
+import { u as se } from "./registry-DvAUVLHh.js";
+import { H as _ } from "./heart-pulse-BCppJyN2.js";
+const te = {
+  id: "anamnesis-summary-card",
+  // The card is read-only: the only handle method is a getSummary
+  // projection, so there is no capability to declare.
+  capabilities: [],
+  state: {
+    summary: {
+      type: "{ id?: string; sectionCount: number; answerCount: number; highlightedCount: number; unansweredCount: number }",
+      descriptionKey: "ui.agent.anamnesisSummaryCard.state.summary",
+      description: "Structural summary of the anamnesis card — section, answer, highlighted and unanswered counts plus the consumer id. Never question labels or answer values.",
+      read: (r) => r.getSummary()
+    }
+  },
+  actions: {},
+  domHooks: {
+    root: {
+      attr: "data-component",
+      value: "anamnesis-summary-card",
+      description: "Marks the AnamnesisSummaryCard root region."
+    },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop."
+    },
+    item: {
+      attr: "data-answer-id",
+      description: "One per answer row (KeyValuePair); the value is the intake field key. Highlighted rows also carry data-highlighted."
+    }
+  }
+}, re = h("ds:w-full ds:text-[color:var(--foreground)]", {
+  variants: {
+    // Same `surface` vocabulary as PatientSummaryCard / ContactProfileCard.
+    // Both surfaces keep the Card chrome — `flat` only drops the shadow.
+    surface: {
+      flat: "",
+      elevated: ""
+    },
+    density: {
+      comfortable: "",
+      compact: ""
+    }
+  },
+  defaultVariants: {
+    surface: "elevated",
+    density: "comfortable"
+  }
+}), ne = h("ds:flex ds:flex-col", {
+  variants: {
+    density: {
+      comfortable: "ds:gap-[var(--spacing-lg)]",
+      compact: "ds:gap-[var(--spacing-md)]"
+    }
+  },
+  defaultVariants: { density: "comfortable" }
+}), de = h("", {
+  variants: {
+    density: {
+      comfortable: "",
+      compact: "ds:p-[var(--spacing-sm)] ds:pb-0"
+    }
+  },
+  defaultVariants: { density: "comfortable" }
+}), ie = h("", {
+  variants: {
+    density: {
+      comfortable: "",
+      compact: "ds:p-[var(--spacing-sm)]"
+    }
+  },
+  defaultVariants: { density: "comfortable" }
+}), oe = h("", {
+  variants: {
+    density: {
+      comfortable: "",
+      compact: "ds:p-[var(--spacing-sm)] ds:pt-0"
+    }
+  },
+  defaultVariants: { density: "comfortable" }
+}), le = /^(\d{4})-(\d{2})-(\d{2})$/, ce = /^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2})(?::(\d{2}))?$/, me = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}/;
+function ue(r) {
+  const d = le.exec(r);
+  if (d)
+    return {
+      date: new Date(Number(d[1]), Number(d[2]) - 1, Number(d[3])),
+      hasTime: !1
+    };
+  const t = ce.exec(r);
+  if (t)
+    return {
+      date: new Date(
+        Number(t[1]),
+        Number(t[2]) - 1,
+        Number(t[3]),
+        Number(t[4]),
+        Number(t[5]),
+        t[6] ? Number(t[6]) : 0
+      ),
+      hasTime: !0
+    };
+  const n = new Date(r);
+  return Number.isNaN(n.getTime()) ? null : { date: n, hasTime: me.test(r) };
+}
+function he(r, d) {
+  const t = ue(r);
+  if (!t) return null;
+  const n = t.hasTime ? { dateStyle: "medium", timeStyle: "short" } : { dateStyle: "medium" };
+  try {
+    return new Intl.DateTimeFormat(d, n).format(t.date);
+  } catch {
+    return new Intl.DateTimeFormat(void 0, n).format(t.date);
+  }
+}
+const pe = "ds:border-s-2 ds:border-[color:var(--accent)] ds:ps-[var(--spacing-sm)] ds:bg-[color:color-mix(in_srgb,var(--accent)_6%,transparent)]", ge = 'ds:relative ds:inline-flex ds:appearance-none ds:border-0 ds:bg-transparent ds:p-0 ds:m-0 ds:cursor-default ds:rounded-[var(--radius-full)] ds:before:absolute ds:before:content-[""] ds:before:inset-x-[calc((var(--min-target-size)-100%)/-2)] ds:before:inset-y-[calc((var(--min-target-size)-100%)/-2)] ds:sm:before:inset-x-[calc((var(--spacing-lg)-100%)/-2)] ds:sm:before:inset-y-[calc((var(--spacing-lg)-100%)/-2)] ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)] ds:forced-colors:focus-visible:outline-[CanvasText]', v = "type-body-sm ds:m-0 ds:text-[color:var(--muted-foreground)]", fe = W(
+  ({
+    sections: r,
+    title: d,
+    subtitle: t,
+    unansweredCount: n = 0,
+    locale: I,
+    highlightedFirst: y = !0,
+    surface: N = "elevated",
+    density: i = "comfortable",
+    loading: p = !1,
+    actionSlot: x,
+    id: c,
+    className: H,
+    "aria-label": E,
+    ...D
+  }, P) => {
+    const { t: o, i18n: k } = Q(), O = Y(), R = I ?? k.language ?? "en", m = L(
+      () => r.filter((s) => s.answers.length > 0).map((s) => ({
+        ...s,
+        answers: y ? [...s.answers].sort(
+          (a, u) => +!!u.highlighted - +!!a.highlighted
+        ) : s.answers
+      })),
+      [r, y]
+    ), C = m.reduce(
+      (s, a) => s + a.answers.length,
+      0
+    ), g = m.reduce(
+      (s, a) => s + a.answers.filter((u) => u.highlighted).length,
+      0
+    ), S = m.length, b = L(
+      () => ({
+        getSummary: () => ({
+          id: c,
+          sectionCount: S,
+          answerCount: C,
+          highlightedCount: g,
+          unansweredCount: n
+        })
+      }),
+      [c, S, C, g, n]
+    );
+    J(P, () => b, [b]), se(te, b, c);
+    const B = o("anamnesisSummaryCard.regionLabel", {
+      defaultValue: "Anamnesis summary"
+    }), T = d ?? B, K = E ?? T, V = o("anamnesisSummaryCard.highlighted", {
+      defaultValue: "Highlighted"
+    }), M = i === "comfortable" ? "type-title-card" : "type-title-item", $ = i === "comfortable" ? "md" : "sm", z = (s) => {
+      const a = s.reportedAtIso ? he(s.reportedAtIso, R) : null, u = a && s.sourceLabel ? o("anamnesisSummaryCard.reportedOnFrom", {
+        date: a,
+        source: s.sourceLabel,
+        defaultValue: "Highlighted on {{date}} · {{source}}"
+      }) : a ? o("anamnesisSummaryCard.reportedOn", {
+        date: a,
+        defaultValue: "Highlighted on {{date}}"
+      }) : V;
+      return /* @__PURE__ */ e(ae, { label: u, side: "top", children: /* @__PURE__ */ e(
+        "button",
+        {
+          type: "button",
+          className: ge,
+          "data-highlighted-chip": "",
+          children: /* @__PURE__ */ e(
+            A,
+            {
+              variant: "accentSoft",
+              size: "sm",
+              leading: /* @__PURE__ */ e(_, { "aria-hidden": "true" }),
+              children: V
+            }
+          )
+        }
+      ) });
+    }, F = /* @__PURE__ */ l("div", { className: "ds:flex ds:flex-wrap ds:items-start ds:gap-[var(--spacing-sm)]", children: [
+      /* @__PURE__ */ l("div", { className: "ds:flex ds:min-w-0 ds:flex-1 ds:flex-col ds:gap-[var(--spacing-2xs)]", children: [
+        /* @__PURE__ */ e(
+          "h3",
+          {
+            id: O,
+            className: `ds:m-0 ${M} ds:text-[color:var(--foreground)]`,
+            children: T
+          }
+        ),
+        t ? /* @__PURE__ */ e("p", { className: v, children: t }) : null
+      ] }),
+      !p && g > 0 ? /* @__PURE__ */ e(
+        A,
+        {
+          variant: "accentSoft",
+          size: "sm",
+          leading: /* @__PURE__ */ e(_, { "aria-hidden": "true" }),
+          className: "ds:shrink-0",
+          children: o("anamnesisSummaryCard.highlightedCount", {
+            count: g,
+            defaultValue: "{{count}} highlighted"
+          })
+        }
+      ) : null,
+      x ? /* @__PURE__ */ e("div", { className: "ds:ms-auto ds:flex ds:shrink-0 ds:items-center ds:gap-[var(--spacing-xs)]", children: x }) : null
+    ] }), G = /* @__PURE__ */ l("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]", children: [
+      /* @__PURE__ */ e(w, { variant: "text", width: "40%" }),
+      /* @__PURE__ */ e(w, { variant: "text", lines: 4 })
+    ] }), j = /* @__PURE__ */ e("p", { className: v, children: o("anamnesisSummaryCard.empty", {
+      defaultValue: "No answers recorded yet"
+    }) }), q = /* @__PURE__ */ e(
+      "div",
+      {
+        role: "group",
+        "aria-label": o("anamnesisSummaryCard.sectionsLabel", {
+          defaultValue: "Anamnesis sections"
+        }),
+        className: ne({ density: i }),
+        children: m.map((s) => /* @__PURE__ */ l(
+          "div",
+          {
+            "data-section-id": s.id,
+            className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]",
+            children: [
+              /* @__PURE__ */ e("h4", { className: "ds:m-0 type-eyebrow ds:text-[color:var(--muted-foreground)]", children: s.heading }),
+              /* @__PURE__ */ e("div", { className: "ds:@container/afields", children: /* @__PURE__ */ e(
+                X,
+                {
+                  rowGap: $,
+                  className: "ds:@[672px]/afields:grid-cols-[repeat(2,auto_auto_minmax(0,1fr))]",
+                  children: s.answers.map((a) => /* @__PURE__ */ e(
+                    Z,
+                    {
+                      "data-answer-id": a.id,
+                      "data-highlighted": a.highlighted ? "" : void 0,
+                      label: a.sourceLabel ? `${a.label} (${a.sourceLabel})` : a.label,
+                      className: a.highlighted ? pe : void 0,
+                      value: /* @__PURE__ */ l("span", { className: "ds:inline-flex ds:flex-wrap ds:items-center ds:gap-x-[var(--spacing-xs)] ds:gap-y-[var(--spacing-2xs)]", children: [
+                        /* @__PURE__ */ e("span", { children: a.value }),
+                        a.unit ? /* @__PURE__ */ e("span", { className: "type-body-sm ds:text-[color:var(--muted-foreground)]", children: a.unit }) : null,
+                        a.highlighted ? z(a) : null
+                      ] })
+                    },
+                    a.id
+                  ))
+                }
+              ) })
+            ]
+          },
+          s.id
+        ))
+      }
+    ), U = p ? G : m.length === 0 ? j : q;
+    return /* @__PURE__ */ e(
+      "div",
+      {
+        role: "region",
+        "aria-label": K,
+        "aria-busy": p || void 0,
+        "data-component": "anamnesis-summary-card",
+        "data-component-id": c,
+        "data-density": i,
+        id: c,
+        className: re({ surface: N, density: i, className: H }),
+        ...D,
+        children: /* @__PURE__ */ l(f, { variant: N === "flat" ? "outlined" : "elevated", children: [
+          /* @__PURE__ */ e(f.Header, { className: de({ density: i }), children: F }),
+          /* @__PURE__ */ e(ee, { children: /* @__PURE__ */ e(f.Body, { className: ie({ density: i }), children: U }) }),
+          !p && n > 0 ? /* @__PURE__ */ e(f.Footer, { className: oe({ density: i }), children: /* @__PURE__ */ e("p", { className: v, children: o("anamnesisSummaryCard.unanswered", {
+            count: n,
+            defaultValue: "{{count}} questions not answered"
+          }) }) }) : null
+        ] })
+      }
+    );
+  }
+);
+fe.displayName = "AnamnesisSummaryCard";
+export {
+  fe as A,
+  te as a
+};
+//# sourceMappingURL=anamnesis-summary-card-BvaSnAbI.js.map