npm - dinocollab-core - Versions diffs - 2.2.5 → 2.2.7 - Mend

dinocollab-core 2.2.5 → 2.2.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (34) hide show

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

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

package/dist/src/components/rich-tooltip.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as e,objectWithoutProperties as t,objectSpread2 as r,inherits as a,createClass as o,classCallCheck as n,callSuper as i}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as p}from"react/jsx-runtime";import{Component as c}from"react";import{styled as s,Stack as d,Tooltip as u,tooltipClasses as m,Box as h,Typography as f,Divider as b}from"@mui/material";import x from"@mui/icons-material/HelpOutline";var g=["className"],v=function(){function t(){var r;n(this,t);for(var a=arguments.length,o=new Array(a),c=0;c<a;c++)o[c]=arguments[c];return r=i(this,t,[].concat(o)),e(r,"renderTitlePanel",function(){var e=r.props,t=e.panel,a=e.renderPanel;return a?a():t?p(k,{className:P.titlePanel,children:[r.renderTitle(t.title),l(b,{}),l(h,{className:P.content,children:r.renderContent(t.content)})]}):l(f,{variant:"body2",children:"Please provide a panel configuration"})}),e(r,"renderTitle",function(e){return e?"string"!=typeof e?e:l(f,{variant:"subtitle1",className:P.title,children:e}):null}),e(r,"renderContent",function(e){return e?"string"!=typeof e?e:l(f,{variant:"body2",children:e}):null}),r}return a(t,c),o(t,[{key:"render",value:function(){var e=this.props,t=e.children,a=e.slots;return l(w,r(r({arrow:!0,placement:"bottom",title:this.renderTitlePanel(),className:P.root},null==a?void 0:a.tooltipProps),{},{children:l(h,r(r({},null==a?void 0:a.wrapperProps),{},{children:t}))}))}}])}(),P={root:"RichTooltip-root",titlePanel:"RichTooltip-titlePanel",title:"RichTooltip-title",content:"RichTooltip-content"},y=function(e,t){return"".concat((null==t?void 0:t.prefix)||"",".").concat(P[e]).concat((null==t?void 0:t.suffix)||"")},k=s(d)(function(t){var r=t.theme;return e(e(e({},y("titlePanel",{prefix:"&"}),{gap:"6px"}),y("title"),{color:r.palette.primary.main,fontWeight:700,padding:r.spacing(1,1.5,0)}),y("content"),{padding:r.spacing(1,1.5,1.5),color:r.palette.text.primary})}),w=s(function(e){var a=e.className,o=t(e,g);return l(u,r(r({},o),{},{classes:{popper:a}}))})(function(t){var r=t.theme;return e(e({},"& .".concat(m.tooltip),{backgroundColor:r.palette.background.paper,color:r.palette.text.primary,padding:0,minWidth:"360px",maxWidth:"450px",borderRadius:r.shape.borderRadius,boxShadow:"dark"===r.palette.mode?"rgba(0, 0, 0, 0.4) 0px 6px 30px":"rgba(0, 0, 0, 0.08) 0px 6px 30px",border:"1px solid ".concat(r.palette.divider)}),"& .".concat(m.arrow),{color:r.palette.background.paper})}),T=s(x)(function(e){var t=e.theme;return{position:"relative",zIndex:1,color:t.palette.primary.main,borderRadius:"50%",cursor:"help",animation:"pulseGlow 1.5s infinite","@keyframes pulseGlow":{"0%":{boxShadow:"dark"===t.palette.mode?"0 0 0 0 rgba(144, 202, 249, 0.3)":"0 0 0 0 rgba(33, 150, 243, 0.3)"},"70%":{boxShadow:"dark"===t.palette.mode?"0 0 0 10px rgba(144, 202, 249, 0)":"0 0 0 10px rgba(33, 150, 243, 0)"},"100%":{boxShadow:"dark"===t.palette.mode?"0 0 0 0 rgba(144, 202, 249, 0)":"0 0 0 0 rgba(33, 150, 243, 0)"}}}});export{T as HelpOutlinePulseIcon,v as RichTooltip,v as default};
+import{defineProperty as t,objectWithoutProperties as e,objectSpread2 as o}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as a,jsxs as r}from"react/jsx-runtime";import{useMemo as i}from"react";import{styled as n,Stack as l,Tooltip as p,tooltipClasses as c,Box as d,Typography as s,Divider as u}from"@mui/material";import m from"@mui/icons-material/HelpOutline";var h=["className"],f=function(t){var e,n=t.children,l=t.panel,p=t.renderPanel,c=t.slots,m=t.isTouch,h=i(function(){return void 0!==m?m:"undefined"!=typeof window&&("ontouchstart"in window||navigator.maxTouchPoints>0||(navigator.msMaxTouchPoints||0)>0||(null===(t=(e=window).matchMedia)||void 0===t?void 0:t.call(e,"(pointer: coarse)").matches));var t,e},[m]),f=function(t){return t?"string"!=typeof t?t:a(s,{variant:"body2",children:t}):null},b=o(o({},h?{enterTouchDelay:0,leaveTouchDelay:3e3}:{}),null==c?void 0:c.tooltipProps);return a(v,o(o({arrow:!0,placement:"bottom",title:p?p():l?r(g,{className:x.titlePanel,children:[(e=l.title,e?"string"!=typeof e?e:a(s,{variant:"subtitle1",className:x.title,children:e}):null),a(u,{}),a(d,{className:x.content,children:f(l.content)})]}):a(s,{variant:"body2",children:"Please provide a panel configuration"}),className:x.root},b),{},{children:a(d,o(o({},null==c?void 0:c.wrapperProps),{},{children:n}))}))},x={root:"RichTooltip-root",titlePanel:"RichTooltip-titlePanel",title:"RichTooltip-title",content:"RichTooltip-content"},b=function(t,e){return"".concat((null==e?void 0:e.prefix)||"",".").concat(x[t]).concat((null==e?void 0:e.suffix)||"")},g=n(l)(function(e){var o=e.theme;return t(t(t({},b("titlePanel",{prefix:"&"}),{gap:"6px"}),b("title"),{color:o.palette.primary.main,fontWeight:700,padding:o.spacing(1,1.5,0)}),b("content"),{padding:o.spacing(1,1.5,1.5),color:o.palette.text.primary})}),v=n(function(t){var r=t.className,i=e(t,h);return a(p,o(o({},i),{},{classes:{popper:r}}))})(function(e){var o=e.theme;return t(t({},"& .".concat(c.tooltip),{backgroundColor:o.palette.background.paper,color:o.palette.text.primary,padding:0,minWidth:"360px",maxWidth:"450px",borderRadius:o.shape.borderRadius,boxShadow:"dark"===o.palette.mode?"rgba(0, 0, 0, 0.4) 0px 6px 30px":"rgba(0, 0, 0, 0.08) 0px 6px 30px",border:"1px solid ".concat(o.palette.divider)}),"& .".concat(c.arrow),{color:o.palette.background.paper})}),w=n(m)(function(t){var e=t.theme;return{position:"relative",zIndex:1,color:e.palette.primary.main,borderRadius:"50%",cursor:"help",animation:"pulseGlow 1.5s infinite","@keyframes pulseGlow":{"0%":{boxShadow:"dark"===e.palette.mode?"0 0 0 0 rgba(144, 202, 249, 0.3)":"0 0 0 0 rgba(33, 150, 243, 0.3)"},"70%":{boxShadow:"dark"===e.palette.mode?"0 0 0 10px rgba(144, 202, 249, 0)":"0 0 0 10px rgba(33, 150, 243, 0)"},"100%":{boxShadow:"dark"===e.palette.mode?"0 0 0 0 rgba(144, 202, 249, 0)":"0 0 0 0 rgba(33, 150, 243, 0)"}}}});export{w as HelpOutlinePulseIcon,f as RichTooltip,f as default};
 //# sourceMappingURL=rich-tooltip.js.map

