dinocollab-core 2.1.46 → 2.1.48

package/dist/src/components/breadcrumbs.js

@@ -1,2 +1,2 @@
-import{objectSpread2 as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o,jsxs as e}from"react/jsx-runtime";import{styled as t,Box as n,Breadcrumbs as i,Typography as l}from"@mui/material";import a from"@mui/icons-material/ArrowBackIos";var c=function(t){var n,c=null!==(n=t.value)&&void 0!==n?n:[];return o(i,{children:c.map(function(t,n){var i,c,p=!!t.onClick||!!t.url;return e(u,r(r({},null!==(c=(i=t).props)&&void 0!==c?c:i.url?{component:"a",href:i.url}:{}),{},{onClick:t.onClick?function(r){return function(r,o){r.preventDefault(),r.stopPropagation(),o.onClick&&o.onClick(r)}(r,t)}:void 0,className:p?"clickable":"",children:[n<1&&o(a,{fontSize:"small"}),o(l,{variant:"subtitle1",noWrap:!0,children:o("span",{children:t.label})})]}),"key"+n)})})},u=t(n)(function(r){var o=r.theme;return{display:"flex",alignItems:"center",color:"var(--color-title, ".concat(o.palette.text.primary,")"),".MuiTypography-root":{color:"currentColor",fontWeight:600},".MuiSvgIcon-root":{color:"currentColor",fontSize:o.typography.pxToRem(16),marginRight:o.spacing(.5)},"&[href]":{textDecoration:"none",cursor:"pointer","&:hover":{textDecoration:"underline",color:"var(--color-title-hover, ".concat(o.palette.primary.main,")")}}}});export{c as Breadcrumbs,c as default};
+import{objectSpread2 as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o,jsxs as e}from"react/jsx-runtime";import{styled as t,Box as n,Breadcrumbs as i,Typography as l}from"@mui/material";import a from"@mui/icons-material/ArrowBackIos";var c=function(t){var n,c=null!==(n=t.value)&&void 0!==n?n:[];return o(i,{sx:t.sx,children:c.map(function(t,n){var i,c,p=!!t.onClick||!!t.url;return e(u,r(r({},null!==(c=(i=t).props)&&void 0!==c?c:i.url?{component:"a",href:i.url}:{}),{},{onClick:t.onClick?function(r){return function(r,o){r.preventDefault(),r.stopPropagation(),o.onClick&&o.onClick(r)}(r,t)}:void 0,className:p?"clickable":"",children:[n<1&&o(a,{fontSize:"small"}),o(l,{variant:"subtitle1",noWrap:!0,children:o("span",{children:t.label})})]}),"key"+n)})})},u=t(n)(function(r){var o=r.theme;return{display:"flex",alignItems:"center",color:"var(--color-title, ".concat(o.palette.text.primary,")"),".MuiTypography-root":{color:"currentColor",fontWeight:600},".MuiSvgIcon-root":{color:"currentColor",fontSize:o.typography.pxToRem(16),marginRight:o.spacing(.5)},"&[href]":{textDecoration:"none",cursor:"pointer","&:hover":{textDecoration:"underline",color:"var(--color-title-hover, ".concat(o.palette.primary.main,")")}}}});export{c as Breadcrumbs,c as default};
 //# sourceMappingURL=breadcrumbs.js.map

package/dist/src/components/breadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumbs.js","sources":["../../../src/components/breadcrumbs.tsx"],"sourcesContent":["import React, { FC } from 'react'\r\nimport { Box, Breadcrumbs as MUIBreadcrumbs, styled, Typography, TypographyProps } from '@mui/material'\r\nimport ArrowBackIosIcon from '@mui/icons-material/ArrowBackIos'\r\n\r\nexport interface IBreadcrumbConfig {\r\n  label: string\r\n  url?: string\r\n  props?: TypographyProps & { [key: string]: any }\r\n  onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void\r\n}\r\n\r\nexport interface IBreadcrumbsProps {\r\n  value?: IBreadcrumbConfig[]\r\n}\r\n\r\nexport const Breadcrumbs: FC<IBreadcrumbsProps> = (props) => {\r\n  const list = props.value ?? []\r\n\r\n  const handleClick = (e: React.MouseEvent<HTMLDivElement, MouseEvent>, x: IBreadcrumbConfig) => {\r\n    e.preventDefault()\r\n    e.stopPropagation()\r\n    x.onClick && x.onClick(e)\r\n  }\r\n\r\n  const getItemProps = (item: IBreadcrumbConfig): TypographyProps => {\r\n    return item.props ?? (item.url ? ({ component: 'a', href: item.url } as TypographyProps) : {})\r\n  }\r\n\r\n  return (\r\n    <MUIBreadcrumbs>\r\n      {list.map((x, i) => {\r\n        const isClick = !!x.onClick || !!x.url\r\n        return (\r\n          <WrapTypography\r\n            key={'key' + i}\r\n            {...getItemProps(x)}\r\n            onClick={x.onClick ? (e: any) => handleClick(e, x) : undefined}\r\n            className={isClick ? 'clickable' : ''}\r\n          >\r\n            {i < 1 && <ArrowBackIosIcon fontSize='small' />}\r\n            <Typography variant='subtitle1' noWrap>\r\n              <span>{x.label}</span>\r\n            </Typography>\r\n          </WrapTypography>\r\n        )\r\n      })}\r\n    </MUIBreadcrumbs>\r\n  )\r\n}\r\nexport default Breadcrumbs\r\n\r\nconst WrapTypography = styled(Box)(({ theme }) => ({\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  color: `var(--color-title, ${theme.palette.text.primary})`,\r\n  '.MuiTypography-root': {\r\n    color: 'currentColor',\r\n    fontWeight: 600\r\n  },\r\n  '.MuiSvgIcon-root': {\r\n    color: 'currentColor',\r\n    fontSize: theme.typography.pxToRem(16),\r\n    marginRight: theme.spacing(0.5)\r\n  },\r\n  '&[href]': {\r\n    textDecoration: 'none',\r\n    cursor: 'pointer',\r\n    '&:hover': {\r\n      textDecoration: 'underline',\r\n      color: `var(--color-title-hover, ${theme.palette.primary.main})`\r\n    }\r\n  }\r\n}))\r\n"],"names":["Breadcrumbs","props","_props$value","list","value","_jsx","MUIBreadcrumbs","children","map","x","i","item","_item$props","isClick","onClick","url","_jsxs","WrapTypography","_objectSpread","getItemProps","component","href","e","preventDefault","stopPropagation","handleClick","undefined","className","ArrowBackIosIcon","fontSize","Typography","variant","noWrap","label","styled","Box","_ref","theme","display","alignItems","color","concat","palette","text","primary","fontWeight","typography","pxToRem","marginRight","spacing","textDecoration","cursor","main"],"mappings":"mQAeaA,EAAqC,SAACC,GAAS,IAAAC,EACpDC,EAAkB,QAAdD,EAAGD,EAAMG,aAAK,IAAAF,EAAAA,EAAI,GAY5B,OACEG,EAACC,EAAc,CAAAC,SACZJ,EAAKK,IAAI,SAACC,EAAGC,GACZ,IAPgBC,EAA4CC,EAOtDC,IAAYJ,EAAEK,WAAaL,EAAEM,IACnC,OACEC,EAACC,EAAcC,EAAAA,EAETC,CAAAA,EAVK,QAAjBP,GADoBD,EAWKF,GAVbR,aAAK,IAAAW,EAAAA,EAAKD,EAAKI,IAAO,CAAEK,UAAW,IAAKC,KAAMV,EAAKI,KAA4B,CAAE,GAUlE,GAAA,CACnBD,QAASL,EAAEK,QAAU,SAACQ,GAAM,OAlBlB,SAACA,EAAiDb,GACpEa,EAAEC,iBACFD,EAAEE,kBACFf,EAAEK,SAAWL,EAAEK,QAAQQ,EACxB,CAc0CG,CAAYH,EAAGb,EAAE,OAAGiB,EACrDC,UAAWd,EAAU,YAAc,GAElCN,SAAA,CAAAG,EAAI,GAAKL,EAACuB,GAAiBC,SAAS,UACrCxB,EAACyB,EAAW,CAAAC,QAAQ,YAAYC,QAAM,EAAAzB,SACpCF,mBAAOI,EAAEwB,aAPN,MAAQvB,EAWlB,IAGP,EAGMO,EAAiBiB,EAAOC,EAAPD,CAAY,SAAAE,GAAA,IAAGC,EAAKD,EAALC,MAAK,MAAQ,CACjDC,QAAS,OACTC,WAAY,SACZC,MAAK,sBAAAC,OAAwBJ,EAAMK,QAAQC,KAAKC,QAAU,KAC1D,sBAAuB,CACrBJ,MAAO,eACPK,WAAY,KAEd,mBAAoB,CAClBL,MAAO,eACPX,SAAUQ,EAAMS,WAAWC,QAAQ,IACnCC,YAAaX,EAAMY,QAAQ,KAE7B,UAAW,CACTC,eAAgB,OAChBC,OAAQ,UACR,UAAW,CACTD,eAAgB,YAChBV,MAAK,4BAAAC,OAA8BJ,EAAMK,QAAQE,QAAQQ,KAAI,OAGlE"}
+{"version":3,"file":"breadcrumbs.js","sources":["../../../src/components/breadcrumbs.tsx"],"sourcesContent":["import React, { FC } from 'react'\r\nimport { Box, Breadcrumbs as MUIBreadcrumbs, styled, SxProps, Theme, Typography, TypographyProps } from '@mui/material'\r\nimport ArrowBackIosIcon from '@mui/icons-material/ArrowBackIos'\r\n\r\nexport interface IBreadcrumbConfig {\r\n  label: string\r\n  url?: string\r\n  props?: TypographyProps & { [key: string]: any }\r\n  onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void\r\n}\r\n\r\nexport interface IBreadcrumbsProps {\r\n  value?: IBreadcrumbConfig[]\r\n  sx?: SxProps<Theme>\r\n}\r\n\r\nexport const Breadcrumbs: FC<IBreadcrumbsProps> = (props) => {\r\n  const list = props.value ?? []\r\n\r\n  const handleClick = (e: React.MouseEvent<HTMLDivElement, MouseEvent>, x: IBreadcrumbConfig) => {\r\n    e.preventDefault()\r\n    e.stopPropagation()\r\n    x.onClick && x.onClick(e)\r\n  }\r\n\r\n  const getItemProps = (item: IBreadcrumbConfig): TypographyProps => {\r\n    return item.props ?? (item.url ? ({ component: 'a', href: item.url } as TypographyProps) : {})\r\n  }\r\n\r\n  return (\r\n    <MUIBreadcrumbs sx={props.sx}>\r\n      {list.map((x, i) => {\r\n        const isClick = !!x.onClick || !!x.url\r\n        return (\r\n          <WrapTypography\r\n            key={'key' + i}\r\n            {...getItemProps(x)}\r\n            onClick={x.onClick ? (e: any) => handleClick(e, x) : undefined}\r\n            className={isClick ? 'clickable' : ''}\r\n          >\r\n            {i < 1 && <ArrowBackIosIcon fontSize='small' />}\r\n            <Typography variant='subtitle1' noWrap>\r\n              <span>{x.label}</span>\r\n            </Typography>\r\n          </WrapTypography>\r\n        )\r\n      })}\r\n    </MUIBreadcrumbs>\r\n  )\r\n}\r\nexport default Breadcrumbs\r\n\r\nconst WrapTypography = styled(Box)(({ theme }) => ({\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  color: `var(--color-title, ${theme.palette.text.primary})`,\r\n  '.MuiTypography-root': {\r\n    color: 'currentColor',\r\n    fontWeight: 600\r\n  },\r\n  '.MuiSvgIcon-root': {\r\n    color: 'currentColor',\r\n    fontSize: theme.typography.pxToRem(16),\r\n    marginRight: theme.spacing(0.5)\r\n  },\r\n  '&[href]': {\r\n    textDecoration: 'none',\r\n    cursor: 'pointer',\r\n    '&:hover': {\r\n      textDecoration: 'underline',\r\n      color: `var(--color-title-hover, ${theme.palette.primary.main})`\r\n    }\r\n  }\r\n}))\r\n"],"names":["Breadcrumbs","props","_props$value","list","value","_jsx","MUIBreadcrumbs","sx","map","x","i","item","_item$props","isClick","onClick","url","_jsxs","WrapTypography","_objectSpread","getItemProps","component","href","e","preventDefault","stopPropagation","handleClick","undefined","className","children","ArrowBackIosIcon","fontSize","Typography","variant","noWrap","label","styled","Box","_ref","theme","display","alignItems","color","concat","palette","text","primary","fontWeight","typography","pxToRem","marginRight","spacing","textDecoration","cursor","main"],"mappings":"mQAgBaA,EAAqC,SAACC,GAAS,IAAAC,EACpDC,EAAkB,QAAdD,EAAGD,EAAMG,aAAK,IAAAF,EAAAA,EAAI,GAY5B,OACEG,EAACC,GAAeC,GAAIN,EAAMM,YACvBJ,EAAKK,IAAI,SAACC,EAAGC,GACZ,IAPgBC,EAA4CC,EAOtDC,IAAYJ,EAAEK,WAAaL,EAAEM,IACnC,OACEC,EAACC,EAAcC,EAAAA,EAETC,CAAAA,EAVK,QAAjBP,GADoBD,EAWKF,GAVbR,aAAK,IAAAW,EAAAA,EAAKD,EAAKI,IAAO,CAAEK,UAAW,IAAKC,KAAMV,EAAKI,KAA4B,CAAE,GAUlE,GAAA,CACnBD,QAASL,EAAEK,QAAU,SAACQ,GAAM,OAlBlB,SAACA,EAAiDb,GACpEa,EAAEC,iBACFD,EAAEE,kBACFf,EAAEK,SAAWL,EAAEK,QAAQQ,EACxB,CAc0CG,CAAYH,EAAGb,EAAE,OAAGiB,EACrDC,UAAWd,EAAU,YAAc,GAElCe,SAAA,CAAAlB,EAAI,GAAKL,EAACwB,GAAiBC,SAAS,UACrCzB,EAAC0B,EAAW,CAAAC,QAAQ,YAAYC,QAAM,EAAAL,SACpCvB,mBAAOI,EAAEyB,aAPN,MAAQxB,EAWlB,IAGP,EAGMO,EAAiBkB,EAAOC,EAAPD,CAAY,SAAAE,GAAA,IAAGC,EAAKD,EAALC,MAAK,MAAQ,CACjDC,QAAS,OACTC,WAAY,SACZC,MAAK,sBAAAC,OAAwBJ,EAAMK,QAAQC,KAAKC,QAAU,KAC1D,sBAAuB,CACrBJ,MAAO,eACPK,WAAY,KAEd,mBAAoB,CAClBL,MAAO,eACPX,SAAUQ,EAAMS,WAAWC,QAAQ,IACnCC,YAAaX,EAAMY,QAAQ,KAE7B,UAAW,CACTC,eAAgB,OAChBC,OAAQ,UACR,UAAW,CACTD,eAAgB,YAChBV,MAAK,4BAAAC,OAA8BJ,EAAMK,QAAQE,QAAQQ,KAAI,OAGlE"}

package/dist/src/components/create.multi-select-dropdown.js

@@ -1,2 +1,2 @@
-import{defineProperty as n,slicedToArray as o,objectSpread2 as e,toConsumableArray as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as t,Fragment as i,jsx as r}from"react/jsx-runtime";import{useState as a,useCallback as c,useEffect as u}from"react";import{styled as s,Popover as d,Badge as p,badgeClasses as h,Box as m,Button as v,TextField as f,ToggleButtonGroup as g,ToggleButton as x,Typography as C,List as b,ListItem as P,FormControlLabel as w,Checkbox as y}from"@mui/material";import j from"@mui/icons-material/FilterAltOutlined";import{HelpTooltip as z}from"./help-tooltip.js";import{mergeObjects as A}from"../utils/helpers.js";function k(n){return function(s){var d,p,h,k,S,T,B,D,F,H,I,R,Y,_,q,E,M=a(""),W=o(M,2),X=W[0],G=W[1],J=a(null),K=o(J,2),Q=K[0],U=K[1],V=a(null!==(d=null!==(p=s.options)&&void 0!==p?p:n.options)&&void 0!==d?d:[]),Z=o(V,2),$=Z[0],nn=Z[1],on=a([]),en=o(on,2),ln=en[0],tn=en[1],rn=a(null!==(h=null===(k=s.slots)||void 0===k?void 0:k.defaultLogic)&&void 0!==h?h:"and"),an=o(rn,2),cn=an[0],un=an[1],sn={buttonProps:A(null==n?void 0:n.buttonProps,null===(S=s.slots)||void 0===S?void 0:S.buttonProps),contentProps:null!==(T=null!==(B=null===(D=s.slots)||void 0===D?void 0:D.contentPorps)&&void 0!==B?B:null==n?void 0:n.contentPorps)&&void 0!==T?T:{}},dn=c(function(){var n;s.value&&(un(null!==(n=s.value.logic)&&void 0!==n?n:"and"),tn(s.value.items))},[s.value]),pn=function(n,o){U(null),setTimeout(dn,300)};return u(function(){s.options&&s.options.length>0&&nn(s.options)},[s.options]),u(function(){dn()},[dn]),t(i,{children:[t(v,e(e({color:"inherit",endIcon:r(j,{}),disabled:$.length<1},sn.buttonProps),{},{onClick:function(n){U(n.currentTarget)},children:[n.btnText,r(L,{badgeContent:null===(F=s.value)||void 0===F?void 0:F.items.length,color:"error",overlap:"circular",sx:{transform:"translateY(-50%) translateX(24px)"}})]})),t(O,{open:Boolean(Q),anchorEl:Q,onClose:pn,anchorOrigin:{vertical:"bottom",horizontal:"left"},children:[t(N,{className:"top",children:[r(f,{size:"small",placeholder:null!==(H=n.placeholder)&&void 0!==H?H:"Search",fullWidth:!0,value:X,onChange:function(n){return G(n.target.value)}}),t(g,{size:"small",exclusive:!0,color:"primary",value:cn,onChange:function(n,o){o&&un(o)},children:[r(x,{value:"and",children:"AND"}),r(x,{value:"or",children:"OR"})]}),r(z,{title:"Filter Logic",small:!0,children:t(C,{variant:"body2",color:"text.secondary",children:["Choose how multiple categories are applied.",r("br",{}),r("strong",{children:" AND "})," requires all selected categories, while",r("br",{}),r("strong",{children:" OR "})," matches any."]})})]}),r(m,e(e({className:"menu-content"},sn.contentProps),{},{children:r(b,{children:(Y=null!==(I=null===(R=s.value)||void 0===R?void 0:R.items)&&void 0!==I?I:[],_=$.filter(function(n){return n.toLowerCase().includes(X.toLowerCase())}).sort(function(n,o){return n.localeCompare(o)}),q=_.filter(function(n){return Y.includes(n)}),E=_.filter(function(n){return!Y.includes(n)}),[].concat(l(q),l(E))).map(function(n){return r(P,{sx:{whiteSpace:"nowrap"},children:r(w,{label:n,control:r(y,{checked:ln.includes(n),onChange:function(){return o=n,void tn(function(n){return n.includes(o)?n.filter(function(n){return n!==o}):[].concat(l(n),[o])});var o}})})},n)})})})),t(N,{children:[r(v,{size:"small",onClick:function(){tn([]),s.onChange&&s.onChange({items:[],logic:cn})},color:"inherit",children:"Clear"}),r(m,{sx:{flex:1}}),r(v,{size:"small",onClick:function(){tn([]),pn()},color:"inherit",children:"Cancel"}),r(v,{size:"small",variant:"contained",onClick:function(){s.onChange&&s.onChange({items:ln,logic:cn}),pn()},children:"Apply"})]})]})]})}}var O=s(d)({".MuiPaper-root":{overflow:"hidden",position:"relative",width:"360px"},".menu-content":{overflowY:"auto",maxHeight:"".concat(290,"px"),margin:"2px 2px 2px 0"}}),L=s(p)(n({},"& .".concat(h.badge),{top:"-12px",right:"-6px"})),N=s(m)({alignItems:"center",display:"flex",gap:"6px",height:"58px",padding:"8px 10px",boxShadow:"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"});export{k as default};
+import{defineProperty as n,slicedToArray as o,objectSpread2 as e,toConsumableArray as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as t,Fragment as i,jsx as r}from"react/jsx-runtime";import{useState as a,useCallback as c,useEffect as u}from"react";import{styled as s,Popover as d,Badge as p,badgeClasses as h,Box as m,Button as v,TextField as f,ToggleButtonGroup as g,ToggleButton as x,Typography as C,List as b,ListItem as y,FormControlLabel as P,Checkbox as w}from"@mui/material";import j from"@mui/icons-material/FilterAltOutlined";import{mergeObjects as z}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";import{HelpTooltip as A}from"./help-tooltip.js";function k(n){return function(s){var d,p,h,k,S,T,q,B,D,F,H,I,R,Y,_,E,M=a(""),W=o(M,2),X=W[0],G=W[1],J=a(null),K=o(J,2),Q=K[0],U=K[1],V=a(null!==(d=null!==(p=s.options)&&void 0!==p?p:n.options)&&void 0!==d?d:[]),Z=o(V,2),$=Z[0],nn=Z[1],on=a([]),en=o(on,2),ln=en[0],tn=en[1],rn=a(null!==(h=null===(k=s.slots)||void 0===k?void 0:k.defaultLogic)&&void 0!==h?h:"and"),an=o(rn,2),cn=an[0],un=an[1],sn={buttonProps:z(null==n?void 0:n.buttonProps,null===(S=s.slots)||void 0===S?void 0:S.buttonProps),contentProps:null!==(T=null!==(q=null===(B=s.slots)||void 0===B?void 0:B.contentPorps)&&void 0!==q?q:null==n?void 0:n.contentPorps)&&void 0!==T?T:{}},dn=c(function(){var n;s.value&&(un(null!==(n=s.value.logic)&&void 0!==n?n:"and"),tn(s.value.items))},[s.value]),pn=function(n,o){U(null),setTimeout(dn,300)};return u(function(){s.options&&s.options.length>0&&nn(s.options)},[s.options]),u(function(){dn()},[dn]),t(i,{children:[t(v,e(e({color:"inherit",endIcon:r(j,{}),disabled:$.length<1},sn.buttonProps),{},{onClick:function(n){U(n.currentTarget)},children:[n.btnText,r(L,{badgeContent:null===(D=s.value)||void 0===D?void 0:D.items.length,color:"error",overlap:"circular",sx:{transform:"translateY(-50%) translateX(24px)"}})]})),t(O,{open:Boolean(Q),anchorEl:Q,onClose:pn,anchorOrigin:{vertical:"bottom",horizontal:"left"},children:[t(N,{className:"top",children:[r(f,{size:"small",placeholder:null!==(F=n.placeholder)&&void 0!==F?F:"Search",fullWidth:!0,value:X,onChange:function(n){return G(n.target.value)}}),t(g,{size:"small",exclusive:!0,color:"primary",value:cn,onChange:function(n,o){o&&un(o)},children:[r(x,{value:"and",children:"AND"}),r(x,{value:"or",children:"OR"})]}),r(A,{title:"Filter Logic",small:!0,children:t(C,{variant:"body2",color:"text.secondary",children:["Choose how multiple categories are applied.",r("br",{}),r("strong",{children:" AND "})," requires all selected categories, while",r("br",{}),r("strong",{children:" OR "})," matches any."]})})]}),r(m,e(e({className:"menu-content"},sn.contentProps),{},{children:r(b,{children:(R=null!==(H=null===(I=s.value)||void 0===I?void 0:I.items)&&void 0!==H?H:[],Y=$.filter(function(n){return n.toLowerCase().includes(X.toLowerCase())}).sort(function(n,o){return n.localeCompare(o)}),_=Y.filter(function(n){return R.includes(n)}),E=Y.filter(function(n){return!R.includes(n)}),[].concat(l(_),l(E))).map(function(n){return r(y,{sx:{whiteSpace:"nowrap"},children:r(P,{label:n,control:r(w,{checked:ln.includes(n),onChange:function(){return o=n,void tn(function(n){return n.includes(o)?n.filter(function(n){return n!==o}):[].concat(l(n),[o])});var o}})})},n)})})})),t(N,{children:[r(v,{size:"small",onClick:function(){tn([]),s.onChange&&s.onChange({items:[],logic:cn})},color:"inherit",children:"Clear"}),r(m,{sx:{flex:1}}),r(v,{size:"small",onClick:function(){tn([]),pn()},color:"inherit",children:"Cancel"}),r(v,{size:"small",variant:"contained",onClick:function(){s.onChange&&s.onChange({items:ln,logic:cn}),pn()},children:"Apply"})]})]})]})}}var O=s(d)({".MuiPaper-root":{overflow:"hidden",position:"relative",width:"360px"},".menu-content":{overflowY:"auto",maxHeight:"".concat(290,"px"),margin:"2px 2px 2px 0"}}),L=s(p)(n({},"& .".concat(h.badge),{top:"-12px",right:"-6px"})),N=s(m)({alignItems:"center",display:"flex",gap:"6px",height:"58px",padding:"8px 10px",boxShadow:"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"});export{k as default};
 //# sourceMappingURL=create.multi-select-dropdown.js.map

