@jobber/components 5.18.1 → 5.19.0

package/dist/index.mjs

@@ -1,163 +1,165 @@
-export { A as AnimatedPresence } from './AnimatedPresence-axmqxwK0.js';
-export { A as AnimatedSwitcher } from './AnimatedSwitcher-Dlr71FEg.js';
-export { A as AtlantisContext, a as atlantisContextDefaultValues, u as useAtlantisContext } from './AtlantisContext-DI_E5mk4.js';
-export { A as Autocomplete } from './Autocomplete--VHCcyux.js';
-export { A as Avatar } from './Avatar-DZzpGqWA.js';
-export { B as Banner } from './Banner-iVs_fT5w.js';
-export { B as Box } from './Box-BV4iwGBK.js';
-export { B as Button } from './Button-s5Y-PuNu.js';
-export { B as ButtonDismiss } from './ButtonDismiss-BVn1l_gN.js';
-export { C as Card } from './Card-CC2yiF5v.js';
-export { C as Checkbox } from './Checkbox-5Vtzkr44.js';
-export { C as Chip } from './Chip-C0YJHnGB.js';
-export { a as ChipDismissible, C as ChipSelectable } from './ChipDismissible-DSVra_0s.js';
+export { A as AnimatedPresence } from './AnimatedPresence-sXgeyUx0.js';
+export { A as AnimatedSwitcher } from './AnimatedSwitcher-BxuUIq4-.js';
+export { A as AtlantisContext, a as atlantisContextDefaultValues, u as useAtlantisContext } from './AtlantisContext-fkYdyFJE.js';
+export { A as Autocomplete } from './Autocomplete-Bd6y3Lvo.js';
+export { A as Avatar } from './Avatar-CbKcK9Xa.js';
+export { B as Banner } from './Banner-DxMINFf5.js';
+export { B as Box } from './Box-BLiQq2Yr.js';
+export { B as Button } from './Button-BymNW5Oe.js';
+export { B as ButtonDismiss } from './ButtonDismiss-Dha5Sz_n.js';
+export { C as Card } from './Card-Bkk4cetm.js';
+export { C as Checkbox } from './Checkbox-BiFEjNM5.js';
+export { C as Chip } from './Chip-BT5_84uL.js';
+export { a as ChipDismissible, C as ChipSelectable } from './ChipDismissible-BVrR55-d.js';
 import 'react';
 import 'classnames';
-import './useAssert-CHiJvHck.js';
-export { I as Icon } from './Icon-DLLXp2G6.js';
-export { T as Typography } from './Typography-CIsFcfxl.js';
-export { T as Tooltip } from './Tooltip-COIxWXHf.js';
-export { C as Chips } from './Chips-D1b8PfY8.js';
-export { C as Combobox } from './Combobox-hD-jiteU.js';
-export { C as ComboboxContextProvider } from './ComboboxProvider-Co9iyhvA.js';
-export { C as ConfirmationModal } from './ConfirmationModal-BvDqRXdR.js';
-export { C as Content } from './Content-C0GmACBy.js';
-export { C as Countdown } from './Countdown-D0aPhp9i.js';
-export { D as DataDump } from './DataDump-C29fWkbq.js';
-export { D as DataList } from './DataList-QQxIc1d4.js';
-export { D as DataTable } from './DataTable-CdF9eDEn.js';
-import './useResizeObserver-DFhp1sUY.js';
+import './useAssert-Dta8BhS_.js';
+export { I as Icon } from './Icon-Rg4OSYoL.js';
+export { T as Typography } from './Typography-CSv0oO0L.js';
+export { T as Tooltip } from './Tooltip-C0VawVBU.js';
+export { C as Chips } from './Chips-gAoz8abt.js';
+export { C as Combobox } from './Combobox-CuCZ9B5Y.js';
+export { C as ComboboxContextProvider } from './ComboboxProvider-Co3lca_n.js';
+export { C as ConfirmationModal } from './ConfirmationModal-qNALrzvb.js';
+export { C as Content } from './Content-DOZ5cNjx.js';
+export { C as Countdown } from './Countdown-CWDyzOAp.js';
+export { D as DataDump } from './DataDump-CrTm4GKv.js';
+export { D as DataList } from './DataList-CvFeimM_.js';
+export { D as DataTable } from './DataTable-nlFLhPVZ.js';
+import './useResizeObserver-Bt7of2d6.js';
 export { createColumnHelper } from '@tanstack/react-table';
