dinocollab-core 2.1.20 → 2.1.21

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

@@ -0,0 +1 @@
+{"version":3,"file":"create.multi-select-dropdown.js","sources":["../../../src/components/create.multi-select-dropdown.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useState } from 'react'\r\nimport { Badge, badgeClasses, Box, BoxProps, Button, ButtonProps, Checkbox } from '@mui/material'\r\nimport { FormControlLabel, List, ListItem, Popover, styled, TextField, ToggleButton, ToggleButtonGroup, Typography } from '@mui/material'\r\nimport FilterAltOutlinedIcon from '@mui/icons-material/FilterAltOutlined'\r\nimport { mergeObjects } from '../utils'\r\nimport HelpTooltip from './help-tooltip'\r\n\r\nexport type IMultiSelectDropdownFilterLogic = 'and' | 'or'\r\n\r\nexport interface IMultiSelectDropdownFilter {\r\n  items: string[]\r\n  logic?: IMultiSelectDropdownFilterLogic\r\n}\r\n\r\nexport type IMultiSelectDropdownChange = (value: IMultiSelectDropdownFilter) => void\r\n\r\nexport interface IMultiSelectDropdownSlots {\r\n  buttonProps?: ButtonProps\r\n  contentPorps?: BoxProps\r\n  defaultLogic?: IMultiSelectDropdownFilterLogic\r\n}\r\n\r\nexport interface IMultiSelectDropdownProps {\r\n  options?: string[]\r\n  value?: IMultiSelectDropdownFilter\r\n  onChange?: IMultiSelectDropdownChange\r\n  slots?: IMultiSelectDropdownSlots\r\n}\r\n\r\nexport interface IMultiSelectDropdownParams extends IMultiSelectDropdownSlots {\r\n  btnText: string\r\n  options?: string[]\r\n  placeholder?: string\r\n}\r\n\r\nfunction CreateMultiSelectDropdown(params: IMultiSelectDropdownParams) {\r\n  const MenuSelectMultiple: FC<IMultiSelectDropdownProps> = (props) => {\r\n    const [search, setSearch] = useState<string>('')\r\n    const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n    const [options, setOptions] = useState<string[]>(props.options ?? params.options ?? [])\r\n    const [itemSelecteds, setItemSelecteds] = useState<string[]>([])\r\n    const [logic, setLogic] = useState(props.slots?.defaultLogic ?? 'and')\r\n\r\n    const mergeConfig = {\r\n      buttonProps: mergeObjects<ButtonProps>(params?.buttonProps, props.slots?.buttonProps),\r\n      contentProps: props.slots?.contentPorps ?? params?.contentPorps ?? {}\r\n    }\r\n\r\n    const getOptions = () => {\r\n      const values = props.value?.items ?? []\r\n      const list = options.filter((x) => x.toLowerCase().includes(search.toLowerCase())).sort((a, b) => a.localeCompare(b))\r\n\r\n      const prioritized = list.filter((x) => values.includes(x))\r\n      const others = list.filter((x) => !values.includes(x))\r\n\r\n      return [...prioritized, ...others]\r\n    }\r\n\r\n    const setValueWithProps = useCallback(() => {\r\n      if (props.value) {\r\n        setLogic(props.value.logic ?? 'and')\r\n        setItemSelecteds(props.value.items)\r\n      }\r\n    }, [props.value])\r\n\r\n    const handleOpen = (event: React.MouseEvent<HTMLButtonElement>) => {\r\n      setAnchorEl(event.currentTarget)\r\n    }\r\n\r\n    const handleClose = (event?: {}, reason?: 'backdropClick' | 'escapeKeyDown') => {\r\n      setAnchorEl(null)\r\n      setTimeout(setValueWithProps, 300)\r\n    }\r\n\r\n    const handleToggle = (value: string) => {\r\n      setItemSelecteds((prev) => (prev.includes(value) ? prev.filter((t) => t !== value) : [...prev, value]))\r\n    }\r\n\r\n    const handleClear = () => {\r\n      setItemSelecteds([])\r\n      props.onChange && props.onChange({ items: [], logic })\r\n    }\r\n\r\n    const handleCancel = () => {\r\n      setItemSelecteds([])\r\n      handleClose()\r\n    }\r\n\r\n    const handleApply = () => {\r\n      props.onChange && props.onChange({ items: itemSelecteds, logic })\r\n      handleClose()\r\n    }\r\n\r\n    const handleChangeLogic = (_: React.MouseEvent<HTMLElement>, value: any) => {\r\n      if (value) setLogic(value)\r\n    }\r\n\r\n    useEffect(() => {\r\n      if (props.options && props.options.length > 0) setOptions(props.options)\r\n    }, [props.options])\r\n\r\n    useEffect(() => {\r\n      setValueWithProps()\r\n    }, [setValueWithProps])\r\n\r\n    return (\r\n      <>\r\n        <Button color='inherit' endIcon={<FilterAltOutlinedIcon />} disabled={options.length < 1} {...mergeConfig.buttonProps} onClick={handleOpen}>\r\n          {params.btnText}\r\n          <ButtonBadge\r\n            badgeContent={props.value?.items.length}\r\n            color='error'\r\n            overlap='circular'\r\n            sx={{ transform: 'translateY(-50%) translateX(24px)' }}\r\n          />\r\n        </Button>\r\n        <CustomPopover open={Boolean(anchorEl)} anchorEl={anchorEl} onClose={handleClose} anchorOrigin={{ vertical: 'bottom', horizontal: 'left' }}>\r\n          <WrapActions className='top'>\r\n            <TextField\r\n              size='small'\r\n              placeholder={params.placeholder ?? 'Search'}\r\n              fullWidth\r\n              value={search}\r\n              onChange={(e) => setSearch(e.target.value)}\r\n            />\r\n            <ToggleButtonGroup size='small' exclusive color='primary' value={logic} onChange={handleChangeLogic}>\r\n              <ToggleButton value='and'>AND</ToggleButton>\r\n              <ToggleButton value='or'>OR</ToggleButton>\r\n            </ToggleButtonGroup>\r\n            <HelpTooltip title='Filter Logic' small>\r\n              <Typography variant='body2' color='text.secondary'>\r\n                Choose how multiple categories are applied.\r\n                <br />\r\n                <strong> AND </strong> requires all selected categories, while\r\n                <br />\r\n                <strong> OR </strong> matches any.\r\n              </Typography>\r\n            </HelpTooltip>\r\n          </WrapActions>\r\n          <Box className='menu-content' {...mergeConfig.contentProps}>\r\n            <List>\r\n              {getOptions().map((x) => (\r\n                <ListItem key={x} sx={{ whiteSpace: 'nowrap' }}>\r\n                  <FormControlLabel label={x} control={<Checkbox checked={itemSelecteds.includes(x)} onChange={() => handleToggle(x)} />} />\r\n                </ListItem>\r\n              ))}\r\n            </List>\r\n          </Box>\r\n          <WrapActions>\r\n            <Button size='small' onClick={handleClear} color='inherit'>\r\n              Clear\r\n            </Button>\r\n            <Box sx={{ flex: 1 }} />\r\n            <Button size='small' onClick={handleCancel} color='inherit'>\r\n              Cancel\r\n            </Button>\r\n            <Button size='small' variant='contained' onClick={handleApply}>\r\n              Apply\r\n            </Button>\r\n          </WrapActions>\r\n        </CustomPopover>\r\n      </>\r\n    )\r\n  }\r\n\r\n  return MenuSelectMultiple\r\n}\r\n\r\nexport default CreateMultiSelectDropdown\r\n\r\nconst heightItem = 58\r\nconst CustomPopover = styled(Popover)({\r\n  '.MuiPaper-root': {\r\n    overflow: 'hidden',\r\n    position: 'relative',\r\n    width: '360px'\r\n  },\r\n  '.menu-content': {\r\n    overflowY: 'auto',\r\n    maxHeight: `${heightItem * 5}px`,\r\n    margin: '2px 2px 2px 0'\r\n  }\r\n})\r\n\r\nconst ButtonBadge = styled(Badge)({\r\n  [`& .${badgeClasses.badge}`]: {\r\n    top: '-12px',\r\n    right: '-6px'\r\n  }\r\n})\r\nconst WrapActions = styled(Box)({\r\n  alignItems: 'center',\r\n  display: 'flex',\r\n  gap: '6px',\r\n  height: '58px',\r\n  padding: '8px 10px',\r\n  boxShadow: 'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'\r\n})\r\n"],"names":["CreateMultiSelectDropdown","params","props","_ref","_props$options","_props$slots$defaultL","_props$slots","_props$slots2","_ref2","_props$slots$contentP","_props$slots3","_props$value2","_params$placeholder","_props$value$items","_props$value","values","list","prioritized","others","_useState","useState","_useState2","_slicedToArray","search","setSearch","_useState3","_useState4","anchorEl","setAnchorEl","_useState5","options","_useState6","setOptions","_useState7","_useState8","itemSelecteds","setItemSelecteds","_useState9","slots","defaultLogic","_useState0","logic","setLogic","mergeConfig","buttonProps","mergeObjects","contentProps","contentPorps","setValueWithProps","useCallback","_props$value$logic","value","items","handleClose","event","reason","setTimeout","useEffect","length","_jsxs","_Fragment","children","Button","_objectSpread","color","endIcon","_jsx","FilterAltOutlinedIcon","disabled","onClick","currentTarget","btnText","ButtonBadge","badgeContent","overlap","sx","transform","CustomPopover","open","Boolean","onClose","anchorOrigin","vertical","horizontal","WrapActions","className","TextField","size","placeholder","fullWidth","onChange","e","target","ToggleButtonGroup","exclusive","_","ToggleButton","HelpTooltip","title","small","Typography","variant","Box","List","filter","x","toLowerCase","includes","sort","a","b","localeCompare","concat","_toConsumableArray","map","ListItem","whiteSpace","FormControlLabel","label","control","Checkbox","checked","prev","t","flex","styled","Popover","overflow","position","width","overflowY","maxHeight","heightItem","margin","Badge","_defineProperty","badgeClasses","badge","top","right","alignItems","display","gap","height","padding","boxShadow"],"mappings":"8sBAmCA,SAASA,EAA0BC,GAkIjC,OAjI0D,SAACC,GAAS,IAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAY1CC,EAAAC,EAChBC,EACAC,EAEAC,EACAC,EAhBRC,EAA4BC,EAAiB,IAAGC,EAAAC,EAAAH,EAAA,GAAzCI,EAAMF,EAAA,GAAEG,EAASH,EAAA,GACxBI,EAAgCL,EAA6B,MAAKM,EAAAJ,EAAAG,EAAA,GAA3DE,EAAQD,EAAA,GAAEE,EAAWF,EAAA,GAC5BG,EAA8BT,EAAkDjB,QAA1CA,EAAwB,QAAxBC,EAAWF,EAAM4B,eAAO1B,IAAAA,EAAAA,EAAIH,EAAO6B,eAAO3B,IAAAA,EAAAA,EAAI,IAAG4B,EAAAT,EAAAO,EAAA,GAAhFC,EAAOC,EAAA,GAAEC,GAAUD,EAAA,GAC1BE,GAA0Cb,EAAmB,IAAGc,GAAAZ,EAAAW,GAAA,GAAzDE,GAAaD,GAAA,GAAEE,GAAgBF,GAAA,GACtCG,GAA0BjB,EAAkC,QAA1Bf,UAAAC,EAACJ,EAAMoC,aAAK,IAAAhC,OAAA,EAAXA,EAAaiC,oBAAYlC,IAAAA,EAAAA,EAAI,OAAMmC,GAAAlB,EAAAe,GAAA,GAA/DI,GAAKD,GAAA,GAAEE,GAAQF,GAAA,GAEhBG,GAAc,CAClBC,YAAaC,EAA0B5C,aAAM,EAANA,EAAQ2C,YAAwB,QAAbrC,EAAEL,EAAMoC,aAAN/B,IAAWA,OAAXA,EAAAA,EAAaqC,aACzEE,aAA+DtC,QAAnDA,EAA2BC,QAA3BA,EAAa,QAAbC,EAAER,EAAMoC,aAAK,IAAA5B,OAAA,EAAXA,EAAaqC,oBAAYtC,IAAAA,EAAAA,EAAIR,aAAM,EAANA,EAAQ8C,oBAAYvC,IAAAA,EAAAA,EAAI,CAAA,GAa/DwC,GAAoBC,GAAY,WACnB,IAAAC,EAAbhD,EAAMiD,QACRT,GAA0B,QAAlBQ,EAAChD,EAAMiD,MAAMV,aAAK,IAAAS,EAAAA,EAAI,OAC9Bd,GAAiBlC,EAAMiD,MAAMC,OAEjC,GAAG,CAAClD,EAAMiD,QAMJE,GAAc,SAACC,EAAYC,GAC/B3B,EAAY,MACZ4B,WAAWR,GAAmB,IAC/B,EAiCD,OARAS,GAAU,WACJvD,EAAM4B,SAAW5B,EAAM4B,QAAQ4B,OAAS,GAAG1B,GAAW9B,EAAM4B,QAClE,GAAG,CAAC5B,EAAM4B,UAEV2B,GAAU,WACRT,IACF,GAAG,CAACA,KAGFW,EACEC,EAAA,CAAAC,SAAA,CAAAF,EAACG,EAAMC,EAAAA,EAAA,CAACC,MAAM,UAAUC,QAASC,EAACC,EAAqB,IAAKC,SAAUtC,EAAQ4B,OAAS,GAAOf,GAAYC,aAAW,GAAA,CAAEyB,QA1CxG,SAACf,GAClB1B,EAAY0B,EAAMgB,cACnB,EAwC6IT,SAAA,CACvI5D,EAAOsE,QACRL,EAACM,EACC,CAAAC,aAAyB9D,QAAbA,EAAET,EAAMiD,aAANxC,IAAWA,OAAXA,EAAAA,EAAayC,MAAMM,OACjCM,MAAM,QACNU,QAAQ,WACRC,GAAI,CAAEC,UAAW,2CAGrBjB,EAACkB,EAAa,CAACC,KAAMC,QAAQpD,GAAWA,SAAUA,EAAUqD,QAAS3B,GAAa4B,aAAc,CAAEC,SAAU,SAAUC,WAAY,kBAChIxB,EAACyB,EAAY,CAAAC,UAAU,MAAKxB,SAAA,CAC1BK,EAACoB,EAAS,CACRC,KAAK,QACLC,YAA+B,QAApB5E,EAAEX,EAAOuF,mBAAW,IAAA5E,EAAAA,EAAI,SACnC6E,WAAS,EACTtC,MAAO5B,EACPmE,SAAU,SAACC,GAAC,OAAKnE,EAAUmE,EAAEC,OAAOzC,MAAM,IAE5CQ,EAACkC,EAAiB,CAACN,KAAK,QAAQO,WAAS,EAAC9B,MAAM,UAAUb,MAAOV,GAAOiD,SAhCtD,SAACK,EAAkC5C,GACvDA,GAAOT,GAASS,EACrB,YA+BSe,EAAC8B,GAAa7C,MAAM,MAAwBU,SAAA,QAC5CK,EAAC8B,EAAY,CAAC7C,MAAM,KAAsBU,SAAA,UAE5CK,EAAC+B,GAAYC,MAAM,eAAeC,OAChC,EAAAtC,SAAAF,EAACyC,EAAW,CAAAC,QAAQ,QAAQrC,MAAM,iBAEhCH,SAAA,CAAA,8CAAAK,EAAA,KAAA,IACAA,EAAsB,SAAA,CAAAL,SAAA,UAAA,2CACtBK,WACAA,EAAA,SAAA,CAAAL,SAAA,iCAINK,EAACoC,EAAGvC,EAAAA,EAAA,CAACsB,UAAU,gBAAmB1C,GAAYG,cAAY,GAAA,CACxDe,SAAAK,EAACqC,EACE,CAAA1C,UA5FH9C,EAA2B,QAArBF,EAAc,QAAdC,EAAGZ,EAAMiD,aAANrC,IAAWA,OAAXA,EAAAA,EAAasC,aAAKvC,IAAAA,EAAAA,EAAI,GAC/BG,EAAOc,EAAQ0E,QAAO,SAACC,GAAC,OAAKA,EAAEC,cAAcC,SAASpF,EAAOmF,cAAc,IAAEE,MAAK,SAACC,EAAGC,GAAC,OAAKD,EAAEE,cAAcD,MAE5G7F,EAAcD,EAAKwF,QAAO,SAACC,GAAC,OAAK1F,EAAO4F,SAASF,MACjDvF,EAASF,EAAKwF,QAAO,SAACC,GAAC,OAAM1F,EAAO4F,SAASF,MAEnDO,GAAAA,OAAAC,EAAWhG,GAAWgG,EAAK/F,KAsFLgG,KAAI,SAACT,GAAC,OAClBvC,EAACiD,EAAiB,CAAAxC,GAAI,CAAEyC,WAAY,UAClCvD,SAAAK,EAACmD,EAAiB,CAAAC,MAAOb,EAAGc,QAASrD,EAACsD,EAAS,CAAAC,QAAStF,GAAcwE,SAASF,GAAIf,SAAU,WAAF,OArEnFvC,EAqEwGsD,OApE5HrE,IAAiB,SAACsF,GAAI,OAAMA,EAAKf,SAASxD,GAASuE,EAAKlB,QAAO,SAACmB,GAAC,OAAKA,IAAMxE,KAAM,GAAA6D,OAAAC,EAAOS,GAAI,CAAEvE,GAAM,IADlF,IAACA,CAqE0G,OADrGsD,EAGhB,SAGL9C,EAACyB,EAAW,CAAAvB,SAAA,CACVK,EAACJ,EAAM,CAACyB,KAAK,QAAQlB,QAvET,WAClBjC,GAAiB,IACjBlC,EAAMwF,UAAYxF,EAAMwF,SAAS,CAAEtC,MAAO,GAAIX,MAAAA,IAC/C,EAoEkDuB,MAAM,6BAGjDE,EAACoC,EAAI,CAAA3B,GAAI,CAAEiD,KAAM,KACjB1D,EAACJ,EAAM,CAACyB,KAAK,QAAQlB,QAtER,WACnBjC,GAAiB,IACjBiB,IACD,EAmEmDW,MAAM,UAEzCH,SAAA,WACTK,EAACJ,EAAM,CAACyB,KAAK,QAAQc,QAAQ,YAAYhC,QApE7B,WAClBnE,EAAMwF,UAAYxF,EAAMwF,SAAS,CAAEtC,MAAOjB,GAAeM,MAAAA,KACzDY,IACD,EAiEoEQ,SAAA,kBAOtE,CAGH,CAIA,IACMgB,EAAgBgD,EAAOC,EAAPD,CAAgB,CACpC,iBAAkB,CAChBE,SAAU,SACVC,SAAU,WACVC,MAAO,SAET,gBAAiB,CACfC,UAAW,OACXC,aAASnB,OAAKoB,IAAkB,MAChCC,OAAQ,mBAIN7D,EAAcqD,EAAOS,EAAPT,CAAaU,EAAA,GAAA,MAAAvB,OACxBwB,EAAaC,OAAU,CAC5BC,IAAK,QACLC,MAAO,UAGLvD,EAAcyC,EAAOvB,EAAPuB,CAAY,CAC9Be,WAAY,SACZC,QAAS,OACTC,IAAK,MACLC,OAAQ,OACRC,QAAS,WACTC,UAAW"}

