@alneas/appkit-react 0.2.0 → 0.3.1

package/dist/ui/components/ui/alert-dialog.d.ts

@@ -1,4 +1,5 @@
 import { AlertDialog as AlertDialogPrimitive } from '@base-ui/react/alert-dialog';
+import { Button } from './button.js';
 import * as React from 'react';
 /**
  * Coordinates an alert dialog that requests an explicit user decision.
@@ -53,7 +54,10 @@ declare namespace AlertDialogTrigger {
  * }
  * ```
  */
-declare const AlertDialogPortal: React.ForwardRefExoticComponent<Omit<import('@base-ui/react').AlertDialogPortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare function AlertDialogPortal({ ref, ...props }: React.PropsWithoutRef<AlertDialogPrimitive.Portal.Props> & React.RefAttributes<HTMLDivElement>): React.JSX.Element;
+declare namespace AlertDialogPortal {
+    var displayName: string;
+}
 /**
  * Renders the fixed backdrop for an alert dialog.
  * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
@@ -69,7 +73,10 @@ declare const AlertDialogPortal: React.ForwardRefExoticComponent<Omit<import('@b
  * }
  * ```
  */
-declare const AlertDialogOverlay: React.ForwardRefExoticComponent<Omit<import('@base-ui/react').AlertDialogBackdropProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare function AlertDialogOverlay({ ref, className, ...props }: React.PropsWithoutRef<AlertDialogPrimitive.Backdrop.Props> & React.RefAttributes<HTMLDivElement>): React.JSX.Element;
+declare namespace AlertDialogOverlay {
+    var displayName: string;
+}
 /**
  * Portals an alert popup with its backdrop and default or small sizing.
  * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling. Wrapper defaults: size='default'.
@@ -85,12 +92,18 @@ declare const AlertDialogOverlay: React.ForwardRefExoticComponent<Omit<import('@
  * }
  * ```
  */
-declare const AlertDialogContent: React.ForwardRefExoticComponent<Omit<import('@base-ui/react').AlertDialogPopupProps & {
+declare function AlertDialogContent({ ref, className, size, children, ...props }: React.PropsWithoutRef<AlertDialogPrimitive.Popup.Props & {
+    /**
+     * Visual size preset; defaults to default unless the owning component states otherwise.
+     */
     /**
      * Visual size preset; defaults to default unless the owning component states otherwise.
      */
-    size?: "default" | "sm";
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    size?: 'default' | 'sm';
+}> & React.RefAttributes<HTMLDivElement>): React.JSX.Element;
+declare namespace AlertDialogContent {
+    var displayName: string;
+}
 /**
  * Groups alert-dialog heading, description and optional media.
  * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
@@ -106,7 +119,10 @@ declare const AlertDialogContent: React.ForwardRefExoticComponent<Omit<import('@
  * }
  * ```
  */
-declare const AlertDialogHeader: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare function AlertDialogHeader({ ref, className, ...props }: React.PropsWithoutRef<React.ComponentProps<'div'>> & React.RefAttributes<HTMLDivElement>): React.JSX.Element;
+declare namespace AlertDialogHeader {
+    var displayName: string;
+}
 /**
  * Lays out alert-dialog decision controls at the popup footer.
  * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
@@ -122,7 +138,10 @@ declare const AlertDialogHeader: React.ForwardRefExoticComponent<Omit<React.Deta
  * }
  * ```
  */
-declare const AlertDialogFooter: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare function AlertDialogFooter({ ref, className, ...props }: React.PropsWithoutRef<React.ComponentProps<'div'>> & React.RefAttributes<HTMLDivElement>): React.JSX.Element;
+declare namespace AlertDialogFooter {
+    var displayName: string;
+}
 /**
  * Styles an icon or illustration placed in the alert-dialog header.
  * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
@@ -138,7 +157,10 @@ declare const AlertDialogFooter: React.ForwardRefExoticComponent<Omit<React.Deta
  * }
  * ```
  */
-declare const AlertDialogMedia: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare function AlertDialogMedia({ ref, className, ...props }: React.PropsWithoutRef<React.ComponentProps<'div'>> & React.RefAttributes<HTMLDivElement>): React.JSX.Element;
+declare namespace AlertDialogMedia {
+    var displayName: string;
+}
 /**
  * Provides the accessible heading for its alert popup.
  * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
@@ -154,7 +176,10 @@ declare const AlertDialogMedia: React.ForwardRefExoticComponent<Omit<React.Detai
  * }
  * ```
  */
-declare const AlertDialogTitle: React.ForwardRefExoticComponent<Omit<import('@base-ui/react').AlertDialogTitleProps, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare function AlertDialogTitle({ ref, className, ...props }: React.PropsWithoutRef<AlertDialogPrimitive.Title.Props> & React.RefAttributes<HTMLHeadingElement>): React.JSX.Element;
+declare namespace AlertDialogTitle {
+    var displayName: string;
+}
 /**
  * Provides the accessible explanatory text for its alert popup.
  * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
@@ -170,7 +195,10 @@ declare const AlertDialogTitle: React.ForwardRefExoticComponent<Omit<import('@ba
  * }
  * ```
  */
-declare const AlertDialogDescription: React.ForwardRefExoticComponent<Omit<import('@base-ui/react').AlertDialogDescriptionProps, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+declare function AlertDialogDescription({ ref, className, ...props }: React.PropsWithoutRef<AlertDialogPrimitive.Description.Props> & React.RefAttributes<HTMLParagraphElement>): React.JSX.Element;
+declare namespace AlertDialogDescription {
+    var displayName: string;
+}
 /**
  * Renders an Appkit button for a host-owned alert-dialog action.
  * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
@@ -186,7 +214,10 @@ declare const AlertDialogDescription: React.ForwardRefExoticComponent<Omit<impor
  * }
  * ```
  */
-declare const AlertDialogAction: React.ForwardRefExoticComponent<Omit<Omit<import('./button-components.js').ButtonProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare function AlertDialogAction({ ref, className, ...props }: React.PropsWithoutRef<React.ComponentProps<typeof Button>> & React.RefAttributes<HTMLButtonElement>): React.JSX.Element;
+declare namespace AlertDialogAction {
+    var displayName: string;
+}
 /**
  * Renders a close control styled as an outline button.
  * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling. Wrapper defaults: variant='outline', size='default'.
@@ -202,5 +233,8 @@ declare const AlertDialogAction: React.ForwardRefExoticComponent<Omit<Omit<impor
  * }
  * ```
  */
-declare const AlertDialogCancel: React.ForwardRefExoticComponent<Omit<import('@base-ui/react').AlertDialogCloseProps & Pick<Omit<import('./button-components.js').ButtonProps, "ref"> & React.RefAttributes<HTMLElement>, "size" | "variant">, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare function AlertDialogCancel({ ref, className, variant, size, ...props }: React.PropsWithoutRef<AlertDialogPrimitive.Close.Props & Pick<React.ComponentProps<typeof Button>, 'variant' | 'size'>> & React.RefAttributes<HTMLButtonElement>): React.JSX.Element;
+declare namespace AlertDialogCancel {
+    var displayName: string;
+}
 export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, };

package/dist/ui/components/ui/alert-dialog.js

@@ -3,98 +3,118 @@
 import { cn as e } from "../../lib/utils.js";
 import { Button as t } from "./button-components.js";
 import { jsx as n, jsxs as r } from "react/jsx-runtime";
-import * as i from "react";
-import { AlertDialog as a } from "@base-ui/react/alert-dialog";
+import "react";
+import { AlertDialog as i } from "@base-ui/react/alert-dialog";
 //#region src/ui/components/ui/alert-dialog.tsx