-export { D as DatePicker } from './DatePicker-s0Q3ORK3.js';
-export { D as DescriptionList } from './DescriptionList-DS3JIKDO.js';
-export { D as Disclosure } from './Disclosure-C_kvYOjB.js';
-export { D as Divider } from './Divider-BVq4u0Ev.js';
-export { D as Drawer, a as DrawerGrid } from './DrawerGrid-CAsY05P2.js';
-export { E as Emphasis } from './Emphasis-RMWif_RT.js';
-export { F as FeatureSwitch } from './FeatureSwitch-C5i15WMq.js';
-export { F as Flex } from './Flex-DoUn1YwY.js';
-export { F as Form } from './Form-ChtF6Oi3.js';
-export { F as FormField } from './FormField-D8nr0Xf6.js';
-export { F as FormatDate, s as strFormatDate } from './FormatDate-MqbYItM4.js';
-export { F as FormatEmail } from './FormatEmail-UFfgVKzJ.js';
-export { F as FormatFile } from './FormatFile-D9qj93f3.js';
-export { F as FormatRelativeDateTime } from './FormatRelativeDateTime-DEOJABUF.js';
-export { F as FormatTime } from './FormatTime-DXwgdYya.js';
-export { G as Gallery } from './Gallery-fCG1tSlA.js';
-export { a as GLIMMER_TEST_ID, G as Glimmer } from './Glimmer-BeOYh642.js';
-export { G as GRID_TEST_ID, a as Grid } from './Grid-hDqUmgfS.js';
-export { H as Heading } from './Heading-U3Nnkyx2.js';
-export { I as InlineLabel } from './InlineLabel-Dy4kOVOu.js';
-export { I as InputAvatar } from './InputAvatar-UuCl8JZ1.js';
-export { I as InputDate } from './InputDate-C9m4_Mi3.js';
-export { I as InputEmail, v as validationMessage } from './InputEmail-CzuMAJD8.js';
-export { I as InputFile, u as updateFiles } from './InputFile-j7fY4xvU.js';
-export { I as InputGroup } from './InputGroup-BIFjmtXU.js';
-export { I as InputNumber } from './InputNumber-CYzBSLhu.js';
-export { I as InputPassword } from './InputPassword-CfkD_mqp.js';
-export { I as InputPhoneNumber } from './InputPhoneNumber-BB-KEdCz.js';
-export { I as InputText } from './InputText-uSxtp1gF.js';
-export { I as InputTime } from './InputTime-C26ckJLo.js';
-export { I as InputValidation } from './InputValidation-BJo1g-b_.js';
-export { L as LightBox } from './LightBox-DNPpIii-.js';
-export { L as Link } from './Link-Bo0fbIkd.js';
-export { L as List, a as ListItem } from './List-DSKQb_0K.js';
-export { M as Markdown } from './Markdown-BE4w1vwl.js';
-export { M as Menu } from './Menu-CRgoMW7E.js';
-export { M as Modal } from './Modal-CGjHZ3-y.js';
-export { M as MultiSelect } from './MultiSelect-bIzJZ51k.js';
-export { P as Page } from './Page-CgzwpkQg.js';
-export { P as Popover } from './Popover-DjKAUUPy.js';
-export { P as ProgressBar } from './ProgressBar-g9ttUEV4.js';
-export { R as RadioGroup, a as RadioOption } from './RadioGroup-nJzbzQ1P.js';
-export { R as RecurringSelect } from './RecurringSelect-BJ9CSBWs.js';
-export { D as DurationPeriod, W as WeekDay } from './DayOfMonthSelect-COdm25Rr.js';
-export { a as Option, S as Select } from './Option-_MZZCxRG.js';
-export { S as SideDrawer } from './SideDrawer-BrCDeLt_.js';
-export { S as Spinner } from './Spinner-BXr7riat.js';
-export { S as StatusIndicator } from './StatusIndicator-Bctt27JI.js';
-export { S as StatusLabel } from './StatusLabel-2Um_hoRn.js';
-export { S as Switch } from './Switch-DVlFkpMv.js';
-export { B as Body, C as Cell, b as CellCurrency, a as CellNumeric, F as Footer, H as Header, R as Row, T as Table } from './Body-BMHj7_6X.js';
-export { a as Tab, T as Tabs } from './Tabs-CsClDPSk.js';
-export { T as Text } from './Text-Bhipnzf0.js';
+export { D as DatePicker } from './DatePicker-BMWiYi4f.js';
+export { D as DescriptionList } from './DescriptionList-CqTtjFQV.js';
+export { D as Disclosure } from './Disclosure-tToSAZrb.js';
+export { D as Divider } from './Divider-DI9NkvIx.js';
+export { D as Drawer, a as DrawerGrid } from './DrawerGrid-bQDXKU_E.js';
+export { E as Emphasis } from './Emphasis-DkmfG7uD.js';
+export { F as FeatureSwitch } from './FeatureSwitch-BsfovW5Y.js';
+export { F as Flex } from './Flex-Dqti_buL.js';
+export { F as Form } from './Form-D-muPuIL.js';
+export { F as FormField } from './FormField-D7dRM75q.js';
+export { F as FormatDate, s as strFormatDate } from './FormatDate-BaDpP7u5.js';
+export { F as FormatEmail } from './FormatEmail-6a7KaUsW.js';
+export { F as FormatFile } from './FormatFile-4CvMAu_U.js';
+export { F as FormatRelativeDateTime } from './FormatRelativeDateTime-JP8fg38S.js';
+export { F as FormatTime } from './FormatTime-QiEKjbgF.js';
+export { G as Gallery } from './Gallery-DquD6tms.js';
+export { a as GLIMMER_TEST_ID, G as Glimmer } from './Glimmer-BVMo-YTM.js';
+export { G as GRID_TEST_ID, a as Grid } from './Grid-xg03q57y.js';
+export { H as Heading } from './Heading-2tLRNoLi.js';
+export { I as InlineLabel } from './InlineLabel-BTQmke0X.js';
+export { I as InputAvatar } from './InputAvatar-CYii-UNn.js';
+export { I as InputDate } from './InputDate-CCK_v-TV.js';
+export { I as InputEmail, v as validationMessage } from './InputEmail-DjOmTOtG.js';
+export { I as InputFile, u as updateFiles } from './InputFile-CZVfG9R4.js';
+export { I as InputGroup } from './InputGroup-Sxs2MbtQ.js';
+export { I as InputNumber } from './InputNumber-BaiOERSA.js';
+export { I as InputPassword } from './InputPassword-4VttSgBc.js';
+export { I as InputPhoneNumber } from './InputPhoneNumber-3651VLa1.js';
+export { I as InputText } from './InputText-Ds2bv_IZ.js';
+export { I as InputTime } from './InputTime-whp0gC3W.js';
+export { I as InputValidation } from './InputValidation-B1FfgUM-.js';
+export { L as LightBox } from './LightBox-CsbgxWdJ.js';
+export { L as Link } from './Link-DPkcgiVM.js';
+export { L as List, a as ListItem } from './List-DujQyBbI.js';
+export { M as Markdown } from './Markdown-DzKTZAVw.js';
+export { M as Menu } from './Menu-D2IBI6Ox.js';
+export { M as Modal } from './Modal-VkA1VPYX.js';
+export { M as MultiSelect } from './MultiSelect-CFRRP8qa.js';
+export { P as Page } from './Page-DK1WWTbf.js';
+export { P as Popover } from './Popover-AdeZqqx_.js';
+export { P as ProgressBar } from './ProgressBar-B3EnrHTw.js';
+export { R as RadioGroup, a as RadioOption } from './RadioGroup-BnvSlr-X.js';
+export { R as RecurringSelect } from './RecurringSelect-rsDkNEWL.js';
+export { D as DurationPeriod, W as WeekDay } from './DayOfMonthSelect-1iUxrj6j.js';
+export { a as Option, S as Select } from './Option-BjdLsC0C.js';
+export { S as SideDrawer } from './SideDrawer-ou6jZRJQ.js';
+export { S as Spinner } from './Spinner-JMTGVOuU.js';
+export { S as StatusIndicator } from './StatusIndicator-CVqCZc37.js';
+export { S as StatusLabel } from './StatusLabel-BBp6lcbe.js';
+export { S as Switch } from './Switch-C7awOypm.js';
+export { B as Body, C as Cell, b as CellCurrency, a as CellNumeric, F as Footer, H as Header, R as Row, T as Table } from './Body-CzYgk1U-.js';
+export { a as Tab, T as Tabs } from './Tabs-CqlmvAi3.js';
+export { T as Text } from './Text-D5zH_SD5.js';
+export { s as showToast } from './showToast-BfII2QS7.js';
 import 'framer-motion';
 import '@jobber/design';
