@twilio-paste/toast - npm Package Compare versions

Comparing version 10.0.1 to 11.0.0

dist/index.debug.es.js

@@ -71,8 +71,6 @@ var __defProp = Object.defineProperty;
 var ToastPortalPropTypes = {
-  children: PropTypes.node.isRequired,
-  __console_patch: PropTypes.bool
+  children: PropTypes.node.isRequired
 };
 var ToastContainerPropTypes = {
-  children: PropTypes.node.isRequired,
-  __console_patch: PropTypes.bool
+  children: PropTypes.node.isRequired
 };
@@ -88,4 +86,3 @@ var ToasterPropTypes = {
   ).isRequired,
-  pop: PropTypes.func.isRequired,
-  __console_patch: PropTypes.bool
+  pop: PropTypes.func.isRequired
 };
@@ -101,2 +98,3 @@
       color: "colorTextError",
+      width: ["100%", "size40", "size40"],
       backgroundColor: "colorBackgroundErrorWeakest",
@@ -110,4 +108,3 @@ borderColor: "colorBorderErrorWeak",
       padding: "space60",
-      variant,
-      width: "size40"
+      variant
     }),
@@ -130,2 +127,3 @@ props.children
       color: "colorTextNeutral",
+      width: ["100%", "size40", "size40"],
       backgroundColor: "colorBackgroundNeutralWeakest",
@@ -139,4 +137,3 @@ borderColor: "colorBorderNeutralWeak",
       padding: "space60",
-      variant,
-      width: "size40"
+      variant
     }),
@@ -159,2 +156,3 @@ props.children
       color: "colorTextSuccess",
+      width: ["100%", "size40", "size40"],
       backgroundColor: "colorBackgroundSuccessWeakest",
@@ -168,4 +166,3 @@ borderColor: "colorBorderSuccessWeak",
       padding: "space60",
-      variant,
-      width: "size40"
+      variant
     }),
@@ -188,2 +185,3 @@ props.children
       color: "colorTextWarningStrong",
+      width: ["100%", "size40", "size40"],
       backgroundColor: "colorBackgroundWarningWeakest",
@@ -197,4 +195,3 @@ borderColor: "colorBorderWarningWeak",
       padding: "space60",
-      variant,
-      width: "size40"
+      variant
     }),
@@ -328,3 +325,3 @@ props.children
 var ToastPortal = React6.forwardRef((_a, ref) => {
-  var _b = _a, { children, __console_patch } = _b, props = __objRest(_b, ["children", "__console_patch"]);
+  var _b = _a, { children, left } = _b, props = __objRest(_b, ["children", "left"]);
   return /* @__PURE__ */ React6.createElement(Portal, null, /* @__PURE__ */ React6.createElement(StyledBase, null, /* @__PURE__ */ React6.createElement(
@@ -336,5 +333,5 @@ Box5,
       top: "space90",
+      left,
       zIndex: "zIndex90",
-      ref,
-      style: __console_patch ? { zIndex: 1999 } : void 0
+      ref
     }),
@@ -434,5 +431,3 @@ children
 Toaster.displayName = "Toaster";
-if (false) {
-  Toaster.propTypes = ToasterPropTypes;
-}
+Toaster.propTypes = ToasterPropTypes;
 
@@ -439,0 +434,0 @@ // src/useToaster.ts

dist/index.debug.js

@@ -104,8 +104,6 @@ "use strict";
 var ToastPortalPropTypes = {
-  children: import_prop_types.default.node.isRequired,
-  __console_patch: import_prop_types.default.bool
+  children: import_prop_types.default.node.isRequired
 };
 var ToastContainerPropTypes = {
-  children: import_prop_types.default.node.isRequired,
-  __console_patch: import_prop_types.default.bool
+  children: import_prop_types.default.node.isRequired
 };
@@ -121,4 +119,3 @@ var ToasterPropTypes = {
   ).isRequired,
-  pop: import_prop_types.default.func.isRequired,
-  __console_patch: import_prop_types.default.bool
+  pop: import_prop_types.default.func.isRequired
 };
@@ -134,2 +131,3 @@
       color: "colorTextError",
+      width: ["100%", "size40", "size40"],
       backgroundColor: "colorBackgroundErrorWeakest",
@@ -143,4 +141,3 @@ borderColor: "colorBorderErrorWeak",
       padding: "space60",
-      variant,
-      width: "size40"
+      variant
     }),
@@ -163,2 +160,3 @@ props.children
       color: "colorTextNeutral",
+      width: ["100%", "size40", "size40"],
       backgroundColor: "colorBackgroundNeutralWeakest",
@@ -172,4 +170,3 @@ borderColor: "colorBorderNeutralWeak",
       padding: "space60",
-      variant,
-      width: "size40"
+      variant
     }),
@@ -192,2 +189,3 @@ props.children
       color: "colorTextSuccess",
+      width: ["100%", "size40", "size40"],
       backgroundColor: "colorBackgroundSuccessWeakest",
@@ -201,4 +199,3 @@ borderColor: "colorBorderSuccessWeak",
       padding: "space60",
-      variant,
-      width: "size40"
+      variant
     }),
@@ -221,2 +218,3 @@ props.children
       color: "colorTextWarningStrong",
+      width: ["100%", "size40", "size40"],
       backgroundColor: "colorBackgroundWarningWeakest",
@@ -230,4 +228,3 @@ borderColor: "colorBorderWarningWeak",
       padding: "space60",
-      variant,
-      width: "size40"
+      variant
     }),
