@spark-ui/components 18.1.2 → 18.1.3

package/dist/{DialogContent.styles-ClKRO43s.mjs → DialogContent.styles-BVyH8M3z.mjs}

@@ -20,12 +20,12 @@ var t = e([
 	variants: {
 		size: {
 			fullscreen: "fixed size-full top-0 left-0",
-			sm: "max-w-[min(480px,calc(100vw-2rem))] data-nested-dialog-open:scale-90",
-			md: "max-w-[min(672px,calc(100vw-2rem))] data-nested-dialog-open:scale-90",
-			lg: "max-w-[min(864px,calc(100vw-2rem))] data-nested-dialog-open:scale-90"
+			sm: "max-w-[min(480px,calc(100vw-var(--spacing-sz-32)))] data-nested-dialog-open:scale-90",
+			md: "max-w-[min(672px,calc(100vw-var(--spacing-sz-32)))] data-nested-dialog-open:scale-90",
+			lg: "max-w-[min(864px,calc(100vw-var(--spacing-sz-32)))] data-nested-dialog-open:scale-90"
 		},
 		isNarrow: {
-			true: ["max-w-[calc(100vw-2rem)]"],
+			true: ["max-w-[calc(100vw-var(--spacing-sz-32))]"],
 			false: []
 		}
 	},
@@ -59,4 +59,4 @@ var t = e([
 //#endregion
 export { t };
 
-//# sourceMappingURL=DialogContent.styles-ClKRO43s.mjs.map
+//# sourceMappingURL=DialogContent.styles-BVyH8M3z.mjs.map

package/dist/{DialogContent.styles-ClKRO43s.mjs.map → DialogContent.styles-BVyH8M3z.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"DialogContent.styles-ClKRO43s.mjs","names":[],"sources":["../src/dialog/DialogContent.styles.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority'\n\nexport const dialogContentStyles = cva(\n  [\n    'z-modal flex flex-col bg-surface group transition-all',\n    'focus-visible:outline-hidden focus-visible:u-outline',\n    '[&:not(:has(footer))]:pb-lg',\n    '[&:not(:has(header))]:pt-lg',\n    'data-open:animation-duration-400 data-closed:animation-duration-200',\n    'data-starting-style:scale-90 data-starting-style:opacity-0',\n    'data-ending-style:scale-90 data-ending-style:opacity-0',\n    // Nested dialog effect\n    'data-nested-dialog-open:after:pointer-events-none',\n    'after:bg-transparent',\n    'after:transition-all',\n    'after:duration-200',\n    'data-nested-dialog-open:after:inset-0',\n    'data-nested-dialog-open:after:absolute',\n    'data-nested-dialog-open:after:rounded-[inherit]',\n    'data-nested-dialog-open:after:bg-overlay/dim-3',\n  ],\n  {\n    variants: {\n      size: {\n        fullscreen: 'fixed size-full top-0 left-0',\n        sm: 'max-w-[min(480px,calc(100vw-2rem))] data-nested-dialog-open:scale-90',\n        md: 'max-w-[min(672px,calc(100vw-2rem))] data-nested-dialog-open:scale-90',\n        lg: 'max-w-[min(864px,calc(100vw-2rem))] data-nested-dialog-open:scale-90',\n      },\n      isNarrow: {\n        true: ['max-w-[calc(100vw-2rem)]'],\n        false: [],\n      },\n    },\n    compoundVariants: [\n      {\n        size: ['sm', 'md', 'lg'],\n        class: [\n          'fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2',\n          'max-h-[80%]',\n          'shadow-md rounded-lg',\n          'data-open:animate-fade-in',\n          'data-closed:animate-fade-out',\n        ],\n      },\n      {\n        size: ['sm', 'md', 'lg'],\n        isNarrow: false,\n        class: ['w-full'],\n      },\n    ],\n    defaultVariants: {\n      size: 'md',\n      isNarrow: false,\n    },\n  }\n)\n\nexport type DialogContentStylesProps = VariantProps<typeof dialogContentStyles>\n"],"mappings":";;AAEA,IAAa,IAAsB,EACjC;CACE;CACA;CACA;CACA;CACA;CACA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,GACA;CACE,UAAU;EACR,MAAM;GACJ,YAAY;GACZ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN;EACA,UAAU;GACR,MAAM,CAAC,0BAA0B;GACjC,OAAO,CAAC;EACV;CACF;CACA,kBAAkB,CAChB;EACE,MAAM;GAAC;GAAM;GAAM;EAAI;EACvB,OAAO;GACL;GACA;GACA;GACA;GACA;EACF;CACF,GACA;EACE,MAAM;GAAC;GAAM;GAAM;EAAI;EACvB,UAAU;EACV,OAAO,CAAC,QAAQ;CAClB,CACF;CACA,iBAAiB;EACf,MAAM;EACN,UAAU;CACZ;AACF,CACF"}
+{"version":3,"file":"DialogContent.styles-BVyH8M3z.mjs","names":[],"sources":["../src/dialog/DialogContent.styles.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority'\n\nexport const dialogContentStyles = cva(\n  [\n    'z-modal flex flex-col bg-surface group transition-all',\n    'focus-visible:outline-hidden focus-visible:u-outline',\n    '[&:not(:has(footer))]:pb-lg',\n    '[&:not(:has(header))]:pt-lg',\n    'data-open:animation-duration-400 data-closed:animation-duration-200',\n    'data-starting-style:scale-90 data-starting-style:opacity-0',\n    'data-ending-style:scale-90 data-ending-style:opacity-0',\n    // Nested dialog effect\n    'data-nested-dialog-open:after:pointer-events-none',\n    'after:bg-transparent',\n    'after:transition-all',\n    'after:duration-200',\n    'data-nested-dialog-open:after:inset-0',\n    'data-nested-dialog-open:after:absolute',\n    'data-nested-dialog-open:after:rounded-[inherit]',\n    'data-nested-dialog-open:after:bg-overlay/dim-3',\n  ],\n  {\n    variants: {\n      size: {\n        fullscreen: 'fixed size-full top-0 left-0',\n        sm: 'max-w-[min(480px,calc(100vw-var(--spacing-sz-32)))] data-nested-dialog-open:scale-90',\n        md: 'max-w-[min(672px,calc(100vw-var(--spacing-sz-32)))] data-nested-dialog-open:scale-90',\n        lg: 'max-w-[min(864px,calc(100vw-var(--spacing-sz-32)))] data-nested-dialog-open:scale-90',\n      },\n      isNarrow: {\n        true: ['max-w-[calc(100vw-var(--spacing-sz-32))]'],\n        false: [],\n      },\n    },\n    compoundVariants: [\n      {\n        size: ['sm', 'md', 'lg'],\n        class: [\n          'fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2',\n          'max-h-[80%]',\n          'shadow-md rounded-lg',\n          'data-open:animate-fade-in',\n          'data-closed:animate-fade-out',\n        ],\n      },\n      {\n        size: ['sm', 'md', 'lg'],\n        isNarrow: false,\n        class: ['w-full'],\n      },\n    ],\n    defaultVariants: {\n      size: 'md',\n      isNarrow: false,\n    },\n  }\n)\n\nexport type DialogContentStylesProps = VariantProps<typeof dialogContentStyles>\n"],"mappings":";;AAEA,IAAa,IAAsB,EACjC;CACE;CACA;CACA;CACA;CACA;CACA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,GACA;CACE,UAAU;EACR,MAAM;GACJ,YAAY;GACZ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN;EACA,UAAU;GACR,MAAM,CAAC,0CAA0C;GACjD,OAAO,CAAC;EACV;CACF;CACA,kBAAkB,CAChB;EACE,MAAM;GAAC;GAAM;GAAM;EAAI;EACvB,OAAO;GACL;GACA;GACA;GACA;GACA;EACF;CACF,GACA;EACE,MAAM;GAAC;GAAM;GAAM;EAAI;EACvB,UAAU;EACV,OAAO,CAAC,QAAQ;CAClB,CACF;CACA,iBAAiB;EACf,MAAM;EACN,UAAU;CACZ;AACF,CACF"}

package/dist/{DialogContent.styles-FnwXayCC.js → DialogContent.styles-Bh6DymkD.js}

@@ -1,2 +1,2 @@
-var e=(0,require("class-variance-authority").cva)([`z-modal flex flex-col bg-surface group transition-all`,`focus-visible:outline-hidden focus-visible:u-outline`,`[&:not(:has(footer))]:pb-lg`,`[&:not(:has(header))]:pt-lg`,`data-open:animation-duration-400 data-closed:animation-duration-200`,`data-starting-style:scale-90 data-starting-style:opacity-0`,`data-ending-style:scale-90 data-ending-style:opacity-0`,`data-nested-dialog-open:after:pointer-events-none`,`after:bg-transparent`,`after:transition-all`,`after:duration-200`,`data-nested-dialog-open:after:inset-0`,`data-nested-dialog-open:after:absolute`,`data-nested-dialog-open:after:rounded-[inherit]`,`data-nested-dialog-open:after:bg-overlay/dim-3`],{variants:{size:{fullscreen:`fixed size-full top-0 left-0`,sm:`max-w-[min(480px,calc(100vw-2rem))] data-nested-dialog-open:scale-90`,md:`max-w-[min(672px,calc(100vw-2rem))] data-nested-dialog-open:scale-90`,lg:`max-w-[min(864px,calc(100vw-2rem))] data-nested-dialog-open:scale-90`},isNarrow:{true:[`max-w-[calc(100vw-2rem)]`],false:[]}},compoundVariants:[{size:[`sm`,`md`,`lg`],class:[`fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2`,`max-h-[80%]`,`shadow-md rounded-lg`,`data-open:animate-fade-in`,`data-closed:animate-fade-out`]},{size:[`sm`,`md`,`lg`],isNarrow:!1,class:[`w-full`]}],defaultVariants:{size:`md`,isNarrow:!1}});Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return e}});
-//# sourceMappingURL=DialogContent.styles-FnwXayCC.js.map
+var e=(0,require("class-variance-authority").cva)([`z-modal flex flex-col bg-surface group transition-all`,`focus-visible:outline-hidden focus-visible:u-outline`,`[&:not(:has(footer))]:pb-lg`,`[&:not(:has(header))]:pt-lg`,`data-open:animation-duration-400 data-closed:animation-duration-200`,`data-starting-style:scale-90 data-starting-style:opacity-0`,`data-ending-style:scale-90 data-ending-style:opacity-0`,`data-nested-dialog-open:after:pointer-events-none`,`after:bg-transparent`,`after:transition-all`,`after:duration-200`,`data-nested-dialog-open:after:inset-0`,`data-nested-dialog-open:after:absolute`,`data-nested-dialog-open:after:rounded-[inherit]`,`data-nested-dialog-open:after:bg-overlay/dim-3`],{variants:{size:{fullscreen:`fixed size-full top-0 left-0`,sm:`max-w-[min(480px,calc(100vw-var(--spacing-sz-32)))] data-nested-dialog-open:scale-90`,md:`max-w-[min(672px,calc(100vw-var(--spacing-sz-32)))] data-nested-dialog-open:scale-90`,lg:`max-w-[min(864px,calc(100vw-var(--spacing-sz-32)))] data-nested-dialog-open:scale-90`},isNarrow:{true:[`max-w-[calc(100vw-var(--spacing-sz-32))]`],false:[]}},compoundVariants:[{size:[`sm`,`md`,`lg`],class:[`fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2`,`max-h-[80%]`,`shadow-md rounded-lg`,`data-open:animate-fade-in`,`data-closed:animate-fade-out`]},{size:[`sm`,`md`,`lg`],isNarrow:!1,class:[`w-full`]}],defaultVariants:{size:`md`,isNarrow:!1}});Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return e}});
+//# sourceMappingURL=DialogContent.styles-Bh6DymkD.js.map

package/dist/{DialogContent.styles-FnwXayCC.js.map → DialogContent.styles-Bh6DymkD.js.map}

@@ -1 +1 @@
-{"version":3,"file":"DialogContent.styles-FnwXayCC.js","names":[],"sources":["../src/dialog/DialogContent.styles.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority'\n\nexport const dialogContentStyles = cva(\n  [\n    'z-modal flex flex-col bg-surface group transition-all',\n    'focus-visible:outline-hidden focus-visible:u-outline',\n    '[&:not(:has(footer))]:pb-lg',\n    '[&:not(:has(header))]:pt-lg',\n    'data-open:animation-duration-400 data-closed:animation-duration-200',\n    'data-starting-style:scale-90 data-starting-style:opacity-0',\n    'data-ending-style:scale-90 data-ending-style:opacity-0',\n    // Nested dialog effect\n    'data-nested-dialog-open:after:pointer-events-none',\n    'after:bg-transparent',\n    'after:transition-all',\n    'after:duration-200',\n    'data-nested-dialog-open:after:inset-0',\n    'data-nested-dialog-open:after:absolute',\n    'data-nested-dialog-open:after:rounded-[inherit]',\n    'data-nested-dialog-open:after:bg-overlay/dim-3',\n  ],\n  {\n    variants: {\n      size: {\n        fullscreen: 'fixed size-full top-0 left-0',\n        sm: 'max-w-[min(480px,calc(100vw-2rem))] data-nested-dialog-open:scale-90',\n        md: 'max-w-[min(672px,calc(100vw-2rem))] data-nested-dialog-open:scale-90',\n        lg: 'max-w-[min(864px,calc(100vw-2rem))] data-nested-dialog-open:scale-90',\n      },\n      isNarrow: {\n        true: ['max-w-[calc(100vw-2rem)]'],\n        false: [],\n      },\n    },\n    compoundVariants: [\n      {\n        size: ['sm', 'md', 'lg'],\n        class: [\n          'fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2',\n          'max-h-[80%]',\n          'shadow-md rounded-lg',\n          'data-open:animate-fade-in',\n          'data-closed:animate-fade-out',\n        ],\n      },\n      {\n        size: ['sm', 'md', 'lg'],\n        isNarrow: false,\n        class: ['w-full'],\n      },\n    ],\n    defaultVariants: {\n      size: 'md',\n      isNarrow: false,\n    },\n  }\n)\n\nexport type DialogContentStylesProps = VariantProps<typeof dialogContentStyles>\n"],"mappings":"AAEA,IAAa,GAAA,oCAAA,CAAA,CAAA,IAAA,CACX,CACE,wDACA,uDACA,8BACA,8BACA,sEACA,6DACA,yDAEA,oDACA,uBACA,uBACA,qBACA,wCACA,yCACA,kDACA,gDACF,EACA,CACE,SAAU,CACR,KAAM,CACJ,WAAY,+BACZ,GAAI,uEACJ,GAAI,uEACJ,GAAI,sEACN,EACA,SAAU,CACR,KAAM,CAAC,0BAA0B,EACjC,MAAO,CAAC,CACV,CACF,EACA,iBAAkB,CAChB,CACE,KAAM,CAAC,KAAM,KAAM,IAAI,EACvB,MAAO,CACL,2DACA,cACA,uBACA,4BACA,8BACF,CACF,EACA,CACE,KAAM,CAAC,KAAM,KAAM,IAAI,EACvB,SAAU,GACV,MAAO,CAAC,QAAQ,CAClB,CACF,EACA,gBAAiB,CACf,KAAM,KACN,SAAU,EACZ,CACF,CACF"}
+{"version":3,"file":"DialogContent.styles-Bh6DymkD.js","names":[],"sources":["../src/dialog/DialogContent.styles.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority'\n\nexport const dialogContentStyles = cva(\n  [\n    'z-modal flex flex-col bg-surface group transition-all',\n    'focus-visible:outline-hidden focus-visible:u-outline',\n    '[&:not(:has(footer))]:pb-lg',\n    '[&:not(:has(header))]:pt-lg',\n    'data-open:animation-duration-400 data-closed:animation-duration-200',\n    'data-starting-style:scale-90 data-starting-style:opacity-0',\n    'data-ending-style:scale-90 data-ending-style:opacity-0',\n    // Nested dialog effect\n    'data-nested-dialog-open:after:pointer-events-none',\n    'after:bg-transparent',\n    'after:transition-all',\n    'after:duration-200',\n    'data-nested-dialog-open:after:inset-0',\n    'data-nested-dialog-open:after:absolute',\n    'data-nested-dialog-open:after:rounded-[inherit]',\n    'data-nested-dialog-open:after:bg-overlay/dim-3',\n  ],\n  {\n    variants: {\n      size: {\n        fullscreen: 'fixed size-full top-0 left-0',\n        sm: 'max-w-[min(480px,calc(100vw-var(--spacing-sz-32)))] data-nested-dialog-open:scale-90',\n        md: 'max-w-[min(672px,calc(100vw-var(--spacing-sz-32)))] data-nested-dialog-open:scale-90',\n        lg: 'max-w-[min(864px,calc(100vw-var(--spacing-sz-32)))] data-nested-dialog-open:scale-90',\n      },\n      isNarrow: {\n        true: ['max-w-[calc(100vw-var(--spacing-sz-32))]'],\n        false: [],\n      },\n    },\n    compoundVariants: [\n      {\n        size: ['sm', 'md', 'lg'],\n        class: [\n          'fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2',\n          'max-h-[80%]',\n          'shadow-md rounded-lg',\n          'data-open:animate-fade-in',\n          'data-closed:animate-fade-out',\n        ],\n      },\n      {\n        size: ['sm', 'md', 'lg'],\n        isNarrow: false,\n        class: ['w-full'],\n      },\n    ],\n    defaultVariants: {\n      size: 'md',\n      isNarrow: false,\n    },\n  }\n)\n\nexport type DialogContentStylesProps = VariantProps<typeof dialogContentStyles>\n"],"mappings":"AAEA,IAAa,GAAA,oCAAA,CAAA,CAAA,IAAA,CACX,CACE,wDACA,uDACA,8BACA,8BACA,sEACA,6DACA,yDAEA,oDACA,uBACA,uBACA,qBACA,wCACA,yCACA,kDACA,gDACF,EACA,CACE,SAAU,CACR,KAAM,CACJ,WAAY,+BACZ,GAAI,uFACJ,GAAI,uFACJ,GAAI,sFACN,EACA,SAAU,CACR,KAAM,CAAC,0CAA0C,EACjD,MAAO,CAAC,CACV,CACF,EACA,iBAAkB,CAChB,CACE,KAAM,CAAC,KAAM,KAAM,IAAI,EACvB,MAAO,CACL,2DACA,cACA,uBACA,4BACA,8BACF,CACF,EACA,CACE,KAAM,CAAC,KAAM,KAAM,IAAI,EACvB,SAAU,GACV,MAAO,CAAC,QAAQ,CAClB,CACF,EACA,gBAAiB,CACf,KAAM,KACN,SAAU,EACZ,CACF,CACF"}

