@progress/kendo-themes-html 6.7.0-dev.0 → 6.7.0-dev.2

package/dist/esm/treeview/tests/treeview-size.js

@@ -4543,45 +4543,45 @@ TreeviewItem.className = TREEVIEWITEM_CLASSNAME;
 TreeviewItem.defaultProps = defaultProps6;
 var treeview_item_spec_default = TreeviewItem;
 
+// src/treeview/templates/treeview-normal.tsx
+import { jsx as jsx11 } from "react/jsx-runtime";
+
+// src/treeview/templates/treeview-hierarchy.tsx
+import { jsx as jsx12, jsxs as jsxs4 } from "react/jsx-runtime";
+var TreeviewHierarchy = (props) => /* @__PURE__ */ jsx12(
+  Treeview,
+  {
+    children: [
+      /* @__PURE__ */ jsx12(TreeviewItem, { text: "Root 1" }),
+      /* @__PURE__ */ jsx12(TreeviewItem, { text: "Root 2", expanded: true, children: /* @__PURE__ */ jsxs4(TreeviewGroup, { children: [
+        /* @__PURE__ */ jsx12(TreeviewItem, { text: "Child 2.1" }),
+        /* @__PURE__ */ jsx12(TreeviewItem, { text: "Child 2.2", children: /* @__PURE__ */ jsx12(TreeviewGroup, { children: /* @__PURE__ */ jsx12(TreeviewItem, { text: "Child 2.2.1" }) }) }),
+        /* @__PURE__ */ jsx12(TreeviewItem, { text: "Child 2.3" }),
+        /* @__PURE__ */ jsx12(TreeviewItem, { leafClassName: "k-treeview-load-more-button", text: "Load more ..." })
+      ] }) }),
+      /* @__PURE__ */ jsx12(TreeviewItem, { text: "Root 3", children: /* @__PURE__ */ jsxs4(TreeviewGroup, { children: [
+        /* @__PURE__ */ jsx12(TreeviewItem, { text: "Child 3.1" }),
+        /* @__PURE__ */ jsx12(TreeviewItem, { text: "Child 3.2" }),
+        /* @__PURE__ */ jsx12(TreeviewItem, { text: "Child 3.3" })
+      ] }) })
+    ],
+    ...props
+  }
+);
+
+// src/treeview/templates/treeview-icons.tsx
+import { jsx as jsx13, jsxs as jsxs5 } from "react/jsx-runtime";
+
+// src/treeview/templates/treeview-checkboxes.tsx
+import { jsx as jsx14, jsxs as jsxs6 } from "react/jsx-runtime";
+
 // src/treeview/tests/treeview-size.tsx
