@cashub/ui 0.5.0 → 0.6.1

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 (88) hide show
  1. package/Tab/TabList.js +1 -1
  2. package/Tab/TabPanel.js +3 -3
  3. package/animate/Collapse.js +1 -1
  4. package/animate/NumberCounter.js +1 -1
  5. package/backdrop/index.js +31 -0
  6. package/badge/BadgeFill.js +3 -3
  7. package/billing/BarChart.js +3 -3
  8. package/billing/Grid.js +10 -10
  9. package/breadcrumb/Breadcrumb.js +11 -6
  10. package/button/IconButton.js +1 -1
  11. package/chart/BarChart.js +4 -4
  12. package/chart/DoughnutChart.js +1 -1
  13. package/chart/LineChart.js +6 -6
  14. package/chart/SingleBarChart.js +2 -2
  15. package/cropper/Cropper.js +1 -1
  16. package/datetimePicker/Accordion.js +13 -13
  17. package/datetimePicker/CustomTimeInput.js +9 -9
  18. package/datetimePicker/DatePicker.js +24 -12
  19. package/datetimePicker/DatePickerV2.js +95 -71
  20. package/datetimePicker/DatetimePicker.js +6 -6
  21. package/datetimePicker/DatetimePickerV2.js +94 -54
  22. package/datetimePicker/TimePicker.js +15 -15
  23. package/datetimePicker/accordion/Month.js +20 -18
  24. package/datetimePicker/accordion/Year.js +7 -7
  25. package/datetimePicker/hooks/useChangeNumber.js +1 -1
  26. package/datetimePicker/hooks/useDecrease.js +1 -1
  27. package/datetimePicker/hooks/useIncrease.js +1 -1
  28. package/datetimePicker/utils/GMTDate.js +23 -0
  29. package/divider/Divider.js +4 -1
  30. package/dropdown/DropdownContent.js +1 -1
  31. package/dropdown/DropdownItem.js +2 -2
  32. package/dropzone/FileDropzone.js +24 -24
  33. package/dropzone/ImageDropzone.js +33 -33
  34. package/form/Label.js +1 -1
  35. package/form/Searchbox.js +4 -4
  36. package/geolocation/MapInteractor.js +4 -4
  37. package/heading/Heading1.js +2 -2
  38. package/heading/Heading2.js +3 -3
  39. package/heading/Heading3.js +10 -7
  40. package/icon/IconFigure.js +2 -2
  41. package/iconbox/ApplicationIconBox.js +8 -8
  42. package/iconbox/IconBoxFigure.js +6 -6
  43. package/iconbox/IconBoxImage.js +2 -2
  44. package/iconbox/IconBoxV2.js +4 -4
  45. package/image/UploadImage.js +2 -2
  46. package/index.js +13 -0
  47. package/jsoneditor/JsonEditor.js +1 -1
  48. package/layout/Backdrop.js +1 -1
  49. package/layout/MenuIcon.js +1 -1
  50. package/link/LinkSpan.js +4 -4
  51. package/map/LeafletMap.js +4 -4
  52. package/modal/StateModal.js +2 -2
  53. package/modal/TitleModal.js +4 -4
  54. package/package.json +1 -1
  55. package/paginate/Paginate.js +1 -1
  56. package/popover/Popover.js +3 -3
  57. package/ribbon/Ribbon.js +1 -1
  58. package/section/Section.js +27 -24
  59. package/section/SectionBody.js +1 -1
  60. package/section/SectionHeader.js +3 -3
  61. package/select/SearchBox.js +2 -2
  62. package/select/Select.js +59 -54
  63. package/table/Logo.js +1 -1
  64. package/table/PermissionTable.js +5 -5
  65. package/table/Table.js +31 -31
  66. package/table/TableHeadCell.js +3 -3
  67. package/table/hooks/useLimitChange.js +3 -3
  68. package/table/hooks/usePageChange.js +3 -3
  69. package/table/hooks/useSortChange.js +1 -1
  70. package/text/Paragraph.js +8 -5
  71. package/timeline/Timeline.js +4 -4
  72. package/toast/CustomToastContainer.js +1 -1
  73. package/tooltip/Tooltip.js +7 -7
  74. package/utils/array/generateRange.js +2 -2
  75. package/utils/chart/customTooltip.js +18 -18
  76. package/utils/chart/padEmptyChartBar.js +8 -8
  77. package/utils/dataURLtoFile.js +23 -6
  78. package/utils/format/datetimeFormat.js +7 -8
  79. package/utils/format/formatDate.js +7 -7
  80. package/utils/format/formatSize.js +1 -1
  81. package/utils/getBase64.js +2 -5
  82. package/utils/hooks/useCustomPopper.js +3 -4
  83. package/utils/image/resize.js +7 -7
  84. package/utils/react/setRef.js +1 -1
  85. package/wizard/Wizard.js +5 -12
  86. package/module/geolocation/api.js +0 -51
  87. package/module/message/index.js +0 -59
  88. package/services/api/index.js +0 -73
