@arkyn/components 1.4.7 → 1.4.8

package/dist/components/ImageUpload/HasFileContent/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ImageUpload/HasFileContent/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAOnD,OAAO,cAAc,CAAC;AAEtB,iBAAS,cAAc,CAAC,KAAK,EAAE,mBAAmB,2CAuDjD;AAED,OAAO,EAAE,cAAc,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ImageUpload/HasFileContent/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAOnD,OAAO,cAAc,CAAC;AAEtB,iBAAS,cAAc,CAAC,KAAK,EAAE,mBAAmB,2CA4DjD;AAED,OAAO,EAAE,cAAc,EAAE,CAAC"}

package/dist/components/ImageUpload/HasFileContent/index.js

@@ -5,8 +5,10 @@ import { IconButton } from "../../IconButton";
 import { Tooltip } from "../../Tooltip";
 import "./styles.css";
 function HasFileContent(props) {
-    const { filePath, isLoading, acceptImage, changeImageButtonText, handleSelectFile, reSendImage, } = props;
+    const { disabled, filePath, isLoading, acceptImage, changeImageButtonText, handleSelectFile, reSendImage, } = props;
     function handleClick() {
+        if (disabled)
+            return;
         const input = document.createElement("input");
         input.type = "file";
         input.accept = acceptImage;
@@ -17,6 +19,6 @@ function HasFileContent(props) {
         };
         input.click();
     }
-    return (_jsxs("div", { className: "arkynImageUploadHasFileContent", style: { backgroundImage: `url("${filePath}")` }, children: [reSendImage && (_jsx(Tooltip, { orientation: "bottom", text: "Reenviar imagem", children: _jsx(IconButton, { type: "button", "aria-label": "resend image", variant: "outline", scheme: "danger", size: "sm", isLoading: isLoading, onClick: reSendImage, icon: RefreshCw }) })), _jsx(Button, { isLoading: isLoading, onClick: handleClick, variant: "outline", size: "sm", type: "button", children: changeImageButtonText })] }));
+    return (_jsxs("div", { className: "arkynImageUploadHasFileContent", style: { backgroundImage: `url("${filePath}")` }, children: [reSendImage && (_jsx(Tooltip, { orientation: "bottom", text: "Reenviar imagem", children: _jsx(IconButton, { type: "button", "aria-label": "resend image", variant: "outline", scheme: "danger", size: "sm", isLoading: isLoading, onClick: reSendImage, icon: RefreshCw, disabled: disabled }) })), _jsx(Button, { isLoading: isLoading, onClick: handleClick, variant: "outline", size: "sm", type: "button", disabled: disabled, children: changeImageButtonText })] }));
 }
 export { HasFileContent };

package/dist/components/ImageUpload/NoFileContent/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ImageUpload/NoFileContent/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAKlD,OAAO,cAAc,CAAC;AAEtB,iBAAS,aAAa,CAAC,KAAK,EAAE,kBAAkB,2CA4C/C;AAED,OAAO,EAAE,aAAa,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ImageUpload/NoFileContent/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAKlD,OAAO,cAAc,CAAC;AAEtB,iBAAS,aAAa,CAAC,KAAK,EAAE,kBAAkB,2CAkD/C;AAED,OAAO,EAAE,aAAa,EAAE,CAAC"}

package/dist/components/ImageUpload/NoFileContent/index.js

@@ -2,14 +2,18 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Button } from "../../Button";
 import "./styles.css";
 function NoFileContent(props) {
-    const { dropImageText, isLoading, acceptImage, handleSelectFile, selectImageButtonText, } = props;
+    const { dropImageText, isLoading, acceptImage, handleSelectFile, selectImageButtonText, disabled, } = props;
     function handleDrop(event) {
+        if (disabled)
+            return;
         event.preventDefault();
         const file = event.dataTransfer.files[0];
         if (file)
             handleSelectFile(file);
     }
     function handleClick() {
+        if (disabled)
+            return;
         const input = document.createElement("input");
         input.type = "file";
         input.accept = acceptImage;
@@ -20,6 +24,6 @@ function NoFileContent(props) {
         };
         input.click();
     }
-    return (_jsxs("div", { onDrop: handleDrop, className: "arkynImageUploadNoFileContent", children: [_jsx(Button, { isLoading: isLoading, onClick: handleClick, variant: "ghost", size: "sm", type: "button", children: selectImageButtonText }), _jsx("p", { children: dropImageText })] }));
+    return (_jsxs("div", { onDrop: handleDrop, className: "arkynImageUploadNoFileContent", children: [_jsx(Button, { isLoading: isLoading, onClick: handleClick, variant: "ghost", size: "sm", type: "button", disabled: disabled, children: selectImageButtonText }), _jsx("p", { children: dropImageText })] }));
 }
 export { NoFileContent };