package/dist/src/components/rich-tooltip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"rich-tooltip.js","sources":["../../../src/components/rich-tooltip.tsx"],"sourcesContent":["import { ~~Component~~ } from 'react'\r\nimport { Box, Divider, Stack, Tooltip, Typography, styled, tooltipClasses } from '@mui/material'\r\nimport type { ReactNode } from 'react'\r\nimport type { BoxProps, TooltipProps } from '@mui/material'\r\nimport HelpOutlineIcon from '@mui/icons-material/HelpOutline'\r\n\r\nexport interface IRichTooltipPanelConfig {\r\n title: ReactNode\r\n content: ReactNode\r\n}\r\n\r\nexport interface IRichTooltipProps {\r\n panel?: IRichTooltipPanelConfig\r\n renderPanel?: () => ReactNode\r\n children: React.ReactNode\r\n slots?: {\r\n tooltipProps?: Partial<TooltipProps>\r\n wrapperProps?: BoxProps\r\n }\r\n}\r\n\r\~~nexport~~ ~~class~~ ~~RichTooltip~~ ~~extends~~ ~~Component<IRichTooltipProps>~~ {\r\n ~~render~~() {\r\n const { children, slots } = ~~this.~~props\r\n return (\r\n ~~<TooltipStyled~~ ~~arrow~~ ~~placement~~=~~'bottom'~~ ~~title=~~{~~this.renderTitlePanel~~()} className={richTooltipClasses.~~root~~} ~~{...slots?.tooltipProps}~~>\r\n ~~<Box~~ {~~...slots?.wrapperProps~~}~~>{children}</Box>\~~r\n </~~TooltipStyled~~>\r\n )\r\n }\r\n\r\n ~~renderTitlePanel~~ = () => {\r\n ~~const~~ { ~~panel,~~ ~~renderPanel~~ } = ~~this.props~~\r\n if (renderPanel) return renderPanel()\r\n if (!panel) return <Typography variant='body2'>Please provide a panel configuration</Typography>\r\n return (\r\n <TooltipTitlePanelStyled className={richTooltipClasses.titlePanel}>\r\n {~~this.~~renderTitle(panel.title)}\r\n <Divider />\r\n <Box className={richTooltipClasses.content}>{~~this.~~renderContent(panel.content)}</Box>\r\n </TooltipTitlePanelStyled>\r\n )\r\n }\r\n\r\n ~~renderTitle~~ = ~~(value:~~ ~~ReactNode)~~ => {\r\n if ~~(!value)~~ ~~return~~ ~~null~~\r\n if (~~typeof~~ ~~value~~ ~~!==~~ ~~'string')~~ ~~return~~ ~~value\r\n return~~ ~~(\r\n <Typography~~ ~~variant='subtitle1'~~ ~~className=~~{~~richTooltipClasses.title~~}>\r\n ~~{value}\r\n </Typography>\r\n~~ )\r\n }\r\n\r\n ~~renderContent~~ = (~~value: ReactNode) => {~~\r\n if ~~(!value)~~ ~~return~~ ~~null\r\n if~~ (~~typeof value !== 'string'~~) ~~return~~ ~~value\~~r\n ~~return~~ <~~Typography~~ ~~variant='body2'~~>{~~value~~}</~~Typography~~>\r\n }\r\n}\r\n\r\nexport default RichTooltip\r\n\r\nconst richTooltipClasses = {\r\n root: 'RichTooltip-root',\r\n titlePanel: 'RichTooltip-titlePanel',\r\n title: 'RichTooltip-title',\r\n content: 'RichTooltip-content'\r\n}\r\n\r\nconst getRichTooltipClass = (key: keyof typeof richTooltipClasses, options?: { prefix?: string; suffix?: string }) => {\r\n return `${options?.prefix \|\| ''}.${richTooltipClasses[key]}${options?.suffix \|\| ''}`\r\n}\r\n\r\nconst TooltipTitlePanelStyled = styled(Stack)(({ theme }) => ({\r\n [getRichTooltipClass('titlePanel', { prefix: '&' })]: {\r\n gap: '6px'\r\n },\r\n [getRichTooltipClass('title')]: {\r\n color: theme.palette.primary.main,\r\n fontWeight: 700,\r\n padding: theme.spacing(1, 1.5, 0)\r\n },\r\n [getRichTooltipClass('content')]: {\r\n padding: theme.spacing(1, 1.5, 1.5),\r\n color: theme.palette.text.primary\r\n }\r\n}))\r\n\r\nconst TooltipStyled = styled(({ className, ...props }: TooltipProps) => <Tooltip {...props} classes={{ popper: className }} />)(({ theme }) => ({\r\n [`& .${tooltipClasses.tooltip}`]: {\r\n backgroundColor: theme.palette.background.paper,\r\n color: theme.palette.text.primary,\r\n padding: 0,\r\n minWidth: '360px',\r\n maxWidth: '450px',\r\n borderRadius: theme.shape.borderRadius,\r\n boxShadow: theme.palette.mode === 'dark' ? 'rgba(0, 0, 0, 0.4) 0px 6px 30px' : 'rgba(0, 0, 0, 0.08) 0px 6px 30px',\r\n border: `1px solid ${theme.palette.divider}`\r\n },\r\n [`& .${tooltipClasses.arrow}`]: {\r\n color: theme.palette.background.paper\r\n }\r\n}))\r\n\r\nexport const HelpOutlinePulseIcon = styled(HelpOutlineIcon)(({ theme }) => ({\r\n position: 'relative',\r\n zIndex: 1,\r\n color: theme.palette.primary.main,\r\n borderRadius: '50%',\r\n cursor: 'help',\r\n animation: 'pulseGlow 1.5s infinite',\r\n '@keyframes pulseGlow': {\r\n '0%': {\r\n boxShadow: theme.palette.mode === 'dark' ? '0 0 0 0 rgba(144, 202, 249, 0.3)' : '0 0 0 0 rgba(33, 150, 243, 0.3)'\r\n },\r\n '70%': {\r\n boxShadow: theme.palette.mode === 'dark' ? '0 0 0 10px rgba(144, 202, 249, 0)' : '0 0 0 10px rgba(33, 150, 243, 0)'\r\n },\r\n '100%': {\r\n boxShadow: theme.palette.mode === 'dark' ? '0 0 0 0 rgba(144, 202, 249, 0)' : '0 0 0 0 rgba(33, 150, 243, 0)'\r\n }\r\n }\r\n}))\r\n"],"names":["RichTooltip","~~_this~~","~~_classCallCheck~~","~~_len~~","~~arguments~~","~~length~~","~~args~~","~~Array~~","~~_key~~","~~_callSuper~~","~~this~~","~~concat~~","~~_defineProperty~~","~~_this$props~~","~~props~~","~~panel~~","~~renderPanel~~","~~_jsxs~~","~~TooltipTitlePanelStyled~~","~~className~~","~~richTooltipClasses~~","~~titlePanel","renderTitle","title","~~_jsx","~~Divider~~","~~Box~~","~~content~~","~~children~~","~~renderContent~~","~~Typography~~","~~variant~~","~~value~~","~~_inherits~~","~~Component~~","~~_createClass~~","~~key~~","~~_this$props2~~","~~slots~~","~~TooltipStyled~~","~~_objectSpread~~","~~arrow~~","~~placement~~","~~renderTitlePanel~~","~~root~~","~~tooltipProps~~","~~wrapperProps~~","~~getRichTooltipClass~~","~~options~~","prefix","suffix","styled","Stack","_ref","theme","gap","color","palette","primary","main","fontWeight","padding","spacing","text","_ref3","_objectWithoutProperties","_excluded","Tooltip","classes","popper","_ref4","tooltipClasses","tooltip","backgroundColor","background","paper","minWidth","maxWidth","borderRadius","shape","boxShadow","mode","border","divider","HelpOutlinePulseIcon","HelpOutlineIcon","_ref6","position","zIndex","cursor","animation"],"mappings":"~~+cAqBaA~~,~~aAAY~~,~~SAAAA~~,~~IAAA~~,~~IAAAC~~,~~EAAAC~~,~~OAAAF~~,~~GAAA~~,~~IAAA~~,~~IAAAG~~,~~EAAAC~~,~~UAAAC~~,~~OAAAC~~,~~EAAAC~~,~~IAAAA~~,~~MAAAJ~~,~~GAAAK~~,~~EAAA~~,~~EAAAA~~,~~EAAAL~~,~~EAAAK~~,~~IAAAF~~,~~EAAAE~~,~~GAAAJ~~,~~UAAAI~~,~~GAqCtB~~,~~OArCsBP~~,~~EAAAQ~~,~~EAAAC~~,~~KAAAV~~,~~EAAAW~~,~~GAAAA~~,~~OAAAL~~,~~IAAAM~~,~~EAAAX~~,~~EAAA~~,~~mBAUJ~~,~~WACjB~~,~~IAAAY~~,~~EAA+BZ~~,~~EAAKa~~,~~MAA5BC~~,~~EAAKF~~,~~EAALE~~,~~MAAOC~~,~~EAAWH~~,~~EAAXG~~,~~YACf~~,~~OAAIA~~,~~EAAoBA~~,~~IACnBD~~,~~EAEHE~~,~~EAACC~~,~~GAAwBC~~,~~UAAWC~~,~~EAAmBC~~,~~qBACpDpB~~,~~EAAKqB~~,~~YAAYP~~,~~EAAMQ~~,~~OACxBC~~,~~EAACC~~,~~MACDD~~,~~EAACE~~,~~EAAI~~,~~CAAAP~~,~~UAAWC~~,~~EAAmBO~~,~~QAAUC~~,~~SAAA3B~~,~~EAAK4B~~,~~cAAcd~~,~~EAAMY~~,~~cALvDH~~,~~EAACM~~,~~EAAU~~,~~CAACC~~,~~QAAQ~~,~~4DAQxCnB~~,~~EAAAX~~,~~EAEa~~,~~cAAA~~,~~SAAC+B~~,~~GACb~~,~~OAAKA~~,~~EACgB~~,~~iBAAVA~~,~~EAA2BA~~,~~EAEpCR~~,~~EAACM~~,~~EAAW~~,~~CAAAC~~,~~QAAQ~~,~~YAAYZ~~,~~UAAWC~~,~~EAAmBG~~,~~eAC3DS~~,~~IAJc~~,~~OAOpBpB~~,~~EAAAX~~,~~EAEe~~,~~gBAAA~~,~~SAAC+B~~,~~GACf~~,~~OAAKA~~,~~EACgB~~,~~iBAAVA~~,~~EAA2BA~~,~~EAC/BR,EAACM,EAAW,~~CAAAC,~~QAAQ~~,~~QAAOH~~,~~SAAEI~~,~~IAFjB~~,~~OAGpB/B~~,~~CAAA~~,~~CAAA~~,~~OAAAgC~~,~~EAAAjC~~,~~EArC8BkC~~,~~GAqC9BC~~,~~EAAAnC~~,~~EAAA~~,~~CAAA~~,~~CAAAoC~~,~~IAAA~~,~~SAAAJ~~,~~MApCD~~,~~WACE~~,~~IAAAK~~,~~EAA4B3B~~,~~KAAKI~~,~~MAAzBc~~,~~EAAQS~~,~~EAART~~,~~SAAUU~~,~~EAAKD~~,~~EAALC~~,~~MAClB~~,~~OACEd~~,~~EAACe~~,~~EAAaC~~,~~EAAAA~~,~~EAAA~~,~~CAACC~~,~~SAAMC~~,~~UAAU~~,~~SAASnB~~,~~MAAOb~~,~~KAAKiC~~,~~mBAAoBxB~~,UAAWC,~~EAAmBwB~~,~~MAAUN~~,~~aAAAA~~,~~EAAAA~~,~~EAAOO~~,~~cAAY~~,~~GAAA~~,~~UACjIrB~~,~~EAACE,EAAGc,~~EAAAA,EAAA,CAAA,~~EAAKF~~,aAAAA,EAAAA,~~EAAOQ~~,cAAY,CAAA,EAAA,~~CAAAlB~~,~~SAAGA~~,OAGrC,~~IAAC~~,~~IAkCGR,~~EAAqB,~~CACzBwB~~,KAAM,~~mBACNvB~~,WAAY,~~yBACZE~~,MAAO,~~oBACPI~~,QAAS,~~uBAGLoB~~,EAAsB,~~SAACX~~,~~EAAsCY~~,GACjE,MAAA,~~GAAArC~~,~~QAAUqC~~,aAAAA,EAAAA,~~EAASC~~,SAAU,~~QAAEtC~~,~~OAAIS~~,~~EAAmBgB~~,~~IAAIzB~~,~~QAAGqC~~,aAAAA,EAAAA,~~EAASE~~,SAAU,GAClF,~~EAEMhC~~,~~EAA0BiC~~,EAAOC,EAAPD,CAAc,SAAAE,GAAA,IAAGC,EAAKD,EAALC,MAAK,~~OAAA1C~~,EAAAA,EAAAA,~~EACnDmC~~,CAAAA,EAAAA,EAAoB,aAAc,~~CAAEE~~,OAAQ,MAAS,~~CACpDM~~,IAAK,~~QAENR~~,EAAoB,SAAW,~~CAC9BS~~,~~MAAOF~~,~~EAAMG~~,QAAQC,QAAQC,KAC7BC,WAAY,IACZC,~~QAASP~~,~~EAAMQ~~,QAAQ,EAAG,IAAK,~~KAEhCf~~,EAAoB,WAAa,~~CAChCc~~,~~QAASP~~,~~EAAMQ~~,QAAQ,EAAG,IAAK,KAC/BN,~~MAAOF~~,~~EAAMG~~,QAAQM,KAAKL,SAC3B,~~GAGGnB~~,~~EAAgBY~~,EAAO,~~SAAAa~~,GAAA,~~IAAG7C~~,~~EAAS6C~~,~~EAAT7C~~,~~UAAcL~~,~~EAAKmD~~,EAAAD,EAAAE,GAAA,~~OAAqB1C~~,~~EAAC2C~~,~~EAAO3B~~,EAAAA,~~KAAK1B~~,GAAK,GAAA,~~CAAEsD~~,QAAS,CAAEC,~~OAAQlD~~,KAAe,~~EAAxGgC~~,CAA0G,~~SAAAmB~~,GAAA,~~IAAGhB~~,~~EAAKgB~~,~~EAALhB~~,MAAK,~~OAAA1C~~,EAAAA,EAAA,CAAA,EAAA,~~MAAAD~~,OAC/~~H4D~~,EAAeC,SAAY,CAChCC,~~gBAAiBnB~~,~~EAAMG~~,QAAQiB,WAAWC,MAC1CnB,~~MAAOF~~,~~EAAMG~~,QAAQM,KAAKL,QAC1BG,QAAS,EACTe,SAAU,QACVC,SAAU,QACVC,~~aAAcxB~~,~~EAAMyB~~,MAAMD,aAC1BE,UAAkC,~~SAAvB1B~~,~~EAAMG~~,QAAQwB,KAAkB,kCAAoC,mCAC/EC,~~oBAAMvE~~,~~OAAe2C~~,~~EAAMG~~,QAAQ0B,~~iBACpCxE~~,~~OACM4D~~,~~EAAe9B~~,OAAU,~~CAC9Be~~,~~MAAOF~~,~~EAAMG~~,QAAQiB,WAAWC,OACjC,GAGUS,~~EAAuBjC~~,~~EAAOkC~~,~~EAAPlC~~,CAAwB,~~SAAAmC~~,GAAA,~~IAAGhC~~,~~EAAKgC~~,~~EAALhC~~,MAAK,MAAQ,~~CAC1EiC~~,SAAU,WACVC,OAAQ,EACRhC,~~MAAOF~~,~~EAAMG~~,QAAQC,QAAQC,KAC7BmB,aAAc,MACdW,OAAQ,OACRC,UAAW,0BACX,uBAAwB,CACtB,KAAM,CACJV,UAAkC,~~SAAvB1B~~,~~EAAMG~~,QAAQwB,KAAkB,mCAAqC,mCAElF,MAAO,CACLD,UAAkC,~~SAAvB1B~~,~~EAAMG~~,QAAQwB,KAAkB,oCAAsC,oCAEnF,OAAQ,CACND,UAAkC,~~SAAvB1B~~,~~EAAMG~~,QAAQwB,KAAkB,iCAAmC,kCAGnF"}
1	+ {"version":3,"file":"rich-tooltip.js","sources":["../../../src/components/rich-tooltip.tsx"],"sourcesContent":["import { useMemo } from 'react'\r\nimport { Box, Divider, Stack, Tooltip, Typography, styled, tooltipClasses } from '@mui/material'\r\nimport type { ReactNode } from 'react'\r\nimport type { BoxProps, TooltipProps } from '@mui/material'\r\nimport HelpOutlineIcon from '@mui/icons-material/HelpOutline'\r\n\r\nexport interface IRichTooltipPanelConfig {\r\n title: ReactNode\r\n content: ReactNode\r\n}\r\n\r\nexport interface IRichTooltipProps {\r\n panel?: IRichTooltipPanelConfig\r\n renderPanel?: () => ReactNode\r\n children: React.ReactNode\r\n /** Optional: manually set touch mode. If not provided, auto-detect touch device /\r\n isTouch?: boolean\r\n slots?: {\r\n tooltipProps?: Partial<TooltipProps>\r\n wrapperProps?: BoxProps\r\n }\r\n}\r\n\r\n/\r\n Detect if the current device supports touch\r\n */\r\nconst isTouchDevice = (): boolean => {\r\n if (typeof window === 'undefined') return false\r\n return (\r\n 'ontouchstart' in window \|\|\r\n navigator.maxTouchPoints > 0 \|\|\r\n // @ts-ignore\r\n (navigator.msMaxTouchPoints \|\| 0) > 0 \|\|\r\n window.matchMedia?.('(pointer: coarse)').matches\r\n )\r\n}\r\n\r\nexport const RichTooltip = (props: IRichTooltipProps) => {\r\n const { children, panel, renderPanel, slots, isTouch } = props\r\n\r\n // Auto-detect touch device if isTouch prop is not provided\r\n const shouldUseTouchMode = useMemo(() => {\r\n return isTouch !== undefined ? isTouch : isTouchDevice()\r\n }, [isTouch])\r\n\r\n const renderTitle = (value: ReactNode) => {\r\n if (!value) return null\r\n if (typeof value !== 'string') return value\r\n return (\r\n <Typography variant='subtitle1' className={richTooltipClasses.title}>\r\n {value}\r\n </Typography>\r\n )\r\n }\r\n\r\n const renderContent = (value: ReactNode) => {\r\n if (!value) return null\r\n if (typeof value !== 'string') return value\r\n return <Typography variant='body2'>{value}</Typography>\r\n }\r\n\r\n const renderTitlePanel = () => {\r\n if (renderPanel) return renderPanel()\r\n if (!panel) return <Typography variant='body2'>Please provide a panel configuration</Typography>\r\n return (\r\n <TooltipTitlePanelStyled className={richTooltipClasses.titlePanel}>\r\n {renderTitle(panel.title)}\r\n <Divider />\r\n <Box className={richTooltipClasses.content}>{renderContent(panel.content)}</Box>\r\n </TooltipTitlePanelStyled>\r\n )\r\n }\r\n\r\n // Merge touch-specific props with user-provided tooltip props\r\n const tooltipProps: Partial<TooltipProps> = {\r\n ...(shouldUseTouchMode ? { enterTouchDelay: 0, leaveTouchDelay: 3000 } : {}),\r\n ...slots?.tooltipProps\r\n }\r\n\r\n return (\r\n <TooltipStyled arrow placement='bottom' title={renderTitlePanel()} className={richTooltipClasses.root} {...tooltipProps}>\r\n <Box {...slots?.wrapperProps}>{children}</Box>\r\n </TooltipStyled>\r\n )\r\n}\r\n\r\nexport default RichTooltip\r\n\r\nconst richTooltipClasses = {\r\n root: 'RichTooltip-root',\r\n titlePanel: 'RichTooltip-titlePanel',\r\n title: 'RichTooltip-title',\r\n content: 'RichTooltip-content'\r\n}\r\n\r\nconst getRichTooltipClass = (key: keyof typeof richTooltipClasses, options?: { prefix?: string; suffix?: string }) => {\r\n return `${options?.prefix \|\| ''}.${richTooltipClasses[key]}${options?.suffix \|\| ''}`\r\n}\r\n\r\nconst TooltipTitlePanelStyled = styled(Stack)(({ theme }) => ({\r\n [getRichTooltipClass('titlePanel', { prefix: '&' })]: {\r\n gap: '6px'\r\n },\r\n [getRichTooltipClass('title')]: {\r\n color: theme.palette.primary.main,\r\n fontWeight: 700,\r\n padding: theme.spacing(1, 1.5, 0)\r\n },\r\n [getRichTooltipClass('content')]: {\r\n padding: theme.spacing(1, 1.5, 1.5),\r\n color: theme.palette.text.primary\r\n }\r\n}))\r\n\r\nconst TooltipStyled = styled(({ className, ...props }: TooltipProps) => <Tooltip {...props} classes={{ popper: className }} />)(({ theme }) => ({\r\n [`& .${tooltipClasses.tooltip}`]: {\r\n backgroundColor: theme.palette.background.paper,\r\n color: theme.palette.text.primary,\r\n padding: 0,\r\n minWidth: '360px',\r\n maxWidth: '450px',\r\n borderRadius: theme.shape.borderRadius,\r\n boxShadow: theme.palette.mode === 'dark' ? 'rgba(0, 0, 0, 0.4) 0px 6px 30px' : 'rgba(0, 0, 0, 0.08) 0px 6px 30px',\r\n border: `1px solid ${theme.palette.divider}`\r\n },\r\n [`& .${tooltipClasses.arrow}`]: {\r\n color: theme.palette.background.paper\r\n }\r\n}))\r\n\r\nexport const HelpOutlinePulseIcon = styled(HelpOutlineIcon)(({ theme }) => ({\r\n position: 'relative',\r\n zIndex: 1,\r\n color: theme.palette.primary.main,\r\n borderRadius: '50%',\r\n cursor: 'help',\r\n animation: 'pulseGlow 1.5s infinite',\r\n '@keyframes pulseGlow': {\r\n '0%': {\r\n boxShadow: theme.palette.mode === 'dark' ? '0 0 0 0 rgba(144, 202, 249, 0.3)' : '0 0 0 0 rgba(33, 150, 243, 0.3)'\r\n },\r\n '70%': {\r\n boxShadow: theme.palette.mode === 'dark' ? '0 0 0 10px rgba(144, 202, 249, 0)' : '0 0 0 10px rgba(33, 150, 243, 0)'\r\n },\r\n '100%': {\r\n boxShadow: theme.palette.mode === 'dark' ? '0 0 0 0 rgba(144, 202, 249, 0)' : '0 0 0 0 rgba(33, 150, 243, 0)'\r\n }\r\n }\r\n}))\r\n"],"names":["RichTooltip","props","value","children","panel","renderPanel","slots","isTouch","shouldUseTouchMode","useMemo","undefined","window","navigator","maxTouchPoints","msMaxTouchPoints","_window$matchMedia","_window","matchMedia","call","matches","renderContent","_jsx","Typography","variant","tooltipProps","_objectSpread","enterTouchDelay","leaveTouchDelay","TooltipStyled","arrow","placement","title","_jsxs","TooltipTitlePanelStyled","className","richTooltipClasses","titlePanel","Divider","Box","content","root","wrapperProps","getRichTooltipClass","key","options","concat","prefix","suffix","styled","Stack","_ref","theme","_defineProperty","gap","color","palette","primary","main","fontWeight","padding","spacing","text","_ref3","_objectWithoutProperties","_excluded","Tooltip","classes","popper","_ref4","tooltipClasses","tooltip","backgroundColor","background","paper","minWidth","maxWidth","borderRadius","shape","boxShadow","mode","border","divider","HelpOutlinePulseIcon","HelpOutlineIcon","_ref6","position","zIndex","cursor","animation"],"mappings":"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"}

