dinocollab-core 2.2.2 → 2.2.4

package/dist/lab/data-surface/index.js

@@ -1,2 +1,2 @@
-export{DataSurfaceViewMode,LoadingModeRule,RenderStrategyRule}from"../../src/lab/data-surface/types.js";export{createDataSurface}from"../../src/lab/data-surface/index.create.js";export{ListDensity}from"../../src/lab/data-surface/view-list.types.js";export{DinoDataSurFace,dinoDataSurface}from"../../src/lab/data-surface/index.dino.js";
+export{DataSurfaceViewMode,LoadingModeRule,RenderStrategyRule}from"../../src/lab/data-surface/types.js";export{getPaginationFromURL,getViewModeFromURL,setPaginationToURL,setViewModeToURL}from"../../src/lab/data-surface/helpers.js";export{createDataSurface}from"../../src/lab/data-surface/index.create.js";export{ListDensity}from"../../src/lab/data-surface/view-list.types.js";export{DinoDataSurFace,dinoDataSurface}from"../../src/lab/data-surface/index.dino.js";
 //# sourceMappingURL=index.js.map

package/dist/src/filter-bar/components/filter-input.units.js

@@ -1,2 +1,2 @@
-import{objectSpread2 as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as l,jsx as r}from"react/jsx-runtime";import{InputAdornment as o,Tooltip as i,IconButton as a,colors as t,SvgIcon as n}from"@mui/material";import c from"@mui/icons-material/Close";import s from"@mui/icons-material/Search";import{KeySpecial as u}from"../types.js";function d(e,l){var r=(l||"").toString().trim().toLowerCase(),o=Object.keys(e.fields||{}),i=[];return o.forEach(function(l){var o,a,t=e.fields[l];if(t){var n=null===(o=e.matches)||void 0===o?void 0:o[l],c=null!==(a=null==n?void 0:n.rules)&&void 0!==a?a:[{rule:"always"}];(Array.isArray(c)?c:[]).forEach(function(e){switch(e.rule){case"always":return void i.push({field:l,label:t.label});case"existed":return void(r&&i.push({field:l,label:t.label}));case"link":try{new URL(r),i.push({field:l,label:t.label})}catch(e){}return;case"custom":var o;return void(null!==(o=e.validate)&&void 0!==o&&o.call(e,r)&&i.push({field:l,label:t.label}));default:return}})}}),i.sort(function(e,l){return e.field===u.quickSearch?1:l.field===u.quickSearch?-1:0})}var f=function(l){return r(n,e(e({viewBox:"2 0 24 24",version:"1.0"},l),{},{children:r("path",{fill:"currentColor",d:"M19,6a1,1,0,0,0-1,1v4a1,1,0,0,1-1,1H7.41l1.3-1.29A1,1,0,0,0,7.29,9.29l-3,3a1,1,0,0,0-.21.33,1,1,0,0,0,0,.76,1,1,0,0,0,.21.33l3,3a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42L7.41,14H17a3,3,0,0,0,3-3V7A1,1,0,0,0,19,6Z"})}))},m=function(e){var n=e.hasKeyword,u=e.onSubmit,d=e.onClear;return l(o,{position:"end",children:[n&&r(i,{title:"The enter or click to apply",placement:"top",arrow:!0,children:r(a,{size:"small",sx:{flex:"0 0 auto",color:t.blue[600],"&:hover":{color:t.blue[900]}},onClick:u,children:r(f,{fontSize:"small"})})}),n&&r(i,{title:"Clear",placement:"top",arrow:!0,children:r(a,{size:"small",sx:{flex:"0 0 auto",color:t.red[500],"&:hover":{color:t.red[700]}},onClick:d,children:r(c,{fontSize:"small"})})}),!n&&r(i,{title:"Enter the value to search for",placement:"top",arrow:!0,children:r(a,{size:"small",sx:{flex:"0 0 auto"},onClick:e.onSearch,children:r(s,{fontSize:"small"})})})]})};export{m as InputAdornmentRight,d as getFieldsByMatches};
+import{objectSpread2 as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as l,jsx as r}from"react/jsx-runtime";import{InputAdornment as i,Tooltip as o,IconButton as a,colors as t,SvgIcon as n}from"@mui/material";import c from"@mui/icons-material/Close";import s from"@mui/icons-material/Search";import{KeySpecial as u}from"../types.js";function d(e,l){var r=(l||"").toString().trim().toLowerCase(),i=Object.keys(e.fields||{}),o=[];return i.forEach(function(l){var i,a,t=e.fields[l];if(t){var n=null===(i=e.matches)||void 0===i?void 0:i[l],c=null!==(a=null==n?void 0:n.rules)&&void 0!==a?a:[{rule:"always"}];(Array.isArray(c)?c:[]).forEach(function(e){switch(e.rule){case"always":return void o.push({field:l,label:t.label});case"existed":return void(r&&o.push({field:l,label:t.label}));case"link":try{new URL(r),o.push({field:l,label:t.label})}catch(e){}return;case"custom":var i;return void(null!==(i=e.validate)&&void 0!==i&&i.call(e,r)&&o.push({field:l,label:t.label}));default:return}})}}),o.sort(function(e,l){return e.field===u.quickSearch?1:l.field===u.quickSearch?-1:0})}var f=function(l){return r(n,e(e({viewBox:"2 0 24 24",version:"1.0"},l),{},{children:r("path",{fill:"currentColor",d:"M19,6a1,1,0,0,0-1,1v4a1,1,0,0,1-1,1H7.41l1.3-1.29A1,1,0,0,0,7.29,9.29l-3,3a1,1,0,0,0-.21.33,1,1,0,0,0,0,.76,1,1,0,0,0,.21.33l3,3a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42L7.41,14H17a3,3,0,0,0,3-3V7A1,1,0,0,0,19,6Z"})}))},m=function(e){var n=e.hasKeyword,u=e.onSubmit,d=e.onClear;return l(i,{position:"end",children:[n&&r(o,{title:"The enter or click to apply",arrow:!0,children:r(a,{size:"small",sx:{flex:"0 0 auto",color:t.blue[600],"&:hover":{color:t.blue[900]}},onClick:u,children:r(f,{fontSize:"small"})})}),n&&r(o,{title:"Clear",arrow:!0,children:r(a,{size:"small",sx:{flex:"0 0 auto",color:t.red[500],"&:hover":{color:t.red[700]}},onClick:d,children:r(c,{fontSize:"small"})})}),!n&&r(o,{title:"Enter the value to search for",arrow:!0,children:r(a,{size:"small",sx:{flex:"0 0 auto"},onClick:e.onSearch,children:r(s,{fontSize:"small"})})})]})};export{m as InputAdornmentRight,d as getFieldsByMatches};
 //# sourceMappingURL=filter-input.units.js.map

package/dist/src/filter-bar/components/filter-input.units.js.map

@@ -1 +1 @@
-{"version":3,"file":"filter-input.units.js","sources":["../../../../src/filter-bar/components/filter-input.units.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { colors, IconButton, InputAdornment, SvgIcon, Tooltip } from '@mui/material'\r\nimport CloseIcon from '@mui/icons-material/Close'\r\nimport SearchIcon from '@mui/icons-material/Search'\r\nimport { KeySpecial } from '../types'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IconButtonProps, SvgIconProps } from '@mui/material'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFieldInputConfig, IFilterInputConfig, TFieldMatch } from './filter-input.types'\r\n\r\nexport function getFieldsByMatches<T>(config: IFilterInputConfig<T>, keywords: string): IFieldInputConfig<T>[] {\r\n  const value = (keywords || '').toString().trim().toLowerCase()\r\n  const keys = Object.keys(config.fields || {}) as TFieldType<T>[]\r\n  const items: IFieldInputConfig<T>[] = []\r\n\r\n  keys.forEach((key) => {\r\n    const fieldConfig = config.fields[key]\r\n    if (!fieldConfig) return\r\n\r\n    const matchConfig = config.matches?.[key]\r\n    const rules = matchConfig?.rules ?? [{ rule: 'always' }]\r\n    const finalRules: TFieldMatch[] = Array.isArray(rules) ? rules : []\r\n\r\n    finalRules.forEach((r) => {\r\n      switch (r.rule) {\r\n        case 'always': {\r\n          items.push({ field: key, label: fieldConfig.label })\r\n          return\r\n        }\r\n        case 'existed': {\r\n          if (value) items.push({ field: key, label: fieldConfig.label })\r\n          return\r\n        }\r\n        case 'link': {\r\n          try {\r\n            new URL(value)\r\n            items.push({ field: key, label: fieldConfig.label })\r\n          } catch {\r\n            // If the value is not a valid URL, we won't show the linked field\r\n          }\r\n          return\r\n        }\r\n        case 'custom': {\r\n          if (r.validate?.(value)) items.push({ field: key, label: fieldConfig.label })\r\n          return\r\n        }\r\n        default:\r\n          return\r\n      }\r\n    })\r\n  })\r\n\r\n  return items.sort((a, b) => {\r\n    if (a.field === KeySpecial.quickSearch) return 1\r\n    if (b.field === KeySpecial.quickSearch) return -1\r\n    return 0\r\n  })\r\n}\r\n\r\nconst EnterIcon: FC<SvgIconProps> = (props) => (\r\n  <SvgIcon viewBox='2 0 24 24' version='1.0' {...props}>\r\n    <path\r\n      fill='currentColor'\r\n      d='M19,6a1,1,0,0,0-1,1v4a1,1,0,0,1-1,1H7.41l1.3-1.29A1,1,0,0,0,7.29,9.29l-3,3a1,1,0,0,0-.21.33,1,1,0,0,0,0,.76,1,1,0,0,0,.21.33l3,3a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42L7.41,14H17a3,3,0,0,0,3-3V7A1,1,0,0,0,19,6Z'\r\n    />\r\n  </SvgIcon>\r\n)\r\n\r\ninterface InputAdornmentRightProps {\r\n  hasKeyword?: boolean\r\n  onSubmit?: IconButtonProps['onClick']\r\n  onClear?: IconButtonProps['onClick']\r\n  onSearch?: IconButtonProps['onClick']\r\n}\r\n\r\nexport const InputAdornmentRight: FC<InputAdornmentRightProps> = (props) => {\r\n  const { hasKeyword, onSubmit, onClear } = props\r\n  return (\r\n    <InputAdornment position='end'>\r\n      {hasKeyword && (\r\n        <Tooltip title='The enter or click to apply' placement='top' arrow>\r\n          <IconButton size='small' sx={{ flex: '0 0 auto', color: colors.blue[600], '&:hover': { color: colors.blue[900] } }} onClick={onSubmit}>\r\n            <EnterIcon fontSize='small' />\r\n          </IconButton>\r\n        </Tooltip>\r\n      )}\r\n\r\n      {hasKeyword && (\r\n        <Tooltip title='Clear' placement='top' arrow>\r\n          <IconButton size='small' sx={{ flex: '0 0 auto', color: colors.red[500], '&:hover': { color: colors.red[700] } }} onClick={onClear}>\r\n            <CloseIcon fontSize='small' />\r\n          </IconButton>\r\n        </Tooltip>\r\n      )}\r\n\r\n      {!hasKeyword && (\r\n        <Tooltip title='Enter the value to search for' placement='top' arrow>\r\n          <IconButton size='small' sx={{ flex: '0 0 auto' }} onClick={props.onSearch}>\r\n            <SearchIcon fontSize='small' />\r\n          </IconButton>\r\n        </Tooltip>\r\n      )}\r\n    </InputAdornment>\r\n  )\r\n}\r\n"],"names":["getFieldsByMatches","config","keywords","value","toString","trim","toLowerCase","keys","Object","fields","items","forEach","key","_config$matches","_matchConfig$rules","fieldConfig","matchConfig","matches","rules","rule","Array","isArray","r","push","field","label","URL","_unused","_r$validate","validate","call","sort","a","b","KeySpecial","quickSearch","EnterIcon","props","_jsx","SvgIcon","_objectSpread","viewBox","version","children","fill","d","InputAdornmentRight","hasKeyword","onSubmit","onClear","_jsxs","InputAdornment","position","Tooltip","title","placement","arrow","IconButton","size","sx","flex","color","colors","blue","onClick","fontSize","red","CloseIcon","onSearch","SearchIcon"],"mappings":"kWAagB,SAAAA,EAAsBC,EAA+BC,GACnE,IAAMC,GAASD,GAAY,IAAIE,WAAWC,OAAOC,cAC3CC,EAAOC,OAAOD,KAAKN,EAAOQ,QAAU,CAAA,GACpCC,EAAgC,GAuCtC,OArCAH,EAAKI,QAAQ,SAACC,GAAO,IAAAC,EAAAC,EACbC,EAAcd,EAAOQ,OAAOG,GAClC,GAAKG,EAAL,CAEA,IAAMC,EAA4B,QAAjBH,EAAGZ,EAAOgB,eAAO,IAAAJ,OAAA,EAAdA,EAAiBD,GAC/BM,EAA0BJ,QAArBA,EAAGE,aAAW,EAAXA,EAAaE,aAAKJ,IAAAA,EAAAA,EAAI,CAAC,CAAEK,KAAM,YACXC,MAAMC,QAAQH,GAASA,EAAQ,IAEtDP,QAAQ,SAACW,GAClB,OAAQA,EAAEH,MACR,IAAK,SAEH,YADAT,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,QAG9C,IAAK,UAEH,YADItB,GAAOO,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,SAGzD,IAAK,OACH,IACE,IAAIC,IAAIvB,GACRO,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,OAC7C,CAAC,MAAAE,GACA,CAEF,OAEF,IAAK,SAAU,IAAAC,EAEb,YADcA,QAAdA,EAAIN,EAAEO,oBAAQD,GAAVA,EAAAE,KAAAR,EAAanB,IAAQO,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,SAGvE,QACE,OAEN,EAhCkB,CAiCpB,GAEOf,EAAMqB,KAAK,SAACC,EAAGC,GACpB,OAAID,EAAER,QAAUU,EAAWC,YAAoB,EAC3CF,EAAET,QAAUU,EAAWC,aAAsB,EAC1C,CACT,EACF,CAEA,IAAMC,EAA8B,SAACC,GAAK,OACxCC,EAACC,EAAOC,EAAAA,EAAA,CAACC,QAAQ,YAAYC,QAAQ,OAAUL,GAAK,GAAA,CAClDM,SAAAL,EAAA,OAAA,CACEM,KAAK,eACLC,EAAE,oNAEI,EAUCC,EAAoD,SAACT,GAChE,IAAQU,EAAkCV,EAAlCU,WAAYC,EAAsBX,EAAtBW,SAAUC,EAAYZ,EAAZY,QAC9B,OACEC,EAACC,EAAc,CAACC,SAAS,gBACtBL,GACCT,EAACe,GAAQC,MAAM,8BAA8BC,UAAU,MAAMC,OAC3D,EAAAb,SAAAL,EAACmB,EAAW,CAAAC,KAAK,QAAQC,GAAI,CAAEC,KAAM,WAAYC,MAAOC,EAAOC,KAAK,KAAM,UAAW,CAAEF,MAAOC,EAAOC,KAAK,OAAUC,QAAShB,EAAQL,SACnIL,EAACF,EAAS,CAAC6B,SAAS,cAKzBlB,GACCT,EAACe,GAAQC,MAAM,QAAQC,UAAU,MAAMC,OACrC,EAAAb,SAAAL,EAACmB,EAAU,CAACC,KAAK,QAAQC,GAAI,CAAEC,KAAM,WAAYC,MAAOC,EAAOI,IAAI,KAAM,UAAW,CAAEL,MAAOC,EAAOI,IAAI,OAAUF,QAASf,EAAON,SAChIL,EAAC6B,EAAS,CAACF,SAAS,eAKxBlB,GACAT,EAACe,EAAQ,CAAAC,MAAM,gCAAgCC,UAAU,MAAMC,OAAK,EAAAb,SAClEL,EAACmB,EAAU,CAACC,KAAK,QAAQC,GAAI,CAAEC,KAAM,YAAcI,QAAS3B,EAAM+B,SAChEzB,SAAAL,EAAC+B,EAAW,CAAAJ,SAAS,gBAMjC"}
+{"version":3,"file":"filter-input.units.js","sources":["../../../../src/filter-bar/components/filter-input.units.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { colors, IconButton, InputAdornment, SvgIcon, Tooltip } from '@mui/material'\r\nimport CloseIcon from '@mui/icons-material/Close'\r\nimport SearchIcon from '@mui/icons-material/Search'\r\nimport { KeySpecial } from '../types'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IconButtonProps, SvgIconProps } from '@mui/material'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFieldInputConfig, IFilterInputConfig, TFieldMatch } from './filter-input.types'\r\n\r\nexport function getFieldsByMatches<T>(config: IFilterInputConfig<T>, keywords: string): IFieldInputConfig<T>[] {\r\n  const value = (keywords || '').toString().trim().toLowerCase()\r\n  const keys = Object.keys(config.fields || {}) as TFieldType<T>[]\r\n  const items: IFieldInputConfig<T>[] = []\r\n\r\n  keys.forEach((key) => {\r\n    const fieldConfig = config.fields[key]\r\n    if (!fieldConfig) return\r\n\r\n    const matchConfig = config.matches?.[key]\r\n    const rules = matchConfig?.rules ?? [{ rule: 'always' }]\r\n    const finalRules: TFieldMatch[] = Array.isArray(rules) ? rules : []\r\n\r\n    finalRules.forEach((r) => {\r\n      switch (r.rule) {\r\n        case 'always': {\r\n          items.push({ field: key, label: fieldConfig.label })\r\n          return\r\n        }\r\n        case 'existed': {\r\n          if (value) items.push({ field: key, label: fieldConfig.label })\r\n          return\r\n        }\r\n        case 'link': {\r\n          try {\r\n            new URL(value)\r\n            items.push({ field: key, label: fieldConfig.label })\r\n          } catch {\r\n            // If the value is not a valid URL, we won't show the linked field\r\n          }\r\n          return\r\n        }\r\n        case 'custom': {\r\n          if (r.validate?.(value)) items.push({ field: key, label: fieldConfig.label })\r\n          return\r\n        }\r\n        default:\r\n          return\r\n      }\r\n    })\r\n  })\r\n\r\n  return items.sort((a, b) => {\r\n    if (a.field === KeySpecial.quickSearch) return 1\r\n    if (b.field === KeySpecial.quickSearch) return -1\r\n    return 0\r\n  })\r\n}\r\n\r\nconst EnterIcon: FC<SvgIconProps> = (props) => (\r\n  <SvgIcon viewBox='2 0 24 24' version='1.0' {...props}>\r\n    <path\r\n      fill='currentColor'\r\n      d='M19,6a1,1,0,0,0-1,1v4a1,1,0,0,1-1,1H7.41l1.3-1.29A1,1,0,0,0,7.29,9.29l-3,3a1,1,0,0,0-.21.33,1,1,0,0,0,0,.76,1,1,0,0,0,.21.33l3,3a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42L7.41,14H17a3,3,0,0,0,3-3V7A1,1,0,0,0,19,6Z'\r\n    />\r\n  </SvgIcon>\r\n)\r\n\r\ninterface InputAdornmentRightProps {\r\n  hasKeyword?: boolean\r\n  onSubmit?: IconButtonProps['onClick']\r\n  onClear?: IconButtonProps['onClick']\r\n  onSearch?: IconButtonProps['onClick']\r\n}\r\n\r\nexport const InputAdornmentRight: FC<InputAdornmentRightProps> = (props) => {\r\n  const { hasKeyword, onSubmit, onClear } = props\r\n  return (\r\n    <InputAdornment position='end'>\r\n      {hasKeyword && (\r\n        <Tooltip title='The enter or click to apply' arrow>\r\n          <IconButton size='small' sx={{ flex: '0 0 auto', color: colors.blue[600], '&:hover': { color: colors.blue[900] } }} onClick={onSubmit}>\r\n            <EnterIcon fontSize='small' />\r\n          </IconButton>\r\n        </Tooltip>\r\n      )}\r\n\r\n      {hasKeyword && (\r\n        <Tooltip title='Clear' arrow>\r\n          <IconButton size='small' sx={{ flex: '0 0 auto', color: colors.red[500], '&:hover': { color: colors.red[700] } }} onClick={onClear}>\r\n            <CloseIcon fontSize='small' />\r\n          </IconButton>\r\n        </Tooltip>\r\n      )}\r\n\r\n      {!hasKeyword && (\r\n        <Tooltip title='Enter the value to search for' arrow>\r\n          <IconButton size='small' sx={{ flex: '0 0 auto' }} onClick={props.onSearch}>\r\n            <SearchIcon fontSize='small' />\r\n          </IconButton>\r\n        </Tooltip>\r\n      )}\r\n    </InputAdornment>\r\n  )\r\n}\r\n"],"names":["getFieldsByMatches","config","keywords","value","toString","trim","toLowerCase","keys","Object","fields","items","forEach","key","_config$matches","_matchConfig$rules","fieldConfig","matchConfig","matches","rules","rule","Array","isArray","r","push","field","label","URL","_unused","_r$validate","validate","call","sort","a","b","KeySpecial","quickSearch","EnterIcon","props","_jsx","SvgIcon","_objectSpread","viewBox","version","children","fill","d","InputAdornmentRight","hasKeyword","onSubmit","onClear","_jsxs","InputAdornment","position","Tooltip","title","arrow","IconButton","size","sx","flex","color","colors","blue","onClick","fontSize","red","CloseIcon","onSearch","SearchIcon"],"mappings":"kWAagB,SAAAA,EAAsBC,EAA+BC,GACnE,IAAMC,GAASD,GAAY,IAAIE,WAAWC,OAAOC,cAC3CC,EAAOC,OAAOD,KAAKN,EAAOQ,QAAU,CAAA,GACpCC,EAAgC,GAuCtC,OArCAH,EAAKI,QAAQ,SAACC,GAAO,IAAAC,EAAAC,EACbC,EAAcd,EAAOQ,OAAOG,GAClC,GAAKG,EAAL,CAEA,IAAMC,EAA4B,QAAjBH,EAAGZ,EAAOgB,eAAO,IAAAJ,OAAA,EAAdA,EAAiBD,GAC/BM,EAA0BJ,QAArBA,EAAGE,aAAW,EAAXA,EAAaE,aAAKJ,IAAAA,EAAAA,EAAI,CAAC,CAAEK,KAAM,YACXC,MAAMC,QAAQH,GAASA,EAAQ,IAEtDP,QAAQ,SAACW,GAClB,OAAQA,EAAEH,MACR,IAAK,SAEH,YADAT,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,QAG9C,IAAK,UAEH,YADItB,GAAOO,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,SAGzD,IAAK,OACH,IACE,IAAIC,IAAIvB,GACRO,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,OAC7C,CAAC,MAAAE,GACA,CAEF,OAEF,IAAK,SAAU,IAAAC,EAEb,YADcA,QAAdA,EAAIN,EAAEO,oBAAQD,GAAVA,EAAAE,KAAAR,EAAanB,IAAQO,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,SAGvE,QACE,OAEN,EAhCkB,CAiCpB,GAEOf,EAAMqB,KAAK,SAACC,EAAGC,GACpB,OAAID,EAAER,QAAUU,EAAWC,YAAoB,EAC3CF,EAAET,QAAUU,EAAWC,aAAsB,EAC1C,CACT,EACF,CAEA,IAAMC,EAA8B,SAACC,GAAK,OACxCC,EAACC,EAAOC,EAAAA,EAAA,CAACC,QAAQ,YAAYC,QAAQ,OAAUL,GAAK,GAAA,CAClDM,SAAAL,EAAA,OAAA,CACEM,KAAK,eACLC,EAAE,oNAEI,EAUCC,EAAoD,SAACT,GAChE,IAAQU,EAAkCV,EAAlCU,WAAYC,EAAsBX,EAAtBW,SAAUC,EAAYZ,EAAZY,QAC9B,OACEC,EAACC,GAAeC,SAAS,MACtBT,SAAA,CAAAI,GACCT,EAACe,EAAQ,CAAAC,MAAM,8BAA8BC,OAC3C,EAAAZ,SAAAL,EAACkB,EAAU,CAACC,KAAK,QAAQC,GAAI,CAAEC,KAAM,WAAYC,MAAOC,EAAOC,KAAK,KAAM,UAAW,CAAEF,MAAOC,EAAOC,KAAK,OAAUC,QAASf,EAAQL,SACnIL,EAACF,EAAS,CAAC4B,SAAS,cAKzBjB,GACCT,EAACe,EAAQ,CAAAC,MAAM,QAAQC,OACrB,EAAAZ,SAAAL,EAACkB,EAAW,CAAAC,KAAK,QAAQC,GAAI,CAAEC,KAAM,WAAYC,MAAOC,EAAOI,IAAI,KAAM,UAAW,CAAEL,MAAOC,EAAOI,IAAI,OAAUF,QAASd,EAAON,SAChIL,EAAC4B,EAAS,CAACF,SAAS,eAKxBjB,GACAT,EAACe,GAAQC,MAAM,gCAAgCC,kBAC7CjB,EAACkB,GAAWC,KAAK,QAAQC,GAAI,CAAEC,KAAM,YAAcI,QAAS1B,EAAM8B,kBAChE7B,EAAC8B,GAAWJ,SAAS,gBAMjC"}

