allaw-ui 3.0.0 → 3.0.2

package/dist/assets/allaw-icon-pdf.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M14 2H6C4.9 2 4 2.9 4 4V20C4 21.1 4.9 22 6 22H18C19.1 22 20 21.1 20 20V8L14 2Z" fill="#E30000" />
+  <path d="M14 2V8H20L14 2Z" fill="#FF6666" />
+  <path d="M10.08 16.58C9.63 16.58 9.2 16.5 8.8 16.34V14.54C9.16 14.74 9.56 14.84 10 14.84C10.28 14.84 10.5 14.78 10.66 14.66C10.82 14.54 10.9 14.36 10.9 14.12C10.9 13.9 10.84 13.72 10.72 13.58C10.6 13.44 10.36 13.24 10 12.98C9.62 12.7 9.36 12.44 9.22 12.2C9.08 11.96 9 11.66 9 11.3C9 10.78 9.18 10.38 9.54 10.08C9.9 9.78 10.36 9.64 10.92 9.64C11.32 9.64 11.68 9.68 12 9.76V11.44C11.7 11.3 11.4 11.24 11.1 11.24C10.9 11.24 10.74 11.28 10.62 11.36C10.5 11.44 10.44 11.56 10.44 11.72C10.44 11.86 10.5 11.98 10.62 12.1C10.74 12.22 10.94 12.38 11.22 12.58C11.62 12.86 11.9 13.14 12.06 13.42C12.22 13.7 12.3 14.04 12.3 14.44C12.3 14.98 12.1 15.4 11.7 15.7C11.3 16 10.76 16.16 10.08 16.58Z" fill="white" />
+</svg> 

package/dist/components/molecules/fileUploader/FileUploader.d.ts

@@ -0,0 +1,28 @@
+import React from "react";
+import { CropMetadata } from "./ImageCropperModal";
+export interface FileUploaderProps {
+    acceptedExtensions: string[];
+    maxFileSizeMB: number;
+    enableDragAndDrop?: boolean;
+    enableCropping?: boolean;
+    cropShape?: "circle" | "square";
+    iconUrl?: string;
+    descriptionParts?: {
+        beforeLink: string;
+        linkLabel: string;
+        linkUrl: string;
+        afterLink: string;
+    };
+    onFileRead?: (file: File, fileContent: ArrayBuffer, cropMetadata?: CropMetadata) => void;
+    onFileRemove?: () => void;
+    uploadProgress?: number;
+    isLoading?: boolean;
+    errorMessage?: string | null;
+    buttonLabel?: string;
+    acceptedLabel?: string;
+    maxSizeLabel?: string;
+    fileName?: string;
+    fileSize?: number;
+}
+declare const FileUploader: React.FC<FileUploaderProps>;
+export default FileUploader;

package/dist/components/molecules/fileUploader/FileUploader.js

