@clicoh/orion-library 1.2.0-beta.2 → 1.2.0-beta.20

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 (408) hide show
  1. package/assets/css/expresivo.css +968 -0
  2. package/assets/logos/oculus-icon.svg +1 -0
  3. package/assets/logos/oculus-logo-sm-dark.svg +1 -0
  4. package/assets/logos/oculus-logo-sm.svg +1 -0
  5. package/assets/mascotas/svg/bugi-mascota-01-alerta.svg +39 -0
  6. package/assets/mascotas/svg/bugi-mascota-02-investigando.svg +36 -0
  7. package/assets/mascotas/svg/bugi-mascota-05-sorprendido.svg +38 -0
  8. package/assets/mascotas/svg/oculus-mascota-01-feliz.svg +52 -0
  9. package/assets/mascotas/svg/oculus-mascota-02-investigando.svg +51 -0
  10. package/assets/mascotas/svg/oculus-mascota-03-dudando.svg +51 -0
  11. package/assets/mascotas/svg/oculus-mascota-04-analizando-documento.svg +53 -0
  12. package/assets/mascotas/svg/oculus-mascota-06-celebrando.svg +54 -0
  13. package/assets/mascotas/svg/oculus-mascota-07-buscando-rapido.svg +57 -0
  14. package/assets/mascotas/svg/oculus-mascota-08-satisfecho.svg +55 -0
  15. package/assets/mascotas/webp/fixi-mascota-01-feliz-sm.webp +0 -0
  16. package/assets/mascotas/webp/fixi-mascota-02-investigando-sm.webp +0 -0
  17. package/assets/mascotas/webp/fixi-mascota-03-dudando-sm.webp +0 -0
  18. package/assets/mascotas/webp/fixi-mascota-04-reparando-sm.webp +0 -0
  19. package/assets/mascotas/webp/fixi-mascota-05-sorprendido-sm.webp +0 -0
  20. package/assets/mascotas/webp/fixi-mascota-06-celebrando-sm.webp +0 -0
  21. package/assets/mascotas/webp/fixi-mascota-07-corriendo-sm.webp +0 -0
  22. package/dist/components/01-atoms/Button/Button.d.ts +21 -1
  23. package/dist/components/01-atoms/Button/Button.d.ts.map +1 -1
  24. package/dist/components/01-atoms/Button/Button.jsx +38 -4
  25. package/dist/components/01-atoms/Button/Button.jsx.map +1 -1
  26. package/dist/components/01-atoms/CodeBlock/CodeBlock.d.ts +56 -0
  27. package/dist/components/01-atoms/CodeBlock/CodeBlock.d.ts.map +1 -0
  28. package/dist/components/01-atoms/CodeBlock/CodeBlock.jsx +97 -0
  29. package/dist/components/01-atoms/CodeBlock/CodeBlock.jsx.map +1 -0
  30. package/dist/components/01-atoms/CodeBlock/index.d.ts +2 -0
  31. package/dist/components/01-atoms/CodeBlock/index.d.ts.map +1 -0
  32. package/dist/components/01-atoms/CodeBlock/index.js +2 -0
  33. package/dist/components/01-atoms/CodeBlock/index.js.map +1 -0
  34. package/dist/components/01-atoms/Heading/Heading.jsx +1 -1
  35. package/dist/components/01-atoms/Heading/Heading.jsx.map +1 -1
  36. package/dist/components/01-atoms/IconButton/IconButton.d.ts +28 -0
  37. package/dist/components/01-atoms/IconButton/IconButton.d.ts.map +1 -0
  38. package/dist/components/01-atoms/IconButton/IconButton.jsx +32 -0
  39. package/dist/components/01-atoms/IconButton/IconButton.jsx.map +1 -0
  40. package/dist/components/01-atoms/IconButton/index.d.ts +2 -0
  41. package/dist/components/01-atoms/IconButton/index.d.ts.map +1 -0
  42. package/dist/components/01-atoms/IconButton/index.js +2 -0
  43. package/dist/components/01-atoms/IconButton/index.js.map +1 -0
  44. package/dist/components/01-atoms/Input/Input.d.ts +1 -1
  45. package/dist/components/01-atoms/Input/Input.d.ts.map +1 -1
  46. package/dist/components/01-atoms/Input/Input.jsx +13 -9
  47. package/dist/components/01-atoms/Input/Input.jsx.map +1 -1
  48. package/dist/components/01-atoms/Input/utils/RenderErrorOrHelperText.d.ts.map +1 -1
  49. package/dist/components/01-atoms/Input/utils/RenderErrorOrHelperText.jsx +1 -1
  50. package/dist/components/01-atoms/Input/utils/RenderErrorOrHelperText.jsx.map +1 -1
  51. package/dist/components/01-atoms/MultiSelect/MultiSelect.d.ts.map +1 -1
  52. package/dist/components/01-atoms/MultiSelect/MultiSelect.jsx +2 -1
  53. package/dist/components/01-atoms/MultiSelect/MultiSelect.jsx.map +1 -1
  54. package/dist/components/01-atoms/ProgressBar/ProgressBar.d.ts +12 -1
  55. package/dist/components/01-atoms/ProgressBar/ProgressBar.d.ts.map +1 -1
  56. package/dist/components/01-atoms/ProgressBar/ProgressBar.jsx +18 -2
  57. package/dist/components/01-atoms/ProgressBar/ProgressBar.jsx.map +1 -1
  58. package/dist/components/01-atoms/Select/Select.d.ts +7 -1
  59. package/dist/components/01-atoms/Select/Select.d.ts.map +1 -1
  60. package/dist/components/01-atoms/Select/Select.jsx +61 -13
  61. package/dist/components/01-atoms/Select/Select.jsx.map +1 -1
  62. package/dist/components/01-atoms/Select/SelectList.d.ts +41 -0
  63. package/dist/components/01-atoms/Select/SelectList.d.ts.map +1 -0
  64. package/dist/components/01-atoms/Select/SelectList.jsx +116 -0
  65. package/dist/components/01-atoms/Select/SelectList.jsx.map +1 -0
  66. package/dist/components/01-atoms/SmallInput/SmallInput.d.ts.map +1 -1
  67. package/dist/components/01-atoms/SmallInput/SmallInput.jsx +1 -0
  68. package/dist/components/01-atoms/SmallInput/SmallInput.jsx.map +1 -1
  69. package/dist/components/01-atoms/Spinner/Spinner.d.ts +24 -3
  70. package/dist/components/01-atoms/Spinner/Spinner.d.ts.map +1 -1
  71. package/dist/components/01-atoms/Spinner/Spinner.jsx +30 -4
  72. package/dist/components/01-atoms/Spinner/Spinner.jsx.map +1 -1
  73. package/dist/components/01-atoms/Spinner/index.d.ts +1 -0
  74. package/dist/components/01-atoms/Spinner/index.d.ts.map +1 -1
  75. package/dist/components/01-atoms/Stat/Stat.d.ts +47 -0
  76. package/dist/components/01-atoms/Stat/Stat.d.ts.map +1 -0
  77. package/dist/components/01-atoms/Stat/Stat.jsx +64 -0
  78. package/dist/components/01-atoms/Stat/Stat.jsx.map +1 -0
  79. package/dist/components/01-atoms/Stat/index.d.ts +2 -0
  80. package/dist/components/01-atoms/Stat/index.d.ts.map +1 -0
  81. package/dist/components/01-atoms/Stat/index.js +2 -0
  82. package/dist/components/01-atoms/Stat/index.js.map +1 -0
  83. package/dist/components/01-atoms/Switch/Switch.d.ts +5 -2
  84. package/dist/components/01-atoms/Switch/Switch.d.ts.map +1 -1
  85. package/dist/components/01-atoms/Switch/Switch.jsx +15 -12
  86. package/dist/components/01-atoms/Switch/Switch.jsx.map +1 -1
  87. package/dist/components/01-atoms/Textarea/Textarea.d.ts +38 -0
  88. package/dist/components/01-atoms/Textarea/Textarea.d.ts.map +1 -0
  89. package/dist/components/01-atoms/Textarea/Textarea.jsx +50 -0
  90. package/dist/components/01-atoms/Textarea/Textarea.jsx.map +1 -0
  91. package/dist/components/01-atoms/Textarea/index.d.ts +2 -0
  92. package/dist/components/01-atoms/Textarea/index.d.ts.map +1 -0
  93. package/dist/components/01-atoms/Textarea/index.js +2 -0
  94. package/dist/components/01-atoms/Textarea/index.js.map +1 -0
  95. package/dist/components/01-atoms/Toast/Toast.d.ts.map +1 -1
  96. package/dist/components/01-atoms/Toast/Toast.jsx +3 -1
  97. package/dist/components/01-atoms/Toast/Toast.jsx.map +1 -1
  98. package/dist/components/01-atoms/Tooltip/Tooltip.d.ts.map +1 -1
  99. package/dist/components/01-atoms/Tooltip/Tooltip.jsx +4 -1
  100. package/dist/components/01-atoms/Tooltip/Tooltip.jsx.map +1 -1
  101. package/dist/components/01-atoms/index.d.ts +4 -0
  102. package/dist/components/01-atoms/index.d.ts.map +1 -1
  103. package/dist/components/01-atoms/index.js +4 -0
  104. package/dist/components/01-atoms/index.js.map +1 -1
  105. package/dist/components/02-molecules/Accordion/Accordion.d.ts +15 -4
  106. package/dist/components/02-molecules/Accordion/Accordion.d.ts.map +1 -1
  107. package/dist/components/02-molecules/Accordion/Accordion.jsx +20 -6
  108. package/dist/components/02-molecules/Accordion/Accordion.jsx.map +1 -1
  109. package/dist/components/02-molecules/Accordion/AccordionContext.d.ts +5 -1
  110. package/dist/components/02-molecules/Accordion/AccordionContext.d.ts.map +1 -1
  111. package/dist/components/02-molecules/Accordion/AccordionContext.jsx +7 -6
  112. package/dist/components/02-molecules/Accordion/AccordionContext.jsx.map +1 -1
  113. package/dist/components/02-molecules/Accordion/AccordionSection.d.ts +2 -1
  114. package/dist/components/02-molecules/Accordion/AccordionSection.d.ts.map +1 -1
  115. package/dist/components/02-molecules/Accordion/AccordionSection.jsx +62 -11
  116. package/dist/components/02-molecules/Accordion/AccordionSection.jsx.map +1 -1
  117. package/dist/components/02-molecules/Accordion/index.d.ts +1 -0
  118. package/dist/components/02-molecules/Accordion/index.d.ts.map +1 -1
  119. package/dist/components/02-molecules/Accordion/index.js.map +1 -1
  120. package/dist/components/02-molecules/Autocomplete/Autocomplete.d.ts +4 -1
  121. package/dist/components/02-molecules/Autocomplete/Autocomplete.d.ts.map +1 -1
  122. package/dist/components/02-molecules/Autocomplete/Autocomplete.jsx +34 -15
  123. package/dist/components/02-molecules/Autocomplete/Autocomplete.jsx.map +1 -1
  124. package/dist/components/02-molecules/Card/Card.d.ts +74 -0
  125. package/dist/components/02-molecules/Card/Card.d.ts.map +1 -0
  126. package/dist/components/02-molecules/Card/Card.jsx +87 -0
  127. package/dist/components/02-molecules/Card/Card.jsx.map +1 -0
  128. package/dist/components/02-molecules/Card/index.d.ts +2 -0
  129. package/dist/components/02-molecules/Card/index.d.ts.map +1 -0
  130. package/dist/components/02-molecules/Card/index.js +2 -0
  131. package/dist/components/02-molecules/Card/index.js.map +1 -0
  132. package/dist/components/02-molecules/DatePicker/DatePicker.d.ts +41 -3
  133. package/dist/components/02-molecules/DatePicker/DatePicker.d.ts.map +1 -1
  134. package/dist/components/02-molecules/DatePicker/DatePicker.jsx +190 -34
  135. package/dist/components/02-molecules/DatePicker/DatePicker.jsx.map +1 -1
  136. package/dist/components/02-molecules/Dropdown/Dropdown.d.ts.map +1 -1
  137. package/dist/components/02-molecules/Dropdown/Dropdown.jsx +1 -0
  138. package/dist/components/02-molecules/Dropdown/Dropdown.jsx.map +1 -1
  139. package/dist/components/02-molecules/EmptyState/EmptyState.d.ts +52 -0
  140. package/dist/components/02-molecules/EmptyState/EmptyState.d.ts.map +1 -0
  141. package/dist/components/02-molecules/EmptyState/EmptyState.jsx +66 -0
  142. package/dist/components/02-molecules/EmptyState/EmptyState.jsx.map +1 -0
  143. package/dist/components/02-molecules/EmptyState/index.d.ts +2 -0
  144. package/dist/components/02-molecules/EmptyState/index.d.ts.map +1 -0
  145. package/dist/components/02-molecules/EmptyState/index.js +2 -0
  146. package/dist/components/02-molecules/EmptyState/index.js.map +1 -0
  147. package/dist/components/02-molecules/Filter/Filter.d.ts +8 -1
  148. package/dist/components/02-molecules/Filter/Filter.d.ts.map +1 -1
  149. package/dist/components/02-molecules/Filter/Filter.jsx +35 -11
  150. package/dist/components/02-molecules/Filter/Filter.jsx.map +1 -1
  151. package/dist/components/02-molecules/Filter/index.d.ts +1 -0
  152. package/dist/components/02-molecules/Filter/index.d.ts.map +1 -1
  153. package/dist/components/02-molecules/Filter/index.js +1 -0
  154. package/dist/components/02-molecules/Filter/index.js.map +1 -1
  155. package/dist/components/02-molecules/Filter/types.d.ts +24 -5
  156. package/dist/components/02-molecules/Filter/types.d.ts.map +1 -1
  157. package/dist/components/02-molecules/Filter/utils/pruneOrphanValues.d.ts +34 -0
  158. package/dist/components/02-molecules/Filter/utils/pruneOrphanValues.d.ts.map +1 -0
  159. package/dist/components/02-molecules/Filter/utils/pruneOrphanValues.js +70 -0
  160. package/dist/components/02-molecules/Filter/utils/pruneOrphanValues.js.map +1 -0
  161. package/dist/components/02-molecules/ImageViewer/ImageViewer.d.ts +55 -5
  162. package/dist/components/02-molecules/ImageViewer/ImageViewer.d.ts.map +1 -1
  163. package/dist/components/02-molecules/ImageViewer/ImageViewer.jsx +118 -27
  164. package/dist/components/02-molecules/ImageViewer/ImageViewer.jsx.map +1 -1
  165. package/dist/components/02-molecules/ImageViewer/ImageViewerImage.d.ts +40 -0
  166. package/dist/components/02-molecules/ImageViewer/ImageViewerImage.d.ts.map +1 -0
  167. package/dist/components/02-molecules/ImageViewer/ImageViewerImage.jsx +109 -0
  168. package/dist/components/02-molecules/ImageViewer/ImageViewerImage.jsx.map +1 -0
  169. package/dist/components/02-molecules/InlineMessage/InlineMessage.d.ts +15 -1
  170. package/dist/components/02-molecules/InlineMessage/InlineMessage.d.ts.map +1 -1
  171. package/dist/components/02-molecules/InlineMessage/InlineMessage.jsx +18 -3
  172. package/dist/components/02-molecules/InlineMessage/InlineMessage.jsx.map +1 -1
  173. package/dist/components/02-molecules/Menu/MenuItem.d.ts.map +1 -1
  174. package/dist/components/02-molecules/Menu/MenuItem.jsx +2 -2
  175. package/dist/components/02-molecules/Menu/MenuItem.jsx.map +1 -1
  176. package/dist/components/02-molecules/Menu/MenuList.d.ts.map +1 -1
  177. package/dist/components/02-molecules/Menu/MenuList.jsx +1 -1
  178. package/dist/components/02-molecules/Menu/MenuList.jsx.map +1 -1
  179. package/dist/components/02-molecules/Modal/Modal.d.ts +5 -1
  180. package/dist/components/02-molecules/Modal/Modal.d.ts.map +1 -1
  181. package/dist/components/02-molecules/Modal/Modal.jsx +4 -2
  182. package/dist/components/02-molecules/Modal/Modal.jsx.map +1 -1
  183. package/dist/components/02-molecules/MultiAutocomplete/MultiAutocomplete.d.ts +80 -0
  184. package/dist/components/02-molecules/MultiAutocomplete/MultiAutocomplete.d.ts.map +1 -0
  185. package/dist/components/02-molecules/MultiAutocomplete/MultiAutocomplete.jsx +261 -0
  186. package/dist/components/02-molecules/MultiAutocomplete/MultiAutocomplete.jsx.map +1 -0
  187. package/dist/components/02-molecules/MultiAutocomplete/index.d.ts +2 -0
  188. package/dist/components/02-molecules/MultiAutocomplete/index.d.ts.map +1 -0
  189. package/dist/components/02-molecules/MultiAutocomplete/index.js +2 -0
  190. package/dist/components/02-molecules/MultiAutocomplete/index.js.map +1 -0
  191. package/dist/components/02-molecules/Stepper/Stepper.d.ts +70 -0
  192. package/dist/components/02-molecules/Stepper/Stepper.d.ts.map +1 -0
  193. package/dist/components/02-molecules/Stepper/Stepper.jsx +204 -0
  194. package/dist/components/02-molecules/Stepper/Stepper.jsx.map +1 -0
  195. package/dist/components/02-molecules/Stepper/index.d.ts +2 -0
  196. package/dist/components/02-molecules/Stepper/index.d.ts.map +1 -0
  197. package/dist/components/02-molecules/Stepper/index.js +2 -0
  198. package/dist/components/02-molecules/Stepper/index.js.map +1 -0
  199. package/dist/components/02-molecules/Table/Table.d.ts +3 -1
  200. package/dist/components/02-molecules/Table/Table.d.ts.map +1 -1
  201. package/dist/components/02-molecules/Table/Table.jsx +6 -5
  202. package/dist/components/02-molecules/Table/Table.jsx.map +1 -1
  203. package/dist/components/02-molecules/Timeline/Timeline.d.ts +47 -0
  204. package/dist/components/02-molecules/Timeline/Timeline.d.ts.map +1 -0
  205. package/dist/components/02-molecules/Timeline/Timeline.jsx +65 -0
  206. package/dist/components/02-molecules/Timeline/Timeline.jsx.map +1 -0
  207. package/dist/components/02-molecules/Timeline/index.d.ts +2 -0
  208. package/dist/components/02-molecules/Timeline/index.d.ts.map +1 -0
  209. package/dist/components/02-molecules/Timeline/index.js +2 -0
  210. package/dist/components/02-molecules/Timeline/index.js.map +1 -0
  211. package/dist/components/02-molecules/index.d.ts +5 -0
  212. package/dist/components/02-molecules/index.d.ts.map +1 -1
  213. package/dist/components/02-molecules/index.js +5 -0
  214. package/dist/components/02-molecules/index.js.map +1 -1
  215. package/dist/components/03-organisms/DataTable/DataTable.d.ts +1 -1
  216. package/dist/components/03-organisms/DataTable/DataTable.d.ts.map +1 -1
  217. package/dist/components/03-organisms/DataTable/DataTable.jsx.map +1 -1
  218. package/dist/components/03-organisms/Header/Header.d.ts +3 -1
  219. package/dist/components/03-organisms/Header/Header.d.ts.map +1 -1
  220. package/dist/components/03-organisms/Header/Header.jsx +4 -5
  221. package/dist/components/03-organisms/Header/Header.jsx.map +1 -1
  222. package/dist/components/03-organisms/MapView/MapView.d.ts +14 -3
  223. package/dist/components/03-organisms/MapView/MapView.d.ts.map +1 -1
  224. package/dist/components/03-organisms/MapView/MapView.jsx +40 -9
  225. package/dist/components/03-organisms/MapView/MapView.jsx.map +1 -1
  226. package/dist/components/03-organisms/ModalMultiple/ModalMultiple.d.ts.map +1 -1
  227. package/dist/components/03-organisms/ModalMultiple/ModalMultiple.jsx +1 -0
  228. package/dist/components/03-organisms/ModalMultiple/ModalMultiple.jsx.map +1 -1
  229. package/dist/components/04-templates/DashboardTemplate/DashboardTemplate.d.ts +36 -4
  230. package/dist/components/04-templates/DashboardTemplate/DashboardTemplate.d.ts.map +1 -1
  231. package/dist/components/04-templates/DashboardTemplate/DashboardTemplate.jsx +44 -10
  232. package/dist/components/04-templates/DashboardTemplate/DashboardTemplate.jsx.map +1 -1
  233. package/dist/components/04-templates/DashboardTemplate/HeadingWithTitle.d.ts +6 -2
  234. package/dist/components/04-templates/DashboardTemplate/HeadingWithTitle.d.ts.map +1 -1
  235. package/dist/components/04-templates/DashboardTemplate/HeadingWithTitle.jsx +7 -3
  236. package/dist/components/04-templates/DashboardTemplate/HeadingWithTitle.jsx.map +1 -1
  237. package/dist/components/04-templates/LoginTemplate/LoginForm.d.ts +66 -3
  238. package/dist/components/04-templates/LoginTemplate/LoginForm.d.ts.map +1 -1
  239. package/dist/components/04-templates/LoginTemplate/LoginForm.jsx +80 -16
  240. package/dist/components/04-templates/LoginTemplate/LoginForm.jsx.map +1 -1
  241. package/dist/components/04-templates/LoginTemplate/LoginTemplate.d.ts +24 -4
  242. package/dist/components/04-templates/LoginTemplate/LoginTemplate.d.ts.map +1 -1
  243. package/dist/components/04-templates/LoginTemplate/LoginTemplate.jsx +27 -7
  244. package/dist/components/04-templates/LoginTemplate/LoginTemplate.jsx.map +1 -1
  245. package/dist/components/04-templates/LoginTemplate/index.d.ts +1 -0
  246. package/dist/components/04-templates/LoginTemplate/index.d.ts.map +1 -1
  247. package/dist/components/04-templates/SideFilterTemplate/SideFilterTemplate.d.ts.map +1 -1
  248. package/dist/components/04-templates/SideFilterTemplate/SideFilterTemplate.jsx +4 -1
  249. package/dist/components/04-templates/SideFilterTemplate/SideFilterTemplate.jsx.map +1 -1
  250. package/dist/hooks/useSegments.d.ts.map +1 -1
  251. package/dist/hooks/useSegments.js +2 -3
  252. package/dist/hooks/useSegments.js.map +1 -1
  253. package/dist/hooks/useTheme.d.ts.map +1 -1
  254. package/dist/hooks/useTheme.jsx +1 -0
  255. package/dist/hooks/useTheme.jsx.map +1 -1
  256. package/expresivo/ExpBubble/ExpBubble.d.ts +51 -0
  257. package/expresivo/ExpBubble/ExpBubble.d.ts.map +1 -0
  258. package/expresivo/ExpBubble/ExpBubble.jsx +74 -0
  259. package/expresivo/ExpBubble/ExpBubble.jsx.map +1 -0
  260. package/expresivo/ExpBubble/index.d.ts +3 -0
  261. package/expresivo/ExpBubble/index.d.ts.map +1 -0
  262. package/expresivo/ExpBubble/index.js +2 -0
  263. package/expresivo/ExpBubble/index.js.map +1 -0
  264. package/expresivo/ExpChip/ExpChip.d.ts +30 -0
  265. package/expresivo/ExpChip/ExpChip.d.ts.map +1 -0
  266. package/expresivo/ExpChip/ExpChip.jsx +46 -0
  267. package/expresivo/ExpChip/ExpChip.jsx.map +1 -0
  268. package/expresivo/ExpChip/index.d.ts +3 -0
  269. package/expresivo/ExpChip/index.d.ts.map +1 -0
  270. package/expresivo/ExpChip/index.js +2 -0
  271. package/expresivo/ExpChip/index.js.map +1 -0
  272. package/expresivo/ExpCollapseToggle/ExpCollapseToggle.d.ts +37 -0
  273. package/expresivo/ExpCollapseToggle/ExpCollapseToggle.d.ts.map +1 -0
  274. package/expresivo/ExpCollapseToggle/ExpCollapseToggle.jsx +43 -0
  275. package/expresivo/ExpCollapseToggle/ExpCollapseToggle.jsx.map +1 -0
  276. package/expresivo/ExpCollapseToggle/index.d.ts +3 -0
  277. package/expresivo/ExpCollapseToggle/index.d.ts.map +1 -0
  278. package/expresivo/ExpCollapseToggle/index.js +2 -0
  279. package/expresivo/ExpCollapseToggle/index.js.map +1 -0
  280. package/expresivo/ExpEnterIcon/ExpEnterIcon.d.ts +32 -0
  281. package/expresivo/ExpEnterIcon/ExpEnterIcon.d.ts.map +1 -0
  282. package/expresivo/ExpEnterIcon/ExpEnterIcon.jsx +32 -0
  283. package/expresivo/ExpEnterIcon/ExpEnterIcon.jsx.map +1 -0
  284. package/expresivo/ExpEnterIcon/index.d.ts +3 -0
  285. package/expresivo/ExpEnterIcon/index.d.ts.map +1 -0
  286. package/expresivo/ExpEnterIcon/index.js +2 -0
  287. package/expresivo/ExpEnterIcon/index.js.map +1 -0
  288. package/expresivo/ExpGrowBar/ExpGrowBar.d.ts +26 -0
  289. package/expresivo/ExpGrowBar/ExpGrowBar.d.ts.map +1 -0
  290. package/expresivo/ExpGrowBar/ExpGrowBar.jsx +39 -0
  291. package/expresivo/ExpGrowBar/ExpGrowBar.jsx.map +1 -0
  292. package/expresivo/ExpGrowBar/index.d.ts +3 -0
  293. package/expresivo/ExpGrowBar/index.d.ts.map +1 -0
  294. package/expresivo/ExpGrowBar/index.js +2 -0
  295. package/expresivo/ExpGrowBar/index.js.map +1 -0
  296. package/expresivo/ExpJourneyTrack/ExpJourneyTrack.d.ts +65 -0
  297. package/expresivo/ExpJourneyTrack/ExpJourneyTrack.d.ts.map +1 -0
  298. package/expresivo/ExpJourneyTrack/ExpJourneyTrack.jsx +156 -0
  299. package/expresivo/ExpJourneyTrack/ExpJourneyTrack.jsx.map +1 -0
  300. package/expresivo/ExpJourneyTrack/index.d.ts +3 -0
  301. package/expresivo/ExpJourneyTrack/index.d.ts.map +1 -0
  302. package/expresivo/ExpJourneyTrack/index.js +2 -0
  303. package/expresivo/ExpJourneyTrack/index.js.map +1 -0
  304. package/expresivo/ExpKeyButton/ExpKeyButton.d.ts +49 -0
  305. package/expresivo/ExpKeyButton/ExpKeyButton.d.ts.map +1 -0
  306. package/expresivo/ExpKeyButton/ExpKeyButton.jsx +60 -0
  307. package/expresivo/ExpKeyButton/ExpKeyButton.jsx.map +1 -0
  308. package/expresivo/ExpKeyButton/index.d.ts +3 -0
  309. package/expresivo/ExpKeyButton/index.d.ts.map +1 -0
  310. package/expresivo/ExpKeyButton/index.js +2 -0
  311. package/expresivo/ExpKeyButton/index.js.map +1 -0
  312. package/expresivo/ExpLensIcon/ExpLensIcon.d.ts +29 -0
  313. package/expresivo/ExpLensIcon/ExpLensIcon.d.ts.map +1 -0
  314. package/expresivo/ExpLensIcon/ExpLensIcon.jsx +29 -0
  315. package/expresivo/ExpLensIcon/ExpLensIcon.jsx.map +1 -0
  316. package/expresivo/ExpLensIcon/index.d.ts +3 -0
  317. package/expresivo/ExpLensIcon/index.d.ts.map +1 -0
  318. package/expresivo/ExpLensIcon/index.js +2 -0
  319. package/expresivo/ExpLensIcon/index.js.map +1 -0
  320. package/expresivo/ExpLogo/ExpLogo.d.ts +33 -0
  321. package/expresivo/ExpLogo/ExpLogo.d.ts.map +1 -0
  322. package/expresivo/ExpLogo/ExpLogo.jsx +42 -0
  323. package/expresivo/ExpLogo/ExpLogo.jsx.map +1 -0
  324. package/expresivo/ExpLogo/catalog.d.ts +17 -0
  325. package/expresivo/ExpLogo/catalog.d.ts.map +1 -0
  326. package/expresivo/ExpLogo/catalog.js +11 -0
  327. package/expresivo/ExpLogo/catalog.js.map +1 -0
  328. package/expresivo/ExpLogo/index.d.ts +4 -0
  329. package/expresivo/ExpLogo/index.d.ts.map +1 -0
  330. package/expresivo/ExpLogo/index.js +2 -0
  331. package/expresivo/ExpLogo/index.js.map +1 -0
  332. package/expresivo/ExpMascot/ExpMascot.d.ts +42 -0
  333. package/expresivo/ExpMascot/ExpMascot.d.ts.map +1 -0
  334. package/expresivo/ExpMascot/ExpMascot.jsx +46 -0
  335. package/expresivo/ExpMascot/ExpMascot.jsx.map +1 -0
  336. package/expresivo/ExpMascot/catalog.d.ts +12 -0
  337. package/expresivo/ExpMascot/catalog.d.ts.map +1 -0
  338. package/expresivo/ExpMascot/catalog.js +41 -0
  339. package/expresivo/ExpMascot/catalog.js.map +1 -0
  340. package/expresivo/ExpMascot/index.d.ts +4 -0
  341. package/expresivo/ExpMascot/index.d.ts.map +1 -0
  342. package/expresivo/ExpMascot/index.js +2 -0
  343. package/expresivo/ExpMascot/index.js.map +1 -0
  344. package/expresivo/ExpMedalBadge/ExpMedalBadge.d.ts +29 -0
  345. package/expresivo/ExpMedalBadge/ExpMedalBadge.d.ts.map +1 -0
  346. package/expresivo/ExpMedalBadge/ExpMedalBadge.jsx +87 -0
  347. package/expresivo/ExpMedalBadge/ExpMedalBadge.jsx.map +1 -0
  348. package/expresivo/ExpMedalBadge/index.d.ts +3 -0
  349. package/expresivo/ExpMedalBadge/index.d.ts.map +1 -0
  350. package/expresivo/ExpMedalBadge/index.js +2 -0
  351. package/expresivo/ExpMedalBadge/index.js.map +1 -0
  352. package/expresivo/ExpPageHero/ExpPageHero.d.ts +82 -0
  353. package/expresivo/ExpPageHero/ExpPageHero.d.ts.map +1 -0
  354. package/expresivo/ExpPageHero/ExpPageHero.jsx +113 -0
  355. package/expresivo/ExpPageHero/ExpPageHero.jsx.map +1 -0
  356. package/expresivo/ExpPageHero/index.d.ts +3 -0
  357. package/expresivo/ExpPageHero/index.d.ts.map +1 -0
  358. package/expresivo/ExpPageHero/index.js +2 -0
  359. package/expresivo/ExpPageHero/index.js.map +1 -0
  360. package/expresivo/ExpPeek/ExpPeek.d.ts +56 -0
  361. package/expresivo/ExpPeek/ExpPeek.d.ts.map +1 -0
  362. package/expresivo/ExpPeek/ExpPeek.jsx +131 -0
  363. package/expresivo/ExpPeek/ExpPeek.jsx.map +1 -0
  364. package/expresivo/ExpPeek/index.d.ts +3 -0
  365. package/expresivo/ExpPeek/index.d.ts.map +1 -0
  366. package/expresivo/ExpPeek/index.js +2 -0
  367. package/expresivo/ExpPeek/index.js.map +1 -0
  368. package/expresivo/ExpPillButton/ExpPillButton.d.ts +44 -0
  369. package/expresivo/ExpPillButton/ExpPillButton.d.ts.map +1 -0
  370. package/expresivo/ExpPillButton/ExpPillButton.jsx +75 -0
  371. package/expresivo/ExpPillButton/ExpPillButton.jsx.map +1 -0
  372. package/expresivo/ExpPillButton/index.d.ts +3 -0
  373. package/expresivo/ExpPillButton/index.d.ts.map +1 -0
  374. package/expresivo/ExpPillButton/index.js +2 -0
  375. package/expresivo/ExpPillButton/index.js.map +1 -0
  376. package/expresivo/ExpScope/ExpScope.d.ts +63 -0
  377. package/expresivo/ExpScope/ExpScope.d.ts.map +1 -0
  378. package/expresivo/ExpScope/ExpScope.jsx +67 -0
  379. package/expresivo/ExpScope/ExpScope.jsx.map +1 -0
  380. package/expresivo/ExpScope/index.d.ts +3 -0
  381. package/expresivo/ExpScope/index.d.ts.map +1 -0
  382. package/expresivo/ExpScope/index.js +2 -0
  383. package/expresivo/ExpScope/index.js.map +1 -0
  384. package/expresivo/ExpScoreRing/ExpScoreRing.d.ts +35 -0
  385. package/expresivo/ExpScoreRing/ExpScoreRing.d.ts.map +1 -0
  386. package/expresivo/ExpScoreRing/ExpScoreRing.jsx +67 -0
  387. package/expresivo/ExpScoreRing/ExpScoreRing.jsx.map +1 -0
  388. package/expresivo/ExpScoreRing/index.d.ts +3 -0
  389. package/expresivo/ExpScoreRing/index.d.ts.map +1 -0
  390. package/expresivo/ExpScoreRing/index.js +2 -0
  391. package/expresivo/ExpScoreRing/index.js.map +1 -0
  392. package/expresivo/ExpStepBadge/ExpStepBadge.d.ts +25 -0
  393. package/expresivo/ExpStepBadge/ExpStepBadge.d.ts.map +1 -0
  394. package/expresivo/ExpStepBadge/ExpStepBadge.jsx +30 -0
  395. package/expresivo/ExpStepBadge/ExpStepBadge.jsx.map +1 -0
  396. package/expresivo/ExpStepBadge/index.d.ts +2 -0
  397. package/expresivo/ExpStepBadge/index.d.ts.map +1 -0
  398. package/expresivo/ExpStepBadge/index.js +2 -0
  399. package/expresivo/ExpStepBadge/index.js.map +1 -0
  400. package/expresivo/index.d.ts +18 -0
  401. package/expresivo/index.d.ts.map +1 -0
  402. package/expresivo/index.js +18 -0
  403. package/expresivo/index.js.map +1 -0
  404. package/expresivo/shared/glyphs.d.ts +20 -0
  405. package/expresivo/shared/glyphs.d.ts.map +1 -0
  406. package/expresivo/shared/glyphs.jsx +60 -0
  407. package/expresivo/shared/glyphs.jsx.map +1 -0
  408. package/package.json +6 -4