-var o = (e) => /* @__PURE__ */ n(a.Root, {
+var a = (e) => /* @__PURE__ */ n(i.Root, {
 	"data-slot": "alert-dialog",
 	...e
 });
-o.displayName = "AlertDialog";
-function s({ children: e, ...t }) {
-	return /* @__PURE__ */ n(a.Trigger, {
+a.displayName = "AlertDialog";
+function o({ children: e, ...t }) {
+	return /* @__PURE__ */ n(i.Trigger, {
 		"data-slot": "alert-dialog-trigger",
 		...t,
 		children: e
 	});
 }
-s.displayName = "AlertDialogTrigger";
-var c = i.forwardRef(({ ...e }, t) => /* @__PURE__ */ n(a.Portal, {
-	ref: t,
-	"data-slot": "alert-dialog-portal",
-	...e
-}));
-c.displayName = "AlertDialogPortal";
-var l = i.forwardRef(({ className: t, ...r }, i) => /* @__PURE__ */ n(a.Backdrop, {
-	ref: i,
-	"data-slot": "alert-dialog-overlay",
-	className: e("data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 isolate z-50", t),
-	...r
-}));
-l.displayName = "AlertDialogOverlay";
-var u = i.forwardRef(({ className: t, size: i = "default", children: o, ...s }, u) => /* @__PURE__ */ r(c, { children: [/* @__PURE__ */ n(l, {}), /* @__PURE__ */ n(a.Popup, {
-	ref: u,
-	"data-slot": "alert-dialog-content",
-	"data-size": i,
-	className: e("data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 bg-background ring-foreground/10 gap-4 rounded-xl p-4 ring-1 duration-100 data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 outline-none", t),
-	...s,
-	children: o
-})] }));
-u.displayName = "AlertDialogContent";
-var d = i.forwardRef(({ className: t, ...r }, i) => /* @__PURE__ */ n("div", {
-	ref: i,
-	"data-slot": "alert-dialog-header",
-	className: e("grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]", t),
-	...r
-}));
-d.displayName = "AlertDialogHeader";
-var f = i.forwardRef(({ className: t, ...r }, i) => /* @__PURE__ */ n("div", {
-	ref: i,
-	"data-slot": "alert-dialog-footer",
-	className: e("bg-muted/50 -mx-4 -mb-4 rounded-b-xl border-t p-4 flex flex-col-reverse gap-2 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end", t),
-	...r
-}));
-f.displayName = "AlertDialogFooter";
-var p = i.forwardRef(({ className: t, ...r }, i) => /* @__PURE__ */ n("div", {
-	ref: i,
-	"data-slot": "alert-dialog-media",
-	className: e("bg-muted mb-2 inline-flex size-10 items-center justify-center rounded-md sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-6", t),
-	...r
-}));
-p.displayName = "AlertDialogMedia";
-var m = i.forwardRef(({ className: t, ...r }, i) => /* @__PURE__ */ n(a.Title, {
-	ref: i,
-	"data-slot": "alert-dialog-title",
-	className: e("text-sm font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2", t),
-	...r
-}));
-m.displayName = "AlertDialogTitle";
-var h = i.forwardRef(({ className: t, ...r }, i) => /* @__PURE__ */ n(a.Description, {
-	ref: i,
-	"data-slot": "alert-dialog-description",
-	className: e("text-muted-foreground *:[a]:hover:text-foreground text-sm text-balance md:text-pretty *:[a]:underline *:[a]:underline-offset-3", t),
-	...r
-}));
-h.displayName = "AlertDialogDescription";
-var g = i.forwardRef(({ className: r, ...i }, a) => /* @__PURE__ */ n(t, {
-	ref: a,
-	"data-slot": "alert-dialog-action",
-	className: e(r),
-	...i
-}));
-g.displayName = "AlertDialogAction";
-var _ = i.forwardRef(({ className: r, variant: i = "outline", size: o = "default", ...s }, c) => /* @__PURE__ */ n(a.Close, {
-	ref: c,
-	"data-slot": "alert-dialog-cancel",
-	className: e(r),
-	render: /* @__PURE__ */ n(t, {
-		variant: i,
-		size: o
-	}),
-	...s
-}));
-_.displayName = "AlertDialogCancel";
+o.displayName = "AlertDialogTrigger";
+function s({ ref: e, ...t }) {
+	return /* @__PURE__ */ n(i.Portal, {
+		ref: e,
+		"data-slot": "alert-dialog-portal",
+		...t
+	});
+}
+s.displayName = "AlertDialogPortal";
+function c({ ref: t, className: r, ...a }) {
+	return /* @__PURE__ */ n(i.Backdrop, {
+		ref: t,
+		"data-slot": "alert-dialog-overlay",
+		className: e("data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 isolate z-50", r),
+		...a
+	});
+}
+c.displayName = "AlertDialogOverlay";
+function l({ ref: t, className: a, size: o = "default", children: l, ...u }) {
+	return /* @__PURE__ */ r(s, { children: [/* @__PURE__ */ n(c, {}), /* @__PURE__ */ n(i.Popup, {
+		ref: t,
+		"data-slot": "alert-dialog-content",
+		"data-size": o,
+		className: e("data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 bg-background ring-foreground/10 gap-4 rounded-xl p-4 ring-1 duration-100 data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 outline-none", a),
+		...u,
+		children: l
+	})] });
+}
+l.displayName = "AlertDialogContent";
+function u({ ref: t, className: r, ...i }) {
+	return /* @__PURE__ */ n("div", {
+		ref: t,
+		"data-slot": "alert-dialog-header",
+		className: e("grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]", r),
+		...i
+	});
+}
+u.displayName = "AlertDialogHeader";
+function d({ ref: t, className: r, ...i }) {
+	return /* @__PURE__ */ n("div", {
+		ref: t,
+		"data-slot": "alert-dialog-footer",
+		className: e("bg-muted/50 -mx-4 -mb-4 rounded-b-xl border-t p-4 flex flex-col-reverse gap-2 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end", r),
+		...i
+	});
+}
+d.displayName = "AlertDialogFooter";
+function f({ ref: t, className: r, ...i }) {
+	return /* @__PURE__ */ n("div", {
+		ref: t,
+		"data-slot": "alert-dialog-media",
+		className: e("bg-muted mb-2 inline-flex size-10 items-center justify-center rounded-md sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-6", r),
+		...i
+	});
+}
+f.displayName = "AlertDialogMedia";
+function p({ ref: t, className: r, ...a }) {
+	return /* @__PURE__ */ n(i.Title, {
+		ref: t,
+		"data-slot": "alert-dialog-title",
+		className: e("text-sm font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2", r),
+		...a
+	});
+}
+p.displayName = "AlertDialogTitle";
+function m({ ref: t, className: r, ...a }) {
+	return /* @__PURE__ */ n(i.Description, {
+		ref: t,
+		"data-slot": "alert-dialog-description",
+		className: e("text-muted-foreground *:[a]:hover:text-foreground text-sm text-balance md:text-pretty *:[a]:underline *:[a]:underline-offset-3", r),
+		...a
+	});
+}
+m.displayName = "AlertDialogDescription";
+function h({ ref: r, className: i, ...a }) {
+	return /* @__PURE__ */ n(t, {
+		ref: r,
+		"data-slot": "alert-dialog-action",
+		className: e(i),
+		...a
+	});
+}
+h.displayName = "AlertDialogAction";
+function g({ ref: r, className: a, variant: o = "outline", size: s = "default", ...c }) {
+	return /* @__PURE__ */ n(i.Close, {
+		ref: r,
+		"data-slot": "alert-dialog-cancel",
+		className: e(a),
+		render: /* @__PURE__ */ n(t, {
+			variant: o,
+			size: s
+		}),
+		...c
+	});
+}
+g.displayName = "AlertDialogCancel";
 //#endregion
-export { o as AlertDialog, g as AlertDialogAction, _ as AlertDialogCancel, u as AlertDialogContent, h as AlertDialogDescription, f as AlertDialogFooter, d as AlertDialogHeader, p as AlertDialogMedia, l as AlertDialogOverlay, c as AlertDialogPortal, m as AlertDialogTitle, s as AlertDialogTrigger };
+export { a as AlertDialog, h as AlertDialogAction, g as AlertDialogCancel, l as AlertDialogContent, m as AlertDialogDescription, d as AlertDialogFooter, u as AlertDialogHeader, f as AlertDialogMedia, c as AlertDialogOverlay, s as AlertDialogPortal, p as AlertDialogTitle, o as AlertDialogTrigger };
 
 //# sourceMappingURL=alert-dialog.js.map

package/dist/ui/components/ui/alert-dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog.js","names":["AlertDialogPrimitive","React","React$1","AlertDialog$1","AlertDialog","props","AlertDialogTrigger","AlertDialogPortal","AlertDialogOverlay","cn","className","AlertDialogContent","size","AlertDialogHeader","AlertDialogFooter","AlertDialogMedia","AlertDialogTitle","AlertDialogDescription","AlertDialogAction","Button","AlertDialogCancel"],"sources":["../../../../src/ui/components/ui/alert-dialog.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { AlertDialog as AlertDialogPrimitive } from '@base-ui/react/alert-dialog';\n\nimport { cn } from '../../lib/utils';\nimport { Button } from '../../components/ui/button';\n\n/**\n * Coordinates an alert dialog that requests an explicit user decision.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialog composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nconst AlertDialog = (props: AlertDialogPrimitive.Root.Props) => (\n  <AlertDialogPrimitive.Root data-slot='alert-dialog' {...props} />\n);\nAlertDialog.displayName = 'AlertDialog';\n\n/**\n * Renders the control that requests opening its alert dialog.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogTrigger composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nfunction AlertDialogTrigger({\n  children,\n  ...props\n}: AlertDialogPrimitive.Trigger.Props) {\n  return (\n    <AlertDialogPrimitive.Trigger\n      data-slot='alert-dialog-trigger'\n      {...props}\n    >\n      {children}\n    </AlertDialogPrimitive.Trigger>\n  );\n}\nAlertDialogTrigger.displayName = 'AlertDialogTrigger';\n\n/**\n * Mounts alert-dialog descendants into the Base UI portal target.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogPortal composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nconst AlertDialogPortal = React.forwardRef<HTMLDivElement, AlertDialogPrimitive.Portal.Props>(\n  ({ ...props }, ref) => (\n    <AlertDialogPrimitive.Portal ref={ref} data-slot='alert-dialog-portal' {...props} />\n  ),\n);\nAlertDialogPortal.displayName = 'AlertDialogPortal';\n\n/**\n * Renders the fixed backdrop for an alert dialog.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogOverlay composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nconst AlertDialogOverlay = React.forwardRef<HTMLDivElement, AlertDialogPrimitive.Backdrop.Props>(\n  ({ className, ...props }, ref) => (\n    <AlertDialogPrimitive.Backdrop\n      ref={ref}\n      data-slot='alert-dialog-overlay'\n      className={cn(\n        'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 isolate z-50',\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nAlertDialogOverlay.displayName = 'AlertDialogOverlay';\n\n/**\n * Portals an alert popup with its backdrop and default or small sizing.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling. Wrapper defaults: size='default'.\n * @returns The rendered AlertDialogContent composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nconst AlertDialogContent = React.forwardRef<\n  HTMLDivElement,\n  AlertDialogPrimitive.Popup.Props & { /**\n * Visual size preset; defaults to default unless the owning component states otherwise.\n */\n  /**\n   * Visual size preset; defaults to default unless the owning component states otherwise.\n   */\n  size?: 'default' | 'sm' }\n>(({ className, size = 'default', children, ...props }, ref) => (\n  <AlertDialogPortal>\n    <AlertDialogOverlay />\n    <AlertDialogPrimitive.Popup\n      ref={ref}\n      data-slot='alert-dialog-content'\n      data-size={size}\n      className={cn(\n        'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 bg-background ring-foreground/10 gap-4 rounded-xl p-4 ring-1 duration-100 data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 outline-none',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </AlertDialogPrimitive.Popup>\n  </AlertDialogPortal>\n));\nAlertDialogContent.displayName = 'AlertDialogContent';\n\n/**\n * Groups alert-dialog heading, description and optional media.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogHeader composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nconst AlertDialogHeader = React.forwardRef<HTMLDivElement, React.ComponentProps<'div'>>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot='alert-dialog-header'\n      className={cn(\n        'grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]',\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nAlertDialogHeader.displayName = 'AlertDialogHeader';\n\n/**\n * Lays out alert-dialog decision controls at the popup footer.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogFooter composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nconst AlertDialogFooter = React.forwardRef<HTMLDivElement, React.ComponentProps<'div'>>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot='alert-dialog-footer'\n      className={cn(\n        'bg-muted/50 -mx-4 -mb-4 rounded-b-xl border-t p-4 flex flex-col-reverse gap-2 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end',\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nAlertDialogFooter.displayName = 'AlertDialogFooter';\n\n/**\n * Styles an icon or illustration placed in the alert-dialog header.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogMedia composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nconst AlertDialogMedia = React.forwardRef<HTMLDivElement, React.ComponentProps<'div'>>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot='alert-dialog-media'\n      className={cn(\n        \"bg-muted mb-2 inline-flex size-10 items-center justify-center rounded-md sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-6\",\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nAlertDialogMedia.displayName = 'AlertDialogMedia';\n\n/**\n * Provides the accessible heading for its alert popup.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogTitle composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nconst AlertDialogTitle = React.forwardRef<HTMLHeadingElement, AlertDialogPrimitive.Title.Props>(\n  ({ className, ...props }, ref) => (\n    <AlertDialogPrimitive.Title\n      ref={ref}\n      data-slot='alert-dialog-title'\n      className={cn(\n        'text-sm font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2',\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nAlertDialogTitle.displayName = 'AlertDialogTitle';\n\n/**\n * Provides the accessible explanatory text for its alert popup.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogDescription composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nconst AlertDialogDescription = React.forwardRef<\n  HTMLParagraphElement,\n  AlertDialogPrimitive.Description.Props\n>(({ className, ...props }, ref) => (\n  <AlertDialogPrimitive.Description\n    ref={ref}\n    data-slot='alert-dialog-description'\n    className={cn(\n      'text-muted-foreground *:[a]:hover:text-foreground text-sm text-balance md:text-pretty *:[a]:underline *:[a]:underline-offset-3',\n      className,\n    )}\n    {...props}\n  />\n));\nAlertDialogDescription.displayName = 'AlertDialogDescription';\n\n/**\n * Renders an Appkit button for a host-owned alert-dialog action.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogAction composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type. This is a Button wrapper, not a Base UI close primitive; clicking it does not automatically close the dialog.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nconst AlertDialogAction = React.forwardRef<HTMLButtonElement, React.ComponentProps<typeof Button>>(\n  ({ className, ...props }, ref) => (\n    <Button ref={ref} data-slot='alert-dialog-action' className={cn(className)} {...props} />\n  ),\n);\nAlertDialogAction.displayName = 'AlertDialogAction';\n\n/**\n * Renders a close control styled as an outline button.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling. Wrapper defaults: variant='outline', size='default'.\n * @returns The rendered AlertDialogCancel composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type. variant defaults to outline and size to default; the Base UI Close primitive is rendered through Button.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nconst AlertDialogCancel = React.forwardRef<\n  HTMLButtonElement,\n  AlertDialogPrimitive.Close.Props & Pick<React.ComponentProps<typeof Button>, 'variant' | 'size'>\n>(({ className, variant = 'outline', size = 'default', ...props }, ref) => (\n  <AlertDialogPrimitive.Close\n    ref={ref}\n    data-slot='alert-dialog-cancel'\n    className={cn(className)}\n    render={<Button variant={variant} size={size} />}\n    {...props}\n  />\n));\nAlertDialogCancel.displayName = 'AlertDialogCancel';\n\nexport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogMedia,\n  AlertDialogOverlay,\n  AlertDialogPortal,\n  AlertDialogTitle,\n  AlertDialogTrigger,\n};\n"],"mappings":";;;;;;;;AAuBA,IAAMI,KAAe,MACnB,kBAACJ,EAAqB,MAAtB;CAA2B,aAAU;CAAe,GAAIK;AAAQ,CAAA;AAElE,EAAY,cAAc;AAiB1B,SAASC,EAAmB,EAC1B,aACA,GAAGD,KACkC;CACrC,OACE,kBAACL,EAAqB,SAAtB;EACE,aAAU;EACV,GAAIK;EAEH;CAC2B,CAAA;AAElC;AACA,EAAmB,cAAc;AAiBjC,IAAME,IAAoBN,EAAM,YAC7B,EAAE,GAAGI,KAAS,MACb,kBAACL,EAAqB,QAAtB;CAAkC;CAAK,aAAU;CAAsB,GAAIK;AAAQ,CAAA,CAEvF;AACA,EAAkB,cAAc;AAiBhC,IAAMG,IAAqBP,EAAM,YAC9B,EAAE,cAAW,GAAGI,KAAS,MACxB,kBAACL,EAAqB,UAAtB;CACO;CACL,aAAU;CACV,WAAWS,EACT,yLACAC,CACF;CACA,GAAIL;AACL,CAAA,CAEL;AACA,EAAmB,cAAc;AAiBjC,IAAMM,IAAqBV,EAAM,YAS9B,EAAE,cAAW,UAAO,WAAW,aAAU,GAAGI,KAAS,MACtD,kBAACE,GAAD,EAAA,UAAA,CACE,kBAACC,GAAD,CAAqB,CAAA,GACrB,kBAACR,EAAqB,OAAtB;CACO;CACL,aAAU;CACV,aAAWY;CACX,WAAWH,EACT,yZACAC,CACF;CACA,GAAIL;CAEH;AACyB,CAAA,CACX,EAAA,CAAA,CACpB;AACD,EAAmB,cAAc;AAiBjC,IAAMQ,IAAoBZ,EAAM,YAC7B,EAAE,cAAW,GAAGI,KAAS,MACxB,kBAAC,OAAD;CACO;CACL,aAAU;CACV,WAAWI,EACT,sZACAC,CACF;CACA,GAAIL;AACL,CAAA,CAEL;AACA,EAAkB,cAAc;AAiBhC,IAAMS,IAAoBb,EAAM,YAC7B,EAAE,cAAW,GAAGI,KAAS,MACxB,kBAAC,OAAD;CACO;CACL,aAAU;CACV,WAAWI,EACT,iNACAC,CACF;CACA,GAAIL;AACL,CAAA,CAEL;AACA,EAAkB,cAAc;AAiBhC,IAAMU,IAAmBd,EAAM,YAC5B,EAAE,cAAW,GAAGI,KAAS,MACxB,kBAAC,OAAD;CACO;CACL,aAAU;CACV,WAAWI,EACT,8KACAC,CACF;CACA,GAAIL;AACL,CAAA,CAEL;AACA,EAAiB,cAAc;AAiB/B,IAAMW,IAAmBf,EAAM,YAC5B,EAAE,cAAW,GAAGI,KAAS,MACxB,kBAACL,EAAqB,OAAtB;CACO;CACL,aAAU;CACV,WAAWS,EACT,mJACAC,CACF;CACA,GAAIL;AACL,CAAA,CAEL;AACA,EAAiB,cAAc;AAiB/B,IAAMY,IAAyBhB,EAAM,YAGlC,EAAE,cAAW,GAAGI,KAAS,MAC1B,kBAACL,EAAqB,aAAtB;CACO;CACL,aAAU;CACV,WAAWS,EACT,kIACAC,CACF;CACA,GAAIL;AACL,CAAA,CACF;AACD,EAAuB,cAAc;AAiBrC,IAAMa,IAAoBjB,EAAM,YAC7B,EAAE,cAAW,GAAGI,KAAS,MACxB,kBAACc,GAAD;CAAa;CAAK,aAAU;CAAsB,WAAWV,EAAGC,CAAS;CAAG,GAAIL;AAAQ,CAAA,CAE5F;AACA,EAAkB,cAAc;AAiBhC,IAAMe,IAAoBnB,EAAM,YAG7B,EAAE,cAAW,aAAU,WAAW,UAAO,WAAW,GAAGI,KAAS,MACjE,kBAACL,EAAqB,OAAtB;CACO;CACL,aAAU;CACV,WAAWS,EAAGC,CAAS;CACvB,QAAQ,kBAACS,GAAD;EAAiB;EAAe;CAAO,CAAA;CAC/C,GAAId;AACL,CAAA,CACF;AACD,EAAkB,cAAc"}
+{"version":3,"file":"alert-dialog.js","names":["AlertDialogPrimitive","AlertDialog$1","AlertDialog","props","AlertDialogTrigger","AlertDialogPortal","AlertDialogOverlay","cn","className","AlertDialogContent","size","AlertDialogHeader","AlertDialogFooter","AlertDialogMedia","AlertDialogTitle","AlertDialogDescription","AlertDialogAction","Button","AlertDialogCancel"],"sources":["../../../../src/ui/components/ui/alert-dialog.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { AlertDialog as AlertDialogPrimitive } from '@base-ui/react/alert-dialog';\n\nimport { cn } from '../../lib/utils';\nimport { Button } from '../../components/ui/button';\n\n/**\n * Coordinates an alert dialog that requests an explicit user decision.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialog composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nconst AlertDialog = (props: AlertDialogPrimitive.Root.Props) => (\n  <AlertDialogPrimitive.Root data-slot='alert-dialog' {...props} />\n);\nAlertDialog.displayName = 'AlertDialog';\n\n/**\n * Renders the control that requests opening its alert dialog.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogTrigger composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nfunction AlertDialogTrigger({\n  children,\n  ...props\n}: AlertDialogPrimitive.Trigger.Props) {\n  return (\n    <AlertDialogPrimitive.Trigger\n      data-slot='alert-dialog-trigger'\n      {...props}\n    >\n      {children}\n    </AlertDialogPrimitive.Trigger>\n  );\n}\nAlertDialogTrigger.displayName = 'AlertDialogTrigger';\n\n/**\n * Mounts alert-dialog descendants into the Base UI portal target.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogPortal composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nfunction AlertDialogPortal({\n  ref,\n  ...props\n}: React.PropsWithoutRef<AlertDialogPrimitive.Portal.Props> & React.RefAttributes<HTMLDivElement>) {\n  return <AlertDialogPrimitive.Portal ref={ref} data-slot='alert-dialog-portal' {...props} />;\n}\nAlertDialogPortal.displayName = 'AlertDialogPortal';\n\n/**\n * Renders the fixed backdrop for an alert dialog.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogOverlay composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nfunction AlertDialogOverlay({\n  ref,\n  className,\n  ...props\n}: React.PropsWithoutRef<AlertDialogPrimitive.Backdrop.Props> &\n  React.RefAttributes<HTMLDivElement>) {\n  return (\n    <AlertDialogPrimitive.Backdrop\n      ref={ref}\n      data-slot='alert-dialog-overlay'\n      className={cn(\n        'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 isolate z-50',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\nAlertDialogOverlay.displayName = 'AlertDialogOverlay';\n\n/**\n * Portals an alert popup with its backdrop and default or small sizing.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling. Wrapper defaults: size='default'.\n * @returns The rendered AlertDialogContent composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nfunction AlertDialogContent({\n  ref,\n  className,\n  size = 'default',\n  children,\n  ...props\n}: React.PropsWithoutRef<\n  AlertDialogPrimitive.Popup.Props & {\n    /**\n     * Visual size preset; defaults to default unless the owning component states otherwise.\n     */\n    /**\n     * Visual size preset; defaults to default unless the owning component states otherwise.\n     */\n    size?: 'default' | 'sm';\n  }\n> &\n  React.RefAttributes<HTMLDivElement>) {\n  return (\n    <AlertDialogPortal>\n      <AlertDialogOverlay />\n      <AlertDialogPrimitive.Popup\n        ref={ref}\n        data-slot='alert-dialog-content'\n        data-size={size}\n        className={cn(\n          'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 bg-background ring-foreground/10 gap-4 rounded-xl p-4 ring-1 duration-100 data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 outline-none',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </AlertDialogPrimitive.Popup>\n    </AlertDialogPortal>\n  );\n}\nAlertDialogContent.displayName = 'AlertDialogContent';\n\n/**\n * Groups alert-dialog heading, description and optional media.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogHeader composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nfunction AlertDialogHeader({\n  ref,\n  className,\n  ...props\n}: React.PropsWithoutRef<React.ComponentProps<'div'>> & React.RefAttributes<HTMLDivElement>) {\n  return (\n    <div\n      ref={ref}\n      data-slot='alert-dialog-header'\n      className={cn(\n        'grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\nAlertDialogHeader.displayName = 'AlertDialogHeader';\n\n/**\n * Lays out alert-dialog decision controls at the popup footer.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogFooter composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nfunction AlertDialogFooter({\n  ref,\n  className,\n  ...props\n}: React.PropsWithoutRef<React.ComponentProps<'div'>> & React.RefAttributes<HTMLDivElement>) {\n  return (\n    <div\n      ref={ref}\n      data-slot='alert-dialog-footer'\n      className={cn(\n        'bg-muted/50 -mx-4 -mb-4 rounded-b-xl border-t p-4 flex flex-col-reverse gap-2 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\nAlertDialogFooter.displayName = 'AlertDialogFooter';\n\n/**\n * Styles an icon or illustration placed in the alert-dialog header.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogMedia composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nfunction AlertDialogMedia({\n  ref,\n  className,\n  ...props\n}: React.PropsWithoutRef<React.ComponentProps<'div'>> & React.RefAttributes<HTMLDivElement>) {\n  return (\n    <div\n      ref={ref}\n      data-slot='alert-dialog-media'\n      className={cn(\n        \"bg-muted mb-2 inline-flex size-10 items-center justify-center rounded-md sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-6\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\nAlertDialogMedia.displayName = 'AlertDialogMedia';\n\n/**\n * Provides the accessible heading for its alert popup.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogTitle composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nfunction AlertDialogTitle({\n  ref,\n  className,\n  ...props\n}: React.PropsWithoutRef<AlertDialogPrimitive.Title.Props> &\n  React.RefAttributes<HTMLHeadingElement>) {\n  return (\n    <AlertDialogPrimitive.Title\n      ref={ref}\n      data-slot='alert-dialog-title'\n      className={cn(\n        'text-sm font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\nAlertDialogTitle.displayName = 'AlertDialogTitle';\n\n/**\n * Provides the accessible explanatory text for its alert popup.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogDescription composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nfunction AlertDialogDescription({\n  ref,\n  className,\n  ...props\n}: React.PropsWithoutRef<AlertDialogPrimitive.Description.Props> &\n  React.RefAttributes<HTMLParagraphElement>) {\n  return (\n    <AlertDialogPrimitive.Description\n      ref={ref}\n      data-slot='alert-dialog-description'\n      className={cn(\n        'text-muted-foreground *:[a]:hover:text-foreground text-sm text-balance md:text-pretty *:[a]:underline *:[a]:underline-offset-3',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\nAlertDialogDescription.displayName = 'AlertDialogDescription';\n\n/**\n * Renders an Appkit button for a host-owned alert-dialog action.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AlertDialogAction composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type. This is a Button wrapper, not a Base UI close primitive; clicking it does not automatically close the dialog.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nfunction AlertDialogAction({\n  ref,\n  className,\n  ...props\n}: React.PropsWithoutRef<React.ComponentProps<typeof Button>> &\n  React.RefAttributes<HTMLButtonElement>) {\n  return <Button ref={ref} data-slot='alert-dialog-action' className={cn(className)} {...props} />;\n}\nAlertDialogAction.displayName = 'AlertDialogAction';\n\n/**\n * Renders a close control styled as an outline button.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling. Wrapper defaults: variant='outline', size='default'.\n * @returns The rendered AlertDialogCancel composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Keep popup, trigger and close controls under AlertDialog. Content supplies its own portal/backdrop; separate Portal/Overlay exports are for custom compositions. Base UI owns dialog state and focus. The host owns action effects. The ref prop forwards to the rendered control or container declared by the component ref type. variant defaults to outline and size to default; the Base UI Close primitive is rendered through Button.\n * @example\n * ```tsx\n * import { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AlertDialog><AlertDialogTrigger>Review</AlertDialogTrigger><AlertDialogContent><AlertDialogHeader><AlertDialogTitle>Apply changes?</AlertDialogTitle><AlertDialogDescription>Review your changes before applying them.</AlertDialogDescription></AlertDialogHeader><AlertDialogFooter><AlertDialogCancel>Cancel</AlertDialogCancel><AlertDialogAction onClick={() => console.log(\"Apply requested\")}>Apply</AlertDialogAction></AlertDialogFooter></AlertDialogContent></AlertDialog>);\n * }\n * ```\n */\nfunction AlertDialogCancel({\n  ref,\n  className,\n  variant = 'outline',\n  size = 'default',\n  ...props\n}: React.PropsWithoutRef<\n  AlertDialogPrimitive.Close.Props & Pick<React.ComponentProps<typeof Button>, 'variant' | 'size'>\n> &\n  React.RefAttributes<HTMLButtonElement>) {\n  return (\n    <AlertDialogPrimitive.Close\n      ref={ref}\n      data-slot='alert-dialog-cancel'\n      className={cn(className)}\n      render={<Button variant={variant} size={size} />}\n      {...props}\n    />\n  );\n}\nAlertDialogCancel.displayName = 'AlertDialogCancel';\n\nexport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogMedia,\n  AlertDialogOverlay,\n  AlertDialogPortal,\n  AlertDialogTitle,\n  AlertDialogTrigger,\n};\n"],"mappings":";;;;;;;;AAuBA,IAAME,KAAe,MACnB,kBAACF,EAAqB,MAAtB;CAA2B,aAAU;CAAe,GAAIG;AAAQ,CAAA;AAElE,EAAY,cAAc;AAiB1B,SAASC,EAAmB,EAC1B,aACA,GAAGD,KACkC;CACrC,OACE,kBAACH,EAAqB,SAAtB;EACE,aAAU;EACV,GAAIG;EAEH;CAC2B,CAAA;AAElC;AACA,EAAmB,cAAc;AAiBjC,SAASE,EAAkB,EACzB,QACA,GAAGF,KAC8F;CACjG,OAAO,kBAACH,EAAqB,QAAtB;EAAkC;EAAK,aAAU;EAAsB,GAAIG;CAAQ,CAAA;AAC5F;AACA,EAAkB,cAAc;AAiBhC,SAASG,EAAmB,EAC1B,QACA,cACA,GAAGH,KAEkC;CACrC,OACE,kBAACH,EAAqB,UAAtB;EACO;EACL,aAAU;EACV,WAAWO,EACT,yLACAC,CACF;EACA,GAAIL;CACL,CAAA;AAEL;AACA,EAAmB,cAAc;AAiBjC,SAASM,EAAmB,EAC1B,QACA,cACA,UAAO,WACP,aACA,GAAGN,KAYkC;CACrC,OACE,kBAACE,GAAD,EAAA,UAAA,CACE,kBAACC,GAAD,CAAqB,CAAA,GACrB,kBAACN,EAAqB,OAAtB;EACO;EACL,aAAU;EACV,aAAWU;EACX,WAAWH,EACT,yZACAC,CACF;EACA,GAAIL;EAEH;CACyB,CAAA,CACX,EAAA,CAAA;AAEvB;AACA,EAAmB,cAAc;AAiBjC,SAASQ,EAAkB,EACzB,QACA,cACA,GAAGR,KACwF;CAC3F,OACE,kBAAC,OAAD;EACO;EACL,aAAU;EACV,WAAWI,EACT,sZACAC,CACF;EACA,GAAIL;CACL,CAAA;AAEL;AACA,EAAkB,cAAc;AAiBhC,SAASS,EAAkB,EACzB,QACA,cACA,GAAGT,KACwF;CAC3F,OACE,kBAAC,OAAD;EACO;EACL,aAAU;EACV,WAAWI,EACT,iNACAC,CACF;EACA,GAAIL;CACL,CAAA;AAEL;AACA,EAAkB,cAAc;AAiBhC,SAASU,EAAiB,EACxB,QACA,cACA,GAAGV,KACwF;CAC3F,OACE,kBAAC,OAAD;EACO;EACL,aAAU;EACV,WAAWI,EACT,8KACAC,CACF;EACA,GAAIL;CACL,CAAA;AAEL;AACA,EAAiB,cAAc;AAiB/B,SAASW,EAAiB,EACxB,QACA,cACA,GAAGX,KAEsC;CACzC,OACE,kBAACH,EAAqB,OAAtB;EACO;EACL,aAAU;EACV,WAAWO,EACT,mJACAC,CACF;EACA,GAAIL;CACL,CAAA;AAEL;AACA,EAAiB,cAAc;AAiB/B,SAASY,EAAuB,EAC9B,QACA,cACA,GAAGZ,KAEwC;CAC3C,OACE,kBAACH,EAAqB,aAAtB;EACO;EACL,aAAU;EACV,WAAWO,EACT,kIACAC,CACF;EACA,GAAIL;CACL,CAAA;AAEL;AACA,EAAuB,cAAc;AAiBrC,SAASa,EAAkB,EACzB,QACA,cACA,GAAGb,KAEqC;CACxC,OAAO,kBAACc,GAAD;EAAa;EAAK,aAAU;EAAsB,WAAWV,EAAGC,CAAS;EAAG,GAAIL;CAAQ,CAAA;AACjG;AACA,EAAkB,cAAc;AAiBhC,SAASe,EAAkB,EACzB,QACA,cACA,aAAU,WACV,UAAO,WACP,GAAGf,KAIqC;CACxC,OACE,kBAACH,EAAqB,OAAtB;EACO;EACL,aAAU;EACV,WAAWO,EAAGC,CAAS;EACvB,QAAQ,kBAACS,GAAD;GAAiB;GAAe;EAAO,CAAA;EAC/C,GAAId;CACL,CAAA;AAEL;AACA,EAAkB,cAAc"}

package/dist/ui/components/ui/avatar.cjs

@@ -1,2 +1,2 @@
-"use client";"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react/jsx-runtime"),r=require("react");r=e.__toESM(r,1);let i=require("@base-ui/react/avatar");var a=r.forwardRef(({className:e,size:r=`default`,...a},o)=>(0,n.jsx)(i.Avatar.Root,{ref:o,"data-slot":`avatar`,"data-size":r,className:t.cn(`size-8 rounded-full after:rounded-full data-[size=lg]:size-10 data-[size=sm]:size-6 after:border-border group/avatar relative flex shrink-0 select-none after:absolute after:inset-0 after:border after:mix-blend-darken dark:after:mix-blend-lighten`,e),...a}));a.displayName=i.Avatar.Root.displayName;var o=r.forwardRef(({className:e,...r},a)=>(0,n.jsx)(i.Avatar.Image,{ref:a,"data-slot":`avatar-image`,className:t.cn(`rounded-full aspect-square size-full object-cover`,e),...r}));o.displayName=i.Avatar.Image.displayName;var s=r.forwardRef(({className:e,...r},a)=>(0,n.jsx)(i.Avatar.Fallback,{ref:a,"data-slot":`avatar-fallback`,className:t.cn(`bg-muted text-muted-foreground rounded-full flex size-full items-center justify-center text-sm group-data-[size=sm]/avatar:text-xs`,e),...r}));s.displayName=i.Avatar.Fallback.displayName;function c({className:e,...r}){return(0,n.jsx)(`span`,{"data-slot":`avatar-badge`,className:t.cn(`bg-primary text-primary-foreground ring-background absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-blend-color ring-2 select-none`,`group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden`,`group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2`,`group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2`,e),...r})}function l({className:e,...r}){return(0,n.jsx)(`div`,{"data-slot":`avatar-group`,className:t.cn(`*:data-[slot=avatar]:ring-background group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2`,e),...r})}function u({className:e,...r}){return(0,n.jsx)(`div`,{"data-slot":`avatar-group-count`,className:t.cn(`bg-muted text-muted-foreground size-8 rounded-full text-sm group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3 ring-background relative flex shrink-0 items-center justify-center ring-2`,e),...r})}exports.Avatar=a,exports.AvatarBadge=c,exports.AvatarFallback=s,exports.AvatarGroup=l,exports.AvatarGroupCount=u,exports.AvatarImage=o;
+"use client";"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react/jsx-runtime"),r=require("react");r=e.__toESM(r,1);let i=require("@base-ui/react/avatar");function a({ref:e,className:r,size:a=`default`,...o}){return(0,n.jsx)(i.Avatar.Root,{ref:e,"data-slot":`avatar`,"data-size":a,className:t.cn(`size-8 rounded-full after:rounded-full data-[size=lg]:size-10 data-[size=sm]:size-6 after:border-border group/avatar relative flex shrink-0 select-none after:absolute after:inset-0 after:border after:mix-blend-darken dark:after:mix-blend-lighten`,r),...o})}a.displayName=i.Avatar.Root.displayName;function o({ref:e,className:r,...a}){return(0,n.jsx)(i.Avatar.Image,{ref:e,"data-slot":`avatar-image`,className:t.cn(`rounded-full aspect-square size-full object-cover`,r),...a})}o.displayName=i.Avatar.Image.displayName;function s({ref:e,className:r,...a}){return(0,n.jsx)(i.Avatar.Fallback,{ref:e,"data-slot":`avatar-fallback`,className:t.cn(`bg-muted text-muted-foreground rounded-full flex size-full items-center justify-center text-sm group-data-[size=sm]/avatar:text-xs`,r),...a})}s.displayName=i.Avatar.Fallback.displayName;function c({className:e,...r}){return(0,n.jsx)(`span`,{"data-slot":`avatar-badge`,className:t.cn(`bg-primary text-primary-foreground ring-background absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-blend-color ring-2 select-none`,`group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden`,`group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2`,`group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2`,e),...r})}function l({className:e,...r}){return(0,n.jsx)(`div`,{"data-slot":`avatar-group`,className:t.cn(`*:data-[slot=avatar]:ring-background group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2`,e),...r})}function u({className:e,...r}){return(0,n.jsx)(`div`,{"data-slot":`avatar-group-count`,className:t.cn(`bg-muted text-muted-foreground size-8 rounded-full text-sm group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3 ring-background relative flex shrink-0 items-center justify-center ring-2`,e),...r})}exports.Avatar=a,exports.AvatarBadge=c,exports.AvatarFallback=s,exports.AvatarGroup=l,exports.AvatarGroupCount=u,exports.AvatarImage=o;
 //# sourceMappingURL=avatar.cjs.map

package/dist/ui/components/ui/avatar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.cjs","names":["React","AvatarPrimitive","cn","require_runtime","require_ui_lib_utils","react_jsx_runtime","react","_base_ui_react_avatar","Avatar","props","size","className","AvatarImage","AvatarFallback","AvatarBadge","AvatarGroup","AvatarGroupCount"],"sources":["../../../../src/ui/components/ui/avatar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Avatar as AvatarPrimitive } from '@base-ui/react/avatar';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * Coordinates avatar image/fallback rendering and size styling.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling. Wrapper defaults: size='default'.\n * @returns The rendered Avatar composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place Image/Fallback/Badge inside Avatar. size defaults to default (size-8), with sm size-6 and lg size-10. AvatarGroupCount renders supplied children and does not calculate overflow or hide avatars. Supply meaningful image alt text. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AvatarGroup><Avatar><AvatarImage src=\"/avatar.png\" alt=\"Ada\" /><AvatarFallback>AD</AvatarFallback><AvatarBadge aria-label=\"Online\" /></Avatar><AvatarGroupCount>+2</AvatarGroupCount></AvatarGroup>);\n * }\n * ```\n */\nconst Avatar = React.forwardRef<\n  HTMLSpanElement,\n  AvatarPrimitive.Root.Props & { /**\n * Visual size preset; defaults to default unless the owning component states otherwise.\n */\n  /**\n   * Visual size preset; defaults to default unless the owning component states otherwise.\n   */\n  size?: 'default' | 'sm' | 'lg' }\n>(({ className, size = 'default', ...props }, ref) => (\n  <AvatarPrimitive.Root\n    ref={ref}\n    data-slot='avatar'\n    data-size={size}\n    className={cn(\n      'size-8 rounded-full after:rounded-full data-[size=lg]:size-10 data-[size=sm]:size-6 after:border-border group/avatar relative flex shrink-0 select-none after:absolute after:inset-0 after:border after:mix-blend-darken dark:after:mix-blend-lighten',\n      className,\n    )}\n    {...props}\n  />\n));\nAvatar.displayName = AvatarPrimitive.Root.displayName;\n\n/**\n * Renders the avatar image using Base UI loading behavior.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AvatarImage composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place Image/Fallback/Badge inside Avatar. size defaults to default (size-8), with sm size-6 and lg size-10. AvatarGroupCount renders supplied children and does not calculate overflow or hide avatars. Supply meaningful image alt text. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AvatarGroup><Avatar><AvatarImage src=\"/avatar.png\" alt=\"Ada\" /><AvatarFallback>AD</AvatarFallback><AvatarBadge aria-label=\"Online\" /></Avatar><AvatarGroupCount>+2</AvatarGroupCount></AvatarGroup>);\n * }\n * ```\n */\nconst AvatarImage = React.forwardRef<HTMLImageElement, AvatarPrimitive.Image.Props>(\n  ({ className, ...props }, ref) => (\n    <AvatarPrimitive.Image\n      ref={ref}\n      data-slot='avatar-image'\n      className={cn('rounded-full aspect-square size-full object-cover', className)}\n      {...props}\n    />\n  ),\n);\nAvatarImage.displayName = AvatarPrimitive.Image.displayName;\n\n/**\n * Renders replacement avatar content when the image is unavailable.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AvatarFallback composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place Image/Fallback/Badge inside Avatar. size defaults to default (size-8), with sm size-6 and lg size-10. AvatarGroupCount renders supplied children and does not calculate overflow or hide avatars. Supply meaningful image alt text. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AvatarGroup><Avatar><AvatarImage src=\"/avatar.png\" alt=\"Ada\" /><AvatarFallback>AD</AvatarFallback><AvatarBadge aria-label=\"Online\" /></Avatar><AvatarGroupCount>+2</AvatarGroupCount></AvatarGroup>);\n * }\n * ```\n */\nconst AvatarFallback = React.forwardRef<HTMLSpanElement, AvatarPrimitive.Fallback.Props>(\n  ({ className, ...props }, ref) => (\n    <AvatarPrimitive.Fallback\n      ref={ref}\n      data-slot='avatar-fallback'\n      className={cn(\n        'bg-muted text-muted-foreground rounded-full flex size-full items-center justify-center text-sm group-data-[size=sm]/avatar:text-xs',\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nAvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;\n\n/**\n * Positions a status indicator over the lower-right corner of an avatar.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AvatarBadge composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place Image/Fallback/Badge inside Avatar. size defaults to default (size-8), with sm size-6 and lg size-10. AvatarGroupCount renders supplied children and does not calculate overflow or hide avatars. Supply meaningful image alt text.\n * @example\n * ```tsx\n * import { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AvatarGroup><Avatar><AvatarImage src=\"/avatar.png\" alt=\"Ada\" /><AvatarFallback>AD</AvatarFallback><AvatarBadge aria-label=\"Online\" /></Avatar><AvatarGroupCount>+2</AvatarGroupCount></AvatarGroup>);\n * }\n * ```\n */\nfunction AvatarBadge({ className, ...props }: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot='avatar-badge'\n      className={cn(\n        'bg-primary text-primary-foreground ring-background absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-blend-color ring-2 select-none',\n        'group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden',\n        'group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2',\n        'group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Overlaps adjacent avatars with matching background rings.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AvatarGroup composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place Image/Fallback/Badge inside Avatar. size defaults to default (size-8), with sm size-6 and lg size-10. AvatarGroupCount renders supplied children and does not calculate overflow or hide avatars. Supply meaningful image alt text.\n * @example\n * ```tsx\n * import { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AvatarGroup><Avatar><AvatarImage src=\"/avatar.png\" alt=\"Ada\" /><AvatarFallback>AD</AvatarFallback><AvatarBadge aria-label=\"Online\" /></Avatar><AvatarGroupCount>+2</AvatarGroupCount></AvatarGroup>);\n * }\n * ```\n */\nfunction AvatarGroup({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='avatar-group'\n      className={cn(\n        '*:data-[slot=avatar]:ring-background group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Styles caller-provided overflow text after a group of avatars.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AvatarGroupCount composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place Image/Fallback/Badge inside Avatar. size defaults to default (size-8), with sm size-6 and lg size-10. AvatarGroupCount renders supplied children and does not calculate overflow or hide avatars. Supply meaningful image alt text.\n * @example\n * ```tsx\n * import { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AvatarGroup><Avatar><AvatarImage src=\"/avatar.png\" alt=\"Ada\" /><AvatarFallback>AD</AvatarFallback><AvatarBadge aria-label=\"Online\" /></Avatar><AvatarGroupCount>+2</AvatarGroupCount></AvatarGroup>);\n * }\n * ```\n */\nfunction AvatarGroupCount({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='avatar-group-count'\n      className={cn(\n        'bg-muted text-muted-foreground size-8 rounded-full text-sm group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3 ring-background relative flex shrink-0 items-center justify-center ring-2',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Avatar, AvatarImage, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarBadge };\n"],"mappings":"A,uSAsBA,IAAMQ,EAASR,EAAM,YASlB,CAAE,YAAW,OAAO,UAAW,GAAGS,GAAS,KAC5C,EAAAJ,EAAA,IAAA,CAACJ,EAAAA,OAAgB,KAAjB,CACO,MACL,YAAU,SACV,YAAWS,EACX,UAAWR,EAAAA,GACT,wPACAS,CACF,EACA,GAAIF,CACL,CAAA,CACF,EACD,EAAO,YAAcR,EAAAA,OAAgB,KAAK,YAiB1C,IAAMW,EAAcZ,EAAM,YACvB,CAAE,YAAW,GAAGS,GAAS,KACxB,EAAAJ,EAAA,IAAA,CAACJ,EAAAA,OAAgB,MAAjB,CACO,MACL,YAAU,eACV,UAAWC,EAAAA,GAAG,oDAAqDS,CAAS,EAC5E,GAAIF,CACL,CAAA,CAEL,EACA,EAAY,YAAcR,EAAAA,OAAgB,MAAM,YAiBhD,IAAMY,EAAiBb,EAAM,YAC1B,CAAE,YAAW,GAAGS,GAAS,KACxB,EAAAJ,EAAA,IAAA,CAACJ,EAAAA,OAAgB,SAAjB,CACO,MACL,YAAU,kBACV,UAAWC,EAAAA,GACT,qIACAS,CACF,EACA,GAAIF,CACL,CAAA,CAEL,EACA,EAAe,YAAcR,EAAAA,OAAgB,SAAS,YAiBtD,SAASa,EAAY,CAAE,YAAW,GAAGL,GAAuC,CAC1E,OACE,EAAAJ,EAAA,IAAA,CAAC,OAAD,CACE,YAAU,eACV,UAAWH,EAAAA,GACT,2KACA,gFACA,4FACA,gFACAS,CACF,EACA,GAAIF,CACL,CAAA,CAEL,CAiBA,SAASM,EAAY,CAAE,YAAW,GAAGN,GAAsC,CACzE,OACE,EAAAJ,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,eACV,UAAWH,EAAAA,GACT,sGACAS,CACF,EACA,GAAIF,CACL,CAAA,CAEL,CAiBA,SAASO,EAAiB,CAAE,YAAW,GAAGP,GAAsC,CAC9E,OACE,EAAAJ,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,qBACV,UAAWH,EAAAA,GACT,2VACAS,CACF,EACA,GAAIF,CACL,CAAA,CAEL,C"}
+{"version":3,"file":"avatar.cjs","names":["AvatarPrimitive","cn","require_runtime","require_ui_lib_utils","react_jsx_runtime","react","_base_ui_react_avatar","Avatar","props","size","className","AvatarImage","AvatarFallback","AvatarBadge","AvatarGroup","AvatarGroupCount"],"sources":["../../../../src/ui/components/ui/avatar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Avatar as AvatarPrimitive } from '@base-ui/react/avatar';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * Coordinates avatar image/fallback rendering and size styling.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling. Wrapper defaults: size='default'.\n * @returns The rendered Avatar composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place Image/Fallback/Badge inside Avatar. size defaults to default (size-8), with sm size-6 and lg size-10. AvatarGroupCount renders supplied children and does not calculate overflow or hide avatars. Supply meaningful image alt text. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AvatarGroup><Avatar><AvatarImage src=\"/avatar.png\" alt=\"Ada\" /><AvatarFallback>AD</AvatarFallback><AvatarBadge aria-label=\"Online\" /></Avatar><AvatarGroupCount>+2</AvatarGroupCount></AvatarGroup>);\n * }\n * ```\n */\nfunction Avatar({\n  ref,\n  className,\n  size = 'default',\n  ...props\n}: React.PropsWithoutRef<\n  AvatarPrimitive.Root.Props & {\n    /**\n     * Visual size preset; defaults to default unless the owning component states otherwise.\n     */\n    /**\n     * Visual size preset; defaults to default unless the owning component states otherwise.\n     */\n    size?: 'default' | 'sm' | 'lg';\n  }\n> &\n  React.RefAttributes<HTMLSpanElement>) {\n  return (\n    <AvatarPrimitive.Root\n      ref={ref}\n      data-slot='avatar'\n      data-size={size}\n      className={cn(\n        'size-8 rounded-full after:rounded-full data-[size=lg]:size-10 data-[size=sm]:size-6 after:border-border group/avatar relative flex shrink-0 select-none after:absolute after:inset-0 after:border after:mix-blend-darken dark:after:mix-blend-lighten',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\nAvatar.displayName = AvatarPrimitive.Root.displayName;\n\n/**\n * Renders the avatar image using Base UI loading behavior.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AvatarImage composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place Image/Fallback/Badge inside Avatar. size defaults to default (size-8), with sm size-6 and lg size-10. AvatarGroupCount renders supplied children and does not calculate overflow or hide avatars. Supply meaningful image alt text. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AvatarGroup><Avatar><AvatarImage src=\"/avatar.png\" alt=\"Ada\" /><AvatarFallback>AD</AvatarFallback><AvatarBadge aria-label=\"Online\" /></Avatar><AvatarGroupCount>+2</AvatarGroupCount></AvatarGroup>);\n * }\n * ```\n */\nfunction AvatarImage({\n  ref,\n  className,\n  ...props\n}: React.PropsWithoutRef<AvatarPrimitive.Image.Props> & React.RefAttributes<HTMLImageElement>) {\n  return (\n    <AvatarPrimitive.Image\n      ref={ref}\n      data-slot='avatar-image'\n      className={cn('rounded-full aspect-square size-full object-cover', className)}\n      {...props}\n    />\n  );\n}\nAvatarImage.displayName = AvatarPrimitive.Image.displayName;\n\n/**\n * Renders replacement avatar content when the image is unavailable.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AvatarFallback composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place Image/Fallback/Badge inside Avatar. size defaults to default (size-8), with sm size-6 and lg size-10. AvatarGroupCount renders supplied children and does not calculate overflow or hide avatars. Supply meaningful image alt text. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AvatarGroup><Avatar><AvatarImage src=\"/avatar.png\" alt=\"Ada\" /><AvatarFallback>AD</AvatarFallback><AvatarBadge aria-label=\"Online\" /></Avatar><AvatarGroupCount>+2</AvatarGroupCount></AvatarGroup>);\n * }\n * ```\n */\nfunction AvatarFallback({\n  ref,\n  className,\n  ...props\n}: React.PropsWithoutRef<AvatarPrimitive.Fallback.Props> & React.RefAttributes<HTMLSpanElement>) {\n  return (\n    <AvatarPrimitive.Fallback\n      ref={ref}\n      data-slot='avatar-fallback'\n      className={cn(\n        'bg-muted text-muted-foreground rounded-full flex size-full items-center justify-center text-sm group-data-[size=sm]/avatar:text-xs',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\nAvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;\n\n/**\n * Positions a status indicator over the lower-right corner of an avatar.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AvatarBadge composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place Image/Fallback/Badge inside Avatar. size defaults to default (size-8), with sm size-6 and lg size-10. AvatarGroupCount renders supplied children and does not calculate overflow or hide avatars. Supply meaningful image alt text.\n * @example\n * ```tsx\n * import { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AvatarGroup><Avatar><AvatarImage src=\"/avatar.png\" alt=\"Ada\" /><AvatarFallback>AD</AvatarFallback><AvatarBadge aria-label=\"Online\" /></Avatar><AvatarGroupCount>+2</AvatarGroupCount></AvatarGroup>);\n * }\n * ```\n */\nfunction AvatarBadge({ className, ...props }: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot='avatar-badge'\n      className={cn(\n        'bg-primary text-primary-foreground ring-background absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-blend-color ring-2 select-none',\n        'group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden',\n        'group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2',\n        'group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Overlaps adjacent avatars with matching background rings.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AvatarGroup composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place Image/Fallback/Badge inside Avatar. size defaults to default (size-8), with sm size-6 and lg size-10. AvatarGroupCount renders supplied children and does not calculate overflow or hide avatars. Supply meaningful image alt text.\n * @example\n * ```tsx\n * import { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AvatarGroup><Avatar><AvatarImage src=\"/avatar.png\" alt=\"Ada\" /><AvatarFallback>AD</AvatarFallback><AvatarBadge aria-label=\"Online\" /></Avatar><AvatarGroupCount>+2</AvatarGroupCount></AvatarGroup>);\n * }\n * ```\n */\nfunction AvatarGroup({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='avatar-group'\n      className={cn(\n        '*:data-[slot=avatar]:ring-background group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Styles caller-provided overflow text after a group of avatars.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered AvatarGroupCount composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place Image/Fallback/Badge inside Avatar. size defaults to default (size-8), with sm size-6 and lg size-10. AvatarGroupCount renders supplied children and does not calculate overflow or hide avatars. Supply meaningful image alt text.\n * @example\n * ```tsx\n * import { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<AvatarGroup><Avatar><AvatarImage src=\"/avatar.png\" alt=\"Ada\" /><AvatarFallback>AD</AvatarFallback><AvatarBadge aria-label=\"Online\" /></Avatar><AvatarGroupCount>+2</AvatarGroupCount></AvatarGroup>);\n * }\n * ```\n */\nfunction AvatarGroupCount({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='avatar-group-count'\n      className={cn(\n        'bg-muted text-muted-foreground size-8 rounded-full text-sm group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3 ring-background relative flex shrink-0 items-center justify-center ring-2',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Avatar, AvatarImage, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarBadge };\n"],"mappings":"A,uSAsBA,SAASO,EAAO,CACd,MACA,YACA,OAAO,UACP,GAAGC,GAYmC,CACtC,OACE,EAAAJ,EAAA,IAAA,CAACJ,EAAAA,OAAgB,KAAjB,CACO,MACL,YAAU,SACV,YAAWS,EACX,UAAWR,EAAAA,GACT,wPACAS,CACF,EACA,GAAIF,CACL,CAAA,CAEL,CACA,EAAO,YAAcR,EAAAA,OAAgB,KAAK,YAiB1C,SAASW,EAAY,CACnB,MACA,YACA,GAAGH,GAC0F,CAC7F,OACE,EAAAJ,EAAA,IAAA,CAACJ,EAAAA,OAAgB,MAAjB,CACO,MACL,YAAU,eACV,UAAWC,EAAAA,GAAG,oDAAqDS,CAAS,EAC5E,GAAIF,CACL,CAAA,CAEL,CACA,EAAY,YAAcR,EAAAA,OAAgB,MAAM,YAiBhD,SAASY,EAAe,CACtB,MACA,YACA,GAAGJ,GAC4F,CAC/F,OACE,EAAAJ,EAAA,IAAA,CAACJ,EAAAA,OAAgB,SAAjB,CACO,MACL,YAAU,kBACV,UAAWC,EAAAA,GACT,qIACAS,CACF,EACA,GAAIF,CACL,CAAA,CAEL,CACA,EAAe,YAAcR,EAAAA,OAAgB,SAAS,YAiBtD,SAASa,EAAY,CAAE,YAAW,GAAGL,GAAuC,CAC1E,OACE,EAAAJ,EAAA,IAAA,CAAC,OAAD,CACE,YAAU,eACV,UAAWH,EAAAA,GACT,2KACA,gFACA,4FACA,gFACAS,CACF,EACA,GAAIF,CACL,CAAA,CAEL,CAiBA,SAASM,EAAY,CAAE,YAAW,GAAGN,GAAsC,CACzE,OACE,EAAAJ,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,eACV,UAAWH,EAAAA,GACT,sGACAS,CACF,EACA,GAAIF,CACL,CAAA,CAEL,CAiBA,SAASO,EAAiB,CAAE,YAAW,GAAGP,GAAsC,CAC9E,OACE,EAAAJ,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,qBACV,UAAWH,EAAAA,GACT,2VACAS,CACF,EACA,GAAIF,CACL,CAAA,CAEL,C"}