@@ -361,3 +358,3 @@ props.children
 var ToastPortal = React6.forwardRef((_a, ref) => {
-  var _b = _a, { children, __console_patch } = _b, props = __objRest(_b, ["children", "__console_patch"]);
+  var _b = _a, { children, left } = _b, props = __objRest(_b, ["children", "left"]);
   return /* @__PURE__ */ React6.createElement(import_reakit_library.Portal, null, /* @__PURE__ */ React6.createElement(import_theme.StyledBase, null, /* @__PURE__ */ React6.createElement(
@@ -369,5 +366,5 @@ import_box5.Box,
       top: "space90",
+      left,
       zIndex: "zIndex90",
-      ref,
-      style: __console_patch ? { zIndex: 1999 } : void 0
+      ref
     }),
@@ -467,5 +464,3 @@ children
 Toaster.displayName = "Toaster";
-if (false) {
-  Toaster.propTypes = ToasterPropTypes;
-}
+Toaster.propTypes = ToasterPropTypes;
 
@@ -472,0 +467,0 @@ // src/useToaster.ts

dist/index.es.js

@@ -1,1 +0,1 @@
-var __defProp=Object.defineProperty,__defProps=Object.defineProperties;var __getOwnPropDescs=Object.getOwnPropertyDescriptors;var __getOwnPropSymbols=Object.getOwnPropertySymbols;var __hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable;var __defNormalProp=(obj,key,value)=>key in obj?__defProp(obj,key,{enumerable:!0,configurable:!0,writable:!0,value}):obj[key]=value,__spreadValues=(a,b)=>{for(var prop in b||(b={}))__hasOwnProp.call(b,prop)&&__defNormalProp(a,prop,b[prop]);if(__getOwnPropSymbols)for(var prop of __getOwnPropSymbols(b))__propIsEnum.call(b,prop)&&__defNormalProp(a,prop,b[prop]);return a},__spreadProps=(a,b)=>__defProps(a,__getOwnPropDescs(b));var __objRest=(source,exclude)=>{var target={};for(var prop in source)__hasOwnProp.call(source,prop)&&exclude.indexOf(prop)<0&&(target[prop]=source[prop]);if(source!=null&&__getOwnPropSymbols)for(var prop of __getOwnPropSymbols(source))exclude.indexOf(prop)<0&&__propIsEnum.call(source,prop)&&(target[prop]=source[prop]);return target};import*as React5 from"react";import{Button}from"@twilio-paste/button";import{CloseIcon}from"@twilio-paste/icons/esm/CloseIcon";import{ErrorIcon}from"@twilio-paste/icons/esm/ErrorIcon";import{NeutralIcon}from"@twilio-paste/icons/esm/NeutralIcon";import{SuccessIcon}from"@twilio-paste/icons/esm/SuccessIcon";import{WarningIcon}from"@twilio-paste/icons/esm/WarningIcon";import{MediaObject,MediaFigure,MediaBody}from"@twilio-paste/media-object";import{ScreenReaderOnly}from"@twilio-paste/screen-reader-only";import*as React from"react";import{Box,safelySpreadBoxProps}from"@twilio-paste/box";import PropTypes from"prop-types";var ToastVariantObject={ERROR:"error",NEUTRAL:"neutral",SUCCESS:"success",WARNING:"warning"};var ToastPropTypes={children:PropTypes.node.isRequired,onDismiss:PropTypes.func,variant:PropTypes.oneOf(["error","neutral","success","warning"]),i18nDismissLabel:PropTypes.string,i18nErrorLabel:PropTypes.string,i18nNeutralLabel:PropTypes.string,i18nSuccessLabel:PropTypes.string,i18nWarningLabel:PropTypes.string},ToastPortalPropTypes={children:PropTypes.node.isRequired,__console_patch:PropTypes.bool},ToastContainerPropTypes={children:PropTypes.node.isRequired,__console_patch:PropTypes.bool},ToasterPropTypes={toasts:PropTypes.arrayOf(PropTypes.shape({id:PropTypes.string.isRequired,message:PropTypes.node.isRequired,setFocus:PropTypes.bool,variant:PropTypes.oneOf(Object.values(ToastVariantObject)).isRequired})).isRequired,pop:PropTypes.func.isRequired,__console_patch:PropTypes.bool};var ErrorToast=React.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React.createElement(Box,__spreadProps(__spreadValues({},safelySpreadBoxProps(props)),{ref,color:"colorTextError",backgroundColor:"colorBackgroundErrorWeakest",borderColor:"colorBorderErrorWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant,width:"size40"}),props.children)});ErrorToast.displayName="ErrorToast";ErrorToast.propTypes=ToastPropTypes;import*as React2 from"react";import{Box as Box2,safelySpreadBoxProps as safelySpreadBoxProps2}from"@twilio-paste/box";var NeutralToast=React2.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React2.createElement(Box2,__spreadProps(__spreadValues({},safelySpreadBoxProps2(props)),{ref,color:"colorTextNeutral",backgroundColor:"colorBackgroundNeutralWeakest",borderColor:"colorBorderNeutralWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant,width:"size40"}),props.children)});NeutralToast.displayName="NeutralToast";NeutralToast.propTypes=ToastPropTypes;import*as React3 from"react";import{Box as Box3,safelySpreadBoxProps as safelySpreadBoxProps3}from"@twilio-paste/box";var SuccessToast=React3.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React3.createElement(Box3,__spreadProps(__spreadValues({},safelySpreadBoxProps3(props)),{ref,color:"colorTextSuccess",backgroundColor:"colorBackgroundSuccessWeakest",borderColor:"colorBorderSuccessWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant,width:"size40"}),props.children)});SuccessToast.displayName="SuccessToast";SuccessToast.propTypes=ToastPropTypes;import*as React4 from"react";import{Box as Box4,safelySpreadBoxProps as safelySpreadBoxProps4}from"@twilio-paste/box";var WarningToast=React4.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React4.createElement(Box4,__spreadProps(__spreadValues({},safelySpreadBoxProps4(props)),{ref,color:"colorTextWarningStrong",backgroundColor:"colorBackgroundWarningWeakest",borderColor:"colorBorderWarningWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant,width:"size40"}),props.children)});WarningToast.displayName="WarningToast";WarningToast.propTypes=ToastPropTypes;var ToastComponentVariants={error:ErrorToast,neutral:NeutralToast,success:SuccessToast,warning:WarningToast},renderToastIcon=(variant,title,element)=>{switch(variant){case ToastVariantObject.ERROR:return React5.createElement(ErrorIcon,{color:"colorTextIconError",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"});case ToastVariantObject.SUCCESS:return React5.createElement(SuccessIcon,{color:"colorTextIconSuccess",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"});case ToastVariantObject.WARNING:return React5.createElement(WarningIcon,{color:"colorTextIconWarning",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"});case ToastVariantObject.NEUTRAL:default:return React5.createElement(NeutralIcon,{color:"colorTextIconNeutral",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"})}},Toast=React5.forwardRef((_a,ref)=>{var _b=_a,{children,onDismiss,variant="neutral",element="TOAST",setFocus,i18nDismissLabel="Dismiss toast",i18nErrorLabel="(error)",i18nNeutralLabel="(information)",i18nSuccessLabel="(success)",i18nWarningLabel="(warning)"}=_b,props=__objRest(_b,["children","onDismiss","variant","element","setFocus","i18nDismissLabel","i18nErrorLabel","i18nNeutralLabel","i18nSuccessLabel","i18nWarningLabel"]);let ToastComponent=ToastComponentVariants[variant],buttonRef=React5.useRef(null);React5.useEffect(()=>{setFocus&&buttonRef.current&&buttonRef.current.focus({preventScroll:!0})},[setFocus]);let i18nVariants={error:i18nErrorLabel,neutral:i18nNeutralLabel,success:i18nSuccessLabel,warning:i18nWarningLabel};return React5.createElement(ToastComponent,__spreadValues({role:"status",variant,element,ref},props),React5.createElement(MediaObject,{as:"div"},React5.createElement(MediaFigure,{as:"div",spacing:"space60"},renderToastIcon(variant,i18nVariants[variant],element)),React5.createElement(MediaBody,{as:"div"},children),onDismiss&&typeof onDismiss=="function"&&React5.createElement(MediaFigure,{align:"end",spacing:"space40"},React5.createElement(Button,{onClick:onDismiss,variant:"secondary_icon",ref:buttonRef,size:"reset",element:`${element}_CLOSE_BUTTON`},React5.createElement(CloseIcon,{decorative:!0,size:"sizeIcon20",element:`${element}_CLOSE_ICON`}),React5.createElement(ScreenReaderOnly,null,i18nDismissLabel)))))});Toast.displayName="Toast";Toast.propTypes=ToastPropTypes;import*as React7 from"react";import{Stack}from"@twilio-paste/stack";import*as React6 from"react";import{StyledBase}from"@twilio-paste/theme";import{Portal}from"@twilio-paste/reakit-library";import{Box as Box5,safelySpreadBoxProps as safelySpreadBoxProps5}from"@twilio-paste/box";var ToastPortal=React6.forwardRef((_a,ref)=>{var _b=_a,{children,__console_patch}=_b,props=__objRest(_b,["children","__console_patch"]);return React6.createElement(Portal,null,React6.createElement(StyledBase,null,React6.createElement(Box5,__spreadProps(__spreadValues({},safelySpreadBoxProps5(props)),{position:"fixed",right:"space40",top:"space90",zIndex:"zIndex90",ref,style:__console_patch?{zIndex:1999}:void 0}),children)))});ToastPortal.displayName="ToastPortal";var ToastContainer=React7.forwardRef((_a,ref)=>{var _b=_a,{children}=_b,props=__objRest(_b,["children"]);return React7.createElement(ToastPortal,__spreadValues({},props),React7.createElement(Stack,{orientation:"vertical",spacing:"space40",ref},children))});ToastContainer.displayName="ToastContainer";ToastContainer.propTypes=ToastContainerPropTypes;import*as React8 from"react";import{useTransition,animated,useReducedMotion}from"@twilio-paste/animation-library";import{useTheme}from"@twilio-paste/theme";import{Box as Box6}from"@twilio-paste/box";var AnimatedToast=animated(Box6),Toaster=_a=>{var _b=_a,{toasts,pop}=_b,props=__objRest(_b,["toasts","pop"]);let prefersReducedMotion=useReducedMotion(),[refMap]=React8.useState(()=>new WeakMap),[returnTarget,setReturnTarget]=React8.useState({trigger:null}),theme=useTheme(),transitions=useTransition(toasts,{from:{marginBottom:"0rem",opacity:0,transform:"translateX(100%) scale(1)",height:prefersReducedMotion?"auto":0},enter:prefersReducedMotion?{marginBottom:theme.space.space40,opacity:1,transform:"translateX(0px) scale(1)"}:item=>async next=>{await next({marginBottom:theme.space.space40,opacity:1,transform:"translateX(0px) scale(1)",height:refMap.get(item).offsetHeight})},leave:{marginBottom:"0rem",opacity:0,transform:"translateX(0px) scale(0.8)",height:prefersReducedMotion?"auto":0},config:{mass:1,tension:150,friction:20}}),clearReturnTarget=React8.useCallback(()=>{setReturnTarget({trigger:null})},[returnTarget]);return React8.useEffect(()=>{returnTarget.trigger!=null&&toasts.length===0&&(returnTarget.trigger.focus(),clearReturnTarget())},[toasts]),React8.createElement(ToastPortal,__spreadValues({},props),transitions((styles,item,state,index)=>React8.createElement(AnimatedToast,{as:"div",key:state.key,style:styles},React8.createElement(Toast,__spreadProps(__spreadValues({key:item.id},item),{onDismiss:()=>{item.onDismiss!=null&&item.onDismiss(),pop(item.id)},ref:ref=>{ref!=null&&refMap.set(item,ref)},setFocus:index===0,onFocus:e=>{e.relatedTarget&&!returnTarget.trigger&&setReturnTarget({trigger:e.relatedTarget})}}),item.message))))};Toaster.displayName="Toaster";import*as React9 from"react";import{uid}from"@twilio-paste/uid-library";var useToaster=()=>{let isMounted=React9.useRef(null),[toasts,setToasts]=React9.useState([]);React9.useEffect(()=>(isMounted.current=!0,()=>{isMounted.current=!1,toasts.forEach(toast=>{toast.timeOutId&&window.clearTimeout(toast.timeOutId)})}),[]);let pop=id=>{!isMounted.current||setToasts(currentToasts=>currentToasts.filter(toast=>(toast.id===id&&(toast.timeOutId&&window.clearTimeout(toast.timeOutId),toast.onDismiss&&toast.onDismiss()),toast.id!==id)))};return{toasts,push:newToast=>{if(!isMounted.current)return;let generatedID=uid(newToast),timeOutId;newToast.dismissAfter!=null&&Number.isInteger(newToast.dismissAfter)&&(timeOutId=window.setTimeout(pop,newToast.dismissAfter,newToast.id||generatedID));let existingToasts=toasts.map(toast=>{let tmpToast=toast;return tmpToast.setFocus=!1,tmpToast});setToasts([__spreadValues({id:generatedID,timeOutId,setFocus:!0},newToast),...existingToasts])},pop}};export{AnimatedToast,Toast,ToastContainer,Toaster,useToaster};
+var __defProp=Object.defineProperty,__defProps=Object.defineProperties;var __getOwnPropDescs=Object.getOwnPropertyDescriptors;var __getOwnPropSymbols=Object.getOwnPropertySymbols;var __hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable;var __defNormalProp=(obj,key,value)=>key in obj?__defProp(obj,key,{enumerable:!0,configurable:!0,writable:!0,value}):obj[key]=value,__spreadValues=(a,b)=>{for(var prop in b||(b={}))__hasOwnProp.call(b,prop)&&__defNormalProp(a,prop,b[prop]);if(__getOwnPropSymbols)for(var prop of __getOwnPropSymbols(b))__propIsEnum.call(b,prop)&&__defNormalProp(a,prop,b[prop]);return a},__spreadProps=(a,b)=>__defProps(a,__getOwnPropDescs(b));var __objRest=(source,exclude)=>{var target={};for(var prop in source)__hasOwnProp.call(source,prop)&&exclude.indexOf(prop)<0&&(target[prop]=source[prop]);if(source!=null&&__getOwnPropSymbols)for(var prop of __getOwnPropSymbols(source))exclude.indexOf(prop)<0&&__propIsEnum.call(source,prop)&&(target[prop]=source[prop]);return target};import*as React5 from"react";import{Button}from"@twilio-paste/button";import{CloseIcon}from"@twilio-paste/icons/esm/CloseIcon";import{ErrorIcon}from"@twilio-paste/icons/esm/ErrorIcon";import{NeutralIcon}from"@twilio-paste/icons/esm/NeutralIcon";import{SuccessIcon}from"@twilio-paste/icons/esm/SuccessIcon";import{WarningIcon}from"@twilio-paste/icons/esm/WarningIcon";import{MediaObject,MediaFigure,MediaBody}from"@twilio-paste/media-object";import{ScreenReaderOnly}from"@twilio-paste/screen-reader-only";import*as React from"react";import{Box,safelySpreadBoxProps}from"@twilio-paste/box";import PropTypes from"prop-types";var ToastVariantObject={ERROR:"error",NEUTRAL:"neutral",SUCCESS:"success",WARNING:"warning"};var ToastPropTypes={children:PropTypes.node.isRequired,onDismiss:PropTypes.func,variant:PropTypes.oneOf(["error","neutral","success","warning"]),i18nDismissLabel:PropTypes.string,i18nErrorLabel:PropTypes.string,i18nNeutralLabel:PropTypes.string,i18nSuccessLabel:PropTypes.string,i18nWarningLabel:PropTypes.string},ToastPortalPropTypes={children:PropTypes.node.isRequired},ToastContainerPropTypes={children:PropTypes.node.isRequired},ToasterPropTypes={toasts:PropTypes.arrayOf(PropTypes.shape({id:PropTypes.string.isRequired,message:PropTypes.node.isRequired,setFocus:PropTypes.bool,variant:PropTypes.oneOf(Object.values(ToastVariantObject)).isRequired})).isRequired,pop:PropTypes.func.isRequired};var ErrorToast=React.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React.createElement(Box,__spreadProps(__spreadValues({},safelySpreadBoxProps(props)),{ref,color:"colorTextError",width:["100%","size40","size40"],backgroundColor:"colorBackgroundErrorWeakest",borderColor:"colorBorderErrorWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant}),props.children)});ErrorToast.displayName="ErrorToast";ErrorToast.propTypes=ToastPropTypes;import*as React2 from"react";import{Box as Box2,safelySpreadBoxProps as safelySpreadBoxProps2}from"@twilio-paste/box";var NeutralToast=React2.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React2.createElement(Box2,__spreadProps(__spreadValues({},safelySpreadBoxProps2(props)),{ref,color:"colorTextNeutral",width:["100%","size40","size40"],backgroundColor:"colorBackgroundNeutralWeakest",borderColor:"colorBorderNeutralWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant}),props.children)});NeutralToast.displayName="NeutralToast";NeutralToast.propTypes=ToastPropTypes;import*as React3 from"react";import{Box as Box3,safelySpreadBoxProps as safelySpreadBoxProps3}from"@twilio-paste/box";var SuccessToast=React3.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React3.createElement(Box3,__spreadProps(__spreadValues({},safelySpreadBoxProps3(props)),{ref,color:"colorTextSuccess",width:["100%","size40","size40"],backgroundColor:"colorBackgroundSuccessWeakest",borderColor:"colorBorderSuccessWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant}),props.children)});SuccessToast.displayName="SuccessToast";SuccessToast.propTypes=ToastPropTypes;import*as React4 from"react";import{Box as Box4,safelySpreadBoxProps as safelySpreadBoxProps4}from"@twilio-paste/box";var WarningToast=React4.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React4.createElement(Box4,__spreadProps(__spreadValues({},safelySpreadBoxProps4(props)),{ref,color:"colorTextWarningStrong",width:["100%","size40","size40"],backgroundColor:"colorBackgroundWarningWeakest",borderColor:"colorBorderWarningWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant}),props.children)});WarningToast.displayName="WarningToast";WarningToast.propTypes=ToastPropTypes;var ToastComponentVariants={error:ErrorToast,neutral:NeutralToast,success:SuccessToast,warning:WarningToast},renderToastIcon=(variant,title,element)=>{switch(variant){case ToastVariantObject.ERROR:return React5.createElement(ErrorIcon,{color:"colorTextIconError",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"});case ToastVariantObject.SUCCESS:return React5.createElement(SuccessIcon,{color:"colorTextIconSuccess",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"});case ToastVariantObject.WARNING:return React5.createElement(WarningIcon,{color:"colorTextIconWarning",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"});case ToastVariantObject.NEUTRAL:default:return React5.createElement(NeutralIcon,{color:"colorTextIconNeutral",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"})}},Toast=React5.forwardRef((_a,ref)=>{var _b=_a,{children,onDismiss,variant="neutral",element="TOAST",setFocus,i18nDismissLabel="Dismiss toast",i18nErrorLabel="(error)",i18nNeutralLabel="(information)",i18nSuccessLabel="(success)",i18nWarningLabel="(warning)"}=_b,props=__objRest(_b,["children","onDismiss","variant","element","setFocus","i18nDismissLabel","i18nErrorLabel","i18nNeutralLabel","i18nSuccessLabel","i18nWarningLabel"]);let ToastComponent=ToastComponentVariants[variant],buttonRef=React5.useRef(null);React5.useEffect(()=>{setFocus&&buttonRef.current&&buttonRef.current.focus({preventScroll:!0})},[setFocus]);let i18nVariants={error:i18nErrorLabel,neutral:i18nNeutralLabel,success:i18nSuccessLabel,warning:i18nWarningLabel};return React5.createElement(ToastComponent,__spreadValues({role:"status",variant,element,ref},props),React5.createElement(MediaObject,{as:"div"},React5.createElement(MediaFigure,{as:"div",spacing:"space60"},renderToastIcon(variant,i18nVariants[variant],element)),React5.createElement(MediaBody,{as:"div"},children),onDismiss&&typeof onDismiss=="function"&&React5.createElement(MediaFigure,{align:"end",spacing:"space40"},React5.createElement(Button,{onClick:onDismiss,variant:"secondary_icon",ref:buttonRef,size:"reset",element:`${element}_CLOSE_BUTTON`},React5.createElement(CloseIcon,{decorative:!0,size:"sizeIcon20",element:`${element}_CLOSE_ICON`}),React5.createElement(ScreenReaderOnly,null,i18nDismissLabel)))))});Toast.displayName="Toast";Toast.propTypes=ToastPropTypes;import*as React7 from"react";import{Stack}from"@twilio-paste/stack";import*as React6 from"react";import{StyledBase}from"@twilio-paste/theme";import{Portal}from"@twilio-paste/reakit-library";import{Box as Box5,safelySpreadBoxProps as safelySpreadBoxProps5}from"@twilio-paste/box";var ToastPortal=React6.forwardRef((_a,ref)=>{var _b=_a,{children,left}=_b,props=__objRest(_b,["children","left"]);return React6.createElement(Portal,null,React6.createElement(StyledBase,null,React6.createElement(Box5,__spreadProps(__spreadValues({},safelySpreadBoxProps5(props)),{position:"fixed",right:"space40",top:"space90",left,zIndex:"zIndex90",ref}),children)))});ToastPortal.displayName="ToastPortal";var ToastContainer=React7.forwardRef((_a,ref)=>{var _b=_a,{children}=_b,props=__objRest(_b,["children"]);return React7.createElement(ToastPortal,__spreadValues({},props),React7.createElement(Stack,{orientation:"vertical",spacing:"space40",ref},children))});ToastContainer.displayName="ToastContainer";ToastContainer.propTypes=ToastContainerPropTypes;import*as React8 from"react";import{useTransition,animated,useReducedMotion}from"@twilio-paste/animation-library";import{useTheme}from"@twilio-paste/theme";import{Box as Box6}from"@twilio-paste/box";var AnimatedToast=animated(Box6),Toaster=_a=>{var _b=_a,{toasts,pop}=_b,props=__objRest(_b,["toasts","pop"]);let prefersReducedMotion=useReducedMotion(),[refMap]=React8.useState(()=>new WeakMap),[returnTarget,setReturnTarget]=React8.useState({trigger:null}),theme=useTheme(),transitions=useTransition(toasts,{from:{marginBottom:"0rem",opacity:0,transform:"translateX(100%) scale(1)",height:prefersReducedMotion?"auto":0},enter:prefersReducedMotion?{marginBottom:theme.space.space40,opacity:1,transform:"translateX(0px) scale(1)"}:item=>async next=>{await next({marginBottom:theme.space.space40,opacity:1,transform:"translateX(0px) scale(1)",height:refMap.get(item).offsetHeight})},leave:{marginBottom:"0rem",opacity:0,transform:"translateX(0px) scale(0.8)",height:prefersReducedMotion?"auto":0},config:{mass:1,tension:150,friction:20}}),clearReturnTarget=React8.useCallback(()=>{setReturnTarget({trigger:null})},[returnTarget]);return React8.useEffect(()=>{returnTarget.trigger!=null&&toasts.length===0&&(returnTarget.trigger.focus(),clearReturnTarget())},[toasts]),React8.createElement(ToastPortal,__spreadValues({},props),transitions((styles,item,state,index)=>React8.createElement(AnimatedToast,{as:"div",key:state.key,style:styles},React8.createElement(Toast,__spreadProps(__spreadValues({key:item.id},item),{onDismiss:()=>{item.onDismiss!=null&&item.onDismiss(),pop(item.id)},ref:ref=>{ref!=null&&refMap.set(item,ref)},setFocus:index===0,onFocus:e=>{e.relatedTarget&&!returnTarget.trigger&&setReturnTarget({trigger:e.relatedTarget})}}),item.message))))};Toaster.displayName="Toaster";Toaster.propTypes=ToasterPropTypes;import*as React9 from"react";import{uid}from"@twilio-paste/uid-library";var useToaster=()=>{let isMounted=React9.useRef(null),[toasts,setToasts]=React9.useState([]);React9.useEffect(()=>(isMounted.current=!0,()=>{isMounted.current=!1,toasts.forEach(toast=>{toast.timeOutId&&window.clearTimeout(toast.timeOutId)})}),[]);let pop=id=>{!isMounted.current||setToasts(currentToasts=>currentToasts.filter(toast=>(toast.id===id&&(toast.timeOutId&&window.clearTimeout(toast.timeOutId),toast.onDismiss&&toast.onDismiss()),toast.id!==id)))};return{toasts,push:newToast=>{if(!isMounted.current)return;let generatedID=uid(newToast),timeOutId;newToast.dismissAfter!=null&&Number.isInteger(newToast.dismissAfter)&&(timeOutId=window.setTimeout(pop,newToast.dismissAfter,newToast.id||generatedID));let existingToasts=toasts.map(toast=>{let tmpToast=toast;return tmpToast.setFocus=!1,tmpToast});setToasts([__spreadValues({id:generatedID,timeOutId,setFocus:!0},newToast),...existingToasts])},pop}};export{AnimatedToast,Toast,ToastContainer,Toaster,useToaster};