@@ -1 +1 @@
1
- {"version":3,"file":"LoginForm.d.ts","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/LoginForm.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAoB,SAAS,EAAuB,MAAM,OAAO,CAAC;AAWzE,OAAO,EAAY,KAAK,2BAA2B,EAAE,MAAM,YAAY,CAAC;AAExE,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,KAAK,OAAO,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;IAC3D,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,KAAK,OAAO,CAAC,SAAS,CAAC,CAAC;IACzE,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACjD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,2BAA2B,CAAC,EAAE,2BAA2B,CAAC;CAC3D,CAAC;AAEF;;;;;;;;;;;;;GAaG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,QAAQ,EACR,QAAgB,EAChB,UAAc,EACd,QAAQ,EACR,qBAAqB,EACrB,qBAAqB,EACrB,oBAAoB,EACpB,YAAY,EACZ,2BAA2B,GAC5B,EAAE,cAAc,GAAG,SAAS,CAwI5B"}
1
+ {"version":3,"file":"LoginForm.d.ts","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/LoginForm.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAoB,SAAS,EAAuB,MAAM,OAAO,CAAC;AAYzE,OAAO,EAAY,KAAK,2BAA2B,EAAE,MAAM,YAAY,CAAC;AAExE,0EAA0E;AAC1E,MAAM,MAAM,eAAe,GAAG;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,kEAAkE;AAClE,MAAM,MAAM,oBAAoB,GAAG;IACjC,iCAAiC;IACjC,OAAO,EAAE,OAAO,CAAC;IACjB,uCAAuC;IACvC,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,MAAM,GAAG,SAAS,CAAC;AAErD,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,KAAK,OAAO,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;IAC3D,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,KAAK,OAAO,CAAC,SAAS,CAAC,CAAC;IACzE,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACjD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,2BAA2B,CAAC,EAAE,2BAA2B,CAAC;IAC1D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,SAAS,CAAC;IAC1D,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAUF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmDG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,QAAQ,EACR,QAAgB,EAChB,UAAc,EACd,QAAQ,EACR,qBAAqB,EACrB,qBAAqB,EACrB,oBAAoB,EACpB,YAAY,EACZ,2BAA2B,EAC3B,KAAqB,EACrB,WAAW,EACX,MAAM,EACN,cAAc,EACd,MAAM,EACN,YAAY,EACZ,UAAmB,EACnB,WAAkB,EAClB,WAAkB,GACnB,EAAE,cAAc,GAAG,SAAS,CAkK5B"}
@@ -3,33 +3,81 @@ import clsx from 'clsx';
3
3
  import { useEffect, useState } from 'react';
