@nutui/nutui-react 2.3.12-beta.0 → 2.3.12
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/CHANGELOG.md +18 -0
- package/dist/esm/ActionSheet.js +30 -76
- package/dist/esm/Address.js +80 -171
- package/dist/esm/Animate.js +21 -49
- package/dist/esm/AnimatingNumbers.js +47 -120
- package/dist/esm/Audio.js +88 -159
- package/dist/esm/Avatar.js +44 -91
- package/dist/esm/AvatarCropper.js +149 -268
- package/dist/esm/AvatarGroup.js +13 -44
- package/dist/esm/BackTop.js +34 -75
- package/dist/esm/Barrage.js +49 -83
- package/dist/esm/Calendar.js +27 -119
- package/dist/esm/CalendarCard.js +180 -291
- package/dist/esm/CalendarItem.js +253 -314
- package/dist/esm/Card.js +38 -72
- package/dist/esm/Cell.js +27 -62
- package/dist/esm/CellGroup.js +16 -45
- package/dist/esm/CheckboxGroup.js +49 -85
- package/dist/esm/CircleProgress.js +42 -93
- package/dist/esm/Col.js +17 -48
- package/dist/esm/Collapse.js +18 -49
- package/dist/esm/ConfigProvider.js +3 -2
- package/dist/esm/CountDown.js +62 -101
- package/dist/esm/DatePicker.js +87 -127
- package/dist/esm/Dialog.js +116 -196
- package/dist/esm/Divider.js +16 -36
- package/dist/esm/Drag.js +32 -76
- package/dist/esm/Elevator.js +93 -133
- package/dist/esm/Ellipsis.js +71 -92
- package/dist/esm/Empty.js +31 -70
- package/dist/esm/FixedNav.js +32 -81
- package/dist/esm/Form.js +28 -61
- package/dist/esm/Grid.js +27 -51
- package/dist/esm/Image.js +47 -102
- package/dist/esm/ImagePreview.js +82 -135
- package/dist/esm/InfiniteLoading.js +77 -159
- package/dist/esm/Input.js +57 -125
- package/dist/esm/InputNumber.js +66 -96
- package/dist/esm/Layout.js +4 -28
- package/dist/esm/Loading.js +13 -40
- package/dist/esm/Menu.js +51 -105
- package/dist/esm/NavBar.js +46 -85
- package/dist/esm/NoticeBar.js +153 -226
- package/dist/esm/Notify.js +87 -178
- package/dist/esm/NumberKeyboard.js +84 -150
- package/dist/esm/Pagination.js +58 -97
- package/dist/esm/Picker.js +215 -276
- package/dist/esm/Popover.js +111 -159
- package/dist/esm/Price.js +23 -60
- package/dist/esm/Progress.js +47 -77
- package/dist/esm/PullToRefresh.js +94 -201
- package/dist/esm/RadioGroup.js +23 -53
- package/dist/esm/Range.js +113 -177
- package/dist/esm/Rate.js +48 -95
- package/dist/esm/Row.js +19 -43
- package/dist/esm/SearchBar.js +52 -119
- package/dist/esm/ShortPassword.js +58 -106
- package/dist/esm/SideNavBar.js +34 -59
- package/dist/esm/SideNavBarItem.js +7 -36
- package/dist/esm/Signature.js +49 -84
- package/dist/esm/Skeleton.js +31 -68
- package/dist/esm/Space.js +7 -34
- package/dist/esm/Step.js +35 -64
- package/dist/esm/Steps.js +16 -40
- package/dist/esm/Sticky.js +64 -108
- package/dist/esm/SubSideNavBar.js +42 -71
- package/dist/esm/Swipe.js +79 -143
- package/dist/esm/Swiper.js +136 -183
- package/dist/esm/SwiperItem.js +13 -38
- package/dist/esm/Switch.js +20 -53
- package/dist/esm/TabPane.js +6 -30
- package/dist/esm/Tabbar.js +29 -59
- package/dist/esm/Table.js +92 -141
- package/dist/esm/Tag.js +30 -74
- package/dist/esm/TextArea.js +37 -82
- package/dist/esm/TimeDetail.js +20 -58
- package/dist/esm/TimeSelect.js +57 -95
- package/dist/esm/Toast.js +110 -197
- package/dist/esm/Tour.js +88 -132
- package/dist/esm/TrendArrow.js +32 -74
- package/dist/esm/Uploader.js +226 -346
- package/dist/esm/UserContext.js +1 -1
- package/dist/esm/Video.js +34 -67
- package/dist/esm/VirtualList.js +127 -160
- package/dist/esm/WaterMark.js +24 -68
- package/dist/esm/badge2.js +23 -53
- package/dist/esm/button2.js +30 -63
- package/dist/esm/can-use-dom.js +1 -1
- package/dist/esm/cascader2.js +307 -536
- package/dist/esm/checkbox2.js +59 -96
- package/dist/esm/collapseitem2.js +48 -86
- package/dist/esm/configprovider2.js +43 -1003
- package/dist/esm/context.js +1 -1
- package/dist/esm/context2.js +1 -1
- package/dist/esm/context3.js +1 -1
- package/dist/esm/context4.js +1 -1
- package/dist/esm/context5.js +8 -8
- package/dist/esm/date.js +88 -66
- package/dist/esm/formitem2.js +236 -1510
- package/dist/esm/get-scroll-parent.js +8 -10
- package/dist/esm/griditem2.js +34 -52
- package/dist/esm/index.js +5 -12
- package/dist/esm/indicator2.js +13 -42
- package/dist/esm/menuitem2.js +81 -124
- package/dist/esm/overlay2.js +39 -78
- package/dist/esm/pad-zero.js +3 -4
- package/dist/esm/popup2.js +79 -124
- package/dist/esm/px-check.js +2 -2
- package/dist/esm/radio2.js +48 -79
- package/dist/esm/raf.js +5 -3
- package/dist/esm/render.js +17 -54
- package/dist/esm/safearea2.js +3 -5
- package/dist/esm/supports-passive.js +3 -3
- package/dist/esm/tabbaritem2.js +42 -58
- package/dist/esm/tabs2.js +82 -120
- package/dist/esm/tslib.es6.js +47 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo1.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo2.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo3.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo4.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo5.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo6.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo7.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo8.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo9.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo1.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo10.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo2.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo3.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo4.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo5.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo6.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo7.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo8.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo9.d.ts +3 -0
- package/dist/esm/types/src/packages/configprovider/configprovider.d.ts +1 -0
- package/dist/esm/types/src/packages/configprovider/configprovider.taro.d.ts +1 -0
- package/dist/esm/types/src/packages/configprovider/index.d.ts +2 -2
- package/dist/esm/types/src/packages/configprovider/index.taro.d.ts +2 -2
- package/dist/esm/types/src/packages/inputnumber/inputnumber.taro.d.ts +2 -0
- package/dist/esm/typings.js +1 -1
- package/dist/esm/use-click-away.js +9 -13
- package/dist/esm/use-client-rect.js +4 -4
- package/dist/esm/use-props-value.js +10 -15
- package/dist/esm/use-refs.js +5 -7
- package/dist/esm/use-touch.js +16 -20
- package/dist/locales/base.js +1 -1
- package/dist/locales/en-US.js +1 -1
- package/dist/locales/id-ID.js +1 -1
- package/dist/locales/tr-TR.js +1 -1
- package/dist/locales/zh-CN.js +1 -1
- package/dist/locales/zh-TW.js +1 -1
- package/dist/locales/zh-UG.js +1 -1
- package/dist/nutui.react.es.js +242 -284
- package/dist/nutui.react.umd.js +239 -281
- package/dist/style.mjs +1 -1
- package/dist/styles/variables-jmapp.scss +4 -0
- package/dist/types/packages/button/demos/h5/demo1.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo2.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo3.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo4.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo5.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo6.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo7.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo8.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo9.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo1.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo10.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo2.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo3.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo4.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo5.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo6.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo7.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo8.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo9.d.ts +3 -0
- package/dist/types/packages/configprovider/configprovider.d.ts +1 -0
- package/dist/types/packages/configprovider/configprovider.taro.d.ts +1 -0
- package/dist/types/packages/configprovider/index.d.ts +2 -2
- package/dist/types/packages/configprovider/index.taro.d.ts +2 -2
- package/dist/types/packages/empty/empty.d.ts +15 -3
- package/dist/types/packages/inputnumber/inputnumber.taro.d.ts +2 -0
- package/dist/types/packages/rate/rate.d.ts +1 -1
- package/package.json +5 -1
package/dist/esm/Col.js
CHANGED
|
@@ -1,61 +1,30 @@
|
|
|
1
|
-
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
|
-
function ownKeys(e, r) {
|
|
4
|
-
var t = Object.keys(e);
|
|
5
|
-
if (Object.getOwnPropertySymbols) {
|
|
6
|
-
var o = Object.getOwnPropertySymbols(e);
|
|
7
|
-
r && (o = o.filter(function(r2) {
|
|
8
|
-
return Object.getOwnPropertyDescriptor(e, r2).enumerable;
|
|
9
|
-
})), t.push.apply(t, o);
|
|
10
|
-
}
|
|
11
|
-
return t;
|
|
12
|
-
}
|
|
13
|
-
function _objectSpread(e) {
|
|
14
|
-
for (var r = 1; r < arguments.length; r++) {
|
|
15
|
-
var t = null != arguments[r] ? arguments[r] : {};
|
|
16
|
-
r % 2 ? ownKeys(Object(t), true).forEach(function(r2) {
|
|
17
|
-
_defineProperty(e, r2, t[r2]);
|
|
18
|
-
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r2) {
|
|
19
|
-
Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2));
|
|
20
|
-
});
|
|
21
|
-
}
|
|
22
|
-
return e;
|
|
23
|
-
}
|
|
24
1
|
import React__default, { useState, useContext, useEffect } from "react";
|
|
25
2
|
import classNames from "classnames";
|
|
26
3
|
import { D as DataContext } from "./UserContext.js";
|
|
27
4
|
import { C as ComponentDefaults } from "./typings.js";
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
offset
|
|
31
|
-
|
|
32
|
-
});
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
var _useContext = useContext(DataContext), gutter = _useContext.gutter;
|
|
38
|
-
var classs = function classs2() {
|
|
39
|
-
var prefixCls = "nut-col";
|
|
40
|
-
return "".concat(prefixCls, " ").concat(prefixCls, "-").concat(span, " ").concat(gutter ? "".concat(prefixCls, "-gutter") : "", " ").concat(prefixCls, "-offset-").concat(offset);
|
|
5
|
+
const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { span: "24", offset: "0", gutter: "0" });
|
|
6
|
+
const Col = (props) => {
|
|
7
|
+
const { className, style, span, offset, children, onClick } = Object.assign(Object.assign({}, defaultProps), props);
|
|
8
|
+
const [colName, setColName] = useState("");
|
|
9
|
+
const [colStyle, setColStyle] = useState({});
|
|
10
|
+
const { gutter } = useContext(DataContext);
|
|
11
|
+
const classs = () => {
|
|
12
|
+
const prefixCls = "nut-col";
|
|
13
|
+
return `${prefixCls} ${prefixCls}-${span} ${gutter ? `${prefixCls}-gutter` : ""} ${prefixCls}-offset-${offset}`;
|
|
41
14
|
};
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
style2.paddingLeft =
|
|
45
|
-
style2.paddingRight =
|
|
15
|
+
const getStyle = () => {
|
|
16
|
+
const style2 = {};
|
|
17
|
+
style2.paddingLeft = `${gutter / 2}px`;
|
|
18
|
+
style2.paddingRight = `${gutter / 2}px`;
|
|
46
19
|
return style2;
|
|
47
20
|
};
|
|
48
|
-
useEffect(
|
|
21
|
+
useEffect(() => {
|
|
49
22
|
setColName(classs);
|
|
50
23
|
setColStyle(getStyle);
|
|
51
24
|
}, [span, offset, gutter]);
|
|
52
|
-
return React__default.createElement("div", {
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
onClick: function onClick(e) {
|
|
56
|
-
_onClick && _onClick(e, "col");
|
|
57
|
-
}
|
|
58
|
-
}, children);
|
|
25
|
+
return React__default.createElement("div", { className: classNames(colName, className), style: Object.assign(Object.assign({}, style), colStyle), onClick: (e) => {
|
|
26
|
+
onClick && onClick(e, "col");
|
|
27
|
+
} }, children);
|
|
59
28
|
};
|
|
60
29
|
Col.defaultProps = defaultProps;
|
|
61
30
|
Col.displayName = "NutCol";
|
package/dist/esm/Collapse.js
CHANGED
|
@@ -1,50 +1,22 @@
|
|
|
1
|
-
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
|
-
function ownKeys(e, r) {
|
|
4
|
-
var t = Object.keys(e);
|
|
5
|
-
if (Object.getOwnPropertySymbols) {
|
|
6
|
-
var o = Object.getOwnPropertySymbols(e);
|
|
7
|
-
r && (o = o.filter(function(r2) {
|
|
8
|
-
return Object.getOwnPropertyDescriptor(e, r2).enumerable;
|
|
9
|
-
})), t.push.apply(t, o);
|
|
10
|
-
}
|
|
11
|
-
return t;
|
|
12
|
-
}
|
|
13
|
-
function _objectSpread(e) {
|
|
14
|
-
for (var r = 1; r < arguments.length; r++) {
|
|
15
|
-
var t = null != arguments[r] ? arguments[r] : {};
|
|
16
|
-
r % 2 ? ownKeys(Object(t), true).forEach(function(r2) {
|
|
17
|
-
_defineProperty(e, r2, t[r2]);
|
|
18
|
-
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r2) {
|
|
19
|
-
Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2));
|
|
20
|
-
});
|
|
21
|
-
}
|
|
22
|
-
return e;
|
|
23
|
-
}
|
|
24
1
|
import React__default, { useCallback } from "react";
|
|
25
2
|
import classNames from "classnames";
|
|
26
3
|
import { C as ComponentDefaults } from "./typings.js";
|
|
27
4
|
import { a as CollapseContext, C as CollapseItem } from "./collapseitem2.js";
|
|
28
5
|
import { u as usePropsValue } from "./use-props-value.js";
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
accordion
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
});
|
|
35
|
-
var Collapse = function Collapse2(props) {
|
|
36
|
-
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, style = _defaultProps$props.style, children = _defaultProps$props.children, activeName = _defaultProps$props.activeName, defaultActiveName = _defaultProps$props.defaultActiveName, accordion = _defaultProps$props.accordion, expandIcon = _defaultProps$props.expandIcon, rotate = _defaultProps$props.rotate, onChange = _defaultProps$props.onChange;
|
|
37
|
-
var classPrefix = "nut-collapse";
|
|
38
|
-
var _usePropsValue = usePropsValue({
|
|
6
|
+
const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { defaultActiveName: [], accordion: false, expandIcon: null, rotate: 180 });
|
|
7
|
+
const Collapse = (props) => {
|
|
8
|
+
const { className, style, children, activeName, defaultActiveName, accordion, expandIcon, rotate, onChange } = Object.assign(Object.assign({}, defaultProps), props);
|
|
9
|
+
const classPrefix = "nut-collapse";
|
|
10
|
+
const [value, setValue] = usePropsValue({
|
|
39
11
|
value: activeName,
|
|
40
12
|
defaultValue: defaultActiveName,
|
|
41
13
|
finalValue: []
|
|
42
|
-
})
|
|
43
|
-
|
|
14
|
+
});
|
|
15
|
+
const changeVal = (newValue, name, isOpen2) => {
|
|
44
16
|
setValue(newValue);
|
|
45
17
|
onChange && onChange(newValue, name, isOpen2);
|
|
46
18
|
};
|
|
47
|
-
|
|
19
|
+
const updateValue = (name) => {
|
|
48
20
|
if (accordion) {
|
|
49
21
|
if (value === name) {
|
|
50
22
|
changeVal("", name, false);
|
|
@@ -53,19 +25,17 @@ var Collapse = function Collapse2(props) {
|
|
|
53
25
|
}
|
|
54
26
|
} else if (Array.isArray(value)) {
|
|
55
27
|
if (value.includes(name)) {
|
|
56
|
-
|
|
57
|
-
return v !== name;
|
|
58
|
-
});
|
|
28
|
+
const newValue = value.filter((v) => v !== name);
|
|
59
29
|
changeVal(newValue, name, false);
|
|
60
30
|
} else {
|
|
61
|
-
|
|
62
|
-
changeVal(
|
|
31
|
+
const newValue = value.concat([name]);
|
|
32
|
+
changeVal(newValue, name, true);
|
|
63
33
|
}
|
|
64
34
|
} else {
|
|
65
35
|
console.warn("[NutUI] <Collapse> 未开启手风琴模式时 activeName 应为数组");
|
|
66
36
|
}
|
|
67
37
|
};
|
|
68
|
-
|
|
38
|
+
const isOpen = useCallback((name) => {
|
|
69
39
|
if (accordion) {
|
|
70
40
|
return value === name;
|
|
71
41
|
}
|
|
@@ -74,17 +44,16 @@ var Collapse = function Collapse2(props) {
|
|
|
74
44
|
}
|
|
75
45
|
return false;
|
|
76
46
|
}, [accordion, value]);
|
|
77
|
-
return React__default.createElement(
|
|
78
|
-
|
|
47
|
+
return React__default.createElement(
|
|
48
|
+
CollapseContext.Provider,
|
|
49
|
+
{ value: {
|
|
79
50
|
isOpen,
|
|
80
51
|
updateValue,
|
|
81
52
|
expandIcon,
|
|
82
53
|
rotate
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
style
|
|
87
|
-
}, children));
|
|
54
|
+
} },
|
|
55
|
+
React__default.createElement("div", { className: classNames(classPrefix, className), style }, children)
|
|
56
|
+
);
|
|
88
57
|
};
|
|
89
58
|
Collapse.defaultProps = defaultProps;
|
|
90
59
|
Collapse.displayName = "NutCollapse";
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { C as ConfigProvider } from "./configprovider2.js";
|
|
2
|
-
import { g, s, u } from "./configprovider2.js";
|
|
2
|
+
import { g, s, u, a } from "./configprovider2.js";
|
|
3
3
|
export {
|
|
4
4
|
ConfigProvider as default,
|
|
5
5
|
g as getDefaultConfig,
|
|
6
6
|
s as setDefaultConfig,
|
|
7
|
-
u as useConfig
|
|
7
|
+
u as useConfig,
|
|
8
|
+
a as useRtl
|
|
8
9
|
};
|
package/dist/esm/CountDown.js
CHANGED
|
@@ -1,49 +1,15 @@
|
|
|
1
|
-
import
|
|
2
|
-
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
4
|
-
var _excluded = ["paused", "startTime", "endTime", "remainingTime", "millisecond", "format", "autoStart", "time", "destroy", "className", "style", "onEnd", "onPaused", "onRestart", "onUpdate", "children"];
|
|
5
|
-
function ownKeys(e, r) {
|
|
6
|
-
var t = Object.keys(e);
|
|
7
|
-
if (Object.getOwnPropertySymbols) {
|
|
8
|
-
var o = Object.getOwnPropertySymbols(e);
|
|
9
|
-
r && (o = o.filter(function(r2) {
|
|
10
|
-
return Object.getOwnPropertyDescriptor(e, r2).enumerable;
|
|
11
|
-
})), t.push.apply(t, o);
|
|
12
|
-
}
|
|
13
|
-
return t;
|
|
14
|
-
}
|
|
15
|
-
function _objectSpread(e) {
|
|
16
|
-
for (var r = 1; r < arguments.length; r++) {
|
|
17
|
-
var t = null != arguments[r] ? arguments[r] : {};
|
|
18
|
-
r % 2 ? ownKeys(Object(t), true).forEach(function(r2) {
|
|
19
|
-
_defineProperty(e, r2, t[r2]);
|
|
20
|
-
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r2) {
|
|
21
|
-
Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2));
|
|
22
|
-
});
|
|
23
|
-
}
|
|
24
|
-
return e;
|
|
25
|
-
}
|
|
1
|
+
import { _ as __rest } from "./tslib.es6.js";
|
|
26
2
|
import React__default, { useState, useRef, useImperativeHandle, useEffect } from "react";
|
|
27
3
|
import { useConfig } from "./ConfigProvider.js";
|
|
28
4
|
import { C as ComponentDefaults } from "./typings.js";
|
|
29
5
|
import { p as padZero } from "./pad-zero.js";
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
startTime: Date.now(),
|
|
33
|
-
endTime: Date.now(),
|
|
34
|
-
remainingTime: 0,
|
|
35
|
-
millisecond: false,
|
|
36
|
-
format: "HH:mm:ss",
|
|
37
|
-
autoStart: true,
|
|
38
|
-
time: 0,
|
|
39
|
-
destroy: false
|
|
40
|
-
});
|
|
41
|
-
var InternalCountDown = function InternalCountDown2(props, ref) {
|
|
6
|
+
const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { paused: false, startTime: Date.now(), endTime: Date.now(), remainingTime: 0, millisecond: false, format: "HH:mm:ss", autoStart: true, time: 0, destroy: false });
|
|
7
|
+
const InternalCountDown = (props, ref) => {
|
|
42
8
|
useConfig();
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
9
|
+
const _a = Object.assign(Object.assign({}, defaultProps), props), { paused, startTime, endTime, remainingTime, millisecond, format, autoStart, time, destroy, className, style, onEnd, onPaused, onRestart, onUpdate, children } = _a, rest = __rest(_a, ["paused", "startTime", "endTime", "remainingTime", "millisecond", "format", "autoStart", "time", "destroy", "className", "style", "onEnd", "onPaused", "onRestart", "onUpdate", "children"]);
|
|
10
|
+
const classPrefix = "nut-countdown";
|
|
11
|
+
const [restTimeStamp, setRestTime] = useState(0);
|
|
12
|
+
const stateRef = useRef({
|
|
47
13
|
pauseTime: 0,
|
|
48
14
|
curr: 0,
|
|
49
15
|
isPaused: paused,
|
|
@@ -55,14 +21,14 @@ var InternalCountDown = function InternalCountDown2(props, ref) {
|
|
|
55
21
|
diffTime: 0
|
|
56
22
|
// 设置了 startTime 时,与 date.now() 的差异
|
|
57
23
|
});
|
|
58
|
-
|
|
24
|
+
const getTimeStamp = (timeStr) => {
|
|
59
25
|
if (!timeStr)
|
|
60
26
|
return Date.now();
|
|
61
|
-
|
|
27
|
+
let t = timeStr;
|
|
62
28
|
t = t > 0 ? +t : t.toString().replace(/-/g, "/");
|
|
63
29
|
return new Date(t).getTime();
|
|
64
30
|
};
|
|
65
|
-
|
|
31
|
+
const initTime = () => {
|
|
66
32
|
if (remainingTime) {
|
|
67
33
|
stateRef.current.handleEndTime = Date.now() + Number(remainingTime);
|
|
68
34
|
} else {
|
|
@@ -73,11 +39,11 @@ var InternalCountDown = function InternalCountDown2(props, ref) {
|
|
|
73
39
|
stateRef.current.counting = true;
|
|
74
40
|
tick();
|
|
75
41
|
};
|
|
76
|
-
|
|
77
|
-
stateRef.current.timer = requestAnimationFrame(
|
|
42
|
+
const tick = () => {
|
|
43
|
+
stateRef.current.timer = requestAnimationFrame(() => {
|
|
78
44
|
if (stateRef.current.counting) {
|
|
79
|
-
|
|
80
|
-
|
|
45
|
+
const currentTime = Date.now() - stateRef.current.diffTime;
|
|
46
|
+
const remainTime = Math.max(stateRef.current.handleEndTime - currentTime, 0);
|
|
81
47
|
stateRef.current.restTime = remainTime;
|
|
82
48
|
setRestTime(remainTime);
|
|
83
49
|
if (!remainTime) {
|
|
@@ -86,24 +52,24 @@ var InternalCountDown = function InternalCountDown2(props, ref) {
|
|
|
86
52
|
onEnd && onEnd();
|
|
87
53
|
}
|
|
88
54
|
if (remainTime > 0) {
|
|
89
|
-
|
|
55
|
+
tick();
|
|
90
56
|
}
|
|
91
57
|
}
|
|
92
58
|
});
|
|
93
59
|
};
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
60
|
+
const formatRemainTime = (t, type) => {
|
|
61
|
+
const ts = t;
|
|
62
|
+
const rest2 = {
|
|
97
63
|
d: 0,
|
|
98
64
|
h: 0,
|
|
99
65
|
m: 0,
|
|
100
66
|
s: 0,
|
|
101
67
|
ms: 0
|
|
102
68
|
};
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
69
|
+
const SECOND = 1e3;
|
|
70
|
+
const MINUTE = 60 * SECOND;
|
|
71
|
+
const HOUR = 60 * MINUTE;
|
|
72
|
+
const DAY = 24 * HOUR;
|
|
107
73
|
if (ts > 0) {
|
|
108
74
|
rest2.d = ts >= SECOND ? Math.floor(ts / DAY) : 0;
|
|
109
75
|
rest2.h = Math.floor(ts % DAY / HOUR);
|
|
@@ -111,12 +77,12 @@ var InternalCountDown = function InternalCountDown2(props, ref) {
|
|
|
111
77
|
rest2.s = Math.floor(ts % MINUTE / SECOND);
|
|
112
78
|
rest2.ms = Math.floor(ts % SECOND);
|
|
113
79
|
}
|
|
114
|
-
return type === "custom" ? rest2 : parseFormat(
|
|
80
|
+
return type === "custom" ? rest2 : parseFormat(Object.assign({}, rest2));
|
|
115
81
|
};
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
82
|
+
const parseFormat = (time2) => {
|
|
83
|
+
const { d } = time2;
|
|
84
|
+
let { h, m, s, ms } = time2;
|
|
85
|
+
let formatCache = format;
|
|
120
86
|
if (formatCache.includes("DD")) {
|
|
121
87
|
formatCache = formatCache.replace("DD", padZero(d));
|
|
122
88
|
} else {
|
|
@@ -138,7 +104,7 @@ var InternalCountDown = function InternalCountDown2(props, ref) {
|
|
|
138
104
|
ms += Number(s) * 1e3;
|
|
139
105
|
}
|
|
140
106
|
if (formatCache.includes("S")) {
|
|
141
|
-
|
|
107
|
+
const msC = padZero(ms, 3).toString();
|
|
142
108
|
if (formatCache.includes("SSS")) {
|
|
143
109
|
formatCache = formatCache.replace("SSS", msC);
|
|
144
110
|
} else if (formatCache.includes("SS")) {
|
|
@@ -149,40 +115,38 @@ var InternalCountDown = function InternalCountDown2(props, ref) {
|
|
|
149
115
|
}
|
|
150
116
|
return formatCache;
|
|
151
117
|
};
|
|
152
|
-
|
|
118
|
+
const pause = () => {
|
|
153
119
|
cancelAnimationFrame(stateRef.current.timer);
|
|
154
120
|
stateRef.current.counting = false;
|
|
155
121
|
onPaused && onPaused(stateRef.current.restTime);
|
|
156
122
|
};
|
|
157
|
-
useImperativeHandle(ref,
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
onRestart && onRestart(stateRef.current.restTime);
|
|
165
|
-
}
|
|
166
|
-
},
|
|
167
|
-
pause: function pause2() {
|
|
168
|
-
cancelAnimationFrame(stateRef.current.timer);
|
|
169
|
-
stateRef.current.counting = false;
|
|
170
|
-
onPaused && onPaused(stateRef.current.restTime);
|
|
171
|
-
},
|
|
172
|
-
reset: function reset() {
|
|
173
|
-
if (!autoStart) {
|
|
174
|
-
pause();
|
|
175
|
-
stateRef.current.restTime = time;
|
|
176
|
-
setRestTime(time);
|
|
177
|
-
}
|
|
123
|
+
useImperativeHandle(ref, () => ({
|
|
124
|
+
start: () => {
|
|
125
|
+
if (!stateRef.current.counting && !autoStart) {
|
|
126
|
+
stateRef.current.counting = true;
|
|
127
|
+
stateRef.current.handleEndTime = Date.now() + Number(stateRef.current.restTime);
|
|
128
|
+
tick();
|
|
129
|
+
onRestart && onRestart(stateRef.current.restTime);
|
|
178
130
|
}
|
|
179
|
-
}
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
131
|
+
},
|
|
132
|
+
pause: () => {
|
|
133
|
+
cancelAnimationFrame(stateRef.current.timer);
|
|
134
|
+
stateRef.current.counting = false;
|
|
135
|
+
onPaused && onPaused(stateRef.current.restTime);
|
|
136
|
+
},
|
|
137
|
+
reset: () => {
|
|
138
|
+
if (!autoStart) {
|
|
139
|
+
pause();
|
|
140
|
+
stateRef.current.restTime = time;
|
|
141
|
+
setRestTime(time);
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
}));
|
|
145
|
+
useEffect(() => {
|
|
146
|
+
const tranTime = formatRemainTime(stateRef.current.restTime, "custom");
|
|
183
147
|
onUpdate && onUpdate(tranTime);
|
|
184
148
|
}, [restTimeStamp]);
|
|
185
|
-
useEffect(
|
|
149
|
+
useEffect(() => {
|
|
186
150
|
if (stateRef.current.isIninted) {
|
|
187
151
|
if (paused) {
|
|
188
152
|
if (stateRef.current.counting) {
|
|
@@ -198,12 +162,12 @@ var InternalCountDown = function InternalCountDown2(props, ref) {
|
|
|
198
162
|
}
|
|
199
163
|
}
|
|
200
164
|
}, [paused]);
|
|
201
|
-
useEffect(
|
|
165
|
+
useEffect(() => {
|
|
202
166
|
if (stateRef.current.isIninted) {
|
|
203
167
|
initTime();
|
|
204
168
|
}
|
|
205
169
|
}, [endTime, startTime, remainingTime]);
|
|
206
|
-
useEffect(
|
|
170
|
+
useEffect(() => {
|
|
207
171
|
if (autoStart) {
|
|
208
172
|
initTime();
|
|
209
173
|
} else {
|
|
@@ -215,24 +179,21 @@ var InternalCountDown = function InternalCountDown2(props, ref) {
|
|
|
215
179
|
}
|
|
216
180
|
return componentWillUnmount;
|
|
217
181
|
}, []);
|
|
218
|
-
|
|
182
|
+
const componentWillUnmount = () => {
|
|
219
183
|
destroy && cancelAnimationFrame(stateRef.current.timer);
|
|
220
184
|
};
|
|
221
|
-
|
|
185
|
+
const renderTime = (() => {
|
|
222
186
|
return formatRemainTime(stateRef.current.restTime);
|
|
223
|
-
}();
|
|
224
|
-
return React__default.createElement("div",
|
|
225
|
-
className:
|
|
226
|
-
style: _objectSpread({}, style)
|
|
227
|
-
}, rest), children || React__default.createElement("div", {
|
|
228
|
-
className: "".concat(classPrefix, "-block"),
|
|
187
|
+
})();
|
|
188
|
+
return React__default.createElement("div", Object.assign({ className: `${classPrefix} ${className}`, style: Object.assign({}, style) }, rest), children || React__default.createElement("div", {
|
|
189
|
+
className: `${classPrefix}-block`,
|
|
229
190
|
// eslint-disable-next-line react/no-danger
|
|
230
191
|
dangerouslySetInnerHTML: {
|
|
231
|
-
__html:
|
|
192
|
+
__html: `${renderTime}`
|
|
232
193
|
}
|
|
233
194
|
}));
|
|
234
195
|
};
|
|
235
|
-
|
|
196
|
+
const CountDown = React__default.forwardRef(InternalCountDown);
|
|
236
197
|
CountDown.defaultProps = defaultProps;
|
|
237
198
|
CountDown.displayName = "NutCountDown";
|
|
238
199
|
export {
|