@m4l/styles 0.0.41 → 0.0.43

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 (26) 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/M4LIconButton.d.ts +8 -28
  9. package/theme/overrides/M4LExtendedComponents/M4LImage.d.ts +0 -26
  10. package/theme/overrides/M4LExtendedComponents/M4LMFLoader.d.ts +6 -0
  11. package/theme/overrides/M4LExtendedComponents/M4LPeriod.d.ts +366 -342
  12. package/theme/overrides/M4LExtendedComponents/M4LSideBar.d.ts +355 -137
  13. package/theme/overrides/M4LExtendedComponents/{index.8f5f04ca.js → index.b9151f24.js} +395 -352
  14. package/theme/overrides/M4LRHFComponents/M4LRHFAutocomplete.d.ts +3 -14
  15. package/theme/overrides/M4LRHFComponents/M4LRHFCheckbox.d.ts +1 -47
  16. package/theme/overrides/M4LRHFComponents/M4LRHFColorPicker.d.ts +29 -14
  17. package/theme/overrides/M4LRHFComponents/M4LRHFDateTime.d.ts +29 -151
  18. package/theme/overrides/M4LRHFComponents/M4LRHFTextField.d.ts +1 -0
  19. package/theme/overrides/M4LRHFComponents/{index.427e0f0e.js → index.02fada22.js} +82 -57
  20. package/theme/overrides/{index.a3e99f67.js → index.fd981495.js} +26 -25
  21. package/theme/{palette.1b577d8c.js → palette.0590e8a6.js} +16 -14
  22. package/theme/palette.d.ts +2 -0
  23. package/theme/{shadows.479d005a.js → shadows.86540b18.js} +1 -1
  24. package/types/augmentations.d.ts +1 -1
  25. package/utils/{getColorPresets.479f9922.js → getColorPresets.2a91ffaf.js} +1 -1
  26. package/utils/{getColorState.0ad9ea67.js → getColorState.6c23eada.js} +1 -1