package/select/Select.js CHANGED
@@ -225,16 +225,15 @@ var Select = function Select(_ref) {
225
225
 
226
226
  return nextItem;
227
227
  }, [dropdownElement]);
228
- var handleOnSelect = (0, _react.useCallback)(function (e, value) {
229
- e.stopPropagation();
230
- if (disabled === true) return; //禁按就跳出
231
-
228
+ var handleOnSelect = (0, _react.useCallback)(function (event, value) {
229
+ event.stopPropagation();
230
+ if (disabled === true) return;
232
231
  onSelect(value);
233
232
  setSearch('');
234
233
  setDisplay(false);
235
234
  }, [disabled, onSelect]);
236
- var handleOnDeselect = (0, _react.useCallback)(function (e, value) {
237
- e.stopPropagation();
235
+ var handleOnDeselect = (0, _react.useCallback)(function (event, value) {
236
+ event.stopPropagation();
238
237
  if (disabled === true) return;
239
238
  onDeselect(value);
240
239
  }, [disabled, onDeselect]); // list all selected option
@@ -245,19 +244,19 @@ var Select = function Select(_ref) {
245
244
  return selectedOptions.map(function (value) {
246
245
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectedMultiple.default, {
247
246
  content: value.text,
248
- onClick: function onClick(e) {
249
- return handleOnDeselect(e, value.id);
247
+ onClick: function onClick(event) {
248
+ return handleOnDeselect(event, value.id);
250
249
  }
251
250
  }, value.id);
252
251
  });
253
- } else {
254
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectedSingle.default, {
255
- children: selectedOptions[0].text
256
- });
257
252
  }
258
- } else {
259
- return placeholder;
253
+
254
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectedSingle.default, {
255
+ children: selectedOptions[0].text
256
+ });
260
257
  }
258
+
259
+ return placeholder;
261
260
  }, [placeholder, handleOnDeselect, multiple, selectedOptions]);
