@algolia/satellite 1.0.0-beta.118 → 1.0.0-beta.122

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (182) hide show
  1. package/README.md +2 -2
  2. package/cjs/AutoComplete/AutoComplete.d.ts +6 -2
  3. package/cjs/AutoComplete/AutoComplete.js +10 -5
  4. package/cjs/AutoComplete/types.d.ts +5 -0
  5. package/cjs/AutoComplete/utils.js +1 -1
  6. package/cjs/Avatars/ApplicationAvatar.d.ts +1 -1
  7. package/cjs/Avatars/utils.js +1 -1
  8. package/cjs/Button/styles.d.ts +1 -1
  9. package/cjs/Button/styles.js +1 -1
  10. package/cjs/Card/components/CardHeader.d.ts +2 -2
  11. package/cjs/Checkbox/Checkbox.d.ts +1 -1
  12. package/cjs/Checkbox/Checkbox.js +1 -0
  13. package/cjs/ClickAwayContainer/ClickAwayContainer.js +1 -1
  14. package/cjs/DatePicker/DatePicker/datePickerReducer.js +1 -1
  15. package/cjs/DatePicker/DatePicker.tailwind.js +7 -2
  16. package/cjs/DatePicker/DateRangePicker/dateRangePickerReducer.js +1 -1
  17. package/cjs/DatePicker/DateRangePicker/dateRangePickerTimeRange.js +1 -1
  18. package/cjs/DatePicker/utils.d.ts +1 -1
  19. package/cjs/Dropdown/Dropdown.js +1 -1
  20. package/cjs/Dropdown/DropdownButton.d.ts +1 -1
  21. package/cjs/Dropdown/DropdownContext.js +1 -1
  22. package/cjs/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItem.d.ts +0 -2
  23. package/cjs/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItem.js +3 -3
  24. package/cjs/Dropdown/useDropdownItemProps.js +2 -2
  25. package/cjs/Field/useFieldState.js +1 -1
  26. package/cjs/Link/Link.d.ts +2 -2
  27. package/cjs/Pagination/CompactPagination/CompactPagination.js +1 -1
  28. package/cjs/Pagination/DotPagination/DotPagination.d.ts +2 -1
  29. package/cjs/Pagination/DotPagination/DotPagination.js +4 -2
  30. package/cjs/Pagination/Pagination/Pagination.js +3 -0
  31. package/cjs/ProgressSpinner/ProgressSpinner.js +1 -1
  32. package/cjs/RadioGroup/RadioButton.d.ts +1 -1
  33. package/cjs/RadioGroup/RadioGroup.js +1 -1
  34. package/cjs/RangeSlider/RangeSlider.d.ts +1 -1
  35. package/cjs/Satellite/SatelliteContext.js +1 -1
  36. package/cjs/Sidebar/SidebarContext.js +1 -1
  37. package/cjs/Switch/utils.js +1 -1
  38. package/cjs/Tables/DataTable/DataTable.d.ts +41 -0
  39. package/cjs/Tables/DataTable/DataTable.js +278 -0
  40. package/cjs/Tables/DataTable/DataTable.tailwind.d.ts +5 -0
  41. package/cjs/Tables/DataTable/DataTable.tailwind.js +23 -0
  42. package/cjs/Tables/DataTable/components/Body.d.ts +14 -0
  43. package/cjs/Tables/DataTable/components/Body.js +125 -0
  44. package/cjs/Tables/DataTable/components/Footer.d.ts +8 -0
  45. package/cjs/Tables/DataTable/components/Footer.js +81 -0
  46. package/cjs/Tables/DataTable/components/Header.d.ts +10 -0
  47. package/cjs/Tables/DataTable/components/Header.js +44 -0
  48. package/cjs/Tables/DataTable/components/HeaderCell.d.ts +11 -0
  49. package/cjs/Tables/DataTable/components/HeaderCell.js +61 -0
  50. package/cjs/Tables/DataTable/components/Loader.d.ts +6 -0
  51. package/cjs/Tables/DataTable/components/Loader.js +63 -0
  52. package/cjs/Tables/DataTable/components/index.d.ts +5 -0
  53. package/cjs/Tables/DataTable/components/index.js +70 -0
  54. package/cjs/Tables/DataTable/index.d.ts +3 -0
  55. package/cjs/Tables/DataTable/index.js +46 -0
  56. package/cjs/Tables/DataTable/types.d.ts +49 -0
  57. package/cjs/Tables/DataTable/types.js +5 -0
  58. package/cjs/Tables/DataTable/utils.d.ts +4 -0
  59. package/cjs/Tables/DataTable/utils.js +32 -0
  60. package/cjs/{Table → Tables/Table}/Table.d.ts +1 -1
  61. package/cjs/{Table → Tables/Table}/Table.js +8 -6
  62. package/cjs/Tables/Table/Table.tailwind.d.ts +5 -0
  63. package/cjs/{Table → Tables/Table}/Table.tailwind.js +6 -20
  64. package/cjs/Tables/Table/components/Footer.d.ts +8 -0
  65. package/cjs/Tables/Table/components/Footer.js +35 -0
  66. package/cjs/Tables/Table/index.d.ts +2 -0
  67. package/cjs/{Table → Tables/Table}/index.js +7 -5
  68. package/cjs/Tables/index.d.ts +3 -0
  69. package/cjs/Tables/index.js +46 -0
  70. package/cjs/Tabs/LinkTabs.js +1 -1
  71. package/cjs/Tag/Tag.d.ts +1 -1
  72. package/cjs/Toggle/Toggle.d.ts +1 -1
  73. package/cjs/Tooltip/OverflowTooltipWrapper.js +1 -1
  74. package/cjs/Tooltip/Tooltip.d.ts +1 -1
  75. package/cjs/index.d.ts +1 -1
  76. package/cjs/index.js +12 -12
  77. package/cjs/styles/brandColors.d.ts +6 -6
  78. package/cjs/styles/colors.d.ts +9 -9
  79. package/cjs/styles/helpers/icons.d.ts +12 -0
  80. package/cjs/styles/helpers/makeTailwindPrefixer.d.ts +1 -1
  81. package/cjs/styles/tailwind.config.d.ts +24 -33
  82. package/cjs/styles/tailwind.config.js +1 -1
  83. package/cjs/styles/zIndexes.d.ts +7 -7
  84. package/cjs/utils/genericChangeHandler.js +1 -1
  85. package/cjs/utils/hashCode.js +1 -1
  86. package/cjs/utils/index.d.ts +1 -0
  87. package/cjs/utils/index.js +15 -7
  88. package/cjs/utils/isCssPropertySupported.d.ts +1 -1
  89. package/cjs/utils/isNil.js +1 -1
  90. package/cjs/utils/matchLocation.d.ts +1 -1
  91. package/cjs/utils/parseUrl.js +1 -1
  92. package/cjs/utils/pluralize.js +1 -1
  93. package/cjs/utils/range.js +1 -1
  94. package/cjs/utils/toSentenceCase.d.ts +3 -0
  95. package/cjs/utils/toSentenceCase.js +21 -0
  96. package/cjs/utils/uniqBy.js +1 -1
  97. package/cjs/utils/uniqueId.js +1 -1
  98. package/cjs/utils/useLinkProps.d.ts +1 -1
  99. package/cjs/utils/useLinkProps.js +1 -1
  100. package/cjs/utils/useTriggerInputChange.d.ts +2 -1
  101. package/esm/AutoComplete/AutoComplete.d.ts +6 -2
  102. package/esm/AutoComplete/AutoComplete.js +10 -5
  103. package/esm/AutoComplete/types.d.ts +5 -0
  104. package/esm/Avatars/ApplicationAvatar.d.ts +1 -1
  105. package/esm/Button/styles.d.ts +1 -1
  106. package/esm/Card/components/CardHeader.d.ts +2 -2
  107. package/esm/Checkbox/Checkbox.d.ts +1 -1
  108. package/esm/Checkbox/Checkbox.js +1 -0
  109. package/esm/DatePicker/DatePicker.tailwind.js +7 -2
  110. package/esm/DatePicker/utils.d.ts +1 -1
  111. package/esm/Dropdown/Dropdown.js +1 -1
  112. package/esm/Dropdown/DropdownButton.d.ts +1 -1
  113. package/esm/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItem.d.ts +0 -2
  114. package/esm/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItem.js +2 -2
  115. package/esm/Dropdown/useDropdownItemProps.js +1 -1
  116. package/esm/Link/Link.d.ts +2 -2
  117. package/esm/Pagination/DotPagination/DotPagination.d.ts +2 -1
  118. package/esm/Pagination/DotPagination/DotPagination.js +4 -2
  119. package/esm/Pagination/Pagination/Pagination.js +3 -0
  120. package/esm/ProgressSpinner/ProgressSpinner.js +1 -1
  121. package/esm/RadioGroup/RadioButton.d.ts +1 -1
  122. package/esm/RangeSlider/RangeSlider.d.ts +1 -1
  123. package/esm/Tables/DataTable/DataTable.d.ts +41 -0
  124. package/esm/Tables/DataTable/DataTable.js +246 -0
  125. package/esm/Tables/DataTable/DataTable.tailwind.d.ts +5 -0
  126. package/esm/Tables/DataTable/DataTable.tailwind.js +21 -0
  127. package/esm/Tables/DataTable/components/Body.d.ts +14 -0
  128. package/esm/Tables/DataTable/components/Body.js +106 -0
  129. package/esm/Tables/DataTable/components/Footer.d.ts +8 -0
  130. package/esm/Tables/DataTable/components/Footer.js +60 -0
  131. package/esm/Tables/DataTable/components/Header.d.ts +10 -0
  132. package/esm/Tables/DataTable/components/Header.js +29 -0
  133. package/esm/Tables/DataTable/components/HeaderCell.d.ts +11 -0
  134. package/esm/Tables/DataTable/components/HeaderCell.js +42 -0
  135. package/esm/Tables/DataTable/components/Loader.d.ts +6 -0
  136. package/esm/Tables/DataTable/components/Loader.js +40 -0
  137. package/esm/Tables/DataTable/components/index.d.ts +5 -0
  138. package/esm/Tables/DataTable/components/index.js +5 -0
  139. package/esm/Tables/DataTable/index.d.ts +3 -0
  140. package/esm/Tables/DataTable/index.js +3 -0
  141. package/esm/Tables/DataTable/types.d.ts +49 -0
  142. package/esm/Tables/DataTable/types.js +1 -0
  143. package/esm/Tables/DataTable/utils.d.ts +4 -0
  144. package/esm/Tables/DataTable/utils.js +14 -0
  145. package/esm/{Table → Tables/Table}/Table.d.ts +1 -1
  146. package/esm/{Table → Tables/Table}/Table.js +7 -6
  147. package/esm/Tables/Table/Table.tailwind.d.ts +5 -0
  148. package/esm/{Table → Tables/Table}/Table.tailwind.js +6 -20
  149. package/esm/Tables/Table/components/Footer.d.ts +8 -0
  150. package/esm/Tables/Table/components/Footer.js +20 -0
  151. package/esm/Tables/Table/index.d.ts +2 -0
  152. package/esm/Tables/Table/index.js +2 -0
  153. package/esm/Tables/index.d.ts +3 -0
  154. package/esm/Tables/index.js +3 -0
  155. package/esm/Tag/Tag.d.ts +1 -1
  156. package/esm/Toggle/Toggle.d.ts +1 -1
  157. package/esm/Tooltip/Tooltip.d.ts +1 -1
  158. package/esm/index.d.ts +1 -1
  159. package/esm/index.js +1 -1
  160. package/esm/styles/brandColors.d.ts +6 -6
  161. package/esm/styles/colors.d.ts +9 -9
  162. package/esm/styles/helpers/icons.d.ts +12 -0
  163. package/esm/styles/helpers/makeTailwindPrefixer.d.ts +1 -1
  164. package/esm/styles/tailwind.config.d.ts +24 -33
  165. package/esm/styles/tailwind.config.js +1 -1
  166. package/esm/styles/zIndexes.d.ts +7 -7
  167. package/esm/utils/index.d.ts +1 -0
  168. package/esm/utils/index.js +2 -1
  169. package/esm/utils/isCssPropertySupported.d.ts +1 -1
  170. package/esm/utils/matchLocation.d.ts +1 -1
  171. package/esm/utils/toSentenceCase.d.ts +3 -0
  172. package/esm/utils/toSentenceCase.js +9 -0
  173. package/esm/utils/useLinkProps.d.ts +1 -1
  174. package/esm/utils/useTriggerInputChange.d.ts +2 -1
  175. package/package.json +4 -4
  176. package/satellite.css +445 -175
  177. package/satellite.min.css +2 -2
  178. package/cjs/Table/Table.tailwind.d.ts +0 -5
  179. package/cjs/Table/index.d.ts +0 -3
  180. package/esm/Table/Table.tailwind.d.ts +0 -5
  181. package/esm/Table/index.d.ts +0 -3
  182. package/esm/Table/index.js +0 -3
