@progress/kendo-react-grid/toolbar-tools/GridToolbarFilter.js

React Data Grid (Table) provides 100+ ready-to-use data grid features. KendoReact Grid package

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2025 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Oe=require("react"),Ae=require("react-dom"),E=require("@progress/kendo-react-common"),Pe=require("../columnMenu/GridColumnMenuItem.js"),Ne=require("../columnMenu/GridColumnMenuItemContent.js"),Le=require("../columnMenu/GridColumnMenuItemGroup.js"),Ue=require("../utils/GridContext.js"),U=require("@progress/kendo-svg-icons"),d=require("../filterCommon.js"),y=require("@progress/kendo-react-buttons"),Ve=require("../columnMenu/GridColumnMenuFilterUI.js"),u=require("../messages/index.js"),_e=require("@progress/kendo-react-intl"),k=require("../columnMenu/GridColumnMenuFilter.js"),je=require("@progress/kendo-react-popup"),de=require("@progress/kendo-react-indicators"),ze=require("./adaptiveContext/GridToolbarAdaptiveContext.js"),Ke=require("./adaptiveContent/GridAdaptiveToolbarFilter.js");function He(i){const l=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(i){for(const m in i)if(m!=="default"){const h=Object.getOwnPropertyDescriptor(i,m);Object.defineProperty(l,m,h.get?h:{enumerable:!0,get:()=>i[m]})}}return l.default=i,Object.freeze(l)}const t=He(Oe),me=i=>{var re,oe,le,ne,ie,ae,se;const l=t.useContext(Ue.GridContext),m=l.columnsRef,h=l.filter,v=l.defaultFilter,[S,M]=t.useState(!1),[ge,b]=t.useState(!1),[p,D]=t.useState((m==null?void 0:m.map(e=>({column:e,expanded:!1})))||[]),[pe,V]=t.useState(!1),F=t.useRef(null),B=t.useRef(null),_=t.useRef(null),w=t.useRef(0),r=t.useRef(null),g=_e.useLocalization(),Fe=E.useDocument(F),j=t.useMemo(()=>(m==null?void 0:m.filter(e=>{var o;return(o=e.title||e.field)==null?void 0:o.toLowerCase()}))||[],[m]);t.useEffect(()=>{b(!!(v||h))},[v,h]);const z=t.useCallback(e=>{const o=v&&v.filters.some(a=>a.field===e.field);return t.createElement(t.Fragment,null,e.title||e.field,o&&t.createElement("span",{className:"k-columnmenu-indicators"},t.createElement(E.SvgIcon,{key:1,icon:U.filterIcon})))},[v]),K=(e,o)=>{D(a=>(r.current=o,a.map(n=>n.column.field===o.field?{...n,expanded:!n.expanded}:{...n,expanded:!1}))),G(H()),V(!pe)},H=()=>{var o,a,n,c,ce,ue;let e;if(r!=null&&r.current&&((o=r==null?void 0:r.current)!=null&&o.field)){const qe=d.getFilterType((a=r==null?void 0:r.current)==null?void 0:a.filter),C=d.getDefaultOperator(l.filterOperators,qe);e=k.filterGroupByField((n=r==null?void 0:r.current)==null?void 0:n.field,l.filter),e=e?{...e,filters:e.filters.map(L=>({...L}))}:{logic:"and",filters:[{field:(c=r==null?void 0:r.current)==null?void 0:c.field,operator:C,value:d.IsUnaryFilter(C)?null:void 0},{field:(ce=r==null?void 0:r.current)==null?void 0:ce.field,operator:C,value:d.IsUnaryFilter(C)?null:void 0}]},e.filters.filter(L=>{var fe;return L.field===((fe=r==null?void 0:r.current)==null?void 0:fe.field)}).length===1&&e.filters.splice(1,0,{field:(ue=r==null?void 0:r.current)==null?void 0:ue.field,operator:C})}return e},he=e=>{J(0,e)},ve=e=>{J(1,e)},J=(e,o)=>{const a=f.filters.map((n,c)=>c===e?{...n,value:o.value||"",operator:o.operator||T[c].operator}:n);G({...f,filters:a})},[f,G]=t.useState(H()),s=f==null?void 0:f.filters,I=d.getFilterType((re=r==null?void 0:r.current)==null?void 0:re.filter),T=d.operatorMap(l.filterOperators[I],g),Q=d.operatorMap(d.booleanFilterValues,g),be={field:(oe=r==null?void 0:r.current)==null?void 0:oe.field,value:s==null?void 0:s[0].value,operator:s==null?void 0:s[0].operator,operators:T,booleanValues:Q,onChange:he,filterType:I},Ce={field:(le=r==null?void 0:r.current)==null?void 0:le.field,value:s==null?void 0:s[1].value,operator:s==null?void 0:s[1].operator,operators:T,booleanValues:Q,onChange:ve,filterType:I},Ee=e=>{let o=e.target.value;e.target.tagName==="SPAN"&&(o=e.target.parentElement.value),G({...f,logic:o})},W=f==null?void 0:f.logic,X=d.operatorMap(d.filterLogicList,g),q={value:X.find(e=>e.operator===(W===null?"":W)),onChange:Ee,data:X},ke=i.hideSecondFilter!==void 0?i.hideSecondFilter:d.defaultHideSecondFilter[I],O=i.filterUI,A={firstFilterProps:be,secondFilterProps:Ce,logicData:q.data,logicValue:q.value,onLogicChange:q.onChange,hideSecondFilter:ke},Y=()=>({...f,filters:f==null?void 0:f.filters.filter(e=>e.value!==void 0&&e.value!==null&&e.value!==""||e.value===null&&e.operator)}),P=((ie=(ne=Y())==null?void 0:ne.filters)==null?void 0:ie.length)!==0||d.IsUnaryFilter(s==null?void 0:s[0].operator)||d.IsUnaryFilter(s==null?void 0:s[1].operator),Z=e=>{if(e.preventDefault(),!l.filterChange)return;const o=k.rootFilterOrDefault(l.filter),a={...o,filters:o.filters.filter(n=>{var c;return n.field!==((c=r==null?void 0:r.current)==null?void 0:c.field)})};P&&a.filters.push(Y()),l.filterChange(a,e),b(!0),M(!1)},$=e=>{if(e.preventDefault(),!l.filterChange)return;const o=k.rootFilterOrDefault(l.filter),a=o.filters.filter(n=>{var c;return n.field!==((c=r==null?void 0:r.current)==null?void 0:c.field)});a.length===0?l.filterChange(null,e):l.filterChange({...o,filters:a},e),i.onCloseMenu&&i.onCloseMenu(),b(!1),D(n=>n.map(c=>({...c,expanded:!1})))},Me=()=>{V(!1)},Ie=e=>{e.preventDefault(),M(!S)},ye=e=>{!e.isAnchorClicked&&M(!1)},N=t.useMemo(()=>i.show!==void 0?i.show:S,[i.show,S]),Se=e=>{const o=E.getActiveElement(document);clearTimeout(w.current),w.current=window.setTimeout(()=>{!l.mobileMode&&o&&e.relatedTarget!==F.current&&B.current&&!B.current.contains(o)&&x()})},x=()=>{var e;i.onCloseMenu&&i.onCloseMenu(),M(!1),F.current&&((e=F.current.element)==null||e.focus())},De=()=>{clearTimeout(w.current)},{onFocus:Be,onBlur:we}=E.useAsyncFocusBlur({onFocus:e=>De(),onBlur:e=>Se(e)}),Ge=e=>{var o;(o=_.current)==null||o.triggerMouseEvent(e)},Te=e=>{var o;(o=_.current)==null||o.triggerKeyboardEvent(e)},R=t.useCallback(e=>{if(e.preventDefault(),!l.filterChange)return;const o=k.rootFilterOrDefault(l.filter),a=o.filters.filter(()=>!1);a.length===0?l.filterChange(null,e):l.filterChange({...o,filters:a},e),b(!1),D(n=>n.map(c=>({...c,expanded:!1})))},[l,k.rootFilterOrDefault]),ee=t.createElement(y.Button,{ref:F,togglable:!0,selected:N,svgIcon:i.svgIcon?i.svgIcon:i.icon?void 0:U.filterIcon,icon:i.icon,size:l.mobileMode?"large":"medium",className:E.classNames("k-toolbar-button",{"k-icon-button":l.mobileMode}),title:g.toLanguageString(u.toolbarFilter,u.messages[u.toolbarFilter]),onClick:Ie},!l.mobileMode&&g.toLanguageString(u.toolbarFilter,u.messages[u.toolbarFilter])),te=t.createElement(t.Fragment,null,j.map(e=>{var o,a;return e.filterable&&t.createElement(Le.GridColumnMenuItemGroup,{key:e.id},t.createElement("div",{className:"k-expander"},t.createElement(Pe.GridColumnMenuItem,{title:z(e),expandable:!0,expanded:!!((o=p==null?void 0:p.find(n=>n.column.field===e.field))!=null&&o.expanded),onClick:n=>K(n,e)})),t.createElement(Ne.GridColumnMenuItemContent,{show:!!((a=p==null?void 0:p.find(n=>n.column.field===e.field))!=null&&a.expanded)},t.createElement("form",{className:"k-filter-menu",onSubmit:Z,onReset:$},t.createElement("div",{className:"k-filter-menu-container"},O?t.createElement(O,{...A}):t.createElement(Ve.GridColumnMenuFilterUI,{...A}),t.createElement("div",{className:"k-actions k-actions-stretched"},t.createElement(y.Button,{themeColor:"primary",disabled:!P},g.toLanguageString(u.filterSubmitButton,u.messages[u.filterSubmitButton])),t.createElement(y.Button,{type:"reset"},g.toLanguageString(u.filterClearButton,u.messages[u.filterClearButton])))))))}),t.createElement("div",{className:"k-actions k-actions-stretched k-actions-horizontal k-column-menu-footer"},t.createElement(y.Button,{svgIcon:U.filterClearIcon,onClick:R},g.toLanguageString(u.filterClearAllButton,u.messages[u.filterClearAllButton]))));return t.createElement(t.Fragment,null,ge?t.createElement(de.BadgeContainer,null,ee,t.createElement(de.Badge,{themeColor:"primary"})):ee,l.mobileMode?t.createElement(ze.GridToolbarAdaptiveProvider,null,Ae.createPortal(t.createElement(Ke.GridAdaptiveToolbarFilter,{filtered:j,computedShow:N,expandState:p,FilterUI:O,filterUIProps:A,isFilterValid:P,renderTitle:z,onBackView:Me,clear:$,submit:Z,onClose:x,onFilterExpand:K,handleClearAllFilters:R},te),(ae=Fe())==null?void 0:ae.body)):t.createElement(je.Popup,{anchor:(se=F.current)==null?void 0:se.element,show:N,popupClass:"k-grid-columnmenu-popup",onMouseDownOutside:ye},t.createElement("div",{ref:B,onBlur:we,onFocus:Be,onMouseDown:Ge,onKeyDown:Te,className:"k-column-menu k-column-menu-md"},te)))};me.displayName="KendoReactGridToolbarFilter";exports.GridToolbarFilter=me;