@progress/kendo-themes-html 7.0.1-dev.1 → 7.0.2-dev.0

package/dist/esm/filter/tests/filter.js

@@ -8228,20 +8228,32 @@ ToolbarPopup.options = options49;
 ToolbarPopup.className = TOOLBARPOPUP_CLASSNAME;
 ToolbarPopup.defaultProps = defaultProps47;
 
-// src/toolbar/templates/toolbar-normal.tsx
+// src/split-button/templates/icon-split-button.tsx
 import { jsx as jsx121 } from "react/jsx-runtime";
 
-// src/toolbar/templates/toolbar-resizable.tsx
+// src/split-button/templates/icon-text-split-button.tsx
 import { jsx as jsx122 } from "react/jsx-runtime";
 
-// src/toolbar/templates/toolbar-angular-normal.tsx
+// src/split-button/templates/text-split-button.tsx
 import { jsx as jsx123 } from "react/jsx-runtime";
 
+// src/split-button/templates/split-button-popup.tsx
+import { jsx as jsx124, jsxs as jsxs52 } from "react/jsx-runtime";
+
+// src/toolbar/templates/toolbar-normal.tsx
+import { Fragment as Fragment30, jsx as jsx125, jsxs as jsxs53 } from "react/jsx-runtime";
+
+// src/toolbar/templates/toolbar-resizable.tsx
+import { jsx as jsx126 } from "react/jsx-runtime";
+
+// src/toolbar/templates/toolbar-angular-normal.tsx
+import { jsx as jsx127 } from "react/jsx-runtime";
+
 // src/toolbar/templates/toolbar-angular-resizable.tsx
-import { jsx as jsx124 } from "react/jsx-runtime";
+import { jsx as jsx128 } from "react/jsx-runtime";
 
 // src/filter/filter-preview.tsx
-import { jsx as jsx125 } from "react/jsx-runtime";
+import { jsx as jsx129 } from "react/jsx-runtime";
 var FILTER_PREVIEW_CLASSNAME = "k-filter-preview";
 var states52 = [];
 var options50 = {};
@@ -8252,11 +8264,11 @@ var FilterPreview = (props) => {
   if (fields) {
     fields.map(({ name, value }) => {
       expressionPreview.push(
-        /* @__PURE__ */ jsx125("span", { className: `k-filter-preview-${name}`, children: `${value} ` })
+        /* @__PURE__ */ jsx129("span", { className: `k-filter-preview-${name}`, children: `${value} ` })
       );
     });
   }
-  return /* @__PURE__ */ jsx125("div", { className: classNames(FILTER_PREVIEW_CLASSNAME), children: expressionPreview });
+  return /* @__PURE__ */ jsx129("div", { className: classNames(FILTER_PREVIEW_CLASSNAME), children: expressionPreview });
 };
 FilterPreview.states = states52;
 FilterPreview.options = options50;
@@ -8264,7 +8276,7 @@ FilterPreview.defaultProps = defaultProps48;
 FilterPreview.className = FILTER_PREVIEW_CLASSNAME;
 
 // src/filter/filter.spec.tsx
-import { Fragment as Fragment30, jsx as jsx126, jsxs as jsxs52 } from "react/jsx-runtime";
+import { Fragment as Fragment31, jsx as jsx130, jsxs as jsxs54 } from "react/jsx-runtime";
 var FILTER_CLASSNAME = "k-filter";
 var states53 = [];
 var options51 = {};