package/README.md CHANGED
@@ -113,9 +113,9 @@ const plugins = [
113
113
  // Here, it will keep all the classnames starting with:
114
114
  // - 'ais-*' to preserve the instant-search widgets style
115
115
  // - 'DayPicker*' to preserve all the DatePicker styles (used in the DatePicker and DateRangePicker)
116
- whitelistPatterns: [/^ais-/, /^DayPicker/]
116
+ whitelistPatterns: [/^ais-/, /^DayPicker/],
117
117
  }),
118
- cssnano({ preset: "default" })
118
+ cssnano({ preset: "default" }),
119
119
  ];
120
120
 
121
121
  module.exports = { plugins };
@@ -13,6 +13,10 @@ interface State {
13
13
  *
14
14
  * Use this component when the user needs to search through a long list of results.
15
15
  *
16
+ * ## Menu Size Variations
17
+ * - **Medium (default)**: the standard dropdown menu height for most use cases
18
+ * - **Large**: when numerous results should be displayed in the dropdown to ease selection
19
+ *
16
20
  * ## Best practices
17
21
  *
18
22
  * - Provide an empty state if there is no result
@@ -31,7 +35,7 @@ export declare class AutoComplete<T extends Option> extends Component<AutoComple
31
35
  options: never[];
32
36
  separatorKeyCodes: never[];
33
37
  separatorKeys: never[];
34
- optionItemComponent: React.ComponentType<import("./types").OptionItemProps>;
38
+ optionItemComponent: import("./types").OptionItemComponentType;
35
39
  noWrap: boolean;
36
40
  };
