linear-react-components-ui 1.1.27-rc.0 → 2.0.0-beta.0

package/lib/inputs/file/DragDropFile.js

@@ -1,273 +1,203 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _lodash = _interopRequireDefault(require("lodash"));
-var _buttons = require("../../buttons");
-var _icons = _interopRequireDefault(require("../../icons"));
-var _InputTextBase = _interopRequireDefault(require("../base/InputTextBase"));
-var _hint = _interopRequireDefault(require("../../hint"));
-var _errorMessage = require("../errorMessage");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-const getFilesList = files => !(files !== null && files !== void 0 && files.length) ? [] : _lodash.default.map(files, file => file);
-const getAcceptFilesLabel = valueAccept => valueAccept.split(',').map(value => value.includes('.') ? value.split('.')[1] : value.split('/')[1]).join(', ');
-const getAcceptFilesWithoutRemoveText = value => value.split(', ');
-const DragDropFile = props => {
-  const {
-    id = Math.random().toString(36).substring(2, 7),
-    accept = 'image/png, image/jpeg',
-    labelButton = 'Selecionar',
-    subtitleDragDrop = 'Selecione arquivos do tipo ',
-    titleDragDrop = 'Arquivo para importação',
-    onBtnClickInsert,
-    inputRef,
-    onChange,
-    onDragEnter,
-    onDragOver,
-    onDragLeave,
-    onDrop,
-    showSubtitle = true,
-    multiple = false,
-    hint = [],
-    hintPosition = 'below',
-    errorMessages = [],
-    skeletonize = false
-  } = props;
-  const [dragActive, setDragActive] = (0, _react.useState)(false);
-  const [fileList, setFileList] = (0, _react.useState)([]);
-  const [typeNotAccept, setTypeNotAccept] = (0, _react.useState)(false);
-  const [message, setMessage] = (0, _react.useState)({
-    class: '',
-    text: titleDragDrop,
-    subtitle: subtitleDragDrop + getAcceptFilesLabel(accept),
-    error: false
-  });
-  const handleDrag = e => {
-    var _e$preventDefault, _e$stopPropagation;
-    (_e$preventDefault = e.preventDefault) === null || _e$preventDefault === void 0 ? void 0 : _e$preventDefault.call(e);
-    (_e$stopPropagation = e.stopPropagation) === null || _e$stopPropagation === void 0 ? void 0 : _e$stopPropagation.call(e);
-  };
-  const checkTypeNotAccept = (types, getTypesArray, e) => {
-    setTypeNotAccept(false);
-    getTypesArray.forEach(element => {
-      if (!typeNotAccept && types.indexOf(element) === -1) {
-        setTypeNotAccept(true);
-      }
-      return typeNotAccept;
-    });
-    if (!multiple && (e.dataTransfer.items.length > 1 || fileList.length > 0)) {
-      setMessage({
-        class: 'disapprovedFile',
-        text: 'Não é permitido anexar mais de um arquivo.',
-        subtitle: '',
-        error: true
-      });
-    } else if (typeNotAccept) {
-      setMessage({
-        class: 'disapprovedFile',
-        text: 'Por favor, verifique a extensão do(s) arquivo(s) inserido(s).',
-        subtitle: "Apenas as extens\xF5es ".concat(getAcceptFilesLabel(accept), " s\xE3o permitidas."),
-        error: true
-      });
-    } else {
-      setMessage({
-        class: 'approvedFile',
-        text: titleDragDrop,
-        subtitle: subtitleDragDrop + getAcceptFilesLabel(accept),
-        error: false
-      });
-    }
-  };
-  const getTypesFiles = e => {
-    let typesFilesDrag = [];
-    if (e.dataTransfer.items) {
-      Array.from(e.dataTransfer.items).map(item => {
-        if (typesFilesDrag.indexOf(item.type) === -1) {
-          typesFilesDrag = [...typesFilesDrag, item.type];
-        }
-        return typesFilesDrag;
-      });
-    }
-    return typesFilesDrag;
-  };
-  const handleDragEnter = e => {
-    const arrayTypes = getAcceptFilesWithoutRemoveText(accept);
-    const getTypesArray = getTypesFiles(e);
-    checkTypeNotAccept(arrayTypes, getTypesArray, e);
-    handleDrag(e);
-    setDragActive(true);
-    onDragEnter === null || onDragEnter === void 0 ? void 0 : onDragEnter(e);
-  };
-  const handleDragLeave = e => {
-    setMessage({
-      class: '',
-      text: titleDragDrop,
-      subtitle: subtitleDragDrop + getAcceptFilesLabel(accept),
-      error: false
-    });
-    handleDrag(e);
-    setDragActive(false);
-    onDragLeave === null || onDragLeave === void 0 ? void 0 : onDragLeave(e);
-  };
-  const handleDragOver = e => {
-    handleDrag(e);
-    onDragOver === null || onDragOver === void 0 ? void 0 : onDragOver(e);
-  };
-  const handleDrop = e => {
-    handleDrag(e);
-    setDragActive(false);
-    const input = e.dataTransfer;
-    if (input && !message.error) {
-      const files = getFilesList(input.files);
-      if (files.length > 0) {
-        const fileNoRepeat = fileList.concat(files);
-        const ids = fileNoRepeat.map(o => o.name);
-        const filtered = fileNoRepeat.filter((_ref, index) => {
-          let {
-            name
-          } = _ref;
-          return !ids.includes(name, index + 1);
-        });
-        setFileList(filtered);
-        onChange === null || onChange === void 0 ? void 0 : onChange(files, e);
-        onDrop === null || onDrop === void 0 ? void 0 : onDrop(e);
-      }
-    }
-    setMessage({
-      class: '',
-      text: titleDragDrop,
-      subtitle: subtitleDragDrop + getAcceptFilesLabel(accept),
-      error: false
-    });
-  };
-  const handleChange = e => {
-    var _e$preventDefault2;
-    (_e$preventDefault2 = e.preventDefault) === null || _e$preventDefault2 === void 0 ? void 0 : _e$preventDefault2.call(e);
-    const files = getFilesList(e.target.files);
-    if (files.length > 0 && !typeNotAccept) {
-      const fileNoRepeat = fileList.concat(files);
-      const ids = fileNoRepeat.map(o => o.name);
-      const filesFiltered = fileNoRepeat.filter((_ref2, index) => {
-        let {
-          name
-        } = _ref2;
-        return !ids.includes(name, index + 1);
-      });
-      setFileList(filesFiltered);
-      onChange === null || onChange === void 0 ? void 0 : onChange(files, e);
-    }
-  };
-  const onButtonClickRemoveAll = () => setFileList([]);
-  const handleRemoveFile = fileName => {
-    setFileList(prevState => prevState.filter(file => file.name !== fileName));
-  };
-  const generateListArray = () => {
-    if ((fileList === null || fileList === void 0 ? void 0 : fileList.length) === 1) {
-      return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, fileList[0].type === 'image/jpeg' || fileList[0].type === 'image/png' ? /*#__PURE__*/_react.default.createElement("img", {
-        alt: fileList[0].name,
-        src: URL.createObjectURL(fileList[0])
-      }) : /*#__PURE__*/_react.default.createElement(_icons.default, {
-        size: 64,
-        name: "file_excel"
-      }), /*#__PURE__*/_react.default.createElement("div", {
-        className: "image-preview-solo"
-      }, /*#__PURE__*/_react.default.createElement("div", {
-        className: "description-file"
-      }, /*#__PURE__*/_react.default.createElement("span", {
-        className: "subtitle"
-      }, fileList[0].name))));
-    }
-    return /*#__PURE__*/_react.default.createElement("ul", {
-      className: "file-list"
-    }, fileList.length > 0 && fileList.map(file => /*#__PURE__*/_react.default.createElement("li", {
-      key: "".concat(file.name).concat(file.size),
-      className: "file-card"
-    }, /*#__PURE__*/_react.default.createElement(_buttons.DangerButton, {
-      transparent: true,
-      boxShadow: false,
-      className: "delete-button",
-      onClick: () => handleRemoveFile(file.name),
-      icon: /*#__PURE__*/_react.default.createElement(_icons.default, {
-        customClass: "color-icon-upload",
-        name: "close"
-      })
-    }), /*#__PURE__*/_react.default.createElement("div", {
-      className: "image-content"
-    }, (file.type === 'image/jpeg' || file.type === 'image/png') && /*#__PURE__*/_react.default.createElement("img", {
-      alt: file.name,
-      className: "image-preview",
-      src: URL.createObjectURL(file)
-    })), /*#__PURE__*/_react.default.createElement("div", {
-      className: "description-file"
-    }, /*#__PURE__*/_react.default.createElement("span", {
-      className: "subtitle"
-    }, file.name)))));
-  };
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: "input-dragdrop-container",
-    onDragEnter: handleDragEnter,
-    onSubmit: e => e.preventDefault()
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "drag-content ".concat(skeletonize ? '-skeletonized' : '')
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "".concat(message.class, " ").concat(!skeletonize ? 'content' : '')
-  }, message.error || fileList.length === 0 ? /*#__PURE__*/_react.default.createElement("label", {
-    htmlFor: id
-  }, /*#__PURE__*/_react.default.createElement("h1", {
-    className: "title",
-    style: {
-      paddingBottom: '20px'
-    }
-  }, message.text), showSubtitle && /*#__PURE__*/_react.default.createElement("p", {
-    className: "subtitle"
-  }, message.subtitle), !skeletonize && /*#__PURE__*/_react.default.createElement(_buttons.PrimaryButton, {
-    onClick: onBtnClickInsert,
-    label: labelButton
-  })) : /*#__PURE__*/_react.default.createElement(_react.Fragment, null, generateListArray(), /*#__PURE__*/_react.default.createElement("footer", {
-    className: "footer-button-action"
-  }, (!multiple && fileList.length < 1 || multiple) && /*#__PURE__*/_react.default.createElement(_buttons.PrimaryButton, {
-    className: "selectButton",
-    onClick: onBtnClickInsert,
-    label: labelButton
-  }), /*#__PURE__*/_react.default.createElement(_buttons.DangerButton, {
-    className: "cancelButton",
-    onClick: onButtonClickRemoveAll,
-    icon: /*#__PURE__*/_react.default.createElement(_icons.default, {
-      name: "close",
-      color: "white"
-    }),
-    label: "Limpar"
-  })))), /*#__PURE__*/_react.default.createElement(_InputTextBase.default, _extends({}, props, {
-    inputRef: inputRef,
-    style: {
-      display: 'none'
-    },
-    type: "file",
-    id: id,
-    accept: accept,
-    multiple: multiple,
-    onDragOver: handleDragOver,
-    onDrop: handleDrop,
-    onDragLeave: handleDragLeave,
-    onChange: handleChange
-  })), dragActive && /*#__PURE__*/_react.default.createElement("div", {
-    className: "drag-position-element",
-    id: "dragFileElement",
-    onDragEnter: handleDragEnter,
-    onDragLeave: handleDragLeave,
-    onDragOver: handleDragOver,
-    onDrop: handleDrop
-  })), /*#__PURE__*/_react.default.createElement(_errorMessage.ErrorMessage, {
-    messages: errorMessages
-  }), /*#__PURE__*/_react.default.createElement(_hint.default, {
-    visible: !!hint && hintPosition === 'below',
-    customClass: "hint",
-    description: hint
-  }));
+import { __toESM as e } from "../../_virtual/_rolldown/runtime.js";
+import t from "../../icons/index.js";
+import { require_lodash as n } from "../../node_modules/lodash/lodash.js";
+import r from "../../buttons/PrimaryButton.js";
+import i from "../../buttons/DangerButton.js";
+import { ErrorMessage as a } from "../errorMessage/index.js";
+import o from "../../hint/index.js";
+import s from "../base/InputTextBase.js";
+import { Fragment as c, useState as l } from "react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/lib/inputs/file/DragDropFile.tsx
+var f = /* @__PURE__ */ e(n(), 1), p = (e) => e?.length ? f.default.map(e, (e) => e) : [], m = (e) => e.split(",").map((e) => e.includes(".") ? e.split(".")[1] : e.split("/")[1]).join(", "), h = (e) => e.split(", "), g = (e) => {
+	let { id: n = Math.random().toString(36).substring(2, 7), accept: f = "image/png, image/jpeg", labelButton: g = "Selecionar", subtitleDragDrop: _ = "Selecione arquivos do tipo ", titleDragDrop: v = "Arquivo para importação", onBtnClickInsert: y, inputRef: b, onChange: x, onDragEnter: S, onDragOver: C, onDragLeave: w, onDrop: T, showSubtitle: E = !0, multiple: D = !1, hint: O = [], hintPosition: k = "below", errorMessages: A = [], skeletonize: j = !1 } = e, [M, N] = l(!1), [P, F] = l([]), [I, L] = l(!1), [R, z] = l({
+		class: "",
+		text: v,
+		subtitle: _ + m(f),
+		error: !1
+	}), B = (e) => {
+		e.preventDefault?.(), e.stopPropagation?.();
+	}, V = (e, t, n) => {
+		L(!1), t.forEach((t) => (!I && e.indexOf(t) === -1 && L(!0), I)), !D && (n.dataTransfer.items.length > 1 || P.length > 0) ? z({
+			class: "disapprovedFile",
+			text: "Não é permitido anexar mais de um arquivo.",
+			subtitle: "",
+			error: !0
+		}) : z(I ? {
+			class: "disapprovedFile",
+			text: "Por favor, verifique a extensão do(s) arquivo(s) inserido(s).",
+			subtitle: `Apenas as extensões ${m(f)} são permitidas.`,
+			error: !0
+		} : {
+			class: "approvedFile",
+			text: v,
+			subtitle: _ + m(f),
+			error: !1
+		});
+	}, H = (e) => {
+		let t = [];
+		return e.dataTransfer.items && Array.from(e.dataTransfer.items).map((e) => (t.indexOf(e.type) === -1 && (t = [...t, e.type]), t)), t;
+	}, U = (e) => {
+		V(h(f), H(e), e), B(e), N(!0), S?.(e);
+	}, W = (e) => {
+		z({
+			class: "",
+			text: v,
+			subtitle: _ + m(f),
+			error: !1
+		}), B(e), N(!1), w?.(e);
+	}, G = (e) => {
+		B(e), C?.(e);
+	}, K = (e) => {
+		B(e), N(!1);
+		let t = e.dataTransfer;
+		if (t && !R.error) {
+			let n = p(t.files);
+			if (n.length > 0) {
+				let t = P.concat(n), r = t.map((e) => e.name);
+				F(t.filter(({ name: e }, t) => !r.includes(e, t + 1))), x?.(n, e), T?.(e);
+			}
+		}
+		z({
+			class: "",
+			text: v,
+			subtitle: _ + m(f),
+			error: !1
+		});
+	}, q = (e) => {
+		e.preventDefault?.();
+		let t = p(e.target.files);
+		if (t.length > 0 && !I) {
+			let n = P.concat(t), r = n.map((e) => e.name);
+			F(n.filter(({ name: e }, t) => !r.includes(e, t + 1))), x?.(t, e);
+		}
+	}, J = () => F([]), Y = (e) => {
+		F((t) => t.filter((t) => t.name !== e));
+	};
+	return /* @__PURE__ */ d("div", {
+		className: "input-dragdrop-container",
+		onDragEnter: U,
+		onSubmit: (e) => e.preventDefault(),
+		children: [
+			/* @__PURE__ */ d("div", {
+				className: `drag-content ${j ? "-skeletonized" : ""}`,
+				children: [
+					/* @__PURE__ */ u("div", {
+						className: `${R.class} ${j ? "" : "content"}`,
+						children: R.error || P.length === 0 ? /* @__PURE__ */ d("label", {
+							htmlFor: n,
+							children: [
+								/* @__PURE__ */ u("h1", {
+									className: "title",
+									style: { paddingBottom: "20px" },
+									children: R.text
+								}),
+								E && /* @__PURE__ */ u("p", {
+									className: "subtitle",
+									children: R.subtitle
+								}),
+								!j && /* @__PURE__ */ u(r, {
+									onClick: y,
+									label: g
+								})
+							]
+						}) : /* @__PURE__ */ d(c, { children: [P?.length === 1 ? /* @__PURE__ */ d(c, { children: [P[0].type === "image/jpeg" || P[0].type === "image/png" ? /* @__PURE__ */ u("img", {
+							alt: P[0].name,
+							src: URL.createObjectURL(P[0])
+						}) : /* @__PURE__ */ u(t, {
+							size: 64,
+							name: "file_excel"
+						}), /* @__PURE__ */ u("div", {
+							className: "image-preview-solo",
+							children: /* @__PURE__ */ u("div", {
+								className: "description-file",
+								children: /* @__PURE__ */ u("span", {
+									className: "subtitle",
+									children: P[0].name
+								})
+							})
+						})] }) : /* @__PURE__ */ u("ul", {
+							className: "file-list",
+							children: P.length > 0 && P.map((e) => /* @__PURE__ */ d("li", {
+								className: "file-card",
+								children: [
+									/* @__PURE__ */ u(i, {
+										transparent: !0,
+										boxShadow: !1,
+										className: "delete-button",
+										onClick: () => Y(e.name),
+										icon: /* @__PURE__ */ u(t, {
+											customClass: "color-icon-upload",
+											name: "close"
+										})
+									}),
+									/* @__PURE__ */ u("div", {
+										className: "image-content",
+										children: (e.type === "image/jpeg" || e.type === "image/png") && /* @__PURE__ */ u("img", {
+											alt: e.name,
+											className: "image-preview",
+											src: URL.createObjectURL(e)
+										})
+									}),
+									/* @__PURE__ */ u("div", {
+										className: "description-file",
+										children: /* @__PURE__ */ u("span", {
+											className: "subtitle",
+											children: e.name
+										})
+									})
+								]
+							}, `${e.name}${e.size}`))
+						}), /* @__PURE__ */ d("footer", {
+							className: "footer-button-action",
+							children: [(!D && P.length < 1 || D) && /* @__PURE__ */ u(r, {
+								className: "selectButton",
+								onClick: y,
+								label: g
+							}), /* @__PURE__ */ u(i, {
+								className: "cancelButton",
+								onClick: J,
+								icon: /* @__PURE__ */ u(t, {
+									name: "close",
+									color: "white"
+								}),
+								label: "Limpar"
+							})]
+						})] })
+					}),
+					/* @__PURE__ */ u(s, {
+						...e,
+						inputRef: b,
+						style: { display: "none" },
+						type: "file",
+						id: n,
+						accept: f,
+						multiple: D,
+						onDragOver: G,
+						onDrop: K,
+						onDragLeave: W,
+						onChange: q
+					}),
+					M && /* @__PURE__ */ u("div", {
+						className: "drag-position-element",
+						id: "dragFileElement",
+						onDragEnter: U,
+						onDragLeave: W,
+						onDragOver: G,
+						onDrop: K
+					})
+				]
+			}),
+			/* @__PURE__ */ u(a, { messages: A }),
+			/* @__PURE__ */ u(o, {
+				visible: !!O && k === "below",
+				customClass: "hint",
+				description: O
+			})
+		]
+	});
 };
