@erpsquad/common 1.8.40 → 1.8.41

package/dist/components/expandable-summary-wrapper/expandable-summary-wrapper/index.esm.js

@@ -1,8 +1,17 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { useMemo, useState, useEffect } from "react";
-import { useTheme, useMediaQuery, IconButton, Drawer, Grid, Tooltip, Box, Collapse } from "@mui/material";
-import { ChevronLeft, ChevronRight, Close } from "@mui/icons-material";
 import { useLanguage } from "../../../hooks/useLangauge/index.esm.js";
+import useTheme from "../../../node_modules/@mui/material/styles/useTheme/index.esm.js";
+import useMediaQuery from "../../../node_modules/@mui/system/esm/useMediaQuery/useMediaQuery/index.esm.js";
+import IconButton from "../../../node_modules/@mui/material/IconButton/IconButton/index.esm.js";
+import ChevronLeft from "../../../node_modules/@mui/icons-material/esm/ChevronLeft/index.esm.js";
+import Drawer from "../../../node_modules/@mui/material/Drawer/Drawer/index.esm.js";
+import Grid from "../../../node_modules/@mui/material/Grid/Grid/index.esm.js";
+import Tooltip from "../../../node_modules/@mui/material/Tooltip/Tooltip/index.esm.js";
+import ChevronRight from "../../../node_modules/@mui/icons-material/esm/ChevronRight/index.esm.js";
+import Box from "../../../node_modules/@mui/material/Box/Box/index.esm.js";
+import Close from "../../../node_modules/@mui/icons-material/esm/Close/index.esm.js";
+import Collapse from "../../../node_modules/@mui/material/Collapse/Collapse/index.esm.js";
 const ExpandableSummaryWrapper = ({
   children,
   defaultExpanded = true,

package/dist/components/expandable-summary-wrapper/expandable-summary-wrapper/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../src/components/expandable-summary-wrapper/expandable-summary-wrapper.tsx"],"sourcesContent":["import React, { useState, ReactNode, useEffect, useMemo } from 'react';\nimport { \n  Grid, \n  IconButton, \n  Collapse, \n  useTheme, \n  useMediaQuery,\n  Tooltip,\n  Box,\n  Drawer\n} from '@mui/material';\nimport { \n  ChevronLeft, \n  ChevronRight,\n  Close,\n  // Close\n} from '@mui/icons-material';\nimport { useLanguage } from '../../hooks/useLangauge';\n\nexport interface ExpandableSummaryWrapperProps {\n  children: ReactNode;\n  defaultExpanded?: boolean;\n  expandedGridSize?: number; // Grid size when expanded (1-12)\n  collapsedGridSize?: number; // Grid size when collapsed (0-2)\n  className?: string;\n  ariaLabel?: string;\n  onToggle?: (isExpanded: boolean, newGridSize: number) => void;\n  persistState?: boolean;\n  storageKey?: string;\n  showToggleButton?: boolean;\n  mobileDrawer?: boolean; // Use drawer on mobile instead of grid\n  showCollapseIcon?: boolean; // Show collapse icon at top of summary\n}\n\nconst ExpandableSummaryWrapper: React.FC<ExpandableSummaryWrapperProps> = ({\n  children,\n  defaultExpanded = true,\n  expandedGridSize = 3,\n  collapsedGridSize = 0,\n  className = '',\n  ariaLabel = 'Toggle summary panel',\n  onToggle,\n  persistState = false,\n  storageKey = 'grid-summary-panel-state',\n  showToggleButton = true,\n  mobileDrawer = true,\n  showCollapseIcon = true\n}) => {\n  const theme = useTheme();\n  const isMobile = useMediaQuery(theme.breakpoints.down('md'));\nconst {currentLanguage}=useLanguage();\n  const isRtl=useMemo(()=>currentLanguage?.direction===\"rtl\",[currentLanguage])\n  // Initialize state with localStorage if persistState is enabled\n  const getInitialState = () => {\n    if (persistState && typeof window !== 'undefined') {\n      const stored = localStorage.getItem(storageKey);\n      return stored ? JSON.parse(stored) : defaultExpanded;\n    }\n    return defaultExpanded;\n  };\n\n  const [isExpanded, setIsExpanded] = useState<boolean>(getInitialState);\n  // Add this state to your component\n  const [showAfterDelay, setShowAfterDelay] = useState(false);\n\n  // Add this useEffect\n  useEffect(() => {\n    if(!isExpanded) {\n      setShowAfterDelay(false)\n       return\n    }\n    const timer = setTimeout(() => {\n      setShowAfterDelay(true);\n    }, 250);\n\n    return () => clearTimeout(timer);\n  }, [isExpanded]);\n\n  const handleToggle = () => {\n    const newState = !isExpanded;\n    const newGridSize = newState ? expandedGridSize : collapsedGridSize;\n    setIsExpanded(newState);\n    \n    // Persist state if enabled\n    if (persistState && typeof window !== 'undefined') {\n      localStorage.setItem(storageKey, JSON.stringify(newState));\n    }\n    \n    // Call external toggle handler with new grid size\n    onToggle?.(newState, newGridSize);\n  };\n\n  const currentGridSize = isExpanded ? expandedGridSize : collapsedGridSize;\n\n  // Mobile drawer implementation\n  if (isMobile && mobileDrawer) {\n    return (\n      <>\n        {/* Mobile Toggle Button */}\n        {showToggleButton && (\n          <IconButton\n            onClick={handleToggle}\n            sx={{\n              position: 'fixed',\n              top: '50%',\n              [isRtl ? 'left' : 'right']: 0,\n              zIndex: theme.zIndex.fab,\n              bgcolor: theme.palette.background.paper,\n              border: `1px solid ${theme.palette.divider}`,\n              borderRadius: '8px 0 0 8px',\n              '&:hover': {\n                bgcolor: theme.palette.action.hover,\n              },\n            }}\n            aria-label={ariaLabel}\n          >\n            <ChevronLeft />\n          </IconButton>\n        )}\n\n        {/* Mobile Drawer */}\n        <Drawer\n          anchor=\"right\"\n          open={isExpanded}\n          onClose={handleToggle}\n          sx={(theme) => ({\n            '& .MuiDrawer-paper': {\n              width: '90vw',\n              [theme.breakpoints.up('md')]: {\n                maxWidth: '400px',\n                marginTop: '65px',\n              },\n              [theme.breakpoints.up('sm')]: {\n                maxWidth: '300px',\n                marginTop: '65px',\n              },\n              [theme.breakpoints.up('xs')]: {\n                maxWidth: '200px',\n                marginTop: '56px',\n              }\n            },\n          })}\n        >\n         {children}\n        </Drawer>\n      </>\n    );\n  }\n\n  // Desktop/Tablet Grid implementation\n  return (\n    <Grid \n      item \n      xs={currentGridSize} \n      sx={{\n        position: 'relative',\n        transition: theme.transitions.create(['flex-basis', 'max-width'], {\n          easing: theme.transitions.easing.sharp,\n          duration: theme.transitions.duration.enteringScreen,\n        }),\n        overflow: 'visible', // Changed from 'hidden' to allow button outside\n        minHeight: '100%',\n        // Ensure grid item is visible even when size is 0\n        display: currentGridSize === 0 ? 'block' : 'block',\n        minWidth: currentGridSize === 0 ? 0 : 'auto',\n      }}\n      className={className}\n    >\n      {/* Alternative toggle button for completely collapsed state */}\n      {(showToggleButton && !isExpanded) && (\n        <Tooltip title=\"Expand summary\" placement=\"left\">\n          <IconButton\n            onClick={handleToggle}\n            sx={{\n              position: 'fixed',\n              top: '14%',\n              [isRtl ? 'left' : 'right']: 0,\n              width:'30px',\n              zIndex: theme.zIndex.fab,\n              bgcolor: theme.palette.background.paper,\n              border: `1px solid ${theme.palette.divider}`,\n              borderRadius: '8px 0 0 8px',\n              '&:hover': {\n                bgcolor: theme.palette.action.hover,\n              },\n            }}\n            aria-label=\"Expand summary panel\"\n          >\n            {!isExpanded ? <ChevronLeft /> : <ChevronRight />}\n          </IconButton>\n        </Tooltip>\n      )}\n\n      {/* Content Container */}\n      {(currentGridSize > 0 && showAfterDelay) && (\n        <Box\n          sx={{\n            height: '100%',\n            width: '100%',\n            overflow: 'visible',\n            display: 'flex',\n            flexDirection: 'column',\n            bgcolor: theme.palette.background.paper,\n            borderLeft: `1px solid ${theme.palette.divider}`,\n            borderRadius: '8px 0 0 8px',\n            position: 'relative',\n          }}\n        >\n          {/* Fixed Collapse Icon at Top of Summary */}\n          {showCollapseIcon && isExpanded && (\n            <Tooltip title=\"Close summary\" placement=\"left\">\n              <IconButton\n                onClick={handleToggle}\n                size='small'\n                sx={{\n                  position: 'absolute',\n                  top: '-15px',\n                  [isRtl ? 'right' : 'left']: '-15px',\n                  zIndex: 1200,\n                  bgcolor: theme.palette.background.paper,\n                  border: `1px solid ${theme.palette.divider}`,\n                  borderRadius: '50%',\n                  '&:hover': {\n                    bgcolor: '#fff',\n                  },\n                  boxShadow: 'none',\n                }}\n              >\n                <Close sx={{ fontSize: 14 }} />\n              </IconButton>\n            </Tooltip>\n          )}\n\n          <Collapse \n            in={isExpanded} \n            orientation=\"horizontal\" \n            sx={{ \n              height: '100%',\n              '& .MuiCollapse-wrapperInner': {\n                height: '100%',\n                width: '100%',\n              },\n              width: '100%',\n            }}\n          >\n            <Box sx={{ \n              width: '100%', \n              height: '100%', \n              overflow: 'auto',\n              minWidth: 0,\n              // pt: showCollapseIcon ? 6 : 0, // Add padding top when collapse icon is shown\n            }}>\n              {children}\n            </Box>\n          </Collapse>\n\n          {/* Collapsed State Indicator for partial collapse */}\n          {!isExpanded && (\n            <Box\n              sx={{\n                display: 'flex',\n                flexDirection: 'column',\n                alignItems: 'center',\n                justifyContent: 'center',\n                height: '100%',\n                width: '100%',\n                color: theme.palette.text.secondary,\n                cursor: 'pointer',\n              }}\n              onClick={handleToggle}\n            >\n              <Box\n                sx={{\n                  writingMode: 'vertical-lr',\n                  textOrientation: 'mixed',\n                  fontSize: '0.875rem',\n                  fontWeight: 500,\n                  letterSpacing: '0.1em',\n                }}\n              >\n                SUMMARY\n              </Box>\n            </Box>\n          )}\n        </Box>\n      )}\n    </Grid>\n  );\n};\n\nexport default ExpandableSummaryWrapper;\n"],"names":["theme"],"mappings":"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"}
+{"version":3,"file":"index.esm.js","sources":["../../../../src/components/expandable-summary-wrapper/expandable-summary-wrapper.tsx"],"sourcesContent":["import React, { useState, ReactNode, useEffect, useMemo } from 'react';\nimport { \n  Grid, \n  IconButton, \n  Collapse, \n  useTheme, \n  useMediaQuery,\n  Tooltip,\n  Box,\n  Drawer\n} from '@mui/material';\nimport { \n  ChevronLeft, \n  ChevronRight,\n  Close,\n  // Close\n} from '@mui/icons-material';\nimport { useLanguage } from '../../hooks/useLangauge';\n\nexport interface ExpandableSummaryWrapperProps {\n  children: ReactNode;\n  defaultExpanded?: boolean;\n  expandedGridSize?: number; // Grid size when expanded (1-12)\n  collapsedGridSize?: number; // Grid size when collapsed (0-2)\n  className?: string;\n  ariaLabel?: string;\n  onToggle?: (isExpanded: boolean, newGridSize: number) => void;\n  persistState?: boolean;\n  storageKey?: string;\n  showToggleButton?: boolean;\n  mobileDrawer?: boolean; // Use drawer on mobile instead of grid\n  showCollapseIcon?: boolean; // Show collapse icon at top of summary\n}\n\nconst ExpandableSummaryWrapper: React.FC<ExpandableSummaryWrapperProps> = ({\n  children,\n  defaultExpanded = true,\n  expandedGridSize = 3,\n  collapsedGridSize = 0,\n  className = '',\n  ariaLabel = 'Toggle summary panel',\n  onToggle,\n  persistState = false,\n  storageKey = 'grid-summary-panel-state',\n  showToggleButton = true,\n  mobileDrawer = true,\n  showCollapseIcon = true\n}) => {\n  const theme = useTheme();\n  const isMobile = useMediaQuery(theme.breakpoints.down('md'));\nconst {currentLanguage}=useLanguage();\n  const isRtl=useMemo(()=>currentLanguage?.direction===\"rtl\",[currentLanguage])\n  // Initialize state with localStorage if persistState is enabled\n  const getInitialState = () => {\n    if (persistState && typeof window !== 'undefined') {\n      const stored = localStorage.getItem(storageKey);\n      return stored ? JSON.parse(stored) : defaultExpanded;\n    }\n    return defaultExpanded;\n  };\n\n  const [isExpanded, setIsExpanded] = useState<boolean>(getInitialState);\n  // Add this state to your component\n  const [showAfterDelay, setShowAfterDelay] = useState(false);\n\n  // Add this useEffect\n  useEffect(() => {\n    if(!isExpanded) {\n      setShowAfterDelay(false)\n       return\n    }\n    const timer = setTimeout(() => {\n      setShowAfterDelay(true);\n    }, 250);\n\n    return () => clearTimeout(timer);\n  }, [isExpanded]);\n\n  const handleToggle = () => {\n    const newState = !isExpanded;\n    const newGridSize = newState ? expandedGridSize : collapsedGridSize;\n    setIsExpanded(newState);\n    \n    // Persist state if enabled\n    if (persistState && typeof window !== 'undefined') {\n      localStorage.setItem(storageKey, JSON.stringify(newState));\n    }\n    \n    // Call external toggle handler with new grid size\n    onToggle?.(newState, newGridSize);\n  };\n\n  const currentGridSize = isExpanded ? expandedGridSize : collapsedGridSize;\n\n  // Mobile drawer implementation\n  if (isMobile && mobileDrawer) {\n    return (\n      <>\n        {/* Mobile Toggle Button */}\n        {showToggleButton && (\n          <IconButton\n            onClick={handleToggle}\n            sx={{\n              position: 'fixed',\n              top: '50%',\n              [isRtl ? 'left' : 'right']: 0,\n              zIndex: theme.zIndex.fab,\n              bgcolor: theme.palette.background.paper,\n              border: `1px solid ${theme.palette.divider}`,\n              borderRadius: '8px 0 0 8px',\n              '&:hover': {\n                bgcolor: theme.palette.action.hover,\n              },\n            }}\n            aria-label={ariaLabel}\n          >\n            <ChevronLeft />\n          </IconButton>\n        )}\n\n        {/* Mobile Drawer */}\n        <Drawer\n          anchor=\"right\"\n          open={isExpanded}\n          onClose={handleToggle}\n          sx={(theme) => ({\n            '& .MuiDrawer-paper': {\n              width: '90vw',\n              [theme.breakpoints.up('md')]: {\n                maxWidth: '400px',\n                marginTop: '65px',\n              },\n              [theme.breakpoints.up('sm')]: {\n                maxWidth: '300px',\n                marginTop: '65px',\n              },\n              [theme.breakpoints.up('xs')]: {\n                maxWidth: '200px',\n                marginTop: '56px',\n              }\n            },\n          })}\n        >\n         {children}\n        </Drawer>\n      </>\n    );\n  }\n\n  // Desktop/Tablet Grid implementation\n  return (\n    <Grid \n      item \n      xs={currentGridSize} \n      sx={{\n        position: 'relative',\n        transition: theme.transitions.create(['flex-basis', 'max-width'], {\n          easing: theme.transitions.easing.sharp,\n          duration: theme.transitions.duration.enteringScreen,\n        }),\n        overflow: 'visible', // Changed from 'hidden' to allow button outside\n        minHeight: '100%',\n        // Ensure grid item is visible even when size is 0\n        display: currentGridSize === 0 ? 'block' : 'block',\n        minWidth: currentGridSize === 0 ? 0 : 'auto',\n      }}\n      className={className}\n    >\n      {/* Alternative toggle button for completely collapsed state */}\n      {(showToggleButton && !isExpanded) && (\n        <Tooltip title=\"Expand summary\" placement=\"left\">\n          <IconButton\n            onClick={handleToggle}\n            sx={{\n              position: 'fixed',\n              top: '14%',\n              [isRtl ? 'left' : 'right']: 0,\n              width:'30px',\n              zIndex: theme.zIndex.fab,\n              bgcolor: theme.palette.background.paper,\n              border: `1px solid ${theme.palette.divider}`,\n              borderRadius: '8px 0 0 8px',\n              '&:hover': {\n                bgcolor: theme.palette.action.hover,\n              },\n            }}\n            aria-label=\"Expand summary panel\"\n          >\n            {!isExpanded ? <ChevronLeft /> : <ChevronRight />}\n          </IconButton>\n        </Tooltip>\n      )}\n\n      {/* Content Container */}\n      {(currentGridSize > 0 && showAfterDelay) && (\n        <Box\n          sx={{\n            height: '100%',\n            width: '100%',\n            overflow: 'visible',\n            display: 'flex',\n            flexDirection: 'column',\n            bgcolor: theme.palette.background.paper,\n            borderLeft: `1px solid ${theme.palette.divider}`,\n            borderRadius: '8px 0 0 8px',\n            position: 'relative',\n          }}\n        >\n          {/* Fixed Collapse Icon at Top of Summary */}\n          {showCollapseIcon && isExpanded && (\n            <Tooltip title=\"Close summary\" placement=\"left\">\n              <IconButton\n                onClick={handleToggle}\n                size='small'\n                sx={{\n                  position: 'absolute',\n                  top: '-15px',\n                  [isRtl ? 'right' : 'left']: '-15px',\n                  zIndex: 1200,\n                  bgcolor: theme.palette.background.paper,\n                  border: `1px solid ${theme.palette.divider}`,\n                  borderRadius: '50%',\n                  '&:hover': {\n                    bgcolor: '#fff',\n                  },\n                  boxShadow: 'none',\n                }}\n              >\n                <Close sx={{ fontSize: 14 }} />\n              </IconButton>\n            </Tooltip>\n          )}\n\n          <Collapse \n            in={isExpanded} \n            orientation=\"horizontal\" \n            sx={{ \n              height: '100%',\n              '& .MuiCollapse-wrapperInner': {\n                height: '100%',\n                width: '100%',\n              },\n              width: '100%',\n            }}\n          >\n            <Box sx={{ \n              width: '100%', \n              height: '100%', \n              overflow: 'auto',\n              minWidth: 0,\n              // pt: showCollapseIcon ? 6 : 0, // Add padding top when collapse icon is shown\n            }}>\n              {children}\n            </Box>\n          </Collapse>\n\n          {/* Collapsed State Indicator for partial collapse */}\n          {!isExpanded && (\n            <Box\n              sx={{\n                display: 'flex',\n                flexDirection: 'column',\n                alignItems: 'center',\n                justifyContent: 'center',\n                height: '100%',\n                width: '100%',\n                color: theme.palette.text.secondary,\n                cursor: 'pointer',\n              }}\n              onClick={handleToggle}\n            >\n              <Box\n                sx={{\n                  writingMode: 'vertical-lr',\n                  textOrientation: 'mixed',\n                  fontSize: '0.875rem',\n                  fontWeight: 500,\n                  letterSpacing: '0.1em',\n                }}\n              >\n                SUMMARY\n              </Box>\n            </Box>\n          )}\n        </Box>\n      )}\n    </Grid>\n  );\n};\n\nexport default ExpandableSummaryWrapper;\n"],"names":["theme"],"mappings":"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"}

package/dist/components/expandable-summary-wrapper/expandable-summary-wrapper/index.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("@mui/material"),r=require("@mui/icons-material"),o=require("../../../hooks/useLangauge/index.js");exports.default=({children:n,defaultExpanded:a=!0,expandedGridSize:s=3,collapsedGridSize:l=0,className:d="",ariaLabel:p="Toggle summary panel",onToggle:x,persistState:c=!1,storageKey:u="grid-summary-panel-state",showToggleButton:h=!0,mobileDrawer:g=!0,showCollapseIcon:m=!0})=>{const f=i.useTheme(),b=i.useMediaQuery(f.breakpoints.down("md")),{currentLanguage:v}=o.useLanguage(),w=t.useMemo(()=>"rtl"===(null==v?void 0:v.direction),[v]),[j,y]=t.useState(()=>{if(c&&"undefined"!=typeof window){const e=localStorage.getItem(u);return e?JSON.parse(e):a}return a}),[S,k]=t.useState(!1);t.useEffect(()=>{if(!j)return void k(!1);const e=setTimeout(()=>{k(!0)},250);return()=>clearTimeout(e)},[j]);const C=()=>{const e=!j,t=e?s:l;y(e),c&&"undefined"!=typeof window&&localStorage.setItem(u,JSON.stringify(e)),null==x||x(e,t)},I=j?s:l;return b&&g?/* @__PURE__ */e.jsxs(e.Fragment,{children:[h&&/* @__PURE__ */e.jsx(i.IconButton,{onClick:C,sx:{position:"fixed",top:"50%",[w?"left":"right"]:0,zIndex:f.zIndex.fab,bgcolor:f.palette.background.paper,border:`1px solid ${f.palette.divider}`,borderRadius:"8px 0 0 8px","&:hover":{bgcolor:f.palette.action.hover}},"aria-label":p,children:/* @__PURE__ */e.jsx(r.ChevronLeft,{})}),
-/* @__PURE__ */e.jsx(i.Drawer,{anchor:"right",open:j,onClose:C,sx:e=>({"& .MuiDrawer-paper":{width:"90vw",[e.breakpoints.up("md")]:{maxWidth:"400px",marginTop:"65px"},[e.breakpoints.up("sm")]:{maxWidth:"300px",marginTop:"65px"},[e.breakpoints.up("xs")]:{maxWidth:"200px",marginTop:"56px"}}}),children:n})]}):/* @__PURE__ */e.jsxs(i.Grid,{item:!0,xs:I,sx:{position:"relative",transition:f.transitions.create(["flex-basis","max-width"],{easing:f.transitions.easing.sharp,duration:f.transitions.duration.enteringScreen}),overflow:"visible",minHeight:"100%",display:"block",minWidth:0===I?0:"auto"},className:d,children:[h&&!j&&/* @__PURE__ */e.jsx(i.Tooltip,{title:"Expand summary",placement:"left",children:/* @__PURE__ */e.jsx(i.IconButton,{onClick:C,sx:{position:"fixed",top:"14%",[w?"left":"right"]:0,width:"30px",zIndex:f.zIndex.fab,bgcolor:f.palette.background.paper,border:`1px solid ${f.palette.divider}`,borderRadius:"8px 0 0 8px","&:hover":{bgcolor:f.palette.action.hover}},"aria-label":"Expand summary panel",children:j?/* @__PURE__ */e.jsx(r.ChevronRight,{}):/* @__PURE__ */e.jsx(r.ChevronLeft,{})})}),I>0&&S&&/* @__PURE__ */e.jsxs(i.Box,{sx:{height:"100%",width:"100%",overflow:"visible",display:"flex",flexDirection:"column",bgcolor:f.palette.background.paper,borderLeft:`1px solid ${f.palette.divider}`,borderRadius:"8px 0 0 8px",position:"relative"},children:[m&&j&&/* @__PURE__ */e.jsx(i.Tooltip,{title:"Close summary",placement:"left",children:/* @__PURE__ */e.jsx(i.IconButton,{onClick:C,size:"small",sx:{position:"absolute",top:"-15px",[w?"right":"left"]:"-15px",zIndex:1200,bgcolor:f.palette.background.paper,border:`1px solid ${f.palette.divider}`,borderRadius:"50%","&:hover":{bgcolor:"#fff"},boxShadow:"none"},children:/* @__PURE__ */e.jsx(r.Close,{sx:{fontSize:14}})})}),
-/* @__PURE__ */e.jsx(i.Collapse,{in:j,orientation:"horizontal",sx:{height:"100%","& .MuiCollapse-wrapperInner":{height:"100%",width:"100%"},width:"100%"},children:/* @__PURE__ */e.jsx(i.Box,{sx:{width:"100%",height:"100%",overflow:"auto",minWidth:0},children:n})}),!j&&/* @__PURE__ */e.jsx(i.Box,{sx:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",height:"100%",width:"100%",color:f.palette.text.secondary,cursor:"pointer"},onClick:C,children:/* @__PURE__ */e.jsx(i.Box,{sx:{writingMode:"vertical-lr",textOrientation:"mixed",fontSize:"0.875rem",fontWeight:500,letterSpacing:"0.1em"},children:"SUMMARY"})})]})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),t=require("../../../hooks/useLangauge/index.js"),r=require("../../../node_modules/@mui/material/styles/useTheme/index.js"),o=require("../../../node_modules/@mui/system/esm/useMediaQuery/useMediaQuery/index.js"),a=require("../../../node_modules/@mui/material/IconButton/IconButton/index.js"),n=require("../../../node_modules/@mui/icons-material/esm/ChevronLeft/index.js"),l=require("../../../node_modules/@mui/material/Drawer/Drawer/index.js"),s=require("../../../node_modules/@mui/material/Grid/Grid/index.js"),d=require("../../../node_modules/@mui/material/Tooltip/Tooltip/index.js"),u=require("../../../node_modules/@mui/icons-material/esm/ChevronRight/index.js"),p=require("../../../node_modules/@mui/material/Box/Box/index.js"),x=require("../../../node_modules/@mui/icons-material/esm/Close/index.js"),m=require("../../../node_modules/@mui/material/Collapse/Collapse/index.js");exports.default=({children:c,defaultExpanded:h=!0,expandedGridSize:f=3,collapsedGridSize:g=0,className:b="",ariaLabel:j="Toggle summary panel",onToggle:w,persistState:v=!1,storageKey:y="grid-summary-panel-state",showToggleButton:S=!0,mobileDrawer:k=!0,showCollapseIcon:q=!0})=>{const C=r.default(),_=o.default(C.breakpoints.down("md")),{currentLanguage:I}=t.useLanguage(),z=i.useMemo(()=>"rtl"===(null==I?void 0:I.direction),[I]),[T,M]=i.useState(()=>{if(v&&"undefined"!=typeof window){const e=localStorage.getItem(y);return e?JSON.parse(e):h}return h}),[D,L]=i.useState(!1);i.useEffect(()=>{if(!T)return void L(!1);const e=setTimeout(()=>{L(!0)},250);return()=>clearTimeout(e)},[T]);const R=()=>{const e=!T,i=e?f:g;M(e),v&&"undefined"!=typeof window&&localStorage.setItem(y,JSON.stringify(e)),null==w||w(e,i)},W=T?f:g;return _&&k?/* @__PURE__ */e.jsxs(e.Fragment,{children:[S&&/* @__PURE__ */e.jsx(a.default,{onClick:R,sx:{position:"fixed",top:"50%",[z?"left":"right"]:0,zIndex:C.zIndex.fab,bgcolor:C.palette.background.paper,border:`1px solid ${C.palette.divider}`,borderRadius:"8px 0 0 8px","&:hover":{bgcolor:C.palette.action.hover}},"aria-label":j,children:/* @__PURE__ */e.jsx(n.default,{})}),
+/* @__PURE__ */e.jsx(l.default,{anchor:"right",open:T,onClose:R,sx:e=>({"& .MuiDrawer-paper":{width:"90vw",[e.breakpoints.up("md")]:{maxWidth:"400px",marginTop:"65px"},[e.breakpoints.up("sm")]:{maxWidth:"300px",marginTop:"65px"},[e.breakpoints.up("xs")]:{maxWidth:"200px",marginTop:"56px"}}}),children:c})]}):/* @__PURE__ */e.jsxs(s.default,{item:!0,xs:W,sx:{position:"relative",transition:C.transitions.create(["flex-basis","max-width"],{easing:C.transitions.easing.sharp,duration:C.transitions.duration.enteringScreen}),overflow:"visible",minHeight:"100%",display:"block",minWidth:0===W?0:"auto"},className:b,children:[S&&!T&&/* @__PURE__ */e.jsx(d.default,{title:"Expand summary",placement:"left",children:/* @__PURE__ */e.jsx(a.default,{onClick:R,sx:{position:"fixed",top:"14%",[z?"left":"right"]:0,width:"30px",zIndex:C.zIndex.fab,bgcolor:C.palette.background.paper,border:`1px solid ${C.palette.divider}`,borderRadius:"8px 0 0 8px","&:hover":{bgcolor:C.palette.action.hover}},"aria-label":"Expand summary panel",children:T?/* @__PURE__ */e.jsx(u.default,{}):/* @__PURE__ */e.jsx(n.default,{})})}),W>0&&D&&/* @__PURE__ */e.jsxs(p.default,{sx:{height:"100%",width:"100%",overflow:"visible",display:"flex",flexDirection:"column",bgcolor:C.palette.background.paper,borderLeft:`1px solid ${C.palette.divider}`,borderRadius:"8px 0 0 8px",position:"relative"},children:[q&&T&&/* @__PURE__ */e.jsx(d.default,{title:"Close summary",placement:"left",children:/* @__PURE__ */e.jsx(a.default,{onClick:R,size:"small",sx:{position:"absolute",top:"-15px",[z?"right":"left"]:"-15px",zIndex:1200,bgcolor:C.palette.background.paper,border:`1px solid ${C.palette.divider}`,borderRadius:"50%","&:hover":{bgcolor:"#fff"},boxShadow:"none"},children:/* @__PURE__ */e.jsx(x.default,{sx:{fontSize:14}})})}),
+/* @__PURE__ */e.jsx(m.default,{in:T,orientation:"horizontal",sx:{height:"100%","& .MuiCollapse-wrapperInner":{height:"100%",width:"100%"},width:"100%"},children:/* @__PURE__ */e.jsx(p.default,{sx:{width:"100%",height:"100%",overflow:"auto",minWidth:0},children:c})}),!T&&/* @__PURE__ */e.jsx(p.default,{sx:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",height:"100%",width:"100%",color:C.palette.text.secondary,cursor:"pointer"},onClick:R,children:/* @__PURE__ */e.jsx(p.default,{sx:{writingMode:"vertical-lr",textOrientation:"mixed",fontSize:"0.875rem",fontWeight:500,letterSpacing:"0.1em"},children:"SUMMARY"})})]})]})};
 //# sourceMappingURL=index.js.map

package/dist/components/expandable-summary-wrapper/expandable-summary-wrapper/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/expandable-summary-wrapper/expandable-summary-wrapper.tsx"],"sourcesContent":["import React, { useState, ReactNode, useEffect, useMemo } from 'react';\nimport { \n  Grid, \n  IconButton, \n  Collapse, \n  useTheme, \n  useMediaQuery,\n  Tooltip,\n  Box,\n  Drawer\n} from '@mui/material';\nimport { \n  ChevronLeft, \n  ChevronRight,\n  Close,\n  // Close\n} from '@mui/icons-material';\nimport { useLanguage } from '../../hooks/useLangauge';\n\nexport interface ExpandableSummaryWrapperProps {\n  children: ReactNode;\n  defaultExpanded?: boolean;\n  expandedGridSize?: number; // Grid size when expanded (1-12)\n  collapsedGridSize?: number; // Grid size when collapsed (0-2)\n  className?: string;\n  ariaLabel?: string;\n  onToggle?: (isExpanded: boolean, newGridSize: number) => void;\n  persistState?: boolean;\n  storageKey?: string;\n  showToggleButton?: boolean;\n  mobileDrawer?: boolean; // Use drawer on mobile instead of grid\n  showCollapseIcon?: boolean; // Show collapse icon at top of summary\n}\n\nconst ExpandableSummaryWrapper: React.FC<ExpandableSummaryWrapperProps> = ({\n  children,\n  defaultExpanded = true,\n  expandedGridSize = 3,\n  collapsedGridSize = 0,\n  className = '',\n  ariaLabel = 'Toggle summary panel',\n  onToggle,\n  persistState = false,\n  storageKey = 'grid-summary-panel-state',\n  showToggleButton = true,\n  mobileDrawer = true,\n  showCollapseIcon = true\n}) => {\n  const theme = useTheme();\n  const isMobile = useMediaQuery(theme.breakpoints.down('md'));\nconst {currentLanguage}=useLanguage();\n  const isRtl=useMemo(()=>currentLanguage?.direction===\"rtl\",[currentLanguage])\n  // Initialize state with localStorage if persistState is enabled\n  const getInitialState = () => {\n    if (persistState && typeof window !== 'undefined') {\n      const stored = localStorage.getItem(storageKey);\n      return stored ? JSON.parse(stored) : defaultExpanded;\n    }\n    return defaultExpanded;\n  };\n\n  const [isExpanded, setIsExpanded] = useState<boolean>(getInitialState);\n  // Add this state to your component\n  const [showAfterDelay, setShowAfterDelay] = useState(false);\n\n  // Add this useEffect\n  useEffect(() => {\n    if(!isExpanded) {\n      setShowAfterDelay(false)\n       return\n    }\n    const timer = setTimeout(() => {\n      setShowAfterDelay(true);\n    }, 250);\n\n    return () => clearTimeout(timer);\n  }, [isExpanded]);\n\n  const handleToggle = () => {\n    const newState = !isExpanded;\n    const newGridSize = newState ? expandedGridSize : collapsedGridSize;\n    setIsExpanded(newState);\n    \n    // Persist state if enabled\n    if (persistState && typeof window !== 'undefined') {\n      localStorage.setItem(storageKey, JSON.stringify(newState));\n    }\n    \n    // Call external toggle handler with new grid size\n    onToggle?.(newState, newGridSize);\n  };\n\n  const currentGridSize = isExpanded ? expandedGridSize : collapsedGridSize;\n\n  // Mobile drawer implementation\n  if (isMobile && mobileDrawer) {\n    return (\n      <>\n        {/* Mobile Toggle Button */}\n        {showToggleButton && (\n          <IconButton\n            onClick={handleToggle}\n            sx={{\n              position: 'fixed',\n              top: '50%',\n              [isRtl ? 'left' : 'right']: 0,\n              zIndex: theme.zIndex.fab,\n              bgcolor: theme.palette.background.paper,\n              border: `1px solid ${theme.palette.divider}`,\n              borderRadius: '8px 0 0 8px',\n              '&:hover': {\n                bgcolor: theme.palette.action.hover,\n              },\n            }}\n            aria-label={ariaLabel}\n          >\n            <ChevronLeft />\n          </IconButton>\n        )}\n\n        {/* Mobile Drawer */}\n        <Drawer\n          anchor=\"right\"\n          open={isExpanded}\n          onClose={handleToggle}\n          sx={(theme) => ({\n            '& .MuiDrawer-paper': {\n              width: '90vw',\n              [theme.breakpoints.up('md')]: {\n                maxWidth: '400px',\n                marginTop: '65px',\n              },\n              [theme.breakpoints.up('sm')]: {\n                maxWidth: '300px',\n                marginTop: '65px',\n              },\n              [theme.breakpoints.up('xs')]: {\n                maxWidth: '200px',\n                marginTop: '56px',\n              }\n            },\n          })}\n        >\n         {children}\n        </Drawer>\n      </>\n    );\n  }\n\n  // Desktop/Tablet Grid implementation\n  return (\n    <Grid \n      item \n      xs={currentGridSize} \n      sx={{\n        position: 'relative',\n        transition: theme.transitions.create(['flex-basis', 'max-width'], {\n          easing: theme.transitions.easing.sharp,\n          duration: theme.transitions.duration.enteringScreen,\n        }),\n        overflow: 'visible', // Changed from 'hidden' to allow button outside\n        minHeight: '100%',\n        // Ensure grid item is visible even when size is 0\n        display: currentGridSize === 0 ? 'block' : 'block',\n        minWidth: currentGridSize === 0 ? 0 : 'auto',\n      }}\n      className={className}\n    >\n      {/* Alternative toggle button for completely collapsed state */}\n      {(showToggleButton && !isExpanded) && (\n        <Tooltip title=\"Expand summary\" placement=\"left\">\n          <IconButton\n            onClick={handleToggle}\n            sx={{\n              position: 'fixed',\n              top: '14%',\n              [isRtl ? 'left' : 'right']: 0,\n              width:'30px',\n              zIndex: theme.zIndex.fab,\n              bgcolor: theme.palette.background.paper,\n              border: `1px solid ${theme.palette.divider}`,\n              borderRadius: '8px 0 0 8px',\n              '&:hover': {\n                bgcolor: theme.palette.action.hover,\n              },\n            }}\n            aria-label=\"Expand summary panel\"\n          >\n            {!isExpanded ? <ChevronLeft /> : <ChevronRight />}\n          </IconButton>\n        </Tooltip>\n      )}\n\n      {/* Content Container */}\n      {(currentGridSize > 0 && showAfterDelay) && (\n        <Box\n          sx={{\n            height: '100%',\n            width: '100%',\n            overflow: 'visible',\n            display: 'flex',\n            flexDirection: 'column',\n            bgcolor: theme.palette.background.paper,\n            borderLeft: `1px solid ${theme.palette.divider}`,\n            borderRadius: '8px 0 0 8px',\n            position: 'relative',\n          }}\n        >\n          {/* Fixed Collapse Icon at Top of Summary */}\n          {showCollapseIcon && isExpanded && (\n            <Tooltip title=\"Close summary\" placement=\"left\">\n              <IconButton\n                onClick={handleToggle}\n                size='small'\n                sx={{\n                  position: 'absolute',\n                  top: '-15px',\n                  [isRtl ? 'right' : 'left']: '-15px',\n                  zIndex: 1200,\n                  bgcolor: theme.palette.background.paper,\n                  border: `1px solid ${theme.palette.divider}`,\n                  borderRadius: '50%',\n                  '&:hover': {\n                    bgcolor: '#fff',\n                  },\n                  boxShadow: 'none',\n                }}\n              >\n                <Close sx={{ fontSize: 14 }} />\n              </IconButton>\n            </Tooltip>\n          )}\n\n          <Collapse \n            in={isExpanded} \n            orientation=\"horizontal\" \n            sx={{ \n              height: '100%',\n              '& .MuiCollapse-wrapperInner': {\n                height: '100%',\n                width: '100%',\n              },\n              width: '100%',\n            }}\n          >\n            <Box sx={{ \n              width: '100%', \n              height: '100%', \n              overflow: 'auto',\n              minWidth: 0,\n              // pt: showCollapseIcon ? 6 : 0, // Add padding top when collapse icon is shown\n            }}>\n              {children}\n            </Box>\n          </Collapse>\n\n          {/* Collapsed State Indicator for partial collapse */}\n          {!isExpanded && (\n            <Box\n              sx={{\n                display: 'flex',\n                flexDirection: 'column',\n                alignItems: 'center',\n                justifyContent: 'center',\n                height: '100%',\n                width: '100%',\n                color: theme.palette.text.secondary,\n                cursor: 'pointer',\n              }}\n              onClick={handleToggle}\n            >\n              <Box\n                sx={{\n                  writingMode: 'vertical-lr',\n                  textOrientation: 'mixed',\n                  fontSize: '0.875rem',\n                  fontWeight: 500,\n                  letterSpacing: '0.1em',\n                }}\n              >\n                SUMMARY\n              </Box>\n            </Box>\n          )}\n        </Box>\n      )}\n    </Grid>\n  );\n};\n\nexport default ExpandableSummaryWrapper;\n"],"names":["children","defaultExpanded","expandedGridSize","collapsedGridSize","className","ariaLabel","onToggle","persistState","storageKey","showToggleButton","mobileDrawer","showCollapseIcon","theme","useTheme","isMobile","useMediaQuery","breakpoints","down","currentLanguage","useLanguage","isRtl","useMemo","direction","isExpanded","setIsExpanded","useState","window","stored","localStorage","getItem","JSON","parse","showAfterDelay","setShowAfterDelay","useEffect","timer","setTimeout","clearTimeout","handleToggle","newState","newGridSize","setItem","stringify","currentGridSize","jsxs","Fragment","jsx","IconButton","onClick","sx","position","top","zIndex","fab","bgcolor","palette","background","paper","border","divider","borderRadius","action","hover","ChevronLeft","Drawer","anchor","open","onClose","width","up","maxWidth","marginTop","Grid","item","xs","transition","transitions","create","easing","sharp","duration","enteringScreen","overflow","minHeight","display","minWidth","Tooltip","title","placement","ChevronRight","Box","height","flexDirection","borderLeft","size","boxShadow","Close","fontSize","Collapse","in","orientation","alignItems","justifyContent","color","text","secondary","cursor","writingMode","textOrientation","fontWeight","letterSpacing"],"mappings":"uPAkC0E,EACxEA,WACAC,mBAAkB,EAClBC,mBAAmB,EACnBC,oBAAoB,EACpBC,YAAY,GACZC,YAAY,uBACZC,WACAC,gBAAe,EACfC,aAAa,2BACbC,oBAAmB,EACnBC,gBAAe,EACfC,oBAAmB,MAEnB,MAAMC,EAAQC,EAAAA,WACRC,EAAWC,EAAAA,cAAcH,EAAMI,YAAYC,KAAK,QAClDC,gBAACA,GAAiBC,gBAChBC,EAAMC,EAAAA,QAAQ,IAAiC,eAA7BH,WAAiBI,WAAkB,CAACJ,KAUrDK,EAAYC,GAAiBC,EAAAA,SARZ,KACtB,GAAIlB,GAAkC,oBAAXmB,OAAwB,CACjD,MAAMC,EAASC,aAAaC,QAAQrB,GACpC,OAAOmB,EAASG,KAAKC,MAAMJ,GAAU1B,CACvC,CACA,OAAOA,KAKF+B,EAAgBC,GAAqBR,EAAAA,UAAS,GAGrDS,EAAAA,UAAU,KACR,IAAIX,EAED,YADDU,GAAkB,GAGpB,MAAME,EAAQC,WAAW,KACvBH,GAAkB,IACjB,KAEH,MAAO,IAAMI,aAAaF,IACzB,CAACZ,IAEJ,MAAMe,EAAe,KACnB,MAAMC,GAAYhB,EACZiB,EAAcD,EAAWrC,EAAmBC,EAClDqB,EAAce,GAGVhC,GAAkC,oBAAXmB,QACzBE,aAAaa,QAAQjC,EAAYsB,KAAKY,UAAUH,IAIlD,MAAAjC,GAAAA,EAAWiC,EAAUC,IAGjBG,EAAkBpB,EAAarB,EAAmBC,EAGxD,OAAIW,GAAYJ,iBAEZkC,EAAAA,KAAAC,WAAA,CAEG7C,SAAA,CAAAS,kBACCqC,EAAAA,IAACC,EAAAA,WAAA,CACCC,QAASV,EACTW,GAAI,CACFC,SAAU,QACVC,IAAK,MACL,CAAC/B,EAAQ,OAAS,SAAU,EAC5BgC,OAAQxC,EAAMwC,OAAOC,IACrBC,QAAS1C,EAAM2C,QAAQC,WAAWC,MAClCC,OAAQ,aAAa9C,EAAM2C,QAAQI,UACnCC,aAAc,cACd,UAAW,CACTN,QAAS1C,EAAM2C,QAAQM,OAAOC,QAGlC,aAAYzD,EAEZL,8BAAC+D,EAAAA,YAAA,CAAA;eAKLjB,EAAAA,IAACkB,EAAAA,OAAA,CACCC,OAAO,QACPC,KAAM3C,EACN4C,QAAS7B,EACTW,GAAKrC,IAAAA,CACH,qBAAsB,CACpBwD,MAAO,OACP,CAACxD,EAAMI,YAAYqD,GAAG,OAAQ,CAC5BC,SAAU,QACVC,UAAW,QAEb,CAAC3D,EAAMI,YAAYqD,GAAG,OAAQ,CAC5BC,SAAU,QACVC,UAAW,QAEb,CAAC3D,EAAMI,YAAYqD,GAAG,OAAQ,CAC5BC,SAAU,QACVC,UAAW,WAKjBvE,+BAQN4C,EAAAA,KAAC4B,EAAAA,KAAA,CACCC,MAAI,EACJC,GAAI/B,EACJM,GAAI,CACFC,SAAU,WACVyB,WAAY/D,EAAMgE,YAAYC,OAAO,CAAC,aAAc,aAAc,CAChEC,OAAQlE,EAAMgE,YAAYE,OAAOC,MACjCC,SAAUpE,EAAMgE,YAAYI,SAASC,iBAEvCC,SAAU,UACVC,UAAW,OAEXC,QAAiC,QACjCC,SAA8B,IAApB1C,EAAwB,EAAI,QAExCvC,YAGEJ,SAAA,CAAAS,IAAqBc,kBACrBuB,EAAAA,IAACwC,WAAQC,MAAM,iBAAiBC,UAAU,OACxCxF,wBAAA8C,EAAAA,IAACC,EAAAA,WAAA,CACCC,QAASV,EACTW,GAAI,CACFC,SAAU,QACVC,IAAK,MACL,CAAC/B,EAAQ,OAAS,SAAU,EAC5BgD,MAAM,OACNhB,OAAQxC,EAAMwC,OAAOC,IACrBC,QAAS1C,EAAM2C,QAAQC,WAAWC,MAClCC,OAAQ,aAAa9C,EAAM2C,QAAQI,UACnCC,aAAc,cACd,UAAW,CACTN,QAAS1C,EAAM2C,QAAQM,OAAOC,QAGlC,aAAW,uBAEV9D,SAACuB,uBAAgCkE,EAAAA,aAAA,CAAA,kBAAnB3C,MAACiB,EAAAA,YAAA,CAAA,OAMpBpB,EAAkB,GAAKX,kBACvBY,EAAAA,KAAC8C,EAAAA,IAAA,CACCzC,GAAI,CACF0C,OAAQ,OACRvB,MAAO,OACPc,SAAU,UACVE,QAAS,OACTQ,cAAe,SACftC,QAAS1C,EAAM2C,QAAQC,WAAWC,MAClCoC,WAAY,aAAajF,EAAM2C,QAAQI,UACvCC,aAAc,cACdV,SAAU,YAIXlD,SAAA,CAAAW,GAAoBY,kBACnBuB,EAAAA,IAACwC,UAAA,CAAQC,MAAM,gBAAgBC,UAAU,OACvCxF,wBAAA8C,EAAAA,IAACC,EAAAA,WAAA,CACCC,QAASV,EACTwD,KAAK,QACL7C,GAAI,CACFC,SAAU,WACVC,IAAK,QACL,CAAC/B,EAAQ,QAAU,QAAS,QAC5BgC,OAAQ,KACRE,QAAS1C,EAAM2C,QAAQC,WAAWC,MAClCC,OAAQ,aAAa9C,EAAM2C,QAAQI,UACnCC,aAAc,MACd,UAAW,CACTN,QAAS,QAEXyC,UAAW,QAGb/F,8BAACgG,QAAA,CAAM/C,GAAI,CAAEgD,SAAU;eAK7BnD,EAAAA,IAACoD,EAAAA,SAAA,CACCC,GAAI5E,EACJ6E,YAAY,aACZnD,GAAI,CACF0C,OAAQ,OACR,8BAA+B,CAC7BA,OAAQ,OACRvB,MAAO,QAETA,MAAO,QAGTpE,wBAAA8C,EAAAA,IAAC4C,OAAIzC,GAAI,CACPmB,MAAO,OACPuB,OAAQ,OACRT,SAAU,OACVG,SAAU,GAGTrF,gBAKHuB,kBACAuB,EAAAA,IAAC4C,EAAAA,IAAA,CACCzC,GAAI,CACFmC,QAAS,OACTQ,cAAe,SACfS,WAAY,SACZC,eAAgB,SAChBX,OAAQ,OACRvB,MAAO,OACPmC,MAAO3F,EAAM2C,QAAQiD,KAAKC,UAC1BC,OAAQ,WAEV1D,QAASV,EAETtC,wBAAA8C,EAAAA,IAAC4C,EAAAA,IAAA,CACCzC,GAAI,CACF0D,YAAa,cACbC,gBAAiB,QACjBX,SAAU,WACVY,WAAY,IACZC,cAAe,SAElB9G,SAAA"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/expandable-summary-wrapper/expandable-summary-wrapper.tsx"],"sourcesContent":["import React, { useState, ReactNode, useEffect, useMemo } from 'react';\nimport { \n  Grid, \n  IconButton, \n  Collapse, \n  useTheme, \n  useMediaQuery,\n  Tooltip,\n  Box,\n  Drawer\n} from '@mui/material';\nimport { \n  ChevronLeft, \n  ChevronRight,\n  Close,\n  // Close\n} from '@mui/icons-material';\nimport { useLanguage } from '../../hooks/useLangauge';\n\nexport interface ExpandableSummaryWrapperProps {\n  children: ReactNode;\n  defaultExpanded?: boolean;\n  expandedGridSize?: number; // Grid size when expanded (1-12)\n  collapsedGridSize?: number; // Grid size when collapsed (0-2)\n  className?: string;\n  ariaLabel?: string;\n  onToggle?: (isExpanded: boolean, newGridSize: number) => void;\n  persistState?: boolean;\n  storageKey?: string;\n  showToggleButton?: boolean;\n  mobileDrawer?: boolean; // Use drawer on mobile instead of grid\n  showCollapseIcon?: boolean; // Show collapse icon at top of summary\n}\n\nconst ExpandableSummaryWrapper: React.FC<ExpandableSummaryWrapperProps> = ({\n  children,\n  defaultExpanded = true,\n  expandedGridSize = 3,\n  collapsedGridSize = 0,\n  className = '',\n  ariaLabel = 'Toggle summary panel',\n  onToggle,\n  persistState = false,\n  storageKey = 'grid-summary-panel-state',\n  showToggleButton = true,\n  mobileDrawer = true,\n  showCollapseIcon = true\n}) => {\n  const theme = useTheme();\n  const isMobile = useMediaQuery(theme.breakpoints.down('md'));\nconst {currentLanguage}=useLanguage();\n  const isRtl=useMemo(()=>currentLanguage?.direction===\"rtl\",[currentLanguage])\n  // Initialize state with localStorage if persistState is enabled\n  const getInitialState = () => {\n    if (persistState && typeof window !== 'undefined') {\n      const stored = localStorage.getItem(storageKey);\n      return stored ? JSON.parse(stored) : defaultExpanded;\n    }\n    return defaultExpanded;\n  };\n\n  const [isExpanded, setIsExpanded] = useState<boolean>(getInitialState);\n  // Add this state to your component\n  const [showAfterDelay, setShowAfterDelay] = useState(false);\n\n  // Add this useEffect\n  useEffect(() => {\n    if(!isExpanded) {\n      setShowAfterDelay(false)\n       return\n    }\n    const timer = setTimeout(() => {\n      setShowAfterDelay(true);\n    }, 250);\n\n    return () => clearTimeout(timer);\n  }, [isExpanded]);\n\n  const handleToggle = () => {\n    const newState = !isExpanded;\n    const newGridSize = newState ? expandedGridSize : collapsedGridSize;\n    setIsExpanded(newState);\n    \n    // Persist state if enabled\n    if (persistState && typeof window !== 'undefined') {\n      localStorage.setItem(storageKey, JSON.stringify(newState));\n    }\n    \n    // Call external toggle handler with new grid size\n    onToggle?.(newState, newGridSize);\n  };\n\n  const currentGridSize = isExpanded ? expandedGridSize : collapsedGridSize;\n\n  // Mobile drawer implementation\n  if (isMobile && mobileDrawer) {\n    return (\n      <>\n        {/* Mobile Toggle Button */}\n        {showToggleButton && (\n          <IconButton\n            onClick={handleToggle}\n            sx={{\n              position: 'fixed',\n              top: '50%',\n              [isRtl ? 'left' : 'right']: 0,\n              zIndex: theme.zIndex.fab,\n              bgcolor: theme.palette.background.paper,\n              border: `1px solid ${theme.palette.divider}`,\n              borderRadius: '8px 0 0 8px',\n              '&:hover': {\n                bgcolor: theme.palette.action.hover,\n              },\n            }}\n            aria-label={ariaLabel}\n          >\n            <ChevronLeft />\n          </IconButton>\n        )}\n\n        {/* Mobile Drawer */}\n        <Drawer\n          anchor=\"right\"\n          open={isExpanded}\n          onClose={handleToggle}\n          sx={(theme) => ({\n            '& .MuiDrawer-paper': {\n              width: '90vw',\n              [theme.breakpoints.up('md')]: {\n                maxWidth: '400px',\n                marginTop: '65px',\n              },\n              [theme.breakpoints.up('sm')]: {\n                maxWidth: '300px',\n                marginTop: '65px',\n              },\n              [theme.breakpoints.up('xs')]: {\n                maxWidth: '200px',\n                marginTop: '56px',\n              }\n            },\n          })}\n        >\n         {children}\n        </Drawer>\n      </>\n    );\n  }\n\n  // Desktop/Tablet Grid implementation\n  return (\n    <Grid \n      item \n      xs={currentGridSize} \n      sx={{\n        position: 'relative',\n        transition: theme.transitions.create(['flex-basis', 'max-width'], {\n          easing: theme.transitions.easing.sharp,\n          duration: theme.transitions.duration.enteringScreen,\n        }),\n        overflow: 'visible', // Changed from 'hidden' to allow button outside\n        minHeight: '100%',\n        // Ensure grid item is visible even when size is 0\n        display: currentGridSize === 0 ? 'block' : 'block',\n        minWidth: currentGridSize === 0 ? 0 : 'auto',\n      }}\n      className={className}\n    >\n      {/* Alternative toggle button for completely collapsed state */}\n      {(showToggleButton && !isExpanded) && (\n        <Tooltip title=\"Expand summary\" placement=\"left\">\n          <IconButton\n            onClick={handleToggle}\n            sx={{\n              position: 'fixed',\n              top: '14%',\n              [isRtl ? 'left' : 'right']: 0,\n              width:'30px',\n              zIndex: theme.zIndex.fab,\n              bgcolor: theme.palette.background.paper,\n              border: `1px solid ${theme.palette.divider}`,\n              borderRadius: '8px 0 0 8px',\n              '&:hover': {\n                bgcolor: theme.palette.action.hover,\n              },\n            }}\n            aria-label=\"Expand summary panel\"\n          >\n            {!isExpanded ? <ChevronLeft /> : <ChevronRight />}\n          </IconButton>\n        </Tooltip>\n      )}\n\n      {/* Content Container */}\n      {(currentGridSize > 0 && showAfterDelay) && (\n        <Box\n          sx={{\n            height: '100%',\n            width: '100%',\n            overflow: 'visible',\n            display: 'flex',\n            flexDirection: 'column',\n            bgcolor: theme.palette.background.paper,\n            borderLeft: `1px solid ${theme.palette.divider}`,\n            borderRadius: '8px 0 0 8px',\n            position: 'relative',\n          }}\n        >\n          {/* Fixed Collapse Icon at Top of Summary */}\n          {showCollapseIcon && isExpanded && (\n            <Tooltip title=\"Close summary\" placement=\"left\">\n              <IconButton\n                onClick={handleToggle}\n                size='small'\n                sx={{\n                  position: 'absolute',\n                  top: '-15px',\n                  [isRtl ? 'right' : 'left']: '-15px',\n                  zIndex: 1200,\n                  bgcolor: theme.palette.background.paper,\n                  border: `1px solid ${theme.palette.divider}`,\n                  borderRadius: '50%',\n                  '&:hover': {\n                    bgcolor: '#fff',\n                  },\n                  boxShadow: 'none',\n                }}\n              >\n                <Close sx={{ fontSize: 14 }} />\n              </IconButton>\n            </Tooltip>\n          )}\n\n          <Collapse \n            in={isExpanded} \n            orientation=\"horizontal\" \n            sx={{ \n              height: '100%',\n              '& .MuiCollapse-wrapperInner': {\n                height: '100%',\n                width: '100%',\n              },\n              width: '100%',\n            }}\n          >\n            <Box sx={{ \n              width: '100%', \n              height: '100%', \n              overflow: 'auto',\n              minWidth: 0,\n              // pt: showCollapseIcon ? 6 : 0, // Add padding top when collapse icon is shown\n            }}>\n              {children}\n            </Box>\n          </Collapse>\n\n          {/* Collapsed State Indicator for partial collapse */}\n          {!isExpanded && (\n            <Box\n              sx={{\n                display: 'flex',\n                flexDirection: 'column',\n                alignItems: 'center',\n                justifyContent: 'center',\n                height: '100%',\n                width: '100%',\n                color: theme.palette.text.secondary,\n                cursor: 'pointer',\n              }}\n              onClick={handleToggle}\n            >\n              <Box\n                sx={{\n                  writingMode: 'vertical-lr',\n                  textOrientation: 'mixed',\n                  fontSize: '0.875rem',\n                  fontWeight: 500,\n                  letterSpacing: '0.1em',\n                }}\n              >\n                SUMMARY\n              </Box>\n            </Box>\n          )}\n        </Box>\n      )}\n    </Grid>\n  );\n};\n\nexport default ExpandableSummaryWrapper;\n"],"names":["children","defaultExpanded","expandedGridSize","collapsedGridSize","className","ariaLabel","onToggle","persistState","storageKey","showToggleButton","mobileDrawer","showCollapseIcon","theme","useTheme","isMobile","useMediaQuery","breakpoints","down","currentLanguage","useLanguage","isRtl","useMemo","direction","isExpanded","setIsExpanded","useState","window","stored","localStorage","getItem","JSON","parse","showAfterDelay","setShowAfterDelay","useEffect","timer","setTimeout","clearTimeout","handleToggle","newState","newGridSize","setItem","stringify","currentGridSize","jsxs","Fragment","jsx","IconButton","onClick","sx","position","top","zIndex","fab","bgcolor","palette","background","paper","border","divider","borderRadius","action","hover","ChevronLeft","Drawer","anchor","open","onClose","width","up","maxWidth","marginTop","Grid","item","xs","transition","transitions","create","easing","sharp","duration","enteringScreen","overflow","minHeight","display","minWidth","Tooltip","title","placement","ChevronRight","Box","height","flexDirection","borderLeft","size","boxShadow","Close","fontSize","Collapse","in","orientation","alignItems","justifyContent","color","text","secondary","cursor","writingMode","textOrientation","fontWeight","letterSpacing"],"mappings":"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"}

package/dist/components/fallback/fallback/index.esm.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { Typography } from "../../typography/typography/index.esm.js";
-import { Box } from "@mui/material";
 /* empty css                         */
+import Box from "../../../node_modules/@mui/material/Box/Box/index.esm.js";
 const Fallback = (props) => {
   const { heading, subHeading, icon, children, ...rest } = props;
   return /* @__PURE__ */ jsxs(Box, { className: "fallback", ...rest, children: [

package/dist/components/fallback/fallback/index.js

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=,/* empty css                                 */a=require("@mui/material");,/* empty css                      */exports.default=s=>{const{heading:i,subHeading:c,icon:l,children:t,...d}=s;/* @__PURE__ */
-return e.jsxs(a.Box,{className:"fallback",...d,children:[l,
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=;/* empty css                                 */;/* empty css                      */var a=;/* empty css                                                 */exports.default=s=>{const{heading:i,subHeading:l,icon:t,children:c,...d}=s;/* @__PURE__ */
+return e.jsxs(a.default,{className:"fallback",...d,children:[t,
 /* @__PURE__ */e.jsx(r.Typography,{type:"h5",weight:"medium",color:"theme.secondary.1000",className:"fallback--Text",children:i}),
-/* @__PURE__ */e.jsx(r.Typography,{type:"s3",weight:"medium",color:"theme.secondary.800",className:"fallback--Text",children:c}),
-/* @__PURE__ */e.jsx("div",{children:t})]})};
+/* @__PURE__ */e.jsx(r.Typography,{type:"s3",weight:"medium",color:"theme.secondary.800",className:"fallback--Text",children:l}),
+/* @__PURE__ */e.jsx("div",{children:c})]})};
 //# sourceMappingURL=index.js.map

package/dist/components/fallback/fallback/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/fallback/fallback.tsx"],"sourcesContent":["import Typography from \"../typography/typography\";\nimport { Box } from \"@mui/material\";\nimport \"./fallback.scss\";\n\ninterface FallbackProps {\n  heading: string;\n  subHeading: string;\n  icon: React.ReactNode;\n  children?: React.ReactNode;\n}\n\nconst Fallback = (props: FallbackProps) => {\n  const { heading, subHeading, icon, children, ...rest } = props;\n  return (\n    <Box className=\"fallback\" {...rest}>\n      {icon}\n      <Typography\n        type=\"h5\"\n        weight=\"medium\"\n        color=\"theme.secondary.1000\"\n        className=\"fallback--Text\"\n      >\n        {heading}\n      </Typography>\n      <Typography\n        type=\"s3\"\n        weight=\"medium\"\n        color=\"theme.secondary.800\"\n        className=\"fallback--Text\"\n      >\n        {subHeading}\n      </Typography>\n      <div>{children}</div>\n    </Box>\n  );\n};\n\nexport default Fallback;\n"],"names":["props","heading","subHeading","icon","children","rest","jsxs","Box","className","jsx","Typography","type","weight","color"],"mappings":"yOAWkBA,IAChB,MAAMC,QAAEA,EAAAC,WAASA,EAAAC,KAAYA,WAAMC,KAAaC,GAASL;AACzD,OACEM,EAAAA,KAACC,EAAAA,IAAA,CAAIC,UAAU,cAAeH,EAC3BD,SAAA,CAAAD;eACDM,EAAAA,IAACC,EAAAA,WAAA,CACCC,KAAK,KACLC,OAAO,SACPC,MAAM,uBACNL,UAAU,iBAETJ,SAAAH;eAEHQ,EAAAA,IAACC,EAAAA,WAAA,CACCC,KAAK,KACLC,OAAO,SACPC,MAAM,sBACNL,UAAU,iBAETJ,SAAAF;eAEHO,MAAC,OAAKL"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/fallback/fallback.tsx"],"sourcesContent":["import Typography from \"../typography/typography\";\nimport { Box } from \"@mui/material\";\nimport \"./fallback.scss\";\n\ninterface FallbackProps {\n  heading: string;\n  subHeading: string;\n  icon: React.ReactNode;\n  children?: React.ReactNode;\n}\n\nconst Fallback = (props: FallbackProps) => {\n  const { heading, subHeading, icon, children, ...rest } = props;\n  return (\n    <Box className=\"fallback\" {...rest}>\n      {icon}\n      <Typography\n        type=\"h5\"\n        weight=\"medium\"\n        color=\"theme.secondary.1000\"\n        className=\"fallback--Text\"\n      >\n        {heading}\n      </Typography>\n      <Typography\n        type=\"s3\"\n        weight=\"medium\"\n        color=\"theme.secondary.800\"\n        className=\"fallback--Text\"\n      >\n        {subHeading}\n      </Typography>\n      <div>{children}</div>\n    </Box>\n  );\n};\n\nexport default Fallback;\n"],"names":["props","heading","subHeading","icon","children","rest","jsxs","Box","className","jsx","Typography","type","weight","color"],"mappings":"oRAWkBA,IAChB,MAAMC,QAAEA,EAAAC,WAASA,EAAAC,KAAYA,WAAMC,KAAaC,GAASL;AACzD,OACEM,EAAAA,KAACC,EAAAA,QAAA,CAAIC,UAAU,cAAeH,EAC3BD,SAAA,CAAAD;eACDM,EAAAA,IAACC,EAAAA,WAAA,CACCC,KAAK,KACLC,OAAO,SACPC,MAAM,uBACNL,UAAU,iBAETJ,SAAAH;eAEHQ,EAAAA,IAACC,EAAAA,WAAA,CACCC,KAAK,KACLC,OAAO,SACPC,MAAM,sBACNL,UAAU,iBAETJ,SAAAF;eAEHO,MAAC,OAAKL"}

package/dist/components/filter/components/add-filter/index.esm.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import Button from "../../../button/button/index.esm.js";
-import { styled } from "@mui/material";
-import { Add } from "@mui/icons-material";
+import styled from "../../../../node_modules/@mui/material/styles/styled/index.esm.js";
+import Add from "../../../../node_modules/@mui/icons-material/esm/Add/index.esm.js";
 const StyledAddButton = styled(Button)(({ theme: { palette } }) => {
   var _a, _b;
   return {

package/dist/components/filter/components/add-filter/index.js

@@ -1,3 +1,3 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../button/button/index.js"),r=require("@mui/material"),o=require("@mui/icons-material");const i=r.styled(t.default)(({theme:{palette:e}})=>{var t,r;return{":hover":{backgroundColor:null==(t=e.theme)?void 0:t.secondary[100]},"&.MuiButton-text":{":hover":{color:null==(r=e.theme)?void 0:r.secondary[1e3]}}}});exports.default=t=>{const{handleOnClick:r,...n}=t;/* @__PURE__ */
-return e.jsx(i,{onClick:r,...n,className:"add-filter",variant:"text",startIcon:/* @__PURE__ */e.jsx(o.Add,{}),children:"Add Filter"})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../button/button/index.js"),r=require("../../../../node_modules/@mui/material/styles/styled/index.js"),d=require("../../../../node_modules/@mui/icons-material/esm/Add/index.js");const o=r.default(t.default)(({theme:{palette:e}})=>{var t,r;return{":hover":{backgroundColor:null==(t=e.theme)?void 0:t.secondary[100]},"&.MuiButton-text":{":hover":{color:null==(r=e.theme)?void 0:r.secondary[1e3]}}}});exports.default=t=>{const{handleOnClick:r,...l}=t;/* @__PURE__ */
+return e.jsx(o,{onClick:r,...l,className:"add-filter",variant:"text",startIcon:/* @__PURE__ */e.jsx(d.default,{}),children:"Add Filter"})};
 //# sourceMappingURL=index.js.map

package/dist/components/filter/components/add-filter/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/components/filter/components/add-filter.tsx"],"sourcesContent":["import { ActionProps } from \"react-querybuilder\";\nimport Button from \"../../button/button\";\nimport { styled } from \"@mui/material\";\nimport { Add } from \"@mui/icons-material\";\n\nconst StyledAddButton = styled(Button)(({ theme: { palette } }) => ({\n  \":hover\": {\n    backgroundColor: palette.theme?.secondary[100],\n  },\n  \"&.MuiButton-text\": {\n    \":hover\": {\n      color: palette.theme?.secondary[1000],\n    },\n  },\n}));\n\nconst AddFilterButton = (props: ActionProps) => {\n  const { handleOnClick, ...rest } = props;\n  return (\n    <StyledAddButton\n      onClick={handleOnClick}\n      {...rest}\n      className=\"add-filter\"\n      variant=\"text\"\n      startIcon={<Add/>}\n    >\n    Add Filter\n    </StyledAddButton>\n  );\n};\n\nexport default AddFilterButton;\n"],"names":["StyledAddButton","styled","Button","theme","palette","backgroundColor","_a","secondary","color","_b","props","handleOnClick","rest","jsx","onClick","className","variant","startIcon","Add","children"],"mappings":"gNAKA,MAAMA,EAAkBC,EAAAA,OAAOC,UAAPD,CAAe,EAAGE,OAASC,uBAAiB,MAAA,CAClE,SAAU,CACRC,gBAAiB,OAAAC,EAAAF,EAAQD,YAAR,EAAAG,EAAeC,UAAU,MAE5C,mBAAoB,CAClB,SAAU,CACRC,MAAO,OAAAC,EAAAL,EAAQD,YAAR,EAAAM,EAAeF,UAAU,0BAKbG,IACvB,MAAMC,cAAEA,KAAkBC,GAASF;AACnC,OACEG,EAAAA,IAACb,EAAA,CACCc,QAASH,KACLC,EACJG,UAAU,aACVC,QAAQ,OACRC,+BAAYC,EAAAA,IAAA,IACbC,SAAA"}
+{"version":3,"file":"index.js","sources":["../../../../../src/components/filter/components/add-filter.tsx"],"sourcesContent":["import { ActionProps } from \"react-querybuilder\";\nimport Button from \"../../button/button\";\nimport { styled } from \"@mui/material\";\nimport { Add } from \"@mui/icons-material\";\n\nconst StyledAddButton = styled(Button)(({ theme: { palette } }) => ({\n  \":hover\": {\n    backgroundColor: palette.theme?.secondary[100],\n  },\n  \"&.MuiButton-text\": {\n    \":hover\": {\n      color: palette.theme?.secondary[1000],\n    },\n  },\n}));\n\nconst AddFilterButton = (props: ActionProps) => {\n  const { handleOnClick, ...rest } = props;\n  return (\n    <StyledAddButton\n      onClick={handleOnClick}\n      {...rest}\n      className=\"add-filter\"\n      variant=\"text\"\n      startIcon={<Add/>}\n    >\n    Add Filter\n    </StyledAddButton>\n  );\n};\n\nexport default AddFilterButton;\n"],"names":["StyledAddButton","styled","Button","theme","palette","backgroundColor","_a","secondary","color","_b","props","handleOnClick","rest","jsx","onClick","className","variant","startIcon","Add","children"],"mappings":"0SAKA,MAAMA,EAAkBC,EAAAA,QAAOC,UAAPD,CAAe,EAAGE,OAASC,uBAAiB,MAAA,CAClE,SAAU,CACRC,gBAAiB,OAAAC,EAAAF,EAAQD,YAAR,EAAAG,EAAeC,UAAU,MAE5C,mBAAoB,CAClB,SAAU,CACRC,MAAO,OAAAC,EAAAL,EAAQD,YAAR,EAAAM,EAAeF,UAAU,0BAKbG,IACvB,MAAMC,cAAEA,KAAkBC,GAASF;AACnC,OACEG,EAAAA,IAACb,EAAA,CACCc,QAASH,KACLC,EACJG,UAAU,aACVC,QAAQ,OACRC,+BAAYC,EAAAA,QAAA,IACbC,SAAA"}

package/dist/components/filter/components/add-group/index.esm.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
-import { styled } from "@mui/material";
 import Button from "../../../button/button/index.esm.js";
-import { Add } from "@mui/icons-material";
+import styled from "../../../../node_modules/@mui/material/styles/styled/index.esm.js";
+import Add from "../../../../node_modules/@mui/icons-material/esm/Add/index.esm.js";
 const StyledAddButton = styled(Button)(({ theme: { palette } }) => {
   var _a, _b;
   return {

package/dist/components/filter/components/add-group/index.js

@@ -1,3 +1,3 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@mui/material"),t=require("../../../button/button/index.js"),o=require("@mui/icons-material");const u=r.styled(t.default)(({theme:{palette:e}})=>{var r,t;return{":hover":{backgroundColor:null==(r=e.theme)?void 0:r.secondary[100]},"&.MuiButton-text":{":hover":{color:null==(t=e.theme)?void 0:t.secondary[1e3]}}}});exports.default=r=>{const{handleOnClick:t,...n}=r;/* @__PURE__ */
-return e.jsx(u,{onClick:t,...n,className:"add-group",variant:"text",startIcon:/* @__PURE__ */e.jsx(o.Add,{}),children:"Add Group"})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../button/button/index.js"),r=require("../../../../node_modules/@mui/material/styles/styled/index.js"),o=require("../../../../node_modules/@mui/icons-material/esm/Add/index.js");const d=r.default(t.default)(({theme:{palette:e}})=>{var t,r;return{":hover":{backgroundColor:null==(t=e.theme)?void 0:t.secondary[100]},"&.MuiButton-text":{":hover":{color:null==(r=e.theme)?void 0:r.secondary[1e3]}}}});exports.default=t=>{const{handleOnClick:r,...u}=t;/* @__PURE__ */
+return e.jsx(d,{onClick:r,...u,className:"add-group",variant:"text",startIcon:/* @__PURE__ */e.jsx(o.default,{}),children:"Add Group"})};
 //# sourceMappingURL=index.js.map

package/dist/components/filter/components/add-group/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/components/filter/components/add-group.tsx"],"sourcesContent":["import { styled } from \"@mui/material\";\nimport Button from \"../../button/button\";\nimport { ActionProps } from \"react-querybuilder\";\nimport { Add } from \"@mui/icons-material\";\n\nconst StyledAddButton = styled(Button)(({ theme: { palette } }) => ({\n  \":hover\": {\n    backgroundColor: palette.theme?.secondary[100],\n  },\n  \"&.MuiButton-text\": {\n    \":hover\": {\n      color: palette.theme?.secondary[1000],\n    },\n  },\n}));\n\nconst AddGroupButton = (props: ActionProps) => {\n  const { handleOnClick, ...rest } = props;\n  return (\n    <StyledAddButton\n      onClick={handleOnClick}\n      {...rest}\n      className=\"add-group\"\n      variant=\"text\"\n      startIcon={<Add/>}\n    >\n      Add Group\n    </StyledAddButton>\n  );\n};\n\nexport default AddGroupButton;\n"],"names":["StyledAddButton","styled","Button","theme","palette","backgroundColor","_a","secondary","color","_b","props","handleOnClick","rest","jsx","onClick","className","variant","startIcon","Add","children"],"mappings":"gNAKA,MAAMA,EAAkBC,EAAAA,OAAOC,UAAPD,CAAe,EAAGE,OAASC,uBAAiB,MAAA,CAClE,SAAU,CACRC,gBAAiB,OAAAC,EAAAF,EAAQD,YAAR,EAAAG,EAAeC,UAAU,MAE5C,mBAAoB,CAClB,SAAU,CACRC,MAAO,OAAAC,EAAAL,EAAQD,YAAR,EAAAM,EAAeF,UAAU,0BAKdG,IACtB,MAAMC,cAAEA,KAAkBC,GAASF;AACnC,OACEG,EAAAA,IAACb,EAAA,CACCc,QAASH,KACLC,EACJG,UAAU,YACVC,QAAQ,OACRC,+BAAYC,EAAAA,IAAA,IACbC,SAAA"}
+{"version":3,"file":"index.js","sources":["../../../../../src/components/filter/components/add-group.tsx"],"sourcesContent":["import { styled } from \"@mui/material\";\nimport Button from \"../../button/button\";\nimport { ActionProps } from \"react-querybuilder\";\nimport { Add } from \"@mui/icons-material\";\n\nconst StyledAddButton = styled(Button)(({ theme: { palette } }) => ({\n  \":hover\": {\n    backgroundColor: palette.theme?.secondary[100],\n  },\n  \"&.MuiButton-text\": {\n    \":hover\": {\n      color: palette.theme?.secondary[1000],\n    },\n  },\n}));\n\nconst AddGroupButton = (props: ActionProps) => {\n  const { handleOnClick, ...rest } = props;\n  return (\n    <StyledAddButton\n      onClick={handleOnClick}\n      {...rest}\n      className=\"add-group\"\n      variant=\"text\"\n      startIcon={<Add/>}\n    >\n      Add Group\n    </StyledAddButton>\n  );\n};\n\nexport default AddGroupButton;\n"],"names":["StyledAddButton","styled","Button","theme","palette","backgroundColor","_a","secondary","color","_b","props","handleOnClick","rest","jsx","onClick","className","variant","startIcon","Add","children"],"mappings":"0SAKA,MAAMA,EAAkBC,EAAAA,QAAOC,UAAPD,CAAe,EAAGE,OAASC,uBAAiB,MAAA,CAClE,SAAU,CACRC,gBAAiB,OAAAC,EAAAF,EAAQD,YAAR,EAAAG,EAAeC,UAAU,MAE5C,mBAAoB,CAClB,SAAU,CACRC,MAAO,OAAAC,EAAAL,EAAQD,YAAR,EAAAM,EAAeF,UAAU,0BAKdG,IACtB,MAAMC,cAAEA,KAAkBC,GAASF;AACnC,OACEG,EAAAA,IAACb,EAAA,CACCc,QAASH,KACLC,EACJG,UAAU,YACVC,QAAQ,OACRC,+BAAYC,EAAAA,QAAA,IACbC,SAAA"}

package/dist/components/filter/components/combinator-select/index.esm.js

@@ -1,7 +1,7 @@
 import { jsx, Fragment } from "react/jsx-runtime";
-import { MenuItem } from "@mui/material";
 import Select from "../../../select/select/index.esm.js";
 import { Typography } from "../../../typography/typography/index.esm.js";
+import MenuItem from "../../../../node_modules/@mui/material/MenuItem/MenuItem/index.esm.js";
 const CombinatorSelect = (props) => {
   var _a, _b;
   const { handleOnChange, value, options, ...rest } = props;

package/dist/components/filter/components/combinator-select/index.js

@@ -1,3 +1,3 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@mui/material"),a=require("../../../select/select/index.js"),l=require("../../../typography/typography/index.js");exports.default=t=>{var n,s;const{handleOnChange:o,value:i,options:u,...c}=t,d=1===(null==(n=t.path)?void 0:n[0])||1===(null==(s=t.path)?void 0:s[1]);/* @__PURE__ */
-return e.jsx(e.Fragment,{children:d?/* @__PURE__ */e.jsx(a.default,{value:i,onChange:e=>o(e.target.value),...c,className:"combinator-list",children:null==u?void 0:u.map(({name:a,label:t})=>/* @__PURE__ */e.jsx(r.MenuItem,{value:a,children:/* @__PURE__ */e.jsx(l.Typography,{type:"s4",color:"theme.secondary.1000",children:t})},a))}):/* @__PURE__ */e.jsx(l.Typography,{type:"s4",color:"theme.secondary.1000",className:"combinator-value",children:i})})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../../select/select/index.js"),a=require("../../../typography/typography/index.js"),l=require("../../../../node_modules/@mui/material/MenuItem/MenuItem/index.js");exports.default=t=>{var n,s;const{handleOnChange:o,value:i,options:u,...d}=t,c=1===(null==(n=t.path)?void 0:n[0])||1===(null==(s=t.path)?void 0:s[1]);/* @__PURE__ */
+return e.jsx(e.Fragment,{children:c?/* @__PURE__ */e.jsx(r.default,{value:i,onChange:e=>o(e.target.value),...d,className:"combinator-list",children:null==u?void 0:u.map(({name:r,label:t})=>/* @__PURE__ */e.jsx(l.default,{value:r,children:/* @__PURE__ */e.jsx(a.Typography,{type:"s4",color:"theme.secondary.1000",children:t})},r))}):/* @__PURE__ */e.jsx(a.Typography,{type:"s4",color:"theme.secondary.1000",className:"combinator-value",children:i})})};
 //# sourceMappingURL=index.js.map

package/dist/components/filter/components/combinator-select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/components/filter/components/combinator-select.tsx"],"sourcesContent":["import { MenuItem } from \"@mui/material\";\nimport Select from \"../../select/select\";\nimport Typography from \"../../typography/typography\";\n\nconst CombinatorSelect = (props: any) => {\n  const { handleOnChange, value, options, ...rest } = props;\n\n  const showDropdown = props.path?.[0] === 1 || props.path?.[1] === 1;\n\n  return (\n    <>\n      {!showDropdown ? (\n        <Typography\n          type=\"s4\"\n          color=\"theme.secondary.1000\"\n          className=\"combinator-value\"\n        >\n          {value}\n        </Typography>\n      ) : (\n        <Select\n          value={value}\n          onChange={(e: any) => handleOnChange(e.target.value)}\n          {...rest}\n          className=\"combinator-list\"\n        >\n          {options?.map(({ name, label }: { name: string; label: string }) => (\n            <MenuItem key={name} value={name}>\n              <Typography type=\"s4\" color=\"theme.secondary.1000\">\n                {label}\n              </Typography>\n            </MenuItem>\n          ))}\n        </Select>\n      )}\n    </>\n  );\n};\n\nexport default CombinatorSelect;\n"],"names":["props","handleOnChange","value","options","rest","showDropdown","_a","path","_b","jsx","Fragment","children","Select","onChange","e","target","className","map","name","label","MenuItem","Typography","type","color"],"mappings":"oPAI0BA,YACxB,MAAMC,eAAEA,EAAAC,MAAgBA,EAAAC,QAAOA,KAAYC,GAASJ,EAE9CK,EAAmC,KAApB,OAAAC,IAAMC,WAAN,EAAAD,EAAa,KAAgC,KAApB,OAAAE,EAAAR,EAAMO,WAAN,EAAAC,EAAa;AAE3D,OACEC,EAAAA,IAAAC,EAAAA,SAAA,CACGC,SAACN,iBASAI,EAAAA,IAACG,EAAAA,QAAA,CACCV,QACAW,SAAWC,GAAWb,EAAea,EAAEC,OAAOb,UAC1CE,EACJY,UAAU,kBAETL,SAAA,MAAAR,OAAA,EAAAA,EAASc,IAAI,EAAGC,OAAMC,gCACpBC,EAAAA,SAAA,CAAoBlB,MAAOgB,EAC1BP,wBAAAF,EAAAA,IAACY,EAAAA,WAAA,CAAWC,KAAK,KAAKC,MAAM,uBACzBZ,SAAAQ,KAFUD,qBAfnBT,EAAAA,IAACY,EAAAA,WAAA,CACCC,KAAK,KACLC,MAAM,uBACNP,UAAU,mBAETL,SAAAT"}
+{"version":3,"file":"index.js","sources":["../../../../../src/components/filter/components/combinator-select.tsx"],"sourcesContent":["import { MenuItem } from \"@mui/material\";\nimport Select from \"../../select/select\";\nimport Typography from \"../../typography/typography\";\n\nconst CombinatorSelect = (props: any) => {\n  const { handleOnChange, value, options, ...rest } = props;\n\n  const showDropdown = props.path?.[0] === 1 || props.path?.[1] === 1;\n\n  return (\n    <>\n      {!showDropdown ? (\n        <Typography\n          type=\"s4\"\n          color=\"theme.secondary.1000\"\n          className=\"combinator-value\"\n        >\n          {value}\n        </Typography>\n      ) : (\n        <Select\n          value={value}\n          onChange={(e: any) => handleOnChange(e.target.value)}\n          {...rest}\n          className=\"combinator-list\"\n        >\n          {options?.map(({ name, label }: { name: string; label: string }) => (\n            <MenuItem key={name} value={name}>\n              <Typography type=\"s4\" color=\"theme.secondary.1000\">\n                {label}\n              </Typography>\n            </MenuItem>\n          ))}\n        </Select>\n      )}\n    </>\n  );\n};\n\nexport default CombinatorSelect;\n"],"names":["props","handleOnChange","value","options","rest","showDropdown","_a","path","_b","jsx","Fragment","children","Select","onChange","e","target","className","map","name","label","MenuItem","Typography","type","color"],"mappings":"wSAI0BA,YACxB,MAAMC,eAAEA,EAAAC,MAAgBA,EAAAC,QAAOA,KAAYC,GAASJ,EAE9CK,EAAmC,KAApB,OAAAC,IAAMC,WAAN,EAAAD,EAAa,KAAgC,KAApB,OAAAE,EAAAR,EAAMO,WAAN,EAAAC,EAAa;AAE3D,OACEC,EAAAA,IAAAC,EAAAA,SAAA,CACGC,SAACN,iBASAI,EAAAA,IAACG,EAAAA,QAAA,CACCV,QACAW,SAAWC,GAAWb,EAAea,EAAEC,OAAOb,UAC1CE,EACJY,UAAU,kBAETL,SAAA,MAAAR,OAAA,EAAAA,EAASc,IAAI,EAAGC,OAAMC,gCACpBC,EAAAA,QAAA,CAAoBlB,MAAOgB,EAC1BP,wBAAAF,EAAAA,IAACY,EAAAA,WAAA,CAAWC,KAAK,KAAKC,MAAM,uBACzBZ,SAAAQ,KAFUD,qBAfnBT,EAAAA,IAACY,EAAAA,WAAA,CACCC,KAAK,KACLC,MAAM,uBACNP,UAAU,mBAETL,SAAAT"}

package/dist/components/filter/components/field-select/index.esm.js

@@ -1,12 +1,13 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
-import { Box, MenuItem } from "@mui/material";
 import Select from "../../../select/select/index.esm.js";
 import { Typography } from "../../../typography/typography/index.esm.js";
 import SearchBar from "../../../search-bar/search-bar/index.esm.js";
 /* empty css                          */
 import formatText from "../../../../utils/format-text/index.esm.js";
 import { useTranslation } from "react-i18next";
+import Box from "../../../../node_modules/@mui/material/Box/Box/index.esm.js";
+import MenuItem from "../../../../node_modules/@mui/material/MenuItem/MenuItem/index.esm.js";
 const FieldSelect = (props) => {
   const { t } = useTranslation();
   const { handleOnChange, value, options, ...rest } = props;

package/dist/components/filter/components/field-select/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../../src/components/filter/components/field-select.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { Box, MenuItem } from \"@mui/material\";\nimport Select from \"../../select/select\";\nimport Typography from \"../../typography/typography\";\nimport { FieldSelectorProps } from \"react-querybuilder\";\nimport SearchBar from \"../../search-bar/search-bar\";\nimport \"../filter.scss\";\nimport formatText from \"../../../utils/format-text\";\nimport { useTranslation } from \"react-i18next\";\n\nconst FieldSelect = (props: FieldSelectorProps) => {\n\n  const { t } = useTranslation();\n\n  const { handleOnChange, value, options, ...rest } = props;\n\n  const [filteredOptions, setFilteredOptions] = useState<any[]>();\n\n  const handleSearchEvent = (searchText: string) => {\n    const ops = options?.filter(o => Boolean(o.label?.trim())) || []\n    const filteredData = ops.filter((option: any) =>\n      option.name.toLowerCase().includes(searchText.toLowerCase()),\n    );\n    setFilteredOptions(filteredData);\n  };\n\n  useEffect(() => {\n    setFilteredOptions(options?.filter(o => Boolean(o.label?.trim())) || [])\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  },[options?.length])\n\n\n  return (\n    <Box width=\"100%\">\n      <Select\n        fullWidth\n        value={value}\n        onChange={(e: any) => handleOnChange(e.target.value)}\n        {...rest}\n        className=\"select-drps\"\n        variant=\"outlined\"\n        renderValue={(value: any) => formatText(t(filteredOptions?.find((opttion: any)=>opttion.name === value)?.label)?.replace(\"_id\", '')?.replaceAll(\"_\", \" \") || \"Select Default\")}\n        onClose={() => setFilteredOptions(options?.filter(o => Boolean(o.label?.trim())) || [])}\n      >\n        <div className=\"searchbar-box-list new-searchbar\">\n          <SearchBar\n            placeholder={\"Search Attributes\"}\n            handleSearch={(e) => handleSearchEvent(e)}\n          />\n        </div>\n        {filteredOptions?.map((op: any) => (\n          <MenuItem key={op.name} value={op.name}>\n            <Typography type=\"s4\" color=\"theme.secondary.1000\">\n              {formatText(t(op.label)?.replace(\"_id\", '')?.replaceAll(\"_\", \" \"))}\n            </Typography>\n          </MenuItem>\n        ))}\n      </Select>\n    </Box>\n  );\n};\n\nexport default FieldSelect;\n"],"names":["value"],"mappings":";;;;;;;;;AAUA,MAAM,cAAc,CAAC,UAA8B;AAEjD,QAAM,EAAE,EAAA,IAAM,eAAA;AAEd,QAAM,EAAE,gBAAgB,OAAO,SAAS,GAAG,SAAS;AAEpD,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAA;AAE9C,QAAM,oBAAoB,CAAC,eAAuB;AAChD,UAAM,OAAM,mCAAS,OAAO,CAAA,MAAA;;AAAK,sBAAQ,OAAE,UAAF,mBAAS,MAAM;AAAA,WAAM,CAAA;AAC9D,UAAM,eAAe,IAAI;AAAA,MAAO,CAAC,WAC/B,OAAO,KAAK,cAAc,SAAS,WAAW,YAAA,CAAa;AAAA,IAAA;AAE7D,uBAAmB,YAAY;AAAA,EACjC;AAEA,YAAU,MAAM;AACd,wBAAmB,mCAAS,OAAO,CAAA,MAAA;;AAAK,sBAAQ,OAAE,UAAF,mBAAS,MAAM;AAAA,WAAM,CAAA,CAAE;AAAA,EAEzE,GAAE,CAAC,mCAAS,MAAM,CAAC;AAGnB,SACE,oBAAC,KAAA,EAAI,OAAM,QACT,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAS;AAAA,MACT;AAAA,MACA,UAAU,CAAC,MAAW,eAAe,EAAE,OAAO,KAAK;AAAA,MAClD,GAAG;AAAA,MACJ,WAAU;AAAA,MACV,SAAQ;AAAA,MACR,aAAa,CAACA,WAAAA;;AAAe,4BAAW,cAAE,wDAAiB,KAAK,CAAC,YAAe,QAAQ,SAASA,YAAvD,mBAA+D,KAAK,MAAtE,mBAAyE,QAAQ,OAAO,QAAxF,mBAA6F,WAAW,KAAK,SAAQ,gBAAgB;AAAA;AAAA,MAC7K,SAAS,MAAM,oBAAmB,mCAAS,OAAO,CAAA,MAAA;;AAAK,wBAAQ,OAAE,UAAF,mBAAS,MAAM;AAAA,aAAM,CAAA,CAAE;AAAA,MAEtF,UAAA;AAAA,QAAA,oBAAC,OAAA,EAAI,WAAU,oCACb,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,aAAa;AAAA,YACb,cAAc,CAAC,MAAM,kBAAkB,CAAC;AAAA,UAAA;AAAA,QAAA,GAE5C;AAAA,QACC,mDAAiB,IAAI,CAAC,OAAA;;qCACpB,UAAA,EAAuB,OAAO,GAAG,MAChC,UAAA,oBAAC,YAAA,EAAW,MAAK,MAAK,OAAM,wBACzB,UAAA,YAAW,aAAE,GAAG,KAAK,MAAV,mBAAa,QAAQ,OAAO,QAA5B,mBAAiC,WAAW,KAAK,IAAI,EAAA,CACnE,EAAA,GAHa,GAAG,IAIlB;AAAA;AAAA,MACD;AAAA,IAAA;AAAA,EAAA,GAEL;AAEJ;"}
+{"version":3,"file":"index.esm.js","sources":["../../../../../src/components/filter/components/field-select.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { Box, MenuItem } from \"@mui/material\";\nimport Select from \"../../select/select\";\nimport Typography from \"../../typography/typography\";\nimport { FieldSelectorProps } from \"react-querybuilder\";\nimport SearchBar from \"../../search-bar/search-bar\";\nimport \"../filter.scss\";\nimport formatText from \"../../../utils/format-text\";\nimport { useTranslation } from \"react-i18next\";\n\nconst FieldSelect = (props: FieldSelectorProps) => {\n\n  const { t } = useTranslation();\n\n  const { handleOnChange, value, options, ...rest } = props;\n\n  const [filteredOptions, setFilteredOptions] = useState<any[]>();\n\n  const handleSearchEvent = (searchText: string) => {\n    const ops = options?.filter(o => Boolean(o.label?.trim())) || []\n    const filteredData = ops.filter((option: any) =>\n      option.name.toLowerCase().includes(searchText.toLowerCase()),\n    );\n    setFilteredOptions(filteredData);\n  };\n\n  useEffect(() => {\n    setFilteredOptions(options?.filter(o => Boolean(o.label?.trim())) || [])\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  },[options?.length])\n\n\n  return (\n    <Box width=\"100%\">\n      <Select\n        fullWidth\n        value={value}\n        onChange={(e: any) => handleOnChange(e.target.value)}\n        {...rest}\n        className=\"select-drps\"\n        variant=\"outlined\"\n        renderValue={(value: any) => formatText(t(filteredOptions?.find((opttion: any)=>opttion.name === value)?.label)?.replace(\"_id\", '')?.replaceAll(\"_\", \" \") || \"Select Default\")}\n        onClose={() => setFilteredOptions(options?.filter(o => Boolean(o.label?.trim())) || [])}\n      >\n        <div className=\"searchbar-box-list new-searchbar\">\n          <SearchBar\n            placeholder={\"Search Attributes\"}\n            handleSearch={(e) => handleSearchEvent(e)}\n          />\n        </div>\n        {filteredOptions?.map((op: any) => (\n          <MenuItem key={op.name} value={op.name}>\n            <Typography type=\"s4\" color=\"theme.secondary.1000\">\n              {formatText(t(op.label)?.replace(\"_id\", '')?.replaceAll(\"_\", \" \"))}\n            </Typography>\n          </MenuItem>\n        ))}\n      </Select>\n    </Box>\n  );\n};\n\nexport default FieldSelect;\n"],"names":["value"],"mappings":";;;;;;;;;;AAUA,MAAM,cAAc,CAAC,UAA8B;AAEjD,QAAM,EAAE,EAAA,IAAM,eAAA;AAEd,QAAM,EAAE,gBAAgB,OAAO,SAAS,GAAG,SAAS;AAEpD,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAA;AAE9C,QAAM,oBAAoB,CAAC,eAAuB;AAChD,UAAM,OAAM,mCAAS,OAAO,CAAA,MAAA;;AAAK,sBAAQ,OAAE,UAAF,mBAAS,MAAM;AAAA,WAAM,CAAA;AAC9D,UAAM,eAAe,IAAI;AAAA,MAAO,CAAC,WAC/B,OAAO,KAAK,cAAc,SAAS,WAAW,YAAA,CAAa;AAAA,IAAA;AAE7D,uBAAmB,YAAY;AAAA,EACjC;AAEA,YAAU,MAAM;AACd,wBAAmB,mCAAS,OAAO,CAAA,MAAA;;AAAK,sBAAQ,OAAE,UAAF,mBAAS,MAAM;AAAA,WAAM,CAAA,CAAE;AAAA,EAEzE,GAAE,CAAC,mCAAS,MAAM,CAAC;AAGnB,SACE,oBAAC,KAAA,EAAI,OAAM,QACT,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAS;AAAA,MACT;AAAA,MACA,UAAU,CAAC,MAAW,eAAe,EAAE,OAAO,KAAK;AAAA,MAClD,GAAG;AAAA,MACJ,WAAU;AAAA,MACV,SAAQ;AAAA,MACR,aAAa,CAACA,WAAAA;;AAAe,4BAAW,cAAE,wDAAiB,KAAK,CAAC,YAAe,QAAQ,SAASA,YAAvD,mBAA+D,KAAK,MAAtE,mBAAyE,QAAQ,OAAO,QAAxF,mBAA6F,WAAW,KAAK,SAAQ,gBAAgB;AAAA;AAAA,MAC7K,SAAS,MAAM,oBAAmB,mCAAS,OAAO,CAAA,MAAA;;AAAK,wBAAQ,OAAE,UAAF,mBAAS,MAAM;AAAA,aAAM,CAAA,CAAE;AAAA,MAEtF,UAAA;AAAA,QAAA,oBAAC,OAAA,EAAI,WAAU,oCACb,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,aAAa;AAAA,YACb,cAAc,CAAC,MAAM,kBAAkB,CAAC;AAAA,UAAA;AAAA,QAAA,GAE5C;AAAA,QACC,mDAAiB,IAAI,CAAC,OAAA;;qCACpB,UAAA,EAAuB,OAAO,GAAG,MAChC,UAAA,oBAAC,YAAA,EAAW,MAAK,MAAK,OAAM,wBACzB,UAAA,YAAW,aAAE,GAAG,KAAK,MAAV,mBAAa,QAAQ,OAAO,QAA5B,mBAAiC,WAAW,KAAK,IAAI,EAAA,CACnE,EAAA,GAHa,GAAG,IAIlB;AAAA;AAAA,MACD;AAAA,IAAA;AAAA,EAAA,GAEL;AAEJ;"}

package/dist/components/filter/components/field-select/index.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("react"),r=require("@mui/material"),a=,/* empty css                            */t=,/* empty css                                    */i=;/* empty css                                    */;/* empty css                       */var n=,/* empty css                                   */u=require("react-i18next");exports.default=s=>{const{t:o}=u.useTranslation(),{handleOnChange:d,value:c,options:v,...h}=s,[p,x]=l.useState();return l.useEffect(()=>{x((null==v?void 0:v.filter(e=>{var l;return Boolean(null==(l=e.label)?void 0:l.trim())}))||[])},[null==v?void 0:v.length]),/* @__PURE__ */e.jsx(r.Box,{width:"100%",children:/* @__PURE__ */e.jsxs(a.default,{fullWidth:!0,value:c,onChange:e=>d(e.target.value),...h,className:"select-drps",variant:"outlined",renderValue:e=>{var l,r,a;return n.default((null==(a=null==(r=o(null==(l=null==p?void 0:p.find(l=>l.name===e))?void 0:l.label))?void 0:r.replace("_id",""))?void 0:a.replaceAll("_"," "))||"Select Default")},onClose:()=>x((null==v?void 0:v.filter(e=>{var l;return Boolean(null==(l=e.label)?void 0:l.trim())}))||[]),children:[
-/* @__PURE__ */e.jsx("div",{className:"searchbar-box-list new-searchbar",children:/* @__PURE__ */e.jsx(i.default,{placeholder:"Search Attributes",handleSearch:e=>(e=>{const l=((null==v?void 0:v.filter(e=>{var l;return Boolean(null==(l=e.label)?void 0:l.trim())}))||[]).filter(l=>l.name.toLowerCase().includes(e.toLowerCase()));x(l)})(e)})}),null==p?void 0:p.map(l=>{var a,i;/* @__PURE__ */
-return e.jsx(r.MenuItem,{value:l.name,children:/* @__PURE__ */e.jsx(t.Typography,{type:"s4",color:"theme.secondary.1000",children:n.default(null==(i=null==(a=o(l.label))?void 0:a.replace("_id",""))?void 0:i.replaceAll("_"," "))})},l.name)})]})})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("react"),r=,/* empty css                            */a=,/* empty css                                    */t=;/* empty css                                    */;/* empty css                       */var i=,/* empty css                                   */n=require("react-i18next"),u=,/* empty css                                                    */d=;/* empty css                                                              */exports.default=s=>{const{t:o}=n.useTranslation(),{handleOnChange:c,value:v,options:h,...m}=s,[x,f]=l.useState();return l.useEffect(()=>{f((null==h?void 0:h.filter(e=>{var l;return Boolean(null==(l=e.label)?void 0:l.trim())}))||[])},[null==h?void 0:h.length]),/* @__PURE__ */e.jsx(u.default,{width:"100%",children:/* @__PURE__ */e.jsxs(r.default,{fullWidth:!0,value:v,onChange:e=>c(e.target.value),...m,className:"select-drps",variant:"outlined",renderValue:e=>{var l,r,a;return i.default((null==(a=null==(r=o(null==(l=null==x?void 0:x.find(l=>l.name===e))?void 0:l.label))?void 0:r.replace("_id",""))?void 0:a.replaceAll("_"," "))||"Select Default")},onClose:()=>f((null==h?void 0:h.filter(e=>{var l;return Boolean(null==(l=e.label)?void 0:l.trim())}))||[]),children:[
+/* @__PURE__ */e.jsx("div",{className:"searchbar-box-list new-searchbar",children:/* @__PURE__ */e.jsx(t.default,{placeholder:"Search Attributes",handleSearch:e=>(e=>{const l=((null==h?void 0:h.filter(e=>{var l;return Boolean(null==(l=e.label)?void 0:l.trim())}))||[]).filter(l=>l.name.toLowerCase().includes(e.toLowerCase()));f(l)})(e)})}),null==x?void 0:x.map(l=>{var r,t;/* @__PURE__ */
+return e.jsx(d.default,{value:l.name,children:/* @__PURE__ */e.jsx(a.Typography,{type:"s4",color:"theme.secondary.1000",children:i.default(null==(t=null==(r=o(l.label))?void 0:r.replace("_id",""))?void 0:t.replaceAll("_"," "))})},l.name)})]})})};
 //# sourceMappingURL=index.js.map

package/dist/components/filter/components/field-select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/components/filter/components/field-select.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { Box, MenuItem } from \"@mui/material\";\nimport Select from \"../../select/select\";\nimport Typography from \"../../typography/typography\";\nimport { FieldSelectorProps } from \"react-querybuilder\";\nimport SearchBar from \"../../search-bar/search-bar\";\nimport \"../filter.scss\";\nimport formatText from \"../../../utils/format-text\";\nimport { useTranslation } from \"react-i18next\";\n\nconst FieldSelect = (props: FieldSelectorProps) => {\n\n  const { t } = useTranslation();\n\n  const { handleOnChange, value, options, ...rest } = props;\n\n  const [filteredOptions, setFilteredOptions] = useState<any[]>();\n\n  const handleSearchEvent = (searchText: string) => {\n    const ops = options?.filter(o => Boolean(o.label?.trim())) || []\n    const filteredData = ops.filter((option: any) =>\n      option.name.toLowerCase().includes(searchText.toLowerCase()),\n    );\n    setFilteredOptions(filteredData);\n  };\n\n  useEffect(() => {\n    setFilteredOptions(options?.filter(o => Boolean(o.label?.trim())) || [])\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  },[options?.length])\n\n\n  return (\n    <Box width=\"100%\">\n      <Select\n        fullWidth\n        value={value}\n        onChange={(e: any) => handleOnChange(e.target.value)}\n        {...rest}\n        className=\"select-drps\"\n        variant=\"outlined\"\n        renderValue={(value: any) => formatText(t(filteredOptions?.find((opttion: any)=>opttion.name === value)?.label)?.replace(\"_id\", '')?.replaceAll(\"_\", \" \") || \"Select Default\")}\n        onClose={() => setFilteredOptions(options?.filter(o => Boolean(o.label?.trim())) || [])}\n      >\n        <div className=\"searchbar-box-list new-searchbar\">\n          <SearchBar\n            placeholder={\"Search Attributes\"}\n            handleSearch={(e) => handleSearchEvent(e)}\n          />\n        </div>\n        {filteredOptions?.map((op: any) => (\n          <MenuItem key={op.name} value={op.name}>\n            <Typography type=\"s4\" color=\"theme.secondary.1000\">\n              {formatText(t(op.label)?.replace(\"_id\", '')?.replaceAll(\"_\", \" \"))}\n            </Typography>\n          </MenuItem>\n        ))}\n      </Select>\n    </Box>\n  );\n};\n\nexport default FieldSelect;\n"],"names":["props","t","useTranslation","handleOnChange","value","options","rest","filteredOptions","setFilteredOptions","useState","useEffect","filter","o","Boolean","_a","label","trim","length","jsx","Box","width","children","jsxs","Select","fullWidth","onChange","e","target","className","variant","renderValue","formatText","_c","find","opttion","name","_b","replace","replaceAll","onClose","SearchBar","placeholder","handleSearch","searchText","filteredData","option","toLowerCase","includes","handleSearchEvent","map","op","MenuItem","Typography","type","color"],"mappings":"qbAUqBA,IAEnB,MAAMC,EAAEA,GAAMC,oBAERC,eAAEA,EAAAC,MAAgBA,EAAAC,QAAOA,KAAYC,GAASN,GAE7CO,EAAiBC,GAAsBC,aAgB9C,OANAC,EAAAA,UAAU,KACRF,GAAmB,MAAAH,OAAA,EAAAA,EAASM,OAAOC,UAAK,OAAAC,QAAQ,OAAAC,EAAAF,EAAEG,YAAF,EAAAD,EAASE,YAAY,KAErE,CAAC,MAAAX,OAAA,EAAAA,EAASY,wBAIVC,EAAAA,IAACC,EAAAA,IAAA,CAAIC,MAAM,OACTC,wBAAAC,EAAAA,KAACC,EAAAA,QAAA,CACCC,WAAS,EACTpB,QACAqB,SAAWC,GAAWvB,EAAeuB,EAAEC,OAAOvB,UAC1CE,EACJsB,UAAU,cACVC,QAAQ,WACRC,YAAc1B,cAAe2B,OAAAA,EAAAA,SAAW,OAAAC,EAAA,WAAE,OAAAlB,EAAA,MAAAP,OAAA,EAAAA,EAAiB0B,KAAMC,GAAeA,EAAQC,OAAS/B,SAAvD,EAAAU,EAA+DC,aAAjE,EAAAqB,EAAyEC,QAAQ,MAAO,cAAKC,WAAW,IAAK,OAAQ,mBAC7JC,QAAS,IAAM/B,GAAmB,MAAAH,OAAA,EAAAA,EAASM,OAAOC,UAAK,OAAAC,QAAQ,OAAAC,EAAAF,EAAEG,YAAF,EAAAD,EAASE,YAAY,IAEpFK,SAAA;iBAAAH,IAAC,MAAA,CAAIU,UAAU,mCACbP,wBAAAH,EAAAA,IAACsB,EAAAA,QAAA,CACCC,YAAa,oBACbC,aAAehB,GA7BC,CAACiB,IACzB,MACMC,IADM,MAAAvC,OAAA,EAAAA,EAASM,OAAOC,UAAK,OAAAC,QAAQ,OAAAC,EAAAF,EAAEG,YAAF,EAAAD,EAASE,YAAY,IACrCL,OAAQkC,GAC/BA,EAAOV,KAAKW,cAAcC,SAASJ,EAAWG,gBAEhDtC,EAAmBoC,IAwBUI,CAAkBtB,OAG1C,MAAAnB,OAAA,EAAAA,EAAiB0C,IAAKC;aACpBC,EAAAA,SAAA,CAAuB/C,MAAO8C,EAAGf,KAChCd,wBAAAH,EAAAA,IAACkC,EAAAA,WAAA,CAAWC,KAAK,KAAKC,MAAM,uBACzBjC,SAAAU,EAAAA,QAAW,OAAAK,EAAA,WAAEc,EAAGnC,aAAL,EAAAD,EAAauB,QAAQ,MAAO,UAA5B,EAAAD,EAAiCE,WAAW,IAAK,SAFlDY,EAAGf"}
+{"version":3,"file":"index.js","sources":["../../../../../src/components/filter/components/field-select.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { Box, MenuItem } from \"@mui/material\";\nimport Select from \"../../select/select\";\nimport Typography from \"../../typography/typography\";\nimport { FieldSelectorProps } from \"react-querybuilder\";\nimport SearchBar from \"../../search-bar/search-bar\";\nimport \"../filter.scss\";\nimport formatText from \"../../../utils/format-text\";\nimport { useTranslation } from \"react-i18next\";\n\nconst FieldSelect = (props: FieldSelectorProps) => {\n\n  const { t } = useTranslation();\n\n  const { handleOnChange, value, options, ...rest } = props;\n\n  const [filteredOptions, setFilteredOptions] = useState<any[]>();\n\n  const handleSearchEvent = (searchText: string) => {\n    const ops = options?.filter(o => Boolean(o.label?.trim())) || []\n    const filteredData = ops.filter((option: any) =>\n      option.name.toLowerCase().includes(searchText.toLowerCase()),\n    );\n    setFilteredOptions(filteredData);\n  };\n\n  useEffect(() => {\n    setFilteredOptions(options?.filter(o => Boolean(o.label?.trim())) || [])\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  },[options?.length])\n\n\n  return (\n    <Box width=\"100%\">\n      <Select\n        fullWidth\n        value={value}\n        onChange={(e: any) => handleOnChange(e.target.value)}\n        {...rest}\n        className=\"select-drps\"\n        variant=\"outlined\"\n        renderValue={(value: any) => formatText(t(filteredOptions?.find((opttion: any)=>opttion.name === value)?.label)?.replace(\"_id\", '')?.replaceAll(\"_\", \" \") || \"Select Default\")}\n        onClose={() => setFilteredOptions(options?.filter(o => Boolean(o.label?.trim())) || [])}\n      >\n        <div className=\"searchbar-box-list new-searchbar\">\n          <SearchBar\n            placeholder={\"Search Attributes\"}\n            handleSearch={(e) => handleSearchEvent(e)}\n          />\n        </div>\n        {filteredOptions?.map((op: any) => (\n          <MenuItem key={op.name} value={op.name}>\n            <Typography type=\"s4\" color=\"theme.secondary.1000\">\n              {formatText(t(op.label)?.replace(\"_id\", '')?.replaceAll(\"_\", \" \"))}\n            </Typography>\n          </MenuItem>\n        ))}\n      </Select>\n    </Box>\n  );\n};\n\nexport default FieldSelect;\n"],"names":["props","t","useTranslation","handleOnChange","value","options","rest","filteredOptions","setFilteredOptions","useState","useEffect","filter","o","Boolean","_a","label","trim","length","jsx","Box","width","children","jsxs","Select","fullWidth","onChange","e","target","className","variant","renderValue","formatText","_c","find","opttion","name","_b","replace","replaceAll","onClose","SearchBar","placeholder","handleSearch","searchText","filteredData","option","toLowerCase","includes","handleSearchEvent","map","op","MenuItem","Typography","type","color"],"mappings":"8iBAUqBA,IAEnB,MAAMC,EAAEA,GAAMC,oBAERC,eAAEA,EAAAC,MAAgBA,EAAAC,QAAOA,KAAYC,GAASN,GAE7CO,EAAiBC,GAAsBC,aAgB9C,OANAC,EAAAA,UAAU,KACRF,GAAmB,MAAAH,OAAA,EAAAA,EAASM,OAAOC,UAAK,OAAAC,QAAQ,OAAAC,EAAAF,EAAEG,YAAF,EAAAD,EAASE,YAAY,KAErE,CAAC,MAAAX,OAAA,EAAAA,EAASY,wBAIVC,EAAAA,IAACC,EAAAA,QAAA,CAAIC,MAAM,OACTC,wBAAAC,EAAAA,KAACC,EAAAA,QAAA,CACCC,WAAS,EACTpB,QACAqB,SAAWC,GAAWvB,EAAeuB,EAAEC,OAAOvB,UAC1CE,EACJsB,UAAU,cACVC,QAAQ,WACRC,YAAc1B,cAAe2B,OAAAA,EAAAA,SAAW,OAAAC,EAAA,WAAE,OAAAlB,EAAA,MAAAP,OAAA,EAAAA,EAAiB0B,KAAMC,GAAeA,EAAQC,OAAS/B,SAAvD,EAAAU,EAA+DC,aAAjE,EAAAqB,EAAyEC,QAAQ,MAAO,cAAKC,WAAW,IAAK,OAAQ,mBAC7JC,QAAS,IAAM/B,GAAmB,MAAAH,OAAA,EAAAA,EAASM,OAAOC,UAAK,OAAAC,QAAQ,OAAAC,EAAAF,EAAEG,YAAF,EAAAD,EAASE,YAAY,IAEpFK,SAAA;iBAAAH,IAAC,MAAA,CAAIU,UAAU,mCACbP,wBAAAH,EAAAA,IAACsB,EAAAA,QAAA,CACCC,YAAa,oBACbC,aAAehB,GA7BC,CAACiB,IACzB,MACMC,IADM,MAAAvC,OAAA,EAAAA,EAASM,OAAOC,UAAK,OAAAC,QAAQ,OAAAC,EAAAF,EAAEG,YAAF,EAAAD,EAASE,YAAY,IACrCL,OAAQkC,GAC/BA,EAAOV,KAAKW,cAAcC,SAASJ,EAAWG,gBAEhDtC,EAAmBoC,IAwBUI,CAAkBtB,OAG1C,MAAAnB,OAAA,EAAAA,EAAiB0C,IAAKC;aACpBC,EAAAA,QAAA,CAAuB/C,MAAO8C,EAAGf,KAChCd,wBAAAH,EAAAA,IAACkC,EAAAA,WAAA,CAAWC,KAAK,KAAKC,MAAM,uBACzBjC,SAAAU,EAAAA,QAAW,OAAAK,EAAA,WAAEc,EAAGnC,aAAL,EAAAD,EAAauB,QAAQ,MAAO,UAA5B,EAAAD,EAAiCE,WAAW,IAAK,SAFlDY,EAAGf"}

package/dist/components/filter/components/operator-select/index.esm.js

@@ -1,8 +1,9 @@
 import { jsx } from "react/jsx-runtime";
-import { Box, MenuItem } from "@mui/material";
 import Select from "../../../select/select/index.esm.js";
 import { Typography } from "../../../typography/typography/index.esm.js";
 import formatText from "../../../../utils/format-text/index.esm.js";
+import Box from "../../../../node_modules/@mui/material/Box/Box/index.esm.js";
+import MenuItem from "../../../../node_modules/@mui/material/MenuItem/MenuItem/index.esm.js";
 const OperatorSelect = (props) => {
   var _a;
   const { handleOnChange, options, ...rest } = props;

package/dist/components/filter/components/operator-select/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../../src/components/filter/components/operator-select.tsx"],"sourcesContent":["import { Box, MenuItem } from \"@mui/material\";\nimport Select from \"../../select/select\";\nimport Typography from \"../../typography/typography\";\nimport { OperatorSelectorProps } from \"react-querybuilder\";\nimport formatText from \"../../../utils/format-text\";\n\nconst OperatorSelect = (props: OperatorSelectorProps) => {\n  const { handleOnChange, options, ...rest } = props;\n\n\n  return (\n    <Box width='100%'>\n      <Select\n        fullWidth\n        {...rest}\n        onChange={(e: any) => handleOnChange(e.target.value)}\n        className=\"select-drps\"\n        variant=\"outlined\"\n        renderValue= {(selected: string) => {\n          const dValue = options?.find(o => o.name==selected)?.label\n          return dValue ? formatText(dValue) : selected\n        }}\n      >\n        {options?.filter(o => Boolean(o.label?.trim()))?.map((op: any) => (\n          <MenuItem key={op.name} value={op.name}>\n            <Typography type=\"s4\" color=\"theme.secondary.1000\">\n              {formatText(op.label)}\n            </Typography>\n          </MenuItem>\n        ))}\n      </Select>\n    </Box>\n  );\n};\n\nexport default OperatorSelect;\n"],"names":["_a"],"mappings":";;;;;AAMA,MAAM,iBAAiB,CAAC,UAAiC;;AACvD,QAAM,EAAE,gBAAgB,SAAS,GAAG,SAAS;AAG7C,SACE,oBAAC,KAAA,EAAI,OAAM,QACT,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAS;AAAA,MACR,GAAG;AAAA,MACJ,UAAU,CAAC,MAAW,eAAe,EAAE,OAAO,KAAK;AAAA,MACnD,WAAU;AAAA,MACV,SAAQ;AAAA,MACR,aAAc,CAAC,aAAqB;;AAClC,cAAM,UAASA,MAAA,mCAAS,KAAK,OAAK,EAAE,QAAM,cAA3B,gBAAAA,IAAsC;AACrD,eAAO,SAAS,WAAW,MAAM,IAAI;AAAA,MACvC;AAAA,MAEC,WAAA,wCAAS,OAAO,CAAA,MAAA;;AAAK,wBAAQA,MAAA,EAAE,UAAF,gBAAAA,IAAS,MAAM;AAAA,aAA5C,mBAAgD,IAAI,CAAC,OACpD,oBAAC,UAAA,EAAuB,OAAO,GAAG,MAChC,UAAA,oBAAC,YAAA,EAAW,MAAK,MAAK,OAAM,wBACzB,UAAA,WAAW,GAAG,KAAK,EAAA,CACtB,EAAA,GAHa,GAAG,IAIlB;AAAA,IACD;AAAA,EAAA,GAEL;AAEJ;"}
+{"version":3,"file":"index.esm.js","sources":["../../../../../src/components/filter/components/operator-select.tsx"],"sourcesContent":["import { Box, MenuItem } from \"@mui/material\";\nimport Select from \"../../select/select\";\nimport Typography from \"../../typography/typography\";\nimport { OperatorSelectorProps } from \"react-querybuilder\";\nimport formatText from \"../../../utils/format-text\";\n\nconst OperatorSelect = (props: OperatorSelectorProps) => {\n  const { handleOnChange, options, ...rest } = props;\n\n\n  return (\n    <Box width='100%'>\n      <Select\n        fullWidth\n        {...rest}\n        onChange={(e: any) => handleOnChange(e.target.value)}\n        className=\"select-drps\"\n        variant=\"outlined\"\n        renderValue= {(selected: string) => {\n          const dValue = options?.find(o => o.name==selected)?.label\n          return dValue ? formatText(dValue) : selected\n        }}\n      >\n        {options?.filter(o => Boolean(o.label?.trim()))?.map((op: any) => (\n          <MenuItem key={op.name} value={op.name}>\n            <Typography type=\"s4\" color=\"theme.secondary.1000\">\n              {formatText(op.label)}\n            </Typography>\n          </MenuItem>\n        ))}\n      </Select>\n    </Box>\n  );\n};\n\nexport default OperatorSelect;\n"],"names":["_a"],"mappings":";;;;;;AAMA,MAAM,iBAAiB,CAAC,UAAiC;;AACvD,QAAM,EAAE,gBAAgB,SAAS,GAAG,SAAS;AAG7C,SACE,oBAAC,KAAA,EAAI,OAAM,QACT,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAS;AAAA,MACR,GAAG;AAAA,MACJ,UAAU,CAAC,MAAW,eAAe,EAAE,OAAO,KAAK;AAAA,MACnD,WAAU;AAAA,MACV,SAAQ;AAAA,MACR,aAAc,CAAC,aAAqB;;AAClC,cAAM,UAASA,MAAA,mCAAS,KAAK,OAAK,EAAE,QAAM,cAA3B,gBAAAA,IAAsC;AACrD,eAAO,SAAS,WAAW,MAAM,IAAI;AAAA,MACvC;AAAA,MAEC,WAAA,wCAAS,OAAO,CAAA,MAAA;;AAAK,wBAAQA,MAAA,EAAE,UAAF,gBAAAA,IAAS,MAAM;AAAA,aAA5C,mBAAgD,IAAI,CAAC,OACpD,oBAAC,UAAA,EAAuB,OAAO,GAAG,MAChC,UAAA,oBAAC,YAAA,EAAW,MAAK,MAAK,OAAM,wBACzB,UAAA,WAAW,GAAG,KAAK,EAAA,CACtB,EAAA,GAHa,GAAG,IAIlB;AAAA,IACD;AAAA,EAAA,GAEL;AAEJ;"}

package/dist/components/filter/components/operator-select/index.js

@@ -1,3 +1,3 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@mui/material"),l=require("../../../select/select/index.js"),t=require("../../../typography/typography/index.js"),a=require("../../../../utils/format-text/index.js");exports.default=n=>{var i;const{handleOnChange:u,options:d,...o}=n;/* @__PURE__ */
-return e.jsx(r.Box,{width:"100%",children:/* @__PURE__ */e.jsx(l.default,{fullWidth:!0,...o,onChange:e=>u(e.target.value),className:"select-drps",variant:"outlined",renderValue:e=>{var r;const l=null==(r=null==d?void 0:d.find(r=>r.name==e))?void 0:r.label;return l?a.default(l):e},children:null==(i=null==d?void 0:d.filter(e=>{var r;return Boolean(null==(r=e.label)?void 0:r.trim())}))?void 0:i.map(l=>/* @__PURE__ */e.jsx(r.MenuItem,{value:l.name,children:/* @__PURE__ */e.jsx(t.Typography,{type:"s4",color:"theme.secondary.1000",children:a.default(l.label)})},l.name))})})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../../select/select/index.js"),l=require("../../../typography/typography/index.js"),t=require("../../../../utils/format-text/index.js"),a=require("../../../../node_modules/@mui/material/Box/Box/index.js"),n=require("../../../../node_modules/@mui/material/MenuItem/MenuItem/index.js");exports.default=i=>{var u;const{handleOnChange:d,options:o,...s}=i;/* @__PURE__ */
+return e.jsx(a.default,{width:"100%",children:/* @__PURE__ */e.jsx(r.default,{fullWidth:!0,...s,onChange:e=>d(e.target.value),className:"select-drps",variant:"outlined",renderValue:e=>{var r;const l=null==(r=null==o?void 0:o.find(r=>r.name==e))?void 0:r.label;return l?t.default(l):e},children:null==(u=null==o?void 0:o.filter(e=>{var r;return Boolean(null==(r=e.label)?void 0:r.trim())}))?void 0:u.map(r=>/* @__PURE__ */e.jsx(n.default,{value:r.name,children:/* @__PURE__ */e.jsx(l.Typography,{type:"s4",color:"theme.secondary.1000",children:t.default(r.label)})},r.name))})})};
 //# sourceMappingURL=index.js.map

package/dist/components/filter/components/operator-select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/components/filter/components/operator-select.tsx"],"sourcesContent":["import { Box, MenuItem } from \"@mui/material\";\nimport Select from \"../../select/select\";\nimport Typography from \"../../typography/typography\";\nimport { OperatorSelectorProps } from \"react-querybuilder\";\nimport formatText from \"../../../utils/format-text\";\n\nconst OperatorSelect = (props: OperatorSelectorProps) => {\n  const { handleOnChange, options, ...rest } = props;\n\n\n  return (\n    <Box width='100%'>\n      <Select\n        fullWidth\n        {...rest}\n        onChange={(e: any) => handleOnChange(e.target.value)}\n        className=\"select-drps\"\n        variant=\"outlined\"\n        renderValue= {(selected: string) => {\n          const dValue = options?.find(o => o.name==selected)?.label\n          return dValue ? formatText(dValue) : selected\n        }}\n      >\n        {options?.filter(o => Boolean(o.label?.trim()))?.map((op: any) => (\n          <MenuItem key={op.name} value={op.name}>\n            <Typography type=\"s4\" color=\"theme.secondary.1000\">\n              {formatText(op.label)}\n            </Typography>\n          </MenuItem>\n        ))}\n      </Select>\n    </Box>\n  );\n};\n\nexport default OperatorSelect;\n"],"names":["props","handleOnChange","options","rest","jsx","Box","width","children","Select","fullWidth","onChange","e","target","value","className","variant","renderValue","selected","dValue","_a","find","o","name","label","formatText","filter","Boolean","trim","map","op","MenuItem","Typography","type","color"],"mappings":"wSAMwBA,UACtB,MAAMC,eAAEA,EAAAC,QAAgBA,KAAYC,GAASH;AAG7C,OACEI,EAAAA,IAACC,EAAAA,IAAA,CAAIC,MAAM,OACTC,wBAAAH,EAAAA,IAACI,EAAAA,QAAA,CACCC,WAAS,KACLN,EACJO,SAAWC,GAAWV,EAAeU,EAAEC,OAAOC,OAC9CC,UAAU,cACVC,QAAQ,WACRC,YAAeC,UACb,MAAMC,EAAS,OAAAC,EAAA,MAAAjB,OAAA,EAAAA,EAASkB,QAAUC,EAAEC,MAAML,SAA3B,EAAAE,EAAsCI,MACrD,OAAOL,EAASM,EAAAA,QAAWN,GAAUD,GAGtCV,SAAA,OAAAY,EAAA,MAAAjB,OAAA,EAAAA,EAASuB,OAAOJ,UAAK,OAAAK,QAAQ,OAAAP,EAAAE,EAAEE,YAAF,EAAAJ,EAASQ,gBAAtC,EAAAR,EAAgDS,IAAKC,oBACpDzB,IAAC0B,EAAAA,SAAA,CAAuBjB,MAAOgB,EAAGP,KAChCf,0BAAAH,IAAC2B,EAAAA,WAAA,CAAWC,KAAK,KAAKC,MAAM,uBACzB1B,SAAAiB,EAAAA,QAAWK,EAAGN,UAFJM,EAAGP"}
+{"version":3,"file":"index.js","sources":["../../../../../src/components/filter/components/operator-select.tsx"],"sourcesContent":["import { Box, MenuItem } from \"@mui/material\";\nimport Select from \"../../select/select\";\nimport Typography from \"../../typography/typography\";\nimport { OperatorSelectorProps } from \"react-querybuilder\";\nimport formatText from \"../../../utils/format-text\";\n\nconst OperatorSelect = (props: OperatorSelectorProps) => {\n  const { handleOnChange, options, ...rest } = props;\n\n\n  return (\n    <Box width='100%'>\n      <Select\n        fullWidth\n        {...rest}\n        onChange={(e: any) => handleOnChange(e.target.value)}\n        className=\"select-drps\"\n        variant=\"outlined\"\n        renderValue= {(selected: string) => {\n          const dValue = options?.find(o => o.name==selected)?.label\n          return dValue ? formatText(dValue) : selected\n        }}\n      >\n        {options?.filter(o => Boolean(o.label?.trim()))?.map((op: any) => (\n          <MenuItem key={op.name} value={op.name}>\n            <Typography type=\"s4\" color=\"theme.secondary.1000\">\n              {formatText(op.label)}\n            </Typography>\n          </MenuItem>\n        ))}\n      </Select>\n    </Box>\n  );\n};\n\nexport default OperatorSelect;\n"],"names":["props","handleOnChange","options","rest","jsx","Box","width","children","Select","fullWidth","onChange","e","target","value","className","variant","renderValue","selected","dValue","_a","find","o","name","label","formatText","filter","Boolean","trim","map","op","MenuItem","Typography","type","color"],"mappings":"iaAMwBA,UACtB,MAAMC,eAAEA,EAAAC,QAAgBA,KAAYC,GAASH;AAG7C,OACEI,EAAAA,IAACC,EAAAA,QAAA,CAAIC,MAAM,OACTC,wBAAAH,EAAAA,IAACI,EAAAA,QAAA,CACCC,WAAS,KACLN,EACJO,SAAWC,GAAWV,EAAeU,EAAEC,OAAOC,OAC9CC,UAAU,cACVC,QAAQ,WACRC,YAAeC,UACb,MAAMC,EAAS,OAAAC,EAAA,MAAAjB,OAAA,EAAAA,EAASkB,QAAUC,EAAEC,MAAML,SAA3B,EAAAE,EAAsCI,MACrD,OAAOL,EAASM,EAAAA,QAAWN,GAAUD,GAGtCV,SAAA,OAAAY,EAAA,MAAAjB,OAAA,EAAAA,EAASuB,OAAOJ,UAAK,OAAAK,QAAQ,OAAAP,EAAAE,EAAEE,YAAF,EAAAJ,EAASQ,gBAAtC,EAAAR,EAAgDS,IAAKC,oBACpDzB,IAAC0B,EAAAA,QAAA,CAAuBjB,MAAOgB,EAAGP,KAChCf,0BAAAH,IAAC2B,EAAAA,WAAA,CAAWC,KAAK,KAAKC,MAAM,uBACzB1B,SAAAiB,EAAAA,QAAWK,EAAGN,UAFJM,EAAGP"}

package/dist/components/filter/components/remove-action/index.esm.js

@@ -1,6 +1,7 @@
 import { jsx } from "react/jsx-runtime";
-import { Box, IconButton } from "@mui/material";
 import { useLanguage } from "../../../../hooks/useLangauge/index.esm.js";
+import Box from "../../../../node_modules/@mui/material/Box/Box/index.esm.js";
+import IconButton from "../../../../node_modules/@mui/material/IconButton/IconButton/index.esm.js";
 import { Trash } from "../../../icons/trash/index.esm.js";
 const RemoveAction = (props) => {
   const { isRtl } = useLanguage();

package/dist/components/filter/components/remove-action/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../../src/components/filter/components/remove-action.tsx"],"sourcesContent":["import { Box, IconButton } from \"@mui/material\";\nimport { ActionProps } from \"react-querybuilder\";\nimport { useLanguage } from \"../../../hooks/useLangauge\";\nimport { Trash } from \"../../icons\";\n\nconst RemoveAction = (props: ActionProps) => {\n  const { isRtl } = useLanguage();\n  const btnStyles = {\n    ...(isRtl ? { marginRight:-1.5 } : {}),\n  }\n  const iconStyles = {\n    color: 'theme.grey.600',\n    '&:hover': {\n      color: 'theme.error.600'\n    }\n  }\n  return (\n    <Box>\n      <IconButton sx={btnStyles} size={\"small\"} onClick={props.handleOnClick} disableRipple>\n        <Trash sx={{ fontSize: '1.35rem', ...iconStyles }} />\n      </IconButton>\n    </Box>\n  );\n};\n\nexport default RemoveAction;\n"],"names":[],"mappings":";;;;AAKA,MAAM,eAAe,CAAC,UAAuB;AAC3C,QAAM,EAAE,MAAA,IAAU,YAAA;AAClB,QAAM,YAAY;AAAA,IAChB,GAAI,QAAQ,EAAE,aAAY,SAAS,CAAA;AAAA,EAAC;AAEtC,QAAM,aAAa;AAAA,IACjB,OAAO;AAAA,IACP,WAAW;AAAA,MACT,OAAO;AAAA,IAAA;AAAA,EACT;AAEF,SACE,oBAAC,OACC,UAAA,oBAAC,YAAA,EAAW,IAAI,WAAW,MAAM,SAAS,SAAS,MAAM,eAAe,eAAa,MACnF,UAAA,oBAAC,OAAA,EAAM,IAAI,EAAE,UAAU,WAAW,GAAG,WAAA,EAAW,CAAG,EAAA,CACrD,EAAA,CACF;AAEJ;"}
+{"version":3,"file":"index.esm.js","sources":["../../../../../src/components/filter/components/remove-action.tsx"],"sourcesContent":["import { Box, IconButton } from \"@mui/material\";\nimport { ActionProps } from \"react-querybuilder\";\nimport { useLanguage } from \"../../../hooks/useLangauge\";\nimport { Trash } from \"../../icons\";\n\nconst RemoveAction = (props: ActionProps) => {\n  const { isRtl } = useLanguage();\n  const btnStyles = {\n    ...(isRtl ? { marginRight:-1.5 } : {}),\n  }\n  const iconStyles = {\n    color: 'theme.grey.600',\n    '&:hover': {\n      color: 'theme.error.600'\n    }\n  }\n  return (\n    <Box>\n      <IconButton sx={btnStyles} size={\"small\"} onClick={props.handleOnClick} disableRipple>\n        <Trash sx={{ fontSize: '1.35rem', ...iconStyles }} />\n      </IconButton>\n    </Box>\n  );\n};\n\nexport default RemoveAction;\n"],"names":[],"mappings":";;;;;AAKA,MAAM,eAAe,CAAC,UAAuB;AAC3C,QAAM,EAAE,MAAA,IAAU,YAAA;AAClB,QAAM,YAAY;AAAA,IAChB,GAAI,QAAQ,EAAE,aAAY,SAAS,CAAA;AAAA,EAAC;AAEtC,QAAM,aAAa;AAAA,IACjB,OAAO;AAAA,IACP,WAAW;AAAA,MACT,OAAO;AAAA,IAAA;AAAA,EACT;AAEF,SACE,oBAAC,OACC,UAAA,oBAAC,YAAA,EAAW,IAAI,WAAW,MAAM,SAAS,SAAS,MAAM,eAAe,eAAa,MACnF,UAAA,oBAAC,OAAA,EAAM,IAAI,EAAE,UAAU,WAAW,GAAG,WAAA,EAAW,CAAG,EAAA,CACrD,EAAA,CACF;AAEJ;"}

package/dist/components/filter/components/remove-action/index.js

@@ -1,3 +1,3 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@mui/material"),s=require("../../../../hooks/useLangauge/index.js"),i=require("../../../icons/trash/index.js");exports.default=t=>{const{isRtl:o}=s.useLanguage(),n={...o?{marginRight:-1.5}:{}};/* @__PURE__ */
-return e.jsx(r.Box,{children:/* @__PURE__ */e.jsx(r.IconButton,{sx:n,size:"small",onClick:t.handleOnClick,disableRipple:!0,children:/* @__PURE__ */e.jsx(i.Trash,{sx:{fontSize:"1.35rem",color:"theme.grey.600","&:hover":{color:"theme.error.600"}}})})})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../../../hooks/useLangauge/index.js"),i=require("../../../../node_modules/@mui/material/Box/Box/index.js"),s=require("../../../../node_modules/@mui/material/IconButton/IconButton/index.js"),o=require("../../../icons/trash/index.js");exports.default=t=>{const{isRtl:n}=r.useLanguage(),u={...n?{marginRight:-1.5}:{}};/* @__PURE__ */
+return e.jsx(i.default,{children:/* @__PURE__ */e.jsx(s.default,{sx:u,size:"small",onClick:t.handleOnClick,disableRipple:!0,children:/* @__PURE__ */e.jsx(o.Trash,{sx:{fontSize:"1.35rem",color:"theme.grey.600","&:hover":{color:"theme.error.600"}}})})})};
 //# sourceMappingURL=index.js.map

package/dist/components/filter/components/remove-action/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/components/filter/components/remove-action.tsx"],"sourcesContent":["import { Box, IconButton } from \"@mui/material\";\nimport { ActionProps } from \"react-querybuilder\";\nimport { useLanguage } from \"../../../hooks/useLangauge\";\nimport { Trash } from \"../../icons\";\n\nconst RemoveAction = (props: ActionProps) => {\n  const { isRtl } = useLanguage();\n  const btnStyles = {\n    ...(isRtl ? { marginRight:-1.5 } : {}),\n  }\n  const iconStyles = {\n    color: 'theme.grey.600',\n    '&:hover': {\n      color: 'theme.error.600'\n    }\n  }\n  return (\n    <Box>\n      <IconButton sx={btnStyles} size={\"small\"} onClick={props.handleOnClick} disableRipple>\n        <Trash sx={{ fontSize: '1.35rem', ...iconStyles }} />\n      </IconButton>\n    </Box>\n  );\n};\n\nexport default RemoveAction;\n"],"names":["props","isRtl","useLanguage","btnStyles","marginRight","jsx","Box","children","IconButton","sx","size","onClick","handleOnClick","disableRipple","Trash","fontSize","color"],"mappings":"iPAKsBA,IACpB,MAAMC,MAAEA,GAAUC,gBACZC,EAAY,IACZF,EAAQ,CAAEG,aAAY,KAAS,CAAA;AAQrC,SACEC,IAACC,EAAAA,KACCC,wBAAAF,EAAAA,IAACG,EAAAA,WAAA,CAAWC,GAAIN,EAAWO,KAAM,QAASC,QAASX,EAAMY,cAAeC,eAAa,EACnFN,wBAAAF,MAACS,EAAAA,MAAA,CAAML,GAAI,CAAEM,SAAU,UAR3BC,MAAO,iBACP,UAAW,CACTA,MAAO"}
+{"version":3,"file":"index.js","sources":["../../../../../src/components/filter/components/remove-action.tsx"],"sourcesContent":["import { Box, IconButton } from \"@mui/material\";\nimport { ActionProps } from \"react-querybuilder\";\nimport { useLanguage } from \"../../../hooks/useLangauge\";\nimport { Trash } from \"../../icons\";\n\nconst RemoveAction = (props: ActionProps) => {\n  const { isRtl } = useLanguage();\n  const btnStyles = {\n    ...(isRtl ? { marginRight:-1.5 } : {}),\n  }\n  const iconStyles = {\n    color: 'theme.grey.600',\n    '&:hover': {\n      color: 'theme.error.600'\n    }\n  }\n  return (\n    <Box>\n      <IconButton sx={btnStyles} size={\"small\"} onClick={props.handleOnClick} disableRipple>\n        <Trash sx={{ fontSize: '1.35rem', ...iconStyles }} />\n      </IconButton>\n    </Box>\n  );\n};\n\nexport default RemoveAction;\n"],"names":["props","isRtl","useLanguage","btnStyles","marginRight","jsx","Box","children","IconButton","sx","size","onClick","handleOnClick","disableRipple","Trash","fontSize","color"],"mappings":"8WAKsBA,IACpB,MAAMC,MAAEA,GAAUC,gBACZC,EAAY,IACZF,EAAQ,CAAEG,aAAY,KAAS,CAAA;AAQrC,SACEC,IAACC,EAAAA,SACCC,wBAAAF,EAAAA,IAACG,EAAAA,QAAA,CAAWC,GAAIN,EAAWO,KAAM,QAASC,QAASX,EAAMY,cAAeC,eAAa,EACnFN,wBAAAF,MAACS,EAAAA,MAAA,CAAML,GAAI,CAAEM,SAAU,UAR3BC,MAAO,iBACP,UAAW,CACTA,MAAO"}

package/dist/components/filter/components/value-editor/index.esm.js

@@ -1,6 +1,5 @@
 import { jsx } from "react/jsx-runtime";
 import { useState, useEffect, useMemo } from "react";
-import { Box } from "@mui/material";
 import TextField from "../../../text-field/text-field/index.esm.js";
 /* empty css                          */
 import DatePicker from "../../../date-picker/date-picker/index.esm.js";
@@ -9,6 +8,7 @@ import MultiSelect from "../../../multi-select/multi-select/index.esm.js";
 import _ from "lodash";
 import { formatLabel } from "../../../../utils/format-text/index.esm.js";
 import { getV1FilterFilterTable } from "../../../../api-client/api.system-feature/api/index.esm.js";
+import Box from "../../../../node_modules/@mui/material/Box/Box/index.esm.js";
 import { getToken } from "../../../../utils/common/index.esm.js";
 const getFilterTableFields = async (tableName, searchText, limit, offset = 0) => {
   try {