@spark-ui/components 17.2.4 → 17.2.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3,8 +3,4 @@ export declare const toastStyles: (props?: ({
3
3
  design?: "filled" | "tinted" | null | undefined;
4
4
  intent?: "main" | "alert" | "error" | "support" | "accent" | "success" | "info" | "neutral" | "surface" | "surfaceInverse" | null | undefined;
5
5
  } & import('class-variance-authority/types').ClassProp) | undefined) => string;
6
- export declare const snackbarItemVariantContent: (props?: ({
7
- actionOnNewline?: boolean | null | undefined;
8
- } & import('class-variance-authority/types').ClassProp) | undefined) => string;
9
6
  export type ToastVariantProps = VariantProps<typeof toastStyles>;
10
- export type SnackbarItemVariantContentProps = VariantProps<typeof snackbarItemVariantContent>;
@@ -1,2 +1,2 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../chunk-C91j1N6u.js`),t=require(`../slot/index.js`),n=require(`../icon-CRPcdgYp.js`),r=require(`../button-BTDRzvpB.js`),i=require(`../icon-button-CykysbgJ.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`}});(0,a.cva)([`inline-grid items-center`,`col-start-1 row-start-1`,`pl-md pr-lg`],{variants:{actionOnNewline:{true:[`grid-rows-[52px_1fr_52px]`,`grid-cols-[min-content_1fr_min-content]`,`[grid-template-areas:'icon_message_close'_'._message_.'_'action_action_action']`],false:[`grid-cols-[min-content_1fr_min-content_min-content]`,`[grid-template-areas:'icon_message_action_close']`]}},defaultVariants:{actionOnNewline:!1}});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.useCallback(()=>{e.toasts.forEach(({id:t})=>e.close(t))},[e]);return{...e,closeAll:t}}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;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../chunk-C91j1N6u.js`),t=require(`../slot/index.js`),n=require(`../icon-CRPcdgYp.js`),r=require(`../button-BTDRzvpB.js`),i=require(`../icon-button-CykysbgJ.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.useCallback(()=>{e.toasts.forEach(({id:t})=>e.close(t))},[e]);return{...e,closeAll:t}}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;
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +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 const snackbarItemVariantContent = cva(\n [\n 'inline-grid items-center',\n 'col-start-1 row-start-1',\n 'pl-md pr-lg', // applying padding on the parent prevents VoiceOver on Safari from reading snackbar content 🤷\n ],\n {\n variants: {\n /**\n * Force action button displaying on a new line\n * @default false\n */\n actionOnNewline: {\n true: [\n 'grid-rows-[52px_1fr_52px]',\n 'grid-cols-[min-content_1fr_min-content]',\n \"[grid-template-areas:'icon_message_close'_'._message_.'_'action_action_action']\",\n ],\n false: [\n 'grid-cols-[min-content_1fr_min-content_min-content]',\n \"[grid-template-areas:'icon_message_action_close']\",\n ],\n },\n },\n defaultVariants: {\n actionOnNewline: false,\n },\n }\n)\n\nexport type ToastVariantProps = VariantProps<typeof toastStyles>\nexport type SnackbarItemVariantContentProps = VariantProps<typeof snackbarItemVariantContent>\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 baseToastManager = BaseToast.useToastManager()\n\n const closeAll = React.useCallback((): void => {\n baseToastManager.toasts.forEach(({ id }) => baseToastManager.close(id))\n }, [baseToastManager])\n\n return {\n ...baseToastManager,\n closeAll,\n } as UseToastManagerReturnValue\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\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":"gkBAEA,IAAa,GAAA,EAAA,EAAA,KACX,CACE,wFACA,2CACA,wCACA,2EACA,oCACA,+GAEA,8LAEA,wDACA,eAEA,qDAEA,wLAEA,mCACA,gCACA,mHACA,gJACA,gKAEA,2BACD,CACD,CACE,SAAU,CACR,OAAQ,CACN,OAAQ,GACR,OAAQ,GACT,CACD,OAAQ,CACN,QAAS,GACT,MAAO,GACP,MAAO,GACP,KAAM,GACN,QAAS,GACT,KAAM,GACN,QAAS,GACT,OAAQ,GACR,QAAS,GACT,eAAgB,GACjB,CACF,CACD,iBAAkB,CAEhB,CACE,OAAQ,SACR,OAAQ,UACR,MAAO,CAAC,4CAA4C,CACrD,CACD,CACE,OAAQ,SACR,OAAQ,QACR,MAAO,CAAC,sCAAsC,CAC/C,CACD,CACE,OAAQ,SACR,OAAQ,QACR,MAAO,CAAC,sCAAsC,CAC/C,CACD,CACE,OAAQ,SACR,OAAQ,OACR,MAAO,CAAC,mCAAmC,CAC5C,CACD,CACE,OAAQ,SACR,OAAQ,UACR,MAAO,CAAC,4CAA4C,CACrD,CACD,CACE,OAAQ,SACR,OAAQ,OACR,MAAO,CAAC,mCAAmC,CAC5C,CACD,CACE,OAAQ,SACR,OAAQ,UACR,MAAO,CAAC,4CAA4C,CACrD,CACD,CACE,OAAQ,SACR,OAAQ,SACR,MAAO,CAAC,yCAAyC,CAClD,CACD,CACE,OAAQ,SACR,OAAQ,UACR,MAAO,CAAC,4CAA4C,CACrD,CACD,CACE,OAAQ,SACR,OAAQ,iBACR,MAAO,CAAC,oEAAoE,CAC7E,CAGD,CACE,OAAQ,SACR,OAAQ,UACR,MAAO,CAAC,gEAAgE,CACzE,CACD,CACE,OAAQ,SACR,OAAQ,QACR,MAAO,CAAC,0DAA0D,CACnE,CACD,CACE,OAAQ,SACR,OAAQ,QACR,MAAO,CAAC,0DAA0D,CACnE,CACD,CACE,OAAQ,SACR,OAAQ,OACR,MAAO,CAAC,uDAAuD,CAChE,CACD,CACE,OAAQ,SACR,OAAQ,UACR,MAAO,CAAC,gEAAgE,CACzE,CACD,CACE,OAAQ,SACR,OAAQ,OACR,MAAO,CAAC,uDAAuD,CAChE,CACD,CACE,OAAQ,SACR,OAAQ,UACR,MAAO,CAAC,gEAAgE,CACzE,CACD,CACE,OAAQ,SACR,OAAQ,SACR,MAAO,CAAC,6DAA6D,CACtE,CACD,CACE,OAAQ,SACR,OAAQ,UACR,MAAO,CAAC,4CAA4C,CACrD,CACD,CACE,OAAQ,SACR,OAAQ,iBACR,MAAO,CAAC,oEAAoE,CAC7E,CACF,CACD,gBAAiB,CACf,OAAQ,SACR,OAAQ,UACT,CACF,CACF,EAEY,EAAA,EAAA,KACX,CACE,2BACA,0BACA,cACD,CACD,CACE,SAAU,CAKR,gBAAiB,CACf,KAAM,CACJ,4BACA,0CACA,kFACD,CACD,MAAO,CACL,sDACA,oDACD,CACF,CACF,CACD,gBAAiB,CACf,gBAAiB,GAClB,CACF,CACF,CC7KD,SAAS,EAAgB,EAA6C,CAKpE,OAJI,IAAW,iBAAyB,UACpC,IAAW,UAAkB,iBAC7B,IAAW,QAAgB,SAExB,EAGT,SAAS,EAAqB,EAA6C,CAKzE,OAJI,IAAW,iBAAyB,iBACpC,IAAW,UAAkB,UAC7B,IAAW,QAAgB,SAExB,EAGT,IAAM,GACJ,EACA,CAAE,cAAa,iBACC,CAChB,GAAI,CAAC,EAAQ,MAAO,EAAE,CAEtB,GAAM,CAAE,SAAQ,SAAQ,YAAW,UAAS,GAAG,GAAS,EAExD,MAAO,CACL,OAAQ,GAAU,EAClB,OAAQ,GAAU,EAAgB,EAAY,CAC9C,WAAA,EAAA,EAAA,IAAc,UAAW,EAAU,CACnC,UACA,GAAG,EACJ,EAGG,GAAqB,EAAoB,EAAqB,KAAyB,CAC3F,eAAgB,CAAC,OAAQ,QAAQ,CACjC,QACA,WAAA,EAAA,EAAA,IAAc,EAAY,CAAE,SAAQ,SAAQ,CAAC,CAAC,CAC9C,MAAO,CACJ,QAAoB,oBACpB,aACC,4GACH,CACF,EAED,SAAS,EAAe,EAAsC,CAC5D,OAAQ,EAAR,CACE,IAAK,OACH,OAAO,EAAA,EAAA,KAAC,EAAA,SAAD,EAAY,CAAA,CACrB,IAAK,UACH,OAAO,EAAA,EAAA,KAAC,EAAA,UAAD,EAAa,CAAA,CACtB,IAAK,QACH,OAAO,EAAA,EAAA,KAAC,EAAA,YAAD,EAAe,CAAA,CACxB,IAAK,QACH,OAAO,EAAA,EAAA,KAAC,EAAA,UAAD,EAAa,CAAA,CAOtB,QACE,OAAO,EAAA,EAAA,KAAC,EAAA,SAAD,EAAY,CAAA,EAIzB,SAAgB,EAAM,CAAE,SAAiC,CACvD,GAAM,CACJ,KAAM,EACN,SAAS,OACT,OAAQ,EACR,SACA,aACA,aAAa,QACb,UAAU,IACR,EAAM,MAAQ,EAAE,CAGd,EAAS,SAET,EAAe,GAAQ,MAAQ,EAAA,MAAU,MAAQ,EAAA,MAAU,OAC3D,EAAc,EAAe,EAAQ,CAAE,YAAa,EAAQ,YAAa,EAAQ,CAAC,CAClF,EAAY,EAAkB,EAAO,EAAQ,EAAO,CAGpD,EAAO,GAAa,EAAe,EAAO,CAE1C,EAAkB,GACjB,GAGH,EAAA,EAAA,KAAC,EAAA,MAAU,MAAX,CACa,YACX,QACE,EAAA,EAAA,KAAC,EAAA,EAAD,CACE,aAAY,EACJ,SACR,OAAQ,EAAqB,EAAO,CACpC,KAAK,KACL,CAAA,WAGJ,EAAA,EAAA,KAAC,EAAA,EAAD,CAAA,UACE,EAAA,EAAA,KAAC,EAAA,MAAD,EAAS,CAAA,CACJ,CAAA,CACS,CAAA,CAjBI,KAqBpB,MAAoB,CAExB,IAAM,EAAQ,EAAM,MAAM,OAAS,EAAM,MACnC,EAAiB,CAAC,EAAE,EAAM,MAAM,aAAe,EAAM,aAa3D,OAXI,OAAO,GAAU,UAAY,IAAU,IAAA,IAEvC,EAAA,EAAA,KAAC,EAAA,MAAU,MAAX,CACE,UAAW,EAAiB,kBAAoB,cAChD,QAAQ,EAAA,EAAA,KAAC,MAAD,EAAO,CAAA,UAEd,EACe,CAAA,EAIf,EAAA,EAAA,KAAC,EAAA,MAAU,MAAX,CAAiB,UAAW,EAAiB,kBAAoB,cAAiB,CAAA,EAGrF,MAA0B,CAE9B,IAAM,EAAc,EAAM,MAAM,aAAe,EAAM,YAYrD,OAVK,EAED,OAAO,GAAgB,UAQpB,EAAA,EAAA,KAAC,EAAA,MAAU,YAAX,CAAuB,UAAU,cAAgB,CAAA,EANpD,EAAA,EAAA,KAAC,EAAA,MAAU,YAAX,CAAuB,UAAU,cAAc,QAAQ,EAAA,EAAA,KAAC,MAAD,EAAO,CAAA,UAC3D,EACqB,CAAA,CANH,MAa3B,OACE,EAAA,EAAA,KAAC,EAAA,MAAU,KAAX,CAA+B,GAAI,YACjC,EAAA,EAAA,MAAC,MAAD,CAAK,WAAA,EAAA,EAAA,IAAc,OAAQ,EAAU,sBAAwB,kBAAkB,UAA/E,EACE,EAAA,EAAA,MAAC,MAAD,CAAK,UAAU,8CAAf,EAEE,EAAA,EAAA,KAAC,EAAA,EAAD,CAAM,KAAK,cAAM,EAAY,CAAA,EAE7B,EAAA,EAAA,MAAC,MAAD,CACE,WAAA,EAAA,EAAA,IACE,uBACA,GAAW,SACX,CAAC,GAAW,GAAc,SAC3B,UALH,CAOG,GAAa,CACb,GAAmB,CAChB,GACF,IAEN,EAAA,EAAA,MAAC,MAAD,CAAK,WAAA,EAAA,EAAA,IAAc,OAAO,UAA1B,CAEG,IACC,EAAA,EAAA,KAAC,EAAD,CAAc,QAAQ,EAAA,EAAA,KAAC,EAAA,EAAD,CAAQ,GAAI,EAAe,CAAA,UAAG,EAAO,MAAqB,CAAA,CAGjF,GAAW,GAAgB,CACxB,GAGL,CAAC,GAAW,EAAe,2BAA2B,CACnD,GACS,CA9BI,EAAM,GA8BV,CCxLrB,SAAgB,GAA8C,CAC5D,IAAM,EAAmB,EAAA,MAAU,iBAAiB,CAE9C,EAAW,EAAM,gBAAwB,CAC7C,EAAiB,OAAO,SAAS,CAAE,QAAS,EAAiB,MAAM,EAAG,CAAC,EACtE,CAAC,EAAiB,CAAC,CAEtB,MAAO,CACL,GAAG,EACH,WACD,CCJH,SAAS,GAAY,CACnB,GAAM,CAAE,UAAW,GAAiB,CAEpC,OAAO,EAAO,IAAI,IAAS,EAAA,EAAA,KAAC,EAAD,CAA6B,QAAS,CAA1B,EAAM,GAAoB,CAAC,CAOpE,SAAgB,EAAc,CAAE,WAAU,QAAQ,EAAG,GAAG,GAA6B,CACnF,OACE,EAAA,EAAA,MAAC,EAAA,MAAU,SAAX,CAA2B,QAAO,GAAI,WAAtC,EACE,EAAA,EAAA,KAAC,EAAA,MAAU,OAAX,CAAA,UACE,EAAA,EAAA,KAAC,EAAA,MAAU,SAAX,CACE,WAAA,EAAA,EAAA,IACE,iGACD,WAED,EAAA,EAAA,KAAC,EAAD,EAAa,CAAA,CACM,CAAA,CACJ,CAAA,CAClB,EACkB,GAgBzB,SAAgB,EAAa,CAC3B,WACA,UACA,UAAU,GACV,QACA,cACA,UAAU,IACV,SAAS,SACT,SAAS,UACT,aAAa,GACb,OACA,SACA,UACA,WAAW,OACS,CACpB,IAAM,EAAe,GAAiB,CAEhC,EAAY,EAAU,EAAA,KAAO,SAEnC,SAAS,EAAY,EAAwC,CAC3D,IAAU,EAAE,CACZ,EAAa,IAAI,CACf,QACA,cACA,UACA,WACA,KAAM,CACJ,SACA,SACA,aACA,GAAI,GAAQ,CAAE,OAAM,CACpB,SACA,GAAI,IAAY,IAAA,IAAa,CAAE,UAAS,CACzC,CACF,CAAC,CAGJ,OACE,EAAA,EAAA,KAAC,EAAD,CAAW,GAAK,CAAC,GAAW,CAAE,KAAM,SAAU,CAAG,QAAS,EACvD,WACS,CAAA,CAMhB,IAAa,EAAyC,EAAA,MAAU"}
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 baseToastManager = BaseToast.useToastManager()\n\n const closeAll = React.useCallback((): void => {\n baseToastManager.toasts.forEach(({ id }) => baseToastManager.close(id))\n }, [baseToastManager])\n\n return {\n ...baseToastManager,\n closeAll,\n } as UseToastManagerReturnValue\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\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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"}
@@ -156,21 +156,6 @@ var h = i([
156
156
  intent: "neutral"
157
157
  }
158
158
  });
159
- i([
160
- "inline-grid items-center",
161
- "col-start-1 row-start-1",
162
- "pl-md pr-lg"
163
- ], {
164
- variants: { actionOnNewline: {
165
- true: [
166
- "grid-rows-[52px_1fr_52px]",
167
- "grid-cols-[min-content_1fr_min-content]",
168
- "[grid-template-areas:'icon_message_close'_'._message_.'_'action_action_action']"
169
- ],
170
- false: ["grid-cols-[min-content_1fr_min-content_min-content]", "[grid-template-areas:'icon_message_action_close']"]
171
- } },
172
- defaultVariants: { actionOnNewline: !1 }
173
- });
174
159
  //#endregion
175
160
  //#region src/toast/Toast.tsx
176
161
  function g(e) {
@@ -1 +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 const snackbarItemVariantContent = cva(\n [\n 'inline-grid items-center',\n 'col-start-1 row-start-1',\n 'pl-md pr-lg', // applying padding on the parent prevents VoiceOver on Safari from reading snackbar content 🤷\n ],\n {\n variants: {\n /**\n * Force action button displaying on a new line\n * @default false\n */\n actionOnNewline: {\n true: [\n 'grid-rows-[52px_1fr_52px]',\n 'grid-cols-[min-content_1fr_min-content]',\n \"[grid-template-areas:'icon_message_close'_'._message_.'_'action_action_action']\",\n ],\n false: [\n 'grid-cols-[min-content_1fr_min-content_min-content]',\n \"[grid-template-areas:'icon_message_action_close']\",\n ],\n },\n },\n defaultVariants: {\n actionOnNewline: false,\n },\n }\n)\n\nexport type ToastVariantProps = VariantProps<typeof toastStyles>\nexport type SnackbarItemVariantContentProps = VariantProps<typeof snackbarItemVariantContent>\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 baseToastManager = BaseToast.useToastManager()\n\n const closeAll = React.useCallback((): void => {\n baseToastManager.toasts.forEach(({ id }) => baseToastManager.close(id))\n }, [baseToastManager])\n\n return {\n ...baseToastManager,\n closeAll,\n } as UseToastManagerReturnValue\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\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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"}
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 baseToastManager = BaseToast.useToastManager()\n\n const closeAll = React.useCallback((): void => {\n baseToastManager.toasts.forEach(({ id }) => baseToastManager.close(id))\n }, [baseToastManager])\n\n return {\n ...baseToastManager,\n closeAll,\n } as UseToastManagerReturnValue\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\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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spark-ui/components",
3
- "version": "17.2.4",
3
+ "version": "17.2.5",
4
4
  "license": "MIT",
5
5
  "description": "Spark (Leboncoin design system) components.",
6
6
  "exports": {
@@ -53,9 +53,9 @@
53
53
  "@react-aria/toast": "^3.0.0-beta.18",
54
54
  "@react-stately/numberfield": "3.9.11",
55
55
  "@react-stately/toast": "^3.0.0-beta.7",
56
- "@spark-ui/hooks": "^17.2.4",
57
- "@spark-ui/icons": "^17.2.4",
58
- "@spark-ui/internal-utils": "^17.2.4",
56
+ "@spark-ui/hooks": "^17.2.5",
57
+ "@spark-ui/icons": "^17.2.5",
58
+ "@spark-ui/internal-utils": "^17.2.5",
59
59
  "@zag-js/pagination": "1.30.0",
60
60
  "@zag-js/react": "1.30.0",
61
61
  "class-variance-authority": "0.7.1",
@@ -1,2 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../icon-CRPcdgYp.js`),t=require(`../button-BTDRzvpB.js`),n=require(`../icon-button-CykysbgJ.js`);let r=require(`class-variance-authority`),i=require(`react`),a=require(`react/jsx-runtime`),o=require(`@spark-ui/icons/Close`),s=require(`@react-stately/toast`),c=require(`react-dom`),l=require(`@react-aria/toast`);var u=[{design:`filled`,intent:`success`,class:[`bg-success text-on-success`]},{design:`filled`,intent:`alert`,class:[`bg-alert text-on-alert`]},{design:`filled`,intent:`error`,class:[`bg-error text-on-error`]},{design:`filled`,intent:`info`,class:[`bg-info text-on-info`]},{design:`filled`,intent:`neutral`,class:[`bg-neutral text-on-neutral`]},{design:`filled`,intent:`main`,class:[`bg-main text-on-main`]},{design:`filled`,intent:`support`,class:[`bg-support text-on-support`]},{design:`filled`,intent:`accent`,class:[`bg-accent text-on-accent`]},{design:`filled`,intent:`inverse`,class:[`bg-surface-inverse text-on-surface-inverse`]}],d=[{design:`tinted`,intent:`success`,class:[`bg-success-container text-on-success-container`]},{design:`tinted`,intent:`alert`,class:[`bg-alert-container text-on-alert-container`]},{design:`tinted`,intent:`error`,class:[`bg-error-container text-on-error-container`]},{design:`tinted`,intent:`info`,class:[`bg-info-container text-on-info-container`]},{design:`tinted`,intent:`neutral`,class:[`bg-neutral-container text-on-neutral-container`]},{design:`tinted`,intent:`main`,class:[`bg-main-container text-on-main-container`]},{design:`tinted`,intent:`support`,class:[`bg-support-container text-on-support-container`]},{design:`tinted`,intent:`accent`,class:[`bg-accent-container text-on-accent-container`]},{design:`tinted`,intent:`inverse`,class:[`bg-surface-inverse text-on-surface-inverse`]}],f=(0,r.cva)(`rounded-md shadow-sm.max-w-[600px].cursor-default pointer-events-auto touch-none select-none.absolute.group-focus-visible:outline-hidden group-focus-visible:u-outline group-not-focus-visible:ring-inset.group-data-[position=bottom]:bottom-0 group-data-[position=bottom-left]:bottom-0 group-data-[position=bottom-right]:bottom-0.group-data-[position=top]:top-0 group-data-[position=top-left]:top-0 group-data-[position=top-right]:top-0.animation-duration-400.[animation-fill-mode: forwards]!.data-[animation=queued]:animate-fade-in.data-[animation=entering]:animation-ease-decelerate-back.data-[animation=exiting]:animation-ease-accelerate.data-[animation=entering]:group-data-[position=bottom]:[&:not([data-swipe])]:animate-slide-in-bottom.data-[animation=exiting]:opacity-0 data-[animation=exiting]:transition-opacity.data-[animation=exiting]:group-data-[position=bottom]:[&:not([data-swipe])]:animate-slide-out-bottom.data-[animation=entering]:group-data-[position=bottom-left]:[&:not([data-swipe])]:animate-slide-in-bottom.data-[animation=exiting]:group-data-[position=bottom-left]:[&:not([data-swipe])]:animate-slide-out-bottom.data-[animation=entering]:group-data-[position=bottom-right]:[&:not([data-swipe])]:animate-slide-in-bottom.data-[animation=exiting]:group-data-[position=bottom-right]:[&:not([data-swipe])]:animate-slide-out-bottom.data-[animation=entering]:group-data-[position=top]:[&:not([data-swipe])]:animate-slide-in-top.data-[animation=exiting]:group-data-[position=top]:[&:not([data-swipe])]:animate-slide-out-top.data-[animation=entering]:group-data-[position=top-left]:[&:not([data-swipe])]:animate-slide-in-top.data-[animation=exiting]:group-data-[position=top-left]:[&:not([data-swipe])]:animate-slide-out-top.data-[animation=entering]:group-data-[position=top-right]:[&:not([data-swipe])]:animate-slide-in-top.data-[animation=exiting]:group-data-[position=top-right]:[&:not([data-swipe])]:animate-slide-out-top.data-[swipe=move]:data-[swipe-direction=right]:translate-x-(--swipe-position-x).data-[swipe=move]:data-[swipe-direction=left]:translate-x-(--swipe-position-x).data-[swipe=cancel]:translate-x-0.data-[swipe=end]:data-[swipe-direction=right]:animate-standalone-swipe-out-right.data-[swipe=end]:data-[swipe-direction=left]:animate-standalone-swipe-out-left`.split(`.`),{variants:{design:{filled:``,tinted:``},intent:{success:``,alert:``,error:``,info:``,neutral:``,main:``,support:``,accent:``,inverse:``}},compoundVariants:[...u,...d],defaultVariants:{design:`filled`,intent:`neutral`}}),p=(0,r.cva)([`inline-grid items-center`,`col-start-1 row-start-1`,`pl-md pr-lg`],{variants:{actionOnNewline:{true:[`grid-rows-[52px_1fr_52px]`,`grid-cols-[min-content_1fr_min-content]`,`[grid-template-areas:'icon_message_close'_'._message_.'_'action_action_action']`],false:[`grid-cols-[min-content_1fr_min-content_min-content]`,`[grid-template-areas:'icon_message_action_close']`]}},defaultVariants:{actionOnNewline:!1}}),m=(0,i.createContext)({}),h=()=>(0,i.useContext)(m),g=({design:e=`filled`,intent:n=`neutral`,onClick:i,children:o,className:s,ref:c,...l})=>{let{toast:u,state:d}=h(),f=n??u.content.intent,p=e??u.content.design;return(0,a.jsx)(t.t,{"data-spark-component":`snackbar-item-action`,ref:c,size:`md`,shape:`rounded`,...f===`inverse`?{design:`ghost`,intent:`surface`}:{design:p,intent:f===`error`?`danger`:f},onClick:e=>{i?.(e),d.close(u.key)},style:{gridArea:`action`,...l.style},className:(0,r.cx)(`ml-md justify-self-end`,s),...l,children:o})};g.displayName=`Snackbar.ItemAction`;var _=({design:t=`filled`,intent:i=`neutral`,"aria-label":s,onClick:c,className:l,ref:u,...d})=>{let{toast:f,state:p}=h(),m=i??f.content.intent,g=t??f.content.design;return(0,a.jsx)(n.t,{"data-spark-component":`snackbar-item-close`,ref:u,size:`md`,shape:`rounded`,...m===`inverse`?{design:`ghost`,intent:`surface`}:{design:g,intent:m===`error`?`danger`:m},"aria-label":s,onClick:e=>{c?.(e),p.close(f.key)},style:{gridArea:`close`,...d.style},className:(0,r.cx)(`ml-md justify-self-end`,l),...d,children:(0,a.jsx)(e.t,{size:`sm`,children:(0,a.jsx)(o.Close,{})})})};_.displayName=`Snackbar.ItemClose`;var v=({children:t,className:n,...i})=>(0,a.jsx)(e.t,{size:`md`,className:(0,r.cx)(`mx-md`,n),style:{gridArea:`icon`,...i.style},...i,children:t});v.displayName=`Snackbar.ItemIcon`;var y=75,b=({swipeRef:e,onSwipeStart:t,onSwipeMove:n,onSwipeCancel:r,onSwipeEnd:a,threshold:o=10})=>{let[s,c]=(0,i.useState)(),l=(0,i.useRef)(null),u=(0,i.useRef)(null),d=(0,i.useRef)(null),f=e=>{u.current={x:e.clientX,y:e.clientY},document.addEventListener(`selectstart`,e=>e.preventDefault())},p=r=>{if(!u.current)return;let i=Math.abs(r.clientX-u.current.x),a=Math.abs(r.clientY-u.current.y),s;i>a&&i>o?l.current=r.clientX>u.current.x?`right`:`left`:a>o&&(l.current=r.clientY>u.current.y?`down`:`up`),l.current&&(d.current?(s=`move`,d.current={x:i,y:a},e.current.style.setProperty(`--swipe-position-x`,`${i>a?r.clientX-u.current.x:0}px`),e.current.style.setProperty(`--swipe-position-y`,`${i>a?0:r.clientY-u.current.y}px`),n?.({state:s,direction:l.current})):(s=`start`,d.current={x:i,y:a},t?.({state:s,direction:l.current})),c(s))},m=()=>{let e=d.current;if(u.current=null,d.current=null,e){let{x:t,y:n}=e,i;t>n?t>y?(i=`end`,a?.({state:i,direction:l.current})):(i=`cancel`,r?.({state:i,direction:l.current})):n>y?(i=`end`,a?.({state:i,direction:l.current})):(i=`cancel`,r?.({state:i,direction:l.current})),c(i),document.removeEventListener(`selectstart`,e=>e.preventDefault())}};return(0,i.useEffect)(()=>{if(!e.current)return;let t=e.current;return t.addEventListener(`pointerdown`,f),document.addEventListener(`pointermove`,p),document.addEventListener(`pointerup`,m),()=>{t.removeEventListener(`pointerdown`,f),document.removeEventListener(`pointermove`,p),document.removeEventListener(`pointerup`,m)}},[]),{state:s,direction:l.current}},x=({"aria-label":e,"aria-labelledby":t,"aria-describedby":n,"aria-details":r,design:o,intent:s,actionOnNewline:c,className:u,children:d,ref:m,...y})=>{let x=(0,i.useRef)(null),C=typeof m==`function`?x:m||x,{toast:w,state:T}=h(),{state:E,direction:D}=b({swipeRef:C,onSwipeStart:T.pauseAll,onSwipeCancel:T.resumeAll,onSwipeEnd:({direction:e})=>{[`left`,`right`].includes(`${e}`)&&T.close(w.key)}}),{message:O,icon:k,isClosable:A,onAction:j,actionLabel:M}=w.content,N=s??w.content.intent,P=o??w.content.design,F=c??w.content.actionOnNewline,{toastProps:I,titleProps:L,closeButtonProps:R,contentProps:z}=(0,l.useToast)({toast:w,ariaLabel:e,ariaLabelledby:t,ariaDescribedby:n,ariaDetails:r},T,C),B=(0,i.useCallback)(e=>i.Children.toArray(d).filter(i.isValidElement).find(t=>!!t.type.displayName?.includes(e)),[d]),V=B(`Snackbar.ItemIcon`),H=B(`Snackbar.ItemAction`),U=B(`Snackbar.ItemClose`);return(0,a.jsx)(`div`,{"data-spark-component":`snackbar-item`,className:f({design:P,intent:N,className:u}),"data-animation":w.animation,...!(E===`cancel`&&w.animation===`exiting`)&&{"data-swipe":E,"data-swipe-direction":D},...w.animation===`exiting`&&{onAnimationEnd:()=>T.remove(w.key)},ref:C,...I,...y,children:(0,a.jsxs)(`div`,{className:p({actionOnNewline:F}),...z,children:[S(V,k?v:null,{children:k}),(0,a.jsx)(`p`,{className:`px-md py-lg text-body-2 row-span-3`,style:{gridArea:`message`},...L,children:O}),S(H,M&&j?g:null,{intent:N,design:P,onClick:j,children:M}),S(U,A?_:null,{intent:N,design:P,"aria-label":R[`aria-label`]})]})})};x.displayName=`Snackbar.Item`;var S=(e,t,n)=>e?(0,i.cloneElement)(e,{...n,...e.props}):t?(0,a.jsx)(t,{...n}):null,C=(0,r.cva)([`fixed inset-x-lg z-toast group`,`outline-hidden pointer-events-none`,`grid grid-rows-1 grid-cols-1 gap-lg`],{variants:{position:{top:`top-lg justify-items-center`,"top-right":`top-lg justify-items-end`,"top-left":`top-lg justify-items-start`,bottom:`bottom-lg justify-items-center`,"bottom-right":`bottom-lg justify-items-end`,"bottom-left":`bottom-lg justify-items-start`}},defaultVariants:{position:`bottom`}}),w=({children:e=(0,a.jsx)(x,{}),state:t,position:n=`bottom`,className:r,ref:o,...s})=>{let c=(0,i.useRef)(null),u=o&&typeof o!=`function`?o:c,{regionProps:d}=(0,l.useToastRegion)(s,t,u);return(0,a.jsx)(`div`,{...d,ref:u,"data-position":n,className:C({position:n,className:r}),children:t.visibleToasts.map(n=>(0,a.jsx)(m.Provider,{value:{toast:n,state:t},children:(0,i.cloneElement)(e,{key:n.key})},n.key))})},T=({providers:e,subscriptions:t})=>{let n=(0,i.useCallback)(e=>(t.add(e),()=>t.delete(e)),[t]),r=(0,i.useCallback)(()=>[...e].reverse()[0],[e]),a=(0,i.useCallback)(n=>{e.add(n);for(let e of t)e()},[e,t]),o=(0,i.useCallback)(n=>{e.delete(n);for(let e of t)e()},[e,t]);return{provider:(0,i.useSyncExternalStore)(n,r,r),addProvider:a,deleteProvider:o}},E=null,D=()=>(E||=new s.ToastQueue({maxVisibleToasts:1,hasExitAnimation:!0}),E),O=()=>{E=null},k={providers:new Set,subscriptions:new Set},A=({ref:e,...t})=>{let n=(0,i.useRef)(null),r=(0,s.useToastQueue)(D()),{provider:o,addProvider:l,deleteProvider:u}=T(k);return(0,i.useEffect)(()=>(l(n),()=>{for(let e of D().visibleToasts)e.animation=void 0;u(n)}),[]),n===o&&r.visibleToasts.length>0?(0,c.createPortal)((0,a.jsx)(w,{ref:e,state:r,...t}),document.body):null};A.displayName=`Snackbar`;var j=({onClose:e,timeout:t=5e3,priority:n,...r})=>{D().add(r,{onClose:e,timeout:t&&!r.onAction?Math.max(t,5e3):void 0,priority:n})},M=Object.assign(A,{Item:x,ItemAction:g,ItemClose:_,ItemIcon:v});M.displayName=`Snackbar`,x.displayName=`Snackbar.Item`,g.displayName=`Snackbar.ItemAction`,_.displayName=`Snackbar.ItemClose`,v.displayName=`Snackbar.ItemIcon`,exports.Snackbar=M,exports.addSnackbar=j,exports.clearSnackbarQueue=O;
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../src/snackbar/snackbarVariants.ts","../../src/snackbar/SnackbarItem.styles.ts","../../src/snackbar/SnackbarItemContext.tsx","../../src/snackbar/SnackbarItemAction.tsx","../../src/snackbar/SnackbarItemClose.tsx","../../src/snackbar/SnackbarItemIcon.tsx","../../src/snackbar/useSwipe.ts","../../src/snackbar/SnackbarItem.tsx","../../src/snackbar/SnackbarRegion.styles.ts","../../src/snackbar/SnackbarRegion.tsx","../../src/snackbar/useSnackbarGlobalStore.ts","../../src/snackbar/Snackbar.tsx","../../src/snackbar/index.ts"],"sourcesContent":["export const filledVariants = [\n {\n design: 'filled',\n intent: 'success',\n class: ['bg-success text-on-success'],\n },\n {\n design: 'filled',\n intent: 'alert',\n class: ['bg-alert text-on-alert'],\n },\n {\n design: 'filled',\n intent: 'error',\n class: ['bg-error text-on-error'],\n },\n {\n design: 'filled',\n intent: 'info',\n class: ['bg-info text-on-info'],\n },\n {\n design: 'filled',\n intent: 'neutral',\n class: ['bg-neutral text-on-neutral'],\n },\n {\n design: 'filled',\n intent: 'main',\n class: ['bg-main text-on-main'],\n },\n {\n design: 'filled',\n intent: 'support',\n class: ['bg-support text-on-support'],\n },\n {\n design: 'filled',\n intent: 'accent',\n class: ['bg-accent text-on-accent'],\n },\n {\n design: 'filled',\n intent: 'inverse',\n class: ['bg-surface-inverse text-on-surface-inverse'],\n },\n] as const\n\nexport const tintedVariants = [\n {\n design: 'tinted',\n intent: 'success',\n class: ['bg-success-container text-on-success-container'],\n },\n {\n design: 'tinted',\n intent: 'alert',\n class: ['bg-alert-container text-on-alert-container'],\n },\n {\n design: 'tinted',\n intent: 'error',\n class: ['bg-error-container text-on-error-container'],\n },\n {\n design: 'tinted',\n intent: 'info',\n class: ['bg-info-container text-on-info-container'],\n },\n {\n design: 'tinted',\n intent: 'neutral',\n class: ['bg-neutral-container text-on-neutral-container'],\n },\n {\n design: 'tinted',\n intent: 'main',\n class: ['bg-main-container text-on-main-container'],\n },\n {\n design: 'tinted',\n intent: 'support',\n class: ['bg-support-container text-on-support-container'],\n },\n {\n design: 'tinted',\n intent: 'accent',\n class: ['bg-accent-container text-on-accent-container'],\n },\n {\n design: 'tinted',\n intent: 'inverse',\n class: ['bg-surface-inverse text-on-surface-inverse'],\n },\n] as const\n","import { cva, VariantProps } from 'class-variance-authority'\n\nimport { filledVariants, tintedVariants } from './snackbarVariants'\n\nexport const snackbarItemVariant = cva(\n [\n 'rounded-md shadow-sm',\n 'max-w-[600px]',\n 'cursor-default pointer-events-auto touch-none select-none',\n 'absolute',\n /**\n * Focus\n */\n 'group-focus-visible:outline-hidden group-focus-visible:u-outline group-not-focus-visible:ring-inset',\n /**\n * Positionning\n */\n 'group-data-[position=bottom]:bottom-0 group-data-[position=bottom-left]:bottom-0 group-data-[position=bottom-right]:bottom-0',\n 'group-data-[position=top]:top-0 group-data-[position=top-left]:top-0 group-data-[position=top-right]:top-0',\n /**\n * Animation and opacity\n */\n 'animation-duration-400',\n '[animation-fill-mode: forwards]!',\n 'data-[animation=queued]:animate-fade-in',\n 'data-[animation=entering]:animation-ease-decelerate-back',\n 'data-[animation=exiting]:animation-ease-accelerate',\n // Parent position bottom|bottom-left|bottom-right\n 'data-[animation=entering]:group-data-[position=bottom]:[&:not([data-swipe])]:animate-slide-in-bottom',\n 'data-[animation=exiting]:opacity-0 data-[animation=exiting]:transition-opacity',\n 'data-[animation=exiting]:group-data-[position=bottom]:[&:not([data-swipe])]:animate-slide-out-bottom',\n 'data-[animation=entering]:group-data-[position=bottom-left]:[&:not([data-swipe])]:animate-slide-in-bottom',\n 'data-[animation=exiting]:group-data-[position=bottom-left]:[&:not([data-swipe])]:animate-slide-out-bottom',\n 'data-[animation=entering]:group-data-[position=bottom-right]:[&:not([data-swipe])]:animate-slide-in-bottom',\n 'data-[animation=exiting]:group-data-[position=bottom-right]:[&:not([data-swipe])]:animate-slide-out-bottom',\n // Parent position top|top-left|top-right\n 'data-[animation=entering]:group-data-[position=top]:[&:not([data-swipe])]:animate-slide-in-top',\n 'data-[animation=exiting]:group-data-[position=top]:[&:not([data-swipe])]:animate-slide-out-top',\n 'data-[animation=entering]:group-data-[position=top-left]:[&:not([data-swipe])]:animate-slide-in-top',\n 'data-[animation=exiting]:group-data-[position=top-left]:[&:not([data-swipe])]:animate-slide-out-top',\n 'data-[animation=entering]:group-data-[position=top-right]:[&:not([data-swipe])]:animate-slide-in-top',\n 'data-[animation=exiting]:group-data-[position=top-right]:[&:not([data-swipe])]:animate-slide-out-top',\n /**\n * Swipe\n */\n 'data-[swipe=move]:data-[swipe-direction=right]:translate-x-(--swipe-position-x)',\n 'data-[swipe=move]:data-[swipe-direction=left]:translate-x-(--swipe-position-x)',\n 'data-[swipe=cancel]:translate-x-0',\n 'data-[swipe=end]:data-[swipe-direction=right]:animate-standalone-swipe-out-right',\n 'data-[swipe=end]:data-[swipe-direction=left]:animate-standalone-swipe-out-left',\n ],\n {\n variants: {\n /**\n * Set different look and feel\n * @default 'filled'\n */\n design: {\n filled: '',\n tinted: '',\n },\n /**\n * Set color intent\n * @default 'neutral'\n */\n intent: {\n success: '',\n alert: '',\n error: '',\n info: '',\n neutral: '',\n main: '',\n support: '',\n accent: '',\n inverse: '',\n },\n },\n compoundVariants: [...filledVariants, ...tintedVariants],\n defaultVariants: {\n design: 'filled',\n intent: 'neutral',\n },\n }\n)\n\nexport const snackbarItemVariantContent = cva(\n [\n 'inline-grid items-center',\n 'col-start-1 row-start-1',\n 'pl-md pr-lg', // applying padding on the parent prevents VoiceOver on Safari from reading snackbar content 🤷\n ],\n {\n variants: {\n /**\n * Force action button displaying on a new line\n * @default false\n */\n actionOnNewline: {\n true: [\n 'grid-rows-[52px_1fr_52px]',\n 'grid-cols-[min-content_1fr_min-content]',\n \"[grid-template-areas:'icon_message_close'_'._message_.'_'action_action_action']\",\n ],\n false: [\n 'grid-cols-[min-content_1fr_min-content_min-content]',\n \"[grid-template-areas:'icon_message_action_close']\",\n ],\n },\n },\n defaultVariants: {\n actionOnNewline: false,\n },\n }\n)\n\nexport type SnackbarItemVariantProps = VariantProps<typeof snackbarItemVariant>\nexport type SnackbarItemVariantContentProps = VariantProps<typeof snackbarItemVariantContent>\n","import { QueuedToast, ToastState } from '@react-stately/toast'\nimport { createContext, useContext } from 'react'\n\nimport type { SnackbarItemValue } from './SnackbarItem'\n\nexport interface SnackbarItemState<T = SnackbarItemValue> {\n toast: QueuedToast<T>\n state: ToastState<T>\n}\n\nexport const SnackbarItemContext = createContext<SnackbarItemState>({} as SnackbarItemState)\n\nexport const useSnackbarItemContext = () => useContext(SnackbarItemContext)\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { Button, type ButtonProps } from '../button'\nimport type { SnackbarItemVariantProps } from './SnackbarItem.styles'\nimport { useSnackbarItemContext } from './SnackbarItemContext'\n\nexport type SnackbarItemActionProps = Omit<ButtonProps, 'size' | 'shape' | 'intent'> &\n SnackbarItemVariantProps & {\n ref?: Ref<HTMLButtonElement>\n }\n\nexport const SnackbarItemAction = ({\n design: designProp = 'filled',\n intent: intentProp = 'neutral',\n onClick,\n children,\n className,\n ref,\n ...rest\n}: SnackbarItemActionProps) => {\n const { toast, state } = useSnackbarItemContext()\n\n const intent = intentProp ?? toast.content.intent\n const design = designProp ?? toast.content.design\n\n return (\n <Button\n data-spark-component=\"snackbar-item-action\"\n ref={ref}\n size=\"md\"\n shape=\"rounded\"\n {...(intent === 'inverse'\n ? {\n design: 'ghost',\n intent: 'surface',\n }\n : {\n design,\n intent: intent === 'error' ? 'danger' : intent,\n })}\n onClick={e => {\n onClick?.(e)\n state.close(toast.key)\n }}\n style={{ gridArea: 'action', ...rest.style }}\n className={cx('ml-md justify-self-end', className)}\n {...rest}\n >\n {children}\n </Button>\n )\n}\n\nSnackbarItemAction.displayName = 'Snackbar.ItemAction'\n","import { Close } from '@spark-ui/icons/Close'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithRef } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton, type IconButtonProps } from '../icon-button'\nimport type { SnackbarItemVariantProps } from './SnackbarItem.styles'\nimport { useSnackbarItemContext } from './SnackbarItemContext'\n\nexport interface SnackbarItemCloseProps\n extends\n Omit<ComponentPropsWithRef<'button'>, 'aria-label' | 'disabled'>,\n Pick<IconButtonProps, 'aria-label'>,\n SnackbarItemVariantProps {}\n\nexport const SnackbarItemClose = ({\n design: designProp = 'filled',\n intent: intentProp = 'neutral',\n 'aria-label': ariaLabel,\n onClick,\n className,\n ref,\n ...rest\n}: SnackbarItemCloseProps) => {\n const { toast, state } = useSnackbarItemContext()\n\n const intent = intentProp ?? toast.content.intent\n const design = designProp ?? toast.content.design\n\n return (\n <IconButton\n data-spark-component=\"snackbar-item-close\"\n ref={ref}\n size=\"md\"\n shape=\"rounded\"\n {...(intent === 'inverse'\n ? {\n design: 'ghost',\n intent: 'surface',\n }\n : {\n design,\n intent: intent === 'error' ? 'danger' : intent,\n })}\n aria-label={ariaLabel}\n onClick={e => {\n onClick?.(e)\n state.close(toast.key)\n }}\n style={{ gridArea: 'close', ...rest.style }}\n className={cx('ml-md justify-self-end', className)}\n {...rest}\n >\n <Icon size=\"sm\">\n <Close />\n </Icon>\n </IconButton>\n )\n}\n\nSnackbarItemClose.displayName = 'Snackbar.ItemClose'\n","import { cx } from 'class-variance-authority'\nimport type { ReactElement } from 'react'\n\nimport { Icon, type IconProps } from '../icon'\n\nexport type SnackbarItemIconProps = IconProps\n\nexport const SnackbarItemIcon = ({\n children,\n className,\n ...rest\n}: SnackbarItemIconProps): ReactElement => (\n <Icon\n size=\"md\"\n className={cx('mx-md', className)}\n style={{ gridArea: 'icon', ...rest.style }}\n {...rest}\n >\n {children}\n </Icon>\n)\n\nSnackbarItemIcon.displayName = 'Snackbar.ItemIcon'\n","/* eslint-disable complexity */\nimport { type RefObject, useEffect, useRef, useState } from 'react'\n\ninterface SwipeArgs<T> {\n swipeRef: RefObject<T | null>\n onSwipeStart?: ({ state, direction }: SwipeReturn) => void\n onSwipeMove?: ({ state, direction }: SwipeReturn) => void\n onSwipeCancel?: ({ state, direction }: SwipeReturn) => void\n onSwipeEnd?: ({ state, direction }: SwipeReturn) => void\n threshold?: number\n}\n\ninterface SwipeReturn {\n state?: 'start' | 'move' | 'cancel' | 'end'\n direction?: 'up' | 'down' | 'right' | 'left' | null\n}\n\nconst SWIPE_THRESHOLD = 75\n\nexport const useSwipe = <T extends HTMLElement>({\n swipeRef,\n onSwipeStart,\n onSwipeMove,\n onSwipeCancel,\n onSwipeEnd,\n threshold = 10,\n}: SwipeArgs<T>): SwipeReturn => {\n const [state, setState] = useState<SwipeReturn['state']>()\n\n const direction = useRef<SwipeReturn['direction']>(null)\n const origin = useRef<Record<'x' | 'y', number> | null>(null)\n const delta = useRef<Record<'x' | 'y', number> | null>(null)\n\n const handleSwipeStart = (evt: PointerEvent) => {\n origin.current = { x: evt.clientX, y: evt.clientY }\n\n /**\n * Prevents unwanted text selection in Safari browser (longpress)\n */\n document.addEventListener('selectstart', e => e.preventDefault())\n }\n\n const handleSwipeMove = (evt: PointerEvent) => {\n if (!origin.current) return\n\n const deltaX = Math.abs(evt.clientX - origin.current.x)\n const deltaY = Math.abs(evt.clientY - origin.current.y)\n\n let moveState: SwipeReturn['state']\n\n if (deltaX > deltaY && deltaX > threshold) {\n direction.current = evt.clientX > origin.current.x ? 'right' : 'left'\n } else if (deltaY > threshold) {\n direction.current = evt.clientY > origin.current.y ? 'down' : 'up'\n }\n\n /**\n * If no direction could be defined, then no move should be handled.\n * This is particularly true with trackpads working with MacOS/Windows.\n */\n if (!direction.current) return\n\n if (!delta.current) {\n moveState = 'start'\n delta.current = { x: deltaX, y: deltaY }\n onSwipeStart?.({ state: moveState, direction: direction.current })\n } else {\n moveState = 'move'\n delta.current = { x: deltaX, y: deltaY }\n ;(swipeRef.current as T).style.setProperty(\n '--swipe-position-x',\n `${deltaX > deltaY ? evt.clientX - origin.current.x : 0}px`\n )\n ;(swipeRef.current as T).style.setProperty(\n '--swipe-position-y',\n `${!(deltaX > deltaY) ? evt.clientY - origin.current.y : 0}px`\n )\n onSwipeMove?.({ state: moveState, direction: direction.current })\n }\n\n setState(moveState)\n }\n\n const handleSwipeEnd = () => {\n const proxyDelta = delta.current\n\n origin.current = null\n delta.current = null\n\n if (proxyDelta) {\n const { x: deltaX, y: deltaY } = proxyDelta\n\n let endState: SwipeReturn['state']\n\n if (deltaX > deltaY) {\n if (deltaX > SWIPE_THRESHOLD) {\n endState = 'end'\n onSwipeEnd?.({ state: endState, direction: direction.current })\n } else {\n endState = 'cancel'\n onSwipeCancel?.({ state: endState, direction: direction.current })\n }\n } else {\n if (deltaY > SWIPE_THRESHOLD) {\n endState = 'end'\n onSwipeEnd?.({ state: endState, direction: direction.current })\n } else {\n endState = 'cancel'\n onSwipeCancel?.({ state: endState, direction: direction.current })\n }\n }\n\n setState(endState)\n\n /**\n * Prevents unwanted text selection in Safari browser (longpress)\n */\n document.removeEventListener('selectstart', e => e.preventDefault())\n }\n }\n\n useEffect(() => {\n if (!swipeRef.current) return\n\n const swipeElement = swipeRef.current\n\n swipeElement.addEventListener('pointerdown', handleSwipeStart)\n document.addEventListener('pointermove', handleSwipeMove)\n document.addEventListener('pointerup', handleSwipeEnd)\n\n return () => {\n swipeElement.removeEventListener('pointerdown', handleSwipeStart)\n document.removeEventListener('pointermove', handleSwipeMove)\n document.removeEventListener('pointerup', handleSwipeEnd)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n return {\n state,\n direction: direction.current,\n }\n}\n","/* eslint-disable max-lines-per-function */\n\nimport { useToast } from '@react-aria/toast'\nimport {\n Children,\n cloneElement,\n type ComponentPropsWithRef,\n type FC,\n isValidElement,\n type PropsWithChildren,\n type ReactElement,\n type ReactNode,\n useCallback,\n useRef,\n} from 'react'\n\nimport {\n snackbarItemVariant,\n snackbarItemVariantContent,\n type SnackbarItemVariantContentProps,\n type SnackbarItemVariantProps,\n} from './SnackbarItem.styles'\nimport { SnackbarItemAction, SnackbarItemActionProps } from './SnackbarItemAction'\nimport { SnackbarItemClose, SnackbarItemCloseProps } from './SnackbarItemClose'\nimport { useSnackbarItemContext } from './SnackbarItemContext'\nimport { SnackbarItemIcon, SnackbarItemIconProps } from './SnackbarItemIcon'\nimport { useSwipe } from './useSwipe'\n\nexport interface SnackbarItemValue extends SnackbarItemVariantProps {\n /**\n * Icon that will be prepended before snackbar message\n */\n icon?: ReactNode\n message: ReactNode\n /**\n * If `true` snackbar will display a close button\n * @default false\n */\n isClosable?: boolean\n /**\n * A label for the action button within the toast.\n */\n actionLabel?: string\n /**\n * Handler that is called when the action button is pressed.\n */\n onAction?: () => void\n /**\n * If `true` the action button will be displayed on a new line.\n * @default false\n */\n actionOnNewline?: boolean\n}\n\nexport interface SnackbarItemProps\n extends ComponentPropsWithRef<'div'>, SnackbarItemVariantProps, SnackbarItemVariantContentProps {\n /**\n * Defines a string value that labels the current element.\n */\n 'aria-label'?: string\n /**\n * Identifies the element (or elements) that labels the current element.\n */\n 'aria-labelledby'?: string\n /**\n * Identifies the element (or elements) that describes the object.\n */\n 'aria-describedby'?: string\n /**\n * Identifies the element (or elements) that provide a detailed, extended description for the object.\n */\n 'aria-details'?: string\n}\n\nexport const SnackbarItem = ({\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n 'aria-describedby': ariaDescribedby,\n 'aria-details': ariaDetails,\n design: designProp,\n intent: intentProp,\n actionOnNewline: actionOnNewlineProp,\n className,\n children,\n ref: forwardedRef,\n ...rest\n}: PropsWithChildren<SnackbarItemProps>) => {\n const innerRef = useRef(null)\n const ref = typeof forwardedRef !== 'function' ? forwardedRef || innerRef : innerRef\n\n const { toast, state } = useSnackbarItemContext()\n\n const { state: swipeState, direction: swipeDirection } = useSwipe({\n swipeRef: ref,\n onSwipeStart: state.pauseAll,\n onSwipeCancel: state.resumeAll,\n onSwipeEnd: ({ direction }) => {\n ;['left', 'right'].includes(`${direction}`) && state.close(toast.key)\n },\n })\n\n const { message, icon, isClosable, onAction, actionLabel } = toast.content\n const intent = intentProp ?? toast.content.intent\n const design = designProp ?? toast.content.design\n const actionOnNewline = actionOnNewlineProp ?? toast.content.actionOnNewline\n\n const ariaProps = {\n ariaLabel,\n ariaLabelledby,\n ariaDescribedby,\n ariaDetails,\n }\n\n const { toastProps, titleProps, closeButtonProps, contentProps } = useToast(\n { toast, ...ariaProps },\n state,\n ref\n )\n\n const findElement = useCallback(\n <P extends object>(elementDisplayName: string): ReactElement<P> | undefined => {\n const childrenArray = Children.toArray(children)\n\n const match = childrenArray\n .filter(isValidElement)\n .find(\n (child): child is ReactElement<P> =>\n !!(child.type as FC<P> & { displayName?: string }).displayName?.includes(\n elementDisplayName\n )\n )\n\n return match as ReactElement<P> | undefined\n },\n [children]\n )\n\n const iconFromChildren = findElement<SnackbarItemIconProps>('Snackbar.ItemIcon')\n const actionBtnFromChildren = findElement<SnackbarItemActionProps>('Snackbar.ItemAction')\n const closeBtnFromChildren = findElement<SnackbarItemCloseProps>('Snackbar.ItemClose')\n\n return (\n <div\n data-spark-component=\"snackbar-item\"\n className={snackbarItemVariant({ design, intent, className })}\n data-animation={toast.animation}\n {...(!(swipeState === 'cancel' && toast.animation === 'exiting') && {\n 'data-swipe': swipeState,\n 'data-swipe-direction': swipeDirection,\n })}\n {...(toast.animation === 'exiting' && {\n // Remove snackbar when the exiting animation completes\n onAnimationEnd: () => state.remove(toast.key),\n })}\n ref={ref}\n {...toastProps}\n {...rest}\n >\n <div className={snackbarItemVariantContent({ actionOnNewline })} {...contentProps}>\n {/* 1. ICON */}\n {renderSubComponent(iconFromChildren, icon ? SnackbarItemIcon : null, {\n children: icon,\n })}\n\n {/* 2. MESSAGE */}\n <p\n className=\"px-md py-lg text-body-2 row-span-3\"\n style={{ gridArea: 'message' }}\n {...titleProps}\n >\n {message}\n </p>\n\n {/* 3. ACTION BUTTON */}\n {renderSubComponent(\n actionBtnFromChildren,\n actionLabel && onAction ? SnackbarItemAction : null,\n { intent, design, onClick: onAction, children: actionLabel }\n )}\n\n {/* 4. CLOSE BUTTON */}\n {renderSubComponent(closeBtnFromChildren, isClosable ? SnackbarItemClose : null, {\n intent,\n design,\n /**\n * React Spectrum typing of aria-label is inaccurate, and aria-label value should never be undefined.\n * See https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/i18n/src/useLocalizedStringFormatter.ts#L40\n */\n 'aria-label': closeButtonProps['aria-label'] as string,\n })}\n </div>\n </div>\n )\n}\n\nSnackbarItem.displayName = 'Snackbar.Item'\n\n/**\n * Returns compound item if found in children prop.\n * If not fallbacks to default item, conditionned by addSnackbar options.\n */\nconst renderSubComponent = <P extends object>(\n childItem?: ReactElement<P>,\n defaultItem?: FC<P> | null,\n props?: P\n) => {\n if (childItem) {\n return cloneElement(childItem, { ...props, ...childItem.props })\n } else if (defaultItem) {\n const Item = defaultItem\n\n return <Item {...(props as P)} />\n } else {\n return null\n }\n}\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const snackbarRegionVariant = cva(\n [\n 'fixed inset-x-lg z-toast group',\n 'outline-hidden pointer-events-none',\n 'grid grid-rows-1 grid-cols-1 gap-lg',\n ],\n {\n variants: {\n /**\n * Set snackbar item position\n * @default 'bottom'\n */\n position: {\n top: 'top-lg justify-items-center',\n 'top-right': 'top-lg justify-items-end',\n 'top-left': 'top-lg justify-items-start',\n bottom: 'bottom-lg justify-items-center',\n 'bottom-right': 'bottom-lg justify-items-end',\n 'bottom-left': 'bottom-lg justify-items-start',\n },\n },\n defaultVariants: {\n position: 'bottom',\n },\n }\n)\n\nexport type SnackbarRegionVariantProps = VariantProps<typeof snackbarRegionVariant>\n","import { type AriaToastRegionProps, useToastRegion } from '@react-aria/toast'\nimport { cloneElement, type ComponentPropsWithRef, type ReactElement, useRef } from 'react'\n\nimport { SnackbarItem, type SnackbarItemProps } from './SnackbarItem'\nimport { SnackbarItemContext, type SnackbarItemState } from './SnackbarItemContext'\nimport { snackbarRegionVariant, type SnackbarRegionVariantProps } from './SnackbarRegion.styles'\n\nexport interface SnackbarRegionProps\n extends\n ComponentPropsWithRef<'div'>,\n AriaToastRegionProps,\n SnackbarRegionVariantProps,\n Pick<SnackbarItemState, 'state'> {\n /**\n * An accessibility label for the snackbar region.\n * @default 'Notifications'\n */\n 'aria-label'?: string\n /**\n * Identifies the element (or elements) that labels the current element.\n */\n 'aria-labelledby'?: string\n /**\n * Identifies the element (or elements) that describes the object.\n */\n 'aria-describedby'?: string\n /**\n * Identifies the element (or elements) that provide a detailed, extended description for the object.\n */\n 'aria-details'?: string\n /**\n * The component/template used to display each snackbar from the queue\n * @default 'Snackbar.Item'\n */\n children?: ReactElement<SnackbarItemProps, typeof SnackbarItem>\n}\n\nexport const SnackbarRegion = ({\n children = <SnackbarItem />,\n state,\n position = 'bottom',\n className,\n ref: forwardedRef,\n ...rest\n}: SnackbarRegionProps): ReactElement => {\n const innerRef = useRef<HTMLDivElement>(null)\n const ref = forwardedRef && typeof forwardedRef !== 'function' ? forwardedRef : innerRef\n\n const { regionProps } = useToastRegion(rest, state, ref)\n\n return (\n <div\n {...regionProps}\n ref={ref}\n data-position={position}\n className={snackbarRegionVariant({ position, className })}\n >\n {state.visibleToasts.map(toast => (\n <SnackbarItemContext.Provider key={toast.key} value={{ toast, state }}>\n {cloneElement(children, { key: toast.key })}\n </SnackbarItemContext.Provider>\n ))}\n </div>\n )\n}\n","import { type RefObject, useCallback, useSyncExternalStore } from 'react'\n\ninterface UseSnackbarGlobalStoreArgs<T> {\n providers: Set<T>\n subscriptions: Set<() => void>\n}\n\ninterface UseSnackbarGlobalStoreReturn<T> {\n provider: T\n addProvider: (ref: T) => void\n deleteProvider: (ref: T) => void\n}\n\n/**\n * This hook is a basic abstraction of useSyncExternalStore hook which allows us\n * to consume data from an external data store.\n *\n * Cf. https://react.dev/reference/react/useSyncExternalStore#subscribing-to-an-external-store\n */\n\nexport const useSnackbarGlobalStore = <T = RefObject<HTMLDivElement | null>>({\n providers,\n subscriptions,\n}: UseSnackbarGlobalStoreArgs<T>): UseSnackbarGlobalStoreReturn<T> => {\n const subscribe = useCallback(\n (listener: () => void) => {\n subscriptions.add(listener)\n\n return () => subscriptions.delete(listener)\n },\n [subscriptions]\n )\n\n const getLastSnackbarProvider = useCallback(() => [...providers].reverse()[0] as T, [providers])\n\n const addProvider = useCallback(\n (provider: T) => {\n providers.add(provider)\n\n for (const subscribeFn of subscriptions) {\n subscribeFn()\n }\n },\n [providers, subscriptions]\n )\n\n const deleteProvider = useCallback(\n (provider: T) => {\n providers.delete(provider)\n\n for (const subscribeFn of subscriptions) {\n subscribeFn()\n }\n },\n [providers, subscriptions]\n )\n\n const provider = useSyncExternalStore(subscribe, getLastSnackbarProvider, getLastSnackbarProvider)\n\n return {\n provider,\n addProvider,\n deleteProvider,\n }\n}\n","import {\n type ToastOptions as SnackBarItemOptions,\n ToastQueue,\n useToastQueue,\n} from '@react-stately/toast'\nimport { type ReactElement, Ref, type RefObject, useEffect, useRef } from 'react'\nimport { createPortal } from 'react-dom'\n\nimport { type SnackbarItemValue } from './SnackbarItem'\nimport { SnackbarRegion, type SnackbarRegionProps } from './SnackbarRegion'\nimport { useSnackbarGlobalStore } from './useSnackbarGlobalStore'\n\n/**\n * We define here a global queue thanks to dedicated util from React Spectrum.\n * It is based on React `useSyncExternalStore` and allows us to consume data from\n * an external data store, and thus preventing use of React context that could\n * lead to unwanted rerenderings. It also simplifies initial implementation.\n */\nlet GLOBAL_SNACKBAR_QUEUE: ToastQueue<SnackbarItemValue> | null = null\n\nconst getGlobalSnackBarQueue = () => {\n if (!GLOBAL_SNACKBAR_QUEUE) {\n GLOBAL_SNACKBAR_QUEUE = new ToastQueue({\n maxVisibleToasts: 1,\n hasExitAnimation: true,\n })\n }\n\n return GLOBAL_SNACKBAR_QUEUE\n}\n\nexport const clearSnackbarQueue = () => {\n GLOBAL_SNACKBAR_QUEUE = null\n}\n\n/**\n * We define a global store to keep track of all providers instances, to ensure\n * we always have a single Snackbar container.\n */\nconst GLOBAL_SNACKBAR_STORE = {\n providers: new Set<RefObject<HTMLDivElement | null>>(),\n subscriptions: new Set<() => void>(),\n}\n\nexport type SnackbarProps = Omit<SnackbarRegionProps, 'state'> & {\n ref?: Ref<HTMLDivElement>\n}\n\nexport const Snackbar = ({ ref: forwardedRef, ...props }: SnackbarProps): ReactElement | null => {\n const ref = useRef<HTMLDivElement>(null)\n\n const state = useToastQueue(getGlobalSnackBarQueue())\n\n const { provider, addProvider, deleteProvider } = useSnackbarGlobalStore(GLOBAL_SNACKBAR_STORE)\n\n useEffect(() => {\n addProvider(ref)\n\n return () => {\n for (const toast of getGlobalSnackBarQueue().visibleToasts) {\n toast.animation = undefined\n }\n\n deleteProvider(ref)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n return ref === provider && state.visibleToasts.length > 0\n ? createPortal(<SnackbarRegion ref={forwardedRef} state={state} {...props} />, document.body)\n : null\n}\n\nSnackbar.displayName = 'Snackbar'\n\nexport interface AddSnackbarArgs extends SnackbarItemValue, Omit<SnackBarItemOptions, 'timeout'> {\n /**\n * Handler that is called when the snackbar is closed, either by the user\n * or after a timeout.\n */\n onClose?: () => void\n /**\n * A timeout to automatically close the snackbar after, in milliseconds.\n * @default 5000\n */\n timeout?: number | null\n /**\n * The priority of the snackbar relative to other snackbars. Larger numbers indicate higher priority.\n */\n priority?: number\n}\n\nexport const addSnackbar = ({ onClose, timeout = 5000, priority, ...content }: AddSnackbarArgs) => {\n const queue = getGlobalSnackBarQueue()\n\n queue.add(content, {\n onClose,\n timeout: timeout && !content.onAction ? Math.max(timeout, 5000) : undefined,\n priority,\n })\n}\n","import {\n addSnackbar,\n type AddSnackbarArgs,\n clearSnackbarQueue,\n Snackbar as Root,\n type SnackbarProps,\n} from './Snackbar'\nimport { SnackbarItem as Item, type SnackbarItemProps } from './SnackbarItem'\nimport {\n SnackbarItemAction as ItemAction,\n type SnackbarItemActionProps,\n} from './SnackbarItemAction'\nimport { SnackbarItemClose as ItemClose, type SnackbarItemCloseProps } from './SnackbarItemClose'\nimport { SnackbarItemIcon as ItemIcon, type SnackbarItemIconProps } from './SnackbarItemIcon'\n\nexport const Snackbar: typeof Root & {\n Item: typeof Item\n ItemAction: typeof ItemAction\n ItemClose: typeof ItemClose\n ItemIcon: typeof ItemIcon\n} = Object.assign(Root, {\n Item,\n ItemAction,\n ItemClose,\n ItemIcon,\n})\n\nSnackbar.displayName = 'Snackbar'\nItem.displayName = 'Snackbar.Item'\nItemAction.displayName = 'Snackbar.ItemAction'\nItemClose.displayName = 'Snackbar.ItemClose'\nItemIcon.displayName = 'Snackbar.ItemIcon'\n\nexport type {\n SnackbarProps,\n SnackbarItemProps,\n SnackbarItemActionProps,\n SnackbarItemCloseProps,\n SnackbarItemIconProps,\n AddSnackbarArgs,\n}\nexport { addSnackbar, clearSnackbarQueue }\n"],"mappings":"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"}