package/dist/src/filter-bar/components/filter-menu.js

@@ -1,2 +1,2 @@
-import{defineProperty as e,objectWithoutProperties as n,objectSpread2 as r,slicedToArray as t,asyncToGenerator as i,regenerator as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as a}from"react/jsx-runtime";import{useState as u,useContext as c,useMemo as s,createRef as d}from"react";import{styled as m,Box as f,MenuList as p,Tooltip as v,IconButton as b,Badge as h,MenuItem as g,Typography as y,Button as j}from"@mui/material";import F from"@mui/icons-material/FilterList";import k from"@mui/material/ClickAwayListener";import{KeySpecial as I}from"../types.js";import{useFilterActions as C}from"./hooks.js";import{mapSpecialLabel as x}from"../helpers.js";import{FilterBarContext as S}from"../index.context.js";import{SingleRuleValidate as P,FormValidator as w}from"../../form/validator.js";import{PopperCustom as R,PopperContent as A,PopperFooter as B}from"./popper-custom.js";import{createFormFieldString as O,FilterMenuNoField as T}from"./filter-menu.units.js";var M=["fields","validation","enableQuickSearch"];function q(m){var f=D,p=function(e){var t=e.fields,i=e.validation,o=e.enableQuickSearch,l=void 0===o||o,a=n(e,M),u=I.quickSearch,c=r({},t);if(l){var s=c[u],d=null!=s&&s.label?s.label:x[u],m=Object.assign({},c[u],{field:u,label:d,singleValue:!0});c[u]=m}else delete c[u];var f=Object.keys(c),p=f.reduce(function(e,n){var t=c[n];return t?(e[n]=r(r({},t),{},{field:n}),e):e},{}),v=r({},i);return f.forEach(function(e){var n,r,t,i=v[e],o=null!==(n=null!==(r=null==i?void 0:i.label)&&void 0!==r?r:null===(t=c[e])||void 0===t?void 0:t.label)&&void 0!==n?n:e.toString();i?i.Rules.some(function(e){return e.rule===P.Required})||(i.label=o,i.Rules.push({rule:P.Required})):v[e]={Rules:[{rule:P.Required}],label:o}}),r(r({},a),{},{fields:p,validation:v,enableQuickSearch:l})}(m),q=function(n){return Object.keys(n.fields).reduce(function(r,t){var i,o=t,l=null===(i=n.validation)||void 0===i?void 0:i[o];return l&&(r[o]=new w(e({},o,l))),r},{})}(p),Q=function(e){var n=e.fields;return Object.keys(n).reduce(function(e,r){var t,i=r,o=n[i];return o&&(e[i]=null!==(t=o.form)&&void 0!==t?t:O(o)),e},{})}(p);return function(e){var n=d(),I=u(null),x=t(I,2),P=x[0],w=x[1],O=Boolean(P),M=c(S),D=C(M),V=u(null),z=t(V,2),E=z[0],_=z[1],G=s(function(){var n=m.popperProps,r=m.rootProps;return Object.assign({},{popperProps:n,rootProps:r},e.slots)},[m,e.slots]),H=function(){w(null),setTimeout(function(){_(null)},300)},W=function(){D.clearAllFilters(),H()},J=function(){var e=i(o().m(function e(n,r,t){return o().w(function(e){for(;;)switch(e.n){case 0:if(r){e.n=1;break}return e.a(2);case 1:null!=t&&t.singleValue?D.replaceFilter(n,r,{logic:r.logic}):D.upsertManyFilter(n,r,{logic:r.logic});case 2:return e.a(2)}},e)}));return function(n,r,t){return e.apply(this,arguments)}}(),K=s(function(){var e=Object.values(p.fields);return Array.from(e)},[p.fields]),U=D.getTotalCount(),X="".concat(U," Filter").concat(1!==U?"s":"");return l(k,{onClickAway:H,children:a(L,r(r({className:f.root},G.rootProps),{},{children:[l(v,{title:X,children:l(b,{size:"small",ref:n,onClick:function(){_(null),w(n.current)},children:l(h,{badgeContent:U,color:"primary",invisible:0===U,children:l(F,{fontSize:"small"})})})}),l(R,r(r({open:O,anchorEl:P,placement:"bottom",transition:!0,disablePortal:!0},G.popperProps),{},{children:function(){if(0===K.length)return l(T,{onClose:H});if(E){var e,n=Q[E];if(!n)return null;var r=null===(e=M.filterState.storeFilter)||void 0===e?void 0:e[E];return l(n,{value:r,isLoading:M.isLoading,onRemove:D.removeFilterByFieldValue,validator:q[E],onSubmit:J,onClose:H,onRemoveField:function(e){return D.removeFilter(e)},onBack:function(){return _(null)}})}return a(A,{title:"Filter by",onClose:H,children:[l(N,{className:f.menu,children:K.map(function(e){var n,r,t=e.field.toString();if(!t)return null;var i=D.getFieldInfo(e.field),o=null!==(n=null==i?void 0:i.values.join(", "))&&void 0!==n?n:"",u=i?i.values.length:0,c=u>0?" (".concat(u,")"):"",s=null!==(r=e.label)&&void 0!==r?r:t.toString(),d=u>0?"Filter by ".concat(s,": ").concat(o):void 0;return l(g,{className:f.menuItem,sx:{justifyContent:"space-between"},onClick:function(){return n=e.field,void _(n);var n},children:l(v,{title:d,placement:"right",arrow:!0,children:a("div",{className:f.menuItemInner,children:[l(y,{variant:"body2",children:s}),l(y,{variant:"caption",sx:{ml:1,color:"text.secondary"},children:c})]})})},t)})}),l(B,{children:l(j,{color:"error",disabled:0===U,onClick:W,children:"Clear All"})})]})}()}))]}))})}}var D={root:"DinoFilterMenu-root",menu:"DinoFilterMenu-menu",menuItem:"DinoFilterMenu-menuItem",menuItemInner:"DinoFilterMenu-menuItemInner"},L=m(f)(e({},"&.".concat(D.root),{display:"inline-flex",justifyContent:"center",alignItems:"center",flex:"0 0 auto"})),N=m(p)(e(e({},".".concat(D.menuItem),{paddingTop:0,paddingBottom:0}),".".concat(D.menuItemInner),{display:"flex",justifyContent:"space-between",alignItems:"center",width:"100%",gap:"4px",paddingTop:"6px",paddingBottom:"6px"}));export{q as createFilterMenu,D as filterMenuClasses};
+import{defineProperty as e,objectWithoutProperties as r,objectSpread2 as n,slicedToArray as t,asyncToGenerator as i,regenerator as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as a}from"react/jsx-runtime";import{useState as u,useContext as c,useMemo as s,createRef as d}from"react";import{styled as m,Box as f,MenuList as p,Tooltip as v,IconButton as b,Badge as h,MenuItem as g,Typography as y,Button as j}from"@mui/material";import F from"@mui/icons-material/FilterList";import k from"@mui/material/ClickAwayListener";import{KeySpecial as I}from"../types.js";import{useFilterActions as C}from"./hooks.js";import{mapSpecialLabel as x}from"../helpers.js";import{FilterBarContext as S}from"../index.context.js";import{SingleRuleValidate as w,FormValidator as P}from"../../form/validator.js";import{PopperCustom as R,PopperContent as A,PopperFooter as B}from"./popper-custom.js";import{createFormFieldString as O,FilterMenuNoField as T}from"./filter-menu.units.js";var M=["fields","validation","enableQuickSearch"];function q(m){var f=D,p=function(e){var t=e.fields,i=e.validation,o=e.enableQuickSearch,l=void 0===o||o,a=r(e,M),u=I.quickSearch,c=n({},t);if(l){var s=c[u],d=null!=s&&s.label?s.label:x[u],m=Object.assign({},c[u],{field:u,label:d,singleValue:!0});c[u]=m}else delete c[u];var f=Object.keys(c),p=f.reduce(function(e,r){var t=c[r];return t?(e[r]=n(n({},t),{},{field:r}),e):e},{}),v=n({},i);return f.forEach(function(e){var r,n,t,i=v[e],o=null!==(r=null!==(n=null==i?void 0:i.label)&&void 0!==n?n:null===(t=c[e])||void 0===t?void 0:t.label)&&void 0!==r?r:e.toString();i?i.Rules.some(function(e){return e.rule===w.Required})||(i.label=o,i.Rules.push({rule:w.Required})):v[e]={Rules:[{rule:w.Required}],label:o}}),n(n({},a),{},{fields:p,validation:v,enableQuickSearch:l})}(m),q=function(r){return Object.keys(r.fields).reduce(function(n,t){var i,o=t,l=null===(i=r.validation)||void 0===i?void 0:i[o];return l&&(n[o]=new P(e({},o,l))),n},{})}(p),Q=function(e){var r=e.fields;return Object.keys(r).reduce(function(e,n){var t,i=n,o=r[i];return o&&(e[i]=null!==(t=o.form)&&void 0!==t?t:O(o)),e},{})}(p);return function(e){var r=d(),I=u(null),x=t(I,2),w=x[0],P=x[1],O=Boolean(w),M=c(S),D=C(M),V=u(null),z=t(V,2),E=z[0],_=z[1],G=s(function(){var r=m.popperProps,n=m.rootProps;return Object.assign({},{popperProps:r,rootProps:n},e.slots)},[m,e.slots]),H=function(){P(null),setTimeout(function(){_(null)},300)},W=function(){D.clearAllFilters(),H()},J=function(){var e=i(o().m(function e(r,n,t){return o().w(function(e){for(;;)switch(e.n){case 0:if(n){e.n=1;break}return e.a(2);case 1:null!=t&&t.singleValue?D.replaceFilter(r,n,{logic:n.logic}):D.upsertManyFilter(r,n,{logic:n.logic});case 2:return e.a(2)}},e)}));return function(r,n,t){return e.apply(this,arguments)}}(),K=s(function(){var e=Object.values(p.fields);return Array.from(e)},[p.fields]),U=D.getTotalCount(),X="".concat(U," Filter").concat(1!==U?"s":"");return l(k,{onClickAway:H,children:a(L,n(n({className:f.root},G.rootProps),{},{children:[l(v,{title:X,arrow:!0,children:l(b,{size:"small",ref:r,onClick:function(){_(null),P(r.current)},children:l(h,{badgeContent:U,color:"primary",invisible:0===U,children:l(F,{fontSize:"small"})})})}),l(R,n(n({open:O,anchorEl:w,placement:"bottom",transition:!0,disablePortal:!0},G.popperProps),{},{children:function(){if(0===K.length)return l(T,{onClose:H});if(E){var e,r=Q[E];if(!r)return null;var n=null===(e=M.filterState.storeFilter)||void 0===e?void 0:e[E];return l(r,{value:n,isLoading:M.isLoading,onRemove:D.removeFilterByFieldValue,validator:q[E],onSubmit:J,onClose:H,onRemoveField:function(e){return D.removeFilter(e)},onBack:function(){return _(null)}})}return a(A,{title:"Filter by",onClose:H,children:[l(N,{className:f.menu,children:K.map(function(e){var r,n,t=e.field.toString();if(!t)return null;var i=D.getFieldInfo(e.field),o=null!==(r=null==i?void 0:i.values.join(", "))&&void 0!==r?r:"",u=i?i.values.length:0,c=u>0?" (".concat(u,")"):"",s=null!==(n=e.label)&&void 0!==n?n:t.toString(),d=u>0?"Filter by ".concat(s,": ").concat(o):void 0;return l(g,{className:f.menuItem,sx:{justifyContent:"space-between"},onClick:function(){return r=e.field,void _(r);var r},children:l(v,{title:d,placement:"right",arrow:!0,children:a("div",{className:f.menuItemInner,children:[l(y,{variant:"body2",children:s}),l(y,{variant:"caption",sx:{ml:1,color:"text.secondary"},children:c})]})})},t)})}),l(B,{children:l(j,{color:"error",disabled:0===U,onClick:W,children:"Clear All"})})]})}()}))]}))})}}var D={root:"DinoFilterMenu-root",menu:"DinoFilterMenu-menu",menuItem:"DinoFilterMenu-menuItem",menuItemInner:"DinoFilterMenu-menuItemInner"},L=m(f)(e({},"&.".concat(D.root),{display:"inline-flex",justifyContent:"center",alignItems:"center",flex:"0 0 auto"})),N=m(p)(e(e({},".".concat(D.menuItem),{paddingTop:0,paddingBottom:0}),".".concat(D.menuItemInner),{display:"flex",justifyContent:"space-between",alignItems:"center",width:"100%",gap:"4px",paddingTop:"6px",paddingBottom:"6px"}));export{q as createFilterMenu,D as filterMenuClasses};
 //# sourceMappingURL=filter-menu.js.map

