@spaced-out/ui-design-system 0.1.49 → 0.1.50

package/CHANGELOG.md

@@ -2,6 +2,13 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.1.50](https://github.com/spaced-out/ui-design-system/compare/v0.1.49...v0.1.50) (2023-09-15)
+
+
+### Features
+
+* external file deletion support for file upload ([32cf857](https://github.com/spaced-out/ui-design-system/commit/32cf857a9688c2a20b1214381caccde699c192c4))
+
 ### [0.1.49](https://github.com/spaced-out/ui-design-system/compare/v0.1.48...v0.1.49) (2023-09-15)
 
 

package/lib/components/FileUpload/FileBlock/FileBlock.js.flow

@@ -18,7 +18,7 @@ type ClassNames = $ReadOnly<{
 export type FileBlockProps = {
   classNames?: ClassNames,
   fileObject: FileObject,
-  onFileRefreshClick?: (file: FileObject) => void,
+  onFileRefreshClick?: (file: FileObject) => mixed,
   handleFileClear?: (id: string) => mixed,
 };
 

package/lib/components/FileUpload/FileUpload.js

@@ -31,7 +31,8 @@ const FileUploadBase = (props, ref) => {
     onRejectedFilesDrop,
     onFileClear,
     onFileRefreshClick,
-    maxFiles = 1
+    maxFiles = 1,
+    handleFileDeletionExternally
   } = props;
 
   // Get file upload state from useFileUpload hook
@@ -62,6 +63,7 @@ const FileUploadBase = (props, ref) => {
     moveFileToProgress,
     moveFileToSuccess,
     moveFileToReject,
+    handleFileClear,
     setShowReUpload,
     validFiles,
     rejectedFiles,
@@ -95,7 +97,7 @@ const FileUploadBase = (props, ref) => {
   }, /*#__PURE__*/React.createElement(_FileBlock.FileBlock, {
     fileObject: fileObject,
     onFileRefreshClick: onFileRefreshClick,
-    handleFileClear: handleFileClear
+    handleFileClear: handleFileDeletionExternally ? onFileClear : handleFileClear
   })))));
 };
 const FileUpload = /*#__PURE__*/React.forwardRef(FileUploadBase);

package/lib/components/FileUpload/FileUpload.js.flow

@@ -23,8 +23,15 @@ type ClassNames = $ReadOnly<{
 
 export type FileProgress = number | 'indeterminate';
 
+type LocalFileProps = {
+  name?: string,
+  type?: string,
+  size?: number,
+  ...
+};
+
 export type FileObject = {
-  file: File,
+  file: File | LocalFileProps,
   id: string,
   reject?: boolean,
   rejectReason?: string,
@@ -53,6 +60,7 @@ export type FileUploadRef = {
   moveFileToSuccess: (id: string, successMessage?: string) => mixed,
   moveFileToReject: (id: string, rejectReason?: string) => mixed,
   setShowReUpload: (id: string, showReUpload?: boolean) => mixed,
+  handleFileClear: (id: string) => mixed,
   validFiles: Array<FileObject>,
   rejectedFiles: Array<FileObject>,
   files: Array<FileObject>,
@@ -66,12 +74,12 @@ export type FileUploadBaseProps = {
   disabled?: boolean,
 
   // File drop callbacks
-  onValidFilesDrop?: (acceptedFiles: Array<FileObject>) => void,
-  onRejectedFilesDrop?: (fileRejections: Array<FileObject>) => void,
+  onValidFilesDrop?: (acceptedFiles: Array<FileObject>) => mixed,
+  onRejectedFilesDrop?: (fileRejections: Array<FileObject>) => mixed,
 
   // File clear callbacks
-  onFileClear?: (id: string) => void,
-  onClear?: () => void,
+  onFileClear?: (id: string) => mixed,
+  onClear?: () => mixed,
 };
 
 export type FileUploadProps = {
@@ -83,9 +91,10 @@ export type FileUploadProps = {
   draggingInstruction?: React.Node,
   secondaryInstruction?: React.Node,
   required?: boolean,
+  handleFileDeletionExternally?: boolean,
 
   // File refresh callback
-  onFileRefreshClick?: (file: FileObject) => void,
+  onFileRefreshClick?: (file: FileObject) => mixed,
 };
 
 const FileUploadBase = (props: FileUploadProps, ref) => {
@@ -105,6 +114,7 @@ const FileUploadBase = (props: FileUploadProps, ref) => {
     onFileClear,
     onFileRefreshClick,
     maxFiles = 1,
+    handleFileDeletionExternally,
   } = props;
 
   // Get file upload state from useFileUpload hook
@@ -135,6 +145,7 @@ const FileUploadBase = (props: FileUploadProps, ref) => {
     moveFileToProgress,
     moveFileToSuccess,
     moveFileToReject,
+    handleFileClear,
     setShowReUpload,
     validFiles,
     rejectedFiles,
@@ -183,7 +194,9 @@ const FileUploadBase = (props: FileUploadProps, ref) => {
               <FileBlock
                 fileObject={fileObject}
                 onFileRefreshClick={onFileRefreshClick}
-                handleFileClear={handleFileClear}
+                handleFileClear={
+                  handleFileDeletionExternally ? onFileClear : handleFileClear
+                }
               />
             </React.Fragment>
           ))}

package/lib/utils/helpers/helpers.js

@@ -21,7 +21,8 @@ const range = (start, end) => {
   }, (_, i) => start + i);
 };
 exports.range = range;
-const convertFileSize = fileSize => {
+const convertFileSize = function () {
+  let fileSize = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
   let sizeInBytes = fileSize;
   // Check if the file size is less than 1024
   if (sizeInBytes < 0) {

package/lib/utils/helpers/helpers.js.flow

@@ -15,7 +15,7 @@ export const range = (start: number, end: number): Array<number> => {
   return Array.from({length}, (_, i) => start + i);
 };
 
-export const convertFileSize = (fileSize: number): string => {
+export const convertFileSize = (fileSize: number = 0): string => {
   let sizeInBytes = fileSize;
   // Check if the file size is less than 1024
   if (sizeInBytes < 0) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spaced-out/ui-design-system",
-  "version": "0.1.49",
+  "version": "0.1.50",
   "main": "index.js",
   "description": "Sense UI components library",
   "author": {