@alfadocs/ui-kit 1.35.0 → 1.36.0

package/dist/_chunks/patient-details-f7SSXkTJ.js

@@ -0,0 +1,371 @@
+import { jsx as e, jsxs as r } from "react/jsx-runtime";
+import { forwardRef as X, useId as T, useMemo as Z, Fragment as $ } from "react";
+import { c as j } from "./index-D2ZczOXr.js";
+import { useTranslation as A } from "react-i18next";
+import { A as ee } from "./avatar-CkDeQOSI.js";
+import { C as f } from "./card-DPmk26CL.js";
+import { C as ie, b as te, a as se } from "./collapsible-CTjxzGuF.js";
+import { D as ae } from "./description-list-C1RXMDZ_.js";
+import { P as de } from "./panel-header-D_mTdhUp.js";
+import { u as re } from "./registry-DvAUVLHh.js";
+import { u as ne, F as le, r as oe, P as ce } from "./patient-field-row-BQZoP4m2.js";
+import { C as pe } from "./clipboard-list-rSzfIYZB.js";
+const me = {
+  id: "patient-details",
+  // `view_change` backs the view-config actions (show/hide + reorder are both
+  // view reconfigurations); `set_value` backs the single-value `update_field`
+  // (not `edit_inline`, which is for granular free-text/formatting edits).
+  capabilities: ["view_change", "set_value"],
+  state: {
+    visibleFieldOrder: {
+      type: "string[]",
+      descriptionKey: "ui.agent.patientDetails.state.visibleFieldOrder",
+      description: 'Ordered list of visible field KEYS (e.g. "fiscalCode"). Never a field value.',
+      read: (i) => i.getVisibleFieldOrder()
+    },
+    patientId: {
+      type: "string | undefined",
+      descriptionKey: "ui.agent.patientDetails.state.patientId",
+      description: "Opaque patient id the panel is bound to. No patient-identifiable data.",
+      read: (i) => i.getPatientId()
+    }
+  },
+  actions: {
+    set_visible_fields: {
+      safety: "write",
+      argsType: "{ fieldIds: string[] }",
+      argsSchema: {
+        type: "object",
+        properties: {
+          fieldIds: { type: "array", items: { type: "string" } }
+        },
+        required: ["fieldIds"]
+      },
+      idempotent: !0,
+      descriptionKey: "ui.agent.patientDetails.actions.setVisibleFields",
+      description: "Set which fields are visible (and their order). Unknown ids are ignored.",
+      examples: [
+        {
+          args: { fieldIds: ["lastName", "firstName", "phone", "email"] },
+          note: "Show only name + contact fields."
+        }
+      ],
+      invoke: (i, t) => {
+        i.setVisibleFields(t.fieldIds);
+      }
+    },
+    set_field_order: {
+      safety: "write",
+      argsType: "{ orderedIds: string[] }",
+      argsSchema: {
+        type: "object",
+        properties: {
+          orderedIds: { type: "array", items: { type: "string" } }
+        },
+        required: ["orderedIds"]
+      },
+      idempotent: !0,
+      descriptionKey: "ui.agent.patientDetails.actions.setFieldOrder",
+      description: "Reorder the visible fields. Order within a section is honoured; sections stay fixed.",
+      invoke: (i, t) => {
+        i.setFieldOrder(t.orderedIds);
+      }
+    },
+    update_field: {
+      // PHI: mutates a patient-identifiable value. NOT `write` — the runtime
+      // must confirm + audit. Routes through `onFieldSave` (server write).
+      safety: "phi",
+      openWorld: !0,
+      argsType: "{ fieldId: string; value: unknown }",
+      argsSchema: {
+        type: "object",
+        properties: {
+          fieldId: { type: "string" },
+          value: {}
+        },
+        required: ["fieldId", "value"]
+      },
+      idempotent: !0,
+      descriptionKey: "ui.agent.patientDetails.actions.updateField",
+      description: "Write a patient field value via the consumer's audited save path. Subject to the same permissions and validation as a human edit.",
+      errors: ["no-save-handler", "validation-failed", "permission-denied"],
+      examples: [
+        {
+          args: { fieldId: "job", value: "Architect" },
+          note: "Update the patient’s occupation."
+        }
+      ],
+      invoke: (i, t) => i.updateField(t.fieldId, t.value)
+    }
+  },
+  domHooks: {
+    root: {
+      attr: "data-component",
+      value: "patient-details",
+      description: "Marks the PatientDetails root region."
+    },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop. Addresses a specific panel."
+    },
+    item: {
+      attr: "data-field-id",
+      description: "Stable field KEY on each row. Never the field value (no PHI in the DOM hook)."
+    }
+  }
+}, C = j(
+  "ds:flex ds:flex-col ds:text-[color:var(--foreground)]",
+  {
+    variants: {
+      // `compact` (default) suits the narrow rail panel; `comfortable`
+      // relaxes spacing for a wider host (a full-width profile page).
+      density: {
+        comfortable: "",
+        compact: ""
+      }
+    },
+    defaultVariants: {
+      density: "compact"
+    }
+  }
+), S = j("ds:flex ds:flex-col ds:gap-[var(--spacing-md)]", {
+  variants: {
+    density: {
+      comfortable: "ds:p-[var(--spacing-md)]",
+      compact: "ds:p-[var(--spacing-sm)]"
+    }
+  },
+  defaultVariants: {
+    density: "compact"
+  }
+}), ue = X(
+  function({
+    title: t,
+    sections: n,
+    avatar: a,
+    headerChips: c,
+    framed: p = !1,
+    editable: g = !1,
+    onFieldSave: d,
+    validate: h,
+    visibleFieldOrder: m,
+    defaultVisibleFieldOrder: l,
+    onVisibleFieldsChange: K,
+    loading: _ = !1,
+    emptyState: B,
+    patientId: u,
+    id: v,
+    locale: R,
+    cogLabel: q,
+    panelTitle: E,
+    "aria-label": b,
+    className: N,
+    ...w
+  }, F) {
+    const { t: I } = A(), D = T(), {
+      visible: o,
+      catalogueIds: M,
+      setOrder: y,
+      toggleField: H,
+      toggleSection: z,
+      moveFieldOnto: L,
+      reset: U
+    } = ne(n, {
+      value: m,
+      defaultValue: l,
+      onChange: K
+    }), W = Z(
+      () => ({
+        getVisibleFieldOrder: () => o,
+        getPatientId: () => u,
+        setVisibleFields: (s) => y(s),
+        setFieldOrder: (s) => y(s),
+        updateField: (s, x) => d ? d(s, x) : Promise.reject(
+          new Error("PatientDetails: no onFieldSave handler is wired.")
+        )
+      }),
+      [o, u, y, d]
+    );
+    re(me, W, v);
+    const P = E ?? I("patientDetails.regionLabel", {
+      defaultValue: "Patient details"
+    }), Y = b ?? P, V = (a == null ? void 0 : a.name) ?? (typeof t == "string" ? t : void 0), G = !!(a != null && a.src || V), J = M.some((s) => o.includes(s));
+    if (_)
+      return /* @__PURE__ */ e(
+        "section",
+        {
+          ref: F,
+          "data-component": "patient-details",
+          "data-component-id": v,
+          "data-patient-id": u,
+          "aria-label": Y,
+          "aria-busy": "true",
+          className: C({ className: N }),
+          ...w,
+          children: /* @__PURE__ */ e("div", { className: S(), children: /* @__PURE__ */ e(ge, {}) })
+        }
+      );
+    const Q = n.length === 0 || !J, O = /* @__PURE__ */ r("div", { className: "ds:flex ds:items-start ds:gap-[var(--spacing-sm)]", children: [
+      G ? /* @__PURE__ */ e(
+        ee,
+        {
+          size: "md",
+          name: V,
+          src: a == null ? void 0 : a.src,
+          className: "ds:shrink-0"
+        }
+      ) : null,
+      /* @__PURE__ */ r("div", { className: "ds:flex ds:min-w-0 ds:flex-1 ds:flex-col ds:gap-[var(--spacing-2xs)]", children: [
+        /* @__PURE__ */ e("h3", { className: "ds:m-0 type-title-item ds:text-[color:var(--foreground)]", children: t }),
+        c ? /* @__PURE__ */ e("div", { className: "ds:flex ds:flex-wrap ds:items-center ds:gap-[var(--spacing-xs)]", children: c }) : null
+      ] })
+    ] });
+    return /* @__PURE__ */ r(
+      "section",
+      {
+        ref: F,
+        "data-component": "patient-details",
+        "data-component-id": v,
+        "data-patient-id": u,
+        "aria-labelledby": b ? void 0 : D,
+        "aria-label": b ?? void 0,
+        className: C({ className: N }),
+        ...w,
+        children: [
+          /* @__PURE__ */ e(
+            de,
+            {
+              title: P,
+              icon: /* @__PURE__ */ e(pe, { "aria-hidden": "true" }),
+              headingId: D,
+              sticky: !0,
+              divider: !0,
+              actions: /* @__PURE__ */ e(
+                le,
+                {
+                  sections: n,
+                  visible: o,
+                  onToggleField: H,
+                  onToggleSection: z,
+                  onMoveFieldOnto: L,
+                  onReset: U,
+                  label: q
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ r("div", { className: S(), children: [
+            p ? /* @__PURE__ */ e(f, { variant: "elevated", children: /* @__PURE__ */ e(f.Body, { children: O }) }) : O,
+            Q ? /* @__PURE__ */ e("p", { className: "ds:m-0 type-body-sm ds:text-[color:var(--muted-foreground)]", children: B ?? I("patientDetails.empty", {
+              defaultValue: "No patient selected."
+            }) }) : oe(n, o).filter(({ fields: s }) => s.length > 0).map(({ section: s, fields: x }) => {
+              const k = /* @__PURE__ */ e(
+                fe,
+                {
+                  section: s,
+                  fields: x,
+                  editable: g,
+                  onFieldSave: d,
+                  validate: h,
+                  locale: R
+                }
+              );
+              return p ? /* @__PURE__ */ e(f, { variant: "elevated", children: /* @__PURE__ */ e(f.Body, { children: k }) }, s.id) : /* @__PURE__ */ e($, { children: k }, s.id);
+            })
+          ] })
+        ]
+      }
+    );
+  }
+);
+ue.displayName = "PatientDetails";
+function fe({
+  section: i,
+  fields: t,
+  editable: n,
+  onFieldSave: a,
+  validate: c,
+  locale: p
+}) {
+  const { t: g } = A(), d = T(), h = i.collapsible ?? !0, m = t.length === 0 ? /* @__PURE__ */ e("p", { className: "ds:m-0 type-body-sm ds:text-[color:var(--muted-foreground)]", children: g("patientDetails.section.empty", {
+    defaultValue: "No fields shown."
+  }) }) : /* @__PURE__ */ e(
+    ae,
+    {
+      layout: "inline",
+      density: "compact",
+      divider: "none",
+      className: "ds:[--description-list-icon-color:var(--accent)]",
+      children: t.map((l) => /* @__PURE__ */ e(
+        ce,
+        {
+          field: l,
+          icon: l.icon ?? null,
+          editable: n,
+          onFieldSave: a,
+          validate: c,
+          locale: p
+        },
+        l.id
+      ))
+    }
+  );
+  return h ? /* @__PURE__ */ r(
+    ie,
+    {
+      defaultOpen: i.defaultOpen ?? !0,
+      variant: "minimal",
+      className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]",
+      children: [
+        /* @__PURE__ */ e("h3", { className: "ds:m-0", children: /* @__PURE__ */ e(te, { asChild: !0, children: /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            id: d,
+            className: "ds:flex ds:w-full ds:items-center ds:justify-between ds:gap-[var(--spacing-xs)] ds:bg-transparent ds:border-0 ds:p-0 ds:text-start ds:cursor-pointer ds:rounded-[var(--radius-sm)] 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:forced-colors:focus-visible:outline-[CanvasText] type-eyebrow ds:text-[color:var(--foreground)]",
+            children: i.heading
+          }
+        ) }) }),
+        /* @__PURE__ */ e(se, { "aria-labelledby": d, children: m })
+      ]
+    }
+  ) : /* @__PURE__ */ r(
+    "section",
+    {
+      "aria-labelledby": d,
+      className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]",
+      children: [
+        /* @__PURE__ */ e(
+          "h3",
+          {
+            id: d,
+            className: "ds:m-0 type-eyebrow ds:text-[color:var(--foreground)]",
+            children: i.heading
+          }
+        ),
+        m
+      ]
+    }
+  );
+}
+function ge() {
+  return /* @__PURE__ */ r("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-md)]", children: [
+    /* @__PURE__ */ r("div", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-sm)]", children: [
+      /* @__PURE__ */ e("span", { className: "ds:size-10 ds:shrink-0 ds:rounded-full ds:bg-[color:var(--muted)]" }),
+      /* @__PURE__ */ e("span", { className: "ds:h-4 ds:w-1/2 ds:rounded-[var(--radius-sm)] ds:bg-[color:var(--muted)]" })
+    ] }),
+    [0, 1, 2].map((i) => /* @__PURE__ */ e(
+      "span",
+      {
+        className: "ds:h-4 ds:w-full ds:rounded-[var(--radius-sm)] ds:bg-[color:var(--muted)]"
+      },
+      i
+    ))
+  ] });
+}
+export {
+  ue as P,
+  me as p
+};
+//# sourceMappingURL=patient-details-f7SSXkTJ.js.map