package/dist/src/filter-bar/components/filter-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"filter-menu.js","sources":["../../../../src/filter-bar/components/filter-menu.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, Fragment, useContext, useMemo, useState } from 'react'\r\nimport { Badge, Box, Button, IconButton, MenuItem, MenuList, Stack, styled, Tooltip, Typography } from '@mui/material'\r\nimport FilterListIcon from '@mui/icons-material/FilterList'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from './hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { FormValidator, SingleRuleValidate } from '../../form/validator'\r\nimport { PopperContent, PopperCustom, PopperFooter } from './popper-custom'\r\nimport { createFormFieldString, FilterMenuNoField } from './filter-menu.units'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { TFieldModelValid, TFieldType, TFieldValue } from '../types'\r\nimport type { IConfigValue, IFormValidatorConfig } from '../../form/validator'\r\nimport type { IFilterMenuProps, IFilterMenuSlots, TFieldMenuConfigs } from './filter-menu.types'\r\nimport type { IFieldMenuConfig, IFilterMenuConfig, IFilterMenuFormProps } from './filter-menu.types'\r\n\r\nfunction generateValidatorMap<T>(config: IFilterMenuConfig<T>) {\r\n  const keys = Object.keys(config.fields) as TFieldType<T>[]\r\n  const validateMaps = keys.reduce(\r\n    (acc, key) => {\r\n      const fieldKey = key as TFieldType<T>\r\n      const fieldConfig = config.validation?.[fieldKey]\r\n      if (fieldConfig) {\r\n        acc[fieldKey] = new FormValidator({ [fieldKey]: fieldConfig } as IFormValidatorConfig<Partial<TFieldModelValid<T>>>)\r\n      }\r\n      return acc\r\n    },\r\n    {} as Record<TFieldType<T>, FormValidator<Partial<TFieldModelValid<T>>>>\r\n  )\r\n  return validateMaps\r\n}\r\n\r\nfunction generateFormInputMap<T>(config: IFilterMenuConfig<T>) {\r\n  const { fields } = config\r\n  const keys = Object.keys(fields) as TFieldType<T>[]\r\n  const formInputMaps = keys.reduce(\r\n    (acc, key) => {\r\n      const fieldKey = key as TFieldType<T>\r\n      const fieldConfig = fields[fieldKey] as IFieldMenuConfig<T>\r\n      if (fieldConfig) acc[fieldKey] = fieldConfig.form ?? createFormFieldString(fieldConfig)\r\n      return acc\r\n    },\r\n    {} as Record<TFieldType<T>, React.ComponentType<IFilterMenuFormProps<T>>>\r\n  )\r\n  return formInputMaps\r\n}\r\n\r\nfunction generateConfigs<T>(config: IFilterMenuConfig<T>): IFilterMenuConfig<T> {\r\n  const { fields, validation, enableQuickSearch = true, ...rest } = config\r\n  const qsKey = KeySpecial.quickSearch\r\n\r\n  // Merge quick search field if enabled\r\n  const mergedFields: TFieldMenuConfigs<T> = { ...fields }\r\n  if (enableQuickSearch) {\r\n    const item = mergedFields[qsKey]\r\n    const label = item?.label ? item.label : mapSpecialLabel[qsKey]\r\n    const temp = Object.assign({}, mergedFields[qsKey], { field: qsKey, label, singleValue: true })\r\n    mergedFields[qsKey] = temp\r\n  } else {\r\n    delete mergedFields[qsKey]\r\n  }\r\n\r\n  const keys = Object.keys(mergedFields) as TFieldType<T>[]\r\n  const finalFields = keys.reduce<TFieldMenuConfigs<T>>((acc, key) => {\r\n    const fieldConfig = mergedFields[key]\r\n    if (!fieldConfig) return acc\r\n    acc[key] = { ...fieldConfig, field: key }\r\n    return acc\r\n  }, {} as TFieldMenuConfigs<T>)\r\n\r\n  // Merge validation config with default required rule\r\n  const mergedValidation: IFormValidatorConfig<Partial<TFieldModelValid<T>>> = { ...validation }\r\n  keys.forEach((key) => {\r\n    const item: IConfigValue<Partial<TFieldModelValid<T>>> | undefined = mergedValidation[key]\r\n    const label = item?.label ?? mergedFields[key]?.label ?? key.toString()\r\n    if (!item) {\r\n      mergedValidation[key] = { Rules: [{ rule: SingleRuleValidate.Required }], label }\r\n    } else if (!item.Rules.some((r) => r.rule === SingleRuleValidate.Required)) {\r\n      item.label = label\r\n      item.Rules.push({ rule: SingleRuleValidate.Required })\r\n    }\r\n  })\r\n\r\n  return { ...rest, fields: finalFields, validation: mergedValidation, enableQuickSearch }\r\n}\r\n\r\nexport function createFilterMenu<T>(config: IFilterMenuConfig<T>) {\r\n  const classes = filterMenuClasses\r\n  const mergedConfigs = generateConfigs(config)\r\n  const validateMaps = generateValidatorMap(mergedConfigs)\r\n  const formInputMaps = generateFormInputMap(mergedConfigs)\r\n\r\n  // Component\r\n  const FilterMenu: FC<IFilterMenuProps<T>> = (props) => {\r\n    const refButton = createRef<HTMLButtonElement>()\r\n\r\n    const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n    const isOpen = Boolean(anchorEl)\r\n\r\n    const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n    const filterActions = useFilterActions<T>(context)\r\n\r\n    const [fieldSelected, setFieldSelected] = useState<TFieldType<T> | null>(null)\r\n\r\n    const mergedSlots = useMemo<IFilterMenuSlots>(() => {\r\n      const { popperProps, rootProps } = config\r\n      return Object.assign({}, { popperProps, rootProps }, props.slots)\r\n    }, [config, props.slots])\r\n\r\n    const handleClose = () => {\r\n      setAnchorEl(null)\r\n      setTimeout(() => {\r\n        setFieldSelected(null)\r\n      }, 300)\r\n    }\r\n\r\n    const handleOpen = () => {\r\n      setFieldSelected(null)\r\n      setAnchorEl(refButton.current)\r\n    }\r\n\r\n    const handleMenuItemClick = (field: TFieldType<T>) => {\r\n      setFieldSelected(field)\r\n    }\r\n\r\n    const handleClearAll = () => {\r\n      filterActions.clearAllFilters()\r\n      handleClose()\r\n    }\r\n\r\n    const handleSubmit = async (key: TFieldType<T>, value?: TFieldValue, config?: IFieldMenuConfig<T>) => {\r\n      if (!value) return\r\n      if (config?.singleValue) {\r\n        filterActions.replaceFilter(key, value, { logic: value.logic })\r\n      } else {\r\n        filterActions.upsertManyFilter(key, value, { logic: value.logic })\r\n      }\r\n    }\r\n\r\n    const data = useMemo(() => {\r\n      const keys = Object.values(mergedConfigs.fields)\r\n      return Array.from(keys) as IFieldMenuConfig<T>[]\r\n    }, [mergedConfigs.fields])\r\n\r\n    const renderContent = () => {\r\n      if (data.length === 0) {\r\n        return <FilterMenuNoField onClose={handleClose} />\r\n      }\r\n\r\n      if (fieldSelected) {\r\n        const FormComponent = formInputMaps[fieldSelected] as React.ComponentType<IFilterMenuFormProps<T>>\r\n        if (!FormComponent) return null\r\n        const value = context.filterState.storeFilter?.[fieldSelected]\r\n        return (\r\n          <FormComponent\r\n            value={value}\r\n            isLoading={context.isLoading}\r\n            onRemove={filterActions.removeFilterByFieldValue}\r\n            validator={validateMaps[fieldSelected]}\r\n            onSubmit={handleSubmit}\r\n            onClose={handleClose}\r\n            onRemoveField={(f) => filterActions.removeFilter(f)}\r\n            onBack={() => setFieldSelected(null)}\r\n          />\r\n        )\r\n      }\r\n\r\n      return (\r\n        <PopperContent title='Filter by' onClose={handleClose}>\r\n          <MenuListCustom className={classes.menu}>\r\n            {data.map((item) => {\r\n              const key = item.field.toString()\r\n              if (!key) return null\r\n              const info = filterActions.getFieldInfo(item.field)\r\n              const note = info?.values.join(', ') ?? ''\r\n              const fieldCount = info ? info.values.length : 0\r\n              const suffix = fieldCount > 0 ? ` (${fieldCount})` : ''\r\n              const label = item.label ?? key.toString()\r\n              const tooltipTitle = fieldCount > 0 ? `Filter by ${label}: ${note}` : undefined\r\n              return (\r\n                <MenuItem\r\n                  key={key}\r\n                  className={classes.menuItem}\r\n                  sx={{ justifyContent: 'space-between' }}\r\n                  onClick={() => handleMenuItemClick(item.field)}\r\n                >\r\n                  <Tooltip title={tooltipTitle} placement='right' arrow>\r\n                    <div className={classes.menuItemInner}>\r\n                      <Typography variant='body2'>{label}</Typography>\r\n                      <Typography variant='caption' sx={{ ml: 1, color: 'text.secondary' }}>\r\n                        {suffix}\r\n                      </Typography>\r\n                    </div>\r\n                  </Tooltip>\r\n                </MenuItem>\r\n              )\r\n            })}\r\n          </MenuListCustom>\r\n          <PopperFooter>\r\n            <Button color='error' disabled={filterCount === 0} onClick={handleClearAll}>\r\n              Clear All\r\n            </Button>\r\n          </PopperFooter>\r\n        </PopperContent>\r\n      )\r\n    }\r\n\r\n    const filterCount = filterActions.getTotalCount()\r\n    const iconTitle = `${filterCount} Filter${filterCount !== 1 ? 's' : ''}`\r\n    return (\r\n      <ClickAwayListener onClickAway={handleClose}>\r\n        <FilterInputStyled className={classes.root} {...mergedSlots.rootProps}>\r\n          <Tooltip title={iconTitle}>\r\n            <IconButton size='small' ref={refButton} onClick={handleOpen}>\r\n              <Badge badgeContent={filterCount} color='primary' invisible={filterCount === 0}>\r\n                <FilterListIcon fontSize='small' />\r\n              </Badge>\r\n            </IconButton>\r\n          </Tooltip>\r\n          <PopperCustom open={isOpen} anchorEl={anchorEl} placement='bottom' transition disablePortal {...mergedSlots.popperProps}>\r\n            {renderContent()}\r\n          </PopperCustom>\r\n        </FilterInputStyled>\r\n      </ClickAwayListener>\r\n    )\r\n  }\r\n  return FilterMenu\r\n}\r\n\r\n// styles\r\nexport const filterMenuClasses = {\r\n  root: 'DinoFilterMenu-root',\r\n  input: 'DinoFilterMenu-input',\r\n  beforeInput: 'DinoFilterMenu-beforeInput',\r\n  menu: 'DinoFilterMenu-menu',\r\n  menuItem: 'DinoFilterMenu-menuItem',\r\n  menuItemInner: 'DinoFilterMenu-menuItemInner'\r\n}\r\n\r\nconst FilterInputStyled = styled(Box)({\r\n  [`&.${filterMenuClasses.root}`]: {\r\n    display: 'inline-flex',\r\n    justifyContent: 'center',\r\n    alignItems: 'center',\r\n    flex: '0 0 auto'\r\n  }\r\n})\r\n\r\nconst MenuListCustom = styled(MenuList)({\r\n  [`.${filterMenuClasses.menuItem}`]: {\r\n    paddingTop: 0,\r\n    paddingBottom: 0\r\n  },\r\n  [`.${filterMenuClasses.menuItemInner}`]: {\r\n    display: 'flex',\r\n    justifyContent: 'space-between',\r\n    alignItems: 'center',\r\n    width: '100%',\r\n    gap: '4px',\r\n    paddingTop: '6px',\r\n    paddingBottom: '6px'\r\n  }\r\n})\r\n"],"names":["createFilterMenu","config","classes","filterMenuClasses","mergedConfigs","fields","validation","_config$enableQuickSe","enableQuickSearch","rest","_objectWithoutProperties","_excluded","qsKey","KeySpecial","quickSearch","mergedFields","_objectSpread","item","label","mapSpecialLabel","temp","Object","assign","field","singleValue","keys","finalFields","reduce","acc","key","fieldConfig","mergedValidation","forEach","_ref","_item$label","_mergedFields$key","toString","Rules","some","r","rule","SingleRuleValidate","Required","push","generateConfigs","validateMaps","_config$validation","fieldKey","FormValidator","_defineProperty","generateValidatorMap","formInputMaps","_fieldConfig$form","form","createFormFieldString","generateFormInputMap","props","refButton","createRef","_useState","useState","_useState2","_slicedToArray","anchorEl","setAnchorEl","isOpen","Boolean","context","useContext","FilterBarContext","filterActions","useFilterActions","_useState3","_useState4","fieldSelected","setFieldSelected","mergedSlots","useMemo","popperProps","rootProps","slots","handleClose","setTimeout","handleClearAll","clearAllFilters","handleSubmit","_ref2","_asyncToGenerator","_regenerator","m","_callee","value","w","_context","n","a","replaceFilter","logic","upsertManyFilter","_x","_x2","_x3","apply","this","arguments","data","values","Array","from","filterCount","getTotalCount","iconTitle","concat","_jsx","ClickAwayListener","onClickAway","children","_jsxs","FilterInputStyled","className","root","Tooltip","title","IconButton","size","ref","onClick","current","Badge","badgeContent","color","invisible","FilterListIcon","fontSize","PopperCustom","open","placement","transition","disablePortal","length","FilterMenuNoField","onClose","_context$filterState$","FormComponent","filterState","storeFilter","isLoading","onRemove","removeFilterByFieldValue","validator","onSubmit","onRemoveField","f","removeFilter","onBack","PopperContent","MenuListCustom","menu","map","_info$values$join","_item$label2","info","getFieldInfo","note","join","fieldCount","suffix","tooltipTitle","undefined","MenuItem","menuItem","sx","justifyContent","arrow","menuItemInner","Typography","variant","ml","PopperFooter","Button","disabled","renderContent","styled","Box","display","alignItems","flex","MenuList","paddingTop","paddingBottom","width","gap"],"mappings":"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"}
+{"version":3,"file":"filter-menu.js","sources":["../../../../src/filter-bar/components/filter-menu.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, Fragment, useContext, useMemo, useState } from 'react'\r\nimport { Badge, Box, Button, IconButton, MenuItem, MenuList, Stack, styled, Tooltip, Typography } from '@mui/material'\r\nimport FilterListIcon from '@mui/icons-material/FilterList'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from './hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { FormValidator, SingleRuleValidate } from '../../form/validator'\r\nimport { PopperContent, PopperCustom, PopperFooter } from './popper-custom'\r\nimport { createFormFieldString, FilterMenuNoField } from './filter-menu.units'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { TFieldModelValid, TFieldType, TFieldValue } from '../types'\r\nimport type { IConfigValue, IFormValidatorConfig } from '../../form/validator'\r\nimport type { IFilterMenuProps, IFilterMenuSlots, TFieldMenuConfigs } from './filter-menu.types'\r\nimport type { IFieldMenuConfig, IFilterMenuConfig, IFilterMenuFormProps } from './filter-menu.types'\r\n\r\nfunction generateValidatorMap<T>(config: IFilterMenuConfig<T>) {\r\n  const keys = Object.keys(config.fields) as TFieldType<T>[]\r\n  const validateMaps = keys.reduce(\r\n    (acc, key) => {\r\n      const fieldKey = key as TFieldType<T>\r\n      const fieldConfig = config.validation?.[fieldKey]\r\n      if (fieldConfig) {\r\n        acc[fieldKey] = new FormValidator({ [fieldKey]: fieldConfig } as IFormValidatorConfig<Partial<TFieldModelValid<T>>>)\r\n      }\r\n      return acc\r\n    },\r\n    {} as Record<TFieldType<T>, FormValidator<Partial<TFieldModelValid<T>>>>\r\n  )\r\n  return validateMaps\r\n}\r\n\r\nfunction generateFormInputMap<T>(config: IFilterMenuConfig<T>) {\r\n  const { fields } = config\r\n  const keys = Object.keys(fields) as TFieldType<T>[]\r\n  const formInputMaps = keys.reduce(\r\n    (acc, key) => {\r\n      const fieldKey = key as TFieldType<T>\r\n      const fieldConfig = fields[fieldKey] as IFieldMenuConfig<T>\r\n      if (fieldConfig) acc[fieldKey] = fieldConfig.form ?? createFormFieldString(fieldConfig)\r\n      return acc\r\n    },\r\n    {} as Record<TFieldType<T>, React.ComponentType<IFilterMenuFormProps<T>>>\r\n  )\r\n  return formInputMaps\r\n}\r\n\r\nfunction generateConfigs<T>(config: IFilterMenuConfig<T>): IFilterMenuConfig<T> {\r\n  const { fields, validation, enableQuickSearch = true, ...rest } = config\r\n  const qsKey = KeySpecial.quickSearch\r\n\r\n  // Merge quick search field if enabled\r\n  const mergedFields: TFieldMenuConfigs<T> = { ...fields }\r\n  if (enableQuickSearch) {\r\n    const item = mergedFields[qsKey]\r\n    const label = item?.label ? item.label : mapSpecialLabel[qsKey]\r\n    const temp = Object.assign({}, mergedFields[qsKey], { field: qsKey, label, singleValue: true })\r\n    mergedFields[qsKey] = temp\r\n  } else {\r\n    delete mergedFields[qsKey]\r\n  }\r\n\r\n  const keys = Object.keys(mergedFields) as TFieldType<T>[]\r\n  const finalFields = keys.reduce<TFieldMenuConfigs<T>>((acc, key) => {\r\n    const fieldConfig = mergedFields[key]\r\n    if (!fieldConfig) return acc\r\n    acc[key] = { ...fieldConfig, field: key }\r\n    return acc\r\n  }, {} as TFieldMenuConfigs<T>)\r\n\r\n  // Merge validation config with default required rule\r\n  const mergedValidation: IFormValidatorConfig<Partial<TFieldModelValid<T>>> = { ...validation }\r\n  keys.forEach((key) => {\r\n    const item: IConfigValue<Partial<TFieldModelValid<T>>> | undefined = mergedValidation[key]\r\n    const label = item?.label ?? mergedFields[key]?.label ?? key.toString()\r\n    if (!item) {\r\n      mergedValidation[key] = { Rules: [{ rule: SingleRuleValidate.Required }], label }\r\n    } else if (!item.Rules.some((r) => r.rule === SingleRuleValidate.Required)) {\r\n      item.label = label\r\n      item.Rules.push({ rule: SingleRuleValidate.Required })\r\n    }\r\n  })\r\n\r\n  return { ...rest, fields: finalFields, validation: mergedValidation, enableQuickSearch }\r\n}\r\n\r\nexport function createFilterMenu<T>(config: IFilterMenuConfig<T>) {\r\n  const classes = filterMenuClasses\r\n  const mergedConfigs = generateConfigs(config)\r\n  const validateMaps = generateValidatorMap(mergedConfigs)\r\n  const formInputMaps = generateFormInputMap(mergedConfigs)\r\n\r\n  // Component\r\n  const FilterMenu: FC<IFilterMenuProps<T>> = (props) => {\r\n    const refButton = createRef<HTMLButtonElement>()\r\n\r\n    const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n    const isOpen = Boolean(anchorEl)\r\n\r\n    const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n    const filterActions = useFilterActions<T>(context)\r\n\r\n    const [fieldSelected, setFieldSelected] = useState<TFieldType<T> | null>(null)\r\n\r\n    const mergedSlots = useMemo<IFilterMenuSlots>(() => {\r\n      const { popperProps, rootProps } = config\r\n      return Object.assign({}, { popperProps, rootProps }, props.slots)\r\n    }, [config, props.slots])\r\n\r\n    const handleClose = () => {\r\n      setAnchorEl(null)\r\n      setTimeout(() => {\r\n        setFieldSelected(null)\r\n      }, 300)\r\n    }\r\n\r\n    const handleOpen = () => {\r\n      setFieldSelected(null)\r\n      setAnchorEl(refButton.current)\r\n    }\r\n\r\n    const handleMenuItemClick = (field: TFieldType<T>) => {\r\n      setFieldSelected(field)\r\n    }\r\n\r\n    const handleClearAll = () => {\r\n      filterActions.clearAllFilters()\r\n      handleClose()\r\n    }\r\n\r\n    const handleSubmit = async (key: TFieldType<T>, value?: TFieldValue, config?: IFieldMenuConfig<T>) => {\r\n      if (!value) return\r\n      if (config?.singleValue) {\r\n        filterActions.replaceFilter(key, value, { logic: value.logic })\r\n      } else {\r\n        filterActions.upsertManyFilter(key, value, { logic: value.logic })\r\n      }\r\n    }\r\n\r\n    const data = useMemo(() => {\r\n      const keys = Object.values(mergedConfigs.fields)\r\n      return Array.from(keys) as IFieldMenuConfig<T>[]\r\n    }, [mergedConfigs.fields])\r\n\r\n    const renderContent = () => {\r\n      if (data.length === 0) {\r\n        return <FilterMenuNoField onClose={handleClose} />\r\n      }\r\n\r\n      if (fieldSelected) {\r\n        const FormComponent = formInputMaps[fieldSelected] as React.ComponentType<IFilterMenuFormProps<T>>\r\n        if (!FormComponent) return null\r\n        const value = context.filterState.storeFilter?.[fieldSelected]\r\n        return (\r\n          <FormComponent\r\n            value={value}\r\n            isLoading={context.isLoading}\r\n            onRemove={filterActions.removeFilterByFieldValue}\r\n            validator={validateMaps[fieldSelected]}\r\n            onSubmit={handleSubmit}\r\n            onClose={handleClose}\r\n            onRemoveField={(f) => filterActions.removeFilter(f)}\r\n            onBack={() => setFieldSelected(null)}\r\n          />\r\n        )\r\n      }\r\n\r\n      return (\r\n        <PopperContent title='Filter by' onClose={handleClose}>\r\n          <MenuListCustom className={classes.menu}>\r\n            {data.map((item) => {\r\n              const key = item.field.toString()\r\n              if (!key) return null\r\n              const info = filterActions.getFieldInfo(item.field)\r\n              const note = info?.values.join(', ') ?? ''\r\n              const fieldCount = info ? info.values.length : 0\r\n              const suffix = fieldCount > 0 ? ` (${fieldCount})` : ''\r\n              const label = item.label ?? key.toString()\r\n              const tooltipTitle = fieldCount > 0 ? `Filter by ${label}: ${note}` : undefined\r\n              return (\r\n                <MenuItem\r\n                  key={key}\r\n                  className={classes.menuItem}\r\n                  sx={{ justifyContent: 'space-between' }}\r\n                  onClick={() => handleMenuItemClick(item.field)}\r\n                >\r\n                  <Tooltip title={tooltipTitle} placement='right' arrow>\r\n                    <div className={classes.menuItemInner}>\r\n                      <Typography variant='body2'>{label}</Typography>\r\n                      <Typography variant='caption' sx={{ ml: 1, color: 'text.secondary' }}>\r\n                        {suffix}\r\n                      </Typography>\r\n                    </div>\r\n                  </Tooltip>\r\n                </MenuItem>\r\n              )\r\n            })}\r\n          </MenuListCustom>\r\n          <PopperFooter>\r\n            <Button color='error' disabled={filterCount === 0} onClick={handleClearAll}>\r\n              Clear All\r\n            </Button>\r\n          </PopperFooter>\r\n        </PopperContent>\r\n      )\r\n    }\r\n\r\n    const filterCount = filterActions.getTotalCount()\r\n    const iconTitle = `${filterCount} Filter${filterCount !== 1 ? 's' : ''}`\r\n    return (\r\n      <ClickAwayListener onClickAway={handleClose}>\r\n        <FilterInputStyled className={classes.root} {...mergedSlots.rootProps}>\r\n          <Tooltip title={iconTitle} arrow>\r\n            <IconButton size='small' ref={refButton} onClick={handleOpen}>\r\n              <Badge badgeContent={filterCount} color='primary' invisible={filterCount === 0}>\r\n                <FilterListIcon fontSize='small' />\r\n              </Badge>\r\n            </IconButton>\r\n          </Tooltip>\r\n          <PopperCustom open={isOpen} anchorEl={anchorEl} placement='bottom' transition disablePortal {...mergedSlots.popperProps}>\r\n            {renderContent()}\r\n          </PopperCustom>\r\n        </FilterInputStyled>\r\n      </ClickAwayListener>\r\n    )\r\n  }\r\n  return FilterMenu\r\n}\r\n\r\n// styles\r\nexport const filterMenuClasses = {\r\n  root: 'DinoFilterMenu-root',\r\n  input: 'DinoFilterMenu-input',\r\n  beforeInput: 'DinoFilterMenu-beforeInput',\r\n  menu: 'DinoFilterMenu-menu',\r\n  menuItem: 'DinoFilterMenu-menuItem',\r\n  menuItemInner: 'DinoFilterMenu-menuItemInner'\r\n}\r\n\r\nconst FilterInputStyled = styled(Box)({\r\n  [`&.${filterMenuClasses.root}`]: {\r\n    display: 'inline-flex',\r\n    justifyContent: 'center',\r\n    alignItems: 'center',\r\n    flex: '0 0 auto'\r\n  }\r\n})\r\n\r\nconst MenuListCustom = styled(MenuList)({\r\n  [`.${filterMenuClasses.menuItem}`]: {\r\n    paddingTop: 0,\r\n    paddingBottom: 0\r\n  },\r\n  [`.${filterMenuClasses.menuItemInner}`]: {\r\n    display: 'flex',\r\n    justifyContent: 'space-between',\r\n    alignItems: 'center',\r\n    width: '100%',\r\n    gap: '4px',\r\n    paddingTop: '6px',\r\n    paddingBottom: '6px'\r\n  }\r\n})\r\n"],"names":["createFilterMenu","config","classes","filterMenuClasses","mergedConfigs","fields","validation","_config$enableQuickSe","enableQuickSearch","rest","_objectWithoutProperties","_excluded","qsKey","KeySpecial","quickSearch","mergedFields","_objectSpread","item","label","mapSpecialLabel","temp","Object","assign","field","singleValue","keys","finalFields","reduce","acc","key","fieldConfig","mergedValidation","forEach","_ref","_item$label","_mergedFields$key","toString","Rules","some","r","rule","SingleRuleValidate","Required","push","generateConfigs","validateMaps","_config$validation","fieldKey","FormValidator","_defineProperty","generateValidatorMap","formInputMaps","_fieldConfig$form","form","createFormFieldString","generateFormInputMap","props","refButton","createRef","_useState","useState","_useState2","_slicedToArray","anchorEl","setAnchorEl","isOpen","Boolean","context","useContext","FilterBarContext","filterActions","useFilterActions","_useState3","_useState4","fieldSelected","setFieldSelected","mergedSlots","useMemo","popperProps","rootProps","slots","handleClose","setTimeout","handleClearAll","clearAllFilters","handleSubmit","_ref2","_asyncToGenerator","_regenerator","m","_callee","value","w","_context","n","a","replaceFilter","logic","upsertManyFilter","_x","_x2","_x3","apply","this","arguments","data","values","Array","from","filterCount","getTotalCount","iconTitle","concat","_jsx","ClickAwayListener","onClickAway","children","_jsxs","FilterInputStyled","className","root","Tooltip","title","arrow","IconButton","size","ref","onClick","current","Badge","badgeContent","color","invisible","FilterListIcon","fontSize","PopperCustom","open","placement","transition","disablePortal","length","FilterMenuNoField","onClose","_context$filterState$","FormComponent","filterState","storeFilter","isLoading","onRemove","removeFilterByFieldValue","validator","onSubmit","onRemoveField","f","removeFilter","onBack","PopperContent","MenuListCustom","menu","map","_info$values$join","_item$label2","info","getFieldInfo","note","join","fieldCount","suffix","tooltipTitle","undefined","MenuItem","menuItem","sx","justifyContent","menuItemInner","Typography","variant","ml","PopperFooter","Button","disabled","renderContent","styled","Box","display","alignItems","flex","MenuList","paddingTop","paddingBottom","width","gap"],"mappings":"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"}