4
4
  import { FiArrowRight } from 'react-icons/fi';
5
5
  import { Button, Heading, Input, OtpInput, Paragraph, showToast, Spinner, } from '../../01-atoms';
6
+ import { InlineMessage } from '../../02-molecules';
6
7
  import { SetupMfa } from './SetupMfa';
8
+ const DEFAULT_LABELS = {
9
+ username: 'Usuario',
10
+ password: 'Contraseña',
11
+ code: 'Codigo de Verificación',
12
+ submit: 'Iniciar sesión',
13
+ back: 'Volver',
14
+ };
7
15
  /**
8
- * LoginForm component for rendering a login form with email and password inputs.
16
+ * LoginForm component for rendering a login form with email and password
17
+ * inputs, the verification code step and the MFA setup wizard.
18
+ *
19
+ * Every prop after `setupMfaAccessibilityLabels` is optional and keeps the
20
+ * original look when left out.
9
21
  *
10
22
  * @component
11
23
  * @example
12
24
  * // Example usage of LoginForm component
13
25
  * <LoginForm login={yourLoginFunction} callback={yourCallbackFunction} />
14
26
  *
27
+ * @example
28
+ * // Own copy, a recovery link, the error above the button and a custom submit
29
+ * <LoginForm
30
+ * login={yourLoginFunction}
31
+ * title="Welcome back"
32
+ * description="Sign in with your account."
33
+ * labels={{ username: 'Email', password: 'Password', submit: 'Sign in' }}
34
+ * forgotPassword={<a href="/recover">Forgot your password?</a>}
35
+ * footer={<Paragraph size="body-2">No access? Ask your admin.</Paragraph>}
36
+ * errorStyle="message"
37
+ * toastErrors={false}
38
+ * showSpinner={false}
39
+ * renderSubmit={({ pending, label }) => (
40
+ * <Button type="submit" disabled={pending} className="w-full">{label}</Button>
41
+ * )}
42
+ * />
43
+ *
15
44
  * @param {Object} props - The properties of the LoginForm component.
16
- * @param {Function} props.login - The function to handle the login process.
45
+ * @param {Function} props.login - The function to handle the login process. Resolves with a QR image to start the MFA setup, or with nothing when done; rejects with the message to show.
17
46
  * @param {Function} [props.callback] - Optional callback function to be called after a successful login.
47
+ * @param {boolean} [props.needCode=false] - Shows the verification code step instead of the credentials.
48
+ * @param {number} [props.lengthCode=6] - Digits of the verification code.
49
+ * @param {Function} [props.setupMfa] - Receives the two codes of the MFA setup wizard.
50
+ * @param {string} [props.showPasswordAriaLabel] - Accessible name of the button that shows the password.
51
+ * @param {string} [props.hidePasswordAriaLabel] - Accessible name of the button that hides the password.
52
+ * @param {Function} [props.getOtpDigitAriaLabel] - Accessible name of each code digit.
53
+ * @param {string} [props.loadingLabel] - Accessible name of the spinner.
54
+ * @param {SetupMfaAccessibilityLabels} [props.setupMfaAccessibilityLabels] - Accessible names of the MFA setup wizard.
55
+ * @param {ReactNode} [props.title='Bienvenido!'] - Heading above the form.
56
+ * @param {ReactNode} [props.description] - Text under the heading.
57
+ * @param {LoginFormLabels} [props.labels] - Field, code and button copy.
58
+ * @param {ReactNode} [props.forgotPassword] - Content above the submit button on the credentials step, such as a password recovery link.
59
+ * @param {ReactNode} [props.footer] - Content under the form, on the credentials and code steps.
60
+ * @param {Function} [props.renderSubmit] - Draws the submit button instead of the default one. It must render a `type="submit"` button.
61
+ * @param {'text' | 'message'} [props.errorStyle='text'] - `text` shows the error as red text under the buttons; `message` as an error `InlineMessage` above the submit button.
62
+ * @param {boolean} [props.toastErrors=true] - Also shows each error in a toast.
63
+ * @param {boolean} [props.showSpinner=true] - Shows a spinner under the form while `login` runs. Turn it off when `renderSubmit` already shows the wait.
18
64
  *
19
65
  * @returns {ReactNode} The rendered LoginForm component.
20
66
  */
