@m4l/styles 6.4.0 → 6.5.1

package/theme/overrides/MUIComponents/Drawer.js

@@ -0,0 +1,44 @@
+import { alpha as o } from "@mui/material";
+function t(e) {
+  const r = e.colorSchemes.finalTheme.palette.mode === "light";
+  return {
+    MuiDrawer: {
+      styleOverrides: {
+        root: {
+          "&.M4LSideBar-drawer": {
+            test: "root",
+            "& .MuiPaper-root": {
+              background: e.vars.palette.background.surface,
+              display: "flex",
+              flexDirection: "row"
+            }
+            /*  "& .MuiPaper-root": {
+                                borderRadius: "4px",
+                                backgroundColor: theme.vars.palette.primary.primaryOpacity,
+                                padding: "8px",
+                            }, */
+          }
+        },
+        modal: {
+          '&[role="presentation"]': {
+            "& .MuiDrawer-paperAnchorLeft": {
+              boxShadow: `8px 24px 24px 12px ${o(
+                e.colorSchemes.finalTheme.palette.grey[900],
+                r ? 0.16 : 0.48
+              )}`
+            },
+            "& .MuiDrawer-paperAnchorRight": {
+              boxShadow: `-8px 24px 24px 12px ${o(
+                e.colorSchemes.finalTheme.palette.grey[900],
+                r ? 0.16 : 0.48
+              )}`
+            }
+          }
+        }
+      }
+    }
+  };
+}
+export {
+  t as D
+};

package/theme/overrides/MUIComponents/Fab.d.ts

@@ -1,5 +1,12 @@
 import { Theme, CssVarsTheme } from '@mui/material/styles';