package/dist/src/filter-bar/components/filter-sort.js

@@ -1,2 +1,2 @@
-import{defineProperty as e,slicedToArray as n,objectSpread2 as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o,jsxs as i}from"react/jsx-runtime";import{useState as t,useContext as l,useMemo as a,createRef as c}from"react";import{styled as d,Box as m,Tooltip as u,IconButton as s,Badge as p,MenuList as f,MenuItem as v,Typography as h,Button as g}from"@mui/material";import S from"@mui/material/ClickAwayListener";import b from"@mui/icons-material/SwapVert";import I from"@mui/icons-material/ArrowUpward";import w from"@mui/icons-material/ArrowDownward";import{useFilterActions as y}from"./hooks.js";import{FilterBarContext as j}from"../index.context.js";import{PopperCustom as C,PopperContent as x,PopperFooter as k}from"./popper-custom.js";var D={asc:"Ascending",desc:"Descending"},P=function(e){return e?D[e]:""},A={asc:o(I,{fontSize:"small"}),desc:o(w,{fontSize:"small"})},B=function(e){return e?A[e]:null};function z(e){var d=F,m=function(e){var r=[];return Object.entries(e).forEach(function(e){var o=n(e,2),i=o[0],t=o[1];r.push({field:i,label:null==t?void 0:t.label})}),r}(e.fields);return function(I){var w=c(),D=t(null),A=n(D,2),z=A[0],F=A[1],T=Boolean(z),E=l(j),O=y(E),_=O.getSort,H=O.changeSort,L=O.removeSort,M=a(function(){var n,r=_(),o=Boolean(r),i=e.fields[null==r?void 0:r.field],t=null!==(n=null==i?void 0:i.label)&&void 0!==n?n:null==r?void 0:r.field.toString(),l=o?"Sorted by ".concat(t," ").concat(null==r?void 0:r.direction):"Sort";return{field:null==r?void 0:r.field,direction:null==r?void 0:r.direction,hasSort:o,title:l}},[_]),U=a(function(){return Object.assign({popperProps:{},rootProps:{}},e,I.slots)},[]),V=function(){F(null)};return o(S,{onClickAway:V,children:i(N,r(r({className:d.root},U.rootProps),{},{children:[o(u,{title:null==M?void 0:M.title,placement:"top",arrow:!0,children:o(s,{size:"small",ref:w,onClick:function(){F(w.current)},children:o(p,{variant:"dot",color:"primary",invisible:!(null!=M&&M.hasSort),children:o(b,{fontSize:"small"})})})}),o(C,r(r({open:T,anchorEl:z,placement:"bottom",transition:!0,disablePortal:!0},U.popperProps),{},{children:i(x,{title:"Sort by",onClose:V,children:[o(f,{className:d.menu,children:m.map(function(e){var n,r=e.field.toString();if(!r)return null;var t=null!==(n=e.label)&&void 0!==n?n:r.toString(),l=(null==M?void 0:M.field)===e.field,a=l?M.direction:void 0;return o(v,{className:d.menuItem,sx:{justifyContent:"space-between"},onClick:function(){return n=e.field,V(),void setTimeout(function(){H(n)},100);var n},selected:l,children:o(u,{title:P(a),placement:"right",arrow:!0,children:i("div",{className:d.menuItemInner,children:[o(h,{variant:"body2",children:t}),B(a)]})})},r)})}),i(k,{children:[o(g,{color:"inherit",onClick:L,children:"Clear"}),o(g,{color:"primary",onClick:V,children:"Done"})]})]})}))]}))})}}var F={root:"DinoFilterSort-root",menu:"DinoFilterSort-menu",menuItem:"DinoFilterSort-menuItem",menuItemInner:"DinoFilterSort-menuItemInner"},N=d(m)(function(n){var r=n.theme;return e(e(e({},"&.".concat(F.menu),{minWidth:"200px",padding:0}),".".concat(F.menuItem),e({paddingTop:0,paddingBottom:0,"&:not(:last-child)":{borderBottom:"1px solid var(--color-divider, rgba(145 160 170 / 10%))"}},".MuiSvgIcon-root",{fontSize:16})),".".concat(F.menuItemInner),{width:"100%",display:"flex",alignItems:"center",justifyContent:"space-between",gap:r.spacing(1),paddingTop:r.spacing(.75),paddingBottom:r.spacing(.75)})});export{N as FilterSortStyled,z as createFilterSort,F as filterSortClasses,B as getSortDirectionIcon,P as getSortDirectionLabel,A as mapSortDirectionIcon,D as mapSortDirectionLabel};
+import{defineProperty as o,slicedToArray as r,objectSpread2 as n}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as e,jsxs as i}from"react/jsx-runtime";import{useState as t,useContext as l,useMemo as a,createRef as c}from"react";import{styled as d,Box as s,Tooltip as m,IconButton as u,Badge as p,MenuList as f,MenuItem as v,Typography as h,Button as g}from"@mui/material";import S from"@mui/material/ClickAwayListener";import b from"@mui/icons-material/SwapVert";import I from"@mui/icons-material/ArrowUpward";import w from"@mui/icons-material/ArrowDownward";import{useFilterActions as x}from"./hooks.js";import{FilterBarContext as y}from"../index.context.js";import{PopperCustom as j,PopperContent as C,PopperFooter as P}from"./popper-custom.js";var k={asc:"Ascending",desc:"Descending"},D=function(o){return o?k[o]:""},A={asc:e(I,{fontSize:"small"}),desc:e(w,{fontSize:"small"})},B=function(o){return o?A[o]:null};function z(o){var d=F,s=function(o){var n=[];return Object.entries(o).forEach(function(o){var e=r(o,2),i=e[0],t=e[1];n.push({field:i,label:null==t?void 0:t.label})}),n}(o.fields);return function(I){var w=c(),k=t(null),A=r(k,2),z=A[0],F=A[1],T=Boolean(z),E=l(y),O=x(E),_=O.getSort,H=O.changeSort,L=O.removeSort,M=a(function(){var r,n=_(),e=Boolean(n),i=o.fields[null==n?void 0:n.field],t=null!==(r=null==i?void 0:i.label)&&void 0!==r?r:null==n?void 0:n.field.toString(),l=e?"Sorted by ".concat(t," ").concat(null==n?void 0:n.direction):"Sort";return{field:null==n?void 0:n.field,direction:null==n?void 0:n.direction,hasSort:e,title:l}},[_]),U=a(function(){var r,e,i=n(n({},I.slots),{},{rootProps:n(n({},null===(r=I.slots)||void 0===r?void 0:r.rootProps),{},{sx:n(n({},I.sx),null===(e=I.slots)||void 0===e||null===(e=e.rootProps)||void 0===e?void 0:e.sx)})});return Object.assign({popperProps:{},rootProps:{}},o,i)},[I.slots,I.sx]),V=function(){F(null)};return e(S,{onClickAway:V,children:i(N,n(n({className:d.root},U.rootProps),{},{children:[e(m,{title:null==M?void 0:M.title,arrow:!0,children:e(u,{size:"small",ref:w,onClick:function(){F(w.current)},children:e(p,{variant:"dot",color:"primary",invisible:!(null!=M&&M.hasSort),children:e(b,{fontSize:"small"})})})}),e(j,n(n({open:T,anchorEl:z,placement:"bottom",transition:!0,disablePortal:!0},U.popperProps),{},{children:i(C,{title:"Sort by",onClose:V,children:[e(f,{className:d.menu,children:s.map(function(o){var r,n=o.field.toString();if(!n)return null;var t=null!==(r=o.label)&&void 0!==r?r:n.toString(),l=(null==M?void 0:M.field)===o.field,a=l?M.direction:void 0;return e(v,{className:d.menuItem,sx:{justifyContent:"space-between"},onClick:function(){return r=o.field,V(),void setTimeout(function(){H(r)},100);var r},selected:l,children:e(m,{title:D(a),placement:"right",arrow:!0,children:i("div",{className:d.menuItemInner,children:[e(h,{variant:"body2",children:t}),B(a)]})})},n)})}),i(P,{children:[e(g,{color:"inherit",onClick:L,children:"Clear"}),e(g,{color:"primary",onClick:V,children:"Done"})]})]})}))]}))})}}var F={root:"DinoFilterSort-root",menu:"DinoFilterSort-menu",menuItem:"DinoFilterSort-menuItem",menuItemInner:"DinoFilterSort-menuItemInner"},N=d(s)(function(r){var n=r.theme;return o(o(o({},"&.".concat(F.menu),{minWidth:"200px",padding:0}),".".concat(F.menuItem),o({paddingTop:0,paddingBottom:0,"&:not(:last-child)":{borderBottom:"1px solid var(--color-divider, rgba(145 160 170 / 10%))"}},".MuiSvgIcon-root",{fontSize:16})),".".concat(F.menuItemInner),{width:"100%",display:"flex",alignItems:"center",justifyContent:"space-between",gap:n.spacing(1),paddingTop:n.spacing(.75),paddingBottom:n.spacing(.75)})});export{N as FilterSortStyled,z as createFilterSort,F as filterSortClasses,B as getSortDirectionIcon,D as getSortDirectionLabel,A as mapSortDirectionIcon,k as mapSortDirectionLabel};
 //# sourceMappingURL=filter-sort.js.map

package/dist/src/filter-bar/components/filter-sort.js.map

@@ -1 +1 @@
-{"version":3,"file":"filter-sort.js","sources":["../../../../src/filter-bar/components/filter-sort.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useContext, useMemo, useState } from 'react'\r\nimport { Badge, Box, Button, IconButton, MenuItem, MenuList, styled, Tooltip, Typography } from '@mui/material'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport SwapVertIcon from '@mui/icons-material/SwapVert'\r\nimport ArrowUpwardIcon from '@mui/icons-material/ArrowUpward'\r\nimport ArrowDownwardIcon from '@mui/icons-material/ArrowDownward'\r\nimport { useFilterActions } from './hooks'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { FieldSortDirection } from './filter-sort.types'\r\nimport { PopperContent, PopperCustom, PopperFooter } from './popper-custom'\r\n// types\r\nimport type { FC, ReactNode } from 'react'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IFieldSort, IFilterSortConfig, IFilterSortProps, TFieldSorts } from './filter-sort.types'\r\n\r\nexport const mapSortDirectionLabel: { [key in FieldSortDirection]: string } = {\r\n  asc: 'Ascending',\r\n  desc: 'Descending'\r\n}\r\n\r\nexport const getSortDirectionLabel = (direction?: FieldSortDirection): string => {\r\n  if (!direction) return ''\r\n  return mapSortDirectionLabel[direction]\r\n}\r\n\r\nexport const mapSortDirectionIcon: { [key in FieldSortDirection]: ReactNode } = {\r\n  asc: <ArrowUpwardIcon fontSize='small' />,\r\n  desc: <ArrowDownwardIcon fontSize='small' />\r\n}\r\n\r\nexport const getSortDirectionIcon = (direction?: FieldSortDirection): ReactNode => {\r\n  if (!direction) return null\r\n  return mapSortDirectionIcon[direction]\r\n}\r\n\r\nfunction generateSortOptions<T>(fields: TFieldSorts<T>): IFieldSort<T>[] {\r\n  const options: IFieldSort<T>[] = []\r\n  Object.entries(fields).forEach(([key, value]) => {\r\n    options.push({ field: key as TFieldType<T>, label: value?.label })\r\n  })\r\n  return options\r\n}\r\n\r\nexport function createFilterSort<T>(config: IFilterSortConfig<T>) {\r\n  const classes = filterSortClasses\r\n  const options = generateSortOptions(config.fields)\r\n\r\n  const FilterSort: FC<IFilterSortProps<T>> = (props) => {\r\n    const refButton = createRef<HTMLButtonElement>()\r\n\r\n    const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n    const isOpen = Boolean(anchorEl)\r\n\r\n    const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n    const { getSort, changeSort, removeSort } = useFilterActions<T>(context)\r\n\r\n    const sortInfo = useMemo(() => {\r\n      const obj = getSort()\r\n      const hasSort = Boolean(obj)\r\n      const item = config.fields[obj?.field as TFieldType<T>]\r\n      const label = item?.label ?? obj?.field.toString()\r\n      const title = hasSort ? `Sorted by ${label} ${obj?.direction}` : 'Sort'\r\n      return { field: obj?.field, direction: obj?.direction, hasSort, title }\r\n    }, [getSort])\r\n\r\n    const mergedSlots = useMemo(() => {\r\n      return Object.assign({ popperProps: {}, rootProps: {} }, config, props.slots)\r\n    }, [])\r\n\r\n    const handleClose = () => {\r\n      setAnchorEl(null)\r\n    }\r\n\r\n    const handleOpen = () => {\r\n      setAnchorEl(refButton.current)\r\n    }\r\n\r\n    const handleMenuItemClick = (field: TFieldType<T>) => {\r\n      handleClose()\r\n      setTimeout(() => {\r\n        changeSort(field)\r\n      }, 100)\r\n    }\r\n\r\n    const renderContent = () => (\r\n      <PopperContent title='Sort by' onClose={handleClose}>\r\n        <MenuList className={classes.menu}>\r\n          {options.map((item) => {\r\n            const key = item.field.toString()\r\n            if (!key) return null\r\n            const label = item.label ?? key.toString()\r\n            const isActive = sortInfo?.field === item.field\r\n            const direction = isActive ? sortInfo.direction : undefined\r\n            return (\r\n              <MenuItem\r\n                key={key}\r\n                className={classes.menuItem}\r\n                sx={{ justifyContent: 'space-between' }}\r\n                onClick={() => handleMenuItemClick(item.field)}\r\n                selected={isActive}\r\n              >\r\n                <Tooltip title={getSortDirectionLabel(direction)} placement='right' arrow>\r\n                  <div className={classes.menuItemInner}>\r\n                    <Typography variant='body2'>{label}</Typography>\r\n                    {getSortDirectionIcon(direction)}\r\n                  </div>\r\n                </Tooltip>\r\n              </MenuItem>\r\n            )\r\n          })}\r\n        </MenuList>\r\n        <PopperFooter>\r\n          <Button color='inherit' onClick={removeSort}>\r\n            Clear\r\n          </Button>\r\n          <Button color='primary' onClick={handleClose}>\r\n            Done\r\n          </Button>\r\n        </PopperFooter>\r\n      </PopperContent>\r\n    )\r\n\r\n    return (\r\n      <ClickAwayListener onClickAway={handleClose}>\r\n        <FilterSortStyled className={classes.root} {...mergedSlots.rootProps}>\r\n          <Tooltip title={sortInfo?.title} placement='top' arrow>\r\n            <IconButton size='small' ref={refButton} onClick={handleOpen}>\r\n              <Badge variant='dot' color='primary' invisible={!sortInfo?.hasSort}>\r\n                <SwapVertIcon fontSize='small' />\r\n              </Badge>\r\n            </IconButton>\r\n          </Tooltip>\r\n          <PopperCustom open={isOpen} anchorEl={anchorEl} placement='bottom' transition disablePortal {...mergedSlots.popperProps}>\r\n            {renderContent()}\r\n          </PopperCustom>\r\n        </FilterSortStyled>\r\n      </ClickAwayListener>\r\n    )\r\n  }\r\n\r\n  return FilterSort\r\n}\r\n\r\n// styles\r\nexport const filterSortClasses = {\r\n  root: 'DinoFilterSort-root',\r\n  menu: 'DinoFilterSort-menu',\r\n  menuItem: 'DinoFilterSort-menuItem',\r\n  menuItemInner: 'DinoFilterSort-menuItemInner'\r\n}\r\n\r\nexport const FilterSortStyled = styled(Box)(({ theme }) => ({\r\n  [`&.${filterSortClasses.menu}`]: { minWidth: '200px', padding: 0 },\r\n  [`.${filterSortClasses.menuItem}`]: {\r\n    paddingTop: 0,\r\n    paddingBottom: 0,\r\n    '&:not(:last-child)': {\r\n      borderBottom: '1px solid var(--color-divider, rgba(145 160 170 / 10%))'\r\n    },\r\n    [`.MuiSvgIcon-root`]: { fontSize: 16 }\r\n  },\r\n  [`.${filterSortClasses.menuItemInner}`]: {\r\n    width: '100%',\r\n    display: 'flex',\r\n    alignItems: 'center',\r\n    justifyContent: 'space-between',\r\n    gap: theme.spacing(1),\r\n    paddingTop: theme.spacing(0.75),\r\n    paddingBottom: theme.spacing(0.75)\r\n  }\r\n}))\r\n"],"names":["mapSortDirectionLabel","asc","desc","getSortDirectionLabel","direction","mapSortDirectionIcon","_jsx","ArrowUpwardIcon","fontSize","ArrowDownwardIcon","getSortDirectionIcon","createFilterSort","config","classes","filterSortClasses","options","fields","Object","entries","forEach","_ref","_ref2","_slicedToArray","key","value","push","field","label","generateSortOptions","props","refButton","createRef","_useState","useState","_useState2","anchorEl","setAnchorEl","isOpen","Boolean","context","useContext","FilterBarContext","_useFilterActions","useFilterActions","getSort","changeSort","removeSort","sortInfo","useMemo","_item$label","obj","hasSort","item","toString","title","concat","mergedSlots","assign","popperProps","rootProps","slots","handleClose","ClickAwayListener","onClickAway","children","_jsxs","FilterSortStyled","_objectSpread","className","root","Tooltip","placement","arrow","IconButton","size","ref","onClick","current","Badge","variant","color","invisible","SwapVertIcon","PopperCustom","open","transition","disablePortal","PopperContent","onClose","MenuList","menu","map","_item$label2","isActive","undefined","MenuItem","menuItem","sx","justifyContent","setTimeout","selected","menuItemInner","Typography","PopperFooter","Button","styled","Box","_ref3","theme","_defineProperty","minWidth","padding","paddingTop","paddingBottom","borderBottom","width","display","alignItems","gap","spacing"],"mappings":"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"}
+{"version":3,"file":"filter-sort.js","sources":["../../../../src/filter-bar/components/filter-sort.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useContext, useMemo, useState } from 'react'\r\nimport { Badge, Box, Button, IconButton, MenuItem, MenuList, styled, Tooltip, Typography } from '@mui/material'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport SwapVertIcon from '@mui/icons-material/SwapVert'\r\nimport ArrowUpwardIcon from '@mui/icons-material/ArrowUpward'\r\nimport ArrowDownwardIcon from '@mui/icons-material/ArrowDownward'\r\nimport { useFilterActions } from './hooks'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { FieldSortDirection } from './filter-sort.types'\r\nimport { PopperContent, PopperCustom, PopperFooter } from './popper-custom'\r\n// types\r\nimport type { FC, ReactNode } from 'react'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IFieldSort, IFilterSortConfig, IFilterSortProps, TFieldSorts } from './filter-sort.types'\r\n\r\nexport const mapSortDirectionLabel: { [key in FieldSortDirection]: string } = {\r\n  asc: 'Ascending',\r\n  desc: 'Descending'\r\n}\r\n\r\nexport const getSortDirectionLabel = (direction?: FieldSortDirection): string => {\r\n  if (!direction) return ''\r\n  return mapSortDirectionLabel[direction]\r\n}\r\n\r\nexport const mapSortDirectionIcon: { [key in FieldSortDirection]: ReactNode } = {\r\n  asc: <ArrowUpwardIcon fontSize='small' />,\r\n  desc: <ArrowDownwardIcon fontSize='small' />\r\n}\r\n\r\nexport const getSortDirectionIcon = (direction?: FieldSortDirection): ReactNode => {\r\n  if (!direction) return null\r\n  return mapSortDirectionIcon[direction]\r\n}\r\n\r\nfunction generateSortOptions<T>(fields: TFieldSorts<T>): IFieldSort<T>[] {\r\n  const options: IFieldSort<T>[] = []\r\n  Object.entries(fields).forEach(([key, value]) => {\r\n    options.push({ field: key as TFieldType<T>, label: value?.label })\r\n  })\r\n  return options\r\n}\r\n\r\nexport function createFilterSort<T>(config: IFilterSortConfig<T>) {\r\n  const classes = filterSortClasses\r\n  const options = generateSortOptions(config.fields)\r\n\r\n  const FilterSort: FC<IFilterSortProps<T>> = (props) => {\r\n    const refButton = createRef<HTMLButtonElement>()\r\n\r\n    const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n    const isOpen = Boolean(anchorEl)\r\n\r\n    const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n    const { getSort, changeSort, removeSort } = useFilterActions<T>(context)\r\n\r\n    const sortInfo = useMemo(() => {\r\n      const obj = getSort()\r\n      const hasSort = Boolean(obj)\r\n      const item = config.fields[obj?.field as TFieldType<T>]\r\n      const label = item?.label ?? obj?.field.toString()\r\n      const title = hasSort ? `Sorted by ${label} ${obj?.direction}` : 'Sort'\r\n      return { field: obj?.field, direction: obj?.direction, hasSort, title }\r\n    }, [getSort])\r\n\r\n    const mergedSlots = useMemo(() => {\r\n      const slotsProps = { ...props.slots, rootProps: { ...props.slots?.rootProps, sx: { ...props.sx, ...props.slots?.rootProps?.sx } } }\r\n      return Object.assign({ popperProps: {}, rootProps: {} }, config, slotsProps)\r\n    }, [props.slots, props.sx])\r\n\r\n    const handleClose = () => {\r\n      setAnchorEl(null)\r\n    }\r\n\r\n    const handleOpen = () => {\r\n      setAnchorEl(refButton.current)\r\n    }\r\n\r\n    const handleMenuItemClick = (field: TFieldType<T>) => {\r\n      handleClose()\r\n      setTimeout(() => {\r\n        changeSort(field)\r\n      }, 100)\r\n    }\r\n\r\n    const renderContent = () => (\r\n      <PopperContent title='Sort by' onClose={handleClose}>\r\n        <MenuList className={classes.menu}>\r\n          {options.map((item) => {\r\n            const key = item.field.toString()\r\n            if (!key) return null\r\n            const label = item.label ?? key.toString()\r\n            const isActive = sortInfo?.field === item.field\r\n            const direction = isActive ? sortInfo.direction : undefined\r\n            return (\r\n              <MenuItem\r\n                key={key}\r\n                className={classes.menuItem}\r\n                sx={{ justifyContent: 'space-between' }}\r\n                onClick={() => handleMenuItemClick(item.field)}\r\n                selected={isActive}\r\n              >\r\n                <Tooltip title={getSortDirectionLabel(direction)} placement='right' arrow>\r\n                  <div className={classes.menuItemInner}>\r\n                    <Typography variant='body2'>{label}</Typography>\r\n                    {getSortDirectionIcon(direction)}\r\n                  </div>\r\n                </Tooltip>\r\n              </MenuItem>\r\n            )\r\n          })}\r\n        </MenuList>\r\n        <PopperFooter>\r\n          <Button color='inherit' onClick={removeSort}>\r\n            Clear\r\n          </Button>\r\n          <Button color='primary' onClick={handleClose}>\r\n            Done\r\n          </Button>\r\n        </PopperFooter>\r\n      </PopperContent>\r\n    )\r\n\r\n    return (\r\n      <ClickAwayListener onClickAway={handleClose}>\r\n        <FilterSortStyled className={classes.root} {...mergedSlots.rootProps}>\r\n          <Tooltip title={sortInfo?.title} arrow>\r\n            <IconButton size='small' ref={refButton} onClick={handleOpen}>\r\n              <Badge variant='dot' color='primary' invisible={!sortInfo?.hasSort}>\r\n                <SwapVertIcon fontSize='small' />\r\n              </Badge>\r\n            </IconButton>\r\n          </Tooltip>\r\n          <PopperCustom open={isOpen} anchorEl={anchorEl} placement='bottom' transition disablePortal {...mergedSlots.popperProps}>\r\n            {renderContent()}\r\n          </PopperCustom>\r\n        </FilterSortStyled>\r\n      </ClickAwayListener>\r\n    )\r\n  }\r\n\r\n  return FilterSort\r\n}\r\n\r\n// styles\r\nexport const filterSortClasses = {\r\n  root: 'DinoFilterSort-root',\r\n  menu: 'DinoFilterSort-menu',\r\n  menuItem: 'DinoFilterSort-menuItem',\r\n  menuItemInner: 'DinoFilterSort-menuItemInner'\r\n}\r\n\r\nexport const FilterSortStyled = styled(Box)(({ theme }) => ({\r\n  [`&.${filterSortClasses.menu}`]: { minWidth: '200px', padding: 0 },\r\n  [`.${filterSortClasses.menuItem}`]: {\r\n    paddingTop: 0,\r\n    paddingBottom: 0,\r\n    '&:not(:last-child)': {\r\n      borderBottom: '1px solid var(--color-divider, rgba(145 160 170 / 10%))'\r\n    },\r\n    [`.MuiSvgIcon-root`]: { fontSize: 16 }\r\n  },\r\n  [`.${filterSortClasses.menuItemInner}`]: {\r\n    width: '100%',\r\n    display: 'flex',\r\n    alignItems: 'center',\r\n    justifyContent: 'space-between',\r\n    gap: theme.spacing(1),\r\n    paddingTop: theme.spacing(0.75),\r\n    paddingBottom: theme.spacing(0.75)\r\n  }\r\n}))\r\n"],"names":["mapSortDirectionLabel","asc","desc","getSortDirectionLabel","direction","mapSortDirectionIcon","_jsx","ArrowUpwardIcon","fontSize","ArrowDownwardIcon","getSortDirectionIcon","createFilterSort","config","classes","filterSortClasses","options","fields","Object","entries","forEach","_ref","_ref2","_slicedToArray","key","value","push","field","label","generateSortOptions","props","refButton","createRef","_useState","useState","_useState2","anchorEl","setAnchorEl","isOpen","Boolean","context","useContext","FilterBarContext","_useFilterActions","useFilterActions","getSort","changeSort","removeSort","sortInfo","useMemo","_item$label","obj","hasSort","item","toString","title","concat","mergedSlots","_props$slots","_props$slots2","slotsProps","_objectSpread","slots","rootProps","sx","assign","popperProps","handleClose","ClickAwayListener","onClickAway","children","_jsxs","FilterSortStyled","className","root","Tooltip","arrow","IconButton","size","ref","onClick","current","Badge","variant","color","invisible","SwapVertIcon","PopperCustom","open","placement","transition","disablePortal","PopperContent","onClose","MenuList","menu","map","_item$label2","isActive","undefined","MenuItem","menuItem","justifyContent","setTimeout","selected","menuItemInner","Typography","PopperFooter","Button","styled","Box","_ref3","theme","_defineProperty","minWidth","padding","paddingTop","paddingBottom","borderBottom","width","display","alignItems","gap","spacing"],"mappings":"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"}

