@economic/taco 1.1.5-alpha.102 → 1.1.5-alpha.127

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (162) hide show
  1. package/dist/components/Accordion/Accordion.stories.d.ts +26 -0
  2. package/dist/components/Backdrop/Backdrop.stories.d.ts +7 -0
  3. package/dist/components/Badge/Badge.stories.d.ts +15 -0
  4. package/dist/components/Banner/Banner.stories.d.ts +23 -0
  5. package/dist/components/Button/Button.stories.d.ts +69 -0
  6. package/dist/components/Calendar/Calendar.d.ts +3 -1
  7. package/dist/components/Calendar/Calendar.stories.d.ts +13 -0
  8. package/dist/components/Card/Card.stories.d.ts +12 -0
  9. package/dist/components/Datepicker/Datepicker.stories.d.ts +43 -0
  10. package/dist/components/Dialog/Dialog.d.ts +1 -1
  11. package/dist/components/Dialog/Dialog.stories.d.ts +54 -0
  12. package/dist/components/Field/Field.stories.d.ts +14 -0
  13. package/dist/components/Form/Form.stories.d.ts +14 -0
  14. package/dist/components/Group/Group.d.ts +11 -1
  15. package/dist/components/Group/Group.stories.d.ts +23 -0
  16. package/dist/components/Hanger/Hanger.stories.d.ts +11 -0
  17. package/dist/components/HoverCard/HoverCard.stories.d.ts +28 -0
  18. package/dist/components/Icon/Icon.stories.d.ts +24 -0
  19. package/dist/components/Icon/components/ChevronLeftSolid.d.ts +3 -0
  20. package/dist/components/Icon/components/ChevronRightSolid.d.ts +3 -0
  21. package/dist/components/Icon/components/index.d.ts +1 -1
  22. package/dist/components/IconButton/IconButton.stories.d.ts +45 -0
  23. package/dist/components/Input/Input.d.ts +1 -1
  24. package/dist/components/Input/Input.stories.d.ts +43 -0
  25. package/dist/components/Listbox/Listbox.stories.d.ts +44 -0
  26. package/dist/components/Menu/Menu.d.ts +2 -2
  27. package/dist/components/Menu/Menu.stories.d.ts +93 -0
  28. package/dist/components/Menu/components/Item.d.ts +1 -1
  29. package/dist/components/Menu/components/Link.d.ts +1 -1
  30. package/dist/components/Navigation/Navigation.stories.d.ts +7 -0
  31. package/dist/components/Pagination/Pagination.stories.d.ts +28 -0
  32. package/dist/components/Popover/Popover.stories.d.ts +14 -0
  33. package/dist/components/Progress/Progress.stories.d.ts +8 -0
  34. package/dist/components/RadioGroup/RadioGroup.stories.d.ts +49 -0
  35. package/dist/components/SearchInput/SearchInput.stories.d.ts +41 -0
  36. package/dist/components/Select/Select.stories.d.ts +35 -0
  37. package/dist/components/Spinner/Spinner.stories.d.ts +15 -0
  38. package/dist/components/Table/Table.stories.d.ts +32 -0
  39. package/dist/components/Table/util/rowIndexPath.d.ts +2 -2
  40. package/dist/components/Tabs/Tabs.stories.d.ts +19 -0
  41. package/dist/components/Textarea/Textarea.stories.d.ts +40 -0
  42. package/dist/components/Toast/Toast.d.ts +2 -2
  43. package/dist/components/Toast/Toast.stories.d.ts +12 -0
  44. package/dist/components/Toast/Toaster.d.ts +2 -2
  45. package/dist/components/Tooltip/Tooltip.stories.d.ts +25 -0
  46. package/dist/components/Tour/Tour.stories.d.ts +11 -0
  47. package/dist/css/Typography.stories.d.ts +6 -0
  48. package/dist/esm/components/Badge/Badge.js +1 -1
  49. package/dist/esm/components/Badge/Badge.js.map +1 -1
  50. package/dist/esm/components/Calendar/Calendar.js +4 -11
  51. package/dist/esm/components/Calendar/Calendar.js.map +1 -1
  52. package/dist/esm/components/Checkbox/Checkbox.js.map +1 -1
  53. package/dist/esm/components/Combobox/Combobox.js.map +1 -1
  54. package/dist/esm/components/Combobox/useCombobox.js +12 -13
  55. package/dist/esm/components/Combobox/useCombobox.js.map +1 -1
  56. package/dist/esm/components/Datepicker/Datepicker.js.map +1 -1
  57. package/dist/esm/components/Dialog/Dialog.js +39 -58
  58. package/dist/esm/components/Dialog/Dialog.js.map +1 -1
  59. package/dist/esm/components/Dialog/components/Content.js.map +1 -1
  60. package/dist/esm/components/Dialog/components/Drawer.js.map +1 -1
  61. package/dist/esm/components/Field/Field.js +10 -12
  62. package/dist/esm/components/Field/Field.js.map +1 -1
  63. package/dist/esm/components/Form/Form.js +6 -8
  64. package/dist/esm/components/Form/Form.js.map +1 -1
  65. package/dist/esm/components/Group/Group.js +9 -8
  66. package/dist/esm/components/Group/Group.js.map +1 -1
  67. package/dist/esm/components/Hanger/Hanger.js +27 -35
  68. package/dist/esm/components/Hanger/Hanger.js.map +1 -1
  69. package/dist/esm/components/HoverCard/HoverCard.js +8 -9
  70. package/dist/esm/components/HoverCard/HoverCard.js.map +1 -1
  71. package/dist/esm/components/Icon/Icon.js +7 -8
  72. package/dist/esm/components/Icon/Icon.js.map +1 -1
  73. package/dist/esm/components/Icon/components/ChevronLeftSolid.js +20 -0
  74. package/dist/esm/components/Icon/components/ChevronLeftSolid.js.map +1 -0
  75. package/dist/esm/components/Icon/components/ChevronRightSolid.js +20 -0
  76. package/dist/esm/components/Icon/components/ChevronRightSolid.js.map +1 -0
  77. package/dist/esm/components/Icon/components/index.js +4 -0
  78. package/dist/esm/components/Icon/components/index.js.map +1 -1
  79. package/dist/esm/components/IconButton/IconButton.js +9 -11
  80. package/dist/esm/components/IconButton/IconButton.js.map +1 -1
  81. package/dist/esm/components/Input/Input.js +25 -25
  82. package/dist/esm/components/Input/Input.js.map +1 -1
  83. package/dist/esm/components/Listbox/Listbox.js +24 -25
  84. package/dist/esm/components/Listbox/Listbox.js.map +1 -1
  85. package/dist/esm/components/Listbox/ScrollableList.js +2 -2
  86. package/dist/esm/components/Listbox/ScrollableList.js.map +1 -1
  87. package/dist/esm/components/Listbox/useListbox.js +3 -2
  88. package/dist/esm/components/Listbox/useListbox.js.map +1 -1
  89. package/dist/esm/components/Listbox/useMultiListbox.js +7 -7
  90. package/dist/esm/components/Listbox/useMultiListbox.js.map +1 -1
  91. package/dist/esm/components/Menu/Menu.js +16 -34
  92. package/dist/esm/components/Menu/Menu.js.map +1 -1
  93. package/dist/esm/components/Menu/components/Content.js.map +1 -1
  94. package/dist/esm/components/Menu/components/RadioGroup.js.map +1 -1
  95. package/dist/esm/components/Navigation/Navigation.js +36 -44
  96. package/dist/esm/components/Navigation/Navigation.js.map +1 -1
  97. package/dist/esm/components/Pagination/PageNumbers.js.map +1 -1
  98. package/dist/esm/components/Pagination/Pagination.js +39 -56
  99. package/dist/esm/components/Pagination/Pagination.js.map +1 -1
  100. package/dist/esm/components/Pagination/usePaginationShortcuts.js +4 -5
  101. package/dist/esm/components/Pagination/usePaginationShortcuts.js.map +1 -1
  102. package/dist/esm/components/Popover/Popover.js +29 -34
  103. package/dist/esm/components/Popover/Popover.js.map +1 -1
  104. package/dist/esm/components/Popover/Primitives.js.map +1 -1
  105. package/dist/esm/components/Progress/Progress.js +11 -15
  106. package/dist/esm/components/Progress/Progress.js.map +1 -1
  107. package/dist/esm/components/Provider/Provider.js +13 -18
  108. package/dist/esm/components/Provider/Provider.js.map +1 -1
  109. package/dist/esm/components/RadioGroup/RadioGroup.js +45 -57
  110. package/dist/esm/components/RadioGroup/RadioGroup.js.map +1 -1
  111. package/dist/esm/components/SearchInput/SearchInput.js +10 -12
  112. package/dist/esm/components/SearchInput/SearchInput.js.map +1 -1
  113. package/dist/esm/components/Select/Select.js +30 -31
  114. package/dist/esm/components/Select/Select.js.map +1 -1
  115. package/dist/esm/components/Select/useSelect.js +6 -7
  116. package/dist/esm/components/Select/useSelect.js.map +1 -1
  117. package/dist/esm/components/Spinner/Spinner.js +12 -19
  118. package/dist/esm/components/Spinner/Spinner.js.map +1 -1
  119. package/dist/esm/components/Switch/Switch.js +9 -10
  120. package/dist/esm/components/Switch/Switch.js.map +1 -1
  121. package/dist/esm/components/Table/components/BaseTable.js.map +1 -1
  122. package/dist/esm/components/Table/components/WindowedTable.js.map +1 -1
  123. package/dist/esm/components/Table/hooks/plugins/useRowActions.js +2 -3
  124. package/dist/esm/components/Table/hooks/plugins/useRowActions.js.map +1 -1
  125. package/dist/esm/components/Table/hooks/useTable.js +5 -1
  126. package/dist/esm/components/Table/hooks/useTable.js.map +1 -1
  127. package/dist/esm/components/Table/hooks/useTableKeyboardNavigation.js +18 -13
  128. package/dist/esm/components/Table/hooks/useTableKeyboardNavigation.js.map +1 -1
  129. package/dist/esm/components/Table/util/rowIndexPath.js.map +1 -1
  130. package/dist/esm/components/Tabs/Tabs.js +25 -27
  131. package/dist/esm/components/Tabs/Tabs.js.map +1 -1
  132. package/dist/esm/components/Textarea/Textarea.js +11 -9
  133. package/dist/esm/components/Textarea/Textarea.js.map +1 -1
  134. package/dist/esm/components/Toast/Toast.js +6 -1
  135. package/dist/esm/components/Toast/Toast.js.map +1 -1
  136. package/dist/esm/components/Toast/Toaster.js +88 -118
  137. package/dist/esm/components/Toast/Toaster.js.map +1 -1
  138. package/dist/esm/components/Toast/util.js.map +1 -1
  139. package/dist/esm/components/Tooltip/Tooltip.js +7 -8
  140. package/dist/esm/components/Tooltip/Tooltip.js.map +1 -1
  141. package/dist/esm/components/Tour/Tour.js +46 -53
  142. package/dist/esm/components/Tour/Tour.js.map +1 -1
  143. package/dist/esm/components/Treeview/Treeview.js +26 -36
  144. package/dist/esm/components/Treeview/Treeview.js.map +1 -1
  145. package/dist/esm/components/VisuallyHidden/VisuallyHidden.js +1 -1
  146. package/dist/esm/components/VisuallyHidden/VisuallyHidden.js.map +1 -1
  147. package/dist/esm/index.css +623 -635
  148. package/dist/esm/index.js +1 -1
  149. package/dist/esm/primitives/Button.js.map +1 -1
  150. package/dist/esm/utils/hooks/useListKeyboardNavigation.js +10 -11
  151. package/dist/esm/utils/hooks/useListKeyboardNavigation.js.map +1 -1
  152. package/dist/esm/utils/input.js +1 -1
  153. package/dist/esm/utils/input.js.map +1 -1
  154. package/dist/index.css +623 -635
  155. package/dist/primitives/Button.d.ts +2 -1
  156. package/dist/taco.cjs.development.js +709 -783
  157. package/dist/taco.cjs.development.js.map +1 -1
  158. package/dist/taco.cjs.production.min.js +1 -1
  159. package/dist/taco.cjs.production.min.js.map +1 -1
  160. package/dist/utils/hooks/useListKeyboardNavigation.d.ts +1 -1
  161. package/package.json +5 -6
  162. package/types.json +18 -4
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.js","sources":["../../../../src/components/Toast/Toast.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { motion, useAnimation } from 'framer-motion';\nimport useTimer from '../../utils/hooks/useTimer';\nimport { getBadgeIcon } from './util';\nimport { State } from '../../types';\nimport { useLocalization } from '../Provider/Provider';\nimport { IconButton } from '../IconButton/IconButton';\n\nexport type ToastsTexts = {\n /** Aria-label for the close icon button of toast */\n dismiss: string;\n};\n\nexport type ToastType = Omit<State, 'default'> | 'loading';\nexport type ToastOptions = {\n /** Provide time in milliseconds after which the toast should autoclose */\n autoClose?: number;\n /**\n * State will change the icon displayed in toast and other characteristics,\n * for e.g. `loading` state will display a progress animation.\n * Default value is `default`\n */\n type?: ToastType;\n};\nexport type ToastProps = {\n /** Provide a unique id for toast */\n id: string;\n /**\n * Content can be any valid react node, for e.g. a `div`, or a simple text.\n * Note that content can also be `null`, resulting in a slimmer version of your toast with a vertically centered title\n */\n content: React.ReactNode;\n /** Additional options to define your toast */\n options: ToastOptions;\n /**\n * Handler called when toast closes.\n * To read more about how to provide the text, see [Provider](component:provider) component\n */\n onClose: () => void;\n lastUpdated?: number;\n lastDuplicateId?: string;\n};\n\nexport const Toast = ({ content, lastUpdated, onClose: handleClose, options, ...props }: ToastProps): JSX.Element => {\n const { texts } = useLocalization();\n const { autoClose, type = 'default' } = options;\n const className = cn('bg-white relative flex items-center py-1 px-2 mt-3 w-full rounded yt-shadow', {\n 'border border-grey': type === 'default' || type === 'loading' || !type,\n 'border border-grey-darker': type === 'success',\n 'border border-blue': type === 'information',\n 'border border-yellow-dark': type === 'warning',\n 'border border-red': type === 'error',\n });\n const timer = useTimer(autoClose, handleClose);\n const controls = useAnimation();\n\n React.useEffect(() => {\n if (autoClose) {\n timer.start();\n }\n }, [autoClose]);\n\n const triggerUpdateAnimation = async () => {\n await controls.start({ scale: 1.05 });\n await controls.start({ scale: 1 });\n };\n\n React.useEffect(() => {\n if (lastUpdated) {\n triggerUpdateAnimation();\n\n if (timer.running) {\n timer.start();\n }\n }\n }, [lastUpdated]);\n\n return (\n <motion.div\n {...props}\n animate={controls}\n className={className}\n data-taco=\"toast\"\n onMouseEnter={timer.pause}\n onMouseLeave={timer.resume}\n >\n {getBadgeIcon(type)}\n {content && <div className=\"flex-grow\">{content}</div>}\n <IconButton\n appearance=\"discrete\"\n className=\"text-grey-darkest -mr-2 cursor-pointer !px-0\"\n icon=\"close\"\n aria-label={texts.toasts.dismiss}\n onClick={handleClose}\n />\n </motion.div>\n );\n};\n"],"names":["Toast","content","lastUpdated","onClose","handleClose","options","props","texts","useLocalization","autoClose","type","className","cn","timer","useTimer","controls","useAnimation","React","useEffect","start","triggerUpdateAnimation","scale","running","motion","div","animate","onMouseEnter","pause","onMouseLeave","resume","getBadgeIcon","IconButton","appearance","icon","toasts","dismiss","onClick"],"mappings":";;;;;;;;MA4CaA,KAAK,GAAG,CAAC;EAAEC,OAAF;EAAWC,WAAX;EAAwBC,OAAO,EAAEC,WAAjC;EAA8CC,OAA9C;EAAuD,GAAGC;AAA1D,CAAD;EACjB,MAAM;IAAEC;MAAUC,eAAe,EAAjC;EACA,MAAM;IAAEC,SAAF;IAAaC,IAAI,GAAG;MAAcL,OAAxC;EACA,MAAMM,SAAS,GAAGC,EAAE,CAAC,6EAAD,EAAgF;IAChG,sBAAsBF,IAAI,KAAK,SAAT,IAAsBA,IAAI,KAAK,SAA/B,IAA4C,CAACA,IAD6B;IAEhG,6BAA6BA,IAAI,KAAK,SAF0D;IAGhG,sBAAsBA,IAAI,KAAK,aAHiE;IAIhG,6BAA6BA,IAAI,KAAK,SAJ0D;IAKhG,qBAAqBA,IAAI,KAAK;GALd,CAApB;EAOA,MAAMG,KAAK,GAAGC,QAAQ,CAACL,SAAD,EAAYL,WAAZ,CAAtB;EACA,MAAMW,QAAQ,GAAGC,YAAY,EAA7B;EAEAC,cAAK,CAACC,SAAN,CAAgB;IACZ,IAAIT,SAAJ,EAAe;MACXI,KAAK,CAACM,KAAN;;GAFR,EAIG,CAACV,SAAD,CAJH;;EAMA,MAAMW,sBAAsB;IAAA;6BAClBL,QAAQ,CAACI,KAAT,CAAe;QAAEE,KAAK,EAAE;OAAxB;+BACAN,QAAQ,CAACI,KAAT,CAAe;UAAEE,KAAK,EAAE;SAAxB;;KAFkB;MAAA;;GAA5B;;EAKAJ,cAAK,CAACC,SAAN,CAAgB;IACZ,IAAIhB,WAAJ,EAAiB;MACbkB,sBAAsB;;MAEtB,IAAIP,KAAK,CAACS,OAAV,EAAmB;QACfT,KAAK,CAACM,KAAN;;;GALZ,EAQG,CAACjB,WAAD,CARH;EAUA,OACIe,4BAAA,CAACM,MAAM,CAACC,GAAR,oBACQlB;IACJmB,OAAO,EAAEV;IACTJ,SAAS,EAAEA;iBACD;IACVe,YAAY,EAAEb,KAAK,CAACc;IACpBC,YAAY,EAAEf,KAAK,CAACgB;IANxB,EAQKC,YAAY,CAACpB,IAAD,CARjB,EASKT,OAAO,IAAIgB,4BAAA,MAAA;IAAKN,SAAS,EAAC;GAAf,EAA4BV,OAA5B,CAThB,EAUIgB,4BAAA,CAACc,UAAD;IACIC,UAAU,EAAC;IACXrB,SAAS,EAAC;IACVsB,IAAI,EAAC;kBACO1B,KAAK,CAAC2B,MAAN,CAAaC;IACzBC,OAAO,EAAEhC;GALb,CAVJ,CADJ;AAoBH;;;;"}
1
+ {"version":3,"file":"Toast.js","sources":["../../../../src/components/Toast/Toast.tsx"],"sourcesContent":["import React from 'react';\r\nimport cn from 'classnames';\r\nimport { motion, useAnimation } from 'framer-motion';\r\nimport useTimer from '../../utils/hooks/useTimer';\r\nimport { getBadgeIcon } from './util';\r\nimport { State } from '../../types';\r\nimport { useLocalization } from '../Provider/Provider';\r\nimport { IconButton } from '../IconButton/IconButton';\r\n\r\nexport type ToastsTexts = {\r\n /** Aria-label for the close icon button of toast */\r\n dismiss: string;\r\n};\r\n\r\nexport type ToastType = Omit<State, 'default'> | 'loading';\r\nexport type ToastOptions = {\r\n /** Provide time in milliseconds after which the toast should autoclose */\r\n autoClose?: number;\r\n /**\r\n * State will change the icon displayed in toast and other characteristics,\r\n * for e.g. `loading` state will display a progress animation.\r\n * Default value is `default`\r\n */\r\n type?: ToastType;\r\n};\r\nexport type ToastContent = Omit<React.ReactNode, 'null' | 'undefined'>;\r\nexport type ToastProps = {\r\n /** Provide a unique id for toast */\r\n id: string;\r\n /**\r\n * Content can be any valid react node, for e.g. a `div`, or a simple text.\r\n */\r\n content: ToastContent;\r\n /** Additional options to define your toast */\r\n options: ToastOptions;\r\n /**\r\n * Handler called when toast closes.\r\n * To read more about how to provide the text, see [Provider](component:provider) component\r\n */\r\n onClose: () => void;\r\n lastUpdated?: number;\r\n lastDuplicateId?: string;\r\n};\r\n\r\nexport const Toast = ({ content, lastUpdated, onClose: handleClose, options, ...props }: ToastProps): JSX.Element => {\r\n const { texts } = useLocalization();\r\n const { autoClose, type = 'default' } = options;\r\n const className = cn('bg-white relative flex items-center py-1 px-2 mt-3 w-full rounded yt-shadow', {\r\n 'border border-grey': type === 'default' || type === 'loading' || !type,\r\n 'border border-grey-darker': type === 'success',\r\n 'border border-blue': type === 'information',\r\n 'border border-yellow-dark': type === 'warning',\r\n 'border border-red': type === 'error',\r\n });\r\n const timer = useTimer(autoClose, handleClose);\r\n const controls = useAnimation();\r\n\r\n if (!content) {\r\n console.warn(\r\n `Toast requires 'content' property, which can't be empty string, null or undefined. Current content value is set to ${\r\n content === '' ? 'empty string' : content\r\n }.`\r\n );\r\n }\r\n\r\n React.useEffect(() => {\r\n if (autoClose) {\r\n timer.start();\r\n }\r\n }, [autoClose]);\r\n\r\n const triggerUpdateAnimation = async () => {\r\n await controls.start({ scale: 1.05 });\r\n await controls.start({ scale: 1 });\r\n };\r\n\r\n React.useEffect(() => {\r\n if (lastUpdated) {\r\n triggerUpdateAnimation();\r\n\r\n if (timer.running) {\r\n timer.start();\r\n }\r\n }\r\n }, [lastUpdated]);\r\n\r\n return (\r\n <motion.div\r\n {...props}\r\n animate={controls}\r\n className={className}\r\n data-taco=\"toast\"\r\n onMouseEnter={timer.pause}\r\n onMouseLeave={timer.resume}>\r\n {getBadgeIcon(type)}\r\n <div className=\"flex-grow\">{content}</div>\r\n <IconButton\r\n appearance=\"discrete\"\r\n className=\"text-grey-darkest -mr-2 cursor-pointer !px-0\"\r\n icon=\"close\"\r\n aria-label={texts.toasts.dismiss}\r\n onClick={handleClose}\r\n />\r\n </motion.div>\r\n );\r\n};\r\n"],"names":["Toast","content","lastUpdated","onClose","handleClose","options","props","texts","useLocalization","autoClose","type","className","cn","timer","useTimer","controls","useAnimation","console","warn","React","useEffect","start","triggerUpdateAnimation","scale","running","motion","div","animate","onMouseEnter","pause","onMouseLeave","resume","getBadgeIcon","IconButton","appearance","icon","toasts","dismiss","onClick"],"mappings":";;;;;;;;MA4CaA,KAAK,GAAG,CAAC;EAAEC,OAAF;EAAWC,WAAX;EAAwBC,OAAO,EAAEC,WAAjC;EAA8CC,OAA9C;EAAuD,GAAGC;AAA1D,CAAD;EACjB,MAAM;IAAEC;MAAUC,eAAe,EAAjC;EACA,MAAM;IAAEC,SAAF;IAAaC,IAAI,GAAG;MAAcL,OAAxC;EACA,MAAMM,SAAS,GAAGC,EAAE,CAAC,6EAAD,EAAgF;IAChG,sBAAsBF,IAAI,KAAK,SAAT,IAAsBA,IAAI,KAAK,SAA/B,IAA4C,CAACA,IAD6B;IAEhG,6BAA6BA,IAAI,KAAK,SAF0D;IAGhG,sBAAsBA,IAAI,KAAK,aAHiE;IAIhG,6BAA6BA,IAAI,KAAK,SAJ0D;IAKhG,qBAAqBA,IAAI,KAAK;GALd,CAApB;EAOA,MAAMG,KAAK,GAAGC,QAAQ,CAACL,SAAD,EAAYL,WAAZ,CAAtB;EACA,MAAMW,QAAQ,GAAGC,YAAY,EAA7B;;EAEA,IAAI,CAACf,OAAL,EAAc;IACVgB,OAAO,CAACC,IAAR,uHAEQjB,OAAO,KAAK,EAAZ,GAAiB,cAAjB,GAAkCA,UAF1C;;;EAOJkB,cAAK,CAACC,SAAN,CAAgB;IACZ,IAAIX,SAAJ,EAAe;MACXI,KAAK,CAACQ,KAAN;;GAFR,EAIG,CAACZ,SAAD,CAJH;;EAMA,MAAMa,sBAAsB;IAAA;6BAClBP,QAAQ,CAACM,KAAT,CAAe;QAAEE,KAAK,EAAE;OAAxB;+BACAR,QAAQ,CAACM,KAAT,CAAe;UAAEE,KAAK,EAAE;SAAxB;;KAFkB;MAAA;;GAA5B;;EAKAJ,cAAK,CAACC,SAAN,CAAgB;IACZ,IAAIlB,WAAJ,EAAiB;MACboB,sBAAsB;;MAEtB,IAAIT,KAAK,CAACW,OAAV,EAAmB;QACfX,KAAK,CAACQ,KAAN;;;GALZ,EAQG,CAACnB,WAAD,CARH;EAUA,OACIiB,4BAAA,CAACM,MAAM,CAACC,GAAR,oBACQpB;IACJqB,OAAO,EAAEZ;IACTJ,SAAS,EAAEA;iBACD;IACViB,YAAY,EAAEf,KAAK,CAACgB;IACpBC,YAAY,EAAEjB,KAAK,CAACkB;IANxB,EAOKC,YAAY,CAACtB,IAAD,CAPjB,EAQIS,4BAAA,MAAA;IAAKR,SAAS,EAAC;GAAf,EAA4BV,OAA5B,CARJ,EASIkB,4BAAA,CAACc,UAAD;IACIC,UAAU,EAAC;IACXvB,SAAS,EAAC;IACVwB,IAAI,EAAC;kBACO5B,KAAK,CAAC6B,MAAN,CAAaC;IACzBC,OAAO,EAAElC;GALb,CATJ,CADJ;AAmBH;;;;"}
@@ -1,65 +1,51 @@
1
- import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
1
  import { useState, useCallback, useEffect, createElement, useContext, createContext } from 'react';
