@m4l/components 1.0.22 → 1.1.0

package/styles/{DynamicFilter.c33860d6.js → DynamicFilter.0713a406.js}

@@ -1,5 +1,5 @@
 import { alpha } from "@mui/material";
-import { c as containerQuery } from "../utils/index.78d1638f.js";
+import { c as containerQuery } from "../utils/index.f77cc2ab.js";
 const CONTAINER_QUERY_NAME = "dynamic";
 const dynamicFilterStyles = {
   root: {
@@ -19,8 +19,8 @@ const dynamicFilterStyles = {
     height: "fit-content",
     border: "1px solid",
     borderRadius: "4px",
-    borderColor: theme.palette.state?.borderPrimary,
-    background: theme.palette.background.default,
+    borderColor: theme.vars.palette.state?.borderPrimary,
+    background: theme.vars.palette.background.default,
     [containerQuery(theme.breakpoints, CONTAINER_QUERY_NAME)]: {
       minHeight: "auto",
       height: "auto",
@@ -29,10 +29,10 @@ const dynamicFilterStyles = {
                           "applied-filters applied-filters"`
     },
     "&:focus-within": {
-      borderColor: !ownerState.isValid ? theme.palette.state.error.normal : theme.palette.state?.focus
+      borderColor: !ownerState.isValid ? theme.vars.palette.state.error.normal : theme.vars.palette.state?.focus
     },
     ...ownerState.isValid === false ? {
-      borderColor: theme.palette.state.error.normal
+      borderColor: theme.vars.palette.state.error.normal
     } : {}
   }),
   inputFilter: ({ theme }) => ({
@@ -48,7 +48,7 @@ const dynamicFilterStyles = {
     borderTopLeftRadius: "4px",
     borderBottomLeftRadius: "4px",
     borderRight: "1px solid",
-    borderColor: theme.palette.state?.borderPrimary,
+    borderColor: theme.vars.palette.state?.borderPrimary,
     [containerQuery(theme.breakpoints, CONTAINER_QUERY_NAME)]: {
       height: "32px",
       width: "100%",
@@ -62,30 +62,32 @@ const dynamicFilterStyles = {
   }),
   inputFilterInput: ({ theme }) => ({
     ...theme.typography.body,
-    background: theme.palette.background.default,
-    color: theme.palette.text.secondary,
+    background: theme.vars.palette.background.default,
+    color: theme.vars.palette.text.secondary,
     border: "1px solid",
     borderColor: "transparent",
     padding: "4px 8px",
     width: "100%",
     height: "100%",
     "&::placeholder": {
-      color: theme.palette.text.secondary
+      color: theme.vars.palette.text.secondary
     },
     "&:focus-visible": {
-      color: theme.palette.text.secondary,
+      color: theme.vars.palette.text.secondary,
       border: "1px solid",
-      borderColor: theme.palette.state?.active12,
-      background: theme.palette.state?.active12,
+      borderColor: theme.vars.palette.state?.active12,
+      background: theme.vars.palette.state?.active12,
       BorderRadius: "2px",
       outline: "none!important"
     },
     "&:hover": {
-      borderColor: theme.palette.state?.toneOp,
-      background: theme.palette.state?.hoverDefault
+      borderColor: theme.vars.palette.state?.toneOp,
+      background: theme.vars.palette.state?.hoverDefault
     }
   }),
-  inputFilterIcon: {},
+  inputFilterIcon: {
+    visibility: "visible"
+  },
   appliedFilters: ({ theme }) => ({
     gridArea: "applied-filters",
     width: "100%",
@@ -99,7 +101,7 @@ const dynamicFilterStyles = {
       padding: "4px",
       display: "flex",
       borderTop: "1px solid ",
-      borderColor: theme.palette.state?.borderSecondary,
+      borderColor: theme.vars.palette.state?.borderSecondary,
       "&:has(div[class*=appliedFilterInnerContainer]:empty), &:empty": {
         display: "none"
       }
@@ -134,17 +136,19 @@ const dynamicFilterStyles = {
     height: "24px",
     minHeight: theme.spacing(3),
     paddingLeft: theme.spacing(1),
-    borderColor: alpha(`${theme.palette.divider}`, 0.1),
+    borderColor: alpha(`${theme.colorSchemes.finalTheme.palette.divider}`, 0.1),
     border: "none",
     borderRadius: "4px",
-    backgroundColor: theme.palette.state?.default,
-    color: theme.palette.text.secondary,
+    backgroundColor: theme.vars.palette.state?.default,
+    color: theme.vars.palette.text.secondary,
     ...theme.typography.body,
     [theme.breakpoints.down("sm")]: {
       height: "fit-content"
     }
   }),
-  appliedFilterChipIcon: {},
+  appliedFilterChipIcon: {
+    visibility: "visible"
+  },
   appliedFilterChipInfo: ({ theme }) => ({
     ...theme.typography.body2,
     display: "flex",
@@ -160,20 +164,22 @@ const dynamicFilterStyles = {
   }),
   appliedFilterChipInfoFieldName: ({ theme }) => ({
     ...theme.typography.subtitle2,
-    color: theme.palette.text.secondary
+    color: theme.vars.palette.text.secondary
   }),
   appliedFilterChipInfoOperator: ({ theme }) => ({
     ...theme.typography.body2,
     marginLeft: theme.spacing(1.5),
     fontStyle: "italic",
-    color: theme.palette.text.secondary
+    color: theme.vars.palette.text.secondary
   }),
   appliedFilterChipInfoOperands: ({ theme }) => ({
     ...theme.typography.body2,
     marginLeft: theme.spacing(1.5),
-    color: theme.palette.text.secondary
+    color: theme.vars.palette.text.secondary
   }),
-  appliedFilterChipRemoveButton: {},
+  appliedFilterChipRemoveButton: {
+    visibility: "visible"
+  },
   actions: ({ theme }) => ({
     gridArea: "actions-filter",
     display: "flex",
@@ -185,7 +191,7 @@ const dynamicFilterStyles = {
     borderTopRightRadius: "4px",
     borderBottomRightRadius: "4px",
     borderLeft: "1px solid",
-    borderColor: theme.palette.state?.borderPrimary
+    borderColor: theme.vars.palette.state?.borderPrimary
   }),
   actionsSkeletonButton: {
     display: "flex",
@@ -194,9 +200,13 @@ const dynamicFilterStyles = {
     width: "24px",
     height: "24px"
   },
-  actionsClearButton: {},
+  actionsClearButton: {
+    visibility: "visible"
+  },
   actionsSubmitButton: ({ theme, ownerState }) => ({
-    ...ownerState.isValid === false ? { border: `1px dashed ${theme.palette.error.main}` } : {}
+    ...ownerState.isValid === false ? { border: `1px dashed ${theme.vars.palette.error.main}` } : {
+      visibility: "visible"
+    }
   }),
   popoverMenu: ({ theme }) => ({
     "& .MuiPaper-root": {
@@ -219,17 +229,19 @@ const dynamicFilterStyles = {
     borderRadius: "4px",
     "&:hover": {
       ...theme.typography.body,
-      color: theme.palette.state?.hover,
-      background: theme.palette.state?.default,
+      color: theme.vars.palette.state?.hover,
+      background: theme.vars.palette.state?.default,
       borderRadius: "4px",
       padding: "4px 12px 4px 8px"
     }
   }),
   popoverMenuItemLabel: ({ theme }) => ({
     ...theme.typography.body,
-    color: theme.palette.text.primary
+    color: theme.vars.palette.text.primary
   }),
-  popoverMenuItemIcon: {},
+  popoverMenuItemIcon: {
+    visibility: "visible"
+  },
   popoverFilter: ({ theme }) => ({
     width: "auto",
     "& .MuiPaper-root": {
@@ -237,7 +249,7 @@ const dynamicFilterStyles = {
       minWidth: "220px",
       maxWidth: "100%",
       minHeight: "auto",
-      boxShadow: theme.customShadows?.z3,
+      boxShadow: theme.vars.customShadows?.z3,
       "& .M4LPopover-arrowStyle": {
         display: "none"
       },
@@ -251,7 +263,7 @@ const dynamicFilterStyles = {
     }
   }),
   popoverFilterHeader: ({ theme }) => ({
-    backgroundColor: theme.palette.state?.default,
+    backgroundColor: theme.vars.palette.state?.default,
     display: "flex",
     alignItems: "center",
     gap: "8px",
@@ -264,10 +276,12 @@ const dynamicFilterStyles = {
       height: "36px"
     }
   }),
-  popoverFilterHeaderIcon: {},
+  popoverFilterHeaderIcon: {
+    visibility: "visible"
+  },
   popoverFilterHeaderTitle: ({ theme }) => ({
     ...theme.typography.paragraphDens,
-    color: theme.palette.text.primary
+    color: theme.vars.palette.text.primary
   }),
   popoverFilterContainerFields: ({ theme }) => ({
     height: "fit-content",

package/styles/DynamicFilter.styles.d.ts

@@ -1,2 +1,2 @@
-import { DynamicFilterStyles } from '../components/DynamicFilter/types';
+import type { DynamicFilterStyles } from '../components/DynamicFilter/types';
 export declare const dynamicFilterStyles: DynamicFilterStyles;

package/styles/{index.2129f144.js → index.1735a866.js}

@@ -1,14 +1,14 @@
 import { styled, alpha, Skeleton, Popover, IconButton, Stack, Tabs, Dialog, ListItemText, ListItemButton } from "@mui/material";
 import { styled as styled$1, alpha as alpha$1 } from "@mui/material/styles";
 import SimpleBarReact from "simplebar-react";
-import { h as gridLayoutClasses } from "../components/GridLayout/index.2a975f9d.js";
-import { a as ResizableBox } from "../react-resizable.3755959b.js";
-import { a as areasAdminClasses } from "../components/areas/components/AreasAdmin/index.92015229.js";
-import { a as areasViewerClasses } from "../components/areas/components/AreasViewer/index.5613b04c.js";
-import { g as gpsToolsClasses } from "../components/maps/components/GpsTools/index.3e432a7d.js";
-import { R as RHFormProvider } from "../contexts/RHFormContext/index.b08da209.js";
-import { S as Stack$1 } from "../components/mui_extended/Stack/index.5ffdbe1b.js";
-import { I as Image } from "../components/Image/index.31093474.js";
+import { h as gridLayoutClasses } from "../components/GridLayout/index.3b90ce9b.js";
+import { a as ResizableBox } from "../react-resizable.330f1499.js";
+import { a as areasAdminClasses } from "../components/areas/components/AreasAdmin/index.f3a211a4.js";
+import { a as areasViewerClasses } from "../components/areas/components/AreasViewer/index.8e9d24c2.js";
+import { g as gpsToolsClasses } from "../components/maps/components/GpsTools/index.44b82290.js";
+import { R as RHFormProvider } from "../contexts/RHFormContext/index.cedd3482.js";
+import { S as Stack$1 } from "../components/mui_extended/Stack/index.6516b2b5.js";
+import { I as Image } from "../components/Image/index.ec13c4a1.js";
 const RootStyle$1 = styled("div", {
   shouldForwardProp: (props) => props !== "variant"
 })(({ theme, variant }) => ({