dist/index.js

@@ -1,1 +0,1 @@
-"use strict";var __create=Object.create;var __defProp=Object.defineProperty,__defProps=Object.defineProperties,__getOwnPropDesc=Object.getOwnPropertyDescriptor,__getOwnPropDescs=Object.getOwnPropertyDescriptors,__getOwnPropNames=Object.getOwnPropertyNames,__getOwnPropSymbols=Object.getOwnPropertySymbols,__getProtoOf=Object.getPrototypeOf,__hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable;var __defNormalProp=(obj,key,value)=>key in obj?__defProp(obj,key,{enumerable:!0,configurable:!0,writable:!0,value}):obj[key]=value,__spreadValues=(a,b)=>{for(var prop in b||(b={}))__hasOwnProp.call(b,prop)&&__defNormalProp(a,prop,b[prop]);if(__getOwnPropSymbols)for(var prop of __getOwnPropSymbols(b))__propIsEnum.call(b,prop)&&__defNormalProp(a,prop,b[prop]);return a},__spreadProps=(a,b)=>__defProps(a,__getOwnPropDescs(b));var __objRest=(source,exclude)=>{var target={};for(var prop in source)__hasOwnProp.call(source,prop)&&exclude.indexOf(prop)<0&&(target[prop]=source[prop]);if(source!=null&&__getOwnPropSymbols)for(var prop of __getOwnPropSymbols(source))exclude.indexOf(prop)<0&&__propIsEnum.call(source,prop)&&(target[prop]=source[prop]);return target};var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toESM=(mod,isNodeMode,target)=>(target=mod!=null?__create(__getProtoOf(mod)):{},__copyProps(isNodeMode||!mod||!mod.__esModule?__defProp(target,"default",{value:mod,enumerable:!0}):target,mod)),__toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var src_exports={};__export(src_exports,{AnimatedToast:()=>AnimatedToast,Toast:()=>Toast,ToastContainer:()=>ToastContainer,Toaster:()=>Toaster,useToaster:()=>useToaster});module.exports=__toCommonJS(src_exports);var React5=__toESM(require("react")),import_button=require("@twilio-paste/button"),import_CloseIcon=require("@twilio-paste/icons/cjs/CloseIcon"),import_ErrorIcon=require("@twilio-paste/icons/cjs/ErrorIcon"),import_NeutralIcon=require("@twilio-paste/icons/cjs/NeutralIcon"),import_SuccessIcon=require("@twilio-paste/icons/cjs/SuccessIcon"),import_WarningIcon=require("@twilio-paste/icons/cjs/WarningIcon"),import_media_object=require("@twilio-paste/media-object"),import_screen_reader_only=require("@twilio-paste/screen-reader-only");var React=__toESM(require("react")),import_box=require("@twilio-paste/box");var import_prop_types=__toESM(require("prop-types"));var ToastVariantObject={ERROR:"error",NEUTRAL:"neutral",SUCCESS:"success",WARNING:"warning"};var ToastPropTypes={children:import_prop_types.default.node.isRequired,onDismiss:import_prop_types.default.func,variant:import_prop_types.default.oneOf(["error","neutral","success","warning"]),i18nDismissLabel:import_prop_types.default.string,i18nErrorLabel:import_prop_types.default.string,i18nNeutralLabel:import_prop_types.default.string,i18nSuccessLabel:import_prop_types.default.string,i18nWarningLabel:import_prop_types.default.string},ToastPortalPropTypes={children:import_prop_types.default.node.isRequired,__console_patch:import_prop_types.default.bool},ToastContainerPropTypes={children:import_prop_types.default.node.isRequired,__console_patch:import_prop_types.default.bool},ToasterPropTypes={toasts:import_prop_types.default.arrayOf(import_prop_types.default.shape({id:import_prop_types.default.string.isRequired,message:import_prop_types.default.node.isRequired,setFocus:import_prop_types.default.bool,variant:import_prop_types.default.oneOf(Object.values(ToastVariantObject)).isRequired})).isRequired,pop:import_prop_types.default.func.isRequired,__console_patch:import_prop_types.default.bool};var ErrorToast=React.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React.createElement(import_box.Box,__spreadProps(__spreadValues({},(0,import_box.safelySpreadBoxProps)(props)),{ref,color:"colorTextError",backgroundColor:"colorBackgroundErrorWeakest",borderColor:"colorBorderErrorWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant,width:"size40"}),props.children)});ErrorToast.displayName="ErrorToast";ErrorToast.propTypes=ToastPropTypes;var React2=__toESM(require("react")),import_box2=require("@twilio-paste/box");var NeutralToast=React2.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React2.createElement(import_box2.Box,__spreadProps(__spreadValues({},(0,import_box2.safelySpreadBoxProps)(props)),{ref,color:"colorTextNeutral",backgroundColor:"colorBackgroundNeutralWeakest",borderColor:"colorBorderNeutralWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant,width:"size40"}),props.children)});NeutralToast.displayName="NeutralToast";NeutralToast.propTypes=ToastPropTypes;var React3=__toESM(require("react")),import_box3=require("@twilio-paste/box");var SuccessToast=React3.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React3.createElement(import_box3.Box,__spreadProps(__spreadValues({},(0,import_box3.safelySpreadBoxProps)(props)),{ref,color:"colorTextSuccess",backgroundColor:"colorBackgroundSuccessWeakest",borderColor:"colorBorderSuccessWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant,width:"size40"}),props.children)});SuccessToast.displayName="SuccessToast";SuccessToast.propTypes=ToastPropTypes;var React4=__toESM(require("react")),import_box4=require("@twilio-paste/box");var WarningToast=React4.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React4.createElement(import_box4.Box,__spreadProps(__spreadValues({},(0,import_box4.safelySpreadBoxProps)(props)),{ref,color:"colorTextWarningStrong",backgroundColor:"colorBackgroundWarningWeakest",borderColor:"colorBorderWarningWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant,width:"size40"}),props.children)});WarningToast.displayName="WarningToast";WarningToast.propTypes=ToastPropTypes;var ToastComponentVariants={error:ErrorToast,neutral:NeutralToast,success:SuccessToast,warning:WarningToast},renderToastIcon=(variant,title,element)=>{switch(variant){case ToastVariantObject.ERROR:return React5.createElement(import_ErrorIcon.ErrorIcon,{color:"colorTextIconError",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"});case ToastVariantObject.SUCCESS:return React5.createElement(import_SuccessIcon.SuccessIcon,{color:"colorTextIconSuccess",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"});case ToastVariantObject.WARNING:return React5.createElement(import_WarningIcon.WarningIcon,{color:"colorTextIconWarning",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"});case ToastVariantObject.NEUTRAL:default:return React5.createElement(import_NeutralIcon.NeutralIcon,{color:"colorTextIconNeutral",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"})}},Toast=React5.forwardRef((_a,ref)=>{var _b=_a,{children,onDismiss,variant="neutral",element="TOAST",setFocus,i18nDismissLabel="Dismiss toast",i18nErrorLabel="(error)",i18nNeutralLabel="(information)",i18nSuccessLabel="(success)",i18nWarningLabel="(warning)"}=_b,props=__objRest(_b,["children","onDismiss","variant","element","setFocus","i18nDismissLabel","i18nErrorLabel","i18nNeutralLabel","i18nSuccessLabel","i18nWarningLabel"]);let ToastComponent=ToastComponentVariants[variant],buttonRef=React5.useRef(null);React5.useEffect(()=>{setFocus&&buttonRef.current&&buttonRef.current.focus({preventScroll:!0})},[setFocus]);let i18nVariants={error:i18nErrorLabel,neutral:i18nNeutralLabel,success:i18nSuccessLabel,warning:i18nWarningLabel};return React5.createElement(ToastComponent,__spreadValues({role:"status",variant,element,ref},props),React5.createElement(import_media_object.MediaObject,{as:"div"},React5.createElement(import_media_object.MediaFigure,{as:"div",spacing:"space60"},renderToastIcon(variant,i18nVariants[variant],element)),React5.createElement(import_media_object.MediaBody,{as:"div"},children),onDismiss&&typeof onDismiss=="function"&&React5.createElement(import_media_object.MediaFigure,{align:"end",spacing:"space40"},React5.createElement(import_button.Button,{onClick:onDismiss,variant:"secondary_icon",ref:buttonRef,size:"reset",element:`${element}_CLOSE_BUTTON`},React5.createElement(import_CloseIcon.CloseIcon,{decorative:!0,size:"sizeIcon20",element:`${element}_CLOSE_ICON`}),React5.createElement(import_screen_reader_only.ScreenReaderOnly,null,i18nDismissLabel)))))});Toast.displayName="Toast";Toast.propTypes=ToastPropTypes;var React7=__toESM(require("react")),import_stack=require("@twilio-paste/stack");var React6=__toESM(require("react")),import_theme=require("@twilio-paste/theme"),import_reakit_library=require("@twilio-paste/reakit-library"),import_box5=require("@twilio-paste/box");var ToastPortal=React6.forwardRef((_a,ref)=>{var _b=_a,{children,__console_patch}=_b,props=__objRest(_b,["children","__console_patch"]);return React6.createElement(import_reakit_library.Portal,null,React6.createElement(import_theme.StyledBase,null,React6.createElement(import_box5.Box,__spreadProps(__spreadValues({},(0,import_box5.safelySpreadBoxProps)(props)),{position:"fixed",right:"space40",top:"space90",zIndex:"zIndex90",ref,style:__console_patch?{zIndex:1999}:void 0}),children)))});ToastPortal.displayName="ToastPortal";var ToastContainer=React7.forwardRef((_a,ref)=>{var _b=_a,{children}=_b,props=__objRest(_b,["children"]);return React7.createElement(ToastPortal,__spreadValues({},props),React7.createElement(import_stack.Stack,{orientation:"vertical",spacing:"space40",ref},children))});ToastContainer.displayName="ToastContainer";ToastContainer.propTypes=ToastContainerPropTypes;var React8=__toESM(require("react")),import_animation_library=require("@twilio-paste/animation-library"),import_theme2=require("@twilio-paste/theme"),import_box6=require("@twilio-paste/box");var AnimatedToast=(0,import_animation_library.animated)(import_box6.Box),Toaster=_a=>{var _b=_a,{toasts,pop}=_b,props=__objRest(_b,["toasts","pop"]);let prefersReducedMotion=(0,import_animation_library.useReducedMotion)(),[refMap]=React8.useState(()=>new WeakMap),[returnTarget,setReturnTarget]=React8.useState({trigger:null}),theme=(0,import_theme2.useTheme)(),transitions=(0,import_animation_library.useTransition)(toasts,{from:{marginBottom:"0rem",opacity:0,transform:"translateX(100%) scale(1)",height:prefersReducedMotion?"auto":0},enter:prefersReducedMotion?{marginBottom:theme.space.space40,opacity:1,transform:"translateX(0px) scale(1)"}:item=>async next=>{await next({marginBottom:theme.space.space40,opacity:1,transform:"translateX(0px) scale(1)",height:refMap.get(item).offsetHeight})},leave:{marginBottom:"0rem",opacity:0,transform:"translateX(0px) scale(0.8)",height:prefersReducedMotion?"auto":0},config:{mass:1,tension:150,friction:20}}),clearReturnTarget=React8.useCallback(()=>{setReturnTarget({trigger:null})},[returnTarget]);return React8.useEffect(()=>{returnTarget.trigger!=null&&toasts.length===0&&(returnTarget.trigger.focus(),clearReturnTarget())},[toasts]),React8.createElement(ToastPortal,__spreadValues({},props),transitions((styles,item,state,index)=>React8.createElement(AnimatedToast,{as:"div",key:state.key,style:styles},React8.createElement(Toast,__spreadProps(__spreadValues({key:item.id},item),{onDismiss:()=>{item.onDismiss!=null&&item.onDismiss(),pop(item.id)},ref:ref=>{ref!=null&&refMap.set(item,ref)},setFocus:index===0,onFocus:e=>{e.relatedTarget&&!returnTarget.trigger&&setReturnTarget({trigger:e.relatedTarget})}}),item.message))))};Toaster.displayName="Toaster";var React9=__toESM(require("react")),import_uid_library=require("@twilio-paste/uid-library");var useToaster=()=>{let isMounted=React9.useRef(null),[toasts,setToasts]=React9.useState([]);React9.useEffect(()=>(isMounted.current=!0,()=>{isMounted.current=!1,toasts.forEach(toast=>{toast.timeOutId&&window.clearTimeout(toast.timeOutId)})}),[]);let pop=id=>{!isMounted.current||setToasts(currentToasts=>currentToasts.filter(toast=>(toast.id===id&&(toast.timeOutId&&window.clearTimeout(toast.timeOutId),toast.onDismiss&&toast.onDismiss()),toast.id!==id)))};return{toasts,push:newToast=>{if(!isMounted.current)return;let generatedID=(0,import_uid_library.uid)(newToast),timeOutId;newToast.dismissAfter!=null&&Number.isInteger(newToast.dismissAfter)&&(timeOutId=window.setTimeout(pop,newToast.dismissAfter,newToast.id||generatedID));let existingToasts=toasts.map(toast=>{let tmpToast=toast;return tmpToast.setFocus=!1,tmpToast});setToasts([__spreadValues({id:generatedID,timeOutId,setFocus:!0},newToast),...existingToasts])},pop}};0&&(module.exports={AnimatedToast,Toast,ToastContainer,Toaster,useToaster});
+"use strict";var __create=Object.create;var __defProp=Object.defineProperty,__defProps=Object.defineProperties,__getOwnPropDesc=Object.getOwnPropertyDescriptor,__getOwnPropDescs=Object.getOwnPropertyDescriptors,__getOwnPropNames=Object.getOwnPropertyNames,__getOwnPropSymbols=Object.getOwnPropertySymbols,__getProtoOf=Object.getPrototypeOf,__hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable;var __defNormalProp=(obj,key,value)=>key in obj?__defProp(obj,key,{enumerable:!0,configurable:!0,writable:!0,value}):obj[key]=value,__spreadValues=(a,b)=>{for(var prop in b||(b={}))__hasOwnProp.call(b,prop)&&__defNormalProp(a,prop,b[prop]);if(__getOwnPropSymbols)for(var prop of __getOwnPropSymbols(b))__propIsEnum.call(b,prop)&&__defNormalProp(a,prop,b[prop]);return a},__spreadProps=(a,b)=>__defProps(a,__getOwnPropDescs(b));var __objRest=(source,exclude)=>{var target={};for(var prop in source)__hasOwnProp.call(source,prop)&&exclude.indexOf(prop)<0&&(target[prop]=source[prop]);if(source!=null&&__getOwnPropSymbols)for(var prop of __getOwnPropSymbols(source))exclude.indexOf(prop)<0&&__propIsEnum.call(source,prop)&&(target[prop]=source[prop]);return target};var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toESM=(mod,isNodeMode,target)=>(target=mod!=null?__create(__getProtoOf(mod)):{},__copyProps(isNodeMode||!mod||!mod.__esModule?__defProp(target,"default",{value:mod,enumerable:!0}):target,mod)),__toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var src_exports={};__export(src_exports,{AnimatedToast:()=>AnimatedToast,Toast:()=>Toast,ToastContainer:()=>ToastContainer,Toaster:()=>Toaster,useToaster:()=>useToaster});module.exports=__toCommonJS(src_exports);var React5=__toESM(require("react")),import_button=require("@twilio-paste/button"),import_CloseIcon=require("@twilio-paste/icons/cjs/CloseIcon"),import_ErrorIcon=require("@twilio-paste/icons/cjs/ErrorIcon"),import_NeutralIcon=require("@twilio-paste/icons/cjs/NeutralIcon"),import_SuccessIcon=require("@twilio-paste/icons/cjs/SuccessIcon"),import_WarningIcon=require("@twilio-paste/icons/cjs/WarningIcon"),import_media_object=require("@twilio-paste/media-object"),import_screen_reader_only=require("@twilio-paste/screen-reader-only");var React=__toESM(require("react")),import_box=require("@twilio-paste/box");var import_prop_types=__toESM(require("prop-types"));var ToastVariantObject={ERROR:"error",NEUTRAL:"neutral",SUCCESS:"success",WARNING:"warning"};var ToastPropTypes={children:import_prop_types.default.node.isRequired,onDismiss:import_prop_types.default.func,variant:import_prop_types.default.oneOf(["error","neutral","success","warning"]),i18nDismissLabel:import_prop_types.default.string,i18nErrorLabel:import_prop_types.default.string,i18nNeutralLabel:import_prop_types.default.string,i18nSuccessLabel:import_prop_types.default.string,i18nWarningLabel:import_prop_types.default.string},ToastPortalPropTypes={children:import_prop_types.default.node.isRequired},ToastContainerPropTypes={children:import_prop_types.default.node.isRequired},ToasterPropTypes={toasts:import_prop_types.default.arrayOf(import_prop_types.default.shape({id:import_prop_types.default.string.isRequired,message:import_prop_types.default.node.isRequired,setFocus:import_prop_types.default.bool,variant:import_prop_types.default.oneOf(Object.values(ToastVariantObject)).isRequired})).isRequired,pop:import_prop_types.default.func.isRequired};var ErrorToast=React.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React.createElement(import_box.Box,__spreadProps(__spreadValues({},(0,import_box.safelySpreadBoxProps)(props)),{ref,color:"colorTextError",width:["100%","size40","size40"],backgroundColor:"colorBackgroundErrorWeakest",borderColor:"colorBorderErrorWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant}),props.children)});ErrorToast.displayName="ErrorToast";ErrorToast.propTypes=ToastPropTypes;var React2=__toESM(require("react")),import_box2=require("@twilio-paste/box");var NeutralToast=React2.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React2.createElement(import_box2.Box,__spreadProps(__spreadValues({},(0,import_box2.safelySpreadBoxProps)(props)),{ref,color:"colorTextNeutral",width:["100%","size40","size40"],backgroundColor:"colorBackgroundNeutralWeakest",borderColor:"colorBorderNeutralWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant}),props.children)});NeutralToast.displayName="NeutralToast";NeutralToast.propTypes=ToastPropTypes;var React3=__toESM(require("react")),import_box3=require("@twilio-paste/box");var SuccessToast=React3.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React3.createElement(import_box3.Box,__spreadProps(__spreadValues({},(0,import_box3.safelySpreadBoxProps)(props)),{ref,color:"colorTextSuccess",width:["100%","size40","size40"],backgroundColor:"colorBackgroundSuccessWeakest",borderColor:"colorBorderSuccessWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant}),props.children)});SuccessToast.displayName="SuccessToast";SuccessToast.propTypes=ToastPropTypes;var React4=__toESM(require("react")),import_box4=require("@twilio-paste/box");var WarningToast=React4.forwardRef((_a,ref)=>{var _b=_a,{element="TOAST",variant}=_b,props=__objRest(_b,["element","variant"]);return React4.createElement(import_box4.Box,__spreadProps(__spreadValues({},(0,import_box4.safelySpreadBoxProps)(props)),{ref,color:"colorTextWarningStrong",width:["100%","size40","size40"],backgroundColor:"colorBackgroundWarningWeakest",borderColor:"colorBorderWarningWeak",borderRadius:"borderRadius30",borderStyle:"solid",borderWidth:"borderWidth10",boxShadow:"shadowHigh",element,padding:"space60",variant}),props.children)});WarningToast.displayName="WarningToast";WarningToast.propTypes=ToastPropTypes;var ToastComponentVariants={error:ErrorToast,neutral:NeutralToast,success:SuccessToast,warning:WarningToast},renderToastIcon=(variant,title,element)=>{switch(variant){case ToastVariantObject.ERROR:return React5.createElement(import_ErrorIcon.ErrorIcon,{color:"colorTextIconError",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"});case ToastVariantObject.SUCCESS:return React5.createElement(import_SuccessIcon.SuccessIcon,{color:"colorTextIconSuccess",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"});case ToastVariantObject.WARNING:return React5.createElement(import_WarningIcon.WarningIcon,{color:"colorTextIconWarning",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"});case ToastVariantObject.NEUTRAL:default:return React5.createElement(import_NeutralIcon.NeutralIcon,{color:"colorTextIconNeutral",decorative:!1,title,element:`${element}_ICON`,size:"sizeIcon20"})}},Toast=React5.forwardRef((_a,ref)=>{var _b=_a,{children,onDismiss,variant="neutral",element="TOAST",setFocus,i18nDismissLabel="Dismiss toast",i18nErrorLabel="(error)",i18nNeutralLabel="(information)",i18nSuccessLabel="(success)",i18nWarningLabel="(warning)"}=_b,props=__objRest(_b,["children","onDismiss","variant","element","setFocus","i18nDismissLabel","i18nErrorLabel","i18nNeutralLabel","i18nSuccessLabel","i18nWarningLabel"]);let ToastComponent=ToastComponentVariants[variant],buttonRef=React5.useRef(null);React5.useEffect(()=>{setFocus&&buttonRef.current&&buttonRef.current.focus({preventScroll:!0})},[setFocus]);let i18nVariants={error:i18nErrorLabel,neutral:i18nNeutralLabel,success:i18nSuccessLabel,warning:i18nWarningLabel};return React5.createElement(ToastComponent,__spreadValues({role:"status",variant,element,ref},props),React5.createElement(import_media_object.MediaObject,{as:"div"},React5.createElement(import_media_object.MediaFigure,{as:"div",spacing:"space60"},renderToastIcon(variant,i18nVariants[variant],element)),React5.createElement(import_media_object.MediaBody,{as:"div"},children),onDismiss&&typeof onDismiss=="function"&&React5.createElement(import_media_object.MediaFigure,{align:"end",spacing:"space40"},React5.createElement(import_button.Button,{onClick:onDismiss,variant:"secondary_icon",ref:buttonRef,size:"reset",element:`${element}_CLOSE_BUTTON`},React5.createElement(import_CloseIcon.CloseIcon,{decorative:!0,size:"sizeIcon20",element:`${element}_CLOSE_ICON`}),React5.createElement(import_screen_reader_only.ScreenReaderOnly,null,i18nDismissLabel)))))});Toast.displayName="Toast";Toast.propTypes=ToastPropTypes;var React7=__toESM(require("react")),import_stack=require("@twilio-paste/stack");var React6=__toESM(require("react")),import_theme=require("@twilio-paste/theme"),import_reakit_library=require("@twilio-paste/reakit-library"),import_box5=require("@twilio-paste/box");var ToastPortal=React6.forwardRef((_a,ref)=>{var _b=_a,{children,left}=_b,props=__objRest(_b,["children","left"]);return React6.createElement(import_reakit_library.Portal,null,React6.createElement(import_theme.StyledBase,null,React6.createElement(import_box5.Box,__spreadProps(__spreadValues({},(0,import_box5.safelySpreadBoxProps)(props)),{position:"fixed",right:"space40",top:"space90",left,zIndex:"zIndex90",ref}),children)))});ToastPortal.displayName="ToastPortal";var ToastContainer=React7.forwardRef((_a,ref)=>{var _b=_a,{children}=_b,props=__objRest(_b,["children"]);return React7.createElement(ToastPortal,__spreadValues({},props),React7.createElement(import_stack.Stack,{orientation:"vertical",spacing:"space40",ref},children))});ToastContainer.displayName="ToastContainer";ToastContainer.propTypes=ToastContainerPropTypes;var React8=__toESM(require("react")),import_animation_library=require("@twilio-paste/animation-library"),import_theme2=require("@twilio-paste/theme"),import_box6=require("@twilio-paste/box");var AnimatedToast=(0,import_animation_library.animated)(import_box6.Box),Toaster=_a=>{var _b=_a,{toasts,pop}=_b,props=__objRest(_b,["toasts","pop"]);let prefersReducedMotion=(0,import_animation_library.useReducedMotion)(),[refMap]=React8.useState(()=>new WeakMap),[returnTarget,setReturnTarget]=React8.useState({trigger:null}),theme=(0,import_theme2.useTheme)(),transitions=(0,import_animation_library.useTransition)(toasts,{from:{marginBottom:"0rem",opacity:0,transform:"translateX(100%) scale(1)",height:prefersReducedMotion?"auto":0},enter:prefersReducedMotion?{marginBottom:theme.space.space40,opacity:1,transform:"translateX(0px) scale(1)"}:item=>async next=>{await next({marginBottom:theme.space.space40,opacity:1,transform:"translateX(0px) scale(1)",height:refMap.get(item).offsetHeight})},leave:{marginBottom:"0rem",opacity:0,transform:"translateX(0px) scale(0.8)",height:prefersReducedMotion?"auto":0},config:{mass:1,tension:150,friction:20}}),clearReturnTarget=React8.useCallback(()=>{setReturnTarget({trigger:null})},[returnTarget]);return React8.useEffect(()=>{returnTarget.trigger!=null&&toasts.length===0&&(returnTarget.trigger.focus(),clearReturnTarget())},[toasts]),React8.createElement(ToastPortal,__spreadValues({},props),transitions((styles,item,state,index)=>React8.createElement(AnimatedToast,{as:"div",key:state.key,style:styles},React8.createElement(Toast,__spreadProps(__spreadValues({key:item.id},item),{onDismiss:()=>{item.onDismiss!=null&&item.onDismiss(),pop(item.id)},ref:ref=>{ref!=null&&refMap.set(item,ref)},setFocus:index===0,onFocus:e=>{e.relatedTarget&&!returnTarget.trigger&&setReturnTarget({trigger:e.relatedTarget})}}),item.message))))};Toaster.displayName="Toaster";Toaster.propTypes=ToasterPropTypes;var React9=__toESM(require("react")),import_uid_library=require("@twilio-paste/uid-library");var useToaster=()=>{let isMounted=React9.useRef(null),[toasts,setToasts]=React9.useState([]);React9.useEffect(()=>(isMounted.current=!0,()=>{isMounted.current=!1,toasts.forEach(toast=>{toast.timeOutId&&window.clearTimeout(toast.timeOutId)})}),[]);let pop=id=>{!isMounted.current||setToasts(currentToasts=>currentToasts.filter(toast=>(toast.id===id&&(toast.timeOutId&&window.clearTimeout(toast.timeOutId),toast.onDismiss&&toast.onDismiss()),toast.id!==id)))};return{toasts,push:newToast=>{if(!isMounted.current)return;let generatedID=(0,import_uid_library.uid)(newToast),timeOutId;newToast.dismissAfter!=null&&Number.isInteger(newToast.dismissAfter)&&(timeOutId=window.setTimeout(pop,newToast.dismissAfter,newToast.id||generatedID));let existingToasts=toasts.map(toast=>{let tmpToast=toast;return tmpToast.setFocus=!1,tmpToast});setToasts([__spreadValues({id:generatedID,timeOutId,setFocus:!0},newToast),...existingToasts])},pop}};0&&(module.exports={AnimatedToast,Toast,ToastContainer,Toaster,useToaster});