-import { Fragment as Fragment6, jsx as jsx11, jsxs as jsxs4 } from "react/jsx-runtime";
-var treeview_size_default = () => /* @__PURE__ */ jsx11(Fragment6, { children: /* @__PURE__ */ jsxs4("div", { id: "test-area", className: "k-d-grid k-grid-cols-3", children: [
-  /* @__PURE__ */ jsx11("span", { children: "small" }),
-  /* @__PURE__ */ jsx11("span", { children: "medium" }),
-  /* @__PURE__ */ jsx11("span", { children: "large" }),
-  /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsxs4(Treeview, { size: "small", children: [
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Normal" }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Hover", hasChildren: true, hover: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Focus", hasChildren: true, focus: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Selected", hasChildren: true, selected: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Selected focus", hasChildren: true, selected: true, focus: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Disabled", hasChildren: true, disabled: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Disabled focus", hasChildren: true, disabled: true, focus: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Icon", showIcon: true, icon: "folder" }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Load more...", leafClassName: "k-treeview-load-more-button" })
-  ] }) }),
-  /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsxs4(Treeview, { size: "medium", children: [
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Normal" }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Hover", hasChildren: true, hover: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Focus", hasChildren: true, focus: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Selected", hasChildren: true, selected: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Selected focus", hasChildren: true, selected: true, focus: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Disabled", hasChildren: true, disabled: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Disabled focus", hasChildren: true, disabled: true, focus: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Icon", showIcon: true, icon: "folder" }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Load more...", leafClassName: "k-treeview-load-more-button" })
-  ] }) }),
-  /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsxs4(Treeview, { size: "large", children: [
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Normal" }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Hover", hasChildren: true, hover: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Focus", hasChildren: true, focus: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Selected", hasChildren: true, selected: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Selected focus", hasChildren: true, selected: true, focus: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Disabled", hasChildren: true, disabled: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Disabled focus", hasChildren: true, disabled: true, focus: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Icon", showIcon: true, icon: "folder" }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Load more...", leafClassName: "k-treeview-load-more-button" })
-  ] }) })
+import { Fragment as Fragment6, jsx as jsx15, jsxs as jsxs7 } from "react/jsx-runtime";
+var treeview_size_default = () => /* @__PURE__ */ jsx15(Fragment6, { children: /* @__PURE__ */ jsxs7("div", { id: "test-area", className: "k-d-grid k-grid-cols-3", children: [
+  /* @__PURE__ */ jsx15("span", { children: "small" }),
+  /* @__PURE__ */ jsx15("span", { children: "medium" }),
+  /* @__PURE__ */ jsx15("span", { children: "large" }),
+  Treeview.options.size.map((size) => /* @__PURE__ */ jsx15(TreeviewHierarchy, { size }))
 ] }) });
 export {
   treeview_size_default as default

package/dist/esm/treeview/tests/treeview.js

@@ -4543,121 +4543,126 @@ TreeviewItem.className = TREEVIEWITEM_CLASSNAME;
 TreeviewItem.defaultProps = defaultProps6;
 var treeview_item_spec_default = TreeviewItem;
 
+// src/treeview/templates/treeview-normal.tsx
+import { jsx as jsx11 } from "react/jsx-runtime";
+var TreeviewNormal = (props) => /* @__PURE__ */ jsx11(
+  Treeview,
+  {
+    children: [
+      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Treeview item" }),
+      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Treeview item" }),
+      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Treeview item" })
+    ],
+    ...props
+  }
+);
+
+// src/treeview/templates/treeview-hierarchy.tsx
+import { jsx as jsx12, jsxs as jsxs4 } from "react/jsx-runtime";
+var TreeviewHierarchy = (props) => /* @__PURE__ */ jsx12(
+  Treeview,
+  {
+    children: [
+      /* @__PURE__ */ jsx12(TreeviewItem, { text: "Root 1" }),
+      /* @__PURE__ */ jsx12(TreeviewItem, { text: "Root 2", expanded: true, children: /* @__PURE__ */ jsxs4(TreeviewGroup, { children: [
+        /* @__PURE__ */ jsx12(TreeviewItem, { text: "Child 2.1" }),
+        /* @__PURE__ */ jsx12(TreeviewItem, { text: "Child 2.2", children: /* @__PURE__ */ jsx12(TreeviewGroup, { children: /* @__PURE__ */ jsx12(TreeviewItem, { text: "Child 2.2.1" }) }) }),
+        /* @__PURE__ */ jsx12(TreeviewItem, { text: "Child 2.3" }),
+        /* @__PURE__ */ jsx12(TreeviewItem, { leafClassName: "k-treeview-load-more-button", text: "Load more ..." })
+      ] }) }),
+      /* @__PURE__ */ jsx12(TreeviewItem, { text: "Root 3", children: /* @__PURE__ */ jsxs4(TreeviewGroup, { children: [
+        /* @__PURE__ */ jsx12(TreeviewItem, { text: "Child 3.1" }),
+        /* @__PURE__ */ jsx12(TreeviewItem, { text: "Child 3.2" }),
+        /* @__PURE__ */ jsx12(TreeviewItem, { text: "Child 3.3" })
+      ] }) })
+    ],
+    ...props
+  }
+);
+
+// src/treeview/templates/treeview-icons.tsx
+import { jsx as jsx13, jsxs as jsxs5 } from "react/jsx-runtime";
+var TreeviewIcons = (props) => /* @__PURE__ */ jsx13(
+  Treeview,
+  {
+    children: [
+      /* @__PURE__ */ jsx13(TreeviewItem, { text: "Root 1" }),
+      /* @__PURE__ */ jsx13(TreeviewItem, { text: "Root 2", showIcon: true, icon: "folder", expanded: true, children: /* @__PURE__ */ jsxs5(TreeviewGroup, { children: [
+        /* @__PURE__ */ jsx13(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 2.1" }),
+        /* @__PURE__ */ jsx13(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 2.2", children: /* @__PURE__ */ jsx13(TreeviewGroup, { children: /* @__PURE__ */ jsx13(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 2.2.1" }) }) }),
+        /* @__PURE__ */ jsx13(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 2.3" }),
+        /* @__PURE__ */ jsx13(TreeviewItem, { leafClassName: "k-treeview-load-more-button", text: "Load more..." })
+      ] }) }),
+      /* @__PURE__ */ jsx13(TreeviewItem, { text: "Root 3", showIcon: true, icon: "folder", children: /* @__PURE__ */ jsxs5(TreeviewGroup, { children: [
+        /* @__PURE__ */ jsx13(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 3.1" }),
+        /* @__PURE__ */ jsx13(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 3.2" }),
+        /* @__PURE__ */ jsx13(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 3.3" })
+      ] }) })
+    ],
+    ...props
+  }
+);
+
+// src/treeview/templates/treeview-checkboxes.tsx
+import { jsx as jsx14, jsxs as jsxs6 } from "react/jsx-runtime";
+var TreeviewCheckboxes = (props) => /* @__PURE__ */ jsx14(
+  Treeview,
+  {
+    children: [
+      /* @__PURE__ */ jsx14(TreeviewItem, { text: "Root 1", showCheckbox: true }),
+      /* @__PURE__ */ jsx14(TreeviewItem, { text: "Root 2", showCheckbox: true, expanded: true, children: /* @__PURE__ */ jsxs6(TreeviewGroup, { children: [
+        /* @__PURE__ */ jsx14(TreeviewItem, { text: "Child 2.1", showCheckbox: true }),
+        /* @__PURE__ */ jsx14(TreeviewItem, { text: "Child 2.2", showCheckbox: true, children: /* @__PURE__ */ jsx14(TreeviewGroup, { children: /* @__PURE__ */ jsx14(TreeviewItem, { text: "Child 2.2.1" }) }) }),
+        /* @__PURE__ */ jsx14(TreeviewItem, { text: "Child 2.3", showCheckbox: true }),
+        /* @__PURE__ */ jsx14(TreeviewItem, { text: "Load more...", leafClassName: "k-treeview-load-more-button" })
+      ] }) }),
+      /* @__PURE__ */ jsxs6(TreeviewItem, { text: "Root 3", showCheckbox: true, children: [
+        /* @__PURE__ */ jsx14(TreeviewItem, { text: "Child 3.1" }),
+        /* @__PURE__ */ jsx14(TreeviewItem, { text: "Child 3.2" }),
+        /* @__PURE__ */ jsx14(TreeviewItem, { text: "Child 3.3" })
+      ] })
+    ],
+    ...props
+  }
+);
+
 // src/treeview/tests/treeview.tsx
-import { Fragment as Fragment6, jsx as jsx11, jsxs as jsxs4 } from "react/jsx-runtime";
-var treeview_default = () => /* @__PURE__ */ jsx11(Fragment6, { children: /* @__PURE__ */ jsxs4("div", { id: "test-area", className: "k-d-grid k-grid-cols-4", children: [
-  /* @__PURE__ */ jsx11("span", { children: "states" }),
-  /* @__PURE__ */ jsx11("span", { children: "states (rtl)" }),
-  /* @__PURE__ */ jsx11("span", { children: "hierarchy" }),
-  /* @__PURE__ */ jsx11("span", { children: "hierarchy (rtl)" }),
-  /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsxs4(Treeview, { children: [
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Normal" }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Hover", hover: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Focus", focus: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Selected", selected: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Selected focus", selected: true, focus: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Disabled", disabled: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Disabled focus", disabled: true, focus: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { leafClassName: "k-treeview-load-more-button", text: "Load more..." })
-  ] }) }),
-  /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsxs4(Treeview, { dir: "rtl", children: [
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Normal" }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Hover", hover: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Focus", focus: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Selected", selected: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Selected focus", selected: true, focus: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Disabled", disabled: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Disabled focus", disabled: true, focus: true }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { leafClassName: "k-treeview-load-more-button", text: "Load more...", hover: true })
-  ] }) }),
-  /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsxs4(Treeview, { children: [
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 1" }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 2", expanded: true, children: /* @__PURE__ */ jsxs4(TreeviewGroup, { children: [
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.1" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.2", children: /* @__PURE__ */ jsx11(TreeviewGroup, { children: /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.2.1" }) }) }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.3" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { leafClassName: "k-treeview-load-more-button", text: "Load more ..." })
-    ] }) }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 3", children: /* @__PURE__ */ jsxs4(TreeviewGroup, { children: [
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 3.1" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 3.2" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 3.3" })
-    ] }) })
-  ] }) }),
-  /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsxs4(Treeview, { dir: "rtl", children: [
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 1" }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 2", expanded: true, children: /* @__PURE__ */ jsxs4(TreeviewGroup, { children: [
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.1" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.2", children: /* @__PURE__ */ jsx11(TreeviewGroup, { children: /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.2.1" }) }) }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.3" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { leafClassName: "k-treeview-load-more-button", text: "Load more ...", hover: true, focus: true })
-    ] }) }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 3", children: /* @__PURE__ */ jsxs4(TreeviewGroup, { children: [
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 3.1" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 3.2" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 3.3" })
-    ] }) })
-  ] }) }),
-  /* @__PURE__ */ jsx11("span", { children: "icons" }),
-  /* @__PURE__ */ jsx11("span", { children: "icons (rtl)" }),
-  /* @__PURE__ */ jsx11("span", { children: "checkboxes" }),
-  /* @__PURE__ */ jsx11("span", { children: "checkboxes (rtl)" }),
-  /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsxs4(Treeview, { children: [
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 1" }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 2", showIcon: true, icon: "folder", expanded: true, children: /* @__PURE__ */ jsxs4(TreeviewGroup, { children: [
-      /* @__PURE__ */ jsx11(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 2.1" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 2.2", children: /* @__PURE__ */ jsx11(TreeviewGroup, { children: /* @__PURE__ */ jsx11(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 2.2.1" }) }) }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 2.3" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { leafClassName: "k-treeview-load-more-button", text: "Load more..." })
-    ] }) }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 3", showIcon: true, icon: "folder", children: /* @__PURE__ */ jsxs4(TreeviewGroup, { children: [
-      /* @__PURE__ */ jsx11(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 3.1" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 3.2" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 3.3" })
-    ] }) })
-  ] }) }),
-  /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsxs4(Treeview, { dir: "rtl", children: [
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 1" }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 2", showIcon: true, icon: "folder", expanded: true, children: /* @__PURE__ */ jsxs4(TreeviewGroup, { children: [
-      /* @__PURE__ */ jsx11(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 2.1" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 2.2", children: /* @__PURE__ */ jsx11(TreeviewGroup, { children: /* @__PURE__ */ jsx11(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 2.2.1" }) }) }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 2.3" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { leafClassName: "k-treeview-load-more-button", text: "Load more..." })
-    ] }) }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 3", showIcon: true, icon: "folder", children: /* @__PURE__ */ jsxs4(TreeviewGroup, { children: [
-      /* @__PURE__ */ jsx11(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 3.1" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 3.2" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { showIcon: true, icon: "folder", text: "Child 3.3" })
-    ] }) })
+import { Fragment as Fragment6, jsx as jsx15, jsxs as jsxs7 } from "react/jsx-runtime";
+var treeview_default = () => /* @__PURE__ */ jsx15(Fragment6, { children: /* @__PURE__ */ jsxs7("div", { id: "test-area", className: "k-d-grid k-grid-cols-4", children: [
+  /* @__PURE__ */ jsx15("span", { children: "states" }),
+  /* @__PURE__ */ jsx15("span", { children: "states (rtl)" }),
+  /* @__PURE__ */ jsx15("span", { children: "hierarchy" }),
+  /* @__PURE__ */ jsx15("span", { children: "hierarchy (rtl)" }),
+  /* @__PURE__ */ jsx15("section", { children: /* @__PURE__ */ jsxs7(TreeviewNormal, { children: [
+    /* @__PURE__ */ jsx15(TreeviewItem, { text: "Normal" }),
+    /* @__PURE__ */ jsx15(TreeviewItem, { text: "Hover", hover: true }),
+    /* @__PURE__ */ jsx15(TreeviewItem, { text: "Focus", focus: true }),
+    /* @__PURE__ */ jsx15(TreeviewItem, { text: "Selected", selected: true }),
+    /* @__PURE__ */ jsx15(TreeviewItem, { text: "Selected focus", selected: true, focus: true }),
+    /* @__PURE__ */ jsx15(TreeviewItem, { text: "Disabled", disabled: true }),
+    /* @__PURE__ */ jsx15(TreeviewItem, { text: "Disabled focus", disabled: true, focus: true }),
+    /* @__PURE__ */ jsx15(TreeviewItem, { leafClassName: "k-treeview-load-more-button", text: "Load more..." })
   ] }) }),
-  /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsxs4(Treeview, { children: [
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 1" }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 2", showCheckbox: true, expanded: true, checked: true, children: /* @__PURE__ */ jsxs4(TreeviewGroup, { children: [
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.1", showCheckbox: true, checked: true }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.2", showCheckbox: true, disabled: true, children: /* @__PURE__ */ jsx11(TreeviewGroup, { children: /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.2.1" }) }) }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.3", showCheckbox: true }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Load more...", leafClassName: "k-treeview-load-more-button" })
-    ] }) }),
-    /* @__PURE__ */ jsxs4(TreeviewItem, { text: "Root 3", showCheckbox: true, children: [
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 3.1" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 3.2" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 3.3" })
-    ] })
+  /* @__PURE__ */ jsx15("section", { children: /* @__PURE__ */ jsxs7(TreeviewNormal, { dir: "rtl", children: [
+    /* @__PURE__ */ jsx15(TreeviewItem, { text: "Normal" }),
+    /* @__PURE__ */ jsx15(TreeviewItem, { text: "Hover", hover: true }),
+    /* @__PURE__ */ jsx15(TreeviewItem, { text: "Focus", focus: true }),
+    /* @__PURE__ */ jsx15(TreeviewItem, { text: "Selected", selected: true }),
+    /* @__PURE__ */ jsx15(TreeviewItem, { text: "Selected focus", selected: true, focus: true }),
+    /* @__PURE__ */ jsx15(TreeviewItem, { text: "Disabled", disabled: true }),
+    /* @__PURE__ */ jsx15(TreeviewItem, { text: "Disabled focus", disabled: true, focus: true }),
+    /* @__PURE__ */ jsx15(TreeviewItem, { leafClassName: "k-treeview-load-more-button", text: "Load more...", hover: true })
   ] }) }),
-  /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsxs4(Treeview, { dir: "rtl", children: [
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 1" }),
-    /* @__PURE__ */ jsx11(TreeviewItem, { text: "Root 2", showCheckbox: true, expanded: true, checked: true, children: /* @__PURE__ */ jsxs4(TreeviewGroup, { children: [
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.1", showCheckbox: true, checked: true }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.2", showCheckbox: true, disabled: true, children: /* @__PURE__ */ jsx11(TreeviewGroup, { children: /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.2.1" }) }) }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 2.3", showCheckbox: true }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Load more...", leafClassName: "k-treeview-load-more-button" })
-    ] }) }),
-    /* @__PURE__ */ jsxs4(TreeviewItem, { text: "Root 3", showCheckbox: true, children: [
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 3.1" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 3.2" }),
-      /* @__PURE__ */ jsx11(TreeviewItem, { text: "Child 3.3" })
-    ] })
-  ] }) })
+  /* @__PURE__ */ jsx15("section", { children: /* @__PURE__ */ jsx15(TreeviewHierarchy, {}) }),
+  /* @__PURE__ */ jsx15("section", { children: /* @__PURE__ */ jsx15(TreeviewHierarchy, { dir: "rtl" }) }),
+  /* @__PURE__ */ jsx15("span", { children: "icons" }),
+  /* @__PURE__ */ jsx15("span", { children: "icons (rtl)" }),
+  /* @__PURE__ */ jsx15("span", { children: "checkboxes" }),
+  /* @__PURE__ */ jsx15("span", { children: "checkboxes (rtl)" }),
+  /* @__PURE__ */ jsx15("section", { children: /* @__PURE__ */ jsx15(TreeviewIcons, {}) }),
+  /* @__PURE__ */ jsx15("section", { children: /* @__PURE__ */ jsx15(TreeviewIcons, { dir: "rtl" }) }),
+  /* @__PURE__ */ jsx15("section", { children: /* @__PURE__ */ jsx15(TreeviewCheckboxes, {}) }),
+  /* @__PURE__ */ jsx15("section", { children: /* @__PURE__ */ jsx15(TreeviewCheckboxes, { dir: "rtl" }) })
 ] }) });
 export {
   treeview_default as default

package/dist/esm/treeview/treeview.spec.js

@@ -4476,8 +4476,20 @@ TreeviewItem.className = TREEVIEWITEM_CLASSNAME;
 TreeviewItem.defaultProps = defaultProps5;
 var treeview_item_spec_default = TreeviewItem;
 
-// src/treeview/treeview.spec.tsx
+// src/treeview/templates/treeview-normal.tsx
 import { jsx as jsx10 } from "react/jsx-runtime";
+
+// src/treeview/templates/treeview-hierarchy.tsx
+import { jsx as jsx11, jsxs as jsxs4 } from "react/jsx-runtime";
+
+// src/treeview/templates/treeview-icons.tsx
+import { jsx as jsx12, jsxs as jsxs5 } from "react/jsx-runtime";
+
+// src/treeview/templates/treeview-checkboxes.tsx
+import { jsx as jsx13, jsxs as jsxs6 } from "react/jsx-runtime";
+
+// src/treeview/treeview.spec.tsx
+import { jsx as jsx14 } from "react/jsx-runtime";
 import { createElement as createElement3 } from "react";
 var TREEVIEW_CLASSNAME = `k-treeview`;
 var states7 = [];
@@ -4512,17 +4524,17 @@ var Treeview = (props) => {
     } else {
       if (children.type === TreeviewItem) {
         listChildren.push(
-          /* @__PURE__ */ jsx10(TreeviewItem, { ...children.props, dir })
+          /* @__PURE__ */ jsx14(TreeviewItem, { ...children.props, dir })
         );
       }
       if (children.type === TreeviewGroup) {
         listChildren.push(
-          /* @__PURE__ */ jsx10(TreeviewGroup, { ...children.props, dir })
+          /* @__PURE__ */ jsx14(TreeviewGroup, { ...children.props, dir })
         );
       }
     }
   }
