@panneau/list-calendar 3.0.119 → 3.0.126
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/lib/index.js +42 -53
- package/package.json +12 -11
package/lib/index.js
CHANGED
|
@@ -14,37 +14,26 @@ var core = require('@panneau/core');
|
|
|
14
14
|
var Button = require('@panneau/element-button');
|
|
15
15
|
var Icon = require('@panneau/element-icon');
|
|
16
16
|
|
|
17
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
18
|
-
|
|
19
|
-
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
20
|
-
var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
|
|
21
|
-
var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
|
|
22
|
-
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
|
23
|
-
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
24
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
25
|
-
var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
|
|
26
|
-
var Icon__default = /*#__PURE__*/_interopDefaultLegacy(Icon);
|
|
27
|
-
|
|
28
17
|
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"};
|
|
29
18
|
|
|
30
19
|
var propTypes = {
|
|
31
|
-
mode:
|
|
20
|
+
mode: PropTypes.string,
|
|
32
21
|
resource: core.PropTypes.resource.isRequired,
|
|
33
|
-
component:
|
|
22
|
+
component: PropTypes.func,
|
|
34
23
|
items: core.PropTypes.items,
|
|
35
|
-
itemDateField:
|
|
36
|
-
loading:
|
|
24
|
+
itemDateField: PropTypes.string,
|
|
25
|
+
loading: PropTypes.bool,
|
|
37
26
|
// onQueryChange: PropTypes.func,
|
|
38
|
-
filter:
|
|
39
|
-
dates:
|
|
27
|
+
filter: PropTypes.shape({
|
|
28
|
+
dates: PropTypes.arrayOf(PropTypes.string)
|
|
40
29
|
}),
|
|
41
30
|
// eslint-disable-next-line react/forbid-prop-types
|
|
42
|
-
value:
|
|
43
|
-
multiple:
|
|
44
|
-
onDateChange:
|
|
45
|
-
onPeriodChange:
|
|
46
|
-
initialDate:
|
|
47
|
-
className:
|
|
31
|
+
value: PropTypes.any,
|
|
32
|
+
multiple: PropTypes.bool,
|
|
33
|
+
onDateChange: PropTypes.func,
|
|
34
|
+
onPeriodChange: PropTypes.func,
|
|
35
|
+
initialDate: PropTypes.string,
|
|
36
|
+
className: PropTypes.string
|
|
48
37
|
};
|
|
49
38
|
var defaultProps = {
|
|
50
39
|
mode: 'monthly',
|
|
@@ -75,11 +64,11 @@ var CalendarList = function CalendarList(_ref) {
|
|
|
75
64
|
className = _ref.className;
|
|
76
65
|
var intl = reactIntl.useIntl();
|
|
77
66
|
var _useState = React.useState(0),
|
|
78
|
-
_useState2 =
|
|
67
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
79
68
|
monthIdx = _useState2[0],
|
|
80
69
|
setMonthIdx = _useState2[1];
|
|
81
70
|
var _useState3 = React.useState(0),
|
|
82
|
-
_useState4 =
|
|
71
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
83
72
|
weekIdx = _useState4[0],
|
|
84
73
|
setWeekIdx = _useState4[1];
|
|
85
74
|
var currentDate = new Date();
|
|
@@ -185,7 +174,7 @@ var CalendarList = function CalendarList(_ref) {
|
|
|
185
174
|
onDateChange(newDate ? null : newDate);
|
|
186
175
|
return;
|
|
187
176
|
}
|
|
188
|
-
var valuesUpdate =
|
|
177
|
+
var valuesUpdate = _toConsumableArray(dates);
|
|
189
178
|
if (!valuesUpdate.includes(newDate)) {
|
|
190
179
|
onDateChange([newDate]);
|
|
191
180
|
} else {
|
|
@@ -205,7 +194,7 @@ var CalendarList = function CalendarList(_ref) {
|
|
|
205
194
|
var monthHasDates = dates.reduce(function (acc, dte) {
|
|
206
195
|
var splitDate = dte.split(/\s*-\s*/g);
|
|
207
196
|
var _ref2 = splitDate || [],
|
|
208
|
-
_ref3 =
|
|
197
|
+
_ref3 = _slicedToArray(_ref2, 2),
|
|
209
198
|
_ref3$ = _ref3[0],
|
|
210
199
|
year = _ref3$ === void 0 ? null : _ref3$,
|
|
211
200
|
_ref3$2 = _ref3[1],
|
|
@@ -216,56 +205,56 @@ var CalendarList = function CalendarList(_ref) {
|
|
|
216
205
|
}
|
|
217
206
|
return acc;
|
|
218
207
|
}, false);
|
|
219
|
-
return /*#__PURE__*/
|
|
220
|
-
className:
|
|
221
|
-
}, /*#__PURE__*/
|
|
208
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
209
|
+
className: classNames([styles.container, _defineProperty({}, className, className !== null)])
|
|
210
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
222
211
|
className: styles.inner
|
|
223
|
-
}, /*#__PURE__*/
|
|
212
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
224
213
|
className: styles.calendarHeader
|
|
225
|
-
}, /*#__PURE__*/
|
|
214
|
+
}, /*#__PURE__*/React.createElement(Button, {
|
|
226
215
|
className: styles.arrow,
|
|
227
216
|
onClick: function onClick(e) {
|
|
228
217
|
return onClickPeriodChange(e, true);
|
|
229
218
|
}
|
|
230
|
-
}, /*#__PURE__*/
|
|
219
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
231
220
|
name: "arrow-left"
|
|
232
|
-
})), mode === 'weekly' ? /*#__PURE__*/
|
|
221
|
+
})), mode === 'weekly' ? /*#__PURE__*/React.createElement("div", {
|
|
233
222
|
className: styles.activePeriod
|
|
234
|
-
}, weekHasDates ? /*#__PURE__*/
|
|
223
|
+
}, weekHasDates ? /*#__PURE__*/React.createElement("span", {
|
|
235
224
|
className: styles.activePeriodWithDates
|
|
236
|
-
}, /*#__PURE__*/
|
|
225
|
+
}, /*#__PURE__*/React.createElement(reactIntl.FormattedDate, {
|
|
237
226
|
value: activeDate,
|
|
238
227
|
day: "numeric",
|
|
239
228
|
month: "long",
|
|
240
229
|
year: "numeric"
|
|
241
|
-
})) : /*#__PURE__*/
|
|
230
|
+
})) : /*#__PURE__*/React.createElement(reactIntl.FormattedDate, {
|
|
242
231
|
value: activeDate,
|
|
243
232
|
day: "numeric",
|
|
244
233
|
month: "long",
|
|
245
234
|
year: "numeric"
|
|
246
|
-
})) : /*#__PURE__*/
|
|
235
|
+
})) : /*#__PURE__*/React.createElement("div", {
|
|
247
236
|
className: styles.activePeriod
|
|
248
|
-
}, monthHasDates ? /*#__PURE__*/
|
|
237
|
+
}, monthHasDates ? /*#__PURE__*/React.createElement("span", {
|
|
249
238
|
className: styles.activePeriodWithDates
|
|
250
|
-
}, /*#__PURE__*/
|
|
239
|
+
}, /*#__PURE__*/React.createElement(reactIntl.FormattedDate, {
|
|
251
240
|
value: activeDate,
|
|
252
241
|
month: "long",
|
|
253
242
|
year: "numeric"
|
|
254
|
-
})) : /*#__PURE__*/
|
|
243
|
+
})) : /*#__PURE__*/React.createElement(reactIntl.FormattedDate, {
|
|
255
244
|
value: activeDate,
|
|
256
245
|
month: "long",
|
|
257
246
|
year: "numeric"
|
|
258
|
-
})), /*#__PURE__*/
|
|
259
|
-
className:
|
|
247
|
+
})), /*#__PURE__*/React.createElement(Button, {
|
|
248
|
+
className: classNames([styles.arrow, styles.right]),
|
|
260
249
|
onClick: onClickPeriodChange
|
|
261
|
-
}, /*#__PURE__*/
|
|
250
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
262
251
|
name: "arrow-right"
|
|
263
|
-
}))), /*#__PURE__*/
|
|
252
|
+
}))), /*#__PURE__*/React.createElement("div", {
|
|
264
253
|
className: styles.calendarGrid
|
|
265
254
|
}, days.map(function (d, i) {
|
|
266
|
-
return /*#__PURE__*/
|
|
255
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
267
256
|
key: "day-".concat(d.getTime, "-").concat(i + 1),
|
|
268
|
-
className:
|
|
257
|
+
className: classNames([styles.calendarBox, styles.headerBox])
|
|
269
258
|
}, d);
|
|
270
259
|
}), datesArray.map(function (d, i) {
|
|
271
260
|
var dTime = dateFns.format(d, 'yyyy-MM-dd');
|
|
@@ -276,15 +265,15 @@ var CalendarList = function CalendarList(_ref) {
|
|
|
276
265
|
var todayTime = currentDate.getTime();
|
|
277
266
|
var isPast = eventTime < todayTime && !isToday;
|
|
278
267
|
var hasItem = dates.includes(dTime);
|
|
279
|
-
var inner = hasItem ? /*#__PURE__*/
|
|
268
|
+
var inner = hasItem ? /*#__PURE__*/React.createElement(Button, {
|
|
280
269
|
onClick: function onClick(e) {
|
|
281
270
|
return onSelectDate(e, dTime);
|
|
282
271
|
},
|
|
283
|
-
className:
|
|
284
|
-
}, dateFns.format(d, 'd')) : /*#__PURE__*/
|
|
285
|
-
className:
|
|
272
|
+
className: classNames(styles.day, styles.dayButton, _defineProperty(_defineProperty(_defineProperty({}, styles.isToday, isToday), styles.isPast, isPast), styles.active, dates.includes(dTime)))
|
|
273
|
+
}, dateFns.format(d, 'd')) : /*#__PURE__*/React.createElement("div", {
|
|
274
|
+
className: classNames(styles.day, _defineProperty({}, styles.isToday, isToday))
|
|
286
275
|
}, dateFns.format(d, 'd'));
|
|
287
|
-
return /*#__PURE__*/
|
|
276
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
288
277
|
key: "date-".concat(d.getTime, "-").concat(i + 1),
|
|
289
278
|
className: styles.calendarBox
|
|
290
279
|
}, d.getUTCMonth() !== activeMonth && mode === 'monthly' ? '' : inner);
|
|
@@ -294,4 +283,4 @@ CalendarList.propTypes = propTypes;
|
|
|
294
283
|
CalendarList.defaultProps = defaultProps;
|
|
295
284
|
var Calendar = CalendarList;
|
|
296
285
|
|
|
297
|
-
exports
|
|
286
|
+
exports.default = Calendar;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@panneau/list-calendar",
|
|
3
|
-
"version": "3.0.
|
|
3
|
+
"version": "3.0.126",
|
|
4
4
|
"description": "Calendar list",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"javascript"
|
|
@@ -33,7 +33,8 @@
|
|
|
33
33
|
"assets"
|
|
34
34
|
],
|
|
35
35
|
"scripts": {
|
|
36
|
-
"
|
|
36
|
+
"prepublishOnly": "npm run build",
|
|
37
|
+
"build": "../../scripts/prepare-package.sh"
|
|
37
38
|
},
|
|
38
39
|
"devDependencies": {
|
|
39
40
|
"react": "^16.8.0 || ^17.0.0 || ^18.0.0",
|
|
@@ -45,22 +46,22 @@
|
|
|
45
46
|
},
|
|
46
47
|
"dependencies": {
|
|
47
48
|
"@babel/runtime": "^7.12.5",
|
|
48
|
-
"@panneau/core": "^3.0.
|
|
49
|
-
"@panneau/element-button": "^3.0.
|
|
50
|
-
"@panneau/element-card": "^3.0.
|
|
51
|
-
"@panneau/element-icon": "^3.0.
|
|
52
|
-
"@panneau/element-item-actions": "^3.0.
|
|
53
|
-
"@panneau/element-loading": "^3.0.
|
|
54
|
-
"@panneau/themes": "^3.0.
|
|
49
|
+
"@panneau/core": "^3.0.126",
|
|
50
|
+
"@panneau/element-button": "^3.0.126",
|
|
51
|
+
"@panneau/element-card": "^3.0.126",
|
|
52
|
+
"@panneau/element-icon": "^3.0.126",
|
|
53
|
+
"@panneau/element-item-actions": "^3.0.126",
|
|
54
|
+
"@panneau/element-loading": "^3.0.126",
|
|
55
|
+
"@panneau/themes": "^3.0.126",
|
|
55
56
|
"classnames": "^2.2.6",
|
|
56
57
|
"date-fns": "^3.3.1",
|
|
57
58
|
"lodash": "^4.17.21",
|
|
58
59
|
"prop-types": "^15.7.2",
|
|
59
|
-
"query-string": "^
|
|
60
|
+
"query-string": "^9.0.0",
|
|
60
61
|
"react-intl": "^5.15.8||^6.0.0"
|
|
61
62
|
},
|
|
62
63
|
"publishConfig": {
|
|
63
64
|
"access": "public"
|
|
64
65
|
},
|
|
65
|
-
"gitHead": "
|
|
66
|
+
"gitHead": "fa69ddff3f8cf22b00504093087608d5701e6f6a"
|
|
66
67
|
}
|