dist/propTypes.d.ts

@@ -14,7 +14,5 @@ import PropTypes from 'prop-types';
     children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
-    __console_patch: PropTypes.Requireable<boolean>;
 };
 export declare const ToastContainerPropTypes: {
     children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
-    __console_patch: PropTypes.Requireable<boolean>;
 };
@@ -24,4 +22,3 @@ export declare const ToasterPropTypes: {
     pop: PropTypes.Validator<(...args: any[]) => any>;
-    __console_patch: PropTypes.Requireable<boolean>;
 };
 //# sourceMappingURL=propTypes.d.ts.map

dist/ToastContainer.d.ts

 import * as React from 'react';
 import type { ToastContainerProps } from './types';
-declare const ToastContainer: React.ForwardRefExoticComponent<Pick<ToastContainerProps, "id" | "color" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "nonce" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "__console_patch"> & React.RefAttributes<HTMLDivElement>>;
+declare const ToastContainer: React.ForwardRefExoticComponent<ToastContainerProps & React.RefAttributes<HTMLDivElement>>;
 export { ToastContainer };
 //# sourceMappingURL=ToastContainer.d.ts.map

dist/Toaster.d.ts

 import * as React from 'react';
 import type { ToasterProps } from './types';
-export declare const AnimatedToast: import("@react-spring/web").AnimatedComponent<React.ForwardRefExoticComponent<Pick<import("@twilio-paste/box").BoxProps, "id" | "variant" | "element" | "animation" | "appearance" | "boxSizing" | "clip" | "content" | "cursor" | "float" | "objectFit" | "objectPosition" | "opacity" | "outline" | "pointerEvents" | "resize" | "tableLayout" | "transform" | "transformOrigin" | "transition" | "userSelect" | "visibility" | "willChange" | "-webkit-text-fill-color" | "-webkit-opacity" | "width" | "minWidth" | "maxWidth" | "height" | "minHeight" | "maxHeight" | "size" | "display" | "verticalAlign" | "overflow" | "overflowX" | "overflowY" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "columnGap" | "rowGap" | "background" | "backgroundColor" | "backgroundImage" | "backgroundSize" | "backgroundPosition" | "backgroundRepeat" | "backgroundAttachment" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderCollapse" | "borderSpacing" | "borderWidth" | "borderBottomWidth" | "borderLeftWidth" | "borderRightWidth" | "borderTopWidth" | "borderStyle" | "borderTopStyle" | "borderRightStyle" | "borderBottomStyle" | "borderLeftStyle" | "borderColor" | "borderBottomColor" | "borderLeftColor" | "borderRightColor" | "borderTopColor" | "borderRadius" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderTopLeftRadius" | "borderTopRightRadius" | "boxShadow" | "textShadow" | "position" | "top" | "right" | "bottom" | "left" | "zIndex" | "inset" | "fontFamily" | "fontSize" | "fontWeight" | "fontVariantNumeric" | "lineHeight" | "letterSpacing" | "textAlign" | "fontStyle" | "color" | "textDecoration" | "textOverflow" | "textTransform" | "whiteSpace" | "wordBreak" | "wordWrap" | "overflowWrap" | "listStyleImage" | "listStylePosition" | "listStyleType" | "alignItems" | "alignContent" | "justifyItems" | "justifyContent" | "flexWrap" | "flexDirection" | "flex" | "flexGrow" | "flexShrink" | "flexBasis" | "justifySelf" | "alignSelf" | "order" | "gridRow" | "gridColumn" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "nonce" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "_hover" | "_active" | "_focus" | "_focus_hover" | "_focus_placeholder" | "_visited" | "_even" | "_odd" | "_disabled" | "_checked" | "_checked_hover" | "_mixed" | "_selected" | "_selected_hover" | "_selected_focus" | "_selected_focusVisible" | "_invalid" | "_pressed" | "_pressed_focus" | "_pressed_hover" | "_pressed_active" | "_pressed_disabled" | "_readOnly" | "_first" | "_last" | "_expanded" | "_grabbed" | "_notFirst" | "_notLast" | "_groupHover" | "_before" | "_after" | "_focusWithin" | "_focusVisible" | "_placeholder" | "__moz_focus_inner" | "__webkit_datetime_edit" | "__webkit_calendar_picker_indicator_hover" | "accept" | "as" | "type" | "alt" | "src" | "href" | "rel" | "target" | "multiple" | "label" | "datetime" | "disabled"> & React.RefAttributes<HTMLElement>>>;
+export declare const AnimatedToast: import("@react-spring/web").AnimatedComponent<React.ForwardRefExoticComponent<import("@twilio-paste/box").BoxProps & React.RefAttributes<HTMLElement>>>;
 declare const Toaster: React.FC<React.PropsWithChildren<ToasterProps>>;
 export { Toaster };
 //# sourceMappingURL=Toaster.d.ts.map

