@m4l/styles 0.0.41 → 0.0.42

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 (22) hide show
  1. package/index.js +8 -8
  2. package/package.json +1 -1
  3. package/theme/{defaultThemeOptions.c5fe2519.js → defaultThemeOptions.4c9bc728.js} +4 -4
  4. package/theme/overrides/M4LExtendedComponents/M4LAppBarCommercial.d.ts +2 -0
  5. package/theme/overrides/M4LExtendedComponents/M4LCheckBox.d.ts +22 -7
  6. package/theme/overrides/M4LExtendedComponents/M4LDataGrid.d.ts +24 -0
  7. package/theme/overrides/M4LExtendedComponents/M4LFieldLabel.d.ts +25 -0
  8. package/theme/overrides/M4LExtendedComponents/M4LPeriod.d.ts +366 -342
  9. package/theme/overrides/M4LExtendedComponents/M4LSideBar.d.ts +282 -136
  10. package/theme/overrides/M4LExtendedComponents/{index.8f5f04ca.js → index.ad4ae589.js} +302 -273
  11. package/theme/overrides/M4LRHFComponents/M4LRHFAutocomplete.d.ts +2 -14
  12. package/theme/overrides/M4LRHFComponents/M4LRHFCheckbox.d.ts +1 -47
  13. package/theme/overrides/M4LRHFComponents/M4LRHFColorPicker.d.ts +28 -14
  14. package/theme/overrides/M4LRHFComponents/M4LRHFDateTime.d.ts +28 -151
  15. package/theme/overrides/M4LRHFComponents/{index.427e0f0e.js → index.a9f361b8.js} +82 -61
  16. package/theme/overrides/{index.a3e99f67.js → index.dc9d8819.js} +26 -25
  17. package/theme/{palette.1b577d8c.js → palette.0590e8a6.js} +16 -14
  18. package/theme/palette.d.ts +2 -0
  19. package/theme/{shadows.479d005a.js → shadows.86540b18.js} +1 -1
  20. package/types/augmentations.d.ts +1 -1
  21. package/utils/{getColorPresets.479f9922.js → getColorPresets.2a91ffaf.js} +1 -1
  22. package/utils/{getColorState.0ad9ea67.js → getColorState.6c23eada.js} +1 -1
