@progress/kendo-themes-html 5.6.1-dev.2 → 5.6.1-dev.5

package/dist/upload/tests/upload-react.js

@@ -111,6 +111,8 @@
         active,
         selected,
         disabled,
+        showArrow,
+        arrowIconName,
         ...htmlAttributes
       } = this.props;
       const hasIcon = icon !== void 0;
@@ -138,47 +140,24 @@
       }, icon && /* @__PURE__ */ React2.createElement(Icon, {
         className: classNames(iconClassName, "k-button-icon"),
         name: icon
-      }), text || hasIcon ? /* @__PURE__ */ React2.createElement(React2.Fragment, null, text && /* @__PURE__ */ React2.createElement("span", {
+      }), text ? /* @__PURE__ */ React2.createElement(React2.Fragment, null, text && /* @__PURE__ */ React2.createElement("span", {
         className: "k-button-text"
       }, text), children) : children && /* @__PURE__ */ React2.createElement("span", {
         className: "k-button-text"
-      }, children));
+      }, children), showArrow && /* @__PURE__ */ React2.createElement("span", {
+        className: "k-menu-button-arrow k-button-arrow"
+      }, /* @__PURE__ */ React2.createElement(Icon, {
+        name: arrowIconName
+      })));
     }
   };
   Button.defaultProps = {
     size: "medium",
     rounded: "medium",
     fillMode: "solid",
-    themeColor: "base"
-  };
-
-  // src/action-buttons/action-buttons.tsx
-  var React3 = __toESM(__require("react"));
-  var ActionButtons = class extends React3.Component {
-    render() {
-      const {
-        children,
-        className,
-        alignment,
-        orientation,
-        ...htmlAttributes
-      } = this.props;
-      return /* @__PURE__ */ React3.createElement("div", {
-        ...htmlAttributes,
-        className: classNames(
-          "k-actions",
-          {
-            [`k-actions-${alignment}`]: alignment,
-            [`k-actions-${orientation}`]: orientation
-          },
-          className
-        )
-      }, children);
-    }
-  };
-  ActionButtons.defaultProps = {
-    alignment: "start",
-    orientation: "horizontal"
+    themeColor: "base",
+    showArrow: false,
+    arrowIconName: "arrow-s"
   };
 
   // src/upload/tests/upload-react.tsx
