@clicoh/orion-library 1.2.0-beta.2 → 1.2.0-beta.21
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.
- package/assets/avatares/caja-chispa.png +0 -0
- package/assets/avatares/caja.png +0 -0
- package/assets/avatares/cohete.png +0 -0
- package/assets/avatares/dino.png +0 -0
- package/assets/avatares/pulpo-lentes.png +0 -0
- package/assets/avatares/pulpo-verde.png +0 -0
- package/assets/avatares/pulpo.png +0 -0
- package/assets/cifras/alerta.png +0 -0
- package/assets/cifras/duda.png +0 -0
- package/assets/cifras/error.png +0 -0
- package/assets/cifras/monedas.png +0 -0
- package/assets/cifras/reloj.png +0 -0
- package/assets/cifras/visto.png +0 -0
- package/assets/css/expresivo.css +1069 -0
- package/assets/logos/oculus-icon.svg +1 -0
- package/assets/logos/oculus-logo-sm-dark.svg +1 -0
- package/assets/logos/oculus-logo-sm.svg +1 -0
- package/assets/mascotas/svg/bugi-mascota-01-alerta.svg +39 -0
- package/assets/mascotas/svg/bugi-mascota-02-investigando.svg +36 -0
- package/assets/mascotas/svg/bugi-mascota-05-sorprendido.svg +38 -0
- package/assets/mascotas/svg/oculus-mascota-01-feliz.svg +52 -0
- package/assets/mascotas/svg/oculus-mascota-02-investigando.svg +51 -0
- package/assets/mascotas/svg/oculus-mascota-03-dudando.svg +51 -0
- package/assets/mascotas/svg/oculus-mascota-04-analizando-documento.svg +53 -0
- package/assets/mascotas/svg/oculus-mascota-06-celebrando.svg +54 -0
- package/assets/mascotas/svg/oculus-mascota-07-buscando-rapido.svg +57 -0
- package/assets/mascotas/svg/oculus-mascota-08-satisfecho.svg +55 -0
- package/assets/mascotas/webp/fixi-mascota-01-feliz-sm.webp +0 -0
- package/assets/mascotas/webp/fixi-mascota-02-investigando-sm.webp +0 -0
- package/assets/mascotas/webp/fixi-mascota-03-dudando-sm.webp +0 -0
- package/assets/mascotas/webp/fixi-mascota-04-reparando-sm.webp +0 -0
- package/assets/mascotas/webp/fixi-mascota-05-sorprendido-sm.webp +0 -0
- package/assets/mascotas/webp/fixi-mascota-06-celebrando-sm.webp +0 -0
- package/assets/mascotas/webp/fixi-mascota-07-corriendo-sm.webp +0 -0
- package/dist/components/01-atoms/Button/Button.d.ts +21 -1
- package/dist/components/01-atoms/Button/Button.d.ts.map +1 -1
- package/dist/components/01-atoms/Button/Button.jsx +38 -4
- package/dist/components/01-atoms/Button/Button.jsx.map +1 -1
- package/dist/components/01-atoms/CodeBlock/CodeBlock.d.ts +56 -0
- package/dist/components/01-atoms/CodeBlock/CodeBlock.d.ts.map +1 -0
- package/dist/components/01-atoms/CodeBlock/CodeBlock.jsx +97 -0
- package/dist/components/01-atoms/CodeBlock/CodeBlock.jsx.map +1 -0
- package/dist/components/01-atoms/CodeBlock/index.d.ts +2 -0
- package/dist/components/01-atoms/CodeBlock/index.d.ts.map +1 -0
- package/dist/components/01-atoms/CodeBlock/index.js +2 -0
- package/dist/components/01-atoms/CodeBlock/index.js.map +1 -0
- package/dist/components/01-atoms/Heading/Heading.jsx +1 -1
- package/dist/components/01-atoms/Heading/Heading.jsx.map +1 -1
- package/dist/components/01-atoms/IconButton/IconButton.d.ts +28 -0
- package/dist/components/01-atoms/IconButton/IconButton.d.ts.map +1 -0
- package/dist/components/01-atoms/IconButton/IconButton.jsx +32 -0
- package/dist/components/01-atoms/IconButton/IconButton.jsx.map +1 -0
- package/dist/components/01-atoms/IconButton/index.d.ts +2 -0
- package/dist/components/01-atoms/IconButton/index.d.ts.map +1 -0
- package/dist/components/01-atoms/IconButton/index.js +2 -0
- package/dist/components/01-atoms/IconButton/index.js.map +1 -0
- package/dist/components/01-atoms/Input/Input.d.ts +1 -1
- package/dist/components/01-atoms/Input/Input.d.ts.map +1 -1
- package/dist/components/01-atoms/Input/Input.jsx +13 -9
- package/dist/components/01-atoms/Input/Input.jsx.map +1 -1
- package/dist/components/01-atoms/Input/utils/RenderErrorOrHelperText.d.ts.map +1 -1
- package/dist/components/01-atoms/Input/utils/RenderErrorOrHelperText.jsx +1 -1
- package/dist/components/01-atoms/Input/utils/RenderErrorOrHelperText.jsx.map +1 -1
- package/dist/components/01-atoms/MultiSelect/MultiSelect.d.ts.map +1 -1
- package/dist/components/01-atoms/MultiSelect/MultiSelect.jsx +2 -1
- package/dist/components/01-atoms/MultiSelect/MultiSelect.jsx.map +1 -1
- package/dist/components/01-atoms/ProgressBar/ProgressBar.d.ts +12 -1
- package/dist/components/01-atoms/ProgressBar/ProgressBar.d.ts.map +1 -1
- package/dist/components/01-atoms/ProgressBar/ProgressBar.jsx +18 -2
- package/dist/components/01-atoms/ProgressBar/ProgressBar.jsx.map +1 -1
- package/dist/components/01-atoms/Select/Select.d.ts +7 -1
- package/dist/components/01-atoms/Select/Select.d.ts.map +1 -1
- package/dist/components/01-atoms/Select/Select.jsx +61 -13
- package/dist/components/01-atoms/Select/Select.jsx.map +1 -1
- package/dist/components/01-atoms/Select/SelectList.d.ts +41 -0
- package/dist/components/01-atoms/Select/SelectList.d.ts.map +1 -0
- package/dist/components/01-atoms/Select/SelectList.jsx +116 -0
- package/dist/components/01-atoms/Select/SelectList.jsx.map +1 -0
- package/dist/components/01-atoms/SmallInput/SmallInput.d.ts.map +1 -1
- package/dist/components/01-atoms/SmallInput/SmallInput.jsx +1 -0
- package/dist/components/01-atoms/SmallInput/SmallInput.jsx.map +1 -1
- package/dist/components/01-atoms/Spinner/Spinner.d.ts +24 -3
- package/dist/components/01-atoms/Spinner/Spinner.d.ts.map +1 -1
- package/dist/components/01-atoms/Spinner/Spinner.jsx +30 -4
- package/dist/components/01-atoms/Spinner/Spinner.jsx.map +1 -1
- package/dist/components/01-atoms/Spinner/index.d.ts +1 -0
- package/dist/components/01-atoms/Spinner/index.d.ts.map +1 -1
- package/dist/components/01-atoms/Stat/Stat.d.ts +47 -0
- package/dist/components/01-atoms/Stat/Stat.d.ts.map +1 -0
- package/dist/components/01-atoms/Stat/Stat.jsx +64 -0
- package/dist/components/01-atoms/Stat/Stat.jsx.map +1 -0
- package/dist/components/01-atoms/Stat/index.d.ts +2 -0
- package/dist/components/01-atoms/Stat/index.d.ts.map +1 -0
- package/dist/components/01-atoms/Stat/index.js +2 -0
- package/dist/components/01-atoms/Stat/index.js.map +1 -0
- package/dist/components/01-atoms/Switch/Switch.d.ts +5 -2
- package/dist/components/01-atoms/Switch/Switch.d.ts.map +1 -1
- package/dist/components/01-atoms/Switch/Switch.jsx +15 -12
- package/dist/components/01-atoms/Switch/Switch.jsx.map +1 -1
- package/dist/components/01-atoms/Textarea/Textarea.d.ts +38 -0
- package/dist/components/01-atoms/Textarea/Textarea.d.ts.map +1 -0
- package/dist/components/01-atoms/Textarea/Textarea.jsx +50 -0
- package/dist/components/01-atoms/Textarea/Textarea.jsx.map +1 -0
- package/dist/components/01-atoms/Textarea/index.d.ts +2 -0
- package/dist/components/01-atoms/Textarea/index.d.ts.map +1 -0
- package/dist/components/01-atoms/Textarea/index.js +2 -0
- package/dist/components/01-atoms/Textarea/index.js.map +1 -0
- package/dist/components/01-atoms/Toast/Toast.d.ts.map +1 -1
- package/dist/components/01-atoms/Toast/Toast.jsx +3 -1
- package/dist/components/01-atoms/Toast/Toast.jsx.map +1 -1
- package/dist/components/01-atoms/Tooltip/Tooltip.d.ts.map +1 -1
- package/dist/components/01-atoms/Tooltip/Tooltip.jsx +4 -1
- package/dist/components/01-atoms/Tooltip/Tooltip.jsx.map +1 -1
- package/dist/components/01-atoms/index.d.ts +4 -0
- package/dist/components/01-atoms/index.d.ts.map +1 -1
- package/dist/components/01-atoms/index.js +4 -0
- package/dist/components/01-atoms/index.js.map +1 -1
- package/dist/components/02-molecules/Accordion/Accordion.d.ts +15 -4
- package/dist/components/02-molecules/Accordion/Accordion.d.ts.map +1 -1
- package/dist/components/02-molecules/Accordion/Accordion.jsx +20 -6
- package/dist/components/02-molecules/Accordion/Accordion.jsx.map +1 -1
- package/dist/components/02-molecules/Accordion/AccordionContext.d.ts +5 -1
- package/dist/components/02-molecules/Accordion/AccordionContext.d.ts.map +1 -1
- package/dist/components/02-molecules/Accordion/AccordionContext.jsx +7 -6
- package/dist/components/02-molecules/Accordion/AccordionContext.jsx.map +1 -1
- package/dist/components/02-molecules/Accordion/AccordionSection.d.ts +2 -1
- package/dist/components/02-molecules/Accordion/AccordionSection.d.ts.map +1 -1
- package/dist/components/02-molecules/Accordion/AccordionSection.jsx +62 -11
- package/dist/components/02-molecules/Accordion/AccordionSection.jsx.map +1 -1
- package/dist/components/02-molecules/Accordion/index.d.ts +1 -0
- package/dist/components/02-molecules/Accordion/index.d.ts.map +1 -1
- package/dist/components/02-molecules/Accordion/index.js.map +1 -1
- package/dist/components/02-molecules/Autocomplete/Autocomplete.d.ts +4 -1
- package/dist/components/02-molecules/Autocomplete/Autocomplete.d.ts.map +1 -1
- package/dist/components/02-molecules/Autocomplete/Autocomplete.jsx +34 -15
- package/dist/components/02-molecules/Autocomplete/Autocomplete.jsx.map +1 -1
- package/dist/components/02-molecules/Card/Card.d.ts +74 -0
- package/dist/components/02-molecules/Card/Card.d.ts.map +1 -0
- package/dist/components/02-molecules/Card/Card.jsx +87 -0
- package/dist/components/02-molecules/Card/Card.jsx.map +1 -0
- package/dist/components/02-molecules/Card/index.d.ts +2 -0
- package/dist/components/02-molecules/Card/index.d.ts.map +1 -0
- package/dist/components/02-molecules/Card/index.js +2 -0
- package/dist/components/02-molecules/Card/index.js.map +1 -0
- package/dist/components/02-molecules/DatePicker/DatePicker.d.ts +41 -3
- package/dist/components/02-molecules/DatePicker/DatePicker.d.ts.map +1 -1
- package/dist/components/02-molecules/DatePicker/DatePicker.jsx +190 -34
- package/dist/components/02-molecules/DatePicker/DatePicker.jsx.map +1 -1
- package/dist/components/02-molecules/Dropdown/Dropdown.d.ts.map +1 -1
- package/dist/components/02-molecules/Dropdown/Dropdown.jsx +1 -0
- package/dist/components/02-molecules/Dropdown/Dropdown.jsx.map +1 -1
- package/dist/components/02-molecules/EmptyState/EmptyState.d.ts +52 -0
- package/dist/components/02-molecules/EmptyState/EmptyState.d.ts.map +1 -0
- package/dist/components/02-molecules/EmptyState/EmptyState.jsx +66 -0
- package/dist/components/02-molecules/EmptyState/EmptyState.jsx.map +1 -0
- package/dist/components/02-molecules/EmptyState/index.d.ts +2 -0
- package/dist/components/02-molecules/EmptyState/index.d.ts.map +1 -0
- package/dist/components/02-molecules/EmptyState/index.js +2 -0
- package/dist/components/02-molecules/EmptyState/index.js.map +1 -0
- package/dist/components/02-molecules/Filter/Filter.d.ts +8 -1
- package/dist/components/02-molecules/Filter/Filter.d.ts.map +1 -1
- package/dist/components/02-molecules/Filter/Filter.jsx +35 -11
- package/dist/components/02-molecules/Filter/Filter.jsx.map +1 -1
- package/dist/components/02-molecules/Filter/index.d.ts +1 -0
- package/dist/components/02-molecules/Filter/index.d.ts.map +1 -1
- package/dist/components/02-molecules/Filter/index.js +1 -0
- package/dist/components/02-molecules/Filter/index.js.map +1 -1
- package/dist/components/02-molecules/Filter/types.d.ts +24 -5
- package/dist/components/02-molecules/Filter/types.d.ts.map +1 -1
- package/dist/components/02-molecules/Filter/utils/pruneOrphanValues.d.ts +34 -0
- package/dist/components/02-molecules/Filter/utils/pruneOrphanValues.d.ts.map +1 -0
- package/dist/components/02-molecules/Filter/utils/pruneOrphanValues.js +70 -0
- package/dist/components/02-molecules/Filter/utils/pruneOrphanValues.js.map +1 -0
- package/dist/components/02-molecules/ImageViewer/ImageViewer.d.ts +55 -5
- package/dist/components/02-molecules/ImageViewer/ImageViewer.d.ts.map +1 -1
- package/dist/components/02-molecules/ImageViewer/ImageViewer.jsx +118 -27
- package/dist/components/02-molecules/ImageViewer/ImageViewer.jsx.map +1 -1
- package/dist/components/02-molecules/ImageViewer/ImageViewerImage.d.ts +40 -0
- package/dist/components/02-molecules/ImageViewer/ImageViewerImage.d.ts.map +1 -0
- package/dist/components/02-molecules/ImageViewer/ImageViewerImage.jsx +109 -0
- package/dist/components/02-molecules/ImageViewer/ImageViewerImage.jsx.map +1 -0
- package/dist/components/02-molecules/InlineMessage/InlineMessage.d.ts +15 -1
- package/dist/components/02-molecules/InlineMessage/InlineMessage.d.ts.map +1 -1
- package/dist/components/02-molecules/InlineMessage/InlineMessage.jsx +18 -3
- package/dist/components/02-molecules/InlineMessage/InlineMessage.jsx.map +1 -1
- package/dist/components/02-molecules/Menu/MenuItem.d.ts.map +1 -1
- package/dist/components/02-molecules/Menu/MenuItem.jsx +2 -2
- package/dist/components/02-molecules/Menu/MenuItem.jsx.map +1 -1
- package/dist/components/02-molecules/Menu/MenuList.d.ts.map +1 -1
- package/dist/components/02-molecules/Menu/MenuList.jsx +1 -1
- package/dist/components/02-molecules/Menu/MenuList.jsx.map +1 -1
- package/dist/components/02-molecules/Modal/Modal.d.ts +5 -1
- package/dist/components/02-molecules/Modal/Modal.d.ts.map +1 -1
- package/dist/components/02-molecules/Modal/Modal.jsx +4 -2
- package/dist/components/02-molecules/Modal/Modal.jsx.map +1 -1
- package/dist/components/02-molecules/MultiAutocomplete/MultiAutocomplete.d.ts +80 -0
- package/dist/components/02-molecules/MultiAutocomplete/MultiAutocomplete.d.ts.map +1 -0
- package/dist/components/02-molecules/MultiAutocomplete/MultiAutocomplete.jsx +261 -0
- package/dist/components/02-molecules/MultiAutocomplete/MultiAutocomplete.jsx.map +1 -0
- package/dist/components/02-molecules/MultiAutocomplete/index.d.ts +2 -0
- package/dist/components/02-molecules/MultiAutocomplete/index.d.ts.map +1 -0
- package/dist/components/02-molecules/MultiAutocomplete/index.js +2 -0
- package/dist/components/02-molecules/MultiAutocomplete/index.js.map +1 -0
- package/dist/components/02-molecules/Stepper/Stepper.d.ts +70 -0
- package/dist/components/02-molecules/Stepper/Stepper.d.ts.map +1 -0
- package/dist/components/02-molecules/Stepper/Stepper.jsx +204 -0
- package/dist/components/02-molecules/Stepper/Stepper.jsx.map +1 -0
- package/dist/components/02-molecules/Stepper/index.d.ts +2 -0
- package/dist/components/02-molecules/Stepper/index.d.ts.map +1 -0
- package/dist/components/02-molecules/Stepper/index.js +2 -0
- package/dist/components/02-molecules/Stepper/index.js.map +1 -0
- package/dist/components/02-molecules/Table/Table.d.ts +3 -1
- package/dist/components/02-molecules/Table/Table.d.ts.map +1 -1
- package/dist/components/02-molecules/Table/Table.jsx +6 -5
- package/dist/components/02-molecules/Table/Table.jsx.map +1 -1
- package/dist/components/02-molecules/Timeline/Timeline.d.ts +47 -0
- package/dist/components/02-molecules/Timeline/Timeline.d.ts.map +1 -0
- package/dist/components/02-molecules/Timeline/Timeline.jsx +65 -0
- package/dist/components/02-molecules/Timeline/Timeline.jsx.map +1 -0
- package/dist/components/02-molecules/Timeline/index.d.ts +2 -0
- package/dist/components/02-molecules/Timeline/index.d.ts.map +1 -0
- package/dist/components/02-molecules/Timeline/index.js +2 -0
- package/dist/components/02-molecules/Timeline/index.js.map +1 -0
- package/dist/components/02-molecules/index.d.ts +5 -0
- package/dist/components/02-molecules/index.d.ts.map +1 -1
- package/dist/components/02-molecules/index.js +5 -0
- package/dist/components/02-molecules/index.js.map +1 -1
- package/dist/components/03-organisms/DataTable/DataTable.d.ts +1 -1
- package/dist/components/03-organisms/DataTable/DataTable.d.ts.map +1 -1
- package/dist/components/03-organisms/DataTable/DataTable.jsx +1 -1
- package/dist/components/03-organisms/DataTable/DataTable.jsx.map +1 -1
- package/dist/components/03-organisms/Header/Header.d.ts +3 -1
- package/dist/components/03-organisms/Header/Header.d.ts.map +1 -1
- package/dist/components/03-organisms/Header/Header.jsx +4 -5
- package/dist/components/03-organisms/Header/Header.jsx.map +1 -1
- package/dist/components/03-organisms/MapView/MapView.d.ts +14 -3
- package/dist/components/03-organisms/MapView/MapView.d.ts.map +1 -1
- package/dist/components/03-organisms/MapView/MapView.jsx +40 -9
- package/dist/components/03-organisms/MapView/MapView.jsx.map +1 -1
- package/dist/components/03-organisms/ModalMultiple/ModalMultiple.d.ts.map +1 -1
- package/dist/components/03-organisms/ModalMultiple/ModalMultiple.jsx +1 -0
- package/dist/components/03-organisms/ModalMultiple/ModalMultiple.jsx.map +1 -1
- package/dist/components/04-templates/DashboardTemplate/DashboardTemplate.d.ts +36 -4
- package/dist/components/04-templates/DashboardTemplate/DashboardTemplate.d.ts.map +1 -1
- package/dist/components/04-templates/DashboardTemplate/DashboardTemplate.jsx +44 -10
- package/dist/components/04-templates/DashboardTemplate/DashboardTemplate.jsx.map +1 -1
- package/dist/components/04-templates/DashboardTemplate/HeadingWithTitle.d.ts +6 -2
- package/dist/components/04-templates/DashboardTemplate/HeadingWithTitle.d.ts.map +1 -1
- package/dist/components/04-templates/DashboardTemplate/HeadingWithTitle.jsx +7 -3
- package/dist/components/04-templates/DashboardTemplate/HeadingWithTitle.jsx.map +1 -1
- package/dist/components/04-templates/LoginTemplate/LoginForm.d.ts +66 -3
- package/dist/components/04-templates/LoginTemplate/LoginForm.d.ts.map +1 -1
- package/dist/components/04-templates/LoginTemplate/LoginForm.jsx +80 -16
- package/dist/components/04-templates/LoginTemplate/LoginForm.jsx.map +1 -1
- package/dist/components/04-templates/LoginTemplate/LoginTemplate.d.ts +24 -4
- package/dist/components/04-templates/LoginTemplate/LoginTemplate.d.ts.map +1 -1
- package/dist/components/04-templates/LoginTemplate/LoginTemplate.jsx +27 -7
- package/dist/components/04-templates/LoginTemplate/LoginTemplate.jsx.map +1 -1
- package/dist/components/04-templates/LoginTemplate/index.d.ts +1 -0
- package/dist/components/04-templates/LoginTemplate/index.d.ts.map +1 -1
- package/dist/components/04-templates/SideFilterTemplate/SideFilterTemplate.d.ts.map +1 -1
- package/dist/components/04-templates/SideFilterTemplate/SideFilterTemplate.jsx +4 -1
- package/dist/components/04-templates/SideFilterTemplate/SideFilterTemplate.jsx.map +1 -1
- package/dist/hooks/useSegments.d.ts.map +1 -1
- package/dist/hooks/useSegments.js +2 -3
- package/dist/hooks/useSegments.js.map +1 -1
- package/dist/hooks/useTheme.d.ts.map +1 -1
- package/dist/hooks/useTheme.jsx +1 -0
- package/dist/hooks/useTheme.jsx.map +1 -1
- package/expresivo/ExpBubble/ExpBubble.d.ts +51 -0
- package/expresivo/ExpBubble/ExpBubble.d.ts.map +1 -0
- package/expresivo/ExpBubble/ExpBubble.jsx +74 -0
- package/expresivo/ExpBubble/ExpBubble.jsx.map +1 -0
- package/expresivo/ExpBubble/index.d.ts +3 -0
- package/expresivo/ExpBubble/index.d.ts.map +1 -0
- package/expresivo/ExpBubble/index.js +2 -0
- package/expresivo/ExpBubble/index.js.map +1 -0
- package/expresivo/ExpChip/ExpChip.d.ts +40 -0
- package/expresivo/ExpChip/ExpChip.d.ts.map +1 -0
- package/expresivo/ExpChip/ExpChip.jsx +67 -0
- package/expresivo/ExpChip/ExpChip.jsx.map +1 -0
- package/expresivo/ExpChip/index.d.ts +3 -0
- package/expresivo/ExpChip/index.d.ts.map +1 -0
- package/expresivo/ExpChip/index.js +2 -0
- package/expresivo/ExpChip/index.js.map +1 -0
- package/expresivo/ExpCollapseToggle/ExpCollapseToggle.d.ts +37 -0
- package/expresivo/ExpCollapseToggle/ExpCollapseToggle.d.ts.map +1 -0
- package/expresivo/ExpCollapseToggle/ExpCollapseToggle.jsx +43 -0
- package/expresivo/ExpCollapseToggle/ExpCollapseToggle.jsx.map +1 -0
- package/expresivo/ExpCollapseToggle/index.d.ts +3 -0
- package/expresivo/ExpCollapseToggle/index.d.ts.map +1 -0
- package/expresivo/ExpCollapseToggle/index.js +2 -0
- package/expresivo/ExpCollapseToggle/index.js.map +1 -0
- package/expresivo/ExpEnterIcon/ExpEnterIcon.d.ts +32 -0
- package/expresivo/ExpEnterIcon/ExpEnterIcon.d.ts.map +1 -0
- package/expresivo/ExpEnterIcon/ExpEnterIcon.jsx +32 -0
- package/expresivo/ExpEnterIcon/ExpEnterIcon.jsx.map +1 -0
- package/expresivo/ExpEnterIcon/index.d.ts +3 -0
- package/expresivo/ExpEnterIcon/index.d.ts.map +1 -0
- package/expresivo/ExpEnterIcon/index.js +2 -0
- package/expresivo/ExpEnterIcon/index.js.map +1 -0
- package/expresivo/ExpGrowBar/ExpGrowBar.d.ts +26 -0
- package/expresivo/ExpGrowBar/ExpGrowBar.d.ts.map +1 -0
- package/expresivo/ExpGrowBar/ExpGrowBar.jsx +39 -0
- package/expresivo/ExpGrowBar/ExpGrowBar.jsx.map +1 -0
- package/expresivo/ExpGrowBar/index.d.ts +3 -0
- package/expresivo/ExpGrowBar/index.d.ts.map +1 -0
- package/expresivo/ExpGrowBar/index.js +2 -0
- package/expresivo/ExpGrowBar/index.js.map +1 -0
- package/expresivo/ExpJourneyTrack/ExpJourneyTrack.d.ts +69 -0
- package/expresivo/ExpJourneyTrack/ExpJourneyTrack.d.ts.map +1 -0
- package/expresivo/ExpJourneyTrack/ExpJourneyTrack.jsx +160 -0
- package/expresivo/ExpJourneyTrack/ExpJourneyTrack.jsx.map +1 -0
- package/expresivo/ExpJourneyTrack/index.d.ts +3 -0
- package/expresivo/ExpJourneyTrack/index.d.ts.map +1 -0
- package/expresivo/ExpJourneyTrack/index.js +2 -0
- package/expresivo/ExpJourneyTrack/index.js.map +1 -0
- package/expresivo/ExpKeyButton/ExpKeyButton.d.ts +49 -0
- package/expresivo/ExpKeyButton/ExpKeyButton.d.ts.map +1 -0
- package/expresivo/ExpKeyButton/ExpKeyButton.jsx +60 -0
- package/expresivo/ExpKeyButton/ExpKeyButton.jsx.map +1 -0
- package/expresivo/ExpKeyButton/index.d.ts +3 -0
- package/expresivo/ExpKeyButton/index.d.ts.map +1 -0
- package/expresivo/ExpKeyButton/index.js +2 -0
- package/expresivo/ExpKeyButton/index.js.map +1 -0
- package/expresivo/ExpLadder/ExpLadder.d.ts +42 -0
- package/expresivo/ExpLadder/ExpLadder.d.ts.map +1 -0
- package/expresivo/ExpLadder/ExpLadder.jsx +82 -0
- package/expresivo/ExpLadder/ExpLadder.jsx.map +1 -0
- package/expresivo/ExpLadder/index.d.ts +3 -0
- package/expresivo/ExpLadder/index.d.ts.map +1 -0
- package/expresivo/ExpLadder/index.js +2 -0
- package/expresivo/ExpLadder/index.js.map +1 -0
- package/expresivo/ExpLensIcon/ExpLensIcon.d.ts +29 -0
- package/expresivo/ExpLensIcon/ExpLensIcon.d.ts.map +1 -0
- package/expresivo/ExpLensIcon/ExpLensIcon.jsx +29 -0
- package/expresivo/ExpLensIcon/ExpLensIcon.jsx.map +1 -0
- package/expresivo/ExpLensIcon/index.d.ts +3 -0
- package/expresivo/ExpLensIcon/index.d.ts.map +1 -0
- package/expresivo/ExpLensIcon/index.js +2 -0
- package/expresivo/ExpLensIcon/index.js.map +1 -0
- package/expresivo/ExpLogo/ExpLogo.d.ts +33 -0
- package/expresivo/ExpLogo/ExpLogo.d.ts.map +1 -0
- package/expresivo/ExpLogo/ExpLogo.jsx +42 -0
- package/expresivo/ExpLogo/ExpLogo.jsx.map +1 -0
- package/expresivo/ExpLogo/catalog.d.ts +17 -0
- package/expresivo/ExpLogo/catalog.d.ts.map +1 -0
- package/expresivo/ExpLogo/catalog.js +11 -0
- package/expresivo/ExpLogo/catalog.js.map +1 -0
- package/expresivo/ExpLogo/index.d.ts +4 -0
- package/expresivo/ExpLogo/index.d.ts.map +1 -0
- package/expresivo/ExpLogo/index.js +2 -0
- package/expresivo/ExpLogo/index.js.map +1 -0
- package/expresivo/ExpMascot/ExpMascot.d.ts +42 -0
- package/expresivo/ExpMascot/ExpMascot.d.ts.map +1 -0
- package/expresivo/ExpMascot/ExpMascot.jsx +46 -0
- package/expresivo/ExpMascot/ExpMascot.jsx.map +1 -0
- package/expresivo/ExpMascot/catalog.d.ts +12 -0
- package/expresivo/ExpMascot/catalog.d.ts.map +1 -0
- package/expresivo/ExpMascot/catalog.js +41 -0
- package/expresivo/ExpMascot/catalog.js.map +1 -0
- package/expresivo/ExpMascot/index.d.ts +4 -0
- package/expresivo/ExpMascot/index.d.ts.map +1 -0
- package/expresivo/ExpMascot/index.js +2 -0
- package/expresivo/ExpMascot/index.js.map +1 -0
- package/expresivo/ExpMedalBadge/ExpMedalBadge.d.ts +29 -0
- package/expresivo/ExpMedalBadge/ExpMedalBadge.d.ts.map +1 -0
- package/expresivo/ExpMedalBadge/ExpMedalBadge.jsx +87 -0
- package/expresivo/ExpMedalBadge/ExpMedalBadge.jsx.map +1 -0
- package/expresivo/ExpMedalBadge/index.d.ts +3 -0
- package/expresivo/ExpMedalBadge/index.d.ts.map +1 -0
- package/expresivo/ExpMedalBadge/index.js +2 -0
- package/expresivo/ExpMedalBadge/index.js.map +1 -0
- package/expresivo/ExpPageHero/ExpPageHero.d.ts +82 -0
- package/expresivo/ExpPageHero/ExpPageHero.d.ts.map +1 -0
- package/expresivo/ExpPageHero/ExpPageHero.jsx +113 -0
- package/expresivo/ExpPageHero/ExpPageHero.jsx.map +1 -0
- package/expresivo/ExpPageHero/index.d.ts +3 -0
- package/expresivo/ExpPageHero/index.d.ts.map +1 -0
- package/expresivo/ExpPageHero/index.js +2 -0
- package/expresivo/ExpPageHero/index.js.map +1 -0
- package/expresivo/ExpPeek/ExpPeek.d.ts +56 -0
- package/expresivo/ExpPeek/ExpPeek.d.ts.map +1 -0
- package/expresivo/ExpPeek/ExpPeek.jsx +131 -0
- package/expresivo/ExpPeek/ExpPeek.jsx.map +1 -0
- package/expresivo/ExpPeek/index.d.ts +3 -0
- package/expresivo/ExpPeek/index.d.ts.map +1 -0
- package/expresivo/ExpPeek/index.js +2 -0
- package/expresivo/ExpPeek/index.js.map +1 -0
- package/expresivo/ExpPillButton/ExpPillButton.d.ts +47 -0
- package/expresivo/ExpPillButton/ExpPillButton.d.ts.map +1 -0
- package/expresivo/ExpPillButton/ExpPillButton.jsx +77 -0
- package/expresivo/ExpPillButton/ExpPillButton.jsx.map +1 -0
- package/expresivo/ExpPillButton/index.d.ts +3 -0
- package/expresivo/ExpPillButton/index.d.ts.map +1 -0
- package/expresivo/ExpPillButton/index.js +2 -0
- package/expresivo/ExpPillButton/index.js.map +1 -0
- package/expresivo/ExpRepoAvatar/ExpRepoAvatar.d.ts +28 -0
- package/expresivo/ExpRepoAvatar/ExpRepoAvatar.d.ts.map +1 -0
- package/expresivo/ExpRepoAvatar/ExpRepoAvatar.jsx +32 -0
- package/expresivo/ExpRepoAvatar/ExpRepoAvatar.jsx.map +1 -0
- package/expresivo/ExpRepoAvatar/catalog.d.ts +6 -0
- package/expresivo/ExpRepoAvatar/catalog.d.ts.map +1 -0
- package/expresivo/ExpRepoAvatar/catalog.js +18 -0
- package/expresivo/ExpRepoAvatar/catalog.js.map +1 -0
- package/expresivo/ExpRepoAvatar/index.d.ts +4 -0
- package/expresivo/ExpRepoAvatar/index.d.ts.map +1 -0
- package/expresivo/ExpRepoAvatar/index.js +2 -0
- package/expresivo/ExpRepoAvatar/index.js.map +1 -0
- package/expresivo/ExpScope/ExpScope.d.ts +63 -0
- package/expresivo/ExpScope/ExpScope.d.ts.map +1 -0
- package/expresivo/ExpScope/ExpScope.jsx +67 -0
- package/expresivo/ExpScope/ExpScope.jsx.map +1 -0
- package/expresivo/ExpScope/index.d.ts +3 -0
- package/expresivo/ExpScope/index.d.ts.map +1 -0
- package/expresivo/ExpScope/index.js +2 -0
- package/expresivo/ExpScope/index.js.map +1 -0
- package/expresivo/ExpScoreRing/ExpScoreRing.d.ts +35 -0
- package/expresivo/ExpScoreRing/ExpScoreRing.d.ts.map +1 -0
- package/expresivo/ExpScoreRing/ExpScoreRing.jsx +67 -0
- package/expresivo/ExpScoreRing/ExpScoreRing.jsx.map +1 -0
- package/expresivo/ExpScoreRing/index.d.ts +3 -0
- package/expresivo/ExpScoreRing/index.d.ts.map +1 -0
- package/expresivo/ExpScoreRing/index.js +2 -0
- package/expresivo/ExpScoreRing/index.js.map +1 -0
- package/expresivo/ExpSearchField/ExpSearchField.d.ts +49 -0
- package/expresivo/ExpSearchField/ExpSearchField.d.ts.map +1 -0
- package/expresivo/ExpSearchField/ExpSearchField.jsx +81 -0
- package/expresivo/ExpSearchField/ExpSearchField.jsx.map +1 -0
- package/expresivo/ExpSearchField/index.d.ts +3 -0
- package/expresivo/ExpSearchField/index.d.ts.map +1 -0
- package/expresivo/ExpSearchField/index.js +2 -0
- package/expresivo/ExpSearchField/index.js.map +1 -0
- package/expresivo/ExpStatIcon/ExpStatIcon.d.ts +25 -0
- package/expresivo/ExpStatIcon/ExpStatIcon.d.ts.map +1 -0
- package/expresivo/ExpStatIcon/ExpStatIcon.jsx +29 -0
- package/expresivo/ExpStatIcon/ExpStatIcon.jsx.map +1 -0
- package/expresivo/ExpStatIcon/catalog.d.ts +6 -0
- package/expresivo/ExpStatIcon/catalog.d.ts.map +1 -0
- package/expresivo/ExpStatIcon/catalog.js +16 -0
- package/expresivo/ExpStatIcon/catalog.js.map +1 -0
- package/expresivo/ExpStatIcon/index.d.ts +4 -0
- package/expresivo/ExpStatIcon/index.d.ts.map +1 -0
- package/expresivo/ExpStatIcon/index.js +2 -0
- package/expresivo/ExpStatIcon/index.js.map +1 -0
- package/expresivo/ExpStepBadge/ExpStepBadge.d.ts +25 -0
- package/expresivo/ExpStepBadge/ExpStepBadge.d.ts.map +1 -0
- package/expresivo/ExpStepBadge/ExpStepBadge.jsx +30 -0
- package/expresivo/ExpStepBadge/ExpStepBadge.jsx.map +1 -0
- package/expresivo/ExpStepBadge/index.d.ts +2 -0
- package/expresivo/ExpStepBadge/index.d.ts.map +1 -0
- package/expresivo/ExpStepBadge/index.js +2 -0
- package/expresivo/ExpStepBadge/index.js.map +1 -0
- package/expresivo/index.d.ts +22 -0
- package/expresivo/index.d.ts.map +1 -0
- package/expresivo/index.js +22 -0
- package/expresivo/index.js.map +1 -0
- package/expresivo/shared/glyphs.d.ts +20 -0
- package/expresivo/shared/glyphs.d.ts.map +1 -0
- package/expresivo/shared/glyphs.jsx +60 -0
- package/expresivo/shared/glyphs.jsx.map +1 -0
- package/package.json +6 -4
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
import { type HTMLAttributes, type ReactNode } from 'react';
|
|
2
|
+
/** Inclusive range of line numbers, counted from `startLine`. */
|
|
3
|
+
export type CodeBlockRange = [from: number, to: number];
|
|
4
|
+
export type CodeBlockProps = {
|
|
5
|
+
/** The source to show, as plain text. */
|
|
6
|
+
code: string;
|
|
7
|
+
/** Accessible name and tooltip of the copy button. */
|
|
8
|
+
copyLabel: string;
|
|
9
|
+
/** Replaces `copyLabel` for a moment after copying, and is announced. */
|
|
10
|
+
copiedLabel: string;
|
|
11
|
+
/** Shown in the header (`ts`, `sql`, `diff`). No syntax coloring is applied. */
|
|
12
|
+
language?: string;
|
|
13
|
+
/** Number of the first line. Line numbers are shown only when it is set. */
|
|
14
|
+
startLine?: number;
|
|
15
|
+
/** Lines to emphasize, as inclusive ranges in the same numbering. */
|
|
16
|
+
highlight?: CodeBlockRange[];
|
|
17
|
+
/** Called when the browser refuses to write to the clipboard. */
|
|
18
|
+
onCopyError?: (error: unknown) => void;
|
|
19
|
+
} & Omit<HTMLAttributes<HTMLDivElement>, 'children'>;
|
|
20
|
+
/**
|
|
21
|
+
* Read-only block of source code with a copy button. Shows an excerpt
|
|
22
|
+
* exactly as written: monospace, no wrapping, horizontal scroll when a line
|
|
23
|
+
* is longer than the block.
|
|
24
|
+
*
|
|
25
|
+
* Setting `startLine` numbers the lines, so an excerpt from the middle of a
|
|
26
|
+
* file keeps its real line numbers; `highlight` then marks ranges in that
|
|
27
|
+
* same numbering. There is no syntax coloring.
|
|
28
|
+
*
|
|
29
|
+
* Copying uses the Clipboard API, which browsers only expose on secure
|
|
30
|
+
* origins (`https` or `localhost`). When it fails the button stays as it was
|
|
31
|
+
* and `onCopyError` receives the reason.
|
|
32
|
+
*
|
|
33
|
+
* @component
|
|
34
|
+
* @example
|
|
35
|
+
* <CodeBlock
|
|
36
|
+
* code={excerpt}
|
|
37
|
+
* language="ts"
|
|
38
|
+
* startLine={940}
|
|
39
|
+
* highlight={[[943, 943]]}
|
|
40
|
+
* copyLabel="Copy code"
|
|
41
|
+
* copiedLabel="Copied"
|
|
42
|
+
* />
|
|
43
|
+
*
|
|
44
|
+
* @param {Object} props - The properties of the CodeBlock component.
|
|
45
|
+
* @param {string} props.code - The source to show, as plain text.
|
|
46
|
+
* @param {string} props.copyLabel - Accessible name and tooltip of the copy button.
|
|
47
|
+
* @param {string} props.copiedLabel - Shown and announced right after copying.
|
|
48
|
+
* @param {string} [props.language] - Label shown in the header.
|
|
49
|
+
* @param {number} [props.startLine] - Number of the first line; enables line numbers.
|
|
50
|
+
* @param {CodeBlockRange[]} [props.highlight=[]] - Inclusive line ranges to emphasize.
|
|
51
|
+
* @param {(error: unknown) => void} [props.onCopyError] - Called when the clipboard write fails.
|
|
52
|
+
*
|
|
53
|
+
* @returns {ReactNode} The rendered CodeBlock component.
|
|
54
|
+
*/
|
|
55
|
+
export declare function CodeBlock({ code, copyLabel, copiedLabel, language, startLine, highlight, onCopyError, ...restProps }: CodeBlockProps): ReactNode;
|
|
56
|
+
//# sourceMappingURL=CodeBlock.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CodeBlock.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/CodeBlock/CodeBlock.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,SAAS,EAIf,MAAM,OAAO,CAAC;AAKf,iEAAiE;AACjE,MAAM,MAAM,cAAc,GAAG,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,CAAC,CAAC;AAExD,MAAM,MAAM,cAAc,GAAG;IAC3B,yCAAyC;IACzC,IAAI,EAAE,MAAM,CAAC;IACb,sDAAsD;IACtD,SAAS,EAAE,MAAM,CAAC;IAClB,yEAAyE;IACzE,WAAW,EAAE,MAAM,CAAC;IACpB,gFAAgF;IAChF,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4EAA4E;IAC5E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qEAAqE;IACrE,SAAS,CAAC,EAAE,cAAc,EAAE,CAAC;IAC7B,iEAAiE;IACjE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,CAAC;AAQrD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,SAAS,EACT,WAAW,EACX,QAAQ,EACR,SAAS,EACT,SAAc,EACd,WAAW,EACX,GAAG,SAAS,EACb,EAAE,cAAc,GAAG,SAAS,CAgG5B"}
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import clsx from 'clsx';
|
|
3
|
+
import { useEffect, useRef, useState, } from 'react';
|
|
4
|
+
import { FiCheck, FiCopy } from 'react-icons/fi';
|
|
5
|
+
import { Each } from '../../00-base';
|
|
6
|
+
import { IconButton } from '../IconButton';
|
|
7
|
+
const COPIED_FEEDBACK_MS = 1600;
|
|
8
|
+
function isHighlighted(line, ranges) {
|
|
9
|
+
return ranges.some(([from, to]) => line >= from && line <= to);
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* Read-only block of source code with a copy button. Shows an excerpt
|
|
13
|
+
* exactly as written: monospace, no wrapping, horizontal scroll when a line
|
|
14
|
+
* is longer than the block.
|
|
15
|
+
*
|
|
16
|
+
* Setting `startLine` numbers the lines, so an excerpt from the middle of a
|
|
17
|
+
* file keeps its real line numbers; `highlight` then marks ranges in that
|
|
18
|
+
* same numbering. There is no syntax coloring.
|
|
19
|
+
*
|
|
20
|
+
* Copying uses the Clipboard API, which browsers only expose on secure
|
|
21
|
+
* origins (`https` or `localhost`). When it fails the button stays as it was
|
|
22
|
+
* and `onCopyError` receives the reason.
|
|
23
|
+
*
|
|
24
|
+
* @component
|
|
25
|
+
* @example
|
|
26
|
+
* <CodeBlock
|
|
27
|
+
* code={excerpt}
|
|
28
|
+
* language="ts"
|
|
29
|
+
* startLine={940}
|
|
30
|
+
* highlight={[[943, 943]]}
|
|
31
|
+
* copyLabel="Copy code"
|
|
32
|
+
* copiedLabel="Copied"
|
|
33
|
+
* />
|
|
34
|
+
*
|
|
35
|
+
* @param {Object} props - The properties of the CodeBlock component.
|
|
36
|
+
* @param {string} props.code - The source to show, as plain text.
|
|
37
|
+
* @param {string} props.copyLabel - Accessible name and tooltip of the copy button.
|
|
38
|
+
* @param {string} props.copiedLabel - Shown and announced right after copying.
|
|
39
|
+
* @param {string} [props.language] - Label shown in the header.
|
|
40
|
+
* @param {number} [props.startLine] - Number of the first line; enables line numbers.
|
|
41
|
+
* @param {CodeBlockRange[]} [props.highlight=[]] - Inclusive line ranges to emphasize.
|
|
42
|
+
* @param {(error: unknown) => void} [props.onCopyError] - Called when the clipboard write fails.
|
|
43
|
+
*
|
|
44
|
+
* @returns {ReactNode} The rendered CodeBlock component.
|
|
45
|
+
*/
|
|
46
|
+
export function CodeBlock({ code, copyLabel, copiedLabel, language, startLine, highlight = [], onCopyError, ...restProps }) {
|
|
47
|
+
const [isCopied, setIsCopied] = useState(false);
|
|
48
|
+
const resetTimer = useRef(undefined);
|
|
49
|
+
useEffect(() => () => clearTimeout(resetTimer.current), []);
|
|
50
|
+
const lines = code.replace(/\n$/, '').split('\n');
|
|
51
|
+
const isNumbered = startLine !== undefined;
|
|
52
|
+
const firstLine = startLine ?? 1;
|
|
53
|
+
const gutterWidth = `${String(firstLine + lines.length - 1).length}ch`;
|
|
54
|
+
const copy = async () => {
|
|
55
|
+
try {
|
|
56
|
+
await navigator.clipboard.writeText(code);
|
|
57
|
+
}
|
|
58
|
+
catch (error) {
|
|
59
|
+
onCopyError?.(error);
|
|
60
|
+
return;
|
|
61
|
+
}
|
|
62
|
+
setIsCopied(true);
|
|
63
|
+
clearTimeout(resetTimer.current);
|
|
64
|
+
resetTimer.current = setTimeout(() => setIsCopied(false), COPIED_FEEDBACK_MS);
|
|
65
|
+
};
|
|
66
|
+
return (<div {...restProps} className={clsx('border-gray-5 bg-gray-7 dark:border-gray-1 dark:bg-black-1 min-w-0 overflow-hidden rounded-lg border', restProps.className)}>
|
|
67
|
+
<div className="border-gray-5 dark:border-gray-1 flex items-center justify-between gap-2 border-b py-1 pr-1 pl-3">
|
|
68
|
+
<span className="text-gray-1 dark:text-gray-2 truncate text-xs leading-4">
|
|
69
|
+
{language}
|
|
70
|
+
</span>
|
|
71
|
+
<IconButton icon={isCopied ? <FiCheck /> : <FiCopy />} label={isCopied ? copiedLabel : copyLabel} onClick={copy}/>
|
|
72
|
+
<span role="status" className="sr-only">
|
|
73
|
+
{isCopied ? copiedLabel : ''}
|
|
74
|
+
</span>
|
|
75
|
+
</div>
|
|
76
|
+
<pre tabIndex={0} className="focus-visible:ring-lavender dark:focus-visible:ring-lavender-dark m-0 overflow-x-auto py-2 font-mono text-xs leading-5 text-black focus-visible:ring-2 focus-visible:outline-none focus-visible:ring-inset dark:text-white">
|
|
77
|
+
<code className="block min-w-max">
|
|
78
|
+
<Each of={lines} render={(line, index) => {
|
|
79
|
+
const number = firstLine + index;
|
|
80
|
+
const isMarked = isHighlighted(number, highlight);
|
|
81
|
+
return (<span className={clsx('flex', isMarked && 'bg-lavender-2 dark:bg-lavender-dark-1')}>
|
|
82
|
+
{!!isNumbered && (<span aria-hidden="true" style={{ width: gutterWidth }} className={clsx('box-content shrink-0 px-3 text-right select-none', isMarked
|
|
83
|
+
? 'text-lavender dark:text-lavender-dark font-semibold'
|
|
84
|
+
: 'text-gray-1 dark:text-gray-2')}>
|
|
85
|
+
{number}
|
|
86
|
+
</span>)}
|
|
87
|
+
<span className={clsx('pr-3 whitespace-pre', !isNumbered && 'pl-3')}>
|
|
88
|
+
{line || ' '}
|
|
89
|
+
</span>
|
|
90
|
+
{'\n'}
|
|
91
|
+
</span>);
|
|
92
|
+
}}/>
|
|
93
|
+
</code>
|
|
94
|
+
</pre>
|
|
95
|
+
</div>);
|
|
96
|
+
}
|
|
97
|
+
//# sourceMappingURL=CodeBlock.jsx.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CodeBlock.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/CodeBlock/CodeBlock.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/CodeBlock/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/01-atoms/CodeBlock/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}
|
|
@@ -26,7 +26,7 @@ const styleMap = {
|
|
|
26
26
|
export function Heading({ level, children, ...restProps }) {
|
|
27
27
|
const Tag = level === 'h7' ? 'h6' : level;
|
|
28
28
|
const className = clsx(styleMap[level], restProps.className);
|
|
29
|
-
return (<Tag {...restProps} className={className}>
|
|
29
|
+
return (<Tag {...restProps} data-orion-part="heading" className={className}>
|
|
30
30
|
{children}
|
|
31
31
|
</Tag>);
|
|
32
32
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Heading.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/Heading/Heading.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAOxB,MAAM,QAAQ,GAA0C;IACtD,EAAE,EAAE,IAAI,CAAC,oCAAoC,CAAC;IAC9C,EAAE,EAAE,IAAI,CAAC,oCAAoC,CAAC;IAC9C,EAAE,EAAE,IAAI,CAAC,2CAA2C,CAAC;IACrD,EAAE,EAAE,IAAI,CAAC,sCAAsC,CAAC;IAChD,EAAE,EAAE,IAAI,CAAC,mCAAmC,CAAC;IAC7C,EAAE,EAAE,IAAI,CAAC,6CAA6C,CAAC;IACvD,EAAE,EAAE,IAAI,CAAC,kCAAkC,CAAC;CAC7C,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,OAAO,CAAC,EACtB,KAAK,EACL,QAAQ,EACR,GAAG,SAAS,EACC;IACb,MAAM,GAAG,GAAG,KAAK,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IAC1C,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAE7D,OAAO,CACL,CAAC,GAAG,CAAC,IAAI,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,
|
|
1
|
+
{"version":3,"file":"Heading.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/Heading/Heading.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAOxB,MAAM,QAAQ,GAA0C;IACtD,EAAE,EAAE,IAAI,CAAC,oCAAoC,CAAC;IAC9C,EAAE,EAAE,IAAI,CAAC,oCAAoC,CAAC;IAC9C,EAAE,EAAE,IAAI,CAAC,2CAA2C,CAAC;IACrD,EAAE,EAAE,IAAI,CAAC,sCAAsC,CAAC;IAChD,EAAE,EAAE,IAAI,CAAC,mCAAmC,CAAC;IAC7C,EAAE,EAAE,IAAI,CAAC,6CAA6C,CAAC;IACvD,EAAE,EAAE,IAAI,CAAC,kCAAkC,CAAC;CAC7C,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,OAAO,CAAC,EACtB,KAAK,EACL,QAAQ,EACR,GAAG,SAAS,EACC;IACb,MAAM,GAAG,GAAG,KAAK,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IAC1C,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAE7D,OAAO,CACL,CAAC,GAAG,CAAC,IAAI,SAAS,CAAC,CAAC,eAAe,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,CACjE;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import type { ButtonHTMLAttributes, ComponentProps, ReactNode } from 'react';
|
|
2
|
+
import { Tooltip } from '../Tooltip';
|
|
3
|
+
export type IconButtonProps = {
|
|
4
|
+
icon: ReactNode;
|
|
5
|
+
label: string;
|
|
6
|
+
tooltipPlacement?: ComponentProps<typeof Tooltip>['placement'];
|
|
7
|
+
} & Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'aria-label'>;
|
|
8
|
+
/**
|
|
9
|
+
* Button that shows only an icon, for secondary actions in dense rows (lists,
|
|
10
|
+
* timelines, cards). The `label` is required because the icon alone says
|
|
11
|
+
* nothing to a screen reader or to someone who does not recognise it: it
|
|
12
|
+
* becomes the accessible name and the tooltip shown on hover and focus.
|
|
13
|
+
*
|
|
14
|
+
* @component
|
|
15
|
+
* @example
|
|
16
|
+
* // Example usage of IconButton component
|
|
17
|
+
* <IconButton icon={<FiInfo />} label="See details" onClick={openDetails} />
|
|
18
|
+
*
|
|
19
|
+
* @param {Object} props - The properties of the IconButton component.
|
|
20
|
+
* @param {ReactNode} props.icon - The icon to render. Sized by the button's font size (16px).
|
|
21
|
+
* @param {string} props.label - Accessible name of the button and text of its tooltip.
|
|
22
|
+
* @param {UseFloatingOptions['placement']} [props.tooltipPlacement='top'] - Placement of the tooltip relative to the button.
|
|
23
|
+
* @param {ButtonHTMLAttributes<HTMLButtonElement>} restProps - Additional properties for the button element. `type` defaults to `button`.
|
|
24
|
+
*
|
|
25
|
+
* @returns {ReactNode} The rendered IconButton component.
|
|
26
|
+
*/
|
|
27
|
+
export declare function IconButton({ icon, label, tooltipPlacement, type, ...restProps }: IconButtonProps): ReactNode;
|
|
28
|
+
//# sourceMappingURL=IconButton.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/IconButton/IconButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC7E,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAErC,MAAM,MAAM,eAAe,GAAG;IAC5B,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,gBAAgB,CAAC,EAAE,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,WAAW,CAAC,CAAC;CAChE,GAAG,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC;AAE7E;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,KAAK,EACL,gBAAwB,EACxB,IAAe,EACf,GAAG,SAAS,EACb,EAAE,eAAe,GAAG,SAAS,CAuB7B"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import clsx from 'clsx';
|
|
2
|
+
import { Tooltip } from '../Tooltip';
|
|
3
|
+
/**
|
|
4
|
+
* Button that shows only an icon, for secondary actions in dense rows (lists,
|
|
5
|
+
* timelines, cards). The `label` is required because the icon alone says
|
|
6
|
+
* nothing to a screen reader or to someone who does not recognise it: it
|
|
7
|
+
* becomes the accessible name and the tooltip shown on hover and focus.
|
|
8
|
+
*
|
|
9
|
+
* @component
|
|
10
|
+
* @example
|
|
11
|
+
* // Example usage of IconButton component
|
|
12
|
+
* <IconButton icon={<FiInfo />} label="See details" onClick={openDetails} />
|
|
13
|
+
*
|
|
14
|
+
* @param {Object} props - The properties of the IconButton component.
|
|
15
|
+
* @param {ReactNode} props.icon - The icon to render. Sized by the button's font size (16px).
|
|
16
|
+
* @param {string} props.label - Accessible name of the button and text of its tooltip.
|
|
17
|
+
* @param {UseFloatingOptions['placement']} [props.tooltipPlacement='top'] - Placement of the tooltip relative to the button.
|
|
18
|
+
* @param {ButtonHTMLAttributes<HTMLButtonElement>} restProps - Additional properties for the button element. `type` defaults to `button`.
|
|
19
|
+
*
|
|
20
|
+
* @returns {ReactNode} The rendered IconButton component.
|
|
21
|
+
*/
|
|
22
|
+
export function IconButton({ icon, label, tooltipPlacement = 'top', type = 'button', ...restProps }) {
|
|
23
|
+
const className = clsx('flex items-center justify-center rounded-sm p-2 text-base transition-colors', 'text-gray-1 disabled:text-gray-3 not-disabled:hover:bg-black not-disabled:hover:text-white disabled:cursor-not-allowed', 'dark:text-gray-5 dark:disabled:text-gray-2 dark:not-disabled:hover:bg-white dark:not-disabled:hover:text-black', 'focus-visible:ring-lavender dark:focus-visible:ring-lavender-dark focus-visible:ring-2 focus-visible:outline-none', restProps.className);
|
|
24
|
+
return (<Tooltip message={label} placement={tooltipPlacement}>
|
|
25
|
+
<button {...restProps} type={type} aria-label={label} className={className}>
|
|
26
|
+
<span aria-hidden="true" className="flex">
|
|
27
|
+
{icon}
|
|
28
|
+
</span>
|
|
29
|
+
</button>
|
|
30
|
+
</Tooltip>);
|
|
31
|
+
}
|
|
32
|
+
//# sourceMappingURL=IconButton.jsx.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"IconButton.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/IconButton/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAQrC;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,UAAU,UAAU,CAAC,EACzB,IAAI,EACJ,KAAK,EACL,gBAAgB,GAAG,KAAK,EACxB,IAAI,GAAG,QAAQ,EACf,GAAG,SAAS,EACI;IAChB,MAAM,SAAS,GAAG,IAAI,CACpB,6EAA6E,EAC7E,wHAAwH,EACxH,gHAAgH,EAChH,mHAAmH,EACnH,SAAS,CAAC,SAAS,CACpB,CAAC;IAEF,OAAO,CACL,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC,gBAAgB,CAAC,CACnD;MAAA,CAAC,MAAM,CACL,IAAI,SAAS,CAAC,CACd,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,UAAU,CAAC,CAAC,KAAK,CAAC,CAClB,SAAS,CAAC,CAAC,SAAS,CAAC,CAErB;QAAA,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,CACvC;UAAA,CAAC,IAAI,CACP;QAAA,EAAE,IAAI,CACR;MAAA,EAAE,MAAM,CACV;IAAA,EAAE,OAAO,CAAC,CACX,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/IconButton/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/01-atoms/IconButton/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}
|
|
@@ -38,7 +38,7 @@ type InputProps = {
|
|
|
38
38
|
* @param {ReactNode} [props.iconR] - Optional icon to be displayed to the right of the input field.
|
|
39
39
|
* @param {boolean} [props.isMutedWhenEmpty] - Renders the border and label in gray while the field has no value.
|
|
40
40
|
* @param {boolean} [props.hideLabel] - Keeps the label for assistive technology only and drops the floating label and its border notch. Use it when a heading outside the field already names it.
|
|
41
|
-
* @param {string} [props.placeholder] - Placeholder shown inside the field.
|
|
41
|
+
* @param {string} [props.placeholder] - Placeholder shown inside the field. With `hideLabel` it is always visible; with the floating label it only appears while the field is focused, once the label has moved out of the way.
|
|
42
42
|
*
|
|
43
43
|
* @returns {ReactNode} The rendered Input component.
|
|
44
44
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/Input/Input.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,KAAK,iBAAiB,EACtB,KAAK,mBAAmB,EACxB,KAAK,SAAS,EAGf,MAAM,OAAO,CAAC;AAKf,KAAK,UAAU,GAAG;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE;QACL,IAAI,EAAE,IAAI,CACR,iBAAiB,CACf,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,gBAAgB,CACjB,CAAC,MAAM,CAAC,EACT,QAAQ,GAAG,UAAU,GAAG,OAAO,CAChC,CAAC;KACH,GAAG,IAAI,CACN,iBAAiB,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,EAC1E,aAAa,CACd,CAAC;IACF,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;CAChC,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,KAAK,EACL,UAAU,EACV,KAAK,EACL,KAAK,EACL,KAAK,EACL,gBAAgB,EAChB,SAAiB,EACjB,WAAW,EACX,qBAAqB,EACrB,qBAAqB,GACtB,EAAE,UAAU,GAAG,SAAS,
|
|
1
|
+
{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/Input/Input.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,KAAK,iBAAiB,EACtB,KAAK,mBAAmB,EACxB,KAAK,SAAS,EAGf,MAAM,OAAO,CAAC;AAKf,KAAK,UAAU,GAAG;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE;QACL,IAAI,EAAE,IAAI,CACR,iBAAiB,CACf,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,gBAAgB,CACjB,CAAC,MAAM,CAAC,EACT,QAAQ,GAAG,UAAU,GAAG,OAAO,CAChC,CAAC;KACH,GAAG,IAAI,CACN,iBAAiB,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,EAC1E,aAAa,CACd,CAAC;IACF,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;CAChC,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,KAAK,EACL,UAAU,EACV,KAAK,EACL,KAAK,EACL,KAAK,EACL,gBAAgB,EAChB,SAAiB,EACjB,WAAW,EACX,qBAAqB,EACrB,qBAAqB,GACtB,EAAE,UAAU,GAAG,SAAS,CAsHxB"}
|
|
@@ -28,7 +28,7 @@ import { RenderErrorOrHelperText } from './utils/RenderErrorOrHelperText';
|
|
|
28
28
|
* @param {ReactNode} [props.iconR] - Optional icon to be displayed to the right of the input field.
|
|
29
29
|
* @param {boolean} [props.isMutedWhenEmpty] - Renders the border and label in gray while the field has no value.
|
|
30
30
|
* @param {boolean} [props.hideLabel] - Keeps the label for assistive technology only and drops the floating label and its border notch. Use it when a heading outside the field already names it.
|
|
31
|
-
* @param {string} [props.placeholder] - Placeholder shown inside the field.
|
|
31
|
+
* @param {string} [props.placeholder] - Placeholder shown inside the field. With `hideLabel` it is always visible; with the floating label it only appears while the field is focused, once the label has moved out of the way.
|
|
32
32
|
*
|
|
33
33
|
* @returns {ReactNode} The rendered Input component.
|
|
34
34
|
*/
|
|
@@ -41,7 +41,9 @@ export function Input({ label, input, helperText, error, iconL, iconR, isMutedWh
|
|
|
41
41
|
undefined;
|
|
42
42
|
const isPassword = input.type === 'password';
|
|
43
43
|
const effectiveType = isPassword && showPassword ? 'text' : input.type;
|
|
44
|
-
const inputClasses = clsx('peer disabled:text-gray-3 dark:disabled:text-gray-2 h-full w-full rounded-full bg-transparent text-sm font-normal text-black outline-0 transition-all focus:text-black dark:bg-black dark:text-white dark:focus:text-white', iconL ? 'pr-5 pl-11' : 'px-5', hideLabel
|
|
44
|
+
const inputClasses = clsx('peer disabled:text-gray-3 dark:disabled:text-gray-2 h-full w-full rounded-full bg-transparent text-sm font-normal text-black outline-0 transition-all focus:text-black dark:bg-black dark:text-white dark:focus:text-white', iconL ? 'pr-5 pl-11' : 'px-5', hideLabel
|
|
45
|
+
? 'placeholder:text-gray-2 dark:placeholder:text-gray-2'
|
|
46
|
+
: 'focus:placeholder:text-gray-2 dark:focus:placeholder:text-gray-2 placeholder:text-transparent', input.className);
|
|
45
47
|
const { labelProps, legendClasses, fieldsetClasses } = generateBorder(error, {
|
|
46
48
|
isMutedWhenEmpty,
|
|
47
49
|
hideLabel,
|
|
@@ -53,21 +55,23 @@ export function Input({ label, input, helperText, error, iconL, iconR, isMutedWh
|
|
|
53
55
|
: 'text-black dark:text-white')}>
|
|
54
56
|
{showPassword ? (<FiEyeOff size={18} aria-hidden="true"/>) : (<FiEye size={18} aria-hidden="true"/>)}
|
|
55
57
|
</button>) : (iconR);
|
|
56
|
-
return (<div className="w-full max-w-full">
|
|
57
|
-
<div className="relative h-9">
|
|
58
|
-
<input {...input} id={id} type={effectiveType} className={inputClasses} placeholder={
|
|
58
|
+
return (<div data-orion-part="field" className="w-full max-w-full">
|
|
59
|
+
<div data-orion-part="field-box" className="relative h-9">
|
|
60
|
+
<input {...input} data-orion-part="field-control" id={id} type={effectiveType} className={inputClasses} placeholder={placeholder || ' '} aria-invalid={error ? true : input['aria-invalid']} aria-describedby={describedBy}/>
|
|
59
61
|
{hideLabel ? (<label htmlFor={id} className="sr-only">
|
|
60
62
|
{label}
|
|
61
|
-
</label>) : (<label {...labelProps}
|
|
62
|
-
|
|
63
|
+
</label>) : (<label {...labelProps} data-orion-part="field-label">
|
|
64
|
+
{label}
|
|
65
|
+
</label>)}
|
|
66
|
+
<fieldset aria-hidden="true" data-orion-part="field-outline" className={fieldsetClasses}>
|
|
63
67
|
{!hideLabel && <legend className={legendClasses}>{label}</legend>}
|
|
64
68
|
</fieldset>
|
|
65
|
-
{!!iconL && (<span aria-hidden="true" className={clsx('peer-disabled:text-gray-3 dark:peer-disabled:text-gray-2 absolute top-1/2 left-4 flex -translate-y-1/2 items-center', error
|
|
69
|
+
{!!iconL && (<span aria-hidden="true" data-orion-part="field-icon" className={clsx('peer-disabled:text-gray-3 dark:peer-disabled:text-gray-2 absolute top-1/2 left-4 flex -translate-y-1/2 items-center', error
|
|
66
70
|
? 'text-error dark:text-error-dark'
|
|
67
71
|
: 'text-black dark:text-white')}>
|
|
68
72
|
{iconL}
|
|
69
73
|
</span>)}
|
|
70
|
-
{!!rightSlot && (<span className={clsx('peer-disabled:text-gray-3 dark:peer-disabled:text-gray-2 absolute top-2 right-2', error
|
|
74
|
+
{!!rightSlot && (<span data-orion-part="field-icon" className={clsx('peer-disabled:text-gray-3 dark:peer-disabled:text-gray-2 absolute top-2 right-2', error
|
|
71
75
|
? 'text-error dark:text-error-dark'
|
|
72
76
|
: 'text-black dark:text-white')}>
|
|
73
77
|
{rightSlot}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/Input/Input.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAIL,KAAK,EACL,QAAQ,GACT,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAAE,uBAAuB,EAAE,MAAM,iCAAiC,CAAC;AA2B1E;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,MAAM,UAAU,KAAK,CAAC,EACpB,KAAK,EACL,KAAK,EACL,UAAU,EACV,KAAK,EACL,KAAK,EACL,KAAK,EACL,gBAAgB,EAChB,SAAS,GAAG,KAAK,EACjB,WAAW,EACX,qBAAqB,EACrB,qBAAqB,GACV;IACX,MAAM,WAAW,GAAG,KAAK,EAAE,CAAC;IAC5B,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxD,MAAM,EAAE,GAAG,KAAK,CAAC,EAAE,IAAI,WAAW,CAAC;IACnC,MAAM,aAAa,GAAG,KAAK,IAAI,UAAU,CAAC,CAAC,CAAC,GAAG,EAAE,cAAc,CAAC,CAAC,CAAC,SAAS,CAAC;IAC5E,MAAM,WAAW,GACf,CAAC,KAAK,CAAC,kBAAkB,CAAC,EAAE,aAAa,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;QACpE,SAAS,CAAC;IAEZ,MAAM,UAAU,GAAG,KAAK,CAAC,IAAI,KAAK,UAAU,CAAC;IAC7C,MAAM,aAAa,GAAG,UAAU,IAAI,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC;IAEvE,MAAM,YAAY,GAAG,IAAI,CACvB,4NAA4N,EAC5N,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,EAC7B,SAAS,
|
|
1
|
+
{"version":3,"file":"Input.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/Input/Input.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RenderErrorOrHelperText.d.ts","sourceRoot":"","sources":["../../../../../src/components/01-atoms/Input/utils/RenderErrorOrHelperText.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,KAAK,4BAA4B,GAAG;IAClC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,uBAAuB,CAAC,EACtC,EAAE,EACF,KAAK,EACL,UAAU,EACV,QAAQ,EACR,SAAS,GACV,EAAE,4BAA4B,GAAG,SAAS,
|
|
1
|
+
{"version":3,"file":"RenderErrorOrHelperText.d.ts","sourceRoot":"","sources":["../../../../../src/components/01-atoms/Input/utils/RenderErrorOrHelperText.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,KAAK,4BAA4B,GAAG;IAClC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,uBAAuB,CAAC,EACtC,EAAE,EACF,KAAK,EACL,UAAU,EACV,QAAQ,EACR,SAAS,GACV,EAAE,4BAA4B,GAAG,SAAS,CAuB1C"}
|
|
@@ -4,7 +4,7 @@ export function RenderErrorOrHelperText({ id, error, helperText, disabled, class
|
|
|
4
4
|
if (!error && !helperText) {
|
|
5
5
|
return null;
|
|
6
6
|
}
|
|
7
|
-
return (<Paragraph id={id} className={clsx('pt-1.5', error && !disabled
|
|
7
|
+
return (<Paragraph id={id} data-orion-part="field-helper" className={clsx('pt-1.5', error && !disabled
|
|
8
8
|
? 'text-error dark:text-error-dark'
|
|
9
9
|
: disabled
|
|
10
10
|
? 'text-gray-3 dark:text-gray-2'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RenderErrorOrHelperText.jsx","sourceRoot":"","sources":["../../../../../src/components/01-atoms/Input/utils/RenderErrorOrHelperText.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAU5C,MAAM,UAAU,uBAAuB,CAAC,EACtC,EAAE,EACF,KAAK,EACL,UAAU,EACV,QAAQ,EACR,SAAS,GACoB;IAC7B,IAAI,CAAC,KAAK,IAAI,CAAC,UAAU,EAAE,CAAC;QAC1B,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,CAAC,SAAS,CACR,EAAE,CAAC,CAAC,EAAE,CAAC,CACP,SAAS,CAAC,CAAC,IAAI,CACb,QAAQ,EACR,KAAK,IAAI,CAAC,QAAQ;YAChB,CAAC,CAAC,iCAAiC;YACnC,CAAC,CAAC,QAAQ;gBACR,CAAC,CAAC,8BAA8B;gBAChC,CAAC,CAAC,8BAA8B,EACpC,SAAS,CACV,CAAC,CACF,IAAI,CAAC,QAAQ,CAEb;MAAA,CAAC,KAAK,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAC1C;IAAA,EAAE,SAAS,CAAC,CACb,CAAC;AACJ,CAAC"}
|
|
1
|
+
{"version":3,"file":"RenderErrorOrHelperText.jsx","sourceRoot":"","sources":["../../../../../src/components/01-atoms/Input/utils/RenderErrorOrHelperText.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAU5C,MAAM,UAAU,uBAAuB,CAAC,EACtC,EAAE,EACF,KAAK,EACL,UAAU,EACV,QAAQ,EACR,SAAS,GACoB;IAC7B,IAAI,CAAC,KAAK,IAAI,CAAC,UAAU,EAAE,CAAC;QAC1B,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,CAAC,SAAS,CACR,EAAE,CAAC,CAAC,EAAE,CAAC,CACP,eAAe,CAAC,cAAc,CAC9B,SAAS,CAAC,CAAC,IAAI,CACb,QAAQ,EACR,KAAK,IAAI,CAAC,QAAQ;YAChB,CAAC,CAAC,iCAAiC;YACnC,CAAC,CAAC,QAAQ;gBACR,CAAC,CAAC,8BAA8B;gBAChC,CAAC,CAAC,8BAA8B,EACpC,SAAS,CACV,CAAC,CACF,IAAI,CAAC,QAAQ,CAEb;MAAA,CAAC,KAAK,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAC1C;IAAA,EAAE,SAAS,CAAC,CACb,CAAC;AACJ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiSelect.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/MultiSelect/MultiSelect.tsx"],"names":[],"mappings":"AAGA,OAAO,EAEL,KAAK,cAAc,EAEnB,SAAS,EAIV,MAAM,OAAO,CAAC;AASf,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,KAAK,CAAC,EAAE,UAAU,EAAE,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,eAAe,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IACnD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,SAAS,CAAC,CAAC;AAIpD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,KAAqB,EACrB,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,UAAU,EACV,KAAK,EACL,gBAAgB,EAChB,oBAAoB,EACpB,GAAG,SAAS,EACb,EAAE,gBAAgB,GAAG,SAAS,
|
|
1
|
+
{"version":3,"file":"MultiSelect.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/MultiSelect/MultiSelect.tsx"],"names":[],"mappings":"AAGA,OAAO,EAEL,KAAK,cAAc,EAEnB,SAAS,EAIV,MAAM,OAAO,CAAC;AASf,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,KAAK,CAAC,EAAE,UAAU,EAAE,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,eAAe,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IACnD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,SAAS,CAAC,CAAC;AAIpD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,KAAqB,EACrB,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,UAAU,EACV,KAAK,EACL,gBAAgB,EAChB,oBAAoB,EACpB,GAAG,SAAS,EACb,EAAE,gBAAgB,GAAG,SAAS,CAoU9B"}
|
|
@@ -160,6 +160,7 @@ export function MultiSelect({ options, value = EMPTY_OPTIONS, onChange, label, d
|
|
|
160
160
|
}, [value]);
|
|
161
161
|
useEffect(() => {
|
|
162
162
|
document.addEventListener('mousedown', handleOutsideClick);
|
|
163
|
+
// eslint-disable-next-line react-hooks/set-state-in-effect -- the id is generated on the client after mount so the server and client markup match
|
|
163
164
|
setId(generateUniqueId());
|
|
164
165
|
return () => {
|
|
165
166
|
document.removeEventListener('mousedown', handleOutsideClick);
|
|
@@ -177,7 +178,7 @@ export function MultiSelect({ options, value = EMPTY_OPTIONS, onChange, label, d
|
|
|
177
178
|
: 'dark:text-white')}>
|
|
178
179
|
{label}
|
|
179
180
|
</label>
|
|
180
|
-
<FaSortDown aria-hidden="true" className={clsx('absolute top-2 right-4', isMuted ? 'text-gray-2 dark:text-gray-2' : 'dark:text-white')}/>
|
|
181
|
+
<FaSortDown aria-hidden="true" className={clsx('peer-disabled:text-gray-3 dark:peer-disabled:text-gray-2 absolute top-2 right-4', isMuted ? 'text-gray-2 dark:text-gray-2' : 'dark:text-white')}/>
|
|
181
182
|
<fieldset className={clsx(fieldsetClasses, 'dark:peer-disabled:border-gray-2', error
|
|
182
183
|
? 'dark:border-error-dark'
|
|
183
184
|
: isMuted
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiSelect.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/MultiSelect/MultiSelect.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"MultiSelect.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/MultiSelect/MultiSelect.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAKL,SAAS,EACT,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAC;AACrE,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,uBAAuB,EAAE,MAAM,wCAAwC,CAAC;AAmBjF,MAAM,aAAa,GAAiB,EAAE,CAAC;AAEvC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,MAAM,UAAU,WAAW,CAAC,EAC1B,OAAO,EACP,KAAK,GAAG,aAAa,EACrB,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,UAAU,EACV,KAAK,EACL,gBAAgB,EAChB,oBAAoB,EACpB,GAAG,SAAS,EACK;IACjB,MAAM,CAAC,EAAE,EAAE,KAAK,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACjC,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAe,EAAE,CAAC,CAAC;IACzE,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAe,KAAK,CAAC,CAAC;IAC5E,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IACrD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;IAE/C,MAAM,YAAY,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAClD,MAAM,UAAU,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAClD,MAAM,UAAU,GAAG,MAAM,CAA8B,EAAE,CAAC,CAAC;IAC3D,MAAM,SAAS,GAAG,GAAG,EAAE,UAAU,CAAC;IAClC,MAAM,UAAU,GAAG,GAAG,EAAE,WAAW,CAAC;IAEpC,MAAM,YAAY,GAAG,IAAI,CACvB,iQAAiQ,CAClQ,CAAC;IAEF,MAAM,OAAO,GAAG,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC;IAErE,MAAM,EAAE,UAAU,EAAE,aAAa,EAAE,eAAe,EAAE,GAAG,cAAc,CAAC,KAAK,EAAE;QAC3E,OAAO;KACR,CAAC,CAAC;IAEH,MAAM,oBAAoB,GAAG,GAAG,EAAE;QAChC,IAAI,QAAQ,EAAE,CAAC;YACb,OAAO;QACT,CAAC;QACD,SAAS,CAAC,CAAC,aAAa,EAAE,EAAE,CAAC,CAAC,aAAa,CAAC,CAAC;IAC/C,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,MAAkB,EAAE,EAAE;QAC/C,MAAM,UAAU,GAAG,eAAe,CAAC,IAAI,CACrC,CAAC,cAAc,EAAE,EAAE,CAAC,cAAc,CAAC,KAAK,KAAK,MAAM,CAAC,KAAK,CAC1D,CAAC;QACF,MAAM,kBAAkB,GAAG,UAAU;YACnC,CAAC,CAAC,eAAe,CAAC,MAAM,CACpB,CAAC,cAAc,EAAE,EAAE,CAAC,cAAc,CAAC,KAAK,KAAK,MAAM,CAAC,KAAK,CAC1D;YACH,CAAC,CAAC,CAAC,GAAG,eAAe,EAAE,MAAM,CAAC,CAAC;QAEjC,kBAAkB,CAAC,kBAAkB,CAAC,CAAC;QACvC,QAAQ,EAAE,CAAC,kBAAkB,CAAC,CAAC;IACjC,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,CAAgC,EAAE,EAAE;QAC7D,MAAM,QAAQ,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QAChC,QAAQ,CAAC,QAAQ,CAAC,CAAC;QACnB,MAAM,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE,EAAE,CAC7C,MAAM,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC,CAC5D,CAAC;QACF,kBAAkB,CAAC,YAAY,CAAC,CAAC;IACnC,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,CAAC,KAAiB,EAAE,EAAE;QAC/C,IACE,YAAY,CAAC,OAAO;YACpB,CAAC,YAAY,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC,EACpD,CAAC;YACD,SAAS,CAAC,KAAK,CAAC,CAAC;QACnB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,GAAG,EAAE;QAC7B,kBAAkB,CAAC,EAAE,CAAC,CAAC;QACvB,kBAAkB,CAAC,OAAO,CAAC,CAAC;QAC5B,QAAQ,CAAC,EAAE,CAAC,CAAC;QACb,QAAQ,EAAE,CAAC,EAAE,CAAC,CAAC;IACjB,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,KAAa,EAAE,EAAE;QACpC,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,KAAK,EAAE,CAAC;IACrC,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,SAAS,CAAC,KAAK,CAAC,CAAC;QACjB,UAAU,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;IAC9B,CAAC,CAAC;IAEF,MAAM,oBAAoB,GAAG,CAAC,KAAsC,EAAE,EAAE;QACtE,IAAI,QAAQ,EAAE,CAAC;YACb,OAAO;QACT,CAAC;QAED,IACE,KAAK,CAAC,GAAG,KAAK,OAAO;YACrB,KAAK,CAAC,GAAG,KAAK,GAAG;YACjB,KAAK,CAAC,GAAG,KAAK,WAAW,EACzB,CAAC;YACD,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,SAAS,CAAC,IAAI,CAAC,CAAC;YAChB,UAAU,CAAC,GAAG,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;QACnC,CAAC;aAAM,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;YAClC,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,SAAS,CAAC,KAAK,CAAC,CAAC;QACnB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,mBAAmB,GAAG,CAAC,KAAsC,EAAE,EAAE;QACrE,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;YAC3B,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,aAAa,EAAE,CAAC;QAClB,CAAC;aAAM,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,EAAE,CAAC;YACrC,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,WAAW,CAAC,CAAC,CAAC,CAAC;QACjB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,mBAAmB,GAAG,CAC1B,KAAmC,EACnC,KAAa,EACb,MAAkB,EAClB,EAAE;QACF,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,EAAE,CAAC;YAC9B,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,GAAG,CAAC,EAAE,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;QAC/D,CAAC;aAAM,IAAI,KAAK,CAAC,GAAG,KAAK,SAAS,EAAE,CAAC;YACnC,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;QACtC,CAAC;aAAM,IAAI,KAAK,CAAC,GAAG,KAAK,MAAM,EAAE,CAAC;YAChC,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,WAAW,CAAC,CAAC,CAAC,CAAC;QACjB,CAAC;aAAM,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,EAAE,CAAC;YAC/B,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,WAAW,CAAC,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QAC1C,CAAC;aAAM,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE,CAAC;YACtD,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,iBAAiB,CAAC,MAAM,CAAC,CAAC;QAC5B,CAAC;aAAM,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;YAClC,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,aAAa,EAAE,CAAC;QAClB,CAAC;IACH,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,kBAAkB,CAAC,OAAO,CAAC,CAAC;IAC9B,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,SAAS,CAAC,GAAG,EAAE;QACb,kBAAkB,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,SAAS,CAAC,GAAG,EAAE;QACb,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,kBAAkB,CAAC,CAAC;QAC3D,kJAAkJ;QAClJ,KAAK,CAAC,gBAAgB,EAAE,CAAC,CAAC;QAE1B,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,kBAAkB,CAAC,CAAC;QAChE,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,CAAC,GAAG,CACF,IAAI,SAAS,CAAC,CACd,SAAS,CAAC,CAAC,IAAI,CAAC,iBAAiB,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC,CACxD,GAAG,CAAC,CAAC,YAAY,CAAC,CAElB;MAAA,CAAC,GAAG,CACF,SAAS,CAAC,CAAC,IAAI,CACb,2BAA2B,EAC3B,QAAQ,CAAC,CAAC,CAAC,iCAAiC,CAAC,CAAC,CAAC,gBAAgB,CAChE,CAAC,CACF,OAAO,CAAC,CAAC,oBAAoB,CAAC,CAE9B;QAAA,CAAC,KAAK,CACJ,GAAG,CAAC,CAAC,UAAU,CAAC,CAChB,EAAE,CAAC,CAAC,EAAE,CAAC,CACP,IAAI,CAAC,UAAU,CACf,WAAW,CAAC,GAAG,CACf,KAAK,CAAC,CACJ,eAAe,CAAC,MAAM;YACpB,CAAC,CAAC,GAAG,eAAe,CAAC,MAAM,kBAAkB;YAC7C,CAAC,CAAC,EACN,CAAC,CACD,QAAQ,CACR,SAAS,CAAC,CAAC,YAAY,CAAC,CACxB,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,aAAa,CAAC,CAAC,MAAM,CAAC,CACtB,aAAa,CAAC,SAAS,CACvB,aAAa,CAAC,CAAC,SAAS,CAAC,CACzB,YAAY,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAC7B,gBAAgB,CAAC,CAAC,KAAK,IAAI,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAC/D,SAAS,CAAC,CAAC,oBAAoB,CAAC,EAElC;QAAA,CAAC,KAAK,CACJ,IAAI,UAAU,CAAC,CACf,OAAO,CAAC,CAAC,EAAE,IAAI,SAAS,CAAC,CACzB,SAAS,CAAC,CAAC,IAAI,CACb,UAAU,CAAC,SAAS,EACpB,gCAAgC,EAChC,KAAK;YACH,CAAC,CAAC,sBAAsB;YACxB,CAAC,CAAC,OAAO;gBACP,CAAC,CAAC,kBAAkB;gBACpB,CAAC,CAAC,iBAAiB,CACxB,CAAC,CAEF;UAAA,CAAC,KAAK,CACR;QAAA,EAAE,KAAK,CACP;QAAA,CAAC,UAAU,CACT,WAAW,CAAC,MAAM,CAClB,SAAS,CAAC,CAAC,IAAI,CACb,iFAAiF,EACjF,OAAO,CAAC,CAAC,CAAC,8BAA8B,CAAC,CAAC,CAAC,iBAAiB,CAC7D,CAAC,EAEJ;QAAA,CAAC,QAAQ,CACP,SAAS,CAAC,CAAC,IAAI,CACb,eAAe,EACf,kCAAkC,EAClC,KAAK;YACH,CAAC,CAAC,wBAAwB;YAC1B,CAAC,CAAC,OAAO;gBACP,CAAC,CAAC,oBAAoB;gBACtB,CAAC,CAAC,mBAAmB,CAC1B,CAAC,CAEF;UAAA,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,MAAM,CACnD;QAAA,EAAE,QAAQ,CACZ;MAAA,EAAE,GAAG,CACL;MAAA,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,UAAU,CAAC,CAClB;QAAA,CAAC,uBAAuB,CACtB,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,UAAU,CAAC,CAAC,UAAU,CAAC,CACvB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,SAAS,CAAC,CAAC,IAAI,CACb,MAAM,EACN,KAAK,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,kBAAkB,CACjE,CAAC,EAEN;MAAA,EAAE,GAAG,CACL;MAAA,CAAC,CAAC,CAAC,MAAM,IAAI,CACX,CAAC,GAAG,CAAC,SAAS,CAAC,wJAAwJ,CACrK;UAAA,CAAC,GAAG,CAAC,SAAS,CAAC,gCAAgC,CAC7C;YAAA,CAAC,GAAG,CAAC,SAAS,CAAC,sBAAsB,CACnC;cAAA,CAAC,KAAK,CACJ,IAAI,CAAC,MAAM,CACX,UAAU,CAAC,CAAC,KAAK,CAAC,CAClB,aAAa,CAAC,CAAC,SAAS,CAAC,CACzB,SAAS,CAAC,+GAA+G,CACzH,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,QAAQ,CAAC,CAAC,iBAAiB,CAAC,CAC5B,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAC/B,SAAS,CAAC,CAAC,mBAAmB,CAAC,EAEjC;cAAA,CAAC,WAAW,CACV,WAAW,CAAC,MAAM,CAClB,IAAI,CAAC,CAAC,EAAE,CAAC,CACT,SAAS,CAAC,wBAAwB,EAEtC;YAAA,EAAE,GAAG,CACL;YAAA,CAAC,MAAM,CACL,IAAI,CAAC,QAAQ,CACb,UAAU,CAAC,CAAC,oBAAoB,CAAC,CACjC,OAAO,CAAC,CAAC,iBAAiB,CAAC,CAC3B,SAAS,CAAC,yNAAyN,CAEnO;cAAA,CAAC,sBAAsB,CAAC,WAAW,CAAC,MAAM,EAC5C;YAAA,EAAE,MAAM,CACV;UAAA,EAAE,GAAG,CACL;UAAA,CAAC,EAAE,CACD,EAAE,CAAC,CAAC,SAAS,CAAC,CACd,IAAI,CAAC,SAAS,CACd,oBAAoB,CAAC,MAAM,CAC3B,SAAS,CAAC,yEAAyE,CAEnF;YAAA,CAAC,IAAI,CACH;cAAA,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC,CACjD;gBAAA,CAAC,IAAI,CACH,EAAE,CAAC,CAAC,eAAe,CAAC,CACpB,MAAM,CAAC,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;gBACxB,MAAM,UAAU,GAAG,eAAe,CAAC,IAAI,CACrC,CAAC,cAAc,EAAE,EAAE,CAAC,cAAc,CAAC,KAAK,KAAK,MAAM,CAAC,KAAK,CAC1D,CAAC;gBAEF,OAAO,CACL,CAAC,EAAE,CACD,GAAG,CAAC,CAAC,CAAC,OAAO,EAAE,EAAE;wBACf,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,OAAO,CAAC;oBACtC,CAAC,CAAC,CACF,IAAI,CAAC,QAAQ,CACb,aAAa,CAAC,CAAC,UAAU,CAAC,CAC1B,QAAQ,CAAC,CAAC,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAC/B,SAAS,CAAC,0IAA0I,CACpJ,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAClB,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,CACzC,SAAS,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE,CACnB,mBAAmB,CAAC,KAAK,EAAE,KAAK,EAAE,MAAM,CAC1C,CAAC,CAED;wBAAA,CAAC,IAAI,CACH,WAAW,CAAC,MAAM,CAClB,SAAS,CAAC,CAAC,IAAI,CACb,oEAAoE,EACpE,UAAU;wBACR,CAAC,CAAC,kFAAkF;wBACpF,CAAC,CAAC,2DAA2D,CAChE,CAAC,CAEF;0BAAA,CAAC,IAAI,CACH;4BAAA,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,UAAU,CAAC,CAC5B;8BAAA,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,EAC7B;4BAAA,EAAE,IAAI,CAAC,IAAI,CACb;0BAAA,EAAE,IAAI,CACR;wBAAA,EAAE,IAAI,CACN;wBAAA,CAAC,IAAI,CAAC,SAAS,CAAC,2BAA2B,CACzC;0BAAA,CAAC,MAAM,CAAC,KAAK,CACf;wBAAA,EAAE,IAAI,CACR;sBAAA,EAAE,EAAE,CAAC,CACN,CAAC;YACJ,CAAC,CAAC,EAEN;cAAA,EAAE,IAAI,CAAC,IAAI,CACX;cAAA,CAAC,IAAI,CAAC,IAAI,CACR;gBAAA,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,CACpD;;gBACF,EAAE,EAAE,CACN;cAAA,EAAE,IAAI,CAAC,IAAI,CACb;YAAA,EAAE,IAAI,CACR;UAAA,EAAE,EAAE,CACN;QAAA,EAAE,GAAG,CAAC,CACP,CACH;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -1,9 +1,12 @@
|
|
|
1
1
|
import type { HTMLAttributes, ReactNode } from 'react';
|
|
2
|
+
export type ProgressBarModifier = 'default' | 'success' | 'warning' | 'error';
|
|
2
3
|
export type ProgressBarProps = {
|
|
3
4
|
/** Progress between 0 and 100. Omit it for an indeterminate bar. */
|
|
4
5
|
value?: number;
|
|
5
6
|
/** Accessible name of the operation being tracked. */
|
|
6
7
|
ariaLabel: string;
|
|
8
|
+
/** Color of the fill. Defaults to the brand accent. */
|
|
9
|
+
modifier?: ProgressBarModifier;
|
|
7
10
|
} & Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'role'>;
|
|
8
11
|
/**
|
|
9
12
|
* Thin linear progress bar. With `value` it fills from the left up to that
|
|
@@ -12,6 +15,9 @@ export type ProgressBarProps = {
|
|
|
12
15
|
* where a line reads better than a ring, and of `Spinner` for waits that
|
|
13
16
|
* deserve a headline and copy under them.
|
|
14
17
|
*
|
|
18
|
+
* `modifier` colors the fill to grade the value (a score, a quota). Color is
|
|
19
|
+
* never the only signal: pair it with the value or a label in text.
|
|
20
|
+
*
|
|
15
21
|
* @component
|
|
16
22
|
* @example
|
|
17
23
|
* // Indeterminate
|
|
@@ -21,11 +27,16 @@ export type ProgressBarProps = {
|
|
|
21
27
|
* // Determinate
|
|
22
28
|
* <ProgressBar value={64} ariaLabel="Upload" />
|
|
23
29
|
*
|
|
30
|
+
* @example
|
|
31
|
+
* // Graded value
|
|
32
|
+
* <ProgressBar value={72} modifier="warning" ariaLabel="Match score" />
|
|
33
|
+
*
|
|
24
34
|
* @param {Object} props - The properties of the ProgressBar component.
|
|
25
35
|
* @param {number} [props.value] - Progress between 0 and 100. Omit for indeterminate.
|
|
26
36
|
* @param {string} props.ariaLabel - Accessible name for the progress bar.
|
|
37
|
+
* @param {'default' | 'success' | 'warning' | 'error'} [props.modifier='default'] - Color of the fill.
|
|
27
38
|
*
|
|
28
39
|
* @returns {ReactNode} The rendered ProgressBar component.
|
|
29
40
|
*/
|
|
30
|
-
export declare function ProgressBar({ value, ariaLabel, ...restProps }: ProgressBarProps): ReactNode;
|
|
41
|
+
export declare function ProgressBar({ value, ariaLabel, modifier, ...restProps }: ProgressBarProps): ReactNode;
|
|
31
42
|
//# sourceMappingURL=ProgressBar.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressBar.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/ProgressBar/ProgressBar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sDAAsD;IACtD,SAAS,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"ProgressBar.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/ProgressBar/ProgressBar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAE9E,MAAM,MAAM,gBAAgB,GAAG;IAC7B,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sDAAsD;IACtD,SAAS,EAAE,MAAM,CAAC;IAClB,uDAAuD;IACvD,QAAQ,CAAC,EAAE,mBAAmB,CAAC;CAChC,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC,CAAC;AAe9D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,SAAS,EACT,QAAoB,EACpB,GAAG,SAAS,EACb,EAAE,gBAAgB,GAAG,SAAS,CA6B9B"}
|
|
@@ -1,4 +1,12 @@
|
|
|
1
1
|
import clsx from 'clsx';
|
|
2
|
+
// `warning` uses the amber family: the yellow `warning` token sits near 1.4:1
|
|
3
|
+
// against the track, below the 3:1 a graphic needs to be told apart.
|
|
4
|
+
const styleMap = {
|
|
5
|
+
default: 'bg-lavender dark:bg-lavender-dark',
|
|
6
|
+
success: 'bg-success dark:bg-success-dark',
|
|
7
|
+
warning: 'bg-amber dark:bg-amber-dark',
|
|
8
|
+
error: 'bg-error dark:bg-error-dark',
|
|
9
|
+
};
|
|
2
10
|
function clamp(value) {
|
|
3
11
|
return Math.min(100, Math.max(0, value));
|
|
4
12
|
}
|
|
@@ -9,6 +17,9 @@ function clamp(value) {
|
|
|
9
17
|
* where a line reads better than a ring, and of `Spinner` for waits that
|
|
10
18
|
* deserve a headline and copy under them.
|
|
11
19
|
*
|
|
20
|
+
* `modifier` colors the fill to grade the value (a score, a quota). Color is
|
|
21
|
+
* never the only signal: pair it with the value or a label in text.
|
|
22
|
+
*
|
|
12
23
|
* @component
|
|
13
24
|
* @example
|
|
14
25
|
* // Indeterminate
|
|
@@ -18,17 +29,22 @@ function clamp(value) {
|
|
|
18
29
|
* // Determinate
|
|
19
30
|
* <ProgressBar value={64} ariaLabel="Upload" />
|
|
20
31
|
*
|
|
32
|
+
* @example
|
|
33
|
+
* // Graded value
|
|
34
|
+
* <ProgressBar value={72} modifier="warning" ariaLabel="Match score" />
|
|
35
|
+
*
|
|
21
36
|
* @param {Object} props - The properties of the ProgressBar component.
|
|
22
37
|
* @param {number} [props.value] - Progress between 0 and 100. Omit for indeterminate.
|
|
23
38
|
* @param {string} props.ariaLabel - Accessible name for the progress bar.
|
|
39
|
+
* @param {'default' | 'success' | 'warning' | 'error'} [props.modifier='default'] - Color of the fill.
|
|
24
40
|
*
|
|
25
41
|
* @returns {ReactNode} The rendered ProgressBar component.
|
|
26
42
|
*/
|
|
27
|
-
export function ProgressBar({ value, ariaLabel, ...restProps }) {
|
|
43
|
+
export function ProgressBar({ value, ariaLabel, modifier = 'default', ...restProps }) {
|
|
28
44
|
const isDeterminate = typeof value === 'number';
|
|
29
45
|
const percent = isDeterminate ? clamp(value) : undefined;
|
|
30
46
|
return (<div {...restProps} role="progressbar" aria-label={ariaLabel} aria-valuemin={0} aria-valuemax={100} aria-valuenow={percent} className={clsx('bg-gray-6 dark:bg-gray-dark-1 h-1 overflow-hidden rounded-full', restProps.className)}>
|
|
31
|
-
<div className={clsx('
|
|
47
|
+
<div className={clsx('h-full rounded-full', styleMap[modifier], isDeterminate
|
|
32
48
|
? 'transition-[width] duration-300 ease-out'
|
|
33
49
|
: 'animate-progress-indeterminate w-2/5 motion-reduce:w-full motion-reduce:animate-none motion-reduce:opacity-60')} style={isDeterminate ? { width: `${percent}%` } : undefined}/>
|
|
34
50
|
</div>);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressBar.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/ProgressBar/ProgressBar.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"ProgressBar.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/ProgressBar/ProgressBar.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAcxB,8EAA8E;AAC9E,qEAAqE;AACrE,MAAM,QAAQ,GAAwC;IACpD,OAAO,EAAE,mCAAmC;IAC5C,OAAO,EAAE,iCAAiC;IAC1C,OAAO,EAAE,6BAA6B;IACtC,KAAK,EAAE,6BAA6B;CACrC,CAAC;AAEF,SAAS,KAAK,CAAC,KAAa;IAC1B,OAAO,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC;AAC3C,CAAC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,MAAM,UAAU,WAAW,CAAC,EAC1B,KAAK,EACL,SAAS,EACT,QAAQ,GAAG,SAAS,EACpB,GAAG,SAAS,EACK;IACjB,MAAM,aAAa,GAAG,OAAO,KAAK,KAAK,QAAQ,CAAC;IAChD,MAAM,OAAO,GAAG,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAEzD,OAAO,CACL,CAAC,GAAG,CACF,IAAI,SAAS,CAAC,CACd,IAAI,CAAC,aAAa,CAClB,UAAU,CAAC,CAAC,SAAS,CAAC,CACtB,aAAa,CAAC,CAAC,CAAC,CAAC,CACjB,aAAa,CAAC,CAAC,GAAG,CAAC,CACnB,aAAa,CAAC,CAAC,OAAO,CAAC,CACvB,SAAS,CAAC,CAAC,IAAI,CACb,gEAAgE,EAChE,SAAS,CAAC,SAAS,CACpB,CAAC,CAEF;MAAA,CAAC,GAAG,CACF,SAAS,CAAC,CAAC,IAAI,CACb,qBAAqB,EACrB,QAAQ,CAAC,QAAQ,CAAC,EAClB,aAAa;YACX,CAAC,CAAC,0CAA0C;YAC5C,CAAC,CAAC,+GAA+G,CACpH,CAAC,CACF,KAAK,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,GAAG,OAAO,GAAG,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,EAEhE;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC"}
|