3
2
  import { v4 } from 'uuid';
4
3
  import { AnimatePresence, motion } from 'framer-motion';
5
4
  import { Toast } from './Toast.js';
6
5
 
7
- var _excluded = ["children"];
8
- var DEFAULT_AUTO_CLOSE_TIMEOUT = 7500;
9
- var ToastContext = /*#__PURE__*/createContext({});
6
+ const DEFAULT_AUTO_CLOSE_TIMEOUT = 7500;
7
+ const ToastContext = /*#__PURE__*/createContext({});
10
8
 
11
- var insertToastWithoutDuplicates = function insertToastWithoutDuplicates(currentToasts, id, content, options, close) {
12
- var nextToasts = [].concat(currentToasts);
13
- var existingToastIndex = currentToasts.findIndex(function (toast) {
14
- return JSON.stringify(toast.content) === JSON.stringify(content);
15
- });
9
+ const insertToastWithoutDuplicates = (currentToasts, id, content, options, close) => {
10
+ const nextToasts = [...currentToasts];
11
+ const existingToastIndex = currentToasts.findIndex(toast => JSON.stringify(toast.content) === JSON.stringify(content));
16
12
 
17
13
  if (existingToastIndex > -1) {
18
14
  nextToasts[existingToastIndex].lastDuplicateId = id;
19
15
  nextToasts[existingToastIndex].lastUpdated = Date.now();
20
16
  } else {
21
17
  nextToasts.push({
22
- id: id,
18
+ id,
23
19
  content: typeof content === 'function' ? content(close) : content,
24
- options: options
20
+ options
25
21
  });
26
22
  }
27
23
 
28
24
  return nextToasts;
29
25
  };
30
26
 
31
- var ToastProvider = function ToastProvider(_ref) {
32
- var children = _ref.children,
33
- props = _objectWithoutPropertiesLoose(_ref, _excluded);
27
+ const ToastProvider = ({
28
+ children,
29
+ ...props
30
+ }) => {
31
+ const [toasts, setToasts] = useState([]);
34
32
 
35
- var _React$useState = useState([]),
36
- toasts = _React$useState[0],
37
- setToasts = _React$useState[1];
38
-
39
- var handleClose = function handleClose(id) {
40
- setToasts(function (currentToasts) {
41
- return currentToasts.filter(function (toast) {
42
- return toast.id !== id;
43
- });
44
- });
33
+ const handleClose = id => {
34
+ setToasts(currentToasts => currentToasts.filter(toast => toast.id !== id));
45
35
  }; // memoize (useCallback) this function,
46
36
  // it is the value of the context provider and we don't want it to trigger state tree re-renders on provider children
47
37
 
48
38
 
49
- var toaster = useCallback(function (content, options) {
50
- var id = v4();
39
+ const toaster = useCallback((content, options) => {
40
+ const id = v4();
51
41
 
52
- var close = function close() {
53
- return handleClose(id);
54
- };
42
+ const close = () => handleClose(id);
55
43
 
56
- setToasts(function (currentToasts) {
57
- return insertToastWithoutDuplicates(currentToasts, id, content, options, close);
58
- });
44
+ setToasts(currentToasts => insertToastWithoutDuplicates(currentToasts, id, content, options, close));
59
45
 
60
- var update = function update(content, options) {
61
- setToasts(function (currentToasts) {
62
- var nextToasts = currentToasts.filter(function (toast) {
46
+ const update = (content, options) => {
47
+ setToasts(currentToasts => {
48
+ const nextToasts = currentToasts.filter(toast => {
63
49
  if (toast.lastDuplicateId) {
64
50
  return toast.lastDuplicateId !== id;
65
51
  }
@@ -70,80 +56,70 @@ var ToastProvider = function ToastProvider(_ref) {
70
56
  });
71
57
  };
72
58
 
73
- var success = function success(content, options) {
74
- update(content, _extends({
75
- autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT
76
- }, options, {
59
+ const success = (content, options) => {
60
+ update(content, {
61
+ autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT,
62
+ ...options,
77
63
  type: 'success'
78
- }));
64
+ });
79
65
  };
80
66
 
81
- var error = function error(content, options) {
82
- update(content, _extends({}, options, {
67
+ const error = (content, options) => {
68
+ update(content, { ...options,
83
69
  type: 'error'
84
- }));
70
+ });
85
71
  };
86
72
 
87
- var warning = function warning(content, options) {
88
- update(content, _extends({}, options, {
73
+ const warning = (content, options) => {
74
+ update(content, { ...options,
89
75
  type: 'warning'
90
- }));
76
+ });
91
77
  };
92
78
 
93
- var information = function information(content, options) {
94
- update(content, _extends({}, options, {
79
+ const information = (content, options) => {
80
+ update(content, { ...options,
95
81
  type: 'information'
96
- }));
82
+ });
97
83
  };
98
84
 
99
- var loading = function loading(content, options) {
100
- update(content, _extends({}, options, {
85
+ const loading = (content, options) => {
86
+ update(content, { ...options,
101
87
  type: 'loading'
102
- }));
88
+ });
103
89
  };
104
90
 
105
91
  return {
106
- success: success,
107
- error: error,
108
- warning: warning,
109
- information: information,
110
- loading: loading,
111
- close: close
92
+ success,
93
+ error,
94
+ warning,
95
+ information,
96
+ loading,
97
+ close
112
98
  };
113
99
  }, []); // no need to rebind these every render, do them once in an effect
114
100
 
115
- useEffect(function () {
116
- toaster.success = function (content, options) {
117
- return toaster(content, _extends({
118
- autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT
119
- }, options, {
120
- type: 'success'
121
- }));
122
- };
101
+ useEffect(() => {
102
+ toaster.success = (content, options) => toaster(content, {
103
+ autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT,
104
+ ...options,
105
+ type: 'success'
106
+ });
123
107
 
124
- toaster.error = function (content, options) {
125
- return toaster(content, _extends({}, options, {
126
- type: 'error'
127
- }));
128
- };
108
+ toaster.error = (content, options) => toaster(content, { ...options,
109
+ type: 'error'
110
+ });
129
111
 
130
- toaster.warning = function (content, options) {
131
- return toaster(content, _extends({}, options, {
132
- type: 'warning'
133
- }));
134
- };
112
+ toaster.warning = (content, options) => toaster(content, { ...options,
113
+ type: 'warning'
114
+ });
135
115
 
136
- toaster.information = function (content, options) {
137
- return toaster(content, _extends({}, options, {
138
- type: 'information'
139
- }));
140
- };
116
+ toaster.information = (content, options) => toaster(content, { ...options,
117
+ type: 'information'
118
+ });
141
119
 
142
- toaster.loading = function (content, options) {
143
- return toaster(content, _extends({}, options, {
144
- type: 'loading'
145
- }));
146
- };
120
+ toaster.loading = (content, options) => toaster(content, { ...options,
121
+ type: 'loading'
122
+ });
147
123
  }, []);
148
124
  return createElement(ToastContext.Provider, Object.assign({}, props, {
149
125
  value: toaster
@@ -153,41 +129,35 @@ var ToastProvider = function ToastProvider(_ref) {
153
129
  role: "log"
154
130
  }, createElement(AnimatePresence, {
155
131
  initial: false
156
- }, toasts.map(function (toast) {
157
- return createElement(motion.div, {
158
- key: toast.id,
132
+ }, toasts.map(toast => createElement(motion.div, {
133
+ key: toast.id,
134
+ transition: {
135
+ type: 'spring',
136
+ damping: 20,
137
+ stiffness: 300
138
+ },
139
+ initial: {
140
+ opacity: 0,
141
+ y: 10,
142
+ scale: 0.5
143
+ },
144
+ animate: {
145
+ opacity: 1,
146
+ y: 0,
147
+ scale: 1
148
+ },
149
+ exit: {
150
+ opacity: 0,
151
+ scale: 0.5,
159
152
  transition: {
160
- type: 'spring',
161
- damping: 20,
162
- stiffness: 300
163
- },
164
- initial: {
165
- opacity: 0,
166
- y: 10,
167
- scale: 0.5
168
- },
169
- animate: {
170
- opacity: 1,
171
- y: 0,
172
- scale: 1
173
- },
174
- exit: {
175
- opacity: 0,
176
- scale: 0.5,
177
- transition: {
178
- duration: 0.2
179
- }
180
- }
181
- }, createElement(Toast, Object.assign({}, toast, {
182
- onClose: function onClose() {
183
- return handleClose(toast.id);
153
+ duration: 0.2
184
154
  }
185
- })));
186
- }))));
187
- };
188
- var useToast = function useToast() {
189
- return useContext(ToastContext);
155
+ }
156
+ }, createElement(Toast, Object.assign({}, toast, {
157
+ onClose: () => handleClose(toast.id)
158
+ })))))));
190
159
  };
160
+ const useToast = () => useContext(ToastContext);
191
161
 
192
162
  export { ToastProvider, useToast };
193
163
  //# sourceMappingURL=Toaster.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Toaster.js","sources":["../../../../src/components/Toast/Toaster.tsx"],"sourcesContent":["import * as React from 'react';\nimport { v4 as uuid } from 'uuid';\nimport { AnimatePresence, motion } from 'framer-motion';\nimport { ToastOptions, Toast, ToastProps } from './Toast';\nimport './Toast.css';\n\nconst DEFAULT_AUTO_CLOSE_TIMEOUT = 7500;\n\ntype ToastCreator<T> = (content: React.ReactNode | ((close: () => void) => React.ReactNode), options?: ToastOptions) => T;\n\nexport interface Toaster<T> extends ToastCreator<T> {\n success: ToastCreator<T>;\n error: ToastCreator<T>;\n warning: ToastCreator<T>;\n information: ToastCreator<T>;\n loading: ToastCreator<T>;\n}\n\nexport interface ToastReference {\n /** Show a success toast */\n success: ToastCreator<void>;\n /** Show an error toast */\n error: ToastCreator<void>;\n /** Show a warning toast */\n warning: ToastCreator<void>;\n /** Show an information toast */\n information: ToastCreator<void>;\n /** Show a loading toast */\n loading: ToastCreator<void>;\n /**\n * Close an existing toast.\n * The toast function returns a reference to the active toast,\n * allowing you to programmatically close it when needed\n */\n close: () => void;\n}\n\nconst ToastContext = React.createContext<Toaster<ToastReference>>({} as Toaster<ToastReference>);\n\nexport interface ToastProviderProps {\n children: React.ReactNode;\n}\n\ntype InternalToast = Omit<ToastProps, 'onClose'>;\n\nconst insertToastWithoutDuplicates = (\n currentToasts: InternalToast[],\n id: string,\n content: React.ReactNode,\n options: ToastOptions,\n close: () => void\n): InternalToast[] => {\n const nextToasts = [...currentToasts];\n const existingToastIndex = currentToasts.findIndex(toast => JSON.stringify(toast.content) === JSON.stringify(content));\n\n if (existingToastIndex > -1) {\n nextToasts[existingToastIndex].lastDuplicateId = id;\n nextToasts[existingToastIndex].lastUpdated = Date.now();\n } else {\n nextToasts.push({\n id,\n content: typeof content === 'function' ? content(close) : content,\n options,\n });\n }\n\n return nextToasts;\n};\n\nexport const ToastProvider = ({ children, ...props }: ToastProviderProps): JSX.Element => {\n const [toasts, setToasts] = React.useState<InternalToast[]>([]);\n\n const handleClose = (id: string): void => {\n setToasts(currentToasts => currentToasts.filter(toast => toast.id !== id));\n };\n\n // memoize (useCallback) this function,\n // it is the value of the context provider and we don't want it to trigger state tree re-renders on provider children\n const toaster = React.useCallback((content: React.ReactNode, options: ToastOptions): ToastReference => {\n const id = uuid();\n const close = (): void => handleClose(id);\n\n setToasts(currentToasts => insertToastWithoutDuplicates(currentToasts, id, content, options, close));\n\n const update = (content: React.ReactNode, options: ToastOptions): void => {\n setToasts(currentToasts => {\n const nextToasts = currentToasts.filter(toast => {\n if (toast.lastDuplicateId) {\n return toast.lastDuplicateId !== id;\n }\n\n return toast.id !== id;\n });\n return insertToastWithoutDuplicates(nextToasts, uuid(), content, options, close);\n });\n };\n\n const success = (content: React.ReactNode, options?: Omit<ToastOptions, 'type'>): void => {\n update(content, { autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT, ...options, type: 'success' });\n };\n const error = (content: React.ReactNode, options?: Omit<ToastOptions, 'type'>): void => {\n update(content, { ...options, type: 'error' });\n };\n const warning = (content: React.ReactNode, options?: Omit<ToastOptions, 'type'>): void => {\n update(content, { ...options, type: 'warning' });\n };\n const information = (content: React.ReactNode, options?: Omit<ToastOptions, 'type'>): void => {\n update(content, { ...options, type: 'information' });\n };\n const loading = (content: React.ReactNode, options?: Omit<ToastOptions, 'type'>): void => {\n update(content, { ...options, type: 'loading' });\n };\n\n return {\n success,\n error,\n warning,\n information,\n loading,\n close,\n };\n }, []) as Toaster<ToastReference>;\n\n // no need to rebind these every render, do them once in an effect\n React.useEffect(() => {\n toaster.success = (content: React.ReactNode, options?: Omit<ToastOptions, 'type'>): ToastReference =>\n toaster(content, { autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT, ...options, type: 'success' });\n toaster.error = (content: React.ReactNode, options?: Omit<ToastOptions, 'type'>): ToastReference =>\n toaster(content, { ...options, type: 'error' });\n toaster.warning = (content: React.ReactNode, options?: Omit<ToastOptions, 'type'>): ToastReference =>\n toaster(content, { ...options, type: 'warning' });\n toaster.information = (content: React.ReactNode, options?: Omit<ToastOptions, 'type'>): ToastReference =>\n toaster(content, { ...options, type: 'information' });\n toaster.loading = (content: React.ReactNode, options?: Omit<ToastOptions, 'type'>): ToastReference =>\n toaster(content, { ...options, type: 'loading' });\n }, []);\n\n return (\n <ToastContext.Provider {...props} value={toaster}>\n {children}\n <div\n id=\"yt-toast__container\"\n className=\"pointer-events-all absolute bottom-0 right-0 !left-auto z-[1000] mb-4 mr-4 flex max-w-md flex-col items-end justify-end\"\n role=\"log\"\n >\n <AnimatePresence initial={false}>\n {toasts.map((toast: ToastProps) => (\n <motion.div\n key={toast.id}\n transition={{\n type: 'spring',\n damping: 20,\n stiffness: 300,\n }}\n initial={{ opacity: 0, y: 10, scale: 0.5 }}\n animate={{ opacity: 1, y: 0, scale: 1 }}\n exit={{ opacity: 0, scale: 0.5, transition: { duration: 0.2 } }}\n >\n <Toast {...toast} onClose={() => handleClose(toast.id)} />\n </motion.div>\n ))}\n </AnimatePresence>\n </div>\n </ToastContext.Provider>\n );\n};\n\nexport const useToast = (): Toaster<ToastReference> => React.useContext(ToastContext);\n"],"names":["DEFAULT_AUTO_CLOSE_TIMEOUT","ToastContext","React","insertToastWithoutDuplicates","currentToasts","id","content","options","close","nextToasts","existingToastIndex","findIndex","toast","JSON","stringify","lastDuplicateId","lastUpdated","Date","now","push","ToastProvider","children","props","toasts","setToasts","handleClose","filter","toaster","uuid","update","success","autoClose","type","error","warning","information","loading","Provider","value","className","role","AnimatePresence","initial","map","motion","div","key","transition","damping","stiffness","opacity","y","scale","animate","exit","duration","Toast","onClose","useToast"],"mappings":"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"}
1
+ {"version":3,"file":"Toaster.js","sources":["../../../../src/components/Toast/Toaster.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { v4 as uuid } from 'uuid';\r\nimport { AnimatePresence, motion } from 'framer-motion';\r\nimport { ToastOptions, Toast, ToastProps, ToastContent } from './Toast';\r\nimport './Toast.css';\r\n\r\nconst DEFAULT_AUTO_CLOSE_TIMEOUT = 7500;\r\n\r\ntype ToastCreator<T> = (content: ToastContent | ((close: () => void) => ToastContent), options?: ToastOptions) => T;\r\n\r\nexport interface Toaster<T> extends ToastCreator<T> {\r\n success: ToastCreator<T>;\r\n error: ToastCreator<T>;\r\n warning: ToastCreator<T>;\r\n information: ToastCreator<T>;\r\n loading: ToastCreator<T>;\r\n}\r\n\r\nexport interface ToastReference {\r\n /** Show a success toast */\r\n success: ToastCreator<void>;\r\n /** Show an error toast */\r\n error: ToastCreator<void>;\r\n /** Show a warning toast */\r\n warning: ToastCreator<void>;\r\n /** Show an information toast */\r\n information: ToastCreator<void>;\r\n /** Show a loading toast */\r\n loading: ToastCreator<void>;\r\n /**\r\n * Close an existing toast.\r\n * The toast function returns a reference to the active toast,\r\n * allowing you to programmatically close it when needed\r\n */\r\n close: () => void;\r\n}\r\n\r\nconst ToastContext = React.createContext<Toaster<ToastReference>>({} as Toaster<ToastReference>);\r\n\r\nexport interface ToastProviderProps {\r\n children: React.ReactNode;\r\n}\r\n\r\ntype InternalToast = Omit<ToastProps, 'onClose'>;\r\n\r\nconst insertToastWithoutDuplicates = (\r\n currentToasts: InternalToast[],\r\n id: string,\r\n content: ToastContent,\r\n options: ToastOptions,\r\n close: () => void\r\n): InternalToast[] => {\r\n const nextToasts = [...currentToasts];\r\n const existingToastIndex = currentToasts.findIndex(toast => JSON.stringify(toast.content) === JSON.stringify(content));\r\n\r\n if (existingToastIndex > -1) {\r\n nextToasts[existingToastIndex].lastDuplicateId = id;\r\n nextToasts[existingToastIndex].lastUpdated = Date.now();\r\n } else {\r\n nextToasts.push({\r\n id,\r\n content: typeof content === 'function' ? content(close) : content,\r\n options,\r\n });\r\n }\r\n\r\n return nextToasts;\r\n};\r\n\r\nexport const ToastProvider = ({ children, ...props }: ToastProviderProps): JSX.Element => {\r\n const [toasts, setToasts] = React.useState<InternalToast[]>([]);\r\n\r\n const handleClose = (id: string): void => {\r\n setToasts(currentToasts => currentToasts.filter(toast => toast.id !== id));\r\n };\r\n\r\n // memoize (useCallback) this function,\r\n // it is the value of the context provider and we don't want it to trigger state tree re-renders on provider children\r\n const toaster = React.useCallback((content: ToastContent, options: ToastOptions): ToastReference => {\r\n const id = uuid();\r\n const close = (): void => handleClose(id);\r\n\r\n setToasts(currentToasts => insertToastWithoutDuplicates(currentToasts, id, content, options, close));\r\n\r\n const update = (content: ToastContent, options: ToastOptions): void => {\r\n setToasts(currentToasts => {\r\n const nextToasts = currentToasts.filter(toast => {\r\n if (toast.lastDuplicateId) {\r\n return toast.lastDuplicateId !== id;\r\n }\r\n\r\n return toast.id !== id;\r\n });\r\n return insertToastWithoutDuplicates(nextToasts, uuid(), content, options, close);\r\n });\r\n };\r\n\r\n const success = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): void => {\r\n update(content, { autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT, ...options, type: 'success' });\r\n };\r\n const error = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): void => {\r\n update(content, { ...options, type: 'error' });\r\n };\r\n const warning = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): void => {\r\n update(content, { ...options, type: 'warning' });\r\n };\r\n const information = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): void => {\r\n update(content, { ...options, type: 'information' });\r\n };\r\n const loading = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): void => {\r\n update(content, { ...options, type: 'loading' });\r\n };\r\n\r\n return {\r\n success,\r\n error,\r\n warning,\r\n information,\r\n loading,\r\n close,\r\n };\r\n }, []) as Toaster<ToastReference>;\r\n\r\n // no need to rebind these every render, do them once in an effect\r\n React.useEffect(() => {\r\n toaster.success = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): ToastReference =>\r\n toaster(content, { autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT, ...options, type: 'success' });\r\n toaster.error = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): ToastReference =>\r\n toaster(content, { ...options, type: 'error' });\r\n toaster.warning = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): ToastReference =>\r\n toaster(content, { ...options, type: 'warning' });\r\n toaster.information = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): ToastReference =>\r\n toaster(content, { ...options, type: 'information' });\r\n toaster.loading = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): ToastReference =>\r\n toaster(content, { ...options, type: 'loading' });\r\n }, []);\r\n\r\n return (\r\n <ToastContext.Provider {...props} value={toaster}>\r\n {children}\r\n <div\r\n id=\"yt-toast__container\"\r\n className=\"pointer-events-all absolute bottom-0 right-0 !left-auto z-[1000] mb-4 mr-4 flex max-w-md flex-col items-end justify-end\"\r\n role=\"log\">\r\n <AnimatePresence initial={false}>\r\n {toasts.map((toast: InternalToast) => (\r\n <motion.div\r\n key={toast.id}\r\n transition={{\r\n type: 'spring',\r\n damping: 20,\r\n stiffness: 300,\r\n }}\r\n initial={{ opacity: 0, y: 10, scale: 0.5 }}\r\n animate={{ opacity: 1, y: 0, scale: 1 }}\r\n exit={{ opacity: 0, scale: 0.5, transition: { duration: 0.2 } }}>\r\n <Toast {...toast} onClose={() => handleClose(toast.id)} />\r\n </motion.div>\r\n ))}\r\n </AnimatePresence>\r\n </div>\r\n </ToastContext.Provider>\r\n );\r\n};\r\n\r\nexport const useToast = (): Toaster<ToastReference> => React.useContext(ToastContext);\r\n"],"names":["DEFAULT_AUTO_CLOSE_TIMEOUT","ToastContext","React","insertToastWithoutDuplicates","currentToasts","id","content","options","close","nextToasts","existingToastIndex","findIndex","toast","JSON","stringify","lastDuplicateId","lastUpdated","Date","now","push","ToastProvider","children","props","toasts","setToasts","handleClose","filter","toaster","uuid","update","success","autoClose","type","error","warning","information","loading","Provider","value","className","role","AnimatePresence","initial","map","motion","div","key","transition","damping","stiffness","opacity","y","scale","animate","exit","duration","Toast","onClose","useToast"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"util.js","sources":["../../../../src/components/Toast/util.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Icon } from '../Icon/Icon';\nimport { Spinner } from '../Spinner/Spinner';\nimport { ToastType } from './Toast';\n\nexport const getBadgeIcon = (type: ToastType): JSX.Element | null => {\n const css = 'rounded-full flex-shrink-0 mr-2';\n\n switch (type) {\n case 'success':\n return <Icon name=\"tick\" className={cn(css, 'yt-green-solid')} />;\n\n case 'warning':\n return <Icon name=\"warning\" className={cn(css, 'yt-yellow-solid')} />;\n\n case 'error':\n return <Icon name=\"warning\" className={cn(css, 'yt-red-solid')} />;\n\n case 'information':\n return <Icon name=\"info\" className={cn(css, 'yt-blue-solid')} />;\n\n case 'loading':\n return <Spinner delay={0} className={cn(css, 'h-6 w-6')} />;\n\n default:\n return null;\n }\n};\n"],"names":["getBadgeIcon","type","css","React","Icon","name","className","cn","Spinner","delay"],"mappings":";;;;;MAMaA,YAAY,GAAIC,IAAD;EACxB,MAAMC,GAAG,GAAG,iCAAZ;;EAEA,QAAQD,IAAR;IACI,KAAK,SAAL;MACI,OAAOE,4BAAA,CAACC,IAAD;QAAMC,IAAI,EAAC;QAAOC,SAAS,EAAEC,EAAE,CAACL,GAAD,EAAM,gBAAN;OAA/B,CAAP;;IAEJ,KAAK,SAAL;MACI,OAAOC,4BAAA,CAACC,IAAD;QAAMC,IAAI,EAAC;QAAUC,SAAS,EAAEC,EAAE,CAACL,GAAD,EAAM,iBAAN;OAAlC,CAAP;;IAEJ,KAAK,OAAL;MACI,OAAOC,4BAAA,CAACC,IAAD;QAAMC,IAAI,EAAC;QAAUC,SAAS,EAAEC,EAAE,CAACL,GAAD,EAAM,cAAN;OAAlC,CAAP;;IAEJ,KAAK,aAAL;MACI,OAAOC,4BAAA,CAACC,IAAD;QAAMC,IAAI,EAAC;QAAOC,SAAS,EAAEC,EAAE,CAACL,GAAD,EAAM,eAAN;OAA/B,CAAP;;IAEJ,KAAK,SAAL;MACI,OAAOC,4BAAA,CAACK,OAAD;QAASC,KAAK,EAAE;QAAGH,SAAS,EAAEC,EAAE,CAACL,GAAD,EAAM,SAAN;OAAhC,CAAP;;IAEJ;MACI,OAAO,IAAP;;AAEX;;;;"}
1
+ {"version":3,"file":"util.js","sources":["../../../../src/components/Toast/util.tsx"],"sourcesContent":["import React from 'react';\r\nimport cn from 'classnames';\r\nimport { Icon } from '../Icon/Icon';\r\nimport { Spinner } from '../Spinner/Spinner';\r\nimport { ToastType } from './Toast';\r\n\r\nexport const getBadgeIcon = (type: ToastType): JSX.Element | null => {\r\n const css = 'rounded-full flex-shrink-0 mr-2';\r\n\r\n switch (type) {\r\n case 'success':\r\n return <Icon name=\"tick\" className={cn(css, 'yt-green-solid')} />;\r\n\r\n case 'warning':\r\n return <Icon name=\"warning\" className={cn(css, 'yt-yellow-solid')} />;\r\n\r\n case 'error':\r\n return <Icon name=\"warning\" className={cn(css, 'yt-red-solid')} />;\r\n\r\n case 'information':\r\n return <Icon name=\"info\" className={cn(css, 'yt-blue-solid')} />;\r\n\r\n case 'loading':\r\n return <Spinner delay={0} className={cn(css, 'h-6 w-6')} />;\r\n\r\n default:\r\n return null;\r\n }\r\n};\r\n"],"names":["getBadgeIcon","type","css","React","Icon","name","className","cn","Spinner","delay"],"mappings":";;;;;MAMaA,YAAY,GAAIC,IAAD;EACxB,MAAMC,GAAG,GAAG,iCAAZ;;EAEA,QAAQD,IAAR;IACI,KAAK,SAAL;MACI,OAAOE,4BAAA,CAACC,IAAD;QAAMC,IAAI,EAAC;QAAOC,SAAS,EAAEC,EAAE,CAACL,GAAD,EAAM,gBAAN;OAA/B,CAAP;;IAEJ,KAAK,SAAL;MACI,OAAOC,4BAAA,CAACC,IAAD;QAAMC,IAAI,EAAC;QAAUC,SAAS,EAAEC,EAAE,CAACL,GAAD,EAAM,iBAAN;OAAlC,CAAP;;IAEJ,KAAK,OAAL;MACI,OAAOC,4BAAA,CAACC,IAAD;QAAMC,IAAI,EAAC;QAAUC,SAAS,EAAEC,EAAE,CAACL,GAAD,EAAM,cAAN;OAAlC,CAAP;;IAEJ,KAAK,aAAL;MACI,OAAOC,4BAAA,CAACC,IAAD;QAAMC,IAAI,EAAC;QAAOC,SAAS,EAAEC,EAAE,CAACL,GAAD,EAAM,eAAN;OAA/B,CAAP;;IAEJ,KAAK,SAAL;MACI,OAAOC,4BAAA,CAACK,OAAD;QAASC,KAAK,EAAE;QAAGH,SAAS,EAAEC,EAAE,CAACL,GAAD,EAAM,SAAN;OAAhC,CAAP;;IAEJ;MACI,OAAO,IAAP;;AAEX;;;;"}
@@ -1,14 +1,13 @@
1
- import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
1
  import { forwardRef, createElement } from 'react';
3
2
  import { Root, Trigger, Content, Arrow } from '@radix-ui/react-tooltip';
4
3
 
5
- var _excluded = ["title", "children", "placement"];
6
- var Tooltip = /*#__PURE__*/forwardRef(function Tooltip(props, ref) {
7
- var title = props.title,
8
- children = props.children,
9
- placement = props.placement,
10
- otherProps = _objectWithoutPropertiesLoose(props, _excluded);
11
-
4
+ const Tooltip = /*#__PURE__*/forwardRef(function Tooltip(props, ref) {
5
+ const {
6
+ title,
7
+ children,
8
+ placement,
9
+ ...otherProps
10
+ } = props;
12
11
  return createElement(Root, {
13
12
  delayDuration: 50
14
13
  }, createElement(Trigger, {
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.js","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as TooltipPrimitive from '@radix-ui/react-tooltip';\n\nexport type TooltipProps = React.HTMLAttributes<HTMLDivElement> & {\n /** The element which activates the tooltip when hovered. Should be a single React/HTML element */\n children: React.ReactElement | any;\n /** Text displayed in the tooltip */\n title: string;\n /**\n * Placement of the tooltip relative to the reference element. Placement will be reversed if a collision occurs\n * @defaultValue bottom\n */\n placement?: 'top' | 'right' | 'bottom' | 'left';\n};\n\nexport const Tooltip = React.forwardRef(function Tooltip(props: TooltipProps, ref: React.Ref<HTMLElement>) {\n const { title, children, placement, ...otherProps } = props;\n\n return (\n <TooltipPrimitive.Root delayDuration={50}>\n <TooltipPrimitive.Trigger asChild ref={ref as any}>\n {children}\n </TooltipPrimitive.Trigger>\n <TooltipPrimitive.Content {...otherProps} asChild side={placement} sideOffset={3}>\n <div\n className=\"wcag-purple max-w-[theme(spacing.56)] animate-[fade-in_150ms] rounded-sm px-2 py-1 text-xs font-bold opacity-90\"\n data-taco=\"tooltip\"\n style={{\n transformOrigin: 'var(--radix-tooltip-content-transform-origin)',\n }}\n >\n <TooltipPrimitive.Arrow className=\"fill-purple stroke-purple\" />\n {title}\n </div>\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Root>\n );\n});\n"],"names":["Tooltip","React","props","ref","title","children","placement","otherProps","TooltipPrimitive","delayDuration","asChild","side","sideOffset","className","style","transformOrigin"],"mappings":";;;;;IAeaA,OAAO,gBAAGC,UAAA,CAAiB,SAASD,OAAT,CAAiBE,KAAjB,EAAsCC,GAAtC;EACpC,IAAQC,KAAR,GAAsDF,KAAtD,CAAQE,KAAR;MAAeC,QAAf,GAAsDH,KAAtD,CAAeG,QAAf;MAAyBC,SAAzB,GAAsDJ,KAAtD,CAAyBI,SAAzB;MAAuCC,UAAvC,iCAAsDL,KAAtD;;EAEA,OACID,aAAA,CAACO,IAAD;IAAuBC,aAAa,EAAE;GAAtC,EACIR,aAAA,CAACO,OAAD;IAA0BE,OAAO;IAACP,GAAG,EAAEA;GAAvC,EACKE,QADL,CADJ,EAIIJ,aAAA,CAACO,OAAD,oBAA8BD;IAAYG,OAAO;IAACC,IAAI,EAAEL;IAAWM,UAAU,EAAE;IAA/E,EACIX,aAAA,MAAA;IACIY,SAAS,EAAC;iBACA;IACVC,KAAK,EAAE;MACHC,eAAe,EAAE;;GAJzB,EAOId,aAAA,CAACO,KAAD;IAAwBK,SAAS,EAAC;GAAlC,CAPJ,EAQKT,KARL,CADJ,CAJJ,CADJ;AAmBH,CAtBsB;;;;"}
1
+ {"version":3,"file":"Tooltip.js","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as TooltipPrimitive from '@radix-ui/react-tooltip';\n\nexport type TooltipProps = React.HTMLAttributes<HTMLDivElement> & {\n /** The element which activates the tooltip when hovered. Should be a single React/HTML element */\n children: React.ReactElement | any;\n /** Text displayed in the tooltip */\n title: string;\n /**\n * Placement of the tooltip relative to the reference element. Placement will be reversed if a collision occurs\n * @defaultValue bottom\n */\n placement?: 'top' | 'right' | 'bottom' | 'left';\n};\n\nexport const Tooltip = React.forwardRef(function Tooltip(props: TooltipProps, ref: React.Ref<HTMLElement>) {\n const { title, children, placement, ...otherProps } = props;\n\n return (\n <TooltipPrimitive.Root delayDuration={50}>\n <TooltipPrimitive.Trigger asChild ref={ref as any}>\n {children}\n </TooltipPrimitive.Trigger>\n <TooltipPrimitive.Content {...otherProps} asChild side={placement} sideOffset={3}>\n <div\n className=\"wcag-purple max-w-[theme(spacing.56)] animate-[fade-in_150ms] rounded-sm px-2 py-1 text-xs font-bold opacity-90\"\n data-taco=\"tooltip\"\n style={{\n transformOrigin: 'var(--radix-tooltip-content-transform-origin)',\n }}>\n <TooltipPrimitive.Arrow className=\"fill-purple stroke-purple\" />\n {title}\n </div>\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Root>\n );\n});\n"],"names":["Tooltip","React","props","ref","title","children","placement","otherProps","TooltipPrimitive","delayDuration","asChild","side","sideOffset","className","style","transformOrigin"],"mappings":";;;MAeaA,OAAO,gBAAGC,UAAA,CAAiB,SAASD,OAAT,CAAiBE,KAAjB,EAAsCC,GAAtC;EACpC,MAAM;IAAEC,KAAF;IAASC,QAAT;IAAmBC,SAAnB;IAA8B,GAAGC;MAAeL,KAAtD;EAEA,OACID,aAAA,CAACO,IAAD;IAAuBC,aAAa,EAAE;GAAtC,EACIR,aAAA,CAACO,OAAD;IAA0BE,OAAO;IAACP,GAAG,EAAEA;GAAvC,EACKE,QADL,CADJ,EAIIJ,aAAA,CAACO,OAAD,oBAA8BD;IAAYG,OAAO;IAACC,IAAI,EAAEL;IAAWM,UAAU,EAAE;IAA/E,EACIX,aAAA,MAAA;IACIY,SAAS,EAAC;iBACA;IACVC,KAAK,EAAE;MACHC,eAAe,EAAE;;GAJzB,EAMId,aAAA,CAACO,KAAD;IAAwBK,SAAS,EAAC;GAAlC,CANJ,EAOKT,KAPL,CADJ,CAJJ,CADJ;AAkBH,CArBsB;;;;"}
@@ -1,31 +1,28 @@
1
- import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
1
  import { useMemo, Children, useCallback, createElement, useRef, useEffect } from 'react';
3
2
  import { IconButton } from '../IconButton/IconButton.js';
4
3
  import { Button } from '../Button/Button.js';
5
4
  import { useLocalization } from '../Provider/Provider.js';
6
- import keycode from 'keycode';
7
5
  import { Group } from '../Group/Group.js';
8
6
  import Joyride, { ACTIONS, LIFECYCLE, EVENTS } from 'react-joyride';
9
7
 
10
- var _excluded = ["autoStart", "onComplete", "onClose", "onReady", "spotlightClicks", "disableCloseOnEsc", "disableScrollParentFix", "scrollOffset"];
11
-
12
- var Tooltip = function Tooltip(_ref) {
13
- var continuous = _ref.continuous,
14
- index = _ref.index,
15
- isLastStep = _ref.isLastStep,
16
- step = _ref.step,
17
- backProps = _ref.backProps,
18
- primaryProps = _ref.primaryProps,
19
- skipProps = _ref.skipProps,
20
- tooltipProps = _ref.tooltipProps,
21
- size = _ref.size,
22
- locale = _ref.locale,
23
- disableTourSkipOnEsc = _ref.disableTourSkipOnEsc;
24
- var skipButtonRef = useRef(null);
25
- useEffect(function () {
26
- var onWindowKeyDown = function onWindowKeyDown(event) {
8
+ const Tooltip = ({
9
+ continuous,
10
+ index,
11
+ isLastStep,
12
+ step,
13
+ backProps,
14
+ primaryProps,
15
+ skipProps,
16
+ tooltipProps,
17
+ size,
18
+ locale,
19
+ disableTourSkipOnEsc
20
+ }) => {
21
+ const skipButtonRef = useRef(null);
22
+ useEffect(() => {
23
+ const onWindowKeyDown = event => {
27
24
  if (!disableTourSkipOnEsc) {
28
- if (event.keyCode === keycode('esc') && skipButtonRef.current !== null) {
25
+ if (event.key === 'Escape' && skipButtonRef.current !== null) {
29
26
  event.preventDefault();
30
27
  skipButtonRef.current.click();
31
28
  return;
@@ -34,7 +31,7 @@ var Tooltip = function Tooltip(_ref) {
34
31
  };
35
32
 
36
33
  window.addEventListener('keydown', onWindowKeyDown);
37
- return function () {
34
+ return () => {
38
35
  window.removeEventListener('keydown', onWindowKeyDown);
39
36
  };
40
37
  }, []);
@@ -53,31 +50,31 @@ var Tooltip = function Tooltip(_ref) {
53
50
  appearance: "discrete"
54
51
  }), locale.back), createElement(Button, Object.assign({}, primaryProps, {
55
52
  appearance: "primary"
56
- }), continuous ? isLastStep ? locale.last + " (" + (index + 1) + "/" + size + ")" : locale.next + " (" + (index + 1) + "/" + size + ")" : locale.close)));
53
+ }), continuous ? isLastStep ? `${locale.last} (${index + 1}/${size})` : `${locale.next} (${index + 1}/${size})` : locale.close)));
57
54
  }; // eslint-disable-next-line @typescript-eslint/no-unused-vars
58
55
 
59
56
 
60
- var TourStep = function TourStep(_props) {
61
- return null;
62
- };
63
- var Tour = function Tour(props) {
64
- var _useLocalization = useLocalization(),
65
- tour = _useLocalization.texts.tour;
66
-
67
- var run = props.autoStart,
68
- onComplete = props.onComplete,
69
- onClose = props.onClose,
70
- onReady = props.onReady,
71
- spotlightClicks = props.spotlightClicks,
72
- disableTourSkipOnEsc = props.disableCloseOnEsc,
73
- _props$disableScrollP = props.disableScrollParentFix,
74
- disableScrollParentFix = _props$disableScrollP === void 0 ? false : _props$disableScrollP,
75
- scrollOffset = props.scrollOffset,
76
- rest = _objectWithoutPropertiesLoose(props, _excluded);
77
-
78
- var steps = useMemo(function () {
79
- return Children.map(props.children, function (child) {
80
- var step = {
57
+ const TourStep = _props => null;
58
+ const Tour = props => {
59
+ const {
60
+ texts: {
61
+ tour
62
+ }
63
+ } = useLocalization();
64
+ const {
65
+ autoStart: run,
66
+ onComplete,
67
+ onClose,
68
+ onReady,
69
+ spotlightClicks,
70
+ disableCloseOnEsc: disableTourSkipOnEsc,
71
+ disableScrollParentFix = false,
72
+ scrollOffset,
73
+ ...rest
74
+ } = props;
75
+ const steps = useMemo(() => {
76
+ return Children.map(props.children, child => {
77
+ const step = {
81
78
  disableBeacon: !child.props.showBeacon,
82
79
  target: child.props.selector,
83
80
  placement: child.props.position,
@@ -87,12 +84,10 @@ var Tour = function Tour(props) {
87
84
  return step;
88
85
  });
89
86
  }, [props.children]);
90
- var getStep = useCallback(function (selector) {
87
+ const getStep = useCallback(selector => {
91
88
  var _props$children$find;
92
89
 
93
- return (_props$children$find = props.children.find(function (child) {
94
- return child.props.selector === selector;
95
- })) === null || _props$children$find === void 0 ? void 0 : _props$children$find.props;
90
+ return (_props$children$find = props.children.find(child => child.props.selector === selector)) === null || _props$children$find === void 0 ? void 0 : _props$children$find.props;
96
91
  }, [props.children]);
97
92
 
98
93
  function callback(state) {
@@ -122,12 +117,10 @@ var Tour = function Tour(props) {
122
117
  floaterProps: {
123
118
  disableAnimation: true
124
119
  },
125
- tooltipComponent: function tooltipComponent(tooltipProps) {
126
- return createElement(Tooltip, Object.assign({}, tooltipProps, {
127
- locale: tour,
128
- disableTourSkipOnEsc: disableTourSkipOnEsc
129
- }));
130
- },
120
+ tooltipComponent: tooltipProps => createElement(Tooltip, Object.assign({}, tooltipProps, {
121
+ locale: tour,
122
+ disableTourSkipOnEsc: disableTourSkipOnEsc
123
+ })),
131
124
  locale: tour,
132
125
  spotlightPadding: 8,
133
126
  spotlightClicks: spotlightClicks,