package/dist/src/components/create.multi-select-dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"create.multi-select-dropdown.js","sources":["../../../src/components/create.multi-select-dropdown.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useState } from 'react'\r\nimport { Badge, badgeClasses, Box, BoxProps, Button, ButtonProps, Checkbox } from '@mui/material'\r\nimport { FormControlLabel, List, ListItem, Popover, styled, TextField, ToggleButton, ToggleButtonGroup, Typography } from '@mui/material'\r\nimport FilterAltOutlinedIcon from '@mui/icons-material/FilterAltOutlined'\r\nimport { mergeObjects } from '../utils'\r\nimport HelpTooltip from './help-tooltip'\r\n\r\nexport type IMultiSelectDropdownFilterLogic = 'and' | 'or'\r\n\r\nexport interface IMultiSelectDropdownFilter {\r\n  items: string[]\r\n  logic?: IMultiSelectDropdownFilterLogic\r\n}\r\n\r\nexport type IMultiSelectDropdownChange = (value: IMultiSelectDropdownFilter) => void\r\n\r\nexport interface IMultiSelectDropdownSlots {\r\n  buttonProps?: ButtonProps\r\n  contentPorps?: BoxProps\r\n  defaultLogic?: IMultiSelectDropdownFilterLogic\r\n}\r\n\r\nexport interface IMultiSelectDropdownProps {\r\n  options?: string[]\r\n  value?: IMultiSelectDropdownFilter\r\n  onChange?: IMultiSelectDropdownChange\r\n  slots?: IMultiSelectDropdownSlots\r\n}\r\n\r\nexport interface IMultiSelectDropdownParams extends IMultiSelectDropdownSlots {\r\n  btnText: string\r\n  options?: string[]\r\n  placeholder?: string\r\n}\r\n\r\nfunction CreateMultiSelectDropdown(params: IMultiSelectDropdownParams) {\r\n  const MenuSelectMultiple: FC<IMultiSelectDropdownProps> = (props) => {\r\n    const [search, setSearch] = useState<string>('')\r\n    const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n    const [options, setOptions] = useState<string[]>(props.options ?? params.options ?? [])\r\n    const [itemSelecteds, setItemSelecteds] = useState<string[]>([])\r\n    const [logic, setLogic] = useState(props.slots?.defaultLogic ?? 'and')\r\n\r\n    const mergeConfig = {\r\n      buttonProps: mergeObjects<ButtonProps>(params?.buttonProps, props.slots?.buttonProps),\r\n      contentProps: props.slots?.contentPorps ?? params?.contentPorps ?? {}\r\n    }\r\n\r\n    const getOptions = () => {\r\n      const values = props.value?.items ?? []\r\n      const list = options.filter((x) => x.toLowerCase().includes(search.toLowerCase())).sort((a, b) => a.localeCompare(b))\r\n\r\n      const prioritized = list.filter((x) => values.includes(x))\r\n      const others = list.filter((x) => !values.includes(x))\r\n\r\n      return [...prioritized, ...others]\r\n    }\r\n\r\n    const setValueWithProps = useCallback(() => {\r\n      if (props.value) {\r\n        setLogic(props.value.logic ?? 'and')\r\n        setItemSelecteds(props.value.items)\r\n      }\r\n    }, [props.value])\r\n\r\n    const handleOpen = (event: React.MouseEvent<HTMLButtonElement>) => {\r\n      setAnchorEl(event.currentTarget)\r\n    }\r\n\r\n    const handleClose = (event?: {}, reason?: 'backdropClick' | 'escapeKeyDown') => {\r\n      setAnchorEl(null)\r\n      setTimeout(setValueWithProps, 300)\r\n    }\r\n\r\n    const handleToggle = (value: string) => {\r\n      setItemSelecteds((prev) => (prev.includes(value) ? prev.filter((t) => t !== value) : [...prev, value]))\r\n    }\r\n\r\n    const handleClear = () => {\r\n      setItemSelecteds([])\r\n      props.onChange && props.onChange({ items: [], logic })\r\n    }\r\n\r\n    const handleCancel = () => {\r\n      setItemSelecteds([])\r\n      handleClose()\r\n    }\r\n\r\n    const handleApply = () => {\r\n      props.onChange && props.onChange({ items: itemSelecteds, logic })\r\n      handleClose()\r\n    }\r\n\r\n    const handleChangeLogic = (_: React.MouseEvent<HTMLElement>, value: any) => {\r\n      if (value) setLogic(value)\r\n    }\r\n\r\n    useEffect(() => {\r\n      if (props.options && props.options.length > 0) setOptions(props.options)\r\n    }, [props.options])\r\n\r\n    useEffect(() => {\r\n      setValueWithProps()\r\n    }, [setValueWithProps])\r\n\r\n    return (\r\n      <>\r\n        <Button color='inherit' endIcon={<FilterAltOutlinedIcon />} disabled={options.length < 1} {...mergeConfig.buttonProps} onClick={handleOpen}>\r\n          {params.btnText}\r\n          <ButtonBadge\r\n            badgeContent={props.value?.items.length}\r\n            color='error'\r\n            overlap='circular'\r\n            sx={{ transform: 'translateY(-50%) translateX(24px)' }}\r\n          />\r\n        </Button>\r\n        <CustomPopover open={Boolean(anchorEl)} anchorEl={anchorEl} onClose={handleClose} anchorOrigin={{ vertical: 'bottom', horizontal: 'left' }}>\r\n          <WrapActions className='top'>\r\n            <TextField\r\n              size='small'\r\n              placeholder={params.placeholder ?? 'Search'}\r\n              fullWidth\r\n              value={search}\r\n              onChange={(e) => setSearch(e.target.value)}\r\n            />\r\n            <ToggleButtonGroup size='small' exclusive color='primary' value={logic} onChange={handleChangeLogic}>\r\n              <ToggleButton value='and'>AND</ToggleButton>\r\n              <ToggleButton value='or'>OR</ToggleButton>\r\n            </ToggleButtonGroup>\r\n            <HelpTooltip title='Filter Logic' small>\r\n              <Typography variant='body2' color='text.secondary'>\r\n                Choose how multiple categories are applied.\r\n                <br />\r\n                <strong> AND </strong> requires all selected categories, while\r\n                <br />\r\n                <strong> OR </strong> matches any.\r\n              </Typography>\r\n            </HelpTooltip>\r\n          </WrapActions>\r\n          <Box className='menu-content' {...mergeConfig.contentProps}>\r\n            <List>\r\n              {getOptions().map((x) => (\r\n                <ListItem key={x} sx={{ whiteSpace: 'nowrap' }}>\r\n                  <FormControlLabel label={x} control={<Checkbox checked={itemSelecteds.includes(x)} onChange={() => handleToggle(x)} />} />\r\n                </ListItem>\r\n              ))}\r\n            </List>\r\n          </Box>\r\n          <WrapActions>\r\n            <Button size='small' onClick={handleClear} color='inherit'>\r\n              Clear\r\n            </Button>\r\n            <Box sx={{ flex: 1 }} />\r\n            <Button size='small' onClick={handleCancel} color='inherit'>\r\n              Cancel\r\n            </Button>\r\n            <Button size='small' variant='contained' onClick={handleApply}>\r\n              Apply\r\n            </Button>\r\n          </WrapActions>\r\n        </CustomPopover>\r\n      </>\r\n    )\r\n  }\r\n\r\n  return MenuSelectMultiple\r\n}\r\n\r\nexport default CreateMultiSelectDropdown\r\n\r\nconst heightItem = 58\r\nconst CustomPopover = styled(Popover)({\r\n  '.MuiPaper-root': {\r\n    overflow: 'hidden',\r\n    position: 'relative',\r\n    width: '360px'\r\n  },\r\n  '.menu-content': {\r\n    overflowY: 'auto',\r\n    maxHeight: `${heightItem * 5}px`,\r\n    margin: '2px 2px 2px 0'\r\n  }\r\n})\r\n\r\nconst ButtonBadge = styled(Badge)({\r\n  [`& .${badgeClasses.badge}`]: {\r\n    top: '-12px',\r\n    right: '-6px'\r\n  }\r\n})\r\nconst WrapActions = styled(Box)({\r\n  alignItems: 'center',\r\n  display: 'flex',\r\n  gap: '6px',\r\n  height: '58px',\r\n  padding: '8px 10px',\r\n  boxShadow: 'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'\r\n})\r\n"],"names":["CreateMultiSelectDropdown","params","props","_ref","_props$options","_props$slots$defaultL","_props$slots","_props$slots2","_ref2","_props$slots$contentP","_props$slots3","_props$value2","_params$placeholder","_props$value$items","_props$value","values","list","prioritized","others","_useState","useState","_useState2","_slicedToArray","search","setSearch","_useState3","_useState4","anchorEl","setAnchorEl","_useState5","options","_useState6","setOptions","_useState7","_useState8","itemSelecteds","setItemSelecteds","_useState9","slots","defaultLogic","_useState0","logic","setLogic","mergeConfig","buttonProps","mergeObjects","contentProps","contentPorps","setValueWithProps","useCallback","_props$value$logic","value","items","handleClose","event","reason","setTimeout","useEffect","length","_jsxs","_Fragment","children","Button","_objectSpread","color","endIcon","_jsx","FilterAltOutlinedIcon","disabled","onClick","currentTarget","btnText","ButtonBadge","badgeContent","overlap","sx","transform","CustomPopover","open","Boolean","onClose","anchorOrigin","vertical","horizontal","WrapActions","className","TextField","size","placeholder","fullWidth","onChange","e","target","ToggleButtonGroup","exclusive","_","ToggleButton","HelpTooltip","title","small","Typography","variant","Box","List","filter","x","toLowerCase","includes","sort","a","b","localeCompare","concat","_toConsumableArray","map","ListItem","whiteSpace","FormControlLabel","label","control","Checkbox","checked","prev","t","flex","styled","Popover","overflow","position","width","overflowY","maxHeight","heightItem","margin","Badge","_defineProperty","badgeClasses","badge","top","right","alignItems","display","gap","height","padding","boxShadow"],"mappings":"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"}
+{"version":3,"file":"create.multi-select-dropdown.js","sources":["../../../src/components/create.multi-select-dropdown.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useState } from 'react'\r\nimport { Badge, badgeClasses, Box, BoxProps, Button, ButtonProps, Checkbox } from '@mui/material'\r\nimport { FormControlLabel, List, ListItem, Popover, styled, TextField, ToggleButton, ToggleButtonGroup, Typography } from '@mui/material'\r\nimport FilterAltOutlinedIcon from '@mui/icons-material/FilterAltOutlined'\r\nimport { mergeObjects } from '../utils'\r\nimport HelpTooltip from './help-tooltip'\r\n\r\nexport type IMultiSelectDropdownFilterLogic = 'and' | 'or'\r\n\r\nexport interface IMultiSelectDropdownFilter {\r\n  items: string[]\r\n  logic?: IMultiSelectDropdownFilterLogic\r\n}\r\n\r\nexport type IMultiSelectDropdownChange = (value: IMultiSelectDropdownFilter) => void\r\n\r\nexport interface IMultiSelectDropdownSlots {\r\n  buttonProps?: ButtonProps\r\n  contentPorps?: BoxProps\r\n  defaultLogic?: IMultiSelectDropdownFilterLogic\r\n}\r\n\r\nexport interface IMultiSelectDropdownProps {\r\n  options?: string[]\r\n  value?: IMultiSelectDropdownFilter\r\n  onChange?: IMultiSelectDropdownChange\r\n  slots?: IMultiSelectDropdownSlots\r\n}\r\n\r\nexport interface IMultiSelectDropdownParams extends IMultiSelectDropdownSlots {\r\n  btnText: string\r\n  options?: string[]\r\n  placeholder?: string\r\n}\r\n\r\nfunction CreateMultiSelectDropdown(params: IMultiSelectDropdownParams) {\r\n  const MenuSelectMultiple: FC<IMultiSelectDropdownProps> = (props) => {\r\n    const [search, setSearch] = useState<string>('')\r\n    const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n    const [options, setOptions] = useState<string[]>(props.options ?? params.options ?? [])\r\n    const [itemSelecteds, setItemSelecteds] = useState<string[]>([])\r\n    const [logic, setLogic] = useState(props.slots?.defaultLogic ?? 'and')\r\n\r\n    const mergeConfig = {\r\n      buttonProps: mergeObjects<ButtonProps>(params?.buttonProps, props.slots?.buttonProps),\r\n      contentProps: props.slots?.contentPorps ?? params?.contentPorps ?? {}\r\n    }\r\n\r\n    const getOptions = () => {\r\n      const values = props.value?.items ?? []\r\n      const list = options.filter((x) => x.toLowerCase().includes(search.toLowerCase())).sort((a, b) => a.localeCompare(b))\r\n\r\n      const prioritized = list.filter((x) => values.includes(x))\r\n      const others = list.filter((x) => !values.includes(x))\r\n\r\n      return [...prioritized, ...others]\r\n    }\r\n\r\n    const setValueWithProps = useCallback(() => {\r\n      if (props.value) {\r\n        setLogic(props.value.logic ?? 'and')\r\n        setItemSelecteds(props.value.items)\r\n      }\r\n    }, [props.value])\r\n\r\n    const handleOpen = (event: React.MouseEvent<HTMLButtonElement>) => {\r\n      setAnchorEl(event.currentTarget)\r\n    }\r\n\r\n    const handleClose = (event?: {}, reason?: 'backdropClick' | 'escapeKeyDown') => {\r\n      setAnchorEl(null)\r\n      setTimeout(setValueWithProps, 300)\r\n    }\r\n\r\n    const handleToggle = (value: string) => {\r\n      setItemSelecteds((prev) => (prev.includes(value) ? prev.filter((t) => t !== value) : [...prev, value]))\r\n    }\r\n\r\n    const handleClear = () => {\r\n      setItemSelecteds([])\r\n      props.onChange && props.onChange({ items: [], logic })\r\n    }\r\n\r\n    const handleCancel = () => {\r\n      setItemSelecteds([])\r\n      handleClose()\r\n    }\r\n\r\n    const handleApply = () => {\r\n      props.onChange && props.onChange({ items: itemSelecteds, logic })\r\n      handleClose()\r\n    }\r\n\r\n    const handleChangeLogic = (_: React.MouseEvent<HTMLElement>, value: any) => {\r\n      if (value) setLogic(value)\r\n    }\r\n\r\n    useEffect(() => {\r\n      if (props.options && props.options.length > 0) setOptions(props.options)\r\n    }, [props.options])\r\n\r\n    useEffect(() => {\r\n      setValueWithProps()\r\n    }, [setValueWithProps])\r\n\r\n    return (\r\n      <>\r\n        <Button color='inherit' endIcon={<FilterAltOutlinedIcon />} disabled={options.length < 1} {...mergeConfig.buttonProps} onClick={handleOpen}>\r\n          {params.btnText}\r\n          <ButtonBadge\r\n            badgeContent={props.value?.items.length}\r\n            color='error'\r\n            overlap='circular'\r\n            sx={{ transform: 'translateY(-50%) translateX(24px)' }}\r\n          />\r\n        </Button>\r\n        <CustomPopover open={Boolean(anchorEl)} anchorEl={anchorEl} onClose={handleClose} anchorOrigin={{ vertical: 'bottom', horizontal: 'left' }}>\r\n          <WrapActions className='top'>\r\n            <TextField\r\n              size='small'\r\n              placeholder={params.placeholder ?? 'Search'}\r\n              fullWidth\r\n              value={search}\r\n              onChange={(e) => setSearch(e.target.value)}\r\n            />\r\n            <ToggleButtonGroup size='small' exclusive color='primary' value={logic} onChange={handleChangeLogic}>\r\n              <ToggleButton value='and'>AND</ToggleButton>\r\n              <ToggleButton value='or'>OR</ToggleButton>\r\n            </ToggleButtonGroup>\r\n            <HelpTooltip title='Filter Logic' small>\r\n              <Typography variant='body2' color='text.secondary'>\r\n                Choose how multiple categories are applied.\r\n                <br />\r\n                <strong> AND </strong> requires all selected categories, while\r\n                <br />\r\n                <strong> OR </strong> matches any.\r\n              </Typography>\r\n            </HelpTooltip>\r\n          </WrapActions>\r\n          <Box className='menu-content' {...mergeConfig.contentProps}>\r\n            <List>\r\n              {getOptions().map((x) => (\r\n                <ListItem key={x} sx={{ whiteSpace: 'nowrap' }}>\r\n                  <FormControlLabel label={x} control={<Checkbox checked={itemSelecteds.includes(x)} onChange={() => handleToggle(x)} />} />\r\n                </ListItem>\r\n              ))}\r\n            </List>\r\n          </Box>\r\n          <WrapActions>\r\n            <Button size='small' onClick={handleClear} color='inherit'>\r\n              Clear\r\n            </Button>\r\n            <Box sx={{ flex: 1 }} />\r\n            <Button size='small' onClick={handleCancel} color='inherit'>\r\n              Cancel\r\n            </Button>\r\n            <Button size='small' variant='contained' onClick={handleApply}>\r\n              Apply\r\n            </Button>\r\n          </WrapActions>\r\n        </CustomPopover>\r\n      </>\r\n    )\r\n  }\r\n\r\n  return MenuSelectMultiple\r\n}\r\n\r\nexport default CreateMultiSelectDropdown\r\n\r\nconst heightItem = 58\r\nconst CustomPopover = styled(Popover)({\r\n  '.MuiPaper-root': {\r\n    overflow: 'hidden',\r\n    position: 'relative',\r\n    width: '360px'\r\n  },\r\n  '.menu-content': {\r\n    overflowY: 'auto',\r\n    maxHeight: `${heightItem * 5}px`,\r\n    margin: '2px 2px 2px 0'\r\n  }\r\n})\r\n\r\nconst ButtonBadge = styled(Badge)({\r\n  [`& .${badgeClasses.badge}`]: {\r\n    top: '-12px',\r\n    right: '-6px'\r\n  }\r\n})\r\nconst WrapActions = styled(Box)({\r\n  alignItems: 'center',\r\n  display: 'flex',\r\n  gap: '6px',\r\n  height: '58px',\r\n  padding: '8px 10px',\r\n  boxShadow: 'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'\r\n})\r\n"],"names":["CreateMultiSelectDropdown","params","props","_ref","_props$options","_props$slots$defaultL","_props$slots","_props$slots2","_ref2","_props$slots$contentP","_props$slots3","_props$value2","_params$placeholder","_props$value$items","_props$value","values","list","prioritized","others","_useState","useState","_useState2","_slicedToArray","search","setSearch","_useState3","_useState4","anchorEl","setAnchorEl","_useState5","options","_useState6","setOptions","_useState7","_useState8","itemSelecteds","setItemSelecteds","_useState9","slots","defaultLogic","_useState0","logic","setLogic","mergeConfig","buttonProps","mergeObjects","contentProps","contentPorps","setValueWithProps","useCallback","_props$value$logic","value","items","handleClose","event","reason","setTimeout","useEffect","length","_jsxs","_Fragment","children","Button","_objectSpread","color","endIcon","_jsx","FilterAltOutlinedIcon","disabled","onClick","currentTarget","btnText","ButtonBadge","badgeContent","overlap","sx","transform","CustomPopover","open","Boolean","onClose","anchorOrigin","vertical","horizontal","WrapActions","className","TextField","size","placeholder","fullWidth","onChange","e","target","ToggleButtonGroup","exclusive","_","ToggleButton","HelpTooltip","title","small","Typography","variant","Box","List","filter","x","toLowerCase","includes","sort","a","b","localeCompare","concat","_toConsumableArray","map","ListItem","whiteSpace","FormControlLabel","label","control","Checkbox","checked","prev","t","flex","styled","Popover","overflow","position","width","overflowY","maxHeight","heightItem","margin","Badge","_defineProperty","badgeClasses","badge","top","right","alignItems","display","gap","height","padding","boxShadow"],"mappings":"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"}