package/dist/alert-dialog/index.js

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../DialogContent.styles-FnwXayCC.js");let t=require("@spark-ui/internal-utils"),n=require("class-variance-authority"),r=require("react"),i=require("react/jsx-runtime"),a=require("@base-ui/react/alert-dialog"),o=require("@spark-ui/hooks/use-merge-refs"),s=require("@spark-ui/hooks/use-scroll-overflow");var c=(0,r.createContext)(null),l=({children:e,withFade:t=!1,cancelRef:n})=>(0,i.jsx)(c,{value:{cancelRef:n,withFade:t},children:e}),u=()=>{let e=(0,r.useContext)(c);if(!e)throw Error(`useAlertDialog must be used within an AlertDialog provider`);return e},d=({onOpenChange:e,withFade:t=!1,...n})=>{let o=(0,r.useRef)(null),s=e?(t,n)=>{e(t)}:void 0;return(0,i.jsx)(l,{withFade:t,cancelRef:o,children:(0,i.jsx)(a.AlertDialog.Root,{"data-spark-component":`alert-dialog`,onOpenChange:s,...n})})};d.displayName=`AlertDialog`;var f=({asChild:e=!1,children:n,...r})=>{let{renderProp:o,innerChildren:s}=(0,t.createRenderSlot)(e,n);return(0,i.jsx)(a.AlertDialog.Close,{"data-spark-component":`alert-dialog-action`,render:o,...r,children:s})};f.displayName=`AlertDialog.Action`;var p=({children:e,className:t,inset:a=!1,ref:c,...l})=>{let d=(0,r.useRef)(null),f=(0,o.useMergeRefs)(c,d),{withFade:p}=u(),{overflow:m}=(0,s.useScrollOverflow)(d);return(0,i.jsx)(`div`,{"data-spark-component":`alert-dialog-body`,ref:f,className:(0,n.cx)(`focus-visible:u-outline relative grow overflow-y-auto outline-hidden`,`transition-all duration-300`,{"px-xl py-lg":!a},t),style:{...p&&{maskImage:`linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))`,maskSize:`100% calc(100% + ${m.top?`0px`:`44px`} + ${m.bottom?`0px`:`44px`})`,maskPosition:`0 ${m.top?`0px`:`-44px`}`}},...l,children:e})};p.displayName=`AlertDialog.Body`;var m=({asChild:e=!1,ref:n,children:r,...s})=>{let{cancelRef:c}=u(),l=(0,o.useMergeRefs)(n,c),{renderProp:d,innerChildren:f}=(0,t.createRenderSlot)(e,r);return(0,i.jsx)(a.AlertDialog.Close,{ref:l,"data-spark-component":`alert-dialog-cancel`,render:d,...s,children:f})};m.displayName=`AlertDialog.Cancel`;var h=({className:t,ref:r,initialFocus:o,...s})=>{let{cancelRef:c}=u(),l=o===void 0?()=>c.current:o;return(0,i.jsx)(a.AlertDialog.Popup,{ref:r,"data-spark-component":`alert-dialog-content`,role:`alertdialog`,className:r=>(0,n.cx)(e.t({size:`md`,isNarrow:!0}),`min-w-[min(288px,calc(100vw-2rem))]`,`transition-all duration-150`,`data-starting-style:scale-90 data-starting-style:opacity-0`,`data-ending-style:scale-90 data-ending-style:opacity-0`,typeof t==`function`?t(r):t),initialFocus:l,...s})};h.displayName=`AlertDialog.Content`;var g=e=>(0,i.jsx)(a.AlertDialog.Description,{"data-spark-component":`alert-dialog-description`,...e});g.displayName=`AlertDialog.Description`;var _=({children:e,className:t,ref:r,...a})=>(0,i.jsx)(`footer`,{"data-spark-component":`alert-dialog-footer`,ref:r,className:(0,n.cx)(t,[`px-xl`,`py-lg`]),...a,children:e});_.displayName=`AlertDialog.Footer`;var v=({children:e,className:t,ref:r,...a})=>(0,i.jsx)(`header`,{"data-spark-component":`alert-dialog-header`,ref:r,className:(0,n.cx)(t,[`px-xl`,`py-lg`]),...a,children:e});v.displayName=`AlertDialog.Header`;var y=({className:e,...t})=>(0,i.jsx)(a.AlertDialog.Backdrop,{"data-spark-component":`alert-dialog-overlay`,className:t=>(0,n.cx)(`z-overlay fixed top-0 left-0 h-screen w-screen`,`bg-overlay/dim-1`,`data-starting-style:animate-fade-in`,`data-ending-style:animate-fade-out`,typeof e==`function`?e(t):e),...t});y.displayName=`AlertDialog.Overlay`;var b=({className:e,...t})=>(0,i.jsx)(a.AlertDialog.Portal,{"data-spark-component":`alert-dialog-portal`,className:(0,n.cx)(e,`z-modal absolute`),...t});b.displayName=`AlertDialog.Portal`;var x=({className:e,...t})=>(0,i.jsx)(a.AlertDialog.Title,{"data-spark-component":`alert-dialog-title`,className:(0,n.cx)(`text-headline-1 text-on-surface`,e),...t});x.displayName=`AlertDialog.Title`;var S=({asChild:e=!1,children:n,...r})=>{let{renderProp:o,innerChildren:s}=(0,t.createRenderSlot)(e,n);return(0,i.jsx)(a.AlertDialog.Trigger,{"data-spark-component":`alert-dialog-trigger`,render:o,...r,children:s})};S.displayName=`AlertDialog.Trigger`;var C=Object.assign(d,{Action:f,Body:p,Cancel:m,Content:h,Description:g,Footer:_,Header:v,Overlay:y,Portal:b,Title:x,Trigger:S});C.displayName=`AlertDialog`,C.Action.displayName=`AlertDialog.Action`,C.Body.displayName=`AlertDialog.Body`,C.Cancel.displayName=`AlertDialog.Cancel`,C.Content.displayName=`AlertDialog.Content`,C.Description.displayName=`AlertDialog.Description`,C.Footer.displayName=`AlertDialog.Footer`,C.Header.displayName=`AlertDialog.Header`,C.Overlay.displayName=`AlertDialog.Overlay`,C.Portal.displayName=`AlertDialog.Portal`,C.Title.displayName=`AlertDialog.Title`,C.Trigger.displayName=`AlertDialog.Trigger`,exports.AlertDialog=C,exports.useAlertDialog=u;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../DialogContent.styles-Bh6DymkD.js");let t=require("@spark-ui/internal-utils"),n=require("class-variance-authority"),r=require("react"),i=require("react/jsx-runtime"),a=require("@base-ui/react/alert-dialog"),o=require("@spark-ui/hooks/use-merge-refs"),s=require("@spark-ui/hooks/use-scroll-overflow");var c=(0,r.createContext)(null),l=({children:e,withFade:t=!1,cancelRef:n})=>(0,i.jsx)(c,{value:{cancelRef:n,withFade:t},children:e}),u=()=>{let e=(0,r.useContext)(c);if(!e)throw Error(`useAlertDialog must be used within an AlertDialog provider`);return e},d=({onOpenChange:e,withFade:t=!1,...n})=>{let o=(0,r.useRef)(null),s=e?(t,n)=>{e(t)}:void 0;return(0,i.jsx)(l,{withFade:t,cancelRef:o,children:(0,i.jsx)(a.AlertDialog.Root,{"data-spark-component":`alert-dialog`,onOpenChange:s,...n})})};d.displayName=`AlertDialog`;var f=({asChild:e=!1,children:n,...r})=>{let{renderProp:o,innerChildren:s}=(0,t.createRenderSlot)(e,n);return(0,i.jsx)(a.AlertDialog.Close,{"data-spark-component":`alert-dialog-action`,render:o,...r,children:s})};f.displayName=`AlertDialog.Action`;var p=({children:e,className:t,inset:a=!1,ref:c,...l})=>{let d=(0,r.useRef)(null),f=(0,o.useMergeRefs)(c,d),{withFade:p}=u(),{overflow:m}=(0,s.useScrollOverflow)(d);return(0,i.jsx)(`div`,{"data-spark-component":`alert-dialog-body`,ref:f,className:(0,n.cx)(`focus-visible:u-outline relative grow overflow-y-auto outline-hidden`,`transition-all duration-300`,{"px-xl py-lg":!a},t),style:{...p&&{maskImage:`linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))`,maskSize:`100% calc(100% + ${m.top?`0px`:`44px`} + ${m.bottom?`0px`:`44px`})`,maskPosition:`0 ${m.top?`0px`:`-44px`}`}},...l,children:e})};p.displayName=`AlertDialog.Body`;var m=({asChild:e=!1,ref:n,children:r,...s})=>{let{cancelRef:c}=u(),l=(0,o.useMergeRefs)(n,c),{renderProp:d,innerChildren:f}=(0,t.createRenderSlot)(e,r);return(0,i.jsx)(a.AlertDialog.Close,{ref:l,"data-spark-component":`alert-dialog-cancel`,render:d,...s,children:f})};m.displayName=`AlertDialog.Cancel`;var h=({className:t,ref:r,initialFocus:o,...s})=>{let{cancelRef:c}=u(),l=o===void 0?()=>c.current:o;return(0,i.jsx)(a.AlertDialog.Popup,{ref:r,"data-spark-component":`alert-dialog-content`,role:`alertdialog`,className:r=>(0,n.cx)(e.t({size:`md`,isNarrow:!0}),`min-w-[min(288px,calc(100vw-var(--spacing-sz-32)))]`,`transition-all duration-150`,`data-starting-style:scale-90 data-starting-style:opacity-0`,`data-ending-style:scale-90 data-ending-style:opacity-0`,typeof t==`function`?t(r):t),initialFocus:l,...s})};h.displayName=`AlertDialog.Content`;var g=e=>(0,i.jsx)(a.AlertDialog.Description,{"data-spark-component":`alert-dialog-description`,...e});g.displayName=`AlertDialog.Description`;var _=({children:e,className:t,ref:r,...a})=>(0,i.jsx)(`footer`,{"data-spark-component":`alert-dialog-footer`,ref:r,className:(0,n.cx)(t,[`px-xl`,`py-lg`]),...a,children:e});_.displayName=`AlertDialog.Footer`;var v=({children:e,className:t,ref:r,...a})=>(0,i.jsx)(`header`,{"data-spark-component":`alert-dialog-header`,ref:r,className:(0,n.cx)(t,[`px-xl`,`py-lg`]),...a,children:e});v.displayName=`AlertDialog.Header`;var y=({className:e,...t})=>(0,i.jsx)(a.AlertDialog.Backdrop,{"data-spark-component":`alert-dialog-overlay`,className:t=>(0,n.cx)(`z-overlay fixed top-0 left-0 h-screen w-screen`,`bg-overlay/dim-1`,`data-starting-style:animate-fade-in`,`data-ending-style:animate-fade-out`,typeof e==`function`?e(t):e),...t});y.displayName=`AlertDialog.Overlay`;var b=({className:e,...t})=>(0,i.jsx)(a.AlertDialog.Portal,{"data-spark-component":`alert-dialog-portal`,className:(0,n.cx)(e,`z-modal absolute`),...t});b.displayName=`AlertDialog.Portal`;var x=({className:e,...t})=>(0,i.jsx)(a.AlertDialog.Title,{"data-spark-component":`alert-dialog-title`,className:(0,n.cx)(`text-headline-1 text-on-surface`,e),...t});x.displayName=`AlertDialog.Title`;var S=({asChild:e=!1,children:n,...r})=>{let{renderProp:o,innerChildren:s}=(0,t.createRenderSlot)(e,n);return(0,i.jsx)(a.AlertDialog.Trigger,{"data-spark-component":`alert-dialog-trigger`,render:o,...r,children:s})};S.displayName=`AlertDialog.Trigger`;var C=Object.assign(d,{Action:f,Body:p,Cancel:m,Content:h,Description:g,Footer:_,Header:v,Overlay:y,Portal:b,Title:x,Trigger:S});C.displayName=`AlertDialog`,C.Action.displayName=`AlertDialog.Action`,C.Body.displayName=`AlertDialog.Body`,C.Cancel.displayName=`AlertDialog.Cancel`,C.Content.displayName=`AlertDialog.Content`,C.Description.displayName=`AlertDialog.Description`,C.Footer.displayName=`AlertDialog.Footer`,C.Header.displayName=`AlertDialog.Header`,C.Overlay.displayName=`AlertDialog.Overlay`,C.Portal.displayName=`AlertDialog.Portal`,C.Title.displayName=`AlertDialog.Title`,C.Trigger.displayName=`AlertDialog.Trigger`,exports.AlertDialog=C,exports.useAlertDialog=u;
 //# sourceMappingURL=index.js.map

