dinocollab-core 2.2.4 → 2.2.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. package/dist/lab/data-surface/index.js +1 -1
  2. package/dist/src/filter-bar/components/filter-input.js +1 -1
  3. package/dist/src/filter-bar/components/filter-input.js.map +1 -1
  4. package/dist/src/filter-bar/components/filter-input.mobile.js +2 -0
  5. package/dist/src/filter-bar/components/filter-input.mobile.js.map +1 -0
  6. package/dist/src/filter-bar/components/filter-input.units.js +1 -1
  7. package/dist/src/filter-bar/components/filter-input.units.js.map +1 -1
  8. package/dist/src/filter-bar/components/filter-summary.js +1 -1
  9. package/dist/src/filter-bar/components/filter-summary.js.map +1 -1
  10. package/dist/src/filter-bar/helpers.js +1 -1
  11. package/dist/src/filter-bar/helpers.js.map +1 -1
  12. package/dist/src/filter-bar/index.create.js +1 -1
  13. package/dist/src/filter-bar/index.create.js.map +1 -1
  14. package/dist/src/filter-bar/index.dino.js +1 -1
  15. package/dist/src/filter-bar/index.dino.js.map +1 -1
  16. package/dist/src/lab/data-surface/button-switch.js +1 -1
  17. package/dist/src/lab/data-surface/button-switch.js.map +1 -1
  18. package/dist/src/lab/data-surface/index.dino.js +1 -1
  19. package/dist/src/lab/data-surface/index.dino.js.map +1 -1
  20. package/dist/types/filter-bar/components/filter-input.d.ts +1 -0
  21. package/dist/types/filter-bar/components/filter-input.mobile.d.ts +7 -0
  22. package/dist/types/filter-bar/components/filter-input.types.d.ts +6 -2
  23. package/dist/types/filter-bar/components/filter-input.units.d.ts +4 -1
  24. package/dist/types/filter-bar/helpers.d.ts +5 -0
  25. package/dist/types/filter-bar/index.create.d.ts +2 -38
  26. package/dist/types/filter-bar/index.dino.d.ts +2 -1
  27. package/dist/types/lab/data-surface/button-switch.d.ts +3 -3
  28. package/dist/types/lab/data-surface/index.d.ts +1 -0
  29. package/dist/types/lab/data-surface/index.dino.d.ts +2 -16
  30. package/package.json +1 -1
@@ -1,2 +1,2 @@
1
- export{DataSurfaceViewMode,LoadingModeRule,RenderStrategyRule}from"../../src/lab/data-surface/types.js";export{getPaginationFromURL,getViewModeFromURL,setPaginationToURL,setViewModeToURL}from"../../src/lab/data-surface/helpers.js";export{createDataSurface}from"../../src/lab/data-surface/index.create.js";export{ListDensity}from"../../src/lab/data-surface/view-list.types.js";export{DinoDataSurFace,dinoDataSurface}from"../../src/lab/data-surface/index.dino.js";
1
+ export{DataSurfaceViewMode,LoadingModeRule,RenderStrategyRule}from"../../src/lab/data-surface/types.js";export{getPaginationFromURL,getViewModeFromURL,setPaginationToURL,setViewModeToURL}from"../../src/lab/data-surface/helpers.js";export{createDataSurface}from"../../src/lab/data-surface/index.create.js";export{ListDensity}from"../../src/lab/data-surface/view-list.types.js";export{DinoDataSurFace,dinoDataSurface}from"../../src/lab/data-surface/index.dino.js";export{ButtonSwitch}from"../../src/lab/data-surface/button-switch.js";
2
2
  //# sourceMappingURL=index.js.map