37
41
  state: State;
@@ -46,7 +50,7 @@ export declare class AutoComplete<T extends Option> extends Component<AutoComple
46
50
  updateInputWidth: () => void;
47
51
  handleKeyDown: (state: ControllerStateAndHelpers<Option>) => (evt: React.KeyboardEvent<any>) => void;
48
52
  handleChange: (option: Option) => void;
49
- handleShowAllResults: (evt: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
53
+ handleShowAllResults: (evt: React.MouseEvent<HTMLButtonElement>) => void;
50
54
  removeValue: (removedOption: Option) => void;
51
55
  renderInput: (results: Option[], autocompleteHelpers: ControllerStateAndHelpers<Option>, fieldState: FieldState) => JSX.Element;
52
56
  renderMenu: (results: Option[], autocompleteHelpers: ControllerStateAndHelpers<Option>) => JSX.Element;
@@ -65,7 +65,7 @@ var _DefaultOptionItem = _interopRequireDefault(require("./components/DefaultOpt
65
65
 
66
66
  var _AutoCompleteEmptyState = _interopRequireDefault(require("./components/AutoCompleteEmptyState"));
67
67
 
68
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15;
68
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16;
69
69
 
70
70
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
71
71
 
@@ -155,6 +155,10 @@ var defaultEmptyState = /*#__PURE__*/_react["default"].createElement(_AutoComple
155
155
  *
156
156
  * Use this component when the user needs to search through a long list of results.
157
157
  *
158
+ * ## Menu Size Variations
159
+ * - **Medium (default)**: the standard dropdown menu height for most use cases
160
+ * - **Large**: when numerous results should be displayed in the dropdown to ease selection
161
+ *
158
162
  * ## Best practices
159
163
  *
160
164
  * - Provide an empty state if there is no result
@@ -448,6 +452,7 @@ var AutoComplete = /*#__PURE__*/function (_Component) {
448
452
  isOpen = autocompleteHelpers.isOpen;
449
453
  var _this$props4 = _this.props,
450
454
  menuClassName = _this$props4.menuClassName,
455
+ menuSize = _this$props4.menuSize,
451
456
  _this$props4$emptySta = _this$props4.emptyState,
452
457
  emptyState = _this$props4$emptySta === void 0 ? AutoComplete.defaultProps.emptyState : _this$props4$emptySta,
453
458
  menuFooter = _this$props4.menuFooter,
@@ -496,26 +501,26 @@ var AutoComplete = /*#__PURE__*/function (_Component) {
496
501
  }, results.length === 0 ? /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, getMenuProps(), {
497
502
  className: (0, _satellitePrefixer["default"])(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["min-h-10"])))
498
503
  }), emptyState) : /*#__PURE__*/_react["default"].createElement(_ScrollIndicator["default"], {
499
- className: (0, _satellitePrefixer["default"])(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2["default"])(["max-h-64"])))
504
+ className: menuSize === "large" ? (0, _satellitePrefixer["default"])(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2["default"])(["max-h-96"]))) : (0, _satellitePrefixer["default"])(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["max-h-64"])))
500
505
  }, /*#__PURE__*/_react["default"].createElement("ul", getMenuProps(), results.slice(0, showAllResults ? Number.MAX_SAFE_INTEGER : maxResults).map(function (result, index) {
501
506
  return /*#__PURE__*/_react["default"].createElement("li", (0, _extends2["default"])({
502
507
  key: result.value
503
508
  }, getItemProps({
504
509
  item: result,
505
510
  disabled: result.disabled,
506
- className: (0, _satellitePrefixer["default"])(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["\n autocomplete-result\n flex items-center min-h-10 px-4 cursor-pointer\n ", "\n ", "\n "])), index === highlightedIndex && "bg-grey-100", result.disabled && "cursor-not-allowed")
511
+ className: (0, _satellitePrefixer["default"])(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2["default"])(["\n autocomplete-result\n flex items-center min-h-10 px-4 cursor-pointer\n ", "\n ", "\n "])), index === highlightedIndex && "bg-grey-100", result.disabled && "cursor-not-allowed")
507
512
  })), /*#__PURE__*/_react["default"].createElement(OptionItem, (0, _extends2["default"])({}, optionItemProps, {
508
513
  highlighted: index === highlightedIndex,
509
514
  option: result
510
515
  })));