-import './tslib.es6-B9g-bebS.js';
-import './debounce-g2v7vopm.js';
-import './_commonjsHelpers-VMaESrBh.js';
-import './isObjectLike-CvfQWhj7.js';
-import './isSymbol-CCaZ2F9z.js';
+import './tslib.es6-C5Wmkig-.js';
+import './debounce-AYcpZv3c.js';
+import './_commonjsHelpers-C_-0bU2G.js';
+import './isObjectLike-DJ9pm7V7.js';
+import './isSymbol-Brdz3x-m.js';
 import 'react-dom';
 import 'react-popper';
-import './useOnKeyDown-4CTWMuua.js';
-import './useSafeLayoutEffect-DZrEiG1K.js';
-import './useIsMounted-BBOydLZB.js';
+import './useOnKeyDown-BJEKhimr.js';
+import './useSafeLayoutEffect-B3DemlJA.js';
+import './useIsMounted-DYSFdj5s.js';
 import 'color';
-import './BannerIcon-Cs6LF2eh.js';
+import './BannerIcon-CqCQLQuZ.js';
 import 'react-router-dom';
 import 'react-hook-form';
-import './useInView-DpysuKC8.js';
-import './useChildComponent-BJojWlWk.js';
-import './_polyfill-node.process-DKNimD45.js';
-import './InternalChipDismissible-CA5ombsC.js';
-import './useScrollToActive-DFOjsTpj.js';
-import './_setToString-D1EtoOxb.js';
-import './_defineProperty-DSq7BMZb.js';
-import './_getTag-CvAnlMPG.js';
-import './_baseEach-Dl6DG6BU.js';
-import './ComboboxContent-CsBQQG-8.js';
-import './ComboboxContentSearch-Bg8hRPKI.js';
-import './ComboboxContentList-D-mRsaPH.js';
-import './ComboboxOption-BuMN_s-B.js';
-import './ComboboxLoadMore-DtTVVLn8.js';
-import './ComboboxContentHeader-qY6PH8GZ.js';
-import './useRefocusOnActivator-BIv59K9T.js';
-import './useFocusTrap-DePbJrHO.js';
-import './ComboboxAction-rSy6DHUT.js';
-import './ComboboxTrigger-BrWy6YLh.js';
-import './noop-BTf6SFrE.js';
-import './ComboboxActivator-ZTbVRIXr.js';
+import './useInView-Cc7Njqkc.js';
+import './useChildComponent-C5oBlBHa.js';
+import './_polyfill-node.process-BizOZKnf.js';
+import './InternalChipDismissible-DJp67z9r.js';
+import './useScrollToActive-Adr0SqcF.js';
+import './_setToString-zO8GCYup.js';
+import './_defineProperty-CGICsf-Z.js';
+import './_getTag-RbAOAtdi.js';
+import './_baseEach-D7Wv4SNt.js';
+import './ComboboxContent-CHBX5oOe.js';
+import './ComboboxContentSearch-DXKgGey1.js';
+import './ComboboxContentList-gtoHwcfI.js';
+import './ComboboxOption-CiM5d6R6.js';
+import './ComboboxLoadMore-D-ltI90h.js';
+import './ComboboxContentHeader-CdSQLnQ4.js';
+import './useRefocusOnActivator-BJSxPAz2.js';
+import './useFocusTrap-B5TCIRsQ.js';
+import './ComboboxAction-CnBhU8NI.js';
+import './ComboboxTrigger-DOM1K5Il.js';
+import './noop-BDZuIIw7.js';
+import './ComboboxActivator-q19OCWIc.js';
 import '@std-proposal/temporal';