21
- export function LoginForm({ login, callback, needCode = false, lengthCode = 6, setupMfa, showPasswordAriaLabel, hidePasswordAriaLabel, getOtpDigitAriaLabel, loadingLabel, setupMfaAccessibilityLabels, }) {
67
+ export function LoginForm({ login, callback, needCode = false, lengthCode = 6, setupMfa, showPasswordAriaLabel, hidePasswordAriaLabel, getOtpDigitAriaLabel, loadingLabel, setupMfaAccessibilityLabels, title = 'Bienvenido!', description, labels, forgotPassword, footer, renderSubmit, errorStyle = 'text', toastErrors = true, showSpinner = true, }) {
22
68
  const [errorMessage, setErrorMessage] = useState();
23
69
  const [otpCode, setOtpCode] = useState('');
24
70
  const [isPending, setIsPending] = useState(false);
25
71
  const [qr, setQr] = useState();
26
72
  const [showLogin, setShowLogin] = useState(!needCode);
73
+ const copy = { ...DEFAULT_LABELS, ...labels };
27
74
  useEffect(() => {
28
75
  setShowLogin(!needCode);
29
76
  }, [needCode]);
30
77
  const handlerSubmit = (event) => {
31
78
  event.preventDefault();
32
79
  setIsPending(true);
80
+ setErrorMessage(undefined);
33
81
  const formData = new FormData(event.currentTarget);
34
82
  if (needCode && otpCode) {
35
83
  formData.append('otpCode', otpCode);
@@ -41,7 +89,8 @@ export function LoginForm({ login, callback, needCode = false, lengthCode = 6, s
41
89
  .catch((error) => {
42
90
  const message = error instanceof Error ? error.message : String(error);
43
91
  setErrorMessage(message);
44
- showToast(message, 'error');
92
+ if (toastErrors)
93
+ showToast(message, 'error');
45
94
  })
46
95
  .finally(() => {
47
96
  setIsPending(false);
@@ -55,19 +104,30 @@ export function LoginForm({ login, callback, needCode = false, lengthCode = 6, s
55
104
  const handleSetupMfa = (firstCode, secondCode) => {
56
105
  return setupMfa?.(firstCode, secondCode);
57
106
  };
107
+ const submit = renderSubmit?.({
108
+ pending: isPending,
109
+ label: copy.submit,
110
+ }) ?? (<Button type="submit" iconR={<FiArrowRight />} aria-disabled={isPending} disabled={isPending} className="w-full">
111
+ {copy.submit}
112
+ </Button>);
58
113
  return (<>
59
114
  {!qr && (<>
60
- <Heading level="h4">Bienvenido!</Heading>
115
+ <div className="flex flex-col items-center gap-2 text-center">
116
+ <Heading level="h4">{title}</Heading>
117
+ {!!description && (<Paragraph className="text-gray-1 dark:text-gray-2 text-pretty">
118
+ {description}
119
+ </Paragraph>)}
120
+ </div>
61
121
  <form onSubmit={handlerSubmit} aria-busy={isPending} className="flex w-72 flex-col items-center gap-4">
62
122
  {!!showLogin && (<>
63
- <Input label="Usuario" input={{
123
+ <Input label={copy.username} input={{
64
124
  type: 'email',
65
125
  name: 'username',
66
126
  required: true,
67
127
  autoComplete: 'email',
68
128
  disabled: isPending,
69
129
  }}/>
70
- <Input label="Contraseña" showPasswordAriaLabel={showPasswordAriaLabel} hidePasswordAriaLabel={hidePasswordAriaLabel} input={{
130
+ <Input label={copy.password} showPasswordAriaLabel={showPasswordAriaLabel} hidePasswordAriaLabel={hidePasswordAriaLabel} input={{
71
131
  type: 'password',
72
132
  name: 'password',
73
133
  required: true,
@@ -76,21 +136,25 @@ export function LoginForm({ login, callback, needCode = false, lengthCode = 6, s
76
136
  }}/>
77
137
  </>)}
78
138
 
79
- {!showLogin && (<OtpInput label="Codigo de Verificación" length={lengthCode} handleSubmit={(otp) => setOtpCode(otp)} getDigitAriaLabel={getOtpDigitAriaLabel}/>)}
139
+ {!showLogin && (<OtpInput label={copy.code} length={lengthCode} handleSubmit={(otp) => setOtpCode(otp)} getDigitAriaLabel={getOtpDigitAriaLabel}/>)}
140
+
141
+ {errorStyle === 'message' && !!errorMessage && (<InlineMessage modifier="error" className="w-full">
142
+ {errorMessage}
143
+ </InlineMessage>)}
144
+ {!!showLogin && forgotPassword}
80
145
 
81
- <Button type="submit" iconR={<FiArrowRight />} aria-disabled={isPending} disabled={isPending} className="w-full">
82
- Iniciar sesión
83
- </Button>
146
+ {submit}
84
147
  {!showLogin && (<Button className="w-56" type="button" onClick={onCancel}>
85
- Volver
148
+ {copy.back}
86
149
  </Button>)}
87
- {!!errorMessage && (<Paragraph role="alert" className="text-error dark:text-error-1 text-center" size="chips">
150
+ {errorStyle === 'text' && !!errorMessage && (<Paragraph role="alert" className="text-error dark:text-error-1 text-center" size="chips">
88
151
  {errorMessage}
89
152
  </Paragraph>)}
90
- <div className={clsx('self-center', !isPending && 'invisible opacity-0')}>
91
- <Spinner label={loadingLabel}/>
92
- </div>
153
+ {!!showSpinner && (<div className={clsx('self-center', !isPending && 'invisible opacity-0')}>
154
+ <Spinner label={loadingLabel}/>
155
+ </div>)}
93
156
  </form>
157
+ {footer}
94
158
  </>)}
95
159
  {!!qr && (<SetupMfa lengthCode={lengthCode} onCancel={onCancel} qrImage={qr} setupMfa={handleSetupMfa} accessibilityLabels={setupMfaAccessibilityLabels}/>)}
96
160
  </>);
@@ -1 +1 @@
1
- {"version":3,"file":"LoginForm.jsx","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/LoginForm.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"LoginForm.jsx","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/LoginForm.tsx"],"names":[],"mappings":"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"}
@@ -1,25 +1,45 @@
1
- import type { ReactNode } from 'react';
1
+ import type { CSSProperties, ReactNode } from 'react';
2
2
  import { StaticImageData } from 'next/dist/shared/lib/get-img-props';
3
3
  type LoginTemplateProps = {
4
4
  children: ReactNode;
5
5
  loginImg?: StaticImageData;
6
6
  logoAriaLabel?: string;
7
+ logo?: ReactNode;
8
+ aside?: ReactNode;
9
+ imagePosition?: CSSProperties['objectPosition'];
7
10
  };
8
11
  /**
9
- * LoginTemplate component for rendering the login page layout.
12
+ * LoginTemplate component for rendering the login page layout: an image on
13
+ * the left and the content on the right. On small screens only the content
14
+ * shows.
10
15
  *
11
16
  * @component
12
17
  * @example
13
18
  * // Example usage of LoginTemplate component
14
19
  * <LoginTemplate>
15
- * <LoginForm handlerLogin={yourHandlerLoginFunction} />
20
+ * <LoginForm login={yourLoginFunction} />
21
+ * </LoginTemplate>
22
+ *
23
+ * @example
24
+ * // A tagline over the image, keeping the left part of the image in view
25
+ * <LoginTemplate
26
+ * loginImg={productImage}
27
+ * imagePosition="30% 50%"
28
+ * aside={<Heading level="h4">Your tagline</Heading>}
29
+ * >
30
+ * <LoginForm login={yourLoginFunction} />
16
31
  * </LoginTemplate>
17
32
  *
18
33
  * @param {Object} props - The properties of the LoginTemplate component.
19
34
  * @param {ReactNode} props.children - The content to be rendered inside the login template.
35
+ * @param {StaticImageData} [props.loginImg] - Image on the left. Defaults to the clicOH one.
36
+ * @param {string} [props.logoAriaLabel] - Accessible name of the default clicOH logo.
37
+ * @param {ReactNode} [props.logo=<Logo />] - Brand mark above the content. Replaces the clicOH logo, so `logoAriaLabel` no longer applies.
38
+ * @param {ReactNode} [props.aside] - Content over the bottom of the image, on a dark gradient so white text reads. White by default; hidden with the image on small screens.
39
+ * @param {string} [props.imagePosition] - CSS `object-position` of the image: the part that stays in view when it is cropped. Defaults to the center.
20
40
  *
21
41
  * @returns {ReactNode} The rendered LoginTemplate component.
22
42
  */
23
- export declare function LoginTemplate(props: LoginTemplateProps): ReactNode;
43
+ export declare function LoginTemplate({ children, loginImg, logoAriaLabel, logo, aside, imagePosition, }: LoginTemplateProps): ReactNode;
24
44
  export {};
25
45
  //# sourceMappingURL=LoginTemplate.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"LoginTemplate.d.ts","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/LoginTemplate.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,EAAE,eAAe,EAAE,MAAM,oCAAoC,CAAC;AAErE,KAAK,kBAAkB,GAAG;IACxB,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,eAAe,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,SAAS,CAuBlE"}
1
+ {"version":3,"file":"LoginTemplate.d.ts","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/LoginTemplate.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAItD,OAAO,EAAE,eAAe,EAAE,MAAM,oCAAoC,CAAC;AAErE,KAAK,kBAAkB,GAAG;IACxB,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,eAAe,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,aAAa,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;CACjD,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,IAAI,EACJ,KAAK,EACL,aAAa,GACd,EAAE,kBAAkB,GAAG,SAAS,CA6BhC"}
@@ -3,29 +3,49 @@ import LoginImg from '../../../../assets/images/login-clicoh.jpg';
3
3
  import { Logo } from '../../01-atoms';
4
4
  import { dataUrl } from './dataUrl';
5
5
  /**
6
- * LoginTemplate component for rendering the login page layout.
6
+ * LoginTemplate component for rendering the login page layout: an image on
7
+ * the left and the content on the right. On small screens only the content
8
+ * shows.
7
9
  *
8
10
  * @component
9
11
  * @example
10
12
  * // Example usage of LoginTemplate component
11
13
  * <LoginTemplate>
12
- * <LoginForm handlerLogin={yourHandlerLoginFunction} />
14
+ * <LoginForm login={yourLoginFunction} />
15
+ * </LoginTemplate>
16
+ *
17
+ * @example
18
+ * // A tagline over the image, keeping the left part of the image in view
19
+ * <LoginTemplate
20
+ * loginImg={productImage}
21
+ * imagePosition="30% 50%"
22
+ * aside={<Heading level="h4">Your tagline</Heading>}
23
+ * >
24
+ * <LoginForm login={yourLoginFunction} />
13
25
  * </LoginTemplate>
14
26
  *
15
27
  * @param {Object} props - The properties of the LoginTemplate component.
16
28
  * @param {ReactNode} props.children - The content to be rendered inside the login template.
29
+ * @param {StaticImageData} [props.loginImg] - Image on the left. Defaults to the clicOH one.
30
+ * @param {string} [props.logoAriaLabel] - Accessible name of the default clicOH logo.
31
+ * @param {ReactNode} [props.logo=<Logo />] - Brand mark above the content. Replaces the clicOH logo, so `logoAriaLabel` no longer applies.
32
+ * @param {ReactNode} [props.aside] - Content over the bottom of the image, on a dark gradient so white text reads. White by default; hidden with the image on small screens.
33
+ * @param {string} [props.imagePosition] - CSS `object-position` of the image: the part that stays in view when it is cropped. Defaults to the center.
17
34
  *
18
35
  * @returns {ReactNode} The rendered LoginTemplate component.
19
36
  */
20
- export function LoginTemplate(props) {
37
+ export function LoginTemplate({ children, loginImg, logoAriaLabel, logo, aside, imagePosition, }) {
21
38
  return (<div className="flex">
22
- <div className="relative min-h-svh flex-1 bg-black">
23
- <Image src={props.loginImg || LoginImg} alt="" aria-hidden="true" sizes="(max-width: 2247px) 100vw, 2247px" fill={true} className="object-cover" placeholder="blur" blurDataURL={dataUrl}/>
39
+ <div className="relative min-h-svh flex-1 overflow-hidden bg-black">
40
+ <Image src={loginImg || LoginImg} alt="" aria-hidden="true" sizes="(max-width: 2247px) 100vw, 2247px" fill={true} className="object-cover" style={imagePosition ? { objectPosition: imagePosition } : undefined} placeholder="blur" blurDataURL={dataUrl}/>
41
+ {!!aside && (<div className="absolute inset-x-0 bottom-0 flex flex-col gap-3 bg-linear-to-t from-black/90 via-black/70 to-transparent px-10 pt-32 pb-8 text-white">
42
+ {aside}
43
+ </div>)}
24
44
  </div>
25
45
  <main className="flex min-h-svh w-[460px] items-center justify-center bg-white text-black dark:bg-black dark:text-white">
26
46
  <div className="flex flex-col items-center justify-center gap-4">
27
- <Logo width={94} height={40} aria-label={props.logoAriaLabel}/>
28
- {props.children}
47
+ {logo ?? <Logo width={94} height={40} aria-label={logoAriaLabel}/>}
48
+ {children}
29
49
  </div>
30
50
  </main>
31
51
  </div>);
@@ -1 +1 @@
1
- {"version":3,"file":"LoginTemplate.jsx","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/LoginTemplate.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,YAAY,CAAC;AAE/B,OAAO,QAAQ,MAAM,4CAA4C,CAAC;AAClE,OAAO,EAAW,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AASpC;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,aAAa,CAAC,KAAyB;IACrD,OAAO,CACL,CAAC,GAAG,CAAC,SAAS,CAAC,MAAM,CACnB;MAAA,CAAC,GAAG,CAAC,SAAS,CAAC,oCAAoC,CACjD;QAAA,CAAC,KAAK,CACJ,GAAG,CAAC,CAAE,KAAK,CAAC,QAA4B,IAAI,QAAQ,CAAC,CACrD,GAAG,CAAC,EAAE,CACN,WAAW,CAAC,MAAM,CAClB,KAAK,CAAC,mCAAmC,CACzC,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,SAAS,CAAC,cAAc,CACxB,WAAW,CAAC,MAAM,CAClB,WAAW,CAAC,CAAC,OAAO,CAAC,EAEzB;MAAA,EAAE,GAAG,CACL;MAAA,CAAC,IAAI,CAAC,SAAS,CAAC,wGAAwG,CACtH;QAAA,CAAC,GAAG,CAAC,SAAS,CAAC,iDAAiD,CAC9D;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,UAAU,CAAC,CAAC,KAAK,CAAC,aAAa,CAAC,EAC7D;UAAA,CAAC,KAAK,CAAC,QAAQ,CACjB;QAAA,EAAE,GAAG,CACP;MAAA,EAAE,IAAI,CACR;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC"}
1
+ {"version":3,"file":"LoginTemplate.jsx","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/LoginTemplate.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,YAAY,CAAC;AAE/B,OAAO,QAAQ,MAAM,4CAA4C,CAAC;AAClE,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AACtC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAYpC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,MAAM,UAAU,aAAa,CAAC,EAC5B,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,IAAI,EACJ,KAAK,EACL,aAAa,GACM;IACnB,OAAO,CACL,CAAC,GAAG,CAAC,SAAS,CAAC,MAAM,CACnB;MAAA,CAAC,GAAG,CAAC,SAAS,CAAC,oDAAoD,CACjE;QAAA,CAAC,KAAK,CACJ,GAAG,CAAC,CAAC,QAAQ,IAAI,QAAQ,CAAC,CAC1B,GAAG,CAAC,EAAE,CACN,WAAW,CAAC,MAAM,CAClB,KAAK,CAAC,mCAAmC,CACzC,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,SAAS,CAAC,cAAc,CACxB,KAAK,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,cAAc,EAAE,aAAa,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CACrE,WAAW,CAAC,MAAM,CAClB,WAAW,CAAC,CAAC,OAAO,CAAC,EAEvB;QAAA,CAAC,CAAC,CAAC,KAAK,IAAI,CACV,CAAC,GAAG,CAAC,SAAS,CAAC,sIAAsI,CACnJ;YAAA,CAAC,KAAK,CACR;UAAA,EAAE,GAAG,CAAC,CACP,CACH;MAAA,EAAE,GAAG,CACL;MAAA,CAAC,IAAI,CAAC,SAAS,CAAC,wGAAwG,CACtH;QAAA,CAAC,GAAG,CAAC,SAAS,CAAC,iDAAiD,CAC9D;UAAA,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,UAAU,CAAC,CAAC,aAAa,CAAC,EAAG,CACnE;UAAA,CAAC,QAAQ,CACX;QAAA,EAAE,GAAG,CACP;MAAA,EAAE,IAAI,CACR;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC"}
@@ -1,3 +1,4 @@
1
1
  export { LoginTemplate } from './LoginTemplate';
2
2
  export { LoginForm } from './LoginForm';
3
+ export type { LoginFormErrorStyle, LoginFormLabels, LoginFormSubmitState, } from './LoginForm';
3
4
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EACV,mBAAmB,EACnB,eAAe,EACf,oBAAoB,GACrB,MAAM,aAAa,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"SideFilterTemplate.d.ts","sourceRoot":"","sources":["../../../../src/components/04-templates/SideFilterTemplate/SideFilterTemplate.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAM5C,KAAK,uBAAuB,GAAG;IAC7B,WAAW,EAAE,MAAM,CAAC;IACpB,eAAe,EAAE,GAAG,CAAC;IACrB,kBAAkB,EAAE,GAAG,CAAC;IACxB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IACnD,MAAM,EAAE,GAAG,CAAC;IACZ,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,WAAW,EACX,eAAe,EACf,kBAAkB,EAClB,MAAM,EACN,YAAY,EACZ,kBAAyB,GAC1B,EAAE,uBAAuB,GAAG,SAAS,CAiDrC"}
1
+ {"version":3,"file":"SideFilterTemplate.d.ts","sourceRoot":"","sources":["../../../../src/components/04-templates/SideFilterTemplate/SideFilterTemplate.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAM5C,KAAK,uBAAuB,GAAG;IAC7B,WAAW,EAAE,MAAM,CAAC;IACpB,eAAe,EAAE,GAAG,CAAC;IACrB,kBAAkB,EAAE,GAAG,CAAC;IACxB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IACnD,MAAM,EAAE,GAAG,CAAC;IACZ,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,WAAW,EACX,eAAe,EACf,kBAAkB,EAClB,MAAM,EACN,YAAY,EACZ,kBAAyB,GAC1B,EAAE,uBAAuB,GAAG,SAAS,CAoDrC"}
@@ -43,7 +43,10 @@ export function SideFilterTemplate({ filterCount, handleSetFilter, handledClearF
43
43
  filtersEnabledText: 'Filtros activos:',
44
44
  submitButton: {
45
45
  text: 'Aplicar filtros',
46
- callback: handleSetFilter,
46
+ callback: (data) => {
47
+ handleSetFilter(data);
48
+ setIsOpen(false);
49
+ },
47
50
  },
48
51
  resetButton: {
49
52
  text: 'Limpiar',
@@ -1 +1 @@
1
- {"version":3,"file":"SideFilterTemplate.jsx","sourceRoot":"","sources":["../../../../src/components/04-templates/SideFilterTemplate/SideFilterTemplate.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAa,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACzC,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAWlD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,UAAU,kBAAkB,CAAC,EACjC,WAAW,EACX,eAAe,EACf,kBAAkB,EAClB,MAAM,EACN,YAAY,EACZ,kBAAkB,GAAG,IAAI,GACD;IACxB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAErD,OAAO,CACL,EACE;MAAA,CAAC,GAAG,CAAC,SAAS,CAAC,oDAAoD,CACjE;QAAA,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI,CACvB,CAAC,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,CACxC;YAAA,CAAC,WAAW,CAAE;UAChB,EAAE,SAAS,CAAC,CACb,CACD;QAAA,CAAC,MAAM,CACL,QAAQ,CAAC,MAAM,CACf,KAAK,CAAC,CAAC,CAAC,uBAAuB,CAAC,AAAD,EAAG,CAAC,CACnC,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAC/B,aAAa,CAAC,CAAC,MAAM,CAAC,CACtB,aAAa,CAAC,QAAQ,CAEtB;;QACF,EAAE,MAAM,CACV;MAAA,EAAE,GAAG,CACL;MAAA,CAAC,CAAC,CAAC,MAAM;YACP,YAAY,CACV,CAAC,YAAY,CACX,KAAK,CAAC,SAAS,CACf,aAAa,CAAC,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CACtC,MAAM,CAAC,CAAC;oBACN,kBAAkB;oBAClB,kBAAkB,EAAE,kBAAkB;oBACtC,YAAY,EAAE;wBACZ,IAAI,EAAE,iBAAiB;wBACvB,QAAQ,EAAE,eAAe;qBAC1B;oBACD,WAAW,EAAE;wBACX,IAAI,EAAE,SAAS;wBACf,QAAQ,EAAE,kBAAkB;qBAC7B;oBACD,eAAe,EAAE,CAAC,IAAI,EAAE,EAAE;wBACxB,IAAI,YAAY,EAAE,CAAC;4BACjB,YAAY,CAAC,IAAI,CAAC,CAAC;wBACrB,CAAC;oBACH,CAAC;oBACD,MAAM,EAAE,MAAM;iBACf,CAAC,EACF,EACF,QAAQ,CAAC,IAAI,CACd,CACL;IAAA,GAAG,CACJ,CAAC;AACJ,CAAC"}
1
+ {"version":3,"file":"SideFilterTemplate.jsx","sourceRoot":"","sources":["../../../../src/components/04-templates/SideFilterTemplate/SideFilterTemplate.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAa,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACzC,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAWlD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,UAAU,kBAAkB,CAAC,EACjC,WAAW,EACX,eAAe,EACf,kBAAkB,EAClB,MAAM,EACN,YAAY,EACZ,kBAAkB,GAAG,IAAI,GACD;IACxB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAErD,OAAO,CACL,EACE;MAAA,CAAC,GAAG,CAAC,SAAS,CAAC,oDAAoD,CACjE;QAAA,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI,CACvB,CAAC,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,CACxC;YAAA,CAAC,WAAW,CAAE;UAChB,EAAE,SAAS,CAAC,CACb,CACD;QAAA,CAAC,MAAM,CACL,QAAQ,CAAC,MAAM,CACf,KAAK,CAAC,CAAC,CAAC,uBAAuB,CAAC,AAAD,EAAG,CAAC,CACnC,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAC/B,aAAa,CAAC,CAAC,MAAM,CAAC,CACtB,aAAa,CAAC,QAAQ,CAEtB;;QACF,EAAE,MAAM,CACV;MAAA,EAAE,GAAG,CACL;MAAA,CAAC,CAAC,CAAC,MAAM;YACP,YAAY,CACV,CAAC,YAAY,CACX,KAAK,CAAC,SAAS,CACf,aAAa,CAAC,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CACtC,MAAM,CAAC,CAAC;oBACN,kBAAkB;oBAClB,kBAAkB,EAAE,kBAAkB;oBACtC,YAAY,EAAE;wBACZ,IAAI,EAAE,iBAAiB;wBACvB,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE;4BACjB,eAAe,CAAC,IAAI,CAAC,CAAC;4BACtB,SAAS,CAAC,KAAK,CAAC,CAAC;wBACnB,CAAC;qBACF;oBACD,WAAW,EAAE;wBACX,IAAI,EAAE,SAAS;wBACf,QAAQ,EAAE,kBAAkB;qBAC7B;oBACD,eAAe,EAAE,CAAC,IAAI,EAAE,EAAE;wBACxB,IAAI,YAAY,EAAE,CAAC;4BACjB,YAAY,CAAC,IAAI,CAAC,CAAC;wBACrB,CAAC;oBACH,CAAC;oBACD,MAAM,EAAE,MAAM;iBACf,CAAC,EACF,EACF,QAAQ,CAAC,IAAI,CACd,CACL;IAAA,GAAG,CACJ,CAAC;AACJ,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"useSegments.d.ts","sourceRoot":"","sources":["../../src/hooks/useSegments.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,OAAO,EAAE,MAAM,kDAAkD,CAAC;AAE3E;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,OAAO,EAAE,CAezE"}
1
+ {"version":3,"file":"useSegments.d.ts","sourceRoot":"","sources":["../../src/hooks/useSegments.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,OAAO,EAAE,MAAM,kDAAkD,CAAC;AAE3E;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,OAAO,EAAE,CAczE"}
@@ -11,9 +11,8 @@ export function useSegments(pageTitles) {
11
11
  const searchParams = useSearchParams();
12
12
  const segments = pathname.split('/').filter((segment) => segment);
13
13
  const query = searchParams?.toString() ?? '';
14
- let accumulatedPath = '';
15
- return segments.map((segment) => {
16
- accumulatedPath += `/${segment}`;
14
+ return segments.map((segment, index) => {
15
+ const accumulatedPath = `/${segments.slice(0, index + 1).join('/')}`;
17
16
  const name = pageTitles[accumulatedPath] || segment; // Get title from prop
18
17
  return {
19
18
  path: query ? `${accumulatedPath}?${query}` : accumulatedPath,
@@ -1 +1 @@
1
- {"version":3,"file":"useSegments.js","sourceRoot":"","sources":["../../src/hooks/useSegments.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAG/D;;;;;GAKG;AACH,MAAM,UAAU,WAAW,CAAC,UAAkC;IAC5D,MAAM,QAAQ,GAAG,WAAW,EAAE,IAAI,cAAc,CAAC;IACjD,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACvC,MAAM,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC;IAClE,MAAM,KAAK,GAAG,YAAY,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;IAE7C,IAAI,eAAe,GAAG,EAAE,CAAC;IACzB,OAAO,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE;QAC9B,eAAe,IAAI,IAAI,OAAO,EAAE,CAAC;QACjC,MAAM,IAAI,GAAG,UAAU,CAAC,eAAe,CAAC,IAAI,OAAO,CAAC,CAAC,sBAAsB;QAC3E,OAAO;YACL,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,eAAe,IAAI,KAAK,EAAE,CAAC,CAAC,CAAC,eAAe;YAC7D,IAAI;SACL,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC"}
1
+ {"version":3,"file":"useSegments.js","sourceRoot":"","sources":["../../src/hooks/useSegments.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAG/D;;;;;GAKG;AACH,MAAM,UAAU,WAAW,CAAC,UAAkC;IAC5D,MAAM,QAAQ,GAAG,WAAW,EAAE,IAAI,cAAc,CAAC;IACjD,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACvC,MAAM,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC;IAClE,MAAM,KAAK,GAAG,YAAY,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;IAE7C,OAAO,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,KAAK,EAAE,EAAE;QACrC,MAAM,eAAe,GAAG,IAAI,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC;QACrE,MAAM,IAAI,GAAG,UAAU,CAAC,eAAe,CAAC,IAAI,OAAO,CAAC,CAAC,sBAAsB;QAC3E,OAAO;YACL,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,eAAe,IAAI,KAAK,EAAE,CAAC,CAAC,CAAC,eAAe;YAC7D,IAAI;SACL,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"useTheme.d.ts","sourceRoot":"","sources":["../../src/hooks/useTheme.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,SAAS,EAMV,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,KAAK,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAC;AAChD,MAAM,MAAM,aAAa,GAAG,OAAO,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC;AAErD,KAAK,iBAAiB,GAAG;IACvB,KAAK,EAAE,KAAK,CAAC;IACb,aAAa,EAAE,aAAa,CAAC;IAC7B,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;CAClC,CAAC;AAEF,KAAK,kBAAkB,GAAG;IACxB,QAAQ,EAAE,SAAS,CAAC;IACpB,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,KAAK,gBAAgB,GAAG,IAAI,CAC1B,kBAAkB,EAClB,cAAc,GAAG,YAAY,CAC9B,GAAG;IACF,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AA6BF,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,YAA4B,EAC5B,UAAgC,GACjC,EAAE,kBAAkB,GAAG,SAAS,CAoEhC;AAED,wBAAgB,QAAQ,IAAI,iBAAiB,CAQ5C;AAED,wBAAgB,WAAW,CAAC,EAC1B,YAA4B,EAC5B,UAAgC,EAChC,KAAK,GACN,EAAE,gBAAgB,GAAG,SAAS,CAU9B"}
1
+ {"version":3,"file":"useTheme.d.ts","sourceRoot":"","sources":["../../src/hooks/useTheme.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,SAAS,EAMV,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,KAAK,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAC;AAChD,MAAM,MAAM,aAAa,GAAG,OAAO,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC;AAErD,KAAK,iBAAiB,GAAG;IACvB,KAAK,EAAE,KAAK,CAAC;IACb,aAAa,EAAE,aAAa,CAAC;IAC7B,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;CAClC,CAAC;AAEF,KAAK,kBAAkB,GAAG;IACxB,QAAQ,EAAE,SAAS,CAAC;IACpB,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,KAAK,gBAAgB,GAAG,IAAI,CAC1B,kBAAkB,EAClB,cAAc,GAAG,YAAY,CAC9B,GAAG;IACF,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AA6BF,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,YAA4B,EAC5B,UAAgC,GACjC,EAAE,kBAAkB,GAAG,SAAS,CAqEhC;AAED,wBAAgB,QAAQ,IAAI,iBAAiB,CAQ5C;AAED,wBAAgB,WAAW,CAAC,EAC1B,YAA4B,EAC5B,UAAgC,EAChC,KAAK,GACN,EAAE,gBAAgB,GAAG,SAAS,CAU9B"}
@@ -42,6 +42,7 @@ export function ThemeProvider({ children, defaultTheme = DEFAULT_THEME, storageK
42
42
  // Use the configured default when storage is unavailable.
43
43
  }
44
44
  const initialTheme = isTheme(storedTheme) ? storedTheme : defaultTheme;
45
+ // eslint-disable-next-line react-hooks/set-state-in-effect -- localStorage is only readable on the client, after hydration
45
46
  setThemeState(initialTheme);
46
47
  setResolvedTheme(applyTheme(initialTheme));
47
48
  }, [defaultTheme, storageKey]);
@@ -1 +1 @@
1
- {"version":3,"file":"useTheme.jsx","sourceRoot":"","sources":["../../src/hooks/useTheme.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"useTheme.jsx","sourceRoot":"","sources":["../../src/hooks/useTheme.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,51 @@
1
+ import type { HTMLAttributes, ReactNode } from 'react';
2
+ import { type InlineMessageModifier } from '@clicoh/orion-library';
3
+ import type { ExpMascotName } from '../ExpMascot/catalog';
4
+ export type ExpBubbleTail = 'left' | 'right' | 'bottom';
5
+ export type ExpBubbleProps = {
6
+ title?: ReactNode;
7
+ /** Body text, under the title. */
8
+ children?: ReactNode;
9
+ /** Side the tail points to. With a `mascot`, the mascot sits on that side. */
10
+ tail?: ExpBubbleTail;
11
+ /** Sets the title larger, in the display font, when the scope uses `titles="playful"`. */
12
+ display?: boolean;
13
+ /** Short success note pinned under the text, such as a result. */
14
+ badge?: ReactNode;
15
+ mascot?: ExpMascotName;
16
+ mascotSize?: number;
17
+ /** Tone of the core `InlineMessage` rendered outside an `ExpScope`. */
18
+ fallbackModifier?: InlineMessageModifier;
19
+ } & Omit<HTMLAttributes<HTMLDivElement>, 'title'>;
20
+ /**
21
+ * Speech bubble with a tail, optionally spoken by a mascot. Use it for a short
22
+ * remark from the product (an empty state, a tip, a result), never for errors
23
+ * that block the user.
24
+ *
25
+ * It is a polite live region (`role="status"`). Outside an `ExpScope` it falls
26
+ * back to the core `InlineMessage`, with the title and the text in one line.
27
+ *
28
+ * @component
29
+ * @example
30
+ * <ExpBubble title="Nothing to review" mascot="oculus-08-satisfecho">
31
+ * Every case has an answer.
32
+ * </ExpBubble>
33
+ *
34
+ * @example
35
+ * // Above the mascot, with the title in the display font
36
+ * <ExpBubble tail="bottom" display title="Found it" mascot="fixi-06-celebrando" badge="Solved" />
37
+ *
38
+ * @param {Object} props - The properties of the ExpBubble component.
39
+ * @param {ReactNode} [props.title] - First line, in semibold.
40
+ * @param {ReactNode} [props.children] - Body text, under the title.
41
+ * @param {'left' | 'right' | 'bottom'} [props.tail='left'] - Side the tail points to, and the side of the mascot.
42
+ * @param {boolean} [props.display=false] - Larger title in the display font when the scope uses `titles="playful"`.
43
+ * @param {ReactNode} [props.badge] - Short success note under the text.
44
+ * @param {ExpMascotName} [props.mascot] - Mascot that speaks the bubble. Hidden when the scope hides mascots.
45
+ * @param {number} [props.mascotSize=64] - Mascot size, in pixels.
46
+ * @param {'info' | 'warning' | 'error' | 'success'} [props.fallbackModifier='info'] - Tone of the `InlineMessage` outside an `ExpScope`.
47
+ *
48
+ * @returns {ReactNode} The bubble, or an `InlineMessage` outside an `ExpScope`.
49
+ */
50
+ export declare function ExpBubble({ title, children, tail, display, badge, mascot, mascotSize, fallbackModifier, ...restProps }: ExpBubbleProps): ReactNode;
51
+ //# sourceMappingURL=ExpBubble.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ExpBubble.d.ts","sourceRoot":"","sources":["../../src/expresivo/ExpBubble/ExpBubble.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,uBAAuB,CAAC;AAG/B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAE1D,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;AAExD,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,8EAA8E;IAC9E,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,0FAA0F;IAC1F,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kEAAkE;IAClE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,uEAAuE;IACvE,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;CAC1C,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,CAAC;AAclD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,QAAQ,EACR,IAAa,EACb,OAAe,EACf,KAAK,EACL,MAAM,EACN,UAAe,EACf,gBAAyB,EACzB,GAAG,SAAS,EACb,EAAE,cAAc,GAAG,SAAS,CAsE5B"}
@@ -0,0 +1,74 @@
1
+ 'use client';
2
+ import clsx from 'clsx';
3
+ import { InlineMessage, } from '@clicoh/orion-library';
4
+ import { useExpScopeOptions } from '../ExpScope/ExpScope';
5
+ import { ExpMascot } from '../ExpMascot/ExpMascot';
6
+ const layoutMap = {
7
+ left: 'flex-row-reverse items-start',
8
+ right: 'flex-row items-start',
9
+ bottom: 'flex-col items-start',
10
+ };
11
+ const tailMap = {
12
+ left: '-left-1.5 top-[22px] border-t-0 border-r-0',
13
+ right: '-right-1.5 top-[22px] border-b-0 border-l-0',
14
+ bottom: '-bottom-1.5 left-7 border-t-0 border-l-0',
15
+ };
16
+ /**
17
+ * Speech bubble with a tail, optionally spoken by a mascot. Use it for a short
18
+ * remark from the product (an empty state, a tip, a result), never for errors
19
+ * that block the user.
20
+ *
21
+ * It is a polite live region (`role="status"`). Outside an `ExpScope` it falls
22
+ * back to the core `InlineMessage`, with the title and the text in one line.
23
+ *
24
+ * @component
25
+ * @example
26
+ * <ExpBubble title="Nothing to review" mascot="oculus-08-satisfecho">
27
+ * Every case has an answer.
28
+ * </ExpBubble>
29
+ *
30
+ * @example
31
+ * // Above the mascot, with the title in the display font
32
+ * <ExpBubble tail="bottom" display title="Found it" mascot="fixi-06-celebrando" badge="Solved" />
33
+ *
34
+ * @param {Object} props - The properties of the ExpBubble component.
35
+ * @param {ReactNode} [props.title] - First line, in semibold.
36
+ * @param {ReactNode} [props.children] - Body text, under the title.
37
+ * @param {'left' | 'right' | 'bottom'} [props.tail='left'] - Side the tail points to, and the side of the mascot.
38
+ * @param {boolean} [props.display=false] - Larger title in the display font when the scope uses `titles="playful"`.
39
+ * @param {ReactNode} [props.badge] - Short success note under the text.
40
+ * @param {ExpMascotName} [props.mascot] - Mascot that speaks the bubble. Hidden when the scope hides mascots.
41
+ * @param {number} [props.mascotSize=64] - Mascot size, in pixels.
42
+ * @param {'info' | 'warning' | 'error' | 'success'} [props.fallbackModifier='info'] - Tone of the `InlineMessage` outside an `ExpScope`.
43
+ *
44
+ * @returns {ReactNode} The bubble, or an `InlineMessage` outside an `ExpScope`.
45
+ */
46
+ export function ExpBubble({ title, children, tail = 'left', display = false, badge, mascot, mascotSize = 64, fallbackModifier = 'info', ...restProps }) {
47
+ const options = useExpScopeOptions();
48
+ if (!options) {
49
+ return (<InlineMessage {...restProps} modifier={fallbackModifier}>
50
+ {!!title && <strong className="font-semibold">{title} </strong>}
51
+ {children}
52
+ {!!badge && <> · {badge}</>}
53
+ </InlineMessage>);
54
+ }
55
+ const playfulTitle = display && options.titles === 'playful';
56
+ return (<div role="status" {...restProps} className={clsx('inline-flex gap-3', layoutMap[tail], restProps.className)}>
57
+ <div className="border-gray-5 dark:border-gray-1 relative max-w-[280px] rounded-lg border bg-white px-4 py-3 shadow-[0_2px_3px_rgba(34,35,41,0.08)] dark:bg-black">
58
+ <span aria-hidden="true" className={clsx('border-gray-5 dark:border-gray-1 absolute size-2.5 rotate-45 border bg-white dark:bg-black', tailMap[tail])}/>
59
+ {!!title && (<p className={clsx('font-semibold text-black dark:text-white', playfulTitle
60
+ ? 'font-(family-name:--exp-title-font) text-lg leading-6'
61
+ : 'text-sm leading-5')}>
62
+ {title}
63
+ </p>)}
64
+ {!!children && (<p className={clsx('text-gray-1 dark:text-gray-2 text-xs leading-[18px] text-pretty', !!title && 'mt-0.5')}>
65
+ {children}
66
+ </p>)}
67
+ {!!badge && (<span className="border-success text-success-strong dark:text-success mt-2 inline-flex rounded-full border px-2 py-px text-[11px] leading-4 font-semibold">
68
+ {badge}
69
+ </span>)}
70
+ </div>
71
+ {!!mascot && (<ExpMascot name={mascot} size={mascotSize} className={clsx(tail === 'bottom' && 'ml-2')}/>)}
72
+ </div>);
73
+ }
74
+ //# sourceMappingURL=ExpBubble.jsx.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ExpBubble.jsx","sourceRoot":"","sources":["../../src/expresivo/ExpBubble/ExpBubble.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,3 @@
1
+ export { ExpBubble } from './ExpBubble';
2
+ export type { ExpBubbleProps, ExpBubbleTail } from './ExpBubble';
3
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/expresivo/ExpBubble/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC"}
@@ -0,0 +1,2 @@
1
+ export { ExpBubble } from './ExpBubble';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/expresivo/ExpBubble/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC"}