511
516
  }), extraResults > 0 && !showAllResults && /*#__PURE__*/_react["default"].createElement("li", {
512
- className: (0, _satellitePrefixer["default"])(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2["default"])(["p-2 text-right"])))
517
+ className: (0, _satellitePrefixer["default"])(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2["default"])(["p-2 text-right"])))
513
518
  }, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
514
519
  variant: "subtle",
515
520
  size: "small",
516
521
  onMouseDown: _this.handleShowAllResults
517
522
  }, "Show ", (0, _pluralize["default"])(extraResults, "result"), " more")))), menuFooter && /*#__PURE__*/_react["default"].createElement("footer", {
518
- className: (0, _satellitePrefixer["default"])(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2["default"])(["flex items-center justify-center min-h-12 p-4 bg-grey-100 border-t border-grey-200 text-grey-600"])))
523
+ className: (0, _satellitePrefixer["default"])(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2["default"])(["flex items-center justify-center min-h-12 p-4 bg-grey-100 border-t border-grey-200 text-grey-600"])))
519
524
  }, menuFooter)));
520
525
  });
521
526
  });
@@ -31,6 +31,11 @@ export interface AutoCompleteBaseProps {
31
31
  /** Keep the input on a single line */
32
32
  noWrap?: boolean;
33
33
  endItem?: React.ReactNode;
34
+ /**
35
+ * `medium` will display about 5 results in the dropdown; use `large` variant to display more
36
+ * @default "medium"
37
+ */
38
+ menuSize?: "medium" | "large";
34
39
  }
