colibri-ui 0.8.84 → 0.8.87

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 (257) hide show
  1. package/Accordion/Accordion.module.css +4 -0
  2. package/Accordion/index.js +15 -23
  3. package/Autocomplete/Autocomplete.js +101 -132
  4. package/Avatar/Avatar.module.css +6 -0
  5. package/Avatar/index.js +102 -89
  6. package/Badge/Badge.module.css +2 -1
  7. package/Badge/Control/index.js +5 -3
  8. package/Badge/index.js +16 -16
  9. package/Button/index.js +23 -20
  10. package/Button/tokens.js +2 -2
  11. package/Calendar/Calendar.js +171 -269
  12. package/Card/Card.js +26 -32
  13. package/Checkbox/index.js +46 -43
  14. package/Chip/Chip.module.css +2 -1
  15. package/Chip/index.js +15 -15
  16. package/ClickOutside/index.js +10 -13
  17. package/CodeField/CodeField.js +113 -170
  18. package/Counter/Counter.module.css +2 -1
  19. package/Counter/index.js +21 -20
  20. package/Datepicker/components/DatePicker/index.js +81 -102
  21. package/Datepicker/index.js +17 -16
  22. package/DotsLoader/index.js +23 -15
  23. package/Drawer/Drawer.js +84 -98
  24. package/Drawer/Drawer.module.css +2 -1
  25. package/Drawer/index.props.d.ts +2 -0
  26. package/Dropdown/index.js +55 -68
  27. package/Dropzone/Dropzone.js +78 -168
  28. package/Dropzone/Dropzone.module.css +2 -1
  29. package/Editable/Editable.js +44 -57
  30. package/Grid/Item/index.js +11 -13
  31. package/Grid/index.js +15 -21
  32. package/Icons/ArrowNext.js +7 -8
  33. package/Icons/Cart.js +7 -8
  34. package/Icons/Check.js +7 -8
  35. package/Icons/Chevron.js +7 -8
  36. package/Icons/Close.js +6 -6
  37. package/Icons/Copy.js +7 -8
  38. package/Icons/Cross.js +6 -6
  39. package/Icons/CrossFill.js +7 -8
  40. package/Icons/Edit.js +7 -8
  41. package/Icons/Exit.js +7 -8
  42. package/Icons/EyeClosed.js +7 -8
  43. package/Icons/EyeOpen.js +7 -8
  44. package/Icons/Help.js +6 -6
  45. package/Icons/Info.js +7 -8
  46. package/Icons/Minus.js +7 -8
  47. package/Icons/More.js +7 -8
  48. package/Icons/Plus.js +7 -8
  49. package/Icons/Setting.js +7 -8
  50. package/Icons/Shield.js +7 -8
  51. package/Icons/Trash.js +7 -8
  52. package/Icons/User.js +7 -8
  53. package/Image/Image.module.css +4 -0
  54. package/Image/index.d.ts +1 -1
  55. package/Image/index.js +44 -37
  56. package/Input/index.d.ts +1 -1
  57. package/Input/index.js +37 -25
  58. package/Input/index.props.d.ts +1 -1
  59. package/InputRadio/index.js +32 -24
  60. package/List/List.js +81 -76
  61. package/Menu/Menu.module.css +2 -1
  62. package/Menu/components/MenuItem/index.js +17 -14
  63. package/Menu/index.js +22 -23
  64. package/Modal/components/Body/index.js +9 -8
  65. package/Modal/components/Close/Close.module.css +4 -0
  66. package/Modal/components/Close/index.js +13 -14
  67. package/Modal/components/Content/index.js +5 -6
  68. package/Modal/components/Footer/index.js +5 -3
  69. package/Modal/components/Header/index.js +13 -12
  70. package/Modal/components/Title/index.js +10 -9
  71. package/Modal/context.js +3 -3
  72. package/Modal/index.js +46 -68
  73. package/MultiSelect/components/MenuOverlay/index.js +48 -61
  74. package/MultiSelect/components/MenuOverlayItem/index.js +13 -14
  75. package/MultiSelect/index.js +72 -100
  76. package/MultiSelect/index.module.css +2 -1
  77. package/MultiSelect/utils/index.js +8 -18
  78. package/NumberInput/NumberInput.js +80 -112
  79. package/Portal/index.js +6 -10
  80. package/Progress/Progress.js +45 -58
  81. package/RadioGroup/Radio.js +29 -32
  82. package/RadioGroup/index.js +43 -46
  83. package/Rating/Rating.js +50 -63
  84. package/Select/components/MenuOverlay/index.js +16 -25
  85. package/Select/components/MenuOverlayItem/index.js +13 -11
  86. package/Select/index.js +39 -48
  87. package/Select/index.module.css +2 -1
  88. package/Separator/index.js +5 -6
  89. package/Sheet/Sheet.js +98 -122
  90. package/Sheet/Sheet.module.css +4 -2
  91. package/Sheet/index.props.d.ts +2 -0
  92. package/Skeleton/index.js +25 -30
  93. package/Slider/Slider.js +83 -119
  94. package/Status/index.js +17 -18
  95. package/Switch/Switch.module.css +2 -1
  96. package/Switch/index.js +22 -15
  97. package/TabsMenu/Tab/Tab.js +14 -10
  98. package/TabsMenu/Tab/Tab.module.css +2 -1
  99. package/TabsMenu/index.js +25 -26
  100. package/TabsPanels/Panel/index.js +6 -4
  101. package/TabsPanels/index.js +13 -10
  102. package/TextArea/index.d.ts +1 -1
  103. package/TextArea/index.js +30 -19
  104. package/Theme/breakpoints.js +5 -11
  105. package/Theme/colors/theme_buenos_aires.js +14 -14
  106. package/Theme/colors/theme_jaipur.js +14 -14
  107. package/Theme/global.css +0 -1
  108. package/Theme/index.js +1 -1
  109. package/TimeSelect/Label/index.js +11 -13
  110. package/TimeSelect/helpers.js +23 -42
  111. package/TimeSelect/index.js +32 -38
  112. package/Tooltip/index.js +36 -42
  113. package/Typography/Typography.module.css +1365 -0
  114. package/Typography/index.js +24 -13
  115. package/Typography/index.props.d.ts +13 -1
  116. package/base/BaseInput/index.js +10 -8
  117. package/base/FormField/index.d.ts +1 -1
  118. package/base/FormField/index.js +27 -22
  119. package/base/FormField/index.props.d.ts +4 -0
  120. package/base/InputRoot/index.js +27 -27
  121. package/esm/Accordion/Accordion.module.css +4 -0
  122. package/esm/Accordion/index.js +15 -21
  123. package/esm/Autocomplete/Autocomplete.js +101 -130
  124. package/esm/Avatar/Avatar.module.css +6 -0
  125. package/esm/Avatar/index.js +102 -88
  126. package/esm/Badge/Badge.module.css +2 -1
  127. package/esm/Badge/Control/index.js +5 -3
  128. package/esm/Badge/index.js +16 -15
  129. package/esm/Button/index.js +23 -19
  130. package/esm/Button/tokens.js +2 -2
  131. package/esm/Calendar/Calendar.js +171 -267
  132. package/esm/Card/Card.js +26 -32
  133. package/esm/Checkbox/index.js +46 -42
  134. package/esm/Chip/Chip.module.css +2 -1
  135. package/esm/Chip/index.js +15 -14
  136. package/esm/ClickOutside/index.js +10 -13
  137. package/esm/CodeField/CodeField.js +113 -169
  138. package/esm/Counter/Counter.module.css +2 -1
  139. package/esm/Counter/index.js +21 -19
  140. package/esm/Datepicker/components/DatePicker/index.js +81 -101
  141. package/esm/Datepicker/index.js +17 -16
  142. package/esm/DotsLoader/index.js +23 -14
  143. package/esm/Drawer/Drawer.js +84 -97
  144. package/esm/Drawer/Drawer.module.css +2 -1
  145. package/esm/Drawer/index.props.d.ts +2 -0
  146. package/esm/Dropdown/index.js +55 -66
  147. package/esm/Dropzone/Dropzone.js +78 -165
  148. package/esm/Dropzone/Dropzone.module.css +2 -1
  149. package/esm/Editable/Editable.js +44 -56
  150. package/esm/Grid/Item/index.js +11 -12
  151. package/esm/Grid/index.js +15 -21
  152. package/esm/Icons/ArrowNext.js +7 -8
  153. package/esm/Icons/Cart.js +7 -8
  154. package/esm/Icons/Check.js +7 -8
  155. package/esm/Icons/Chevron.js +7 -8
  156. package/esm/Icons/Close.js +6 -6
  157. package/esm/Icons/Copy.js +7 -8
  158. package/esm/Icons/Cross.js +6 -6
  159. package/esm/Icons/CrossFill.js +7 -8
  160. package/esm/Icons/Edit.js +7 -8
  161. package/esm/Icons/Exit.js +7 -8
  162. package/esm/Icons/EyeClosed.js +7 -8
  163. package/esm/Icons/EyeOpen.js +7 -8
  164. package/esm/Icons/Help.js +6 -6
  165. package/esm/Icons/Info.js +7 -8
  166. package/esm/Icons/Minus.js +7 -8
  167. package/esm/Icons/More.js +7 -8
  168. package/esm/Icons/Plus.js +7 -8
  169. package/esm/Icons/Setting.js +7 -8
  170. package/esm/Icons/Shield.js +7 -8
  171. package/esm/Icons/Trash.js +7 -8
  172. package/esm/Icons/User.js +7 -8
  173. package/esm/Image/Image.module.css +4 -0
  174. package/esm/Image/index.d.ts +1 -1
  175. package/esm/Image/index.js +44 -36
  176. package/esm/Input/index.d.ts +1 -1
  177. package/esm/Input/index.js +38 -26
  178. package/esm/Input/index.props.d.ts +1 -1
  179. package/esm/InputRadio/index.js +32 -23
  180. package/esm/List/List.js +81 -75
  181. package/esm/Menu/Menu.module.css +2 -1
  182. package/esm/Menu/components/MenuItem/index.js +17 -13
  183. package/esm/Menu/index.js +22 -23
  184. package/esm/Modal/components/Body/index.js +9 -7
  185. package/esm/Modal/components/Close/Close.module.css +4 -0
  186. package/esm/Modal/components/Close/index.js +13 -14
  187. package/esm/Modal/components/Content/index.js +5 -6
  188. package/esm/Modal/components/Footer/index.js +5 -3
  189. package/esm/Modal/components/Header/index.js +13 -11
  190. package/esm/Modal/components/Title/index.js +10 -9
  191. package/esm/Modal/context.js +3 -3
  192. package/esm/Modal/index.js +50 -70
  193. package/esm/MultiSelect/components/MenuOverlay/index.js +48 -60
  194. package/esm/MultiSelect/components/MenuOverlayItem/index.js +13 -14
  195. package/esm/MultiSelect/index.js +72 -97
  196. package/esm/MultiSelect/index.module.css +2 -1
  197. package/esm/MultiSelect/utils/index.js +8 -14
  198. package/esm/NumberInput/NumberInput.js +80 -111
  199. package/esm/Portal/index.js +6 -9
  200. package/esm/Progress/Progress.js +45 -58
  201. package/esm/RadioGroup/Radio.js +29 -32
  202. package/esm/RadioGroup/index.js +43 -45
  203. package/esm/Rating/Rating.js +50 -63
  204. package/esm/Select/components/MenuOverlay/index.js +16 -24
  205. package/esm/Select/components/MenuOverlayItem/index.js +13 -11
  206. package/esm/Select/index.js +39 -46
  207. package/esm/Select/index.module.css +2 -1
  208. package/esm/Separator/index.js +5 -6
  209. package/esm/Sheet/Sheet.js +98 -120
  210. package/esm/Sheet/Sheet.module.css +4 -2
  211. package/esm/Sheet/index.props.d.ts +2 -0
  212. package/esm/Skeleton/index.js +25 -30
  213. package/esm/Slider/Slider.js +83 -119
  214. package/esm/Status/index.js +17 -17
  215. package/esm/Switch/Switch.module.css +2 -1
  216. package/esm/Switch/index.js +22 -14
  217. package/esm/TabsMenu/Tab/Tab.js +14 -9
  218. package/esm/TabsMenu/Tab/Tab.module.css +2 -1
  219. package/esm/TabsMenu/index.js +25 -26
  220. package/esm/TabsPanels/Panel/index.js +6 -4
  221. package/esm/TabsPanels/index.js +13 -10
  222. package/esm/TextArea/index.d.ts +1 -1
  223. package/esm/TextArea/index.js +31 -20
  224. package/esm/Theme/breakpoints.js +5 -11
  225. package/esm/Theme/colors/theme_buenos_aires.js +14 -14
  226. package/esm/Theme/colors/theme_jaipur.js +14 -14
  227. package/esm/Theme/global.css +0 -1
  228. package/esm/Theme/index.js +1 -1
  229. package/esm/TimeSelect/Label/index.js +11 -13
  230. package/esm/TimeSelect/helpers.js +22 -37
  231. package/esm/TimeSelect/index.js +32 -38
  232. package/esm/Tooltip/index.js +36 -41
  233. package/esm/Typography/Typography.module.css +1365 -0
  234. package/esm/Typography/index.js +24 -12
  235. package/esm/Typography/index.props.d.ts +13 -1
  236. package/esm/base/BaseInput/index.js +10 -8
  237. package/esm/base/FormField/index.d.ts +1 -1
  238. package/esm/base/FormField/index.js +27 -21
  239. package/esm/base/FormField/index.props.d.ts +4 -0
  240. package/esm/base/InputRoot/index.js +27 -26
  241. package/esm/helpers/date/index.js +4 -8
  242. package/esm/hooks/useMediaSizes/index.js +9 -15
  243. package/esm/hooks/useModalStack/index.js +6 -9
  244. package/esm/hooks/useOnClickOutside/index.js +6 -6
  245. package/esm/hooks/useScrollLock/index.js +10 -9
  246. package/esm/hooks/useTrapFocus/index.js +8 -10
  247. package/esm/index.d.ts +1 -1
  248. package/esm/lib/keyboard.js +2 -4
  249. package/helpers/date/index.js +21 -32
  250. package/hooks/useMediaSizes/index.js +9 -15
  251. package/hooks/useModalStack/index.js +6 -9
  252. package/hooks/useOnClickOutside/index.js +6 -6
  253. package/hooks/useScrollLock/index.js +10 -9
  254. package/hooks/useTrapFocus/index.js +8 -10
  255. package/index.d.ts +1 -1
  256. package/lib/keyboard.js +2 -4
  257. package/package.json +5 -1
