@m4l/components 9.1.88 → 9.1.90

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 (76) hide show
  1. package/@types/types.d.ts +19 -1
  2. package/components/Chip/Chip.js +3 -1
  3. package/components/Chip/ChipStyles.js +19 -14
  4. package/components/Chip/types.d.ts +8 -3
  5. package/components/hook-form/RHFDateTime/RHFDateTime.d.ts +4 -0
  6. package/components/hook-form/RHFDateTime/RHFDateTime.js +39 -86
  7. package/components/hook-form/RHFDateTime/RHFDateTime.styles.d.ts +2 -0
  8. package/components/hook-form/RHFDateTime/RHFDateTime.styles.js +17 -0
  9. package/components/hook-form/RHFDateTime/constants.d.ts +1 -0
  10. package/components/hook-form/RHFDateTime/constants.js +4 -0
  11. package/components/hook-form/RHFDateTime/slots/RHFDateTimeEnum.d.ts +3 -0
  12. package/components/hook-form/RHFDateTime/slots/RHFDateTimeEnum.js +7 -0
  13. package/components/hook-form/RHFDateTime/slots/RHFDateTimeSlots.d.ts +1 -0
  14. package/components/hook-form/RHFDateTime/slots/RHFDateTimeSlots.js +9 -0
  15. package/components/hook-form/RHFDateTime/tests/RHFDateTime.test.d.ts +1 -0
  16. package/components/hook-form/RHFDateTime/types.d.ts +13 -12
  17. package/components/index.d.ts +1 -1
  18. package/components/mui_extended/Autocomplete/Autocomplete.styles.js +1 -5
  19. package/components/mui_extended/DateTimePicker/DateTimePicker.d.ts +33 -0
  20. package/components/mui_extended/DateTimePicker/DateTimePicker.js +154 -0
  21. package/components/mui_extended/DateTimePicker/DateTimePicker.styles.d.ts +2 -0
  22. package/components/mui_extended/DateTimePicker/DateTimePicker.styles.js +752 -0
  23. package/components/mui_extended/DateTimePicker/constants.d.ts +1 -0
  24. package/components/mui_extended/DateTimePicker/constants.js +4 -0
  25. package/components/mui_extended/DateTimePicker/icons.d.ts +4 -0
  26. package/components/mui_extended/DateTimePicker/icons.js +10 -0
  27. package/components/mui_extended/DateTimePicker/slots/DateTimePickerEnum.d.ts +10 -0
  28. package/components/mui_extended/DateTimePicker/slots/DateTimePickerEnum.js +14 -0
  29. package/components/mui_extended/DateTimePicker/slots/DateTimePickerSlots.d.ts +26 -0
  30. package/components/mui_extended/DateTimePicker/slots/DateTimePickerSlots.js +49 -0
  31. package/components/mui_extended/DateTimePicker/tests/DateTimePicker.test.d.ts +1 -0
  32. package/components/mui_extended/DateTimePicker/types.d.ts +51 -0
  33. package/components/mui_extended/NavLink/NavLink.d.ts +9 -0
  34. package/components/mui_extended/NavLink/NavLink.js +68 -0
  35. package/components/mui_extended/NavLink/NavLink.styles.d.ts +2 -0
  36. package/components/mui_extended/NavLink/NavLink.styles.js +85 -0
  37. package/components/mui_extended/NavLink/constants.d.ts +14 -0
  38. package/components/mui_extended/NavLink/constants.js +10 -0
  39. package/components/mui_extended/NavLink/slots/NavLinkEnum.d.ts +6 -0
  40. package/components/mui_extended/NavLink/slots/NavLinkEnum.js +10 -0
  41. package/components/mui_extended/NavLink/slots/NavLinkSlots.d.ts +12 -0
  42. package/components/mui_extended/NavLink/slots/NavLinkSlots.js +29 -0
  43. package/components/mui_extended/NavLink/slots/index.d.ts +0 -0
  44. package/components/mui_extended/NavLink/tests/NavLink.test.d.ts +1 -0
  45. package/components/mui_extended/NavLink/types.d.ts +36 -0
  46. package/index.js +1 -1
  47. package/package.json +1 -1
  48. package/components/NavLink/NavLink.d.ts +0 -9
  49. package/components/NavLink/NavLink.js +0 -32
  50. package/components/NavLink/classes/constant.d.ts +0 -1
  51. package/components/NavLink/classes/constant.js +0 -4
  52. package/components/NavLink/classes/index.d.ts +0 -9
  53. package/components/NavLink/classes/index.js +0 -23
  54. package/components/NavLink/classes/types.d.ts +0 -4
  55. package/components/NavLink/styles.d.ts +0 -1
  56. package/components/NavLink/styles.js +0 -7
  57. package/components/NavLink/tests/constants.d.ts +0 -1
  58. package/components/NavLink/tests/constants.js +0 -4
  59. package/components/NavLink/tests/utils.d.ts +0 -2
  60. package/components/NavLink/tests/utils.js +0 -7
  61. package/components/NavLink/types.d.ts +0 -5
  62. package/components/hook-form/RHFDateTime/classes/constants.d.ts +0 -1
  63. package/components/hook-form/RHFDateTime/classes/constants.js +0 -4
  64. package/components/hook-form/RHFDateTime/classes/index.d.ts +0 -11
  65. package/components/hook-form/RHFDateTime/classes/index.js +0 -45
  66. package/components/hook-form/RHFDateTime/classes/types.d.ts +0 -16
  67. package/components/hook-form/RHFDateTime/styles.js +0 -7
  68. package/components/hook-form/RHFDateTime/subcomponents/Skeleton/index.d.ts +0 -5
  69. package/components/hook-form/RHFDateTime/subcomponents/Skeleton/index.js +0 -15
  70. package/components/hook-form/RHFDateTime/subcomponents/Skeleton/types.d.ts +0 -5
  71. package/components/hook-form/RHFDateTime/test/constants.d.ts +0 -1
  72. package/components/hook-form/RHFDateTime/test/constants.js +0 -4
  73. package/components/hook-form/RHFDateTime/test/utils.d.ts +0 -2
  74. package/components/hook-form/RHFDateTime/test/utils.js +0 -7
  75. /package/components/{NavLink → mui_extended/NavLink}/index.d.ts +0 -0
  76. /package/components/{NavLink → mui_extended/NavLink}/index.js +0 -0