35
40
  export interface AutoCompleteSingleProps extends AutoCompleteBaseProps {
36
41
  multiple?: false;
@@ -3,8 +3,8 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
+ exports.defaultCreateFromInputValue = exports.caseInsensitiveCreateFromInputValue = void 0;
6
7
  exports.isAutoCompleteMultiProps = isAutoCompleteMultiProps;
7
- exports.caseInsensitiveCreateFromInputValue = exports.defaultCreateFromInputValue = void 0;
8
8
 
9
9
  function isAutoCompleteMultiProps(props) {
10
10
  return Boolean(props.multiple);
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import type { ApplicationAvatarSize, MinimalApplication } from "./types";
3
- interface ApplicationAvatarProps {
3
+ export interface ApplicationAvatarProps {
4
4
  /** A minimal application object containing `applicationID` and `name`. */
5
5
  application: MinimalApplication;
6
6
  /** @default "medium" */
@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports.getUserInitials = exports.getUserBackgroundClassName = exports.getApplicationInitials = exports.getApplicationIdInitial = exports.pickApplicationColors = void 0;
8
+ exports.pickApplicationColors = exports.getUserInitials = exports.getUserBackgroundClassName = exports.getApplicationInitials = exports.getApplicationIdInitial = void 0;
9
9
 
10
10
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
11
11
 
@@ -2,4 +2,4 @@ import { ButtonBaseProps, ButtonSize, ButtonVariant } from "./types";
2
2
  export declare const BUTTON_SIZE_CLASSNAMES: Record<ButtonSize, string>;
3
3
  export declare const BUTTON_LOADER_ICON_SIZES: Record<ButtonSize, number>;
4
4
  export declare const BUTTON_VARIANT_CLASSNAMES: Record<ButtonVariant, string>;
5
- export declare const getIconColorClassName: ({ disabled, variant }: ButtonBaseProps) => string;
5
+ export declare const getIconColorClassName: ({ disabled, variant }: Pick<ButtonBaseProps, "disabled" | "variant">) => string;
@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports.getIconColorClassName = exports.BUTTON_VARIANT_CLASSNAMES = exports.BUTTON_LOADER_ICON_SIZES = exports.BUTTON_SIZE_CLASSNAMES = void 0;
8
+ exports.getIconColorClassName = exports.BUTTON_VARIANT_CLASSNAMES = exports.BUTTON_SIZE_CLASSNAMES = exports.BUTTON_LOADER_ICON_SIZES = void 0;
9
9
 
10
10
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
11
11
 
@@ -1,4 +1,4 @@
1
- import React from "react";
1
+ /// <reference types="react" />
2
2
  export declare type CardHeaderProps = JSX.IntrinsicElements["div"];
3
- export declare const CardHeader: ({ className, ...props }: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
3
+ export declare const CardHeader: ({ className, ...props }: CardHeaderProps) => JSX.Element;
4
4
  export default CardHeader;
@@ -20,5 +20,5 @@ export declare type CheckboxProps = CheckboxInputProps & CheckboxCustomProps;
20
20
  * - A checkbox control has two primary states: selected and unselected. If required, there's an additional visual state for indeterminate (usually for a parent checkbox, when some children checkboxes are selected, but not all of them)
21
21
  * - Checkboxes require the use of a button to apply the settings once they are selected
22
22
  */
23
- export declare const Checkbox: React.ForwardRefExoticComponent<Pick<React.HTMLAttributes<HTMLInputElement>, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "children" | "className" | "id" | "lang" | "role" | "tabIndex" | "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" | "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" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is"> & Pick<React.InputHTMLAttributes<HTMLInputElement>, "required" | "disabled" | "onChange" | "defaultChecked" | "autoFocus" | "checked"> & CheckboxCustomProps & React.RefAttributes<HTMLInputElement>>;
23
+ export declare const Checkbox: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLInputElement>, "onChange"> & Pick<React.InputHTMLAttributes<HTMLInputElement>, "required" | "disabled" | "defaultChecked" | "onChange" | "autoFocus" | "checked"> & CheckboxCustomProps & React.RefAttributes<HTMLInputElement>>;
24
24
  export default Checkbox;
@@ -99,6 +99,7 @@ var Checkbox = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
99
99
  }, /*#__PURE__*/_react["default"].createElement(CheckboxIcon, {
100
100
  className: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["checkbox-icon"])))
101
101
  }), /*#__PURE__*/_react["default"].createElement("input", (0, _extends2["default"])({}, checkboxProps, {
102
+ "aria-checked": indeterminate ? "mixed" : isChecked,
102
103
  id: id,
103
104
  className: (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n opacity-0 absolute inset-0 cursor-pointer\n ", "\n "])), disabled && "cursor-not-allowed"),
104
105
  type: "checkbox",
@@ -7,7 +7,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
7
7
  Object.defineProperty(exports, "__esModule", {
8
8
  value: true
9
9
  });
10
- exports["default"] = exports.ClickAwayContainer = exports.useClickAwayContext = exports.ClickAwayContext = void 0;
10
+ exports.useClickAwayContext = exports["default"] = exports.ClickAwayContext = exports.ClickAwayContainer = void 0;
11
11
 
12
12
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
13
13
 
@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports.datePickerReducer = exports.initDatePickerReducer = exports.DatePickerActionTypes = void 0;
8
+ exports.initDatePickerReducer = exports.datePickerReducer = exports.DatePickerActionTypes = void 0;
9
9
 
10
10
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
11
11
 
@@ -32,6 +32,10 @@ var datePickerPlugin = function datePickerPlugin(_ref) {
32
32
  textAlign: "center"
33
33
  }
34
34
  }, (0, _defineProperty2["default"])(_addComponents, prefix(".date-picker, .date-range-picker"), {
35
+ "& .DayPicker-Months": {
36
+ // Hack to align dates on the same grid
37
+ alignItems: "start"
38
+ },
35
39
  "& .DayPicker-Day": (_DayPickerDay = {
36
40
  borderRadius: defaultRadius
37
41
  }, (0, _defineProperty2["default"])(_DayPickerDay, "&--today".concat(not("outside")), {
@@ -46,8 +50,9 @@ var datePickerPlugin = function datePickerPlugin(_ref) {
46
50
  borderRadius: 9999,
47
51
  width: 32,
48
52
  height: 32,
49
- left: 2,
50
- top: 4,
53
+ left: "50%",
54
+ top: "50%",
55
+ transform: "translate(-50%, -50%)",
51
56
  zIndex: -1
52
57
  }
53
58
  }), (0, _defineProperty2["default"])(_DayPickerDay, "&--selected".concat(not("outside")), {
@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports.dateRangePickerReducer = exports.initDateRangePickerReducer = exports.DateRangePickerActionTypes = void 0;
8
+ exports.initDateRangePickerReducer = exports.dateRangePickerReducer = exports.DateRangePickerActionTypes = void 0;
9
9
 
10
10
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
11
11
 
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.isPartialTimeRange = exports.isCompleteTimeRange = exports.isEmptyTimeRange = void 0;
6
+ exports.isPartialTimeRange = exports.isEmptyTimeRange = exports.isCompleteTimeRange = void 0;
7
7
 
8
8
  var isEmptyTimeRange = function isEmptyTimeRange(range) {
9
9
  return Boolean(range && !(range.start || range.end));
@@ -1 +1 @@
1
- export declare const formatDate: (date: number | Date) => string;
1
+ export declare const formatDate: (date: Date | number) => string;
@@ -144,7 +144,7 @@ var Dropdown = function Dropdown(_ref) {
144
144
  }), /*#__PURE__*/_react["default"].createElement(_Card["default"], {
145
145
  fullBleed: true,
146
146
  elevation: "300",
147
- className: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["flex flex-col py-1"])))
147
+ className: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["flex flex-col py-1 text-grey-900"])))
148
148
  }, children, footer ? /*#__PURE__*/_react["default"].createElement(_DropdownFooterItem["default"], null, footer) : null))), document.body)));
