@uxf/ui - npm Package Compare versions

Comparing version 10.8.0 to 10.8.1

_file-input-base/file-input-base.d.ts

@@ -11,4 +11,4 @@ import { FileResponse, FormControlProps } from "@uxf/ui/types";
     onUploadError?: (err: unknown) => void;
-    onUploadFile: (file: File) => Promise<FileResponse>;
+    onUploadFile: (file: File | undefined) => Promise<FileResponse | null>;
 }
 export declare const _FileInputBase: React.ForwardRefExoticComponent<FileInputBaseProps & React.RefAttributes<HTMLInputElement>>;

_file-input-base/file-input-base.js

@@ -31,4 +31,4 @@ "use strict";
     const onChange = async (e) => {
-        var _a;
-        if (e.target.files) {
+        var _a, _b;
+        if ((_a = e.target.files) === null || _a === void 0 ? void 0 : _a.length) {
             try {
@@ -43,3 +43,3 @@ const file = e.target.files[0];
             catch (err) {
-                (_a = props.onUploadError) === null || _a === void 0 ? void 0 : _a.call(props, err);
+                (_b = props.onUploadError) === null || _b === void 0 ? void 0 : _b.call(props, err);
             }
@@ -46,0 +46,0 @@ }

_select-base/_select-base.js

@@ -39,6 +39,4 @@ "use strict";
 const Option = (props) => {
-    var _a, _b, _c, _d;
-    const optionKey = (_a = props.keyExtractor) === null || _a === void 0 ? void 0 : _a.call(props, props.option);
     const HUIComponent = props.HUIComponent;
-    return (react_2.default.createElement(HUIComponent.Option, { className: (optionState) => (0, cx_1.cx)("uxf-dropdown__item", optionState.active && classes_1.CLASSES.IS_ACTIVE, optionState.disabled && classes_1.CLASSES.IS_DISABLED, optionState.selected && classes_1.CLASSES.IS_SELECTED), key: optionKey !== null && optionKey !== void 0 ? optionKey : props.option.id, value: props.option }, (_d = (_c = (_b = props.renderOption) === null || _b === void 0 ? void 0 : _b.call(props, props.option)) !== null && _c !== void 0 ? _c : optionKey) !== null && _d !== void 0 ? _d : props.option.label));
+    return (react_2.default.createElement(HUIComponent.Option, { className: (optionState) => (0, cx_1.cx)("uxf-dropdown__item", optionState.active && classes_1.CLASSES.IS_ACTIVE, optionState.disabled && classes_1.CLASSES.IS_DISABLED, optionState.selected && classes_1.CLASSES.IS_SELECTED), value: props.option }, (optionState) => { var _a, _b; return (_b = (_a = props.renderOption) === null || _a === void 0 ? void 0 : _a.call(props, props.option, optionState.selected)) !== null && _b !== void 0 ? _b : props.option.label; }));
 };
@@ -72,5 +70,5 @@ Option.displayName = "UxfUiSelectBaseOption";
             : "uxf-select-base__options--not-match-width", props.placement === "bottom" && "uxf-dropdown--bottom", props.placement === "top" && "uxf-dropdown--top", props.className), ref: props.forwardRef, static: true, style: props.style }, props.options && props.options.length > 0 ? (props.options.map((option) => {
-        var _a;
-        const optionKey = (_a = props.keyExtractor) === null || _a === void 0 ? void 0 : _a.call(props, option);
-        return (react_2.default.createElement(Option, { key: optionKey, keyExtractor: props.keyExtractor, option: option, HUIComponent: HUIComponent }));
+        var _a, _b;
+        const optionKey = (_b = (_a = props.keyExtractor) === null || _a === void 0 ? void 0 : _a.call(props, option)) !== null && _b !== void 0 ? _b : option.id;
+        return (react_2.default.createElement(Option, { HUIComponent: HUIComponent, key: optionKey, option: option, renderOption: props.renderOption }));
     })) : (react_2.default.createElement("div", { className: "uxf-dropdown__empty-wrapper" }, props.emptyMessage))));
@@ -77,0 +75,0 @@ };

avatar-file-input/avatar-file-input.js

@@ -48,3 +48,10 @@ "use strict";
     const onSelectFile = () => { var _a; return (_a = innerRef.current) === null || _a === void 0 ? void 0 : _a.click(); };