262
261
  var optionItem = (0, _react.useMemo)(function () {
263
262
  if (optionList.length <= 0) return null;
@@ -274,8 +273,8 @@ var Select = function Select(_ref) {
274
273
  role: "option",
275
274
  tabIndex: "0",
276
275
  id: option.id,
277
- onClick: function onClick(e) {
278
- return handleOnSelect(e, option.id);
276
+ onClick: function onClick(event) {
277
+ return handleOnSelect(event, option.id);
279
278
  },
280
279
  focus: focusedOption && focusedOption.id === option.id.toString(),
281
280
  selected: option.selected,
@@ -290,8 +289,8 @@ var Select = function Select(_ref) {
290
289
  role: "option",
291
290
  tabIndex: "0",
292
291
  id: option.id,
293
- onClick: function onClick(e) {
294
- return handleOnSelect(e, option.id);
292
+ onClick: function onClick(event) {
293
+ return handleOnSelect(event, option.id);
295
294
  },
296
295
  focus: focusedOption && focusedOption.id === option.id.toString(),
297
296
  selected: option.selected,
@@ -336,40 +335,46 @@ var Select = function Select(_ref) {
336
335
  break;
337
336
 
338
337
  case _keycode.default.UP:
339
- if (!focusedOption) {
340
- return;
341
- }
338
+ {
339
+ if (!focusedOption) {
340
+ return;
341
+ }
342
342
 
343
- var previousItem = findPreviousItem(focusedOption);
343
+ var previousItem = findPreviousItem(focusedOption);
344
344
 
345
- if (previousItem) {
346
- handleFocusItem(previousItem);
347
- }
345
+ if (previousItem) {
346
+ handleFocusItem(previousItem);
347
+ }
348
348
 
349
- break;
349
+ break;
350
+ }
350
351
 
351
352
  case _keycode.default.DOWN:
352
- if (!focusedOption) {
353
- return;
354
- }
353
+ {
354
+ if (!focusedOption) {
355
+ return;
356
+ }
355
357
 
356
- var nextItem = findNextItem(focusedOption);
358
+ var nextItem = findNextItem(focusedOption);
357
359
 
358
- if (nextItem) {
359
- handleFocusItem(nextItem);
360
- }
360
+ if (nextItem) {
361
+ handleFocusItem(nextItem);
362
+ }
361
363
 
362
- break;
364
+ break;
365
+ }
363
366
 
364
367
  case _keycode.default.END:
365
- event.preventDefault();
366
- var itemList = dropdownElement.querySelectorAll('[role="option"]');
368
+ {
369
+ event.preventDefault();
370
+ var itemList = dropdownElement.querySelectorAll('[role="option"]');
367
371
 
368
- if (itemList.length) {
369
- handleFocusItem(itemList[itemList.length - 1]);
370
- }
372
+ if (itemList.length) {
373
+ handleFocusItem(itemList[itemList.length - 1]);
374
+ }
371
375
 
372
- break;
376
+ break;
377
+ }
373
378
 
374
379
  case _keycode.default.HOME:
375
380
  event.preventDefault();
@@ -400,8 +405,8 @@ var Select = function Select(_ref) {
400
405
  }; // handle search keyword change
401
406
 
402
407
 
403
- var handleSearchChange = function handleSearchChange(e) {
404
- setSearch(e.target.value);
408
+ var handleSearchChange = function handleSearchChange(event) {
409
+ setSearch(event.target.value);
405
410
  }; // determine selected option(s)
406
411
 
407
412
 
@@ -489,19 +494,19 @@ var Select = function Select(_ref) {
489
494
  });
490
495
  })
491
496
  });
492
- } else {
493
- var _selected = false;
497
+ }
494
498
 
495
- if (multiple && parsedSelected.includes(option.id.toString())) {
496
- _selected = true;
497
- } else if (parsedSelected === option.id.toString()) {
498
- _selected = true;
499
- }
499
+ var selected = false;
500
500
 
501
- return _objectSpread(_objectSpread({}, option), {}, {
502
- selected: _selected
503
- });
501
+ if (multiple && parsedSelected.includes(option.id.toString())) {
502
+ selected = true;
503
+ } else if (parsedSelected === option.id.toString()) {
504
+ selected = true;
504
505
  }
506
+
507
+ return _objectSpread(_objectSpread({}, option), {}, {
508
+ selected: selected
509
+ });
505
510
  }));
506
511
  }, [filteredOptions, multiple, parsedSelected]); // filter options on search keyword changed
507
512
 
@@ -589,7 +594,7 @@ var Select = function Select(_ref) {
589
594
  });
590
595
  };
591
596
 
592
- var Combobox = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n min-height: 36px;\n min-width: 160px;\n cursor: pointer;\n position: relative;\n background: transparent;\n color: var(--color-white);\n font-size: var(--font-body1);\n border: var(--border-width) solid var(--border-color);\n border-radius: var(--border-radius-l);\n padding: 0 calc(var(--spacing-s) * 2 + 8px) 0 var(--spacing-s);\n\n &:focus {\n ", ";\n }\n\n ", "\n\n ", ";\n\n ", ";\n\n ", "\n\n ", "\n\n ", "\n"])), function (_ref2) {
597
+ var Combobox = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n min-height: 36px;\n min-width: 160px;\n cursor: pointer;\n position: relative;\n background: transparent;\n color: var(--color-white);\n font-size: var(--font-body1);\n border: var(--border-width) solid var(--border-color);\n border-radius: var(--border-radius-l);\n padding: 0 calc(var(--spacing-s) * 2 + 8px) 0 var(--spacing-s);\n\n &:focus {\n ", ";\n }\n\n ", "\n\n ", "\n\n ", ";\n\n ", "\n\n ", "\n\n ", "\n"])), function (_ref2) {
593
598
  var disabled = _ref2.disabled;
594
599
  return !disabled && "\n border-color: var(--color-primary);\n outline: none;\n ";
