@m4l/styles 7.1.13 → 7.1.14-beta.4

package/theme/overrides/M4LRHFComponents/M4LRHFAutocompleteAsync.js

@@ -1,13 +1,15 @@
-const e = (t) => ({
-  M4LRHFAutocompleteAsync: {
-    styleOverrides: {
-      "&.M4LRHFAutocompleteAsync-root": {
-        width: "100%",
-        height: "auto"
+const M4LRHFAutocompleteAsync = (_theme) => {
+  return {
+    M4LRHFAutocompleteAsync: {
+      styleOverrides: {
+        "&.M4LRHFAutocompleteAsync-root": {
+          width: "100%",
+          height: "auto"
+        }
       }
     }
-  }
-});
+  };
+};
 export {
-  e as M
+  M4LRHFAutocompleteAsync as M
 };

package/theme/overrides/M4LRHFComponents/M4LRHFCheckbox.js

@@ -1,80 +1,82 @@
-const i = (o) => ({
-  M4LRHFCheckbox: {
-    styleOverrides: {
-      "&.M4LRHFCheckbox-root": {
-        display: "flex",
-        flexDirection: "column",
-        width: "100%",
-        [o.breakpoints.down("sm")]: {
-          "& .M4LRHFCheckbox-checkTypography": {
-            "& .M4LCheckBox-root": {
-              "& .MuiButtonBase-root": {
-                "& .MuiSvgIcon-fontSizeSmall": {
-                  height: "20px",
-                  width: "20px"
+const M4LRHFCheckbox = (theme) => {
+  return {
+    M4LRHFCheckbox: {
+      styleOverrides: {
+        "&.M4LRHFCheckbox-root": {
+          display: "flex",
+          flexDirection: "column",
+          width: "100%",
+          [theme.breakpoints.down("sm")]: {
+            "& .M4LRHFCheckbox-checkTypography": {
+              "& .M4LCheckBox-root": {
+                "& .MuiButtonBase-root": {
+                  "& .MuiSvgIcon-fontSizeSmall": {
+                    height: "20px",
+                    width: "20px"
+                  }
                 }
               }
             }
+          },
+          ".M4LRHFCheckbox-checkTypography": {
+            display: "flex",
+            gap: theme.spacing(2),
+            [theme.breakpoints.down("sm")]: {
+              gap: theme.spacing(1),
+              ...theme.colorSchemes.finalTheme.typography.paragraph
+            }
+          },
+          "& .MuiTypography-root": {
+            color: theme.vars.palette.text.primary,
+            ...theme.colorSchemes.finalTheme.typography.body
+          },
+          /* caso small */
+          ".M4LRHFCheckbox-small .MuiButtonBase-root": {
+            width: "20px",
+            height: "20px"
+          },
+          ".MuiCheckbox-root .MuiSvgIcon-fontSizeSmall": {
+            width: "16px",
+            height: "16px"
+          },
+          /* caso medium */
+          ".M4LRHFCheckbox-medium .MuiButtonBase-root": {
+            width: "24px",
+            height: "24px"
+          },
+          ".MuiCheckbox-root .MuiSvgIcon-fontSizeMedium": {
+            width: "20px",
+            height: "20px"
+          },
+          ".MuiButtonBase-root": {
+            borderRadius: "4px"
+          },
+          ".MuiButtonBase-root:hover": {
+            backgroundColor: theme.vars.palette.primary.opacity
+          },
+          ".Mui-focusVisible": {
+            border: "1px solid",
+            borderColor: theme.vars.palette.primary.active
+          },
+          ".MuiButtonBase-root:hover .MuiSvgIcon-root": {
+            fill: theme.vars.palette.primary?.hover
+          },
+          /* caso general */
+          ".M4LRHFCheckbox-checkTypography .MuiTypography-root": {
+            ...theme.colorSchemes.finalTheme.typography.body
+          },
+          ".M4LRHFCheckbox-stateDisabled .MuiSvgIcon-root": {
+            fill: theme.vars.palette.background?.default
+          },
+          /* selector del caso focus por tab */
+          ".MuiButtonBase-root .Mui-focusVisible:focus-visible": {
+            outline: "#FFF00"
           }
-        },
-        ".M4LRHFCheckbox-checkTypography": {
-          display: "flex",
-          gap: o.spacing(2),
-          [o.breakpoints.down("sm")]: {
-            gap: o.spacing(1),
-            ...o.colorSchemes.finalTheme.typography.paragraph
-          }
-        },
-        "& .MuiTypography-root": {
-          color: o.vars.palette.text.primary,
-          ...o.colorSchemes.finalTheme.typography.body
-        },
-        /* caso small */
-        ".M4LRHFCheckbox-small .MuiButtonBase-root": {
-          width: "20px",
-          height: "20px"
-        },
-        ".MuiCheckbox-root .MuiSvgIcon-fontSizeSmall": {
-          width: "16px",
-          height: "16px"
-        },
-        /* caso medium */
-        ".M4LRHFCheckbox-medium .MuiButtonBase-root": {
-          width: "24px",
-          height: "24px"
-        },
-        ".MuiCheckbox-root .MuiSvgIcon-fontSizeMedium": {
-          width: "20px",
-          height: "20px"
-        },
-        ".MuiButtonBase-root": {
-          borderRadius: "4px"
-        },
-        ".MuiButtonBase-root:hover": {
-          backgroundColor: o.vars.palette.primary.opacity
-        },
-        ".Mui-focusVisible": {
-          border: "1px solid",
-          borderColor: o.vars.palette.primary.active
-        },
-        ".MuiButtonBase-root:hover .MuiSvgIcon-root": {
-          fill: o.vars.palette.primary?.hover
-        },
-        /* caso general */
-        ".M4LRHFCheckbox-checkTypography .MuiTypography-root": {
-          ...o.colorSchemes.finalTheme.typography.body
-        },
-        ".M4LRHFCheckbox-stateDisabled .MuiSvgIcon-root": {
-          fill: o.vars.palette.background?.default
-        },
-        /* selector del caso focus por tab */
-        ".MuiButtonBase-root .Mui-focusVisible:focus-visible": {
-          outline: "#FFF00"
         }
       }
     }
-  }
-});
+  };
+};
 export {
-  i as M
+  M4LRHFCheckbox as M
 };

package/theme/overrides/M4LRHFComponents/M4LRHFColorPicker.js

@@ -1,133 +1,135 @@
-const r = (o) => ({
-  M4LRHFColorPicker: {
-    styleOverrides: {
-      "&.M4LRHFColorPicker-root": {
-        width: "100%",
-        display: "flex",
-        flexDirection: "column",
-        gap: "4px",
-        outline: "unset",
-        "&.M4LRHFColorPicker-sizeSmall": {
-          "& .M4LRHFColorPicker-containerFieldColor": {
-            "& .M4LRHFColorPicker-boxColor": {
-              width: "20px",
-              height: "20px"
+const M4LRHFColorPicker = (theme) => {
+  return {
+    M4LRHFColorPicker: {
+      styleOverrides: {
+        "&.M4LRHFColorPicker-root": {
+          width: "100%",
+          display: "flex",
+          flexDirection: "column",
+          gap: "4px",
+          outline: "unset",
+          "&.M4LRHFColorPicker-sizeSmall": {
+            "& .M4LRHFColorPicker-containerFieldColor": {
+              "& .M4LRHFColorPicker-boxColor": {
+                width: "20px",
+                height: "20px"
+              }
             }
-          }
-        },
-        "&.M4LRHFColorPicker-sizeMedium": {
+          },
+          "&.M4LRHFColorPicker-sizeMedium": {
+            "& .M4LRHFColorPicker-containerFieldColor": {
+              "& .M4LRHFColorPicker-boxColor": {
+                width: "24px",
+                height: "24px"
+              }
+            }
+          },
+          "& .M4LRHFColorPicker-skeleton": {
+            borderRadius: "4px"
+          },
           "& .M4LRHFColorPicker-containerFieldColor": {
+            display: "flex",
+            aligItems: "center",
+            justifyContent: "center",
+            gap: "4px",
+            padding: "2px",
+            border: "1.5px solid",
+            borderColor: theme.vars.palette?.border.default,
+            borderRadius: "4px",
+            width: "fit-content",
             "& .M4LRHFColorPicker-boxColor": {
-              width: "24px",
-              height: "24px"
+              cursor: "pointer"
+            },
+            /* '& .M4LIcon-root': {
+                            minHeight: '18px',
+                            minWidth: '18px',
+                            cursor: 'pointer',
+                            borderRadius: '4px',
+                        }, */
+            "& .M4LIcon-root:hover": {
+              background: theme.vars.palette.background.hover
             }
           }
-        },
-        "& .M4LRHFColorPicker-skeleton": {
-          borderRadius: "4px"
-        },
-        "& .M4LRHFColorPicker-containerFieldColor": {
-          display: "flex",
-          aligItems: "center",
-          justifyContent: "center",
-          gap: "4px",
-          padding: "2px",
-          border: "1.5px solid",
-          borderColor: o.vars.palette?.border.default,
-          borderRadius: "4px",
-          width: "fit-content",
-          "& .M4LRHFColorPicker-boxColor": {
-            cursor: "pointer"
-          },
-          /* '& .M4LIcon-root': {
-                          minHeight: '18px',
-                          minWidth: '18px',
-                          cursor: 'pointer',
-                          borderRadius: '4px',
-                      }, */
-          "& .M4LIcon-root:hover": {
-            background: o.vars.palette.background.hover
-          }
         }
       }
-    }
-  },
-  M4LRHFColorPickerPopoverRoot: {
-    styleOverrides: {
-      "&.M4LRHFColorPicker-popoverRoot": {
-        "& .MuiPaper-root": {
-          background: o.vars.palette.background.default,
-          padding: "8px",
-          border: "1px solid",
-          borderColor: o.vars.palette?.border.secondary,
-          borderRadius: "4px",
-          boxShadow: o.vars.customShadows.z4,
-          test: "root",
-          "& .M4LRHFColorPicker-containerPicker": {
-            background: "transparent",
+    },
+    M4LRHFColorPickerPopoverRoot: {
+      styleOverrides: {
+        "&.M4LRHFColorPicker-popoverRoot": {
+          "& .MuiPaper-root": {
+            background: theme.vars.palette.background.default,
+            padding: "8px",
+            border: "1px solid",
+            borderColor: theme.vars.palette?.border.secondary,
             borderRadius: "4px",
-            display: "flex",
-            flexDirection: "column",
-            alignItems: "flex-end",
-            gap: "24px",
-            "& .sketch-picker": {
-              background: "transparent !important",
-              boxShadow: "none !important",
-              padding: "12px !important",
+            boxShadow: theme.vars.customShadows.z4,
+            test: "root",
+            "& .M4LRHFColorPicker-containerPicker": {
+              background: "transparent",
+              borderRadius: "4px",
               display: "flex",
               flexDirection: "column",
-              gap: "8px",
-              border: "1px solid",
-              borderColor: o.vars.palette?.border.secondary,
-              borderRadius: "4px",
-              backgroundColor: o.vars.palette.background.default,
-              "& :nth-of-type(-n + 1)": {
-                borderRadius: "4px"
-              },
-              "& .flexbox-fix": {
-                border: "none !important",
+              alignItems: "flex-end",
+              gap: "24px",
+              "& .sketch-picker": {
                 background: "transparent !important",
-                "& > div": {
+                boxShadow: "none !important",
+                padding: "12px !important",
+                display: "flex",
+                flexDirection: "column",
+                gap: "8px",
+                border: "1px solid",
+                borderColor: theme.vars.palette?.border.secondary,
+                borderRadius: "4px",
+                backgroundColor: theme.vars.palette.background.default,
+                "& :nth-of-type(-n + 1)": {
+                  borderRadius: "4px"
+                },
+                "& .flexbox-fix": {
+                  border: "none !important",
+                  background: "transparent !important",
                   "& > div": {
-                    display: "flex",
-                    flexDirection: "column-reverse",
-                    ...o.colorSchemes.finalTheme.typography.body,
-                    color: o.vars.palette.text.secondary,
-                    gap: "2px",
-                    padding: "0 important",
-                    "& > input": {
+                    "& > div": {
                       display: "flex",
-                      textAlign: "center !important",
-                      border: "1px solid",
-                      borderColor: o.vars.palette?.border.default,
-                      borderRadius: "2px",
-                      background: "transparent",
-                      minHeight: "24px",
-                      height: "24px !important",
-                      ...o.colorSchemes.finalTheme.typography.body,
-                      color: `${o.vars.palette.text.primary} !important`
-                    },
-                    "& > label": {
-                      display: "flex",
-                      textAlign: "left !important",
-                      ...o.colorSchemes.finalTheme.typography.body,
-                      color: `${o.vars.palette.text.secondary} !important`,
-                      padding: "0 !important"
+                      flexDirection: "column-reverse",
+                      ...theme.colorSchemes.finalTheme.typography.body,
+                      color: theme.vars.palette.text.secondary,
+                      gap: "2px",
+                      padding: "0 important",
+                      "& > input": {
+                        display: "flex",
+                        textAlign: "center !important",
+                        border: "1px solid",
+                        borderColor: theme.vars.palette?.border.default,
+                        borderRadius: "2px",
+                        background: "transparent",
+                        minHeight: "24px",
+                        height: "24px !important",
+                        ...theme.colorSchemes.finalTheme.typography.body,
+                        color: `${theme.vars.palette.text.primary} !important`
+                      },
+                      "& > label": {
+                        display: "flex",
+                        textAlign: "left !important",
+                        ...theme.colorSchemes.finalTheme.typography.body,
+                        color: `${theme.vars.palette.text.secondary} !important`,
+                        padding: "0 !important"
+                      }
                     }
                   }
                 }
+              },
+              "& .M4LButton-root": {
+                display: "flex",
+                justifyContent: "right"
               }
-            },
-            "& .M4LButton-root": {
-              display: "flex",
-              justifyContent: "right"
             }
           }
         }
       }
     }
-  }
-});
+  };
+};
 export {
-  r as M
+  M4LRHFColorPicker as M
 };