sprint-asia-custom-component 0.1.148 → 0.1.150

package/dist/index.js

@@ -26087,7 +26087,8 @@
     maxFiles = 1,
     selectedFile,
     error = "",
-    disabled
+    disabled,
+    acceptExcel = false
   }) => {
     const [errorMessage, setErrorMessage] = React.useState("");
     const onDropRejected = rejectedFiles => {
@@ -26095,20 +26096,31 @@
       if (file.errors[0]?.code === "file-too-large") {
         setErrorMessage("Your file is too large. Max file size is 5 MB");
       } else if (file.errors[0]?.code === "file-invalid-type") {
-        setErrorMessage("File format not supported. Please try again with PNG, JPEG, JPG, or PDF file within 5 MB");
+        setErrorMessage(excelAcceptedFiles ? "File format not supported. Please try again with XLSX, XLS, CSV, or TSV file within 5 MB" : "File format not supported. Please try again with PNG, JPEG, JPG, or PDF file within 5 MB");
       }
     };
+
+    // Default file types
+    const defaultAcceptedFiles = {
+      "image/jpeg": [".jpeg", ".jpg"],
+      "image/png": [".png"],
+      "application/pdf": [".pdf"]
+    };
+
+    // Additional file types
+    const excelAcceptedFiles = {
+      "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": [".xlsx"],
+      "application/vnd.ms-excel": [".xls"],
+      "text/csv": [".csv"],
+      "text/tab-separated-values": [".tsv"]
+    };
     const {
       getRootProps,
       getInputProps
     } = useDropzone({
       onDrop,
       maxFiles,
-      accept: {
-        "image/jpeg": [".jpeg", ".jpg"],
-        "image/png": [".png"],
-        "application/pdf": [".pdf"]
-      },
+      accept: acceptExcel ? excelAcceptedFiles : defaultAcceptedFiles,
       noKeyboard: true,
       maxSize: 5242881,
       onDropRejected,
@@ -48179,9 +48191,9 @@
     additionalButton
   }) => {
     return /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "fixed bottom-0 flex justify-end w-full items-center py-1 px-6 bg-white"
+      className: "fixed left-0 bottom-0 flex justify-end w-full flex-1 items-center py-1 px-6 bg-white"
     }, /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "flex items-center mr-48"
+      className: "flex items-center"
     }, isActiveLeftButton && /*#__PURE__*/React__default["default"].createElement("div", {
       className: "m-1"
     }, modeLeftButton === "primary" && /*#__PURE__*/React__default["default"].createElement(PrimaryButton, {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "sprint-asia-custom-component",
   "main": "dist/index.js",
-  "version": "0.1.148",
+  "version": "0.1.150",
   "private": false,
   "dependencies": {
     "@headlessui/react": "^1.7.18",

package/src/components/dropzone/uploadfile/index.js

@@ -11,6 +11,7 @@ const DropzoneUploadFile = ({
   selectedFile,
   error = "",
   disabled,
+  acceptExcel = false,
 }) => {
   const [errorMessage, setErrorMessage] = useState("");
 
@@ -19,18 +20,33 @@ const DropzoneUploadFile = ({
     if (file.errors[0]?.code === "file-too-large") {
       setErrorMessage("Your file is too large. Max file size is 5 MB");
     } else if (file.errors[0]?.code === "file-invalid-type") {
-      setErrorMessage("File format not supported. Please try again with PNG, JPEG, JPG, or PDF file within 5 MB");
+      setErrorMessage(
+        excelAcceptedFiles
+          ? "File format not supported. Please try again with XLSX, XLS, CSV, or TSV file within 5 MB"
+          : "File format not supported. Please try again with PNG, JPEG, JPG, or PDF file within 5 MB"
+      );
     }
   };
 
+  // Default file types
+  const defaultAcceptedFiles = {
+    "image/jpeg": [".jpeg", ".jpg"],
+    "image/png": [".png"],
+    "application/pdf": [".pdf"],
+  };
+
+  // Additional file types
+  const excelAcceptedFiles = {
+    "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": [".xlsx"],
+    "application/vnd.ms-excel": [".xls"],
+    "text/csv": [".csv"],
+    "text/tab-separated-values": [".tsv"],
+  };
+
   const { getRootProps, getInputProps } = useDropzone({
     onDrop,
     maxFiles,
-    accept: {
-      "image/jpeg": [".jpeg", ".jpg"],
-      "image/png": [".png"],
-      "application/pdf": [".pdf"],
-    },
+    accept: acceptExcel ? excelAcceptedFiles : defaultAcceptedFiles,
     noKeyboard: true,
     maxSize: 5242881,
     onDropRejected,

package/src/components/footer/index.js

@@ -16,8 +16,8 @@ const Footer = ({
   additionalButton,
 }) => {
   return (
-    <div className="fixed bottom-0 flex justify-end w-full items-center py-1 px-6 bg-white">
-      <div className="flex items-center mr-48">
+    <div className="fixed left-0 bottom-0 flex justify-end w-full flex-1 items-center py-1 px-6 bg-white">
+      <div className="flex items-center">
         {isActiveLeftButton && (
           <div className="m-1">
             {modeLeftButton === "primary" && (

package/src/templates/index.js

@@ -1146,7 +1146,14 @@ const Templates = () => {
 
       <div className="m-9"></div>
       <p className="text-black font-bold text-2xl text-center py-2">Dropzone</p>
-      <DropzoneUploadFile title="Upload Your File" subtitle="Accepts PDF, JPEG, JPG. Max size 5 MB" required={true} />
+      <DropzoneUploadFile
+        title="Upload Your File"
+        subtitle="Accepts PDF, JPEG, JPG. Max size 5 MB"
+        required={true}
+        onDrop={handleFileChange}
+        selectedFile={currentImage}
+        acceptExcel
+      />
 
       <div className="m-9"></div>
       <DropzoneUploadPhoto