595
600
  }, function (_ref3) {
@@ -597,7 +602,7 @@ var Combobox = _styledComponents.default.div(_templateObject || (_templateObject
597
602
  return $display && "\n border-color: var(--color-primary);\n outline: none;\n ";
598
603
  }, function (_ref4) {
599
604
  var disabled = _ref4.disabled;
600
- return disabled && "cursor: not-allowed;opacity: 0.5;";
605
+ return disabled && 'cursor: not-allowed;opacity: 0.5;';
601
606
  }, function (_ref5) {
602
607
  var fullWidth = _ref5.fullWidth;
603
608
  return fullWidth ? 'width: 100%' : 'max-width: 320px';
package/table/Logo.js CHANGED
@@ -33,7 +33,7 @@ var Logo = function Logo(_ref) {
33
33
 
34
34
  var Figure = _styledComponents.default.figure(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n width: 32px;\n height: 32px;\n border-radius: ", ";\n overflow: hidden;\n"])), function (_ref2) {
35
35
  var round = _ref2.round;
36
- return round ? "var(--border-radius-round)" : "var(--border-radius-s)";
36
+ return round ? 'var(--border-radius-round)' : 'var(--border-radius-s)';
37
37
  });
38
38
 
39
39
  var _default = Logo;
@@ -17,21 +17,21 @@ var PermissionTable = _styledComponents.default.table(_templateObject || (_templ
17
17
 
18
18
  var TH = _styledComponents.default.th(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n padding: var(--spacing) 0;\n border-bottom: 1px solid rgba(255, 255, 255, 0.2);\n font-weight: var(--font-bold);\n\n ", "\n ", "\n"])), function (_ref) {
19
19
  var clickable = _ref.clickable;
20
- return clickable && "cursor: pointer;";
20
+ return clickable && 'cursor: pointer;';
21
21
  }, function (_ref2) {
22
22
  var alignCenter = _ref2.alignCenter;
23
- return alignCenter && "text-align: center;";
23
+ return alignCenter && 'text-align: center;';
24
24
  });
25
25
 
26
26
  var TD = _styledComponents.default.td(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n padding: var(--spacing) 0;\n border-bottom: 1px solid rgba(255, 255, 255, 0.2);\n\n &:nth-child(even) {\n background: var(--color-background1);\n }\n\n ", "\n ", "\n ", "\n"])), function (_ref3) {
27
27
  var clickable = _ref3.clickable;
28
- return clickable && "cursor: pointer;";
28
+ return clickable && 'cursor: pointer;';
29
29
  }, function (_ref4) {
30
30
  var alignCenter = _ref4.alignCenter;
31
- return alignCenter && "text-align: center;";
31
+ return alignCenter && 'text-align: center;';
32
32
  }, function (_ref5) {
33
33
  var bold = _ref5.bold;
34
- return bold && "font-weight: var(--font-bold);";
34
+ return bold && 'font-weight: var(--font-bold);';
35
35
  });
36
36
 
37
37
  var _default = Object.assign(PermissionTable, {
package/table/Table.js CHANGED
@@ -96,8 +96,8 @@ var Table = function Table(_ref) {
96
96
 
97
97
  var texts = (0, _react.useMemo)(function () {
98
98
  var defaultTexts = {
99
- info: "Showing _START_ to _END_ of _TOTAL_ entries",
100
- empty: "No data available in table"
99
+ info: 'Showing _START_ to _END_ of _TOTAL_ entries',
100
+ empty: 'No data available in table'
101
101
  };
102
102
  return _objectSpread(_objectSpread({}, defaultTexts), translation);
103
103
  }, [translation]);
@@ -106,28 +106,28 @@ var Table = function Table(_ref) {
106
106
  onSortChange(columnName);
107
107
  }
108
108
  }, [onSortChange]);
109
- var handleRowClick = (0, _react.useCallback)(function (e, rowData) {
109
+ var handleRowClick = (0, _react.useCallback)(function (event, rowData) {
110
110
  if (onRowClick) {
111
- onRowClick(e, rowData);
111
+ onRowClick(event, rowData);
112
112
  }
113
113
  }, [onRowClick]);
114
- var showFullValue = (0, _react.useCallback)(function (e) {
115
- var id = e.target.id;
114
+ var showFullValue = (0, _react.useCallback)(function (event) {
115
+ var id = event.target.id;
116
116
 
117
117
  if (!id) {
118
- id = e.currentTarget.id;
119
- e.target.id = id;
118
+ id = event.currentTarget.id;
119
+ event.target.id = id;
120
120
  }
121
121
 
122
- var containerLength = e.target.offsetWidth;
123
- var textLength = e.target.scrollWidth;
122
+ var containerLength = event.target.offsetWidth;
123
+ var textLength = event.target.scrollWidth;
124
124
 
125
125
  if (textLength > containerLength) {
126
- e.stopPropagation();
126
+ event.stopPropagation();
127
127
  (0, _Popover.default)({
128
- target: e.target,
129
- content: e.target.innerText,
130
128
  id: id,
129
+ target: event.target,
130
+ content: event.target.innerText,
131
131
  boundary: tableRef.current
132
132
  });
133
133
  }
@@ -141,17 +141,17 @@ var Table = function Table(_ref) {
141
141
  var sortColumnIndex = sortColumn.indexOf(fieldName);
142
142
 
143
143
  if (sortColumnIndex !== -1) {
144
- if (sortType[sortColumnIndex] === "asc") {
144
+ if (sortType[sortColumnIndex] === 'asc') {
145
145
  isActiveAsc = true;
146
146
  }
147
147
 
148
- if (sortType[sortColumnIndex] === "desc") {
148
+ if (sortType[sortColumnIndex] === 'desc') {
149
149
  isActiveDesc = true;
150
150
  }
151
151
  }
152
- } else if (fieldName === sortColumn && sortType === "asc") {
152
+ } else if (fieldName === sortColumn && sortType === 'asc') {
153
153
  isActiveAsc = true;
154
- } else if (fieldName === sortColumn && sortType === "desc") {
154
+ } else if (fieldName === sortColumn && sortType === 'desc') {
155
155
  isActiveDesc = true;
156
156
  }
157
157
 
@@ -215,11 +215,11 @@ var Table = function Table(_ref) {
215
215
  var key = rowIndex + columnIndex.toString(); // 如果有matcher,比對當前 column 的 fieldName 是不是等於 matcher
216
216
 
217
217
  if (matcher && fieldName === matcher) {
218
- if (type === "single" && selected === row[fieldName]) {
218
+ if (type === 'single' && selected === row[fieldName]) {
219
219
  active = true;
220
220
  }
221
221
 
222
- if (type === "multiple" && selected.includes(row[fieldName])) {
222
+ if (type === 'multiple' && selected.includes(row[fieldName])) {
223
223
  active = true;
224
224
  }
225
225
  }
@@ -253,8 +253,8 @@ var Table = function Table(_ref) {
253
253
  active: active,
254
254
  primary: rowConfig.primary,
255
255
  backgroundReverse: backgroundReverse,
256
- onClick: function onClick(e) {
257
- handleRowClick(e, row);
256
+ onClick: function onClick(event) {
257
+ handleRowClick(event, row);
258
258
  },
259
259
  children: tds
260
260
  }, rowIndex);
@@ -301,7 +301,7 @@ var Table = function Table(_ref) {
301
301
  })]
302
302
  }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableFooter.default, {
303
303
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TableFooterInfo.default, {
304
- children: texts.info.replace("_START_", start).replace("_END_", end).replace("_TOTAL_", total)
304
+ children: texts.info.replace('_START_', start).replace('_END_', end).replace('_TOTAL_', total)
305
305
  }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableFooterPager.default, {
306
306
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Paginate.default, {
307
307
  currentPage: currentPage,
@@ -314,19 +314,19 @@ var Table = function Table(_ref) {
314
314
  allowSearch: false,
315
315
  options: [{
316
316
  id: 10,
317
- text: "10"
317
+ text: '10'
318
318
  }, {
319
319
  id: 20,
320
- text: "20"
320
+ text: '20'
321
321
  }, {
322
322
  id: 30,
323
- text: "30"
323
+ text: '30'
324
324
  }, {
325
325
  id: 40,
326
- text: "40"
326
+ text: '40'
327
327
  }, {
328
328
  id: 50,
329
- text: "50"
329
+ text: '50'
330
330
  }],
331
331
  selected: limit,
332
332
  onSelect: onLimitChange
@@ -346,7 +346,7 @@ var BodyTR = _styledComponents.default.tr(_templateObject4 || (_templateObject4
346
346
  return (active || primary) && (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n > td {\n background: var(--color-background4);\n }\n "])));
347
347
  }, function (_ref4) {
348
348
  var clickable = _ref4.clickable;
349
- return clickable && "pointer: cursor;";
349
+ return clickable && 'pointer: cursor;';
350
350
  }, _media.default.mobile(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n overflow: hidden;\n position: relative;\n transition: .3s;\n display: block;\n margin-bottom: 0.75rem;\n padding: var(--spacing-xs) var(--spacing-s);\n background: var(\n --color-background", "\n );\n border-radius: var(--border-radius);\n transition: .3s;\n border: 1px solid transparent;\n\n &:hover {\n border: var(--border-width) solid var(--color-primary);\n }\n\n ", "\n\n ", "\n "])), function (_ref5) {
351
351
  var backgroundReverse = _ref5.backgroundReverse;
352
352
  return backgroundReverse ? 1 : 2;
@@ -359,12 +359,12 @@ var BodyTR = _styledComponents.default.tr(_templateObject4 || (_templateObject4
359
359
  return noData && (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n height: 168px;\n\n > td {\n &:first-child:before {\n display: none;\n }\n }\n "])));
360
360
  }));
361
361
 
362
- var TableDataCell = _styledComponents.default.td(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n height: 48px;\n background: ", ";\n padding: 0 var(--spacing-xs);\n max-width: 0px;\n text-align: ", ";\n vertical-align: middle;\n border-top: var(--border-width) solid transparent;\n border-bottom: var(--border-width) solid transparent;\n transition: 0.3s;\n\n &:first-child {\n border-left: var(--border-width) solid transparent;\n border-top-left-radius: var(--border-radius-l);\n border-bottom-left-radius: var(--border-radius-l);\n padding-left: var(--spacing);\n }\n\n &:last-child {\n border-right: var(--border-width) solid transparent;\n border-top-right-radius: var(--border-radius-l);\n border-bottom-right-radius: var(--border-radius-l);\n padding-right: var(--spacing);\n }\n\n > span {\n display: inline-block;\n width: 100%;\n padding: 0 2px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n\n ", "\n\n ", "\n"])), function (_ref8) {
362
+ var TableDataCell = _styledComponents.default.td(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n height: 48px;\n background: ", ";\n padding: 0 var(--spacing-xs);\n max-width: 0px;\n text-align: ", ";\n vertical-align: middle;\n border-top: var(--border-width) solid transparent;\n border-bottom: var(--border-width) solid transparent;\n transition: 0.3s;\n\n &:first-child {\n border-left: var(--border-width) solid transparent;\n border-top-left-radius: var(--border-radius-l);\n border-bottom-left-radius: var(--border-radius-l);\n padding-left: var(--spacing);\n }\n\n &:last-child {\n border-right: var(--border-width) solid transparent;\n border-top-right-radius: var(--border-radius-l);\n border-bottom-right-radius: var(--border-radius-l);\n padding-right: var(--spacing);\n }\n\n > span {\n display: inline-block;\n width: 100%;\n padding: 0 2px;\n overflow: hidden;\n white-space: pre;\n text-overflow: ellipsis;\n }\n\n ", "\n\n ", "\n"])), function (_ref8) {
363
363
  var backgroundReverse = _ref8.backgroundReverse;
364
- return backgroundReverse ? "var(--color-background1)" : "var(--color-background2)";
364
+ return backgroundReverse ? 'var(--color-background1)' : 'var(--color-background2)';
365
365
  }, function (_ref9) {
366
366
  var center = _ref9.center;
367
- return center ? "center" : "left";
367
+ return center ? 'center' : 'left';
368
368
  }, function (_ref10) {
369
369
  var noData = _ref10.noData;
370
370
  return noData && (0, _styledComponents.css)(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n padding: 20px 0;\n "])));
@@ -19,15 +19,15 @@ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(
19
19
 
20
20
  var TableHeadCell = _styledComponents.default.th(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-size: var(--font-body1);\n font-weight: var(--font-bold);\n padding: var(--spacing-s) var(--spacing-xs);\n width: ", ";\n position: relative;\n max-width: 0px;\n\n > div {\n display: flex;\n\n > span {\n max-width: calc(100% - 0.5rem - 1rem);\n padding-right: var(--spacing-xs);\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n }\n\n &:first-child {\n padding-left: var(--spacing);\n }\n\n &:last-child {\n padding-right: var(--spacing);\n }\n\n ", "\n\n ", "\n"])), function (_ref) {
21
21
  var width = _ref.width;
22
- return width || "auto";
22
+ return width || 'auto';
23
23
  }, function (_ref2) {
24
24
  var sortable = _ref2.sortable;
25
- return sortable && "cursor: pointer;";
25
+ return sortable && 'cursor: pointer;';
26
26
  }, function (_ref3) {
27
27
  var align = _ref3.align;
28
28
 
29
29
  switch (align) {
30
- case "center":
30
+ case 'center':
31
31
  return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n > div {\n justify-content: center;\n }\n "])));
32
32
 
33
33
  default:
@@ -18,14 +18,14 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" =
18
18
  var useLimitChange = function useLimitChange(setState) {
19
19
  return (0, _react.useCallback)(function (limit) {
20
20
  setState(function (previous) {
21
- if (_typeof(previous) === "object") {
21
+ if (_typeof(previous) === 'object') {
22
22
  return _objectSpread(_objectSpread({}, previous), {}, {
23
23
  page: 1,
24
24
  limit: limit
25
25
  });
26
- } else {
27
- return limit;
28
26
  }
27
+
28
+ return limit;
29
29
  });
30
30
  }, [setState]);
31
31
  };
@@ -18,13 +18,13 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" =
18
18
  var usePageChange = function usePageChange(setState) {
19
19
  return (0, _react.useCallback)(function (page) {
20
20
  setState(function (previous) {
21
- if (_typeof(previous) === "object") {
21
+ if (_typeof(previous) === 'object') {
22
22
  return _objectSpread(_objectSpread({}, previous), {}, {
23
23
  page: page
24
24
  });
25
- } else {
26
- return page;
27
25
  }
26
+
27
+ return page;
28
28
  });
29
29
  }, [setState]);
30
30
  };
@@ -18,7 +18,7 @@ var useSortChange = function useSortChange(setState, sortColumn, sortType) {
18
18
  var type = null;
19
19
 
20
20
  if (columnName === sortColumn) {
21
- type = sortType === "asc" ? "desc" : "asc";
21
+ type = sortType === 'asc' ? 'desc' : 'asc';
22
22
  }
23
23
 
24
24
  setState(function (previous) {
package/text/Paragraph.js CHANGED
@@ -13,21 +13,24 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
13
13
 
14
14
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
15
15
 
16
- var Paragraph = _styledComponents.default.p(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-size: var(--font-body1);\n margin-bottom: var(--spacing-s);\n word-break: break-word;\n overflow-wrap: break-word;\n\n &:last-child {\n margin-bottom: 0;\n }\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n"])), function (_ref) {
16
+ var Paragraph = _styledComponents.default.p(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-size: var(--font-body1);\n margin-bottom: var(--spacing-s);\n word-break: break-word;\n overflow-wrap: break-word;\n\n &:last-child {\n margin-bottom: 0;\n }\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n"])), function (_ref) {
17
17
  var flex = _ref.flex;
18
- return flex && "display: flex;";
18
+ return flex && 'display: flex;';
19
19
  }, function (_ref2) {
20
20
  var justifyContentBetween = _ref2.justifyContentBetween;
21
- return justifyContentBetween && "justify-content: space-between;";
21
+ return justifyContentBetween && 'justify-content: space-between;';
22
22
  }, function (_ref3) {
23
23
  var inline = _ref3.inline;
24
24
  return inline && "\n display: inline;\n margin-right: var(--spacing-s);\n ";
25
25
  }, function (_ref4) {
26
26
  var fontH3 = _ref4.fontH3;
27
- return fontH3 && "font-size: var(--font-h3);";
27
+ return fontH3 && 'font-size: var(--font-h3);';
28
28
  }, function (_ref5) {
29
29
  var fontWeightBold = _ref5.fontWeightBold;
30
- return fontWeightBold && "font-weight: bold;";
30
+ return fontWeightBold && 'font-weight: bold;';
31
+ }, function (_ref6) {
32
+ var marginBottomXS = _ref6.marginBottomXS;
33
+ return marginBottomXS && 'margin-bottom: var(--spacing-xs);';
31
34
  });
32
35
 
33
36
  var _default = Paragraph;
@@ -13,7 +13,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
13
13
 
14
14
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
15
15
 
16
- var Timeline = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: relative;\n\n &:before {\n content: \"\";\n position: absolute;\n left: 7.8rem;\n width: 0.214rem;\n top: 5px;\n bottom: 5px;\n height: calc(100% - 5px);\n background-color: #e7e9f5;\n }\n"])));
16
+ var Timeline = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: relative;\n\n &:before {\n content: '';\n position: absolute;\n left: 7.8rem;\n width: 0.214rem;\n top: 5px;\n bottom: 5px;\n height: calc(100% - 5px);\n background-color: #e7e9f5;\n }\n"])));
17
17
 
18
18
  var Items = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral([""])));
19
19
 
@@ -23,13 +23,13 @@ var ItemTag = _styledComponents.default.span(_templateObject4 || (_templateObjec
23
23
 
24
24
  var ItemCircle = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n border-radius: 50%;\n border: 0.89rem solid #2d2c4c;\n z-index: 1;\n top: 0.2rem;\n left: 7rem;\n position: relative;\n\n > svg {\n font-size: 1.5rem;\n top: 0;\n left: 0;\n transform: translate(-50%, -50%);\n position: absolute;\n }\n\n ", "\n\n ", "\n\n ", "\n"])), function (_ref) {
25
25
  var success = _ref.success;
26
- return success && "color: var(--color-success);";
26
+ return success && 'color: var(--color-success);';
27
27
  }, function (_ref2) {
28
28
  var danger = _ref2.danger;
29
- return danger && "color: var(--color-danger);";
29
+ return danger && 'color: var(--color-danger);';
30
30
  }, function (_ref3) {
31
31
  var warning = _ref3.warning;
32
- return warning && "color: var(--color-warning);";
32
+ return warning && 'color: var(--color-warning);';
33
33
  });
34
34
 
35
35
  var ItemDescription = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n display: table-cell;\n vertical-align: top;\n font-size: 1rem;\n padding: 0 0 0 8rem;\n color: #fff;\n"])));
@@ -15,6 +15,6 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
15
15
 
16
16
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
17
17
 
18
- var CustomToastContainer = (0, _styledComponents.default)(_reactToastify.ToastContainer)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n width: 360px;\n\n .Toastify__toast {\n padding: 15px 15px 15px 50px;\n box-shadow: 0 0 8px #999999;\n background-repeat: no-repeat;\n background-position: 15px center;\n }\n\n .Toastify__toast--error {\n background-color: var(--color-danger);\n background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=\");\n }\n\n .Toastify__toast--success {\n background-color: var(--color-success);\n background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==\");\n }\n\n .Toastify__toast--warning {\n background-color: var(--color-warning);\n background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==\");\n }\n"])));
18
+ var CustomToastContainer = (0, _styledComponents.default)(_reactToastify.ToastContainer)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n width: 360px;\n\n .Toastify__toast {\n padding: 15px 15px 15px 50px;\n box-shadow: 0 0 8px #999999;\n background-repeat: no-repeat;\n background-position: 15px center;\n }\n\n .Toastify__toast--error {\n background-color: var(--color-danger);\n background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=');\n }\n\n .Toastify__toast--success {\n background-color: var(--color-success);\n background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==');\n }\n\n .Toastify__toast--warning {\n background-color: var(--color-warning);\n background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==');\n }\n"])));
19
19
  var _default = CustomToastContainer;
20
20
  exports.default = _default;
@@ -105,14 +105,14 @@ var Tooltip = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
105
105
  return {
106
106
  onClick: toggle
107
107
  };
108
- } else {
109
- return {
110
- // mode ==="hover"
111
- onClick: handleClose,
112
- onMouseOver: handleOpen,
113
- onMouseLeave: handleClose
114
- };
115
108
  }
109
+
110
+ return {
111
+ // mode ==="hover"
112
+ onClick: handleClose,
113
+ onMouseOver: handleOpen,
114
+ onMouseLeave: handleClose
115
+ };
116
116
  }, [mode, handleClose, handleOpen, toggle, disabled]);
117
117
 
118
118
  var childrenProps = _objectSpread(_objectSpread({}, children.props), {}, {
@@ -8,8 +8,8 @@ exports.default = void 0;
8
8
  var range = function range(start, end) {
9
9
  var arr = [];
10
10
 
11
- for (var i = start; i <= end; i += 1) {
12
- arr.push(i);
11
+ for (var index = start; index <= end; index += 1) {
12
+ arr.push(index);
13
13
  }
14
14
 
15
15
  return arr;