@alfadocs/ui-kit-debug 0.71.0 → 0.72.0

package/dist/_chunks/patient-search-X9SUZGpy.js

@@ -0,0 +1,1167 @@
+import { jsx as a, jsxs as x } from "react/jsx-runtime";
+import { forwardRef as de, useRef as N, useEffect as V, useMemo as X, useImperativeHandle as ce, useState as W, useCallback as z, useId as le } from "react";
+import { c as T } from "./index-D2ZczOXr.js";
+import { useTranslation as j } from "react-i18next";
+import { A as se } from "./autocomplete-BrONKN8l.js";
+import { B as ue } from "./button-DD_0Xdmr.js";
+import { C as M } from "./card-DPmk26CL.js";
+import { S as fe } from "./slider-DN1CWkKB.js";
+import { A as Z } from "./alert-KJbsPYkI.js";
+import { D as F } from "./dropdown-menu-DU-Hrf33.js";
+import { u as pe } from "./registry-DvAUVLHh.js";
+import { S as re } from "./search-QbWPlY5f.js";
+import { X as ne } from "./x-B5YnXwCz.js";
+import { c as me } from "./createLucideIcon-DhHxpK9K.js";
+import { M as he } from "./map-pin-BaY37-Km.js";
+import { S as ve } from "./stethoscope-sZXGC43m.js";
+import { C as ge } from "./chevron-down-DWE7GSq9.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 be = [
+  ["line", { x1: "2", x2: "5", y1: "12", y2: "12", key: "bvdh0s" }],
+  ["line", { x1: "19", x2: "22", y1: "12", y2: "12", key: "1tbv5k" }],
+  ["line", { x1: "12", x2: "12", y1: "2", y2: "5", key: "11lu5j" }],
+  ["line", { x1: "12", x2: "12", y1: "19", y2: "22", key: "x3vr5v" }],
+  ["circle", { cx: "12", cy: "12", r: "7", key: "fim9np" }],
+  ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
+], ye = me("locate-fixed", be), xe = {
+  id: "patient-search",
+  // `filter` is the conceptual capability of this search widget. Building the
+  // actual query (WHO/WHERE/WHEN/facets/geo) is host-delegated: selection is
+  // owned by the consumer via the `value` / `onChange` contract, so the agent
+  // surface here is limited to clearing the query (`reset`) and focusing the
+  // primary field. The previous `navigate` / `view_change` capabilities were
+  // spurious — the variant is fixed by props (not agent-settable) and no
+  // action navigates.
+  capabilities: ["filter"],
+  state: {
+    variant: {
+      type: "string",
+      descriptionKey: "ui.agent.patientSearch.state.variant",
+      description: "Active variant — one of `who-where`, `who-where-when`, `faceted`, `discovery`.",
+      read: (e) => e.getVariant()
+    }
+  },
+  actions: {
+    reset: {
+      safety: "write",
+      idempotent: !0,
+      descriptionKey: "ui.agent.patientSearch.actions.reset",
+      description: "Clear the current search query (WHO, WHERE, WHEN, facets, geo) via the consumer-owned onChange.",
+      invoke: (e) => {
+        e.reset();
+      }
+    },
+    focus_primary: {
+      safety: "read",
+      idempotent: !0,
+      descriptionKey: "ui.agent.patientSearch.actions.focusPrimary",
+      description: "Move keyboard focus to the most-relevant search field for the current variant.",
+      invoke: (e) => {
+        e.focusPrimary();
+      }
+    }
+  },
+  domHooks: {
+    root: {
+      attr: "data-component",
+      value: "patient-search",
+      description: "Marks the PatientSearch root region."
+    },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop."
+    }
+  }
+};
+function _(e, s) {
+  if (typeof window > "u") return;
+  const t = window.track;
+  try {
+    t == null || t(e, s);
+  } catch {
+  }
+}
+const A = [
+  "today",
+  "tomorrow",
+  "this_week",
+  "anytime"
+], O = [1, 5, 10, 25, 50], Y = 5, ie = 200;
+function we(e) {
+  let s = 0, t = Number.POSITIVE_INFINITY;
+  return O.forEach((i, p) => {
+    const v = Math.abs(i - e);
+    v < t && (t = v, s = p);
+  }), s;
+}
+const _e = T(
+  "ds:flex ds:w-full ds:flex-col ds:text-[var(--foreground)]",
+  {
+    variants: {
+      variant: {
+        "who-where": "ds:gap-[var(--spacing-md)]",
+        "who-where-when": "ds:gap-[var(--spacing-md)]",
+        faceted: "ds:gap-[var(--spacing-md)]",
+        discovery: "ds:gap-[var(--spacing-lg)]"
+      }
+    },
+    defaultVariants: { variant: "who-where" }
+  }
+);
+function H({
+  value: e,
+  onChange: s,
+  loadObjects: t,
+  onObjectSelect: i,
+  inputRef: p
+}) {
+  var d, f, m, b;
+  const { t: v } = j(), [g, u] = W(((d = e.object) == null ? void 0 : d.label) ?? ""), c = N((f = e.object) == null ? void 0 : f.value);
+  V(() => {
+    var h, o, S;
+    ((h = e.object) == null ? void 0 : h.value) !== c.current && (c.current = (o = e.object) == null ? void 0 : o.value, u(((S = e.object) == null ? void 0 : S.label) ?? ""));
+  }, [(m = e.object) == null ? void 0 : m.value, (b = e.object) == null ? void 0 : b.label]);
+  const r = z(
+    async (h, { signal: o }) => await t(h, { signal: o }),
+    [t]
+  ), l = (h) => {
+    const o = {
+      value: h.value,
+      label: h.label,
+      description: h.description,
+      __payload: h.__payload
+    };
+    u(o.label), c.current = o.value, s({ ...e, object: o }), _("patient_search_object_selected", {
+      value: o.value,
+      type: o.__payload && typeof o.__payload == "object" ? o.__payload.type : void 0
+    }), i == null || i(o);
+  }, n = N(!1);
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      "data-component": "patient-search-field",
+      "data-field": "who",
+      onFocus: () => {
+        n.current || (n.current = !0, _("patient_search_object_focused"));
+      },
+      onBlur: (h) => {
+        h.currentTarget && !h.currentTarget.contains(h.relatedTarget) && (n.current = !1);
+      },
+      children: /* @__PURE__ */ a(
+        se,
+        {
+          ref: p,
+          value: g,
+          onChange: (h) => {
+            u(h), e.object && h !== e.object.label && (c.current = void 0, s({ ...e, object: void 0 }));
+          },
+          onSelect: l,
+          loadOptions: r,
+          debounceMs: ie,
+          placeholder: v("patientSearch.who.placeholder"),
+          "aria-label": v("patientSearch.who.label"),
+          startAdornment: /* @__PURE__ */ a(re, { "aria-hidden": "true" })
+        }
+      )
+    }
+  );
+}
+const ee = [
+  "ds:inline-flex ds:items-center ds:justify-center",
+  "ds:size-8 ds:rounded-[var(--radius-sm)]",
+  "ds:text-[color:var(--muted-foreground)] ds:hover:text-[color:var(--primary)]",
+  "ds:hover:bg-[color-mix(in_srgb,var(--primary)_8%,transparent)]",
+  "ds:aria-pressed:text-[color:var(--primary)]",
+  "ds:aria-pressed:bg-[color-mix(in_srgb,var(--primary)_12%,transparent)]",
+  "ds:disabled:opacity-50 ds:disabled:cursor-not-allowed",
+  "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)]",
+  "ds:forced-colors:focus-visible:outline-[CanvasText]"
+].join(" ");
+function q({
+  value: e,
+  onChange: s,
+  loadPlaces: t,
+  onPlaceSelect: i,
+  inputRef: p,
+  defaultRadiusKm: v = Y,
+  reverseGeocode: g
+}) {
+  var P, B, C, E;
+  const { t: u } = j(), [c, r] = W(((P = e.place) == null ? void 0 : P.label) ?? ""), l = N((B = e.place) == null ? void 0 : B.value), n = e.geo ? "granted" : "pristine", [d, f] = W(n);
+  V(() => {
+    var y, w, k;
+    ((y = e.place) == null ? void 0 : y.value) !== l.current && (l.current = (w = e.place) == null ? void 0 : w.value, r(((k = e.place) == null ? void 0 : k.label) ?? ""));
+  }, [(C = e.place) == null ? void 0 : C.value, (E = e.place) == null ? void 0 : E.label]);
+  const m = z(
+    async (y, { signal: w }) => await t(y, { signal: w }),
+    [t]
+  ), b = (y) => {
+    const w = {
+      value: y.value,
+      label: y.label,
+      lat: y.lat,
+      lng: y.lng
+    };
+    r(w.label), l.current = w.value, s({ ...e, place: w, geo: void 0 }), d === "granted" && f("pristine"), _("patient_search_place_selected", { value: w.value }), i == null || i(w);
+  }, h = () => {
+    if (typeof window > "u" || !(navigator != null && navigator.geolocation)) {
+      f("denied"), _("patient_search_geo_denied", { reason: "unsupported" });
+      return;
+    }
+    f("requesting"), _("patient_search_place_focused"), navigator.geolocation.getCurrentPosition(
+      async (y) => {
+        const { latitude: w, longitude: k } = y.coords;
+        let R;
+        try {
+          R = await (g == null ? void 0 : g(w, k));
+        } catch {
+          R = void 0;
+        }
+        const K = v, I = R ?? u("patientSearch.geo.fallbackLabel"), oe = {
+          value: `geo:${w.toFixed(4)},${k.toFixed(4)}`,
+          label: I,
+          lat: w,
+          lng: k
+        };
+        s({
+          ...e,
+          place: oe,
+          geo: {
+            lat: w,
+            lng: k,
+            radiusKm: K,
+            label: I
+          }
+        }), f("granted"), _("patient_search_geo_granted", { radiusKm: K });
+      },
+      () => {
+        f("denied"), _("patient_search_geo_denied", { reason: "user" });
+      },
+      { enableHighAccuracy: !1, maximumAge: 6e4, timeout: 1e4 }
+    );
+  }, o = () => {
+    s({ ...e, geo: void 0, place: void 0 }), r(""), l.current = void 0, f("pristine");
+  }, S = d === "granted" && !!e.geo, G = d === "requesting", L = d === "denied", D = N(!1), Q = L || !!!g ? null : /* @__PURE__ */ x("span", { className: "ds:absolute ds:end-[var(--spacing-xs)] ds:top-1/2 ds:-translate-y-1/2 ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]", children: [
+    S ? /* @__PURE__ */ a(
+      "button",
+      {
+        type: "button",
+        "aria-label": u("patientSearch.geo.clear"),
+        onClick: o,
+        className: ee,
+        children: /* @__PURE__ */ a(ne, { "aria-hidden": "true", className: "ds:size-4" })
+      }
+    ) : null,
+    /* @__PURE__ */ a(
+      "button",
+      {
+        type: "button",
+        "aria-label": u("patientSearch.geo.cta"),
+        "aria-pressed": S || void 0,
+        disabled: G,
+        onClick: S ? o : h,
+        className: ee,
+        children: /* @__PURE__ */ a(ye, { "aria-hidden": "true", className: "ds:size-4" })
+      }
+    )
+  ] });
+  return /* @__PURE__ */ x(
+    "div",
+    {
+      "data-component": "patient-search-field",
+      "data-field": "where",
+      onFocus: () => {
+        D.current || (D.current = !0, _("patient_search_place_focused"));
+      },
+      onBlur: (y) => {
+        y.currentTarget && !y.currentTarget.contains(y.relatedTarget) && (D.current = !1);
+      },
+      className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]",
+      children: [
+        /* @__PURE__ */ x("div", { className: "ds:relative", children: [
+          /* @__PURE__ */ a(
+            se,
+            {
+              ref: p,
+              value: c,
+              onChange: (y) => {
+                r(y), e.place && y !== e.place.label && (l.current = void 0, s({ ...e, place: void 0, geo: void 0 }), d === "granted" && f("pristine"));
+              },
+              onSelect: b,
+              loadOptions: m,
+              debounceMs: ie,
+              placeholder: u("patientSearch.where.placeholder"),
+              "aria-label": u("patientSearch.where.label"),
+              startAdornment: /* @__PURE__ */ a(he, { "aria-hidden": "true" }),
+              endAdornment: L ? void 0 : (
+                // Decorative spacer — reserves inline-end room so the typed
+                // text doesn't run under the absolutely-positioned overlay.
+                // Autocomplete wraps endAdornment in `aria-hidden`, which is
+                // correct for this empty span. Granted-state shows an extra
+                // clear-X chip, so the spacer doubles in width when granted.
+                /* @__PURE__ */ a(
+                  "span",
+                  {
+                    "aria-hidden": "true",
+                    className: S ? "ds:inline-block ds:size-[4.5rem]" : "ds:inline-block ds:size-8"
+                  }
+                )
+              )
+            }
+          ),
+          Q
+        ] }),
+        L ? (
+          // Alert defaults to `role="status"` + `aria-live="polite"` for the
+          // `info` variant — the user hears why the field reverted to plain
+          // text when their browser blocked the geolocation prompt.
+          /* @__PURE__ */ a(Z, { variant: "info", children: /* @__PURE__ */ a(Z.Description, { children: u("patientSearch.geo.denied") }) })
+        ) : null
+      ]
+    }
+  );
+}
+function $({
+  value: e,
+  onChange: s,
+  defaultRadiusKm: t = Y
+}) {
+  const { t: i } = j(), [p, v] = W(
+    () => {
+      var c;
+      return we(((c = e.geo) == null ? void 0 : c.radiusKm) ?? t);
+    }
+  );
+  if (!e.geo) return null;
+  const g = (c) => {
+    const r = O[c] ?? t;
+    s({ ...e, geo: { ...e.geo, radiusKm: r } }), _("patient_search_radius_changed", { radiusKm: r });
+  }, u = (c) => {
+    const r = O[Math.round(c)] ?? t;
+    return i("patientSearch.geo.radiusFormat", { km: r });
+  };
+  return /* @__PURE__ */ x(
+    "div",
+    {
+      "data-component": "patient-search-geo-radius-bar",
+      className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)] ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:pb-[var(--spacing-md)]",
+      children: [
+        /* @__PURE__ */ a(
+          "span",
+          {
+            id: "patient-search-radius-label",
+            className: "type-meta ds:text-[color:var(--muted-foreground)]",
+            children: i("patientSearch.geo.radius")
+          }
+        ),
+        /* @__PURE__ */ a(
+          fe,
+          {
+            value: [p],
+            min: 0,
+            max: O.length - 1,
+            step: 1,
+            marks: O.map((c, r) => ({
+              value: r,
+              label: `${c}`
+            })),
+            formatValue: u,
+            alwaysShowValue: !0,
+            "aria-labelledby": "patient-search-radius-label",
+            onValueChange: (c) => v(c[0] ?? 0),
+            onValueCommit: (c) => g(c[0] ?? 0)
+          }
+        )
+      ]
+    }
+  );
+}
+const Se = T(
+  [
+    "ds:inline-flex ds:items-center ds:justify-center",
+    "ds:min-h-[var(--min-target-size)]",
+    "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
+    "ds:pt-[var(--spacing-xs)] ds:pb-[var(--spacing-xs)]",
+    "ds:rounded-[var(--radius-full)]",
+    "type-label ds:font-[var(--font-weight-medium)]",
+    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+    "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)]",
+    "ds:forced-colors:focus-visible:outline-[CanvasText]"
+  ].join(" "),
+  {
+    variants: {
+      state: {
+        idle: "ds:bg-[var(--secondary)] ds:text-[var(--foreground)] ds:border ds:border-[color:var(--border)] ds:hover:bg-[color-mix(in_srgb,var(--primary)_8%,var(--secondary))]",
+        selected: "ds:bg-[var(--primary)] ds:text-[var(--primary-foreground)] ds:border ds:border-transparent ds:font-[var(--font-weight-semibold)]"
+      }
+    },
+    defaultVariants: { state: "idle" }
+  }
+);
+function Ne({ value: e, onChange: s }) {
+  const { t, i18n: i } = j(), p = le(), v = i.dir() === "rtl", g = N(/* @__PURE__ */ new Map()), u = z((n) => {
+    var d;
+    (d = g.current.get(n)) == null || d.focus();
+  }, []), c = z(
+    (n, d) => {
+      const f = A.indexOf(d), m = A.length, b = v ? "ArrowLeft" : "ArrowRight", h = v ? "ArrowRight" : "ArrowLeft";
+      switch (n.key) {
+        case b:
+        case "ArrowDown": {
+          n.preventDefault();
+          const o = A[(f + 1) % m];
+          s(o), _("patient_search_when_selected", { when: o }), u(o);
+          break;
+        }
+        case h:
+        case "ArrowUp": {
+          n.preventDefault();
+          const o = A[(f - 1 + m) % m];
+          s(o), _("patient_search_when_selected", { when: o }), u(o);
+          break;
+        }
+        case "Home": {
+          n.preventDefault();
+          const o = A[0];
+          s(o), _("patient_search_when_selected", { when: o }), u(o);
+          break;
+        }
+        case "End": {
+          n.preventDefault();
+          const o = A[m - 1];
+          s(o), _("patient_search_when_selected", { when: o }), u(o);
+          break;
+        }
+      }
+    },
+    [u, v, s]
+  ), r = e ?? "anytime", l = {
+    today: "patientSearch.when.today",
+    tomorrow: "patientSearch.when.tomorrow",
+    this_week: "patientSearch.when.thisWeek",
+    anytime: "patientSearch.when.anytime"
+  };
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      role: "radiogroup",
+      "aria-label": t("patientSearch.when.label"),
+      id: p,
+      className: "ds:flex ds:flex-wrap ds:items-center ds:gap-[var(--spacing-xs)]",
+      children: A.map((n) => {
+        const d = e === n, f = r === n, m = t(l[n]);
+        return /* @__PURE__ */ a(
+          "button",
+          {
+            type: "button",
+            role: "radio",
+            "aria-checked": d,
+            "aria-label": m,
+            tabIndex: f ? 0 : -1,
+            ref: (b) => {
+              b ? g.current.set(n, b) : g.current.delete(n);
+            },
+            onClick: () => {
+              s(n), _("patient_search_when_selected", { when: n });
+            },
+            onKeyDown: (b) => c(b, n),
+            className: Se({
+              state: d ? "selected" : "idle"
+            }),
+            children: m
+          },
+          n
+        );
+      })
+    }
+  );
+}
+const ae = T(
+  [
+    "ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]",
+    "ds:min-h-[var(--min-target-size)]",
+    "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
+    "ds:pt-[var(--spacing-xs)] ds:pb-[var(--spacing-xs)]",
+    "ds:rounded-[var(--radius-full)]",
+    "type-label",
+    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+    "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)]",
+    "ds:forced-colors:focus-visible:outline-[CanvasText]"
+  ].join(" "),
+  {
+    variants: {
+      // Matches the WHEN chip strip's `selected` look — solid primary fill,
+      // primary-foreground text, transparent border. The earlier
+      // `color-mix(primary 12% / secondary)` tint read as a washed-out
+      // colour over the grey input row and didn't visually signal "this
+      // filter is active" with enough weight. Solid fill matches the kit's
+      // toggle-button precedent (SuggestionChip's `suggestion` intent + the
+      // ServiceGrid radio's selected state in Booking).
+      state: {
+        idle: "ds:bg-[var(--secondary)] ds:text-[var(--foreground)] ds:border ds:border-[color:var(--border)] ds:hover:bg-[color-mix(in_srgb,var(--primary)_8%,var(--secondary))]",
+        active: "ds:bg-[var(--primary)] ds:text-[var(--primary-foreground)] ds:border ds:border-transparent ds:font-[var(--font-weight-semibold)]"
+      }
+    },
+    defaultVariants: { state: "idle" }
+  }
+);
+function ke({ facets: e, value: s, onChange: t }) {
+  const { t: i } = j(), p = X(() => s ?? {}, [s]), v = X(
+    () => Object.values(p).some((r) => r && r.length > 0),
+    [p]
+  ), g = (r, l) => {
+    const n = { ...p };
+    l.length === 0 ? delete n[r] : n[r] = l, t(n), _("patient_search_facet_changed", { key: r, values: l });
+  }, u = (r) => {
+    var n;
+    const l = (((n = p[r]) == null ? void 0 : n.length) ?? 0) > 0;
+    g(r, l ? [] : ["true"]);
+  }, c = (r, l) => {
+    const n = p[r.key] ?? [], d = n.includes(l);
+    let f;
+    r.multi ? f = d ? n.filter((m) => m !== l) : [...n, l] : f = d ? [] : [l], g(r.key, f);
+  };
+  return /* @__PURE__ */ x(
+    "div",
+    {
+      role: "group",
+      "aria-label": i("patientSearch.facets.label"),
+      className: "ds:flex ds:flex-wrap ds:items-center ds:gap-[var(--spacing-xs)]",
+      children: [
+        e.map((r) => {
+          const l = r.options.length === 0, n = p[r.key] ?? [], d = n.length > 0;
+          if (l)
+            return /* @__PURE__ */ a(
+              "button",
+              {
+                type: "button",
+                "aria-pressed": d,
+                "aria-label": r.label,
+                onClick: () => u(r.key),
+                className: ae({
+                  state: d ? "active" : "idle"
+                }),
+                children: /* @__PURE__ */ a("span", { children: r.label })
+              },
+              r.key
+            );
+          const f = d ? ` (${n.length})` : "";
+          return /* @__PURE__ */ x(F.Root, { children: [
+            /* @__PURE__ */ a(F.Trigger, { asChild: !0, children: /* @__PURE__ */ x(
+              "button",
+              {
+                type: "button",
+                "aria-label": `${r.label}${f}`,
+                className: ae({
+                  state: d ? "active" : "idle"
+                }),
+                children: [
+                  /* @__PURE__ */ x("span", { children: [
+                    r.label,
+                    f
+                  ] }),
+                  /* @__PURE__ */ a(
+                    ge,
+                    {
+                      "aria-hidden": "true",
+                      className: "ds:size-3.5 ds:shrink-0"
+                    }
+                  )
+                ]
+              }
+            ) }),
+            /* @__PURE__ */ a(F.Content, { sideOffset: 8, align: "start", children: r.options.map((m) => /* @__PURE__ */ a(
+              F.CheckboxItem,
+              {
+                checked: n.includes(m.value),
+                onSelect: (b) => {
+                  r.multi && b.preventDefault(), c(r, m.value);
+                },
+                children: m.label
+              },
+              m.value
+            )) })
+          ] }, r.key);
+        }),
+        v ? /* @__PURE__ */ x(
+          "button",
+          {
+            type: "button",
+            onClick: () => {
+              t({}), _("patient_search_facet_changed", { key: "*", values: [] });
+            },
+            className: [
+              "ds:ms-[var(--spacing-xs)] ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]",
+              "ds:min-h-[var(--min-target-size)] ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)]",
+              "type-label ds:text-[color:var(--muted-foreground)]",
+              "ds:rounded-[var(--radius-sm)]",
+              "ds:hover:text-[color:var(--foreground)]",
+              "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)]"
+            ].join(" "),
+            children: [
+              /* @__PURE__ */ a(ne, { "aria-hidden": "true", className: "ds:size-3.5" }),
+              i("patientSearch.facets.clear")
+            ]
+          }
+        ) : null
+      ]
+    }
+  );
+}
+const te = ["violet", "purple", "magenta", "blue"], Re = T(
+  [
+    "ds:relative ds:flex ds:h-full ds:flex-col ds:gap-[var(--spacing-sm)]",
+    "ds:rounded-[var(--radius-lg)] ds:overflow-hidden",
+    "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
+    "ds:pt-[var(--spacing-md)] ds:pb-[var(--spacing-md)]",
+    "ds:bg-[var(--card)] ds:text-[var(--card-foreground)]",
+    "ds:border ds:border-[color:var(--card-border)]",
+    "ds:shadow-[var(--shadow-sm)]",
+    "ds:transition-[transform,box-shadow] ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+    "ds:motion-safe:hover:-translate-y-0.5",
+    "ds:hover:shadow-[var(--shadow-md)]",
+    "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)]",
+    "ds:no-underline"
+  ].join(" ")
+), je = T(
+  "ds:absolute ds:inset-inline-0 ds:top-0 ds:h-[3px] ds:pointer-events-none",
+  {
+    variants: {
+      accent: {
+        violet: "ds:bg-[var(--color-violet-500)]",
+        purple: "ds:bg-[var(--color-purple-500)]",
+        magenta: "ds:bg-[var(--color-magenta-500)]",
+        blue: "ds:bg-[var(--color-blue-500)]"
+      }
+    },
+    defaultVariants: { accent: "violet" }
+  }
+), Ae = T(
+  "ds:inline-flex ds:size-9 ds:items-center ds:justify-center ds:rounded-[var(--radius-md)]",
+  {
+    variants: {
+      accent: {
+        violet: "ds:bg-[color-mix(in_srgb,var(--color-violet-500)_12%,var(--background))] ds:text-[var(--color-violet-700)]",
+        purple: "ds:bg-[color-mix(in_srgb,var(--color-purple-500)_12%,var(--background))] ds:text-[var(--color-purple-700)]",
+        magenta: "ds:bg-[color-mix(in_srgb,var(--color-magenta-500)_12%,var(--background))] ds:text-[var(--color-magenta-700)]",
+        blue: "ds:bg-[color-mix(in_srgb,var(--color-blue-500)_12%,var(--background))] ds:text-[var(--color-blue-700)]"
+      }
+    },
+    defaultVariants: { accent: "violet" }
+  }
+);
+function Ce(e, s) {
+  return e && e !== "auto" ? e : te[s % te.length];
+}
+function Ee({ cards: e }) {
+  const { t: s } = j();
+  return e.length === 0 ? /* @__PURE__ */ a("p", { className: "type-body-sm ds:text-[color:var(--muted-foreground)] ds:m-0", children: s("patientSearch.discovery.empty") }) : /* @__PURE__ */ x("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-md)]", children: [
+    /* @__PURE__ */ a("h3", { className: "type-title-card ds:text-[var(--foreground)] ds:m-0", children: s("patientSearch.discovery.heading") }),
+    /* @__PURE__ */ a(
+      "ul",
+      {
+        className: [
+          "ds:grid ds:grid-cols-1 ds:gap-[var(--spacing-md)]",
+          "ds:md:grid-cols-2 ds:lg:grid-cols-3",
+          "ds:m-0 ds:p-0 ds:list-none"
+        ].join(" "),
+        children: e.map((t, i) => {
+          const p = Ce(t.accent, i);
+          return /* @__PURE__ */ a("li", { children: /* @__PURE__ */ x(
+            "a",
+            {
+              href: t.href,
+              "data-component": "patient-search-card",
+              "data-card-id": t.id,
+              "aria-label": t.description ? `${t.label} — ${t.description}` : t.label,
+              onClick: () => _("patient_search_discovery_card_clicked", {
+                cardId: t.id
+              }),
+              className: Re(),
+              children: [
+                /* @__PURE__ */ a(
+                  "span",
+                  {
+                    "aria-hidden": "true",
+                    className: je({ accent: p })
+                  }
+                ),
+                /* @__PURE__ */ x("span", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-sm)]", children: [
+                  /* @__PURE__ */ a(
+                    "span",
+                    {
+                      "aria-hidden": "true",
+                      className: Ae({ accent: p }),
+                      children: t.icon ?? /* @__PURE__ */ a(ve, { className: "ds:size-4", "aria-hidden": "true" })
+                    }
+                  ),
+                  t.badge ? (
+                    // The badge sits inside a softly-tinted accent bubble
+                    // (15% accent + 85% background). The text colour must
+                    // contrast with that mix, not with the accent's canonical
+                    // foreground — `--accent-foreground` is calibrated against
+                    // the 100% accent surface and fails AA on the 15% tint.
+                    // Use `--foreground` which contrasts with the
+                    // mostly-background mix in both light and dark themes.
+                    /* @__PURE__ */ a("span", { className: "type-meta ds:ms-auto ds:inline-flex ds:items-center ds:rounded-[var(--radius-full)] ds:border ds:border-[color:var(--foreground)] ds:bg-[color-mix(in_srgb,var(--accent)_15%,var(--background))] ds:text-[color:var(--foreground)] ds:font-[var(--font-weight-semibold)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:pt-[var(--spacing-xs)] ds:pb-[var(--spacing-xs)]", children: t.badge })
+                  ) : null
+                ] }),
+                /* @__PURE__ */ a("span", { className: "type-label ds:font-[var(--font-weight-semibold)] ds:text-[var(--foreground)]", children: t.label }),
+                t.description ? /* @__PURE__ */ a("span", { className: "type-body-sm ds:text-[color:var(--muted-foreground)]", children: t.description }) : null
+              ]
+            }
+          ) }, t.id);
+        })
+      }
+    )
+  ] });
+}
+function Te(e) {
+  if (e.object || e.place || e.geo || e.when && e.when !== "anytime") return !0;
+  if (e.facets) {
+    for (const s of Object.values(e.facets))
+      if (s && s.length > 0) return !0;
+  }
+  return !1;
+}
+function U({
+  value: e,
+  variant: s,
+  submitting: t,
+  submitLabel: i,
+  allowEmptySubmit: p,
+  onSubmit: v
+}) {
+  const { t: g } = j(), u = t || !p && !Te(e), c = i ?? g("patientSearch.submit.cta");
+  return /* @__PURE__ */ a(
+    ue,
+    {
+      type: "button",
+      intent: "primary",
+      size: "lg",
+      startIcon: /* @__PURE__ */ a(re, { "aria-hidden": "true" }),
+      loading: t,
+      disabled: u,
+      onClick: () => {
+        _("patient_search_submitted", {
+          variant: s,
+          hasObject: !!e.object,
+          hasPlace: !!e.place,
+          hasGeo: !!e.geo,
+          when: e.when,
+          facetKeys: e.facets ? Object.keys(e.facets) : []
+        }), v(e);
+      },
+      children: c
+    }
+  );
+}
+function Le(e) {
+  const {
+    variant: s,
+    value: t,
+    onChange: i,
+    onSubmit: p,
+    loadObjects: v,
+    loadPlaces: g,
+    onObjectSelect: u,
+    onPlaceSelect: c,
+    submitting: r,
+    submitLabel: l,
+    allowEmptySubmit: n,
+    whoRef: d,
+    whereRef: f,
+    defaultRadiusKm: m,
+    reverseGeocode: b,
+    cardLabel: h
+  } = e;
+  return /* @__PURE__ */ a(M, { variant: "elevated", "aria-label": h, children: /* @__PURE__ */ x("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)] ds:p-[var(--spacing-md)]", children: [
+    /* @__PURE__ */ x("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)] ds:md:flex-row ds:md:items-start", children: [
+      /* @__PURE__ */ a("div", { className: "ds:flex-1 ds:min-w-0", children: /* @__PURE__ */ a(
+        H,
+        {
+          value: t,
+          onChange: i,
+          loadObjects: v,
+          onObjectSelect: u,
+          inputRef: d
+        }
+      ) }),
+      /* @__PURE__ */ a("div", { className: "ds:flex-1 ds:min-w-0", children: /* @__PURE__ */ a(
+        q,
+        {
+          value: t,
+          onChange: i,
+          loadPlaces: g,
+          onPlaceSelect: c,
+          defaultRadiusKm: m,
+          reverseGeocode: b,
+          inputRef: f
+        }
+      ) }),
+      /* @__PURE__ */ a(
+        U,
+        {
+          value: t,
+          variant: s,
+          submitting: r,
+          submitLabel: l,
+          allowEmptySubmit: n,
+          onSubmit: p
+        }
+      )
+    ] }),
+    /* @__PURE__ */ a(
+      $,
+      {
+        value: t,
+        onChange: i,
+        defaultRadiusKm: m
+      }
+    )
+  ] }) });
+}
+function De(e) {
+  const {
+    variant: s,
+    value: t,
+    onChange: i,
+    onSubmit: p,
+    loadObjects: v,
+    loadPlaces: g,
+    onObjectSelect: u,
+    onPlaceSelect: c,
+    submitting: r,
+    submitLabel: l,
+    allowEmptySubmit: n,
+    whoRef: d,
+    whereRef: f,
+    defaultRadiusKm: m,
+    reverseGeocode: b,
+    cardLabel: h
+  } = e;
+  return /* @__PURE__ */ a(M, { variant: "elevated", "aria-label": h, children: /* @__PURE__ */ x("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-md)] ds:p-[var(--spacing-md)]", children: [
+    /* @__PURE__ */ x("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)] ds:md:flex-row ds:md:items-start", children: [
+      /* @__PURE__ */ a("div", { className: "ds:flex-1 ds:min-w-0", children: /* @__PURE__ */ a(
+        H,
+        {
+          value: t,
+          onChange: i,
+          loadObjects: v,
+          onObjectSelect: u,
+          inputRef: d
+        }
+      ) }),
+      /* @__PURE__ */ a("div", { className: "ds:flex-1 ds:min-w-0", children: /* @__PURE__ */ a(
+        q,
+        {
+          value: t,
+          onChange: i,
+          loadPlaces: g,
+          onPlaceSelect: c,
+          defaultRadiusKm: m,
+          reverseGeocode: b,
+          inputRef: f
+        }
+      ) }),
+      /* @__PURE__ */ a(
+        U,
+        {
+          value: t,
+          variant: s,
+          submitting: r,
+          submitLabel: l,
+          allowEmptySubmit: n,
+          onSubmit: p
+        }
+      )
+    ] }),
+    /* @__PURE__ */ a(
+      $,
+      {
+        value: t,
+        onChange: i,
+        defaultRadiusKm: m
+      }
+    ),
+    /* @__PURE__ */ a(
+      Ne,
+      {
+        value: t.when,
+        onChange: (o) => i({ ...t, when: o })
+      }
+    )
+  ] }) });
+}
+function Pe(e) {
+  const {
+    variant: s,
+    value: t,
+    onChange: i,
+    onSubmit: p,
+    loadObjects: v,
+    loadPlaces: g,
+    onObjectSelect: u,
+    onPlaceSelect: c,
+    facets: r,
+    submitting: l,
+    submitLabel: n,
+    allowEmptySubmit: d,
+    whoRef: f,
+    whereRef: m,
+    defaultRadiusKm: b,
+    reverseGeocode: h,
+    cardLabel: o
+  } = e;
+  return /* @__PURE__ */ a(M, { variant: "elevated", "aria-label": o, children: /* @__PURE__ */ x("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-md)] ds:p-[var(--spacing-md)]", children: [
+    /* @__PURE__ */ x("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)] ds:md:flex-row ds:md:items-start", children: [
+      /* @__PURE__ */ a("div", { className: "ds:flex-1 ds:min-w-0", children: /* @__PURE__ */ a(
+        H,
+        {
+          value: t,
+          onChange: i,
+          loadObjects: v,
+          onObjectSelect: u,
+          inputRef: f
+        }
+      ) }),
+      /* @__PURE__ */ a("div", { className: "ds:flex-1 ds:min-w-0", children: /* @__PURE__ */ a(
+        q,
+        {
+          value: t,
+          onChange: i,
+          loadPlaces: g,
+          onPlaceSelect: c,
+          defaultRadiusKm: b,
+          reverseGeocode: h,
+          inputRef: m
+        }
+      ) }),
+      /* @__PURE__ */ a(
+        U,
+        {
+          value: t,
+          variant: s,
+          submitting: l,
+          submitLabel: n,
+          allowEmptySubmit: d,
+          onSubmit: p
+        }
+      )
+    ] }),
+    /* @__PURE__ */ a(
+      $,
+      {
+        value: t,
+        onChange: i,
+        defaultRadiusKm: b
+      }
+    ),
+    r && r.length > 0 ? /* @__PURE__ */ a(
+      ke,
+      {
+        facets: r,
+        value: t.facets,
+        onChange: (S) => i({ ...t, facets: S })
+      }
+    ) : null
+  ] }) });
+}
+function Ie(e) {
+  const {
+    variant: s,
+    value: t,
+    onChange: i,
+    onSubmit: p,
+    loadObjects: v,
+    loadPlaces: g,
+    onObjectSelect: u,
+    onPlaceSelect: c,
+    discoveryCards: r,
+    submitting: l,
+    submitLabel: n,
+    allowEmptySubmit: d,
+    whoRef: f,
+    whereRef: m,
+    defaultRadiusKm: b,
+    reverseGeocode: h,
+    cardLabel: o
+  } = e;
+  return /* @__PURE__ */ x("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-lg)]", children: [
+    /* @__PURE__ */ x(M, { variant: "elevated", "aria-label": o, children: [
+      /* @__PURE__ */ x("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)] ds:p-[var(--spacing-md)] ds:md:flex-row ds:md:items-stretch", children: [
+        /* @__PURE__ */ a("div", { className: "ds:flex-1 ds:min-w-0", children: /* @__PURE__ */ a(
+          H,
+          {
+            value: t,
+            onChange: i,
+            loadObjects: v,
+            onObjectSelect: u,
+            inputRef: f
+          }
+        ) }),
+        /* @__PURE__ */ a("div", { className: "ds:flex-1 ds:min-w-0", children: /* @__PURE__ */ a(
+          q,
+          {
+            value: t,
+            onChange: i,
+            loadPlaces: g,
+            onPlaceSelect: c,
+            defaultRadiusKm: b,
+            reverseGeocode: h,
+            inputRef: m
+          }
+        ) }),
+        /* @__PURE__ */ a(
+          U,
+          {
+            value: t,
+            variant: s,
+            submitting: l,
+            submitLabel: n,
+            allowEmptySubmit: d,
+            onSubmit: p
+          }
+        )
+      ] }),
+      /* @__PURE__ */ a(
+        $,
+        {
+          value: t,
+          onChange: i,
+          defaultRadiusKm: b
+        }
+      )
+    ] }),
+    /* @__PURE__ */ a(Ee, { cards: r })
+  ] });
+}
+const Oe = de(function({
+  variant: s,
+  loadObjects: t,
+  loadPlaces: i,
+  onObjectSelect: p,
+  onPlaceSelect: v,
+  facets: g,
+  defaultRadiusKm: u = Y,
+  reverseGeocode: c,
+  discoveryCards: r,
+  countryCode: l,
+  value: n,
+  onChange: d,
+  onSubmit: f,
+  submitting: m,
+  submitLabel: b,
+  allowEmptySubmit: h,
+  "aria-label": o,
+  id: S,
+  className: G,
+  ...L
+}, D) {
+  const { t: J } = j(), Q = N(null), P = N(null), B = N(null), C = N(!1);
+  V(() => {
+    if (!C.current && s === "who-where-when") {
+      if (n.when !== void 0) {
+        C.current = !0;
+        return;
+      }
+      C.current = !0, d({ ...n, when: "anytime" });
+    }
+  }, [s]);
+  const E = N(!1);
+  V(() => {
+    if (!E.current && s === "faceted") {
+      if (n.facets !== void 0) {
+        E.current = !0;
+        return;
+      }
+      E.current = !0, d({ ...n, facets: {} });
+    }
+  }, [s]);
+  const y = N(null);
+  V(() => {
+    y.current !== s && (y.current = s, _("patient_search_variant_exposed", { variant: s, country: l }));
+  }, [s, l]);
+  const w = X(
+    () => ({
+      getVariant: () => s,
+      reset: () => {
+        d({});
+      },
+      focusPrimary: () => {
+        requestAnimationFrame(() => {
+          var I;
+          (I = P.current) == null || I.focus();
+        });
+      }
+    }),
+    [s, d]
+  );
+  ce(D, () => w, [w]), pe(xe, w, S);
+  const k = o ?? J("patientSearch.regionLabel"), R = {
+    variant: s,
+    value: n,
+    onChange: d,
+    onSubmit: f,
+    loadObjects: t,
+    loadPlaces: i,
+    onObjectSelect: p,
+    onPlaceSelect: v,
+    facets: g,
+    defaultRadiusKm: u,
+    reverseGeocode: c,
+    discoveryCards: r ?? [],
+    submitting: m,
+    submitLabel: b,
+    allowEmptySubmit: h,
+    whoRef: P,
+    whereRef: B,
+    cardLabel: k
+  }, K = (() => {
+    switch (s) {
+      case "who-where":
+        return /* @__PURE__ */ a(Le, { ...R });
+      case "who-where-when":
+        return /* @__PURE__ */ a(De, { ...R });
+      case "faceted":
+        return /* @__PURE__ */ a(Pe, { ...R });
+      case "discovery":
+        return /* @__PURE__ */ a(Ie, { ...R });
+      /* c8 ignore next 2 */
+      default:
+        return null;
+    }
+  })();
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      ref: Q,
+      role: "region",
+      "aria-label": k,
+      id: S,
+      "data-component": "patient-search",
+      "data-component-id": S,
+      "data-variant": s,
+      className: _e({ variant: s, className: G }),
+      ...L,
+      children: K
+    }
+  );
+});
+Oe.displayName = "PatientSearch";
+export {
+  Oe as P,
+  xe as p
+};
+//# sourceMappingURL=patient-search-X9SUZGpy.js.map