149
149
  };
150
150
 
@@ -1,7 +1,7 @@
1
1
  import React, { FunctionComponent } from "react";
2
2
  import { ButtonProps } from "../Button";
3
3
  import { RenderTargetParams } from "./Dropdown";
4
- export interface DropdownButtonProps extends Omit<ButtonProps<"button">, "title"> {
4
+ export interface DropdownButtonProps extends Omit<ButtonProps<"button">, "title" | "endIcon"> {
5
5
  /** Title displayed in the `Dropdown` */
6
6
  title: React.ReactNode;
7
7
  renderFooter?: (args: RenderTargetParams) => React.ReactNode;
@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports["default"] = exports.useDropdownContext = exports.DropdownContext = void 0;
8
+ exports.useDropdownContext = exports["default"] = exports.DropdownContext = void 0;
9
9
 
10
10
  var _react = _interopRequireWildcard(require("react"));
11
11
 
@@ -1,6 +1,4 @@
1
1
  import React, { FC } from "react";
2
- export declare type DropdownCollapsibleValue = undefined | string | string[];
3
- export declare type DropdownCollapsiblePropsOnChange = (name: string, value: DropdownCollapsibleValue) => void;
4
2
  export interface DropdownCollapsibleItemProps {
5
3
  title: React.ReactNode;
6
4
  name?: string;
@@ -21,7 +21,7 @@ var _utils = require("../../../utils");
21
21
 
22
22
  var _satellitePrefixer = _interopRequireDefault(require("../../../styles/helpers/satellitePrefixer"));
23
23
 
24
- var _ = require(".");
24
+ var _DropdownCollapsibleItemsGroupContext = require("./DropdownCollapsibleItemsGroupContext");
25
25
 
26
26
  var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
27
27
 
@@ -36,7 +36,7 @@ var DropdownCollapsibleItem = function DropdownCollapsibleItem(_ref) {
36
36
  _onClick = _ref.onClick,
37
37
  children = _ref.children;
38
38
 
39
- var _useDropdownCollapsib = (0, _.useDropdownCollapsibleItemsGroup)(),
39
+ var _useDropdownCollapsib = (0, _DropdownCollapsibleItemsGroupContext.useDropdownCollapsibleItemsGroup)(),
40
40
  expandedItems = _useDropdownCollapsib.expandedItems,
41
41
  onItemClick = _useDropdownCollapsib.onItemClick;
42
42
 
@@ -66,7 +66,7 @@ var DropdownCollapsibleItem = function DropdownCollapsibleItem(_ref) {
66
66
  className: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["text-grey-500"]))),
67
67
  size: "1.25em"
68
68
  })), isExpanded && /*#__PURE__*/_react["default"].createElement("div", {
69
- className: (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["bg-grey-50 border-l-2 border-grey-300"])))
69
+ className: (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["bg-grey-50 border-l-2 border-grey-300 typo-subdued"])))
70
70
  }, children));
71
71
  };
72
72
 
@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports["default"] = exports.useDropdownItemProps = void 0;
8
+ exports.useDropdownItemProps = exports["default"] = void 0;
9
9
 
10
10
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
11
11
 
