@m4l/styles 0.0.49 → 1.0.0

package/theme/overrides/M4LRHFComponents/{index.f37c2406.js → index.3599b255.js}

@@ -36,31 +36,31 @@ const r = (t) => ({
           }
         },
         "& .M4LRHFTextField-label": {
-          color: t.palette.text.secondary,
+          color: t.vars.palette.text.secondary,
           transition: "all .5s ease"
         },
         "& .MuiInputBase-root": {
           padding: "0px",
           borderRadius: "4px",
           "& .MuiInputBase-input": {
-            color: t.palette.text.secondary,
+            color: t.vars.palette.text.secondary,
             padding: "4px 8px",
             backgroundColor: "transparent",
             height: "100%",
-            ...t.typography.body
+            ...t.colorSchemes.finalTheme.typography.body
           },
           "& .MuiInputAdornment-root": {
             margin: "0px",
             padding: "0px 4px 0 0"
           },
           "& .M4LIcon-icon": {
-            backgroundColor: t.palette.text.secondary,
+            backgroundColor: t.vars.palette.text.secondary,
             transition: "all .3s ease"
           },
           "& .MuiOutlinedInput-notchedOutline": {
             border: "1.3px solid",
             padding: "4px",
-            borderColor: t.palette.state.borderPrimary,
+            borderColor: t.vars.palette.state.borderPrimary,
             borderRadius: "4px",
             inset: "0px",
             transition: "all .3s ease",
@@ -71,52 +71,52 @@ const r = (t) => ({
         },
         "&:hover": {
           "& .M4LRHFTextField-label": {
-            color: t.palette.state?.hover
+            color: t.vars.palette.state?.hover
           },
           "& .MuiInputBase-root .MuiOutlinedInput-notchedOutline": {
-            borderColor: t.palette.state?.hover,
-            boxShadow: `0px 1px 8px ${o(t.palette.primary.main, 0.32)}`,
-            background: t.palette.state?.active12
+            borderColor: t.vars.palette.state?.hover,
+            boxShadow: `0px 1px 8px ${o(t.colorSchemes.finalTheme.palette.primary.main, 0.32)}`,
+            background: t.vars.palette.state?.active12
           },
           "& .MuiInputBase-input": {
-            color: t.palette.text.primary
+            color: t.vars.palette.text.primary
           },
           "& .M4LIcon-icon": {
-            backgroundColor: t.palette.state?.hover
+            backgroundColor: t.vars.palette.state?.hover
           }
         },
         "&.M4LRHFTextField-isFocus": {
           "& .M4LRHFTextField-label": {
-            color: t.palette.state?.active
+            color: t.vars.palette.state?.active
           },
           "& .MuiInputBase-root .MuiOutlinedInput-notchedOutline": {
             transition: "all .1s ease",
             border: "2px solid",
-            borderColor: t.palette.state?.active,
-            boxShadow: `0px 1px 8px ${o(t.palette.primary.main, 0.32)}`,
-            background: t.palette.state?.active12
+            borderColor: t.vars.palette.state?.active,
+            boxShadow: `0px 1px 8px ${o(t.colorSchemes.finalTheme.palette.primary.main, 0.32)}`,
+            background: t.vars.palette.state?.active12
           },
           "& .MuiInputBase-input": {
-            color: t.palette.text.primary
+            color: t.vars.palette.text.primary
           },
           "& .M4LIcon-icon": {
-            backgroundColor: t.palette.state?.active
+            backgroundColor: t.vars.palette.state?.active
           }
         },
         "&.M4LRHFTextField-variantError": {
           "& .M4LRHFTextField-label": {
-            color: t.palette.state?.error.normal
+            color: t.vars.palette.state?.error.normal
           },
           "& .MuiInputBase-root .MuiOutlinedInput-notchedOutline": {
             border: "1px solid",
-            borderColor: t.palette.state?.error.normal,
-            background: t.palette.error.opacity
+            borderColor: t.vars.palette.state?.error.normal,
+            background: t.vars.palette.error.opacity
           },
           "& .MuiInputBase-input": {
-            color: t.palette.text.primary
+            color: t.vars.palette.text.primary
           },
           "& .M4LIcon-icon": {
-            backgroundColor: t.palette.state?.error.normal
+            backgroundColor: t.vars.palette.state?.error.normal
           },
           "&:hover": {
             "& .MuiInputBase-root .MuiOutlinedInput-notchedOutline": {
@@ -131,19 +131,19 @@ const r = (t) => ({
         },
         "&.M4LRHFTextField-isDisabled": {
           "& .M4LRHFTextField-label": {
-            color: t.palette.text.disabled
+            color: t.vars.palette.text.disabled
           },
           "& .MuiInputBase-root .MuiOutlinedInput-notchedOutline": {
             border: "1px solid",
-            borderColor: t.palette.state.borderSecondary,
-            backgroundColor: t.palette.state?.default,
+            borderColor: t.vars.palette.state.borderSecondary,
+            backgroundColor: t.vars.palette.state?.default,
             boxShadow: "none"
           },
           "& .MuiInputBase-input": {
-            color: t.palette.text.disabled
+            color: t.vars.palette.text.disabled
           },
           "& .M4LIcon-icon": {
-            backgroundColor: t.palette.text.disabled
+            backgroundColor: t.vars.palette.text.disabled
           }
         },
         "&.M4LRHFTextField-sizeSmall": {
@@ -189,12 +189,12 @@ const r = (t) => ({
           gap: t.spacing(2),
           [t.breakpoints.down("sm")]: {
             gap: t.spacing(1),
-            ...t.typography.paragraph
+            ...t.colorSchemes.finalTheme.typography.paragraph
           }
         },
         "& .MuiTypography-root": {
-          color: t.palette.text.primary,
-          ...t.typography.body
+          color: t.vars.palette.text.primary,
+          ...t.colorSchemes.finalTheme.typography.body
         },
         ".M4LRHFCheckbox-small .MuiButtonBase-root": {
           width: "20px",
@@ -216,20 +216,20 @@ const r = (t) => ({
           borderRadius: "4px"
         },
         ".MuiButtonBase-root:hover": {
-          backgroundColor: t.palette.state?.active12
+          backgroundColor: t.vars.palette.state?.active12
         },
         ".Mui-focusVisible": {
           border: "1px solid",
-          borderColor: t.palette.state?.focus
+          borderColor: t.vars.palette.state?.focus
         },
         ".MuiButtonBase-root:hover .MuiSvgIcon-root": {
-          fill: t.palette.state?.hover
+          fill: t.vars.palette.state?.hover
         },
         ".M4LRHFCheckbox-checkTypography .MuiTypography-root": {
-          ...t.typography.body
+          ...t.colorSchemes.finalTheme.typography.body
         },
         ".M4LRHFCheckbox-stateDisabled .MuiSvgIcon-root": {
-          fill: t.palette.state?.default
+          fill: t.vars.palette.state?.default
         },
         ".MuiButtonBase-root .Mui-focusVisible:focus-visible": {
           outline: "#FFF00"
@@ -247,21 +247,44 @@ const r = (t) => ({
         width: "100%",
         gap: "2px",
         outline: "unset",
+        "&.M4LRHFAutocomplete-multiple": {
+          "& .MuiAutocomplete-inputRoot": {
+            display: "flex",
+            flexWrap: "wrap",
+            gap: "6px"
+          },
+          "& .MuiInputBase-root": {
+            padding: "2px !important"
+          },
+          "& .MuiAutocomplete-root": {
+            height: "auto"
+          },
+          "&.M4LRHFAutocomplete-sizeSmall": {
+            "& .MuiChip-root": {
+              height: "20px"
+            }
+          },
+          "&.M4LRHFAutocomplete-sizeMedium": {
+            "& .MuiChip-root": {
+              height: "32px"
+            }
+          }
+        },
         "& .MuiAutocomplete-root": {
           height: "100%",
           "& .MuiFormControl-root": {
             height: "100%",
             "& .MuiInputBase-root": {
-              borderColor: t.palette.state.borderPrimary,
+              borderColor: t.vars.palette.state.borderPrimary,
               position: "relative",
               height: "100%",
               "& .MuiInputBase-input": {
                 boxSizing: "border-box",
-                color: t.palette.text.secondary,
+                color: t.vars.palette.text.secondary,
                 backgroundColor: "transparent",
                 height: "100%",
                 padding: "0 16px 0 8px",
-                ...t.typography.body
+                ...t.colorSchemes.finalTheme.typography.body
               },
               "& .M4LRHFAutocomplete-iconDown": {},
               "& .MuiOutlinedInput-notchedOutline": {
@@ -285,7 +308,7 @@ const r = (t) => ({
             justifyContent: "space-between",
             alignItems: "center",
             border: "1px solid",
-            borderColor: t.palette.divider,
+            borderColor: t.vars.palette.divider,
             borderRadius: "4px",
             padding: "0 10px",
             overflow: "hidden",
@@ -300,7 +323,7 @@ const r = (t) => ({
           padding: "0"
         },
         "& .M4LRHFAutocomplete-label": {
-          color: t.palette.text.secondary,
+          color: t.vars.palette.text.secondary,
           transition: "all .3s ease"
         },
         "& .MuiAutocomplete-endAdornment": {
@@ -312,50 +335,50 @@ const r = (t) => ({
         },
         "&:hover": {
           "& .M4LRHFAutocomplete-label": {
-            color: t.palette.text.secondary
+            color: t.vars.palette.text.secondary
           },
           "& .MuiInputBase-root .MuiOutlinedInput-notchedOutline": {
-            borderColor: t.palette.state?.hover,
-            boxShadow: `0px 1px 8px ${e(t.palette.primary.main, 0.32)}`
+            borderColor: t.vars.palette.state?.hover,
+            boxShadow: `0px 1px 8px ${e(t.colorSchemes.finalTheme.palette.primary.main, 0.32)}`
           },
           "& .MuiInputBase-input": {
-            color: t.palette.text.primary
+            color: t.vars.palette.text.primary
           },
           "& .M4LIcon-icon": {
-            backgroundColor: t.palette.state?.hover
+            backgroundColor: t.vars.palette.state?.hover
           }
         },
         "&.M4LRHFAutocomplete-isFocus": {
           "& .M4LRHFAutocomplete-label": {
-            color: t.palette.state?.active
+            color: t.vars.palette.state?.active
           },
           "& .MuiInputBase-root .MuiOutlinedInput-notchedOutline": {
             transition: "all .1s ease",
-            background: t.palette.state.active12,
+            background: t.vars.palette.state.active12,
             border: "2px solid",
-            borderColor: t.palette.state?.active,
-            boxShadow: `0px 1px 8px ${e(t.palette.primary.main, 0.32)}`
+            borderColor: t.vars.palette.state?.active,
+            boxShadow: `0px 1px 8px ${e(t.colorSchemes.finalTheme.palette.primary.main, 0.32)}`
           },
           "& .MuiInputBase-input": {
-            color: t.palette.text.primary
+            color: t.vars.palette.text.primary
           },
           "& .M4LIcon-icon": {
-            backgroundColor: t.palette.state?.active
+            backgroundColor: t.vars.palette.state?.active
           }
         },
         "&.M4LRHFAutocomplete-variantError": {
           "& .M4LRHFAutocomplete-label": {
-            color: t.palette.state?.error.normal
+            color: t.vars.palette.state?.error.normal
           },
           "& .MuiInputBase-root .MuiOutlinedInput-notchedOutline": {
             border: "1px solid",
-            borderColor: t.palette.state?.error.normal
+            borderColor: t.vars.palette.state?.error.normal
           },
           "& .MuiInputBase-input": {
-            color: t.palette.text.primary
+            color: t.vars.palette.text.primary
           },
           "& .M4LIcon-icon": {
-            backgroundColor: t.palette.state?.error.normal
+            backgroundColor: t.vars.palette.state?.error.normal
           },
           "&:hover": {
             "& .MuiInputBase-root .MuiOutlinedInput-notchedOutline": {
@@ -370,19 +393,19 @@ const r = (t) => ({
         },
         "&.M4LRHFAutocomplete-isDisabled": {
           "& .M4LRHFAutocomplete-label": {
-            color: t.palette.text.disabled
+            color: t.vars.palette.text.disabled
           },
           "& .MuiInputBase-root .MuiOutlinedInput-notchedOutline": {
             border: "1px solid",
-            borderColor: t.palette.state.borderDisable,
-            backgroundColor: t.palette.state?.default,
+            borderColor: t.vars.palette.state.borderDisable,
+            backgroundColor: t.vars.palette.state?.default,
             boxShadow: "none"
           },
           "& .MuiInputBase-input": {
-            color: t.palette.text.disabled
+            color: t.vars.palette.text.disabled
           },
           "& .M4LIcon-icon": {
-            backgroundColor: t.palette.text.disabled
+            backgroundColor: t.vars.palette.text.disabled
           }
         },
         "&.M4LRHFAutocomplete-sizeSmall": {
@@ -413,19 +436,6 @@ const r = (t) => ({
               objectPosition: "left"
             }
           }
-        },
-        "&.M4LRHFAutocomplete-multiple": {
-          "& .MuiAutocomplete-root": {
-            height: "auto"
-          },
-          "& .MuiAutocomplete-inputRoot": {
-            display: "flex",
-            flexWrap: "wrap",
-            gap: "6px"
-          },
-          "& .MuiInputBase-root": {
-            padding: "2px !important"
-          }
         }
       }
     }
@@ -456,8 +466,8 @@ const r = (t) => ({
           display: "flex",
           gap: "8px",
           "&:hover": {
-            color: t.palette.text.primary,
-            backgroundColor: t.palette.state.active12
+            color: t.vars.palette.text.primary,
+            backgroundColor: t.vars.palette.state.active12
           },
           "& .M4LImage-root": {
             width: "auto",
@@ -511,10 +521,10 @@ const r = (t) => ({
           }
         },
         "& .MuiPaper-root": {
-          boxShadow: t.customShadows.z3,
+          boxShadow: t.customShadows?.z2,
           "& .MuiAutocomplete-listbox .MuiAutocomplete-option:hover": {
-            color: t.palette.text.primary,
-            backgroundColor: t.palette.state.active12
+            color: t.vars.palette.text.primary,
+            backgroundColor: t.vars.palette.state.active12
           }
         }
       }
@@ -544,7 +554,7 @@ const r = (t) => ({
       }
     }
   }
-}), d = (t) => ({
+}), s = (t) => ({
   M4LRHFAutocompleteAsync: {
     styleOverrides: {
       "&.M4LRHFAutocompleteAsync-root": {
@@ -553,7 +563,7 @@ const r = (t) => ({
       }
     }
   }
-}), u = (t) => ({
+}), d = (t) => ({
   M4LRHFDateTime: {
     styleOverrides: {
       "&.M4LRHFDateTime-root": {
@@ -568,7 +578,7 @@ const r = (t) => ({
           width: "100%",
           alignItems: "center",
           justifyContent: "space-between",
-          border: `1px solid ${t.palette.divider}`,
+          border: `1px solid ${t.vars.palette.divider}`,
           paddingLeft: "12px",
           borderRadius: "2px",
           "& .MuiSkeleton-circular": {
@@ -609,17 +619,17 @@ const r = (t) => ({
           }
         },
         "& .M4LRHFTextField-label": {
-          color: t.palette.text.secondary,
+          color: t.vars.palette.text.secondary,
           transition: "all .5s ease"
         },
         "& .MuiInputBase-root.MuiInputBase-formControl": {
           padding: "0px 8px 0 0",
           "& .MuiInputBase-input": {
-            color: t.palette.text.secondary,
+            color: t.vars.palette.text.secondary,
             padding: "0px 12px",
             backgroundColor: "transparent",
             height: "100%",
-            ...t.typography.body
+            ...t.colorSchemes.finalTheme.typography.body
           },
           "& .MuiInputAdornment-root": {
             margin: "0px",
@@ -638,13 +648,13 @@ const r = (t) => ({
             }
           },
           "& .M4LIcon-icon": {
-            backgroundColor: t.palette.text.secondary,
+            backgroundColor: t.vars.palette.text.secondary,
             transition: "all .3s ease"
           },
           "& .MuiOutlinedInput-notchedOutline": {
             border: "1px solid",
             padding: "4px",
-            borderColor: t.palette.divider,
+            borderColor: t.vars.palette.divider,
             borderRadius: "4px",
             inset: "0px",
             transition: "all .3s ease",
@@ -655,47 +665,47 @@ const r = (t) => ({
         },
         "&:hover": {
           "& .M4LTypography-root": {
-            color: t.palette.state?.hover
+            color: t.vars.palette.state?.hover
           },
           "& .MuiInputBase-root .MuiOutlinedInput-notchedOutline": {
-            borderColor: t.palette.state?.hover
+            borderColor: t.vars.palette.state?.hover
           },
           "& .MuiInputBase-input": {
-            color: t.palette.text.primary
+            color: t.vars.palette.text.primary
           },
           "& .M4LIcon-icon": {
-            backgroundColor: t.palette.state?.hover
+            backgroundColor: t.vars.palette.state?.hover
           }
         },
         "&.M4LRHFDateTime-isFocus": {
           "& .M4LTypography-root": {
-            color: t.palette.state.active
+            color: t.vars.palette.state.active
           },
           "& .MuiInputBase-root .MuiOutlinedInput-notchedOutline": {
             transition: "all .1s ease",
             border: "2px solid",
-            borderColor: t.palette.state?.active
+            borderColor: t.vars.palette.state?.active
           },
           "& .MuiInputBase-input": {
-            color: t.palette.text.primary
+            color: t.vars.palette.text.primary
           },
           "& .M4LIcon-icon": {
-            backgroundColor: t.palette.state?.active
+            backgroundColor: t.vars.palette.state?.active
           }
         },
         "&.M4LRHFTextField-variantError": {
           "& .M4LRHFTextField-label": {
-            color: t.palette.state?.error.normal
+            color: t.vars.palette.state?.error.normal
           },
           "& .MuiInputBase-root .MuiOutlinedInput-notchedOutline": {
             border: "1px solid",
-            borderColor: t.palette.state?.error.normal
+            borderColor: t.vars.palette.state?.error.normal
           },
           "& .MuiInputBase-input": {
-            color: t.palette.text.primary
+            color: t.vars.palette.text.primary
           },
           "& .M4LIcon-icon": {
-            backgroundColor: t.palette.state?.error.normal
+            backgroundColor: t.vars.palette.state?.error.normal
           },
           "&:hover": {
             "& .MuiInputBase-root .MuiOutlinedInput-notchedOutline": {
@@ -710,25 +720,25 @@ const r = (t) => ({
         },
         "&.M4LRHFTextField-isDisabled": {
           "& .M4LRHFTextField-label": {
-            color: t.palette.text.disabled
+            color: t.vars.palette.text.disabled
           },
           "& .MuiInputBase-root .MuiOutlinedInput-notchedOutline": {
             border: "1px solid",
-            borderColor: t.palette.text.disabled,
-            backgroundColor: t.palette.state?.default,
+            borderColor: t.vars.palette.text.disabled,
+            backgroundColor: t.vars.palette.state?.default,
             boxShadow: "none"
           },
           "& .MuiInputBase-input": {
-            color: t.palette.text.disabled
+            color: t.vars.palette.text.disabled
           },
           "& .M4LIcon-icon": {
-            backgroundColor: t.palette.text.disabled
+            backgroundColor: t.vars.palette.text.disabled
           }
         }
       }
     }
   }
-}), s = (t) => ({
+}), u = (t) => ({
   M4LRHFUploadImage: {
     styleOverrides: {
       "&.M4LRHFUploadImage-root": {
@@ -742,8 +752,8 @@ const r = (t) => ({
           position: "relative",
           borderRadius: "4px",
           padding: "8px",
-          boxShadow: t.customShadows.z2,
-          background: t.palette.background.default,
+          boxShadow: t.customShadows?.z2,
+          background: t.vars.palette.background.default,
           "& .M4LRHFUploadImage-dropZoneStyle": {
             zIndex: 0,
             width: "fit-content",
@@ -757,15 +767,15 @@ const r = (t) => ({
             inset: "0",
             alignItems: "center",
             justifyContent: "center",
-            background: t.palette.background.neutral,
+            background: t.vars.palette.background.neutral,
             "& > *": {
               width: "100%",
               height: "100%"
             },
             "&:hover": {
-              background: t.palette.state.active12,
+              background: t.vars.palette.state.active12,
               border: "1px solid",
-              borderColor: t.palette.state.active12,
+              borderColor: t.vars.palette.state.active12,
               cursor: "pointer",
               "& .placeholder": {
                 zIndex: 9
@@ -823,24 +833,24 @@ const r = (t) => ({
                     display: "flex",
                     justifyContent: "center",
                     ".MuiTypography-subtitle": {
-                      ...t.typography.paragraphDens,
-                      color: t.palette.text.primary
+                      ...t.colorSchemes.finalTheme.typography.paragraphDens,
+                      color: t.vars.palette.text.primary
                     }
                   },
                   "& .M4LRHFUploadImage-containerDescription": {
                     display: "flex",
                     justifyContent: "center",
                     ".MuiTypography-root": {
-                      ...t.typography.paragraph,
-                      color: t.palette.text.secondary
+                      ...t.colorSchemes.finalTheme.typography.paragraph,
+                      color: t.vars.palette.text.secondary
                     }
                   },
                   "& .M4LRHFUploadImage-containerConditions": {
                     display: "flex",
                     justifyContent: "center",
                     ".MuiTypography-root": {
-                      ...t.typography.body,
-                      color: t.palette.text.secondary
+                      ...t.colorSchemes.finalTheme.typography.body,
+                      color: t.vars.palette.text.secondary
                     }
                   },
                   "& .M4LButton-root": {
@@ -857,7 +867,7 @@ const r = (t) => ({
           maskPosition: "center!important",
           maskRepeat: "no-repeat!important",
           WebkitMaskRepeat: "no-repeat!important",
-          border: `1px dashed ${t.palette.divider}`,
+          border: `1px dashed ${t.vars.palette.divider}`,
           width: "100%",
           height: "100%",
           mask: "url('data:image/svg+xml;base64, PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDI2LjMuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkNhcGFfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiCgkgdmlld0JveD0iMCAwIDcwIDcwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA3MCA3MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiM2MzczODE7fQo8L3N0eWxlPgo8Zz4KCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik00NSw4LjdjMS40LTEuNSwzLjQtMi4zLDUuNC0yLjNzMy45LDAuOCw1LjQsMi4zczIuNCwzLjUsMi41LDUuN2MwLDIuMi0wLjksNC4yLTIuNCw1LjdzLTMuNSwyLjMtNS41LDIuMgoJCWMtMi4xLDAuMS00LTAuNy01LjUtMi4yYy0xLjQtMS41LTIuMy0zLjUtMi40LTUuN0M0Mi42LDEyLjIsNDMuNSwxMC4yLDQ1LDguN3oiLz4KCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik02OC40LDYyLjFjLTAuMywwLjUtMC43LDAuOC0xLjIsMS4xcy0xLDAuNC0xLjYsMC40SDQuM2MtMC42LDAtMS4xLTAuMS0xLjYtMC40cy0wLjktMC42LTEuMi0xLjEKCQljLTAuMi0wLjUtMC40LTEtMC40LTEuNXMwLjEtMS4xLDAuNC0xLjVsMjMtMzYuNGMwLjMtMC41LDAuNy0wLjgsMS4yLTEuMXMxLTAuNCwxLjYtMC40czEuMSwwLjEsMS42LDAuNHMwLjksMC42LDEuMiwxLjEKCQlsMTEuNSwxOC4yYzAuMiwwLjMsMC41LDAuNSwwLjgsMC43czAuNiwwLjMsMSwwLjNjMC4zLDAsMC43LTAuMSwxLTAuM3MwLjYtMC40LDAuOC0wLjdsMy4xLTQuOWMwLjMtMC41LDAuNy0wLjgsMS4yLTEuMQoJCXMxLTAuNCwxLjYtMC40czEuMSwwLjEsMS42LDAuNGMwLjUsMC4zLDAuOSwwLjYsMS4yLDEuMWwxNC42LDIzLjFjMC4zLDAuNSwwLjMsMSwwLjMsMS41UzY4LjcsNjEuNyw2OC40LDYyLjF6Ii8+CjwvZz4KPC9zdmc+Cg==')",
@@ -951,14 +961,14 @@ const r = (t) => ({
           gap: "4px",
           padding: "2px",
           border: "1.5px solid",
-          borderColor: t.palette.state.borderPrimary,
+          borderColor: t.vars.palette.state.borderPrimary,
           borderRadius: "4px",
           width: "fit-content",
           "& .M4LRHFColorPicker-boxColor": {
             cursor: "pointer"
           },
           "& .M4LIcon-root:hover": {
-            background: t.palette.state.hoverDefault
+            background: t.vars.palette.state.hoverDefault
           }
         }
       }
@@ -968,12 +978,12 @@ const r = (t) => ({
     styleOverrides: {
       "&.M4LRHFColorPicker-popoverRoot": {
         "& .MuiPaper-root": {
-          background: t.palette.background.default,
+          background: t.vars.palette.background.default,
           padding: "8px",
           border: "1px solid",
-          borderColor: t.palette.state.borderSecondary,
+          borderColor: t.vars.palette.state.borderSecondary,
           borderRadius: "4px",
-          boxShadow: t.customShadows.z4,
+          boxShadow: t.vars.customShadows.z4,
           test: "root",
           "& .M4LRHFColorPicker-containerPicker": {
             background: "transparent",
@@ -990,9 +1000,9 @@ const r = (t) => ({
               flexDirection: "column",
               gap: "8px",
               border: "1px solid",
-              borderColor: t.palette.state.borderSecondary,
+              borderColor: t.vars.palette.state.borderSecondary,
               borderRadius: "4px",
-              backgroundColor: t.palette.background.default,
+              backgroundColor: t.vars.palette.background.default,
               "& :nth-of-type(-n + 1)": {
                 borderRadius: "4px"
               },
@@ -1003,27 +1013,27 @@ const r = (t) => ({
                   "& > div": {
                     display: "flex",
                     flexDirection: "column-reverse",
-                    ...t.typography.body,
-                    color: t.palette.text.secondary,
+                    ...t.colorSchemes.finalTheme.typography.body,
+                    color: t.vars.palette.text.secondary,
                     gap: "2px",
                     padding: "0 important",
                     "& > input": {
                       display: "flex",
                       textAlign: "center !important",
                       border: "1px solid",
-                      borderColor: t.palette.state.borderPrimary,
+                      borderColor: t.vars.palette.state.borderPrimary,
                       borderRadius: "2px",
                       background: "transparent",
                       minHeight: "24px",
                       height: "24px !important",
-                      ...t.typography.body,
-                      color: `${t.palette.text.primary} !important`
+                      ...t.colorSchemes.finalTheme.typography.body,
+                      color: `${t.vars.palette.text.primary} !important`
                     },
                     "& > label": {
                       display: "flex",
                       textAlign: "left !important",
-                      ...t.typography.body,
-                      color: `${t.palette.text.secondary} !important`,
+                      ...t.colorSchemes.finalTheme.typography.body,
+                      color: `${t.vars.palette.text.secondary} !important`,
                       padding: "0 !important"
                     }
                   }
@@ -1044,9 +1054,9 @@ export {
   l as M,
   r as a,
   p as b,
-  d as c,
-  u as d,
-  s as e,
+  s as c,
+  d,
+  u as e,
   M as f,
   n as g,
   c as h