package/dist/src/filter-bar/components/filter-input.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as o,objectSpread2 as n,slicedToArray as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as e,jsxs as r}from"react/jsx-runtime";import{useContext as i,useState as l,useMemo as a,useEffect as u,createRef as s}from"react";import{styled as c,Box as p,alpha as d,IconButton as m,InputBase as f,MenuList as v,MenuItem as h,Typography as b}from"@mui/material";import x from"@mui/material/ClickAwayListener";import{KeySpecial as I}from"../types.js";import{useFilterActions as g}from"./hooks.js";import{mapSpecialLabel as y}from"../helpers.js";import{FilterBarContext as C}from"../index.context.js";import{PopperCustom as S,PopperContent as F}from"./popper-custom.js";import{InputAdornmentRight as w,InputAdornmentLeft as D,getFieldsByMatches as j}from"./filter-input.units.js";import k from"@mui/icons-material/Search";function z(o){var c=N,d=function(o){var t=o.fields,e=o.enableQuickSearch,r=void 0===e||e,i=I.quickSearch,l=n({},t);if(r){var a=l[i],u=null!=a&&a.label?a.label:y[i],s=Object.assign({},l[i],{field:i,label:u});l[i]=s}else delete l[i];return n(n({},o),{},{fields:l})}(o);return function(I){var y,z,N,B,A,E=s(),O=s(),q=i(C),R=g(q),T=R.addFilter,W=R.replaceFilter,K=l(null),_=t(K,2),G=_[0],H=_[1],L=Boolean(G),M=l(""),Q=t(M,2),V=Q[0],J=Q[1],U=l("normal"),X=t(U,2),Y=X[0],Z=X[1],$=a(function(){var n,t=o.beforeInput,e=o.afterInput,r=Object.assign({},I.sx,null===(n=I.slots)||void 0===n||null===(n=n.rootProps)||void 0===n?void 0:n.sx);return{slots:Object.assign({},{beforeInput:t,afterInput:e},I.slots),rootSx:r}},[]),oo=o.minimalInput||(null===(y=I.slots)||void 0===y?void 0:y.minimalInput)||!1,no=l(oo),to=t(no,2),eo=to[0],ro=to[1];u(function(){eo||setTimeout(function(){var o;return null===(o=E.current)||void 0===o?void 0:o.focus()},0)},[eo]);var io=function(o){H(null),Z("normal"),o&&J(""),!oo||eo||""!==V&&!o||ro(!0)},lo=function(){var o;if(V){var n=null===(o=q.filterState.storeFilter)||void 0===o?void 0:o.quickSearch,t=(null==n?void 0:n.logic)||"or";W("quickSearch",{values:[V],logic:t}),io(!0)}},ao=function(){var o;oo&&eo?ro(!1):null===(o=E.current)||void 0===o||o.focus()},uo=[c.root];("focus"===Y||Boolean(V))&&uo.push(c.focus),oo&&(uo.push(c.minimalized),uo.push(eo?c.minimalCollapsed:c.minimalExpanded));var so,co=oo&&eo;return e(x,{onClickAway:function(o){io()},children:r(P,n(n({className:uo.join(" ")},null===(z=I.slots)||void 0===z?void 0:z.rootProps),{},{sx:$.rootSx,children:[co&&e(m,{size:"small",className:c.button,onClick:ao,"aria-label":"Open search",children:e(k,{fontSize:"small"})}),r("div",{className:c.rootInner,children:[(null===(N=$.slots)||void 0===N?void 0:N.beforeInput)||null,e(p,{className:c.beforeInput,ref:O}),e(f,{fullWidth:!0,className:c.input,autoComplete:"off",size:"small",inputRef:E,value:V,placeholder:"Search...",onKeyDown:function(o){var n=o.keyCode;if(13===n)o.stopPropagation(),o.preventDefault(),lo();else if(27===n){var t;o.stopPropagation(),o.preventDefault(),null==E||null===(t=E.current)||void 0===t||t.blur(),io(!0)}},onChange:function(o){var n=o.target.value||"";J(n);var t=Boolean(null==O?void 0:O.current)&&Boolean(n);n!==V&&H(t&&(null==O?void 0:O.current)||null)},onFocus:function(o){Z("focus"),Boolean(V)&&H((null==O?void 0:O.current)||o.currentTarget)},startAdornment:e(D,{onSearch:ao}),endAdornment:e(w,{hasKeyword:Boolean(V),onSubmit:lo,onClear:function(){return io(!0)}})}),(null===(B=$.slots)||void 0===B?void 0:B.afterInput)||null]}),e(S,n(n({anchorEl:G,open:L,placement:"bottom",transition:!0,disablePortal:!0},null===(A=$.slots)||void 0===A?void 0:A.popperProps),{},{children:(so=j(d,V),e(F,{title:"Filter Options",disableGutter:!0,onClose:function(){return H(null)},children:e(v,{className:c.menu,children:so.map(function(n,t){var e,i=n.field;if(!n)return null;var l=null!==(e=n.label)&&void 0!==e?e:i.toString(),a="".concat(l,': "').concat(V,'"');return r(h,{title:a,onClick:function(){return function(n){var t;if(V){var e=o.fields[n],r=null===(t=q.filterState.storeFilter)||void 0===t?void 0:t[n],i=(null==r?void 0:r.logic)||"or";null!=e&&e.singleValue?W(n,{values:[V],logic:i}):T(n,{values:[V],logic:i}),io(!0)}}(i)},className:c.menuItem,children:[r(b,{variant:"body2",sx:{fontWeight:500,flex:"0 0 auto"},children:[l,":"]}),r(b,{className:"",variant:"body2",color:"text.secondary",sx:{ml:1,flex:"1 1 auto"},noWrap:!0,children:['"',V,'"']})]},i.toString()+t)})})}))}))]}))})}}var N={root:"DinoFilterInput-root",rootInner:"DinoFilterInput-rootInner",minimalized:"DinoFilterInput-minimalized",minimalCollapsed:"DinoFilterInput-minimalCollapsed",minimalExpanded:"DinoFilterInput-minimalExpanded",button:"DinoFilterInput-button",input:"DinoFilterInput-input",focus:"DinoFilterInput-focus",beforeInput:"DinoFilterInput-beforeInput",menu:"DinoFilterInput-menu",menuItem:"DinoFilterInput-menuItem"},P=c(p)(function(n){var t=n.theme;return o(o(o(o(o(o(o({},"&.".concat(N.root),{height:"var(--dino-h-filter-input, 38px)",flex:1,border:"1px solid",borderColor:"transparent",borderRadius:t.shape.borderRadius,backgroundColor:t.palette.background.paper,transition:t.transitions.create(["border-color","box-shadow"])}),"&.".concat(N.root,":not(.").concat(N.minimalCollapsed,")"),o({borderColor:d(t.palette.divider,.12),"&:hover":{borderColor:t.palette.text.primary},"&.Mui-focused":{borderColor:t.palette.primary.main,boxShadow:"0 0 0 2px ".concat(t.palette.primary.main,"33")}},"&.".concat(N.focus),{borderColor:t.palette.primary.main,boxShadow:"0 0 0 2px ".concat(t.palette.primary.main,"33")})),".".concat(N.rootInner),{height:"100%",display:"flex",alignItems:"stretch"}),".".concat(N.beforeInput),{width:"1px",height:"100%",alignSelf:"stretch"}),".".concat(N.input),{padding:t.spacing(.5,1),input:{fontSize:"14px",padding:"4px 0 5px"}}),".".concat(N.button),{flex:"0 0 auto"}),"&.".concat(N.minimalized),o(o(o({display:"inline-flex",flex:"0 0 auto",gap:0,alignItems:"center"},".".concat(N.rootInner),{display:"none"}),"&.".concat(N.minimalCollapsed),{width:"var(--dino-w-filter-input, 30px)",transition:t.transitions.create("width"),border:"none"}),"&.".concat(N.minimalExpanded),o({width:"var(--dino-w-filter-input-expanded, 200px)",transition:t.transitions.create("width"),overflow:"visible"},".".concat(N.rootInner),{display:"flex"})))});export{z as createFilterInput,N as filterInputClasses};
+import{defineProperty as o,objectSpread2 as e,slicedToArray as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{useContext as i,useState as l,useMemo as a,createRef as u}from"react";import{styled as c,Box as s,alpha as p,InputBase as d,MenuList as f,MenuItem as m,Typography as v}from"@mui/material";import h from"@mui/material/ClickAwayListener";import{KeySpecial as b}from"../types.js";import{useFilterActions as g}from"./hooks.js";import{mapSpecialLabel as x}from"../helpers.js";import{FilterBarContext as I}from"../index.context.js";import{PopperCustom as S,PopperContent as y}from"./popper-custom.js";import{InputAdornmentRight as F,InputAdornmentLeft as j,getFieldsByMatches as k}from"./filter-input.units.js";import{MobileSearchButton as C}from"./filter-input.mobile.js";function D(o){var c=w,p=function(o){var r=o.fields,t=o.enableQuickSearch,n=void 0===t||t,i=b.quickSearch,l=e({},r);if(n){var a=l[i],u=null!=a&&a.label?a.label:x[i],c=Object.assign({},l[i],{field:i,label:u});l[i]=c}else delete l[i];return e(e({},o),{},{fields:l})}(o);return function(b){var x,D,w,B,N,q=u(),A=u(),O=i(I),R=g(O),W=R.addFilter,z=R.replaceFilter,K=l(null),T=r(K,2),_=T[0],E=T[1],G=Boolean(_),H=l(""),L=r(H,2),M=L[0],Q=L[1],V=l("normal"),J=r(V,2),U=J[0],X=J[1],Y=a(function(){var e,r=o.beforeInput,t=o.afterInput,n=Object.assign({},b.sx,null===(e=b.slots)||void 0===e||null===(e=e.rootProps)||void 0===e?void 0:e.sx);return{slots:Object.assign({},{beforeInput:r,afterInput:t},b.slots),rootSx:n}},[]),Z=o.minimalInput||(null===(x=b.slots)||void 0===x?void 0:x.minimalInput)||!1,$=function(o){E(null),X("normal"),o&&Q("")},oo=function(){var o;if(M){var e=null===(o=O.filterState.storeFilter)||void 0===o?void 0:o.quickSearch,r=(null==e?void 0:e.logic)||"or";z("quickSearch",{values:[M],logic:r}),$(!0)}};if(Z)return t(C,{placeholder:"Search...",onSearching:function(o){var e;if(o){var r=null===(e=O.filterState.storeFilter)||void 0===e?void 0:e.quickSearch,t=(null==r?void 0:r.logic)||"or";z("quickSearch",{values:[o],logic:t})}}});var eo,ro=[c.root];return("focus"===U||Boolean(M))&&ro.push(c.focus),t(h,{onClickAway:function(o){$()},children:n(P,e(e({className:ro.join(" ")},null===(D=b.slots)||void 0===D?void 0:D.rootProps),{},{sx:Y.rootSx,children:[n("div",{className:c.rootInner,children:[(null===(w=Y.slots)||void 0===w?void 0:w.beforeInput)||null,t(s,{className:c.beforeInput,ref:A}),t(d,{fullWidth:!0,className:c.input,autoComplete:"off",size:"small",inputRef:q,value:M,placeholder:"Search...",onKeyDown:function(o){var e=o.keyCode;if(13===e)o.stopPropagation(),o.preventDefault(),oo();else if(27===e){var r;o.stopPropagation(),o.preventDefault(),null==q||null===(r=q.current)||void 0===r||r.blur(),$(!0)}},onChange:function(o){var e=o.target.value||"";Q(e);var r=Boolean(null==A?void 0:A.current)&&Boolean(e);e!==M&&E(r&&(null==A?void 0:A.current)||null)},onFocus:function(o){X("focus"),Boolean(M)&&E((null==A?void 0:A.current)||o.currentTarget)},startAdornment:t(j,{onSearch:function(){var o;null===(o=q.current)||void 0===o||o.focus()}}),endAdornment:t(F,{hasKeyword:Boolean(M),onSubmit:oo,onClear:function(){return $(!0)}})}),(null===(B=Y.slots)||void 0===B?void 0:B.afterInput)||null]}),t(S,e(e({anchorEl:_,open:G,placement:"bottom",transition:!0,disablePortal:!0},null===(N=Y.slots)||void 0===N?void 0:N.popperProps),{},{children:(eo=k(p,M),t(y,{title:"Filter Options",disableGutter:!0,onClose:function(){return E(null)},children:t(f,{className:c.menu,children:eo.map(function(e,r){var t,i=e.field;if(!e)return null;var l=null!==(t=e.label)&&void 0!==t?t:i.toString(),a="".concat(l,': "').concat(M,'"');return n(m,{title:a,onClick:function(){return function(e){var r;if(M){var t=o.fields[e],n=null===(r=O.filterState.storeFilter)||void 0===r?void 0:r[e],i=(null==n?void 0:n.logic)||"or";null!=t&&t.singleValue?z(e,{values:[M],logic:i}):W(e,{values:[M],logic:i}),$(!0)}}(i)},className:c.menuItem,children:[n(v,{variant:"body2",sx:{fontWeight:500,flex:"0 0 auto"},children:[l,":"]}),n(v,{variant:"body2",color:"text.secondary",sx:{ml:1,flex:"1 1 auto"},noWrap:!0,children:['"',M,'"']})]},i.toString()+r)})})}))}))]}))})}}var w={root:"DinoFilterInput-root",rootInner:"DinoFilterInput-rootInner",button:"DinoFilterInput-button",input:"DinoFilterInput-input",focus:"DinoFilterInput-focus",beforeInput:"DinoFilterInput-beforeInput",menu:"DinoFilterInput-menu",menuItem:"DinoFilterInput-menuItem"},P=c(s)(function(e){var r=e.theme;return o(o(o(o(o(o(o(o({},"&.".concat(w.root),{height:"var(--dino-h-filter-input, 38px)",flex:1,border:"1px solid",borderColor:p(r.palette.divider,.12),borderRadius:r.shape.borderRadius,backgroundColor:r.palette.background.paper,transition:r.transitions.create(["border-color","box-shadow"])}),"&:hover",{borderColor:r.palette.text.primary}),"&.Mui-focused",{borderColor:r.palette.primary.main,boxShadow:"0 0 0 2px ".concat(r.palette.primary.main,"33")}),"&.".concat(w.focus),{borderColor:r.palette.primary.main,boxShadow:"0 0 0 2px ".concat(r.palette.primary.main,"33")}),".".concat(w.rootInner),{height:"100%",display:"flex",alignItems:"stretch"}),".".concat(w.beforeInput),{width:"1px",height:"100%",alignSelf:"stretch"}),".".concat(w.input),{padding:r.spacing(.5,1),input:{fontSize:"14px",padding:"4px 0 5px"}}),".".concat(w.button),{flex:"0 0 auto"})});export{D as createFilterInput,w as filterInputClasses};
 //# sourceMappingURL=filter-input.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"filter-input.js","sources":["../../../../src/filter-bar/components/filter-input.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useContext, useMemo, useState, useEffect } from 'react'\r\nimport { Box, InputBase, MenuItem, MenuList, styled, Typography, IconButton, alpha, Fade } from '@mui/material'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from './hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { PopperContent, PopperCustom } from './popper-custom'\r\nimport { getFieldsByMatches, InputAdornmentLeft, InputAdornmentRight } from './filter-input.units'\r\nimport SearchIcon from '@mui/icons-material/Search'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { InputBaseProps } from '@mui/material'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IFilterInputConfig, IFilterInputProps, IFilterInputSlots, TFieldInputConfigs } from './filter-input.types'\r\n\r\nconst initializeConfig = <T,>(config: IFilterInputConfig<T>): IFilterInputConfig<T> => {\r\n const { fields, enableQuickSearch = true } = config\r\n const qsKey = KeySpecial.quickSearch\r\n const mergedFields: TFieldInputConfigs<T> = { ...fields }\r\n\r\n if (enableQuickSearch) {\r\n const item = mergedFields[qsKey]\r\n const label = item?.label ? item.label : mapSpecialLabel[qsKey]\r\n const temp = Object.assign({}, mergedFields[qsKey], { field: qsKey, label })\r\n mergedFields[qsKey] = temp\r\n } else {\r\n delete mergedFields[qsKey]\r\n }\r\n\r\n return { ...config, fields: mergedFields }\r\n}\r\n\r\nexport function createFilterInput<T>(config: IFilterInputConfig<T>) {\r\n const classes = filterInputClasses\r\n const initialConfig = initializeConfig(config)\r\n\r\n const FilterInput: FC<IFilterInputProps<T>> = (props) => {\r\n const refInput = createRef<HTMLInputElement>()\r\n const refBeforeInput = createRef<HTMLElement>()\r\n\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const { addFilter, replaceFilter } = useFilterActions<T>(context)\r\n\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement \| null>(null)\r\n const isOpen = Boolean(anchorEl)\r\n\r\n const [keywords, setKeywords] = useState<string>('')\r\n const [status, setStatus] = useState<'focus' \| 'normal'>('normal')\r\n\r\n const mergedConfig = useMemo(() => {\r\n const { beforeInput, afterInput } = config\r\n const mergedRootSx = Object.assign({}, props.sx, props.slots?.rootProps?.sx)\r\n const mergedSlots: IFilterInputSlots = Object.assign({}, { beforeInput, afterInput }, props.slots)\r\n return { slots: mergedSlots, rootSx: mergedRootSx }\r\n }, [])\r\n\r\n const isMinimal = config.minimalInput \|\| props.slots?.minimalInput \|\| false\r\n const [isCollapsed, setIsCollapsed] = useState<boolean>(isMinimal)\r\n\r\n useEffect(() => {\r\n if (!isCollapsed) {\r\n // focus input after expansion (next tick)\r\n setTimeout(() => refInput.current?.focus(), 0)\r\n }\r\n }, [isCollapsed])\r\n\r\n const handleClose = (isClear?: boolean) => {\r\n setAnchorEl(null)\r\n setStatus('normal')\r\n if (isClear) setKeywords('')\r\n if (isMinimal && !isCollapsed && (keywords === '' \|\| isClear)) {\r\n setIsCollapsed(true)\r\n }\r\n }\r\n\r\n const handleSubmitSearch = () => {\r\n if (!keywords) return\r\n const qsField = context.filterState.storeFilter?.quickSearch\r\n const logic = qsField?.logic \|\| 'or'\r\n replaceFilter('quickSearch', { values: [keywords], logic })\r\n handleClose(true)\r\n }\r\n\r\n const handleKeyDown: InputBaseProps['onKeyDown'] = (event) => {\r\n const keyCode: number = event.keyCode\r\n if (keyCode === 13) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n handleSubmitSearch()\r\n } else if (keyCode === 27) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n refInput?.current?.blur()\r\n handleClose(true)\r\n }\r\n }\r\n\r\n const handleKeywordChange: InputBaseProps['onChange'] = (event) => {\r\n const finalValue = event.target.value \|\| ''\r\n setKeywords(finalValue)\r\n\r\n const isOpenPopper = Boolean(refBeforeInput?.current) && Boolean(finalValue)\r\n if (finalValue !== keywords) setAnchorEl(isOpenPopper ? refBeforeInput?.current \|\| null : null)\r\n }\r\n\r\n const handleFocus = (event: React.FocusEvent<HTMLElement>) => {\r\n setStatus('focus')\r\n if (!Boolean(keywords)) return\r\n setAnchorEl(refBeforeInput?.current \|\| event.currentTarget)\r\n }\r\n\r\n const handleClickMenuItem = (field: TFieldType<T>) => {\r\n if (!keywords) return\r\n const fieldConfig = config.fields[field]\r\n const fieldValue = context.filterState.storeFilter?.[field]\r\n const logic = fieldValue?.logic \|\| 'or'\r\n if (fieldConfig?.singleValue) {\r\n replaceFilter(field, { values: [keywords], logic })\r\n } else {\r\n addFilter(field, { values: [keywords], logic })\r\n }\r\n handleClose(true)\r\n }\r\n\r\n const handleClickSearch = () => {\r\n if (isMinimal && isCollapsed) {\r\n setIsCollapsed(false)\r\n return\r\n }\r\n refInput.current?.focus()\r\n }\r\n\r\n const handleClickAway = (event: MouseEvent \| TouchEvent) => {\r\n handleClose()\r\n }\r\n\r\n const renderContent = () => {\r\n const fieldsList = getFieldsByMatches(initialConfig, keywords)\r\n return (\r\n <PopperContent title='Filter Options' disableGutter onClose={() => setAnchorEl(null)}>\r\n <MenuList className={classes.menu}>\r\n {fieldsList.map((x, i) => {\r\n const field = x.field\r\n if (!x) return null\r\n const label = x.label ?? field.toString()\r\n const title = `${label}: \"${keywords}\"`\r\n return (\r\n <MenuItem title={title} key={field.toString() + i} onClick={() => handleClickMenuItem(field)} className={classes.menuItem}>\r\n <Typography variant='body2' sx={{ fontWeight: 500, flex: '0 0 auto' }}>\r\n {label}:\r\n </Typography>\r\n <Typography className='' variant='body2' color='text.secondary' sx={{ ml: 1, flex: '1 1 auto' }} noWrap>\r\n \"{keywords}\"\r\n </Typography>\r\n </MenuItem>\r\n )\r\n })}\r\n </MenuList>\r\n </PopperContent>\r\n )\r\n }\r\n\r\n const rootClass = [classes.root]\r\n if (status === 'focus' \|\| Boolean(keywords)) rootClass.push(classes.focus)\r\n if (isMinimal) {\r\n rootClass.push(classes.minimalized)\r\n rootClass.push(isCollapsed ? classes.minimalCollapsed : classes.minimalExpanded)\r\n }\r\n\r\n const isIconOnly = isMinimal && isCollapsed\r\n\r\n return (\r\n <ClickAwayListener onClickAway={handleClickAway}>\r\n <FilterInputStyled className={rootClass.join(' ')} {...props.slots?.rootProps} sx={mergedConfig.rootSx}>\r\n {isIconOnly && (\r\n <IconButton size='small' className={classes.button} onClick={handleClickSearch} aria-label='Open search'>\r\n <SearchIcon fontSize='small' />\r\n </IconButton>\r\n )}\r\n\r\n <div className={classes.rootInner}>\r\n {mergedConfig.slots?.beforeInput \|\| null}\r\n <Box className={classes.beforeInput} ref={refBeforeInput} />\r\n <InputBase\r\n fullWidth\r\n className={classes.input}\r\n autoComplete='off'\r\n size='small'\r\n inputRef={refInput}\r\n value={keywords}\r\n placeholder='Search...'\r\n onKeyDown={handleKeyDown}\r\n onChange={handleKeywordChange}\r\n onFocus={handleFocus}\r\n startAdornment={<InputAdornmentLeft onSearch={handleClickSearch} />}\r\n endAdornment={<InputAdornmentRight hasKeyword={Boolean(keywords)} onSubmit={handleSubmitSearch} onClear={() => handleClose(true)} />}\r\n />\r\n {mergedConfig.slots?.afterInput \|\| null}\r\n </div>\r\n <PopperCustom anchorEl={anchorEl} open={isOpen} placement='bottom' transition disablePortal {...mergedConfig.slots?.popperProps}>\r\n {renderContent()}\r\n </PopperCustom>\r\n </FilterInputStyled>\r\n </ClickAwayListener>\r\n )\r\n }\r\n return FilterInput\r\n}\r\n\r\nexport const filterInputClasses = {\r\n root: 'DinoFilterInput-root',\r\n rootInner: 'DinoFilterInput-rootInner',\r\n minimalized: 'DinoFilterInput-minimalized',\r\n minimalCollapsed: 'DinoFilterInput-minimalCollapsed',\r\n minimalExpanded: 'DinoFilterInput-minimalExpanded',\r\n button: 'DinoFilterInput-button',\r\n input: 'DinoFilterInput-input',\r\n focus: 'DinoFilterInput-focus',\r\n beforeInput: 'DinoFilterInput-beforeInput',\r\n menu: 'DinoFilterInput-menu',\r\n menuItem: 'DinoFilterInput-menuItem',\r\n menuItemKey: 'DinoFilterInput-menuItemKey'\r\n}\r\n\r\nconst FilterInputStyled = styled(Box)(({ theme }) => ({\r\n // Note: we use CSS variable\r\n // '--dino-h-filter-input': '38px',\r\n\r\n [`&.${filterInputClasses.root}`]: {\r\n height: 'var(--dino-h-filter-input, 38px)',\r\n flex: 1,\r\n border: '1px solid',\r\n borderColor: 'transparent',\r\n borderRadius: theme.shape.borderRadius,\r\n backgroundColor: theme.palette.background.paper,\r\n transition: theme.transitions.create(['border-color', 'box-shadow'])\r\n },\r\n [`&.${filterInputClasses.root}:not(.${filterInputClasses.minimalCollapsed})`]: {\r\n borderColor: alpha(theme.palette.divider, 0.12),\r\n '&:hover': { borderColor: theme.palette.text.primary },\r\n '&.Mui-focused': {\r\n borderColor: theme.palette.primary.main,\r\n boxShadow: `0 0 0 2px ${theme.palette.primary.main}33`\r\n },\r\n [`&.${filterInputClasses.focus}`]: {\r\n borderColor: theme.palette.primary.main,\r\n boxShadow: `0 0 0 2px ${theme.palette.primary.main}33`\r\n }\r\n },\r\n [`.${filterInputClasses.rootInner}`]: { height: '100%', display: 'flex', alignItems: 'stretch' },\r\n [`.${filterInputClasses.beforeInput}`]: { width: '1px', height: '100%', alignSelf: 'stretch' },\r\n [`.${filterInputClasses.input}`]: {\r\n padding: theme.spacing(0.5, 1),\r\n input: { fontSize: '14px', padding: '4px 0 5px' }\r\n },\r\n [`.${filterInputClasses.button}`]: { flex: '0 0 auto' },\r\n // Minimal style: collapsed (icon-only) and expanded (200px)\r\n [`&.${filterInputClasses.minimalized}`]: {\r\n display: 'inline-flex',\r\n flex: '0 0 auto',\r\n gap: 0,\r\n alignItems: 'center',\r\n [`.${filterInputClasses.rootInner}`]: {\r\n display: 'none' // hide input and adornments when minimalized, only show the search icon button\r\n },\r\n [`&.${filterInputClasses.minimalCollapsed}`]: {\r\n width: 'var(--dino-w-filter-input, 30px)',\r\n transition: theme.transitions.create('width'),\r\n border: 'none'\r\n },\r\n [`&.${filterInputClasses.minimalExpanded}`]: {\r\n width: 'var(--dino-w-filter-input-expanded, 200px)',\r\n transition: theme.transitions.create('width'),\r\n overflow: 'visible',\r\n [`.${filterInputClasses.rootInner}`]: {\r\n display: 'flex' // show input and adornments when expanded\r\n }\r\n }\r\n }\r\n}))\r\n"],"names":["createFilterInput","config","classes","filterInputClasses","initialConfig","fields","_config$enableQuickSe","enableQuickSearch","qsKey","KeySpecial","quickSearch","mergedFields","_objectSpread","item","label","mapSpecialLabel","temp","Object","assign","field","initializeConfig","props","_props$slots2","_props$slots3","_mergedConfig$slots","_mergedConfig$slots2","_mergedConfig$slots3","refInput","createRef","refBeforeInput","context","useContext","FilterBarContext","_useFilterActions","useFilterActions","addFilter","replaceFilter","_useState","useState","_useState2","_slicedToArray","anchorEl","setAnchorEl","isOpen","Boolean","_useState3","_useState4","keywords","setKeywords","_useState5","_useState6","status","setStatus","mergedConfig","useMemo","_props$slots","beforeInput","afterInput","mergedRootSx","sx","slots","rootProps","rootSx","isMinimal","minimalInput","_useState7","_useState8","isCollapsed","setIsCollapsed","useEffect","setTimeout","_refInput$current","current","focus","handleClose","isClear","handleSubmitSearch","_context$filterState$","qsField","filterState","storeFilter","logic","values","handleClickSearch","_refInput$current3","rootClass","root","push","minimalized","minimalCollapsed","minimalExpanded","fieldsList","isIconOnly","_jsx","ClickAwayListener","onClickAway","event","children","_jsxs","FilterInputStyled","className","join","IconButton","size","button","onClick","SearchIcon","fontSize","rootInner","Box","ref","InputBase","fullWidth","input","autoComplete","inputRef","value","placeholder","onKeyDown","keyCode","stopPropagation","preventDefault","_refInput$current2","blur","onChange","finalValue","target","isOpenPopper","onFocus","currentTarget","startAdornment","InputAdornmentLeft","onSearch","endAdornment","InputAdornmentRight","hasKeyword","onSubmit","onClear","PopperCustom","open","placement","transition","disablePortal","popperProps","getFieldsByMatches","PopperContent","title","disableGutter","onClose","MenuList","menu","map","x","i","_x$label","toString","concat","MenuItem","_context$filterState$2","fieldConfig","fieldValue","singleValue","handleClickMenuItem","menuItem","Typography","variant","fontWeight","flex","color","ml","noWrap","styled","_ref","theme","_defineProperty","height","border","borderColor","borderRadius","shape","backgroundColor","palette","background","paper","transitions","create","alpha","divider","text","primary","main","boxShadow","display","alignItems","width","alignSelf","padding","spacing","gap","overflow"],"mappings":"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"}
1	+ {"version":3,"file":"filter-input.js","sources":["../../../../src/filter-bar/components/filter-input.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useContext, useMemo, useState } from 'react'\r\nimport { Box, InputBase, MenuItem, MenuList, styled, Typography, alpha } from '@mui/material'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from './hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { PopperContent, PopperCustom } from './popper-custom'\r\nimport { getFieldsByMatches, InputAdornmentLeft, InputAdornmentRight } from './filter-input.units'\r\nimport MobileSearchButton from './filter-input.mobile'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { InputBaseProps } from '@mui/material'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IFilterInputConfig, IFilterInputProps, IFilterInputSlots, TFieldInputConfigs } from './filter-input.types'\r\n\r\nconst initializeConfig = <T,>(config: IFilterInputConfig<T>): IFilterInputConfig<T> => {\r\n const { fields, enableQuickSearch = true } = config\r\n const qsKey = KeySpecial.quickSearch\r\n const mergedFields: TFieldInputConfigs<T> = { ...fields }\r\n\r\n if (enableQuickSearch) {\r\n const item = mergedFields[qsKey]\r\n const label = item?.label ? item.label : mapSpecialLabel[qsKey]\r\n const temp = Object.assign({}, mergedFields[qsKey], { field: qsKey, label })\r\n mergedFields[qsKey] = temp\r\n } else {\r\n delete mergedFields[qsKey]\r\n }\r\n\r\n return { ...config, fields: mergedFields }\r\n}\r\n\r\nexport function createFilterInput<T>(config: IFilterInputConfig<T>) {\r\n const classes = filterInputClasses\r\n const initialConfig = initializeConfig(config)\r\n\r\n const FilterInput: FC<IFilterInputProps<T>> = (props) => {\r\n const refInput = createRef<HTMLInputElement>()\r\n const refBeforeInput = createRef<HTMLElement>()\r\n\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const { addFilter, replaceFilter } = useFilterActions<T>(context)\r\n\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement \| null>(null)\r\n const isOpen = Boolean(anchorEl)\r\n\r\n const [keywords, setKeywords] = useState<string>('')\r\n const [status, setStatus] = useState<'focus' \| 'normal'>('normal')\r\n\r\n const mergedConfig = useMemo(() => {\r\n const { beforeInput, afterInput } = config\r\n const mergedRootSx = Object.assign({}, props.sx, props.slots?.rootProps?.sx)\r\n const mergedSlots: IFilterInputSlots = Object.assign({}, { beforeInput, afterInput }, props.slots)\r\n return { slots: mergedSlots, rootSx: mergedRootSx }\r\n }, [])\r\n\r\n const isMinimal = config.minimalInput \|\| props.slots?.minimalInput \|\| false\r\n\r\n const handleClose = (isClear?: boolean) => {\r\n setAnchorEl(null)\r\n setStatus('normal')\r\n if (isClear) setKeywords('')\r\n }\r\n\r\n const handleSubmitSearch = () => {\r\n if (!keywords) return\r\n const qsField = context.filterState.storeFilter?.quickSearch\r\n const logic = qsField?.logic \|\| 'or'\r\n replaceFilter('quickSearch', { values: [keywords], logic })\r\n handleClose(true)\r\n }\r\n\r\n const handleSubmitMobileSearch = (keyword: string) => {\r\n if (!keyword) return\r\n const qsField = context.filterState.storeFilter?.quickSearch\r\n const logic = qsField?.logic \|\| 'or'\r\n replaceFilter('quickSearch', { values: [keyword], logic })\r\n }\r\n\r\n const handleKeyDown: InputBaseProps['onKeyDown'] = (event) => {\r\n const keyCode: number = event.keyCode\r\n if (keyCode === 13) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n handleSubmitSearch()\r\n } else if (keyCode === 27) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n refInput?.current?.blur()\r\n handleClose(true)\r\n }\r\n }\r\n\r\n const handleKeywordChange: InputBaseProps['onChange'] = (event) => {\r\n const finalValue = event.target.value \|\| ''\r\n setKeywords(finalValue)\r\n\r\n const isOpenPopper = Boolean(refBeforeInput?.current) && Boolean(finalValue)\r\n if (finalValue !== keywords) setAnchorEl(isOpenPopper ? refBeforeInput?.current \|\| null : null)\r\n }\r\n\r\n const handleFocus = (event: React.FocusEvent<HTMLElement>) => {\r\n setStatus('focus')\r\n if (!Boolean(keywords)) return\r\n setAnchorEl(refBeforeInput?.current \|\| event.currentTarget)\r\n }\r\n\r\n const handleClickMenuItem = (field: TFieldType<T>) => {\r\n if (!keywords) return\r\n const fieldConfig = config.fields[field]\r\n const fieldValue = context.filterState.storeFilter?.[field]\r\n const logic = fieldValue?.logic \|\| 'or'\r\n if (fieldConfig?.singleValue) {\r\n replaceFilter(field, { values: [keywords], logic })\r\n } else {\r\n addFilter(field, { values: [keywords], logic })\r\n }\r\n handleClose(true)\r\n }\r\n\r\n const handleClickSearch = () => {\r\n refInput.current?.focus()\r\n }\r\n\r\n const handleClickAway = (event: MouseEvent \| TouchEvent) => {\r\n handleClose()\r\n }\r\n\r\n const renderContent = () => {\r\n const fieldsList = getFieldsByMatches(initialConfig, keywords)\r\n return (\r\n <PopperContent title='Filter Options' disableGutter onClose={() => setAnchorEl(null)}>\r\n <MenuList className={classes.menu}>\r\n {fieldsList.map((x, i) => {\r\n const field = x.field\r\n if (!x) return null\r\n const label = x.label ?? field.toString()\r\n const title = `${label}: \"${keywords}\"`\r\n return (\r\n <MenuItem title={title} key={field.toString() + i} onClick={() => handleClickMenuItem(field)} className={classes.menuItem}>\r\n <Typography variant='body2' sx={{ fontWeight: 500, flex: '0 0 auto' }}>\r\n {label}:\r\n </Typography>\r\n <Typography variant='body2' color='text.secondary' sx={{ ml: 1, flex: '1 1 auto' }} noWrap>\r\n \"{keywords}\"\r\n </Typography>\r\n </MenuItem>\r\n )\r\n })}\r\n </MenuList>\r\n </PopperContent>\r\n )\r\n }\r\n\r\n if (isMinimal) return <MobileSearchButton placeholder='Search...' onSearching={handleSubmitMobileSearch} />\r\n\r\n const rootClass = [classes.root]\r\n if (status === 'focus' \|\| Boolean(keywords)) rootClass.push(classes.focus)\r\n\r\n return (\r\n <ClickAwayListener onClickAway={handleClickAway}>\r\n <FilterInputStyled className={rootClass.join(' ')} {...props.slots?.rootProps} sx={mergedConfig.rootSx}>\r\n <div className={classes.rootInner}>\r\n {mergedConfig.slots?.beforeInput \|\| null}\r\n <Box className={classes.beforeInput} ref={refBeforeInput} />\r\n <InputBase\r\n fullWidth\r\n className={classes.input}\r\n autoComplete='off'\r\n size='small'\r\n inputRef={refInput}\r\n value={keywords}\r\n placeholder='Search...'\r\n onKeyDown={handleKeyDown}\r\n onChange={handleKeywordChange}\r\n onFocus={handleFocus}\r\n startAdornment={<InputAdornmentLeft onSearch={handleClickSearch} />}\r\n endAdornment={<InputAdornmentRight hasKeyword={Boolean(keywords)} onSubmit={handleSubmitSearch} onClear={() => handleClose(true)} />}\r\n />\r\n {mergedConfig.slots?.afterInput \|\| null}\r\n </div>\r\n <PopperCustom anchorEl={anchorEl} open={isOpen} placement='bottom' transition disablePortal {...mergedConfig.slots?.popperProps}>\r\n {renderContent()}\r\n </PopperCustom>\r\n </FilterInputStyled>\r\n </ClickAwayListener>\r\n )\r\n }\r\n return FilterInput\r\n}\r\n\r\nexport const filterInputClasses = {\r\n root: 'DinoFilterInput-root',\r\n rootInner: 'DinoFilterInput-rootInner',\r\n button: 'DinoFilterInput-button',\r\n input: 'DinoFilterInput-input',\r\n focus: 'DinoFilterInput-focus',\r\n beforeInput: 'DinoFilterInput-beforeInput',\r\n menu: 'DinoFilterInput-menu',\r\n menuItem: 'DinoFilterInput-menuItem',\r\n menuItemKey: 'DinoFilterInput-menuItemKey'\r\n}\r\n\r\nconst FilterInputStyled = styled(Box)(({ theme }) => ({\r\n // Note: we use CSS variable\r\n // '--dino-h-filter-input': '38px',\r\n [`&.${filterInputClasses.root}`]: {\r\n height: 'var(--dino-h-filter-input, 38px)',\r\n flex: 1,\r\n border: '1px solid',\r\n borderColor: alpha(theme.palette.divider, 0.12),\r\n borderRadius: theme.shape.borderRadius,\r\n backgroundColor: theme.palette.background.paper,\r\n transition: theme.transitions.create(['border-color', 'box-shadow'])\r\n },\r\n '&:hover': { borderColor: theme.palette.text.primary },\r\n '&.Mui-focused': {\r\n borderColor: theme.palette.primary.main,\r\n boxShadow: `0 0 0 2px ${theme.palette.primary.main}33`\r\n },\r\n [`&.${filterInputClasses.focus}`]: {\r\n borderColor: theme.palette.primary.main,\r\n boxShadow: `0 0 0 2px ${theme.palette.primary.main}33`\r\n },\r\n [`.${filterInputClasses.rootInner}`]: { height: '100%', display: 'flex', alignItems: 'stretch' },\r\n [`.${filterInputClasses.beforeInput}`]: { width: '1px', height: '100%', alignSelf: 'stretch' },\r\n [`.${filterInputClasses.input}`]: {\r\n padding: theme.spacing(0.5, 1),\r\n input: { fontSize: '14px', padding: '4px 0 5px' }\r\n },\r\n [`.${filterInputClasses.button}`]: { flex: '0 0 auto' }\r\n}))\r\n"],"names":["createFilterInput","config","classes","filterInputClasses","initialConfig","fields","_config$enableQuickSe","enableQuickSearch","qsKey","KeySpecial","quickSearch","mergedFields","_objectSpread","item","label","mapSpecialLabel","temp","Object","assign","field","initializeConfig","props","_props$slots2","_props$slots3","_mergedConfig$slots","_mergedConfig$slots2","_mergedConfig$slots3","refInput","createRef","refBeforeInput","context","useContext","FilterBarContext","_useFilterActions","useFilterActions","addFilter","replaceFilter","_useState","useState","_useState2","_slicedToArray","anchorEl","setAnchorEl","isOpen","Boolean","_useState3","_useState4","keywords","setKeywords","_useState5","_useState6","status","setStatus","mergedConfig","useMemo","_props$slots","beforeInput","afterInput","mergedRootSx","sx","slots","rootProps","rootSx","isMinimal","minimalInput","handleClose","isClear","handleSubmitSearch","_context$filterState$","qsField","filterState","storeFilter","logic","values","_jsx","MobileSearchButton","placeholder","onSearching","keyword","_context$filterState$2","fieldsList","rootClass","root","push","focus","ClickAwayListener","onClickAway","event","children","_jsxs","FilterInputStyled","className","join","rootInner","Box","ref","InputBase","fullWidth","input","autoComplete","size","inputRef","value","onKeyDown","keyCode","stopPropagation","preventDefault","_refInput$current","current","blur","onChange","finalValue","target","isOpenPopper","onFocus","currentTarget","startAdornment","InputAdornmentLeft","onSearch","_refInput$current2","endAdornment","InputAdornmentRight","hasKeyword","onSubmit","onClear","PopperCustom","open","placement","transition","disablePortal","popperProps","getFieldsByMatches","PopperContent","title","disableGutter","onClose","MenuList","menu","map","x","i","_x$label","toString","concat","MenuItem","onClick","_context$filterState$3","fieldConfig","fieldValue","singleValue","handleClickMenuItem","menuItem","Typography","variant","fontWeight","flex","color","ml","noWrap","button","styled","_ref","theme","_defineProperty","height","border","borderColor","alpha","palette","divider","borderRadius","shape","backgroundColor","background","paper","transitions","create","text","primary","main","boxShadow","display","alignItems","width","alignSelf","padding","spacing","fontSize"],"mappings":"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"}

package/dist/src/filter-bar/components/filter-input.mobile.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{defineProperty as r,slicedToArray as e,toConsumableArray as n}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as t,Fragment as i,jsx as o}from"react/jsx-runtime";import{useState as a,useRef as l,useEffect as c,useMemo as u}from"react";import{styled as s,Box as d,InputBase as p,SwipeableDrawer as h,Tooltip as m,IconButton as f,Stack as v,Typography as g}from"@mui/material";import y from"@mui/icons-material/Search";import x from"@mui/icons-material/ChevronLeft";import b from"@mui/icons-material/Clear";import C from"@mui/icons-material/NorthWest";import{InputAdornmentRight as S}from"./filter-input.units.js";var w="dino_search_history_v1";s(d)(function(r){var e=r.theme;return{padding:e.spacing(2),display:"flex",flexDirection:"column",gap:e.spacing(1)}}),s("div")(function(r){return{display:"flex",alignItems:"center",gap:r.theme.spacing(1)}});var R=function(r){var e=r.placeholder,n=void 0===e?"Search...":e,t=r.inputRef,i=r.hasKeyword,a=r.onEnter,u=r.onChange,s=r.onClear,d=l(null),p=null!=t?t:d;return c(function(){var r=setTimeout(function(){var r;return null===(r=p.current)\|\|void 0===r?void 0:r.focus()},50);return function(){try{var e;null===(e=p.current)\|\|void 0===e\|\|e.blur()}catch(r){}clearTimeout(r)}},[p]),o(k,{fullWidth:!0,inputRef:p,placeholder:n,inputProps:{autoCapitalize:"off",autoComplete:"off"},onKeyDown:function(r){"Enter"===r.key&&(r.preventDefault(),null==a\|\|a())},onChange:function(r){return null==u?void 0:u(r.target.value)},endAdornment:o(S,{hasKeyword:i,onSubmit:a,onClear:s})})},k=s(p)(function(r){var e=r.theme;return{border:"1px solid ".concat(e.palette.divider),borderRadius:e.shape.borderRadius,padding:e.spacing(.5,1)}}),z=function(r){var e=r.history,n=r.onSelect,i=r.onFillInput,a=r.onClear;return e&&0!==e.length?t(D,{className:I.root,children:[t(v,{direction:"row",justifyContent:"space-between",alignItems:"center",sx:{mb:1},children:[o(g,{variant:"subtitle2",fontWeight:600,children:"Recent Searches"}),a&&o(m,{title:"Clear history",arrow:!0,children:o(f,{size:"small",onClick:a,children:o(b,{fontSize:"small"})})})]}),o(v,{className:I.items,children:e.map(function(r,e){return t(d,{className:I.item,onClick:function(){return n(r)},sx:{cursor:"pointer"},children:[o(g,{variant:"body2",noWrap:!0,sx:{flex:1},children:r}),o(m,{title:"Fill input",arrow:!0,children:o(f,{size:"small",sx:{color:"text.secondary","&:hover":{color:"text.primary"}},onClick:function(e){e.stopPropagation(),null==i\|\|i(r)},children:o(C,{fontSize:"small"})})})]},e)})})]}):o(A,{children:o(g,{variant:"body2",color:"textSecondary",children:"No recent searches."})})},I={root:"DinoSearchHistory-root",items:"DinoSearchHistory-items",item:"DinoSearchHistory-item"},D=s(d)(function(e){var n=e.theme;return r(r({padding:"8px 16px",marginTop:1},".".concat(I.items),{}),".".concat(I.item),{display:"flex",alignItems:"center",gap:n.spacing(1),padding:n.spacing(.5,1),marginBottom:n.spacing(.5),borderRadius:n.shape.borderRadius,backgroundColor:"rgba(0,0,0,0.02)","&:hover":{backgroundColor:"rgba(0,0,0,0.04)"},"&:first-of-type":{marginTop:0}})}),A=s(d)(function(r){var e=r.theme;return{padding:e.spacing(2),textAlign:"center",color:e.palette.text.secondary,border:"0.5px dashed ".concat(e.palette.divider),borderRadius:e.shape.borderRadius,display:"flex",flexDirection:"column",alignItems:"center",gap:e.spacing(1),margin:e.spacing(1,2)}}),T=function(r){var s=r.onSearching,p=r.placeholder,h=a(!1),b=e(h,2),C=b[0],S=b[1],k=a([]),I=e(k,2),D=I[0],A=I[1],T=a(""),j=e(T,2),B=j[0],H=j[1],P=l(null);c(function(){if("undefined"!=typeof window)try{var r=localStorage.getItem(w);if(r){var e=JSON.parse(r);Array.isArray(e)&&A(e)}}catch(r){}},[]);var W=function(r){var e=r.trim();e&&A(function(r){var t=[e].concat(n(r.filter(function(r){return r!==e}))).slice(0,20);try{localStorage.setItem(w,JSON.stringify(t))}catch(r){}return t})},_=u(function(){var r=(B\|\|"").trim();return r?D.filter(function(e){return e.toLowerCase().includes(r.toLowerCase())}).slice(0,5):D.slice(0,5)},[B,D]),E=function(){var r,e=(null===(r=P.current)\|\|void 0===r\|\|null===(r=r.value)\|\|void 0===r?void 0:r.trim())\|\|"";e&&(W(e),null==s\|\|s(e),K())},K=function(){try{var r;null===(r=P.current)\|\|void 0===r\|\|r.blur()}catch(r){}S(!1)},L=function(){S(!0),H(""),P.current&&(P.current.value="")};return t(i,{children:[o(m,{title:"Search",arrow:!0,children:o(f,{size:"small",onClick:L,"aria-label":"Open search",children:o(y,{})})}),t(N,{anchor:"bottom",open:C,onClose:K,onOpen:L,disableBackdropTransition:!1,disableDiscovery:!1,swipeAreaWidth:20,children:[o(d,{sx:{display:"flex",justifyContent:"center",py:1},children:o(d,{sx:{width:40,height:4,borderRadius:2,backgroundColor:"divider"}})}),t(v,{gap:1,style:{flexDirection:"row",alignItems:"center",padding:"0 8px"},children:[o(m,{title:"Back",arrow:!0,children:o(f,{size:"small",onClick:function(){H("");try{var r;null===(r=P.current)\|\|void 0===r\|\|r.blur()}catch(r){}S(!1)},children:o(x,{fontSize:"small"})})}),o(R,{placeholder:p,inputRef:P,hasKeyword:Boolean(B),onEnter:E,onChange:H,onClear:function(){var r;P.current&&(P.current.value=""),H(""),null===(r=P.current)\|\|void 0===r\|\|r.focus()}}),o(m,{title:"Search",arrow:!0,children:o(f,{size:"small",onClick:E,"aria-label":"Apply search",children:o(y,{fontSize:"small"})})})]}),o(g,{variant:"caption",color:"textSecondary",sx:{px:2,mt:1},children:"Enter the value to search for and hit enter or click the enter icon to apply."}),o(z,{history:_,onSelect:function(r){P.current&&(P.current.value=r),H(r),W(r),null==s\|\|s(r),K()},onFillInput:function(r){var e;P.current&&(P.current.value=r),H(r),null===(e=P.current)\|\|void 0===e\|\|e.focus()},onClear:function(){A([]);try{localStorage.removeItem(w)}catch(r){}}})]})]})},N=s(h)(function(r){return{zIndex:r.theme.zIndex.modal-10,".MuiPaper-root":{height:"calc(100svh - 56px)",maxHeight:"calc(100svh - 56px)",borderTopLeftRadius:12,borderTopRightRadius:12,overflow:"auto"}}});export{T as MobileSearchButton,T as default};
2	+ //# sourceMappingURL=filter-input.mobile.js.map