-  return /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsx14(
     "div",
     {
       ...other,
@@ -4534,7 +4546,7 @@ var Treeview = (props) => {
           size
         })
       ),
-      children: /* @__PURE__ */ jsx10(TreeviewGroup, { className: "k-treeview-lines", dir, children: listChildren })
+      children: /* @__PURE__ */ jsx14(TreeviewGroup, { className: "k-treeview-lines", dir, children: listChildren })
     }
   );
 };

package/dist/types/chat/chat-message-group.d.ts

@@ -0,0 +1,22 @@
+export declare const CHATMESSAGEGROUP_CLASSNAME = "k-message-group";
+declare const states: "selected"[];
+export type KendoChatMessageGroupProps = {
+    alt?: boolean;
+    author?: string;
+    avatar?: null | string;
+};
+export type KendoChatMessageGroupState = {
+    [K in (typeof states)[number]]?: boolean;
+};
+export declare const ChatMessageGroup: {
+    (props: KendoChatMessageGroupProps & KendoChatMessageGroupState & React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    states: "selected"[];
+    options: {};
+    className: string;
+    defaultProps: {
+        author: string;
+        avatar: string;
+        alt: boolean;
+    };
+};
+export default ChatMessageGroup;

package/dist/types/chat/chat-message.d.ts

@@ -0,0 +1,22 @@
+export declare const CHATMESSAGE_CLASSNAME = "k-message";
+declare const states: "selected"[];
+export type KendoChatMessageProps = {
+    time?: string;
+    text?: string;
+    status?: string;
+};
+export type KendoChatMessageState = {
+    [K in (typeof states)[number]]?: boolean;
+};
+export declare const ChatMessage: {
+    (props: KendoChatMessageProps & KendoChatMessageState & React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    states: "selected"[];
+    options: {};
+    className: string;
+    defaultProps: {
+        time: string;
+        text: string;
+        status: string;
+    };
+};
+export default ChatMessage;

package/dist/types/chat/chat-quick-replies.d.ts

@@ -0,0 +1,13 @@
+export type KendoChatQuickRepliesOptions = {
+    actions?: Array<string>;
+};
+export declare const ChatQuickReply: {
+    (props: KendoChatQuickRepliesOptions & React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    states: any[];
+    options: {};
+    className: string;
+    defaultOptions: {
+        actions: string[];
+    };
+};
+export default ChatQuickReply;

package/dist/types/chat/chat.spec.d.ts

@@ -0,0 +1,18 @@
+export type KendoChatProps = {
+    dir?: "ltr" | "rtl";
+    showToolbar?: boolean;
+    showMessageBox?: boolean;
+    showMoreButton?: boolean;
+};
+export declare const Chat: {
+    (props: KendoChatProps & React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    states: any[];
+    options: {};
+    className: string;
+    defaultOptions: {
+        showToolbar: boolean;
+        showMessageBox: boolean;
+        showMoreButton: boolean;
+    };
+};
+export default Chat;

package/dist/types/chat/index.d.ts

@@ -0,0 +1,4 @@
+export * from './chat.spec';
+export * from './chat-message';
+export * from './chat-message-group';
+export * from './chat-quick-replies';

package/dist/types/listgroup/index.d.ts

@@ -0,0 +1,3 @@
+export * from './listgroup.spec';
+export * from './listgroup-item.spec';
+export * from "./templates/listgroup-normal";

package/dist/types/listgroup/listgroup-item.spec.d.ts

@@ -0,0 +1,25 @@
+/// <reference types="react" />
+export declare const LISTGROUPITEM_CLASSNAME = "k-listgroup-item";
+declare const states: never[];
+export type KendoListGroupItemProps = {
+    text?: string;
+    icon?: string;
+    showArrow?: boolean;
+    arrowIconName?: string;
+    children?: JSX.Element;
+    href?: string;
+    pseudo?: boolean;
+};
+export type KendoListGroupItemState = {
+    [K in (typeof states)[number]]?: boolean;
+};
+export declare const ListGroupItem: {
+    (props: KendoListGroupItemProps & KendoListGroupItemState & React.HTMLAttributes<HTMLLIElement>): import("react/jsx-runtime").JSX.Element;
+    states: any[];
+    options: {};
+    className: string;
+    defaultProps: {
+        dir: string;
+    };
+};
+export default ListGroupItem;

package/dist/types/listgroup/listgroup.spec.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+export declare const LISTGROUP_CLASSNAME = "k-listgroup";
+export type KendoListGroupOptions = {
+    children?: JSX.Element | JSX.Element[];
+    dir?: string;
+};
+export declare const ListGroup: {
+    (props: KendoListGroupOptions & React.HTMLAttributes<HTMLUListElement>): import("react/jsx-runtime").JSX.Element;
+    states: any[];
+    options: {};
+    className: string;
+    defaultProps: {
+        dir: string;
+    };
+};
+export default ListGroup;

package/dist/types/listgroup/templates/listgroup-normal.d.ts

@@ -0,0 +1 @@
+export declare const ListGroupNormal: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/multiselect/index.d.ts

@@ -1 +1,7 @@
 export * from './multiselect.spec';
+export * from "./templates/multiselect-normal";
+export * from "./templates/multiselect-popup";
+export * from "./templates/multiselect-value";
+export * from "./templates/multiselect-arrow-button";
+export * from "./templates/multiselect-adaptive";
+export * from "./templates/multiselect-grouping";

package/dist/types/multiselect/multiselect.spec.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import { KendoActionSheetProps } from '../action-sheet';
 export declare const MULTISELECT_CLASSNAME = "k-multiselect";
 declare const states: ("required" | "loading" | "focus" | "invalid" | "disabled" | "readonly" | "hover" | "valid")[];
 declare const options: {
@@ -21,6 +22,8 @@ export type KendoMultiSelectProps = KendoMultiSelectOptions & {
     popup?: JSX.Element;
     showArrowButton?: boolean;
     opened?: boolean;
+    adaptive?: boolean;
+    adaptiveSettings?: KendoActionSheetProps;
 };
 export type KendoMultiSelectState = {
     [K in (typeof states)[number]]?: boolean;

package/dist/types/multiselect/templates/multiselect-adaptive.d.ts

@@ -0,0 +1 @@
+export declare const MultiSelectAdaptive: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/multiselect/templates/multiselect-arrow-button.d.ts

@@ -0,0 +1 @@
+export declare const MultiSelectArrowButton: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/multiselect/templates/multiselect-grouping.d.ts

@@ -0,0 +1 @@
+export declare const MultiSelectGrouping: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/multiselect/templates/multiselect-normal.d.ts

@@ -0,0 +1 @@
+export declare const MultiSelectNormal: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/multiselect/templates/multiselect-popup.d.ts

@@ -0,0 +1 @@
+export declare const MultiSelectPopup: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/multiselect/templates/multiselect-value.d.ts

@@ -0,0 +1 @@
+export declare const MultiSelectValue: ({ size, rounded, children, ...other }: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/pager/pager.spec.d.ts

@@ -7,7 +7,8 @@ export type KendoPagerOptions = {
     size?: (typeof options.size)[number] | null;
 };
 export type KendoPagerProps = KendoPagerOptions & {
-    mobile?: null | 'small' | 'medium';
+    adaptive?: boolean;
+    itemsPerPage?: boolean;
     type?: 'numeric' | 'input';
     pageSizes?: boolean;
     refresh?: boolean;
@@ -26,7 +27,8 @@ export declare const Pager: {
     className: string;
     defaultProps: {
         size: "medium";
-        mobile: null;
+        adaptive: boolean;
+        itemsPerPage: boolean;
         type: string;
         pageSizes: boolean;
         refresh: boolean;

package/dist/types/radio/index.d.ts

@@ -1 +1,4 @@
 export * from './radio.spec';
+export * from "./templates/radio-normal";
+export * from "./templates/radio-label";
+export * from "./templates/radio-inside-label";

package/dist/types/radio/templates/radio-inside-label.d.ts

@@ -0,0 +1 @@
+export declare const RadioButtonInsideLabel: ({ children, ...other }: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/radio/templates/radio-label.d.ts

@@ -0,0 +1 @@
+export declare const RadioButtonLabel: ({ children, id, ...other }: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/radio/templates/radio-normal.d.ts

@@ -0,0 +1 @@
+export declare const RadioButtonNormal: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/scrollview/index.d.ts

@@ -0,0 +1 @@
+export * from './scrollview-spec';