-    const onRemoveFile = () => props.onChange(null);
+    const onRemoveFile = () => {
+        props.onChange(null);
+        // this ensures that the file input is cleared on remove, so that the same file can be selected again
+        const inputNode = innerRef.current;
+        if (inputNode) {
+            inputNode.value = "";
+        }
+    };
     return (react_1.default.createElement(form_component_1.FormComponent, { className: rootClassName, errorId: props.id, helperText: props.helperText, hiddenLabel: props.hiddenLabel, inputId: id, label: props.label },
@@ -51,0 +58,0 @@ react_1.default.createElement("div", { className: "uxf-avatar-file-input__inner-wrapper" },

dropzone/dropzone-input.d.ts

@@ -18,4 +18,4 @@ import { FileResponse, FormControlProps, UploadOptions } from "@uxf/ui/types";
     onUploadError?: (err: unknown) => void;
-    onUploadFile: (file: File, options?: UploadOptions) => Promise<FileResponse>;
+    onUploadFile: (file: File | undefined, options?: UploadOptions) => Promise<FileResponse | null>;
 }
 export declare const DropzoneInput: React.ForwardRefExoticComponent<DropzoneInputProps & React.RefAttributes<HTMLDivElement>>;

dropzone/dropzone-input.js

@@ -54,3 +54,3 @@ "use strict";
 function fileUploadedHandler(uploadedFile, dropzoneFile, onValuesChange, values) {
-    if (values) {
+    if (values && uploadedFile) {
         onValuesChange(values.map((f) => f.id === dropzoneFile.id ? { ...uploadedFile, progress: 100, originalFile: f.originalFile } : f));
@@ -57,0 +57,0 @@ }

package.json

 {
   "name": "@uxf/ui",
-  "version": "10.8.0",
+  "version": "10.8.1",
   "description": "",
@@ -5,0 +5,0 @@ "publishConfig": {

utils/mocks/upload-file.mock.d.ts

 import { FileResponse, UploadOptions } from "@uxf/ui/types";
-export declare function uploadFile(file: File, uploadOptions?: UploadOptions): Promise<FileResponse>;
+export declare function uploadFile(file: File | undefined, uploadOptions?: UploadOptions): Promise<FileResponse | null>;

utils/mocks/upload-file.mock.js

@@ -13,35 +13,38 @@ "use strict";
 }
-function uploadFile(file, uploadOptions) {
-    // axios.put("/api/upload", file, { signal: uploadOptions?.abortController?.signal, onUploadProgress: uploadOptions?.onUploadProgress });
-    return new Promise((resolve) => {
-        const time = file.size / 100;
-        const interval = time / 10;
-        let loaded = 0;
-        const intervalTimer = window.setInterval(() => {
-            var _a, _b;
-            if ((_a = uploadOptions === null || uploadOptions === void 0 ? void 0 : uploadOptions.abortController) === null || _a === void 0 ? void 0 : _a.signal.aborted) {
+async function uploadFile(file, uploadOptions) {
+    if (file) {
+        // axios.put("/api/upload", file, { signal: uploadOptions?.abortController?.signal, onUploadProgress: uploadOptions?.onUploadProgress });
+        return new Promise((resolve) => {
+            const time = file.size / 100;
+            const interval = time / 10;
+            let loaded = 0;
+            const intervalTimer = window.setInterval(() => {
+                var _a, _b;
+                if ((_a = uploadOptions === null || uploadOptions === void 0 ? void 0 : uploadOptions.abortController) === null || _a === void 0 ? void 0 : _a.signal.aborted) {
+                    clearInterval(intervalTimer);
+                    // eslint-disable-next-line @typescript-eslint/no-use-before-define
+                    clearTimeout(timeoutTimer);
+                    return;
+                }
+                loaded += (file.size / time) * interval;
+                (_b = uploadOptions === null || uploadOptions === void 0 ? void 0 : uploadOptions.onUploadProgress) === null || _b === void 0 ? void 0 : _b.call(uploadOptions, {
+                    lengthComputable: true,
+                    loaded,
+                    total: file.size,
+                });
+            }, interval);
+            const timeoutTimer = window.setTimeout(() => {
                 clearInterval(intervalTimer);
-                // eslint-disable-next-line @typescript-eslint/no-use-before-define
                 clearTimeout(timeoutTimer);
-                return;
-            }
-            loaded += (file.size / time) * interval;
-            (_b = uploadOptions === null || uploadOptions === void 0 ? void 0 : uploadOptions.onUploadProgress) === null || _b === void 0 ? void 0 : _b.call(uploadOptions, {
-                lengthComputable: true,
-                loaded,
-                total: file.size,
-            });
-        }, interval);
-        const timeoutTimer = window.setTimeout(() => {
-            clearInterval(intervalTimer);
-            clearTimeout(timeoutTimer);
-            resolve({
-                id: Math.round(Math.random() * 100000000),
-                uuid: getRandomUuid(),
-                name: file.name,
-                extension: file.name.split(".").slice(-1).join(""),
-            });
-        }, time);
-    });
+                resolve({
+                    id: Math.round(Math.random() * 100000000),
+                    uuid: getRandomUuid(),
+                    name: file.name,
+                    extension: file.name.split(".").slice(-1).join(""),
+                });
+            }, time);
+        });
+    }
+    return null;
 }
 exports.uploadFile = uploadFile;

No alert changes

Improved metrics

Total package byte prevSize

781699

increased by0.05%

Lines of code

16557

increased by0.04%

No dependency changes