package/dist/src/filter-bar/components/filter-input.mobile.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"filter-input.mobile.js","sources":["../../../../src/filter-bar/components/filter-input.mobile.tsx"],"sourcesContent":["// Mobile search drawer: opens drawer from bottom and focuses input\r\nimport { useEffect, useMemo, useRef, useState } from 'react'\r\nimport { Box, IconButton, InputBase, styled, Tooltip, SwipeableDrawer, Stack, Divider, Typography, Button, Chip } from '@mui/material'\r\nimport SearchIcon from '@mui/icons-material/Search'\r\nimport ChevronLeftIcon from '@mui/icons-material/ChevronLeft'\r\nimport ClearIcon from '@mui/icons-material/Clear'\r\nimport NorthWestIcon from '@mui/icons-material/NorthWest'\r\nimport type { FC, RefObject } from 'react'\r\nimport { InputAdornmentRight } from './filter-input.units'\r\n// import SwipeableDrawer from '@mui/material/SwipeableDrawer'\r\n\r\nconst DEFAULT_PLACEHOLDER = 'Search...'\r\nconst HISTORY_KEY = 'dino_search_history_v1'\r\nconst MAX_HISTORY_STORED = 20\r\nconst MAX_HISTORY_DISPLAYED = 5\r\n\r\nconst Root = styled(Box)(({ theme }) => ({\r\n padding: theme.spacing(2),\r\n display: 'flex',\r\n flexDirection: 'column',\r\n gap: theme.spacing(1)\r\n}))\r\n\r\nconst Header = styled('div')(({ theme }) => ({\r\n display: 'flex',\r\n alignItems: 'center',\r\n gap: theme.spacing(1)\r\n}))\r\n\r\n//#region InputSearch\r\ninterface IInputSearchProps {\r\n placeholder?: string\r\n inputRef?: RefObject<HTMLInputElement>\r\n hasKeyword?: boolean\r\n onEnter?: () => void\r\n onChange?: (value: string) => void\r\n onClear?: () => void\r\n}\r\nconst InputSearch: FC<IInputSearchProps> = (props) => {\r\n const { placeholder = DEFAULT_PLACEHOLDER, inputRef, hasKeyword, onEnter, onChange, onClear } = props\r\n const localRef = useRef<HTMLInputElement | null>(null)\r\n const refToUse = (inputRef as RefObject<HTMLInputElement>) ?? localRef\r\n\r\n useEffect(() => {\r\n // ensure focus opens mobile keyboard — sometimes requires a small delay\r\n const t = setTimeout(() => refToUse.current?.focus(), 50)\r\n return () => {\r\n // blur on unmount to dismiss soft keyboard before drawer closes\r\n try {\r\n refToUse.current?.blur()\r\n } catch {\r\n // ignore\r\n }\r\n clearTimeout(t)\r\n }\r\n }, [refToUse])\r\n\r\n return (\r\n <SearchInput\r\n fullWidth\r\n inputRef={refToUse}\r\n placeholder={placeholder}\r\n inputProps={{ autoCapitalize: 'off', autoComplete: 'off' }}\r\n onKeyDown={(e) => {\r\n if (e.key === 'Enter') {\r\n e.preventDefault()\r\n onEnter?.()\r\n }\r\n }}\r\n onChange={(e) => onChange?.(e.target.value)}\r\n endAdornment={<InputAdornmentRight hasKeyword={hasKeyword} onSubmit={onEnter} onClear={onClear} />}\r\n />\r\n )\r\n}\r\n\r\nconst SearchInput = styled(InputBase)(({ theme }) => ({\r\n border: `1px solid ${theme.palette.divider}`,\r\n borderRadius: theme.shape.borderRadius,\r\n padding: theme.spacing(0.5, 1)\r\n}))\r\n//#endregion\r\n\r\n//#region SearchHistory\r\ninterface ISearchHistoryProps {\r\n history: string[]\r\n onSelect: (keyword: string) => void\r\n onFillInput?: (keyword: string) => void\r\n onClear?: () => void\r\n}\r\nconst SearchHistory: FC<ISearchHistoryProps> = (props) => {\r\n const { history, onSelect, onFillInput, onClear } = props\r\n if (!history || history.length === 0) {\r\n return (\r\n <SearchHistoryNoResults>\r\n <Typography variant='body2' color='textSecondary'>\r\n No recent searches.\r\n </Typography>\r\n </SearchHistoryNoResults>\r\n )\r\n }\r\n\r\n return (\r\n <SearchHistoryStyled className={searchHistoryClasses.root}>\r\n <Stack direction='row' justifyContent='space-between' alignItems='center' sx={{ mb: 1 }}>\r\n <Typography variant='subtitle2' fontWeight={600}>\r\n Recent Searches\r\n </Typography>\r\n {onClear && (\r\n <Tooltip title='Clear history' arrow>\r\n <IconButton size='small' onClick={onClear}>\r\n <ClearIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n )}\r\n </Stack>\r\n <Stack className={searchHistoryClasses.items}>\r\n {history.map((keyword, idx) => (\r\n <Box key={idx} className={searchHistoryClasses.item} onClick={() => onSelect(keyword)} sx={{ cursor: 'pointer' }}>\r\n <Typography variant='body2' noWrap sx={{ flex: 1 }}>\r\n {keyword}\r\n </Typography>\r\n <Tooltip title='Fill input' arrow>\r\n <IconButton\r\n size='small'\r\n sx={{ color: 'text.secondary', '&:hover': { color: 'text.primary' } }}\r\n onClick={(e) => {\r\n e.stopPropagation()\r\n onFillInput?.(keyword)\r\n }}\r\n >\r\n <NorthWestIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n </Box>\r\n ))}\r\n </Stack>\r\n </SearchHistoryStyled>\r\n )\r\n}\r\nconst searchHistoryClasses = {\r\n root: 'DinoSearchHistory-root',\r\n items: 'DinoSearchHistory-items',\r\n item: 'DinoSearchHistory-item'\r\n}\r\nconst SearchHistoryStyled = styled(Box)(({ theme }) => ({\r\n padding: '8px 16px',\r\n marginTop: 1,\r\n [`.${searchHistoryClasses.items}`]: {},\r\n [`.${searchHistoryClasses.item}`]: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n gap: theme.spacing(1),\r\n padding: theme.spacing(0.5, 1),\r\n marginBottom: theme.spacing(0.5),\r\n borderRadius: theme.shape.borderRadius,\r\n backgroundColor: 'rgba(0,0,0,0.02)',\r\n '&:hover': { backgroundColor: 'rgba(0,0,0,0.04)' },\r\n '&:first-of-type': { marginTop: 0 }\r\n }\r\n}))\r\n\r\nconst SearchHistoryNoResults = styled(Box)(({ theme }) => ({\r\n padding: theme.spacing(2),\r\n textAlign: 'center',\r\n color: theme.palette.text.secondary,\r\n border: `0.5px dashed ${theme.palette.divider}`,\r\n borderRadius: theme.shape.borderRadius,\r\n display: 'flex',\r\n flexDirection: 'column',\r\n alignItems: 'center',\r\n gap: theme.spacing(1),\r\n margin: theme.spacing(1, 2)\r\n}))\r\n\r\n//#endregion\r\n//#region Main Component\r\nexport interface IMobileSearchButtonProps {\r\n placeholder?: string\r\n onSearching?: (keyword: string) => void\r\n}\r\n\r\nexport const MobileSearchButton: FC<IMobileSearchButtonProps> = (props) => {\r\n const { onSearching, placeholder } = props\r\n\r\n const [isOpenDrawer, setIsOpenDrawer] = useState(false)\r\n const [history, setHistory] = useState<string[]>([])\r\n const [inputValue, setInputValue] = useState('')\r\n\r\n const refInput = useRef<HTMLInputElement | null>(null)\r\n\r\n // Load history from localStorage on mount\r\n useEffect(() => {\r\n if (typeof window === 'undefined') return\r\n try {\r\n const raw = localStorage.getItem(HISTORY_KEY)\r\n if (raw) {\r\n const parsed = JSON.parse(raw)\r\n if (Array.isArray(parsed)) setHistory(parsed)\r\n }\r\n } catch {\r\n // ignore\r\n }\r\n }, [])\r\n\r\n // Save keyword to history (dedupe, limit to MAX_HISTORY_STORED)\r\n const pushHistory = (keyword: string) => {\r\n const trimmed = keyword.trim()\r\n if (!trimmed) return\r\n\r\n setHistory((prev) => {\r\n const next = [trimmed, ...prev.filter((x) => x !== trimmed)].slice(0, MAX_HISTORY_STORED)\r\n try {\r\n localStorage.setItem(HISTORY_KEY, JSON.stringify(next))\r\n } catch {\r\n // ignore\r\n }\r\n return next\r\n })\r\n }\r\n\r\n // Filter history based on current input (limit to MAX_HISTORY_DISPLAYED)\r\n const filteredHistory = useMemo(() => {\r\n const finalValue = (inputValue || '').trim()\r\n if (!finalValue) return history.slice(0, MAX_HISTORY_DISPLAYED)\r\n return history.filter((kw) => kw.toLowerCase().includes(finalValue.toLowerCase())).slice(0, MAX_HISTORY_DISPLAYED)\r\n }, [inputValue, history])\r\n\r\n const handleBack = () => {\r\n setInputValue('')\r\n try {\r\n refInput.current?.blur()\r\n } catch {\r\n // ignore\r\n }\r\n setIsOpenDrawer(false)\r\n }\r\n\r\n const handleSearch = () => {\r\n const keyword = refInput.current?.value?.trim() || ''\r\n if (keyword) {\r\n pushHistory(keyword)\r\n onSearching?.(keyword)\r\n handleCloseDrawer()\r\n }\r\n }\r\n\r\n const handleSelectHistory = (keyword: string) => {\r\n if (refInput.current) refInput.current.value = keyword\r\n setInputValue(keyword)\r\n pushHistory(keyword)\r\n onSearching?.(keyword)\r\n handleCloseDrawer()\r\n }\r\n\r\n const handleFillInput = (keyword: string) => {\r\n if (refInput.current) refInput.current.value = keyword\r\n setInputValue(keyword)\r\n refInput.current?.focus()\r\n }\r\n\r\n const handleClearHistory = () => {\r\n setHistory([])\r\n try {\r\n localStorage.removeItem(HISTORY_KEY)\r\n } catch {\r\n // ignore\r\n }\r\n }\r\n\r\n const handleClearInput = () => {\r\n if (refInput.current) refInput.current.value = ''\r\n setInputValue('')\r\n refInput.current?.focus()\r\n }\r\n\r\n const handleCloseDrawer = () => {\r\n try {\r\n refInput.current?.blur()\r\n } catch {}\r\n setIsOpenDrawer(false)\r\n }\r\n\r\n const handleOpenDrawer = () => {\r\n setIsOpenDrawer(true)\r\n setInputValue('')\r\n if (refInput.current) refInput.current.value = ''\r\n }\r\n\r\n return (\r\n <>\r\n <Tooltip title='Search' arrow>\r\n <IconButton size='small' onClick={handleOpenDrawer} aria-label='Open search'>\r\n <SearchIcon />\r\n </IconButton>\r\n </Tooltip>\r\n <SwipeableDrawerStyled\r\n anchor='bottom'\r\n open={isOpenDrawer}\r\n onClose={handleCloseDrawer}\r\n onOpen={handleOpenDrawer}\r\n disableBackdropTransition={false}\r\n disableDiscovery={false}\r\n swipeAreaWidth={20}\r\n >\r\n <Box sx={{ display: 'flex', justifyContent: 'center', py: 1 }}>\r\n <Box sx={{ width: 40, height: 4, borderRadius: 2, backgroundColor: 'divider' }} />\r\n </Box>\r\n <Stack gap={1} style={{ flexDirection: 'row', alignItems: 'center', padding: '0 8px' }}>\r\n <Tooltip title='Back' arrow>\r\n <IconButton size='small' onClick={handleBack}>\r\n <ChevronLeftIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n <InputSearch\r\n placeholder={placeholder}\r\n inputRef={refInput}\r\n hasKeyword={Boolean(inputValue)}\r\n onEnter={handleSearch}\r\n onChange={setInputValue}\r\n onClear={handleClearInput}\r\n />\r\n <Tooltip title='Search' arrow>\r\n <IconButton size='small' onClick={handleSearch} aria-label='Apply search'>\r\n <SearchIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n </Stack>\r\n <Typography variant='caption' color='textSecondary' sx={{ px: 2, mt: 1 }}>\r\n Enter the value to search for and hit enter or click the enter icon to apply.\r\n </Typography>\r\n <SearchHistory history={filteredHistory} onSelect={handleSelectHistory} onFillInput={handleFillInput} onClear={handleClearHistory} />\r\n </SwipeableDrawerStyled>\r\n </>\r\n )\r\n}\r\n\r\nexport default MobileSearchButton\r\n\r\nconst SwipeableDrawerStyled = styled(SwipeableDrawer)(({ theme }) => ({\r\n zIndex: theme.zIndex.modal - 10, // ensure it's below any modal that might be opened from the filter bar\r\n '.MuiPaper-root': {\r\n height: 'calc(100svh - 56px)',\r\n maxHeight: 'calc(100svh - 56px)',\r\n borderTopLeftRadius: 12,\r\n borderTopRightRadius: 12,\r\n overflow: 'auto'\r\n }\r\n}))\r\n//#endregion\r\n"],"names":["HISTORY_KEY","styled","Box","_ref","theme","padding","spacing","display","flexDirection","gap","_ref2","alignItems","InputSearch","props","_props$placeholder","placeholder","DEFAULT_PLACEHOLDER","inputRef","hasKeyword","onEnter","onChange","onClear","localRef","useRef","refToUse","useEffect","t","setTimeout","_refToUse$current","current","focus","_refToUse$current2","blur","_unused","clearTimeout","_jsx","SearchInput","fullWidth","inputProps","autoCapitalize","autoComplete","onKeyDown","e","key","preventDefault","target","value","endAdornment","InputAdornmentRight","onSubmit","InputBase","_ref3","border","concat","palette","divider","borderRadius","shape","SearchHistory","history","onSelect","onFillInput","length","_jsxs","SearchHistoryStyled","className","searchHistoryClasses","root","Stack","direction","justifyContent","sx","mb","children","Typography","variant","fontWeight","Tooltip","title","arrow","IconButton","size","onClick","ClearIcon","fontSize","items","map","keyword","idx","item","cursor","noWrap","flex","color","stopPropagation","NorthWestIcon","SearchHistoryNoResults","_ref4","_defineProperty","marginTop","marginBottom","backgroundColor","_ref6","textAlign","text","secondary","margin","MobileSearchButton","onSearching","_useState","useState","_useState2","_slicedToArray","isOpenDrawer","setIsOpenDrawer","_useState3","_useState4","setHistory","_useState5","_useState6","inputValue","setInputValue","refInput","window","raw","localStorage","getItem","parsed","JSON","parse","Array","isArray","_unused2","pushHistory","trimmed","trim","prev","next","_toConsumableArray","filter","x","slice","setItem","stringify","_unused3","filteredHistory","useMemo","finalValue","kw","toLowerCase","includes","handleSearch","_refInput$current2","handleCloseDrawer","_refInput$current5","_unused6","handleOpenDrawer","_Fragment","SearchIcon","SwipeableDrawerStyled","anchor","open","onClose","onOpen","disableBackdropTransition","disableDiscovery","swipeAreaWidth","py","width","height","style","_refInput$current","_unused4","ChevronLeftIcon","Boolean","_refInput$current4","px","mt","_refInput$current3","removeItem","_unused5","SwipeableDrawer","_ref7","zIndex","modal","maxHeight","borderTopLeftRadius","borderTopRightRadius","overflow"],"mappings":"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"}

