@algolia/satellite 1.0.0-beta.133 → 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 +6 -2
- package/cjs/AnnouncementBadge/AnnouncementBadge.js +14 -2
- package/cjs/AutoComplete/AutoComplete.d.ts +5 -10
- package/cjs/AutoComplete/AutoComplete.js +21 -45
- package/cjs/AutoComplete/AutoComplete.tailwind.d.ts +4 -4
- package/cjs/AutoComplete/AutoComplete.tailwind.js +10 -13
- package/cjs/AutoComplete/utils.d.ts +2 -1
- package/cjs/AutoComplete/utils.js +22 -2
- package/cjs/Avatars/ApplicationAvatar.js +1 -1
- package/cjs/Banner/Banner.d.ts +1 -0
- package/cjs/Banner/Banner.js +1 -1
- package/cjs/Banners/Alert/Alert.d.ts +1 -0
- package/cjs/Banners/Alert/Alert.js +1 -1
- package/cjs/Banners/BigBertha/BigBertha.d.ts +2 -1
- package/cjs/Banners/Promote/Promote.d.ts +1 -0
- package/cjs/Button/Button.js +2 -2
- 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/Card/Card.tailwind.d.ts +4 -4
- package/cjs/Card/Card.tailwind.js +5 -8
- package/cjs/Card/components/CardTitle.d.ts +4 -2
- package/cjs/Checkbox/Checkbox.d.ts +1 -1
- package/cjs/Checkbox/Checkbox.tailwind.d.ts +5 -5
- package/cjs/Checkbox/Checkbox.tailwind.js +11 -14
- package/cjs/ClickAwayContainer/ClickAwayContainer.d.ts +2 -1
- package/cjs/DatePicker/DatePicker/DatePicker.js +13 -7
- package/cjs/DatePicker/DatePicker.tailwind.d.ts +4 -4
- package/cjs/DatePicker/DatePicker.tailwind.js +19 -14
- package/cjs/DatePicker/DateRangePicker/DateRangePicker.js +14 -3
- package/cjs/DatePicker/DateRangePicker/DateRangePickerDisplay.d.ts +2 -1
- package/cjs/DatePicker/DateRangePicker/DateRangePickerDisplay.js +1 -1
- package/cjs/DatePicker/components/Calendar.d.ts +2 -1
- package/cjs/DatePicker/components/FooterActions.d.ts +2 -1
- package/cjs/DatePicker/components/FooterActions.js +2 -2
- package/cjs/DatePicker/components/NavBar.d.ts +2 -1
- package/cjs/DatePicker/components/NavBar.js +2 -2
- package/cjs/DatePicker/utils.d.ts +2 -0
- package/cjs/DatePicker/utils.js +10 -2
- package/cjs/Dropdown/Dropdown.d.ts +1 -1
- package/cjs/Dropdown/DropdownButton.d.ts +1 -0
- package/cjs/Dropdown/components/DropdownLinkItem.js +1 -1
- package/cjs/Dropdown/components/DropdownTitle.d.ts +4 -2
- package/cjs/Dropdown/components/DropdownToggleItem.js +2 -2
- package/cjs/Dropzone/Dropzone.d.ts +5 -1
- package/cjs/Dropzone/Dropzone.js +14 -5
- package/cjs/EmptyState/EmptyState.tailwind.d.ts +4 -4
- package/cjs/EmptyState/EmptyState.tailwind.js +5 -8
- package/cjs/Field/Field.d.ts +1 -0
- package/cjs/Flag/Flag.d.ts +1 -0
- package/cjs/Flag/Flag.js +17 -2
- package/cjs/Flag/Flag.tailwind.d.ts +4 -4
- package/cjs/Flag/Flag.tailwind.js +8 -15
- package/cjs/Flag/types.d.ts +4 -0
- package/cjs/FlexGrid/FlexGrid.d.ts +2 -1
- package/cjs/FlexGrid/FlexGrid.tailwind.d.ts +6 -3
- package/cjs/FlexGrid/FlexGrid.tailwind.js +8 -11
- package/cjs/HelpUnderline/HelpUnderline.tailwind.d.ts +4 -4
- package/cjs/HelpUnderline/HelpUnderline.tailwind.js +3 -6
- package/cjs/Input/Input.d.ts +6 -0
- package/cjs/Input/Input.js +15 -4
- package/cjs/Input/Input.tailwind.d.ts +4 -4
- package/cjs/Input/Input.tailwind.js +12 -15
- package/cjs/Insert/Insert.d.ts +1 -0
- package/cjs/InstantSearch/InstantSearch.tailwind.d.ts +4 -5
- package/cjs/InstantSearch/InstantSearch.tailwind.js +34 -32
- package/cjs/KeyboardKey/KeyboardKey.js +3 -2
- package/cjs/KeyboardKey/KeyboardKey.tailwind.d.ts +4 -4
- package/cjs/KeyboardKey/KeyboardKey.tailwind.js +5 -8
- package/cjs/Medallion/Medallion.tailwind.d.ts +4 -4
- package/cjs/Medallion/Medallion.tailwind.js +8 -11
- package/cjs/Modal/Modal.d.ts +5 -4
- package/cjs/Modal/Modal.js +13 -4
- 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/Pagination/CompactPagination/CompactPagination.d.ts +3 -7
- package/cjs/Pagination/CompactPagination/CompactPagination.js +30 -6
- package/cjs/Pagination/DotPagination/DotPagination.d.ts +5 -4
- package/cjs/Pagination/DotPagination/DotPagination.js +20 -4
- package/cjs/Pagination/Pagination/Pagination.d.ts +1 -1
- package/cjs/Pagination/Pagination/Pagination.js +27 -10
- package/cjs/ProgressBar/ProgressBar.tailwind.d.ts +5 -5
- package/cjs/ProgressBar/ProgressBar.tailwind.js +7 -10
- package/cjs/ProgressSpinner/ProgressSpinner.tailwind.d.ts +5 -5
- package/cjs/ProgressSpinner/ProgressSpinner.tailwind.js +4 -7
- package/cjs/RadioGroup/RadioButton.d.ts +1 -1
- package/cjs/RadioGroup/RadioButton.tailwind.d.ts +4 -4
- package/cjs/RadioGroup/RadioButton.tailwind.js +11 -14
- package/cjs/RadioGroup/RadioGroup.d.ts +1 -0
- package/cjs/RadioGroup/RadioGroup.js +1 -1
- package/cjs/RangeSlider/RangeSlider.d.ts +1 -1
- package/cjs/RangeSlider/RangeSlider.tailwind.d.ts +4 -4
- package/cjs/RangeSlider/RangeSlider.tailwind.js +21 -24
- package/cjs/Satellite/Satellite.d.ts +4 -1
- package/cjs/Satellite/Satellite.js +7 -2
- package/cjs/Satellite/SatelliteContext.d.ts +3 -1
- package/cjs/Satellite/SatelliteContext.js +2 -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 +2 -1
- package/cjs/ScrollIndicator/ScrollIndicator.tailwind.d.ts +4 -4
- package/cjs/ScrollIndicator/ScrollIndicator.tailwind.js +8 -11
- package/cjs/Select/Select.tailwind.d.ts +5 -5
- package/cjs/Select/Select.tailwind.js +5 -8
- package/cjs/Sidebar/Sidebar.tailwind.d.ts +4 -4
- package/cjs/Sidebar/Sidebar.tailwind.js +5 -8
- package/cjs/Sidebar/components/SidebarLink.d.ts +2 -1
- package/cjs/Sidebar/components/SidebarLink.js +1 -1
- 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 +1 -1
- package/cjs/Tables/DataTable/DataTable.d.ts +1 -1
- package/cjs/Tables/DataTable/DataTable.js +24 -7
- 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 +3 -2
- package/cjs/Tables/DataTable/components/Body.js +4 -4
- package/cjs/Tables/DataTable/components/Loader.d.ts +1 -1
- package/cjs/Tables/DataTable/components/Loader.js +2 -2
- package/cjs/Tables/Table/Table.tailwind.d.ts +4 -4
- package/cjs/Tables/Table/Table.tailwind.js +3 -6
- package/cjs/Tabs/Tabs.tailwind.d.ts +4 -4
- package/cjs/Tabs/Tabs.tailwind.js +5 -8
- package/cjs/Tag/Tag.d.ts +5 -4
- package/cjs/Tag/Tag.js +14 -6
- package/cjs/Tag/Tag.tailwind.d.ts +4 -4
- package/cjs/Tag/Tag.tailwind.js +6 -9
- package/cjs/TextArea/TextArea.tailwind.d.ts +4 -4
- package/cjs/TextArea/TextArea.tailwind.js +4 -7
- package/cjs/Toggle/Toggle.d.ts +1 -1
- package/cjs/Toggle/Toggle.tailwind.d.ts +5 -5
- package/cjs/Toggle/Toggle.tailwind.js +19 -22
- package/cjs/Tooltip/Tooltip.d.ts +1 -1
- package/cjs/Tooltip/Tooltip.tailwind.d.ts +4 -4
- package/cjs/Tooltip/Tooltip.tailwind.js +19 -18
- package/cjs/Tooltip/TooltipWrapper.d.ts +1 -0
- package/cjs/Tooltip/types.d.ts +2 -0
- package/cjs/Typography/Typography.tailwind.d.ts +5 -17
- package/cjs/Typography/Typography.tailwind.js +123 -133
- package/cjs/UserContent/UserContent.tailwind.d.ts +4 -1
- package/cjs/UserContent/UserContent.tailwind.js +11 -9
- 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 +25 -29
- package/cjs/types.d.ts +7 -0
- package/cjs/utilities/utilities.tailwind.d.ts +4 -1
- package/cjs/utilities/utilities.tailwind.js +4 -6
- package/cjs/utils/isCssPropertySupported.d.ts +1 -1
- package/esm/AnnouncementBadge/AnnouncementBadge.d.ts +6 -2
- package/esm/AnnouncementBadge/AnnouncementBadge.js +13 -2
- package/esm/AutoComplete/AutoComplete.d.ts +5 -10
- package/esm/AutoComplete/AutoComplete.js +22 -45
- package/esm/AutoComplete/AutoComplete.tailwind.d.ts +4 -4
- package/esm/AutoComplete/AutoComplete.tailwind.js +10 -13
- package/esm/AutoComplete/utils.d.ts +2 -1
- package/esm/AutoComplete/utils.js +16 -0
- package/esm/Avatars/ApplicationAvatar.js +1 -1
- package/esm/Banner/Banner.d.ts +1 -0
- package/esm/Banner/Banner.js +1 -1
- package/esm/Banners/Alert/Alert.d.ts +1 -0
- package/esm/Banners/Alert/Alert.js +1 -1
- package/esm/Banners/BigBertha/BigBertha.d.ts +2 -1
- package/esm/Banners/Promote/Promote.d.ts +1 -0
- package/esm/Button/Button.js +2 -2
- 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/Card/Card.tailwind.d.ts +4 -4
- package/esm/Card/Card.tailwind.js +6 -9
- package/esm/Card/components/CardTitle.d.ts +4 -2
- package/esm/Checkbox/Checkbox.d.ts +1 -1
- package/esm/Checkbox/Checkbox.tailwind.d.ts +5 -5
- package/esm/Checkbox/Checkbox.tailwind.js +11 -14
- package/esm/ClickAwayContainer/ClickAwayContainer.d.ts +2 -1
- package/esm/DatePicker/DatePicker/DatePicker.js +12 -7
- package/esm/DatePicker/DatePicker.tailwind.d.ts +4 -4
- package/esm/DatePicker/DatePicker.tailwind.js +19 -15
- package/esm/DatePicker/DateRangePicker/DateRangePicker.js +12 -2
- package/esm/DatePicker/DateRangePicker/DateRangePickerDisplay.d.ts +2 -1
- package/esm/DatePicker/DateRangePicker/DateRangePickerDisplay.js +1 -1
- package/esm/DatePicker/components/Calendar.d.ts +2 -1
- package/esm/DatePicker/components/FooterActions.d.ts +2 -1
- package/esm/DatePicker/components/FooterActions.js +2 -2
- package/esm/DatePicker/components/NavBar.d.ts +2 -1
- package/esm/DatePicker/components/NavBar.js +2 -2
- package/esm/DatePicker/utils.d.ts +2 -0
- package/esm/DatePicker/utils.js +7 -0
- package/esm/Dropdown/Dropdown.d.ts +1 -1
- package/esm/Dropdown/DropdownButton.d.ts +1 -0
- package/esm/Dropdown/components/DropdownLinkItem.js +1 -1
- package/esm/Dropdown/components/DropdownTitle.d.ts +4 -2
- package/esm/Dropdown/components/DropdownToggleItem.js +2 -2
- package/esm/Dropzone/Dropzone.d.ts +5 -1
- package/esm/Dropzone/Dropzone.js +13 -4
- package/esm/EmptyState/EmptyState.tailwind.d.ts +4 -4
- package/esm/EmptyState/EmptyState.tailwind.js +6 -9
- package/esm/Field/Field.d.ts +1 -0
- package/esm/Flag/Flag.d.ts +1 -0
- package/esm/Flag/Flag.js +15 -2
- package/esm/Flag/Flag.tailwind.d.ts +4 -4
- package/esm/Flag/Flag.tailwind.js +9 -16
- package/esm/Flag/types.d.ts +4 -0
- package/esm/FlexGrid/FlexGrid.d.ts +2 -1
- package/esm/FlexGrid/FlexGrid.tailwind.d.ts +6 -3
- package/esm/FlexGrid/FlexGrid.tailwind.js +8 -11
- package/esm/HelpUnderline/HelpUnderline.tailwind.d.ts +4 -4
- package/esm/HelpUnderline/HelpUnderline.tailwind.js +4 -7
- package/esm/Input/Input.d.ts +6 -0
- package/esm/Input/Input.js +15 -4
- package/esm/Input/Input.tailwind.d.ts +4 -4
- package/esm/Input/Input.tailwind.js +14 -17
- package/esm/Insert/Insert.d.ts +1 -0
- package/esm/InstantSearch/InstantSearch.tailwind.d.ts +4 -5
- package/esm/InstantSearch/InstantSearch.tailwind.js +35 -33
- package/esm/KeyboardKey/KeyboardKey.js +3 -2
- package/esm/KeyboardKey/KeyboardKey.tailwind.d.ts +4 -4
- package/esm/KeyboardKey/KeyboardKey.tailwind.js +6 -9
- package/esm/Medallion/Medallion.tailwind.d.ts +4 -4
- package/esm/Medallion/Medallion.tailwind.js +8 -11
- package/esm/Modal/Modal.d.ts +5 -4
- package/esm/Modal/Modal.js +11 -4
- 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/Pagination/CompactPagination/CompactPagination.d.ts +3 -7
- package/esm/Pagination/CompactPagination/CompactPagination.js +27 -6
- package/esm/Pagination/DotPagination/DotPagination.d.ts +5 -4
- package/esm/Pagination/DotPagination/DotPagination.js +17 -4
- package/esm/Pagination/Pagination/Pagination.d.ts +1 -1
- package/esm/Pagination/Pagination/Pagination.js +25 -10
- package/esm/ProgressBar/ProgressBar.tailwind.d.ts +5 -5
- package/esm/ProgressBar/ProgressBar.tailwind.js +7 -10
- package/esm/ProgressSpinner/ProgressSpinner.tailwind.d.ts +5 -5
- package/esm/ProgressSpinner/ProgressSpinner.tailwind.js +5 -8
- package/esm/RadioGroup/RadioButton.d.ts +1 -1
- package/esm/RadioGroup/RadioButton.tailwind.d.ts +4 -4
- package/esm/RadioGroup/RadioButton.tailwind.js +13 -16
- package/esm/RadioGroup/RadioGroup.d.ts +1 -0
- package/esm/RadioGroup/RadioGroup.js +1 -1
- package/esm/RangeSlider/RangeSlider.d.ts +1 -1
- package/esm/RangeSlider/RangeSlider.tailwind.d.ts +4 -4
- package/esm/RangeSlider/RangeSlider.tailwind.js +21 -24
- package/esm/Satellite/Satellite.d.ts +4 -1
- package/esm/Satellite/Satellite.js +6 -2
- package/esm/Satellite/SatelliteContext.d.ts +3 -1
- package/esm/Satellite/SatelliteContext.js +2 -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 +2 -1
- package/esm/ScrollIndicator/ScrollIndicator.tailwind.d.ts +4 -4
- package/esm/ScrollIndicator/ScrollIndicator.tailwind.js +8 -11
- package/esm/Select/Select.tailwind.d.ts +5 -5
- package/esm/Select/Select.tailwind.js +5 -8
- package/esm/Sidebar/Sidebar.tailwind.d.ts +4 -4
- package/esm/Sidebar/Sidebar.tailwind.js +6 -9
- package/esm/Sidebar/components/SidebarLink.d.ts +2 -1
- package/esm/Sidebar/components/SidebarLink.js +1 -1
- 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 +1 -1
- package/esm/Tables/DataTable/DataTable.d.ts +1 -1
- package/esm/Tables/DataTable/DataTable.js +21 -6
- 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 +3 -2
- package/esm/Tables/DataTable/components/Body.js +4 -4
- package/esm/Tables/DataTable/components/Loader.d.ts +1 -1
- package/esm/Tables/DataTable/components/Loader.js +2 -2
- package/esm/Tables/Table/Table.tailwind.d.ts +4 -4
- package/esm/Tables/Table/Table.tailwind.js +4 -7
- package/esm/Tabs/Tabs.tailwind.d.ts +4 -4
- package/esm/Tabs/Tabs.tailwind.js +6 -9
- package/esm/Tag/Tag.d.ts +5 -4
- package/esm/Tag/Tag.js +13 -6
- package/esm/Tag/Tag.tailwind.d.ts +4 -4
- package/esm/Tag/Tag.tailwind.js +7 -10
- package/esm/TextArea/TextArea.tailwind.d.ts +4 -4
- package/esm/TextArea/TextArea.tailwind.js +6 -9
- package/esm/Toggle/Toggle.d.ts +1 -1
- package/esm/Toggle/Toggle.tailwind.d.ts +5 -5
- package/esm/Toggle/Toggle.tailwind.js +19 -22
- package/esm/Tooltip/Tooltip.d.ts +1 -1
- package/esm/Tooltip/Tooltip.tailwind.d.ts +4 -4
- package/esm/Tooltip/Tooltip.tailwind.js +20 -19
- package/esm/Tooltip/TooltipWrapper.d.ts +1 -0
- package/esm/Tooltip/types.d.ts +2 -0
- package/esm/Typography/Typography.tailwind.d.ts +5 -17
- package/esm/Typography/Typography.tailwind.js +124 -134
- package/esm/UserContent/UserContent.tailwind.d.ts +4 -1
- package/esm/UserContent/UserContent.tailwind.js +12 -10
- 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 +27 -30
- package/esm/types.d.ts +7 -0
- package/esm/utilities/utilities.tailwind.d.ts +4 -1
- package/esm/utilities/utilities.tailwind.js +4 -6
- package/esm/utils/isCssPropertySupported.d.ts +1 -1
- package/package.json +8 -11
- package/satellite.min.css +2 -4
- package/scss/colors.scss +1 -0
- package/cjs/tailwind-types.d.ts +0 -52
- package/cjs/tailwind-types.js +0 -5
- package/esm/tailwind-types.d.ts +0 -52
- package/esm/tailwind-types.js +0 -1
- package/satellite.css +0 -196852
@@ -4,24 +4,25 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
4
4
|
|
5
5
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
6
6
|
|
7
|
-
|
7
|
+
// @ts-check
|
8
|
+
var plugin = require("tailwindcss/plugin");
|
9
|
+
|
10
|
+
var disabledColor = require("../styles/disabledColor");
|
8
11
|
|
9
12
|
var _require = require("../styles/helpers/icons"),
|
10
13
|
toBG = _require.toBG,
|
11
14
|
selectIconBG = _require.selectIconBG;
|
12
15
|
|
13
|
-
var
|
14
|
-
|
15
|
-
module.exports = function (_ref) {
|
16
|
-
var _aisSearchBoxForm;
|
16
|
+
var rgba = require("../styles/rgba");
|
17
17
|
|
18
|
+
module.exports = plugin(function (_ref) {
|
18
19
|
var addComponents = _ref.addComponents,
|
19
20
|
prefix = _ref.prefix,
|
20
21
|
theme = _ref.theme;
|
21
22
|
addComponents((0, _defineProperty2["default"])({}, prefix(".instantsearch"), {
|
22
23
|
// SearchBox widget
|
23
24
|
// ----------------------------------------
|
24
|
-
".ais-SearchBox-form":
|
25
|
+
".ais-SearchBox-form": {
|
25
26
|
position: "relative",
|
26
27
|
overflow: "hidden",
|
27
28
|
display: "flex",
|
@@ -31,24 +32,25 @@ module.exports = function (_ref) {
|
|
31
32
|
cursor: "text",
|
32
33
|
fontSize: theme("fontSize.base"),
|
33
34
|
lineHeight: theme("lineHeight.base"),
|
34
|
-
backgroundColor: theme("colors.white")
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
35
|
+
backgroundColor: theme("colors.white"),
|
36
|
+
"&:before": {
|
37
|
+
content: "''",
|
38
|
+
position: "absolute",
|
39
|
+
left: theme("spacing.4"),
|
40
|
+
top: "50%",
|
41
|
+
marginTop: "-".concat(theme("spacing.2")),
|
42
|
+
width: theme("spacing.4"),
|
43
|
+
height: theme("spacing.4"),
|
44
|
+
background: toBG("Search", {
|
45
|
+
color: theme("colors.grey.600"),
|
46
|
+
size: 16
|
47
|
+
})
|
48
|
+
}
|
49
|
+
},
|
48
50
|
".ais-SearchBox-input": {
|
49
51
|
appearance: "none",
|
50
|
-
flex: 1,
|
51
|
-
minWidth:
|
52
|
+
flex: "1",
|
53
|
+
minWidth: "0px",
|
52
54
|
paddingLeft: theme("spacing.10"),
|
53
55
|
backgroundColor: theme("colors.white"),
|
54
56
|
border: "1px solid ".concat(theme("colors.grey.200")),
|
@@ -116,22 +118,22 @@ module.exports = function (_ref) {
|
|
116
118
|
whiteSpace: "nowrap"
|
117
119
|
},
|
118
120
|
".ais-Menu-item--selected .ais-Menu-label, .ais-HierarchicalMenu-item--selected > .ais-HierarchicalMenu-link > .ais-HierarchicalMenu-label": {
|
119
|
-
fontWeight: 600
|
121
|
+
fontWeight: "600"
|
120
122
|
},
|
121
123
|
".ais-RefinementList-checkbox": {
|
122
|
-
opacity: 0,
|
124
|
+
opacity: "0",
|
123
125
|
position: "absolute"
|
124
126
|
},
|
125
127
|
".ais-RefinementList-labelText, .ais-HierarchicalMenu-label": {
|
126
128
|
position: "relative",
|
127
|
-
left: -
|
128
|
-
marginRight: -
|
129
|
+
left: "-1px",
|
130
|
+
marginRight: "-1px",
|
129
131
|
paddingLeft: theme("spacing.6"),
|
130
132
|
"&:before": {
|
131
133
|
content: "''",
|
132
134
|
overflow: "hidden",
|
133
135
|
position: "absolute",
|
134
|
-
left:
|
136
|
+
left: "1px",
|
135
137
|
top: "50%",
|
136
138
|
marginTop: "-".concat(theme("spacing.2")),
|
137
139
|
width: theme("spacing.4"),
|
@@ -153,7 +155,7 @@ module.exports = function (_ref) {
|
|
153
155
|
borderColor: "currentColor"
|
154
156
|
},
|
155
157
|
".ais-RefinementList-item--selected .ais-RefinementList-labelText:before": {
|
156
|
-
opacity: 1,
|
158
|
+
opacity: "1",
|
157
159
|
borderColor: "currentColor",
|
158
160
|
boxShadow: "inset 0px 1px 0px 0px ".concat(theme("colors.shadow.5")),
|
159
161
|
backgroundImage: toBG("Check", {
|
@@ -328,14 +330,14 @@ module.exports = function (_ref) {
|
|
328
330
|
backgroundImage: "linear-gradient(-180deg, ".concat(theme("colors.white"), " 0%, ").concat(theme("colors.grey.100"), " 100%)")
|
329
331
|
},
|
330
332
|
"&:focus": {
|
331
|
-
zIndex: 2,
|
333
|
+
zIndex: "2",
|
332
334
|
outline: "none",
|
333
335
|
backgroundImage: "linear-gradient(-180deg, ".concat(theme("colors.white"), " 0%, ").concat(theme("colors.grey.100"), " 100%)"),
|
334
336
|
borderColor: theme("colors.accent.600"),
|
335
337
|
boxShadow: "\n 0 0 0 1px ".concat(theme("colors.accent.600"), ",\n 0 2px 0 1px ").concat(theme("colors.shadow.5"), "\n ")
|
336
338
|
},
|
337
339
|
"&:active, &.ais-Pagination-link--selected": {
|
338
|
-
zIndex: 1,
|
340
|
+
zIndex: "1",
|
339
341
|
backgroundImage: theme("color.grey.100"),
|
340
342
|
borderColor: theme("colors.grey.200"),
|
341
343
|
boxShadow: "\n inset 0 1px 4px 0 ".concat(rgba(theme("colors.grey.500"), 0.4), ",\n inset 0 1px 1px 0 ").concat(rgba(theme("colors.grey.500"), 0.4), ",\n 0 1px 0 0 ").concat(theme("colors.shadow.5"), "\n ")
|
@@ -353,7 +355,7 @@ module.exports = function (_ref) {
|
|
353
355
|
},
|
354
356
|
".ais-Pagination-item + .ais-Pagination-item > .ais-Pagination-link": {
|
355
357
|
marginLeft: "-1px",
|
356
|
-
borderRadius:
|
358
|
+
borderRadius: "0px"
|
357
359
|
},
|
358
360
|
".ais-Pagination-item:last-child > .ais-Pagination-link": {
|
359
361
|
borderRadius: "0 ".concat(theme("borderRadius.DEFAULT"), " ").concat(theme("borderRadius.DEFAULT"), " 0")
|
@@ -377,4 +379,4 @@ module.exports = function (_ref) {
|
|
377
379
|
}), {
|
378
380
|
respectPrefix: false
|
379
381
|
});
|
380
|
-
};
|
382
|
+
});
|
@@ -33,14 +33,15 @@ var KEY_MAPPINGS = {
|
|
33
33
|
var KeyboardKey = function KeyboardKey(_ref) {
|
34
34
|
var className = _ref.className,
|
35
35
|
value = _ref.value;
|
36
|
-
var mappedValue =
|
36
|
+
var mappedValue = KEY_MAPPINGS[value];
|
37
|
+
var displayed = !mappedValue ? value : typeof mappedValue === "string" ? mappedValue : /*#__PURE__*/(0, _react.createElement)(mappedValue, {
|
37
38
|
"aria-label": value,
|
38
39
|
width: "1em",
|
39
40
|
height: "1em"
|
40
41
|
});
|
41
42
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)("kbd", {
|
42
43
|
className: (0, _classnames["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["keyboard-key "]))), className),
|
43
|
-
children:
|
44
|
+
children: displayed
|
44
45
|
});
|
45
46
|
};
|
46
47
|
|
@@ -1,5 +1,5 @@
|
|
1
1
|
export = keyboardKeyPlugin;
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
2
|
+
declare const keyboardKeyPlugin: {
|
3
|
+
handler: import("tailwindcss/types/config").PluginCreator;
|
4
|
+
config?: import("tailwindcss").Config | undefined;
|
5
|
+
};
|
@@ -1,18 +1,16 @@
|
|
1
1
|
"use strict";
|
2
2
|
|
3
3
|
// @ts-check
|
4
|
+
var plugin = require("tailwindcss/plugin");
|
4
5
|
|
5
|
-
|
6
|
-
* @type {import('../tailwind-types').TailwindPlugin}
|
7
|
-
*/
|
8
|
-
var keyboardKeyPlugin = function keyboardKeyPlugin(_ref) {
|
6
|
+
var keyboardKeyPlugin = plugin(function (_ref) {
|
9
7
|
var addComponents = _ref.addComponents,
|
10
8
|
theme = _ref.theme;
|
11
9
|
addComponents({
|
12
10
|
".keyboard-key": {
|
13
11
|
borderRadius: theme("borderRadius.DEFAULT"),
|
14
|
-
height:
|
15
|
-
minWidth:
|
12
|
+
height: "20px",
|
13
|
+
minWidth: "20px",
|
16
14
|
padding: "0 4px",
|
17
15
|
display: "inline-flex",
|
18
16
|
textAlign: "center",
|
@@ -28,6 +26,5 @@ var keyboardKeyPlugin = function keyboardKeyPlugin(_ref) {
|
|
28
26
|
boxShadow: "\n 2px 1px 4px -2px rgba(35, 38, 59, 0.24),\n inset -0.6px -0.6px 1px #dcdde7, inset 0.6px 0.6px 1px #ffffff\n "
|
29
27
|
}
|
30
28
|
});
|
31
|
-
};
|
32
|
-
|
29
|
+
});
|
33
30
|
module.exports = keyboardKeyPlugin;
|
@@ -1,5 +1,5 @@
|
|
1
1
|
export = medallionPlugin;
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
2
|
+
declare const medallionPlugin: {
|
3
|
+
handler: import("tailwindcss/types/config").PluginCreator;
|
4
|
+
config?: import("tailwindcss").Config | undefined;
|
5
|
+
};
|
@@ -5,24 +5,22 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
5
5
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
6
6
|
|
7
7
|
// @ts-check
|
8
|
-
var
|
9
|
-
/**
|
10
|
-
* @type {import('../tailwind-types').TailwindPlugin}
|
11
|
-
*/
|
8
|
+
var plugin = require("tailwindcss/plugin");
|
12
9
|
|
10
|
+
var rgba = require("../styles/rgba");
|
13
11
|
|
14
|
-
var medallionPlugin = function
|
12
|
+
var medallionPlugin = plugin(function (_ref) {
|
15
13
|
var addComponents = _ref.addComponents,
|
16
14
|
theme = _ref.theme;
|
17
15
|
var colors = ["grey", "pink", "accent", "blue", "green", "orange", "red", "white"];
|
18
16
|
addComponents({
|
19
17
|
".medallion": {
|
20
|
-
height:
|
21
|
-
width:
|
18
|
+
height: "40px",
|
19
|
+
width: "40px"
|
22
20
|
},
|
23
21
|
".medallion-large": {
|
24
|
-
height:
|
25
|
-
width:
|
22
|
+
height: "72px",
|
23
|
+
width: "72px"
|
26
24
|
}
|
27
25
|
}); // Variants
|
28
26
|
|
@@ -32,6 +30,5 @@ var medallionPlugin = function medallionPlugin(_ref) {
|
|
32
30
|
boxShadow: color === "white" ? "0px 4px 8px -2px rgba(33, 36, 61, 0.25), inset 0px -2px 2px rgba(35, 38, 59, 0.03)" : "0px 4px 8px -2px rgba(33, 36, 61, 0.25), inset 0px -2px 2px ".concat(rgba(theme("colors.".concat(color, ".300")), 0.03))
|
33
31
|
}));
|
34
32
|
});
|
35
|
-
};
|
36
|
-
|
33
|
+
});
|
37
34
|
module.exports = medallionPlugin;
|
package/cjs/Modal/Modal.d.ts
CHANGED
@@ -1,5 +1,8 @@
|
|
1
1
|
import type { ReactNode } from "react";
|
2
2
|
export declare type ModalSizeVariant = "medium" | "large";
|
3
|
+
export declare type ModalLocale = {
|
4
|
+
dismissText?: string;
|
5
|
+
};
|
3
6
|
export interface ModalProps {
|
4
7
|
open?: boolean;
|
5
8
|
title?: string | JSX.Element;
|
@@ -11,12 +14,10 @@ export interface ModalProps {
|
|
11
14
|
centerY?: boolean;
|
12
15
|
onDismiss?: () => void;
|
13
16
|
children: ReactNode;
|
14
|
-
locale?:
|
15
|
-
dismissText?: string;
|
16
|
-
};
|
17
|
+
locale?: ModalLocale;
|
17
18
|
}
|
18
19
|
export declare const Modal: {
|
19
|
-
({ title, className, children, open, fullBleed, onDismiss, animate, hideCloseIcon, size, centerY, locale, }: ModalProps): import("react").ReactPortal;
|
20
|
+
({ title, className, children, open, fullBleed, onDismiss, animate, hideCloseIcon, size, centerY, locale: propsLocale, }: ModalProps): import("react").ReactPortal;
|
20
21
|
Footer: import("react").FunctionComponent<import("./components/ModalFooter").ModalFooterProps>;
|
21
22
|
};
|
22
23
|
export default Modal;
|
package/cjs/Modal/Modal.js
CHANGED
@@ -31,6 +31,8 @@ var _Button = require("../Button");
|
|
31
31
|
|
32
32
|
var _Card = _interopRequireDefault(require("../Card"));
|
33
33
|
|
34
|
+
var _Satellite = require("../Satellite");
|
35
|
+
|
34
36
|
var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
|
35
37
|
|
36
38
|
var _uniqueId = _interopRequireDefault(require("../utils/uniqueId"));
|
@@ -45,6 +47,10 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
|
|
45
47
|
|
46
48
|
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) { (0, _defineProperty2["default"])(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; }
|
47
49
|
|
50
|
+
var DEFAULT_MODAL_LOCALE = {
|
51
|
+
dismissText: "Dismiss"
|
52
|
+
};
|
53
|
+
|
48
54
|
var ModalAnimation = function ModalAnimation(props) {
|
49
55
|
return (
|
50
56
|
/*#__PURE__*/
|
@@ -88,7 +94,10 @@ var Modal = function Modal(_ref) {
|
|
88
94
|
size = _ref$size === void 0 ? "medium" : _ref$size,
|
89
95
|
_ref$centerY = _ref.centerY,
|
90
96
|
centerY = _ref$centerY === void 0 ? false : _ref$centerY,
|
91
|
-
|
97
|
+
propsLocale = _ref.locale;
|
98
|
+
var contextLocale = (0, _Satellite.useLocale)("modal");
|
99
|
+
|
100
|
+
var locale = _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_MODAL_LOCALE), contextLocale), propsLocale);
|
92
101
|
|
93
102
|
var _useState = (0, _react.useState)(null),
|
94
103
|
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
@@ -145,7 +154,7 @@ var Modal = function Modal(_ref) {
|
|
145
154
|
"in": open,
|
146
155
|
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
147
156
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
148
|
-
className: (0, _classnames["default"])((0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["bg-grey-900
|
157
|
+
className: (0, _classnames["default"])((0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["bg-grey-900/30 z-modalOverlay inset-x-0 inset-y-0 fixed w-full h-full"]))))
|
149
158
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({
|
150
159
|
className: (0, _classnames["default"])((0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["modal-container inset-x-0 inset-y-0 fixed w-full h-full p-4 overflow-x-hidden overflow-y-auto"]))), centerY && (0, _satellitePrefixer["default"])(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["flex items-center"])))),
|
151
160
|
ref: setModalWrapperRef
|
@@ -163,10 +172,10 @@ var Modal = function Modal(_ref) {
|
|
163
172
|
children: title
|
164
173
|
}), !hideCloseIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
|
165
174
|
icon: _reactFeather.X,
|
166
|
-
title:
|
175
|
+
title: locale.dismissText,
|
167
176
|
variant: "subtle",
|
168
177
|
onClick: onDismiss,
|
169
|
-
className: (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["
|
178
|
+
className: (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["shrink-0 -mr-2"])))
|
170
179
|
})]
|
171
180
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
172
181
|
className: fullBleed ? undefined : (0, _satellitePrefixer["default"])(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["p-10"]))),
|
@@ -1,5 +1,5 @@
|
|
1
1
|
export = modalPlugin;
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
2
|
+
declare const modalPlugin: {
|
3
|
+
handler: import("tailwindcss/types/config").PluginCreator;
|
4
|
+
config?: import("tailwindcss").Config | undefined;
|
5
|
+
};
|
@@ -1,19 +1,11 @@
|
|
1
1
|
"use strict";
|
2
2
|
|
3
3
|
// @ts-check
|
4
|
-
var
|
5
|
-
/**
|
6
|
-
* @type {import('../tailwind-types').TailwindPlugin}
|
7
|
-
*/
|
4
|
+
var plugin = require("tailwindcss/plugin");
|
8
5
|
|
9
|
-
|
10
|
-
var modalPlugin = function modalPlugin(_ref) {
|
6
|
+
var modalPlugin = plugin(function (_ref) {
|
11
7
|
var addComponents = _ref.addComponents,
|
12
8
|
theme = _ref.theme;
|
13
|
-
|
14
|
-
/**
|
15
|
-
* @param {string} color
|
16
|
-
*/
|
17
9
|
var transitionEasing = "cubic-bezier(0.6, -0.28, 0.735, 0.045)";
|
18
10
|
var transitionDuration = 200;
|
19
11
|
addComponents({
|
@@ -22,33 +14,32 @@ var modalPlugin = function modalPlugin(_ref) {
|
|
22
14
|
},
|
23
15
|
// Sizes
|
24
16
|
".modal-dialog-medium": {
|
25
|
-
maxWidth:
|
17
|
+
maxWidth: "640px"
|
26
18
|
},
|
27
19
|
".modal-dialog-large": {
|
28
|
-
maxWidth:
|
20
|
+
maxWidth: "920px"
|
29
21
|
}
|
30
22
|
}); // Animation
|
31
23
|
|
32
24
|
addComponents({
|
33
25
|
".satellite-modal-appear .modal-container, .satellite-modal-enter .modal-container": {
|
34
|
-
opacity: 0.1,
|
26
|
+
opacity: "0.1",
|
35
27
|
transform: "translate(0, 8px) scale(0.94)"
|
36
28
|
},
|
37
29
|
".satellite-modal-appear-active .modal-container, .satellite-modal-enter-active .modal-container": {
|
38
|
-
opacity: 1,
|
30
|
+
opacity: "1",
|
39
31
|
transform: "translate(0, 0) scale(1)",
|
40
32
|
transition: "all ".concat(transitionDuration, "ms ").concat(transitionEasing)
|
41
33
|
},
|
42
34
|
".satellite-modal-exit .modal-container": {
|
43
|
-
opacity: 1,
|
35
|
+
opacity: "1",
|
44
36
|
transform: "translate(0, 0) scale(1)"
|
45
37
|
},
|
46
38
|
".satellite-modal-exit-active .modal-container": {
|
47
|
-
opacity: 0.1,
|
39
|
+
opacity: "0.1",
|
48
40
|
transform: "translate(0, 8px) scale(0.94)",
|
49
41
|
transition: "all ".concat(transitionDuration, "ms ").concat(transitionEasing)
|
50
42
|
}
|
51
43
|
});
|
52
|
-
};
|
53
|
-
|
44
|
+
});
|
54
45
|
module.exports = modalPlugin;
|
@@ -1,4 +1,6 @@
|
|
1
|
-
import type { FunctionComponent, HTMLAttributes } from "react";
|
2
|
-
export declare type ModalFooterProps = HTMLAttributes<HTMLElement
|
1
|
+
import type { FunctionComponent, HTMLAttributes, ReactNode } from "react";
|
2
|
+
export declare type ModalFooterProps = HTMLAttributes<HTMLElement> & {
|
3
|
+
children: ReactNode;
|
4
|
+
};
|
3
5
|
export declare const ModalFooter: FunctionComponent<ModalFooterProps>;
|
4
6
|
export default ModalFooter;
|
@@ -1,10 +1,11 @@
|
|
1
1
|
/// <reference types="react" />
|
2
2
|
export declare type CompactPaginationLabel = "complete" | "compact" | "none";
|
3
|
-
declare type
|
3
|
+
export declare type CompactPaginationLocale = {
|
4
4
|
goToFirstPage?: string;
|
5
5
|
goToLastPage?: string;
|
6
6
|
goToNextPage?: string;
|
7
7
|
goToPreviousPage?: string;
|
8
|
+
label?(page: number, nbPages?: number): string;
|
8
9
|
};
|
9
10
|
declare type BaseCompactPaginationProps = {
|
10
11
|
/** Currently selected page (1 based index) */
|
@@ -12,19 +13,14 @@ declare type BaseCompactPaginationProps = {
|
|
12
13
|
onChange: (page: number) => void;
|
13
14
|
showGoToFirstPage?: boolean;
|
14
15
|
label?: CompactPaginationLabel;
|
16
|
+
locale?: CompactPaginationLocale;
|
15
17
|
};
|
16
18
|
export declare type DeterminateCompactPaginationProps = BaseCompactPaginationProps & {
|
17
19
|
nbPages: number;
|
18
20
|
showGoToLastPage?: boolean;
|
19
|
-
locale?: BaseLocaleProps & {
|
20
|
-
label?(page: number, nbPages: number): string;
|
21
|
-
};
|
22
21
|
};
|
23
22
|
export declare type IndeterminateCompactPaginationProps = BaseCompactPaginationProps & {
|
24
23
|
nextDisabled?: boolean;
|
25
|
-
locale?: BaseLocaleProps & {
|
26
|
-
label?(page: number): string;
|
27
|
-
};
|
28
24
|
};
|
29
25
|
export declare type CompactPaginationProps = DeterminateCompactPaginationProps | IndeterminateCompactPaginationProps;
|
30
26
|
export declare const isDeterminateCompactPaginationProps: (props: CompactPaginationProps) => props is DeterminateCompactPaginationProps;
|
@@ -9,16 +9,34 @@ exports.isIndeterminateCompactPaginationProps = exports.isDeterminateCompactPagi
|
|
9
9
|
|
10
10
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
11
11
|
|
12
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
13
|
+
|
12
14
|
var _reactFeather = require("react-feather");
|
13
15
|
|
14
16
|
var _Button = require("../../Button");
|
15
17
|
|
18
|
+
var _Satellite = require("../../Satellite");
|
19
|
+
|
16
20
|
var _satellitePrefixer = _interopRequireDefault(require("../../styles/helpers/satellitePrefixer"));
|
17
21
|
|
18
22
|
var _jsxRuntime = require("react/jsx-runtime");
|
19
23
|
|
20
24
|
var _templateObject, _templateObject2;
|
21
25
|
|
26
|
+
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; }
|
27
|
+
|
28
|
+
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) { (0, _defineProperty2["default"])(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; }
|
29
|
+
|
30
|
+
var DEFAULT_COMPACT_PAGINATION_LOCALE = {
|
31
|
+
goToFirstPage: "Go to first page",
|
32
|
+
goToPreviousPage: "Go to previous page",
|
33
|
+
goToNextPage: "Go to next page",
|
34
|
+
goToLastPage: "Go to last page",
|
35
|
+
label: function label(page, nbPages) {
|
36
|
+
return typeof nbPages === "number" ? "Page ".concat(page, " of ").concat(nbPages) : "Page ".concat(page, " of many");
|
37
|
+
}
|
38
|
+
};
|
39
|
+
|
22
40
|
var isDeterminateCompactPaginationProps = function isDeterminateCompactPaginationProps(props) {
|
23
41
|
return "nbPages" in props;
|
24
42
|
};
|
@@ -32,24 +50,30 @@ var isIndeterminateCompactPaginationProps = function isIndeterminateCompactPagin
|
|
32
50
|
exports.isIndeterminateCompactPaginationProps = isIndeterminateCompactPaginationProps;
|
33
51
|
|
34
52
|
var CompactPagination = function CompactPagination(props) {
|
35
|
-
var _props$label
|
53
|
+
var _props$label;
|
54
|
+
|
55
|
+
var contextLocale = (0, _Satellite.useLocale)("compactPagination");
|
56
|
+
|
57
|
+
var locale = _objectSpread(_objectSpread({}, DEFAULT_COMPACT_PAGINATION_LOCALE), {}, {
|
58
|
+
contextLocale: contextLocale
|
59
|
+
}, props.locale);
|
36
60
|
|
37
61
|
var labelType = (_props$label = props.label) !== null && _props$label !== void 0 ? _props$label : isDeterminateCompactPaginationProps(props) ? "complete" : "compact";
|
38
|
-
var label = labelType === "none" ? null : labelType === "compact" ? "".concat(props.currentPage) : isDeterminateCompactPaginationProps(props) ?
|
62
|
+
var label = labelType === "none" ? null : labelType === "compact" ? "".concat(props.currentPage) : isDeterminateCompactPaginationProps(props) ? locale.label(props.currentPage, props.nbPages) : locale.label(props.currentPage);
|
39
63
|
var isFirstPage = props.currentPage === 1;
|
40
64
|
var isLastPage = isDeterminateCompactPaginationProps(props) ? props.currentPage === props.nbPages : !!props.nextDisabled;
|
41
65
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
42
66
|
className: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["flex items-center space-x-2"]))),
|
43
67
|
children: [props.showGoToFirstPage && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
|
44
68
|
icon: _reactFeather.ChevronsLeft,
|
45
|
-
title:
|
69
|
+
title: locale.goToFirstPage,
|
46
70
|
onClick: function onClick() {
|
47
71
|
return props.onChange(1);
|
48
72
|
},
|
49
73
|
disabled: isFirstPage
|
50
74
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
|
51
75
|
icon: _reactFeather.ArrowLeft,
|
52
|
-
title:
|
76
|
+
title: locale.goToPreviousPage,
|
53
77
|
onClick: function onClick() {
|
54
78
|
return props.onChange(props.currentPage - 1);
|
55
79
|
},
|
@@ -59,14 +83,14 @@ var CompactPagination = function CompactPagination(props) {
|
|
59
83
|
children: label
|
60
84
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
|
61
85
|
icon: _reactFeather.ArrowRight,
|
62
|
-
title:
|
86
|
+
title: locale.goToNextPage,
|
63
87
|
onClick: function onClick() {
|
64
88
|
return props.onChange(props.currentPage + 1);
|
65
89
|
},
|
66
90
|
disabled: isLastPage
|
67
91
|
}), isDeterminateCompactPaginationProps(props) && props.showGoToLastPage && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
|
68
92
|
icon: _reactFeather.ChevronsRight,
|
69
|
-
title:
|
93
|
+
title: locale.goToLastPage,
|
70
94
|
onClick: function onClick() {
|
71
95
|
return props.onChange(props.nbPages);
|
72
96
|
},
|
@@ -1,13 +1,14 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
+
export declare type DotPaginationLocale = {
|
3
|
+
goToPageText?(page: number): string;
|
4
|
+
};
|
2
5
|
export declare type DotPaginationProps = {
|
3
6
|
/** Currently selected page (1 based index) */
|
4
7
|
currentPage: number;
|
5
8
|
onChange: (page: number) => void;
|
6
9
|
nbPages: number;
|
7
10
|
size?: "small" | "medium";
|
8
|
-
locale?:
|
9
|
-
goToPageText?(page: number): string;
|
10
|
-
};
|
11
|
+
locale?: DotPaginationLocale;
|
11
12
|
};
|
12
|
-
export declare const DotPagination: ({ currentPage, onChange, nbPages, size, locale }: DotPaginationProps) => JSX.Element;
|
13
|
+
export declare const DotPagination: ({ currentPage, onChange, nbPages, size, locale: propsLocale, }: DotPaginationProps) => JSX.Element;
|
13
14
|
export default DotPagination;
|
@@ -9,28 +9,44 @@ exports["default"] = exports.DotPagination = void 0;
|
|
9
9
|
|
10
10
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
11
11
|
|
12
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
13
|
+
|
14
|
+
var _Satellite = require("../../Satellite");
|
15
|
+
|
12
16
|
var _satellitePrefixer = _interopRequireDefault(require("../../styles/helpers/satellitePrefixer"));
|
13
17
|
|
14
18
|
var _jsxRuntime = require("react/jsx-runtime");
|
15
19
|
|
16
20
|
var _templateObject, _templateObject2;
|
17
21
|
|
22
|
+
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; }
|
23
|
+
|
24
|
+
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) { (0, _defineProperty2["default"])(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; }
|
25
|
+
|
26
|
+
var DEFAULT_DOT_PAGINATION_LOCALE = {
|
27
|
+
goToPageText: function goToPageText(pageIdx) {
|
28
|
+
return "Go to page ".concat(pageIdx);
|
29
|
+
}
|
30
|
+
};
|
31
|
+
|
18
32
|
var DotPagination = function DotPagination(_ref) {
|
19
33
|
var currentPage = _ref.currentPage,
|
20
34
|
onChange = _ref.onChange,
|
21
35
|
nbPages = _ref.nbPages,
|
22
36
|
_ref$size = _ref.size,
|
23
37
|
size = _ref$size === void 0 ? "medium" : _ref$size,
|
24
|
-
|
38
|
+
propsLocale = _ref.locale;
|
39
|
+
var contextLocale = (0, _Satellite.useLocale)("dotPagination");
|
40
|
+
|
41
|
+
var locale = _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_DOT_PAGINATION_LOCALE), contextLocale), propsLocale);
|
42
|
+
|
25
43
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)("ul", {
|
26
44
|
className: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["flex"]))),
|
27
45
|
children: new Array(nbPages).fill(undefined).map(function (_, idx) {
|
28
|
-
var _locale$goToPageText;
|
29
|
-
|
30
46
|
var pageIdx = idx + 1;
|
31
47
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
|
32
48
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
|
33
|
-
"aria-label":
|
49
|
+
"aria-label": locale.goToPageText(pageIdx),
|
34
50
|
className: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n rounded-full mx-1\n ", "\n ", "\n "])), currentPage === pageIdx ? "bg-accent-600" : "bg-grey-200", size === "medium" ? "h-3 w-3" : "h-2 w-2"),
|
35
51
|
onClick: function onClick() {
|
36
52
|
return onChange(pageIdx);
|
@@ -18,5 +18,5 @@ export interface PaginationProps {
|
|
18
18
|
* - Don't use on list with less than 20 items
|
19
19
|
* - Place the pagination at the bottom of the split item
|
20
20
|
*/
|
21
|
-
export declare const Pagination: ({ currentPage, nbPages, onChange, maxButtons: maxButtonsParam, locale, }: PaginationProps) => JSX.Element;
|
21
|
+
export declare const Pagination: ({ currentPage, nbPages, onChange, maxButtons: maxButtonsParam, locale: propsLocale, }: PaginationProps) => JSX.Element;
|
22
22
|
export default Pagination;
|