package/dist/src/data-view/create.active-filters-panel.js

@@ -1,2 +1,2 @@
-import{defineProperty as e,inherits as t,createClass as i,classCallCheck as r,callSuper as a}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,Fragment as l,jsxs as o}from"react/jsx-runtime";import{Component as c,Fragment as s}from"react";import{styled as d,Box as u,Collapse as v,Typography as m,Chip as f}from"@mui/material";import{createFilterStore as p}from"./filter-store.js";import{ClearAllButton as h,mapSortConfigs as x}from"./ui.units.js";import{mapDataViewContext as C}from"./context.js";import{mapDateLogicText as g}from"./helpers.js";import{formatDatetime as S}from"../utils/helpers.js";var w={root:"ActiveFiltersPanel-root",content:"ActiveFiltersPanel-content",item:"ActiveFiltersPanel-item",itemContent:"ActiveFiltersPanel-itemContent",itemChip:"ActiveFiltersPanel-itemChip",removeButton:"ActiveFiltersPanel-removeButton",overlay:"ActiveFiltersPanel-overlay"};function b(){return function(){function d(t){var i;return r(this,d),i=a(this,d,[t]),e(i,"handleAnimationExited",function(){i.setState({isClosing:!0})}),e(i,"renderItems",function(e){var t;return o(u,{className:w.item,children:[o(m,{variant:"caption",sx:{fontWeight:700},children:[e.label||(null===(t=e.field)||void 0===t?void 0:t.toString()),":"]}),n(u,{className:w.itemContent,children:e.items.map(function(t){return n(f,{clickable:!0,size:"small",label:t.label||t.value,className:w.itemChip,onDelete:function(){e.isQuickSearch?i.removeQuickSearch(t):e.field&&i.removeFilter(e.field,t)}},t.value)})})]})}),e(i,"renderFilters",function(){var e,t=(null===(e=i.dataViewContext.filterState)||void 0===e?void 0:e.filter)||{},r=Object.keys(t);return 0===r.length?n(l,{}):r.map(function(e){var r,a=(null!==(r=t[e])&&void 0!==r?r:[]).reduce(function(e,t){var i,r,a,n,l=t.label||(null===(i=t.value)||void 0===i?void 0:i.toString());"date"===t.type&&t.dateLogic&&(l="".concat(g[t.dateLogic]," ").concat(S(null!==(a=null===(n=t.value)||void 0===n?void 0:n.toString())&&void 0!==a?a:"","style2")));return t.value&&e.push({value:null===(r=t.value)||void 0===r?void 0:r.toString(),label:l}),e},[]);return n(s,{children:i.renderItems({field:e,label:e.toString(),items:a})},e.toString())})}),e(i,"renderSort",function(){var e,t,r=null===(e=i.dataViewContext.filterState)||void 0===e?void 0:e.sort;if(!r)return n(l,{});var a=null===(t=i.dataViewContext.filterBarConfigs.fields)||void 0===t?void 0:t[r.field],c=(null==a?void 0:a.label)||r.field.toString(),s=x[r.direction];return o(u,{className:w.item,children:[n(m,{variant:"caption",sx:{fontWeight:700},children:"Sort:"}),n(f,{clickable:!0,size:"small",label:o(u,{sx:{display:"flex",alignItems:"center",gap:.5},children:[n("span",{children:c}),s.icon]}),className:w.itemChip,onClick:i.toggleSortDirection,onDelete:function(){return i.removeSort()},title:"".concat(c," - ").concat(s.title)})]})}),e(i,"removeFilter",function(e,t){var r=p(i.dataViewContext.filterState).removeFilterItem(e,t.value,{reason:"filter"});i.dataViewContext.onFilterStateChange(r.build())}),e(i,"removeQuickSearch",function(e){var t=p(i.dataViewContext.filterState).removeQuickSearchItem(e.value,{reason:"quickSearch"});i.dataViewContext.onFilterStateChange(t.build())}),e(i,"removeSort",function(){var e=p(i.dataViewContext.filterState).removeSort({reason:"sort"});i.dataViewContext.onFilterStateChange(e.build())}),e(i,"toggleSortDirection",function(){var e=p(i.dataViewContext.filterState).toggleSortDirection({reason:"sort"});i.dataViewContext.onFilterStateChange(e.build())}),e(i,"handleClearAll",function(){var e=i.dataViewContext.filterBarConfigs.defaultValue||{},t=p(i.dataViewContext.filterState,e).reset();i.dataViewContext.onFilterStateChange(t.build())}),i.state={data:null,isClosing:!1},i}return t(d,c),i(d,[{key:"render",value:function(){var e=this;return C(function(t){if(e.dataViewContext=t,!e.dataViewContext)return n(l,{});var i=e.dataViewContext.filterBarConfigs.defaultValue,r=p(e.dataViewContext.filterState,i).isEmpty();return n(v,{in:!r,timeout:300,unmountOnExit:!0,orientation:"vertical",onExited:e.handleAnimationExited,children:o(k,{className:w.root,children:[o(u,{className:w.content,children:[e.renderSort(),e.renderQuickSearch(),e.renderFilters(),!r&&n(h,{className:w.removeButton,onClick:e.handleClearAll})]}),e.props.loading&&n(u,{className:w.overlay})]})})})}},{key:"renderQuickSearch",value:function(){var e,t=(null===(e=this.dataViewContext.filterState)||void 0===e?void 0:e.quickSearch)||[],i=(Array.isArray(t)?t:[t]).map(function(e){return{value:e}});return i&&0!==i.length?this.renderItems({label:"Quick search",items:i,isQuickSearch:!0}):n(l,{})}}])}()}var k=d(u)(e(e(e(e(e({position:"relative"},".".concat(w.content),{display:"flex",alignItems:"center",flexWrap:"wrap",gap:"8px"}),".".concat(w.item),{display:"flex",flexWrap:"wrap",border:"dashed 1px var(--color-divider, rgba(145 160 170 / 20%))",borderRadius:"4px",alignItems:"center",padding:"6px 8px",gap:"8px"}),".".concat(w.itemContent),{display:"flex",flexWrap:"wrap",gap:"4px"}),".".concat(w.itemChip),{borderRadius:"4px",height:"100%","& .MuiChip-label":{overflowWrap:"break-word",wordBreak:"break-word",whiteSpace:"normal",textOverflow:"clip"}}),".".concat(w.overlay),{position:"absolute",top:0,left:0,width:"100%",height:"100%",backdropFilter:"blur(1px)"}));export{w as activeFiltersPanelClasses,b as default};
+import{defineProperty as e,inherits as t,createClass as i,classCallCheck as r,callSuper as a}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,Fragment as l,jsxs as o}from"react/jsx-runtime";import{Component as c,Fragment as s}from"react";import{styled as d,Box as u,Collapse as m,Typography as v,Chip as f}from"@mui/material";import{createFilterStore as p}from"./filter-store.js";import{ClearAllButton as h,mapSortConfigs as x}from"./ui.units.js";import{mapDataViewContext as C}from"./context.js";import{formatDatetime as g}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";import{mapDateLogicText as S}from"./helpers.js";var w={root:"ActiveFiltersPanel-root",content:"ActiveFiltersPanel-content",item:"ActiveFiltersPanel-item",itemContent:"ActiveFiltersPanel-itemContent",itemChip:"ActiveFiltersPanel-itemChip",removeButton:"ActiveFiltersPanel-removeButton",overlay:"ActiveFiltersPanel-overlay"};function b(){return function(){function d(t){var i;return r(this,d),i=a(this,d,[t]),e(i,"handleAnimationExited",function(){i.setState({isClosing:!0})}),e(i,"renderItems",function(e){var t;return o(u,{className:w.item,children:[o(v,{variant:"caption",sx:{fontWeight:700},children:[e.label||(null===(t=e.field)||void 0===t?void 0:t.toString()),":"]}),n(u,{className:w.itemContent,children:e.items.map(function(t){return n(f,{clickable:!0,size:"small",label:t.label||t.value,className:w.itemChip,onDelete:function(){e.isQuickSearch?i.removeQuickSearch(t):e.field&&i.removeFilter(e.field,t)}},t.value)})})]})}),e(i,"renderFilters",function(){var e,t=(null===(e=i.dataViewContext.filterState)||void 0===e?void 0:e.filter)||{},r=Object.keys(t);return 0===r.length?n(l,{}):r.map(function(e){var r,a=(null!==(r=t[e])&&void 0!==r?r:[]).reduce(function(e,t){var i,r,a,n,l=t.label||(null===(i=t.value)||void 0===i?void 0:i.toString());"date"===t.type&&t.dateLogic&&(l="".concat(S[t.dateLogic]," ").concat(g(null!==(a=null===(n=t.value)||void 0===n?void 0:n.toString())&&void 0!==a?a:"","style2")));return t.value&&e.push({value:null===(r=t.value)||void 0===r?void 0:r.toString(),label:l}),e},[]);return n(s,{children:i.renderItems({field:e,label:e.toString(),items:a})},e.toString())})}),e(i,"renderSort",function(){var e,t,r=null===(e=i.dataViewContext.filterState)||void 0===e?void 0:e.sort;if(!r)return n(l,{});var a=null===(t=i.dataViewContext.filterBarConfigs.fields)||void 0===t?void 0:t[r.field],c=(null==a?void 0:a.label)||r.field.toString(),s=x[r.direction];return o(u,{className:w.item,children:[n(v,{variant:"caption",sx:{fontWeight:700},children:"Sort:"}),n(f,{clickable:!0,size:"small",label:o(u,{sx:{display:"flex",alignItems:"center",gap:.5},children:[n("span",{children:c}),s.icon]}),className:w.itemChip,onClick:i.toggleSortDirection,onDelete:function(){return i.removeSort()},title:"".concat(c," - ").concat(s.title)})]})}),e(i,"removeFilter",function(e,t){var r=p(i.dataViewContext.filterState).removeFilterItem(e,t.value,{reason:"filter"});i.dataViewContext.onFilterStateChange(r.build())}),e(i,"removeQuickSearch",function(e){var t=p(i.dataViewContext.filterState).removeQuickSearchItem(e.value,{reason:"quickSearch"});i.dataViewContext.onFilterStateChange(t.build())}),e(i,"removeSort",function(){var e=p(i.dataViewContext.filterState).removeSort({reason:"sort"});i.dataViewContext.onFilterStateChange(e.build())}),e(i,"toggleSortDirection",function(){var e=p(i.dataViewContext.filterState).toggleSortDirection({reason:"sort"});i.dataViewContext.onFilterStateChange(e.build())}),e(i,"handleClearAll",function(){var e=i.dataViewContext.filterBarConfigs.defaultValue||{},t=p(i.dataViewContext.filterState,e).reset();i.dataViewContext.onFilterStateChange(t.build())}),i.state={data:null,isClosing:!1},i}return t(d,c),i(d,[{key:"render",value:function(){var e=this;return C(function(t){if(e.dataViewContext=t,!e.dataViewContext)return n(l,{});var i=e.dataViewContext.filterBarConfigs.defaultValue,r=p(e.dataViewContext.filterState,i).isEmpty();return n(m,{in:!r,timeout:300,unmountOnExit:!0,orientation:"vertical",onExited:e.handleAnimationExited,children:o(k,{className:w.root,children:[o(u,{className:w.content,children:[e.renderSort(),e.renderQuickSearch(),e.renderFilters(),!r&&n(h,{className:w.removeButton,onClick:e.handleClearAll})]}),e.props.loading&&n(u,{className:w.overlay})]})})})}},{key:"renderQuickSearch",value:function(){var e,t=(null===(e=this.dataViewContext.filterState)||void 0===e?void 0:e.quickSearch)||[],i=(Array.isArray(t)?t:[t]).map(function(e){return{value:e}});return i&&0!==i.length?this.renderItems({label:"Quick search",items:i,isQuickSearch:!0}):n(l,{})}}])}()}var k=d(u)(e(e(e(e(e({position:"relative"},".".concat(w.content),{display:"flex",alignItems:"center",flexWrap:"wrap",gap:"8px"}),".".concat(w.item),{display:"flex",flexWrap:"wrap",border:"dashed 1px var(--color-divider, rgba(145 160 170 / 20%))",borderRadius:"4px",alignItems:"center",padding:"6px 8px",gap:"8px"}),".".concat(w.itemContent),{display:"flex",flexWrap:"wrap",gap:"4px"}),".".concat(w.itemChip),{borderRadius:"4px",height:"100%","& .MuiChip-label":{overflowWrap:"break-word",wordBreak:"break-word",whiteSpace:"normal",textOverflow:"clip"}}),".".concat(w.overlay),{position:"absolute",top:0,left:0,width:"100%",height:"100%",backdropFilter:"blur(1px)"}));export{w as activeFiltersPanelClasses,b as default};
 //# sourceMappingURL=create.active-filters-panel.js.map

