@progress/kendo-react-grid/columnMenu/GridColumnMenuCheckboxFilter.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 client";
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("react"),ee=require("./GridColumnMenuItem.js"),te=require("./GridColumnMenuItemGroup.js"),ne=require("./GridColumnMenuItemContent.js"),B=require("@progress/kendo-react-inputs"),le=require("@progress/kendo-react-intl"),a=require("../messages/index.js"),V=require("@progress/kendo-data-query"),j=require("@progress/kendo-react-common"),I=require("@progress/kendo-react-buttons"),T=require("../utils/index.js"),q=require("@progress/kendo-svg-icons"),re=require("../utils/GridContext.js"),ae=require("./adaptiveContent/GridAdaptiveCheckboxFilter.js");function ie(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const h=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(o,r,h.get?h:{enumerable:!0,get:()=>e[r]})}}return o.default=e,Object.freeze(o)}const l=ie(p),z=(e,o)=>e.length!==o.length?!1:e.every((r,h)=>r===o[h]),ce={uniqueData:!0},se=e=>{const{uniqueData:o=ce.uniqueData}=e,r=l.useContext(re.GridContext),h=()=>{const t=e.column.field;return M().filters.findIndex(c=>c.filters&&c.filters.length>0&&c.filters[0].field===t)},g=(t,n)=>{const s=e.column.field||"",c=t.map(u=>T.getNestedValue(s,u));return n?c.filter((u,d)=>c.indexOf(u)===d):c},M=()=>e.filter?j.clone(e.filter):{filters:[],logic:"and"},i=l.useRef(h()),[y,_]=l.useState(e.expanded||!1),[N,x]=l.useState(!1),[G,O]=l.useState(""),[C,k]=l.useState(g(e.data,o)||[]),[$,Q]=l.useState(g(e.data,!1)||[]),[f,W]=l.useState(M());l.useEffect(()=>{const t=e.column.field||"",n=e.data.map(s=>T.getNestedValue(t,s));z(n,$)||(k(n),Q(n))},[e.column,e.data]);const D=()=>e.expanded!==void 0,H=()=>{const t=D(),n=!(t?e.expanded:y);e.onExpandChange&&e.onExpandChange(n),x(!N),!t&&!(r!=null&&r.mobileMode)&&_(n)},w=t=>{const n=e.searchBoxFilterOperator?e.searchBoxFilterOperator:"startswith",s={logic:"and",filters:[{field:e.column.field,operator:n,value:t.target.value,ignoreCase:!0}]};O(t.target.value),k(g(V.filterBy(e.data||[],s),o))},J=()=>{const t=e.searchBoxFilterOperator?e.searchBoxFilterOperator:"startswith",n={logic:"and",filters:[{field:e.column.field,operator:t,value:"",ignoreCase:!0}]};O(""),k(g(V.filterBy(e.data||[],n),o))},A=t=>{if(t.preventDefault(),!e.onFilterChange)return;const n=f||null;n!==null&&n.filters.length>0?(i.current>=0&&n.filters.splice(i.current,1),e.onFilterChange(n,t)):e.onFilterChange(null,t),e.onCloseMenu&&e.onCloseMenu()},L=t=>{if(t.preventDefault(),!e.onFilterChange)return;const n=f||null;e.onFilterChange(n,t),e.onCloseMenu&&e.onCloseMenu()},E=(t,n)=>{const s=e.column.field||"",c={...f},u=[...f.filters];let d=[];if(i.current!==-1&&c.filters[i.current].filters&&n!=="all"&&(d=c.filters[i.current].filters),t.value&&n==="all")C.forEach(S=>{d.push({field:s,operator:"eq",value:S})});else if(t.value)d.push({field:s,operator:"eq",value:n});else if(f){const S=d.findIndex(Z=>Z.value===n);d.splice(S,1)}c.logic="and",i.current!==-1?u[i.current]={logic:"or",filters:d}:u.push({logic:"or",filters:d}),(!t.value&&n==="all"||d.length===0)&&u.splice(i.current,1),c.filters=u,W(c)},P=()=>{let t=!1;if(f){const n=[...f.filters];return i.current===-1?!1:(t=C.every(s=>i.current!==-1&&n[i.current].filters?n[i.current].filters.findIndex(u=>u.value===s)>=0:!1),t)}return t},m=le.useLocalization(),{column:b}=e;if(!b||!b.field)return l.createElement("div",null);const R=D()?e.expanded:y,v=[];if(f){const t=[...f.filters];i.current=t.findIndex(n=>n.filters&&n.filters.length>0?n.filters[0].field===b.field:!1),i.current!==-1&&t[i.current].filters.length>0&&t[i.current].filters.forEach(n=>{n.field===e.column.field&&v.push(n.value)})}const K=()=>{x(!1)},U=()=>{x(!1),e.onCloseMenu&&e.onCloseMenu()},X=m.toLanguageString(a.filterClearButton,a.messages[a.filterClearButton]),Y=e.searchBox?l.createElement(e.searchBox,{value:G,onChange:w}):l.createElement("div",{className:`k-searchbox k-textbox k-input k-input-md k-input-solid ${r!=null&&r.mobileMode?"k-input-lg":"k-input-md"}`},l.createElement(j.IconWrap,{className:"k-input-icon",name:"search",icon:q.searchIcon}),l.createElement(B.Input,{className:"k-input-inner",type:"text",placeholder:m.toLanguageString(a.searchPlaceholder,a.messages[a.searchPlaceholder]),value:G,onChange:t=>w(t.nativeEvent)}),l.createElement(I.Button,{type:"button",rounded:null,className:"k-input-button",onClick:J,icon:"x","aria-label":X,svgIcon:q.xIcon})),F=v.filter((t,n)=>v.indexOf(t)===n);return l.createElement(te.GridColumnMenuItemGroup,null,!(e.alwaysExpand&&!(r!=null&&r.mobileMode))&&l.createElement("div",{className:"k-expander"},l.createElement(ee.GridColumnMenuItem,{title:m.toLanguageString(a.filterTitle,a.messages[a.filterTitle]),iconClass:"k-i-filter",svgIcon:q.filterIcon,expandable:!0,expanded:!!R,onClick:H})),r!=null&&r.mobileMode&&N?l.createElement(ae.GridAdaptiveCheckboxFilter,{onBackView:K,handleClose:U,searchBox:e.searchBox,handleCheckBoxChange:E,isAllSelected:P,currentData:C,uniqueFilterValues:F,submit:L,clear:A}):l.createElement(ne.GridColumnMenuItemContent,{show:(e.alwaysExpand||!!R)&&!(r!=null&&r.mobileMode)},l.createElement("form",{className:"k-filter-menu",onSubmit:L,onReset:A},l.createElement("div",{className:"k-filter-menu-container"},Y,l.createElement("ul",{className:"k-reset k-multicheck-wrap"},l.createElement("li",{className:"k-item k-check-all-wrap"},l.createElement(B.Checkbox,{label:m.toLanguageString(a.filterCheckAll,a.messages[a.filterCheckAll]),onChange:t=>E(t,"all"),checked:P()})),C.map((t,n)=>l.createElement("li",{className:"k-item",key:n},l.createElement(B.Checkbox,{label:String(t),onChange:s=>E(s,t),checked:F.includes(t)})))),l.createElement("div",{className:"k-filter-selected-items"},F.length+" "+m.toLanguageString(a.filterSelectedItems,a.messages[a.filterSelectedItems])),l.createElement("div",{className:"k-actions k-hstack k-justify-content-stretch"},l.createElement(I.Button,{themeColor:"primary",type:"submit"},m.toLanguageString(a.filterSubmitButton,a.messages[a.filterSubmitButton])),l.createElement(I.Button,{className:"k-button",type:"reset"},m.toLanguageString(a.filterClearButton,a.messages[a.filterClearButton])))))))};exports.GridColumnMenuCheckboxFilter=se;exports.isArrayEqual=z;