package/dist/src/filter-bar/components/filter-summary.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as r,objectSpread2 as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as t,jsxs as l}from"react/jsx-runtime";import{styled as o,Collapse as i,Box as n,Button as a}from"@mui/material";import{useContext as c,useMemo as s}from"react";import{KeySpecial as u}from"../types.js";import{useFilterActions as m}from"./hooks.js";import{mapSpecialLabel as d}from"../helpers.js";import{createChipViewers as p}from"./chip-viewer.js";import{FilterBarContext as f}from"../index.context.js";function b(r){var o=h,b=p();return function(p){var h=c(f),v=h.filterState,x=m(h),k=s(function(){return function(r,t){var l,o=r.fields,i=r.enableQuickSearch,n=void 0===i||i,a=e({},o),c=u.quickSearch;return n?a[c]?null!==(l=a[c])&&void 0!==l&&l.label||(a[c]=e(e({},a[c]),{},{label:d[c]})):a[c]={label:d[c]}:delete a[c],Object.keys(t||{}).reduce(function(r,e){var l,o=null==a?void 0:a[e],i=(null==o?void 0:o.label)||e.toString(),n=null==t||null===(l=t[e])||void 0===l?void 0:l.values,c=(Array.isArray(n)?n:[]).filter(Boolean).map(function(r){return{value:r.toString()}});return c.length>0&&r.push({field:e,label:i,items:c}),r},[]).sort(function(r,e){return r.field===c?-1:e.field===c?1:0})}(r,v.storeFilter)},[v,r]);return t(i,{in:k.length>0,timeout:"auto",unmountOnExit:!0,children:l(g,{className:o.root,sx:p.sx,children:[t("div",{className:o.scrollHorizontal,children:t(b.Group,{label:"Filters",value:k,placement:"horizontal",onRemove:x.removeFilterByFieldValue})}),t(n,{sx:{},children:t(a,{size:"small",color:"error",variant:"text",onClick:x.clearAllFilters,className:o.buttonClearAll,children:"Clear All"})})]})})}}var h={root:"DinoFilterSummary-root",scrollHorizontal:"DinoFilterSummary-scrollHorizontal",buttonClearAll:"DinoFilterSummary-buttonClearAll"},g=o("div")(function(e){var t=e.theme;return r(r(r({},"&.".concat(h.root),{display:"flex",alignItems:"center",paddingLeft:t.spacing(1),paddingRight:t.spacing(.5)}),".".concat(h.scrollHorizontal),{overflowX:"auto",overflowY:"hidden",WebkitOverflowScrolling:"touch",scrollbarHeight:"thin",display:"flex",flexWrap:"nowrap",minWidth:0,flex:1,"& > *":{minWidth:"max-content",flexShrink:0},"&::-webkit-scrollbar":{height:"8px",background:"transparent"},"&::-webkit-scrollbar-thumb":{background:t.palette.grey[300],borderRadius:"8px",minHeight:"8px",transition:"background 0.2s"},"&::-webkit-scrollbar-thumb:hover":{background:t.palette.primary.light},"&::-webkit-scrollbar-track":{background:t.palette.grey[100],borderRadius:"8px"},scrollbarColor:"".concat(t.palette.grey[300]," ").concat(t.palette.grey[100]),scrollbarWidth:"thin"}),".".concat(h.buttonClearAll),{textTransform:"none",marginLeft:t.spacing(1),fontWeight:500,lineHeight:2,padding:t.spacing(0,1)})});export{b as createFilterSummary};
+import{defineProperty as r,objectSpread2 as l}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useContext as o,useMemo as a}from"react";import{styled as i,iconButtonClasses as n,buttonClasses as c,Collapse as s,Box as u,Button as m,IconButton as d}from"@mui/material";import p from"@mui/icons-material/ClearAll";import{KeySpecial as f}from"../types.js";import{useFilterActions as b}from"./hooks.js";import{mapSpecialLabel as h}from"../helpers.js";import{createChipViewers as g}from"./chip-viewer.js";import{FilterBarContext as v}from"../index.context.js";function x(r){var i=k,n=g();return function(c){var g=o(v),x=g.filterState,k=b(g),C=a(function(){return function(r,e){var t,o=r.fields,a=r.enableQuickSearch,i=void 0===a||a,n=l({},o),c=f.quickSearch;return i?n[c]?null!==(t=n[c])&&void 0!==t&&t.label||(n[c]=l(l({},n[c]),{},{label:h[c]})):n[c]={label:h[c]}:delete n[c],Object.keys(e||{}).reduce(function(r,l){var t,o=null==n?void 0:n[l],a=(null==o?void 0:o.label)||l.toString(),i=null==e||null===(t=e[l])||void 0===t?void 0:t.values,c=(Array.isArray(i)?i:[]).filter(Boolean).map(function(r){return{value:r.toString()}});return c.length>0&&r.push({field:l,label:a,items:c}),r},[]).sort(function(r,l){return r.field===c?-1:l.field===c?1:0})}(r,x.storeFilter)},[x,r]);return e(s,{in:C.length>0,timeout:"auto",unmountOnExit:!0,children:t(y,{className:i.root,sx:c.sx,children:[e("div",{className:i.scrollHorizontal,children:e(n.Group,{label:"Filters",value:C,placement:"horizontal",onRemove:k.removeFilterByFieldValue})}),t(u,{children:[e(m,{size:"small",color:"error",variant:"text",onClick:k.clearAllFilters,className:i.buttonClearAll,startIcon:e(p,{}),"aria-label":"Clear all filters",children:"Clear All"}),e(d,{size:"small",color:"error",onClick:k.clearAllFilters,className:i.buttonClearAll,"aria-label":"Clear all filters",children:e(p,{})})]})]})})}}var k={root:"DinoFilterSummary-root",scrollHorizontal:"DinoFilterSummary-scrollHorizontal",buttonClearAll:"DinoFilterSummary-buttonClearAll"},y=i("div")(function(l){var e=l.theme;return r(r(r({},"&.".concat(k.root),{display:"flex",alignItems:"center",paddingLeft:e.spacing(1),paddingRight:e.spacing(.5)}),".".concat(k.scrollHorizontal),{overflowX:"auto",overflowY:"hidden",WebkitOverflowScrolling:"touch",scrollbarHeight:"thin",display:"flex",flexWrap:"nowrap",minWidth:0,flex:1,"& > *":{minWidth:"max-content",flexShrink:0},"&::-webkit-scrollbar":{height:"8px",background:"transparent"},"&::-webkit-scrollbar-thumb":{background:e.palette.grey[300],borderRadius:"8px",minHeight:"8px",transition:"background 0.2s"},"&::-webkit-scrollbar-thumb:hover":{background:e.palette.primary.light},"&::-webkit-scrollbar-track":{background:e.palette.grey[100],borderRadius:"8px"},scrollbarColor:"".concat(e.palette.grey[300]," ").concat(e.palette.grey[100]),scrollbarWidth:"thin"}),".".concat(k.buttonClearAll),r(r(r({marginLeft:e.spacing(1)},"&:not(.".concat(n.root,")"),{textTransform:"none",fontWeight:500,lineHeight:2,padding:e.spacing(0,1)}),"&.".concat(n.root),{display:"none"}),e.breakpoints.down("md"),r(r({},"&.".concat(c.root),{display:"none"}),"&.".concat(n.root),{display:"flex"})))});export{x as createFilterSummary};
 //# sourceMappingURL=filter-summary.js.map

