dinocollab-core 2.1.1 → 2.1.4

package/dist/api-context/global-modal.js

@@ -1,2 +1,2 @@
-import{inherits as t,createClass as e,classCallCheck as n,callSuper as r,defineProperty as o,objectSpread2 as s}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as a,jsxs as i,Fragment as l}from"react/jsx-runtime";import c,{Component as u}from"react";import{styled as d,Box as f,Modal as p,Backdrop as h}from"@mui/material";var m=c.createContext({close:function(){console.warn("GlobalModal provider not found!")},show:function(){console.warn("GlobalModal provider not found!")}}),C=function(t){return a(m.Consumer,{children:t})},b=function(){function s(t){var e;return n(this,s),e=r(this,s,[t]),o(e,"show",(function(t){e.setState(t)})),o(e,"close",(function(t,n){"backdropClick"===n&&!1===e.state.backdropActivated||e.setState({renderContent:void 0})})),o(e,"renderContent",(function(){return e.state.renderContent?e.state.renderContent():a(l,{})})),e.state={},e}return t(s,u),e(s,[{key:"render",value:function(){return i(m.Provider,{value:this,children:[this.props.children,a(p,{open:!!this.state.renderContent,onClose:this.close,slots:{backdrop:h},slotProps:{backdrop:{timeout:300}},sx:this.state.sx,children:a(v,{sx:this.state.sxWrap,children:this.renderContent()})})]})}}])}(),v=d(f)({position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",outline:"none"}),x=function(t){return function(e){return a(b,{children:C((function(n){return a(t,s(s({},e),{},{contextGlobalModal:n}))}))})}},k=function(t){return function(e){return C((function(n){return a(t,s(s({},e),{},{contextGlobalModal:n}))}))}};export{m as GlobalModalContext,b as default,C as mapGlobalModalContext,k as withApiGlobalModalConsumerContext,x as withApiGlobalModalContext};
+import{inherits as t,createClass as e,classCallCheck as n,callSuper as r,defineProperty as o,objectSpread2 as s}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as a,jsxs as i,Fragment as l}from"react/jsx-runtime";import c,{Component as u}from"react";import{styled as d,Box as f,Modal as p,Backdrop as h}from"@mui/material";var m=c.createContext({close:function(){console.warn("GlobalModal provider not found!")},show:function(){console.warn("GlobalModal provider not found!")}}),C=function(t){return a(m.Consumer,{children:t})},b=function(){function s(t){var e;return n(this,s),e=r(this,s,[t]),o(e,"show",(function(t){e.setState(t)})),o(e,"close",(function(t,n){"backdropClick"===n&&!1===e.state.backdropActivated||e.setState({renderContent:void 0})})),o(e,"renderContent",(function(){return e.state.renderContent?e.state.renderContent():a(l,{})})),e.state={},e}return t(s,u),e(s,[{key:"render",value:function(){return i(m.Provider,{value:this,children:[this.props.children,a(p,{open:!!this.state.renderContent,onClose:this.close,slots:{backdrop:h},slotProps:{backdrop:{timeout:300}},sx:this.state.sx,children:a(v,{sx:this.state.sxWrap,children:this.renderContent()})})]})}}])}(),v=d(f)({position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",outline:"none"}),x=function(t){return function(e){return a(b,{children:C((function(n){return a(t,s(s({},e),{},{contextGlobalModal:n}))}))})}},k=function(t){return function(e){return C((function(n){return a(t,s(s({},e),{},{contextGlobalModal:n}))}))}};export{b as GlobalModal,m as GlobalModalContext,b as default,C as mapGlobalModalContext,k as withApiGlobalModalConsumerContext,x as withApiGlobalModalContext};
 //# sourceMappingURL=global-modal.js.map

package/dist/api-context/global-modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"global-modal.js","sources":["../../src/api-context/global-modal.tsx"],"sourcesContent":["import React, { Component } from 'react'\r\nimport { Backdrop, Box, Modal, SxProps, styled } from '@mui/material'\r\n\r\nexport interface GlobalModalState {\r\n  sx?: SxProps\r\n  sxWrap?: SxProps\r\n  /** @default true */\r\n  backdropActivated?: boolean\r\n  onClose?: (reason?: TModalReason) => void\r\n  renderContent?: () => React.ReactNode\r\n}\r\n\r\nexport type TModalReason = 'backdropClick' | 'escapeKeyDown'\r\n\r\ninterface GlobalModalProps {}\r\n\r\nexport type TShowModal = (value: GlobalModalState) => void\r\n\r\nexport type TCloseModal = (event?: {}, reason?: TModalReason) => void\r\n\r\nexport interface IGlobalModalContext {\r\n  show: TShowModal\r\n  close: TCloseModal\r\n}\r\n\r\nexport const GlobalModalContext = React.createContext<IGlobalModalContext>({\r\n  close: () => {\r\n    console.warn('GlobalModal provider not found!')\r\n  },\r\n  show: () => {\r\n    console.warn('GlobalModal provider not found!')\r\n  }\r\n})\r\n\r\nexport interface IMapGlobalModal {\r\n  context: IGlobalModalContext\r\n}\r\n\r\nexport const mapGlobalModalContext = (context: (state: IGlobalModalContext) => React.ReactNode) => (\r\n  <GlobalModalContext.Consumer>{context}</GlobalModalContext.Consumer>\r\n)\r\n\r\nclass GlobalModal extends Component<React.PropsWithChildren<GlobalModalProps>, GlobalModalState> implements IGlobalModalContext {\r\n  constructor(props: any) {\r\n    super(props)\r\n    this.state = {}\r\n  }\r\n\r\n  show: TShowModal = (value) => {\r\n    this.setState(value)\r\n  }\r\n\r\n  close: TCloseModal = (_, reason) => {\r\n    if (reason === 'backdropClick' && this.state.backdropActivated === false) return\r\n    this.setState({ renderContent: undefined })\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <GlobalModalContext.Provider value={this}>\r\n        {this.props.children}\r\n        <Modal\r\n          open={!!this.state.renderContent}\r\n          onClose={this.close}\r\n          slots={{ backdrop: Backdrop }}\r\n          slotProps={{ backdrop: { timeout: 300 } }}\r\n          sx={this.state.sx}\r\n        >\r\n          <Wrapper sx={this.state.sxWrap}>{this.renderContent()}</Wrapper>\r\n        </Modal>\r\n      </GlobalModalContext.Provider>\r\n    )\r\n  }\r\n\r\n  renderContent = (): React.ReactNode => {\r\n    return this.state.renderContent ? this.state.renderContent() : <></>\r\n  }\r\n}\r\nexport default GlobalModal\r\n\r\nconst Wrapper = styled(Box)({\r\n  position: 'absolute',\r\n  top: '50%',\r\n  left: '50%',\r\n  transform: 'translate(-50%, -50%)',\r\n  outline: 'none'\r\n})\r\n\r\nexport interface IApiGlobalModalContextProps {\r\n  contextGlobalModal: IGlobalModalContext\r\n}\r\n\r\nexport const withApiGlobalModalContext = <P extends IApiGlobalModalContextProps>(Component: React.ComponentType<P>) => {\r\n  return (props: Omit<P, keyof IApiGlobalModalContextProps>) => {\r\n    return (\r\n      <GlobalModal>\r\n        {mapGlobalModalContext((context) => (\r\n          <Component {...(props as P)} contextGlobalModal={context} />\r\n        ))}\r\n      </GlobalModal>\r\n    )\r\n  }\r\n}\r\n\r\nexport const withApiGlobalModalConsumerContext = <P extends IApiGlobalModalContextProps>(Component: React.ComponentType<P>) => {\r\n  return (props: Omit<P, keyof IApiGlobalModalContextProps>) => {\r\n    return mapGlobalModalContext((context) => <Component {...(props as P)} contextGlobalModal={context} />)\r\n  }\r\n}\r\n"],"names":["GlobalModalContext","React","createContext","close","console","warn","show","mapGlobalModalContext","context","_jsx","Consumer","GlobalModal","props","_this","_classCallCheck","_callSuper","_defineProperty","value","setState","_","reason","state","backdropActivated","renderContent","undefined","_inherits","Component","_createClass","key","_jsxs","Provider","this","children","Modal","open","onClose","slots","backdrop","Backdrop","slotProps","timeout","sx","Wrapper","sxWrap","styled","Box","position","top","left","transform","outline","withApiGlobalModalContext","_objectSpread","contextGlobalModal","withApiGlobalModalConsumerContext"],"mappings":"iVAyBaA,EAAqBC,EAAMC,cAAmC,CACzEC,MAAO,WACLC,QAAQC,KAAK,kCACd,EACDC,KAAM,WACJF,QAAQC,KAAK,kCACf,IAOWE,EAAwB,SAACC,GAAwD,OAC5FC,EAACT,EAAmBU,mBAAUF,GAAsC,EAGhEG,aACJ,SAAAA,EAAYC,GAAU,IAAAC,EAEL,OAFKC,OAAAH,GACpBE,EAAAE,EAAAJ,KAAAA,GAAMC,IAAMI,EAAAH,EAIK,QAAA,SAACI,GAClBJ,EAAKK,SAASD,MACfD,EAAAH,EAAA,SAEoB,SAACM,EAAGC,GACR,kBAAXA,IAA+D,IAAjCP,EAAKQ,MAAMC,mBAC7CT,EAAKK,SAAS,CAAEK,mBAAeC,OAChCR,EAAAH,EAAA,iBAmBe,WACd,OAAOA,EAAKQ,MAAME,cAAgBV,EAAKQ,MAAME,gBAAkBd,WA9B/DI,EAAKQ,MAAQ,CAAE,EAAAR,CACjB,CAAC,OAAAY,EAAAd,EAJuBe,GAIvBC,EAAAhB,EAAA,CAAA,CAAAiB,IAAA,SAAAX,MAWD,WACE,OACEY,EAAC7B,EAAmB8B,UAASb,MAAOc,KAAIC,SAAA,CACrCD,KAAKnB,MAAMoB,SACZvB,EAACwB,EAAK,CACJC,OAAQH,KAAKV,MAAME,cACnBY,QAASJ,KAAK5B,MACdiC,MAAO,CAAEC,SAAUC,GACnBC,UAAW,CAAEF,SAAU,CAAEG,QAAS,MAClCC,GAAIV,KAAKV,MAAMoB,GAEfT,SAAAvB,EAACiC,EAAQ,CAAAD,GAAIV,KAAKV,MAAMsB,OAASX,SAAAD,KAAKR,sBAI9C,IAAC,IAQGmB,EAAUE,EAAOC,EAAPD,CAAY,CAC1BE,SAAU,WACVC,IAAK,MACLC,KAAM,MACNC,UAAW,wBACXC,QAAS,SAOEC,EAA4B,SAAwCzB,GAC/E,OAAO,SAACd,GACN,OACEH,EAACE,EACE,CAAAqB,SAAAzB,GAAsB,SAACC,GAAO,OAC7BC,EAACiB,EAAS0B,EAAAA,KAAMxC,GAAW,GAAA,CAAEyC,mBAAoB7C,IAClD,KAGN,CACH,EAEa8C,EAAoC,SAAwC5B,GACvF,OAAO,SAACd,GACN,OAAOL,GAAsB,SAACC,GAAO,OAAKC,EAACiB,EAAS0B,EAAAA,KAAMxC,GAAW,GAAA,CAAEyC,mBAAoB7C,OAC5F,CACH"}
+{"version":3,"file":"global-modal.js","sources":["../../src/api-context/global-modal.tsx"],"sourcesContent":["import React, { Component } from 'react'\r\nimport { Backdrop, Box, Modal, SxProps, styled } from '@mui/material'\r\n\r\nexport interface GlobalModalState {\r\n  sx?: SxProps\r\n  sxWrap?: SxProps\r\n  /** @default true */\r\n  backdropActivated?: boolean\r\n  onClose?: (reason?: TModalReason) => void\r\n  renderContent?: () => React.ReactNode\r\n}\r\n\r\nexport type TModalReason = 'backdropClick' | 'escapeKeyDown'\r\n\r\ninterface GlobalModalProps {}\r\n\r\nexport type TShowModal = (value: GlobalModalState) => void\r\n\r\nexport type TCloseModal = (event?: {}, reason?: TModalReason) => void\r\n\r\nexport interface IGlobalModalContext {\r\n  show: TShowModal\r\n  close: TCloseModal\r\n}\r\n\r\nexport const GlobalModalContext = React.createContext<IGlobalModalContext>({\r\n  close: () => {\r\n    console.warn('GlobalModal provider not found!')\r\n  },\r\n  show: () => {\r\n    console.warn('GlobalModal provider not found!')\r\n  }\r\n})\r\n\r\nexport interface IMapGlobalModal {\r\n  context: IGlobalModalContext\r\n}\r\n\r\nexport const mapGlobalModalContext = (context: (state: IGlobalModalContext) => React.ReactNode) => (\r\n  <GlobalModalContext.Consumer>{context}</GlobalModalContext.Consumer>\r\n)\r\n\r\nexport class GlobalModal extends Component<React.PropsWithChildren<GlobalModalProps>, GlobalModalState> implements IGlobalModalContext {\r\n  constructor(props: any) {\r\n    super(props)\r\n    this.state = {}\r\n  }\r\n\r\n  show: TShowModal = (value) => {\r\n    this.setState(value)\r\n  }\r\n\r\n  close: TCloseModal = (_, reason) => {\r\n    if (reason === 'backdropClick' && this.state.backdropActivated === false) return\r\n    this.setState({ renderContent: undefined })\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <GlobalModalContext.Provider value={this}>\r\n        {this.props.children}\r\n        <Modal\r\n          open={!!this.state.renderContent}\r\n          onClose={this.close}\r\n          slots={{ backdrop: Backdrop }}\r\n          slotProps={{ backdrop: { timeout: 300 } }}\r\n          sx={this.state.sx}\r\n        >\r\n          <Wrapper sx={this.state.sxWrap}>{this.renderContent()}</Wrapper>\r\n        </Modal>\r\n      </GlobalModalContext.Provider>\r\n    )\r\n  }\r\n\r\n  renderContent = (): React.ReactNode => {\r\n    return this.state.renderContent ? this.state.renderContent() : <></>\r\n  }\r\n}\r\nexport default GlobalModal\r\n\r\nconst Wrapper = styled(Box)({\r\n  position: 'absolute',\r\n  top: '50%',\r\n  left: '50%',\r\n  transform: 'translate(-50%, -50%)',\r\n  outline: 'none'\r\n})\r\n\r\nexport interface IApiGlobalModalContextProps {\r\n  contextGlobalModal: IGlobalModalContext\r\n}\r\n\r\nexport const withApiGlobalModalContext = <P extends IApiGlobalModalContextProps>(Component: React.ComponentType<P>) => {\r\n  return (props: Omit<P, keyof IApiGlobalModalContextProps>) => {\r\n    return (\r\n      <GlobalModal>\r\n        {mapGlobalModalContext((context) => (\r\n          <Component {...(props as P)} contextGlobalModal={context} />\r\n        ))}\r\n      </GlobalModal>\r\n    )\r\n  }\r\n}\r\n\r\nexport const withApiGlobalModalConsumerContext = <P extends IApiGlobalModalContextProps>(Component: React.ComponentType<P>) => {\r\n  return (props: Omit<P, keyof IApiGlobalModalContextProps>) => {\r\n    return mapGlobalModalContext((context) => <Component {...(props as P)} contextGlobalModal={context} />)\r\n  }\r\n}\r\n"],"names":["GlobalModalContext","React","createContext","close","console","warn","show","mapGlobalModalContext","context","_jsx","Consumer","GlobalModal","props","_this","_classCallCheck","_callSuper","_defineProperty","value","setState","_","reason","state","backdropActivated","renderContent","undefined","_inherits","Component","_createClass","key","_jsxs","Provider","this","children","Modal","open","onClose","slots","backdrop","Backdrop","slotProps","timeout","sx","Wrapper","sxWrap","styled","Box","position","top","left","transform","outline","withApiGlobalModalContext","_objectSpread","contextGlobalModal","withApiGlobalModalConsumerContext"],"mappings":"iVAyBaA,EAAqBC,EAAMC,cAAmC,CACzEC,MAAO,WACLC,QAAQC,KAAK,kCACd,EACDC,KAAM,WACJF,QAAQC,KAAK,kCACf,IAOWE,EAAwB,SAACC,GAAwD,OAC5FC,EAACT,EAAmBU,mBAAUF,GAAsC,EAGzDG,aACX,SAAAA,EAAYC,GAAU,IAAAC,EAEL,OAFKC,OAAAH,GACpBE,EAAAE,EAAAJ,KAAAA,GAAMC,IAAMI,EAAAH,EAIK,QAAA,SAACI,GAClBJ,EAAKK,SAASD,MACfD,EAAAH,EAAA,SAEoB,SAACM,EAAGC,GACR,kBAAXA,IAA+D,IAAjCP,EAAKQ,MAAMC,mBAC7CT,EAAKK,SAAS,CAAEK,mBAAeC,OAChCR,EAAAH,EAAA,iBAmBe,WACd,OAAOA,EAAKQ,MAAME,cAAgBV,EAAKQ,MAAME,gBAAkBd,WA9B/DI,EAAKQ,MAAQ,CAAE,EAAAR,CACjB,CAAC,OAAAY,EAAAd,EAJ8Be,GAI9BC,EAAAhB,EAAA,CAAA,CAAAiB,IAAA,SAAAX,MAWD,WACE,OACEY,EAAC7B,EAAmB8B,UAASb,MAAOc,KAAIC,SAAA,CACrCD,KAAKnB,MAAMoB,SACZvB,EAACwB,EAAK,CACJC,OAAQH,KAAKV,MAAME,cACnBY,QAASJ,KAAK5B,MACdiC,MAAO,CAAEC,SAAUC,GACnBC,UAAW,CAAEF,SAAU,CAAEG,QAAS,MAClCC,GAAIV,KAAKV,MAAMoB,GAEfT,SAAAvB,EAACiC,EAAQ,CAAAD,GAAIV,KAAKV,MAAMsB,OAASX,SAAAD,KAAKR,sBAI9C,IAAC,IAQGmB,EAAUE,EAAOC,EAAPD,CAAY,CAC1BE,SAAU,WACVC,IAAK,MACLC,KAAM,MACNC,UAAW,wBACXC,QAAS,SAOEC,EAA4B,SAAwCzB,GAC/E,OAAO,SAACd,GACN,OACEH,EAACE,EACE,CAAAqB,SAAAzB,GAAsB,SAACC,GAAO,OAC7BC,EAACiB,EAAS0B,EAAAA,KAAMxC,GAAW,GAAA,CAAEyC,mBAAoB7C,IAClD,KAGN,CACH,EAEa8C,EAAoC,SAAwC5B,GACvF,OAAO,SAACd,GACN,OAAOL,GAAsB,SAACC,GAAO,OAAKC,EAACiB,EAAS0B,EAAAA,KAAMxC,GAAW,GAAA,CAAEyC,mBAAoB7C,OAC5F,CACH"}

package/dist/api-context/index.js

@@ -1,2 +1,2 @@
-export{default as ApiPopover,ApiPopoverContext,mapApiPopoverContext,withApiPopoverContext}from"./popover.js";export{AlertDialog,default as AlertGlobal,ApiAlertContext}from"./alert-global.js";export{default as DrawerGlobal}from"./drawer-global.js";export{default as GlobalModal,GlobalModalContext,mapGlobalModalContext,withApiGlobalModalConsumerContext,withApiGlobalModalContext}from"./global-modal.js";export{default as PopoverGlobal,PopoverGlobalApi,PopoverGlobalContext,PopoverGlobalProvider,mapPopoverGlobalContext,withPopoverGlobalContext}from"./popover-global.js";
+export{default as ApiPopover,ApiPopoverContext,mapApiPopoverContext,withApiPopoverContext}from"./popover.js";export{AlertDialog,default as AlertGlobal,ApiAlertContext}from"./alert-global.js";export{default as DrawerGlobal}from"./drawer-global.js";export{GlobalModal,GlobalModalContext,mapGlobalModalContext,withApiGlobalModalConsumerContext,withApiGlobalModalContext}from"./global-modal.js";export{default as PopoverGlobal,PopoverGlobalApi,PopoverGlobalContext,PopoverGlobalProvider,mapPopoverGlobalContext,withPopoverGlobalContext}from"./popover-global.js";
 //# sourceMappingURL=index.js.map

package/dist/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 i,Breadcrumbs as l,Typography as n}from"@mui/material";import a from"@mui/icons-material/ArrowBackIos";var c=function(t){var i,c=null!==(i=t.value)&&void 0!==i?i:[];return o(l,{children:c.map((function(t,i){var l,c=!!t.onClick||!!t.url;return e(p,r(r({},(l=t).propsGetter?l.propsGetter():l.url?{component:"a",href:l.url}:{}),{},{onClick:t.onClick?function(r){return function(r,o){r.preventDefault(),r.stopPropagation(),o.onClick&&o.onClick(r)}(r,t)}:void 0,className:c?"clickable":"",children:[i<1&&o(a,{sx:{fontSize:"16px",mb:"3px",color:"#000"}}),o(n,{variant:"subtitle1",sx:{fontWeight:600},noWrap:!0,children:o("span",{children:t.label})})]}),"key"+i)}))})},p=t(i)({display:"flex",alignItems:"center",textDecoration:"none","&.clickable":{cursor:"pointer"},"& .MuiTypography-root":{color:"var(--color-title)"},"&.clickable:hover .MuiTypography-root":{textDecoration:"underline"}});export{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,{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/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  propsGetter?: () => TypographyProps\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\nconst 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    if (item.propsGetter) return item.propsGetter()\r\n    return 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 sx={{ fontSize: '16px', mb: '3px', color: '#000' }} />}\r\n            <Typography variant='subtitle1' sx={{ fontWeight: 600 }} 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)({\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  textDecoration: 'none',\r\n  '&.clickable': {\r\n    cursor: 'pointer'\r\n  },\r\n  '& .MuiTypography-root': {\r\n    color: 'var(--color-title)'\r\n  },\r\n  '&.clickable:hover .MuiTypography-root': {\r\n    textDecoration: 'underline'\r\n  }\r\n})\r\n"],"names":["Breadcrumbs","props","_props$value","list","value","_jsx","MUIBreadcrumbs","children","map","x","i","item","isClick","onClick","url","_jsxs","WrapTypography","_objectSpread","getItemProps","propsGetter","component","href","e","preventDefault","stopPropagation","handleClick","undefined","className","ArrowBackIosIcon","sx","fontSize","mb","color","Typography","variant","fontWeight","noWrap","label","styled","Box","display","alignItems","textDecoration","cursor"],"mappings":"4PAeA,IAAMA,EAAqC,SAACC,GAAS,IAAAC,EAC7CC,EAAkB,QAAdD,EAAGD,EAAMG,aAAK,IAAAF,EAAAA,EAAI,GAa5B,OACEG,EAACC,EAAc,CAAAC,SACZJ,EAAKK,KAAI,SAACC,EAAGC,GACZ,IARgBC,EAQVC,IAAYH,EAAEI,WAAaJ,EAAEK,IACnC,OACEC,EAACC,EAAcC,EAAAA,EAETC,CAAAA,GAZQP,EAYKF,GAXhBU,YAAoBR,EAAKQ,cAC3BR,EAAKG,IAAO,CAAEM,UAAW,IAAKC,KAAMV,EAAKG,KAA4B,CAAE,GAUnD,GAAA,CACnBD,QAASJ,EAAEI,QAAU,SAACS,GAAM,OAnBlB,SAACA,EAAiDb,GACpEa,EAAEC,iBACFD,EAAEE,kBACFf,EAAEI,SAAWJ,EAAEI,QAAQS,EACxB,CAe0CG,CAAYH,EAAGb,EAAE,OAAGiB,EACrDC,UAAWf,EAAU,YAAc,GAAEL,SAAA,CAEpCG,EAAI,GAAKL,EAACuB,EAAgB,CAACC,GAAI,CAAEC,SAAU,OAAQC,GAAI,MAAOC,MAAO,UACtE3B,EAAC4B,EAAU,CAACC,QAAQ,YAAYL,GAAI,CAAEM,WAAY,KAAOC,QACvD,EAAA7B,SAAAF,EAAA,OAAA,CAAAE,SAAOE,EAAE4B,aAPN,MAAQ3B,EAWlB,KAGP,EAGMM,EAAiBsB,EAAOC,EAAPD,CAAY,CACjCE,QAAS,OACTC,WAAY,SACZC,eAAgB,OAChB,cAAe,CACbC,OAAQ,WAEV,wBAAyB,CACvBX,MAAO,sBAET,wCAAyC,CACvCU,eAAgB"}
+{"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\nimport { fontSize } from '@mui/system'\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":"gQAgBaA,EAAqC,SAACC,GAAS,IAAAC,EACpDC,EAAkB,QAAdD,EAAGD,EAAMG,aAAK,IAAAF,EAAAA,EAAI,GAY5B,OACEG,EAACC,EAAc,CAAAC,SACZJ,EAAKK,KAAI,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,KAGP,EAGMO,EAAiBiB,EAAOC,EAAPD,EAAY,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/components/copy-to-clipboard.js

@@ -1,2 +1,2 @@
-import{inherits as o,createClass as e,objectWithoutProperties as t,objectSpread2 as i,classCallCheck as r,callSuper as n,defineProperty as l}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as s}from"react/jsx-runtime";import{Component as a}from"react";import{Tooltip as c,Box as p,IconButton as u}from"@mui/material";import d from"clipboard-copy";import m from"@mui/icons-material/Done";import h from"@mui/icons-material/ContentCopy";var f=["title"],C=function(){function C(o){var e;return r(this,C),e=n(this,C,[o]),l(e,"renderIcon",(function(){var o,t;if(null!==(o=e.props.slots)&&void 0!==o&&o.button){var r=e.props.slots.button;return s(r,{onClick:e.handleClickCopy,copied:e.state.copied})}var n=e.state.copied?m:h;return s(u,i(i({onClick:e.handleClickCopy},null===(t=e.props.slots)||void 0===t?void 0:t.buttonProps),{},{children:s(n,{fontSize:"small",sx:{color:"#606060"}})}))})),l(e,"handleClickCopy",(function(){e.debounceTime.start(),e.onCopy()})),l(e,"debounceTime",{cache:0,time:1500,start:function(){e.debounceTime.clear(),e.setState({copied:!0},(function(){e.debounceTime.cache=setTimeout((function(){e.setState({copied:!1})}),e.debounceTime.time)}))},clear:function(){clearTimeout(e.debounceTime.cache)}}),l(e,"onCopy",(function(){d(e.props.value),e.setState({showTooltip:!0})})),e.state={showTooltip:!1,copied:!1},e}return o(C,a),e(C,[{key:"render",value:function(){var o,e,r=this,n=this.state.copied?this.debounceTime.time-200:0,l=null!==(o=null===(e=this.props.slots)||void 0===e?void 0:e.tooltipProps)&&void 0!==o?o:{},a=l.title,u=t(l,f),d=this.state.copied?"Copied to clipboard!":null!=a?a:"Copy to clipboard";return s(c,i(i({arrow:!0,title:d,leaveDelay:n,open:this.state.showTooltip,onOpen:function(){return r.setState({showTooltip:!0})},onClose:function(){return r.setState({showTooltip:!1})}},u),{},{children:s(p,{sx:{display:"inline-block",flex:"0 0 auto"},children:this.renderIcon()})}))}}])}();export{C as default};
+import{inherits as o,createClass as e,objectWithoutProperties as t,objectSpread2 as i,classCallCheck as r,callSuper as n,defineProperty as l}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as s}from"react/jsx-runtime";import{Component as a}from"react";import{Tooltip as c,Box as p,IconButton as u}from"@mui/material";import d from"clipboard-copy";import m from"@mui/icons-material/Done";import h from"@mui/icons-material/ContentCopy";var f=["title"],C=function(){function C(o){var e;return r(this,C),e=n(this,C,[o]),l(e,"renderIcon",(function(){var o,t;if(null!==(o=e.props.slots)&&void 0!==o&&o.button){var r=e.props.slots.button;return s(r,{onClick:e.handleClickCopy,copied:e.state.copied})}var n=e.state.copied?m:h;return s(u,i(i({onClick:e.handleClickCopy},null===(t=e.props.slots)||void 0===t?void 0:t.buttonProps),{},{children:s(n,{fontSize:"small",sx:{color:"#606060"}})}))})),l(e,"handleClickCopy",(function(){e.debounceTime.start(),e.onCopy()})),l(e,"debounceTime",{cache:0,time:1500,start:function(){e.debounceTime.clear(),e.setState({copied:!0},(function(){e.debounceTime.cache=setTimeout((function(){e.setState({copied:!1})}),e.debounceTime.time)}))},clear:function(){clearTimeout(e.debounceTime.cache)}}),l(e,"onCopy",(function(){d(e.props.value),e.setState({showTooltip:!0})})),e.state={showTooltip:!1,copied:!1},e}return o(C,a),e(C,[{key:"render",value:function(){var o,e,r=this,n=this.state.copied?this.debounceTime.time-200:0,l=null!==(o=null===(e=this.props.slots)||void 0===e?void 0:e.tooltipProps)&&void 0!==o?o:{},a=l.title,u=t(l,f),d=this.state.copied?"Copied to clipboard!":null!=a?a:"Copy to clipboard";return s(c,i(i({arrow:!0,title:d,leaveDelay:n,open:this.state.showTooltip,onOpen:function(){return r.setState({showTooltip:!0})},onClose:function(){return r.setState({showTooltip:!1})}},u),{},{children:s(p,{sx:{display:"inline-block",flex:"0 0 auto"},children:this.renderIcon()})}))}}])}();export{C as CopyToClipboard,C as default};
 //# sourceMappingURL=copy-to-clipboard.js.map

