@progress/kendo-themes-html 7.0.2-dev.4 → 7.0.2

package/dist/cjs/fab/tests/fab-states.js

@@ -4420,34 +4420,87 @@ var import_jsx_runtime5 = require("react/jsx-runtime");
 
 // src/fab/fab-item.tsx
 var import_jsx_runtime6 = require("react/jsx-runtime");
+var className = `k-fab-item`;
 var states5 = [
   States.hover,
   States.focus,
   States.active,
   States.disabled
 ];
+var FloatingActionButtonItem = (props) => {
+  const {
+    text,
+    icon,
+    align,
+    hover,
+    focus,
+    active,
+    disabled,
+    ...other
+  } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+    "li",
+    {
+      ...other,
+      className: classNames(
+        props.className,
+        className,
+        {
+          [`k-text-${align}`]: align
+        },
+        stateClassNames(className, {
+          hover,
+          focus,
+          active,
+          disabled
+        })
+      ),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "k-fab-item-text", children: text }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Icon, { className: "k-fab-item-icon", icon })
+      ]
+    }
+  );
+};
+FloatingActionButtonItem.states = states5;
 
-// src/fab/tests/fab-states.tsx
+// src/fab/templates/text-fab.tsx
 var import_jsx_runtime7 = require("react/jsx-runtime");
+
+// src/fab/templates/icon-fab.tsx
+var import_jsx_runtime8 = require("react/jsx-runtime");
+var IconFloatingActionButton = (props) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  FloatingActionButton,
+  {
+    icon: "plus",
+    ...props
+  }
+);
+
+// src/fab/templates/icon-text-fab.tsx
+var import_jsx_runtime9 = require("react/jsx-runtime");
+
+// src/fab/tests/fab-states.tsx
+var import_jsx_runtime10 = require("react/jsx-runtime");
 var styles = `
     #test-area {
         grid-template-columns: 100px repeat(6, 1fr);
         grid-template-rows: 10px repeat(11, 50px);
     }
 `;
-var fab_states_default = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("style", { children: styles }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { id: "test-area", className: "k-d-grid k-grid-cols-6", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", {}),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "Normal" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "Hover" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "Focus" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "Active" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "Selected" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "Disabled" }),
-    [...FloatingActionButton.options.themeColor].map((themeColor) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { style: { alignSelf: "center" }, children: themeColor }),
-      ["normal", ...FloatingActionButton.states].map((state) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_jsx_runtime7.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { style: { position: "relative" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { icon: "plus", position: "top-start", themeColor, ...{ [state]: true } }) }) }))
+var fab_states_default = () => /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
+  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("style", { children: styles }),
+  /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { id: "test-area", className: "k-d-grid k-grid-cols-6", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", {}),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: "Normal" }),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: "Hover" }),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: "Focus" }),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: "Active" }),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: "Selected" }),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: "Disabled" }),
+    [...FloatingActionButton.options.themeColor].map((themeColor) => /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { style: { alignSelf: "center" }, children: themeColor }),
+      ["normal", ...FloatingActionButton.states].map((state) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_jsx_runtime10.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { style: { position: "relative" }, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(IconFloatingActionButton, { position: "top-start", themeColor, ...{ [state]: true } }) }) }))
     ] }))
   ] })
 ] });

package/dist/cjs/fab/tests/fab.js

@@ -4420,66 +4420,100 @@ var import_jsx_runtime5 = require("react/jsx-runtime");
 
 // src/fab/fab-item.tsx
 var import_jsx_runtime6 = require("react/jsx-runtime");
+var className = `k-fab-item`;
 var states5 = [
   States.hover,
   States.focus,
   States.active,
   States.disabled
 ];
+var FloatingActionButtonItem = (props) => {
+  const {
+    text,
+    icon,
+    align,
+    hover,
+    focus,
+    active,
+    disabled,
+    ...other
+  } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+    "li",
+    {
+      ...other,
+      className: classNames(
+        props.className,
+        className,
+        {
+          [`k-text-${align}`]: align
+        },
+        stateClassNames(className, {
+          hover,
+          focus,
+          active,
+          disabled
+        })
+      ),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "k-fab-item-text", children: text }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Icon, { className: "k-fab-item-icon", icon })
+      ]
+    }
+  );
+};
+FloatingActionButtonItem.states = states5;
 
-// src/fab/tests/fab.tsx
+// src/fab/templates/text-fab.tsx
 var import_jsx_runtime7 = require("react/jsx-runtime");
+var TextFloatingActionButton = (props) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  FloatingActionButton,
+  {
+    text: "Create",
+    ...props
+  }
+);
+
+// src/fab/templates/icon-fab.tsx
+var import_jsx_runtime8 = require("react/jsx-runtime");
+var IconFloatingActionButton = (props) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  FloatingActionButton,
+  {
+    icon: "plus",
+    ...props
+  }
+);
+
+// src/fab/templates/icon-text-fab.tsx
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var IconTextFloatingActionButton = (props) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+  FloatingActionButton,
+  {
+    icon: "plus",
+    text: "Create",
+    ...props
+  }
+);
+
+// src/fab/tests/fab.tsx
+var import_jsx_runtime10 = require("react/jsx-runtime");
 var styles = `
     #test-area {
         grid-template-columns: 200px repeat(3, 1fr);
     }
 `;