package/dist/src/filter-bar/components/filter-summary.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"filter-summary.js","sources":["../../../../src/filter-bar/components/filter-summary.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { Box, Button, Collapse, styled } from '@mui/material'\r\nimport { useContext, useMemo } from 'react'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from './hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { createChipViewers } from './chip-viewer'\r\nimport { FilterBarContext } from '../index.context'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { TFieldStore, TFieldValid } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IChipViewerItem, TChipViewerGroup } from './chip-viewer'\r\nimport type { IFilterSummaryConfig, IFilterSummaryProps, TFieldSummaryConfigs } from './filter-summary.types'\r\n\r\nfunction mapFilterStateToFilterData<T>(config: IFilterSummaryConfig<T>, store?: TFieldStore<T>): TChipViewerGroup<T>[] {\r\n const { fields, enableQuickSearch = true } = config\r\n\r\n // Ensure 'quickSearch' is always included in the summary, even if it's not in the config or store\r\n // If enableQuickSearch is false, it will not be added to the summary or removed if it exists in the config\r\n const mergedConfig: TFieldSummaryConfigs<T> = { ...fields }\r\n const qsKey = KeySpecial.quickSearch\r\n if (enableQuickSearch) {\r\n if (!mergedConfig[qsKey]) {\r\n mergedConfig[qsKey] = { label: mapSpecialLabel[qsKey] }\r\n } else if (!mergedConfig[qsKey]?.label) {\r\n mergedConfig[qsKey] = { ...mergedConfig[qsKey], label: mapSpecialLabel[qsKey] }\r\n }\r\n } else {\r\n delete mergedConfig[qsKey]\r\n }\r\n\r\n const keys = Object.keys(store \|\| {}) as (keyof TFieldStore<T>)[]\r\n const groups = keys.reduce<TChipViewerGroup<T>[]>((acc, key) => {\r\n const fieldConfig = mergedConfig?.[key]\r\n const label = fieldConfig?.label \|\| key.toString()\r\n const values = store?.[key]?.values as TFieldValid[] \| undefined\r\n const items = Array.isArray(values) ? values : []\r\n const summaryItems = items.filter(Boolean).map<IChipViewerItem<T>>((item) => ({ value: item.toString() }))\r\n if (summaryItems.length > 0) {\r\n acc.push({ field: key, label, items: summaryItems })\r\n }\r\n return acc\r\n }, [])\r\n const finalGroups = groups.sort((a, b) => {\r\n if (a.field === qsKey) return -1\r\n if (b.field === qsKey) return 1\r\n return 0\r\n })\r\n return finalGroups\r\n}\r\n\r\nexport function createFilterSummary<T>(config: IFilterSummaryConfig<T>) {\r\n const classes = filterSummaryClasses\r\n const ChipViewers = createChipViewers<T>()\r\n\r\n const FilterSummary: FC<IFilterSummaryProps<T>> = (props) => {\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const { filterState } = context\r\n const filterActions = useFilterActions<T>(context)\r\n\r\n const filterData = useMemo(() => {\r\n return mapFilterStateToFilterData(config, filterState.storeFilter)\r\n }, [filterState, config])\r\n\r\n // Old logic to calculate filterData, now moved to useMemo above\r\n // if (filterData.length === 0) return null\r\n\r\n return (\r\n <Collapse in={filterData.length > 0} timeout='auto' unmountOnExit>\r\n <FilterSummaryStyled className={classes.root} sx={props.sx}>\r\n <div className={classes.scrollHorizontal}>\r\n <ChipViewers.Group label='Filters' value={filterData} placement='horizontal' onRemove={filterActions.removeFilterByFieldValue} />\r\n </div>\r\n <Box sx={{}}>\r\n <Button size='small' color='error' variant='text' onClick={filterActions.clearAllFilters} className={classes.buttonClearAll}>\r\n Clear All\r\n </Button>\r\n </Box>\r\n </FilterSummaryStyled>\r\n </Collapse>\r\n )\r\n }\r\n\r\n return FilterSummary\r\n}\r\n\r\nconst filterSummaryClasses = {\r\n root: 'DinoFilterSummary-root',\r\n scrollHorizontal: 'DinoFilterSummary-scrollHorizontal',\r\n fieldItem: 'DinoFilterSummary-fieldItem',\r\n fieldLabel: 'DinoFilterSummary-fieldLabel',\r\n fieldValue: 'DinoFilterSummary-fieldValue',\r\n buttonClearAll: 'DinoFilterSummary-buttonClearAll'\r\n}\r\n\r\nconst FilterSummaryStyled = styled('div')(({ theme }) => ({\r\n [`&.${filterSummaryClasses.root}`]: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n paddingLeft: theme.spacing(1),\r\n paddingRight: theme.spacing(0.5)\r\n },\r\n [`.${filterSummaryClasses.scrollHorizontal}`]: {\r\n overflowX: 'auto',\r\n overflowY: 'hidden',\r\n WebkitOverflowScrolling: 'touch',\r\n scrollbarHeight: 'thin',\r\n // The content doesn't wrap to the next line and is wider than the container, displaying a horizontal scroll bar.\r\n display: 'flex',\r\n flexWrap: 'nowrap',\r\n minWidth: 0,\r\n flex: 1,\r\n '& > *': { minWidth: 'max-content', flexShrink: 0 },\r\n // Custom scrollbar\r\n '&::-webkit-scrollbar': { height: '8px', background: 'transparent' },\r\n '&::-webkit-scrollbar-thumb': {\r\n background: theme.palette.grey[300],\r\n borderRadius: '8px',\r\n minHeight: '8px',\r\n transition: 'background 0.2s'\r\n },\r\n '&::-webkit-scrollbar-thumb:hover': { background: theme.palette.primary.light },\r\n '&::-webkit-scrollbar-track': { background: theme.palette.grey[100], borderRadius: '8px' },\r\n // Firefox\r\n scrollbarColor: `${theme.palette.grey[300]} ${theme.palette.grey[100]}`,\r\n scrollbarWidth: 'thin'\r\n },\r\n [`.${filterSummaryClasses.buttonClearAll}`]: {\r\n textTransform: 'none',\r\n marginLeft: theme.spacing(1),\r\n fontWeight: 500,\r\n lineHeight: 2,\r\n padding: theme.spacing(0, 1)\r\n }\r\n}))\r\n"],"names":["createFilterSummary","config","classes","filterSummaryClasses","ChipViewers","createChipViewers","props","context","useContext","FilterBarContext","filterState","filterActions","useFilterActions","filterData","useMemo","store","_mergedConfig$qsKey","fields","_config$enableQuickSe","enableQuickSearch","mergedConfig","_objectSpread","qsKey","KeySpecial","quickSearch","label","mapSpecialLabel","Object","keys","reduce","acc","key","_store$key","fieldConfig","toString","values","summaryItems","Array","isArray","filter","Boolean","map","item","value","length","push","field","items","sort","a","b","mapFilterStateToFilterData","storeFilter","_jsx","Collapse","in","timeout","unmountOnExit","_jsxs","FilterSummaryStyled","className","root","sx","children","scrollHorizontal","Group","placement","onRemove","removeFilterByFieldValue","Box","Button","size","color","variant","onClick","clearAllFilters","buttonClearAll","styled","_ref","theme","_defineProperty","concat","display","alignItems","paddingLeft","spacing","paddingRight","overflowX","overflowY","WebkitOverflowScrolling","scrollbarHeight","flexWrap","minWidth","flex","flexShrink","height","background","palette","grey","borderRadius","minHeight","transition","primary","light","scrollbarColor","scrollbarWidth","textTransform","marginLeft","fontWeight","lineHeight","padding"],"mappings":"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"}
1	+ {"version":3,"file":"filter-summary.js","sources":["../../../../src/filter-bar/components/filter-summary.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useContext, useMemo } from 'react'\r\nimport { Box, Button, buttonClasses, Collapse, IconButton, iconButtonClasses, styled } from '@mui/material'\r\nimport ClearAllIcon from '@mui/icons-material/ClearAll'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from './hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { createChipViewers } from './chip-viewer'\r\nimport { FilterBarContext } from '../index.context'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { TFieldStore, TFieldValid } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IChipViewerItem, TChipViewerGroup } from './chip-viewer'\r\nimport type { IFilterSummaryConfig, IFilterSummaryProps, TFieldSummaryConfigs } from './filter-summary.types'\r\n\r\nfunction mapFilterStateToFilterData<T>(config: IFilterSummaryConfig<T>, store?: TFieldStore<T>): TChipViewerGroup<T>[] {\r\n const { fields, enableQuickSearch = true } = config\r\n\r\n // Ensure 'quickSearch' is always included in the summary, even if it's not in the config or store\r\n // If enableQuickSearch is false, it will not be added to the summary or removed if it exists in the config\r\n const mergedConfig: TFieldSummaryConfigs<T> = { ...fields }\r\n const qsKey = KeySpecial.quickSearch\r\n if (enableQuickSearch) {\r\n if (!mergedConfig[qsKey]) {\r\n mergedConfig[qsKey] = { label: mapSpecialLabel[qsKey] }\r\n } else if (!mergedConfig[qsKey]?.label) {\r\n mergedConfig[qsKey] = { ...mergedConfig[qsKey], label: mapSpecialLabel[qsKey] }\r\n }\r\n } else {\r\n delete mergedConfig[qsKey]\r\n }\r\n\r\n const keys = Object.keys(store \|\| {}) as (keyof TFieldStore<T>)[]\r\n const groups = keys.reduce<TChipViewerGroup<T>[]>((acc, key) => {\r\n const fieldConfig = mergedConfig?.[key]\r\n const label = fieldConfig?.label \|\| key.toString()\r\n const values = store?.[key]?.values as TFieldValid[] \| undefined\r\n const items = Array.isArray(values) ? values : []\r\n const summaryItems = items.filter(Boolean).map<IChipViewerItem<T>>((item) => ({ value: item.toString() }))\r\n if (summaryItems.length > 0) {\r\n acc.push({ field: key, label, items: summaryItems })\r\n }\r\n return acc\r\n }, [])\r\n const finalGroups = groups.sort((a, b) => {\r\n if (a.field === qsKey) return -1\r\n if (b.field === qsKey) return 1\r\n return 0\r\n })\r\n return finalGroups\r\n}\r\n\r\nexport function createFilterSummary<T>(config: IFilterSummaryConfig<T>) {\r\n const classes = filterSummaryClasses\r\n const ChipViewers = createChipViewers<T>()\r\n\r\n const FilterSummary: FC<IFilterSummaryProps<T>> = (props) => {\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const { filterState } = context\r\n const filterActions = useFilterActions<T>(context)\r\n\r\n const filterData = useMemo(() => {\r\n return mapFilterStateToFilterData(config, filterState.storeFilter)\r\n }, [filterState, config])\r\n\r\n // Old logic to calculate filterData, now moved to useMemo above\r\n // if (filterData.length === 0) return null\r\n\r\n return (\r\n <Collapse in={filterData.length > 0} timeout='auto' unmountOnExit>\r\n <FilterSummaryStyled className={classes.root} sx={props.sx}>\r\n <div className={classes.scrollHorizontal}>\r\n <ChipViewers.Group label='Filters' value={filterData} placement='horizontal' onRemove={filterActions.removeFilterByFieldValue} />\r\n </div>\r\n <Box>\r\n <Button\r\n size='small'\r\n color='error'\r\n variant='text'\r\n onClick={filterActions.clearAllFilters}\r\n className={classes.buttonClearAll}\r\n startIcon={<ClearAllIcon />}\r\n aria-label='Clear all filters'\r\n >\r\n Clear All\r\n </Button>\r\n <IconButton\r\n size='small'\r\n color='error'\r\n onClick={filterActions.clearAllFilters}\r\n className={classes.buttonClearAll}\r\n aria-label='Clear all filters'\r\n >\r\n <ClearAllIcon />\r\n </IconButton>\r\n </Box>\r\n </FilterSummaryStyled>\r\n </Collapse>\r\n )\r\n }\r\n\r\n return FilterSummary\r\n}\r\n\r\nconst filterSummaryClasses = {\r\n root: 'DinoFilterSummary-root',\r\n scrollHorizontal: 'DinoFilterSummary-scrollHorizontal',\r\n fieldItem: 'DinoFilterSummary-fieldItem',\r\n fieldLabel: 'DinoFilterSummary-fieldLabel',\r\n fieldValue: 'DinoFilterSummary-fieldValue',\r\n buttonClearAll: 'DinoFilterSummary-buttonClearAll'\r\n}\r\n\r\nconst FilterSummaryStyled = styled('div')(({ theme }) => ({\r\n [`&.${filterSummaryClasses.root}`]: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n paddingLeft: theme.spacing(1),\r\n paddingRight: theme.spacing(0.5)\r\n },\r\n [`.${filterSummaryClasses.scrollHorizontal}`]: {\r\n overflowX: 'auto',\r\n overflowY: 'hidden',\r\n WebkitOverflowScrolling: 'touch',\r\n scrollbarHeight: 'thin',\r\n // The content doesn't wrap to the next line and is wider than the container, displaying a horizontal scroll bar.\r\n display: 'flex',\r\n flexWrap: 'nowrap',\r\n minWidth: 0,\r\n flex: 1,\r\n '& > *': { minWidth: 'max-content', flexShrink: 0 },\r\n // Custom scrollbar\r\n '&::-webkit-scrollbar': { height: '8px', background: 'transparent' },\r\n '&::-webkit-scrollbar-thumb': {\r\n background: theme.palette.grey[300],\r\n borderRadius: '8px',\r\n minHeight: '8px',\r\n transition: 'background 0.2s'\r\n },\r\n '&::-webkit-scrollbar-thumb:hover': { background: theme.palette.primary.light },\r\n '&::-webkit-scrollbar-track': { background: theme.palette.grey[100], borderRadius: '8px' },\r\n // Firefox\r\n scrollbarColor: `${theme.palette.grey[300]} ${theme.palette.grey[100]}`,\r\n scrollbarWidth: 'thin'\r\n },\r\n [`.${filterSummaryClasses.buttonClearAll}`]: {\r\n marginLeft: theme.spacing(1),\r\n [`&:not(.${iconButtonClasses.root})`]: {\r\n textTransform: 'none',\r\n fontWeight: 500,\r\n lineHeight: 2,\r\n padding: theme.spacing(0, 1)\r\n },\r\n [`&.${iconButtonClasses.root}`]: { display: 'none' },\r\n [theme.breakpoints.down('md')]: {\r\n [`&.${buttonClasses.root}`]: { display: 'none' },\r\n [`&.${iconButtonClasses.root}`]: { display: 'flex' }\r\n }\r\n }\r\n}))\r\n"],"names":["createFilterSummary","config","classes","filterSummaryClasses","ChipViewers","createChipViewers","props","context","useContext","FilterBarContext","filterState","filterActions","useFilterActions","filterData","useMemo","store","_mergedConfig$qsKey","fields","_config$enableQuickSe","enableQuickSearch","mergedConfig","_objectSpread","qsKey","KeySpecial","quickSearch","label","mapSpecialLabel","Object","keys","reduce","acc","key","_store$key","fieldConfig","toString","values","summaryItems","Array","isArray","filter","Boolean","map","item","value","length","push","field","items","sort","a","b","mapFilterStateToFilterData","storeFilter","_jsx","Collapse","in","timeout","unmountOnExit","children","_jsxs","FilterSummaryStyled","className","root","sx","scrollHorizontal","Group","placement","onRemove","removeFilterByFieldValue","Box","Button","size","color","variant","onClick","clearAllFilters","buttonClearAll","startIcon","ClearAllIcon","IconButton","styled","_ref","theme","_defineProperty","concat","display","alignItems","paddingLeft","spacing","paddingRight","overflowX","overflowY","WebkitOverflowScrolling","scrollbarHeight","flexWrap","minWidth","flex","flexShrink","height","background","palette","grey","borderRadius","minHeight","transition","primary","light","scrollbarColor","scrollbarWidth","marginLeft","iconButtonClasses","textTransform","fontWeight","lineHeight","padding","breakpoints","down","buttonClasses"],"mappings":"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"}

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

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

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

	@@ -1 +1 @@