package/dist/components/copy-to-clipboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"copy-to-clipboard.js","sources":["../../src/components/copy-to-clipboard.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Box, ButtonProps, IconButton, Tooltip, TooltipProps } from '@mui/material'\r\nimport copy from 'clipboard-copy'\r\nimport DoneIcon from '@mui/icons-material/Done'\r\nimport ContentCopyIcon from '@mui/icons-material/ContentCopy'\r\n\r\nexport interface ICopyToClipboardProps {\r\n  value: string\r\n  slots?: {\r\n    tooltipProps?: Partial<TooltipProps>\r\n    button?: ComponentType<{ onClick: () => void; copied?: boolean }>\r\n    buttonProps?: ButtonProps\r\n  }\r\n}\r\n\r\nexport interface ICopyToClipboardState {\r\n  showTooltip: boolean\r\n  copied: boolean\r\n}\r\n\r\nclass CopyToClipboard extends Component<ICopyToClipboardProps, ICopyToClipboardState> {\r\n  constructor(props: ICopyToClipboardProps) {\r\n    super(props)\r\n    this.state = { showTooltip: false, copied: false }\r\n  }\r\n\r\n  render() {\r\n    const leaveDelay = this.state.copied ? this.debounceTime.time - 200 : 0\r\n    const { title, ...tooltipProps } = this.props.slots?.tooltipProps ?? {}\r\n    const titleValue = this.state.copied ? 'Copied to clipboard!' : title ?? 'Copy to clipboard'\r\n    return (\r\n      <Tooltip\r\n        arrow\r\n        title={titleValue}\r\n        leaveDelay={leaveDelay}\r\n        open={this.state.showTooltip}\r\n        onOpen={() => this.setState({ showTooltip: true })}\r\n        onClose={() => this.setState({ showTooltip: false })}\r\n        {...tooltipProps}\r\n      >\r\n        <Box sx={{ display: 'inline-block', flex: '0 0 auto' }}>{this.renderIcon()}</Box>\r\n      </Tooltip>\r\n    )\r\n  }\r\n\r\n  renderIcon = () => {\r\n    if (this.props.slots?.button) {\r\n      const ButtonComp = this.props.slots.button\r\n      return <ButtonComp onClick={this.handleClickCopy} copied={this.state.copied} />\r\n    }\r\n    const Icon = this.state.copied ? DoneIcon : ContentCopyIcon\r\n    return (\r\n      <IconButton onClick={this.handleClickCopy} {...this.props.slots?.buttonProps}>\r\n        <Icon fontSize='small' sx={{ color: '#606060' }} />\r\n      </IconButton>\r\n    )\r\n  }\r\n\r\n  handleClickCopy = () => {\r\n    this.debounceTime.start()\r\n    this.onCopy()\r\n  }\r\n\r\n  private debounceTime = {\r\n    cache: 0 as any,\r\n    time: 1500,\r\n    start: () => {\r\n      this.debounceTime.clear()\r\n      this.setState({ copied: true }, () => {\r\n        this.debounceTime.cache = setTimeout(() => {\r\n          this.setState({ copied: false })\r\n        }, this.debounceTime.time)\r\n      })\r\n    },\r\n    clear: () => {\r\n      clearTimeout(this.debounceTime.cache)\r\n    }\r\n  }\r\n\r\n  private onCopy = () => {\r\n    copy(this.props.value)\r\n    this.setState({ showTooltip: true })\r\n  }\r\n}\r\nexport default CopyToClipboard\r\n"],"names":["CopyToClipboard","props","_this","_classCallCheck","_callSuper","_defineProperty","_this$props$slots","_this$props$slots2","slots","button","ButtonComp","_jsx","onClick","handleClickCopy","copied","state","Icon","DoneIcon","ContentCopyIcon","IconButton","_objectSpread","buttonProps","children","fontSize","sx","color","debounceTime","start","onCopy","cache","time","clear","setState","setTimeout","clearTimeout","copy","value","showTooltip","_inherits","Component","_createClass","key","_this$props$slots$too","_this$props$slots3","_this2","this","leaveDelay","_ref","tooltipProps","title","_objectWithoutProperties","_excluded","titleValue","Tooltip","arrow","open","onOpen","onClose","Box","display","flex","renderIcon"],"mappings":"4cAoBMA,aACJ,SAAAA,EAAYC,GAA4B,IAAAC,EAEY,OAFZC,OAAAH,GACtCE,EAAAE,EAAAJ,KAAAA,GAAMC,IAAMI,EAAAH,EAAA,cAuBD,WAAK,IAAAI,EAAAC,EAChB,GAAoB,QAApBD,EAAIJ,EAAKD,MAAMO,aAAK,IAAAF,GAAhBA,EAAkBG,OAAQ,CAC5B,IAAMC,EAAaR,EAAKD,MAAMO,MAAMC,OACpC,OAAOE,EAACD,EAAU,CAACE,QAASV,EAAKW,gBAAiBC,OAAQZ,EAAKa,MAAMD,QACtE,CACD,IAAME,EAAOd,EAAKa,MAAMD,OAASG,EAAWC,EAC5C,OACEP,EAACQ,EAAUC,EAAAA,EAAA,CAACR,QAASV,EAAKW,iBAAqC,QAAtBN,EAAML,EAAKD,MAAMO,aAAK,IAAAD,OAAA,EAAhBA,EAAkBc,aAAW,CAAA,EAAA,CAC1EC,SAAAX,EAACK,EAAK,CAAAO,SAAS,QAAQC,GAAI,CAAEC,MAAO,mBAGzCpB,EAAAH,EAAA,mBAEiB,WAChBA,EAAKwB,aAAaC,QAClBzB,EAAK0B,YACNvB,EAAAH,EAEsB,eAAA,CACrB2B,MAAO,EACPC,KAAM,KACNH,MAAO,WACLzB,EAAKwB,aAAaK,QAClB7B,EAAK8B,SAAS,CAAElB,QAAQ,IAAQ,WAC9BZ,EAAKwB,aAAaG,MAAQI,YAAW,WACnC/B,EAAK8B,SAAS,CAAElB,QAAQ,GAC1B,GAAGZ,EAAKwB,aAAaI,KACvB,GACD,EACDC,MAAO,WACLG,aAAahC,EAAKwB,aAAaG,MACjC,IACDxB,EAAAH,EAAA,UAEgB,WACfiC,EAAKjC,EAAKD,MAAMmC,OAChBlC,EAAK8B,SAAS,CAAEK,aAAa,OA1D7BnC,EAAKa,MAAQ,CAAEsB,aAAa,EAAOvB,QAAQ,GAAOZ,CACpD,CAAC,OAAAoC,EAAAtC,EAJ2BuC,GAI3BC,EAAAxC,EAAA,CAAA,CAAAyC,IAAA,SAAAL,MAED,WAAM,IAAAM,EAAAC,EAAAC,EAAAC,KACEC,EAAaD,KAAK9B,MAAMD,OAAS+B,KAAKnB,aAAaI,KAAO,IAAM,EACtEiB,EAAiE,QAAjEL,UAAAC,EAAmCE,KAAK5C,MAAMO,aAAK,IAAAmC,OAAA,EAAhBA,EAAkBK,oBAAYN,IAAAA,EAAAA,EAAI,CAAE,EAA/DO,EAAKF,EAALE,MAAUD,EAAYE,EAAAH,EAAAI,GACxBC,EAAaP,KAAK9B,MAAMD,OAAS,uBAAyBmC,QAAAA,EAAS,oBACzE,OACEtC,EAAC0C,EAAOjC,EAAAA,EAAA,CACNkC,SACAL,MAAOG,EACPN,WAAYA,EACZS,KAAMV,KAAK9B,MAAMsB,YACjBmB,OAAQ,WAAF,OAAQZ,EAAKZ,SAAS,CAAEK,aAAa,GAAO,EAClDoB,QAAS,WAAF,OAAQb,EAAKZ,SAAS,CAAEK,aAAa,GAAQ,GAChDW,GAAY,GAAA,CAAA1B,SAEhBX,EAAC+C,EAAG,CAAClC,GAAI,CAAEmC,QAAS,eAAgBC,KAAM,YAAYtC,SAAGuB,KAAKgB,iBAGpE,IAAC"}
+{"version":3,"file":"copy-to-clipboard.js","sources":["../../src/components/copy-to-clipboard.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Box, ButtonProps, IconButton, Tooltip, TooltipProps } from '@mui/material'\r\nimport copy from 'clipboard-copy'\r\nimport DoneIcon from '@mui/icons-material/Done'\r\nimport ContentCopyIcon from '@mui/icons-material/ContentCopy'\r\n\r\nexport interface ICopyToClipboardProps {\r\n  value: string\r\n  slots?: {\r\n    tooltipProps?: Partial<TooltipProps>\r\n    button?: ComponentType<{ onClick: () => void; copied?: boolean }>\r\n    buttonProps?: ButtonProps\r\n  }\r\n}\r\n\r\nexport interface ICopyToClipboardState {\r\n  showTooltip: boolean\r\n  copied: boolean\r\n}\r\n\r\nexport class CopyToClipboard extends Component<ICopyToClipboardProps, ICopyToClipboardState> {\r\n  constructor(props: ICopyToClipboardProps) {\r\n    super(props)\r\n    this.state = { showTooltip: false, copied: false }\r\n  }\r\n\r\n  render() {\r\n    const leaveDelay = this.state.copied ? this.debounceTime.time - 200 : 0\r\n    const { title, ...tooltipProps } = this.props.slots?.tooltipProps ?? {}\r\n    const titleValue = this.state.copied ? 'Copied to clipboard!' : title ?? 'Copy to clipboard'\r\n    return (\r\n      <Tooltip\r\n        arrow\r\n        title={titleValue}\r\n        leaveDelay={leaveDelay}\r\n        open={this.state.showTooltip}\r\n        onOpen={() => this.setState({ showTooltip: true })}\r\n        onClose={() => this.setState({ showTooltip: false })}\r\n        {...tooltipProps}\r\n      >\r\n        <Box sx={{ display: 'inline-block', flex: '0 0 auto' }}>{this.renderIcon()}</Box>\r\n      </Tooltip>\r\n    )\r\n  }\r\n\r\n  renderIcon = () => {\r\n    if (this.props.slots?.button) {\r\n      const ButtonComp = this.props.slots.button\r\n      return <ButtonComp onClick={this.handleClickCopy} copied={this.state.copied} />\r\n    }\r\n    const Icon = this.state.copied ? DoneIcon : ContentCopyIcon\r\n    return (\r\n      <IconButton onClick={this.handleClickCopy} {...this.props.slots?.buttonProps}>\r\n        <Icon fontSize='small' sx={{ color: '#606060' }} />\r\n      </IconButton>\r\n    )\r\n  }\r\n\r\n  handleClickCopy = () => {\r\n    this.debounceTime.start()\r\n    this.onCopy()\r\n  }\r\n\r\n  private debounceTime = {\r\n    cache: 0 as any,\r\n    time: 1500,\r\n    start: () => {\r\n      this.debounceTime.clear()\r\n      this.setState({ copied: true }, () => {\r\n        this.debounceTime.cache = setTimeout(() => {\r\n          this.setState({ copied: false })\r\n        }, this.debounceTime.time)\r\n      })\r\n    },\r\n    clear: () => {\r\n      clearTimeout(this.debounceTime.cache)\r\n    }\r\n  }\r\n\r\n  private onCopy = () => {\r\n    copy(this.props.value)\r\n    this.setState({ showTooltip: true })\r\n  }\r\n}\r\nexport default CopyToClipboard\r\n"],"names":["CopyToClipboard","props","_this","_classCallCheck","_callSuper","_defineProperty","_this$props$slots","_this$props$slots2","slots","button","ButtonComp","_jsx","onClick","handleClickCopy","copied","state","Icon","DoneIcon","ContentCopyIcon","IconButton","_objectSpread","buttonProps","children","fontSize","sx","color","debounceTime","start","onCopy","cache","time","clear","setState","setTimeout","clearTimeout","copy","value","showTooltip","_inherits","Component","_createClass","key","_this$props$slots$too","_this$props$slots3","_this2","this","leaveDelay","_ref","tooltipProps","title","_objectWithoutProperties","_excluded","titleValue","Tooltip","arrow","open","onOpen","onClose","Box","display","flex","renderIcon"],"mappings":"4cAoBaA,aACX,SAAAA,EAAYC,GAA4B,IAAAC,EAEY,OAFZC,OAAAH,GACtCE,EAAAE,EAAAJ,KAAAA,GAAMC,IAAMI,EAAAH,EAAA,cAuBD,WAAK,IAAAI,EAAAC,EAChB,GAAoB,QAApBD,EAAIJ,EAAKD,MAAMO,aAAK,IAAAF,GAAhBA,EAAkBG,OAAQ,CAC5B,IAAMC,EAAaR,EAAKD,MAAMO,MAAMC,OACpC,OAAOE,EAACD,EAAU,CAACE,QAASV,EAAKW,gBAAiBC,OAAQZ,EAAKa,MAAMD,QACtE,CACD,IAAME,EAAOd,EAAKa,MAAMD,OAASG,EAAWC,EAC5C,OACEP,EAACQ,EAAUC,EAAAA,EAAA,CAACR,QAASV,EAAKW,iBAAqC,QAAtBN,EAAML,EAAKD,MAAMO,aAAK,IAAAD,OAAA,EAAhBA,EAAkBc,aAAW,CAAA,EAAA,CAC1EC,SAAAX,EAACK,EAAK,CAAAO,SAAS,QAAQC,GAAI,CAAEC,MAAO,mBAGzCpB,EAAAH,EAAA,mBAEiB,WAChBA,EAAKwB,aAAaC,QAClBzB,EAAK0B,YACNvB,EAAAH,EAEsB,eAAA,CACrB2B,MAAO,EACPC,KAAM,KACNH,MAAO,WACLzB,EAAKwB,aAAaK,QAClB7B,EAAK8B,SAAS,CAAElB,QAAQ,IAAQ,WAC9BZ,EAAKwB,aAAaG,MAAQI,YAAW,WACnC/B,EAAK8B,SAAS,CAAElB,QAAQ,GAC1B,GAAGZ,EAAKwB,aAAaI,KACvB,GACD,EACDC,MAAO,WACLG,aAAahC,EAAKwB,aAAaG,MACjC,IACDxB,EAAAH,EAAA,UAEgB,WACfiC,EAAKjC,EAAKD,MAAMmC,OAChBlC,EAAK8B,SAAS,CAAEK,aAAa,OA1D7BnC,EAAKa,MAAQ,CAAEsB,aAAa,EAAOvB,QAAQ,GAAOZ,CACpD,CAAC,OAAAoC,EAAAtC,EAJkCuC,GAIlCC,EAAAxC,EAAA,CAAA,CAAAyC,IAAA,SAAAL,MAED,WAAM,IAAAM,EAAAC,EAAAC,EAAAC,KACEC,EAAaD,KAAK9B,MAAMD,OAAS+B,KAAKnB,aAAaI,KAAO,IAAM,EACtEiB,EAAiE,QAAjEL,UAAAC,EAAmCE,KAAK5C,MAAMO,aAAK,IAAAmC,OAAA,EAAhBA,EAAkBK,oBAAYN,IAAAA,EAAAA,EAAI,CAAE,EAA/DO,EAAKF,EAALE,MAAUD,EAAYE,EAAAH,EAAAI,GACxBC,EAAaP,KAAK9B,MAAMD,OAAS,uBAAyBmC,QAAAA,EAAS,oBACzE,OACEtC,EAAC0C,EAAOjC,EAAAA,EAAA,CACNkC,SACAL,MAAOG,EACPN,WAAYA,EACZS,KAAMV,KAAK9B,MAAMsB,YACjBmB,OAAQ,WAAF,OAAQZ,EAAKZ,SAAS,CAAEK,aAAa,GAAO,EAClDoB,QAAS,WAAF,OAAQb,EAAKZ,SAAS,CAAEK,aAAa,GAAQ,GAChDW,GAAY,GAAA,CAAA1B,SAEhBX,EAAC+C,EAAG,CAAClC,GAAI,CAAEmC,QAAS,eAAgBC,KAAM,YAAYtC,SAAGuB,KAAKgB,iBAGpE,IAAC"}