@@ -8272,22 +8284,22 @@ var defaultProps49 = {};
 var Filter = (props) => {
   const { children } = props;
   const filterChildren = [];
-  let expressionPreview = /* @__PURE__ */ jsx126(Fragment30, {});
+  let expressionPreview = /* @__PURE__ */ jsx130(Fragment31, {});
   if (children) {
     if (Array.isArray(children)) {
       children.map((child) => {
         if (child.type !== FilterPreview) {
           filterChildren.push(child);
         } else {
-          expressionPreview = /* @__PURE__ */ jsx126(FilterPreview, { ...child.props });
+          expressionPreview = /* @__PURE__ */ jsx130(FilterPreview, { ...child.props });
         }
       });
     }
   }
-  return /* @__PURE__ */ jsxs52("div", { className: classNames(props.className, FILTER_CLASSNAME), children: [
-    /* @__PURE__ */ jsx126("ul", { className: "k-filter-container", children: /* @__PURE__ */ jsx126("li", { className: "k-filter-group-main", children: filterChildren }) }),
+  return /* @__PURE__ */ jsxs54("div", { className: classNames(props.className, FILTER_CLASSNAME), children: [
+    /* @__PURE__ */ jsx130("ul", { className: "k-filter-container", children: /* @__PURE__ */ jsx130("li", { className: "k-filter-group-main", children: filterChildren }) }),
     expressionPreview,
-    /* @__PURE__ */ jsx126(Button, { className: "k-filter-apply", children: "Apply" })
+    /* @__PURE__ */ jsx130(Button, { className: "k-filter-apply", children: "Apply" })
   ] });
 };
 Filter.states = states53;
@@ -8296,109 +8308,169 @@ Filter.defaultProps = defaultProps49;
 Filter.className = FILTER_CLASSNAME;
 
 // src/filter/filter-toolbar.tsx
-import { jsx as jsx127 } from "react/jsx-runtime";
+import { jsx as jsx131 } from "react/jsx-runtime";
 var FILTER_TOOLBAR_CLASSNAME = "k-filter-toolbar";
 var states54 = [];
 var options52 = {};
 var defaultProps50 = {};
 var FilterToolbar = (props) => {
   const { children } = props;
-  return /* @__PURE__ */ jsx127("div", { className: classNames(FILTER_TOOLBAR_CLASSNAME), children });
+  return /* @__PURE__ */ jsx131("div", { className: classNames(FILTER_TOOLBAR_CLASSNAME), children });
 };
 FilterToolbar.states = states54;
 FilterToolbar.options = options52;
 FilterToolbar.defaultProps = defaultProps50;
 
 // src/filter/filter-lines.tsx
-import { jsx as jsx128 } from "react/jsx-runtime";
+import { jsx as jsx132 } from "react/jsx-runtime";
 var FILTER_LINES_CLASSNAME = "k-filter-lines";
 var states55 = [];
 var options53 = {};
 var defaultProps51 = {};
 var FilterLines = (props) => {
   const { children } = props;
-  return /* @__PURE__ */ jsx128("ul", { className: classNames(FILTER_LINES_CLASSNAME), children });
+  return /* @__PURE__ */ jsx132("ul", { className: classNames(FILTER_LINES_CLASSNAME), children });
 };
 FilterLines.states = states55;
 FilterLines.options = options53;
 FilterLines.defaultProps = defaultProps51;
 
 // src/filter/filter-item.tsx
-import { jsx as jsx129 } from "react/jsx-runtime";
+import { jsx as jsx133 } from "react/jsx-runtime";
 var FILTER_ITEM_CLASSNAME = "k-filter-item";
 var states56 = [];
 var options54 = {};
 var defaultProps52 = {};
 var FilterItem = (props) => {
   const { children } = props;
-  return /* @__PURE__ */ jsx129("li", { className: classNames(FILTER_ITEM_CLASSNAME), children });
+  return /* @__PURE__ */ jsx133("li", { className: classNames(FILTER_ITEM_CLASSNAME), children });
 };
 FilterItem.states = states56;
 FilterItem.options = options54;
 FilterItem.defaultProps = defaultProps52;
 
+// src/filter/templates/filter-normal.tsx
+import { jsx as jsx134, jsxs as jsxs55 } from "react/jsx-runtime";
+var FilterNormal = (props) => /* @__PURE__ */ jsx134(
+  Filter,
+  {
+    children: [
+      /* @__PURE__ */ jsx134(FilterToolbar, { children: /* @__PURE__ */ jsxs55(Toolbar, { children: [
+        /* @__PURE__ */ jsxs55(ButtonGroup, { children: [
+          /* @__PURE__ */ jsx134(Button, { selected: true, children: "And" }),
+          /* @__PURE__ */ jsx134(Button, { children: "Or" })
+        ] }),
+        /* @__PURE__ */ jsx134(Button, { icon: "filter-add-expression", children: "Add Expression" }),
+        /* @__PURE__ */ jsx134(Button, { icon: "filter-add-group", children: "Add Group" }),
+        /* @__PURE__ */ jsx134(Button, { fillMode: "flat", icon: "x" })
+      ] }) }),
+      /* @__PURE__ */ jsxs55(FilterLines, { children: [
+        /* @__PURE__ */ jsx134(FilterItem, { children: /* @__PURE__ */ jsx134(FilterToolbar, { children: /* @__PURE__ */ jsxs55(Toolbar, { children: [
+          /* @__PURE__ */ jsx134(ToolbarItem, { className: "k-filter-field", children: /* @__PURE__ */ jsx134(DropdownList, { value: "Name" }) }),
+          /* @__PURE__ */ jsx134(ToolbarItem, { className: "k-filter-operator", children: /* @__PURE__ */ jsx134(DropdownList, { value: "Is equal to" }) }),
+          /* @__PURE__ */ jsx134(ToolbarItem, { className: "k-filter-value", children: /* @__PURE__ */ jsx134(Textbox, { placeholder: "James" }) }),
+          /* @__PURE__ */ jsx134(Button, { fillMode: "flat", icon: "x" })
+        ] }) }) }),
+        /* @__PURE__ */ jsx134(FilterItem, { children: /* @__PURE__ */ jsx134(FilterToolbar, { children: /* @__PURE__ */ jsxs55(Toolbar, { children: [
+          /* @__PURE__ */ jsx134(ToolbarItem, { className: "k-filter-field", children: /* @__PURE__ */ jsx134(DropdownList, { value: "Price" }) }),
+          /* @__PURE__ */ jsx134(ToolbarItem, { className: "k-filter-operator", children: /* @__PURE__ */ jsx134(DropdownList, { value: "Is greater than" }) }),
+          /* @__PURE__ */ jsx134(ToolbarItem, { className: "k-filter-value", children: /* @__PURE__ */ jsx134(NumericTextbox, { placeholder: "100,00" }) }),
+          /* @__PURE__ */ jsx134(Button, { fillMode: "flat", icon: "x" })
+        ] }) }) }),
+        /* @__PURE__ */ jsx134(FilterItem, { children: /* @__PURE__ */ jsx134(FilterToolbar, { children: /* @__PURE__ */ jsxs55(Toolbar, { children: [
+          /* @__PURE__ */ jsx134(ToolbarItem, { className: "k-filter-field", children: /* @__PURE__ */ jsx134(DropdownList, { value: "First Ordered" }) }),
+          /* @__PURE__ */ jsx134(ToolbarItem, { className: "k-filter-operator", children: /* @__PURE__ */ jsx134(DropdownList, { value: "Is before" }) }),
+          /* @__PURE__ */ jsx134(ToolbarItem, { className: "k-filter-value", children: /* @__PURE__ */ jsx134(DatePicker, { placeholder: "1/21/2021" }) }),
+          /* @__PURE__ */ jsx134(Button, { fillMode: "flat", icon: "x" })
+        ] }) }) })
+      ] }),
+      /* @__PURE__ */ jsx134(
+        FilterPreview,
+        {
+          fields: [
+            { name: "bracket", value: "(" },
+            { name: "field", value: "Price" },
+            { name: "criteria", value: "Is greater than" },
+            { name: "value", value: "'100,00'" },
+            { name: "operator", value: "AND" },
+            { name: "bracket", value: "(" },
+            { name: "bracket", value: "(" },
+            { name: "field", value: "FirstOrdered" },
+            { name: "criteria", value: "Is before" },
+            { name: "value", value: "'Thursday Jan 21 2021'" },
+            { name: "bracket", value: ")" },
+            { name: "bracket", value: ")" },
+            { name: "bracket", value: ")" }
+          ]
+        }
+      )
+    ],
+    ...props
+  }
+);
+
 // src/filter/tests/filter.tsx
-import { Fragment as Fragment31, jsx as jsx130, jsxs as jsxs53 } from "react/jsx-runtime";
-var filter_default = () => /* @__PURE__ */ jsx130(Fragment31, { children: /* @__PURE__ */ jsx130("div", { id: "test-area", className: "k-d-grid", children: /* @__PURE__ */ jsxs53(Filter, { children: [
-  /* @__PURE__ */ jsx130(FilterToolbar, { children: /* @__PURE__ */ jsxs53(Toolbar, { focus: true, children: [
-    /* @__PURE__ */ jsxs53(ButtonGroup, { children: [
-      /* @__PURE__ */ jsx130(Button, { selected: true, children: "And" }),
-      /* @__PURE__ */ jsx130(Button, { children: "Or" })
+import { Fragment as Fragment32, jsx as jsx135, jsxs as jsxs56 } from "react/jsx-runtime";
+var filter_default = () => /* @__PURE__ */ jsx135(Fragment32, { children: /* @__PURE__ */ jsx135("div", { id: "test-area", className: "k-d-grid", children: /* @__PURE__ */ jsxs56(FilterNormal, { children: [
+  /* @__PURE__ */ jsx135(FilterToolbar, { children: /* @__PURE__ */ jsxs56(Toolbar, { focus: true, children: [
+    /* @__PURE__ */ jsxs56(ButtonGroup, { children: [
+      /* @__PURE__ */ jsx135(Button, { selected: true, children: "And" }),
+      /* @__PURE__ */ jsx135(Button, { children: "Or" })
     ] }),
-    /* @__PURE__ */ jsx130(Button, { icon: "filter-add-expression", children: "Add Expression" }),
-    /* @__PURE__ */ jsx130(Button, { icon: "filter-add-group", children: "Add Group" }),
-    /* @__PURE__ */ jsx130(Button, { fillMode: "flat", icon: "x" })
+    /* @__PURE__ */ jsx135(Button, { icon: "filter-add-expression", children: "Add Expression" }),
+    /* @__PURE__ */ jsx135(Button, { icon: "filter-add-group", children: "Add Group" }),
+    /* @__PURE__ */ jsx135(Button, { fillMode: "flat", icon: "x" })
   ] }) }),
-  /* @__PURE__ */ jsxs53(FilterLines, { children: [
-    /* @__PURE__ */ jsx130(FilterItem, { children: /* @__PURE__ */ jsx130(FilterToolbar, { children: /* @__PURE__ */ jsxs53(Toolbar, { children: [
-      /* @__PURE__ */ jsx130(ToolbarItem, { className: "k-filter-field", children: /* @__PURE__ */ jsx130(DropdownList, { value: "Name" }) }),
-      /* @__PURE__ */ jsx130(ToolbarItem, { className: "k-filter-operator", focus: true, children: /* @__PURE__ */ jsx130(DropdownList, { value: "Is equal to" }) }),
-      /* @__PURE__ */ jsx130(ToolbarItem, { className: "k-filter-value", children: /* @__PURE__ */ jsx130(Textbox, { placeholder: "James" }) }),
-      /* @__PURE__ */ jsx130(Button, { fillMode: "flat", icon: "x" })
+  /* @__PURE__ */ jsxs56(FilterLines, { children: [
+    /* @__PURE__ */ jsx135(FilterItem, { children: /* @__PURE__ */ jsx135(FilterToolbar, { children: /* @__PURE__ */ jsxs56(Toolbar, { children: [
+      /* @__PURE__ */ jsx135(ToolbarItem, { className: "k-filter-field", children: /* @__PURE__ */ jsx135(DropdownList, { value: "Name" }) }),
+      /* @__PURE__ */ jsx135(ToolbarItem, { className: "k-filter-operator", focus: true, children: /* @__PURE__ */ jsx135(DropdownList, { value: "Is equal to" }) }),
+      /* @__PURE__ */ jsx135(ToolbarItem, { className: "k-filter-value", children: /* @__PURE__ */ jsx135(Textbox, { placeholder: "James" }) }),
+      /* @__PURE__ */ jsx135(Button, { fillMode: "flat", icon: "x" })
     ] }) }) }),
-    /* @__PURE__ */ jsx130(FilterItem, { children: /* @__PURE__ */ jsx130(FilterToolbar, { children: /* @__PURE__ */ jsxs53(Toolbar, { children: [
-      /* @__PURE__ */ jsx130(ToolbarItem, { className: "k-filter-field", children: /* @__PURE__ */ jsx130(DropdownList, { value: "Price" }) }),
-      /* @__PURE__ */ jsx130(ToolbarItem, { className: "k-filter-operator", children: /* @__PURE__ */ jsx130(DropdownList, { value: "Is greater than" }) }),
-      /* @__PURE__ */ jsx130(ToolbarItem, { className: "k-filter-value", children: /* @__PURE__ */ jsx130(NumericTextbox, { placeholder: "100,00" }) }),
-      /* @__PURE__ */ jsx130(Button, { fillMode: "flat", icon: "x" })
+    /* @__PURE__ */ jsx135(FilterItem, { children: /* @__PURE__ */ jsx135(FilterToolbar, { children: /* @__PURE__ */ jsxs56(Toolbar, { children: [
+      /* @__PURE__ */ jsx135(ToolbarItem, { className: "k-filter-field", children: /* @__PURE__ */ jsx135(DropdownList, { value: "Price" }) }),
+      /* @__PURE__ */ jsx135(ToolbarItem, { className: "k-filter-operator", children: /* @__PURE__ */ jsx135(DropdownList, { value: "Is greater than" }) }),
+      /* @__PURE__ */ jsx135(ToolbarItem, { className: "k-filter-value", children: /* @__PURE__ */ jsx135(NumericTextbox, { placeholder: "100,00" }) }),
+      /* @__PURE__ */ jsx135(Button, { fillMode: "flat", icon: "x" })
     ] }) }) }),
-    /* @__PURE__ */ jsx130(FilterItem, { children: /* @__PURE__ */ jsx130(FilterToolbar, { children: /* @__PURE__ */ jsxs53(Toolbar, { focus: true, children: [
-      /* @__PURE__ */ jsx130(ToolbarItem, { className: "k-filter-field", children: /* @__PURE__ */ jsx130(DropdownList, { value: "Discontinued" }) }),
-      /* @__PURE__ */ jsx130(ToolbarItem, { className: "k-filter-operator", children: /* @__PURE__ */ jsx130(DropdownList, { value: "Is equal to" }) }),
-      /* @__PURE__ */ jsx130(ToolbarItem, { className: "k-filter-value", children: /* @__PURE__ */ jsx130(DropdownList, { value: "False" }) }),
-      /* @__PURE__ */ jsx130(Button, { fillMode: "flat", icon: "x" })
+    /* @__PURE__ */ jsx135(FilterItem, { children: /* @__PURE__ */ jsx135(FilterToolbar, { children: /* @__PURE__ */ jsxs56(Toolbar, { focus: true, children: [
+      /* @__PURE__ */ jsx135(ToolbarItem, { className: "k-filter-field", children: /* @__PURE__ */ jsx135(DropdownList, { value: "Discontinued" }) }),
+      /* @__PURE__ */ jsx135(ToolbarItem, { className: "k-filter-operator", children: /* @__PURE__ */ jsx135(DropdownList, { value: "Is equal to" }) }),
+      /* @__PURE__ */ jsx135(ToolbarItem, { className: "k-filter-value", children: /* @__PURE__ */ jsx135(DropdownList, { value: "False" }) }),
+      /* @__PURE__ */ jsx135(Button, { fillMode: "flat", icon: "x" })
     ] }) }) }),
-    /* @__PURE__ */ jsx130(FilterItem, { children: /* @__PURE__ */ jsx130(FilterToolbar, { children: /* @__PURE__ */ jsxs53(Toolbar, { children: [
-      /* @__PURE__ */ jsx130(ToolbarItem, { className: "k-filter-field", children: /* @__PURE__ */ jsx130(DropdownList, { value: "First Ordered" }) }),
-      /* @__PURE__ */ jsx130(ToolbarItem, { className: "k-filter-operator", children: /* @__PURE__ */ jsx130(DropdownList, { value: "Is before" }) }),
-      /* @__PURE__ */ jsx130(ToolbarItem, { className: "k-filter-value", children: /* @__PURE__ */ jsx130(DatePicker, { placeholder: "1/21/2021" }) }),
-      /* @__PURE__ */ jsx130(Button, { fillMode: "flat", icon: "x" })
+    /* @__PURE__ */ jsx135(FilterItem, { children: /* @__PURE__ */ jsx135(FilterToolbar, { children: /* @__PURE__ */ jsxs56(Toolbar, { children: [
+      /* @__PURE__ */ jsx135(ToolbarItem, { className: "k-filter-field", children: /* @__PURE__ */ jsx135(DropdownList, { value: "First Ordered" }) }),
+      /* @__PURE__ */ jsx135(ToolbarItem, { className: "k-filter-operator", children: /* @__PURE__ */ jsx135(DropdownList, { value: "Is before" }) }),
+      /* @__PURE__ */ jsx135(ToolbarItem, { className: "k-filter-value", children: /* @__PURE__ */ jsx135(DatePicker, { placeholder: "1/21/2021" }) }),
+      /* @__PURE__ */ jsx135(Button, { fillMode: "flat", icon: "x" })
     ] }) }) }),
-    /* @__PURE__ */ jsxs53(FilterItem, { children: [
-      /* @__PURE__ */ jsx130(FilterToolbar, { children: /* @__PURE__ */ jsxs53(Toolbar, { children: [
-        /* @__PURE__ */ jsxs53(ButtonGroup, { children: [
-          /* @__PURE__ */ jsx130(Button, { selected: true, children: "And" }),
-          /* @__PURE__ */ jsx130(Button, { children: "Or" })
+    /* @__PURE__ */ jsxs56(FilterItem, { children: [
+      /* @__PURE__ */ jsx135(FilterToolbar, { children: /* @__PURE__ */ jsxs56(Toolbar, { children: [
+        /* @__PURE__ */ jsxs56(ButtonGroup, { children: [
+          /* @__PURE__ */ jsx135(Button, { selected: true, children: "And" }),
+          /* @__PURE__ */ jsx135(Button, { children: "Or" })
         ] }),
-        /* @__PURE__ */ jsx130(Button, { icon: "filter-add-expression", children: "Add Expression" }),
-        /* @__PURE__ */ jsx130(Button, { icon: "filter-add-group", children: "Add Group" }),
-        /* @__PURE__ */ jsx130(Button, { fillMode: "flat", icon: "x" })
+        /* @__PURE__ */ jsx135(Button, { icon: "filter-add-expression", children: "Add Expression" }),
+        /* @__PURE__ */ jsx135(Button, { icon: "filter-add-group", children: "Add Group" }),
+        /* @__PURE__ */ jsx135(Button, { fillMode: "flat", icon: "x" })
       ] }) }),
-      /* @__PURE__ */ jsxs53(FilterLines, { children: [
-        /* @__PURE__ */ jsx130(FilterItem, { children: /* @__PURE__ */ jsx130(FilterToolbar, { children: /* @__PURE__ */ jsxs53(Toolbar, { children: [
-          /* @__PURE__ */ jsx130(ToolbarItem, { className: "k-filter-field", children: /* @__PURE__ */ jsx130(DropdownList, { value: "Name" }) }),
-          /* @__PURE__ */ jsx130(ToolbarItem, { className: "k-filter-operator", children: /* @__PURE__ */ jsx130(DropdownList, { value: "Is empty" }) }),
-          /* @__PURE__ */ jsx130(Button, { fillMode: "flat", icon: "x" })
+      /* @__PURE__ */ jsxs56(FilterLines, { children: [
+        /* @__PURE__ */ jsx135(FilterItem, { children: /* @__PURE__ */ jsx135(FilterToolbar, { children: /* @__PURE__ */ jsxs56(Toolbar, { children: [
+          /* @__PURE__ */ jsx135(ToolbarItem, { className: "k-filter-field", children: /* @__PURE__ */ jsx135(DropdownList, { value: "Name" }) }),
+          /* @__PURE__ */ jsx135(ToolbarItem, { className: "k-filter-operator", children: /* @__PURE__ */ jsx135(DropdownList, { value: "Is empty" }) }),
+          /* @__PURE__ */ jsx135(Button, { fillMode: "flat", icon: "x" })
         ] }) }) }),
-        /* @__PURE__ */ jsx130(FilterItem, { children: /* @__PURE__ */ jsx130(FilterToolbar, { children: /* @__PURE__ */ jsxs53(Toolbar, { children: [
-          /* @__PURE__ */ jsx130(ToolbarItem, { className: "k-filter-field", children: /* @__PURE__ */ jsx130(DropdownList, { value: "Price" }) }),
-          /* @__PURE__ */ jsx130(ToolbarItem, { className: " k-filter-operator", children: /* @__PURE__ */ jsx130(DropdownList, { value: "Is not null" }) }),
-          /* @__PURE__ */ jsx130(Button, { fillMode: "flat", icon: "x" })
+        /* @__PURE__ */ jsx135(FilterItem, { children: /* @__PURE__ */ jsx135(FilterToolbar, { children: /* @__PURE__ */ jsxs56(Toolbar, { children: [
+          /* @__PURE__ */ jsx135(ToolbarItem, { className: "k-filter-field", children: /* @__PURE__ */ jsx135(DropdownList, { value: "Price" }) }),
+          /* @__PURE__ */ jsx135(ToolbarItem, { className: " k-filter-operator", children: /* @__PURE__ */ jsx135(DropdownList, { value: "Is not null" }) }),
+          /* @__PURE__ */ jsx135(Button, { fillMode: "flat", icon: "x" })
         ] }) }) })
       ] })
     ] })
   ] }),
-  /* @__PURE__ */ jsx130(
+  /* @__PURE__ */ jsx135(
     FilterPreview,
     {
       fields: [