@@ -0,0 +1,217 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import React, { useState, useRef } from "react";
+import Image from "next/image";
+import styles from "./FileUploader.module.css";
+import ImageCropperModal from "./ImageCropperModal";
+var FileUploader = function (_a) {
+    var acceptedExtensions = _a.acceptedExtensions, maxFileSizeMB = _a.maxFileSizeMB, _b = _a.enableDragAndDrop, enableDragAndDrop = _b === void 0 ? true : _b, _c = _a.enableCropping, enableCropping = _c === void 0 ? false : _c, _d = _a.cropShape, cropShape = _d === void 0 ? "square" : _d, iconUrl = _a.iconUrl, descriptionParts = _a.descriptionParts, onFileRead = _a.onFileRead, onFileRemove = _a.onFileRemove, _e = _a.uploadProgress, uploadProgress = _e === void 0 ? 0 : _e, _f = _a.isLoading, isLoading = _f === void 0 ? false : _f, _g = _a.errorMessage, errorMessage = _g === void 0 ? null : _g, _h = _a.buttonLabel, buttonLabel = _h === void 0 ? "Choisir un fichier" : _h, _j = _a.acceptedLabel, acceptedLabel = _j === void 0 ? "Format accepté :" : _j, _k = _a.maxSizeLabel, maxSizeLabel = _k === void 0 ? "Taille maximale :" : _k, fileName = _a.fileName, fileSize = _a.fileSize;
+    var _l = useState(null), selectedFile = _l[0], setSelectedFile = _l[1];
+    var _m = useState(null), fileContent = _m[0], setFileContent = _m[1];
+    var _o = useState(false), isHovering = _o[0], setIsHovering = _o[1];
+    var _p = useState(false), showCropper = _p[0], setShowCropper = _p[1];
+    var fileInputRef = useRef(null);
+    var resetFileInput = function () {
+        if (fileInputRef.current) {
+            fileInputRef.current.value = "";
+        }
+    };
+    var validateFile = function (file) {
+        var _a;
+        // Vérifier l'extension
+        var fileExtension = ".".concat((_a = file.name.split(".").pop()) === null || _a === void 0 ? void 0 : _a.toLowerCase());
+        var isValidExtension = acceptedExtensions.includes(fileExtension);
+        // Vérifier la taille
+        var isValidSize = file.size <= maxFileSizeMB * 1024 * 1024;
+        return isValidExtension && isValidSize;
+    };
+    var isImageFile = function (file) {
+        var _a;
+        var fileExtension = ".".concat((_a = file.name.split(".").pop()) === null || _a === void 0 ? void 0 : _a.toLowerCase());
+        var imageExtensions = [".jpg", ".jpeg", ".png", ".gif", ".webp", ".bmp"];
+        return imageExtensions.includes(fileExtension);
+    };
+    var handleFileSelect = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var file;
+        return __generator(this, function (_a) {
+            if (event.target.files && event.target.files.length > 0) {
+                file = event.target.files[0];
+                processFile(file);
+            }
+            return [2 /*return*/];
+        });
+    }); };
+    var handleDragOver = function (event) {
+        event.preventDefault();
+        setIsHovering(true);
+    };
+    var handleDragLeave = function () {
+        setIsHovering(false);
+    };
+    var handleDrop = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var file;
+        return __generator(this, function (_a) {
+            event.preventDefault();
+            setIsHovering(false);
+            if (event.dataTransfer.files && event.dataTransfer.files.length > 0) {
+                file = event.dataTransfer.files[0];
+                processFile(file);
+            }
+            return [2 /*return*/];
+        });
+    }); };
+    var processFile = function (file) { return __awaiter(void 0, void 0, void 0, function () {
+        var content, error_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    if (!validateFile(file)) {
+                        setSelectedFile(null);
+                        return [2 /*return*/];
+                    }
+                    _a.label = 1;
+                case 1:
+                    _a.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, file.arrayBuffer()];
+                case 2:
+                    content = _a.sent();
+                    setFileContent(content);
+                    // Si c'est une image et que le cadrage est activé, afficher le composant de cadrage
+                    if (enableCropping && isImageFile(file)) {
+                        setSelectedFile(file);
+                        setShowCropper(true);
+                    }
+                    else {
+                        // Sinon, traiter normalement
+                        setSelectedFile(file);
+                        onFileRead === null || onFileRead === void 0 ? void 0 : onFileRead(file, content);
+                    }
+                    return [3 /*break*/, 4];
+                case 3:
+                    error_1 = _a.sent();
+                    console.error("Error reading file:", error_1);
+                    setSelectedFile(null);
+                    return [3 /*break*/, 4];
+                case 4: return [2 /*return*/];
+            }
+        });
+    }); };
+    var handleCropCancel = function () {
+        setShowCropper(false);
+        setSelectedFile(null);
+        resetFileInput();
+    };
+    var handleCropConfirm = function (cropMetadata) {
+        setShowCropper(false);
+        if (selectedFile && fileContent) {
+            onFileRead === null || onFileRead === void 0 ? void 0 : onFileRead(selectedFile, fileContent, cropMetadata);
+        }
+    };
+    var handleFileDelete = function () {
+        setSelectedFile(null);
+        setFileContent(null);
+        resetFileInput();
+        onFileRemove === null || onFileRemove === void 0 ? void 0 : onFileRemove();
+    };
+    var formatFileSize = function (size) {
+        if (size < 1024) {
+            return "".concat(size, " octets");
+        }
+        else if (size < 1024 * 1024) {
+            return "".concat((size / 1024).toFixed(2), " Ko");
+        }
+        else {
+            return "".concat((size / (1024 * 1024)).toFixed(2), " Mo");
+        }
+    };
+    var displayFileSize = fileSize !== undefined ? fileSize : selectedFile ? selectedFile.size : 0;
+    var displayFileName = fileName || (selectedFile ? selectedFile.name : "");
+    return (React.createElement("div", { className: styles.upload_main_container },
+        enableDragAndDrop ? (React.createElement("div", { className: "".concat(styles.upload_container, " ").concat(isHovering ? styles.drag_over : ""), onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, onClick: function () { var _a; return (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click(); } },
+            React.createElement("div", { className: styles.upload_content },
+                React.createElement("div", { className: styles.upload_icons },
+                    React.createElement("div", { className: styles.upload_file_icon },
+                        React.createElement("i", { className: "allaw-icon-file" })),
+                    React.createElement("div", { className: styles.upload_icon_container },
+                        React.createElement("div", { className: styles.upload_icon },
+                            React.createElement("i", { className: "allaw-icon-export" })))),
+                React.createElement("div", { className: styles.upload_description },
+                    React.createElement("span", null,
+                        "Glissez-d\u00E9posez votre fichier, ou",
+                        " ",
+                        React.createElement("span", { className: styles.btn_tertiary }, buttonLabel),
+                        React.createElement("input", { id: "file-upload", ref: fileInputRef, type: "file", accept: acceptedExtensions.join(","), style: { display: "none" }, onChange: handleFileSelect })))))) : (React.createElement("div", { className: styles.manual_upload_container },
+            React.createElement("button", { className: styles.file_upload_button, onClick: function () { var _a; return (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click(); } },
+                React.createElement("span", { className: styles.btn_tertiary }, buttonLabel),
+                React.createElement("input", { id: "file-upload", ref: fileInputRef, type: "file", accept: acceptedExtensions.join(","), style: { display: "none" }, onChange: handleFileSelect })))),
+        React.createElement("div", { className: styles.limits },
+            React.createElement("div", { className: styles.format },
+                React.createElement("span", { className: styles.limit_text },
+                    acceptedLabel,
+                    " ",
+                    acceptedExtensions.join(", "))),
+            React.createElement("div", { className: styles.size },
+                React.createElement("span", { className: styles.limit_text },
+                    maxSizeLabel,
+                    " ",
+                    maxFileSizeMB,
+                    " Mo"))),
+        descriptionParts && (React.createElement("p", { className: styles.description },
+            descriptionParts.beforeLink,
+            " ",
+            React.createElement("a", { href: descriptionParts.linkUrl, target: "_blank", rel: "noopener noreferrer", className: styles.description_link }, descriptionParts.linkLabel),
+            " ",
+            descriptionParts.afterLink)),
+        errorMessage && (React.createElement("div", { className: styles.uploaded_file_container },
+            React.createElement("div", { className: styles.uploaded_file_error },
+                React.createElement("span", { className: styles.error_message }, errorMessage)))),
+        (isLoading || selectedFile || fileName) && (React.createElement("div", { className: styles.uploaded_file_container },
+            React.createElement("div", { className: styles.uploaded_file_content },
+                React.createElement("div", { className: styles.uploaded_file_icon }, iconUrl ? (React.createElement(Image, { src: iconUrl, alt: "File icon", className: styles.file_icon, width: 20, height: 20 })) : (React.createElement("i", { className: "allaw-icon-file" }))),
+                React.createElement("div", { className: styles.uploaded_file_name_size },
+                    React.createElement("div", { className: styles.uploaded_file_name },
+                        React.createElement("span", { className: styles.file_name }, displayFileName || "Analyse en cours...")),
+                    React.createElement("div", { className: styles.uploaded_file_size },
+                        React.createElement("span", { className: styles.file_size }, displayFileSize > 0 ? formatFileSize(displayFileSize) : ""))),
+                selectedFile && (React.createElement("div", { className: styles.uploaded_file_delete_container },
+                    React.createElement("div", { className: styles.uploaded_file_delete, onClick: handleFileDelete },
+                        React.createElement("i", { className: "allaw-icon-close" }))))),
+            React.createElement("div", { className: styles.uploaded_file_progress_bar }, uploadProgress > 0 && (React.createElement("div", { className: styles.progress_bar_container },
+                React.createElement("div", { className: styles.progress_bar_fill, style: { width: "".concat((uploadProgress / 10) * 100, "%") } })))))),
+        showCropper && selectedFile && (React.createElement(ImageCropperModal, { file: selectedFile, shape: cropShape, onCancel: handleCropCancel, onConfirm: handleCropConfirm }))));
+};
+export default FileUploader;

package/dist/components/molecules/fileUploader/FileUploader.module.css

@@ -0,0 +1,299 @@
+.upload_main_container {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  width: 100%;
+  gap: 0.5rem;
+}
+
+.upload_container {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  border: 2px dashed var(--venom-grey-dark, #d1dce8);
+  border-radius: 16px;
+  padding: 4rem 2rem;
+  min-height: 150px;
+  margin-top: 1rem;
+  background-color: #ffffff;
+  width: 100%;
+  transition: all 0.2s ease-in-out;
+  cursor: pointer;
+}
+
+.manual_upload_container {
+  display: flex;
+  justify-content: center;
+  margin-top: 1rem;
+}
+
+.upload_container:hover {
+  background-color: #f6fcfe;
+  border: 2px dashed var(--bleu-allaw, #25beeb);
+  cursor: pointer;
+}
+
+.upload_container:hover .upload_icon {
+  background-color: #171e25;
+}
+
+.upload_content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 1rem;
+}
+
+.upload_icons {
+  display: flex;
+  align-items: center;
+  position: relative;
+}
+
+.upload_file_icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 3rem;
+  color: var(--lightSteelBlue, #a2b5c8);
+}
+
+.upload_icon_container {
+  position: absolute;
+  bottom: -10px;
+  right: -10px;
+}
+
+.upload_icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: #25beeb;
+  color: white;
+  border-radius: 50%;
+  width: 32px;
+  height: 32px;
+  font-size: 1rem;
+  transition: all 0.2s ease-in-out;
+}
+
+.upload_description {
+  text-align: center;
+}
+
+.upload_description span {
+  font-family: var(--font-open-sans, sans-serif);
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: normal;
+}
+
+.file_upload_label {
+  cursor: pointer;
+}
+
+.btn_tertiary {
+  color: #25beeb;
+  font-weight: 600;
+  cursor: pointer;
+}
+
+.btn_tertiary:hover {
+  text-decoration: underline;
+}
+
+.limits {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  gap: 1rem;
+}
+
+.limit_text {
+  color: var(--mid-grey, #728ea7);
+  font-size: 14px;
+  font-family: var(--font-open-sans, sans-serif);
+}
+
+.description {
+  color: var(--primary-dark-grey, #456073);
+  font-family: var(--font-open-sans, sans-serif);
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: normal;
+  padding-top: 0.5rem;
+}
+
+.description_link {
+  color: #25beeb;
+  text-decoration: underline;
+}
+
+.uploaded_file_container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  border-radius: 16px;
+  border: 1px solid var(--grey-venom, #e6edf5);
+  background: var(--primary-blanc, #fff);
+  padding: 1rem 1rem 0.5rem 1rem;
+  gap: 0.5rem;
+  margin-top: 1rem;
+}
+
+.uploaded_file_content {
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  min-height: 40px;
+}
+
+.uploaded_file_name_size {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  justify-content: center;
+  width: 100%;
+  padding-left: 1rem;
+}
+
+.file_name {
+  font-family: var(--font-open-sans, sans-serif);
+  font-weight: 600;
+  color: var(--noir, #171e25);
+  font-size: 14px;
+}
+
+.file_size {
+  font-family: var(--font-open-sans, sans-serif);
+  color: var(--mid-grey, #728ea7);
+  font-size: 12px;
+}
+
+.uploaded_file_delete_container {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+}
+
+.uploaded_file_delete {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  height: 30px;
+  width: 30px;
+  color: var(--mid-grey, #728ea7);
+  font-size: 0.8rem;
+  cursor: pointer;
+  transition: color 0.2s ease-in-out;
+}
+
+.uploaded_file_delete:hover {
+  color: var(--noir, #171e25);
+}
+
+.uploaded_file_icon {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid var(--grey-venom, #e6edf5);
+  border-radius: 8px;
+  padding: 0.75rem;
+  position: relative;
+  min-width: 40px;
+  min-height: 40px;
+}
+
+.file_icon {
+  width: 20px;
+  height: 20px;
+  object-fit: contain;
+}
+
+.uploaded_file_progress_bar {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 40px;
+}
+
+.progress_bar_container {
+  width: 100%;
+  height: 4px;
+  background-color: #e6edf5;
+  border-radius: 2px;
+  overflow: hidden;
+}
+
+.progress_bar_fill {
+  height: 100%;
+  background-color: #25beeb;
+  transition: width 0.3s ease-in-out;
+}
+
+.drag_over {
+  background-color: #f6fcfe;
+  border: 2px dashed var(--bleu-allaw, #25beeb);
+}
+
+.drag_over .upload_icon {
+  background-color: #171e25;
+}
+
+.uploaded_file_error {
+  padding-bottom: 0.5rem;
+  width: 100%;
+}
+
+.error_message {
+  color: var(--actions-error, #eb4a4a);
+  font-family: var(--font-open-sans, sans-serif);
+  font-size: 14px;
+  font-weight: 600;
+}
+
+.file_upload_button {
+  background: none;
+  border: none;
+  padding: 0;
+  margin: 0;
+  cursor: pointer;
+  font-family: inherit;
+  font-size: inherit;
+}
+
+@media (max-width: 768px) {
+  .upload_container {
+    padding: 2rem 1rem;
+  }
+
+  .upload_file_icon {
+    font-size: 2.5rem;
+  }
+
+  .upload_icon {
+    width: 28px;
+    height: 28px;
+    font-size: 0.8rem;
+  }
+
+  .limits {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 0.25rem;
+  }
+}

package/dist/components/molecules/fileUploader/FileUploader.stories.d.ts

@@ -0,0 +1,106 @@
+declare namespace _default {
+    export let title: string;
+    export { FileUploader as component };
+    export let tags: string[];
+    export namespace parameters {
+        namespace backgrounds {
+            let _default: string;
+            export { _default as default };
+            export let values: {
+                name: string;
+                value: string;
+            }[];
+        }
+    }
+    export namespace argTypes {
+        namespace acceptedExtensions {
+            let control: string;
+            let description: string;
+        }
+        namespace maxFileSizeMB {
+            let control_1: string;
+            export { control_1 as control };
+            let description_1: string;
+            export { description_1 as description };
+        }
+        namespace enableDragAndDrop {
+            let control_2: string;
+            export { control_2 as control };
+            let description_2: string;
+            export { description_2 as description };
+        }
+        namespace enableCropping {
+            let control_3: string;
+            export { control_3 as control };
+            let description_3: string;
+            export { description_3 as description };
+        }
+        namespace cropShape {
+            export namespace control_4 {
+                let type: string;
+                let options: string[];
+            }
+            export { control_4 as control };
+            let description_4: string;
+            export { description_4 as description };
+        }
+        namespace iconUrl {
+            let control_5: string;
+            export { control_5 as control };
+            let description_5: string;
+            export { description_5 as description };
+        }
+        namespace buttonLabel {
+            let control_6: string;
+            export { control_6 as control };
+            let description_6: string;
+            export { description_6 as description };
+        }
+        namespace acceptedLabel {
+            let control_7: string;
+            export { control_7 as control };
+            let description_7: string;
+            export { description_7 as description };
+        }
+        namespace maxSizeLabel {
+            let control_8: string;
+            export { control_8 as control };
+            let description_8: string;
+            export { description_8 as description };
+        }
+        namespace uploadProgress {
+            export namespace control_9 {
+                let type_1: string;
+                export { type_1 as type };
+                export let min: number;
+                export let max: number;
+                export let step: number;
+            }
+            export { control_9 as control };
+            let description_9: string;
+            export { description_9 as description };
+        }
+        namespace isLoading {
+            let control_10: string;
+            export { control_10 as control };
+            let description_10: string;
+            export { description_10 as description };
+        }
+        namespace errorMessage {
+            let control_11: string;
+            export { control_11 as control };
+            let description_11: string;
+            export { description_11 as description };
+        }
+    }
+}
+export default _default;
+export const Default: any;
+export const WithDescription: any;
+export const WithoutDragAndDrop: any;
+export const WithError: any;
+export const WithProgress: any;
+export const MultipleExtensions: any;
+export const WithSquareCropping: any;
+export const WithCircleCropping: any;
+import FileUploader from "./FileUploader";