package/dist/components/index.js

@@ -1,2 +1,2 @@
-export{default as Breadcrumbs}from"./breadcrumbs.js";export{LoadingButton}from"./buttons.js";export{default as CopyToClipboard}from"./copy-to-clipboard.js";export{default as CreateMultiSelectDropdown}from"./create.multi-select-dropdown.js";export{default as ImageWithFallback}from"./image-with-fallback.js";export{default as HelpTooltip,HelpTooltipWrap}from"./help-tooltip.js";export{default as TextEditorPreview}from"./text-editor.preview.js";export{default as TextEditor,textEditorClasses}from"./text-editor.js";
+export{Breadcrumbs}from"./breadcrumbs.js";export{LoadingButton}from"./buttons.js";export{CopyToClipboard}from"./copy-to-clipboard.js";export{default as CreateMultiSelectDropdown}from"./create.multi-select-dropdown.js";export{default as ImageWithFallback}from"./image-with-fallback.js";export{default as HelpTooltip,HelpTooltipWrap}from"./help-tooltip.js";export{default as TextEditorPreview}from"./text-editor.preview.js";export{default as TextEditor,textEditorClasses}from"./text-editor.js";
 //# sourceMappingURL=index.js.map

package/dist/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 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 b={root:"ActiveFiltersPanel-root",content:"ActiveFiltersPanel-content",item:"ActiveFiltersPanel-item",itemContent:"ActiveFiltersPanel-itemContent",itemChip:"ActiveFiltersPanel-itemChip",removeButton:"ActiveFiltersPanel-removeButton",overlay:"ActiveFiltersPanel-overlay"};function w(){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:b.item,children:[o(v,{variant:"caption",sx:{fontWeight:700},children:[e.label||(null===(t=e.field)||void 0===t?void 0:t.toString()),":"]}),e.items.map((function(t){return n(f,{clickable:!0,size:"small",label:t.label||t.value,className:b.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:b.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:b.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(V,{className:b.root,children:[o(u,{className:b.content,children:[e.renderSort(),e.renderQuickSearch(),e.renderFilters(),!r&&n(h,{className:b.removeButton,onClick:e.handleClearAll})]}),e.props.loading&&n(u,{className:b.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 V=d(u)(e(e(e(e(e({position:"relative"},".".concat(b.content),{display:"flex",alignItems:"center",flexWrap:"wrap",gap:"8px"}),".".concat(b.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(b.itemContent),{display:"flex",flexWrap:"wrap",gap:"4px"}),".".concat(b.itemChip),{borderRadius:"4px"}),".".concat(b.overlay),{position:"absolute",top:0,left:0,width:"100%",height:"100%",backdropFilter:"blur(1px)"}));export{b as activeFiltersPanelClasses,w 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/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  },\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","items","map","_jsx","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","top","left","width","height","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/data-view/create.pagination-bar.js

@@ -1,2 +1,2 @@
-import{objectSpread2 as e,defineProperty as a,inherits as n,createClass as t,classCallCheck as i,callSuper as r}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o}from"react/jsx-runtime";import{Component as l}from"react";import{styled as s,TablePagination as p}from"@mui/material";import{createFilterStore as u}from"./filter-store.js";function g(){var e=function(){function e(){var n;i(this,e);for(var t=arguments.length,o=new Array(t),l=0;l<t;l++)o[l]=arguments[l];return n=r(this,e,[].concat(o)),a(n,"handleChangePage",(function(e,a){var t,i,r,o=u(null!==(t=n.props.filter)&&void 0!==t?t:{},n.defaultFilter),l={page:a,pageSize:n.pagination.pageSize};o.changePagination(l,{reason:"pagination"}),null===(i=(r=n.props).onChange)||void 0===i||i.call(r,o.build())})),a(n,"handleChangeRowsPerPage",(function(e){var a,t,i,r=parseInt(e.target.value,10),o=u(null!==(a=n.props.filter)&&void 0!==a?a:{},n.defaultFilter);o.changePagination({page:0,pageSize:r},{reason:"pagination"}),null===(t=(i=n.props).onChange)||void 0===t||t.call(i,o.build())})),n}return n(e,l),t(e,[{key:"defaultFilter",get:function(){return this.props.defaultFilter||{}}},{key:"defaultPagination",get:function(){var e;return(null===(e=this.defaultFilter)||void 0===e?void 0:e.pagination)||{page:0,pageSize:10}}},{key:"pagination",get:function(){var e;return(null===(e=this.props.filter)||void 0===e?void 0:e.pagination)||this.defaultPagination}},{key:"rowsPerPageOptions",get:function(){return this.props.rowsPerPageOptions||[10,25,50,100]}},{key:"render",value:function(){var e=this.pagination,a=e.page,n=e.pageSize;return o(c,{size:"small",page:a,count:this.props.count||0,onPageChange:this.handleChangePage,rowsPerPage:n,onRowsPerPageChange:this.handleChangeRowsPerPage,rowsPerPageOptions:this.rowsPerPageOptions,labelRowsPerPage:"Items per page",slotProps:{actions:{nextButton:{size:"small"},previousButton:{size:"small"}},select:{MenuProps:{disableScrollLock:this.props.disableScrollLock}}}})}}])}();return e}var c=s((function(a){return o(p,e({component:"div"},a))}))((function(e){var n=e.theme;return{"@media (min-width: 600px)":{".MuiToolbar-root":{minHeight:"48px"}},".MuiTablePagination-selectLabel":a({},n.breakpoints.down("sm"),{display:"none"})}}));export{g as createPaginationBar,g as default};
+import{objectSpread2 as e,defineProperty as n,inherits as t,createClass as a,classCallCheck as i,callSuper as r}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o}from"react/jsx-runtime";import{Component as l}from"react";import{styled as s,TablePagination as p,Pagination as u,useTheme as g,useMediaQuery as c}from"@mui/material";import{createFilterStore as h}from"./filter-store.js";function d(){var e=function(){function e(){var t;i(this,e);for(var a=arguments.length,o=new Array(a),l=0;l<a;l++)o[l]=arguments[l];return t=r(this,e,[].concat(o)),n(t,"handleChangePage",(function(e,n){var a,i,r,o=h(null!==(a=t.props.filter)&&void 0!==a?a:{},t.defaultFilter),l={page:n,pageSize:t.pagination.pageSize};o.changePagination(l,{reason:"pagination"}),null===(i=(r=t.props).onChange)||void 0===i||i.call(r,o.build())})),n(t,"handleChangeRowsPerPage",(function(e){var n,a,i,r=parseInt(e.target.value,10),o=h(null!==(n=t.props.filter)&&void 0!==n?n:{},t.defaultFilter);o.changePagination({page:0,pageSize:r},{reason:"pagination"}),null===(a=(i=t.props).onChange)||void 0===a||a.call(i,o.build())})),t}return t(e,l),a(e,[{key:"defaultFilter",get:function(){return this.props.defaultFilter||{}}},{key:"defaultPagination",get:function(){var e;return(null===(e=this.defaultFilter)||void 0===e?void 0:e.pagination)||{page:0,pageSize:10}}},{key:"pagination",get:function(){var e;return(null===(e=this.props.filter)||void 0===e?void 0:e.pagination)||this.defaultPagination}},{key:"rowsPerPageOptions",get:function(){return this.props.rowsPerPageOptions||[10,25,50,100]}},{key:"render",value:function(){var e=this,n=this.pagination,t=n.page,a=n.pageSize,i=this.props.isMobile;return!this.props.count||1===Math.ceil(this.props.count/a)&&i?null:i?o(P,{siblingCount:0,page:t+1,count:Math.ceil(this.props.count/a),onChange:function(n,t){return e.handleChangePage(null,t-1)},size:"small",color:"primary",sx:{my:1}}):o(m,{size:"small",page:t,count:this.props.count||0,onPageChange:this.handleChangePage,rowsPerPage:a,onRowsPerPageChange:this.handleChangeRowsPerPage,rowsPerPageOptions:this.rowsPerPageOptions,slotProps:{actions:{nextButton:{size:"small"},previousButton:{size:"small"}},select:{MenuProps:{disableScrollLock:this.props.disableScrollLock}}}})}}])}();return e}function f(n){var t=d();return function(n){var a=g(),i=c(a.breakpoints.down("md"));return o(t,e(e({},n),{},{isMobile:i}))}}var m=s((function(n){return o(p,e({component:"div"},n))}))((function(e){var t=e.theme;return{marginLeft:"auto","@media (min-width: 600px)":{".MuiToolbar-root":{minHeight:"48px"}},".MuiTablePagination-selectLabel":n({},t.breakpoints.down("sm"),{display:"none"})}})),P=s((function(n){return o(u,e({},n))}))({marginLeft:"auto",".Mui-selected":{backgroundColor:"color-mix(in srgb, rgb(232, 140, 63) 60%, transparent) !important"},"@media (min-width: 600px)":{".MuiToolbar-root":{minHeight:"48px"}}});export{f as createPaginationBar,d as createTablePagination,f as default};
 //# sourceMappingURL=create.pagination-bar.js.map

package/dist/data-view/create.pagination-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"create.pagination-bar.js","sources":["../../src/data-view/create.pagination-bar.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { styled, TablePagination, TablePaginationProps } from '@mui/material'\r\nimport { createFilterStore } from './filter-store'\r\nimport { IFilterState, IPagination } from './types'\r\n\r\nexport interface IPaginationBarConfigs {\r\n  rowsPerPageOptions?: number[]\r\n  disableScrollLock?: boolean\r\n  enablePaginationTop?: boolean\r\n}\r\n\r\nexport interface IPaginationBarProps<T> extends IPaginationBarConfigs {\r\n  count?: number\r\n  filter?: IFilterState<T>\r\n  defaultFilter?: IFilterState<T>\r\n  onChange?: (value: IFilterState<T>) => void\r\n}\r\n\r\nexport type IPaginationBarParams<T> = Pick<IPaginationBarProps<T>, 'defaultFilter' | 'rowsPerPageOptions'>\r\n\r\nexport function createPaginationBar<T>(): ComponentType<IPaginationBarProps<T>> {\r\n  class PaginationBar extends Component<IPaginationBarProps<T>> {\r\n    get defaultFilter(): IFilterState<T> {\r\n      return this.props.defaultFilter || {}\r\n    }\r\n\r\n    get defaultPagination(): Required<IPagination> {\r\n      return (this.defaultFilter?.pagination as any) || { page: 0, pageSize: 10 }\r\n    }\r\n\r\n    get pagination(): Required<IPagination> {\r\n      return (this.props.filter?.pagination as any) || this.defaultPagination\r\n    }\r\n\r\n    get rowsPerPageOptions(): number[] {\r\n      return this.props.rowsPerPageOptions || [10, 25, 50, 100]\r\n    }\r\n\r\n    handleChangePage = (_: React.MouseEvent<HTMLButtonElement> | null, newPage: number) => {\r\n      const store = createFilterStore<T>(this.props.filter ?? {}, this.defaultFilter)\r\n      const { pageSize } = this.pagination\r\n      const obj: IPagination = { page: newPage, pageSize }\r\n      store.changePagination(obj, { reason: 'pagination' })\r\n      this.props.onChange?.(store.build())\r\n    }\r\n\r\n    handleChangeRowsPerPage = (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\r\n      const newPageSize = parseInt(event.target.value, 10)\r\n      const store = createFilterStore<T>(this.props.filter ?? {}, this.defaultFilter)\r\n      store.changePagination({ page: 0, pageSize: newPageSize }, { reason: 'pagination' })\r\n      this.props.onChange?.(store.build())\r\n    }\r\n\r\n    render() {\r\n      const { page, pageSize } = this.pagination\r\n      return (\r\n        <TablePaginationCustom\r\n          size='small'\r\n          page={page}\r\n          count={this.props.count || 0}\r\n          onPageChange={this.handleChangePage}\r\n          rowsPerPage={pageSize}\r\n          onRowsPerPageChange={this.handleChangeRowsPerPage}\r\n          rowsPerPageOptions={this.rowsPerPageOptions}\r\n          labelRowsPerPage='Items per page'\r\n          slotProps={{\r\n            actions: { nextButton: { size: 'small' }, previousButton: { size: 'small' } },\r\n            select: { MenuProps: { disableScrollLock: this.props.disableScrollLock } }\r\n          }}\r\n        />\r\n      )\r\n    }\r\n  }\r\n  return PaginationBar\r\n}\r\nexport default createPaginationBar\r\n\r\nconst TablePaginationCustom = styled((p: TablePaginationProps) => <TablePagination component='div' {...p} />)(({ theme }) => ({\r\n  '@media (min-width: 600px)': {\r\n    '.MuiToolbar-root': {\r\n      minHeight: '48px'\r\n    },\r\n  },\r\n  '.MuiTablePagination-selectLabel': {\r\n    [theme.breakpoints.down('sm')]: {\r\n      display: 'none'\r\n    }\r\n  }\r\n}))\r\n"],"names":["createPaginationBar","PaginationBar","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","_","newPage","_this$props$filter","_this$props$onChange","_this$props","store","createFilterStore","props","filter","defaultFilter","obj","page","pageSize","pagination","changePagination","reason","onChange","call","build","event","_this$props$filter2","_this$props$onChange2","_this$props2","newPageSize","parseInt","target","value","_inherits","Component","_createClass","key","get","_this$defaultFilter","_this$props$filter3","defaultPagination","rowsPerPageOptions","_this$pagination","_jsx","TablePaginationCustom","size","count","onPageChange","handleChangePage","rowsPerPage","onRowsPerPageChange","handleChangeRowsPerPage","labelRowsPerPage","slotProps","actions","nextButton","previousButton","select","MenuProps","disableScrollLock","styled","p","TablePagination","_objectSpread","component","_ref","theme","minHeight","breakpoints","down","display"],"mappings":"oWAoBgBA,IAAmB,IAC3BC,aAAc,SAAAA,IAAA,IAAAC,EAAAC,OAAAF,GAAA,IAAA,IAAAG,EAAAC,UAAAC,OAAAC,EAAAC,IAAAA,MAAAJ,GAAAK,EAAA,EAAAA,EAAAL,EAAAK,IAAAF,EAAAE,GAAAJ,UAAAI,GA8BjB,OA9BiBP,EAAAQ,EAAAC,KAAAV,EAAAW,GAAAA,OAAAL,IAAAM,EAAAX,EAAA,oBAiBC,SAACY,EAA+CC,GAAmB,IAAAC,EAAAC,EAAAC,EAC9EC,EAAQC,UAAiBJ,EAAId,EAAKmB,MAAMC,cAAM,IAAAN,EAAAA,EAAI,CAAA,EAAId,EAAKqB,eAE3DC,EAAmB,CAAEC,KAAMV,EAASW,SADrBxB,EAAKyB,WAAlBD,UAERP,EAAMS,iBAAiBJ,EAAK,CAAEK,OAAQ,eACnBZ,QAAnBA,GAAAC,EAAAhB,EAAKmB,OAAMS,oBAAQb,GAAnBA,EAAAc,KAAAb,EAAsBC,EAAMa,YAC7BnB,EAAAX,EAEyB,2BAAA,SAAC+B,GAAoE,IAAAC,EAAAC,EAAAC,EACvFC,EAAcC,SAASL,EAAMM,OAAOC,MAAO,IAC3CrB,EAAQC,UAAiBc,EAAIhC,EAAKmB,MAAMC,cAAM,IAAAY,EAAAA,EAAI,CAAA,EAAIhC,EAAKqB,eACjEJ,EAAMS,iBAAiB,CAAEH,KAAM,EAAGC,SAAUW,GAAe,CAAER,OAAQ,eAClDM,QAAnBA,GAAAC,EAAAlC,EAAKmB,OAAMS,oBAAQK,GAAnBA,EAAAJ,KAAAK,EAAsBjB,EAAMa,YAC7B9B,CAAA,CAAA,OAAAuC,EAAAxC,EA9ByByC,GA8BzBC,EAAA1C,EAAA,CAAA,CAAA2C,IAAA,gBAAAC,IA7BD,WACE,OAAOlC,KAAKU,MAAME,eAAiB,CAAE,CACvC,GAAC,CAAAqB,IAAA,oBAAAC,IAED,WAAqB,IAAAC,EACnB,OAA0BA,QAAlBA,EAAAnC,KAAKY,qBAALuB,IAAkBA,OAAlBA,EAAAA,EAAoBnB,aAAsB,CAAEF,KAAM,EAAGC,SAAU,GACzE,GAAC,CAAAkB,IAAA,aAAAC,IAED,WAAc,IAAAE,EACZ,OAAyB,QAAjBA,EAAApC,KAAKU,MAAMC,cAAM,IAAAyB,OAAA,EAAjBA,EAAmBpB,aAAsBhB,KAAKqC,iBACxD,GAAC,CAAAJ,IAAA,qBAAAC,IAED,WACE,OAAOlC,KAAKU,MAAM4B,oBAAsB,CAAC,GAAI,GAAI,GAAI,IACvD,GAAC,CAAAL,IAAA,SAAAJ,MAiBD,WACE,IAAAU,EAA2BvC,KAAKgB,WAAxBF,EAAIyB,EAAJzB,KAAMC,EAAQwB,EAARxB,SACd,OACEyB,EAACC,EAAqB,CACpBC,KAAK,QACL5B,KAAMA,EACN6B,MAAO3C,KAAKU,MAAMiC,OAAS,EAC3BC,aAAc5C,KAAK6C,iBACnBC,YAAa/B,EACbgC,oBAAqB/C,KAAKgD,wBAC1BV,mBAAoBtC,KAAKsC,mBACzBW,iBAAiB,iBACjBC,UAAW,CACTC,QAAS,CAAEC,WAAY,CAAEV,KAAM,SAAWW,eAAgB,CAAEX,KAAM,UAClEY,OAAQ,CAAEC,UAAW,CAAEC,kBAAmBxD,KAAKU,MAAM8C,sBAI7D,IAAC,IAEH,OAAOlE,CACT,CAGA,IAAMmD,EAAwBgB,GAAO,SAACC,GAAuB,OAAKlB,EAACmB,EAAeC,EAAA,CAACC,UAAU,OAAUH,GAAK,GAA9ED,EAAgF,SAAAK,GAAA,IAAGC,EAAKD,EAALC,MAAK,MAAQ,CAC5H,4BAA6B,CAC3B,mBAAoB,CAClBC,UAAW,SAGf,kCAAiC9D,EAAA,GAC9B6D,EAAME,YAAYC,KAAK,MAAQ,CAC9BC,QAAS,SAGd"}
+{"version":3,"file":"create.pagination-bar.js","sources":["../../src/data-view/create.pagination-bar.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Pagination, PaginationProps, styled, TablePagination, TablePaginationProps, useMediaQuery, useTheme } from '@mui/material'\r\nimport { createFilterStore } from './filter-store'\r\nimport { IFilterState, IPagination } from './types'\r\n\r\nexport interface IPaginationBarConfigs {\r\n  rowsPerPageOptions?: number[]\r\n  disableScrollLock?: boolean\r\n  enablePaginationTop?: boolean\r\n}\r\n\r\nexport interface IPaginationBarProps<T> extends IPaginationBarConfigs {\r\n  count?: number\r\n  filter?: IFilterState<T>\r\n  defaultFilter?: IFilterState<T>\r\n  onChange?: (value: IFilterState<T>) => void\r\n  isMobile?: boolean\r\n}\r\n\r\nexport type IPaginationBarParams<T> = Pick<IPaginationBarProps<T>, 'defaultFilter' | 'rowsPerPageOptions'>\r\n\r\nexport function createTablePagination<T>(): ComponentType<IPaginationBarProps<T>> {\r\n  class PaginationBar extends Component<IPaginationBarProps<T>> {\r\n    get defaultFilter(): IFilterState<T> {\r\n      return this.props.defaultFilter || {}\r\n    }\r\n\r\n    get defaultPagination(): Required<IPagination> {\r\n      return (this.defaultFilter?.pagination as any) || { page: 0, pageSize: 10 }\r\n    }\r\n\r\n    get pagination(): Required<IPagination> {\r\n      return (this.props.filter?.pagination as any) || this.defaultPagination\r\n    }\r\n\r\n    get rowsPerPageOptions(): number[] {\r\n      return this.props.rowsPerPageOptions || [10, 25, 50, 100]\r\n    }\r\n\r\n    handleChangePage = (_: React.MouseEvent<HTMLButtonElement> | null, newPage: number) => {\r\n      const store = createFilterStore<T>(this.props.filter ?? {}, this.defaultFilter)\r\n      const { pageSize } = this.pagination\r\n      const obj: IPagination = { page: newPage, pageSize }\r\n      store.changePagination(obj, { reason: 'pagination' })\r\n      this.props.onChange?.(store.build())\r\n    }\r\n\r\n    handleChangeRowsPerPage = (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\r\n      const newPageSize = parseInt(event.target.value, 10)\r\n      const store = createFilterStore<T>(this.props.filter ?? {}, this.defaultFilter)\r\n      store.changePagination({ page: 0, pageSize: newPageSize }, { reason: 'pagination' })\r\n      this.props.onChange?.(store.build())\r\n    }\r\n\r\n    render() {\r\n      const { page, pageSize } = this.pagination\r\n      const { isMobile } = this.props\r\n      if (!this.props.count || (Math.ceil(this.props.count / pageSize) === 1 && isMobile)) {\r\n        return null // No pagination if there are no items\r\n      }\r\n      if (isMobile) {\r\n        return (\r\n          <PaginationCustom\r\n            siblingCount={0}\r\n            page={page + 1}\r\n            count={Math.ceil(this.props.count / pageSize)}\r\n            onChange={(_, value) => this.handleChangePage(null, value - 1)}\r\n            size='small'\r\n            color='primary'\r\n            sx={{ my: 1 }}\r\n          />\r\n        )\r\n      }\r\n      return (\r\n        <TablePaginationCustom\r\n          size='small'\r\n          page={page}\r\n          count={this.props.count || 0}\r\n          onPageChange={this.handleChangePage}\r\n          rowsPerPage={pageSize}\r\n          onRowsPerPageChange={this.handleChangeRowsPerPage}\r\n          rowsPerPageOptions={this.rowsPerPageOptions}\r\n          slotProps={{\r\n            actions: { nextButton: { size: 'small' }, previousButton: { size: 'small' } },\r\n            select: { MenuProps: { disableScrollLock: this.props.disableScrollLock } }\r\n          }}\r\n        />\r\n      )\r\n    }\r\n  }\r\n  return PaginationBar\r\n}\r\n\r\nexport function createPaginationBar<T>(params?: IPaginationBarParams<T>) {\r\n  const PaginationBar = createTablePagination<T>()\r\n  return function ResponsivePaginationBar(props: IPaginationBarProps<T>) {\r\n    const theme = useTheme()\r\n    const isMobile = useMediaQuery(theme.breakpoints.down('md'))\r\n    return <PaginationBar {...props} isMobile={isMobile} />\r\n  }\r\n}\r\n\r\nexport default createPaginationBar\r\n\r\nconst TablePaginationCustom = styled((p: TablePaginationProps) => <TablePagination component='div' {...p} />)(({ theme }) => ({\r\n  marginLeft: 'auto',\r\n  '@media (min-width: 600px)': {\r\n    '.MuiToolbar-root': {\r\n      minHeight: '48px'\r\n    }\r\n  },\r\n  '.MuiTablePagination-selectLabel': {\r\n    [theme.breakpoints.down('sm')]: {\r\n      display: 'none'\r\n    }\r\n  }\r\n}))\r\n\r\nconst PaginationCustom = styled((p: PaginationProps) => <Pagination {...p} />)({\r\n  marginLeft: 'auto',\r\n  '.Mui-selected': {\r\n    backgroundColor: 'color-mix(in srgb, rgb(232, 140, 63) 60%, transparent) !important'\r\n  },\r\n  '@media (min-width: 600px)': {\r\n    '.MuiToolbar-root': {\r\n      minHeight: '48px'\r\n    }\r\n  }\r\n})\r\n"],"names":["createTablePagination","PaginationBar","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","_","newPage","_this$props$filter","_this$props$onChange","_this$props","store","createFilterStore","props","filter","defaultFilter","obj","page","pageSize","pagination","changePagination","reason","onChange","call","build","event","_this$props$filter2","_this$props$onChange2","_this$props2","newPageSize","parseInt","target","value","_inherits","Component","_createClass","key","get","_this$defaultFilter","_this$props$filter3","defaultPagination","rowsPerPageOptions","_this2","_this$pagination","isMobile","count","Math","ceil","_jsx","PaginationCustom","siblingCount","handleChangePage","size","color","sx","my","TablePaginationCustom","onPageChange","rowsPerPage","onRowsPerPageChange","handleChangeRowsPerPage","slotProps","actions","nextButton","previousButton","select","MenuProps","disableScrollLock","createPaginationBar","params","theme","useTheme","useMediaQuery","breakpoints","down","_objectSpread","styled","p","TablePagination","component","_ref","marginLeft","minHeight","display","Pagination","backgroundColor"],"mappings":"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"}

package/dist/data-view/create.popper-panel.js

@@ -1,2 +1,2 @@
-import{inherits as r,createClass as t,classCallCheck as e,callSuper as n,defineProperty as a,objectSpread2 as o}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i}from"react/jsx-runtime";import{Component as s}from"react";import{styled as u,Box as c,Popper as l,Fade as p}from"@mui/material";import{PanelNotFound as m}from"./ui.units.js";import{mapDataViewContext as f}from"./context.js";import d from"./create.sort-menu.js";import h from"./create.filter-menu.js";import x from"./create.search-match.js";function v(){var u=x(),c=h(),v=d(),j=function(){function d(){var r;e(this,d);for(var t=arguments.length,o=new Array(t),s=0;s<t;s++)o[s]=arguments[s];return r=n(this,d,[].concat(o)),a(r,"renderPanelContent",(function(r){switch(r.area){case"input":return i(u,{});case"filterButton":return i(c,{});case"sortButton":return i(v,{});default:return i(m,{area:r.area})}})),r}return r(d,s),t(d,[{key:"render",value:function(){var r=this;return f((function(t){var e=t.keyword,n=t.anchorEl,a=t.area,s=Boolean(n)&&(!!e||"input"!==a);return i(l,{anchorEl:n,open:s,placement:"bottom-start",transition:!0,sx:{zIndex:1350},children:function(e){var n=e.TransitionProps;return i(p,o(o({},n),{},{timeout:0,children:i(b,{children:r.renderPanelContent(t)})}))}})}))}}])}();return j}var b=u(c)({borderRadius:"4px",boxShadow:"rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px",backgroundColor:"#fff"});export{v as createPopperPanel,v as default};
+import{inherits as r,createClass as t,classCallCheck as e,callSuper as a,defineProperty as n,objectSpread2 as o}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i}from"react/jsx-runtime";import{Component as s}from"react";import{styled as u,Box as c,Popper as l,Fade as m}from"@mui/material";import{PanelNotFound as p}from"./ui.units.js";import{mapDataViewContext as f}from"./context.js";import d from"./create.sort-menu.js";import h from"./create.filter-menu.js";import x from"./create.search-match.js";function v(){var u=x(),c=h(),v=d(),j=function(){function d(){var r;e(this,d);for(var t=arguments.length,o=new Array(t),s=0;s<t;s++)o[s]=arguments[s];return r=a(this,d,[].concat(o)),n(r,"renderPanelContent",(function(r){switch(r.area){case"input":return i(u,{});case"filterButton":return i(c,{});case"sortButton":return i(v,{});default:return i(p,{area:r.area})}})),r}return r(d,s),t(d,[{key:"render",value:function(){var r=this;return f((function(t){var e=t.keyword,a=t.anchorEl,n=t.area,s=Boolean(a)&&(!!e||"input"!==n);return i(l,{anchorEl:a,open:s,placement:"bottom-start",transition:!0,sx:{zIndex:1350,maxWidth:"100%"},children:function(e){var a=e.TransitionProps;return i(m,o(o({},a),{},{timeout:0,children:i(b,{children:r.renderPanelContent(t)})}))}})}))}}])}();return j}var b=u(c)({borderRadius:"4px",boxShadow:"rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px",backgroundColor:"#fff"});export{v as createPopperPanel,v as default};
 //# sourceMappingURL=create.popper-panel.js.map

package/dist/data-view/create.popper-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"create.popper-panel.js","sources":["../../src/data-view/create.popper-panel.tsx"],"sourcesContent":["import React, { Component } from 'react'\r\nimport { Box, Fade, Popper, styled } from '@mui/material'\r\nimport { PanelNotFound } from './ui.units'\r\nimport { IDataViewContext, mapDataViewContext } from './context'\r\nimport createSortMenu from './create.sort-menu'\r\nimport createFilterMenu from './create.filter-menu'\r\nimport createSearchMatch from './create.search-match'\r\n\r\nexport function createPopperPanel<T>() {\r\n  const SearchMatchInstance = createSearchMatch<T>()\r\n  const FilterMenuInstance = createFilterMenu<T>()\r\n  const SortMenuInstance = createSortMenu<T>()\r\n\r\n  class Panel extends Component {\r\n    render() {\r\n      return mapDataViewContext((context) => {\r\n        const { keyword, anchorEl, area } = context\r\n        const isOpen = Boolean(anchorEl) && (!!keyword || area !== 'input')\r\n        return (\r\n          <Popper anchorEl={anchorEl} open={isOpen} placement='bottom-start' transition sx={{ zIndex: 1350 }}>\r\n            {({ TransitionProps }) => (\r\n              <Fade {...TransitionProps} timeout={0}>\r\n                <PannelWrap>{this.renderPanelContent(context)}</PannelWrap>\r\n              </Fade>\r\n            )}\r\n          </Popper>\r\n        )\r\n      })\r\n    }\r\n\r\n    renderPanelContent = (context: IDataViewContext<T>) => {\r\n      switch (context.area) {\r\n        case 'input':\r\n          return <SearchMatchInstance />\r\n        case 'filterButton':\r\n          return <FilterMenuInstance />\r\n        case 'sortButton':\r\n          return <SortMenuInstance />\r\n        default:\r\n          return <PanelNotFound area={context.area} />\r\n      }\r\n    }\r\n  }\r\n  return Panel\r\n}\r\nexport default createPopperPanel\r\n\r\nconst PannelWrap = styled(Box)({\r\n  borderRadius: '4px',\r\n  boxShadow: 'rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px',\r\n  backgroundColor: '#fff'\r\n})\r\n"],"names":["createPopperPanel","SearchMatchInstance","createSearchMatch","FilterMenuInstance","createFilterMenu","SortMenuInstance","createSortMenu","Panel","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","context","area","_jsx","PanelNotFound","_inherits","Component","_createClass","key","value","_this2","mapDataViewContext","keyword","anchorEl","isOpen","Boolean","Popper","open","placement","transition","sx","zIndex","children","_ref","TransitionProps","Fade","_objectSpread","timeout","PannelWrap","renderPanelContent","styled","Box","borderRadius","boxShadow","backgroundColor"],"mappings":"4gBAQgBA,IACd,IAAMC,EAAsBC,IACtBC,EAAqBC,IACrBC,EAAmBC,IAEnBC,aAAM,SAAAA,IAAA,IAAAC,EAAAC,OAAAF,GAAA,IAAA,IAAAG,EAAAC,UAAAC,OAAAC,EAAAC,IAAAA,MAAAJ,GAAAK,EAAA,EAAAA,EAAAL,EAAAK,IAAAF,EAAAE,GAAAJ,UAAAI,GA4BT,OA5BSP,EAAAQ,EAAAC,KAAAV,EAAAW,GAAAA,OAAAL,IAAAM,EAAAX,EAiBW,sBAAA,SAACY,GACpB,OAAQA,EAAQC,MACd,IAAK,QACH,OAAOC,EAACrB,EAAmB,IAC7B,IAAK,eACH,OAAOqB,EAACnB,EAAkB,IAC5B,IAAK,aACH,OAAOmB,EAACjB,EAAgB,IAC1B,QACE,OAAOiB,EAACC,EAAc,CAAAF,KAAMD,EAAQC,WAEzCb,CAAA,CAAA,OAAAgB,EAAAjB,EA5BiBkB,GA4BjBC,EAAAnB,EAAA,CAAA,CAAAoB,IAAA,SAAAC,MA3BD,WAAM,IAAAC,EAAAZ,KACJ,OAAOa,GAAmB,SAACV,GACzB,IAAQW,EAA4BX,EAA5BW,QAASC,EAAmBZ,EAAnBY,SAAUX,EAASD,EAATC,KACrBY,EAASC,QAAQF,OAAgBD,GAAoB,UAATV,GAClD,OACEC,EAACa,EAAO,CAAAH,SAAUA,EAAUI,KAAMH,EAAQI,UAAU,eAAeC,YAAU,EAACC,GAAI,CAAEC,OAAQ,MAAMC,SAC/F,SAD+FC,GAAA,IAC5FC,EAAeD,EAAfC,gBAAe,OACjBrB,EAACsB,EAAIC,EAAAA,KAAKF,GAAe,GAAA,CAAEG,QAAS,EAACL,SACnCnB,EAACyB,EAAY,CAAAN,SAAAZ,EAAKmB,mBAAmB5B,OAChC,GAIf,GACF,IAAC,IAeH,OAAOb,CACT,CAGA,IAAMwC,EAAaE,EAAOC,EAAPD,CAAY,CAC7BE,aAAc,MACdC,UAAW,0EACXC,gBAAiB"}
+{"version":3,"file":"create.popper-panel.js","sources":["../../src/data-view/create.popper-panel.tsx"],"sourcesContent":["import React, { Component } from 'react'\r\nimport { Box, Fade, Popper, styled } from '@mui/material'\r\nimport { PanelNotFound } from './ui.units'\r\nimport { IDataViewContext, mapDataViewContext } from './context'\r\nimport createSortMenu from './create.sort-menu'\r\nimport createFilterMenu from './create.filter-menu'\r\nimport createSearchMatch from './create.search-match'\r\n\r\nexport function createPopperPanel<T>() {\r\n  const SearchMatchInstance = createSearchMatch<T>()\r\n  const FilterMenuInstance = createFilterMenu<T>()\r\n  const SortMenuInstance = createSortMenu<T>()\r\n\r\n  class Panel extends Component {\r\n    render() {\r\n      return mapDataViewContext((context) => {\r\n        const { keyword, anchorEl, area } = context\r\n        const isOpen = Boolean(anchorEl) && (!!keyword || area !== 'input')\r\n        return (\r\n          <Popper anchorEl={anchorEl} open={isOpen} placement='bottom-start' transition sx={{ zIndex: 1350, maxWidth: '100%' }}>\r\n            {({ TransitionProps }) => (\r\n              <Fade {...TransitionProps} timeout={0}>\r\n                <PannelWrap>{this.renderPanelContent(context)}</PannelWrap>\r\n              </Fade>\r\n            )}\r\n          </Popper>\r\n        )\r\n      })\r\n    }\r\n\r\n    renderPanelContent = (context: IDataViewContext<T>) => {\r\n      switch (context.area) {\r\n        case 'input':\r\n          return <SearchMatchInstance />\r\n        case 'filterButton':\r\n          return <FilterMenuInstance />\r\n        case 'sortButton':\r\n          return <SortMenuInstance />\r\n        default:\r\n          return <PanelNotFound area={context.area} />\r\n      }\r\n    }\r\n  }\r\n  return Panel\r\n}\r\nexport default createPopperPanel\r\n\r\nconst PannelWrap = styled(Box)({\r\n  borderRadius: '4px',\r\n  boxShadow: 'rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px',\r\n  backgroundColor: '#fff'\r\n})\r\n"],"names":["createPopperPanel","SearchMatchInstance","createSearchMatch","FilterMenuInstance","createFilterMenu","SortMenuInstance","createSortMenu","Panel","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","context","area","_jsx","PanelNotFound","_inherits","Component","_createClass","key","value","_this2","mapDataViewContext","keyword","anchorEl","isOpen","Boolean","Popper","open","placement","transition","sx","zIndex","maxWidth","children","_ref","TransitionProps","Fade","_objectSpread","timeout","PannelWrap","renderPanelContent","styled","Box","borderRadius","boxShadow","backgroundColor"],"mappings":"4gBAQgBA,IACd,IAAMC,EAAsBC,IACtBC,EAAqBC,IACrBC,EAAmBC,IAEnBC,aAAM,SAAAA,IAAA,IAAAC,EAAAC,OAAAF,GAAA,IAAA,IAAAG,EAAAC,UAAAC,OAAAC,EAAAC,IAAAA,MAAAJ,GAAAK,EAAA,EAAAA,EAAAL,EAAAK,IAAAF,EAAAE,GAAAJ,UAAAI,GA4BT,OA5BSP,EAAAQ,EAAAC,KAAAV,EAAAW,GAAAA,OAAAL,IAAAM,EAAAX,EAiBW,sBAAA,SAACY,GACpB,OAAQA,EAAQC,MACd,IAAK,QACH,OAAOC,EAACrB,EAAmB,IAC7B,IAAK,eACH,OAAOqB,EAACnB,EAAkB,IAC5B,IAAK,aACH,OAAOmB,EAACjB,EAAgB,IAC1B,QACE,OAAOiB,EAACC,EAAc,CAAAF,KAAMD,EAAQC,WAEzCb,CAAA,CAAA,OAAAgB,EAAAjB,EA5BiBkB,GA4BjBC,EAAAnB,EAAA,CAAA,CAAAoB,IAAA,SAAAC,MA3BD,WAAM,IAAAC,EAAAZ,KACJ,OAAOa,GAAmB,SAACV,GACzB,IAAQW,EAA4BX,EAA5BW,QAASC,EAAmBZ,EAAnBY,SAAUX,EAASD,EAATC,KACrBY,EAASC,QAAQF,OAAgBD,GAAoB,UAATV,GAClD,OACEC,EAACa,EAAM,CAACH,SAAUA,EAAUI,KAAMH,EAAQI,UAAU,eAAeC,YAAU,EAACC,GAAI,CAAEC,OAAQ,KAAMC,SAAU,QAAQC,SACjH,SADiHC,GAAA,IAC9GC,EAAeD,EAAfC,gBAAe,OACjBtB,EAACuB,EAAIC,EAAAA,KAAKF,GAAe,GAAA,CAAEG,QAAS,EAClCL,SAAApB,EAAC0B,EAAU,CAAAN,SAAEb,EAAKoB,mBAAmB7B,OAChC,GAIf,GACF,IAAC,IAeH,OAAOb,CACT,CAGA,IAAMyC,EAAaE,EAAOC,EAAPD,CAAY,CAC7BE,aAAc,MACdC,UAAW,0EACXC,gBAAiB"}

package/dist/data-view/create.search-match.js

@@ -1,2 +1,2 @@
-import{defineProperty as e,inherits as r,createClass as i,classCallCheck as t,callSuper as n,objectSpread2 as a}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as l,jsx as o}from"react/jsx-runtime";import{Component as c}from"react";import{styled as u,MenuList as s,MenuItem as d,Typography as h}from"@mui/material";import{FilterNotes as f}from"./ui.units.js";import{createFilterStore as m}from"./filter-store.js";import{filterMenuClasses as p,getFieldsMatches as v}from"./helpers.js";import{mapDataViewContext as k}from"./context.js";function S(){var u=function(){function u(){var r;t(this,u);for(var i=arguments.length,c=new Array(i),s=0;s<i;s++)c[s]=arguments[s];return r=n(this,u,[].concat(c)),e(r,"render",(function(){return k((function(e){var i,t=e.keyword,n=e.filterBarConfigs,c=n.fields,u=n.quickSearch,s=v(c,t),m=Object.keys(s).filter((function(e){return!!e})),k=null!==(i=null==u?void 0:u.label)&&void 0!==i?i:"Quick search";return l(b,{className:p.list,children:[m.map((function(i,n){var c,u,m=s[i],v=null!==(c=null==m?void 0:m.label)&&void 0!==c?c:i.toString(),k=null==m||null===(u=m.quickSearchMatch)||void 0===u?void 0:u.notes;return l(d,{className:p.item,onClick:function(){return r.handleClick(e,i)},children:[l(h,{variant:"body2",component:"span",sx:{flex:1},children:[v,' "',t,'"']}),k&&o(f,a({title:"The ".concat(v," includes"),disabledSize:!0},k))]},i.toString()+n)})),u&&l(d,{className:p.item,onClick:function(){return r.handleQuickSearchClick(e)},children:[l(h,{variant:"body2",component:"span",sx:{flex:1},children:[null!=k?k:"Quick search",' "',t,'"']}),u.notes&&o(f,a({title:"The ".concat(k.toLocaleLowerCase()," includes"),disabledSize:!0},u.notes))]})]})}))})),e(r,"handleClick",(function(e,r){var i,t=m(e.filterState);t.addFilterItem(r,{value:e.keyword},{reason:"quickSearch",area:"input"}),null===(i=e.onFilterStateChange)||void 0===i||i.call(e,t.build())})),e(r,"handleQuickSearchClick",(function(e){var r,i=m(e.filterState);i.addQuickSearch(e.keyword,{reason:"quickSearch",area:"input"}),null===(r=e.onFilterStateChange)||void 0===r||r.call(e,i.build())})),r}return r(u,c),i(u)}();return u}var b=u(s)(e({padding:0},".".concat(p.item),{height:"var(--filter-item-height, 40px)",padding:"8px 16px","&:not(:last-child)":{borderBottom:"1px solid var(--color-divider, rgba(145 160 170 / 10%))"}}));export{S as default};
+import{defineProperty as e,inherits as r,createClass as i,classCallCheck as t,callSuper as n,objectSpread2 as a}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as l,jsx as o}from"react/jsx-runtime";import{Component as c}from"react";import{styled as u,MenuList as s,MenuItem as d,Typography as h}from"@mui/material";import{FilterNotes as f}from"./ui.units.js";import{createFilterStore as m}from"./filter-store.js";import{filterMenuClasses as p,getFieldsMatches as v}from"./helpers.js";import{mapDataViewContext as k}from"./context.js";function S(){var u=function(){function u(){var r;t(this,u);for(var i=arguments.length,c=new Array(i),s=0;s<i;s++)c[s]=arguments[s];return r=n(this,u,[].concat(c)),e(r,"render",(function(){return k((function(e){var i,t=e.keyword,n=e.filterBarConfigs,c=n.fields,u=n.quickSearch,s=v(c,t),m=Object.keys(s).filter((function(e){return!!e})),k=null!==(i=null==u?void 0:u.label)&&void 0!==i?i:"Quick search";return l(b,{className:p.list,children:[m.map((function(i,n){var c,u,m=s[i],v=null!==(c=null==m?void 0:m.label)&&void 0!==c?c:i.toString(),k=null==m||null===(u=m.quickSearchMatch)||void 0===u?void 0:u.notes;return l(d,{className:p.item,onClick:function(){return r.handleClick(e,i)},children:[l(h,{noWrap:!0,variant:"body2",component:"span",sx:{flex:1},children:[v,' "',t,'"']}),k&&o(f,a({title:"The ".concat(v," includes"),disabledSize:!0},k))]},i.toString()+n)})),u&&l(d,{className:p.item,onClick:function(){return r.handleQuickSearchClick(e)},children:[l(h,{noWrap:!0,variant:"body2",component:"span",sx:{flex:1},children:[null!=k?k:"Quick search",' "',t,'"']}),u.notes&&o(f,a({title:"The ".concat(k.toLocaleLowerCase()," includes"),disabledSize:!0},u.notes))]})]})}))})),e(r,"handleClick",(function(e,r){var i,t=m(e.filterState);t.addFilterItem(r,{value:e.keyword},{reason:"quickSearch",area:"input"}),null===(i=e.onFilterStateChange)||void 0===i||i.call(e,t.build())})),e(r,"handleQuickSearchClick",(function(e){var r,i=m(e.filterState);i.addQuickSearch(e.keyword,{reason:"quickSearch",area:"input"}),null===(r=e.onFilterStateChange)||void 0===r||r.call(e,i.build())})),r}return r(u,c),i(u)}();return u}var b=u(s)(e({padding:0},".".concat(p.item),{height:"var(--filter-item-height, 40px)",padding:"8px 16px","&:not(:last-child)":{borderBottom:"1px solid var(--color-divider, rgba(145 160 170 / 10%))"}}));export{S as default};
 //# sourceMappingURL=create.search-match.js.map

package/dist/data-view/create.search-match.js.map

@@ -1 +1 @@
-{"version":3,"file":"create.search-match.js","sources":["../../src/data-view/create.search-match.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { MenuList, MenuItem, Typography, styled } from '@mui/material'\r\nimport { IFilterConfigs } from './types'\r\nimport { FilterNotes } from './ui.units'\r\nimport { createFilterStore } from './filter-store'\r\nimport { filterMenuClasses, getFieldsMatches } from './helpers'\r\nimport { IDataViewContext, mapDataViewContext } from './context'\r\n\r\nexport interface ISearchMatchProps {}\r\n\r\nfunction createSearchMatch<T>(): ComponentType<ISearchMatchProps> {\r\n  class SearchMatch extends Component<ISearchMatchProps> {\r\n    render = () => {\r\n      return mapDataViewContext<T>((context) => {\r\n        const { keyword } = context\r\n        const { fields, quickSearch } = context.filterBarConfigs\r\n        const fieldMatches = getFieldsMatches<T>(fields, keyword)\r\n        const keys = Object.keys(fieldMatches).filter((x) => !!x) as (keyof IFilterConfigs<T>)[]\r\n        const quickSearchLabel = quickSearch?.label ?? 'Quick search'\r\n\r\n        return (\r\n          <MenuListCustom className={filterMenuClasses.list}>\r\n            {keys.map((key, i) => {\r\n              const item = fieldMatches[key]\r\n              const label = item?.label ?? key.toString()\r\n              const notes = item?.quickSearchMatch?.notes\r\n              return (\r\n                <MenuItem key={key.toString() + i} className={filterMenuClasses.item} onClick={() => this.handleClick(context, key)}>\r\n                  <Typography variant='body2' component='span' sx={{ flex: 1 }}>\r\n                    {label} \"{keyword}\"\r\n                  </Typography>\r\n                  {notes && <FilterNotes title={`The ${label} includes`} disabledSize {...notes} />}\r\n                </MenuItem>\r\n              )\r\n            })}\r\n            {quickSearch && (\r\n              <MenuItem className={filterMenuClasses.item} onClick={() => this.handleQuickSearchClick(context)}>\r\n                <Typography variant='body2' component='span' sx={{ flex: 1 }}>\r\n                  {quickSearchLabel ?? 'Quick search'} &quot;{keyword}&quot;\r\n                </Typography>\r\n                {quickSearch.notes && (\r\n                  <FilterNotes title={`The ${quickSearchLabel.toLocaleLowerCase()} includes`} disabledSize {...quickSearch.notes} />\r\n                )}\r\n              </MenuItem>\r\n            )}\r\n          </MenuListCustom>\r\n        )\r\n      })\r\n    }\r\n\r\n    handleClick = (context: IDataViewContext<T>, field: keyof T) => {\r\n      const store = createFilterStore(context.filterState)\r\n      store.addFilterItem(field, { value: context.keyword }, { reason: 'quickSearch', area: 'input' })\r\n      context.onFilterStateChange?.(store.build())\r\n    }\r\n\r\n    handleQuickSearchClick = (context: IDataViewContext<T>) => {\r\n      const store = createFilterStore(context.filterState)\r\n      store.addQuickSearch(context.keyword, { reason: 'quickSearch', area: 'input' })\r\n      context.onFilterStateChange?.(store.build())\r\n    }\r\n  }\r\n  return SearchMatch\r\n}\r\nexport default createSearchMatch\r\n\r\nconst MenuListCustom = styled(MenuList)({\r\n  padding: 0,\r\n  [`.${filterMenuClasses.item}`]: {\r\n    height: 'var(--filter-item-height, 40px)',\r\n    padding: '8px 16px',\r\n    '&:not(:last-child)': {\r\n      borderBottom: '1px solid var(--color-divider, rgba(145 160 170 / 10%))'\r\n    }\r\n  }\r\n})\r\n"],"names":["createSearchMatch","SearchMatch","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","mapDataViewContext","context","_quickSearch$label","keyword","_context$filterBarCon","filterBarConfigs","fields","quickSearch","fieldMatches","getFieldsMatches","keys","Object","filter","x","quickSearchLabel","label","_jsxs","MenuListCustom","className","filterMenuClasses","list","map","key","i","_item$label","_item$quickSearchMatc","item","toString","notes","quickSearchMatch","MenuItem","onClick","handleClick","Typography","variant","component","sx","flex","_jsx","FilterNotes","_objectSpread","title","disabledSize","handleQuickSearchClick","children","toLocaleLowerCase","field","_context$onFilterStat","store","createFilterStore","filterState","addFilterItem","value","reason","area","onFilterStateChange","call","build","_context$onFilterStat2","addQuickSearch","_inherits","Component","_createClass","styled","MenuList","padding","height","borderBottom"],"mappings":"iiBAUA,SAASA,IAAiB,IAClBC,aAAY,SAAAA,IAAA,IAAAC,EAAAC,OAAAF,GAAA,IAAA,IAAAG,EAAAC,UAAAC,OAAAC,EAAAC,IAAAA,MAAAJ,GAAAK,EAAA,EAAAA,EAAAL,EAAAK,IAAAF,EAAAE,GAAAJ,UAAAI,GAiDf,OAjDeP,EAAAQ,EAAAC,KAAAV,EAAAW,GAAAA,OAAAL,IAAAM,EAAAX,EAAA,UACP,WACP,OAAOY,GAAsB,SAACC,GAAW,IAAAC,EAC/BC,EAAYF,EAAZE,QACRC,EAAgCH,EAAQI,iBAAhCC,EAAMF,EAANE,OAAQC,EAAWH,EAAXG,YACVC,EAAeC,EAAoBH,EAAQH,GAC3CO,EAAOC,OAAOD,KAAKF,GAAcI,QAAO,SAACC,GAAC,QAAOA,KACjDC,EAAqCZ,QAArBA,EAAGK,aAAW,EAAXA,EAAaQ,aAAKb,IAAAA,EAAAA,EAAI,eAE/C,OACEc,EAACC,GAAeC,UAAWC,EAAkBC,eAC1CV,EAAKW,KAAI,SAACC,EAAKC,GAAK,IAAAC,EAAAC,EACbC,EAAOlB,EAAac,GACpBP,EAAmBS,QAAdA,EAAGE,eAAAA,EAAMX,iBAAKS,EAAAA,EAAIF,EAAIK,WAC3BC,EAAQF,SAAsBD,QAAlBA,EAAJC,EAAMG,wBAANJ,IAAsBA,OAAtBA,EAAAA,EAAwBG,MACtC,OACEZ,EAACc,EAAQ,CAA0BZ,UAAWC,EAAkBO,KAAMK,QAAS,WAAF,OAAQ3C,EAAK4C,YAAY/B,EAASqB,EAAI,YACjHN,EAACiB,EAAW,CAAAC,QAAQ,QAAQC,UAAU,OAAOC,GAAI,CAAEC,KAAM,aACtDtB,EAAK,KAAIZ,EAAO,OAElByB,GAASU,EAACC,EAAWC,EAAA,CAACC,MAAK3C,OAAAA,OAASiB,EAAgB,aAAE2B,cAAY,GAAKd,MAJ3DN,EAAIK,WAAaJ,EAOpC,IACChB,GACCS,EAACc,EAAQ,CAACZ,UAAWC,EAAkBO,KAAMK,QAAS,WAAF,OAAQ3C,EAAKuD,uBAAuB1C,EAAQ,EAAA2C,SAAA,CAC9F5B,EAACiB,EAAU,CAACC,QAAQ,QAAQC,UAAU,OAAOC,GAAI,CAAEC,KAAM,GAAGO,SAAA,CACzD9B,QAAAA,EAAoB,eAAuB,KAAAX,EACjC,OACZI,EAAYqB,OACXU,EAACC,EAAWC,EAAA,CAACC,MAAK,OAAA3C,OAASgB,EAAiB+B,oBAA8B,aAAEH,cAAY,GAAKnC,EAAYqB,aAMrH,OACD7B,EAAAX,EAAA,eAEa,SAACa,EAA8B6C,GAAkB,IAAAC,EACvDC,EAAQC,EAAkBhD,EAAQiD,aACxCF,EAAMG,cAAcL,EAAO,CAAEM,MAAOnD,EAAQE,SAAW,CAAEkD,OAAQ,cAAeC,KAAM,UAC3D,QAA3BP,EAAA9C,EAAQsD,2BAARR,IAA2BA,GAA3BA,EAAAS,KAAAvD,EAA8B+C,EAAMS,YACrC1D,EAAAX,EAEwB,0BAAA,SAACa,GAAgC,IAAAyD,EAClDV,EAAQC,EAAkBhD,EAAQiD,aACxCF,EAAMW,eAAe1D,EAAQE,QAAS,CAAEkD,OAAQ,cAAeC,KAAM,UAC1C,QAA3BI,EAAAzD,EAAQsD,2BAARG,IAA2BA,GAA3BA,EAAAF,KAAAvD,EAA8B+C,EAAMS,YACrCrE,CAAA,CAAA,OAAAwE,EAAAzE,EAjDuB0E,GAiDvBC,EAAA3E,EAAA,IAEH,OAAOA,CACT,CAGA,IAAM8B,EAAiB8C,EAAOC,EAAPD,CAAgBhE,EAAA,CACrCkE,QAAS,GAAC,IAAAnE,OACLqB,EAAkBO,MAAS,CAC9BwC,OAAQ,kCACRD,QAAS,WACT,qBAAsB,CACpBE,aAAc"}
+{"version":3,"file":"create.search-match.js","sources":["../../src/data-view/create.search-match.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { MenuList, MenuItem, Typography, styled } from '@mui/material'\r\nimport { IFilterConfigs } from './types'\r\nimport { FilterNotes } from './ui.units'\r\nimport { createFilterStore } from './filter-store'\r\nimport { filterMenuClasses, getFieldsMatches } from './helpers'\r\nimport { IDataViewContext, mapDataViewContext } from './context'\r\n\r\nexport interface ISearchMatchProps {}\r\n\r\nfunction createSearchMatch<T>(): ComponentType<ISearchMatchProps> {\r\n  class SearchMatch extends Component<ISearchMatchProps> {\r\n    render = () => {\r\n      return mapDataViewContext<T>((context) => {\r\n        const { keyword } = context\r\n        const { fields, quickSearch } = context.filterBarConfigs\r\n        const fieldMatches = getFieldsMatches<T>(fields, keyword)\r\n        const keys = Object.keys(fieldMatches).filter((x) => !!x) as (keyof IFilterConfigs<T>)[]\r\n        const quickSearchLabel = quickSearch?.label ?? 'Quick search'\r\n\r\n        return (\r\n          <MenuListCustom className={filterMenuClasses.list}>\r\n            {keys.map((key, i) => {\r\n              const item = fieldMatches[key]\r\n              const label = item?.label ?? key.toString()\r\n              const notes = item?.quickSearchMatch?.notes\r\n              return (\r\n                <MenuItem key={key.toString() + i} className={filterMenuClasses.item} onClick={() => this.handleClick(context, key)}>\r\n                  <Typography noWrap variant='body2' component='span' sx={{ flex: 1 }}>\r\n                    {label} \"{keyword}\"\r\n                  </Typography>\r\n                  {notes && <FilterNotes title={`The ${label} includes`} disabledSize {...notes} />}\r\n                </MenuItem>\r\n              )\r\n            })}\r\n            {quickSearch && (\r\n              <MenuItem className={filterMenuClasses.item} onClick={() => this.handleQuickSearchClick(context)}>\r\n                <Typography noWrap variant='body2' component='span' sx={{ flex: 1 }}>\r\n                  {quickSearchLabel ?? 'Quick search'} &quot;{keyword}&quot;\r\n                </Typography>\r\n                {quickSearch.notes && (\r\n                  <FilterNotes title={`The ${quickSearchLabel.toLocaleLowerCase()} includes`} disabledSize {...quickSearch.notes} />\r\n                )}\r\n              </MenuItem>\r\n            )}\r\n          </MenuListCustom>\r\n        )\r\n      })\r\n    }\r\n\r\n    handleClick = (context: IDataViewContext<T>, field: keyof T) => {\r\n      const store = createFilterStore(context.filterState)\r\n      store.addFilterItem(field, { value: context.keyword }, { reason: 'quickSearch', area: 'input' })\r\n      context.onFilterStateChange?.(store.build())\r\n    }\r\n\r\n    handleQuickSearchClick = (context: IDataViewContext<T>) => {\r\n      const store = createFilterStore(context.filterState)\r\n      store.addQuickSearch(context.keyword, { reason: 'quickSearch', area: 'input' })\r\n      context.onFilterStateChange?.(store.build())\r\n    }\r\n  }\r\n  return SearchMatch\r\n}\r\nexport default createSearchMatch\r\n\r\nconst MenuListCustom = styled(MenuList)({\r\n  padding: 0,\r\n  [`.${filterMenuClasses.item}`]: {\r\n    height: 'var(--filter-item-height, 40px)',\r\n    padding: '8px 16px',\r\n    '&:not(:last-child)': {\r\n      borderBottom: '1px solid var(--color-divider, rgba(145 160 170 / 10%))'\r\n    }\r\n  }\r\n})\r\n"],"names":["createSearchMatch","SearchMatch","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","mapDataViewContext","context","_quickSearch$label","keyword","_context$filterBarCon","filterBarConfigs","fields","quickSearch","fieldMatches","getFieldsMatches","keys","Object","filter","x","quickSearchLabel","label","_jsxs","MenuListCustom","className","filterMenuClasses","list","map","key","i","_item$label","_item$quickSearchMatc","item","toString","notes","quickSearchMatch","MenuItem","onClick","handleClick","children","Typography","noWrap","variant","component","sx","flex","_jsx","FilterNotes","_objectSpread","title","disabledSize","handleQuickSearchClick","toLocaleLowerCase","field","_context$onFilterStat","store","createFilterStore","filterState","addFilterItem","value","reason","area","onFilterStateChange","call","build","_context$onFilterStat2","addQuickSearch","_inherits","Component","_createClass","styled","MenuList","padding","height","borderBottom"],"mappings":"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"}

package/dist/data-view/index.js

@@ -1,2 +1,2 @@
-export{EFieldMatch,EFieldValidate,EViewStatus}from"./types.js";export{EViewMode}from"./view-mode.types.js";export{createPaginationBar}from"./create.pagination-bar.js";export{FilterStore,createFilterStore}from"./filter-store.js";export{createConvertFilterToGraphQL}from"./convert-filter-to-graphql.js";export{createViewMode}from"./create.view-mode.js";export{DinoDataView}from"./dino.js";
+export{EFieldMatch,EFieldValidate,EViewStatus}from"./types.js";export{EViewMode}from"./view-mode.types.js";export{createPaginationBar,createTablePagination}from"./create.pagination-bar.js";export{FilterStore,createFilterStore}from"./filter-store.js";export{createConvertFilterToGraphQL}from"./convert-filter-to-graphql.js";export{createViewMode}from"./create.view-mode.js";export{DinoDataView}from"./dino.js";
 //# sourceMappingURL=index.js.map

package/dist/data-view/ui.units.js

@@ -1,2 +1,2 @@
-import{objectSpread2 as e,objectWithoutProperties as o,slicedToArray as n}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i,Fragment as l,jsxs as r}from"react/jsx-runtime";import t,{useState as a}from"react";import{styled as d,ToggleButtonGroup as u,Button as s,colors as c,Box as f,RadioGroup as m,FormGroup as v,IconButton as p,InputBase as h,InputAdornment as g,Typography as b,Tooltip as x,TextField as C,FormControlLabel as y,Checkbox as z,Radio as w,ToggleButton as R}from"@mui/material";import T from"@mui/icons-material/Close";import k from"@mui/icons-material/Shuffle";import S from"@mui/icons-material/ClearAll";import L from"@mui/icons-material/FilterList";import B from"@mui/icons-material/ArrowUpward";import W from"@mui/icons-material/ArrowDownward";import P from"@mui/icons-material/KeyboardReturn";import D from"@mui/icons-material/KeyboardArrowDown";import{mapDataViewContext as E}from"./context.js";import M from"../components/help-tooltip.js";var A=["children"],F={asc:{title:"Ascending",icon:i(B,{fontSize:"small"})},desc:{title:"Descending",icon:i(W,{fontSize:"small"})}},N=function(e){return r(_,{size:"small",value:e.value||"and",exclusive:!0,onChange:function(o,n){n&&e.onChange&&e.onChange(o,n)},children:[i(R,{size:"small",value:"and","aria-label":"and logic",children:"AND"}),i(R,{size:"small",value:"or","aria-label":"or logic",children:"OR"})]})},j=function(e){return r(_,{size:"small",value:e.value||"before",exclusive:!0,onChange:function(o,n){n&&e.onChange&&e.onChange(o,n)},children:[i(R,{size:"small",value:"before","aria-label":"before date",children:"before"}),i(R,{size:"small",value:"after","aria-label":"after date",children:"after"})]})},I=function(e){return r(_,{size:"small",value:e.value||"between",exclusive:!0,onChange:function(o,n){n&&e.onChange&&e.onChange(o,n)},children:[i(R,{size:"small",value:"between","aria-label":"between dates",children:"between"}),i(R,{size:"small",value:"not-between","aria-label":"not between dates",children:"not between"})]})},_=d(u)({"& .MuiToggleButton-root":{color:"#fff",borderColor:"rgba(255, 255, 255, 0.3)",fontSize:"0.65rem",fontWeight:600,lineHeight:1,minWidth:"40px",padding:"6px 8px","&.Mui-selected":{backgroundColor:"#1976d2",color:"#fff","&:hover":{backgroundColor:"#1565c0"}},"&:hover":{backgroundColor:"rgba(255, 255, 255, 0.08)"}}}),H=function(e){return i(ue,{children:e.items.map((function(e,o){return i(b,{component:"li",variant:"body2",children:e},o)}))})},K=function(e){var o,n;return i(de,{className:!0===e.disabledSize?"disabled-size":"",children:i(M,{small:!0,title:null!==(o=e.title)&&void 0!==o?o:"The search includes",children:e.renderContent?e.renderContent():i(H,{items:null!==(n=e.items)&&void 0!==n?n:[]})})})},O=t.forwardRef((function(o,n){return i(h,e(e({fullWidth:!0,autoComplete:"off",size:"small"},o),{},{inputRef:n}))})),U=function(o){return r(g,{position:"end",children:[o.keyword&&r(l,{children:[i(Y,{size:"small",color:"primary",onClick:o.onEnterSearch,sx:{display:{xs:"none",md:"flex"}},children:r(b,{variant:"caption",children:["Type and hit ",i("b",{children:"Enter ⏎"})," to filter."]})}),i(x,{title:"Press Enter to filter",placement:"bottom",arrow:!0,children:i(p,{size:"small",color:"primary",sx:{display:{xs:"flex",md:"none"}},onClick:o.onEnterSearch,children:i(P,{fontSize:"small"})})})]}),o.keyword&&i(x,{title:"Press Esc to clear",placement:"bottom",arrow:!0,children:i(p,{size:"small",sx:{marginLeft:"8px",color:"text.error","&:hover":{color:"error.main"}},onClick:o.onClear,children:i(T,{fontSize:"small"})})}),o.notes&&i(K,e({},o.notes))]})},Y=d(s)({padding:"4px 6px",textTransform:"none",lineHeight:1,".MuiTypography-root":{fontWeight:600,b:{fontWeight:700,backgroundColor:c.blue[100],borderRadius:"4px",padding:"2px 4px"}}}),$=t.forwardRef((function(n,l){var r=n.children,t=o(n,A);return i(q,e(e({size:"small",color:"error",startIcon:i(S,{}),ref:l},t),{},{children:r||"Clear all"}))})),q=d(s)({textTransform:"none",fontWeight:700}),G=t.forwardRef((function(o,n){return i(p,e(e({ref:n,size:"small",sx:{flex:"0 0 auto"}},o),{},{children:i(L,{})}))})),J=function(o){return i(l,{children:E((function(n){var l,r,t,a,d,u,s,c,f=n.filterState,m=n.filterBarConfigs,v=f.sort?F[null===(l=f.sort)||void 0===l?void 0:l.direction]:{},p=null===(r=m.fields)||void 0===r?void 0:r[null===(t=f.sort)||void 0===t?void 0:t.field],h=(null==p?void 0:p.label)||(null===(a=f.sort)||void 0===a?void 0:a.field.toString())||(null===(d=m.sortButton)||void 0===d?void 0:d.text);return i(Q,e(e(e({size:"small",color:"inherit",startIcon:v.icon||i(k,{fontSize:"small"}),endIcon:null!==(u=null===(s=m.sortButton)||void 0===s?void 0:s.icon)&&void 0!==u?u:i(D,{fontSize:"small"}),onClick:function(e){return n.onPopperPanelChange(e.currentTarget,"sortButton")}},null===(c=m.sortButton)||void 0===c?void 0:c.wrapProps),o),{},{children:h||"Sort"}))}))})},Q=d(s)({height:"var(--filter-bar-height, 40px)",padding:"0 16px",backgroundColor:c.grey[50],border:"1px solid var(--color-divider, rgba(145 158 171 / 20%))",textTransform:"none",fontWeight:600,":hover":{backgroundColor:c.grey[100]}}),V=function(e){var o=e.area;return i(f,{sx:{padding:"8px",textAlign:"center",border:"1px solid #ddd",borderRadius:"4px"},children:r(b,{variant:"body2",sx:{padding:"8px"},children:["No panel available for area: ",o]})})},X=function(o){var n=o.label,l=o.notes,t=o.children,a=o.afterTopBar;return r(Z,{children:[r(f,{className:"top-bar",children:[i(b,{variant:"subtitle2",children:n}),a&&i(f,{className:"after-top-bar",children:a}),l&&i(K,e({title:"The ".concat(n," includes"),disabledSize:!0},l))]}),i(f,{className:"content",children:t})]})},Z=d(f)({minWidth:"200px",borderRadius:"4px",overflow:"hidden",".top-bar":{display:"flex",alignItems:"center",background:c.grey[900],padding:"8px",gap:"8px",".MuiTypography-root":{color:c.common.white,flex:1}},".after-top-bar":{marginLeft:"8px"},".content":{padding:"8px"}}),ee=function(e){var o,n,l,r,t,a=null!==(o=null===(n=e.fieldConfig)||void 0===n?void 0:n.label)&&void 0!==o?o:e.name;return i(X,{label:a,notes:null===(l=e.fieldConfig)||void 0===l?void 0:l.notes,children:i(C,{autoFocus:!0,name:e.name,size:"small",fullWidth:!0,error:!(null===(r=e.validationResult)||void 0===r||!r.hasError),helperText:null===(t=e.validationResult)||void 0===t?void 0:t.message})})},oe=function(e){var o,n,l,r,t,a=null!==(o=null===(n=e.fieldConfig)||void 0===n?void 0:n.label)&&void 0!==o?o:e.name;return i(X,{label:a,notes:null===(l=e.fieldConfig)||void 0===l?void 0:l.notes,children:i(ne,{name:e.name,className:null!==(r=e.validationResult)&&void 0!==r&&r.hasError?"error":"",onChange:e.onChange,children:null===(t=e.fieldConfig)||void 0===t?void 0:t.options.map((function(e,o){var n;return i(y,{value:e.value,control:i(w,{}),label:null!==(n=e.label)&&void 0!==n?n:e.value},e.value.toString()+o)}))})})},ne=d(m)({marginLeft:"-8px",marginRight:"-8px","&.error .MuiRadio-root":{color:"#d32f2f"},".MuiFormControlLabel-root":{margin:0},".MuiFormControlLabel-root:hover":{backgroundColor:"rgba(25, 118, 210, 0.04)"}}),ie=function(e){var o,l,t,d,u,s=a("and"),c=n(s,2),f=c[0],m=c[1],v=null!==(o=null===(l=e.fieldConfig)||void 0===l?void 0:l.label)&&void 0!==o?o:e.name;return r(X,{label:v,notes:null===(t=e.fieldConfig)||void 0===t?void 0:t.notes,afterTopBar:i(N,{value:f,onChange:function(e,o){return m(o)}}),children:[i("input",{type:"hidden",name:"filterLogic",value:f}),i(le,{className:null!==(d=e.validationResult)&&void 0!==d&&d.hasError?"error":"",children:null===(u=e.fieldConfig)||void 0===u?void 0:u.options.map((function(o,n){var l;return i(y,{value:o.value,control:i(z,{name:e.name}),label:null!==(l=o.label)&&void 0!==l?l:o.value,onChange:e.onChange},o.value.toString()+n)}))})]})},le=d(v)({marginLeft:"-8px",marginRight:"-8px","&.error .MuiCheckbox-root":{color:"#d32f2f"},".MuiFormControlLabel-root":{margin:0},".MuiFormControlLabel-root:hover":{backgroundColor:"rgba(25, 118, 210, 0.04)"}});var re=function(e){var o,l,t,d,u,s,c,m,v=a("before"),p=n(v,2),h=p[0],g=p[1],b=a(""),x=n(b,2),y=x[0],z=x[1],w=null!==(o=null===(l=e.fieldConfig)||void 0===l?void 0:l.label)&&void 0!==o?o:e.name;return i(X,{label:w,notes:null===(t=e.fieldConfig)||void 0===t?void 0:t.notes,afterTopBar:i(j,{value:h,onChange:function(e,o){return g(o)}}),children:r(f,{className:"content",children:[i("input",{type:"hidden",name:"dateLogic",value:h}),i("input",{hidden:!0,type:"text",name:e.name,readOnly:!0,value:(m=y,m&&/^\d{4}-\d{2}-\d{2}$/.test(m)?"".concat(m,"T00:00:00.0000000"):"")}),i(C,{autoFocus:!0,fullWidth:!0,type:"date",size:"small",value:y,onChange:function(e){return z(e.target.value)},error:!(null===(d=e.validationResult)||void 0===d||!d.hasError),helperText:null===(u=e.validationResult)||void 0===u?void 0:u.message,inputProps:{min:null===(s=e.fieldConfig)||void 0===s?void 0:s.minDate,max:null===(c=e.fieldConfig)||void 0===c?void 0:c.maxDate}})]})})},te=function(e){var o,l,t,d,u,s,c,f,m,v,p=a("between"),h=n(p,2),g=h[0],b=h[1],x=null!==(o=null===(l=e.fieldConfig)||void 0===l?void 0:l.label)&&void 0!==o?o:e.name;return r(X,{label:x,notes:null===(t=e.fieldConfig)||void 0===t?void 0:t.notes,afterTopBar:i(I,{value:g,onChange:function(e,o){return b(o)}}),children:[i("input",{type:"hidden",name:"dateRangeLogic",value:g}),r(ae,{children:[i(C,{autoFocus:!0,fullWidth:!0,name:"".concat(e.name,"_start"),type:"date",size:"small",label:"From",error:!(null===(d=e.validationResult)||void 0===d||!d.hasError),sx:{marginBottom:1},InputLabelProps:{shrink:!0},inputProps:{min:null===(u=e.fieldConfig)||void 0===u?void 0:u.minDate,max:null===(s=e.fieldConfig)||void 0===s?void 0:s.maxDate}}),i(C,{fullWidth:!0,name:"".concat(e.name,"_end"),type:"date",size:"small",label:"To",error:!(null===(c=e.validationResult)||void 0===c||!c.hasError),helperText:null===(f=e.validationResult)||void 0===f?void 0:f.message,InputLabelProps:{shrink:!0},inputProps:{min:null===(m=e.fieldConfig)||void 0===m?void 0:m.minDate,max:null===(v=e.fieldConfig)||void 0===v?void 0:v.maxDate}})]})]})},ae=d(f)({display:"flex",flexDirection:"column",gap:"8px"}),de=d(f)({display:"inline-flex",flex:"0 0 auto",justifyContent:"center",alignItems:"center","&:not(.disabled-size)":{width:"40px",height:"40px"}}),ue=d("ul")({paddingLeft:"1.7rem",marginBottom:0,li:{position:"relative",textAlign:"justify","&::before":{content:'"►"',display:"block",position:"absolute",top:"50%",right:"calc(100% + 6px)",transform:"translateY(-50%)",fontSize:"0.9em"}}});export{$ as ClearAllButton,j as DateLogicToggle,I as DateRangeLogicToggle,G as FilterButton,O as FilterInput,U as FilterInputAdornment,N as FilterLogicToggle,K as FilterNotes,re as MenuWithTypeDate,te as MenuWithTypeDateRange,oe as MenuWithTypeSelect,ie as MenuWithTypeSelectMulti,ee as MenuWithTypeString,V as PanelNotFound,J as SortButton,F as mapSortConfigs};
+import{objectSpread2 as e,objectWithoutProperties as o,slicedToArray as n}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i,Fragment as l,jsxs as r}from"react/jsx-runtime";import t,{useRef as a,useState as d}from"react";import{styled as u,ToggleButtonGroup as s,Button as c,colors as f,Box as m,RadioGroup as v,FormGroup as p,ButtonGroup as h,IconButton as g,InputBase as b,InputAdornment as x,Typography as C,Tooltip as z,TextField as y,FormControlLabel as w,Checkbox as S,Radio as T,ToggleButton as R}from"@mui/material";import k from"@mui/icons-material/Close";import B from"@mui/icons-material/Shuffle";import P from"@mui/icons-material/ClearAll";import L from"@mui/icons-material/FilterList";import W from"@mui/icons-material/ArrowUpward";import D from"@mui/icons-material/ArrowDownward";import E from"@mui/icons-material/KeyboardReturn";import F from"@mui/icons-material/KeyboardArrowDown";import{mapDataViewContext as M}from"./context.js";import j from"../components/help-tooltip.js";import{createFilterStore as A}from"./filter-store.js";var N=["children"],I={asc:{title:"Ascending",icon:i(W,{fontSize:"small"})},desc:{title:"Descending",icon:i(D,{fontSize:"small"})}},_=function(e){return r(O,{size:"small",value:e.value||"and",exclusive:!0,onChange:function(o,n){n&&e.onChange&&e.onChange(o,n)},children:[i(R,{size:"small",value:"and","aria-label":"and logic",children:"AND"}),i(R,{size:"small",value:"or","aria-label":"or logic",children:"OR"})]})},H=function(e){return r(O,{size:"small",value:e.value||"before",exclusive:!0,onChange:function(o,n){n&&e.onChange&&e.onChange(o,n)},children:[i(R,{size:"small",value:"before","aria-label":"before date",children:"before"}),i(R,{size:"small",value:"after","aria-label":"after date",children:"after"})]})},K=function(e){return r(O,{size:"small",value:e.value||"between",exclusive:!0,onChange:function(o,n){n&&e.onChange&&e.onChange(o,n)},children:[i(R,{size:"small",value:"between","aria-label":"between dates",children:"between"}),i(R,{size:"small",value:"not-between","aria-label":"not between dates",children:"not between"})]})},O=u(s)({"& .MuiToggleButton-root":{color:"#fff",borderColor:"rgba(255, 255, 255, 0.3)",fontSize:"0.65rem",fontWeight:600,lineHeight:1,minWidth:"40px",padding:"6px 8px","&.Mui-selected":{backgroundColor:"#1976d2",color:"#fff","&:hover":{backgroundColor:"#1565c0"}},"&:hover":{backgroundColor:"rgba(255, 255, 255, 0.08)"}}}),U=function(e){return i(fe,{children:e.items.map((function(e,o){return i(C,{component:"li",variant:"body2",children:e},o)}))})},Y=function(e){var o,n;return i(ce,{className:!0===e.disabledSize?"disabled-size":"",children:i(j,{small:!0,title:null!==(o=e.title)&&void 0!==o?o:"The search includes",children:e.renderContent?e.renderContent():i(U,{items:null!==(n=e.items)&&void 0!==n?n:[]})})})},$=t.forwardRef((function(o,n){return i(b,e(e({fullWidth:!0,autoComplete:"off",size:"small"},o),{},{inputRef:n}))})),q=function(o){return r(x,{position:"end",children:[o.keyword&&r(l,{children:[i(G,{size:"small",color:"primary",onClick:o.onEnterSearch,sx:{display:{xs:"none",md:"flex"}},children:r(C,{variant:"caption",children:["Type and hit ",i("b",{children:"Enter ⏎"})," to filter."]})}),i(z,{title:"Press Enter to filter",placement:"bottom",arrow:!0,children:i(g,{size:"small",color:"primary",sx:{display:{xs:"flex",md:"none"}},onClick:o.onEnterSearch,children:i(E,{fontSize:"small"})})})]}),o.keyword&&i(z,{title:"Press Esc to clear",placement:"bottom",arrow:!0,children:i(g,{size:"small",sx:{marginLeft:"8px",color:"text.error","&:hover":{color:"error.main"}},onClick:o.onClear,children:i(k,{fontSize:"small"})})}),o.notes&&i(Y,e({},o.notes))]})},G=u(c)({padding:"4px 6px",textTransform:"none",lineHeight:1,".MuiTypography-root":{fontWeight:600,b:{fontWeight:700,backgroundColor:f.blue[100],borderRadius:"4px",padding:"2px 4px"}}}),J=t.forwardRef((function(n,l){var r=n.children,t=o(n,N);return i(Q,e(e({size:"small",color:"error",startIcon:i(P,{}),ref:l},t),{},{children:r||"Clear all"}))})),Q=u(c)({textTransform:"none",fontWeight:700}),V=t.forwardRef((function(o,n){return i(g,e(e({ref:n,size:"small",sx:{flex:"0 0 auto"}},o),{},{children:i(L,{})}))})),X=function(o){var n=a(null);return i(l,{children:M((function(l){var t,a,d,u,s,c,f,m,v,p=l.filterState,g=l.filterBarConfigs,b=p.sort?I[null===(t=p.sort)||void 0===t?void 0:t.direction]:{},x=null===(a=g.fields)||void 0===a?void 0:a[null===(d=p.sort)||void 0===d?void 0:d.field],C=(null==x?void 0:x.label)||(null===(u=p.sort)||void 0===u||null===(u=u.field)||void 0===u?void 0:u.toString())||(null===(s=g.sortButton)||void 0===s?void 0:s.text);return C?r(h,{"aria-label":"Button Sort",size:"small",children:[i(Z,e(e(e({size:"small",color:"inherit",startIcon:b.icon||i(B,{fontSize:"small"}),onClick:function(e){e.stopPropagation(),n.current&&clearTimeout(n.current),n.current=setTimeout((function(){return function(){var e,o;if(null!==(e=p.sort)&&void 0!==e&&e.field){var n=null===(o=p.sort)||void 0===o?void 0:o.direction,i=n&&"asc"===n?"desc":"asc",r={field:p.sort.field,direction:i},t=A(p).changeSort(r,{area:"sortButton"});l.onFilterStateChange(t.build())}}()}),500)}},null===(v=g.sortButton)||void 0===v?void 0:v.wrapProps),o),{},{children:C})),i(Z,{size:"small",color:"inherit",sx:{p:0},onClick:function(e){return l.onPopperPanelChange(e.currentTarget,"sortButton")},children:i(F,{fontSize:"small"})})]}):i(Z,e(e(e({size:"small",color:"inherit",startIcon:b.icon||i(B,{fontSize:"small"}),endIcon:null!==(c=null===(f=g.sortButton)||void 0===f?void 0:f.icon)&&void 0!==c?c:i(F,{fontSize:"small"}),onClick:function(e){return l.onPopperPanelChange(e.currentTarget,"sortButton")}},null===(m=g.sortButton)||void 0===m?void 0:m.wrapProps),o),{},{children:C||"Sort"}))}))})},Z=u(c)({height:"var(--filter-bar-height, 40px)",padding:"0 16px",backgroundColor:f.grey[50],border:"1px solid var(--color-divider, rgba(145 158 171 / 20%))",textTransform:"none",fontWeight:600,":hover":{backgroundColor:f.grey[100]}}),ee=function(e){var o=e.area;return i(m,{sx:{padding:"8px",textAlign:"center",border:"1px solid #ddd",borderRadius:"4px"},children:r(C,{variant:"body2",sx:{padding:"8px"},children:["No panel available for area: ",o]})})},oe=function(o){var n=o.label,l=o.notes,t=o.children,a=o.afterTopBar;return r(ne,{children:[r(m,{className:"top-bar",children:[i(C,{variant:"subtitle2",children:n}),a&&i(m,{className:"after-top-bar",children:a}),l&&i(Y,e({title:"The ".concat(n," includes"),disabledSize:!0},l))]}),i(m,{className:"content",children:t})]})},ne=u(m)({minWidth:"200px",borderRadius:"4px",overflow:"hidden",".top-bar":{display:"flex",alignItems:"center",background:f.grey[900],padding:"8px",gap:"8px",".MuiTypography-root":{color:f.common.white,flex:1}},".after-top-bar":{marginLeft:"8px"},".content":{padding:"8px"}}),ie=function(e){var o,n,l,r,t,a=null!==(o=null===(n=e.fieldConfig)||void 0===n?void 0:n.label)&&void 0!==o?o:e.name;return i(oe,{label:a,notes:null===(l=e.fieldConfig)||void 0===l?void 0:l.notes,children:i(y,{autoFocus:!0,name:e.name,size:"small",fullWidth:!0,error:!(null===(r=e.validationResult)||void 0===r||!r.hasError),helperText:null===(t=e.validationResult)||void 0===t?void 0:t.message})})},le=function(e){var o,n,l,r,t,a=null!==(o=null===(n=e.fieldConfig)||void 0===n?void 0:n.label)&&void 0!==o?o:e.name;return i(oe,{label:a,notes:null===(l=e.fieldConfig)||void 0===l?void 0:l.notes,children:i(re,{name:e.name,className:null!==(r=e.validationResult)&&void 0!==r&&r.hasError?"error":"",onChange:e.onChange,children:null===(t=e.fieldConfig)||void 0===t?void 0:t.options.map((function(e,o){var n;return i(w,{value:e.value,control:i(T,{}),label:null!==(n=e.label)&&void 0!==n?n:e.value},e.value.toString()+o)}))})})},re=u(v)({marginLeft:"-8px",marginRight:"-8px","&.error .MuiRadio-root":{color:"#d32f2f"},".MuiFormControlLabel-root":{margin:0},".MuiFormControlLabel-root:hover":{backgroundColor:"rgba(25, 118, 210, 0.04)"}}),te=function(e){var o,l,t,a,u,s=d("and"),c=n(s,2),f=c[0],m=c[1],v=null!==(o=null===(l=e.fieldConfig)||void 0===l?void 0:l.label)&&void 0!==o?o:e.name;return r(oe,{label:v,notes:null===(t=e.fieldConfig)||void 0===t?void 0:t.notes,afterTopBar:i(_,{value:f,onChange:function(e,o){return m(o)}}),children:[i("input",{type:"hidden",name:"filterLogic",value:f}),i(ae,{className:null!==(a=e.validationResult)&&void 0!==a&&a.hasError?"error":"",children:null===(u=e.fieldConfig)||void 0===u?void 0:u.options.map((function(o,n){var l;return i(w,{value:o.value,control:i(S,{name:e.name}),label:null!==(l=o.label)&&void 0!==l?l:o.value,onChange:e.onChange},o.value.toString()+n)}))})]})},ae=u(p)({marginLeft:"-8px",marginRight:"-8px","&.error .MuiCheckbox-root":{color:"#d32f2f"},".MuiFormControlLabel-root":{margin:0},".MuiFormControlLabel-root:hover":{backgroundColor:"rgba(25, 118, 210, 0.04)"}});var de=function(e){var o,l,t,a,u,s,c,f,v=d("before"),p=n(v,2),h=p[0],g=p[1],b=d(""),x=n(b,2),C=x[0],z=x[1],w=null!==(o=null===(l=e.fieldConfig)||void 0===l?void 0:l.label)&&void 0!==o?o:e.name;return i(oe,{label:w,notes:null===(t=e.fieldConfig)||void 0===t?void 0:t.notes,afterTopBar:i(H,{value:h,onChange:function(e,o){return g(o)}}),children:r(m,{className:"content",children:[i("input",{type:"hidden",name:"dateLogic",value:h}),i("input",{hidden:!0,type:"text",name:e.name,readOnly:!0,value:(f=C,f&&/^\d{4}-\d{2}-\d{2}$/.test(f)?"".concat(f,"T00:00:00.0000000"):"")}),i(y,{autoFocus:!0,fullWidth:!0,type:"date",size:"small",value:C,onChange:function(e){return z(e.target.value)},error:!(null===(a=e.validationResult)||void 0===a||!a.hasError),helperText:null===(u=e.validationResult)||void 0===u?void 0:u.message,inputProps:{min:null===(s=e.fieldConfig)||void 0===s?void 0:s.minDate,max:null===(c=e.fieldConfig)||void 0===c?void 0:c.maxDate}})]})})},ue=function(e){var o,l,t,a,u,s,c,f,m,v,p=d("between"),h=n(p,2),g=h[0],b=h[1],x=null!==(o=null===(l=e.fieldConfig)||void 0===l?void 0:l.label)&&void 0!==o?o:e.name;return r(oe,{label:x,notes:null===(t=e.fieldConfig)||void 0===t?void 0:t.notes,afterTopBar:i(K,{value:g,onChange:function(e,o){return b(o)}}),children:[i("input",{type:"hidden",name:"dateRangeLogic",value:g}),r(se,{children:[i(y,{autoFocus:!0,fullWidth:!0,name:"".concat(e.name,"_start"),type:"date",size:"small",label:"From",error:!(null===(a=e.validationResult)||void 0===a||!a.hasError),sx:{marginBottom:1},InputLabelProps:{shrink:!0},inputProps:{min:null===(u=e.fieldConfig)||void 0===u?void 0:u.minDate,max:null===(s=e.fieldConfig)||void 0===s?void 0:s.maxDate}}),i(y,{fullWidth:!0,name:"".concat(e.name,"_end"),type:"date",size:"small",label:"To",error:!(null===(c=e.validationResult)||void 0===c||!c.hasError),helperText:null===(f=e.validationResult)||void 0===f?void 0:f.message,InputLabelProps:{shrink:!0},inputProps:{min:null===(m=e.fieldConfig)||void 0===m?void 0:m.minDate,max:null===(v=e.fieldConfig)||void 0===v?void 0:v.maxDate}})]})]})},se=u(m)({display:"flex",flexDirection:"column",gap:"8px"}),ce=u(m)({display:"inline-flex",flex:"0 0 auto",justifyContent:"center",alignItems:"center","&:not(.disabled-size)":{width:"40px",height:"40px"}}),fe=u("ul")({paddingLeft:"1.7rem",marginBottom:0,li:{position:"relative",textAlign:"justify","&::before":{content:'"►"',display:"block",position:"absolute",top:"50%",right:"calc(100% + 6px)",transform:"translateY(-50%)",fontSize:"0.9em"}}});export{J as ClearAllButton,H as DateLogicToggle,K as DateRangeLogicToggle,V as FilterButton,$ as FilterInput,q as FilterInputAdornment,_ as FilterLogicToggle,Y as FilterNotes,de as MenuWithTypeDate,ue as MenuWithTypeDateRange,le as MenuWithTypeSelect,te as MenuWithTypeSelectMulti,ie as MenuWithTypeString,ee as PanelNotFound,X as SortButton,I as mapSortConfigs};
 //# sourceMappingURL=ui.units.js.map