1	- {"version":3,"file":"button-switch.js","sources":["../../../../src/lab/data-surface/button-switch.tsx"],"sourcesContent":["import { FC, useCallback, useRef } from 'react'\r\nimport { colors, styled, ToggleButton, ToggleButtonGroup, Tooltip } from '@mui/material'\r\nimport ViewListIcon from '@mui/icons-material/ViewList'\r\nimport GridViewIcon from '@mui/icons-material/GridView'\r\nimport { DataSurfaceViewMode } from './types'\r\~~nimport { QueryParam } from '../../utils'\r\~~n\r\~~ntype~~ ~~Props~~ = {\r\n value?: DataSurfaceViewMode\r\n onChange?: (value: DataSurfaceViewMode) => void\r\n size?: 'sm' \| 'md'\r\n className?: string\r\n onlyIcon?: boolean\r\n reverse?: boolean\r\n}\r\n\r\nconst sizeMap = {~~\r\n~~ sm: 'small'~~,\r\n~~ md: 'medium'~~\r\n~~} as const\r\n\r\nconst viewModes = [\r\n { value: DataSurfaceViewMode.list, icon: <ViewListIcon fontSize='small' />, label: 'List View' },\r\n { value: DataSurfaceViewMode.grid, icon: <GridViewIcon fontSize='small' />, label: 'Grid View' }\r\n]\r\n\r\~~nconst~~ ButtonSwitch: FC<~~Props~~> = (props) => {\r\n const { value, onChange, size = 'md', className, onlyIcon = false, reverse = false } = props\r\n const muiSize = sizeMap[size] \|\| 'small'\r\n\r\n const changeTimeoutRef = useRef<NodeJS.Timeout \| null>(null)\r\n const handleChange = useCallback(\r\n (newValue: DataSurfaceViewMode \| null) => {\r\n if (changeTimeoutRef.current) {\r\n clearTimeout(changeTimeoutRef.current)\r\n }\r\n changeTimeoutRef.current = setTimeout(() => {\r\n if (newValue !== null && newValue !== value) {\r\n onChange?.(newValue)\r\n }\r\n }, 250)\r\n },\r\n [value, onChange]\r\n )\r\n\r\n const displayModes = reverse ? [...viewModes].reverse() : viewModes\r\n\r\n return (\r\n <StyledToggleButtonGroup className={className} size={muiSize} value={value} exclusive onChange={(_, v) => handleChange(v)} aria-label='view mode'>\r\n {displayModes.map((mode) => (\r\n <Tooltip key={mode.value} title={mode.label} arrow>\r\n <ToggleButton\r\n value={mode.value}\r\n aria-label={mode.label}\r\n size={muiSize}\r\n sx={{\r\n p: onlyIcon ? '5px' : undefined,\r\n minWidth: onlyIcon ? (muiSize === 'small' ? 36 : 44) : undefined\r\n }}\r\n >\r\n {onlyIcon ? mode.icon : mode.label}\r\n </ToggleButton>\r\n </Tooltip>\r\n ))}\r\n </StyledToggleButtonGroup>\r\n )\r\n}\r\n\r\nconst StyledToggleButtonGroup = styled(ToggleButtonGroup)({\r\n flex: '0 0 auto',\r\n '.MuiToggleButtonGroup-grouped': {\r\n '&.Mui-selected': {\r\n color: colors.common.white,\r\n backgroundColor: `var(--color-orange, ${colors.blue[600]})`,\r\n borderColor: `var(--color-orange, ${colors.blue[600]})`,\r\n '&.MuiToggleButtonGroup-lastButton': {\r\n borderColor: `var(--color-orange, ${colors.blue[600]})`\r\n },\r\n '&:hover': {\r\n backgroundColor: `var(--color-orange, ${colors.blue[600]})`\r\n }\r\n }\r\n }\r\n})\r\n~~\r\nexport default ButtonSwitch\r\n~~"],"names":["sizeMap","sm","md","viewModes","value","DataSurfaceViewMode","list","icon","_jsx","ViewListIcon","fontSize","label","grid","GridViewIcon","ButtonSwitch","props","onChange","_props$size","size","className","_props$onlyIcon","onlyIcon","_props$reverse","reverse","muiSize","changeTimeoutRef","useRef","handleChange","useCallback","newValue","current","clearTimeout","setTimeout","displayModes","concat","StyledToggleButtonGroup","exclusive","_","v","map","mode","Tooltip","title","arrow","children","ToggleButton","sx","p","undefined","minWidth","styled","ToggleButtonGroup","flex","color","colors","common","white","backgroundColor","blue","borderColor"],"mappings":"~~0UAgBA~~,IAAMA,EAAU,~~CACdC~~,GAAI,~~QACJC~~,GAAI,~~UAGAC~~,EAAY,CAChB,CAAEC,MAAOC,EAAoBC,KAAMC,KAAMC,EAACC,EAAa,CAAAC,SAAS,UAAYC,MAAO,aACnF,CAAEP,MAAOC,EAAoBO,KAAML,KAAMC,EAACK,EAAa,CAAAH,SAAS,UAAYC,MAAO,~~cAG/EG~~,~~EAA0B~~,SAACC,~~GAC/B~~,IAAQX,EAA+EW,EAA/EX,MAAOY,EAAwED,EAAxEC,SAAQC,EAAgEF,EAA9DG,KAAAA,OAAO,IAAHD,EAAG,KAAIA,EAAEE,EAAiDJ,EAAjDI,UAASC,EAAwCL,EAAtCM,SAAAA,OAAW,IAAHD,GAAQA,EAAAE,EAAsBP,EAApBQ,QAAAA,OAAU,IAAHD,GAAQA,EAC5EE,EAAUxB,EAAQkB,IAAS,QAE3BO,EAAmBC,EAA8B,MACjDC,EAAeC,EACnB,SAACC,GACKJ,EAAiBK,SACnBC,aAAaN,EAAiBK,SAEhCL,EAAiBK,QAAUE,WAAW,WACnB,OAAbH,GAAqBA,IAAazB,IACpCY,SAAAA,EAAWa,GAEd,EAAE,IACL,EACA,CAACzB,EAAOY,IAGJiB,EAAeV,EAAU,GAAAW,OAAI/B,GAAWoB,UAAYpB,EAE1D,OACEK,EAAC2B,EAAuB,CAAChB,UAAWA,EAAWD,KAAMM,EAASpB,MAAOA,EAAOgC,WAAU,EAAApB,SAAU,SAACqB,EAAGC,GAAC,OAAKX,EAAaW,EAAE,EAAa,aAAA,qBACnIL,EAAaM,IAAI,SAACC,GAAI,OACrBhC,EAACiC,EAAO,CAAkBC,MAAOF,EAAK7B,MAAOgC,OAAK,EAAAC,SAChDpC,EAACqC,GACCzC,MAAOoC,EAAKpC,MACA,aAAAoC,EAAK7B,MACjBO,KAAMM,EACNsB,GAAI,CACFC,EAAG1B,EAAW,WAAQ2B,EACtBC,SAAU5B,EAAwB,UAAZG,EAAsB,GAAK,QAAMwB,GAGxDJ,SAAAvB,EAAWmB,EAAKjC,KAAOiC,EAAK7B,SAVnB6B,EAAKpC,MAapB,IAGP,~~EAEM~~+B,EAA0Be,EAAOC,EAAPD,CAA0B,CACxDE,KAAM,WACN,gCAAiC,CAC/B,iBAAkB,CAChBC,MAAOC,EAAOC,OAAOC,MACrBC,gBAAe,uBAAAvB,OAAyBoB,EAAOI,KAAK,KAAO,KAC3DC,YAAW,uBAAAzB,OAAyBoB,EAAOI,KAAK,KAAO,KACvD,oCAAqC,CACnCC,YAAW,uBAAAzB,OAAyBoB,EAAOI,KAAK,KAAI,MAEtD,UAAW,CACTD,gBAAe,uBAAAvB,OAAyBoB,EAAOI,KAAK,KAAI"}
1	+ {"version":3,"file":"button-switch.js","sources":["../../../../src/lab/data-surface/button-switch.tsx"],"sourcesContent":["import { FC, useCallback, useRef } from 'react'\r\nimport { colors, styled, ToggleButton, ToggleButtonGroup, Tooltip } from '@mui/material'\r\nimport ViewListIcon from '@mui/icons-material/ViewList'\r\nimport GridViewIcon from '@mui/icons-material/GridView'\r\nimport { DataSurfaceViewMode } from './types'\r\n\r\nexport interface IButtonSwitchProps {\r\n value?: DataSurfaceViewMode\r\n onChange?: (value: DataSurfaceViewMode) => void\r\n size?: 'sm' \| 'md'\r\n className?: string\r\n onlyIcon?: boolean\r\n reverse?: boolean\r\n}\r\n\r\nconst sizeMap = { sm: 'small', md: 'medium' } as const\r\n\r\nconst viewModes = [\r\n { value: DataSurfaceViewMode.list, icon: <ViewListIcon fontSize='small' />, label: 'List View' },\r\n { value: DataSurfaceViewMode.grid, icon: <GridViewIcon fontSize='small' />, label: 'Grid View' }\r\n]\r\n\r\nexport const ButtonSwitch: FC<IButtonSwitchProps> = (props) => {\r\n const { value, onChange, size = 'md', className, onlyIcon = false, reverse = false } = props\r\n const muiSize = sizeMap[size] \|\| 'small'\r\n\r\n const changeTimeoutRef = useRef<NodeJS.Timeout \| null>(null)\r\n const handleChange = useCallback(\r\n (newValue: DataSurfaceViewMode \| null) => {\r\n if (changeTimeoutRef.current) {\r\n clearTimeout(changeTimeoutRef.current)\r\n }\r\n changeTimeoutRef.current = setTimeout(() => {\r\n if (newValue !== null && newValue !== value) {\r\n onChange?.(newValue)\r\n }\r\n }, 250)\r\n },\r\n [value, onChange]\r\n )\r\n\r\n const displayModes = reverse ? [...viewModes].reverse() : viewModes\r\n\r\n return (\r\n <StyledToggleButtonGroup className={className} size={muiSize} value={value} exclusive onChange={(_, v) => handleChange(v)} aria-label='view mode'>\r\n {displayModes.map((mode) => (\r\n <Tooltip key={mode.value} title={mode.label} arrow>\r\n <ToggleButton\r\n value={mode.value}\r\n aria-label={mode.label}\r\n size={muiSize}\r\n sx={{\r\n p: onlyIcon ? '5px' : undefined,\r\n minWidth: onlyIcon ? (muiSize === 'small' ? 36 : 44) : undefined\r\n }}\r\n >\r\n {onlyIcon ? mode.icon : mode.label}\r\n </ToggleButton>\r\n </Tooltip>\r\n ))}\r\n </StyledToggleButtonGroup>\r\n )\r\n}\r\n\r\nexport default ButtonSwitch\r\n\r\nconst StyledToggleButtonGroup = styled(ToggleButtonGroup)({\r\n flex: '0 0 auto',\r\n '.MuiToggleButtonGroup-grouped': {\r\n '&.Mui-selected': {\r\n color: colors.common.white,\r\n backgroundColor: `var(--color-orange, ${colors.blue[600]})`,\r\n borderColor: `var(--color-orange, ${colors.blue[600]})`,\r\n '&.MuiToggleButtonGroup-lastButton': {\r\n borderColor: `var(--color-orange, ${colors.blue[600]})`\r\n },\r\n '&:hover': {\r\n backgroundColor: `var(--color-orange, ${colors.blue[600]})`\r\n }\r\n }\r\n }\r\n})\r\n"],"names":["sizeMap","sm","md","viewModes","value","DataSurfaceViewMode","list","icon","_jsx","ViewListIcon","fontSize","label","grid","GridViewIcon","ButtonSwitch","props","onChange","_props$size","size","className","_props$onlyIcon","onlyIcon","_props$reverse","reverse","muiSize","changeTimeoutRef","useRef","handleChange","useCallback","newValue","current","clearTimeout","setTimeout","displayModes","concat","StyledToggleButtonGroup","exclusive","_","v","map","mode","Tooltip","title","arrow","children","ToggleButton","sx","p","undefined","minWidth","styled","ToggleButtonGroup","flex","color","colors","common","white","backgroundColor","blue","borderColor"],"mappings":"0UAeA,IAAMA,EAAU,CAAEC,GAAI,QAASC,GAAI,UAE7BC,EAAY,CAChB,CAAEC,MAAOC,EAAoBC,KAAMC,KAAMC,EAACC,EAAa,CAAAC,SAAS,UAAYC,MAAO,aACnF,CAAEP,MAAOC,EAAoBO,KAAML,KAAMC,EAACK,EAAa,CAAAH,SAAS,UAAYC,MAAO,cAGxEG,EAAuC,SAACC,GACnD,IAAQX,EAA+EW,EAA/EX,MAAOY,EAAwED,EAAxEC,SAAQC,EAAgEF,EAA9DG,KAAAA,OAAO,IAAHD,EAAG,KAAIA,EAAEE,EAAiDJ,EAAjDI,UAASC,EAAwCL,EAAtCM,SAAAA,OAAW,IAAHD,GAAQA,EAAAE,EAAsBP,EAApBQ,QAAAA,OAAU,IAAHD,GAAQA,EAC5EE,EAAUxB,EAAQkB,IAAS,QAE3BO,EAAmBC,EAA8B,MACjDC,EAAeC,EACnB,SAACC,GACKJ,EAAiBK,SACnBC,aAAaN,EAAiBK,SAEhCL,EAAiBK,QAAUE,WAAW,WACnB,OAAbH,GAAqBA,IAAazB,IACpCY,SAAAA,EAAWa,GAEd,EAAE,IACL,EACA,CAACzB,EAAOY,IAGJiB,EAAeV,EAAU,GAAAW,OAAI/B,GAAWoB,UAAYpB,EAE1D,OACEK,EAAC2B,EAAuB,CAAChB,UAAWA,EAAWD,KAAMM,EAASpB,MAAOA,EAAOgC,WAAU,EAAApB,SAAU,SAACqB,EAAGC,GAAC,OAAKX,EAAaW,EAAE,EAAa,aAAA,qBACnIL,EAAaM,IAAI,SAACC,GAAI,OACrBhC,EAACiC,EAAO,CAAkBC,MAAOF,EAAK7B,MAAOgC,OAAK,EAAAC,SAChDpC,EAACqC,GACCzC,MAAOoC,EAAKpC,MACA,aAAAoC,EAAK7B,MACjBO,KAAMM,EACNsB,GAAI,CACFC,EAAG1B,EAAW,WAAQ2B,EACtBC,SAAU5B,EAAwB,UAAZG,EAAsB,GAAK,QAAMwB,GAGxDJ,SAAAvB,EAAWmB,EAAKjC,KAAOiC,EAAK7B,SAVnB6B,EAAKpC,MAapB,IAGP,EAIM+B,EAA0Be,EAAOC,EAAPD,CAA0B,CACxDE,KAAM,WACN,gCAAiC,CAC/B,iBAAkB,CAChBC,MAAOC,EAAOC,OAAOC,MACrBC,gBAAe,uBAAAvB,OAAyBoB,EAAOI,KAAK,KAAO,KAC3DC,YAAW,uBAAAzB,OAAyBoB,EAAOI,KAAK,KAAO,KACvD,oCAAqC,CACnCC,YAAW,uBAAAzB,OAAyBoB,EAAOI,KAAK,KAAI,MAEtD,UAAW,CACTD,gBAAe,uBAAAvB,OAAyBoB,EAAOI,KAAK,KAAI"}