-export default function Fab(theme: Omit<Theme, "palette" | "applyStyles"> & CssVarsTheme): {
+/**
+ * Skeleton overrides
+ * @author Juan Escobar - automatic
+ * @createdAt 2024-10-06 13:47:24 - automatic
+ * @updatedAt 2024-10-06 13:47:25 - automatic
+ * @updatedUser Juan Escobar - automatic
+ */
+export default function Fab(theme: Omit<Theme, 'palette' | 'applyStyles'> & CssVarsTheme): {
     MuiFab: {
         defaultProps: {
             color: string;

package/theme/overrides/MUIComponents/Fab.js

@@ -0,0 +1,38 @@
+function r(o) {
+  return {
+    MuiFab: {
+      defaultProps: {
+        color: "primary"
+      },
+      styleOverrides: {
+        root: {
+          boxShadow: o.customShadows?.z4,
+          "&:hover": {
+            boxShadow: "none",
+            backgroundColor: o.colorSchemes.finalTheme.palette.grey[400]
+          }
+        },
+        primary: {
+          boxShadow: o.customShadows?.primary,
+          "&:hover": {
+            backgroundColor: o.vars.palette.primary.dark
+          }
+        },
+        secondary: {
+          boxShadow: o.customShadows?.secondary,
+          "&:hover": {
+            backgroundColor: o.vars.palette.secondary.dark
+          }
+        },
+        extended: {
+          "& svg": {
+            marginRight: o.spacing(1)
+          }
+        }
+      }
+    }
+  };
+}
+export {
+  r as F
+};

package/theme/overrides/MUIComponents/IconButton.d.ts

@@ -1,5 +1,12 @@
 import { Theme, CssVarsTheme } from '@mui/material/styles';
-export default function IconButton(theme: Omit<Theme, "palette" | "applyStyles"> & CssVarsTheme): {
+/**
+ * IconButton overrides
+ * @author Juan Escobar - automatic
+ * @createdAt 2024-10-06 13:47:24 - automatic
+ * @updatedAt 2024-10-06 13:47:25 - automatic
+ * @updatedUser Juan Escobar - automatic
+ */
+export default function IconButton(theme: Omit<Theme, 'palette' | 'applyStyles'> & CssVarsTheme): {
     MuiIconButton: {
         styleOverrides: {
             root: {

package/theme/overrides/MUIComponents/IconButton.js

@@ -0,0 +1,33 @@
+function i(t) {
+  return {
+    MuiIconButton: {
+      // defaultProps: {
+      //   color: theme.vars.palette.text.primary,
+      // },
+      styleOverrides: {
+        root: {
+          "&.MuiIconButton-sizeSmall": {
+            height: t.spacing(3),
+            width: t.spacing(3),
+            margin: 0,
+            padding: 0,
+            " > svg": {
+              height: 20,
+              width: 20
+            },
+            "& .MuiBox-root": {
+              height: 20,
+              width: 20
+            }
+          }
+        }
+        // colorDefault: {
+        //   color: theme.vars.palette.text.primary,
+        // }
+      }
+    }
+  };
+}
+export {
+  i as I
+};

package/theme/overrides/MUIComponents/Input.d.ts

@@ -1,4 +1,11 @@
 import { Theme, CssVarsTheme } from '@mui/material/styles';
+/**
+ * Input overrides
+ * @author Juan Escobar - automatic
+ * @createdAt 2024-10-06 13:47:24 - automatic
+ * @updatedAt 2024-10-06 13:47:25 - automatic
+ * @updatedUser Juan Escobar - automatic
+ */
 export default function c(theme: Omit<Theme, 'palette' | 'applyStyles'> & CssVarsTheme): {
     MuiFormControl: {
         styleOverrides: {
@@ -22,7 +29,7 @@ export default function c(theme: Omit<Theme, 'palette' | 'applyStyles'> & CssVar
                         color: string;
                     };
                 };
-                '@font-face'?: import("@mui/material/styles/createTypography").Fontface | import("@mui/material/styles/createTypography").Fontface[] | undefined;
+                '@font-face'?: import('@mui/material/styles/createTypography').Fontface | import('@mui/material/styles/createTypography').Fontface[];
                 accentColor?: import("csstype").Property.AccentColor | undefined;
                 alignContent?: import("csstype").Property.AlignContent | undefined;
                 alignItems?: import("csstype").Property.AlignItems | undefined;
@@ -397,7 +404,7 @@ export default function c(theme: Omit<Theme, 'palette' | 'applyStyles'> & CssVar
                 writingMode?: import("csstype").Property.WritingMode | undefined;
                 zIndex?: import("csstype").Property.ZIndex | undefined;
                 zoom?: import("csstype").Property.Zoom | undefined;
-                all?: import("csstype").Globals | undefined;
+                all?: import("csstype").Property.All | undefined;
                 animation?: import("csstype").Property.Animation<string & {}> | undefined;
                 animationRange?: import("csstype").Property.AnimationRange<string | number> | undefined;
                 background?: import("csstype").Property.Background<string | number> | undefined;
@@ -908,7 +915,7 @@ export default function c(theme: Omit<Theme, 'palette' | 'applyStyles'> & CssVar
                         borderColor: string;
                     };
                 };
-                '@font-face'?: import("@mui/material/styles/createTypography").Fontface | import("@mui/material/styles/createTypography").Fontface[] | undefined;
+                '@font-face'?: import('@mui/material/styles/createTypography').Fontface | import('@mui/material/styles/createTypography').Fontface[];
                 accentColor?: import("csstype").Property.AccentColor | undefined;
                 alignContent?: import("csstype").Property.AlignContent | undefined;
                 alignItems?: import("csstype").Property.AlignItems | undefined;
@@ -1283,7 +1290,7 @@ export default function c(theme: Omit<Theme, 'palette' | 'applyStyles'> & CssVar
                 writingMode?: import("csstype").Property.WritingMode | undefined;
                 zIndex?: import("csstype").Property.ZIndex | undefined;
                 zoom?: import("csstype").Property.Zoom | undefined;
-                all?: import("csstype").Globals | undefined;
+                all?: import("csstype").Property.All | undefined;
                 animation?: import("csstype").Property.Animation<string & {}> | undefined;
                 animationRange?: import("csstype").Property.AnimationRange<string | number> | undefined;
                 background?: import("csstype").Property.Background<string | number> | undefined;

package/theme/overrides/MUIComponents/Input.js

@@ -0,0 +1,99 @@
+function r(o) {
+  return {
+    MuiFormControl: {
+      styleOverrides: {
+        root: {
+          height: "28px",
+          [o.breakpoints.down("sm")]: {
+            height: 32,
+            minHeight: 32
+          }
+        }
+      }
+    },
+    MuiInputBase: {
+      styleOverrides: {
+        root: {
+          height: "auto",
+          backgroundColor: o.vars.palette.background?.default,
+          ...o.colorSchemes.finalTheme.typography.body2,
+          borderRadius: "2px",
+          padding: "4px",
+          paddingBottom: "0px",
+          "&.Mui-disabled": {
+            "& svg": { color: o.vars.palette.text.disabled }
+          }
+        },
+        input: {
+          padding: "0",
+          "&::placeholder": {
+            opacity: 1,
+            color: o.vars.palette.text.disabled
+          }
+        }
+      }
+    },
+    /* Style input outline */
+    MuiInput: {
+      styleOverrides: {
+        underline: {
+          "&:before": {
+            borderBottomColor: o.vars.palette?.border?.default
+          }
+        }
+      }
+    },
+    MuiFilledInput: {
+      styleOverrides: {
+        root: {
+          backgroundColor: o.vars.palette?.border?.default,
+          "&:hover": {
+            backgroundColor: o.vars.palette?.border?.default
+          },
+          "&.Mui-focused": {
+            backgroundColor: o.vars.palette.action.focus
+          },
+          "&.Mui-disabled": {
+            backgroundColor: o.vars.palette.action.disabledBackground
+          }
+        },
+        underline: {
+          "&:before": {
+            borderBottomColor: o.vars.palette?.border?.default
+          }
+        }
+      }
+    },
+    /* Estilos variante outlined */
+    MuiOutlinedInput: {
+      styleOverrides: {
+        root: {
+          ...o.colorSchemes.finalTheme.typography.body2,
+          color: o.vars.palette.text.primary,
+          "& > input": {
+            padding: o.spacing(1.5, 1.5)
+          },
+          "& .MuiOutlinedInput-notchedOutline": {
+            borderColor: o.vars.palette?.border?.default,
+            fontSize: "0.875rem",
+            height: "auto",
+            minHeight: "24px",
+            padding: "0px",
+            [o.breakpoints.down("sm")]: {
+              height: "auto",
+              minHeight: "32px"
+            }
+          },
+          "&.Mui-disabled": {
+            "& .MuiOutlinedInput-notchedOutline": {
+              borderColor: o.vars.palette.action.disabledBackground
+            }
+          }
+        }
+      }
+    }
+  };
+}
+export {
+  r as c
+};

package/theme/overrides/MUIComponents/InputLabel.d.ts

@@ -1,5 +1,12 @@
 import { Theme, CssVarsTheme } from '@mui/material/styles';
-export default function InputLabel(_theme: Omit<Theme, "palette" | "applyStyles"> & CssVarsTheme): {
+/**
+ * InputLabel overrides
+ * @author Juan Escobar - automatic
+ * @createdAt 2024-10-06 13:47:24 - automatic
+ * @updatedAt 2024-10-06 13:47:25 - automatic
+ * @updatedUser Juan Escobar - automatic
+ */
+export default function InputLabel(_theme: Omit<Theme, 'palette' | 'applyStyles'> & CssVarsTheme): {
     MuiInputLabel: {
         styleOverrides: {
             shrink: {

package/theme/overrides/MUIComponents/InputLabel.js

@@ -0,0 +1,18 @@
+function e(t) {
+  return {
+    MuiInputLabel: {
+      styleOverrides: {
+        shrink: {
+          transform: "translate(14px, -9px) scale(0.75)!important"
+        },
+        outlined: {
+          transform: "translate(14px, 12px) scale(1)",
+          fontSize: 12
+        }
+      }
+    }
+  };
+}
+export {
+  e as I
+};

package/theme/overrides/MUIComponents/Link.d.ts

@@ -1,5 +1,12 @@
 import { Theme, CssVarsTheme } from '@mui/material/styles';
-export default function Link(theme: Omit<Theme, "palette" | "applyStyles"> & CssVarsTheme): {
+/**
+ * Link overrides
+ * @author Juan Escobar - automatic
+ * @createdAt 2024-10-06 13:47:24 - automatic
+ * @updatedAt 2024-10-06 13:47:25 - automatic
+ * @updatedUser Juan Escobar - automatic
+ */
+export default function Link(theme: Omit<Theme, 'palette' | 'applyStyles'> & CssVarsTheme): {
     MuiLink: {
         defaultProps: {
             underline: string;

package/theme/overrides/MUIComponents/Link.js

@@ -0,0 +1,19 @@
+function r(e) {
+  return {
+    MuiLink: {
+      defaultProps: {
+        underline: "hover"
+      },
+      styleOverrides: {
+        root: {
+          "&.MuiLink-underlineHover": {
+            textDecorationColor: e.vars.palette.primary.main
+          }
+        }
+      }
+    }
+  };
+}
+export {
+  r as L
+};

package/theme/overrides/MUIComponents/List.d.ts

@@ -1,5 +1,12 @@
 import { Theme, CssVarsTheme } from '@mui/material/styles';
-export default function List(theme: Omit<Theme, "palette" | "applyStyles"> & CssVarsTheme): {
+/**
+ * List overrides
+ * @author Juan Escobar - automatic
+ * @createdAt 2024-10-06 13:47:24 - automatic
+ * @updatedAt 2024-10-06 13:47:25 - automatic
+ * @updatedUser Juan Escobar - automatic
+ */
+export default function List(theme: Omit<Theme, 'palette' | 'applyStyles'> & CssVarsTheme): {
     MuiListItemIcon: {
         styleOverrides: {
             root: {

package/theme/overrides/MUIComponents/List.js

@@ -0,0 +1,36 @@
+function t(i) {
+  return {
+    MuiListItemIcon: {
+      styleOverrides: {
+        root: {
+          color: "inherit",
+          minWidth: "auto",
+          marginRight: i.spacing(2)
+        }
+      }
+    },
+    MuiListItemAvatar: {
+      styleOverrides: {
+        root: {
+          minWidth: "auto",
+          marginRight: i.spacing(2)
+        }
+      }
+    },
+    MuiListItemText: {
+      styleOverrides: {
+        root: {
+          marginTop: 0,
+          marginBottom: 0
+        },
+        multiline: {
+          marginTop: 0,
+          marginBottom: 0
+        }
+      }
+    }
+  };
+}
+export {
+  t as L
+};

package/theme/overrides/MUIComponents/LoadingButton.d.ts

@@ -1,5 +1,12 @@
 import { Theme, CssVarsTheme } from '@mui/material/styles';
-export default function LoadingButton(theme: Omit<Theme, "palette" | "applyStyles"> & CssVarsTheme): {
+/**
+ * LoadingButton overrides
+ * @author Juan Escobar - automatic
+ * @createdAt 2024-10-06 13:47:24 - automatic
+ * @updatedAt 2024-10-06 13:47:25 - automatic
+ * @updatedUser Juan Escobar - automatic
+ */
+export default function LoadingButton(theme: Omit<Theme, 'palette' | 'applyStyles'> & CssVarsTheme): {
     MuiLoadingButton: {
         styleOverrides: {
             root: {
@@ -7,7 +14,7 @@ export default function LoadingButton(theme: Omit<Theme, "palette" | "applyStyle
                     '& .MuiCircularProgress-root': {
                         color: string;
                     };
-                    '@font-face'?: import("@mui/material/styles/createTypography").Fontface | import("@mui/material/styles/createTypography").Fontface[] | undefined;
+                    '@font-face'?: import('@mui/material/styles/createTypography').Fontface | import('@mui/material/styles/createTypography').Fontface[];
                     accentColor?: import("csstype").Property.AccentColor | undefined;
                     alignContent?: import("csstype").Property.AlignContent | undefined;
                     alignItems?: import("csstype").Property.AlignItems | undefined;
@@ -383,7 +390,7 @@ export default function LoadingButton(theme: Omit<Theme, "palette" | "applyStyle
                     writingMode?: import("csstype").Property.WritingMode | undefined;
                     zIndex?: import("csstype").Property.ZIndex | undefined;
                     zoom?: import("csstype").Property.Zoom | undefined;
-                    all?: import("csstype").Globals | undefined;
+                    all?: import("csstype").Property.All | undefined;
                     animation?: import("csstype").Property.Animation<string & {}> | undefined;
                     animationRange?: import("csstype").Property.AnimationRange<string | number> | undefined;
                     background?: import("csstype").Property.Background<string | number> | undefined;

package/theme/overrides/MUIComponents/LoadingButton.js

@@ -0,0 +1,27 @@
+function o(t) {
+  return {
+    MuiLoadingButton: {
+      styleOverrides: {
+        root: {
+          "&.MuiLoadingButton-root": {
+            ...t.colorSchemes.finalTheme.typography.subtitle2,
+            "& .MuiCircularProgress-root": {
+              color: t.vars.palette.primary.main
+            }
+          },
+          "&.MuiButton-text": {
+            "& .MuiLoadingButton-startIconPendingStart": {
+              marginLeft: 0
+            },
+            "& .MuiLoadingButton-endIconPendingEnd": {
+              marginRight: 0
+            }
+          }
+        }
+      }
+    }
+  };
+}
+export {
+  o as L
+};

package/theme/overrides/MUIComponents/Menu.d.ts

@@ -1,5 +1,12 @@
 import { Theme, CssVarsTheme } from '@mui/material/styles';
-export default function Menu(theme: Omit<Theme, "palette" | "applyStyles"> & CssVarsTheme): {
+/**
+ * Menu overrides
+ * @author Juan Escobar - automatic
+ * @createdAt 2024-10-06 13:47:24 - automatic
+ * @updatedAt 2024-10-06 13:47:25 - automatic
+ * @updatedUser Juan Escobar - automatic
+ */
+export default function Menu(theme: Omit<Theme, 'palette' | 'applyStyles'> & CssVarsTheme): {
     MuiMenuItem: {
         styleOverrides: {
             root: {

package/theme/overrides/MUIComponents/Menu.js

@@ -0,0 +1,20 @@
+function r(e) {
+  return {
+    MuiMenuItem: {
+      styleOverrides: {
+        root: {
+          borderRadius: "4px",
+          "&.Mui-selected": {
+            backgroundColor: e.vars.palette.action.selected,
+            "&:hover": {
+              backgroundColor: e.vars.palette.action.hover
+            }
+          }
+        }
+      }
+    }
+  };
+}
+export {
+  r as M
+};

package/theme/overrides/MUIComponents/Pagination.d.ts

@@ -1,4 +1,11 @@
 import { Theme, CssVarsTheme } from '@mui/material/styles';
+/**
+ * Pagination overrides
+ * @author Juan Escobar - automatic
+ * @createdAt 2024-10-06 13:47:24 - automatic
+ * @updatedAt 2024-10-06 13:47:25 - automatic
+ * @updatedUser Juan Escobar - automatic
+ */
 export default function Pagination(theme: Omit<Theme, 'palette' | 'applyStyles'> & CssVarsTheme): {
     MuiPaginationItem: {
         styleOverrides: {

package/theme/overrides/MUIComponents/Pagination.js

@@ -0,0 +1,38 @@
+import { alpha as e } from "@mui/material/styles";
+function a(r) {
+  return {
+    MuiPaginationItem: {
+      styleOverrides: {
+        root: {
+          "&.Mui-selected": {
+            fontWeight: r.typography.fontWeightBold
+          }
+        },
+        textPrimary: {
+          "&.Mui-selected": {
+            color: r.vars.palette.primary.main,
+            backgroundColor: e(r.colorSchemes.finalTheme.palette.primary.main, 0.08),
+            "&:hover, &.Mui-focusVisible": {
+              backgroundColor: `${e(
+                r.colorSchemes.finalTheme.palette.primary.main,
+                0.24
+              )} !important`
+            }
+          }
+        },
+        outlined: {
+          border: `1px solid ${r.vars.palette?.border.default}`
+        },
+        outlinedPrimary: {
+          "&.Mui-selected": {
+            backgroundColor: e(r.colorSchemes.finalTheme.palette.primary.main, 0.08),
+            border: `1px solid ${e(r.colorSchemes.finalTheme.palette.primary.main, 0.24)}`
+          }
+        }
+      }
+    }
+  };
+}
+export {
+  a as P
+};

package/theme/overrides/MUIComponents/Paper.d.ts

@@ -1,4 +1,11 @@
 import { Theme, CssVarsTheme } from '@mui/material/styles';
+/**
+ * Paper overrides
+ * @author Juan Escobar - automatic
+ * @createdAt 2024-10-06 13:47:24 - automatic
+ * @updatedAt 2024-10-06 13:47:25 - automatic
+ * @updatedUser Juan Escobar - automatic
+ */
 export default function Paper(theme: Omit<Theme, 'palette' | 'applyStyles'> & CssVarsTheme): {
     MuiPaper: {
         defaultProps: {

package/theme/overrides/MUIComponents/Paper.js

@@ -0,0 +1,71 @@
+function r(o) {
+  return {
+    MuiPaper: {
+      defaultProps: {
+        elevation: 0
+      },
+      variants: [
+        {
+          props: { variant: "outlined" },
+          style: { borderColor: o.vars.palette?.border.default }
+        }
+      ],
+      styleOverrides: {
+        root: {
+          backgroundImage: "none",
+          backgroundColor: o.vars.palette.background.default,
+          borderRadius: "2px",
+          /* Stack */
+          "& .MuiStack-root .MuiMenuItem-root": {
+            color: o.vars.palette.text.primary,
+            transition: "all .5s",
+            borderRadius: "4px",
+            ...o.colorSchemes.finalTheme.typography.action
+          },
+          "& .MuiStack-root .MuiMenuItem-root:hover": {
+            color: o.vars.palette.primary?.hover,
+            transition: "all .5s",
+            backgroundColor: o.vars.palette.primary.opacity
+          },
+          "& .MuiStack-root .MuiMenuItem-root.Mui-selected": {
+            color: o.vars.palette.primary.focusActive,
+            transition: "all .5s",
+            backgroundColor: o.vars.palette.primary.opacity
+          },
+          "& .MuiStack-root .MuiMenuItem-root:focus": {
+            color: o.vars.palette.primary.focusActive,
+            transition: "all .5s",
+            backgroundColor: o.vars.palette.background.default,
+            boxShadow: `0 0 0 1px ${o.vars.palette.primary.focusActive}`
+          },
+          /* Autocomplete Listbox */
+          "& .MuiAutocomplete-listbox .MuiAutocomplete-option": {
+            color: o.vars.palette.text.primary,
+            transition: "all .5s",
+            borderRadius: "4px",
+            ...o.colorSchemes.finalTheme.typography.action
+          },
+          "& .MuiAutocomplete-listbox .MuiAutocomplete-option:hover": {
+            color: o.vars.palette.primary?.hover,
+            transition: "all .5s",
+            backgroundColor: o.vars.palette.primary.opacity
+          },
+          "& .MuiAutocomplete-listbox .MuiAutocomplete-option.Mui-selected": {
+            color: o.vars.palette.primary.focusActive,
+            transition: "all .5s",
+            backgroundColor: o.vars.palette.primary.opacity
+          },
+          "& .MuiAutocomplete-listbox .MuiAutocomplete-option:active": {
+            color: o.vars.palette.primary.focusActive,
+            transition: "all .5s",
+            backgroundColor: o.vars.palette.background.default,
+            boxShadow: `0 0 0 1px ${o.vars.palette.primary.focusActive}`
+          }
+        }
+      }
+    }
+  };
+}
+export {
+  r as P
+};

package/theme/overrides/MUIComponents/Popover.d.ts

@@ -1,5 +1,12 @@
 import { Theme, CssVarsTheme } from '@mui/material/styles';
-export default function Popover(_theme: Omit<Theme, "palette" | "applyStyles"> & CssVarsTheme): {
+/**
+ * Popover overrides
+ * @author Juan Escobar - automatic
+ * @createdAt 2024-10-06 13:47:24 - automatic
+ * @updatedAt 2024-10-06 13:47:25 - automatic
+ * @updatedUser Juan Escobar - automatic
+ */
+export default function Popover(_theme: Omit<Theme, 'palette' | 'applyStyles'> & CssVarsTheme): {
     MuiPopover: {
         styleOverrides: {
             paper: {};