@lucasbernardosn/react-ui 0.2.0 → 0.4.0

package/dist/components/overlays/alert-dialog/alert-dialog-indicator.js

@@ -0,0 +1,51 @@
+import { mergeTwClassNames } from "../../../utils/merge-class-names.js";
+import { Icon } from "../../display/icon/icon.js";
+import { alertDialogIndicatorDefaultVariants, alertDialogIndicatorVariants } from "./alert-dialog-indicator-variants.js";
+import { createSplitProps } from "@lucasbernardosn/ts-utils";
+import { mergeProps, useRender } from "@base-ui/react";
+import { jsx } from "react/jsx-runtime";
+import { CheckCircleIcon, InfoIcon, WarningCircleIcon, WarningIcon } from "@phosphor-icons/react";
+//#region src/components/overlays/alert-dialog/alert-dialog-indicator.tsx
+const splitVariantProps = createSplitProps();
+/**
+* Ícone do alert dialog, na cor do `status`. Sem filhos, mostra o ícone do `status`, pelo `Icon`
+* da lib; com filhos (outro ícone, um emoji), usa os filhos, e um ícone próprio entra pelo `Icon`
+* para ter o mesmo traço. O `svg` mede `1em` (20px), numa caixa da altura da linha do
+* `AlertDialog.Title`, para ficar alinhado à primeira linha.
+*
+* Como filho do `AlertDialog.Header`, fica à esquerda do texto; no celular, acima dele.
+*
+* Fica com `aria-hidden`: o ícone repete o que o texto diz, e o `status` não é anunciado por ele.
+*
+* Cópia do `Alert.Indicator`, a origem (tabela no README de `feedback`), com os mesmos ícones; as
+* diferenças: o `status` é prop da parte, e não vem de um contexto, e a cor está no passo 11.
+*/
+const AlertDialogIndicator = (props) => {
+	const [variantProps, elementProps] = splitVariantProps(props, ["status"]);
+	const { render, className, children, ...rest } = elementProps;
+	const { status = alertDialogIndicatorDefaultVariants.status } = variantProps;
+	const StatusIcon = statusIcons[status];
+	const baseProps = {
+		"data-component": "AlertDialog.Indicator",
+		"aria-hidden": true,
+		children: children ?? /* @__PURE__ */ jsx(Icon, { render: /* @__PURE__ */ jsx(StatusIcon, {}) }),
+		className: mergeTwClassNames(alertDialogIndicatorVariants(variantProps), className)
+	};
+	return useRender({
+		render,
+		defaultTagName: "div",
+		props: mergeProps(baseProps, rest)
+	});
+};
+AlertDialogIndicator.displayName = "AlertDialog.Indicator";
+const statusIcons = {
+	neutral: InfoIcon,
+	info: InfoIcon,
+	success: CheckCircleIcon,
+	warning: WarningIcon,
+	error: WarningCircleIcon
+};
+//#endregion
+export { AlertDialogIndicator };
+
+//# sourceMappingURL=alert-dialog-indicator.js.map

package/dist/components/overlays/alert-dialog/alert-dialog-indicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-dialog-indicator.js","names":[],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-indicator.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport {\n  createSplitProps,\n  type MergeOverride,\n} from '@lucasbernardosn/ts-utils';\nimport {\n  CheckCircleIcon,\n  InfoIcon,\n  WarningCircleIcon,\n  WarningIcon,\n} from '@phosphor-icons/react';\nimport type React from 'react';\nimport { Icon } from '#components/display/icon';\nimport { mergeTwClassNames } from '#utils';\nimport {\n  type AlertDialogIndicatorVariants,\n  alertDialogIndicatorDefaultVariants,\n  alertDialogIndicatorVariants,\n} from './alert-dialog-indicator-variants';\n\nexport type AlertDialogIndicatorProps = MergeOverride<\n  useRender.ComponentProps<'div'>,\n  AlertDialogIndicatorVariants\n>;\n\nconst splitVariantProps = createSplitProps<AlertDialogIndicatorVariants>();\n\n/**\n * Ícone do alert dialog, na cor do `status`. Sem filhos, mostra o ícone do `status`, pelo `Icon`\n * da lib; com filhos (outro ícone, um emoji), usa os filhos, e um ícone próprio entra pelo `Icon`\n * para ter o mesmo traço. O `svg` mede `1em` (20px), numa caixa da altura da linha do\n * `AlertDialog.Title`, para ficar alinhado à primeira linha.\n *\n * Como filho do `AlertDialog.Header`, fica à esquerda do texto; no celular, acima dele.\n *\n * Fica com `aria-hidden`: o ícone repete o que o texto diz, e o `status` não é anunciado por ele.\n *\n * Cópia do `Alert.Indicator`, a origem (tabela no README de `feedback`), com os mesmos ícones; as\n * diferenças: o `status` é prop da parte, e não vem de um contexto, e a cor está no passo 11.\n */\nexport const AlertDialogIndicator = (props: AlertDialogIndicatorProps) => {\n  const [variantProps, elementProps] = splitVariantProps(props, ['status']);\n\n  const { render, className, children, ...rest } = elementProps;\n\n  const { status = alertDialogIndicatorDefaultVariants.status } = variantProps;\n\n  const StatusIcon = statusIcons[status];\n\n  const baseProps = {\n    'data-component': 'AlertDialog.Indicator',\n    'aria-hidden': true,\n    children: children ?? <Icon render={<StatusIcon />} />,\n    className: mergeTwClassNames(\n      alertDialogIndicatorVariants(variantProps),\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nAlertDialogIndicator.displayName = 'AlertDialog.Indicator';\n\nconst statusIcons: Record<\n  Required<AlertDialogIndicatorVariants>['status'],\n  React.ComponentType\n> = {\n  neutral: InfoIcon,\n  info: InfoIcon,\n  success: CheckCircleIcon,\n  warning: WarningIcon,\n  error: WarningCircleIcon,\n};\n"],"mappings":";;;;;;;;AAyBA,MAAM,oBAAoB,iBAA+C;;;;;;;;;;;;;;AAezE,MAAa,wBAAwB,UAAqC;CACxE,MAAM,CAAC,cAAc,gBAAgB,kBAAkB,OAAO,CAAC,QAAQ,CAAC;CAExE,MAAM,EAAE,QAAQ,WAAW,UAAU,GAAG,SAAS;CAEjD,MAAM,EAAE,SAAS,oCAAoC,WAAW;CAEhE,MAAM,aAAa,YAAY;CAE/B,MAAM,YAAY;EAChB,kBAAkB;EAClB,eAAe;EACf,UAAU,YAAY,oBAAC,MAAD,EAAM,QAAQ,oBAAC,YAAD,CAAa,CAAA,EAAI,CAAA;EACrD,WAAW,kBACT,6BAA6B,YAAY,GACzC,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,qBAAqB,cAAc;AAEnC,MAAM,cAGF;CACF,SAAS;CACT,MAAM;CACN,SAAS;CACT,SAAS;CACT,OAAO;AACT"}

package/dist/components/overlays/alert-dialog/alert-dialog-outlet.d.ts