package/dist/src/filter-bar/helpers.js

@@ -1,2 +1,2 @@
-import{defineProperty as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{KeySpecial as e}from"./types.js";var i=r({},e.quickSearch,"Quick Search");export{i as mapSpecialLabel};
+import{defineProperty as r,typeof as e}from"../../_virtual/_rollupPluginBabelHelpers.js";import{KeySpecial as t}from"./types.js";import{QueryParam as i}from"../utils/query-param.js";var n=r({},t.quickSearch,"Quick Search");function o(r){if(null!=r){if("object"!==e(r))return r;if(Array.isArray(r)){var t=r.map(o).filter(function(r){return void 0!==r});return t.length>0?t:void 0}var i={},n=!1;for(var f in r)if(r.hasOwnProperty(f)){var a=o(r[f]);void 0!==a&&(i[f]=a,n=!0)}return n?i:void 0}}function f(r,e){if(r===e)return!0;try{var t=o(r),i=o(e);return t===i||!(!t||!i)&&JSON.stringify(t)===JSON.stringify(i)}catch(r){return console.error("Error comparing filter states:",r),!1}}function a(r,e){if("undefined"!=typeof window)try{if(f(r,e))return void i.replaceDeletes("filter");if(!r||0===Object.keys(r).length)return void i.replaceDeletes("filter");var t={filter:JSON.stringify(r)};i.replacePatch(t)}catch(r){console.error("Error syncing filter state to URL:",r)}}function l(r){if("undefined"==typeof window)return r;try{var e=i.gets("filter");return e.filter?JSON.parse(e.filter):r}catch(e){return console.error("Error getting filter state from URL:",e),r}}export{l as getFilterFromURL,f as isFilterStateEqual,n as mapSpecialLabel,o as removeNullValues,a as setFilterToURL};
 //# sourceMappingURL=helpers.js.map

package/dist/src/filter-bar/helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.js","sources":["../../../src/filter-bar/helpers.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nimport { KeySpecial } from './types'\r\n\r\nexport const mapSpecialLabel: Record<KeySpecial, string> = {\r\n  [KeySpecial.quickSearch]: 'Quick Search'\r\n}\r\n"],"names":["mapSpecialLabel","_defineProperty","KeySpecial","quickSearch"],"mappings":"qHAIO,IAAMA,EAAeC,EAAA,CAAA,EACzBC,EAAWC,YAAc"}
+{"version":3,"file":"helpers.js","sources":["../../../src/filter-bar/helpers.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nimport { KeySpecial, TFilterState } from './types'\r\nimport { QueryParam } from '../utils/query-param'\r\n\r\nexport const mapSpecialLabel: Record<KeySpecial, string> = {\r\n  [KeySpecial.quickSearch]: 'Quick Search'\r\n}\r\n\r\nexport interface IFilterStateQueryParams {\r\n  filter?: string\r\n}\r\n\r\n/**\r\n * @en Remove null/undefined values from object recursively for accurate comparison.\r\n * @vi Loai bo cac gia tri null/undefined khoi object mot cach de quy de so sanh chinh xac.\r\n */\r\nexport function removeNullValues<T = any>(obj: T): T | undefined {\r\n  if (obj === null || obj === undefined) {\r\n    return undefined\r\n  }\r\n\r\n  if (typeof obj !== 'object') {\r\n    return obj\r\n  }\r\n\r\n  if (Array.isArray(obj)) {\r\n    const cleaned = obj.map(removeNullValues).filter((v) => v !== undefined)\r\n    return cleaned.length > 0 ? (cleaned as any) : undefined\r\n  }\r\n\r\n  const cleaned: any = {}\r\n  let hasValue = false\r\n\r\n  for (const key in obj) {\r\n    if (obj.hasOwnProperty(key)) {\r\n      const value = removeNullValues(obj[key])\r\n      if (value !== undefined) {\r\n        cleaned[key] = value\r\n        hasValue = true\r\n      }\r\n    }\r\n  }\r\n\r\n  return hasValue ? cleaned : undefined\r\n}\r\n\r\n/**\r\n * @en Deep comparison of two filter states to check if they are equal.\r\n * @vi So sanh sau hai filter state de kiem tra xem chung co bang nhau khong.\r\n */\r\nexport function isFilterStateEqual<T>(state1?: TFilterState<T>, state2?: TFilterState<T>): boolean {\r\n  if (state1 === state2) return true\r\n\r\n  try {\r\n    // Remove null/undefined values before comparison\r\n    const cleaned1 = removeNullValues(state1)\r\n    const cleaned2 = removeNullValues(state2)\r\n\r\n    if (cleaned1 === cleaned2) return true\r\n    if (!cleaned1 || !cleaned2) return false\r\n\r\n    return JSON.stringify(cleaned1) === JSON.stringify(cleaned2)\r\n  } catch (error) {\r\n    console.error('Error comparing filter states:', error)\r\n    return false\r\n  }\r\n}\r\n\r\n/**\r\n * @en Synchronize filter state to URL query parameters. If state equals defaultState, remove from URL to keep it clean.\r\n * @vi Dong bo filter state vao URL query parameters. Neu state bang defaultState, xoa khoi URL de giu URL sach.\r\n *\r\n * @param state - Current filter state to sync\r\n * @param defaultState - Default filter state (if current equals this, don't save to URL)\r\n */\r\nexport function setFilterToURL<T>(state?: TFilterState<T>, defaultState?: TFilterState<T>) {\r\n  // If window is undefined (e.g., during SSR), do nothing\r\n  if (typeof window === 'undefined') return\r\n\r\n  try {\r\n    // If state equals default, remove from URL\r\n    if (isFilterStateEqual(state, defaultState)) {\r\n      QueryParam.replaceDeletes<IFilterStateQueryParams>('filter')\r\n      return\r\n    }\r\n\r\n    // If state is empty/undefined, remove from URL\r\n    if (!state || Object.keys(state).length === 0) {\r\n      QueryParam.replaceDeletes<IFilterStateQueryParams>('filter')\r\n      return\r\n    }\r\n\r\n    // Serialize state to JSON and save to URL\r\n    const updateParams: IFilterStateQueryParams = {\r\n      filter: JSON.stringify(state)\r\n    }\r\n\r\n    QueryParam.replacePatch<IFilterStateQueryParams>(updateParams)\r\n  } catch (error) {\r\n    console.error('Error syncing filter state to URL:', error)\r\n  }\r\n}\r\n\r\n/**\r\n * @en Retrieve filter state from URL query parameters.\r\n * @vi Lay filter state tu URL query parameters.\r\n *\r\n * @param defaultState - Default filter state to return if URL has no filter state\r\n * @returns Filter state from URL or defaultState\r\n */\r\nexport function getFilterFromURL<T>(defaultState?: TFilterState<T>): TFilterState<T> | undefined {\r\n  // If window is undefined (e.g., during SSR), return defaultState\r\n  if (typeof window === 'undefined') return defaultState\r\n\r\n  try {\r\n    const q = QueryParam.gets<IFilterStateQueryParams>('filter')\r\n\r\n    if (!q.filter) {\r\n      return defaultState\r\n    }\r\n\r\n    // Parse JSON from URL\r\n    const state = JSON.parse(q.filter) as TFilterState<T>\r\n    return state\r\n  } catch (error) {\r\n    console.error('Error getting filter state from URL:', error)\r\n    return defaultState\r\n  }\r\n}\r\n"],"names":["mapSpecialLabel","_defineProperty","KeySpecial","quickSearch","removeNullValues","obj","_typeof","Array","isArray","cleaned","map","filter","v","undefined","length","hasValue","key","hasOwnProperty","value","isFilterStateEqual","state1","state2","cleaned1","cleaned2","JSON","stringify","error","console","setFilterToURL","state","defaultState","window","QueryParam","replaceDeletes","Object","keys","updateParams","replacePatch","getFilterFromURL","q","gets","parse"],"mappings":"sLAKO,IAAMA,EAAeC,EAAA,CAAA,EACzBC,EAAWC,YAAc,gBAWtB,SAAUC,EAA0BC,GACxC,GAAIA,QAAJ,CAIA,GAAmB,WAAfC,EAAOD,GACT,OAAOA,EAGT,GAAIE,MAAMC,QAAQH,GAAM,CACtB,IAAMI,EAAUJ,EAAIK,IAAIN,GAAkBO,OAAO,SAACC,GAAC,YAAWC,IAAND,IACxD,OAAOH,EAAQK,OAAS,EAAKL,OAAkBI,CAChD,CAED,IAAMJ,EAAe,CAAE,EACnBM,GAAW,EAEf,IAAK,IAAMC,KAAOX,EAChB,GAAIA,EAAIY,eAAeD,GAAM,CAC3B,IAAME,EAAQd,EAAiBC,EAAIW,SACrBH,IAAVK,IACFT,EAAQO,GAAOE,EACfH,GAAW,EAEd,CAGH,OAAOA,EAAWN,OAAUI,CAxB3B,CAyBH,CAMgB,SAAAM,EAAsBC,EAA0BC,GAC9D,GAAID,IAAWC,EAAQ,OAAO,EAE9B,IAEE,IAAMC,EAAWlB,EAAiBgB,GAC5BG,EAAWnB,EAAiBiB,GAElC,OAAIC,IAAaC,MACZD,IAAaC,IAEXC,KAAKC,UAAUH,KAAcE,KAAKC,UAAUF,EACpD,CAAC,MAAOG,GAEP,OADAC,QAAQD,MAAM,iCAAkCA,IACzC,CACR,CACH,CASgB,SAAAE,EAAkBC,EAAyBC,GAEzD,GAAsB,oBAAXC,OAEX,IAEE,GAAIZ,EAAmBU,EAAOC,GAE5B,YADAE,EAAWC,eAAwC,UAKrD,IAAKJ,GAAuC,IAA9BK,OAAOC,KAAKN,GAAOf,OAE/B,YADAkB,EAAWC,eAAwC,UAKrD,IAAMG,EAAwC,CAC5CzB,OAAQa,KAAKC,UAAUI,IAGzBG,EAAWK,aAAsCD,EAClD,CAAC,MAAOV,GACPC,QAAQD,MAAM,qCAAsCA,EACrD,CACH,CASM,SAAUY,EAAoBR,GAElC,GAAsB,oBAAXC,OAAwB,OAAOD,EAE1C,IACE,IAAMS,EAAIP,EAAWQ,KAA8B,UAEnD,OAAKD,EAAE5B,OAKOa,KAAKiB,MAAMF,EAAE5B,QAJlBmB,CAMV,CAAC,MAAOJ,GAEP,OADAC,QAAQD,MAAM,uCAAwCA,GAC/CI,CACR,CACH"}

package/dist/src/filter-bar/index.create.js

@@ -1,2 +1,2 @@
-import{defineProperty as t,inherits as e,createClass as n,objectSpread2 as r,classCallCheck as o,callSuper as i,asyncToGenerator as a,regenerator as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as s,jsxs as u}from"react/jsx-runtime";import{Component as p}from"react";import{styled as m,Box as f}from"@mui/material";import{createFilterBarContext as c}from"./index.context.js";import{createFilterSort as d}from"./components/filter-sort.js";import{createFilterMenu as v}from"./components/filter-menu.js";import{createFilterInput as g}from"./components/filter-input.js";import{createFilterSummary as h}from"./components/filter-summary.js";import{fetchDelay as C}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";function S(m){if(!m.InputComponent){var S=m.inputConfig||{fields:{}};m.inputConfig=S,m.InputComponent=g(S)}if(!m.MenuComponent){var b=m.menuConfig||{fields:{}};m.menuConfig=b,m.MenuComponent=v(b)}if(!m.SummaryComponent&&!1!==m.enableSummary){var x=m.summaryConfig||{fields:{}};m.summaryConfig=x,m.SummaryComponent=h(x)}if(!m.SortComponent){var F=m.sortConfig||{fields:{}};m.sortConfig=F,m.SortComponent=d(F)}var k=m.defaultFilterLogic||"and",P=c(),I=function(){function c(e){var n;return o(this,c),n=i(this,c,[e]),t(n,"handleChange",function(){var t=a(l().m(function t(e,r){var o;return l().w(function(t){for(;;)switch(t.p=t.n){case 0:return t.p=0,n.setState(function(t){var e;return{filterState:null!==(e=null==r?void 0:r.filterState)&&void 0!==e?e:t.filterState,isLoading:!0}}),t.n=1,C(a(l().m(function t(){var r,o;return l().w(function(t){for(;;)if(0===t.n)return t.a(2,null===(r=(o=n.props).onChange)||void 0===r?void 0:r.call(o,e))},t)})),500);case 1:n.setState({isLoading:!1}),t.n=3;break;case 2:throw t.p=2,o=t.v,n.setState({isLoading:!1}),o;case 3:return t.a(2)}},t,null,[[0,2]])}));return function(e,n){return t.apply(this,arguments)}}()),t(n,"setFilterState",function(t){n.props.value?n.handleChange(t):n.handleChange(t,{filterState:t})}),t(n,"onAddFilter",function(){console.log("Add filter")}),t(n,"onAddRemove",function(){console.log("Remove filter")}),n.state=n.getInitialFilterState(),n}return e(c,p),n(c,[{key:"getInitialFilterState",value:function(){return this.props.value?{filterState:this.props.value}:{filterState:Object.assign({filterLogic:k},m.initialFilterState)}}},{key:"filterState",get:function(){return this.props.value||this.state.filterState}},{key:"isLoading",get:function(){return this.state.isLoading||!1}},{key:"render",value:function(){var t,e=this.props.slots,n=m.InputComponent,o=m.MenuComponent,i=m.SummaryComponent,a=m.SortComponent;return s(P.Provider,{value:this,children:u(j,{className:y.root,sx:this.props.sx,children:[u("div",{className:y.inner,children:[(null==e?void 0:e.before)||null,s(o,{slots:{popperProps:{placement:"bottom-start"}}}),s(a,{slots:{popperProps:{placement:"bottom-start"}}}),s(n,{onAdd:this.onAddFilter,slots:{popperProps:{placement:"bottom-start"}}}),(null==e?void 0:e.after)||null]}),u(f,r(r({},null==e?void 0:e.summaryWrapProps),{},{sx:r({display:"flex",alignItems:"center"},null==e||null===(t=e.summaryWrapProps)||void 0===t?void 0:t.sx),children:[(null==e?void 0:e.summaryBefore)||null,s(f,{sx:{flex:1,minWidth:0},children:!1!==m.enableSummary&&s(i,{})}),(null==e?void 0:e.summaryAfter)||null]}))]})})}}])}();return I}var y={root:"DinoFilterBar-root",inner:"DinoFilterBar-inner"},j=m(f)(function(e){var n=e.theme;return t(t({},"&.".concat(y.root),{backgroundColor:n.palette.background.paper}),".".concat(y.inner),{display:"flex",alignItems:"center",gap:n.spacing(1)})});export{S as createFilterBar};
+import{defineProperty as t,inherits as e,createClass as n,objectSpread2 as r,classCallCheck as o,callSuper as i,asyncToGenerator as a,regenerator as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as s,jsxs as u}from"react/jsx-runtime";import{Component as p}from"react";import{styled as m,Box as f}from"@mui/material";import{createFilterBarContext as c}from"./index.context.js";import{createFilterSort as d}from"./components/filter-sort.js";import{createFilterMenu as v}from"./components/filter-menu.js";import{createFilterInput as g}from"./components/filter-input.js";import{createFilterSummary as h}from"./components/filter-summary.js";import{fetchDelay as C}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";function S(m){if(!m.InputComponent){var S=m.inputConfig||{fields:{}};m.inputConfig=S,m.InputComponent=g(S)}if(!m.MenuComponent){var x=m.menuConfig||{fields:{}};m.menuConfig=x,m.MenuComponent=v(x)}if(!m.SummaryComponent&&!1!==m.enableSummary){var b=m.summaryConfig||{fields:{}};m.summaryConfig=b,m.SummaryComponent=h(b)}if(!m.SortComponent){var F=m.sortConfig||{fields:{}};m.sortConfig=F,m.SortComponent=d(F)}var k=m.defaultFilterLogic||"and",P=c(),I=function(){function c(e){var n;return o(this,c),n=i(this,c,[e]),t(n,"handleChange",function(){var t=a(l().m(function t(e,r){var o;return l().w(function(t){for(;;)switch(t.p=t.n){case 0:return t.p=0,n.setState(function(t){var e;return{filterState:null!==(e=null==r?void 0:r.filterState)&&void 0!==e?e:t.filterState,isLoading:!0}}),t.n=1,C(a(l().m(function t(){var r,o;return l().w(function(t){for(;;)if(0===t.n)return t.a(2,null===(r=(o=n.props).onChange)||void 0===r?void 0:r.call(o,e))},t)})),500);case 1:n.setState({isLoading:!1}),t.n=3;break;case 2:throw t.p=2,o=t.v,n.setState({isLoading:!1}),o;case 3:return t.a(2)}},t,null,[[0,2]])}));return function(e,n){return t.apply(this,arguments)}}()),t(n,"setFilterState",function(t){n.props.value?n.handleChange(t):n.handleChange(t,{filterState:t})}),t(n,"onAddFilter",function(){console.log("Add filter")}),t(n,"onAddRemove",function(){console.log("Remove filter")}),n.state=n.getInitialFilterState(),n}return e(c,p),n(c,[{key:"getInitialFilterState",value:function(){return this.props.value?{filterState:this.props.value}:{filterState:Object.assign({filterLogic:k},m.initialFilterState)}}},{key:"filterState",get:function(){return this.props.value||this.state.filterState}},{key:"isLoading",get:function(){return this.state.isLoading||!1}},{key:"render",value:function(){var t,e=this.props.slots,n=m.InputComponent,o=m.MenuComponent,i=m.SummaryComponent,a=m.SortComponent;return s(P.Provider,{value:this,children:u(j,{className:y.root,sx:this.props.sx,children:[u("div",{className:y.inner,children:[(null==e?void 0:e.before)||null,s(o,{slots:{popperProps:{placement:"bottom-start"}}}),s(a,{sx:{mr:1},slots:{popperProps:{placement:"bottom-start"}}}),s(n,{onAdd:this.onAddFilter,slots:{popperProps:{placement:"bottom-start"}}}),(null==e?void 0:e.after)||null]}),u(f,r(r({},null==e?void 0:e.summaryWrapProps),{},{sx:r({display:"flex",alignItems:"center"},null==e||null===(t=e.summaryWrapProps)||void 0===t?void 0:t.sx),children:[(null==e?void 0:e.summaryBefore)||null,s(f,{sx:{flex:1,minWidth:0},children:!1!==m.enableSummary&&s(i,{})}),(null==e?void 0:e.summaryAfter)||null]}))]})})}}])}();return I}var y={root:"DinoFilterBar-root",inner:"DinoFilterBar-inner"},j=m(f)(function(e){var n=e.theme;return t(t({},"&.".concat(y.root),{backgroundColor:n.palette.background.paper}),".".concat(y.inner),{display:"flex",alignItems:"center",gap:n.spacing(1)})});export{S as createFilterBar};
 //# sourceMappingURL=index.create.js.map

package/dist/src/filter-bar/index.create.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.create.js","sources":["../../../src/filter-bar/index.create.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { Component } from 'react'\r\nimport { Box, BoxProps, styled } from '@mui/material'\r\nimport { createFilterBarContext } from './index.context'\r\nimport { createFilterSort } from './components/filter-sort'\r\nimport { createFilterMenu } from './components/filter-menu'\r\nimport { createFilterInput } from './components/filter-input'\r\nimport { createFilterSummary } from './components/filter-summary'\r\n// types\r\nimport type { ComponentType } from 'react'\r\nimport type { TFilterState } from './types'\r\nimport type { IFilterBarContext, IFilterBarContextState } from './index.context'\r\nimport type { IFilterMenuConfig, IFilterMenuProps } from './components/filter-menu.types'\r\nimport type { IFilterSortConfig, IFilterSortProps } from './components/filter-sort.types'\r\nimport type { IFilterInputConfig, IFilterInputProps } from './components/filter-input.types'\r\nimport type { IFilterSummaryConfig, IFilterSummaryProps } from './components/filter-summary.types'\r\nimport { fetchDelay } from '../utils'\r\n\r\nexport interface IFilterBarConfigs<T> {\r\n  initialFilterState?: TFilterState<T>\r\n  /** Default filter logic, can be overridden by individual filters @default \"and\" */\r\n  defaultFilterLogic?: 'and' | 'or'\r\n  InputComponent?: ComponentType<IFilterInputProps<T>>\r\n  inputConfig?: IFilterInputConfig<T>\r\n  MenuComponent?: ComponentType<IFilterMenuProps<T>>\r\n  menuConfig?: IFilterMenuConfig<T>\r\n  sortConfig?: IFilterSortConfig<T>\r\n  SortComponent?: ComponentType<IFilterSortProps<T>>\r\n  /** Enable or disable the summary component. Default is true. */\r\n  enableSummary?: boolean\r\n  SummaryComponent?: ComponentType<IFilterSummaryProps<T>>\r\n  summaryConfig?: IFilterSummaryConfig<T>\r\n}\r\n\r\nexport interface IFilterBarSlots {\r\n  summaryWrapProps?: BoxProps\r\n  summaryBefore?: React.ReactNode\r\n  summaryAfter?: React.ReactNode\r\n  before?: React.ReactNode\r\n  after?: React.ReactNode\r\n}\r\n\r\nexport interface IFilterBarProps<T> {\r\n  sx?: BoxProps['sx']\r\n  value?: TFilterState<T>\r\n  onChange?: (state: TFilterState<T>) => Promise<void> | void\r\n  slots?: IFilterBarSlots\r\n}\r\n\r\ninterface IFilterBarState<T> extends IFilterBarContextState<T> {}\r\n\r\nexport function createFilterBar<T>(configs: IFilterBarConfigs<T>) {\r\n  if (!configs.InputComponent) {\r\n    const configInput = configs.inputConfig || { fields: {} }\r\n    configs.inputConfig = configInput\r\n    configs.InputComponent = createFilterInput<T>(configInput)\r\n  }\r\n  if (!configs.MenuComponent) {\r\n    const configMenu = configs.menuConfig || { fields: {} }\r\n    configs.menuConfig = configMenu\r\n    configs.MenuComponent = createFilterMenu<T>(configMenu)\r\n  }\r\n  if (!configs.SummaryComponent && configs.enableSummary !== false) {\r\n    const configSummary: IFilterSummaryConfig<T> = configs.summaryConfig || { fields: {} }\r\n    configs.summaryConfig = configSummary\r\n    configs.SummaryComponent = createFilterSummary<T>(configSummary)\r\n  }\r\n  if (!configs.SortComponent) {\r\n    const configSort: IFilterSortConfig<T> = configs.sortConfig || { fields: {} }\r\n    configs.sortConfig = configSort\r\n    configs.SortComponent = createFilterSort<T>(configSort)\r\n  }\r\n\r\n  const defaultFilterLogic = configs.defaultFilterLogic || 'and'\r\n  const Context = createFilterBarContext<T>()\r\n\r\n  class FilterBar extends Component<IFilterBarProps<T>, IFilterBarState<T>> implements IFilterBarContext<T> {\r\n    constructor(props: IFilterBarProps<T>) {\r\n      super(props)\r\n      this.state = this.getInitialFilterState()\r\n    }\r\n\r\n    getInitialFilterState(): IFilterBarState<T> {\r\n      if (this.props.value) return { filterState: this.props.value }\r\n      return { filterState: Object.assign({ filterLogic: defaultFilterLogic }, configs.initialFilterState) }\r\n    }\r\n\r\n    get filterState(): TFilterState<T> {\r\n      return this.props.value || this.state.filterState\r\n    }\r\n\r\n    get isLoading(): boolean {\r\n      return this.state.isLoading || false\r\n    }\r\n\r\n    handleChange = async (filterState: TFilterState<T>, state?: Partial<IFilterBarState<T>>) => {\r\n      try {\r\n        this.setState((prev) => ({ filterState: state?.filterState ?? prev.filterState, isLoading: true }))\r\n        await fetchDelay(async () => this.props.onChange?.(filterState), 500)\r\n        this.setState({ isLoading: false })\r\n      } catch (error) {\r\n        this.setState({ isLoading: false })\r\n        throw error\r\n      }\r\n    }\r\n\r\n    setFilterState = (state: TFilterState<T>) => {\r\n      if (this.props.value) {\r\n        this.handleChange(state)\r\n        return\r\n      }\r\n      this.handleChange(state, { filterState: state })\r\n    }\r\n\r\n    onAddFilter = () => {\r\n      // TODO: add filter to filterState\r\n      console.log('Add filter')\r\n    }\r\n\r\n    onAddRemove = () => {\r\n      // TODO: remove filter from filterState\r\n      console.log('Remove filter')\r\n    }\r\n\r\n    render() {\r\n      const { slots } = this.props\r\n      const InputComponent = configs.InputComponent as ComponentType<IFilterInputProps<T>>\r\n      const MenuComponent = configs.MenuComponent as ComponentType<IFilterMenuProps<T>>\r\n      const SummaryComponent = configs.SummaryComponent as ComponentType<IFilterSummaryProps<T>>\r\n      const SortComponent = configs.SortComponent as ComponentType<IFilterSortProps<T>>\r\n      return (\r\n        <Context.Provider value={this}>\r\n          <FilterBarStyled className={filterbarClasses.root} sx={this.props.sx}>\r\n            <div className={filterbarClasses.inner}>\r\n              {slots?.before || null}\r\n              <MenuComponent slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n              <SortComponent slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n              <InputComponent onAdd={this.onAddFilter} slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n              {slots?.after || null}\r\n            </div>\r\n            <Box {...slots?.summaryWrapProps} sx={{ display: 'flex', alignItems: 'center', ...slots?.summaryWrapProps?.sx }}>\r\n              {slots?.summaryBefore || null}\r\n              <Box sx={{ flex: 1, minWidth: 0 }}>{configs.enableSummary !== false && <SummaryComponent />}</Box>\r\n              {slots?.summaryAfter || null}\r\n            </Box>\r\n          </FilterBarStyled>\r\n          {/* <Box style={{ border: '1px solid red', marginTop: '16px', padding: '8px' }}>\r\n            <Typography variant='subtitle2'>For Debug - Current Filter State:</Typography>\r\n            <pre>{JSON.stringify(this.filterState, null, 2)}</pre>\r\n          </Box> */}\r\n        </Context.Provider>\r\n      )\r\n    }\r\n  }\r\n\r\n  return FilterBar\r\n}\r\n\r\nconst filterbarClasses = {\r\n  root: 'DinoFilterBar-root',\r\n  inner: 'DinoFilterBar-inner'\r\n}\r\n\r\nconst FilterBarStyled = styled(Box)(({ theme }) => ({\r\n  [`&.${filterbarClasses.root}`]: {\r\n    backgroundColor: theme.palette.background.paper\r\n  },\r\n  [`.${filterbarClasses.inner}`]: {\r\n    display: 'flex',\r\n    alignItems: 'center',\r\n    gap: theme.spacing(1)\r\n  }\r\n}))\r\n"],"names":["createFilterBar","configs","InputComponent","configInput","inputConfig","fields","createFilterInput","MenuComponent","configMenu","menuConfig","createFilterMenu","SummaryComponent","enableSummary","configSummary","summaryConfig","createFilterSummary","SortComponent","configSort","sortConfig","createFilterSort","defaultFilterLogic","Context","createFilterBarContext","FilterBar","props","_this","_classCallCheck","_callSuper","_defineProperty","_ref","_asyncToGenerator","_regenerator","m","_callee2","filterState","state","_t","w","_context2","p","n","setState","prev","_state$filterState","isLoading","fetchDelay","_callee","_this$props$onChange","_this$props","_context","a","onChange","call","v","_x","_x2","apply","this","arguments","value","handleChange","console","log","getInitialFilterState","_inherits","Component","_createClass","key","Object","assign","filterLogic","initialFilterState","get","_slots$summaryWrapPro","slots","_jsx","Provider","children","_jsxs","FilterBarStyled","className","filterbarClasses","root","sx","inner","before","popperProps","placement","onAdd","onAddFilter","after","Box","_objectSpread","summaryWrapProps","display","alignItems","summaryBefore","flex","minWidth","summaryAfter","styled","_ref3","theme","concat","backgroundColor","palette","background","paper","gap","spacing"],"mappings":"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"}
+{"version":3,"file":"index.create.js","sources":["../../../src/filter-bar/index.create.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { Component } from 'react'\r\nimport { Box, BoxProps, styled } from '@mui/material'\r\nimport { createFilterBarContext } from './index.context'\r\nimport { createFilterSort } from './components/filter-sort'\r\nimport { createFilterMenu } from './components/filter-menu'\r\nimport { createFilterInput } from './components/filter-input'\r\nimport { createFilterSummary } from './components/filter-summary'\r\n// types\r\nimport type { ComponentType } from 'react'\r\nimport type { TFilterState } from './types'\r\nimport type { IFilterBarContext, IFilterBarContextState } from './index.context'\r\nimport type { IFilterMenuConfig, IFilterMenuProps } from './components/filter-menu.types'\r\nimport type { IFilterSortConfig, IFilterSortProps } from './components/filter-sort.types'\r\nimport type { IFilterInputConfig, IFilterInputProps } from './components/filter-input.types'\r\nimport type { IFilterSummaryConfig, IFilterSummaryProps } from './components/filter-summary.types'\r\nimport { fetchDelay } from '../utils'\r\n\r\nexport interface IFilterBarConfigs<T> {\r\n  initialFilterState?: TFilterState<T>\r\n  /** Default filter logic, can be overridden by individual filters @default \"and\" */\r\n  defaultFilterLogic?: 'and' | 'or'\r\n  InputComponent?: ComponentType<IFilterInputProps<T>>\r\n  inputConfig?: IFilterInputConfig<T>\r\n  MenuComponent?: ComponentType<IFilterMenuProps<T>>\r\n  menuConfig?: IFilterMenuConfig<T>\r\n  sortConfig?: IFilterSortConfig<T>\r\n  SortComponent?: ComponentType<IFilterSortProps<T>>\r\n  /** Enable or disable the summary component. Default is true. */\r\n  enableSummary?: boolean\r\n  SummaryComponent?: ComponentType<IFilterSummaryProps<T>>\r\n  summaryConfig?: IFilterSummaryConfig<T>\r\n}\r\n\r\nexport interface IFilterBarSlots {\r\n  summaryWrapProps?: BoxProps\r\n  summaryBefore?: React.ReactNode\r\n  summaryAfter?: React.ReactNode\r\n  before?: React.ReactNode\r\n  after?: React.ReactNode\r\n}\r\n\r\nexport interface IFilterBarProps<T> {\r\n  sx?: BoxProps['sx']\r\n  value?: TFilterState<T>\r\n  onChange?: (state: TFilterState<T>) => Promise<void> | void\r\n  slots?: IFilterBarSlots\r\n}\r\n\r\ninterface IFilterBarState<T> extends IFilterBarContextState<T> {}\r\n\r\nexport function createFilterBar<T>(configs: IFilterBarConfigs<T>) {\r\n  if (!configs.InputComponent) {\r\n    const configInput = configs.inputConfig || { fields: {} }\r\n    configs.inputConfig = configInput\r\n    configs.InputComponent = createFilterInput<T>(configInput)\r\n  }\r\n  if (!configs.MenuComponent) {\r\n    const configMenu = configs.menuConfig || { fields: {} }\r\n    configs.menuConfig = configMenu\r\n    configs.MenuComponent = createFilterMenu<T>(configMenu)\r\n  }\r\n  if (!configs.SummaryComponent && configs.enableSummary !== false) {\r\n    const configSummary: IFilterSummaryConfig<T> = configs.summaryConfig || { fields: {} }\r\n    configs.summaryConfig = configSummary\r\n    configs.SummaryComponent = createFilterSummary<T>(configSummary)\r\n  }\r\n  if (!configs.SortComponent) {\r\n    const configSort: IFilterSortConfig<T> = configs.sortConfig || { fields: {} }\r\n    configs.sortConfig = configSort\r\n    configs.SortComponent = createFilterSort<T>(configSort)\r\n  }\r\n\r\n  const defaultFilterLogic = configs.defaultFilterLogic || 'and'\r\n  const Context = createFilterBarContext<T>()\r\n\r\n  class FilterBar extends Component<IFilterBarProps<T>, IFilterBarState<T>> implements IFilterBarContext<T> {\r\n    constructor(props: IFilterBarProps<T>) {\r\n      super(props)\r\n      this.state = this.getInitialFilterState()\r\n    }\r\n\r\n    getInitialFilterState(): IFilterBarState<T> {\r\n      if (this.props.value) return { filterState: this.props.value }\r\n      return { filterState: Object.assign({ filterLogic: defaultFilterLogic }, configs.initialFilterState) }\r\n    }\r\n\r\n    get filterState(): TFilterState<T> {\r\n      return this.props.value || this.state.filterState\r\n    }\r\n\r\n    get isLoading(): boolean {\r\n      return this.state.isLoading || false\r\n    }\r\n\r\n    handleChange = async (filterState: TFilterState<T>, state?: Partial<IFilterBarState<T>>) => {\r\n      try {\r\n        this.setState((prev) => ({ filterState: state?.filterState ?? prev.filterState, isLoading: true }))\r\n        await fetchDelay(async () => this.props.onChange?.(filterState), 500)\r\n        this.setState({ isLoading: false })\r\n      } catch (error) {\r\n        this.setState({ isLoading: false })\r\n        throw error\r\n      }\r\n    }\r\n\r\n    setFilterState = (state: TFilterState<T>) => {\r\n      if (this.props.value) {\r\n        this.handleChange(state)\r\n        return\r\n      }\r\n      this.handleChange(state, { filterState: state })\r\n    }\r\n\r\n    onAddFilter = () => {\r\n      // TODO: add filter to filterState\r\n      console.log('Add filter')\r\n    }\r\n\r\n    onAddRemove = () => {\r\n      // TODO: remove filter from filterState\r\n      console.log('Remove filter')\r\n    }\r\n\r\n    render() {\r\n      const { slots } = this.props\r\n      const InputComponent = configs.InputComponent as ComponentType<IFilterInputProps<T>>\r\n      const MenuComponent = configs.MenuComponent as ComponentType<IFilterMenuProps<T>>\r\n      const SummaryComponent = configs.SummaryComponent as ComponentType<IFilterSummaryProps<T>>\r\n      const SortComponent = configs.SortComponent as ComponentType<IFilterSortProps<T>>\r\n      return (\r\n        <Context.Provider value={this}>\r\n          <FilterBarStyled className={filterbarClasses.root} sx={this.props.sx}>\r\n            <div className={filterbarClasses.inner}>\r\n              {slots?.before || null}\r\n              <MenuComponent slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n              <SortComponent sx={{ mr: 1 }} slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n              <InputComponent onAdd={this.onAddFilter} slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n              {slots?.after || null}\r\n            </div>\r\n            <Box {...slots?.summaryWrapProps} sx={{ display: 'flex', alignItems: 'center', ...slots?.summaryWrapProps?.sx }}>\r\n              {slots?.summaryBefore || null}\r\n              <Box sx={{ flex: 1, minWidth: 0 }}>{configs.enableSummary !== false && <SummaryComponent />}</Box>\r\n              {slots?.summaryAfter || null}\r\n            </Box>\r\n          </FilterBarStyled>\r\n          {/* <Box style={{ border: '1px solid red', marginTop: '16px', padding: '8px' }}>\r\n            <Typography variant='subtitle2'>For Debug - Current Filter State:</Typography>\r\n            <pre>{JSON.stringify(this.filterState, null, 2)}</pre>\r\n          </Box> */}\r\n        </Context.Provider>\r\n      )\r\n    }\r\n  }\r\n\r\n  return FilterBar\r\n}\r\n\r\nconst filterbarClasses = {\r\n  root: 'DinoFilterBar-root',\r\n  inner: 'DinoFilterBar-inner'\r\n}\r\n\r\nconst FilterBarStyled = styled(Box)(({ theme }) => ({\r\n  [`&.${filterbarClasses.root}`]: {\r\n    backgroundColor: theme.palette.background.paper\r\n  },\r\n  [`.${filterbarClasses.inner}`]: {\r\n    display: 'flex',\r\n    alignItems: 'center',\r\n    gap: theme.spacing(1)\r\n  }\r\n}))\r\n"],"names":["createFilterBar","configs","InputComponent","configInput","inputConfig","fields","createFilterInput","MenuComponent","configMenu","menuConfig","createFilterMenu","SummaryComponent","enableSummary","configSummary","summaryConfig","createFilterSummary","SortComponent","configSort","sortConfig","createFilterSort","defaultFilterLogic","Context","createFilterBarContext","FilterBar","props","_this","_classCallCheck","_callSuper","_defineProperty","_ref","_asyncToGenerator","_regenerator","m","_callee2","filterState","state","_t","w","_context2","p","n","setState","prev","_state$filterState","isLoading","fetchDelay","_callee","_this$props$onChange","_this$props","_context","a","onChange","call","v","_x","_x2","apply","this","arguments","value","handleChange","console","log","getInitialFilterState","_inherits","Component","_createClass","key","Object","assign","filterLogic","initialFilterState","get","_slots$summaryWrapPro","slots","_jsx","Provider","children","_jsxs","FilterBarStyled","className","filterbarClasses","root","sx","inner","before","popperProps","placement","mr","onAdd","onAddFilter","after","Box","_objectSpread","summaryWrapProps","display","alignItems","summaryBefore","flex","minWidth","summaryAfter","styled","_ref3","theme","concat","backgroundColor","palette","background","paper","gap","spacing"],"mappings":"+vBAqDM,SAAUA,EAAmBC,GACjC,IAAKA,EAAQC,eAAgB,CAC3B,IAAMC,EAAcF,EAAQG,aAAe,CAAEC,OAAQ,CAAA,GACrDJ,EAAQG,YAAcD,EACtBF,EAAQC,eAAiBI,EAAqBH,EAC/C,CACD,IAAKF,EAAQM,cAAe,CAC1B,IAAMC,EAAaP,EAAQQ,YAAc,CAAEJ,OAAQ,CAAA,GACnDJ,EAAQQ,WAAaD,EACrBP,EAAQM,cAAgBG,EAAoBF,EAC7C,CACD,IAAKP,EAAQU,mBAA8C,IAA1BV,EAAQW,cAAyB,CAChE,IAAMC,EAAyCZ,EAAQa,eAAiB,CAAET,OAAQ,CAAA,GAClFJ,EAAQa,cAAgBD,EACxBZ,EAAQU,iBAAmBI,EAAuBF,EACnD,CACD,IAAKZ,EAAQe,cAAe,CAC1B,IAAMC,EAAmChB,EAAQiB,YAAc,CAAEb,OAAQ,CAAA,GACzEJ,EAAQiB,WAAaD,EACrBhB,EAAQe,cAAgBG,EAAoBF,EAC7C,CAED,IAAMG,EAAqBnB,EAAQmB,oBAAsB,MACnDC,EAAUC,IAEVC,aACJ,SAAAA,EAAYC,GAAyB,IAAAC,EAEM,OAFNC,OAAAH,GACnCE,EAAAE,EAAAJ,KAAAA,GAAMC,IAAMI,EAAAH,EAAA,eAAA,WAAA,IAAAI,EAAAC,EAAAC,IAAAC,EAiBC,SAAAC,EAAOC,EAA8BC,GAAmC,IAAAC,EAAA,OAAAL,IAAAM,EAAA,SAAAC,GAAA,cAAAA,EAAAC,EAAAD,EAAAE,GAAA,KAAA,EAEgB,OAFhBF,EAAAC,EAAA,EAEnFd,EAAKgB,SAAS,SAACC,GAAI,IAAAC,EAAA,MAAM,CAAET,oBAAWS,EAAER,aAAAA,EAAAA,EAAOD,mBAAW,IAAAS,EAAAA,EAAID,EAAKR,YAAaU,WAAW,EAAM,GAAEN,EAAAE,EAAA,EAC7FK,EAAUf,EAAAC,IAAAC,EAAC,SAAAc,IAAA,IAAAC,EAAAC,EAAA,OAAAjB,IAAAM,EAAA,SAAAY,GAAA,UAAA,IAAAA,EAAAT,EAAA,OAAAS,EAAAC,EAAAH,EAA+B,QAA/BA,GAAYC,EAAAvB,EAAKD,OAAM2B,gBAAQ,IAAAJ,OAAA,EAAnBA,EAAAK,KAAAJ,EAAsBd,GAAY,EAAAY,EAAA,IAAE,KAAI,KAAA,EACrErB,EAAKgB,SAAS,CAAEG,WAAW,IAAQN,EAAAE,EAAA,EAAA,MAAA,KAAA,EAEA,MAFAF,EAAAC,EAAA,EAAAH,EAAAE,EAAAe,EAEnC5B,EAAKgB,SAAS,CAAEG,WAAW,IAAQR,EAAA,KAAA,EAAA,OAAAE,EAAAY,EAAA,GAAA,EAAAjB,EAAA,KAAA,CAAA,CAAA,EAAA,QAGtC,OAAAqB,SAAAA,EAAAC,GAAA,OAAA1B,EAAA2B,MAAAC,KAAAC,UAAA,CAAA,CA1Ba,IA0Bb9B,EAAAH,EAEgB,iBAAA,SAACU,GACZV,EAAKD,MAAMmC,MACblC,EAAKmC,aAAazB,GAGpBV,EAAKmC,aAAazB,EAAO,CAAED,YAAaC,MACzCP,EAAAH,EAAA,cAEa,WAEZoC,QAAQC,IAAI,gBACblC,EAAAH,EAAA,cAEa,WAEZoC,QAAQC,IAAI,mBA1CZrC,EAAKU,MAAQV,EAAKsC,wBAAuBtC,CAC3C,CAAC,OAAAuC,EAAAzC,EAJqB0C,GAIrBC,EAAA3C,EAAA,CAAA,CAAA4C,IAAA,wBAAAR,MAED,WACE,OAAIF,KAAKjC,MAAMmC,MAAc,CAAEzB,YAAauB,KAAKjC,MAAMmC,OAChD,CAAEzB,YAAakC,OAAOC,OAAO,CAAEC,YAAalD,GAAsBnB,EAAQsE,oBACnF,GAAC,CAAAJ,IAAA,cAAAK,IAED,WACE,OAAOf,KAAKjC,MAAMmC,OAASF,KAAKtB,MAAMD,WACxC,GAAC,CAAAiC,IAAA,YAAAK,IAED,WACE,OAAOf,KAAKtB,MAAMS,YAAa,CACjC,GAAC,CAAAuB,IAAA,SAAAR,MA+BD,WAAM,IAAAc,EACIC,EAAUjB,KAAKjC,MAAfkD,MACFxE,EAAiBD,EAAQC,eACzBK,EAAgBN,EAAQM,cACxBI,EAAmBV,EAAQU,iBAC3BK,EAAgBf,EAAQe,cAC9B,OACE2D,EAACtD,EAAQuD,SAAQ,CAACjB,MAAOF,KACvBoB,SAAAC,EAACC,EAAgB,CAAAC,UAAWC,EAAiBC,KAAMC,GAAI1B,KAAKjC,MAAM2D,GAChEN,SAAA,CAAAC,EAAA,MAAA,CAAKE,UAAWC,EAAiBG,MAAKP,SAAA,EACnCH,aAAAA,EAAAA,EAAOW,SAAU,KAClBV,EAACpE,EAAa,CAACmE,MAAO,CAAEY,YAAa,CAAEC,UAAW,mBAClDZ,EAAC3D,EAAa,CAACmE,GAAI,CAAEK,GAAI,GAAKd,MAAO,CAAEY,YAAa,CAAEC,UAAW,mBACjEZ,EAACzE,GAAeuF,MAAOhC,KAAKiC,YAAahB,MAAO,CAAEY,YAAa,CAAEC,UAAW,oBAC3Eb,aAAK,EAALA,EAAOiB,QAAS,QAEnBb,EAACc,EAAGC,EAAAA,EAAA,CAAA,EAAKnB,aAAAA,EAAAA,EAAOoB,kBAAgB,CAAA,EAAA,CAAEX,GAAEU,EAAA,CAAIE,QAAS,OAAQC,WAAY,UAAatB,iBAAKD,EAALC,EAAOoB,wBAAgB,IAAArB,OAAA,EAAvBA,EAAyBU,IAAIN,SAAA,EAC5GH,aAAAA,EAAAA,EAAOuB,gBAAiB,KACzBtB,EAACiB,EAAG,CAACT,GAAI,CAAEe,KAAM,EAAGC,SAAU,GAAMtB,UAA0B,IAA1B5E,EAAQW,eAA2B+D,EAAChE,EAAmB,CAAA,MAC1F+D,aAAK,EAALA,EAAO0B,eAAgB,aASlC,IAAC,IAGH,OAAO7E,CACT,CAEA,IAAM0D,EAAmB,CACvBC,KAAM,qBACNE,MAAO,uBAGHL,EAAkBsB,EAAOT,EAAPS,CAAY,SAAAC,GAAA,IAAGC,EAAKD,EAALC,MAAK,OAAA3E,EAAAA,EAAA,CAAA,EAAA,KAAA4E,OACpCvB,EAAiBC,MAAS,CAC9BuB,gBAAiBF,EAAMG,QAAQC,WAAWC,YAC3CJ,OACIvB,EAAiBG,OAAU,CAC9BW,QAAS,OACTC,WAAY,SACZa,IAAKN,EAAMO,QAAQ,IACpB"}

package/dist/src/filter-bar/index.dino.js

@@ -1,2 +1,2 @@
-import{createClass as r,classCallCheck as e,defineProperty as t}from"../../_virtual/_rollupPluginBabelHelpers.js";import{createConvertToGraphQL as a,mapLogic as i,mapSortDirection as o}from"./convert-to-graphql.js";import{createFilterBar as s}from"./index.create.js";var l=r(function r(){e(this,r),t(this,"createFilterBar",s),t(this,"createConvertToGraphQL",a),t(this,"mapLogic",i),t(this,"mapDirection",o)}),p=new l;export{l as DinoFilterBar,p as dinoFilterBar};
+import{createClass as e,classCallCheck as t,defineProperty as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{createConvertToGraphQL as i,mapLogic as s,mapSortDirection as a}from"./convert-to-graphql.js";import{removeNullValues as o,isFilterStateEqual as l,setFilterToURL as h,getFilterFromURL as p}from"./helpers.js";import{createFilterBar as m}from"./index.create.js";var c=e(function e(){t(this,e),r(this,"createFilterBar",m),r(this,"createConvertToGraphQL",i),r(this,"mapLogic",s),r(this,"mapDirection",a),r(this,"removeNullValues",o),r(this,"isFilterStateEqual",l),r(this,"setFilterToURL",h),r(this,"getFilterFromURL",p)}),n=new c;export{c as DinoFilterBar,n as dinoFilterBar};
 //# sourceMappingURL=index.dino.js.map

package/dist/src/filter-bar/index.dino.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.dino.js","sources":["../../../src/filter-bar/index.dino.tsx"],"sourcesContent":["import { createConvertToGraphQL, mapLogic, mapSortDirection } from './convert-to-graphql'\r\nimport { createFilterBar } from './index.create'\r\n\r\nexport class DinoFilterBar {\r\n  createFilterBar = createFilterBar as typeof createFilterBar\r\n  createConvertToGraphQL = createConvertToGraphQL as typeof createConvertToGraphQL\r\n\r\n  // support\r\n  mapLogic = mapLogic\r\n  mapDirection = mapSortDirection\r\n}\r\n\r\nexport const dinoFilterBar = new DinoFilterBar()\r\n"],"names":["DinoFilterBar","_createClass","_classCallCheck","_defineProperty","createFilterBar","createConvertToGraphQL","mapLogic","mapSortDirection","dinoFilterBar"],"mappings":"2QAGA,IAAaA,EAAaC,EAAA,SAAAD,IAAAE,OAAAF,GAAAG,yBACNC,GAAyCD,gCAClCE,GAEzBF,kBACWG,GAAQH,sBACJI,EAAgB,GAGpBC,EAAgB,IAAIR"}
+{"version":3,"file":"index.dino.js","sources":["../../../src/filter-bar/index.dino.tsx"],"sourcesContent":["import { createConvertToGraphQL, mapLogic, mapSortDirection } from './convert-to-graphql'\r\nimport { getFilterFromURL, isFilterStateEqual, removeNullValues, setFilterToURL } from './helpers'\r\nimport { createFilterBar } from './index.create'\r\n\r\nexport class DinoFilterBar {\r\n  createFilterBar = createFilterBar as typeof createFilterBar\r\n  createConvertToGraphQL = createConvertToGraphQL as typeof createConvertToGraphQL\r\n\r\n  // support\r\n  mapLogic = mapLogic\r\n  mapDirection = mapSortDirection\r\n\r\n  // helpers\r\n  removeNullValues = removeNullValues\r\n  isFilterStateEqual = isFilterStateEqual\r\n  setFilterToURL = setFilterToURL\r\n  getFilterFromURL = getFilterFromURL\r\n}\r\n\r\nexport const dinoFilterBar = new DinoFilterBar()\r\n"],"names":["DinoFilterBar","_createClass","_classCallCheck","_defineProperty","createFilterBar","createConvertToGraphQL","mapLogic","mapSortDirection","removeNullValues","isFilterStateEqual","setFilterToURL","getFilterFromURL","dinoFilterBar"],"mappings":"6XAIA,IAAaA,EAAaC,EAAA,SAAAD,IAAAE,OAAAF,GAAAG,yBACNC,GAAyCD,gCAClCE,GAEzBF,kBACWG,GAAQH,sBACJI,GAEfJ,0BACmBK,GAAgBL,4BACdM,GAAkBN,wBACtBO,GAAcP,0BACZQ,EAAgB,GAGxBC,EAAgB,IAAIZ"}

package/dist/src/form/modal-wrapper.js

@@ -1,2 +1,2 @@
-import{defineProperty as o,objectSpread2 as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as e,jsx as i,Fragment as t}from"react/jsx-runtime";import{styled as r,Paper as n,IconButton as a,Box as s,Typography as p}from"@mui/material";import c from"@mui/icons-material/Close";import{mapGlobalModalContext as d}from"../api-context/global-modal.js";var x=function(o){return d(function(r){var n,a,d,x,v=[u.root,null===(n=o.slots)||void 0===n||null===(n=n.wrapProps)||void 0===n?void 0:n.className];return o.fullHeight&&v.push(u.fullHeight),e(f,l(l({size:o.size},null===(a=o.slots)||void 0===a?void 0:a.wrapProps),{},{className:v.filter(Boolean).join(" "),children:[e(m,{sx:null===(d=o.slots)||void 0===d?void 0:d.sxTopbarProps,children:[(null===(x=o.slots)||void 0===x?void 0:x.beforeTitle)&&e(t,{children:[o.slots.beforeTitle,i(s,{flex:1})]}),i(p,{component:"h3",variant:"subtitle1",sx:{mt:"2px",ml:"8px",fontWeight:700},children:o.title}),i(s,{flex:1}),i(h,{onClick:function(){o.onCloseClick&&o.onCloseClick(),r.close()},children:i(c,{})})]}),i("div",{className:u.content,children:o.children})]}))})},u={root:"Dino-ModalWrapper-root",content:"Dino-ModalWrapper-content",fullHeight:"Dino-ModalWrapper-fullHeight"},f=r(n)(function(l){var e=l.theme,i=l.size;return o(o(o({maxHeight:"calc(100vh - 24px)",overflow:"hidden",display:"flex",flexDirection:"column",position:"relative",maxWidth:"calc(100vw - 24px)",width:e.breakpoints.values[null!=i?i:"lg"]},e.breakpoints.down("sm"),{width:"calc(100vw - 24px)"}),"&.".concat(u.fullHeight),{height:"calc(100vh - 24px)"}),".".concat(u.content),{overflowY:"auto",flex:"1 1 auto",minHeight:0})}),h=r(a)({flex:"0 0 auto",color:"#3c3c3c","& svg":{transition:"all 0.2s"},"&:hover svg":{color:"#ff200c"}}),m=r(s)({display:"flex",alignItems:"center",padding:"0 8px 0 8px",gap:"6px",flex:"0 0 auto",boxShadow:"rgba(145, 158, 171, 0.1) 0px 0px 2px 0px,rgba(145, 158, 171, 0.12) 0px 0px 24px -4px",height:"48px"});export{x as default};
+import{defineProperty as o,objectSpread2 as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as e,jsx as i,Fragment as t}from"react/jsx-runtime";import{styled as r,Paper as n,IconButton as a,colors as s,Box as c,Tooltip as p,Typography as d}from"@mui/material";import u from"@mui/icons-material/Close";import v from"@mui/icons-material/ChevronLeft";import{mapGlobalModalContext as m}from"../api-context/global-modal.js";var f=function(o){return m(function(r){var n,a,s,m,f,w,C,k,H,P,z,j=[h.root,null===(n=o.slots)||void 0===n||null===(n=n.wrapProps)||void 0===n?void 0:n.className];o.fullHeight&&j.push(h.fullHeight);var S,W=[h.topBar,null===(a=o.slots)||void 0===a||null===(a=a.topBarProps)||void 0===a?void 0:a.className].filter(Boolean).join(" ");return e(x,l(l({size:o.size},null===(s=o.slots)||void 0===s?void 0:s.wrapProps),{},{className:j.filter(Boolean).join(" "),children:[e(B,l(l({},null===(m=o.slots)||void 0===m?void 0:m.topBarProps),{},{className:W,children:[Boolean(o.enableBackButton)&&i(p,{title:"Back",placement:"top",arrow:!0,children:i(b,l(l({onClick:o.onBackClick},null===(f=o.slots)||void 0===f?void 0:f.iconBackProps),{},{children:i(v,{fontSize:null!==(w=null===(C=o.slots)||void 0===C?void 0:C.iconSize)&&void 0!==w?w:"medium"})}))}),(null===(k=o.slots)||void 0===k?void 0:k.beforeTitle)&&e(t,{children:[o.slots.beforeTitle,i(c,{flex:1})]}),(S=o.title,"string"==typeof S?i(d,{component:"h3",variant:"subtitle1",sx:{mt:"2px",ml:"8px",fontWeight:700},children:S}):S),i(c,{flex:1}),!1!==o.enableCloseButton&&i(p,{title:"Close",placement:"top",arrow:!0,children:i(g,l(l({onClick:function(l){o.onCloseClick&&o.onCloseClick(l),r.close()}},null===(H=o.slots)||void 0===H?void 0:H.iconCloseProps),{},{children:i(u,{fontSize:null!==(P=null===(z=o.slots)||void 0===z?void 0:z.iconSize)&&void 0!==P?P:"medium"})}))})]})),i("div",{className:h.content,children:o.children})]}))})},h={root:"Dino-ModalWrapper-root",topBar:"Dino-ModalWrapper-topBar",content:"Dino-ModalWrapper-content",fullHeight:"Dino-ModalWrapper-fullHeight"},x=r(n)(function(l){var e=l.theme,i=l.size;return o(o(o({maxHeight:"calc(100vh - 24px)",overflow:"hidden",display:"flex",flexDirection:"column",position:"relative",maxWidth:"calc(100vw - 24px)",width:e.breakpoints.values[null!=i?i:"lg"]},e.breakpoints.down("sm"),{width:"calc(100vw - 24px)"}),"&.".concat(h.fullHeight),{height:"calc(100vh - 24px)"}),".".concat(h.content),{overflowY:"auto",flex:"1 1 auto",minHeight:0})}),g=r(a)({flex:"0 0 auto",color:"#3c3c3c","& svg":{transition:"all 0.2s"},"&:hover svg":{color:s.red[600],transform:"rotate(90deg)"}}),b=r(a)({flex:"0 0 auto",color:"#3c3c3c","& svg":{transition:"all 0.2s"},"&:hover svg":{color:s.blue[600],transform:"scale(1.2)"}}),B=r(c)(function(o){return{height:"var(--dino-h-top-bar, 48px)",display:"flex",alignItems:"center",padding:o.theme.spacing(0,1),flex:"0 0 auto",boxShadow:"rgba(145, 158, 171, 0.1) 0px 0px 2px 0px,rgba(145, 158, 171, 0.12) 0px 0px 24px -4px"}});export{f as default};
 //# sourceMappingURL=modal-wrapper.js.map

package/dist/src/form/modal-wrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal-wrapper.js","sources":["../../../src/form/modal-wrapper.tsx"],"sourcesContent":["import React, { ComponentType, FC, Fragment, PropsWithChildren } from 'react'\r\nimport { Box, Breakpoint, IconButton, Paper, PaperProps, styled, SxProps, Theme, Typography } from '@mui/material'\r\nimport CloseIcon from '@mui/icons-material/Close'\r\nimport { mapGlobalModalContext } from '../api-context'\r\n\r\nexport interface IFormModalWrapperProps extends PropsWithChildren {\r\n  title: string\r\n  size?: Breakpoint\r\n  fullHeight?: boolean\r\n  onCloseClick?: () => void\r\n  slots?: {\r\n    wrapProps?: Partial<PaperProps>\r\n    sxTopbarProps?: SxProps<Theme>\r\n    beforeTitle?: JSX.Element\r\n  }\r\n}\r\n\r\nconst FormModalWrapper: FC<IFormModalWrapperProps> = (props) => {\r\n  return mapGlobalModalContext((context) => {\r\n    const rootClasses = [modalWrapperClasses.root, props.slots?.wrapProps?.className]\r\n    if (props.fullHeight) rootClasses.push(modalWrapperClasses.fullHeight)\r\n    return (\r\n      <ModalWrapperStyled size={props.size} {...props.slots?.wrapProps} className={rootClasses.filter(Boolean).join(' ')}>\r\n        <TopBar sx={props.slots?.sxTopbarProps}>\r\n          {props.slots?.beforeTitle && (\r\n            <>\r\n              {props.slots.beforeTitle}\r\n              <Box flex={1} />\r\n            </>\r\n          )}\r\n          <Typography component='h3' variant='subtitle1' sx={{ mt: '2px', ml: '8px', fontWeight: 700 }}>\r\n            {props.title}\r\n          </Typography>\r\n          <Box flex={1} />\r\n          <BtnClose\r\n            onClick={() => {\r\n              props.onCloseClick && props.onCloseClick()\r\n              context.close()\r\n            }}\r\n          >\r\n            <CloseIcon />\r\n          </BtnClose>\r\n        </TopBar>\r\n        <div className={modalWrapperClasses.content}>{props.children}</div>\r\n      </ModalWrapperStyled>\r\n    )\r\n  })\r\n}\r\nexport default FormModalWrapper\r\n\r\nconst modalWrapperClasses = {\r\n  root: 'Dino-ModalWrapper-root',\r\n  content: 'Dino-ModalWrapper-content',\r\n  fullHeight: 'Dino-ModalWrapper-fullHeight'\r\n}\r\n\r\nconst ModalWrapperStyled = styled(Paper)<{ size?: Breakpoint }>(({ theme, size }) => ({\r\n  maxHeight: 'calc(100vh - 24px)',\r\n  overflow: 'hidden',\r\n  display: 'flex',\r\n  flexDirection: 'column',\r\n  position: 'relative',\r\n  maxWidth: 'calc(100vw - 24px)',\r\n  width: theme.breakpoints.values[size ?? 'lg'],\r\n  [theme.breakpoints.down('sm')]: { width: 'calc(100vw - 24px)' },\r\n  [`&.${modalWrapperClasses.fullHeight}`]: {\r\n    height: 'calc(100vh - 24px)'\r\n  },\r\n  [`.${modalWrapperClasses.content}`]: {\r\n    overflowY: 'auto',\r\n    flex: '1 1 auto',\r\n    minHeight: 0\r\n  }\r\n}))\r\n\r\nconst BtnClose = styled(IconButton)({\r\n  flex: '0 0 auto',\r\n  color: '#3c3c3c',\r\n  '& svg': { transition: 'all 0.2s' },\r\n  '&:hover svg': { color: '#ff200c' }\r\n})\r\n\r\nconst TopBar = styled(Box)({\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  padding: '0 8px 0 8px',\r\n  gap: '6px',\r\n  flex: '0 0 auto',\r\n  boxShadow: 'rgba(145, 158, 171, 0.1) 0px 0px 2px 0px,rgba(145, 158, 171, 0.12) 0px 0px 24px -4px',\r\n  height: '48px'\r\n})\r\n"],"names":["FormModalWrapper","props","mapGlobalModalContext","context","_props$slots","_props$slots2","_props$slots3","_props$slots4","rootClasses","modalWrapperClasses","root","slots","wrapProps","className","fullHeight","push","_jsxs","ModalWrapperStyled","_objectSpread","size","filter","Boolean","join","children","TopBar","sx","sxTopbarProps","beforeTitle","_Fragment","_jsx","Box","flex","Typography","component","variant","mt","ml","fontWeight","title","BtnClose","onClick","onCloseClick","close","CloseIcon","content","styled","Paper","_ref","theme","_defineProperty","maxHeight","overflow","display","flexDirection","position","maxWidth","width","breakpoints","values","down","concat","height","overflowY","minHeight","IconButton","color","transition","alignItems","padding","gap","boxShadow"],"mappings":"2WAiBA,IAAMA,EAA+C,SAACC,GACpD,OAAOC,EAAsB,SAACC,GAAW,IAAAC,EAAAC,EAAAC,EAAAC,EACjCC,EAAc,CAACC,EAAoBC,KAAiB,QAAbN,EAAEH,EAAMU,aAAKP,IAAAA,GAAWA,QAAXA,EAAXA,EAAaQ,iBAAbR,IAAsBA,OAAtBA,EAAAA,EAAwBS,WAEvE,OADIZ,EAAMa,YAAYN,EAAYO,KAAKN,EAAoBK,YAEzDE,EAACC,EAAkBC,EAAAA,EAAA,CAACC,KAAMlB,EAAMkB,cAAId,EAAMJ,EAAMU,aAAK,IAAAN,OAAA,EAAXA,EAAaO,WAAS,CAAA,EAAA,CAAEC,UAAWL,EAAYY,OAAOC,SAASC,KAAK,KAC5GC,SAAA,CAAAP,EAACQ,EAAM,CAACC,GAAe,QAAbnB,EAAEL,EAAMU,aAAK,IAAAL,OAAA,EAAXA,EAAaoB,yBACX,QAAXnB,EAAAN,EAAMU,aAAK,IAAAJ,OAAA,EAAXA,EAAaoB,cACZX,EAAAY,EAAA,CAAAL,SAAA,CACGtB,EAAMU,MAAMgB,YACbE,EAACC,EAAG,CAACC,KAAM,OAGfF,EAACG,EAAW,CAAAC,UAAU,KAAKC,QAAQ,YAAYT,GAAI,CAAEU,GAAI,MAAOC,GAAI,MAAOC,WAAY,cACpFpC,EAAMqC,QAETT,EAACC,EAAI,CAAAC,KAAM,IACXF,EAACU,EACC,CAAAC,QAAS,WACPvC,EAAMwC,cAAgBxC,EAAMwC,eAC5BtC,EAAQuC,OACT,EAAAnB,SAEDM,EAACc,EAAS,CAAA,QAGdd,SAAKhB,UAAWJ,EAAoBmC,iBAAU3C,EAAMsB,cAG1D,EACF,EAGMd,EAAsB,CAC1BC,KAAM,yBACNkC,QAAS,4BACT9B,WAAY,gCAGRG,EAAqB4B,EAAOC,EAAPD,CAAqC,SAAAE,GAAA,IAAGC,EAAKD,EAALC,MAAO7B,EAAI4B,EAAJ5B,KAAI,OAAA8B,EAAAA,EAAAA,EAAA,CAC5EC,UAAW,qBACXC,SAAU,SACVC,QAAS,OACTC,cAAe,SACfC,SAAU,WACVC,SAAU,qBACVC,MAAOR,EAAMS,YAAYC,OAAOvC,QAAAA,EAAQ,OACvC6B,EAAMS,YAAYE,KAAK,MAAQ,CAAEH,MAAO,4BAAsBI,OACzDnD,EAAoBK,YAAe,CACvC+C,OAAQ,2BACTD,OACInD,EAAoBmC,SAAY,CACnCkB,UAAW,OACX/B,KAAM,WACNgC,UAAW,GACZ,GAGGxB,EAAWM,EAAOmB,EAAPnB,CAAmB,CAClCd,KAAM,WACNkC,MAAO,UACP,QAAS,CAAEC,WAAY,YACvB,cAAe,CAAED,MAAO,aAGpBzC,EAASqB,EAAOf,EAAPe,CAAY,CACzBO,QAAS,OACTe,WAAY,SACZC,QAAS,cACTC,IAAK,MACLtC,KAAM,WACNuC,UAAW,uFACXT,OAAQ"}
+{"version":3,"file":"modal-wrapper.js","sources":["../../../src/form/modal-wrapper.tsx"],"sourcesContent":["import { FC, PropsWithChildren, ReactNode } from 'react'\r\nimport { Box, Breakpoint, colors, IconButton, Paper, styled, Tooltip, Typography } from '@mui/material'\r\nimport CloseIcon from '@mui/icons-material/Close'\r\nimport ChevronLeftIcon from '@mui/icons-material/ChevronLeft'\r\nimport { mapGlobalModalContext } from '../api-context'\r\nimport type { BoxProps, IconButtonProps, PaperProps } from '@mui/material'\r\n\r\nexport interface IFormModalWrapperProps extends PropsWithChildren {\r\n  title: ReactNode\r\n  size?: Breakpoint\r\n  fullHeight?: boolean\r\n  onCloseClick?: IconButtonProps['onClick']\r\n  onBackClick?: IconButtonProps['onClick']\r\n  enableCloseButton?: boolean\r\n  enableBackButton?: boolean\r\n  slots?: {\r\n    wrapProps?: Partial<PaperProps>\r\n    topBarProps?: BoxProps\r\n    beforeTitle?: JSX.Element\r\n    iconSize?: 'small' | 'medium' | 'large'\r\n    iconBackProps?: Partial<IconButtonProps>\r\n    iconCloseProps?: Partial<IconButtonProps>\r\n  }\r\n}\r\n\r\nconst FormModalWrapper: FC<IFormModalWrapperProps> = (props) => {\r\n  const renderTitle = () => {\r\n    const { title } = props\r\n    if (typeof title === 'string') {\r\n      return (\r\n        <Typography component='h3' variant='subtitle1' sx={{ mt: '2px', ml: '8px', fontWeight: 700 }}>\r\n          {title}\r\n        </Typography>\r\n      )\r\n    }\r\n    return title\r\n  }\r\n\r\n  return mapGlobalModalContext((context) => {\r\n    const rootClasses = [modalWrapperClasses.root, props.slots?.wrapProps?.className]\r\n    if (props.fullHeight) rootClasses.push(modalWrapperClasses.fullHeight)\r\n\r\n    const topBarClasses = [modalWrapperClasses.topBar, props.slots?.topBarProps?.className].filter(Boolean).join(' ')\r\n    return (\r\n      <ModalWrapperStyled size={props.size} {...props.slots?.wrapProps} className={rootClasses.filter(Boolean).join(' ')}>\r\n        <TopBar {...props.slots?.topBarProps} className={topBarClasses}>\r\n          {Boolean(props.enableBackButton) && (\r\n            <Tooltip title='Back' placement='top' arrow>\r\n              <BtnBack onClick={props.onBackClick} {...props.slots?.iconBackProps}>\r\n                <ChevronLeftIcon fontSize={props.slots?.iconSize ?? 'medium'} />\r\n              </BtnBack>\r\n            </Tooltip>\r\n          )}\r\n          {props.slots?.beforeTitle && (\r\n            <>\r\n              {props.slots.beforeTitle}\r\n              <Box flex={1} />\r\n            </>\r\n          )}\r\n          {renderTitle()}\r\n          <Box flex={1} />\r\n          {props.enableCloseButton !== false && (\r\n            <Tooltip title='Close' placement='top' arrow>\r\n              <BtnClose\r\n                onClick={(e) => {\r\n                  props.onCloseClick && props.onCloseClick(e)\r\n                  context.close()\r\n                }}\r\n                {...props.slots?.iconCloseProps}\r\n              >\r\n                <CloseIcon fontSize={props.slots?.iconSize ?? 'medium'} />\r\n              </BtnClose>\r\n            </Tooltip>\r\n          )}\r\n        </TopBar>\r\n        <div className={modalWrapperClasses.content}>{props.children}</div>\r\n      </ModalWrapperStyled>\r\n    )\r\n  })\r\n}\r\nexport default FormModalWrapper\r\n\r\nconst modalWrapperClasses = {\r\n  root: 'Dino-ModalWrapper-root',\r\n  topBar: 'Dino-ModalWrapper-topBar',\r\n  content: 'Dino-ModalWrapper-content',\r\n  fullHeight: 'Dino-ModalWrapper-fullHeight'\r\n}\r\n\r\nconst ModalWrapperStyled = styled(Paper)<{ size?: Breakpoint }>(({ theme, size }) => ({\r\n  maxHeight: 'calc(100vh - 24px)',\r\n  overflow: 'hidden',\r\n  display: 'flex',\r\n  flexDirection: 'column',\r\n  position: 'relative',\r\n  maxWidth: 'calc(100vw - 24px)',\r\n  width: theme.breakpoints.values[size ?? 'lg'],\r\n  [theme.breakpoints.down('sm')]: { width: 'calc(100vw - 24px)' },\r\n  [`&.${modalWrapperClasses.fullHeight}`]: { height: 'calc(100vh - 24px)' },\r\n  [`.${modalWrapperClasses.content}`]: {\r\n    overflowY: 'auto',\r\n    flex: '1 1 auto',\r\n    minHeight: 0\r\n  }\r\n}))\r\n\r\nconst BtnClose = styled(IconButton)({\r\n  flex: '0 0 auto',\r\n  color: '#3c3c3c',\r\n  '& svg': { transition: 'all 0.2s' },\r\n  '&:hover svg': { color: colors.red[600], transform: 'rotate(90deg)' }\r\n})\r\n\r\nconst BtnBack = styled(IconButton)({\r\n  flex: '0 0 auto',\r\n  color: '#3c3c3c',\r\n  '& svg': { transition: 'all 0.2s' },\r\n  '&:hover svg': { color: colors.blue[600], transform: 'scale(1.2)' }\r\n})\r\n\r\nconst TopBar = styled(Box)(({ theme }) => ({\r\n  height: 'var(--dino-h-top-bar, 48px)',\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  padding: theme.spacing(0, 1),\r\n  flex: '0 0 auto',\r\n  boxShadow: 'rgba(145, 158, 171, 0.1) 0px 0px 2px 0px,rgba(145, 158, 171, 0.12) 0px 0px 24px -4px'\r\n}))\r\n"],"names":["FormModalWrapper","props","mapGlobalModalContext","context","_props$slots","_props$slots2","_props$slots3","_props$slots4","_props$slots5","_props$slots$iconSize","_props$slots6","_props$slots7","_props$slots8","_props$slots$iconSize2","_props$slots9","rootClasses","modalWrapperClasses","root","slots","wrapProps","className","fullHeight","push","title","topBarClasses","topBar","topBarProps","filter","Boolean","join","_jsxs","ModalWrapperStyled","_objectSpread","size","children","TopBar","enableBackButton","_jsx","Tooltip","placement","arrow","BtnBack","onClick","onBackClick","iconBackProps","ChevronLeftIcon","fontSize","iconSize","beforeTitle","_Fragment","Box","flex","Typography","component","variant","sx","mt","ml","fontWeight","enableCloseButton","BtnClose","e","onCloseClick","close","iconCloseProps","CloseIcon","content","styled","Paper","_ref","theme","_defineProperty","maxHeight","overflow","display","flexDirection","position","maxWidth","width","breakpoints","values","down","concat","height","overflowY","minHeight","IconButton","color","transition","colors","red","transform","blue","_ref3","alignItems","padding","spacing","boxShadow"],"mappings":"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"}

package/dist/src/lab/data-surface/button-switch.js

@@ -1,2 +1,2 @@
-import{objectSpread2 as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as e,jsx as t}from"react/jsx-runtime";import r from"@mui/material/Button";import n from"@mui/material/ButtonGroup";import o from"@mui/icons-material/ViewList";import a from"@mui/icons-material/GridView";var l={sm:"small",md:"medium"},s=function(s){var d=s.value,m=void 0===d?"list":d,u=s.onChange,c=s.size,f=void 0===c?"md":c,v=s.className,p=s.onlyIcon,x=void 0!==p&&p,z=l[f]||"small",g=function(i){i!==m&&(null==u||u(i))};return e(n,{className:v,variant:"outlined","aria-label":"view mode group",size:z,children:[t(r,i(i({"aria-pressed":"list"===m,onClick:function(){return g("list")},variant:"list"===m?"contained":"outlined",startIcon:x?void 0:t(o,{fontSize:z}),size:z,sx:{minWidth:x?"small"===z?36:44:void 0,px:x?1:void 0,display:"inline-flex",justifyContent:"center"}},x?{"aria-label":"List view"}:{}),{},{children:x?t(o,{fontSize:z}):"List"})),t(r,i(i({"aria-pressed":"grid"===m,onClick:function(){return g("grid")},variant:"grid"===m?"contained":"outlined",startIcon:x?void 0:t(a,{fontSize:z}),size:z,sx:{minWidth:x?"small"===z?36:44:void 0,px:x?1:void 0,display:"inline-flex",justifyContent:"center"}},x?{"aria-label":"Grid view"}:{}),{},{children:x?t(a,{fontSize:z}):"Grid"}))]})};export{s as default};
+import{jsx as o}from"react/jsx-runtime";import{useRef as e,useCallback as r}from"react";import{styled as l,ToggleButtonGroup as a,colors as i,Tooltip as n,ToggleButton as t}from"@mui/material";import u from"@mui/icons-material/ViewList";import c from"@mui/icons-material/GridView";import{DataSurfaceViewMode as m}from"./types.js";var s={sm:"small",md:"medium"},d=[{value:m.list,icon:o(u,{fontSize:"small"}),label:"List View"},{value:m.grid,icon:o(c,{fontSize:"small"}),label:"Grid View"}],v=function(l){var a=l.value,i=l.onChange,u=l.size,c=void 0===u?"md":u,m=l.className,v=l.onlyIcon,f=void 0!==v&&v,g=l.reverse,p=void 0!==g&&g,h=s[c]||"small",w=e(null),x=r(function(o){w.current&&clearTimeout(w.current),w.current=setTimeout(function(){null!==o&&o!==a&&(null==i||i(o))},250)},[a,i]),C=p?[].concat(d).reverse():d;return o(b,{className:m,size:h,value:a,exclusive:!0,onChange:function(o,e){return x(e)},"aria-label":"view mode",children:C.map(function(e){return o(n,{title:e.label,arrow:!0,children:o(t,{value:e.value,"aria-label":e.label,size:h,sx:{p:f?"5px":void 0,minWidth:f?"small"===h?36:44:void 0},children:f?e.icon:e.label})},e.value)})})},b=l(a)({flex:"0 0 auto",".MuiToggleButtonGroup-grouped":{"&.Mui-selected":{color:i.common.white,backgroundColor:"var(--color-orange, ".concat(i.blue[600],")"),borderColor:"var(--color-orange, ".concat(i.blue[600],")"),"&.MuiToggleButtonGroup-lastButton":{borderColor:"var(--color-orange, ".concat(i.blue[600],")")},"&:hover":{backgroundColor:"var(--color-orange, ".concat(i.blue[600],")")}}}});export{v as default};
 //# sourceMappingURL=button-switch.js.map