@algolia/satellite 1.0.0-beta.131 → 1.0.0-beta.134
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/README.md +33 -28
- package/cjs/AnnouncementBadge/AnnouncementBadge.d.ts +8 -3
- package/cjs/AnnouncementBadge/AnnouncementBadge.js +25 -7
- package/cjs/AutoComplete/AutoComplete.d.ts +23 -17
- package/cjs/AutoComplete/AutoComplete.js +180 -124
- package/cjs/AutoComplete/AutoComplete.tailwind.d.ts +4 -4
- package/cjs/AutoComplete/AutoComplete.tailwind.js +10 -13
- package/cjs/AutoComplete/components/AutoCompleteEmptyState.d.ts +4 -4
- package/cjs/AutoComplete/components/AutoCompleteEmptyState.js +16 -13
- package/cjs/AutoComplete/components/DefaultOptionItem.d.ts +6 -2
- package/cjs/AutoComplete/components/DefaultOptionItem.js +24 -17
- package/cjs/AutoComplete/types.d.ts +33 -25
- package/cjs/AutoComplete/utils.d.ts +5 -4
- package/cjs/AutoComplete/utils.js +22 -2
- package/cjs/Avatars/ApplicationAvatar.js +7 -6
- package/cjs/Avatars/UserAvatar.js +19 -20
- package/cjs/Avatars/utils.d.ts +1 -1
- package/cjs/Badge/Badge.d.ts +5 -5
- package/cjs/Badge/Badge.js +21 -12
- package/cjs/Banner/Banner.d.ts +5 -4
- package/cjs/Banner/Banner.js +30 -25
- package/cjs/Banners/Alert/Alert.d.ts +5 -4
- package/cjs/Banners/Alert/Alert.js +29 -23
- package/cjs/Banners/BigBertha/BigBertha.d.ts +3 -2
- package/cjs/Banners/BigBertha/BigBertha.js +11 -9
- package/cjs/Banners/Promote/Promote.d.ts +6 -5
- package/cjs/Banners/Promote/Promote.js +38 -30
- package/cjs/Button/Button.js +23 -17
- package/cjs/Button/Button.tailwind.d.ts +4 -4
- package/cjs/Button/Button.tailwind.js +11 -14
- package/cjs/Button/ButtonGroup.d.ts +2 -1
- package/cjs/Button/ButtonGroup.js +6 -5
- package/cjs/Button/IconButton.d.ts +2 -2
- package/cjs/Button/IconButton.js +24 -22
- package/cjs/Button/styles.d.ts +1 -1
- package/cjs/Button/types.d.ts +5 -5
- package/cjs/Card/Card.d.ts +3 -3
- package/cjs/Card/Card.js +8 -11
- package/cjs/Card/Card.tailwind.d.ts +4 -4
- package/cjs/Card/Card.tailwind.js +5 -8
- package/cjs/Card/components/CardHeader.js +8 -4
- package/cjs/Card/components/CardTitle.d.ts +4 -2
- package/cjs/Card/components/CardTitle.js +11 -6
- package/cjs/Checkbox/Checkbox.d.ts +3 -3
- package/cjs/Checkbox/Checkbox.js +33 -30
- package/cjs/Checkbox/Checkbox.tailwind.d.ts +5 -5
- package/cjs/Checkbox/Checkbox.tailwind.js +11 -14
- package/cjs/ClickAwayContainer/ClickAwayContainer.d.ts +3 -2
- package/cjs/ClickAwayContainer/ClickAwayContainer.js +6 -9
- package/cjs/DatePicker/DatePicker/DatePicker.d.ts +13 -19
- package/cjs/DatePicker/DatePicker/DatePicker.js +90 -63
- package/cjs/DatePicker/DatePicker/datePickerReducer.d.ts +2 -2
- package/cjs/DatePicker/DatePicker/datePickerReducer.js +2 -2
- package/cjs/DatePicker/DatePicker.tailwind.d.ts +4 -4
- package/cjs/DatePicker/DatePicker.tailwind.js +19 -14
- package/cjs/DatePicker/DateRangePicker/DateRangePicker.d.ts +11 -17
- package/cjs/DatePicker/DateRangePicker/DateRangePicker.js +101 -70
- package/cjs/DatePicker/DateRangePicker/DateRangePickerDisplay.d.ts +4 -1
- package/cjs/DatePicker/DateRangePicker/DateRangePickerDisplay.js +18 -12
- package/cjs/DatePicker/DateRangePicker/dateRangePickerReducer.d.ts +3 -3
- package/cjs/DatePicker/DateRangePicker/dateRangePickerReducer.js +5 -5
- package/cjs/DatePicker/components/Calendar.d.ts +6 -2
- package/cjs/DatePicker/components/Calendar.js +12 -10
- package/cjs/DatePicker/components/Display.d.ts +3 -3
- package/cjs/DatePicker/components/Display.js +6 -5
- package/cjs/DatePicker/components/Footer.d.ts +2 -2
- package/cjs/DatePicker/components/Footer.js +6 -5
- package/cjs/DatePicker/components/FooterActions.d.ts +4 -1
- package/cjs/DatePicker/components/FooterActions.js +17 -13
- package/cjs/DatePicker/components/Modal.d.ts +5 -5
- package/cjs/DatePicker/components/Modal.js +18 -16
- package/cjs/DatePicker/components/NavBar.d.ts +7 -3
- package/cjs/DatePicker/components/NavBar.js +42 -41
- package/cjs/DatePicker/components/SidePanel.d.ts +2 -2
- package/cjs/DatePicker/components/SidePanel.js +9 -7
- package/cjs/DatePicker/types.d.ts +17 -0
- package/cjs/{tailwind-types.js → DatePicker/types.js} +0 -0
- package/cjs/DatePicker/utils.d.ts +2 -0
- package/cjs/DatePicker/utils.js +10 -2
- package/cjs/Dropdown/Dropdown.d.ts +8 -8
- package/cjs/Dropdown/Dropdown.js +49 -40
- package/cjs/Dropdown/DropdownButton.d.ts +4 -3
- package/cjs/Dropdown/DropdownButton.js +15 -9
- package/cjs/Dropdown/DropdownContext.d.ts +2 -2
- package/cjs/Dropdown/DropdownContext.js +2 -9
- package/cjs/Dropdown/components/DropdownButtonItem.d.ts +1 -1
- package/cjs/Dropdown/components/DropdownButtonItem.js +14 -14
- package/cjs/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItem.d.ts +4 -4
- package/cjs/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItem.js +30 -29
- package/cjs/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItemsGroup.d.ts +1 -1
- package/cjs/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItemsGroup.js +6 -7
- package/cjs/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItemsMultiGroup.d.ts +1 -1
- package/cjs/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItemsMultiGroup.js +6 -9
- package/cjs/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItemsSingleGroup.d.ts +1 -1
- package/cjs/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItemsSingleGroup.js +6 -9
- package/cjs/Dropdown/components/DropdownDivider.js +3 -3
- package/cjs/Dropdown/components/DropdownFooterItem.d.ts +2 -2
- package/cjs/Dropdown/components/DropdownFooterItem.js +11 -5
- package/cjs/Dropdown/components/DropdownLinkItem.js +14 -13
- package/cjs/Dropdown/components/DropdownRadioItem.d.ts +2 -2
- package/cjs/Dropdown/components/DropdownRadioItem.js +17 -16
- package/cjs/Dropdown/components/DropdownTitle.d.ts +4 -2
- package/cjs/Dropdown/components/DropdownTitle.js +8 -4
- package/cjs/Dropdown/components/DropdownToggleItem.d.ts +3 -3
- package/cjs/Dropdown/components/DropdownToggleItem.js +16 -16
- package/cjs/Dropdown/useDropdownItemProps.d.ts +3 -3
- package/cjs/Dropzone/Dropzone.d.ts +7 -3
- package/cjs/Dropzone/Dropzone.js +70 -56
- package/cjs/EmptyState/EmptyState.d.ts +1 -1
- package/cjs/EmptyState/EmptyState.js +29 -22
- package/cjs/EmptyState/EmptyState.tailwind.d.ts +4 -4
- package/cjs/EmptyState/EmptyState.tailwind.js +5 -8
- package/cjs/EmptyState/types.d.ts +7 -7
- package/cjs/Field/Field.d.ts +4 -3
- package/cjs/Field/Field.js +33 -26
- package/cjs/Flag/Flag.d.ts +3 -2
- package/cjs/Flag/Flag.js +58 -38
- package/cjs/Flag/Flag.tailwind.d.ts +4 -4
- package/cjs/Flag/Flag.tailwind.js +8 -15
- package/cjs/Flag/Flags.d.ts +3 -3
- package/cjs/Flag/Flags.js +32 -22
- package/cjs/Flag/types.d.ts +8 -4
- package/cjs/FlexGrid/FlexGrid.d.ts +2 -1
- package/cjs/FlexGrid/FlexGrid.js +15 -9
- package/cjs/FlexGrid/FlexGrid.tailwind.d.ts +6 -3
- package/cjs/FlexGrid/FlexGrid.tailwind.js +10 -13
- package/cjs/HelpUnderline/HelpUnderline.d.ts +2 -1
- package/cjs/HelpUnderline/HelpUnderline.js +9 -7
- package/cjs/HelpUnderline/HelpUnderline.tailwind.d.ts +4 -4
- package/cjs/HelpUnderline/HelpUnderline.tailwind.js +3 -6
- package/cjs/Input/Input.d.ts +11 -5
- package/cjs/Input/Input.js +131 -115
- package/cjs/Input/Input.tailwind.d.ts +4 -4
- package/cjs/Input/Input.tailwind.js +12 -15
- package/cjs/Insert/Insert.d.ts +3 -2
- package/cjs/Insert/Insert.js +29 -23
- package/cjs/InstantSearch/InstantSearch.tailwind.d.ts +4 -5
- package/cjs/InstantSearch/InstantSearch.tailwind.js +34 -32
- package/cjs/KeyboardKey/KeyboardKey.d.ts +2 -1
- package/cjs/KeyboardKey/KeyboardKey.js +11 -13
- package/cjs/KeyboardKey/KeyboardKey.tailwind.d.ts +4 -4
- package/cjs/KeyboardKey/KeyboardKey.tailwind.js +5 -8
- package/cjs/Link/BaseLink.d.ts +3 -3
- package/cjs/Link/BaseLink.js +7 -7
- package/cjs/Link/ButtonLink.d.ts +1 -1
- package/cjs/Link/ButtonLink.js +9 -5
- package/cjs/Link/IconButtonLink.d.ts +1 -1
- package/cjs/Link/IconButtonLink.js +8 -4
- package/cjs/Link/Link.d.ts +5 -5
- package/cjs/Link/Link.js +16 -15
- package/cjs/Medallion/Medallion.d.ts +2 -2
- package/cjs/Medallion/Medallion.js +8 -7
- package/cjs/Medallion/Medallion.tailwind.d.ts +4 -4
- package/cjs/Medallion/Medallion.tailwind.js +8 -11
- package/cjs/Modal/Modal.d.ts +8 -5
- package/cjs/Modal/Modal.js +60 -47
- package/cjs/Modal/Modal.tailwind.d.ts +4 -4
- package/cjs/Modal/Modal.tailwind.js +9 -18
- package/cjs/Modal/components/ModalFooter.d.ts +4 -2
- package/cjs/Modal/components/ModalFooter.js +16 -10
- package/cjs/Modal/components/ModalSection.d.ts +1 -1
- package/cjs/Modal/components/ModalSection.js +6 -5
- package/cjs/Pagination/CompactPagination/CompactPagination.d.ts +8 -0
- package/cjs/Pagination/CompactPagination/CompactPagination.js +62 -36
- package/cjs/Pagination/DotPagination/DotPagination.d.ts +5 -1
- package/cjs/Pagination/DotPagination/DotPagination.js +36 -16
- package/cjs/Pagination/Pagination/Pagination.d.ts +7 -1
- package/cjs/Pagination/Pagination/Pagination.js +79 -49
- package/cjs/ProgressBar/ProgressBar.d.ts +2 -2
- package/cjs/ProgressBar/ProgressBar.js +16 -11
- package/cjs/ProgressBar/ProgressBar.tailwind.d.ts +5 -5
- package/cjs/ProgressBar/ProgressBar.tailwind.js +7 -10
- package/cjs/ProgressSpinner/ProgressSpinner.d.ts +2 -2
- package/cjs/ProgressSpinner/ProgressSpinner.js +18 -11
- package/cjs/ProgressSpinner/ProgressSpinner.tailwind.d.ts +5 -5
- package/cjs/ProgressSpinner/ProgressSpinner.tailwind.js +4 -7
- package/cjs/RadioGroup/RadioButton.d.ts +3 -3
- package/cjs/RadioGroup/RadioButton.js +8 -8
- package/cjs/RadioGroup/RadioButton.tailwind.d.ts +4 -4
- package/cjs/RadioGroup/RadioButton.tailwind.js +11 -14
- package/cjs/RadioGroup/RadioGroup.d.ts +4 -3
- package/cjs/RadioGroup/RadioGroup.js +36 -34
- package/cjs/RangeSlider/RangeSlider.d.ts +3 -3
- package/cjs/RangeSlider/RangeSlider.js +37 -36
- package/cjs/RangeSlider/RangeSlider.tailwind.d.ts +4 -4
- package/cjs/RangeSlider/RangeSlider.tailwind.js +21 -24
- package/cjs/Satellite/Satellite.d.ts +5 -2
- package/cjs/Satellite/Satellite.js +13 -7
- package/cjs/Satellite/SatelliteContext.d.ts +3 -1
- package/cjs/Satellite/SatelliteContext.js +4 -3
- package/cjs/Satellite/SatelliteRouter.d.ts +1 -1
- package/cjs/Satellite/index.d.ts +1 -0
- package/cjs/Satellite/index.js +14 -0
- package/cjs/Satellite/locale.d.ts +27 -0
- package/cjs/Satellite/locale.js +21 -0
- package/cjs/ScrollIndicator/ScrollIndicator.d.ts +6 -3
- package/cjs/ScrollIndicator/ScrollIndicator.js +13 -16
- package/cjs/ScrollIndicator/ScrollIndicator.tailwind.d.ts +4 -4
- package/cjs/ScrollIndicator/ScrollIndicator.tailwind.js +8 -11
- package/cjs/Select/Select.d.ts +3 -3
- package/cjs/Select/Select.js +8 -8
- package/cjs/Select/Select.tailwind.d.ts +5 -5
- package/cjs/Select/Select.tailwind.js +5 -8
- package/cjs/Sidebar/Sidebar.d.ts +6 -4
- package/cjs/Sidebar/Sidebar.js +18 -10
- package/cjs/Sidebar/Sidebar.tailwind.d.ts +4 -4
- package/cjs/Sidebar/Sidebar.tailwind.js +5 -8
- package/cjs/Sidebar/SidebarContext.d.ts +1 -1
- package/cjs/Sidebar/components/SidebarHeader.d.ts +2 -2
- package/cjs/Sidebar/components/SidebarHeader.js +11 -6
- package/cjs/Sidebar/components/SidebarLink.d.ts +4 -3
- package/cjs/Sidebar/components/SidebarLink.js +32 -22
- package/cjs/Switch/Switch.d.ts +3 -3
- package/cjs/Switch/Switch.js +17 -19
- package/cjs/Switch/Switch.tailwind.d.ts +5 -5
- package/cjs/Switch/Switch.tailwind.js +7 -8
- package/cjs/Switch/SwitchOption.d.ts +2 -1
- package/cjs/Switch/SwitchOption.js +25 -17
- package/cjs/Tables/DataTable/DataTable.d.ts +15 -5
- package/cjs/Tables/DataTable/DataTable.js +79 -60
- package/cjs/Tables/DataTable/DataTable.tailwind.d.ts +4 -4
- package/cjs/Tables/DataTable/DataTable.tailwind.js +3 -6
- package/cjs/Tables/DataTable/components/Body.d.ts +7 -6
- package/cjs/Tables/DataTable/components/Body.js +62 -47
- package/cjs/Tables/DataTable/components/Footer.d.ts +1 -1
- package/cjs/Tables/DataTable/components/Footer.js +6 -6
- package/cjs/Tables/DataTable/components/Header.js +24 -20
- package/cjs/Tables/DataTable/components/HeaderCell.d.ts +3 -3
- package/cjs/Tables/DataTable/components/HeaderCell.js +20 -14
- package/cjs/Tables/DataTable/components/Loader.d.ts +3 -1
- package/cjs/Tables/DataTable/components/Loader.js +19 -20
- package/cjs/Tables/DataTable/types.d.ts +3 -3
- package/cjs/Tables/DataTable/utils.d.ts +1 -1
- package/cjs/Tables/Table/Table.d.ts +3 -3
- package/cjs/Tables/Table/Table.js +19 -12
- package/cjs/Tables/Table/Table.tailwind.d.ts +4 -4
- package/cjs/Tables/Table/Table.tailwind.js +3 -6
- package/cjs/Tables/Table/components/Footer.d.ts +2 -2
- package/cjs/Tables/Table/components/Footer.js +6 -5
- package/cjs/Tabs/ContentTabs.d.ts +1 -1
- package/cjs/Tabs/ContentTabs.js +39 -38
- package/cjs/Tabs/LinkTabs.d.ts +1 -1
- package/cjs/Tabs/LinkTabs.js +16 -16
- package/cjs/Tabs/Tabs.tailwind.d.ts +4 -4
- package/cjs/Tabs/Tabs.tailwind.js +5 -8
- package/cjs/Tabs/components/LinkTab.d.ts +3 -3
- package/cjs/Tabs/components/LinkTab.js +18 -12
- package/cjs/Tabs/types.d.ts +6 -6
- package/cjs/Tabs/utils.d.ts +1 -1
- package/cjs/Tag/Tag.d.ts +8 -4
- package/cjs/Tag/Tag.js +36 -24
- package/cjs/Tag/Tag.tailwind.d.ts +4 -4
- package/cjs/Tag/Tag.tailwind.js +6 -9
- package/cjs/TextArea/TextArea.d.ts +3 -3
- package/cjs/TextArea/TextArea.js +8 -8
- package/cjs/TextArea/TextArea.tailwind.d.ts +4 -4
- package/cjs/TextArea/TextArea.tailwind.js +4 -7
- package/cjs/TextWrap/TextWrap.js +20 -20
- package/cjs/Toggle/Toggle.d.ts +3 -3
- package/cjs/Toggle/Toggle.js +23 -21
- package/cjs/Toggle/Toggle.tailwind.d.ts +5 -5
- package/cjs/Toggle/Toggle.tailwind.js +19 -22
- package/cjs/Tooltip/OverflowTooltipWrapper.d.ts +3 -2
- package/cjs/Tooltip/OverflowTooltipWrapper.js +32 -24
- package/cjs/Tooltip/Tooltip.d.ts +3 -3
- package/cjs/Tooltip/Tooltip.js +8 -8
- package/cjs/Tooltip/Tooltip.tailwind.d.ts +4 -4
- package/cjs/Tooltip/Tooltip.tailwind.js +19 -18
- package/cjs/Tooltip/TooltipWrapper.d.ts +4 -3
- package/cjs/Tooltip/TooltipWrapper.js +47 -39
- package/cjs/Tooltip/types.d.ts +4 -2
- package/cjs/Typography/Typography.tailwind.d.ts +5 -17
- package/cjs/Typography/Typography.tailwind.js +125 -135
- package/cjs/UserContent/UserContent.js +3 -3
- package/cjs/UserContent/UserContent.tailwind.d.ts +4 -1
- package/cjs/UserContent/UserContent.tailwind.js +13 -13
- package/cjs/styles/base.tailwind.d.ts +4 -4
- package/cjs/styles/base.tailwind.js +3 -6
- package/cjs/styles/tailwind.config.d.ts +2 -198
- package/cjs/styles/tailwind.config.js +27 -31
- package/cjs/types.d.ts +10 -3
- package/cjs/utilities/utilities.tailwind.d.ts +4 -1
- package/cjs/utilities/utilities.tailwind.js +4 -6
- package/cjs/utils/genericChangeHandler.d.ts +3 -3
- package/cjs/utils/isCssPropertySupported.d.ts +1 -1
- package/cjs/utils/isRenderedChild.d.ts +2 -2
- package/cjs/utils/pluralize.js +6 -1
- package/cjs/utils/useForwardedRef.d.ts +2 -2
- package/cjs/utils/useLinkProps.d.ts +2 -2
- package/cjs/utils/useTriggerInputChange.d.ts +2 -2
- package/esm/AnnouncementBadge/AnnouncementBadge.d.ts +8 -3
- package/esm/AnnouncementBadge/AnnouncementBadge.js +23 -6
- package/esm/AutoComplete/AutoComplete.d.ts +23 -17
- package/esm/AutoComplete/AutoComplete.js +184 -115
- package/esm/AutoComplete/AutoComplete.tailwind.d.ts +4 -4
- package/esm/AutoComplete/AutoComplete.tailwind.js +10 -13
- package/esm/AutoComplete/components/AutoCompleteEmptyState.d.ts +4 -4
- package/esm/AutoComplete/components/AutoCompleteEmptyState.js +16 -12
- package/esm/AutoComplete/components/DefaultOptionItem.d.ts +6 -2
- package/esm/AutoComplete/components/DefaultOptionItem.js +25 -16
- package/esm/AutoComplete/types.d.ts +33 -25
- package/esm/AutoComplete/utils.d.ts +5 -4
- package/esm/AutoComplete/utils.js +16 -0
- package/esm/Avatars/ApplicationAvatar.js +6 -5
- package/esm/Avatars/UserAvatar.js +19 -14
- package/esm/Avatars/utils.d.ts +1 -1
- package/esm/Badge/Badge.d.ts +5 -5
- package/esm/Badge/Badge.js +21 -11
- package/esm/Banner/Banner.d.ts +5 -4
- package/esm/Banner/Banner.js +31 -25
- package/esm/Banners/Alert/Alert.d.ts +5 -4
- package/esm/Banners/Alert/Alert.js +30 -23
- package/esm/Banners/BigBertha/BigBertha.d.ts +3 -2
- package/esm/Banners/BigBertha/BigBertha.js +11 -8
- package/esm/Banners/Promote/Promote.d.ts +6 -5
- package/esm/Banners/Promote/Promote.js +37 -28
- package/esm/Button/Button.js +23 -16
- package/esm/Button/Button.tailwind.d.ts +4 -4
- package/esm/Button/Button.tailwind.js +13 -16
- package/esm/Button/ButtonGroup.d.ts +2 -1
- package/esm/Button/ButtonGroup.js +5 -4
- package/esm/Button/IconButton.d.ts +2 -2
- package/esm/Button/IconButton.js +24 -19
- package/esm/Button/styles.d.ts +1 -1
- package/esm/Button/types.d.ts +5 -5
- package/esm/Card/Card.d.ts +3 -3
- package/esm/Card/Card.js +6 -4
- package/esm/Card/Card.tailwind.d.ts +4 -4
- package/esm/Card/Card.tailwind.js +6 -9
- package/esm/Card/components/CardHeader.js +8 -3
- package/esm/Card/components/CardTitle.d.ts +4 -2
- package/esm/Card/components/CardTitle.js +11 -5
- package/esm/Checkbox/Checkbox.d.ts +3 -3
- package/esm/Checkbox/Checkbox.js +35 -26
- package/esm/Checkbox/Checkbox.tailwind.d.ts +5 -5
- package/esm/Checkbox/Checkbox.tailwind.js +11 -14
- package/esm/ClickAwayContainer/ClickAwayContainer.d.ts +3 -2
- package/esm/ClickAwayContainer/ClickAwayContainer.js +6 -4
- package/esm/DatePicker/DatePicker/DatePicker.d.ts +13 -19
- package/esm/DatePicker/DatePicker/DatePicker.js +92 -59
- package/esm/DatePicker/DatePicker/datePickerReducer.d.ts +2 -2
- package/esm/DatePicker/DatePicker/datePickerReducer.js +2 -2
- package/esm/DatePicker/DatePicker.tailwind.d.ts +4 -4
- package/esm/DatePicker/DatePicker.tailwind.js +19 -15
- package/esm/DatePicker/DateRangePicker/DateRangePicker.d.ts +11 -17
- package/esm/DatePicker/DateRangePicker/DateRangePicker.js +105 -67
- package/esm/DatePicker/DateRangePicker/DateRangePickerDisplay.d.ts +4 -1
- package/esm/DatePicker/DateRangePicker/DateRangePickerDisplay.js +19 -11
- package/esm/DatePicker/DateRangePicker/dateRangePickerReducer.d.ts +3 -3
- package/esm/DatePicker/DateRangePicker/dateRangePickerReducer.js +4 -4
- package/esm/DatePicker/components/Calendar.d.ts +6 -2
- package/esm/DatePicker/components/Calendar.js +13 -5
- package/esm/DatePicker/components/Display.d.ts +3 -3
- package/esm/DatePicker/components/Display.js +5 -4
- package/esm/DatePicker/components/Footer.d.ts +2 -2
- package/esm/DatePicker/components/Footer.js +5 -4
- package/esm/DatePicker/components/FooterActions.d.ts +4 -1
- package/esm/DatePicker/components/FooterActions.js +18 -13
- package/esm/DatePicker/components/Modal.d.ts +5 -5
- package/esm/DatePicker/components/Modal.js +19 -12
- package/esm/DatePicker/components/NavBar.d.ts +7 -3
- package/esm/DatePicker/components/NavBar.js +42 -35
- package/esm/DatePicker/components/SidePanel.d.ts +2 -2
- package/esm/DatePicker/components/SidePanel.js +8 -6
- package/esm/DatePicker/types.d.ts +17 -0
- package/esm/{tailwind-types.js → DatePicker/types.js} +0 -0
- package/esm/DatePicker/utils.d.ts +2 -0
- package/esm/DatePicker/utils.js +7 -0
- package/esm/Dropdown/Dropdown.d.ts +8 -8
- package/esm/Dropdown/Dropdown.js +45 -30
- package/esm/Dropdown/DropdownButton.d.ts +4 -3
- package/esm/Dropdown/DropdownButton.js +15 -8
- package/esm/Dropdown/DropdownContext.d.ts +2 -2
- package/esm/Dropdown/DropdownContext.js +2 -2
- package/esm/Dropdown/components/DropdownButtonItem.d.ts +1 -1
- package/esm/Dropdown/components/DropdownButtonItem.js +14 -12
- package/esm/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItem.d.ts +4 -4
- package/esm/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItem.js +29 -22
- package/esm/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItemsGroup.d.ts +1 -1
- package/esm/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItemsGroup.js +5 -4
- package/esm/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItemsMultiGroup.d.ts +1 -1
- package/esm/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItemsMultiGroup.js +6 -4
- package/esm/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItemsSingleGroup.d.ts +1 -1
- package/esm/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItemsSingleGroup.js +6 -4
- package/esm/Dropdown/components/DropdownDivider.js +2 -2
- package/esm/Dropdown/components/DropdownFooterItem.d.ts +2 -2
- package/esm/Dropdown/components/DropdownFooterItem.js +11 -4
- package/esm/Dropdown/components/DropdownLinkItem.js +14 -11
- package/esm/Dropdown/components/DropdownRadioItem.d.ts +2 -2
- package/esm/Dropdown/components/DropdownRadioItem.js +17 -14
- package/esm/Dropdown/components/DropdownTitle.d.ts +4 -2
- package/esm/Dropdown/components/DropdownTitle.js +8 -3
- package/esm/Dropdown/components/DropdownToggleItem.d.ts +3 -3
- package/esm/Dropdown/components/DropdownToggleItem.js +16 -14
- package/esm/Dropdown/useDropdownItemProps.d.ts +3 -3
- package/esm/Dropzone/Dropzone.d.ts +7 -3
- package/esm/Dropzone/Dropzone.js +69 -49
- package/esm/EmptyState/EmptyState.d.ts +1 -1
- package/esm/EmptyState/EmptyState.js +29 -21
- package/esm/EmptyState/EmptyState.tailwind.d.ts +4 -4
- package/esm/EmptyState/EmptyState.tailwind.js +6 -9
- package/esm/EmptyState/types.d.ts +7 -7
- package/esm/Field/Field.d.ts +4 -3
- package/esm/Field/Field.js +33 -25
- package/esm/Flag/Flag.d.ts +3 -2
- package/esm/Flag/Flag.js +57 -33
- package/esm/Flag/Flag.tailwind.d.ts +4 -4
- package/esm/Flag/Flag.tailwind.js +9 -16
- package/esm/Flag/Flags.d.ts +3 -3
- package/esm/Flag/Flags.js +30 -21
- package/esm/Flag/types.d.ts +8 -4
- package/esm/FlexGrid/FlexGrid.d.ts +2 -1
- package/esm/FlexGrid/FlexGrid.js +13 -8
- package/esm/FlexGrid/FlexGrid.tailwind.d.ts +6 -3
- package/esm/FlexGrid/FlexGrid.tailwind.js +10 -13
- package/esm/HelpUnderline/HelpUnderline.d.ts +2 -1
- package/esm/HelpUnderline/HelpUnderline.js +8 -6
- package/esm/HelpUnderline/HelpUnderline.tailwind.d.ts +4 -4
- package/esm/HelpUnderline/HelpUnderline.tailwind.js +4 -7
- package/esm/Input/Input.d.ts +11 -5
- package/esm/Input/Input.js +131 -109
- package/esm/Input/Input.tailwind.d.ts +4 -4
- package/esm/Input/Input.tailwind.js +14 -17
- package/esm/Insert/Insert.d.ts +3 -2
- package/esm/Insert/Insert.js +28 -21
- package/esm/InstantSearch/InstantSearch.tailwind.d.ts +4 -5
- package/esm/InstantSearch/InstantSearch.tailwind.js +35 -33
- package/esm/KeyboardKey/KeyboardKey.d.ts +2 -1
- package/esm/KeyboardKey/KeyboardKey.js +9 -6
- package/esm/KeyboardKey/KeyboardKey.tailwind.d.ts +4 -4
- package/esm/KeyboardKey/KeyboardKey.tailwind.js +6 -9
- package/esm/Link/BaseLink.d.ts +3 -3
- package/esm/Link/BaseLink.js +9 -3
- package/esm/Link/ButtonLink.d.ts +1 -1
- package/esm/Link/ButtonLink.js +9 -4
- package/esm/Link/IconButtonLink.d.ts +1 -1
- package/esm/Link/IconButtonLink.js +9 -4
- package/esm/Link/Link.d.ts +5 -5
- package/esm/Link/Link.js +18 -10
- package/esm/Medallion/Medallion.d.ts +2 -2
- package/esm/Medallion/Medallion.js +7 -6
- package/esm/Medallion/Medallion.tailwind.d.ts +4 -4
- package/esm/Medallion/Medallion.tailwind.js +8 -11
- package/esm/Modal/Modal.d.ts +8 -5
- package/esm/Modal/Modal.js +58 -39
- package/esm/Modal/Modal.tailwind.d.ts +4 -4
- package/esm/Modal/Modal.tailwind.js +10 -19
- package/esm/Modal/components/ModalFooter.d.ts +4 -2
- package/esm/Modal/components/ModalFooter.js +16 -9
- package/esm/Modal/components/ModalSection.d.ts +1 -1
- package/esm/Modal/components/ModalSection.js +5 -4
- package/esm/Pagination/CompactPagination/CompactPagination.d.ts +8 -0
- package/esm/Pagination/CompactPagination/CompactPagination.js +61 -37
- package/esm/Pagination/DotPagination/DotPagination.d.ts +5 -1
- package/esm/Pagination/DotPagination/DotPagination.js +33 -16
- package/esm/Pagination/Pagination/Pagination.d.ts +7 -1
- package/esm/Pagination/Pagination/Pagination.js +78 -48
- package/esm/ProgressBar/ProgressBar.d.ts +2 -2
- package/esm/ProgressBar/ProgressBar.js +16 -10
- package/esm/ProgressBar/ProgressBar.tailwind.d.ts +5 -5
- package/esm/ProgressBar/ProgressBar.tailwind.js +7 -10
- package/esm/ProgressSpinner/ProgressSpinner.d.ts +2 -2
- package/esm/ProgressSpinner/ProgressSpinner.js +18 -10
- package/esm/ProgressSpinner/ProgressSpinner.tailwind.d.ts +5 -5
- package/esm/ProgressSpinner/ProgressSpinner.tailwind.js +5 -8
- package/esm/RadioGroup/RadioButton.d.ts +3 -3
- package/esm/RadioGroup/RadioButton.js +9 -3
- package/esm/RadioGroup/RadioButton.tailwind.d.ts +4 -4
- package/esm/RadioGroup/RadioButton.tailwind.js +13 -16
- package/esm/RadioGroup/RadioGroup.d.ts +4 -3
- package/esm/RadioGroup/RadioGroup.js +36 -28
- package/esm/RangeSlider/RangeSlider.d.ts +3 -3
- package/esm/RangeSlider/RangeSlider.js +39 -31
- package/esm/RangeSlider/RangeSlider.tailwind.d.ts +4 -4
- package/esm/RangeSlider/RangeSlider.tailwind.js +21 -24
- package/esm/Satellite/Satellite.d.ts +5 -2
- package/esm/Satellite/Satellite.js +11 -6
- package/esm/Satellite/SatelliteContext.d.ts +3 -1
- package/esm/Satellite/SatelliteContext.js +4 -3
- package/esm/Satellite/SatelliteRouter.d.ts +1 -1
- package/esm/Satellite/index.d.ts +1 -0
- package/esm/Satellite/index.js +1 -0
- package/esm/Satellite/locale.d.ts +27 -0
- package/esm/Satellite/locale.js +8 -0
- package/esm/ScrollIndicator/ScrollIndicator.d.ts +6 -3
- package/esm/ScrollIndicator/ScrollIndicator.js +12 -10
- package/esm/ScrollIndicator/ScrollIndicator.tailwind.d.ts +4 -4
- package/esm/ScrollIndicator/ScrollIndicator.tailwind.js +8 -11
- package/esm/Select/Select.d.ts +3 -3
- package/esm/Select/Select.js +8 -3
- package/esm/Select/Select.tailwind.d.ts +5 -5
- package/esm/Select/Select.tailwind.js +5 -8
- package/esm/Sidebar/Sidebar.d.ts +6 -4
- package/esm/Sidebar/Sidebar.js +16 -8
- package/esm/Sidebar/Sidebar.tailwind.d.ts +4 -4
- package/esm/Sidebar/Sidebar.tailwind.js +6 -9
- package/esm/Sidebar/SidebarContext.d.ts +1 -1
- package/esm/Sidebar/components/SidebarHeader.d.ts +2 -2
- package/esm/Sidebar/components/SidebarHeader.js +11 -5
- package/esm/Sidebar/components/SidebarLink.d.ts +4 -3
- package/esm/Sidebar/components/SidebarLink.js +34 -21
- package/esm/Switch/Switch.d.ts +3 -3
- package/esm/Switch/Switch.js +16 -12
- package/esm/Switch/Switch.tailwind.d.ts +5 -5
- package/esm/Switch/Switch.tailwind.js +7 -8
- package/esm/Switch/SwitchOption.d.ts +2 -1
- package/esm/Switch/SwitchOption.js +25 -16
- package/esm/Tables/DataTable/DataTable.d.ts +15 -5
- package/esm/Tables/DataTable/DataTable.js +77 -54
- package/esm/Tables/DataTable/DataTable.tailwind.d.ts +4 -4
- package/esm/Tables/DataTable/DataTable.tailwind.js +4 -7
- package/esm/Tables/DataTable/components/Body.d.ts +7 -6
- package/esm/Tables/DataTable/components/Body.js +60 -45
- package/esm/Tables/DataTable/components/Footer.d.ts +1 -1
- package/esm/Tables/DataTable/components/Footer.js +5 -5
- package/esm/Tables/DataTable/components/Header.js +22 -18
- package/esm/Tables/DataTable/components/HeaderCell.d.ts +3 -3
- package/esm/Tables/DataTable/components/HeaderCell.js +20 -13
- package/esm/Tables/DataTable/components/Loader.d.ts +3 -1
- package/esm/Tables/DataTable/components/Loader.js +18 -14
- package/esm/Tables/DataTable/types.d.ts +3 -3
- package/esm/Tables/DataTable/utils.d.ts +1 -1
- package/esm/Tables/Table/Table.d.ts +3 -3
- package/esm/Tables/Table/Table.js +20 -11
- package/esm/Tables/Table/Table.tailwind.d.ts +4 -4
- package/esm/Tables/Table/Table.tailwind.js +4 -7
- package/esm/Tables/Table/components/Footer.d.ts +2 -2
- package/esm/Tables/Table/components/Footer.js +5 -4
- package/esm/Tabs/ContentTabs.d.ts +1 -1
- package/esm/Tabs/ContentTabs.js +38 -31
- package/esm/Tabs/LinkTabs.d.ts +1 -1
- package/esm/Tabs/LinkTabs.js +14 -14
- package/esm/Tabs/Tabs.tailwind.d.ts +4 -4
- package/esm/Tabs/Tabs.tailwind.js +6 -9
- package/esm/Tabs/components/LinkTab.d.ts +3 -3
- package/esm/Tabs/components/LinkTab.js +18 -11
- package/esm/Tabs/types.d.ts +6 -6
- package/esm/Tabs/utils.d.ts +1 -1
- package/esm/Tag/Tag.d.ts +8 -4
- package/esm/Tag/Tag.js +36 -19
- package/esm/Tag/Tag.tailwind.d.ts +4 -4
- package/esm/Tag/Tag.tailwind.js +7 -10
- package/esm/TextArea/TextArea.d.ts +3 -3
- package/esm/TextArea/TextArea.js +9 -3
- package/esm/TextArea/TextArea.tailwind.d.ts +4 -4
- package/esm/TextArea/TextArea.tailwind.js +6 -9
- package/esm/TextWrap/TextWrap.js +22 -17
- package/esm/Toggle/Toggle.d.ts +3 -3
- package/esm/Toggle/Toggle.js +25 -16
- package/esm/Toggle/Toggle.tailwind.d.ts +5 -5
- package/esm/Toggle/Toggle.tailwind.js +19 -22
- package/esm/Tooltip/OverflowTooltipWrapper.d.ts +3 -2
- package/esm/Tooltip/OverflowTooltipWrapper.js +35 -19
- package/esm/Tooltip/Tooltip.d.ts +3 -3
- package/esm/Tooltip/Tooltip.js +8 -3
- package/esm/Tooltip/Tooltip.tailwind.d.ts +4 -4
- package/esm/Tooltip/Tooltip.tailwind.js +20 -19
- package/esm/Tooltip/TooltipWrapper.d.ts +4 -3
- package/esm/Tooltip/TooltipWrapper.js +48 -33
- package/esm/Tooltip/types.d.ts +4 -2
- package/esm/Typography/Typography.tailwind.d.ts +5 -17
- package/esm/Typography/Typography.tailwind.js +126 -136
- package/esm/UserContent/UserContent.js +2 -2
- package/esm/UserContent/UserContent.tailwind.d.ts +4 -1
- package/esm/UserContent/UserContent.tailwind.js +14 -14
- package/esm/styles/base.tailwind.d.ts +4 -4
- package/esm/styles/base.tailwind.js +4 -7
- package/esm/styles/tailwind.config.d.ts +2 -198
- package/esm/styles/tailwind.config.js +29 -32
- package/esm/types.d.ts +10 -3
- package/esm/utilities/utilities.tailwind.d.ts +4 -1
- package/esm/utilities/utilities.tailwind.js +4 -6
- package/esm/utils/genericChangeHandler.d.ts +3 -3
- package/esm/utils/isCssPropertySupported.d.ts +1 -1
- package/esm/utils/isRenderedChild.d.ts +2 -2
- package/esm/utils/pluralize.js +6 -1
- package/esm/utils/useForwardedRef.d.ts +2 -2
- package/esm/utils/useForwardedRef.js +1 -1
- package/esm/utils/useLinkProps.d.ts +2 -2
- package/esm/utils/useTriggerInputChange.d.ts +2 -2
- package/package.json +11 -14
- package/satellite.min.css +2 -4
- package/scss/colors.scss +1 -0
- package/cjs/tailwind-types.d.ts +0 -52
- package/esm/tailwind-types.d.ts +0 -52
- package/satellite.css +0 -196852
@@ -2,10 +2,11 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
|
|
2
2
|
|
3
3
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24;
|
4
4
|
|
5
|
-
import React from "react";
|
6
5
|
import cx from "classnames";
|
7
|
-
import stl from "../styles/helpers/satellitePrefixer";
|
8
6
|
import FlexGrid from "../FlexGrid";
|
7
|
+
import stl from "../styles/helpers/satellitePrefixer";
|
8
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
9
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
9
10
|
var CONTAINER_CONTEXT_CLASSNAMES = {
|
10
11
|
result: {
|
11
12
|
medium: stl(_templateObject || (_templateObject = _taggedTemplateLiteral(["max-w-xs"]))),
|
@@ -61,25 +62,32 @@ var renderEmptyState = function renderEmptyState(_ref) {
|
|
61
62
|
var titleClassNames = cx(stl(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["text-grey-900"]))), TITLE_CONTEXT_CLASSNAMES[usageContext]);
|
62
63
|
var descriptionClassNames = cx(stl(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["text-grey-600"]))), DESCRIPTION_CONTEXT_CLASSNAMES[usageContext]);
|
63
64
|
var actionsClassNames = cx(ACTIONS_CONTEXT_CLASSNAMES[usageContext]);
|
64
|
-
return /*#__PURE__*/
|
65
|
-
className: containerClassNames
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
65
|
+
return /*#__PURE__*/_jsxs("div", {
|
66
|
+
className: containerClassNames,
|
67
|
+
children: [/*#__PURE__*/_jsxs("div", {
|
68
|
+
className: stl(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["min-w-2/5"]))),
|
69
|
+
children: [centered && medallion && /*#__PURE__*/_jsx("div", {
|
70
|
+
className: MEDALLION_CONTEXT_CLASSNAMES[usageContext],
|
71
|
+
children: medallion
|
72
|
+
}), /*#__PURE__*/_jsx("h2", {
|
73
|
+
className: titleClassNames,
|
74
|
+
children: title
|
75
|
+
}), description && /*#__PURE__*/_jsx("p", {
|
76
|
+
className: descriptionClassNames,
|
77
|
+
children: description
|
78
|
+
}), actions && /*#__PURE__*/_jsx(FlexGrid, {
|
79
|
+
className: actionsClassNames,
|
80
|
+
alignment: centered ? "center" : "leading",
|
81
|
+
distribution: centered ? "center" : "leading",
|
82
|
+
direction: actionsDirection !== null && actionsDirection !== void 0 ? actionsDirection : centered ? "column" : "row",
|
83
|
+
spacing: "sm",
|
84
|
+
children: actions
|
85
|
+
})]
|
86
|
+
}), illustration && !centered && usageContext === "page" && /*#__PURE__*/_jsx("div", {
|
87
|
+
className: stl(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["empty-state-illustration ml-16 hidden lg:flex items-center justify-center"]))),
|
88
|
+
children: illustration
|
89
|
+
})]
|
90
|
+
});
|
83
91
|
};
|
84
92
|
/**
|
85
93
|
* Empty states are used when a list, table, chart or page has no items or data to show. This is an opportunity to provide explanation or guidance to help users progress. This can also be shown when a features hasn't been enable.
|
@@ -1,5 +1,5 @@
|
|
1
1
|
export = emptyStatePlugin;
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
2
|
+
declare const emptyStatePlugin: {
|
3
|
+
handler: import("tailwindcss/types/config").PluginCreator;
|
4
|
+
config?: import("tailwindcss").Config | undefined;
|
5
|
+
};
|
@@ -1,17 +1,14 @@
|
|
1
|
+
import _plugin from "tailwindcss/plugin";
|
1
2
|
// @ts-check
|
2
|
-
|
3
|
-
|
4
|
-
* @type {import('../tailwind-types').TailwindPlugin}
|
5
|
-
*/
|
6
|
-
var emptyStatePlugin = function emptyStatePlugin(_ref) {
|
3
|
+
var plugin = _plugin;
|
4
|
+
var emptyStatePlugin = plugin(function (_ref) {
|
7
5
|
var addComponents = _ref.addComponents;
|
8
6
|
// Empty State illustration
|
9
7
|
addComponents({
|
10
8
|
".empty-state-illustration": {
|
11
|
-
minWidth:
|
12
|
-
minHeight:
|
9
|
+
minWidth: "500px",
|
10
|
+
minHeight: "500px"
|
13
11
|
}
|
14
12
|
});
|
15
|
-
};
|
16
|
-
|
13
|
+
});
|
17
14
|
export default emptyStatePlugin;
|
@@ -1,20 +1,20 @@
|
|
1
|
-
|
2
|
-
import { FlexGridDirection } from "../FlexGrid";
|
1
|
+
import type { ReactNode } from "react";
|
2
|
+
import type { FlexGridDirection } from "../FlexGrid";
|
3
3
|
export declare type EmptyStateUsageContexts = "result" | "feature" | "page";
|
4
4
|
export declare type EmptyStateWidths = "medium" | "large" | "xlarge";
|
5
5
|
export interface EmptyStatePropsAll {
|
6
6
|
/** Descriptive title for the state */
|
7
|
-
title:
|
7
|
+
title: ReactNode;
|
8
8
|
/** Optional description to explain why the screen is empty or define next steps */
|
9
|
-
description?:
|
9
|
+
description?: ReactNode;
|
10
10
|
/** Buttons */
|
11
|
-
actions?:
|
11
|
+
actions?: ReactNode;
|
12
12
|
/** Direction overwrite for the buttons */
|
13
13
|
actionsDirection?: FlexGridDirection;
|
14
14
|
/** Add a <Medallion /> element in there */
|
15
|
-
medallion?:
|
15
|
+
medallion?: ReactNode;
|
16
16
|
/** Plop in an `img` element or `svg` here */
|
17
|
-
illustration?:
|
17
|
+
illustration?: ReactNode;
|
18
18
|
/**
|
19
19
|
* UsageContext of the component
|
20
20
|
* @default "feature"
|
package/esm/Field/Field.d.ts
CHANGED
@@ -1,19 +1,20 @@
|
|
1
|
-
import
|
1
|
+
import type { FunctionComponent, ReactChild, ReactNode } from "react";
|
2
2
|
import { FieldState } from "./FieldStateContext";
|
3
3
|
export interface FieldProps {
|
4
4
|
/** @ignore */
|
5
5
|
className?: string;
|
6
6
|
/** Label to display above the nested input */
|
7
|
-
label?:
|
7
|
+
label?: ReactChild;
|
8
8
|
labelFor?: string;
|
9
9
|
/** Helpful description to show below the `Field` */
|
10
|
-
description?:
|
10
|
+
description?: ReactNode;
|
11
11
|
/**
|
12
12
|
* An object to handle state
|
13
13
|
* @default DEFAULT_STATE
|
14
14
|
*/
|
15
15
|
state?: FieldState;
|
16
16
|
inline?: boolean;
|
17
|
+
children: ReactNode;
|
17
18
|
}
|
18
19
|
/**
|
19
20
|
* Use text fields to help users enter, select, and search for text. Text fields are normally found within a form but can also be part of a modal, search, or card
|
package/esm/Field/Field.js
CHANGED
@@ -2,11 +2,12 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
|
|
2
2
|
|
3
3
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
|
4
4
|
|
5
|
-
import React from "react";
|
6
5
|
import cx from "classnames";
|
7
6
|
import { AlertCircle } from "react-feather";
|
8
7
|
import stl from "../styles/helpers/satellitePrefixer";
|
9
8
|
import FieldStateContext, { DEFAULT_STATE } from "./FieldStateContext";
|
9
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
10
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
10
11
|
|
11
12
|
/**
|
12
13
|
* Use text fields to help users enter, select, and search for text. Text fields are normally found within a form but can also be part of a modal, search, or card
|
@@ -52,29 +53,36 @@ export var Field = function Field(_ref) {
|
|
52
53
|
_ref$inline = _ref.inline,
|
53
54
|
inline = _ref$inline === void 0 ? false : _ref$inline,
|
54
55
|
children = _ref.children;
|
55
|
-
return /*#__PURE__*/
|
56
|
-
value: state
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
56
|
+
return /*#__PURE__*/_jsx(FieldStateContext.Provider, {
|
57
|
+
value: state,
|
58
|
+
children: /*#__PURE__*/_jsxs("div", {
|
59
|
+
className: className,
|
60
|
+
children: [/*#__PURE__*/_jsxs("label", {
|
61
|
+
className: stl(_templateObject || (_templateObject = _taggedTemplateLiteral(["cursor-pointer flex ", ""])), !inline && "flex-col"),
|
62
|
+
htmlFor: labelFor,
|
63
|
+
children: [label && /*#__PURE__*/_jsx("div", {
|
64
|
+
className: stl(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["truncate ", ""])), inline ? "mr-2" : "mb-1"),
|
65
|
+
children: label
|
66
|
+
}), /*#__PURE__*/_jsx("div", {
|
67
|
+
className: cx(inline && stl(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["ml-auto mt-1"])))),
|
68
|
+
children: children
|
69
|
+
})]
|
70
|
+
}), state.status === "invalid" && state.errors.length > 0 ? /*#__PURE__*/_jsx("ul", {
|
71
|
+
className: stl(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["mb-1 mt-2 display-caption"]))),
|
72
|
+
children: state.errors.map(function (error) {
|
73
|
+
return /*#__PURE__*/_jsxs("li", {
|
74
|
+
className: stl(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["flex items-center"]))),
|
75
|
+
children: [/*#__PURE__*/_jsx(AlertCircle, {
|
76
|
+
className: stl(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["text-red-700 mr-1"]))),
|
77
|
+
size: "1rem"
|
78
|
+
}), error]
|
79
|
+
}, error);
|
80
|
+
})
|
81
|
+
}) : description ? /*#__PURE__*/_jsx("p", {
|
82
|
+
className: cx(stl(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["display-caption text-grey-600"]))), inline ? stl(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["mt-1"]))) : stl(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["mt-2"])))),
|
83
|
+
children: description
|
84
|
+
}) : null]
|
85
|
+
})
|
86
|
+
});
|
79
87
|
};
|
80
88
|
export default Field;
|
package/esm/Flag/Flag.d.ts
CHANGED
@@ -1,5 +1,6 @@
|
|
1
|
-
import { FunctionComponent } from "react";
|
2
|
-
import { Notification } from "./types";
|
1
|
+
import type { FunctionComponent } from "react";
|
2
|
+
import type { Notification } from "./types";
|
3
|
+
export declare type FlagLocale = Notification["locale"];
|
3
4
|
export declare type FlagProps = Omit<Notification, "id" | "content">;
|
4
5
|
export declare const Flag: FunctionComponent<FlagProps>;
|
5
6
|
export default Flag;
|
package/esm/Flag/Flag.js
CHANGED
@@ -1,15 +1,26 @@
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
2
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
2
3
|
import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
|
3
4
|
|
4
5
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
|
5
6
|
|
6
|
-
|
7
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
8
|
+
|
9
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
10
|
+
|
7
11
|
import cx from "classnames";
|
8
|
-
import {
|
9
|
-
import
|
10
|
-
import ProgressSpinner from "../ProgressSpinner";
|
12
|
+
import { useEffect, useRef, useState } from "react";
|
13
|
+
import { Check, X } from "react-feather";
|
11
14
|
import { IconButton } from "../Button";
|
12
15
|
import { Card } from "../Card";
|
16
|
+
import ProgressSpinner from "../ProgressSpinner";
|
17
|
+
import { useLocale } from "../Satellite";
|
18
|
+
import stl from "../styles/helpers/satellitePrefixer";
|
19
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
20
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
21
|
+
var DEFAULT_FLAG_LOCALE = {
|
22
|
+
dismissText: "Dismiss"
|
23
|
+
};
|
13
24
|
var VARIANT_CLASSNAMES = {
|
14
25
|
grey: stl(_templateObject || (_templateObject = _taggedTemplateLiteral(["bg-grey-500"]))),
|
15
26
|
accent: stl(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["bg-accent-500"]))),
|
@@ -36,7 +47,11 @@ export var Flag = function Flag(_ref) {
|
|
36
47
|
_ref$variant = _ref.variant,
|
37
48
|
variant = _ref$variant === void 0 ? "accent" : _ref$variant,
|
38
49
|
autoDismissAfter = _ref.autoDismissAfter,
|
50
|
+
propsLocale = _ref.locale,
|
39
51
|
children = _ref.children;
|
52
|
+
var contextLocale = useLocale("flag");
|
53
|
+
|
54
|
+
var locale = _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_FLAG_LOCALE), contextLocale), propsLocale);
|
40
55
|
|
41
56
|
var _useState = useState(false),
|
42
57
|
_useState2 = _slicedToArray(_useState, 2),
|
@@ -57,35 +72,44 @@ export var Flag = function Flag(_ref) {
|
|
57
72
|
return clearTimeout(timer);
|
58
73
|
};
|
59
74
|
}, [autoDismissAfter, hovered]);
|
60
|
-
return /*#__PURE__*/
|
75
|
+
return /*#__PURE__*/_jsx(Card, {
|
61
76
|
fullBleed: true,
|
62
|
-
className: stl(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["flag shadow-z500"])))
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
77
|
+
className: stl(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["flag shadow-z500"]))),
|
78
|
+
children: /*#__PURE__*/_jsxs("div", {
|
79
|
+
className: stl(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["p-4 flex"]))),
|
80
|
+
onMouseEnter: function onMouseEnter() {
|
81
|
+
return setHovered(true);
|
82
|
+
},
|
83
|
+
onMouseLeave: function onMouseLeave() {
|
84
|
+
return setHovered(false);
|
85
|
+
},
|
86
|
+
children: [loading ? /*#__PURE__*/_jsx(ProgressSpinner, {
|
87
|
+
size: 16,
|
88
|
+
className: cx(stl(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["mt-1"]))), VARIANT_SPINNER_CLASSNAMES[variant])
|
89
|
+
}) : /*#__PURE__*/_jsx(Icon, {
|
90
|
+
className: cx(stl(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["shrink-0 text-white rounded-full p-2px mt-1"]))), VARIANT_CLASSNAMES[variant]),
|
91
|
+
size: 16
|
92
|
+
}), /*#__PURE__*/_jsxs("div", {
|
93
|
+
className: stl(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["flex-1 ml-4"]))),
|
94
|
+
children: [/*#__PURE__*/_jsxs("div", {
|
95
|
+
className: stl(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["flex justify-between"]))),
|
96
|
+
children: [hasTitle ? /*#__PURE__*/_jsx("h3", {
|
97
|
+
children: title
|
98
|
+
}) : /*#__PURE__*/_jsx("div", {
|
99
|
+
children: children
|
100
|
+
}), onDismiss && /*#__PURE__*/_jsx(IconButton, {
|
101
|
+
icon: X,
|
102
|
+
title: locale.dismissText,
|
103
|
+
variant: "subtle",
|
104
|
+
size: "small",
|
105
|
+
onClick: onDismiss
|
106
|
+
})]
|
107
|
+
}), hasTitle && children && /*#__PURE__*/_jsx("div", {
|
108
|
+
className: stl(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["text-grey-600 mt-2"]))),
|
109
|
+
children: children
|
110
|
+
})]
|
111
|
+
})]
|
112
|
+
})
|
113
|
+
});
|
90
114
|
};
|
91
115
|
export default Flag;
|
@@ -1,5 +1,5 @@
|
|
1
1
|
export = flagPlugin;
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
2
|
+
declare const flagPlugin: {
|
3
|
+
handler: import("tailwindcss/types/config").PluginCreator;
|
4
|
+
config?: import("tailwindcss").Config | undefined;
|
5
|
+
};
|
@@ -1,40 +1,33 @@
|
|
1
|
+
import _plugin from "tailwindcss/plugin";
|
1
2
|
// @ts-check
|
2
|
-
|
3
|
-
|
4
|
-
* @type {import('../tailwind-types').TailwindPlugin}
|
5
|
-
*/
|
6
|
-
var flagPlugin = function flagPlugin(_ref) {
|
3
|
+
var plugin = _plugin;
|
4
|
+
var flagPlugin = plugin(function (_ref) {
|
7
5
|
var addComponents = _ref.addComponents;
|
8
|
-
|
9
|
-
/**
|
10
|
-
* @param {string} color
|
11
|
-
*/
|
12
6
|
var TRANSITION_TIMEOUT = 500;
|
13
7
|
addComponents({
|
14
8
|
".flag": {
|
15
|
-
width:
|
9
|
+
width: "320px"
|
16
10
|
}
|
17
11
|
});
|
18
12
|
addComponents({
|
19
13
|
".flags_item-enter": {
|
20
|
-
opacity: 0.01,
|
14
|
+
opacity: "0.01",
|
21
15
|
transform: "translate(0, 80px)"
|
22
16
|
},
|
23
17
|
".flags_item-enter-active": {
|
24
|
-
opacity: 1,
|
18
|
+
opacity: "1",
|
25
19
|
transform: "translate(0, 0)",
|
26
20
|
transition: "all ".concat(TRANSITION_TIMEOUT, "ms ease-in")
|
27
21
|
},
|
28
22
|
".flags_item-exit": {
|
29
|
-
opacity: 1,
|
23
|
+
opacity: "1",
|
30
24
|
transform: "translate(0, 0)"
|
31
25
|
},
|
32
26
|
".flags_item-exit-active": {
|
33
|
-
opacity: 0.01,
|
27
|
+
opacity: "0.01",
|
34
28
|
transform: "translate(0, 80px)",
|
35
29
|
transition: "all ".concat(TRANSITION_TIMEOUT, "ms ease-in")
|
36
30
|
}
|
37
31
|
});
|
38
|
-
};
|
39
|
-
|
32
|
+
});
|
40
33
|
export default flagPlugin;
|
package/esm/Flag/Flags.d.ts
CHANGED
@@ -1,5 +1,5 @@
|
|
1
|
-
|
2
|
-
import { Notification } from "./types";
|
1
|
+
/// <reference types="react" />
|
2
|
+
import type { Notification } from "./types";
|
3
3
|
export interface FlagsProps {
|
4
4
|
/**
|
5
5
|
* Array of notifications
|
@@ -44,5 +44,5 @@ export interface FlagsProps {
|
|
44
44
|
*
|
45
45
|
* When there are multiple flags, they will stack on top of one another with the most recent flag on top. When a user dismisses a flag, any older flags 'below' will come to the top. Careful consideration should be taken to take into account the ordering and priority of flags in the stack. Never use dismissible and non-dismissible flags in a stack as flags that automatically dismiss can do so and not be visible to the user.
|
46
46
|
*/
|
47
|
-
export declare const Flags: ({ notifications }: FlagsProps) =>
|
47
|
+
export declare const Flags: ({ notifications }: FlagsProps) => import("react").ReactPortal;
|
48
48
|
export default Flags;
|
package/esm/Flag/Flags.js
CHANGED
@@ -1,14 +1,19 @@
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
1
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
2
3
|
import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
|
3
4
|
var _excluded = ["content", "id"];
|
4
5
|
|
5
6
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
|
6
7
|
|
7
|
-
|
8
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
9
|
+
|
10
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
11
|
+
|
8
12
|
import { createPortal } from "react-dom";
|
9
13
|
import { CSSTransition, TransitionGroup } from "react-transition-group";
|
10
14
|
import stl from "../styles/helpers/satellitePrefixer";
|
11
15
|
import Flag from "./Flag";
|
16
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
12
17
|
var TRANSITION_TIMEOUT = 500;
|
13
18
|
/**
|
14
19
|
* Use flags for messages containing confirmations, alerts, and acknowledgments that require minimal user interaction. These event-driven messages appear at the bottom of the screen and overlay any content.
|
@@ -51,27 +56,31 @@ var TRANSITION_TIMEOUT = 500;
|
|
51
56
|
export var Flags = function Flags(_ref) {
|
52
57
|
var _ref$notifications = _ref.notifications,
|
53
58
|
notifications = _ref$notifications === void 0 ? [] : _ref$notifications;
|
54
|
-
return /*#__PURE__*/createPortal( /*#__PURE__*/
|
59
|
+
return /*#__PURE__*/createPortal( /*#__PURE__*/_jsx(TransitionGroup, {
|
55
60
|
className: stl(_templateObject || (_templateObject = _taggedTemplateLiteral(["z-notification bottom-0 right-0 fixed flex flex-col items-end p-4"]))),
|
56
|
-
component: "ul"
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
+
component: "ul",
|
62
|
+
children: notifications.map(function (_ref2) {
|
63
|
+
var content = _ref2.content,
|
64
|
+
id = _ref2.id,
|
65
|
+
rest = _objectWithoutProperties(_ref2, _excluded);
|
61
66
|
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
67
|
+
return /*#__PURE__*/_jsx(CSSTransition, {
|
68
|
+
classNames: {
|
69
|
+
enter: stl(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["flags_item-enter"]))),
|
70
|
+
enterActive: stl(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["flags_item-enter-active"]))),
|
71
|
+
exit: stl(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["flags_item-exit"]))),
|
72
|
+
exitActive: stl(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["flags_item-exit-active"])))
|
73
|
+
},
|
74
|
+
timeout: TRANSITION_TIMEOUT,
|
75
|
+
appear: true,
|
76
|
+
children: /*#__PURE__*/_jsx("li", {
|
77
|
+
className: stl(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["mt-4"]))),
|
78
|
+
children: /*#__PURE__*/_jsx(Flag, _objectSpread(_objectSpread({}, rest), {}, {
|
79
|
+
children: content
|
80
|
+
}))
|
81
|
+
})
|
82
|
+
}, id);
|
83
|
+
})
|
84
|
+
}), document.body);
|
76
85
|
};
|
77
86
|
export default Flags;
|
package/esm/Flag/types.d.ts
CHANGED
@@ -1,12 +1,12 @@
|
|
1
|
-
|
2
|
-
import { IconComponentType } from "../types";
|
3
|
-
import { ColorVariant } from "../types";
|
1
|
+
import type { ReactNode } from "react";
|
2
|
+
import type { IconComponentType } from "../types";
|
3
|
+
import type { ColorVariant } from "../types";
|
4
4
|
export interface Notification {
|
5
5
|
/** Unique notification ID */
|
6
6
|
id: string;
|
7
7
|
title?: string;
|
8
8
|
/** Content goes here */
|
9
|
-
content:
|
9
|
+
content: ReactNode;
|
10
10
|
/** Icon to accompany the notification */
|
11
11
|
icon?: IconComponentType;
|
12
12
|
/** @default false */
|
@@ -15,4 +15,8 @@ export interface Notification {
|
|
15
15
|
variant?: ColorVariant;
|
16
16
|
onDismiss?: () => void;
|
17
17
|
autoDismissAfter?: number;
|
18
|
+
locale?: {
|
19
|
+
dismissText?: string;
|
20
|
+
};
|
21
|
+
children?: ReactNode;
|
18
22
|
}
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import { FunctionComponent } from "react";
|
1
|
+
import type { FunctionComponent, ReactNode } from "react";
|
2
2
|
export declare type FlexGridDirection = "row" | "column";
|
3
3
|
export declare type FlexGridAlignment = "leading" | "trailing" | "center" | "fill" | "baseline";
|
4
4
|
export declare type FlexGridDistribution = "equalSpacing" | "leading" | "trailing" | "center" | "fill" | "fillEvenly";
|
@@ -11,6 +11,7 @@ export interface FlexGridProps {
|
|
11
11
|
alignment?: FlexGridAlignment;
|
12
12
|
distribution?: FlexGridDistribution;
|
13
13
|
spacing?: FlexGridSpacing;
|
14
|
+
children: ReactNode;
|
14
15
|
}
|
15
16
|
export declare const FlexGrid: FunctionComponent<FlexGridProps>;
|
16
17
|
export default FlexGrid;
|
package/esm/FlexGrid/FlexGrid.js
CHANGED
@@ -3,10 +3,11 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
|
|
3
3
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22;
|
4
4
|
|
5
5
|
// Heavily inspired by https://github.com/Shopify/polaris-react/blob/2b34f8609e9f08c1a767abea0a235bcc17706b63/src/components/Stack/Stack.tsx#L1
|
6
|
-
import React from "react";
|
7
6
|
import cx from "classnames";
|
7
|
+
import { Children, isValidElement } from "react";
|
8
8
|
import stl from "../styles/helpers/satellitePrefixer";
|
9
9
|
import isRenderedChild from "../utils/isRenderedChild";
|
10
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
10
11
|
var SPACING_CLASSNAMES = {
|
11
12
|
none: "",
|
12
13
|
sm: stl(_templateObject || (_templateObject = _taggedTemplateLiteral(["flex-grid-sm"]))),
|
@@ -48,12 +49,16 @@ export var FlexGrid = function FlexGrid(_ref) {
|
|
48
49
|
_ref$wrap = _ref.wrap,
|
49
50
|
wrap = _ref$wrap === void 0 ? false : _ref$wrap,
|
50
51
|
children = _ref.children;
|
51
|
-
return /*#__PURE__*/
|
52
|
-
className: cx(inline && stl(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["flex-grid-inline"]))), className)
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
52
|
+
return /*#__PURE__*/_jsx("div", {
|
53
|
+
className: cx(inline && stl(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["flex-grid-inline"]))), className),
|
54
|
+
children: /*#__PURE__*/_jsx("div", {
|
55
|
+
className: cx(stl(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["flex-grid-inner"]))), inline ? stl(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["inline-flex"]))) : stl(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["flex"]))), wrap && stl(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["flex-wrap"]))), SPACING_CLASSNAMES[spacing], DIRECTION_CLASSNAMES[direction], ALIGNMENT_CLASSNAMES[alignment], DISTRIBUTION_CLASSNAMES[distribution]),
|
56
|
+
children: Children.map(children, function (child) {
|
57
|
+
return /*#__PURE__*/isValidElement(child) ? child : isRenderedChild(child) ? /*#__PURE__*/_jsx("span", {
|
58
|
+
children: child
|
59
|
+
}) : child;
|
60
|
+
})
|
61
|
+
})
|
62
|
+
});
|
58
63
|
};
|
59
64
|
export default FlexGrid;
|
@@ -1,5 +1,8 @@
|
|
1
1
|
export = flexGridPlugin;
|
2
2
|
/**
|
3
|
-
*
|
4
|
-
|
5
|
-
declare const flexGridPlugin:
|
3
|
+
* Taking some heavy pointers from Polaris https://github.com/Shopify/polaris-react/blob/2b34f8609e9f08c1a767abea0a235bcc17706b63/src/components/Stack/Stack.scss#L1 🙇🏻♂️
|
4
|
+
**/
|
5
|
+
declare const flexGridPlugin: {
|
6
|
+
handler: import("tailwindcss/types/config").PluginCreator;
|
7
|
+
config?: import("tailwindcss").Config | undefined;
|
8
|
+
};
|