@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
@@ -1,5 +1,5 @@
|
|
1
|
-
export =
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
1
|
+
export = selectPlugin;
|
2
|
+
declare const selectPlugin: {
|
3
|
+
handler: import("tailwindcss/types/config").PluginCreator;
|
4
|
+
config?: import("tailwindcss").Config | undefined;
|
5
|
+
};
|
@@ -1,16 +1,14 @@
|
|
1
1
|
"use strict";
|
2
2
|
|
3
3
|
// @ts-check
|
4
|
+
var plugin = require("tailwindcss/plugin");
|
5
|
+
|
4
6
|
var disabledColor = require("../styles/disabledColor");
|
5
7
|
|
6
8
|
var _require = require("../styles/helpers/icons"),
|
7
9
|
selectIconBG = _require.selectIconBG;
|
8
|
-
/**
|
9
|
-
* @type {import('../tailwind-types').TailwindPlugin}
|
10
|
-
*/
|
11
|
-
|
12
10
|
|
13
|
-
var
|
11
|
+
var selectPlugin = plugin(function (_ref) {
|
14
12
|
var addComponents = _ref.addComponents,
|
15
13
|
theme = _ref.theme;
|
16
14
|
addComponents({
|
@@ -77,6 +75,5 @@ var buttonPlugin = function buttonPlugin(_ref) {
|
|
77
75
|
backgroundSize: "12px, auto"
|
78
76
|
}
|
79
77
|
});
|
80
|
-
};
|
81
|
-
|
82
|
-
module.exports = buttonPlugin;
|
78
|
+
});
|
79
|
+
module.exports = selectPlugin;
|
@@ -1,5 +1,5 @@
|
|
1
1
|
export = sidebarPlugin;
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
2
|
+
declare const sidebarPlugin: {
|
3
|
+
handler: import("tailwindcss/types/config").PluginCreator;
|
4
|
+
config?: import("tailwindcss").Config | undefined;
|
5
|
+
};
|
@@ -1,11 +1,9 @@
|
|
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 sidebarPlugin = function sidebarPlugin(_ref) {
|
6
|
+
var sidebarPlugin = plugin(function (_ref) {
|
9
7
|
var addComponents = _ref.addComponents,
|
10
8
|
theme = _ref.theme;
|
11
9
|
|
@@ -21,14 +19,14 @@ var sidebarPlugin = function sidebarPlugin(_ref) {
|
|
21
19
|
".sidebar": {
|
22
20
|
backgroundColor: theme("colors.grey.900"),
|
23
21
|
color: theme("colors.grey.200"),
|
24
|
-
width:
|
22
|
+
width: "256px"
|
25
23
|
},
|
26
24
|
".sidebar-light": {
|
27
25
|
backgroundColor: theme("colors.white"),
|
28
26
|
boxShadow: "\n 0 0 0 1px ".concat(theme("colors.shadow.5"), ",\n 0 1px 3px 0 ").concat(theme("colors.shadow.15"), "\n ")
|
29
27
|
},
|
30
28
|
".sidebar-collapsed": {
|
31
|
-
width:
|
29
|
+
width: "80px"
|
32
30
|
}
|
33
31
|
});
|
34
32
|
addComponents({
|
@@ -64,6 +62,5 @@ var sidebarPlugin = function sidebarPlugin(_ref) {
|
|
64
62
|
}
|
65
63
|
}
|
66
64
|
});
|
67
|
-
};
|
68
|
-
|
65
|
+
});
|
69
66
|
module.exports = sidebarPlugin;
|
@@ -1,9 +1,10 @@
|
|
1
|
-
import type { AnchorHTMLAttributes, DetailedHTMLProps, FunctionComponent } from "react";
|
1
|
+
import type { AnchorHTMLAttributes, DetailedHTMLProps, FunctionComponent, ReactNode } from "react";
|
2
2
|
import type { IconComponentType } from "../../types";
|
3
3
|
import matchLocation from "../../utils/matchLocation";
|
4
4
|
export interface SidebarLinkProps extends DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement> {
|
5
5
|
icon?: IconComponentType;
|
6
6
|
active?: typeof matchLocation | boolean;
|
7
|
+
children: ReactNode;
|
7
8
|
}
|
8
9
|
export declare const SidebarLink: FunctionComponent<SidebarLinkProps>;
|
9
10
|
export default SidebarLink;
|
@@ -78,7 +78,7 @@ var SidebarLink = function SidebarLink(_ref2) {
|
|
78
78
|
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("a", _objectSpread(_objectSpread(_objectSpread({}, anchorProps), satelliteLinkProps), {}, {
|
79
79
|
className: (0, _classnames["default"])((0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["sidebar-link display-body\n ", "\n ", "\n "])), variant === "light" && "sidebar-link-light", showActive && "sidebar-link-active"), className),
|
80
80
|
children: [Icon && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
81
|
-
className: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n
|
81
|
+
className: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n shrink-0\n ml-1 mr-2 h-6 w-6\n flex items-center justify-center\n text-inherit rounded\n ", "\n "])), showActive && activeIconBackground),
|
82
82
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
|
83
83
|
size: "1rem"
|
84
84
|
})
|
@@ -1,5 +1,5 @@
|
|
1
|
-
export =
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
1
|
+
export = switchPlugin;
|
2
|
+
declare const switchPlugin: {
|
3
|
+
handler: import("tailwindcss/types/config").PluginCreator;
|
4
|
+
config?: import("tailwindcss").Config | undefined;
|
5
|
+
};
|
@@ -1,15 +1,15 @@
|
|
1
1
|
"use strict";
|
2
2
|
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
var
|
3
|
+
// @ts-check
|
4
|
+
var plugin = require("tailwindcss/plugin");
|
5
|
+
|
6
|
+
var switchPlugin = plugin(function (_ref) {
|
7
7
|
var addComponents = _ref.addComponents,
|
8
8
|
theme = _ref.theme;
|
9
9
|
addComponents({
|
10
10
|
".switch": {
|
11
11
|
// this + position relative helps create a new stack context (helps with z-index)
|
12
|
-
zIndex: 1,
|
12
|
+
zIndex: "1",
|
13
13
|
boxShadow: "0 0 0 2px ".concat(theme("colors.grey.100")),
|
14
14
|
"&:focus-within:focus-visible": {
|
15
15
|
boxShadow: "\n 0 0 0 1px ".concat(theme("colors.grey.100"), ",\n 0 0 0 2px ").concat(theme("colors.accent.600"), "\n ")
|
@@ -22,6 +22,5 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
22
22
|
}
|
23
23
|
}
|
24
24
|
});
|
25
|
-
};
|
26
|
-
|
27
|
-
module.exports = tablePlugin;
|
25
|
+
});
|
26
|
+
module.exports = switchPlugin;
|
@@ -1,7 +1,8 @@
|
|
1
|
-
import type { FunctionComponent } from "react";
|
1
|
+
import type { FunctionComponent, ReactNode } from "react";
|
2
2
|
export interface SwitchOptionProps {
|
3
3
|
value: string;
|
4
4
|
disabled?: boolean;
|
5
|
+
children: ReactNode;
|
5
6
|
}
|
6
7
|
export declare const SwitchOption: FunctionComponent<SwitchOptionProps>;
|
7
8
|
export default SwitchOption;
|
@@ -35,7 +35,7 @@ var SwitchOption = function SwitchOption(_ref) {
|
|
35
35
|
var checked = context.value === value;
|
36
36
|
var inputDisabled = context.disabled || disabled;
|
37
37
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", _objectSpread(_objectSpread({
|
38
|
-
className: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n inline-flex justify-center items-center min-w-16 max-w-48 px-4 z-10
|
38
|
+
className: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n inline-flex grow shrink justify-center items-center min-w-16 max-w-48 px-4 z-10\n ", "\n ", "\n "])), inputDisabled ? "cursor-not-allowed opacity-60 rounded bg-grey-100" : "cursor-pointer", !checked && !inputDisabled && "rounded hover:bg-accent-200/20 transition-colors duration-100 ease-linear")
|
39
39
|
}, (0, _utils.buildAnimationProps)(context.name, value)), {}, {
|
40
40
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
|
41
41
|
className: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["w-0 h-0 opacity-0"]))),
|
@@ -56,5 +56,5 @@ export declare type DataTableProps<Item> = BaseDataTableProps<Item> & (DataTable
|
|
56
56
|
* - If a cell is empty or unavailable, keep the cell empty to reduce noise and help with legibility.
|
57
57
|
* - Truncate long text to make it fit into a cell. However, choose column width wisely based on expected values, and adjust the table accordingly
|
58
58
|
*/
|
59
|
-
export declare const DataTable: <Item extends {}>({ data, itemId, columns, onChange, status, noDataContent, errorContent, sorting, pagination, selectMode, selection, onSelectionChange, canSelectItem, canHoverRow, onRowHoveredChanged, locale, }: DataTableProps<Item>) => JSX.Element;
|
59
|
+
export declare const DataTable: <Item extends {}>({ data, itemId, columns, onChange, status, noDataContent, errorContent, sorting, pagination, selectMode, selection, onSelectionChange, canSelectItem, canHoverRow, onRowHoveredChanged, locale: propsLocale, }: DataTableProps<Item>) => JSX.Element;
|
60
60
|
export default DataTable;
|
@@ -7,14 +7,14 @@ Object.defineProperty(exports, "__esModule", {
|
|
7
7
|
});
|
8
8
|
exports["default"] = exports.DataTable = void 0;
|
9
9
|
|
10
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
11
|
-
|
12
10
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
13
11
|
|
14
12
|
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
15
13
|
|
16
14
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
17
15
|
|
16
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
17
|
+
|
18
18
|
var _compact = _interopRequireDefault(require("lodash/compact"));
|
19
19
|
|
20
20
|
var _get = _interopRequireDefault(require("lodash/get"));
|
@@ -25,6 +25,8 @@ var _Checkbox = _interopRequireDefault(require("../../Checkbox"));
|
|
25
25
|
|
26
26
|
var _RadioGroup = require("../../RadioGroup");
|
27
27
|
|
28
|
+
var _Satellite = require("../../Satellite");
|
29
|
+
|
28
30
|
var _satellitePrefixer = _interopRequireDefault(require("../../styles/helpers/satellitePrefixer"));
|
29
31
|
|
30
32
|
var _utils = require("../../utils");
|
@@ -47,6 +49,16 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
|
|
47
49
|
|
48
50
|
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; }
|
49
51
|
|
52
|
+
var DEFAULT_DATATABLE_LOCALE = {
|
53
|
+
selectAllButton: "Select all",
|
54
|
+
noDataTitle: "Empty",
|
55
|
+
noDataDescription: "There is no data to display",
|
56
|
+
loadingTitle: "It appears to be taking a while to get your data",
|
57
|
+
loadingDescription: "Please hold or try again later",
|
58
|
+
errorTitle: "Error",
|
59
|
+
errorDescription: "An error occurred while loading data."
|
60
|
+
};
|
61
|
+
|
50
62
|
var DEFAULT_GET_ITEM_ID = function DEFAULT_GET_ITEM_ID(_, idx) {
|
51
63
|
return String(idx);
|
52
64
|
};
|
@@ -91,7 +103,10 @@ var DataTable = function DataTable(_ref) {
|
|
91
103
|
canSelectItem = _ref.canSelectItem,
|
92
104
|
canHoverRow = _ref.canHoverRow,
|
93
105
|
onRowHoveredChanged = _ref.onRowHoveredChanged,
|
94
|
-
|
106
|
+
propsLocale = _ref.locale;
|
107
|
+
var contextLocale = (0, _Satellite.useLocale)("dataTable");
|
108
|
+
|
109
|
+
var locale = _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_DATATABLE_LOCALE), contextLocale), propsLocale);
|
95
110
|
|
96
111
|
if (process.env.NODE_ENV !== "production") {
|
97
112
|
var _selection$length;
|
@@ -153,7 +168,7 @@ var DataTable = function DataTable(_ref) {
|
|
153
168
|
var isChecked = selectionLength === dataLength;
|
154
169
|
var isIndeterminate = selectionLength > 0 && selectionLength !== dataLength;
|
155
170
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Checkbox["default"], {
|
156
|
-
"aria-label":
|
171
|
+
"aria-label": locale.selectAllButton // Small hack to position the checkbox in the center of the header
|
157
172
|
,
|
158
173
|
className: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["absolute mb-2.5"]))),
|
159
174
|
checked: isChecked,
|
@@ -240,9 +255,10 @@ var DataTable = function DataTable(_ref) {
|
|
240
255
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
241
256
|
className: (0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["relative"]))),
|
242
257
|
children: [status === "loading" && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
243
|
-
className: (0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["absolute bg-white z-10
|
258
|
+
className: (0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["absolute bg-white/50 z-10 w-full h-full flex items-center justify-center"]))),
|
244
259
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Loader["default"], {
|
245
|
-
className: (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["-mt-12"])))
|
260
|
+
className: (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["-mt-12"]))),
|
261
|
+
locale: locale
|
246
262
|
})
|
247
263
|
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Table["default"], {
|
248
264
|
className: (0, _satellitePrefixer["default"])(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["datatable ", " ", ""])), status === "loading" && "pointer-events-none select-none", status === "loading" && data.length === 0 && "h-48"),
|
@@ -266,7 +282,8 @@ var DataTable = function DataTable(_ref) {
|
|
266
282
|
selection: selection,
|
267
283
|
canHoverRow: canHoverRow,
|
268
284
|
onRowHoverChange: onRowHoverChange,
|
269
|
-
onSelectionChange: onSelectionChange
|
285
|
+
onSelectionChange: onSelectionChange,
|
286
|
+
locale: locale
|
270
287
|
})]
|
271
288
|
})]
|
272
289
|
});
|
@@ -1,5 +1,5 @@
|
|
1
1
|
export = datatablePlugin;
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
2
|
+
declare const datatablePlugin: {
|
3
|
+
handler: import("tailwindcss/types/config").PluginCreator;
|
4
|
+
config?: import("tailwindcss").Config | undefined;
|
5
|
+
};
|
@@ -1,11 +1,9 @@
|
|
1
1
|
"use strict";
|
2
2
|
|
3
3
|
// purgecss whitelist: th, td, tr
|
4
|
+
var plugin = require("tailwindcss/plugin");
|
4
5
|
|
5
|
-
|
6
|
-
* @type {import('../../tailwind-types').TailwindPlugin}
|
7
|
-
*/
|
8
|
-
var datatablePlugin = function datatablePlugin(_ref) {
|
6
|
+
var datatablePlugin = plugin(function (_ref) {
|
9
7
|
var addComponents = _ref.addComponents,
|
10
8
|
theme = _ref.theme;
|
11
9
|
addComponents({
|
@@ -18,6 +16,5 @@ var datatablePlugin = function datatablePlugin(_ref) {
|
|
18
16
|
}
|
19
17
|
}
|
20
18
|
});
|
21
|
-
};
|
22
|
-
|
19
|
+
});
|
23
20
|
module.exports = datatablePlugin;
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import type { ReactNode } from "react";
|
2
|
-
import type { DataTableProps } from "../DataTable";
|
2
|
+
import type { DataTableLocale, DataTableProps } from "../DataTable";
|
3
3
|
import type { AdvancedColumnDefinition, Row, SelectMode, Status } from "../types";
|
4
|
-
export interface BodyProps<Item> extends Pick<DataTableProps<Item>, "selection" | "onSelectionChange" | "canHoverRow"
|
4
|
+
export interface BodyProps<Item> extends Pick<DataTableProps<Item>, "selection" | "onSelectionChange" | "canHoverRow"> {
|
5
5
|
rows: Row<Item>[];
|
6
6
|
status?: Status;
|
7
7
|
noDataContent?: ReactNode;
|
@@ -9,6 +9,7 @@ export interface BodyProps<Item> extends Pick<DataTableProps<Item>, "selection"
|
|
9
9
|
columns: AdvancedColumnDefinition<Item>[];
|
10
10
|
onRowHoverChange(row: Row<Item> | null): void;
|
11
11
|
selectMode: SelectMode;
|
12
|
+
locale: Required<DataTableLocale>;
|
12
13
|
}
|
13
14
|
export declare const Body: <Item extends {}>({ rows, columns, status, noDataContent, errorContent, selectMode, selection, onSelectionChange, onRowHoverChange, canHoverRow, locale, }: BodyProps<Item>) => JSX.Element;
|
14
15
|
export default Body;
|
@@ -82,8 +82,8 @@ var Body = function Body(_ref) {
|
|
82
82
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
83
83
|
className: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["flex justify-center py-6"]))),
|
84
84
|
children: errorContent || /*#__PURE__*/(0, _jsxRuntime.jsx)(_EmptyState["default"], {
|
85
|
-
title:
|
86
|
-
description:
|
85
|
+
title: locale.errorTitle,
|
86
|
+
description: locale.errorDescription,
|
87
87
|
centered: true,
|
88
88
|
usageContext: "result"
|
89
89
|
})
|
@@ -101,8 +101,8 @@ var Body = function Body(_ref) {
|
|
101
101
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
102
102
|
className: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["flex justify-center py-6"]))),
|
103
103
|
children: noDataContent || /*#__PURE__*/(0, _jsxRuntime.jsx)(_EmptyState["default"], {
|
104
|
-
title:
|
105
|
-
description:
|
104
|
+
title: locale.noDataTitle,
|
105
|
+
description: locale.noDataDescription,
|
106
106
|
centered: true,
|
107
107
|
usageContext: "result"
|
108
108
|
})
|
@@ -2,7 +2,7 @@
|
|
2
2
|
import type { DataTableLocale } from "../DataTable";
|
3
3
|
export interface LoaderProps {
|
4
4
|
className?: string;
|
5
|
-
locale
|
5
|
+
locale: Required<DataTableLocale>;
|
6
6
|
}
|
7
7
|
export declare const Loader: ({ className, locale }: LoaderProps) => JSX.Element;
|
8
8
|
export default Loader;
|
@@ -50,8 +50,8 @@ var Loader = function Loader(_ref) {
|
|
50
50
|
className: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["flex justify-center"]))),
|
51
51
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ProgressSpinner["default"], {})
|
52
52
|
}),
|
53
|
-
title:
|
54
|
-
description:
|
53
|
+
title: locale.loadingTitle,
|
54
|
+
description: locale.loadingDescription,
|
55
55
|
centered: true
|
56
56
|
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ProgressSpinner["default"], {})
|
57
57
|
});
|
@@ -1,5 +1,5 @@
|
|
1
1
|
export = tablePlugin;
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
2
|
+
declare const tablePlugin: {
|
3
|
+
handler: import("tailwindcss/types/config").PluginCreator;
|
4
|
+
config?: import("tailwindcss").Config | undefined;
|
5
|
+
};
|
@@ -1,11 +1,9 @@
|
|
1
1
|
"use strict";
|
2
2
|
|
3
3
|
// purgecss whitelist: th, td, tr
|
4
|
+
var plugin = require("tailwindcss/plugin");
|
4
5
|
|
5
|
-
|
6
|
-
* @type {import('../../tailwind-types').TailwindPlugin}
|
7
|
-
*/
|
8
|
-
var tablePlugin = function tablePlugin(_ref) {
|
6
|
+
var tablePlugin = plugin(function (_ref) {
|
9
7
|
var addComponents = _ref.addComponents,
|
10
8
|
theme = _ref.theme;
|
11
9
|
addComponents({
|
@@ -38,6 +36,5 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
38
36
|
}
|
39
37
|
}
|
40
38
|
});
|
41
|
-
};
|
42
|
-
|
39
|
+
});
|
43
40
|
module.exports = tablePlugin;
|
@@ -1,5 +1,5 @@
|
|
1
1
|
export = tabsPlugin;
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
2
|
+
declare const tabsPlugin: {
|
3
|
+
handler: import("tailwindcss/types/config").PluginCreator;
|
4
|
+
config?: import("tailwindcss").Config | undefined;
|
5
|
+
};
|
@@ -1,11 +1,9 @@
|
|
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 tabsPlugin = function tabsPlugin(_ref) {
|
6
|
+
var tabsPlugin = plugin(function (_ref) {
|
9
7
|
var addComponents = _ref.addComponents,
|
10
8
|
theme = _ref.theme;
|
11
9
|
addComponents({
|
@@ -34,8 +32,8 @@ var tabsPlugin = function tabsPlugin(_ref) {
|
|
34
32
|
borderBottomColor: theme("colors.red.600")
|
35
33
|
},
|
36
34
|
".tab": {
|
37
|
-
flexShrink: 0,
|
38
|
-
borderBottomWidth:
|
35
|
+
flexShrink: "0",
|
36
|
+
borderBottomWidth: "3px",
|
39
37
|
borderBottomColor: "transparent",
|
40
38
|
color: theme("colors.grey.600"),
|
41
39
|
cursor: "pointer",
|
@@ -52,6 +50,5 @@ var tabsPlugin = function tabsPlugin(_ref) {
|
|
52
50
|
}
|
53
51
|
}
|
54
52
|
});
|
55
|
-
};
|
56
|
-
|
53
|
+
});
|
57
54
|
module.exports = tabsPlugin;
|
package/cjs/Tag/Tag.d.ts
CHANGED
@@ -1,6 +1,9 @@
|
|
1
1
|
import type { DetailedHTMLProps, HTMLAttributes, MouseEventHandler } from "react";
|
2
2
|
import type { ColorVariant } from "../types";
|
3
3
|
export declare type TagVariants = ColorVariant | "pink";
|
4
|
+
export declare type TagLocale = {
|
5
|
+
removeButton?: string | ((title: string) => string);
|
6
|
+
};
|
4
7
|
export interface TagProps extends DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement> {
|
5
8
|
/**
|
6
9
|
* The "pink" variant should only be used for **Algolia admin** related things.
|
@@ -8,9 +11,7 @@ export interface TagProps extends DetailedHTMLProps<HTMLAttributes<HTMLSpanEleme
|
|
8
11
|
* */
|
9
12
|
variant?: TagVariants;
|
10
13
|
onDelete?: MouseEventHandler<HTMLElement>;
|
11
|
-
locale?:
|
12
|
-
removeButton?: string;
|
13
|
-
};
|
14
|
+
locale?: TagLocale;
|
14
15
|
}
|
15
16
|
/**
|
16
17
|
* Use tags to visually label UI objects for quick recognition and navigation. (!) **Tags can be added or removed from an object by users**.
|
@@ -33,5 +34,5 @@ export interface TagProps extends DetailedHTMLProps<HTMLAttributes<HTMLSpanEleme
|
|
33
34
|
* - When writing tags, avoid line-wrapping
|
34
35
|
* - Define the max width of text within a tag. Once the text reaches the max, truncate with ellipses
|
35
36
|
*/
|
36
|
-
export declare const Tag: import("react").ForwardRefExoticComponent<Pick<TagProps, "
|
37
|
+
export declare const Tag: import("react").ForwardRefExoticComponent<Pick<TagProps, "key" | "id" | "color" | "translate" | "hidden" | "dir" | "slot" | "style" | "title" | "accessKey" | "draggable" | "lang" | "className" | "prefix" | "children" | "contentEditable" | "inputMode" | "tabIndex" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "variant" | "onDelete" | "locale"> & import("react").RefAttributes<HTMLSpanElement>>;
|
37
38
|
export default Tag;
|
package/cjs/Tag/Tag.js
CHANGED
@@ -19,6 +19,8 @@ var _react = require("react");
|
|
19
19
|
|
20
20
|
var _reactFeather = require("react-feather");
|
21
21
|
|
22
|
+
var _Satellite = require("../Satellite");
|
23
|
+
|
22
24
|
var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
|
23
25
|
|
24
26
|
var _jsxRuntime = require("react/jsx-runtime");
|
@@ -31,6 +33,11 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
|
|
31
33
|
|
32
34
|
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; }
|
33
35
|
|
36
|
+
var DEFAULT_TAG_LOCALE = {
|
37
|
+
removeButton: function removeButton(title) {
|
38
|
+
return "Remove ".concat(title);
|
39
|
+
}
|
40
|
+
};
|
34
41
|
var VARIANT_CLASSNAMES = {
|
35
42
|
accent: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["bg-accent-100 border-accent-200 text-accent-700"]))),
|
36
43
|
grey: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["bg-grey-100 border-grey-200 text-grey-700"]))),
|
@@ -77,18 +84,19 @@ var Tag = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
77
84
|
variant = _ref$variant === void 0 ? "grey" : _ref$variant,
|
78
85
|
className = _ref.className,
|
79
86
|
onDelete = _ref.onDelete,
|
80
|
-
|
87
|
+
propsLocale = _ref.locale,
|
81
88
|
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
82
89
|
var title = typeof children === "string" ? children : "tag";
|
90
|
+
var contextLocale = (0, _Satellite.useLocale)("tag");
|
91
|
+
|
92
|
+
var locale = _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_TAG_LOCALE), contextLocale), propsLocale);
|
93
|
+
|
83
94
|
var tagClassName = (0, _classnames["default"])((0, _satellitePrefixer["default"])(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2["default"])(["tag"]))), VARIANT_CLASSNAMES[variant], className);
|
84
95
|
var editable = Boolean(onDelete);
|
85
96
|
|
86
97
|
var handleDelete = function handleDelete(evt) {
|
87
98
|
evt.stopPropagation();
|
88
|
-
|
89
|
-
if (onDelete) {
|
90
|
-
onDelete(evt);
|
91
|
-
}
|
99
|
+
onDelete === null || onDelete === void 0 ? void 0 : onDelete(evt);
|
92
100
|
};
|
93
101
|
|
94
102
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", _objectSpread(_objectSpread({}, props), {}, {
|
@@ -102,7 +110,7 @@ var Tag = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
102
110
|
className: (0, _classnames["default"])((0, _satellitePrefixer["default"])(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2["default"])(["tag-close-button"]))), BUTTON_CLOSE_VARIANT_CLASSNAMES[variant]),
|
103
111
|
type: "button",
|
104
112
|
onClick: handleDelete,
|
105
|
-
"aria-label":
|
113
|
+
"aria-label": typeof locale.removeButton === "function" ? locale.removeButton(title) : locale.removeButton,
|
106
114
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFeather.X, {
|
107
115
|
size: "1em"
|
108
116
|
})
|
@@ -1,5 +1,5 @@
|
|
1
1
|
export = tagPlugin;
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
2
|
+
declare const tagPlugin: {
|
3
|
+
handler: import("tailwindcss/types/config").PluginCreator;
|
4
|
+
config?: import("tailwindcss").Config | undefined;
|
5
|
+
};
|
package/cjs/Tag/Tag.tailwind.js
CHANGED
@@ -1,11 +1,9 @@
|
|
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 tagPlugin = function tagPlugin(_ref) {
|
6
|
+
var tagPlugin = plugin(function (_ref) {
|
9
7
|
var addComponents = _ref.addComponents,
|
10
8
|
theme = _ref.theme;
|
11
9
|
addComponents({
|
@@ -28,15 +26,14 @@ var tagPlugin = function tagPlugin(_ref) {
|
|
28
26
|
marginRight: "-".concat(theme("spacing.2")),
|
29
27
|
borderLeft: "1px solid transparent",
|
30
28
|
"&, &:focus": {
|
31
|
-
outlineWidth:
|
29
|
+
outlineWidth: "0px"
|
32
30
|
},
|
33
31
|
"&:focus-visible": {
|
34
|
-
outlineOffset: -
|
35
|
-
outlineWidth:
|
32
|
+
outlineOffset: "-2px",
|
33
|
+
outlineWidth: "3px",
|
36
34
|
outlineColor: theme("colors.accent.600")
|
37
35
|
}
|
38
36
|
}
|
39
37
|
});
|
40
|
-
};
|
41
|
-
|
38
|
+
});
|
42
39
|
module.exports = tagPlugin;
|
@@ -1,5 +1,5 @@
|
|
1
1
|
export = textAreaPlugin;
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
2
|
+
declare const textAreaPlugin: {
|
3
|
+
handler: import("tailwindcss/types/config").PluginCreator;
|
4
|
+
config?: import("tailwindcss").Config | undefined;
|
5
|
+
};
|