@@ -190,183 +169,87 @@
         max-width: 400px;
     }
 `;
-  var progressStyle = {
-    width: "100%",
-    transition: "opacity 0.5s ease-in-out 0s"
-  };
-  var progress70Style = {
-    width: "70%",
-    transition: "opacity 0.5s ease-in-out 0s"
-  };
-  var progress17Style = {
-    width: "17%",
-    transition: "opacity 0.5s ease-in-out 0s"
-  };
-  var progress0Style = {
-    width: "0%",
-    transition: "opacity 0.5s ease-in-out 0s"
-  };
   root.render(
     /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("style", null, style), /* @__PURE__ */ import_react.default.createElement("div", {
       id: "test-area",
       className: "k-d-grid k-grid-cols-2"
     }, /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-widget k-upload k-header"
+      className: "k-widget k-upload"
     }, /* @__PURE__ */ import_react.default.createElement("div", {
       className: "k-dropzone"
     }, /* @__PURE__ */ import_react.default.createElement(Button, {
       className: "k-upload-button"
-    }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
+    }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("em", {
+      className: "k-dropzone-hint k-hidden"
+    }, "Drop files here to upload"), /* @__PURE__ */ import_react.default.createElement("strong", {
       className: "k-upload-status k-upload-status-total"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
-      name: "loading"
+      name: "upload"
     }), "Uploading...")), /* @__PURE__ */ import_react.default.createElement("ul", {
       className: "k-upload-files k-reset"
     }, /* @__PURE__ */ import_react.default.createElement("li", {
       className: "k-file k-file-invalid"
     }, /* @__PURE__ */ import_react.default.createElement("div", {
       className: "k-file-single"
+    }, /* @__PURE__ */ import_react.default.createElement("div", {
+      className: "k-progressbar k-hidden"
     }, /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-progress",
-      style: progress0Style
+      style: { width: "60%" }
+    })), /* @__PURE__ */ import_react.default.createElement("span", {
+      className: "k-file-invalid-group-wrapper"
+    }, /* @__PURE__ */ import_react.default.createElement(Icon, {
+      className: "k-file-group",
+      name: "file-image"
     }), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-invalid-extension-wrapper"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-invalid-icon"
-    }, "!"), /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-state"
     })), /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-name-size-wrapper"
     }, /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-name k-file-name-invalid"
-    }, "Video_File_with_Very_Very_Very_Very_Long_Name.psd"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-validation-message"
+    }, "Video_File_with_Very_Very_Very_Very_Long_Name.jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
+      className: "k-file-validation-message k-text-error"
     }, "File type not allowed.")), /* @__PURE__ */ import_react.default.createElement("strong", {
       className: "k-upload-status"
     }, /* @__PURE__ */ import_react.default.createElement(Button, {
+      icon: "close",
       fillMode: "flat",
-      className: "k-upload-action",
-      icon: "close"
+      className: "k-upload-action"
     })))), /* @__PURE__ */ import_react.default.createElement("li", {
       className: "k-file k-file-progress"
     }, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-file-single"
+      className: "k-progressbar"
     }, /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-progress",
-      style: progress70Style
-    }), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-extension-wrapper"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-extension"
-    }, "mkv"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-state"
+      style: { width: "60%" }
     })), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name-size-wrapper"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name"
-    }, "Document.mkv"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-size"
-    }, "156.33 MB")), /* @__PURE__ */ import_react.default.createElement("strong", {
-      className: "k-upload-status"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-upload-pct"
-    }, "70%"), /* @__PURE__ */ import_react.default.createElement(Button, {
-      fillMode: "flat",
-      className: "k-upload-action",
-      icon: "cancel"
-    }))))))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-widget k-upload k-header"
-    }, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-dropzone"
-    }, /* @__PURE__ */ import_react.default.createElement(Button, {
-      className: "k-upload-button"
-    }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-upload-status k-upload-status-total"
+      className: "k-file-group-wrapper"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
-      name: "check"
-    }), "Done")), /* @__PURE__ */ import_react.default.createElement("ul", {
-      className: "k-upload-files k-reset"
-    }, /* @__PURE__ */ import_react.default.createElement("li", {
-      className: "k-file k-file-success"
-    }, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-file-single"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-progress",
-      style: progressStyle
-    }), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-extension-wrapper"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-extension"
-    }, "png"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-state"
-    })), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name-size-wrapper"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name"
-    }, "Image1_With_Very_Very_Very_Very_Long_Name.png"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-size"
-    }, "24.34 KB")), /* @__PURE__ */ import_react.default.createElement("strong", {
-      className: "k-upload-status"
-    }, /* @__PURE__ */ import_react.default.createElement(Button, {
-      fillMode: "flat",
-      className: "k-upload-action",
-      icon: "close"
-    })))), /* @__PURE__ */ import_react.default.createElement("li", {
-      className: "k-file k-file-success"
-    }, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-file-single"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-progress",
-      style: progressStyle
+      className: "k-file-group",
+      name: "file-pdf"
     }), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-extension-wrapper"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-extension"
-    }, "png"), /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-state"
-    })), /* @__PURE__ */ import_react.default.createElement("span", {
+    }, "uploaded")), /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-name-size-wrapper"
     }, /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-name"
-    }, "Image2.png"), /* @__PURE__ */ import_react.default.createElement("span", {
+    }, "Document.txt"), /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-size"
-    }, "19.85 KB")), /* @__PURE__ */ import_react.default.createElement("strong", {
+    }, "225.68 KB")), /* @__PURE__ */ import_react.default.createElement("strong", {
       className: "k-upload-status"
     }, /* @__PURE__ */ import_react.default.createElement(Button, {
+      icon: "close",
       fillMode: "flat",
-      className: "k-upload-action",
-      icon: "close"
-    }))))))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-widget k-upload k-header"
+      className: "k-upload-action"
+    })))))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
+      className: "k-widget k-upload"
     }, /* @__PURE__ */ import_react.default.createElement("div", {
       className: "k-dropzone"
     }, /* @__PURE__ */ import_react.default.createElement(Button, {
       className: "k-upload-button"
-    }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-dropzone-hint"
-    }, "Drop files here to upload")))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-widget k-upload k-header"
-    }, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-dropzone k-dropzone-active k-dropzone-hovered"
-    }, /* @__PURE__ */ import_react.default.createElement(Button, {
-      className: "k-upload-button"
-    }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-dropzone-hint"
-    }, "Drop files here to upload")))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-widget k-upload k-header k-state-disabled"
-    }, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-dropzone"
-    }, /* @__PURE__ */ import_react.default.createElement(Button, {
-      className: "k-upload-button"
-    }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-dropzone-hint"
-    }, "Drop files here to upload")))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-widget k-upload k-header"
-    }, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-dropzone"
-    }, /* @__PURE__ */ import_react.default.createElement(Button, {
-      className: "k-upload-button"
-    }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
+    }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("em", {
+      className: "k-dropzone-hint k-hidden"
+    }, "Drop files here to upload"), /* @__PURE__ */ import_react.default.createElement("strong", {
       className: "k-upload-status k-upload-status-total"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       name: "check"
@@ -376,181 +259,56 @@
       className: "k-file k-file-success"
     }, /* @__PURE__ */ import_react.default.createElement("div", {
       className: "k-file-multiple"
+    }, /* @__PURE__ */ import_react.default.createElement("div", {
+      className: "k-progressbar",
+      hidden: true
     }, /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-progress",
-      style: progressStyle
-    }), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-multiple-files-extension-wrapper"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-state"
+      style: { width: "0%" }
     })), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name-size-wrapper"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name"
-    }, "Video_File_with_Very_Very_Very_Very_Long_Name.jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name"
-    }, "Video_File_with_Very_Very_Very_Very_Long_Name2.png"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name"
-    }, "Video3.png"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name"
-    }, "Video4.jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-information"
-    }, "Total: 4 files, 152.21 KB")), /* @__PURE__ */ import_react.default.createElement("strong", {
-      className: "k-upload-status"
-    }, /* @__PURE__ */ import_react.default.createElement(Button, {
-      fillMode: "flat",
-      className: "k-upload-action",
-      icon: "close"
-    }))))))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-widget k-upload k-header"
-    }, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-dropzone"
-    }, /* @__PURE__ */ import_react.default.createElement(Button, {
-      className: "k-upload-button"
-    }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-upload-status k-upload-status-total"
+      className: "k-multiple-files-group-wrapper"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
-      name: "loading"
-    }), "Uploading...")), /* @__PURE__ */ import_react.default.createElement("ul", {
-      className: "k-upload-files k-reset"
-    }, /* @__PURE__ */ import_react.default.createElement("li", {
-      className: "k-file k-file-progress"
-    }, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-file-multiple"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-progress",
-      style: progress17Style
+      className: "k-file-group",
+      name: "files"
     }), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-multiple-files-extension-wrapper"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-state"
-    })), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name-size-wrapper"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name"
-    }, "Image_With_Very_Very_Very_Very_Very_Long_Name1.pdf"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name"
-    }, "Image_With_Very_Very_Very_Very_Very_Long_Name2.pdf"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name"
-    }, "Image3.pdf"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name"
-    }, "Image4.jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-information"
-    }, "Total: 4 files, 1.35 MB")), /* @__PURE__ */ import_react.default.createElement("strong", {
-      className: "k-upload-status"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-upload-pct"
-    }, "17%"), /* @__PURE__ */ import_react.default.createElement(Button, {
-      fillMode: "flat",
-      className: "k-upload-action",
-      icon: "cancel"
-    }))))))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-widget k-upload k-header"
-    }, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-dropzone"
-    }, /* @__PURE__ */ import_react.default.createElement(Button, {
-      className: "k-upload-button"
-    }, "Select files...")), /* @__PURE__ */ import_react.default.createElement("ul", {
-      className: "k-upload-files k-reset"
-    }, /* @__PURE__ */ import_react.default.createElement("li", {
-      className: "k-file k-file-invalid"
-    }, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-file-multiple"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-progress",
-      style: progress0Style
-    }), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-multiple-files-invalid-extension-wrapper"
+    }, "uploaded")), /* @__PURE__ */ import_react.default.createElement("span", {
+      className: "k-multiple-files-wrapper"
     }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-invalid-icon"
-    }, "!"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-state"
-    })), /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-name-size-wrapper"
     }, /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-name"
-    }, "Movie_With_Very_Very_Very_Very_Very_Long_Name1.png"), /* @__PURE__ */ import_react.default.createElement("span", {
+    }, "Video_File_with_Very_Very_Very_Very_Long_Name.png"), /* @__PURE__ */ import_react.default.createElement("span", {
+      className: "k-file-size"
+    }, "19.61 KB")), /* @__PURE__ */ import_react.default.createElement("span", {
+      className: "k-file-name-size-wrapper"
+    }, " ", /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-name"
-    }, "Movie2.jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name k-file-name-invalid"
-    }, "Image1.mkv"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-name k-file-name-invalid"
-    }, "Image2.mkv"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-validation-message"
-    }, "Invalid file(s). Please check file upload requirements.")), /* @__PURE__ */ import_react.default.createElement("strong", {
-      className: "k-upload-status"
-    }, /* @__PURE__ */ import_react.default.createElement(Button, {
-      fillMode: "flat",
-      className: "k-upload-action",
-      icon: "close"
-    }))))))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-widget k-upload k-header"
-    }, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-dropzone"
-    }, /* @__PURE__ */ import_react.default.createElement(Button, {
-      className: "k-upload-button"
-    }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-dropzone-hint"
-    }, "Drop files here to upload")), /* @__PURE__ */ import_react.default.createElement("ul", {
-      className: "k-upload-files k-reset"
-    }, /* @__PURE__ */ import_react.default.createElement("li", {
-      className: "k-file"
-    }, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-file-single"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-progress",
-      style: progress0Style
-    }), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-extension-wrapper"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-extension"
-    }, "png"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-state"
-    })), /* @__PURE__ */ import_react.default.createElement("span", {
+    }, "Video_File_with_Very_Very_Very_VeryLong_Name2.jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
+      className: "k-file-size"
+    }, "106.43 KB"), " "), /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-name-size-wrapper"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
+    }, " ", /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-name"
-    }, "Image_With_Very_Very_Very_Very_Very_Long_Name1.png"), /* @__PURE__ */ import_react.default.createElement("span", {
+    }, "Video3.png"), /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-size"
-    }, "51.23 KB")), /* @__PURE__ */ import_react.default.createElement("strong", {
-      className: "k-upload-status"
-    }, /* @__PURE__ */ import_react.default.createElement(Button, {
-      fillMode: "flat",
-      className: "k-upload-action",
-      icon: "close"
-    })))), /* @__PURE__ */ import_react.default.createElement("li", {
-      className: "k-file"
-    }, /* @__PURE__ */ import_react.default.createElement("div", {
-      className: "k-file-single"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-progress",
-      style: progress0Style
-    }), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-extension-wrapper"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-extension"
-    }, "jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
-      className: "k-file-state"
-    })), /* @__PURE__ */ import_react.default.createElement("span", {
+    }, "24.34 KB"), " "), /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-name-size-wrapper"
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
+    }, " ", /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-name"
-    }, "Image_With_Very_Very_Very_Very_Very_Long_Name2.jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
+    }, "Video4.png"), /* @__PURE__ */ import_react.default.createElement("span", {
       className: "k-file-size"
-    }, "106.43 KB")), /* @__PURE__ */ import_react.default.createElement("strong", {
+    }, "19.85 KB"), " "), /* @__PURE__ */ import_react.default.createElement("span", {
+      className: "k-file-information k-hidden"
+    }, "Total: 4 files, 170.22 KB"), /* @__PURE__ */ import_react.default.createElement("span", {
+      className: "k-file-validation-message k-text-success"
+    }, "4 File(s) uploaded successfully.")), /* @__PURE__ */ import_react.default.createElement("strong", {
       className: "k-upload-status"
     }, /* @__PURE__ */ import_react.default.createElement(Button, {
+      icon: "close",
       fillMode: "flat",
-      className: "k-upload-action",
-      icon: "close"
-    }))))), /* @__PURE__ */ import_react.default.createElement(ActionButtons, {
-      alignment: "end"
-    }, /* @__PURE__ */ import_react.default.createElement(Button, {
-      className: "k-clear-selected"
-    }, "Clear"), /* @__PURE__ */ import_react.default.createElement(Button, {
-      themeColor: "primary",
-      className: "k-upload-selected"
-    }, "Upload"))))))
+      className: "k-upload-action"
+    })))))))))
   );
 })();
 //# sourceMappingURL=upload-react.js.map