package/theme/overrides/M4LRHFComponents/M4LRHFAutocomplete.d.ts CHANGED
@@ -8,6 +8,7 @@ export declare const M4LRHFAutocomplete: (theme: Theme) => {
8
8
  flexDirection: string;
9
9
  width: string;
10
10
  gap: string;
11
+ outline: string;
11
12
  '& .MuiAutocomplete-root': {
12
13
  height: string;
13
14
  '& .MuiFormControl-root': {
@@ -40,31 +41,19 @@ export declare const M4LRHFAutocomplete: (theme: Theme) => {
40
41
  gap: string;
41
42
  width: string;
42
43
  '& .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
44
  width: string;
55
45
  display: string;
56
46
  justifyContent: string;
57
47
  alignItems: string;
58
- height: string;
59
48
  border: string;
49
+ borderColor: string;
60
50
  borderRadius: string;
61
51
  padding: string;
62
52
  overflow: string;
63
- '& .M4LRHFAutocomplete-skeletonContainerText': {
53
+ '& .M4LRHFAutocomplete-SkeletonContainerText': {
64
54
  width: string;
65
55
  height: string;
66
56
  overflow: string;
67
- margin: string;
68
57
  };
69
58
  };
70
59
  };
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,44 @@
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
+ outline: string;
11
+ '&.M4LRHFColorPicker-sizeSmall': {
12
+ '& .M4LRHFColorPicker-containerFieldColor': {
13
+ '& .M4LRHFColorPicker-boxColor': {
14
+ width: string;
15
+ height: string;
16
+ };
17
+ };
18
+ };
19
+ '&.M4LRHFColorPicker-sizeMedium': {
20
+ '& .M4LRHFColorPicker-containerFieldColor': {
21
+ '& .M4LRHFColorPicker-boxColor': {
22
+ width: string;
23
+ height: string;
24
+ };
25
+ };
26
+ };
27
+ '& .M4LRHFColorPicker-skeleton': {
28
+ borderRadius: string;
29
+ };
7
30
  '& .M4LRHFColorPicker-containerFieldColor': {
8
31
  display: string;
9
- alingnItems: string;
32
+ aligItems: string;
10
33
  justifyContent: string;
11
34
  gap: string;
12
35
  padding: string;
13
36
  border: string;
14
37
  borderColor: string;
15
38
  borderRadius: string;
16
- minHeight: string;
17
- height: string;
39
+ width: string;
18
40
  '& .M4LRHFColorPicker-boxColor': {
19
- borderRadius: string;
20
- height: string;
21
- width: string;
22
- };
23
- '& .M4LIcon-root': {
24
- minHeight: string;
25
- minWidth: string;
26
41
  cursor: string;
27
- borderRadius: string;
28
42
  };
29
43
  '& .M4LIcon-root:hover': {
30
44
  background: string;
@@ -36,7 +50,6 @@ export declare const M4LRHFColorPicker: (_theme: Theme) => {
36
50
  M4LRHFColorPickerPopoverRoot: {
37
51
  styleOverrides: {
38
52
  '&.M4LRHFColorPicker-popoverRoot': {
39
- test: string;
40
53
  '& .MuiPaper-root': {
41
54
  background: string;
42
55
  padding: string;
@@ -44,6 +57,7 @@ export declare const M4LRHFColorPicker: (_theme: Theme) => {
44
57
  borderColor: string;
45
58
  borderRadius: string;
46
59
  boxShadow: string;
60
+ test: string;
47
61
  '& .M4LRHFColorPicker-containerPicker': {
48
62
  background: string;
49
63
  borderRadius: string;
@@ -61,6 +75,7 @@ export declare const M4LRHFColorPicker: (_theme: Theme) => {
61
75
  border: string;
62
76
  borderColor: string;
63
77
  borderRadius: string;
78
+ backgroundColor: string;
64
79
  '& :nth-of-type(-n + 1)': {
65
80
  borderRadius: string;
66
81
  };
package/theme/overrides/M4LRHFComponents/M4LRHFDateTime.d.ts CHANGED
@@ -2,177 +2,55 @@ 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
+ outline: string;
12
+ '& .M4LRHFDateTime-skeleton': {
13
+ display: string;
14
+ width: string;
15
+ alignItems: string;
16
+ justifyContent: string;
17
+ border: string;
18
+ paddingLeft: string;
19
+ borderRadius: string;
20
+ '& .MuiSkeleton-circular': {
35
21
  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
22
  };
95
23
  };
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;
24
+ '&.M4LRHFDateTime-small': {
25
+ '& .M4LRHFDateTime-skeleton': {
26
+ height: string;
27
+ '& .MuiSkeleton-circular': {
28
+ width: string;
29
+ height: string;
118
30
  };
119
31
  };
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;
32
+ '& .MuiFormControl-root': {
33
+ height: string;
136
34
  };
137
35
  };
138
- } | {
139
- '& .MuiFormControl-root': {
140
- height: string;
141
- '& .MuiInputBase-root': {
142
- minHeight: string;
143
- '& .MuiInputBase-input': {
144
- minHeight: string;
36
+ '&.M4LRHFDateTime-medium': {
37
+ '& .M4LRHFDateTime-skeleton': {
38
+ height: string;
39
+ '& .MuiSkeleton-circular': {
40
+ width: string;
145
41
  height: string;
146
42
  };
147
- padding?: undefined;
43
+ };
44
+ '& .MuiFormControl-root': {
45
+ height: string;
148
46
  };
149
47
  };
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
48
  '& .MuiFormControl-root': {
169
- height: string;
170
49
  '& .MuiInputBase-root': {
171
50
  padding: string;
172
- minHeight: string;
51
+ height: string;
173
52
  '& .MuiInputBase-input': {
174
53
  minHeight: string;
175
- height: string;
176
54
  };
177
55
  };
178
56
  };
@@ -183,10 +61,10 @@ export declare const M4LRHFDateTime: (theme: Theme) => {
183
61
  '& .MuiInputBase-root.MuiInputBase-formControl': {
184
62
  padding: string;
185
63
  '& .MuiInputBase-input': {
186
- height: string;
187
64
  color: string;
188
65
  padding: string;
189
66
  backgroundColor: string;
67
+ height: string;
190
68
  };
191
69
  '& .MuiInputAdornment-root': {
192
70
  margin: string;
package/theme/overrides/M4LRHFComponents/M4LRHFTextField.d.ts CHANGED
@@ -7,6 +7,7 @@ export declare const M4LRHFTextField: (theme: Theme) => {
7
7
  flexDirection: string;
8
8
  width: string;
9
9
  gap: string;
10
+ outline: string;
10
11
  '&.M4LRHFTextField-variantText': {
11
12
  height: string;
12
13
  '& .MuiFormControl-root': {