package/dist/components/ImageUpload/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ImageUpload/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAUhD,OAAO,cAAc,CAAC;AAEtB,iBAAS,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CA6F3C;AAED,OAAO,EAAE,WAAW,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ImageUpload/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAUhD,OAAO,cAAc,CAAC;AAEtB,iBAAS,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CAoG3C;AAED,OAAO,EAAE,WAAW,EAAE,CAAC"}

package/dist/components/ImageUpload/index.js

@@ -7,7 +7,7 @@ import { ImageUploadLabel } from "./ImageUploadLabel";
 import { NoFileContent } from "./NoFileContent";
 import "./styles.css";
 function ImageUpload(props) {
-    const { name, defaultValue = "", label, showAsterisk = false, action, fileName = "file", method = "POST", acceptImage = "image/*", fileResponseName = "url", changeImageButtonText = "Alterar imagem", selectImageButtonText = "Selecionar imagem", dropImageText = "Ou arraste e solte a imagem aqui", onUpload, } = props;
+    const { name, defaultValue = "", label, showAsterisk = false, action, fileName = "file", method = "POST", acceptImage = "image/*", fileResponseName = "url", changeImageButtonText = "Alterar imagem", selectImageButtonText = "Selecionar imagem", dropImageText = "Ou arraste e solte a imagem aqui", onUpload, disabled = false, } = props;
     const fieldErrors = useFieldErrors();
     const fieldError = fieldErrors[name];
     const [value, setValue] = useState(defaultValue);
@@ -16,6 +16,8 @@ function ImageUpload(props) {
     const [filePath, setFilePath] = useState(defaultValue);
     const [isLoading, setIsLoading] = useState(false);
     async function handleUploadImage(file) {
+        if (disabled)
+            return;
         setIsLoading(true);
         setFile(file);
         setError("");
@@ -37,6 +39,8 @@ function ImageUpload(props) {
             .finally(() => setIsLoading(false));
     }
     function handleSelectFile(file) {
+        if (disabled)
+            return;
         setFilePath(URL.createObjectURL(file));
         handleUploadImage(file);
     }
@@ -44,6 +48,6 @@ function ImageUpload(props) {
     const hasErrorClassName = errorMessage ? "hasError" : "noHasError";
     const hasImageClassName = filePath ? "hasImage" : "noHasImage";
     const className = `arkynImageUpload ${hasErrorClassName} ${hasImageClassName}`;
-    return (_jsxs("div", { className: "arkynImageUploadContainer", children: [label && _jsx(ImageUploadLabel, { label: label, showAsterisk: showAsterisk }), _jsxs("div", { className: className, children: [_jsx("input", { type: "hidden", name: name, value: value || "" }), !filePath && (_jsx(NoFileContent, { isLoading: isLoading, acceptImage: acceptImage, dropImageText: dropImageText, handleSelectFile: handleSelectFile, selectImageButtonText: selectImageButtonText })), filePath && (_jsx(HasFileContent, { isLoading: isLoading, acceptImage: acceptImage, filePath: filePath, handleSelectFile: handleSelectFile, changeImageButtonText: changeImageButtonText, reSendImage: !!errorMessage && file ? () => handleUploadImage(file) : undefined }))] }), errorMessage && _jsx(ImageUploadError, { error: errorMessage })] }));
+    return (_jsxs("div", { className: "arkynImageUploadContainer", children: [label && _jsx(ImageUploadLabel, { label: label, showAsterisk: showAsterisk }), _jsxs("div", { className: className, children: [_jsx("input", { type: "hidden", name: name, value: value || "" }), !filePath && (_jsx(NoFileContent, { disabled: disabled, isLoading: isLoading, acceptImage: acceptImage, dropImageText: dropImageText, handleSelectFile: handleSelectFile, selectImageButtonText: selectImageButtonText })), filePath && (_jsx(HasFileContent, { disabled: disabled, isLoading: isLoading, acceptImage: acceptImage, filePath: filePath, handleSelectFile: handleSelectFile, changeImageButtonText: changeImageButtonText, reSendImage: !!errorMessage && file ? () => handleUploadImage(file) : undefined }))] }), errorMessage && _jsx(ImageUploadError, { error: errorMessage })] }));
 }
 export { ImageUpload };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arkyn/components",
-  "version": "1.4.7",
+  "version": "1.4.8",
   "main": "./dist/bundle.js",
   "types": "./dist/index.d.ts",
   "author": "Lucas Gonçalves",

package/src/components/ImageUpload/HasFileContent/index.tsx

@@ -9,6 +9,7 @@ import "./styles.css";
 
 function HasFileContent(props: HasFileContentProps) {
   const {
+    disabled,
     filePath,
     isLoading,
     acceptImage,
@@ -18,6 +19,8 @@ function HasFileContent(props: HasFileContentProps) {
   } = props;
 
   function handleClick() {
+    if (disabled) return;
+
     const input = document.createElement("input");
 
     input.type = "file";
@@ -47,6 +50,7 @@ function HasFileContent(props: HasFileContentProps) {
             isLoading={isLoading}
             onClick={reSendImage}
             icon={RefreshCw}
+            disabled={disabled}
           />
         </Tooltip>
       )}
@@ -57,6 +61,7 @@ function HasFileContent(props: HasFileContentProps) {
         variant="outline"
         size="sm"
         type="button"
+        disabled={disabled}
       >
         {changeImageButtonText}
       </Button>

package/src/components/ImageUpload/NoFileContent/index.tsx

@@ -12,15 +12,20 @@ function NoFileContent(props: NoFileContentProps) {
     acceptImage,
     handleSelectFile,
     selectImageButtonText,
+    disabled,
   } = props;
 
   function handleDrop(event: DragEvent<HTMLDivElement>) {
+    if (disabled) return;
+
     event.preventDefault();
     const file = event.dataTransfer.files[0];
     if (file) handleSelectFile(file);
   }
 
   function handleClick() {
+    if (disabled) return;
+
     const input = document.createElement("input");
 
     input.type = "file";
@@ -42,6 +47,7 @@ function NoFileContent(props: NoFileContentProps) {
         variant="ghost"
         size="sm"
         type="button"
+        disabled={disabled}
       >
         {selectImageButtonText}
       </Button>

package/src/components/ImageUpload/index.tsx

@@ -25,6 +25,7 @@ function ImageUpload(props: ImageUploadProps) {
     selectImageButtonText = "Selecionar imagem",
     dropImageText = "Ou arraste e solte a imagem aqui",
     onUpload,
+    disabled = false,
   } = props;
 
   const fieldErrors = useFieldErrors();
@@ -37,6 +38,8 @@ function ImageUpload(props: ImageUploadProps) {
   const [isLoading, setIsLoading] = useState(false);
 
   async function handleUploadImage(file: File) {
+    if (disabled) return;
+
     setIsLoading(true);
     setFile(file);
     setError("");
@@ -59,6 +62,8 @@ function ImageUpload(props: ImageUploadProps) {
   }
 
   function handleSelectFile(file: File) {
+    if (disabled) return;
+
     setFilePath(URL.createObjectURL(file));
     handleUploadImage(file);
   }
@@ -78,6 +83,7 @@ function ImageUpload(props: ImageUploadProps) {
 
         {!filePath && (
           <NoFileContent
+            disabled={disabled}
             isLoading={isLoading}
             acceptImage={acceptImage}
             dropImageText={dropImageText}
@@ -88,6 +94,7 @@ function ImageUpload(props: ImageUploadProps) {
 
         {filePath && (
           <HasFileContent
+            disabled={disabled}
             isLoading={isLoading}
             acceptImage={acceptImage}
             filePath={filePath}