@mui/x-date-pickers 5.0.8 → 5.0.10

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
@@ -3,6 +3,115 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## 5.17.15
7
+
8
+ _Dec 8, 2022_
9
+
10
+ We'd like to offer a big thanks to the 4 contributors who made this release possible. Here are some highlights ✨:
11
+
12
+ - ✨ Fix lazy-loading not working in `DataGridPremium` (#7130) @m4theushw
13
+ - 🐞 Bugfixes
14
+
15
+ ### `@mui/x-data-grid@v5.17.15` / `@mui/x-data-grid-pro@v5.17.15` / `@mui/x-data-grid-premium@v5.17.15`
16
+
17
+ #### Changes
18
+
19
+ - [DataGridPremium] Add support for lazy-loading (#7130) @m4theushw
20
+ - [DataGridPremium] Pass `groupId` to the aggregation function (#7143) @m4theushw
21
+
22
+ ### `@mui/x-date-pickers@v5.0.10` / `@mui/x-date-pickers-pro@v5.0.10`
23
+
24
+ #### Changes
25
+
26
+ - [pickers] Initialize date without time when selecting year or month (#7136) @LukasTy
27
+
28
+ ### Docs
29
+
30
+ - [docs] Fix the nested import on the api pages (#7134) @flaviendelangle
31
+ - [docs] Keep track of the localization completion (#7099) @alexfauquette
32
+ - [docs] Update localization doc to use existing locale (#7104) @LukasTy
33
+
34
+ ## 5.17.14
35
+
36
+ _Dec 1, 2022_
37
+
38
+ We'd like to offer a big thanks to the 3 contributors who made this release possible. Here are some highlights ✨:
39
+
40
+ - 🌍 Improve Ukrainian (uk-UA) locale (#7035) @rettoua
41
+ - 🐞 Bugfixes
42
+
43
+ ### `@mui/x-data-grid@v5.17.14` / `@mui/x-data-grid-pro@v5.17.14` / `@mui/x-data-grid-premium@v5.17.14`
44
+
45
+ #### Changes
46
+
47
+ - [DataGrid] Fix row selection when clicking blank cell (#7056) @yami03
48
+ - [DataGridPremium] Update cache before hydrating columns (#7043) @m4theushw
49
+ - [l10n] Improve Ukrainian (uk-UA) locale (#7035) @rettoua
50
+
51
+ ## 5.17.13
52
+
53
+ _Nov 24, 2022_
54
+
55
+ We'd like to offer a big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
56
+
57
+ - 🚀 Fix support of the pickers to Shadow DOM (#6971) @flaviendelangle
58
+ - 💅 Improve DataGrid theme augmentation (#6980) @iigrik
59
+ - 🐞 Bugfixes
60
+
61
+ ### `@mui/x-data-grid@v5.17.13` / `@mui/x-data-grid-pro@v5.17.13` / `@mui/x-data-grid-premium@v5.17.13`
62
+
63
+ #### Changes
64
+
65
+ - [DataGrid] Fix `ErrorOverlay` not receiving defined input props (#6885) @banoth-ravinder
66
+ - [DataGrid] Improve typing for `styleOverrides` (#6980) @iigrik
67
+ - [DataGridPro] Fix lazy-loaded rows not working with `updateRows` API method (#6875) @cherniavskii
68
+ - [l10n] Fix translation of `filterOperatorBefore` in Arabic (ar-SD) locale (#6917) @HassanGhazy
69
+
70
+ ### `@mui/x-date-pickers@v5.0.9` / `@mui/x-date-pickers-pro@v5.0.9`
71
+
72
+ #### Changes
73
+
74
+ - [pickers] Fix usage with Shadow DOM (#6971) @flaviendelangle
75
+
76
+ ### Docs
77
+
78
+ - [docs] Add new "Expired package version" error type (#6937) @oliviertassinari
79
+ - [docs] Enforce values for installation options in Date / Time pickers Getting Started page (#6896) @01zulfi
80
+ - [docs] Fix live edit @oliviertassinari
81
+ - [docs] Upgrade to Next 13 (#6911) @cherniavskii
82
+
83
+ ### Core
84
+
85
+ - [core] Upgrade monorepo (#6906) @cherniavskii
86
+ - [core] Upgrade node to v14.21 (#6939) @piwysocki
87
+
88
+ ## 5.17.12
89
+
90
+ _Nov 17, 2022_
91
+
92
+ We'd like to offer a big thanks to the 5 contributors who made this release possible. Here are some highlights ✨:
93
+
94
+ - 🌍 Improve Finnish (fi-FI) locale (#6859) @RainoPikkarainen
95
+ - 🐞 Bugfixes
96
+
97
+ ### `@mui/x-data-grid@v5.17.12` / `@mui/x-data-grid-pro@v5.17.12` / `@mui/x-data-grid-premium@v5.17.12`
98
+
99
+ #### Changes
100
+
101
+ - [DataGrid] Fix conflict with the latest version of `@types/react` (#6883) @vizv
102
+ - [DataGridPremium] Support aggregating data from multiple row fields (#6844) @cherniavskii
103
+ - [DataGridPro] Fix detail panel not working with `getRowSpacing` prop (#6858) @cherniavskii
104
+ - [l10n] Improve Finnish (fi-FI) locale (#6859) @RainoPikkarainen
105
+
106
+ ### Docs
107
+
108
+ - [docs] Clarify DataGrid Row Pinning docs (#6891) @cherniavskii
109
+
110
+ ### Core
111
+
112
+ - [core] Upgrade monorepo (#6864) @m4theushw
113
+ - [license] Polish error messages (#6881) @oliviertassinari
114
+
6
115
  ## 5.17.11
7
116
 
8
117
  _Nov 10, 2022_
@@ -76,7 +76,7 @@ export const MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(in
76
76
  const ownerState = props;
77
77
  const classes = useUtilityClasses(ownerState);
78
78
  const theme = useTheme();
79
- const selectedDateOrToday = date != null ? date : now;
79
+ const selectedDateOrStartOfMonth = React.useMemo(() => date != null ? date : utils.startOfMonth(now), [now, utils, date]);
80
80
  const selectedMonth = React.useMemo(() => {
81
81
  if (date != null) {
82
82
  return utils.getMonth(date);
@@ -113,7 +113,7 @@ export const MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(in
113
113
  return;
114
114
  }
115
115
 
116
- const newDate = utils.setMonth(selectedDateOrToday, month);
116
+ const newDate = utils.setMonth(selectedDateOrStartOfMonth, month);
117
117
  onChange(newDate, 'finish');
118
118
  };
119
119
 
@@ -131,7 +131,7 @@ export const MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(in
131
131
  }
132
132
  }, [setInternalHasFocus, onFocusedViewChange]);
133
133
  const focusMonth = React.useCallback(month => {
134
- if (!isMonthDisabled(utils.setMonth(selectedDateOrToday, month))) {
134
+ if (!isMonthDisabled(utils.setMonth(selectedDateOrStartOfMonth, month))) {
135
135
  setFocusedMonth(month);
136
136
  changeHasFocus(true);
137
137
 
@@ -139,7 +139,7 @@ export const MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(in
139
139
  onMonthFocus(month);
140
140
  }
141
141
  }
142
- }, [selectedDateOrToday, isMonthDisabled, utils, onMonthFocus, changeHasFocus]);
142
+ }, [isMonthDisabled, utils, selectedDateOrStartOfMonth, changeHasFocus, onMonthFocus]);
143
143
  React.useEffect(() => {
144
144
  setFocusedMonth(prevFocusedMonth => selectedMonth !== null && prevFocusedMonth !== selectedMonth ? selectedMonth : prevFocusedMonth);
145
145
  }, [selectedMonth]);
@@ -185,7 +185,7 @@ export const MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(in
185
185
  ownerState: ownerState,
186
186
  onKeyDown: handleKeyDown
187
187
  }, other, {
188
- children: utils.getMonthArray(selectedDateOrToday).map(month => {
188
+ children: utils.getMonthArray(selectedDateOrStartOfMonth).map(month => {
189
189
  const monthNumber = utils.getMonth(month);
190
190
  const monthText = utils.format(month, 'monthShort');
191
191
  const isDisabled = disabled || isMonthDisabled(month);
@@ -76,7 +76,7 @@ export const YearPicker = /*#__PURE__*/React.forwardRef(function YearPicker(inPr
76
76
  } = props;
77
77
  const ownerState = props;
78
78
  const classes = useUtilityClasses(ownerState);
79
- const selectedDateOrToday = date != null ? date : now;
79
+ const selectedDateOrStartOfYear = React.useMemo(() => date != null ? date : utils.startOfYear(now), [now, utils, date]);
80
80
  const currentYear = React.useMemo(() => {
81
81
  if (date != null) {
82
82
  return utils.getYear(date);
@@ -133,17 +133,17 @@ export const YearPicker = /*#__PURE__*/React.forwardRef(function YearPicker(inPr
133
133
  return;
134
134
  }
135
135
 
136
- const newDate = utils.setYear(selectedDateOrToday, year);
136
+ const newDate = utils.setYear(selectedDateOrStartOfYear, year);
137
137
  onChange(newDate, isFinish);
138
138
  };
139
139
 
140
140
  const focusYear = React.useCallback(year => {
141
- if (!isYearDisabled(utils.setYear(selectedDateOrToday, year))) {
141
+ if (!isYearDisabled(utils.setYear(selectedDateOrStartOfYear, year))) {
142
142
  setFocusedYear(year);
143
143
  changeHasFocus(true);
144
144
  onYearFocus == null ? void 0 : onYearFocus(year);
145
145
  }
146
- }, [isYearDisabled, utils, selectedDateOrToday, changeHasFocus, onYearFocus]);
146
+ }, [isYearDisabled, utils, selectedDateOrStartOfYear, changeHasFocus, onYearFocus]);
147
147
  React.useEffect(() => {
148
148
  setFocusedYear(prevFocusedYear => currentYear !== null && prevFocusedYear !== currentYear ? currentYear : prevFocusedYear);
149
149
  }, [currentYear]);
package/index.js CHANGED
@@ -1,4 +1,4 @@
1
- /** @license MUI v5.0.8
1
+ /** @license MUI v5.0.10
2
2
  *
3
3
  * This source code is licensed under the MIT license found in the
4
4
  * LICENSE file in the root directory of this source tree.
@@ -11,6 +11,7 @@ import { styled, useThemeProps } from '@mui/material/styles';
11
11
  import { unstable_composeClasses as composeClasses } from '@mui/material';
12
12
  import { PickersActionBar } from '../../PickersActionBar';
13
13
  import { getPickersPopperUtilityClass } from './pickersPopperClasses';
14
+ import { getActiveElement } from '../utils/utils';
14
15
  import { jsx as _jsx } from "react/jsx-runtime";
15
16
  import { jsxs as _jsxs } from "react/jsx-runtime";
16
17
 
@@ -213,7 +214,7 @@ export function PickersPopper(inProps) {
213
214
  }
214
215
 
215
216
  if (open) {
216
- lastFocusedElementRef.current = document.activeElement;
217
+ lastFocusedElementRef.current = getActiveElement(document);
217
218
  } else if (lastFocusedElementRef.current && lastFocusedElementRef.current instanceof HTMLElement) {
218
219
  // make sure the button is flushed with updated label, before returning focus to it
219
220
  // avoids issue, where screen reader could fail to announce selected date after selection
@@ -6,4 +6,4 @@ export interface PickersToolbarTextProps extends Omit<TypographyProps, 'classes'
6
6
  value: React.ReactNode;
7
7
  classes?: Partial<PickersToolbarTextClasses>;
8
8
  }
9
- export declare const PickersToolbarText: React.ForwardRefExoticComponent<Pick<PickersToolbarTextProps, "selected" | "p" | "slot" | "style" | "title" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "color" | "zIndex" | "position" | "top" | "right" | "bottom" | "left" | "boxShadow" | "width" | "maxWidth" | "minWidth" | "height" | "maxHeight" | "minHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "typography" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "textTransform" | "translate" | "className" | "classes" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "sx" | "variant" | "variantMapping" | "value"> & React.RefAttributes<HTMLSpanElement>>;
9
+ export declare const PickersToolbarText: React.ForwardRefExoticComponent<Pick<PickersToolbarTextProps, "selected" | "p" | "slot" | "style" | "title" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "color" | "zIndex" | "position" | "top" | "right" | "bottom" | "left" | "boxShadow" | "width" | "maxWidth" | "minWidth" | "height" | "maxHeight" | "minHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "typography" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "textTransform" | "translate" | "className" | "classes" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "sx" | "variant" | "variantMapping" | "value"> & React.RefAttributes<HTMLSpanElement>>;
@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import * as React from 'react';
3
3
  import { useForkRef } from '@mui/material/utils';
4
4
  import { WrapperVariantContext } from './WrapperVariantContext';
5
- import { executeInTheNextEventLoopTick } from '../../utils/utils';
5
+ import { executeInTheNextEventLoopTick, getActiveElement } from '../../utils/utils';
6
6
  import { PickersPopper } from '../PickersPopper';
7
7
  import { jsx as _jsx } from "react/jsx-runtime";
8
8
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -30,7 +30,7 @@ export function DesktopTooltipWrapper(props) {
30
30
  executeInTheNextEventLoopTick(() => {
31
31
  var _inputContainerRef$cu, _popperRef$current;
32
32
 
33
- if ((_inputContainerRef$cu = inputContainerRef.current) != null && _inputContainerRef$cu.contains(document.activeElement) || (_popperRef$current = popperRef.current) != null && _popperRef$current.contains(document.activeElement)) {
33
+ if ((_inputContainerRef$cu = inputContainerRef.current) != null && _inputContainerRef$cu.contains(getActiveElement(document)) || (_popperRef$current = popperRef.current) != null && _popperRef$current.contains(getActiveElement(document))) {
34
34
  return;
35
35
  }
36
36
 
@@ -3,3 +3,4 @@ export declare function arrayIncludes<T>(array: T[] | readonly T[], itemOrItems:
3
3
  export declare const onSpaceOrEnter: (innerFn: (ev: React.MouseEvent<any> | React.KeyboardEvent<any>) => void, onFocus?: ((event: React.KeyboardEvent<any>) => void) | undefined) => (event: React.KeyboardEvent) => void;
4
4
  export declare const executeInTheNextEventLoopTick: (fn: () => void) => void;
5
5
  export declare const doNothing: () => void;
6
+ export declare const getActiveElement: (root?: Document | ShadowRoot) => Element | null;
@@ -21,4 +21,18 @@ export const onSpaceOrEnter = (innerFn, onFocus) => event => {
21
21
  export const executeInTheNextEventLoopTick = fn => {
22
22
  setTimeout(fn, 0);
23
23
  };
24
- export const doNothing = () => {};
24
+ export const doNothing = () => {}; // https://www.abeautifulsite.net/posts/finding-the-active-element-in-a-shadow-root/
25
+
26
+ export const getActiveElement = (root = document) => {
27
+ const activeEl = root.activeElement;
28
+
29
+ if (!activeEl) {
30
+ return null;
31
+ }
32
+
33
+ if (activeEl.shadowRoot) {
34
+ return getActiveElement(activeEl.shadowRoot);
35
+ }
36
+
37
+ return activeEl;
38
+ };
@@ -76,7 +76,9 @@ export var MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(inPr
76
76
  var ownerState = props;
77
77
  var classes = useUtilityClasses(ownerState);
78
78
  var theme = useTheme();
79
- var selectedDateOrToday = date != null ? date : now;
79
+ var selectedDateOrStartOfMonth = React.useMemo(function () {
80
+ return date != null ? date : utils.startOfMonth(now);
81
+ }, [now, utils, date]);
80
82
  var selectedMonth = React.useMemo(function () {
81
83
  if (date != null) {
82
84
  return utils.getMonth(date);
@@ -120,7 +122,7 @@ export var MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(inPr
120
122
  return;
121
123
  }
122
124
 
123
- var newDate = utils.setMonth(selectedDateOrToday, month);
125
+ var newDate = utils.setMonth(selectedDateOrStartOfMonth, month);
124
126
  onChange(newDate, 'finish');
125
127
  };
126
128
 
@@ -142,7 +144,7 @@ export var MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(inPr
142
144
  }
143
145
  }, [setInternalHasFocus, onFocusedViewChange]);
144
146
  var focusMonth = React.useCallback(function (month) {
145
- if (!isMonthDisabled(utils.setMonth(selectedDateOrToday, month))) {
147
+ if (!isMonthDisabled(utils.setMonth(selectedDateOrStartOfMonth, month))) {
146
148
  setFocusedMonth(month);
147
149
  changeHasFocus(true);
148
150
 
@@ -150,7 +152,7 @@ export var MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(inPr
150
152
  onMonthFocus(month);
151
153
  }
152
154
  }
153
- }, [selectedDateOrToday, isMonthDisabled, utils, onMonthFocus, changeHasFocus]);
155
+ }, [isMonthDisabled, utils, selectedDateOrStartOfMonth, changeHasFocus, onMonthFocus]);
154
156
  React.useEffect(function () {
155
157
  setFocusedMonth(function (prevFocusedMonth) {
156
158
  return selectedMonth !== null && prevFocusedMonth !== selectedMonth ? selectedMonth : prevFocusedMonth;
@@ -198,7 +200,7 @@ export var MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(inPr
198
200
  ownerState: ownerState,
199
201
  onKeyDown: handleKeyDown
200
202
  }, other, {
201
- children: utils.getMonthArray(selectedDateOrToday).map(function (month) {
203
+ children: utils.getMonthArray(selectedDateOrStartOfMonth).map(function (month) {
202
204
  var monthNumber = utils.getMonth(month);
203
205
  var monthText = utils.format(month, 'monthShort');
204
206
  var isDisabled = disabled || isMonthDisabled(month);
@@ -75,7 +75,9 @@ export var YearPicker = /*#__PURE__*/React.forwardRef(function YearPicker(inProp
75
75
  onFocusedViewChange = props.onFocusedViewChange;
76
76
  var ownerState = props;
77
77
  var classes = useUtilityClasses(ownerState);
78
- var selectedDateOrToday = date != null ? date : now;
78
+ var selectedDateOrStartOfYear = React.useMemo(function () {
79
+ return date != null ? date : utils.startOfYear(now);
80
+ }, [now, utils, date]);
79
81
  var currentYear = React.useMemo(function () {
80
82
  if (date != null) {
81
83
  return utils.getYear(date);
@@ -145,17 +147,17 @@ export var YearPicker = /*#__PURE__*/React.forwardRef(function YearPicker(inProp
145
147
  return;
146
148
  }
147
149
 
148
- var newDate = utils.setYear(selectedDateOrToday, year);
150
+ var newDate = utils.setYear(selectedDateOrStartOfYear, year);
149
151
  onChange(newDate, isFinish);
150
152
  };
151
153
 
152
154
  var focusYear = React.useCallback(function (year) {
153
- if (!isYearDisabled(utils.setYear(selectedDateOrToday, year))) {
155
+ if (!isYearDisabled(utils.setYear(selectedDateOrStartOfYear, year))) {
154
156
  setFocusedYear(year);
155
157
  changeHasFocus(true);
156
158
  onYearFocus == null ? void 0 : onYearFocus(year);
157
159
  }
158
- }, [isYearDisabled, utils, selectedDateOrToday, changeHasFocus, onYearFocus]);
160
+ }, [isYearDisabled, utils, selectedDateOrStartOfYear, changeHasFocus, onYearFocus]);
159
161
  React.useEffect(function () {
160
162
  setFocusedYear(function (prevFocusedYear) {
161
163
  return currentYear !== null && prevFocusedYear !== currentYear ? currentYear : prevFocusedYear;
package/legacy/index.js CHANGED
@@ -1,4 +1,4 @@
1
- /** @license MUI v5.0.8
1
+ /** @license MUI v5.0.10
2
2
  *
3
3
  * This source code is licensed under the MIT license found in the
4
4
  * LICENSE file in the root directory of this source tree.
@@ -12,6 +12,7 @@ import { styled, useThemeProps } from '@mui/material/styles';
12
12
  import { unstable_composeClasses as composeClasses } from '@mui/material';
13
13
  import { PickersActionBar } from '../../PickersActionBar';
14
14
  import { getPickersPopperUtilityClass } from './pickersPopperClasses';
15
+ import { getActiveElement } from '../utils/utils';
15
16
  import { jsx as _jsx } from "react/jsx-runtime";
16
17
  import { jsxs as _jsxs } from "react/jsx-runtime";
17
18
 
@@ -219,7 +220,7 @@ export function PickersPopper(inProps) {
219
220
  }
220
221
 
221
222
  if (open) {
222
- lastFocusedElementRef.current = document.activeElement;
223
+ lastFocusedElementRef.current = getActiveElement(document);
223
224
  } else if (lastFocusedElementRef.current && lastFocusedElementRef.current instanceof HTMLElement) {
224
225
  // make sure the button is flushed with updated label, before returning focus to it
225
226
  // avoids issue, where screen reader could fail to announce selected date after selection
@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import * as React from 'react';
3
3
  import { useForkRef } from '@mui/material/utils';
4
4
  import { WrapperVariantContext } from './WrapperVariantContext';
5
- import { executeInTheNextEventLoopTick } from '../../utils/utils';
5
+ import { executeInTheNextEventLoopTick, getActiveElement } from '../../utils/utils';
6
6
  import { PickersPopper } from '../PickersPopper';
7
7
  import { jsx as _jsx } from "react/jsx-runtime";
8
8
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -28,7 +28,7 @@ export function DesktopTooltipWrapper(props) {
28
28
  executeInTheNextEventLoopTick(function () {
29
29
  var _inputContainerRef$cu, _popperRef$current;
30
30
 
31
- if ((_inputContainerRef$cu = inputContainerRef.current) != null && _inputContainerRef$cu.contains(document.activeElement) || (_popperRef$current = popperRef.current) != null && _popperRef$current.contains(document.activeElement)) {
31
+ if ((_inputContainerRef$cu = inputContainerRef.current) != null && _inputContainerRef$cu.contains(getActiveElement(document)) || (_popperRef$current = popperRef.current) != null && _popperRef$current.contains(getActiveElement(document))) {
32
32
  return;
33
33
  }
34
34
 
@@ -25,4 +25,19 @@ export var onSpaceOrEnter = function onSpaceOrEnter(innerFn, onFocus) {
25
25
  export var executeInTheNextEventLoopTick = function executeInTheNextEventLoopTick(fn) {
26
26
  setTimeout(fn, 0);
27
27
  };
28
- export var doNothing = function doNothing() {};
28
+ export var doNothing = function doNothing() {}; // https://www.abeautifulsite.net/posts/finding-the-active-element-in-a-shadow-root/
29
+
30
+ export var getActiveElement = function getActiveElement() {
31
+ var root = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : document;
32
+ var activeEl = root.activeElement;
33
+
34
+ if (!activeEl) {
35
+ return null;
36
+ }
37
+
38
+ if (activeEl.shadowRoot) {
39
+ return getActiveElement(activeEl.shadowRoot);
40
+ }
41
+
42
+ return activeEl;
43
+ };
@@ -76,7 +76,7 @@ export const MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(in
76
76
  const ownerState = props;
77
77
  const classes = useUtilityClasses(ownerState);
78
78
  const theme = useTheme();
79
- const selectedDateOrToday = date ?? now;
79
+ const selectedDateOrStartOfMonth = React.useMemo(() => date ?? utils.startOfMonth(now), [now, utils, date]);
80
80
  const selectedMonth = React.useMemo(() => {
81
81
  if (date != null) {
82
82
  return utils.getMonth(date);
@@ -113,7 +113,7 @@ export const MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(in
113
113
  return;
114
114
  }
115
115
 
116
- const newDate = utils.setMonth(selectedDateOrToday, month);
116
+ const newDate = utils.setMonth(selectedDateOrStartOfMonth, month);
117
117
  onChange(newDate, 'finish');
118
118
  };
119
119
 
@@ -131,7 +131,7 @@ export const MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(in
131
131
  }
132
132
  }, [setInternalHasFocus, onFocusedViewChange]);
133
133
  const focusMonth = React.useCallback(month => {
134
- if (!isMonthDisabled(utils.setMonth(selectedDateOrToday, month))) {
134
+ if (!isMonthDisabled(utils.setMonth(selectedDateOrStartOfMonth, month))) {
135
135
  setFocusedMonth(month);
136
136
  changeHasFocus(true);
137
137
 
@@ -139,7 +139,7 @@ export const MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(in
139
139
  onMonthFocus(month);
140
140
  }
141
141
  }
142
- }, [selectedDateOrToday, isMonthDisabled, utils, onMonthFocus, changeHasFocus]);
142
+ }, [isMonthDisabled, utils, selectedDateOrStartOfMonth, changeHasFocus, onMonthFocus]);
143
143
  React.useEffect(() => {
144
144
  setFocusedMonth(prevFocusedMonth => selectedMonth !== null && prevFocusedMonth !== selectedMonth ? selectedMonth : prevFocusedMonth);
145
145
  }, [selectedMonth]);
@@ -185,7 +185,7 @@ export const MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(in
185
185
  ownerState: ownerState,
186
186
  onKeyDown: handleKeyDown
187
187
  }, other, {
188
- children: utils.getMonthArray(selectedDateOrToday).map(month => {
188
+ children: utils.getMonthArray(selectedDateOrStartOfMonth).map(month => {
189
189
  const monthNumber = utils.getMonth(month);
190
190
  const monthText = utils.format(month, 'monthShort');
191
191
  const isDisabled = disabled || isMonthDisabled(month);
@@ -76,7 +76,7 @@ export const YearPicker = /*#__PURE__*/React.forwardRef(function YearPicker(inPr
76
76
  } = props;
77
77
  const ownerState = props;
78
78
  const classes = useUtilityClasses(ownerState);
79
- const selectedDateOrToday = date ?? now;
79
+ const selectedDateOrStartOfYear = React.useMemo(() => date ?? utils.startOfYear(now), [now, utils, date]);
80
80
  const currentYear = React.useMemo(() => {
81
81
  if (date != null) {
82
82
  return utils.getYear(date);
@@ -133,17 +133,17 @@ export const YearPicker = /*#__PURE__*/React.forwardRef(function YearPicker(inPr
133
133
  return;
134
134
  }
135
135
 
136
- const newDate = utils.setYear(selectedDateOrToday, year);
136
+ const newDate = utils.setYear(selectedDateOrStartOfYear, year);
137
137
  onChange(newDate, isFinish);
138
138
  };
139
139
 
140
140
  const focusYear = React.useCallback(year => {
141
- if (!isYearDisabled(utils.setYear(selectedDateOrToday, year))) {
141
+ if (!isYearDisabled(utils.setYear(selectedDateOrStartOfYear, year))) {
142
142
  setFocusedYear(year);
143
143
  changeHasFocus(true);
144
144
  onYearFocus?.(year);
145
145
  }
146
- }, [isYearDisabled, utils, selectedDateOrToday, changeHasFocus, onYearFocus]);
146
+ }, [isYearDisabled, utils, selectedDateOrStartOfYear, changeHasFocus, onYearFocus]);
147
147
  React.useEffect(() => {
148
148
  setFocusedYear(prevFocusedYear => currentYear !== null && prevFocusedYear !== currentYear ? currentYear : prevFocusedYear);
149
149
  }, [currentYear]);
package/modern/index.js CHANGED
@@ -1,4 +1,4 @@
1
- /** @license MUI v5.0.8
1
+ /** @license MUI v5.0.10
2
2
  *
3
3
  * This source code is licensed under the MIT license found in the
4
4
  * LICENSE file in the root directory of this source tree.
@@ -11,6 +11,7 @@ import { styled, useThemeProps } from '@mui/material/styles';
11
11
  import { unstable_composeClasses as composeClasses } from '@mui/material';
12
12
  import { PickersActionBar } from '../../PickersActionBar';
13
13
  import { getPickersPopperUtilityClass } from './pickersPopperClasses';
14
+ import { getActiveElement } from '../utils/utils';
14
15
  import { jsx as _jsx } from "react/jsx-runtime";
15
16
  import { jsxs as _jsxs } from "react/jsx-runtime";
16
17
 
@@ -211,7 +212,7 @@ export function PickersPopper(inProps) {
211
212
  }
212
213
 
213
214
  if (open) {
214
- lastFocusedElementRef.current = document.activeElement;
215
+ lastFocusedElementRef.current = getActiveElement(document);
215
216
  } else if (lastFocusedElementRef.current && lastFocusedElementRef.current instanceof HTMLElement) {
216
217
  // make sure the button is flushed with updated label, before returning focus to it
217
218
  // avoids issue, where screen reader could fail to announce selected date after selection
@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import * as React from 'react';
3
3
  import { useForkRef } from '@mui/material/utils';
4
4
  import { WrapperVariantContext } from './WrapperVariantContext';
5
- import { executeInTheNextEventLoopTick } from '../../utils/utils';
5
+ import { executeInTheNextEventLoopTick, getActiveElement } from '../../utils/utils';
6
6
  import { PickersPopper } from '../PickersPopper';
7
7
  import { jsx as _jsx } from "react/jsx-runtime";
8
8
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -28,7 +28,7 @@ export function DesktopTooltipWrapper(props) {
28
28
 
29
29
  const handleBlur = () => {
30
30
  executeInTheNextEventLoopTick(() => {
31
- if (inputContainerRef.current?.contains(document.activeElement) || popperRef.current?.contains(document.activeElement)) {
31
+ if (inputContainerRef.current?.contains(getActiveElement(document)) || popperRef.current?.contains(getActiveElement(document))) {
32
32
  return;
33
33
  }
34
34
 
@@ -21,4 +21,18 @@ export const onSpaceOrEnter = (innerFn, onFocus) => event => {
21
21
  export const executeInTheNextEventLoopTick = fn => {
22
22
  setTimeout(fn, 0);
23
23
  };
24
- export const doNothing = () => {};
24
+ export const doNothing = () => {}; // https://www.abeautifulsite.net/posts/finding-the-active-element-in-a-shadow-root/
25
+
26
+ export const getActiveElement = (root = document) => {
27
+ const activeEl = root.activeElement;
28
+
29
+ if (!activeEl) {
30
+ return null;
31
+ }
32
+
33
+ if (activeEl.shadowRoot) {
34
+ return getActiveElement(activeEl.shadowRoot);
35
+ }
36
+
37
+ return activeEl;
38
+ };
@@ -102,7 +102,7 @@ const MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(inProps,
102
102
  const ownerState = props;
103
103
  const classes = useUtilityClasses(ownerState);
104
104
  const theme = (0, _system.useTheme)();
105
- const selectedDateOrToday = date != null ? date : now;
105
+ const selectedDateOrStartOfMonth = React.useMemo(() => date != null ? date : utils.startOfMonth(now), [now, utils, date]);
106
106
  const selectedMonth = React.useMemo(() => {
107
107
  if (date != null) {
108
108
  return utils.getMonth(date);
@@ -139,7 +139,7 @@ const MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(inProps,
139
139
  return;
140
140
  }
141
141
 
142
- const newDate = utils.setMonth(selectedDateOrToday, month);
142
+ const newDate = utils.setMonth(selectedDateOrStartOfMonth, month);
143
143
  onChange(newDate, 'finish');
144
144
  };
145
145
 
@@ -157,7 +157,7 @@ const MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(inProps,
157
157
  }
158
158
  }, [setInternalHasFocus, onFocusedViewChange]);
159
159
  const focusMonth = React.useCallback(month => {
160
- if (!isMonthDisabled(utils.setMonth(selectedDateOrToday, month))) {
160
+ if (!isMonthDisabled(utils.setMonth(selectedDateOrStartOfMonth, month))) {
161
161
  setFocusedMonth(month);
162
162
  changeHasFocus(true);
163
163
 
@@ -165,7 +165,7 @@ const MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(inProps,
165
165
  onMonthFocus(month);
166
166
  }
167
167
  }
168
- }, [selectedDateOrToday, isMonthDisabled, utils, onMonthFocus, changeHasFocus]);
168
+ }, [isMonthDisabled, utils, selectedDateOrStartOfMonth, changeHasFocus, onMonthFocus]);
169
169
  React.useEffect(() => {
170
170
  setFocusedMonth(prevFocusedMonth => selectedMonth !== null && prevFocusedMonth !== selectedMonth ? selectedMonth : prevFocusedMonth);
171
171
  }, [selectedMonth]);
@@ -211,7 +211,7 @@ const MonthPicker = /*#__PURE__*/React.forwardRef(function MonthPicker(inProps,
211
211
  ownerState: ownerState,
212
212
  onKeyDown: handleKeyDown
213
213
  }, other, {
214
- children: utils.getMonthArray(selectedDateOrToday).map(month => {
214
+ children: utils.getMonthArray(selectedDateOrStartOfMonth).map(month => {
215
215
  const monthNumber = utils.getMonth(month);
216
216
  const monthText = utils.format(month, 'monthShort');
217
217
  const isDisabled = disabled || isMonthDisabled(month);
@@ -102,7 +102,7 @@ const YearPicker = /*#__PURE__*/React.forwardRef(function YearPicker(inProps, re
102
102
  } = props;
103
103
  const ownerState = props;
104
104
  const classes = useUtilityClasses(ownerState);
105
- const selectedDateOrToday = date != null ? date : now;
105
+ const selectedDateOrStartOfYear = React.useMemo(() => date != null ? date : utils.startOfYear(now), [now, utils, date]);
106
106
  const currentYear = React.useMemo(() => {
107
107
  if (date != null) {
108
108
  return utils.getYear(date);
@@ -159,17 +159,17 @@ const YearPicker = /*#__PURE__*/React.forwardRef(function YearPicker(inProps, re
159
159
  return;
160
160
  }
161
161
 
162
- const newDate = utils.setYear(selectedDateOrToday, year);
162
+ const newDate = utils.setYear(selectedDateOrStartOfYear, year);
163
163
  onChange(newDate, isFinish);
164
164
  };
165
165
 
166
166
  const focusYear = React.useCallback(year => {
167
- if (!isYearDisabled(utils.setYear(selectedDateOrToday, year))) {
167
+ if (!isYearDisabled(utils.setYear(selectedDateOrStartOfYear, year))) {
168
168
  setFocusedYear(year);
169
169
  changeHasFocus(true);
170
170
  onYearFocus == null ? void 0 : onYearFocus(year);
171
171
  }
172
- }, [isYearDisabled, utils, selectedDateOrToday, changeHasFocus, onYearFocus]);
172
+ }, [isYearDisabled, utils, selectedDateOrStartOfYear, changeHasFocus, onYearFocus]);
173
173
  React.useEffect(() => {
174
174
  setFocusedYear(prevFocusedYear => currentYear !== null && prevFocusedYear !== currentYear ? currentYear : prevFocusedYear);
175
175
  }, [currentYear]);
package/node/index.js CHANGED
@@ -1,4 +1,4 @@
1
- /** @license MUI v5.0.8
1
+ /** @license MUI v5.0.10
2
2
  *
3
3
  * This source code is licensed under the MIT license found in the
4
4
  * LICENSE file in the root directory of this source tree.
@@ -31,6 +31,8 @@ var _PickersActionBar = require("../../PickersActionBar");
31
31
 
32
32
  var _pickersPopperClasses = require("./pickersPopperClasses");
33
33
 
34
+ var _utils2 = require("../utils/utils");
35
+
34
36
  var _jsxRuntime = require("react/jsx-runtime");
35
37
 
36
38
  const _excluded = ["onClick", "onTouchStart"];
@@ -238,7 +240,7 @@ function PickersPopper(inProps) {
238
240
  }
239
241
 
240
242
  if (open) {
241
- lastFocusedElementRef.current = document.activeElement;
243
+ lastFocusedElementRef.current = (0, _utils2.getActiveElement)(document);
242
244
  } else if (lastFocusedElementRef.current && lastFocusedElementRef.current instanceof HTMLElement) {
243
245
  // make sure the button is flushed with updated label, before returning focus to it
244
246
  // avoids issue, where screen reader could fail to announce selected date after selection
@@ -49,7 +49,7 @@ function DesktopTooltipWrapper(props) {
49
49
  (0, _utils2.executeInTheNextEventLoopTick)(() => {
50
50
  var _inputContainerRef$cu, _popperRef$current;
51
51
 
52
- if ((_inputContainerRef$cu = inputContainerRef.current) != null && _inputContainerRef$cu.contains(document.activeElement) || (_popperRef$current = popperRef.current) != null && _popperRef$current.contains(document.activeElement)) {
52
+ if ((_inputContainerRef$cu = inputContainerRef.current) != null && _inputContainerRef$cu.contains((0, _utils2.getActiveElement)(document)) || (_popperRef$current = popperRef.current) != null && _popperRef$current.contains((0, _utils2.getActiveElement)(document))) {
53
53
  return;
54
54
  }
55
55
 
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.arrayIncludes = arrayIncludes;
7
- exports.onSpaceOrEnter = exports.executeInTheNextEventLoopTick = exports.doNothing = void 0;
7
+ exports.onSpaceOrEnter = exports.getActiveElement = exports.executeInTheNextEventLoopTick = exports.doNothing = void 0;
8
8
 
9
9
  /* Use it instead of .includes method for IE support */
10
10
  function arrayIncludes(array, itemOrItems) {
@@ -36,6 +36,23 @@ const executeInTheNextEventLoopTick = fn => {
36
36
 
37
37
  exports.executeInTheNextEventLoopTick = executeInTheNextEventLoopTick;
38
38
 
39
- const doNothing = () => {};
39
+ const doNothing = () => {}; // https://www.abeautifulsite.net/posts/finding-the-active-element-in-a-shadow-root/
40
40
 
41
- exports.doNothing = doNothing;
41
+
42
+ exports.doNothing = doNothing;
43
+
44
+ const getActiveElement = (root = document) => {
45
+ const activeEl = root.activeElement;
46
+
47
+ if (!activeEl) {
48
+ return null;
49
+ }
50
+
51
+ if (activeEl.shadowRoot) {
52
+ return getActiveElement(activeEl.shadowRoot);
53
+ }
54
+
55
+ return activeEl;
56
+ };
57
+
58
+ exports.getActiveElement = getActiveElement;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mui/x-date-pickers",
3
- "version": "5.0.8",
3
+ "version": "5.0.10",
4
4
  "description": "The community edition of the date picker components (MUI X).",
5
5
  "author": "MUI Team",
6
6
  "main": "./node/index.js",