@@ -0,0 +1,752 @@
1
+ import { g as getTypographyStyles } from "../../../utils/getTypographyStyles.js";
2
+ import { g as getHeightSizeStyles } from "../../../utils/getHeightSizeStyles.js";
3
+ const dateTimePickerStyles = {
4
+ /**
5
+ * Estilos para el root cuando esta en Desktop 💻
6
+ * @author DanielEscobar - automatic
7
+ * @createdAt 2025-01-28 01:24:17 - automatic
8
+ * @updatedAt 2025-01-29 17:03:17 - automatic
9
+ * @updatedUser DanielEscobar - automatic
10
+ */
11
+ rootDesktop: ({ theme, ownerState }) => ({
12
+ // ↴ Overrides sizes ❌
13
+ ...getHeightSizeStyles(
14
+ theme.generalSettings.isMobile,
15
+ ownerState.size || "medium",
16
+ "action",
17
+ (height) => ({
18
+ height: `${height} !important`,
19
+ minHeight: `${height} !important`,
20
+ maxHeight: `${height} !important`
21
+ })
22
+ ),
23
+ // Estilos globales del Input DateTimePicker en Desktop 🌎
24
+ "& .MuiInputBase-root": {
25
+ height: "100%",
26
+ padding: 0,
27
+ borderRadius: theme.vars.size.borderRadius.r1,
28
+ paddingLeft: theme.vars.size.baseSpacings.sp1,
29
+ "& input": {
30
+ padding: 0,
31
+ paddingLeft: theme.vars.size.baseSpacings.sp1,
32
+ paddingRight: theme.vars.size.baseSpacings.sp3,
33
+ ...getTypographyStyles(
34
+ theme.generalSettings.isMobile,
35
+ ownerState.size || "medium",
36
+ "body"
37
+ )
38
+ },
39
+ "& .MuiInputAdornment-root": {
40
+ margin: 0,
41
+ ...getHeightSizeStyles(
42
+ theme.generalSettings.isMobile,
43
+ ownerState.size || "medium",
44
+ "action",
45
+ (height) => ({
46
+ height,
47
+ minHeight: height,
48
+ maxHeight: height,
49
+ minWidth: `${height} !important`
50
+ })
51
+ )
52
+ },
53
+ // ↴ Overrides ❌
54
+ "&.MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline": {
55
+ outline: 0,
56
+ minHeight: 0,
57
+ ...ownerState.variant === "outlined" && {
58
+ border: theme.vars.size.borderStroke.actionInput
59
+ },
60
+ ...ownerState.variant === "text" && {
61
+ border: 0,
62
+ borderBottom: theme.vars.size.borderStroke.actionInput
63
+ },
64
+ borderColor: ownerState.error ? theme.vars.palette.error.hover : theme.vars.palette.border.default,
65
+ borderRadius: theme.vars.size.borderRadius.r1
66
+ },
67
+ // ↴ Overrides ❌
68
+ "&.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline": {
69
+ outline: 0,
70
+ ...ownerState.variant === "outlined" && {
71
+ border: theme.vars.size.borderStroke.actionInput
72
+ },
73
+ ...ownerState.variant === "text" && {
74
+ border: 0,
75
+ borderBottom: theme.vars.size.borderStroke.actionInput
76
+ },
77
+ borderColor: ownerState.error ? theme.vars.palette.error.active : theme.vars.palette.primary.enabled
78
+ },
79
+ // ↴ Overrides ❌
80
+ "&.MuiOutlinedInput-root.Mui-focused .M4LIcon-icon": {
81
+ backgroundColor: ownerState.error ? theme.vars.palette.error.active : theme.vars.palette.primary.enabled
82
+ },
83
+ // ↴ Overrides ❌
84
+ ...!ownerState.disabled && {
85
+ "&:hover": {
86
+ background: ownerState.error ? theme.vars.palette.error.hoverOpacity : theme.vars.palette.primary.hoverOpacity
87
+ },
88
+ "&:active": {
89
+ background: theme.vars.palette.background.default
90
+ }
91
+ }
92
+ }
93
+ }),
94
+ /**
95
+ * Estilos para el root cuando esta en Mobile 📱
96
+ * @author DanielEscobar - automatic
97
+ * @createdAt 2025-01-28 01:24:17 - automatic
98
+ * @updatedAt 2025-01-29 17:03:17 - automatic
99
+ * @updatedUser DanielEscobar - automatic
100
+ */
101
+ rootMobile: ({ theme, ownerState }) => ({
102
+ // ↴ Overrides sizes ❌
103
+ ...getHeightSizeStyles(
104
+ theme.generalSettings.isMobile,
105
+ ownerState.size || "medium",
106
+ "action",
107
+ (height) => ({
108
+ height: `${height} !important`,
109
+ minHeight: `${height} !important`,
110
+ maxHeight: `${height} !important`
111
+ })
112
+ ),
113
+ // Estilos globales del Input DateTimePicker en Desktop 🌎
114
+ "& .MuiInputBase-root": {
115
+ height: "100%",
116
+ padding: 0,
117
+ borderRadius: theme.vars.size.borderRadius.r1,
118
+ paddingLeft: theme.vars.size.baseSpacings.sp1,
119
+ "& input": {
120
+ padding: 0,
121
+ paddingLeft: theme.vars.size.baseSpacings.sp1,
122
+ paddingRight: theme.vars.size.baseSpacings.sp3,
123
+ ...getTypographyStyles(
124
+ theme.generalSettings.isMobile,
125
+ ownerState.size || "medium",
126
+ "body"
127
+ )
128
+ },
129
+ // ↴ Overrides ❌
130
+ "&.MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline": {
131
+ outline: 0,
132
+ minHeight: 0,
133
+ ...ownerState.variant === "outlined" && {
134
+ border: theme.vars.size.borderStroke.actionInput
135
+ },
136
+ ...ownerState.variant === "text" && {
137
+ border: 0,
138
+ borderBottom: theme.vars.size.borderStroke.actionInput
139
+ },
140
+ borderColor: ownerState.error ? theme.vars.palette.error.hover : theme.vars.palette.border.default,
141
+ borderRadius: theme.vars.size.borderRadius.r1
142
+ },
143
+ // ↴ Overrides ❌
144
+ "&.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline": {
145
+ outline: 0,
146
+ ...ownerState.variant === "outlined" && {
147
+ border: theme.vars.size.borderStroke.actionInput
148
+ },
149
+ ...ownerState.variant === "text" && {
150
+ border: 0,
151
+ borderBottom: theme.vars.size.borderStroke.actionInput
152
+ },
153
+ borderColor: ownerState.error ? theme.vars.palette.error.active : theme.vars.palette.primary.enabled
154
+ },
155
+ // ↴ Overrides ❌
156
+ ...!ownerState.disabled && {
157
+ "&:hover": {
158
+ background: ownerState.error ? theme.vars.palette.error.hoverOpacity : theme.vars.palette.primary.hoverOpacity
159
+ },
160
+ "&:active": {
161
+ background: theme.vars.palette.background.default
162
+ }
163
+ }
164
+ }
165
+ }),
166
+ /**
167
+ * Estilos para el popper de Material UI
168
+ * @author DanielEscobar - automatic
169
+ * @createdAt 2025-01-28 01:24:17 - automatic
170
+ * @updatedAt 2025-01-29 17:03:17 - automatic
171
+ * @updatedUser DanielEscobar - automatic
172
+ */
173
+ popper: ({ theme, ownerState }) => ({
174
+ zIndex: theme.vars.zIndex.modal,
175
+ "& .MuiDivider-root": {
176
+ borderColor: theme.vars.palette.border.secondary
177
+ },
178
+ // Estilos globales del MuiPickersLayout-root 🌎
179
+ "& .MuiPaper-root": {
180
+ boxShadow: theme.vars.customShadows.z4,
181
+ paddingTop: theme.vars.size.baseSpacings.sp3,
182
+ borderRadius: theme.vars.size.borderRadius.r1
183
+ },
184
+ // Estilos globales del MuiPickersLayout-root 🌎
185
+ "& .MuiPickersLayout-root": {
186
+ gap: `0px 0px ${theme.vars.size.baseSpacings.sp1} 0px`,
187
+ "& .MuiPickersLayout-contentWrapper": {
188
+ // ↴ Overrides ❌
189
+ // paddingLeft: theme.vars.size.baseSpacings.sp3,
190
+ // paddingRight: theme.vars.size.baseSpacings.sp3,
191
+ // Estilos específicos para el primer div hijo directo
192
+ "& > div:first-of-type": {
193
+ height: "265px"
194
+ }
195
+ }
196
+ },
197
+ // Estilos globales del MuiDateCalendar-root 🌎
198
+ "& .MuiDateCalendar-root": {
199
+ display: "flex",
200
+ width: "fit-content",
201
+ position: "relative",
202
+ top: -1,
203
+ gap: theme.vars.size.baseSpacings.sp3,
204
+ padding: theme.vars.size.baseSpacings.sp1,
205
+ // ↴ Overrides ❌
206
+ "& .MuiYearCalendar-root": {
207
+ // Fix en el height
208
+ height: "218px",
209
+ "& .MuiPickersYear-root": {
210
+ "& .MuiPickersYear-yearButton": {
211
+ width: "fit-content",
212
+ padding: `0px ${theme.vars.size.baseSpacings.sp3}`,
213
+ borderRadius: theme.vars.size.borderRadius.r1,
214
+ "&:hover": {
215
+ background: theme.vars.palette.default.hoverOpacity
216
+ },
217
+ "&:active": {
218
+ background: theme.vars.palette.default.active
219
+ },
220
+ "&.Mui-selected": {
221
+ background: theme.vars.palette.primary.enabled,
222
+ "&:hover": {
223
+ background: theme.vars.palette.primary.hover
224
+ },
225
+ "&:active": {
226
+ background: theme.vars.palette.primary.active
227
+ }
228
+ },
229
+ ...getHeightSizeStyles(
230
+ theme.generalSettings.isMobile,
231
+ ownerState.size || "small",
232
+ "action",
233
+ (height) => ({
234
+ minHeight: height,
235
+ height,
236
+ maxHeight: height
237
+ })
238
+ ),
239
+ ...getTypographyStyles(
240
+ theme.generalSettings.isMobile,
241
+ ownerState.size || "medium",
242
+ "body"
243
+ )
244
+ }
245
+ }
246
+ },
247
+ // ↴ Overrides ❌
248
+ "& .MuiDayCalendar-root": {
249
+ width: "fit-content",
250
+ padding: theme.vars.size.baseSpacings.sp2,
251
+ "& .MuiDayCalendar-header": {
252
+ display: "flex",
253
+ gap: theme.vars.size.baseSpacings.sp1,
254
+ "& .MuiTypography-root": {
255
+ margin: 0,
256
+ ...getTypographyStyles(
257
+ theme.generalSettings.isMobile,
258
+ ownerState.size || "medium",
259
+ "body"
260
+ ),
261
+ ...getHeightSizeStyles(
262
+ theme.generalSettings.isMobile,
263
+ ownerState.size || "small",
264
+ "action",
265
+ (height) => ({
266
+ minHeight: height,
267
+ height,
268
+ maxHeight: height,
269
+ minWidth: height,
270
+ width: height,
271
+ maxWidth: height
272
+ })
273
+ )
274
+ }
275
+ },
276
+ "& .MuiDayCalendar-weekContainer": {
277
+ display: "flex",
278
+ margin: 0,
279
+ paddingTop: theme.vars.size.baseSpacings.sp1,
280
+ gap: theme.vars.size.baseSpacings.sp1
281
+ }
282
+ }
283
+ },
284
+ // Estilos globales del MuiMultiSectionDigitalClock-root 🌎
285
+ "& .MuiMultiSectionDigitalClock-root": {
286
+ padding: theme.vars.size.baseSpacings.sp1,
287
+ // ↴ Overrides ❌
288
+ "& .MuiList-root": {
289
+ display: "flex",
290
+ width: "fit-content",
291
+ flexDirection: "column",
292
+ overflow: "overlay",
293
+ borderColor: theme.vars.palette.border.secondary,
294
+ paddingRight: theme.vars.size.baseSpacings.sp2,
295
+ paddingLeft: theme.vars.size.baseSpacings.sp2,
296
+ gap: theme.vars.size.baseSpacings.sp2,
297
+ "& .MuiButtonBase-root": {
298
+ margin: 0,
299
+ ...getHeightSizeStyles(
300
+ theme.generalSettings.isMobile,
301
+ ownerState.size || "small",
302
+ "action",
303
+ (height) => ({
304
+ minHeight: height,
305
+ height,
306
+ maxHeight: height,
307
+ minWidth: height,
308
+ width: height,
309
+ maxWidth: height
310
+ })
311
+ ),
312
+ ...getTypographyStyles(
313
+ theme.generalSettings.isMobile,
314
+ ownerState.size || "medium",
315
+ "body"
316
+ )
317
+ }
318
+ }
319
+ },
320
+ // Estilos globales del MuiDialogActions-root 🌎
321
+ "& .MuiDialogActions-root": {
322
+ paddingRight: theme.vars.size.baseSpacings.sp3,
323
+ // ↴ Overrides ❌
324
+ "& .MuiButtonBase-root": {
325
+ margin: 0,
326
+ ...getHeightSizeStyles(
327
+ theme.generalSettings.isMobile,
328
+ ownerState.size || "small",
329
+ "action",
330
+ (height) => ({
331
+ minHeight: height,
332
+ height,
333
+ maxHeight: height,
334
+ minWidth: height,
335
+ width: height,
336
+ maxWidth: height
337
+ })
338
+ ),
339
+ ...getTypographyStyles(
340
+ theme.generalSettings.isMobile,
341
+ ownerState.size || "medium",
342
+ "body"
343
+ )
344
+ }
345
+ }
346
+ }),
347
+ /**
348
+ * estilos para paper de Material UI
349
+ * @author DanielEscobar - automatic
350
+ * @createdAt 2025-01-28 02:42:08 - automatic
351
+ * @updatedAt 2025-01-29 17:03:17 - automatic
352
+ * @updatedUser DanielEscobar - automatic
353
+ */
354
+ paper: ({ theme, ownerState }) => ({
355
+ minWidth: "0 !important",
356
+ padding: theme.vars.size.baseSpacings.sp3,
357
+ borderRadius: theme.vars.size.borderRadius.r1,
358
+ "& .MuiPickersLayout-root": {
359
+ gap: theme.vars.size.baseSpacings.sp2
360
+ },
361
+ // Estilos globales del MuiPickersLayout-root 🌎
362
+ "& .MuiPickersToolbar-root": {
363
+ gridArea: " 1 / 2 / auto / 2 !important",
364
+ padding: 0,
365
+ // ↴ Overrides ❌
366
+ "& > span:first-of-type": {
367
+ ...getTypographyStyles(
368
+ theme.generalSettings.isMobile,
369
+ ownerState.size || "medium",
370
+ "body"
371
+ )
372
+ },
373
+ // ↴ Overrides ❌
374
+ "& .MuiPickersToolbar-content": {
375
+ "& .MuiDateTimePickerToolbar-dateContainer": {
376
+ "& button > span": {
377
+ color: theme.vars.palette.text.primary,
378
+ "&.Mui-selected": {
379
+ color: theme.vars.palette.primary.selected
380
+ }
381
+ },
382
+ "& button:nth-of-type(1) > span": {
383
+ ...getTypographyStyles(
384
+ theme.generalSettings.isMobile,
385
+ ownerState.size || "medium",
386
+ "body"
387
+ )
388
+ },
389
+ "& button:nth-of-type(2) > span": {
390
+ ...getTypographyStyles(
391
+ theme.generalSettings.isMobile,
392
+ ownerState.size || "medium",
393
+ "subtitle"
394
+ )
395
+ }
396
+ },
397
+ "& .MuiDateTimePickerToolbar-timeContainer": {
398
+ gap: theme.vars.size.baseSpacings.sp2,
399
+ "& button > span": {
400
+ color: theme.vars.palette.text.primary,
401
+ "&.Mui-selected": {
402
+ color: theme.vars.palette.primary.selected
403
+ }
404
+ },
405
+ "& .MuiDateTimePickerToolbar-timeDigitsContainer": {
406
+ alignItems: "center",
407
+ "& > button": {
408
+ height: "fit-content"
409
+ },
410
+ "& button:nth-of-type(1) > span, & button:nth-of-type(2) > span": {
411
+ ...getTypographyStyles(
412
+ theme.generalSettings.isMobile,
413
+ ownerState.size || "medium",
414
+ "subtitle"
415
+ )
416
+ }
417
+ },
418
+ "& .MuiDateTimePickerToolbar-separator": {
419
+ display: "flex",
420
+ justifyContent: "center",
421
+ alignSelf: "center",
422
+ ...getTypographyStyles(
423
+ theme.generalSettings.isMobile,
424
+ ownerState.size || "medium",
425
+ "subtitle"
426
+ )
427
+ },
428
+ "& .MuiDateTimePickerToolbar-ampmSelection": {
429
+ margin: 0,
430
+ display: "flex",
431
+ justifyContent: "center",
432
+ "& button:nth-of-type(1) > span, & button:nth-of-type(2) > span": {
433
+ display: "flex",
434
+ alignItems: "center",
435
+ ...getHeightSizeStyles(
436
+ theme.generalSettings.isMobile,
437
+ ownerState.size || "small",
438
+ "action",
439
+ (height) => ({
440
+ height,
441
+ minHeight: height,
442
+ maxHeight: height
443
+ })
444
+ ),
445
+ ...getTypographyStyles(
446
+ theme.generalSettings.isMobile,
447
+ ownerState.size || "medium",
448
+ "body"
449
+ )
450
+ }
451
+ }
452
+ }
453
+ }
454
+ },
455
+ // ↴ Overrides ❌
456
+ "& .MuiPickersLayout-contentWrapper": {
457
+ // ↴ Overrides Tabs ❌
458
+ "& .MuiTabs-root": {
459
+ height: "fit-content",
460
+ minHeight: "auto",
461
+ width: "fit-content",
462
+ boxShadow: "none",
463
+ background: theme.vars.palette.default.enabled,
464
+ paddingBottom: theme.vars.size.baseSpacings.sp0,
465
+ gap: theme.vars.size.baseSpacings.sp0,
466
+ borderRadius: theme.vars.size.borderRadius.r1,
467
+ borderBottomLeftRadius: theme.vars.size.borderRadius.r0,
468
+ borderBottomRightRadius: theme.vars.size.borderRadius.r0,
469
+ "& .MuiTab-root": {
470
+ border: theme.vars.size.borderStroke.container,
471
+ borderColor: theme.vars.palette.default.enabled,
472
+ borderTopLeftRadius: `calc(${theme.vars.size.borderRadius.r1} - 1px)`,
473
+ borderTopRightRadius: `calc(${theme.vars.size.borderRadius.r1} - 1px)`,
474
+ ...getHeightSizeStyles(
475
+ theme.generalSettings.isMobile,
476
+ ownerState.size || "small",
477
+ "container",
478
+ (height) => ({
479
+ minHeight: height,
480
+ height,
481
+ maxHeight: height,
482
+ minWidth: height,
483
+ width: height,
484
+ maxWidth: height
485
+ })
486
+ ),
487
+ "& .MuiTouchRipple-root": {
488
+ display: "none"
489
+ }
490
+ },
491
+ "& .MuiTab-root.Mui-selected": {
492
+ background: theme.vars.palette.background.default,
493
+ "&::after": {
494
+ content: '""',
495
+ width: "70%",
496
+ transform: "translateX(20%)",
497
+ height: theme.vars.size.borderRadius["r0-5"],
498
+ left: 0,
499
+ top: 0,
500
+ backgroundColor: ownerState.tabSkeleton ? theme.vars.palette.skeleton.default : ownerState.tabDisabled ? theme.vars.palette.text.disabled : theme.vars.palette.primary.main,
501
+ borderEndStartRadius: theme.vars.size.borderRadius["r1"],
502
+ borderEndEndRadius: theme.vars.size.borderRadius["r1"],
503
+ position: "absolute"
504
+ }
505
+ },
506
+ "& .MuiTabs-indicator": {
507
+ display: "none"
508
+ }
509
+ },
510
+ "& .MuiDateCalendar-root": {
511
+ display: "flex",
512
+ width: "fit-content",
513
+ height: "fit-content",
514
+ gap: theme.vars.size.baseSpacings.sp3,
515
+ padding: theme.vars.size.baseSpacings.sp3,
516
+ border: theme.vars.size.borderStroke.container,
517
+ borderRadius: theme.vars.size.borderRadius.r1,
518
+ borderTopLeftRadius: 0,
519
+ borderColor: theme.vars.palette.border.default,
520
+ margin: 0,
521
+ "& .MuiYearCalendar-root": {
522
+ // Fix en el height
523
+ height: "218px",
524
+ "& .MuiPickersYear-yearButton": {
525
+ margin: 0,
526
+ borderRadius: theme.vars.size.borderRadius.r1,
527
+ "&:hover": {
528
+ background: theme.vars.palette.default.hoverOpacity
529
+ },
530
+ "&:active": {
531
+ background: theme.vars.palette.default.active
532
+ },
533
+ "&.Mui-selected": {
534
+ background: theme.vars.palette.primary.enabled,
535
+ "&:hover": {
536
+ background: theme.vars.palette.primary.hover
537
+ },
538
+ "&:active": {
539
+ background: theme.vars.palette.primary.active
540
+ }
541
+ },
542
+ ...getHeightSizeStyles(
543
+ theme.generalSettings.isMobile,
544
+ ownerState.size || "small",
545
+ "action",
546
+ (height) => ({
547
+ minHeight: height,
548
+ height,
549
+ maxHeight: height
550
+ })
551
+ ),
552
+ ...getTypographyStyles(
553
+ theme.generalSettings.isMobile,
554
+ ownerState.size || "medium",
555
+ "body"
556
+ )
557
+ }
558
+ }
559
+ },
560
+ // ↴ Overrides ❌
561
+ "& .MuiDayCalendar-root": {
562
+ width: "fit-content",
563
+ padding: theme.vars.size.baseSpacings.sp2,
564
+ "& .MuiDayCalendar-header": {
565
+ display: "flex",
566
+ gap: theme.vars.size.baseSpacings.sp1,
567
+ "& .MuiTypography-root": {
568
+ margin: 0,
569
+ ...getTypographyStyles(
570
+ theme.generalSettings.isMobile,
571
+ ownerState.size || "medium",
572
+ "body"
573
+ ),
574
+ ...getHeightSizeStyles(
575
+ theme.generalSettings.isMobile,
576
+ ownerState.size || "small",
577
+ "action",
578
+ (height) => ({
579
+ minHeight: height,
580
+ height,
581
+ maxHeight: height,
582
+ minWidth: height,
583
+ width: height,
584
+ maxWidth: height
585
+ })
586
+ )
587
+ }
588
+ },
589
+ "& .MuiDayCalendar-weekContainer": {
590
+ display: "flex",
591
+ margin: 0,
592
+ paddingTop: theme.vars.size.baseSpacings.sp1,
593
+ gap: theme.vars.size.baseSpacings.sp1
594
+ }
595
+ },
596
+ "& .MuiTimeClock-root": {
597
+ width: "fit-content",
598
+ border: theme.vars.size.borderStroke.container,
599
+ borderRadius: theme.vars.size.borderRadius.r1,
600
+ borderColor: theme.vars.palette.border.default,
601
+ padding: theme.vars.size.baseSpacings.sp1,
602
+ "& .MuiClock-clock": {
603
+ background: theme.vars.palette.default.main
604
+ }
605
+ },
606
+ "& .MuiPickersArrowSwitcher-root": {
607
+ top: 0,
608
+ right: 0,
609
+ display: "flex",
610
+ alignSelf: "center",
611
+ position: "relative"
612
+ },
613
+ "& .MuiPickersLayout-actionBar": {
614
+ padding: `${theme.vars.size.baseSpacings.sp1} 0px`
615
+ }
616
+ },
617
+ // Estilos globales del MuiDialogActions-root 🌎
618
+ "& .MuiDialogActions-root": {
619
+ // ↴ Overrides ❌
620
+ "& .MuiButtonBase-root": {
621
+ margin: 0,
622
+ ...getHeightSizeStyles(
623
+ theme.generalSettings.isMobile,
624
+ ownerState.size || "small",
625
+ "action",
626
+ (height) => ({
627
+ minHeight: height,
628
+ height,
629
+ maxHeight: height,
630
+ minWidth: height
631
+ })
632
+ ),
633
+ ...getTypographyStyles(
634
+ theme.generalSettings.isMobile,
635
+ ownerState.size || "medium",
636
+ "body"
637
+ )
638
+ },
639
+ "& .MuiButtonBase-root:nth-of-type(1)": {
640
+ color: theme.vars.palette.text.secondary,
641
+ textTransform: "lowercase"
642
+ },
643
+ "& .MuiButtonBase-root:nth-of-type(2)": {
644
+ textTransform: "lowercase"
645
+ }
646
+ }
647
+ }),
648
+ /**
649
+ * Estilos de pickersDay de Mui x
650
+ * @author DanielEscobar - automatic
651
+ * @createdAt 2025-01-28 02:42:08 - automatic
652
+ * @updatedAt 2025-01-29 17:03:17 - automatic
653
+ * @updatedUser DanielEscobar - automatic
654
+ */
655
+ pickersDay: ({ theme, ownerState }) => ({
656
+ margin: 0,
657
+ borderRadius: theme.vars.size.borderRadius.r1,
658
+ "&:hover": {
659
+ background: theme.vars.palette.default.hoverOpacity
660
+ },
661
+ "&:active": {
662
+ background: theme.vars.palette.default.active
663
+ },
664
+ "&.Mui-selected": {
665
+ background: theme.vars.palette.primary.enabled,
666
+ "&:hover": {
667
+ background: theme.vars.palette.primary.hover
668
+ },
669
+ "&:active": {
670
+ background: theme.vars.palette.primary.active
671
+ }
672
+ },
673
+ ...getHeightSizeStyles(
674
+ theme.generalSettings.isMobile,
675
+ ownerState.size || "small",
676
+ "action",
677
+ (height) => ({
678
+ minHeight: height,
679
+ height,
680
+ maxHeight: height,
681
+ minWidth: height,
682
+ width: height,
683
+ maxWidth: height
684
+ })
685
+ )
686
+ }),
687
+ /**
688
+ *Estilos de pickersCalendarHeader de Mui x
689
+ * @author DanielEscobar - automatic
690
+ * @createdAt 2025-01-28 02:42:08 - automatic
691
+ * @updatedAt 2025-01-29 17:03:17 - automatic
692
+ * @updatedUser DanielEscobar - automatic
693
+ */
694
+ pickersCalendarHeader: ({ theme, ownerState }) => ({
695
+ display: "flex",
696
+ flexDirection: "row",
697
+ justifyContent: "space-between",
698
+ margin: 0,
699
+ padding: `0px ${theme.vars.size.baseSpacings.sp2}`,
700
+ "& .MuiPickersCalendarHeader-labelContainer": {
701
+ border: theme.vars.size.borderStroke.actionInput,
702
+ borderColor: theme.vars.palette.border.default,
703
+ ...getHeightSizeStyles(
704
+ theme.generalSettings.isMobile,
705
+ ownerState.size || "medium",
706
+ "action",
707
+ (height) => ({
708
+ height,
709
+ minHeight: height,
710
+ maxHeight: height
711
+ })
712
+ ),
713
+ margin: 0,
714
+ paddingLeft: theme.vars.size.baseSpacings.sp1,
715
+ borderRadius: theme.vars.size.borderRadius.r1,
716
+ "& .MuiPickersCalendarHeader-label": {
717
+ margin: 0,
718
+ paddingLeft: theme.vars.size.baseSpacings.sp1,
719
+ paddingRight: theme.vars.size.baseSpacings.sp3,
720
+ ...getTypographyStyles(
721
+ theme.generalSettings.isMobile,
722
+ ownerState.size || "medium",
723
+ "body"
724
+ )
725
+ }
726
+ }
727
+ }),
728
+ //Requerido para correccion de fix en tamaños ↴ Overrides ❌
729
+ iconButton: () => ({}),
730
+ /**
731
+ * estilos para el skeleton 🦴
732
+ * @author DanielEscobar - automatic
733
+ * @createdAt 2025-01-28 01:24:17 - automatic
734
+ * @updatedAt 2025-01-29 17:03:17 - automatic
735
+ * @updatedUser DanielEscobar - automatic
736
+ */
737
+ skeleton: ({ theme, ownerState }) => ({
738
+ ...getHeightSizeStyles(
739
+ theme.generalSettings.isMobile,
740
+ ownerState.size || "small",
741
+ "action",
742
+ (height) => ({
743
+ height,
744
+ minHeight: height,
745
+ maxHeight: height
746
+ })
747
+ )
748
+ })
749
+ };
750
+ export {
751
+ dateTimePickerStyles as d
752
+ };