@@ -1,6 +1,5 @@
1
1
  'use strict';
2
2
 
3
- var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
4
3
  var tslib = require('tslib');
5
4
  var React = require('react');
6
5
  require('../Icons/index.js');
@@ -9,81 +8,69 @@ var Edit = require('../Icons/Edit.js');
9
8
 
10
9
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
11
10
 
12
- var _slicedToArray__default = /*#__PURE__*/_interopDefault(_slicedToArray);
13
11
  var React__default = /*#__PURE__*/_interopDefault(React);
14
12
  var styles__default = /*#__PURE__*/_interopDefault(styles);
15
13
 
16
- var placeCaretAtEnd = function placeCaretAtEnd(element) {
17
- var selection = window.getSelection();
14
+ const placeCaretAtEnd = element => {
15
+ const selection = window.getSelection();
18
16
  if (!selection) return;
19
- var range = document.createRange();
17
+ const range = document.createRange();
20
18
  range.selectNodeContents(element);
21
19
  range.collapse(false);
22
20
  selection.removeAllRanges();
23
21
  selection.addRange(range);
24
22
  };
25
- var insertTextAtSelection = function insertTextAtSelection(element, text) {
26
- var selection = window.getSelection();
23
+ const insertTextAtSelection = (element, text) => {
24
+ const selection = window.getSelection();
27
25
  if (!selection || selection.rangeCount === 0) {
28
26
  element.append(document.createTextNode(text));
29
27
  placeCaretAtEnd(element);
30
28
  return;
31
29
  }
32
- var range = selection.getRangeAt(0);
30
+ const range = selection.getRangeAt(0);
33
31
  range.deleteContents();
34
- var node = document.createTextNode(text);
32
+ const node = document.createTextNode(text);
35
33
  range.insertNode(node);
36
34
  range.setStartAfter(node);
37
35
  range.collapse(true);
38
36
  selection.removeAllRanges();
39
37
  selection.addRange(range);
40
38
  };
41
- var Editable = /*#__PURE__*/React.forwardRef(function EditableComponent(_a, forwardedRef) {
42
- var value = _a.value,
43
- _a$textComponent = _a.textComponent,
44
- TextComponent = _a$textComponent === void 0 ? "span" : _a$textComponent,
45
- _a$icon = _a.icon,
46
- icon = _a$icon === void 0 ? /*#__PURE__*/React__default.default.createElement(Edit.Edit, {
47
- className: styles__default.default.default_icon,
48
- "aria-hidden": "true"
49
- }) : _a$icon,
50
- _a$placeholder = _a.placeholder,
51
- placeholder = _a$placeholder === void 0 ? "" : _a$placeholder,
52
- maxLength = _a.maxLength,
53
- name = _a.name,
54
- _a$disabled = _a.disabled,
55
- disabled = _a$disabled === void 0 ? false : _a$disabled,
56
- _a$spellCheck = _a.spellCheck,
57
- spellCheck = _a$spellCheck === void 0 ? false : _a$spellCheck,
58
- className = _a.className,
59
- onChange = _a.onChange,
60
- onBlur = _a.onBlur,
61
- onPaste = _a.onPaste,
39
+ const Editable = /*#__PURE__*/React.forwardRef(function EditableComponent(_a, forwardedRef) {
40
+ var {
41
+ value,
42
+ textComponent: TextComponent = "span",
43
+ icon = /*#__PURE__*/React__default.default.createElement(Edit.Edit, {
44
+ className: styles__default.default.default_icon,
45
+ "aria-hidden": "true"
46
+ }),
47
+ placeholder = "",
48
+ maxLength,
49
+ name,
50
+ disabled = false,
51
+ spellCheck = false,
52
+ className,
53
+ onChange,
54
+ onBlur,
55
+ onPaste
56
+ } = _a,
62
57
  rest = tslib.__rest(_a, ["value", "textComponent", "icon", "placeholder", "maxLength", "name", "disabled", "spellCheck", "className", "onChange", "onBlur", "onPaste"]);
63
- var editorRef = React.useRef(null);
64
- var _useState = React.useState(value !== null && value !== void 0 ? value : ""),
65
- _useState2 = _slicedToArray__default.default(_useState, 2),
66
- currentValue = _useState2[0],
67
- setCurrentValue = _useState2[1];
68
- var _useState3 = React.useState(false),
69
- _useState4 = _slicedToArray__default.default(_useState3, 2),
70
- isEditing = _useState4[0],
71
- setIsEditing = _useState4[1];
72
- var lastValidValue = React.useRef(value !== null && value !== void 0 ? value : "");
73
- React.useImperativeHandle(forwardedRef, function () {
74
- return editorRef.current;
75
- }, []);
76
- React.useEffect(function () {
58
+ const editorRef = React.useRef(null);
59
+ const [currentValue, setCurrentValue] = React.useState(value !== null && value !== void 0 ? value : "");
60
+ const [isEditing, setIsEditing] = React.useState(false);
61
+ const lastValidValue = React.useRef(value !== null && value !== void 0 ? value : "");
62
+ React.useImperativeHandle(forwardedRef, () => editorRef.current, []);
63
+ React.useEffect(() => {
77
64
  if (value === undefined || value === lastValidValue.current) return;
78
65
  lastValidValue.current = value;
79
66
  setCurrentValue(value);
80
67
  if (editorRef.current) editorRef.current.textContent = value;
81
68
  }, [value]);
82
- var commitInput = React.useCallback(function (event) {
69
+ const commitInput = React.useCallback(event => {
83
70
  var _a;
84
- var editor = editorRef.current;
71
+ const editor = editorRef.current;
85
72
  if (!editor) return;
86
- var nextValue = (_a = editor.textContent) !== null && _a !== void 0 ? _a : "";
73
+ const nextValue = (_a = editor.textContent) !== null && _a !== void 0 ? _a : "";
87
74
  if (maxLength !== undefined && nextValue.length > maxLength) {
88
75
  editor.textContent = lastValidValue.current;
89
76
  placeCaretAtEnd(editor);
@@ -93,39 +80,39 @@ var Editable = /*#__PURE__*/React.forwardRef(function EditableComponent(_a, forw
93
80
  setCurrentValue(nextValue);
94
81
  onChange === null || onChange === void 0 ? void 0 : onChange(event, nextValue);
95
82
  }, [maxLength, onChange]);
96
- var handleFocus = function handleFocus(event) {
83
+ const handleFocus = event => {
97
84
  setIsEditing(true);
98
- var selection = window.getSelection();
99
- var range = document.createRange();
85
+ const selection = window.getSelection();
86
+ const range = document.createRange();
100
87
  range.selectNodeContents(event.currentTarget);
101
88
  selection === null || selection === void 0 ? void 0 : selection.removeAllRanges();
102
89
  selection === null || selection === void 0 ? void 0 : selection.addRange(range);
103
90
  };
104
- var handleBlur = function handleBlur(event) {
91
+ const handleBlur = event => {
105
92
  var _a;
106
93
  setIsEditing(false);
107
94
  (_a = window.getSelection()) === null || _a === void 0 ? void 0 : _a.removeAllRanges();
108
95
  if (event.currentTarget.innerHTML === "<br>") event.currentTarget.innerHTML = "";
109
96
  onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
110
97
  };
111
- var handleKeyDown = function handleKeyDown(event) {
98
+ const handleKeyDown = event => {
112
99
  if (event.key === "Enter") event.preventDefault();
113
100
  if (event.key === "Enter" || event.key === "Escape") event.currentTarget.blur();
114
101
  };
115
- var handlePaste = function handlePaste(event) {
102
+ const handlePaste = event => {
116
103
  var _a, _b;
117
104
  event.preventDefault();
118
- var text = event.clipboardData.getData("text/plain").replace(/[\r\n]+/g, " ");
105
+ let text = event.clipboardData.getData("text/plain").replace(/[\r\n]+/g, " ");
119
106
  if (maxLength !== undefined) {
120
- var selectionLength = (_b = (_a = window.getSelection()) === null || _a === void 0 ? void 0 : _a.toString().length) !== null && _b !== void 0 ? _b : 0;
121
- var available = Math.max(0, maxLength - currentValue.length + selectionLength);
107
+ const selectionLength = (_b = (_a = window.getSelection()) === null || _a === void 0 ? void 0 : _a.toString().length) !== null && _b !== void 0 ? _b : 0;
108
+ const available = Math.max(0, maxLength - currentValue.length + selectionLength);
122
109
  text = text.slice(0, available);
123
110
  }
124
111
  insertTextAtSelection(event.currentTarget, text);
125
112
  commitInput(event);
126
113
  onPaste === null || onPaste === void 0 ? void 0 : onPaste(event);
127
114
  };
128
- var focusEditor = function focusEditor() {
115
+ const focusEditor = () => {
129
116
  var _a;
130
117
  if (!disabled) (_a = editorRef.current) === null || _a === void 0 ? void 0 : _a.focus();
131
118
  };
@@ -1,27 +1,25 @@
1
1
  'use strict';
2
2
 
3
- var _defineProperty = require('@babel/runtime/helpers/defineProperty');
4
3
  var React = require('react');
5
4
  var clsx = require('clsx');
6
5
  var styles = require('./Grid-Item.module.css');
7
6
 
8
7
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
9
8
 
10
- var _defineProperty__default = /*#__PURE__*/_interopDefault(_defineProperty);
11
9
  var React__default = /*#__PURE__*/_interopDefault(React);
12
10
  var clsx__default = /*#__PURE__*/_interopDefault(clsx);
13
11
  var styles__default = /*#__PURE__*/_interopDefault(styles);
14
12
 
15
- var GridItem = function GridItem(_ref) {
16
- var children = _ref.children,
17
- _ref$fullWidth = _ref.fullWidth,
18
- fullWidth = _ref$fullWidth === void 0 ? false : _ref$fullWidth,
19
- className = _ref.className,
20
- style = _ref.style;
21
- return /*#__PURE__*/React__default.default.createElement("div", {
22
- className: clsx__default.default(styles__default.default.item, _defineProperty__default.default({}, styles__default.default.full, Boolean(fullWidth)), className),
23
- style: style
24
- }, children);
25
- };
13
+ const GridItem = ({
14
+ children,
15
+ fullWidth = false,
16
+ className,
17
+ style
18
+ }) => (/*#__PURE__*/React__default.default.createElement("div", {
19
+ className: clsx__default.default(styles__default.default.item, {
20
+ [styles__default.default.full]: Boolean(fullWidth)
21
+ }, className),
22
+ style: style
23
+ }, children));
26
24
 
27
25
  exports.GridItem = GridItem;
package/Grid/index.js CHANGED
@@ -10,26 +10,20 @@ var React__default = /*#__PURE__*/_interopDefault(React);
10
10
  var clsx__default = /*#__PURE__*/_interopDefault(clsx);
11
11
  var styles__default = /*#__PURE__*/_interopDefault(styles);
12
12
 
13
- var toRemLength = function toRemLength(value) {
14
- return typeof value === "number" ? "".concat(value / 16, "rem") : value;
15
- };
16
- var Grid = function Grid(_ref) {
17
- var children = _ref.children,
18
- _ref$gridRowGap = _ref.gridRowGap,
19
- gridRowGap = _ref$gridRowGap === void 0 ? "6" : _ref$gridRowGap,
20
- _ref$gridColumnGap = _ref.gridColumnGap,
21
- gridColumnGap = _ref$gridColumnGap === void 0 ? "4" : _ref$gridColumnGap,
22
- _ref$gridItemMinWidth = _ref.gridItemMinWidth,
23
- gridItemMinWidth = _ref$gridItemMinWidth === void 0 ? "var(--component-grid-item-min-width)" : _ref$gridItemMinWidth,
24
- className = _ref.className;
25
- return /*#__PURE__*/React__default.default.createElement("div", {
26
- className: clsx__default.default(styles__default.default.root, className),
27
- style: {
28
- rowGap: "var(--space-".concat(gridRowGap, ")"),
29
- columnGap: "var(--space-".concat(gridColumnGap, ")"),
30
- gridTemplateColumns: "repeat(auto-fill, minmax(".concat(toRemLength(gridItemMinWidth), ", 1fr))")
31
- }
32
- }, children);
33
- };
13
+ const toRemLength = value => typeof value === "number" ? `${value / 16}rem` : value;
14
+ const Grid = ({
15
+ children,
16
+ gridRowGap = "6",
17
+ gridColumnGap = "4",
18
+ gridItemMinWidth = "var(--component-grid-item-min-width)",
19
+ className
20
+ }) => (/*#__PURE__*/React__default.default.createElement("div", {
21
+ className: clsx__default.default(styles__default.default.root, className),
22
+ style: {
23
+ rowGap: `var(--space-${gridRowGap})`,
24
+ columnGap: `var(--space-${gridColumnGap})`,
25
+ gridTemplateColumns: `repeat(auto-fill, minmax(${toRemLength(gridItemMinWidth)}, 1fr))`
26
+ }
27
+ }, children));
34
28
 
35
29
  exports.Grid = Grid;
@@ -7,14 +7,13 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var ArrowNext = function ArrowNext(_a) {
11
- var _a$fill = _a.fill,
12
- fill = _a$fill === void 0 ? "currentColor" : _a$fill,
13
- _a$width = _a.width,
14
- width = _a$width === void 0 ? 10 : _a$width,
15
- _a$height = _a.height,
16
- height = _a$height === void 0 ? 16 : _a$height,
17
- ref = _a.ref,
10
+ const ArrowNext = _a => {
11
+ var {
12
+ fill = "currentColor",
13
+ width = 10,
14
+ height = 16,
15
+ ref
16
+ } = _a,
18
17
  props = tslib.__rest(_a, ["fill", "width", "height", "ref"]);
19
18
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
20
19
  ref: ref,
package/Icons/Cart.js CHANGED
@@ -7,14 +7,13 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var Cart = function Cart(_a) {
11
- var _a$fill = _a.fill,
12
- fill = _a$fill === void 0 ? "currentColor" : _a$fill,
13
- _a$width = _a.width,
14
- width = _a$width === void 0 ? 24 : _a$width,
15
- _a$height = _a.height,
16
- height = _a$height === void 0 ? 24 : _a$height,
17
- ref = _a.ref,
10
+ const Cart = _a => {
11
+ var {
12
+ fill = "currentColor",
13
+ width = 24,
14
+ height = 24,
15
+ ref
16
+ } = _a,
18
17
  props = tslib.__rest(_a, ["fill", "width", "height", "ref"]);
19
18
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
20
19
  xmlns: "http://www.w3.org/2000/svg",
package/Icons/Check.js CHANGED
@@ -7,14 +7,13 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var Check = function Check(_a) {
11
- var _a$fill = _a.fill,
12
- fill = _a$fill === void 0 ? "currentColor" : _a$fill,
13
- _a$width = _a.width,
14
- width = _a$width === void 0 ? 24 : _a$width,
15
- _a$height = _a.height,
16
- height = _a$height === void 0 ? 24 : _a$height,
17
- ref = _a.ref,
10
+ const Check = _a => {
11
+ var {
12
+ fill = "currentColor",
13
+ width = 24,
14
+ height = 24,
15
+ ref
16
+ } = _a,
18
17
  props = tslib.__rest(_a, ["fill", "width", "height", "ref"]);
19
18
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
20
19
  xmlns: "http://www.w3.org/2000/svg",
package/Icons/Chevron.js CHANGED
@@ -7,14 +7,13 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var Chevron = function Chevron(_a) {
11
- var _a$fill = _a.fill,
12
- fill = _a$fill === void 0 ? "currentColor" : _a$fill,
13
- _a$width = _a.width,
14
- width = _a$width === void 0 ? 24 : _a$width,
15
- _a$height = _a.height,
16
- height = _a$height === void 0 ? 24 : _a$height,
17
- ref = _a.ref,
10
+ const Chevron = _a => {
11
+ var {
12
+ fill = "currentColor",
13
+ width = 24,
14
+ height = 24,
15
+ ref
16
+ } = _a,
18
17
  props = tslib.__rest(_a, ["fill", "width", "height", "ref"]);
19
18
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
20
19
  xmlns: "http://www.w3.org/2000/svg",
package/Icons/Close.js CHANGED
@@ -7,12 +7,12 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var Close = function Close(_a) {
11
- var _a$width = _a.width,
12
- width = _a$width === void 0 ? 24 : _a$width,
13
- _a$height = _a.height,
14
- height = _a$height === void 0 ? 24 : _a$height,
15
- ref = _a.ref,
10
+ const Close = _a => {
11
+ var {
12
+ width = 24,
13
+ height = 24,
14
+ ref
15
+ } = _a,
16
16
  props = tslib.__rest(_a, ["width", "height", "ref"]);
17
17
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
18
18
  xmlns: "http://www.w3.org/2000/svg",
package/Icons/Copy.js CHANGED
@@ -7,14 +7,13 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var Copy = function Copy(_a) {
11
- var _a$fill = _a.fill,
12
- fill = _a$fill === void 0 ? "currentColor" : _a$fill,
13
- _a$width = _a.width,
14
- width = _a$width === void 0 ? 24 : _a$width,
15
- _a$height = _a.height,
16
- height = _a$height === void 0 ? 24 : _a$height,
17
- ref = _a.ref,
10
+ const Copy = _a => {
11
+ var {
12
+ fill = "currentColor",
13
+ width = 24,
14
+ height = 24,
15
+ ref
16
+ } = _a,
18
17
  props = tslib.__rest(_a, ["fill", "width", "height", "ref"]);
19
18
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
20
19
  xmlns: "http://www.w3.org/2000/svg",
package/Icons/Cross.js CHANGED
@@ -7,12 +7,12 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var Cross = function Cross(_a) {
11
- var _a$width = _a.width,
12
- width = _a$width === void 0 ? 24 : _a$width,
13
- _a$height = _a.height,
14
- height = _a$height === void 0 ? 24 : _a$height,
15
- ref = _a.ref,
10
+ const Cross = _a => {
11
+ var {
12
+ width = 24,
13
+ height = 24,
14
+ ref
15
+ } = _a,
16
16
  props = tslib.__rest(_a, ["width", "height", "ref"]);
17
17
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
18
18
  xmlns: "http://www.w3.org/2000/svg",
@@ -7,14 +7,13 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var CrossFill = function CrossFill(_a) {
11
- var _a$fill = _a.fill,
12
- fill = _a$fill === void 0 ? "currentColor" : _a$fill,
13
- _a$width = _a.width,
14
- width = _a$width === void 0 ? 24 : _a$width,
15
- _a$height = _a.height,
16
- height = _a$height === void 0 ? 24 : _a$height,
17
- ref = _a.ref,
10
+ const CrossFill = _a => {
11
+ var {
12
+ fill = "currentColor",
13
+ width = 24,
14
+ height = 24,
15
+ ref
16
+ } = _a,
18
17
  props = tslib.__rest(_a, ["fill", "width", "height", "ref"]);
19
18
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
20
19
  xmlns: "http://www.w3.org/2000/svg",
package/Icons/Edit.js CHANGED
@@ -7,14 +7,13 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var Edit = function Edit(_a) {
11
- var _a$fill = _a.fill,
12
- fill = _a$fill === void 0 ? "currentColor" : _a$fill,
13
- _a$width = _a.width,
14
- width = _a$width === void 0 ? 24 : _a$width,
15
- _a$height = _a.height,
16
- height = _a$height === void 0 ? 24 : _a$height,
17
- ref = _a.ref,
10
+ const Edit = _a => {
11
+ var {
12
+ fill = "currentColor",
13
+ width = 24,
14
+ height = 24,
15
+ ref
16
+ } = _a,
18
17
  props = tslib.__rest(_a, ["fill", "width", "height", "ref"]);
19
18
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
20
19
  xmlns: "http://www.w3.org/2000/svg",
package/Icons/Exit.js CHANGED
@@ -7,14 +7,13 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var Exit = function Exit(_a) {
11
- var _a$fill = _a.fill,
12
- fill = _a$fill === void 0 ? "currentColor" : _a$fill,
13
- _a$width = _a.width,
14
- width = _a$width === void 0 ? 24 : _a$width,
15
- _a$height = _a.height,
16
- height = _a$height === void 0 ? 24 : _a$height,
17
- ref = _a.ref,
10
+ const Exit = _a => {
11
+ var {
12
+ fill = "currentColor",
13
+ width = 24,
14
+ height = 24,
15
+ ref
16
+ } = _a,
18
17
  props = tslib.__rest(_a, ["fill", "width", "height", "ref"]);
19
18
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
20
19
  xmlns: "http://www.w3.org/2000/svg",
@@ -7,14 +7,13 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var EyeClosed = function EyeClosed(_a) {
11
- var _a$fill = _a.fill,
12
- fill = _a$fill === void 0 ? "currentColor" : _a$fill,
13
- _a$width = _a.width,
14
- width = _a$width === void 0 ? 24 : _a$width,
15
- _a$height = _a.height,
16
- height = _a$height === void 0 ? 24 : _a$height,
17
- ref = _a.ref,
10
+ const EyeClosed = _a => {
11
+ var {
12
+ fill = "currentColor",
13
+ width = 24,
14
+ height = 24,
15
+ ref
16
+ } = _a,
18
17
  props = tslib.__rest(_a, ["fill", "width", "height", "ref"]);
19
18
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
20
19
  xmlns: "http://www.w3.org/2000/svg",
package/Icons/EyeOpen.js CHANGED
@@ -7,14 +7,13 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var EyeOpen = function EyeOpen(_a) {
11
- var _a$fill = _a.fill,
12
- fill = _a$fill === void 0 ? "currentColor" : _a$fill,
13
- _a$width = _a.width,
14
- width = _a$width === void 0 ? 24 : _a$width,
15
- _a$height = _a.height,
16
- height = _a$height === void 0 ? 24 : _a$height,
17
- ref = _a.ref,
10
+ const EyeOpen = _a => {
11
+ var {
12
+ fill = "currentColor",
13
+ width = 24,
14
+ height = 24,
15
+ ref
16
+ } = _a,
18
17
  props = tslib.__rest(_a, ["fill", "width", "height", "ref"]);
19
18
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
20
19
  xmlns: "http://www.w3.org/2000/svg",
package/Icons/Help.js CHANGED
@@ -7,12 +7,12 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var Help = function Help(_a) {
11
- var _a$width = _a.width,
12
- width = _a$width === void 0 ? 24 : _a$width,
13
- _a$height = _a.height,
14
- height = _a$height === void 0 ? 24 : _a$height,
15
- ref = _a.ref,
10
+ const Help = _a => {
11
+ var {
12
+ width = 24,
13
+ height = 24,
14
+ ref
15
+ } = _a,
16
16
  props = tslib.__rest(_a, ["width", "height", "ref"]);
17
17
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
18
18
  xmlns: "http://www.w3.org/2000/svg",
package/Icons/Info.js CHANGED
@@ -7,14 +7,13 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var Info = function Info(_a) {
11
- var _a$fill = _a.fill,
12
- fill = _a$fill === void 0 ? "currentColor" : _a$fill,
13
- _a$width = _a.width,
14
- width = _a$width === void 0 ? 24 : _a$width,
15
- _a$height = _a.height,
16
- height = _a$height === void 0 ? 24 : _a$height,
17
- ref = _a.ref,
10
+ const Info = _a => {
11
+ var {
12
+ fill = "currentColor",
13
+ width = 24,
14
+ height = 24,
15
+ ref
16
+ } = _a,
18
17
  props = tslib.__rest(_a, ["fill", "width", "height", "ref"]);
19
18
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
20
19
  width: width,
package/Icons/Minus.js CHANGED
@@ -7,14 +7,13 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var Minus = function Minus(_a) {
11
- var _a$fill = _a.fill,
12
- fill = _a$fill === void 0 ? "currentColor" : _a$fill,
13
- _a$width = _a.width,
14
- width = _a$width === void 0 ? 24 : _a$width,
15
- _a$height = _a.height,
16
- height = _a$height === void 0 ? 24 : _a$height,
17
- ref = _a.ref,
10
+ const Minus = _a => {
11
+ var {
12
+ fill = "currentColor",
13
+ width = 24,
14
+ height = 24,
15
+ ref
16
+ } = _a,
18
17
  props = tslib.__rest(_a, ["fill", "width", "height", "ref"]);
19
18
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
20
19
  width: width,
package/Icons/More.js CHANGED
@@ -7,14 +7,13 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var More = function More(_a) {
11
- var _a$fill = _a.fill,
12
- fill = _a$fill === void 0 ? "currentColor" : _a$fill,
13
- _a$width = _a.width,
14
- width = _a$width === void 0 ? 24 : _a$width,
15
- _a$height = _a.height,
16
- height = _a$height === void 0 ? 24 : _a$height,
17
- ref = _a.ref,
10
+ const More = _a => {
11
+ var {
12
+ fill = "currentColor",
13
+ width = 24,
14
+ height = 24,
15
+ ref
16
+ } = _a,
18
17
  props = tslib.__rest(_a, ["fill", "width", "height", "ref"]);
19
18
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
20
19
  xmlns: "http://www.w3.org/2000/svg",
package/Icons/Plus.js CHANGED
@@ -7,14 +7,13 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
7
 
8
8
  var React__default = /*#__PURE__*/_interopDefault(React);
9
9
 
10
- var Plus = function Plus(_a) {
11
- var _a$fill = _a.fill,
12
- fill = _a$fill === void 0 ? "currentColor" : _a$fill,
13
- _a$width = _a.width,
14
- width = _a$width === void 0 ? 18 : _a$width,
15
- _a$height = _a.height,
16
- height = _a$height === void 0 ? 18 : _a$height,
17
- ref = _a.ref,
10
+ const Plus = _a => {
11
+ var {
12
+ fill = "currentColor",
13
+ width = 18,
14
+ height = 18,
15
+ ref
16
+ } = _a,
18
17
  props = tslib.__rest(_a, ["fill", "width", "height", "ref"]);
19
18
  return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
20
19
  xmlns: "http://www.w3.org/2000/svg",