@trionesdev/antd-taro-react 0.0.2-beta.2 → 0.0.2-beta.21
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/dist/ActionSheet/ActionSheet.d.ts +25 -0
- package/dist/ActionSheet/ActionSheet.js +77 -0
- package/dist/ActionSheet/index.d.ts +1 -1
- package/dist/ActionSheet/index.js +1 -1
- package/dist/ActionSheet/style.scss +52 -0
- package/dist/Button/button.d.ts +2 -1
- package/dist/Button/button.js +2 -3
- package/dist/Button/style.scss +65 -50
- package/dist/Calendar/calendar-grid.d.ts +10 -9
- package/dist/Calendar/calendar-grid.js +37 -62
- package/dist/Calendar/calendar-header.d.ts +3 -2
- package/dist/Calendar/calendar-header.js +9 -6
- package/dist/Calendar/calendar-range.d.ts +4 -3
- package/dist/Calendar/calendar-range.js +22 -18
- package/dist/Calendar/calendar.d.ts +5 -4
- package/dist/Calendar/calendar.js +30 -17
- package/dist/Calendar/style.scss +8 -5
- package/dist/Calendar/touchable-calendar-grid.d.ts +6 -5
- package/dist/Calendar/touchable-calendar-grid.js +87 -86
- package/dist/CalendarDatetimePicker/CalendarDatetimePicker.d.ts +3 -2
- package/dist/CalendarDatetimePicker/CalendarDatetimePicker.js +40 -57
- package/dist/CalendarDatetimePicker/DateTimeSwitch.d.ts +3 -2
- package/dist/CalendarDatetimePicker/DateTimeSwitch.js +2 -2
- package/dist/CalendarDatetimePicker/style.scss +11 -3
- package/dist/CalendarDatetimePickerCell/CalendarDatetimePickerCell.d.ts +9 -0
- package/dist/CalendarDatetimePickerCell/CalendarDatetimePickerCell.js +60 -0
- package/dist/CalendarDatetimePickerCell/index.d.ts +3 -0
- package/dist/CalendarDatetimePickerCell/index.js +2 -0
- package/dist/CalendarPicker/{calendar-picker.js → CalendarPicker.js} +10 -6
- package/dist/CalendarPicker/{calendar-range-picker.js → CalendarRangePicker.js} +8 -6
- package/dist/CalendarPicker/index.d.ts +3 -4
- package/dist/CalendarPicker/index.js +2 -2
- package/dist/CalendarPicker/style.scss +7 -6
- package/dist/CalendarPicker/types.d.ts +8 -6
- package/dist/CalendarPicker/types.js +1 -1
- package/dist/CalendarPickerCell/CalendarPickerCell.d.ts +11 -0
- package/dist/CalendarPickerCell/CalendarPickerCell.js +54 -0
- package/dist/CalendarPickerCell/CalendarRangePickerCell.d.ts +11 -0
- package/dist/CalendarPickerCell/CalendarRangePickerCell.js +56 -0
- package/dist/CalendarPickerCell/index.d.ts +8 -0
- package/dist/CalendarPickerCell/index.js +5 -0
- package/dist/CascaderPicker/cascader-picker.d.ts +27 -0
- package/dist/CascaderPicker/cascader-picker.js +90 -0
- package/dist/CascaderPicker/index.d.ts +1 -1
- package/dist/CascaderPicker/index.js +1 -1
- package/dist/CascaderPicker/style.scss +45 -0
- package/dist/CascaderPickerCell/CascaderPickerCell.d.ts +20 -0
- package/dist/CascaderPickerCell/CascaderPickerCell.js +70 -0
- package/dist/CascaderPickerCell/index.d.ts +3 -0
- package/dist/CascaderPickerCell/index.js +2 -0
- package/dist/DatePicker/DatePicker.d.ts +18 -0
- package/dist/DatePicker/DatePicker.js +310 -0
- package/dist/DatePicker/index.d.ts +4 -0
- package/dist/DatePicker/index.js +3 -0
- package/dist/DatePicker/style.scss +41 -0
- package/dist/DatePicker/types.d.ts +1 -0
- package/dist/DatePicker/types.js +1 -0
- package/dist/DatePickerCell/DatePickerCell.d.ts +16 -0
- package/dist/DatePickerCell/DatePickerCell.js +78 -0
- package/dist/DatePickerCell/index.d.ts +3 -0
- package/dist/DatePickerCell/index.js +2 -0
- package/dist/FetchPicker/FetchPicker.d.ts +78 -0
- package/dist/FetchPicker/FetchPicker.js +310 -0
- package/dist/FetchPicker/index.d.ts +4 -0
- package/dist/FetchPicker/index.js +3 -0
- package/dist/FetchPicker/styles.scss +130 -0
- package/dist/FloatButton/FloatButton.d.ts +19 -0
- package/dist/FloatButton/FloatButton.js +60 -0
- package/dist/FloatButton/FloatButtonGroup.d.ts +21 -0
- package/dist/FloatButton/FloatButtonGroup.js +141 -0
- package/dist/FloatButton/context.d.ts +10 -0
- package/dist/FloatButton/context.js +2 -0
- package/dist/FloatButton/index.d.ts +10 -0
- package/dist/FloatButton/index.js +5 -0
- package/dist/FloatButton/style.scss +126 -0
- package/dist/Form/FormItem/form-item-content.d.ts +17 -0
- package/dist/Form/FormItem/form-item-content.js +39 -0
- package/dist/Form/FormItem/form-item-label.d.ts +13 -0
- package/dist/Form/FormItem/form-item-label.js +29 -0
- package/dist/Form/FormItem/form-item.d.ts +23 -0
- package/dist/Form/FormItem/form-item.js +77 -0
- package/dist/Form/FormItem/index.d.ts +5 -0
- package/dist/Form/FormItem/index.js +3 -0
- package/dist/Form/index.d.ts +9 -2
- package/dist/Form/index.js +5 -1
- package/dist/Form/style.scss +100 -0
- package/dist/FormCell/index.d.ts +3 -0
- package/dist/FormCell/index.js +2 -0
- package/dist/ImagesPreview/ImagesPreview.js +4 -3
- package/dist/ImagesWall/ImagesWall.js +1 -1
- package/dist/Input/index.d.ts +17 -2
- package/dist/Input/index.js +13 -1
- package/dist/Input/index.scss +282 -0
- package/dist/Input/input-affix-wrapper.d.ts +13 -0
- package/dist/Input/input-affix-wrapper.js +37 -0
- package/dist/Input/input-digit.d.ts +7 -0
- package/dist/Input/input-digit.js +53 -0
- package/dist/Input/input-number.d.ts +7 -0
- package/dist/Input/input-number.js +50 -0
- package/dist/Input/input-opt.d.ts +16 -0
- package/dist/Input/input-opt.js +87 -0
- package/dist/Input/input-password.d.ts +8 -0
- package/dist/Input/input-password.js +49 -0
- package/dist/Input/input.d.ts +3 -0
- package/dist/Input/input.js +7 -0
- package/dist/Input/taro-input.d.ts +8 -0
- package/dist/Input/taro-input.js +70 -0
- package/dist/Input/textarea.d.ts +15 -0
- package/dist/Input/textarea.js +52 -0
- package/dist/Input/types.d.ts +20 -0
- package/dist/Input/types.js +2 -0
- package/dist/Loading/index.d.ts +4 -0
- package/dist/Loading/index.js +3 -0
- package/dist/Overlay/Overlay.d.ts +17 -0
- package/dist/Overlay/Overlay.js +100 -0
- package/dist/Overlay/index.d.ts +4 -0
- package/dist/Overlay/index.js +3 -0
- package/dist/Overlay/style.scss +20 -0
- package/dist/Picker/Picker.d.ts +27 -0
- package/dist/Picker/Picker.js +100 -0
- package/dist/Picker/index.d.ts +1 -1
- package/dist/Picker/index.js +1 -1
- package/dist/Picker/style.scss +41 -0
- package/dist/PickerView/PickerView.d.ts +4 -0
- package/dist/PickerView/PickerView.js +71 -0
- package/dist/PickerView/index.d.ts +2 -2
- package/dist/PickerView/index.js +1 -1
- package/dist/PickerView/style.scss +13 -0
- package/dist/PickerView/types.d.ts +15 -0
- package/dist/PickerView/types.js +1 -0
- package/dist/Popup/Popup.d.ts +48 -0
- package/dist/Popup/Popup.js +135 -0
- package/dist/Popup/index.d.ts +2 -1
- package/dist/Popup/index.js +2 -1
- package/dist/Popup/style.scss +126 -0
- package/dist/Progress/index.d.ts +1 -1
- package/dist/Progress/index.js +1 -1
- package/dist/Segmented/index.d.ts +3 -0
- package/dist/Segmented/index.js +2 -0
- package/dist/SideBar/side-bar.js +3 -2
- package/dist/SideBar/style.scss +6 -6
- package/dist/Stepper/index.d.ts +3 -0
- package/dist/Stepper/index.js +2 -0
- package/dist/Toast/Toast.d.ts +18 -0
- package/dist/Toast/Toast.js +112 -0
- package/dist/Toast/index.d.ts +1 -1
- package/dist/Toast/index.js +1 -1
- package/dist/Toast/style.scss +63 -0
- package/dist/VerificationCodeInput/index.d.ts +2 -2
- package/dist/VerificationCodeInput/index.js +1 -1
- package/dist/VerificationCodeInput/style.scss +20 -0
- package/dist/VerificationCodeInput/verification-code-input.d.ts +24 -0
- package/dist/VerificationCodeInput/verification-code-input.js +99 -0
- package/dist/index.d.ts +28 -7
- package/dist/index.js +12 -2
- package/dist/style/variable.scss +33 -0
- package/dist/types.d.ts +0 -1
- package/dist/utils/dayjs.d.ts +4 -0
- package/dist/utils/dayjs.js +42 -0
- package/package.json +25 -30
- package/dist/Mask/index.d.ts +0 -3
- package/dist/Mask/index.js +0 -2
- package/dist/Progress/Progress.d.ts +0 -38
- package/dist/Progress/Progress.js +0 -53
- package/dist/Progress/ProgressCircle.d.ts +0 -16
- package/dist/Progress/ProgressCircle.js +0 -147
- package/dist/Progress/ProgressLine.d.ts +0 -15
- package/dist/Progress/ProgressLine.js +0 -87
- package/dist/Progress/style.scss +0 -33
- package/dist/Progress/types.d.ts +0 -4
- package/dist/Progress/types.js +0 -2
- package/dist/SpinLoading/index.d.ts +0 -3
- package/dist/SpinLoading/index.js +0 -2
- /package/dist/CalendarPicker/{calendar-picker.d.ts → CalendarPicker.d.ts} +0 -0
- /package/dist/CalendarPicker/{calendar-range-picker.d.ts → CalendarRangePicker.d.ts} +0 -0
|
@@ -1,8 +1,4 @@
|
|
|
1
1
|
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
-
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
3
|
-
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
4
|
-
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
5
|
-
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
6
2
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
7
3
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
8
4
|
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); }
|
|
@@ -16,41 +12,32 @@ import classNames from 'classnames';
|
|
|
16
12
|
import { isEmpty } from 'lodash-es';
|
|
17
13
|
import React, { forwardRef, memo, useEffect, useMemo, useState } from 'react';
|
|
18
14
|
import "./style.scss";
|
|
15
|
+
import dayjs from "dayjs";
|
|
16
|
+
import { isSame } from "../utils/dayjs";
|
|
19
17
|
var calendarCls = 'triones-antm-calendar';
|
|
20
18
|
var CalendarCell = /*#__PURE__*/memo(function (_ref) {
|
|
21
|
-
var _ref$
|
|
22
|
-
|
|
19
|
+
var _ref$month = _ref.month,
|
|
20
|
+
month = _ref$month === void 0 ? dayjs() : _ref$month,
|
|
23
21
|
_ref$date = _ref.date,
|
|
24
|
-
date = _ref$date === void 0 ?
|
|
22
|
+
date = _ref$date === void 0 ? dayjs() : _ref$date,
|
|
25
23
|
value = _ref.value,
|
|
26
24
|
range = _ref.range,
|
|
27
25
|
onSelect = _ref.onSelect;
|
|
28
26
|
var disabled = useMemo(function () {
|
|
29
|
-
return date
|
|
30
|
-
}, [date,
|
|
27
|
+
return !isSame(date, month, 'month');
|
|
28
|
+
}, [date, month]);
|
|
31
29
|
var selected = useMemo(function () {
|
|
32
30
|
if (disabled || isEmpty(value)) {
|
|
33
31
|
return false;
|
|
34
32
|
}
|
|
35
|
-
if (value !== null && value !== void 0 && value[0]) {
|
|
36
|
-
var _value$;
|
|
37
|
-
value === null || value === void 0 || (_value$ = value[0]) === null || _value$ === void 0 || _value$.setHours(0, 0, 0, 0);
|
|
38
|
-
}
|
|
39
|
-
if (value !== null && value !== void 0 && value[1]) {
|
|
40
|
-
var _value$2;
|
|
41
|
-
value === null || value === void 0 || (_value$2 = value[1]) === null || _value$2 === void 0 || _value$2.setHours(0, 0, 0, 0);
|
|
42
|
-
}
|
|
43
|
-
date.setHours(0, 0, 0, 0);
|
|
44
33
|
if (range) {
|
|
45
34
|
var startDate = value === null || value === void 0 ? void 0 : value[0];
|
|
46
35
|
var endDate = value === null || value === void 0 ? void 0 : value[1];
|
|
47
|
-
|
|
48
|
-
return date.getTime() === (startDate === null || startDate === void 0 ? void 0 : startDate.getTime()) || date.getTime() === (endDate === null || endDate === void 0 ? void 0 : endDate.getTime());
|
|
36
|
+
return isSame(date, startDate, 'date') || isSame(date, endDate, 'date');
|
|
49
37
|
} else {
|
|
50
|
-
|
|
51
|
-
return date.getTime() === (value === null || value === void 0 || (_value$3 = value[0]) === null || _value$3 === void 0 ? void 0 : _value$3.getTime());
|
|
38
|
+
return isSame(date, value === null || value === void 0 ? void 0 : value[0], 'date');
|
|
52
39
|
}
|
|
53
|
-
}, [
|
|
40
|
+
}, [month, date, value]);
|
|
54
41
|
var selectedRange = useMemo(function () {
|
|
55
42
|
if (disabled || !range) {
|
|
56
43
|
return false;
|
|
@@ -60,13 +47,10 @@ var CalendarCell = /*#__PURE__*/memo(function (_ref) {
|
|
|
60
47
|
if (!startDate || !endDate) {
|
|
61
48
|
return false;
|
|
62
49
|
}
|
|
63
|
-
date.
|
|
64
|
-
|
|
65
|
-
endDate.setHours(0, 0, 0, 0);
|
|
66
|
-
return date.getTime() > startDate.getTime() && date.getTime() < endDate.getTime();
|
|
67
|
-
}, [mouth, date, value]);
|
|
50
|
+
return dayjs(date).isAfter(startDate, 'date') && dayjs(date).isBefore(endDate, 'date');
|
|
51
|
+
}, [month, date, value]);
|
|
68
52
|
return /*#__PURE__*/React.createElement("div", {
|
|
69
|
-
className: classNames("".concat(calendarCls, "-cell"), _defineProperty(_defineProperty(_defineProperty({}, "".concat(calendarCls, "-cell-disabled"), disabled), "".concat(calendarCls, "-cell-selected"), selected), "".concat(calendarCls, "-cell-selected-range"), selectedRange))
|
|
53
|
+
className: classNames("".concat(calendarCls, "-cell"), _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(calendarCls, "-cell-disabled"), disabled), "".concat(calendarCls, "-cell-selected"), selected), "".concat(calendarCls, "-cell-today"), isSame(date, dayjs(), 'day')), "".concat(calendarCls, "-cell-selected-range"), selectedRange))
|
|
70
54
|
// style={{ width: size, height: size }}
|
|
71
55
|
,
|
|
72
56
|
onClick: function onClick() {
|
|
@@ -74,14 +58,14 @@ var CalendarCell = /*#__PURE__*/memo(function (_ref) {
|
|
|
74
58
|
}
|
|
75
59
|
}, /*#__PURE__*/React.createElement("div", {
|
|
76
60
|
className: classNames("".concat(calendarCls, "-cell-date"))
|
|
77
|
-
}, date.
|
|
61
|
+
}, dayjs(date).date()), dayjs(date).date() === 1 && /*#__PURE__*/React.createElement("div", {
|
|
78
62
|
className: classNames("".concat(calendarCls, "-cell-mouth"))
|
|
79
|
-
}, "".concat(date.
|
|
63
|
+
}, "".concat(dayjs(date).month() + 1, "\u6708")));
|
|
80
64
|
});
|
|
81
65
|
export var CalendarGrid = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref2, ref) {
|
|
82
66
|
var _ref3;
|
|
83
|
-
var _ref2$
|
|
84
|
-
|
|
67
|
+
var _ref2$month = _ref2.month,
|
|
68
|
+
month = _ref2$month === void 0 ? dayjs() : _ref2$month,
|
|
85
69
|
value = _ref2.value,
|
|
86
70
|
defaultValue = _ref2.defaultValue,
|
|
87
71
|
_ref2$range = _ref2.range,
|
|
@@ -93,14 +77,13 @@ export var CalendarGrid = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_
|
|
|
93
77
|
innerValue = _useState2[0],
|
|
94
78
|
setInnerValue = _useState2[1];
|
|
95
79
|
var handleSelect = function handleSelect(date) {
|
|
96
|
-
date.setHours(0, 0, 0, 0);
|
|
97
80
|
var _value = innerValue;
|
|
98
81
|
if (range) {
|
|
99
82
|
if (!_value[0]) {
|
|
100
83
|
_value = [date];
|
|
101
84
|
} else if (!_value[1]) {
|
|
102
85
|
var startDate = _value[0];
|
|
103
|
-
if (date.
|
|
86
|
+
if (dayjs(date).isBefore(startDate, 'date')) {
|
|
104
87
|
_value = [date, startDate];
|
|
105
88
|
} else {
|
|
106
89
|
_value = [startDate, date];
|
|
@@ -116,35 +99,27 @@ export var CalendarGrid = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_
|
|
|
116
99
|
onChange === null || onChange === void 0 || onChange(_value);
|
|
117
100
|
};
|
|
118
101
|
var cells = useMemo(function () {
|
|
119
|
-
var firstDate =
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
return
|
|
127
|
-
});
|
|
128
|
-
var afterDays = Array.from({
|
|
129
|
-
length: 6 - lastDate.getDay()
|
|
130
|
-
}).map(function (_, index) {
|
|
131
|
-
var date = new Date(lastDate);
|
|
132
|
-
date.setDate(lastDate.getDate() + index + 1);
|
|
133
|
-
return date;
|
|
102
|
+
var firstDate = dayjs(month).startOf('month');
|
|
103
|
+
|
|
104
|
+
// 固定生成42天的日期网格(6行7列)
|
|
105
|
+
var startDate = firstDate.subtract(firstDate.day(), 'day');
|
|
106
|
+
var cells = Array.from({
|
|
107
|
+
length: 42
|
|
108
|
+
}, function (_, index) {
|
|
109
|
+
return startDate.add(index, 'day');
|
|
134
110
|
});
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
}).map(function (_, index) {
|
|
138
|
-
var date = new Date(firstDate);
|
|
139
|
-
date.setDate(date.getDate() + index);
|
|
140
|
-
return date;
|
|
141
|
-
});
|
|
142
|
-
return [].concat(_toConsumableArray(beforeDays), _toConsumableArray(mouthDays), _toConsumableArray(afterDays));
|
|
143
|
-
}, [mouth]);
|
|
111
|
+
return cells;
|
|
112
|
+
}, [month]);
|
|
144
113
|
useEffect(function () {
|
|
145
114
|
if (value !== undefined) {
|
|
146
|
-
if (
|
|
147
|
-
|
|
115
|
+
if (range) {
|
|
116
|
+
if (!isSame(value[0], innerValue[0], 'day') || !isSame(value[1], innerValue[1], 'day')) {
|
|
117
|
+
setInnerValue(value);
|
|
118
|
+
}
|
|
119
|
+
} else {
|
|
120
|
+
if (!isSame(value[0], innerValue[0], 'day')) {
|
|
121
|
+
setInnerValue(value);
|
|
122
|
+
}
|
|
148
123
|
}
|
|
149
124
|
}
|
|
150
125
|
}, [value]);
|
|
@@ -154,7 +129,7 @@ export var CalendarGrid = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_
|
|
|
154
129
|
}, cells.map(function (item, index) {
|
|
155
130
|
return /*#__PURE__*/React.createElement(CalendarCell, {
|
|
156
131
|
key: index,
|
|
157
|
-
|
|
132
|
+
month: month,
|
|
158
133
|
date: item,
|
|
159
134
|
value: innerValue,
|
|
160
135
|
range: range,
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { FC } from "react";
|
|
2
|
+
import dayjs from "dayjs";
|
|
2
3
|
type CalendarHeaderProps = {
|
|
3
|
-
|
|
4
|
-
onChange: (mouth:
|
|
4
|
+
month: dayjs.Dayjs;
|
|
5
|
+
onChange: (mouth: dayjs.Dayjs) => void;
|
|
5
6
|
};
|
|
6
7
|
export declare const CalendarHeader: FC<CalendarHeaderProps>;
|
|
7
8
|
export {};
|
|
@@ -3,33 +3,36 @@ import classNames from "classnames";
|
|
|
3
3
|
import ConfigProvider from "../ConfigProvider";
|
|
4
4
|
var calendarCls = 'triones-antm-calendar';
|
|
5
5
|
export var CalendarHeader = function CalendarHeader(_ref) {
|
|
6
|
-
var
|
|
6
|
+
var month = _ref.month,
|
|
7
7
|
onChange = _ref.onChange;
|
|
8
8
|
var _ConfigProvider$useCo = ConfigProvider.useConfig(),
|
|
9
9
|
locale = _ConfigProvider$useCo.locale;
|
|
10
|
+
if (!month) {
|
|
11
|
+
return null;
|
|
12
|
+
}
|
|
10
13
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
11
14
|
className: classNames("".concat(calendarCls, "-header"))
|
|
12
15
|
}, /*#__PURE__*/React.createElement("div", {
|
|
13
16
|
className: classNames("".concat(calendarCls, "-header-button")),
|
|
14
17
|
onClick: function onClick() {
|
|
15
|
-
onChange(
|
|
18
|
+
onChange(month.subtract(1, 'year'));
|
|
16
19
|
}
|
|
17
20
|
}, "<<"), /*#__PURE__*/React.createElement("div", {
|
|
18
21
|
className: classNames("".concat(calendarCls, "-header-button")),
|
|
19
22
|
onClick: function onClick() {
|
|
20
|
-
onChange(
|
|
23
|
+
onChange(month.subtract(1, 'month'));
|
|
21
24
|
}
|
|
22
25
|
}, "<"), /*#__PURE__*/React.createElement("div", {
|
|
23
26
|
className: classNames("".concat(calendarCls, "-header-title"))
|
|
24
|
-
}, "".concat(
|
|
27
|
+
}, "".concat(month.year(), "\u5E74").concat(month.month() + 1, "\u6708")), /*#__PURE__*/React.createElement("div", {
|
|
25
28
|
className: classNames("".concat(calendarCls, "-header-button")),
|
|
26
29
|
onClick: function onClick() {
|
|
27
|
-
onChange(
|
|
30
|
+
onChange(month.add(1, 'month'));
|
|
28
31
|
}
|
|
29
32
|
}, ">"), /*#__PURE__*/React.createElement("div", {
|
|
30
33
|
className: classNames("".concat(calendarCls, "-header-button")),
|
|
31
34
|
onClick: function onClick() {
|
|
32
|
-
onChange(
|
|
35
|
+
onChange(month.add(1, 'year'));
|
|
33
36
|
}
|
|
34
37
|
}, ">>")), /*#__PURE__*/React.createElement("div", {
|
|
35
38
|
className: classNames("".concat(calendarCls, "-week"))
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import { FC } from 'react';
|
|
2
2
|
import './style.scss';
|
|
3
|
+
import dayjs from "dayjs";
|
|
3
4
|
type CalendarProps = {
|
|
4
|
-
|
|
5
|
-
value?: Date[];
|
|
6
|
-
onChange?: (date:
|
|
5
|
+
month?: dayjs.Dayjs | Date;
|
|
6
|
+
value?: dayjs.Dayjs[] | Date[];
|
|
7
|
+
onChange?: (date: dayjs.Dayjs[]) => void;
|
|
7
8
|
slideable?: boolean;
|
|
8
9
|
};
|
|
9
10
|
export declare const CalendarRange: FC<CalendarProps>;
|
|
@@ -5,49 +5,53 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
|
|
|
5
5
|
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
6
6
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
7
|
import classNames from 'classnames';
|
|
8
|
-
import _ from 'lodash-es';
|
|
9
8
|
import React, { memo, useEffect, useRef, useState } from 'react';
|
|
10
9
|
import { CalendarGrid } from "./calendar-grid";
|
|
11
10
|
import { CalendarHeader } from "./calendar-header";
|
|
12
11
|
import "./style.scss";
|
|
13
12
|
import { TouchableCalendarGrid } from "./touchable-calendar-grid";
|
|
13
|
+
import dayjs from "dayjs";
|
|
14
|
+
import { isSame, toDayjsArray } from "../utils/dayjs";
|
|
14
15
|
var calendarCls = 'triones-antm-calendar';
|
|
15
16
|
export var CalendarRange = /*#__PURE__*/memo(function (_ref) {
|
|
16
|
-
var _ref2, _ref3;
|
|
17
|
-
var
|
|
18
|
-
|
|
19
|
-
value = _ref
|
|
17
|
+
var _ref2, _toDayjsArray, _ref3, _toDayjsArray2;
|
|
18
|
+
var month = _ref.month,
|
|
19
|
+
_ref$value = _ref.value,
|
|
20
|
+
value = _ref$value === void 0 ? [] : _ref$value,
|
|
20
21
|
_onChange = _ref.onChange,
|
|
21
22
|
slideable = _ref.slideable;
|
|
22
|
-
var _useState = useState(
|
|
23
|
+
var _useState = useState(dayjs(month)),
|
|
23
24
|
_useState2 = _slicedToArray(_useState, 2),
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
var valueRef = useRef()
|
|
25
|
+
currentMonth = _useState2[0],
|
|
26
|
+
setCurrentMonth = _useState2[1];
|
|
27
|
+
var valueRef = useRef(value ? value.map(function (v) {
|
|
28
|
+
return dayjs(v);
|
|
29
|
+
}) : []);
|
|
27
30
|
useEffect(function () {
|
|
28
31
|
if (value !== undefined) {
|
|
29
|
-
|
|
30
|
-
|
|
32
|
+
var _valueRef$current, _valueRef$current2;
|
|
33
|
+
if (!isSame(value === null || value === void 0 ? void 0 : value[0], (_valueRef$current = valueRef.current) === null || _valueRef$current === void 0 ? void 0 : _valueRef$current[0], 'day') || !isSame(value === null || value === void 0 ? void 0 : value[1], (_valueRef$current2 = valueRef.current) === null || _valueRef$current2 === void 0 ? void 0 : _valueRef$current2[1], 'day')) {
|
|
34
|
+
valueRef.current = toDayjsArray(value) || [];
|
|
31
35
|
}
|
|
32
36
|
}
|
|
33
37
|
}, [value]);
|
|
34
38
|
return /*#__PURE__*/React.createElement("div", {
|
|
35
39
|
className: classNames("".concat(calendarCls))
|
|
36
40
|
}, /*#__PURE__*/React.createElement(CalendarHeader, {
|
|
37
|
-
|
|
38
|
-
onChange:
|
|
41
|
+
month: currentMonth,
|
|
42
|
+
onChange: setCurrentMonth
|
|
39
43
|
}), slideable ? /*#__PURE__*/React.createElement(TouchableCalendarGrid, {
|
|
40
|
-
|
|
41
|
-
value: (_ref2 = value !== null &&
|
|
42
|
-
|
|
44
|
+
month: currentMonth,
|
|
45
|
+
value: (_ref2 = (_toDayjsArray = toDayjsArray(value)) !== null && _toDayjsArray !== void 0 ? _toDayjsArray : valueRef.current) !== null && _ref2 !== void 0 ? _ref2 : [],
|
|
46
|
+
onMonthChange: setCurrentMonth,
|
|
43
47
|
onChange: function onChange(value) {
|
|
44
48
|
valueRef.current = value;
|
|
45
49
|
_onChange === null || _onChange === void 0 || _onChange(value);
|
|
46
50
|
},
|
|
47
51
|
range: true
|
|
48
52
|
}) : /*#__PURE__*/React.createElement(CalendarGrid, {
|
|
49
|
-
|
|
50
|
-
value: (_ref3 = value !== null &&
|
|
53
|
+
month: currentMonth,
|
|
54
|
+
value: (_ref3 = (_toDayjsArray2 = toDayjsArray(value)) !== null && _toDayjsArray2 !== void 0 ? _toDayjsArray2 : valueRef.current) !== null && _ref3 !== void 0 ? _ref3 : [],
|
|
51
55
|
onChange: function onChange(value) {
|
|
52
56
|
valueRef.current = value;
|
|
53
57
|
_onChange === null || _onChange === void 0 || _onChange(value);
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import './style.scss';
|
|
3
|
+
import dayjs from "dayjs";
|
|
3
4
|
export type CalendarProps = {
|
|
4
|
-
|
|
5
|
-
value?: Date;
|
|
6
|
-
onChange?: (date:
|
|
7
|
-
|
|
5
|
+
month?: dayjs.Dayjs | Date;
|
|
6
|
+
value?: dayjs.Dayjs | Date;
|
|
7
|
+
onChange?: (date: dayjs.Dayjs) => void;
|
|
8
|
+
onMonthChange?: (month: dayjs.Dayjs) => void;
|
|
8
9
|
slideable?: boolean;
|
|
9
10
|
};
|
|
10
11
|
export declare const Calendar: React.MemoExoticComponent<React.ForwardRefExoticComponent<CalendarProps & React.RefAttributes<HTMLDivElement>>>;
|
|
@@ -6,42 +6,55 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
|
|
|
6
6
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
7
|
import { CalendarGrid } from "./..";
|
|
8
8
|
import classNames from 'classnames';
|
|
9
|
-
import React, { forwardRef, memo, useState } from 'react';
|
|
9
|
+
import React, { forwardRef, memo, useEffect, useState } from 'react';
|
|
10
10
|
import { CalendarHeader } from "./calendar-header";
|
|
11
11
|
import "./style.scss";
|
|
12
12
|
import { TouchableCalendarGrid } from "./touchable-calendar-grid";
|
|
13
|
+
import dayjs from "dayjs";
|
|
14
|
+
import { isSame } from "../utils/dayjs";
|
|
13
15
|
var calendarCls = 'triones-antm-calendar';
|
|
14
16
|
export var Calendar = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
15
|
-
var
|
|
16
|
-
mouth = _ref$mouth === void 0 ? new Date() : _ref$mouth,
|
|
17
|
+
var month = _ref.month,
|
|
17
18
|
value = _ref.value,
|
|
18
19
|
_onChange = _ref.onChange,
|
|
19
|
-
|
|
20
|
+
onMonthChange = _ref.onMonthChange,
|
|
20
21
|
_ref$slideable = _ref.slideable,
|
|
21
22
|
slideable = _ref$slideable === void 0 ? false : _ref$slideable;
|
|
22
|
-
var _useState = useState(
|
|
23
|
+
var _useState = useState(dayjs(month)),
|
|
23
24
|
_useState2 = _slicedToArray(_useState, 2),
|
|
24
|
-
|
|
25
|
-
|
|
25
|
+
currentMonth = _useState2[0],
|
|
26
|
+
setCurrentMonth = _useState2[1];
|
|
27
|
+
var handleMonthChange = function handleMonthChange(newMonth) {
|
|
28
|
+
if (isSame(currentMonth, newMonth, 'month')) {
|
|
29
|
+
return;
|
|
30
|
+
}
|
|
31
|
+
setCurrentMonth(newMonth);
|
|
32
|
+
onMonthChange === null || onMonthChange === void 0 || onMonthChange(newMonth);
|
|
33
|
+
};
|
|
34
|
+
useEffect(function () {
|
|
35
|
+
if (month == undefined) {
|
|
36
|
+
return;
|
|
37
|
+
}
|
|
38
|
+
if (!isSame(month, currentMonth, 'month')) {
|
|
39
|
+
setCurrentMonth(dayjs(month));
|
|
40
|
+
}
|
|
41
|
+
}, [month]);
|
|
26
42
|
return /*#__PURE__*/React.createElement("div", {
|
|
27
43
|
ref: ref,
|
|
28
44
|
className: classNames("".concat(calendarCls))
|
|
29
45
|
}, /*#__PURE__*/React.createElement(CalendarHeader, {
|
|
30
|
-
|
|
31
|
-
onChange:
|
|
46
|
+
month: currentMonth,
|
|
47
|
+
onChange: handleMonthChange
|
|
32
48
|
}), slideable ? /*#__PURE__*/React.createElement(TouchableCalendarGrid, {
|
|
33
|
-
|
|
34
|
-
value: value ? [value] : [],
|
|
35
|
-
|
|
36
|
-
setCurrentMouth(newMouth);
|
|
37
|
-
_onMouthChange === null || _onMouthChange === void 0 || _onMouthChange(newMouth);
|
|
38
|
-
},
|
|
49
|
+
month: currentMonth,
|
|
50
|
+
value: value ? [dayjs(value)] : [],
|
|
51
|
+
onMonthChange: handleMonthChange,
|
|
39
52
|
onChange: function onChange(value) {
|
|
40
53
|
_onChange === null || _onChange === void 0 || _onChange(value === null || value === void 0 ? void 0 : value[0]);
|
|
41
54
|
}
|
|
42
55
|
}) : /*#__PURE__*/React.createElement(CalendarGrid, {
|
|
43
|
-
|
|
44
|
-
value: value ? [value] : [],
|
|
56
|
+
month: currentMonth,
|
|
57
|
+
value: value ? [dayjs(value)] : [],
|
|
45
58
|
onChange: function onChange(value) {
|
|
46
59
|
_onChange === null || _onChange === void 0 || _onChange(value === null || value === void 0 ? void 0 : value[0]);
|
|
47
60
|
}
|
package/dist/Calendar/style.scss
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@use "../style/variable" as
|
|
1
|
+
@use "../style/variable" as variable;
|
|
2
2
|
|
|
3
3
|
$calendarCls: 'triones-antm-calendar';
|
|
4
4
|
|
|
@@ -14,7 +14,7 @@ $calendarCls: 'triones-antm-calendar';
|
|
|
14
14
|
display: flex;
|
|
15
15
|
justify-content: center;
|
|
16
16
|
align-items: center;
|
|
17
|
-
border-radius:
|
|
17
|
+
border-radius: variable.$trionesBorderRadius;
|
|
18
18
|
cursor: default;
|
|
19
19
|
flex-direction: column;
|
|
20
20
|
|
|
@@ -34,18 +34,21 @@ $calendarCls: 'triones-antm-calendar';
|
|
|
34
34
|
}
|
|
35
35
|
|
|
36
36
|
&.#{$calendarCls}-cell {
|
|
37
|
+
box-sizing: border-box;
|
|
37
38
|
&-disabled {
|
|
38
39
|
color: #999999;
|
|
39
40
|
}
|
|
40
|
-
|
|
41
|
+
&-today{
|
|
42
|
+
border: 1Px solid variable.$trionesColorPrimary;
|
|
43
|
+
}
|
|
41
44
|
&-selected {
|
|
42
|
-
background-color:
|
|
45
|
+
background-color: variable.$trionesColorPrimary;
|
|
43
46
|
color: white;
|
|
44
47
|
}
|
|
45
48
|
|
|
46
49
|
&-selected-range {
|
|
47
50
|
border-radius: 0;
|
|
48
|
-
background-color:
|
|
51
|
+
background-color: variable.$trionesColorPrimaryBg;
|
|
49
52
|
color: black;
|
|
50
53
|
}
|
|
51
54
|
}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { FC } from 'react';
|
|
2
|
+
import dayjs from "dayjs";
|
|
2
3
|
type CalendarPickerViewProps = {
|
|
3
|
-
|
|
4
|
-
value?:
|
|
5
|
-
defaultValue?:
|
|
6
|
-
onChange?: (value:
|
|
7
|
-
|
|
4
|
+
month?: dayjs.Dayjs;
|
|
5
|
+
value?: dayjs.Dayjs[];
|
|
6
|
+
defaultValue?: dayjs.Dayjs[];
|
|
7
|
+
onChange?: (value: dayjs.Dayjs[]) => void;
|
|
8
|
+
onMonthChange?: (mouth: dayjs.Dayjs) => void;
|
|
8
9
|
range?: boolean;
|
|
9
10
|
};
|
|
10
11
|
/**
|