@alfadocs/ui-kit-debug 0.71.0 → 0.72.0

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

@@ -0,0 +1,778 @@
+import { jsx as t, jsxs as c, Fragment as te } from "react/jsx-runtime";
+import { forwardRef as ae, useId as A, useMemo as se, Fragment as ie, useState as v, useCallback as I } from "react";
+import { c as q } from "./index-D2ZczOXr.js";
+import { useTranslation as V } from "react-i18next";
+import { A as re } from "./avatar-BNQNhoyL.js";
+import { I as z } from "./icon-button-LqoiKcUN.js";
+import { C as F } from "./card-DPmk26CL.js";
+import { C as ne, b as le, a as oe } from "./collapsible-BrnRiCC6.js";
+import { D as de } from "./date-picker-CVkD_lOi.js";
+import { D as S } from "./description-list-CmBVxIF5.js";
+import { E as ce } from "./email-input-Dpe63k0K.js";
+import { F as pe } from "./fiscal-code-input-DKNXFXs3.js";
+import { N as ue } from "./number-input-DjWzmlEY.js";
+import { P as me } from "./panel-header-D313n_9-.js";
+import { P as fe } from "./phone-input-dtnrvnZf.js";
+import { S as ge } from "./select-BmCbJMJS.js";
+import { S as ye } from "./switch-OILsBLWo.js";
+import { T as be } from "./text-area-Bt3p7Pt0.js";
+import { T as he } from "./text-input-CUvCb6ST.js";
+import { C as ve } from "./country-select-DYHDLEjG.js";
+import { P as xe } from "./province-select-BDywtmL-.js";
+import { P as Ne } from "./postal-code-input-BznBxVxf.js";
+import { C as Ve } from "./city-input-towzBenY.js";
+import { u as Ce } from "./registry-DvAUVLHh.js";
+import { u as ke, F as we, r as De, a as Pe } from "./field-value-Dj3i52H2.js";
+import { c as Te } from "./createLucideIcon-DhHxpK9K.js";
+import { L as Fe } from "./lock-ClAFG1gy.js";
+import { C as H } from "./check-DrFSN__t.js";
+import { X as Ie } from "./x-B5YnXwCz.js";
+import { P as ze } from "./pencil-B1sKKyuT.js";
+import { C as Se } from "./copy-vRpqqHtY.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 Ee = [
+  ["rect", { width: "8", height: "4", x: "8", y: "2", rx: "1", ry: "1", key: "tgr4d6" }],
+  [
+    "path",
+    {
+      d: "M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2",
+      key: "116196"
+    }
+  ],
+  ["path", { d: "M12 11h4", key: "1jrz19" }],
+  ["path", { d: "M12 16h4", key: "n85exb" }],
+  ["path", { d: "M8 11h.01", key: "1dfujw" }],
+  ["path", { d: "M8 16h.01", key: "18s6g9" }]
+], Oe = Te("clipboard-list", Ee), je = {
+  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: (e) => e.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: (e) => e.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: (e, a) => {
+        e.setVisibleFields(a.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: (e, a) => {
+        e.setFieldOrder(a.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: (e, a) => e.updateField(a.fieldId, a.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)."
+    }
+  }
+}, R = q(
+  "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"
+    }
+  }
+), L = q("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"
+  }
+}), Ae = ae(
+  function({
+    title: a,
+    sections: n,
+    avatar: i,
+    headerChips: l,
+    framed: u = !1,
+    editable: r = !1,
+    onFieldSave: o,
+    validate: d,
+    visibleFieldOrder: g,
+    defaultVisibleFieldOrder: s,
+    onVisibleFieldsChange: b,
+    loading: C = !1,
+    emptyState: h,
+    patientId: m,
+    id: y,
+    locale: k,
+    cogLabel: E,
+    "aria-label": x,
+    className: w,
+    ...D
+  }, P) {
+    const { t: T } = V(), N = A(), {
+      visible: f,
+      catalogueIds: $,
+      setOrder: O,
+      toggleField: U,
+      toggleSection: W,
+      moveFieldOnto: Y,
+      reset: X
+    } = ke(n, {
+      value: g,
+      defaultValue: s,
+      onChange: b
+    }), G = se(
+      () => ({
+        getVisibleFieldOrder: () => f,
+        getPatientId: () => m,
+        setVisibleFields: (p) => O(p),
+        setFieldOrder: (p) => O(p),
+        updateField: (p, j) => o ? o(p, j) : Promise.reject(
+          new Error("PatientDetails: no onFieldSave handler is wired.")
+        )
+      }),
+      [f, m, O, o]
+    );
+    Ce(je, G, y);
+    const M = T("patientDetails.regionLabel", {
+      defaultValue: "Patient details"
+    }), J = x ?? M, _ = (i == null ? void 0 : i.name) ?? (typeof a == "string" ? a : void 0), Q = !!(i != null && i.src || _), Z = $.some((p) => f.includes(p));
+    if (C)
+      return /* @__PURE__ */ t(
+        "section",
+        {
+          ref: P,
+          "data-component": "patient-details",
+          "data-component-id": y,
+          "data-patient-id": m,
+          "aria-label": J,
+          "aria-busy": "true",
+          className: R({ className: w }),
+          ...D,
+          children: /* @__PURE__ */ t("div", { className: L(), children: /* @__PURE__ */ t(Re, {}) })
+        }
+      );
+    const ee = n.length === 0 || !Z, B = /* @__PURE__ */ c("div", { className: "ds:flex ds:items-start ds:gap-[var(--spacing-sm)]", children: [
+      Q ? /* @__PURE__ */ t(
+        re,
+        {
+          size: "md",
+          name: _,
+          src: i == null ? void 0 : i.src,
+          className: "ds:shrink-0"
+        }
+      ) : null,
+      /* @__PURE__ */ c("div", { className: "ds:flex ds:min-w-0 ds:flex-1 ds:flex-col ds:gap-[var(--spacing-2xs)]", children: [
+        /* @__PURE__ */ t("h3", { className: "ds:m-0 type-title-item ds:text-[color:var(--foreground)]", children: a }),
+        l ? /* @__PURE__ */ t("div", { className: "ds:flex ds:flex-wrap ds:items-center ds:gap-[var(--spacing-xs)]", children: l }) : null
+      ] })
+    ] });
+    return /* @__PURE__ */ c(
+      "section",
+      {
+        ref: P,
+        "data-component": "patient-details",
+        "data-component-id": y,
+        "data-patient-id": m,
+        "aria-labelledby": x ? void 0 : N,
+        "aria-label": x ?? void 0,
+        className: R({ className: w }),
+        ...D,
+        children: [
+          /* @__PURE__ */ t(
+            me,
+            {
+              title: M,
+              icon: /* @__PURE__ */ t(Oe, { "aria-hidden": "true" }),
+              headingId: N,
+              sticky: !0,
+              divider: !0,
+              actions: /* @__PURE__ */ t(
+                we,
+                {
+                  sections: n,
+                  visible: f,
+                  onToggleField: U,
+                  onToggleSection: W,
+                  onMoveFieldOnto: Y,
+                  onReset: X,
+                  label: E
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ c("div", { className: L(), children: [
+            u ? /* @__PURE__ */ t(F, { variant: "elevated", children: /* @__PURE__ */ t(F.Body, { children: B }) }) : B,
+            ee ? /* @__PURE__ */ t("p", { className: "ds:m-0 type-body-sm ds:text-[color:var(--muted-foreground)]", children: h ?? T("patientDetails.empty", {
+              defaultValue: "No patient selected."
+            }) }) : De(n, f).filter(({ fields: p }) => p.length > 0).map(({ section: p, fields: j }) => {
+              const K = /* @__PURE__ */ t(
+                Me,
+                {
+                  section: p,
+                  fields: j,
+                  editable: r,
+                  onFieldSave: o,
+                  validate: d,
+                  locale: k
+                }
+              );
+              return u ? /* @__PURE__ */ t(F, { variant: "elevated", children: /* @__PURE__ */ t(F.Body, { children: K }) }, p.id) : /* @__PURE__ */ t(ie, { children: K }, p.id);
+            })
+          ] })
+        ]
+      }
+    );
+  }
+);
+Ae.displayName = "PatientDetails";
+function Me({
+  section: e,
+  fields: a,
+  editable: n,
+  onFieldSave: i,
+  validate: l,
+  locale: u
+}) {
+  const { t: r } = V(), o = A(), d = e.collapsible ?? !0, g = a.length === 0 ? /* @__PURE__ */ t("p", { className: "ds:m-0 type-body-sm ds:text-[color:var(--muted-foreground)]", children: r("patientDetails.section.empty", {
+    defaultValue: "No fields shown."
+  }) }) : /* @__PURE__ */ t(
+    S,
+    {
+      layout: "inline",
+      density: "compact",
+      divider: "none",
+      className: "ds:[--description-list-icon-color:var(--accent)]",
+      children: a.map((s) => /* @__PURE__ */ t(
+        _e,
+        {
+          field: s,
+          icon: s.icon ?? null,
+          editable: n,
+          onFieldSave: i,
+          validate: l,
+          locale: u
+        },
+        s.id
+      ))
+    }
+  );
+  return d ? /* @__PURE__ */ c(
+    ne,
+    {
+      defaultOpen: e.defaultOpen ?? !0,
+      variant: "minimal",
+      className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]",
+      children: [
+        /* @__PURE__ */ t("h3", { className: "ds:m-0", children: /* @__PURE__ */ t(le, { asChild: !0, children: /* @__PURE__ */ t(
+          "button",
+          {
+            type: "button",
+            id: o,
+            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: e.heading
+          }
+        ) }) }),
+        /* @__PURE__ */ t(oe, { "aria-labelledby": o, children: g })
+      ]
+    }
+  ) : /* @__PURE__ */ c(
+    "section",
+    {
+      "aria-labelledby": o,
+      className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]",
+      children: [
+        /* @__PURE__ */ t(
+          "h3",
+          {
+            id: o,
+            className: "ds:m-0 type-eyebrow ds:text-[color:var(--foreground)]",
+            children: e.heading
+          }
+        ),
+        g
+      ]
+    }
+  );
+}
+function _e({
+  field: e,
+  icon: a,
+  editable: n,
+  onFieldSave: i,
+  validate: l,
+  locale: u
+}) {
+  const { t: r } = V(), o = A(), d = n && !!e.editable && !!i, [g, s] = v(!1), [b, C] = v(e.editValue), [h, m] = v(null), [y, k] = v(!1), E = I(() => {
+    C(e.editValue), m(null), s(!0);
+  }, [e.editValue]), x = I(() => {
+    s(!1), m(null);
+  }, []), w = I(async () => {
+    if (!i) return;
+    const N = (l == null ? void 0 : l(e.id, b)) ?? null;
+    if (N) {
+      m(N);
+      return;
+    }
+    k(!0), m(null);
+    try {
+      await i(e.id, b), s(!1);
+    } catch (f) {
+      m(
+        f instanceof Error && f.message ? f.message : r("patientDetails.edit.saveFailed", {
+          defaultValue: "Could not save. Try again."
+        })
+      );
+    } finally {
+      k(!1);
+    }
+  }, [i, l, e.id, b, r]), D = /* @__PURE__ */ c("span", { className: "ds:inline-flex ds:items-center ds:gap-[var(--spacing-2xs)]", children: [
+    e.label,
+    e.sensitive ? /* @__PURE__ */ t(
+      Fe,
+      {
+        "aria-label": r("patientDetails.sensitive", {
+          defaultValue: "Sensitive"
+        }),
+        className: "ds:size-3 ds:shrink-0 ds:text-[color:var(--muted-foreground)]"
+      }
+    ) : null
+  ] }), P = typeof e.value == "string" ? e.value : e.copyText ?? (typeof e.editValue == "string" ? e.editValue : void 0), T = g ? /* @__PURE__ */ c("span", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-2xs)]", children: [
+    /* @__PURE__ */ c("span", { className: "ds:flex ds:items-start ds:gap-[var(--spacing-2xs)]", children: [
+      /* @__PURE__ */ t(
+        Be,
+        {
+          field: e,
+          value: b,
+          onChange: C,
+          invalid: !!h,
+          errorId: h ? o : void 0,
+          locale: u,
+          disabled: y
+        }
+      ),
+      /* @__PURE__ */ t(
+        z,
+        {
+          size: "sm",
+          intent: "primary",
+          icon: /* @__PURE__ */ t(H, { "aria-hidden": "true" }),
+          "aria-label": r("patientDetails.edit.save", { defaultValue: "Save" }),
+          loading: y,
+          onClick: w
+        }
+      ),
+      /* @__PURE__ */ t(
+        z,
+        {
+          size: "sm",
+          intent: "ghost",
+          icon: /* @__PURE__ */ t(Ie, { "aria-hidden": "true" }),
+          "aria-label": r("patientDetails.edit.cancel", {
+            defaultValue: "Cancel"
+          }),
+          disabled: y,
+          onClick: x
+        }
+      )
+    ] }),
+    h ? /* @__PURE__ */ t(
+      "span",
+      {
+        id: o,
+        role: "alert",
+        className: "type-meta ds:text-[color:var(--destructive)]",
+        children: h
+      }
+    ) : null
+  ] }) : /* @__PURE__ */ c("span", { className: "ds:flex ds:items-start ds:gap-[var(--spacing-2xs)] ds:min-w-0", children: [
+    /* @__PURE__ */ t(
+      "span",
+      {
+        className: `ds:min-w-0 ${e.editType === "textarea" ? "" : "ds:truncate"}${e.mono ? " ds:font-mono" : ""}`,
+        title: P,
+        children: /* @__PURE__ */ t(Pe, { field: e })
+      }
+    ),
+    e.copyable && e.copyText ? /* @__PURE__ */ t(Ke, { text: e.copyText, label: e.label }) : null,
+    d ? /* @__PURE__ */ t(
+      z,
+      {
+        size: "sm",
+        intent: "ghost",
+        className: "ds:shrink-0 ds:opacity-0 ds:transition-opacity ds:motion-reduce:transition-none ds:group-hover:opacity-100 ds:focus-visible:opacity-100",
+        icon: /* @__PURE__ */ t(ze, { "aria-hidden": "true" }),
+        "aria-label": r("patientDetails.edit.editField", {
+          field: e.label,
+          defaultValue: "Edit {{field}}"
+        }),
+        onClick: E
+      }
+    ) : null
+  ] });
+  return /* @__PURE__ */ c(
+    S.Row,
+    {
+      icon: a ?? null,
+      "data-field-id": e.id,
+      className: "ds:group",
+      children: [
+        /* @__PURE__ */ t(S.Term, { children: D }),
+        /* @__PURE__ */ t(S.Detail, { children: T })
+      ]
+    }
+  );
+}
+function Be({
+  field: e,
+  value: a,
+  onChange: n,
+  invalid: i,
+  errorId: l,
+  locale: u,
+  disabled: r
+}) {
+  const { t: o } = V(), d = i ? "error" : "default";
+  switch (e.editType ?? "text") {
+    case "textarea":
+      return /* @__PURE__ */ t(
+        be,
+        {
+          size: "sm",
+          value: typeof a == "string" ? a : "",
+          onChange: (s) => n(s.target.value),
+          tone: d,
+          "aria-label": e.label,
+          "aria-invalid": i || void 0,
+          "aria-describedby": l,
+          disabled: r,
+          className: "ds:flex-1"
+        }
+      );
+    case "select":
+      return /* @__PURE__ */ t(
+        ge,
+        {
+          size: "sm",
+          options: e.options ?? [],
+          value: typeof a == "string" ? a : "",
+          onValueChange: (s) => n(s),
+          tone: d,
+          disabled: r,
+          "aria-label": e.label,
+          "aria-invalid": i || void 0,
+          "aria-describedby": l
+        }
+      );
+    case "boolean":
+      return /* @__PURE__ */ t(
+        ye,
+        {
+          label: e.label,
+          checked: a === !0,
+          onCheckedChange: (s) => n(s),
+          disabled: r
+        }
+      );
+    case "date":
+      return /* @__PURE__ */ t(
+        de,
+        {
+          size: "sm",
+          value: a instanceof Date ? a : void 0,
+          onChange: (s) => n(s ?? null),
+          disabled: r,
+          "aria-label": e.label
+        }
+      );
+    case "number":
+      return /* @__PURE__ */ t(
+        ue,
+        {
+          size: "sm",
+          value: typeof a == "number" ? a : null,
+          onChange: (s) => n(s),
+          mode: e.currency ? "currency" : "decimal",
+          currency: e.currency,
+          locale: u,
+          tone: d,
+          disabled: r,
+          "aria-label": e.label,
+          "aria-invalid": i || void 0,
+          "aria-describedby": l
+        }
+      );
+    case "email":
+      return /* @__PURE__ */ t(
+        ce,
+        {
+          size: "sm",
+          value: typeof a == "string" ? a : "",
+          onChange: (s) => n(s.target.value),
+          "aria-label": e.label,
+          "aria-invalid": i || void 0,
+          "aria-describedby": l,
+          disabled: r,
+          className: "ds:flex-1"
+        }
+      );
+    case "phone":
+      return /* @__PURE__ */ t(
+        fe,
+        {
+          size: "sm",
+          value: typeof a == "string" ? a : "",
+          onChange: (s) => n(s),
+          tone: d,
+          "aria-label": e.label,
+          "aria-invalid": i || void 0,
+          "aria-describedby": l,
+          disabled: r,
+          className: "ds:flex-1"
+        }
+      );
+    case "fiscalCode":
+      return /* @__PURE__ */ t(
+        pe,
+        {
+          size: "sm",
+          value: typeof a == "string" ? a : "",
+          onChange: (s) => n(s),
+          tone: d,
+          "aria-label": e.label,
+          "aria-invalid": i || void 0,
+          "aria-describedby": l,
+          disabled: r,
+          className: "ds:flex-1"
+        }
+      );
+    // Address / location pickers. Inline edit has no FormField, so we pass
+    // aria-invalid / aria-describedby explicitly (the components fall back to
+    // these props outside a FormFieldContext) so the invalid state isn't
+    // conveyed by colour alone.
+    case "province":
+      return /* @__PURE__ */ t(
+        xe,
+        {
+          size: "sm",
+          country: "it",
+          value: typeof a == "string" ? a : "",
+          onValueChange: (s) => n(s),
+          tone: d,
+          disabled: r,
+          "aria-label": e.label,
+          "aria-invalid": i || void 0,
+          "aria-describedby": l,
+          className: "ds:flex-1"
+        }
+      );
+    case "country":
+      return /* @__PURE__ */ t(
+        ve,
+        {
+          size: "sm",
+          value: typeof a == "string" ? a : "",
+          onValueChange: (s) => n(s),
+          tone: d,
+          disabled: r,
+          "aria-label": e.label,
+          "aria-invalid": i || void 0,
+          "aria-describedby": l,
+          className: "ds:flex-1"
+        }
+      );
+    case "postalCode":
+      return /* @__PURE__ */ t(
+        Ne,
+        {
+          size: "sm",
+          country: "it",
+          value: typeof a == "string" ? a : "",
+          onValueChange: (s) => n(s),
+          "aria-label": e.label,
+          "aria-invalid": i || void 0,
+          "aria-describedby": l,
+          disabled: r,
+          className: "ds:flex-1"
+        }
+      );
+    case "city":
+      return /* @__PURE__ */ t(
+        Ve,
+        {
+          size: "sm",
+          value: typeof a == "string" ? a : "",
+          onValueChange: (s) => n(s),
+          tone: d,
+          disabled: r,
+          "aria-label": e.label,
+          "aria-invalid": i || void 0,
+          "aria-describedby": l,
+          className: "ds:flex-1"
+        }
+      );
+    case "text":
+    default:
+      return /* @__PURE__ */ t(
+        he,
+        {
+          size: "sm",
+          value: typeof a == "string" ? a : "",
+          onChange: (s) => n(s.target.value),
+          tone: d,
+          "aria-label": e.label,
+          "aria-invalid": i || void 0,
+          "aria-describedby": l,
+          disabled: r,
+          clearable: !0,
+          placeholder: o("patientDetails.edit.placeholder", {
+            defaultValue: "Enter a value"
+          }),
+          className: "ds:flex-1"
+        }
+      );
+  }
+}
+function Ke({
+  text: e,
+  label: a
+}) {
+  const { t: n } = V(), [i, l] = v(!1), [u, r] = v(""), o = I(async () => {
+    try {
+      await navigator.clipboard.writeText(e), l(!0), r(n("keyValuePair.copied", { defaultValue: "Copied" })), setTimeout(() => {
+        l(!1), r("");
+      }, 2e3);
+    } catch {
+      r(
+        n("keyValuePair.notAvailable", { defaultValue: "Copy not available" })
+      ), setTimeout(() => r(""), 3e3);
+    }
+  }, [e, n]);
+  return /* @__PURE__ */ c(te, { children: [
+    /* @__PURE__ */ t(
+      z,
+      {
+        size: "sm",
+        intent: "ghost",
+        icon: i ? /* @__PURE__ */ t(H, { "aria-hidden": "true" }) : /* @__PURE__ */ t(Se, { "aria-hidden": "true" }),
+        "aria-label": n("keyValuePair.copy", {
+          label: a,
+          defaultValue: "Copy {{label}}"
+        }),
+        onClick: o
+      }
+    ),
+    /* @__PURE__ */ t("span", { role: "status", className: "ds:sr-only", children: u })
+  ] });
+}
+function Re() {
+  return /* @__PURE__ */ c("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-md)]", children: [
+    /* @__PURE__ */ c("div", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-sm)]", children: [
+      /* @__PURE__ */ t("span", { className: "ds:size-10 ds:shrink-0 ds:rounded-full ds:bg-[color:var(--muted)]" }),
+      /* @__PURE__ */ t("span", { className: "ds:h-4 ds:w-1/2 ds:rounded-[var(--radius-sm)] ds:bg-[color:var(--muted)]" })
+    ] }),
+    [0, 1, 2].map((e) => /* @__PURE__ */ t(
+      "span",
+      {
+        className: "ds:h-4 ds:w-full ds:rounded-[var(--radius-sm)] ds:bg-[color:var(--muted)]"
+      },
+      e
+    ))
+  ] });
+}
+export {
+  Ae as P,
+  je as p
+};
+//# sourceMappingURL=patient-details-pU_E5xM2.js.map