dinocollab-core 2.2.7 → 2.2.9
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/dist/src/filter-bar/components/filter-input.js +1 -1
- package/dist/src/filter-bar/components/filter-input.js.map +1 -1
- package/dist/src/filter-bar/components/filter-input.units.js +1 -1
- package/dist/src/filter-bar/components/filter-input.units.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-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/units.js +2 -0
- package/dist/src/filter-bar/components/units.js.map +1 -0
- 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/helpers.js +1 -1
- package/dist/src/filter-bar/helpers.js.map +1 -1
- package/dist/src/filter-bar/hooks.js +2 -0
- package/dist/src/filter-bar/hooks.js.map +1 -0
- 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/filter-bar/types.js +1 -1
- package/dist/src/filter-bar/types.js.map +1 -1
- package/dist/src/lab/data-surface/view-list.js +1 -1
- package/dist/src/lab/data-surface/view-list.js.map +1 -1
- package/dist/types/filter-bar/components/filter-sort.types.d.ts +25 -3
- package/dist/types/filter-bar/components/units.d.ts +3 -0
- package/dist/types/filter-bar/convert-to-graphql.d.ts +7 -2
- package/dist/types/filter-bar/helpers.d.ts +17 -0
- package/dist/types/filter-bar/{components/hooks.d.ts → hooks.d.ts} +2 -2
- package/dist/types/filter-bar/index.context.d.ts +1 -0
- package/dist/types/filter-bar/index.create.d.ts +2 -1
- package/dist/types/filter-bar/types.d.ts +1 -0
- package/package.json +1 -1
- package/dist/src/filter-bar/components/hooks.js +0 -2
- package/dist/src/filter-bar/components/hooks.js.map +0 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{defineProperty as o,objectSpread2 as e,slicedToArray as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{useContext as i,useState as l,useMemo as a,createRef as u}from"react";import{styled as c,Box as s,alpha as p,InputBase as d,MenuList as f,MenuItem as m,Typography as v}from"@mui/material";import h from"@mui/material/ClickAwayListener";import{KeySpecial as b}from"../types.js";import{useFilterActions as g}from"
|
|
1
|
+
import{defineProperty as o,objectSpread2 as e,slicedToArray as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{useContext as i,useState as l,useMemo as a,createRef as u}from"react";import{styled as c,Box as s,alpha as p,InputBase as d,MenuList as f,MenuItem as m,Typography as v}from"@mui/material";import h from"@mui/material/ClickAwayListener";import{KeySpecial as b}from"../types.js";import{useFilterActions as g}from"../hooks.js";import{mapSpecialLabel as x}from"../helpers.js";import{FilterBarContext as I}from"../index.context.js";import{PopperCustom as S,PopperContent as y}from"./popper-custom.js";import{InputAdornmentRight as F,InputAdornmentLeft as j,getFieldsByMatches as k}from"./filter-input.units.js";import{MobileSearchButton as C}from"./filter-input.mobile.js";function D(o){var c=w,p=function(o){var r=o.fields,t=o.enableQuickSearch,n=void 0===t||t,i=b.quickSearch,l=e({},r);if(n){var a=l[i],u=null!=a&&a.label?a.label:x[i],c=Object.assign({},l[i],{field:i,label:u});l[i]=c}else delete l[i];return e(e({},o),{},{fields:l})}(o);return function(b){var x,D,w,B,N,q=u(),A=u(),O=i(I),R=g(O),W=R.addFilter,z=R.replaceFilter,K=l(null),T=r(K,2),_=T[0],E=T[1],G=Boolean(_),H=l(""),L=r(H,2),M=L[0],Q=L[1],V=l("normal"),J=r(V,2),U=J[0],X=J[1],Y=a(function(){var e,r=o.beforeInput,t=o.afterInput,n=Object.assign({},b.sx,null===(e=b.slots)||void 0===e||null===(e=e.rootProps)||void 0===e?void 0:e.sx);return{slots:Object.assign({},{beforeInput:r,afterInput:t},b.slots),rootSx:n}},[]),Z=o.minimalInput||(null===(x=b.slots)||void 0===x?void 0:x.minimalInput)||!1,$=function(o){E(null),X("normal"),o&&Q("")},oo=function(){var o;if(M){var e=null===(o=O.filterState.storeFilter)||void 0===o?void 0:o.quickSearch,r=(null==e?void 0:e.logic)||"or";z("quickSearch",{values:[M],logic:r}),$(!0)}};if(Z)return t(C,{placeholder:"Search...",onSearching:function(o){var e;if(o){var r=null===(e=O.filterState.storeFilter)||void 0===e?void 0:e.quickSearch,t=(null==r?void 0:r.logic)||"or";z("quickSearch",{values:[o],logic:t})}}});var eo,ro=[c.root];return("focus"===U||Boolean(M))&&ro.push(c.focus),t(h,{onClickAway:function(o){$()},children:n(P,e(e({className:ro.join(" ")},null===(D=b.slots)||void 0===D?void 0:D.rootProps),{},{sx:Y.rootSx,children:[n("div",{className:c.rootInner,children:[(null===(w=Y.slots)||void 0===w?void 0:w.beforeInput)||null,t(s,{className:c.beforeInput,ref:A}),t(d,{fullWidth:!0,className:c.input,autoComplete:"off",size:"small",inputRef:q,value:M,placeholder:"Search...",onKeyDown:function(o){var e=o.keyCode;if(13===e)o.stopPropagation(),o.preventDefault(),oo();else if(27===e){var r;o.stopPropagation(),o.preventDefault(),null==q||null===(r=q.current)||void 0===r||r.blur(),$(!0)}},onChange:function(o){var e=o.target.value||"";Q(e);var r=Boolean(null==A?void 0:A.current)&&Boolean(e);e!==M&&E(r&&(null==A?void 0:A.current)||null)},onFocus:function(o){X("focus"),Boolean(M)&&E((null==A?void 0:A.current)||o.currentTarget)},startAdornment:t(j,{onSearch:function(){var o;null===(o=q.current)||void 0===o||o.focus()}}),endAdornment:t(F,{hasKeyword:Boolean(M),onSubmit:oo,onClear:function(){return $(!0)}})}),(null===(B=Y.slots)||void 0===B?void 0:B.afterInput)||null]}),t(S,e(e({anchorEl:_,open:G,placement:"bottom",transition:!0,disablePortal:!0},null===(N=Y.slots)||void 0===N?void 0:N.popperProps),{},{children:(eo=k(p,M),t(y,{title:"Filter Options",disableGutter:!0,onClose:function(){return E(null)},children:t(f,{className:c.menu,children:eo.map(function(e,r){var t,i=e.field;if(!e)return null;var l=null!==(t=e.label)&&void 0!==t?t:i.toString(),a="".concat(l,': "').concat(M,'"');return n(m,{title:a,onClick:function(){return function(e){var r;if(M){var t=o.fields[e],n=null===(r=O.filterState.storeFilter)||void 0===r?void 0:r[e],i=(null==n?void 0:n.logic)||"or";null!=t&&t.singleValue?z(e,{values:[M],logic:i}):W(e,{values:[M],logic:i}),$(!0)}}(i)},className:c.menuItem,children:[n(v,{variant:"body2",sx:{fontWeight:500,flex:"0 0 auto"},children:[l,":"]}),n(v,{variant:"body2",color:"text.secondary",sx:{ml:1,flex:"1 1 auto"},noWrap:!0,children:['"',M,'"']})]},i.toString()+r)})})}))}))]}))})}}var w={root:"DinoFilterInput-root",rootInner:"DinoFilterInput-rootInner",button:"DinoFilterInput-button",input:"DinoFilterInput-input",focus:"DinoFilterInput-focus",beforeInput:"DinoFilterInput-beforeInput",menu:"DinoFilterInput-menu",menuItem:"DinoFilterInput-menuItem"},P=c(s)(function(e){var r=e.theme;return o(o(o(o(o(o(o(o({},"&.".concat(w.root),{height:"var(--dino-h-filter-input, 38px)",flex:1,border:"1px solid",borderColor:p(r.palette.divider,.12),borderRadius:r.shape.borderRadius,backgroundColor:r.palette.background.paper,transition:r.transitions.create(["border-color","box-shadow"])}),"&:hover",{borderColor:r.palette.text.primary}),"&.Mui-focused",{borderColor:r.palette.primary.main,boxShadow:"0 0 0 2px ".concat(r.palette.primary.main,"33")}),"&.".concat(w.focus),{borderColor:r.palette.primary.main,boxShadow:"0 0 0 2px ".concat(r.palette.primary.main,"33")}),".".concat(w.rootInner),{height:"100%",display:"flex",alignItems:"stretch"}),".".concat(w.beforeInput),{width:"1px",height:"100%",alignSelf:"stretch"}),".".concat(w.input),{padding:r.spacing(.5,1),input:{fontSize:"14px",padding:"4px 0 5px"}}),".".concat(w.button),{flex:"0 0 auto"})});export{D as createFilterInput,w as filterInputClasses};
|
|
2
2
|
//# sourceMappingURL=filter-input.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filter-input.js","sources":["../../../../src/filter-bar/components/filter-input.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useContext, useMemo, useState } from 'react'\r\nimport { Box, InputBase, MenuItem, MenuList, styled, Typography, alpha } from '@mui/material'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from './hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { PopperContent, PopperCustom } from './popper-custom'\r\nimport { getFieldsByMatches, InputAdornmentLeft, InputAdornmentRight } from './filter-input.units'\r\nimport MobileSearchButton from './filter-input.mobile'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { InputBaseProps } from '@mui/material'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IFilterInputConfig, IFilterInputProps, IFilterInputSlots, TFieldInputConfigs } from './filter-input.types'\r\n\r\nconst initializeConfig = <T,>(config: IFilterInputConfig<T>): IFilterInputConfig<T> => {\r\n const { fields, enableQuickSearch = true } = config\r\n const qsKey = KeySpecial.quickSearch\r\n const mergedFields: TFieldInputConfigs<T> = { ...fields }\r\n\r\n if (enableQuickSearch) {\r\n const item = mergedFields[qsKey]\r\n const label = item?.label ? item.label : mapSpecialLabel[qsKey]\r\n const temp = Object.assign({}, mergedFields[qsKey], { field: qsKey, label })\r\n mergedFields[qsKey] = temp\r\n } else {\r\n delete mergedFields[qsKey]\r\n }\r\n\r\n return { ...config, fields: mergedFields }\r\n}\r\n\r\nexport function createFilterInput<T>(config: IFilterInputConfig<T>) {\r\n const classes = filterInputClasses\r\n const initialConfig = initializeConfig(config)\r\n\r\n const FilterInput: FC<IFilterInputProps<T>> = (props) => {\r\n const refInput = createRef<HTMLInputElement>()\r\n const refBeforeInput = createRef<HTMLElement>()\r\n\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const { addFilter, replaceFilter } = useFilterActions<T>(context)\r\n\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n const isOpen = Boolean(anchorEl)\r\n\r\n const [keywords, setKeywords] = useState<string>('')\r\n const [status, setStatus] = useState<'focus' | 'normal'>('normal')\r\n\r\n const mergedConfig = useMemo(() => {\r\n const { beforeInput, afterInput } = config\r\n const mergedRootSx = Object.assign({}, props.sx, props.slots?.rootProps?.sx)\r\n const mergedSlots: IFilterInputSlots = Object.assign({}, { beforeInput, afterInput }, props.slots)\r\n return { slots: mergedSlots, rootSx: mergedRootSx }\r\n }, [])\r\n\r\n const isMinimal = config.minimalInput || props.slots?.minimalInput || false\r\n\r\n const handleClose = (isClear?: boolean) => {\r\n setAnchorEl(null)\r\n setStatus('normal')\r\n if (isClear) setKeywords('')\r\n }\r\n\r\n const handleSubmitSearch = () => {\r\n if (!keywords) return\r\n const qsField = context.filterState.storeFilter?.quickSearch\r\n const logic = qsField?.logic || 'or'\r\n replaceFilter('quickSearch', { values: [keywords], logic })\r\n handleClose(true)\r\n }\r\n\r\n const handleSubmitMobileSearch = (keyword: string) => {\r\n if (!keyword) return\r\n const qsField = context.filterState.storeFilter?.quickSearch\r\n const logic = qsField?.logic || 'or'\r\n replaceFilter('quickSearch', { values: [keyword], logic })\r\n }\r\n\r\n const handleKeyDown: InputBaseProps['onKeyDown'] = (event) => {\r\n const keyCode: number = event.keyCode\r\n if (keyCode === 13) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n handleSubmitSearch()\r\n } else if (keyCode === 27) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n refInput?.current?.blur()\r\n handleClose(true)\r\n }\r\n }\r\n\r\n const handleKeywordChange: InputBaseProps['onChange'] = (event) => {\r\n const finalValue = event.target.value || ''\r\n setKeywords(finalValue)\r\n\r\n const isOpenPopper = Boolean(refBeforeInput?.current) && Boolean(finalValue)\r\n if (finalValue !== keywords) setAnchorEl(isOpenPopper ? refBeforeInput?.current || null : null)\r\n }\r\n\r\n const handleFocus = (event: React.FocusEvent<HTMLElement>) => {\r\n setStatus('focus')\r\n if (!Boolean(keywords)) return\r\n setAnchorEl(refBeforeInput?.current || event.currentTarget)\r\n }\r\n\r\n const handleClickMenuItem = (field: TFieldType<T>) => {\r\n if (!keywords) return\r\n const fieldConfig = config.fields[field]\r\n const fieldValue = context.filterState.storeFilter?.[field]\r\n const logic = fieldValue?.logic || 'or'\r\n if (fieldConfig?.singleValue) {\r\n replaceFilter(field, { values: [keywords], logic })\r\n } else {\r\n addFilter(field, { values: [keywords], logic })\r\n }\r\n handleClose(true)\r\n }\r\n\r\n const handleClickSearch = () => {\r\n refInput.current?.focus()\r\n }\r\n\r\n const handleClickAway = (event: MouseEvent | TouchEvent) => {\r\n handleClose()\r\n }\r\n\r\n const renderContent = () => {\r\n const fieldsList = getFieldsByMatches(initialConfig, keywords)\r\n return (\r\n <PopperContent title='Filter Options' disableGutter onClose={() => setAnchorEl(null)}>\r\n <MenuList className={classes.menu}>\r\n {fieldsList.map((x, i) => {\r\n const field = x.field\r\n if (!x) return null\r\n const label = x.label ?? field.toString()\r\n const title = `${label}: \"${keywords}\"`\r\n return (\r\n <MenuItem title={title} key={field.toString() + i} onClick={() => handleClickMenuItem(field)} className={classes.menuItem}>\r\n <Typography variant='body2' sx={{ fontWeight: 500, flex: '0 0 auto' }}>\r\n {label}:\r\n </Typography>\r\n <Typography variant='body2' color='text.secondary' sx={{ ml: 1, flex: '1 1 auto' }} noWrap>\r\n \"{keywords}\"\r\n </Typography>\r\n </MenuItem>\r\n )\r\n })}\r\n </MenuList>\r\n </PopperContent>\r\n )\r\n }\r\n\r\n if (isMinimal) return <MobileSearchButton placeholder='Search...' onSearching={handleSubmitMobileSearch} />\r\n\r\n const rootClass = [classes.root]\r\n if (status === 'focus' || Boolean(keywords)) rootClass.push(classes.focus)\r\n\r\n return (\r\n <ClickAwayListener onClickAway={handleClickAway}>\r\n <FilterInputStyled className={rootClass.join(' ')} {...props.slots?.rootProps} sx={mergedConfig.rootSx}>\r\n <div className={classes.rootInner}>\r\n {mergedConfig.slots?.beforeInput || null}\r\n <Box className={classes.beforeInput} ref={refBeforeInput} />\r\n <InputBase\r\n fullWidth\r\n className={classes.input}\r\n autoComplete='off'\r\n size='small'\r\n inputRef={refInput}\r\n value={keywords}\r\n placeholder='Search...'\r\n onKeyDown={handleKeyDown}\r\n onChange={handleKeywordChange}\r\n onFocus={handleFocus}\r\n startAdornment={<InputAdornmentLeft onSearch={handleClickSearch} />}\r\n endAdornment={<InputAdornmentRight hasKeyword={Boolean(keywords)} onSubmit={handleSubmitSearch} onClear={() => handleClose(true)} />}\r\n />\r\n {mergedConfig.slots?.afterInput || null}\r\n </div>\r\n <PopperCustom anchorEl={anchorEl} open={isOpen} placement='bottom' transition disablePortal {...mergedConfig.slots?.popperProps}>\r\n {renderContent()}\r\n </PopperCustom>\r\n </FilterInputStyled>\r\n </ClickAwayListener>\r\n )\r\n }\r\n return FilterInput\r\n}\r\n\r\nexport const filterInputClasses = {\r\n root: 'DinoFilterInput-root',\r\n rootInner: 'DinoFilterInput-rootInner',\r\n button: 'DinoFilterInput-button',\r\n input: 'DinoFilterInput-input',\r\n focus: 'DinoFilterInput-focus',\r\n beforeInput: 'DinoFilterInput-beforeInput',\r\n menu: 'DinoFilterInput-menu',\r\n menuItem: 'DinoFilterInput-menuItem',\r\n menuItemKey: 'DinoFilterInput-menuItemKey'\r\n}\r\n\r\nconst FilterInputStyled = styled(Box)(({ theme }) => ({\r\n // Note: we use CSS variable\r\n // '--dino-h-filter-input': '38px',\r\n [`&.${filterInputClasses.root}`]: {\r\n height: 'var(--dino-h-filter-input, 38px)',\r\n flex: 1,\r\n border: '1px solid',\r\n borderColor: alpha(theme.palette.divider, 0.12),\r\n borderRadius: theme.shape.borderRadius,\r\n backgroundColor: theme.palette.background.paper,\r\n transition: theme.transitions.create(['border-color', 'box-shadow'])\r\n },\r\n '&:hover': { borderColor: theme.palette.text.primary },\r\n '&.Mui-focused': {\r\n borderColor: theme.palette.primary.main,\r\n boxShadow: `0 0 0 2px ${theme.palette.primary.main}33`\r\n },\r\n [`&.${filterInputClasses.focus}`]: {\r\n borderColor: theme.palette.primary.main,\r\n boxShadow: `0 0 0 2px ${theme.palette.primary.main}33`\r\n },\r\n [`.${filterInputClasses.rootInner}`]: { height: '100%', display: 'flex', alignItems: 'stretch' },\r\n [`.${filterInputClasses.beforeInput}`]: { width: '1px', height: '100%', alignSelf: 'stretch' },\r\n [`.${filterInputClasses.input}`]: {\r\n padding: theme.spacing(0.5, 1),\r\n input: { fontSize: '14px', padding: '4px 0 5px' }\r\n },\r\n [`.${filterInputClasses.button}`]: { flex: '0 0 auto' }\r\n}))\r\n"],"names":["createFilterInput","config","classes","filterInputClasses","initialConfig","fields","_config$enableQuickSe","enableQuickSearch","qsKey","KeySpecial","quickSearch","mergedFields","_objectSpread","item","label","mapSpecialLabel","temp","Object","assign","field","initializeConfig","props","_props$slots2","_props$slots3","_mergedConfig$slots","_mergedConfig$slots2","_mergedConfig$slots3","refInput","createRef","refBeforeInput","context","useContext","FilterBarContext","_useFilterActions","useFilterActions","addFilter","replaceFilter","_useState","useState","_useState2","_slicedToArray","anchorEl","setAnchorEl","isOpen","Boolean","_useState3","_useState4","keywords","setKeywords","_useState5","_useState6","status","setStatus","mergedConfig","useMemo","_props$slots","beforeInput","afterInput","mergedRootSx","sx","slots","rootProps","rootSx","isMinimal","minimalInput","handleClose","isClear","handleSubmitSearch","_context$filterState$","qsField","filterState","storeFilter","logic","values","_jsx","MobileSearchButton","placeholder","onSearching","keyword","_context$filterState$2","fieldsList","rootClass","root","push","focus","ClickAwayListener","onClickAway","event","children","_jsxs","FilterInputStyled","className","join","rootInner","Box","ref","InputBase","fullWidth","input","autoComplete","size","inputRef","value","onKeyDown","keyCode","stopPropagation","preventDefault","_refInput$current","current","blur","onChange","finalValue","target","isOpenPopper","onFocus","currentTarget","startAdornment","InputAdornmentLeft","onSearch","_refInput$current2","endAdornment","InputAdornmentRight","hasKeyword","onSubmit","onClear","PopperCustom","open","placement","transition","disablePortal","popperProps","getFieldsByMatches","PopperContent","title","disableGutter","onClose","MenuList","menu","map","x","i","_x$label","toString","concat","MenuItem","onClick","_context$filterState$3","fieldConfig","fieldValue","singleValue","handleClickMenuItem","menuItem","Typography","variant","fontWeight","flex","color","ml","noWrap","button","styled","_ref","theme","_defineProperty","height","border","borderColor","alpha","palette","divider","borderRadius","shape","backgroundColor","background","paper","transitions","create","text","primary","main","boxShadow","display","alignItems","width","alignSelf","padding","spacing","fontSize"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"filter-input.js","sources":["../../../../src/filter-bar/components/filter-input.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useContext, useMemo, useState } from 'react'\r\nimport { Box, InputBase, MenuItem, MenuList, styled, Typography, alpha } from '@mui/material'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from '../hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { PopperContent, PopperCustom } from './popper-custom'\r\nimport { getFieldsByMatches, InputAdornmentLeft, InputAdornmentRight } from './filter-input.units'\r\nimport MobileSearchButton from './filter-input.mobile'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { InputBaseProps } from '@mui/material'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IFilterInputConfig, IFilterInputProps, IFilterInputSlots, TFieldInputConfigs } from './filter-input.types'\r\n\r\nconst initializeConfig = <T,>(config: IFilterInputConfig<T>): IFilterInputConfig<T> => {\r\n const { fields, enableQuickSearch = true } = config\r\n const qsKey = KeySpecial.quickSearch\r\n const mergedFields: TFieldInputConfigs<T> = { ...fields }\r\n\r\n if (enableQuickSearch) {\r\n const item = mergedFields[qsKey]\r\n const label = item?.label ? item.label : mapSpecialLabel[qsKey]\r\n const temp = Object.assign({}, mergedFields[qsKey], { field: qsKey, label })\r\n mergedFields[qsKey] = temp\r\n } else {\r\n delete mergedFields[qsKey]\r\n }\r\n\r\n return { ...config, fields: mergedFields }\r\n}\r\n\r\nexport function createFilterInput<T>(config: IFilterInputConfig<T>) {\r\n const classes = filterInputClasses\r\n const initialConfig = initializeConfig(config)\r\n\r\n const FilterInput: FC<IFilterInputProps<T>> = (props) => {\r\n const refInput = createRef<HTMLInputElement>()\r\n const refBeforeInput = createRef<HTMLElement>()\r\n\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const { addFilter, replaceFilter } = useFilterActions<T>(context)\r\n\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n const isOpen = Boolean(anchorEl)\r\n\r\n const [keywords, setKeywords] = useState<string>('')\r\n const [status, setStatus] = useState<'focus' | 'normal'>('normal')\r\n\r\n const mergedConfig = useMemo(() => {\r\n const { beforeInput, afterInput } = config\r\n const mergedRootSx = Object.assign({}, props.sx, props.slots?.rootProps?.sx)\r\n const mergedSlots: IFilterInputSlots = Object.assign({}, { beforeInput, afterInput }, props.slots)\r\n return { slots: mergedSlots, rootSx: mergedRootSx }\r\n }, [])\r\n\r\n const isMinimal = config.minimalInput || props.slots?.minimalInput || false\r\n\r\n const handleClose = (isClear?: boolean) => {\r\n setAnchorEl(null)\r\n setStatus('normal')\r\n if (isClear) setKeywords('')\r\n }\r\n\r\n const handleSubmitSearch = () => {\r\n if (!keywords) return\r\n const qsField = context.filterState.storeFilter?.quickSearch\r\n const logic = qsField?.logic || 'or'\r\n replaceFilter('quickSearch', { values: [keywords], logic })\r\n handleClose(true)\r\n }\r\n\r\n const handleSubmitMobileSearch = (keyword: string) => {\r\n if (!keyword) return\r\n const qsField = context.filterState.storeFilter?.quickSearch\r\n const logic = qsField?.logic || 'or'\r\n replaceFilter('quickSearch', { values: [keyword], logic })\r\n }\r\n\r\n const handleKeyDown: InputBaseProps['onKeyDown'] = (event) => {\r\n const keyCode: number = event.keyCode\r\n if (keyCode === 13) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n handleSubmitSearch()\r\n } else if (keyCode === 27) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n refInput?.current?.blur()\r\n handleClose(true)\r\n }\r\n }\r\n\r\n const handleKeywordChange: InputBaseProps['onChange'] = (event) => {\r\n const finalValue = event.target.value || ''\r\n setKeywords(finalValue)\r\n\r\n const isOpenPopper = Boolean(refBeforeInput?.current) && Boolean(finalValue)\r\n if (finalValue !== keywords) setAnchorEl(isOpenPopper ? refBeforeInput?.current || null : null)\r\n }\r\n\r\n const handleFocus = (event: React.FocusEvent<HTMLElement>) => {\r\n setStatus('focus')\r\n if (!Boolean(keywords)) return\r\n setAnchorEl(refBeforeInput?.current || event.currentTarget)\r\n }\r\n\r\n const handleClickMenuItem = (field: TFieldType<T>) => {\r\n if (!keywords) return\r\n const fieldConfig = config.fields[field]\r\n const fieldValue = context.filterState.storeFilter?.[field]\r\n const logic = fieldValue?.logic || 'or'\r\n if (fieldConfig?.singleValue) {\r\n replaceFilter(field, { values: [keywords], logic })\r\n } else {\r\n addFilter(field, { values: [keywords], logic })\r\n }\r\n handleClose(true)\r\n }\r\n\r\n const handleClickSearch = () => {\r\n refInput.current?.focus()\r\n }\r\n\r\n const handleClickAway = (event: MouseEvent | TouchEvent) => {\r\n handleClose()\r\n }\r\n\r\n const renderContent = () => {\r\n const fieldsList = getFieldsByMatches(initialConfig, keywords)\r\n return (\r\n <PopperContent title='Filter Options' disableGutter onClose={() => setAnchorEl(null)}>\r\n <MenuList className={classes.menu}>\r\n {fieldsList.map((x, i) => {\r\n const field = x.field\r\n if (!x) return null\r\n const label = x.label ?? field.toString()\r\n const title = `${label}: \"${keywords}\"`\r\n return (\r\n <MenuItem title={title} key={field.toString() + i} onClick={() => handleClickMenuItem(field)} className={classes.menuItem}>\r\n <Typography variant='body2' sx={{ fontWeight: 500, flex: '0 0 auto' }}>\r\n {label}:\r\n </Typography>\r\n <Typography variant='body2' color='text.secondary' sx={{ ml: 1, flex: '1 1 auto' }} noWrap>\r\n \"{keywords}\"\r\n </Typography>\r\n </MenuItem>\r\n )\r\n })}\r\n </MenuList>\r\n </PopperContent>\r\n )\r\n }\r\n\r\n if (isMinimal) return <MobileSearchButton placeholder='Search...' onSearching={handleSubmitMobileSearch} />\r\n\r\n const rootClass = [classes.root]\r\n if (status === 'focus' || Boolean(keywords)) rootClass.push(classes.focus)\r\n\r\n return (\r\n <ClickAwayListener onClickAway={handleClickAway}>\r\n <FilterInputStyled className={rootClass.join(' ')} {...props.slots?.rootProps} sx={mergedConfig.rootSx}>\r\n <div className={classes.rootInner}>\r\n {mergedConfig.slots?.beforeInput || null}\r\n <Box className={classes.beforeInput} ref={refBeforeInput} />\r\n <InputBase\r\n fullWidth\r\n className={classes.input}\r\n autoComplete='off'\r\n size='small'\r\n inputRef={refInput}\r\n value={keywords}\r\n placeholder='Search...'\r\n onKeyDown={handleKeyDown}\r\n onChange={handleKeywordChange}\r\n onFocus={handleFocus}\r\n startAdornment={<InputAdornmentLeft onSearch={handleClickSearch} />}\r\n endAdornment={<InputAdornmentRight hasKeyword={Boolean(keywords)} onSubmit={handleSubmitSearch} onClear={() => handleClose(true)} />}\r\n />\r\n {mergedConfig.slots?.afterInput || null}\r\n </div>\r\n <PopperCustom anchorEl={anchorEl} open={isOpen} placement='bottom' transition disablePortal {...mergedConfig.slots?.popperProps}>\r\n {renderContent()}\r\n </PopperCustom>\r\n </FilterInputStyled>\r\n </ClickAwayListener>\r\n )\r\n }\r\n return FilterInput\r\n}\r\n\r\nexport const filterInputClasses = {\r\n root: 'DinoFilterInput-root',\r\n rootInner: 'DinoFilterInput-rootInner',\r\n button: 'DinoFilterInput-button',\r\n input: 'DinoFilterInput-input',\r\n focus: 'DinoFilterInput-focus',\r\n beforeInput: 'DinoFilterInput-beforeInput',\r\n menu: 'DinoFilterInput-menu',\r\n menuItem: 'DinoFilterInput-menuItem',\r\n menuItemKey: 'DinoFilterInput-menuItemKey'\r\n}\r\n\r\nconst FilterInputStyled = styled(Box)(({ theme }) => ({\r\n // Note: we use CSS variable\r\n // '--dino-h-filter-input': '38px',\r\n [`&.${filterInputClasses.root}`]: {\r\n height: 'var(--dino-h-filter-input, 38px)',\r\n flex: 1,\r\n border: '1px solid',\r\n borderColor: alpha(theme.palette.divider, 0.12),\r\n borderRadius: theme.shape.borderRadius,\r\n backgroundColor: theme.palette.background.paper,\r\n transition: theme.transitions.create(['border-color', 'box-shadow'])\r\n },\r\n '&:hover': { borderColor: theme.palette.text.primary },\r\n '&.Mui-focused': {\r\n borderColor: theme.palette.primary.main,\r\n boxShadow: `0 0 0 2px ${theme.palette.primary.main}33`\r\n },\r\n [`&.${filterInputClasses.focus}`]: {\r\n borderColor: theme.palette.primary.main,\r\n boxShadow: `0 0 0 2px ${theme.palette.primary.main}33`\r\n },\r\n [`.${filterInputClasses.rootInner}`]: { height: '100%', display: 'flex', alignItems: 'stretch' },\r\n [`.${filterInputClasses.beforeInput}`]: { width: '1px', height: '100%', alignSelf: 'stretch' },\r\n [`.${filterInputClasses.input}`]: {\r\n padding: theme.spacing(0.5, 1),\r\n input: { fontSize: '14px', padding: '4px 0 5px' }\r\n },\r\n [`.${filterInputClasses.button}`]: { flex: '0 0 auto' }\r\n}))\r\n"],"names":["createFilterInput","config","classes","filterInputClasses","initialConfig","fields","_config$enableQuickSe","enableQuickSearch","qsKey","KeySpecial","quickSearch","mergedFields","_objectSpread","item","label","mapSpecialLabel","temp","Object","assign","field","initializeConfig","props","_props$slots2","_props$slots3","_mergedConfig$slots","_mergedConfig$slots2","_mergedConfig$slots3","refInput","createRef","refBeforeInput","context","useContext","FilterBarContext","_useFilterActions","useFilterActions","addFilter","replaceFilter","_useState","useState","_useState2","_slicedToArray","anchorEl","setAnchorEl","isOpen","Boolean","_useState3","_useState4","keywords","setKeywords","_useState5","_useState6","status","setStatus","mergedConfig","useMemo","_props$slots","beforeInput","afterInput","mergedRootSx","sx","slots","rootProps","rootSx","isMinimal","minimalInput","handleClose","isClear","handleSubmitSearch","_context$filterState$","qsField","filterState","storeFilter","logic","values","_jsx","MobileSearchButton","placeholder","onSearching","keyword","_context$filterState$2","fieldsList","rootClass","root","push","focus","ClickAwayListener","onClickAway","event","children","_jsxs","FilterInputStyled","className","join","rootInner","Box","ref","InputBase","fullWidth","input","autoComplete","size","inputRef","value","onKeyDown","keyCode","stopPropagation","preventDefault","_refInput$current","current","blur","onChange","finalValue","target","isOpenPopper","onFocus","currentTarget","startAdornment","InputAdornmentLeft","onSearch","_refInput$current2","endAdornment","InputAdornmentRight","hasKeyword","onSubmit","onClear","PopperCustom","open","placement","transition","disablePortal","popperProps","getFieldsByMatches","PopperContent","title","disableGutter","onClose","MenuList","menu","map","x","i","_x$label","toString","concat","MenuItem","onClick","_context$filterState$3","fieldConfig","fieldValue","singleValue","handleClickMenuItem","menuItem","Typography","variant","fontWeight","flex","color","ml","noWrap","button","styled","_ref","theme","_defineProperty","height","border","borderColor","alpha","palette","divider","borderRadius","shape","backgroundColor","background","paper","transitions","create","text","primary","main","boxShadow","display","alignItems","width","alignSelf","padding","spacing","fontSize"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{objectSpread2 as
|
|
1
|
+
import{objectSpread2 as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as r,jsx as l}from"react/jsx-runtime";import{InputAdornment as i,Tooltip as o,IconButton as a,colors as t,SvgIcon as n}from"@mui/material";import c from"@mui/icons-material/Close";import s from"@mui/icons-material/Search";import{KeySpecial as u}from"../types.js";function d(e,r){var l=(r||"").toString().trim().toLowerCase(),i=Object.keys(e.fields||{}),o=[];return i.forEach(function(r){var i,a,t=e.fields[r];if(t){var n=null===(i=e.matches)||void 0===i?void 0:i[r],c=null!==(a=null==n?void 0:n.rules)&&void 0!==a?a:[{rule:"always"}];(Array.isArray(c)?c:[]).forEach(function(e){switch(e.rule){case"always":return void o.push({field:r,label:t.label});case"existed":return void(l&&o.push({field:r,label:t.label}));case"link":try{new URL(l),o.push({field:r,label:t.label})}catch(e){}return;case"custom":var i;return void(null!==(i=e.validate)&&void 0!==i&&i.call(e,l)&&o.push({field:r,label:t.label}));default:return}})}}),o.sort(function(e,r){return e.field===u.quickSearch?1:r.field===u.quickSearch?-1:0})}var f=function(r){return l(n,e(e({viewBox:"2 0 24 24",version:"1.0"},r),{},{children:l("path",{fill:"currentColor",d:"M19,6a1,1,0,0,0-1,1v4a1,1,0,0,1-1,1H7.41l1.3-1.29A1,1,0,0,0,7.29,9.29l-3,3a1,1,0,0,0-.21.33,1,1,0,0,0,0,.76,1,1,0,0,0,.21.33l3,3a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42L7.41,14H17a3,3,0,0,0,3-3V7A1,1,0,0,0,19,6Z"})}))},m=function(e){return l(i,{position:"start",children:l(o,{title:"Enter the value to search for",arrow:!0,children:l(a,{size:"small",sx:{flex:"0 0 auto"},onClick:e.onSearch,children:l(s,{fontSize:"small"})})})})},h=function(e){var n=e.hasKeyword,s=e.onSubmit,u=e.onClear;return r(i,{position:"end",children:[n&&l(o,{title:"The enter or click to apply",arrow:!0,placement:"top",children:l(a,{size:"small",sx:{flex:"0 0 auto",color:t.blue[600],"&:hover":{color:t.blue[900]}},onClick:s,children:l(f,{fontSize:"small"})})}),n&&l(o,{title:"Clear",arrow:!0,placement:"top",children:l(a,{size:"small",sx:{flex:"0 0 auto",color:t.red[500],"&:hover":{color:t.red[700]}},onClick:u,children:l(c,{fontSize:"small"})})})]})};export{m as InputAdornmentLeft,h as InputAdornmentRight,d as getFieldsByMatches};
|
|
2
2
|
//# sourceMappingURL=filter-input.units.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filter-input.units.js","sources":["../../../../src/filter-bar/components/filter-input.units.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { colors, IconButton, InputAdornment, SvgIcon, Tooltip } from '@mui/material'\r\nimport CloseIcon from '@mui/icons-material/Close'\r\nimport SearchIcon from '@mui/icons-material/Search'\r\nimport { KeySpecial } from '../types'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IconButtonProps, SvgIconProps } from '@mui/material'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFieldInputConfig, IFilterInputConfig, TFieldMatch } from './filter-input.types'\r\n\r\nexport function getFieldsByMatches<T>(config: IFilterInputConfig<T>, keywords: string): IFieldInputConfig<T>[] {\r\n const value = (keywords || '').toString().trim().toLowerCase()\r\n const keys = Object.keys(config.fields || {}) as TFieldType<T>[]\r\n const items: IFieldInputConfig<T>[] = []\r\n\r\n keys.forEach((key) => {\r\n const fieldConfig = config.fields[key]\r\n if (!fieldConfig) return\r\n\r\n const matchConfig = config.matches?.[key]\r\n const rules = matchConfig?.rules ?? [{ rule: 'always' }]\r\n const finalRules: TFieldMatch[] = Array.isArray(rules) ? rules : []\r\n\r\n finalRules.forEach((r) => {\r\n switch (r.rule) {\r\n case 'always': {\r\n items.push({ field: key, label: fieldConfig.label })\r\n return\r\n }\r\n case 'existed': {\r\n if (value) items.push({ field: key, label: fieldConfig.label })\r\n return\r\n }\r\n case 'link': {\r\n try {\r\n new URL(value)\r\n items.push({ field: key, label: fieldConfig.label })\r\n } catch {\r\n // If the value is not a valid URL, we won't show the linked field\r\n }\r\n return\r\n }\r\n case 'custom': {\r\n if (r.validate?.(value)) items.push({ field: key, label: fieldConfig.label })\r\n return\r\n }\r\n default:\r\n return\r\n }\r\n })\r\n })\r\n\r\n return items.sort((a, b) => {\r\n if (a.field === KeySpecial.quickSearch) return 1\r\n if (b.field === KeySpecial.quickSearch) return -1\r\n return 0\r\n })\r\n}\r\n\r\nconst EnterIcon: FC<SvgIconProps> = (props) => (\r\n <SvgIcon viewBox='2 0 24 24' version='1.0' {...props}>\r\n <path\r\n fill='currentColor'\r\n d='M19,6a1,1,0,0,0-1,1v4a1,1,0,0,1-1,1H7.41l1.3-1.29A1,1,0,0,0,7.29,9.29l-3,3a1,1,0,0,0-.21.33,1,1,0,0,0,0,.76,1,1,0,0,0,.21.33l3,3a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42L7.41,14H17a3,3,0,0,0,3-3V7A1,1,0,0,0,19,6Z'\r\n />\r\n </SvgIcon>\r\n)\r\n\r\ninterface InputAdornmentLeftProps {\r\n onSearch?: IconButtonProps['onClick']\r\n}\r\n\r\nexport const InputAdornmentLeft: FC<InputAdornmentLeftProps> = (props) => (\r\n <InputAdornment position='start'>\r\n <Tooltip title='Enter the value to search for' arrow>\r\n <IconButton size='small' sx={{ flex: '0 0 auto' }} onClick={props.onSearch}>\r\n <SearchIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n </InputAdornment>\r\n)\r\n\r\ninterface InputAdornmentRightProps {\r\n hasKeyword?: boolean\r\n onSubmit?: IconButtonProps['onClick']\r\n onClear?: IconButtonProps['onClick']\r\n}\r\n\r\nexport const InputAdornmentRight: FC<InputAdornmentRightProps> = (props) => {\r\n const { hasKeyword, onSubmit, onClear } = props\r\n return (\r\n <InputAdornment position='end'>\r\n {hasKeyword && (\r\n <Tooltip title='The enter or click to apply' arrow>\r\n <IconButton size='small' sx={{ flex: '0 0 auto', color: colors.blue[600], '&:hover': { color: colors.blue[900] } }} onClick={onSubmit}>\r\n <EnterIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n )}\r\n\r\n {hasKeyword && (\r\n <Tooltip title='Clear' arrow>\r\n <IconButton size='small' sx={{ flex: '0 0 auto', color: colors.red[500], '&:hover': { color: colors.red[700] } }} onClick={onClear}>\r\n <CloseIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n )}\r\n </InputAdornment>\r\n )\r\n}\r\n"],"names":["getFieldsByMatches","config","keywords","value","toString","trim","toLowerCase","keys","Object","fields","items","forEach","key","_config$matches","_matchConfig$rules","fieldConfig","matchConfig","matches","rules","rule","Array","isArray","r","push","field","label","URL","_unused","_r$validate","validate","call","sort","a","b","KeySpecial","quickSearch","EnterIcon","props","_jsx","SvgIcon","_objectSpread","viewBox","version","children","fill","d","InputAdornmentLeft","InputAdornment","position","Tooltip","title","arrow","IconButton","size","sx","flex","onClick","onSearch","SearchIcon","fontSize","InputAdornmentRight","hasKeyword","onSubmit","onClear","_jsxs","color","colors","blue","red","CloseIcon"],"mappings":"kWAagB,SAAAA,EAAsBC,EAA+BC,GACnE,IAAMC,GAASD,GAAY,IAAIE,WAAWC,OAAOC,cAC3CC,EAAOC,OAAOD,KAAKN,EAAOQ,QAAU,CAAA,GACpCC,EAAgC,GAuCtC,OArCAH,EAAKI,QAAQ,SAACC,GAAO,IAAAC,EAAAC,EACbC,EAAcd,EAAOQ,OAAOG,GAClC,GAAKG,EAAL,CAEA,IAAMC,EAA4B,QAAjBH,EAAGZ,EAAOgB,eAAO,IAAAJ,OAAA,EAAdA,EAAiBD,GAC/BM,EAA0BJ,QAArBA,EAAGE,aAAW,EAAXA,EAAaE,aAAKJ,IAAAA,EAAAA,EAAI,CAAC,CAAEK,KAAM,YACXC,MAAMC,QAAQH,GAASA,EAAQ,IAEtDP,QAAQ,SAACW,GAClB,OAAQA,EAAEH,MACR,IAAK,SAEH,YADAT,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,QAG9C,IAAK,UAEH,YADItB,GAAOO,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,SAGzD,IAAK,OACH,IACE,IAAIC,IAAIvB,GACRO,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,OAC7C,CAAC,MAAAE,GACA,CAEF,OAEF,IAAK,SAAU,IAAAC,EAEb,YADcA,QAAdA,EAAIN,EAAEO,oBAAQD,GAAVA,EAAAE,KAAAR,EAAanB,IAAQO,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,SAGvE,QACE,OAEN,EAhCkB,CAiCpB,GAEOf,EAAMqB,KAAK,SAACC,EAAGC,GACpB,OAAID,EAAER,QAAUU,EAAWC,YAAoB,EAC3CF,EAAET,QAAUU,EAAWC,aAAsB,EAC1C,CACT,EACF,CAEA,IAAMC,EAA8B,SAACC,GAAK,OACxCC,EAACC,EAAOC,EAAAA,EAAA,CAACC,QAAQ,YAAYC,QAAQ,OAAUL,GAAK,GAAA,CAClDM,SAAAL,EAAA,OAAA,CACEM,KAAK,eACLC,EAAE,oNAEI,EAOCC,EAAkD,SAACT,GAAK,OACnEC,EAACS,EAAc,CAACC,SAAS,QAAOL,SAC9BL,EAACW,EAAQ,CAAAC,MAAM,gCAAgCC,OAC7C,EAAAR,SAAAL,EAACc,EAAU,CAACC,KAAK,QAAQC,GAAI,CAAEC,KAAM,YAAcC,QAASnB,EAAMoB,SAChEd,SAAAL,EAACoB,EAAU,CAACC,SAAS,eAGV,EASNC,EAAoD,SAACvB,GAChE,IAAQwB,EAAkCxB,EAAlCwB,WAAYC,EAAsBzB,EAAtByB,SAAUC,EAAY1B,EAAZ0B,QAC9B,OACEC,EAACjB,EAAc,CAACC,SAAS,
|
|
1
|
+
{"version":3,"file":"filter-input.units.js","sources":["../../../../src/filter-bar/components/filter-input.units.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { colors, IconButton, InputAdornment, SvgIcon, Tooltip } from '@mui/material'\r\nimport CloseIcon from '@mui/icons-material/Close'\r\nimport SearchIcon from '@mui/icons-material/Search'\r\nimport { KeySpecial } from '../types'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IconButtonProps, SvgIconProps } from '@mui/material'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFieldInputConfig, IFilterInputConfig, TFieldMatch } from './filter-input.types'\r\n\r\nexport function getFieldsByMatches<T>(config: IFilterInputConfig<T>, keywords: string): IFieldInputConfig<T>[] {\r\n const value = (keywords || '').toString().trim().toLowerCase()\r\n const keys = Object.keys(config.fields || {}) as TFieldType<T>[]\r\n const items: IFieldInputConfig<T>[] = []\r\n\r\n keys.forEach((key) => {\r\n const fieldConfig = config.fields[key]\r\n if (!fieldConfig) return\r\n\r\n const matchConfig = config.matches?.[key]\r\n const rules = matchConfig?.rules ?? [{ rule: 'always' }]\r\n const finalRules: TFieldMatch[] = Array.isArray(rules) ? rules : []\r\n\r\n finalRules.forEach((r) => {\r\n switch (r.rule) {\r\n case 'always': {\r\n items.push({ field: key, label: fieldConfig.label })\r\n return\r\n }\r\n case 'existed': {\r\n if (value) items.push({ field: key, label: fieldConfig.label })\r\n return\r\n }\r\n case 'link': {\r\n try {\r\n new URL(value)\r\n items.push({ field: key, label: fieldConfig.label })\r\n } catch {\r\n // If the value is not a valid URL, we won't show the linked field\r\n }\r\n return\r\n }\r\n case 'custom': {\r\n if (r.validate?.(value)) items.push({ field: key, label: fieldConfig.label })\r\n return\r\n }\r\n default:\r\n return\r\n }\r\n })\r\n })\r\n\r\n return items.sort((a, b) => {\r\n if (a.field === KeySpecial.quickSearch) return 1\r\n if (b.field === KeySpecial.quickSearch) return -1\r\n return 0\r\n })\r\n}\r\n\r\nconst EnterIcon: FC<SvgIconProps> = (props) => (\r\n <SvgIcon viewBox='2 0 24 24' version='1.0' {...props}>\r\n <path\r\n fill='currentColor'\r\n d='M19,6a1,1,0,0,0-1,1v4a1,1,0,0,1-1,1H7.41l1.3-1.29A1,1,0,0,0,7.29,9.29l-3,3a1,1,0,0,0-.21.33,1,1,0,0,0,0,.76,1,1,0,0,0,.21.33l3,3a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42L7.41,14H17a3,3,0,0,0,3-3V7A1,1,0,0,0,19,6Z'\r\n />\r\n </SvgIcon>\r\n)\r\n\r\ninterface InputAdornmentLeftProps {\r\n onSearch?: IconButtonProps['onClick']\r\n}\r\n\r\nexport const InputAdornmentLeft: FC<InputAdornmentLeftProps> = (props) => (\r\n <InputAdornment position='start'>\r\n <Tooltip title='Enter the value to search for' arrow>\r\n <IconButton size='small' sx={{ flex: '0 0 auto' }} onClick={props.onSearch}>\r\n <SearchIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n </InputAdornment>\r\n)\r\n\r\ninterface InputAdornmentRightProps {\r\n hasKeyword?: boolean\r\n onSubmit?: IconButtonProps['onClick']\r\n onClear?: IconButtonProps['onClick']\r\n}\r\n\r\nexport const InputAdornmentRight: FC<InputAdornmentRightProps> = (props) => {\r\n const { hasKeyword, onSubmit, onClear } = props\r\n return (\r\n <InputAdornment position='end'>\r\n {hasKeyword && (\r\n <Tooltip title='The enter or click to apply' arrow placement='top'>\r\n <IconButton size='small' sx={{ flex: '0 0 auto', color: colors.blue[600], '&:hover': { color: colors.blue[900] } }} onClick={onSubmit}>\r\n <EnterIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n )}\r\n\r\n {hasKeyword && (\r\n <Tooltip title='Clear' arrow placement='top'>\r\n <IconButton size='small' sx={{ flex: '0 0 auto', color: colors.red[500], '&:hover': { color: colors.red[700] } }} onClick={onClear}>\r\n <CloseIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n )}\r\n </InputAdornment>\r\n )\r\n}\r\n"],"names":["getFieldsByMatches","config","keywords","value","toString","trim","toLowerCase","keys","Object","fields","items","forEach","key","_config$matches","_matchConfig$rules","fieldConfig","matchConfig","matches","rules","rule","Array","isArray","r","push","field","label","URL","_unused","_r$validate","validate","call","sort","a","b","KeySpecial","quickSearch","EnterIcon","props","_jsx","SvgIcon","_objectSpread","viewBox","version","children","fill","d","InputAdornmentLeft","InputAdornment","position","Tooltip","title","arrow","IconButton","size","sx","flex","onClick","onSearch","SearchIcon","fontSize","InputAdornmentRight","hasKeyword","onSubmit","onClear","_jsxs","placement","color","colors","blue","red","CloseIcon"],"mappings":"kWAagB,SAAAA,EAAsBC,EAA+BC,GACnE,IAAMC,GAASD,GAAY,IAAIE,WAAWC,OAAOC,cAC3CC,EAAOC,OAAOD,KAAKN,EAAOQ,QAAU,CAAA,GACpCC,EAAgC,GAuCtC,OArCAH,EAAKI,QAAQ,SAACC,GAAO,IAAAC,EAAAC,EACbC,EAAcd,EAAOQ,OAAOG,GAClC,GAAKG,EAAL,CAEA,IAAMC,EAA4B,QAAjBH,EAAGZ,EAAOgB,eAAO,IAAAJ,OAAA,EAAdA,EAAiBD,GAC/BM,EAA0BJ,QAArBA,EAAGE,aAAW,EAAXA,EAAaE,aAAKJ,IAAAA,EAAAA,EAAI,CAAC,CAAEK,KAAM,YACXC,MAAMC,QAAQH,GAASA,EAAQ,IAEtDP,QAAQ,SAACW,GAClB,OAAQA,EAAEH,MACR,IAAK,SAEH,YADAT,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,QAG9C,IAAK,UAEH,YADItB,GAAOO,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,SAGzD,IAAK,OACH,IACE,IAAIC,IAAIvB,GACRO,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,OAC7C,CAAC,MAAAE,GACA,CAEF,OAEF,IAAK,SAAU,IAAAC,EAEb,YADcA,QAAdA,EAAIN,EAAEO,oBAAQD,GAAVA,EAAAE,KAAAR,EAAanB,IAAQO,EAAMa,KAAK,CAAEC,MAAOZ,EAAKa,MAAOV,EAAYU,SAGvE,QACE,OAEN,EAhCkB,CAiCpB,GAEOf,EAAMqB,KAAK,SAACC,EAAGC,GACpB,OAAID,EAAER,QAAUU,EAAWC,YAAoB,EAC3CF,EAAET,QAAUU,EAAWC,aAAsB,EAC1C,CACT,EACF,CAEA,IAAMC,EAA8B,SAACC,GAAK,OACxCC,EAACC,EAAOC,EAAAA,EAAA,CAACC,QAAQ,YAAYC,QAAQ,OAAUL,GAAK,GAAA,CAClDM,SAAAL,EAAA,OAAA,CACEM,KAAK,eACLC,EAAE,oNAEI,EAOCC,EAAkD,SAACT,GAAK,OACnEC,EAACS,EAAc,CAACC,SAAS,QAAOL,SAC9BL,EAACW,EAAQ,CAAAC,MAAM,gCAAgCC,OAC7C,EAAAR,SAAAL,EAACc,EAAU,CAACC,KAAK,QAAQC,GAAI,CAAEC,KAAM,YAAcC,QAASnB,EAAMoB,SAChEd,SAAAL,EAACoB,EAAU,CAACC,SAAS,eAGV,EASNC,EAAoD,SAACvB,GAChE,IAAQwB,EAAkCxB,EAAlCwB,WAAYC,EAAsBzB,EAAtByB,SAAUC,EAAY1B,EAAZ0B,QAC9B,OACEC,EAACjB,EAAc,CAACC,SAAS,MACtBL,SAAA,CAAAkB,GACCvB,EAACW,GAAQC,MAAM,8BAA8BC,OAAK,EAACc,UAAU,MAC3DtB,SAAAL,EAACc,EAAU,CAACC,KAAK,QAAQC,GAAI,CAAEC,KAAM,WAAYW,MAAOC,EAAOC,KAAK,KAAM,UAAW,CAAEF,MAAOC,EAAOC,KAAK,OAAUZ,QAASM,WAC3HxB,EAACF,EAAU,CAAAuB,SAAS,cAKzBE,GACCvB,EAACW,EAAQ,CAAAC,MAAM,QAAQC,SAAMc,UAAU,MAAKtB,SAC1CL,EAACc,EAAW,CAAAC,KAAK,QAAQC,GAAI,CAAEC,KAAM,WAAYW,MAAOC,EAAOE,IAAI,KAAM,UAAW,CAAEH,MAAOC,EAAOE,IAAI,OAAUb,QAASO,EACzHpB,SAAAL,EAACgC,EAAU,CAAAX,SAAS,gBAMhC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{defineProperty as e,objectWithoutProperties as r,objectSpread2 as n,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"
|
|
1
|
+
import{defineProperty as e,objectWithoutProperties as r,objectSpread2 as n,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 w,FormValidator as P}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=r(e,M),u=I.quickSearch,c=n({},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,r){var t=c[r];return t?(e[r]=n(n({},t),{},{field:r}),e):e},{}),v=n({},i);return f.forEach(function(e){var r,n,t,i=v[e],o=null!==(r=null!==(n=null==i?void 0:i.label)&&void 0!==n?n:null===(t=c[e])||void 0===t?void 0:t.label)&&void 0!==r?r:e.toString();i?i.Rules.some(function(e){return e.rule===w.Required})||(i.label=o,i.Rules.push({rule:w.Required})):v[e]={Rules:[{rule:w.Required}],label:o}}),n(n({},a),{},{fields:p,validation:v,enableQuickSearch:l})}(m),q=function(r){return Object.keys(r.fields).reduce(function(n,t){var i,o=t,l=null===(i=r.validation)||void 0===i?void 0:i[o];return l&&(n[o]=new P(e({},o,l))),n},{})}(p),Q=function(e){var r=e.fields;return Object.keys(r).reduce(function(e,n){var t,i=n,o=r[i];return o&&(e[i]=null!==(t=o.form)&&void 0!==t?t:O(o)),e},{})}(p);return function(e){var r=d(),I=u(null),x=t(I,2),w=x[0],P=x[1],O=Boolean(w),M=c(S),D=C(M),V=u(null),z=t(V,2),E=z[0],_=z[1],G=s(function(){var r=m.popperProps,n=m.rootProps;return Object.assign({},{popperProps:r,rootProps:n},e.slots)},[m,e.slots]),H=function(){P(null),setTimeout(function(){_(null)},300)},W=function(){D.clearAllFilters(),H()},J=function(){var e=i(o().m(function e(r,n,t){return o().w(function(e){for(;;)switch(e.n){case 0:if(n){e.n=1;break}return e.a(2);case 1:null!=t&&t.singleValue?D.replaceFilter(r,n,{logic:n.logic}):D.upsertManyFilter(r,n,{logic:n.logic});case 2:return e.a(2)}},e)}));return function(r,n,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,n(n({className:f.root},G.rootProps),{},{children:[l(v,{title:X,arrow:!0,placement:"top",children:l(b,{size:"small",ref:r,onClick:function(){_(null),P(r.current)},children:l(h,{badgeContent:U,color:"primary",invisible:0===U,children:l(F,{fontSize:"small"})})})}),l(R,n(n({open:O,anchorEl:w,placement:"bottom",transition:!0,disablePortal:!0},G.popperProps),{},{children:function(){if(0===K.length)return l(T,{onClose:H});if(E){var e,r=Q[E];if(!r)return null;var n=null===(e=M.filterState.storeFilter)||void 0===e?void 0:e[E];return l(r,{value:n,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 r,n,t=e.field.toString();if(!t)return null;var i=D.getFieldInfo(e.field),o=null!==(r=null==i?void 0:i.values.join(", "))&&void 0!==r?r:"",u=i?i.values.length:0,c=u>0?" (".concat(u,")"):"",s=null!==(n=e.label)&&void 0!==n?n: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 r=e.field,void _(r);var r},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, 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} arrow>\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","arrow","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","menuItemInner","Typography","variant","ml","PopperFooter","Button","disabled","renderContent","styled","Box","display","alignItems","flex","MenuList","paddingTop","paddingBottom","width","gap"],"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} arrow placement='top'>\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","arrow","placement","IconButton","size","ref","onClick","current","Badge","badgeContent","color","invisible","FilterListIcon","fontSize","PopperCustom","open","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","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{defineProperty as o,
|
|
1
|
+
import{defineProperty as o,objectSpread2 as r,slicedToArray as n}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as t,jsxs as e,Fragment as i}from"react/jsx-runtime";import{useState as l,useContext as a,useMemo as c,createRef as s}from"react";import{styled as u,Box as d,Tooltip as m,IconButton as f,Badge as p,MenuList as h,MenuItem as v,Typography as S,Button as g}from"@mui/material";import b from"@mui/icons-material/SwapVert";import y from"@mui/icons-material/ArrowUpward";import w from"@mui/material/ClickAwayListener";import I from"@mui/icons-material/ArrowDownward";import{KeySpecial as j}from"../types.js";import{ShufffleIcon as P}from"./units.js";import{useFilterActions as x}from"../hooks.js";import{mapSpecialLabel as C}from"../helpers.js";import{FilterBarContext as k}from"../index.context.js";import{PopperCustom as z,PopperContent as D,PopperFooter as A}from"./popper-custom.js";var B={asc:"Ascending",desc:"Descending"},F=function(o){return o?B[o]:""},N={asc:t(y,{fontSize:"small"}),desc:t(I,{fontSize:"small"})},T=function(o){return o?N[o]:null};function O(o){var u=o.enableShuffle,d=o.shufflePosition,y=void 0===d?"right":d,I=E,B=function(o){var t=o.fields,e=r({},t),i=[];return Object.entries(e).forEach(function(o){var r=n(o,2),t=r[0],e=r[1];i.push({field:t,label:null==e?void 0:e.label})}),i}(o);return function(d){var N=s(),O=l(null),E=n(O,2),H=E[0],L=E[1],M=Boolean(H),U=a(k),V=x(U),W=V.getSort,q=V.changeSort,G=V.removeSort,J=c(function(){var r,n=W(),t=(null==n?void 0:n.field)===j.sortShuffle,e=Boolean(null==n?void 0:n.field)&&!t,i=o.fields[null==n?void 0:n.field],l=null!==(r=null==i?void 0:i.label)&&void 0!==r?r:null==n?void 0:n.field.toString(),a=e?"Sorted by ".concat(l," ").concat(null==n?void 0:n.direction):"Sort";return{field:null==n?void 0:n.field,direction:null==n?void 0:n.direction,hasSort:e,hasShuffleSort:t,title:a}},[W]),K=c(function(){var n,t,e=r(r({},d.slots),{},{rootProps:r(r({},null===(n=d.slots)||void 0===n?void 0:n.rootProps),{},{sx:r(r({},d.sx),null===(t=d.slots)||void 0===t||null===(t=t.rootProps)||void 0===t?void 0:t.sx)})});return Object.assign({popperProps:{},rootProps:{}},o,e)},[d.slots,d.sx]),Q=function(){L(null)},R=function(){Q(),setTimeout(function(){G()},100)},X=function(){if(!u)return null;var o=C[j.sortShuffle],n=null!=J&&J.hasShuffleSort?"ON":"OFF",e=null!=J&&J.hasShuffleSort?"primary":"default";return t(m,{title:"".concat(o," - ").concat(n),arrow:!0,placement:"top",children:t(f,r(r({color:e,size:"small",onClick:function(){return q(j.sortShuffle)}},K.buttonShuffleProps),{},{children:t(p,{variant:"dot",color:"primary",invisible:!(null!=J&&J.hasShuffleSort),children:t(P,{fontSize:"small"})})}))})};return e(i,{children:["left"===y&&X(),t(w,{onClickAway:Q,children:e(_,r(r({className:I.root},K.rootProps),{},{children:[t(m,{title:null==J?void 0:J.title,arrow:!0,placement:"top",children:t(f,r(r({size:"small",ref:N,onClick:function(){L(N.current)}},K.buttonSortProps),{},{children:t(p,{variant:"dot",color:"primary",invisible:!(null!=J&&J.hasSort),children:t(b,{fontSize:"small"})})}))}),t(z,r(r({open:M,anchorEl:H,placement:"bottom",transition:!0,disablePortal:!0},K.popperProps),{},{children:e(D,{title:"Sort by",onClose:Q,children:[t(h,{className:I.menu,children:B.map(function(o){var r,n=o.field.toString();if(!n)return null;var i=null!==(r=o.label)&&void 0!==r?r:n.toString(),l=(null==J?void 0:J.field)===o.field,a=l?J.direction:void 0;return t(v,{className:I.menuItem,sx:{justifyContent:"space-between"},onClick:function(){return r=o.field,Q(),void setTimeout(function(){q(r)},100);var r},selected:l,children:t(m,{title:F(a),placement:"right",arrow:!0,children:e("div",{className:I.menuItemInner,children:[t(S,{variant:"body2",children:i}),T(a)]})})},n)})}),e(A,{children:[t(g,{color:"inherit",onClick:R,children:"Clear"}),t(g,{color:"primary",onClick:Q,children:"Done"})]})]})}))]}))}),"right"===y&&X()]})}}var E={root:"DinoFilterSort-root",menu:"DinoFilterSort-menu",menuItem:"DinoFilterSort-menuItem",menuItemInner:"DinoFilterSort-menuItemInner"},_=u(d)(function(r){var n=r.theme;return o(o(o({},"&.".concat(E.menu),{minWidth:"200px",padding:0}),".".concat(E.menuItem),o({paddingTop:0,paddingBottom:0,"&:not(:last-child)":{borderBottom:"1px solid var(--color-divider, rgba(145 160 170 / 10%))"}},".MuiSvgIcon-root",{fontSize:16})),".".concat(E.menuItemInner),{width:"100%",display:"flex",alignItems:"center",justifyContent:"space-between",gap:n.spacing(1),paddingTop:n.spacing(.75),paddingBottom:n.spacing(.75)})});export{_ as FilterSortStyled,O as createFilterSort,E as filterSortClasses,T as getSortDirectionIcon,F as getSortDirectionLabel,N as mapSortDirectionIcon,B 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 const slotsProps = { ...props.slots, rootProps: { ...props.slots?.rootProps, sx: { ...props.sx, ...props.slots?.rootProps?.sx } } }\r\n return Object.assign({ popperProps: {}, rootProps: {} }, config, slotsProps)\r\n }, [props.slots, props.sx])\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} 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","_props$slots","_props$slots2","slotsProps","_objectSpread","slots","rootProps","sx","assign","popperProps","handleClose","ClickAwayListener","onClickAway","children","_jsxs","FilterSortStyled","className","root","Tooltip","arrow","IconButton","size","ref","onClick","current","Badge","variant","color","invisible","SwapVertIcon","PopperCustom","open","placement","transition","disablePortal","PopperContent","onClose","MenuList","menu","map","_item$label2","isActive","undefined","MenuItem","menuItem","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
|
+
{"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 SwapVertIcon from '@mui/icons-material/SwapVert'\r\nimport ArrowUpwardIcon from '@mui/icons-material/ArrowUpward'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport ArrowDownwardIcon from '@mui/icons-material/ArrowDownward'\r\nimport { KeySpecial } from '../types'\r\nimport { ShufffleIcon } from './units'\r\nimport { useFilterActions } from '../hooks'\r\nimport { mapSpecialLabel } from '../helpers'\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 { TFieldSort, IFilterSortConfig, IFilterSortProps } 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>(config: IFilterSortConfig<T>): TFieldSort<T>[] {\r\n const { fields } = config\r\n const obj = { ...fields }\r\n const options: TFieldSort<T>[] = []\r\n Object.entries(obj).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 { enableShuffle, shufflePosition = 'right' } = config\r\n const classes = filterSortClasses\r\n const options = generateSortOptions(config)\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 hasShuffleSort = obj?.field === KeySpecial.sortShuffle\r\n const hasSort = Boolean(obj?.field) && !hasShuffleSort\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, hasShuffleSort, title }\r\n }, [getSort])\r\n\r\n const mergedSlots = useMemo(() => {\r\n const slotsProps = { ...props.slots, rootProps: { ...props.slots?.rootProps, sx: { ...props.sx, ...props.slots?.rootProps?.sx } } }\r\n return Object.assign({ popperProps: {}, rootProps: {} }, config, slotsProps)\r\n }, [props.slots, props.sx])\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 handleRemoveSort = () => {\r\n handleClose()\r\n setTimeout(() => {\r\n removeSort()\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={handleRemoveSort}>\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 const renderShuffleIcon = () => {\r\n if (!enableShuffle) return null\r\n const title = mapSpecialLabel[KeySpecial.sortShuffle]\r\n const suffix = sortInfo?.hasShuffleSort ? 'ON' : 'OFF'\r\n const color = sortInfo?.hasShuffleSort ? 'primary' : 'default'\r\n return (\r\n <Tooltip title={`${title} - ${suffix}`} arrow placement='top'>\r\n <IconButton color={color} size='small' onClick={() => changeSort(KeySpecial.sortShuffle)} {...mergedSlots.buttonShuffleProps}>\r\n <Badge variant='dot' color='primary' invisible={!sortInfo?.hasShuffleSort}>\r\n <ShufffleIcon fontSize='small' />\r\n </Badge>\r\n </IconButton>\r\n </Tooltip>\r\n )\r\n }\r\n\r\n return (\r\n <>\r\n {shufflePosition === 'left' && renderShuffleIcon()}\r\n <ClickAwayListener onClickAway={handleClose}>\r\n <FilterSortStyled className={classes.root} {...mergedSlots.rootProps}>\r\n <Tooltip title={sortInfo?.title} arrow placement='top'>\r\n <IconButton size='small' ref={refButton} onClick={handleOpen} {...mergedSlots.buttonSortProps}>\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 {shufflePosition === 'right' && renderShuffleIcon()}\r\n </>\r\n )\r\n }\r\n\r\n return FilterSort\r\n}\r\n\r\n//#region 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//#endregion\r\n"],"names":["mapSortDirectionLabel","asc","desc","getSortDirectionLabel","direction","mapSortDirectionIcon","_jsx","ArrowUpwardIcon","fontSize","ArrowDownwardIcon","getSortDirectionIcon","createFilterSort","config","enableShuffle","_config$shufflePositi","shufflePosition","classes","filterSortClasses","options","fields","obj","_objectSpread","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","hasShuffleSort","KeySpecial","sortShuffle","hasSort","item","toString","title","concat","mergedSlots","_props$slots","_props$slots2","slotsProps","slots","rootProps","sx","assign","popperProps","handleClose","handleRemoveSort","setTimeout","renderShuffleIcon","mapSpecialLabel","suffix","color","Tooltip","arrow","placement","children","IconButton","size","onClick","buttonShuffleProps","Badge","variant","invisible","ShufffleIcon","_jsxs","_Fragment","ClickAwayListener","onClickAway","FilterSortStyled","className","root","ref","current","buttonSortProps","SwapVertIcon","PopperCustom","open","transition","disablePortal","PopperContent","onClose","MenuList","menu","map","_item$label2","isActive","undefined","MenuItem","menuItem","justifyContent","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 l}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useContext as o,useMemo as a}from"react";import{styled as i,iconButtonClasses as n,buttonClasses as c,Collapse as s,Box as u,Button as m,IconButton as d}from"@mui/material";import p from"@mui/icons-material/ClearAll";import{KeySpecial as f}from"../types.js";import{useFilterActions as b}from"
|
|
1
|
+
import{defineProperty as r,objectSpread2 as l}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useContext as o,useMemo as a}from"react";import{styled as i,iconButtonClasses as n,buttonClasses as c,Collapse as s,Box as u,Button as m,IconButton as d}from"@mui/material";import p from"@mui/icons-material/ClearAll";import{KeySpecial as f}from"../types.js";import{useFilterActions as b}from"../hooks.js";import{mapSpecialLabel as h}from"../helpers.js";import{createChipViewers as g}from"./chip-viewer.js";import{FilterBarContext as v}from"../index.context.js";function x(r){var i=k,n=g();return function(c){var g=o(v),x=g.filterState,k=b(g),C=a(function(){return function(r,e){var t,o=r.fields,a=r.enableQuickSearch,i=void 0===a||a,n=l({},o),c=f.quickSearch;return i?n[c]?null!==(t=n[c])&&void 0!==t&&t.label||(n[c]=l(l({},n[c]),{},{label:h[c]})):n[c]={label:h[c]}:delete n[c],Object.keys(e||{}).reduce(function(r,l){var t,o=null==n?void 0:n[l],a=(null==o?void 0:o.label)||l.toString(),i=null==e||null===(t=e[l])||void 0===t?void 0:t.values,c=(Array.isArray(i)?i:[]).filter(Boolean).map(function(r){return{value:r.toString()}});return c.length>0&&r.push({field:l,label:a,items:c}),r},[]).sort(function(r,l){return r.field===c?-1:l.field===c?1:0})}(r,x.storeFilter)},[x,r]);return e(s,{in:C.length>0,timeout:"auto",unmountOnExit:!0,children:t(y,{className:i.root,sx:c.sx,children:[e("div",{className:i.scrollHorizontal,children:e(n.Group,{label:"Filters",value:C,placement:"horizontal",onRemove:k.removeFilterByFieldValue})}),t(u,{children:[e(m,{size:"small",color:"error",variant:"text",onClick:k.clearAllFilters,className:i.buttonClearAll,startIcon:e(p,{}),"aria-label":"Clear all filters",children:"Clear All"}),e(d,{size:"small",color:"error",onClick:k.clearAllFilters,className:i.buttonClearAll,"aria-label":"Clear all filters",children:e(p,{})})]})]})})}}var k={root:"DinoFilterSummary-root",scrollHorizontal:"DinoFilterSummary-scrollHorizontal",buttonClearAll:"DinoFilterSummary-buttonClearAll"},y=i("div")(function(l){var e=l.theme;return r(r(r({},"&.".concat(k.root),{display:"flex",alignItems:"center",paddingLeft:e.spacing(1),paddingRight:e.spacing(.5)}),".".concat(k.scrollHorizontal),{overflowX:"auto",overflowY:"hidden",WebkitOverflowScrolling:"touch",scrollbarHeight:"thin",display:"flex",flexWrap:"nowrap",minWidth:0,flex:1,"& > *":{minWidth:"max-content",flexShrink:0},"&::-webkit-scrollbar":{height:"8px",background:"transparent"},"&::-webkit-scrollbar-thumb":{background:e.palette.grey[300],borderRadius:"8px",minHeight:"8px",transition:"background 0.2s"},"&::-webkit-scrollbar-thumb:hover":{background:e.palette.primary.light},"&::-webkit-scrollbar-track":{background:e.palette.grey[100],borderRadius:"8px"},scrollbarColor:"".concat(e.palette.grey[300]," ").concat(e.palette.grey[100]),scrollbarWidth:"thin"}),".".concat(k.buttonClearAll),r(r(r({marginLeft:e.spacing(1)},"&:not(.".concat(n.root,")"),{textTransform:"none",fontWeight:500,lineHeight:2,padding:e.spacing(0,1)}),"&.".concat(n.root),{display:"none"}),e.breakpoints.down("md"),r(r({},"&.".concat(c.root),{display:"none"}),"&.".concat(n.root),{display:"flex"})))});export{x as createFilterSummary};
|
|
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 { useContext, useMemo } from 'react'\r\nimport { Box, Button, buttonClasses, Collapse, IconButton, iconButtonClasses, styled } from '@mui/material'\r\nimport ClearAllIcon from '@mui/icons-material/ClearAll'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from './hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { createChipViewers } from './chip-viewer'\r\nimport { FilterBarContext } from '../index.context'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { TFieldStore, TFieldValid } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IChipViewerItem, TChipViewerGroup } from './chip-viewer'\r\nimport type { IFilterSummaryConfig, IFilterSummaryProps, TFieldSummaryConfigs } from './filter-summary.types'\r\n\r\nfunction mapFilterStateToFilterData<T>(config: IFilterSummaryConfig<T>, store?: TFieldStore<T>): TChipViewerGroup<T>[] {\r\n const { fields, enableQuickSearch = true } = config\r\n\r\n // Ensure 'quickSearch' is always included in the summary, even if it's not in the config or store\r\n // If enableQuickSearch is false, it will not be added to the summary or removed if it exists in the config\r\n const mergedConfig: TFieldSummaryConfigs<T> = { ...fields }\r\n const qsKey = KeySpecial.quickSearch\r\n if (enableQuickSearch) {\r\n if (!mergedConfig[qsKey]) {\r\n mergedConfig[qsKey] = { label: mapSpecialLabel[qsKey] }\r\n } else if (!mergedConfig[qsKey]?.label) {\r\n mergedConfig[qsKey] = { ...mergedConfig[qsKey], label: mapSpecialLabel[qsKey] }\r\n }\r\n } else {\r\n delete mergedConfig[qsKey]\r\n }\r\n\r\n const keys = Object.keys(store || {}) as (keyof TFieldStore<T>)[]\r\n const groups = keys.reduce<TChipViewerGroup<T>[]>((acc, key) => {\r\n const fieldConfig = mergedConfig?.[key]\r\n const label = fieldConfig?.label || key.toString()\r\n const values = store?.[key]?.values as TFieldValid[] | undefined\r\n const items = Array.isArray(values) ? values : []\r\n const summaryItems = items.filter(Boolean).map<IChipViewerItem<T>>((item) => ({ value: item.toString() }))\r\n if (summaryItems.length > 0) {\r\n acc.push({ field: key, label, items: summaryItems })\r\n }\r\n return acc\r\n }, [])\r\n const finalGroups = groups.sort((a, b) => {\r\n if (a.field === qsKey) return -1\r\n if (b.field === qsKey) return 1\r\n return 0\r\n })\r\n return finalGroups\r\n}\r\n\r\nexport function createFilterSummary<T>(config: IFilterSummaryConfig<T>) {\r\n const classes = filterSummaryClasses\r\n const ChipViewers = createChipViewers<T>()\r\n\r\n const FilterSummary: FC<IFilterSummaryProps<T>> = (props) => {\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const { filterState } = context\r\n const filterActions = useFilterActions<T>(context)\r\n\r\n const filterData = useMemo(() => {\r\n return mapFilterStateToFilterData(config, filterState.storeFilter)\r\n }, [filterState, config])\r\n\r\n // Old logic to calculate filterData, now moved to useMemo above\r\n // if (filterData.length === 0) return null\r\n\r\n return (\r\n <Collapse in={filterData.length > 0} timeout='auto' unmountOnExit>\r\n <FilterSummaryStyled className={classes.root} sx={props.sx}>\r\n <div className={classes.scrollHorizontal}>\r\n <ChipViewers.Group label='Filters' value={filterData} placement='horizontal' onRemove={filterActions.removeFilterByFieldValue} />\r\n </div>\r\n <Box>\r\n <Button\r\n size='small'\r\n color='error'\r\n variant='text'\r\n onClick={filterActions.clearAllFilters}\r\n className={classes.buttonClearAll}\r\n startIcon={<ClearAllIcon />}\r\n aria-label='Clear all filters'\r\n >\r\n Clear All\r\n </Button>\r\n <IconButton\r\n size='small'\r\n color='error'\r\n onClick={filterActions.clearAllFilters}\r\n className={classes.buttonClearAll}\r\n aria-label='Clear all filters'\r\n >\r\n <ClearAllIcon />\r\n </IconButton>\r\n </Box>\r\n </FilterSummaryStyled>\r\n </Collapse>\r\n )\r\n }\r\n\r\n return FilterSummary\r\n}\r\n\r\nconst filterSummaryClasses = {\r\n root: 'DinoFilterSummary-root',\r\n scrollHorizontal: 'DinoFilterSummary-scrollHorizontal',\r\n fieldItem: 'DinoFilterSummary-fieldItem',\r\n fieldLabel: 'DinoFilterSummary-fieldLabel',\r\n fieldValue: 'DinoFilterSummary-fieldValue',\r\n buttonClearAll: 'DinoFilterSummary-buttonClearAll'\r\n}\r\n\r\nconst FilterSummaryStyled = styled('div')(({ theme }) => ({\r\n [`&.${filterSummaryClasses.root}`]: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n paddingLeft: theme.spacing(1),\r\n paddingRight: theme.spacing(0.5)\r\n },\r\n [`.${filterSummaryClasses.scrollHorizontal}`]: {\r\n overflowX: 'auto',\r\n overflowY: 'hidden',\r\n WebkitOverflowScrolling: 'touch',\r\n scrollbarHeight: 'thin',\r\n // The content doesn't wrap to the next line and is wider than the container, displaying a horizontal scroll bar.\r\n display: 'flex',\r\n flexWrap: 'nowrap',\r\n minWidth: 0,\r\n flex: 1,\r\n '& > *': { minWidth: 'max-content', flexShrink: 0 },\r\n // Custom scrollbar\r\n '&::-webkit-scrollbar': { height: '8px', background: 'transparent' },\r\n '&::-webkit-scrollbar-thumb': {\r\n background: theme.palette.grey[300],\r\n borderRadius: '8px',\r\n minHeight: '8px',\r\n transition: 'background 0.2s'\r\n },\r\n '&::-webkit-scrollbar-thumb:hover': { background: theme.palette.primary.light },\r\n '&::-webkit-scrollbar-track': { background: theme.palette.grey[100], borderRadius: '8px' },\r\n // Firefox\r\n scrollbarColor: `${theme.palette.grey[300]} ${theme.palette.grey[100]}`,\r\n scrollbarWidth: 'thin'\r\n },\r\n [`.${filterSummaryClasses.buttonClearAll}`]: {\r\n marginLeft: theme.spacing(1),\r\n [`&:not(.${iconButtonClasses.root})`]: {\r\n textTransform: 'none',\r\n fontWeight: 500,\r\n lineHeight: 2,\r\n padding: theme.spacing(0, 1)\r\n },\r\n [`&.${iconButtonClasses.root}`]: { display: 'none' },\r\n [theme.breakpoints.down('md')]: {\r\n [`&.${buttonClasses.root}`]: { display: 'none' },\r\n [`&.${iconButtonClasses.root}`]: { display: 'flex' }\r\n }\r\n }\r\n}))\r\n"],"names":["createFilterSummary","config","classes","filterSummaryClasses","ChipViewers","createChipViewers","props","context","useContext","FilterBarContext","filterState","filterActions","useFilterActions","filterData","useMemo","store","_mergedConfig$qsKey","fields","_config$enableQuickSe","enableQuickSearch","mergedConfig","_objectSpread","qsKey","KeySpecial","quickSearch","label","mapSpecialLabel","Object","keys","reduce","acc","key","_store$key","fieldConfig","toString","values","summaryItems","Array","isArray","filter","Boolean","map","item","value","length","push","field","items","sort","a","b","mapFilterStateToFilterData","storeFilter","_jsx","Collapse","in","timeout","unmountOnExit","children","_jsxs","FilterSummaryStyled","className","root","sx","scrollHorizontal","Group","placement","onRemove","removeFilterByFieldValue","Box","Button","size","color","variant","onClick","clearAllFilters","buttonClearAll","startIcon","ClearAllIcon","IconButton","styled","_ref","theme","_defineProperty","concat","display","alignItems","paddingLeft","spacing","paddingRight","overflowX","overflowY","WebkitOverflowScrolling","scrollbarHeight","flexWrap","minWidth","flex","flexShrink","height","background","palette","grey","borderRadius","minHeight","transition","primary","light","scrollbarColor","scrollbarWidth","marginLeft","iconButtonClasses","textTransform","fontWeight","lineHeight","padding","breakpoints","down","buttonClasses"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"filter-summary.js","sources":["../../../../src/filter-bar/components/filter-summary.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useContext, useMemo } from 'react'\r\nimport { Box, Button, buttonClasses, Collapse, IconButton, iconButtonClasses, styled } from '@mui/material'\r\nimport ClearAllIcon from '@mui/icons-material/ClearAll'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from '../hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { createChipViewers } from './chip-viewer'\r\nimport { FilterBarContext } from '../index.context'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { TFieldStore, TFieldValid } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IChipViewerItem, TChipViewerGroup } from './chip-viewer'\r\nimport type { IFilterSummaryConfig, IFilterSummaryProps, TFieldSummaryConfigs } from './filter-summary.types'\r\n\r\nfunction mapFilterStateToFilterData<T>(config: IFilterSummaryConfig<T>, store?: TFieldStore<T>): TChipViewerGroup<T>[] {\r\n const { fields, enableQuickSearch = true } = config\r\n\r\n // Ensure 'quickSearch' is always included in the summary, even if it's not in the config or store\r\n // If enableQuickSearch is false, it will not be added to the summary or removed if it exists in the config\r\n const mergedConfig: TFieldSummaryConfigs<T> = { ...fields }\r\n const qsKey = KeySpecial.quickSearch\r\n if (enableQuickSearch) {\r\n if (!mergedConfig[qsKey]) {\r\n mergedConfig[qsKey] = { label: mapSpecialLabel[qsKey] }\r\n } else if (!mergedConfig[qsKey]?.label) {\r\n mergedConfig[qsKey] = { ...mergedConfig[qsKey], label: mapSpecialLabel[qsKey] }\r\n }\r\n } else {\r\n delete mergedConfig[qsKey]\r\n }\r\n\r\n const keys = Object.keys(store || {}) as (keyof TFieldStore<T>)[]\r\n const groups = keys.reduce<TChipViewerGroup<T>[]>((acc, key) => {\r\n const fieldConfig = mergedConfig?.[key]\r\n const label = fieldConfig?.label || key.toString()\r\n const values = store?.[key]?.values as TFieldValid[] | undefined\r\n const items = Array.isArray(values) ? values : []\r\n const summaryItems = items.filter(Boolean).map<IChipViewerItem<T>>((item) => ({ value: item.toString() }))\r\n if (summaryItems.length > 0) {\r\n acc.push({ field: key, label, items: summaryItems })\r\n }\r\n return acc\r\n }, [])\r\n const finalGroups = groups.sort((a, b) => {\r\n if (a.field === qsKey) return -1\r\n if (b.field === qsKey) return 1\r\n return 0\r\n })\r\n return finalGroups\r\n}\r\n\r\nexport function createFilterSummary<T>(config: IFilterSummaryConfig<T>) {\r\n const classes = filterSummaryClasses\r\n const ChipViewers = createChipViewers<T>()\r\n\r\n const FilterSummary: FC<IFilterSummaryProps<T>> = (props) => {\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const { filterState } = context\r\n const filterActions = useFilterActions<T>(context)\r\n\r\n const filterData = useMemo(() => {\r\n return mapFilterStateToFilterData(config, filterState.storeFilter)\r\n }, [filterState, config])\r\n\r\n // Old logic to calculate filterData, now moved to useMemo above\r\n // if (filterData.length === 0) return null\r\n\r\n return (\r\n <Collapse in={filterData.length > 0} timeout='auto' unmountOnExit>\r\n <FilterSummaryStyled className={classes.root} sx={props.sx}>\r\n <div className={classes.scrollHorizontal}>\r\n <ChipViewers.Group label='Filters' value={filterData} placement='horizontal' onRemove={filterActions.removeFilterByFieldValue} />\r\n </div>\r\n <Box>\r\n <Button\r\n size='small'\r\n color='error'\r\n variant='text'\r\n onClick={filterActions.clearAllFilters}\r\n className={classes.buttonClearAll}\r\n startIcon={<ClearAllIcon />}\r\n aria-label='Clear all filters'\r\n >\r\n Clear All\r\n </Button>\r\n <IconButton\r\n size='small'\r\n color='error'\r\n onClick={filterActions.clearAllFilters}\r\n className={classes.buttonClearAll}\r\n aria-label='Clear all filters'\r\n >\r\n <ClearAllIcon />\r\n </IconButton>\r\n </Box>\r\n </FilterSummaryStyled>\r\n </Collapse>\r\n )\r\n }\r\n\r\n return FilterSummary\r\n}\r\n\r\nconst filterSummaryClasses = {\r\n root: 'DinoFilterSummary-root',\r\n scrollHorizontal: 'DinoFilterSummary-scrollHorizontal',\r\n fieldItem: 'DinoFilterSummary-fieldItem',\r\n fieldLabel: 'DinoFilterSummary-fieldLabel',\r\n fieldValue: 'DinoFilterSummary-fieldValue',\r\n buttonClearAll: 'DinoFilterSummary-buttonClearAll'\r\n}\r\n\r\nconst FilterSummaryStyled = styled('div')(({ theme }) => ({\r\n [`&.${filterSummaryClasses.root}`]: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n paddingLeft: theme.spacing(1),\r\n paddingRight: theme.spacing(0.5)\r\n },\r\n [`.${filterSummaryClasses.scrollHorizontal}`]: {\r\n overflowX: 'auto',\r\n overflowY: 'hidden',\r\n WebkitOverflowScrolling: 'touch',\r\n scrollbarHeight: 'thin',\r\n // The content doesn't wrap to the next line and is wider than the container, displaying a horizontal scroll bar.\r\n display: 'flex',\r\n flexWrap: 'nowrap',\r\n minWidth: 0,\r\n flex: 1,\r\n '& > *': { minWidth: 'max-content', flexShrink: 0 },\r\n // Custom scrollbar\r\n '&::-webkit-scrollbar': { height: '8px', background: 'transparent' },\r\n '&::-webkit-scrollbar-thumb': {\r\n background: theme.palette.grey[300],\r\n borderRadius: '8px',\r\n minHeight: '8px',\r\n transition: 'background 0.2s'\r\n },\r\n '&::-webkit-scrollbar-thumb:hover': { background: theme.palette.primary.light },\r\n '&::-webkit-scrollbar-track': { background: theme.palette.grey[100], borderRadius: '8px' },\r\n // Firefox\r\n scrollbarColor: `${theme.palette.grey[300]} ${theme.palette.grey[100]}`,\r\n scrollbarWidth: 'thin'\r\n },\r\n [`.${filterSummaryClasses.buttonClearAll}`]: {\r\n marginLeft: theme.spacing(1),\r\n [`&:not(.${iconButtonClasses.root})`]: {\r\n textTransform: 'none',\r\n fontWeight: 500,\r\n lineHeight: 2,\r\n padding: theme.spacing(0, 1)\r\n },\r\n [`&.${iconButtonClasses.root}`]: { display: 'none' },\r\n [theme.breakpoints.down('md')]: {\r\n [`&.${buttonClasses.root}`]: { display: 'none' },\r\n [`&.${iconButtonClasses.root}`]: { display: 'flex' }\r\n }\r\n }\r\n}))\r\n"],"names":["createFilterSummary","config","classes","filterSummaryClasses","ChipViewers","createChipViewers","props","context","useContext","FilterBarContext","filterState","filterActions","useFilterActions","filterData","useMemo","store","_mergedConfig$qsKey","fields","_config$enableQuickSe","enableQuickSearch","mergedConfig","_objectSpread","qsKey","KeySpecial","quickSearch","label","mapSpecialLabel","Object","keys","reduce","acc","key","_store$key","fieldConfig","toString","values","summaryItems","Array","isArray","filter","Boolean","map","item","value","length","push","field","items","sort","a","b","mapFilterStateToFilterData","storeFilter","_jsx","Collapse","in","timeout","unmountOnExit","children","_jsxs","FilterSummaryStyled","className","root","sx","scrollHorizontal","Group","placement","onRemove","removeFilterByFieldValue","Box","Button","size","color","variant","onClick","clearAllFilters","buttonClearAll","startIcon","ClearAllIcon","IconButton","styled","_ref","theme","_defineProperty","concat","display","alignItems","paddingLeft","spacing","paddingRight","overflowX","overflowY","WebkitOverflowScrolling","scrollbarHeight","flexWrap","minWidth","flex","flexShrink","height","background","palette","grey","borderRadius","minHeight","transition","primary","light","scrollbarColor","scrollbarWidth","marginLeft","iconButtonClasses","textTransform","fontWeight","lineHeight","padding","breakpoints","down","buttonClasses"],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{objectSpread2 as L}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as r}from"react/jsx-runtime";import{SvgIcon as e}from"@mui/material";var i=function(i){return r(e,L(L({viewBox:"0 0 24 24"},i),{},{children:r("path",{"fill-rule":"evenodd",d:"M17.5857864,18 L17,18 C15.0670171,17.9820312 13.8323189,17.4178969 12.7754822,16.1071521 C13.1678375,15.5430536 13.5361529,14.9169672 13.8909426,14.2284294 C14.7312903,15.5397262 15.5623613,15.9865721 17.0093097,16.0000433 L17.5858172,16.0000308 L16.2928932,14.7071068 L17.7071068,13.2928932 L21.4142136,17 L17.7071068,20.7071068 L16.2928932,19.2928932 L17.5857864,18 Z M17.5858172,7.99996921 L17.0093097,7.99995666 C14.98914,8.01876471 14.1694753,8.8823321 12.8489735,11.7638223 C12.7005893,12.0884485 12.6216698,12.260889 12.5477909,12.4205132 C10.7759025,16.2488903 8.96370516,17.9389258 5,18 L3,18 L3,16 L4.98456341,16.0001192 C7.99778944,15.9535997 9.24866011,14.7870513 10.7327652,11.5804646 C10.8045503,11.4253643 10.8813338,11.257591 11.0308005,10.9306074 C12.6437651,7.41092901 13.9561072,6.02829571 17,6 L17.5857864,6 L16.2928932,4.70710678 L17.7071068,3.29289322 L21.4142136,7 L17.7071068,10.7071068 L16.2928932,9.29289322 L17.5858172,7.99996921 Z M9.2967591,9.9151484 C8.25385189,8.57493725 7.02213357,8.03133773 4.98456341,7.99988085 L3,8 L3,6 L5,6 C7.39017643,6.03682871 8.99800451,6.66599321 10.2864139,7.99918708 C9.95038887,8.57240941 9.6245452,9.21039491 9.2967591,9.9151484 Z"})}))};export{i as ShufffleIcon};
|
|
2
|
+
//# sourceMappingURL=units.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"units.js","sources":["../../../../src/filter-bar/components/units.tsx"],"sourcesContent":["import { SvgIcon, SvgIconProps } from '@mui/material'\r\nimport { FC } from 'react'\r\n\r\nconst viewBoxDefault = '0 0 24 24' //'0 -2 27 27'\r\nexport const ShufffleIcon: FC<SvgIconProps> = (props) => (\r\n <SvgIcon viewBox={viewBoxDefault} {...props}>\r\n {/* <g stroke='none' strokeWidth='1' fill='none' fillRule='evenodd'>\r\n <g transform='translate(-362.000000, -623.000000)' fill='currentColor' fillRule='nonzero'>\r\n <path d='M384.528,638.166 C384.23,637.871 383.299,637.948 383,638.244 L383,641 L379,641 L375.465,636.161 L374.207,637.792 L378,642.909 L383,642.909 L383,645.781 C383.299,646.076 384.23,645.945 384.528,645.649 L388.771,642.442 C389.069,642.147 389.069,641.669 388.771,641.373 L384.528,638.166 L384.528,638.166 Z M383,628 L383,630.688 C383.299,630.982 384.23,631.105 384.528,630.811 L388.771,627.604 C389.069,627.308 389.069,626.829 388.771,626.534 L384.528,623.326 C384.23,623.031 383.299,622.861 383,623.156 L383,626 L378,626 L367,641 L363,641 C362.447,641 362,641.373 362,641.92 C362,642.466 362.447,643 363,643 L368,643 L379,628 L383,628 L383,628 Z M363,628 L367,628 L370.508,632.803 L371.766,631.172 C371.766,631.172 368.254,626.323 368,626 L363,626 C362.447,626 362,626.534 362,627.08 C362,627.627 362.447,628 363,628 L363,628 Z' />\r\n </g>\r\n </g> */}\r\n <path\r\n fill-rule='evenodd'\r\n d='M17.5857864,18 L17,18 C15.0670171,17.9820312 13.8323189,17.4178969 12.7754822,16.1071521 C13.1678375,15.5430536 13.5361529,14.9169672 13.8909426,14.2284294 C14.7312903,15.5397262 15.5623613,15.9865721 17.0093097,16.0000433 L17.5858172,16.0000308 L16.2928932,14.7071068 L17.7071068,13.2928932 L21.4142136,17 L17.7071068,20.7071068 L16.2928932,19.2928932 L17.5857864,18 Z M17.5858172,7.99996921 L17.0093097,7.99995666 C14.98914,8.01876471 14.1694753,8.8823321 12.8489735,11.7638223 C12.7005893,12.0884485 12.6216698,12.260889 12.5477909,12.4205132 C10.7759025,16.2488903 8.96370516,17.9389258 5,18 L3,18 L3,16 L4.98456341,16.0001192 C7.99778944,15.9535997 9.24866011,14.7870513 10.7327652,11.5804646 C10.8045503,11.4253643 10.8813338,11.257591 11.0308005,10.9306074 C12.6437651,7.41092901 13.9561072,6.02829571 17,6 L17.5857864,6 L16.2928932,4.70710678 L17.7071068,3.29289322 L21.4142136,7 L17.7071068,10.7071068 L16.2928932,9.29289322 L17.5858172,7.99996921 Z M9.2967591,9.9151484 C8.25385189,8.57493725 7.02213357,8.03133773 4.98456341,7.99988085 L3,8 L3,6 L5,6 C7.39017643,6.03682871 8.99800451,6.66599321 10.2864139,7.99918708 C9.95038887,8.57240941 9.6245452,9.21039491 9.2967591,9.9151484 Z'\r\n />\r\n </SvgIcon>\r\n)\r\n"],"names":["ShufffleIcon","props","_jsx","SvgIcon","_objectSpread","viewBox","children","d"],"mappings":"+JAGA,IACaA,EAAiC,SAACC,GAAK,OAClDC,EAACC,EAAOC,EAAAA,EAAA,CAACC,QAFY,aAEiBJ,GAAK,GAAA,CAMzCK,SAAAJ,EAAA,OAAA,CAAA,YACY,UACVK,EAAE,irCAEI"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createClass as t,classCallCheck as
|
|
1
|
+
import{createClass as t,classCallCheck as e,defineProperty as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{KeySpecial as i}from"./types.js";import{createRequestBuilder as l}from"../http-service/graphql/request-param.js";import{getSeedFromURL as o,setSeedToURL as n,removeSeedFromURL as a}from"./helpers.js";var u=function(t){return"or"===t?"Or":"And"},s=function(t){return"asc"===t?"ASC":"DESC"},f=function(){return t(function t(i){var o=this;e(this,t),r(this,"graphqlBuilder",l({ignoreEmpty:!0})),r(this,"autoMap",function(t){(o.currentObjectMap=t,o.state.storeFilter)&&Object.keys(o.state.storeFilter).forEach(function(e){var r,i=t[e],l=null===(r=o.state.storeFilter)||void 0===r?void 0:r[e];if(i){var n=i.targetfield,a=i.operation;if(i.custom)return void i.custom(o.graphqlBuilder,l,o.state.storeFilter);"equal"===a?o.fillterEqual(e,n):"contains"===a&&o.fillterContains(e,n)}});return o}),r(this,"prebuild",function(t){return o.prebuildFunc=t,o}),this.state=i},[{key:"filterScope",value:function(t,e){var r=this;if(this.state.storeFilter){var i=(null==e?void 0:e.logic)||this.state.filterLogic||"and",l=u(i);this.graphqlBuilder.scope(function(e){return t(e,r.state.storeFilter),e},{logic:l})}return this}},{key:"fillterEqual",value:function(t,e,r){var i,l,o=null!==(i=null===(l=this.state.storeFilter)||void 0===l?void 0:l[t])&&void 0!==i?i:{values:[]},n=Array.isArray(o.values)?o.values:[o.values];if(!n||n.length<1||!e)return this;var a=u(o.logic);return this.filterScope(function(t,r){for(var i=0;i<n.length;i++){var l=n[i];"string"==typeof l?t.filter(e,l,{logic:a}):("number"==typeof l||"boolean"==typeof l)&&t.filter(e,l.toString(),{logic:a})}},r),this}},{key:"fillterContains",value:function(t,e,r){var i,l,o=null!==(i=null===(l=this.state.storeFilter)||void 0===l?void 0:l[t])&&void 0!==i?i:{values:[]},n=Array.isArray(o.values)?o.values:[o.values];if(!n||n.length<1||!e)return this;var a=u(o.logic);return this.filterScope(function(t){for(var r=0;r<n.length;r++){var i=n[r];"string"==typeof i?t.filterContains(e,i,{logic:a}):("number"==typeof i||"boolean"==typeof i)&&t.filter(e,i.toString(),{logic:a})}},r),this}},{key:"sort",value:function(t){var e,r,l=this.state.storeSort,u=null!==(e=null==t?void 0:t.seed)&&void 0!==e?e:{},f=u.targetField,c=u.autoSave,v=void 0!==c&&c,h=f?null===(r=this.currentObjectMap)||void 0===r?void 0:r[f]:void 0,d=o();if((null==l?void 0:l.field)===i.sortShuffle){if(null==h||!h.targetfield)return this;var p=null!=d?d:(new Date).getTime().toString();this.graphqlBuilder.seed(h.targetfield,p),v&&n(p)}else{var g;d&&a();var y=null!=l&&l.field?null===(g=this.currentObjectMap)||void 0===g?void 0:g[null==l?void 0:l.field]:void 0;if(null==y||!y.targetfield)return this;this.graphqlBuilder.sort(y.targetfield,{direction:s(null==l?void 0:l.direction)})}return this}},{key:"quickSearch",value:function(t){var e,r,i=this;this.currentObjectMap||console.warn("No autoMap config found, quick search will not work properly without target field mapping.");var l=null!==(e=null===(r=this.state.storeFilter)||void 0===r?void 0:r.quickSearch)&&void 0!==e?e:{values:[],logic:"or"},o=Array.isArray(l.values)?l.values:[l.values];if(!o||o.length<1)return this;var n=u(l.logic),a=Array.isArray(t)?t:[t];return this.filterScope(function(t){a.forEach(function(e){var r,a=null===(r=i.currentObjectMap)||void 0===r?void 0:r[e];if(a&&o&&o.length>0)if(a.custom)a.custom(t,l,i.state.storeFilter);else if(a.targetfield)for(var u=0;u<o.length;u++){var s=o[u];"string"==typeof s?t.filterContains(a.targetfield,s,{logic:n}):("number"==typeof s||"boolean"==typeof s)&&t.filter(a.targetfield,s.toString(),{logic:n})}})}),this}},{key:"build",value:function(){return this.prebuildFunc&&this.prebuildFunc(this.graphqlBuilder),this.graphqlBuilder.build()}}])}(),c=function(t){return new f(t)};export{f as TableFileterConverter,c as createConvertToGraphQL,u as mapLogic,s as mapSortDirection};
|
|
2
2
|
//# sourceMappingURL=convert-to-graphql.js.map
|