@ngrok/mantle 0.23.2 → 0.24.1

package/dist/accordion.d.ts

@@ -2,7 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { ComponentPropsWithoutRef } from 'react';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
-import { a as IconProps } from './icon-D6P9AESZ.js';
+import { a as IconProps } from './icon-CS9xptlK.js';
 import './types-BuKAGhC-.js';
 
 declare const Accordion: react.ForwardRefExoticComponent<ComponentPropsWithoutRef<react.ForwardRefExoticComponent<(AccordionPrimitive.AccordionSingleProps | AccordionPrimitive.AccordionMultipleProps) & react.RefAttributes<HTMLDivElement>>> & react.RefAttributes<HTMLDivElement>>;

package/dist/accordion.js

@@ -1,2 +1,2 @@
-import{a as m}from"./chunk-DJGIRPRQ.js";import"./chunk-HDPLH5HC.js";import{a as r}from"./chunk-AZ56JGNY.js";import{CaretDown as g}from"@phosphor-icons/react/CaretDown";import*as o from"@radix-ui/react-accordion";import{forwardRef as c}from"react";import{jsx as n}from"react/jsx-runtime";var a=c(({className:e,...i},t)=>n(o.Root,{ref:t,className:r("w-full space-y-2.5",e),...i}));a.displayName="Accordion";var p=o.Item;p.displayName="AccordionItem";var s=c(({className:e,...i},t)=>n(o.Header,{ref:t,className:r("flex items-center gap-2",e),...i}));s.displayName="AccordionHeading";var f=c(({className:e,children:i,...t},d)=>n(o.Trigger,{ref:d,className:r("group flex items-center gap-1.5",e),...t,children:i}));f.displayName="AccordionTrigger";var l=({className:e,...i})=>n(m,{...i,svg:n(g,{weight:"fill"}),className:r("group-data-state-open:rotate-0 -rotate-90",e)}),A=c(({className:e,children:i,...t},d)=>n(o.Content,{ref:d,className:r("data-state-closed:animate-accordion-up data-state-open:animate-accordion-down overflow-hidden pt-4",e),...t,children:i}));A.displayName="AccordionContent";export{a as Accordion,A as AccordionContent,s as AccordionHeading,p as AccordionItem,f as AccordionTrigger,l as AccordionTriggerIcon};
+import{a as m}from"./chunk-7O36LG52.js";import"./chunk-HDPLH5HC.js";import{a as r}from"./chunk-AZ56JGNY.js";import{CaretDown as g}from"@phosphor-icons/react/CaretDown";import*as o from"@radix-ui/react-accordion";import{forwardRef as c}from"react";import{jsx as n}from"react/jsx-runtime";var a=c(({className:e,...i},t)=>n(o.Root,{ref:t,className:r("w-full space-y-2.5",e),...i}));a.displayName="Accordion";var p=o.Item;p.displayName="AccordionItem";var s=c(({className:e,...i},t)=>n(o.Header,{ref:t,className:r("flex items-center gap-2",e),...i}));s.displayName="AccordionHeading";var f=c(({className:e,children:i,...t},d)=>n(o.Trigger,{ref:d,className:r("group flex items-center gap-1.5",e),...t,children:i}));f.displayName="AccordionTrigger";var l=({className:e,...i})=>n(m,{...i,svg:n(g,{weight:"fill"}),className:r("group-data-state-open:rotate-0 -rotate-90",e)}),A=c(({className:e,children:i,...t},d)=>n(o.Content,{ref:d,className:r("data-state-closed:animate-accordion-up data-state-open:animate-accordion-down overflow-hidden pt-4",e),...t,children:i}));A.displayName="AccordionContent";export{a as Accordion,A as AccordionContent,s as AccordionHeading,p as AccordionItem,f as AccordionTrigger,l as AccordionTriggerIcon};
 //# sourceMappingURL=accordion.js.map

package/dist/alert-dialog.d.ts

@@ -5,6 +5,7 @@ import * as react from 'react';
 import { ComponentProps, ReactNode } from 'react';
 import * as _radix_ui_react_dialog from '@radix-ui/react-dialog';
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import { W as WithAsChild } from './as-child-DJ7x3JFV.js';
 import { R as Root } from './primitive-hud69IM9.js';
 import { S as SvgAttributes } from './types-BuKAGhC-.js';
 
