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

package/dist/esm/grid/tests/grid-grouping-blazor.js

@@ -4477,14 +4477,74 @@ Checkbox.options = options5;
 Checkbox.className = CHECKBOX_CLASSNAME;
 Checkbox.defaultProps = defaultProps5;
 
-// src/checkbox/templates/checkbox-label.tsx
-import { Fragment as Fragment5, jsx as jsx9, jsxs as jsxs2 } from "react/jsx-runtime";
+// src/checkbox/checkbox-group.spec.tsx
+import { jsx as jsx9 } from "react/jsx-runtime";
+var CHECKBOXGROUP_CLASSNAME = `k-checkbox-list`;
+var states6 = [];
+var options6 = {};
+var defaultProps6 = {
+  layout: "vertical"
+};
+var CheckboxGroup = (props) => {
+  const {
+    layout = defaultProps6.layout,
+    ...other
+  } = props;
+  return /* @__PURE__ */ jsx9(
+    "ul",
+    {
+      ...other,
+      className: classNames(
+        props.className,
+        CHECKBOXGROUP_CLASSNAME,
+        {
+          [`k-list-${layout}`]: layout
+        }
+      ),
+      children: props.children
+    }
+  );
+};
+CheckboxGroup.states = states6;
+CheckboxGroup.options = options6;
+CheckboxGroup.className = CHECKBOXGROUP_CLASSNAME;
+CheckboxGroup.defaultProps = defaultProps6;
 
-// src/checkbox/templates/checkbox-normal.tsx
+// src/checkbox/checkbox-item.spec.tsx
 import { jsx as jsx10 } from "react/jsx-runtime";
+var CHECKBOXITEM_CLASSNAME = `k-checkbox-list-item`;
+var states7 = [];
+var options7 = {};
+var defaultProps7 = {};
+var CheckboxItem = (props) => {
+  const {
+    ...other
+  } = props;
+  return /* @__PURE__ */ jsx10(
+    "li",
+    {
+      ...other,
+      className: classNames(
+        props.className,
+        CHECKBOXITEM_CLASSNAME
+      ),
+      children: props.children
+    }
+  );
+};
+CheckboxItem.states = states7;
+CheckboxItem.options = options7;
+CheckboxItem.className = CHECKBOXITEM_CLASSNAME;
+CheckboxItem.defaultProps = defaultProps7;
+
+// src/checkbox/templates/checkbox-with-label.tsx
+import { Fragment as Fragment5, jsx as jsx11, jsxs as jsxs2 } from "react/jsx-runtime";
+
+// src/checkbox/templates/checkbox-normal.tsx
+import { jsx as jsx12 } from "react/jsx-runtime";
 
 // src/chip/chip-action.tsx