package/dist/alert-dialog/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/alert-dialog/AlertDialogContext.tsx","../../src/alert-dialog/AlertDialog.tsx","../../src/alert-dialog/AlertDialogAction.tsx","../../src/alert-dialog/AlertDialogBody.tsx","../../src/alert-dialog/AlertDialogCancel.tsx","../../src/alert-dialog/AlertDialogContent.tsx","../../src/alert-dialog/AlertDialogDescription.tsx","../../src/alert-dialog/AlertDialogFooter.tsx","../../src/alert-dialog/AlertDialogHeader.tsx","../../src/alert-dialog/AlertDialogOverlay.tsx","../../src/alert-dialog/AlertDialogPortal.tsx","../../src/alert-dialog/AlertDialogTitle.tsx","../../src/alert-dialog/AlertDialogTrigger.tsx","../../src/alert-dialog/index.ts"],"sourcesContent":["import { createContext, MutableRefObject, type ReactNode, useContext } from 'react'\n\nexport interface AlertDialogContextValue {\n  cancelRef: MutableRefObject<HTMLButtonElement | null>\n  withFade: boolean\n}\n\nexport const AlertDialogContext = createContext<AlertDialogContextValue | null>(null)\n\nexport const AlertDialogProvider = ({\n  children,\n  withFade = false,\n  cancelRef,\n}: {\n  children: ReactNode\n  withFade?: boolean\n  cancelRef: MutableRefObject<HTMLButtonElement | null>\n}) => {\n  return (\n    <AlertDialogContext\n      value={{\n        cancelRef,\n        withFade,\n      }}\n    >\n      {children}\n    </AlertDialogContext>\n  )\n}\n\nexport const useAlertDialog = () => {\n  const context = useContext(AlertDialogContext)\n\n  if (!context) {\n    throw Error('useAlertDialog must be used within an AlertDialog provider')\n  }\n\n  return context\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref, useRef } from 'react'\n\nimport { AlertDialogProvider } from './AlertDialogContext'\n\nexport interface AlertDialogProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Root>,\n  'onOpenChange' | 'render'\n> {\n  /**\n   * Specifies if the dialog is open or not.\n   */\n  open?: boolean\n  /**\n   * Default open state.\n   */\n  defaultOpen?: boolean\n  /**\n   * Handler executed on every dialog open state change.\n   */\n  onOpenChange?: (open: boolean) => void\n  /**\n   * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).\n   */\n  withFade?: boolean\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialog = ({ onOpenChange, withFade = false, ...props }: AlertDialogProps) => {\n  const cancelRef = useRef<HTMLButtonElement | null>(null)\n\n  const handleOpenChange = onOpenChange\n    ? (open: boolean, _eventDetails: unknown) => {\n        onOpenChange(open)\n      }\n    : undefined\n\n  return (\n    <AlertDialogProvider withFade={withFade} cancelRef={cancelRef}>\n      <BaseAlertDialog.Root\n        data-spark-component=\"alert-dialog\"\n        onOpenChange={handleOpenChange}\n        {...props}\n      />\n    </AlertDialogProvider>\n  )\n}\n\nAlertDialog.displayName = 'AlertDialog'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogActionProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Close>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog and confirms the action. Renders a <button> element.\n */\nexport const AlertDialogAction = ({\n  asChild = false,\n  children,\n  ...props\n}: AlertDialogActionProps) => {\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseAlertDialog.Close\n      data-spark-component=\"alert-dialog-action\"\n      render={renderProp}\n      {...props}\n    >\n      {innerChildren}\n    </BaseAlertDialog.Close>\n  )\n}\n\nAlertDialogAction.displayName = 'AlertDialog.Action'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref, useRef } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogBodyProps {\n  children: ReactNode\n  className?: string\n  tabIndex?: number\n  ref?: Ref<HTMLDivElement>\n  inset?: boolean\n}\n\n/**\n * The scrollable body section of the alert dialog. Renders a <div> element.\n */\nexport const AlertDialogBody = ({\n  children,\n  className,\n  inset = false,\n  ref: forwardedRef,\n  ...rest\n}: AlertDialogBodyProps): ReactElement => {\n  const scrollAreaRef = useRef<HTMLDivElement>(null)\n  const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n  const { withFade } = useAlertDialog()\n  const { overflow } = useScrollOverflow(scrollAreaRef)\n\n  return (\n    <div\n      data-spark-component=\"alert-dialog-body\"\n      ref={ref}\n      className={cx(\n        'focus-visible:u-outline relative grow overflow-y-auto outline-hidden',\n        'transition-all duration-300',\n        {\n          ['px-xl py-lg']: !inset,\n        },\n        className\n      )}\n      style={{\n        ...(withFade && {\n          maskImage:\n            'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n          maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n          maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n        }),\n      }}\n      {...rest}\n    >\n      {children}\n    </div>\n  )\n}\n\nAlertDialogBody.displayName = 'AlertDialog.Body'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogCancelProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Close>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog without confirming the action. Renders a <button> element.\n */\nexport const AlertDialogCancel = ({\n  asChild = false,\n  ref: forwardedRef,\n  children,\n  ...props\n}: AlertDialogCancelProps) => {\n  const { cancelRef } = useAlertDialog()\n  const ref = useMergeRefs(forwardedRef, cancelRef)\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseAlertDialog.Close\n      ref={ref}\n      data-spark-component=\"alert-dialog-cancel\"\n      render={renderProp}\n      {...props}\n    >\n      {innerChildren}\n    </BaseAlertDialog.Close>\n  )\n}\n\nAlertDialogCancel.displayName = 'AlertDialog.Cancel'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { dialogContentStyles } from '../dialog/DialogContent.styles'\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogContentProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Popup>,\n  'render'\n> {\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The popup element that contains the alert dialog content. Renders a <div> element.\n */\nexport const AlertDialogContent = ({\n  className,\n  ref,\n  initialFocus,\n  ...others\n}: AlertDialogContentProps) => {\n  const { cancelRef } = useAlertDialog()\n\n  // Default: focus the cancel button when dialog opens\n  // Users can override by passing their own initialFocus prop (RefObject, false, true, or function)\n  const handleInitialFocus = initialFocus !== undefined ? initialFocus : () => cancelRef.current\n\n  return (\n    <BaseAlertDialog.Popup\n      ref={ref}\n      data-spark-component=\"alert-dialog-content\"\n      role=\"alertdialog\"\n      className={state =>\n        cx(\n          dialogContentStyles({ size: 'md', isNarrow: true }),\n          'min-w-[min(288px,calc(100vw-2rem))]',\n          // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n          // Transition with opacity and scale for smooth open/close animations\n          'transition-all duration-150',\n          'data-starting-style:scale-90 data-starting-style:opacity-0',\n          'data-ending-style:scale-90 data-ending-style:opacity-0',\n          typeof className === 'function' ? className(state) : className\n        )\n      }\n      initialFocus={handleInitialFocus}\n      {...others}\n    />\n  )\n}\n\nAlertDialogContent.displayName = 'AlertDialog.Content'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogDescriptionProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Description>,\n  'render'\n> {\n  ref?: Ref<HTMLParagraphElement>\n}\n\n/**\n * A paragraph with additional information about the dialog. Renders a <p> element.\n */\nexport const AlertDialogDescription = (props: AlertDialogDescriptionProps) => {\n  return <BaseAlertDialog.Description data-spark-component=\"alert-dialog-description\" {...props} />\n}\n\nAlertDialogDescription.displayName = 'AlertDialog.Description'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogFooterProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The footer section of the alert dialog, typically containing action buttons. Renders a <footer> element.\n */\nexport const AlertDialogFooter = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: AlertDialogFooterProps): ReactElement => (\n  <footer\n    data-spark-component=\"alert-dialog-footer\"\n    ref={ref}\n    className={cx(className, ['px-xl', 'py-lg'])}\n    {...rest}\n  >\n    {children}\n  </footer>\n)\n\nAlertDialogFooter.displayName = 'AlertDialog.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogHeaderProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The header section of the alert dialog. Renders a <header> element.\n */\nexport const AlertDialogHeader = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: AlertDialogHeaderProps): ReactElement => (\n  <header\n    data-spark-component=\"alert-dialog-header\"\n    ref={ref}\n    className={cx(className, ['px-xl', 'py-lg'])}\n    {...rest}\n  >\n    {children}\n  </header>\n)\n\nAlertDialogHeader.displayName = 'AlertDialog.Header'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogOverlayProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Backdrop>,\n  'render'\n> {\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The backdrop element that dims the rest of the page. Renders a <div> element.\n */\nexport const AlertDialogOverlay = ({ className, ...props }: AlertDialogOverlayProps) => {\n  return (\n    <BaseAlertDialog.Backdrop\n      data-spark-component=\"alert-dialog-overlay\"\n      className={state =>\n        cx(\n          'z-overlay fixed top-0 left-0 h-screen w-screen',\n          'bg-overlay/dim-1',\n          // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n          'data-starting-style:animate-fade-in',\n          'data-ending-style:animate-fade-out',\n          typeof className === 'function' ? className(state) : className\n        )\n      }\n      {...props}\n    />\n  )\n}\n\nAlertDialogOverlay.displayName = 'AlertDialog.Overlay'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type AlertDialogPortalProps = ComponentProps<typeof BaseAlertDialog.Portal>\n\n/**\n * A portal that renders the dialog in a different part of the DOM. Renders a <div> element.\n */\nexport const AlertDialogPortal = ({ className, ...props }: AlertDialogPortalProps) => {\n  return (\n    <BaseAlertDialog.Portal\n      data-spark-component=\"alert-dialog-portal\"\n      className={cx(className, 'z-modal absolute')}\n      {...props}\n    />\n  )\n}\n\nAlertDialogPortal.displayName = 'AlertDialog.Portal'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTitleProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Title>,\n  'render'\n> {\n  ref?: Ref<HTMLHeadingElement>\n}\n\n/**\n * The title of the alert dialog, announced to assistive technology. Renders an <h2> element.\n */\nexport const AlertDialogTitle = ({ className, ...props }: AlertDialogTitleProps) => {\n  return (\n    <BaseAlertDialog.Title\n      data-spark-component=\"alert-dialog-title\"\n      className={cx('text-headline-1 text-on-surface', className)}\n      {...props}\n    />\n  )\n}\n\nAlertDialogTitle.displayName = 'AlertDialog.Title'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTriggerProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Trigger>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that opens the alert dialog. Renders a <button> element.\n */\nexport const AlertDialogTrigger = ({\n  asChild = false,\n  children,\n  ...props\n}: AlertDialogTriggerProps) => {\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseAlertDialog.Trigger\n      data-spark-component=\"alert-dialog-trigger\"\n      render={renderProp}\n      {...props}\n    >\n      {innerChildren}\n    </BaseAlertDialog.Trigger>\n  )\n}\n\nAlertDialogTrigger.displayName = 'AlertDialog.Trigger'\n","import { AlertDialog as Root } from './AlertDialog'\nimport { AlertDialogAction } from './AlertDialogAction'\nimport { AlertDialogBody } from './AlertDialogBody'\nimport { AlertDialogCancel } from './AlertDialogCancel'\nimport { AlertDialogContent } from './AlertDialogContent'\nimport { AlertDialogDescription } from './AlertDialogDescription'\nimport { AlertDialogFooter } from './AlertDialogFooter'\nimport { AlertDialogHeader } from './AlertDialogHeader'\nimport { AlertDialogOverlay } from './AlertDialogOverlay'\nimport { AlertDialogPortal } from './AlertDialogPortal'\nimport { AlertDialogTitle } from './AlertDialogTitle'\nimport { AlertDialogTrigger } from './AlertDialogTrigger'\n\nexport * from './AlertDialog'\nexport { useAlertDialog } from './AlertDialogContext'\nexport { type AlertDialogActionProps } from './AlertDialogAction'\nexport { type AlertDialogBodyProps } from './AlertDialogBody'\nexport { type AlertDialogCancelProps } from './AlertDialogCancel'\nexport { type AlertDialogContentProps } from './AlertDialogContent'\nexport { type AlertDialogDescriptionProps } from './AlertDialogDescription'\nexport { type AlertDialogFooterProps } from './AlertDialogFooter'\nexport { type AlertDialogHeaderProps } from './AlertDialogHeader'\nexport { type AlertDialogOverlayProps } from './AlertDialogOverlay'\nexport { type AlertDialogPortalProps } from './AlertDialogPortal'\nexport { type AlertDialogTitleProps } from './AlertDialogTitle'\nexport { type AlertDialogTriggerProps } from './AlertDialogTrigger'\n\n/**\n * A modal dialog that interrupts the user with important content and requires a response.\n */\nexport const AlertDialog: typeof Root & {\n  Action: typeof AlertDialogAction\n  Body: typeof AlertDialogBody\n  Cancel: typeof AlertDialogCancel\n  Content: typeof AlertDialogContent\n  Description: typeof AlertDialogDescription\n  Footer: typeof AlertDialogFooter\n  Header: typeof AlertDialogHeader\n  Overlay: typeof AlertDialogOverlay\n  Portal: typeof AlertDialogPortal\n  Title: typeof AlertDialogTitle\n  Trigger: typeof AlertDialogTrigger\n} = Object.assign(Root, {\n  Action: AlertDialogAction,\n  Body: AlertDialogBody,\n  Cancel: AlertDialogCancel,\n  Content: AlertDialogContent,\n  Description: AlertDialogDescription,\n  Footer: AlertDialogFooter,\n  Header: AlertDialogHeader,\n  Overlay: AlertDialogOverlay,\n  Portal: AlertDialogPortal,\n  Title: AlertDialogTitle,\n  Trigger: AlertDialogTrigger,\n})\n\nAlertDialog.displayName = 'AlertDialog'\nAlertDialog.Action.displayName = 'AlertDialog.Action'\nAlertDialog.Body.displayName = 'AlertDialog.Body'\nAlertDialog.Cancel.displayName = 'AlertDialog.Cancel'\nAlertDialog.Content.displayName = 'AlertDialog.Content'\nAlertDialog.Description.displayName = 'AlertDialog.Description'\nAlertDialog.Footer.displayName = 'AlertDialog.Footer'\nAlertDialog.Header.displayName = 'AlertDialog.Header'\nAlertDialog.Overlay.displayName = 'AlertDialog.Overlay'\nAlertDialog.Portal.displayName = 'AlertDialog.Portal'\nAlertDialog.Title.displayName = 'AlertDialog.Title'\nAlertDialog.Trigger.displayName = 'AlertDialog.Trigger'\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/alert-dialog/AlertDialogContext.tsx","../../src/alert-dialog/AlertDialog.tsx","../../src/alert-dialog/AlertDialogAction.tsx","../../src/alert-dialog/AlertDialogBody.tsx","../../src/alert-dialog/AlertDialogCancel.tsx","../../src/alert-dialog/AlertDialogContent.tsx","../../src/alert-dialog/AlertDialogDescription.tsx","../../src/alert-dialog/AlertDialogFooter.tsx","../../src/alert-dialog/AlertDialogHeader.tsx","../../src/alert-dialog/AlertDialogOverlay.tsx","../../src/alert-dialog/AlertDialogPortal.tsx","../../src/alert-dialog/AlertDialogTitle.tsx","../../src/alert-dialog/AlertDialogTrigger.tsx","../../src/alert-dialog/index.ts"],"sourcesContent":["import { createContext, MutableRefObject, type ReactNode, useContext } from 'react'\n\nexport interface AlertDialogContextValue {\n  cancelRef: MutableRefObject<HTMLButtonElement | null>\n  withFade: boolean\n}\n\nexport const AlertDialogContext = createContext<AlertDialogContextValue | null>(null)\n\nexport const AlertDialogProvider = ({\n  children,\n  withFade = false,\n  cancelRef,\n}: {\n  children: ReactNode\n  withFade?: boolean\n  cancelRef: MutableRefObject<HTMLButtonElement | null>\n}) => {\n  return (\n    <AlertDialogContext\n      value={{\n        cancelRef,\n        withFade,\n      }}\n    >\n      {children}\n    </AlertDialogContext>\n  )\n}\n\nexport const useAlertDialog = () => {\n  const context = useContext(AlertDialogContext)\n\n  if (!context) {\n    throw Error('useAlertDialog must be used within an AlertDialog provider')\n  }\n\n  return context\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref, useRef } from 'react'\n\nimport { AlertDialogProvider } from './AlertDialogContext'\n\nexport interface AlertDialogProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Root>,\n  'onOpenChange' | 'render'\n> {\n  /**\n   * Specifies if the dialog is open or not.\n   */\n  open?: boolean\n  /**\n   * Default open state.\n   */\n  defaultOpen?: boolean\n  /**\n   * Handler executed on every dialog open state change.\n   */\n  onOpenChange?: (open: boolean) => void\n  /**\n   * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).\n   */\n  withFade?: boolean\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialog = ({ onOpenChange, withFade = false, ...props }: AlertDialogProps) => {\n  const cancelRef = useRef<HTMLButtonElement | null>(null)\n\n  const handleOpenChange = onOpenChange\n    ? (open: boolean, _eventDetails: unknown) => {\n        onOpenChange(open)\n      }\n    : undefined\n\n  return (\n    <AlertDialogProvider withFade={withFade} cancelRef={cancelRef}>\n      <BaseAlertDialog.Root\n        data-spark-component=\"alert-dialog\"\n        onOpenChange={handleOpenChange}\n        {...props}\n      />\n    </AlertDialogProvider>\n  )\n}\n\nAlertDialog.displayName = 'AlertDialog'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogActionProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Close>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog and confirms the action. Renders a <button> element.\n */\nexport const AlertDialogAction = ({\n  asChild = false,\n  children,\n  ...props\n}: AlertDialogActionProps) => {\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseAlertDialog.Close\n      data-spark-component=\"alert-dialog-action\"\n      render={renderProp}\n      {...props}\n    >\n      {innerChildren}\n    </BaseAlertDialog.Close>\n  )\n}\n\nAlertDialogAction.displayName = 'AlertDialog.Action'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref, useRef } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogBodyProps {\n  children: ReactNode\n  className?: string\n  tabIndex?: number\n  ref?: Ref<HTMLDivElement>\n  inset?: boolean\n}\n\n/**\n * The scrollable body section of the alert dialog. Renders a <div> element.\n */\nexport const AlertDialogBody = ({\n  children,\n  className,\n  inset = false,\n  ref: forwardedRef,\n  ...rest\n}: AlertDialogBodyProps): ReactElement => {\n  const scrollAreaRef = useRef<HTMLDivElement>(null)\n  const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n  const { withFade } = useAlertDialog()\n  const { overflow } = useScrollOverflow(scrollAreaRef)\n\n  return (\n    <div\n      data-spark-component=\"alert-dialog-body\"\n      ref={ref}\n      className={cx(\n        'focus-visible:u-outline relative grow overflow-y-auto outline-hidden',\n        'transition-all duration-300',\n        {\n          ['px-xl py-lg']: !inset,\n        },\n        className\n      )}\n      style={{\n        ...(withFade && {\n          maskImage:\n            'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n          maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n          maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n        }),\n      }}\n      {...rest}\n    >\n      {children}\n    </div>\n  )\n}\n\nAlertDialogBody.displayName = 'AlertDialog.Body'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogCancelProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Close>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog without confirming the action. Renders a <button> element.\n */\nexport const AlertDialogCancel = ({\n  asChild = false,\n  ref: forwardedRef,\n  children,\n  ...props\n}: AlertDialogCancelProps) => {\n  const { cancelRef } = useAlertDialog()\n  const ref = useMergeRefs(forwardedRef, cancelRef)\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseAlertDialog.Close\n      ref={ref}\n      data-spark-component=\"alert-dialog-cancel\"\n      render={renderProp}\n      {...props}\n    >\n      {innerChildren}\n    </BaseAlertDialog.Close>\n  )\n}\n\nAlertDialogCancel.displayName = 'AlertDialog.Cancel'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { dialogContentStyles } from '../dialog/DialogContent.styles'\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogContentProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Popup>,\n  'render'\n> {\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The popup element that contains the alert dialog content. Renders a <div> element.\n */\nexport const AlertDialogContent = ({\n  className,\n  ref,\n  initialFocus,\n  ...others\n}: AlertDialogContentProps) => {\n  const { cancelRef } = useAlertDialog()\n\n  // Default: focus the cancel button when dialog opens\n  // Users can override by passing their own initialFocus prop (RefObject, false, true, or function)\n  const handleInitialFocus = initialFocus !== undefined ? initialFocus : () => cancelRef.current\n\n  return (\n    <BaseAlertDialog.Popup\n      ref={ref}\n      data-spark-component=\"alert-dialog-content\"\n      role=\"alertdialog\"\n      className={state =>\n        cx(\n          dialogContentStyles({ size: 'md', isNarrow: true }),\n          'min-w-[min(288px,calc(100vw-var(--spacing-sz-32)))]',\n          // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n          // Transition with opacity and scale for smooth open/close animations\n          'transition-all duration-150',\n          'data-starting-style:scale-90 data-starting-style:opacity-0',\n          'data-ending-style:scale-90 data-ending-style:opacity-0',\n          typeof className === 'function' ? className(state) : className\n        )\n      }\n      initialFocus={handleInitialFocus}\n      {...others}\n    />\n  )\n}\n\nAlertDialogContent.displayName = 'AlertDialog.Content'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogDescriptionProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Description>,\n  'render'\n> {\n  ref?: Ref<HTMLParagraphElement>\n}\n\n/**\n * A paragraph with additional information about the dialog. Renders a <p> element.\n */\nexport const AlertDialogDescription = (props: AlertDialogDescriptionProps) => {\n  return <BaseAlertDialog.Description data-spark-component=\"alert-dialog-description\" {...props} />\n}\n\nAlertDialogDescription.displayName = 'AlertDialog.Description'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogFooterProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The footer section of the alert dialog, typically containing action buttons. Renders a <footer> element.\n */\nexport const AlertDialogFooter = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: AlertDialogFooterProps): ReactElement => (\n  <footer\n    data-spark-component=\"alert-dialog-footer\"\n    ref={ref}\n    className={cx(className, ['px-xl', 'py-lg'])}\n    {...rest}\n  >\n    {children}\n  </footer>\n)\n\nAlertDialogFooter.displayName = 'AlertDialog.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogHeaderProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The header section of the alert dialog. Renders a <header> element.\n */\nexport const AlertDialogHeader = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: AlertDialogHeaderProps): ReactElement => (\n  <header\n    data-spark-component=\"alert-dialog-header\"\n    ref={ref}\n    className={cx(className, ['px-xl', 'py-lg'])}\n    {...rest}\n  >\n    {children}\n  </header>\n)\n\nAlertDialogHeader.displayName = 'AlertDialog.Header'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogOverlayProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Backdrop>,\n  'render'\n> {\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The backdrop element that dims the rest of the page. Renders a <div> element.\n */\nexport const AlertDialogOverlay = ({ className, ...props }: AlertDialogOverlayProps) => {\n  return (\n    <BaseAlertDialog.Backdrop\n      data-spark-component=\"alert-dialog-overlay\"\n      className={state =>\n        cx(\n          'z-overlay fixed top-0 left-0 h-screen w-screen',\n          'bg-overlay/dim-1',\n          // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n          'data-starting-style:animate-fade-in',\n          'data-ending-style:animate-fade-out',\n          typeof className === 'function' ? className(state) : className\n        )\n      }\n      {...props}\n    />\n  )\n}\n\nAlertDialogOverlay.displayName = 'AlertDialog.Overlay'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type AlertDialogPortalProps = ComponentProps<typeof BaseAlertDialog.Portal>\n\n/**\n * A portal that renders the dialog in a different part of the DOM. Renders a <div> element.\n */\nexport const AlertDialogPortal = ({ className, ...props }: AlertDialogPortalProps) => {\n  return (\n    <BaseAlertDialog.Portal\n      data-spark-component=\"alert-dialog-portal\"\n      className={cx(className, 'z-modal absolute')}\n      {...props}\n    />\n  )\n}\n\nAlertDialogPortal.displayName = 'AlertDialog.Portal'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTitleProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Title>,\n  'render'\n> {\n  ref?: Ref<HTMLHeadingElement>\n}\n\n/**\n * The title of the alert dialog, announced to assistive technology. Renders an <h2> element.\n */\nexport const AlertDialogTitle = ({ className, ...props }: AlertDialogTitleProps) => {\n  return (\n    <BaseAlertDialog.Title\n      data-spark-component=\"alert-dialog-title\"\n      className={cx('text-headline-1 text-on-surface', className)}\n      {...props}\n    />\n  )\n}\n\nAlertDialogTitle.displayName = 'AlertDialog.Title'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTriggerProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Trigger>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that opens the alert dialog. Renders a <button> element.\n */\nexport const AlertDialogTrigger = ({\n  asChild = false,\n  children,\n  ...props\n}: AlertDialogTriggerProps) => {\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseAlertDialog.Trigger\n      data-spark-component=\"alert-dialog-trigger\"\n      render={renderProp}\n      {...props}\n    >\n      {innerChildren}\n    </BaseAlertDialog.Trigger>\n  )\n}\n\nAlertDialogTrigger.displayName = 'AlertDialog.Trigger'\n","import { AlertDialog as Root } from './AlertDialog'\nimport { AlertDialogAction } from './AlertDialogAction'\nimport { AlertDialogBody } from './AlertDialogBody'\nimport { AlertDialogCancel } from './AlertDialogCancel'\nimport { AlertDialogContent } from './AlertDialogContent'\nimport { AlertDialogDescription } from './AlertDialogDescription'\nimport { AlertDialogFooter } from './AlertDialogFooter'\nimport { AlertDialogHeader } from './AlertDialogHeader'\nimport { AlertDialogOverlay } from './AlertDialogOverlay'\nimport { AlertDialogPortal } from './AlertDialogPortal'\nimport { AlertDialogTitle } from './AlertDialogTitle'\nimport { AlertDialogTrigger } from './AlertDialogTrigger'\n\nexport * from './AlertDialog'\nexport { useAlertDialog } from './AlertDialogContext'\nexport { type AlertDialogActionProps } from './AlertDialogAction'\nexport { type AlertDialogBodyProps } from './AlertDialogBody'\nexport { type AlertDialogCancelProps } from './AlertDialogCancel'\nexport { type AlertDialogContentProps } from './AlertDialogContent'\nexport { type AlertDialogDescriptionProps } from './AlertDialogDescription'\nexport { type AlertDialogFooterProps } from './AlertDialogFooter'\nexport { type AlertDialogHeaderProps } from './AlertDialogHeader'\nexport { type AlertDialogOverlayProps } from './AlertDialogOverlay'\nexport { type AlertDialogPortalProps } from './AlertDialogPortal'\nexport { type AlertDialogTitleProps } from './AlertDialogTitle'\nexport { type AlertDialogTriggerProps } from './AlertDialogTrigger'\n\n/**\n * A modal dialog that interrupts the user with important content and requires a response.\n */\nexport const AlertDialog: typeof Root & {\n  Action: typeof AlertDialogAction\n  Body: typeof AlertDialogBody\n  Cancel: typeof AlertDialogCancel\n  Content: typeof AlertDialogContent\n  Description: typeof AlertDialogDescription\n  Footer: typeof AlertDialogFooter\n  Header: typeof AlertDialogHeader\n  Overlay: typeof AlertDialogOverlay\n  Portal: typeof AlertDialogPortal\n  Title: typeof AlertDialogTitle\n  Trigger: typeof AlertDialogTrigger\n} = Object.assign(Root, {\n  Action: AlertDialogAction,\n  Body: AlertDialogBody,\n  Cancel: AlertDialogCancel,\n  Content: AlertDialogContent,\n  Description: AlertDialogDescription,\n  Footer: AlertDialogFooter,\n  Header: AlertDialogHeader,\n  Overlay: AlertDialogOverlay,\n  Portal: AlertDialogPortal,\n  Title: AlertDialogTitle,\n  Trigger: AlertDialogTrigger,\n})\n\nAlertDialog.displayName = 'AlertDialog'\nAlertDialog.Action.displayName = 'AlertDialog.Action'\nAlertDialog.Body.displayName = 'AlertDialog.Body'\nAlertDialog.Cancel.displayName = 'AlertDialog.Cancel'\nAlertDialog.Content.displayName = 'AlertDialog.Content'\nAlertDialog.Description.displayName = 'AlertDialog.Description'\nAlertDialog.Footer.displayName = 'AlertDialog.Footer'\nAlertDialog.Header.displayName = 'AlertDialog.Header'\nAlertDialog.Overlay.displayName = 'AlertDialog.Overlay'\nAlertDialog.Portal.displayName = 'AlertDialog.Portal'\nAlertDialog.Title.displayName = 'AlertDialog.Title'\nAlertDialog.Trigger.displayName = 'AlertDialog.Trigger'\n"],"mappings":"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"}

package/dist/alert-dialog/index.mjs

@@ -1,4 +1,4 @@
-import { t as e } from "../DialogContent.styles-ClKRO43s.mjs";
+import { t as e } from "../DialogContent.styles-BVyH8M3z.mjs";
 import { createRenderSlot as t } from "@spark-ui/internal-utils";
 import { cx as n } from "class-variance-authority";
 import { createContext as r, useContext as i, useRef as a } from "react";
@@ -86,7 +86,7 @@ var _ = ({ className: t, ref: r, initialFocus: i, ...a }) => {
 		className: (r) => n(e({
 			size: "md",
 			isNarrow: !0
-		}), "min-w-[min(288px,calc(100vw-2rem))]", "transition-all duration-150", "data-starting-style:scale-90 data-starting-style:opacity-0", "data-ending-style:scale-90 data-ending-style:opacity-0", typeof t == "function" ? t(r) : t),
+		}), "min-w-[min(288px,calc(100vw-var(--spacing-sz-32)))]", "transition-all duration-150", "data-starting-style:scale-90 data-starting-style:opacity-0", "data-ending-style:scale-90 data-ending-style:opacity-0", typeof t == "function" ? t(r) : t),
 		initialFocus: l,
 		...a
 	});