dist/ToastPortal.d.ts

 import * as React from 'react';
 import type { ToastPortalProps } from './types';
-declare const ToastPortal: React.ForwardRefExoticComponent<Pick<ToastPortalProps, "id" | "color" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "nonce" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "__console_patch"> & React.RefAttributes<HTMLDivElement>>;
+declare const ToastPortal: React.ForwardRefExoticComponent<ToastPortalProps & React.RefAttributes<HTMLDivElement>>;
 export { ToastPortal };
 //# sourceMappingURL=ToastPortal.d.ts.map

dist/types.d.ts

 /// <reference types="react" />
 import type { BoxProps } from '@twilio-paste/box';
 import type { ValueOf } from '@twilio-paste/types';
+import type { Left } from '@twilio-paste/style-props';
 import type { ToastVariantObject } from './constants';
@@ -43,9 +44,7 @@ export type ToastVariants = ValueOf<typeof ToastVariantObject>;
     children: NonNullable<React.ReactNode>;
-    ref?: any;
-    __console_patch?: boolean;
+    left?: Left;
 }
 export interface ToastContainerProps extends React.HTMLAttributes<HTMLDivElement> {
     children: NonNullable<React.ReactNode>;
-    ref?: any;
-    __console_patch?: boolean;
+    left?: Left;
 }