-import { jsx as jsx11 } from "react/jsx-runtime";
+import { jsx as jsx13 } from "react/jsx-runtime";
 var CHIPACTION_CLASSNAME = `k-chip-action`;
 var ChipAction = (props) => {
   const {
@@ -4494,15 +4554,15 @@ var ChipAction = (props) => {
   let icon;
   switch (type) {
     case "remove" /* REMOVE */:
-      icon = /* @__PURE__ */ jsx11(Icon, { icon: "x-circle", size: "small" });
+      icon = /* @__PURE__ */ jsx13(Icon, { icon: "x-circle", size: "small" });
       break;
     case "more" /* MORE */:
-      icon = /* @__PURE__ */ jsx11(Icon, { icon: "more-vertical", size: "small" });
+      icon = /* @__PURE__ */ jsx13(Icon, { icon: "more-vertical", size: "small" });
       break;
     default:
-      return /* @__PURE__ */ jsx11(Icon, { icon: type, size: "small" });
+      return /* @__PURE__ */ jsx13(Icon, { icon: type, size: "small" });
   }
-  return /* @__PURE__ */ jsx11(
+  return /* @__PURE__ */ jsx13(
     "span",
     {
       ...other,
@@ -4517,16 +4577,16 @@ var ChipAction = (props) => {
 };
 
 // src/avatar/avatar.spec.tsx
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx14 } from "react/jsx-runtime";
 var AVATAR_CLASSNAME = `k-avatar`;
-var states6 = [
+var states8 = [
   States.hover,
   States.focus,
   States.active,
   States.selected,
   States.disabled
 ];
-var options6 = {
+var options8 = {
   size: [Size.small, Size.medium, Size.large],
   rounded: [Roundness.small, Roundness.medium, Roundness.large, Roundness.full],
   fillMode: [FillMode.solid, FillMode.flat, FillMode.outline],
@@ -4544,7 +4604,7 @@ var options6 = {
     ThemeColor.inverse
   ]
 };
-var defaultProps6 = {
+var defaultProps8 = {
   type: "text" /* TEXT */,
   size: Size.medium,
   rounded: Roundness.full,
@@ -4554,15 +4614,15 @@ var defaultProps6 = {
 };
 var Avatar = (props) => {
   const {
-    size = defaultProps6.size,
-    rounded = defaultProps6.rounded,
-    fillMode = defaultProps6.fillMode,
-    themeColor = defaultProps6.themeColor,
-    type = defaultProps6.type,
-    border = defaultProps6.border,
+    size = defaultProps8.size,
+    rounded = defaultProps8.rounded,
+    fillMode = defaultProps8.fillMode,
+    themeColor = defaultProps8.themeColor,
+    type = defaultProps8.type,
+    border = defaultProps8.border,
     ...other
   } = props;
-  return /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx14(
     "div",
     {
       ...other,
@@ -4579,35 +4639,35 @@ var Avatar = (props) => {
           [`${AVATAR_CLASSNAME}-bordered`]: border
         }
       ),
-      children: /* @__PURE__ */ jsx12("span", { className: `${AVATAR_CLASSNAME}-${type}`, children: props.children })
+      children: /* @__PURE__ */ jsx14("span", { className: `${AVATAR_CLASSNAME}-${type}`, children: props.children })
     }
   );
 };
-Avatar.states = states6;
-Avatar.options = options6;
+Avatar.states = states8;
+Avatar.options = options8;
 Avatar.className = AVATAR_CLASSNAME;
-Avatar.defaultProps = defaultProps6;
+Avatar.defaultProps = defaultProps8;
 
 // src/avatar/templates/avatar-icon.tsx
-import { jsx as jsx13 } from "react/jsx-runtime";
+import { jsx as jsx15 } from "react/jsx-runtime";
 
 // src/avatar/templates/avatar-text.tsx
-import { jsx as jsx14 } from "react/jsx-runtime";
+import { jsx as jsx16 } from "react/jsx-runtime";
 
 // src/avatar/templates/avatar-image.tsx
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx17 } from "react/jsx-runtime";
 
 // src/chip/chip.spec.tsx
-import { jsx as jsx16, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs3 } from "react/jsx-runtime";
 var CHIP_CLASSNAME = `k-chip`;
-var states7 = [
+var states9 = [
   States.hover,
   States.focus,
   States.active,
   States.selected,
   States.disabled
 ];
-var options7 = {
+var options9 = {
   size: [Size.small, Size.medium, Size.large],
   rounded: [Roundness.small, Roundness.medium, Roundness.large, Roundness.full],
   fillMode: [FillMode.solid, FillMode.outline],
@@ -4619,7 +4679,7 @@ var options7 = {
     ThemeColor.info
   ]
 };
-var defaultProps7 = {
+var defaultProps9 = {
   size: Size.medium,
   rounded: Roundness.medium,
   fillMode: FillMode.solid,
@@ -4627,10 +4687,10 @@ var defaultProps7 = {
 };
 var Chip = (props) => {
   const {
-    size = defaultProps7.size,
-    rounded = defaultProps7.rounded,
-    fillMode = defaultProps7.fillMode,
-    themeColor = defaultProps7.themeColor,
+    size = defaultProps9.size,
+    rounded = defaultProps9.rounded,
+    fillMode = defaultProps9.fillMode,
+    themeColor = defaultProps9.themeColor,
     text,
     icon,
     actions,
@@ -4664,35 +4724,35 @@ var Chip = (props) => {
         })
       ),
       children: [
-        icon && /* @__PURE__ */ jsx16(Icon, { className: "k-chip-icon", icon, size: "small" }),
-        showAvatar && /* @__PURE__ */ jsx16(Avatar, { className: "k-chip-avatar", type: "image", children: /* @__PURE__ */ jsx16("img", { src: "/packages/html/assets/avatar.jpg" }) }),
-        /* @__PURE__ */ jsx16("span", { className: "k-chip-content", children: props.children ? props.children : text && /* @__PURE__ */ jsx16("span", { className: "k-chip-label k-text-ellipsis", children: text }) }),
-        actions && /* @__PURE__ */ jsx16("span", { className: "k-chip-actions", children: actions })
+        icon && /* @__PURE__ */ jsx18(Icon, { className: "k-chip-icon", icon, size: "small" }),
+        showAvatar && /* @__PURE__ */ jsx18(Avatar, { className: "k-chip-avatar", type: "image", children: /* @__PURE__ */ jsx18("img", { src: "/packages/html/assets/avatar.jpg" }) }),
+        /* @__PURE__ */ jsx18("span", { className: "k-chip-content", children: props.children ? props.children : text && /* @__PURE__ */ jsx18("span", { className: "k-chip-label k-text-ellipsis", children: text }) }),
+        actions && /* @__PURE__ */ jsx18("span", { className: "k-chip-actions", children: actions })
       ]
     }
   );
 };
-Chip.states = states7;
-Chip.options = options7;
+Chip.states = states9;
+Chip.options = options9;
 Chip.className = CHIP_CLASSNAME;
-Chip.defaultProps = defaultProps7;
+Chip.defaultProps = defaultProps9;
 
 // src/chip/chip-list.spec.tsx
-import { jsx as jsx17 } from "react/jsx-runtime";
+import { jsx as jsx19 } from "react/jsx-runtime";
 var CHIPLIST_CLASSNAME = `k-chip-list`;
-var states8 = [];
-var options8 = {
+var states10 = [];
+var options10 = {
   size: [Size.small, Size.medium, Size.large]
 };
-var defaultProps8 = {
+var defaultProps10 = {
   size: Size.medium
 };
 var ChipList = (props) => {
   const {
-    size = defaultProps8.size,
+    size = defaultProps10.size,
     ...other
   } = props;
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx19(
     "div",
     {
       ...other,
@@ -4707,207 +4767,207 @@ var ChipList = (props) => {
     }
   );
 };
-ChipList.states = states8;
-ChipList.options = options8;
+ChipList.states = states10;
+ChipList.options = options10;
 ChipList.className = CHIPLIST_CLASSNAME;
-ChipList.defaultProps = defaultProps8;
+ChipList.defaultProps = defaultProps10;
 
 // src/chip/templates/chip-avatar.tsx
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { jsx as jsx20 } from "react/jsx-runtime";
 
 // src/chip/templates/chip-icon.tsx
-import { jsx as jsx19 } from "react/jsx-runtime";
+import { jsx as jsx21 } from "react/jsx-runtime";
 
 // src/chip/templates/chip-normal.tsx
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx22 } from "react/jsx-runtime";
 
 // src/chip/templates/chip-removable.tsx
-import { jsx as jsx21 } from "react/jsx-runtime";
+import { jsx as jsx23 } from "react/jsx-runtime";
 
 // src/grid/tests/grid-grouping-blazor.tsx
-import { Fragment as Fragment6, jsx as jsx22, jsxs as jsxs4 } from "react/jsx-runtime";
-var grid_grouping_blazor_default = () => /* @__PURE__ */ jsx22(Fragment6, { children: /* @__PURE__ */ jsxs4("div", { id: "test-area", className: "k-d-grid", children: [
-  /* @__PURE__ */ jsx22("h3", { children: "Base" }),
+import { Fragment as Fragment6, jsx as jsx24, jsxs as jsxs4 } from "react/jsx-runtime";
+var grid_grouping_blazor_default = () => /* @__PURE__ */ jsx24(Fragment6, { children: /* @__PURE__ */ jsxs4("div", { id: "test-area", className: "k-d-grid", children: [
+  /* @__PURE__ */ jsx24("h3", { children: "Base" }),
   /* @__PURE__ */ jsxs4("div", { className: "k-grid k-grid-md telerik-blazor", children: [
-    /* @__PURE__ */ jsx22("div", { className: "k-grouping-header", children: /* @__PURE__ */ jsx22("div", { className: "k-grouping-drop-container", children: "Drag a column header and drop it here to group by that column" }) }),
-    /* @__PURE__ */ jsx22("div", { className: "k-grid-header", children: /* @__PURE__ */ jsx22("div", { className: "k-grid-header-wrap", children: /* @__PURE__ */ jsxs4("table", { className: "k-table k-table-md k-grid-header-table", role: "grid", children: [
+    /* @__PURE__ */ jsx24("div", { className: "k-grouping-header", children: /* @__PURE__ */ jsx24("div", { className: "k-grouping-drop-container", children: "Drag a column header and drop it here to group by that column" }) }),
+    /* @__PURE__ */ jsx24("div", { className: "k-grid-header", children: /* @__PURE__ */ jsx24("div", { className: "k-grid-header-wrap", children: /* @__PURE__ */ jsxs4("table", { className: "k-table k-table-md k-grid-header-table", role: "grid", children: [
       /* @__PURE__ */ jsxs4("colgroup", { children: [
-        /* @__PURE__ */ jsx22("col", { style: { width: "65px" } }),
-        /* @__PURE__ */ jsx22("col", {}),
-        /* @__PURE__ */ jsx22("col", {}),
-        /* @__PURE__ */ jsx22("col", {})
+        /* @__PURE__ */ jsx24("col", { style: { width: "65px" } }),
+        /* @__PURE__ */ jsx24("col", {}),
+        /* @__PURE__ */ jsx24("col", {}),
+        /* @__PURE__ */ jsx24("col", {})
       ] }),
-      /* @__PURE__ */ jsx22("thead", { className: "k-table-thead", children: /* @__PURE__ */ jsxs4("tr", { className: "k-table-row", children: [
-        /* @__PURE__ */ jsx22("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx22(Checkbox, {}) }),
-        /* @__PURE__ */ jsx22("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx22("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx22("span", { className: "k-link", children: /* @__PURE__ */ jsx22("span", { className: "k-column-title", children: "Id" }) }) }) }),
-        /* @__PURE__ */ jsx22("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx22("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx22("span", { className: "k-link", children: /* @__PURE__ */ jsx22("span", { className: "k-column-title", children: "Name" }) }) }) }),
-        /* @__PURE__ */ jsx22("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx22("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx22("span", { className: "k-link", children: /* @__PURE__ */ jsx22("span", { className: "k-column-title", children: "Command" }) }) }) })
+      /* @__PURE__ */ jsx24("thead", { className: "k-table-thead", children: /* @__PURE__ */ jsxs4("tr", { className: "k-table-row", children: [
+        /* @__PURE__ */ jsx24("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx24(Checkbox, {}) }),
+        /* @__PURE__ */ jsx24("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx24("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx24("span", { className: "k-link", children: /* @__PURE__ */ jsx24("span", { className: "k-column-title", children: "Id" }) }) }) }),
+        /* @__PURE__ */ jsx24("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx24("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx24("span", { className: "k-link", children: /* @__PURE__ */ jsx24("span", { className: "k-column-title", children: "Name" }) }) }) }),
+        /* @__PURE__ */ jsx24("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx24("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx24("span", { className: "k-link", children: /* @__PURE__ */ jsx24("span", { className: "k-column-title", children: "Command" }) }) }) })
       ] }) })
     ] }) }) }),
-    /* @__PURE__ */ jsx22("div", { className: "k-grid-container", children: /* @__PURE__ */ jsxs4("div", { className: "k-grid-content k-virtual-content", children: [
-      /* @__PURE__ */ jsx22("div", { className: "k-pos-relative", children: /* @__PURE__ */ jsx22("div", { className: "k-virtual-position", children: /* @__PURE__ */ jsxs4("table", { role: "grid", className: "k-table k-table-md k-grid-table", style: { height: "auto" }, children: [
+    /* @__PURE__ */ jsx24("div", { className: "k-grid-container", children: /* @__PURE__ */ jsxs4("div", { className: "k-grid-content k-virtual-content", children: [
+      /* @__PURE__ */ jsx24("div", { className: "k-pos-relative", children: /* @__PURE__ */ jsx24("div", { className: "k-virtual-position", children: /* @__PURE__ */ jsxs4("table", { role: "grid", className: "k-table k-table-md k-grid-table", style: { height: "auto" }, children: [
         /* @__PURE__ */ jsxs4("colgroup", { children: [
-          /* @__PURE__ */ jsx22("col", { style: { width: "65px" } }),
-          /* @__PURE__ */ jsx22("col", {}),
-          /* @__PURE__ */ jsx22("col", {}),
-          /* @__PURE__ */ jsx22("col", {})
+          /* @__PURE__ */ jsx24("col", { style: { width: "65px" } }),
+          /* @__PURE__ */ jsx24("col", {}),
+          /* @__PURE__ */ jsx24("col", {}),
+          /* @__PURE__ */ jsx24("col", {})
         ] }),
         /* @__PURE__ */ jsxs4("tbody", { className: "k-table-tbody", children: [
           /* @__PURE__ */ jsxs4("tr", { className: "k-table-row k-master-row", children: [
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: /* @__PURE__ */ jsx22("span", { children: /* @__PURE__ */ jsx22(Checkbox, { className: "k-grid-checkbox" }) }) }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: "1" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: "Product1" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td k-command-cell", colSpan: 0, children: /* @__PURE__ */ jsx22("span", { children: /* @__PURE__ */ jsx22(Button, { icon: "trash", children: "Delete" }) }) })
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: /* @__PURE__ */ jsx24("span", { children: /* @__PURE__ */ jsx24(Checkbox, { className: "k-grid-checkbox" }) }) }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: "1" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: "Product1" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td k-command-cell", colSpan: 0, children: /* @__PURE__ */ jsx24("span", { children: /* @__PURE__ */ jsx24(Button, { icon: "trash", children: "Delete" }) }) })
           ] }),
           /* @__PURE__ */ jsxs4("tr", { className: "k-table-row k-table-alt-row k-master-row k-alt", children: [
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: /* @__PURE__ */ jsx22("span", { children: /* @__PURE__ */ jsx22(Checkbox, { className: "k-grid-checkbox" }) }) }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: "2" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: "Product2" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td k-command-cell", colSpan: 0, children: /* @__PURE__ */ jsx22("span", { children: /* @__PURE__ */ jsx22(Button, { icon: "trash", children: "Delete" }) }) })
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: /* @__PURE__ */ jsx24("span", { children: /* @__PURE__ */ jsx24(Checkbox, { className: "k-grid-checkbox" }) }) }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: "2" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: "Product2" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td k-command-cell", colSpan: 0, children: /* @__PURE__ */ jsx24("span", { children: /* @__PURE__ */ jsx24(Button, { icon: "trash", children: "Delete" }) }) })
           ] })
         ] })
       ] }) }) }),
-      /* @__PURE__ */ jsx22("div", { className: "k-height-container", children: /* @__PURE__ */ jsx22("div", {}) })
+      /* @__PURE__ */ jsx24("div", { className: "k-height-container", children: /* @__PURE__ */ jsx24("div", {}) })
     ] }) })
   ] }),
-  /* @__PURE__ */ jsx22("h3", { children: "Single Group" }),
+  /* @__PURE__ */ jsx24("h3", { children: "Single Group" }),
   /* @__PURE__ */ jsxs4("div", { className: "k-grid k-grid-md telerik-blazor", children: [
     /* @__PURE__ */ jsxs4("div", { className: "k-grouping-header", children: [
-      /* @__PURE__ */ jsx22(ChipList, { children: /* @__PURE__ */ jsx22(Chip, { actions: /* @__PURE__ */ jsx22(ChipAction, { type: "remove" }), children: "Id" }) }),
-      /* @__PURE__ */ jsx22("div", { className: "k-grouping-drop-container" })
+      /* @__PURE__ */ jsx24(ChipList, { children: /* @__PURE__ */ jsx24(Chip, { actions: /* @__PURE__ */ jsx24(ChipAction, { type: "remove" }), children: "Id" }) }),
+      /* @__PURE__ */ jsx24("div", { className: "k-grouping-drop-container" })
     ] }),
-    /* @__PURE__ */ jsx22("div", { className: "k-grid-header", children: /* @__PURE__ */ jsx22("div", { className: "k-grid-header-wrap", children: /* @__PURE__ */ jsxs4("table", { className: "k-table k-table-md k-grid-header-table", role: "grid", children: [
+    /* @__PURE__ */ jsx24("div", { className: "k-grid-header", children: /* @__PURE__ */ jsx24("div", { className: "k-grid-header-wrap", children: /* @__PURE__ */ jsxs4("table", { className: "k-table k-table-md k-grid-header-table", role: "grid", children: [
       /* @__PURE__ */ jsxs4("colgroup", { children: [
-        /* @__PURE__ */ jsx22("col", { className: "k-group-col" }),
-        /* @__PURE__ */ jsx22("col", { style: { width: "65px" } }),
-        /* @__PURE__ */ jsx22("col", {}),
-        /* @__PURE__ */ jsx22("col", {}),
-        /* @__PURE__ */ jsx22("col", {})
+        /* @__PURE__ */ jsx24("col", { className: "k-group-col" }),
+        /* @__PURE__ */ jsx24("col", { style: { width: "65px" } }),
+        /* @__PURE__ */ jsx24("col", {}),
+        /* @__PURE__ */ jsx24("col", {}),
+        /* @__PURE__ */ jsx24("col", {})
       ] }),
-      /* @__PURE__ */ jsx22("thead", { className: "k-table-thead", children: /* @__PURE__ */ jsxs4("tr", { className: "k-table-row", children: [
-        /* @__PURE__ */ jsx22("th", { colSpan: 1, rowSpan: 1, className: "k-table-th k-group-cell k-header" }),
-        /* @__PURE__ */ jsx22("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx22(Checkbox, {}) }),
-        /* @__PURE__ */ jsx22("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx22("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx22("span", { className: "k-link", children: /* @__PURE__ */ jsx22("span", { className: "k-column-title", children: "Id" }) }) }) }),
-        /* @__PURE__ */ jsx22("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx22("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx22("span", { className: "k-link", children: /* @__PURE__ */ jsx22("span", { className: "k-column-title", children: "Name" }) }) }) }),
-        /* @__PURE__ */ jsx22("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx22("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx22("span", { className: "k-link", children: /* @__PURE__ */ jsx22("span", { className: "k-column-title", children: "Command" }) }) }) })
+      /* @__PURE__ */ jsx24("thead", { className: "k-table-thead", children: /* @__PURE__ */ jsxs4("tr", { className: "k-table-row", children: [
+        /* @__PURE__ */ jsx24("th", { colSpan: 1, rowSpan: 1, className: "k-table-th k-group-cell k-header" }),
+        /* @__PURE__ */ jsx24("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx24(Checkbox, {}) }),
+        /* @__PURE__ */ jsx24("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx24("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx24("span", { className: "k-link", children: /* @__PURE__ */ jsx24("span", { className: "k-column-title", children: "Id" }) }) }) }),
+        /* @__PURE__ */ jsx24("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx24("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx24("span", { className: "k-link", children: /* @__PURE__ */ jsx24("span", { className: "k-column-title", children: "Name" }) }) }) }),
+        /* @__PURE__ */ jsx24("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx24("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx24("span", { className: "k-link", children: /* @__PURE__ */ jsx24("span", { className: "k-column-title", children: "Command" }) }) }) })
       ] }) })
     ] }) }) }),
-    /* @__PURE__ */ jsx22("div", { className: "k-grid-container", children: /* @__PURE__ */ jsxs4("div", { className: "k-grid-content k-virtual-content", children: [
-      /* @__PURE__ */ jsx22("div", { className: "k-pos-relative", children: /* @__PURE__ */ jsx22("div", { className: "k-virtual-position", children: /* @__PURE__ */ jsxs4("table", { role: "grid", className: "k-table k-table-md k-grid-table", style: { height: "auto" }, children: [
+    /* @__PURE__ */ jsx24("div", { className: "k-grid-container", children: /* @__PURE__ */ jsxs4("div", { className: "k-grid-content k-virtual-content", children: [
+      /* @__PURE__ */ jsx24("div", { className: "k-pos-relative", children: /* @__PURE__ */ jsx24("div", { className: "k-virtual-position", children: /* @__PURE__ */ jsxs4("table", { role: "grid", className: "k-table k-table-md k-grid-table", style: { height: "auto" }, children: [
         /* @__PURE__ */ jsxs4("colgroup", { children: [
-          /* @__PURE__ */ jsx22("col", { className: "k-group-col" }),
-          /* @__PURE__ */ jsx22("col", { style: { width: "65px" } }),
-          /* @__PURE__ */ jsx22("col", {}),
-          /* @__PURE__ */ jsx22("col", {}),
-          /* @__PURE__ */ jsx22("col", {})
+          /* @__PURE__ */ jsx24("col", { className: "k-group-col" }),
+          /* @__PURE__ */ jsx24("col", { style: { width: "65px" } }),
+          /* @__PURE__ */ jsx24("col", {}),
+          /* @__PURE__ */ jsx24("col", {}),
+          /* @__PURE__ */ jsx24("col", {})
         ] }),
         /* @__PURE__ */ jsxs4("tbody", { className: "k-table-tbody", children: [
-          /* @__PURE__ */ jsx22("tr", { role: "row", className: "k-table-row k-table-group-row k-grouping-row", children: /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 5, children: /* @__PURE__ */ jsxs4("p", { className: "k-reset", children: [
-            /* @__PURE__ */ jsx22(Icon, { icon: "caret-alt-down" }),
+          /* @__PURE__ */ jsx24("tr", { role: "row", className: "k-table-row k-table-group-row k-grouping-row", children: /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 5, children: /* @__PURE__ */ jsxs4("p", { className: "k-reset", children: [
+            /* @__PURE__ */ jsx24(Icon, { icon: "caret-alt-down" }),
             "Id: 1"
           ] }) }) }),
           /* @__PURE__ */ jsxs4("tr", { className: "k-table-row k-master-row", children: [
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td k-table-group-td k-group-cell" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: /* @__PURE__ */ jsx22("span", { children: /* @__PURE__ */ jsx22(Checkbox, { className: "k-grid-checkbox" }) }) }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: "1" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: "Product1" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td k-command-cell", colSpan: 0, children: /* @__PURE__ */ jsx22("span", { children: /* @__PURE__ */ jsx22(Button, { icon: "trash", children: "Delete" }) }) })
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td k-table-group-td k-group-cell" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: /* @__PURE__ */ jsx24("span", { children: /* @__PURE__ */ jsx24(Checkbox, { className: "k-grid-checkbox" }) }) }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: "1" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: "Product1" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td k-command-cell", colSpan: 0, children: /* @__PURE__ */ jsx24("span", { children: /* @__PURE__ */ jsx24(Button, { icon: "trash", children: "Delete" }) }) })
           ] }),
-          /* @__PURE__ */ jsx22("tr", { role: "row", className: "k-table-row k-table-group-row k-grouping-row", children: /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 5, children: /* @__PURE__ */ jsxs4("p", { className: "k-reset", children: [
-            /* @__PURE__ */ jsx22(Icon, { icon: "caret-alt-down" }),
+          /* @__PURE__ */ jsx24("tr", { role: "row", className: "k-table-row k-table-group-row k-grouping-row", children: /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 5, children: /* @__PURE__ */ jsxs4("p", { className: "k-reset", children: [
+            /* @__PURE__ */ jsx24(Icon, { icon: "caret-alt-down" }),
             "Id: 2"
           ] }) }) }),
           /* @__PURE__ */ jsxs4("tr", { className: "k-table-row k-table-alt-row k-master-row k-alt", children: [
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td k-table-group-td k-group-cell" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: /* @__PURE__ */ jsx22("span", { children: /* @__PURE__ */ jsx22(Checkbox, { className: "k-grid-checkbox" }) }) }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: "2" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: "Product2" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td k-command-cell", colSpan: 0, children: /* @__PURE__ */ jsx22("span", { children: /* @__PURE__ */ jsx22(Button, { icon: "trash", children: "Delete" }) }) })
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td k-table-group-td k-group-cell" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: /* @__PURE__ */ jsx24("span", { children: /* @__PURE__ */ jsx24(Checkbox, { className: "k-grid-checkbox" }) }) }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: "2" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: "Product2" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td k-command-cell", colSpan: 0, children: /* @__PURE__ */ jsx24("span", { children: /* @__PURE__ */ jsx24(Button, { icon: "trash", children: "Delete" }) }) })
           ] })
         ] })
       ] }) }) }),
-      /* @__PURE__ */ jsx22("div", { className: "k-height-container", children: /* @__PURE__ */ jsx22("div", {}) })
+      /* @__PURE__ */ jsx24("div", { className: "k-height-container", children: /* @__PURE__ */ jsx24("div", {}) })
     ] }) })
   ] }),
-  /* @__PURE__ */ jsx22("h3", { children: "Two Groups" }),
+  /* @__PURE__ */ jsx24("h3", { children: "Two Groups" }),
   /* @__PURE__ */ jsxs4("div", { className: "k-grid k-grid-md telerik-blazor", children: [
     /* @__PURE__ */ jsxs4("div", { className: "k-grouping-header", children: [
       /* @__PURE__ */ jsxs4(ChipList, { children: [
-        /* @__PURE__ */ jsx22(Chip, { actions: /* @__PURE__ */ jsx22(ChipAction, { type: "remove" }), children: "Id" }),
-        /* @__PURE__ */ jsx22(Chip, { actions: /* @__PURE__ */ jsx22(ChipAction, { type: "remove" }), children: "Name" })
+        /* @__PURE__ */ jsx24(Chip, { actions: /* @__PURE__ */ jsx24(ChipAction, { type: "remove" }), children: "Id" }),
+        /* @__PURE__ */ jsx24(Chip, { actions: /* @__PURE__ */ jsx24(ChipAction, { type: "remove" }), children: "Name" })
       ] }),
-      /* @__PURE__ */ jsx22("div", { className: "k-grouping-drop-container" })
+      /* @__PURE__ */ jsx24("div", { className: "k-grouping-drop-container" })
     ] }),
-    /* @__PURE__ */ jsx22("div", { className: "k-grid-header", children: /* @__PURE__ */ jsx22("div", { className: "k-grid-header-wrap", children: /* @__PURE__ */ jsxs4("table", { className: "k-table k-table-md k-grid-header-table", role: "grid", children: [
+    /* @__PURE__ */ jsx24("div", { className: "k-grid-header", children: /* @__PURE__ */ jsx24("div", { className: "k-grid-header-wrap", children: /* @__PURE__ */ jsxs4("table", { className: "k-table k-table-md k-grid-header-table", role: "grid", children: [
       /* @__PURE__ */ jsxs4("colgroup", { children: [
-        /* @__PURE__ */ jsx22("col", { className: "k-group-col" }),
-        /* @__PURE__ */ jsx22("col", { className: "k-group-col" }),
-        /* @__PURE__ */ jsx22("col", { style: { width: "65px" } }),
-        /* @__PURE__ */ jsx22("col", {}),
-        /* @__PURE__ */ jsx22("col", {}),
-        /* @__PURE__ */ jsx22("col", {})
+        /* @__PURE__ */ jsx24("col", { className: "k-group-col" }),
+        /* @__PURE__ */ jsx24("col", { className: "k-group-col" }),
+        /* @__PURE__ */ jsx24("col", { style: { width: "65px" } }),
+        /* @__PURE__ */ jsx24("col", {}),
+        /* @__PURE__ */ jsx24("col", {}),
+        /* @__PURE__ */ jsx24("col", {})
       ] }),
-      /* @__PURE__ */ jsx22("thead", { className: "k-table-thead", children: /* @__PURE__ */ jsxs4("tr", { className: "k-table-row", children: [
-        /* @__PURE__ */ jsx22("th", { colSpan: 1, rowSpan: 1, className: "k-table-th k-group-cell k-header" }),
-        /* @__PURE__ */ jsx22("th", { colSpan: 1, rowSpan: 1, className: "k-table-th k-group-cell k-header" }),
-        /* @__PURE__ */ jsx22("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx22(Checkbox, {}) }),
-        /* @__PURE__ */ jsx22("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx22("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx22("span", { className: "k-link", children: /* @__PURE__ */ jsx22("span", { className: "k-column-title", children: "Id" }) }) }) }),
-        /* @__PURE__ */ jsx22("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx22("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx22("span", { className: "k-link", children: /* @__PURE__ */ jsx22("span", { className: "k-column-title", children: "Name" }) }) }) }),
-        /* @__PURE__ */ jsx22("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx22("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx22("span", { className: "k-link", children: /* @__PURE__ */ jsx22("span", { className: "k-column-title", children: "Command" }) }) }) })
+      /* @__PURE__ */ jsx24("thead", { className: "k-table-thead", children: /* @__PURE__ */ jsxs4("tr", { className: "k-table-row", children: [
+        /* @__PURE__ */ jsx24("th", { colSpan: 1, rowSpan: 1, className: "k-table-th k-group-cell k-header" }),
+        /* @__PURE__ */ jsx24("th", { colSpan: 1, rowSpan: 1, className: "k-table-th k-group-cell k-header" }),
+        /* @__PURE__ */ jsx24("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx24(Checkbox, {}) }),
+        /* @__PURE__ */ jsx24("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx24("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx24("span", { className: "k-link", children: /* @__PURE__ */ jsx24("span", { className: "k-column-title", children: "Id" }) }) }) }),
+        /* @__PURE__ */ jsx24("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx24("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx24("span", { className: "k-link", children: /* @__PURE__ */ jsx24("span", { className: "k-column-title", children: "Name" }) }) }) }),
+        /* @__PURE__ */ jsx24("th", { className: "k-table-th k-header", colSpan: 1, children: /* @__PURE__ */ jsx24("span", { className: "k-cell-inner", children: /* @__PURE__ */ jsx24("span", { className: "k-link", children: /* @__PURE__ */ jsx24("span", { className: "k-column-title", children: "Command" }) }) }) })
       ] }) })
     ] }) }) }),
-    /* @__PURE__ */ jsx22("div", { className: "k-grid-container", children: /* @__PURE__ */ jsxs4("div", { className: "k-grid-content k-virtual-content", children: [
-      /* @__PURE__ */ jsx22("div", { className: "k-pos-relative", children: /* @__PURE__ */ jsx22("div", { className: "k-virtual-position", children: /* @__PURE__ */ jsxs4("table", { role: "grid", className: "k-table k-table-md k-grid-table", style: { height: "auto" }, children: [
+    /* @__PURE__ */ jsx24("div", { className: "k-grid-container", children: /* @__PURE__ */ jsxs4("div", { className: "k-grid-content k-virtual-content", children: [
+      /* @__PURE__ */ jsx24("div", { className: "k-pos-relative", children: /* @__PURE__ */ jsx24("div", { className: "k-virtual-position", children: /* @__PURE__ */ jsxs4("table", { role: "grid", className: "k-table k-table-md k-grid-table", style: { height: "auto" }, children: [
         /* @__PURE__ */ jsxs4("colgroup", { children: [
-          /* @__PURE__ */ jsx22("col", { className: "k-group-col" }),
-          /* @__PURE__ */ jsx22("col", { className: "k-group-col" }),
-          /* @__PURE__ */ jsx22("col", { style: { width: "65px" } }),
-          /* @__PURE__ */ jsx22("col", {}),
-          /* @__PURE__ */ jsx22("col", {}),
-          /* @__PURE__ */ jsx22("col", {})
+          /* @__PURE__ */ jsx24("col", { className: "k-group-col" }),
+          /* @__PURE__ */ jsx24("col", { className: "k-group-col" }),
+          /* @__PURE__ */ jsx24("col", { style: { width: "65px" } }),
+          /* @__PURE__ */ jsx24("col", {}),
+          /* @__PURE__ */ jsx24("col", {}),
+          /* @__PURE__ */ jsx24("col", {})
         ] }),
         /* @__PURE__ */ jsxs4("tbody", { className: "k-table-tbody", children: [
-          /* @__PURE__ */ jsx22("tr", { role: "row", className: "k-table-row k-table-group-row k-grouping-row", children: /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 6, children: /* @__PURE__ */ jsxs4("p", { className: "k-reset", children: [
-            /* @__PURE__ */ jsx22(Icon, { icon: "caret-alt-down" }),
+          /* @__PURE__ */ jsx24("tr", { role: "row", className: "k-table-row k-table-group-row k-grouping-row", children: /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 6, children: /* @__PURE__ */ jsxs4("p", { className: "k-reset", children: [
+            /* @__PURE__ */ jsx24(Icon, { icon: "caret-alt-down" }),
             "Id: 1"
           ] }) }) }),
           /* @__PURE__ */ jsxs4("tr", { role: "row", className: "k-table-row k-table-group-row k-grouping-row", children: [
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td k-table-group-td k-group-cell" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 5, children: /* @__PURE__ */ jsxs4("p", { className: "k-reset", children: [
-              /* @__PURE__ */ jsx22(Icon, { icon: "caret-alt-down" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td k-table-group-td k-group-cell" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 5, children: /* @__PURE__ */ jsxs4("p", { className: "k-reset", children: [
+              /* @__PURE__ */ jsx24(Icon, { icon: "caret-alt-down" }),
               "Name: Product1"
             ] }) })
           ] }),
           /* @__PURE__ */ jsxs4("tr", { className: "k-table-row k-master-row", children: [
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td k-table-group-td k-group-cell" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td k-table-group-td k-group-cell" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: /* @__PURE__ */ jsx22("span", { children: /* @__PURE__ */ jsx22(Checkbox, { className: "k-grid-checkbox" }) }) }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: "1" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: "Product1" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td k-command-cell", colSpan: 0, children: /* @__PURE__ */ jsx22("span", { children: /* @__PURE__ */ jsx22(Button, { icon: "trash", children: "Delete" }) }) })
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td k-table-group-td k-group-cell" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td k-table-group-td k-group-cell" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: /* @__PURE__ */ jsx24("span", { children: /* @__PURE__ */ jsx24(Checkbox, { className: "k-grid-checkbox" }) }) }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: "1" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: "Product1" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td k-command-cell", colSpan: 0, children: /* @__PURE__ */ jsx24("span", { children: /* @__PURE__ */ jsx24(Button, { icon: "trash", children: "Delete" }) }) })
           ] }),
-          /* @__PURE__ */ jsx22("tr", { role: "row", className: "k-table-row k-table-group-row k-grouping-row", children: /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 6, children: /* @__PURE__ */ jsxs4("p", { className: "k-reset", children: [
-            /* @__PURE__ */ jsx22(Icon, { icon: "caret-alt-down" }),
+          /* @__PURE__ */ jsx24("tr", { role: "row", className: "k-table-row k-table-group-row k-grouping-row", children: /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 6, children: /* @__PURE__ */ jsxs4("p", { className: "k-reset", children: [
+            /* @__PURE__ */ jsx24(Icon, { icon: "caret-alt-down" }),
             "Id: 2"
           ] }) }) }),
           /* @__PURE__ */ jsxs4("tr", { role: "row", className: "k-table-row k-table-group-row k-grouping-row", children: [
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td k-table-group-td k-group-cell" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 5, children: /* @__PURE__ */ jsxs4("p", { className: "k-reset", children: [
-              /* @__PURE__ */ jsx22(Icon, { icon: "caret-alt-down" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td k-table-group-td k-group-cell" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 5, children: /* @__PURE__ */ jsxs4("p", { className: "k-reset", children: [
+              /* @__PURE__ */ jsx24(Icon, { icon: "caret-alt-down" }),
               "Name: Product2"
             ] }) })
           ] }),
           /* @__PURE__ */ jsxs4("tr", { className: "k-table-row k-table-alt-row k-master-row k-alt", children: [
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td k-table-group-td k-group-cell" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td k-table-group-td k-group-cell" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: /* @__PURE__ */ jsx22("span", { children: /* @__PURE__ */ jsx22(Checkbox, { className: "k-grid-checkbox" }) }) }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: "2" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td", colSpan: 0, children: "Product2" }),
-            /* @__PURE__ */ jsx22("td", { className: "k-table-td k-command-cell", colSpan: 0, children: /* @__PURE__ */ jsx22("span", { children: /* @__PURE__ */ jsx22(Button, { icon: "trash", children: "Delete" }) }) })
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td k-table-group-td k-group-cell" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td k-table-group-td k-group-cell" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: /* @__PURE__ */ jsx24("span", { children: /* @__PURE__ */ jsx24(Checkbox, { className: "k-grid-checkbox" }) }) }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: "2" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td", colSpan: 0, children: "Product2" }),
+            /* @__PURE__ */ jsx24("td", { className: "k-table-td k-command-cell", colSpan: 0, children: /* @__PURE__ */ jsx24("span", { children: /* @__PURE__ */ jsx24(Button, { icon: "trash", children: "Delete" }) }) })
           ] })
         ] })
       ] }) }) }),
-      /* @__PURE__ */ jsx22("div", { className: "k-height-container", children: /* @__PURE__ */ jsx22("div", {}) })
+      /* @__PURE__ */ jsx24("div", { className: "k-height-container", children: /* @__PURE__ */ jsx24("div", {}) })
     ] }) })
   ] })
 ] }) });