package/dist/src/components/help-tooltip.js

@@ -0,0 +1,2 @@
+import{objectSpread2 as r,objectWithoutProperties as t,defineProperty as e}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i,jsxs as o}from"react/jsx-runtime";import{styled as a,Typography as p,Tooltip as l,tooltipClasses as n,Box as c,Stack as m,Divider as x,IconButton as d}from"@mui/material";import s from"@mui/icons-material/HelpOutline";var u=["className"],h=function(t){return i(g,{arrow:!0,placement:"bottom",title:o(m,{sx:{gap:"6px",py:"6px",minWidth:"200px",maxWidth:"400px "},children:[i(b,{children:t.title}),i(x,{}),i(c,{sx:{p:"6px 12px"},children:t.children})]}),children:i(c,{sx:r({cursor:"default"},t.sxIcon),children:i(d,{size:"small",children:i(s,{fontSize:t.small?"small":"medium",sx:{color:"rgb(25,103,210)"}})})})})},f=function(r){return i(g,{arrow:!0,placement:"bottom",title:o(m,{sx:{gap:"6px",py:"6px",minWidth:"200px",maxWidth:"400px "},children:[i(b,{children:r.title}),i(x,{}),i(c,{sx:{p:"6px 12px"},children:r.content})]}),children:i(c,{sx:{cursor:"default"},children:r.children})})},b=a((function(t){return i(p,r({variant:"subtitle1"},t))}))({color:"#0095ff",fontWeight:700,padding:"0 10px"}),g=a((function(e){var o=e.className,a=t(e,u);return i(l,r(r({},a),{},{classes:{popper:o}}))}))((function(r){var t=r.theme;return e(e({},"& .".concat(n.tooltip),{backgroundColor:t.palette.background.paper,color:t.palette.text.primary,maxWidth:500,minHeight:120,fontSize:t.typography.pxToRem(12),borderRadius:"8px",boxShadow:"rgba(0, 0, 0, 0.08) 0px 6px 30px"}),"& .".concat(n.arrow),{color:t.palette.background.paper})}));export{h as HelpTooltip,f as HelpTooltipWrap,h as default};
+//# sourceMappingURL=help-tooltip.js.map

package/dist/src/components/help-tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"help-tooltip.js","sources":["../../../src/components/help-tooltip.tsx"],"sourcesContent":["import { Box, Divider, IconButton, Stack, Tooltip, Typography, styled, tooltipClasses } from '@mui/material'\r\nimport type { FC, PropsWithChildren, ReactNode } from 'react'\r\nimport type { SxProps, Theme, TooltipProps, TypographyProps } from '@mui/material'\r\nimport HelpOutlineIcon from '@mui/icons-material/HelpOutline'\r\n\r\nexport interface IHelpTooltipProps {\r\n  title: string\r\n  small?: boolean\r\n  sxIcon?: SxProps<Theme>\r\n}\r\n\r\nexport const HelpTooltip: FC<PropsWithChildren<IHelpTooltipProps>> = (props) => (\r\n  <TooltipStyled\r\n    arrow\r\n    placement='bottom'\r\n    title={\r\n      <Stack sx={{ gap: '6px', py: '6px', minWidth: '200px', maxWidth: '400px ' }}>\r\n        <TooltipHeaderText>{props.title}</TooltipHeaderText>\r\n        <Divider />\r\n        <Box sx={{ p: '6px 12px' }}>{props.children}</Box>\r\n      </Stack>\r\n    }\r\n  >\r\n    <Box sx={{ cursor: 'default', ...props.sxIcon }}>\r\n      <IconButton size='small'>\r\n        <HelpOutlineIcon fontSize={props.small ? 'small' : 'medium'} sx={{ color: 'rgb(25,103,210)' }} />\r\n      </IconButton>\r\n    </Box>\r\n  </TooltipStyled>\r\n)\r\n\r\nexport default HelpTooltip\r\n\r\nexport interface IHelpTooltipWrapProps {\r\n  content: ReactNode\r\n  title: string\r\n  children: React.ReactNode\r\n}\r\n\r\nexport const HelpTooltipWrap: FC<IHelpTooltipWrapProps> = (props) => (\r\n  <TooltipStyled\r\n    arrow\r\n    placement='bottom'\r\n    title={\r\n      <Stack sx={{ gap: '6px', py: '6px', minWidth: '200px', maxWidth: '400px ' }}>\r\n        <TooltipHeaderText>{props.title}</TooltipHeaderText>\r\n        <Divider />\r\n        <Box sx={{ p: '6px 12px' }}>{props.content}</Box>\r\n      </Stack>\r\n    }\r\n  >\r\n    <Box sx={{ cursor: 'default' }}>{props.children}</Box>\r\n  </TooltipStyled>\r\n)\r\n\r\nconst TooltipHeaderText = styled((props: TypographyProps) => <Typography variant='subtitle1' {...props} />)({\r\n  color: '#0095ff',\r\n  fontWeight: 700,\r\n  padding: '0 10px'\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    maxWidth: 500,\r\n    minHeight: 120,\r\n    fontSize: theme.typography.pxToRem(12),\r\n    borderRadius: '8px',\r\n    boxShadow: 'rgba(0, 0, 0, 0.08) 0px 6px 30px'\r\n  },\r\n  [`& .${tooltipClasses.arrow}`]: {\r\n    color: theme.palette.background.paper\r\n  }\r\n}))\r\n"],"names":["HelpTooltip","props","_jsx","TooltipStyled","arrow","placement","title","_jsxs","Stack","sx","gap","py","minWidth","maxWidth","children","TooltipHeaderText","Divider","Box","p","_objectSpread","cursor","sxIcon","IconButton","size","HelpOutlineIcon","fontSize","small","color","HelpTooltipWrap","content","styled","Typography","variant","fontWeight","padding","_ref","className","_objectWithoutProperties","_excluded","Tooltip","classes","popper","_ref2","theme","_defineProperty","concat","tooltipClasses","tooltip","backgroundColor","palette","background","paper","text","primary","minHeight","typography","pxToRem","borderRadius","boxShadow"],"mappings":"2XAWaA,EAAwD,SAACC,GAAK,OACzEC,EAACC,EACC,CAAAC,OACA,EAAAC,UAAU,SACVC,MACEC,EAACC,EAAK,CAACC,GAAI,CAAEC,IAAK,MAAOC,GAAI,MAAOC,SAAU,QAASC,SAAU,UAAUC,SAAA,CACzEZ,EAACa,EAAmB,CAAAD,SAAAb,EAAMK,QAC1BJ,EAACc,EAAU,CAAA,GACXd,EAACe,EAAI,CAAAR,GAAI,CAAES,EAAG,YAAeJ,SAAAb,EAAMa,cAIvCA,SAAAZ,EAACe,EAAG,CAACR,GAAEU,EAAA,CAAIC,OAAQ,WAAcnB,EAAMoB,QACrCP,SAAAZ,EAACoB,EAAU,CAACC,KAAK,QAAOT,SACtBZ,EAACsB,EAAgB,CAAAC,SAAUxB,EAAMyB,MAAQ,QAAU,SAAUjB,GAAI,CAAEkB,MAAO,0BAGhE,EAWLC,EAA6C,SAAC3B,GAAK,OAC9DC,EAACC,GACCC,OAAK,EACLC,UAAU,SACVC,MACEC,EAACC,EAAK,CAACC,GAAI,CAAEC,IAAK,MAAOC,GAAI,MAAOC,SAAU,QAASC,SAAU,UAC/DC,SAAA,CAAAZ,EAACa,EAAiB,CAAAD,SAAEb,EAAMK,QAC1BJ,EAACc,EAAU,CAAA,GACXd,EAACe,EAAG,CAACR,GAAI,CAAES,EAAG,YAAeJ,SAAAb,EAAM4B,aAIvCf,SAAAZ,EAACe,EAAI,CAAAR,GAAI,CAAEW,OAAQ,oBAAcnB,EAAMa,YACzB,EAGZC,EAAoBe,GAAO,SAAC7B,GAAsB,OAAKC,EAAC6B,EAAUZ,EAAA,CAACa,QAAQ,aAAgB/B,GAAS,GAAhF6B,CAAkF,CAC1GH,MAAO,UACPM,WAAY,IACZC,QAAS,WAGL/B,EAAgB2B,GAAO,SAAAK,GAAA,IAAGC,EAASD,EAATC,UAAcnC,EAAKoC,EAAAF,EAAAG,GAAA,OAAqBpC,EAACqC,EAAOpB,EAAAA,KAAKlB,GAAK,GAAA,CAAEuC,QAAS,CAAEC,OAAQL,KAAe,GAAxGN,EAA0G,SAAAY,GAAA,IAAGC,EAAKD,EAALC,MAAK,OAAAC,EAAAA,EAAA,CAAA,EAAA,MAAAC,OAC/HC,EAAeC,SAAY,CAChCC,gBAAiBL,EAAMM,QAAQC,WAAWC,MAC1CxB,MAAOgB,EAAMM,QAAQG,KAAKC,QAC1BxC,SAAU,IACVyC,UAAW,IACX7B,SAAUkB,EAAMY,WAAWC,QAAQ,IACnCC,aAAc,MACdC,UAAW,2CACZb,OACMC,EAAe1C,OAAU,CAC9BuB,MAAOgB,EAAMM,QAAQC,WAAWC,OACjC"}

package/dist/src/components/image-with-fallback.js

@@ -0,0 +1,2 @@
+import{objectWithoutProperties as r,slicedToArray as t,objectSpread2 as e}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o,Fragment as n,jsxs as a}from"react/jsx-runtime";import{useState as l,useRef as i,useEffect as u,Fragment as c}from"react";import{useDebounce as s}from"../hooks/debounce.js";var f=["src","fallbackSrc","alt","loading","debounceDelay"],m=function(m){var d=m.src,p=m.fallbackSrc,b=m.alt,y=m.loading,g=m.debounceDelay,h=void 0===g?0:g,j=r(m,f),v=s(d,h),S=s(p,h),k=h>0?v:d,T=h>0?S:p,x=l(!0),D=t(x,2),L=D[0],P=D[1],_=l(null!=k?k:T),A=t(_,2),B=A[0],E=A[1],F=i(null),H=function(){F.current&&(clearTimeout(F.current),F.current=null),F.current=setTimeout((function(){L&&P(!1)}),2e3)};u((function(){E(null!=k?k:T),P(!0)}),[k,T]);var W,q=L&&y?y:o(n,{});return a(c,{children:[q,o("img",e(e(e({},j),(W={},j.style&&(W.style=j.style),L&&(W.style=e(e({},W.style),{},{height:"0!important",transition:"height 0.2s ease-in-out"})),W)),{},{src:B,alt:b,onLoadStart:function(){return P(!0)},onLoad:function(){P(!1),H()},onError:function(){E(p),P(!1),H()}}))]})};export{m as ImageWithFallback,m as default};
+//# sourceMappingURL=image-with-fallback.js.map

