@panneau/list-calendar 4.0.38 → 4.0.40-alpha.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/dist/index.js +370 -225
- package/package.json +8 -8
package/dist/index.js
CHANGED
|
@@ -1,9 +1,7 @@
|
|
|
1
|
-
import
|
|
2
|
-
import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
|
|
3
|
-
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
|
|
1
|
+
import { c } from 'react/compiler-runtime';
|
|
4
2
|
import classNames from 'classnames';
|
|
5
3
|
import { parseISO, toDate, startOfWeek, addWeeks, addMonths, endOfWeek, addDays, compareAsc, compareDesc, format } from 'date-fns';
|
|
6
|
-
import { useState,
|
|
4
|
+
import { useState, useEffect } from 'react';
|
|
7
5
|
import { useIntl, FormattedDate } from 'react-intl';
|
|
8
6
|
import Button from '@panneau/element-button';
|
|
9
7
|
import Icon from '@panneau/element-icon';
|
|
@@ -11,254 +9,401 @@ import { jsx, jsxs } from 'react/jsx-runtime';
|
|
|
11
9
|
|
|
12
10
|
var styles = {"container":"panneau-list-calendar-container","inner":"panneau-list-calendar-inner","calendarHeader":"panneau-list-calendar-calendarHeader","activePeriod":"panneau-list-calendar-activePeriod","activePeriodWithDates":"panneau-list-calendar-activePeriodWithDates","arrow":"panneau-list-calendar-arrow","calendarGrid":"panneau-list-calendar-calendarGrid","calendarBox":"panneau-list-calendar-calendarBox","headerBox":"panneau-list-calendar-headerBox","day":"panneau-list-calendar-day","isToday":"panneau-list-calendar-isToday","isPast":"panneau-list-calendar-isPast","dayButton":"panneau-list-calendar-dayButton","active":"panneau-list-calendar-active"};
|
|
13
11
|
|
|
14
|
-
|
|
15
|
-
function CalendarList(
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
"
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
12
|
+
const DEFAULT_ITEMS = [];
|
|
13
|
+
function CalendarList(t0) {
|
|
14
|
+
const $ = c(54);
|
|
15
|
+
const {
|
|
16
|
+
mode: t1,
|
|
17
|
+
component: t2,
|
|
18
|
+
items: t3,
|
|
19
|
+
itemDateField: t4,
|
|
20
|
+
loading: t5,
|
|
21
|
+
value: t6,
|
|
22
|
+
multiple: t7,
|
|
23
|
+
onDateChange: t8,
|
|
24
|
+
onPeriodChange: t9,
|
|
25
|
+
initialDate: t10,
|
|
26
|
+
className: t11
|
|
27
|
+
} = t0;
|
|
28
|
+
const mode = t1 === undefined ? "monthly" : t1;
|
|
29
|
+
const items = t3 === undefined ? DEFAULT_ITEMS : t3;
|
|
30
|
+
const itemDateField = t4 === undefined ? "date" : t4;
|
|
31
|
+
const multiple = t7 === undefined ? false : t7;
|
|
32
|
+
const onDateChange = t8 === undefined ? null : t8;
|
|
33
|
+
const onPeriodChange = t9 === undefined ? null : t9;
|
|
34
|
+
const initialDate = t10 === undefined ? null : t10;
|
|
35
|
+
const className = t11 === undefined ? null : t11;
|
|
36
|
+
const intl = useIntl();
|
|
37
|
+
const [monthIdx, setMonthIdx] = useState(0);
|
|
38
|
+
const [weekIdx, setWeekIdx] = useState(0);
|
|
39
|
+
const currentDate = new Date();
|
|
40
|
+
const currentYear = currentDate.getUTCFullYear();
|
|
41
|
+
const currentMonth = currentDate.getUTCMonth();
|
|
42
|
+
const currentDayOfTheMonth = currentDate.getDate();
|
|
43
|
+
const dates = (items || []).map(it => it !== null && it[itemDateField] ? it[itemDateField] : null).filter(_temp);
|
|
44
|
+
const parsedInitialDate = initialDate !== null ? parseISO(initialDate) : null;
|
|
45
|
+
const partialInitialDate = parsedInitialDate !== null ? toDate(parsedInitialDate) : new Date();
|
|
46
|
+
const finalInitialDate = mode === "weekly" ? startOfWeek(partialInitialDate) : partialInitialDate;
|
|
47
|
+
const activeDate = mode === "weekly" ? addWeeks(finalInitialDate, weekIdx) : addMonths(finalInitialDate, monthIdx);
|
|
48
|
+
const activeYear = activeDate.getFullYear();
|
|
49
|
+
const activeMonth = activeDate.getUTCMonth();
|
|
50
|
+
const activeWeekStart = startOfWeek(activeDate);
|
|
51
|
+
const activeWeekEnd = endOfWeek(activeDate);
|
|
52
|
+
let t12;
|
|
53
|
+
if ($[0] !== intl) {
|
|
54
|
+
t12 = intl.formatMessage({
|
|
55
|
+
id: "fSfLk8"
|
|
56
|
+
});
|
|
57
|
+
$[0] = intl;
|
|
58
|
+
$[1] = t12;
|
|
59
|
+
} else {
|
|
60
|
+
t12 = $[1];
|
|
61
|
+
}
|
|
62
|
+
let t13;
|
|
63
|
+
if ($[2] !== intl) {
|
|
64
|
+
t13 = intl.formatMessage({
|
|
65
|
+
id: "jbT/g6"
|
|
66
|
+
});
|
|
67
|
+
$[2] = intl;
|
|
68
|
+
$[3] = t13;
|
|
69
|
+
} else {
|
|
70
|
+
t13 = $[3];
|
|
71
|
+
}
|
|
72
|
+
let t14;
|
|
73
|
+
if ($[4] !== intl) {
|
|
74
|
+
t14 = intl.formatMessage({
|
|
75
|
+
id: "Of2stw"
|
|
76
|
+
});
|
|
77
|
+
$[4] = intl;
|
|
78
|
+
$[5] = t14;
|
|
79
|
+
} else {
|
|
80
|
+
t14 = $[5];
|
|
81
|
+
}
|
|
82
|
+
let t15;
|
|
83
|
+
if ($[6] !== intl) {
|
|
84
|
+
t15 = intl.formatMessage({
|
|
85
|
+
id: "BAKfhq"
|
|
86
|
+
});
|
|
87
|
+
$[6] = intl;
|
|
88
|
+
$[7] = t15;
|
|
89
|
+
} else {
|
|
90
|
+
t15 = $[7];
|
|
91
|
+
}
|
|
92
|
+
let t16;
|
|
93
|
+
if ($[8] !== intl) {
|
|
94
|
+
t16 = intl.formatMessage({
|
|
95
|
+
id: "DBU3cu"
|
|
96
|
+
});
|
|
97
|
+
$[8] = intl;
|
|
98
|
+
$[9] = t16;
|
|
99
|
+
} else {
|
|
100
|
+
t16 = $[9];
|
|
101
|
+
}
|
|
102
|
+
let t17;
|
|
103
|
+
if ($[10] !== intl) {
|
|
104
|
+
t17 = intl.formatMessage({
|
|
105
|
+
id: "J6Mhku"
|
|
106
|
+
});
|
|
107
|
+
$[10] = intl;
|
|
108
|
+
$[11] = t17;
|
|
109
|
+
} else {
|
|
110
|
+
t17 = $[11];
|
|
111
|
+
}
|
|
112
|
+
let t18;
|
|
113
|
+
if ($[12] !== intl) {
|
|
114
|
+
t18 = intl.formatMessage({
|
|
115
|
+
id: "0F5X3C"
|
|
116
|
+
});
|
|
117
|
+
$[12] = intl;
|
|
118
|
+
$[13] = t18;
|
|
119
|
+
} else {
|
|
120
|
+
t18 = $[13];
|
|
121
|
+
}
|
|
122
|
+
let t19;
|
|
123
|
+
if ($[14] !== t12 || $[15] !== t13 || $[16] !== t14 || $[17] !== t15 || $[18] !== t16 || $[19] !== t17 || $[20] !== t18) {
|
|
124
|
+
t19 = [t12, t13, t14, t15, t16, t17, t18];
|
|
125
|
+
$[14] = t12;
|
|
126
|
+
$[15] = t13;
|
|
127
|
+
$[16] = t14;
|
|
128
|
+
$[17] = t15;
|
|
129
|
+
$[18] = t16;
|
|
130
|
+
$[19] = t17;
|
|
131
|
+
$[20] = t18;
|
|
132
|
+
$[21] = t19;
|
|
133
|
+
} else {
|
|
134
|
+
t19 = $[21];
|
|
135
|
+
}
|
|
136
|
+
const days = t19;
|
|
137
|
+
const datesArray = [];
|
|
138
|
+
if (mode === "weekly") {
|
|
139
|
+
for (let i = 0; i < 7; i++) {
|
|
140
|
+
const dte = addDays(activeWeekStart, i);
|
|
111
141
|
datesArray.push(dte);
|
|
112
142
|
}
|
|
113
143
|
} else {
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
datesArray.push(new Date(activeYear, activeMonth, _i));
|
|
144
|
+
const firstDayOfActualMonth = new Date(activeYear, activeMonth, 1).getDay();
|
|
145
|
+
const dayBeforeDiff = firstDayOfActualMonth === 0 ? 6 : firstDayOfActualMonth;
|
|
146
|
+
for (let i_0 = 1 - dayBeforeDiff; i_0 <= 35; i_0++) {
|
|
147
|
+
datesArray.push(new Date(activeYear, activeMonth, i_0));
|
|
119
148
|
}
|
|
120
149
|
}
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
150
|
+
let t20;
|
|
151
|
+
if ($[22] !== mode || $[23] !== monthIdx || $[24] !== weekIdx) {
|
|
152
|
+
t20 = (e, previous) => {
|
|
153
|
+
e.preventDefault();
|
|
154
|
+
if (mode === "weekly") {
|
|
155
|
+
if (previous) {
|
|
156
|
+
setWeekIdx(weekIdx - 1);
|
|
157
|
+
} else {
|
|
158
|
+
setWeekIdx(weekIdx + 1);
|
|
159
|
+
}
|
|
126
160
|
} else {
|
|
127
|
-
|
|
161
|
+
if (previous) {
|
|
162
|
+
setMonthIdx(monthIdx - 1);
|
|
163
|
+
} else {
|
|
164
|
+
setMonthIdx(monthIdx + 1);
|
|
165
|
+
}
|
|
128
166
|
}
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
}
|
|
135
|
-
|
|
167
|
+
};
|
|
168
|
+
$[22] = mode;
|
|
169
|
+
$[23] = monthIdx;
|
|
170
|
+
$[24] = weekIdx;
|
|
171
|
+
$[25] = t20;
|
|
172
|
+
} else {
|
|
173
|
+
t20 = $[25];
|
|
174
|
+
}
|
|
175
|
+
const onClickPeriodChange = t20;
|
|
176
|
+
useEffect(() => {
|
|
136
177
|
if (onPeriodChange !== null) {
|
|
137
178
|
onPeriodChange(activeDate);
|
|
138
179
|
}
|
|
139
180
|
}, [activeDate, onPeriodChange]);
|
|
140
|
-
|
|
141
|
-
|
|
181
|
+
const onSelectDate = (e_0, newDate) => {
|
|
182
|
+
e_0.preventDefault();
|
|
142
183
|
if (!multiple) {
|
|
143
|
-
onDateChange
|
|
184
|
+
onDateChange?.(newDate ? null : newDate);
|
|
144
185
|
return;
|
|
145
186
|
}
|
|
146
|
-
|
|
187
|
+
const valuesUpdate = [...dates];
|
|
147
188
|
if (!valuesUpdate.includes(newDate)) {
|
|
148
|
-
onDateChange
|
|
189
|
+
onDateChange?.([newDate]);
|
|
149
190
|
} else {
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
});
|
|
153
|
-
onDateChange === null || onDateChange === void 0 || onDateChange(filteredOptions);
|
|
191
|
+
const filteredOptions = valuesUpdate.filter(oldDate => oldDate !== newDate);
|
|
192
|
+
onDateChange?.(filteredOptions);
|
|
154
193
|
}
|
|
155
|
-
}
|
|
156
|
-
|
|
157
|
-
|
|
194
|
+
};
|
|
195
|
+
const weekHasDates = dates.reduce((acc, dte_0) => {
|
|
196
|
+
const parseDte = dte_0 !== null ? parseISO(dte_0) : null;
|
|
158
197
|
if (parseDte !== null && compareAsc(parseDte, activeWeekStart) >= 0 && compareDesc(parseDte, activeWeekEnd) >= 0) {
|
|
159
198
|
return true;
|
|
160
199
|
}
|
|
161
200
|
return acc;
|
|
162
201
|
}, false);
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
_ref3$2 = _ref3[1],
|
|
170
|
-
month = _ref3$2 === void 0 ? null : _ref3$2;
|
|
171
|
-
if (parseInt(year, 10) === parseInt(String(activeYear), 10) && parseInt(month, 10) === parseInt(String(activeMonth), 10) + 1 // yes this is incredibly stupid
|
|
172
|
-
) {
|
|
202
|
+
const monthHasDates = dates.reduce((acc_0, dte_1) => {
|
|
203
|
+
const splitDate = dte_1.split(/\s*-\s*/g);
|
|
204
|
+
const [t21, t22] = splitDate || [];
|
|
205
|
+
const year = t21 === undefined ? null : t21;
|
|
206
|
+
const month = t22 === undefined ? null : t22;
|
|
207
|
+
if (parseInt(year, 10) === parseInt(String(activeYear), 10) && parseInt(month, 10) === parseInt(String(activeMonth), 10) + 1) {
|
|
173
208
|
return true;
|
|
174
209
|
}
|
|
175
|
-
return
|
|
210
|
+
return acc_0;
|
|
176
211
|
}, false);
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
var inner = hasItem ? /*#__PURE__*/jsx(Button, {
|
|
245
|
-
onClick: function onClick(e) {
|
|
246
|
-
return onSelectDate(e, dTime);
|
|
247
|
-
},
|
|
248
|
-
className: classNames(styles.day, styles.dayButton, _defineProperty(_defineProperty(_defineProperty({}, styles.isToday, isToday), styles.isPast, isPast), styles.active, dates.includes(dTime))),
|
|
249
|
-
children: format(d, 'd')
|
|
250
|
-
}) : /*#__PURE__*/jsx("div", {
|
|
251
|
-
className: classNames(styles.day, _defineProperty({}, styles.isToday, isToday)),
|
|
252
|
-
children: format(d, 'd')
|
|
253
|
-
});
|
|
254
|
-
return /*#__PURE__*/jsx("div", {
|
|
255
|
-
className: styles.calendarBox,
|
|
256
|
-
children: d.getUTCMonth() !== activeMonth && mode === 'monthly' ? '' : inner
|
|
257
|
-
}, "date-".concat(d.getTime, "-").concat(i + 1));
|
|
258
|
-
})]
|
|
259
|
-
})]
|
|
212
|
+
let t23;
|
|
213
|
+
if ($[26] !== className) {
|
|
214
|
+
t23 = classNames([styles.container, className]);
|
|
215
|
+
$[26] = className;
|
|
216
|
+
$[27] = t23;
|
|
217
|
+
} else {
|
|
218
|
+
t23 = $[27];
|
|
219
|
+
}
|
|
220
|
+
const t24 = styles;
|
|
221
|
+
let t25;
|
|
222
|
+
if ($[28] !== onClickPeriodChange) {
|
|
223
|
+
t25 = e_1 => onClickPeriodChange(e_1, true);
|
|
224
|
+
$[28] = onClickPeriodChange;
|
|
225
|
+
$[29] = t25;
|
|
226
|
+
} else {
|
|
227
|
+
t25 = $[29];
|
|
228
|
+
}
|
|
229
|
+
let t26;
|
|
230
|
+
if ($[30] === Symbol.for("react.memo_cache_sentinel")) {
|
|
231
|
+
t26 = /*#__PURE__*/jsx(Icon, {
|
|
232
|
+
name: "arrow-left"
|
|
233
|
+
});
|
|
234
|
+
$[30] = t26;
|
|
235
|
+
} else {
|
|
236
|
+
t26 = $[30];
|
|
237
|
+
}
|
|
238
|
+
let t27;
|
|
239
|
+
if ($[31] !== t25) {
|
|
240
|
+
t27 = /*#__PURE__*/jsx(Button, {
|
|
241
|
+
className: styles.arrow,
|
|
242
|
+
onClick: t25,
|
|
243
|
+
children: t26
|
|
244
|
+
});
|
|
245
|
+
$[31] = t25;
|
|
246
|
+
$[32] = t27;
|
|
247
|
+
} else {
|
|
248
|
+
t27 = $[32];
|
|
249
|
+
}
|
|
250
|
+
const t28 = mode === "weekly" ? /*#__PURE__*/jsx("div", {
|
|
251
|
+
className: styles.activePeriod,
|
|
252
|
+
children: weekHasDates ? /*#__PURE__*/jsx("span", {
|
|
253
|
+
className: styles.activePeriodWithDates,
|
|
254
|
+
children: /*#__PURE__*/jsx(FormattedDate, {
|
|
255
|
+
value: activeDate,
|
|
256
|
+
day: "numeric",
|
|
257
|
+
month: "long",
|
|
258
|
+
year: "numeric"
|
|
259
|
+
})
|
|
260
|
+
}) : /*#__PURE__*/jsx(FormattedDate, {
|
|
261
|
+
value: activeDate,
|
|
262
|
+
day: "numeric",
|
|
263
|
+
month: "long",
|
|
264
|
+
year: "numeric"
|
|
265
|
+
})
|
|
266
|
+
}) : /*#__PURE__*/jsx("div", {
|
|
267
|
+
className: styles.activePeriod,
|
|
268
|
+
children: monthHasDates ? /*#__PURE__*/jsx("span", {
|
|
269
|
+
className: styles.activePeriodWithDates,
|
|
270
|
+
children: /*#__PURE__*/jsx(FormattedDate, {
|
|
271
|
+
value: activeDate,
|
|
272
|
+
month: "long",
|
|
273
|
+
year: "numeric"
|
|
274
|
+
})
|
|
275
|
+
}) : /*#__PURE__*/jsx(FormattedDate, {
|
|
276
|
+
value: activeDate,
|
|
277
|
+
month: "long",
|
|
278
|
+
year: "numeric"
|
|
260
279
|
})
|
|
261
280
|
});
|
|
281
|
+
let t29;
|
|
282
|
+
if ($[33] === Symbol.for("react.memo_cache_sentinel")) {
|
|
283
|
+
t29 = classNames([styles.arrow, styles.right]);
|
|
284
|
+
$[33] = t29;
|
|
285
|
+
} else {
|
|
286
|
+
t29 = $[33];
|
|
287
|
+
}
|
|
288
|
+
let t30;
|
|
289
|
+
if ($[34] === Symbol.for("react.memo_cache_sentinel")) {
|
|
290
|
+
t30 = /*#__PURE__*/jsx(Icon, {
|
|
291
|
+
name: "arrow-right"
|
|
292
|
+
});
|
|
293
|
+
$[34] = t30;
|
|
294
|
+
} else {
|
|
295
|
+
t30 = $[34];
|
|
296
|
+
}
|
|
297
|
+
let t31;
|
|
298
|
+
if ($[35] !== onClickPeriodChange) {
|
|
299
|
+
t31 = /*#__PURE__*/jsx(Button, {
|
|
300
|
+
className: t29,
|
|
301
|
+
onClick: onClickPeriodChange,
|
|
302
|
+
children: t30
|
|
303
|
+
});
|
|
304
|
+
$[35] = onClickPeriodChange;
|
|
305
|
+
$[36] = t31;
|
|
306
|
+
} else {
|
|
307
|
+
t31 = $[36];
|
|
308
|
+
}
|
|
309
|
+
let t32;
|
|
310
|
+
if ($[37] !== t27 || $[38] !== t28 || $[39] !== t31) {
|
|
311
|
+
t32 = /*#__PURE__*/jsxs("div", {
|
|
312
|
+
className: styles.calendarHeader,
|
|
313
|
+
children: [t27, t28, t31]
|
|
314
|
+
});
|
|
315
|
+
$[37] = t27;
|
|
316
|
+
$[38] = t28;
|
|
317
|
+
$[39] = t31;
|
|
318
|
+
$[40] = t32;
|
|
319
|
+
} else {
|
|
320
|
+
t32 = $[40];
|
|
321
|
+
}
|
|
322
|
+
const t33 = styles;
|
|
323
|
+
let t34;
|
|
324
|
+
if ($[41] !== days) {
|
|
325
|
+
t34 = days.map(_temp2);
|
|
326
|
+
$[41] = days;
|
|
327
|
+
$[42] = t34;
|
|
328
|
+
} else {
|
|
329
|
+
t34 = $[42];
|
|
330
|
+
}
|
|
331
|
+
const t35 = datesArray.map((d_1, i_2) => {
|
|
332
|
+
const dTime = format(d_1, "yyyy-MM-dd");
|
|
333
|
+
const isCurrentYear = d_1.getUTCFullYear() === currentYear;
|
|
334
|
+
const isCurrentMonth = d_1.getUTCMonth() === currentMonth;
|
|
335
|
+
const isToday = isCurrentYear && isCurrentMonth && d_1.getDate() === currentDayOfTheMonth;
|
|
336
|
+
const eventTime = d_1.getTime();
|
|
337
|
+
const todayTime = currentDate.getTime();
|
|
338
|
+
const isPast = eventTime < todayTime && !isToday;
|
|
339
|
+
const hasItem = dates.includes(dTime);
|
|
340
|
+
const inner = hasItem ? /*#__PURE__*/jsx(Button, {
|
|
341
|
+
onClick: e_2 => onSelectDate(e_2, dTime),
|
|
342
|
+
className: classNames(styles.day, styles.dayButton, {
|
|
343
|
+
[styles.isToday]: isToday,
|
|
344
|
+
[styles.isPast]: isPast,
|
|
345
|
+
[styles.active]: dates.includes(dTime)
|
|
346
|
+
}),
|
|
347
|
+
children: format(d_1, "d")
|
|
348
|
+
}) : /*#__PURE__*/jsx("div", {
|
|
349
|
+
className: classNames(styles.day, {
|
|
350
|
+
[styles.isToday]: isToday
|
|
351
|
+
}),
|
|
352
|
+
children: format(d_1, "d")
|
|
353
|
+
});
|
|
354
|
+
return /*#__PURE__*/jsx("div", {
|
|
355
|
+
className: styles.calendarBox,
|
|
356
|
+
children: d_1.getUTCMonth() !== activeMonth && mode === "monthly" ? "" : inner
|
|
357
|
+
}, `date-${d_1.getTime}-${i_2 + 1}`);
|
|
358
|
+
});
|
|
359
|
+
let t36;
|
|
360
|
+
if ($[43] !== t33.calendarGrid || $[44] !== t34 || $[45] !== t35) {
|
|
361
|
+
t36 = /*#__PURE__*/jsxs("div", {
|
|
362
|
+
className: t33.calendarGrid,
|
|
363
|
+
children: [t34, t35]
|
|
364
|
+
});
|
|
365
|
+
$[43] = t33.calendarGrid;
|
|
366
|
+
$[44] = t34;
|
|
367
|
+
$[45] = t35;
|
|
368
|
+
$[46] = t36;
|
|
369
|
+
} else {
|
|
370
|
+
t36 = $[46];
|
|
371
|
+
}
|
|
372
|
+
let t37;
|
|
373
|
+
if ($[47] !== t24.inner || $[48] !== t32 || $[49] !== t36) {
|
|
374
|
+
t37 = /*#__PURE__*/jsxs("div", {
|
|
375
|
+
className: t24.inner,
|
|
376
|
+
children: [t32, t36]
|
|
377
|
+
});
|
|
378
|
+
$[47] = t24.inner;
|
|
379
|
+
$[48] = t32;
|
|
380
|
+
$[49] = t36;
|
|
381
|
+
$[50] = t37;
|
|
382
|
+
} else {
|
|
383
|
+
t37 = $[50];
|
|
384
|
+
}
|
|
385
|
+
let t38;
|
|
386
|
+
if ($[51] !== t23 || $[52] !== t37) {
|
|
387
|
+
t38 = /*#__PURE__*/jsx("div", {
|
|
388
|
+
className: t23,
|
|
389
|
+
children: t37
|
|
390
|
+
});
|
|
391
|
+
$[51] = t23;
|
|
392
|
+
$[52] = t37;
|
|
393
|
+
$[53] = t38;
|
|
394
|
+
} else {
|
|
395
|
+
t38 = $[53];
|
|
396
|
+
}
|
|
397
|
+
return t38;
|
|
398
|
+
}
|
|
399
|
+
function _temp2(d_0, i_1) {
|
|
400
|
+
return /*#__PURE__*/jsx("div", {
|
|
401
|
+
className: classNames([styles.calendarBox, styles.headerBox]),
|
|
402
|
+
children: d_0
|
|
403
|
+
}, `day-${i_1 + 1}`);
|
|
404
|
+
}
|
|
405
|
+
function _temp(d) {
|
|
406
|
+
return d !== null;
|
|
262
407
|
}
|
|
263
408
|
|
|
264
409
|
export { CalendarList as default };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@panneau/list-calendar",
|
|
3
|
-
"version": "4.0.
|
|
3
|
+
"version": "4.0.40-alpha.1",
|
|
4
4
|
"description": "Calendar list",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"javascript"
|
|
@@ -56,12 +56,12 @@
|
|
|
56
56
|
},
|
|
57
57
|
"dependencies": {
|
|
58
58
|
"@babel/runtime": "^7.28.6",
|
|
59
|
-
"@panneau/core": "^4.0.
|
|
60
|
-
"@panneau/element-button": "^4.0.
|
|
61
|
-
"@panneau/element-card": "^4.0.
|
|
62
|
-
"@panneau/element-icon": "^4.0.
|
|
63
|
-
"@panneau/element-loading": "^4.0.
|
|
64
|
-
"@panneau/themes": "^4.0.
|
|
59
|
+
"@panneau/core": "^4.0.40-alpha.1",
|
|
60
|
+
"@panneau/element-button": "^4.0.40-alpha.1",
|
|
61
|
+
"@panneau/element-card": "^4.0.40-alpha.1",
|
|
62
|
+
"@panneau/element-icon": "^4.0.40-alpha.1",
|
|
63
|
+
"@panneau/element-loading": "^4.0.40-alpha.1",
|
|
64
|
+
"@panneau/themes": "^4.0.40-alpha.1",
|
|
65
65
|
"classnames": "^2.5.1",
|
|
66
66
|
"date-fns": "^3.3.1",
|
|
67
67
|
"lodash": "^4.17.21",
|
|
@@ -71,5 +71,5 @@
|
|
|
71
71
|
"publishConfig": {
|
|
72
72
|
"access": "public"
|
|
73
73
|
},
|
|
74
|
-
"gitHead": "
|
|
74
|
+
"gitHead": "66520f92373b3aa371222b354d60ed3cf3d20c96"
|
|
75
75
|
}
|