@availity/mui-datepicker 1.0.19 → 1.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +16 -0
- package/package.json +2 -2
- package/src/lib/Datepicker.stories.tsx +24 -1
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,22 @@
|
|
|
2
2
|
|
|
3
3
|
This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
|
|
4
4
|
|
|
5
|
+
## [1.1.1](https://github.com/Availity/element/compare/@availity/mui-datepicker@1.1.0...@availity/mui-datepicker@1.1.1) (2025-05-29)
|
|
6
|
+
|
|
7
|
+
### Dependency Updates
|
|
8
|
+
|
|
9
|
+
* `mui-textfield` updated to version `1.1.0`
|
|
10
|
+
## [1.1.0](https://github.com/Availity/element/compare/@availity/mui-datepicker@1.0.19...@availity/mui-datepicker@1.1.0) (2025-05-12)
|
|
11
|
+
|
|
12
|
+
### Dependency Updates
|
|
13
|
+
|
|
14
|
+
* `mui-textfield` updated to version `1.0.19`
|
|
15
|
+
* `theme-provider` updated to version `1.0.19`
|
|
16
|
+
|
|
17
|
+
### Features
|
|
18
|
+
|
|
19
|
+
* **mui-textfield:** new readonly and updated disabled styles ([093844f](https://github.com/Availity/element/commit/093844ff8811656acb701a95a280076a9f0cb030))
|
|
20
|
+
|
|
5
21
|
## [1.0.19](https://github.com/Availity/element/compare/@availity/mui-datepicker@1.0.18...@availity/mui-datepicker@1.0.19) (2025-05-05)
|
|
6
22
|
|
|
7
23
|
### Dependency Updates
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@availity/mui-datepicker",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.1.1",
|
|
4
4
|
"description": "Availity MUI Datepicker Component - part of the @availity/element design system",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
},
|
|
42
42
|
"dependencies": {
|
|
43
43
|
"@availity/mui-icon": "1.1.0",
|
|
44
|
-
"@availity/mui-textfield": "1.
|
|
44
|
+
"@availity/mui-textfield": "1.3.1",
|
|
45
45
|
"@mui/x-date-pickers": "^7.26.0",
|
|
46
46
|
"dayjs": "^1.11.13"
|
|
47
47
|
},
|
|
@@ -5,7 +5,7 @@ import Typography from '@mui/material/Typography';
|
|
|
5
5
|
import { MonthCalendar } from '@mui/x-date-pickers/MonthCalendar';
|
|
6
6
|
import { YearCalendar } from '@mui/x-date-pickers/YearCalendar';
|
|
7
7
|
import dayjs, { Dayjs } from 'dayjs';
|
|
8
|
-
import { Box, Grid } from '@availity/mui-layout';
|
|
8
|
+
import { Box, Grid, Stack } from '@availity/mui-layout';
|
|
9
9
|
import { Paper } from '@availity/mui-paper';
|
|
10
10
|
import { Datepicker, DatepickerProps } from './Datepicker';
|
|
11
11
|
import { DateCalendar } from './DateCalendar';
|
|
@@ -42,6 +42,29 @@ export const _Datepicker: StoryObj<typeof Datepicker> = {
|
|
|
42
42
|
},
|
|
43
43
|
};
|
|
44
44
|
|
|
45
|
+
/** Notice the new `read-only` styling. We're moving away from `disabled` in favor of `read-only`.
|
|
46
|
+
* _See the [Disabled Fields Explainer](./?path=/docs/bs4-migration-form-migration--disabled-fields) for more information on when to use each._
|
|
47
|
+
*/
|
|
48
|
+
export const _States: StoryObj<typeof Datepicker> = {
|
|
49
|
+
render: (args) => (
|
|
50
|
+
<Stack direction="row" spacing={1} sx={{ flexWrap: 'wrap' }}>
|
|
51
|
+
<Datepicker {...args} FieldProps={{...args.FieldProps, id: "default", label: "Default"}}/>
|
|
52
|
+
<Datepicker {...args} FieldProps={{...args.FieldProps, id: "focused", label: "Focused", focused: true}} />
|
|
53
|
+
<Datepicker {...args} FieldProps={{...args.FieldProps, id: "error", label: "Error", error: true}} />
|
|
54
|
+
<Datepicker {...args} FieldProps={{...args.FieldProps, id: "read-only", label: "Read Only"}} readOnly />
|
|
55
|
+
<Datepicker {...args} FieldProps={{...args.FieldProps, id: "disabled", label: "Disabled"}} disabled />
|
|
56
|
+
</Stack>
|
|
57
|
+
),
|
|
58
|
+
args: {
|
|
59
|
+
FieldProps: {
|
|
60
|
+
fullWidth: false,
|
|
61
|
+
helperText: 'Help text for the field',
|
|
62
|
+
helpTopicId: '1234',
|
|
63
|
+
label: 'Date',
|
|
64
|
+
},
|
|
65
|
+
},
|
|
66
|
+
};
|
|
67
|
+
|
|
45
68
|
type DateRangePickerProps = {
|
|
46
69
|
startDate: Dayjs | null;
|
|
47
70
|
endDate: Dayjs | null;
|