@@ -0,0 +1,27 @@
+import React from "react";
+//#region src/components/overlays/alert-dialog/alert-dialog-outlet.d.ts
+/**
+ * Onde aparecem os alertas abertos por `AlertDialog.alert` e `AlertDialog.confirm`. Monte um só,
+ * perto da raiz do app, abaixo dos providers globais (tema, tradução): os alertas só enxergam os
+ * providers acima dele, não os de quem os abriu. Não renderiza elemento próprio.
+ *
+ * Um alerta aberto sobre outro fica aninhado nele, com o efeito de pilha: o de trás recua e
+ * escurece, como num dialog dentro de outro. Aberto enquanto o de trás fecha, vai para a raiz, com
+ * o backdrop próprio.
+ *
+ * Se ele desmontar com um alerta aberto, a promise resolve como dispensada.
+ *
+ * @example
+ * ```tsx
+ * <ThemeProvider>
+ *   <App />
+ *   <AlertDialog.Outlet />
+ * </ThemeProvider>
+ * ```
+ */
+export declare const AlertDialogOutlet: {
+  (): React.ReactNode;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=alert-dialog-outlet.d.ts.map

package/dist/components/overlays/alert-dialog/alert-dialog-outlet.js

@@ -0,0 +1,39 @@
+import { alertDialogStore } from "./alert-dialog-store.js";
+import { Fragment, useEffect, useSyncExternalStore } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/overlays/alert-dialog/alert-dialog-outlet.tsx
+/**
+* Onde aparecem os alertas abertos por `AlertDialog.alert` e `AlertDialog.confirm`. Monte um só,
+* perto da raiz do app, abaixo dos providers globais (tema, tradução): os alertas só enxergam os
+* providers acima dele, não os de quem os abriu. Não renderiza elemento próprio.
+*
+* Um alerta aberto sobre outro fica aninhado nele, com o efeito de pilha: o de trás recua e
+* escurece, como num dialog dentro de outro. Aberto enquanto o de trás fecha, vai para a raiz, com
+* o backdrop próprio.
+*
+* Se ele desmontar com um alerta aberto, a promise resolve como dispensada.
+*
+* @example
+* ```tsx
+* <ThemeProvider>
+*   <App />
+*   <AlertDialog.Outlet />
+* </ThemeProvider>
+* ```
+*/
+const AlertDialogOutlet = () => {
+	const entries = useSyncExternalStore(alertDialogStore.subscribe, alertDialogStore.getSnapshot, alertDialogStore.getSnapshot);
+	useEffect(() => alertDialogStore.registerOutlet(), []);
+	return renderLevel(entries, null);
+};
+AlertDialogOutlet.displayName = "AlertDialog.Outlet";
+/**
+* Monta os alertas filhos de `parent` (os de raiz, com `null`), cada um com os seus aninhados
+* dentro. O `key` por `id` em cada nível mantém a identidade do alerta quando a lista muda: sem
+* ele, o React remontaria o alerta e reanimaria a entrada. O aninhamento é explicado no store.
+*/
+const renderLevel = (entries, parent) => entries.filter((entry) => entry.parentId === (parent?.id ?? null)).map((entry) => /* @__PURE__ */ jsx(Fragment, { children: entry.render(renderLevel(entries, entry), parent === null || parent.status === "open") }, entry.id));
+//#endregion
+export { AlertDialogOutlet };
+
+//# sourceMappingURL=alert-dialog-outlet.js.map

package/dist/components/overlays/alert-dialog/alert-dialog-outlet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-dialog-outlet.js","names":[],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-outlet.tsx"],"sourcesContent":["import type React from 'react';\nimport { Fragment, useEffect, useSyncExternalStore } from 'react';\nimport { type AlertDialogEntry, alertDialogStore } from './alert-dialog-store';\n\n/**\n * Onde aparecem os alertas abertos por `AlertDialog.alert` e `AlertDialog.confirm`. Monte um só,\n * perto da raiz do app, abaixo dos providers globais (tema, tradução): os alertas só enxergam os\n * providers acima dele, não os de quem os abriu. Não renderiza elemento próprio.\n *\n * Um alerta aberto sobre outro fica aninhado nele, com o efeito de pilha: o de trás recua e\n * escurece, como num dialog dentro de outro. Aberto enquanto o de trás fecha, vai para a raiz, com\n * o backdrop próprio.\n *\n * Se ele desmontar com um alerta aberto, a promise resolve como dispensada.\n *\n * @example\n * ```tsx\n * <ThemeProvider>\n *   <App />\n *   <AlertDialog.Outlet />\n * </ThemeProvider>\n * ```\n */\nexport const AlertDialogOutlet = (): React.ReactNode => {\n  const entries = useSyncExternalStore(\n    alertDialogStore.subscribe,\n    alertDialogStore.getSnapshot,\n    alertDialogStore.getSnapshot,\n  );\n\n  useEffect(() => alertDialogStore.registerOutlet(), []);\n\n  return renderLevel(entries, null);\n};\n\nAlertDialogOutlet.displayName = 'AlertDialog.Outlet';\n\n/**\n * Monta os alertas filhos de `parent` (os de raiz, com `null`), cada um com os seus aninhados\n * dentro. O `key` por `id` em cada nível mantém a identidade do alerta quando a lista muda: sem\n * ele, o React remontaria o alerta e reanimaria a entrada. O aninhamento é explicado no store.\n */\nconst renderLevel = (\n  entries: readonly AlertDialogEntry[],\n  parent: AlertDialogEntry | null,\n): React.ReactNode =>\n  entries\n    .filter((entry) => entry.parentId === (parent?.id ?? null))\n    .map((entry) => (\n      <Fragment key={entry.id}>\n        {entry.render(\n          renderLevel(entries, entry),\n          parent === null || parent.status === 'open',\n        )}\n      </Fragment>\n    ));\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAuBA,MAAa,0BAA2C;CACtD,MAAM,UAAU,qBACd,iBAAiB,WACjB,iBAAiB,aACjB,iBAAiB,WACnB;CAEA,gBAAgB,iBAAiB,eAAe,GAAG,CAAC,CAAC;CAErD,OAAO,YAAY,SAAS,IAAI;AAClC;AAEA,kBAAkB,cAAc;;;;;;AAOhC,MAAM,eACJ,SACA,WAEA,QACG,QAAQ,UAAU,MAAM,cAAc,QAAQ,MAAM,KAAK,CAAC,CAC1D,KAAK,UACJ,oBAAC,UAAD,EAAA,UACG,MAAM,OACL,YAAY,SAAS,KAAK,GAC1B,WAAW,QAAQ,OAAO,WAAW,MACvC,EACQ,GALK,MAAM,EAKX,CACX"}

package/dist/components/overlays/alert-dialog/alert-dialog-popup-variants.d.ts