package/dist/src/components/image-with-fallback.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-with-fallback.js","sources":["../../../src/components/image-with-fallback.tsx"],"sourcesContent":["import { Fragment, useEffect, useRef, useState } from 'react'\r\nimport type { CSSProperties, FC, ImgHTMLAttributes, ReactNode } from 'react'\r\nimport { useDebounce } from '../hooks'\r\n\r\nexport interface IImageWithFallbackPropsOwner {\r\n  src?: string\r\n  alt?: string\r\n  fallbackSrc: string\r\n  loading?: ReactNode\r\n  debounceDelay?: number\r\n}\r\n\r\nexport type IImageProps = Omit<ImgHTMLAttributes<HTMLImageElement>, keyof IImageWithFallbackPropsOwner>\r\n\r\nexport interface IImageWithFallbackProps extends IImageProps, IImageWithFallbackPropsOwner {}\r\n\r\nexport const ImageWithFallback: FC<IImageWithFallbackProps> = ({ src, fallbackSrc, alt, loading, debounceDelay = 0, ...props }) => {\r\n  const debouncedSrc = useDebounce(src, debounceDelay)\r\n  const debouncedFallbackSrc = useDebounce(fallbackSrc, debounceDelay)\r\n\r\n  const effectiveSrc = debounceDelay > 0 ? debouncedSrc : src\r\n  const effectiveFallbackSrc = debounceDelay > 0 ? debouncedFallbackSrc : fallbackSrc\r\n\r\n  const [isLoading, setLoading] = useState(true)\r\n  const [imgSrc, setImgSrc] = useState(effectiveSrc ?? effectiveFallbackSrc)\r\n\r\n  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null)\r\n  const forceStopLoading = () => {\r\n    if (timeoutRef.current) {\r\n      clearTimeout(timeoutRef.current)\r\n      timeoutRef.current = null\r\n    }\r\n    timeoutRef.current = setTimeout(() => {\r\n      if (isLoading) setLoading(false)\r\n    }, 2000)\r\n  }\r\n\r\n  useEffect(() => {\r\n    setImgSrc(effectiveSrc ?? effectiveFallbackSrc)\r\n    setLoading(true)\r\n  }, [effectiveSrc, effectiveFallbackSrc])\r\n\r\n  const loadingElement = isLoading && loading ? loading : <></>\r\n\r\n  const mapStyle = () => {\r\n    const obj: { style?: CSSProperties } = {}\r\n    if (props.style) obj.style = props.style\r\n    if (isLoading) obj.style = { ...obj.style, height: '0!important', transition: 'height 0.2s ease-in-out' }\r\n    return obj\r\n  }\r\n\r\n  return (\r\n    <Fragment>\r\n      {loadingElement}\r\n      <img\r\n        {...props}\r\n        {...mapStyle()}\r\n        src={imgSrc}\r\n        alt={alt}\r\n        onLoadStart={() => setLoading(true)}\r\n        onLoad={() => {\r\n          setLoading(false)\r\n          forceStopLoading()\r\n        }}\r\n        onError={() => {\r\n          setImgSrc(fallbackSrc)\r\n          setLoading(false)\r\n          forceStopLoading()\r\n        }}\r\n      />\r\n    </Fragment>\r\n  )\r\n}\r\nexport default ImageWithFallback\r\n"],"names":["ImageWithFallback","_ref","src","fallbackSrc","alt","loading","_ref$debounceDelay","debounceDelay","props","_objectWithoutProperties","_excluded","debouncedSrc","useDebounce","debouncedFallbackSrc","effectiveSrc","effectiveFallbackSrc","_useState","useState","_useState2","_slicedToArray","isLoading","setLoading","_useState3","_useState4","imgSrc","setImgSrc","timeoutRef","useRef","forceStopLoading","current","clearTimeout","setTimeout","useEffect","obj","loadingElement","_jsx","_jsxs","Fragment","children","_objectSpread","style","height","transition","onLoadStart","onLoad","onError"],"mappings":"qXAgBaA,EAAiD,SAAhCC,GAAoG,IAAjEC,EAAGD,EAAHC,IAAKC,EAAWF,EAAXE,YAAaC,EAAGH,EAAHG,IAAKC,EAAOJ,EAAPI,QAAOC,EAAAL,EAAEM,cAAAA,OAAgB,IAAHD,EAAG,EAACA,EAAKE,EAAKC,EAAAR,EAAAS,GACpHC,EAAeC,EAAYV,EAAKK,GAChCM,EAAuBD,EAAYT,EAAaI,GAEhDO,EAAeP,EAAgB,EAAII,EAAeT,EAClDa,EAAuBR,EAAgB,EAAIM,EAAuBV,EAExEa,EAAgCC,GAAS,GAAKC,EAAAC,EAAAH,EAAA,GAAvCI,EAASF,EAAA,GAAEG,EAAUH,EAAA,GAC5BI,EAA4BL,EAASH,QAAAA,EAAgBC,GAAqBQ,EAAAJ,EAAAG,EAAA,GAAnEE,EAAMD,EAAA,GAAEE,EAASF,EAAA,GAElBG,EAAaC,EAA6C,MAC1DC,EAAmB,WACnBF,EAAWG,UACbC,aAAaJ,EAAWG,SACxBH,EAAWG,QAAU,MAEvBH,EAAWG,QAAUE,YAAW,WAC1BX,GAAWC,GAAW,EAC3B,GAAE,IACJ,EAEDW,GAAU,WACRP,EAAUX,QAAAA,EAAgBC,GAC1BM,GAAW,EACb,GAAG,CAACP,EAAcC,IAElB,IAGQkB,EAHFC,EAAiBd,GAAaf,EAAUA,EAAU8B,QASxD,OACEC,EAACC,EAAQ,CAAAC,SAAA,CACNJ,EACDC,EAAA,MAAAI,EAAAA,EAAAA,EAAA,CAAA,EACM/B,IAVFyB,EAAiC,CAAE,EACrCzB,EAAMgC,QAAOP,EAAIO,MAAQhC,EAAMgC,OAC/BpB,IAAWa,EAAIO,MAAKD,EAAAA,EAAA,CAAA,EAAQN,EAAIO,OAAK,GAAA,CAAEC,OAAQ,cAAeC,WAAY,6BACvET,IAQW,CAAA,EAAA,CACd/B,IAAKsB,EACLpB,IAAKA,EACLuC,YAAa,WAAF,OAAQtB,GAAW,EAAK,EACnCuB,OAAQ,WACNvB,GAAW,GACXO,GACD,EACDiB,QAAS,WACPpB,EAAUtB,GACVkB,GAAW,GACXO,GACF,OAIR"}

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