package/dist/src/data-view/create.active-filters-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"create.active-filters-panel.js","sources":["../../../src/data-view/create.active-filters-panel.tsx"],"sourcesContent":["import React, { Component, ComponentType, Fragment } from 'react'\r\nimport { Box, Chip, Collapse, styled, Typography } from '@mui/material'\r\nimport { createFilterStore } from './filter-store'\r\nimport { ClearAllButton, mapSortConfigs } from './ui.units'\r\nimport { IDataViewContext, mapDataViewContext } from './context'\r\nimport { IFilterItem, IFilterMap, IFilterState, IItemBase } from './types'\r\nimport { formatDatetime } from '../utils'\r\nimport { mapDateLogicText } from './helpers'\r\n\r\nexport const activeFiltersPanelClasses = {\r\n  root: 'ActiveFiltersPanel-root',\r\n  content: 'ActiveFiltersPanel-content',\r\n  item: 'ActiveFiltersPanel-item',\r\n  itemContent: 'ActiveFiltersPanel-itemContent',\r\n  itemChip: 'ActiveFiltersPanel-itemChip',\r\n  removeButton: 'ActiveFiltersPanel-removeButton',\r\n  overlay: 'ActiveFiltersPanel-overlay'\r\n}\r\n\r\ninterface IRenderItemsParams<T> {\r\n  field?: keyof T\r\n  label?: string\r\n  items: IItemBase[]\r\n  isQuickSearch?: boolean\r\n}\r\n\r\nexport interface IActiveFiltersPanelProps {\r\n  loading?: boolean\r\n}\r\n\r\nexport interface IActiveFiltersPanelState<T> {\r\n  data: IFilterState<T> | null\r\n  isClosing: boolean\r\n}\r\n\r\nfunction createActiveFiltersPanel<T>(): ComponentType<IActiveFiltersPanelProps> {\r\n  class ActiveFiltersPanel extends Component<IActiveFiltersPanelProps, IActiveFiltersPanelState<T>> {\r\n    declare dataViewContext: IDataViewContext<T>\r\n\r\n    constructor(props: IActiveFiltersPanelProps) {\r\n      super(props)\r\n      this.state = {\r\n        data: null,\r\n        isClosing: false\r\n      }\r\n    }\r\n\r\n    // Handle animation completion\r\n    private handleAnimationExited = () => {\r\n      this.setState({ isClosing: true })\r\n    }\r\n\r\n    render() {\r\n      return mapDataViewContext((context) => {\r\n        this.dataViewContext = context\r\n        if (!this.dataViewContext) return <></>\r\n        const { defaultValue } = this.dataViewContext.filterBarConfigs\r\n        const isEmpty = createFilterStore(this.dataViewContext.filterState, defaultValue).isEmpty()\r\n        return (\r\n          <Collapse in={!isEmpty} timeout={300} unmountOnExit orientation='vertical' onExited={this.handleAnimationExited}>\r\n            <Wrap className={activeFiltersPanelClasses.root}>\r\n              <Box className={activeFiltersPanelClasses.content}>\r\n                {this.renderSort()}\r\n                {this.renderQuickSearch()}\r\n                {this.renderFilters()}\r\n                {!isEmpty && <ClearAllButton className={activeFiltersPanelClasses.removeButton} onClick={this.handleClearAll} />}\r\n              </Box>\r\n              {this.props.loading && <Box className={activeFiltersPanelClasses.overlay} />}\r\n            </Wrap>\r\n          </Collapse>\r\n        )\r\n      })\r\n    }\r\n\r\n    renderItems = (p: IRenderItemsParams<T>) => (\r\n      <Box className={activeFiltersPanelClasses.item}>\r\n        <Typography variant='caption' sx={{ fontWeight: 700 }}>\r\n          {p.label || p.field?.toString()}:\r\n        </Typography>\r\n        <Box className={activeFiltersPanelClasses.itemContent}>\r\n          {p.items.map((item) => (\r\n            <Chip\r\n              key={item.value}\r\n              clickable\r\n              size='small'\r\n              label={item.label || item.value}\r\n              className={activeFiltersPanelClasses.itemChip}\r\n              onDelete={() => {\r\n                if (p.isQuickSearch) {\r\n                  this.removeQuickSearch(item)\r\n                  return\r\n                }\r\n                if (!p.field) return\r\n                this.removeFilter(p.field, item)\r\n              }}\r\n            />\r\n          ))}\r\n        </Box>\r\n      </Box>\r\n    )\r\n\r\n    renderQuickSearch() {\r\n      const val = this.dataViewContext.filterState?.quickSearch || []\r\n      const list = (Array.isArray(val) ? val : [val]).map((value) => ({ value }))\r\n      if (!list || list.length === 0) return <></>\r\n      return this.renderItems({ label: 'Quick search', items: list, isQuickSearch: true })\r\n    }\r\n\r\n    renderFilters = () => {\r\n      const filter: IFilterMap<T> = this.dataViewContext.filterState?.filter || {}\r\n      const keys = Object.keys(filter) as Array<keyof T>\r\n      if (keys.length === 0) return <></>\r\n      return keys.map((key) => {\r\n        const filterItems = (filter[key] ?? []) as IFilterItem[]\r\n        const items = filterItems.reduce<IItemBase[]>((acc, item) => {\r\n          let label = item.label || item.value?.toString()\r\n          if (item.type === 'date' && item.dateLogic) {\r\n            label = `${mapDateLogicText[item.dateLogic]} ${formatDatetime(item.value?.toString() ?? '', 'style2')}`\r\n          }\r\n          if (!!item.value) acc.push({ value: item.value?.toString(), label })\r\n          return acc\r\n        }, [])\r\n        return <Fragment key={key.toString()}>{this.renderItems({ field: key, label: key.toString(), items })}</Fragment>\r\n      })\r\n    }\r\n\r\n    renderSort = () => {\r\n      const sort = this.dataViewContext.filterState?.sort\r\n      if (!sort) return <></>\r\n\r\n      const fieldConfig = this.dataViewContext.filterBarConfigs.fields?.[sort.field]\r\n      const fieldLabel = fieldConfig?.label || sort.field.toString()\r\n      const sortConfig = mapSortConfigs[sort.direction]\r\n\r\n      return (\r\n        <Box className={activeFiltersPanelClasses.item}>\r\n          <Typography variant='caption' sx={{ fontWeight: 700 }}>\r\n            Sort:\r\n          </Typography>\r\n          {/* <Box className={activeFiltersPanelClasses.itemContent}> */}\r\n          <Chip\r\n            clickable\r\n            size='small'\r\n            label={\r\n              <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>\r\n                <span>{fieldLabel}</span>\r\n                {sortConfig.icon}\r\n              </Box>\r\n            }\r\n            className={activeFiltersPanelClasses.itemChip}\r\n            onClick={this.toggleSortDirection}\r\n            onDelete={() => this.removeSort()}\r\n            title={`${fieldLabel} - ${sortConfig.title}`}\r\n          />\r\n          {/* </Box> */}\r\n        </Box>\r\n      )\r\n    }\r\n\r\n    removeFilter = (field: keyof T, item: IItemBase) => {\r\n      const store = createFilterStore(this.dataViewContext.filterState).removeFilterItem(field, item.value, { reason: 'filter' })\r\n      this.dataViewContext.onFilterStateChange(store.build())\r\n    }\r\n\r\n    removeQuickSearch = (item: IItemBase) => {\r\n      const store = createFilterStore(this.dataViewContext.filterState).removeQuickSearchItem(item.value, { reason: 'quickSearch' })\r\n      this.dataViewContext.onFilterStateChange(store.build())\r\n    }\r\n\r\n    removeSort = () => {\r\n      const store = createFilterStore(this.dataViewContext.filterState).removeSort({ reason: 'sort' })\r\n      this.dataViewContext.onFilterStateChange(store.build())\r\n    }\r\n\r\n    toggleSortDirection = () => {\r\n      const store = createFilterStore(this.dataViewContext.filterState).toggleSortDirection({ reason: 'sort' })\r\n      this.dataViewContext.onFilterStateChange(store.build())\r\n    }\r\n\r\n    handleClearAll = () => {\r\n      const fValue = this.dataViewContext.filterBarConfigs.defaultValue || {}\r\n      // Trực tiếp clear data, logic đóng sẽ được xử lý tự động\r\n      const store = createFilterStore(this.dataViewContext.filterState, fValue).reset()\r\n      this.dataViewContext.onFilterStateChange(store.build())\r\n    }\r\n  }\r\n\r\n  return ActiveFiltersPanel\r\n}\r\n\r\nexport default createActiveFiltersPanel\r\n\r\nconst Wrap = styled(Box)({\r\n  position: 'relative',\r\n  [`.${activeFiltersPanelClasses.content}`]: {\r\n    display: 'flex',\r\n    alignItems: 'center',\r\n    flexWrap: 'wrap',\r\n    gap: '8px'\r\n  },\r\n  [`.${activeFiltersPanelClasses.item}`]: {\r\n    display: 'flex',\r\n    flexWrap: 'wrap',\r\n    border: 'dashed 1px var(--color-divider, rgba(145 160 170 / 20%))',\r\n    borderRadius: '4px',\r\n    alignItems: 'center',\r\n    padding: '6px 8px',\r\n    gap: '8px'\r\n  },\r\n  [`.${activeFiltersPanelClasses.itemContent}`]: {\r\n    display: 'flex',\r\n    flexWrap: 'wrap',\r\n    gap: '4px'\r\n  },\r\n  [`.${activeFiltersPanelClasses.itemChip}`]: {\r\n    borderRadius: '4px',\r\n    height: '100%',\r\n    '& .MuiChip-label': {\r\n      overflowWrap: 'break-word',\r\n      wordBreak: 'break-word',\r\n      whiteSpace: 'normal',\r\n      textOverflow: 'clip'\r\n    }\r\n  },\r\n  [`.${activeFiltersPanelClasses.overlay}`]: {\r\n    position: 'absolute',\r\n    top: 0,\r\n    left: 0,\r\n    width: '100%',\r\n    height: '100%',\r\n    backdropFilter: 'blur(1px)'\r\n  }\r\n})\r\n"],"names":["activeFiltersPanelClasses","root","content","item","itemContent","itemChip","removeButton","overlay","createActiveFiltersPanel","ActiveFiltersPanel","props","_this","_classCallCheck","_callSuper","_defineProperty","setState","isClosing","p","_p$field","_jsxs","Box","className","children","Typography","variant","sx","fontWeight","label","field","toString","_jsx","items","map","Chip","clickable","size","value","onDelete","isQuickSearch","removeQuickSearch","removeFilter","_this$dataViewContext","filter","dataViewContext","filterState","keys","Object","length","key","_filter$key","reduce","acc","_item$value","_item$value3","_item$value$toString","_item$value2","type","dateLogic","concat","mapDateLogicText","formatDatetime","push","Fragment","renderItems","_this$dataViewContext2","_this$dataViewContext3","sort","fieldConfig","filterBarConfigs","fields","fieldLabel","sortConfig","mapSortConfigs","direction","display","alignItems","gap","icon","onClick","toggleSortDirection","removeSort","title","store","createFilterStore","removeFilterItem","reason","onFilterStateChange","build","removeQuickSearchItem","fValue","defaultValue","reset","state","data","_inherits","Component","_createClass","_this2","this","mapDataViewContext","context","isEmpty","Collapse","in","timeout","unmountOnExit","orientation","onExited","handleAnimationExited","Wrap","renderSort","renderQuickSearch","renderFilters","ClearAllButton","handleClearAll","loading","_this$dataViewContext4","val","quickSearch","list","Array","isArray","styled","position","flexWrap","border","borderRadius","padding","height","overflowWrap","wordBreak","whiteSpace","textOverflow","top","left","width","backdropFilter"],"mappings":"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"}
+{"version":3,"file":"create.active-filters-panel.js","sources":["../../../src/data-view/create.active-filters-panel.tsx"],"sourcesContent":["import React, { Component, ComponentType, Fragment } from 'react'\r\nimport { Box, Chip, Collapse, styled, Typography } from '@mui/material'\r\nimport { createFilterStore } from './filter-store'\r\nimport { ClearAllButton, mapSortConfigs } from './ui.units'\r\nimport { IDataViewContext, mapDataViewContext } from './context'\r\nimport { IFilterItem, IFilterMap, IFilterState, IItemBase } from './types'\r\nimport { formatDatetime } from '../utils'\r\nimport { mapDateLogicText } from './helpers'\r\n\r\nexport const activeFiltersPanelClasses = {\r\n  root: 'ActiveFiltersPanel-root',\r\n  content: 'ActiveFiltersPanel-content',\r\n  item: 'ActiveFiltersPanel-item',\r\n  itemContent: 'ActiveFiltersPanel-itemContent',\r\n  itemChip: 'ActiveFiltersPanel-itemChip',\r\n  removeButton: 'ActiveFiltersPanel-removeButton',\r\n  overlay: 'ActiveFiltersPanel-overlay'\r\n}\r\n\r\ninterface IRenderItemsParams<T> {\r\n  field?: keyof T\r\n  label?: string\r\n  items: IItemBase[]\r\n  isQuickSearch?: boolean\r\n}\r\n\r\nexport interface IActiveFiltersPanelProps {\r\n  loading?: boolean\r\n}\r\n\r\nexport interface IActiveFiltersPanelState<T> {\r\n  data: IFilterState<T> | null\r\n  isClosing: boolean\r\n}\r\n\r\nfunction createActiveFiltersPanel<T>(): ComponentType<IActiveFiltersPanelProps> {\r\n  class ActiveFiltersPanel extends Component<IActiveFiltersPanelProps, IActiveFiltersPanelState<T>> {\r\n    declare dataViewContext: IDataViewContext<T>\r\n\r\n    constructor(props: IActiveFiltersPanelProps) {\r\n      super(props)\r\n      this.state = {\r\n        data: null,\r\n        isClosing: false\r\n      }\r\n    }\r\n\r\n    // Handle animation completion\r\n    private handleAnimationExited = () => {\r\n      this.setState({ isClosing: true })\r\n    }\r\n\r\n    render() {\r\n      return mapDataViewContext((context) => {\r\n        this.dataViewContext = context\r\n        if (!this.dataViewContext) return <></>\r\n        const { defaultValue } = this.dataViewContext.filterBarConfigs\r\n        const isEmpty = createFilterStore(this.dataViewContext.filterState, defaultValue).isEmpty()\r\n        return (\r\n          <Collapse in={!isEmpty} timeout={300} unmountOnExit orientation='vertical' onExited={this.handleAnimationExited}>\r\n            <Wrap className={activeFiltersPanelClasses.root}>\r\n              <Box className={activeFiltersPanelClasses.content}>\r\n                {this.renderSort()}\r\n                {this.renderQuickSearch()}\r\n                {this.renderFilters()}\r\n                {!isEmpty && <ClearAllButton className={activeFiltersPanelClasses.removeButton} onClick={this.handleClearAll} />}\r\n              </Box>\r\n              {this.props.loading && <Box className={activeFiltersPanelClasses.overlay} />}\r\n            </Wrap>\r\n          </Collapse>\r\n        )\r\n      })\r\n    }\r\n\r\n    renderItems = (p: IRenderItemsParams<T>) => (\r\n      <Box className={activeFiltersPanelClasses.item}>\r\n        <Typography variant='caption' sx={{ fontWeight: 700 }}>\r\n          {p.label || p.field?.toString()}:\r\n        </Typography>\r\n        <Box className={activeFiltersPanelClasses.itemContent}>\r\n          {p.items.map((item) => (\r\n            <Chip\r\n              key={item.value}\r\n              clickable\r\n              size='small'\r\n              label={item.label || item.value}\r\n              className={activeFiltersPanelClasses.itemChip}\r\n              onDelete={() => {\r\n                if (p.isQuickSearch) {\r\n                  this.removeQuickSearch(item)\r\n                  return\r\n                }\r\n                if (!p.field) return\r\n                this.removeFilter(p.field, item)\r\n              }}\r\n            />\r\n          ))}\r\n        </Box>\r\n      </Box>\r\n    )\r\n\r\n    renderQuickSearch() {\r\n      const val = this.dataViewContext.filterState?.quickSearch || []\r\n      const list = (Array.isArray(val) ? val : [val]).map((value) => ({ value }))\r\n      if (!list || list.length === 0) return <></>\r\n      return this.renderItems({ label: 'Quick search', items: list, isQuickSearch: true })\r\n    }\r\n\r\n    renderFilters = () => {\r\n      const filter: IFilterMap<T> = this.dataViewContext.filterState?.filter || {}\r\n      const keys = Object.keys(filter) as Array<keyof T>\r\n      if (keys.length === 0) return <></>\r\n      return keys.map((key) => {\r\n        const filterItems = (filter[key] ?? []) as IFilterItem[]\r\n        const items = filterItems.reduce<IItemBase[]>((acc, item) => {\r\n          let label = item.label || item.value?.toString()\r\n          if (item.type === 'date' && item.dateLogic) {\r\n            label = `${mapDateLogicText[item.dateLogic]} ${formatDatetime(item.value?.toString() ?? '', 'style2')}`\r\n          }\r\n          if (!!item.value) acc.push({ value: item.value?.toString(), label })\r\n          return acc\r\n        }, [])\r\n        return <Fragment key={key.toString()}>{this.renderItems({ field: key, label: key.toString(), items })}</Fragment>\r\n      })\r\n    }\r\n\r\n    renderSort = () => {\r\n      const sort = this.dataViewContext.filterState?.sort\r\n      if (!sort) return <></>\r\n\r\n      const fieldConfig = this.dataViewContext.filterBarConfigs.fields?.[sort.field]\r\n      const fieldLabel = fieldConfig?.label || sort.field.toString()\r\n      const sortConfig = mapSortConfigs[sort.direction]\r\n\r\n      return (\r\n        <Box className={activeFiltersPanelClasses.item}>\r\n          <Typography variant='caption' sx={{ fontWeight: 700 }}>\r\n            Sort:\r\n          </Typography>\r\n          {/* <Box className={activeFiltersPanelClasses.itemContent}> */}\r\n          <Chip\r\n            clickable\r\n            size='small'\r\n            label={\r\n              <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>\r\n                <span>{fieldLabel}</span>\r\n                {sortConfig.icon}\r\n              </Box>\r\n            }\r\n            className={activeFiltersPanelClasses.itemChip}\r\n            onClick={this.toggleSortDirection}\r\n            onDelete={() => this.removeSort()}\r\n            title={`${fieldLabel} - ${sortConfig.title}`}\r\n          />\r\n          {/* </Box> */}\r\n        </Box>\r\n      )\r\n    }\r\n\r\n    removeFilter = (field: keyof T, item: IItemBase) => {\r\n      const store = createFilterStore(this.dataViewContext.filterState).removeFilterItem(field, item.value, { reason: 'filter' })\r\n      this.dataViewContext.onFilterStateChange(store.build())\r\n    }\r\n\r\n    removeQuickSearch = (item: IItemBase) => {\r\n      const store = createFilterStore(this.dataViewContext.filterState).removeQuickSearchItem(item.value, { reason: 'quickSearch' })\r\n      this.dataViewContext.onFilterStateChange(store.build())\r\n    }\r\n\r\n    removeSort = () => {\r\n      const store = createFilterStore(this.dataViewContext.filterState).removeSort({ reason: 'sort' })\r\n      this.dataViewContext.onFilterStateChange(store.build())\r\n    }\r\n\r\n    toggleSortDirection = () => {\r\n      const store = createFilterStore(this.dataViewContext.filterState).toggleSortDirection({ reason: 'sort' })\r\n      this.dataViewContext.onFilterStateChange(store.build())\r\n    }\r\n\r\n    handleClearAll = () => {\r\n      const fValue = this.dataViewContext.filterBarConfigs.defaultValue || {}\r\n      // Trực tiếp clear data, logic đóng sẽ được xử lý tự động\r\n      const store = createFilterStore(this.dataViewContext.filterState, fValue).reset()\r\n      this.dataViewContext.onFilterStateChange(store.build())\r\n    }\r\n  }\r\n\r\n  return ActiveFiltersPanel\r\n}\r\n\r\nexport default createActiveFiltersPanel\r\n\r\nconst Wrap = styled(Box)({\r\n  position: 'relative',\r\n  [`.${activeFiltersPanelClasses.content}`]: {\r\n    display: 'flex',\r\n    alignItems: 'center',\r\n    flexWrap: 'wrap',\r\n    gap: '8px'\r\n  },\r\n  [`.${activeFiltersPanelClasses.item}`]: {\r\n    display: 'flex',\r\n    flexWrap: 'wrap',\r\n    border: 'dashed 1px var(--color-divider, rgba(145 160 170 / 20%))',\r\n    borderRadius: '4px',\r\n    alignItems: 'center',\r\n    padding: '6px 8px',\r\n    gap: '8px'\r\n  },\r\n  [`.${activeFiltersPanelClasses.itemContent}`]: {\r\n    display: 'flex',\r\n    flexWrap: 'wrap',\r\n    gap: '4px'\r\n  },\r\n  [`.${activeFiltersPanelClasses.itemChip}`]: {\r\n    borderRadius: '4px',\r\n    height: '100%',\r\n    '& .MuiChip-label': {\r\n      overflowWrap: 'break-word',\r\n      wordBreak: 'break-word',\r\n      whiteSpace: 'normal',\r\n      textOverflow: 'clip'\r\n    }\r\n  },\r\n  [`.${activeFiltersPanelClasses.overlay}`]: {\r\n    position: 'absolute',\r\n    top: 0,\r\n    left: 0,\r\n    width: '100%',\r\n    height: '100%',\r\n    backdropFilter: 'blur(1px)'\r\n  }\r\n})\r\n"],"names":["activeFiltersPanelClasses","root","content","item","itemContent","itemChip","removeButton","overlay","createActiveFiltersPanel","ActiveFiltersPanel","props","_this","_classCallCheck","_callSuper","_defineProperty","setState","isClosing","p","_p$field","_jsxs","Box","className","children","Typography","variant","sx","fontWeight","label","field","toString","_jsx","items","map","Chip","clickable","size","value","onDelete","isQuickSearch","removeQuickSearch","removeFilter","_this$dataViewContext","filter","dataViewContext","filterState","keys","Object","length","key","_filter$key","reduce","acc","_item$value","_item$value3","_item$value$toString","_item$value2","type","dateLogic","concat","mapDateLogicText","formatDatetime","push","Fragment","renderItems","_this$dataViewContext2","_this$dataViewContext3","sort","fieldConfig","filterBarConfigs","fields","fieldLabel","sortConfig","mapSortConfigs","direction","display","alignItems","gap","icon","onClick","toggleSortDirection","removeSort","title","store","createFilterStore","removeFilterItem","reason","onFilterStateChange","build","removeQuickSearchItem","fValue","defaultValue","reset","state","data","_inherits","Component","_createClass","_this2","this","mapDataViewContext","context","isEmpty","Collapse","in","timeout","unmountOnExit","orientation","onExited","handleAnimationExited","Wrap","renderSort","renderQuickSearch","renderFilters","ClearAllButton","handleClearAll","loading","_this$dataViewContext4","val","quickSearch","list","Array","isArray","styled","position","flexWrap","border","borderRadius","padding","height","overflowWrap","wordBreak","whiteSpace","textOverflow","top","left","width","backdropFilter"],"mappings":"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"}

