@campxdev/react-blueprint 2.3.11 → 2.3.12

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.
Files changed (6) hide show
  1. package/dist/cjs/index.js +1 -1
  2. package/dist/esm/index.js +2 -2
  3. package/package.json +1 -1
  4. package/src/components/Input/DatePicker/DatePicker.tsx +30 -23
  5. package/src/components/Input/DateTimePicker/DateTimePicker.tsx +26 -22
  6. package/src/components/Input/TimePicker/TimePicker.tsx +13 -10
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@campxdev/react-blueprint",
3
- "version": "2.3.11",
3
+ "version": "2.3.12",
4
4
  "description": "React UI component library for CampX applications",
5
5
  "author": "CampX",
6
6
  "license": "MIT",
package/src/components/Input/DatePicker/DatePicker.tsx CHANGED
@@ -1,5 +1,10 @@
1
1
  import { StackProps } from '@mui/material';
2
- import { PickersShortcutsItem, PickerValidDate } from '@mui/x-date-pickers';
2
+ import {
3
+ LocalizationProvider,
4
+ PickersShortcutsItem,
5
+ PickerValidDate,
6
+ } from '@mui/x-date-pickers';
7
+ import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
3
8
  import {
4
9
  DatePicker as MuiDatePicker,
5
10
  DatePickerProps as MuiDatePickerProps,
@@ -48,28 +53,30 @@ export const DatePicker = <
48
53
  name={name}
49
54
  containerProps={containerProps}
50
55
  >
51
- <MuiDatePicker
52
- format={format}
53
- views={views}
54
- defaultValue={value}
55
- slotProps={{
56
- textField: {
57
- helperText,
58
- placeholder,
59
- error: !!error,
60
- },
61
- shortcuts: {
62
- items: shortcutsItems,
63
- },
64
- }}
65
- slots={{
66
- openPickerIcon: Icon,
67
- }}
68
- dayOfWeekFormatter={(day: any) => {
69
- return `${DateFnsFormat(day, 'EEEE').slice(0, 2)}.`;
70
- }}
71
- {...rest}
72
- />
56
+ <LocalizationProvider dateAdapter={AdapterDateFns}>
57
+ <MuiDatePicker
58
+ format={format}
59
+ views={views}
60
+ defaultValue={value}
61
+ slotProps={{
62
+ textField: {
63
+ helperText,
64
+ placeholder,
65
+ error: !!error,
66
+ },
67
+ shortcuts: {
68
+ items: shortcutsItems,
69
+ },
70
+ }}
71
+ slots={{
72
+ openPickerIcon: Icon,
73
+ }}
74
+ dayOfWeekFormatter={(day: any) => {
75
+ return `${DateFnsFormat(day, 'EEEE').slice(0, 2)}.`;
76
+ }}
77
+ {...rest}
78
+ />
79
+ </LocalizationProvider>
73
80
  </LabelWrapper>
74
81
  );
75
82
  };
package/src/components/Input/DateTimePicker/DateTimePicker.tsx CHANGED
@@ -1,5 +1,6 @@
1
1
  import { StackProps } from '@mui/material';
2
2
  import {
3
+ LocalizationProvider,
3
4
  DateTimePicker as MuiDateTimePicker,
4
5
  DateTimePickerProps as MuiDateTimePickerProps,
5
6
  PickersShortcutsItem,
@@ -7,6 +8,7 @@ import {
7
8
  } from '@mui/x-date-pickers';
8
9
  import { format as DateFnsFormat } from 'date-fns';
9
10
 
11
+ import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
10
12
  import { Icons } from '../../export';
11
13
  import { LabelWrapper } from '../LabelWrapper/LabelWrapper';
12
14
 
@@ -71,28 +73,30 @@ export const DateTimePicker = <
71
73
  name={name}
72
74
  containerProps={containerProps}
73
75
  >
74
- <MuiDateTimePicker
75
- format={format}
76
- views={views}
77
- defaultValue={value}
78
- slotProps={{
79
- textField: {
80
- helperText,
81
- placeholder,
82
- error: !!error,
83
- },
84
- shortcuts: {
85
- items: shortcutsItems,
86
- },
87
- }}
88
- slots={{
89
- openPickerIcon: Icon,
90
- }}
91
- dayOfWeekFormatter={(day: any) => {
92
- return `${DateFnsFormat(day, 'EEEE').slice(0, 2)}.`;
93
- }}
94
- {...rest}
95
- />
76
+ <LocalizationProvider dateAdapter={AdapterDateFns}>
77
+ <MuiDateTimePicker
78
+ format={format}
79
+ views={views}
80
+ defaultValue={value}
81
+ slotProps={{
82
+ textField: {
83
+ helperText,
84
+ placeholder,
85
+ error: !!error,
86
+ },
87
+ shortcuts: {
88
+ items: shortcutsItems,
89
+ },
90
+ }}
91
+ slots={{
92
+ openPickerIcon: Icon,
93
+ }}
94
+ dayOfWeekFormatter={(day: any) => {
95
+ return `${DateFnsFormat(day, 'EEEE').slice(0, 2)}.`;
96
+ }}
97
+ {...rest}
98
+ />
99
+ </LocalizationProvider>
96
100
  </LabelWrapper>
97
101
  );
98
102
  };
package/src/components/Input/TimePicker/TimePicker.tsx CHANGED
@@ -1,4 +1,5 @@
1
- import { PickerValidDate } from '@mui/x-date-pickers';
1
+ import { LocalizationProvider, PickerValidDate } from '@mui/x-date-pickers';
2
+ import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
2
3
  import {
3
4
  TimePicker as MuiTimePicker,
4
5
  TimePickerProps as MuiTimePickerProps,
@@ -39,15 +40,17 @@ export const TimePicker = <
39
40
  name={name}
40
41
  containerProps={containerProps}
41
42
  >
42
- <MuiTimePicker
43
- defaultValue={value}
44
- format={format}
45
- views={views}
46
- slotProps={{
47
- textField: { placeholder, helperText },
48
- }}
49
- {...rest}
50
- />
43
+ <LocalizationProvider dateAdapter={AdapterDateFns}>
44
+ <MuiTimePicker
45
+ defaultValue={value}
46
+ format={format}
47
+ views={views}
48
+ slotProps={{
49
+ textField: { placeholder, helperText },
50
+ }}
51
+ {...rest}
52
+ />
53
+ </LocalizationProvider>
51
54
  </LabelWrapper>
52
55
  );
53
56
  };