@cashub/ui 0.21.0 → 0.21.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.
- package/Tab/Tab.js +9 -13
- package/Tab/TabList.js +14 -32
- package/Tab/TabPanel.js +21 -58
- package/Tab/TabTab.js +20 -40
- package/Tab/index.js +2 -10
- package/Tab/subComponent/TabContext.js +2 -5
- package/animate/Collapse.js +26 -53
- package/animate/Loader.js +21 -26
- package/animate/NumberCounter.js +22 -44
- package/animate/PulseRing.js +9 -21
- package/animate/Spinner.js +2 -10
- package/animate/index.js +5 -11
- package/backdrop/BaseBackdrop.js +2 -9
- package/backdrop/LoadingBackdrop.js +2 -9
- package/backdrop/ModalBackdrop.js +2 -9
- package/backdrop/index.js +3 -7
- package/badge/Badge.js +2 -11
- package/badge/BadgeDot.js +2 -10
- package/badge/BadgeFill.js +15 -20
- package/badge/BadgeWithText.js +6 -13
- package/badge/index.js +4 -9
- package/billing/BarChart.js +10 -17
- package/billing/Grid.js +11 -15
- package/billing/Header2.js +6 -9
- package/billing/Header3.js +9 -16
- package/billing/Paragraph.js +8 -14
- package/billing/ParagraphGroup.js +6 -9
- package/billing/ParagraphText.js +7 -12
- package/billing/Section.js +13 -23
- package/billing/SectionBody.js +5 -8
- package/billing/SectionHeader.js +7 -12
- package/breadcrumb/Breadcrumb.js +11 -21
- package/breadcrumb/index.js +1 -3
- package/button/Button.js +41 -38
- package/button/ButtonGroup.js +21 -18
- package/button/IconButton.js +29 -29
- package/button/ScrollToTopButton.js +12 -39
- package/button/index.js +4 -9
- package/callout/Callout.js +13 -26
- package/callout/index.js +1 -3
- package/chart/BarChart.js +28 -53
- package/chart/DoughnutChart.js +23 -62
- package/chart/LineChart.js +33 -55
- package/chart/SingleBarChart.js +11 -17
- package/chart/index.js +5 -12
- package/chart/utils/customTooltip.js +26 -43
- package/chart/utils/htmlLegendPlugin.js +24 -30
- package/chart/utils/index.js +3 -7
- package/chart/utils/padEmptyChartBar.js +24 -22
- package/container/FlexContainer.js +9 -12
- package/container/index.js +1 -3
- package/cropper/Cropper.js +21 -34
- package/cropper/CropperModalHandler.js +15 -21
- package/cropper/index.js +2 -5
- package/cropper/subComponent/CropImageModal.js +23 -58
- package/datetimePicker/DatePicker.js +103 -217
- package/datetimePicker/DatePickerV2.js +116 -221
- package/datetimePicker/DatetimePicker.js +27 -48
- package/datetimePicker/DatetimePickerV2.js +115 -231
- package/datetimePicker/TimeInput.js +9 -22
- package/datetimePicker/TimePicker.js +94 -151
- package/datetimePicker/TimePickerStyle.js +2 -9
- package/datetimePicker/accordion/Month.js +70 -90
- package/datetimePicker/accordion/Year.js +91 -135
- package/datetimePicker/hooks/index.js +3 -7
- package/datetimePicker/hooks/useChangeNumber.js +14 -27
- package/datetimePicker/hooks/useDecrease.js +19 -35
- package/datetimePicker/hooks/useIncrease.js +19 -35
- package/datetimePicker/index.js +7 -15
- package/datetimePicker/provider/constant.js +2 -3
- package/datetimePicker/subComponent/Accordion.js +108 -158
- package/datetimePicker/subComponent/CustomTimeInput.js +18 -48
- package/datetimePicker/subComponent/DateTimePickerContext.js +2 -5
- package/datetimePicker/utils/GMTDate.js +3 -7
- package/datetimePicker/utils/pad.js +2 -6
- package/datetimePicker/utils/toUTC0.js +3 -6
- package/descriptionList/DescriptionDetail.js +5 -10
- package/descriptionList/DescriptionList.js +5 -10
- package/descriptionList/DescriptionTerm.js +2 -9
- package/descriptionList/index.js +3 -7
- package/divider/Divider.js +9 -12
- package/divider/index.js +1 -3
- package/dropdown/Dropdown.js +28 -65
- package/dropdown/DropdownButtonOption.js +2 -9
- package/dropdown/DropdownContent.js +33 -64
- package/dropdown/DropdownDivOption.js +2 -9
- package/dropdown/DropdownItem.js +10 -16
- package/dropdown/DropdownLinkOption.js +2 -9
- package/dropdown/DropdownToggle.js +18 -38
- package/dropdown/index.js +6 -17
- package/dropdown/subComponent/DropdownContext.js +2 -5
- package/dropzone/FileDropzone.js +148 -302
- package/dropzone/ImageDropzone.js +96 -171
- package/dropzone/index.js +2 -5
- package/dropzone/subComponent/Message.js +7 -14
- package/figure/IconFigure.js +9 -16
- package/figure/ImageFigure.js +11 -17
- package/figure/index.js +2 -5
- package/file/HiddenFileInput.js +5 -14
- package/file/index.js +1 -3
- package/form/Checkbox.js +34 -43
- package/form/FormItem.js +2 -9
- package/form/Input.js +13 -15
- package/form/Label.js +10 -13
- package/form/MutedText.js +5 -10
- package/form/RadioButton.js +20 -32
- package/form/Searchbox.js +21 -65
- package/form/Slider.js +14 -0
- package/form/SwitchButton.js +34 -39
- package/form/Textarea.js +2 -11
- package/form/index.js +9 -19
- package/grid/Column.js +17 -17
- package/grid/Grid.js +13 -14
- package/grid/index.js +2 -5
- package/heading/Heading1.js +5 -10
- package/heading/Heading2.js +9 -12
- package/heading/Heading3.js +21 -18
- package/heading/index.js +3 -7
- package/helmet/Helmet.js +6 -9
- package/helmet/index.js +2 -5
- package/iconbox/ApplicationIconBox.js +25 -31
- package/iconbox/IconBox.js +11 -24
- package/iconbox/IconBoxV2.js +14 -26
- package/iconbox/index.js +3 -7
- package/iconbox/subComponent/IconBoxFigure.js +25 -20
- package/iconbox/subComponent/IconBoxImage.js +15 -18
- package/image/ImageFluid.js +2 -10
- package/image/UploadImage.js +65 -113
- package/image/index.js +2 -5
- package/index.js +44 -130
- package/jsoneditor/JsonEditor.js +10 -32
- package/jsoneditor/index.js +1 -3
- package/keyframe/Pulse.js +2 -7
- package/keyframe/Spin.js +2 -7
- package/link/LinkSpan.js +22 -35
- package/link/index.js +1 -3
- package/map/GoogleMap.js +122 -175
- package/map/GoogleReverseGeolocation.js +79 -186
- package/map/LeafletMap.js +78 -132
- package/map/LeafletReverseGeolocation.js +49 -121
- package/map/index.js +4 -9
- package/map/subComponent/BasicLeafletMap.js +8 -14
- package/map/subComponent/GoogleMapContainer.js +5 -10
- package/map/subComponent/GoogleMapPopup.js +66 -123
- package/map/subComponent/GoogleMapWrapper.js +13 -32
- package/map/subComponent/GoogleMarkerSpiderfier.js +14 -24
- package/map/subComponent/LeafletDrawControl.js +47 -84
- package/map/subComponent/LeafletMapContainer.js +5 -10
- package/map/subComponent/MapSearchBoxControl.js +24 -70
- package/modal/StateModal.js +41 -100
- package/modal/TitleModal.js +89 -190
- package/modal/index.js +2 -5
- package/package.json +1 -1
- package/paginate/Paginate.js +40 -54
- package/paginate/index.js +1 -3
- package/popover/Popover.js +39 -87
- package/popover/index.js +1 -3
- package/qrcode/QRCode.js +10 -23
- package/qrcode/QRCodeContainter.js +8 -16
- package/qrcode/index.js +2 -5
- package/ribbon/Ribbon.js +4 -15
- package/ribbon/index.js +1 -3
- package/section/Section.js +57 -39
- package/section/SectionBody.js +15 -22
- package/section/SectionHeader.js +27 -27
- package/section/SectionToolbar.js +2 -9
- package/section/SectionToolbarItem.js +2 -9
- package/section/index.js +5 -11
- package/select/InputSelect.js +103 -215
- package/select/Select.js +204 -362
- package/select/index.js +2 -5
- package/select/subComponent/ListBox.js +9 -12
- package/select/subComponent/Option.js +8 -16
- package/select/subComponent/OptionGroup.js +2 -9
- package/select/subComponent/Options.js +5 -11
- package/select/subComponent/SearchBox.js +9 -29
- package/select/subComponent/SelectedMultiple.js +8 -16
- package/select/subComponent/SelectedSingle.js +2 -9
- package/styles/GlobalStyle.js +169 -91
- package/styles/config/breakpoint.style.js +2 -3
- package/styles/config/header.style.js +2 -3
- package/styles/config/sidebar.style.js +2 -3
- package/styles/index.js +2 -5
- package/styles/mixin/backgroundColor.js +17 -14
- package/styles/mixin/borderColor.js +17 -14
- package/styles/mixin/color.js +17 -14
- package/styles/mixin/colorOnBackground.js +17 -14
- package/styles/mixin/inputPlaceholder.js +3 -9
- package/styles/mixin/media.js +3 -11
- package/styles/mixin/rounded.js +13 -12
- package/styles/mixin/scrollbar.js +7 -13
- package/styles/theme/dark.theme.js +20 -20
- package/styles/theme/light.theme.js +20 -20
- package/styles/theme/white.theme.js +20 -20
- package/styles/themes.js +2 -8
- package/table/GridTable.js +105 -143
- package/table/ImageBox.js +8 -18
- package/table/PermissionTable.js +25 -25
- package/table/Table.js +137 -153
- package/table/__mock__/columns.js +2 -3
- package/table/__mock__/data.js +2 -3
- package/table/hooks/index.js +2 -5
- package/table/hooks/useCalculateDataRange.js +9 -36
- package/table/hooks/useGenerateSort.js +6 -17
- package/table/index.js +4 -9
- package/table/subComponent/BaseTableHeadCell.js +15 -21
- package/table/subComponent/GridTableFooter.js +5 -10
- package/table/subComponent/GridTableHeadCell.js +5 -10
- package/table/subComponent/Resizer.js +17 -44
- package/table/subComponent/TableFooter.js +5 -10
- package/table/subComponent/TableFooterInfo.js +2 -9
- package/table/subComponent/TableFooterPager.js +5 -12
- package/table/subComponent/TableHeadCell.js +2 -9
- package/table/subComponent/TableSort.js +13 -19
- package/tagify/TagifyStyle.js +2 -9
- package/tagify/Tags.js +15 -37
- package/tagify/index.js +2 -5
- package/text/Paragraph.js +25 -20
- package/text/index.js +1 -3
- package/timeline/Timeline.js +28 -37
- package/timeline/index.js +1 -3
- package/toast/CustomToastContainer.js +2 -9
- package/toast/MessageContainer.js +9 -18
- package/toast/index.js +3 -8
- package/toast/show.js +18 -28
- package/tooltip/Tooltip.js +48 -97
- package/tooltip/index.js +1 -3
- package/wizard/Wizard.js +63 -133
- package/wizard/index.js +1 -3
package/Tab/Tab.js
CHANGED
|
@@ -4,25 +4,21 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _TabContext = _interopRequireDefault(require("./subComponent/TabContext"));
|
|
9
|
-
|
|
10
8
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
-
|
|
12
9
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
10
|
+
const Tab = _ref => {
|
|
11
|
+
let {
|
|
12
|
+
children,
|
|
13
|
+
selected,
|
|
14
|
+
onChange
|
|
15
|
+
} = _ref;
|
|
18
16
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabContext.default.Provider, {
|
|
19
17
|
value: {
|
|
20
|
-
selected
|
|
21
|
-
onChange
|
|
18
|
+
selected,
|
|
19
|
+
onChange
|
|
22
20
|
},
|
|
23
21
|
children: children
|
|
24
22
|
});
|
|
25
23
|
};
|
|
26
|
-
|
|
27
|
-
var _default = Tab;
|
|
28
|
-
exports.default = _default;
|
|
24
|
+
var _default = exports.default = Tab;
|
package/Tab/TabList.js
CHANGED
|
@@ -4,44 +4,26 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
9
|
-
|
|
10
8
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
-
|
|
12
9
|
var _templateObject;
|
|
13
|
-
|
|
14
|
-
var _excluded = ["children"];
|
|
15
|
-
|
|
16
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
-
|
|
18
11
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
29
|
-
|
|
30
|
-
var TabList = function TabList(_ref) {
|
|
31
|
-
var children = _ref.children,
|
|
32
|
-
props = _objectWithoutProperties(_ref, _excluded);
|
|
33
|
-
|
|
34
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Container, _objectSpread(_objectSpread({
|
|
35
|
-
role: "tablist"
|
|
36
|
-
}, props), {}, {
|
|
12
|
+
const TabList = _ref => {
|
|
13
|
+
let {
|
|
14
|
+
children,
|
|
15
|
+
...props
|
|
16
|
+
} = _ref;
|
|
17
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Container, {
|
|
18
|
+
role: "tablist",
|
|
19
|
+
...props,
|
|
37
20
|
children: children
|
|
38
|
-
})
|
|
21
|
+
});
|
|
39
22
|
};
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
23
|
+
const Container = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex-wrap: wrap;\n border-bottom: var(--border-width) solid var(--border-color);\n margin-bottom: var(--spacing);\n\n ", "\n"])), _ref2 => {
|
|
24
|
+
let {
|
|
25
|
+
noMargin
|
|
26
|
+
} = _ref2;
|
|
43
27
|
return noMargin && 'margin-bottom: 0;';
|
|
44
28
|
});
|
|
45
|
-
|
|
46
|
-
var _default = TabList;
|
|
47
|
-
exports.default = _default;
|
|
29
|
+
var _default = exports.default = TabList;
|
package/Tab/TabPanel.js
CHANGED
|
@@ -4,82 +4,45 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = require("react");
|
|
9
|
-
|
|
10
8
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
11
|
-
|
|
12
9
|
var _TabContext = _interopRequireDefault(require("./subComponent/TabContext"));
|
|
13
|
-
|
|
14
10
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
15
|
-
|
|
16
11
|
var _templateObject;
|
|
17
|
-
|
|
18
|
-
var _excluded = ["children", "name"];
|
|
19
|
-
|
|
20
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
21
|
-
|
|
22
13
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
35
|
-
|
|
36
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
37
|
-
|
|
38
|
-
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
39
|
-
|
|
40
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
41
|
-
|
|
42
|
-
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
43
|
-
|
|
44
|
-
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
45
|
-
|
|
46
|
-
var TabPanel = function TabPanel(_ref) {
|
|
47
|
-
var children = _ref.children,
|
|
48
|
-
name = _ref.name,
|
|
49
|
-
props = _objectWithoutProperties(_ref, _excluded);
|
|
50
|
-
|
|
51
|
-
var _useContext = (0, _react.useContext)(_TabContext.default),
|
|
52
|
-
selected = _useContext.selected;
|
|
53
|
-
|
|
54
|
-
var _useState = (0, _react.useState)(false),
|
|
55
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
56
|
-
rendered = _useState2[0],
|
|
57
|
-
setRendered = _useState2[1];
|
|
58
|
-
|
|
59
|
-
var tabContent = (0, _react.useMemo)(function () {
|
|
14
|
+
const TabPanel = _ref => {
|
|
15
|
+
let {
|
|
16
|
+
children,
|
|
17
|
+
name,
|
|
18
|
+
...props
|
|
19
|
+
} = _ref;
|
|
20
|
+
const {
|
|
21
|
+
selected
|
|
22
|
+
} = (0, _react.useContext)(_TabContext.default);
|
|
23
|
+
const [rendered, setRendered] = (0, _react.useState)(false);
|
|
24
|
+
const tabContent = (0, _react.useMemo)(() => {
|
|
60
25
|
if (rendered) {
|
|
61
26
|
return children;
|
|
62
27
|
}
|
|
63
|
-
|
|
64
28
|
return null;
|
|
65
29
|
}, [rendered, children]);
|
|
66
|
-
(0, _react.useEffect)(
|
|
30
|
+
(0, _react.useEffect)(() => {
|
|
67
31
|
if (name === selected) {
|
|
68
32
|
setRendered(true);
|
|
69
33
|
}
|
|
70
34
|
}, [selected, name]);
|
|
71
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Panel,
|
|
35
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Panel, {
|
|
72
36
|
role: "tabpanel",
|
|
73
|
-
$display: selected === name
|
|
74
|
-
|
|
37
|
+
$display: selected === name,
|
|
38
|
+
...props,
|
|
75
39
|
children: tabContent
|
|
76
|
-
})
|
|
40
|
+
});
|
|
77
41
|
};
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
42
|
+
const Panel = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: ", ";\n position: relative;\n"])), _ref2 => {
|
|
43
|
+
let {
|
|
44
|
+
$display
|
|
45
|
+
} = _ref2;
|
|
81
46
|
return $display ? 'block' : 'none';
|
|
82
47
|
});
|
|
83
|
-
|
|
84
|
-
var _default = TabPanel;
|
|
85
|
-
exports.default = _default;
|
|
48
|
+
var _default = exports.default = TabPanel;
|
package/Tab/TabTab.js
CHANGED
|
@@ -4,60 +4,40 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = require("react");
|
|
9
|
-
|
|
10
8
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
11
|
-
|
|
12
9
|
var _TabContext = _interopRequireDefault(require("./subComponent/TabContext"));
|
|
13
|
-
|
|
14
10
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
15
|
-
|
|
16
11
|
var _templateObject;
|
|
17
|
-
|
|
18
|
-
var _excluded = ["children", "name"];
|
|
19
|
-
|
|
20
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
21
|
-
|
|
22
13
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
var TabTab = function TabTab(_ref) {
|
|
35
|
-
var children = _ref.children,
|
|
36
|
-
name = _ref.name,
|
|
37
|
-
props = _objectWithoutProperties(_ref, _excluded);
|
|
38
|
-
|
|
39
|
-
var _useContext = (0, _react.useContext)(_TabContext.default),
|
|
40
|
-
selected = _useContext.selected,
|
|
41
|
-
onChange = _useContext.onChange;
|
|
42
|
-
|
|
43
|
-
var handleClick = (0, _react.useCallback)(function () {
|
|
14
|
+
const TabTab = _ref => {
|
|
15
|
+
let {
|
|
16
|
+
children,
|
|
17
|
+
name,
|
|
18
|
+
...props
|
|
19
|
+
} = _ref;
|
|
20
|
+
const {
|
|
21
|
+
selected,
|
|
22
|
+
onChange
|
|
23
|
+
} = (0, _react.useContext)(_TabContext.default);
|
|
24
|
+
const handleClick = (0, _react.useCallback)(() => {
|
|
44
25
|
if (selected !== name) {
|
|
45
26
|
onChange(name);
|
|
46
27
|
}
|
|
47
28
|
}, [name, selected, onChange]);
|
|
48
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Tab,
|
|
29
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Tab, {
|
|
49
30
|
role: "tab",
|
|
50
31
|
onClick: handleClick,
|
|
51
|
-
active: selected === name
|
|
52
|
-
|
|
32
|
+
active: selected === name,
|
|
33
|
+
...props,
|
|
53
34
|
children: children
|
|
54
|
-
})
|
|
35
|
+
});
|
|
55
36
|
};
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
37
|
+
const Tab = _styledComponents.default.button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n background: transparent;\n color: var(--font-on-mute);\n padding: 10px var(--spacing-s);\n border: none;\n border-bottom: 4px solid transparent;\n transition: color 0.3s, border 0.3s;\n cursor: pointer;\n\n &:hover {\n color: var(--font-on-background);\n }\n\n ", "\n"])), _ref2 => {
|
|
38
|
+
let {
|
|
39
|
+
active
|
|
40
|
+
} = _ref2;
|
|
59
41
|
return active && "\n border-color: var(--color-primary);\n color: var(--font-on-background);\n ";
|
|
60
42
|
});
|
|
61
|
-
|
|
62
|
-
var _default = TabTab;
|
|
63
|
-
exports.default = _default;
|
|
43
|
+
var _default = exports.default = TabTab;
|
package/Tab/index.js
CHANGED
|
@@ -4,21 +4,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _Tab = _interopRequireDefault(require("./Tab"));
|
|
9
|
-
|
|
10
8
|
var _TabList = _interopRequireDefault(require("./TabList"));
|
|
11
|
-
|
|
12
9
|
var _TabTab = _interopRequireDefault(require("./TabTab"));
|
|
13
|
-
|
|
14
10
|
var _TabPanel = _interopRequireDefault(require("./TabPanel"));
|
|
15
|
-
|
|
16
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
-
|
|
18
|
-
var _default = Object.assign(_Tab.default, {
|
|
12
|
+
var _default = exports.default = Object.assign(_Tab.default, {
|
|
19
13
|
List: _TabList.default,
|
|
20
14
|
Tab: _TabTab.default,
|
|
21
15
|
Panel: _TabPanel.default
|
|
22
|
-
});
|
|
23
|
-
|
|
24
|
-
exports.default = _default;
|
|
16
|
+
});
|
|
@@ -4,9 +4,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = require("react");
|
|
9
|
-
|
|
10
|
-
var
|
|
11
|
-
var _default = TabContext;
|
|
12
|
-
exports.default = _default;
|
|
8
|
+
const TabContext = /*#__PURE__*/(0, _react.createContext)(null);
|
|
9
|
+
var _default = exports.default = TabContext;
|
package/animate/Collapse.js
CHANGED
|
@@ -4,58 +4,32 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = require("react");
|
|
9
|
-
|
|
10
8
|
var _reactTransitionGroup = require("react-transition-group");
|
|
11
|
-
|
|
12
9
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
25
|
-
|
|
26
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
27
|
-
|
|
28
|
-
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
29
|
-
|
|
30
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
31
|
-
|
|
32
|
-
var Collapse = function Collapse(_ref) {
|
|
33
|
-
var inProp = _ref.in,
|
|
34
|
-
_ref$duration = _ref.duration,
|
|
35
|
-
duration = _ref$duration === void 0 ? 1000 : _ref$duration,
|
|
36
|
-
_children = _ref.children,
|
|
37
|
-
onEntered = _ref.onEntered,
|
|
38
|
-
onExit = _ref.onExit,
|
|
39
|
-
onExited = _ref.onExited;
|
|
40
|
-
var childRef = (0, _react.useRef)(null);
|
|
41
|
-
|
|
42
|
-
var _useState = (0, _react.useState)({
|
|
10
|
+
const Collapse = _ref => {
|
|
11
|
+
let {
|
|
12
|
+
in: inProp,
|
|
13
|
+
duration = 1000,
|
|
14
|
+
children,
|
|
15
|
+
onEntered,
|
|
16
|
+
onExit,
|
|
17
|
+
onExited
|
|
18
|
+
} = _ref;
|
|
19
|
+
const childRef = (0, _react.useRef)(null);
|
|
20
|
+
const [state, setState] = (0, _react.useState)({
|
|
43
21
|
show: inProp,
|
|
44
22
|
height: 0
|
|
45
|
-
})
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
setState = _useState2[1];
|
|
49
|
-
|
|
50
|
-
var defaultStyle = (0, _react.useMemo)(function () {
|
|
51
|
-
var style = {
|
|
23
|
+
});
|
|
24
|
+
const defaultStyle = (0, _react.useMemo)(() => {
|
|
25
|
+
const style = {
|
|
52
26
|
transition: "height ".concat(duration, "ms ease-in-out"),
|
|
53
27
|
height: state.height,
|
|
54
28
|
overflow: 'hidden'
|
|
55
29
|
};
|
|
56
30
|
return style;
|
|
57
31
|
}, [duration, state.height]);
|
|
58
|
-
|
|
32
|
+
const transitionStyles = (0, _react.useMemo)(() => {
|
|
59
33
|
return {
|
|
60
34
|
entering: {
|
|
61
35
|
height: state.height
|
|
@@ -71,7 +45,7 @@ var Collapse = function Collapse(_ref) {
|
|
|
71
45
|
}
|
|
72
46
|
};
|
|
73
47
|
}, [state.height]);
|
|
74
|
-
(0, _react.useEffect)(
|
|
48
|
+
(0, _react.useEffect)(() => {
|
|
75
49
|
setState({
|
|
76
50
|
show: inProp,
|
|
77
51
|
height: childRef.current.clientHeight
|
|
@@ -83,16 +57,15 @@ var Collapse = function Collapse(_ref) {
|
|
|
83
57
|
onEntered: onEntered,
|
|
84
58
|
onExit: onExit,
|
|
85
59
|
onExited: onExited,
|
|
86
|
-
children:
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
60
|
+
children: state => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
61
|
+
style: {
|
|
62
|
+
...defaultStyle,
|
|
63
|
+
...transitionStyles[state]
|
|
64
|
+
},
|
|
65
|
+
children: /*#__PURE__*/(0, _react.cloneElement)(children, {
|
|
66
|
+
ref: childRef
|
|
67
|
+
})
|
|
68
|
+
})
|
|
94
69
|
});
|
|
95
70
|
};
|
|
96
|
-
|
|
97
|
-
var _default = Collapse;
|
|
98
|
-
exports.default = _default;
|
|
71
|
+
var _default = exports.default = Collapse;
|
package/animate/Loader.js
CHANGED
|
@@ -4,27 +4,20 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
9
|
-
|
|
10
8
|
var _LoadingBackdrop = _interopRequireDefault(require("../backdrop/LoadingBackdrop"));
|
|
11
|
-
|
|
12
9
|
var _Spinner = _interopRequireDefault(require("./Spinner"));
|
|
13
|
-
|
|
14
10
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
15
|
-
|
|
16
11
|
var _templateObject, _templateObject2;
|
|
17
|
-
|
|
18
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
|
-
|
|
20
13
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
14
|
+
const Loader = _ref => {
|
|
15
|
+
let {
|
|
16
|
+
transparent,
|
|
17
|
+
backgroundFill,
|
|
18
|
+
$loading = true,
|
|
19
|
+
text
|
|
20
|
+
} = _ref;
|
|
28
21
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Wrapper, {
|
|
29
22
|
transparent: transparent,
|
|
30
23
|
backgroundFill: backgroundFill,
|
|
@@ -34,19 +27,21 @@ var Loader = function Loader(_ref) {
|
|
|
34
27
|
})]
|
|
35
28
|
});
|
|
36
29
|
};
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
30
|
+
const Wrapper = (0, _styledComponents.default)(_LoadingBackdrop.default)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n z-index: 200;\n\n ", "\n\n ", "\n\n ", "\n"])), _ref2 => {
|
|
31
|
+
let {
|
|
32
|
+
transparent
|
|
33
|
+
} = _ref2;
|
|
40
34
|
return transparent && 'background: transparent;';
|
|
41
|
-
},
|
|
42
|
-
|
|
35
|
+
}, _ref3 => {
|
|
36
|
+
let {
|
|
37
|
+
backgroundFill
|
|
38
|
+
} = _ref3;
|
|
43
39
|
return backgroundFill && 'background: var(--color-background1);';
|
|
44
|
-
},
|
|
45
|
-
|
|
40
|
+
}, _ref4 => {
|
|
41
|
+
let {
|
|
42
|
+
$loading
|
|
43
|
+
} = _ref4;
|
|
46
44
|
return !$loading && 'display: none;';
|
|
47
45
|
});
|
|
48
|
-
|
|
49
|
-
var
|
|
50
|
-
|
|
51
|
-
var _default = Loader;
|
|
52
|
-
exports.default = _default;
|
|
46
|
+
const Text = _styledComponents.default.p(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n white-space: pre-line;\n margin: var(--spacing) 0;\n font-size: var(--font-h2);\n text-align: center;\n"])));
|
|
47
|
+
var _default = exports.default = Loader;
|
package/animate/NumberCounter.js
CHANGED
|
@@ -4,70 +4,48 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = require("react");
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
19
|
-
|
|
20
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
21
|
-
|
|
22
|
-
var MINIMUM_STEP_TIME = 100;
|
|
23
|
-
|
|
24
|
-
var NumberCounter = function NumberCounter(_ref) {
|
|
25
|
-
var start = _ref.start,
|
|
26
|
-
end = _ref.end,
|
|
27
|
-
duration = _ref.duration;
|
|
28
|
-
|
|
29
|
-
var _useState = (0, _react.useState)(start || 0),
|
|
30
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
31
|
-
number = _useState2[0],
|
|
32
|
-
setNumber = _useState2[1];
|
|
33
|
-
|
|
34
|
-
(0, _react.useEffect)(function () {
|
|
8
|
+
const MINIMUM_STEP_TIME = 100;
|
|
9
|
+
const NumberCounter = _ref => {
|
|
10
|
+
let {
|
|
11
|
+
start,
|
|
12
|
+
end,
|
|
13
|
+
duration
|
|
14
|
+
} = _ref;
|
|
15
|
+
const [number, setNumber] = (0, _react.useState)(start || 0);
|
|
16
|
+
(0, _react.useEffect)(() => {
|
|
35
17
|
// invalid value
|
|
36
|
-
if (end === null || end === undefined) return;
|
|
18
|
+
if (end === null || end === undefined) return;
|
|
37
19
|
|
|
20
|
+
// same value no need do counter
|
|
38
21
|
if (start === end) return;
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
// prevent too much render cause long time render
|
|
22
|
+
let current = start;
|
|
23
|
+
const range = end - start;
|
|
24
|
+
let increment = end > start ? 1 : -1;
|
|
25
|
+
let stepTime = duration / range;
|
|
44
26
|
|
|
27
|
+
// use minimum step time instead if step time too small
|
|
28
|
+
// prevent too much render cause long time render
|
|
45
29
|
if (stepTime < MINIMUM_STEP_TIME) {
|
|
46
|
-
|
|
47
|
-
|
|
30
|
+
const gap = MINIMUM_STEP_TIME - stepTime;
|
|
31
|
+
const multiple = gap / stepTime;
|
|
48
32
|
stepTime = MINIMUM_STEP_TIME;
|
|
49
33
|
increment = Math.floor(1 + 1 * multiple);
|
|
50
34
|
}
|
|
51
|
-
|
|
52
|
-
var timer = setInterval(function () {
|
|
35
|
+
const timer = setInterval(() => {
|
|
53
36
|
current += increment;
|
|
54
|
-
|
|
55
37
|
if (current > end) {
|
|
56
38
|
current = end;
|
|
57
39
|
}
|
|
58
|
-
|
|
59
40
|
setNumber(current);
|
|
60
|
-
|
|
61
41
|
if (current === end) {
|
|
62
42
|
clearInterval(timer);
|
|
63
43
|
}
|
|
64
44
|
}, stepTime);
|
|
65
|
-
return
|
|
45
|
+
return () => {
|
|
66
46
|
clearInterval(timer);
|
|
67
47
|
};
|
|
68
48
|
}, [start, end, duration]);
|
|
69
49
|
return number;
|
|
70
50
|
};
|
|
71
|
-
|
|
72
|
-
var _default = NumberCounter;
|
|
73
|
-
exports.default = _default;
|
|
51
|
+
var _default = exports.default = NumberCounter;
|
package/animate/PulseRing.js
CHANGED
|
@@ -1,34 +1,22 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
-
|
|
5
3
|
Object.defineProperty(exports, "__esModule", {
|
|
6
4
|
value: true
|
|
7
5
|
});
|
|
8
6
|
exports.default = void 0;
|
|
9
|
-
|
|
10
7
|
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
11
|
-
|
|
12
8
|
var _Pulse = _interopRequireDefault(require("../keyframe/Pulse"));
|
|
13
|
-
|
|
14
9
|
var _templateObject, _templateObject2;
|
|
15
|
-
|
|
16
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
-
|
|
18
|
-
function
|
|
19
|
-
|
|
20
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
21
|
-
|
|
11
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
12
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
22
13
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
}
|
|
29
|
-
var play = _ref.play;
|
|
14
|
+
const PulseRing = _styledComponents.default.span.attrs(() => ({
|
|
15
|
+
role: 'presentation'
|
|
16
|
+
}))(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: block;\n border-radius: var(--border-radius-round);\n height: 40px;\n width: 40px;\n position: absolute;\n top: 0;\n z-index: -1;\n opacity: 0;\n border: 4px solid var(--color-primary);\n\n ", "\n"])), _ref => {
|
|
17
|
+
let {
|
|
18
|
+
play
|
|
19
|
+
} = _ref;
|
|
30
20
|
return play && (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n animation: ", " 3.5s ease-out;\n animation-iteration-count: infinite;\n "])), _Pulse.default);
|
|
31
21
|
});
|
|
32
|
-
|
|
33
|
-
var _default = PulseRing;
|
|
34
|
-
exports.default = _default;
|
|
22
|
+
var _default = exports.default = PulseRing;
|