@alfadocs/ui-kit 0.43.0 → 0.45.0

package/dist/_chunks/{autocomplete-DIgdhCGJ.js → autocomplete-CDqxB68B.js}

@@ -4,7 +4,7 @@ import { _ as f } from "./index-4xgbg-sn.js";
 import * as T from "@radix-ui/react-popover";
 import { c as A } from "./index-D2ZczOXr.js";
 import { useTranslation as Ze } from "react-i18next";
-import { S as pe } from "./spinner-CCByyvcb.js";
+import { S as pe } from "./spinner-OjQNn8oN.js";
 import { u as et } from "./form-field-context-B3APVHKx.js";
 import { u as tt } from "./use-controllable-state-BiY4xTzM.js";
 import { g as st } from "./group-options-BvKhQ3xb.js";
@@ -466,4 +466,4 @@ export {
   it as a,
   dt as b
 };
-//# sourceMappingURL=autocomplete-DIgdhCGJ.js.map
+//# sourceMappingURL=autocomplete-CDqxB68B.js.map

package/dist/_chunks/bmi-calculator-CQqXTVNL.js

@@ -0,0 +1,258 @@
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { forwardRef as Z, useId as aa, useState as r, useMemo as A, useEffect as ea } from "react";
+import { c as la } from "./index-D2ZczOXr.js";
+import { useTranslation as ta } from "react-i18next";
+import { R as H } from "./radio-TWf9Q-mp.js";
+import { R as ia } from "./radio-group-CLjK-SlK.js";
+import { F as D } from "./form-field-BOm9hK35.js";
+import { N as p } from "./number-input-Dj5L3pXK.js";
+import { C as M } from "./card-DPmk26CL.js";
+import { B as na } from "./badge-zsf5i5bH.js";
+import { B as ra, I as sa, b as oa } from "./insert-result-C5ABnzDl.js";
+import { b as ca, e as ma, c as da, f as O, l as W, k as ua } from "./bmi-BxD-tFzU.js";
+const ga = la("ds:flex ds:flex-col ds:gap-[var(--spacing-lg)]", {
+  variants: {
+    width: {
+      full: "ds:w-full",
+      auto: "ds:inline-flex"
+    }
+  },
+  defaultVariants: { width: "full" }
+}), ba = {
+  underweight: "info",
+  normal: "success",
+  overweight: "warning",
+  obese: "error"
+}, ha = {
+  underweight: "--info",
+  normal: "--success",
+  overweight: "--warning-readable",
+  obese: "--destructive"
+}, f = (v) => Math.round(v * 10) / 10, pa = Z(
+  ({
+    defaultUnitSystem: v = "metric",
+    onResultChange: g,
+    onInsert: L,
+    insertVariant: N = "insert",
+    onCopy: j,
+    onError: z,
+    insertBrand: R,
+    id: U,
+    width: V,
+    className: Y
+  }, _) => {
+    const { t: a, i18n: w } = ta(), B = aa(), [s, q] = r(v), [b, F] = r(null), [h, I] = r(null), [o, T] = r(null), [c, k] = r(null), [m, $] = r(null), J = (C) => {
+      const u = C;
+      if (u !== s) {
+        if (u === "imperial") {
+          if (b !== null) {
+            const { ft: y, in: x } = da(b);
+            T(y), k(f(x));
+          }
+          h !== null && $(f(ua(h)));
+        } else
+          (o !== null || c !== null) && F(f(O(o ?? 0, c ?? 0))), m !== null && I(f(W(m)));
+        q(u);
+      }
+    }, P = s === "metric" ? b : o !== null || c !== null ? O(o ?? 0, c ?? 0) : null, Q = s === "metric" ? h : m !== null ? W(m) : null, i = ma(Q, P), t = i !== null ? ca(i) : null, G = A(
+      () => new Intl.NumberFormat(w.language, {
+        minimumFractionDigits: 1,
+        maximumFractionDigits: 1
+      }),
+      [w.language]
+    );
+    ea(() => {
+      g == null || g(
+        i !== null && t !== null ? { bmi: i, category: t } : null
+      );
+    }, [i, t, g]);
+    const d = s === "metric", l = A(() => {
+      if (i === null || t === null) return null;
+      const { bands: C, min: u, max: y, ticks: x } = oa(), S = G.format(i), E = a(`bmiCalculator.category.${t}`), K = a(`bmiCalculator.range.${t}`), X = a("bmiCalculator.gaugeAria", {
+        bmi: S,
+        category: E,
+        range: K
+      });
+      return {
+        value: i,
+        bands: C,
+        min: u,
+        max: y,
+        ticks: x,
+        valueLabel: S,
+        categoryLabel: E,
+        rangeLabel: K,
+        ariaLabel: X
+      };
+    }, [i, t, G, a]);
+    return /* @__PURE__ */ n(
+      "div",
+      {
+        ref: _,
+        "data-component": "bmi-calculator",
+        "data-component-id": U,
+        className: ga({ width: V, className: Y }),
+        children: [
+          /* @__PURE__ */ n(
+            ia,
+            {
+              label: a("bmiCalculator.unitSystem.label"),
+              variant: "horizontal",
+              value: s,
+              onValueChange: J,
+              children: [
+                /* @__PURE__ */ e(H, { label: a("bmiCalculator.unitSystem.metric"), value: "metric" }),
+                /* @__PURE__ */ e(
+                  H,
+                  {
+                    label: a("bmiCalculator.unitSystem.imperial"),
+                    value: "imperial"
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ n("div", { className: "ds:grid ds:grid-cols-1 ds:gap-[var(--spacing-md)] ds:sm:grid-cols-2", children: [
+            d ? /* @__PURE__ */ e(
+              D,
+              {
+                label: `${a("bmiCalculator.height")} (${a("bmiCalculator.units.cm")})`,
+                children: /* @__PURE__ */ e(
+                  p,
+                  {
+                    mode: "decimal",
+                    min: 0,
+                    step: 0.5,
+                    value: b,
+                    onChange: F
+                  }
+                )
+              }
+            ) : /* @__PURE__ */ n("div", { role: "group", "aria-labelledby": B, children: [
+              /* @__PURE__ */ e(
+                "span",
+                {
+                  id: B,
+                  className: "type-label ds:mb-[var(--spacing-xs)] ds:block ds:text-foreground",
+                  children: a("bmiCalculator.height")
+                }
+              ),
+              /* @__PURE__ */ n("div", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-sm)]", children: [
+                /* @__PURE__ */ e(
+                  p,
+                  {
+                    mode: "integer",
+                    min: 0,
+                    value: o,
+                    onChange: T,
+                    "aria-label": a("bmiCalculator.feet")
+                  }
+                ),
+                /* @__PURE__ */ e("span", { className: "type-label ds:text-muted-foreground", children: a("bmiCalculator.units.ft") }),
+                /* @__PURE__ */ e(
+                  p,
+                  {
+                    mode: "decimal",
+                    min: 0,
+                    max: 11.9,
+                    step: 0.5,
+                    value: c,
+                    onChange: k,
+                    "aria-label": a("bmiCalculator.inches")
+                  }
+                ),
+                /* @__PURE__ */ e("span", { className: "type-label ds:text-muted-foreground", children: a("bmiCalculator.units.in") })
+              ] })
+            ] }),
+            /* @__PURE__ */ e(
+              D,
+              {
+                label: `${a("bmiCalculator.weight")} (${a(
+                  d ? "bmiCalculator.units.kg" : "bmiCalculator.units.lb"
+                )})`,
+                children: /* @__PURE__ */ e(
+                  p,
+                  {
+                    mode: "decimal",
+                    min: 0,
+                    step: d ? 0.1 : 0.5,
+                    value: d ? h : m,
+                    onChange: d ? I : $
+                  }
+                )
+              }
+            )
+          ] }),
+          /* @__PURE__ */ e("p", { className: "ds:sr-only", role: "status", "aria-live": "polite", children: l ? l.ariaLabel : "" }),
+          i !== null && t !== null && l !== null ? /* @__PURE__ */ e(M, { variant: "elevated", children: /* @__PURE__ */ n(M.Body, { className: "ds:flex ds:flex-col ds:items-center ds:gap-[var(--spacing-md)]", children: [
+            /* @__PURE__ */ n("div", { className: "ds:flex ds:flex-col ds:items-center ds:gap-[var(--spacing-xs)] ds:text-center", children: [
+              /* @__PURE__ */ e("span", { className: "type-label ds:text-muted-foreground", children: a("bmiCalculator.category.label") }),
+              /* @__PURE__ */ e(na, { variant: ba[t], size: "lg", children: a(`bmiCalculator.category.${t}`) }),
+              /* @__PURE__ */ e("p", { className: "type-body ds:text-muted-foreground", children: l.rangeLabel })
+            ] }),
+            /* @__PURE__ */ e(
+              "div",
+              {
+                "data-bmi-category": t,
+                className: "ds:w-full ds:max-w-[320px]",
+                children: /* @__PURE__ */ e(ra, { model: l, className: "ds:w-full" })
+              }
+            ),
+            N === "copy" || L ? /* @__PURE__ */ e(
+              sa,
+              {
+                onInsert: L,
+                variant: N,
+                onCopy: j,
+                onError: z,
+                card: {
+                  title: a("insert.title.bmi"),
+                  icon: "scale",
+                  highlight: a(`bmiCalculator.category.${t}`),
+                  // Chip shares the WHO-category semantic token so the
+                  // inserted PNG chip matches the on-screen band colour.
+                  highlightToken: ha[t],
+                  brand: R,
+                  // Banded gauge: the SAME geometry + WHO bands as the
+                  // on-screen widget, baked into the card PNG with
+                  // probe-resolved theme colours.
+                  gauge: {
+                    variant: "banded",
+                    value: i,
+                    bands: l.bands,
+                    min: l.min,
+                    max: l.max,
+                    valueLabel: l.valueLabel,
+                    categoryLabel: l.categoryLabel,
+                    rangeLabel: l.rangeLabel,
+                    ariaLabel: l.ariaLabel,
+                    ticks: l.ticks
+                  },
+                  fields: [
+                    {
+                      // Mirrors the on-screen scale glyph + header icon.
+                      icon: "scale",
+                      label: a("insert.title.bmi"),
+                      value: l.valueLabel
+                    },
+                    {
+                      // WHO band is a classification → tag glyph.
+                      icon: "tag",
+                      label: a("bmiCalculator.category.label"),
+                      value: l.categoryLabel
+                    }
+                  ]
+                }
+              }
+            ) : null
+          ] }) }) : /* @__PURE__ */ e("p", { className: "type-body ds:text-muted-foreground", children: a("bmiCalculator.empty") })
+        ]
+      }
+    );
+  }
+);
+pa.displayName = "BmiCalculator";
+export {
+  pa as B
+};
+//# sourceMappingURL=bmi-calculator-CQqXTVNL.js.map

package/dist/_chunks/{booking-CtLwaxkK.js → booking-DlDVuWMd.js}

@@ -13,7 +13,7 @@ import { F as Z } from "./form-field-BOm9hK35.js";
 import { P as Lt } from "./phone-input-DfZbPPvh.js";
 import { T as Rt } from "./text-area-BIx0tZ05.js";
 import { T as Ce } from "./text-input-BaClJL8Y.js";
-import { S as Ft } from "./spinner-CCByyvcb.js";
+import { S as Ft } from "./spinner-OjQNn8oN.js";
 import { I as tt } from "./icon-button-CKEOrN37.js";
 import { S as Oe } from "./select-hsCaJSX3.js";
 import { C as Ge } from "./combobox-BC-DFx8G.js";
@@ -2697,4 +2697,4 @@ export {
   X as O,
   Da as b
 };
-//# sourceMappingURL=booking-CtLwaxkK.js.map
+//# sourceMappingURL=booking-DlDVuWMd.js.map

package/dist/_chunks/{calculator-dialog-DdexHrTP.js → calculator-dialog-D-nfvteH.js}

@@ -1,6 +1,6 @@
 import { jsxs as a, jsx as l } from "react/jsx-runtime";
 import { forwardRef as p } from "react";
-import { D as r } from "./dialog-DOYgd75U.js";
+import { D as r } from "./dialog-BTpZV6It.js";
 const u = p(
   ({
     trigger: i,
@@ -37,4 +37,4 @@ u.displayName = "CalculatorDialog";
 export {
   u as C
 };
-//# sourceMappingURL=calculator-dialog-DdexHrTP.js.map
+//# sourceMappingURL=calculator-dialog-D-nfvteH.js.map

package/dist/_chunks/{cycle-calculator-Dln-y1k_.js → cycle-calculator-KxA8dqDf.js}

@@ -1,17 +1,17 @@
 import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import { forwardRef as A, useState as L, useMemo as v, useEffect as S } from "react";
-import { c as T } from "./index-D2ZczOXr.js";
-import { useTranslation as W } from "react-i18next";
-import { F as P } from "./form-field-BOm9hK35.js";
-import { D as $ } from "./date-picker-Bq7xhMA-.js";
-import { N as H } from "./number-input-Dj5L3pXK.js";
-import { C as w } from "./card-DPmk26CL.js";
-import { B as x } from "./badge-zsf5i5bH.js";
-import { I } from "./insert-result-DisOY2G-.js";
-import { a as i } from "./date-picker-variants-DLi1Va_e.js";
+import { forwardRef as F, useState as L, useMemo as y, useEffect as H } from "react";
+import { c as $ } from "./index-D2ZczOXr.js";
+import { useTranslation as A } from "react-i18next";
+import { F as w } from "./form-field-BOm9hK35.js";
+import { D as I } from "./date-picker-Bq7xhMA-.js";
+import { N as S } from "./number-input-Dj5L3pXK.js";
+import { C as P } from "./card-DPmk26CL.js";
+import { B as v } from "./badge-zsf5i5bH.js";
+import { I as k } from "./insert-result-C5ABnzDl.js";
+import { a as s } from "./date-picker-variants-DLi1Va_e.js";
 import { C as z } from "./check-DPdL_Sm7.js";
 import { H as B } from "./heart-C0faivFf.js";
-import { c as k } from "./createLucideIcon-CrFbzy84.js";
+import { c as G } from "./createLucideIcon-CrFbzy84.js";
 /**
  * @license lucide-react v1.8.0 - ISC
  *
@@ -26,77 +26,78 @@ const Y = [
       key: "c7niix"
     }
   ]
-], j = k("droplet", Y), h = 28, M = 14, U = 1;
-function G(n, c = 3) {
-  const d = n.cycleLength ?? h, { lastPeriodStart: s } = n, o = i(s, d - M), u = {
-    start: i(o, -5),
-    end: i(o, U)
-  }, f = i(s, d), p = Array.from(
+], j = G("droplet", Y), x = 28, M = 14, U = 1;
+function K(n, c = 3) {
+  const d = n.cycleLength ?? x, { lastPeriodStart: o } = n, i = s(o, d - M), u = {
+    start: s(i, -5),
+    end: s(i, U)
+  }, f = s(o, d), p = Array.from(
     { length: c },
-    (C, g) => i(s, d * (g + 1))
+    (C, g) => s(o, d * (g + 1))
   );
-  return { nextPeriod: f, ovulation: o, fertileWindow: u, upcomingPeriods: p };
+  return { nextPeriod: f, ovulation: i, fertileWindow: u, upcomingPeriods: p };
 }
-const V = T("ds:flex ds:flex-col ds:gap-[var(--spacing-lg)]", {
+const O = $("ds:flex ds:flex-col ds:gap-[var(--spacing-lg)]", {
   variants: {
     width: { full: "ds:w-full", auto: "ds:inline-flex" }
   },
   defaultVariants: { width: "full" }
-}), q = A(
+}), V = "--accent", q = F(
   ({
-    defaultCycleLength: n = h,
+    defaultCycleLength: n = x,
     onResultChange: c,
     onInsert: d,
-    insertVariant: s = "insert",
-    onCopy: o,
+    insertVariant: o = "insert",
+    onCopy: i,
     onError: u,
-    id: f,
-    width: p,
-    className: C
-  }, g) => {
-    const { t: a, i18n: N } = W(), [m, b] = L(void 0), [y, D] = L(
+    insertBrand: f,
+    id: p,
+    width: C,
+    className: g
+  }, b) => {
+    const { t: a, i18n: N } = A(), [m, D] = L(void 0), [h, E] = L(
       n
-    ), t = v(() => m ? G({
+    ), t = y(() => m ? K({
       lastPeriodStart: m,
-      cycleLength: y ?? h
-    }) : null, [m, y]), E = v(
+      cycleLength: h ?? x
+    }) : null, [m, h]), T = y(
       () => new Intl.DateTimeFormat(N.language, { dateStyle: "medium" }),
       [N.language]
     );
-    S(() => {
+    H(() => {
       c == null || c(t);
     }, [t, c]);
-    const _ = v(() => /* @__PURE__ */ new Date(), []), l = (F) => E.format(F);
+    const _ = y(() => /* @__PURE__ */ new Date(), []), l = (W) => T.format(W);
     return /* @__PURE__ */ r(
       "div",
       {
-        ref: g,
+        ref: b,
         "data-component": "cycle-calculator",
-        "data-component-id": f,
-        className: V({ width: p, className: C }),
+        "data-component-id": p,
+        className: O({ width: C, className: g }),
         children: [
           /* @__PURE__ */ r("div", { className: "ds:grid ds:grid-cols-1 ds:gap-[var(--spacing-md)] ds:sm:grid-cols-2", children: [
-            /* @__PURE__ */ e(P, { label: a("cycleCalculator.lastPeriod"), children: /* @__PURE__ */ e(
-              $,
+            /* @__PURE__ */ e(w, { label: a("cycleCalculator.lastPeriod"), children: /* @__PURE__ */ e(
+              I,
               {
                 value: m,
-                onChange: b,
+                onChange: D,
                 maxDate: _
               }
             ) }),
             /* @__PURE__ */ e(
-              P,
+              w,
               {
                 label: a("cycleCalculator.cycleLength"),
                 description: a("cycleCalculator.cycleLengthHint"),
                 children: /* @__PURE__ */ e(
-                  H,
+                  S,
                   {
                     mode: "integer",
                     min: 20,
                     max: 45,
-                    value: y,
-                    onChange: D
+                    value: h,
+                    onChange: E
                   }
                 )
               }
@@ -105,12 +106,12 @@ const V = T("ds:flex ds:flex-col ds:gap-[var(--spacing-lg)]", {
           /* @__PURE__ */ e("p", { className: "ds:sr-only", role: "status", "aria-live": "polite", children: t ? `${a("cycleCalculator.ovulation")}: ${l(t.ovulation)}. ${a(
             "cycleCalculator.nextPeriod"
           )}: ${l(t.nextPeriod)}.` : "" }),
-          t ? /* @__PURE__ */ e(w, { variant: "elevated", children: /* @__PURE__ */ r(w.Body, { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-md)]", children: [
+          t ? /* @__PURE__ */ e(P, { variant: "elevated", children: /* @__PURE__ */ r(P.Body, { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-md)]", children: [
             /* @__PURE__ */ r("dl", { className: "ds:grid ds:grid-cols-1 ds:gap-[var(--spacing-md)] ds:sm:grid-cols-3", children: [
               /* @__PURE__ */ r("div", { className: "ds:flex ds:flex-col ds:items-center ds:gap-[var(--spacing-xs)] ds:text-center", children: [
                 /* @__PURE__ */ e("dt", { className: "type-label ds:text-muted-foreground", children: a("cycleCalculator.ovulation") }),
                 /* @__PURE__ */ e("dd", { children: /* @__PURE__ */ e(
-                  x,
+                  v,
                   {
                     variant: "success",
                     size: "lg",
@@ -122,7 +123,7 @@ const V = T("ds:flex ds:flex-col ds:gap-[var(--spacing-lg)]", {
               /* @__PURE__ */ r("div", { className: "ds:flex ds:flex-col ds:items-center ds:gap-[var(--spacing-xs)] ds:text-center", children: [
                 /* @__PURE__ */ e("dt", { className: "type-label ds:text-muted-foreground", children: a("cycleCalculator.fertileWindow") }),
                 /* @__PURE__ */ e("dd", { children: /* @__PURE__ */ r(
-                  x,
+                  v,
                   {
                     variant: "accent",
                     size: "lg",
@@ -139,7 +140,7 @@ const V = T("ds:flex ds:flex-col ds:gap-[var(--spacing-lg)]", {
               /* @__PURE__ */ r("div", { className: "ds:flex ds:flex-col ds:items-center ds:gap-[var(--spacing-xs)] ds:text-center", children: [
                 /* @__PURE__ */ e("dt", { className: "type-label ds:text-muted-foreground", children: a("cycleCalculator.nextPeriod") }),
                 /* @__PURE__ */ e("dd", { children: /* @__PURE__ */ e(
-                  x,
+                  v,
                   {
                     variant: "error",
                     size: "lg",
@@ -149,27 +150,45 @@ const V = T("ds:flex ds:flex-col ds:gap-[var(--spacing-lg)]", {
                 ) })
               ] })
             ] }),
-            s === "copy" || d ? /* @__PURE__ */ e(
-              I,
+            o === "copy" || d ? /* @__PURE__ */ e(
+              k,
               {
                 onInsert: d,
-                variant: s,
-                onCopy: o,
+                variant: o,
+                onCopy: i,
                 onError: u,
                 card: {
                   title: a("insert.title.cycle"),
+                  icon: "heart",
+                  highlight: `${l(t.fertileWindow.start)} – ${l(
+                    t.fertileWindow.end
+                  )}`,
+                  // Chip reuses the on-screen fertile-window badge's accent
+                  // token so the inserted PNG chip matches the screen.
+                  highlightToken: V,
+                  brand: f,
                   fields: [
                     {
+                      // Ovulation is a predicted date → calendar glyph (the
+                      // on-screen badge uses a Check tick, which ICON_GEOMETRY
+                      // does not carry, so the calendar reads the date meaning).
+                      icon: "calendar",
                       label: a("cycleCalculator.ovulation"),
                       value: l(t.ovulation)
                     },
                     {
+                      // Fertile window → heart glyph, matching the on-screen
+                      // fertile-window badge's Heart icon.
+                      icon: "heart",
                       label: a("cycleCalculator.fertileWindow"),
                       value: `${l(t.fertileWindow.start)} – ${l(
                         t.fertileWindow.end
                       )}`
                     },
                     {
+                      // Next period → droplets glyph, matching the on-screen
+                      // next-period badge's Droplet icon.
+                      icon: "droplets",
                       label: a("cycleCalculator.nextPeriod"),
                       value: l(t.nextPeriod)
                     }
@@ -187,6 +206,6 @@ q.displayName = "CycleCalculator";
 export {
   q as C,
   M as L,
-  G as p
+  K as p
 };
-//# sourceMappingURL=cycle-calculator-Dln-y1k_.js.map
+//# sourceMappingURL=cycle-calculator-KxA8dqDf.js.map