@m4l/styles 0.0.21 → 0.0.22

package/theme/overrides/M4LRHFComponents/M4LRHFAutocomplete.d.ts

@@ -3,10 +3,70 @@ export declare const M4LRHFAutocomplete: (theme: Theme) => {
     M4LRHFAutocomplete: {
         styleOverrides: {
             '&.M4LRHFAutocomplete-root': {
+                height: string;
                 display: string;
                 flexDirection: string;
                 width: string;
                 gap: string;
+                '& .MuiAutocomplete-root': {
+                    height: string;
+                    '& .MuiFormControl-root': {
+                        height: string;
+                        '& .MuiInputBase-root': {
+                            position: string;
+                            height: string;
+                            '& .MuiInputBase-input': {
+                                boxSizing: string;
+                                color: string;
+                                backgroundColor: string;
+                                height: string;
+                                padding: string;
+                            };
+                            '& .M4LRHFAutocomplete-iconDown': {};
+                            '& .MuiOutlinedInput-notchedOutline': {
+                                inset: string;
+                                height: string;
+                                '& legend': {
+                                    display: string;
+                                };
+                            };
+                        };
+                    };
+                };
+                '& .M4LRHFAutocomplete-skeletonRoot': {
+                    display: string;
+                    flexDirection: string;
+                    gap: string;
+                    width: string;
+                    '& .M4LRHFAutocomplete-skeleton': {
+                        [x: string]: string | {
+                            width: string;
+                            height?: undefined;
+                            overflow?: undefined;
+                            margin?: undefined;
+                        } | {
+                            width: string;
+                            height: string;
+                            overflow: string;
+                            margin: string;
+                        };
+                        width: string;
+                        display: string;
+                        justifyContent: string;
+                        alignItems: string;
+                        height: string;
+                        border: string;
+                        borderRadius: string;
+                        padding: string;
+                        overflow: string;
+                        '& .M4LRHFAutocomplete-skeletonContainerText': {
+                            width: string;
+                            height: string;
+                            overflow: string;
+                            margin: string;
+                        };
+                    };
+                };
                 "& .MuiAutocomplete-root .MuiFormControl-root .MuiInputBase-root": {
                     padding: string;
                 };
@@ -20,30 +80,6 @@ export declare const M4LRHFAutocomplete: (theme: Theme) => {
                 '& .MuiAutocomplete-root .MuiInputBase-root': {
                     padding: string;
                     heigth: string;
-                    '& .MuiInputBase-input': {
-                        heigth: string;
-                        color: string;
-                        padding: string;
-                        backgroundColor: string;
-                    };
-                    '& .MuiInputAdornment-root': {
-                        margin: string;
-                        padding: string;
-                    };
-                    '& .M4LIcon-icon': {
-                        backgroundColor: string;
-                        transition: string;
-                    };
-                    '& .MuiOutlinedInput-notchedOutline': {
-                        border: string;
-                        borderColor: string;
-                        borderRadius: string;
-                        inset: string;
-                        transition: string;
-                        '& legend': {
-                            display: string;
-                        };
-                    };
                 };
                 '&:hover': {
                     '& .M4LRHFAutocomplete-label': {
@@ -120,15 +156,13 @@ export declare const M4LRHFAutocomplete: (theme: Theme) => {
                     };
                 };
                 '&.M4LRHFAutocomplete-sizeSmall': {
-                    '& .MuiInputBase-input, & .MuiOutlinedInput-notchedOutline, & .M4LRHFAutocomplete-skeleton': {
-                        heigth: string;
-                        padding: string;
+                    "& .M4LRHFAutocomplete-skeleton,\n                          & .MuiAutocomplete-root": {
+                        height: string;
                     };
                 };
                 '&.M4LRHFAutocomplete-sizeMedium': {
-                    '& .MuiInputBase-input, & .MuiOutlinedInput-notchedOutline, & .M4LRHFAutocomplete-skeleton': {
-                        heigth: string;
-                        padding: string;
+                    "& .M4LRHFAutocomplete-skeleton,\n                          & .MuiAutocomplete-root": {
+                        height: string;
                     };
                 };
             };

package/theme/overrides/M4LRHFComponents/M4LRHFAutocompleteAsync.d.ts

@@ -4,6 +4,7 @@ export declare const M4LRHFAutocompleteAsync: (_theme: Theme) => {
         styleOverrides: {
             '&.M4LRHFAutocompleteAsync-root': {
                 width: string;
+                height: string;
             };
         };
     };

package/theme/overrides/M4LRHFComponents/{index.e3118e8b.js → index.0e107243.js}

@@ -8,7 +8,7 @@ const n = (t) => ({
       }
     }
   }
-}), r = (t) => ({
+}), l = (t) => ({
   M4LRHFTextField: {
     styleOverrides: {
       "&.M4LRHFTextField-root": {
@@ -31,7 +31,7 @@ const n = (t) => ({
           },
           "& .MuiInputAdornment-root": {
             margin: "0px",
-            padding: "0px"
+            padding: "0px 4px 0 0"
           },
           "& .M4LIcon-icon": {
             backgroundColor: t.palette.text.secondary,
@@ -153,7 +153,7 @@ const n = (t) => ({
       }
     }
   }
-}), l = (t) => ({
+}), r = (t) => ({
   M4LRHFCheckbox: {
     styleOverrides: {
       "&.M4LRHFCheckbox-root": {
@@ -220,10 +220,63 @@ const n = (t) => ({
   M4LRHFAutocomplete: {
     styleOverrides: {
       "&.M4LRHFAutocomplete-root": {
+        height: "auto",
         display: "flex",
         flexDirection: "column",
         width: "100%",
         gap: "4px",
+        "& .MuiAutocomplete-root": {
+          height: "auto",
+          "& .MuiFormControl-root": {
+            height: "100%",
+            "& .MuiInputBase-root": {
+              position: "relative",
+              height: "100%",
+              "& .MuiInputBase-input": {
+                boxSizing: "border-box",
+                color: t.palette.text.secondary,
+                backgroundColor: "transparent",
+                height: "auto",
+                padding: "2px 2px 2px 8px",
+                ...t.typography.body
+              },
+              "& .M4LRHFAutocomplete-iconDown": {},
+              "& .MuiOutlinedInput-notchedOutline": {
+                inset: "0",
+                height: "unset",
+                "& legend": {
+                  display: "none"
+                }
+              }
+            }
+          }
+        },
+        "& .M4LRHFAutocomplete-skeletonRoot": {
+          display: "flex",
+          flexDirection: "column",
+          gap: "4px",
+          width: "100%",
+          "& .M4LRHFAutocomplete-skeleton": {
+            width: "100%",
+            display: "flex",
+            justifyContent: "space-between",
+            alignItems: "center",
+            height: `${t.spacing(4.5)}`,
+            border: `1px solid ${t.palette.divider}`,
+            borderRadius: `${t.spacing(1)}`,
+            padding: `0 ${t.spacing(2)}`,
+            overflow: "hidden",
+            [t.breakpoints.down("md")]: {
+              width: "100%"
+            },
+            "& .M4LRHFAutocomplete-skeletonContainerText": {
+              width: "100%",
+              height: "auto",
+              overflow: "hidden",
+              margin: t.spacing(1.5)
+            }
+          }
+        },
         "& .MuiAutocomplete-root .MuiFormControl-root .MuiInputBase-root": {
           padding: "0"
         },
@@ -236,32 +289,7 @@ const n = (t) => ({
         },
         "& .MuiAutocomplete-root .MuiInputBase-root": {
           padding: "0p 8px",
-          heigth: "100%",
-          "& .MuiInputBase-input": {
-            color: t.palette.text.secondary,
-            padding: "4px",
-            backgroundColor: "transparent",
-            ...t.typography.body,
-            heigth: "100%"
-          },
-          "& .MuiInputAdornment-root": {
-            margin: "0px",
-            padding: "0px"
-          },
-          "& .M4LIcon-icon": {
-            backgroundColor: t.palette.text.secondary,
-            transition: "all .3s ease"
-          },
-          "& .MuiOutlinedInput-notchedOutline": {
-            border: "1px solid",
-            borderColor: t.palette.divider,
-            borderRadius: "4px",
-            inset: "0px",
-            transition: "all .3s ease",
-            "& legend": {
-              display: "none"
-            }
-          }
+          heigth: "100%"
         },
         "&:hover": {
           "& .M4LRHFAutocomplete-label": {
@@ -338,15 +366,15 @@ const n = (t) => ({
           }
         },
         "&.M4LRHFAutocomplete-sizeSmall": {
-          "& .MuiInputBase-input, & .MuiOutlinedInput-notchedOutline, & .M4LRHFAutocomplete-skeleton": {
-            heigth: "28px",
-            padding: "0px 0px"
+          [`& .M4LRHFAutocomplete-skeleton,
+                          & .MuiAutocomplete-root`]: {
+            height: "28px"
           }
         },
         "&.M4LRHFAutocomplete-sizeMedium": {
-          "& .MuiInputBase-input, & .MuiOutlinedInput-notchedOutline, & .M4LRHFAutocomplete-skeleton": {
-            heigth: "32px",
-            padding: "0px 8px"
+          [`& .M4LRHFAutocomplete-skeleton,
+                          & .MuiAutocomplete-root`]: {
+            height: "36px"
           }
         }
       }
@@ -366,7 +394,8 @@ const n = (t) => ({
   M4LRHFAutocompleteAsync: {
     styleOverrides: {
       "&.M4LRHFAutocompleteAsync-root": {
-        width: "100%"
+        width: "100%",
+        height: "auto"
       }
     }
   }
@@ -681,12 +710,12 @@ const n = (t) => ({
   }
 });
 export {
-  r as M,
+  l as M,
   n as a,
   u as b,
   p as c,
   d,
   s as e,
   M as f,
-  l as g
+  r as g
 };

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

@@ -3,19 +3,30 @@ export default function Autocomplete(theme: Theme): {
     MuiAutocomplete: {
         styleOverrides: {
             root: {
+                height: string;
                 '& .MuiInputBase-root': {
+                    [x: string]: string | {
+                        height: string;
+                        minHeight: string;
+                    };
                     padding: string;
+                    borderRadius: string;
+                    minHeight: string;
                 };
             };
             paper: {
                 boxShadow: string;
             };
             listbox: {
+                display: string;
+                flexDirection: string;
+                gap: string;
                 padding: string;
+                borderRadius: string;
                 '& .MuiAutocomplete-option': {
                     padding: string;
-                    margin: string;
-                    borderRadius: number;
+                    borderRadius: string;
+                    height: string;
                 };
             };
         };

package/theme/overrides/MUIComponents/{index.25926753.js → index.d308ce65.js}

@@ -1,6 +1,6 @@
 import { alpha as e } from "@mui/material";
 import { alpha as t } from "@mui/material/styles";
-function s(o) {
+function l(o) {
   return {
     MuiAvatar: {
       styleOverrides: {
@@ -25,7 +25,7 @@ function s(o) {
     }
   };
 }
-function l(o) {
+function s(o) {
   return {
     MuiButton: {
       styleOverrides: {
@@ -315,7 +315,7 @@ function M(o) {
     }
   };
 }
-function v(o) {
+function x(o) {
   return {
     MuiTableRow: {
       styleOverrides: {
@@ -414,7 +414,7 @@ function f(o) {
     }
   };
 }
-function x(o) {
+function v(o) {
   return {
     MuiPaper: {
       defaultProps: {
@@ -496,10 +496,10 @@ function k(o) {
     MuiInputBase: {
       styleOverrides: {
         root: {
-          height: "100%",
+          height: "auto",
           backgroundColor: o.palette.background.default,
           ...o.typography.body2,
-          borderRadius: o.spacing(1),
+          borderRadius: "2px",
           padding: "0px",
           "&.Mui-disabled": {
             "& svg": { color: o.palette.text.disabled }
@@ -938,7 +938,7 @@ function P(o) {
     }
   };
 }
-function $(o) {
+function z(o) {
   const r = o.palette.mode === "light";
   return {
     MuiLinearProgress: {
@@ -960,7 +960,7 @@ function $(o) {
     }
   };
 }
-function z(o) {
+function $(o) {
   return {
     MuiTimelineDot: {
       styleOverrides: {
@@ -1091,7 +1091,7 @@ function W(o) {
     }
   };
 }
-function F(o) {
+function H(o) {
   return {
     MuiPaginationItem: {
       styleOverrides: {
@@ -1125,7 +1125,7 @@ function F(o) {
     }
   };
 }
-function H(o) {
+function F(o) {
   return {
     MuiBreadcrumbs: {
       styleOverrides: {
@@ -1227,19 +1227,30 @@ function E(o) {
     MuiAutocomplete: {
       styleOverrides: {
         root: {
+          height: "auto",
           "& .MuiInputBase-root": {
-            padding: "0 39px 0px 0"
+            padding: "4px 4px 4px 8px",
+            borderRadius: "4px",
+            minHeight: "28px",
+            [o.breakpoints.down("sm")]: {
+              height: "36px",
+              minHeight: "36px"
+            }
           }
         },
         paper: {
-          boxShadow: o.customShadows?.dropdown
+          boxShadow: o.customShadows.z3
         },
         listbox: {
-          padding: o.spacing(0, 1),
+          display: "flex",
+          flexDirection: "column",
+          gap: "8px",
+          padding: "4px",
+          borderRadius: "6px",
           "& .MuiAutocomplete-option": {
-            padding: o.spacing(1),
-            margin: o.spacing(1, 0),
-            borderRadius: o.shape.borderRadius
+            padding: "0px 0 0 8px",
+            borderRadius: "4px",
+            height: "auto"
           }
         }
       }
@@ -1349,7 +1360,7 @@ const J = (o) => ({
   }
 });
 export {
-  s as A,
+  l as A,
   f as B,
   c as C,
   h as D,
@@ -1359,14 +1370,14 @@ export {
   k as I,
   y as L,
   b as M,
-  x as P,
+  v as P,
   S as R,
   B as S,
   g as T,
   w as a,
   M as b,
-  v as c,
-  l as d,
+  x as c,
+  s as d,
   p as e,
   O as f,
   C as g,
@@ -1377,14 +1388,14 @@ export {
   A as l,
   m,
   D as n,
-  z as o,
+  $ as o,
   P as p,
-  $ as q,
+  z as q,
   G as r,
   W as s,
-  F as t,
+  H as t,
   _ as u,
-  H as v,
+  F as v,
   j as w,
   E as x,
   q as y,

package/theme/overrides/index.76becad2.js

@@ -0,0 +1,93 @@
+import { F as s, T as o, C as r, M as L, L as M, I as n, a as i, R as p, B as d, b as l, c as u, P as c, S as g, d as B, e as A, D as F, A as P, f as b, g as T, h as v, i as y, j as C, k as D, l as I, m as R, n as H, o as f, p as k, q as x, r as S, s as w, t as G, u as j, v as E, w as q, x as z, y as O, z as V, E as N, G as U } from "./MUIComponents/index.d308ce65.js";
+import { M as J, a as K, b as Q, c as W, d as X, e as Y, f as Z, g as _, h as $, i as t, j as m, k as e, l as h, m as aa, n as sa, o as oa, p as ra, q as La, r as Ma, s as na, t as ia, u as pa, v as da, w as la, x as ua, y as ca, z as ga, A as Ba, B as Aa, C as Fa, D as Pa, E as ba, F as Ta, G as va, H as ya } from "./M4LExtendedComponents/index.28d622ba.js";
+import { M as Ca, a as Da, b as Ia, c as Ra, d as Ha, e as fa, f as ka, g as xa } from "./M4LRHFComponents/index.0e107243.js";
+function ja(a) {
+  return Object.assign(
+    s(a),
+    o(a),
+    r(a),
+    L(a),
+    M(a),
+    n(a),
+    i(),
+    p(a),
+    d(),
+    l(a),
+    u(a),
+    c(a),
+    g(a),
+    B(a),
+    A(a),
+    F(a),
+    P(a),
+    b(a),
+    T(a),
+    v(a),
+    y(a),
+    C(),
+    D(),
+    I(a),
+    R(a),
+    H(a),
+    f(a),
+    k(a),
+    x(a),
+    S(a),
+    w(a),
+    G(a),
+    j(a),
+    E(a),
+    q(),
+    z(a),
+    O(a),
+    V(a),
+    N(a),
+    J(a),
+    U(),
+    K(a),
+    Ca(a),
+    Da(),
+    Ia(a),
+    Ra(),
+    Ha(a),
+    Q(),
+    fa(a),
+    ka(),
+    W(a),
+    X(a),
+    Y(),
+    Z(a),
+    _(a),
+    $(),
+    t(),
+    m(a),
+    xa(a),
+    e(a),
+    h(a),
+    aa(a),
+    sa(a),
+    oa(a),
+    ra(a),
+    La(a),
+    Ma(a),
+    na(a),
+    ia(a),
+    pa(a),
+    da(a),
+    la(a),
+    ua(),
+    ca(a),
+    ga(),
+    Ba(a),
+    Aa(a),
+    Fa(a),
+    Pa(a),
+    ba(a),
+    Ta(a),
+    va(a),
+    ya(a)
+  );
+}
+export {
+  ja as f
+};

package/theme/{palette.ad96498c.js → palette.a914c187.js}

@@ -117,9 +117,9 @@ const e = {
     10: "#FFFFFF",
     20: "#F7FCFC",
     30: "#F9FBFB",
-    40: "#F4F7F7",
+    40: "#F0F4F4",
     50: "#EFF3F4",
-    60: "#EAEFF0",
+    60: "#E1E9EA",
     70: "#DEE6E8",
     80: "#fff0",
     90: "#fff0"

package/theme/{shadows.c56e8ae9.js → shadows.3dfe77c2.js}

@@ -1,5 +1,5 @@
 import { alpha as a } from "@mui/material/styles";
-import { p as e, P as r } from "./palette.ad96498c.js";
+import { p as e, P as r } from "./palette.a914c187.js";
 const s = e.light.grey[500], n = "#000000", o = (t) => {
   const p = a(t, 0.2), x = a(t, 0.14), $ = a(t, 0.12);
   return [

package/theme/{typography.39389e10.js → typography.dd335f0f.js}

@@ -1,10 +1,10 @@
 import "@mui/material/styles";
 import "@mui/material/useMediaQuery";
-import "../utils/getColorPresets.82f91ceb.js";
+import "../utils/getColorPresets.9c103b85.js";
 import "@mui/system";
-import "./defaultThemeOptions.81e20130.js";
-import "./shadows.c56e8ae9.js";
-import "./palette.ad96498c.js";
+import "./defaultThemeOptions.733652aa.js";
+import "./shadows.3dfe77c2.js";
+import "./palette.a914c187.js";
 import "@mui/material";
 import { r as t, p as i } from "../utils/getFontValue.88831637.js";
 const e = "Poppins, sans-serif", p = {

package/utils/{getColorPresets.82f91ceb.js → getColorPresets.9c103b85.js}

@@ -1,4 +1,4 @@
-import { P as e } from "../theme/palette.ad96498c.js";
+import { P as e } from "../theme/palette.a914c187.js";
 const r = [
   {
     name: "patronus",

package/utils/{getColorState.0e5b3a7c.js → getColorState.184e9d10.js}

@@ -1,8 +1,8 @@
 import { alpha as r } from "@mui/system";
-import "../theme/defaultThemeOptions.81e20130.js";
-import "../theme/shadows.c56e8ae9.js";
-import { P as e, S as o } from "../theme/palette.ad96498c.js";
-import "../theme/typography.39389e10.js";
+import "../theme/defaultThemeOptions.733652aa.js";
+import "../theme/shadows.3dfe77c2.js";
+import { P as e, S as o } from "../theme/palette.a914c187.js";
+import "../theme/typography.dd335f0f.js";
 import "@mui/material";
 import "@mui/material/styles";
 const f = (a, l) => {
@@ -13,8 +13,8 @@ const f = (a, l) => {
         light: {
           active12: r(e?.patronusBlue[50], 0.08),
           active: e?.patronusBlue[50],
-          focus: e?.patronusBlue[60],
-          hover: e?.patronusBlue[60],
+          focus: e?.patronusBlue[40],
+          hover: e?.patronusBlue[40],
           overdefoult: r(e?.coolGrey[70], 0.1),
           default: r(e?.coolGrey[70], 0.04),
           borderDefault: e?.coolGrey[40],

package/theme/index.38ad102a.js

@@ -1,7 +0,0 @@
-import "./defaultThemeOptions.81e20130.js";
-import "./shadows.c56e8ae9.js";
-import "./palette.ad96498c.js";
-import "./typography.39389e10.js";
-import "@mui/material";
-import "@mui/material/styles";
-import "@mui/system";