package/dist/src/lab/data-surface/index.create.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{slicedToArray as n,asyncToGenerator as e,regenerator as i,objectSpread2 as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as a,jsx as t}from"react/jsx-runtime";import{styled as r,Box as l}from"@mui/material";import{useState as u,useMemo as g,useCallback as d,useRef as v}from"react";import{LoadingModeRule as s}from"./types.js";import{createViewGrid as c,createViewGridLoading as f}from"./view-grid.js";import{createViewList as p,createViewListLoading as h}from"./view-list.js";import{createViewSwitchTransition as m}from"./view-switch-transition.js";import{PanelLoading as C,PanelNoData as S,PanelLoadMore as x,PanelInfiniteScrollFooter as P,PanelPaginationFooter as w}from"./ui.units.js";function z(r){if(!r.GridComponent){var z=r.gridConfig||{getterId:function(n,e){return e}};r.gridConfig=z,r.GridComponent=c(z)}if(!r.ListComponent){var y=r.listConfig||{getterId:function(n,e){return e}};r.listConfig=y,r.ListComponent=p(y)}var N=r.defaultViewMode,j=void 0===N?"grid":N,M=r.defaultLoadMode,k=void 0===M?"pagination":M,I=r.defaultPageSize,B=void 0===I?20:I,G=m({}),L=f(r.GridComponent),T=h(r.ListComponent);return function(c){var f,p,h=u({page:0,pageSize:B}),m=n(h,2),z=m[0],y=m[1],N=g(function(){var n,e,i,o,a,t=null!==(n=c.pagination)&&void 0!==n?n:z;return{page:null!==(e=t.page)&&void 0!==e?e:0,pageSize:null!==(i=t.pageSize)&&void 0!==i?i:B,hasNext:null!==(o=t.hasNext)&&void 0!==o&&o,hasPrev:null!==(a=t.hasPrev)&&void 0!==a&&a,total:t.total}},[c.pagination,z]),M=null!==(f=c.viewMode)&&void 0!==f?f:j,I=null!==(p=c.loadMode)&&void 0!==p?p:k,H=g(function(){var n,e,i,o;return"grid"===M?null!==(i=null===(o=r.gridConfig)||void 0===o?void 0:o.renderStrategy)&&void 0!==i?i:"normal":null!==(n=null===(e=r.listConfig)||void 0===e?void 0:e.renderStrategy)&&void 0!==n?n:"normal"},[M]),A=d(e(i().m(function n(){var e,a,t,r,l;return i().w(function(n){for(;;)switch(n.n){case 0:if(!((r=null!==(e=N.page)&&void 0!==e?e:0)<=0)){n.n=1;break}return n.a(2);case 1:return l=r-1,c.pagination||y(function(n){return o(o({},n),{},{page:l})}),n.n=2,null===(a=c.onPageChange)||void 0===a?void 0:a.call(c,l,null!==(t=N.pageSize)&&void 0!==t?t:B);case 2:return n.a(2)}},n)})),[N.page,N.pageSize,c.pagination,c.onPageChange]),_=d(e(i().m(function n(){var e,a,t,r,l;return i().w(function(n){for(;;)switch(n.n){case 0:if(N.hasNext){n.n=1;break}return n.a(2);case 1:return r=null!==(e=N.page)&&void 0!==e?e:0,l=r+1,c.pagination||y(function(n){return o(o({},n),{},{page:l})}),n.n=2,null===(a=c.onPageChange)||void 0===a?void 0:a.call(c,l,null!==(t=N.pageSize)&&void 0!==t?t:B);case 2:return n.a(2)}},n)})),[N.hasNext,N.page,N.pageSize,c.pagination,c.onPageChange]),D=d(function(){var n=e(i().m(function n(e){var a,t;return i().w(function(n){for(;;)switch(n.n){case 0:if(!(e<0)){n.n=1;break}return n.a(2);case 1:return c.pagination||y(function(n){return o(o({},n),{},{page:e})}),n.n=2,null===(a=c.onPageChange)||void 0===a?void 0:a.call(c,e,null!==(t=N.pageSize)&&void 0!==t?t:B);case 2:return n.a(2)}},n)}));return function(e){return n.apply(this,arguments)}}(),[N.pageSize,c.pagination,c.onPageChange]),J=c.value||[],V=0===J.length,q=Boolean(c.loading&&V),E=!c.loading&&V,F=Boolean(c.loading)&&!V,K=d(function(){var n=e(i().m(function n(e,o){var a;return i().w(function(n){for(;;)switch(n.n){case 0:return c.pagination||y({page:e,pageSize:o}),n.n=1,null===(a=c.onPageChange)||void 0===a?void 0:a.call(c,e,o);case 1:return n.a(2)}},n)}));return function(e,i){return n.apply(this,arguments)}}(),[c.pagination,c.onPageChange]),O=g(function(){return{value:J,loadMode:I,loading:c.loading,pagination:N,onPageChange:K}},[J,I,c.loading,N,K]),Q=v(O);Q.current=O;var R=g(function(){var n,e,i,o,a;return{value:J,loadMode:I,loading:c.loading,pagination:N,onPageChange:K,columns:null===(n=r.listConfig)||void 0===n?void 0:n.columns,density:null===(e=r.listConfig)||void 0===e?void 0:e.density,renderStrategy:H,virtualizedConfig:null===(i=r.listConfig)||void 0===i?void 0:i.virtualizedConfig,selectable:null!==(o=c.selectable)&&void 0!==o?o:null===(a=r.listConfig)||void 0===a?void 0:a.selectable,selectedIds:c.selectedIds,onSelectionChange:c.onSelectionChange}},[J,I,c.loading,N,H,K,c.selectable,c.selectedIds,c.onSelectionChange]),U=v(R);U.current=R;var W=g(function(){return function(){return t(T,o({},U.current))}},[T]),X=g(function(){return function(){return t(L,o({},Q.current))}},[L]);return a(b,{sx:c.sx,children:[a(l,{sx:{flex:1,minHeight:0,position:"relative"},children:[q&&t(C,{}),E&&t(S,{}),!q&&!E&&t(G,{value:M,viewA:{value:"list",Content:W},viewB:{value:"grid",Content:X}}),F&&t(x,{})]}),function(){var n,e,i;if(I===s.infiniteScroll){var o,a,r,l=null===(o=c.slots)||void 0===o?void 0:o.footer;return t(P,{loading:c.loading,hasNext:null===(a=c.pagination)||void 0===a?void 0:a.hasNext,currentCount:J.length,total:null===(r=c.pagination)||void 0===r?void 0:r.total,slots:{statusText:null==l?void 0:l.status,rangeText:null==l?void 0:l.range}})}return t(w,{page:null!==(n=N.page)&&void 0!==n?n:0,pageSize:null!==(e=N.pageSize)&&void 0!==e?e:B,total:N.total,hasNext:N.hasNext,hasPrev:(null!==(i=N.page)&&void 0!==i?i:0)>0,loading:c.loading,onPrevPage:A,onNextPage:_,onPageJump:D})}()]})}}var b=r(l)(function(n){return{display:"flex",flexDirection:"column",width:"100%",height:"100%",position:"relative",flex:1,minHeight:0,backgroundColor:n.theme.palette.background.default}});export{z as createDataSurface,z as default};
+import{slicedToArray as n,asyncToGenerator as e,regenerator as i,objectSpread2 as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as a,jsx as t}from"react/jsx-runtime";import{styled as r,Box as l}from"@mui/material";import{useState as u,useMemo as g,useCallback as d,useRef as v}from"react";import{LoadingModeRule as s}from"./types.js";import{createViewList as c,createViewListLoading as f}from"./view-list.js";import{createViewGrid as p,createViewGridLoading as h}from"./view-grid.js";import{createViewSwitchTransition as m}from"./view-switch-transition.js";import{PanelLoading as C,PanelNoData as S,PanelLoadMore as x,PanelInfiniteScrollFooter as P,PanelPaginationFooter as w}from"./ui.units.js";function z(r){if(!r.GridComponent){var z=r.gridConfig||{getterId:function(n,e){return e}};r.gridConfig=z,r.GridComponent=p(z)}if(!r.ListComponent){var y=r.listConfig||{getterId:function(n,e){return e}};r.listConfig=y,r.ListComponent=c(y)}var N=r.defaultViewMode,j=void 0===N?"grid":N,M=r.defaultLoadMode,k=void 0===M?"pagination":M,I=r.defaultPageSize,B=void 0===I?20:I,G=m({}),L=h(r.GridComponent),T=f(r.ListComponent);return function(c){var f,p,h=u({page:0,pageSize:B}),m=n(h,2),z=m[0],y=m[1],N=g(function(){var n,e,i,o,a,t=null!==(n=c.pagination)&&void 0!==n?n:z;return{page:null!==(e=t.page)&&void 0!==e?e:0,pageSize:null!==(i=t.pageSize)&&void 0!==i?i:B,hasNext:null!==(o=t.hasNext)&&void 0!==o&&o,hasPrev:null!==(a=t.hasPrev)&&void 0!==a&&a,total:t.total}},[c.pagination,z]),M=null!==(f=c.viewMode)&&void 0!==f?f:j,I=null!==(p=c.loadMode)&&void 0!==p?p:k,H=g(function(){var n,e,i,o;return"grid"===M?null!==(i=null===(o=r.gridConfig)||void 0===o?void 0:o.renderStrategy)&&void 0!==i?i:"normal":null!==(n=null===(e=r.listConfig)||void 0===e?void 0:e.renderStrategy)&&void 0!==n?n:"normal"},[M]),A=d(e(i().m(function n(){var e,a,t,r,l;return i().w(function(n){for(;;)switch(n.n){case 0:if(!((r=null!==(e=N.page)&&void 0!==e?e:0)<=0)){n.n=1;break}return n.a(2);case 1:return l=r-1,c.pagination||y(function(n){return o(o({},n),{},{page:l})}),n.n=2,null===(a=c.onPageChange)||void 0===a?void 0:a.call(c,l,null!==(t=N.pageSize)&&void 0!==t?t:B);case 2:return n.a(2)}},n)})),[N.page,N.pageSize,c.pagination,c.onPageChange]),_=d(e(i().m(function n(){var e,a,t,r,l;return i().w(function(n){for(;;)switch(n.n){case 0:if(N.hasNext){n.n=1;break}return n.a(2);case 1:return r=null!==(e=N.page)&&void 0!==e?e:0,l=r+1,c.pagination||y(function(n){return o(o({},n),{},{page:l})}),n.n=2,null===(a=c.onPageChange)||void 0===a?void 0:a.call(c,l,null!==(t=N.pageSize)&&void 0!==t?t:B);case 2:return n.a(2)}},n)})),[N.hasNext,N.page,N.pageSize,c.pagination,c.onPageChange]),D=d(function(){var n=e(i().m(function n(e){var a,t;return i().w(function(n){for(;;)switch(n.n){case 0:if(!(e<0)){n.n=1;break}return n.a(2);case 1:return c.pagination||y(function(n){return o(o({},n),{},{page:e})}),n.n=2,null===(a=c.onPageChange)||void 0===a?void 0:a.call(c,e,null!==(t=N.pageSize)&&void 0!==t?t:B);case 2:return n.a(2)}},n)}));return function(e){return n.apply(this,arguments)}}(),[N.pageSize,c.pagination,c.onPageChange]),J=c.value||[],V=0===J.length,q=Boolean(c.loading&&V),E=!c.loading&&V,F=Boolean(c.loading)&&!V,K=d(function(){var n=e(i().m(function n(e,o){var a;return i().w(function(n){for(;;)switch(n.n){case 0:return c.pagination||y({page:e,pageSize:o}),n.n=1,null===(a=c.onPageChange)||void 0===a?void 0:a.call(c,e,o);case 1:return n.a(2)}},n)}));return function(e,i){return n.apply(this,arguments)}}(),[c.pagination,c.onPageChange]),O=g(function(){return{value:J,loadMode:I,loading:c.loading,pagination:N,onPageChange:K}},[J,I,c.loading,N,K]),Q=v(O);Q.current=O;var R=g(function(){var n,e,i,o,a;return{value:J,loadMode:I,loading:c.loading,pagination:N,onPageChange:K,columns:null===(n=r.listConfig)||void 0===n?void 0:n.columns,density:null===(e=r.listConfig)||void 0===e?void 0:e.density,renderStrategy:H,virtualizedConfig:null===(i=r.listConfig)||void 0===i?void 0:i.virtualizedConfig,selectable:null!==(o=c.selectable)&&void 0!==o?o:null===(a=r.listConfig)||void 0===a?void 0:a.selectable,selectedIds:c.selectedIds,onSelectionChange:c.onSelectionChange}},[J,I,c.loading,N,H,K,c.selectable,c.selectedIds,c.onSelectionChange]),U=v(R);U.current=R;var W=g(function(){return function(){return t(T,o({},U.current))}},[T]),X=g(function(){return function(){return t(L,o({},Q.current))}},[L]);return a(b,{sx:c.sx,children:[a(l,{sx:{flex:1,minHeight:0,position:"relative"},children:[q&&t(C,{}),E&&t(S,{}),!q&&!E&&t(G,{value:M,viewA:{value:"list",Content:W},viewB:{value:"grid",Content:X}}),F&&t(x,{})]}),function(){var n,e,i;if(I===s.infiniteScroll){var o,a,r,l=null===(o=c.slots)||void 0===o?void 0:o.footer;return t(P,{loading:c.loading,hasNext:null===(a=c.pagination)||void 0===a?void 0:a.hasNext,currentCount:J.length,total:null===(r=c.pagination)||void 0===r?void 0:r.total,slots:{statusText:null==l?void 0:l.status,rangeText:null==l?void 0:l.range}})}return t(w,{page:null!==(n=N.page)&&void 0!==n?n:0,pageSize:null!==(e=N.pageSize)&&void 0!==e?e:B,total:N.total,hasNext:N.hasNext,hasPrev:(null!==(i=N.page)&&void 0!==i?i:0)>0,loading:c.loading,onPrevPage:A,onNextPage:_,onPageJump:D})}()]})}}var b=r(l)(function(n){return{display:"flex",flexDirection:"column",width:"100%",height:"100%",position:"relative",flex:1,minHeight:0,backgroundColor:n.theme.palette.background.default}});export{z as createDataSurface,z as default};
 //# sourceMappingURL=index.create.js.map