@@ -79,4 +78,4 @@ export interface ToasterToast extends Pick<ToastProps, 'variant' | 'setFocus' | 'onDismiss'> {
 export interface ToasterProps extends Pick<UseToasterReturnedProps, 'toasts' | 'pop'> {
-    __console_patch?: boolean;
+    left?: Left;
 }
 //# sourceMappingURL=types.d.ts.map

package.json

 {
   "name": "@twilio-paste/toast",
-  "version": "10.0.1",
+  "version": "11.0.0",
   "category": "feedback",
@@ -28,20 +28,22 @@ "status": "production",
   "peerDependencies": {
-    "@twilio-paste/anchor": "^10.0.0",
+    "@twilio-paste/anchor": "^11.0.0",
     "@twilio-paste/animation-library": "^1.0.0",
-    "@twilio-paste/box": "^8.0.0",
-    "@twilio-paste/button": "^12.0.0",
+    "@twilio-paste/box": "^9.0.0",
+    "@twilio-paste/button": "^13.0.0",
     "@twilio-paste/color-contrast-utils": "^4.0.0",
-    "@twilio-paste/customization": "^6.0.0",
+    "@twilio-paste/customization": "^7.0.0",
     "@twilio-paste/design-tokens": "^9.0.0",
-    "@twilio-paste/icons": "^10.0.0",
-    "@twilio-paste/media-object": "^8.0.0",
+    "@twilio-paste/icons": "^11.0.0",
+    "@twilio-paste/media-object": "^9.0.0",
     "@twilio-paste/reakit-library": "^1.0.0",
-    "@twilio-paste/screen-reader-only": "^11.0.0",
-    "@twilio-paste/spinner": "^12.0.0",
-    "@twilio-paste/stack": "^6.0.0",
-    "@twilio-paste/style-props": "^7.0.0",
+    "@twilio-paste/screen-reader-only": "^12.0.0",
+    "@twilio-paste/spinner": "^13.0.0",
+    "@twilio-paste/stack": "^7.0.0",
+    "@twilio-paste/style-props": "^8.0.0",
     "@twilio-paste/styling-library": "^2.0.0",
-    "@twilio-paste/theme": "^9.0.0",
-    "@twilio-paste/types": "^4.0.0",
+    "@twilio-paste/theme": "^10.0.0",
+    "@twilio-paste/types": "^5.0.0",
     "@twilio-paste/uid-library": "^1.0.0",
+    "@types/react": "^16.8.6 || ^17.0.2 || ^18.0.27",
+    "@types/react-dom": "^16.8.6 || ^17.0.2 || ^18.0.10",
     "prop-types": "^15.7.2",
@@ -52,24 +54,27 @@ "react": "^16.8.6 || ^17.0.2 || ^18.0.0",
   "devDependencies": {
-    "@twilio-paste/anchor": "^10.0.0",
+    "@twilio-paste/anchor": "^11.0.0",
     "@twilio-paste/animation-library": "^1.0.0",
-    "@twilio-paste/box": "^8.1.0",
-    "@twilio-paste/button": "^12.0.1",
+    "@twilio-paste/box": "^9.0.0",
+    "@twilio-paste/button": "^13.0.0",
     "@twilio-paste/color-contrast-utils": "^4.0.0",
-    "@twilio-paste/customization": "^6.0.0",
-    "@twilio-paste/design-tokens": "^9.0.1",
-    "@twilio-paste/icons": "^10.0.0",
-    "@twilio-paste/media-object": "^8.0.0",
+    "@twilio-paste/customization": "^7.0.0",
+    "@twilio-paste/design-tokens": "^9.0.2",
+    "@twilio-paste/icons": "^11.0.0",
+    "@twilio-paste/media-object": "^9.0.0",
     "@twilio-paste/reakit-library": "^1.0.0",
-    "@twilio-paste/screen-reader-only": "^11.0.0",
-    "@twilio-paste/spinner": "^12.0.0",
-    "@twilio-paste/stack": "^6.0.0",
-    "@twilio-paste/style-props": "^7.0.0",
+    "@twilio-paste/screen-reader-only": "^12.0.0",
+    "@twilio-paste/spinner": "^13.0.0",
+    "@twilio-paste/stack": "^7.0.0",
+    "@twilio-paste/style-props": "^8.0.0",
     "@twilio-paste/styling-library": "^2.0.0",
-    "@twilio-paste/theme": "^9.0.1",
-    "@twilio-paste/types": "^4.0.0",
+    "@twilio-paste/theme": "^10.0.0",
+    "@twilio-paste/types": "^5.0.0",
     "@twilio-paste/uid-library": "^1.0.0",
+    "@types/react": "^18.0.27",
+    "@types/react-dom": "^18.0.10",
     "prop-types": "^15.7.2",
     "react": "^18.0.0",
-    "react-dom": "^18.0.0"
+    "react-dom": "^18.0.0",
+    "typescript": "^4.9.4"
   }
 }

No alert changes

Worsened metrics

Total package byte prevSize

205438

decreased by-9.6%

Dependency count

23

increased by9.52%

Dev dependency count

24

increased by14.29%

Lines of code

1209

decreased by-5.62%

No dependency changes