@mui/x-date-pickers 8.5.1 → 8.5.2
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 +92 -0
- package/PickerDay2/PickerDay2.d.ts +7 -0
- package/PickerDay2/PickerDay2.js +369 -0
- package/PickerDay2/PickerDay2.types.d.ts +18 -0
- package/PickerDay2/PickerDay2.types.js +5 -0
- package/PickerDay2/index.d.ts +4 -0
- package/PickerDay2/index.js +25 -0
- package/PickerDay2/pickerDay2Classes.d.ts +17 -0
- package/PickerDay2/pickerDay2Classes.js +14 -0
- package/PickersDay/PickersDay.js +1 -1
- package/PickersTextField/PickersTextField.js +4 -1
- package/esm/PickerDay2/PickerDay2.d.ts +7 -0
- package/esm/PickerDay2/PickerDay2.js +361 -0
- package/esm/PickerDay2/PickerDay2.types.d.ts +18 -0
- package/esm/PickerDay2/PickerDay2.types.js +1 -0
- package/esm/PickerDay2/index.d.ts +4 -0
- package/esm/PickerDay2/index.js +2 -0
- package/esm/PickerDay2/pickerDay2Classes.d.ts +17 -0
- package/esm/PickerDay2/pickerDay2Classes.js +6 -0
- package/esm/PickersDay/PickersDay.js +1 -1
- package/esm/PickersTextField/PickersTextField.js +4 -1
- package/esm/index.d.ts +1 -0
- package/esm/index.js +2 -1
- package/esm/themeAugmentation/components.d.ts +4 -0
- package/esm/themeAugmentation/overrides.d.ts +2 -0
- package/esm/themeAugmentation/props.d.ts +2 -0
- package/index.d.ts +1 -0
- package/index.js +13 -1
- package/package.json +3 -3
- package/themeAugmentation/components.d.ts +4 -0
- package/themeAugmentation/overrides.d.ts +2 -0
- package/themeAugmentation/props.d.ts +2 -0
package/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,98 @@
|
|
|
5
5
|
All notable changes to this project will be documented in this file.
|
|
6
6
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
7
7
|
|
|
8
|
+
## 8.5.2
|
|
9
|
+
|
|
10
|
+
_Jun 12, 2025_
|
|
11
|
+
|
|
12
|
+
We'd like to extend a big thank you to the 15 contributors who made this release possible. Here are some highlights ✨:
|
|
13
|
+
|
|
14
|
+
- 📊 Improve Data Grid selectors performance
|
|
15
|
+
- 🐞 Fix `useSyncExternalStore` import error in React 17
|
|
16
|
+
|
|
17
|
+
Special thanks go out to the community members for their valuable contributions:
|
|
18
|
+
@alisasanib, @noobyogi0010.
|
|
19
|
+
|
|
20
|
+
The following are all team members who have contributed to this release:
|
|
21
|
+
@alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @JCQuintas, @KenanYusuf, @LukasTy, @mapache-salvaje, @michelengelen, @noraleonte, @oliviertassinari, @prakhargupta1, @romgrk.
|
|
22
|
+
|
|
23
|
+
### Data Grid
|
|
24
|
+
|
|
25
|
+
#### `@mui/x-data-grid@8.5.2`
|
|
26
|
+
|
|
27
|
+
- [DataGrid] Improve selectors performance (#18234) @romgrk
|
|
28
|
+
- [DataGrid] Fix data grid palette when using CSS vars (#18310) @KenanYusuf
|
|
29
|
+
- [DataGrid] Ignore data source request if the grid got unmounted (#18268) @arminmeh
|
|
30
|
+
|
|
31
|
+
#### `@mui/x-data-grid-pro@8.5.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
32
|
+
|
|
33
|
+
Same changes as in `@mui/x-data-grid@8.5.2`, plus:
|
|
34
|
+
|
|
35
|
+
- [DataGridPro] Fix flex column width if it is a pinned column (#18293) @alisasanib
|
|
36
|
+
- [DataGridPro] Fix inconsistent filtering results with aggregation (#17954) @cherniavskii
|
|
37
|
+
|
|
38
|
+
#### `@mui/x-data-grid-premium@8.5.2` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
39
|
+
|
|
40
|
+
Same changes as in `@mui/x-data-grid-pro@8.5.2`.
|
|
41
|
+
|
|
42
|
+
### Date and Time Pickers
|
|
43
|
+
|
|
44
|
+
#### `@mui/x-date-pickers@8.5.2`
|
|
45
|
+
|
|
46
|
+
- [pickers] Add `PickerDay2` and `DateRangePickerDay2` components (#15921) @noraleonte
|
|
47
|
+
- [pickers] Fix `hiddenLabel` prop propagation (#18195) @noobyogi0010
|
|
48
|
+
|
|
49
|
+
#### `@mui/x-date-pickers-pro@8.5.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
50
|
+
|
|
51
|
+
Same changes as in `@mui/x-date-pickers@8.5.2`.
|
|
52
|
+
|
|
53
|
+
### Charts
|
|
54
|
+
|
|
55
|
+
#### `@mui/x-charts@8.5.2`
|
|
56
|
+
|
|
57
|
+
- [charts] Add a default value formatter for continuous scales (#18178) @bernardobelchior
|
|
58
|
+
- [charts] Add margin-bottom to charts toolbar (#18326) @bernardobelchior
|
|
59
|
+
- [charts] Fix grid with band scale (#18295) @alexfauquette
|
|
60
|
+
- [charts] Remove unnecessary style changes in tests (#18317) @JCQuintas
|
|
61
|
+
- [charts] Remove `sx` prop merging from `useComponentRenderer` (#18235) @bernardobelchior
|
|
62
|
+
- [charts] Fix `useSyncExternalStore` import error in React 17 (#18314) @bernardobelchior
|
|
63
|
+
|
|
64
|
+
#### `@mui/x-charts-pro@8.5.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
65
|
+
|
|
66
|
+
Same changes as in `@mui/x-charts@8.5.2`, plus:
|
|
67
|
+
|
|
68
|
+
- [charts-pro] Document zoom slider tooltip value formatting (#18261) @bernardobelchior
|
|
69
|
+
- [charts-pro] Funnel `gap` prop does not impact the drawing area (#18233) @JCQuintas
|
|
70
|
+
- [charts-pro] Use `ChartsToolbarPro` types in pro charts (#18243) @bernardobelchior
|
|
71
|
+
|
|
72
|
+
### Tree View
|
|
73
|
+
|
|
74
|
+
#### `@mui/x-tree-view@8.5.2`
|
|
75
|
+
|
|
76
|
+
- [tree-view] Fix `useSyncExternalStore` import error in React 17 (#18314) @bernardobelchior
|
|
77
|
+
|
|
78
|
+
#### `@mui/x-tree-view-pro@8.5.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
79
|
+
|
|
80
|
+
Same changes as in `@mui/x-tree-view@8.5.2`.
|
|
81
|
+
|
|
82
|
+
### Docs
|
|
83
|
+
|
|
84
|
+
- [docs] Add toolbar custom trigger and panel recipe (#18297) @KenanYusuf
|
|
85
|
+
- [docs] Copyedit the Priority support page (#18311) @mapache-salvaje
|
|
86
|
+
- [docs] Remove confusing opt-out mention in telemetry docs (#18257) @prakhargupta1
|
|
87
|
+
- [docs] Revise the Master Detail doc (#17927) @mapache-salvaje
|
|
88
|
+
- [docs] Revise the list view doc (#17928) @mapache-salvaje
|
|
89
|
+
- [docs] Audit and revise the Pro column docs (#17844) @mapache-salvaje
|
|
90
|
+
- [docs] Add some more context on Heatmap (#18256) @oliviertassinari
|
|
91
|
+
- [x-telemetry] Reduce Telemetry overhead (#18292) @oliviertassinari
|
|
92
|
+
- [code-infra] Align Node version used in CI to v22 (#18319) @LukasTy
|
|
93
|
+
- [code-infra] Fix pkg.pr.new publishing (#18316) @bernardobelchior
|
|
94
|
+
- [code-infra] Revert `React` to `19.0.0` (#18265) @LukasTy
|
|
95
|
+
- [code-infra] Use `catalog` for reused dependencies (#18302) @LukasTy
|
|
96
|
+
- [infra] Remove unused karma/mocha deps and files (#18340) @JCQuintas
|
|
97
|
+
- [infra] Update github label references to use 'scope' instead of 'component' (#18260) @michelengelen
|
|
98
|
+
- [infra] Use a single browser server in CI (#18230) @JCQuintas
|
|
99
|
+
|
|
8
100
|
## 8.5.1
|
|
9
101
|
|
|
10
102
|
<!-- generated comparing v8.5.0..master -->
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { PickerDay2Props } from "./PickerDay2.types.js";
|
|
3
|
+
type PickerDay2Component = ((props: PickerDay2Props & React.RefAttributes<HTMLButtonElement>) => React.JSX.Element) & {
|
|
4
|
+
propTypes?: any;
|
|
5
|
+
};
|
|
6
|
+
export declare const PickerDay2: PickerDay2Component;
|
|
7
|
+
export {};
|
|
@@ -0,0 +1,369 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.PickerDay2 = void 0;
|
|
9
|
+
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
|
10
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
11
|
+
var React = _interopRequireWildcard(require("react"));
|
|
12
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
+
var _clsx = _interopRequireDefault(require("clsx"));
|
|
14
|
+
var _styles = require("@mui/material/styles");
|
|
15
|
+
var _ButtonBase = _interopRequireDefault(require("@mui/material/ButtonBase"));
|
|
16
|
+
var _useForkRef = _interopRequireDefault(require("@mui/utils/useForkRef"));
|
|
17
|
+
var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
|
|
18
|
+
var _useEnhancedEffect = _interopRequireDefault(require("@mui/utils/useEnhancedEffect"));
|
|
19
|
+
var _dimensions = require("../internals/constants/dimensions");
|
|
20
|
+
var _pickerDay2Classes = require("./pickerDay2Classes");
|
|
21
|
+
var _useUtils = require("../internals/hooks/useUtils");
|
|
22
|
+
var _usePickerDayOwnerState = require("../PickersDay/usePickerDayOwnerState");
|
|
23
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
24
|
+
const _excluded = ["autoFocus", "className", "classes", "hidden", "isAnimating", "onClick", "onDaySelect", "onFocus", "onBlur", "onKeyDown", "onMouseDown", "onMouseEnter", "children", "isFirstVisibleCell", "isLastVisibleCell", "day", "selected", "disabled", "today", "outsideCurrentMonth", "disableMargin", "disableHighlightToday", "showDaysOutsideCurrentMonth", "isVisuallySelected"];
|
|
25
|
+
const useUtilityClasses = (ownerState, classes) => {
|
|
26
|
+
const {
|
|
27
|
+
isDaySelected,
|
|
28
|
+
disableHighlightToday,
|
|
29
|
+
isDayCurrent,
|
|
30
|
+
isDayDisabled,
|
|
31
|
+
isDayOutsideMonth,
|
|
32
|
+
isDayFillerCell
|
|
33
|
+
} = ownerState;
|
|
34
|
+
const slots = {
|
|
35
|
+
root: ['root', isDaySelected && !isDayFillerCell && 'selected', isDayDisabled && 'disabled', !disableHighlightToday && isDayCurrent && !isDaySelected && !isDayFillerCell && 'today', isDayOutsideMonth && 'dayOutsideMonth', isDayFillerCell && 'fillerCell']
|
|
36
|
+
};
|
|
37
|
+
return (0, _composeClasses.default)(slots, _pickerDay2Classes.getPickerDay2UtilityClass, classes);
|
|
38
|
+
};
|
|
39
|
+
const PickerDay2Root = (0, _styles.styled)(_ButtonBase.default, {
|
|
40
|
+
name: 'MuiPickerDay2',
|
|
41
|
+
slot: 'Root',
|
|
42
|
+
overridesResolver: (props, styles) => {
|
|
43
|
+
const {
|
|
44
|
+
ownerState
|
|
45
|
+
} = props;
|
|
46
|
+
return [styles.root, !ownerState.disableHighlightToday && ownerState.isDayCurrent && styles.today, !ownerState.isDayOutsideMonth && styles.dayOutsideMonth, ownerState.isDayFillerCell && styles.fillerCell];
|
|
47
|
+
}
|
|
48
|
+
})(({
|
|
49
|
+
theme
|
|
50
|
+
}) => (0, _extends2.default)({
|
|
51
|
+
'--PickerDay-horizontalMargin': `${_dimensions.DAY_MARGIN}px`,
|
|
52
|
+
'--PickerDay-size': `${_dimensions.DAY_SIZE}px`
|
|
53
|
+
}, theme.typography.caption, {
|
|
54
|
+
width: 'var(--PickerDay-size)',
|
|
55
|
+
height: 'var(--PickerDay-size)',
|
|
56
|
+
borderRadius: 'calc(var(--PickerDay-size) / 2)',
|
|
57
|
+
padding: 0,
|
|
58
|
+
// explicitly setting to `transparent` to avoid potentially getting impacted by change from the overridden component
|
|
59
|
+
backgroundColor: 'transparent',
|
|
60
|
+
transition: theme.transitions.create('background-color', {
|
|
61
|
+
duration: theme.transitions.duration.short
|
|
62
|
+
}),
|
|
63
|
+
color: (theme.vars || theme).palette.text.primary,
|
|
64
|
+
'@media (pointer: fine)': {
|
|
65
|
+
'&:hover': {
|
|
66
|
+
backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : (0, _styles.alpha)(theme.palette.primary.main, theme.palette.action.hoverOpacity)
|
|
67
|
+
}
|
|
68
|
+
},
|
|
69
|
+
'&:focus': {
|
|
70
|
+
backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.focusOpacity})` : (0, _styles.alpha)(theme.palette.primary.main, theme.palette.action.focusOpacity)
|
|
71
|
+
},
|
|
72
|
+
marginLeft: 'var(--PickerDay-horizontalMargin)',
|
|
73
|
+
marginRight: 'var(--PickerDay-horizontalMargin)',
|
|
74
|
+
variants: [{
|
|
75
|
+
props: {
|
|
76
|
+
isDaySelected: true
|
|
77
|
+
},
|
|
78
|
+
style: {
|
|
79
|
+
color: (theme.vars || theme).palette.primary.contrastText,
|
|
80
|
+
backgroundColor: (theme.vars || theme).palette.primary.main,
|
|
81
|
+
fontWeight: theme.typography.fontWeightMedium,
|
|
82
|
+
'&:focus, &:hover': {
|
|
83
|
+
willChange: 'background-color',
|
|
84
|
+
backgroundColor: (theme.vars || theme).palette.primary.dark
|
|
85
|
+
},
|
|
86
|
+
[`&.${_pickerDay2Classes.pickerDay2Classes.disabled}`]: {
|
|
87
|
+
opacity: 0.6
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
}, {
|
|
91
|
+
props: {
|
|
92
|
+
isDayDisabled: true
|
|
93
|
+
},
|
|
94
|
+
style: {
|
|
95
|
+
color: (theme.vars || theme).palette.text.disabled
|
|
96
|
+
}
|
|
97
|
+
}, {
|
|
98
|
+
props: {
|
|
99
|
+
isDayFillerCell: true
|
|
100
|
+
},
|
|
101
|
+
style: {
|
|
102
|
+
// visibility: 'hidden' does not work here as it hides the element from screen readers
|
|
103
|
+
// and results in unexpected relationships between week day and day columns.
|
|
104
|
+
opacity: 0,
|
|
105
|
+
pointerEvents: 'none'
|
|
106
|
+
}
|
|
107
|
+
}, {
|
|
108
|
+
props: {
|
|
109
|
+
isDayOutsideMonth: true
|
|
110
|
+
},
|
|
111
|
+
style: {
|
|
112
|
+
color: (theme.vars || theme).palette.text.secondary
|
|
113
|
+
}
|
|
114
|
+
}, {
|
|
115
|
+
props: {
|
|
116
|
+
isDayCurrent: true,
|
|
117
|
+
isDaySelected: false
|
|
118
|
+
},
|
|
119
|
+
style: {
|
|
120
|
+
outline: `1px solid ${(theme.vars || theme).palette.text.secondary}`,
|
|
121
|
+
outlineOffset: -1
|
|
122
|
+
}
|
|
123
|
+
}]
|
|
124
|
+
}));
|
|
125
|
+
const noop = () => {};
|
|
126
|
+
const PickerDay2Raw = /*#__PURE__*/React.forwardRef(function PickerDay2(inProps, forwardedRef) {
|
|
127
|
+
const props = (0, _styles.useThemeProps)({
|
|
128
|
+
props: inProps,
|
|
129
|
+
name: 'MuiPickerDay2'
|
|
130
|
+
});
|
|
131
|
+
const utils = (0, _useUtils.useUtils)();
|
|
132
|
+
const {
|
|
133
|
+
autoFocus = false,
|
|
134
|
+
className,
|
|
135
|
+
classes: classesProp,
|
|
136
|
+
isAnimating,
|
|
137
|
+
onClick,
|
|
138
|
+
onDaySelect,
|
|
139
|
+
onFocus = noop,
|
|
140
|
+
onBlur = noop,
|
|
141
|
+
onKeyDown = noop,
|
|
142
|
+
onMouseDown = noop,
|
|
143
|
+
onMouseEnter = noop,
|
|
144
|
+
children,
|
|
145
|
+
day,
|
|
146
|
+
selected,
|
|
147
|
+
disabled,
|
|
148
|
+
today,
|
|
149
|
+
outsideCurrentMonth,
|
|
150
|
+
disableMargin,
|
|
151
|
+
disableHighlightToday,
|
|
152
|
+
showDaysOutsideCurrentMonth
|
|
153
|
+
} = props,
|
|
154
|
+
other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
|
|
155
|
+
const pickersDayOwnerState = (0, _usePickerDayOwnerState.usePickerDayOwnerState)({
|
|
156
|
+
day,
|
|
157
|
+
selected,
|
|
158
|
+
disabled,
|
|
159
|
+
today,
|
|
160
|
+
outsideCurrentMonth,
|
|
161
|
+
disableMargin,
|
|
162
|
+
disableHighlightToday,
|
|
163
|
+
showDaysOutsideCurrentMonth
|
|
164
|
+
});
|
|
165
|
+
const ownerState = (0, _extends2.default)({}, pickersDayOwnerState, {
|
|
166
|
+
// Properties specific to the MUI implementation (some might be removed in the next major)
|
|
167
|
+
isDayFillerCell: outsideCurrentMonth && !showDaysOutsideCurrentMonth
|
|
168
|
+
});
|
|
169
|
+
const classes = useUtilityClasses(ownerState, classesProp);
|
|
170
|
+
const ref = React.useRef(null);
|
|
171
|
+
const handleRef = (0, _useForkRef.default)(ref, forwardedRef);
|
|
172
|
+
|
|
173
|
+
// Since this is rendered when a Popper is opened we can't use passive effects.
|
|
174
|
+
// Focusing in passive effects in Popper causes scroll jump.
|
|
175
|
+
(0, _useEnhancedEffect.default)(() => {
|
|
176
|
+
if (autoFocus && !disabled && !isAnimating && !outsideCurrentMonth) {
|
|
177
|
+
// ref.current being null would be a bug in MUI
|
|
178
|
+
ref.current.focus();
|
|
179
|
+
}
|
|
180
|
+
}, [autoFocus, disabled, isAnimating, outsideCurrentMonth]);
|
|
181
|
+
|
|
182
|
+
// For a day outside the current month, move the focus from mouseDown to mouseUp
|
|
183
|
+
// Goal: have the onClick ends before sliding to the new month
|
|
184
|
+
const handleMouseDown = event => {
|
|
185
|
+
onMouseDown(event);
|
|
186
|
+
if (outsideCurrentMonth) {
|
|
187
|
+
event.preventDefault();
|
|
188
|
+
}
|
|
189
|
+
};
|
|
190
|
+
const handleClick = event => {
|
|
191
|
+
if (!disabled) {
|
|
192
|
+
onDaySelect(day);
|
|
193
|
+
}
|
|
194
|
+
if (outsideCurrentMonth) {
|
|
195
|
+
event.currentTarget.focus();
|
|
196
|
+
}
|
|
197
|
+
if (onClick) {
|
|
198
|
+
onClick(event);
|
|
199
|
+
}
|
|
200
|
+
};
|
|
201
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(PickerDay2Root, (0, _extends2.default)({
|
|
202
|
+
ref: handleRef,
|
|
203
|
+
centerRipple: true
|
|
204
|
+
// compat with PickersDay for tests
|
|
205
|
+
,
|
|
206
|
+
|
|
207
|
+
disabled: disabled,
|
|
208
|
+
tabIndex: selected ? 0 : -1,
|
|
209
|
+
onKeyDown: event => onKeyDown(event, day),
|
|
210
|
+
onFocus: event => onFocus(event, day),
|
|
211
|
+
onBlur: event => onBlur(event, day),
|
|
212
|
+
onMouseEnter: event => onMouseEnter(event, day),
|
|
213
|
+
onClick: handleClick,
|
|
214
|
+
onMouseDown: handleMouseDown
|
|
215
|
+
}, other, {
|
|
216
|
+
ownerState: ownerState,
|
|
217
|
+
className: (0, _clsx.default)(classes.root, className),
|
|
218
|
+
children: children ?? (ownerState.isDayFillerCell ? null : utils.format(day, 'dayOfMonth'))
|
|
219
|
+
}));
|
|
220
|
+
});
|
|
221
|
+
if (process.env.NODE_ENV !== "production") PickerDay2Raw.displayName = "PickerDay2Raw";
|
|
222
|
+
process.env.NODE_ENV !== "production" ? PickerDay2Raw.propTypes = {
|
|
223
|
+
// ----------------------------- Warning --------------------------------
|
|
224
|
+
// | These PropTypes are generated from the TypeScript type definitions |
|
|
225
|
+
// | To update them edit the TypeScript types and run "pnpm proptypes" |
|
|
226
|
+
// ----------------------------------------------------------------------
|
|
227
|
+
/**
|
|
228
|
+
* A ref for imperative actions.
|
|
229
|
+
* It currently only supports `focusVisible()` action.
|
|
230
|
+
*/
|
|
231
|
+
action: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
|
|
232
|
+
current: _propTypes.default.shape({
|
|
233
|
+
focusVisible: _propTypes.default.func.isRequired
|
|
234
|
+
})
|
|
235
|
+
})]),
|
|
236
|
+
/**
|
|
237
|
+
* If `true`, the ripples are centered.
|
|
238
|
+
* They won't start at the cursor interaction position.
|
|
239
|
+
* @default false
|
|
240
|
+
*/
|
|
241
|
+
centerRipple: _propTypes.default.bool,
|
|
242
|
+
/**
|
|
243
|
+
* Override or extend the styles applied to the component.
|
|
244
|
+
*/
|
|
245
|
+
classes: _propTypes.default.object,
|
|
246
|
+
className: _propTypes.default.string,
|
|
247
|
+
component: _propTypes.default.elementType,
|
|
248
|
+
/**
|
|
249
|
+
* The date to show.
|
|
250
|
+
*/
|
|
251
|
+
day: _propTypes.default.object.isRequired,
|
|
252
|
+
/**
|
|
253
|
+
* If `true`, renders as disabled.
|
|
254
|
+
* @default false
|
|
255
|
+
*/
|
|
256
|
+
disabled: _propTypes.default.bool,
|
|
257
|
+
/**
|
|
258
|
+
* If `true`, today's date is rendering without highlighting with circle.
|
|
259
|
+
* @default false
|
|
260
|
+
*/
|
|
261
|
+
disableHighlightToday: _propTypes.default.bool,
|
|
262
|
+
/**
|
|
263
|
+
* If `true`, days are rendering without margin. Useful for displaying linked range of days.
|
|
264
|
+
* @default false
|
|
265
|
+
*/
|
|
266
|
+
disableMargin: _propTypes.default.bool,
|
|
267
|
+
/**
|
|
268
|
+
* If `true`, the ripple effect is disabled.
|
|
269
|
+
*
|
|
270
|
+
* ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure
|
|
271
|
+
* to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
|
|
272
|
+
* @default false
|
|
273
|
+
*/
|
|
274
|
+
disableRipple: _propTypes.default.bool,
|
|
275
|
+
/**
|
|
276
|
+
* If `true`, the touch ripple effect is disabled.
|
|
277
|
+
* @default false
|
|
278
|
+
*/
|
|
279
|
+
disableTouchRipple: _propTypes.default.bool,
|
|
280
|
+
/**
|
|
281
|
+
* If `true`, the base button will have a keyboard focus ripple.
|
|
282
|
+
* @default false
|
|
283
|
+
*/
|
|
284
|
+
focusRipple: _propTypes.default.bool,
|
|
285
|
+
/**
|
|
286
|
+
* This prop can help identify which element has keyboard focus.
|
|
287
|
+
* The class name will be applied when the element gains the focus through keyboard interaction.
|
|
288
|
+
* It's a polyfill for the [CSS :focus-visible selector](https://drafts.csswg.org/selectors-4/#the-focus-visible-pseudo).
|
|
289
|
+
* The rationale for using this feature [is explained here](https://github.com/WICG/focus-visible/blob/HEAD/explainer.md).
|
|
290
|
+
* A [polyfill can be used](https://github.com/WICG/focus-visible) to apply a `focus-visible` class to other components
|
|
291
|
+
* if needed.
|
|
292
|
+
*/
|
|
293
|
+
focusVisibleClassName: _propTypes.default.string,
|
|
294
|
+
isAnimating: _propTypes.default.bool,
|
|
295
|
+
/**
|
|
296
|
+
* If `true`, day is the first visible cell of the month.
|
|
297
|
+
* Either the first day of the month or the first day of the week depending on `showDaysOutsideCurrentMonth`.
|
|
298
|
+
*/
|
|
299
|
+
isFirstVisibleCell: _propTypes.default.bool.isRequired,
|
|
300
|
+
/**
|
|
301
|
+
* If `true`, day is the last visible cell of the month.
|
|
302
|
+
* Either the last day of the month or the last day of the week depending on `showDaysOutsideCurrentMonth`.
|
|
303
|
+
*/
|
|
304
|
+
isLastVisibleCell: _propTypes.default.bool.isRequired,
|
|
305
|
+
/**
|
|
306
|
+
* Indicates if the day should be visually selected.
|
|
307
|
+
*/
|
|
308
|
+
isVisuallySelected: _propTypes.default.bool,
|
|
309
|
+
onBlur: _propTypes.default.func,
|
|
310
|
+
onDaySelect: _propTypes.default.func.isRequired,
|
|
311
|
+
onFocus: _propTypes.default.func,
|
|
312
|
+
/**
|
|
313
|
+
* Callback fired when the component is focused with a keyboard.
|
|
314
|
+
* We trigger a `onFocus` callback too.
|
|
315
|
+
*/
|
|
316
|
+
onFocusVisible: _propTypes.default.func,
|
|
317
|
+
onKeyDown: _propTypes.default.func,
|
|
318
|
+
onMouseEnter: _propTypes.default.func,
|
|
319
|
+
/**
|
|
320
|
+
* If `true`, day is outside of month and will be hidden.
|
|
321
|
+
*/
|
|
322
|
+
outsideCurrentMonth: _propTypes.default.bool.isRequired,
|
|
323
|
+
/**
|
|
324
|
+
* If `true`, renders as selected.
|
|
325
|
+
* @default false
|
|
326
|
+
*/
|
|
327
|
+
selected: _propTypes.default.bool,
|
|
328
|
+
/**
|
|
329
|
+
* If `true`, days outside the current month are rendered:
|
|
330
|
+
*
|
|
331
|
+
* - if `fixedWeekNumber` is defined, renders days to have the weeks requested.
|
|
332
|
+
*
|
|
333
|
+
* - if `fixedWeekNumber` is not defined, renders day to fill the first and last week of the current month.
|
|
334
|
+
*
|
|
335
|
+
* - ignored if `calendars` equals more than `1` on range pickers.
|
|
336
|
+
* @default false
|
|
337
|
+
*/
|
|
338
|
+
showDaysOutsideCurrentMonth: _propTypes.default.bool,
|
|
339
|
+
style: _propTypes.default.object,
|
|
340
|
+
/**
|
|
341
|
+
* The system prop that allows defining system overrides as well as additional CSS styles.
|
|
342
|
+
*/
|
|
343
|
+
sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
|
|
344
|
+
/**
|
|
345
|
+
* @default 0
|
|
346
|
+
*/
|
|
347
|
+
tabIndex: _propTypes.default.number,
|
|
348
|
+
/**
|
|
349
|
+
* If `true`, renders as today date.
|
|
350
|
+
* @default false
|
|
351
|
+
*/
|
|
352
|
+
today: _propTypes.default.bool,
|
|
353
|
+
/**
|
|
354
|
+
* Props applied to the `TouchRipple` element.
|
|
355
|
+
*/
|
|
356
|
+
TouchRippleProps: _propTypes.default.object,
|
|
357
|
+
/**
|
|
358
|
+
* A ref that points to the `TouchRipple` element.
|
|
359
|
+
*/
|
|
360
|
+
touchRippleRef: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
|
|
361
|
+
current: _propTypes.default.shape({
|
|
362
|
+
pulsate: _propTypes.default.func.isRequired,
|
|
363
|
+
start: _propTypes.default.func.isRequired,
|
|
364
|
+
stop: _propTypes.default.func.isRequired
|
|
365
|
+
})
|
|
366
|
+
})])
|
|
367
|
+
} : void 0;
|
|
368
|
+
const PickerDay2 = exports.PickerDay2 = /*#__PURE__*/React.memo(PickerDay2Raw);
|
|
369
|
+
if (process.env.NODE_ENV !== "production") PickerDay2.displayName = "PickerDay2";
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { PickerDay2Classes } from "./pickerDay2Classes.js";
|
|
2
|
+
import { PickerDayOwnerState, PickersDayProps } from "../PickersDay/index.js";
|
|
3
|
+
export interface PickerDay2Props extends Omit<PickersDayProps, 'classes'> {
|
|
4
|
+
/**
|
|
5
|
+
* Override or extend the styles applied to the component.
|
|
6
|
+
*/
|
|
7
|
+
classes?: Partial<PickerDay2Classes>;
|
|
8
|
+
/**
|
|
9
|
+
* Indicates if the day should be visually selected.
|
|
10
|
+
*/
|
|
11
|
+
isVisuallySelected?: boolean;
|
|
12
|
+
}
|
|
13
|
+
export interface PickerDay2OwnerState extends PickerDayOwnerState {
|
|
14
|
+
/**
|
|
15
|
+
* Whether the day is a filler day (its content is hidden).
|
|
16
|
+
*/
|
|
17
|
+
isDayFillerCell: boolean;
|
|
18
|
+
}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export { PickerDay2 } from "./PickerDay2.js";
|
|
2
|
+
export type { PickerDay2Props, PickerDay2OwnerState } from "./PickerDay2.types.js";
|
|
3
|
+
export { getPickerDay2UtilityClass, pickerDay2Classes } from "./pickerDay2Classes.js";
|
|
4
|
+
export type { PickerDay2ClassKey } from "./pickerDay2Classes.js";
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "PickerDay2", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _PickerDay.PickerDay2;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
Object.defineProperty(exports, "getPickerDay2UtilityClass", {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () {
|
|
15
|
+
return _pickerDay2Classes.getPickerDay2UtilityClass;
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
Object.defineProperty(exports, "pickerDay2Classes", {
|
|
19
|
+
enumerable: true,
|
|
20
|
+
get: function () {
|
|
21
|
+
return _pickerDay2Classes.pickerDay2Classes;
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
var _PickerDay = require("./PickerDay2");
|
|
25
|
+
var _pickerDay2Classes = require("./pickerDay2Classes");
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
export interface PickerDay2Classes {
|
|
2
|
+
/** Styles applied to the root element. */
|
|
3
|
+
root: string;
|
|
4
|
+
/** Styles applied to the root element if `outsideCurrentMonth=true` and `showDaysOutsideCurrentMonth=true`. */
|
|
5
|
+
dayOutsideMonth: string;
|
|
6
|
+
/** Styles applied to the root element if `outsideCurrentMonth=true` and `showDaysOutsideCurrentMonth=false`. */
|
|
7
|
+
fillerCell: string;
|
|
8
|
+
/** Styles applied to the root element if `disableHighlightToday=false` and `today=true`. */
|
|
9
|
+
today: string;
|
|
10
|
+
/** State class applied to the root element if `selected=true`. */
|
|
11
|
+
selected: string;
|
|
12
|
+
/** State class applied to the root element if `disabled=true`. */
|
|
13
|
+
disabled: string;
|
|
14
|
+
}
|
|
15
|
+
export type PickerDay2ClassKey = keyof PickerDay2Classes;
|
|
16
|
+
export declare function getPickerDay2UtilityClass(slot: string): string;
|
|
17
|
+
export declare const pickerDay2Classes: Record<keyof PickerDay2Classes, string>;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.getPickerDay2UtilityClass = getPickerDay2UtilityClass;
|
|
8
|
+
exports.pickerDay2Classes = void 0;
|
|
9
|
+
var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
|
|
10
|
+
var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
|
|
11
|
+
function getPickerDay2UtilityClass(slot) {
|
|
12
|
+
return (0, _generateUtilityClass.default)('MuiPickerDay2', slot);
|
|
13
|
+
}
|
|
14
|
+
const pickerDay2Classes = exports.pickerDay2Classes = (0, _generateUtilityClasses.default)('MuiPickerDay2', ['root', 'dayOutsideMonth', 'today', 'selected', 'disabled', 'fillerCell']);
|
package/PickersDay/PickersDay.js
CHANGED
|
@@ -224,7 +224,7 @@ const PickersDayRaw = /*#__PURE__*/React.forwardRef(function PickersDay(inProps,
|
|
|
224
224
|
onMouseDown: handleMouseDown
|
|
225
225
|
}, other, {
|
|
226
226
|
ownerState: ownerState,
|
|
227
|
-
children:
|
|
227
|
+
children: children ?? utils.format(day, 'dayOfMonth')
|
|
228
228
|
}));
|
|
229
229
|
});
|
|
230
230
|
if (process.env.NODE_ENV !== "production") PickersDayRaw.displayName = "PickersDayRaw";
|
|
@@ -27,7 +27,7 @@ var _PickersInput = require("./PickersInput");
|
|
|
27
27
|
var _useFieldOwnerState = require("../internals/hooks/useFieldOwnerState");
|
|
28
28
|
var _usePickerTextFieldOwnerState = require("./usePickerTextFieldOwnerState");
|
|
29
29
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
30
|
-
const _excluded = ["onFocus", "onBlur", "className", "classes", "color", "disabled", "error", "variant", "required", "InputProps", "inputProps", "inputRef", "sectionListRef", "elements", "areAllSectionsEmpty", "onClick", "onKeyDown", "onKeyUp", "onPaste", "onInput", "endAdornment", "startAdornment", "tabIndex", "contentEditable", "focused", "value", "onChange", "fullWidth", "id", "name", "helperText", "FormHelperTextProps", "label", "InputLabelProps", "data-active-range-position"];
|
|
30
|
+
const _excluded = ["onFocus", "onBlur", "className", "classes", "color", "disabled", "error", "variant", "required", "hiddenLabel", "InputProps", "inputProps", "inputRef", "sectionListRef", "elements", "areAllSectionsEmpty", "onClick", "onKeyDown", "onKeyUp", "onPaste", "onInput", "endAdornment", "startAdornment", "tabIndex", "contentEditable", "focused", "value", "onChange", "fullWidth", "id", "name", "helperText", "FormHelperTextProps", "label", "InputLabelProps", "data-active-range-position"];
|
|
31
31
|
const VARIANT_COMPONENT = {
|
|
32
32
|
standard: _PickersInput.PickersInput,
|
|
33
33
|
filled: _PickersFilledInput.PickersFilledInput,
|
|
@@ -66,6 +66,7 @@ const PickersTextField = exports.PickersTextField = /*#__PURE__*/React.forwardRe
|
|
|
66
66
|
error = false,
|
|
67
67
|
variant = 'outlined',
|
|
68
68
|
required = false,
|
|
69
|
+
hiddenLabel = false,
|
|
69
70
|
// Props used by PickersInput
|
|
70
71
|
InputProps,
|
|
71
72
|
inputProps,
|
|
@@ -127,6 +128,8 @@ const PickersTextField = exports.PickersTextField = /*#__PURE__*/React.forwardRe
|
|
|
127
128
|
inputAdditionalProps.notched = InputLabelProps.shrink;
|
|
128
129
|
}
|
|
129
130
|
inputAdditionalProps.label = label;
|
|
131
|
+
} else if (variant === 'filled') {
|
|
132
|
+
inputAdditionalProps.hiddenLabel = hiddenLabel;
|
|
130
133
|
}
|
|
131
134
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_usePickerTextFieldOwnerState.PickerTextFieldOwnerStateContext.Provider, {
|
|
132
135
|
value: ownerState,
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { PickerDay2Props } from "./PickerDay2.types.js";
|
|
3
|
+
type PickerDay2Component = ((props: PickerDay2Props & React.RefAttributes<HTMLButtonElement>) => React.JSX.Element) & {
|
|
4
|
+
propTypes?: any;
|
|
5
|
+
};
|
|
6
|
+
export declare const PickerDay2: PickerDay2Component;
|
|
7
|
+
export {};
|
|
@@ -0,0 +1,361 @@
|
|
|
1
|
+
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
2
|
+
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
3
|
+
const _excluded = ["autoFocus", "className", "classes", "hidden", "isAnimating", "onClick", "onDaySelect", "onFocus", "onBlur", "onKeyDown", "onMouseDown", "onMouseEnter", "children", "isFirstVisibleCell", "isLastVisibleCell", "day", "selected", "disabled", "today", "outsideCurrentMonth", "disableMargin", "disableHighlightToday", "showDaysOutsideCurrentMonth", "isVisuallySelected"];
|
|
4
|
+
import * as React from 'react';
|
|
5
|
+
import PropTypes from 'prop-types';
|
|
6
|
+
import clsx from 'clsx';
|
|
7
|
+
import { alpha, styled, useThemeProps } from '@mui/material/styles';
|
|
8
|
+
import ButtonBase from '@mui/material/ButtonBase';
|
|
9
|
+
import useForkRef from '@mui/utils/useForkRef';
|
|
10
|
+
import composeClasses from '@mui/utils/composeClasses';
|
|
11
|
+
import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
|
|
12
|
+
import { DAY_MARGIN, DAY_SIZE } from "../internals/constants/dimensions.js";
|
|
13
|
+
import { pickerDay2Classes, getPickerDay2UtilityClass } from "./pickerDay2Classes.js";
|
|
14
|
+
import { useUtils } from "../internals/hooks/useUtils.js";
|
|
15
|
+
import { usePickerDayOwnerState } from "../PickersDay/usePickerDayOwnerState.js";
|
|
16
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
17
|
+
const useUtilityClasses = (ownerState, classes) => {
|
|
18
|
+
const {
|
|
19
|
+
isDaySelected,
|
|
20
|
+
disableHighlightToday,
|
|
21
|
+
isDayCurrent,
|
|
22
|
+
isDayDisabled,
|
|
23
|
+
isDayOutsideMonth,
|
|
24
|
+
isDayFillerCell
|
|
25
|
+
} = ownerState;
|
|
26
|
+
const slots = {
|
|
27
|
+
root: ['root', isDaySelected && !isDayFillerCell && 'selected', isDayDisabled && 'disabled', !disableHighlightToday && isDayCurrent && !isDaySelected && !isDayFillerCell && 'today', isDayOutsideMonth && 'dayOutsideMonth', isDayFillerCell && 'fillerCell']
|
|
28
|
+
};
|
|
29
|
+
return composeClasses(slots, getPickerDay2UtilityClass, classes);
|
|
30
|
+
};
|
|
31
|
+
const PickerDay2Root = styled(ButtonBase, {
|
|
32
|
+
name: 'MuiPickerDay2',
|
|
33
|
+
slot: 'Root',
|
|
34
|
+
overridesResolver: (props, styles) => {
|
|
35
|
+
const {
|
|
36
|
+
ownerState
|
|
37
|
+
} = props;
|
|
38
|
+
return [styles.root, !ownerState.disableHighlightToday && ownerState.isDayCurrent && styles.today, !ownerState.isDayOutsideMonth && styles.dayOutsideMonth, ownerState.isDayFillerCell && styles.fillerCell];
|
|
39
|
+
}
|
|
40
|
+
})(({
|
|
41
|
+
theme
|
|
42
|
+
}) => _extends({
|
|
43
|
+
'--PickerDay-horizontalMargin': `${DAY_MARGIN}px`,
|
|
44
|
+
'--PickerDay-size': `${DAY_SIZE}px`
|
|
45
|
+
}, theme.typography.caption, {
|
|
46
|
+
width: 'var(--PickerDay-size)',
|
|
47
|
+
height: 'var(--PickerDay-size)',
|
|
48
|
+
borderRadius: 'calc(var(--PickerDay-size) / 2)',
|
|
49
|
+
padding: 0,
|
|
50
|
+
// explicitly setting to `transparent` to avoid potentially getting impacted by change from the overridden component
|
|
51
|
+
backgroundColor: 'transparent',
|
|
52
|
+
transition: theme.transitions.create('background-color', {
|
|
53
|
+
duration: theme.transitions.duration.short
|
|
54
|
+
}),
|
|
55
|
+
color: (theme.vars || theme).palette.text.primary,
|
|
56
|
+
'@media (pointer: fine)': {
|
|
57
|
+
'&:hover': {
|
|
58
|
+
backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity)
|
|
59
|
+
}
|
|
60
|
+
},
|
|
61
|
+
'&:focus': {
|
|
62
|
+
backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.focusOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.focusOpacity)
|
|
63
|
+
},
|
|
64
|
+
marginLeft: 'var(--PickerDay-horizontalMargin)',
|
|
65
|
+
marginRight: 'var(--PickerDay-horizontalMargin)',
|
|
66
|
+
variants: [{
|
|
67
|
+
props: {
|
|
68
|
+
isDaySelected: true
|
|
69
|
+
},
|
|
70
|
+
style: {
|
|
71
|
+
color: (theme.vars || theme).palette.primary.contrastText,
|
|
72
|
+
backgroundColor: (theme.vars || theme).palette.primary.main,
|
|
73
|
+
fontWeight: theme.typography.fontWeightMedium,
|
|
74
|
+
'&:focus, &:hover': {
|
|
75
|
+
willChange: 'background-color',
|
|
76
|
+
backgroundColor: (theme.vars || theme).palette.primary.dark
|
|
77
|
+
},
|
|
78
|
+
[`&.${pickerDay2Classes.disabled}`]: {
|
|
79
|
+
opacity: 0.6
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
}, {
|
|
83
|
+
props: {
|
|
84
|
+
isDayDisabled: true
|
|
85
|
+
},
|
|
86
|
+
style: {
|
|
87
|
+
color: (theme.vars || theme).palette.text.disabled
|
|
88
|
+
}
|
|
89
|
+
}, {
|
|
90
|
+
props: {
|
|
91
|
+
isDayFillerCell: true
|
|
92
|
+
},
|
|
93
|
+
style: {
|
|
94
|
+
// visibility: 'hidden' does not work here as it hides the element from screen readers
|
|
95
|
+
// and results in unexpected relationships between week day and day columns.
|
|
96
|
+
opacity: 0,
|
|
97
|
+
pointerEvents: 'none'
|
|
98
|
+
}
|
|
99
|
+
}, {
|
|
100
|
+
props: {
|
|
101
|
+
isDayOutsideMonth: true
|
|
102
|
+
},
|
|
103
|
+
style: {
|
|
104
|
+
color: (theme.vars || theme).palette.text.secondary
|
|
105
|
+
}
|
|
106
|
+
}, {
|
|
107
|
+
props: {
|
|
108
|
+
isDayCurrent: true,
|
|
109
|
+
isDaySelected: false
|
|
110
|
+
},
|
|
111
|
+
style: {
|
|
112
|
+
outline: `1px solid ${(theme.vars || theme).palette.text.secondary}`,
|
|
113
|
+
outlineOffset: -1
|
|
114
|
+
}
|
|
115
|
+
}]
|
|
116
|
+
}));
|
|
117
|
+
const noop = () => {};
|
|
118
|
+
const PickerDay2Raw = /*#__PURE__*/React.forwardRef(function PickerDay2(inProps, forwardedRef) {
|
|
119
|
+
const props = useThemeProps({
|
|
120
|
+
props: inProps,
|
|
121
|
+
name: 'MuiPickerDay2'
|
|
122
|
+
});
|
|
123
|
+
const utils = useUtils();
|
|
124
|
+
const {
|
|
125
|
+
autoFocus = false,
|
|
126
|
+
className,
|
|
127
|
+
classes: classesProp,
|
|
128
|
+
isAnimating,
|
|
129
|
+
onClick,
|
|
130
|
+
onDaySelect,
|
|
131
|
+
onFocus = noop,
|
|
132
|
+
onBlur = noop,
|
|
133
|
+
onKeyDown = noop,
|
|
134
|
+
onMouseDown = noop,
|
|
135
|
+
onMouseEnter = noop,
|
|
136
|
+
children,
|
|
137
|
+
day,
|
|
138
|
+
selected,
|
|
139
|
+
disabled,
|
|
140
|
+
today,
|
|
141
|
+
outsideCurrentMonth,
|
|
142
|
+
disableMargin,
|
|
143
|
+
disableHighlightToday,
|
|
144
|
+
showDaysOutsideCurrentMonth
|
|
145
|
+
} = props,
|
|
146
|
+
other = _objectWithoutPropertiesLoose(props, _excluded);
|
|
147
|
+
const pickersDayOwnerState = usePickerDayOwnerState({
|
|
148
|
+
day,
|
|
149
|
+
selected,
|
|
150
|
+
disabled,
|
|
151
|
+
today,
|
|
152
|
+
outsideCurrentMonth,
|
|
153
|
+
disableMargin,
|
|
154
|
+
disableHighlightToday,
|
|
155
|
+
showDaysOutsideCurrentMonth
|
|
156
|
+
});
|
|
157
|
+
const ownerState = _extends({}, pickersDayOwnerState, {
|
|
158
|
+
// Properties specific to the MUI implementation (some might be removed in the next major)
|
|
159
|
+
isDayFillerCell: outsideCurrentMonth && !showDaysOutsideCurrentMonth
|
|
160
|
+
});
|
|
161
|
+
const classes = useUtilityClasses(ownerState, classesProp);
|
|
162
|
+
const ref = React.useRef(null);
|
|
163
|
+
const handleRef = useForkRef(ref, forwardedRef);
|
|
164
|
+
|
|
165
|
+
// Since this is rendered when a Popper is opened we can't use passive effects.
|
|
166
|
+
// Focusing in passive effects in Popper causes scroll jump.
|
|
167
|
+
useEnhancedEffect(() => {
|
|
168
|
+
if (autoFocus && !disabled && !isAnimating && !outsideCurrentMonth) {
|
|
169
|
+
// ref.current being null would be a bug in MUI
|
|
170
|
+
ref.current.focus();
|
|
171
|
+
}
|
|
172
|
+
}, [autoFocus, disabled, isAnimating, outsideCurrentMonth]);
|
|
173
|
+
|
|
174
|
+
// For a day outside the current month, move the focus from mouseDown to mouseUp
|
|
175
|
+
// Goal: have the onClick ends before sliding to the new month
|
|
176
|
+
const handleMouseDown = event => {
|
|
177
|
+
onMouseDown(event);
|
|
178
|
+
if (outsideCurrentMonth) {
|
|
179
|
+
event.preventDefault();
|
|
180
|
+
}
|
|
181
|
+
};
|
|
182
|
+
const handleClick = event => {
|
|
183
|
+
if (!disabled) {
|
|
184
|
+
onDaySelect(day);
|
|
185
|
+
}
|
|
186
|
+
if (outsideCurrentMonth) {
|
|
187
|
+
event.currentTarget.focus();
|
|
188
|
+
}
|
|
189
|
+
if (onClick) {
|
|
190
|
+
onClick(event);
|
|
191
|
+
}
|
|
192
|
+
};
|
|
193
|
+
return /*#__PURE__*/_jsx(PickerDay2Root, _extends({
|
|
194
|
+
ref: handleRef,
|
|
195
|
+
centerRipple: true
|
|
196
|
+
// compat with PickersDay for tests
|
|
197
|
+
,
|
|
198
|
+
|
|
199
|
+
disabled: disabled,
|
|
200
|
+
tabIndex: selected ? 0 : -1,
|
|
201
|
+
onKeyDown: event => onKeyDown(event, day),
|
|
202
|
+
onFocus: event => onFocus(event, day),
|
|
203
|
+
onBlur: event => onBlur(event, day),
|
|
204
|
+
onMouseEnter: event => onMouseEnter(event, day),
|
|
205
|
+
onClick: handleClick,
|
|
206
|
+
onMouseDown: handleMouseDown
|
|
207
|
+
}, other, {
|
|
208
|
+
ownerState: ownerState,
|
|
209
|
+
className: clsx(classes.root, className),
|
|
210
|
+
children: children ?? (ownerState.isDayFillerCell ? null : utils.format(day, 'dayOfMonth'))
|
|
211
|
+
}));
|
|
212
|
+
});
|
|
213
|
+
if (process.env.NODE_ENV !== "production") PickerDay2Raw.displayName = "PickerDay2Raw";
|
|
214
|
+
process.env.NODE_ENV !== "production" ? PickerDay2Raw.propTypes = {
|
|
215
|
+
// ----------------------------- Warning --------------------------------
|
|
216
|
+
// | These PropTypes are generated from the TypeScript type definitions |
|
|
217
|
+
// | To update them edit the TypeScript types and run "pnpm proptypes" |
|
|
218
|
+
// ----------------------------------------------------------------------
|
|
219
|
+
/**
|
|
220
|
+
* A ref for imperative actions.
|
|
221
|
+
* It currently only supports `focusVisible()` action.
|
|
222
|
+
*/
|
|
223
|
+
action: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
|
|
224
|
+
current: PropTypes.shape({
|
|
225
|
+
focusVisible: PropTypes.func.isRequired
|
|
226
|
+
})
|
|
227
|
+
})]),
|
|
228
|
+
/**
|
|
229
|
+
* If `true`, the ripples are centered.
|
|
230
|
+
* They won't start at the cursor interaction position.
|
|
231
|
+
* @default false
|
|
232
|
+
*/
|
|
233
|
+
centerRipple: PropTypes.bool,
|
|
234
|
+
/**
|
|
235
|
+
* Override or extend the styles applied to the component.
|
|
236
|
+
*/
|
|
237
|
+
classes: PropTypes.object,
|
|
238
|
+
className: PropTypes.string,
|
|
239
|
+
component: PropTypes.elementType,
|
|
240
|
+
/**
|
|
241
|
+
* The date to show.
|
|
242
|
+
*/
|
|
243
|
+
day: PropTypes.object.isRequired,
|
|
244
|
+
/**
|
|
245
|
+
* If `true`, renders as disabled.
|
|
246
|
+
* @default false
|
|
247
|
+
*/
|
|
248
|
+
disabled: PropTypes.bool,
|
|
249
|
+
/**
|
|
250
|
+
* If `true`, today's date is rendering without highlighting with circle.
|
|
251
|
+
* @default false
|
|
252
|
+
*/
|
|
253
|
+
disableHighlightToday: PropTypes.bool,
|
|
254
|
+
/**
|
|
255
|
+
* If `true`, days are rendering without margin. Useful for displaying linked range of days.
|
|
256
|
+
* @default false
|
|
257
|
+
*/
|
|
258
|
+
disableMargin: PropTypes.bool,
|
|
259
|
+
/**
|
|
260
|
+
* If `true`, the ripple effect is disabled.
|
|
261
|
+
*
|
|
262
|
+
* ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure
|
|
263
|
+
* to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
|
|
264
|
+
* @default false
|
|
265
|
+
*/
|
|
266
|
+
disableRipple: PropTypes.bool,
|
|
267
|
+
/**
|
|
268
|
+
* If `true`, the touch ripple effect is disabled.
|
|
269
|
+
* @default false
|
|
270
|
+
*/
|
|
271
|
+
disableTouchRipple: PropTypes.bool,
|
|
272
|
+
/**
|
|
273
|
+
* If `true`, the base button will have a keyboard focus ripple.
|
|
274
|
+
* @default false
|
|
275
|
+
*/
|
|
276
|
+
focusRipple: PropTypes.bool,
|
|
277
|
+
/**
|
|
278
|
+
* This prop can help identify which element has keyboard focus.
|
|
279
|
+
* The class name will be applied when the element gains the focus through keyboard interaction.
|
|
280
|
+
* It's a polyfill for the [CSS :focus-visible selector](https://drafts.csswg.org/selectors-4/#the-focus-visible-pseudo).
|
|
281
|
+
* The rationale for using this feature [is explained here](https://github.com/WICG/focus-visible/blob/HEAD/explainer.md).
|
|
282
|
+
* A [polyfill can be used](https://github.com/WICG/focus-visible) to apply a `focus-visible` class to other components
|
|
283
|
+
* if needed.
|
|
284
|
+
*/
|
|
285
|
+
focusVisibleClassName: PropTypes.string,
|
|
286
|
+
isAnimating: PropTypes.bool,
|
|
287
|
+
/**
|
|
288
|
+
* If `true`, day is the first visible cell of the month.
|
|
289
|
+
* Either the first day of the month or the first day of the week depending on `showDaysOutsideCurrentMonth`.
|
|
290
|
+
*/
|
|
291
|
+
isFirstVisibleCell: PropTypes.bool.isRequired,
|
|
292
|
+
/**
|
|
293
|
+
* If `true`, day is the last visible cell of the month.
|
|
294
|
+
* Either the last day of the month or the last day of the week depending on `showDaysOutsideCurrentMonth`.
|
|
295
|
+
*/
|
|
296
|
+
isLastVisibleCell: PropTypes.bool.isRequired,
|
|
297
|
+
/**
|
|
298
|
+
* Indicates if the day should be visually selected.
|
|
299
|
+
*/
|
|
300
|
+
isVisuallySelected: PropTypes.bool,
|
|
301
|
+
onBlur: PropTypes.func,
|
|
302
|
+
onDaySelect: PropTypes.func.isRequired,
|
|
303
|
+
onFocus: PropTypes.func,
|
|
304
|
+
/**
|
|
305
|
+
* Callback fired when the component is focused with a keyboard.
|
|
306
|
+
* We trigger a `onFocus` callback too.
|
|
307
|
+
*/
|
|
308
|
+
onFocusVisible: PropTypes.func,
|
|
309
|
+
onKeyDown: PropTypes.func,
|
|
310
|
+
onMouseEnter: PropTypes.func,
|
|
311
|
+
/**
|
|
312
|
+
* If `true`, day is outside of month and will be hidden.
|
|
313
|
+
*/
|
|
314
|
+
outsideCurrentMonth: PropTypes.bool.isRequired,
|
|
315
|
+
/**
|
|
316
|
+
* If `true`, renders as selected.
|
|
317
|
+
* @default false
|
|
318
|
+
*/
|
|
319
|
+
selected: PropTypes.bool,
|
|
320
|
+
/**
|
|
321
|
+
* If `true`, days outside the current month are rendered:
|
|
322
|
+
*
|
|
323
|
+
* - if `fixedWeekNumber` is defined, renders days to have the weeks requested.
|
|
324
|
+
*
|
|
325
|
+
* - if `fixedWeekNumber` is not defined, renders day to fill the first and last week of the current month.
|
|
326
|
+
*
|
|
327
|
+
* - ignored if `calendars` equals more than `1` on range pickers.
|
|
328
|
+
* @default false
|
|
329
|
+
*/
|
|
330
|
+
showDaysOutsideCurrentMonth: PropTypes.bool,
|
|
331
|
+
style: PropTypes.object,
|
|
332
|
+
/**
|
|
333
|
+
* The system prop that allows defining system overrides as well as additional CSS styles.
|
|
334
|
+
*/
|
|
335
|
+
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
|
|
336
|
+
/**
|
|
337
|
+
* @default 0
|
|
338
|
+
*/
|
|
339
|
+
tabIndex: PropTypes.number,
|
|
340
|
+
/**
|
|
341
|
+
* If `true`, renders as today date.
|
|
342
|
+
* @default false
|
|
343
|
+
*/
|
|
344
|
+
today: PropTypes.bool,
|
|
345
|
+
/**
|
|
346
|
+
* Props applied to the `TouchRipple` element.
|
|
347
|
+
*/
|
|
348
|
+
TouchRippleProps: PropTypes.object,
|
|
349
|
+
/**
|
|
350
|
+
* A ref that points to the `TouchRipple` element.
|
|
351
|
+
*/
|
|
352
|
+
touchRippleRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
|
|
353
|
+
current: PropTypes.shape({
|
|
354
|
+
pulsate: PropTypes.func.isRequired,
|
|
355
|
+
start: PropTypes.func.isRequired,
|
|
356
|
+
stop: PropTypes.func.isRequired
|
|
357
|
+
})
|
|
358
|
+
})])
|
|
359
|
+
} : void 0;
|
|
360
|
+
export const PickerDay2 = /*#__PURE__*/React.memo(PickerDay2Raw);
|
|
361
|
+
if (process.env.NODE_ENV !== "production") PickerDay2.displayName = "PickerDay2";
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { PickerDay2Classes } from "./pickerDay2Classes.js";
|
|
2
|
+
import { PickerDayOwnerState, PickersDayProps } from "../PickersDay/index.js";
|
|
3
|
+
export interface PickerDay2Props extends Omit<PickersDayProps, 'classes'> {
|
|
4
|
+
/**
|
|
5
|
+
* Override or extend the styles applied to the component.
|
|
6
|
+
*/
|
|
7
|
+
classes?: Partial<PickerDay2Classes>;
|
|
8
|
+
/**
|
|
9
|
+
* Indicates if the day should be visually selected.
|
|
10
|
+
*/
|
|
11
|
+
isVisuallySelected?: boolean;
|
|
12
|
+
}
|
|
13
|
+
export interface PickerDay2OwnerState extends PickerDayOwnerState {
|
|
14
|
+
/**
|
|
15
|
+
* Whether the day is a filler day (its content is hidden).
|
|
16
|
+
*/
|
|
17
|
+
isDayFillerCell: boolean;
|
|
18
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export { PickerDay2 } from "./PickerDay2.js";
|
|
2
|
+
export type { PickerDay2Props, PickerDay2OwnerState } from "./PickerDay2.types.js";
|
|
3
|
+
export { getPickerDay2UtilityClass, pickerDay2Classes } from "./pickerDay2Classes.js";
|
|
4
|
+
export type { PickerDay2ClassKey } from "./pickerDay2Classes.js";
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
export interface PickerDay2Classes {
|
|
2
|
+
/** Styles applied to the root element. */
|
|
3
|
+
root: string;
|
|
4
|
+
/** Styles applied to the root element if `outsideCurrentMonth=true` and `showDaysOutsideCurrentMonth=true`. */
|
|
5
|
+
dayOutsideMonth: string;
|
|
6
|
+
/** Styles applied to the root element if `outsideCurrentMonth=true` and `showDaysOutsideCurrentMonth=false`. */
|
|
7
|
+
fillerCell: string;
|
|
8
|
+
/** Styles applied to the root element if `disableHighlightToday=false` and `today=true`. */
|
|
9
|
+
today: string;
|
|
10
|
+
/** State class applied to the root element if `selected=true`. */
|
|
11
|
+
selected: string;
|
|
12
|
+
/** State class applied to the root element if `disabled=true`. */
|
|
13
|
+
disabled: string;
|
|
14
|
+
}
|
|
15
|
+
export type PickerDay2ClassKey = keyof PickerDay2Classes;
|
|
16
|
+
export declare function getPickerDay2UtilityClass(slot: string): string;
|
|
17
|
+
export declare const pickerDay2Classes: Record<keyof PickerDay2Classes, string>;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import generateUtilityClass from '@mui/utils/generateUtilityClass';
|
|
2
|
+
import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
|
|
3
|
+
export function getPickerDay2UtilityClass(slot) {
|
|
4
|
+
return generateUtilityClass('MuiPickerDay2', slot);
|
|
5
|
+
}
|
|
6
|
+
export const pickerDay2Classes = generateUtilityClasses('MuiPickerDay2', ['root', 'dayOutsideMonth', 'today', 'selected', 'disabled', 'fillerCell']);
|
|
@@ -217,7 +217,7 @@ const PickersDayRaw = /*#__PURE__*/React.forwardRef(function PickersDay(inProps,
|
|
|
217
217
|
onMouseDown: handleMouseDown
|
|
218
218
|
}, other, {
|
|
219
219
|
ownerState: ownerState,
|
|
220
|
-
children:
|
|
220
|
+
children: children ?? utils.format(day, 'dayOfMonth')
|
|
221
221
|
}));
|
|
222
222
|
});
|
|
223
223
|
if (process.env.NODE_ENV !== "production") PickersDayRaw.displayName = "PickersDayRaw";
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
4
4
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
5
|
-
const _excluded = ["onFocus", "onBlur", "className", "classes", "color", "disabled", "error", "variant", "required", "InputProps", "inputProps", "inputRef", "sectionListRef", "elements", "areAllSectionsEmpty", "onClick", "onKeyDown", "onKeyUp", "onPaste", "onInput", "endAdornment", "startAdornment", "tabIndex", "contentEditable", "focused", "value", "onChange", "fullWidth", "id", "name", "helperText", "FormHelperTextProps", "label", "InputLabelProps", "data-active-range-position"];
|
|
5
|
+
const _excluded = ["onFocus", "onBlur", "className", "classes", "color", "disabled", "error", "variant", "required", "hiddenLabel", "InputProps", "inputProps", "inputRef", "sectionListRef", "elements", "areAllSectionsEmpty", "onClick", "onKeyDown", "onKeyUp", "onPaste", "onInput", "endAdornment", "startAdornment", "tabIndex", "contentEditable", "focused", "value", "onChange", "fullWidth", "id", "name", "helperText", "FormHelperTextProps", "label", "InputLabelProps", "data-active-range-position"];
|
|
6
6
|
import * as React from 'react';
|
|
7
7
|
import PropTypes from 'prop-types';
|
|
8
8
|
import clsx from 'clsx';
|
|
@@ -59,6 +59,7 @@ const PickersTextField = /*#__PURE__*/React.forwardRef(function PickersTextField
|
|
|
59
59
|
error = false,
|
|
60
60
|
variant = 'outlined',
|
|
61
61
|
required = false,
|
|
62
|
+
hiddenLabel = false,
|
|
62
63
|
// Props used by PickersInput
|
|
63
64
|
InputProps,
|
|
64
65
|
inputProps,
|
|
@@ -120,6 +121,8 @@ const PickersTextField = /*#__PURE__*/React.forwardRef(function PickersTextField
|
|
|
120
121
|
inputAdditionalProps.notched = InputLabelProps.shrink;
|
|
121
122
|
}
|
|
122
123
|
inputAdditionalProps.label = label;
|
|
124
|
+
} else if (variant === 'filled') {
|
|
125
|
+
inputAdditionalProps.hiddenLabel = hiddenLabel;
|
|
123
126
|
}
|
|
124
127
|
return /*#__PURE__*/_jsx(PickerTextFieldOwnerStateContext.Provider, {
|
|
125
128
|
value: ownerState,
|
package/esm/index.d.ts
CHANGED
|
@@ -3,6 +3,7 @@ export * from "./DigitalClock/index.js";
|
|
|
3
3
|
export * from "./MultiSectionDigitalClock/index.js";
|
|
4
4
|
export * from "./LocalizationProvider/index.js";
|
|
5
5
|
export * from "./PickersDay/index.js";
|
|
6
|
+
export * from "./PickerDay2/index.js";
|
|
6
7
|
export * from "./locales/utils/pickersLocaleTextApi.js";
|
|
7
8
|
export * from "./DateField/index.js";
|
|
8
9
|
export * from "./TimeField/index.js";
|
package/esm/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @mui/x-date-pickers v8.5.
|
|
2
|
+
* @mui/x-date-pickers v8.5.2
|
|
3
3
|
*
|
|
4
4
|
* @license MIT
|
|
5
5
|
* This source code is licensed under the MIT license found in the
|
|
@@ -11,6 +11,7 @@ export * from "./DigitalClock/index.js";
|
|
|
11
11
|
export * from "./MultiSectionDigitalClock/index.js";
|
|
12
12
|
export * from "./LocalizationProvider/index.js";
|
|
13
13
|
export * from "./PickersDay/index.js";
|
|
14
|
+
export * from "./PickerDay2/index.js";
|
|
14
15
|
export * from "./locales/utils/pickersLocaleTextApi.js";
|
|
15
16
|
|
|
16
17
|
// Fields
|
|
@@ -88,6 +88,10 @@ export interface PickerComponents<Theme = unknown> {
|
|
|
88
88
|
defaultProps?: ComponentsProps['MuiPickersDay'];
|
|
89
89
|
styleOverrides?: ComponentsOverrides<Theme, PickerDayOwnerState>['MuiPickersDay'];
|
|
90
90
|
};
|
|
91
|
+
MuiPickerDay2?: {
|
|
92
|
+
defaultProps?: ComponentsProps['MuiPickerDay2'];
|
|
93
|
+
styleOverrides?: ComponentsOverrides<Theme>['MuiPickerDay2'];
|
|
94
|
+
};
|
|
91
95
|
MuiPickersFadeTransitionGroup?: {
|
|
92
96
|
defaultProps?: ComponentsProps['MuiPickersFadeTransitionGroup'];
|
|
93
97
|
styleOverrides?: ComponentsOverrides<Theme>['MuiPickersFadeTransitionGroup'];
|
|
@@ -4,6 +4,7 @@ import { DayCalendarSkeletonClassKey } from "../DayCalendarSkeleton/index.js";
|
|
|
4
4
|
import { ClockClassKey, ClockNumberClassKey, TimeClockClassKey, ClockPointerClassKey } from "../TimeClock/index.js";
|
|
5
5
|
import { MonthCalendarClassKey } from "../MonthCalendar/index.js";
|
|
6
6
|
import { PickersDayClassKey } from "../PickersDay/index.js";
|
|
7
|
+
import { PickerDay2ClassKey } from "../PickerDay2/index.js";
|
|
7
8
|
import { YearCalendarClassKey } from "../YearCalendar/index.js";
|
|
8
9
|
import { PickersLayoutClassKey } from "../PickersLayout/index.js";
|
|
9
10
|
import { DatePickerToolbarClassKey } from "../DatePicker/index.js";
|
|
@@ -35,6 +36,7 @@ export interface PickersComponentNameToClassKey {
|
|
|
35
36
|
MuiPickersArrowSwitcher: PickersArrowSwitcherClassKey;
|
|
36
37
|
MuiPickersCalendarHeader: PickersCalendarHeaderClassKey;
|
|
37
38
|
MuiPickersDay: PickersDayClassKey;
|
|
39
|
+
MuiPickerDay2: PickerDay2ClassKey;
|
|
38
40
|
MuiPickersFadeTransitionGroup: PickersFadeTransitionGroupClassKey;
|
|
39
41
|
MuiPickersLayout: PickersLayoutClassKey;
|
|
40
42
|
MuiPickerPopper: PickerPopperClassKey;
|
|
@@ -3,6 +3,7 @@ import { DayCalendarSkeletonProps } from "../DayCalendarSkeleton/index.js";
|
|
|
3
3
|
import { ClockNumberProps, TimeClockProps, ClockPointerProps, ClockProps } from "../TimeClock/index.js";
|
|
4
4
|
import { MonthCalendarProps } from "../MonthCalendar/index.js";
|
|
5
5
|
import { PickersDayProps } from "../PickersDay/index.js";
|
|
6
|
+
import { PickerDay2Props } from "../PickerDay2/index.js";
|
|
6
7
|
import { YearCalendarProps } from "../YearCalendar/index.js";
|
|
7
8
|
import { DateFieldProps } from "../DateField/index.js";
|
|
8
9
|
import { LocalizationProviderProps } from "../LocalizationProvider/index.js";
|
|
@@ -56,6 +57,7 @@ export interface PickersComponentsPropsList {
|
|
|
56
57
|
MuiPickersArrowSwitcher: ExportedPickersArrowSwitcherProps;
|
|
57
58
|
MuiPickersCalendarHeader: ExportedPickersCalendarHeaderProps;
|
|
58
59
|
MuiPickersDay: PickersDayProps;
|
|
60
|
+
MuiPickerDay2: PickerDay2Props;
|
|
59
61
|
MuiPickersFadeTransitionGroup: ExportedPickersFadeTransitionGroupProps;
|
|
60
62
|
MuiPickerPopper: ExportedPickerPopperProps;
|
|
61
63
|
MuiPickersSlideTransition: ExportedSlideTransitionProps;
|
package/index.d.ts
CHANGED
|
@@ -3,6 +3,7 @@ export * from "./DigitalClock/index.js";
|
|
|
3
3
|
export * from "./MultiSectionDigitalClock/index.js";
|
|
4
4
|
export * from "./LocalizationProvider/index.js";
|
|
5
5
|
export * from "./PickersDay/index.js";
|
|
6
|
+
export * from "./PickerDay2/index.js";
|
|
6
7
|
export * from "./locales/utils/pickersLocaleTextApi.js";
|
|
7
8
|
export * from "./DateField/index.js";
|
|
8
9
|
export * from "./TimeField/index.js";
|
package/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @mui/x-date-pickers v8.5.
|
|
2
|
+
* @mui/x-date-pickers v8.5.2
|
|
3
3
|
*
|
|
4
4
|
* @license MIT
|
|
5
5
|
* This source code is licensed under the MIT license found in the
|
|
@@ -79,6 +79,18 @@ Object.keys(_PickersDay).forEach(function (key) {
|
|
|
79
79
|
}
|
|
80
80
|
});
|
|
81
81
|
});
|
|
82
|
+
var _PickerDay = require("./PickerDay2");
|
|
83
|
+
Object.keys(_PickerDay).forEach(function (key) {
|
|
84
|
+
if (key === "default" || key === "__esModule") return;
|
|
85
|
+
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
86
|
+
if (key in exports && exports[key] === _PickerDay[key]) return;
|
|
87
|
+
Object.defineProperty(exports, key, {
|
|
88
|
+
enumerable: true,
|
|
89
|
+
get: function () {
|
|
90
|
+
return _PickerDay[key];
|
|
91
|
+
}
|
|
92
|
+
});
|
|
93
|
+
});
|
|
82
94
|
var _pickersLocaleTextApi = require("./locales/utils/pickersLocaleTextApi");
|
|
83
95
|
Object.keys(_pickersLocaleTextApi).forEach(function (key) {
|
|
84
96
|
if (key === "default" || key === "__esModule") return;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mui/x-date-pickers",
|
|
3
|
-
"version": "8.5.
|
|
3
|
+
"version": "8.5.2",
|
|
4
4
|
"author": "MUI Team",
|
|
5
5
|
"description": "The community edition of the MUI X Date and Time Picker components.",
|
|
6
6
|
"main": "./index.js",
|
|
@@ -35,13 +35,13 @@
|
|
|
35
35
|
"directory": "packages/x-date-pickers"
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@babel/runtime": "^7.27.
|
|
38
|
+
"@babel/runtime": "^7.27.6",
|
|
39
39
|
"@mui/utils": "^7.1.1",
|
|
40
40
|
"@types/react-transition-group": "^4.4.12",
|
|
41
41
|
"clsx": "^2.1.1",
|
|
42
42
|
"prop-types": "^15.8.1",
|
|
43
43
|
"react-transition-group": "^4.4.5",
|
|
44
|
-
"@mui/x-internals": "8.5.
|
|
44
|
+
"@mui/x-internals": "8.5.2"
|
|
45
45
|
},
|
|
46
46
|
"peerDependencies": {
|
|
47
47
|
"@emotion/react": "^11.9.0",
|
|
@@ -88,6 +88,10 @@ export interface PickerComponents<Theme = unknown> {
|
|
|
88
88
|
defaultProps?: ComponentsProps['MuiPickersDay'];
|
|
89
89
|
styleOverrides?: ComponentsOverrides<Theme, PickerDayOwnerState>['MuiPickersDay'];
|
|
90
90
|
};
|
|
91
|
+
MuiPickerDay2?: {
|
|
92
|
+
defaultProps?: ComponentsProps['MuiPickerDay2'];
|
|
93
|
+
styleOverrides?: ComponentsOverrides<Theme>['MuiPickerDay2'];
|
|
94
|
+
};
|
|
91
95
|
MuiPickersFadeTransitionGroup?: {
|
|
92
96
|
defaultProps?: ComponentsProps['MuiPickersFadeTransitionGroup'];
|
|
93
97
|
styleOverrides?: ComponentsOverrides<Theme>['MuiPickersFadeTransitionGroup'];
|
|
@@ -4,6 +4,7 @@ import { DayCalendarSkeletonClassKey } from "../DayCalendarSkeleton/index.js";
|
|
|
4
4
|
import { ClockClassKey, ClockNumberClassKey, TimeClockClassKey, ClockPointerClassKey } from "../TimeClock/index.js";
|
|
5
5
|
import { MonthCalendarClassKey } from "../MonthCalendar/index.js";
|
|
6
6
|
import { PickersDayClassKey } from "../PickersDay/index.js";
|
|
7
|
+
import { PickerDay2ClassKey } from "../PickerDay2/index.js";
|
|
7
8
|
import { YearCalendarClassKey } from "../YearCalendar/index.js";
|
|
8
9
|
import { PickersLayoutClassKey } from "../PickersLayout/index.js";
|
|
9
10
|
import { DatePickerToolbarClassKey } from "../DatePicker/index.js";
|
|
@@ -35,6 +36,7 @@ export interface PickersComponentNameToClassKey {
|
|
|
35
36
|
MuiPickersArrowSwitcher: PickersArrowSwitcherClassKey;
|
|
36
37
|
MuiPickersCalendarHeader: PickersCalendarHeaderClassKey;
|
|
37
38
|
MuiPickersDay: PickersDayClassKey;
|
|
39
|
+
MuiPickerDay2: PickerDay2ClassKey;
|
|
38
40
|
MuiPickersFadeTransitionGroup: PickersFadeTransitionGroupClassKey;
|
|
39
41
|
MuiPickersLayout: PickersLayoutClassKey;
|
|
40
42
|
MuiPickerPopper: PickerPopperClassKey;
|
|
@@ -3,6 +3,7 @@ import { DayCalendarSkeletonProps } from "../DayCalendarSkeleton/index.js";
|
|
|
3
3
|
import { ClockNumberProps, TimeClockProps, ClockPointerProps, ClockProps } from "../TimeClock/index.js";
|
|
4
4
|
import { MonthCalendarProps } from "../MonthCalendar/index.js";
|
|
5
5
|
import { PickersDayProps } from "../PickersDay/index.js";
|
|
6
|
+
import { PickerDay2Props } from "../PickerDay2/index.js";
|
|
6
7
|
import { YearCalendarProps } from "../YearCalendar/index.js";
|
|
7
8
|
import { DateFieldProps } from "../DateField/index.js";
|
|
8
9
|
import { LocalizationProviderProps } from "../LocalizationProvider/index.js";
|
|
@@ -56,6 +57,7 @@ export interface PickersComponentsPropsList {
|
|
|
56
57
|
MuiPickersArrowSwitcher: ExportedPickersArrowSwitcherProps;
|
|
57
58
|
MuiPickersCalendarHeader: ExportedPickersCalendarHeaderProps;
|
|
58
59
|
MuiPickersDay: PickersDayProps;
|
|
60
|
+
MuiPickerDay2: PickerDay2Props;
|
|
59
61
|
MuiPickersFadeTransitionGroup: ExportedPickersFadeTransitionGroupProps;
|
|
60
62
|
MuiPickerPopper: ExportedPickerPopperProps;
|
|
61
63
|
MuiPickersSlideTransition: ExportedSlideTransitionProps;
|