carbon-react/lib/components/toast/toast.component.js

A library of reusable React components for easily building user interfaces.

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("react-transition-group"),n=require("../icon/icon.component.js"),o=require("../../__internal__/utils/helpers/tags/tags.js"),i=require("./toast.style.js"),a=require("../message/message.style.js"),s=require("../icon-button/icon-button.component.js"),l=require("../../__internal__/utils/helpers/events/events.js"),u=require("../../hooks/__internal__/useLocale/useLocale.js"),c=require("../../hooks/__internal__/useModalManager/useModalManager.js"),f=require("../../__internal__/utils/helpers/guid/index.js"),d=require("../typography/typography.component.js");function p(e){return e&&e.__esModule?e:{default:e}}function y(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function j(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){y(e,t,r[t])}))}return e}function b(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const g=p(t).default.forwardRef(((p,y)=>{var{align:g="center",alignY:m,children:O,id:h,maxWidth:_,onDismiss:v,open:x=!0,targetPortalId:P,timeout:w,variant:q="success",disableAutoFocus:S,closeButtonDataProps:T}=p,R=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}(p,["align","alignY","children","id","maxWidth","onDismiss","open","targetPortalId","timeout","variant","disableAutoFocus","closeButtonDataProps"]);const D="notice"===q,k="notification"===q,E=u.default(),M=t.useRef(f.default()),N=t.useRef(f.default()),I=t.useRef(null),C=t.useRef(null),W=t.useRef(null),Y=t.useRef(null),B=t.useRef(null),[L,A]=t.useState(0),F=`${!D&&M.current} ${N.current}`;let $=I;y&&"object"==typeof y&&"current"in y&&($=y);const G=t.useCallback((e=>{v&&l.default.isEscKey(e)&&(e.stopImmediatePropagation(),v(e))}),[v]);c.default({open:x,closeModal:G,modalRef:$,topModalOverride:!0}),t.useEffect((()=>{C.current&&clearTimeout(C.current),w&&x&&v&&(C.current=setTimeout((()=>v()),+w))}),[v,x,w]),t.useEffect((()=>{S||(x?setTimeout((()=>{var e;B.current=document.activeElement,null===(e=W.current)||void 0===e||e.focus()}),0):B.current&&(B.current.focus(),B.current=null,A(0)))}),[x,v,S]),t.useEffect((()=>()=>{B.current&&B.current.focus()}),[]);const K={notification:"alert",neutral:"info",success:"tick_circle",error:"error",info:"info",warning:"warning"}[q]||"none";return e.jsx(i.StyledPortal,{id:P,align:g,alignY:m,isNotice:D,children:e.jsx(i.ToastWrapper,{align:g,ref:$,isNotice:D,"data-role":"toast-wrapper",role:"region","aria-hidden":!x,"aria-labelledby":x?F:void 0,children:e.jsx(r.TransitionGroup,{children:function(){if(!x)return null;let t="success";return D||k||(t=q),e.jsx(r.CSSTransition,{enter:!0,classNames:D?"toast-alternative":"toast",timeout:{appear:1600,enter:1500,exit:500},nodeRef:W,children:e.jsxs(i.StyledToast,b(j(b(j({align:g,alignY:m,isNotice:D,isNotification:k},o.default("toast",R)),{variant:t,id:h,maxWidth:_,ref:W}),!S&&{tabIndex:L,onBlur:()=>A(void 0)}),{children:[!D&&e.jsxs(a.TypeIconStyle,{variant:k?"info":q,"data-role":"toast-type-icon",children:[e.jsx(n.default,{type:K}),e.jsx(d.Typography,{screenReaderOnly:!0,id:M.current,children:E.toast[q]()})]}),e.jsx(i.StyledToastContent,{isNotice:D,isDismiss:!!v,"data-role":"toast-content",id:N.current,children:O}),v&&e.jsx(s.default,b(j({"aria-label":E.toast.ariaLabels.close(),onClick:v,ref:Y},o.default("close",j({"data-element":"close"},T))),{children:e.jsx(n.default,{type:"close"})}))]}))})}()})})})}));g.displayName="Toast",exports.Toast=g,exports.default=g;