@@ -1,2 +1,2 @@
1
- import{defineProperty as e,objectSpread2 as o,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,InputBase as p,MenuList as d,MenuItem as f,Typography as m}from"@mui/material";import v from"@mui/material/ClickAwayListener";import{KeySpecial as h}from"../types.js";import{useFilterActions as b}from"./hooks.js";import{mapSpecialLabel as g}from"../helpers.js";import{FilterBarContext as I}from"../index.context.js";import{PopperCustom as x,PopperContent as y}from"./popper-custom.js";import{InputAdornmentRight as S,getFieldsByMatches as F}from"./filter-input.units.js";function j(e){var c=C,j=function(e){var r=e.fields,t=e.enableQuickSearch,n=void 0===t||t,i=h.quickSearch,l=o({},r);if(n){var a=l[i],u=null!=a&&a.label?a.label:g[i],c=Object.assign({},l[i],{field:i,label:u});l[i]=c}else delete l[i];return o(o({},e),{},{fields:l})}(e);return function(h){var g,C,D,w,B,N=u(),P=u(),A=i(I),q=b(A),O=q.addFilter,R=q.replaceFilter,W=l(null),z=r(W,2),K=z[0],T=z[1],_=Boolean(K),E=l(""),G=r(E,2),H=G[0],L=G[1],M=l("normal"),Q=r(M,2),V=Q[0],J=Q[1],U=a(function(){var o=e.beforeInput,r=e.afterInput;return{slots:Object.assign({},{beforeInput:o,afterInput:r},h.slots)}},[]),X=function(e){T(null),J("normal"),e&&L("")},Y=function(){var e;if(H){var o=null===(e=A.filterState.storeFilter)||void 0===e?void 0:e.quickSearch,r=(null==o?void 0:o.logic)||"or";R("quickSearch",{values:[H],logic:r}),X(!0)}},Z=[c.root];return("focus"===V||Boolean(H))&&Z.push(c.focus),t(v,{onClickAway:function(){return X()},children:n(k,o(o({className:Z.join(" ")},null===(g=h.slots)||void 0===g?void 0:g.rootProps),{},{children:[n("div",{className:c.rootInner,children:[(null===(C=U.slots)||void 0===C?void 0:C.beforeInput)||null,t(s,{className:c.beforeInput,ref:P}),t(p,{fullWidth:!0,className:c.input,autoComplete:"off",size:"small",inputRef:N,value:H,placeholder:"Search...",onKeyDown:function(e){var o=e.keyCode;if(13===o)e.stopPropagation(),e.preventDefault(),Y();else if(27===o){var r;e.stopPropagation(),e.preventDefault(),null==N||null===(r=N.current)||void 0===r||r.blur(),X(!0)}},onChange:function(e){var o=e.target.value||"";L(o);var r=Boolean(null==P?void 0:P.current)&&Boolean(o);o!==H&&T(r&&(null==P?void 0:P.current)||null)},onFocus:function(e){J("focus"),Boolean(H)&&T((null==P?void 0:P.current)||e.currentTarget)},endAdornment:t(S,{hasKeyword:Boolean(H),onSubmit:Y,onClear:function(){return X(!0)},onSearch:function(){var e;null===(e=N.current)||void 0===e||e.focus()}})}),(null===(D=U.slots)||void 0===D?void 0:D.afterInput)||null]}),t(x,o(o({anchorEl:K,open:_,placement:"bottom",transition:!0,disablePortal:!0},null===(w=U.slots)||void 0===w?void 0:w.popperProps),{},{children:(B=F(j,H),t(y,{title:"Filter Options",disableGutter:!0,onClose:function(){return T(null)},children:t(d,{className:c.menu,children:B.map(function(o,r){var t,i=o.field;if(!o)return null;var l=null!==(t=o.label)&&void 0!==t?t:i.toString(),a="".concat(l,': "').concat(H,'"');return n(f,{title:a,onClick:function(){return function(o){var r;if(H){var t=e.fields[o],n=null===(r=A.filterState.storeFilter)||void 0===r?void 0:r[o],i=(null==n?void 0:n.logic)||"or";null!=t&&t.singleValue?R(o,{values:[H],logic:i}):O(o,{values:[H],logic:i}),X(!0)}}(i)},className:c.menuItem,children:[n(m,{variant:"body2",sx:{fontWeight:500,flex:"0 0 auto"},children:[l,":"]}),n(m,{className:"",variant:"body2",color:"text.secondary",sx:{ml:1,flex:"1 1 auto"},noWrap:!0,children:['"',H,'"']})]},i.toString()+r)})})}))}))]}))})}}var C={root:"DinoFilterInput-root",rootInner:"DinoFilterInput-rootInner",input:"DinoFilterInput-input",focus:"DinoFilterInput-focus",beforeInput:"DinoFilterInput-beforeInput",menu:"DinoFilterInput-menu",menuItem:"DinoFilterInput-menuItem"},k=c(s)(function(o){var r=o.theme;return e(e(e(e({"--dino-filter-input-height":"38px"},"&.".concat(C.root),e({flex:1,border:"1px solid ".concat(r.palette.divider),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(C.focus),{borderColor:r.palette.primary.main,boxShadow:"0 0 0 2px ".concat(r.palette.primary.main,"33")})),".".concat(C.rootInner),{height:"var(--dino-filter-input-height)",display:"flex",alignItems:"stretch"}),".".concat(C.beforeInput),{width:"1px",height:"100%",alignSelf:"stretch"}),".".concat(C.input),{padding:r.spacing(.5,1),input:{fontSize:"14px",padding:"4px 0 5px"}})});export{j as createFilterInput,C as filterInputClasses};
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 } 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, InputAdornmentRight } from './filter-input.units'\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 mergedSlots: IFilterInputSlots = Object.assign({}, { beforeInput, afterInput }, props.slots)\r\n return { slots: mergedSlots }\r\n }, [])\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 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 renderContent = () => {\r\n const fieldsList = getFieldsByMatches(initialConfig, keywords)\r\n return (\r\n <PopperContent title='Filter Options' disableGutter onClose={() => setAnchorEl(null)}>\r\n <MenuList className={classes.menu}>\r\n {fieldsList.map((x, i) => {\r\n const field = x.field\r\n if (!x) return null\r\n const label = x.label ?? field.toString()\r\n const title = `${label}: \"${keywords}\"`\r\n return (\r\n <MenuItem title={title} key={field.toString() + i} onClick={() => handleClickMenuItem(field)} className={classes.menuItem}>\r\n <Typography variant='body2' sx={{ fontWeight: 500, flex: '0 0 auto' }}>\r\n {label}:\r\n </Typography>\r\n <Typography className='' variant='body2' color='text.secondary' sx={{ ml: 1, flex: '1 1 auto' }} noWrap>\r\n \"{keywords}\"\r\n </Typography>\r\n </MenuItem>\r\n )\r\n })}\r\n </MenuList>\r\n </PopperContent>\r\n )\r\n }\r\n\r\n const rootClass = [classes.root]\r\n if (status === 'focus' || Boolean(keywords)) rootClass.push(classes.focus)\r\n\r\n return (\r\n <ClickAwayListener onClickAway={() => handleClose()}>\r\n <FilterInputStyled className={rootClass.join(' ')} {...props.slots?.rootProps}>\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 endAdornment={\r\n <InputAdornmentRight\r\n hasKeyword={Boolean(keywords)}\r\n onSubmit={handleSubmitSearch}\r\n onClear={() => handleClose(true)}\r\n onSearch={handleClickSearch}\r\n />\r\n }\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 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 '--dino-filter-input-height': '38px',\r\n [`&.${filterInputClasses.root}`]: {\r\n flex: 1,\r\n border: `1px solid ${theme.palette.divider}`,\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 '&:hover': { borderColor: theme.palette.text.primary },\r\n '&.Mui-focused': {\r\n borderColor: theme.palette.primary.main,\r\n boxShadow: `0 0 0 2px ${theme.palette.primary.main}33`\r\n },\r\n [`&.${filterInputClasses.focus}`]: {\r\n borderColor: theme.palette.primary.main,\r\n boxShadow: `0 0 0 2px ${theme.palette.primary.main}33`\r\n }\r\n },\r\n [`.${filterInputClasses.rootInner}`]: {\r\n height: 'var(--dino-filter-input-height)',\r\n display: 'flex',\r\n alignItems: 'stretch'\r\n },\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}))\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$slots","_mergedConfig$slots","_mergedConfig$slots2","_mergedConfig$slots3","fieldsList","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","beforeInput","afterInput","slots","handleClose","isClear","handleSubmitSearch","_context$filterState$","qsField","filterState","storeFilter","logic","values","rootClass","root","push","focus","_jsx","ClickAwayListener","onClickAway","_jsxs","FilterInputStyled","className","join","rootProps","children","rootInner","Box","ref","InputBase","fullWidth","input","autoComplete","size","inputRef","value","placeholder","onKeyDown","event","keyCode","stopPropagation","preventDefault","_refInput$current","current","blur","onChange","finalValue","target","isOpenPopper","onFocus","currentTarget","endAdornment","InputAdornmentRight","hasKeyword","onSubmit","onClear","onSearch","_refInput$current2","PopperCustom","open","placement","transition","disablePortal","popperProps","getFieldsByMatches","PopperContent","title","disableGutter","onClose","MenuList","menu","map","x","i","_x$label","toString","concat","MenuItem","onClick","_context$filterState$2","fieldConfig","fieldValue","singleValue","handleClickMenuItem","menuItem","Typography","variant","sx","fontWeight","flex","color","ml","noWrap","styled","_ref","theme","_defineProperty","border","palette","divider","borderRadius","shape","backgroundColor","background","paper","transitions","create","borderColor","text","primary","main","boxShadow","height","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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"}
@@ -0,0 +1,2 @@
1
+ import{defineProperty as r,slicedToArray as e,toConsumableArray as n}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as t,Fragment as i,jsx as o}from"react/jsx-runtime";import{useState as a,useRef as l,useEffect as c,useMemo as u}from"react";import{styled as s,Box as d,InputBase as p,SwipeableDrawer as h,Tooltip as m,IconButton as f,Stack as v,Typography as g}from"@mui/material";import y from"@mui/icons-material/Search";import x from"@mui/icons-material/ChevronLeft";import b from"@mui/icons-material/Clear";import C from"@mui/icons-material/NorthWest";import{InputAdornmentRight as S}from"./filter-input.units.js";var w="dino_search_history_v1";s(d)(function(r){var e=r.theme;return{padding:e.spacing(2),display:"flex",flexDirection:"column",gap:e.spacing(1)}}),s("div")(function(r){return{display:"flex",alignItems:"center",gap:r.theme.spacing(1)}});var R=function(r){var e=r.placeholder,n=void 0===e?"Search...":e,t=r.inputRef,i=r.hasKeyword,a=r.onEnter,u=r.onChange,s=r.onClear,d=l(null),p=null!=t?t:d;return c(function(){var r=setTimeout(function(){var r;return null===(r=p.current)||void 0===r?void 0:r.focus()},50);return function(){try{var e;null===(e=p.current)||void 0===e||e.blur()}catch(r){}clearTimeout(r)}},[p]),o(k,{fullWidth:!0,inputRef:p,placeholder:n,inputProps:{autoCapitalize:"off",autoComplete:"off"},onKeyDown:function(r){"Enter"===r.key&&(r.preventDefault(),null==a||a())},onChange:function(r){return null==u?void 0:u(r.target.value)},endAdornment:o(S,{hasKeyword:i,onSubmit:a,onClear:s})})},k=s(p)(function(r){var e=r.theme;return{border:"1px solid ".concat(e.palette.divider),borderRadius:e.shape.borderRadius,padding:e.spacing(.5,1)}}),z=function(r){var e=r.history,n=r.onSelect,i=r.onFillInput,a=r.onClear;return e&&0!==e.length?t(D,{className:I.root,children:[t(v,{direction:"row",justifyContent:"space-between",alignItems:"center",sx:{mb:1},children:[o(g,{variant:"subtitle2",fontWeight:600,children:"Recent Searches"}),a&&o(m,{title:"Clear history",arrow:!0,children:o(f,{size:"small",onClick:a,children:o(b,{fontSize:"small"})})})]}),o(v,{className:I.items,children:e.map(function(r,e){return t(d,{className:I.item,onClick:function(){return n(r)},sx:{cursor:"pointer"},children:[o(g,{variant:"body2",noWrap:!0,sx:{flex:1},children:r}),o(m,{title:"Fill input",arrow:!0,children:o(f,{size:"small",sx:{color:"text.secondary","&:hover":{color:"text.primary"}},onClick:function(e){e.stopPropagation(),null==i||i(r)},children:o(C,{fontSize:"small"})})})]},e)})})]}):o(A,{children:o(g,{variant:"body2",color:"textSecondary",children:"No recent searches."})})},I={root:"DinoSearchHistory-root",items:"DinoSearchHistory-items",item:"DinoSearchHistory-item"},D=s(d)(function(e){var n=e.theme;return r(r({padding:"8px 16px",marginTop:1},".".concat(I.items),{}),".".concat(I.item),{display:"flex",alignItems:"center",gap:n.spacing(1),padding:n.spacing(.5,1),marginBottom:n.spacing(.5),borderRadius:n.shape.borderRadius,backgroundColor:"rgba(0,0,0,0.02)","&:hover":{backgroundColor:"rgba(0,0,0,0.04)"},"&:first-of-type":{marginTop:0}})}),A=s(d)(function(r){var e=r.theme;return{padding:e.spacing(2),textAlign:"center",color:e.palette.text.secondary,border:"0.5px dashed ".concat(e.palette.divider),borderRadius:e.shape.borderRadius,display:"flex",flexDirection:"column",alignItems:"center",gap:e.spacing(1),margin:e.spacing(1,2)}}),T=function(r){var s=r.onSearching,p=r.placeholder,h=a(!1),b=e(h,2),C=b[0],S=b[1],k=a([]),I=e(k,2),D=I[0],A=I[1],T=a(""),j=e(T,2),B=j[0],H=j[1],P=l(null);c(function(){if("undefined"!=typeof window)try{var r=localStorage.getItem(w);if(r){var e=JSON.parse(r);Array.isArray(e)&&A(e)}}catch(r){}},[]);var W=function(r){var e=r.trim();e&&A(function(r){var t=[e].concat(n(r.filter(function(r){return r!==e}))).slice(0,20);try{localStorage.setItem(w,JSON.stringify(t))}catch(r){}return t})},_=u(function(){var r=(B||"").trim();return r?D.filter(function(e){return e.toLowerCase().includes(r.toLowerCase())}).slice(0,5):D.slice(0,5)},[B,D]),E=function(){var r,e=(null===(r=P.current)||void 0===r||null===(r=r.value)||void 0===r?void 0:r.trim())||"";e&&(W(e),null==s||s(e),K())},K=function(){try{var r;null===(r=P.current)||void 0===r||r.blur()}catch(r){}S(!1)},L=function(){S(!0),H(""),P.current&&(P.current.value="")};return t(i,{children:[o(m,{title:"Search",arrow:!0,children:o(f,{size:"small",onClick:L,"aria-label":"Open search",children:o(y,{})})}),t(N,{anchor:"bottom",open:C,onClose:K,onOpen:L,disableBackdropTransition:!1,disableDiscovery:!1,swipeAreaWidth:20,children:[o(d,{sx:{display:"flex",justifyContent:"center",py:1},children:o(d,{sx:{width:40,height:4,borderRadius:2,backgroundColor:"divider"}})}),t(v,{gap:1,style:{flexDirection:"row",alignItems:"center",padding:"0 8px"},children:[o(m,{title:"Back",arrow:!0,children:o(f,{size:"small",onClick:function(){H("");try{var r;null===(r=P.current)||void 0===r||r.blur()}catch(r){}S(!1)},children:o(x,{fontSize:"small"})})}),o(R,{placeholder:p,inputRef:P,hasKeyword:Boolean(B),onEnter:E,onChange:H,onClear:function(){var r;P.current&&(P.current.value=""),H(""),null===(r=P.current)||void 0===r||r.focus()}}),o(m,{title:"Search",arrow:!0,children:o(f,{size:"small",onClick:E,"aria-label":"Apply search",children:o(y,{fontSize:"small"})})})]}),o(g,{variant:"caption",color:"textSecondary",sx:{px:2,mt:1},children:"Enter the value to search for and hit enter or click the enter icon to apply."}),o(z,{history:_,onSelect:function(r){P.current&&(P.current.value=r),H(r),W(r),null==s||s(r),K()},onFillInput:function(r){var e;P.current&&(P.current.value=r),H(r),null===(e=P.current)||void 0===e||e.focus()},onClear:function(){A([]);try{localStorage.removeItem(w)}catch(r){}}})]})]})},N=s(h)(function(r){return{zIndex:r.theme.zIndex.modal-10,".MuiPaper-root":{height:"calc(100svh - 56px)",maxHeight:"calc(100svh - 56px)",borderTopLeftRadius:12,borderTopRightRadius:12,overflow:"auto"}}});export{T as MobileSearchButton,T as default};
2
+ //# sourceMappingURL=filter-input.mobile.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"filter-input.mobile.js","sources":["../../../../src/filter-bar/components/filter-input.mobile.tsx"],"sourcesContent":["// Mobile search drawer: opens drawer from bottom and focuses input\r\nimport { useEffect, useMemo, useRef, useState } from 'react'\r\nimport { Box, IconButton, InputBase, styled, Tooltip, SwipeableDrawer, Stack, Divider, Typography, Button, Chip } from '@mui/material'\r\nimport SearchIcon from '@mui/icons-material/Search'\r\nimport ChevronLeftIcon from '@mui/icons-material/ChevronLeft'\r\nimport ClearIcon from '@mui/icons-material/Clear'\r\nimport NorthWestIcon from '@mui/icons-material/NorthWest'\r\nimport type { FC, RefObject } from 'react'\r\nimport { InputAdornmentRight } from './filter-input.units'\r\n// import SwipeableDrawer from '@mui/material/SwipeableDrawer'\r\n\r\nconst DEFAULT_PLACEHOLDER = 'Search...'\r\nconst HISTORY_KEY = 'dino_search_history_v1'\r\nconst MAX_HISTORY_STORED = 20\r\nconst MAX_HISTORY_DISPLAYED = 5\r\n\r\nconst Root = styled(Box)(({ theme }) => ({\r\n padding: theme.spacing(2),\r\n display: 'flex',\r\n flexDirection: 'column',\r\n gap: theme.spacing(1)\r\n}))\r\n\r\nconst Header = styled('div')(({ theme }) => ({\r\n display: 'flex',\r\n alignItems: 'center',\r\n gap: theme.spacing(1)\r\n}))\r\n\r\n//#region InputSearch\r\ninterface IInputSearchProps {\r\n placeholder?: string\r\n inputRef?: RefObject<HTMLInputElement>\r\n hasKeyword?: boolean\r\n onEnter?: () => void\r\n onChange?: (value: string) => void\r\n onClear?: () => void\r\n}\r\nconst InputSearch: FC<IInputSearchProps> = (props) => {\r\n const { placeholder = DEFAULT_PLACEHOLDER, inputRef, hasKeyword, onEnter, onChange, onClear } = props\r\n const localRef = useRef<HTMLInputElement | null>(null)\r\n const refToUse = (inputRef as RefObject<HTMLInputElement>) ?? localRef\r\n\r\n useEffect(() => {\r\n // ensure focus opens mobile keyboard — sometimes requires a small delay\r\n const t = setTimeout(() => refToUse.current?.focus(), 50)\r\n return () => {\r\n // blur on unmount to dismiss soft keyboard before drawer closes\r\n try {\r\n refToUse.current?.blur()\r\n } catch {\r\n // ignore\r\n }\r\n clearTimeout(t)\r\n }\r\n }, [refToUse])\r\n\r\n return (\r\n <SearchInput\r\n fullWidth\r\n inputRef={refToUse}\r\n placeholder={placeholder}\r\n inputProps={{ autoCapitalize: 'off', autoComplete: 'off' }}\r\n onKeyDown={(e) => {\r\n if (e.key === 'Enter') {\r\n e.preventDefault()\r\n onEnter?.()\r\n }\r\n }}\r\n onChange={(e) => onChange?.(e.target.value)}\r\n endAdornment={<InputAdornmentRight hasKeyword={hasKeyword} onSubmit={onEnter} onClear={onClear} />}\r\n />\r\n )\r\n}\r\n\r\nconst SearchInput = styled(InputBase)(({ theme }) => ({\r\n border: `1px solid ${theme.palette.divider}`,\r\n borderRadius: theme.shape.borderRadius,\r\n padding: theme.spacing(0.5, 1)\r\n}))\r\n//#endregion\r\n\r\n//#region SearchHistory\r\ninterface ISearchHistoryProps {\r\n history: string[]\r\n onSelect: (keyword: string) => void\r\n onFillInput?: (keyword: string) => void\r\n onClear?: () => void\r\n}\r\nconst SearchHistory: FC<ISearchHistoryProps> = (props) => {\r\n const { history, onSelect, onFillInput, onClear } = props\r\n if (!history || history.length === 0) {\r\n return (\r\n <SearchHistoryNoResults>\r\n <Typography variant='body2' color='textSecondary'>\r\n No recent searches.\r\n </Typography>\r\n </SearchHistoryNoResults>\r\n )\r\n }\r\n\r\n return (\r\n <SearchHistoryStyled className={searchHistoryClasses.root}>\r\n <Stack direction='row' justifyContent='space-between' alignItems='center' sx={{ mb: 1 }}>\r\n <Typography variant='subtitle2' fontWeight={600}>\r\n Recent Searches\r\n </Typography>\r\n {onClear && (\r\n <Tooltip title='Clear history' arrow>\r\n <IconButton size='small' onClick={onClear}>\r\n <ClearIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n )}\r\n </Stack>\r\n <Stack className={searchHistoryClasses.items}>\r\n {history.map((keyword, idx) => (\r\n <Box key={idx} className={searchHistoryClasses.item} onClick={() => onSelect(keyword)} sx={{ cursor: 'pointer' }}>\r\n <Typography variant='body2' noWrap sx={{ flex: 1 }}>\r\n {keyword}\r\n </Typography>\r\n <Tooltip title='Fill input' arrow>\r\n <IconButton\r\n size='small'\r\n sx={{ color: 'text.secondary', '&:hover': { color: 'text.primary' } }}\r\n onClick={(e) => {\r\n e.stopPropagation()\r\n onFillInput?.(keyword)\r\n }}\r\n >\r\n <NorthWestIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n </Box>\r\n ))}\r\n </Stack>\r\n </SearchHistoryStyled>\r\n )\r\n}\r\nconst searchHistoryClasses = {\r\n root: 'DinoSearchHistory-root',\r\n items: 'DinoSearchHistory-items',\r\n item: 'DinoSearchHistory-item'\r\n}\r\nconst SearchHistoryStyled = styled(Box)(({ theme }) => ({\r\n padding: '8px 16px',\r\n marginTop: 1,\r\n [`.${searchHistoryClasses.items}`]: {},\r\n [`.${searchHistoryClasses.item}`]: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n gap: theme.spacing(1),\r\n padding: theme.spacing(0.5, 1),\r\n marginBottom: theme.spacing(0.5),\r\n borderRadius: theme.shape.borderRadius,\r\n backgroundColor: 'rgba(0,0,0,0.02)',\r\n '&:hover': { backgroundColor: 'rgba(0,0,0,0.04)' },\r\n '&:first-of-type': { marginTop: 0 }\r\n }\r\n}))\r\n\r\nconst SearchHistoryNoResults = styled(Box)(({ theme }) => ({\r\n padding: theme.spacing(2),\r\n textAlign: 'center',\r\n color: theme.palette.text.secondary,\r\n border: `0.5px dashed ${theme.palette.divider}`,\r\n borderRadius: theme.shape.borderRadius,\r\n display: 'flex',\r\n flexDirection: 'column',\r\n alignItems: 'center',\r\n gap: theme.spacing(1),\r\n margin: theme.spacing(1, 2)\r\n}))\r\n\r\n//#endregion\r\n//#region Main Component\r\nexport interface IMobileSearchButtonProps {\r\n placeholder?: string\r\n onSearching?: (keyword: string) => void\r\n}\r\n\r\nexport const MobileSearchButton: FC<IMobileSearchButtonProps> = (props) => {\r\n const { onSearching, placeholder } = props\r\n\r\n const [isOpenDrawer, setIsOpenDrawer] = useState(false)\r\n const [history, setHistory] = useState<string[]>([])\r\n const [inputValue, setInputValue] = useState('')\r\n\r\n const refInput = useRef<HTMLInputElement | null>(null)\r\n\r\n // Load history from localStorage on mount\r\n useEffect(() => {\r\n if (typeof window === 'undefined') return\r\n try {\r\n const raw = localStorage.getItem(HISTORY_KEY)\r\n if (raw) {\r\n const parsed = JSON.parse(raw)\r\n if (Array.isArray(parsed)) setHistory(parsed)\r\n }\r\n } catch {\r\n // ignore\r\n }\r\n }, [])\r\n\r\n // Save keyword to history (dedupe, limit to MAX_HISTORY_STORED)\r\n const pushHistory = (keyword: string) => {\r\n const trimmed = keyword.trim()\r\n if (!trimmed) return\r\n\r\n setHistory((prev) => {\r\n const next = [trimmed, ...prev.filter((x) => x !== trimmed)].slice(0, MAX_HISTORY_STORED)\r\n try {\r\n localStorage.setItem(HISTORY_KEY, JSON.stringify(next))\r\n } catch {\r\n // ignore\r\n }\r\n return next\r\n })\r\n }\r\n\r\n // Filter history based on current input (limit to MAX_HISTORY_DISPLAYED)\r\n const filteredHistory = useMemo(() => {\r\n const finalValue = (inputValue || '').trim()\r\n if (!finalValue) return history.slice(0, MAX_HISTORY_DISPLAYED)\r\n return history.filter((kw) => kw.toLowerCase().includes(finalValue.toLowerCase())).slice(0, MAX_HISTORY_DISPLAYED)\r\n }, [inputValue, history])\r\n\r\n const handleBack = () => {\r\n setInputValue('')\r\n try {\r\n refInput.current?.blur()\r\n } catch {\r\n // ignore\r\n }\r\n setIsOpenDrawer(false)\r\n }\r\n\r\n const handleSearch = () => {\r\n const keyword = refInput.current?.value?.trim() || ''\r\n if (keyword) {\r\n pushHistory(keyword)\r\n onSearching?.(keyword)\r\n handleCloseDrawer()\r\n }\r\n }\r\n\r\n const handleSelectHistory = (keyword: string) => {\r\n if (refInput.current) refInput.current.value = keyword\r\n setInputValue(keyword)\r\n pushHistory(keyword)\r\n onSearching?.(keyword)\r\n handleCloseDrawer()\r\n }\r\n\r\n const handleFillInput = (keyword: string) => {\r\n if (refInput.current) refInput.current.value = keyword\r\n setInputValue(keyword)\r\n refInput.current?.focus()\r\n }\r\n\r\n const handleClearHistory = () => {\r\n setHistory([])\r\n try {\r\n localStorage.removeItem(HISTORY_KEY)\r\n } catch {\r\n // ignore\r\n }\r\n }\r\n\r\n const handleClearInput = () => {\r\n if (refInput.current) refInput.current.value = ''\r\n setInputValue('')\r\n refInput.current?.focus()\r\n }\r\n\r\n const handleCloseDrawer = () => {\r\n try {\r\n refInput.current?.blur()\r\n } catch {}\r\n setIsOpenDrawer(false)\r\n }\r\n\r\n const handleOpenDrawer = () => {\r\n setIsOpenDrawer(true)\r\n setInputValue('')\r\n if (refInput.current) refInput.current.value = ''\r\n }\r\n\r\n return (\r\n <>\r\n <Tooltip title='Search' arrow>\r\n <IconButton size='small' onClick={handleOpenDrawer} aria-label='Open search'>\r\n <SearchIcon />\r\n </IconButton>\r\n </Tooltip>\r\n <SwipeableDrawerStyled\r\n anchor='bottom'\r\n open={isOpenDrawer}\r\n onClose={handleCloseDrawer}\r\n onOpen={handleOpenDrawer}\r\n disableBackdropTransition={false}\r\n disableDiscovery={false}\r\n swipeAreaWidth={20}\r\n >\r\n <Box sx={{ display: 'flex', justifyContent: 'center', py: 1 }}>\r\n <Box sx={{ width: 40, height: 4, borderRadius: 2, backgroundColor: 'divider' }} />\r\n </Box>\r\n <Stack gap={1} style={{ flexDirection: 'row', alignItems: 'center', padding: '0 8px' }}>\r\n <Tooltip title='Back' arrow>\r\n <IconButton size='small' onClick={handleBack}>\r\n <ChevronLeftIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n <InputSearch\r\n placeholder={placeholder}\r\n inputRef={refInput}\r\n hasKeyword={Boolean(inputValue)}\r\n onEnter={handleSearch}\r\n onChange={setInputValue}\r\n onClear={handleClearInput}\r\n />\r\n <Tooltip title='Search' arrow>\r\n <IconButton size='small' onClick={handleSearch} aria-label='Apply search'>\r\n <SearchIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n </Stack>\r\n <Typography variant='caption' color='textSecondary' sx={{ px: 2, mt: 1 }}>\r\n Enter the value to search for and hit enter or click the enter icon to apply.\r\n </Typography>\r\n <SearchHistory history={filteredHistory} onSelect={handleSelectHistory} onFillInput={handleFillInput} onClear={handleClearHistory} />\r\n </SwipeableDrawerStyled>\r\n </>\r\n )\r\n}\r\n\r\nexport default MobileSearchButton\r\n\r\nconst SwipeableDrawerStyled = styled(SwipeableDrawer)(({ theme }) => ({\r\n zIndex: theme.zIndex.modal - 10, // ensure it's below any modal that might be opened from the filter bar\r\n '.MuiPaper-root': {\r\n height: 'calc(100svh - 56px)',\r\n maxHeight: 'calc(100svh - 56px)',\r\n borderTopLeftRadius: 12,\r\n borderTopRightRadius: 12,\r\n overflow: 'auto'\r\n }\r\n}))\r\n//#endregion\r\n"],"names":["HISTORY_KEY","styled","Box","_ref","theme","padding","spacing","display","flexDirection","gap","_ref2","alignItems","InputSearch","props","_props$placeholder","placeholder","DEFAULT_PLACEHOLDER","inputRef","hasKeyword","onEnter","onChange","onClear","localRef","useRef","refToUse","useEffect","t","setTimeout","_refToUse$current","current","focus","_refToUse$current2","blur","_unused","clearTimeout","_jsx","SearchInput","fullWidth","inputProps","autoCapitalize","autoComplete","onKeyDown","e","key","preventDefault","target","value","endAdornment","InputAdornmentRight","onSubmit","InputBase","_ref3","border","concat","palette","divider","borderRadius","shape","SearchHistory","history","onSelect","onFillInput","length","_jsxs","SearchHistoryStyled","className","searchHistoryClasses","root","Stack","direction","justifyContent","sx","mb","children","Typography","variant","fontWeight","Tooltip","title","arrow","IconButton","size","onClick","ClearIcon","fontSize","items","map","keyword","idx","item","cursor","noWrap","flex","color","stopPropagation","NorthWestIcon","SearchHistoryNoResults","_ref4","_defineProperty","marginTop","marginBottom","backgroundColor","_ref6","textAlign","text","secondary","margin","MobileSearchButton","onSearching","_useState","useState","_useState2","_slicedToArray","isOpenDrawer","setIsOpenDrawer","_useState3","_useState4","setHistory","_useState5","_useState6","inputValue","setInputValue","refInput","window","raw","localStorage","getItem","parsed","JSON","parse","Array","isArray","_unused2","pushHistory","trimmed","trim","prev","next","_toConsumableArray","filter","x","slice","setItem","stringify","_unused3","filteredHistory","useMemo","finalValue","kw","toLowerCase","includes","handleSearch","_refInput$current2","handleCloseDrawer","_refInput$current5","_unused6","handleOpenDrawer","_Fragment","SearchIcon","SwipeableDrawerStyled","anchor","open","onClose","onOpen","disableBackdropTransition","disableDiscovery","swipeAreaWidth","py","width","height","style","_refInput$current","_unused4","ChevronLeftIcon","Boolean","_refInput$current4","px","mt","_refInput$current3","removeItem","_unused5","SwipeableDrawer","_ref7","zIndex","modal","maxHeight","borderTopLeftRadius","borderTopRightRadius","overflow"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{objectSpread2 as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as l,jsx as r}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,l){var r=(l||"").toString().trim().toLowerCase(),i=Object.keys(e.fields||{}),o=[];return i.forEach(function(l){var i,a,t=e.fields[l];if(t){var n=null===(i=e.matches)||void 0===i?void 0:i[l],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:l,label:t.label});case"existed":return void(r&&o.push({field:l,label:t.label}));case"link":try{new URL(r),o.push({field:l,label:t.label})}catch(e){}return;case"custom":var i;return void(null!==(i=e.validate)&&void 0!==i&&i.call(e,r)&&o.push({field:l,label:t.label}));default:return}})}}),o.sort(function(e,l){return e.field===u.quickSearch?1:l.field===u.quickSearch?-1:0})}var f=function(l){return r(n,e(e({viewBox:"2 0 24 24",version:"1.0"},l),{},{children:r("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){var n=e.hasKeyword,u=e.onSubmit,d=e.onClear;return l(i,{position:"end",children:[n&&r(o,{title:"The enter or click to apply",arrow:!0,children:r(a,{size:"small",sx:{flex:"0 0 auto",color:t.blue[600],"&:hover":{color:t.blue[900]}},onClick:u,children:r(f,{fontSize:"small"})})}),n&&r(o,{title:"Clear",arrow:!0,children:r(a,{size:"small",sx:{flex:"0 0 auto",color:t.red[500],"&:hover":{color:t.red[700]}},onClick:d,children:r(c,{fontSize:"small"})})}),!n&&r(o,{title:"Enter the value to search for",arrow:!0,children:r(a,{size:"small",sx:{flex:"0 0 auto"},onClick:e.onSearch,children:r(s,{fontSize:"small"})})})]})};export{m as InputAdornmentRight,d as getFieldsByMatches};
1
+ import{objectSpread2 as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as e,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(r,e){var l=(e||"").toString().trim().toLowerCase(),i=Object.keys(r.fields||{}),o=[];return i.forEach(function(e){var i,a,t=r.fields[e];if(t){var n=null===(i=r.matches)||void 0===i?void 0:i[e],c=null!==(a=null==n?void 0:n.rules)&&void 0!==a?a:[{rule:"always"}];(Array.isArray(c)?c:[]).forEach(function(r){switch(r.rule){case"always":return void o.push({field:e,label:t.label});case"existed":return void(l&&o.push({field:e,label:t.label}));case"link":try{new URL(l),o.push({field:e,label:t.label})}catch(r){}return;case"custom":var i;return void(null!==(i=r.validate)&&void 0!==i&&i.call(r,l)&&o.push({field:e,label:t.label}));default:return}})}}),o.sort(function(r,e){return r.field===u.quickSearch?1:e.field===u.quickSearch?-1:0})}var f=function(e){return l(n,r(r({viewBox:"2 0 24 24",version:"1.0"},e),{},{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"})}))},h=function(r){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:r.onSearch,children:l(s,{fontSize:"small"})})})})},m=function(r){var n=r.hasKeyword,s=r.onSubmit,u=r.onClear;return e(i,{position:"end",children:[n&&l(o,{title:"The enter or click to apply",arrow:!0,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,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{h as InputAdornmentLeft,m 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 InputAdornmentRightProps {\r\n hasKeyword?: boolean\r\n onSubmit?: IconButtonProps['onClick']\r\n onClear?: IconButtonProps['onClick']\r\n onSearch?: 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\r\n {!hasKeyword && (\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 )}\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","InputAdornmentRight","hasKeyword","onSubmit","onClear","_jsxs","InputAdornment","position","Tooltip","title","arrow","IconButton","size","sx","flex","color","colors","blue","onClick","fontSize","red","CloseIcon","onSearch","SearchIcon"],"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,EAUCC,EAAoD,SAACT,GAChE,IAAQU,EAAkCV,EAAlCU,WAAYC,EAAsBX,EAAtBW,SAAUC,EAAYZ,EAAZY,QAC9B,OACEC,EAACC,GAAeC,SAAS,MACtBT,SAAA,CAAAI,GACCT,EAACe,EAAQ,CAAAC,MAAM,8BAA8BC,OAC3C,EAAAZ,SAAAL,EAACkB,EAAU,CAACC,KAAK,QAAQC,GAAI,CAAEC,KAAM,WAAYC,MAAOC,EAAOC,KAAK,KAAM,UAAW,CAAEF,MAAOC,EAAOC,KAAK,OAAUC,QAASf,EAAQL,SACnIL,EAACF,EAAS,CAAC4B,SAAS,cAKzBjB,GACCT,EAACe,EAAQ,CAAAC,MAAM,QAAQC,OACrB,EAAAZ,SAAAL,EAACkB,EAAW,CAAAC,KAAK,QAAQC,GAAI,CAAEC,KAAM,WAAYC,MAAOC,EAAOI,IAAI,KAAM,UAAW,CAAEL,MAAOC,EAAOI,IAAI,OAAUF,QAASd,EAAON,SAChIL,EAAC4B,EAAS,CAACF,SAAS,eAKxBjB,GACAT,EAACe,GAAQC,MAAM,gCAAgCC,kBAC7CjB,EAACkB,GAAWC,KAAK,QAAQC,GAAI,CAAEC,KAAM,YAAcI,QAAS1B,EAAM8B,kBAChE7B,EAAC8B,GAAWJ,SAAS,gBAMjC"}
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,MAAKL,SAAA,CAC3BkB,GACCvB,EAACW,EAAQ,CAAAC,MAAM,8BAA8BC,OAC3C,EAAAR,SAAAL,EAACc,EAAW,CAAAC,KAAK,QAAQC,GAAI,CAAEC,KAAM,WAAYU,MAAOC,EAAOC,KAAK,KAAM,UAAW,CAAEF,MAAOC,EAAOC,KAAK,OAAUX,QAASM,EAAQnB,SACnIL,EAACF,EAAU,CAAAuB,SAAS,cAKzBE,GACCvB,EAACW,EAAO,CAACC,MAAM,QAAQC,OACrB,EAAAR,SAAAL,EAACc,EAAU,CAACC,KAAK,QAAQC,GAAI,CAAEC,KAAM,WAAYU,MAAOC,EAAOE,IAAI,KAAM,UAAW,CAAEH,MAAOC,EAAOE,IAAI,OAAUZ,QAASO,EAAOpB,SAChIL,EAAC+B,GAAUV,SAAS,gBAMhC"}
@@ -1,2 +1,2 @@
1
- import{defineProperty as r,objectSpread2 as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as t,jsxs as l}from"react/jsx-runtime";import{styled as o,Collapse as i,Box as n,Button as a}from"@mui/material";import{useContext as c,useMemo as s}from"react";import{KeySpecial as u}from"../types.js";import{useFilterActions as m}from"./hooks.js";import{mapSpecialLabel as d}from"../helpers.js";import{createChipViewers as p}from"./chip-viewer.js";import{FilterBarContext as f}from"../index.context.js";function b(r){var o=h,b=p();return function(p){var h=c(f),v=h.filterState,x=m(h),k=s(function(){return function(r,t){var l,o=r.fields,i=r.enableQuickSearch,n=void 0===i||i,a=e({},o),c=u.quickSearch;return n?a[c]?null!==(l=a[c])&&void 0!==l&&l.label||(a[c]=e(e({},a[c]),{},{label:d[c]})):a[c]={label:d[c]}:delete a[c],Object.keys(t||{}).reduce(function(r,e){var l,o=null==a?void 0:a[e],i=(null==o?void 0:o.label)||e.toString(),n=null==t||null===(l=t[e])||void 0===l?void 0:l.values,c=(Array.isArray(n)?n:[]).filter(Boolean).map(function(r){return{value:r.toString()}});return c.length>0&&r.push({field:e,label:i,items:c}),r},[]).sort(function(r,e){return r.field===c?-1:e.field===c?1:0})}(r,v.storeFilter)},[v,r]);return t(i,{in:k.length>0,timeout:"auto",unmountOnExit:!0,children:l(g,{className:o.root,sx:p.sx,children:[t("div",{className:o.scrollHorizontal,children:t(b.Group,{label:"Filters",value:k,placement:"horizontal",onRemove:x.removeFilterByFieldValue})}),t(n,{sx:{},children:t(a,{size:"small",color:"error",variant:"text",onClick:x.clearAllFilters,className:o.buttonClearAll,children:"Clear All"})})]})})}}var h={root:"DinoFilterSummary-root",scrollHorizontal:"DinoFilterSummary-scrollHorizontal",buttonClearAll:"DinoFilterSummary-buttonClearAll"},g=o("div")(function(e){var t=e.theme;return r(r(r({},"&.".concat(h.root),{display:"flex",alignItems:"center",paddingLeft:t.spacing(1),paddingRight:t.spacing(.5)}),".".concat(h.scrollHorizontal),{overflowX:"auto",overflowY:"hidden",WebkitOverflowScrolling:"touch",scrollbarHeight:"thin",display:"flex",flexWrap:"nowrap",minWidth:0,flex:1,"& > *":{minWidth:"max-content",flexShrink:0},"&::-webkit-scrollbar":{height:"8px",background:"transparent"},"&::-webkit-scrollbar-thumb":{background:t.palette.grey[300],borderRadius:"8px",minHeight:"8px",transition:"background 0.2s"},"&::-webkit-scrollbar-thumb:hover":{background:t.palette.primary.light},"&::-webkit-scrollbar-track":{background:t.palette.grey[100],borderRadius:"8px"},scrollbarColor:"".concat(t.palette.grey[300]," ").concat(t.palette.grey[100]),scrollbarWidth:"thin"}),".".concat(h.buttonClearAll),{textTransform:"none",marginLeft:t.spacing(1),fontWeight:500,lineHeight:2,padding:t.spacing(0,1)})});export{b as createFilterSummary};
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 { Box, Button, Collapse, styled } from '@mui/material'\r\nimport { useContext, useMemo } from 'react'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from './hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { createChipViewers } from './chip-viewer'\r\nimport { FilterBarContext } from '../index.context'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { TFieldStore, TFieldValid } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IChipViewerItem, TChipViewerGroup } from './chip-viewer'\r\nimport type { IFilterSummaryConfig, IFilterSummaryProps, TFieldSummaryConfigs } from './filter-summary.types'\r\n\r\nfunction mapFilterStateToFilterData<T>(config: IFilterSummaryConfig<T>, store?: TFieldStore<T>): TChipViewerGroup<T>[] {\r\n const { fields, enableQuickSearch = true } = config\r\n\r\n // Ensure 'quickSearch' is always included in the summary, even if it's not in the config or store\r\n // If enableQuickSearch is false, it will not be added to the summary or removed if it exists in the config\r\n const mergedConfig: TFieldSummaryConfigs<T> = { ...fields }\r\n const qsKey = KeySpecial.quickSearch\r\n if (enableQuickSearch) {\r\n if (!mergedConfig[qsKey]) {\r\n mergedConfig[qsKey] = { label: mapSpecialLabel[qsKey] }\r\n } else if (!mergedConfig[qsKey]?.label) {\r\n mergedConfig[qsKey] = { ...mergedConfig[qsKey], label: mapSpecialLabel[qsKey] }\r\n }\r\n } else {\r\n delete mergedConfig[qsKey]\r\n }\r\n\r\n const keys = Object.keys(store || {}) as (keyof TFieldStore<T>)[]\r\n const groups = keys.reduce<TChipViewerGroup<T>[]>((acc, key) => {\r\n const fieldConfig = mergedConfig?.[key]\r\n const label = fieldConfig?.label || key.toString()\r\n const values = store?.[key]?.values as TFieldValid[] | undefined\r\n const items = Array.isArray(values) ? values : []\r\n const summaryItems = items.filter(Boolean).map<IChipViewerItem<T>>((item) => ({ value: item.toString() }))\r\n if (summaryItems.length > 0) {\r\n acc.push({ field: key, label, items: summaryItems })\r\n }\r\n return acc\r\n }, [])\r\n const finalGroups = groups.sort((a, b) => {\r\n if (a.field === qsKey) return -1\r\n if (b.field === qsKey) return 1\r\n return 0\r\n })\r\n return finalGroups\r\n}\r\n\r\nexport function createFilterSummary<T>(config: IFilterSummaryConfig<T>) {\r\n const classes = filterSummaryClasses\r\n const ChipViewers = createChipViewers<T>()\r\n\r\n const FilterSummary: FC<IFilterSummaryProps<T>> = (props) => {\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const { filterState } = context\r\n const filterActions = useFilterActions<T>(context)\r\n\r\n const filterData = useMemo(() => {\r\n return mapFilterStateToFilterData(config, filterState.storeFilter)\r\n }, [filterState, config])\r\n\r\n // Old logic to calculate filterData, now moved to useMemo above\r\n // if (filterData.length === 0) return null\r\n\r\n return (\r\n <Collapse in={filterData.length > 0} timeout='auto' unmountOnExit>\r\n <FilterSummaryStyled className={classes.root} sx={props.sx}>\r\n <div className={classes.scrollHorizontal}>\r\n <ChipViewers.Group label='Filters' value={filterData} placement='horizontal' onRemove={filterActions.removeFilterByFieldValue} />\r\n </div>\r\n <Box sx={{}}>\r\n <Button size='small' color='error' variant='text' onClick={filterActions.clearAllFilters} className={classes.buttonClearAll}>\r\n Clear All\r\n </Button>\r\n </Box>\r\n </FilterSummaryStyled>\r\n </Collapse>\r\n )\r\n }\r\n\r\n return FilterSummary\r\n}\r\n\r\nconst filterSummaryClasses = {\r\n root: 'DinoFilterSummary-root',\r\n scrollHorizontal: 'DinoFilterSummary-scrollHorizontal',\r\n fieldItem: 'DinoFilterSummary-fieldItem',\r\n fieldLabel: 'DinoFilterSummary-fieldLabel',\r\n fieldValue: 'DinoFilterSummary-fieldValue',\r\n buttonClearAll: 'DinoFilterSummary-buttonClearAll'\r\n}\r\n\r\nconst FilterSummaryStyled = styled('div')(({ theme }) => ({\r\n [`&.${filterSummaryClasses.root}`]: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n paddingLeft: theme.spacing(1),\r\n paddingRight: theme.spacing(0.5)\r\n },\r\n [`.${filterSummaryClasses.scrollHorizontal}`]: {\r\n overflowX: 'auto',\r\n overflowY: 'hidden',\r\n WebkitOverflowScrolling: 'touch',\r\n scrollbarHeight: 'thin',\r\n // The content doesn't wrap to the next line and is wider than the container, displaying a horizontal scroll bar.\r\n display: 'flex',\r\n flexWrap: 'nowrap',\r\n minWidth: 0,\r\n flex: 1,\r\n '& > *': { minWidth: 'max-content', flexShrink: 0 },\r\n // Custom scrollbar\r\n '&::-webkit-scrollbar': { height: '8px', background: 'transparent' },\r\n '&::-webkit-scrollbar-thumb': {\r\n background: theme.palette.grey[300],\r\n borderRadius: '8px',\r\n minHeight: '8px',\r\n transition: 'background 0.2s'\r\n },\r\n '&::-webkit-scrollbar-thumb:hover': { background: theme.palette.primary.light },\r\n '&::-webkit-scrollbar-track': { background: theme.palette.grey[100], borderRadius: '8px' },\r\n // Firefox\r\n scrollbarColor: `${theme.palette.grey[300]} ${theme.palette.grey[100]}`,\r\n scrollbarWidth: 'thin'\r\n },\r\n [`.${filterSummaryClasses.buttonClearAll}`]: {\r\n textTransform: 'none',\r\n marginLeft: theme.spacing(1),\r\n fontWeight: 500,\r\n lineHeight: 2,\r\n padding: theme.spacing(0, 1)\r\n }\r\n}))\r\n"],"names":["createFilterSummary","config","classes","filterSummaryClasses","ChipViewers","createChipViewers","props","context","useContext","FilterBarContext","filterState","filterActions","useFilterActions","filterData","useMemo","store","_mergedConfig$qsKey","fields","_config$enableQuickSe","enableQuickSearch","mergedConfig","_objectSpread","qsKey","KeySpecial","quickSearch","label","mapSpecialLabel","Object","keys","reduce","acc","key","_store$key","fieldConfig","toString","values","summaryItems","Array","isArray","filter","Boolean","map","item","value","length","push","field","items","sort","a","b","mapFilterStateToFilterData","storeFilter","_jsx","Collapse","in","timeout","unmountOnExit","_jsxs","FilterSummaryStyled","className","root","sx","children","scrollHorizontal","Group","placement","onRemove","removeFilterByFieldValue","Box","Button","size","color","variant","onClick","clearAllFilters","buttonClearAll","styled","_ref","theme","_defineProperty","concat","display","alignItems","paddingLeft","spacing","paddingRight","overflowX","overflowY","WebkitOverflowScrolling","scrollbarHeight","flexWrap","minWidth","flex","flexShrink","height","background","palette","grey","borderRadius","minHeight","transition","primary","light","scrollbarColor","scrollbarWidth","textTransform","marginLeft","fontWeight","lineHeight","padding"],"mappings":"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"}
1
+ {"version":3,"file":"filter-summary.js","sources":["../../../../src/filter-bar/components/filter-summary.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useContext, useMemo } from 'react'\r\nimport { Box, Button, buttonClasses, Collapse, IconButton, iconButtonClasses, styled } from '@mui/material'\r\nimport ClearAllIcon from '@mui/icons-material/ClearAll'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from './hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { createChipViewers } from './chip-viewer'\r\nimport { FilterBarContext } from '../index.context'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { TFieldStore, TFieldValid } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IChipViewerItem, TChipViewerGroup } from './chip-viewer'\r\nimport type { IFilterSummaryConfig, IFilterSummaryProps, TFieldSummaryConfigs } from './filter-summary.types'\r\n\r\nfunction mapFilterStateToFilterData<T>(config: IFilterSummaryConfig<T>, store?: TFieldStore<T>): TChipViewerGroup<T>[] {\r\n const { fields, enableQuickSearch = true } = config\r\n\r\n // Ensure 'quickSearch' is always included in the summary, even if it's not in the config or store\r\n // If enableQuickSearch is false, it will not be added to the summary or removed if it exists in the config\r\n const mergedConfig: TFieldSummaryConfigs<T> = { ...fields }\r\n const qsKey = KeySpecial.quickSearch\r\n if (enableQuickSearch) {\r\n if (!mergedConfig[qsKey]) {\r\n mergedConfig[qsKey] = { label: mapSpecialLabel[qsKey] }\r\n } else if (!mergedConfig[qsKey]?.label) {\r\n mergedConfig[qsKey] = { ...mergedConfig[qsKey], label: mapSpecialLabel[qsKey] }\r\n }\r\n } else {\r\n delete mergedConfig[qsKey]\r\n }\r\n\r\n const keys = Object.keys(store || {}) as (keyof TFieldStore<T>)[]\r\n const groups = keys.reduce<TChipViewerGroup<T>[]>((acc, key) => {\r\n const fieldConfig = mergedConfig?.[key]\r\n const label = fieldConfig?.label || key.toString()\r\n const values = store?.[key]?.values as TFieldValid[] | undefined\r\n const items = Array.isArray(values) ? values : []\r\n const summaryItems = items.filter(Boolean).map<IChipViewerItem<T>>((item) => ({ value: item.toString() }))\r\n if (summaryItems.length > 0) {\r\n acc.push({ field: key, label, items: summaryItems })\r\n }\r\n return acc\r\n }, [])\r\n const finalGroups = groups.sort((a, b) => {\r\n if (a.field === qsKey) return -1\r\n if (b.field === qsKey) return 1\r\n return 0\r\n })\r\n return finalGroups\r\n}\r\n\r\nexport function createFilterSummary<T>(config: IFilterSummaryConfig<T>) {\r\n const classes = filterSummaryClasses\r\n const ChipViewers = createChipViewers<T>()\r\n\r\n const FilterSummary: FC<IFilterSummaryProps<T>> = (props) => {\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const { filterState } = context\r\n const filterActions = useFilterActions<T>(context)\r\n\r\n const filterData = useMemo(() => {\r\n return mapFilterStateToFilterData(config, filterState.storeFilter)\r\n }, [filterState, config])\r\n\r\n // Old logic to calculate filterData, now moved to useMemo above\r\n // if (filterData.length === 0) return null\r\n\r\n return (\r\n <Collapse in={filterData.length > 0} timeout='auto' unmountOnExit>\r\n <FilterSummaryStyled className={classes.root} sx={props.sx}>\r\n <div className={classes.scrollHorizontal}>\r\n <ChipViewers.Group label='Filters' value={filterData} placement='horizontal' onRemove={filterActions.removeFilterByFieldValue} />\r\n </div>\r\n <Box>\r\n <Button\r\n size='small'\r\n color='error'\r\n variant='text'\r\n onClick={filterActions.clearAllFilters}\r\n className={classes.buttonClearAll}\r\n startIcon={<ClearAllIcon />}\r\n aria-label='Clear all filters'\r\n >\r\n Clear All\r\n </Button>\r\n <IconButton\r\n size='small'\r\n color='error'\r\n onClick={filterActions.clearAllFilters}\r\n className={classes.buttonClearAll}\r\n aria-label='Clear all filters'\r\n >\r\n <ClearAllIcon />\r\n </IconButton>\r\n </Box>\r\n </FilterSummaryStyled>\r\n </Collapse>\r\n )\r\n }\r\n\r\n return FilterSummary\r\n}\r\n\r\nconst filterSummaryClasses = {\r\n root: 'DinoFilterSummary-root',\r\n scrollHorizontal: 'DinoFilterSummary-scrollHorizontal',\r\n fieldItem: 'DinoFilterSummary-fieldItem',\r\n fieldLabel: 'DinoFilterSummary-fieldLabel',\r\n fieldValue: 'DinoFilterSummary-fieldValue',\r\n buttonClearAll: 'DinoFilterSummary-buttonClearAll'\r\n}\r\n\r\nconst FilterSummaryStyled = styled('div')(({ theme }) => ({\r\n [`&.${filterSummaryClasses.root}`]: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n paddingLeft: theme.spacing(1),\r\n paddingRight: theme.spacing(0.5)\r\n },\r\n [`.${filterSummaryClasses.scrollHorizontal}`]: {\r\n overflowX: 'auto',\r\n overflowY: 'hidden',\r\n WebkitOverflowScrolling: 'touch',\r\n scrollbarHeight: 'thin',\r\n // The content doesn't wrap to the next line and is wider than the container, displaying a horizontal scroll bar.\r\n display: 'flex',\r\n flexWrap: 'nowrap',\r\n minWidth: 0,\r\n flex: 1,\r\n '& > *': { minWidth: 'max-content', flexShrink: 0 },\r\n // Custom scrollbar\r\n '&::-webkit-scrollbar': { height: '8px', background: 'transparent' },\r\n '&::-webkit-scrollbar-thumb': {\r\n background: theme.palette.grey[300],\r\n borderRadius: '8px',\r\n minHeight: '8px',\r\n transition: 'background 0.2s'\r\n },\r\n '&::-webkit-scrollbar-thumb:hover': { background: theme.palette.primary.light },\r\n '&::-webkit-scrollbar-track': { background: theme.palette.grey[100], borderRadius: '8px' },\r\n // Firefox\r\n scrollbarColor: `${theme.palette.grey[300]} ${theme.palette.grey[100]}`,\r\n scrollbarWidth: 'thin'\r\n },\r\n [`.${filterSummaryClasses.buttonClearAll}`]: {\r\n marginLeft: theme.spacing(1),\r\n [`&:not(.${iconButtonClasses.root})`]: {\r\n textTransform: 'none',\r\n fontWeight: 500,\r\n lineHeight: 2,\r\n padding: theme.spacing(0, 1)\r\n },\r\n [`&.${iconButtonClasses.root}`]: { display: 'none' },\r\n [theme.breakpoints.down('md')]: {\r\n [`&.${buttonClasses.root}`]: { display: 'none' },\r\n [`&.${iconButtonClasses.root}`]: { display: 'flex' }\r\n }\r\n }\r\n}))\r\n"],"names":["createFilterSummary","config","classes","filterSummaryClasses","ChipViewers","createChipViewers","props","context","useContext","FilterBarContext","filterState","filterActions","useFilterActions","filterData","useMemo","store","_mergedConfig$qsKey","fields","_config$enableQuickSe","enableQuickSearch","mergedConfig","_objectSpread","qsKey","KeySpecial","quickSearch","label","mapSpecialLabel","Object","keys","reduce","acc","key","_store$key","fieldConfig","toString","values","summaryItems","Array","isArray","filter","Boolean","map","item","value","length","push","field","items","sort","a","b","mapFilterStateToFilterData","storeFilter","_jsx","Collapse","in","timeout","unmountOnExit","children","_jsxs","FilterSummaryStyled","className","root","sx","scrollHorizontal","Group","placement","onRemove","removeFilterByFieldValue","Box","Button","size","color","variant","onClick","clearAllFilters","buttonClearAll","startIcon","ClearAllIcon","IconButton","styled","_ref","theme","_defineProperty","concat","display","alignItems","paddingLeft","spacing","paddingRight","overflowX","overflowY","WebkitOverflowScrolling","scrollbarHeight","flexWrap","minWidth","flex","flexShrink","height","background","palette","grey","borderRadius","minHeight","transition","primary","light","scrollbarColor","scrollbarWidth","marginLeft","iconButtonClasses","textTransform","fontWeight","lineHeight","padding","breakpoints","down","buttonClasses"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{defineProperty as r,typeof as e}from"../../_virtual/_rollupPluginBabelHelpers.js";import{KeySpecial as t}from"./types.js";import{QueryParam as i}from"../utils/query-param.js";var n=r({},t.quickSearch,"Quick Search");function o(r){if(null!=r){if("object"!==e(r))return r;if(Array.isArray(r)){var t=r.map(o).filter(function(r){return void 0!==r});return t.length>0?t:void 0}var i={},n=!1;for(var f in r)if(r.hasOwnProperty(f)){var a=o(r[f]);void 0!==a&&(i[f]=a,n=!0)}return n?i:void 0}}function f(r,e){if(r===e)return!0;try{var t=o(r),i=o(e);return t===i||!(!t||!i)&&JSON.stringify(t)===JSON.stringify(i)}catch(r){return console.error("Error comparing filter states:",r),!1}}function a(r,e){if("undefined"!=typeof window)try{if(f(r,e))return void i.replaceDeletes("filter");if(!r||0===Object.keys(r).length)return void i.replaceDeletes("filter");var t={filter:JSON.stringify(r)};i.replacePatch(t)}catch(r){console.error("Error syncing filter state to URL:",r)}}function l(r){if("undefined"==typeof window)return r;try{var e=i.gets("filter");return e.filter?JSON.parse(e.filter):r}catch(e){return console.error("Error getting filter state from URL:",e),r}}export{l as getFilterFromURL,f as isFilterStateEqual,n as mapSpecialLabel,o as removeNullValues,a as setFilterToURL};
1
+ import{defineProperty as r,typeof as e}from"../../_virtual/_rollupPluginBabelHelpers.js";import{KeySpecial as t}from"./types.js";import{QueryParam as i}from"../utils/query-param.js";var n=r({},t.quickSearch,"Quick Search");function o(r){if(null!=r){if("object"!==e(r))return r;if(Array.isArray(r)){var t=r.map(o).filter(function(r){return void 0!==r});return t.length>0?t:void 0}var i={},n=!1;for(var f in r)if(r.hasOwnProperty(f)){var a=o(r[f]);void 0!==a&&(i[f]=a,n=!0)}return n?i:void 0}}function f(r){if(!r)return!0;var e=o(r);return!e||0===Object.keys(e).length}function a(r,e){if(r===e)return!0;try{var t=o(r),i=o(e);return t===i||!(!t||!i)&&JSON.stringify(t)===JSON.stringify(i)}catch(r){return console.error("Error comparing filter states:",r),!1}}function l(r,e){if("undefined"!=typeof window)try{if(a(r,e))return void i.replaceDeletes("filter");if(!r||0===Object.keys(r).length)return void i.replaceDeletes("filter");var t={filter:JSON.stringify(r)};i.replacePatch(t)}catch(r){console.error("Error syncing filter state to URL:",r)}}function u(r){if("undefined"==typeof window)return r;try{var e=i.gets("filter");return e.filter?JSON.parse(e.filter):r}catch(e){return console.error("Error getting filter state from URL:",e),r}}export{u as getFilterFromURL,f as isEmptyFilterState,a as isFilterStateEqual,n as mapSpecialLabel,o as removeNullValues,l as setFilterToURL};
2
2
  //# sourceMappingURL=helpers.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"helpers.js","sources":["../../../src/filter-bar/helpers.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nimport { KeySpecial, TFilterState } from './types'\r\nimport { QueryParam } from '../utils/query-param'\r\n\r\nexport const mapSpecialLabel: Record<KeySpecial, string> = {\r\n [KeySpecial.quickSearch]: 'Quick Search'\r\n}\r\n\r\nexport interface IFilterStateQueryParams {\r\n filter?: string\r\n}\r\n\r\n/**\r\n * @en Remove null/undefined values from object recursively for accurate comparison.\r\n * @vi Loai bo cac gia tri null/undefined khoi object mot cach de quy de so sanh chinh xac.\r\n */\r\nexport function removeNullValues<T = any>(obj: T): T | undefined {\r\n if (obj === null || obj === undefined) {\r\n return undefined\r\n }\r\n\r\n if (typeof obj !== 'object') {\r\n return obj\r\n }\r\n\r\n if (Array.isArray(obj)) {\r\n const cleaned = obj.map(removeNullValues).filter((v) => v !== undefined)\r\n return cleaned.length > 0 ? (cleaned as any) : undefined\r\n }\r\n\r\n const cleaned: any = {}\r\n let hasValue = false\r\n\r\n for (const key in obj) {\r\n if (obj.hasOwnProperty(key)) {\r\n const value = removeNullValues(obj[key])\r\n if (value !== undefined) {\r\n cleaned[key] = value\r\n hasValue = true\r\n }\r\n }\r\n }\r\n\r\n return hasValue ? cleaned : undefined\r\n}\r\n\r\n/**\r\n * @en Deep comparison of two filter states to check if they are equal.\r\n * @vi So sanh sau hai filter state de kiem tra xem chung co bang nhau khong.\r\n */\r\nexport function isFilterStateEqual<T>(state1?: TFilterState<T>, state2?: TFilterState<T>): boolean {\r\n if (state1 === state2) return true\r\n\r\n try {\r\n // Remove null/undefined values before comparison\r\n const cleaned1 = removeNullValues(state1)\r\n const cleaned2 = removeNullValues(state2)\r\n\r\n if (cleaned1 === cleaned2) return true\r\n if (!cleaned1 || !cleaned2) return false\r\n\r\n return JSON.stringify(cleaned1) === JSON.stringify(cleaned2)\r\n } catch (error) {\r\n console.error('Error comparing filter states:', error)\r\n return false\r\n }\r\n}\r\n\r\n/**\r\n * @en Synchronize filter state to URL query parameters. If state equals defaultState, remove from URL to keep it clean.\r\n * @vi Dong bo filter state vao URL query parameters. Neu state bang defaultState, xoa khoi URL de giu URL sach.\r\n *\r\n * @param state - Current filter state to sync\r\n * @param defaultState - Default filter state (if current equals this, don't save to URL)\r\n */\r\nexport function setFilterToURL<T>(state?: TFilterState<T>, defaultState?: TFilterState<T>) {\r\n // If window is undefined (e.g., during SSR), do nothing\r\n if (typeof window === 'undefined') return\r\n\r\n try {\r\n // If state equals default, remove from URL\r\n if (isFilterStateEqual(state, defaultState)) {\r\n QueryParam.replaceDeletes<IFilterStateQueryParams>('filter')\r\n return\r\n }\r\n\r\n // If state is empty/undefined, remove from URL\r\n if (!state || Object.keys(state).length === 0) {\r\n QueryParam.replaceDeletes<IFilterStateQueryParams>('filter')\r\n return\r\n }\r\n\r\n // Serialize state to JSON and save to URL\r\n const updateParams: IFilterStateQueryParams = {\r\n filter: JSON.stringify(state)\r\n }\r\n\r\n QueryParam.replacePatch<IFilterStateQueryParams>(updateParams)\r\n } catch (error) {\r\n console.error('Error syncing filter state to URL:', error)\r\n }\r\n}\r\n\r\n/**\r\n * @en Retrieve filter state from URL query parameters.\r\n * @vi Lay filter state tu URL query parameters.\r\n *\r\n * @param defaultState - Default filter state to return if URL has no filter state\r\n * @returns Filter state from URL or defaultState\r\n */\r\nexport function getFilterFromURL<T>(defaultState?: TFilterState<T>): TFilterState<T> | undefined {\r\n // If window is undefined (e.g., during SSR), return defaultState\r\n if (typeof window === 'undefined') return defaultState\r\n\r\n try {\r\n const q = QueryParam.gets<IFilterStateQueryParams>('filter')\r\n\r\n if (!q.filter) {\r\n return defaultState\r\n }\r\n\r\n // Parse JSON from URL\r\n const state = JSON.parse(q.filter) as TFilterState<T>\r\n return state\r\n } catch (error) {\r\n console.error('Error getting filter state from URL:', error)\r\n return defaultState\r\n }\r\n}\r\n"],"names":["mapSpecialLabel","_defineProperty","KeySpecial","quickSearch","removeNullValues","obj","_typeof","Array","isArray","cleaned","map","filter","v","undefined","length","hasValue","key","hasOwnProperty","value","isFilterStateEqual","state1","state2","cleaned1","cleaned2","JSON","stringify","error","console","setFilterToURL","state","defaultState","window","QueryParam","replaceDeletes","Object","keys","updateParams","replacePatch","getFilterFromURL","q","gets","parse"],"mappings":"sLAKO,IAAMA,EAAeC,EAAA,CAAA,EACzBC,EAAWC,YAAc,gBAWtB,SAAUC,EAA0BC,GACxC,GAAIA,QAAJ,CAIA,GAAmB,WAAfC,EAAOD,GACT,OAAOA,EAGT,GAAIE,MAAMC,QAAQH,GAAM,CACtB,IAAMI,EAAUJ,EAAIK,IAAIN,GAAkBO,OAAO,SAACC,GAAC,YAAWC,IAAND,IACxD,OAAOH,EAAQK,OAAS,EAAKL,OAAkBI,CAChD,CAED,IAAMJ,EAAe,CAAE,EACnBM,GAAW,EAEf,IAAK,IAAMC,KAAOX,EAChB,GAAIA,EAAIY,eAAeD,GAAM,CAC3B,IAAME,EAAQd,EAAiBC,EAAIW,SACrBH,IAAVK,IACFT,EAAQO,GAAOE,EACfH,GAAW,EAEd,CAGH,OAAOA,EAAWN,OAAUI,CAxB3B,CAyBH,CAMgB,SAAAM,EAAsBC,EAA0BC,GAC9D,GAAID,IAAWC,EAAQ,OAAO,EAE9B,IAEE,IAAMC,EAAWlB,EAAiBgB,GAC5BG,EAAWnB,EAAiBiB,GAElC,OAAIC,IAAaC,MACZD,IAAaC,IAEXC,KAAKC,UAAUH,KAAcE,KAAKC,UAAUF,EACpD,CAAC,MAAOG,GAEP,OADAC,QAAQD,MAAM,iCAAkCA,IACzC,CACR,CACH,CASgB,SAAAE,EAAkBC,EAAyBC,GAEzD,GAAsB,oBAAXC,OAEX,IAEE,GAAIZ,EAAmBU,EAAOC,GAE5B,YADAE,EAAWC,eAAwC,UAKrD,IAAKJ,GAAuC,IAA9BK,OAAOC,KAAKN,GAAOf,OAE/B,YADAkB,EAAWC,eAAwC,UAKrD,IAAMG,EAAwC,CAC5CzB,OAAQa,KAAKC,UAAUI,IAGzBG,EAAWK,aAAsCD,EAClD,CAAC,MAAOV,GACPC,QAAQD,MAAM,qCAAsCA,EACrD,CACH,CASM,SAAUY,EAAoBR,GAElC,GAAsB,oBAAXC,OAAwB,OAAOD,EAE1C,IACE,IAAMS,EAAIP,EAAWQ,KAA8B,UAEnD,OAAKD,EAAE5B,OAKOa,KAAKiB,MAAMF,EAAE5B,QAJlBmB,CAMV,CAAC,MAAOJ,GAEP,OADAC,QAAQD,MAAM,uCAAwCA,GAC/CI,CACR,CACH"}
1
+ {"version":3,"file":"helpers.js","sources":["../../../src/filter-bar/helpers.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nimport { KeySpecial, TFilterState } from './types'\r\nimport { QueryParam } from '../utils/query-param'\r\n\r\nexport const mapSpecialLabel: Record<KeySpecial, string> = {\r\n [KeySpecial.quickSearch]: 'Quick Search'\r\n}\r\n\r\nexport interface IFilterStateQueryParams {\r\n filter?: string\r\n}\r\n\r\n/**\r\n * @en Remove null/undefined values from object recursively for accurate comparison.\r\n * @vi Loai bo cac gia tri null/undefined khoi object mot cach de quy de so sanh chinh xac.\r\n */\r\nexport function removeNullValues<T = any>(obj: T): T | undefined {\r\n if (obj === null || obj === undefined) {\r\n return undefined\r\n }\r\n\r\n if (typeof obj !== 'object') {\r\n return obj\r\n }\r\n\r\n if (Array.isArray(obj)) {\r\n const cleaned = obj.map(removeNullValues).filter((v) => v !== undefined)\r\n return cleaned.length > 0 ? (cleaned as any) : undefined\r\n }\r\n\r\n const cleaned: any = {}\r\n let hasValue = false\r\n\r\n for (const key in obj) {\r\n if (obj.hasOwnProperty(key)) {\r\n const value = removeNullValues(obj[key])\r\n if (value !== undefined) {\r\n cleaned[key] = value\r\n hasValue = true\r\n }\r\n }\r\n }\r\n\r\n return hasValue ? cleaned : undefined\r\n}\r\n\r\n/**\r\n * @en Check if filter state is empty (no filters applied). Null/undefined values are ignored in this check.\r\n * @vi Kiem tra xem filter state co rong khong (khong co filter nao duoc ap dung). Gia tri null/undefined se duoc bo qua trong kiem tra nay.\r\n */\r\nexport function isEmptyFilterState<T>(state?: TFilterState<T>): boolean {\r\n if (!state) return true\r\n const cleaned = removeNullValues(state)\r\n return !cleaned || Object.keys(cleaned).length === 0\r\n}\r\n\r\n/**\r\n * @en Deep comparison of two filter states to check if they are equal.\r\n * @vi So sanh sau hai filter state de kiem tra xem chung co bang nhau khong.\r\n */\r\nexport function isFilterStateEqual<T>(state1?: TFilterState<T>, state2?: TFilterState<T>): boolean {\r\n if (state1 === state2) return true\r\n\r\n try {\r\n // Remove null/undefined values before comparison\r\n const cleaned1 = removeNullValues(state1)\r\n const cleaned2 = removeNullValues(state2)\r\n\r\n if (cleaned1 === cleaned2) return true\r\n if (!cleaned1 || !cleaned2) return false\r\n\r\n return JSON.stringify(cleaned1) === JSON.stringify(cleaned2)\r\n } catch (error) {\r\n console.error('Error comparing filter states:', error)\r\n return false\r\n }\r\n}\r\n\r\n/**\r\n * @en Synchronize filter state to URL query parameters. If state equals defaultState, remove from URL to keep it clean.\r\n * @vi Dong bo filter state vao URL query parameters. Neu state bang defaultState, xoa khoi URL de giu URL sach.\r\n *\r\n * @param state - Current filter state to sync\r\n * @param defaultState - Default filter state (if current equals this, don't save to URL)\r\n */\r\nexport function setFilterToURL<T>(state?: TFilterState<T>, defaultState?: TFilterState<T>) {\r\n // If window is undefined (e.g., during SSR), do nothing\r\n if (typeof window === 'undefined') return\r\n\r\n try {\r\n // If state equals default, remove from URL\r\n if (isFilterStateEqual(state, defaultState)) {\r\n QueryParam.replaceDeletes<IFilterStateQueryParams>('filter')\r\n return\r\n }\r\n\r\n // If state is empty/undefined, remove from URL\r\n if (!state || Object.keys(state).length === 0) {\r\n QueryParam.replaceDeletes<IFilterStateQueryParams>('filter')\r\n return\r\n }\r\n\r\n // Serialize state to JSON and save to URL\r\n const updateParams: IFilterStateQueryParams = {\r\n filter: JSON.stringify(state)\r\n }\r\n\r\n QueryParam.replacePatch<IFilterStateQueryParams>(updateParams)\r\n } catch (error) {\r\n console.error('Error syncing filter state to URL:', error)\r\n }\r\n}\r\n\r\n/**\r\n * @en Retrieve filter state from URL query parameters.\r\n * @vi Lay filter state tu URL query parameters.\r\n *\r\n * @param defaultState - Default filter state to return if URL has no filter state\r\n * @returns Filter state from URL or defaultState\r\n */\r\nexport function getFilterFromURL<T>(defaultState?: TFilterState<T>): TFilterState<T> | undefined {\r\n // If window is undefined (e.g., during SSR), return defaultState\r\n if (typeof window === 'undefined') return defaultState\r\n\r\n try {\r\n const q = QueryParam.gets<IFilterStateQueryParams>('filter')\r\n\r\n if (!q.filter) {\r\n return defaultState\r\n }\r\n\r\n // Parse JSON from URL\r\n const state = JSON.parse(q.filter) as TFilterState<T>\r\n return state\r\n } catch (error) {\r\n console.error('Error getting filter state from URL:', error)\r\n return defaultState\r\n }\r\n}\r\n"],"names":["mapSpecialLabel","_defineProperty","KeySpecial","quickSearch","removeNullValues","obj","_typeof","Array","isArray","cleaned","map","filter","v","undefined","length","hasValue","key","hasOwnProperty","value","isEmptyFilterState","state","Object","keys","isFilterStateEqual","state1","state2","cleaned1","cleaned2","JSON","stringify","error","console","setFilterToURL","defaultState","window","QueryParam","replaceDeletes","updateParams","replacePatch","getFilterFromURL","q","gets","parse"],"mappings":"sLAKO,IAAMA,EAAeC,EAAA,CAAA,EACzBC,EAAWC,YAAc,gBAWtB,SAAUC,EAA0BC,GACxC,GAAIA,QAAJ,CAIA,GAAmB,WAAfC,EAAOD,GACT,OAAOA,EAGT,GAAIE,MAAMC,QAAQH,GAAM,CACtB,IAAMI,EAAUJ,EAAIK,IAAIN,GAAkBO,OAAO,SAACC,GAAC,YAAWC,IAAND,IACxD,OAAOH,EAAQK,OAAS,EAAKL,OAAkBI,CAChD,CAED,IAAMJ,EAAe,CAAE,EACnBM,GAAW,EAEf,IAAK,IAAMC,KAAOX,EAChB,GAAIA,EAAIY,eAAeD,GAAM,CAC3B,IAAME,EAAQd,EAAiBC,EAAIW,SACrBH,IAAVK,IACFT,EAAQO,GAAOE,EACfH,GAAW,EAEd,CAGH,OAAOA,EAAWN,OAAUI,CAxB3B,CAyBH,CAMM,SAAUM,EAAsBC,GACpC,IAAKA,EAAO,OAAO,EACnB,IAAMX,EAAUL,EAAiBgB,GACjC,OAAQX,GAA2C,IAAhCY,OAAOC,KAAKb,GAASK,MAC1C,CAMgB,SAAAS,EAAsBC,EAA0BC,GAC9D,GAAID,IAAWC,EAAQ,OAAO,EAE9B,IAEE,IAAMC,EAAWtB,EAAiBoB,GAC5BG,EAAWvB,EAAiBqB,GAElC,OAAIC,IAAaC,MACZD,IAAaC,IAEXC,KAAKC,UAAUH,KAAcE,KAAKC,UAAUF,EACpD,CAAC,MAAOG,GAEP,OADAC,QAAQD,MAAM,iCAAkCA,IACzC,CACR,CACH,CASgB,SAAAE,EAAkBZ,EAAyBa,GAEzD,GAAsB,oBAAXC,OAEX,IAEE,GAAIX,EAAmBH,EAAOa,GAE5B,YADAE,EAAWC,eAAwC,UAKrD,IAAKhB,GAAuC,IAA9BC,OAAOC,KAAKF,GAAON,OAE/B,YADAqB,EAAWC,eAAwC,UAKrD,IAAMC,EAAwC,CAC5C1B,OAAQiB,KAAKC,UAAUT,IAGzBe,EAAWG,aAAsCD,EAClD,CAAC,MAAOP,GACPC,QAAQD,MAAM,qCAAsCA,EACrD,CACH,CASM,SAAUS,EAAoBN,GAElC,GAAsB,oBAAXC,OAAwB,OAAOD,EAE1C,IACE,IAAMO,EAAIL,EAAWM,KAA8B,UAEnD,OAAKD,EAAE7B,OAKOiB,KAAKc,MAAMF,EAAE7B,QAJlBsB,CAMV,CAAC,MAAOH,GAEP,OADAC,QAAQD,MAAM,uCAAwCA,GAC/CG,CACR,CACH"}
@@ -1,2 +1,2 @@
1
- import{defineProperty as t,inherits as e,createClass as n,objectSpread2 as r,classCallCheck as o,callSuper as i,asyncToGenerator as a,regenerator as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as s,jsxs as u}from"react/jsx-runtime";import{Component as p}from"react";import{styled as m,Box as f}from"@mui/material";import{createFilterBarContext as c}from"./index.context.js";import{createFilterSort as d}from"./components/filter-sort.js";import{createFilterMenu as v}from"./components/filter-menu.js";import{createFilterInput as g}from"./components/filter-input.js";import{createFilterSummary as h}from"./components/filter-summary.js";import{fetchDelay as C}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";function S(m){if(!m.InputComponent){var S=m.inputConfig||{fields:{}};m.inputConfig=S,m.InputComponent=g(S)}if(!m.MenuComponent){var x=m.menuConfig||{fields:{}};m.menuConfig=x,m.MenuComponent=v(x)}if(!m.SummaryComponent&&!1!==m.enableSummary){var b=m.summaryConfig||{fields:{}};m.summaryConfig=b,m.SummaryComponent=h(b)}if(!m.SortComponent){var F=m.sortConfig||{fields:{}};m.sortConfig=F,m.SortComponent=d(F)}var k=m.defaultFilterLogic||"and",P=c(),I=function(){function c(e){var n;return o(this,c),n=i(this,c,[e]),t(n,"handleChange",function(){var t=a(l().m(function t(e,r){var o;return l().w(function(t){for(;;)switch(t.p=t.n){case 0:return t.p=0,n.setState(function(t){var e;return{filterState:null!==(e=null==r?void 0:r.filterState)&&void 0!==e?e:t.filterState,isLoading:!0}}),t.n=1,C(a(l().m(function t(){var r,o;return l().w(function(t){for(;;)if(0===t.n)return t.a(2,null===(r=(o=n.props).onChange)||void 0===r?void 0:r.call(o,e))},t)})),500);case 1:n.setState({isLoading:!1}),t.n=3;break;case 2:throw t.p=2,o=t.v,n.setState({isLoading:!1}),o;case 3:return t.a(2)}},t,null,[[0,2]])}));return function(e,n){return t.apply(this,arguments)}}()),t(n,"setFilterState",function(t){n.props.value?n.handleChange(t):n.handleChange(t,{filterState:t})}),t(n,"onAddFilter",function(){console.log("Add filter")}),t(n,"onAddRemove",function(){console.log("Remove filter")}),n.state=n.getInitialFilterState(),n}return e(c,p),n(c,[{key:"getInitialFilterState",value:function(){return this.props.value?{filterState:this.props.value}:{filterState:Object.assign({filterLogic:k},m.initialFilterState)}}},{key:"filterState",get:function(){return this.props.value||this.state.filterState}},{key:"isLoading",get:function(){return this.state.isLoading||!1}},{key:"render",value:function(){var t,e=this.props.slots,n=m.InputComponent,o=m.MenuComponent,i=m.SummaryComponent,a=m.SortComponent;return s(P.Provider,{value:this,children:u(j,{className:y.root,sx:this.props.sx,children:[u("div",{className:y.inner,children:[(null==e?void 0:e.before)||null,s(o,{slots:{popperProps:{placement:"bottom-start"}}}),s(a,{sx:{mr:1},slots:{popperProps:{placement:"bottom-start"}}}),s(n,{onAdd:this.onAddFilter,slots:{popperProps:{placement:"bottom-start"}}}),(null==e?void 0:e.after)||null]}),u(f,r(r({},null==e?void 0:e.summaryWrapProps),{},{sx:r({display:"flex",alignItems:"center"},null==e||null===(t=e.summaryWrapProps)||void 0===t?void 0:t.sx),children:[(null==e?void 0:e.summaryBefore)||null,s(f,{sx:{flex:1,minWidth:0},children:!1!==m.enableSummary&&s(i,{})}),(null==e?void 0:e.summaryAfter)||null]}))]})})}}])}();return I}var y={root:"DinoFilterBar-root",inner:"DinoFilterBar-inner"},j=m(f)(function(e){var n=e.theme;return t(t({},"&.".concat(y.root),{backgroundColor:n.palette.background.paper}),".".concat(y.inner),{display:"flex",alignItems:"center",gap:n.spacing(1)})});export{S as createFilterBar};
1
+ import{defineProperty as t,slicedToArray as r,objectSpread2 as n,asyncToGenerator as e,regenerator as o}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i,jsxs as a}from"react/jsx-runtime";import{useState as l,useEffect as m}from"react";import{styled as u,Box as s,useMediaQuery as p}from"@mui/material";import{useTheme as f}from"@mui/material/styles";import{fetchDelay as c}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";import{createFilterBarContext as d}from"./index.context.js";import{createFilterSort as v}from"./components/filter-sort.js";import{createFilterMenu as g}from"./components/filter-menu.js";import{createFilterInput as C}from"./components/filter-input.js";import{createFilterSummary as y}from"./components/filter-summary.js";function S(t){if(!t.InputComponent){var u=t.inputConfig||{fields:{}};t.inputConfig=u,t.InputComponent=C(u)}if(!t.MenuComponent){var S=t.menuConfig||{fields:{}};t.menuConfig=S,t.MenuComponent=g(S)}if(!t.SummaryComponent&&!1!==t.enableSummary){var j=t.summaryConfig||{fields:{}};t.summaryConfig=j,t.SummaryComponent=y(j)}if(!t.SortComponent){var h=t.sortConfig||{fields:{}};t.sortConfig=h,t.SortComponent=v(h)}var P=t.defaultFilterLogic||"and",I=d();return function(u){var d,v=u.slots,g=t.InputComponent,C=t.MenuComponent,y=t.SummaryComponent,S=t.SortComponent,j=l(function(){return u.value?{filterState:u.value}:{filterState:Object.assign({filterLogic:P},t.initialFilterState)}}),h=r(j,2),w=h[0],F=h[1],k=l(!1),B=r(k,2),L=B[0],M=B[1];m(function(){u.value&&F({filterState:u.value})},[u.value]);var W=function(){var t=e(o().m(function t(r,n){var i;return o().w(function(t){for(;;)switch(t.p=t.n){case 0:return t.p=0,F(function(t){var r;return{filterState:null!==(r=null==n?void 0:n.filterState)&&void 0!==r?r:t.filterState}}),M(!0),t.n=1,c(e(o().m(function t(){var n;return o().w(function(t){for(;;)if(0===t.n)return t.a(2,null===(n=u.onChange)||void 0===n?void 0:n.call(u,r))},t)})),500);case 1:M(!1),t.n=3;break;case 2:throw t.p=2,i=t.v,M(!1),i;case 3:return t.a(2)}},t,null,[[0,2]])}));return function(r,n){return t.apply(this,arguments)}}(),A={filterState:u.value||w.filterState,isLoading:L,setFilterState:function(t){u.value?W(t):W(t,{filterState:t})}},D=f(),N=p(D.breakpoints.down("md"));return i(I.Provider,{value:A,children:a(x,{className:b.root,sx:u.sx,children:[a("div",{className:b.inner,children:[(null==v?void 0:v.before)||null,i(C,{slots:{popperProps:{placement:"bottom-start"}}}),i(S,{slots:{popperProps:{placement:"bottom-start"}}}),i(g,{slots:{minimalInput:N,popperProps:{placement:"bottom-start"}}}),(null==v?void 0:v.after)||null]}),a(s,n(n({},null==v?void 0:v.summaryWrapProps),{},{sx:n({display:"flex",alignItems:"center"},null==v||null===(d=v.summaryWrapProps)||void 0===d?void 0:d.sx),children:[(null==v?void 0:v.summaryBefore)||null,i(s,{sx:{flex:1,minWidth:0},children:!1!==t.enableSummary&&i(y,{})}),(null==v?void 0:v.summaryAfter)||null]}))]})})}}var b={root:"DinoFilterBar-root",inner:"DinoFilterBar-inner"},x=u(s)(function(r){var n=r.theme;return t(t({},"&.".concat(b.root),{backgroundColor:n.palette.background.paper,boxSizing:"border-box"}),".".concat(b.inner),{display:"flex",alignItems:"center",gap:n.spacing(1)})});export{S as createFilterBar};
2
2
  //# sourceMappingURL=index.create.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.create.js","sources":["../../../src/filter-bar/index.create.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { Component } from 'react'\r\nimport { Box, BoxProps, styled } from '@mui/material'\r\nimport { createFilterBarContext } from './index.context'\r\nimport { createFilterSort } from './components/filter-sort'\r\nimport { createFilterMenu } from './components/filter-menu'\r\nimport { createFilterInput } from './components/filter-input'\r\nimport { createFilterSummary } from './components/filter-summary'\r\n// types\r\nimport type { ComponentType } from 'react'\r\nimport type { TFilterState } from './types'\r\nimport type { IFilterBarContext, IFilterBarContextState } from './index.context'\r\nimport type { IFilterMenuConfig, IFilterMenuProps } from './components/filter-menu.types'\r\nimport type { IFilterSortConfig, IFilterSortProps } from './components/filter-sort.types'\r\nimport type { IFilterInputConfig, IFilterInputProps } from './components/filter-input.types'\r\nimport type { IFilterSummaryConfig, IFilterSummaryProps } from './components/filter-summary.types'\r\nimport { fetchDelay } from '../utils'\r\n\r\nexport interface IFilterBarConfigs<T> {\r\n initialFilterState?: TFilterState<T>\r\n /** Default filter logic, can be overridden by individual filters @default \"and\" */\r\n defaultFilterLogic?: 'and' | 'or'\r\n InputComponent?: ComponentType<IFilterInputProps<T>>\r\n inputConfig?: IFilterInputConfig<T>\r\n MenuComponent?: ComponentType<IFilterMenuProps<T>>\r\n menuConfig?: IFilterMenuConfig<T>\r\n sortConfig?: IFilterSortConfig<T>\r\n SortComponent?: ComponentType<IFilterSortProps<T>>\r\n /** Enable or disable the summary component. Default is true. */\r\n enableSummary?: boolean\r\n SummaryComponent?: ComponentType<IFilterSummaryProps<T>>\r\n summaryConfig?: IFilterSummaryConfig<T>\r\n}\r\n\r\nexport interface IFilterBarSlots {\r\n summaryWrapProps?: BoxProps\r\n summaryBefore?: React.ReactNode\r\n summaryAfter?: React.ReactNode\r\n before?: React.ReactNode\r\n after?: React.ReactNode\r\n}\r\n\r\nexport interface IFilterBarProps<T> {\r\n sx?: BoxProps['sx']\r\n value?: TFilterState<T>\r\n onChange?: (state: TFilterState<T>) => Promise<void> | void\r\n slots?: IFilterBarSlots\r\n}\r\n\r\ninterface IFilterBarState<T> extends IFilterBarContextState<T> {}\r\n\r\nexport function createFilterBar<T>(configs: IFilterBarConfigs<T>) {\r\n if (!configs.InputComponent) {\r\n const configInput = configs.inputConfig || { fields: {} }\r\n configs.inputConfig = configInput\r\n configs.InputComponent = createFilterInput<T>(configInput)\r\n }\r\n if (!configs.MenuComponent) {\r\n const configMenu = configs.menuConfig || { fields: {} }\r\n configs.menuConfig = configMenu\r\n configs.MenuComponent = createFilterMenu<T>(configMenu)\r\n }\r\n if (!configs.SummaryComponent && configs.enableSummary !== false) {\r\n const configSummary: IFilterSummaryConfig<T> = configs.summaryConfig || { fields: {} }\r\n configs.summaryConfig = configSummary\r\n configs.SummaryComponent = createFilterSummary<T>(configSummary)\r\n }\r\n if (!configs.SortComponent) {\r\n const configSort: IFilterSortConfig<T> = configs.sortConfig || { fields: {} }\r\n configs.sortConfig = configSort\r\n configs.SortComponent = createFilterSort<T>(configSort)\r\n }\r\n\r\n const defaultFilterLogic = configs.defaultFilterLogic || 'and'\r\n const Context = createFilterBarContext<T>()\r\n\r\n class FilterBar extends Component<IFilterBarProps<T>, IFilterBarState<T>> implements IFilterBarContext<T> {\r\n constructor(props: IFilterBarProps<T>) {\r\n super(props)\r\n this.state = this.getInitialFilterState()\r\n }\r\n\r\n getInitialFilterState(): IFilterBarState<T> {\r\n if (this.props.value) return { filterState: this.props.value }\r\n return { filterState: Object.assign({ filterLogic: defaultFilterLogic }, configs.initialFilterState) }\r\n }\r\n\r\n get filterState(): TFilterState<T> {\r\n return this.props.value || this.state.filterState\r\n }\r\n\r\n get isLoading(): boolean {\r\n return this.state.isLoading || false\r\n }\r\n\r\n handleChange = async (filterState: TFilterState<T>, state?: Partial<IFilterBarState<T>>) => {\r\n try {\r\n this.setState((prev) => ({ filterState: state?.filterState ?? prev.filterState, isLoading: true }))\r\n await fetchDelay(async () => this.props.onChange?.(filterState), 500)\r\n this.setState({ isLoading: false })\r\n } catch (error) {\r\n this.setState({ isLoading: false })\r\n throw error\r\n }\r\n }\r\n\r\n setFilterState = (state: TFilterState<T>) => {\r\n if (this.props.value) {\r\n this.handleChange(state)\r\n return\r\n }\r\n this.handleChange(state, { filterState: state })\r\n }\r\n\r\n onAddFilter = () => {\r\n // TODO: add filter to filterState\r\n console.log('Add filter')\r\n }\r\n\r\n onAddRemove = () => {\r\n // TODO: remove filter from filterState\r\n console.log('Remove filter')\r\n }\r\n\r\n render() {\r\n const { slots } = this.props\r\n const InputComponent = configs.InputComponent as ComponentType<IFilterInputProps<T>>\r\n const MenuComponent = configs.MenuComponent as ComponentType<IFilterMenuProps<T>>\r\n const SummaryComponent = configs.SummaryComponent as ComponentType<IFilterSummaryProps<T>>\r\n const SortComponent = configs.SortComponent as ComponentType<IFilterSortProps<T>>\r\n return (\r\n <Context.Provider value={this}>\r\n <FilterBarStyled className={filterbarClasses.root} sx={this.props.sx}>\r\n <div className={filterbarClasses.inner}>\r\n {slots?.before || null}\r\n <MenuComponent slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n <SortComponent sx={{ mr: 1 }} slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n <InputComponent onAdd={this.onAddFilter} slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n {slots?.after || null}\r\n </div>\r\n <Box {...slots?.summaryWrapProps} sx={{ display: 'flex', alignItems: 'center', ...slots?.summaryWrapProps?.sx }}>\r\n {slots?.summaryBefore || null}\r\n <Box sx={{ flex: 1, minWidth: 0 }}>{configs.enableSummary !== false && <SummaryComponent />}</Box>\r\n {slots?.summaryAfter || null}\r\n </Box>\r\n </FilterBarStyled>\r\n {/* <Box style={{ border: '1px solid red', marginTop: '16px', padding: '8px' }}>\r\n <Typography variant='subtitle2'>For Debug - Current Filter State:</Typography>\r\n <pre>{JSON.stringify(this.filterState, null, 2)}</pre>\r\n </Box> */}\r\n </Context.Provider>\r\n )\r\n }\r\n }\r\n\r\n return FilterBar\r\n}\r\n\r\nconst filterbarClasses = {\r\n root: 'DinoFilterBar-root',\r\n inner: 'DinoFilterBar-inner'\r\n}\r\n\r\nconst FilterBarStyled = styled(Box)(({ theme }) => ({\r\n [`&.${filterbarClasses.root}`]: {\r\n backgroundColor: theme.palette.background.paper\r\n },\r\n [`.${filterbarClasses.inner}`]: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n gap: theme.spacing(1)\r\n }\r\n}))\r\n"],"names":["createFilterBar","configs","InputComponent","configInput","inputConfig","fields","createFilterInput","MenuComponent","configMenu","menuConfig","createFilterMenu","SummaryComponent","enableSummary","configSummary","summaryConfig","createFilterSummary","SortComponent","configSort","sortConfig","createFilterSort","defaultFilterLogic","Context","createFilterBarContext","FilterBar","props","_this","_classCallCheck","_callSuper","_defineProperty","_ref","_asyncToGenerator","_regenerator","m","_callee2","filterState","state","_t","w","_context2","p","n","setState","prev","_state$filterState","isLoading","fetchDelay","_callee","_this$props$onChange","_this$props","_context","a","onChange","call","v","_x","_x2","apply","this","arguments","value","handleChange","console","log","getInitialFilterState","_inherits","Component","_createClass","key","Object","assign","filterLogic","initialFilterState","get","_slots$summaryWrapPro","slots","_jsx","Provider","children","_jsxs","FilterBarStyled","className","filterbarClasses","root","sx","inner","before","popperProps","placement","mr","onAdd","onAddFilter","after","Box","_objectSpread","summaryWrapProps","display","alignItems","summaryBefore","flex","minWidth","summaryAfter","styled","_ref3","theme","concat","backgroundColor","palette","background","paper","gap","spacing"],"mappings":"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"}
1
+ {"version":3,"file":"index.create.js","sources":["../../../src/filter-bar/index.create.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useState, useEffect } from 'react'\r\nimport { Box, BoxProps, styled, useMediaQuery } from '@mui/material'\r\nimport { useTheme } from '@mui/material/styles'\r\nimport { fetchDelay } from '../utils'\r\nimport { createFilterBarContext } from './index.context'\r\nimport { createFilterSort } from './components/filter-sort'\r\nimport { createFilterMenu } from './components/filter-menu'\r\nimport { createFilterInput } from './components/filter-input'\r\nimport { createFilterSummary } from './components/filter-summary'\r\n// types\r\nimport type { ComponentType, FC } from 'react'\r\nimport type { TFilterState } from './types'\r\nimport type { IFilterBarContext, IFilterBarContextState } from './index.context'\r\nimport type { IFilterMenuConfig, IFilterMenuProps } from './components/filter-menu.types'\r\nimport type { IFilterSortConfig, IFilterSortProps } from './components/filter-sort.types'\r\nimport type { IFilterInputConfig, IFilterInputProps } from './components/filter-input.types'\r\nimport type { IFilterSummaryConfig, IFilterSummaryProps } from './components/filter-summary.types'\r\n\r\nexport interface IFilterBarConfigs<T> {\r\n initialFilterState?: TFilterState<T>\r\n /** Default filter logic, can be overridden by individual filters @default \"and\" */\r\n defaultFilterLogic?: 'and' | 'or'\r\n InputComponent?: ComponentType<IFilterInputProps<T>>\r\n inputConfig?: IFilterInputConfig<T>\r\n MenuComponent?: ComponentType<IFilterMenuProps<T>>\r\n menuConfig?: IFilterMenuConfig<T>\r\n sortConfig?: IFilterSortConfig<T>\r\n SortComponent?: ComponentType<IFilterSortProps<T>>\r\n /** Enable or disable the summary component. Default is true. */\r\n enableSummary?: boolean\r\n SummaryComponent?: ComponentType<IFilterSummaryProps<T>>\r\n summaryConfig?: IFilterSummaryConfig<T>\r\n}\r\n\r\nexport interface IFilterBarSlots {\r\n summaryWrapProps?: BoxProps\r\n summaryBefore?: React.ReactNode\r\n summaryAfter?: React.ReactNode\r\n before?: React.ReactNode\r\n after?: React.ReactNode\r\n}\r\n\r\nexport interface IFilterBarProps<T> {\r\n sx?: BoxProps['sx']\r\n value?: TFilterState<T>\r\n onChange?: (state: TFilterState<T>) => Promise<void> | void\r\n slots?: IFilterBarSlots\r\n}\r\n\r\ninterface IFilterBarState<T> extends IFilterBarContextState<T> {}\r\n\r\nexport function createFilterBar<T>(configs: IFilterBarConfigs<T>) {\r\n if (!configs.InputComponent) {\r\n const configInput = configs.inputConfig || { fields: {} }\r\n configs.inputConfig = configInput\r\n configs.InputComponent = createFilterInput<T>(configInput)\r\n }\r\n if (!configs.MenuComponent) {\r\n const configMenu = configs.menuConfig || { fields: {} }\r\n configs.menuConfig = configMenu\r\n configs.MenuComponent = createFilterMenu<T>(configMenu)\r\n }\r\n if (!configs.SummaryComponent && configs.enableSummary !== false) {\r\n const configSummary: IFilterSummaryConfig<T> = configs.summaryConfig || { fields: {} }\r\n configs.summaryConfig = configSummary\r\n configs.SummaryComponent = createFilterSummary<T>(configSummary)\r\n }\r\n if (!configs.SortComponent) {\r\n const configSort: IFilterSortConfig<T> = configs.sortConfig || { fields: {} }\r\n configs.sortConfig = configSort\r\n configs.SortComponent = createFilterSort<T>(configSort)\r\n }\r\n\r\n const defaultFilterLogic = configs.defaultFilterLogic || 'and'\r\n const Context = createFilterBarContext<T>()\r\n\r\n const FilterBar: FC<IFilterBarProps<T>> = (props) => {\r\n const { slots } = props\r\n const InputComponent = configs.InputComponent as ComponentType<IFilterInputProps<T>>\r\n const MenuComponent = configs.MenuComponent as ComponentType<IFilterMenuProps<T>>\r\n const SummaryComponent = configs.SummaryComponent as ComponentType<IFilterSummaryProps<T>>\r\n const SortComponent = configs.SortComponent as ComponentType<IFilterSortProps<T>>\r\n\r\n const computeInitial = (): IFilterBarState<T> => {\r\n if (props.value) return { filterState: props.value }\r\n return { filterState: Object.assign({ filterLogic: defaultFilterLogic }, configs.initialFilterState) }\r\n }\r\n\r\n const [localState, setLocalState] = useState<IFilterBarState<T>>(computeInitial)\r\n const [isLoading, setIsLoading] = useState<boolean>(false)\r\n\r\n useEffect(() => {\r\n // keep local state in sync if controlled\r\n if (props.value) setLocalState({ filterState: props.value })\r\n }, [props.value])\r\n\r\n const handleChange = async (filterState: TFilterState<T>, state?: Partial<IFilterBarState<T>>) => {\r\n try {\r\n setLocalState((prev) => ({ filterState: state?.filterState ?? prev.filterState }))\r\n setIsLoading(true)\r\n await fetchDelay(async () => props.onChange?.(filterState), 500)\r\n setIsLoading(false)\r\n } catch (error) {\r\n setIsLoading(false)\r\n throw error\r\n }\r\n }\r\n\r\n const setFilterState = (state: TFilterState<T>) => {\r\n if (props.value) {\r\n handleChange(state)\r\n return\r\n }\r\n handleChange(state, { filterState: state })\r\n }\r\n\r\n const contextValue: IFilterBarContext<T> = {\r\n filterState: props.value || localState.filterState,\r\n isLoading: isLoading,\r\n setFilterState\r\n }\r\n\r\n const theme = useTheme()\r\n const isSmall = useMediaQuery(theme.breakpoints.down('md'))\r\n\r\n return (\r\n <Context.Provider value={contextValue}>\r\n <FilterBarStyled className={filterbarClasses.root} sx={props.sx}>\r\n <div className={filterbarClasses.inner}>\r\n {slots?.before || null}\r\n <MenuComponent slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n <SortComponent slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n <InputComponent slots={{ minimalInput: isSmall, popperProps: { placement: 'bottom-start' } }} />\r\n {slots?.after || null}\r\n </div>\r\n <Box {...slots?.summaryWrapProps} sx={{ display: 'flex', alignItems: 'center', ...slots?.summaryWrapProps?.sx }}>\r\n {slots?.summaryBefore || null}\r\n <Box sx={{ flex: 1, minWidth: 0 }}>{configs.enableSummary !== false && <SummaryComponent />}</Box>\r\n {slots?.summaryAfter || null}\r\n </Box>\r\n </FilterBarStyled>\r\n </Context.Provider>\r\n )\r\n }\r\n\r\n return FilterBar\r\n}\r\n\r\nconst filterbarClasses = {\r\n root: 'DinoFilterBar-root',\r\n inner: 'DinoFilterBar-inner'\r\n}\r\n\r\nconst FilterBarStyled = styled(Box)(({ theme }) => ({\r\n [`&.${filterbarClasses.root}`]: {\r\n backgroundColor: theme.palette.background.paper,\r\n boxSizing: 'border-box'\r\n },\r\n [`.${filterbarClasses.inner}`]: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n gap: theme.spacing(1)\r\n }\r\n}))\r\n"],"names":["createFilterBar","configs","InputComponent","configInput","inputConfig","fields","createFilterInput","MenuComponent","configMenu","menuConfig","createFilterMenu","SummaryComponent","enableSummary","configSummary","summaryConfig","createFilterSummary","SortComponent","configSort","sortConfig","createFilterSort","defaultFilterLogic","Context","createFilterBarContext","props","_slots$summaryWrapPro","slots","_useState","useState","value","filterState","Object","assign","filterLogic","initialFilterState","_useState2","_slicedToArray","localState","setLocalState","_useState3","_useState4","isLoading","setIsLoading","useEffect","handleChange","_ref","_asyncToGenerator","_regenerator","m","_callee2","state","_t","w","_context2","p","n","prev","_state$filterState","fetchDelay","_callee","_props$onChange","_context","a","onChange","call","v","_x","_x2","apply","this","arguments","contextValue","setFilterState","theme","useTheme","isSmall","useMediaQuery","breakpoints","down","_jsx","Provider","children","_jsxs","FilterBarStyled","className","filterbarClasses","root","sx","inner","before","popperProps","placement","minimalInput","after","Box","_objectSpread","summaryWrapProps","display","alignItems","summaryBefore","flex","minWidth","summaryAfter","styled","_ref3","_defineProperty","concat","backgroundColor","palette","background","paper","boxSizing","gap","spacing"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{createClass as e,classCallCheck as t,defineProperty as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{createConvertToGraphQL as i,mapLogic as s,mapSortDirection as a}from"./convert-to-graphql.js";import{removeNullValues as o,isFilterStateEqual as l,setFilterToURL as h,getFilterFromURL as p}from"./helpers.js";import{createFilterBar as m}from"./index.create.js";var c=e(function e(){t(this,e),r(this,"createFilterBar",m),r(this,"createConvertToGraphQL",i),r(this,"mapLogic",s),r(this,"mapDirection",a),r(this,"removeNullValues",o),r(this,"isFilterStateEqual",l),r(this,"setFilterToURL",h),r(this,"getFilterFromURL",p)}),n=new c;export{c as DinoFilterBar,n as dinoFilterBar};
1
+ import{createClass as t,classCallCheck as e,defineProperty as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{createConvertToGraphQL as i,mapLogic as s,mapSortDirection as a}from"./convert-to-graphql.js";import{isEmptyFilterState as l,removeNullValues as o,isFilterStateEqual as h,setFilterToURL as p,getFilterFromURL as m}from"./helpers.js";import{createFilterBar as c}from"./index.create.js";var n=t(function t(){e(this,t),r(this,"createFilterBar",c),r(this,"createConvertToGraphQL",i),r(this,"mapLogic",s),r(this,"mapDirection",a),r(this,"isEmptyFilterState",l),r(this,"removeNullValues",o),r(this,"isFilterStateEqual",h),r(this,"setFilterToURL",p),r(this,"getFilterFromURL",m)}),u=new n;export{n as DinoFilterBar,u as dinoFilterBar};
2
2
  //# sourceMappingURL=index.dino.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.dino.js","sources":["../../../src/filter-bar/index.dino.tsx"],"sourcesContent":["import { createConvertToGraphQL, mapLogic, mapSortDirection } from './convert-to-graphql'\r\nimport { getFilterFromURL, isFilterStateEqual, removeNullValues, setFilterToURL } from './helpers'\r\nimport { createFilterBar } from './index.create'\r\n\r\nexport class DinoFilterBar {\r\n createFilterBar = createFilterBar as typeof createFilterBar\r\n createConvertToGraphQL = createConvertToGraphQL as typeof createConvertToGraphQL\r\n\r\n // support\r\n mapLogic = mapLogic\r\n mapDirection = mapSortDirection\r\n\r\n // helpers\r\n removeNullValues = removeNullValues\r\n isFilterStateEqual = isFilterStateEqual\r\n setFilterToURL = setFilterToURL\r\n getFilterFromURL = getFilterFromURL\r\n}\r\n\r\nexport const dinoFilterBar = new DinoFilterBar()\r\n"],"names":["DinoFilterBar","_createClass","_classCallCheck","_defineProperty","createFilterBar","createConvertToGraphQL","mapLogic","mapSortDirection","removeNullValues","isFilterStateEqual","setFilterToURL","getFilterFromURL","dinoFilterBar"],"mappings":"6XAIA,IAAaA,EAAaC,EAAA,SAAAD,IAAAE,OAAAF,GAAAG,yBACNC,GAAyCD,gCAClCE,GAEzBF,kBACWG,GAAQH,sBACJI,GAEfJ,0BACmBK,GAAgBL,4BACdM,GAAkBN,wBACtBO,GAAcP,0BACZQ,EAAgB,GAGxBC,EAAgB,IAAIZ"}
1
+ {"version":3,"file":"index.dino.js","sources":["../../../src/filter-bar/index.dino.tsx"],"sourcesContent":["import { createConvertToGraphQL, mapLogic, mapSortDirection } from './convert-to-graphql'\r\nimport { getFilterFromURL, isEmptyFilterState, isFilterStateEqual, removeNullValues, setFilterToURL } from './helpers'\r\nimport { createFilterBar } from './index.create'\r\n\r\nexport class DinoFilterBar {\r\n createFilterBar = createFilterBar as typeof createFilterBar\r\n createConvertToGraphQL = createConvertToGraphQL as typeof createConvertToGraphQL\r\n\r\n // support\r\n mapLogic = mapLogic\r\n mapDirection = mapSortDirection\r\n\r\n // helpers\r\n isEmptyFilterState = isEmptyFilterState\r\n removeNullValues = removeNullValues\r\n isFilterStateEqual = isFilterStateEqual\r\n setFilterToURL = setFilterToURL\r\n getFilterFromURL = getFilterFromURL\r\n}\r\n\r\nexport const dinoFilterBar = new DinoFilterBar()\r\n"],"names":["DinoFilterBar","_createClass","_classCallCheck","_defineProperty","createFilterBar","createConvertToGraphQL","mapLogic","mapSortDirection","isEmptyFilterState","removeNullValues","isFilterStateEqual","setFilterToURL","getFilterFromURL","dinoFilterBar"],"mappings":"qZAIA,IAAaA,EAAaC,EAAA,SAAAD,IAAAE,OAAAF,GAAAG,yBACNC,GAAyCD,gCAClCE,GAEzBF,kBACWG,GAAQH,sBACJI,GAEfJ,4BACqBK,GAAkBL,0BACpBM,GAAgBN,4BACdO,GAAkBP,wBACtBQ,GAAcR,0BACZS,EAAgB,GAGxBC,EAAgB,IAAIb"}
@@ -1,2 +1,2 @@
1
- import{jsx as o}from"react/jsx-runtime";import{useRef as e,useCallback as r}from"react";import{styled as l,ToggleButtonGroup as a,colors as i,Tooltip as n,ToggleButton as t}from"@mui/material";import u from"@mui/icons-material/ViewList";import c from"@mui/icons-material/GridView";import{DataSurfaceViewMode as m}from"./types.js";var s={sm:"small",md:"medium"},d=[{value:m.list,icon:o(u,{fontSize:"small"}),label:"List View"},{value:m.grid,icon:o(c,{fontSize:"small"}),label:"Grid View"}],v=function(l){var a=l.value,i=l.onChange,u=l.size,c=void 0===u?"md":u,m=l.className,v=l.onlyIcon,f=void 0!==v&&v,g=l.reverse,p=void 0!==g&&g,h=s[c]||"small",w=e(null),x=r(function(o){w.current&&clearTimeout(w.current),w.current=setTimeout(function(){null!==o&&o!==a&&(null==i||i(o))},250)},[a,i]),C=p?[].concat(d).reverse():d;return o(b,{className:m,size:h,value:a,exclusive:!0,onChange:function(o,e){return x(e)},"aria-label":"view mode",children:C.map(function(e){return o(n,{title:e.label,arrow:!0,children:o(t,{value:e.value,"aria-label":e.label,size:h,sx:{p:f?"5px":void 0,minWidth:f?"small"===h?36:44:void 0},children:f?e.icon:e.label})},e.value)})})},b=l(a)({flex:"0 0 auto",".MuiToggleButtonGroup-grouped":{"&.Mui-selected":{color:i.common.white,backgroundColor:"var(--color-orange, ".concat(i.blue[600],")"),borderColor:"var(--color-orange, ".concat(i.blue[600],")"),"&.MuiToggleButtonGroup-lastButton":{borderColor:"var(--color-orange, ".concat(i.blue[600],")")},"&:hover":{backgroundColor:"var(--color-orange, ".concat(i.blue[600],")")}}}});export{v as default};
1
+ import{jsx as o}from"react/jsx-runtime";import{useRef as e,useCallback as r}from"react";import{styled as l,ToggleButtonGroup as a,colors as i,Tooltip as n,ToggleButton as t}from"@mui/material";import u from"@mui/icons-material/ViewList";import c from"@mui/icons-material/GridView";import{DataSurfaceViewMode as m}from"./types.js";var s={sm:"small",md:"medium"},d=[{value:m.list,icon:o(u,{fontSize:"small"}),label:"List View"},{value:m.grid,icon:o(c,{fontSize:"small"}),label:"Grid View"}],v=function(l){var a=l.value,i=l.onChange,u=l.size,c=void 0===u?"md":u,m=l.className,v=l.onlyIcon,f=void 0!==v&&v,g=l.reverse,p=void 0!==g&&g,h=s[c]||"small",w=e(null),x=r(function(o){w.current&&clearTimeout(w.current),w.current=setTimeout(function(){null!==o&&o!==a&&(null==i||i(o))},250)},[a,i]),C=p?[].concat(d).reverse():d;return o(b,{className:m,size:h,value:a,exclusive:!0,onChange:function(o,e){return x(e)},"aria-label":"view mode",children:C.map(function(e){return o(n,{title:e.label,arrow:!0,children:o(t,{value:e.value,"aria-label":e.label,size:h,sx:{p:f?"5px":void 0,minWidth:f?"small"===h?36:44:void 0},children:f?e.icon:e.label})},e.value)})})},b=l(a)({flex:"0 0 auto",".MuiToggleButtonGroup-grouped":{"&.Mui-selected":{color:i.common.white,backgroundColor:"var(--color-orange, ".concat(i.blue[600],")"),borderColor:"var(--color-orange, ".concat(i.blue[600],")"),"&.MuiToggleButtonGroup-lastButton":{borderColor:"var(--color-orange, ".concat(i.blue[600],")")},"&:hover":{backgroundColor:"var(--color-orange, ".concat(i.blue[600],")")}}}});export{v as ButtonSwitch,v as default};
2
2
  //# sourceMappingURL=button-switch.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"button-switch.js","sources":["../../../../src/lab/data-surface/button-switch.tsx"],"sourcesContent":["import { FC, useCallback, useRef } from 'react'\r\nimport { colors, styled, ToggleButton, ToggleButtonGroup, Tooltip } from '@mui/material'\r\nimport ViewListIcon from '@mui/icons-material/ViewList'\r\nimport GridViewIcon from '@mui/icons-material/GridView'\r\nimport { DataSurfaceViewMode } from './types'\r\nimport { QueryParam } from '../../utils'\r\n\r\ntype Props = {\r\n value?: DataSurfaceViewMode\r\n onChange?: (value: DataSurfaceViewMode) => void\r\n size?: 'sm' | 'md'\r\n className?: string\r\n onlyIcon?: boolean\r\n reverse?: boolean\r\n}\r\n\r\nconst sizeMap = {\r\n sm: 'small',\r\n md: 'medium'\r\n} as const\r\n\r\nconst viewModes = [\r\n { value: DataSurfaceViewMode.list, icon: <ViewListIcon fontSize='small' />, label: 'List View' },\r\n { value: DataSurfaceViewMode.grid, icon: <GridViewIcon fontSize='small' />, label: 'Grid View' }\r\n]\r\n\r\nconst ButtonSwitch: FC<Props> = (props) => {\r\n const { value, onChange, size = 'md', className, onlyIcon = false, reverse = false } = props\r\n const muiSize = sizeMap[size] || 'small'\r\n\r\n const changeTimeoutRef = useRef<NodeJS.Timeout | null>(null)\r\n const handleChange = useCallback(\r\n (newValue: DataSurfaceViewMode | null) => {\r\n if (changeTimeoutRef.current) {\r\n clearTimeout(changeTimeoutRef.current)\r\n }\r\n changeTimeoutRef.current = setTimeout(() => {\r\n if (newValue !== null && newValue !== value) {\r\n onChange?.(newValue)\r\n }\r\n }, 250)\r\n },\r\n [value, onChange]\r\n )\r\n\r\n const displayModes = reverse ? [...viewModes].reverse() : viewModes\r\n\r\n return (\r\n <StyledToggleButtonGroup className={className} size={muiSize} value={value} exclusive onChange={(_, v) => handleChange(v)} aria-label='view mode'>\r\n {displayModes.map((mode) => (\r\n <Tooltip key={mode.value} title={mode.label} arrow>\r\n <ToggleButton\r\n value={mode.value}\r\n aria-label={mode.label}\r\n size={muiSize}\r\n sx={{\r\n p: onlyIcon ? '5px' : undefined,\r\n minWidth: onlyIcon ? (muiSize === 'small' ? 36 : 44) : undefined\r\n }}\r\n >\r\n {onlyIcon ? mode.icon : mode.label}\r\n </ToggleButton>\r\n </Tooltip>\r\n ))}\r\n </StyledToggleButtonGroup>\r\n )\r\n}\r\n\r\nconst StyledToggleButtonGroup = styled(ToggleButtonGroup)({\r\n flex: '0 0 auto',\r\n '.MuiToggleButtonGroup-grouped': {\r\n '&.Mui-selected': {\r\n color: colors.common.white,\r\n backgroundColor: `var(--color-orange, ${colors.blue[600]})`,\r\n borderColor: `var(--color-orange, ${colors.blue[600]})`,\r\n '&.MuiToggleButtonGroup-lastButton': {\r\n borderColor: `var(--color-orange, ${colors.blue[600]})`\r\n },\r\n '&:hover': {\r\n backgroundColor: `var(--color-orange, ${colors.blue[600]})`\r\n }\r\n }\r\n }\r\n})\r\n\r\nexport default ButtonSwitch\r\n"],"names":["sizeMap","sm","md","viewModes","value","DataSurfaceViewMode","list","icon","_jsx","ViewListIcon","fontSize","label","grid","GridViewIcon","ButtonSwitch","props","onChange","_props$size","size","className","_props$onlyIcon","onlyIcon","_props$reverse","reverse","muiSize","changeTimeoutRef","useRef","handleChange","useCallback","newValue","current","clearTimeout","setTimeout","displayModes","concat","StyledToggleButtonGroup","exclusive","_","v","map","mode","Tooltip","title","arrow","children","ToggleButton","sx","p","undefined","minWidth","styled","ToggleButtonGroup","flex","color","colors","common","white","backgroundColor","blue","borderColor"],"mappings":"0UAgBA,IAAMA,EAAU,CACdC,GAAI,QACJC,GAAI,UAGAC,EAAY,CAChB,CAAEC,MAAOC,EAAoBC,KAAMC,KAAMC,EAACC,EAAa,CAAAC,SAAS,UAAYC,MAAO,aACnF,CAAEP,MAAOC,EAAoBO,KAAML,KAAMC,EAACK,EAAa,CAAAH,SAAS,UAAYC,MAAO,cAG/EG,EAA0B,SAACC,GAC/B,IAAQX,EAA+EW,EAA/EX,MAAOY,EAAwED,EAAxEC,SAAQC,EAAgEF,EAA9DG,KAAAA,OAAO,IAAHD,EAAG,KAAIA,EAAEE,EAAiDJ,EAAjDI,UAASC,EAAwCL,EAAtCM,SAAAA,OAAW,IAAHD,GAAQA,EAAAE,EAAsBP,EAApBQ,QAAAA,OAAU,IAAHD,GAAQA,EAC5EE,EAAUxB,EAAQkB,IAAS,QAE3BO,EAAmBC,EAA8B,MACjDC,EAAeC,EACnB,SAACC,GACKJ,EAAiBK,SACnBC,aAAaN,EAAiBK,SAEhCL,EAAiBK,QAAUE,WAAW,WACnB,OAAbH,GAAqBA,IAAazB,IACpCY,SAAAA,EAAWa,GAEd,EAAE,IACL,EACA,CAACzB,EAAOY,IAGJiB,EAAeV,EAAU,GAAAW,OAAI/B,GAAWoB,UAAYpB,EAE1D,OACEK,EAAC2B,EAAuB,CAAChB,UAAWA,EAAWD,KAAMM,EAASpB,MAAOA,EAAOgC,WAAU,EAAApB,SAAU,SAACqB,EAAGC,GAAC,OAAKX,EAAaW,EAAE,EAAa,aAAA,qBACnIL,EAAaM,IAAI,SAACC,GAAI,OACrBhC,EAACiC,EAAO,CAAkBC,MAAOF,EAAK7B,MAAOgC,OAAK,EAAAC,SAChDpC,EAACqC,GACCzC,MAAOoC,EAAKpC,MACA,aAAAoC,EAAK7B,MACjBO,KAAMM,EACNsB,GAAI,CACFC,EAAG1B,EAAW,WAAQ2B,EACtBC,SAAU5B,EAAwB,UAAZG,EAAsB,GAAK,QAAMwB,GAGxDJ,SAAAvB,EAAWmB,EAAKjC,KAAOiC,EAAK7B,SAVnB6B,EAAKpC,MAapB,IAGP,EAEM+B,EAA0Be,EAAOC,EAAPD,CAA0B,CACxDE,KAAM,WACN,gCAAiC,CAC/B,iBAAkB,CAChBC,MAAOC,EAAOC,OAAOC,MACrBC,gBAAe,uBAAAvB,OAAyBoB,EAAOI,KAAK,KAAO,KAC3DC,YAAW,uBAAAzB,OAAyBoB,EAAOI,KAAK,KAAO,KACvD,oCAAqC,CACnCC,YAAW,uBAAAzB,OAAyBoB,EAAOI,KAAK,KAAI,MAEtD,UAAW,CACTD,gBAAe,uBAAAvB,OAAyBoB,EAAOI,KAAK,KAAI"}
1
+ {"version":3,"file":"button-switch.js","sources":["../../../../src/lab/data-surface/button-switch.tsx"],"sourcesContent":["import { FC, useCallback, useRef } from 'react'\r\nimport { colors, styled, ToggleButton, ToggleButtonGroup, Tooltip } from '@mui/material'\r\nimport ViewListIcon from '@mui/icons-material/ViewList'\r\nimport GridViewIcon from '@mui/icons-material/GridView'\r\nimport { DataSurfaceViewMode } from './types'\r\n\r\nexport interface IButtonSwitchProps {\r\n value?: DataSurfaceViewMode\r\n onChange?: (value: DataSurfaceViewMode) => void\r\n size?: 'sm' | 'md'\r\n className?: string\r\n onlyIcon?: boolean\r\n reverse?: boolean\r\n}\r\n\r\nconst sizeMap = { sm: 'small', md: 'medium' } as const\r\n\r\nconst viewModes = [\r\n { value: DataSurfaceViewMode.list, icon: <ViewListIcon fontSize='small' />, label: 'List View' },\r\n { value: DataSurfaceViewMode.grid, icon: <GridViewIcon fontSize='small' />, label: 'Grid View' }\r\n]\r\n\r\nexport const ButtonSwitch: FC<IButtonSwitchProps> = (props) => {\r\n const { value, onChange, size = 'md', className, onlyIcon = false, reverse = false } = props\r\n const muiSize = sizeMap[size] || 'small'\r\n\r\n const changeTimeoutRef = useRef<NodeJS.Timeout | null>(null)\r\n const handleChange = useCallback(\r\n (newValue: DataSurfaceViewMode | null) => {\r\n if (changeTimeoutRef.current) {\r\n clearTimeout(changeTimeoutRef.current)\r\n }\r\n changeTimeoutRef.current = setTimeout(() => {\r\n if (newValue !== null && newValue !== value) {\r\n onChange?.(newValue)\r\n }\r\n }, 250)\r\n },\r\n [value, onChange]\r\n )\r\n\r\n const displayModes = reverse ? [...viewModes].reverse() : viewModes\r\n\r\n return (\r\n <StyledToggleButtonGroup className={className} size={muiSize} value={value} exclusive onChange={(_, v) => handleChange(v)} aria-label='view mode'>\r\n {displayModes.map((mode) => (\r\n <Tooltip key={mode.value} title={mode.label} arrow>\r\n <ToggleButton\r\n value={mode.value}\r\n aria-label={mode.label}\r\n size={muiSize}\r\n sx={{\r\n p: onlyIcon ? '5px' : undefined,\r\n minWidth: onlyIcon ? (muiSize === 'small' ? 36 : 44) : undefined\r\n }}\r\n >\r\n {onlyIcon ? mode.icon : mode.label}\r\n </ToggleButton>\r\n </Tooltip>\r\n ))}\r\n </StyledToggleButtonGroup>\r\n )\r\n}\r\n\r\nexport default ButtonSwitch\r\n\r\nconst StyledToggleButtonGroup = styled(ToggleButtonGroup)({\r\n flex: '0 0 auto',\r\n '.MuiToggleButtonGroup-grouped': {\r\n '&.Mui-selected': {\r\n color: colors.common.white,\r\n backgroundColor: `var(--color-orange, ${colors.blue[600]})`,\r\n borderColor: `var(--color-orange, ${colors.blue[600]})`,\r\n '&.MuiToggleButtonGroup-lastButton': {\r\n borderColor: `var(--color-orange, ${colors.blue[600]})`\r\n },\r\n '&:hover': {\r\n backgroundColor: `var(--color-orange, ${colors.blue[600]})`\r\n }\r\n }\r\n }\r\n})\r\n"],"names":["sizeMap","sm","md","viewModes","value","DataSurfaceViewMode","list","icon","_jsx","ViewListIcon","fontSize","label","grid","GridViewIcon","ButtonSwitch","props","onChange","_props$size","size","className","_props$onlyIcon","onlyIcon","_props$reverse","reverse","muiSize","changeTimeoutRef","useRef","handleChange","useCallback","newValue","current","clearTimeout","setTimeout","displayModes","concat","StyledToggleButtonGroup","exclusive","_","v","map","mode","Tooltip","title","arrow","children","ToggleButton","sx","p","undefined","minWidth","styled","ToggleButtonGroup","flex","color","colors","common","white","backgroundColor","blue","borderColor"],"mappings":"0UAeA,IAAMA,EAAU,CAAEC,GAAI,QAASC,GAAI,UAE7BC,EAAY,CAChB,CAAEC,MAAOC,EAAoBC,KAAMC,KAAMC,EAACC,EAAa,CAAAC,SAAS,UAAYC,MAAO,aACnF,CAAEP,MAAOC,EAAoBO,KAAML,KAAMC,EAACK,EAAa,CAAAH,SAAS,UAAYC,MAAO,cAGxEG,EAAuC,SAACC,GACnD,IAAQX,EAA+EW,EAA/EX,MAAOY,EAAwED,EAAxEC,SAAQC,EAAgEF,EAA9DG,KAAAA,OAAO,IAAHD,EAAG,KAAIA,EAAEE,EAAiDJ,EAAjDI,UAASC,EAAwCL,EAAtCM,SAAAA,OAAW,IAAHD,GAAQA,EAAAE,EAAsBP,EAApBQ,QAAAA,OAAU,IAAHD,GAAQA,EAC5EE,EAAUxB,EAAQkB,IAAS,QAE3BO,EAAmBC,EAA8B,MACjDC,EAAeC,EACnB,SAACC,GACKJ,EAAiBK,SACnBC,aAAaN,EAAiBK,SAEhCL,EAAiBK,QAAUE,WAAW,WACnB,OAAbH,GAAqBA,IAAazB,IACpCY,SAAAA,EAAWa,GAEd,EAAE,IACL,EACA,CAACzB,EAAOY,IAGJiB,EAAeV,EAAU,GAAAW,OAAI/B,GAAWoB,UAAYpB,EAE1D,OACEK,EAAC2B,EAAuB,CAAChB,UAAWA,EAAWD,KAAMM,EAASpB,MAAOA,EAAOgC,WAAU,EAAApB,SAAU,SAACqB,EAAGC,GAAC,OAAKX,EAAaW,EAAE,EAAa,aAAA,qBACnIL,EAAaM,IAAI,SAACC,GAAI,OACrBhC,EAACiC,EAAO,CAAkBC,MAAOF,EAAK7B,MAAOgC,OAAK,EAAAC,SAChDpC,EAACqC,GACCzC,MAAOoC,EAAKpC,MACA,aAAAoC,EAAK7B,MACjBO,KAAMM,EACNsB,GAAI,CACFC,EAAG1B,EAAW,WAAQ2B,EACtBC,SAAU5B,EAAwB,UAAZG,EAAsB,GAAK,QAAMwB,GAGxDJ,SAAAvB,EAAWmB,EAAKjC,KAAOiC,EAAK7B,SAVnB6B,EAAKpC,MAapB,IAGP,EAIM+B,EAA0Be,EAAOC,EAAPD,CAA0B,CACxDE,KAAM,WACN,gCAAiC,CAC/B,iBAAkB,CAChBC,MAAOC,EAAOC,OAAOC,MACrBC,gBAAe,uBAAAvB,OAAyBoB,EAAOI,KAAK,KAAO,KAC3DC,YAAW,uBAAAzB,OAAyBoB,EAAOI,KAAK,KAAO,KACvD,oCAAqC,CACnCC,YAAW,uBAAAzB,OAAyBoB,EAAOI,KAAK,KAAI,MAEtD,UAAW,CACTD,gBAAe,uBAAAvB,OAAyBoB,EAAOI,KAAK,KAAI"}
@@ -1,2 +1,2 @@
1
- import{createClass as t,classCallCheck as e,defineProperty as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{setViewModeToURL as r,getViewModeFromURL as o,setPaginationToURL as s,getPaginationFromURL as a}from"./helpers.js";import{createViewGrid as n}from"./view-grid.js";import h from"./button-switch.js";import{createDataSurface as c}from"./index.create.js";var m=t(function t(){e(this,t),i(this,"createDataSurface",c),i(this,"createViewGrid",n),i(this,"ButtonSwitch",h),i(this,"createButtonSwitch",function(){return h}),i(this,"setViewModeToURL",r),i(this,"getViewModeFromURL",o),i(this,"setPaginationToURL",s),i(this,"getPaginationFromURL",a)}),l=new m;export{m as DinoDataSurFace,l as dinoDataSurface};
1
+ import{createClass as t,classCallCheck as e,defineProperty as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{setViewModeToURL as r,getViewModeFromURL as o,setPaginationToURL as s,getPaginationFromURL as a}from"./helpers.js";import{createViewGrid as n}from"./view-grid.js";import{ButtonSwitch as h}from"./button-switch.js";import{createDataSurface as c}from"./index.create.js";var m=t(function t(){e(this,t),i(this,"createDataSurface",c),i(this,"createViewGrid",n),i(this,"ButtonSwitch",h),i(this,"createButtonSwitch",function(){return h}),i(this,"setViewModeToURL",r),i(this,"getViewModeFromURL",o),i(this,"setPaginationToURL",s),i(this,"getPaginationFromURL",a)}),l=new m;export{m as DinoDataSurFace,l as dinoDataSurface};
2
2
  //# sourceMappingURL=index.dino.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.dino.js","sources":["../../../../src/lab/data-surface/index.dino.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nimport { setViewModeToURL, getViewModeFromURL, setPaginationToURL, getPaginationFromURL } from './helpers'\r\nimport createViewGrid from './view-grid'\r\nimport ButtonSwitch from './button-switch'\r\nimport createDataSurface from './index.create'\r\n\r\nexport class DinoDataSurFace {\r\n createDataSurface = createDataSurface\r\n createViewGrid = createViewGrid\r\n ButtonSwitch = ButtonSwitch\r\n createButtonSwitch = () => ButtonSwitch\r\n\r\n // helpers\r\n setViewModeToURL = setViewModeToURL\r\n getViewModeFromURL = getViewModeFromURL\r\n setPaginationToURL = setPaginationToURL\r\n getPaginationFromURL = getPaginationFromURL\r\n}\r\n\r\nexport const dinoDataSurface = new DinoDataSurFace()\r\n"],"names":["DinoDataSurFace","_createClass","_classCallCheck","_defineProperty","createDataSurface","createViewGrid","ButtonSwitch","this","setViewModeToURL","getViewModeFromURL","setPaginationToURL","getPaginationFromURL","dinoDataSurface"],"mappings":"uXAOA,IAAaA,EAAeC,EAAA,SAAAD,IAAAE,OAAAF,GAAAG,2BACNC,GAAiBD,wBACpBE,GAAcF,sBAChBG,GAAYH,EACNI,KAAA,qBAAA,WAAA,OAAMD,CAAY,GAEvCH,0BACmBK,GAAgBL,4BACdM,GAAkBN,4BAClBO,GAAkBP,8BAChBQ,EAAoB,GAGhCC,EAAkB,IAAIZ"}
1
+ {"version":3,"file":"index.dino.js","sources":["../../../../src/lab/data-surface/index.dino.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nimport { setViewModeToURL, getViewModeFromURL, setPaginationToURL, getPaginationFromURL } from './helpers'\r\nimport createViewGrid from './view-grid'\r\nimport ButtonSwitch from './button-switch'\r\nimport createDataSurface from './index.create'\r\n\r\nexport class DinoDataSurFace {\r\n createDataSurface = createDataSurface\r\n createViewGrid = createViewGrid\r\n ButtonSwitch = ButtonSwitch\r\n createButtonSwitch = () => ButtonSwitch\r\n\r\n // helpers\r\n setViewModeToURL = setViewModeToURL\r\n getViewModeFromURL = getViewModeFromURL\r\n setPaginationToURL = setPaginationToURL\r\n getPaginationFromURL = getPaginationFromURL\r\n}\r\n\r\nexport const dinoDataSurface = new DinoDataSurFace()\r\n"],"names":["DinoDataSurFace","_createClass","_classCallCheck","_defineProperty","createDataSurface","createViewGrid","ButtonSwitch","this","setViewModeToURL","getViewModeFromURL","setPaginationToURL","getPaginationFromURL","dinoDataSurface"],"mappings":"uYAOA,IAAaA,EAAeC,EAAA,SAAAD,IAAAE,OAAAF,GAAAG,2BACNC,GAAiBD,wBACpBE,GAAcF,sBAChBG,GAAYH,EACNI,KAAA,qBAAA,WAAA,OAAMD,CAAY,GAEvCH,0BACmBK,GAAgBL,4BACdM,GAAkBN,4BAClBO,GAAkBP,8BAChBQ,EAAoB,GAGhCC,EAAkB,IAAIZ"}
@@ -4,6 +4,7 @@ export declare function createFilterInput<T>(config: IFilterInputConfig<T>): FC<
4
4
  export declare const filterInputClasses: {
5
5
  root: string;
6
6
  rootInner: string;
7
+ button: string;
7
8
  input: string;
8
9
  focus: string;
9
10
  beforeInput: string;
@@ -0,0 +1,7 @@
1
+ import type { FC } from 'react';
2
+ export interface IMobileSearchButtonProps {
3
+ placeholder?: string;
4
+ onSearching?: (keyword: string) => void;
5
+ }
6
+ export declare const MobileSearchButton: FC<IMobileSearchButtonProps>;
7
+ export default MobileSearchButton;
@@ -36,16 +36,20 @@ export interface IFilterInputLayoutSlots {
36
36
  beforeInput?: ReactNode;
37
37
  afterInput?: ReactNode;
38
38
  }
39
- export interface IFilterInputConfig<T> extends IFilterInputLayoutSlots {
39
+ export interface IFilterInputBase {
40
+ minimalInput?: boolean;
41
+ }
42
+ export interface IFilterInputConfig<T> extends IFilterInputBase, IFilterInputLayoutSlots {
40
43
  fields: TFieldInputConfigs<T>;
41
44
  matches?: TFieldMatchConfigs<T>;
42
45
  enableQuickSearch?: boolean;
43
46
  }
44
- export interface IFilterInputSlots extends IFilterInputLayoutSlots {
47
+ export interface IFilterInputSlots extends IFilterInputBase, IFilterInputLayoutSlots {
45
48
  popperProps?: Partial<PopperProps>;
46
49
  rootProps?: BoxProps;
47
50
  }
48
51
  export interface IFilterInputProps<T> {
49
52
  onAdd?: (key: TFieldType<T>, value: any, modal?: Record<TFieldType<T>, any>) => void;
53
+ sx?: BoxProps['sx'];
50
54
  slots?: IFilterInputSlots;
51
55
  }
@@ -2,11 +2,14 @@ import type { FC } from 'react';
2
2
  import type { IconButtonProps } from '@mui/material';
3
3
  import type { IFieldInputConfig, IFilterInputConfig } from './filter-input.types';
4
4
  export declare function getFieldsByMatches<T>(config: IFilterInputConfig<T>, keywords: string): IFieldInputConfig<T>[];
5
+ interface InputAdornmentLeftProps {
6
+ onSearch?: IconButtonProps['onClick'];
7
+ }
8
+ export declare const InputAdornmentLeft: FC<InputAdornmentLeftProps>;
5
9
  interface InputAdornmentRightProps {
6
10
  hasKeyword?: boolean;
7
11
  onSubmit?: IconButtonProps['onClick'];
8
12
  onClear?: IconButtonProps['onClick'];
9
- onSearch?: IconButtonProps['onClick'];
10
13
  }
11
14
  export declare const InputAdornmentRight: FC<InputAdornmentRightProps>;
12
15
  export {};
@@ -8,6 +8,11 @@ export interface IFilterStateQueryParams {
8
8
  * @vi Loai bo cac gia tri null/undefined khoi object mot cach de quy de so sanh chinh xac.
9
9
  */
10
10
  export declare function removeNullValues<T = any>(obj: T): T | undefined;
11
+ /**
12
+ * @en Check if filter state is empty (no filters applied). Null/undefined values are ignored in this check.
13
+ * @vi Kiem tra xem filter state co rong khong (khong co filter nao duoc ap dung). Gia tri null/undefined se duoc bo qua trong kiem tra nay.
14
+ */
15
+ export declare function isEmptyFilterState<T>(state?: TFilterState<T>): boolean;
11
16
  /**
12
17
  * @en Deep comparison of two filter states to check if they are equal.
13
18
  * @vi So sanh sau hai filter state de kiem tra xem chung co bang nhau khong.
@@ -1,7 +1,6 @@
1
1
  import { BoxProps } from '@mui/material';
2
- import type { ComponentType } from 'react';
2
+ import type { ComponentType, FC } from 'react';
3
3
  import type { TFilterState } from './types';
4
- import type { IFilterBarContextState } from './index.context';
5
4
  import type { IFilterMenuConfig, IFilterMenuProps } from './components/filter-menu.types';
6
5
  import type { IFilterSortConfig, IFilterSortProps } from './components/filter-sort.types';
7
6
  import type { IFilterInputConfig, IFilterInputProps } from './components/filter-input.types';
@@ -34,39 +33,4 @@ export interface IFilterBarProps<T> {
34
33
  onChange?: (state: TFilterState<T>) => Promise<void> | void;
35
34
  slots?: IFilterBarSlots;
36
35
  }
37
- interface IFilterBarState<T> extends IFilterBarContextState<T> {
38
- }
39
- export declare function createFilterBar<T>(configs: IFilterBarConfigs<T>): {
40
- new (props: IFilterBarProps<T>): {
41
- getInitialFilterState(): IFilterBarState<T>;
42
- readonly filterState: TFilterState<T>;
43
- readonly isLoading: boolean;
44
- handleChange: (filterState: TFilterState<T>, state?: Partial<IFilterBarState<T>>) => Promise<void>;
45
- setFilterState: (state: TFilterState<T>) => void;
46
- onAddFilter: () => void;
47
- onAddRemove: () => void;
48
- render(): import("react/jsx-runtime").JSX.Element;
49
- context: unknown;
50
- setState<K extends keyof IFilterBarState<T>>(state: IFilterBarState<T> | ((prevState: Readonly<IFilterBarState<T>>, props: Readonly<IFilterBarProps<T>>) => IFilterBarState<T> | Pick<IFilterBarState<T>, K> | null) | Pick<IFilterBarState<T>, K> | null, callback?: (() => void) | undefined): void;
51
- forceUpdate(callback?: (() => void) | undefined): void;
52
- readonly props: Readonly<IFilterBarProps<T>>;
53
- state: Readonly<IFilterBarState<T>>;
54
- refs: {
55
- [key: string]: import("react").ReactInstance;
56
- };
57
- componentDidMount?(): void;
58
- shouldComponentUpdate?(nextProps: Readonly<IFilterBarProps<T>>, nextState: Readonly<IFilterBarState<T>>, nextContext: any): boolean;
59
- componentWillUnmount?(): void;
60
- componentDidCatch?(error: Error, errorInfo: import("react").ErrorInfo): void;
61
- getSnapshotBeforeUpdate?(prevProps: Readonly<IFilterBarProps<T>>, prevState: Readonly<IFilterBarState<T>>): any;
62
- componentDidUpdate?(prevProps: Readonly<IFilterBarProps<T>>, prevState: Readonly<IFilterBarState<T>>, snapshot?: any): void;
63
- componentWillMount?(): void;
64
- UNSAFE_componentWillMount?(): void;
65
- componentWillReceiveProps?(nextProps: Readonly<IFilterBarProps<T>>, nextContext: any): void;
66
- UNSAFE_componentWillReceiveProps?(nextProps: Readonly<IFilterBarProps<T>>, nextContext: any): void;
67
- componentWillUpdate?(nextProps: Readonly<IFilterBarProps<T>>, nextState: Readonly<IFilterBarState<T>>, nextContext: any): void;
68
- UNSAFE_componentWillUpdate?(nextProps: Readonly<IFilterBarProps<T>>, nextState: Readonly<IFilterBarState<T>>, nextContext: any): void;
69
- };
70
- contextType?: import("react").Context<any> | undefined;
71
- };
72
- export {};
36
+ export declare function createFilterBar<T>(configs: IFilterBarConfigs<T>): FC<IFilterBarProps<T>>;
@@ -1,10 +1,11 @@
1
- import { getFilterFromURL, isFilterStateEqual, removeNullValues, setFilterToURL } from './helpers';
1
+ import { getFilterFromURL, isEmptyFilterState, isFilterStateEqual, removeNullValues, setFilterToURL } from './helpers';
2
2
  import { createFilterBar } from './index.create';
3
3
  export declare class DinoFilterBar {
4
4
  createFilterBar: typeof createFilterBar;
5
5
  createConvertToGraphQL: <TSource extends Record<string, any>, TTarget extends object>(state: import("./types").TFilterState<TSource>) => import("./convert-to-graphql").TableFileterConverter<TSource, TTarget>;
6
6
  mapLogic: (logic?: import("./types").TLogic | undefined) => "Or" | "And";
7
7
  mapDirection: (direction?: import("./types").TDirection | undefined) => "ASC" | "DESC";
8
+ isEmptyFilterState: typeof isEmptyFilterState;
8
9
  removeNullValues: typeof removeNullValues;
9
10
  isFilterStateEqual: typeof isFilterStateEqual;
10
11
  setFilterToURL: typeof setFilterToURL;
@@ -1,12 +1,12 @@
1
1
  import { FC } from 'react';
2
2
  import { DataSurfaceViewMode } from './types';
3
- type Props = {
3
+ export interface IButtonSwitchProps {
4
4
  value?: DataSurfaceViewMode;
5
5
  onChange?: (value: DataSurfaceViewMode) => void;
6
6
  size?: 'sm' | 'md';
7
7
  className?: string;
8
8
  onlyIcon?: boolean;
9
9
  reverse?: boolean;
10
- };
11
- declare const ButtonSwitch: FC<Props>;
10
+ }
11
+ export declare const ButtonSwitch: FC<IButtonSwitchProps>;
12
12
  export default ButtonSwitch;
@@ -4,3 +4,4 @@ export * from './index.create';
4
4
  export * from './view-list.types';
5
5
  export * from './view-grid.types';
6
6
  export * from './index.dino';
7
+ export * from './button-switch';
@@ -5,22 +5,8 @@ import createDataSurface from './index.create';
5
5
  export declare class DinoDataSurFace {
6
6
  createDataSurface: typeof createDataSurface;
7
7
  createViewGrid: typeof createViewGrid;
8
- ButtonSwitch: import("react").FC<{
9
- value?: "grid" | "list" | undefined;
10
- onChange?: ((value: "grid" | "list") => void) | undefined;
11
- size?: "sm" | "md" | undefined;
12
- className?: string | undefined;
13
- onlyIcon?: boolean | undefined;
14
- reverse?: boolean | undefined;
15
- }>;
16
- createButtonSwitch: () => import("react").FC<{
17
- value?: "grid" | "list" | undefined;
18
- onChange?: ((value: "grid" | "list") => void) | undefined;
19
- size?: "sm" | "md" | undefined;
20
- className?: string | undefined;
21
- onlyIcon?: boolean | undefined;
22
- reverse?: boolean | undefined;
23
- }>;
8
+ ButtonSwitch: import("react").FC<import("./button-switch").IButtonSwitchProps>;
9
+ createButtonSwitch: () => import("react").FC<import("./button-switch").IButtonSwitchProps>;
24
10
  setViewModeToURL: typeof setViewModeToURL;
25
11
  getViewModeFromURL: typeof getViewModeFromURL;
26
12
  setPaginationToURL: typeof setPaginationToURL;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "dinocollab-core",
3
- "version": "2.2.4",
3
+ "version": "2.2.6",
4
4
  "description": "Dinocollab core - libraries for building collaborative applications with React 18",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",