dinocollab-core 2.2.0 → 2.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bin/codegen.js +0 -0
- package/dist/src/filter-bar/components/chip-viewer.js +1 -1
- package/dist/src/filter-bar/components/chip-viewer.js.map +1 -1
- package/dist/src/filter-bar/components/filter-menu.js +1 -1
- package/dist/src/filter-bar/components/filter-menu.js.map +1 -1
- package/dist/src/filter-bar/components/filter-menu.units.js +1 -1
- package/dist/src/filter-bar/components/filter-menu.units.js.map +1 -1
- package/dist/src/filter-bar/components/filter-sort.js +1 -1
- package/dist/src/filter-bar/components/filter-sort.js.map +1 -1
- package/dist/src/filter-bar/components/filter-summary.js +1 -1
- package/dist/src/filter-bar/components/filter-summary.js.map +1 -1
- package/dist/src/filter-bar/components/hooks.js +1 -1
- package/dist/src/filter-bar/components/hooks.js.map +1 -1
- package/dist/src/filter-bar/components/popper-custom.js +1 -1
- package/dist/src/filter-bar/components/popper-custom.js.map +1 -1
- package/dist/src/filter-bar/convert-to-graphql.js +1 -1
- package/dist/src/filter-bar/convert-to-graphql.js.map +1 -1
- package/dist/src/filter-bar/index.context.js +1 -1
- package/dist/src/filter-bar/index.context.js.map +1 -1
- package/dist/src/filter-bar/index.create.js +1 -1
- package/dist/src/filter-bar/index.create.js.map +1 -1
- package/dist/src/form/create.form-base.js +1 -1
- package/dist/src/utils/helpers.js +1 -1
- package/dist/types/filter-bar/components/filter-menu.d.ts +1 -0
- package/dist/types/filter-bar/components/filter-menu.types.d.ts +2 -0
- package/dist/types/filter-bar/components/filter-sort.d.ts +1 -0
- package/dist/types/filter-bar/components/hooks.d.ts +1 -1
- package/dist/types/filter-bar/index.context.d.ts +1 -0
- package/dist/types/filter-bar/index.create.d.ts +10 -8
- package/dist/types/lab/data-surface/index.create.d.ts +18 -0
- package/dist/types/lab/data-surface/index.d.ts +1 -0
- package/dist/types/lab/data-surface/index.dino.d.ts +7 -0
- package/dist/types/lab/data-surface/types.d.ts +27 -0
- package/dist/types/lab/data-surface/view-grid.d.ts +40 -0
- package/dist/types/lab/data-surface/view-grid.types.d.ts +22 -0
- package/dist/types/lab/data-surface/view-grid.units.d.ts +11 -0
- package/dist/types/lab/data-surface/view-switch-transition.d.ts +24 -0
- package/dist/types/lab/data-surface/view-switch-transition.units.d.ts +71 -0
- package/dist/types/lab/data-viewer/index.d.ts +1 -0
- package/package.json +10 -10
package/bin/codegen.js
CHANGED
|
File without changes
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as
|
|
1
|
+
import{defineProperty as e,slicedToArray as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as t,jsx as n,Fragment as a}from"react/jsx-runtime";import{useMemo as r,useState as o}from"react";import{styled as l,Box as c,Typography as m,Tooltip as p,Chip as s}from"@mui/material";import u from"@mui/icons-material/MoreHoriz";var h=function(e){var i=e.item,t=e.group,a=e.onRemove,r=t.field,o=t.label,l=i.label||i.value.toString();return n(s,{size:"small",title:l,label:l,className:v.itemChip,onDelete:a?function(){return a(r,i.value)}:void 0},"".concat(o,"-").concat(i.value))},d=function(e){var r=o(!1),l=i(r,2),c=l[0],m=l[1],d=e.group,f=e.onRemove,g=e.enableMinimalesticView,b=d.items;if(g&&b.length>1&&!c)return t(a,{children:[n(p,{title:"".concat(b.length-1," more, click to expand"),placement:"top",arrow:!0,children:n(s,{icon:n(u,{fontSize:"small"}),label:"".concat(b.length-1,"+"),size:"small",className:v.itemChip,style:{opacity:.7},onClick:function(){return m(!0)}})}),n(h,{item:b[b.length-1],group:d,onRemove:f})]});var C=c&&b.length>1;return t(a,{children:[C&&n(p,{title:"Show less",placement:"top",arrow:!0,children:n(s,{icon:n(u,{fontSize:"small"}),size:"small",className:v.itemChip,sx:{opacity:.7,".MuiChip-label":{pl:0}},onClick:function(){return m(!1)}})}),b.map(function(e){return n(h,{item:e,group:d,onRemove:f},e.value.toString())})]})},f=function(e){var i=e.value,a=void 0===i?[]:i,o=e.onRemove,l=e.placement,c=e.label,p=e.enableMinimalesticView,s=[v.item];"vertical"===l?s.push(v.itemVertical):"horizontal"===l&&s.push(v.itemHorizontal);var u=r(function(){return a?(Array.isArray(a)?a:[a]).filter(function(e){return e.items&&e.items.length>0}):[]},[a]);return 0===u.length?null:t(b,{sx:e.sx,className:s.filter(Boolean).join(" "),children:[Boolean(c)&&t(m,{variant:"caption",className:v.itemLabel,children:[c||"ChipViewer",":"]}),n("div",{className:v.itemContent,children:u.map(function(e){var i=e.field,a=e.label;return t("div",{className:v.itemGroup,children:[a&&t(m,{variant:"caption",className:v.itemLabel,children:[a,":"]}),n(d,{group:e,onRemove:o,enableMinimalesticView:p})]},i.toString())})})]})};function g(){return{Group:f}}var v={item:"DinoChipViewer-item",itemLabel:"DinoChipViewer-itemLabel",itemChip:"DinoChipViewer-itemChip",itemGroup:"DinoChipViewer-itemGroup",itemContent:"DinoChipViewer-itemContent",sort:"DinoChipViewer-sort",itemVertical:"DinoChipViewer-itemVertical",itemHorizontal:"DinoChipViewer-itemHorizontal"},b=l(c)(function(i){var t=i.theme;return e(e(e(e(e({},".".concat(v.itemLabel),{fontWeight:700,marginLeft:t.spacing(.5),lineHeight:1}),".".concat(v.itemChip),{borderRadius:"4px",maxWidth:"100px","& .MuiChip-label":{whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"}}),".".concat(v.itemGroup),{display:"flex",flexWrap:"wrap",border:"dashed 1px ".concat(t.palette.divider),borderRadius:t.shape.borderRadius,alignItems:"center",padding:t.spacing(.25),gap:t.spacing(1)}),".".concat(v.itemContent),e({display:"flex",flexWrap:"wrap",gap:t.spacing(.5)},".".concat(v.itemLabel),{fontWeight:500,color:t.palette.text.secondary})),"&.".concat(v.item),e(e({display:"flex",flexDirection:"row",alignItems:"center",gap:t.spacing(1),padding:t.spacing(.25,.5),"&:last-child":{marginBottom:0,borderBottom:"none",paddingBottom:0}},"&.".concat(v.sort),{".MuiChip-label > div":{display:"flex",alignItems:"center",gap:4},".MuiSvgIcon-root":{fontSize:12}}),"&.".concat(v.itemVertical),{flexDirection:"column",alignItems:"flex-start"}))});export{g as createChipViewers};
|
|
2
2
|
//# sourceMappingURL=chip-viewer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chip-viewer.js","sources":["../../../../src/filter-bar/components/chip-viewer.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useMemo } from 'react'\r\nimport { Box, Chip, styled, Tooltip, Typography } from '@mui/material'\r\nimport MoreHorizIcon from '@mui/icons-material/MoreHoriz'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { SxProps, Theme } from '@mui/material'\r\nimport type { TFieldType, TFieldValid } from '../types'\r\n\r\nexport interface IChipViewerItem<O = any> {\r\n value: TFieldValid\r\n label?: string\r\n other?: O\r\n}\r\n\r\nexport interface TChipViewerGroup<T, O = any> {\r\n field: TFieldType<T>\r\n label?: string\r\n items: IChipViewerItem<O>[]\r\n}\r\n\r\nexport type TOnRemoveFilterFunc<T> = (field: TFieldType<T>, value: TFieldValid) => void\r\n\r\ninterface IChipViewerProps<T> {\r\n value?: TChipViewerGroup<T> | TChipViewerGroup<T>[]\r\n onRemove?: TOnRemoveFilterFunc<T>\r\n placement?: 'vertical' | 'horizontal'\r\n /** Option to set a custom label for the group. */\r\n label?: string | boolean\r\n /** Enable minimalistic view: only show the last item, hide the rest as an icon at the start */\r\n enableMinimalesticView?: boolean\r\n sx?: SxProps<Theme>\r\n}\r\n\r\ninterface IChipItemProps<T> extends Pick<IChipViewerProps<T>, 'onRemove'> {\r\n item: IChipViewerItem\r\n group: TChipViewerGroup<T>\r\n}\r\n\r\nconst ChipItem: FC<IChipItemProps<any>> = (props) => {\r\n const { item, group, onRemove } = props\r\n const { field, label } = group\r\n const itemLabel = item.label || item.value.toString()\r\n return (\r\n <Chip\r\n key={`${label}-${item.value}`}\r\n size='small'\r\n title={itemLabel}\r\n label={itemLabel}\r\n className={classes.itemChip}\r\n onDelete={onRemove ? () => onRemove(field, item.value) : undefined}\r\n />\r\n )\r\n}\r\n\r\ninterface IChipListProps<T> extends Pick<IChipViewerProps<T>, 'onRemove' | 'enableMinimalesticView'> {\r\n group: TChipViewerGroup<T>\r\n}\r\n\r\nconst ChipList: FC<IChipListProps<any>> = (props) => {\r\n const { group, onRemove, enableMinimalesticView } = props\r\n const { items } = group\r\n if (enableMinimalesticView && items.length > 1) {\r\n return (\r\n <>\r\n <Tooltip title={`${items.length - 1} more`} placement='left' arrow>\r\n <Chip\r\n icon={<MoreHorizIcon fontSize='small' />}\r\n label={items.length - 1}\r\n size='small'\r\n className={classes.itemChip}\r\n style={{ opacity: 0.7 }}\r\n />\r\n </Tooltip>\r\n <ChipItem item={items[items.length - 1]} group={group} onRemove={onRemove} />\r\n </>\r\n )\r\n }\r\n return (\r\n <>\r\n {items.map((item) => (\r\n <ChipItem key={item.value.toString()} item={item} group={group} onRemove={onRemove} />\r\n ))}\r\n </>\r\n )\r\n}\r\n\r\nconst ChipViewer: FC<IChipViewerProps<any>> = (props) => {\r\n const { value = [], onRemove: onRemoveFilter, placement, label, enableMinimalesticView } = props\r\n\r\n const rootClasses = [classes.item]\r\n if (placement === 'vertical') rootClasses.push(classes.itemVertical)\r\n else if (placement === 'horizontal') rootClasses.push(classes.itemHorizontal)\r\n\r\n const data = useMemo(() => {\r\n if (!value) return []\r\n const valueArray = Array.isArray(value) ? value : [value]\r\n return valueArray.filter((group) => group.items && group.items.length > 0)\r\n }, [value])\r\n\r\n if (data.length === 0) return null\r\n\r\n return (\r\n <ItemStyled sx={props.sx} className={rootClasses.filter(Boolean).join(' ')}>\r\n {Boolean(label) && (\r\n <Typography variant='caption' className={classes.itemLabel}>\r\n {label || 'ChipViewer'}:\r\n </Typography>\r\n )}\r\n <div className={classes.itemContent}>\r\n {data.map((group) => {\r\n const { field, label } = group\r\n return (\r\n <div key={field.toString()} className={classes.itemGroup}>\r\n {label && (\r\n <Typography variant='caption' className={classes.itemLabel}>\r\n {label}:\r\n </Typography>\r\n )}\r\n <ChipList group={group} onRemove={onRemoveFilter} enableMinimalesticView={enableMinimalesticView} />\r\n </div>\r\n )\r\n })}\r\n </div>\r\n </ItemStyled>\r\n )\r\n}\r\n\r\nexport function createChipViewers<T>() {\r\n return {\r\n Group: ChipViewer as FC<IChipViewerProps<T>>\r\n }\r\n}\r\n\r\n//#region styles\r\nconst chipViewerClasses = {\r\n root: 'DinoChipViewer-root',\r\n item: 'DinoChipViewer-item',\r\n itemLabel: 'DinoChipViewer-itemLabel',\r\n itemChip: 'DinoChipViewer-itemChip',\r\n itemGroup: 'DinoChipViewer-itemGroup',\r\n itemContent: 'DinoChipViewer-itemContent',\r\n sort: 'DinoChipViewer-sort',\r\n itemVertical: 'DinoChipViewer-itemVertical',\r\n itemHorizontal: 'DinoChipViewer-itemHorizontal'\r\n}\r\n\r\nconst classes = chipViewerClasses\r\n\r\nconst ItemStyled = styled(Box)(({ theme }) => ({\r\n [`.${classes.itemLabel}`]: {\r\n fontWeight: 700,\r\n marginLeft: theme.spacing(0.5),\r\n lineHeight: 1\r\n },\r\n [`.${classes.itemChip}`]: {\r\n borderRadius: '4px',\r\n maxWidth: '100px',\r\n '& .MuiChip-label': { whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }\r\n },\r\n [`.${classes.itemGroup}`]: {\r\n display: 'flex',\r\n flexWrap: 'wrap',\r\n border: `dashed 1px ${theme.palette.divider}`,\r\n borderRadius: theme.shape.borderRadius,\r\n alignItems: 'center',\r\n padding: theme.spacing(0.25),\r\n gap: theme.spacing(1)\r\n },\r\n [`.${classes.itemContent}`]: {\r\n display: 'flex',\r\n flexWrap: 'wrap',\r\n gap: theme.spacing(0.5),\r\n [`.${classes.itemLabel}`]: {\r\n fontWeight: 500,\r\n color: theme.palette.text.secondary\r\n }\r\n },\r\n [`&.${classes.item}`]: {\r\n display: 'flex',\r\n flexDirection: 'row',\r\n alignItems: 'center',\r\n gap: theme.spacing(1),\r\n padding: theme.spacing(0.25, 0.5),\r\n // borderBottom: `1px solid ${theme.palette.grey[100]}`,\r\n '&:last-child': { marginBottom: 0, borderBottom: 'none', paddingBottom: 0 },\r\n [`&.${classes.sort}`]: {\r\n '.MuiChip-label > div': { display: 'flex', alignItems: 'center', gap: 4 },\r\n '.MuiSvgIcon-root': { fontSize: 12 }\r\n },\r\n [`&.${classes.itemVertical}`]: { flexDirection: 'column', alignItems: 'flex-start' }\r\n // [`&.${classes.itemHorizontal}`]: { flexDirection: 'row', alignItems: 'center' }\r\n }\r\n}))\r\n//#endregion\r\n"],"names":["ChipItem","props","item","group","onRemove","field","label","itemLabel","value","toString","_jsx","Chip","size","title","className","classes","itemChip","onDelete","undefined","concat","ChipList","enableMinimalesticView","items","length","_jsxs","_Fragment","children","Tooltip","placement","arrow","icon","MoreHorizIcon","fontSize","style","opacity","map","ChipViewer","_props$value","onRemoveFilter","rootClasses","push","itemVertical","itemHorizontal","data","useMemo","Array","isArray","filter","ItemStyled","sx","Boolean","join","Typography","variant","itemContent","itemGroup","createChipViewers","Group","sort","styled","Box","_ref","theme","_defineProperty","fontWeight","marginLeft","spacing","lineHeight","borderRadius","maxWidth","whiteSpace","overflow","textOverflow","display","flexWrap","border","palette","divider","shape","alignItems","padding","gap","color","text","secondary","flexDirection","marginBottom","borderBottom","paddingBottom"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"chip-viewer.js","sources":["../../../../src/filter-bar/components/chip-viewer.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useMemo, useState } from 'react'\r\nimport { Box, Button, Chip, IconButton, styled, Tooltip, Typography } from '@mui/material'\r\nimport MoreHorizIcon from '@mui/icons-material/MoreHoriz'\r\n// types\r\nimport type { FC, PropsWithChildren } from 'react'\r\nimport type { SxProps, Theme } from '@mui/material'\r\nimport type { TFieldType, TFieldValid } from '../types'\r\n\r\nexport interface IChipViewerItem<O = any> {\r\n value: TFieldValid\r\n label?: string\r\n other?: O\r\n}\r\n\r\nexport interface TChipViewerGroup<T, O = any> {\r\n field: TFieldType<T>\r\n label?: string\r\n items: IChipViewerItem<O>[]\r\n}\r\n\r\nexport type TOnRemoveFilterFunc<T> = (field: TFieldType<T>, value: TFieldValid) => void\r\n\r\ninterface IChipViewerProps<T> {\r\n value?: TChipViewerGroup<T> | TChipViewerGroup<T>[]\r\n onRemove?: TOnRemoveFilterFunc<T>\r\n placement?: 'vertical' | 'horizontal'\r\n /** Option to set a custom label for the group. */\r\n label?: string | boolean\r\n /** Enable minimalistic view: only show the last item, hide the rest as an icon at the start */\r\n enableMinimalesticView?: boolean\r\n sx?: SxProps<Theme>\r\n}\r\n\r\ninterface IChipItemProps<T> extends Pick<IChipViewerProps<T>, 'onRemove'> {\r\n item: IChipViewerItem\r\n group: TChipViewerGroup<T>\r\n}\r\n\r\nconst ChipItem: FC<IChipItemProps<any>> = (props) => {\r\n const { item, group, onRemove } = props\r\n const { field, label } = group\r\n const itemLabel = item.label || item.value.toString()\r\n return (\r\n <Chip\r\n key={`${label}-${item.value}`}\r\n size='small'\r\n title={itemLabel}\r\n label={itemLabel}\r\n className={classes.itemChip}\r\n onDelete={onRemove ? () => onRemove(field, item.value) : undefined}\r\n />\r\n )\r\n}\r\n\r\ninterface IChipListProps<T> extends Pick<IChipViewerProps<T>, 'onRemove' | 'enableMinimalesticView'> {\r\n group: TChipViewerGroup<T>\r\n}\r\n\r\nconst ChipList: FC<IChipListProps<any>> = (props) => {\r\n const [expanded, setExpanded] = useState<boolean>(false)\r\n const { group, onRemove, enableMinimalesticView } = props\r\n const { items } = group\r\n const isMinimalistic = enableMinimalesticView && items.length > 1 && !expanded\r\n if (isMinimalistic) {\r\n return (\r\n <>\r\n <Tooltip title={`${items.length - 1} more, click to expand`} placement='top' arrow>\r\n <Chip\r\n icon={<MoreHorizIcon fontSize='small' />}\r\n label={`${items.length - 1}+`}\r\n size='small'\r\n className={classes.itemChip}\r\n style={{ opacity: 0.7 }}\r\n onClick={() => setExpanded(true)}\r\n />\r\n </Tooltip>\r\n <ChipItem item={items[items.length - 1]} group={group} onRemove={onRemove} />\r\n </>\r\n )\r\n }\r\n const isBtnShowLess = expanded && items.length > 1\r\n return (\r\n <>\r\n {isBtnShowLess && (\r\n <Tooltip title='Show less' placement='top' arrow>\r\n <Chip\r\n icon={<MoreHorizIcon fontSize='small' />}\r\n // label={false}\r\n size='small'\r\n className={classes.itemChip}\r\n sx={{ opacity: 0.7, '.MuiChip-label': { pl: 0 } }}\r\n onClick={() => setExpanded(false)}\r\n />\r\n </Tooltip>\r\n )}\r\n {items.map((item) => (\r\n <ChipItem key={item.value.toString()} item={item} group={group} onRemove={onRemove} />\r\n ))}\r\n </>\r\n )\r\n}\r\n\r\nconst ChipViewer: FC<IChipViewerProps<any>> = (props) => {\r\n const { value = [], onRemove, placement, label, enableMinimalesticView } = props\r\n\r\n const rootClasses = [classes.item]\r\n if (placement === 'vertical') rootClasses.push(classes.itemVertical)\r\n else if (placement === 'horizontal') rootClasses.push(classes.itemHorizontal)\r\n\r\n const data = useMemo(() => {\r\n if (!value) return []\r\n const valueArray = Array.isArray(value) ? value : [value]\r\n return valueArray.filter((group) => group.items && group.items.length > 0)\r\n }, [value])\r\n\r\n if (data.length === 0) return null\r\n\r\n return (\r\n <ItemStyled sx={props.sx} className={rootClasses.filter(Boolean).join(' ')}>\r\n {Boolean(label) && (\r\n <Typography variant='caption' className={classes.itemLabel}>\r\n {label || 'ChipViewer'}:\r\n </Typography>\r\n )}\r\n <div className={classes.itemContent}>\r\n {data.map((group) => {\r\n const { field, label } = group\r\n return (\r\n <div key={field.toString()} className={classes.itemGroup}>\r\n {label && (\r\n <Typography variant='caption' className={classes.itemLabel}>\r\n {label}:\r\n </Typography>\r\n )}\r\n <ChipList group={group} onRemove={onRemove} enableMinimalesticView={enableMinimalesticView} />\r\n </div>\r\n )\r\n })}\r\n </div>\r\n </ItemStyled>\r\n )\r\n}\r\n\r\nexport function createChipViewers<T>() {\r\n return {\r\n Group: ChipViewer as FC<IChipViewerProps<T>>\r\n }\r\n}\r\n\r\n//#region styles\r\nconst chipViewerClasses = {\r\n root: 'DinoChipViewer-root',\r\n item: 'DinoChipViewer-item',\r\n itemLabel: 'DinoChipViewer-itemLabel',\r\n itemChip: 'DinoChipViewer-itemChip',\r\n itemGroup: 'DinoChipViewer-itemGroup',\r\n itemContent: 'DinoChipViewer-itemContent',\r\n sort: 'DinoChipViewer-sort',\r\n itemVertical: 'DinoChipViewer-itemVertical',\r\n itemHorizontal: 'DinoChipViewer-itemHorizontal'\r\n}\r\n\r\nconst classes = chipViewerClasses\r\n\r\nconst ItemStyled = styled(Box)(({ theme }) => ({\r\n [`.${classes.itemLabel}`]: {\r\n fontWeight: 700,\r\n marginLeft: theme.spacing(0.5),\r\n lineHeight: 1\r\n },\r\n [`.${classes.itemChip}`]: {\r\n borderRadius: '4px',\r\n maxWidth: '100px',\r\n '& .MuiChip-label': { whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }\r\n },\r\n [`.${classes.itemGroup}`]: {\r\n display: 'flex',\r\n flexWrap: 'wrap',\r\n border: `dashed 1px ${theme.palette.divider}`,\r\n borderRadius: theme.shape.borderRadius,\r\n alignItems: 'center',\r\n padding: theme.spacing(0.25),\r\n gap: theme.spacing(1)\r\n },\r\n [`.${classes.itemContent}`]: {\r\n display: 'flex',\r\n flexWrap: 'wrap',\r\n gap: theme.spacing(0.5),\r\n [`.${classes.itemLabel}`]: {\r\n fontWeight: 500,\r\n color: theme.palette.text.secondary\r\n }\r\n },\r\n [`&.${classes.item}`]: {\r\n display: 'flex',\r\n flexDirection: 'row',\r\n alignItems: 'center',\r\n gap: theme.spacing(1),\r\n padding: theme.spacing(0.25, 0.5),\r\n // borderBottom: `1px solid ${theme.palette.grey[100]}`,\r\n '&:last-child': { marginBottom: 0, borderBottom: 'none', paddingBottom: 0 },\r\n [`&.${classes.sort}`]: {\r\n '.MuiChip-label > div': { display: 'flex', alignItems: 'center', gap: 4 },\r\n '.MuiSvgIcon-root': { fontSize: 12 }\r\n },\r\n [`&.${classes.itemVertical}`]: { flexDirection: 'column', alignItems: 'flex-start' }\r\n // [`&.${classes.itemHorizontal}`]: { flexDirection: 'row', alignItems: 'center' }\r\n }\r\n}))\r\n//#endregion\r\n"],"names":["ChipItem","props","item","group","onRemove","field","label","itemLabel","value","toString","_jsx","Chip","size","title","className","classes","itemChip","onDelete","undefined","concat","ChipList","_useState","useState","_useState2","_slicedToArray","expanded","setExpanded","enableMinimalesticView","items","length","_jsxs","Tooltip","placement","arrow","children","icon","MoreHorizIcon","fontSize","style","opacity","onClick","isBtnShowLess","_Fragment","sx","pl","map","ChipViewer","_props$value","rootClasses","push","itemVertical","itemHorizontal","data","useMemo","Array","isArray","filter","ItemStyled","Boolean","join","Typography","variant","itemContent","itemGroup","createChipViewers","Group","sort","styled","Box","_ref","theme","_defineProperty","fontWeight","marginLeft","spacing","lineHeight","borderRadius","maxWidth","whiteSpace","overflow","textOverflow","display","flexWrap","border","palette","divider","shape","alignItems","padding","gap","color","text","secondary","flexDirection","marginBottom","borderBottom","paddingBottom"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{defineProperty as e,objectWithoutProperties as
|
|
1
|
+
import{defineProperty as e,objectWithoutProperties as n,objectSpread2 as r,slicedToArray as t,asyncToGenerator as i,regenerator as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as a}from"react/jsx-runtime";import{useState as u,useContext as c,useMemo as s,createRef as d}from"react";import{styled as m,Box as f,MenuList as p,Tooltip as v,IconButton as b,Badge as h,MenuItem as g,Typography as y,Button as j}from"@mui/material";import F from"@mui/icons-material/FilterList";import k from"@mui/material/ClickAwayListener";import{KeySpecial as I}from"../types.js";import{useFilterActions as C}from"./hooks.js";import{mapSpecialLabel as x}from"../helpers.js";import{FilterBarContext as S}from"../index.context.js";import{SingleRuleValidate as P,FormValidator as w}from"../../form/validator.js";import{PopperCustom as R,PopperContent as A,PopperFooter as B}from"./popper-custom.js";import{createFormFieldString as O,FilterMenuNoField as T}from"./filter-menu.units.js";var M=["fields","validation","enableQuickSearch"];function q(m){var f=D,p=function(e){var t=e.fields,i=e.validation,o=e.enableQuickSearch,l=void 0===o||o,a=n(e,M),u=I.quickSearch,c=r({},t);if(l){var s=c[u],d=null!=s&&s.label?s.label:x[u],m=Object.assign({},c[u],{field:u,label:d,singleValue:!0});c[u]=m}else delete c[u];var f=Object.keys(c),p=f.reduce(function(e,n){var t=c[n];return t?(e[n]=r(r({},t),{},{field:n}),e):e},{}),v=r({},i);return f.forEach(function(e){var n,r,t,i=v[e],o=null!==(n=null!==(r=null==i?void 0:i.label)&&void 0!==r?r:null===(t=c[e])||void 0===t?void 0:t.label)&&void 0!==n?n:e.toString();i?i.Rules.some(function(e){return e.rule===P.Required})||(i.label=o,i.Rules.push({rule:P.Required})):v[e]={Rules:[{rule:P.Required}],label:o}}),r(r({},a),{},{fields:p,validation:v,enableQuickSearch:l})}(m),q=function(n){return Object.keys(n.fields).reduce(function(r,t){var i,o=t,l=null===(i=n.validation)||void 0===i?void 0:i[o];return l&&(r[o]=new w(e({},o,l))),r},{})}(p),Q=function(e){var n=e.fields;return Object.keys(n).reduce(function(e,r){var t,i=r,o=n[i];return o&&(e[i]=null!==(t=o.form)&&void 0!==t?t:O(o)),e},{})}(p);return function(e){var n=d(),I=u(null),x=t(I,2),P=x[0],w=x[1],O=Boolean(P),M=c(S),D=C(M),V=u(null),z=t(V,2),E=z[0],_=z[1],G=s(function(){var n=m.popperProps,r=m.rootProps;return Object.assign({},{popperProps:n,rootProps:r},e.slots)},[m,e.slots]),H=function(){w(null),setTimeout(function(){_(null)},300)},W=function(){D.clearAllFilters(),H()},J=function(){var e=i(o().m(function e(n,r,t){return o().w(function(e){for(;;)switch(e.n){case 0:if(r){e.n=1;break}return e.a(2);case 1:null!=t&&t.singleValue?D.replaceFilter(n,r,{logic:r.logic}):D.upsertManyFilter(n,r,{logic:r.logic});case 2:return e.a(2)}},e)}));return function(n,r,t){return e.apply(this,arguments)}}(),K=s(function(){var e=Object.values(p.fields);return Array.from(e)},[p.fields]),U=D.getTotalCount(),X="".concat(U," Filter").concat(1!==U?"s":"");return l(k,{onClickAway:H,children:a(L,r(r({className:f.root},G.rootProps),{},{children:[l(v,{title:X,children:l(b,{size:"small",ref:n,onClick:function(){_(null),w(n.current)},children:l(h,{badgeContent:U,color:"primary",invisible:0===U,children:l(F,{fontSize:"small"})})})}),l(R,r(r({open:O,anchorEl:P,placement:"bottom",transition:!0,disablePortal:!0},G.popperProps),{},{children:function(){if(0===K.length)return l(T,{onClose:H});if(E){var e,n=Q[E];if(!n)return null;var r=null===(e=M.filterState.storeFilter)||void 0===e?void 0:e[E];return l(n,{value:r,isLoading:M.isLoading,onRemove:D.removeFilterByFieldValue,validator:q[E],onSubmit:J,onClose:H,onRemoveField:function(e){return D.removeFilter(e)},onBack:function(){return _(null)}})}return a(A,{title:"Filter by",onClose:H,children:[l(N,{className:f.menu,children:K.map(function(e){var n,r,t=e.field.toString();if(!t)return null;var i=D.getFieldInfo(e.field),o=null!==(n=null==i?void 0:i.values.join(", "))&&void 0!==n?n:"",u=i?i.values.length:0,c=u>0?" (".concat(u,")"):"",s=null!==(r=e.label)&&void 0!==r?r:t.toString(),d=u>0?"Filter by ".concat(s,": ").concat(o):void 0;return l(g,{className:f.menuItem,sx:{justifyContent:"space-between"},onClick:function(){return n=e.field,void _(n);var n},children:l(v,{title:d,placement:"right",arrow:!0,children:a("div",{className:f.menuItemInner,children:[l(y,{variant:"body2",children:s}),l(y,{variant:"caption",sx:{ml:1,color:"text.secondary"},children:c})]})})},t)})}),l(B,{children:l(j,{color:"error",disabled:0===U,onClick:W,children:"Clear All"})})]})}()}))]}))})}}var D={root:"DinoFilterMenu-root",menu:"DinoFilterMenu-menu",menuItem:"DinoFilterMenu-menuItem",menuItemInner:"DinoFilterMenu-menuItemInner"},L=m(f)(e({},"&.".concat(D.root),{display:"inline-flex",justifyContent:"center",alignItems:"center",flex:"0 0 auto"})),N=m(p)(e(e({},".".concat(D.menuItem),{paddingTop:0,paddingBottom:0}),".".concat(D.menuItemInner),{display:"flex",justifyContent:"space-between",alignItems:"center",width:"100%",gap:"4px",paddingTop:"6px",paddingBottom:"6px"}));export{q as createFilterMenu,D as filterMenuClasses};
|
|
2
2
|
//# sourceMappingURL=filter-menu.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filter-menu.js","sources":["../../../../src/filter-bar/components/filter-menu.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useContext, useMemo, useState } from 'react'\r\nimport { Badge, Box, Button, IconButton, MenuItem, MenuList, styled, Tooltip, Typography } from '@mui/material'\r\nimport FilterListIcon from '@mui/icons-material/FilterList'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from './hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { FormValidator, SingleRuleValidate } from '../../form/validator'\r\nimport { PopperContent, PopperCustom, PopperFooter } from './popper-custom'\r\nimport { createFormFieldString, FilterMenuNoField } from './filter-menu.units'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { TFieldModelValid, TFieldType, TFieldValue } from '../types'\r\nimport type { IConfigValue, IFormValidatorConfig } from '../../form/validator'\r\nimport type { IFilterMenuProps, IFilterMenuSlots, TFieldMenuConfigs } from './filter-menu.types'\r\nimport type { IFieldMenuConfig, IFilterMenuConfig, IFilterMenuFormProps } from './filter-menu.types'\r\n\r\nfunction generateValidatorMap<T>(config: IFilterMenuConfig<T>) {\r\n const keys = Object.keys(config.fields) as TFieldType<T>[]\r\n const validateMaps = keys.reduce(\r\n (acc, key) => {\r\n const fieldKey = key as TFieldType<T>\r\n const fieldConfig = config.validation?.[fieldKey]\r\n if (fieldConfig) {\r\n acc[fieldKey] = new FormValidator({ [fieldKey]: fieldConfig } as IFormValidatorConfig<Partial<TFieldModelValid<T>>>)\r\n }\r\n return acc\r\n },\r\n {} as Record<TFieldType<T>, FormValidator<Partial<TFieldModelValid<T>>>>\r\n )\r\n return validateMaps\r\n}\r\n\r\nfunction generateFormInputMap<T>(config: IFilterMenuConfig<T>) {\r\n const { fields } = config\r\n const keys = Object.keys(fields) as TFieldType<T>[]\r\n const formInputMaps = keys.reduce(\r\n (acc, key) => {\r\n const fieldKey = key as TFieldType<T>\r\n const fieldConfig = fields[fieldKey] as IFieldMenuConfig<T>\r\n if (fieldConfig) acc[fieldKey] = fieldConfig.form ?? createFormFieldString(fieldConfig)\r\n return acc\r\n },\r\n {} as Record<TFieldType<T>, React.ComponentType<IFilterMenuFormProps<T>>>\r\n )\r\n return formInputMaps\r\n}\r\n\r\nfunction generateConfigs<T>(config: IFilterMenuConfig<T>): IFilterMenuConfig<T> {\r\n const { fields, validation, enableQuickSearch = true, ...rest } = config\r\n const qsKey = KeySpecial.quickSearch\r\n\r\n // Merge quick search field if enabled\r\n const mergedFields: TFieldMenuConfigs<T> = { ...fields }\r\n if (enableQuickSearch) {\r\n const item = mergedFields[qsKey]\r\n const label = item?.label ? item.label : mapSpecialLabel[qsKey]\r\n const temp = Object.assign({}, mergedFields[qsKey], { field: qsKey, label, singleValue: true })\r\n mergedFields[qsKey] = temp\r\n } else {\r\n delete mergedFields[qsKey]\r\n }\r\n\r\n const keys = Object.keys(mergedFields) as TFieldType<T>[]\r\n const finalFields = keys.reduce<TFieldMenuConfigs<T>>((acc, key) => {\r\n const fieldConfig = mergedFields[key]\r\n if (!fieldConfig) return acc\r\n acc[key] = { ...fieldConfig, field: key }\r\n return acc\r\n }, {} as TFieldMenuConfigs<T>)\r\n\r\n // Merge validation config with default required rule\r\n const mergedValidation: IFormValidatorConfig<Partial<TFieldModelValid<T>>> = { ...validation }\r\n keys.forEach((key) => {\r\n const item: IConfigValue<Partial<TFieldModelValid<T>>> | undefined = mergedValidation[key]\r\n const label = item?.label ?? mergedFields[key]?.label ?? key.toString()\r\n if (!item) {\r\n mergedValidation[key] = { Rules: [{ rule: SingleRuleValidate.Required }], label }\r\n } else if (!item.Rules.some((r) => r.rule === SingleRuleValidate.Required)) {\r\n item.label = label\r\n item.Rules.push({ rule: SingleRuleValidate.Required })\r\n }\r\n })\r\n\r\n return { ...rest, fields: finalFields, validation: mergedValidation, enableQuickSearch }\r\n}\r\n\r\nexport function createFilterMenu<T>(config: IFilterMenuConfig<T>) {\r\n const classes = filterMenuClasses\r\n const mergedConfigs = generateConfigs(config)\r\n const validateMaps = generateValidatorMap(mergedConfigs)\r\n const formInputMaps = generateFormInputMap(mergedConfigs)\r\n\r\n // Component\r\n const FilterMenu: FC<IFilterMenuProps<T>> = (props) => {\r\n const refButton = createRef<HTMLButtonElement>()\r\n\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n const isOpen = Boolean(anchorEl)\r\n\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const filterActions = useFilterActions<T>(context)\r\n\r\n const [fieldSelected, setFieldSelected] = useState<TFieldType<T> | null>(null)\r\n\r\n const mergedSlots = useMemo<IFilterMenuSlots>(() => {\r\n const { popperProps, rootProps } = config\r\n return Object.assign({}, { popperProps, rootProps }, props.slots)\r\n }, [config, props.slots])\r\n\r\n const handleClose = () => {\r\n setAnchorEl(null)\r\n setTimeout(() => {\r\n setFieldSelected(null)\r\n }, 300)\r\n }\r\n\r\n const handleOpen = () => {\r\n setFieldSelected(null)\r\n setAnchorEl(refButton.current)\r\n }\r\n\r\n const handleMenuItemClick = (field: TFieldType<T>) => {\r\n setFieldSelected(field)\r\n }\r\n\r\n const handleClearAll = () => {\r\n filterActions.clearAllFilters()\r\n handleClose()\r\n }\r\n\r\n const handleSubmit = (key: TFieldType<T>, value?: TFieldValue, config?: IFieldMenuConfig<T>) => {\r\n if (!value) return\r\n if (config?.singleValue) {\r\n filterActions.replaceFilter(key, value, { logic: value.logic })\r\n } else {\r\n filterActions.upsertManyFilter(key, value, { logic: value.logic })\r\n }\r\n }\r\n\r\n const data = useMemo(() => {\r\n const keys = Object.values(mergedConfigs.fields)\r\n return Array.from(keys) as IFieldMenuConfig<T>[]\r\n }, [mergedConfigs.fields])\r\n\r\n const renderContent = () => {\r\n if (data.length === 0) {\r\n return <FilterMenuNoField onClose={handleClose} />\r\n }\r\n\r\n if (fieldSelected) {\r\n const FormComponent = formInputMaps[fieldSelected] as React.ComponentType<IFilterMenuFormProps<T>>\r\n if (!FormComponent) return null\r\n const value = context.filterState.storeFilter?.[fieldSelected]\r\n return (\r\n <FormComponent\r\n value={value}\r\n onRemove={filterActions.removeFilterByFieldValue}\r\n validator={validateMaps[fieldSelected]}\r\n onSubmit={handleSubmit}\r\n onClose={handleClose}\r\n onBack={() => setFieldSelected(null)}\r\n />\r\n )\r\n }\r\n\r\n return (\r\n <PopperContent title='Filter by' onClose={handleClose}>\r\n <MenuList className={classes.menu}>\r\n {data.map((item) => {\r\n const key = item.field.toString()\r\n if (!key) return null\r\n const fieldCount = filterActions.getCountByField(item.field)\r\n const suffix = fieldCount > 0 ? ` (${fieldCount})` : ''\r\n const label = item.label ?? key.toString()\r\n return (\r\n <MenuItem\r\n key={key}\r\n className={classes.menuItem}\r\n sx={{ justifyContent: 'space-between' }}\r\n onClick={() => handleMenuItemClick(item.field)}\r\n >\r\n <Typography variant='body2'>{label}</Typography>\r\n <Typography variant='caption' sx={{ ml: 1, color: 'text.secondary' }}>\r\n {suffix}\r\n </Typography>\r\n </MenuItem>\r\n )\r\n })}\r\n </MenuList>\r\n <PopperFooter>\r\n <Button color='error' disabled={filterCount === 0} onClick={handleClearAll}>\r\n Clear All\r\n </Button>\r\n </PopperFooter>\r\n </PopperContent>\r\n )\r\n }\r\n\r\n const filterCount = filterActions.getTotalCount()\r\n const iconTitle = `${filterCount} Filter${filterCount !== 1 ? 's' : ''}`\r\n return (\r\n <ClickAwayListener onClickAway={handleClose}>\r\n <FilterInputStyled className={classes.root} {...mergedSlots.rootProps}>\r\n <Tooltip title={iconTitle}>\r\n <IconButton size='small' ref={refButton} onClick={handleOpen}>\r\n <Badge badgeContent={filterCount} color='primary' invisible={filterCount === 0}>\r\n <FilterListIcon fontSize='small' />\r\n </Badge>\r\n </IconButton>\r\n </Tooltip>\r\n <PopperCustom open={isOpen} anchorEl={anchorEl} placement='bottom' transition disablePortal {...mergedSlots.popperProps}>\r\n {renderContent()}\r\n </PopperCustom>\r\n </FilterInputStyled>\r\n </ClickAwayListener>\r\n )\r\n }\r\n return FilterMenu\r\n}\r\n\r\n// styles\r\nexport const filterMenuClasses = {\r\n root: 'DinoFilterMenu-root',\r\n input: 'DinoFilterMenu-input',\r\n beforeInput: 'DinoFilterMenu-beforeInput',\r\n menu: 'DinoFilterMenu-menu',\r\n menuItem: 'DinoFilterMenu-menuItem'\r\n}\r\n\r\nconst FilterInputStyled = styled(Box)({\r\n [`&.${filterMenuClasses.root}`]: {\r\n display: 'inline-flex',\r\n justifyContent: 'center',\r\n alignItems: 'center',\r\n flex: '0 0 auto'\r\n }\r\n})\r\n"],"names":["createFilterMenu","config","classes","filterMenuClasses","mergedConfigs","fields","validation","_config$enableQuickSe","enableQuickSearch","rest","_objectWithoutProperties","_excluded","qsKey","KeySpecial","quickSearch","mergedFields","_objectSpread","item","label","mapSpecialLabel","temp","Object","assign","field","singleValue","keys","finalFields","reduce","acc","key","fieldConfig","mergedValidation","forEach","_ref","_item$label","_mergedFields$key","toString","Rules","some","r","rule","SingleRuleValidate","Required","push","generateConfigs","validateMaps","_config$validation","fieldKey","FormValidator","_defineProperty","generateValidatorMap","formInputMaps","_fieldConfig$form","form","createFormFieldString","generateFormInputMap","props","refButton","createRef","_useState","useState","_useState2","_slicedToArray","anchorEl","setAnchorEl","isOpen","Boolean","context","useContext","FilterBarContext","filterActions","useFilterActions","_useState3","_useState4","fieldSelected","setFieldSelected","mergedSlots","useMemo","popperProps","rootProps","slots","handleClose","setTimeout","handleClearAll","clearAllFilters","handleSubmit","value","replaceFilter","logic","upsertManyFilter","data","values","Array","from","filterCount","getTotalCount","iconTitle","concat","_jsx","ClickAwayListener","onClickAway","children","_jsxs","FilterInputStyled","className","root","Tooltip","title","IconButton","size","ref","onClick","current","Badge","badgeContent","color","invisible","FilterListIcon","fontSize","PopperCustom","open","placement","transition","disablePortal","length","FilterMenuNoField","onClose","_context$filterState$","FormComponent","filterState","storeFilter","onRemove","removeFilterByFieldValue","validator","onSubmit","onBack","PopperContent","MenuList","menu","map","_item$label2","fieldCount","getCountByField","suffix","MenuItem","menuItem","sx","justifyContent","Typography","variant","ml","PopperFooter","Button","disabled","renderContent","styled","Box","display","alignItems","flex"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"filter-menu.js","sources":["../../../../src/filter-bar/components/filter-menu.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, Fragment, useContext, useMemo, useState } from 'react'\r\nimport { Badge, Box, Button, IconButton, MenuItem, MenuList, Stack, styled, Tooltip, Typography } from '@mui/material'\r\nimport FilterListIcon from '@mui/icons-material/FilterList'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from './hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { FormValidator, SingleRuleValidate } from '../../form/validator'\r\nimport { PopperContent, PopperCustom, PopperFooter } from './popper-custom'\r\nimport { createFormFieldString, FilterMenuNoField } from './filter-menu.units'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { TFieldModelValid, TFieldType, TFieldValue } from '../types'\r\nimport type { IConfigValue, IFormValidatorConfig } from '../../form/validator'\r\nimport type { IFilterMenuProps, IFilterMenuSlots, TFieldMenuConfigs } from './filter-menu.types'\r\nimport type { IFieldMenuConfig, IFilterMenuConfig, IFilterMenuFormProps } from './filter-menu.types'\r\n\r\nfunction generateValidatorMap<T>(config: IFilterMenuConfig<T>) {\r\n const keys = Object.keys(config.fields) as TFieldType<T>[]\r\n const validateMaps = keys.reduce(\r\n (acc, key) => {\r\n const fieldKey = key as TFieldType<T>\r\n const fieldConfig = config.validation?.[fieldKey]\r\n if (fieldConfig) {\r\n acc[fieldKey] = new FormValidator({ [fieldKey]: fieldConfig } as IFormValidatorConfig<Partial<TFieldModelValid<T>>>)\r\n }\r\n return acc\r\n },\r\n {} as Record<TFieldType<T>, FormValidator<Partial<TFieldModelValid<T>>>>\r\n )\r\n return validateMaps\r\n}\r\n\r\nfunction generateFormInputMap<T>(config: IFilterMenuConfig<T>) {\r\n const { fields } = config\r\n const keys = Object.keys(fields) as TFieldType<T>[]\r\n const formInputMaps = keys.reduce(\r\n (acc, key) => {\r\n const fieldKey = key as TFieldType<T>\r\n const fieldConfig = fields[fieldKey] as IFieldMenuConfig<T>\r\n if (fieldConfig) acc[fieldKey] = fieldConfig.form ?? createFormFieldString(fieldConfig)\r\n return acc\r\n },\r\n {} as Record<TFieldType<T>, React.ComponentType<IFilterMenuFormProps<T>>>\r\n )\r\n return formInputMaps\r\n}\r\n\r\nfunction generateConfigs<T>(config: IFilterMenuConfig<T>): IFilterMenuConfig<T> {\r\n const { fields, validation, enableQuickSearch = true, ...rest } = config\r\n const qsKey = KeySpecial.quickSearch\r\n\r\n // Merge quick search field if enabled\r\n const mergedFields: TFieldMenuConfigs<T> = { ...fields }\r\n if (enableQuickSearch) {\r\n const item = mergedFields[qsKey]\r\n const label = item?.label ? item.label : mapSpecialLabel[qsKey]\r\n const temp = Object.assign({}, mergedFields[qsKey], { field: qsKey, label, singleValue: true })\r\n mergedFields[qsKey] = temp\r\n } else {\r\n delete mergedFields[qsKey]\r\n }\r\n\r\n const keys = Object.keys(mergedFields) as TFieldType<T>[]\r\n const finalFields = keys.reduce<TFieldMenuConfigs<T>>((acc, key) => {\r\n const fieldConfig = mergedFields[key]\r\n if (!fieldConfig) return acc\r\n acc[key] = { ...fieldConfig, field: key }\r\n return acc\r\n }, {} as TFieldMenuConfigs<T>)\r\n\r\n // Merge validation config with default required rule\r\n const mergedValidation: IFormValidatorConfig<Partial<TFieldModelValid<T>>> = { ...validation }\r\n keys.forEach((key) => {\r\n const item: IConfigValue<Partial<TFieldModelValid<T>>> | undefined = mergedValidation[key]\r\n const label = item?.label ?? mergedFields[key]?.label ?? key.toString()\r\n if (!item) {\r\n mergedValidation[key] = { Rules: [{ rule: SingleRuleValidate.Required }], label }\r\n } else if (!item.Rules.some((r) => r.rule === SingleRuleValidate.Required)) {\r\n item.label = label\r\n item.Rules.push({ rule: SingleRuleValidate.Required })\r\n }\r\n })\r\n\r\n return { ...rest, fields: finalFields, validation: mergedValidation, enableQuickSearch }\r\n}\r\n\r\nexport function createFilterMenu<T>(config: IFilterMenuConfig<T>) {\r\n const classes = filterMenuClasses\r\n const mergedConfigs = generateConfigs(config)\r\n const validateMaps = generateValidatorMap(mergedConfigs)\r\n const formInputMaps = generateFormInputMap(mergedConfigs)\r\n\r\n // Component\r\n const FilterMenu: FC<IFilterMenuProps<T>> = (props) => {\r\n const refButton = createRef<HTMLButtonElement>()\r\n\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n const isOpen = Boolean(anchorEl)\r\n\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const filterActions = useFilterActions<T>(context)\r\n\r\n const [fieldSelected, setFieldSelected] = useState<TFieldType<T> | null>(null)\r\n\r\n const mergedSlots = useMemo<IFilterMenuSlots>(() => {\r\n const { popperProps, rootProps } = config\r\n return Object.assign({}, { popperProps, rootProps }, props.slots)\r\n }, [config, props.slots])\r\n\r\n const handleClose = () => {\r\n setAnchorEl(null)\r\n setTimeout(() => {\r\n setFieldSelected(null)\r\n }, 300)\r\n }\r\n\r\n const handleOpen = () => {\r\n setFieldSelected(null)\r\n setAnchorEl(refButton.current)\r\n }\r\n\r\n const handleMenuItemClick = (field: TFieldType<T>) => {\r\n setFieldSelected(field)\r\n }\r\n\r\n const handleClearAll = () => {\r\n filterActions.clearAllFilters()\r\n handleClose()\r\n }\r\n\r\n const handleSubmit = async (key: TFieldType<T>, value?: TFieldValue, config?: IFieldMenuConfig<T>) => {\r\n if (!value) return\r\n if (config?.singleValue) {\r\n filterActions.replaceFilter(key, value, { logic: value.logic })\r\n } else {\r\n filterActions.upsertManyFilter(key, value, { logic: value.logic })\r\n }\r\n }\r\n\r\n const data = useMemo(() => {\r\n const keys = Object.values(mergedConfigs.fields)\r\n return Array.from(keys) as IFieldMenuConfig<T>[]\r\n }, [mergedConfigs.fields])\r\n\r\n const renderContent = () => {\r\n if (data.length === 0) {\r\n return <FilterMenuNoField onClose={handleClose} />\r\n }\r\n\r\n if (fieldSelected) {\r\n const FormComponent = formInputMaps[fieldSelected] as React.ComponentType<IFilterMenuFormProps<T>>\r\n if (!FormComponent) return null\r\n const value = context.filterState.storeFilter?.[fieldSelected]\r\n return (\r\n <FormComponent\r\n value={value}\r\n isLoading={context.isLoading}\r\n onRemove={filterActions.removeFilterByFieldValue}\r\n validator={validateMaps[fieldSelected]}\r\n onSubmit={handleSubmit}\r\n onClose={handleClose}\r\n onRemoveField={(f) => filterActions.removeFilter(f)}\r\n onBack={() => setFieldSelected(null)}\r\n />\r\n )\r\n }\r\n\r\n return (\r\n <PopperContent title='Filter by' onClose={handleClose}>\r\n <MenuListCustom className={classes.menu}>\r\n {data.map((item) => {\r\n const key = item.field.toString()\r\n if (!key) return null\r\n const info = filterActions.getFieldInfo(item.field)\r\n const note = info?.values.join(', ') ?? ''\r\n const fieldCount = info ? info.values.length : 0\r\n const suffix = fieldCount > 0 ? ` (${fieldCount})` : ''\r\n const label = item.label ?? key.toString()\r\n const tooltipTitle = fieldCount > 0 ? `Filter by ${label}: ${note}` : undefined\r\n return (\r\n <MenuItem\r\n key={key}\r\n className={classes.menuItem}\r\n sx={{ justifyContent: 'space-between' }}\r\n onClick={() => handleMenuItemClick(item.field)}\r\n >\r\n <Tooltip title={tooltipTitle} placement='right' arrow>\r\n <div className={classes.menuItemInner}>\r\n <Typography variant='body2'>{label}</Typography>\r\n <Typography variant='caption' sx={{ ml: 1, color: 'text.secondary' }}>\r\n {suffix}\r\n </Typography>\r\n </div>\r\n </Tooltip>\r\n </MenuItem>\r\n )\r\n })}\r\n </MenuListCustom>\r\n <PopperFooter>\r\n <Button color='error' disabled={filterCount === 0} onClick={handleClearAll}>\r\n Clear All\r\n </Button>\r\n </PopperFooter>\r\n </PopperContent>\r\n )\r\n }\r\n\r\n const filterCount = filterActions.getTotalCount()\r\n const iconTitle = `${filterCount} Filter${filterCount !== 1 ? 's' : ''}`\r\n return (\r\n <ClickAwayListener onClickAway={handleClose}>\r\n <FilterInputStyled className={classes.root} {...mergedSlots.rootProps}>\r\n <Tooltip title={iconTitle}>\r\n <IconButton size='small' ref={refButton} onClick={handleOpen}>\r\n <Badge badgeContent={filterCount} color='primary' invisible={filterCount === 0}>\r\n <FilterListIcon fontSize='small' />\r\n </Badge>\r\n </IconButton>\r\n </Tooltip>\r\n <PopperCustom open={isOpen} anchorEl={anchorEl} placement='bottom' transition disablePortal {...mergedSlots.popperProps}>\r\n {renderContent()}\r\n </PopperCustom>\r\n </FilterInputStyled>\r\n </ClickAwayListener>\r\n )\r\n }\r\n return FilterMenu\r\n}\r\n\r\n// styles\r\nexport const filterMenuClasses = {\r\n root: 'DinoFilterMenu-root',\r\n input: 'DinoFilterMenu-input',\r\n beforeInput: 'DinoFilterMenu-beforeInput',\r\n menu: 'DinoFilterMenu-menu',\r\n menuItem: 'DinoFilterMenu-menuItem',\r\n menuItemInner: 'DinoFilterMenu-menuItemInner'\r\n}\r\n\r\nconst FilterInputStyled = styled(Box)({\r\n [`&.${filterMenuClasses.root}`]: {\r\n display: 'inline-flex',\r\n justifyContent: 'center',\r\n alignItems: 'center',\r\n flex: '0 0 auto'\r\n }\r\n})\r\n\r\nconst MenuListCustom = styled(MenuList)({\r\n [`.${filterMenuClasses.menuItem}`]: {\r\n paddingTop: 0,\r\n paddingBottom: 0\r\n },\r\n [`.${filterMenuClasses.menuItemInner}`]: {\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n alignItems: 'center',\r\n width: '100%',\r\n gap: '4px',\r\n paddingTop: '6px',\r\n paddingBottom: '6px'\r\n }\r\n})\r\n"],"names":["createFilterMenu","config","classes","filterMenuClasses","mergedConfigs","fields","validation","_config$enableQuickSe","enableQuickSearch","rest","_objectWithoutProperties","_excluded","qsKey","KeySpecial","quickSearch","mergedFields","_objectSpread","item","label","mapSpecialLabel","temp","Object","assign","field","singleValue","keys","finalFields","reduce","acc","key","fieldConfig","mergedValidation","forEach","_ref","_item$label","_mergedFields$key","toString","Rules","some","r","rule","SingleRuleValidate","Required","push","generateConfigs","validateMaps","_config$validation","fieldKey","FormValidator","_defineProperty","generateValidatorMap","formInputMaps","_fieldConfig$form","form","createFormFieldString","generateFormInputMap","props","refButton","createRef","_useState","useState","_useState2","_slicedToArray","anchorEl","setAnchorEl","isOpen","Boolean","context","useContext","FilterBarContext","filterActions","useFilterActions","_useState3","_useState4","fieldSelected","setFieldSelected","mergedSlots","useMemo","popperProps","rootProps","slots","handleClose","setTimeout","handleClearAll","clearAllFilters","handleSubmit","_ref2","_asyncToGenerator","_regenerator","m","_callee","value","w","_context","n","a","replaceFilter","logic","upsertManyFilter","_x","_x2","_x3","apply","this","arguments","data","values","Array","from","filterCount","getTotalCount","iconTitle","concat","_jsx","ClickAwayListener","onClickAway","children","_jsxs","FilterInputStyled","className","root","Tooltip","title","IconButton","size","ref","onClick","current","Badge","badgeContent","color","invisible","FilterListIcon","fontSize","PopperCustom","open","placement","transition","disablePortal","length","FilterMenuNoField","onClose","_context$filterState$","FormComponent","filterState","storeFilter","isLoading","onRemove","removeFilterByFieldValue","validator","onSubmit","onRemoveField","f","removeFilter","onBack","PopperContent","MenuListCustom","menu","map","_info$values$join","_item$label2","info","getFieldInfo","note","join","fieldCount","suffix","tooltipTitle","undefined","MenuItem","menuItem","sx","justifyContent","arrow","menuItemInner","Typography","variant","ml","PopperFooter","Button","disabled","renderContent","styled","Box","display","alignItems","flex","MenuList","paddingTop","paddingBottom","width","gap"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{objectWithoutProperties as e,objectSpread2 as l,slicedToArray as
|
|
1
|
+
import{objectWithoutProperties as e,objectSpread2 as l,slicedToArray as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as r,jsxs as i}from"react/jsx-runtime";import{useState as t,useMemo as n,createRef as a}from"react";import{styled as c,Tooltip as s,IconButton as u,alpha as d,Chip as m,ToggleButtonGroup as v,TextField as p,Button as f,Box as h,Typography as b,ToggleButton as g}from"@mui/material";import x from"@mui/icons-material/ChevronLeft";import{createChipViewers as C}from"./chip-viewer.js";import{PopperContent as y,PopperBody as k,PopperFooter as z}from"./popper-custom.js";import{getErrorMessage as A,convertFormDataToJson as j}from"../../form/helpers.js";var w=["children"],S=function(e){var l=e.onClose;return r(y,{title:"Filter by",onClose:l,children:r(b,{variant:"body2",sx:{p:2,textAlign:"center"},children:"No field to filter"})})},B=c(function(o){var i=o.children,t=e(o,w);return r(s,{title:"Back",placement:"top",arrow:!0,children:r(u,l(l({},t),{},{children:i||r(x,{fontSize:"small"})}))})})(function(e){var l=e.theme;return{color:l.palette.common.white,transition:l.transitions.create("color"),"&:hover":{color:l.palette.primary.light,backgroundColor:d(l.palette.common.white,.1)}}}),T=c(m)(function(e){var l=e.theme;return{backgroundColor:"dark"===l.palette.mode?l.palette.grey[900]:l.palette.grey[800],color:l.palette.common.white,border:"1px solid ".concat(d(l.palette.common.white,.1)),height:20,fontSize:"0.75rem","& .MuiChip-label":{color:l.palette.common.white}}}),F=function(e){return i(M,{size:"small",value:e.value||"and",exclusive:!0,onChange:function(l,o){o&&e.onChange&&e.onChange(l,o)},sx:e.sx,children:[r(g,{size:"small",value:"and","aria-label":"and logic",children:"AND"}),r(g,{size:"small",value:"or","aria-label":"or logic",children:"OR"})]})},M=c(v)({"& .MuiToggleButton-root":{color:"#fff",borderColor:"rgba(255, 255, 255, 0.3)",fontSize:"0.65rem",fontWeight:600,lineHeight:1,minWidth:"40px",padding:"6px 8px","&.Mui-selected":{backgroundColor:"#1976d2",color:"#fff","&:hover":{backgroundColor:"#1565c0"}},"&:hover":{backgroundColor:"rgba(255, 255, 255, 0.08)"}}});function R(e){var l=C();return function(c){var s,u=a(),d=c.value,m=void 0===d?{values:[],logic:"or"}:d,v=t(m.logic),b=o(v,2),g=b[0],x=b[1],C=null!==(s=null==e?void 0:e.label)&&void 0!==s?s:e.field.toString(),w=t({}),S=o(w,2),M=S[0],R=S[1],D=function(l){c.onSubmit(e.field,l,e)},H=A(M,e.field),I=n(function(){var l=Array.isArray(m.values)?m.values:[m.values];return{field:e.field,items:l.map(function(e){return{value:e}})}},[e.field,m]),L=[];return c.isLoading&&L.push("disabled"),r(W,{className:L.join(" "),onSubmit:function(l){var o;l.preventDefault();var r=new FormData(l.currentTarget),i=j(r),t=null===(o=c.validator)||void 0===o?void 0:o.run(i);if(R(t||{}),!t||0===Object.keys(t).length){var n=Array.isArray(i[e.field])?i[e.field]:[i[e.field]];D({values:n,logic:g}),u.current&&(u.current.blur(),u.current.value="")}},noValidate:!0,children:i(y,{title:"Filter by ".concat(C),onClose:c.onClose,slots:{beforeTitle:r(B,{size:"small",onClick:c.onBack}),afterTitle:e.singleValue?r(T,{sx:{ml:1.5},size:"small",label:"Last value only"}):!m.values||m.values.length<2?null:r(F,{sx:{ml:1},value:g,onChange:function(e,l){return function(e){x(e);var l={values:m.values,logic:e};D(l)}(l)}})},children:[i(k,{children:[r(l.Group,{sx:{mb:1,borderBottom:"none!important"},label:"Applied",placement:"horizontal",enableMinimalesticView:!0,value:I,onRemove:c.onRemove}),r(p,{inputRef:u,autoFocus:!0,name:e.field.toString(),size:"small",fullWidth:!0,placeholder:"Enter value",error:H.error,helperText:H.message,sx:{".MuiInputBase-root":{minHeight:"42px"}}})]}),i(z,{children:[r(f,{size:"small",color:"error",variant:"text",name:"action",value:"clear",disabled:!m.values||0===m.values.length,onClick:function(){var l;null===(l=c.onRemoveField)||void 0===l||l.call(c,e.field)},children:"Clear All"}),r(h,{sx:{flex:1}}),r(f,{size:"small",color:"inherit",variant:"text",name:"action",value:"cancel",onClick:c.onClose,children:"Cancel"}),r(f,{size:"small",type:"submit",color:"primary",variant:"contained",name:"action",value:"ok",children:"Apply"})]})]})})}}var W=c("form")({position:"relative","&::after":{content:'""',display:"block",position:"absolute",inset:0,backgroundColor:"rgba(0, 0, 0, 0.2)",filter:"blur(2px)",zIndex:-1,opacity:0,transition:"opacity 0.3s",visibility:"hidden"},"&.disabled":{pointerEvents:"none","&::after":{zIndex:1,opacity:1,visibility:"visible"}}});export{F as FilterLogicToggle,S as FilterMenuNoField,R as createFormFieldString};
|
|
2
2
|
//# sourceMappingURL=filter-menu.units.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filter-menu.units.js","sources":["../../../../src/filter-bar/components/filter-menu.units.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useMemo, useState } from 'react'\r\nimport { alpha, Box, Button, Chip, IconButton, styled, TextField, ToggleButton, ToggleButtonGroup, Tooltip, Typography } from '@mui/material'\r\nimport ChevronLeftIcon from '@mui/icons-material/ChevronLeft'\r\nimport { createChipViewers } from './chip-viewer'\r\nimport { PopperBody, PopperContent, PopperFooter } from './popper-custom'\r\nimport { convertFormDataToJson, getErrorMessage } from '../../form/helpers'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IconButtonProps, ToggleButtonGroupProps } from '@mui/material'\r\nimport type { TChipViewerGroup } from './chip-viewer'\r\nimport type { IPartialError } from '../../form/validator'\r\nimport type { IFieldMenuConfig, IFilterMenuFormProps } from './filter-menu.types'\r\nimport type { TFieldModelValid, TFieldValid, TFieldValue, TLogic } from '../types'\r\n\r\ninterface IFilterMenuNoFieldProps {\r\n onClose: () => void\r\n}\r\n\r\nexport const FilterMenuNoField: FC<IFilterMenuNoFieldProps> = ({ onClose }) => (\r\n <PopperContent title='Filter by' onClose={onClose}>\r\n <Typography variant='body2' sx={{ p: 2, textAlign: 'center' }}>\r\n No field to filter\r\n </Typography>\r\n </PopperContent>\r\n)\r\n\r\nconst ButtonBack = styled(({ children, ...props }: IconButtonProps) => (\r\n <Tooltip title='Back' placement='top' arrow>\r\n <IconButton {...props}>{children || <ChevronLeftIcon fontSize='small' />}</IconButton>\r\n </Tooltip>\r\n))(({ theme }) => ({\r\n color: theme.palette.common.white,\r\n transition: theme.transitions.create('color'),\r\n '&:hover': {\r\n color: theme.palette.primary.light,\r\n backgroundColor: alpha(theme.palette.common.white, 0.1)\r\n }\r\n}))\r\n\r\nconst ChipDark = styled(Chip)(({ theme }) => ({\r\n backgroundColor: theme.palette.mode === 'dark' ? theme.palette.grey[900] : theme.palette.grey[800],\r\n color: theme.palette.common.white,\r\n border: `1px solid ${alpha(theme.palette.common.white, 0.1)}`,\r\n height: 20,\r\n fontSize: '0.75rem',\r\n '& .MuiChip-label': {\r\n color: theme.palette.common.white\r\n }\r\n}))\r\n\r\nexport interface FilterLogicToggleProps {\r\n value?: TLogic\r\n onChange?: (event: React.MouseEvent<HTMLElement>, value: TLogic) => void\r\n sx?: ToggleButtonGroupProps['sx']\r\n}\r\n\r\nexport const FilterLogicToggle: FC<FilterLogicToggleProps> = (props) => {\r\n const handleChange = (event: React.MouseEvent<HTMLElement>, newValue: string | null) => {\r\n if (newValue && props.onChange) {\r\n props.onChange(event, newValue as TLogic)\r\n }\r\n }\r\n\r\n return (\r\n <ToggleButtonGroupCustom size='small' value={props.value || 'and'} exclusive onChange={handleChange} sx={props.sx}>\r\n <ToggleButton size='small' value='and' aria-label='and logic'>\r\n AND\r\n </ToggleButton>\r\n <ToggleButton size='small' value='or' aria-label='or logic'>\r\n OR\r\n </ToggleButton>\r\n </ToggleButtonGroupCustom>\r\n )\r\n}\r\n\r\nconst ToggleButtonGroupCustom = styled(ToggleButtonGroup)({\r\n '& .MuiToggleButton-root': {\r\n color: '#fff',\r\n borderColor: 'rgba(255, 255, 255, 0.3)',\r\n fontSize: '0.65rem',\r\n fontWeight: 600,\r\n lineHeight: 1,\r\n minWidth: '40px',\r\n padding: '6px 8px',\r\n '&.Mui-selected': {\r\n backgroundColor: '#1976d2',\r\n color: '#fff',\r\n '&:hover': { backgroundColor: '#1565c0' }\r\n },\r\n '&:hover': { backgroundColor: 'rgba(255, 255, 255, 0.08)' }\r\n }\r\n})\r\n\r\nexport interface IFormFieldStringProps<T> extends IFilterMenuFormProps<T> {}\r\n\r\nexport function createFormFieldString<T>(config: IFieldMenuConfig<T>) {\r\n const ChipViewers = createChipViewers<T>()\r\n\r\n const FormFieldString: FC<IFormFieldStringProps<T>> = (props) => {\r\n const refInput = createRef<HTMLInputElement>()\r\n const { value = { values: [], logic: 'or' } } = props\r\n const [filterLogic, setFilterLogic] = useState<TLogic>(value.logic!)\r\n\r\n const label = config?.label ?? config.field.toString()\r\n\r\n const [errorData, setErrorData] = useState<IPartialError<TFieldModelValid<T>>>({})\r\n\r\n const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {\r\n event.preventDefault()\r\n const formData = new FormData(event.currentTarget)\r\n const obj = convertFormDataToJson<TFieldModelValid<T>>(formData)\r\n let errorData = props.validator?.run(obj) as IPartialError<TFieldModelValid<T>>\r\n const isLogicChange = filterLogic !== value.logic && value.values && value.values.length > 1\r\n if (isLogicChange) errorData = {}\r\n\r\n setErrorData(errorData || {})\r\n\r\n if (!errorData || Object.keys(errorData).length === 0 || isLogicChange) {\r\n const newValues = (Array.isArray(obj[config.field]) ? obj[config.field] : [obj[config.field]]) as TFieldValid[]\r\n const newValue: TFieldValue = { values: newValues, logic: filterLogic }\r\n props.onSubmit?.(config.field, newValue, config)\r\n\r\n const action = (event.nativeEvent as any).submitter?.value\r\n if (action === 'ok') {\r\n // Clear input value\r\n if (refInput.current) refInput.current.value = ''\r\n }\r\n }\r\n }\r\n\r\n const error = getErrorMessage(errorData, config.field)\r\n\r\n const filterViewerValue = useMemo<TChipViewerGroup<T>>(() => {\r\n const items = Array.isArray(value.values) ? value.values : [value.values]\r\n return { field: config.field, items: items.map((v) => ({ value: v })) }\r\n }, [config.field, value])\r\n\r\n const renderAfterTitle = () => {\r\n if (config.singleValue) return <ChipDark sx={{ ml: 1 }} size='small' label='Single Value' />\r\n if (!value.values || value.values.length < 2) return null\r\n return <FilterLogicToggle sx={{ ml: 1 }} value={filterLogic} onChange={(_, value) => setFilterLogic(value)} />\r\n }\r\n\r\n return (\r\n <form onSubmit={handleSubmit} noValidate>\r\n <PopperContent\r\n title={`Filter by ${label}`}\r\n onClose={props.onClose}\r\n slots={{\r\n beforeTitle: <ButtonBack size='small' onClick={props.onBack} />,\r\n afterTitle: renderAfterTitle()\r\n }}\r\n >\r\n <PopperBody>\r\n <ChipViewers.Group\r\n sx={{ mb: 1, borderBottom: 'none!important' }}\r\n label='Applied'\r\n placement='horizontal'\r\n enableMinimalesticView\r\n value={filterViewerValue}\r\n onRemove={props.onRemove}\r\n />\r\n <TextField\r\n inputRef={refInput}\r\n autoFocus\r\n name={config.field.toString()}\r\n size='small'\r\n fullWidth\r\n placeholder='Enter value'\r\n error={error.error}\r\n helperText={error.message}\r\n sx={{ '.MuiInputBase-root': { minHeight: '42px' } }}\r\n />\r\n </PopperBody>\r\n <PopperFooter>\r\n <Button size='small' color='inherit' variant='text' name='action' value='cancel' onClick={props.onClose}>\r\n Cancel\r\n </Button>\r\n <Box sx={{ flex: 1 }} />\r\n <Button size='small' type='submit' color='primary' variant='contained' name='action' value='ok'>\r\n Apply\r\n </Button>\r\n </PopperFooter>\r\n </PopperContent>\r\n </form>\r\n )\r\n }\r\n\r\n return FormFieldString\r\n}\r\n"],"names":["FilterMenuNoField","_ref","onClose","_jsx","PopperContent","title","Typography","variant","sx","p","textAlign","children","ButtonBack","styled","_ref2","props","_objectWithoutProperties","_excluded","Tooltip","placement","arrow","IconButton","_objectSpread","ChevronLeftIcon","fontSize","_ref3","theme","color","palette","common","white","transition","transitions","create","primary","light","backgroundColor","alpha","ChipDark","Chip","_ref4","mode","grey","border","concat","height","FilterLogicToggle","_jsxs","ToggleButtonGroupCustom","size","value","exclusive","onChange","event","newValue","ToggleButton","ToggleButtonGroup","borderColor","fontWeight","lineHeight","minWidth","padding","createFormFieldString","config","ChipViewers","createChipViewers","_config$label","refInput","createRef","_props$value","values","logic","_useState","useState","_useState2","_slicedToArray","filterLogic","setFilterLogic","label","field","toString","_useState3","_useState4","errorData","setErrorData","error","getErrorMessage","filterViewerValue","useMemo","items","Array","isArray","map","v","onSubmit","_props$validator","preventDefault","formData","FormData","currentTarget","obj","convertFormDataToJson","validator","run","isLogicChange","length","Object","keys","_props$onSubmit","_event$nativeEvent$su","call","nativeEvent","submitter","current","noValidate","slots","beforeTitle","onClick","onBack","afterTitle","singleValue","ml","_","PopperBody","Group","mb","borderBottom","enableMinimalesticView","onRemove","TextField","inputRef","autoFocus","name","fullWidth","placeholder","helperText","message","minHeight","PopperFooter","Button","Box","flex","type"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"filter-menu.units.js","sources":["../../../../src/filter-bar/components/filter-menu.units.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useMemo, useState } from 'react'\r\nimport { alpha, Box, Button, Chip, IconButton, styled, TextField, ToggleButton, ToggleButtonGroup, Tooltip, Typography } from '@mui/material'\r\nimport ChevronLeftIcon from '@mui/icons-material/ChevronLeft'\r\nimport { createChipViewers } from './chip-viewer'\r\nimport { PopperBody, PopperContent, PopperFooter } from './popper-custom'\r\nimport { convertFormDataToJson, getErrorMessage } from '../../form/helpers'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IconButtonProps, ToggleButtonGroupProps } from '@mui/material'\r\nimport type { TChipViewerGroup } from './chip-viewer'\r\nimport type { IPartialError } from '../../form/validator'\r\nimport type { IFieldMenuConfig, IFilterMenuFormProps } from './filter-menu.types'\r\nimport type { TFieldModelValid, TFieldValid, TFieldValue, TLogic } from '../types'\r\n\r\ninterface IFilterMenuNoFieldProps {\r\n onClose: () => void\r\n}\r\n\r\nexport const FilterMenuNoField: FC<IFilterMenuNoFieldProps> = ({ onClose }) => (\r\n <PopperContent title='Filter by' onClose={onClose}>\r\n <Typography variant='body2' sx={{ p: 2, textAlign: 'center' }}>\r\n No field to filter\r\n </Typography>\r\n </PopperContent>\r\n)\r\n\r\nconst ButtonBack = styled(({ children, ...props }: IconButtonProps) => (\r\n <Tooltip title='Back' placement='top' arrow>\r\n <IconButton {...props}>{children || <ChevronLeftIcon fontSize='small' />}</IconButton>\r\n </Tooltip>\r\n))(({ theme }) => ({\r\n color: theme.palette.common.white,\r\n transition: theme.transitions.create('color'),\r\n '&:hover': {\r\n color: theme.palette.primary.light,\r\n backgroundColor: alpha(theme.palette.common.white, 0.1)\r\n }\r\n}))\r\n\r\nconst ChipDark = styled(Chip)(({ theme }) => ({\r\n backgroundColor: theme.palette.mode === 'dark' ? theme.palette.grey[900] : theme.palette.grey[800],\r\n color: theme.palette.common.white,\r\n border: `1px solid ${alpha(theme.palette.common.white, 0.1)}`,\r\n height: 20,\r\n fontSize: '0.75rem',\r\n '& .MuiChip-label': {\r\n color: theme.palette.common.white\r\n }\r\n}))\r\n\r\nexport interface FilterLogicToggleProps {\r\n value?: TLogic\r\n onChange?: (event: React.MouseEvent<HTMLElement>, value: TLogic) => void\r\n sx?: ToggleButtonGroupProps['sx']\r\n}\r\n\r\nexport const FilterLogicToggle: FC<FilterLogicToggleProps> = (props) => {\r\n const handleChange = (event: React.MouseEvent<HTMLElement>, newValue: string | null) => {\r\n if (newValue && props.onChange) {\r\n props.onChange(event, newValue as TLogic)\r\n }\r\n }\r\n\r\n return (\r\n <ToggleButtonGroupCustom size='small' value={props.value || 'and'} exclusive onChange={handleChange} sx={props.sx}>\r\n <ToggleButton size='small' value='and' aria-label='and logic'>\r\n AND\r\n </ToggleButton>\r\n <ToggleButton size='small' value='or' aria-label='or logic'>\r\n OR\r\n </ToggleButton>\r\n </ToggleButtonGroupCustom>\r\n )\r\n}\r\n\r\nconst ToggleButtonGroupCustom = styled(ToggleButtonGroup)({\r\n '& .MuiToggleButton-root': {\r\n color: '#fff',\r\n borderColor: 'rgba(255, 255, 255, 0.3)',\r\n fontSize: '0.65rem',\r\n fontWeight: 600,\r\n lineHeight: 1,\r\n minWidth: '40px',\r\n padding: '6px 8px',\r\n '&.Mui-selected': {\r\n backgroundColor: '#1976d2',\r\n color: '#fff',\r\n '&:hover': { backgroundColor: '#1565c0' }\r\n },\r\n '&:hover': { backgroundColor: 'rgba(255, 255, 255, 0.08)' }\r\n }\r\n})\r\n\r\nexport interface IFormFieldStringProps<T> extends IFilterMenuFormProps<T> {}\r\n\r\nexport function createFormFieldString<T>(config: IFieldMenuConfig<T>) {\r\n const ChipViewers = createChipViewers<T>()\r\n\r\n const FormFieldString: FC<IFormFieldStringProps<T>> = (props) => {\r\n const refInput = createRef<HTMLInputElement>()\r\n const { value = { values: [], logic: 'or' } } = props\r\n const [filterLogic, setFilterLogic] = useState<TLogic>(value.logic!)\r\n\r\n const label = config?.label ?? config.field.toString()\r\n\r\n const [errorData, setErrorData] = useState<IPartialError<TFieldModelValid<T>>>({})\r\n\r\n const handleSubmit = (newValue: TFieldValue) => {\r\n props.onSubmit(config.field, newValue, config)\r\n }\r\n\r\n const handleSubmitForm = (event: React.FormEvent<HTMLFormElement>) => {\r\n event.preventDefault()\r\n const formData = new FormData(event.currentTarget)\r\n const obj = convertFormDataToJson<TFieldModelValid<T>>(formData)\r\n let errorData = props.validator?.run(obj) as IPartialError<TFieldModelValid<T>>\r\n\r\n setErrorData(errorData || {})\r\n\r\n if (!errorData || Object.keys(errorData).length === 0) {\r\n const newValues = (Array.isArray(obj[config.field]) ? obj[config.field] : [obj[config.field]]) as TFieldValid[]\r\n const newValue: TFieldValue = { values: newValues, logic: filterLogic }\r\n handleSubmit(newValue)\r\n\r\n if (refInput.current) {\r\n refInput.current.blur()\r\n refInput.current.value = ''\r\n }\r\n\r\n // const action = (event.nativeEvent as any).submitter?.value\r\n // if (action === 'ok') // Clear input value\r\n }\r\n }\r\n\r\n const error = getErrorMessage(errorData, config.field)\r\n\r\n const filterViewerValue = useMemo<TChipViewerGroup<T>>(() => {\r\n const items = Array.isArray(value.values) ? value.values : [value.values]\r\n return { field: config.field, items: items.map((v) => ({ value: v })) }\r\n }, [config.field, value])\r\n\r\n const handleChandeLogic = (newLogic: TLogic) => {\r\n setFilterLogic(newLogic)\r\n const newValue: TFieldValue = { values: value.values, logic: newLogic }\r\n handleSubmit(newValue)\r\n }\r\n\r\n const handleClearAll = () => {\r\n props.onRemoveField?.(config.field)\r\n }\r\n\r\n const renderAfterTitle = () => {\r\n if (config.singleValue) return <ChipDark sx={{ ml: 1.5 }} size='small' label='Last value only' />\r\n if (!value.values || value.values.length < 2) return null\r\n return <FilterLogicToggle sx={{ ml: 1 }} value={filterLogic} onChange={(_, nVal) => handleChandeLogic(nVal)} />\r\n }\r\n\r\n const rootClasse: string[] = []\r\n if (props.isLoading) rootClasse.push('disabled')\r\n\r\n return (\r\n <FormCustom className={rootClasse.join(' ')} onSubmit={handleSubmitForm} noValidate>\r\n <PopperContent\r\n title={`Filter by ${label}`}\r\n onClose={props.onClose}\r\n slots={{\r\n beforeTitle: <ButtonBack size='small' onClick={props.onBack} />,\r\n afterTitle: renderAfterTitle()\r\n }}\r\n >\r\n <PopperBody>\r\n <ChipViewers.Group\r\n sx={{ mb: 1, borderBottom: 'none!important' }}\r\n label='Applied'\r\n placement='horizontal'\r\n enableMinimalesticView\r\n value={filterViewerValue}\r\n onRemove={props.onRemove}\r\n />\r\n <TextField\r\n inputRef={refInput}\r\n autoFocus\r\n name={config.field.toString()}\r\n size='small'\r\n fullWidth\r\n placeholder='Enter value'\r\n error={error.error}\r\n helperText={error.message}\r\n sx={{ '.MuiInputBase-root': { minHeight: '42px' } }}\r\n />\r\n </PopperBody>\r\n <PopperFooter>\r\n <Button\r\n size='small'\r\n color='error'\r\n variant='text'\r\n name='action'\r\n value='clear'\r\n disabled={!value.values || value.values.length === 0}\r\n onClick={handleClearAll}\r\n >\r\n Clear All\r\n </Button>\r\n <Box sx={{ flex: 1 }} />\r\n <Button size='small' color='inherit' variant='text' name='action' value='cancel' onClick={props.onClose}>\r\n Cancel\r\n </Button>\r\n <Button size='small' type='submit' color='primary' variant='contained' name='action' value='ok'>\r\n Apply\r\n </Button>\r\n </PopperFooter>\r\n </PopperContent>\r\n </FormCustom>\r\n )\r\n }\r\n\r\n return FormFieldString\r\n}\r\n\r\nconst FormCustom = styled('form')({\r\n position: 'relative',\r\n '&::after': {\r\n content: '\"\"',\r\n display: 'block',\r\n position: 'absolute',\r\n inset: 0, // top: 0, left: 0, right: 0, bottom: 0\r\n backgroundColor: 'rgba(0, 0, 0, 0.2)',\r\n filter: 'blur(2px)',\r\n zIndex: -1,\r\n opacity: 0,\r\n transition: 'opacity 0.3s',\r\n visibility: 'hidden'\r\n },\r\n '&.disabled': {\r\n pointerEvents: 'none',\r\n '&::after': {\r\n zIndex: 1,\r\n opacity: 1,\r\n visibility: 'visible'\r\n }\r\n }\r\n})\r\n"],"names":["FilterMenuNoField","_ref","onClose","_jsx","PopperContent","title","Typography","variant","sx","p","textAlign","children","ButtonBack","styled","_ref2","props","_objectWithoutProperties","_excluded","Tooltip","placement","arrow","IconButton","_objectSpread","ChevronLeftIcon","fontSize","_ref3","theme","color","palette","common","white","transition","transitions","create","primary","light","backgroundColor","alpha","ChipDark","Chip","_ref4","mode","grey","border","concat","height","FilterLogicToggle","_jsxs","ToggleButtonGroupCustom","size","value","exclusive","onChange","event","newValue","ToggleButton","ToggleButtonGroup","borderColor","fontWeight","lineHeight","minWidth","padding","createFormFieldString","config","ChipViewers","createChipViewers","_config$label","refInput","createRef","_props$value","values","logic","_useState","useState","_useState2","_slicedToArray","filterLogic","setFilterLogic","label","field","toString","_useState3","_useState4","errorData","setErrorData","handleSubmit","onSubmit","error","getErrorMessage","filterViewerValue","useMemo","items","Array","isArray","map","v","rootClasse","isLoading","push","FormCustom","className","join","_props$validator","preventDefault","formData","FormData","currentTarget","obj","convertFormDataToJson","validator","run","Object","keys","length","newValues","current","blur","noValidate","slots","beforeTitle","onClick","onBack","afterTitle","singleValue","ml","_","nVal","newLogic","handleChandeLogic","PopperBody","Group","mb","borderBottom","enableMinimalesticView","onRemove","TextField","inputRef","autoFocus","name","fullWidth","placeholder","helperText","message","minHeight","PopperFooter","Button","disabled","_props$onRemoveField","onRemoveField","call","Box","flex","type","position","content","display","inset","filter","zIndex","opacity","visibility","pointerEvents"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{defineProperty as
|
|
1
|
+
import{defineProperty as e,slicedToArray as n,objectSpread2 as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o,jsxs as i}from"react/jsx-runtime";import{useState as t,useContext as l,useMemo as a,createRef as c}from"react";import{styled as d,Box as m,Tooltip as u,IconButton as s,Badge as p,MenuList as f,MenuItem as v,Typography as h,Button as g}from"@mui/material";import S from"@mui/material/ClickAwayListener";import b from"@mui/icons-material/SwapVert";import I from"@mui/icons-material/ArrowUpward";import w from"@mui/icons-material/ArrowDownward";import{useFilterActions as y}from"./hooks.js";import{FilterBarContext as j}from"../index.context.js";import{PopperCustom as C,PopperContent as x,PopperFooter as k}from"./popper-custom.js";var D={asc:"Ascending",desc:"Descending"},P=function(e){return e?D[e]:""},A={asc:o(I,{fontSize:"small"}),desc:o(w,{fontSize:"small"})},B=function(e){return e?A[e]:null};function z(e){var d=F,m=function(e){var r=[];return Object.entries(e).forEach(function(e){var o=n(e,2),i=o[0],t=o[1];r.push({field:i,label:null==t?void 0:t.label})}),r}(e.fields);return function(I){var w=c(),D=t(null),A=n(D,2),z=A[0],F=A[1],T=Boolean(z),E=l(j),O=y(E),_=O.getSort,H=O.changeSort,L=O.removeSort,M=a(function(){var n,r=_(),o=Boolean(r),i=e.fields[null==r?void 0:r.field],t=null!==(n=null==i?void 0:i.label)&&void 0!==n?n:null==r?void 0:r.field.toString(),l=o?"Sorted by ".concat(t," ").concat(null==r?void 0:r.direction):"Sort";return{field:null==r?void 0:r.field,direction:null==r?void 0:r.direction,hasSort:o,title:l}},[_]),U=a(function(){return Object.assign({popperProps:{},rootProps:{}},e,I.slots)},[]),V=function(){F(null)};return o(S,{onClickAway:V,children:i(N,r(r({className:d.root},U.rootProps),{},{children:[o(u,{title:null==M?void 0:M.title,placement:"top",arrow:!0,children:o(s,{size:"small",ref:w,onClick:function(){F(w.current)},children:o(p,{variant:"dot",color:"primary",invisible:!(null!=M&&M.hasSort),children:o(b,{fontSize:"small"})})})}),o(C,r(r({open:T,anchorEl:z,placement:"bottom",transition:!0,disablePortal:!0},U.popperProps),{},{children:i(x,{title:"Sort by",onClose:V,children:[o(f,{className:d.menu,children:m.map(function(e){var n,r=e.field.toString();if(!r)return null;var t=null!==(n=e.label)&&void 0!==n?n:r.toString(),l=(null==M?void 0:M.field)===e.field,a=l?M.direction:void 0;return o(v,{className:d.menuItem,sx:{justifyContent:"space-between"},onClick:function(){return n=e.field,V(),void setTimeout(function(){H(n)},100);var n},selected:l,children:o(u,{title:P(a),placement:"right",arrow:!0,children:i("div",{className:d.menuItemInner,children:[o(h,{variant:"body2",children:t}),B(a)]})})},r)})}),i(k,{children:[o(g,{color:"inherit",onClick:L,children:"Clear"}),o(g,{color:"primary",onClick:V,children:"Done"})]})]})}))]}))})}}var F={root:"DinoFilterSort-root",menu:"DinoFilterSort-menu",menuItem:"DinoFilterSort-menuItem",menuItemInner:"DinoFilterSort-menuItemInner"},N=d(m)(function(n){var r=n.theme;return e(e(e({},"&.".concat(F.menu),{minWidth:"200px",padding:0}),".".concat(F.menuItem),e({paddingTop:0,paddingBottom:0,"&:not(:last-child)":{borderBottom:"1px solid var(--color-divider, rgba(145 160 170 / 10%))"}},".MuiSvgIcon-root",{fontSize:16})),".".concat(F.menuItemInner),{width:"100%",display:"flex",alignItems:"center",justifyContent:"space-between",gap:r.spacing(1),paddingTop:r.spacing(.75),paddingBottom:r.spacing(.75)})});export{N as FilterSortStyled,z as createFilterSort,F as filterSortClasses,B as getSortDirectionIcon,P as getSortDirectionLabel,A as mapSortDirectionIcon,D as mapSortDirectionLabel};
|
|
2
2
|
//# sourceMappingURL=filter-sort.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filter-sort.js","sources":["../../../../src/filter-bar/components/filter-sort.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useContext, useMemo, useState } from 'react'\r\nimport { Badge, Box, Button, IconButton, MenuItem, MenuList, styled, Tooltip, Typography } from '@mui/material'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport SwapVertIcon from '@mui/icons-material/SwapVert'\r\nimport ArrowUpwardIcon from '@mui/icons-material/ArrowUpward'\r\nimport ArrowDownwardIcon from '@mui/icons-material/ArrowDownward'\r\nimport { useFilterActions } from './hooks'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { FieldSortDirection } from './filter-sort.types'\r\nimport { PopperContent, PopperCustom, PopperFooter } from './popper-custom'\r\n// types\r\nimport type { FC, ReactNode } from 'react'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IFieldSort, IFilterSortConfig, IFilterSortProps, TFieldSorts } from './filter-sort.types'\r\n\r\nexport const mapSortDirectionLabel: { [key in FieldSortDirection]: string } = {\r\n asc: 'Ascending',\r\n desc: 'Descending'\r\n}\r\n\r\nexport const getSortDirectionLabel = (direction?: FieldSortDirection): string => {\r\n if (!direction) return ''\r\n return mapSortDirectionLabel[direction]\r\n}\r\n\r\nexport const mapSortDirectionIcon: { [key in FieldSortDirection]: ReactNode } = {\r\n asc: <ArrowUpwardIcon fontSize='small' />,\r\n desc: <ArrowDownwardIcon fontSize='small' />\r\n}\r\n\r\nexport const getSortDirectionIcon = (direction?: FieldSortDirection): ReactNode => {\r\n if (!direction) return null\r\n return mapSortDirectionIcon[direction]\r\n}\r\n\r\nfunction generateSortOptions<T>(fields: TFieldSorts<T>): IFieldSort<T>[] {\r\n const options: IFieldSort<T>[] = []\r\n Object.entries(fields).forEach(([key, value]) => {\r\n options.push({ field: key as TFieldType<T>, label: value?.label })\r\n })\r\n return options\r\n}\r\n\r\nexport function createFilterSort<T>(config: IFilterSortConfig<T>) {\r\n const classes = filterSortClasses\r\n const options = generateSortOptions(config.fields)\r\n\r\n const FilterSort: FC<IFilterSortProps<T>> = (props) => {\r\n const refButton = createRef<HTMLButtonElement>()\r\n\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n const isOpen = Boolean(anchorEl)\r\n\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const { getSort, changeSort, removeSort } = useFilterActions<T>(context)\r\n\r\n const sortInfo = useMemo(() => {\r\n const obj = getSort()\r\n const hasSort = Boolean(obj)\r\n const item = config.fields[obj?.field as TFieldType<T>]\r\n const label = item?.label ?? obj?.field.toString()\r\n const title = hasSort ? `Sorted by ${label} ${obj?.direction}` : 'Sort'\r\n return { field: obj?.field, direction: obj?.direction, hasSort, title }\r\n }, [getSort])\r\n\r\n const mergedSlots = useMemo(() => {\r\n return Object.assign({ popperProps: {}, rootProps: {} }, config, props.slots)\r\n }, [])\r\n\r\n const handleClose = () => {\r\n setAnchorEl(null)\r\n }\r\n\r\n const handleOpen = () => {\r\n setAnchorEl(refButton.current)\r\n }\r\n\r\n const handleMenuItemClick = (field: TFieldType<T>) => {\r\n handleClose()\r\n setTimeout(() => {\r\n changeSort(field)\r\n }, 100)\r\n }\r\n\r\n const renderContent = () => (\r\n <PopperContent title='Sort by' onClose={handleClose}>\r\n <MenuList className={classes.menu}>\r\n {options.map((item) => {\r\n const key = item.field.toString()\r\n if (!key) return null\r\n const label = item.label ?? key.toString()\r\n const isActive = sortInfo?.field === item.field\r\n const direction = isActive ? sortInfo.direction : undefined\r\n return (\r\n <MenuItem\r\n key={key}\r\n className={classes.menuItem}\r\n sx={{ justifyContent: 'space-between' }}\r\n onClick={() => handleMenuItemClick(item.field)}\r\n selected={isActive}\r\n >\r\n <Typography variant='body2'>{label}</Typography>\r\n <Tooltip title={getSortDirectionLabel(direction)} placement='right' arrow>\r\n <span>{getSortDirectionIcon(direction)}</span>\r\n </Tooltip>\r\n </MenuItem>\r\n )\r\n })}\r\n </MenuList>\r\n <PopperFooter>\r\n <Button color='inherit' onClick={removeSort}>\r\n Clear\r\n </Button>\r\n <Button color='primary' onClick={handleClose}>\r\n Done\r\n </Button>\r\n </PopperFooter>\r\n </PopperContent>\r\n )\r\n\r\n return (\r\n <ClickAwayListener onClickAway={handleClose}>\r\n <FilterSortStyled className={classes.root} {...mergedSlots.rootProps}>\r\n <Tooltip title={sortInfo?.title} placement='top' arrow>\r\n <IconButton size='small' ref={refButton} onClick={handleOpen}>\r\n <Badge variant='dot' color='primary' invisible={!sortInfo?.hasSort}>\r\n <SwapVertIcon fontSize='small' />\r\n </Badge>\r\n </IconButton>\r\n </Tooltip>\r\n <PopperCustom open={isOpen} anchorEl={anchorEl} placement='bottom' transition disablePortal {...mergedSlots.popperProps}>\r\n {renderContent()}\r\n </PopperCustom>\r\n </FilterSortStyled>\r\n </ClickAwayListener>\r\n )\r\n }\r\n\r\n return FilterSort\r\n}\r\n\r\n// styles\r\nexport const filterSortClasses = {\r\n root: 'DinoFilterSort-root',\r\n menu: 'DinoFilterSort-menu',\r\n menuItem: 'DinoFilterSort-menuItem'\r\n}\r\n\r\nexport const FilterSortStyled = styled(Box)(({ theme }) => ({\r\n [`&.${filterSortClasses.menu}`]: { minWidth: '200px', padding: 0 },\r\n [`.${filterSortClasses.menuItem}`]: {\r\n height: 'var(--filter-item-height, 40px)',\r\n padding: theme.spacing(0, 2),\r\n '&:not(:last-child)': {\r\n borderBottom: '1px solid var(--color-divider, rgba(145 160 170 / 10%))'\r\n }\r\n },\r\n [`.${filterSortClasses.menuItem} .MuiSvgIcon-root`]: { fontSize: 16 }\r\n}))\r\n"],"names":["mapSortDirectionLabel","asc","desc","getSortDirectionLabel","direction","mapSortDirectionIcon","_jsx","ArrowUpwardIcon","fontSize","ArrowDownwardIcon","getSortDirectionIcon","createFilterSort","config","classes","filterSortClasses","options","fields","Object","entries","forEach","_ref","_ref2","_slicedToArray","key","value","push","field","label","generateSortOptions","props","refButton","createRef","_useState","useState","_useState2","anchorEl","setAnchorEl","isOpen","Boolean","context","useContext","FilterBarContext","_useFilterActions","useFilterActions","getSort","changeSort","removeSort","sortInfo","useMemo","_item$label","obj","hasSort","item","toString","title","concat","mergedSlots","assign","popperProps","rootProps","slots","handleClose","ClickAwayListener","onClickAway","children","_jsxs","FilterSortStyled","_objectSpread","className","root","Tooltip","placement","arrow","IconButton","size","ref","onClick","current","Badge","variant","color","invisible","SwapVertIcon","PopperCustom","open","transition","disablePortal","PopperContent","onClose","MenuList","menu","map","_item$label2","isActive","undefined","MenuItem","menuItem","sx","justifyContent","setTimeout","selected","Typography","PopperFooter","Button","styled","Box","_ref3","theme","_defineProperty","minWidth","padding","height","spacing","borderBottom"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"filter-sort.js","sources":["../../../../src/filter-bar/components/filter-sort.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useContext, useMemo, useState } from 'react'\r\nimport { Badge, Box, Button, IconButton, MenuItem, MenuList, styled, Tooltip, Typography } from '@mui/material'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport SwapVertIcon from '@mui/icons-material/SwapVert'\r\nimport ArrowUpwardIcon from '@mui/icons-material/ArrowUpward'\r\nimport ArrowDownwardIcon from '@mui/icons-material/ArrowDownward'\r\nimport { useFilterActions } from './hooks'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { FieldSortDirection } from './filter-sort.types'\r\nimport { PopperContent, PopperCustom, PopperFooter } from './popper-custom'\r\n// types\r\nimport type { FC, ReactNode } from 'react'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IFieldSort, IFilterSortConfig, IFilterSortProps, TFieldSorts } from './filter-sort.types'\r\n\r\nexport const mapSortDirectionLabel: { [key in FieldSortDirection]: string } = {\r\n asc: 'Ascending',\r\n desc: 'Descending'\r\n}\r\n\r\nexport const getSortDirectionLabel = (direction?: FieldSortDirection): string => {\r\n if (!direction) return ''\r\n return mapSortDirectionLabel[direction]\r\n}\r\n\r\nexport const mapSortDirectionIcon: { [key in FieldSortDirection]: ReactNode } = {\r\n asc: <ArrowUpwardIcon fontSize='small' />,\r\n desc: <ArrowDownwardIcon fontSize='small' />\r\n}\r\n\r\nexport const getSortDirectionIcon = (direction?: FieldSortDirection): ReactNode => {\r\n if (!direction) return null\r\n return mapSortDirectionIcon[direction]\r\n}\r\n\r\nfunction generateSortOptions<T>(fields: TFieldSorts<T>): IFieldSort<T>[] {\r\n const options: IFieldSort<T>[] = []\r\n Object.entries(fields).forEach(([key, value]) => {\r\n options.push({ field: key as TFieldType<T>, label: value?.label })\r\n })\r\n return options\r\n}\r\n\r\nexport function createFilterSort<T>(config: IFilterSortConfig<T>) {\r\n const classes = filterSortClasses\r\n const options = generateSortOptions(config.fields)\r\n\r\n const FilterSort: FC<IFilterSortProps<T>> = (props) => {\r\n const refButton = createRef<HTMLButtonElement>()\r\n\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n const isOpen = Boolean(anchorEl)\r\n\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const { getSort, changeSort, removeSort } = useFilterActions<T>(context)\r\n\r\n const sortInfo = useMemo(() => {\r\n const obj = getSort()\r\n const hasSort = Boolean(obj)\r\n const item = config.fields[obj?.field as TFieldType<T>]\r\n const label = item?.label ?? obj?.field.toString()\r\n const title = hasSort ? `Sorted by ${label} ${obj?.direction}` : 'Sort'\r\n return { field: obj?.field, direction: obj?.direction, hasSort, title }\r\n }, [getSort])\r\n\r\n const mergedSlots = useMemo(() => {\r\n return Object.assign({ popperProps: {}, rootProps: {} }, config, props.slots)\r\n }, [])\r\n\r\n const handleClose = () => {\r\n setAnchorEl(null)\r\n }\r\n\r\n const handleOpen = () => {\r\n setAnchorEl(refButton.current)\r\n }\r\n\r\n const handleMenuItemClick = (field: TFieldType<T>) => {\r\n handleClose()\r\n setTimeout(() => {\r\n changeSort(field)\r\n }, 100)\r\n }\r\n\r\n const renderContent = () => (\r\n <PopperContent title='Sort by' onClose={handleClose}>\r\n <MenuList className={classes.menu}>\r\n {options.map((item) => {\r\n const key = item.field.toString()\r\n if (!key) return null\r\n const label = item.label ?? key.toString()\r\n const isActive = sortInfo?.field === item.field\r\n const direction = isActive ? sortInfo.direction : undefined\r\n return (\r\n <MenuItem\r\n key={key}\r\n className={classes.menuItem}\r\n sx={{ justifyContent: 'space-between' }}\r\n onClick={() => handleMenuItemClick(item.field)}\r\n selected={isActive}\r\n >\r\n <Tooltip title={getSortDirectionLabel(direction)} placement='right' arrow>\r\n <div className={classes.menuItemInner}>\r\n <Typography variant='body2'>{label}</Typography>\r\n {getSortDirectionIcon(direction)}\r\n </div>\r\n </Tooltip>\r\n </MenuItem>\r\n )\r\n })}\r\n </MenuList>\r\n <PopperFooter>\r\n <Button color='inherit' onClick={removeSort}>\r\n Clear\r\n </Button>\r\n <Button color='primary' onClick={handleClose}>\r\n Done\r\n </Button>\r\n </PopperFooter>\r\n </PopperContent>\r\n )\r\n\r\n return (\r\n <ClickAwayListener onClickAway={handleClose}>\r\n <FilterSortStyled className={classes.root} {...mergedSlots.rootProps}>\r\n <Tooltip title={sortInfo?.title} placement='top' arrow>\r\n <IconButton size='small' ref={refButton} onClick={handleOpen}>\r\n <Badge variant='dot' color='primary' invisible={!sortInfo?.hasSort}>\r\n <SwapVertIcon fontSize='small' />\r\n </Badge>\r\n </IconButton>\r\n </Tooltip>\r\n <PopperCustom open={isOpen} anchorEl={anchorEl} placement='bottom' transition disablePortal {...mergedSlots.popperProps}>\r\n {renderContent()}\r\n </PopperCustom>\r\n </FilterSortStyled>\r\n </ClickAwayListener>\r\n )\r\n }\r\n\r\n return FilterSort\r\n}\r\n\r\n// styles\r\nexport const filterSortClasses = {\r\n root: 'DinoFilterSort-root',\r\n menu: 'DinoFilterSort-menu',\r\n menuItem: 'DinoFilterSort-menuItem',\r\n menuItemInner: 'DinoFilterSort-menuItemInner'\r\n}\r\n\r\nexport const FilterSortStyled = styled(Box)(({ theme }) => ({\r\n [`&.${filterSortClasses.menu}`]: { minWidth: '200px', padding: 0 },\r\n [`.${filterSortClasses.menuItem}`]: {\r\n paddingTop: 0,\r\n paddingBottom: 0,\r\n '&:not(:last-child)': {\r\n borderBottom: '1px solid var(--color-divider, rgba(145 160 170 / 10%))'\r\n },\r\n [`.MuiSvgIcon-root`]: { fontSize: 16 }\r\n },\r\n [`.${filterSortClasses.menuItemInner}`]: {\r\n width: '100%',\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'space-between',\r\n gap: theme.spacing(1),\r\n paddingTop: theme.spacing(0.75),\r\n paddingBottom: theme.spacing(0.75)\r\n }\r\n}))\r\n"],"names":["mapSortDirectionLabel","asc","desc","getSortDirectionLabel","direction","mapSortDirectionIcon","_jsx","ArrowUpwardIcon","fontSize","ArrowDownwardIcon","getSortDirectionIcon","createFilterSort","config","classes","filterSortClasses","options","fields","Object","entries","forEach","_ref","_ref2","_slicedToArray","key","value","push","field","label","generateSortOptions","props","refButton","createRef","_useState","useState","_useState2","anchorEl","setAnchorEl","isOpen","Boolean","context","useContext","FilterBarContext","_useFilterActions","useFilterActions","getSort","changeSort","removeSort","sortInfo","useMemo","_item$label","obj","hasSort","item","toString","title","concat","mergedSlots","assign","popperProps","rootProps","slots","handleClose","ClickAwayListener","onClickAway","children","_jsxs","FilterSortStyled","_objectSpread","className","root","Tooltip","placement","arrow","IconButton","size","ref","onClick","current","Badge","variant","color","invisible","SwapVertIcon","PopperCustom","open","transition","disablePortal","PopperContent","onClose","MenuList","menu","map","_item$label2","isActive","undefined","MenuItem","menuItem","sx","justifyContent","setTimeout","selected","menuItemInner","Typography","PopperFooter","Button","styled","Box","_ref3","theme","_defineProperty","minWidth","padding","paddingTop","paddingBottom","borderBottom","width","display","alignItems","gap","spacing"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{defineProperty as r,objectSpread2 as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as t}from"react/jsx-runtime";import{styled as o}from"@mui/material";import{useContext as
|
|
1
|
+
import{defineProperty as r,objectSpread2 as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as t,jsxs as l}from"react/jsx-runtime";import{styled as o,Collapse as i,Box as n,Button as a}from"@mui/material";import{useContext as c,useMemo as s}from"react";import{KeySpecial as u}from"../types.js";import{useFilterActions as m}from"./hooks.js";import{mapSpecialLabel as d}from"../helpers.js";import{createChipViewers as p}from"./chip-viewer.js";import{FilterBarContext as f}from"../index.context.js";function b(r){var o=h,b=p();return function(p){var h=c(f),v=h.filterState,x=m(h),k=s(function(){return function(r,t){var l,o=r.fields,i=r.enableQuickSearch,n=void 0===i||i,a=e({},o),c=u.quickSearch;return n?a[c]?null!==(l=a[c])&&void 0!==l&&l.label||(a[c]=e(e({},a[c]),{},{label:d[c]})):a[c]={label:d[c]}:delete a[c],Object.keys(t||{}).reduce(function(r,e){var l,o=null==a?void 0:a[e],i=(null==o?void 0:o.label)||e.toString(),n=null==t||null===(l=t[e])||void 0===l?void 0:l.values,c=(Array.isArray(n)?n:[]).filter(Boolean).map(function(r){return{value:r.toString()}});return c.length>0&&r.push({field:e,label:i,items:c}),r},[]).sort(function(r,e){return r.field===c?-1:e.field===c?1:0})}(r,v.storeFilter)},[v,r]);return t(i,{in:k.length>0,timeout:"auto",unmountOnExit:!0,children:l(g,{className:o.root,sx:p.sx,children:[t("div",{className:o.scrollHorizontal,children:t(b.Group,{label:"Filters",value:k,placement:"horizontal",onRemove:x.removeFilterByFieldValue})}),t(n,{sx:{},children:t(a,{size:"small",color:"error",variant:"text",onClick:x.clearAllFilters,className:o.buttonClearAll,children:"Clear All"})})]})})}}var h={root:"DinoFilterSummary-root",scrollHorizontal:"DinoFilterSummary-scrollHorizontal",buttonClearAll:"DinoFilterSummary-buttonClearAll"},g=o("div")(function(e){var t=e.theme;return r(r(r({},"&.".concat(h.root),{display:"flex",alignItems:"center",paddingLeft:t.spacing(1),paddingRight:t.spacing(.5)}),".".concat(h.scrollHorizontal),{overflowX:"auto",overflowY:"hidden",WebkitOverflowScrolling:"touch",scrollbarHeight:"thin",display:"flex",flexWrap:"nowrap",minWidth:0,flex:1,"& > *":{minWidth:"max-content",flexShrink:0},"&::-webkit-scrollbar":{height:"8px",background:"transparent"},"&::-webkit-scrollbar-thumb":{background:t.palette.grey[300],borderRadius:"8px",minHeight:"8px",transition:"background 0.2s"},"&::-webkit-scrollbar-thumb:hover":{background:t.palette.primary.light},"&::-webkit-scrollbar-track":{background:t.palette.grey[100],borderRadius:"8px"},scrollbarColor:"".concat(t.palette.grey[300]," ").concat(t.palette.grey[100]),scrollbarWidth:"thin"}),".".concat(h.buttonClearAll),{textTransform:"none",marginLeft:t.spacing(1),fontWeight:500,lineHeight:2,padding:t.spacing(0,1)})});export{b as createFilterSummary};
|
|
2
2
|
//# sourceMappingURL=filter-summary.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filter-summary.js","sources":["../../../../src/filter-bar/components/filter-summary.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { styled } from '@mui/material'\r\nimport { useContext, useMemo } from 'react'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from './hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { createChipViewers } from './chip-viewer'\r\nimport { FilterBarContext } from '../index.context'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { TFieldStore,
|
|
1
|
+
{"version":3,"file":"filter-summary.js","sources":["../../../../src/filter-bar/components/filter-summary.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { Box, Button, Collapse, styled } from '@mui/material'\r\nimport { useContext, useMemo } from 'react'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from './hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { createChipViewers } from './chip-viewer'\r\nimport { FilterBarContext } from '../index.context'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { TFieldStore, TFieldValid } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IChipViewerItem, TChipViewerGroup } from './chip-viewer'\r\nimport type { IFilterSummaryConfig, IFilterSummaryProps, TFieldSummaryConfigs } from './filter-summary.types'\r\n\r\nfunction mapFilterStateToFilterData<T>(config: IFilterSummaryConfig<T>, store?: TFieldStore<T>): TChipViewerGroup<T>[] {\r\n const { fields, enableQuickSearch = true } = config\r\n\r\n // Ensure 'quickSearch' is always included in the summary, even if it's not in the config or store\r\n // If enableQuickSearch is false, it will not be added to the summary or removed if it exists in the config\r\n const mergedConfig: TFieldSummaryConfigs<T> = { ...fields }\r\n const qsKey = KeySpecial.quickSearch\r\n if (enableQuickSearch) {\r\n if (!mergedConfig[qsKey]) {\r\n mergedConfig[qsKey] = { label: mapSpecialLabel[qsKey] }\r\n } else if (!mergedConfig[qsKey]?.label) {\r\n mergedConfig[qsKey] = { ...mergedConfig[qsKey], label: mapSpecialLabel[qsKey] }\r\n }\r\n } else {\r\n delete mergedConfig[qsKey]\r\n }\r\n\r\n const keys = Object.keys(store || {}) as (keyof TFieldStore<T>)[]\r\n const groups = keys.reduce<TChipViewerGroup<T>[]>((acc, key) => {\r\n const fieldConfig = mergedConfig?.[key]\r\n const label = fieldConfig?.label || key.toString()\r\n const values = store?.[key]?.values as TFieldValid[] | undefined\r\n const items = Array.isArray(values) ? values : []\r\n const summaryItems = items.filter(Boolean).map<IChipViewerItem<T>>((item) => ({ value: item.toString() }))\r\n if (summaryItems.length > 0) {\r\n acc.push({ field: key, label, items: summaryItems })\r\n }\r\n return acc\r\n }, [])\r\n const finalGroups = groups.sort((a, b) => {\r\n if (a.field === qsKey) return -1\r\n if (b.field === qsKey) return 1\r\n return 0\r\n })\r\n return finalGroups\r\n}\r\n\r\nexport function createFilterSummary<T>(config: IFilterSummaryConfig<T>) {\r\n const classes = filterSummaryClasses\r\n const ChipViewers = createChipViewers<T>()\r\n\r\n const FilterSummary: FC<IFilterSummaryProps<T>> = (props) => {\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const { filterState } = context\r\n const filterActions = useFilterActions<T>(context)\r\n\r\n const filterData = useMemo(() => {\r\n return mapFilterStateToFilterData(config, filterState.storeFilter)\r\n }, [filterState, config])\r\n\r\n // Old logic to calculate filterData, now moved to useMemo above\r\n // if (filterData.length === 0) return null\r\n\r\n return (\r\n <Collapse in={filterData.length > 0} timeout='auto' unmountOnExit>\r\n <FilterSummaryStyled className={classes.root} sx={props.sx}>\r\n <div className={classes.scrollHorizontal}>\r\n <ChipViewers.Group label='Filters' value={filterData} placement='horizontal' onRemove={filterActions.removeFilterByFieldValue} />\r\n </div>\r\n <Box sx={{}}>\r\n <Button size='small' color='error' variant='text' onClick={filterActions.clearAllFilters} className={classes.buttonClearAll}>\r\n Clear All\r\n </Button>\r\n </Box>\r\n </FilterSummaryStyled>\r\n </Collapse>\r\n )\r\n }\r\n\r\n return FilterSummary\r\n}\r\n\r\nconst filterSummaryClasses = {\r\n root: 'DinoFilterSummary-root',\r\n scrollHorizontal: 'DinoFilterSummary-scrollHorizontal',\r\n fieldItem: 'DinoFilterSummary-fieldItem',\r\n fieldLabel: 'DinoFilterSummary-fieldLabel',\r\n fieldValue: 'DinoFilterSummary-fieldValue',\r\n buttonClearAll: 'DinoFilterSummary-buttonClearAll'\r\n}\r\n\r\nconst FilterSummaryStyled = styled('div')(({ theme }) => ({\r\n [`&.${filterSummaryClasses.root}`]: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n paddingLeft: theme.spacing(1),\r\n paddingRight: theme.spacing(0.5)\r\n },\r\n [`.${filterSummaryClasses.scrollHorizontal}`]: {\r\n overflowX: 'auto',\r\n overflowY: 'hidden',\r\n WebkitOverflowScrolling: 'touch',\r\n scrollbarHeight: 'thin',\r\n // The content doesn't wrap to the next line and is wider than the container, displaying a horizontal scroll bar.\r\n display: 'flex',\r\n flexWrap: 'nowrap',\r\n minWidth: 0,\r\n flex: 1,\r\n '& > *': { minWidth: 'max-content', flexShrink: 0 },\r\n // Custom scrollbar\r\n '&::-webkit-scrollbar': { height: '8px', background: 'transparent' },\r\n '&::-webkit-scrollbar-thumb': {\r\n background: theme.palette.grey[300],\r\n borderRadius: '8px',\r\n minHeight: '8px',\r\n transition: 'background 0.2s'\r\n },\r\n '&::-webkit-scrollbar-thumb:hover': { background: theme.palette.primary.light },\r\n '&::-webkit-scrollbar-track': { background: theme.palette.grey[100], borderRadius: '8px' },\r\n // Firefox\r\n scrollbarColor: `${theme.palette.grey[300]} ${theme.palette.grey[100]}`,\r\n scrollbarWidth: 'thin'\r\n },\r\n [`.${filterSummaryClasses.buttonClearAll}`]: {\r\n textTransform: 'none',\r\n marginLeft: theme.spacing(1),\r\n fontWeight: 500,\r\n lineHeight: 2,\r\n padding: theme.spacing(0, 1)\r\n }\r\n}))\r\n"],"names":["createFilterSummary","config","classes","filterSummaryClasses","ChipViewers","createChipViewers","props","context","useContext","FilterBarContext","filterState","filterActions","useFilterActions","filterData","useMemo","store","_mergedConfig$qsKey","fields","_config$enableQuickSe","enableQuickSearch","mergedConfig","_objectSpread","qsKey","KeySpecial","quickSearch","label","mapSpecialLabel","Object","keys","reduce","acc","key","_store$key","fieldConfig","toString","values","summaryItems","Array","isArray","filter","Boolean","map","item","value","length","push","field","items","sort","a","b","mapFilterStateToFilterData","storeFilter","_jsx","Collapse","in","timeout","unmountOnExit","_jsxs","FilterSummaryStyled","className","root","sx","children","scrollHorizontal","Group","placement","onRemove","removeFilterByFieldValue","Box","Button","size","color","variant","onClick","clearAllFilters","buttonClearAll","styled","_ref","theme","_defineProperty","concat","display","alignItems","paddingLeft","spacing","paddingRight","overflowX","overflowY","WebkitOverflowScrolling","scrollbarHeight","flexWrap","minWidth","flex","flexShrink","height","background","palette","grey","borderRadius","minHeight","transition","primary","light","scrollbarColor","scrollbarWidth","textTransform","marginLeft","fontWeight","lineHeight","padding"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{objectSpread2 as t,defineProperty as e,toConsumableArray as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";var i=function(t,e,r){if(!t)return!1;var i=t[e];if(!i)return!1;var l=new Set(i.values.map(function(t){return JSON.stringify(t)}).filter(Boolean));return r.values.some(function(t){return
|
|
1
|
+
import{objectSpread2 as t,defineProperty as e,toConsumableArray as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";var i=function(t,e,r){if(!t)return!1;var i=t[e];if(!i)return!1;var l=r.logic!==i.logic,o=new Set(i.values.map(function(t){return JSON.stringify(t)}).filter(Boolean));return r.values.some(function(t){return o.has(JSON.stringify(t))})&&!l},l=function(t,i,l){var o=null==t?void 0:t[i],n={values:Array.from(new Set([].concat(r((null==o?void 0:o.values)||[]),r(l.values)).filter(Boolean))),logic:l.logic||(null==o?void 0:o.logic)};return Object.assign({},t,e({},i,n))},o=function(r){return{addFilter:function(e,o,n){var a=r.filterState.storeFilter,s=t(t({},o),{},{logic:(null==n?void 0:n.logic)||o.logic});if(!i(a,e,s)){var u=l(a,e,s),c=Object.assign({},a,u);r.setFilterState(t(t({},r.filterState),{},{storeFilter:c}))}},replaceFilter:function(i,l,o){var n=t(t({},l),{},{logic:(null==o?void 0:o.logic)||l.logic}),a=Object.assign({},r.filterState.storeFilter,e({},i,n));r.setFilterState(t(t({},r.filterState),{},{storeFilter:a}))},upsertManyFilter:function(e,o,n){if(0!==o.values.length){var a=Object.assign({},r.filterState.storeFilter);o.values.forEach(function(t){var r={values:[t],logic:(null==n?void 0:n.logic)||o.logic};i(a,e,r)||(a=l(a,e,r))}),r.setFilterState(t(t({},r.filterState),{},{storeFilter:a}))}},removeFilter:function(e){var i=Object.assign({},r.filterState.storeFilter);delete i[e],r.setFilterState(t(t({},r.filterState),{},{storeFilter:i}))},removeFilterByFieldValue:function(e,i){var l=Object.assign({},r.filterState.storeFilter),o=l[e];o&&(l[e]=t(t({},o),{},{values:o.values.filter(function(t){return t.toString()!==i.toString()})}),l[e]&&0===l[e].values.length&&delete l[e],r.setFilterState(t(t({},r.filterState),{},{storeFilter:l})))},clearAllFilters:function(){r.setFilterState(t(t({},r.filterState),{},{storeFilter:{}}))},getFieldInfo:function(t){var e;return null===(e=r.filterState.storeFilter)||void 0===e?void 0:e[t]},getTotalCount:function(){var t=r.filterState.storeFilter;return t?Object.keys(t).reduce(function(e,r){var i=t[r];return e+(i?i.values.length:0)},0):0},hasSortByField:function(t){var e=r.filterState.storeSort;return(null==e?void 0:e.field)===t},getSort:function(){return r.filterState.storeSort},changeSort:function(e){var i=r.filterState.storeSort,l="desc";(null==i?void 0:i.field)===e&&(l="desc"===i.direction?"asc":"desc");var o={field:e,direction:l};r.setFilterState(t(t({},r.filterState),{},{storeSort:o}))},removeSort:function(){r.setFilterState(t(t({},r.filterState),{},{storeSort:void 0}))}}};export{o as useFilterActions};
|
|
2
2
|
//# sourceMappingURL=hooks.js.map
|