package/theme/overrides/M4LRHFComponents/M4LRHFAutocomplete.d.ts CHANGED
@@ -40,31 +40,19 @@ export declare const M4LRHFAutocomplete: (theme: Theme) => {
40
40
  gap: string;
41
41
  width: string;
42
42
  '& .M4LRHFAutocomplete-skeleton': {
43
- [x: string]: string | {
44
- width: string;
45
- height?: undefined;
46
- overflow?: undefined;
47
- margin?: undefined;
48
- } | {
49
- width: string;
50
- height: string;
51
- overflow: string;
52
- margin: string;
53
- };
54
43
  width: string;
55
44
  display: string;
56
45
  justifyContent: string;
57
46
  alignItems: string;
58
- height: string;
59
47
  border: string;
48
+ borderColor: string;
60
49
  borderRadius: string;
61
50
  padding: string;
62
51
  overflow: string;
63
- '& .M4LRHFAutocomplete-skeletonContainerText': {
52
+ '& .M4LRHFAutocomplete-SkeletonContainerText': {
64
53
  width: string;
65
54
  height: string;
66
55
  overflow: string;
67
- margin: string;
68
56
  };
69
57
  };
70
58
  };
package/theme/overrides/M4LRHFComponents/M4LRHFCheckbox.d.ts CHANGED
@@ -16,7 +16,6 @@ export declare const M4LRHFCheckbox: (theme: Theme) => {
16
16
  };
17
17
  display?: undefined;
18
18
  gap?: undefined;
19
- '& .M4LCheckBox-root'?: undefined;
20
19
  width?: undefined;
21
20
  height?: undefined;
22
21
  borderRadius?: undefined;
@@ -28,26 +27,9 @@ export declare const M4LRHFCheckbox: (theme: Theme) => {
28
27
  } | {
29
28
  [x: string]: string | {
30
29
  gap: string;
31
- display?: undefined;
32
- '& .M4LTypography-root'?: undefined;
33
- } | {
34
- display: string;
35
- gap: string;
36
- '& .M4LTypography-root': {
37
- display: string;
38
- alignItems: string;
39
- };
40
30
  };
41
31
  display: string;
42
32
  gap: string;
43
- '& .M4LCheckBox-root': {
44
- display: string;
45
- gap: string;
46
- '& .M4LTypography-root': {
47
- display: string;
48
- alignItems: string;
49
- };
50
- };
51
33
  '& .M4LRHFCheckbox-checkTypography'?: undefined;
52
34
  width?: undefined;
53
35
  height?: undefined;
@@ -62,7 +44,6 @@ export declare const M4LRHFCheckbox: (theme: Theme) => {
62
44
  '& .M4LRHFCheckbox-checkTypography'?: undefined;
63
45
  display?: undefined;
64
46
  gap?: undefined;
65
- '& .M4LCheckBox-root'?: undefined;
66
47
  width?: undefined;
67
48
  height?: undefined;
68
49
  borderRadius?: undefined;
@@ -77,7 +58,6 @@ export declare const M4LRHFCheckbox: (theme: Theme) => {
77
58
  '& .M4LRHFCheckbox-checkTypography'?: undefined;
78
59
  display?: undefined;
79
60
  gap?: undefined;
80
- '& .M4LCheckBox-root'?: undefined;
81
61
  borderRadius?: undefined;
82
62
  backgroundColor?: undefined;
83
63
  border?: undefined;
@@ -89,7 +69,6 @@ export declare const M4LRHFCheckbox: (theme: Theme) => {
89
69
  '& .M4LRHFCheckbox-checkTypography'?: undefined;
90
70
  display?: undefined;
91
71
  gap?: undefined;
92
- '& .M4LCheckBox-root'?: undefined;
93
72
  width?: undefined;
94
73
  height?: undefined;
95
74
  backgroundColor?: undefined;
@@ -102,7 +81,6 @@ export declare const M4LRHFCheckbox: (theme: Theme) => {
102
81
  '& .M4LRHFCheckbox-checkTypography'?: undefined;
103
82
  display?: undefined;
104
83
  gap?: undefined;
105
- '& .M4LCheckBox-root'?: undefined;
106
84
  width?: undefined;
107
85
  height?: undefined;
108
86
  borderRadius?: undefined;
@@ -116,7 +94,6 @@ export declare const M4LRHFCheckbox: (theme: Theme) => {
116
94
  '& .M4LRHFCheckbox-checkTypography'?: undefined;
117
95
  display?: undefined;
118
96
  gap?: undefined;
119
- '& .M4LCheckBox-root'?: undefined;
120
97
  width?: undefined;
121
98
  height?: undefined;
122
99
  borderRadius?: undefined;
@@ -128,7 +105,6 @@ export declare const M4LRHFCheckbox: (theme: Theme) => {
128
105
  '& .M4LRHFCheckbox-checkTypography'?: undefined;
129
106
  display?: undefined;
130
107
  gap?: undefined;
131
- '& .M4LCheckBox-root'?: undefined;
132
108
  width?: undefined;
133
109
  height?: undefined;
134
110
  borderRadius?: undefined;
@@ -141,7 +117,6 @@ export declare const M4LRHFCheckbox: (theme: Theme) => {
141
117
  '& .M4LRHFCheckbox-checkTypography'?: undefined;
142
118
  display?: undefined;
143
119
  gap?: undefined;
144
- '& .M4LCheckBox-root'?: undefined;
145
120
  width?: undefined;
146
121
  height?: undefined;
147
122
  borderRadius?: undefined;
@@ -155,7 +130,6 @@ export declare const M4LRHFCheckbox: (theme: Theme) => {
155
130
  '& .M4LRHFCheckbox-checkTypography'?: undefined;
156
131
  display?: undefined;
157
132
  gap?: undefined;
158
- '& .M4LCheckBox-root'?: undefined;
159
133
  width?: undefined;
160
134
  height?: undefined;
161
135
  borderRadius?: undefined;
@@ -166,30 +140,13 @@ export declare const M4LRHFCheckbox: (theme: Theme) => {
166
140
  };
167
141
  display: string;
168
142
  flexDirection: string;
169
- gap: string;
143
+ width: string;
170
144
  '.M4LRHFCheckbox-checkTypography': {
171
145
  [x: string]: string | {
172
146
  gap: string;
173
- display?: undefined;
174
- '& .M4LTypography-root'?: undefined;
175
- } | {
176
- display: string;
177
- gap: string;
178
- '& .M4LTypography-root': {
179
- display: string;
180
- alignItems: string;
181
- };
182
147
  };
183
148
  display: string;
184
149
  gap: string;
185
- '& .M4LCheckBox-root': {
186
- display: string;
187
- gap: string;
188
- '& .M4LTypography-root': {
189
- display: string;
190
- alignItems: string;
191
- };
192
- };
193
150
  };
194
151
  '& .MuiTypography-root': {
195
152
  color: string;
@@ -229,9 +186,6 @@ export declare const M4LRHFCheckbox: (theme: Theme) => {
229
186
  '.M4LRHFCheckbox-stateDisabled .MuiSvgIcon-root': {
230
187
  fill: string;
231
188
  };
232
- '.M4LRHFCheckbox-stateDisabled .MuiTypography-root': {
233
- color: string;
234
- };
235
189
  '.MuiButtonBase-root .Mui-focusVisible:focus-visible': {
236
190
  outline: string;
237
191
  };
package/theme/overrides/M4LRHFComponents/M4LRHFColorPicker.d.ts CHANGED
@@ -1,30 +1,43 @@
1
1
  import { Theme } from '@mui/material/styles';
2
- export declare const M4LRHFColorPicker: (_theme: Theme) => {
2
+ export declare const M4LRHFColorPicker: (theme: Theme) => {
3
3
  M4LRHFColorPicker: {
4
4
  styleOverrides: {
5
5
  '&.M4LRHFColorPicker-root': {
6
- test: string;
6
+ width: string;
7
+ display: string;
8
+ flexDirection: string;
9
+ gap: string;
10
+ '&.M4LRHFColorPicker-sizeSmall': {
11
+ '& .M4LRHFColorPicker-containerFieldColor': {
12
+ '& .M4LRHFColorPicker-boxColor': {
13
+ width: string;
14
+ height: string;
15
+ };
16
+ };
17
+ };
18
+ '&.M4LRHFColorPicker-sizeMedium': {
19
+ '& .M4LRHFColorPicker-containerFieldColor': {
20
+ '& .M4LRHFColorPicker-boxColor': {
21
+ width: string;
22
+ height: string;
23
+ };
24
+ };
25
+ };
26
+ '& .M4LRHFColorPicker-skeleton': {
27
+ borderRadius: string;
28
+ };
7
29
  '& .M4LRHFColorPicker-containerFieldColor': {
8
30
  display: string;
9
- alingnItems: string;
31
+ aligItems: string;
10
32
  justifyContent: string;
11
33
  gap: string;
12
34
  padding: string;
13
35
  border: string;
14
36
  borderColor: string;
15
37
  borderRadius: string;
16
- minHeight: string;
17
- height: string;
38
+ width: string;
18
39
  '& .M4LRHFColorPicker-boxColor': {
19
- borderRadius: string;
20
- height: string;
21
- width: string;
22
- };
23
- '& .M4LIcon-root': {
24
- minHeight: string;
25
- minWidth: string;
26
40
  cursor: string;
27
- borderRadius: string;
28
41
  };
29
42
  '& .M4LIcon-root:hover': {
30
43
  background: string;
@@ -36,7 +49,6 @@ export declare const M4LRHFColorPicker: (_theme: Theme) => {
36
49
  M4LRHFColorPickerPopoverRoot: {
37
50
  styleOverrides: {
38
51
  '&.M4LRHFColorPicker-popoverRoot': {
39
- test: string;
40
52
  '& .MuiPaper-root': {
41
53
  background: string;
42
54
  padding: string;
@@ -44,6 +56,7 @@ export declare const M4LRHFColorPicker: (_theme: Theme) => {
44
56
  borderColor: string;
45
57
  borderRadius: string;
46
58
  boxShadow: string;
59
+ test: string;
47
60
  '& .M4LRHFColorPicker-containerPicker': {
48
61
  background: string;
49
62
  borderRadius: string;
@@ -61,6 +74,7 @@ export declare const M4LRHFColorPicker: (_theme: Theme) => {
61
74
  border: string;
62
75
  borderColor: string;
63
76
  borderRadius: string;
77
+ backgroundColor: string;
64
78
  '& :nth-of-type(-n + 1)': {
65
79
  borderRadius: string;
66
80
  };
package/theme/overrides/M4LRHFComponents/M4LRHFDateTime.d.ts CHANGED
@@ -2,177 +2,54 @@ import { Theme } from '@mui/material/styles';
2
2
  export declare const M4LRHFDateTime: (theme: Theme) => {
3
3
  M4LRHFDateTime: {
4
4
  styleOverrides: {
5
- [x: string]: {
5
+ '&.M4LRHFDateTime-root': {
6
6
  test: string;
7
7
  display: string;
8
8
  flexDirection: string;
9
9
  width: string;
10
10
  gap: string;
11
- '& .MuiFormControl-root': {
12
- height: string;
13
- '& .MuiInputBase-root': {
14
- padding: string;
15
- minHeight: string;
16
- '& .MuiInputBase-input': {
17
- minHeight: string;
18
- height: string;
19
- };
20
- };
21
- };
22
- '& .M4LRHFTextField-label': {
23
- color: string;
24
- transition: string;
25
- };
26
- '& .MuiInputBase-root.MuiInputBase-formControl': {
27
- padding: string;
28
- '& .MuiInputBase-input': {
29
- height: string;
30
- color: string;
31
- padding: string;
32
- backgroundColor: string;
33
- };
34
- '& .MuiInputAdornment-root': {
11
+ '& .M4LRHFDateTime-skeleton': {
12
+ display: string;
13
+ width: string;
14
+ alignItems: string;
15
+ justifyContent: string;
16
+ border: string;
17
+ paddingLeft: string;
18
+ borderRadius: string;
19
+ '& .MuiSkeleton-circular': {
35
20
  margin: string;
36
- padding: string;
37
- width: string;
38
- height: string;
39
- position: string;
40
- maxWidth: string;
41
- minWidth: string;
42
- display: string;
43
- flex: string;
44
- overflow: string;
45
- '& .MuiButtonBase-root': {
46
- padding: string;
47
- backgroundColor: string;
48
- };
49
- };
50
- '& .M4LIcon-icon': {
51
- backgroundColor: string;
52
- transition: string;
53
- };
54
- '& .MuiOutlinedInput-notchedOutline': {
55
- border: string;
56
- padding: string;
57
- borderColor: string;
58
- borderRadius: string;
59
- inset: string;
60
- transition: string;
61
- '& legend': {
62
- display: string;
63
- };
64
- };
65
- };
66
- '&:hover': {
67
- '& .M4LTypography-root': {
68
- color: string;
69
- };
70
- '& .MuiInputBase-root .MuiOutlinedInput-notchedOutline': {
71
- borderColor: string;
72
- };
73
- '& .MuiInputBase-input': {
74
- color: string;
75
- };
76
- '& .M4LIcon-icon': {
77
- backgroundColor: string;
78
- };
79
- };
80
- '&.M4LRHFDateTime-isFocus': {
81
- '& .M4LTypography-root': {
82
- color: string;
83
- };
84
- '& .MuiInputBase-root .MuiOutlinedInput-notchedOutline': {
85
- transition: string;
86
- border: string;
87
- borderColor: string;
88
- };
89
- '& .MuiInputBase-input': {
90
- color: string;
91
- };
92
- '& .M4LIcon-icon': {
93
- backgroundColor: string;
94
21
  };
95
22
  };
96
- '&.M4LRHFTextField-variantError': {
97
- '& .M4LRHFTextField-label': {
98
- color: string;
99
- };
100
- '& .MuiInputBase-root .MuiOutlinedInput-notchedOutline': {
101
- border: string;
102
- borderColor: string;
103
- };
104
- '& .MuiInputBase-input': {
105
- color: string;
106
- };
107
- '& .M4LIcon-icon': {
108
- backgroundColor: string;
109
- };
110
- '&:hover': {
111
- '& .MuiInputBase-root .MuiOutlinedInput-notchedOutline': {
112
- boxShadow: string;
113
- };
114
- };
115
- '&.M4LRHFTextField-isFocus': {
116
- '& .MuiInputBase-root .MuiOutlinedInput-notchedOutline': {
117
- boxShadow: string;
23
+ '&.M4LRHFDateTime-small': {
24
+ '& .M4LRHFDateTime-skeleton': {
25
+ height: string;
26
+ '& .MuiSkeleton-circular': {
27
+ width: string;
28
+ height: string;
118
29
  };
119
30
  };
120
- };
121
- '&.M4LRHFTextField-isDisabled': {
122
- '& .M4LRHFTextField-label': {
123
- color: string;
124
- };
125
- '& .MuiInputBase-root .MuiOutlinedInput-notchedOutline': {
126
- border: string;
127
- borderColor: string;
128
- backgroundColor: string;
129
- boxShadow: string;
130
- };
131
- '& .MuiInputBase-input': {
132
- color: string;
133
- };
134
- '& .M4LIcon-icon': {
135
- backgroundColor: string;
31
+ '& .MuiFormControl-root': {
32
+ height: string;
136
33
  };
137
34
  };
138
- } | {
139
- '& .MuiFormControl-root': {
140
- height: string;
141
- '& .MuiInputBase-root': {
142
- minHeight: string;
143
- '& .MuiInputBase-input': {
144
- minHeight: string;
35
+ '&.M4LRHFDateTime-medium': {
36
+ '& .M4LRHFDateTime-skeleton': {
37
+ height: string;
38
+ '& .MuiSkeleton-circular': {
39
+ width: string;
145
40
  height: string;
146
41
  };
147
- padding?: undefined;
42
+ };
43
+ '& .MuiFormControl-root': {
44
+ height: string;
148
45
  };
149
46
  };
150
- test?: undefined;
151
- display?: undefined;
152
- flexDirection?: undefined;
153
- width?: undefined;
154
- gap?: undefined;
155
- '& .M4LRHFTextField-label'?: undefined;
156
- '& .MuiInputBase-root.MuiInputBase-formControl'?: undefined;
157
- '&:hover'?: undefined;
158
- '&.M4LRHFDateTime-isFocus'?: undefined;
159
- '&.M4LRHFTextField-variantError'?: undefined;
160
- '&.M4LRHFTextField-isDisabled'?: undefined;
161
- };
162
- '&.M4LRHFDateTime-root': {
163
- test: string;
164
- display: string;
165
- flexDirection: string;
166
- width: string;
167
- gap: string;
168
47
  '& .MuiFormControl-root': {
169
- height: string;
170
48
  '& .MuiInputBase-root': {
171
49
  padding: string;
172
- minHeight: string;
50
+ height: string;
173
51
  '& .MuiInputBase-input': {
174
52
  minHeight: string;
175
- height: string;
176
53
  };
177
54
  };
178
55
  };
@@ -183,10 +60,10 @@ export declare const M4LRHFDateTime: (theme: Theme) => {
183
60
  '& .MuiInputBase-root.MuiInputBase-formControl': {
184
61
  padding: string;
185
62
  '& .MuiInputBase-input': {
186
- height: string;
187
63
  color: string;
188
64
  padding: string;
189
65
  backgroundColor: string;
66
+ height: string;
190
67
  };
191
68
  '& .MuiInputAdornment-root': {
192
69
  margin: string;