-var _default = exports.default = DragDropFile;
+//#endregion
+export { g as default };
+
+//# sourceMappingURL=DragDropFile.js.map

package/lib/inputs/file/DragDropFile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DragDropFile.js","names":[],"sources":["../../../src/lib/inputs/file/DragDropFile.tsx"],"sourcesContent":["import { useState, DragEvent, Fragment } from 'react';\nimport _ from 'lodash';\nimport { DangerButton, PrimaryButton } from '../../buttons';\nimport Icon from '../../icons';\nimport InputTextBase from '../base/InputTextBase';\nimport { CustomInputEvent } from '../base/types';\nimport { IDragDropFileProps } from './types';\nimport Hint from '../../hint';\nimport { ErrorMessage } from '../errorMessage';\n\nconst getFilesList = (files: FileList | null | undefined): File[] => (\n  !files?.length ? [] : _.map(files, file => file)\n);\n\nconst getAcceptFilesLabel = (valueAccept: string) =>\n  valueAccept.split(',').map(value => (value.includes('.') ? value.split('.')[1] : value.split('/')[1])).join(', ');\n\nconst getAcceptFilesWithoutRemoveText = (value: string) => value.split(', ');\n\nconst DragDropFile = (props: IDragDropFileProps) => {\n  const {\n    id = Math.random().toString(36).substring(2, 7),\n    accept = 'image/png, image/jpeg',\n    labelButton = 'Selecionar',\n    subtitleDragDrop = 'Selecione arquivos do tipo ',\n    titleDragDrop = 'Arquivo para importação',\n    onBtnClickInsert,\n    inputRef,\n    onChange,\n    onDragEnter,\n    onDragOver,\n    onDragLeave,\n    onDrop,\n    showSubtitle = true,\n    multiple = false,\n    hint = [],\n    hintPosition = 'below',\n    errorMessages = [],\n    skeletonize = false,\n  } = props;\n\n  const [dragActive, setDragActive] = useState(false);\n  const [fileList, setFileList] = useState<File[]>([]);\n  const [typeNotAccept, setTypeNotAccept] = useState(false);\n  const [message, setMessage] = useState({\n    class: '',\n    text: titleDragDrop,\n    subtitle: subtitleDragDrop + getAcceptFilesLabel(accept),\n    error: false,\n  });\n\n  const handleDrag = (e: DragEvent) => {\n    e.preventDefault?.();\n    e.stopPropagation?.();\n  };\n\n  const checkTypeNotAccept = (types: string[], getTypesArray: string[], e: DragEvent) => {\n    setTypeNotAccept(false);\n\n    getTypesArray.forEach((element) => {\n      if (!typeNotAccept && types.indexOf(element) === -1) {\n        setTypeNotAccept(true);\n      }\n      return typeNotAccept;\n    });\n\n    if (!multiple && (e.dataTransfer.items.length > 1 || fileList.length > 0)) {\n      setMessage({\n        class: 'disapprovedFile',\n        text: 'Não é permitido anexar mais de um arquivo.',\n        subtitle: '',\n        error: true,\n      });\n    } else if (typeNotAccept) {\n      setMessage({\n        class: 'disapprovedFile',\n        text: 'Por favor, verifique a extensão do(s) arquivo(s) inserido(s).',\n        subtitle: `Apenas as extensões ${getAcceptFilesLabel(accept)} são permitidas.`,\n        error: true,\n      });\n    } else {\n      setMessage({\n        class: 'approvedFile',\n        text: titleDragDrop,\n        subtitle: subtitleDragDrop + getAcceptFilesLabel(accept),\n        error: false,\n      });\n    }\n  };\n  const getTypesFiles = (e: DragEvent) => {\n    let typesFilesDrag: string[] = [];\n    if (e.dataTransfer.items) {\n      Array.from(e.dataTransfer.items).map((item) => {\n        if (typesFilesDrag.indexOf(item.type) === -1) {\n          typesFilesDrag = [...typesFilesDrag, item.type];\n        }\n        return typesFilesDrag;\n      });\n    }\n    return typesFilesDrag;\n  };\n\n  const handleDragEnter = (e: DragEvent) => {\n    const arrayTypes = getAcceptFilesWithoutRemoveText(accept);\n    const getTypesArray = getTypesFiles(e);\n    checkTypeNotAccept(arrayTypes, getTypesArray, e);\n    handleDrag(e);\n    setDragActive(true);\n    onDragEnter?.(e);\n  };\n\n  const handleDragLeave = (e: DragEvent) => {\n    setMessage({\n      class: '',\n      text: titleDragDrop,\n      subtitle: subtitleDragDrop + getAcceptFilesLabel(accept),\n      error: false,\n    });\n    handleDrag(e);\n    setDragActive(false);\n    onDragLeave?.(e);\n  };\n\n  const handleDragOver = (\n    e: DragEvent<HTMLInputElement | HTMLTextAreaElement | HTMLDivElement>,\n  ) => {\n    handleDrag(e);\n    onDragOver?.(e);\n  };\n\n  const handleDrop = (e: DragEvent) => {\n    handleDrag(e);\n    setDragActive(false);\n    const input = e.dataTransfer;\n    if (input && !message.error) {\n      const files = getFilesList(input.files);\n      if (files.length > 0) {\n        const fileNoRepeat = fileList.concat(files);\n        const ids = fileNoRepeat.map(o => o.name);\n        const filtered = fileNoRepeat.filter(({ name }, index) => !ids.includes(name, index + 1));\n        setFileList(filtered);\n        onChange?.(files, e);\n        onDrop?.(e);\n      }\n    }\n    setMessage({\n      class: '',\n      text: titleDragDrop,\n      subtitle: subtitleDragDrop + getAcceptFilesLabel(accept),\n      error: false,\n    });\n  };\n\n  const handleChange = (e: CustomInputEvent) => {\n    e.preventDefault?.();\n    const files = getFilesList(e.target.files);\n    if (files.length > 0 && !typeNotAccept) {\n      const fileNoRepeat = fileList.concat(files);\n      const ids = fileNoRepeat.map(o => o.name);\n      const filesFiltered =\n        fileNoRepeat.filter(({ name }, index) => !ids.includes(name, index + 1));\n      setFileList(filesFiltered);\n      onChange?.(files, e);\n    }\n  };\n\n  const onButtonClickRemoveAll = () => setFileList([]);\n\n  const handleRemoveFile = (fileName: string) => {\n    setFileList(prevState => prevState.filter(file => file.name !== fileName));\n  };\n\n  const generateListArray = () => {\n    if (fileList?.length === 1) {\n      return (\n        <Fragment>\n          {fileList[0].type === 'image/jpeg' || fileList[0].type === 'image/png' ?\n            <img alt={fileList[0].name} src={URL.createObjectURL(fileList[0])} /> :\n            <Icon size={64} name=\"file_excel\" />\n          }\n          <div className=\"image-preview-solo\">\n            <div className=\"description-file\">\n              <span className=\"subtitle\">{fileList[0].name}</span>\n            </div>\n          </div>\n        </Fragment>\n      );\n    }\n    return (\n      <ul className=\"file-list\">\n        {fileList.length > 0 && fileList.map(file => (\n          <li\n            key={`${file.name}${file.size}`}\n            className=\"file-card\">\n            <DangerButton\n              transparent\n              boxShadow={false}\n              className=\"delete-button\"\n              onClick={() => handleRemoveFile(file.name)}\n              icon={<Icon customClass=\"color-icon-upload\" name=\"close\" />} />\n            <div className=\"image-content\">\n              {(file.type === 'image/jpeg' || file.type === 'image/png') && (\n                <img\n                  alt={file.name}\n                  className=\"image-preview\"\n                  src={URL.createObjectURL(file)} />\n              )}\n            </div>\n            <div className=\"description-file\">\n              <span className=\"subtitle\">{file.name}</span>\n            </div>\n          </li>\n        ))}\n      </ul>\n    );\n  };\n\n  return (\n    <div className=\"input-dragdrop-container\" onDragEnter={handleDragEnter} onSubmit={e => e.preventDefault()}>\n      <div className={`drag-content ${skeletonize ? '-skeletonized' : ''}`}>\n        <div className={`${message.class} ${!skeletonize ? 'content' : ''}`}>\n          {message.error || fileList.length === 0\n            ? (\n              <label htmlFor={id}>\n                <h1 className=\"title\" style={{ paddingBottom: '20px' }}>{message.text}</h1>\n                {showSubtitle && <p className=\"subtitle\">{message.subtitle}</p>}\n                {!skeletonize &&\n                <PrimaryButton onClick={onBtnClickInsert} label={labelButton} />}\n              </label>\n              )\n            : (\n              <Fragment>\n                {generateListArray()}\n                <footer className=\"footer-button-action\">\n                  {((!multiple && fileList.length < 1) || multiple) && (\n                  <PrimaryButton\n                    className=\"selectButton\"\n                    onClick={onBtnClickInsert}\n                    label={labelButton} />\n                  )}\n                  <DangerButton\n                    className=\"cancelButton\"\n                    onClick={onButtonClickRemoveAll}\n                    icon={<Icon name=\"close\" color=\"white\" />}\n                    label=\"Limpar\" />\n                </footer>\n              </Fragment>\n              )}\n        </div>\n        <InputTextBase\n          {...props}\n          inputRef={inputRef}\n          style={{ display: 'none' }}\n          type=\"file\"\n          id={id}\n          accept={accept}\n          multiple={multiple}\n          onDragOver={handleDragOver}\n          onDrop={handleDrop}\n          onDragLeave={handleDragLeave}\n          onChange={handleChange} />\n        {dragActive && (\n          <div\n            className=\"drag-position-element\"\n            id=\"dragFileElement\"\n            onDragEnter={handleDragEnter}\n            onDragLeave={handleDragLeave}\n            onDragOver={handleDragOver}\n            onDrop={handleDrop} />\n        )}\n      </div>\n      <ErrorMessage messages={errorMessages} />\n      <Hint visible={!!hint && hintPosition === 'below'} customClass=\"hint\" description={hint} />\n    </div>\n  );\n};\n\nexport default DragDropFile;\n"],"mappings":"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"}

package/lib/inputs/file/File.d.ts

@@ -1,13 +1,3 @@
-import { IFileProps } from './types.js';
-import 'react';
-import '../../@types/Size.js';
-import '../base/types.js';
-import '../../@types/Align.js';
-import '../../@types/Period.js';
-import '../../@types/PermissionAttr.js';
-import '../../tooltip/types.js';
-import '../../@types/Position.js';
-
-declare const File: ({ applyDragDrop, defaultFiles, gridLayout, onBtnClickRemove: onBtnClickRemoveProp, ...rest }: Omit<IFileProps, 'onBtnClickInsert'>) => JSX.Element;
-
-export { File as default };
+import { IFileProps } from './types';
+declare const File: ({ applyDragDrop, defaultFiles, gridLayout, onBtnClickRemove: onBtnClickRemoveProp, ...rest }: Omit<IFileProps, "onBtnClickInsert">) => import("react/jsx-runtime").JSX.Element;
+export default File;