@@ -1,7 +1,9 @@
 //#region src/components/overlays/alert-dialog/alert-dialog-popup-variants.d.ts
 /**
- * Cópia de `dialogPopupVariants`, sem diferenças (tabela no README de `overlays`): superfície,
- * largura pelo `size`, respiro e tipografia fixos e aninhamento estão explicados lá.
+ * Cópia de `dialogPopupVariants` (tabela no README de `overlays`): superfície, largura pelo `size`,
+ * respiro e tipografia fixos e aninhamento estão explicados lá. As diferenças: o respiro é de 24px
+ * e a sombra é `shadow-xl`. O AlertDialog segue o modelo de superfície da pendência "Superfícies"
+ * do ROADMAP, ainda não aplicado ao Dialog.
  */
 export declare const alertDialogPopupVariants: (props?: ({
   size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "full" | null | undefined;

package/dist/components/overlays/alert-dialog/alert-dialog-popup-variants.js

@@ -2,23 +2,24 @@ import { alertDialogDefaultVariants } from "./use-alert-dialog-context.js";
 import { cva } from "class-variance-authority";
 //#region src/components/overlays/alert-dialog/alert-dialog-popup-variants.ts
 /**
-* Cópia de `dialogPopupVariants`, sem diferenças (tabela no README de `overlays`): superfície,
-* largura pelo `size`, respiro e tipografia fixos e aninhamento estão explicados lá.
+* Cópia de `dialogPopupVariants` (tabela no README de `overlays`): superfície, largura pelo `size`,
+* respiro e tipografia fixos e aninhamento estão explicados lá. As diferenças: o respiro é de 24px
+* e a sombra é `shadow-xl`. O AlertDialog segue o modelo de superfície da pendência "Superfícies"
+* do ROADMAP, ainda não aplicado ao Dialog.
 */
 const alertDialogPopupVariants = cva([
-	"[--alert-dialog-padding:--spacing(4)]",
+	"[--alert-dialog-padding:--spacing(6)]",
 	"relative",
 	"flex",
 	"flex-col",
 	"w-full",
 	"max-h-full",
-	"rounded-md",
-	"corner-squircle",
+	"rounded-lg",
 	"outline-1",
 	"outline-gray-6",
-	"bg-white",
-	"dark:bg-gray-2",
-	"shadow-lg",
+	"bg-gray-1",
+	"dark:bg-gray-1",
+	"shadow-xl",
 	"shadow-black/12",
 	"dark:shadow-none",
 	"text-sm",

package/dist/components/overlays/alert-dialog/alert-dialog-popup-variants.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog-popup-variants.js","names":[],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-popup-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { alertDialogDefaultVariants } from './use-alert-dialog-context';\n\n/**\n * Cópia de `dialogPopupVariants`, sem diferenças (tabela no README de `overlays`): superfície,\n * largura pelo `size`, respiro e tipografia fixos e aninhamento estão explicados lá.\n */\nexport const alertDialogPopupVariants = cva(\n  [\n    '[--alert-dialog-padding:--spacing(4)]',\n\n    'relative',\n\n    'flex',\n    'flex-col',\n\n    'w-full',\n    'max-h-full',\n\n    'rounded-md',\n    'corner-squircle',\n    'outline-1',\n    'outline-gray-6',\n\n    'bg-white',\n    'dark:bg-gray-2',\n\n    'shadow-lg',\n    'shadow-black/12',\n    'dark:shadow-none',\n\n    // O popup vai para o `body` pelo portal: sem cor própria, o texto herdaria a do navegador.\n    'text-sm',\n    'text-gray-12',\n\n    'not-motion-reduced:transition-[translate,opacity,scale]',\n    'not-motion-reduced:ease-enter',\n    'not-motion-reduced:duration-150',\n\n    'not-motion-reduced:data-starting-style:scale-95',\n    'not-motion-reduced:data-ending-style:scale-95',\n    'not-motion-reduced:data-ending-style:ease-exit',\n    'not-motion-reduced:data-ending-style:duration-100',\n    'data-starting-style:opacity-0',\n    'data-ending-style:opacity-0',\n\n    'not-motion-reduced:data-nested-dialog-open:scale-[calc(1-0.05*var(--nested-dialogs))]',\n    'not-motion-reduced:data-nested-dialog-open:-translate-y-[calc(var(--nested-dialogs)*(--spacing(6)))]',\n\n    \"after:content-['']\",\n    'after:absolute',\n    'after:inset-0',\n    'after:rounded-[inherit]',\n    'after:bg-black/20',\n    'after:opacity-0',\n    'after:pointer-events-none',\n    'not-motion-reduced:after:transition-opacity',\n    'not-motion-reduced:after:duration-150',\n    'data-nested-dialog-open:after:opacity-100',\n  ],\n  {\n    variants: {\n      size: {\n        xs: ['max-w-xs'],\n        sm: ['max-w-sm'],\n        md: ['max-w-md'],\n        lg: ['max-w-lg'],\n        xl: ['max-w-xl'],\n        '2xl': ['max-w-2xl'],\n        '3xl': ['max-w-3xl'],\n        '4xl': ['max-w-4xl'],\n        '5xl': ['max-w-5xl'],\n        '6xl': ['max-w-6xl'],\n        '7xl': ['max-w-7xl'],\n        full: ['max-w-none', 'h-full'],\n      },\n    },\n    defaultVariants: {\n      size: alertDialogDefaultVariants.size,\n    },\n  },\n);\n"],"mappings":";;;;;;;AAOA,MAAa,2BAA2B,IACtC;CACE;CAEA;CAEA;CACA;CAEA;CACA;CAEA;CACA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CAGA;CACA;CAEA;CACA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,GACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,MAAM,CAAC,cAAc,QAAQ;CAC/B,EACF;CACA,iBAAiB,EACf,MAAM,2BAA2B,KACnC;AACF,CACF"}
+{"version":3,"file":"alert-dialog-popup-variants.js","names":[],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-popup-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { alertDialogDefaultVariants } from './use-alert-dialog-context';\n\n/**\n * Cópia de `dialogPopupVariants` (tabela no README de `overlays`): superfície, largura pelo `size`,\n * respiro e tipografia fixos e aninhamento estão explicados lá. As diferenças: o respiro é de 24px\n * e a sombra é `shadow-xl`. O AlertDialog segue o modelo de superfície da pendência \"Superfícies\"\n * do ROADMAP, ainda não aplicado ao Dialog.\n */\nexport const alertDialogPopupVariants = cva(\n  [\n    '[--alert-dialog-padding:--spacing(6)]',\n\n    'relative',\n\n    'flex',\n    'flex-col',\n\n    'w-full',\n    'max-h-full',\n\n    'rounded-lg',\n    'outline-1',\n    'outline-gray-6',\n\n    'bg-gray-1',\n    'dark:bg-gray-1',\n\n    'shadow-xl',\n    'shadow-black/12',\n    'dark:shadow-none',\n\n    // O popup vai para o `body` pelo portal: sem cor própria, o texto herdaria a do navegador.\n    'text-sm',\n    'text-gray-12',\n\n    'not-motion-reduced:transition-[translate,opacity,scale]',\n    'not-motion-reduced:ease-enter',\n    'not-motion-reduced:duration-150',\n\n    'not-motion-reduced:data-starting-style:scale-95',\n    'not-motion-reduced:data-ending-style:scale-95',\n    'not-motion-reduced:data-ending-style:ease-exit',\n    'not-motion-reduced:data-ending-style:duration-100',\n    'data-starting-style:opacity-0',\n    'data-ending-style:opacity-0',\n\n    'not-motion-reduced:data-nested-dialog-open:scale-[calc(1-0.05*var(--nested-dialogs))]',\n    'not-motion-reduced:data-nested-dialog-open:-translate-y-[calc(var(--nested-dialogs)*(--spacing(6)))]',\n\n    \"after:content-['']\",\n    'after:absolute',\n    'after:inset-0',\n    'after:rounded-[inherit]',\n    'after:bg-black/20',\n    'after:opacity-0',\n    'after:pointer-events-none',\n    'not-motion-reduced:after:transition-opacity',\n    'not-motion-reduced:after:duration-150',\n    'data-nested-dialog-open:after:opacity-100',\n  ],\n  {\n    variants: {\n      size: {\n        xs: ['max-w-xs'],\n        sm: ['max-w-sm'],\n        md: ['max-w-md'],\n        lg: ['max-w-lg'],\n        xl: ['max-w-xl'],\n        '2xl': ['max-w-2xl'],\n        '3xl': ['max-w-3xl'],\n        '4xl': ['max-w-4xl'],\n        '5xl': ['max-w-5xl'],\n        '6xl': ['max-w-6xl'],\n        '7xl': ['max-w-7xl'],\n        full: ['max-w-none', 'h-full'],\n      },\n    },\n    defaultVariants: {\n      size: alertDialogDefaultVariants.size,\n    },\n  },\n);\n"],"mappings":";;;;;;;;;AASA,MAAa,2BAA2B,IACtC;CACE;CAEA;CAEA;CACA;CAEA;CACA;CAEA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CAGA;CACA;CAEA;CACA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,GACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,MAAM,CAAC,cAAc,QAAQ;CAC/B,EACF;CACA,iBAAiB,EACf,MAAM,2BAA2B,KACnC;AACF,CACF"}

package/dist/components/overlays/alert-dialog/alert-dialog-popup.d.ts

@@ -7,7 +7,8 @@ export type AlertDialogPopupState = AlertDialog.Popup.State;
  *
  * Ao abrir, o foco vai para o primeiro elemento focável: com só os botões no `Footer`, o primeiro
  * deles. Ponha a ação que não destrói ("Cancelar") antes da destrutiva, para um `Enter` dado sem
- * ler não confirmar.
+ * ler não confirmar. Com algo focável antes dos botões (um `Collapsible` no `Header`), passe um ref
+ * do botão em `initialFocus` para o foco abrir nele.
  */
 export declare const AlertDialogPopup: {
   (props: AlertDialogPopupProps): import("react").JSX.Element;

package/dist/components/overlays/alert-dialog/alert-dialog-popup.js

@@ -9,7 +9,8 @@ import { AlertDialog } from "@base-ui/react/alert-dialog";
 *
 * Ao abrir, o foco vai para o primeiro elemento focável: com só os botões no `Footer`, o primeiro
 * deles. Ponha a ação que não destrói ("Cancelar") antes da destrutiva, para um `Enter` dado sem
-* ler não confirmar.
+* ler não confirmar. Com algo focável antes dos botões (um `Collapsible` no `Header`), passe um ref
+* do botão em `initialFocus` para o foco abrir nele.
 */
 const AlertDialogPopup = (props) => {
 	const { className, ...rest } = props;

package/dist/components/overlays/alert-dialog/alert-dialog-popup.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog-popup.js","names":["BaseAlertDialog"],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-popup.tsx"],"sourcesContent":["import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog';\nimport { mergeStateClassNames } from '#utils';\nimport { alertDialogPopupVariants } from './alert-dialog-popup-variants';\nimport { useAlertDialogContext } from './use-alert-dialog-context';\n\nexport type AlertDialogPopupProps = BaseAlertDialog.Popup.Props;\n\nexport type AlertDialogPopupState = BaseAlertDialog.Popup.State;\n\n/**\n * Caixa do alert dialog, com `role=\"alertdialog\"`, na largura do `size` do `AlertDialog.Root`.\n *\n * Ao abrir, o foco vai para o primeiro elemento focável: com só os botões no `Footer`, o primeiro\n * deles. Ponha a ação que não destrói (\"Cancelar\") antes da destrutiva, para um `Enter` dado sem\n * ler não confirmar.\n */\nexport const AlertDialogPopup = (props: AlertDialogPopupProps) => {\n  const { className, ...rest } = props;\n\n  const { size } = useAlertDialogContext();\n\n  return (\n    <BaseAlertDialog.Popup\n      data-component=\"AlertDialog.Popup\"\n      className={mergeStateClassNames(\n        alertDialogPopupVariants({ size }),\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nAlertDialogPopup.displayName = 'AlertDialog.Popup';\n"],"mappings":";;;;;;;;;;;;;AAgBA,MAAa,oBAAoB,UAAiC;CAChE,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,MAAM,EAAE,SAAS,sBAAsB;CAEvC,OACE,oBAACA,YAAgB,OAAjB;EACE,kBAAe;EACf,WAAW,qBACT,yBAAyB,EAAE,KAAK,CAAC,GACjC,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,iBAAiB,cAAc"}
+{"version":3,"file":"alert-dialog-popup.js","names":["BaseAlertDialog"],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-popup.tsx"],"sourcesContent":["import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog';\nimport { mergeStateClassNames } from '#utils';\nimport { alertDialogPopupVariants } from './alert-dialog-popup-variants';\nimport { useAlertDialogContext } from './use-alert-dialog-context';\n\nexport type AlertDialogPopupProps = BaseAlertDialog.Popup.Props;\n\nexport type AlertDialogPopupState = BaseAlertDialog.Popup.State;\n\n/**\n * Caixa do alert dialog, com `role=\"alertdialog\"`, na largura do `size` do `AlertDialog.Root`.\n *\n * Ao abrir, o foco vai para o primeiro elemento focável: com só os botões no `Footer`, o primeiro\n * deles. Ponha a ação que não destrói (\"Cancelar\") antes da destrutiva, para um `Enter` dado sem\n * ler não confirmar. Com algo focável antes dos botões (um `Collapsible` no `Header`), passe um ref\n * do botão em `initialFocus` para o foco abrir nele.\n */\nexport const AlertDialogPopup = (props: AlertDialogPopupProps) => {\n  const { className, ...rest } = props;\n\n  const { size } = useAlertDialogContext();\n\n  return (\n    <BaseAlertDialog.Popup\n      data-component=\"AlertDialog.Popup\"\n      className={mergeStateClassNames(\n        alertDialogPopupVariants({ size }),\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nAlertDialogPopup.displayName = 'AlertDialog.Popup';\n"],"mappings":";;;;;;;;;;;;;;AAiBA,MAAa,oBAAoB,UAAiC;CAChE,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,MAAM,EAAE,SAAS,sBAAsB;CAEvC,OACE,oBAACA,YAAgB,OAAjB;EACE,kBAAe;EACf,WAAW,qBACT,yBAAyB,EAAE,KAAK,CAAC,GACjC,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,iBAAiB,cAAc"}

package/dist/components/overlays/alert-dialog/alert-dialog-root.d.ts

@@ -1,5 +1,5 @@
 import { AlertDialogVariants } from "./use-alert-dialog-context.js";
-import { MergeOverride } from "@lucasbernardosn/utils";
+import { MergeOverride } from "@lucasbernardosn/ts-utils";
 import { AlertDialog } from "@base-ui/react/alert-dialog";
 //#region src/components/overlays/alert-dialog/alert-dialog-root.d.ts
 export type AlertDialogRootProps<Payload = unknown> = MergeOverride<AlertDialog.Root.Props<Payload>, AlertDialogVariants>;

package/dist/components/overlays/alert-dialog/alert-dialog-root.js

@@ -1,5 +1,5 @@
 import { AlertDialogContextProvider } from "./use-alert-dialog-context.js";
-import { createSplitProps } from "@lucasbernardosn/utils";
+import { createSplitProps } from "@lucasbernardosn/ts-utils";
 import { jsx } from "react/jsx-runtime";
 import { AlertDialog } from "@base-ui/react/alert-dialog";
 //#region src/components/overlays/alert-dialog/alert-dialog-root.tsx

package/dist/components/overlays/alert-dialog/alert-dialog-root.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog-root.js","names":["BaseAlertDialog"],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-root.tsx"],"sourcesContent":["import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog';\nimport {\n  type AnyType,\n  createSplitProps,\n  type MergeOverride,\n} from '@lucasbernardosn/utils';\nimport {\n  AlertDialogContextProvider,\n  type AlertDialogVariants,\n} from './use-alert-dialog-context';\n\nexport type AlertDialogRootProps<Payload = unknown> = MergeOverride<\n  BaseAlertDialog.Root.Props<Payload>,\n  AlertDialogVariants\n>;\n\nexport type AlertDialogRootState = BaseAlertDialog.Root.State;\n\nexport type AlertDialogRootActions = BaseAlertDialog.Root.Actions;\n\nexport type AlertDialogRootChangeEventDetails =\n  BaseAlertDialog.Root.ChangeEventDetails;\n\nexport type AlertDialogRootChangeEventReason =\n  BaseAlertDialog.Root.ChangeEventReason;\n\nconst splitVariantProps = createSplitProps<AlertDialogVariants>();\n\n/**\n * Estado do alert dialog. Não renderiza elemento.\n *\n * Pede uma resposta antes de seguir: é sempre modal, e o clique fora não fecha. Fecha pelo\n * `Close` e pelo `Esc`. Para um formulário ou um conteúdo que se pode dispensar, use o `Dialog`.\n *\n * @example\n * ```tsx\n * <AlertDialog.Root>\n *   <AlertDialog.Trigger render={<Button />}>Excluir pedido</AlertDialog.Trigger>\n *   <AlertDialog.Portal>\n *     <AlertDialog.Backdrop />\n *     <AlertDialog.Viewport>\n *       <AlertDialog.Popup>\n *         <AlertDialog.Header>\n *           <AlertDialog.Title>Excluir o pedido 4821?</AlertDialog.Title>\n *           <AlertDialog.Description>Os itens voltam para o estoque.</AlertDialog.Description>\n *         </AlertDialog.Header>\n *         <AlertDialog.Footer>\n *           <AlertDialog.Close render={<Button variant=\"outline\" />}>Cancelar</AlertDialog.Close>\n *           <Button colorScheme=\"red\">Excluir</Button>\n *         </AlertDialog.Footer>\n *       </AlertDialog.Popup>\n *     </AlertDialog.Viewport>\n *   </AlertDialog.Portal>\n * </AlertDialog.Root>\n * ```\n */\nexport const AlertDialogRoot = <Payload extends AnyType = unknown>(\n  props: AlertDialogRootProps<Payload>,\n) => {\n  const [variantProps, elementProps] = splitVariantProps(props, ['size']);\n\n  return (\n    <AlertDialogContextProvider value={variantProps}>\n      <BaseAlertDialog.Root {...elementProps} />\n    </AlertDialogContextProvider>\n  );\n};\n\nAlertDialogRoot.displayName = 'AlertDialog.Root';\n"],"mappings":";;;;;AA0BA,MAAM,oBAAoB,iBAAsC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BhE,MAAa,mBACX,UACG;CACH,MAAM,CAAC,cAAc,gBAAgB,kBAAkB,OAAO,CAAC,MAAM,CAAC;CAEtE,OACE,oBAAC,4BAAD;EAA4B,OAAO;EACjC,UAAA,oBAACA,YAAgB,MAAjB,EAAsB,GAAI,aAAe,CAAA;CACf,CAAA;AAEhC;AAEA,gBAAgB,cAAc"}
+{"version":3,"file":"alert-dialog-root.js","names":["BaseAlertDialog"],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-root.tsx"],"sourcesContent":["import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog';\nimport {\n  type AnyType,\n  createSplitProps,\n  type MergeOverride,\n} from '@lucasbernardosn/ts-utils';\nimport {\n  AlertDialogContextProvider,\n  type AlertDialogVariants,\n} from './use-alert-dialog-context';\n\nexport type AlertDialogRootProps<Payload = unknown> = MergeOverride<\n  BaseAlertDialog.Root.Props<Payload>,\n  AlertDialogVariants\n>;\n\nexport type AlertDialogRootState = BaseAlertDialog.Root.State;\n\nexport type AlertDialogRootActions = BaseAlertDialog.Root.Actions;\n\nexport type AlertDialogRootChangeEventDetails =\n  BaseAlertDialog.Root.ChangeEventDetails;\n\nexport type AlertDialogRootChangeEventReason =\n  BaseAlertDialog.Root.ChangeEventReason;\n\nconst splitVariantProps = createSplitProps<AlertDialogVariants>();\n\n/**\n * Estado do alert dialog. Não renderiza elemento.\n *\n * Pede uma resposta antes de seguir: é sempre modal, e o clique fora não fecha. Fecha pelo\n * `Close` e pelo `Esc`. Para um formulário ou um conteúdo que se pode dispensar, use o `Dialog`.\n *\n * @example\n * ```tsx\n * <AlertDialog.Root>\n *   <AlertDialog.Trigger render={<Button />}>Excluir pedido</AlertDialog.Trigger>\n *   <AlertDialog.Portal>\n *     <AlertDialog.Backdrop />\n *     <AlertDialog.Viewport>\n *       <AlertDialog.Popup>\n *         <AlertDialog.Header>\n *           <AlertDialog.Title>Excluir o pedido 4821?</AlertDialog.Title>\n *           <AlertDialog.Description>Os itens voltam para o estoque.</AlertDialog.Description>\n *         </AlertDialog.Header>\n *         <AlertDialog.Footer>\n *           <AlertDialog.Close render={<Button variant=\"outline\" />}>Cancelar</AlertDialog.Close>\n *           <Button colorScheme=\"red\">Excluir</Button>\n *         </AlertDialog.Footer>\n *       </AlertDialog.Popup>\n *     </AlertDialog.Viewport>\n *   </AlertDialog.Portal>\n * </AlertDialog.Root>\n * ```\n */\nexport const AlertDialogRoot = <Payload extends AnyType = unknown>(\n  props: AlertDialogRootProps<Payload>,\n) => {\n  const [variantProps, elementProps] = splitVariantProps(props, ['size']);\n\n  return (\n    <AlertDialogContextProvider value={variantProps}>\n      <BaseAlertDialog.Root {...elementProps} />\n    </AlertDialogContextProvider>\n  );\n};\n\nAlertDialogRoot.displayName = 'AlertDialog.Root';\n"],"mappings":";;;;;AA0BA,MAAM,oBAAoB,iBAAsC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BhE,MAAa,mBACX,UACG;CACH,MAAM,CAAC,cAAc,gBAAgB,kBAAkB,OAAO,CAAC,MAAM,CAAC;CAEtE,OACE,oBAAC,4BAAD;EAA4B,OAAO;EACjC,UAAA,oBAACA,YAAgB,MAAjB,EAAsB,GAAI,aAAe,CAAA;CACf,CAAA;AAEhC;AAEA,gBAAgB,cAAc"}

package/dist/components/overlays/alert-dialog/alert-dialog-store.d.ts

@@ -0,0 +1,36 @@
+import React from "react";
+//#region src/components/overlays/alert-dialog/alert-dialog-store.d.ts
+/**
+ * Em que ponto da vida está um alerta: `open` (na tela, inclusive durante o `onConfirm`),
+ * `closing` (a transição de saída roda) e `exited` (saiu da tela, mas a entrada fica por ter
+ * alertas aninhados).
+ */
+type AlertDialogEntryStatus = 'open' | 'closing' | 'exited';
+/** Um alerta aberto por `AlertDialog.alert` ou `AlertDialog.confirm`, à espera do `Outlet`. */
+export type AlertDialogEntry = {
+  readonly id: number;
+  /** O `id` do alerta em que este está aninhado, ou `null` se está na raiz. Fixo desde a abertura. */
+  readonly parentId: number | null;
+  readonly status: AlertDialogEntryStatus;
+  /**
+   * Monta o alerta com os aninhados dentro dele (`nested`) e diz se o pai ainda está aberto
+   * (`isParentOpen`, sempre `true` na raiz). As opções e a resolução da promise ficam presas na
+   * função, e o store não precisa conhecer o tipo delas.
+   */
+  readonly render: (nested: React.ReactNode, isParentOpen: boolean) => React.ReactNode;
+  /** Resolve a promise como dispensada. Não faz nada se ela já resolveu. */
+  readonly dismiss: () => void;
+};
+/** O que `open` informa ao store; o `parentId` e o `status` são decididos por ele. */
+type AlertDialogEntryInput = Pick<AlertDialogEntry, 'id' | 'render' | 'dismiss'>;
+export declare const alertDialogStore: {
+  subscribe: (listener: () => void) => () => void;
+  getSnapshot: () => readonly AlertDialogEntry[];
+  createId: () => number;
+  add: (input: AlertDialogEntryInput) => void;
+  markClosing: (id: number) => void;
+  remove: (id: number) => void;
+  registerOutlet: () => () => void;
+};
+//#endregion
+//# sourceMappingURL=alert-dialog-store.d.ts.map

package/dist/components/overlays/alert-dialog/alert-dialog-store.js

@@ -0,0 +1,118 @@
+//#region src/components/overlays/alert-dialog/alert-dialog-store.ts
+/**
+* Os alertas abertos, renderizados pelo `AlertDialog.Outlet`. O store é dono do aninhamento.
+*
+* O Base UI só escreve o efeito de pilha (`data-nested-dialog-open`, `--nested-dialogs`) num
+* dialog cujo `Root` está abaixo do `Root` de outro na árvore do React. Por isso cada entrada fixa
+* o `parentId` ao abrir: o último alerta ainda `open`, ou `null` se não houver. O pai não muda
+* depois, porque mudar de lugar na árvore remontaria o alerta (perde o estado e reanima a
+* entrada). Um alerta aberto com o de trás já `closing` vai para a raiz, e não fica preso a um
+* pai que está saindo.
+*
+* O pai pode sair antes do filho (um `alert` aberto dentro do `onConfirm`, antes de ele
+* resolver). A entrada dele passa a `exited` e fica como lugar do filho na árvore, sem nada
+* visível, até o último filho sair; aí é removida, em cascata pelos ancestrais na mesma situação.
+*
+* Cada mudança troca o array, para o `useSyncExternalStore` renderizar de novo.
+*/
+const createAlertDialogStore = () => {
+	let entries = [];
+	let outletCount = 0;
+	let nextId = 0;
+	const listeners = /* @__PURE__ */ new Set();
+	const emit = () => {
+		for (const listener of listeners) listener();
+	};
+	const subscribe = (listener) => {
+		listeners.add(listener);
+		return () => {
+			listeners.delete(listener);
+		};
+	};
+	const getSnapshot = () => entries;
+	const createId = () => {
+		nextId += 1;
+		return nextId;
+	};
+	const add = (input) => {
+		const parent = entries.findLast((candidate) => candidate.status === "open");
+		const entry = {
+			...input,
+			parentId: parent?.id ?? null,
+			status: "open"
+		};
+		entries = [...entries, entry];
+		emit();
+		/**
+		* Abrir um alerta e montar o `Outlet` podem cair no mesmo commit, e o `Outlet` só se registra
+		* no efeito. Conferir depois de um microtask evita avisar num app montado certo. O aviso vale
+		* em produção também: ele só aparece com o app montado errado.
+		*/
+		queueMicrotask(() => {
+			if (outletCount === 0 && entries.some((candidate) => candidate.id === entry.id)) console.error("AlertDialog: um alerta foi aberto sem nenhum <AlertDialog.Outlet /> montado, e ele não vai aparecer. Monte um <AlertDialog.Outlet /> perto da raiz do app.");
+		});
+	};
+	/** Marca que o alerta começou a fechar: ele deixa de ser candidato a pai de um alerta novo. */
+	const markClosing = (id) => {
+		if (entries.find((candidate) => candidate.id === id)?.status !== "open") return;
+		entries = entries.map((candidate) => candidate.id === id ? {
+			...candidate,
+			status: "closing"
+		} : candidate);
+		emit();
+	};
+	/**
+	* Chamado quando o alerta terminou de sair. Se ainda tem alertas aninhados, a entrada fica como
+	* `exited`; se não, é removida junto com os ancestrais `exited` que ficaram sem filhos.
+	*/
+	const remove = (id) => {
+		if (!entries.some((entry) => entry.id === id)) return;
+		let remaining = entries.map((entry) => entry.id === id ? {
+			...entry,
+			status: "exited"
+		} : entry);
+		let hasPrunable = true;
+		while (hasPrunable) {
+			const parentIds = new Set(remaining.map((entry) => entry.parentId));
+			const pruned = remaining.filter((entry) => entry.status !== "exited" || parentIds.has(entry.id));
+			hasPrunable = pruned.length !== remaining.length;
+			remaining = pruned;
+		}
+		entries = remaining;
+		emit();
+	};
+	/**
+	* Registra um `Outlet` montado e devolve o cleanup. Quando o último sai, os alertas pendentes
+	* resolvem como dispensados: sem isso, a promise de quem abriu nunca resolveria. A conferência
+	* espera um microtask porque o StrictMode desmonta e remonta o efeito no mesmo commit, e
+	* dispensar na hora fecharia todo alerta assim que abrisse.
+	*/
+	const registerOutlet = () => {
+		outletCount += 1;
+		if (outletCount > 1) console.error("AlertDialog: mais de um <AlertDialog.Outlet /> está montado, e cada alerta vai aparecer em todos. Monte um só, perto da raiz do app.");
+		return () => {
+			outletCount -= 1;
+			queueMicrotask(() => {
+				if (outletCount > 0 || entries.length === 0) return;
+				const dismissed = entries;
+				entries = [];
+				emit();
+				for (const entry of dismissed) entry.dismiss();
+			});
+		};
+	};
+	return {
+		subscribe,
+		getSnapshot,
+		createId,
+		add,
+		markClosing,
+		remove,
+		registerOutlet
+	};
+};
+const alertDialogStore = createAlertDialogStore();
+//#endregion
+export { alertDialogStore };
+
+//# sourceMappingURL=alert-dialog-store.js.map

package/dist/components/overlays/alert-dialog/alert-dialog-store.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-dialog-store.js","names":[],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-store.ts"],"sourcesContent":["import type React from 'react';\n\n/**\n * Em que ponto da vida está um alerta: `open` (na tela, inclusive durante o `onConfirm`),\n * `closing` (a transição de saída roda) e `exited` (saiu da tela, mas a entrada fica por ter\n * alertas aninhados).\n */\ntype AlertDialogEntryStatus = 'open' | 'closing' | 'exited';\n\n/** Um alerta aberto por `AlertDialog.alert` ou `AlertDialog.confirm`, à espera do `Outlet`. */\nexport type AlertDialogEntry = {\n  readonly id: number;\n  /** O `id` do alerta em que este está aninhado, ou `null` se está na raiz. Fixo desde a abertura. */\n  readonly parentId: number | null;\n  readonly status: AlertDialogEntryStatus;\n  /**\n   * Monta o alerta com os aninhados dentro dele (`nested`) e diz se o pai ainda está aberto\n   * (`isParentOpen`, sempre `true` na raiz). As opções e a resolução da promise ficam presas na\n   * função, e o store não precisa conhecer o tipo delas.\n   */\n  readonly render: (\n    nested: React.ReactNode,\n    isParentOpen: boolean,\n  ) => React.ReactNode;\n  /** Resolve a promise como dispensada. Não faz nada se ela já resolveu. */\n  readonly dismiss: () => void;\n};\n\n/** O que `open` informa ao store; o `parentId` e o `status` são decididos por ele. */\ntype AlertDialogEntryInput = Pick<\n  AlertDialogEntry,\n  'id' | 'render' | 'dismiss'\n>;\n\n/**\n * Os alertas abertos, renderizados pelo `AlertDialog.Outlet`. O store é dono do aninhamento.\n *\n * O Base UI só escreve o efeito de pilha (`data-nested-dialog-open`, `--nested-dialogs`) num\n * dialog cujo `Root` está abaixo do `Root` de outro na árvore do React. Por isso cada entrada fixa\n * o `parentId` ao abrir: o último alerta ainda `open`, ou `null` se não houver. O pai não muda\n * depois, porque mudar de lugar na árvore remontaria o alerta (perde o estado e reanima a\n * entrada). Um alerta aberto com o de trás já `closing` vai para a raiz, e não fica preso a um\n * pai que está saindo.\n *\n * O pai pode sair antes do filho (um `alert` aberto dentro do `onConfirm`, antes de ele\n * resolver). A entrada dele passa a `exited` e fica como lugar do filho na árvore, sem nada\n * visível, até o último filho sair; aí é removida, em cascata pelos ancestrais na mesma situação.\n *\n * Cada mudança troca o array, para o `useSyncExternalStore` renderizar de novo.\n */\nconst createAlertDialogStore = () => {\n  let entries: readonly AlertDialogEntry[] = [];\n  let outletCount = 0;\n  let nextId = 0;\n\n  const listeners = new Set<() => void>();\n\n  const emit = () => {\n    for (const listener of listeners) {\n      listener();\n    }\n  };\n\n  const subscribe = (listener: () => void) => {\n    listeners.add(listener);\n\n    return () => {\n      listeners.delete(listener);\n    };\n  };\n\n  const getSnapshot = () => entries;\n\n  const createId = () => {\n    nextId += 1;\n\n    return nextId;\n  };\n\n  const add = (input: AlertDialogEntryInput) => {\n    const parent = entries.findLast((candidate) => candidate.status === 'open');\n\n    const entry: AlertDialogEntry = {\n      ...input,\n      parentId: parent?.id ?? null,\n      status: 'open',\n    };\n\n    entries = [...entries, entry];\n    emit();\n\n    /**\n     * Abrir um alerta e montar o `Outlet` podem cair no mesmo commit, e o `Outlet` só se registra\n     * no efeito. Conferir depois de um microtask evita avisar num app montado certo. O aviso vale\n     * em produção também: ele só aparece com o app montado errado.\n     */\n    queueMicrotask(() => {\n      if (\n        outletCount === 0 &&\n        entries.some((candidate) => candidate.id === entry.id)\n      ) {\n        console.error(\n          'AlertDialog: um alerta foi aberto sem nenhum <AlertDialog.Outlet /> montado, e ele não ' +\n            'vai aparecer. Monte um <AlertDialog.Outlet /> perto da raiz do app.',\n        );\n      }\n    });\n  };\n\n  /** Marca que o alerta começou a fechar: ele deixa de ser candidato a pai de um alerta novo. */\n  const markClosing = (id: number) => {\n    const entry = entries.find((candidate) => candidate.id === id);\n\n    if (entry?.status !== 'open') {\n      return;\n    }\n\n    entries = entries.map(\n      (candidate): AlertDialogEntry =>\n        candidate.id === id ? { ...candidate, status: 'closing' } : candidate,\n    );\n    emit();\n  };\n\n  /**\n   * Chamado quando o alerta terminou de sair. Se ainda tem alertas aninhados, a entrada fica como\n   * `exited`; se não, é removida junto com os ancestrais `exited` que ficaram sem filhos.\n   */\n  const remove = (id: number) => {\n    if (!entries.some((entry) => entry.id === id)) {\n      return;\n    }\n\n    let remaining = entries.map(\n      (entry): AlertDialogEntry =>\n        entry.id === id ? { ...entry, status: 'exited' } : entry,\n    );\n\n    let hasPrunable = true;\n\n    while (hasPrunable) {\n      const parentIds = new Set(remaining.map((entry) => entry.parentId));\n\n      const pruned = remaining.filter(\n        (entry) => entry.status !== 'exited' || parentIds.has(entry.id),\n      );\n\n      hasPrunable = pruned.length !== remaining.length;\n      remaining = pruned;\n    }\n\n    entries = remaining;\n    emit();\n  };\n\n  /**\n   * Registra um `Outlet` montado e devolve o cleanup. Quando o último sai, os alertas pendentes\n   * resolvem como dispensados: sem isso, a promise de quem abriu nunca resolveria. A conferência\n   * espera um microtask porque o StrictMode desmonta e remonta o efeito no mesmo commit, e\n   * dispensar na hora fecharia todo alerta assim que abrisse.\n   */\n  const registerOutlet = () => {\n    outletCount += 1;\n\n    if (outletCount > 1) {\n      console.error(\n        'AlertDialog: mais de um <AlertDialog.Outlet /> está montado, e cada alerta vai aparecer ' +\n          'em todos. Monte um só, perto da raiz do app.',\n      );\n    }\n\n    return () => {\n      outletCount -= 1;\n\n      queueMicrotask(() => {\n        if (outletCount > 0 || entries.length === 0) {\n          return;\n        }\n\n        const dismissed = entries;\n\n        entries = [];\n        emit();\n\n        for (const entry of dismissed) {\n          entry.dismiss();\n        }\n      });\n    };\n  };\n\n  return {\n    subscribe,\n    getSnapshot,\n    createId,\n    add,\n    markClosing,\n    remove,\n    registerOutlet,\n  };\n};\n\nexport const alertDialogStore = createAlertDialogStore();\n"],"mappings":";;;;;;;;;;;;;;;;;AAkDA,MAAM,+BAA+B;CACnC,IAAI,UAAuC,CAAC;CAC5C,IAAI,cAAc;CAClB,IAAI,SAAS;CAEb,MAAM,4BAAY,IAAI,IAAgB;CAEtC,MAAM,aAAa;EACjB,KAAK,MAAM,YAAY,WACrB,SAAS;CAEb;CAEA,MAAM,aAAa,aAAyB;EAC1C,UAAU,IAAI,QAAQ;EAEtB,aAAa;GACX,UAAU,OAAO,QAAQ;EAC3B;CACF;CAEA,MAAM,oBAAoB;CAE1B,MAAM,iBAAiB;EACrB,UAAU;EAEV,OAAO;CACT;CAEA,MAAM,OAAO,UAAiC;EAC5C,MAAM,SAAS,QAAQ,UAAU,cAAc,UAAU,WAAW,MAAM;EAE1E,MAAM,QAA0B;GAC9B,GAAG;GACH,UAAU,QAAQ,MAAM;GACxB,QAAQ;EACV;EAEA,UAAU,CAAC,GAAG,SAAS,KAAK;EAC5B,KAAK;;;;;;EAOL,qBAAqB;GACnB,IACE,gBAAgB,KAChB,QAAQ,MAAM,cAAc,UAAU,OAAO,MAAM,EAAE,GAErD,QAAQ,MACN,4JAEF;EAEJ,CAAC;CACH;;CAGA,MAAM,eAAe,OAAe;EAGlC,IAFc,QAAQ,MAAM,cAAc,UAAU,OAAO,EAEnD,CAAC,EAAE,WAAW,QACpB;EAGF,UAAU,QAAQ,KACf,cACC,UAAU,OAAO,KAAK;GAAE,GAAG;GAAW,QAAQ;EAAU,IAAI,SAChE;EACA,KAAK;CACP;;;;;CAMA,MAAM,UAAU,OAAe;EAC7B,IAAI,CAAC,QAAQ,MAAM,UAAU,MAAM,OAAO,EAAE,GAC1C;EAGF,IAAI,YAAY,QAAQ,KACrB,UACC,MAAM,OAAO,KAAK;GAAE,GAAG;GAAO,QAAQ;EAAS,IAAI,KACvD;EAEA,IAAI,cAAc;EAElB,OAAO,aAAa;GAClB,MAAM,YAAY,IAAI,IAAI,UAAU,KAAK,UAAU,MAAM,QAAQ,CAAC;GAElE,MAAM,SAAS,UAAU,QACtB,UAAU,MAAM,WAAW,YAAY,UAAU,IAAI,MAAM,EAAE,CAChE;GAEA,cAAc,OAAO,WAAW,UAAU;GAC1C,YAAY;EACd;EAEA,UAAU;EACV,KAAK;CACP;;;;;;;CAQA,MAAM,uBAAuB;EAC3B,eAAe;EAEf,IAAI,cAAc,GAChB,QAAQ,MACN,sIAEF;EAGF,aAAa;GACX,eAAe;GAEf,qBAAqB;IACnB,IAAI,cAAc,KAAK,QAAQ,WAAW,GACxC;IAGF,MAAM,YAAY;IAElB,UAAU,CAAC;IACX,KAAK;IAEL,KAAK,MAAM,SAAS,WAClB,MAAM,QAAQ;GAElB,CAAC;EACH;CACF;CAEA,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;CACF;AACF;AAEA,MAAa,mBAAmB,uBAAuB"}

package/dist/components/overlays/alert-dialog/alert-dialog-title.d.ts

@@ -6,8 +6,9 @@ export type AlertDialogTitleState = AlertDialog.Title.State;
  * Título do alert dialog, um `h2` ligado ao popup por `aria-labelledby`. Diga a pergunta ou a
  * consequência ("Excluir o pedido 4821?"), não só a ação.
  *
- * Cópia de `DialogTitle`, sem diferenças (tabela no README de `overlays`); o mecanismo está
- * explicado lá.
+ * Cópia de `DialogTitle` (tabela no README de `overlays`; o mecanismo está explicado lá), com
+ * `font-semibold` no lugar de `font-medium`. Segue o modelo de superfície da pendência
+ * "Superfícies" do ROADMAP, ainda não aplicado ao Dialog.
  */
 export declare const AlertDialogTitle: {
   (props: AlertDialogTitleProps): import("react").JSX.Element;

package/dist/components/overlays/alert-dialog/alert-dialog-title.js

@@ -6,8 +6,9 @@ import { AlertDialog } from "@base-ui/react/alert-dialog";
 * Título do alert dialog, um `h2` ligado ao popup por `aria-labelledby`. Diga a pergunta ou a
 * consequência ("Excluir o pedido 4821?"), não só a ação.
 *
-* Cópia de `DialogTitle`, sem diferenças (tabela no README de `overlays`); o mecanismo está
-* explicado lá.
+* Cópia de `DialogTitle` (tabela no README de `overlays`; o mecanismo está explicado lá), com
+* `font-semibold` no lugar de `font-medium`. Segue o modelo de superfície da pendência
+* "Superfícies" do ROADMAP, ainda não aplicado ao Dialog.
 */
 const AlertDialogTitle = (props) => {
 	const { className, ...rest } = props;
@@ -16,7 +17,7 @@ const AlertDialogTitle = (props) => {
 		className: mergeStateClassNames([
 			"text-base",
 			"leading-6",
-			"font-medium",
+			"font-semibold",
 			"text-gray-12",
 			"text-balance"
 		], className),

package/dist/components/overlays/alert-dialog/alert-dialog-title.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog-title.js","names":["BaseAlertDialog"],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-title.tsx"],"sourcesContent":["import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog';\nimport { mergeStateClassNames } from '#utils';\n\nexport type AlertDialogTitleProps = BaseAlertDialog.Title.Props;\n\nexport type AlertDialogTitleState = BaseAlertDialog.Title.State;\n\n/**\n * Título do alert dialog, um `h2` ligado ao popup por `aria-labelledby`. Diga a pergunta ou a\n * consequência (\"Excluir o pedido 4821?\"), não só a ação.\n *\n * Cópia de `DialogTitle`, sem diferenças (tabela no README de `overlays`); o mecanismo está\n * explicado lá.\n */\nexport const AlertDialogTitle = (props: AlertDialogTitleProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseAlertDialog.Title\n      data-component=\"AlertDialog.Title\"\n      className={mergeStateClassNames(\n        [\n          'text-base',\n          'leading-6',\n          'font-medium',\n          'text-gray-12',\n          'text-balance',\n        ],\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nAlertDialogTitle.displayName = 'AlertDialog.Title';\n"],"mappings":";;;;;;;;;;;AAcA,MAAa,oBAAoB,UAAiC;CAChE,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,YAAgB,OAAjB;EACE,kBAAe;EACf,WAAW,qBACT;GACE;GACA;GACA;GACA;GACA;EACF,GACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,iBAAiB,cAAc"}
+{"version":3,"file":"alert-dialog-title.js","names":["BaseAlertDialog"],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-title.tsx"],"sourcesContent":["import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog';\nimport { mergeStateClassNames } from '#utils';\n\nexport type AlertDialogTitleProps = BaseAlertDialog.Title.Props;\n\nexport type AlertDialogTitleState = BaseAlertDialog.Title.State;\n\n/**\n * Título do alert dialog, um `h2` ligado ao popup por `aria-labelledby`. Diga a pergunta ou a\n * consequência (\"Excluir o pedido 4821?\"), não só a ação.\n *\n * Cópia de `DialogTitle` (tabela no README de `overlays`; o mecanismo está explicado lá), com\n * `font-semibold` no lugar de `font-medium`. Segue o modelo de superfície da pendência\n * \"Superfícies\" do ROADMAP, ainda não aplicado ao Dialog.\n */\nexport const AlertDialogTitle = (props: AlertDialogTitleProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseAlertDialog.Title\n      data-component=\"AlertDialog.Title\"\n      className={mergeStateClassNames(\n        [\n          'text-base',\n          'leading-6',\n          'font-semibold',\n          'text-gray-12',\n          'text-balance',\n        ],\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nAlertDialogTitle.displayName = 'AlertDialog.Title';\n"],"mappings":";;;;;;;;;;;;AAeA,MAAa,oBAAoB,UAAiC;CAChE,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,YAAgB,OAAjB;EACE,kBAAe;EACf,WAAW,qBACT;GACE;GACA;GACA;GACA;GACA;EACF,GACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,iBAAiB,cAAc"}

package/dist/components/overlays/alert-dialog/alert-dialog-trigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog-trigger.js","names":["BaseAlertDialog"],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-trigger.tsx"],"sourcesContent":["import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog';\nimport type { AnyType } from '@lucasbernardosn/utils';\nimport { mergeStateClassNames } from '#utils';\n\nexport type AlertDialogTriggerProps<Payload = unknown> =\n  BaseAlertDialog.Trigger.Props<Payload>;\n\nexport type AlertDialogTriggerState = BaseAlertDialog.Trigger.State;\n\n/**\n * Elemento que abre o alert dialog. Sem estilo próprio; passe um botão da lib em `render`.\n */\nexport const AlertDialogTrigger = <Payload extends AnyType = unknown>(\n  props: AlertDialogTriggerProps<Payload>,\n) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseAlertDialog.Trigger\n      data-component=\"AlertDialog.Trigger\"\n      className={mergeStateClassNames([], className)}\n      {...rest}\n    />\n  );\n};\n\nAlertDialogTrigger.displayName = 'AlertDialog.Trigger';\n"],"mappings":";;;;;;;AAYA,MAAa,sBACX,UACG;CACH,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,YAAgB,SAAjB;EACE,kBAAe;EACf,WAAW,qBAAqB,CAAC,GAAG,SAAS;EAC7C,GAAI;CACL,CAAA;AAEL;AAEA,mBAAmB,cAAc"}
+{"version":3,"file":"alert-dialog-trigger.js","names":["BaseAlertDialog"],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-trigger.tsx"],"sourcesContent":["import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog';\nimport type { AnyType } from '@lucasbernardosn/ts-utils';\nimport { mergeStateClassNames } from '#utils';\n\nexport type AlertDialogTriggerProps<Payload = unknown> =\n  BaseAlertDialog.Trigger.Props<Payload>;\n\nexport type AlertDialogTriggerState = BaseAlertDialog.Trigger.State;\n\n/**\n * Elemento que abre o alert dialog. Sem estilo próprio; passe um botão da lib em `render`.\n */\nexport const AlertDialogTrigger = <Payload extends AnyType = unknown>(\n  props: AlertDialogTriggerProps<Payload>,\n) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseAlertDialog.Trigger\n      data-component=\"AlertDialog.Trigger\"\n      className={mergeStateClassNames([], className)}\n      {...rest}\n    />\n  );\n};\n\nAlertDialogTrigger.displayName = 'AlertDialog.Trigger';\n"],"mappings":";;;;;;;AAYA,MAAa,sBACX,UACG;CACH,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,YAAgB,SAAjB;EACE,kBAAe;EACf,WAAW,qBAAqB,CAAC,GAAG,SAAS;EAC7C,GAAI;CACL,CAAA;AAEL;AAEA,mBAAmB,cAAc"}

package/dist/components/overlays/alert-dialog/index.parts.d.ts

@@ -4,17 +4,20 @@ import { AlertDialogClose, AlertDialogCloseProps, AlertDialogCloseState } from "
 import { AlertDialogDescription, AlertDialogDescriptionProps, AlertDialogDescriptionState } from "./alert-dialog-description.js";
 import { AlertDialogFooter, AlertDialogFooterProps } from "./alert-dialog-footer.js";
 import { AlertDialogHeader, AlertDialogHeaderProps } from "./alert-dialog-header.js";
+import { AlertDialogVariants } from "./use-alert-dialog-context.js";
+import { AlertDialogAlertOptions, AlertDialogConfirmOptions, alertDialogAlert, alertDialogConfirm } from "./alert-dialog-imperative.js";
+import { AlertDialogIndicator, AlertDialogIndicatorProps } from "./alert-dialog-indicator.js";
+import { AlertDialogOutlet } from "./alert-dialog-outlet.js";
 import { AlertDialogPopup, AlertDialogPopupProps, AlertDialogPopupState } from "./alert-dialog-popup.js";
 import { AlertDialogPortal, AlertDialogPortalProps, AlertDialogPortalState } from "./alert-dialog-portal.js";
-import { AlertDialogVariants } from "./use-alert-dialog-context.js";
 import { AlertDialogRoot, AlertDialogRootActions, AlertDialogRootChangeEventDetails, AlertDialogRootChangeEventReason, AlertDialogRootProps, AlertDialogRootState } from "./alert-dialog-root.js";
 import { AlertDialogTitle, AlertDialogTitleProps, AlertDialogTitleState } from "./alert-dialog-title.js";
 import { AlertDialogTrigger, AlertDialogTriggerProps, AlertDialogTriggerState } from "./alert-dialog-trigger.js";
 import { AlertDialogViewport, AlertDialogViewportProps, AlertDialogViewportState } from "./alert-dialog-viewport.js";
 import { AlertDialogHandle, createAlertDialogHandle } from "./create-handle.js";
 declare namespace index_parts_d_exports {
-  export { AlertDialogBackdrop as Backdrop, AlertDialogBackdropProps as BackdropProps, AlertDialogBackdropState as BackdropState, AlertDialogBody as Body, AlertDialogBodyProps as BodyProps, AlertDialogClose as Close, AlertDialogCloseProps as CloseProps, AlertDialogCloseState as CloseState, AlertDialogDescription as Description, AlertDialogDescriptionProps as DescriptionProps, AlertDialogDescriptionState as DescriptionState, AlertDialogFooter as Footer, AlertDialogFooterProps as FooterProps, AlertDialogHandle as Handle, AlertDialogHeader as Header, AlertDialogHeaderProps as HeaderProps, AlertDialogPopup as Popup, AlertDialogPopupProps as PopupProps, AlertDialogPopupState as PopupState, AlertDialogPortal as Portal, AlertDialogPortalProps as PortalProps, AlertDialogPortalState as PortalState, AlertDialogRoot as Root, AlertDialogRootActions as RootActions, AlertDialogRootChangeEventDetails as RootChangeEventDetails, AlertDialogRootChangeEventReason as RootChangeEventReason, AlertDialogRootProps as RootProps, AlertDialogRootState as RootState, AlertDialogTitle as Title, AlertDialogTitleProps as TitleProps, AlertDialogTitleState as TitleState, AlertDialogTrigger as Trigger, AlertDialogTriggerProps as TriggerProps, AlertDialogTriggerState as TriggerState, AlertDialogVariants as Variants, AlertDialogViewport as Viewport, AlertDialogViewportProps as ViewportProps, AlertDialogViewportState as ViewportState, createAlertDialogHandle as createHandle };
+  export { AlertDialogAlertOptions as AlertOptions, AlertDialogBackdrop as Backdrop, AlertDialogBackdropProps as BackdropProps, AlertDialogBackdropState as BackdropState, AlertDialogBody as Body, AlertDialogBodyProps as BodyProps, AlertDialogClose as Close, AlertDialogCloseProps as CloseProps, AlertDialogCloseState as CloseState, AlertDialogConfirmOptions as ConfirmOptions, AlertDialogDescription as Description, AlertDialogDescriptionProps as DescriptionProps, AlertDialogDescriptionState as DescriptionState, AlertDialogFooter as Footer, AlertDialogFooterProps as FooterProps, AlertDialogHandle as Handle, AlertDialogHeader as Header, AlertDialogHeaderProps as HeaderProps, AlertDialogIndicator as Indicator, AlertDialogIndicatorProps as IndicatorProps, AlertDialogOutlet as Outlet, AlertDialogPopup as Popup, AlertDialogPopupProps as PopupProps, AlertDialogPopupState as PopupState, AlertDialogPortal as Portal, AlertDialogPortalProps as PortalProps, AlertDialogPortalState as PortalState, AlertDialogRoot as Root, AlertDialogRootActions as RootActions, AlertDialogRootChangeEventDetails as RootChangeEventDetails, AlertDialogRootChangeEventReason as RootChangeEventReason, AlertDialogRootProps as RootProps, AlertDialogRootState as RootState, AlertDialogTitle as Title, AlertDialogTitleProps as TitleProps, AlertDialogTitleState as TitleState, AlertDialogTrigger as Trigger, AlertDialogTriggerProps as TriggerProps, AlertDialogTriggerState as TriggerState, AlertDialogVariants as Variants, AlertDialogViewport as Viewport, AlertDialogViewportProps as ViewportProps, AlertDialogViewportState as ViewportState, alertDialogAlert as alert, alertDialogConfirm as confirm, createAlertDialogHandle as createHandle };
 }
 //#endregion
-export { AlertDialogBackdrop as Backdrop, type AlertDialogBackdropProps as BackdropProps, type AlertDialogBackdropState as BackdropState, AlertDialogBody as Body, type AlertDialogBodyProps as BodyProps, AlertDialogClose as Close, type AlertDialogCloseProps as CloseProps, type AlertDialogCloseState as CloseState, AlertDialogDescription as Description, type AlertDialogDescriptionProps as DescriptionProps, type AlertDialogDescriptionState as DescriptionState, AlertDialogFooter as Footer, type AlertDialogFooterProps as FooterProps, type AlertDialogHandle as Handle, AlertDialogHeader as Header, type AlertDialogHeaderProps as HeaderProps, AlertDialogPopup as Popup, type AlertDialogPopupProps as PopupProps, type AlertDialogPopupState as PopupState, AlertDialogPortal as Portal, type AlertDialogPortalProps as PortalProps, type AlertDialogPortalState as PortalState, AlertDialogRoot as Root, type AlertDialogRootActions as RootActions, type AlertDialogRootChangeEventDetails as RootChangeEventDetails, type AlertDialogRootChangeEventReason as RootChangeEventReason, type AlertDialogRootProps as RootProps, type AlertDialogRootState as RootState, AlertDialogTitle as Title, type AlertDialogTitleProps as TitleProps, type AlertDialogTitleState as TitleState, AlertDialogTrigger as Trigger, type AlertDialogTriggerProps as TriggerProps, type AlertDialogTriggerState as TriggerState, type AlertDialogVariants as Variants, AlertDialogViewport as Viewport, type AlertDialogViewportProps as ViewportProps, type AlertDialogViewportState as ViewportState, createAlertDialogHandle as createHandle, index_parts_d_exports };
+export { type AlertDialogAlertOptions as AlertOptions, AlertDialogBackdrop as Backdrop, type AlertDialogBackdropProps as BackdropProps, type AlertDialogBackdropState as BackdropState, AlertDialogBody as Body, type AlertDialogBodyProps as BodyProps, AlertDialogClose as Close, type AlertDialogCloseProps as CloseProps, type AlertDialogCloseState as CloseState, type AlertDialogConfirmOptions as ConfirmOptions, AlertDialogDescription as Description, type AlertDialogDescriptionProps as DescriptionProps, type AlertDialogDescriptionState as DescriptionState, AlertDialogFooter as Footer, type AlertDialogFooterProps as FooterProps, type AlertDialogHandle as Handle, AlertDialogHeader as Header, type AlertDialogHeaderProps as HeaderProps, AlertDialogIndicator as Indicator, type AlertDialogIndicatorProps as IndicatorProps, AlertDialogOutlet as Outlet, AlertDialogPopup as Popup, type AlertDialogPopupProps as PopupProps, type AlertDialogPopupState as PopupState, AlertDialogPortal as Portal, type AlertDialogPortalProps as PortalProps, type AlertDialogPortalState as PortalState, AlertDialogRoot as Root, type AlertDialogRootActions as RootActions, type AlertDialogRootChangeEventDetails as RootChangeEventDetails, type AlertDialogRootChangeEventReason as RootChangeEventReason, type AlertDialogRootProps as RootProps, type AlertDialogRootState as RootState, AlertDialogTitle as Title, type AlertDialogTitleProps as TitleProps, type AlertDialogTitleState as TitleState, AlertDialogTrigger as Trigger, type AlertDialogTriggerProps as TriggerProps, type AlertDialogTriggerState as TriggerState, type AlertDialogVariants as Variants, AlertDialogViewport as Viewport, type AlertDialogViewportProps as ViewportProps, type AlertDialogViewportState as ViewportState, alertDialogAlert as alert, alertDialogConfirm as confirm, createAlertDialogHandle as createHandle, index_parts_d_exports };
 //# sourceMappingURL=index.parts.d.ts.map

package/dist/components/overlays/alert-dialog/index.parts.js

@@ -5,12 +5,15 @@ import { AlertDialogClose } from "./alert-dialog-close.js";
 import { AlertDialogDescription } from "./alert-dialog-description.js";
 import { AlertDialogFooter } from "./alert-dialog-footer.js";
 import { AlertDialogHeader } from "./alert-dialog-header.js";
+import { AlertDialogIndicator } from "./alert-dialog-indicator.js";
 import { AlertDialogPopup } from "./alert-dialog-popup.js";
 import { AlertDialogPortal } from "./alert-dialog-portal.js";
 import { AlertDialogRoot } from "./alert-dialog-root.js";
 import { AlertDialogTitle } from "./alert-dialog-title.js";
-import { AlertDialogTrigger } from "./alert-dialog-trigger.js";
 import { AlertDialogViewport } from "./alert-dialog-viewport.js";
+import { alertDialogAlert, alertDialogConfirm } from "./alert-dialog-imperative.js";
+import { AlertDialogOutlet } from "./alert-dialog-outlet.js";
+import { AlertDialogTrigger } from "./alert-dialog-trigger.js";
 import { createAlertDialogHandle } from "./create-handle.js";
 //#region src/components/overlays/alert-dialog/index.parts.ts
 var index_parts_exports = /* @__PURE__ */ __exportAll({
@@ -20,15 +23,19 @@ var index_parts_exports = /* @__PURE__ */ __exportAll({
 	Description: () => AlertDialogDescription,
 	Footer: () => AlertDialogFooter,
 	Header: () => AlertDialogHeader,
+	Indicator: () => AlertDialogIndicator,
+	Outlet: () => AlertDialogOutlet,
 	Popup: () => AlertDialogPopup,
 	Portal: () => AlertDialogPortal,
 	Root: () => AlertDialogRoot,
 	Title: () => AlertDialogTitle,
 	Trigger: () => AlertDialogTrigger,
 	Viewport: () => AlertDialogViewport,
+	alert: () => alertDialogAlert,
+	confirm: () => alertDialogConfirm,
 	createHandle: () => createAlertDialogHandle
 });
 //#endregion
-export { AlertDialogBackdrop as Backdrop, AlertDialogBody as Body, AlertDialogClose as Close, AlertDialogDescription as Description, AlertDialogFooter as Footer, AlertDialogHeader as Header, AlertDialogPopup as Popup, AlertDialogPortal as Portal, AlertDialogRoot as Root, AlertDialogTitle as Title, AlertDialogTrigger as Trigger, AlertDialogViewport as Viewport, createAlertDialogHandle as createHandle, index_parts_exports };
+export { AlertDialogBackdrop as Backdrop, AlertDialogBody as Body, AlertDialogClose as Close, AlertDialogDescription as Description, AlertDialogFooter as Footer, AlertDialogHeader as Header, AlertDialogIndicator as Indicator, AlertDialogOutlet as Outlet, AlertDialogPopup as Popup, AlertDialogPortal as Portal, AlertDialogRoot as Root, AlertDialogTitle as Title, AlertDialogTrigger as Trigger, AlertDialogViewport as Viewport, alertDialogAlert as alert, alertDialogConfirm as confirm, createAlertDialogHandle as createHandle, index_parts_exports };
 
 //# sourceMappingURL=index.parts.js.map

package/dist/components/overlays/alert-dialog/index.parts.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.parts.js","names":[],"sources":["../../../../src/components/overlays/alert-dialog/index.parts.ts"],"sourcesContent":["export { AlertDialogBackdrop as Backdrop } from './alert-dialog-backdrop';\nexport { AlertDialogBody as Body } from './alert-dialog-body';\nexport { AlertDialogClose as Close } from './alert-dialog-close';\nexport { AlertDialogDescription as Description } from './alert-dialog-description';\nexport { AlertDialogFooter as Footer } from './alert-dialog-footer';\nexport { AlertDialogHeader as Header } from './alert-dialog-header';\nexport { AlertDialogPopup as Popup } from './alert-dialog-popup';\nexport { AlertDialogPortal as Portal } from './alert-dialog-portal';\nexport { AlertDialogRoot as Root } from './alert-dialog-root';\nexport { AlertDialogTitle as Title } from './alert-dialog-title';\nexport { AlertDialogTrigger as Trigger } from './alert-dialog-trigger';\nexport { AlertDialogViewport as Viewport } from './alert-dialog-viewport';\nexport { createAlertDialogHandle as createHandle } from './create-handle';\n\n/* types */\n\nexport type {\n  AlertDialogBackdropProps as BackdropProps,\n  AlertDialogBackdropState as BackdropState,\n} from './alert-dialog-backdrop';\nexport type { AlertDialogBodyProps as BodyProps } from './alert-dialog-body';\nexport type {\n  AlertDialogCloseProps as CloseProps,\n  AlertDialogCloseState as CloseState,\n} from './alert-dialog-close';\nexport type {\n  AlertDialogDescriptionProps as DescriptionProps,\n  AlertDialogDescriptionState as DescriptionState,\n} from './alert-dialog-description';\nexport type { AlertDialogFooterProps as FooterProps } from './alert-dialog-footer';\nexport type { AlertDialogHeaderProps as HeaderProps } from './alert-dialog-header';\nexport type {\n  AlertDialogPopupProps as PopupProps,\n  AlertDialogPopupState as PopupState,\n} from './alert-dialog-popup';\nexport type {\n  AlertDialogPortalProps as PortalProps,\n  AlertDialogPortalState as PortalState,\n} from './alert-dialog-portal';\nexport type {\n  AlertDialogRootActions as RootActions,\n  AlertDialogRootChangeEventDetails as RootChangeEventDetails,\n  AlertDialogRootChangeEventReason as RootChangeEventReason,\n  AlertDialogRootProps as RootProps,\n  AlertDialogRootState as RootState,\n} from './alert-dialog-root';\nexport type {\n  AlertDialogTitleProps as TitleProps,\n  AlertDialogTitleState as TitleState,\n} from './alert-dialog-title';\nexport type {\n  AlertDialogTriggerProps as TriggerProps,\n  AlertDialogTriggerState as TriggerState,\n} from './alert-dialog-trigger';\nexport type {\n  AlertDialogViewportProps as ViewportProps,\n  AlertDialogViewportState as ViewportState,\n} from './alert-dialog-viewport';\nexport type { AlertDialogHandle as Handle } from './create-handle';\nexport type { AlertDialogVariants as Variants } from './use-alert-dialog-context';\n"],"mappings":""}
+{"version":3,"file":"index.parts.js","names":[],"sources":["../../../../src/components/overlays/alert-dialog/index.parts.ts"],"sourcesContent":["export { AlertDialogBackdrop as Backdrop } from './alert-dialog-backdrop';\nexport { AlertDialogBody as Body } from './alert-dialog-body';\nexport { AlertDialogClose as Close } from './alert-dialog-close';\nexport { AlertDialogDescription as Description } from './alert-dialog-description';\nexport { AlertDialogFooter as Footer } from './alert-dialog-footer';\nexport { AlertDialogHeader as Header } from './alert-dialog-header';\nexport {\n  alertDialogAlert as alert,\n  alertDialogConfirm as confirm,\n} from './alert-dialog-imperative';\nexport { AlertDialogIndicator as Indicator } from './alert-dialog-indicator';\nexport { AlertDialogOutlet as Outlet } from './alert-dialog-outlet';\nexport { AlertDialogPopup as Popup } from './alert-dialog-popup';\nexport { AlertDialogPortal as Portal } from './alert-dialog-portal';\nexport { AlertDialogRoot as Root } from './alert-dialog-root';\nexport { AlertDialogTitle as Title } from './alert-dialog-title';\nexport { AlertDialogTrigger as Trigger } from './alert-dialog-trigger';\nexport { AlertDialogViewport as Viewport } from './alert-dialog-viewport';\nexport { createAlertDialogHandle as createHandle } from './create-handle';\n\n/* types */\n\nexport type {\n  AlertDialogBackdropProps as BackdropProps,\n  AlertDialogBackdropState as BackdropState,\n} from './alert-dialog-backdrop';\nexport type { AlertDialogBodyProps as BodyProps } from './alert-dialog-body';\nexport type {\n  AlertDialogCloseProps as CloseProps,\n  AlertDialogCloseState as CloseState,\n} from './alert-dialog-close';\nexport type {\n  AlertDialogDescriptionProps as DescriptionProps,\n  AlertDialogDescriptionState as DescriptionState,\n} from './alert-dialog-description';\nexport type { AlertDialogFooterProps as FooterProps } from './alert-dialog-footer';\nexport type { AlertDialogHeaderProps as HeaderProps } from './alert-dialog-header';\nexport type {\n  AlertDialogAlertOptions as AlertOptions,\n  AlertDialogConfirmOptions as ConfirmOptions,\n} from './alert-dialog-imperative';\nexport type { AlertDialogIndicatorProps as IndicatorProps } from './alert-dialog-indicator';\nexport type {\n  AlertDialogPopupProps as PopupProps,\n  AlertDialogPopupState as PopupState,\n} from './alert-dialog-popup';\nexport type {\n  AlertDialogPortalProps as PortalProps,\n  AlertDialogPortalState as PortalState,\n} from './alert-dialog-portal';\nexport type {\n  AlertDialogRootActions as RootActions,\n  AlertDialogRootChangeEventDetails as RootChangeEventDetails,\n  AlertDialogRootChangeEventReason as RootChangeEventReason,\n  AlertDialogRootProps as RootProps,\n  AlertDialogRootState as RootState,\n} from './alert-dialog-root';\nexport type {\n  AlertDialogTitleProps as TitleProps,\n  AlertDialogTitleState as TitleState,\n} from './alert-dialog-title';\nexport type {\n  AlertDialogTriggerProps as TriggerProps,\n  AlertDialogTriggerState as TriggerState,\n} from './alert-dialog-trigger';\nexport type {\n  AlertDialogViewportProps as ViewportProps,\n  AlertDialogViewportState as ViewportState,\n} from './alert-dialog-viewport';\nexport type { AlertDialogHandle as Handle } from './create-handle';\nexport type { AlertDialogVariants as Variants } from './use-alert-dialog-context';\n"],"mappings":""}

package/dist/components/overlays/dialog/dialog-body.js

@@ -26,6 +26,7 @@ const DialogBody = (props) => {
 			"flex",
 			"flex-1",
 			"flex-col",
+			"gap-4",
 			"min-h-0",
 			"overflow-y-auto",
 			"px-(--dialog-padding)",