@progress/kendo-react-grid 9.0.0-develop.9 → 9.0.1-develop.1

package/cells/GridFilterCell.mjs

@@ -7,131 +7,103 @@
  */
 "use client";
 import * as o from "react";
-import { Button as h } from "@progress/kendo-react-buttons";
-import { DropDownList as p } from "@progress/kendo-react-dropdowns";
-import { TextBox as c, NumericTextBox as u } from "@progress/kendo-react-inputs";
-import { DatePicker as f } from "@progress/kendo-react-dateinputs";
-import { filterChooseOperator as n, messages as a, filterClearButton as l } from "../messages/index.mjs";
-import { provideLocalizationService as d, registerForLocalization as g } from "@progress/kendo-react-intl";
-import { filterIcon as m, filterClearIcon as C } from "@progress/kendo-svg-icons";
-import { cellInputChange as b, cellOperatorChange as v, cellBoolDropdownChange as w } from "../filterCommon.mjs";
-import { classNames as E } from "@progress/kendo-react-common";
-class R extends o.Component {
-  constructor(r) {
-    super(r), this._inputRef = o.createRef(), this.renderOperatorEditor = (i) => {
-      if (this.props.filterType === "boolean")
-        return;
-      let s;
-      const e = this.props.operators.find((t) => t.operator === this.props.operator) || null;
-      return /* @__PURE__ */ o.createElement(
-        p,
-        {
-          ref: (t) => s = t,
-          size: this.props.size,
-          value: e,
-          onChange: this.operatorChange,
-          className: "k-dropdown-operator",
-          iconClassName: "k-i-filter k-icon",
-          svgIcon: m,
-          data: this.props.operators,
-          textField: "text",
-          title: i.toLanguageString(n, a[n]),
-          popupSettings: {
-            width: "",
-            onMouseDownOutside: function(t) {
-              !t.isAnchorClicked && t.state && t.state.props.show && s && s.togglePopup();
-            }
+import { Button as z } from "@progress/kendo-react-buttons";
+import { DropDownList as m } from "@progress/kendo-react-dropdowns";
+import { TextBox as w, NumericTextBox as k } from "@progress/kendo-react-inputs";
+import { DatePicker as L } from "@progress/kendo-react-dateinputs";
+import { filterClearButton as f, messages as d, filterChooseOperator as g } from "../messages/index.mjs";
+import { useLocalization as x } from "@progress/kendo-react-intl";
+import { filterClearIcon as D, filterIcon as N } from "@progress/kendo-svg-icons";
+import { cellOperatorChange as y, cellInputChange as B, cellBoolDropdownChange as O } from "../filterCommon.mjs";
+import { classNames as S } from "@progress/kendo-react-common";
+const j = (e) => {
+  const n = o.useRef(), u = x(), h = () => {
+    if (e.filterType === "boolean")
+      return;
+    let t;
+    const r = e.operators.find((l) => l.operator === e.operator) || null;
+    return /* @__PURE__ */ o.createElement(
+      m,
+      {
+        ref: (l) => t = l,
+        size: e.size,
+        value: r,
+        onChange: C,
+        className: "k-dropdown-operator",
+        iconClassName: "k-i-filter k-icon",
+        svgIcon: N,
+        data: e.operators,
+        textField: "text",
+        title: u.toLanguageString(g, d[g]),
+        popupSettings: {
+          width: "",
+          onMouseDownOutside: function(l) {
+            !l.isAnchorClicked && l.state && l.state.props.show && t && t.togglePopup();
           }
         }
-      );
-    }, this.inputChange = this.inputChange.bind(this), this.clear = this.clear.bind(this), this.operatorChange = this.operatorChange.bind(this), this.boolDropdownChange = this.boolDropdownChange.bind(this);
-  }
-  /**
-   * @hidden
-   */
-  render() {
-    const r = d(this), i = /* @__PURE__ */ o.createElement("div", { className: "k-filtercell" }, /* @__PURE__ */ o.createElement("div", { className: "k-filtercell-wrapper" }, this.filterComponent(this.props.filterType, this.props.value, this.props.booleanValues), /* @__PURE__ */ o.createElement("div", { className: "k-filtercell-operator" }, this.renderOperatorEditor(r), " ", /* @__PURE__ */ o.createElement(
-      h,
-      {
-        size: this.props.size,
-        icon: "filter-clear",
-        svgIcon: C,
-        className: E({
-          "k-clear-button-visible": !!(!(this.props.value === null || this.props.value === "") || this.props.operator)
-        }),
-        title: r.toLanguageString(l, a[l]),
-        type: "button",
-        onClick: this.clear,
-        disabled: !(!(this.props.value === null || this.props.value === "") || this.props.operator)
       }
-    ))));
-    return this.props.render ? this.props.render.call(void 0, i, this.props) : i;
-  }
-  inputChange(r, i) {
-    b(r, i, this.props);
-  }
-  operatorChange(r) {
-    v(r, this.props.value, this.props.onChange);
-  }
-  boolDropdownChange(r) {
-    w(r, this.props.onChange);
-  }
-  clear(r) {
-    r.preventDefault(), this.props.onChange({ value: "", operator: "", syntheticEvent: r }), this._inputRef.current && (this._inputRef.current.element.value = "", setTimeout(() => {
-      this._inputRef.current.element.focus();
+    );
+  }, c = (t, r) => {
+    B(t, r, e);
+  }, C = (t) => {
+    y(t, e.value, e.onChange);
+  }, v = (t) => {
+    O(t, e.onChange);
+  }, b = (t) => {
+    t.preventDefault(), e.onChange({ value: "", operator: "", syntheticEvent: t }), n.current && (n.current.element.value = "", setTimeout(() => {
+      n.current.element.focus();
     }, 0));
-  }
-  filterComponent(r, i, s) {
-    switch (r) {
+  }, E = (t, r, l) => {
+    switch (t) {
       case "numeric":
         return /* @__PURE__ */ o.createElement(
-          u,
+          k,
           {
-            ref: this._inputRef,
-            size: this.props.size,
-            value: i,
-            onChange: (e) => {
-              this.inputChange(e.value, e.syntheticEvent);
+            ref: n,
+            size: e.size,
+            value: r,
+            onChange: (a) => {
+              c(a.value, a.syntheticEvent);
             },
-            title: this.props.title,
-            ariaLabel: this.props.ariaLabel
+            title: e.title,
+            ariaLabel: e.ariaLabel
           }
         );
       case "date":
         return /* @__PURE__ */ o.createElement(
-          f,
+          L,
           {
-            ref: this._inputRef,
-            size: this.props.size,
-            value: i,
-            onChange: (e) => {
-              this.inputChange(e.value, e.syntheticEvent);
+            ref: n,
+            size: e.size,
+            value: r,
+            onChange: (a) => {
+              c(a.value, a.syntheticEvent);
             },
-            title: this.props.title,
-            ariaLabel: this.props.ariaLabel,
+            title: e.title,
+            ariaLabel: e.ariaLabel,
             popupSettings: {
-              onMouseDownOutside: (e) => {
-                !e.isAnchorClicked && e.state && e.state.props.show && this._inputRef && this._inputRef.current.togglePopup();
+              onMouseDownOutside: (a) => {
+                !a.isAnchorClicked && a.state && a.state.props.show && n && n.current.togglePopup();
               }
             }
           }
         );
       case "boolean": {
-        const e = (t) => t == null;
+        const a = (i) => i == null;
         return /* @__PURE__ */ o.createElement(
-          p,
+          m,
           {
-            ref: this._inputRef,
-            size: this.props.size,
-            onChange: this.boolDropdownChange,
-            value: s.find((t) => t.operator === (e(i) ? "" : i)),
-            data: s,
+            ref: n,
+            size: e.size,
+            onChange: v,
+            value: l.find((i) => i.operator === (a(r) ? "" : r)),
+            data: l,
             textField: "text",
-            title: this.props.title,
-            ariaLabel: this.props.ariaLabel,
+            title: e.title,
+            ariaLabel: e.ariaLabel,
             popupSettings: {
-              onMouseDownOutside: (t) => {
-                !t.isAnchorClicked && t.state && t.state.props.show && this._inputRef && this._inputRef.current.togglePopup();
+              onMouseDownOutside: (i) => {
+                !i.isAnchorClicked && i.state && i.state.props.show && n && n.current.togglePopup();
               }
             }
           }
@@ -139,22 +111,36 @@ class R extends o.Component {
       }
       default:
         return /* @__PURE__ */ o.createElement(
-          c,
+          w,
           {
-            ref: this._inputRef,
-            size: this.props.size,
-            value: i || "",
-            onChange: (e) => {
-              this.inputChange(e.target.value, e.syntheticEvent);
+            ref: n,
+            size: e.size,
+            value: r || "",
+            onChange: (a) => {
+              c(a.target.value, a.syntheticEvent);
             },
-            title: this.props.title,
-            "aria-label": this.props.ariaLabel
+            title: e.title,
+            "aria-label": e.ariaLabel
           }
         );
     }
-  }
-}
-g(R);
+  }, s = /* @__PURE__ */ o.createElement("div", { className: "k-filtercell" }, /* @__PURE__ */ o.createElement("div", { className: "k-filtercell-wrapper" }, E(e.filterType, e.value, e.booleanValues), /* @__PURE__ */ o.createElement("div", { className: "k-filtercell-operator" }, h(), " ", /* @__PURE__ */ o.createElement(
+    z,
+    {
+      size: e.size,
+      icon: "filter-clear",
+      svgIcon: D,
+      className: S({
+        "k-clear-button-visible": !!(!(e.value === null || e.value === "") || e.operator)
+      }),
+      title: u.toLanguageString(f, d[f]),
+      type: "button",
+      onClick: b,
+      disabled: !(!(e.value === null || e.value === "") || e.operator)
+    }
+  ))));
+  return e.render ? e.render.call(void 0, s, e) : s;
+};
 export {
-  R as GridFilterCell
+  j as GridFilterCell
 };

package/columnMenu/GridColumnMenuCheckboxFilter.js

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

package/columnMenu/GridColumnMenuCheckboxFilter.mjs

@@ -6,188 +6,142 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as s from "react";
-import { GridColumnMenuItem as S } from "./GridColumnMenuItem.mjs";
-import { GridColumnMenuItemGroup as B } from "./GridColumnMenuItemGroup.mjs";
-import { GridColumnMenuItemContent as N } from "./GridColumnMenuItemContent.mjs";
-import { Input as D, Checkbox as m } from "@progress/kendo-react-inputs";
-import { provideLocalizationService as b, registerForLocalization as y } from "@progress/kendo-react-intl";
-import { searchPlaceholder as x, messages as h, filterTitle as g, filterCheckAll as F, filterSelectedItems as C, filterSubmitButton as I, filterClearButton as k } from "../messages/index.mjs";
-import { filterBy as v } from "@progress/kendo-data-query";
-import { clone as q, IconWrap as L } from "@progress/kendo-react-common";
-import { Button as p } from "@progress/kendo-react-buttons";
-import { getNestedValue as E } from "../utils/index.mjs";
-import { searchIcon as O, xIcon as w, filterIcon as M } from "@progress/kendo-svg-icons";
-const P = (f, o) => f.length !== o.length ? !1 : f.every((e, t) => e === o[t]), u = class u extends s.Component {
-  constructor(o) {
-    super(o), this.defaultFilter = () => this.props.filter ? q(this.props.filter) : { filters: [], logic: "and" }, this.isControlled = () => this.props.expanded !== void 0, this.parseData = (e, t) => {
-      const n = this.props.column.field || "", r = e.map((a) => E(n, a));
-      return t ? r.filter((a, i) => r.indexOf(a) === i) : r;
-    }, this.getFilterIndex = () => {
-      const e = this.props.column.field;
-      return this.defaultFilter().filters.findIndex(
-        (r) => r.filters && r.filters.length > 0 && r.filters[0].field === e
-      );
-    }, this.onFilterExpand = () => {
-      const e = this.isControlled(), t = !(e ? this.props.expanded : this.state.expanded);
-      this.props.onExpandChange && this.props.onExpandChange(t), e || this.setState({
-        expanded: t
-      });
-    }, this.handleSearchChange = (e) => {
-      const t = this.props.searchBoxFilterOperator ? this.props.searchBoxFilterOperator : "startswith", n = {
-        logic: "and",
-        filters: [
-          { field: this.props.column.field, operator: t, value: e.target.value, ignoreCase: !0 }
-        ]
-      };
-      this.setState({
-        value: e.target.value,
-        data: this.parseData(v(this.props.data || [], n), this.props.uniqueData)
-      });
-    }, this.handleClear = () => {
-      const e = this.props.searchBoxFilterOperator ? this.props.searchBoxFilterOperator : "startswith", t = {
-        logic: "and",
-        filters: [{ field: this.props.column.field, operator: e, value: "", ignoreCase: !0 }]
-      };
-      this.setState({
-        value: "",
-        data: this.parseData(v(this.props.data || [], t), this.props.uniqueData)
-      });
-    }, this.clear = (e) => {
-      if (e.preventDefault(), !this.props.onFilterChange)
-        return;
-      const t = this.state.currentFilter || null;
-      t !== null && t.filters.length > 0 ? (this.compositeFilterIndex >= 0 && t.filters.splice(this.compositeFilterIndex, 1), this.props.onFilterChange(t, e)) : this.props.onFilterChange(null, e), this.props.onCloseMenu && this.props.onCloseMenu();
-    }, this.submit = (e) => {
-      if (e.preventDefault(), !this.props.onFilterChange)
-        return;
-      const t = this.state.currentFilter || null;
-      this.props.onFilterChange(t, e), this.props.onCloseMenu && this.props.onCloseMenu();
-    }, this.handleCheckBoxChange = (e, t) => {
-      const n = this.props.column.field || "", r = { ...this.state.currentFilter }, a = [...this.state.currentFilter.filters];
-      let i = [];
-      if (this.compositeFilterIndex !== -1 && r.filters[this.compositeFilterIndex].filters && t !== "all" && (i = r.filters[this.compositeFilterIndex].filters), e.value && t === "all")
-        this.state.data.forEach((l) => {
-          i.push({ field: n, operator: "eq", value: l });
-        });
-      else if (e.value)
-        i.push({ field: n, operator: "eq", value: t });
-      else if (this.state.currentFilter) {
-        const l = i.findIndex((c) => c.value === t);
-        i.splice(l, 1);
-      }
-      r.logic = "and", this.compositeFilterIndex !== -1 ? a[this.compositeFilterIndex] = {
-        logic: "or",
-        filters: i
-      } : a.push({
-        logic: "or",
-        filters: i
-      }), (!e.value && t === "all" || i.length === 0) && a.splice(this.compositeFilterIndex, 1), r.filters = a, this.setState({ currentFilter: r });
-    }, this.isAllSelected = () => {
-      let e = !1;
-      if (this.state.currentFilter) {
-        const t = [...this.state.currentFilter.filters];
-        return this.compositeFilterIndex === -1 ? !1 : (e = this.state.data.every((n) => this.compositeFilterIndex !== -1 && t[this.compositeFilterIndex].filters ? t[this.compositeFilterIndex].filters.findIndex(
-          (a) => a.value === n
-        ) >= 0 : !1), e);
-      }
-      return e;
-    }, this.compositeFilterIndex = this.getFilterIndex(), this.state = {
-      expanded: o.expanded || !1,
-      value: "",
-      data: this.parseData(this.props.data, this.props.uniqueData) || [],
-      dataFromProps: this.parseData(this.props.data, !1) || [],
-      currentFilter: this.defaultFilter()
+import * as l from "react";
+import { GridColumnMenuItem as Z } from "./GridColumnMenuItem.mjs";
+import { GridColumnMenuItemGroup as _ } from "./GridColumnMenuItemGroup.mjs";
+import { GridColumnMenuItemContent as $ } from "./GridColumnMenuItemContent.mjs";
+import { Input as p, Checkbox as M } from "@progress/kendo-react-inputs";
+import { useLocalization as ee } from "@progress/kendo-react-intl";
+import { searchPlaceholder as O, messages as m, filterTitle as q, filterCheckAll as L, filterSelectedItems as w, filterSubmitButton as V, filterClearButton as G } from "../messages/index.mjs";
+import { filterBy as P } from "@progress/kendo-data-query";
+import { IconWrap as te, clone as ne } from "@progress/kendo-react-common";
+import { Button as F } from "@progress/kendo-react-buttons";
+import { getNestedValue as R } from "../utils/index.mjs";
+import { searchIcon as le, xIcon as re, filterIcon as ae } from "@progress/kendo-svg-icons";
+const ie = (e, u) => e.length !== u.length ? !1 : e.every((h, f) => h === u[f]), ce = {
+  uniqueData: !0
+}, Ee = (e) => {
+  const { uniqueData: u = ce.uniqueData } = e, h = () => {
+    const t = e.column.field;
+    return v().filters.findIndex(
+      (a) => a.filters && a.filters.length > 0 && a.filters[0].field === t
+    );
+  }, f = (t, n) => {
+    const i = e.column.field || "", a = t.map((c) => R(i, c));
+    return n ? a.filter((c, o) => a.indexOf(c) === o) : a;
+  }, v = () => e.filter ? ne(e.filter) : { filters: [], logic: "and" }, r = l.useRef(h()), [S, z] = l.useState(e.expanded || !1), [I, b] = l.useState(""), [g, x] = l.useState(f(e.data, u) || []), [A, j] = l.useState(f(e.data, !1) || []), [s, T] = l.useState(v());
+  l.useEffect(() => {
+    const t = e.column.field || "", n = e.data.map((i) => R(t, i));
+    ie(n, A) || (x(n), j(n));
+  }, [e.column, e.data]);
+  const N = () => e.expanded !== void 0, W = () => {
+    const t = N(), n = !(t ? e.expanded : S);
+    e.onExpandChange && e.onExpandChange(n), t || z(n);
+  }, B = (t) => {
+    const n = e.searchBoxFilterOperator ? e.searchBoxFilterOperator : "startswith", i = {
+      logic: "and",
+      filters: [{ field: e.column.field, operator: n, value: t.target.value, ignoreCase: !0 }]
     };
-  }
-  /**
-   * @hidden
-   */
-  componentDidUpdate() {
-    const o = this.props.column.field || "", e = this.props.data.map((t) => E(o, t));
-    P(e, this.state.dataFromProps) || this.setState({
-      data: e,
-      dataFromProps: e
-    });
-  }
-  /**
-   * @hidden
-   */
-  render() {
-    const { column: o } = this.props;
-    if (!o || !o.field)
-      return /* @__PURE__ */ s.createElement("div", null);
-    const e = b(this), t = this.isControlled() ? this.props.expanded : this.state.expanded, n = [];
-    if (this.state.currentFilter) {
-      const i = [...this.state.currentFilter.filters];
-      this.compositeFilterIndex = i.findIndex((l) => l.filters && l.filters.length > 0 ? l.filters[0].field === o.field : !1), this.compositeFilterIndex !== -1 && i[this.compositeFilterIndex].filters.length > 0 && i[this.compositeFilterIndex].filters.forEach((l) => {
-        l.field === this.props.column.field && n.push(l.value);
+    b(t.target.value), x(f(P(e.data || [], i), u));
+  }, H = () => {
+    const t = e.searchBoxFilterOperator ? e.searchBoxFilterOperator : "startswith", n = {
+      logic: "and",
+      filters: [{ field: e.column.field, operator: t, value: "", ignoreCase: !0 }]
+    };
+    b(""), x(f(P(e.data || [], n), u));
+  }, J = (t) => {
+    if (t.preventDefault(), !e.onFilterChange)
+      return;
+    const n = s || null;
+    n !== null && n.filters.length > 0 ? (r.current >= 0 && n.filters.splice(r.current, 1), e.onFilterChange(n, t)) : e.onFilterChange(null, t), e.onCloseMenu && e.onCloseMenu();
+  }, K = (t) => {
+    if (t.preventDefault(), !e.onFilterChange)
+      return;
+    const n = s || null;
+    e.onFilterChange(n, t), e.onCloseMenu && e.onCloseMenu();
+  }, D = (t, n) => {
+    const i = e.column.field || "", a = { ...s }, c = [...s.filters];
+    let o = [];
+    if (r.current !== -1 && a.filters[r.current].filters && n !== "all" && (o = a.filters[r.current].filters), t.value && n === "all")
+      g.forEach((E) => {
+        o.push({ field: i, operator: "eq", value: E });
       });
+    else if (t.value)
+      o.push({ field: i, operator: "eq", value: n });
+    else if (s) {
+      const E = o.findIndex((Y) => Y.value === n);
+      o.splice(E, 1);
     }
-    const r = this.props.searchBox ? /* @__PURE__ */ s.createElement(this.props.searchBox, { value: this.state.value, onChange: this.handleSearchChange }) : /* @__PURE__ */ s.createElement("div", { className: "k-searchbox k-textbox k-input k-input-md k-input-solid" }, /* @__PURE__ */ s.createElement(L, { className: "k-input-icon", name: "search", icon: O }), /* @__PURE__ */ s.createElement(
-      D,
-      {
-        className: "k-input-inner",
-        type: "text",
-        placeholder: e.toLanguageString(x, h[x]),
-        value: this.state.value,
-        onChange: (i) => this.handleSearchChange(i.nativeEvent)
-      }
-    ), /* @__PURE__ */ s.createElement(
-      p,
-      {
-        type: "button",
-        rounded: null,
-        className: "k-input-button",
-        onClick: this.handleClear,
-        icon: "x",
-        svgIcon: w
-      }
-    )), a = n.filter(
-      (i, l) => n.indexOf(i) === l
-    );
-    return /* @__PURE__ */ s.createElement(B, null, /* @__PURE__ */ s.createElement(
-      S,
-      {
-        title: e.toLanguageString(g, h[g]),
-        iconClass: "k-i-filter",
-        svgIcon: M,
-        onClick: this.onFilterExpand
-      }
-    ), /* @__PURE__ */ s.createElement(N, { show: !!t }, /* @__PURE__ */ s.createElement("form", { className: "k-filter-menu", onSubmit: this.submit, onReset: this.clear }, /* @__PURE__ */ s.createElement("div", { className: "k-filter-menu-container" }, r, /* @__PURE__ */ s.createElement("ul", { className: "k-reset k-multicheck-wrap" }, /* @__PURE__ */ s.createElement("li", { className: "k-item k-check-all-wrap" }, /* @__PURE__ */ s.createElement(
-      m,
-      {
-        label: e.toLanguageString(
-          F,
-          h[F]
-        ),
-        onChange: (i) => this.handleCheckBoxChange(i, "all"),
-        checked: this.isAllSelected()
-      }
-    )), this.state.data.map((i, l) => /* @__PURE__ */ s.createElement("li", { className: "k-item", key: l }, /* @__PURE__ */ s.createElement(
-      m,
-      {
-        label: String(i),
-        onChange: (c) => this.handleCheckBoxChange(c, i),
-        checked: a.includes(i)
-      }
-    )))), /* @__PURE__ */ s.createElement("div", { className: "k-filter-selected-items" }, a.length + " " + e.toLanguageString(
-      C,
-      h[C]
-    )), /* @__PURE__ */ s.createElement("div", { className: "k-actions k-hstack k-justify-content-stretch" }, /* @__PURE__ */ s.createElement(p, { themeColor: "primary", type: "submit" }, e.toLanguageString(
-      I,
-      h[I]
-    )), /* @__PURE__ */ s.createElement(p, { className: "k-button", type: "reset" }, e.toLanguageString(
-      k,
-      h[k]
-    )))))));
+    a.logic = "and", r.current !== -1 ? c[r.current] = {
+      logic: "or",
+      filters: o
+    } : c.push({
+      logic: "or",
+      filters: o
+    }), (!t.value && n === "all" || o.length === 0) && c.splice(r.current, 1), a.filters = c, T(a);
+  }, Q = () => {
+    let t = !1;
+    if (s) {
+      const n = [...s.filters];
+      return r.current === -1 ? !1 : (t = g.every((i) => r.current !== -1 && n[r.current].filters ? n[r.current].filters.findIndex(
+        (c) => c.value === i
+      ) >= 0 : !1), t);
+    }
+    return t;
+  }, d = ee(), { column: C } = e;
+  if (!C || !C.field)
+    return /* @__PURE__ */ l.createElement("div", null);
+  const U = N() ? e.expanded : S, k = [];
+  if (s) {
+    const t = [...s.filters];
+    r.current = t.findIndex((n) => n.filters && n.filters.length > 0 ? n.filters[0].field === C.field : !1), r.current !== -1 && t[r.current].filters.length > 0 && t[r.current].filters.forEach((n) => {
+      n.field === e.column.field && k.push(n.value);
+    });
   }
+  const X = e.searchBox ? /* @__PURE__ */ l.createElement(e.searchBox, { value: I, onChange: B }) : /* @__PURE__ */ l.createElement("div", { className: "k-searchbox k-textbox k-input k-input-md k-input-solid" }, /* @__PURE__ */ l.createElement(te, { className: "k-input-icon", name: "search", icon: le }), /* @__PURE__ */ l.createElement(
+    p,
+    {
+      className: "k-input-inner",
+      type: "text",
+      placeholder: d.toLanguageString(O, m[O]),
+      value: I,
+      onChange: (t) => B(t.nativeEvent)
+    }
+  ), /* @__PURE__ */ l.createElement(
+    F,
+    {
+      type: "button",
+      rounded: null,
+      className: "k-input-button",
+      onClick: H,
+      icon: "x",
+      svgIcon: re
+    }
+  )), y = k.filter((t, n) => k.indexOf(t) === n);
+  return /* @__PURE__ */ l.createElement(_, null, /* @__PURE__ */ l.createElement(
+    Z,
+    {
+      title: d.toLanguageString(q, m[q]),
+      iconClass: "k-i-filter",
+      svgIcon: ae,
+      onClick: W
+    }
+  ), /* @__PURE__ */ l.createElement($, { show: !!U }, /* @__PURE__ */ l.createElement("form", { className: "k-filter-menu", onSubmit: K, onReset: J }, /* @__PURE__ */ l.createElement("div", { className: "k-filter-menu-container" }, X, /* @__PURE__ */ l.createElement("ul", { className: "k-reset k-multicheck-wrap" }, /* @__PURE__ */ l.createElement("li", { className: "k-item k-check-all-wrap" }, /* @__PURE__ */ l.createElement(
+    M,
+    {
+      label: d.toLanguageString(L, m[L]),
+      onChange: (t) => D(t, "all"),
+      checked: Q()
+    }
+  )), g.map((t, n) => /* @__PURE__ */ l.createElement("li", { className: "k-item", key: n }, /* @__PURE__ */ l.createElement(
+    M,
+    {
+      label: String(t),
+      onChange: (i) => D(i, t),
+      checked: y.includes(t)
+    }
+  )))), /* @__PURE__ */ l.createElement("div", { className: "k-filter-selected-items" }, y.length + " " + d.toLanguageString(w, m[w])), /* @__PURE__ */ l.createElement("div", { className: "k-actions k-hstack k-justify-content-stretch" }, /* @__PURE__ */ l.createElement(F, { themeColor: "primary", type: "submit" }, d.toLanguageString(V, m[V])), /* @__PURE__ */ l.createElement(F, { className: "k-button", type: "reset" }, d.toLanguageString(G, m[G])))))));
 };
-u.defaultProps = {
-  uniqueData: !0
-};
-let d = u;
-y(d);
 export {
-  d as GridColumnMenuCheckboxFilter
+  Ee as GridColumnMenuCheckboxFilter
 };