@uxf/ui 1.0.0-beta.136 → 1.0.0-beta.138

package/css/checkbox-button.css

@@ -52,7 +52,7 @@
         }
 
         &.is-invalid {
-            @apply before:border-red-600;
+            @apply before:border-error-500;
         }
     }
 
@@ -92,7 +92,7 @@
         }
 
         &.is-invalid {
-            @apply before:border-red-600;
+            @apply before:border-error-500;
         }
     }
 }

package/css/checkbox-input.css

@@ -17,7 +17,7 @@
 
     &.is-disabled,
     &.is-readonly {
-        & + .uxf-checkbox__label {
+        & + .uxf-checkbox-input__label {
             @apply pointer-events-none;
         }
     }

package/css/checkbox.css

@@ -67,10 +67,10 @@
         }
 
         &.is-invalid {
-            @apply border-red-600;
+            @apply border-error-500;
 
             &.is-selected {
-                @apply bg-red-600;
+                @apply bg-error-500;
             }
 
             .uxf-checkbox__inner {
@@ -109,10 +109,10 @@
         }
 
         &.is-invalid {
-            @apply border-red-600;
+            @apply border-error-500;
 
             &.is-selected {
-                @apply bg-red-600;
+                @apply bg-error-500;
             }
 
             .uxf-checkbox__inner {

package/css/dropzone.css

@@ -14,7 +14,7 @@
         }
 
         &.is-invalid {
-            @apply border-error-600;
+            @apply border-error-500;
         }
 
         &.is-disabled {
@@ -44,11 +44,11 @@
 
         &.is-invalid {
             :root .light & {
-                @apply border-error-600 text-error-600;
+                @apply border-error-500 text-error-500;
             }
 
             :root .dark & {
-                @apply border-error-600 text-error-600;
+                @apply border-error-500 text-error-500;
             }
         }
 

package/css/error-message.css

@@ -1,3 +1,3 @@
 .uxf-error-message {
-    @apply block text-error-600 mt-1 text-right;
+    @apply block text-error-500 mt-1 text-right;
 }

package/css/form-control.css

@@ -2,6 +2,6 @@
     @apply mt-1 text-xs text-gray-500;
 
     &.is-invalid {
-        @apply text-error-600;
+        @apply text-error-500;
     }
 }

package/css/radio.css

@@ -51,10 +51,10 @@
         }
 
         &.is-invalid {
-            @apply border-red-600;
+            @apply border-error-500;
 
             &.is-selected {
-                @apply bg-red-600;
+                @apply bg-error-500;
             }
 
             .uxf-radio__inner {
@@ -87,10 +87,10 @@
         }
 
         &.is-invalid {
-            @apply border-red-600;
+            @apply border-error-500;
 
             &.is-selected {
-                @apply bg-red-600;
+                @apply bg-error-500;
             }
 
             .uxf-radio__inner {

package/dropzone/dropzone-input.d.ts

@@ -2,7 +2,7 @@ import { FileResponse, FormControlProps, UploadOptions } from "@uxf/ui/types";
 import React, { ReactNode } from "react";
 import { IconName } from "../icon/types";
 import { Accept, DropzoneFile } from "./types";
-export interface DropzoneInputProps extends FormControlProps<DropzoneFile[]> {
+export interface DropzoneInputProps extends FormControlProps<DropzoneFile[] | undefined> {
     accept?: Accept;
     helperText?: ReactNode;
     icon?: IconName;

package/dropzone/dropzone-input.js

@@ -73,7 +73,7 @@ exports.DropzoneInput = (0, react_1.forwardRef)((props, ref) => {
             originalFile: file,
             progress: 0,
         }));
-        props.onChange([...props.value, ...files]);
+        props.onChange(props.value ? [...props.value, ...files] : files);
         for (const file of files) {
             if (!file.originalFile) {
                 file.error = "File not found";

package/dropzone/dropzone-list.d.ts

@@ -1,7 +1,7 @@
 import { FormControlProps } from "@uxf/ui/types";
 import { FC, ReactNode } from "react";
 import { DropzoneFile } from "./types";
-export interface DropzoneListProps extends FormControlProps<DropzoneFile[]> {
+export interface DropzoneListProps extends FormControlProps<DropzoneFile[] | undefined> {
     errorText?: string;
     onAbortWarning?: string;
     onRemoveWarning?: string;

package/dropzone/dropzone-list.js

@@ -54,24 +54,25 @@ function getIconName(extension) {
     }
 }
 const DropzoneList = (props) => {
+    var _a, _b;
     const context = (0, react_1.useContext)(context_1.UiContext);
     const onRemove = (file, isUploading) => () => {
         var _a;
         // eslint-disable-next-line no-alert
-        if (isUploading && confirm(props.onAbortWarning || "Do you want to abort the file?")) {
+        if (props.value && isUploading && confirm(props.onAbortWarning || "Do you want to abort the file?")) {
             (_a = file.abortController) === null || _a === void 0 ? void 0 : _a.abort();
             props.onChange(props.value.filter((f) => f.id !== file.id));
             return;
         }
         // eslint-disable-next-line no-alert
-        if (!isUploading && confirm(props.onRemoveWarning || "Do you want to delete the file?")) {
+        if (props.value && !isUploading && confirm(props.onRemoveWarning || "Do you want to delete the file?")) {
             props.onChange(props.value.filter((f) => f.id !== file.id));
         }
     };
-    if (props.value.length === 0) {
+    if (((_a = props.value) === null || _a === void 0 ? void 0 : _a.length) === 0) {
         return null;
     }
-    return (react_1.default.createElement("ul", { className: "uxf-dropzone-list" }, props.value.map((file) => {
+    return (react_1.default.createElement("ul", { className: "uxf-dropzone-list" }, (_b = props.value) === null || _b === void 0 ? void 0 : _b.map((file) => {
         var _a, _b, _c;
         const isUploading = file.id < 0 && !file.error;
         return ((_b = (_a = props.renderItem) === null || _a === void 0 ? void 0 : _a.call(props, file)) !== null && _b !== void 0 ? _b : (react_1.default.createElement("li", { className: "uxf-dropzone-list__item-wrapper", key: file.id },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxf/ui",
-  "version": "1.0.0-beta.136",
+  "version": "1.0.0-beta.138",
   "description": "",
   "publishConfig": {
     "access": "public"

package/utils/mocks/uploadFIle.mock.js

@@ -16,18 +16,11 @@ function uploadFile(file, uploadOptions) {
         const time = file.size / 10;
         const interval = time / 10;
         let loaded = 0;
-        const timeoutTimer = window.setTimeout(() => {
-            resolve({
-                id: Math.round(Math.random() * 100000000),
-                uuid: getRandomUuid(),
-                name: file.name,
-                extension: file.name.split(".").slice(-1).join(""),
-            });
-        }, time);
         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;
             }
@@ -38,6 +31,16 @@ function uploadFile(file, uploadOptions) {
                 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);
     });
 }
 exports.uploadFile = uploadFile;