-var fab_default = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("style", { children: styles }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { id: "test-area", className: "k-d-grid", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", {}),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "Text" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "Text + Icon" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "Icon" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "primary" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "primary", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "primary", icon: "plus", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "primary", icon: "plus" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "secondary" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "secondary", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "secondary", icon: "plus", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "secondary", icon: "plus" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "tertiary" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "tertiary", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "tertiary", icon: "plus", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "tertiary", icon: "plus" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "info" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "info", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "info", icon: "plus", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "info", icon: "plus" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "success" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "success", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "success", icon: "plus", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "success", icon: "plus" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "warning" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "warning", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "warning", icon: "plus", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "warning", icon: "plus" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "error" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "error", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "error", icon: "plus", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "error", icon: "plus" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "dark" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "dark", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "dark", icon: "plus", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "dark", icon: "plus" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "light" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "light", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "light", icon: "plus", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "light", icon: "plus" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "inverse" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "inverse", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "inverse", icon: "plus", text: "Create" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FloatingActionButton, { themeColor: "inverse", icon: "plus" }) })
+var fab_default = () => /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
+  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("style", { children: styles }),
+  /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { id: "test-area", className: "k-d-grid", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", {}),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: "Text" }),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: "Text + Icon" }),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: "Icon" }),
+    FloatingActionButton.options.themeColor.map((color) => /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: color }),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(TextFloatingActionButton, { themeColor: color }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(IconTextFloatingActionButton, { themeColor: color }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(IconFloatingActionButton, { themeColor: color }) })
+    ] }))
   ] })
 ] });

package/dist/cjs/filemanager/tests/filemanager-dialogs.js

@@ -4650,7 +4650,7 @@ var Upload = (props) => {
         props.children && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("ul", { className: "k-upload-files", children: props.children }),
         actions && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(action_buttons_spec_default, { alignment: "end", orientation: "horizontal", children: [
           /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Button, { className: "k-clear-selected", children: "Clear" }),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Button, { themeColor: "primary", className: "k-upload-selected", children: "Update" })
+          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Button, { themeColor: "primary", className: "k-upload-selected", children: "Upload" })
         ] })
       ]
     }
@@ -4809,32 +4809,48 @@ var import_jsx_runtime19 = require("react/jsx-runtime");
 // src/upload/upload-file-multiple.tsx
 var import_jsx_runtime20 = require("react/jsx-runtime");
 
-// src/filemanager/tests/filemanager-dialogs.tsx
+// src/upload/templates/upload-chunk.tsx
 var import_jsx_runtime21 = require("react/jsx-runtime");
+
+// src/upload/templates/upload-batch.tsx
+var import_jsx_runtime22 = require("react/jsx-runtime");
+
+// src/upload/templates/upload-normal.tsx
+var import_jsx_runtime23 = require("react/jsx-runtime");
+var UploadNormal = (props) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  Upload,
+  {
+    async: true,
+    ...props
+  }
+);
+
+// src/filemanager/tests/filemanager-dialogs.tsx
+var import_jsx_runtime24 = require("react/jsx-runtime");
 var styles = `
     .k-dialog {
         width: 100%;
         position: relative;
     }
 `;
-var filemanager_dialogs_default = () => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
-  /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("style", { children: styles }),
-  /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { id: "test-area", className: "k-d-grid k-grid-cols-2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("section", { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DialogNormal, { title: "Upload Files", actions: ["x"], actionButtonsAlign: "start", className: "k-filemanager-upload-dialog", actionButtons: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Button, { themeColor: "primary", children: "Upload" }),
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Button, { children: "Cancel" })
-    ] }), children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Upload, { async: true, empty: true, status: "upload" }) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: " " }),
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("section", { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DialogNormal, { title: "Confirm", actions: ["x"], actionButtonsAlign: "start", actionButtons: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Button, { themeColor: "primary", children: "Confirm" }),
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Button, { children: "Cancel" })
-    ] }), children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { children: "Do you want to move or copy?" }) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("section", { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(DialogNormal, { title: "Confirm", actions: ["x"], actionButtonsAlign: "start", actionButtons: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Button, { themeColor: "primary", children: "Confirm" }),
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Button, { children: "Cancel" })
+var filemanager_dialogs_default = () => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
+  /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("style", { children: styles }),
+  /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { id: "test-area", className: "k-d-grid k-grid-cols-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("section", { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DialogNormal, { title: "Upload Files", actions: ["x"], actionButtonsAlign: "start", className: "k-filemanager-upload-dialog", actionButtons: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Button, { themeColor: "primary", children: "Upload" }),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Button, { children: "Cancel" })
+    ] }), children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(UploadNormal, { empty: true, status: "upload" }) }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { children: " " }),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("section", { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DialogNormal, { title: "Confirm", actions: ["x"], actionButtonsAlign: "start", actionButtons: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Button, { themeColor: "primary", children: "Confirm" }),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Button, { children: "Cancel" })
+    ] }), children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { children: "Do you want to move or copy?" }) }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("section", { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DialogNormal, { title: "Confirm", actions: ["x"], actionButtonsAlign: "start", actionButtons: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Button, { themeColor: "primary", children: "Confirm" }),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Button, { children: "Cancel" })
     ] }), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { children: "Are you sure you want to delete this file?" }),
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { children: "You can't undo this action." })
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { children: "Are you sure you want to delete this file?" }),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { children: "You can't undo this action." })
     ] }) })
   ] })
 ] });