package/dist/alert-dialog/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../src/alert-dialog/AlertDialogContext.tsx","../../src/alert-dialog/AlertDialog.tsx","../../src/alert-dialog/AlertDialogAction.tsx","../../src/alert-dialog/AlertDialogBody.tsx","../../src/alert-dialog/AlertDialogCancel.tsx","../../src/alert-dialog/AlertDialogContent.tsx","../../src/alert-dialog/AlertDialogDescription.tsx","../../src/alert-dialog/AlertDialogFooter.tsx","../../src/alert-dialog/AlertDialogHeader.tsx","../../src/alert-dialog/AlertDialogOverlay.tsx","../../src/alert-dialog/AlertDialogPortal.tsx","../../src/alert-dialog/AlertDialogTitle.tsx","../../src/alert-dialog/AlertDialogTrigger.tsx","../../src/alert-dialog/index.ts"],"sourcesContent":["import { createContext, MutableRefObject, type ReactNode, useContext } from 'react'\n\nexport interface AlertDialogContextValue {\n  cancelRef: MutableRefObject<HTMLButtonElement | null>\n  withFade: boolean\n}\n\nexport const AlertDialogContext = createContext<AlertDialogContextValue | null>(null)\n\nexport const AlertDialogProvider = ({\n  children,\n  withFade = false,\n  cancelRef,\n}: {\n  children: ReactNode\n  withFade?: boolean\n  cancelRef: MutableRefObject<HTMLButtonElement | null>\n}) => {\n  return (\n    <AlertDialogContext\n      value={{\n        cancelRef,\n        withFade,\n      }}\n    >\n      {children}\n    </AlertDialogContext>\n  )\n}\n\nexport const useAlertDialog = () => {\n  const context = useContext(AlertDialogContext)\n\n  if (!context) {\n    throw Error('useAlertDialog must be used within an AlertDialog provider')\n  }\n\n  return context\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref, useRef } from 'react'\n\nimport { AlertDialogProvider } from './AlertDialogContext'\n\nexport interface AlertDialogProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Root>,\n  'onOpenChange' | 'render'\n> {\n  /**\n   * Specifies if the dialog is open or not.\n   */\n  open?: boolean\n  /**\n   * Default open state.\n   */\n  defaultOpen?: boolean\n  /**\n   * Handler executed on every dialog open state change.\n   */\n  onOpenChange?: (open: boolean) => void\n  /**\n   * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).\n   */\n  withFade?: boolean\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialog = ({ onOpenChange, withFade = false, ...props }: AlertDialogProps) => {\n  const cancelRef = useRef<HTMLButtonElement | null>(null)\n\n  const handleOpenChange = onOpenChange\n    ? (open: boolean, _eventDetails: unknown) => {\n        onOpenChange(open)\n      }\n    : undefined\n\n  return (\n    <AlertDialogProvider withFade={withFade} cancelRef={cancelRef}>\n      <BaseAlertDialog.Root\n        data-spark-component=\"alert-dialog\"\n        onOpenChange={handleOpenChange}\n        {...props}\n      />\n    </AlertDialogProvider>\n  )\n}\n\nAlertDialog.displayName = 'AlertDialog'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogActionProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Close>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog and confirms the action. Renders a <button> element.\n */\nexport const AlertDialogAction = ({\n  asChild = false,\n  children,\n  ...props\n}: AlertDialogActionProps) => {\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseAlertDialog.Close\n      data-spark-component=\"alert-dialog-action\"\n      render={renderProp}\n      {...props}\n    >\n      {innerChildren}\n    </BaseAlertDialog.Close>\n  )\n}\n\nAlertDialogAction.displayName = 'AlertDialog.Action'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref, useRef } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogBodyProps {\n  children: ReactNode\n  className?: string\n  tabIndex?: number\n  ref?: Ref<HTMLDivElement>\n  inset?: boolean\n}\n\n/**\n * The scrollable body section of the alert dialog. Renders a <div> element.\n */\nexport const AlertDialogBody = ({\n  children,\n  className,\n  inset = false,\n  ref: forwardedRef,\n  ...rest\n}: AlertDialogBodyProps): ReactElement => {\n  const scrollAreaRef = useRef<HTMLDivElement>(null)\n  const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n  const { withFade } = useAlertDialog()\n  const { overflow } = useScrollOverflow(scrollAreaRef)\n\n  return (\n    <div\n      data-spark-component=\"alert-dialog-body\"\n      ref={ref}\n      className={cx(\n        'focus-visible:u-outline relative grow overflow-y-auto outline-hidden',\n        'transition-all duration-300',\n        {\n          ['px-xl py-lg']: !inset,\n        },\n        className\n      )}\n      style={{\n        ...(withFade && {\n          maskImage:\n            'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n          maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n          maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n        }),\n      }}\n      {...rest}\n    >\n      {children}\n    </div>\n  )\n}\n\nAlertDialogBody.displayName = 'AlertDialog.Body'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogCancelProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Close>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog without confirming the action. Renders a <button> element.\n */\nexport const AlertDialogCancel = ({\n  asChild = false,\n  ref: forwardedRef,\n  children,\n  ...props\n}: AlertDialogCancelProps) => {\n  const { cancelRef } = useAlertDialog()\n  const ref = useMergeRefs(forwardedRef, cancelRef)\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseAlertDialog.Close\n      ref={ref}\n      data-spark-component=\"alert-dialog-cancel\"\n      render={renderProp}\n      {...props}\n    >\n      {innerChildren}\n    </BaseAlertDialog.Close>\n  )\n}\n\nAlertDialogCancel.displayName = 'AlertDialog.Cancel'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { dialogContentStyles } from '../dialog/DialogContent.styles'\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogContentProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Popup>,\n  'render'\n> {\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The popup element that contains the alert dialog content. Renders a <div> element.\n */\nexport const AlertDialogContent = ({\n  className,\n  ref,\n  initialFocus,\n  ...others\n}: AlertDialogContentProps) => {\n  const { cancelRef } = useAlertDialog()\n\n  // Default: focus the cancel button when dialog opens\n  // Users can override by passing their own initialFocus prop (RefObject, false, true, or function)\n  const handleInitialFocus = initialFocus !== undefined ? initialFocus : () => cancelRef.current\n\n  return (\n    <BaseAlertDialog.Popup\n      ref={ref}\n      data-spark-component=\"alert-dialog-content\"\n      role=\"alertdialog\"\n      className={state =>\n        cx(\n          dialogContentStyles({ size: 'md', isNarrow: true }),\n          'min-w-[min(288px,calc(100vw-2rem))]',\n          // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n          // Transition with opacity and scale for smooth open/close animations\n          'transition-all duration-150',\n          'data-starting-style:scale-90 data-starting-style:opacity-0',\n          'data-ending-style:scale-90 data-ending-style:opacity-0',\n          typeof className === 'function' ? className(state) : className\n        )\n      }\n      initialFocus={handleInitialFocus}\n      {...others}\n    />\n  )\n}\n\nAlertDialogContent.displayName = 'AlertDialog.Content'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogDescriptionProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Description>,\n  'render'\n> {\n  ref?: Ref<HTMLParagraphElement>\n}\n\n/**\n * A paragraph with additional information about the dialog. Renders a <p> element.\n */\nexport const AlertDialogDescription = (props: AlertDialogDescriptionProps) => {\n  return <BaseAlertDialog.Description data-spark-component=\"alert-dialog-description\" {...props} />\n}\n\nAlertDialogDescription.displayName = 'AlertDialog.Description'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogFooterProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The footer section of the alert dialog, typically containing action buttons. Renders a <footer> element.\n */\nexport const AlertDialogFooter = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: AlertDialogFooterProps): ReactElement => (\n  <footer\n    data-spark-component=\"alert-dialog-footer\"\n    ref={ref}\n    className={cx(className, ['px-xl', 'py-lg'])}\n    {...rest}\n  >\n    {children}\n  </footer>\n)\n\nAlertDialogFooter.displayName = 'AlertDialog.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogHeaderProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The header section of the alert dialog. Renders a <header> element.\n */\nexport const AlertDialogHeader = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: AlertDialogHeaderProps): ReactElement => (\n  <header\n    data-spark-component=\"alert-dialog-header\"\n    ref={ref}\n    className={cx(className, ['px-xl', 'py-lg'])}\n    {...rest}\n  >\n    {children}\n  </header>\n)\n\nAlertDialogHeader.displayName = 'AlertDialog.Header'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogOverlayProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Backdrop>,\n  'render'\n> {\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The backdrop element that dims the rest of the page. Renders a <div> element.\n */\nexport const AlertDialogOverlay = ({ className, ...props }: AlertDialogOverlayProps) => {\n  return (\n    <BaseAlertDialog.Backdrop\n      data-spark-component=\"alert-dialog-overlay\"\n      className={state =>\n        cx(\n          'z-overlay fixed top-0 left-0 h-screen w-screen',\n          'bg-overlay/dim-1',\n          // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n          'data-starting-style:animate-fade-in',\n          'data-ending-style:animate-fade-out',\n          typeof className === 'function' ? className(state) : className\n        )\n      }\n      {...props}\n    />\n  )\n}\n\nAlertDialogOverlay.displayName = 'AlertDialog.Overlay'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type AlertDialogPortalProps = ComponentProps<typeof BaseAlertDialog.Portal>\n\n/**\n * A portal that renders the dialog in a different part of the DOM. Renders a <div> element.\n */\nexport const AlertDialogPortal = ({ className, ...props }: AlertDialogPortalProps) => {\n  return (\n    <BaseAlertDialog.Portal\n      data-spark-component=\"alert-dialog-portal\"\n      className={cx(className, 'z-modal absolute')}\n      {...props}\n    />\n  )\n}\n\nAlertDialogPortal.displayName = 'AlertDialog.Portal'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTitleProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Title>,\n  'render'\n> {\n  ref?: Ref<HTMLHeadingElement>\n}\n\n/**\n * The title of the alert dialog, announced to assistive technology. Renders an <h2> element.\n */\nexport const AlertDialogTitle = ({ className, ...props }: AlertDialogTitleProps) => {\n  return (\n    <BaseAlertDialog.Title\n      data-spark-component=\"alert-dialog-title\"\n      className={cx('text-headline-1 text-on-surface', className)}\n      {...props}\n    />\n  )\n}\n\nAlertDialogTitle.displayName = 'AlertDialog.Title'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTriggerProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Trigger>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that opens the alert dialog. Renders a <button> element.\n */\nexport const AlertDialogTrigger = ({\n  asChild = false,\n  children,\n  ...props\n}: AlertDialogTriggerProps) => {\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseAlertDialog.Trigger\n      data-spark-component=\"alert-dialog-trigger\"\n      render={renderProp}\n      {...props}\n    >\n      {innerChildren}\n    </BaseAlertDialog.Trigger>\n  )\n}\n\nAlertDialogTrigger.displayName = 'AlertDialog.Trigger'\n","import { AlertDialog as Root } from './AlertDialog'\nimport { AlertDialogAction } from './AlertDialogAction'\nimport { AlertDialogBody } from './AlertDialogBody'\nimport { AlertDialogCancel } from './AlertDialogCancel'\nimport { AlertDialogContent } from './AlertDialogContent'\nimport { AlertDialogDescription } from './AlertDialogDescription'\nimport { AlertDialogFooter } from './AlertDialogFooter'\nimport { AlertDialogHeader } from './AlertDialogHeader'\nimport { AlertDialogOverlay } from './AlertDialogOverlay'\nimport { AlertDialogPortal } from './AlertDialogPortal'\nimport { AlertDialogTitle } from './AlertDialogTitle'\nimport { AlertDialogTrigger } from './AlertDialogTrigger'\n\nexport * from './AlertDialog'\nexport { useAlertDialog } from './AlertDialogContext'\nexport { type AlertDialogActionProps } from './AlertDialogAction'\nexport { type AlertDialogBodyProps } from './AlertDialogBody'\nexport { type AlertDialogCancelProps } from './AlertDialogCancel'\nexport { type AlertDialogContentProps } from './AlertDialogContent'\nexport { type AlertDialogDescriptionProps } from './AlertDialogDescription'\nexport { type AlertDialogFooterProps } from './AlertDialogFooter'\nexport { type AlertDialogHeaderProps } from './AlertDialogHeader'\nexport { type AlertDialogOverlayProps } from './AlertDialogOverlay'\nexport { type AlertDialogPortalProps } from './AlertDialogPortal'\nexport { type AlertDialogTitleProps } from './AlertDialogTitle'\nexport { type AlertDialogTriggerProps } from './AlertDialogTrigger'\n\n/**\n * A modal dialog that interrupts the user with important content and requires a response.\n */\nexport const AlertDialog: typeof Root & {\n  Action: typeof AlertDialogAction\n  Body: typeof AlertDialogBody\n  Cancel: typeof AlertDialogCancel\n  Content: typeof AlertDialogContent\n  Description: typeof AlertDialogDescription\n  Footer: typeof AlertDialogFooter\n  Header: typeof AlertDialogHeader\n  Overlay: typeof AlertDialogOverlay\n  Portal: typeof AlertDialogPortal\n  Title: typeof AlertDialogTitle\n  Trigger: typeof AlertDialogTrigger\n} = Object.assign(Root, {\n  Action: AlertDialogAction,\n  Body: AlertDialogBody,\n  Cancel: AlertDialogCancel,\n  Content: AlertDialogContent,\n  Description: AlertDialogDescription,\n  Footer: AlertDialogFooter,\n  Header: AlertDialogHeader,\n  Overlay: AlertDialogOverlay,\n  Portal: AlertDialogPortal,\n  Title: AlertDialogTitle,\n  Trigger: AlertDialogTrigger,\n})\n\nAlertDialog.displayName = 'AlertDialog'\nAlertDialog.Action.displayName = 'AlertDialog.Action'\nAlertDialog.Body.displayName = 'AlertDialog.Body'\nAlertDialog.Cancel.displayName = 'AlertDialog.Cancel'\nAlertDialog.Content.displayName = 'AlertDialog.Content'\nAlertDialog.Description.displayName = 'AlertDialog.Description'\nAlertDialog.Footer.displayName = 'AlertDialog.Footer'\nAlertDialog.Header.displayName = 'AlertDialog.Header'\nAlertDialog.Overlay.displayName = 'AlertDialog.Overlay'\nAlertDialog.Portal.displayName = 'AlertDialog.Portal'\nAlertDialog.Title.displayName = 'AlertDialog.Title'\nAlertDialog.Trigger.displayName = 'AlertDialog.Trigger'\n"],"mappings":";;;;;;;;;AAOA,IAAa,IAAqB,EAA8C,IAAI,GAEvE,KAAuB,EAClC,aACA,cAAW,IACX,mBAOE,kBAAC,GAAD;CACE,OAAO;EACL;EACA;CACF;CAEC;AACiB,CAAA,GAIX,UAAuB;CAClC,IAAM,IAAU,EAAW,CAAkB;CAE7C,IAAI,CAAC,GACH,MAAM,MAAM,4DAA4D;CAG1E,OAAO;AACT,GCNa,KAAe,EAAE,iBAAc,cAAW,IAAO,GAAG,QAA8B;CAC7F,IAAM,IAAY,EAAiC,IAAI,GAEjD,IAAmB,KACpB,GAAe,MAA2B;EACzC,EAAa,CAAI;CACnB,IACA,KAAA;CAEJ,OACE,kBAAC,GAAD;EAA+B;EAAqB;YAClD,kBAAC,EAAgB,MAAjB;GACE,wBAAqB;GACrB,cAAc;GACd,GAAI;EACL,CAAA;CACkB,CAAA;AAEzB;AAEA,EAAY,cAAc;;;AClC1B,IAAa,KAAqB,EAChC,aAAU,IACV,aACA,GAAG,QACyB;CAC5B,IAAM,EAAE,eAAY,qBAAkB,EAAiB,GAAS,CAAQ;CAExE,OACE,kBAAC,EAAgB,OAAjB;EACE,wBAAqB;EACrB,QAAQ;EACR,GAAI;YAEH;CACoB,CAAA;AAE3B;AAEA,EAAkB,cAAc;;;AClBhC,IAAa,KAAmB,EAC9B,aACA,cACA,WAAQ,IACR,KAAK,GACL,GAAG,QACqC;CACxC,IAAM,IAAgB,EAAuB,IAAI,GAC3C,IAAM,EAAa,GAAc,CAAa,GAE9C,EAAE,gBAAa,EAAe,GAC9B,EAAE,gBAAa,EAAkB,CAAa;CAEpD,OACE,kBAAC,OAAD;EACE,wBAAqB;EAChB;EACL,WAAW,EACT,wEACA,+BACA,EACG,eAAgB,CAAC,EACpB,GACA,CACF;EACA,OAAO,EACL,GAAI,KAAY;GACd,WACE;GACF,UAAU,oBAAoB,EAAS,MAAM,QAAQ,OAAO,KAAK,EAAS,SAAS,QAAQ,OAAO;GAClG,cAAc,KAAK,EAAS,MAAM,QAAQ;EAC5C,EACF;EACA,GAAI;EAEH;CACE,CAAA;AAET;AAEA,EAAgB,cAAc;;;ACrC9B,IAAa,KAAqB,EAChC,aAAU,IACV,KAAK,GACL,aACA,GAAG,QACyB;CAC5B,IAAM,EAAE,iBAAc,EAAe,GAC/B,IAAM,EAAa,GAAc,CAAS,GAC1C,EAAE,eAAY,qBAAkB,EAAiB,GAAS,CAAQ;CAExE,OACE,kBAAC,EAAgB,OAAjB;EACO;EACL,wBAAqB;EACrB,QAAQ;EACR,GAAI;YAEH;CACoB,CAAA;AAE3B;AAEA,EAAkB,cAAc;;;AC1BhC,IAAa,KAAsB,EACjC,cACA,QACA,iBACA,GAAG,QAC0B;CAC7B,IAAM,EAAE,iBAAc,EAAe,GAI/B,IAAqB,MAAiB,KAAA,UAAiC,EAAU,UAA/B;CAExD,OACE,kBAAC,EAAgB,OAAjB;EACO;EACL,wBAAqB;EACrB,MAAK;EACL,YAAW,MACT,EACE,EAAoB;GAAE,MAAM;GAAM,UAAU;EAAK,CAAC,GAClD,uCAGA,+BACA,8DACA,0DACA,OAAO,KAAc,aAAa,EAAU,CAAK,IAAI,CACvD;EAEF,cAAc;EACd,GAAI;CACL,CAAA;AAEL;AAEA,EAAmB,cAAc;;;ACvCjC,IAAa,KAA0B,MAC9B,kBAAC,EAAgB,aAAjB;CAA6B,wBAAqB;CAA2B,GAAI;AAAQ,CAAA;AAGlG,EAAuB,cAAc;;;ACLrC,IAAa,KAAqB,EAChC,aACA,cACA,QACA,GAAG,QAEH,kBAAC,UAAD;CACE,wBAAqB;CAChB;CACL,WAAW,EAAG,GAAW,CAAC,SAAS,OAAO,CAAC;CAC3C,GAAI;CAEH;AACK,CAAA;AAGV,EAAkB,cAAc;;;AChBhC,IAAa,KAAqB,EAChC,aACA,cACA,QACA,GAAG,QAEH,kBAAC,UAAD;CACE,wBAAqB;CAChB;CACL,WAAW,EAAG,GAAW,CAAC,SAAS,OAAO,CAAC;CAC3C,GAAI;CAEH;AACK,CAAA;AAGV,EAAkB,cAAc;;;ACdhC,IAAa,KAAsB,EAAE,cAAW,GAAG,QAE/C,kBAAC,EAAgB,UAAjB;CACE,wBAAqB;CACrB,YAAW,MACT,EACE,kDACA,oBAEA,uCACA,sCACA,OAAO,KAAc,aAAa,EAAU,CAAK,IAAI,CACvD;CAEF,GAAI;AACL,CAAA;AAIL,EAAmB,cAAc;;;ACxBjC,IAAa,KAAqB,EAAE,cAAW,GAAG,QAE9C,kBAAC,EAAgB,QAAjB;CACE,wBAAqB;CACrB,WAAW,EAAG,GAAW,kBAAkB;CAC3C,GAAI;AACL,CAAA;AAIL,EAAkB,cAAc;;;ACLhC,IAAa,KAAoB,EAAE,cAAW,GAAG,QAE7C,kBAAC,EAAgB,OAAjB;CACE,wBAAqB;CACrB,WAAW,EAAG,mCAAmC,CAAS;CAC1D,GAAI;AACL,CAAA;AAIL,EAAiB,cAAc;;;ACN/B,IAAa,KAAsB,EACjC,aAAU,IACV,aACA,GAAG,QAC0B;CAC7B,IAAM,EAAE,eAAY,qBAAkB,EAAiB,GAAS,CAAQ;CAExE,OACE,kBAAC,EAAgB,SAAjB;EACE,wBAAqB;EACrB,QAAQ;EACR,GAAI;YAEH;CACsB,CAAA;AAE7B;AAEA,EAAmB,cAAc;;;ACNjC,IAAa,IAYT,OAAO,OAAO,GAAM;CACtB,QAAQ;CACR,MAAM;CACN,QAAQ;CACR,SAAS;CACT,aAAa;CACb,QAAQ;CACR,QAAQ;CACR,SAAS;CACT,QAAQ;CACR,OAAO;CACP,SAAS;AACX,CAAC;AAED,EAAY,cAAc,eAC1B,EAAY,OAAO,cAAc,sBACjC,EAAY,KAAK,cAAc,oBAC/B,EAAY,OAAO,cAAc,sBACjC,EAAY,QAAQ,cAAc,uBAClC,EAAY,YAAY,cAAc,2BACtC,EAAY,OAAO,cAAc,sBACjC,EAAY,OAAO,cAAc,sBACjC,EAAY,QAAQ,cAAc,uBAClC,EAAY,OAAO,cAAc,sBACjC,EAAY,MAAM,cAAc,qBAChC,EAAY,QAAQ,cAAc"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../src/alert-dialog/AlertDialogContext.tsx","../../src/alert-dialog/AlertDialog.tsx","../../src/alert-dialog/AlertDialogAction.tsx","../../src/alert-dialog/AlertDialogBody.tsx","../../src/alert-dialog/AlertDialogCancel.tsx","../../src/alert-dialog/AlertDialogContent.tsx","../../src/alert-dialog/AlertDialogDescription.tsx","../../src/alert-dialog/AlertDialogFooter.tsx","../../src/alert-dialog/AlertDialogHeader.tsx","../../src/alert-dialog/AlertDialogOverlay.tsx","../../src/alert-dialog/AlertDialogPortal.tsx","../../src/alert-dialog/AlertDialogTitle.tsx","../../src/alert-dialog/AlertDialogTrigger.tsx","../../src/alert-dialog/index.ts"],"sourcesContent":["import { createContext, MutableRefObject, type ReactNode, useContext } from 'react'\n\nexport interface AlertDialogContextValue {\n  cancelRef: MutableRefObject<HTMLButtonElement | null>\n  withFade: boolean\n}\n\nexport const AlertDialogContext = createContext<AlertDialogContextValue | null>(null)\n\nexport const AlertDialogProvider = ({\n  children,\n  withFade = false,\n  cancelRef,\n}: {\n  children: ReactNode\n  withFade?: boolean\n  cancelRef: MutableRefObject<HTMLButtonElement | null>\n}) => {\n  return (\n    <AlertDialogContext\n      value={{\n        cancelRef,\n        withFade,\n      }}\n    >\n      {children}\n    </AlertDialogContext>\n  )\n}\n\nexport const useAlertDialog = () => {\n  const context = useContext(AlertDialogContext)\n\n  if (!context) {\n    throw Error('useAlertDialog must be used within an AlertDialog provider')\n  }\n\n  return context\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref, useRef } from 'react'\n\nimport { AlertDialogProvider } from './AlertDialogContext'\n\nexport interface AlertDialogProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Root>,\n  'onOpenChange' | 'render'\n> {\n  /**\n   * Specifies if the dialog is open or not.\n   */\n  open?: boolean\n  /**\n   * Default open state.\n   */\n  defaultOpen?: boolean\n  /**\n   * Handler executed on every dialog open state change.\n   */\n  onOpenChange?: (open: boolean) => void\n  /**\n   * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).\n   */\n  withFade?: boolean\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialog = ({ onOpenChange, withFade = false, ...props }: AlertDialogProps) => {\n  const cancelRef = useRef<HTMLButtonElement | null>(null)\n\n  const handleOpenChange = onOpenChange\n    ? (open: boolean, _eventDetails: unknown) => {\n        onOpenChange(open)\n      }\n    : undefined\n\n  return (\n    <AlertDialogProvider withFade={withFade} cancelRef={cancelRef}>\n      <BaseAlertDialog.Root\n        data-spark-component=\"alert-dialog\"\n        onOpenChange={handleOpenChange}\n        {...props}\n      />\n    </AlertDialogProvider>\n  )\n}\n\nAlertDialog.displayName = 'AlertDialog'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogActionProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Close>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog and confirms the action. Renders a <button> element.\n */\nexport const AlertDialogAction = ({\n  asChild = false,\n  children,\n  ...props\n}: AlertDialogActionProps) => {\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseAlertDialog.Close\n      data-spark-component=\"alert-dialog-action\"\n      render={renderProp}\n      {...props}\n    >\n      {innerChildren}\n    </BaseAlertDialog.Close>\n  )\n}\n\nAlertDialogAction.displayName = 'AlertDialog.Action'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref, useRef } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogBodyProps {\n  children: ReactNode\n  className?: string\n  tabIndex?: number\n  ref?: Ref<HTMLDivElement>\n  inset?: boolean\n}\n\n/**\n * The scrollable body section of the alert dialog. Renders a <div> element.\n */\nexport const AlertDialogBody = ({\n  children,\n  className,\n  inset = false,\n  ref: forwardedRef,\n  ...rest\n}: AlertDialogBodyProps): ReactElement => {\n  const scrollAreaRef = useRef<HTMLDivElement>(null)\n  const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n  const { withFade } = useAlertDialog()\n  const { overflow } = useScrollOverflow(scrollAreaRef)\n\n  return (\n    <div\n      data-spark-component=\"alert-dialog-body\"\n      ref={ref}\n      className={cx(\n        'focus-visible:u-outline relative grow overflow-y-auto outline-hidden',\n        'transition-all duration-300',\n        {\n          ['px-xl py-lg']: !inset,\n        },\n        className\n      )}\n      style={{\n        ...(withFade && {\n          maskImage:\n            'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n          maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n          maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n        }),\n      }}\n      {...rest}\n    >\n      {children}\n    </div>\n  )\n}\n\nAlertDialogBody.displayName = 'AlertDialog.Body'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogCancelProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Close>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog without confirming the action. Renders a <button> element.\n */\nexport const AlertDialogCancel = ({\n  asChild = false,\n  ref: forwardedRef,\n  children,\n  ...props\n}: AlertDialogCancelProps) => {\n  const { cancelRef } = useAlertDialog()\n  const ref = useMergeRefs(forwardedRef, cancelRef)\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseAlertDialog.Close\n      ref={ref}\n      data-spark-component=\"alert-dialog-cancel\"\n      render={renderProp}\n      {...props}\n    >\n      {innerChildren}\n    </BaseAlertDialog.Close>\n  )\n}\n\nAlertDialogCancel.displayName = 'AlertDialog.Cancel'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { dialogContentStyles } from '../dialog/DialogContent.styles'\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogContentProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Popup>,\n  'render'\n> {\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The popup element that contains the alert dialog content. Renders a <div> element.\n */\nexport const AlertDialogContent = ({\n  className,\n  ref,\n  initialFocus,\n  ...others\n}: AlertDialogContentProps) => {\n  const { cancelRef } = useAlertDialog()\n\n  // Default: focus the cancel button when dialog opens\n  // Users can override by passing their own initialFocus prop (RefObject, false, true, or function)\n  const handleInitialFocus = initialFocus !== undefined ? initialFocus : () => cancelRef.current\n\n  return (\n    <BaseAlertDialog.Popup\n      ref={ref}\n      data-spark-component=\"alert-dialog-content\"\n      role=\"alertdialog\"\n      className={state =>\n        cx(\n          dialogContentStyles({ size: 'md', isNarrow: true }),\n          'min-w-[min(288px,calc(100vw-var(--spacing-sz-32)))]',\n          // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n          // Transition with opacity and scale for smooth open/close animations\n          'transition-all duration-150',\n          'data-starting-style:scale-90 data-starting-style:opacity-0',\n          'data-ending-style:scale-90 data-ending-style:opacity-0',\n          typeof className === 'function' ? className(state) : className\n        )\n      }\n      initialFocus={handleInitialFocus}\n      {...others}\n    />\n  )\n}\n\nAlertDialogContent.displayName = 'AlertDialog.Content'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogDescriptionProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Description>,\n  'render'\n> {\n  ref?: Ref<HTMLParagraphElement>\n}\n\n/**\n * A paragraph with additional information about the dialog. Renders a <p> element.\n */\nexport const AlertDialogDescription = (props: AlertDialogDescriptionProps) => {\n  return <BaseAlertDialog.Description data-spark-component=\"alert-dialog-description\" {...props} />\n}\n\nAlertDialogDescription.displayName = 'AlertDialog.Description'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogFooterProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The footer section of the alert dialog, typically containing action buttons. Renders a <footer> element.\n */\nexport const AlertDialogFooter = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: AlertDialogFooterProps): ReactElement => (\n  <footer\n    data-spark-component=\"alert-dialog-footer\"\n    ref={ref}\n    className={cx(className, ['px-xl', 'py-lg'])}\n    {...rest}\n  >\n    {children}\n  </footer>\n)\n\nAlertDialogFooter.displayName = 'AlertDialog.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogHeaderProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The header section of the alert dialog. Renders a <header> element.\n */\nexport const AlertDialogHeader = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: AlertDialogHeaderProps): ReactElement => (\n  <header\n    data-spark-component=\"alert-dialog-header\"\n    ref={ref}\n    className={cx(className, ['px-xl', 'py-lg'])}\n    {...rest}\n  >\n    {children}\n  </header>\n)\n\nAlertDialogHeader.displayName = 'AlertDialog.Header'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogOverlayProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Backdrop>,\n  'render'\n> {\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The backdrop element that dims the rest of the page. Renders a <div> element.\n */\nexport const AlertDialogOverlay = ({ className, ...props }: AlertDialogOverlayProps) => {\n  return (\n    <BaseAlertDialog.Backdrop\n      data-spark-component=\"alert-dialog-overlay\"\n      className={state =>\n        cx(\n          'z-overlay fixed top-0 left-0 h-screen w-screen',\n          'bg-overlay/dim-1',\n          // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n          'data-starting-style:animate-fade-in',\n          'data-ending-style:animate-fade-out',\n          typeof className === 'function' ? className(state) : className\n        )\n      }\n      {...props}\n    />\n  )\n}\n\nAlertDialogOverlay.displayName = 'AlertDialog.Overlay'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type AlertDialogPortalProps = ComponentProps<typeof BaseAlertDialog.Portal>\n\n/**\n * A portal that renders the dialog in a different part of the DOM. Renders a <div> element.\n */\nexport const AlertDialogPortal = ({ className, ...props }: AlertDialogPortalProps) => {\n  return (\n    <BaseAlertDialog.Portal\n      data-spark-component=\"alert-dialog-portal\"\n      className={cx(className, 'z-modal absolute')}\n      {...props}\n    />\n  )\n}\n\nAlertDialogPortal.displayName = 'AlertDialog.Portal'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTitleProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Title>,\n  'render'\n> {\n  ref?: Ref<HTMLHeadingElement>\n}\n\n/**\n * The title of the alert dialog, announced to assistive technology. Renders an <h2> element.\n */\nexport const AlertDialogTitle = ({ className, ...props }: AlertDialogTitleProps) => {\n  return (\n    <BaseAlertDialog.Title\n      data-spark-component=\"alert-dialog-title\"\n      className={cx('text-headline-1 text-on-surface', className)}\n      {...props}\n    />\n  )\n}\n\nAlertDialogTitle.displayName = 'AlertDialog.Title'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTriggerProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Trigger>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that opens the alert dialog. Renders a <button> element.\n */\nexport const AlertDialogTrigger = ({\n  asChild = false,\n  children,\n  ...props\n}: AlertDialogTriggerProps) => {\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseAlertDialog.Trigger\n      data-spark-component=\"alert-dialog-trigger\"\n      render={renderProp}\n      {...props}\n    >\n      {innerChildren}\n    </BaseAlertDialog.Trigger>\n  )\n}\n\nAlertDialogTrigger.displayName = 'AlertDialog.Trigger'\n","import { AlertDialog as Root } from './AlertDialog'\nimport { AlertDialogAction } from './AlertDialogAction'\nimport { AlertDialogBody } from './AlertDialogBody'\nimport { AlertDialogCancel } from './AlertDialogCancel'\nimport { AlertDialogContent } from './AlertDialogContent'\nimport { AlertDialogDescription } from './AlertDialogDescription'\nimport { AlertDialogFooter } from './AlertDialogFooter'\nimport { AlertDialogHeader } from './AlertDialogHeader'\nimport { AlertDialogOverlay } from './AlertDialogOverlay'\nimport { AlertDialogPortal } from './AlertDialogPortal'\nimport { AlertDialogTitle } from './AlertDialogTitle'\nimport { AlertDialogTrigger } from './AlertDialogTrigger'\n\nexport * from './AlertDialog'\nexport { useAlertDialog } from './AlertDialogContext'\nexport { type AlertDialogActionProps } from './AlertDialogAction'\nexport { type AlertDialogBodyProps } from './AlertDialogBody'\nexport { type AlertDialogCancelProps } from './AlertDialogCancel'\nexport { type AlertDialogContentProps } from './AlertDialogContent'\nexport { type AlertDialogDescriptionProps } from './AlertDialogDescription'\nexport { type AlertDialogFooterProps } from './AlertDialogFooter'\nexport { type AlertDialogHeaderProps } from './AlertDialogHeader'\nexport { type AlertDialogOverlayProps } from './AlertDialogOverlay'\nexport { type AlertDialogPortalProps } from './AlertDialogPortal'\nexport { type AlertDialogTitleProps } from './AlertDialogTitle'\nexport { type AlertDialogTriggerProps } from './AlertDialogTrigger'\n\n/**\n * A modal dialog that interrupts the user with important content and requires a response.\n */\nexport const AlertDialog: typeof Root & {\n  Action: typeof AlertDialogAction\n  Body: typeof AlertDialogBody\n  Cancel: typeof AlertDialogCancel\n  Content: typeof AlertDialogContent\n  Description: typeof AlertDialogDescription\n  Footer: typeof AlertDialogFooter\n  Header: typeof AlertDialogHeader\n  Overlay: typeof AlertDialogOverlay\n  Portal: typeof AlertDialogPortal\n  Title: typeof AlertDialogTitle\n  Trigger: typeof AlertDialogTrigger\n} = Object.assign(Root, {\n  Action: AlertDialogAction,\n  Body: AlertDialogBody,\n  Cancel: AlertDialogCancel,\n  Content: AlertDialogContent,\n  Description: AlertDialogDescription,\n  Footer: AlertDialogFooter,\n  Header: AlertDialogHeader,\n  Overlay: AlertDialogOverlay,\n  Portal: AlertDialogPortal,\n  Title: AlertDialogTitle,\n  Trigger: AlertDialogTrigger,\n})\n\nAlertDialog.displayName = 'AlertDialog'\nAlertDialog.Action.displayName = 'AlertDialog.Action'\nAlertDialog.Body.displayName = 'AlertDialog.Body'\nAlertDialog.Cancel.displayName = 'AlertDialog.Cancel'\nAlertDialog.Content.displayName = 'AlertDialog.Content'\nAlertDialog.Description.displayName = 'AlertDialog.Description'\nAlertDialog.Footer.displayName = 'AlertDialog.Footer'\nAlertDialog.Header.displayName = 'AlertDialog.Header'\nAlertDialog.Overlay.displayName = 'AlertDialog.Overlay'\nAlertDialog.Portal.displayName = 'AlertDialog.Portal'\nAlertDialog.Title.displayName = 'AlertDialog.Title'\nAlertDialog.Trigger.displayName = 'AlertDialog.Trigger'\n"],"mappings":"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"}

package/dist/dialog/index.js

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../icon-CfEsla9z.js"),t=require("../DialogContent.styles-FnwXayCC.js"),n=require("../icon-button-B2TM0Xby.js");let r=require("@spark-ui/internal-utils"),i=require("class-variance-authority"),a=require("react"),o=require("react/jsx-runtime"),s=require("@spark-ui/hooks/use-merge-refs"),c=require("@spark-ui/hooks/use-scroll-overflow"),l=require("@spark-ui/icons/Close"),u=require("@base-ui/react/dialog");var d=(0,a.createContext)(null),f=({children:e,withFade:t=!1})=>{let[n,r]=(0,a.useState)(!1);return(0,o.jsx)(d,{value:{isFullScreen:n,setIsFullScreen:r,withFade:t},children:e})},p=()=>{let e=(0,a.useContext)(d);if(!e)throw Error(`useDialog must be used within a Dialog provider`);return e},m=({withFade:e=!1,onOpenChange:t,...n})=>{let r=t?(e,n)=>{t(e)}:void 0;return(0,o.jsx)(f,{withFade:e,children:(0,o.jsx)(u.Dialog.Root,{"data-spark-component":`dialog`,onOpenChange:r,...n})})};m.createHandle=u.Dialog.createHandle,m.displayName=`Dialog.Root`;var h=({children:e,className:t,inset:n=!1,ref:r,...l})=>{let u=(0,a.useRef)(null),d=(0,s.useMergeRefs)(r,u),{withFade:f}=p(),{overflow:m}=(0,c.useScrollOverflow)(u);return(0,o.jsx)(`div`,{"data-spark-component":`dialog-body`,ref:d,className:(0,i.cx)(`focus-visible:u-outline relative grow overflow-y-auto outline-hidden`,`transition-all duration-300`,{"px-xl py-lg":!n},t),style:{...f&&{maskImage:`linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))`,maskSize:`100% calc(100% + ${m.top?`0px`:`44px`} + ${m.bottom?`0px`:`44px`})`,maskPosition:`0 ${m.top?`0px`:`-44px`}`}},...l,children:e})};h.displayName=`Dialog.Body`;var g=({asChild:e=!1,children:t,...n})=>{let{renderProp:i,innerChildren:a}=(0,r.createRenderSlot)(e,t);return(0,o.jsx)(u.Dialog.Close,{"data-spark-component":`dialog-close`,render:i,...n,children:a})},_=({"aria-label":t,className:r,size:a=`md`,intent:s=`neutral`,design:c=`ghost`,children:u=(0,o.jsx)(l.Close,{}),ref:d,...f})=>(0,o.jsx)(g,{"data-spark-component":`dialog-close-button`,"data-part":`close`,ref:d,className:(0,i.cx)([`absolute`,`top-md`,`right-xl`],r),asChild:!0,...f,children:(0,o.jsx)(n.t,{intent:s,size:a,design:c,"aria-label":t,children:(0,o.jsx)(e.t,{children:u})})}),v=Object.assign(_,{id:`CloseButton`});_.displayName=`Dialog.CloseButton`;var y=({className:e,isNarrow:n=!1,size:r=`md`,ref:s,...c})=>{let{setIsFullScreen:l}=p();return(0,a.useEffect)(()=>(r===`fullscreen`&&l(!0),()=>l(!1)),[l,r]),(0,o.jsx)(u.Dialog.Popup,{ref:s,"data-spark-component":`dialog-content`,role:`dialog`,className:a=>(0,i.cx)(t.t({isNarrow:n,size:r,className:typeof e==`function`?e(a):e})),...c})};y.displayName=`Dialog.Content`;var b=e=>(0,o.jsx)(u.Dialog.Description,{"data-spark-component":`dialog-description`,...e});b.displayName=`Dialog.Description`;var x=({children:e,className:t,ref:n,...r})=>(0,o.jsx)(`footer`,{"data-spark-component":`dialog-footer`,ref:n,className:(0,i.cx)(t,[`px-xl`,`py-lg`]),...r,children:e});x.displayName=`Dialog.Footer`;var S=({children:e,className:t,ref:n,...r})=>(0,o.jsx)(`header`,{"data-spark-component":`dialog-header`,ref:n,className:(0,i.cx)(t,[`px-xl`,`py-lg`]),...r,children:e});S.displayName=`Dialog.Header`;var C=({className:e,...t})=>(0,o.jsx)(u.Dialog.Backdrop,{"data-spark-component":`dialog-overlay`,className:t=>(0,i.cx)(`z-overlay size-screen fixed inset-0`,`bg-overlay/dim-1`,`data-starting-style:animate-fade-in`,`data-ending-style:animate-fade-out`,typeof e==`function`?e(t):e),...t});C.displayName=`Dialog.Overlay`;var w=({className:e,...t})=>(0,o.jsx)(u.Dialog.Portal,{"data-spark-component":`dialog-portal`,className:(0,i.cx)(e,`z-modal absolute`),...t});w.displayName=`Dialog.Portal`;var T=({className:e,ref:t,...n})=>(0,o.jsx)(u.Dialog.Title,{"data-spark-component":`dialog-title`,ref:t,className:(0,i.cx)(`text-headline-1 text-on-surface`,`group-has-data-[part=close]:pr-3xl`,e),...n});T.displayName=`Dialog.Title`;var E=({asChild:e=!1,children:t,...n})=>{let{renderProp:i,innerChildren:a}=(0,r.createRenderSlot)(e,t);return(0,o.jsx)(u.Dialog.Trigger,{"data-spark-component":`dialog-trigger`,render:i,...n,children:a})};E.displayName=`Dialog.Trigger`;var D=Object.assign(m,{Trigger:E,Portal:w,Overlay:C,Content:y,Header:S,Body:h,Footer:x,Close:g,CloseButton:v,Title:T,Description:b});D.displayName=`Dialog`,exports.Dialog=D;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../icon-CfEsla9z.js"),t=require("../DialogContent.styles-Bh6DymkD.js"),n=require("../icon-button-B2TM0Xby.js");let r=require("@spark-ui/internal-utils"),i=require("class-variance-authority"),a=require("react"),o=require("react/jsx-runtime"),s=require("@spark-ui/hooks/use-merge-refs"),c=require("@spark-ui/hooks/use-scroll-overflow"),l=require("@spark-ui/icons/Close"),u=require("@base-ui/react/dialog");var d=(0,a.createContext)(null),f=({children:e,withFade:t=!1})=>{let[n,r]=(0,a.useState)(!1);return(0,o.jsx)(d,{value:{isFullScreen:n,setIsFullScreen:r,withFade:t},children:e})},p=()=>{let e=(0,a.useContext)(d);if(!e)throw Error(`useDialog must be used within a Dialog provider`);return e},m=({withFade:e=!1,onOpenChange:t,...n})=>{let r=t?(e,n)=>{t(e)}:void 0;return(0,o.jsx)(f,{withFade:e,children:(0,o.jsx)(u.Dialog.Root,{"data-spark-component":`dialog`,onOpenChange:r,...n})})};m.createHandle=u.Dialog.createHandle,m.displayName=`Dialog.Root`;var h=({children:e,className:t,inset:n=!1,ref:r,...l})=>{let u=(0,a.useRef)(null),d=(0,s.useMergeRefs)(r,u),{withFade:f}=p(),{overflow:m}=(0,c.useScrollOverflow)(u);return(0,o.jsx)(`div`,{"data-spark-component":`dialog-body`,ref:d,className:(0,i.cx)(`focus-visible:u-outline relative grow overflow-y-auto outline-hidden`,`transition-all duration-300`,{"px-xl py-lg":!n},t),style:{...f&&{maskImage:`linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))`,maskSize:`100% calc(100% + ${m.top?`0px`:`44px`} + ${m.bottom?`0px`:`44px`})`,maskPosition:`0 ${m.top?`0px`:`-44px`}`}},...l,children:e})};h.displayName=`Dialog.Body`;var g=({asChild:e=!1,children:t,...n})=>{let{renderProp:i,innerChildren:a}=(0,r.createRenderSlot)(e,t);return(0,o.jsx)(u.Dialog.Close,{"data-spark-component":`dialog-close`,render:i,...n,children:a})},_=({"aria-label":t,className:r,size:a=`md`,intent:s=`neutral`,design:c=`ghost`,children:u=(0,o.jsx)(l.Close,{}),ref:d,...f})=>(0,o.jsx)(g,{"data-spark-component":`dialog-close-button`,"data-part":`close`,ref:d,className:(0,i.cx)([`absolute`,`top-md`,`right-xl`],r),asChild:!0,...f,children:(0,o.jsx)(n.t,{intent:s,size:a,design:c,"aria-label":t,children:(0,o.jsx)(e.t,{children:u})})}),v=Object.assign(_,{id:`CloseButton`});_.displayName=`Dialog.CloseButton`;var y=({className:e,isNarrow:n=!1,size:r=`md`,ref:s,...c})=>{let{setIsFullScreen:l}=p();return(0,a.useEffect)(()=>(r===`fullscreen`&&l(!0),()=>l(!1)),[l,r]),(0,o.jsx)(u.Dialog.Popup,{ref:s,"data-spark-component":`dialog-content`,role:`dialog`,className:a=>(0,i.cx)(t.t({isNarrow:n,size:r,className:typeof e==`function`?e(a):e})),...c})};y.displayName=`Dialog.Content`;var b=e=>(0,o.jsx)(u.Dialog.Description,{"data-spark-component":`dialog-description`,...e});b.displayName=`Dialog.Description`;var x=({children:e,className:t,ref:n,...r})=>(0,o.jsx)(`footer`,{"data-spark-component":`dialog-footer`,ref:n,className:(0,i.cx)(t,[`px-xl`,`py-lg`]),...r,children:e});x.displayName=`Dialog.Footer`;var S=({children:e,className:t,ref:n,...r})=>(0,o.jsx)(`header`,{"data-spark-component":`dialog-header`,ref:n,className:(0,i.cx)(t,[`px-xl`,`py-lg`]),...r,children:e});S.displayName=`Dialog.Header`;var C=({className:e,...t})=>(0,o.jsx)(u.Dialog.Backdrop,{"data-spark-component":`dialog-overlay`,className:t=>(0,i.cx)(`z-overlay size-screen fixed inset-0`,`bg-overlay/dim-1`,`data-starting-style:animate-fade-in`,`data-ending-style:animate-fade-out`,typeof e==`function`?e(t):e),...t});C.displayName=`Dialog.Overlay`;var w=({className:e,...t})=>(0,o.jsx)(u.Dialog.Portal,{"data-spark-component":`dialog-portal`,className:(0,i.cx)(e,`z-modal absolute`),...t});w.displayName=`Dialog.Portal`;var T=({className:e,ref:t,...n})=>(0,o.jsx)(u.Dialog.Title,{"data-spark-component":`dialog-title`,ref:t,className:(0,i.cx)(`text-headline-1 text-on-surface`,`group-has-data-[part=close]:pr-3xl`,e),...n});T.displayName=`Dialog.Title`;var E=({asChild:e=!1,children:t,...n})=>{let{renderProp:i,innerChildren:a}=(0,r.createRenderSlot)(e,t);return(0,o.jsx)(u.Dialog.Trigger,{"data-spark-component":`dialog-trigger`,render:i,...n,children:a})};E.displayName=`Dialog.Trigger`;var D=Object.assign(m,{Trigger:E,Portal:w,Overlay:C,Content:y,Header:S,Body:h,Footer:x,Close:g,CloseButton:v,Title:T,Description:b});D.displayName=`Dialog`,exports.Dialog=D;
 //# sourceMappingURL=index.js.map

package/dist/dialog/index.mjs

@@ -1,5 +1,5 @@
 import { t as e } from "../icon-VM_Ys9Xn.mjs";
-import { t } from "../DialogContent.styles-ClKRO43s.mjs";
+import { t } from "../DialogContent.styles-BVyH8M3z.mjs";
 import { t as n } from "../icon-button-CexCkoV0.mjs";
 import { createRenderSlot as r } from "@spark-ui/internal-utils";
 import { cx as i } from "class-variance-authority";

package/dist/toast/index.js

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../rolldown-runtime-CMqjfN_6.js"),t=require("../slot/index.js"),n=require("../icon-CfEsla9z.js"),r=require("../button-3vvMrf1L.js"),i=require("../icon-button-B2TM0Xby.js");let a=require("class-variance-authority"),o=require("react");o=e.t(o);let s=require("react/jsx-runtime"),c=require("@spark-ui/icons/Close"),l=require("@base-ui/react/toast"),u=require("@spark-ui/icons/AlertFill"),d=require("@spark-ui/icons/InfoFill"),f=require("@spark-ui/icons/ValidFill"),p=require("@spark-ui/icons/WarningFill");var m=(0,a.cva)([`gap-lg p-md flex w-max !w-[min(400px,calc(100vw-2rem))] flex-col rounded-lg border-md`,`absolute right-0 bottom-0 left-auto mr-0`,`bg-clip-padding shadow-md select-none`,`focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none`,`z-[calc(1000-var(--toast-index))]`,`after:absolute after:bottom-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']`,`[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)+calc(min(var(--toast-index),10)*-16px)))_scale(calc(max(0,1-(var(--toast-index)*0.1))))]`,`ease-standard [transition-property:opacity,transform]`,`duration-400`,`data-[starting-style]:[transform:translateY(150%)]`,`data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y)))]`,`data-[ending-style]:duration-250`,`data-[ending-style]:opacity-0`,`data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]`,`data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]`,`data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]`,`data-[limited]:opacity-0`],{variants:{design:{filled:``,tinted:``},intent:{success:``,alert:``,error:``,info:``,neutral:``,main:``,support:``,accent:``,surface:``,surfaceInverse:``}},compoundVariants:[{design:`filled`,intent:`success`,class:[`bg-success text-on-success border-success`]},{design:`filled`,intent:`alert`,class:[`bg-alert text-on-alert border-alert`]},{design:`filled`,intent:`error`,class:[`bg-error text-on-error border-error`]},{design:`filled`,intent:`info`,class:[`bg-info text-on-info border-info`]},{design:`filled`,intent:`neutral`,class:[`bg-neutral text-on-neutral border-neutral`]},{design:`filled`,intent:`main`,class:[`bg-main text-on-main border-main`]},{design:`filled`,intent:`support`,class:[`bg-support text-on-support border-support`]},{design:`filled`,intent:`accent`,class:[`bg-accent text-on-accent border-accent`]},{design:`filled`,intent:`surface`,class:[`bg-surface text-on-surface border-surface`]},{design:`filled`,intent:`surfaceInverse`,class:[`bg-surface-inverse text-on-surface-inverse border-surface-inverse`]},{design:`tinted`,intent:`success`,class:[`bg-success-container text-on-success-container border-success`]},{design:`tinted`,intent:`alert`,class:[`bg-alert-container text-on-alert-container border-alert`]},{design:`tinted`,intent:`error`,class:[`bg-error-container text-on-error-container border-error`]},{design:`tinted`,intent:`info`,class:[`bg-info-container text-on-info-container border-info`]},{design:`tinted`,intent:`neutral`,class:[`bg-neutral-container text-on-neutral-container border-neutral`]},{design:`tinted`,intent:`main`,class:[`bg-main-container text-on-main-container border-main`]},{design:`tinted`,intent:`support`,class:[`bg-support-container text-on-support-container border-support`]},{design:`tinted`,intent:`accent`,class:[`bg-accent-container text-on-accent-container border-accent`]},{design:`tinted`,intent:`surface`,class:[`bg-surface text-on-surface border-surface`]},{design:`tinted`,intent:`surfaceInverse`,class:[`bg-surface-inverse text-on-surface-inverse border-surface-inverse`]}],defaultVariants:{design:`filled`,intent:`neutral`}});function h(e){return e===`surfaceInverse`?`surface`:e===`surface`?`surfaceInverse`:e===`error`?`danger`:e}function g(e){return e===`surfaceInverse`?`surfaceInverse`:e===`surface`?`surface`:e===`error`?`danger`:e}var _=(e,{toastDesign:t,toastIntent:n})=>{if(!e)return{};let{design:r,intent:i,className:o,onClick:s,...c}=e;return{design:r??t,intent:i??h(n),className:(0,a.cx)(`ml-auto`,o),onClick:s,...c}},v=(e,t,n)=>({swipeDirection:[`down`,`right`],toast:e,className:(0,a.cx)(m({design:t,intent:n})),style:{"--gap":`var(--spacing-md)`,"--offset-y":`calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y))`}});function y(e){switch(e){case`info`:return(0,s.jsx)(d.InfoFill,{});case`success`:return(0,s.jsx)(f.ValidFill,{});case`alert`:return(0,s.jsx)(p.WarningFill,{});case`error`:return(0,s.jsx)(u.AlertFill,{});default:return(0,s.jsx)(d.InfoFill,{})}}function b({toast:e}){let{icon:t,intent:o=`info`,design:u,action:d,isClosable:f,closeLabel:p=`Close`,compact:m=!1}=e.data??{},h=`tinted`,b=d?.close?l.Toast.Close:l.Toast.Action,x=_(d,{toastDesign:h,toastIntent:o}),S=v(e,h,o),C=t??y(o),w=e=>f?(0,s.jsx)(l.Toast.Close,{className:e,render:(0,s.jsx)(i.t,{"aria-label":p,design:h,intent:g(o),size:`md`}),children:(0,s.jsx)(n.t,{children:(0,s.jsx)(c.Close,{})})}):null,T=()=>{let t=e.data?.title??e.title,n=!!(e.data?.description??e.description);return typeof t!=`string`&&t!==void 0?(0,s.jsx)(l.Toast.Title,{className:n?`text-headline-2`:`text-body-1`,render:(0,s.jsx)(`div`,{}),children:t}):(0,s.jsx)(l.Toast.Title,{className:n?`text-headline-2`:`text-body-1`})},E=()=>{let t=e.data?.description??e.description;return t?typeof t==`string`?(0,s.jsx)(l.Toast.Description,{className:`text-body-1`}):(0,s.jsx)(l.Toast.Description,{className:`text-body-1`,render:(0,s.jsx)(`div`,{}),children:t}):null};return(0,s.jsx)(l.Toast.Root,{...S,children:(0,s.jsxs)(`div`,{className:(0,a.cx)(`flex`,m?`gap-lg items-center`:`gap-md flex-col`),children:[(0,s.jsxs)(`div`,{className:`gap-lg p-md flex grow items-center`,children:[(0,s.jsx)(n.t,{size:`md`,children:C}),(0,s.jsxs)(`div`,{className:(0,a.cx)(`gap-sm flex flex-col`,m&&`flex-1`,!m&&f&&`pr-3xl`),children:[T(),E()]})]}),(0,s.jsxs)(`div`,{className:(0,a.cx)(`flex`),children:[d&&(0,s.jsx)(b,{render:(0,s.jsx)(r.t,{...x}),children:d.label}),m&&w()]}),!m&&w(`top-md right-md absolute`)]})},e.id)}function x(){let e=l.Toast.useToastManager(),t=o.useRef(e);return t.current=e,o.useMemo(()=>({get toasts(){return t.current.toasts},add:e=>t.current.add(e),update:(e,n)=>t.current.update(e,n),close:e=>t.current.close(e),promise:(e,n)=>t.current.promise(e,n),closeAll:()=>t.current.toasts.forEach(({id:e})=>t.current.close(e))}),[])}function S(){let{toasts:e}=x();return e.map(e=>(0,s.jsx)(b,{toast:e},e.id))}function C({children:e,limit:t=3,...n}){return(0,s.jsxs)(l.Toast.Provider,{limit:t,...n,children:[(0,s.jsx)(l.Toast.Portal,{children:(0,s.jsx)(l.Toast.Viewport,{className:(0,a.cx)(`z-toast right-lg bottom-lg text-on-surfa- fixed top-auto mx-auto flex w-fit flex-col items-end`),children:(0,s.jsx)(S,{})})}),e]})}function w({children:e,onClick:n,asChild:r=!1,title:i,description:a,timeout:o=5e3,design:c=`filled`,intent:l=`neutral`,isClosable:u=!0,icon:d,action:f,compact:p,priority:m=`low`}){let h=x(),g=r?t.Slot:`button`;function _(e){n?.(e),h.add({title:i,description:a,timeout:o,priority:m,data:{design:c,intent:l,isClosable:u,...d&&{icon:d},action:f,...p!==void 0&&{compact:p}}})}return(0,s.jsx)(g,{...!r&&{type:`button`},onClick:_,children:e})}var T=l.Toast.createToastManager;exports.ToastProvider=C,exports.ToastTrigger=w,exports.createToastManager=T,exports.useToastManager=x;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../rolldown-runtime-CMqjfN_6.js"),t=require("../slot/index.js"),n=require("../icon-CfEsla9z.js"),r=require("../button-3vvMrf1L.js"),i=require("../icon-button-B2TM0Xby.js");let a=require("class-variance-authority"),o=require("react");o=e.t(o);let s=require("react/jsx-runtime"),c=require("@spark-ui/icons/Close"),l=require("@base-ui/react/toast"),u=require("@spark-ui/icons/AlertFill"),d=require("@spark-ui/icons/InfoFill"),f=require("@spark-ui/icons/ValidFill"),p=require("@spark-ui/icons/WarningFill");var m=(0,a.cva)([`gap-lg p-md flex w-max w-[min(400px,calc(100vw-var(--spacing-sz-32)))]! flex-col rounded-lg border-md`,`absolute right-0 bottom-0 left-auto mr-0`,`bg-clip-padding shadow-md select-none`,`focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none`,`z-[calc(1000-var(--toast-index))]`,`after:absolute after:bottom-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']`,`[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)+calc(min(var(--toast-index),10)*-16px)))_scale(calc(max(0,1-(var(--toast-index)*0.1))))]`,`ease-standard [transition-property:opacity,transform]`,`duration-400`,`data-[starting-style]:[transform:translateY(150%)]`,`data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y)))]`,`data-[ending-style]:duration-250`,`data-[ending-style]:opacity-0`,`data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]`,`data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]`,`data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]`,`data-[limited]:opacity-0`],{variants:{design:{filled:``,tinted:``},intent:{success:``,alert:``,error:``,info:``,neutral:``,main:``,support:``,accent:``,surface:``,surfaceInverse:``}},compoundVariants:[{design:`filled`,intent:`success`,class:[`bg-success text-on-success border-success`]},{design:`filled`,intent:`alert`,class:[`bg-alert text-on-alert border-alert`]},{design:`filled`,intent:`error`,class:[`bg-error text-on-error border-error`]},{design:`filled`,intent:`info`,class:[`bg-info text-on-info border-info`]},{design:`filled`,intent:`neutral`,class:[`bg-neutral text-on-neutral border-neutral`]},{design:`filled`,intent:`main`,class:[`bg-main text-on-main border-main`]},{design:`filled`,intent:`support`,class:[`bg-support text-on-support border-support`]},{design:`filled`,intent:`accent`,class:[`bg-accent text-on-accent border-accent`]},{design:`filled`,intent:`surface`,class:[`bg-surface text-on-surface border-surface`]},{design:`filled`,intent:`surfaceInverse`,class:[`bg-surface-inverse text-on-surface-inverse border-surface-inverse`]},{design:`tinted`,intent:`success`,class:[`bg-success-container text-on-success-container border-success`]},{design:`tinted`,intent:`alert`,class:[`bg-alert-container text-on-alert-container border-alert`]},{design:`tinted`,intent:`error`,class:[`bg-error-container text-on-error-container border-error`]},{design:`tinted`,intent:`info`,class:[`bg-info-container text-on-info-container border-info`]},{design:`tinted`,intent:`neutral`,class:[`bg-neutral-container text-on-neutral-container border-neutral`]},{design:`tinted`,intent:`main`,class:[`bg-main-container text-on-main-container border-main`]},{design:`tinted`,intent:`support`,class:[`bg-support-container text-on-support-container border-support`]},{design:`tinted`,intent:`accent`,class:[`bg-accent-container text-on-accent-container border-accent`]},{design:`tinted`,intent:`surface`,class:[`bg-surface text-on-surface border-surface`]},{design:`tinted`,intent:`surfaceInverse`,class:[`bg-surface-inverse text-on-surface-inverse border-surface-inverse`]}],defaultVariants:{design:`filled`,intent:`neutral`}});function h(e){return e===`surfaceInverse`?`surface`:e===`surface`?`surfaceInverse`:e===`error`?`danger`:e}function g(e){return e===`surfaceInverse`?`surfaceInverse`:e===`surface`?`surface`:e===`error`?`danger`:e}var _=(e,{toastDesign:t,toastIntent:n})=>{if(!e)return{};let{design:r,intent:i,className:o,onClick:s,...c}=e;return{design:r??t,intent:i??h(n),className:(0,a.cx)(`ml-auto`,o),onClick:s,...c}},v=(e,t,n)=>({swipeDirection:[`down`,`right`],toast:e,className:(0,a.cx)(m({design:t,intent:n})),style:{"--gap":`var(--spacing-md)`,"--offset-y":`calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y))`}});function y(e){switch(e){case`info`:return(0,s.jsx)(d.InfoFill,{});case`success`:return(0,s.jsx)(f.ValidFill,{});case`alert`:return(0,s.jsx)(p.WarningFill,{});case`error`:return(0,s.jsx)(u.AlertFill,{});default:return(0,s.jsx)(d.InfoFill,{})}}function b({toast:e}){let{icon:t,intent:o=`info`,design:u,action:d,isClosable:f,closeLabel:p=`Close`,compact:m=!1}=e.data??{},h=`tinted`,b=d?.close?l.Toast.Close:l.Toast.Action,x=_(d,{toastDesign:h,toastIntent:o}),S=v(e,h,o),C=t??y(o),w=e=>f?(0,s.jsx)(l.Toast.Close,{className:e,render:(0,s.jsx)(i.t,{"aria-label":p,design:h,intent:g(o),size:`md`}),children:(0,s.jsx)(n.t,{children:(0,s.jsx)(c.Close,{})})}):null,T=()=>{let t=e.data?.title??e.title,n=!!(e.data?.description??e.description);return typeof t!=`string`&&t!==void 0?(0,s.jsx)(l.Toast.Title,{className:n?`text-headline-2`:`text-body-1`,render:(0,s.jsx)(`div`,{}),children:t}):(0,s.jsx)(l.Toast.Title,{className:n?`text-headline-2`:`text-body-1`})},E=()=>{let t=e.data?.description??e.description;return t?typeof t==`string`?(0,s.jsx)(l.Toast.Description,{className:`text-body-1`}):(0,s.jsx)(l.Toast.Description,{className:`text-body-1`,render:(0,s.jsx)(`div`,{}),children:t}):null};return(0,s.jsx)(l.Toast.Root,{...S,children:(0,s.jsxs)(`div`,{className:(0,a.cx)(`flex`,m?`gap-lg items-center`:`gap-md flex-col`),children:[(0,s.jsxs)(`div`,{className:`gap-lg p-md flex grow items-center`,children:[(0,s.jsx)(n.t,{size:`md`,children:C}),(0,s.jsxs)(`div`,{className:(0,a.cx)(`gap-sm flex flex-col`,m&&`flex-1`,!m&&f&&`pr-3xl`),children:[T(),E()]})]}),(0,s.jsxs)(`div`,{className:(0,a.cx)(`flex`),children:[d&&(0,s.jsx)(b,{render:(0,s.jsx)(r.t,{...x}),children:d.label}),m&&w()]}),!m&&w(`top-md right-md absolute`)]})},e.id)}function x(){let e=l.Toast.useToastManager(),t=o.useRef(e);return t.current=e,o.useMemo(()=>({get toasts(){return t.current.toasts},add:e=>t.current.add(e),update:(e,n)=>t.current.update(e,n),close:e=>t.current.close(e),promise:(e,n)=>t.current.promise(e,n),closeAll:()=>t.current.toasts.forEach(({id:e})=>t.current.close(e))}),[])}function S(){let{toasts:e}=x();return e.map(e=>(0,s.jsx)(b,{toast:e},e.id))}function C({children:e,limit:t=3,...n}){return(0,s.jsxs)(l.Toast.Provider,{limit:t,...n,children:[(0,s.jsx)(l.Toast.Portal,{children:(0,s.jsx)(l.Toast.Viewport,{className:(0,a.cx)(`z-toast right-lg bottom-lg text-on-surfa- fixed top-auto mx-auto flex w-fit flex-col items-end`),children:(0,s.jsx)(S,{})})}),e]})}function w({children:e,onClick:n,asChild:r=!1,title:i,description:a,timeout:o=5e3,design:c=`filled`,intent:l=`neutral`,isClosable:u=!0,icon:d,action:f,compact:p,priority:m=`low`}){let h=x(),g=r?t.Slot:`button`;function _(e){n?.(e),h.add({title:i,description:a,timeout:o,priority:m,data:{design:c,intent:l,isClosable:u,...d&&{icon:d},action:f,...p!==void 0&&{compact:p}}})}return(0,s.jsx)(g,{...!r&&{type:`button`},onClick:_,children:e})}var T=l.Toast.createToastManager;exports.ToastProvider=C,exports.ToastTrigger=w,exports.createToastManager=T,exports.useToastManager=x;
 //# sourceMappingURL=index.js.map

package/dist/toast/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/toast/Toast.styles.ts","../../src/toast/Toast.tsx","../../src/toast/useToastManager.ts","../../src/toast/index.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority'\n\nexport const toastStyles = cva(\n  [\n    'gap-lg p-md flex w-max !w-[min(400px,calc(100vw-2rem))] flex-col rounded-lg border-md',\n    'absolute right-0 bottom-0 left-auto mr-0',\n    'bg-clip-padding shadow-md select-none',\n    'focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none',\n    'z-[calc(1000-var(--toast-index))]',\n    \"after:absolute after:bottom-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']\",\n    // Stack effect while not focused\n    '[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)+calc(min(var(--toast-index),10)*-16px)))_scale(calc(max(0,1-(var(--toast-index)*0.1))))]',\n    // Scale and translate\n    'ease-standard [transition-property:opacity,transform]',\n    'duration-400',\n    // Present when the toast is animating in.\n    'data-[starting-style]:[transform:translateY(150%)]',\n    // Expanded: Present when the toast is expanded in the viewport.\n    'data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y)))]',\n    // Present when the toast is animating out.\n    'data-[ending-style]:duration-250',\n    'data-[ending-style]:opacity-0',\n    'data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]',\n    'data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n    'data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n    // Limited: Present when the toast was removed due to exceeding the limit.\n    'data-[limited]:opacity-0',\n  ],\n  {\n    variants: {\n      design: {\n        filled: '',\n        tinted: '',\n      },\n      intent: {\n        success: '',\n        alert: '',\n        error: '',\n        info: '',\n        neutral: '',\n        main: '',\n        support: '',\n        accent: '',\n        surface: '',\n        surfaceInverse: '',\n      },\n    },\n    compoundVariants: [\n      // Filled variants\n      {\n        design: 'filled',\n        intent: 'success',\n        class: ['bg-success text-on-success border-success'],\n      },\n      {\n        design: 'filled',\n        intent: 'alert',\n        class: ['bg-alert text-on-alert border-alert'],\n      },\n      {\n        design: 'filled',\n        intent: 'error',\n        class: ['bg-error text-on-error border-error'],\n      },\n      {\n        design: 'filled',\n        intent: 'info',\n        class: ['bg-info text-on-info border-info'],\n      },\n      {\n        design: 'filled',\n        intent: 'neutral',\n        class: ['bg-neutral text-on-neutral border-neutral'],\n      },\n      {\n        design: 'filled',\n        intent: 'main',\n        class: ['bg-main text-on-main border-main'],\n      },\n      {\n        design: 'filled',\n        intent: 'support',\n        class: ['bg-support text-on-support border-support'],\n      },\n      {\n        design: 'filled',\n        intent: 'accent',\n        class: ['bg-accent text-on-accent border-accent'],\n      },\n      {\n        design: 'filled',\n        intent: 'surface',\n        class: ['bg-surface text-on-surface border-surface'],\n      },\n      {\n        design: 'filled',\n        intent: 'surfaceInverse',\n        class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n      },\n\n      // Tinted variants\n      {\n        design: 'tinted',\n        intent: 'success',\n        class: ['bg-success-container text-on-success-container border-success'],\n      },\n      {\n        design: 'tinted',\n        intent: 'alert',\n        class: ['bg-alert-container text-on-alert-container border-alert'],\n      },\n      {\n        design: 'tinted',\n        intent: 'error',\n        class: ['bg-error-container text-on-error-container border-error'],\n      },\n      {\n        design: 'tinted',\n        intent: 'info',\n        class: ['bg-info-container text-on-info-container border-info'],\n      },\n      {\n        design: 'tinted',\n        intent: 'neutral',\n        class: ['bg-neutral-container text-on-neutral-container border-neutral'],\n      },\n      {\n        design: 'tinted',\n        intent: 'main',\n        class: ['bg-main-container text-on-main-container border-main'],\n      },\n      {\n        design: 'tinted',\n        intent: 'support',\n        class: ['bg-support-container text-on-support-container border-support'],\n      },\n      {\n        design: 'tinted',\n        intent: 'accent',\n        class: ['bg-accent-container text-on-accent-container border-accent'],\n      },\n      {\n        design: 'tinted',\n        intent: 'surface',\n        class: ['bg-surface text-on-surface border-surface'],\n      },\n      {\n        design: 'tinted',\n        intent: 'surfaceInverse',\n        class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n      },\n    ],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'neutral',\n    },\n  }\n)\n\nexport type ToastVariantProps = VariantProps<typeof toastStyles>\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Button, ButtonProps } from '@spark-ui/components/button'\nimport { Icon } from '@spark-ui/components/icon'\nimport { IconButton } from '@spark-ui/components/icon-button'\nimport { AlertFill } from '@spark-ui/icons/AlertFill'\nimport { Close } from '@spark-ui/icons/Close'\nimport { InfoFill } from '@spark-ui/icons/InfoFill'\nimport { ValidFill } from '@spark-ui/icons/ValidFill'\nimport { WarningFill } from '@spark-ui/icons/WarningFill'\nimport { cx } from 'class-variance-authority'\n\nimport { toastStyles } from './Toast.styles'\nimport type { ToastData, ToastDesign, ToastIntent, ToastObject } from './types'\n\nfunction getButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n  if (intent === 'surfaceInverse') return 'surface'\n  if (intent === 'surface') return 'surfaceInverse'\n  if (intent === 'error') return 'danger'\n\n  return intent as ButtonProps['intent']\n}\n\nfunction getCloseButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n  if (intent === 'surfaceInverse') return 'surfaceInverse'\n  if (intent === 'surface') return 'surface'\n  if (intent === 'error') return 'danger'\n\n  return intent as ButtonProps['intent']\n}\n\nconst getActionProps = (\n  action: ToastData['action'],\n  { toastDesign, toastIntent }: { toastDesign?: ToastDesign; toastIntent?: ToastIntent }\n): ButtonProps => {\n  if (!action) return {}\n\n  const { design, intent, className, onClick, ...rest } = action\n\n  return {\n    design: design ?? toastDesign,\n    intent: intent ?? getButtonIntent(toastIntent),\n    className: cx('ml-auto', className),\n    onClick,\n    ...rest,\n  }\n}\n\nconst getToastRootProps = (toast: ToastObject, design: ToastDesign, intent: ToastIntent) => ({\n  swipeDirection: ['down', 'right'] as ['down', 'right'],\n  toast,\n  className: cx(toastStyles({ design, intent })),\n  style: {\n    ['--gap' as string]: 'var(--spacing-md)',\n    ['--offset-y' as string]:\n      'calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y))',\n  },\n})\n\nfunction getDefaultIcon(intent: ToastIntent): React.ReactNode {\n  switch (intent) {\n    case 'info':\n      return <InfoFill />\n    case 'success':\n      return <ValidFill />\n    case 'alert':\n      return <WarningFill />\n    case 'error':\n      return <AlertFill />\n    case 'main':\n    case 'support':\n    case 'accent':\n    case 'neutral':\n    case 'surface':\n    case 'surfaceInverse':\n    default:\n      return <InfoFill />\n  }\n}\n\nexport function Toast({ toast }: { toast: ToastObject }) {\n  const {\n    icon: ToastIcon,\n    intent = 'info',\n    design: _design, // deprecated prop, ignored\n    action,\n    isClosable,\n    closeLabel = 'Close',\n    compact = false,\n  } = toast.data ?? {}\n\n  // Always use 'tinted' design regardless of prop value\n  const design = 'tinted' as const\n\n  const ActionButton = action?.close ? BaseToast.Close : BaseToast.Action\n  const actionProps = getActionProps(action, { toastDesign: design, toastIntent: intent })\n  const rootProps = getToastRootProps(toast, design, intent)\n\n  // Use provided icon or default icon based on intent\n  const icon = ToastIcon ?? getDefaultIcon(intent)\n\n  const getCloseButton = (className?: string) => {\n    if (!isClosable) return null\n\n    return (\n      <BaseToast.Close\n        className={className}\n        render={\n          <IconButton\n            aria-label={closeLabel}\n            design={design}\n            intent={getCloseButtonIntent(intent)}\n            size=\"md\"\n          />\n        }\n      >\n        <Icon>\n          <Close />\n        </Icon>\n      </BaseToast.Close>\n    )\n  }\n\n  const renderTitle = () => {\n    // Check ToastData first for JSX, then fallback to toast.title (string)\n    const title = toast.data?.title ?? toast.title\n    const hasDescription = !!(toast.data?.description ?? toast.description)\n\n    if (typeof title !== 'string' && title !== undefined) {\n      return (\n        <BaseToast.Title\n          className={hasDescription ? 'text-headline-2' : 'text-body-1'}\n          render={<div />}\n        >\n          {title}\n        </BaseToast.Title>\n      )\n    }\n\n    return <BaseToast.Title className={hasDescription ? 'text-headline-2' : 'text-body-1'} />\n  }\n\n  const renderDescription = () => {\n    // Check ToastData first for JSX, then fallback to toast.description (string)\n    const description = toast.data?.description ?? toast.description\n\n    if (!description) return null\n\n    if (typeof description !== 'string') {\n      return (\n        <BaseToast.Description className=\"text-body-1\" render={<div />}>\n          {description}\n        </BaseToast.Description>\n      )\n    }\n\n    return <BaseToast.Description className=\"text-body-1\" />\n  }\n\n  return (\n    <BaseToast.Root key={toast.id} {...rootProps}>\n      <div className={cx('flex', compact ? 'gap-lg items-center' : 'gap-md flex-col')}>\n        <div className=\"gap-lg p-md flex grow items-center\">\n          {/* Icon */}\n          <Icon size=\"md\">{icon}</Icon>\n          {/* Title and description */}\n          <div\n            className={cx(\n              'gap-sm flex flex-col',\n              compact && 'flex-1',\n              !compact && isClosable && 'pr-3xl'\n            )}\n          >\n            {renderTitle()}\n            {renderDescription()}\n          </div>\n        </div>\n\n        <div className={cx('flex')}>\n          {/* Action button */}\n          {action && (\n            <ActionButton render={<Button {...actionProps} />}>{action.label}</ActionButton>\n          )}\n          {/* Close button - compact layout only */}\n          {compact && getCloseButton()}\n        </div>\n\n        {/* Close button - default layout only */}\n        {!compact && getCloseButton('top-md right-md absolute')}\n      </div>\n    </BaseToast.Root>\n  )\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport * as React from 'react'\n\nimport type { UseToastManagerReturnValue } from './types'\n\nexport function useToastManager(): UseToastManagerReturnValue {\n  const manager = BaseToast.useToastManager()\n  const managerRef = React.useRef(manager)\n  managerRef.current = manager\n\n  return React.useMemo(\n    () => ({\n      get toasts() {\n        return managerRef.current.toasts\n      },\n      add: options => managerRef.current.add(options),\n      update: (id, options) => managerRef.current.update(id, options),\n      close: id => managerRef.current.close(id),\n      promise: (p, options) => managerRef.current.promise(p, options),\n      closeAll: () => managerRef.current.toasts.forEach(({ id }) => managerRef.current.close(id)),\n    }),\n    []\n  )\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Slot } from '@spark-ui/components/slot'\nimport { cx } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { Toast } from './Toast'\nimport type { ToastData, ToastObject } from './types'\nimport { useToastManager } from './useToastManager'\n\nexport * from './types'\n\nfunction ToastList() {\n  const { toasts } = useToastManager()\n\n  return toasts.map(toast => <Toast key={toast.id} toast={toast} />)\n}\n\ninterface ToastProviderProps extends React.ComponentProps<typeof BaseToast.Provider> {\n  children: React.ReactNode\n}\n\n/**\n * A provider component that manages and displays temporary notification messages to users.\n */\nexport function ToastProvider({ children, limit = 3, ...props }: ToastProviderProps) {\n  return (\n    <BaseToast.Provider limit={limit} {...props}>\n      <BaseToast.Portal>\n        <BaseToast.Viewport\n          className={cx(\n            'z-toast right-lg bottom-lg text-on-surfa- fixed top-auto mx-auto flex w-fit flex-col items-end'\n          )}\n        >\n          <ToastList />\n        </BaseToast.Viewport>\n      </BaseToast.Portal>\n      {children}\n    </BaseToast.Provider>\n  )\n}\n\ninterface ToastTriggerProps\n  extends\n    Omit<React.ComponentPropsWithRef<'button'>, 'title'>,\n    Pick<ToastObject, 'priority'>,\n    Pick<ToastData, 'design' | 'intent' | 'icon' | 'isClosable' | 'action' | 'compact'> {\n  children: React.ReactNode\n  asChild?: boolean\n  title: string | React.ReactNode\n  description?: string | React.ReactNode\n  timeout?: number\n}\n\nexport function ToastTrigger({\n  children,\n  onClick,\n  asChild = false,\n  title,\n  description,\n  timeout = 5000,\n  design = 'filled',\n  intent = 'neutral',\n  isClosable = true,\n  icon,\n  action,\n  compact,\n  priority = 'low',\n}: ToastTriggerProps) {\n  const toastManager = useToastManager()\n\n  const Component = asChild ? Slot : 'button'\n\n  function createToast(e: React.MouseEvent<HTMLButtonElement>) {\n    onClick?.(e)\n    toastManager.add({\n      title,\n      description,\n      timeout,\n      priority,\n      data: {\n        design,\n        intent,\n        isClosable,\n        ...(icon && { icon }),\n        action,\n        ...(compact !== undefined && { compact }),\n      },\n    })\n  }\n\n  return (\n    <Component {...(!asChild && { type: 'button' })} onClick={createToast}>\n      {children}\n    </Component>\n  )\n}\n\nexport type ToastManager = ReturnType<typeof BaseToast.createToastManager>\n\nexport const createToastManager: () => ToastManager = BaseToast.createToastManager\n\nexport { useToastManager }\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/toast/Toast.styles.ts","../../src/toast/Toast.tsx","../../src/toast/useToastManager.ts","../../src/toast/index.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority'\n\nexport const toastStyles = cva(\n  [\n    'gap-lg p-md flex w-max w-[min(400px,calc(100vw-var(--spacing-sz-32)))]! flex-col rounded-lg border-md',\n    'absolute right-0 bottom-0 left-auto mr-0',\n    'bg-clip-padding shadow-md select-none',\n    'focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none',\n    'z-[calc(1000-var(--toast-index))]',\n    \"after:absolute after:bottom-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']\",\n    // Stack effect while not focused\n    '[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)+calc(min(var(--toast-index),10)*-16px)))_scale(calc(max(0,1-(var(--toast-index)*0.1))))]',\n    // Scale and translate\n    'ease-standard [transition-property:opacity,transform]',\n    'duration-400',\n    // Present when the toast is animating in.\n    'data-[starting-style]:[transform:translateY(150%)]',\n    // Expanded: Present when the toast is expanded in the viewport.\n    'data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y)))]',\n    // Present when the toast is animating out.\n    'data-[ending-style]:duration-250',\n    'data-[ending-style]:opacity-0',\n    'data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]',\n    'data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n    'data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n    // Limited: Present when the toast was removed due to exceeding the limit.\n    'data-[limited]:opacity-0',\n  ],\n  {\n    variants: {\n      design: {\n        filled: '',\n        tinted: '',\n      },\n      intent: {\n        success: '',\n        alert: '',\n        error: '',\n        info: '',\n        neutral: '',\n        main: '',\n        support: '',\n        accent: '',\n        surface: '',\n        surfaceInverse: '',\n      },\n    },\n    compoundVariants: [\n      // Filled variants\n      {\n        design: 'filled',\n        intent: 'success',\n        class: ['bg-success text-on-success border-success'],\n      },\n      {\n        design: 'filled',\n        intent: 'alert',\n        class: ['bg-alert text-on-alert border-alert'],\n      },\n      {\n        design: 'filled',\n        intent: 'error',\n        class: ['bg-error text-on-error border-error'],\n      },\n      {\n        design: 'filled',\n        intent: 'info',\n        class: ['bg-info text-on-info border-info'],\n      },\n      {\n        design: 'filled',\n        intent: 'neutral',\n        class: ['bg-neutral text-on-neutral border-neutral'],\n      },\n      {\n        design: 'filled',\n        intent: 'main',\n        class: ['bg-main text-on-main border-main'],\n      },\n      {\n        design: 'filled',\n        intent: 'support',\n        class: ['bg-support text-on-support border-support'],\n      },\n      {\n        design: 'filled',\n        intent: 'accent',\n        class: ['bg-accent text-on-accent border-accent'],\n      },\n      {\n        design: 'filled',\n        intent: 'surface',\n        class: ['bg-surface text-on-surface border-surface'],\n      },\n      {\n        design: 'filled',\n        intent: 'surfaceInverse',\n        class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n      },\n\n      // Tinted variants\n      {\n        design: 'tinted',\n        intent: 'success',\n        class: ['bg-success-container text-on-success-container border-success'],\n      },\n      {\n        design: 'tinted',\n        intent: 'alert',\n        class: ['bg-alert-container text-on-alert-container border-alert'],\n      },\n      {\n        design: 'tinted',\n        intent: 'error',\n        class: ['bg-error-container text-on-error-container border-error'],\n      },\n      {\n        design: 'tinted',\n        intent: 'info',\n        class: ['bg-info-container text-on-info-container border-info'],\n      },\n      {\n        design: 'tinted',\n        intent: 'neutral',\n        class: ['bg-neutral-container text-on-neutral-container border-neutral'],\n      },\n      {\n        design: 'tinted',\n        intent: 'main',\n        class: ['bg-main-container text-on-main-container border-main'],\n      },\n      {\n        design: 'tinted',\n        intent: 'support',\n        class: ['bg-support-container text-on-support-container border-support'],\n      },\n      {\n        design: 'tinted',\n        intent: 'accent',\n        class: ['bg-accent-container text-on-accent-container border-accent'],\n      },\n      {\n        design: 'tinted',\n        intent: 'surface',\n        class: ['bg-surface text-on-surface border-surface'],\n      },\n      {\n        design: 'tinted',\n        intent: 'surfaceInverse',\n        class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n      },\n    ],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'neutral',\n    },\n  }\n)\n\nexport type ToastVariantProps = VariantProps<typeof toastStyles>\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Button, ButtonProps } from '@spark-ui/components/button'\nimport { Icon } from '@spark-ui/components/icon'\nimport { IconButton } from '@spark-ui/components/icon-button'\nimport { AlertFill } from '@spark-ui/icons/AlertFill'\nimport { Close } from '@spark-ui/icons/Close'\nimport { InfoFill } from '@spark-ui/icons/InfoFill'\nimport { ValidFill } from '@spark-ui/icons/ValidFill'\nimport { WarningFill } from '@spark-ui/icons/WarningFill'\nimport { cx } from 'class-variance-authority'\n\nimport { toastStyles } from './Toast.styles'\nimport type { ToastData, ToastDesign, ToastIntent, ToastObject } from './types'\n\nfunction getButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n  if (intent === 'surfaceInverse') return 'surface'\n  if (intent === 'surface') return 'surfaceInverse'\n  if (intent === 'error') return 'danger'\n\n  return intent as ButtonProps['intent']\n}\n\nfunction getCloseButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n  if (intent === 'surfaceInverse') return 'surfaceInverse'\n  if (intent === 'surface') return 'surface'\n  if (intent === 'error') return 'danger'\n\n  return intent as ButtonProps['intent']\n}\n\nconst getActionProps = (\n  action: ToastData['action'],\n  { toastDesign, toastIntent }: { toastDesign?: ToastDesign; toastIntent?: ToastIntent }\n): ButtonProps => {\n  if (!action) return {}\n\n  const { design, intent, className, onClick, ...rest } = action\n\n  return {\n    design: design ?? toastDesign,\n    intent: intent ?? getButtonIntent(toastIntent),\n    className: cx('ml-auto', className),\n    onClick,\n    ...rest,\n  }\n}\n\nconst getToastRootProps = (toast: ToastObject, design: ToastDesign, intent: ToastIntent) => ({\n  swipeDirection: ['down', 'right'] as ['down', 'right'],\n  toast,\n  className: cx(toastStyles({ design, intent })),\n  style: {\n    ['--gap' as string]: 'var(--spacing-md)',\n    ['--offset-y' as string]:\n      'calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y))',\n  },\n})\n\nfunction getDefaultIcon(intent: ToastIntent): React.ReactNode {\n  switch (intent) {\n    case 'info':\n      return <InfoFill />\n    case 'success':\n      return <ValidFill />\n    case 'alert':\n      return <WarningFill />\n    case 'error':\n      return <AlertFill />\n    case 'main':\n    case 'support':\n    case 'accent':\n    case 'neutral':\n    case 'surface':\n    case 'surfaceInverse':\n    default:\n      return <InfoFill />\n  }\n}\n\nexport function Toast({ toast }: { toast: ToastObject }) {\n  const {\n    icon: ToastIcon,\n    intent = 'info',\n    design: _design, // deprecated prop, ignored\n    action,\n    isClosable,\n    closeLabel = 'Close',\n    compact = false,\n  } = toast.data ?? {}\n\n  // Always use 'tinted' design regardless of prop value\n  const design = 'tinted' as const\n\n  const ActionButton = action?.close ? BaseToast.Close : BaseToast.Action\n  const actionProps = getActionProps(action, { toastDesign: design, toastIntent: intent })\n  const rootProps = getToastRootProps(toast, design, intent)\n\n  // Use provided icon or default icon based on intent\n  const icon = ToastIcon ?? getDefaultIcon(intent)\n\n  const getCloseButton = (className?: string) => {\n    if (!isClosable) return null\n\n    return (\n      <BaseToast.Close\n        className={className}\n        render={\n          <IconButton\n            aria-label={closeLabel}\n            design={design}\n            intent={getCloseButtonIntent(intent)}\n            size=\"md\"\n          />\n        }\n      >\n        <Icon>\n          <Close />\n        </Icon>\n      </BaseToast.Close>\n    )\n  }\n\n  const renderTitle = () => {\n    // Check ToastData first for JSX, then fallback to toast.title (string)\n    const title = toast.data?.title ?? toast.title\n    const hasDescription = !!(toast.data?.description ?? toast.description)\n\n    if (typeof title !== 'string' && title !== undefined) {\n      return (\n        <BaseToast.Title\n          className={hasDescription ? 'text-headline-2' : 'text-body-1'}\n          render={<div />}\n        >\n          {title}\n        </BaseToast.Title>\n      )\n    }\n\n    return <BaseToast.Title className={hasDescription ? 'text-headline-2' : 'text-body-1'} />\n  }\n\n  const renderDescription = () => {\n    // Check ToastData first for JSX, then fallback to toast.description (string)\n    const description = toast.data?.description ?? toast.description\n\n    if (!description) return null\n\n    if (typeof description !== 'string') {\n      return (\n        <BaseToast.Description className=\"text-body-1\" render={<div />}>\n          {description}\n        </BaseToast.Description>\n      )\n    }\n\n    return <BaseToast.Description className=\"text-body-1\" />\n  }\n\n  return (\n    <BaseToast.Root key={toast.id} {...rootProps}>\n      <div className={cx('flex', compact ? 'gap-lg items-center' : 'gap-md flex-col')}>\n        <div className=\"gap-lg p-md flex grow items-center\">\n          {/* Icon */}\n          <Icon size=\"md\">{icon}</Icon>\n          {/* Title and description */}\n          <div\n            className={cx(\n              'gap-sm flex flex-col',\n              compact && 'flex-1',\n              !compact && isClosable && 'pr-3xl'\n            )}\n          >\n            {renderTitle()}\n            {renderDescription()}\n          </div>\n        </div>\n\n        <div className={cx('flex')}>\n          {/* Action button */}\n          {action && (\n            <ActionButton render={<Button {...actionProps} />}>{action.label}</ActionButton>\n          )}\n          {/* Close button - compact layout only */}\n          {compact && getCloseButton()}\n        </div>\n\n        {/* Close button - default layout only */}\n        {!compact && getCloseButton('top-md right-md absolute')}\n      </div>\n    </BaseToast.Root>\n  )\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport * as React from 'react'\n\nimport type { UseToastManagerReturnValue } from './types'\n\nexport function useToastManager(): UseToastManagerReturnValue {\n  const manager = BaseToast.useToastManager()\n  const managerRef = React.useRef(manager)\n  managerRef.current = manager\n\n  return React.useMemo(\n    () => ({\n      get toasts() {\n        return managerRef.current.toasts\n      },\n      add: options => managerRef.current.add(options),\n      update: (id, options) => managerRef.current.update(id, options),\n      close: id => managerRef.current.close(id),\n      promise: (p, options) => managerRef.current.promise(p, options),\n      closeAll: () => managerRef.current.toasts.forEach(({ id }) => managerRef.current.close(id)),\n    }),\n    []\n  )\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Slot } from '@spark-ui/components/slot'\nimport { cx } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { Toast } from './Toast'\nimport type { ToastData, ToastObject } from './types'\nimport { useToastManager } from './useToastManager'\n\nexport * from './types'\n\nfunction ToastList() {\n  const { toasts } = useToastManager()\n\n  return toasts.map(toast => <Toast key={toast.id} toast={toast} />)\n}\n\ninterface ToastProviderProps extends React.ComponentProps<typeof BaseToast.Provider> {\n  children: React.ReactNode\n}\n\n/**\n * A provider component that manages and displays temporary notification messages to users.\n */\nexport function ToastProvider({ children, limit = 3, ...props }: ToastProviderProps) {\n  return (\n    <BaseToast.Provider limit={limit} {...props}>\n      <BaseToast.Portal>\n        <BaseToast.Viewport\n          className={cx(\n            'z-toast right-lg bottom-lg text-on-surfa- fixed top-auto mx-auto flex w-fit flex-col items-end'\n          )}\n        >\n          <ToastList />\n        </BaseToast.Viewport>\n      </BaseToast.Portal>\n      {children}\n    </BaseToast.Provider>\n  )\n}\n\ninterface ToastTriggerProps\n  extends\n    Omit<React.ComponentPropsWithRef<'button'>, 'title'>,\n    Pick<ToastObject, 'priority'>,\n    Pick<ToastData, 'design' | 'intent' | 'icon' | 'isClosable' | 'action' | 'compact'> {\n  children: React.ReactNode\n  asChild?: boolean\n  title: string | React.ReactNode\n  description?: string | React.ReactNode\n  timeout?: number\n}\n\nexport function ToastTrigger({\n  children,\n  onClick,\n  asChild = false,\n  title,\n  description,\n  timeout = 5000,\n  design = 'filled',\n  intent = 'neutral',\n  isClosable = true,\n  icon,\n  action,\n  compact,\n  priority = 'low',\n}: ToastTriggerProps) {\n  const toastManager = useToastManager()\n\n  const Component = asChild ? Slot : 'button'\n\n  function createToast(e: React.MouseEvent<HTMLButtonElement>) {\n    onClick?.(e)\n    toastManager.add({\n      title,\n      description,\n      timeout,\n      priority,\n      data: {\n        design,\n        intent,\n        isClosable,\n        ...(icon && { icon }),\n        action,\n        ...(compact !== undefined && { compact }),\n      },\n    })\n  }\n\n  return (\n    <Component {...(!asChild && { type: 'button' })} onClick={createToast}>\n      {children}\n    </Component>\n  )\n}\n\nexport type ToastManager = ReturnType<typeof BaseToast.createToastManager>\n\nexport const createToastManager: () => ToastManager = BaseToast.createToastManager\n\nexport { useToastManager }\n"],"mappings":"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"}