@@ -18,7 +19,41 @@ type AlertDialogProps = ComponentProps<typeof Root> & {
     priority: Priority;
 };
 /**
- * The root component for the Alert Dialog
+ * A modal dialog that interrupts the user with important content and expects a
+ * response.
+ * The root stateful component for the Alert Dialog.
+ *
+ * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog
+ *
+ * @example
+ * ```tsx
+ * <AlertDialog priority="danger">
+ *   <AlertDialogTrigger asChild>
+ *     <Button type="button" appearance="outlined">
+ *       Show Danger Alert Dialog
+ *     </Button>
+ *   </AlertDialogTrigger>
+ *   <AlertDialogContent>
+ *     <AlertDialogIcon />
+ *     <AlertDialogBody>
+ *       <AlertDialogHeader>
+ *         <AlertDialogTitle>
+ *           Are you absolutely sure?
+ *         </AlertDialogTitle>
+ *         <AlertDialogDescription>
+ *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.
+ *         </AlertDialogDescription>
+ *       </AlertDialogHeader>
+ *       <AlertDialogFooter>
+ *         <AlertDialogCancel type="button">Cancel</AlertDialogCancel>
+ *         <AlertDialogAction type="button">
+ *           Continue
+ *         </AlertDialogAction>
+ *       </AlertDialogFooter>
+ *   	</AlertDialogBody>
+ *   </AlertDialogContent>
+ * </AlertDialog>
+ * ```
  */
 declare function AlertDialog({ priority, ...props }: AlertDialogProps): react_jsx_runtime.JSX.Element;
 declare namespace AlertDialog {
@@ -26,40 +61,223 @@ declare namespace AlertDialog {
 }
 /**
  * A button that opens the Alert Dialog.
+ *
+ * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-trigger
+ *
+ * @example
+ * ```tsx
+ * <AlertDialog priority="danger">
+ *   <AlertDialogTrigger asChild>
+ *     <Button type="button" appearance="outlined">
+ *       Show Danger Alert Dialog
+ *     </Button>
+ *   </AlertDialogTrigger>
+ *   <AlertDialogContent>
+ *     <AlertDialogIcon />
+ *     <AlertDialogBody>
+ *       <AlertDialogHeader>
+ *         <AlertDialogTitle>
+ *           Are you absolutely sure?
+ *         </AlertDialogTitle>
+ *         <AlertDialogDescription>
+ *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.
+ *         </AlertDialogDescription>
+ *       </AlertDialogHeader>
+ *       <AlertDialogFooter>
+ *         <AlertDialogCancel type="button">Cancel</AlertDialogCancel>
+ *         <AlertDialogAction type="button">
+ *           Continue
+ *         </AlertDialogAction>
+ *       </AlertDialogFooter>
+ *   	</AlertDialogBody>
+ *   </AlertDialogContent>
+ * </AlertDialog>
+ * ```
  */
 declare const AlertDialogTrigger: react.ForwardRefExoticComponent<_radix_ui_react_dialog.DialogTriggerProps & react.RefAttributes<HTMLButtonElement>>;
 /**
  * The popover alert dialog container.
  *
  * Renders on top of the overlay and is centered in the viewport.
+ *
+ * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-content
+ *
+ * @example
+ * ```tsx
+ * <AlertDialog priority="danger">
+ *   <AlertDialogTrigger asChild>
+ *     <Button type="button" appearance="outlined">
+ *       Show Danger Alert Dialog
+ *     </Button>
+ *   </AlertDialogTrigger>
+ *   <AlertDialogContent>
+ *     <AlertDialogIcon />
+ *     <AlertDialogBody>
+ *       <AlertDialogHeader>
+ *         <AlertDialogTitle>
+ *           Are you absolutely sure?
+ *         </AlertDialogTitle>
+ *         <AlertDialogDescription>
+ *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.
+ *         </AlertDialogDescription>
+ *       </AlertDialogHeader>
+ *       <AlertDialogFooter>
+ *         <AlertDialogCancel type="button">Cancel</AlertDialogCancel>
+ *         <AlertDialogAction type="button">
+ *           Continue
+ *         </AlertDialogAction>
+ *       </AlertDialogFooter>
+ *   	</AlertDialogBody>
+ *   </AlertDialogContent>
+ * </AlertDialog>
+ * ```
  */
 declare const AlertDialogContent: react.ForwardRefExoticComponent<Omit<Omit<_radix_ui_react_dialog.DialogContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
 /**
- * Contains the main content of the dialog.
+ * Contains the main content of the alert dialog.
+ *
+ * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-body
+ *
+ * @example
+ * ```tsx
+ * <AlertDialog priority="danger">
+ *   <AlertDialogTrigger asChild>
+ *     <Button type="button" appearance="outlined">
+ *       Show Danger Alert Dialog
+ *     </Button>
+ *   </AlertDialogTrigger>
+ *   <AlertDialogContent>
+ *     <AlertDialogIcon />
+ *     <AlertDialogBody>
+ *       <AlertDialogHeader>
+ *         <AlertDialogTitle>
+ *           Are you absolutely sure?
+ *         </AlertDialogTitle>
+ *         <AlertDialogDescription>
+ *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.
+ *         </AlertDialogDescription>
+ *       </AlertDialogHeader>
+ *       <AlertDialogFooter>
+ *         <AlertDialogCancel type="button">Cancel</AlertDialogCancel>
+ *         <AlertDialogAction type="button">
+ *           Continue
+ *         </AlertDialogAction>
+ *       </AlertDialogFooter>
+ *   	</AlertDialogBody>
+ *   </AlertDialogContent>
+ * </AlertDialog>
+ * ```
  */
-declare const AlertDialogBody: {
-    ({ className, ...props }: ComponentProps<"div">): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
+declare const AlertDialogBody: react.ForwardRefExoticComponent<Omit<react.ClassAttributes<HTMLDivElement> & react.HTMLAttributes<HTMLDivElement> & WithAsChild, "ref"> & react.RefAttributes<HTMLDivElement>>;
 /**
  * Contains the header content of the dialog, including the title and description.
+ *
+ * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-header
+ *
+ * @example
+ * ```tsx
+ * <AlertDialog priority="danger">
+ *   <AlertDialogTrigger asChild>
+ *     <Button type="button" appearance="outlined">
+ *       Show Danger Alert Dialog
+ *     </Button>
+ *   </AlertDialogTrigger>
+ *   <AlertDialogContent>
+ *     <AlertDialogIcon />
+ *     <AlertDialogBody>
+ *       <AlertDialogHeader>
+ *         <AlertDialogTitle>
+ *           Are you absolutely sure?
+ *         </AlertDialogTitle>
+ *         <AlertDialogDescription>
+ *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.
+ *         </AlertDialogDescription>
+ *       </AlertDialogHeader>
+ *       <AlertDialogFooter>
+ *         <AlertDialogCancel type="button">Cancel</AlertDialogCancel>
+ *         <AlertDialogAction type="button">
+ *           Continue
+ *         </AlertDialogAction>
+ *       </AlertDialogFooter>
+ *   	</AlertDialogBody>
+ *   </AlertDialogContent>
+ * </AlertDialog>
+ * ```
  */
-declare const AlertDialogHeader: {
-    ({ className, ...props }: ComponentProps<"div">): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
+declare const AlertDialogHeader: react.ForwardRefExoticComponent<Omit<react.ClassAttributes<HTMLDivElement> & react.HTMLAttributes<HTMLDivElement> & WithAsChild, "ref"> & react.RefAttributes<HTMLDivElement>>;
 /**
  * Contains the footer content of the dialog, including the action and cancel buttons.
+ *
+ * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-footer
+ *
+ * @example
+ * ```tsx
+ * <AlertDialog priority="danger">
+ *   <AlertDialogTrigger asChild>
+ *     <Button type="button" appearance="outlined">
+ *       Show Danger Alert Dialog
+ *     </Button>
+ *   </AlertDialogTrigger>
+ *   <AlertDialogContent>
+ *     <AlertDialogIcon />
+ *     <AlertDialogBody>
+ *       <AlertDialogHeader>
+ *         <AlertDialogTitle>
+ *           Are you absolutely sure?
+ *         </AlertDialogTitle>
+ *         <AlertDialogDescription>
+ *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.
+ *         </AlertDialogDescription>
+ *       </AlertDialogHeader>
+ *       <AlertDialogFooter>
+ *         <AlertDialogCancel type="button">Cancel</AlertDialogCancel>
+ *         <AlertDialogAction type="button">
+ *           Continue
+ *         </AlertDialogAction>
+ *       </AlertDialogFooter>
+ *   	</AlertDialogBody>
+ *   </AlertDialogContent>
+ * </AlertDialog>
+ * ```
  */
-declare const AlertDialogFooter: {
-    ({ className, ...props }: ComponentProps<"div">): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
+declare const AlertDialogFooter: react.ForwardRefExoticComponent<Omit<react.ClassAttributes<HTMLDivElement> & react.HTMLAttributes<HTMLDivElement> & WithAsChild, "ref"> & react.RefAttributes<HTMLDivElement>>;
 /**
  * An accessible name to be announced when the dialog is opened.
  *
  * Alternatively, you can provide `aria-label` or `aria-labelledby` to
  * `AlertDialogContent` and exclude this component.
+ *
+ * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-title
+ *
+ * @example
+ * ```tsx
+ * <AlertDialog priority="danger">
+ *   <AlertDialogTrigger asChild>
+ *     <Button type="button" appearance="outlined">
+ *       Show Danger Alert Dialog
+ *     </Button>
+ *   </AlertDialogTrigger>
+ *   <AlertDialogContent>
+ *     <AlertDialogIcon />
+ *     <AlertDialogBody>
+ *       <AlertDialogHeader>
+ *         <AlertDialogTitle>
+ *           Are you absolutely sure?
+ *         </AlertDialogTitle>
+ *         <AlertDialogDescription>
+ *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.
+ *         </AlertDialogDescription>
+ *       </AlertDialogHeader>
+ *       <AlertDialogFooter>
+ *         <AlertDialogCancel type="button">Cancel</AlertDialogCancel>
+ *         <AlertDialogAction type="button">
+ *           Continue
+ *         </AlertDialogAction>
+ *       </AlertDialogFooter>
+ *   	</AlertDialogBody>
+ *   </AlertDialogContent>
+ * </AlertDialog>
+ * ```
  */
 declare const AlertDialogTitle: react.ForwardRefExoticComponent<Omit<_radix_ui_react_dialog.DialogTitleProps & react.RefAttributes<HTMLHeadingElement>, "ref"> & react.RefAttributes<HTMLHeadingElement>>;
 /**
@@ -67,6 +285,38 @@ declare const AlertDialogTitle: react.ForwardRefExoticComponent<Omit<_radix_ui_r
  *
  * Alternatively, you can provide `aria-describedby` to `AlertDialogContent` and
  * exclude this component.
+ *
+ * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-description
+ *
+ * @example
+ * ```tsx
+ * <AlertDialog priority="danger">
+ *   <AlertDialogTrigger asChild>
+ *     <Button type="button" appearance="outlined">
+ *       Show Danger Alert Dialog
+ *     </Button>
+ *   </AlertDialogTrigger>
+ *   <AlertDialogContent>
+ *     <AlertDialogIcon />
+ *     <AlertDialogBody>
+ *       <AlertDialogHeader>
+ *         <AlertDialogTitle>
+ *           Are you absolutely sure?
+ *         </AlertDialogTitle>
+ *         <AlertDialogDescription>
+ *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.
+ *         </AlertDialogDescription>
+ *       </AlertDialogHeader>
+ *       <AlertDialogFooter>
+ *         <AlertDialogCancel type="button">Cancel</AlertDialogCancel>
+ *         <AlertDialogAction type="button">
+ *           Continue
+ *         </AlertDialogAction>
+ *       </AlertDialogFooter>
+ *   	</AlertDialogBody>
+ *   </AlertDialogContent>
+ * </AlertDialog>
+ * ```
  */
 declare const AlertDialogDescription: react.ForwardRefExoticComponent<Omit<Omit<_radix_ui_react_dialog.DialogDescriptionProps & react.RefAttributes<HTMLParagraphElement>, "ref"> & react.RefAttributes<HTMLParagraphElement>, "ref"> & react.RefAttributes<HTMLParagraphElement>>;
 /**
@@ -77,6 +327,38 @@ declare const AlertDialogDescription: react.ForwardRefExoticComponent<Omit<Omit<
  * These buttons should be distinguished visually from the AlertDialogCancel button.
  *
  * Composes around the mantle Button component.
+ *
+ * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-action
+ *
+ * @example
+ * ```tsx
+ * <AlertDialog priority="danger">
+ *   <AlertDialogTrigger asChild>
+ *     <Button type="button" appearance="outlined">
+ *       Show Danger Alert Dialog
+ *     </Button>
+ *   </AlertDialogTrigger>
+ *   <AlertDialogContent>
+ *     <AlertDialogIcon />
+ *     <AlertDialogBody>
+ *       <AlertDialogHeader>
+ *         <AlertDialogTitle>
+ *           Are you absolutely sure?
+ *         </AlertDialogTitle>
+ *         <AlertDialogDescription>
+ *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.
+ *         </AlertDialogDescription>
+ *       </AlertDialogHeader>
+ *       <AlertDialogFooter>
+ *         <AlertDialogCancel type="button">Cancel</AlertDialogCancel>
+ *         <AlertDialogAction type="button">
+ *           Continue
+ *         </AlertDialogAction>
+ *       </AlertDialogFooter>
+ *   	</AlertDialogBody>
+ *   </AlertDialogContent>
+ * </AlertDialog>
+ * ```
  */
 declare const AlertDialogAction: react.ForwardRefExoticComponent<(Omit<react.ClassAttributes<HTMLButtonElement> & react.ButtonHTMLAttributes<HTMLButtonElement> & Partial<DeepNonNullable<class_variance_authority.VariantProps<(props?: ({
     appearance?: "link" | "filled" | "ghost" | "outlined" | null | undefined;
@@ -106,6 +388,38 @@ declare const AlertDialogAction: react.ForwardRefExoticComponent<(Omit<react.Cla
  * This button should be distinguished visually from AlertDialogAction buttons.
  *
  * Composes around the mantle Button component.
+ *
+ * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-cancel
+ *
+ * @example
+ * ```tsx
+ * <AlertDialog priority="danger">
+ *   <AlertDialogTrigger asChild>
+ *     <Button type="button" appearance="outlined">
+ *       Show Danger Alert Dialog
+ *     </Button>
+ *   </AlertDialogTrigger>
+ *   <AlertDialogContent>
+ *     <AlertDialogIcon />
+ *     <AlertDialogBody>
+ *       <AlertDialogHeader>
+ *         <AlertDialogTitle>
+ *           Are you absolutely sure?
+ *         </AlertDialogTitle>
+ *         <AlertDialogDescription>
+ *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.
+ *         </AlertDialogDescription>
+ *       </AlertDialogHeader>
+ *       <AlertDialogFooter>
+ *         <AlertDialogCancel type="button">Cancel</AlertDialogCancel>
+ *         <AlertDialogAction type="button">
+ *           Continue
+ *         </AlertDialogAction>
+ *       </AlertDialogFooter>
+ *   	</AlertDialogBody>
+ *   </AlertDialogContent>
+ * </AlertDialog>
+ * ```
  */
 declare const AlertDialogCancel: react.ForwardRefExoticComponent<(Omit<react.ClassAttributes<HTMLButtonElement> & react.ButtonHTMLAttributes<HTMLButtonElement> & Partial<DeepNonNullable<class_variance_authority.VariantProps<(props?: ({
     appearance?: "link" | "filled" | "ghost" | "outlined" | null | undefined;
@@ -138,10 +452,55 @@ type AlertDialogIconProps = Omit<SvgAttributes, "children"> & {
  * priority with the appropriate color.
  *
  * Can be overridden with a custom icon using the `svg` prop.
+ *
+ * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-icon
+ *
+ * @example
+ * ```tsx
+ * <AlertDialog priority="danger">
+ *   <AlertDialogTrigger asChild>
+ *     <Button type="button" appearance="outlined">
+ *       Show Danger Alert Dialog
+ *     </Button>
+ *   </AlertDialogTrigger>
+ *   <AlertDialogContent>
+ *     <AlertDialogIcon />
+ *     <AlertDialogBody>
+ *       <AlertDialogHeader>
+ *         <AlertDialogTitle>
+ *           Are you absolutely sure?
+ *         </AlertDialogTitle>
+ *         <AlertDialogDescription>
+ *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.
+ *         </AlertDialogDescription>
+ *       </AlertDialogHeader>
+ *       <AlertDialogFooter>
+ *         <AlertDialogCancel type="button">Cancel</AlertDialogCancel>
+ *         <AlertDialogAction type="button">
+ *           Continue
+ *         </AlertDialogAction>
+ *       </AlertDialogFooter>
+ *   	</AlertDialogBody>
+ *   </AlertDialogContent>
+ * </AlertDialog>
+ * ```
  */
 declare const AlertDialogIcon: react.ForwardRefExoticComponent<Omit<AlertDialogIconProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
 /**
  * A button that closes the Alert Dialog. (Unstyled)
+ *
+ * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-close
+ *
+ * @example
+ * ```tsx
+ * <AlertDialogClose asChild>
+ *   <AlertDialogAction
+ *   	type="button"
+ *   	onClick={() => doThing()}
+ *   >
+ *   	Do thing and close
+ *   </AlertDialogAction>
+ * </AlertDialogClose>
  */
 declare const AlertDialogClose: react.ForwardRefExoticComponent<_radix_ui_react_dialog.DialogCloseProps & react.RefAttributes<HTMLButtonElement>>;
 

package/dist/alert-dialog.js

@@ -1,2 +1,2 @@
-import{a as d,b as f,c as D,d as p,e as A,f as y,g as u,h as P}from"./chunk-PBARMKNJ.js";import{g}from"./chunk-5WFRLY2G.js";import"./chunk-DOTYPWKO.js";import"./chunk-D3XF6J5A.js";import{b as m}from"./chunk-PJLA4NRO.js";import"./chunk-4LSFAAZW.js";import"./chunk-3C5O3AQA.js";import"./chunk-72TJUKMV.js";import"./chunk-DJGIRPRQ.js";import{a as c}from"./chunk-HDPLH5HC.js";import{a as r}from"./chunk-AZ56JGNY.js";import{Info as F}from"@phosphor-icons/react/Info";import{Warning as H}from"@phosphor-icons/react/Warning";import{createContext as S,forwardRef as s,useContext as V,useMemo as j}from"react";import k from"tiny-invariant";import{jsx as o,jsxs as G}from"react/jsx-runtime";var v=S(null);function C(){let t=V(v);return k(t,"AlertDialog child component used outside of AlertDialog parent!"),t}function x({priority:t,...e}){let i=j(()=>({priority:t}),[t]);return o(v.Provider,{value:i,children:o(d,{...e})})}x.displayName="AlertDialog";var M=f,q=D,N=s(({className:t,...e},i)=>o(A,{className:r("data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 bg-overlay fixed inset-0 z-50 backdrop-blur-sm",t),...e,ref:i}));N.displayName="AlertDialogOverlay";var R=s(({className:t,onInteractOutside:e,onPointerDownOutside:i,...a},l)=>G(q,{children:[o(N,{}),o("div",{className:"fixed inset-4 z-50 flex items-center justify-center",children:o(y,{ref:l,className:r("flex w-full max-w-md flex-1 flex-col items-center gap-4 sm:flex-row sm:items-start","outline-none focus-within:outline-none","p-6","border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200","data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95",t),onInteractOutside:n=>{g(n),e?.(n)},onPointerDownOutside:n=>{g(n),i?.(n)},...a})})]}));R.displayName="AlertDialogContent";var b=({className:t,...e})=>o("div",{className:r("flex-1 space-y-4",t),...e});b.displayName="AlertDialogBody";var h=({className:t,...e})=>o("div",{className:r("flex flex-col space-y-2 text-center sm:text-start",t),...e});h.displayName="AlertDialogHeader";var O=({className:t,...e})=>o("div",{className:r("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",t),...e});O.displayName="AlertDialogFooter";var B=s(({className:t,...e},i)=>o(u,{ref:i,className:r("text-strong text-center text-lg font-medium sm:text-start",t),...e}));B.displayName="AlertDialogTitle";var I=s(({className:t,...e},i)=>o(P,{ref:i,className:r("text-body text-center text-sm font-normal sm:text-start",t),...e}));I.displayName="AlertDialogDescription";var T=s(({appearance:t="filled",...e},i)=>{let a=C(),l="default";return a.priority==="danger"&&(l="danger"),o(m,{appearance:t,priority:l,ref:i,...e})});T.displayName="AlertDialogAction";var w=s(({appearance:t="outlined",className:e,priority:i="neutral",...a},l)=>o(p,{asChild:!0,children:o(m,{appearance:t,className:r("mt-2 sm:mt-0",e),priority:i,ref:l,...a})}));w.displayName="AlertDialogCancel";var z=s(({className:t,svg:e,...i},a)=>{let l=C(),n=l.priority==="danger"?"text-danger-600":"text-accent-600",W=l.priority==="danger"?o(H,{}):o(F,{});return o(c,{ref:a,className:r("size-12 sm:size-7",n,t),svg:e??W,...i})});z.displayName="AlertDialogIcon";var E=p;export{x as AlertDialog,T as AlertDialogAction,b as AlertDialogBody,w as AlertDialogCancel,E as AlertDialogClose,R as AlertDialogContent,I as AlertDialogDescription,O as AlertDialogFooter,h as AlertDialogHeader,z as AlertDialogIcon,B as AlertDialogTitle,M as AlertDialogTrigger};
+import{a as f,b as A,c as D,d as p,e as y,f as u,g as C,h as P}from"./chunk-PBARMKNJ.js";import{g}from"./chunk-ATNIDU3M.js";import"./chunk-DOTYPWKO.js";import"./chunk-D3XF6J5A.js";import{b as m}from"./chunk-J3NVDJIE.js";import"./chunk-4LSFAAZW.js";import"./chunk-3C5O3AQA.js";import"./chunk-72TJUKMV.js";import"./chunk-7O36LG52.js";import{a as d}from"./chunk-HDPLH5HC.js";import{a}from"./chunk-AZ56JGNY.js";import{Info as j}from"@phosphor-icons/react/Info";import{Warning as F}from"@phosphor-icons/react/Warning";import{Slot as c}from"@radix-ui/react-slot";import{createContext as H,forwardRef as n,useContext as V,useMemo as k}from"react";import M from"tiny-invariant";import{jsx as i,jsxs as J}from"react/jsx-runtime";var v=H(null);function x(){let t=V(v);return M(t,"AlertDialog child component used outside of AlertDialog parent!"),t}function N({priority:t,...e}){let o=k(()=>({priority:t}),[t]);return i(v.Provider,{value:o,children:i(f,{...e})})}N.displayName="AlertDialog";var q=A,E=D,R=n(({className:t,...e},o)=>i(y,{className:a("data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 bg-overlay fixed inset-0 z-50 backdrop-blur-sm",t),...e,ref:o}));R.displayName="AlertDialogOverlay";var h=n(({className:t,onInteractOutside:e,onPointerDownOutside:o,...l},r)=>J(E,{children:[i(R,{}),i("div",{className:"fixed inset-4 z-50 flex items-center justify-center",children:i(u,{ref:r,className:a("flex w-full max-w-md flex-1 flex-col items-center gap-4 sm:flex-row sm:items-start","outline-none focus-within:outline-none","p-6","border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200","data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95",t),onInteractOutside:s=>{g(s),e?.(s)},onPointerDownOutside:s=>{g(s),o?.(s)},...l})})]}));h.displayName="AlertDialogContent";var b=n(({asChild:t=!1,className:e,...o},l)=>i(t?c:"div",{className:a("flex-1 space-y-4",e),ref:l,...o}));b.displayName="AlertDialogBody";var O=n(({asChild:t=!1,className:e,...o},l)=>i(t?c:"div",{className:a("flex flex-col space-y-2 text-center sm:text-start",e),...o}));O.displayName="AlertDialogHeader";var W=n(({asChild:t=!1,className:e,...o},l)=>i(t?c:"div",{className:a("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",e),...o}));W.displayName="AlertDialogFooter";var B=n(({className:t,...e},o)=>i(C,{ref:o,className:a("text-strong text-center text-lg font-medium sm:text-start",t),...e}));B.displayName="AlertDialogTitle";var I=n(({className:t,...e},o)=>i(P,{ref:o,className:a("text-body text-center text-sm font-normal sm:text-start",t),...e}));I.displayName="AlertDialogDescription";var T=n(({appearance:t="filled",...e},o)=>{let l=x(),r="default";return l.priority==="danger"&&(r="danger"),i(m,{appearance:t,priority:r,ref:o,...e})});T.displayName="AlertDialogAction";var w=n(({appearance:t="outlined",className:e,priority:o="neutral",...l},r)=>i(p,{asChild:!0,children:i(m,{appearance:t,className:a("mt-2 sm:mt-0",e),priority:o,ref:r,...l})}));w.displayName="AlertDialogCancel";var z=n(({className:t,svg:e,...o},l)=>{let r=x(),s=r.priority==="danger"?"text-danger-600":"text-accent-600",S=r.priority==="danger"?i(F,{}):i(j,{});return i(d,{ref:l,className:a("size-12 sm:size-7",s,t),svg:e??S,...o})});z.displayName="AlertDialogIcon";var G=p;export{N as AlertDialog,T as AlertDialogAction,b as AlertDialogBody,w as AlertDialogCancel,G as AlertDialogClose,h as AlertDialogContent,I as AlertDialogDescription,W as AlertDialogFooter,O as AlertDialogHeader,z as AlertDialogIcon,B as AlertDialogTitle,q as AlertDialogTrigger};
 //# sourceMappingURL=alert-dialog.js.map

package/dist/alert-dialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/alert-dialog/alert-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport { Info } from \"@phosphor-icons/react/Info\";\nimport { Warning } from \"@phosphor-icons/react/Warning\";\nimport {\n\ttype ComponentProps,\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\ttype ReactNode,\n\tcreateContext,\n\tforwardRef,\n\tuseContext,\n\tuseMemo,\n} from \"react\";\nimport invariant from \"tiny-invariant\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport {\n\tButton,\n\ttype ButtonPriority,\n\ttype ButtonProps,\n} from \"../button/button.js\";\nimport * as AlertDialogPrimitive from \"../dialog/primitive.js\";\nimport { SvgOnly } from \"../icon/svg-only.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\nimport { preventCloseOnPromptInteraction } from \"../toast/toast.js\";\n\nconst priorities = [\"info\", \"danger\"] as const;\ntype Priority = (typeof priorities)[number];\n\ntype AlertDialogContextValue = {\n\tpriority: Priority;\n};\n\nconst AlertDialogContext = createContext<AlertDialogContextValue | null>(null);\n\nfunction useAlertDialogContext() {\n\tconst context = useContext(AlertDialogContext);\n\tinvariant(\n\t\tcontext,\n\t\t\"AlertDialog child component used outside of AlertDialog parent!\",\n\t);\n\treturn context;\n}\n\ntype AlertDialogProps = ComponentProps<typeof AlertDialogPrimitive.Root> & {\n\t/**\n\t * Indicates the importance or impact level of the AlertDialog, affecting its\n\t * color and styling to communicate its purpose to the user.\n\t */\n\tpriority: Priority;\n};\n\n/**\n * The root component for the Alert Dialog\n */\nfunction AlertDialog({ priority, ...props }: AlertDialogProps) {\n\tconst context: AlertDialogContextValue = useMemo(\n\t\t() => ({ priority }),\n\t\t[priority],\n\t);\n\n\treturn (\n\t\t<AlertDialogContext.Provider value={context}>\n\t\t\t<AlertDialogPrimitive.Root {...props} />\n\t\t</AlertDialogContext.Provider>\n\t);\n}\nAlertDialog.displayName = \"AlertDialog\";\n\n/**\n * A button that opens the Alert Dialog.\n */\nconst AlertDialogTrigger = AlertDialogPrimitive.Trigger;\n\nconst AlertDialogPortal = AlertDialogPrimitive.Portal;\n\n/**\n * A layer that covers the inert portion of the view when the dialog is open.\n */\nconst AlertDialogOverlay = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Overlay>,\n\tComponentPropsWithoutRef<typeof AlertDialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Overlay\n\t\tclassName={cx(\n\t\t\t\"data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 bg-overlay fixed inset-0 z-50 backdrop-blur-sm\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t\tref={ref}\n\t/>\n));\nAlertDialogOverlay.displayName = \"AlertDialogOverlay\";\n\n/**\n * The popover alert dialog container.\n *\n * Renders on top of the overlay and is centered in the viewport.\n */\nconst AlertDialogContent = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Content>,\n\tComponentPropsWithoutRef<typeof AlertDialogPrimitive.Content>\n>(({ className, onInteractOutside, onPointerDownOutside, ...props }, ref) => (\n\t<AlertDialogPortal>\n\t\t<AlertDialogOverlay />\n\t\t<div className=\"fixed inset-4 z-50 flex items-center justify-center\">\n\t\t\t<AlertDialogPrimitive.Content\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"flex w-full max-w-md flex-1 flex-col items-center gap-4 sm:flex-row sm:items-start\",\n\t\t\t\t\t\"outline-none focus-within:outline-none\",\n\t\t\t\t\t\"p-6\",\n\t\t\t\t\t\"border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200\",\n\t\t\t\t\t\"data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tonInteractOutside={(event) => {\n\t\t\t\t\tpreventCloseOnPromptInteraction(event);\n\t\t\t\t\tonInteractOutside?.(event);\n\t\t\t\t}}\n\t\t\t\tonPointerDownOutside={(event) => {\n\t\t\t\t\tpreventCloseOnPromptInteraction(event);\n\t\t\t\t\tonPointerDownOutside?.(event);\n\t\t\t\t}}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</div>\n\t</AlertDialogPortal>\n));\nAlertDialogContent.displayName = \"AlertDialogContent\";\n\n/**\n * Contains the main content of the dialog.\n */\nconst AlertDialogBody = ({ className, ...props }: ComponentProps<\"div\">) => (\n\t<div className={cx(\"flex-1 space-y-4\", className)} {...props} />\n);\nAlertDialogBody.displayName = \"AlertDialogBody\";\n\n/**\n * Contains the header content of the dialog, including the title and description.\n */\nconst AlertDialogHeader = ({ className, ...props }: ComponentProps<\"div\">) => (\n\t<div\n\t\tclassName={cx(\n\t\t\t\"flex flex-col space-y-2 text-center sm:text-start\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\nAlertDialogHeader.displayName = \"AlertDialogHeader\";\n\n/**\n * Contains the footer content of the dialog, including the action and cancel buttons.\n */\nconst AlertDialogFooter = ({ className, ...props }: ComponentProps<\"div\">) => (\n\t<div\n\t\tclassName={cx(\n\t\t\t\"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\nAlertDialogFooter.displayName = \"AlertDialogFooter\";\n\n/**\n * An accessible name to be announced when the dialog is opened.\n *\n * Alternatively, you can provide `aria-label` or `aria-labelledby` to\n * `AlertDialogContent` and exclude this component.\n */\nconst AlertDialogTitle = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Title>,\n\tComponentPropsWithoutRef<typeof AlertDialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"text-strong text-center text-lg font-medium sm:text-start\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nAlertDialogTitle.displayName = \"AlertDialogTitle\";\n\n/**\n * An accessible description to be announced when the dialog is opened.\n *\n * Alternatively, you can provide `aria-describedby` to `AlertDialogContent` and\n * exclude this component.\n */\nconst AlertDialogDescription = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Description>,\n\tComponentPropsWithoutRef<typeof AlertDialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"text-body text-center text-sm font-normal sm:text-start\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nAlertDialogDescription.displayName = \"AlertDialogDescription\";\n\n/**\n * A button that confirms the Alert Dialog action.\n * Will default to appearance=\"filled\", as well as the priority color from the `AlertDialog`.\n * Does not close the alert dialog by default.\n *\n * These buttons should be distinguished visually from the AlertDialogCancel button.\n *\n * Composes around the mantle Button component.\n */\nconst AlertDialogAction = forwardRef<ComponentRef<\"button\">, ButtonProps>(\n\t(\n\t\t{\n\t\t\t//,\n\t\t\tappearance = \"filled\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst ctx = useAlertDialogContext();\n\t\tlet buttonPriority: NonNullable<ButtonPriority> = \"default\";\n\t\tif (ctx.priority === \"danger\") {\n\t\t\tbuttonPriority = \"danger\";\n\t\t}\n\n\t\treturn (\n\t\t\t<Button\n\t\t\t\t//\n\t\t\t\tappearance={appearance}\n\t\t\t\tpriority={buttonPriority}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nAlertDialogAction.displayName = \"AlertDialogAction\";\n\n/**\n * A button that closes the dialog and cancels the action.\n * Will default to appearance=\"outlined\" and priority=\"neutral\".\n *\n * This button should be distinguished visually from AlertDialogAction buttons.\n *\n * Composes around the mantle Button component.\n */\nconst AlertDialogCancel = forwardRef<ComponentRef<\"button\">, ButtonProps>(\n\t(\n\t\t{\n\t\t\t//,\n\t\t\tappearance = \"outlined\",\n\t\t\tclassName,\n\t\t\tpriority = \"neutral\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<AlertDialogPrimitive.Close asChild>\n\t\t\t<Button\n\t\t\t\tappearance={appearance}\n\t\t\t\tclassName={cx(\"mt-2 sm:mt-0\", className)}\n\t\t\t\tpriority={priority}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</AlertDialogPrimitive.Close>\n\t),\n);\nAlertDialogCancel.displayName = \"AlertDialogCancel\";\n\ntype AlertDialogIconProps = Omit<SvgAttributes, \"children\"> & {\n\tsvg?: ReactNode;\n};\n\n/**\n * An icon that visually represents the priority of the AlertDialog.\n *\n * Defaults to a warning icon for danger priority and an info icon for info\n * priority with the appropriate color.\n *\n * Can be overridden with a custom icon using the `svg` prop.\n */\nconst AlertDialogIcon = forwardRef<ComponentRef<\"svg\">, AlertDialogIconProps>(\n\t({ className, svg, ...props }, ref) => {\n\t\tconst ctx = useAlertDialogContext();\n\t\tconst defaultColor =\n\t\t\tctx.priority === \"danger\" ? \"text-danger-600\" : \"text-accent-600\";\n\t\tconst defaultIcon = ctx.priority === \"danger\" ? <Warning /> : <Info />;\n\n\t\treturn (\n\t\t\t<SvgOnly\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"size-12 sm:size-7\", defaultColor, className)}\n\t\t\t\tsvg={svg ?? defaultIcon}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nAlertDialogIcon.displayName = \"AlertDialogIcon\";\n\n/**\n * A button that closes the Alert Dialog. (Unstyled)\n */\nconst AlertDialogClose = AlertDialogPrimitive.Close;\n\nexport {\n\t//,\n\tAlertDialog,\n\tAlertDialogAction,\n\tAlertDialogBody,\n\tAlertDialogCancel,\n\tAlertDialogClose,\n\tAlertDialogContent,\n\tAlertDialogDescription,\n\tAlertDialogFooter,\n\tAlertDialogHeader,\n\tAlertDialogIcon,\n\tAlertDialogTitle,\n\tAlertDialogTrigger,\n};\n"],"mappings":"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","names":["Info","Warning","createContext","forwardRef","useContext","useMemo","invariant","jsx","jsxs","AlertDialogContext","createContext","useAlertDialogContext","context","useContext","invariant","AlertDialog","priority","props","useMemo","jsx","Root","AlertDialogTrigger","Trigger","AlertDialogPortal","Portal","AlertDialogOverlay","forwardRef","className","ref","Overlay","cx","AlertDialogContent","onInteractOutside","onPointerDownOutside","jsxs","Content","event","preventCloseOnPromptInteraction","AlertDialogBody","AlertDialogHeader","AlertDialogFooter","AlertDialogTitle","Title","AlertDialogDescription","Description","AlertDialogAction","appearance","ctx","buttonPriority","Button","AlertDialogCancel","Close","AlertDialogIcon","svg","defaultColor","defaultIcon","Warning","Info","SvgOnly","AlertDialogClose"]}
+{"version":3,"sources":["../src/components/alert-dialog/alert-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport { Info } from \"@phosphor-icons/react/Info\";\nimport { Warning } from \"@phosphor-icons/react/Warning\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n\ttype ComponentProps,\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\ttype ReactNode,\n\tcreateContext,\n\tforwardRef,\n\tuseContext,\n\tuseMemo,\n} from \"react\";\nimport invariant from \"tiny-invariant\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport {\n\tButton,\n\ttype ButtonPriority,\n\ttype ButtonProps,\n} from \"../button/button.js\";\nimport * as AlertDialogPrimitive from \"../dialog/primitive.js\";\nimport { SvgOnly } from \"../icon/svg-only.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\nimport { preventCloseOnPromptInteraction } from \"../toast/toast.js\";\n\nconst priorities = [\"info\", \"danger\"] as const;\ntype Priority = (typeof priorities)[number];\n\ntype AlertDialogContextValue = {\n\tpriority: Priority;\n};\n\nconst AlertDialogContext = createContext<AlertDialogContextValue | null>(null);\n\nfunction useAlertDialogContext() {\n\tconst context = useContext(AlertDialogContext);\n\tinvariant(\n\t\tcontext,\n\t\t\"AlertDialog child component used outside of AlertDialog parent!\",\n\t);\n\treturn context;\n}\n\ntype AlertDialogProps = ComponentProps<typeof AlertDialogPrimitive.Root> & {\n\t/**\n\t * Indicates the importance or impact level of the AlertDialog, affecting its\n\t * color and styling to communicate its purpose to the user.\n\t */\n\tpriority: Priority;\n};\n\n/**\n * A modal dialog that interrupts the user with important content and expects a\n * response.\n * The root stateful component for the Alert Dialog.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nfunction AlertDialog({ priority, ...props }: AlertDialogProps) {\n\tconst context: AlertDialogContextValue = useMemo(\n\t\t() => ({ priority }),\n\t\t[priority],\n\t);\n\n\treturn (\n\t\t<AlertDialogContext.Provider value={context}>\n\t\t\t<AlertDialogPrimitive.Root {...props} />\n\t\t</AlertDialogContext.Provider>\n\t);\n}\nAlertDialog.displayName = \"AlertDialog\";\n\n/**\n * A button that opens the Alert Dialog.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-trigger\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogTrigger = AlertDialogPrimitive.Trigger;\n\n/**\n * The portal for the Alert Dialog.\n *\n * @private\n */\nconst AlertDialogPortal = AlertDialogPrimitive.Portal;\n\n/**\n * A layer that covers the inert portion of the view when the dialog is open.\n *\n * @private\n */\nconst AlertDialogOverlay = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Overlay>,\n\tComponentPropsWithoutRef<typeof AlertDialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Overlay\n\t\tclassName={cx(\n\t\t\t\"data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 bg-overlay fixed inset-0 z-50 backdrop-blur-sm\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t\tref={ref}\n\t/>\n));\nAlertDialogOverlay.displayName = \"AlertDialogOverlay\";\n\n/**\n * The popover alert dialog container.\n *\n * Renders on top of the overlay and is centered in the viewport.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-content\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogContent = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Content>,\n\tComponentPropsWithoutRef<typeof AlertDialogPrimitive.Content>\n>(({ className, onInteractOutside, onPointerDownOutside, ...props }, ref) => (\n\t<AlertDialogPortal>\n\t\t<AlertDialogOverlay />\n\t\t<div className=\"fixed inset-4 z-50 flex items-center justify-center\">\n\t\t\t<AlertDialogPrimitive.Content\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"flex w-full max-w-md flex-1 flex-col items-center gap-4 sm:flex-row sm:items-start\",\n\t\t\t\t\t\"outline-none focus-within:outline-none\",\n\t\t\t\t\t\"p-6\",\n\t\t\t\t\t\"border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200\",\n\t\t\t\t\t\"data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tonInteractOutside={(event) => {\n\t\t\t\t\tpreventCloseOnPromptInteraction(event);\n\t\t\t\t\tonInteractOutside?.(event);\n\t\t\t\t}}\n\t\t\t\tonPointerDownOutside={(event) => {\n\t\t\t\t\tpreventCloseOnPromptInteraction(event);\n\t\t\t\t\tonPointerDownOutside?.(event);\n\t\t\t\t}}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</div>\n\t</AlertDialogPortal>\n));\nAlertDialogContent.displayName = \"AlertDialogContent\";\n\n/**\n * Contains the main content of the alert dialog.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-body\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogBody = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentProps<\"div\"> & WithAsChild\n>(({ asChild = false, className, ...props }, ref) => {\n\tconst Component = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={cx(\"flex-1 space-y-4\", className)}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\nAlertDialogBody.displayName = \"AlertDialogBody\";\n\n/**\n * Contains the header content of the dialog, including the title and description.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-header\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogHeader = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentProps<\"div\"> & WithAsChild\n>(({ asChild = false, className, ...props }, ref) => {\n\tconst Component = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={cx(\n\t\t\t\t\"flex flex-col space-y-2 text-center sm:text-start\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\nAlertDialogHeader.displayName = \"AlertDialogHeader\";\n\n/**\n * Contains the footer content of the dialog, including the action and cancel buttons.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-footer\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogFooter = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentProps<\"div\"> & WithAsChild\n>(({ asChild = false, className, ...props }, ref) => {\n\tconst Component = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={cx(\n\t\t\t\t\"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\nAlertDialogFooter.displayName = \"AlertDialogFooter\";\n\n/**\n * An accessible name to be announced when the dialog is opened.\n *\n * Alternatively, you can provide `aria-label` or `aria-labelledby` to\n * `AlertDialogContent` and exclude this component.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-title\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogTitle = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Title>,\n\tComponentPropsWithoutRef<typeof AlertDialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"text-strong text-center text-lg font-medium sm:text-start\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nAlertDialogTitle.displayName = \"AlertDialogTitle\";\n\n/**\n * An accessible description to be announced when the dialog is opened.\n *\n * Alternatively, you can provide `aria-describedby` to `AlertDialogContent` and\n * exclude this component.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-description\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogDescription = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Description>,\n\tComponentPropsWithoutRef<typeof AlertDialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"text-body text-center text-sm font-normal sm:text-start\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nAlertDialogDescription.displayName = \"AlertDialogDescription\";\n\n/**\n * A button that confirms the Alert Dialog action.\n * Will default to appearance=\"filled\", as well as the priority color from the `AlertDialog`.\n * Does not close the alert dialog by default.\n *\n * These buttons should be distinguished visually from the AlertDialogCancel button.\n *\n * Composes around the mantle Button component.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-action\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogAction = forwardRef<ComponentRef<\"button\">, ButtonProps>(\n\t(\n\t\t{\n\t\t\t//,\n\t\t\tappearance = \"filled\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst ctx = useAlertDialogContext();\n\t\tlet buttonPriority: NonNullable<ButtonPriority> = \"default\";\n\t\tif (ctx.priority === \"danger\") {\n\t\t\tbuttonPriority = \"danger\";\n\t\t}\n\n\t\treturn (\n\t\t\t<Button\n\t\t\t\t//\n\t\t\t\tappearance={appearance}\n\t\t\t\tpriority={buttonPriority}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nAlertDialogAction.displayName = \"AlertDialogAction\";\n\n/**\n * A button that closes the dialog and cancels the action.\n * Will default to appearance=\"outlined\" and priority=\"neutral\".\n *\n * This button should be distinguished visually from AlertDialogAction buttons.\n *\n * Composes around the mantle Button component.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-cancel\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogCancel = forwardRef<ComponentRef<\"button\">, ButtonProps>(\n\t(\n\t\t{\n\t\t\t//,\n\t\t\tappearance = \"outlined\",\n\t\t\tclassName,\n\t\t\tpriority = \"neutral\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<AlertDialogPrimitive.Close asChild>\n\t\t\t<Button\n\t\t\t\tappearance={appearance}\n\t\t\t\tclassName={cx(\"mt-2 sm:mt-0\", className)}\n\t\t\t\tpriority={priority}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</AlertDialogPrimitive.Close>\n\t),\n);\nAlertDialogCancel.displayName = \"AlertDialogCancel\";\n\ntype AlertDialogIconProps = Omit<SvgAttributes, \"children\"> & {\n\tsvg?: ReactNode;\n};\n\n/**\n * An icon that visually represents the priority of the AlertDialog.\n *\n * Defaults to a warning icon for danger priority and an info icon for info\n * priority with the appropriate color.\n *\n * Can be overridden with a custom icon using the `svg` prop.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-icon\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogIcon = forwardRef<ComponentRef<\"svg\">, AlertDialogIconProps>(\n\t({ className, svg, ...props }, ref) => {\n\t\tconst ctx = useAlertDialogContext();\n\t\tconst defaultColor =\n\t\t\tctx.priority === \"danger\" ? \"text-danger-600\" : \"text-accent-600\";\n\t\tconst defaultIcon = ctx.priority === \"danger\" ? <Warning /> : <Info />;\n\n\t\treturn (\n\t\t\t<SvgOnly\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"size-12 sm:size-7\", defaultColor, className)}\n\t\t\t\tsvg={svg ?? defaultIcon}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nAlertDialogIcon.displayName = \"AlertDialogIcon\";\n\n/**\n * A button that closes the Alert Dialog. (Unstyled)\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-close\n *\n * @example\n * ```tsx\n * <AlertDialogClose asChild>\n *   <AlertDialogAction\n *   \ttype=\"button\"\n *   \tonClick={() => doThing()}\n *   >\n *   \tDo thing and close\n *   </AlertDialogAction>\n * </AlertDialogClose>\n */\nconst AlertDialogClose = AlertDialogPrimitive.Close;\n\nexport {\n\t//,\n\tAlertDialog,\n\tAlertDialogAction,\n\tAlertDialogBody,\n\tAlertDialogCancel,\n\tAlertDialogClose,\n\tAlertDialogContent,\n\tAlertDialogDescription,\n\tAlertDialogFooter,\n\tAlertDialogHeader,\n\tAlertDialogIcon,\n\tAlertDialogTitle,\n\tAlertDialogTrigger,\n};\n"],"mappings":"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","names":["Info","Warning","Slot","createContext","forwardRef","useContext","useMemo","invariant","jsx","jsxs","AlertDialogContext","createContext","useAlertDialogContext","context","useContext","invariant","AlertDialog","priority","props","useMemo","jsx","Root","AlertDialogTrigger","Trigger","AlertDialogPortal","Portal","AlertDialogOverlay","forwardRef","className","ref","Overlay","cx","AlertDialogContent","onInteractOutside","onPointerDownOutside","jsxs","Content","event","preventCloseOnPromptInteraction","AlertDialogBody","asChild","Slot","AlertDialogHeader","AlertDialogFooter","AlertDialogTitle","Title","AlertDialogDescription","Description","AlertDialogAction","appearance","ctx","buttonPriority","Button","AlertDialogCancel","Close","AlertDialogIcon","svg","defaultColor","defaultIcon","Warning","Info","SvgOnly","AlertDialogClose"]}

package/dist/alert.d.ts

@@ -1,6 +1,6 @@
 import * as react from 'react';
 import { ComponentProps, HTMLAttributes, ReactNode } from 'react';
-import { W as WithAsChild } from './as-child-Cvu56SuO.js';
+import { W as WithAsChild } from './as-child-DJ7x3JFV.js';
 import { S as SvgAttributes } from './types-BuKAGhC-.js';
 
 declare const priorities: readonly ["danger", "info", "success", "warning"];