@alfadocs/ui-kit-debug 1.35.0 → 1.36.0

package/dist/_chunks/patient-summary-card-Bz7KdUin.js

@@ -0,0 +1,533 @@
+import { jsx as e, jsxs as n } from "react/jsx-runtime";
+import { forwardRef as ze, useId as Ie, useMemo as De } from "react";
+import { c as Ge } from "./index-D2ZczOXr.js";
+import { useTranslation as Le } from "react-i18next";
+import { A as re } from "./avatar-CkDeQOSI.js";
+import { B as D } from "./badge-BudgzTe_.js";
+import { I as Ue } from "./icon-button-8xqRnkdG.js";
+import { C as le } from "./card-DPmk26CL.js";
+import { K as Be, a as Re } from "./key-value-pair-DczGb4yz.js";
+import { L as V } from "./link-CPb_pZPr.js";
+import { S as k } from "./skeleton-CZbwyJAA.js";
+import { T as oe } from "./tag-Ci3xJPcH.js";
+import { T as Ke } from "./transaction-chip-Dth1nThY.js";
+import { T as je } from "./tooltip-Cp-PLePW.js";
+import { H as G } from "./hover-card-Bcku1GQu.js";
+import { i as de } from "./is-safe-url-DkETxeHz.js";
+import { u as qe, r as We, a as He, b as Je, F as Qe, S as Xe, A as Ye, N as Ze } from "./patient-field-row-BQZoP4m2.js";
+import { u as Oe } from "./registry-DvAUVLHh.js";
+import { M as ea } from "./mail-BqXVF2zH.js";
+import { P as aa } from "./phone-FceYcIFQ.js";
+import { M as ta } from "./map-pin-BaY37-Km.js";
+import { S as na } from "./shield-check-DCJALLVh.js";
+import { A as sa } from "./astroid-BN4f5VXU.js";
+import { U as ia } from "./users-BjS_Gg1E.js";
+import { c as ce } from "./createLucideIcon-DhHxpK9K.js";
+import { A as ra } from "./arrow-up-right-C2v_MKsK.js";
+import { C as la } from "./calendar-days-BGWklvE-.js";
+/**
+ * @license lucide-react v1.22.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const oa = [
+  [
+    "path",
+    {
+      d: "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z",
+      key: "1oefj6"
+    }
+  ],
+  ["path", { d: "M12 9v4", key: "juzpu7" }],
+  ["path", { d: "M12 17h.01", key: "p32p05" }]
+], da = ce("file-exclamation-point", oa);
+/**
+ * @license lucide-react v1.22.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const ca = [
+  [
+    "path",
+    {
+      d: "M22 17a2 2 0 0 1-2 2H6.828a2 2 0 0 0-1.414.586l-2.202 2.202A.71.71 0 0 1 2 21.286V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2z",
+      key: "18887p"
+    }
+  ],
+  ["path", { d: "M12 15h.01", key: "q59x07" }],
+  ["path", { d: "M12 7v4", key: "xawao1" }]
+], ua = ce("message-square-warning", ca), ma = {
+  id: "patient-summary-card",
+  // The agent surface is a structural snapshot only — the single handle method
+  // is a getSummary projection. The card MAY be human-customized (the optional
+  // per-context "Customize fields" cog), but that field reordering is a UI
+  // concern and is deliberately NOT exposed as an agent action; programmatic
+  // field-set control lives on PatientDetails' adapter (set_field_order).
+  capabilities: [],
+  state: {
+    summary: {
+      type: "{ id?: string; hasUnpaid: boolean; unsignedDocumentsCount: number; highlightedAnamnesisCount: number; aiConsentGranted: boolean }",
+      descriptionKey: "ui.agent.patientSummaryCard.state.summary",
+      description: "Structural summary of the patient card — identifiers, counts, and consent flags only. Never patient identity or clinical content.",
+      read: (o) => o.getSummary()
+    }
+  },
+  actions: {},
+  domHooks: {
+    root: {
+      attr: "data-component",
+      value: "patient-summary-card",
+      description: "Marks the PatientSummaryCard root region."
+    },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop."
+    }
+  }
+}, pa = [], ha = Ge("ds:w-full ds:text-[color:var(--foreground)]", {
+  variants: {
+    // Matches the kit's other `surface` props (ContactProfileCard,
+    // OperatorHero). `'elevated'` wraps the content in `<Card>`.
+    surface: {
+      flat: "",
+      elevated: ""
+    },
+    // Density tunes the avatar size + body padding. `comfortable` reads
+    // as a page header; `compact` fits an embedded sidebar / aside.
+    density: {
+      comfortable: "",
+      compact: ""
+    }
+  },
+  defaultVariants: {
+    surface: "elevated",
+    density: "comfortable"
+  }
+});
+function fa(o) {
+  return o.replace(/[^\d+]/g, "");
+}
+const ga = {
+  highlightedAnamnesis: ua,
+  unsignedDocuments: da
+}, va = {
+  highlightedAnamnesis: "warning",
+  unsignedDocuments: "error"
+}, ya = {
+  highlightedAnamnesis: "{{count}} highlighted anamnesis answers",
+  unsignedDocuments: "{{count}} unsigned documents"
+}, ba = {
+  yes: "Yes",
+  no: "No",
+  not_specified: "Not specified"
+}, Ca = ze(
+  ({
+    name: o,
+    title: P,
+    ageYears: L,
+    dateOfBirth: U,
+    gender: B,
+    avatarUrl: ue,
+    patientUrl: M,
+    sections: u,
+    visibleFieldOrder: R,
+    onVisibleFieldsChange: K,
+    email: b,
+    emailEnabled: me = !1,
+    phone: p,
+    cityProvince: j,
+    marketingConsent: h,
+    aiConsent: d,
+    flags: s,
+    familyRelations: T,
+    assignedTo: C,
+    currency: pe = "EUR",
+    locale: q,
+    loading: x = !1,
+    actionSlot: W,
+    onFlagActivate: w,
+    flagHover: F,
+    flagOpenLabel: S,
+    extraChips: H,
+    editable: he = !1,
+    onFieldSave: fe,
+    validateField: ge,
+    onActivate: J,
+    surface: Q = "elevated",
+    density: f = "comfortable",
+    "aria-label": $,
+    id: g,
+    className: ve,
+    ...ye
+  }, be) => {
+    const { t, i18n: Ce } = Le(), E = Ie(), xe = q ?? Ce.language ?? "en", _ = s == null ? void 0 : s.unpaidAmountCents, N = (s == null ? void 0 : s.unsignedDocumentsCount) ?? 0, A = (s == null ? void 0 : s.highlightedAnamnesisCount) ?? 0, z = _ != null && _ > 0, Se = De(
+      () => ({
+        getSummary: () => ({
+          id: g,
+          hasUnpaid: z,
+          unsignedDocumentsCount: N,
+          highlightedAnamnesisCount: A,
+          aiConsentGranted: d != null
+        })
+      }),
+      [
+        g,
+        z,
+        N,
+        A,
+        d
+      ]
+    );
+    Oe(ma, Se, g);
+    const X = !!u && !!K, m = qe(u ?? pa, {
+      value: R,
+      onChange: K
+    }), Ne = $ ?? t("patientSummaryCard.regionLabel", { defaultValue: "Patient overview" }), Ae = {
+      mr: "Mr.",
+      ms: "Ms."
+    }, Y = P ? t(`patientSummaryCard.title.${P}`, {
+      defaultValue: Ae[P]
+    }) : void 0, Z = Y ? `${Y} ${o}` : o, v = [];
+    B && v.push(/* @__PURE__ */ e(Xe, { code: B }, "sex")), L != null && v.push(/* @__PURE__ */ e(Ye, { years: L }, "age")), U && v.push(
+      /* @__PURE__ */ e(Ze, { icon: /* @__PURE__ */ e(la, {}), children: U }, "dob")
+    );
+    const Ve = !!M && de(M), ke = f === "comfortable" ? "xl" : "lg", O = f === "comfortable" ? "type-title-card" : "type-title-item", ee = f === "comfortable" ? "ds:gap-[var(--spacing-md)]" : "ds:gap-[var(--spacing-sm)]", c = [];
+    b && c.push({
+      key: "email",
+      icon: /* @__PURE__ */ e(ea, { "aria-hidden": "true" }),
+      label: t("patientSummaryCard.label.email", { defaultValue: "Email" }),
+      value: me ? /* @__PURE__ */ e(V, { href: `mailto:${b}`, intent: "default", onClick: J, children: b }) : /* @__PURE__ */ e("span", { className: "ds:text-[color:var(--muted-foreground)]", children: b })
+    }), p && c.push({
+      key: "phone",
+      icon: /* @__PURE__ */ e(aa, { "aria-hidden": "true" }),
+      label: p.label ?? t("patientSummaryCard.label.phone", { defaultValue: "Phone" }),
+      value: /* @__PURE__ */ n("span", { className: "ds:flex ds:flex-wrap ds:items-center ds:gap-[var(--spacing-2xs)]", children: [
+        /* @__PURE__ */ e(
+          V,
+          {
+            href: `tel:${fa(p.prefixAndNumber)}`,
+            intent: "default",
+            children: p.prefixAndNumber
+          }
+        ),
+        p.smsEnabled ? /* @__PURE__ */ e(D, { variant: "success", size: "sm", children: t("patientSummaryCard.value.smsEnabled", {
+          defaultValue: "SMS"
+        }) }) : null
+      ] })
+    }), j && c.push({
+      key: "cityProvince",
+      icon: /* @__PURE__ */ e(ta, { "aria-hidden": "true" }),
+      label: t("patientSummaryCard.label.cityProvince", {
+        defaultValue: "City / province"
+      }),
+      value: j
+    }), h && c.push({
+      key: "marketingConsent",
+      icon: /* @__PURE__ */ e(na, { "aria-hidden": "true" }),
+      label: t("patientSummaryCard.label.marketingConsent", {
+        defaultValue: "Marketing consent"
+      }),
+      value: /* @__PURE__ */ e(
+        D,
+        {
+          variant: h === "yes" ? "success" : h === "no" ? "error" : "neutral",
+          size: "sm",
+          withDot: !0,
+          children: t(`patientSummaryCard.marketingConsent.${h}`, {
+            defaultValue: ba[h]
+          })
+        }
+      )
+    }), d && c.push({
+      key: "aiConsent",
+      icon: /* @__PURE__ */ e(sa, { "aria-hidden": "true" }),
+      label: t("patientSummaryCard.label.aiConsent", {
+        defaultValue: "AI consent"
+      }),
+      value: d.grantedBy ? t("patientSummaryCard.value.aiConsentGrantedBy", {
+        date: d.grantedAt,
+        by: d.grantedBy,
+        defaultValue: "Granted {{date}} by {{by}}"
+      }) : t("patientSummaryCard.value.aiConsentGrantedAt", {
+        date: d.grantedAt,
+        defaultValue: "Granted {{date}}"
+      })
+    }), C && c.push({
+      key: "assignedTo",
+      icon: /* @__PURE__ */ e(ia, { "aria-hidden": "true" }),
+      label: t("patientSummaryCard.label.assignedTo", {
+        defaultValue: "Assigned to"
+      }),
+      value: /* @__PURE__ */ n("span", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-xs)]", children: [
+        /* @__PURE__ */ e(
+          re,
+          {
+            size: "xs",
+            name: C.name,
+            src: C.avatarUrl
+          }
+        ),
+        /* @__PURE__ */ e("span", { children: C.name })
+      ] })
+    });
+    const I = [];
+    A > 0 && I.push({
+      key: "highlightedAnamnesis",
+      count: A
+    }), N > 0 && I.push({
+      key: "unsignedDocuments",
+      count: N
+    });
+    const ae = (a, r) => {
+      const i = w == null ? void 0 : w[a], l = F == null ? void 0 : F[a];
+      if (l == null && !i) return r;
+      const se = "ds:inline-flex ds:cursor-pointer ds:rounded-[var(--radius-full)] ds:p-0 ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[color:var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]";
+      if (l == null)
+        return /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            "data-flag-action": a,
+            onClick: i,
+            className: se,
+            children: r
+          },
+          a
+        );
+      const ie = /* @__PURE__ */ e(
+        "button",
+        {
+          type: "button",
+          "data-flag-action": i ? a : void 0,
+          "data-flag-hover": a,
+          className: se,
+          children: r
+        },
+        a
+      );
+      return typeof l == "string" ? /* @__PURE__ */ e(je, { label: l, side: "bottom", children: ie }, a) : /* @__PURE__ */ n(G, { children: [
+        /* @__PURE__ */ e(G.Trigger, { asChild: !0, children: ie }),
+        /* @__PURE__ */ e(
+          G.Content,
+          {
+            side: "bottom",
+            align: "start",
+            size: "sm",
+            headerAction: i && (S != null && S[a]) ? /* @__PURE__ */ e(
+              Ue,
+              {
+                icon: /* @__PURE__ */ e(ra, {}),
+                intent: "outline",
+                background: "surface",
+                size: "sm",
+                "aria-label": S[a],
+                onClick: i
+              }
+            ) : void 0,
+            children: l
+          }
+        )
+      ] }, a);
+    }, y = [];
+    z && y.push(
+      ae(
+        "unpaid",
+        /* @__PURE__ */ e(
+          Ke,
+          {
+            state: "debt",
+            amount: _ / 100,
+            currency: pe,
+            locale: xe,
+            size: "md",
+            showLabel: !0
+          },
+          "unpaid"
+        )
+      )
+    ), I.forEach(({ key: a, count: r }) => {
+      const i = ga[a];
+      y.push(
+        ae(
+          a,
+          /* @__PURE__ */ e(
+            D,
+            {
+              variant: va[a],
+              size: "md",
+              leading: /* @__PURE__ */ e(i, { "aria-hidden": "true" }),
+              children: t(`patientSummaryCard.flag.${a}`, {
+                count: r,
+                defaultValue: ya[a]
+              })
+            },
+            a
+          )
+        )
+      );
+    }), H && y.push(H);
+    const Pe = /* @__PURE__ */ n("div", { className: `ds:flex ds:flex-col ${ee}`, children: [
+      /* @__PURE__ */ n("div", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-md)]", children: [
+        /* @__PURE__ */ e(k, { variant: "circular", size: "lg" }),
+        /* @__PURE__ */ n("div", { className: "ds:flex ds:flex-1 ds:flex-col ds:gap-[var(--spacing-xs)]", children: [
+          /* @__PURE__ */ e(k, { variant: "text", width: "60%" }),
+          /* @__PURE__ */ e(k, { variant: "text", width: "40%" })
+        ] })
+      ] }),
+      /* @__PURE__ */ e(k, { variant: "text", lines: 3 })
+    ] }), Me = Ve ? /* @__PURE__ */ e(
+      V,
+      {
+        href: M,
+        intent: "default",
+        weight: "strong",
+        onClick: J,
+        className: `${O} ds:no-underline`,
+        children: /* @__PURE__ */ e("span", { id: E, children: Z })
+      }
+    ) : /* @__PURE__ */ e(
+      "span",
+      {
+        id: E,
+        className: `${O} ds:text-[color:var(--foreground)]`,
+        children: Z
+      }
+    ), Te = /* @__PURE__ */ n("div", { className: "ds:flex ds:items-start ds:gap-[var(--spacing-md)]", children: [
+      /* @__PURE__ */ e(
+        re,
+        {
+          size: ke,
+          name: o,
+          src: ue,
+          className: "ds:shrink-0"
+        }
+      ),
+      /* @__PURE__ */ n("div", { className: "ds:flex ds:min-w-0 ds:flex-1 ds:flex-col ds:gap-[var(--spacing-2xs)]", children: [
+        Me,
+        y.length > 0 || v.length > 0 ? /* @__PURE__ */ n("div", { className: "ds:flex ds:flex-wrap ds:items-center ds:gap-[var(--spacing-xs)]", children: [
+          y,
+          v
+        ] }) : null
+      ] }),
+      X || W ? /* @__PURE__ */ n("div", { className: "ds:ms-auto ds:flex ds:shrink-0 ds:items-center ds:gap-[var(--spacing-xs)]", children: [
+        X && u ? /* @__PURE__ */ e(
+          Qe,
+          {
+            sections: u,
+            visible: m.visible,
+            onToggleField: m.toggleField,
+            onToggleSection: m.toggleSection,
+            onMoveFieldOnto: m.moveFieldOnto,
+            onReset: m.reset
+          }
+        ) : null,
+        W
+      ] }) : null
+    ] }), we = T && T.length > 0 ? /* @__PURE__ */ n("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]", children: [
+      /* @__PURE__ */ e("span", { className: "type-label ds:text-[color:var(--muted-foreground)]", children: t("patientSummaryCard.label.familyRelations", {
+        defaultValue: "Family relations"
+      }) }),
+      /* @__PURE__ */ e("div", { className: "ds:flex ds:flex-wrap ds:gap-[var(--spacing-2xs)]", children: T.map((a, r) => {
+        const i = !!a.relatedPatient.url && de(a.relatedPatient.url), l = t("patientSummaryCard.value.familyRelation", {
+          relation: a.relation,
+          name: a.relatedPatient.name,
+          defaultValue: "{{relation}}: {{name}}"
+        });
+        return i ? /* @__PURE__ */ e(
+          V,
+          {
+            href: a.relatedPatient.url,
+            intent: "default",
+            className: "ds:no-underline",
+            children: /* @__PURE__ */ e(oe, { label: l, variant: "neutral" })
+          },
+          `${a.relation}-${r}`
+        ) : /* @__PURE__ */ e(
+          oe,
+          {
+            label: l,
+            variant: "neutral"
+          },
+          `${a.relation}-${r}`
+        );
+      }) })
+    ] }) : null, Fe = c.map((a) => ({
+      id: a.key,
+      label: a.label,
+      value: a.value,
+      icon: a.icon
+    })), $e = u ?? [
+      { id: "contact", heading: "", fields: Fe }
+    ], Ee = u ? m.visible : R, te = We(
+      $e,
+      Ee
+    ).flatMap((a) => a.fields), _e = /* @__PURE__ */ n("div", { className: `ds:flex ds:flex-col ${ee}`, children: [
+      Te,
+      te.length > 0 ? (
+        // Container-queried so the fields flow into two columns when the
+        // card is wide enough (the banner spans the full folder width), and
+        // stay single-column in a narrow rail. The list's KeyValuePair
+        // children already `col-span-3`; doubling the parent to six tracks
+        // (`repeat(2, …)`) lets grid auto-flow place two fields per row while
+        // each column keeps its own subgrid label/value alignment.
+        // 672px, not the `@2xl` rem alias: container-query `rem` follows the
+        // host root font-size, so a non-16px root moves the threshold.
+        /* @__PURE__ */ e("div", { className: "ds:@container/pfields", children: /* @__PURE__ */ e(
+          Be,
+          {
+            rowGap: "sm",
+            className: "ds:@[672px]/pfields:grid-cols-[repeat(2,auto_auto_minmax(0,1fr))]",
+            children: te.map((a) => /* @__PURE__ */ e(
+              Re,
+              {
+                icon: a.icon ?? void 0,
+                label: a.label,
+                labelNode: /* @__PURE__ */ e(Je, { field: a }),
+                className: "ds:group",
+                "data-field-id": a.id,
+                value: /* @__PURE__ */ e(
+                  He,
+                  {
+                    field: a,
+                    editable: he,
+                    onFieldSave: fe,
+                    validate: ge,
+                    locale: q
+                  }
+                )
+              },
+              a.id
+            ))
+          }
+        ) })
+      ) : null,
+      we
+    ] }), ne = x ? Pe : _e;
+    return /* @__PURE__ */ e(
+      "div",
+      {
+        ref: be,
+        role: "region",
+        "aria-label": x || $ ? Ne : void 0,
+        "aria-labelledby": x || $ ? void 0 : E,
+        "aria-busy": x || void 0,
+        "data-component": "patient-summary-card",
+        "data-component-id": g,
+        "data-density": f,
+        id: g,
+        className: ha({ surface: Q, density: f, className: ve }),
+        ...ye,
+        children: Q === "elevated" ? /* @__PURE__ */ e(le, { variant: "elevated", children: /* @__PURE__ */ e(le.Body, { children: ne }) }) : ne
+      }
+    );
+  }
+);
+Ca.displayName = "PatientSummaryCard";
+export {
+  Ca as P,
+  ma as p
+};
+//# sourceMappingURL=patient-summary-card-Bz7KdUin.js.map