package/dist/src/data-view/create.data-view.js

@@ -1,2 +1,2 @@
-import{inherits as e,createClass as i,objectSpread2 as t,classCallCheck as o,callSuper as n,defineProperty as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as r,jsxs as a,Fragment as s}from"react/jsx-runtime";import{Component as d}from"react";import{styled as u,Box as v,Stack as f}from"@mui/material";import{SortButton as p}from"./ui.units.js";import{createViewMode as g}from"./create.view-mode.js";import{defaultViewMode as h,ViewModeButtons as c}from"./view-mode.units.js";import{getViewModeFromURL as C,syncViewModeToURL as m}from"./query-param-url.js";import{defaultFilterBarState as w,DataViewContext as S}from"./context.js";import{createFilterBar as y}from"./create.filter-bar.js";import M from"./scroll-tracking.js";import{createPaginationBar as B}from"./create.pagination-bar.js";import{createPopperPanel as H}from"./create.popper-panel.js";import P from"./create.active-filters-panel.js";function b(u){var b=y(),k=H(),F=P(),V=g(u.viewMode),T=B();return function(){function g(e){var i;return o(this,g),i=n(this,g,[e]),l(i,"mergeConfig",function(e){var t,o,n,l,r=e.slots;i.configCache={filterBar:Object.assign({},u.filterBar,null==r?void 0:r.filterBarConfigs),viewMode:null==r?void 0:r.viewModeConfigs,paginationBar:Object.assign({},u.paginationBar,null==r?void 0:r.paginationBarConfigs),enablePaginationTop:null!==(t=null!==(o=null==r||null===(n=r.paginationBarConfigs)||void 0===n?void 0:n.enablePaginationTop)&&void 0!==o?o:null===(l=u.paginationBar)||void 0===l?void 0:l.enablePaginationTop)&&void 0!==t&&t,scrollTracking:Object.assign({},u.scrollTracking,null==r?void 0:r.scrollTracking),autoHeight:e.autoHeight||u.autoHeight||!1}}),l(i,"configCache",{}),l(i,"refFilterButton",null),l(i,"refSortButton",null),l(i,"renderFooter",function(){var e,o,n,l,a=(null===(e=i.props.slots)||void 0===e?void 0:e.footerProps)||{};return r(j,t(t({},a.wrapProps),{},{children:!1!==a.enablePagination&&r(T,t({count:null!==(o=null===(n=i.props.data)||void 0===n?void 0:n.totalItems)&&void 0!==o?o:0,defaultFilter:null===(l=i.internalConfig.filterBar)||void 0===l?void 0:l.defaultValue,filter:i.filterState,onChange:i.onFilterStateChangeHandler},i.internalConfig.paginationBar))}))}),l(i,"onViewModeChangeHandler",function(e){i.setState({viewMode:e},function(){var t,o;if(i.props.syncViewModeToURL){var n,l,r,a,s=null!==(n=null!==(l=null===(r=i.internalConfig.viewMode)||void 0===r?void 0:r.defaultValue)&&void 0!==l?l:null===(a=u.viewMode)||void 0===a?void 0:a.defaultValue)&&void 0!==n?n:h;m({viewMode:e,defaultViewMode:s})}null===(t=(o=i.props).onViewModeChange)||void 0===t||t.call(o,e)})}),l(i,"onKeywordChangeHandler",function(e){return i.setState({keyword:e})}),l(i,"onScrollChangeHandler",function(e){return i.setState({scrolled:e.isScrolled})}),l(i,"onPopperPanelChangeHandler",function(e,t){return i.setState({anchorEl:e,area:t})}),l(i,"onClearHandler",function(){return i.setState(w)}),l(i,"onPanelCloseHandler",function(){i.setState({anchorEl:null,area:void 0,keyword:""})}),l(i,"onFilterStateChangeHandler",function(e){i.props.filter||i.setState(t(t({},w),{},{filterState:e})),i.props.onFilterChange&&i.props.onFilterChange(e),i.props.filter&&i.setState(w)}),i.mergeConfig(e),i.state=i.getDefaultState(e),i}return e(g,d),i(g,[{key:"getDefaultState",value:function(e){var i,o,n,l,r,a,s=null!==(i=null!==(o=null===(n=e.slots)||void 0===n||null===(n=n.viewModeConfigs)||void 0===n?void 0:n.defaultValue)&&void 0!==o?o:null===(l=u.viewMode)||void 0===l?void 0:l.defaultValue)&&void 0!==i?i:h,d=e.syncViewModeToURL?C({defaultViewMode:s}):s;return t(t({},w),{},{filterState:null!==(r=null===(a=this.internalConfig.filterBar)||void 0===a?void 0:a.defaultValue)&&void 0!==r?r:{},viewMode:d})}},{key:"filterState",get:function(){var e;return null!==(e=this.props.filter)&&void 0!==e?e:this.state.filterState}},{key:"viewMode",get:function(){var e;return null!==(e=this.props.viewMode)&&void 0!==e?e:this.state.viewMode}},{key:"internalConfig",get:function(){return this.configCache}},{key:"shouldComponentUpdate",value:function(e){var i,t,o,n,l=JSON.stringify(null===(i=e.slots)||void 0===i?void 0:i.filterBarConfigs)!==JSON.stringify(null===(t=this.props.slots)||void 0===t?void 0:t.filterBarConfigs),r=JSON.stringify(null===(o=e.slots)||void 0===o?void 0:o.viewModeConfigs)!==JSON.stringify(null===(n=this.props.slots)||void 0===n?void 0:n.viewModeConfigs);return(l||r)&&this.mergeConfig(e),!0}},{key:"render",value:function(){var e,i,o,n,l,d,u,g,h,C,m,w,y,B,H,P,j,I={keyword:this.state.keyword.trim(),filterBarConfigs:null!==(e=this.internalConfig.filterBar)&&void 0!==e?e:{},filterState:this.filterState,anchorEl:this.state.anchorEl,area:this.state.area,viewMode:this.state.viewMode,scrolled:this.state.scrolled,onFilterStateChange:this.onFilterStateChangeHandler,onKeywordChange:this.onKeywordChangeHandler,onPopperPanelChange:this.onPopperPanelChangeHandler,onPanelClose:this.onPanelCloseHandler,onClear:this.onClearHandler};return r(S.Provider,{value:I,children:a(f,{sx:{height:"100%",flex:1},children:[(null===(i=this.internalConfig.filterBar)||void 0===i?void 0:i.enableSticky)&&r(M,t({onChange:this.onScrollChangeHandler},this.internalConfig.scrollTracking)),null===(o=this.props.slots)||void 0===o||null===(o=o.filterSlots)||void 0===o?void 0:o.above,r(b,{id:null===(n=this.internalConfig.scrollTracking)||void 0===n?void 0:n.elementId,slots:t(t({},null===(l=this.props.slots)||void 0===l?void 0:l.primaryInputSlots),{},{right:a(s,{children:[(null===(d=this.internalConfig.filterBar)||void 0===d?void 0:d.enableSort)&&r(p,{}),null===(u=this.props.slots)||void 0===u||null===(u=u.primaryInputSlots)||void 0===u?void 0:u.right]})}),children:r(k,{})}),null===(g=this.props.slots)||void 0===g||null===(g=g.filterSlots)||void 0===g?void 0:g.below,null===(h=this.props.slots)||void 0===h||null===(h=h.activeFiltersPanelSlots)||void 0===h?void 0:h.above,a(x,{children:[r(c,{value:this.state.viewMode,onChange:this.onViewModeChangeHandler}),null===(C=this.props.slots)||void 0===C||null===(C=C.activeFiltersPanelSlots)||void 0===C?void 0:C.left,a(f,{flexDirection:"row",sx:{flexWrap:"wrap",alignItems:"center",gap:1,flexGrow:1},children:[r(F,{loading:this.props.loading}),r(v,{sx:{display:"flex",alignItems:"center",gap:1,flexGrow:1,justifyContent:"end"},children:this.internalConfig.enablePaginationTop&&r(T,t({count:null!==(m=null===(w=this.props.data)||void 0===w?void 0:w.totalItems)&&void 0!==m?m:0,defaultFilter:null===(y=this.internalConfig.filterBar)||void 0===y?void 0:y.defaultValue,filter:this.filterState,onChange:this.onFilterStateChangeHandler},this.internalConfig.paginationBar))})]}),null===(B=this.props.slots)||void 0===B||null===(B=B.activeFiltersPanelSlots)||void 0===B?void 0:B.right]}),null===(H=this.props.slots)||void 0===H||null===(H=H.activeFiltersPanelSlots)||void 0===H?void 0:H.below,r(V,{data:null!==(P=null===(j=this.props.data)||void 0===j?void 0:j.items)&&void 0!==P?P:[],viewMode:this.viewMode,loading:this.props.loading,error:this.props.error,autoHeight:this.internalConfig.autoHeight,slots:this.internalConfig.viewMode}),this.renderFooter()]})})}}])}()}var x=u(v)({display:"flex",alignItems:"center",flexWrap:"wrap",gap:"8px",marginBottom:"8px",minHeight:"var(--filter-bar-height, 40px)"}),j=u(v)({display:"flex",justifyContent:"flex-end",width:"100%"});export{b as default};
+import{inherits as e,createClass as i,objectSpread2 as t,classCallCheck as o,callSuper as l,defineProperty as n}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as r,jsxs as a,Fragment as s}from"react/jsx-runtime";import{Component as d}from"react";import{styled as u,Box as v,Stack as f}from"@mui/material";import{SortButton as p}from"./ui.units.js";import{createViewMode as g}from"./create.view-mode.js";import{defaultViewMode as h,ViewModeButtons as c}from"./view-mode.units.js";import{getViewModeFromURL as C,syncViewModeToURL as m}from"./query-param-url.js";import{defaultFilterBarState as w,DataViewContext as S}from"./context.js";import{createFilterBar as y}from"./create.filter-bar.js";import M from"./scroll-tracking.js";import{createPaginationBar as B}from"./create.pagination-bar.js";import{createPopperPanel as H}from"./create.popper-panel.js";import P from"./create.active-filters-panel.js";function b(u){var b=y(),k=H(),F=P(),V=g(u.viewMode),T=B();return function(){function g(e){var i;return o(this,g),i=l(this,g,[e]),n(i,"mergeConfig",function(e){var t,o,l,n,r=e.slots;i.configCache={filterBar:Object.assign({},u.filterBar,null==r?void 0:r.filterBarConfigs),viewMode:null==r?void 0:r.viewModeConfigs,paginationBar:Object.assign({},u.paginationBar,null==r?void 0:r.paginationBarConfigs),enablePaginationTop:null!==(t=null!==(o=null==r||null===(l=r.paginationBarConfigs)||void 0===l?void 0:l.enablePaginationTop)&&void 0!==o?o:null===(n=u.paginationBar)||void 0===n?void 0:n.enablePaginationTop)&&void 0!==t&&t,scrollTracking:Object.assign({},u.scrollTracking,null==r?void 0:r.scrollTracking),autoHeight:e.autoHeight||u.autoHeight||!1}}),n(i,"configCache",{}),n(i,"refFilterButton",null),n(i,"refSortButton",null),n(i,"renderFooter",function(){var e,o,l,n,a=(null===(e=i.props.slots)||void 0===e?void 0:e.footerProps)||{};return r(j,t(t({},a.wrapProps),{},{children:!1!==a.enablePagination&&r(T,t({count:null!==(o=null===(l=i.props.data)||void 0===l?void 0:l.totalItems)&&void 0!==o?o:0,defaultFilter:null===(n=i.internalConfig.filterBar)||void 0===n?void 0:n.defaultValue,filter:i.filterState,onChange:i.onFilterStateChangeHandler},i.internalConfig.paginationBar))}))}),n(i,"onViewModeChangeHandler",function(e){i.setState({viewMode:e},function(){var t,o;if(i.props.syncViewModeToURL){var l,n,r,a,s=null!==(l=null!==(n=null===(r=i.internalConfig.viewMode)||void 0===r?void 0:r.defaultValue)&&void 0!==n?n:null===(a=u.viewMode)||void 0===a?void 0:a.defaultValue)&&void 0!==l?l:h;m({viewMode:e,defaultViewMode:s})}null===(t=(o=i.props).onViewModeChange)||void 0===t||t.call(o,e)})}),n(i,"onKeywordChangeHandler",function(e){return i.setState({keyword:e})}),n(i,"onScrollChangeHandler",function(e){return i.setState({scrolled:e.isScrolled})}),n(i,"onPopperPanelChangeHandler",function(e,t){return i.setState({anchorEl:e,area:t})}),n(i,"onClearHandler",function(){return i.setState(w)}),n(i,"onPanelCloseHandler",function(){i.setState({anchorEl:null,area:void 0,keyword:""})}),n(i,"onFilterStateChangeHandler",function(e){i.props.filter||i.setState(t(t({},w),{},{filterState:e})),i.props.onFilterChange&&i.props.onFilterChange(e),i.props.filter&&i.setState(w)}),i.mergeConfig(e),i.state=i.getDefaultState(e),i}return e(g,d),i(g,[{key:"getDefaultState",value:function(e){var i,o,l,n,r,a,s=null!==(i=null!==(o=null===(l=e.slots)||void 0===l||null===(l=l.viewModeConfigs)||void 0===l?void 0:l.defaultValue)&&void 0!==o?o:null===(n=u.viewMode)||void 0===n?void 0:n.defaultValue)&&void 0!==i?i:h,d=e.syncViewModeToURL?C({defaultViewMode:s}):s;return t(t({},w),{},{filterState:null!==(r=null===(a=this.internalConfig.filterBar)||void 0===a?void 0:a.defaultValue)&&void 0!==r?r:{},viewMode:d})}},{key:"filterState",get:function(){var e;return null!==(e=this.props.filter)&&void 0!==e?e:this.state.filterState}},{key:"viewMode",get:function(){var e;return null!==(e=this.props.viewMode)&&void 0!==e?e:this.state.viewMode}},{key:"internalConfig",get:function(){return this.configCache}},{key:"shouldComponentUpdate",value:function(e){var i,t,o,l,n=JSON.stringify(null===(i=e.slots)||void 0===i?void 0:i.filterBarConfigs)!==JSON.stringify(null===(t=this.props.slots)||void 0===t?void 0:t.filterBarConfigs),r=JSON.stringify(null===(o=e.slots)||void 0===o?void 0:o.viewModeConfigs)!==JSON.stringify(null===(l=this.props.slots)||void 0===l?void 0:l.viewModeConfigs);return(n||r)&&this.mergeConfig(e),!0}},{key:"render",value:function(){var e,i,o,l,n,d,u,g,h,C,m,w,y,B,H,P,j,I,O={keyword:this.state.keyword.trim(),filterBarConfigs:null!==(e=this.internalConfig.filterBar)&&void 0!==e?e:{},filterState:this.filterState,anchorEl:this.state.anchorEl,area:this.state.area,viewMode:this.state.viewMode,scrolled:this.state.scrolled,onFilterStateChange:this.onFilterStateChangeHandler,onKeywordChange:this.onKeywordChangeHandler,onPopperPanelChange:this.onPopperPanelChangeHandler,onPanelClose:this.onPanelCloseHandler,onClear:this.onClearHandler};return r(S.Provider,{value:O,children:a(f,{sx:{height:"100%",flex:1},children:[null===(i=this.props.slots)||void 0===i?void 0:i.title,(null===(o=this.internalConfig.filterBar)||void 0===o?void 0:o.enableSticky)&&r(M,t({onChange:this.onScrollChangeHandler},this.internalConfig.scrollTracking)),null===(l=this.props.slots)||void 0===l||null===(l=l.filterSlots)||void 0===l?void 0:l.above,r(b,{id:null===(n=this.internalConfig.scrollTracking)||void 0===n?void 0:n.elementId,slots:t(t({},null===(d=this.props.slots)||void 0===d?void 0:d.primaryInputSlots),{},{right:a(s,{children:[(null===(u=this.internalConfig.filterBar)||void 0===u?void 0:u.enableSort)&&r(p,{}),null===(g=this.props.slots)||void 0===g||null===(g=g.primaryInputSlots)||void 0===g?void 0:g.right]})}),children:r(k,{})}),null===(h=this.props.slots)||void 0===h||null===(h=h.filterSlots)||void 0===h?void 0:h.below,null===(C=this.props.slots)||void 0===C||null===(C=C.activeFiltersPanelSlots)||void 0===C?void 0:C.above,a(x,{children:[r(c,{value:this.state.viewMode,onChange:this.onViewModeChangeHandler}),null===(m=this.props.slots)||void 0===m||null===(m=m.activeFiltersPanelSlots)||void 0===m?void 0:m.left,a(f,{flexDirection:"row",sx:{flexWrap:"wrap",alignItems:"center",gap:1,flexGrow:1},children:[r(F,{loading:this.props.loading}),r(v,{sx:{display:"flex",alignItems:"center",gap:1,flexGrow:1,justifyContent:"end"},children:this.internalConfig.enablePaginationTop&&r(T,t({count:null!==(w=null===(y=this.props.data)||void 0===y?void 0:y.totalItems)&&void 0!==w?w:0,defaultFilter:null===(B=this.internalConfig.filterBar)||void 0===B?void 0:B.defaultValue,filter:this.filterState,onChange:this.onFilterStateChangeHandler},this.internalConfig.paginationBar))})]}),null===(H=this.props.slots)||void 0===H||null===(H=H.activeFiltersPanelSlots)||void 0===H?void 0:H.right]}),null===(P=this.props.slots)||void 0===P||null===(P=P.activeFiltersPanelSlots)||void 0===P?void 0:P.below,r(V,{data:null!==(j=null===(I=this.props.data)||void 0===I?void 0:I.items)&&void 0!==j?j:[],viewMode:this.viewMode,loading:this.props.loading,error:this.props.error,autoHeight:this.internalConfig.autoHeight,slots:this.internalConfig.viewMode}),this.renderFooter()]})})}}])}()}var x=u(v)({display:"flex",alignItems:"center",flexWrap:"wrap",gap:"8px",marginBottom:"8px",minHeight:"var(--filter-bar-height, 40px)"}),j=u(v)({display:"flex",justifyContent:"flex-end",width:"100%"});export{b as default};
 //# sourceMappingURL=create.data-view.js.map

package/dist/src/data-view/create.data-view.js.map