@@ -0,0 +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,Typography as h,Divider as f,Box 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:y.titlePanel,children:[r.renderTitle(t.title),l(f,{}),l(b,{className:y.content,children:r.renderContent(t.content)})]}):l(h,{variant:"body2",children:"Please provide a panel configuration"})})),e(r,"renderTitle",(function(e){return e?"string"!=typeof e?e:l(h,{variant:"subtitle1",className:y.title,children:e}):null})),e(r,"renderContent",(function(e){return e?"string"!=typeof e?e:l(h,{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:y.root},null==a?void 0:a.tooltipProps),{},{children:l(d,{children:t})}))}}])}(),y={root:"RichTooltip-root",titlePanel:"RichTooltip-titlePanel",title:"RichTooltip-title",content:"RichTooltip-content"},P=function(e,t){return"".concat((null==t?void 0:t.prefix)||"",".").concat(y[e]).concat((null==t?void 0:t.suffix)||"")},k=s(d)((function(t){var r=t.theme;return e(e(e({},P("titlePanel",{prefix:"&"}),{gap:"6px"}),P("title"),{color:r.palette.primary.main,fontWeight:700,padding:r.spacing(1,1.5,0)}),P("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};
+//# sourceMappingURL=rich-tooltip.js.map

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

@@ -0,0 +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 { 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  }\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        <Stack>{children}</Stack>\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","Stack","getRichTooltipClass","options","prefix","suffix","styled","_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":"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"}

package/dist/src/components/text-editor.js

@@ -0,0 +1,2 @@
+import{inherits as r,createClass as e,classCallCheck as o,callSuper as t,defineProperty as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as i,jsx as a}from"react/jsx-runtime";import{Component as n}from"react";import{styled as s,Box as d}from"@mui/material";import u from"react-quill";import"react-quill/dist/quill.snow.css";var p={root:"DinoTextEditor-root",fullscreen:"DinoTextEditor-fullscreen"},h={formats:["header","bold","italic","underline","strike","blockquote","list","bullet","indent","link","image","align","color","background"],modules:{toolbar:[[{header:[1,2,3,4,5,6,!1]}],["bold","italic","underline","strike","blockquote"],[{align:""},{align:"center"},{align:"right"},{align:"justify"}],[{list:"ordered"},{list:"bullet"},{indent:"-1"},{indent:"+1"}],[{color:[]},{background:[]}],["link","image"],["clean"]]}},c=function(){function s(r){var e,i;return o(this,s),i=t(this,s,[r]),l(i,"handleChange",(function(r){var e=r;"<p><br></p>"===r&&(e=""),i.setState({value:e})})),l(i,"id",0),i.state={value:null!==(e=r.defautValue)&&void 0!==e?e:""},i}return r(s,n),e(s,[{key:"render",value:function(){var r=[p.root];return this.props.error&&r.push("error"),i(f,{id:this.props.id,sx:this.props.sx,className:r.join(" "),children:[!this.props.readOnly&&a("input",{name:this.props.name,defaultValue:this.state.value,hidden:!0},++this.id),a(u,{readOnly:this.props.readOnly,placeholder:"Enter the message",value:this.state.value,modules:h.modules,formats:h.formats,onChange:this.handleChange,onBlur:this.props.onBlur})]})}}])}(),m="#d32f2f",f=s(d)({margin:0,minHeight:"450px",display:"flex","& .quill":{flex:1},"& .ql-container":{height:"calc(100% - 42px)",borderBottomLeftRadius:"6px",borderBottomRightRadius:"6px"},"& .ql-toolbar":{borderTopLeftRadius:"6px",borderTopRightRadius:"6px"},"&.error .ql-toolbar":{borderTopColor:m,borderLeftColor:m,borderRightColor:m},"&.error .ql-container":{borderBottomColor:m,borderLeftColor:m,borderRightColor:m},"&.error .ql-editor.ql-blank::before":{color:m}});export{c as default,p as textEditorClasses};
+//# sourceMappingURL=text-editor.js.map

package/dist/src/components/text-editor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-editor.js","sources":["../../../src/components/text-editor.tsx"],"sourcesContent":["// /* eslint-disable @typescript-eslint/no-explicit-any */\r\nimport React, { Component } from 'react'\r\nimport { Box, styled, SxProps, Theme } from '@mui/material'\r\n/**\r\n * yarn add react-quill@2.0.0\r\n */\r\nimport ReactQuill from 'react-quill'\r\nimport 'react-quill/dist/quill.snow.css'\r\n\r\nexport const textEditorClasses = {\r\n  root: 'DinoTextEditor-root',\r\n  fullscreen: 'DinoTextEditor-fullscreen'\r\n}\r\n\r\nconst EditorToolbar: any = {}\r\n\r\nEditorToolbar.formats = [\r\n  'header',\r\n  'bold',\r\n  'italic',\r\n  'underline',\r\n  'strike',\r\n  'blockquote',\r\n  'list',\r\n  'bullet',\r\n  'indent',\r\n  'link',\r\n  'image',\r\n  'align',\r\n  'color',\r\n  'background'\r\n]\r\n\r\nEditorToolbar.modules = {\r\n  toolbar: [\r\n    [{ header: [1, 2, 3, 4, 5, 6, false] }],\r\n    ['bold', 'italic', 'underline', 'strike', 'blockquote'],\r\n    [{ align: '' }, { align: 'center' }, { align: 'right' }, { align: 'justify' }],\r\n    [{ list: 'ordered' }, { list: 'bullet' }, { indent: '-1' }, { indent: '+1' }],\r\n    [{ color: [] }, { background: [] }],\r\n    ['link', 'image'],\r\n    ['clean']\r\n  ]\r\n}\r\n\r\nexport interface ITextEditorProps {\r\n  id?: string\r\n  name: string\r\n  sx?: SxProps<Theme>\r\n  readOnly?: boolean\r\n  defautValue?: string\r\n  error?: boolean\r\n  onBlur?: () => void\r\n}\r\n\r\nexport interface ITextEditorState {\r\n  value: string\r\n}\r\n\r\nclass TextEditor extends Component<ITextEditorProps, ITextEditorState> {\r\n  constructor(props: ITextEditorProps) {\r\n    super(props)\r\n    this.state = { value: props.defautValue ?? '' }\r\n  }\r\n  handleChange = (value: string) => {\r\n    let str = value\r\n    if (value === '<p><br></p>') str = ''\r\n    this.setState({ value: str })\r\n  }\r\n\r\n  id = 0\r\n  render() {\r\n    const classes = [textEditorClasses.root]\r\n    if (this.props.error) classes.push('error')\r\n    return (\r\n      <Wrapper id={this.props.id} sx={this.props.sx} className={classes.join(' ')}>\r\n        {!this.props.readOnly && <input key={++this.id} name={this.props.name} defaultValue={this.state.value} hidden />}\r\n        <ReactQuill\r\n          readOnly={this.props.readOnly}\r\n          placeholder='Enter the message'\r\n          value={this.state.value}\r\n          modules={EditorToolbar.modules}\r\n          formats={EditorToolbar.formats}\r\n          onChange={this.handleChange}\r\n          onBlur={this.props.onBlur}\r\n        />\r\n      </Wrapper>\r\n    )\r\n  }\r\n}\r\n\r\nexport default TextEditor\r\n\r\nconst borderColor = '#d32f2f'\r\n\r\nconst Wrapper = styled(Box)({\r\n  margin: 0,\r\n  minHeight: '450px',\r\n  display: 'flex',\r\n  '& .quill': { flex: 1 },\r\n  '& .ql-container': {\r\n    height: 'calc(100% - 42px)',\r\n    borderBottomLeftRadius: '6px',\r\n    borderBottomRightRadius: '6px'\r\n  },\r\n  '& .ql-toolbar': {\r\n    borderTopLeftRadius: '6px',\r\n    borderTopRightRadius: '6px'\r\n  },\r\n  '&.error .ql-toolbar': {\r\n    borderTopColor: borderColor,\r\n    borderLeftColor: borderColor,\r\n    borderRightColor: borderColor\r\n  },\r\n  '&.error .ql-container': {\r\n    borderBottomColor: borderColor,\r\n    borderLeftColor: borderColor,\r\n    borderRightColor: borderColor\r\n  },\r\n  '&.error .ql-editor.ql-blank::before': {\r\n    color: borderColor\r\n  }\r\n})\r\n"],"names":["textEditorClasses","root","fullscreen","EditorToolbar","toolbar","header","align","list","indent","color","background","TextEditor","props","_props$defautValue","_this","_classCallCheck","_callSuper","_defineProperty","value","str","setState","state","defautValue","_inherits","Component","_createClass","key","classes","this","error","push","_jsxs","Wrapper","id","sx","className","join","children","readOnly","_jsx","name","defaultValue","hidden","ReactQuill","placeholder","modules","formats","onChange","handleChange","onBlur","borderColor","styled","Box","margin","minHeight","display","flex","height","borderBottomLeftRadius","borderBottomRightRadius","borderTopLeftRadius","borderTopRightRadius","borderTopColor","borderLeftColor","borderRightColor","borderBottomColor"],"mappings":"sVASO,IAAMA,EAAoB,CAC/BC,KAAM,sBACNC,WAAY,6BAGRC,EAAqB,CAE3BA,QAAwB,CACtB,SACA,OACA,SACA,YACA,SACA,aACA,OACA,SACA,SACA,OACA,QACA,QACA,QACA,cAGFA,QAAwB,CACtBC,QAAS,CACP,CAAC,CAAEC,OAAQ,CAAC,EAAG,EAAG,EAAG,EAAG,EAAG,GAAG,KAC9B,CAAC,OAAQ,SAAU,YAAa,SAAU,cAC1C,CAAC,CAAEC,MAAO,IAAM,CAAEA,MAAO,UAAY,CAAEA,MAAO,SAAW,CAAEA,MAAO,YAClE,CAAC,CAAEC,KAAM,WAAa,CAAEA,KAAM,UAAY,CAAEC,OAAQ,MAAQ,CAAEA,OAAQ,OACtE,CAAC,CAAEC,MAAO,IAAM,CAAEC,WAAY,KAC9B,CAAC,OAAQ,SACT,CAAC,YAkBCC,aACJ,SAAAA,EAAYC,GAAuB,IAAAC,EAAAC,EAEc,OAFdC,OAAAJ,GACjCG,EAAAE,EAAAL,KAAAA,GAAMC,IAAMK,EAAAH,EAGC,gBAAA,SAACI,GACd,IAAIC,EAAMD,EACI,gBAAVA,IAAyBC,EAAM,IACnCL,EAAKM,SAAS,CAAEF,MAAOC,OACxBF,EAAAH,EAAA,KAEI,GARHA,EAAKO,MAAQ,CAAEH,MAAwBL,QAAnBA,EAAED,EAAMU,mBAAWT,IAAAA,EAAAA,EAAI,IAAIC,CACjD,CAAC,OAAAS,EAAAZ,EAJsBa,GAItBC,EAAAd,EAAA,CAAA,CAAAe,IAAA,SAAAR,MAQD,WACE,IAAMS,EAAU,CAAC3B,EAAkBC,MAEnC,OADI2B,KAAKhB,MAAMiB,OAAOF,EAAQG,KAAK,SAEjCC,EAACC,EAAQ,CAAAC,GAAIL,KAAKhB,MAAMqB,GAAIC,GAAIN,KAAKhB,MAAMsB,GAAIC,UAAWR,EAAQS,KAAK,KACpEC,SAAA,EAACT,KAAKhB,MAAM0B,UAAYC,EAAA,QAAA,CAAuBC,KAAMZ,KAAKhB,MAAM4B,KAAMC,aAAcb,KAAKP,MAAMH,MAAOwB,QAAlE,KAAEd,KAAKK,IAC5CM,EAACI,GACCL,SAAUV,KAAKhB,MAAM0B,SACrBM,YAAY,oBACZ1B,MAAOU,KAAKP,MAAMH,MAClB2B,QAAS1C,EAAc0C,QACvBC,QAAS3C,EAAc2C,QACvBC,SAAUnB,KAAKoB,aACfC,OAAQrB,KAAKhB,MAAMqC,WAI3B,IAAC,IAKGC,EAAc,UAEdlB,EAAUmB,EAAOC,EAAPD,CAAY,CAC1BE,OAAQ,EACRC,UAAW,QACXC,QAAS,OACT,WAAY,CAAEC,KAAM,GACpB,kBAAmB,CACjBC,OAAQ,oBACRC,uBAAwB,MACxBC,wBAAyB,OAE3B,gBAAiB,CACfC,oBAAqB,MACrBC,qBAAsB,OAExB,sBAAuB,CACrBC,eAAgBZ,EAChBa,gBAAiBb,EACjBc,iBAAkBd,GAEpB,wBAAyB,CACvBe,kBAAmBf,EACnBa,gBAAiBb,EACjBc,iBAAkBd,GAEpB,sCAAuC,CACrCzC,MAAOyC"}

package/dist/src/components/text-editor.preview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-editor.preview.js","sources":["../../../src/components/text-editor.preview.tsx"],"sourcesContent":["import React, { FC } from 'react'\r\n\r\nconst TextEditorPreview: FC<{ children: string }> = (props) => {\r\n  const contentRef = React.useRef<HTMLDivElement | null>(null)\r\n\r\n  React.useEffect(() => {\r\n    // Lấy phần tử template\r\n    const template = document.createElement('template')\r\n    template.innerHTML = `\r\n      <link rel=\"stylesheet\" href=\"css/quill.snow.css\">\r\n      <div class='ql-editor'>${props.children}</div>\r\n    `\r\n\r\n    // Tạo shadow DOM và chèn nội dung từ template\r\n    if (contentRef.current) {\r\n      const shadowRoot = contentRef.current.shadowRoot || contentRef.current.attachShadow({ mode: 'open' })\r\n\r\n      shadowRoot.innerHTML = '' // Reset nội dung cũ\r\n      shadowRoot.appendChild(template.content.cloneNode(true))\r\n    }\r\n  }, [props.children])\r\n\r\n  return (\r\n    <>\r\n      <div ref={contentRef}></div>\r\n    </>\r\n  )\r\n}\r\n\r\nexport default TextEditorPreview\r\n"],"names":["TextEditorPreview","props","contentRef","React","useRef","useEffect","template","document","createElement","innerHTML","concat","children","current","shadowRoot","attachShadow","mode","appendChild","content","cloneNode","_jsx","ref"],"mappings":"2EAEA,IAAMA,EAA8C,SAACC,GACnD,IAAMC,EAAaC,EAAMC,OAA8B,MAmBvD,OAjBAD,EAAME,WAAU,WAEd,IAAMC,EAAWC,SAASC,cAAc,YAOxC,GANAF,EAASG,UAASC,6FAAAA,OAEST,EAAMU,SAChC,gBAGGT,EAAWU,QAAS,CACtB,IAAMC,EAAaX,EAAWU,QAAQC,YAAcX,EAAWU,QAAQE,aAAa,CAAEC,KAAM,SAE5FF,EAAWJ,UAAY,GACvBI,EAAWG,YAAYV,EAASW,QAAQC,WAAU,GACnD,CACH,GAAG,CAACjB,EAAMU,WAGRQ,cACEA,EAAK,MAAA,CAAAC,IAAKlB,KAGhB"}

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

@@ -0,0 +1,2 @@
+import{objectSpread2 as e}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o}from"react/jsx-runtime";import{createContext as n}from"react";var l={area:void 0,keyword:"",filterState:{},anchorEl:null},t=e(e({filterBarConfigs:{fields:{}}},l),{},{onFilterStateChange:function(){console.log("onFilterStateChange called! The context is not provider")},onKeywordChange:function(){console.log("setKeyword called! The context is not provider")},onPopperPanelChange:function(){console.log("setPanelValue called! The context is not provider")},onPanelClose:function(){console.log("onPanelClose called! The context is not provider")},onClear:function(){console.log("onClear called! The context is not provider")}}),r=n(t);function a(e){try{return o(r.Consumer,{children:e})}catch(o){return console.log(o),e(t)}}export{r as DataViewContext,t as defaultDataViewContext,l as defaultFilterBarState,a as mapDataViewContext};
+//# sourceMappingURL=context.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","sources":["../../../src/data-view/context.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\r\nimport React, { createContext, ReactNode } from 'react'\r\nimport { IFilterArea, IFilterBarConfigs, IFilterState, IFilterStateChangeHandler } from './types'\r\nimport { EViewMode } from './view-mode.types'\r\n\r\nexport interface IDataViewState<T> {\r\n  anchorEl: HTMLElement | null\r\n  area?: IFilterArea\r\n  keyword: string\r\n  filterState: IFilterState<T>\r\n  scrolled?: boolean\r\n  viewMode?: EViewMode\r\n}\r\n\r\nexport const defaultFilterBarState: IDataViewState<any> = {\r\n  area: undefined,\r\n  keyword: '',\r\n  filterState: {},\r\n  anchorEl: null\r\n}\r\n\r\nexport type OnPanelValueChange = (anchorEl: HTMLElement | null, area?: IFilterArea) => void\r\n\r\nexport interface IDataViewContext<T = any> extends IDataViewState<T> {\r\n  // State values\r\n  filterBarConfigs: IFilterBarConfigs<T>\r\n\r\n  // Action functions\r\n  onFilterStateChange: IFilterStateChangeHandler<T>\r\n  onKeywordChange: (keyword: string) => void\r\n  onPopperPanelChange: OnPanelValueChange\r\n  onPanelClose: () => void\r\n  onClear: () => void\r\n}\r\n\r\nexport interface IDataViewContextProps<T = any> {\r\n  context: IDataViewContext<T>\r\n}\r\n\r\nexport const defaultDataViewContext: IDataViewContext = {\r\n  // State values\r\n  filterBarConfigs: { fields: {} },\r\n  ...defaultFilterBarState,\r\n\r\n  // Action functions\r\n  onFilterStateChange: () => {\r\n    console.log('onFilterStateChange called! The context is not provider')\r\n  },\r\n  onKeywordChange: () => {\r\n    console.log('setKeyword called! The context is not provider')\r\n  },\r\n  onPopperPanelChange: () => {\r\n    console.log('setPanelValue called! The context is not provider')\r\n  },\r\n  onPanelClose: () => {\r\n    console.log('onPanelClose called! The context is not provider')\r\n  },\r\n  onClear: () => {\r\n    console.log('onClear called! The context is not provider')\r\n  }\r\n}\r\n\r\nexport const DataViewContext = createContext<IDataViewContext>(defaultDataViewContext)\r\n\r\nexport function mapDataViewContext<T = any>(context: (context: IDataViewContext<T>) => ReactNode): ReactNode {\r\n  try {\r\n    return <DataViewContext.Consumer>{context}</DataViewContext.Consumer>\r\n  } catch (error) {\r\n    console.log(error)\r\n    return context(defaultDataViewContext)\r\n  }\r\n}\r\n"],"names":["defaultFilterBarState","area","undefined","keyword","filterState","anchorEl","defaultDataViewContext","_objectSpread","filterBarConfigs","fields","onFilterStateChange","console","log","onKeywordChange","onPopperPanelChange","onPanelClose","onClear","DataViewContext","createContext","mapDataViewContext","context","_jsx","Consumer","children","error"],"mappings":"0JAcO,IAAMA,EAA6C,CACxDC,UAAMC,EACNC,QAAS,GACTC,YAAa,CAAE,EACfC,SAAU,MAqBCC,EAAsBC,EAAAA,EAAA,CAEjCC,iBAAkB,CAAEC,OAAQ,CAAA,IACzBT,GAAqB,GAAA,CAGxBU,oBAAqB,WACnBC,QAAQC,IAAI,0DACb,EACDC,gBAAiB,WACfF,QAAQC,IAAI,iDACb,EACDE,oBAAqB,WACnBH,QAAQC,IAAI,oDACb,EACDG,aAAc,WACZJ,QAAQC,IAAI,mDACb,EACDI,QAAS,WACPL,QAAQC,IAAI,8CACd,IAGWK,EAAkBC,EAAgCZ,GAEzD,SAAUa,EAA4BC,GAC1C,IACE,OAAOC,EAACJ,EAAgBK,SAAU,CAAAC,SAAAH,GACnC,CAAC,MAAOI,GAEP,OADAb,QAAQC,IAAIY,GACLJ,EAAQd,EAChB,CACH"}

package/dist/src/data-view/convert-filter-to-graphql.js

@@ -0,0 +1,2 @@
+import{createClass as e,classCallCheck as i,defineProperty as t,createForOfIteratorHelper as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{mapDateLogic as l}from"./helpers.js";import{createRequestBuilder as n}from"../http-service/graphql/request-param.js";import{getKeyConverter as o}from"../http-service/graphql/key-converter.js";var a=e((function e(a){var u=this;i(this,e),t(this,"fromFilter",(function(e){return u.filterStateStore=e,u})),t(this,"applySingleFilterCondition",(function(e,i){var t,r,n,o,a=null!==(t=null===(r=i.value)||void 0===r?void 0:r.toString())&&void 0!==t?t:"",u=null!==(n=i.keyConvert.deep)&&void 0!==n?n:i.keyConvert.field,v=i.keyConvert.custom;if(v)e.filterCustom(v(a),i.option);else if(u)if("date"===(null===(o=i.filter)||void 0===o?void 0:o.type)&&i.filter.dateLogic){var d=l[i.filter.dateLogic];e.filterCustom("".concat(u.toString()).concat(d,'"').concat(a,'"'),i.option)}else e.filterContains(u,a,i.option)})),t(this,"applyMulFilterCondition",(function(e,i,t){if(0!==i.length)if(1===i.length){var l=i[0];t&&(l.option=t),u.applySingleFilterCondition(e,l)}else e.scope((function(e){var t,l=r(i);try{for(l.s();!(t=l.n()).done;){var n=t.value;u.applySingleFilterCondition(e,n)}}catch(e){l.e(e)}finally{l.f()}return e}),t)})),t(this,"handleFilter",(function(e){var i,t=null===(i=u.filterStateStore)||void 0===i?void 0:i.filter;if(t){var l=Object.keys(t).filter(Boolean),n=l.reduce((function(e,i){var l,n,a=o(i,u.keyConverter),v=null!==(l=t[i])&&void 0!==l?l:[],d=r(a);try{for(d.s();!(n=d.n()).done;){var f,c=n.value,s=r(v);try{for(s.s();!(f=s.n()).done;){var p,h=f.value;if(h.value){var y=null!==(p=e[i])&&void 0!==p?p:[];y.push({value:h.value,keyConvert:c,filter:h,option:{logic:"Or"}}),e[i]=y}}}catch(e){s.e(e)}finally{s.f()}}}catch(e){d.e(e)}finally{d.f()}return e}),{});e.scope((function(i){for(var t in n){var r=n[t];r&&0!==r.length&&u.applyMulFilterCondition(1===l.length?e:i,r,{logic:"And"})}return i}),{logic:"And"})}})),t(this,"handleQuickSearch",(function(e){var i,t=null===(i=u.filterStateStore)||void 0===i?void 0:i.quickSearch;if(t&&u.quickSearchFields&&0!==u.quickSearchFields.length){var l=(Array.isArray(t)?t:[t]).map((function(e){return null==e?void 0:e.toString().trim()})).filter(Boolean);if(0!==l.length){var n=u.quickSearchFields.reduce((function(e,i){var t,n=o(i,u.keyConverter),a=r(n);try{for(a.s();!(t=a.n()).done;){var v,d=t.value,f=r(l);try{for(f.s();!(v=f.n()).done;){var c=v.value;c&&e.push({value:c,keyConvert:d})}}catch(e){f.e(e)}finally{f.f()}}}catch(e){a.e(e)}finally{a.f()}return e}),[]);n.length>0&&e.scope((function(e){var i,t=r(n);try{for(t.s();!(i=t.n()).done;){var l=i.value;u.applySingleFilterCondition(e,l)}}catch(e){t.e(e)}finally{t.f()}return e}))}}})),t(this,"handlePagination",(function(e){var i,t,r,l,n,o,a=null!==(i=null===(t=u.filterStateStore)||void 0===t?void 0:t.pagination)&&void 0!==i?i:{},v=a.page,d=a.pageSize,f=null!==(r=null!=v?v:null===(l=u.defaultFilter)||void 0===l||null===(l=l.pagination)||void 0===l?void 0:l.page)&&void 0!==r?r:0,c=null!==(n=null!=d?d:null===(o=u.defaultFilter)||void 0===o||null===(o=o.pagination)||void 0===o?void 0:o.pageSize)&&void 0!==n?n:10;e.take(c).skip(f*c)})),t(this,"handleSort",(function(e){var i,t,r,l=null!==(i=null===(t=u.filterStateStore)||void 0===t?void 0:t.sort)&&void 0!==i?i:null===(r=u.defaultFilter)||void 0===r?void 0:r.sort;if(l){var n=o(l.field,u.keyConverter);if(n.length>0){var a,v=n[0],d=null!==(a=v.deep)&&void 0!==a?a:v.field;d&&e.sort(d,{direction:"asc"===l.direction?"ASC":"DESC"})}}})),t(this,"prebuild",(function(e){return u.prebuildFunc=e,u})),t(this,"build",(function(){var e=n({ignoreEmpty:!0});return u.handleSort(e),u.handlePagination(e),u.handleQuickSearch(e),u.handleFilter(e),u.prebuildFunc&&u.prebuildFunc(e),e.build()})),this.keyConverter=a.keyConverter,this.quickSearchFields=a.quickSearchFields,this.defaultFilter=a.defaultFilter})),u=function(e){return new a(e)};export{u as createConvertFilterToGraphQL,a as default};
+//# sourceMappingURL=convert-filter-to-graphql.js.map

package/dist/src/data-view/convert-filter-to-graphql.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"convert-filter-to-graphql.js","sources":["../../../src/data-view/convert-filter-to-graphql.ts"],"sourcesContent":["import { mapDateLogic } from './helpers'\r\nimport { createRequestBuilder, IFilterOption, RequestParam } from '../http-service/graphql/request-param'\r\nimport { getKeyConverter, IKeyConverterDef, IKeyConverterModel } from '../http-service/graphql/key-converter'\r\nimport { IFilterItem, IFilterState } from './types'\r\n\r\nexport interface ISingleFilterCondition<G extends object> {\r\n  value: any\r\n  keyConvert: IKeyConverterDef<G>\r\n  option?: Partial<IFilterOption>\r\n  filter?: IFilterItem\r\n}\r\n\r\nexport interface IFilterToGraphQLParams<T, G extends object> {\r\n  keyConverter: IKeyConverterModel<T, G>\r\n  quickSearchFields?: (keyof T)[]\r\n  defaultFilter?: IFilterState<T>\r\n}\r\n\r\nclass ConvertFilterToGraphQL<T, G extends object> {\r\n  private keyConverter\r\n  private quickSearchFields?: (keyof T)[]\r\n  private defaultFilter?: IFilterState<T>\r\n\r\n  constructor(params: IFilterToGraphQLParams<T, G>) {\r\n    this.keyConverter = params.keyConverter\r\n    this.quickSearchFields = params.quickSearchFields\r\n    this.defaultFilter = params.defaultFilter\r\n  }\r\n\r\n  private filterStateStore?: IFilterState<T>\r\n  fromFilter = (filterState: IFilterState<T>) => {\r\n    this.filterStateStore = filterState\r\n    return this\r\n  }\r\n\r\n  private applySingleFilterCondition = (rp: RequestParam<G>, params: ISingleFilterCondition<G>) => {\r\n    const val = params.value?.toString() ?? ''\r\n    const targetField = (params.keyConvert.deep ?? params.keyConvert.field) as keyof G\r\n    const custom = params.keyConvert.custom\r\n    if (custom) {\r\n      rp.filterCustom(custom(val), params.option)\r\n      return\r\n    }\r\n    if (!targetField) return\r\n    if (params.filter?.type === 'date' && params.filter.dateLogic) {\r\n      const logic = mapDateLogic[params.filter.dateLogic]\r\n      rp.filterCustom(`${targetField.toString()}${logic}\"${val}\"`, params.option)\r\n      return\r\n    }\r\n    rp.filterContains(targetField, val, params.option)\r\n  }\r\n\r\n  private applyMulFilterCondition = (rp: RequestParam<G>, items: ISingleFilterCondition<G>[], option?: Partial<IFilterOption>) => {\r\n    if (items.length === 0) return\r\n    else if (items.length === 1) {\r\n      const i = items[0]\r\n      if (option) i.option = option\r\n      this.applySingleFilterCondition(rp, i)\r\n    } else {\r\n      rp.scope((q) => {\r\n        for (const item of items) {\r\n          this.applySingleFilterCondition(q, item)\r\n        }\r\n        return q\r\n      }, option)\r\n    }\r\n  }\r\n\r\n  private handleFilter = (rp: RequestParam<G>) => {\r\n    const filter = this.filterStateStore?.filter\r\n    if (!filter) return\r\n\r\n    const keys = Object.keys(filter).filter(Boolean) as (keyof T)[]\r\n    const list = keys.reduce<{ [key in keyof T]?: ISingleFilterCondition<G>[] }>((a, k) => {\r\n      const keyConverteds = getKeyConverter(k, this.keyConverter)\r\n      const items = filter[k] ?? []\r\n      for (const keyConverted of keyConverteds) {\r\n        for (const item of items) {\r\n          if (!item.value) continue\r\n          const list: ISingleFilterCondition<G>[] = a[k] ?? []\r\n          list.push({ value: item.value, keyConvert: keyConverted, filter: item, option: { logic: 'Or' } })\r\n          a[k] = list\r\n        }\r\n      }\r\n      return a\r\n    }, {})\r\n\r\n    rp.scope(\r\n      (q) => {\r\n        for (const key in list) {\r\n          const items = list[key]\r\n          if (!items || items.length === 0) continue\r\n          this.applyMulFilterCondition(keys.length === 1 ? rp : q, items, { logic: 'And' })\r\n        }\r\n        return q\r\n      },\r\n      { logic: 'And' }\r\n    )\r\n  }\r\n\r\n  private handleQuickSearch = (rp: RequestParam<G>) => {\r\n    const quickSearch = this.filterStateStore?.quickSearch\r\n    if (!quickSearch || !this.quickSearchFields || this.quickSearchFields.length === 0) return\r\n\r\n    // Convert quickSearch to array of strings\r\n    const values = Array.isArray(quickSearch) ? quickSearch : [quickSearch]\r\n    const trimmedValues = values.map((v) => v?.toString().trim()).filter(Boolean)\r\n\r\n    if (trimmedValues.length === 0) return\r\n\r\n    const list = this.quickSearchFields.reduce<ISingleFilterCondition<G>[]>((a, field) => {\r\n      const keyConverteds = getKeyConverter(field, this.keyConverter)\r\n      for (const keyConverted of keyConverteds) {\r\n        for (const val of trimmedValues) {\r\n          if (!val) continue\r\n          a.push({ value: val, keyConvert: keyConverted })\r\n        }\r\n      }\r\n      return a\r\n    }, [])\r\n\r\n    // Apply quick search with OR logic (scope)\r\n    if (list.length > 0) {\r\n      rp.scope((q) => {\r\n        for (const item of list) {\r\n          this.applySingleFilterCondition(q, item)\r\n        }\r\n        return q\r\n      })\r\n    }\r\n  }\r\n\r\n  private handlePagination = (rp: RequestParam<G>) => {\r\n    const { page, pageSize } = this.filterStateStore?.pagination ?? {}\r\n    const finalPage = page ?? this.defaultFilter?.pagination?.page ?? 0\r\n    const finalPageSize = pageSize ?? this.defaultFilter?.pagination?.pageSize ?? 10\r\n    rp.take(finalPageSize).skip(finalPage * finalPageSize)\r\n  }\r\n\r\n  private handleSort = (rp: RequestParam<G>) => {\r\n    const sort = this.filterStateStore?.sort ?? this.defaultFilter?.sort\r\n    if (!sort) return\r\n\r\n    const keyConverteds = getKeyConverter(sort.field, this.keyConverter)\r\n    if (keyConverteds.length > 0) {\r\n      const keyConverted = keyConverteds[0] // Use first converter for sorting\r\n      const targetField = (keyConverted.deep ?? keyConverted.field) as keyof G\r\n\r\n      if (targetField) {\r\n        rp.sort(targetField, { direction: sort.direction === 'asc' ? 'ASC' : 'DESC' })\r\n      }\r\n    }\r\n  }\r\n\r\n  private prebuildFunc?: (rp: RequestParam<G>) => RequestParam<G>\r\n  prebuild = (func: (requestParam: RequestParam<G>) => RequestParam<G>) => {\r\n    this.prebuildFunc = func\r\n    return this\r\n  }\r\n\r\n  build = () => {\r\n    const requestBuilder = createRequestBuilder<G>({ ignoreEmpty: true })\r\n    this.handleSort(requestBuilder)\r\n    this.handlePagination(requestBuilder)\r\n    this.handleQuickSearch(requestBuilder)\r\n    this.handleFilter(requestBuilder)\r\n    if (this.prebuildFunc) this.prebuildFunc(requestBuilder)\r\n    return requestBuilder.build()\r\n  }\r\n}\r\nexport default ConvertFilterToGraphQL\r\n\r\nexport const createConvertFilterToGraphQL = <T, G extends object>(params: IFilterToGraphQLParams<T, G>) => {\r\n  return new ConvertFilterToGraphQL<T, G>(params)\r\n}\r\n"],"names":["ConvertFilterToGraphQL","_createClass","params","_this","this","_classCallCheck","_defineProperty","filterState","filterStateStore","rp","_params$value$toStrin","_params$value","_params$keyConvert$de","_params$filter","val","value","toString","targetField","keyConvert","deep","field","custom","filterCustom","option","filter","type","dateLogic","logic","mapDateLogic","concat","filterContains","items","length","i","applySingleFilterCondition","scope","q","_step","_iterator","_createForOfIteratorHelper","s","n","done","item","err","e","f","_this$filterStateStor","keys","Object","Boolean","list","reduce","a","k","_filter$k","_step2","keyConverteds","getKeyConverter","keyConverter","_iterator2","_step3","keyConverted","_iterator3","_a$k","push","key","applyMulFilterCondition","_this$filterStateStor2","quickSearch","quickSearchFields","trimmedValues","Array","isArray","map","v","trim","_step4","_iterator4","_step5","_iterator5","_step6","_iterator6","_this$filterStateStor3","_this$filterStateStor4","_ref2","_this$defaultFilter","_ref3","_this$defaultFilter2","_ref","pagination","page","pageSize","finalPage","defaultFilter","finalPageSize","take","skip","_this$filterStateStor5","_this$filterStateStor6","_this$defaultFilter3","sort","_keyConverted$deep","direction","func","prebuildFunc","requestBuilder","createRequestBuilder","ignoreEmpty","handleSort","handlePagination","handleQuickSearch","handleFilter","build","createConvertFilterToGraphQL"],"mappings":"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"}

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

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

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

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

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

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

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

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

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

@@ -0,0 +1,2 @@
+import{defineProperty as e,inherits as t,createClass as a,classCallCheck as r,callSuper as n,objectSpread2 as o}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i,jsxs as l}from"react/jsx-runtime";import{Component as p}from"react";import{styled as c,Box as s,colors as d}from"@mui/material";import u from"@mui/material/ClickAwayListener";import{createFilterStore as f}from"./filter-store.js";import{FilterButton as h,FilterInput as g,FilterInputAdornment as m}from"./ui.units.js";import{mapDataViewContext as b,defaultDataViewContext as v}from"./context.js";var x={root:"FilterBar-root",content:"FilterBar-content",input:"FilterBar-input",inputWrap:"FilterBar-inputWrap",label:"FilterBar-label",button:"FilterBar-button",spacing:"FilterBar-spacing",sticky:"FilterBar-sticky",shadow:"FilterBar-shadow"};function C(){var c=function(){function c(){var t;r(this,c);for(var a=arguments.length,o=new Array(a),i=0;i<a;i++)o[i]=arguments[i];return t=n(this,c,[].concat(o)),e(t,"dataViewContext",v),e(t,"refInput",null),e(t,"refBeforeInput",null),e(t,"getRootClasses",(function(){var e,a=null!==(e=t.dataViewContext.filterBarConfigs.enableSticky)&&void 0!==e&&e,r=[x.root];return a&&r.push(x.sticky),t.dataViewContext.scrolled&&r.push(x.shadow),r.join(" ")})),e(t,"handleKeyDown",(function(e){var a=e.keyCode;if(13===a)e.stopPropagation(),e.preventDefault(),t.handleEnterSearch();else if(27===a){var r;e.stopPropagation(),e.preventDefault(),null===(r=t.refInput)||void 0===r||r.blur(),t.dataViewContext.onPanelClose()}})),e(t,"handleEnterSearch",(function(){var e;if(t.dataViewContext.keyword){var a=f(t.dataViewContext.filterState);a.addQuickSearch(t.dataViewContext.keyword,{reason:"quickSearch",area:"input"});var r,n=a.build();if(null!==(e=n.details)&&void 0!==e&&e.isChanged)null===(r=t.refInput)||void 0===r||r.blur(),t.dataViewContext.onFilterStateChange(n)}})),e(t,"handleClear",(function(){var e;null===(e=t.refInput)||void 0===e||e.blur(),t.dataViewContext.onClear()})),t}return t(c,p),a(c,[{key:"render",value:function(){var e=this;return b((function(t){var a,r,n,p=t.filterBarConfigs,c=p.id;return e.dataViewContext=t,i(u,{onClickAway:function(){return t.onPopperPanelChange(null)},children:l(k,o(o({className:e.getRootClasses()},null===(a=e.props.slots)||void 0===a?void 0:a.wrapProps),{},{children:[l("div",{className:x.content,children:[null===(r=e.props.slots)||void 0===r?void 0:r.left,l("div",{className:x.inputWrap,children:[i(h,{className:x.button,onClick:function(e){t.onPopperPanelChange(e.currentTarget,"filterButton")}}),l(s,{component:"label",htmlFor:c,className:x.label,children:[i(s,{ref:function(t){e.refBeforeInput=t}}),i(g,{ref:function(t){e.refInput=t},id:c,className:x.input,placeholder:p.placeholder,onChange:function(e){return t.onKeywordChange(e.target.value)},value:t.keyword,onFocus:function(){e.refBeforeInput&&t.onPopperPanelChange(e.refBeforeInput,"input")},onKeyDown:e.handleKeyDown,endAdornment:i(m,{notes:p.notes,keyword:t.keyword,onEnterSearch:e.handleEnterSearch,onClear:e.handleClear})})]})]}),null===(n=e.props.slots)||void 0===n?void 0:n.right]}),e.props.children]}))})}))}}])}();return c}var k=c(s)((function(t){var a=t.theme;return e(e(e(e(e(e(e({marginBottom:"4px",marginLeft:"-6px",marginRight:"-6px"},"&.".concat(x.sticky),{position:"sticky",top:"var(--height-header, 0)",zIndex:a.zIndex.appBar-1}),".".concat(x.content),{display:"flex",gap:"8px",alignItems:"center",flexWrap:"wrap",padding:a.spacing(1.5,0,.75),position:"relative",backgroundColor:a.palette.background.paper,"&::after":{content:'""',position:"absolute",top:"100%",left:0,width:"100%",height:"6px",pointerEvents:"none",background:"linear-gradient(to bottom, rgba(0, 0, 0, 0.2), transparent)",maskImage:"linear-gradient(to right, transparent, black 20%, black 80%, transparent)",WebkitMaskImage:"linear-gradient(to right, transparent, black 20%, black 80%, transparent)",opacity:0}}),"&.".concat(x.shadow," .").concat(x.content),{"&::after":{transition:"opacity 0.2s ease-in-out",transitionDelay:"0.2s",opacity:1}}),".".concat(x.input),{input:{padding:"4px 0 5px"}}),".".concat(x.inputWrap),{flex:1,display:"flex",alignItems:"center",minHeight:"var(--filter-bar-height, 40px)",gap:"8px",borderRadius:"6px",transition:"all linear 0.2s",padding:"0 8px",backgroundColor:a.palette.background.paper,border:"1px solid var(--color-divider, rgba(145 158 171 / 20%))","&:hover":{backgroundColor:"dark"===a.palette.mode?a.palette.grey[900]:d.grey[50],borderColor:"dark"===a.palette.mode?d.blue[300]:d.blue[200]},"&:focus-within":{backgroundColor:"dark"===a.palette.mode?a.palette.grey[900]:d.grey[50],borderColor:"dark"===a.palette.mode?d.blue[300]:d.blue[400],boxShadow:"dark"===a.palette.mode?"0 0 0 2px ".concat(d.blue[200]):"0 0 0 2px ".concat(d.blue[100])}}),".".concat(x.label),{flex:1,display:"flex",alignItems:"flex-end"}),".".concat(x.spacing),{flex:1,height:"var(--filter-bar-height, 40px)"})}));export{C as createFilterBar,C as default,x as filterBarClasses};
+//# sourceMappingURL=create.filter-bar.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"create.filter-bar.js","sources":["../../../src/data-view/create.filter-bar.tsx"],"sourcesContent":["import React, { Component, PropsWithChildren } from 'react'\r\nimport { Box, BoxProps, colors, styled } from '@mui/material'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport { IPositionElement } from './types'\r\nimport { createFilterStore } from './filter-store'\r\nimport { FilterButton, FilterInput, FilterInputAdornment } from './ui.units'\r\nimport { defaultDataViewContext, IDataViewContext, mapDataViewContext } from './context'\r\n\r\nexport const filterBarClasses = {\r\n  root: 'FilterBar-root',\r\n  content: 'FilterBar-content',\r\n  input: 'FilterBar-input',\r\n  inputWrap: 'FilterBar-inputWrap',\r\n  label: 'FilterBar-label',\r\n  button: 'FilterBar-button',\r\n  spacing: 'FilterBar-spacing',\r\n  panel: 'FilterBar-panel',\r\n  sticky: 'FilterBar-sticky',\r\n  shadow: 'FilterBar-shadow',\r\n  helpText: 'FilterBar-helpText'\r\n}\r\n\r\nexport interface IFilterBarSlots extends IPositionElement<'left' | 'right'> {\r\n  wrapProps?: BoxProps\r\n}\r\n\r\nexport interface IFilterBarProps extends PropsWithChildren {\r\n  slots?: IFilterBarSlots\r\n}\r\n\r\nexport function createFilterBar<T>() {\r\n  class FilterBar extends Component<IFilterBarProps> {\r\n    dataViewContext: IDataViewContext<T> = defaultDataViewContext\r\n\r\n    refInput: HTMLInputElement | null = null\r\n    refBeforeInput: HTMLElement | null = null\r\n    render() {\r\n      return mapDataViewContext((context) => {\r\n        const configs = context.filterBarConfigs\r\n        const id = configs.id\r\n        this.dataViewContext = context\r\n        return (\r\n          <ClickAwayListener onClickAway={() => context.onPopperPanelChange(null)}>\r\n            <FilterBarStyled className={this.getRootClasses()} {...this.props.slots?.wrapProps}>\r\n              <div className={filterBarClasses.content}>\r\n                {this.props.slots?.left}\r\n                <div className={filterBarClasses.inputWrap}>\r\n                  <FilterButton\r\n                    className={filterBarClasses.button}\r\n                    onClick={(e) => {\r\n                      context.onPopperPanelChange(e.currentTarget, 'filterButton')\r\n                    }}\r\n                  />\r\n                  <Box component='label' htmlFor={id} className={filterBarClasses.label}>\r\n                    <Box\r\n                      ref={(ref: HTMLElement) => {\r\n                        this.refBeforeInput = ref\r\n                      }}\r\n                    />\r\n                    <FilterInput\r\n                      ref={(ref: HTMLInputElement) => {\r\n                        this.refInput = ref\r\n                      }}\r\n                      id={id}\r\n                      className={filterBarClasses.input}\r\n                      placeholder={configs.placeholder}\r\n                      onChange={(e) => context.onKeywordChange(e.target.value)}\r\n                      value={context.keyword}\r\n                      onFocus={() => {\r\n                        if (!this.refBeforeInput) return\r\n                        context.onPopperPanelChange(this.refBeforeInput, 'input')\r\n                      }}\r\n                      onKeyDown={this.handleKeyDown}\r\n                      endAdornment={\r\n                        <FilterInputAdornment\r\n                          notes={configs.notes}\r\n                          keyword={context.keyword}\r\n                          onEnterSearch={this.handleEnterSearch}\r\n                          onClear={this.handleClear}\r\n                        />\r\n                      }\r\n                    />\r\n                  </Box>\r\n                </div>\r\n                {this.props.slots?.right}\r\n              </div>\r\n              {this.props.children}\r\n            </FilterBarStyled>\r\n          </ClickAwayListener>\r\n        )\r\n      })\r\n    }\r\n\r\n    getRootClasses = () => {\r\n      const enableSticky = this.dataViewContext.filterBarConfigs.enableSticky ?? false\r\n      const classes: string[] = [filterBarClasses.root]\r\n      if (enableSticky) classes.push(filterBarClasses.sticky)\r\n      if (this.dataViewContext.scrolled) classes.push(filterBarClasses.shadow)\r\n      return classes.join(' ')\r\n    }\r\n\r\n    handleKeyDown: React.KeyboardEventHandler<HTMLInputElement | HTMLTextAreaElement> = (event) => {\r\n      const keyCode: number = event.keyCode\r\n      if (keyCode === 13) {\r\n        event.stopPropagation()\r\n        event.preventDefault()\r\n        this.handleEnterSearch()\r\n      } else if (keyCode === 27) {\r\n        event.stopPropagation()\r\n        event.preventDefault()\r\n        this.refInput?.blur()\r\n        this.dataViewContext.onPanelClose()\r\n      }\r\n    }\r\n\r\n    handleEnterSearch = () => {\r\n      if (!this.dataViewContext.keyword) return\r\n      const store = createFilterStore<T>(this.dataViewContext.filterState)\r\n      store.addQuickSearch(this.dataViewContext.keyword, { reason: 'quickSearch', area: 'input' })\r\n      const temp = store.build()\r\n      if (!!temp.details?.isChanged) {\r\n        this.refInput?.blur()\r\n        this.dataViewContext.onFilterStateChange(temp)\r\n      }\r\n    }\r\n\r\n    handleClear = () => {\r\n      this.refInput?.blur()\r\n      this.dataViewContext.onClear()\r\n    }\r\n  }\r\n  return FilterBar\r\n}\r\nexport default createFilterBar\r\n\r\nconst FilterBarStyled = styled(Box)(({ theme }) => ({\r\n  marginBottom: '4px',\r\n  marginLeft: '-6px',\r\n  marginRight: '-6px',\r\n  [`&.${filterBarClasses.sticky}`]: {\r\n    position: 'sticky',\r\n    top: 'var(--height-header, 0)',\r\n    zIndex: theme.zIndex.appBar - 1\r\n  },\r\n  [`.${filterBarClasses.content}`]: {\r\n    display: 'flex',\r\n    gap: '8px',\r\n    alignItems: 'center',\r\n    flexWrap: 'wrap',\r\n    padding: theme.spacing(1.5, 0, 0.75),\r\n    position: 'relative',\r\n    backgroundColor: theme.palette.background.paper,\r\n    '&::after': {\r\n      content: '\"\"',\r\n      position: 'absolute',\r\n      top: '100%',\r\n      left: 0,\r\n      width: '100%',\r\n      height: '6px',\r\n      pointerEvents: 'none',\r\n      background: 'linear-gradient(to bottom, rgba(0, 0, 0, 0.2), transparent)',\r\n      maskImage: 'linear-gradient(to right, transparent, black 20%, black 80%, transparent)',\r\n      WebkitMaskImage: 'linear-gradient(to right, transparent, black 20%, black 80%, transparent)',\r\n      opacity: 0\r\n    }\r\n  },\r\n  [`&.${filterBarClasses.shadow} .${filterBarClasses.content}`]: {\r\n    '&::after': { transition: 'opacity 0.2s ease-in-out', transitionDelay: '0.2s', opacity: 1 }\r\n  },\r\n  [`.${filterBarClasses.input}`]: { input: { padding: '4px 0 5px' } },\r\n  [`.${filterBarClasses.inputWrap}`]: {\r\n    flex: 1,\r\n    display: 'flex',\r\n    alignItems: 'center',\r\n    minHeight: 'var(--filter-bar-height, 40px)',\r\n    gap: '8px',\r\n    borderRadius: '6px',\r\n    transition: 'all linear 0.2s',\r\n    padding: '0 8px',\r\n    backgroundColor: theme.palette.background.paper,\r\n    border: '1px solid var(--color-divider, rgba(145 158 171 / 20%))',\r\n    '&:hover': {\r\n      backgroundColor: theme.palette.mode === 'dark' ? theme.palette.grey[900] : colors.grey[50],\r\n      borderColor: theme.palette.mode === 'dark' ? colors.blue[300] : colors.blue[200]\r\n    },\r\n    '&:focus-within': {\r\n      backgroundColor: theme.palette.mode === 'dark' ? theme.palette.grey[900] : colors.grey[50],\r\n      borderColor: theme.palette.mode === 'dark' ? colors.blue[300] : colors.blue[400],\r\n      boxShadow: theme.palette.mode === 'dark' ? `0 0 0 2px ${colors.blue[200]}` : `0 0 0 2px ${colors.blue[100]}`\r\n    }\r\n  },\r\n  [`.${filterBarClasses.label}`]: { flex: 1, display: 'flex', alignItems: 'flex-end' },\r\n  [`.${filterBarClasses.spacing}`]: { flex: 1, height: 'var(--filter-bar-height, 40px)' }\r\n}))\r\n"],"names":["filterBarClasses","root","content","input","inputWrap","label","button","spacing","sticky","shadow","createFilterBar","FilterBar","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","defaultDataViewContext","_this$dataViewContext","enableSticky","dataViewContext","filterBarConfigs","classes","push","scrolled","join","event","keyCode","stopPropagation","preventDefault","handleEnterSearch","_this$refInput","refInput","blur","onPanelClose","_temp$details","keyword","store","createFilterStore","filterState","addQuickSearch","reason","area","_this$refInput2","temp","build","details","isChanged","onFilterStateChange","_this$refInput3","onClear","_inherits","Component","_createClass","key","value","_this2","mapDataViewContext","context","_this2$props$slots","_this2$props$slots2","_this2$props$slots3","configs","id","_jsx","ClickAwayListener","onClickAway","onPopperPanelChange","children","_jsxs","FilterBarStyled","_objectSpread","className","getRootClasses","props","slots","wrapProps","left","FilterButton","onClick","e","currentTarget","Box","component","htmlFor","ref","refBeforeInput","FilterInput","placeholder","onChange","onKeywordChange","target","onFocus","onKeyDown","handleKeyDown","endAdornment","FilterInputAdornment","notes","onEnterSearch","handleClear","right","styled","_ref3","theme","marginBottom","marginLeft","marginRight","position","top","zIndex","appBar","display","gap","alignItems","flexWrap","padding","backgroundColor","palette","background","paper","width","height","pointerEvents","maskImage","WebkitMaskImage","opacity","transition","transitionDelay","flex","minHeight","borderRadius","border","mode","grey","colors","borderColor","blue","boxShadow"],"mappings":"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"}

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

@@ -0,0 +1,2 @@
+import{defineProperty as t,inherits as e,createClass as i,classCallCheck as r,callSuper as n}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as a}from"react/jsx-runtime";import{Fragment as o,Component as d}from"react";import{styled as s,MenuList as u,Box as f,MenuItem as v,Button as c}from"@mui/material";import{createFilterStore as g}from"./filter-store.js";import{mapDataViewContext as m}from"./context.js";import{filterMenuClasses as p,getFieldsValidation as S,convertFormDataToJson as h,filterFieldValidated as y}from"./helpers.js";import{MenuWithTypeString as C,MenuWithTypeDateRange as b,MenuWithTypeDate as R,MenuWithTypeSelectMulti as x,MenuWithTypeSelect as F}from"./ui.units.js";function B(){return function(){function s(e){var i;return r(this,s),i=n(this,s,[e]),t(i,"renderForm",(function(t,e){return a("form",{onSubmit:function(r){return i.handleSubmit(r,t,e)},children:[i.renderWithMode(t,e),a(E,{children:[l(c,{size:"small",color:"inherit",onClick:t.onPanelClose,children:"Cancel"}),l(c,{size:"small",color:"primary",type:"submit",sx:{fontWeight:700},children:"Apply"})]})]})})),t(i,"renderWithMode",(function(t,e){var r,n=null===(r=t.filterBarConfigs.fields)||void 0===r?void 0:r[e];switch(null==n?void 0:n.type){case"select":return l(F,{name:e.toString(),fieldConfig:n,validationResult:i.state.validationResult,onChange:function(){return i.setState({validationResult:void 0})}});case"select-multi":return l(x,{name:e.toString(),fieldConfig:n,validationResult:i.state.validationResult,onChange:function(){return i.setState({validationResult:void 0})}});case"date":return l(R,{name:e.toString(),fieldConfig:n,validationResult:i.state.validationResult});case"date-range":return l(b,{name:e.toString(),fieldConfig:n,validationResult:i.state.validationResult});default:return l(C,{name:e.toString(),fieldConfig:n,validationResult:i.state.validationResult})}})),t(i,"handleSubmit",(function(t,e,r){null==t||t.preventDefault(),null==t||t.stopPropagation();var n=new FormData(null==t?void 0:t.currentTarget),l=i.formValidate(n,r,e);l.hasError?i.setState({validationResult:l}):i.addFilter(n,e,r)})),t(i,"formValidate",(function(t,e,i){var r=h(t),n=S(i.filterBarConfigs.fields||{})[e];if("select-multi"===(null==n?void 0:n.type)){if(0===t.getAll(e.toString()).length)return{hasError:!0,message:"Please select at least one option"}}else if("date-range"===(null==n?void 0:n.type)){var l,a,o=null===(l=t.get("".concat(e.toString(),"_start")))||void 0===l?void 0:l.toString(),d=null===(a=t.get("".concat(e.toString(),"_end")))||void 0===a?void 0:a.toString();if(!o||!d)return{hasError:!0,message:"Please select both start and end dates"};if(new Date(o)>new Date(d))return{hasError:!0,message:"Start date must be before end date"}}else{var s,u=null===(s=r[e])||void 0===s?void 0:s.toString(),f=y(null!=u?u:"",e,n);if(f.error)return{hasError:!0,message:f.message}}return{hasError:!1}})),t(i,"addFilter",(function(t,e,i){var r,n,l=S(e.filterBarConfigs.fields||{})[i],a=g((null==e?void 0:e.filterState)||{}),o=h(t),d=(null===(r=t.get("filterLogic"))||void 0===r?void 0:r.toString())||"and",s=(null===(n=t.get("dateRangeLogic"))||void 0===n?void 0:n.toString())||"between";if("date-range"===(null==l?void 0:l.type)){var u,f,v=null===(u=t.get("".concat(i.toString(),"_start")))||void 0===u?void 0:u.toString(),c=null===(f=t.get("".concat(i.toString(),"_end")))||void 0===f?void 0:f.toString();if(v&&c){var m={type:"date-range",startDate:v,endDate:c,dateRangeLogic:s,label:"".concat(v," to ").concat(c)};a.addFilterItem(i,m,{reason:"filter",area:"filterButton"})}}else if("date"===(null==l?void 0:l.type)){var p,y=null===(p=o[i])||void 0===p?void 0:p.toString();if(y){var C,b={type:"date",value:y,dateLogic:(null===(C=t.get("dateLogic"))||void 0===C?void 0:C.toString())||"before"};a.removeFilterField(i,{reason:"filter"}),a.addFilterItem(i,b,{reason:"filter",area:"filterButton"})}}else{var R=[];if("select-multi"===(null==l?void 0:l.type)){var x=o[i];Array.isArray(x)?R=x.map((function(t){return t.toString()})):x&&(R=[x.toString()])}else{var F,B=null===(F=o[i])||void 0===F?void 0:F.toString();B&&(R=[B])}R.forEach((function(t){var e,r=void 0;"select"!==(null==l?void 0:l.type)&&"select-multi"!==(null==l?void 0:l.type)||(r=null===(e=l.options.find((function(e){return e.value===t})))||void 0===e?void 0:e.label);var n={type:(null==l?void 0:l.type)||"string",value:t,label:r};"string"!==(null==l?void 0:l.type)&&(n.type=null==l?void 0:l.type),"select-multi"===(null==l?void 0:l.type)&&(n.logic=d),a.addFilterItem(i,n,{reason:"filter",area:"filterButton"})}))}e.onFilterStateChange(a.build())})),i.state={fieldSelected:null},i}return e(s,d),i(s,[{key:"render",value:function(){var t=this;return m((function(e){var i=t.state.fieldSelected;if(i)return t.renderForm(e,i);var r=S(e.filterBarConfigs.fields||{}),n=Object.keys(r);return l(j,{className:p.list,sx:{minWidth:"200px"},children:n.map((function(i,r){var n,a,d=null===(n=e.filterBarConfigs.fields)||void 0===n?void 0:n[i];return d?l(v,{className:p.item,onClick:function(){return t.setState({fieldSelected:i,validationResult:void 0})},children:null!==(a=null==d?void 0:d.label)&&void 0!==a?a:i.toString()},i.toString()+r):l(o,{},i.toString()+r)}))})}))}}])}()}var j=s(u)(t({padding:0},".".concat(p.item),{height:"var(--filter-item-height, 40px)",padding:"0 16px","&:not(:last-child)":{borderBottom:"1px solid var(--color-divider, rgba(145 160 170 / 10%))"}})),E=s(f)({display:"flex",alignItems:"center",justifyContent:"flex-end",padding:"8px"});export{B as default};
+//# sourceMappingURL=create.filter-menu.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"create.filter-menu.js","sources":["../../../src/data-view/create.filter-menu.tsx"],"sourcesContent":["import React, { Component, ComponentType, Fragment } from 'react'\r\nimport { Box, Button, MenuItem, MenuList, styled } from '@mui/material'\r\nimport { createFilterStore } from './filter-store'\r\nimport { IDataViewContext, mapDataViewContext } from './context'\r\nimport { convertFormDataToJson, filterFieldValidated, filterMenuClasses, getFieldsValidation } from './helpers'\r\nimport { IFilterConfigs, IValidationResult, IFilterLogic, IFilterItem, IFilterDateLogic, IFilterDateRangeLogic } from './types'\r\nimport { MenuWithTypeSelect, MenuWithTypeSelectMulti, MenuWithTypeString, MenuWithTypeDate, MenuWithTypeDateRange } from './ui.units'\r\n\r\nexport interface IFilterMenuProps {}\r\n\r\nexport interface IFilterMenuState<T> {\r\n  fieldSelected: keyof IFilterConfigs<T> | null\r\n  validationResult?: IValidationResult\r\n}\r\n\r\nfunction createFilterMenu<T>(): ComponentType<IFilterMenuProps> {\r\n  class FilterMenu extends Component<IFilterMenuProps, IFilterMenuState<T>> {\r\n    constructor(props: IFilterMenuProps) {\r\n      super(props)\r\n      this.state = {\r\n        fieldSelected: null\r\n      }\r\n    }\r\n\r\n    render() {\r\n      return mapDataViewContext<T>((context) => {\r\n        const { fieldSelected } = this.state\r\n        if (!!fieldSelected) return this.renderForm(context, fieldSelected)\r\n        const fieldsValidation = getFieldsValidation<T>(context.filterBarConfigs.fields || {})\r\n        const keys = Object.keys(fieldsValidation) as (keyof T)[]\r\n        return (\r\n          <MenuListCustom className={filterMenuClasses.list} sx={{ minWidth: '200px' }}>\r\n            {keys.map((x, i) => {\r\n              const item = context.filterBarConfigs.fields?.[x]\r\n              if (!item) return <Fragment key={x.toString() + i} />\r\n              return (\r\n                <MenuItem\r\n                  key={x.toString() + i}\r\n                  className={filterMenuClasses.item}\r\n                  onClick={() => this.setState({ fieldSelected: x, validationResult: undefined })}\r\n                >\r\n                  {item?.label ?? x.toString()}\r\n                </MenuItem>\r\n              )\r\n            })}\r\n          </MenuListCustom>\r\n        )\r\n      })\r\n    }\r\n\r\n    renderForm = (context: IDataViewContext<T>, fieldSelected: keyof T) => (\r\n      <form onSubmit={(e) => this.handleSubmit(e, context, fieldSelected)}>\r\n        {this.renderWithMode(context, fieldSelected)}\r\n        <ActionWrapper>\r\n          <Button size='small' color='inherit' onClick={context.onPanelClose}>\r\n            Cancel\r\n          </Button>\r\n          <Button size='small' color='primary' type='submit' sx={{ fontWeight: 700 }}>\r\n            Apply\r\n          </Button>\r\n        </ActionWrapper>\r\n      </form>\r\n    )\r\n\r\n    renderWithMode = (context: IDataViewContext<T>, fieldSelected: keyof T) => {\r\n      const fieldConfig = context.filterBarConfigs.fields?.[fieldSelected]\r\n      switch (fieldConfig?.type) {\r\n        case 'select':\r\n          return (\r\n            <MenuWithTypeSelect\r\n              name={fieldSelected.toString()}\r\n              fieldConfig={fieldConfig}\r\n              validationResult={this.state.validationResult}\r\n              onChange={() => this.setState({ validationResult: undefined })}\r\n            />\r\n          )\r\n        case 'select-multi':\r\n          return (\r\n            <MenuWithTypeSelectMulti\r\n              name={fieldSelected.toString()}\r\n              fieldConfig={fieldConfig}\r\n              validationResult={this.state.validationResult}\r\n              onChange={() => this.setState({ validationResult: undefined })}\r\n            />\r\n          )\r\n        case 'date':\r\n          return <MenuWithTypeDate name={fieldSelected.toString()} fieldConfig={fieldConfig} validationResult={this.state.validationResult} />\r\n        case 'date-range':\r\n          return <MenuWithTypeDateRange name={fieldSelected.toString()} fieldConfig={fieldConfig} validationResult={this.state.validationResult} />\r\n        case 'string':\r\n        default:\r\n          return <MenuWithTypeString name={fieldSelected.toString()} fieldConfig={fieldConfig} validationResult={this.state.validationResult} />\r\n      }\r\n    }\r\n\r\n    /**\r\n     * Handle form submission\r\n     * @param event - The form submit event\r\n     * @param context - The filter bar context\r\n     * @param fieldSelected - The selected field to filter\r\n     */\r\n    handleSubmit = (event: React.FormEvent<HTMLFormElement>, context: IDataViewContext<T>, fieldSelected: keyof IFilterConfigs<T>) => {\r\n      event?.preventDefault()\r\n      event?.stopPropagation()\r\n\r\n      const formData = new FormData(event?.currentTarget as HTMLFormElement)\r\n\r\n      // Validate form data\r\n      const validation = this.formValidate(formData, fieldSelected, context)\r\n      if (validation.hasError) {\r\n        this.setState({ validationResult: validation })\r\n        return\r\n      }\r\n\r\n      // If validation passes, add filter\r\n      this.addFilter(formData, context, fieldSelected)\r\n    }\r\n\r\n    /**\r\n     * Validate form data based on field type and configuration\r\n     * @param formData - The form data to validate\r\n     * @param fieldSelected - The selected field to validate\r\n     * @param context - The filter bar context\r\n     * @returns Validation result with error status and message\r\n     */\r\n    formValidate = (formData: FormData, fieldSelected: keyof IFilterConfigs<T>, context: IDataViewContext<T>): IValidationResult => {\r\n      const obj = convertFormDataToJson<T>(formData)\r\n      const fieldsValidation = getFieldsValidation<T>(context.filterBarConfigs.fields || {})\r\n      const fieldConfig = fieldsValidation[fieldSelected]\r\n\r\n      if (fieldConfig?.type === 'select-multi') {\r\n        const values = formData.getAll(fieldSelected.toString())\r\n        if (values.length === 0) {\r\n          return { hasError: true, message: 'Please select at least one option' }\r\n        }\r\n      } else if (fieldConfig?.type === 'date-range') {\r\n        const startDate = formData.get(`${fieldSelected.toString()}_start`)?.toString()\r\n        const endDate = formData.get(`${fieldSelected.toString()}_end`)?.toString()\r\n\r\n        if (!startDate || !endDate) {\r\n          return { hasError: true, message: 'Please select both start and end dates' }\r\n        }\r\n\r\n        if (new Date(startDate) > new Date(endDate)) {\r\n          return { hasError: true, message: 'Start date must be before end date' }\r\n        }\r\n      } else {\r\n        const value = obj[fieldSelected as keyof T]?.toString()\r\n        const validate = filterFieldValidated(value ?? '', fieldSelected, fieldConfig)\r\n        if (validate.error) {\r\n          return { hasError: true, message: validate.message }\r\n        }\r\n      }\r\n\r\n      return { hasError: false }\r\n    }\r\n\r\n    /**\r\n     * Add filter based on field type and form data\r\n     * @param formData - The form data containing field values\r\n     * @param context - The filter bar context\r\n     * @param fieldSelected - The selected field to filter\r\n     */\r\n    addFilter = (formData: FormData, context: IDataViewContext<T>, fieldSelected: keyof IFilterConfigs<T>) => {\r\n      const fieldsValidation = getFieldsValidation<T>(context.filterBarConfigs.fields || {})\r\n      const fieldConfig = fieldsValidation[fieldSelected]\r\n      const store = createFilterStore<T>(context?.filterState || {})\r\n      const formDataJson = convertFormDataToJson<T>(formData)\r\n\r\n      // Get logic values from form data\r\n      const filterLogic = (formData.get('filterLogic')?.toString() as IFilterLogic) || 'and'\r\n      const dateRangeLogic = (formData.get('dateRangeLogic')?.toString() as IFilterDateRangeLogic) || 'between'\r\n\r\n      // Handle date-range separately\r\n      if (fieldConfig?.type === 'date-range') {\r\n        const startDate = formData.get(`${fieldSelected.toString()}_start`)?.toString()\r\n        const endDate = formData.get(`${fieldSelected.toString()}_end`)?.toString()\r\n\r\n        if (startDate && endDate) {\r\n          const filterItem: IFilterItem = {\r\n            type: 'date-range',\r\n            startDate,\r\n            endDate,\r\n            dateRangeLogic: dateRangeLogic,\r\n            label: `${startDate} to ${endDate}`\r\n          }\r\n\r\n          store.addFilterItem(fieldSelected as keyof T, filterItem, { reason: 'filter', area: 'filterButton' })\r\n        }\r\n      } else if (fieldConfig?.type === 'date') {\r\n        const value = formDataJson[fieldSelected as keyof T]?.toString()\r\n        if (value) {\r\n          const dateLogic: IFilterDateLogic = (formData.get('dateLogic')?.toString() as IFilterDateLogic) || 'before'\r\n          const filterItem: IFilterItem = { type: 'date', value, dateLogic }\r\n          store.removeFilterField(fieldSelected as keyof T, { reason: 'filter' }) // Remove existing filter for this field\r\n          store.addFilterItem(fieldSelected as keyof T, filterItem, { reason: 'filter', area: 'filterButton' })\r\n        }\r\n      } else {\r\n        // Get all values based on field type\r\n        let values: string[] = []\r\n\r\n        if (fieldConfig?.type === 'select-multi') {\r\n          // For multi-select, obj[fieldSelected] should be an array\r\n          const fieldValue = formDataJson[fieldSelected]\r\n          if (Array.isArray(fieldValue)) {\r\n            values = fieldValue.map((v) => v.toString())\r\n          } else if (fieldValue) {\r\n            values = [fieldValue.toString()]\r\n          }\r\n        } else {\r\n          // For single select and string\r\n          const value = formDataJson[fieldSelected as keyof T]?.toString()\r\n          if (value) {\r\n            values = [value]\r\n          }\r\n        }\r\n\r\n        // Add all values to store\r\n        values.forEach((value) => {\r\n          let label: string | undefined = undefined\r\n\r\n          if (fieldConfig?.type === 'select' || fieldConfig?.type === 'select-multi') {\r\n            label = fieldConfig.options.find((x) => x.value === value)?.label\r\n          }\r\n\r\n          // Create filter item with type and logic\r\n          const filterItem: IFilterItem = { type: fieldConfig?.type || 'string', value, label }\r\n          if (fieldConfig?.type !== 'string') filterItem.type = fieldConfig?.type\r\n          if (fieldConfig?.type === 'select-multi') filterItem.logic = filterLogic\r\n          store.addFilterItem(fieldSelected as keyof T, filterItem, { reason: 'filter', area: 'filterButton' })\r\n        })\r\n      }\r\n\r\n      context.onFilterStateChange(store.build())\r\n    }\r\n  }\r\n\r\n  return FilterMenu\r\n}\r\n\r\nexport default createFilterMenu\r\n\r\nconst MenuListCustom = styled(MenuList)({\r\n  padding: 0,\r\n  [`.${filterMenuClasses.item}`]: {\r\n    height: 'var(--filter-item-height, 40px)',\r\n    padding: '0 16px',\r\n    '&:not(:last-child)': {\r\n      borderBottom: '1px solid var(--color-divider, rgba(145 160 170 / 10%))'\r\n    }\r\n  }\r\n})\r\n\r\nconst ActionWrapper = styled(Box)({\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  justifyContent: 'flex-end',\r\n  padding: '8px'\r\n})\r\n"],"names":["createFilterMenu","FilterMenu","props","_this","_classCallCheck","_callSuper","_defineProperty","context","fieldSelected","_jsxs","onSubmit","e","handleSubmit","children","renderWithMode","ActionWrapper","_jsx","Button","size","color","onClick","onPanelClose","type","sx","fontWeight","_context$filterBarCon","fieldConfig","filterBarConfigs","fields","MenuWithTypeSelect","name","toString","validationResult","state","onChange","setState","undefined","MenuWithTypeSelectMulti","MenuWithTypeDate","MenuWithTypeDateRange","MenuWithTypeString","event","preventDefault","stopPropagation","formData","FormData","currentTarget","validation","formValidate","hasError","addFilter","obj","convertFormDataToJson","getFieldsValidation","getAll","length","message","_formData$get","_formData$get2","startDate","get","concat","endDate","Date","_obj$fieldSelected","value","validate","filterFieldValidated","error","_formData$get3","_formData$get4","store","createFilterStore","filterState","formDataJson","filterLogic","dateRangeLogic","_formData$get5","_formData$get6","filterItem","label","addFilterItem","reason","area","_formDataJson$fieldSe","_formData$get7","dateLogic","removeFilterField","values","fieldValue","Array","isArray","map","v","_formDataJson$fieldSe2","forEach","_fieldConfig$options$","options","find","x","logic","onFilterStateChange","build","_inherits","Component","_createClass","key","_this2","this","mapDataViewContext","renderForm","fieldsValidation","keys","Object","MenuListCustom","className","filterMenuClasses","list","minWidth","i","_context$filterBarCon2","_item$label","item","MenuItem","Fragment","styled","MenuList","padding","height","borderBottom","Box","display","alignItems","justifyContent"],"mappings":"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"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"create.pagination-bar.js","sources":["../../../src/data-view/create.pagination-bar.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Pagination, PaginationProps, styled, TablePagination, TablePaginationProps, useMediaQuery, useTheme } from '@mui/material'\r\nimport { createFilterStore } from './filter-store'\r\nimport { IFilterState, IPagination } from './types'\r\n\r\nexport interface IPaginationBarConfigs {\r\n  rowsPerPageOptions?: number[]\r\n  disableScrollLock?: boolean\r\n  enablePaginationTop?: boolean\r\n}\r\n\r\nexport interface IPaginationBarProps<T> extends IPaginationBarConfigs {\r\n  count?: number\r\n  filter?: IFilterState<T>\r\n  defaultFilter?: IFilterState<T>\r\n  onChange?: (value: IFilterState<T>) => void\r\n  isMobile?: boolean\r\n}\r\n\r\nexport type IPaginationBarParams<T> = Pick<IPaginationBarProps<T>, 'defaultFilter' | 'rowsPerPageOptions'>\r\n\r\nexport function createTablePagination<T>(): ComponentType<IPaginationBarProps<T>> {\r\n  class PaginationBar extends Component<IPaginationBarProps<T>> {\r\n    get defaultFilter(): IFilterState<T> {\r\n      return this.props.defaultFilter || {}\r\n    }\r\n\r\n    get defaultPagination(): Required<IPagination> {\r\n      return (this.defaultFilter?.pagination as any) || { page: 0, pageSize: 10 }\r\n    }\r\n\r\n    get pagination(): Required<IPagination> {\r\n      return (this.props.filter?.pagination as any) || this.defaultPagination\r\n    }\r\n\r\n    get rowsPerPageOptions(): number[] {\r\n      return this.props.rowsPerPageOptions || [10, 25, 50, 100]\r\n    }\r\n\r\n    handleChangePage = (_: React.MouseEvent<HTMLButtonElement> | null, newPage: number) => {\r\n      const store = createFilterStore<T>(this.props.filter ?? {}, this.defaultFilter)\r\n      const { pageSize } = this.pagination\r\n      const obj: IPagination = { page: newPage, pageSize }\r\n      store.changePagination(obj, { reason: 'pagination' })\r\n      this.props.onChange?.(store.build())\r\n    }\r\n\r\n    handleChangeRowsPerPage = (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\r\n      const newPageSize = parseInt(event.target.value, 10)\r\n      const store = createFilterStore<T>(this.props.filter ?? {}, this.defaultFilter)\r\n      store.changePagination({ page: 0, pageSize: newPageSize }, { reason: 'pagination' })\r\n      this.props.onChange?.(store.build())\r\n    }\r\n\r\n    render() {\r\n      const { page, pageSize } = this.pagination\r\n      const { isMobile } = this.props\r\n      if (!this.props.count || (Math.ceil(this.props.count / pageSize) === 1 && isMobile)) {\r\n        return null // No pagination if there are no items\r\n      }\r\n      if (isMobile) {\r\n        return (\r\n          <PaginationCustom\r\n            siblingCount={0}\r\n            page={page + 1}\r\n            count={Math.ceil(this.props.count / pageSize)}\r\n            onChange={(_, value) => this.handleChangePage(null, value - 1)}\r\n            size='small'\r\n            color='primary'\r\n            sx={{ my: 1 }}\r\n          />\r\n        )\r\n      }\r\n      return (\r\n        <TablePaginationCustom\r\n          size='small'\r\n          page={page}\r\n          count={this.props.count || 0}\r\n          onPageChange={this.handleChangePage}\r\n          rowsPerPage={pageSize}\r\n          onRowsPerPageChange={this.handleChangeRowsPerPage}\r\n          rowsPerPageOptions={this.rowsPerPageOptions}\r\n          slotProps={{\r\n            actions: { nextButton: { size: 'small' }, previousButton: { size: 'small' } },\r\n            select: { MenuProps: { disableScrollLock: this.props.disableScrollLock } }\r\n          }}\r\n        />\r\n      )\r\n    }\r\n  }\r\n  return PaginationBar\r\n}\r\n\r\nexport function createPaginationBar<T>(params?: IPaginationBarParams<T>) {\r\n  const PaginationBar = createTablePagination<T>()\r\n  return function ResponsivePaginationBar(props: IPaginationBarProps<T>) {\r\n    const theme = useTheme()\r\n    const isMobile = useMediaQuery(theme.breakpoints.down('md'))\r\n    return <PaginationBar {...props} isMobile={isMobile} />\r\n  }\r\n}\r\n\r\nexport default createPaginationBar\r\n\r\nconst TablePaginationCustom = styled((p: TablePaginationProps) => <TablePagination component='div' {...p} />)(({ theme }) => ({\r\n  marginLeft: 'auto',\r\n  '@media (min-width: 600px)': {\r\n    '.MuiToolbar-root': {\r\n      minHeight: '48px'\r\n    }\r\n  },\r\n  '.MuiTablePagination-selectLabel': {\r\n    [theme.breakpoints.down('sm')]: {\r\n      display: 'none'\r\n    }\r\n  }\r\n}))\r\n\r\nconst PaginationCustom = styled((p: PaginationProps) => <Pagination {...p} />)({\r\n  marginLeft: 'auto',\r\n  '.Mui-selected': {\r\n    backgroundColor: 'color-mix(in srgb, rgb(232, 140, 63) 60%, transparent) !important'\r\n  },\r\n  '@media (min-width: 600px)': {\r\n    '.MuiToolbar-root': {\r\n      minHeight: '48px'\r\n    }\r\n  }\r\n})\r\n"],"names":["createTablePagination","PaginationBar","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","_","newPage","_this$props$filter","_this$props$onChange","_this$props","store","createFilterStore","props","filter","defaultFilter","obj","page","pageSize","pagination","changePagination","reason","onChange","call","build","event","_this$props$filter2","_this$props$onChange2","_this$props2","newPageSize","parseInt","target","value","_inherits","Component","_createClass","key","get","_this$defaultFilter","_this$props$filter3","defaultPagination","rowsPerPageOptions","_this2","_this$pagination","isMobile","count","Math","ceil","_jsx","PaginationCustom","siblingCount","handleChangePage","size","color","sx","my","TablePaginationCustom","onPageChange","rowsPerPage","onRowsPerPageChange","handleChangeRowsPerPage","slotProps","actions","nextButton","previousButton","select","MenuProps","disableScrollLock","createPaginationBar","params","theme","useTheme","useMediaQuery","breakpoints","down","_objectSpread","styled","p","TablePagination","component","_ref","marginLeft","minHeight","display","Pagination","backgroundColor"],"mappings":"wZAqBgBA,IAAqB,IAC7BC,aAAc,SAAAA,IAAA,IAAAC,EAAAC,OAAAF,GAAA,IAAA,IAAAG,EAAAC,UAAAC,OAAAC,EAAAC,IAAAA,MAAAJ,GAAAK,EAAA,EAAAA,EAAAL,EAAAK,IAAAF,EAAAE,GAAAJ,UAAAI,GA8BjB,OA9BiBP,EAAAQ,EAAAC,KAAAV,EAAAW,GAAAA,OAAAL,IAAAM,EAAAX,EAAA,oBAiBC,SAACY,EAA+CC,GAAmB,IAAAC,EAAAC,EAAAC,EAC9EC,EAAQC,UAAiBJ,EAAId,EAAKmB,MAAMC,cAAM,IAAAN,EAAAA,EAAI,CAAA,EAAId,EAAKqB,eAE3DC,EAAmB,CAAEC,KAAMV,EAASW,SADrBxB,EAAKyB,WAAlBD,UAERP,EAAMS,iBAAiBJ,EAAK,CAAEK,OAAQ,eACnBZ,QAAnBA,GAAAC,EAAAhB,EAAKmB,OAAMS,oBAAQb,GAAnBA,EAAAc,KAAAb,EAAsBC,EAAMa,YAC7BnB,EAAAX,EAEyB,2BAAA,SAAC+B,GAAoE,IAAAC,EAAAC,EAAAC,EACvFC,EAAcC,SAASL,EAAMM,OAAOC,MAAO,IAC3CrB,EAAQC,UAAiBc,EAAIhC,EAAKmB,MAAMC,cAAM,IAAAY,EAAAA,EAAI,CAAA,EAAIhC,EAAKqB,eACjEJ,EAAMS,iBAAiB,CAAEH,KAAM,EAAGC,SAAUW,GAAe,CAAER,OAAQ,eAClDM,QAAnBA,GAAAC,EAAAlC,EAAKmB,OAAMS,oBAAQK,GAAnBA,EAAAJ,KAAAK,EAAsBjB,EAAMa,YAC7B9B,CAAA,CAAA,OAAAuC,EAAAxC,EA9ByByC,GA8BzBC,EAAA1C,EAAA,CAAA,CAAA2C,IAAA,gBAAAC,IA7BD,WACE,OAAOlC,KAAKU,MAAME,eAAiB,CAAE,CACvC,GAAC,CAAAqB,IAAA,oBAAAC,IAED,WAAqB,IAAAC,EACnB,OAA0BA,QAAlBA,EAAAnC,KAAKY,qBAALuB,IAAkBA,OAAlBA,EAAAA,EAAoBnB,aAAsB,CAAEF,KAAM,EAAGC,SAAU,GACzE,GAAC,CAAAkB,IAAA,aAAAC,IAED,WAAc,IAAAE,EACZ,OAAyB,QAAjBA,EAAApC,KAAKU,MAAMC,cAAM,IAAAyB,OAAA,EAAjBA,EAAmBpB,aAAsBhB,KAAKqC,iBACxD,GAAC,CAAAJ,IAAA,qBAAAC,IAED,WACE,OAAOlC,KAAKU,MAAM4B,oBAAsB,CAAC,GAAI,GAAI,GAAI,IACvD,GAAC,CAAAL,IAAA,SAAAJ,MAiBD,WAAM,IAAAU,EAAAvC,KACJwC,EAA2BxC,KAAKgB,WAAxBF,EAAI0B,EAAJ1B,KAAMC,EAAQyB,EAARzB,SACN0B,EAAazC,KAAKU,MAAlB+B,SACR,OAAKzC,KAAKU,MAAMgC,OAAqD,IAA3CC,KAAKC,KAAK5C,KAAKU,MAAMgC,MAAQ3B,IAAmB0B,EACjE,KAELA,EAEAI,EAACC,EAAgB,CACfC,aAAc,EACdjC,KAAMA,EAAO,EACb4B,MAAOC,KAAKC,KAAK5C,KAAKU,MAAMgC,MAAQ3B,GACpCI,SAAU,SAAChB,EAAG0B,GAAK,OAAKU,EAAKS,iBAAiB,KAAMnB,EAAQ,EAAE,EAC9DoB,KAAK,QACLC,MAAM,UACNC,GAAI,CAAEC,GAAI,KAKdP,EAACQ,EAAqB,CACpBJ,KAAK,QACLnC,KAAMA,EACN4B,MAAO1C,KAAKU,MAAMgC,OAAS,EAC3BY,aAActD,KAAKgD,iBACnBO,YAAaxC,EACbyC,oBAAqBxD,KAAKyD,wBAC1BnB,mBAAoBtC,KAAKsC,mBACzBoB,UAAW,CACTC,QAAS,CAAEC,WAAY,CAAEX,KAAM,SAAWY,eAAgB,CAAEZ,KAAM,UAClEa,OAAQ,CAAEC,UAAW,CAAEC,kBAAmBhE,KAAKU,MAAMsD,sBAI7D,IAAC,IAEH,OAAO1E,CACT,CAEM,SAAU2E,EAAuBC,GACrC,IAAM5E,EAAgBD,IACtB,OAAO,SAAiCqB,GACtC,IAAMyD,EAAQC,IACR3B,EAAW4B,EAAcF,EAAMG,YAAYC,KAAK,OACtD,OAAO1B,EAACvD,EAAakF,EAAAA,KAAK9D,GAAK,GAAA,CAAE+B,SAAUA,IAC5C,CACH,CAIA,IAAMY,EAAwBoB,GAAO,SAACC,GAAuB,OAAK7B,EAAC8B,EAAeH,EAAA,CAACI,UAAU,OAAUF,GAAK,GAA9ED,EAAgF,SAAAI,GAAA,IAAGV,EAAKU,EAALV,MAAK,MAAQ,CAC5HW,WAAY,OACZ,4BAA6B,CAC3B,mBAAoB,CAClBC,UAAW,SAGf,kCAAiC7E,EAAA,GAC9BiE,EAAMG,YAAYC,KAAK,MAAQ,CAC9BS,QAAS,SAGd,IAEKlC,EAAmB2B,GAAO,SAACC,GAAkB,OAAK7B,EAACoC,EAAUT,EAAKE,CAAAA,EAAAA,GAAK,GAApDD,CAAsD,CAC7EK,WAAY,OACZ,gBAAiB,CACfI,gBAAiB,qEAEnB,4BAA6B,CAC3B,mBAAoB,CAClBH,UAAW"}

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

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

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

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

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

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