package/dist/toast/index.mjs

@@ -13,7 +13,7 @@ import { ValidFill as p } from "@spark-ui/icons/ValidFill";
 import { WarningFill as m } from "@spark-ui/icons/WarningFill";
 //#region src/toast/Toast.styles.ts
 var h = i([
-	"gap-lg p-md flex w-max !w-[min(400px,calc(100vw-2rem))] flex-col rounded-lg border-md",
+	"gap-lg p-md flex w-max w-[min(400px,calc(100vw-var(--spacing-sz-32)))]! flex-col rounded-lg border-md",
 	"absolute right-0 bottom-0 left-auto mr-0",
 	"bg-clip-padding shadow-md select-none",
 	"focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none",

package/dist/toast/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../src/toast/Toast.styles.ts","../../src/toast/Toast.tsx","../../src/toast/useToastManager.ts","../../src/toast/index.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority'\n\nexport const toastStyles = cva(\n  [\n    'gap-lg p-md flex w-max !w-[min(400px,calc(100vw-2rem))] flex-col rounded-lg border-md',\n    'absolute right-0 bottom-0 left-auto mr-0',\n    'bg-clip-padding shadow-md select-none',\n    'focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none',\n    'z-[calc(1000-var(--toast-index))]',\n    \"after:absolute after:bottom-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']\",\n    // Stack effect while not focused\n    '[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)+calc(min(var(--toast-index),10)*-16px)))_scale(calc(max(0,1-(var(--toast-index)*0.1))))]',\n    // Scale and translate\n    'ease-standard [transition-property:opacity,transform]',\n    'duration-400',\n    // Present when the toast is animating in.\n    'data-[starting-style]:[transform:translateY(150%)]',\n    // Expanded: Present when the toast is expanded in the viewport.\n    'data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y)))]',\n    // Present when the toast is animating out.\n    'data-[ending-style]:duration-250',\n    'data-[ending-style]:opacity-0',\n    'data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]',\n    'data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n    'data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n    // Limited: Present when the toast was removed due to exceeding the limit.\n    'data-[limited]:opacity-0',\n  ],\n  {\n    variants: {\n      design: {\n        filled: '',\n        tinted: '',\n      },\n      intent: {\n        success: '',\n        alert: '',\n        error: '',\n        info: '',\n        neutral: '',\n        main: '',\n        support: '',\n        accent: '',\n        surface: '',\n        surfaceInverse: '',\n      },\n    },\n    compoundVariants: [\n      // Filled variants\n      {\n        design: 'filled',\n        intent: 'success',\n        class: ['bg-success text-on-success border-success'],\n      },\n      {\n        design: 'filled',\n        intent: 'alert',\n        class: ['bg-alert text-on-alert border-alert'],\n      },\n      {\n        design: 'filled',\n        intent: 'error',\n        class: ['bg-error text-on-error border-error'],\n      },\n      {\n        design: 'filled',\n        intent: 'info',\n        class: ['bg-info text-on-info border-info'],\n      },\n      {\n        design: 'filled',\n        intent: 'neutral',\n        class: ['bg-neutral text-on-neutral border-neutral'],\n      },\n      {\n        design: 'filled',\n        intent: 'main',\n        class: ['bg-main text-on-main border-main'],\n      },\n      {\n        design: 'filled',\n        intent: 'support',\n        class: ['bg-support text-on-support border-support'],\n      },\n      {\n        design: 'filled',\n        intent: 'accent',\n        class: ['bg-accent text-on-accent border-accent'],\n      },\n      {\n        design: 'filled',\n        intent: 'surface',\n        class: ['bg-surface text-on-surface border-surface'],\n      },\n      {\n        design: 'filled',\n        intent: 'surfaceInverse',\n        class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n      },\n\n      // Tinted variants\n      {\n        design: 'tinted',\n        intent: 'success',\n        class: ['bg-success-container text-on-success-container border-success'],\n      },\n      {\n        design: 'tinted',\n        intent: 'alert',\n        class: ['bg-alert-container text-on-alert-container border-alert'],\n      },\n      {\n        design: 'tinted',\n        intent: 'error',\n        class: ['bg-error-container text-on-error-container border-error'],\n      },\n      {\n        design: 'tinted',\n        intent: 'info',\n        class: ['bg-info-container text-on-info-container border-info'],\n      },\n      {\n        design: 'tinted',\n        intent: 'neutral',\n        class: ['bg-neutral-container text-on-neutral-container border-neutral'],\n      },\n      {\n        design: 'tinted',\n        intent: 'main',\n        class: ['bg-main-container text-on-main-container border-main'],\n      },\n      {\n        design: 'tinted',\n        intent: 'support',\n        class: ['bg-support-container text-on-support-container border-support'],\n      },\n      {\n        design: 'tinted',\n        intent: 'accent',\n        class: ['bg-accent-container text-on-accent-container border-accent'],\n      },\n      {\n        design: 'tinted',\n        intent: 'surface',\n        class: ['bg-surface text-on-surface border-surface'],\n      },\n      {\n        design: 'tinted',\n        intent: 'surfaceInverse',\n        class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n      },\n    ],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'neutral',\n    },\n  }\n)\n\nexport type ToastVariantProps = VariantProps<typeof toastStyles>\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Button, ButtonProps } from '@spark-ui/components/button'\nimport { Icon } from '@spark-ui/components/icon'\nimport { IconButton } from '@spark-ui/components/icon-button'\nimport { AlertFill } from '@spark-ui/icons/AlertFill'\nimport { Close } from '@spark-ui/icons/Close'\nimport { InfoFill } from '@spark-ui/icons/InfoFill'\nimport { ValidFill } from '@spark-ui/icons/ValidFill'\nimport { WarningFill } from '@spark-ui/icons/WarningFill'\nimport { cx } from 'class-variance-authority'\n\nimport { toastStyles } from './Toast.styles'\nimport type { ToastData, ToastDesign, ToastIntent, ToastObject } from './types'\n\nfunction getButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n  if (intent === 'surfaceInverse') return 'surface'\n  if (intent === 'surface') return 'surfaceInverse'\n  if (intent === 'error') return 'danger'\n\n  return intent as ButtonProps['intent']\n}\n\nfunction getCloseButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n  if (intent === 'surfaceInverse') return 'surfaceInverse'\n  if (intent === 'surface') return 'surface'\n  if (intent === 'error') return 'danger'\n\n  return intent as ButtonProps['intent']\n}\n\nconst getActionProps = (\n  action: ToastData['action'],\n  { toastDesign, toastIntent }: { toastDesign?: ToastDesign; toastIntent?: ToastIntent }\n): ButtonProps => {\n  if (!action) return {}\n\n  const { design, intent, className, onClick, ...rest } = action\n\n  return {\n    design: design ?? toastDesign,\n    intent: intent ?? getButtonIntent(toastIntent),\n    className: cx('ml-auto', className),\n    onClick,\n    ...rest,\n  }\n}\n\nconst getToastRootProps = (toast: ToastObject, design: ToastDesign, intent: ToastIntent) => ({\n  swipeDirection: ['down', 'right'] as ['down', 'right'],\n  toast,\n  className: cx(toastStyles({ design, intent })),\n  style: {\n    ['--gap' as string]: 'var(--spacing-md)',\n    ['--offset-y' as string]:\n      'calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y))',\n  },\n})\n\nfunction getDefaultIcon(intent: ToastIntent): React.ReactNode {\n  switch (intent) {\n    case 'info':\n      return <InfoFill />\n    case 'success':\n      return <ValidFill />\n    case 'alert':\n      return <WarningFill />\n    case 'error':\n      return <AlertFill />\n    case 'main':\n    case 'support':\n    case 'accent':\n    case 'neutral':\n    case 'surface':\n    case 'surfaceInverse':\n    default:\n      return <InfoFill />\n  }\n}\n\nexport function Toast({ toast }: { toast: ToastObject }) {\n  const {\n    icon: ToastIcon,\n    intent = 'info',\n    design: _design, // deprecated prop, ignored\n    action,\n    isClosable,\n    closeLabel = 'Close',\n    compact = false,\n  } = toast.data ?? {}\n\n  // Always use 'tinted' design regardless of prop value\n  const design = 'tinted' as const\n\n  const ActionButton = action?.close ? BaseToast.Close : BaseToast.Action\n  const actionProps = getActionProps(action, { toastDesign: design, toastIntent: intent })\n  const rootProps = getToastRootProps(toast, design, intent)\n\n  // Use provided icon or default icon based on intent\n  const icon = ToastIcon ?? getDefaultIcon(intent)\n\n  const getCloseButton = (className?: string) => {\n    if (!isClosable) return null\n\n    return (\n      <BaseToast.Close\n        className={className}\n        render={\n          <IconButton\n            aria-label={closeLabel}\n            design={design}\n            intent={getCloseButtonIntent(intent)}\n            size=\"md\"\n          />\n        }\n      >\n        <Icon>\n          <Close />\n        </Icon>\n      </BaseToast.Close>\n    )\n  }\n\n  const renderTitle = () => {\n    // Check ToastData first for JSX, then fallback to toast.title (string)\n    const title = toast.data?.title ?? toast.title\n    const hasDescription = !!(toast.data?.description ?? toast.description)\n\n    if (typeof title !== 'string' && title !== undefined) {\n      return (\n        <BaseToast.Title\n          className={hasDescription ? 'text-headline-2' : 'text-body-1'}\n          render={<div />}\n        >\n          {title}\n        </BaseToast.Title>\n      )\n    }\n\n    return <BaseToast.Title className={hasDescription ? 'text-headline-2' : 'text-body-1'} />\n  }\n\n  const renderDescription = () => {\n    // Check ToastData first for JSX, then fallback to toast.description (string)\n    const description = toast.data?.description ?? toast.description\n\n    if (!description) return null\n\n    if (typeof description !== 'string') {\n      return (\n        <BaseToast.Description className=\"text-body-1\" render={<div />}>\n          {description}\n        </BaseToast.Description>\n      )\n    }\n\n    return <BaseToast.Description className=\"text-body-1\" />\n  }\n\n  return (\n    <BaseToast.Root key={toast.id} {...rootProps}>\n      <div className={cx('flex', compact ? 'gap-lg items-center' : 'gap-md flex-col')}>\n        <div className=\"gap-lg p-md flex grow items-center\">\n          {/* Icon */}\n          <Icon size=\"md\">{icon}</Icon>\n          {/* Title and description */}\n          <div\n            className={cx(\n              'gap-sm flex flex-col',\n              compact && 'flex-1',\n              !compact && isClosable && 'pr-3xl'\n            )}\n          >\n            {renderTitle()}\n            {renderDescription()}\n          </div>\n        </div>\n\n        <div className={cx('flex')}>\n          {/* Action button */}\n          {action && (\n            <ActionButton render={<Button {...actionProps} />}>{action.label}</ActionButton>\n          )}\n          {/* Close button - compact layout only */}\n          {compact && getCloseButton()}\n        </div>\n\n        {/* Close button - default layout only */}\n        {!compact && getCloseButton('top-md right-md absolute')}\n      </div>\n    </BaseToast.Root>\n  )\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport * as React from 'react'\n\nimport type { UseToastManagerReturnValue } from './types'\n\nexport function useToastManager(): UseToastManagerReturnValue {\n  const manager = BaseToast.useToastManager()\n  const managerRef = React.useRef(manager)\n  managerRef.current = manager\n\n  return React.useMemo(\n    () => ({\n      get toasts() {\n        return managerRef.current.toasts\n      },\n      add: options => managerRef.current.add(options),\n      update: (id, options) => managerRef.current.update(id, options),\n      close: id => managerRef.current.close(id),\n      promise: (p, options) => managerRef.current.promise(p, options),\n      closeAll: () => managerRef.current.toasts.forEach(({ id }) => managerRef.current.close(id)),\n    }),\n    []\n  )\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Slot } from '@spark-ui/components/slot'\nimport { cx } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { Toast } from './Toast'\nimport type { ToastData, ToastObject } from './types'\nimport { useToastManager } from './useToastManager'\n\nexport * from './types'\n\nfunction ToastList() {\n  const { toasts } = useToastManager()\n\n  return toasts.map(toast => <Toast key={toast.id} toast={toast} />)\n}\n\ninterface ToastProviderProps extends React.ComponentProps<typeof BaseToast.Provider> {\n  children: React.ReactNode\n}\n\n/**\n * A provider component that manages and displays temporary notification messages to users.\n */\nexport function ToastProvider({ children, limit = 3, ...props }: ToastProviderProps) {\n  return (\n    <BaseToast.Provider limit={limit} {...props}>\n      <BaseToast.Portal>\n        <BaseToast.Viewport\n          className={cx(\n            'z-toast right-lg bottom-lg text-on-surfa- fixed top-auto mx-auto flex w-fit flex-col items-end'\n          )}\n        >\n          <ToastList />\n        </BaseToast.Viewport>\n      </BaseToast.Portal>\n      {children}\n    </BaseToast.Provider>\n  )\n}\n\ninterface ToastTriggerProps\n  extends\n    Omit<React.ComponentPropsWithRef<'button'>, 'title'>,\n    Pick<ToastObject, 'priority'>,\n    Pick<ToastData, 'design' | 'intent' | 'icon' | 'isClosable' | 'action' | 'compact'> {\n  children: React.ReactNode\n  asChild?: boolean\n  title: string | React.ReactNode\n  description?: string | React.ReactNode\n  timeout?: number\n}\n\nexport function ToastTrigger({\n  children,\n  onClick,\n  asChild = false,\n  title,\n  description,\n  timeout = 5000,\n  design = 'filled',\n  intent = 'neutral',\n  isClosable = true,\n  icon,\n  action,\n  compact,\n  priority = 'low',\n}: ToastTriggerProps) {\n  const toastManager = useToastManager()\n\n  const Component = asChild ? Slot : 'button'\n\n  function createToast(e: React.MouseEvent<HTMLButtonElement>) {\n    onClick?.(e)\n    toastManager.add({\n      title,\n      description,\n      timeout,\n      priority,\n      data: {\n        design,\n        intent,\n        isClosable,\n        ...(icon && { icon }),\n        action,\n        ...(compact !== undefined && { compact }),\n      },\n    })\n  }\n\n  return (\n    <Component {...(!asChild && { type: 'button' })} onClick={createToast}>\n      {children}\n    </Component>\n  )\n}\n\nexport type ToastManager = ReturnType<typeof BaseToast.createToastManager>\n\nexport const createToastManager: () => ToastManager = BaseToast.createToastManager\n\nexport { useToastManager }\n"],"mappings":"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"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../src/toast/Toast.styles.ts","../../src/toast/Toast.tsx","../../src/toast/useToastManager.ts","../../src/toast/index.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority'\n\nexport const toastStyles = cva(\n  [\n    'gap-lg p-md flex w-max w-[min(400px,calc(100vw-var(--spacing-sz-32)))]! flex-col rounded-lg border-md',\n    'absolute right-0 bottom-0 left-auto mr-0',\n    'bg-clip-padding shadow-md select-none',\n    'focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none',\n    'z-[calc(1000-var(--toast-index))]',\n    \"after:absolute after:bottom-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']\",\n    // Stack effect while not focused\n    '[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)+calc(min(var(--toast-index),10)*-16px)))_scale(calc(max(0,1-(var(--toast-index)*0.1))))]',\n    // Scale and translate\n    'ease-standard [transition-property:opacity,transform]',\n    'duration-400',\n    // Present when the toast is animating in.\n    'data-[starting-style]:[transform:translateY(150%)]',\n    // Expanded: Present when the toast is expanded in the viewport.\n    'data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y)))]',\n    // Present when the toast is animating out.\n    'data-[ending-style]:duration-250',\n    'data-[ending-style]:opacity-0',\n    'data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]',\n    'data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n    'data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n    // Limited: Present when the toast was removed due to exceeding the limit.\n    'data-[limited]:opacity-0',\n  ],\n  {\n    variants: {\n      design: {\n        filled: '',\n        tinted: '',\n      },\n      intent: {\n        success: '',\n        alert: '',\n        error: '',\n        info: '',\n        neutral: '',\n        main: '',\n        support: '',\n        accent: '',\n        surface: '',\n        surfaceInverse: '',\n      },\n    },\n    compoundVariants: [\n      // Filled variants\n      {\n        design: 'filled',\n        intent: 'success',\n        class: ['bg-success text-on-success border-success'],\n      },\n      {\n        design: 'filled',\n        intent: 'alert',\n        class: ['bg-alert text-on-alert border-alert'],\n      },\n      {\n        design: 'filled',\n        intent: 'error',\n        class: ['bg-error text-on-error border-error'],\n      },\n      {\n        design: 'filled',\n        intent: 'info',\n        class: ['bg-info text-on-info border-info'],\n      },\n      {\n        design: 'filled',\n        intent: 'neutral',\n        class: ['bg-neutral text-on-neutral border-neutral'],\n      },\n      {\n        design: 'filled',\n        intent: 'main',\n        class: ['bg-main text-on-main border-main'],\n      },\n      {\n        design: 'filled',\n        intent: 'support',\n        class: ['bg-support text-on-support border-support'],\n      },\n      {\n        design: 'filled',\n        intent: 'accent',\n        class: ['bg-accent text-on-accent border-accent'],\n      },\n      {\n        design: 'filled',\n        intent: 'surface',\n        class: ['bg-surface text-on-surface border-surface'],\n      },\n      {\n        design: 'filled',\n        intent: 'surfaceInverse',\n        class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n      },\n\n      // Tinted variants\n      {\n        design: 'tinted',\n        intent: 'success',\n        class: ['bg-success-container text-on-success-container border-success'],\n      },\n      {\n        design: 'tinted',\n        intent: 'alert',\n        class: ['bg-alert-container text-on-alert-container border-alert'],\n      },\n      {\n        design: 'tinted',\n        intent: 'error',\n        class: ['bg-error-container text-on-error-container border-error'],\n      },\n      {\n        design: 'tinted',\n        intent: 'info',\n        class: ['bg-info-container text-on-info-container border-info'],\n      },\n      {\n        design: 'tinted',\n        intent: 'neutral',\n        class: ['bg-neutral-container text-on-neutral-container border-neutral'],\n      },\n      {\n        design: 'tinted',\n        intent: 'main',\n        class: ['bg-main-container text-on-main-container border-main'],\n      },\n      {\n        design: 'tinted',\n        intent: 'support',\n        class: ['bg-support-container text-on-support-container border-support'],\n      },\n      {\n        design: 'tinted',\n        intent: 'accent',\n        class: ['bg-accent-container text-on-accent-container border-accent'],\n      },\n      {\n        design: 'tinted',\n        intent: 'surface',\n        class: ['bg-surface text-on-surface border-surface'],\n      },\n      {\n        design: 'tinted',\n        intent: 'surfaceInverse',\n        class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n      },\n    ],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'neutral',\n    },\n  }\n)\n\nexport type ToastVariantProps = VariantProps<typeof toastStyles>\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Button, ButtonProps } from '@spark-ui/components/button'\nimport { Icon } from '@spark-ui/components/icon'\nimport { IconButton } from '@spark-ui/components/icon-button'\nimport { AlertFill } from '@spark-ui/icons/AlertFill'\nimport { Close } from '@spark-ui/icons/Close'\nimport { InfoFill } from '@spark-ui/icons/InfoFill'\nimport { ValidFill } from '@spark-ui/icons/ValidFill'\nimport { WarningFill } from '@spark-ui/icons/WarningFill'\nimport { cx } from 'class-variance-authority'\n\nimport { toastStyles } from './Toast.styles'\nimport type { ToastData, ToastDesign, ToastIntent, ToastObject } from './types'\n\nfunction getButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n  if (intent === 'surfaceInverse') return 'surface'\n  if (intent === 'surface') return 'surfaceInverse'\n  if (intent === 'error') return 'danger'\n\n  return intent as ButtonProps['intent']\n}\n\nfunction getCloseButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n  if (intent === 'surfaceInverse') return 'surfaceInverse'\n  if (intent === 'surface') return 'surface'\n  if (intent === 'error') return 'danger'\n\n  return intent as ButtonProps['intent']\n}\n\nconst getActionProps = (\n  action: ToastData['action'],\n  { toastDesign, toastIntent }: { toastDesign?: ToastDesign; toastIntent?: ToastIntent }\n): ButtonProps => {\n  if (!action) return {}\n\n  const { design, intent, className, onClick, ...rest } = action\n\n  return {\n    design: design ?? toastDesign,\n    intent: intent ?? getButtonIntent(toastIntent),\n    className: cx('ml-auto', className),\n    onClick,\n    ...rest,\n  }\n}\n\nconst getToastRootProps = (toast: ToastObject, design: ToastDesign, intent: ToastIntent) => ({\n  swipeDirection: ['down', 'right'] as ['down', 'right'],\n  toast,\n  className: cx(toastStyles({ design, intent })),\n  style: {\n    ['--gap' as string]: 'var(--spacing-md)',\n    ['--offset-y' as string]:\n      'calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y))',\n  },\n})\n\nfunction getDefaultIcon(intent: ToastIntent): React.ReactNode {\n  switch (intent) {\n    case 'info':\n      return <InfoFill />\n    case 'success':\n      return <ValidFill />\n    case 'alert':\n      return <WarningFill />\n    case 'error':\n      return <AlertFill />\n    case 'main':\n    case 'support':\n    case 'accent':\n    case 'neutral':\n    case 'surface':\n    case 'surfaceInverse':\n    default:\n      return <InfoFill />\n  }\n}\n\nexport function Toast({ toast }: { toast: ToastObject }) {\n  const {\n    icon: ToastIcon,\n    intent = 'info',\n    design: _design, // deprecated prop, ignored\n    action,\n    isClosable,\n    closeLabel = 'Close',\n    compact = false,\n  } = toast.data ?? {}\n\n  // Always use 'tinted' design regardless of prop value\n  const design = 'tinted' as const\n\n  const ActionButton = action?.close ? BaseToast.Close : BaseToast.Action\n  const actionProps = getActionProps(action, { toastDesign: design, toastIntent: intent })\n  const rootProps = getToastRootProps(toast, design, intent)\n\n  // Use provided icon or default icon based on intent\n  const icon = ToastIcon ?? getDefaultIcon(intent)\n\n  const getCloseButton = (className?: string) => {\n    if (!isClosable) return null\n\n    return (\n      <BaseToast.Close\n        className={className}\n        render={\n          <IconButton\n            aria-label={closeLabel}\n            design={design}\n            intent={getCloseButtonIntent(intent)}\n            size=\"md\"\n          />\n        }\n      >\n        <Icon>\n          <Close />\n        </Icon>\n      </BaseToast.Close>\n    )\n  }\n\n  const renderTitle = () => {\n    // Check ToastData first for JSX, then fallback to toast.title (string)\n    const title = toast.data?.title ?? toast.title\n    const hasDescription = !!(toast.data?.description ?? toast.description)\n\n    if (typeof title !== 'string' && title !== undefined) {\n      return (\n        <BaseToast.Title\n          className={hasDescription ? 'text-headline-2' : 'text-body-1'}\n          render={<div />}\n        >\n          {title}\n        </BaseToast.Title>\n      )\n    }\n\n    return <BaseToast.Title className={hasDescription ? 'text-headline-2' : 'text-body-1'} />\n  }\n\n  const renderDescription = () => {\n    // Check ToastData first for JSX, then fallback to toast.description (string)\n    const description = toast.data?.description ?? toast.description\n\n    if (!description) return null\n\n    if (typeof description !== 'string') {\n      return (\n        <BaseToast.Description className=\"text-body-1\" render={<div />}>\n          {description}\n        </BaseToast.Description>\n      )\n    }\n\n    return <BaseToast.Description className=\"text-body-1\" />\n  }\n\n  return (\n    <BaseToast.Root key={toast.id} {...rootProps}>\n      <div className={cx('flex', compact ? 'gap-lg items-center' : 'gap-md flex-col')}>\n        <div className=\"gap-lg p-md flex grow items-center\">\n          {/* Icon */}\n          <Icon size=\"md\">{icon}</Icon>\n          {/* Title and description */}\n          <div\n            className={cx(\n              'gap-sm flex flex-col',\n              compact && 'flex-1',\n              !compact && isClosable && 'pr-3xl'\n            )}\n          >\n            {renderTitle()}\n            {renderDescription()}\n          </div>\n        </div>\n\n        <div className={cx('flex')}>\n          {/* Action button */}\n          {action && (\n            <ActionButton render={<Button {...actionProps} />}>{action.label}</ActionButton>\n          )}\n          {/* Close button - compact layout only */}\n          {compact && getCloseButton()}\n        </div>\n\n        {/* Close button - default layout only */}\n        {!compact && getCloseButton('top-md right-md absolute')}\n      </div>\n    </BaseToast.Root>\n  )\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport * as React from 'react'\n\nimport type { UseToastManagerReturnValue } from './types'\n\nexport function useToastManager(): UseToastManagerReturnValue {\n  const manager = BaseToast.useToastManager()\n  const managerRef = React.useRef(manager)\n  managerRef.current = manager\n\n  return React.useMemo(\n    () => ({\n      get toasts() {\n        return managerRef.current.toasts\n      },\n      add: options => managerRef.current.add(options),\n      update: (id, options) => managerRef.current.update(id, options),\n      close: id => managerRef.current.close(id),\n      promise: (p, options) => managerRef.current.promise(p, options),\n      closeAll: () => managerRef.current.toasts.forEach(({ id }) => managerRef.current.close(id)),\n    }),\n    []\n  )\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Slot } from '@spark-ui/components/slot'\nimport { cx } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { Toast } from './Toast'\nimport type { ToastData, ToastObject } from './types'\nimport { useToastManager } from './useToastManager'\n\nexport * from './types'\n\nfunction ToastList() {\n  const { toasts } = useToastManager()\n\n  return toasts.map(toast => <Toast key={toast.id} toast={toast} />)\n}\n\ninterface ToastProviderProps extends React.ComponentProps<typeof BaseToast.Provider> {\n  children: React.ReactNode\n}\n\n/**\n * A provider component that manages and displays temporary notification messages to users.\n */\nexport function ToastProvider({ children, limit = 3, ...props }: ToastProviderProps) {\n  return (\n    <BaseToast.Provider limit={limit} {...props}>\n      <BaseToast.Portal>\n        <BaseToast.Viewport\n          className={cx(\n            'z-toast right-lg bottom-lg text-on-surfa- fixed top-auto mx-auto flex w-fit flex-col items-end'\n          )}\n        >\n          <ToastList />\n        </BaseToast.Viewport>\n      </BaseToast.Portal>\n      {children}\n    </BaseToast.Provider>\n  )\n}\n\ninterface ToastTriggerProps\n  extends\n    Omit<React.ComponentPropsWithRef<'button'>, 'title'>,\n    Pick<ToastObject, 'priority'>,\n    Pick<ToastData, 'design' | 'intent' | 'icon' | 'isClosable' | 'action' | 'compact'> {\n  children: React.ReactNode\n  asChild?: boolean\n  title: string | React.ReactNode\n  description?: string | React.ReactNode\n  timeout?: number\n}\n\nexport function ToastTrigger({\n  children,\n  onClick,\n  asChild = false,\n  title,\n  description,\n  timeout = 5000,\n  design = 'filled',\n  intent = 'neutral',\n  isClosable = true,\n  icon,\n  action,\n  compact,\n  priority = 'low',\n}: ToastTriggerProps) {\n  const toastManager = useToastManager()\n\n  const Component = asChild ? Slot : 'button'\n\n  function createToast(e: React.MouseEvent<HTMLButtonElement>) {\n    onClick?.(e)\n    toastManager.add({\n      title,\n      description,\n      timeout,\n      priority,\n      data: {\n        design,\n        intent,\n        isClosable,\n        ...(icon && { icon }),\n        action,\n        ...(compact !== undefined && { compact }),\n      },\n    })\n  }\n\n  return (\n    <Component {...(!asChild && { type: 'button' })} onClick={createToast}>\n      {children}\n    </Component>\n  )\n}\n\nexport type ToastManager = ReturnType<typeof BaseToast.createToastManager>\n\nexport const createToastManager: () => ToastManager = BaseToast.createToastManager\n\nexport { useToastManager }\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spark-ui/components",
-  "version": "18.1.2",
+  "version": "18.1.3",
   "license": "MIT",
   "description": "Spark (Leboncoin design system) components.",
   "exports": {
@@ -53,9 +53,9 @@
     "@react-types/checkbox": "^3.11.0",
     "@react-types/grid": "^3.4.0",
     "@react-types/shared": "^3.36.0",
-    "@spark-ui/hooks": "18.1.2",
-    "@spark-ui/icons": "18.1.2",
-    "@spark-ui/internal-utils": "18.1.2",
+    "@spark-ui/hooks": "18.1.3",
+    "@spark-ui/icons": "18.1.3",
+    "@spark-ui/internal-utils": "18.1.3",
     "@zag-js/pagination": "1.30.0",
     "@zag-js/react": "1.30.0",
     "class-variance-authority": "0.7.1",
@@ -67,7 +67,7 @@
     "react-snap-carousel": "0.5.1"
   },
   "peerDependencies": {
-    "@spark-ui/theme-utils": "18.1.2",
+    "@spark-ui/theme-utils": "18.1.3",
     "react": "19.2.4",
     "react-dom": "19.2.4",
     "tailwindcss": "4.1.18"