@@ -1 +1 @@
-{"version":3,"file":"create.data-view.js","sources":["../../../src/data-view/create.data-view.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Box, BoxProps, Stack, styled } from '@mui/material'\r\nimport { SortButton } from './ui.units'\r\nimport { createViewMode } from './create.view-mode'\r\nimport { defaultViewMode, ViewModeButtons } from './view-mode.units'\r\nimport { getViewModeFromURL, syncViewModeToURL } from './query-param-url'\r\nimport { EViewMode, IViewModeConfigs, IViewModeValidModel } from './view-mode.types'\r\nimport { IFilterBarConfigs, IFilterState, IFilterStateChangeHandler, IPositionElement, IViewData } from './types'\r\nimport { defaultFilterBarState, DataViewContext, IDataViewState, IDataViewContext, OnPanelValueChange } from './context'\r\nimport createFilterBar, { IFilterBarSlots } from './create.filter-bar'\r\nimport ScrollTracking, { IScrollTrackingData, IScrollTrackingOptions } from './scroll-tracking'\r\nimport createPaginationBar, { IPaginationBarConfigs } from './create.pagination-bar'\r\nimport createPopperPanel from './create.popper-panel'\r\nimport createActiveFiltersPanel from './create.active-filters-panel'\r\n\r\nexport const filterBarClasses = {\r\n  root: 'FilterBar-root',\r\n  content: 'FilterBar-content',\r\n  input: 'FilterBar-input',\r\n  inputWrap: 'FilterBar-inputWrap',\r\n  label: 'FilterBar-label',\r\n  button: 'FilterBar-button',\r\n  spacing: 'FilterBar-spacing',\r\n  panel: 'FilterBar-panel',\r\n  sticky: 'FilterBar-sticky',\r\n  shadow: 'FilterBar-shadow'\r\n}\r\n\r\nexport interface IDataViewSlots<T extends IViewModeValidModel> {\r\n  filterWrapProps?: BoxProps\r\n  filterSlots?: IPositionElement\r\n  activeFiltersPanelSlots?: IPositionElement\r\n  primaryInputSlots?: IFilterBarSlots\r\n  filterBarConfigs?: IFilterBarConfigs<T>\r\n  viewModeConfigs?: IViewModeConfigs<T>\r\n  paginationBarConfigs?: IPaginationBarConfigs\r\n  scrollTracking?: IScrollTrackingOptions\r\n  footerProps?: {\r\n    wrapProps?: BoxProps\r\n    enablePagination?: boolean\r\n  }\r\n}\r\n\r\nexport interface IDataViewProps<T extends IViewModeValidModel> {\r\n  loading?: boolean\r\n  error?: string\r\n  data?: IViewData<T>\r\n  filter?: IFilterState<T>\r\n  onFilterChange?: (value: IFilterState<T>) => void\r\n  viewMode?: EViewMode\r\n  onViewModeChange?: (value: EViewMode) => void\r\n  syncViewModeToURL?: boolean\r\n  autoHeight?: boolean\r\n  slots?: IDataViewSlots<T>\r\n}\r\n\r\nexport interface IDataViewConfigs<T extends IViewModeValidModel> {\r\n  autoHeight?: boolean\r\n  filterBar?: IFilterBarConfigs<T>\r\n  viewMode?: IViewModeConfigs<T>\r\n  paginationBar?: IPaginationBarConfigs\r\n  scrollTracking?: IScrollTrackingOptions\r\n}\r\n\r\ninterface IInternalConfigs<T extends IViewModeValidModel> extends IDataViewConfigs<T> {\r\n  enablePaginationTop?: boolean\r\n  scrollTracking?: IScrollTrackingOptions\r\n}\r\n\r\nfunction createDataView<T extends IViewModeValidModel>(configs: IDataViewConfigs<T>): ComponentType<IDataViewProps<T>> {\r\n  const FilterBarInstance = createFilterBar<T>()\r\n  const PopperPanelInstance = createPopperPanel<T>()\r\n  const ActiveFiltersPanelInstance = createActiveFiltersPanel<T>()\r\n  const ViewModeInstance = createViewMode<T>(configs.viewMode)\r\n  const PaginationBarInstance = createPaginationBar<T>()\r\n\r\n  class DataView extends Component<IDataViewProps<T>, IDataViewState<T>> {\r\n    constructor(props: IDataViewProps<T>) {\r\n      super(props)\r\n      this.mergeConfig(props)\r\n      this.state = this.getDefaultState(props)\r\n    }\r\n\r\n    private getDefaultState(currentProps: IDataViewProps<T>): IDataViewState<T> {\r\n      const defaultValue = currentProps.slots?.viewModeConfigs?.defaultValue ?? configs.viewMode?.defaultValue ?? defaultViewMode\r\n      const viewMode = currentProps.syncViewModeToURL ? getViewModeFromURL<T>({ defaultViewMode: defaultValue }) : defaultValue\r\n      return {\r\n        ...defaultFilterBarState,\r\n        filterState: this.internalConfig.filterBar?.defaultValue ?? {},\r\n        viewMode\r\n      }\r\n    }\r\n\r\n    get filterState(): IFilterState<T> {\r\n      return this.props.filter ?? this.state.filterState\r\n    }\r\n\r\n    get viewMode(): EViewMode | undefined {\r\n      return this.props.viewMode ?? this.state.viewMode\r\n    }\r\n\r\n    private mergeConfig = (currentProps: IDataViewProps<T>) => {\r\n      const { slots } = currentProps\r\n      this.configCache = {\r\n        filterBar: Object.assign({}, configs.filterBar, slots?.filterBarConfigs),\r\n        viewMode: slots?.viewModeConfigs,\r\n        paginationBar: Object.assign({}, configs.paginationBar, slots?.paginationBarConfigs),\r\n        enablePaginationTop: slots?.paginationBarConfigs?.enablePaginationTop ?? configs.paginationBar?.enablePaginationTop ?? false,\r\n        scrollTracking: Object.assign({}, configs.scrollTracking, slots?.scrollTracking),\r\n        autoHeight: currentProps.autoHeight || configs.autoHeight || false\r\n      }\r\n    }\r\n\r\n    private configCache: IInternalConfigs<T> = {}\r\n    get internalConfig() {\r\n      return this.configCache\r\n    }\r\n\r\n    shouldComponentUpdate(nextProps: Readonly<IDataViewProps<T>>): boolean {\r\n      const filterDiff = JSON.stringify(nextProps.slots?.filterBarConfigs) !== JSON.stringify(this.props.slots?.filterBarConfigs)\r\n      const viewModeDiff = JSON.stringify(nextProps.slots?.viewModeConfigs) !== JSON.stringify(this.props.slots?.viewModeConfigs)\r\n      if (filterDiff || viewModeDiff) this.mergeConfig(nextProps)\r\n      return true\r\n    }\r\n\r\n    refFilterButton: HTMLButtonElement | null = null\r\n    refSortButton: HTMLButtonElement | null = null\r\n    render() {\r\n      const mapContext: IDataViewContext<T> = {\r\n        keyword: this.state.keyword.trim(),\r\n        filterBarConfigs: this.internalConfig.filterBar ?? {},\r\n        filterState: this.filterState,\r\n        anchorEl: this.state.anchorEl,\r\n        area: this.state.area,\r\n        viewMode: this.state.viewMode,\r\n        scrolled: this.state.scrolled,\r\n        onFilterStateChange: this.onFilterStateChangeHandler,\r\n        onKeywordChange: this.onKeywordChangeHandler,\r\n        onPopperPanelChange: this.onPopperPanelChangeHandler,\r\n        onPanelClose: this.onPanelCloseHandler,\r\n        onClear: this.onClearHandler\r\n      }\r\n\r\n      return (\r\n        <DataViewContext.Provider value={mapContext}>\r\n          <Stack sx={{ height: '100%', flex: 1 }}>\r\n            {this.internalConfig.filterBar?.enableSticky && (\r\n              <ScrollTracking onChange={this.onScrollChangeHandler} {...this.internalConfig.scrollTracking} />\r\n            )}\r\n            {this.props.slots?.filterSlots?.above}\r\n            <FilterBarInstance\r\n              id={this.internalConfig.scrollTracking?.elementId}\r\n              slots={{\r\n                ...this.props.slots?.primaryInputSlots,\r\n                right: (\r\n                  <>\r\n                    {this.internalConfig.filterBar?.enableSort && <SortButton />}\r\n                    {this.props.slots?.primaryInputSlots?.right}\r\n                  </>\r\n                )\r\n              }}\r\n            >\r\n              <PopperPanelInstance />\r\n            </FilterBarInstance>\r\n            {this.props.slots?.filterSlots?.below}\r\n            {this.props.slots?.activeFiltersPanelSlots?.above}\r\n            <FilterBarPanel>\r\n              <ViewModeButtons value={this.state.viewMode} onChange={this.onViewModeChangeHandler} />\r\n              {this.props.slots?.activeFiltersPanelSlots?.left}\r\n              <Stack flexDirection={'row'} sx={{ flexWrap: 'wrap', alignItems: 'center', gap: 1, flexGrow: 1 }}>\r\n                <ActiveFiltersPanelInstance loading={this.props.loading} />\r\n                <Box sx={{ display: 'flex', alignItems: 'center', gap: 1, flexGrow: 1, justifyContent: 'end' }}>\r\n                  {this.internalConfig.enablePaginationTop && (\r\n                    <PaginationBarInstance\r\n                      count={this.props.data?.totalItems ?? 0}\r\n                      defaultFilter={this.internalConfig.filterBar?.defaultValue}\r\n                      filter={this.filterState}\r\n                      onChange={this.onFilterStateChangeHandler}\r\n                      {...this.internalConfig.paginationBar}\r\n                    />\r\n                  )}\r\n                </Box>\r\n              </Stack>\r\n              {this.props.slots?.activeFiltersPanelSlots?.right}\r\n            </FilterBarPanel>\r\n            {this.props.slots?.activeFiltersPanelSlots?.below}\r\n            <ViewModeInstance\r\n              data={this.props.data?.items ?? []}\r\n              viewMode={this.viewMode}\r\n              loading={this.props.loading}\r\n              error={this.props.error}\r\n              autoHeight={this.internalConfig.autoHeight}\r\n              slots={this.internalConfig.viewMode}\r\n            />\r\n            {this.renderFooter()}\r\n          </Stack>\r\n        </DataViewContext.Provider>\r\n      )\r\n    }\r\n\r\n    renderFooter = () => {\r\n      const temp = this.props.slots?.footerProps || {}\r\n      return (\r\n        <FooterWrap {...temp.wrapProps}>\r\n          {temp.enablePagination !== false && (\r\n            <PaginationBarInstance\r\n              count={this.props.data?.totalItems ?? 0}\r\n              defaultFilter={this.internalConfig.filterBar?.defaultValue}\r\n              filter={this.filterState}\r\n              onChange={this.onFilterStateChangeHandler}\r\n              {...this.internalConfig.paginationBar}\r\n            />\r\n          )}\r\n        </FooterWrap>\r\n      )\r\n    }\r\n\r\n    onViewModeChangeHandler = (value: EViewMode) => {\r\n      this.setState({ viewMode: value }, () => {\r\n        if (this.props.syncViewModeToURL) {\r\n          const dViewMode = this.internalConfig.viewMode?.defaultValue ?? configs.viewMode?.defaultValue ?? defaultViewMode\r\n          syncViewModeToURL({ viewMode: value, defaultViewMode: dViewMode })\r\n        }\r\n        this.props.onViewModeChange?.(value)\r\n      })\r\n    }\r\n\r\n    onKeywordChangeHandler = (keyword: string) => this.setState({ keyword })\r\n\r\n    onScrollChangeHandler = (data: IScrollTrackingData) => this.setState({ scrolled: data.isScrolled })\r\n\r\n    onPopperPanelChangeHandler: OnPanelValueChange = (anchorEl, area) => this.setState({ anchorEl, area })\r\n\r\n    onClearHandler = () => this.setState(defaultFilterBarState)\r\n\r\n    onPanelCloseHandler = () => {\r\n      this.setState({ anchorEl: null, area: undefined, keyword: '' })\r\n    }\r\n\r\n    onFilterStateChangeHandler: IFilterStateChangeHandler<T> = (filterState: IFilterState<T>) => {\r\n      if (!this.props.filter) this.setState({ ...defaultFilterBarState, filterState })\r\n      this.props.onFilterChange && this.props.onFilterChange(filterState)\r\n      if (!!this.props.filter) this.setState(defaultFilterBarState)\r\n    }\r\n  }\r\n\r\n  return DataView\r\n}\r\n\r\nexport default createDataView\r\n\r\nconst FilterBarPanel = styled(Box)({\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  flexWrap: 'wrap',\r\n  gap: '8px',\r\n  marginBottom: '8px',\r\n  minHeight: 'var(--filter-bar-height, 40px)'\r\n})\r\n\r\nconst FooterWrap = styled(Box)({\r\n  display: 'flex',\r\n  justifyContent: 'flex-end',\r\n  width: '100%'\r\n})\r\n"],"names":["createDataView","configs","FilterBarInstance","createFilterBar","PopperPanelInstance","createPopperPanel","ActiveFiltersPanelInstance","createActiveFiltersPanel","ViewModeInstance","createViewMode","viewMode","PaginationBarInstance","createPaginationBar","DataView","props","_this","_classCallCheck","_callSuper","_defineProperty","currentProps","_ref","_slots$paginationBarC","_slots$paginationBarC2","_configs$paginationBa","slots","configCache","filterBar","Object","assign","filterBarConfigs","viewModeConfigs","paginationBar","paginationBarConfigs","enablePaginationTop","scrollTracking","autoHeight","_this$props$slots","_this$props$data$tota","_this$props$data","_this$internalConfig$","temp","footerProps","_jsx","FooterWrap","_objectSpread","wrapProps","children","enablePagination","count","data","totalItems","defaultFilter","internalConfig","defaultValue","filter","filterState","onChange","onFilterStateChangeHandler","value","setState","_this$props$onViewMod","_this$props","syncViewModeToURL","_ref2","_this$internalConfig$2","_this$internalConfig$3","_configs$viewMode","dViewMode","defaultViewMode","onViewModeChange","call","keyword","scrolled","isScrolled","anchorEl","area","defaultFilterBarState","undefined","onFilterChange","mergeConfig","state","getDefaultState","_inherits","Component","_createClass","key","_ref3","_currentProps$slots$v","_currentProps$slots","_configs$viewMode2","_this$internalConfig$4","_this$internalConfig$5","getViewModeFromURL","this","get","_this$props$filter","_this$props$viewMode","nextProps","_nextProps$slots","_this$props$slots2","_nextProps$slots2","_this$props$slots3","filterDiff","JSON","stringify","viewModeDiff","_this$internalConfig$6","_this$internalConfig$7","_this$props$slots4","_this$internalConfig$8","_this$props$slots5","_this$internalConfig$9","_this$props$slots6","_this$props$slots7","_this$props$slots8","_this$props$slots9","_this$props$data$tota2","_this$props$data2","_this$internalConfig$0","_this$props$slots0","_this$props$slots1","_this$props$data$item","_this$props$data3","mapContext","trim","onFilterStateChange","onKeywordChange","onKeywordChangeHandler","onPopperPanelChange","onPopperPanelChangeHandler","onPanelClose","onPanelCloseHandler","onClear","onClearHandler","DataViewContext","Provider","_jsxs","Stack","sx","height","flex","enableSticky","ScrollTracking","onScrollChangeHandler","filterSlots","above","id","elementId","primaryInputSlots","right","_Fragment","enableSort","SortButton","below","activeFiltersPanelSlots","FilterBarPanel","ViewModeButtons","onViewModeChangeHandler","left","flexDirection","flexWrap","alignItems","gap","flexGrow","loading","Box","display","justifyContent","items","error","renderFooter","styled","marginBottom","minHeight","width"],"mappings":"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"}
+{"version":3,"file":"create.data-view.js","sources":["../../../src/data-view/create.data-view.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Box, BoxProps, Stack, styled } from '@mui/material'\r\nimport { SortButton } from './ui.units'\r\nimport { createViewMode } from './create.view-mode'\r\nimport { defaultViewMode, ViewModeButtons } from './view-mode.units'\r\nimport { getViewModeFromURL, syncViewModeToURL } from './query-param-url'\r\nimport { EViewMode, IViewModeConfigs, IViewModeValidModel } from './view-mode.types'\r\nimport { IFilterBarConfigs, IFilterState, IFilterStateChangeHandler, IPositionElement, IViewData } from './types'\r\nimport { defaultFilterBarState, DataViewContext, IDataViewState, IDataViewContext, OnPanelValueChange } from './context'\r\nimport createFilterBar, { IFilterBarSlots } from './create.filter-bar'\r\nimport ScrollTracking, { IScrollTrackingData, IScrollTrackingOptions } from './scroll-tracking'\r\nimport createPaginationBar, { IPaginationBarConfigs } from './create.pagination-bar'\r\nimport createPopperPanel from './create.popper-panel'\r\nimport createActiveFiltersPanel from './create.active-filters-panel'\r\n\r\nexport const filterBarClasses = {\r\n  root: 'FilterBar-root',\r\n  content: 'FilterBar-content',\r\n  input: 'FilterBar-input',\r\n  inputWrap: 'FilterBar-inputWrap',\r\n  label: 'FilterBar-label',\r\n  button: 'FilterBar-button',\r\n  spacing: 'FilterBar-spacing',\r\n  panel: 'FilterBar-panel',\r\n  sticky: 'FilterBar-sticky',\r\n  shadow: 'FilterBar-shadow'\r\n}\r\n\r\nexport interface IDataViewSlots<T extends IViewModeValidModel> {\r\n  filterWrapProps?: BoxProps\r\n  filterSlots?: IPositionElement\r\n  activeFiltersPanelSlots?: IPositionElement\r\n  primaryInputSlots?: IFilterBarSlots\r\n  filterBarConfigs?: IFilterBarConfigs<T>\r\n  viewModeConfigs?: IViewModeConfigs<T>\r\n  paginationBarConfigs?: IPaginationBarConfigs\r\n  scrollTracking?: IScrollTrackingOptions\r\n  footerProps?: {\r\n    wrapProps?: BoxProps\r\n    enablePagination?: boolean\r\n  }\r\n  title?: React.ReactNode\r\n}\r\n\r\nexport interface IDataViewProps<T extends IViewModeValidModel> {\r\n  loading?: boolean\r\n  error?: string\r\n  data?: IViewData<T>\r\n  filter?: IFilterState<T>\r\n  onFilterChange?: (value: IFilterState<T>) => void\r\n  viewMode?: EViewMode\r\n  onViewModeChange?: (value: EViewMode) => void\r\n  syncViewModeToURL?: boolean\r\n  autoHeight?: boolean\r\n  slots?: IDataViewSlots<T>\r\n}\r\n\r\nexport interface IDataViewConfigs<T extends IViewModeValidModel> {\r\n  autoHeight?: boolean\r\n  filterBar?: IFilterBarConfigs<T>\r\n  viewMode?: IViewModeConfigs<T>\r\n  paginationBar?: IPaginationBarConfigs\r\n  scrollTracking?: IScrollTrackingOptions\r\n}\r\n\r\ninterface IInternalConfigs<T extends IViewModeValidModel> extends IDataViewConfigs<T> {\r\n  enablePaginationTop?: boolean\r\n  scrollTracking?: IScrollTrackingOptions\r\n}\r\n\r\nfunction createDataView<T extends IViewModeValidModel>(configs: IDataViewConfigs<T>): ComponentType<IDataViewProps<T>> {\r\n  const FilterBarInstance = createFilterBar<T>()\r\n  const PopperPanelInstance = createPopperPanel<T>()\r\n  const ActiveFiltersPanelInstance = createActiveFiltersPanel<T>()\r\n  const ViewModeInstance = createViewMode<T>(configs.viewMode)\r\n  const PaginationBarInstance = createPaginationBar<T>()\r\n\r\n  class DataView extends Component<IDataViewProps<T>, IDataViewState<T>> {\r\n    constructor(props: IDataViewProps<T>) {\r\n      super(props)\r\n      this.mergeConfig(props)\r\n      this.state = this.getDefaultState(props)\r\n    }\r\n\r\n    private getDefaultState(currentProps: IDataViewProps<T>): IDataViewState<T> {\r\n      const defaultValue = currentProps.slots?.viewModeConfigs?.defaultValue ?? configs.viewMode?.defaultValue ?? defaultViewMode\r\n      const viewMode = currentProps.syncViewModeToURL ? getViewModeFromURL<T>({ defaultViewMode: defaultValue }) : defaultValue\r\n      return {\r\n        ...defaultFilterBarState,\r\n        filterState: this.internalConfig.filterBar?.defaultValue ?? {},\r\n        viewMode\r\n      }\r\n    }\r\n\r\n    get filterState(): IFilterState<T> {\r\n      return this.props.filter ?? this.state.filterState\r\n    }\r\n\r\n    get viewMode(): EViewMode | undefined {\r\n      return this.props.viewMode ?? this.state.viewMode\r\n    }\r\n\r\n    private mergeConfig = (currentProps: IDataViewProps<T>) => {\r\n      const { slots } = currentProps\r\n      this.configCache = {\r\n        filterBar: Object.assign({}, configs.filterBar, slots?.filterBarConfigs),\r\n        viewMode: slots?.viewModeConfigs,\r\n        paginationBar: Object.assign({}, configs.paginationBar, slots?.paginationBarConfigs),\r\n        enablePaginationTop: slots?.paginationBarConfigs?.enablePaginationTop ?? configs.paginationBar?.enablePaginationTop ?? false,\r\n        scrollTracking: Object.assign({}, configs.scrollTracking, slots?.scrollTracking),\r\n        autoHeight: currentProps.autoHeight || configs.autoHeight || false\r\n      }\r\n    }\r\n\r\n    private configCache: IInternalConfigs<T> = {}\r\n    get internalConfig() {\r\n      return this.configCache\r\n    }\r\n\r\n    shouldComponentUpdate(nextProps: Readonly<IDataViewProps<T>>): boolean {\r\n      const filterDiff = JSON.stringify(nextProps.slots?.filterBarConfigs) !== JSON.stringify(this.props.slots?.filterBarConfigs)\r\n      const viewModeDiff = JSON.stringify(nextProps.slots?.viewModeConfigs) !== JSON.stringify(this.props.slots?.viewModeConfigs)\r\n      if (filterDiff || viewModeDiff) this.mergeConfig(nextProps)\r\n      return true\r\n    }\r\n\r\n    refFilterButton: HTMLButtonElement | null = null\r\n    refSortButton: HTMLButtonElement | null = null\r\n    render() {\r\n      const mapContext: IDataViewContext<T> = {\r\n        keyword: this.state.keyword.trim(),\r\n        filterBarConfigs: this.internalConfig.filterBar ?? {},\r\n        filterState: this.filterState,\r\n        anchorEl: this.state.anchorEl,\r\n        area: this.state.area,\r\n        viewMode: this.state.viewMode,\r\n        scrolled: this.state.scrolled,\r\n        onFilterStateChange: this.onFilterStateChangeHandler,\r\n        onKeywordChange: this.onKeywordChangeHandler,\r\n        onPopperPanelChange: this.onPopperPanelChangeHandler,\r\n        onPanelClose: this.onPanelCloseHandler,\r\n        onClear: this.onClearHandler\r\n      }\r\n\r\n      return (\r\n        <DataViewContext.Provider value={mapContext}>\r\n          <Stack sx={{ height: '100%', flex: 1 }}>\r\n            {this.props.slots?.title}\r\n            {this.internalConfig.filterBar?.enableSticky && (\r\n              <ScrollTracking onChange={this.onScrollChangeHandler} {...this.internalConfig.scrollTracking} />\r\n            )}\r\n            {this.props.slots?.filterSlots?.above}\r\n            <FilterBarInstance\r\n              id={this.internalConfig.scrollTracking?.elementId}\r\n              slots={{\r\n                ...this.props.slots?.primaryInputSlots,\r\n                right: (\r\n                  <>\r\n                    {this.internalConfig.filterBar?.enableSort && <SortButton />}\r\n                    {this.props.slots?.primaryInputSlots?.right}\r\n                  </>\r\n                )\r\n              }}\r\n            >\r\n              <PopperPanelInstance />\r\n            </FilterBarInstance>\r\n            {this.props.slots?.filterSlots?.below}\r\n            {this.props.slots?.activeFiltersPanelSlots?.above}\r\n            <FilterBarPanel>\r\n              <ViewModeButtons value={this.state.viewMode} onChange={this.onViewModeChangeHandler} />\r\n              {this.props.slots?.activeFiltersPanelSlots?.left}\r\n              <Stack flexDirection={'row'} sx={{ flexWrap: 'wrap', alignItems: 'center', gap: 1, flexGrow: 1 }}>\r\n                <ActiveFiltersPanelInstance loading={this.props.loading} />\r\n                <Box sx={{ display: 'flex', alignItems: 'center', gap: 1, flexGrow: 1, justifyContent: 'end' }}>\r\n                  {this.internalConfig.enablePaginationTop && (\r\n                    <PaginationBarInstance\r\n                      count={this.props.data?.totalItems ?? 0}\r\n                      defaultFilter={this.internalConfig.filterBar?.defaultValue}\r\n                      filter={this.filterState}\r\n                      onChange={this.onFilterStateChangeHandler}\r\n                      {...this.internalConfig.paginationBar}\r\n                    />\r\n                  )}\r\n                </Box>\r\n              </Stack>\r\n              {this.props.slots?.activeFiltersPanelSlots?.right}\r\n            </FilterBarPanel>\r\n            {this.props.slots?.activeFiltersPanelSlots?.below}\r\n            <ViewModeInstance\r\n              data={this.props.data?.items ?? []}\r\n              viewMode={this.viewMode}\r\n              loading={this.props.loading}\r\n              error={this.props.error}\r\n              autoHeight={this.internalConfig.autoHeight}\r\n              slots={this.internalConfig.viewMode}\r\n            />\r\n            {this.renderFooter()}\r\n          </Stack>\r\n        </DataViewContext.Provider>\r\n      )\r\n    }\r\n\r\n    renderFooter = () => {\r\n      const temp = this.props.slots?.footerProps || {}\r\n      return (\r\n        <FooterWrap {...temp.wrapProps}>\r\n          {temp.enablePagination !== false && (\r\n            <PaginationBarInstance\r\n              count={this.props.data?.totalItems ?? 0}\r\n              defaultFilter={this.internalConfig.filterBar?.defaultValue}\r\n              filter={this.filterState}\r\n              onChange={this.onFilterStateChangeHandler}\r\n              {...this.internalConfig.paginationBar}\r\n            />\r\n          )}\r\n        </FooterWrap>\r\n      )\r\n    }\r\n\r\n    onViewModeChangeHandler = (value: EViewMode) => {\r\n      this.setState({ viewMode: value }, () => {\r\n        if (this.props.syncViewModeToURL) {\r\n          const dViewMode = this.internalConfig.viewMode?.defaultValue ?? configs.viewMode?.defaultValue ?? defaultViewMode\r\n          syncViewModeToURL({ viewMode: value, defaultViewMode: dViewMode })\r\n        }\r\n        this.props.onViewModeChange?.(value)\r\n      })\r\n    }\r\n\r\n    onKeywordChangeHandler = (keyword: string) => this.setState({ keyword })\r\n\r\n    onScrollChangeHandler = (data: IScrollTrackingData) => this.setState({ scrolled: data.isScrolled })\r\n\r\n    onPopperPanelChangeHandler: OnPanelValueChange = (anchorEl, area) => this.setState({ anchorEl, area })\r\n\r\n    onClearHandler = () => this.setState(defaultFilterBarState)\r\n\r\n    onPanelCloseHandler = () => {\r\n      this.setState({ anchorEl: null, area: undefined, keyword: '' })\r\n    }\r\n\r\n    onFilterStateChangeHandler: IFilterStateChangeHandler<T> = (filterState: IFilterState<T>) => {\r\n      if (!this.props.filter) this.setState({ ...defaultFilterBarState, filterState })\r\n      this.props.onFilterChange && this.props.onFilterChange(filterState)\r\n      if (!!this.props.filter) this.setState(defaultFilterBarState)\r\n    }\r\n  }\r\n\r\n  return DataView\r\n}\r\n\r\nexport default createDataView\r\n\r\nconst FilterBarPanel = styled(Box)({\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  flexWrap: 'wrap',\r\n  gap: '8px',\r\n  marginBottom: '8px',\r\n  minHeight: 'var(--filter-bar-height, 40px)'\r\n})\r\n\r\nconst FooterWrap = styled(Box)({\r\n  display: 'flex',\r\n  justifyContent: 'flex-end',\r\n  width: '100%'\r\n})\r\n"],"names":["createDataView","configs","FilterBarInstance","createFilterBar","PopperPanelInstance","createPopperPanel","ActiveFiltersPanelInstance","createActiveFiltersPanel","ViewModeInstance","createViewMode","viewMode","PaginationBarInstance","createPaginationBar","DataView","props","_this","_classCallCheck","_callSuper","_defineProperty","currentProps","_ref","_slots$paginationBarC","_slots$paginationBarC2","_configs$paginationBa","slots","configCache","filterBar","Object","assign","filterBarConfigs","viewModeConfigs","paginationBar","paginationBarConfigs","enablePaginationTop","scrollTracking","autoHeight","_this$props$slots","_this$props$data$tota","_this$props$data","_this$internalConfig$","temp","footerProps","_jsx","FooterWrap","_objectSpread","wrapProps","children","enablePagination","count","data","totalItems","defaultFilter","internalConfig","defaultValue","filter","filterState","onChange","onFilterStateChangeHandler","value","setState","_this$props$onViewMod","_this$props","syncViewModeToURL","_ref2","_this$internalConfig$2","_this$internalConfig$3","_configs$viewMode","dViewMode","defaultViewMode","onViewModeChange","call","keyword","scrolled","isScrolled","anchorEl","area","defaultFilterBarState","undefined","onFilterChange","mergeConfig","state","getDefaultState","_inherits","Component","_createClass","key","_ref3","_currentProps$slots$v","_currentProps$slots","_configs$viewMode2","_this$internalConfig$4","_this$internalConfig$5","getViewModeFromURL","this","get","_this$props$filter","_this$props$viewMode","nextProps","_nextProps$slots","_this$props$slots2","_nextProps$slots2","_this$props$slots3","filterDiff","JSON","stringify","viewModeDiff","_this$internalConfig$6","_this$props$slots4","_this$internalConfig$7","_this$props$slots5","_this$internalConfig$8","_this$props$slots6","_this$internalConfig$9","_this$props$slots7","_this$props$slots8","_this$props$slots9","_this$props$slots0","_this$props$data$tota2","_this$props$data2","_this$internalConfig$0","_this$props$slots1","_this$props$slots10","_this$props$data$item","_this$props$data3","mapContext","trim","onFilterStateChange","onKeywordChange","onKeywordChangeHandler","onPopperPanelChange","onPopperPanelChangeHandler","onPanelClose","onPanelCloseHandler","onClear","onClearHandler","DataViewContext","Provider","_jsxs","Stack","sx","height","flex","title","enableSticky","ScrollTracking","onScrollChangeHandler","filterSlots","above","id","elementId","primaryInputSlots","right","_Fragment","enableSort","SortButton","below","activeFiltersPanelSlots","FilterBarPanel","ViewModeButtons","onViewModeChangeHandler","left","flexDirection","flexWrap","alignItems","gap","flexGrow","loading","Box","display","justifyContent","items","error","renderFooter","styled","marginBottom","minHeight","width"],"mappings":"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"}

