@alfadocs/ui-kit 1.47.1 → 1.49.0

package/dist/_chunks/{workflow-status-CuJAOuKL.js → workflow-status-ClHfz4Kr.js}

@@ -1,15 +1,17 @@
-import { jsxs as i, jsx as s, Fragment as se } from "react/jsx-runtime";
-import { forwardRef as I, useId as re, useRef as ae, useCallback as te, useMemo as oe, useImperativeHandle as ne } from "react";
-import { c as f } from "./index-D2ZczOXr.js";
-import { useTranslation as L } from "react-i18next";
-import { u as de } from "./registry-DvAUVLHh.js";
-import { u as ie } from "./use-controllable-state-BiY4xTzM.js";
-import { a as z } from "./input-surface-xyERuLU_.js";
-import { D as p } from "./dropdown-menu-DU-Hrf33.js";
-import { C as T } from "./circle-alert-rGDZ73Wh.js";
-import { L as le } from "./loader-circle-BECIU_8N.js";
-import { C as ce } from "./chevron-down-DWE7GSq9.js";
-const ue = {
+import { jsxs as c, jsx as r, Fragment as he } from "react/jsx-runtime";
+import { forwardRef as q, useId as be, useRef as z, useState as O, useEffect as ke, useCallback as ye, useMemo as xe, useImperativeHandle as Se } from "react";
+import { c as g } from "./index-D2ZczOXr.js";
+import { useTranslation as G } from "react-i18next";
+import { u as Ve } from "./registry-DvAUVLHh.js";
+import { u as Ce } from "./use-controllable-state-BiY4xTzM.js";
+import { u as Ne } from "./use-isomorphic-layout-effect-BGfaCOP1.js";
+import { g as ze, h as We } from "./handled-rejection-6gqCf5vt.js";
+import { a as B } from "./input-surface-xyERuLU_.js";
+import { D as p } from "./dropdown-menu-C8PaW3lR.js";
+import { C as U } from "./circle-alert-rGDZ73Wh.js";
+import { L as je } from "./loader-circle-BECIU_8N.js";
+import { C as Te } from "./chevron-down-DWE7GSq9.js";
+const _e = {
   id: "workflow-status",
   capabilities: ["select_single", "set_value", "open", "close"],
   state: {
@@ -17,19 +19,19 @@ const ue = {
       type: "string",
       descriptionKey: "ui.agent.workflowStatus.state.value",
       description: "The current non-sensitive workflow status key.",
-      read: (r) => r.getValue()
+      read: (s) => s.getValue()
     },
     isOpen: {
       type: "boolean",
       descriptionKey: "ui.agent.workflowStatus.state.isOpen",
       description: "Whether the permitted workflow status list is open.",
-      read: (r) => r.getIsOpen()
+      read: (s) => s.getIsOpen()
     },
     isSaving: {
       type: "boolean",
       descriptionKey: "ui.agent.workflowStatus.state.isSaving",
       description: "Whether the host is saving a workflow status change.",
-      read: (r) => r.getIsSaving()
+      read: (s) => s.getIsSaving()
     }
   },
   actions: {
@@ -47,30 +49,31 @@ const ue = {
         required: ["value"]
       },
       idempotent: !0,
-      openWorld: !1,
+      openWorld: !0,
       errors: [
         "The status is not in the host-provided transition list.",
         "The status is disabled.",
-        "A status change is already being saved."
+        "A status change is already being saved.",
+        "The host rejected the change. The previous status stays and the error is shown."
       ],
       examples: [{ args: { value: "review" } }],
       descriptionKey: "ui.agent.workflowStatus.actions.setValue",
       description: "Request a permitted workflow status through the host-owned change callback.",
-      invoke: (r, a) => r.setValue(a.value)
+      invoke: (s, t) => s.setValue(t.value)
     },
     open: {
       safety: "read",
       idempotent: !0,
       descriptionKey: "ui.agent.workflowStatus.actions.open",
       description: "Open the permitted workflow status list.",
-      invoke: (r) => r.open()
+      invoke: (s) => s.open()
     },
     close: {
       safety: "read",
       idempotent: !0,
       descriptionKey: "ui.agent.workflowStatus.actions.close",
       description: "Close the workflow status list.",
-      invoke: (r) => r.close()
+      invoke: (s) => s.close()
     }
   },
   domHooks: {
@@ -89,7 +92,7 @@ const ue = {
       description: "Non-sensitive workflow status key for a permitted option."
     }
   }
-}, O = f(
+}, J = g(
   "ds:inline-flex ds:max-w-full ds:flex-col ds:items-start ds:gap-[var(--spacing-2xs)]",
   {
     variants: {
@@ -101,7 +104,7 @@ const ue = {
     },
     defaultVariants: { size: "md" }
   }
-), R = f(
+), Q = g(
   [
     "ds:group/workflow-status ds:inline-grid ds:max-w-full ds:w-fit ds:items-center",
     "ds:overflow-hidden ds:text-start",
@@ -114,9 +117,9 @@ const ue = {
   {
     variants: {
       size: {
-        sm: `${z.sm} ds:gap-[var(--spacing-xs)] ds:ps-[var(--spacing-2xs)] ds:pe-[var(--spacing-sm)]`,
-        md: `${z.md} ds:gap-[var(--spacing-sm)] ds:ps-[var(--spacing-2xs)] ds:pe-[var(--spacing-sm)]`,
-        lg: `${z.lg} ds:gap-[var(--spacing-sm)] ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-md)]`
+        sm: `${B.sm} ds:gap-[var(--spacing-xs)] ds:ps-[var(--spacing-2xs)] ds:pe-[var(--spacing-sm)]`,
+        md: `${B.md} ds:gap-[var(--spacing-sm)] ds:ps-[var(--spacing-2xs)] ds:pe-[var(--spacing-sm)]`,
+        lg: `${B.lg} ds:gap-[var(--spacing-sm)] ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-md)]`
       },
       interactive: {
         true: [
@@ -143,11 +146,15 @@ const ue = {
       operation: "idle"
     }
   }
-), B = f(
+), X = g(
   [
     "ds:inline-flex ds:shrink-0 ds:items-center ds:justify-center",
     "ds:rounded-[var(--radius-full)] ds:border ds:[&>svg]:block",
-    "ds:forced-colors:bg-transparent ds:forced-colors:border-[CanvasText]"
+    "ds:forced-colors:bg-transparent ds:forced-colors:border-[CanvasText]",
+    // On a lit menu row every tone shows as an outline in the row's ink.
+    "ds:not-forced-colors:group-data-[highlighted]/menu-row:bg-transparent",
+    "ds:not-forced-colors:group-data-[highlighted]/menu-row:text-[color:var(--accent-foreground)]",
+    "ds:not-forced-colors:group-data-[highlighted]/menu-row:border-[color:var(--accent-foreground)]"
   ].join(" "),
   {
     variants: {
@@ -173,7 +180,7 @@ const ue = {
     },
     defaultVariants: { tone: "neutral", size: "md" }
   }
-), fe = f(
+), Ie = g(
   "ds:flex ds:min-w-0 ds:flex-col ds:justify-center ds:text-start",
   {
     variants: {
@@ -185,7 +192,7 @@ const ue = {
     },
     defaultVariants: { size: "md" }
   }
-), pe = f(
+), Le = g(
   "ds:block ds:min-w-0 ds:truncate ds:font-[var(--font-weight-semibold)] ds:text-[color:var(--foreground)]",
   {
     variants: {
@@ -197,7 +204,7 @@ const ue = {
     },
     defaultVariants: { size: "md" }
   }
-), me = f(
+), Re = g(
   [
     "ds:inline-flex ds:self-stretch ds:items-center ds:justify-center",
     "ds:gap-[var(--spacing-2xs)] ds:border-s ds:border-border",
@@ -214,7 +221,7 @@ const ue = {
     },
     defaultVariants: { size: "md" }
   }
-), ge = f(
+), Ee = g(
   [
     "ds:flex ds:max-w-full ds:items-start ds:gap-[var(--spacing-xs)]",
     "type-meta ds:text-[color:var(--error-foreground)]",
@@ -222,47 +229,47 @@ const ue = {
     "ds:forced-colors:text-[CanvasText]"
   ].join(" ")
 );
-function A({
-  option: r,
-  workflowLabel: a,
-  size: t = "md",
-  interactive: n,
-  operation: l = "idle",
-  error: c
+function Y({
+  option: s,
+  workflowLabel: t,
+  size: o = "md",
+  interactive: i,
+  operation: u = "idle",
+  error: n
 }) {
-  return /* @__PURE__ */ i(se, { children: [
-    /* @__PURE__ */ s(
+  return /* @__PURE__ */ c(he, { children: [
+    /* @__PURE__ */ r(
       "span",
       {
         "aria-hidden": "true",
         "data-workflow-status-icon": "",
-        "data-tone": r.tone,
-        className: B({ tone: r.tone, size: t }),
-        children: r.icon
+        "data-tone": s.tone,
+        className: X({ tone: s.tone, size: o }),
+        children: s.icon
       }
     ),
-    /* @__PURE__ */ i("span", { className: fe({ size: t }), children: [
-      t !== "sm" ? /* @__PURE__ */ s("span", { className: "type-meta ds:font-[var(--font-weight-medium)] ds:text-[color:var(--muted-foreground)]", children: a }) : null,
-      /* @__PURE__ */ s(
+    /* @__PURE__ */ c("span", { className: Ie({ size: o }), children: [
+      o !== "sm" ? /* @__PURE__ */ r("span", { className: "type-meta ds:font-[var(--font-weight-medium)] ds:text-[color:var(--muted-foreground)]", children: t }) : null,
+      /* @__PURE__ */ r(
         "span",
         {
           "data-workflow-status-value": "",
-          title: r.label,
-          className: pe({ size: t }),
-          children: r.label
+          title: s.label,
+          className: Le({ size: o }),
+          children: s.label
         }
       )
     ] }),
-    n ? /* @__PURE__ */ i("span", { className: me({ size: t }), "aria-hidden": "true", children: [
-      c ? /* @__PURE__ */ s(
-        T,
+    i ? /* @__PURE__ */ c("span", { className: Re({ size: o }), "aria-hidden": "true", children: [
+      n ? /* @__PURE__ */ r(
+        U,
         {
           "data-testid": "workflow-status-error-icon",
           className: "ds:size-[var(--spacing-md)] ds:shrink-0"
         }
       ) : null,
-      l === "saving" ? /* @__PURE__ */ s(le, { className: "ds:size-[var(--spacing-md)] ds:shrink-0 ds:animate-spin ds:motion-reduce:animate-none" }) : /* @__PURE__ */ s(
-        ce,
+      u === "saving" ? /* @__PURE__ */ r(je, { className: "ds:size-[var(--spacing-md)] ds:shrink-0 ds:animate-spin ds:motion-reduce:animate-none" }) : /* @__PURE__ */ r(
+        Te,
         {
           "data-testid": "workflow-status-chevron",
           className: "ds:size-[var(--spacing-md)] ds:shrink-0 ds:transition-transform ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none ds:group-data-[open]/workflow-status:rotate-180"
@@ -271,25 +278,25 @@ function A({
     ] }) : null
   ] });
 }
-const ve = I(function({ value: a, option: t, size: n = "md", workflowLabel: l, id: c, className: o, dir: k }, b) {
-  const { t: x } = L(), y = l ?? x("workflowStatus.label", "Workflow");
-  return /* @__PURE__ */ s(
+const Oe = q(function({ value: t, option: o, size: i = "md", workflowLabel: u, id: n, className: v, dir: W }, y) {
+  const { t: j } = G(), T = u ?? j("workflowStatus.label", "Workflow");
+  return /* @__PURE__ */ r(
     "div",
     {
-      ref: b,
-      id: c,
-      dir: k,
+      ref: y,
+      id: n,
+      dir: W,
       "data-component": "workflow-status",
-      "data-component-id": c,
-      "data-state": a,
+      "data-component-id": n,
+      "data-state": t,
       "data-variant": "display",
-      className: O({ size: n, className: o }),
-      children: /* @__PURE__ */ s("div", { className: R({ size: n, interactive: !1 }), children: /* @__PURE__ */ s(
-        A,
+      className: J({ size: i, className: v }),
+      children: /* @__PURE__ */ r("div", { className: Q({ size: i, interactive: !1 }), children: /* @__PURE__ */ r(
+        Y,
         {
-          option: t,
-          workflowLabel: y,
-          size: n,
+          option: o,
+          workflowLabel: T,
+          size: i,
           interactive: !1,
           error: !1
         }
@@ -297,149 +304,181 @@ const ve = I(function({ value: a, option: t, size: n = "md", workflowLabel: l, i
     }
   );
 });
-ve.displayName = "WorkflowStatusDisplay";
-const we = I(function({
-  value: a,
-  options: t,
-  onValueChange: n,
-  size: l = "md",
-  disabled: c = !1,
-  saving: o = !1,
-  error: k = !1,
-  errorMessage: b,
-  workflowLabel: x,
-  menuLabel: y,
-  savingLabel: D,
-  open: E,
-  defaultOpen: K = !1,
-  onOpenChange: $,
-  id: u,
-  className: H,
-  dir: W,
-  "aria-label": M,
-  "aria-describedby": q
-}, F) {
-  const { t: m } = L(), G = re(), S = ae(null), C = t.find((e) => e.value === a);
-  if (!C)
+Oe.displayName = "WorkflowStatusDisplay";
+const Be = q(function({
+  value: t,
+  options: o,
+  onValueChange: i,
+  size: u = "md",
+  disabled: n = !1,
+  saving: v = !1,
+  error: W = !1,
+  errorMessage: y,
+  workflowLabel: j,
+  menuLabel: T,
+  savingLabel: Z,
+  open: ee,
+  defaultOpen: se = !1,
+  onOpenChange: re,
+  id: f,
+  className: te,
+  dir: D,
+  "aria-label": oe,
+  "aria-describedby": ae
+}, ne) {
+  const { t: w } = G(), ie = be(), x = z(null), _ = z(!1), [de, A] = O(!1), [h, S] = O(null), [le, ce] = O(t);
+  le !== t && (ce(t), h && h.from !== t && S(null));
+  const I = z(!1);
+  ke(() => (I.current = !0, () => {
+    I.current = !1;
+  }), []);
+  const L = o.find((e) => e.value === t);
+  if (!L)
     throw new Error(
-      `WorkflowStatusControl requires an option matching value "${a}".`
+      `WorkflowStatusControl requires an option matching value "${t}".`
     );
-  const P = x ?? m("workflowStatus.label", "Workflow"), U = y ?? m("workflowStatus.menuLabel", "Workflow statuses"), J = D ?? m("workflowStatus.saving", "Saving workflow status"), Q = b ?? m(
+  const ue = j ?? w("workflowStatus.label", "Workflow"), fe = T ?? w("workflowStatus.menuLabel", "Workflow statuses"), ge = Z ?? w("workflowStatus.saving", "Saving workflow status"), K = w(
     "workflowStatus.saveFailed",
     "Could not change workflow status. The previous status is still shown."
-  ), X = M ?? m("workflowStatus.changeLabel", "Change workflow status: {{status}}", {
-    status: C.label
-  }), g = k || !!b, d = c || o, _ = u ? `${u}-error` : G, Y = [q, g ? _ : void 0].filter(Boolean).join(" ") || void 0, j = o ? "saving" : c ? "disabled" : g ? "error" : "idle", [Z, v] = ie({
-    value: E,
-    defaultValue: K,
-    onChange: $
-  }), h = !!Z && !d, N = te(
+  ), me = y ?? (h ? ze(h.reason, K) : K), pe = oe ?? w("workflowStatus.changeLabel", "Change workflow status: {{status}}", {
+    status: L.label
+  }), b = W || !!y || h !== null, d = v || de, m = n || d, M = f ? `${f}-error` : ie, ve = [ae, b ? M : void 0].filter(Boolean).join(" ") || void 0, $ = d ? "saving" : n ? "disabled" : b ? "error" : "idle", [we, k] = Ce({
+    value: ee,
+    defaultValue: se,
+    onChange: re
+  }), V = !!we && !m, C = z(!1);
+  Ne(() => {
+    if (d || !C.current) return;
+    C.current = !1;
+    const e = x.current, l = e == null ? void 0 : e.ownerDocument.activeElement;
+    e && (!l || l === e.ownerDocument.body) && e.focus();
+  });
+  const R = ye(
     (e) => {
-      if (d || e === a) return;
-      const w = t.find((ee) => ee.value === e);
-      if (!(!w || w.disabled))
-        return n(e);
+      if (n || v || _.current || e === t) return;
+      const l = o.find((a) => a.value === e);
+      if (!l || l.disabled) return;
+      S(null);
+      const H = t;
+      let N;
+      try {
+        N = i(e);
+      } catch (a) {
+        return S({ reason: a, from: H }), We(a);
+      }
+      if (!De(N)) return N;
+      _.current = !0, A(!0);
+      const P = (a) => {
+        _.current = !1, I.current && (A(!1), a && S(a));
+      }, F = Promise.resolve(N).then(
+        () => P(null),
+        (a) => {
+          throw P({ reason: a, from: H }), a;
+        }
+      );
+      return F.catch(() => {
+      }), F;
     },
-    [d, n, t, a]
-  ), V = oe(
+    [n, i, o, v, t]
+  ), E = xe(
     () => ({
-      getValue: () => a,
-      getIsOpen: () => h,
-      getIsSaving: () => o,
-      setValue: N,
+      getValue: () => t,
+      getIsOpen: () => V,
+      getIsSaving: () => d,
+      setValue: R,
       open: () => {
-        d || v(!0);
+        m || k(!0);
       },
-      close: () => v(!1),
+      close: () => k(!1),
       focus: () => {
         var e;
-        return (e = S.current) == null ? void 0 : e.focus();
+        return (e = x.current) == null ? void 0 : e.focus();
       }
     }),
-    [N, d, h, o, v, a]
+    [R, m, V, d, k, t]
   );
-  return ne(F, () => V, [V]), de(ue, V, u), /* @__PURE__ */ i(
+  return Se(ne, () => E, [E]), Ve(_e, E, f), /* @__PURE__ */ c(
     "div",
     {
-      id: u,
-      dir: W,
+      id: f,
+      dir: D,
       "data-component": "workflow-status",
-      "data-component-id": u,
-      "data-state": a,
+      "data-component-id": f,
+      "data-state": t,
       "data-variant": "control",
-      "data-saving": o ? "" : void 0,
-      "data-error": g ? "" : void 0,
-      className: O({ size: l, className: H }),
+      "data-saving": d ? "" : void 0,
+      "data-error": b ? "" : void 0,
+      className: J({ size: u, className: te }),
       children: [
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ c(
           p.Root,
           {
-            dir: W,
-            open: h,
+            dir: D,
+            open: V,
             onOpenChange: (e) => {
-              e && d || v(e);
+              e && m || (e && (C.current = !1), k(e));
             },
             children: [
-              /* @__PURE__ */ s(p.Trigger, { asChild: !0, children: /* @__PURE__ */ s(
+              /* @__PURE__ */ r(p.Trigger, { asChild: !0, children: /* @__PURE__ */ r(
                 "button",
                 {
-                  ref: S,
-                  id: u ? `${u}-trigger` : void 0,
+                  ref: x,
+                  id: f ? `${f}-trigger` : void 0,
                   type: "button",
-                  disabled: d,
-                  "aria-label": X,
-                  "aria-describedby": Y,
-                  "aria-busy": o,
-                  "data-open": h ? "" : void 0,
-                  className: R({
-                    size: l,
+                  disabled: m,
+                  "aria-label": pe,
+                  "aria-describedby": ve,
+                  "aria-busy": d,
+                  "data-open": V ? "" : void 0,
+                  className: Q({
+                    size: u,
                     interactive: !0,
-                    operation: j
+                    operation: $
                   }),
-                  children: /* @__PURE__ */ s(
-                    A,
+                  children: /* @__PURE__ */ r(
+                    Y,
                     {
-                      option: C,
-                      workflowLabel: P,
-                      size: l,
+                      option: L,
+                      workflowLabel: ue,
+                      size: u,
                       interactive: !0,
-                      operation: j,
-                      error: g
+                      operation: $,
+                      error: b
                     }
                   )
                 }
               ) }),
-              /* @__PURE__ */ i(p.Content, { align: "start", children: [
-                /* @__PURE__ */ s(p.Label, { children: U }),
-                /* @__PURE__ */ s(
+              /* @__PURE__ */ c(p.Content, { align: "start", children: [
+                /* @__PURE__ */ r(p.Label, { children: fe }),
+                /* @__PURE__ */ r(
                   p.RadioGroup,
                   {
-                    value: a,
+                    value: t,
                     onValueChange: (e) => {
-                      var w;
-                      v(!1), (w = S.current) == null || w.focus(), N(e);
+                      var l;
+                      k(!1), (l = x.current) == null || l.focus(), C.current = !0, R(e);
                     },
-                    children: t.map((e) => /* @__PURE__ */ s(
+                    children: o.map((e) => /* @__PURE__ */ r(
                       p.RadioItem,
                       {
                         value: e.value,
-                        disabled: d || e.disabled,
+                        disabled: m || e.disabled,
                         "data-option-id": e.value,
-                        children: /* @__PURE__ */ i("span", { className: "ds:flex ds:min-w-0 ds:items-center ds:gap-[var(--spacing-sm)]", children: [
-                          /* @__PURE__ */ s(
+                        children: /* @__PURE__ */ c("span", { className: "ds:flex ds:min-w-0 ds:items-center ds:gap-[var(--spacing-sm)]", children: [
+                          /* @__PURE__ */ r(
                             "span",
                             {
                               "aria-hidden": "true",
                               "data-workflow-status-icon": "",
                               "data-tone": e.tone,
-                              className: B({
+                              className: X({
                                 tone: e.tone,
                                 size: "menu"
                               }),
                               children: e.icon
                             }
                           ),
-                          /* @__PURE__ */ s("span", { className: "ds:min-w-0 ds:truncate", title: e.label, children: e.label })
+                          /* @__PURE__ */ r("span", { className: "ds:min-w-0 ds:truncate", title: e.label, children: e.label })
                         ] })
                       },
                       e.value
@@ -450,28 +489,31 @@ const we = I(function({
             ]
           }
         ),
-        /* @__PURE__ */ s(
+        /* @__PURE__ */ r(
           "span",
           {
             role: "status",
             "aria-live": "polite",
             "aria-atomic": "true",
             className: "ds:sr-only",
-            children: o ? J : ""
+            children: d ? ge : ""
           }
         ),
-        g ? /* @__PURE__ */ i("div", { id: _, role: "alert", className: ge(), children: [
-          /* @__PURE__ */ s(T, { "aria-hidden": "true" }),
-          /* @__PURE__ */ s("span", { children: Q })
+        b ? /* @__PURE__ */ c("div", { id: M, role: "alert", className: Ee(), children: [
+          /* @__PURE__ */ r(U, { "aria-hidden": "true" }),
+          /* @__PURE__ */ r("span", { children: me })
         ] }) : null
       ]
     }
   );
 });
-we.displayName = "WorkflowStatusControl";
+Be.displayName = "WorkflowStatusControl";
+function De(s) {
+  return typeof s == "object" && s !== null && typeof s.then == "function";
+}
 export {
-  we as W,
-  ve as a,
-  ue as w
+  Be as W,
+  Oe as a,
+  _e as w
 };
-//# sourceMappingURL=workflow-status-CuJAOuKL.js.map
+//# sourceMappingURL=workflow-status-ClHfz4Kr.js.map