@50arms/ui 0.0.0-stage → 35.1.0

package/dist/components/Dialog.js

@@ -0,0 +1,332 @@
+import { jsxs as s, jsx as e, Fragment as S } from "react/jsx-runtime";
+import { useRef as C, useCallback as M, useLayoutEffect as z, useContext as $, useState as R } from "react";
+import { Dialog as d } from "@base-ui/react/dialog";
+import { AlertDialog as h } from "@base-ui/react/alert-dialog";
+import { tv as q } from "tailwind-variants";
+import { cn as _ } from "../lib/cn.js";
+import { Button as A } from "./Button.js";
+import { IconButton as K } from "./IconButton.js";
+import { Icon as k } from "./Icon.js";
+import { Field as W } from "./Field.js";
+import { Input as G } from "./Input.js";
+import { OVERLAY_HEADER_ACTIONS_GROW_CLASS as J, OVERLAY_HEADER_ACTIONS_CLASS as Q, OVERLAY_POPUP_SURFACE as X, OVERLAY_POPUP_MOTION as Z, overlayBackdropClassName as H } from "./overlay-shell.js";
+import { PopoverScopeContext as ee, dismissPopoversOutside as te, coverPopovers as re } from "./overlay-stack.js";
+import { useUiStrings as O } from "../lib/i18n/provider.js";
+function T(t) {
+  const o = C(null), a = C(!1);
+  return z(() => {
+    if (t && !a.current) {
+      const r = document.activeElement;
+      o.current = r instanceof HTMLElement && r !== document.body ? r : null;
+    }
+    a.current = !!t;
+  }, [t]), () => {
+    const r = o.current;
+    return r && r.isConnected ? r : !0;
+  };
+}
+function L(t, o) {
+  const a = $(ee), [r, m] = R(!1), i = t ?? r;
+  return z(() => {
+    if (i)
+      return te(a), re(a);
+  }, [i, a]), (c) => {
+    m(c), o?.(c);
+  };
+}
+const F = q({
+  slots: {
+    backdrop: H(),
+    popup: [
+      "fixed left-1/2 top-1/2 z-(--z-modal) -translate-x-1/2 -translate-y-1/2",
+      "flex max-h-[calc(100dvh-2rem)] w-[calc(100vw-2rem)] flex-col",
+      X,
+      ...Z,
+      "data-starting-style:scale-95 data-starting-style:opacity-0"
+    ],
+    /* `pr-12` reserves the corner close button's own footprint so a long title
+       or description never runs underneath it — see the close button's own
+       comment below for why it sits OUTSIDE this row instead of inside it. */
+    header: "flex items-start gap-4 px-6 pr-12 pt-6",
+    /* Pinned to the popup's corner (see the close button's own comment). */
+    close: "absolute top-4 right-4",
+    /* The title block. `basis-40` lets a wrapping header (below) give it its own row. */
+    titleBlock: "min-w-0 flex-1 basis-40",
+    title: "font-display text-lg font-semibold text-primary text-balance",
+    description: "mt-1.5 text-sm text-secondary text-pretty",
+    /* The body scrolls, not the panel, so the header and footer stay put on a
+       long form — the two places someone needs to reach without hunting. */
+    body: "min-h-0 flex-1 overflow-y-auto px-6 py-5",
+    footer: [
+      "flex flex-wrap items-center justify-end gap-2.5 px-6 pb-6 pt-2",
+      "border-t border-border-subtle pt-5"
+    ]
+  },
+  variants: {
+    size: {
+      /* DX-5257: the default. The popup's base width is already the viewport
+         minus a 1rem margin each side (down to a phone), so near-full width is
+         simply no cap. The narrower sizes below are chosen explicitly for a
+         small confirmation. */
+      wide: { popup: "max-w-none" },
+      sm: { popup: "max-w-sm" },
+      md: { popup: "max-w-lg" },
+      lg: { popup: "max-w-2xl" },
+      xl: { popup: "max-w-4xl" },
+      /* FULL SCREEN — edge to edge, for a workspace rather than a question
+         (a multi-column picker, a document you read at full height). The
+         centring translate is undone, not just outsized: a translated popup is
+         a containing block for every `position: fixed` descendant, which is
+         exactly why a hand-rolled "fixed inset-0" overlay opened INSIDE a
+         dialog comes out clipped to the dialog's box. Open a nested
+         `<Dialog size="full">` instead. The body drops its padding and its own
+         scroll, so the content lays out its own columns and scroll regions. */
+      full: {
+        popup: "left-0 top-0 h-dvh max-h-none w-screen max-w-none translate-x-0 translate-y-0 rounded-none border-0",
+        /* `flex-wrap` + the title block's `basis-40`: when the host's controls
+           leave the title less than ~10rem (a phone, where each is a 44px touch
+           target) the title takes its own row above them instead of shrinking
+           to a sliver (DX-4398). */
+        header: "flex-wrap border-b border-border-subtle px-4 pr-12 pt-3 pb-3",
+        /* One line each: the header shares its row with the host's own controls
+           (DX-4398), and a phone leaves the title block a sliver, which a wrapped
+           title turned into a column of two-letter lines. */
+        title: "text-base truncate",
+        description: "truncate",
+        body: "flex flex-col overflow-hidden p-0",
+        /* DX-4533 — the bar is `pt-3` and its controls are `xs` (DX-4398), so the
+           close button takes the same `xs` size at the same `top-3`: it lines up
+           with the bar instead of sitting 8px below it at the default corner. */
+        close: "top-3"
+      }
+    },
+    /* DX-5682: set by the Dialog itself from `singleRowHeader`; see the compound variant. */
+    bar: { true: {}, false: {} },
+    /* DXUI-94: set by the Dialog itself from `headerActionsGrow` / `compactHeader`; see the compound variants. */
+    grow: { true: {}, false: {} },
+    compact: { true: {}, false: {} },
+    /* DXUI-21: the body has no padding and no scroll of its own, as Drawer's
+       `flush` (DX-5682): the content lays out its own padding and scroll
+       regions, for a panel whose content must reach the popup's edges (a chat
+       thread) at any size. */
+    flush: { true: { body: "flex flex-col overflow-hidden p-0" } }
+  },
+  compoundVariants: [
+    /* DX-5682: a header opted in with `singleRowHeader` is ONE bar: title block (truncating), the host's
+       controls and the close button share a single vertically-centred row at every width, never wrapping
+       and never pinning the close button to a fixed corner offset. The close button sits IN the row
+       (see the Dialog markup), so its centre is the row's centre by construction. */
+    {
+      bar: !0,
+      class: {
+        header: "flex-nowrap items-center gap-2 px-4 py-3",
+        titleBlock: "basis-0",
+        close: "static flex-none"
+      }
+    },
+    /* DXUI-94: `compactHeader` thins the single-row bar: less padding and a tighter gap. */
+    { bar: !0, compact: !0, class: { header: "gap-1.5 px-3 py-1.5" } },
+    /* DXUI-94: `headerActionsGrow`: the title block takes only what its content needs, so the host's controls fill the rest. After the `bar` rule, so its `basis-0` does not win. */
+    { grow: !0, class: { titleBlock: "flex-initial basis-auto" } }
+  ],
+  defaultVariants: { size: "wide", bar: !1, grow: !1, compact: !1 }
+});
+function we({
+  trigger: t,
+  open: o,
+  onOpenChange: a,
+  title: r,
+  description: m,
+  actions: i,
+  hideClose: c = !1,
+  headerActions: f,
+  singleRowHeader: p,
+  headerActionsGrow: u,
+  compactHeader: g,
+  size: x,
+  flush: w,
+  className: y,
+  children: n,
+  ref: b
+}) {
+  const l = F({ size: x, bar: !!p, grow: !!u, compact: !!g, flush: w }), I = O().dialog, D = x === "full" || p && g ? "xs" : "sm", V = T(o), j = L(o, a), E = C(null), U = M(
+    (v) => {
+      E.current = v, typeof b == "function" ? b(v) : b && (b.current = v);
+    },
+    [b]
+  ), Y = (v) => {
+    const N = E.current;
+    if (f) return N;
+    const P = N?.querySelector("[data-autofocus]");
+    return P || (v === "touch" ? N : !0);
+  }, B = c ? null : /* @__PURE__ */ e(
+    d.Close,
+    {
+      render: /* @__PURE__ */ e(
+        K,
+        {
+          label: I.close,
+          hideTooltip: !0,
+          size: D,
+          icon: /* @__PURE__ */ e(k, { name: "x", size: D }),
+          className: l.close()
+        }
+      )
+    }
+  );
+  return /* @__PURE__ */ s(d.Root, { open: o, onOpenChange: j, children: [
+    t && /* @__PURE__ */ e(d.Trigger, { render: t }),
+    /* @__PURE__ */ s(d.Portal, { children: [
+      /* @__PURE__ */ e(d.Backdrop, { className: l.backdrop() }),
+      /* @__PURE__ */ s(
+        d.Popup,
+        {
+          ref: U,
+          className: _(l.popup(), y),
+          finalFocus: V,
+          initialFocus: Y,
+          children: [
+            /* @__PURE__ */ s("div", { className: l.header(), children: [
+              /* @__PURE__ */ s("div", { className: l.titleBlock(), children: [
+                /* @__PURE__ */ e(d.Title, { className: l.title(), children: r }),
+                m && /* @__PURE__ */ e(d.Description, { className: l.description(), children: m })
+              ] }),
+              f && /* @__PURE__ */ e("div", { className: u ? J : Q, children: f }),
+              p && B
+            ] }),
+            !c && !p && /* PINNED TO THE POPUP'S OWN CORNER, NOT THE HEADER ROW.
+            Sitting inside `header`'s flex row (the previous layout) put the
+            close button's vertical position at the mercy of the title's own
+            line height — a short one-line title read fine, but the button
+            shared a baseline with the FIRST line of title/description
+            content rather than sitting at a fixed, predictable corner
+            independent of how much text the header holds. `.popup` is
+            already `fixed`, which is itself a positioning context, so no
+            extra `relative` wrapper is needed here. `header`'s `pr-12`
+            reserves this button's footprint so title/description text
+            never runs underneath it.
+            `hideTooltip`: a Base UI `render` slot merges props and a ref
+            into ONE element, which a tooltip wrapper would swallow. The
+            accessible name still comes from `label`. */
+            B,
+            n && /* @__PURE__ */ e("div", { className: l.body(), children: n }),
+            i && /* @__PURE__ */ e("div", { className: l.footer(), children: i })
+          ]
+        }
+      )
+    ] })
+  ] });
+}
+function ve({ children: t }) {
+  return /* @__PURE__ */ e(d.Close, { render: t });
+}
+function Ne({
+  trigger: t,
+  open: o,
+  onOpenChange: a,
+  title: r,
+  description: m,
+  confirmLabel: i,
+  cancelLabel: c,
+  destructive: f = !1,
+  tone: p = "default",
+  loading: u = !1,
+  onConfirm: g,
+  confirmText: x,
+  className: w,
+  ref: y
+}) {
+  if (x === "")
+    throw new Error("AlertDialog: confirmText must be a non-empty string (an empty phrase would make type-to-confirm a no-op).");
+  const n = F({ size: "sm" }), b = T(o), l = L(o, a);
+  return /* @__PURE__ */ s(h.Root, { open: o, onOpenChange: l, children: [
+    t && /* @__PURE__ */ e(h.Trigger, { render: t }),
+    /* @__PURE__ */ s(h.Portal, { children: [
+      /* @__PURE__ */ e(h.Backdrop, { className: n.backdrop() }),
+      /* @__PURE__ */ e(h.Popup, { ref: y, className: _(n.popup(), w), finalFocus: b, children: /* @__PURE__ */ e(
+        ne,
+        {
+          s: n,
+          title: r,
+          description: m,
+          confirmLabel: i,
+          cancelLabel: c,
+          destructive: f,
+          tone: p,
+          loading: u,
+          onConfirm: g,
+          confirmText: x
+        }
+      ) })
+    ] })
+  ] });
+}
+const oe = (t) => /* @__PURE__ */ e("strong", { className: "font-mono font-semibold text-primary", children: t });
+function ae({ phrase: t }) {
+  return /* @__PURE__ */ e(S, { children: O().dialog.typeToConfirm(t, oe) });
+}
+function ne({
+  s: t,
+  title: o,
+  description: a,
+  confirmLabel: r,
+  cancelLabel: m,
+  destructive: i,
+  tone: c,
+  loading: f,
+  onConfirm: p,
+  confirmText: u
+}) {
+  const g = O().dialog, [x, w] = R(""), y = u === void 0 || x === u;
+  return /* @__PURE__ */ s(S, { children: [
+    /* @__PURE__ */ s("div", { className: "flex items-start gap-4 p-6", children: [
+      i && /* @__PURE__ */ e("span", { className: "grid size-10 shrink-0 place-items-center rounded-full bg-danger-subtle text-danger-text", children: /* @__PURE__ */ e(k, { name: "triangle-alert", size: "md" }) }),
+      c === "warning" && /* @__PURE__ */ e("span", { className: "grid size-10 shrink-0 place-items-center rounded-full bg-warning-subtle text-warning-text", children: /* @__PURE__ */ e(k, { name: "triangle-alert", size: "md" }) }),
+      /* @__PURE__ */ s("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ e(h.Title, { className: t.title(), children: o }),
+        a && /* @__PURE__ */ e(h.Description, { className: t.description(), children: a }),
+        u !== void 0 && /* @__PURE__ */ e(
+          W,
+          {
+            className: "mt-4",
+            label: /* @__PURE__ */ e(ae, { phrase: u }),
+            children: /* @__PURE__ */ e(
+              G,
+              {
+                value: x,
+                onChange: (n) => w(n.target.value),
+                onKeyDown: (n) => {
+                  n.key === "Enter" && (n.preventDefault(), y && !f && p?.());
+                },
+                autoComplete: "off",
+                autoCapitalize: "off",
+                spellCheck: !1
+              }
+            )
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ s("div", { className: "flex flex-wrap items-center justify-end gap-2.5 px-6 pb-6", children: [
+      /* @__PURE__ */ e(h.Close, { render: /* @__PURE__ */ e(A, { variant: "outline", children: m ?? g.cancel }) }),
+      /* @__PURE__ */ e(
+        A,
+        {
+          variant: i ? "danger" : c === "warning" ? "warning" : "solid",
+          loading: f,
+          disabled: !y,
+          onClick: p,
+          children: r ?? g.confirm
+        }
+      )
+    ] })
+  ] });
+}
+export {
+  Ne as AlertDialog,
+  we as Dialog,
+  ve as DialogClose,
+  T as useDialogFinalFocus,
+  L as useSupersedePopovers
+};
+//# sourceMappingURL=Dialog.js.map

package/dist/components/Dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dialog.js","sources":["../../src/components/Dialog.tsx"],"sourcesContent":["import { useCallback, useContext, useLayoutEffect, useRef, useState, type ReactNode, type Ref } from \"react\";\nimport { Dialog as BaseDialog } from \"@base-ui/react/dialog\";\nimport { AlertDialog as BaseAlertDialog } from \"@base-ui/react/alert-dialog\";\nimport { tv, type VariantProps } from \"tailwind-variants\";\nimport { cn } from \"../lib/cn\";\nimport { useUiStrings, type Emphasis } from \"../lib/i18n\";\nimport { Button } from \"./Button\";\nimport { IconButton } from \"./IconButton\";\nimport { Icon } from \"./Icon\";\nimport { Field } from \"./Field\";\nimport { Input } from \"./Input\";\nimport { overlayBackdropClassName, OVERLAY_HEADER_ACTIONS_CLASS, OVERLAY_HEADER_ACTIONS_GROW_CLASS, OVERLAY_POPUP_MOTION, OVERLAY_POPUP_SURFACE } from \"./overlay-shell\";\nimport { coverPopovers, dismissPopoversOutside, PopoverScopeContext } from \"./overlay-stack\";\n\n/* ============================================================================\n   DIALOG\n\n   THE MOTION SAYS WHERE IT CAME FROM AND WHETHER YOU CAN LEAVE.\n\n   A dialog rises and scales in from slightly below and slightly small, on the\n   emphasis curve — arriving with intent. It leaves faster, straight out, with\n   no scale: dismissal should feel like the thing getting out of your way, not\n   like a second animation you have to wait through.\n\n   The backdrop fades on its own timing, and deliberately does NOT scale with\n   the panel. Tying them together makes the whole screen feel like it is\n   zooming, which is the single most nauseating thing a modal can do.\n\n   ALERT vs DIALOG is not a style choice. An AlertDialog cannot be dismissed by\n   clicking outside or pressing Escape, because it is asking a question whose\n   answer matters — \"delete this forever?\" must not be answerable by a stray\n   click. That behavioural difference is why they are two components rather\n   than a `dismissible` prop, which would make the safe option the one you have\n   to remember to pass.\n   ========================================================================= */\n\n/* ----------------------------------------------------------------------------\n   RETURN-FOCUS, FOR A DIALOG THAT HAS NO `trigger` PROP.\n\n   SG-847: closing a dialog with the keyboard (Escape, Cancel, or a backdrop\n   click) must put focus back on whatever control opened it. Base UI's own\n   Dialog gets this right ONLY when it knows the opening control as its\n   `domReference` — which happens automatically for a `<Dialog trigger={...}>`,\n   because Base UI wires the trigger element into its floating-ui interaction\n   system the moment it is clicked.\n\n   Every dialog in this app's real consumers is the OTHER shape: `open` /\n   `onOpenChange`, no `trigger`, opened by flipping state from a plain button's\n   own `onClick` (or, one level removed, from a menu item's `onClick`). With no\n   `domReference` registered, Base UI's only fallback is \"whatever had DOM\n   focus right before the popup mounted\" — captured by ITS OWN internal effect,\n   racing against the SAME render's initial-focus effect (which moves focus\n   INTO the dialog) and against whatever opened it disappearing from the page.\n   Two failure shapes were confirmed BY INSTRUMENTING FloatingFocusManager's\n   `returnFocus` cleanup and Base UI's `restoreFocus: \"popup\"` focus-out\n   listener (`HTMLElement.prototype.focus` patched to log every call, target,\n   and connectedness) against this app's real \"New template\" button and its\n   real menu-triggered delete confirmation:\n\n   - A dialog opened directly from a plain button: Base UI's internal capture\n     never resolves to a still-connected element by close time, its global\n     \"previously focused elements\" fallback stack has nothing else to offer,\n     and focus is left exactly nowhere — the browser defaults it to\n     `<body>`, which is the bug this card reports.\n   - A dialog opened from a MENU item happens to work today, but only by\n     accident: the item itself is what Base UI's internal capture resolves\n     to, and it is gone (unmounted) the instant the menu closes — so Base UI\n     falls through to that SAME global fallback stack, which HAPPENS to still\n     hold the menu's own trigger button (pushed there when the menu opened,\n     ahead of the dialog) because a real `trigger` prop was used one level up.\n     Nothing about the Dialog itself makes this reliable; it is a lucky\n     side effect of the enclosing menu being the trigger-based kind.\n\n   So the fix is not \"make Base UI's fallback smarter\" — it has no way to\n   know the opening control without a real `domReference`, and this app never\n   gives it one. The fix is to give it an explicit, ALWAYS-correct answer:\n   capture `document.activeElement` ourselves, in a layout effect keyed on\n   `open` flipping true, which runs in the SAME synchronous commit Base UI's\n   own capture does (before anything's queued microtask can move focus away)\n   — then hand it to Base UI as `finalFocus`, which Base UI already supports\n   as an escape hatch for exactly this (\"no real trigger\") situation but which\n   nothing in this file passed through until now.\n\n   `finalFocus` is a FUNCTION, not a plain ref, so the captured element is\n   re-checked at CLOSE time: if it went away in the meantime (the dialog's own\n   `children` unmounted it, or anything else did), returning `true` defers to\n   Base UI's own default resolution — which is exactly the accidental-but-\n   working menu path above, left alone rather than fought. Every consumer gets\n   this for free; none of the ~9 call sites in this app's Demand Desk needs to\n   change, which is the point — SG-833 spent an entire slice deleting the\n   duplication that per-consumer focus restoration would put right back. */\nexport function useDialogFinalFocus(open: boolean | undefined) {\n  const openerRef = useRef<HTMLElement | null>(null);\n  const wasOpenRef = useRef(false);\n\n  useLayoutEffect(() => {\n    if (open && !wasOpenRef.current) {\n      const active = document.activeElement;\n      openerRef.current = active instanceof HTMLElement && active !== document.body ? active : null;\n    }\n    wasOpenRef.current = Boolean(open);\n  }, [open]);\n\n  return () => {\n    const el = openerRef.current;\n    return el && el.isConnected ? el : true;\n  };\n}\n\n/* DX-4398: what a dialog does to the popovers around it (see `overlay-stack.ts`).\n   A popover sits above a dialog by design, so while a dialog is open the popovers\n   OUTSIDE it are closed and the ones it lives INSIDE are hidden — either would\n   otherwise cover it. `open` is the controlled flip; an uncontrolled dialog\n   (a `trigger`) reports its state through `onOpenChange`. */\nexport function useSupersedePopovers(open: boolean | undefined, onOpenChange: DialogProps[\"onOpenChange\"]) {\n  const ancestry = useContext(PopoverScopeContext);\n  const [inner, setInner] = useState(false);\n  const shown = open ?? inner;\n\n  useLayoutEffect(() => {\n    if (!shown) return;\n    dismissPopoversOutside(ancestry);\n    return coverPopovers(ancestry);\n  }, [shown, ancestry]);\n\n  return (next: boolean) => {\n    setInner(next);\n    onOpenChange?.(next);\n  };\n}\n\nconst dialog = tv({\n  slots: {\n    backdrop: overlayBackdropClassName(),\n    popup: [\n      \"fixed left-1/2 top-1/2 z-(--z-modal) -translate-x-1/2 -translate-y-1/2\",\n      \"flex max-h-[calc(100dvh-2rem)] w-[calc(100vw-2rem)] flex-col\",\n      OVERLAY_POPUP_SURFACE,\n      ...OVERLAY_POPUP_MOTION,\n      \"data-starting-style:scale-95 data-starting-style:opacity-0\",\n    ],\n    /* `pr-12` reserves the corner close button's own footprint so a long title\n       or description never runs underneath it — see the close button's own\n       comment below for why it sits OUTSIDE this row instead of inside it. */\n    header: \"flex items-start gap-4 px-6 pr-12 pt-6\",\n    /* Pinned to the popup's corner (see the close button's own comment). */\n    close: \"absolute top-4 right-4\",\n    /* The title block. `basis-40` lets a wrapping header (below) give it its own row. */\n    titleBlock: \"min-w-0 flex-1 basis-40\",\n    title: \"font-display text-lg font-semibold text-primary text-balance\",\n    description: \"mt-1.5 text-sm text-secondary text-pretty\",\n    /* The body scrolls, not the panel, so the header and footer stay put on a\n       long form — the two places someone needs to reach without hunting. */\n    body: \"min-h-0 flex-1 overflow-y-auto px-6 py-5\",\n    footer: [\n      \"flex flex-wrap items-center justify-end gap-2.5 px-6 pb-6 pt-2\",\n      \"border-t border-border-subtle pt-5\",\n    ],\n  },\n  variants: {\n    size: {\n      /* DX-5257: the default. The popup's base width is already the viewport\n         minus a 1rem margin each side (down to a phone), so near-full width is\n         simply no cap. The narrower sizes below are chosen explicitly for a\n         small confirmation. */\n      wide: { popup: \"max-w-none\" },\n      sm: { popup: \"max-w-sm\" },\n      md: { popup: \"max-w-lg\" },\n      lg: { popup: \"max-w-2xl\" },\n      xl: { popup: \"max-w-4xl\" },\n      /* FULL SCREEN — edge to edge, for a workspace rather than a question\n         (a multi-column picker, a document you read at full height). The\n         centring translate is undone, not just outsized: a translated popup is\n         a containing block for every `position: fixed` descendant, which is\n         exactly why a hand-rolled \"fixed inset-0\" overlay opened INSIDE a\n         dialog comes out clipped to the dialog's box. Open a nested\n         `<Dialog size=\"full\">` instead. The body drops its padding and its own\n         scroll, so the content lays out its own columns and scroll regions. */\n      full: {\n        popup:\n          \"left-0 top-0 h-dvh max-h-none w-screen max-w-none translate-x-0 translate-y-0 rounded-none border-0\",\n        /* `flex-wrap` + the title block's `basis-40`: when the host's controls\n           leave the title less than ~10rem (a phone, where each is a 44px touch\n           target) the title takes its own row above them instead of shrinking\n           to a sliver (DX-4398). */\n        header: \"flex-wrap border-b border-border-subtle px-4 pr-12 pt-3 pb-3\",\n        /* One line each: the header shares its row with the host's own controls\n           (DX-4398), and a phone leaves the title block a sliver, which a wrapped\n           title turned into a column of two-letter lines. */\n        title: \"text-base truncate\",\n        description: \"truncate\",\n        body: \"flex flex-col overflow-hidden p-0\",\n        /* DX-4533 — the bar is `pt-3` and its controls are `xs` (DX-4398), so the\n           close button takes the same `xs` size at the same `top-3`: it lines up\n           with the bar instead of sitting 8px below it at the default corner. */\n        close: \"top-3\",\n      },\n    },\n    /* DX-5682: set by the Dialog itself from `singleRowHeader`; see the compound variant. */\n    bar: { true: {}, false: {} },\n    /* DXUI-94: set by the Dialog itself from `headerActionsGrow` / `compactHeader`; see the compound variants. */\n    grow: { true: {}, false: {} },\n    compact: { true: {}, false: {} },\n    /* DXUI-21: the body has no padding and no scroll of its own, as Drawer's\n       `flush` (DX-5682): the content lays out its own padding and scroll\n       regions, for a panel whose content must reach the popup's edges (a chat\n       thread) at any size. */\n    flush: { true: { body: \"flex flex-col overflow-hidden p-0\" } },\n  },\n  compoundVariants: [\n    /* DX-5682: a header opted in with `singleRowHeader` is ONE bar: title block (truncating), the host's\n       controls and the close button share a single vertically-centred row at every width, never wrapping\n       and never pinning the close button to a fixed corner offset. The close button sits IN the row\n       (see the Dialog markup), so its centre is the row's centre by construction. */\n    {\n      bar: true,\n      class: {\n        header: \"flex-nowrap items-center gap-2 px-4 py-3\",\n        titleBlock: \"basis-0\",\n        close: \"static flex-none\",\n      },\n    },\n    /* DXUI-94: `compactHeader` thins the single-row bar: less padding and a tighter gap. */\n    { bar: true, compact: true, class: { header: \"gap-1.5 px-3 py-1.5\" } },\n    /* DXUI-94: `headerActionsGrow`: the title block takes only what its content needs, so the host's controls fill the rest. After the `bar` rule, so its `basis-0` does not win. */\n    { grow: true, class: { titleBlock: \"flex-initial basis-auto\" } },\n  ],\n  defaultVariants: { size: \"wide\", bar: false, grow: false, compact: false },\n});\n\n/** What opened the dialog, as Base UI hands it to an `initialFocus` function (the library does not export the type by name). */\ntype InitialFocusOpenType = Parameters<Extract<NonNullable<BaseDialog.Popup.Props[\"initialFocus\"]>, (...args: never[]) => unknown>>[0];\n\nexport interface DialogProps extends Omit<VariantProps<typeof dialog>, \"grow\" | \"compact\"> {\n  /** The control that opens the dialog. Omit for a fully controlled dialog. */\n  trigger?: ReactNode;\n  open?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  title: ReactNode;\n  description?: ReactNode;\n  /** Buttons for the footer. Omit to render no footer at all. */\n  actions?: ReactNode;\n  /** Hide the corner close button — for a dialog that must be answered. */\n  hideClose?: boolean;\n  /**\n   * The host's own controls, in the header row beside the title and before the\n   * corner close button (DX-4398). For a dialog whose one header bar carries its\n   * working controls — a viewer's navigation and zoom — instead of a header plus\n   * a toolbar row costing the content vertical space. Omitted: the header is\n   * exactly the title block.\n   */\n  headerActions?: ReactNode;\n  /**\n   * DX-5682: opt in to ONE header row. The title block (truncating), the\n   * `headerActions` and the close button share a single non-wrapping,\n   * vertically centred row at every width, and the close button sits IN the\n   * row instead of at the popup's corner. Off (the default) the header keeps\n   * DX-4398's behaviour: on a phone the title takes its own row above the\n   * controls and the close button stays pinned to the corner. Use it for a\n   * full-page viewer whose header is a working toolbar.\n   */\n  singleRowHeader?: boolean;\n  /**\n   * DXUI-94: the `headerActions` fill the row beside the title (start-aligned, truncating inside it) instead of hugging the close button; the\n   * title block then takes only the room its content needs. Without `headerActions` it changes nothing.\n   */\n  headerActionsGrow?: boolean;\n  /**\n   * DXUI-94: with `singleRowHeader`, a thinner bar: less padding, a tighter gap and a smaller close button. Without `singleRowHeader` it changes nothing.\n   */\n  compactHeader?: boolean;\n  /**\n   * DXUI-21: the body has no padding and no scroll of its own, so the content\n   * lays out its own padding and scroll regions and can reach the popup's\n   * edges (a chat thread). Off (the default) the body pads and scrolls.\n   */\n  flush?: boolean;\n  className?: string;\n  children?: ReactNode;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport function Dialog({\n  trigger,\n  open,\n  onOpenChange,\n  title,\n  description,\n  actions,\n  hideClose = false,\n  headerActions,\n  singleRowHeader,\n  headerActionsGrow,\n  compactHeader,\n  size,\n  flush,\n  className,\n  children,\n  ref,\n}: DialogProps) {\n  const s = dialog({ size, bar: Boolean(singleRowHeader), grow: Boolean(headerActionsGrow), compact: Boolean(compactHeader), flush });\n  const strings = useUiStrings().dialog;\n  // DX-4533: a full-size dialog's close button matches its compact bar's `xs` controls.\n  const closeSize = size === \"full\" || (singleRowHeader && compactHeader) ? \"xs\" : \"sm\";\n  const finalFocus = useDialogFinalFocus(open);\n  const handleOpenChange = useSupersedePopovers(open, onOpenChange);\n  const popupElRef = useRef<HTMLDivElement | null>(null);\n  const popupRef = useCallback(\n    (el: HTMLDivElement | null) => {\n      popupElRef.current = el;\n      if (typeof ref === \"function\") ref(el);\n      else if (ref) ref.current = el;\n    },\n    [ref],\n  );\n  /* DX-5127: a control inside the dialog that wants focus on open (an\n     OTPInput with `autoFocus` marks its first box `data-autofocus`) gets it.\n     Otherwise Base UI's default: the popup itself on touch (no keyboard to\n     raise) and the first tabbable on mouse/keyboard. */\n  const initialFocus = (openType: InitialFocusOpenType) => {\n    const popup = popupElRef.current;\n    /* DX-4398: with header actions, the first tabbable is one of them, and an\n       IconButton's tooltip opens on keyboard focus and swallows the first Escape —\n       so the dialog could not be closed by the key it is closed by. Focus starts on\n       the popup itself; the first Tab reaches the first control. */\n    if (headerActions) return popup;\n    const marked = popup?.querySelector<HTMLElement>(\"[data-autofocus]\");\n    if (marked) return marked;\n    return openType === \"touch\" ? popup : true;\n  };\n\n  const closeButton = hideClose ? null : (\n    <BaseDialog.Close\n      render={\n        <IconButton\n          label={strings.close}\n          hideTooltip\n          size={closeSize}\n          icon={<Icon name=\"x\" size={closeSize} />}\n          className={s.close()}\n        />\n      }\n    />\n  );\n\n  return (\n    <BaseDialog.Root open={open} onOpenChange={handleOpenChange}>\n      {trigger && <BaseDialog.Trigger render={trigger as React.ReactElement} />}\n      <BaseDialog.Portal>\n        <BaseDialog.Backdrop className={s.backdrop()} />\n        <BaseDialog.Popup\n          ref={popupRef}\n          className={cn(s.popup(), className)}\n          finalFocus={finalFocus}\n          initialFocus={initialFocus}\n        >\n          <div className={s.header()}>\n            <div className={s.titleBlock()}>\n              <BaseDialog.Title className={s.title()}>{title}</BaseDialog.Title>\n              {description && (\n                <BaseDialog.Description className={s.description()}>\n                  {description}\n                </BaseDialog.Description>\n              )}\n            </div>\n            {headerActions && <div className={headerActionsGrow ? OVERLAY_HEADER_ACTIONS_GROW_CLASS : OVERLAY_HEADER_ACTIONS_CLASS}>{headerActions}</div>}\n            {/* DX-5682: in the single-row header the close button is the bar's last item, so it shares the row's centre line. */}\n            {singleRowHeader && closeButton}\n          </div>\n          {!hideClose && !singleRowHeader && (\n            /* PINNED TO THE POPUP'S OWN CORNER, NOT THE HEADER ROW.\n               Sitting inside `header`'s flex row (the previous layout) put the\n               close button's vertical position at the mercy of the title's own\n               line height — a short one-line title read fine, but the button\n               shared a baseline with the FIRST line of title/description\n               content rather than sitting at a fixed, predictable corner\n               independent of how much text the header holds. `.popup` is\n               already `fixed`, which is itself a positioning context, so no\n               extra `relative` wrapper is needed here. `header`'s `pr-12`\n               reserves this button's footprint so title/description text\n               never runs underneath it.\n               `hideTooltip`: a Base UI `render` slot merges props and a ref\n               into ONE element, which a tooltip wrapper would swallow. The\n               accessible name still comes from `label`. */\n            closeButton\n          )}\n\n          {children && <div className={s.body()}>{children}</div>}\n          {actions && <div className={s.footer()}>{actions}</div>}\n        </BaseDialog.Popup>\n      </BaseDialog.Portal>\n    </BaseDialog.Root>\n  );\n}\n\n/** Closes the nearest Dialog. Wrap any button: `<DialogClose>{<Button/>}</DialogClose>`. */\nexport function DialogClose({ children }: { children: ReactNode }) {\n  return <BaseDialog.Close render={children as React.ReactElement} />;\n}\n\ninterface AlertDialogBaseProps {\n  trigger?: ReactNode;\n  open?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  title: ReactNode;\n  description?: ReactNode;\n  confirmLabel?: string;\n  cancelLabel?: string;\n  loading?: boolean;\n  onConfirm?: () => void;\n  /**\n   * Type-to-confirm (DX-3809). When set, the body shows a labelled text field\n   * and the confirm button stays disabled until the typed value equals this\n   * string EXACTLY — case-sensitive, no trimming. For the irreversible action\n   * where a stray click on a red button is not enough friction (\"type the\n   * team's name to delete it\"). Enter in the field confirms only on a match.\n   * Cancel keeps the initial focus. The field starts empty on every open. An\n   * empty string is a programming error and throws.\n   */\n  confirmText?: string;\n  className?: string;\n  ref?: Ref<HTMLDivElement>;\n}\n\n/**\n * The severity of what the dialog asks.\n *\n * `destructive` and `tone=\"warning\"` are different questions and cannot both be\n * true, so the type refuses the pair rather than letting one silently win:\n *   - `destructive` — \"this cannot be undone\": a red medallion and a red confirm.\n *   - `tone=\"warning\"` — \"this can be done, but not in the state things are in\n *     right now\" (promote docs before the plan is complete): an amber\n *     medallion and an amber confirm, with the caller's description saying what\n *     may go wrong. Reversible, so the confirm is not red; unusual, so it is not\n *     the plain accent either.\n */\nexport type AlertDialogProps = AlertDialogBaseProps &\n  ({ destructive: true; tone?: never } | { destructive?: false; tone?: \"default\" | \"warning\" });\n\n/**\n * A dialog that must be answered — no outside click, no Escape.\n *\n * The confirm button is the LAST in the footer and the cancel button comes\n * first, which is the reverse of how people often write it. Cancel-first means\n * the pointer travelling in from the panel's content reaches the safe option\n * before the destructive one, and keyboard focus lands on cancel by default.\n */\nexport function AlertDialog({\n  trigger,\n  open,\n  onOpenChange,\n  title,\n  description,\n  confirmLabel,\n  cancelLabel,\n  destructive = false,\n  tone = \"default\",\n  loading = false,\n  onConfirm,\n  confirmText,\n  className,\n  ref,\n}: AlertDialogProps) {\n  if (confirmText === \"\") {\n    throw new Error(\"AlertDialog: confirmText must be a non-empty string (an empty phrase would make type-to-confirm a no-op).\");\n  }\n  const s = dialog({ size: \"sm\" });\n  const finalFocus = useDialogFinalFocus(open);\n  const handleOpenChange = useSupersedePopovers(open, onOpenChange);\n\n  return (\n    <BaseAlertDialog.Root open={open} onOpenChange={handleOpenChange}>\n      {trigger && <BaseAlertDialog.Trigger render={trigger as React.ReactElement} />}\n      <BaseAlertDialog.Portal>\n        <BaseAlertDialog.Backdrop className={s.backdrop()} />\n        <BaseAlertDialog.Popup ref={ref} className={cn(s.popup(), className)} finalFocus={finalFocus}>\n          <AlertDialogContent\n            s={s}\n            title={title}\n            description={description}\n            confirmLabel={confirmLabel}\n            cancelLabel={cancelLabel}\n            destructive={destructive}\n            tone={tone}\n            loading={loading}\n            onConfirm={onConfirm}\n            confirmText={confirmText}\n          />\n        </BaseAlertDialog.Popup>\n      </BaseAlertDialog.Portal>\n    </BaseAlertDialog.Root>\n  );\n}\n\ninterface AlertDialogContentProps {\n  s: ReturnType<typeof dialog>;\n  title: ReactNode;\n  description?: ReactNode;\n  confirmLabel?: string;\n  cancelLabel?: string;\n  destructive: boolean;\n  tone: \"default\" | \"warning\";\n  loading: boolean;\n  onConfirm?: () => void;\n  confirmText?: string;\n}\n\n/* The provider's sentence places the phrase wherever the language needs it, through this slot; the\n   phrase itself is set in mono so the person can see exactly what to type. */\nconst phraseEmphasis: Emphasis = (phrase) => <strong className=\"font-mono font-semibold text-primary\">{phrase}</strong>;\n\nfunction TypeToConfirmLabel({ phrase }: { phrase: string }) {\n  return <>{useUiStrings().dialog.typeToConfirm(phrase, phraseEmphasis)}</>;\n}\n\n/* The popup's content lives in its own component so the type-to-confirm text is\n   state of the OPEN dialog: Base UI unmounts the popup on close, so the field\n   is empty again on every reopen with no reset effect to forget. */\nfunction AlertDialogContent({\n  s,\n  title,\n  description,\n  confirmLabel,\n  cancelLabel,\n  destructive,\n  tone,\n  loading,\n  onConfirm,\n  confirmText,\n}: AlertDialogContentProps) {\n  const strings = useUiStrings().dialog;\n  const [typed, setTyped] = useState(\"\");\n  const matches = confirmText === undefined || typed === confirmText;\n\n  return (\n    <>\n          <div className=\"flex items-start gap-4 p-6\">\n            {destructive && (\n              <span className=\"grid size-10 shrink-0 place-items-center rounded-full bg-danger-subtle text-danger-text\">\n                <Icon name=\"triangle-alert\" size=\"md\" />\n              </span>\n            )}\n            {tone === \"warning\" && (\n              <span className=\"grid size-10 shrink-0 place-items-center rounded-full bg-warning-subtle text-warning-text\">\n                <Icon name=\"triangle-alert\" size=\"md\" />\n              </span>\n            )}\n            <div className=\"min-w-0 flex-1\">\n              <BaseAlertDialog.Title className={s.title()}>{title}</BaseAlertDialog.Title>\n              {description && (\n                <BaseAlertDialog.Description className={s.description()}>\n                  {description}\n                </BaseAlertDialog.Description>\n              )}\n              {confirmText !== undefined && (\n                <Field\n                  className=\"mt-4\"\n                  label={<TypeToConfirmLabel phrase={confirmText} />}\n                >\n                  <Input\n                    value={typed}\n                    onChange={(e) => setTyped(e.target.value)}\n                    onKeyDown={(e) => {\n                      if (e.key !== \"Enter\") return;\n                      e.preventDefault();\n                      if (matches && !loading) onConfirm?.();\n                    }}\n                    autoComplete=\"off\"\n                    autoCapitalize=\"off\"\n                    spellCheck={false}\n                  />\n                </Field>\n              )}\n            </div>\n          </div>\n          <div className=\"flex flex-wrap items-center justify-end gap-2.5 px-6 pb-6\">\n            <BaseAlertDialog.Close render={<Button variant=\"outline\">{cancelLabel ?? strings.cancel}</Button>} />\n            <Button\n              variant={destructive ? \"danger\" : tone === \"warning\" ? \"warning\" : \"solid\"}\n              loading={loading}\n              disabled={!matches}\n              onClick={onConfirm}\n            >\n              {confirmLabel ?? strings.confirm}\n            </Button>\n          </div>\n    </>\n  );\n}\n"],"names":["useDialogFinalFocus","open","openerRef","useRef","wasOpenRef","useLayoutEffect","active","el","useSupersedePopovers","onOpenChange","ancestry","useContext","PopoverScopeContext","inner","setInner","useState","shown","dismissPopoversOutside","coverPopovers","next","dialog","tv","overlayBackdropClassName","OVERLAY_POPUP_SURFACE","OVERLAY_POPUP_MOTION","Dialog","trigger","title","description","actions","hideClose","headerActions","singleRowHeader","headerActionsGrow","compactHeader","size","flush","className","children","ref","s","strings","useUiStrings","closeSize","finalFocus","handleOpenChange","popupElRef","popupRef","useCallback","initialFocus","openType","popup","marked","closeButton","jsx","BaseDialog","IconButton","Icon","jsxs","cn","OVERLAY_HEADER_ACTIONS_GROW_CLASS","OVERLAY_HEADER_ACTIONS_CLASS","DialogClose","AlertDialog","confirmLabel","cancelLabel","destructive","tone","loading","onConfirm","confirmText","BaseAlertDialog","AlertDialogContent","phraseEmphasis","phrase","TypeToConfirmLabel","typed","setTyped","matches","Fragment","Field","Input","e","Button"],"mappings":"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"}