package/dist/src/data-view/dino.js

@@ -1,2 +1,2 @@
-import{createClass as t,classCallCheck as r,defineProperty as e}from"../../_virtual/_rollupPluginBabelHelpers.js";import{createFilterStore as o}from"./filter-store.js";import{createViewMode as i}from"./create.view-mode.js";import{createViewModeButtons as a}from"./view-mode.units.js";import{syncQueryToURL as s,getQueryFromURL as n,getSeedKeyFromURL as m,syncViewModeToURL as l,getViewModeFromURL as c,convertFilterToQueryParam as u}from"./query-param-url.js";import{createConvertFilterToGraphQL as f}from"./convert-filter-to-graphql.js";import{createKeyConverter as h}from"../http-service/graphql/key-converter.js";import{createPaginationBar as p}from"./create.pagination-bar.js";import v from"./create.data-view.js";import"../utils/dayjs-config.js";import d from"dayjs";var y=new(t(function t(){var y=this;r(this,t),e(this,"createDataView",v),e(this,"createKeyConverter",h),e(this,"createConvertFilterToGraphQL",f),e(this,"createFilterStore",o),e(this,"createPaginationBar",p),e(this,"createViewMode",i),e(this,"createViewModeButtons",a),e(this,"syncQueryToURL",s),e(this,"getQueryFromURL",n),e(this,"getSeedKeyFromURL",m),e(this,"syncViewModeToURL",l),e(this,"getViewModeFromURL",c),e(this,"convertFilterToQueryParam",u),e(this,"formatterDate",function(t,r){var e,o,i=null!==(e=null==r?void 0:r.formatString)&&void 0!==e?e:"MM/DD/YYYY HH:mm",a=null!==(o=null==r?void 0:r.showRelative)&&void 0!==o&&o;try{if(!t)return"";var s=d(t),n=s.format(i);return a?"".concat(n," (").concat(d().to(s),")"):n}catch(t){return""}}),e(this,"valueFormatterDate",function(t){return function(r){return y.formatterDate(r.value,t)}})}));export{y as DinoDataView,y as default};
+import{createClass as t,classCallCheck as r,defineProperty as e}from"../../_virtual/_rollupPluginBabelHelpers.js";import o from"dayjs";import"../utils/dayjs-config.js";import"../utils/query-param.js";import{createFilterStore as i}from"./filter-store.js";import{createViewMode as a}from"./create.view-mode.js";import{createViewModeButtons as s}from"./view-mode.units.js";import{syncQueryToURL as m,getQueryFromURL as n,getSeedKeyFromURL as l,syncViewModeToURL as c,getViewModeFromURL as u,convertFilterToQueryParam as f}from"./query-param-url.js";import{createConvertFilterToGraphQL as h}from"./convert-filter-to-graphql.js";import{createKeyConverter as p}from"../http-service/graphql/key-converter.js";import{createPaginationBar as v}from"./create.pagination-bar.js";import d from"./create.data-view.js";var y=new(t(function t(){var y=this;r(this,t),e(this,"createDataView",d),e(this,"createKeyConverter",p),e(this,"createConvertFilterToGraphQL",h),e(this,"createFilterStore",i),e(this,"createPaginationBar",v),e(this,"createViewMode",a),e(this,"createViewModeButtons",s),e(this,"syncQueryToURL",m),e(this,"getQueryFromURL",n),e(this,"getSeedKeyFromURL",l),e(this,"syncViewModeToURL",c),e(this,"getViewModeFromURL",u),e(this,"convertFilterToQueryParam",f),e(this,"formatterDate",function(t,r){var e,i,a=null!==(e=null==r?void 0:r.formatString)&&void 0!==e?e:"MM/DD/YYYY HH:mm",s=null!==(i=null==r?void 0:r.showRelative)&&void 0!==i&&i;try{if(!t)return"";var m=o(t),n=m.format(a);return s?"".concat(n," (").concat(o().to(m),")"):n}catch(t){return""}}),e(this,"valueFormatterDate",function(t){return function(r){return y.formatterDate(r.value,t)}})}));export{y as DinoDataView,y as default};
 //# sourceMappingURL=dino.js.map

package/dist/src/data-view/dino.js.map

@@ -1 +1 @@
-{"version":3,"file":"dino.js","sources":["../../../src/data-view/dino.tsx"],"sourcesContent":["import { GridValueFormatterParams } from '@mui/x-data-grid'\r\nimport { dayjsCustom } from '../utils'\r\nimport { createFilterStore } from './filter-store'\r\nimport { createViewMode } from './create.view-mode'\r\nimport { createViewModeButtons } from './view-mode.units'\r\nimport { getViewModeFromURL, syncViewModeToURL } from './query-param-url'\r\nimport { createConvertFilterToGraphQL } from './convert-filter-to-graphql'\r\nimport { createKeyConverter } from '../http-service/graphql/key-converter'\r\nimport { convertFilterToQueryParam, getQueryFromURL, getSeedKeyFromURL, syncQueryToURL } from './query-param-url'\r\nimport createPaginationBar from './create.pagination-bar'\r\nimport createDataView from './create.data-view'\r\n\r\nconst formatDateString = 'MM/DD/YYYY HH:mm'\r\n\r\nexport interface IFormatterDateOptions {\r\n  formatString?: string\r\n  showRelative?: boolean\r\n}\r\n\r\nclass DinoDataViewBase {\r\n  createDataView = createDataView\r\n\r\n  createKeyConverter = createKeyConverter\r\n\r\n  createConvertFilterToGraphQL = createConvertFilterToGraphQL\r\n\r\n  createFilterStore = createFilterStore\r\n\r\n  createPaginationBar = createPaginationBar\r\n\r\n  createViewMode = createViewMode\r\n\r\n  createViewModeButtons = createViewModeButtons\r\n\r\n  syncQueryToURL = syncQueryToURL\r\n\r\n  getQueryFromURL = getQueryFromURL\r\n\r\n  getSeedKeyFromURL = getSeedKeyFromURL\r\n\r\n  syncViewModeToURL = syncViewModeToURL\r\n\r\n  getViewModeFromURL = getViewModeFromURL\r\n\r\n  convertFilterToQueryParam = convertFilterToQueryParam\r\n\r\n  //#region Value Formatter\r\n  formatterDate = (value: any, options?: IFormatterDateOptions): string => {\r\n    const f = options?.formatString ?? formatDateString\r\n    const showRelative = options?.showRelative ?? false\r\n    try {\r\n      if (!value) return ''\r\n\r\n      const date = dayjsCustom(value)\r\n      const formatted = date.format(f)\r\n\r\n      return showRelative ? `${formatted} (${dayjsCustom().to(date)})` : formatted\r\n    } catch (error) {\r\n      return ''\r\n    }\r\n  }\r\n\r\n  valueFormatterDate = (options?: IFormatterDateOptions) => {\r\n    return (params: GridValueFormatterParams<any>) => this.formatterDate(params.value, options)\r\n  }\r\n  //#endregion\r\n}\r\nexport const DinoDataView = new DinoDataViewBase()\r\nexport default DinoDataView\r\n"],"names":["DinoDataView","_createClass","DinoDataViewBase","_this","this","_classCallCheck","_defineProperty","createDataView","createKeyConverter","createConvertFilterToGraphQL","createFilterStore","createPaginationBar","createViewMode","createViewModeButtons","syncQueryToURL","getQueryFromURL","getSeedKeyFromURL","syncViewModeToURL","getViewModeFromURL","convertFilterToQueryParam","value","options","_options$formatString","_options$showRelative","f","formatString","showRelative","date","dayjsCustom","formatted","format","concat","to","error","params","formatterDate"],"mappings":"owBAYA,IAuDaA,EAAe,IAhDNC,EAAA,SAAAC,IAAA,IAAAC,EAAAC,KAAAC,OAAAH,GAAAI,wBACHC,GAAcD,4BAEVE,GAAkBF,sCAERG,GAA4BH,2BAEvCI,GAAiBJ,6BAEfK,GAAmBL,wBAExBM,GAAcN,+BAEPO,GAAqBP,wBAE5BQ,GAAcR,yBAEbS,GAAeT,2BAEbU,GAAiBV,2BAEjBW,GAAiBX,4BAEhBY,GAAkBZ,mCAEXa,GAE5Bb,EACgBF,KAAA,gBAAA,SAACgB,EAAYC,GAA2C,IAAAC,EAAAC,EAChEC,EAAyBF,QAAxBA,EAAGD,aAAO,EAAPA,EAASI,oBAAYH,IAAAA,EAAAA,EApCV,mBAqCfI,EAAoCH,QAAxBA,EAAGF,aAAO,EAAPA,EAASK,oBAAYH,IAAAA,GAAAA,EAC1C,IACE,IAAKH,EAAO,MAAO,GAEnB,IAAMO,EAAOC,EAAYR,GACnBS,EAAYF,EAAKG,OAAON,GAE9B,OAAOE,EAAYK,GAAAA,OAAMF,QAASE,OAAKH,IAAcI,GAAGL,QAAWE,CACpE,CAAC,MAAOI,GACP,MAAO,EACR,IACF3B,EAAAF,KAAA,qBAEoB,SAACiB,GACpB,OAAO,SAACa,GAAqC,OAAK/B,EAAKgC,cAAcD,EAAOd,MAAOC,EAAQ,GAC5F"}
+{"version":3,"file":"dino.js","sources":["../../../src/data-view/dino.tsx"],"sourcesContent":["import { GridValueFormatterParams } from '@mui/x-data-grid'\r\nimport { dayjsCustom } from '../utils'\r\nimport { createFilterStore } from './filter-store'\r\nimport { createViewMode } from './create.view-mode'\r\nimport { createViewModeButtons } from './view-mode.units'\r\nimport { getViewModeFromURL, syncViewModeToURL } from './query-param-url'\r\nimport { createConvertFilterToGraphQL } from './convert-filter-to-graphql'\r\nimport { createKeyConverter } from '../http-service/graphql/key-converter'\r\nimport { convertFilterToQueryParam, getQueryFromURL, getSeedKeyFromURL, syncQueryToURL } from './query-param-url'\r\nimport createPaginationBar from './create.pagination-bar'\r\nimport createDataView from './create.data-view'\r\n\r\nconst formatDateString = 'MM/DD/YYYY HH:mm'\r\n\r\nexport interface IFormatterDateOptions {\r\n  formatString?: string\r\n  showRelative?: boolean\r\n}\r\n\r\nclass DinoDataViewBase {\r\n  createDataView = createDataView\r\n\r\n  createKeyConverter = createKeyConverter\r\n\r\n  createConvertFilterToGraphQL = createConvertFilterToGraphQL\r\n\r\n  createFilterStore = createFilterStore\r\n\r\n  createPaginationBar = createPaginationBar\r\n\r\n  createViewMode = createViewMode\r\n\r\n  createViewModeButtons = createViewModeButtons\r\n\r\n  syncQueryToURL = syncQueryToURL\r\n\r\n  getQueryFromURL = getQueryFromURL\r\n\r\n  getSeedKeyFromURL = getSeedKeyFromURL\r\n\r\n  syncViewModeToURL = syncViewModeToURL\r\n\r\n  getViewModeFromURL = getViewModeFromURL\r\n\r\n  convertFilterToQueryParam = convertFilterToQueryParam\r\n\r\n  //#region Value Formatter\r\n  formatterDate = (value: any, options?: IFormatterDateOptions): string => {\r\n    const f = options?.formatString ?? formatDateString\r\n    const showRelative = options?.showRelative ?? false\r\n    try {\r\n      if (!value) return ''\r\n\r\n      const date = dayjsCustom(value)\r\n      const formatted = date.format(f)\r\n\r\n      return showRelative ? `${formatted} (${dayjsCustom().to(date)})` : formatted\r\n    } catch (error) {\r\n      return ''\r\n    }\r\n  }\r\n\r\n  valueFormatterDate = (options?: IFormatterDateOptions) => {\r\n    return (params: GridValueFormatterParams<any>) => this.formatterDate(params.value, options)\r\n  }\r\n  //#endregion\r\n}\r\nexport const DinoDataView = new DinoDataViewBase()\r\nexport default DinoDataView\r\n"],"names":["DinoDataView","_createClass","DinoDataViewBase","_this","this","_classCallCheck","_defineProperty","createDataView","createKeyConverter","createConvertFilterToGraphQL","createFilterStore","createPaginationBar","createViewMode","createViewModeButtons","syncQueryToURL","getQueryFromURL","getSeedKeyFromURL","syncViewModeToURL","getViewModeFromURL","convertFilterToQueryParam","value","options","_options$formatString","_options$showRelative","f","formatString","showRelative","date","dayjsCustom","formatted","format","concat","to","error","params","formatterDate"],"mappings":"oyBAYA,IAuDaA,EAAe,IAhDNC,EAAA,SAAAC,IAAA,IAAAC,EAAAC,KAAAC,OAAAH,GAAAI,wBACHC,GAAcD,4BAEVE,GAAkBF,sCAERG,GAA4BH,2BAEvCI,GAAiBJ,6BAEfK,GAAmBL,wBAExBM,GAAcN,+BAEPO,GAAqBP,wBAE5BQ,GAAcR,yBAEbS,GAAeT,2BAEbU,GAAiBV,2BAEjBW,GAAiBX,4BAEhBY,GAAkBZ,mCAEXa,GAE5Bb,EACgBF,KAAA,gBAAA,SAACgB,EAAYC,GAA2C,IAAAC,EAAAC,EAChEC,EAAyBF,QAAxBA,EAAGD,aAAO,EAAPA,EAASI,oBAAYH,IAAAA,EAAAA,EApCV,mBAqCfI,EAAoCH,QAAxBA,EAAGF,aAAO,EAAPA,EAASK,oBAAYH,IAAAA,GAAAA,EAC1C,IACE,IAAKH,EAAO,MAAO,GAEnB,IAAMO,EAAOC,EAAYR,GACnBS,EAAYF,EAAKG,OAAON,GAE9B,OAAOE,EAAYK,GAAAA,OAAMF,QAASE,OAAKH,IAAcI,GAAGL,QAAWE,CACpE,CAAC,MAAOI,GACP,MAAO,EACR,IACF3B,EAAAF,KAAA,qBAEoB,SAACiB,GACpB,OAAO,SAACa,GAAqC,OAAK/B,EAAKgC,cAAcD,EAAOd,MAAOC,EAAQ,GAC5F"}