-import './index-CpJ9n-HS.js';
-import './DataList-BOpY6O59.js';
-import './DataListTotalCount-CVL7GS73.js';
-import './DataListLoadingState-BxCsfJfq.js';
-import './DataListContext-rPJZkMKs.js';
-import './useActiveLayout-YlcCY6wt.js';
-import './useResponsiveSizing-BmmcSGj1.js';
-import './DataList.const-C8dbQzNr.js';
-import './DataListLayout-CoV4tY0l.js';
-import './DataListItems-Bx14ufTN.js';
-import './DataListLayoutContext-sGhrTIp4.js';
-import './DataListItem-DWAuI6Y0.js';
-import './DataListItemActions-gwY_l7H3.js';
-import './DataListActions-BXEN1BbV.js';
-import './DataListOverflowFade-wgcQe2mG.js';
-import './DataList.utils-9TImvQgQ.js';
-import './DataListTags-DPOVKjNM.js';
-import './DataListHeaderTile-DwnEATBl.js';
-import './DataListSortingOptions-m8IEt0-i.js';
-import './DataListLayoutContext-ClAUmf64.js';
-import './DataListItemActionsOverflow-DX2ykdxW.js';
-import './DataListActionsMenu-6BiI2aEO.js';
-import './useBatchSelect-DufODMr4.js';
-import './DataListItemClickable-NteOv0Kx.js';
-import './DataListHeader-CdL4I9RC.js';
-import './DataListBulkActions-MK9Ijv_o.js';
-import './DataListFilters-CsK0Cocd.js';
-import './DataListSort-DtMKIfI3.js';
-import './DataListStickyHeader-Cj2bpPOT.js';
-import './DataListSearch-BdeQ2l20.js';
-import './DataListEmptyState-5p9qzHRR.js';
-import './DataListLoadMore-rrendlqK.js';
-import './DataListAction-C1M8Lyhk.js';
-import './DataListLayoutActions--r4SeGFv.js';
-import './DataListStatusBar-DEabo97Y.js';
-import './throttle-CVIvoaFH.js';
-import './_baseAssignValue-BD-ExZSr.js';
-import './useFormFieldFocus-C5gkdivt.js';
+import './index-DkrNdOvY.js';
+import './DataList-ft4T8T3E.js';
+import './DataListTotalCount-CBbydstu.js';
+import './DataListLoadingState-Clx1oEla.js';
+import './DataListContext-DQszOeuf.js';
+import './useActiveLayout-cBN-yfQj.js';
+import './useResponsiveSizing-WtRnujX5.js';
+import './DataList.const-oJ-tUrcq.js';
+import './DataListLayout-CKE-Opc9.js';
+import './DataListItems-C-d0pYMD.js';
+import './DataListLayoutContext-BHOcLYN9.js';
+import './DataListItem-CbihPyMG.js';
+import './DataListItemActions-BgW95xKA.js';
+import './DataListActions-Csxwj-lv.js';
+import './DataListOverflowFade-0tSiZ3bU.js';
+import './DataList.utils-DWjN0oAT.js';
+import './DataListTags-fJA2gIvi.js';
+import './DataListHeaderTile-B9G19eva.js';
+import './DataListSortingOptions-Dnoqr8EE.js';
+import './DataListLayoutContext-CAiOdWox.js';
+import './DataListItemActionsOverflow-UsiU0z3t.js';
+import './DataListActionsMenu-B6R6pVWc.js';
+import './useBatchSelect-DfzgVg0N.js';
+import './DataListItemClickable-DlVWn2eo.js';
+import './DataListHeader-CMRTOVIm.js';
+import './DataListBulkActions-gujjW8fs.js';
+import './DataListFilters-HkC4xS5B.js';
+import './DataListSort-DmN-kOeb.js';
+import './DataListStickyHeader-BaAXC91w.js';
+import './DataListSearch-C0rRgLQi.js';
+import './DataListEmptyState-BjYByrNI.js';
+import './DataListLoadMore-Bj8vWAto.js';
+import './DataListAction-CTIJMd6b.js';
+import './DataListLayoutActions-Y0hhtW1v.js';
+import './DataListStatusBar-DEJ5o9zo.js';
+import './throttle-B_tNTd7G.js';
+import './_baseAssignValue-DGQRJ7mn.js';
+import './useFormFieldFocus-B_Wc76-c.js';
 import 'filesize';
