@alfadocs/ui-kit 0.43.0 → 0.45.0

package/dist/_chunks/gestational-age-calculator-gWI_uRA1.js

@@ -0,0 +1,203 @@
+import { jsxs as l, jsx as t } from "react/jsx-runtime";
+import { forwardRef as E, useState as h, useMemo as g, useEffect as L } from "react";
+import { c as I } from "./index-D2ZczOXr.js";
+import { useTranslation as S } from "react-i18next";
+import { R as x } from "./radio-TWf9Q-mp.js";
+import { R as B } from "./radio-group-CLjK-SlK.js";
+import { F } from "./form-field-BOm9hK35.js";
+import { D as M } from "./date-picker-Bq7xhMA-.js";
+import { C as A } from "./card-DPmk26CL.js";
+import { B as v } from "./badge-zsf5i5bH.js";
+import { I as R } from "./insert-result-C5ABnzDl.js";
+import { c as H, g as _, G as j } from "./gestation-mWF4AXea.js";
+import { s as z } from "./subDays-Dv7q9S7u.js";
+import { i as O } from "./date-picker-variants-DLi1Va_e.js";
+const V = I("ds:flex ds:flex-col ds:gap-[var(--spacing-lg)]", {
+  variants: {
+    width: { full: "ds:w-full", auto: "ds:inline-flex" }
+  },
+  defaultVariants: { width: "full" }
+}), K = {
+  preconception: "neutral",
+  first: "info",
+  second: "success",
+  third: "warning",
+  postterm: "error"
+}, P = {
+  preconception: "--muted",
+  first: "--info",
+  second: "--success",
+  third: "--warning-readable",
+  postterm: "--destructive"
+};
+function Y(c) {
+  return P[c];
+}
+const q = E(
+  ({
+    defaultMethod: c = "lmp",
+    onResultChange: d,
+    onInsert: u,
+    insertVariant: p = "insert",
+    onCopy: b,
+    onError: y,
+    insertBrand: C,
+    id: N,
+    width: D,
+    className: T
+  }, w) => {
+    const { t: e, i18n: f } = S(), [o, G] = h(c), [i, $] = h(void 0), n = g(() => /* @__PURE__ */ new Date(), []), a = g(() => {
+      if (!i) return null;
+      const s = o === "lmp" ? i : z(i, j), r = H({ method: "lmp", date: s }, n);
+      return {
+        result: {
+          gestationalAge: r.gestationalAge,
+          trimester: r.trimester,
+          dueDate: r.dueDate
+        },
+        milestones: _(r.gestationalStart)
+      };
+    }, [o, i, n]), k = g(
+      () => new Intl.DateTimeFormat(f.language, { dateStyle: "medium" }),
+      [f.language]
+    );
+    L(() => {
+      d == null || d((a == null ? void 0 : a.result) ?? null);
+    }, [a, d]);
+    const m = (s) => s ? e("gestationalAgeCalculator.gestation", {
+      weeks: s.weeks,
+      days: s.days
+    }) : "—";
+    return /* @__PURE__ */ l(
+      "div",
+      {
+        ref: w,
+        "data-component": "gestational-age-calculator",
+        "data-component-id": N,
+        className: V({ width: D, className: T }),
+        children: [
+          /* @__PURE__ */ l(
+            B,
+            {
+              label: e("gestationalAgeCalculator.method.label"),
+              variant: "horizontal",
+              value: o,
+              onValueChange: (s) => G(s),
+              children: [
+                /* @__PURE__ */ t(x, { label: e("gestationalAgeCalculator.method.lmp"), value: "lmp" }),
+                /* @__PURE__ */ t(x, { label: e("gestationalAgeCalculator.method.edd"), value: "edd" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ t(
+            F,
+            {
+              label: e(
+                o === "lmp" ? "gestationalAgeCalculator.lmpDate" : "gestationalAgeCalculator.eddDate"
+              ),
+              children: /* @__PURE__ */ t(
+                M,
+                {
+                  value: i,
+                  onChange: $,
+                  maxDate: o === "lmp" ? n : void 0
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ t("p", { className: "ds:sr-only", role: "status", "aria-live": "polite", children: a ? `${e("gestationalAgeCalculator.gestationLabel")}: ${m(
+            a.result.gestationalAge
+          )}. ${e("gestationalAgeCalculator.trimesterLabel")}: ${e(
+            `gestationalAgeCalculator.trimester.${a.result.trimester}`
+          )}.` : "" }),
+          a ? /* @__PURE__ */ t(A, { variant: "elevated", children: /* @__PURE__ */ l(A.Body, { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-md)]", children: [
+            /* @__PURE__ */ l("dl", { className: "ds:grid ds:grid-cols-1 ds:gap-[var(--spacing-md)] ds:sm:grid-cols-2", children: [
+              /* @__PURE__ */ l("div", { className: "ds:flex ds:flex-col ds:items-start ds:gap-[var(--spacing-xs)]", children: [
+                /* @__PURE__ */ t("dt", { className: "type-label ds:text-muted-foreground", children: e("gestationalAgeCalculator.trimesterLabel") }),
+                /* @__PURE__ */ t("dd", { children: /* @__PURE__ */ t(
+                  v,
+                  {
+                    variant: K[a.result.trimester],
+                    size: "lg",
+                    children: e(
+                      `gestationalAgeCalculator.trimester.${a.result.trimester}`
+                    )
+                  }
+                ) })
+              ] }),
+              /* @__PURE__ */ l("div", { className: "ds:flex ds:flex-col ds:items-end ds:gap-[var(--spacing-xs)] ds:text-end", children: [
+                /* @__PURE__ */ t("dt", { className: "type-label ds:text-muted-foreground", children: e("gestationalAgeCalculator.gestationLabel") }),
+                /* @__PURE__ */ t("dd", { className: "type-metric ds:text-foreground", children: m(a.result.gestationalAge) })
+              ] })
+            ] }),
+            /* @__PURE__ */ l("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]", children: [
+              /* @__PURE__ */ t("span", { className: "type-label ds:text-muted-foreground", children: e("gestationalAgeCalculator.milestonesLabel") }),
+              /* @__PURE__ */ t("ul", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]", children: a.milestones.map((s) => {
+                const r = O(n, s.date);
+                return /* @__PURE__ */ l(
+                  "li",
+                  {
+                    className: "ds:flex ds:items-center ds:justify-between ds:gap-[var(--spacing-md)]",
+                    children: [
+                      /* @__PURE__ */ t("span", { className: "type-body ds:text-foreground", children: e(`gestationalAgeCalculator.milestone.${s.key}`) }),
+                      /* @__PURE__ */ l("span", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-sm)]", children: [
+                        /* @__PURE__ */ t("span", { className: "type-body ds:text-muted-foreground", children: k.format(s.date) }),
+                        r ? /* @__PURE__ */ t(v, { variant: "success", children: e("gestationalAgeCalculator.reached") }) : null
+                      ] })
+                    ]
+                  },
+                  s.key
+                );
+              }) })
+            ] }),
+            p === "copy" || u ? /* @__PURE__ */ t(
+              R,
+              {
+                onInsert: u,
+                variant: p,
+                onCopy: b,
+                onError: y,
+                card: {
+                  title: e("insert.title.gestationalAge"),
+                  icon: "baby",
+                  highlight: e(
+                    `gestationalAgeCalculator.trimester.${a.result.trimester}`
+                  ),
+                  // Chip shares the trimester's semantic token so the
+                  // inserted PNG chip matches the on-screen trimester badge —
+                  // with the contrast-safe orange override for the
+                  // `--warning` third trimester.
+                  highlightToken: Y(
+                    a.result.trimester
+                  ),
+                  brand: C,
+                  fields: [
+                    {
+                      // Gestational age is an elapsed duration → clock glyph.
+                      icon: "clock",
+                      label: e("gestationalAgeCalculator.gestationLabel"),
+                      value: m(a.result.gestationalAge)
+                    },
+                    {
+                      // Trimester is a clinical-stage classification → tag.
+                      icon: "tag",
+                      label: e("gestationalAgeCalculator.trimesterLabel"),
+                      value: e(
+                        `gestationalAgeCalculator.trimester.${a.result.trimester}`
+                      )
+                    }
+                  ]
+                }
+              }
+            ) : null
+          ] }) }) : /* @__PURE__ */ t("p", { className: "type-body ds:text-muted-foreground", children: e("gestationalAgeCalculator.empty") })
+        ]
+      }
+    );
+  }
+);
+q.displayName = "GestationalAgeCalculator";
+export {
+  q as G
+};
+//# sourceMappingURL=gestational-age-calculator-gWI_uRA1.js.map