@@ -21,7 +21,7 @@ var useDropdownItemProps = function useDropdownItemProps(props) {
21
21
  var _useDropdownContext = (0, _DropdownContext.useDropdownContext)(),
22
22
  showMenu = _useDropdownContext.showMenu;
23
23
 
24
- var className = (0, _classnames["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n flex items-center\n min-h-10 px-4 text-left\n focus:no-underline hover:no-underline\n ", "\n "])), props.disabled ? "text-grey-300 cursor-not-allowed" : "text-grey-900 hover:bg-grey-100 focus:bg-grey-100 focus:outline-none cursor-pointer"), props.className);
24
+ var className = (0, _classnames["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n flex items-center\n min-h-10 px-4 text-left\n focus:no-underline hover:no-underline\n ", "\n "])), props.disabled ? "text-grey-300 cursor-not-allowed" : "text-inherit hover:bg-grey-100 focus:bg-grey-100 focus:outline-none cursor-pointer"), props.className);
25
25
  return {
26
26
  className: className,
27
27
  onClick: props.disabled ? function (evt) {
@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports["default"] = exports.useFieldState = void 0;
8
+ exports.useFieldState = exports["default"] = void 0;
9
9
 
10
10
  var _react = require("react");
11
11
 
@@ -5,7 +5,7 @@ export declare type LinkProps = {
5
5
  endIcon?: IconComponentType;
6
6
  } & React.AnchorHTMLAttributes<HTMLAnchorElement>;
7
7
  export declare const Link: React.ForwardRefExoticComponent<{
8
- startIcon?: React.ComponentClass<import("react-feather").IconProps, any> | React.FunctionComponent<import("react-feather").IconProps> | undefined;
9
- endIcon?: React.ComponentClass<import("react-feather").IconProps, any> | React.FunctionComponent<import("react-feather").IconProps> | undefined;
8
+ startIcon?: IconComponentType | undefined;
9
+ endIcon?: IconComponentType | undefined;
10
10
  } & React.AnchorHTMLAttributes<HTMLAnchorElement> & React.RefAttributes<HTMLAnchorElement>>;
11
11
  export default Link;
@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports["default"] = exports.CompactPagination = exports.isIndeterminateCompactPaginationProps = exports.isDeterminateCompactPaginationProps = void 0;
8
+ exports.isIndeterminateCompactPaginationProps = exports.isDeterminateCompactPaginationProps = exports["default"] = exports.CompactPagination = void 0;
9
9
 
10
10
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
11
11
 
@@ -4,6 +4,7 @@ export declare type DotPaginationProps = {
4
4
  currentPage: number;
5
5
  onChange: (page: number) => void;
6
6
  nbPages: number;
7
+ size?: "small" | "medium";
7
8
  };
8
- export declare const DotPagination: ({ currentPage, onChange, nbPages }: DotPaginationProps) => JSX.Element;
9
+ export declare const DotPagination: ({ currentPage, onChange, nbPages, size }: DotPaginationProps) => JSX.Element;
9
10
  export default DotPagination;
@@ -18,7 +18,9 @@ var _templateObject, _templateObject2;
18
18
  var DotPagination = function DotPagination(_ref) {
19
19
  var currentPage = _ref.currentPage,
20
20
  onChange = _ref.onChange,
21
- nbPages = _ref.nbPages;
21
+ nbPages = _ref.nbPages,
22
+ _ref$size = _ref.size,
23
+ size = _ref$size === void 0 ? "medium" : _ref$size;
22
24
  return /*#__PURE__*/_react["default"].createElement("ul", {
23
25
  className: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["flex"])))
24
26
  }, new Array(nbPages).fill(undefined).map(function (_, idx) {
@@ -27,7 +29,7 @@ var DotPagination = function DotPagination(_ref) {
27
29
  key: idx
28
30
  }, /*#__PURE__*/_react["default"].createElement("button", {
29
31
  "aria-label": "Go to page ".concat(pageIdx),
30
- className: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n h-3 w-3 rounded-full mx-1\n ", "\n "])), currentPage === pageIdx ? "bg-accent-600" : "bg-grey-200"),
32
+ 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"),
31
33
  onClick: function onClick() {
32
34
  return onChange(pageIdx);
33
35
  }
@@ -43,6 +43,7 @@ var Group = function Group(_ref) {
43
43
  onChange = _ref.onChange;
44
44
  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, group.map(function (index) {
45
45
  return /*#__PURE__*/_react["default"].createElement(_Button["default"], {
46
+ "aria-label": "Go to page ".concat(index),
46
47
  key: index,
47
48
  variant: index === currentPage ? "primary" : "neutral",
48
49
  onClick: function onClick() {
@@ -83,6 +84,7 @@ var Pagination = function Pagination(_ref2) {
83
84
  return /*#__PURE__*/_react["default"].createElement(_Button.ButtonGroup, {
84
85
  as: "nav"
85
86
  }, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
87
+ "aria-label": "Go to previous page",
86
88
  disabled: currentPage === 1,
87
89
  onClick: function onClick() {
88
90
  return onChange(currentPage - 1);
@@ -102,6 +104,7 @@ var Pagination = function Pagination(_ref2) {
102
104
  onChange: onChange,
103
105
  group: groups[2]
104
106
  }), /*#__PURE__*/_react["default"].createElement(_Button["default"], {
107
+ "aria-label": "Go to next page",
105
108
  disabled: currentPage === nbPages,
106
109
  onClick: function onClick() {
107
110
  return onChange(currentPage + 1);
@@ -42,7 +42,7 @@ var ProgressSpinner = function ProgressSpinner(_ref) {
42
42
  viewBox: "".concat(size / 2, " ").concat(size / 2, " ").concat(size, " ").concat(size),
43
43
  width: size,
44
44
  height: size
45
- }), /*#__PURE__*/_react["default"].createElement("circle", {
45
+ }), /*#__PURE__*/_react["default"].createElement("title", null, "Loading spinner"), /*#__PURE__*/_react["default"].createElement("circle", {
46
46
  cx: size,
47
47
  cy: size,
48
48
  r: (size - thickness) / 2,
@@ -1,4 +1,4 @@
1
1
  import React from "react";
2
2
  export declare type RadioButtonProps = React.HTMLAttributes<HTMLInputElement> & Pick<React.InputHTMLAttributes<HTMLInputElement>, "value" | "name" | "checked" | "defaultChecked" | "onChange" | "required" | "autoFocus" | "disabled">;
3
- export declare const RadioButton: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLInputElement> & Pick<React.InputHTMLAttributes<HTMLInputElement>, "required" | "disabled" | "name" | "onChange" | "defaultChecked" | "value" | "autoFocus" | "checked"> & React.RefAttributes<HTMLInputElement>>;
3
+ export declare const RadioButton: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLInputElement> & Pick<React.InputHTMLAttributes<HTMLInputElement>, "required" | "disabled" | "defaultChecked" | "onChange" | "name" | "autoFocus" | "value" | "checked"> & React.RefAttributes<HTMLInputElement>>;
4
4
  export default RadioButton;
@@ -7,7 +7,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
7
7
  Object.defineProperty(exports, "__esModule", {
8
8
  value: true
9
9
  });
10
- exports["default"] = exports.RadioGroup = exports.RadioGroupItem = void 0;
10
+ exports["default"] = exports.RadioGroupItem = exports.RadioGroup = void 0;
11
11
 
12
12
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
13
13
 
@@ -14,5 +14,5 @@ export interface RangeSliderProps extends Omit<React.DetailedHTMLProps<React.Inp
14
14
  * - Provide min and max value whenever possible
15
15
  * - Provide text input for better accessibility
16
16
  */
17
- export declare const RangeSlider: React.ForwardRefExoticComponent<Pick<RangeSliderProps, "max" | "required" | "disabled" | "hidden" | "dir" | "form" | "slot" | "style" | "title" | "pattern" | "color" | "size" | "multiple" | "className" | "height" | "id" | "lang" | "min" | "name" | "width" | "role" | "tabIndex" | "crossOrigin" | "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" | "key" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "src" | "value" | "alt" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "autoComplete" | "accept" | "capture" | "list" | "maxLength" | "minLength" | "readOnly" | "step" | "track1Color" | "track2Color"> & React.RefAttributes<HTMLInputElement>>;
17
+ export declare const RangeSlider: React.ForwardRefExoticComponent<Pick<RangeSliderProps, "max" | "required" | "disabled" | "hidden" | "dir" | "form" | "slot" | "style" | "title" | "pattern" | "color" | "size" | "multiple" | "key" | "list" | "step" | "className" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "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" | "name" | "height" | "min" | "width" | "crossOrigin" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "value" | "accept" | "alt" | "autoComplete" | "capture" | "maxLength" | "minLength" | "readOnly" | "src" | "track1Color" | "track2Color"> & React.RefAttributes<HTMLInputElement>>;
18
18
  export default RangeSlider;
@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports["default"] = exports.useSatelliteContext = exports.SatelliteContext = void 0;
8
+ exports.useSatelliteContext = exports["default"] = exports.SatelliteContext = void 0;
9
9
 
10
10
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
11
11
 
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports["default"] = exports.useSidebarContext = exports.SidebarContext = exports.SIDEBAR_CONTEXT_DEFAULT = void 0;
6
+ exports.useSidebarContext = exports["default"] = exports.SidebarContext = exports.SIDEBAR_CONTEXT_DEFAULT = void 0;
7
7
 
8
8
  var _react = require("react");
9
9
 
@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports.buildAnimationProps = exports.buildAnimationKeySelector = exports.buildAnimationKeyValue = exports.SWITCH_ANIMATION_KEY = void 0;
8
+ exports.buildAnimationProps = exports.buildAnimationKeyValue = exports.buildAnimationKeySelector = exports.SWITCH_ANIMATION_KEY = void 0;
9
9
 
10
10
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
11
11
 
@@ -0,0 +1,41 @@
1
+ import React from "react";
2
+ import type { ColumnDefinition, Row, Status, SelectMode, PaginationConfiguration, Sorting, DataConfiguration, GetItemId } from "./types";
3
+ declare type CanSelectItem<Item> = (item: Item, idx: number) => boolean;
4
+ export interface DataTableProps<Item> {
5
+ data: Item[];
6
+ itemId?: GetItemId<Item>;
7
+ pagination?: PaginationConfiguration;
8
+ sorting?: Sorting[];
9
+ onChange?(dataConfiguration: DataConfiguration): void;
10
+ status?: Status;
11
+ noDataContent?: React.ReactNode;
12
+ errorContent?: React.ReactNode;
13
+ columns: ColumnDefinition<Item>[];
14
+ selectMode?: SelectMode;
15
+ selection?: string[];
16
+ onSelectionChange?(rowId: string[]): void;
17
+ canSelectItem?: CanSelectItem<Item>;
18
+ canHoverRow?(row: Row<Item>): boolean;
19
+ onRowHoveredChanged?(row: Row<Item> | null): void;
20
+ }
21
+ /**
22
+ * Tables are used to structure content in a grid to make it easier to see relationships and to facilitate understanding.
23
+ *
24
+ * #### Do
25
+ *
26
+ * - Organize columns and rows based on the needs of your users. To help people read the table, order the columns by importance from left to right, with the key pieces of content opening the row
27
+ * - Include units of measurement symbols in the header so you don't need to repeat them throughout the columns
28
+ * - Indicate sorting capabilities of a column with a chevron in the cell header
29
+ * - Start by columns with highest value to the user, and continue with less important ones
30
+ *
31
+ * #### Do not
32
+ *
33
+ * - Center align text in cells
34
+ *
35
+ * ## Best practices
36
+ *
37
+ * - If a cell is empty or unavailable, keep the cell empty to reduce noise and help with legibility.
38
+ * - Truncate long text to make it fit into a cell. However, choose column width wisely based on expected values, and adjust the table accordingly
39
+ */
40
+ export declare const DataTable: <Item extends {}>({ data, itemId, columns, onChange, status, noDataContent, errorContent, sorting, pagination, selectMode, selection, onSelectionChange, canSelectItem, canHoverRow, onRowHoveredChanged, }: DataTableProps<Item>) => JSX.Element;
41
+ export default DataTable;