-import './InternalGridCell-DfK-ZeY5.js';
+import './InternalGridCell-CF26x0ym.js';
 import 'axios';
 import '@jobber/formatters';
+import 'react-dom/client';

package/dist/{isObjectLike-CvfQWhj7.js → isObjectLike-DJ9pm7V7.js}

@@ -1,4 +1,4 @@
-import { c as commonjsGlobal } from './_commonjsHelpers-VMaESrBh.js';
+import { c as commonjsGlobal } from './_commonjsHelpers-C_-0bU2G.js';
 
 /**
  * Checks if `value` is the

package/dist/{isObjectLike-BUdrd69i.js → isObjectLike-DOIAlxkG.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var _commonjsHelpers = require('./_commonjsHelpers-D7XtAbBt.js');
+var _commonjsHelpers = require('./_commonjsHelpers-CgKDug6z.js');
 
 /**
  * Checks if `value` is the

package/dist/{isSymbol-CCaZ2F9z.js → isSymbol-Brdz3x-m.js}

@@ -1,4 +1,4 @@
-import { _ as _baseGetTag, a as isObjectLike_1 } from './isObjectLike-CvfQWhj7.js';
+import { _ as _baseGetTag, a as isObjectLike_1 } from './isObjectLike-DJ9pm7V7.js';
 
 var baseGetTag = _baseGetTag,
     isObjectLike = isObjectLike_1;

package/dist/{isSymbol-y5DmAtoM.js → isSymbol-_8Usoq8d.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var isObjectLike$1 = require('./isObjectLike-BUdrd69i.js');
+var isObjectLike$1 = require('./isObjectLike-DOIAlxkG.js');
 
 var baseGetTag = isObjectLike$1._baseGetTag,
     isObjectLike = isObjectLike$1.isObjectLike_1;

package/dist/{noop-BTf6SFrE.js → noop-BDZuIIw7.js}

@@ -1,4 +1,4 @@
-import { g as getDefaultExportFromCjs } from './_commonjsHelpers-VMaESrBh.js';
+import { g as getDefaultExportFromCjs } from './_commonjsHelpers-C_-0bU2G.js';
 
 /**
  * This method returns `undefined`.

package/dist/{noop-DT48bWlF.js → noop-F3L3BoyP.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var _commonjsHelpers = require('./_commonjsHelpers-D7XtAbBt.js');
+var _commonjsHelpers = require('./_commonjsHelpers-CgKDug6z.js');
 
 /**
  * This method returns `undefined`.

package/dist/showToast-BfII2QS7.js

@@ -0,0 +1,101 @@
+import React, { useState, useEffect, forwardRef, useImperativeHandle, useRef } from 'react';
+import { createRoot } from 'react-dom/client';
+import { AnimatePresence, motion } from 'framer-motion';
+import { I as Icon } from './Icon-Rg4OSYoL.js';
+import { B as Button } from './Button-BymNW5Oe.js';
+import { T as Typography } from './Typography-CSv0oO0L.js';
+
+var styles = {"wrapper":"FVK4VwhLaVQ-","container":"MUXYGaC7Msg-","toast":"yCRa7jHH33M-","slice":"KiJL-VNZ3Sg-","button":"cExoS0APILs-"};
+
+function Toast({ message, variation = "success", action, actionLabel, }) {
+    const [visible, setVisible] = useState(true);
+    const icon = getIcon();
+    let timer;
+    useEffect(() => startTimer(), []);
+    return (React.createElement(AnimatePresence, null, visible && (React.createElement(motion.div, { className: styles.toast, initial: { opacity: 0, scale: 0.8 }, animate: { opacity: 1, scale: 1 }, onMouseEnter: () => stopTimer(), onMouseLeave: () => startTimer(), exit: {
+            opacity: 0,
+            scale: 0.8,
+            height: 0,
+            transition: { duration: 0.4 },
+        } },
+        React.createElement("div", { className: styles.slice },
+            React.createElement(Icon, { color: icon.color, name: icon.name }),
+            React.createElement(Typography, { element: "span", size: "large" }, message),
+            action && (React.createElement(Button, { label: `${actionLabel}`, onClick: action, type: "tertiary" })),
+            React.createElement("div", { className: styles.button },
+                React.createElement(Button, { icon: "remove", ariaLabel: "Hide Notification", onClick: handleToastClose, type: "tertiary", variation: "subtle" })))))));
+    function startTimer() {
+        timer = setTimeout(() => handleToastClose(), getTimeout());
+    }
+    function stopTimer() {
+        clearTimeout(timer);
+    }
+    function handleToastClose() {
+        setVisible(false);
+    }
+    function getTimeout() {
+        const min = 5000;
+        const max = 10000;
+        const time = message.length * 200;
+        if (time < min)
+            return min;
+        if (time > max)
+            return max;
+        return time;
+    }
+    function getIcon() {
+        switch (variation) {
+            case "info":
+                return { name: "knot", color: "lightBlue" };
+            case "error":
+                return { name: "alert", color: "red" };
+            default:
+                return { name: "checkmark", color: "green" };
+        }
+    }
+}
+
+const targetId = "atlantis-toast-element";
+let root;
+function showToast(props) {
+    // Ensure target and body is still there when rendering the toast. This is due
+    // to an issue with ReactDOM createRoot assuming document is always there and
+    // Jest taking the document down.
+    if (!globalThis.document)
+        return;
+    let target = globalThis.document.querySelector(`#${targetId}`);
+    if (!target) {
+        target = globalThis.document.createElement("div");
+        target.id = targetId;
+        target.classList.add(styles.wrapper);
+        globalThis.document.body.appendChild(target);
+    }
+    if (target && !root) {
+        root = createRoot(target);
+    }
+    if (root && target && globalThis.document.body.contains(target)) {
+        root.render(React.createElement(ToasterOven, Object.assign({}, props)));
+    }
+}
+const ToastContainer = forwardRef(ToastInternal);
+function ToasterOven(props) {
+    const toastRef = useRef();
+    useEffect(() => toastRef.current.add(props));
+    return React.createElement(ToastContainer, { ref: toastRef });
+}
+function ToastInternal(_, ref) {
+    const [toastKey, setToastKey] = useState(0);
+    const [toasts, setToasts] = useState([]);
+    useImperativeHandle(ref, () => ({
+        add: props => {
+            setToastKey(toastKey + 1);
+            setToasts([
+                Object.assign(Object.assign({}, props), { id: toastKey }),
+                ...toasts,
+            ]);
+        },
+    }));
+    return (React.createElement("div", { className: styles.container }, toasts.map(toast => (React.createElement(Toast, Object.assign({}, toast, { key: toast.id }))))));
+}
+
+export { showToast as s };

package/dist/showToast-DJnU23WD.js

@@ -0,0 +1,103 @@
+'use strict';
+
+var React = require('react');
+var client = require('react-dom/client');
+var framerMotion = require('framer-motion');
+var Icon = require('./Icon-CAkL6fde.js');
+var Button = require('./Button-qfPHhXD9.js');
+var Typography = require('./Typography-D7jV-Wfb.js');
+
+var styles = {"wrapper":"FVK4VwhLaVQ-","container":"MUXYGaC7Msg-","toast":"yCRa7jHH33M-","slice":"KiJL-VNZ3Sg-","button":"cExoS0APILs-"};
+
+function Toast({ message, variation = "success", action, actionLabel, }) {
+    const [visible, setVisible] = React.useState(true);
+    const icon = getIcon();
+    let timer;
+    React.useEffect(() => startTimer(), []);
+    return (React.createElement(framerMotion.AnimatePresence, null, visible && (React.createElement(framerMotion.motion.div, { className: styles.toast, initial: { opacity: 0, scale: 0.8 }, animate: { opacity: 1, scale: 1 }, onMouseEnter: () => stopTimer(), onMouseLeave: () => startTimer(), exit: {
+            opacity: 0,
+            scale: 0.8,
+            height: 0,
+            transition: { duration: 0.4 },
+        } },
+        React.createElement("div", { className: styles.slice },
+            React.createElement(Icon.Icon, { color: icon.color, name: icon.name }),
+            React.createElement(Typography.Typography, { element: "span", size: "large" }, message),
+            action && (React.createElement(Button.Button, { label: `${actionLabel}`, onClick: action, type: "tertiary" })),
+            React.createElement("div", { className: styles.button },
+                React.createElement(Button.Button, { icon: "remove", ariaLabel: "Hide Notification", onClick: handleToastClose, type: "tertiary", variation: "subtle" })))))));
+    function startTimer() {
+        timer = setTimeout(() => handleToastClose(), getTimeout());
+    }
+    function stopTimer() {
+        clearTimeout(timer);
+    }
+    function handleToastClose() {
+        setVisible(false);
+    }
+    function getTimeout() {
+        const min = 5000;
+        const max = 10000;
+        const time = message.length * 200;
+        if (time < min)
+            return min;
+        if (time > max)
+            return max;
+        return time;
+    }
+    function getIcon() {
+        switch (variation) {
+            case "info":
+                return { name: "knot", color: "lightBlue" };
+            case "error":
+                return { name: "alert", color: "red" };
+            default:
+                return { name: "checkmark", color: "green" };
+        }
+    }
+}
+
+const targetId = "atlantis-toast-element";
+let root;
+function showToast(props) {
+    // Ensure target and body is still there when rendering the toast. This is due
+    // to an issue with ReactDOM createRoot assuming document is always there and
+    // Jest taking the document down.
+    if (!globalThis.document)
+        return;
+    let target = globalThis.document.querySelector(`#${targetId}`);
+    if (!target) {
+        target = globalThis.document.createElement("div");
+        target.id = targetId;
+        target.classList.add(styles.wrapper);
+        globalThis.document.body.appendChild(target);
+    }
+    if (target && !root) {
+        root = client.createRoot(target);
+    }
+    if (root && target && globalThis.document.body.contains(target)) {
+        root.render(React.createElement(ToasterOven, Object.assign({}, props)));
+    }
+}
+const ToastContainer = React.forwardRef(ToastInternal);
+function ToasterOven(props) {
+    const toastRef = React.useRef();
+    React.useEffect(() => toastRef.current.add(props));
+    return React.createElement(ToastContainer, { ref: toastRef });
+}
+function ToastInternal(_, ref) {
+    const [toastKey, setToastKey] = React.useState(0);
+    const [toasts, setToasts] = React.useState([]);
+    React.useImperativeHandle(ref, () => ({
+        add: props => {
+            setToastKey(toastKey + 1);
+            setToasts([
+                Object.assign(Object.assign({}, props), { id: toastKey }),
+                ...toasts,
+            ]);
+        },
+    }));
+    return (React.createElement("div", { className: styles.container }, toasts.map(toast => (React.createElement(Toast, Object.assign({}, toast, { key: toast.id }))))));
+}
+
+exports.showToast = showToast;