@itwin/itwinui-react 2.11.3 → 2.11.5
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
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## 2.11.5
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#1329](https://github.com/iTwin/iTwinUI/pull/1329): Fixed an issue where the visually hidden `FileUploadCard.Input` was inadvertently showing when focused.
|
|
8
|
+
|
|
9
|
+
## 2.11.4
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [#1319](https://github.com/iTwin/iTwinUI/pull/1319): DatePicker will no longer disable month and year navigation when the next/previous months are disabled.
|
|
14
|
+
|
|
3
15
|
## 2.11.3
|
|
4
16
|
|
|
5
17
|
### Patch Changes
|
|
@@ -279,10 +279,6 @@ const DatePicker = (props) => {
|
|
|
279
279
|
}
|
|
280
280
|
}
|
|
281
281
|
};
|
|
282
|
-
const isPreviousMonthDisabled = isDateDisabled === null || isDateDisabled === void 0 ? void 0 : isDateDisabled(new Date(displayedYear, displayedMonthIndex, 0));
|
|
283
|
-
const isNextMonthDisabled = isDateDisabled === null || isDateDisabled === void 0 ? void 0 : isDateDisabled(new Date(displayedYear, displayedMonthIndex + 1, 1));
|
|
284
|
-
const isPreviousYearDisabled = isDateDisabled === null || isDateDisabled === void 0 ? void 0 : isDateDisabled(new Date(displayedYear - 1, 11, 31));
|
|
285
|
-
const isNextYearDisabled = isDateDisabled === null || isDateDisabled === void 0 ? void 0 : isDateDisabled(new Date(displayedYear + 1, 0, 1));
|
|
286
282
|
const handleCalendarKeyDown = (event) => {
|
|
287
283
|
if (event.altKey) {
|
|
288
284
|
return;
|
|
@@ -295,9 +291,6 @@ const DatePicker = (props) => {
|
|
|
295
291
|
case 'ArrowDown':
|
|
296
292
|
adjustedFocusedDay.setDate(focusedDay.getDate() + 7);
|
|
297
293
|
if (adjustedFocusedDay.getMonth() !== displayedMonthIndex) {
|
|
298
|
-
if (isNextMonthDisabled) {
|
|
299
|
-
return;
|
|
300
|
-
}
|
|
301
294
|
handleMoveToNextMonth();
|
|
302
295
|
}
|
|
303
296
|
setFocusedDay(adjustedFocusedDay);
|
|
@@ -307,9 +300,6 @@ const DatePicker = (props) => {
|
|
|
307
300
|
case 'ArrowUp':
|
|
308
301
|
adjustedFocusedDay.setDate(focusedDay.getDate() - 7);
|
|
309
302
|
if (adjustedFocusedDay.getMonth() !== displayedMonthIndex) {
|
|
310
|
-
if (isPreviousMonthDisabled) {
|
|
311
|
-
return;
|
|
312
|
-
}
|
|
313
303
|
handleMoveToPreviousMonth();
|
|
314
304
|
}
|
|
315
305
|
setFocusedDay(adjustedFocusedDay);
|
|
@@ -319,9 +309,6 @@ const DatePicker = (props) => {
|
|
|
319
309
|
case 'ArrowLeft':
|
|
320
310
|
adjustedFocusedDay.setDate(focusedDay.getDate() - 1);
|
|
321
311
|
if (adjustedFocusedDay.getMonth() !== displayedMonthIndex) {
|
|
322
|
-
if (isPreviousMonthDisabled) {
|
|
323
|
-
return;
|
|
324
|
-
}
|
|
325
312
|
handleMoveToPreviousMonth();
|
|
326
313
|
}
|
|
327
314
|
setFocusedDay(adjustedFocusedDay);
|
|
@@ -331,9 +318,6 @@ const DatePicker = (props) => {
|
|
|
331
318
|
case 'ArrowRight':
|
|
332
319
|
adjustedFocusedDay.setDate(focusedDay.getDate() + 1);
|
|
333
320
|
if (adjustedFocusedDay.getMonth() !== displayedMonthIndex) {
|
|
334
|
-
if (isNextMonthDisabled) {
|
|
335
|
-
return;
|
|
336
|
-
}
|
|
337
321
|
handleMoveToNextMonth();
|
|
338
322
|
}
|
|
339
323
|
setFocusedDay(adjustedFocusedDay);
|
|
@@ -380,17 +364,17 @@ const DatePicker = (props) => {
|
|
|
380
364
|
return (React.createElement("div", { className: (0, classnames_1.default)('iui-date-picker', className), style: style, ...rest },
|
|
381
365
|
React.createElement("div", null,
|
|
382
366
|
React.createElement("div", { className: 'iui-calendar-month-year' },
|
|
383
|
-
showYearSelection && (React.createElement(index_js_2.IconButton, { styleType: 'borderless', onClick: handleMoveToPreviousYear, "aria-label": 'Previous year', size: 'small'
|
|
367
|
+
showYearSelection && (React.createElement(index_js_2.IconButton, { styleType: 'borderless', onClick: handleMoveToPreviousYear, "aria-label": 'Previous year', size: 'small' },
|
|
384
368
|
React.createElement(index_js_1.SvgChevronLeftDouble, null))),
|
|
385
|
-
React.createElement(index_js_2.IconButton, { styleType: 'borderless', onClick: handleMoveToPreviousMonth, "aria-label": 'Previous month', size: 'small'
|
|
369
|
+
React.createElement(index_js_2.IconButton, { styleType: 'borderless', onClick: handleMoveToPreviousMonth, "aria-label": 'Previous month', size: 'small' },
|
|
386
370
|
React.createElement(index_js_1.SvgChevronLeft, null)),
|
|
387
371
|
React.createElement("span", { "aria-live": 'polite' },
|
|
388
372
|
React.createElement("span", { className: 'iui-calendar-month', title: monthNames[displayedMonthIndex] }, monthNames[displayedMonthIndex]),
|
|
389
373
|
"\u00A0",
|
|
390
374
|
displayedYear),
|
|
391
|
-
React.createElement(index_js_2.IconButton, { styleType: 'borderless', onClick: handleMoveToNextMonth, "aria-label": 'Next month', size: 'small'
|
|
375
|
+
React.createElement(index_js_2.IconButton, { styleType: 'borderless', onClick: handleMoveToNextMonth, "aria-label": 'Next month', size: 'small' },
|
|
392
376
|
React.createElement(index_js_1.SvgChevronRight, null)),
|
|
393
|
-
showYearSelection && (React.createElement(index_js_2.IconButton, { styleType: 'borderless', onClick: handleMoveToNextYear, "aria-label": 'Next year', size: 'small'
|
|
377
|
+
showYearSelection && (React.createElement(index_js_2.IconButton, { styleType: 'borderless', onClick: handleMoveToNextYear, "aria-label": 'Next year', size: 'small' },
|
|
394
378
|
React.createElement(index_js_1.SvgChevronRightDouble, null)))),
|
|
395
379
|
React.createElement("div", { className: 'iui-calendar-weekdays' }, shortDays.map((day, index) => (React.createElement("div", { key: day, title: longDays[index] }, day)))),
|
|
396
380
|
React.createElement("div", { onKeyDown: handleCalendarKeyDown, role: 'listbox' }, weeks.map((weekDays, weekIndex) => {
|
|
@@ -109,7 +109,7 @@ const FileUploadCardInput = React.forwardRef((props, ref) => {
|
|
|
109
109
|
}
|
|
110
110
|
}, [id, inputId, setInputId]);
|
|
111
111
|
return (React.createElement(React.Fragment, null,
|
|
112
|
-
React.createElement(index_js_1.VisuallyHidden, { as: 'input', type: 'file', onChange: (0, index_js_1.mergeEventHandlers)(onChange, (e) => {
|
|
112
|
+
React.createElement(index_js_1.VisuallyHidden, { as: 'input', type: 'file', unhideOnFocus: false, onChange: (0, index_js_1.mergeEventHandlers)(onChange, (e) => {
|
|
113
113
|
const _files = Array.from(e.currentTarget.files || []);
|
|
114
114
|
onFilesChange === null || onFilesChange === void 0 ? void 0 : onFilesChange(_files);
|
|
115
115
|
setInternalFiles(_files);
|
|
@@ -249,10 +249,6 @@ export const DatePicker = (props) => {
|
|
|
249
249
|
}
|
|
250
250
|
}
|
|
251
251
|
};
|
|
252
|
-
const isPreviousMonthDisabled = isDateDisabled === null || isDateDisabled === void 0 ? void 0 : isDateDisabled(new Date(displayedYear, displayedMonthIndex, 0));
|
|
253
|
-
const isNextMonthDisabled = isDateDisabled === null || isDateDisabled === void 0 ? void 0 : isDateDisabled(new Date(displayedYear, displayedMonthIndex + 1, 1));
|
|
254
|
-
const isPreviousYearDisabled = isDateDisabled === null || isDateDisabled === void 0 ? void 0 : isDateDisabled(new Date(displayedYear - 1, 11, 31));
|
|
255
|
-
const isNextYearDisabled = isDateDisabled === null || isDateDisabled === void 0 ? void 0 : isDateDisabled(new Date(displayedYear + 1, 0, 1));
|
|
256
252
|
const handleCalendarKeyDown = (event) => {
|
|
257
253
|
if (event.altKey) {
|
|
258
254
|
return;
|
|
@@ -265,9 +261,6 @@ export const DatePicker = (props) => {
|
|
|
265
261
|
case 'ArrowDown':
|
|
266
262
|
adjustedFocusedDay.setDate(focusedDay.getDate() + 7);
|
|
267
263
|
if (adjustedFocusedDay.getMonth() !== displayedMonthIndex) {
|
|
268
|
-
if (isNextMonthDisabled) {
|
|
269
|
-
return;
|
|
270
|
-
}
|
|
271
264
|
handleMoveToNextMonth();
|
|
272
265
|
}
|
|
273
266
|
setFocusedDay(adjustedFocusedDay);
|
|
@@ -277,9 +270,6 @@ export const DatePicker = (props) => {
|
|
|
277
270
|
case 'ArrowUp':
|
|
278
271
|
adjustedFocusedDay.setDate(focusedDay.getDate() - 7);
|
|
279
272
|
if (adjustedFocusedDay.getMonth() !== displayedMonthIndex) {
|
|
280
|
-
if (isPreviousMonthDisabled) {
|
|
281
|
-
return;
|
|
282
|
-
}
|
|
283
273
|
handleMoveToPreviousMonth();
|
|
284
274
|
}
|
|
285
275
|
setFocusedDay(adjustedFocusedDay);
|
|
@@ -289,9 +279,6 @@ export const DatePicker = (props) => {
|
|
|
289
279
|
case 'ArrowLeft':
|
|
290
280
|
adjustedFocusedDay.setDate(focusedDay.getDate() - 1);
|
|
291
281
|
if (adjustedFocusedDay.getMonth() !== displayedMonthIndex) {
|
|
292
|
-
if (isPreviousMonthDisabled) {
|
|
293
|
-
return;
|
|
294
|
-
}
|
|
295
282
|
handleMoveToPreviousMonth();
|
|
296
283
|
}
|
|
297
284
|
setFocusedDay(adjustedFocusedDay);
|
|
@@ -301,9 +288,6 @@ export const DatePicker = (props) => {
|
|
|
301
288
|
case 'ArrowRight':
|
|
302
289
|
adjustedFocusedDay.setDate(focusedDay.getDate() + 1);
|
|
303
290
|
if (adjustedFocusedDay.getMonth() !== displayedMonthIndex) {
|
|
304
|
-
if (isNextMonthDisabled) {
|
|
305
|
-
return;
|
|
306
|
-
}
|
|
307
291
|
handleMoveToNextMonth();
|
|
308
292
|
}
|
|
309
293
|
setFocusedDay(adjustedFocusedDay);
|
|
@@ -350,17 +334,17 @@ export const DatePicker = (props) => {
|
|
|
350
334
|
return (React.createElement("div", { className: cx('iui-date-picker', className), style: style, ...rest },
|
|
351
335
|
React.createElement("div", null,
|
|
352
336
|
React.createElement("div", { className: 'iui-calendar-month-year' },
|
|
353
|
-
showYearSelection && (React.createElement(IconButton, { styleType: 'borderless', onClick: handleMoveToPreviousYear, "aria-label": 'Previous year', size: 'small'
|
|
337
|
+
showYearSelection && (React.createElement(IconButton, { styleType: 'borderless', onClick: handleMoveToPreviousYear, "aria-label": 'Previous year', size: 'small' },
|
|
354
338
|
React.createElement(SvgChevronLeftDouble, null))),
|
|
355
|
-
React.createElement(IconButton, { styleType: 'borderless', onClick: handleMoveToPreviousMonth, "aria-label": 'Previous month', size: 'small'
|
|
339
|
+
React.createElement(IconButton, { styleType: 'borderless', onClick: handleMoveToPreviousMonth, "aria-label": 'Previous month', size: 'small' },
|
|
356
340
|
React.createElement(SvgChevronLeft, null)),
|
|
357
341
|
React.createElement("span", { "aria-live": 'polite' },
|
|
358
342
|
React.createElement("span", { className: 'iui-calendar-month', title: monthNames[displayedMonthIndex] }, monthNames[displayedMonthIndex]),
|
|
359
343
|
"\u00A0",
|
|
360
344
|
displayedYear),
|
|
361
|
-
React.createElement(IconButton, { styleType: 'borderless', onClick: handleMoveToNextMonth, "aria-label": 'Next month', size: 'small'
|
|
345
|
+
React.createElement(IconButton, { styleType: 'borderless', onClick: handleMoveToNextMonth, "aria-label": 'Next month', size: 'small' },
|
|
362
346
|
React.createElement(SvgChevronRight, null)),
|
|
363
|
-
showYearSelection && (React.createElement(IconButton, { styleType: 'borderless', onClick: handleMoveToNextYear, "aria-label": 'Next year', size: 'small'
|
|
347
|
+
showYearSelection && (React.createElement(IconButton, { styleType: 'borderless', onClick: handleMoveToNextYear, "aria-label": 'Next year', size: 'small' },
|
|
364
348
|
React.createElement(SvgChevronRightDouble, null)))),
|
|
365
349
|
React.createElement("div", { className: 'iui-calendar-weekdays' }, shortDays.map((day, index) => (React.createElement("div", { key: day, title: longDays[index] }, day)))),
|
|
366
350
|
React.createElement("div", { onKeyDown: handleCalendarKeyDown, role: 'listbox' }, weeks.map((weekDays, weekIndex) => {
|
|
@@ -80,7 +80,7 @@ const FileUploadCardInput = React.forwardRef((props, ref) => {
|
|
|
80
80
|
}
|
|
81
81
|
}, [id, inputId, setInputId]);
|
|
82
82
|
return (React.createElement(React.Fragment, null,
|
|
83
|
-
React.createElement(VisuallyHidden, { as: 'input', type: 'file', onChange: mergeEventHandlers(onChange, (e) => {
|
|
83
|
+
React.createElement(VisuallyHidden, { as: 'input', type: 'file', unhideOnFocus: false, onChange: mergeEventHandlers(onChange, (e) => {
|
|
84
84
|
const _files = Array.from(e.currentTarget.files || []);
|
|
85
85
|
onFilesChange === null || onFilesChange === void 0 ? void 0 : onFilesChange(_files);
|
|
86
86
|
setInternalFiles(_files);
|