package/dist/src/data-view/filter-store.js

@@ -1,2 +1,2 @@
-import{createClass as t,objectSpread2 as e,toConsumableArray as i,defineProperty as a,objectWithoutProperties as s,toPropertyKey as r,classCallCheck as n}from"../../_virtual/_rollupPluginBabelHelpers.js";import{QueryParam as o}from"../utils/query-param.js";var h=function(){return t(function t(){var i=this,s=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},r=arguments.length>1?arguments[1]:void 0;n(this,t),a(this,"converToQueryParam",function(t){var e=i.extractFilter();return t+o.stringify({filter:JSON.stringify(e)})});var h=e({},s);null!=h&&h.details&&delete h.details,this._state=h,this._defaultFilter=r},[{key:"state",get:function(){return e({},this._state)}},{key:"addFilterItem",value:function(t,s,r){var n,o,h=null!==(n=null===(o=this._state.filter)||void 0===o?void 0:o[t])&&void 0!==n?n:[];if(h.some(function(t){return t.value===s.value}))this._state=e(e({},this._state),{},{details:e(e({},r),{},{action:"add",reason:"filter",isChanged:!1})});else{var u=[].concat(i(h),[s]),l=e(e({},this._state.filter),{},a({},t,u));this._state=e(e({},this._state),{},{filter:l,details:e(e({},r),{},{action:"add",isChanged:!0})})}return this}},{key:"removeFilterField",value:function(t,i){var a=this._state.filter;if(a&&a[t]&&a[t].length>0){a[t];var n=s(a,[t].map(r)),o=Object.keys(n).length>0;this._state=e(e({},this._state),{},{filter:o?n:void 0,details:e(e({},i),{},{action:"remove",reason:"filter",isChanged:!0})})}return this}},{key:"removeFilterItem",value:function(t,i,n){var o=this._state.filter,h=e({action:"remove",reason:"filter"},n);if(!o||!o[t]||0===o[t].length)return this._state=e(e({},this._state),{},{details:e(e({},h),{},{isChanged:!1})}),this;var u=o[t],l=u.findIndex(function(t){return t.value===i});if(-1===l)return this._state=e(e({},this._state),{},{details:e(e({},h),{},{isChanged:!1})}),this;var c=u.filter(function(t,e){return e!==l});if(0===c.length){o[t];var d=s(o,[t].map(r)),v=Object.keys(d).length>0;this._state=e(e({},this._state),{},{filter:v?d:void 0,details:e(e({},h),{},{isChanged:!0})})}else{var f=e(e({},o),{},a({},t,c));this._state=e(e({},this._state),{},{filter:f,details:e(e({},h),{},{isChanged:!0})})}return this}},{key:"updateFilter",value:function(t,i){return this._state=e(e({},this._state),{},{filter:t,details:e(e({},i),{},{action:"change",reason:"filter",isChanged:!0})}),this}},{key:"addQuickSearch",value:function(t,a){var s,r=null!==(s=this._state.quickSearch)&&void 0!==s?s:[],n=null!=t?t:[],o=[].concat(i(Array.isArray(r)?r:[r]),i(Array.isArray(n)?n:[n])),h=Array.from(new Set(o)),u=new Set(Array.isArray(r)?r:[r]),l=h.length!==u.size||h.some(function(t){return!u.has(t)});return l&&(this._state=e(e({},this._state),{},{quickSearch:h,details:e(e({},a),{},{action:"add",reason:"quickSearch",isChanged:l})})),this}},{key:"removeQuickSearch",value:function(t){return this._state=e(e({},this._state),{},{quickSearch:void 0,details:e(e({},t),{},{action:"remove",reason:"quickSearch",isChanged:!0})}),this}},{key:"removeQuickSearchItem",value:function(t,i){var a=this._state.quickSearch,s=e({action:"remove",reason:"quickSearch"},i);if(!a)return this._state=e(e({},this._state),{},{details:e(e({},s),{},{isChanged:!1})}),this;var r=Array.isArray(a)?a:[a];if(-1===r.indexOf(t))return this._state=e(e({},this._state),{},{details:e(e({},s),{},{isChanged:!1})}),this;var n=r.filter(function(e){return e!==t});return 0===n.length?this._state=e(e({},this._state),{},{quickSearch:void 0,details:e(e({},s),{},{isChanged:!0})}):this._state=e(e({},this._state),{},{quickSearch:1===n.length?n[0]:n,details:e(e({},s),{},{isChanged:!0})}),this}},{key:"updateSearchInput",value:function(t){return this._state=e(e({},this._state),{},{quickSearch:t,details:{reason:"quickSearch",area:"input",action:"change",isChanged:!0}}),this}},{key:"changePagination",value:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{area:"filterButton"};return this._state=e(e({},this._state),{},{pagination:t,details:e(e({},i),{},{action:"change",reason:"pagination",isChanged:!0})}),this}},{key:"removePagination",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{area:"filterButton"};return this._state=e(e({},this._state),{},{pagination:void 0,details:e(e({},t),{},{action:"remove",reason:"pagination",isChanged:!0})}),this}},{key:"changeSort",value:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{area:"sortButton"};return this._state=e(e({},this._state),{},{sort:t,details:e(e({},i),{},{action:"change",reason:"sort"})}),this}},{key:"removeSort",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{area:"sortButton"};return this._state=e(e({},this._state),{},{sort:void 0,details:e(e({},t),{},{action:"remove",reason:"sort"})}),this}},{key:"toggleSortDirection",value:function(t){var i=this._state.sort;if(!i)return this;var a=e(e({},i),{},{direction:"asc"===i.direction?"desc":"asc"});return this._state=e(e({},this._state),{},{sort:a,details:e(e({},t),{},{action:"change",reason:"sort"})}),this}},{key:"updateState",value:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{area:"filterButton"};return this._state=e(e(e({},this._state),t),{},{details:e(e({},i),{},{action:"change"})}),this}},{key:"reset",value:function(){return this._state=e(e({},this._defaultFilter),{},{details:{action:"reset",isChanged:!0}}),this}},{key:"resetFilter",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{area:"filterButton"};return this._state=e(e({},this._state),{},{filter:void 0,details:e({action:"reset",reason:"filter"},t)}),this}},{key:"resetQuickSearch",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{area:"input"};return this._state=e(e({},this._state),{},{quickSearch:void 0,details:e({action:"reset",reason:"quickSearch"},t)}),this}},{key:"resetPagination",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{reason:"pagination"};return this._state=e(e({},this._state),{},{pagination:void 0,details:e({action:"reset",reason:"pagination"},t)}),this}},{key:"resetSort",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{reason:"sort"};return this._state=e(e({},this._state),{},{sort:void 0,details:e({action:"reset",reason:"sort"},t)}),this}},{key:"isPaginationEqualToDefault",value:function(){var t,e=this._state.pagination,i=null===(t=this._defaultFilter)||void 0===t?void 0:t.pagination;return!e&&!i||!(!e||!i)&&(e.page===i.page&&e.pageSize===i.pageSize)}},{key:"isSortEqualToDefault",value:function(){var t,e=this._state.sort,i=null===(t=this._defaultFilter)||void 0===t?void 0:t.sort;return!e&&!i||!(!e||!i)&&(e.field===i.field&&e.direction===i.direction)}},{key:"extractFilter",value:function(){var t={};return this._state.filter&&(t.filter=this._state.filter),this._state.quickSearch&&(t.quickSearch=this._state.quickSearch),this._state.pagination&&!this.isPaginationEqualToDefault()&&(t.pagination=this._state.pagination),this._state.sort&&!this.isSortEqualToDefault()&&(t.sort=this._state.sort),t}},{key:"countFilterItems",value:function(){var t=this._state.filter;return t?Object.values(t).reduce(function(t,e){return t+(Array.isArray(e)?e.length:0)},0):0}},{key:"hasFilter",value:function(){return!!this._state.filter&&Object.keys(this._state.filter).length>0}},{key:"hasQuickSearch",value:function(){return!!this._state.quickSearch}},{key:"hasPagination",value:function(){return!this.isPaginationEqualToDefault()&&!!this._state.pagination}},{key:"hasSort",value:function(){return!this.isSortEqualToDefault()&&!!this._state.sort}},{key:"isEmpty",value:function(){return!(this.hasFilter()||this.hasQuickSearch()||this.hasPagination()||this.hasSort())}},{key:"build",value:function(){return e({},this._state)}}])}();function u(t,e){return new h(t,e)}export{h as FilterStore,u as createFilterStore,h as default};
+import{createClass as t,objectSpread2 as e,toConsumableArray as i,defineProperty as a,objectWithoutProperties as s,toPropertyKey as r,classCallCheck as n}from"../../_virtual/_rollupPluginBabelHelpers.js";import"dayjs";import"../utils/dayjs-config.js";import{QueryParam as o}from"../utils/query-param.js";var h=function(){return t(function t(){var i=this,s=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},r=arguments.length>1?arguments[1]:void 0;n(this,t),a(this,"converToQueryParam",function(t){var e=i.extractFilter();return t+o.stringify({filter:JSON.stringify(e)})});var h=e({},s);null!=h&&h.details&&delete h.details,this._state=h,this._defaultFilter=r},[{key:"state",get:function(){return e({},this._state)}},{key:"addFilterItem",value:function(t,s,r){var n,o,h=null!==(n=null===(o=this._state.filter)||void 0===o?void 0:o[t])&&void 0!==n?n:[];if(h.some(function(t){return t.value===s.value}))this._state=e(e({},this._state),{},{details:e(e({},r),{},{action:"add",reason:"filter",isChanged:!1})});else{var u=[].concat(i(h),[s]),l=e(e({},this._state.filter),{},a({},t,u));this._state=e(e({},this._state),{},{filter:l,details:e(e({},r),{},{action:"add",isChanged:!0})})}return this}},{key:"removeFilterField",value:function(t,i){var a=this._state.filter;if(a&&a[t]&&a[t].length>0){a[t];var n=s(a,[t].map(r)),o=Object.keys(n).length>0;this._state=e(e({},this._state),{},{filter:o?n:void 0,details:e(e({},i),{},{action:"remove",reason:"filter",isChanged:!0})})}return this}},{key:"removeFilterItem",value:function(t,i,n){var o=this._state.filter,h=e({action:"remove",reason:"filter"},n);if(!o||!o[t]||0===o[t].length)return this._state=e(e({},this._state),{},{details:e(e({},h),{},{isChanged:!1})}),this;var u=o[t],l=u.findIndex(function(t){return t.value===i});if(-1===l)return this._state=e(e({},this._state),{},{details:e(e({},h),{},{isChanged:!1})}),this;var c=u.filter(function(t,e){return e!==l});if(0===c.length){o[t];var d=s(o,[t].map(r)),v=Object.keys(d).length>0;this._state=e(e({},this._state),{},{filter:v?d:void 0,details:e(e({},h),{},{isChanged:!0})})}else{var f=e(e({},o),{},a({},t,c));this._state=e(e({},this._state),{},{filter:f,details:e(e({},h),{},{isChanged:!0})})}return this}},{key:"updateFilter",value:function(t,i){return this._state=e(e({},this._state),{},{filter:t,details:e(e({},i),{},{action:"change",reason:"filter",isChanged:!0})}),this}},{key:"addQuickSearch",value:function(t,a){var s,r=null!==(s=this._state.quickSearch)&&void 0!==s?s:[],n=null!=t?t:[],o=[].concat(i(Array.isArray(r)?r:[r]),i(Array.isArray(n)?n:[n])),h=Array.from(new Set(o)),u=new Set(Array.isArray(r)?r:[r]),l=h.length!==u.size||h.some(function(t){return!u.has(t)});return l&&(this._state=e(e({},this._state),{},{quickSearch:h,details:e(e({},a),{},{action:"add",reason:"quickSearch",isChanged:l})})),this}},{key:"removeQuickSearch",value:function(t){return this._state=e(e({},this._state),{},{quickSearch:void 0,details:e(e({},t),{},{action:"remove",reason:"quickSearch",isChanged:!0})}),this}},{key:"removeQuickSearchItem",value:function(t,i){var a=this._state.quickSearch,s=e({action:"remove",reason:"quickSearch"},i);if(!a)return this._state=e(e({},this._state),{},{details:e(e({},s),{},{isChanged:!1})}),this;var r=Array.isArray(a)?a:[a];if(-1===r.indexOf(t))return this._state=e(e({},this._state),{},{details:e(e({},s),{},{isChanged:!1})}),this;var n=r.filter(function(e){return e!==t});return 0===n.length?this._state=e(e({},this._state),{},{quickSearch:void 0,details:e(e({},s),{},{isChanged:!0})}):this._state=e(e({},this._state),{},{quickSearch:1===n.length?n[0]:n,details:e(e({},s),{},{isChanged:!0})}),this}},{key:"updateSearchInput",value:function(t){return this._state=e(e({},this._state),{},{quickSearch:t,details:{reason:"quickSearch",area:"input",action:"change",isChanged:!0}}),this}},{key:"changePagination",value:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{area:"filterButton"};return this._state=e(e({},this._state),{},{pagination:t,details:e(e({},i),{},{action:"change",reason:"pagination",isChanged:!0})}),this}},{key:"removePagination",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{area:"filterButton"};return this._state=e(e({},this._state),{},{pagination:void 0,details:e(e({},t),{},{action:"remove",reason:"pagination",isChanged:!0})}),this}},{key:"changeSort",value:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{area:"sortButton"};return this._state=e(e({},this._state),{},{sort:t,details:e(e({},i),{},{action:"change",reason:"sort"})}),this}},{key:"removeSort",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{area:"sortButton"};return this._state=e(e({},this._state),{},{sort:void 0,details:e(e({},t),{},{action:"remove",reason:"sort"})}),this}},{key:"toggleSortDirection",value:function(t){var i=this._state.sort;if(!i)return this;var a=e(e({},i),{},{direction:"asc"===i.direction?"desc":"asc"});return this._state=e(e({},this._state),{},{sort:a,details:e(e({},t),{},{action:"change",reason:"sort"})}),this}},{key:"updateState",value:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{area:"filterButton"};return this._state=e(e(e({},this._state),t),{},{details:e(e({},i),{},{action:"change"})}),this}},{key:"reset",value:function(){return this._state=e(e({},this._defaultFilter),{},{details:{action:"reset",isChanged:!0}}),this}},{key:"resetFilter",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{area:"filterButton"};return this._state=e(e({},this._state),{},{filter:void 0,details:e({action:"reset",reason:"filter"},t)}),this}},{key:"resetQuickSearch",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{area:"input"};return this._state=e(e({},this._state),{},{quickSearch:void 0,details:e({action:"reset",reason:"quickSearch"},t)}),this}},{key:"resetPagination",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{reason:"pagination"};return this._state=e(e({},this._state),{},{pagination:void 0,details:e({action:"reset",reason:"pagination"},t)}),this}},{key:"resetSort",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{reason:"sort"};return this._state=e(e({},this._state),{},{sort:void 0,details:e({action:"reset",reason:"sort"},t)}),this}},{key:"isPaginationEqualToDefault",value:function(){var t,e=this._state.pagination,i=null===(t=this._defaultFilter)||void 0===t?void 0:t.pagination;return!e&&!i||!(!e||!i)&&(e.page===i.page&&e.pageSize===i.pageSize)}},{key:"isSortEqualToDefault",value:function(){var t,e=this._state.sort,i=null===(t=this._defaultFilter)||void 0===t?void 0:t.sort;return!e&&!i||!(!e||!i)&&(e.field===i.field&&e.direction===i.direction)}},{key:"extractFilter",value:function(){var t={};return this._state.filter&&(t.filter=this._state.filter),this._state.quickSearch&&(t.quickSearch=this._state.quickSearch),this._state.pagination&&!this.isPaginationEqualToDefault()&&(t.pagination=this._state.pagination),this._state.sort&&!this.isSortEqualToDefault()&&(t.sort=this._state.sort),t}},{key:"countFilterItems",value:function(){var t=this._state.filter;return t?Object.values(t).reduce(function(t,e){return t+(Array.isArray(e)?e.length:0)},0):0}},{key:"hasFilter",value:function(){return!!this._state.filter&&Object.keys(this._state.filter).length>0}},{key:"hasQuickSearch",value:function(){return!!this._state.quickSearch}},{key:"hasPagination",value:function(){return!this.isPaginationEqualToDefault()&&!!this._state.pagination}},{key:"hasSort",value:function(){return!this.isSortEqualToDefault()&&!!this._state.sort}},{key:"isEmpty",value:function(){return!(this.hasFilter()||this.hasQuickSearch()||this.hasPagination()||this.hasSort())}},{key:"build",value:function(){return e({},this._state)}}])}();function u(t,e){return new h(t,e)}export{h as FilterStore,u as createFilterStore,h as default};
 //# sourceMappingURL=filter-store.js.map