linear-react-components-ui 1.1.25-rc.2 → 1.1.26-beta-1

package/lib/inputs/file/DefaultFile.js

@@ -1,80 +1,71 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _lodash = _interopRequireDefault(require("lodash"));
-var _InputTextBase = _interopRequireDefault(require("../base/InputTextBase"));
-var _FileButtonSettings = _interopRequireDefault(require("./FileButtonSettings"));
-require("../../assets/styles/file.scss");
-var _buttons = _interopRequireDefault(require("../../buttons"));
-var _icons = _interopRequireDefault(require("../../icons"));
-var _popover = _interopRequireWildcard(require("../../popover"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-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 DefaultFile = props => {
+import { j as t } from "../../chunks/jsx-runtime.CYK1ROHF.js";
+import { useState as g } from "react";
+import C from "lodash";
+import F from "../base/InputTextBase.js";
+import y from "./FileButtonSettings.js";
+import B from "../../buttons/Button.js";
+import E from "../../icons/index.js";
+import '../../assets/button.css';import '../../assets/DefaultFile.css';/* empty css                           */
+import I from "../../popover/index.js";
+import N from "../../popover/PopoverText.js";
+const U = (l) => {
   const {
-    id = 'file',
-    accept = 'image/*',
-    onBtnClickInsert,
-    onBtnClickRemove,
-    inputRef,
-    defaultFiles,
-    hint = [],
-    multiple,
-    onChange
-  } = props;
-  const getFilesList = files => !files?.length ? [] : _lodash.default.map(files, file => file);
-  const [fileList, setFileList] = (0, _react.useState)(defaultFiles);
-  const ifExistFiles = fileList instanceof Array && fileList.length > 0;
-  const handleChange = e => {
-    e.preventDefault?.();
-    const files = getFilesList(e.target.files);
-    setFileList(files);
-    onChange?.(files, e);
+    id: r = "file",
+    accept: m = "image/*",
+    onBtnClickInsert: p,
+    onBtnClickRemove: d,
+    inputRef: u,
+    defaultFiles: x,
+    hint: f = [],
+    onChange: i
+  } = l, h = (e) => e != null && e.length ? C.map(e, (s) => s) : [], [o, a] = g(x), n = o instanceof Array && o.length > 0, j = () => /* @__PURE__ */ t.jsx("div", { className: `size-position-icon ${n ? "" : "-disabled-popover"}`, children: /* @__PURE__ */ t.jsx(I, { iconSize: 16, children: /* @__PURE__ */ t.jsxs(N, { children: [
+    /* @__PURE__ */ t.jsx("strong", { children: "Arquivos" }),
+    /* @__PURE__ */ t.jsx("br", {}),
+    n && o.map((e) => /* @__PURE__ */ t.jsx("div", { className: "list-simple-file", children: /* @__PURE__ */ t.jsx("div", { className: "file-name", children: /* @__PURE__ */ t.jsx("span", { children: e.name }) }) }, `${e.name}${e.size}`))
+  ] }) }) }), v = () => /* @__PURE__ */ t.jsx(
+    B,
+    {
+      disabled: !n,
+      className: "-pointerEventsRemove",
+      transparent: !0,
+      boxShadow: !1,
+      onClick: () => {
+        d(), a([]);
+      },
+      icon: /* @__PURE__ */ t.jsx(E, { customClass: "colorIconUpload", name: "close" })
+    }
+  ), b = (e) => {
+    var c;
+    (c = e.preventDefault) == null || c.call(e);
+    const s = h(e.target.files);
+    a(s), i == null || i(s, e);
   };
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: "input-simple-file-container"
-  }, /*#__PURE__*/_react.default.createElement(_InputTextBase.default, _extends({}, props, {
-    hint: hint,
-    readOnlyClass: "-disabledVisualApply",
-    customClassForWrapper: "file-wrapper",
-    customClassForInputContent: "file-content -absolute -pointEventDisabled -disabledVisualApply",
-    type: "file",
-    id: id,
-    accept: accept,
-    inputRef: inputRef,
-    onChange: handleChange,
-    rightElements: /*#__PURE__*/_react.default.createElement(_FileButtonSettings.default, {
-      id: id,
-      onBtnClickInsert: () => onBtnClickInsert()
-    })
-  }), multiple && /*#__PURE__*/_react.default.createElement("div", {
-    className: `size-position-icon ${!ifExistFiles ? '-disabled-popover' : ''}`
-  }, /*#__PURE__*/_react.default.createElement(_popover.default, {
-    iconSize: 16
-  }, /*#__PURE__*/_react.default.createElement(_popover.PopoverText, null, /*#__PURE__*/_react.default.createElement("strong", null, "Arquivos"), /*#__PURE__*/_react.default.createElement("br", null), ifExistFiles && fileList.map(file => /*#__PURE__*/_react.default.createElement("div", {
-    className: "list-simple-file",
-    key: `${file.name}${file.size}`
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "file-name"
-  }, /*#__PURE__*/_react.default.createElement("span", null, file.name))))))), /*#__PURE__*/_react.default.createElement(_buttons.default, {
-    disabled: !ifExistFiles,
-    className: "-pointerEventsRemove",
-    transparent: true,
-    boxShadow: false,
-    onClick: () => {
-      onBtnClickRemove();
-      setFileList([]);
-    },
-    icon: /*#__PURE__*/_react.default.createElement(_icons.default, {
-      customClass: "colorIconUpload",
-      name: "close"
-    })
-  })));
+  return /* @__PURE__ */ t.jsx("div", { className: "input-simple-file-container", children: /* @__PURE__ */ t.jsxs(
+    F,
+    {
+      ...l,
+      hint: f,
+      readOnlyClass: "-disabledVisualApply",
+      customClassForInputContent: "-absolute -pointEventDisabled -disabledVisualApply",
+      type: "file",
+      id: r,
+      accept: m,
+      inputRef: u,
+      onChange: b,
+      rightElements: /* @__PURE__ */ t.jsx(
+        y,
+        {
+          id: r,
+          onBtnClickInsert: p
+        }
+      ),
+      children: [
+        j(),
+        v()
+      ]
+    }
+  ) });
+};
+export {
+  U as default
 };
-var _default = exports.default = DefaultFile;

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

@@ -1,13 +1,3 @@
-import { IDragDropFileProps } 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 '../../internals/types.js';
-import '../../@types/Position.js';
-
-declare const DragDropFile: (props: IDragDropFileProps) => JSX.Element;
-
-export { DragDropFile as default };
+import { IDragDropFileProps } from './types';
+declare const DragDropFile: (props: IDragDropFileProps) => import("react/jsx-runtime").JSX.Element;
+export default DragDropFile;

package/lib/inputs/file/DragDropFile.js

@@ -1,272 +1,191 @@
-"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 _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-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?.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 => {
+import { j as t } from "../../chunks/jsx-runtime.CYK1ROHF.js";
+import { useState as b, Fragment as M } from "react";
+import ee from "lodash";
+import "../../buttons/DefaultButton.js";
+import P from "../../buttons/PrimaryButton.js";
+import U from "../../buttons/DangerButton.js";
+import B from "../../icons/index.js";
+import '../../assets/button.css';/* empty css                           */
+import te from "../base/InputTextBase.js";
+import se from "../../hint/index.js";
+import { ErrorMessage as ae } from "../errorMessage/index.js";
+const I = (i) => i != null && i.length ? ee.map(i, (n) => n) : [], g = (i) => i.split(",").map((n) => n.includes(".") ? n.split(".")[1] : n.split("/")[1]).join(", "), re = (i) => i.split(", "), xe = (i) => {
   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 => {
-    e.preventDefault?.();
-    e.stopPropagation?.();
-  };
-  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ões ${getAcceptFilesLabel(accept)} são 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?.(e);
-  };
-  const handleDragLeave = e => {
-    setMessage({
-      class: '',
-      text: titleDragDrop,
-      subtitle: subtitleDragDrop + getAcceptFilesLabel(accept),
-      error: false
+    id: n = Math.random().toString(36).substring(2, 7),
+    accept: o = "image/png, image/jpeg",
+    labelButton: w = "Selecionar",
+    subtitleDragDrop: u = "Selecione arquivos do tipo ",
+    titleDragDrop: f = "Arquivo para importação",
+    onBtnClickInsert: C,
+    inputRef: _,
+    onChange: m,
+    onDragEnter: N,
+    onDragOver: y,
+    onDragLeave: D,
+    onDrop: F,
+    showSubtitle: H = !0,
+    multiple: x = !1,
+    hint: S = [],
+    hintPosition: W = "below",
+    errorMessages: G = [],
+    skeletonize: A = !1
+  } = i, [J, R] = b(!1), [r, h] = b([]), [j, E] = b(!1), [p, d] = b({
+    class: "",
+    text: f,
+    subtitle: u + g(o),
+    error: !1
+  }), v = (e) => {
+    var s, a;
+    (s = e.preventDefault) == null || s.call(e), (a = e.stopPropagation) == null || a.call(e);
+  }, K = (e, s, a) => {
+    E(!1), s.forEach((l) => (!j && e.indexOf(l) === -1 && E(!0), j)), !x && (a.dataTransfer.items.length > 1 || r.length > 0) ? d({
+      class: "disapprovedFile",
+      text: "Não é permitido anexar mais de um arquivo.",
+      subtitle: "",
+      error: !0
+    }) : d(j ? {
+      class: "disapprovedFile",
+      text: "Por favor, verifique a extensão do(s) arquivo(s) inserido(s).",
+      subtitle: `Apenas as extensões ${g(o)} são permitidas.`,
+      error: !0
+    } : {
+      class: "approvedFile",
+      text: f,
+      subtitle: u + g(o),
+      error: !1
     });
-    handleDrag(e);
-    setDragActive(false);
-    onDragLeave?.(e);
-  };
-  const handleDragOver = e => {
-    handleDrag(e);
-    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?.(files, e);
-        onDrop?.(e);
+  }, Q = (e) => {
+    let s = [];
+    return e.dataTransfer.items && Array.from(e.dataTransfer.items).map((a) => (s.indexOf(a.type) === -1 && (s = [...s, a.type]), s)), s;
+  }, O = (e) => {
+    const s = re(o), a = Q(e);
+    K(s, a, e), v(e), R(!0), N == null || N(e);
+  }, $ = (e) => {
+    d({
+      class: "",
+      text: f,
+      subtitle: u + g(o),
+      error: !1
+    }), v(e), R(!1), D == null || D(e);
+  }, q = (e) => {
+    v(e), y == null || y(e);
+  }, z = (e) => {
+    v(e), R(!1);
+    const s = e.dataTransfer;
+    if (s && !p.error) {
+      const a = I(s.files);
+      if (a.length > 0) {
+        const l = r.concat(a), T = l.map((c) => c.name), L = l.filter(({ name: c }, k) => !T.includes(c, k + 1));
+        h(L), m == null || m(a, e), F == null || F(e);
       }
     }
-    setMessage({
-      class: '',
-      text: titleDragDrop,
-      subtitle: subtitleDragDrop + getAcceptFilesLabel(accept),
-      error: false
+    d({
+      class: "",
+      text: f,
+      subtitle: u + g(o),
+      error: !1
     });
-  };
-  const handleChange = e => {
-    e.preventDefault?.();
-    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?.(files, e);
+  }, V = (e) => {
+    var a;
+    (a = e.preventDefault) == null || a.call(e);
+    const s = I(e.target.files);
+    if (s.length > 0 && !j) {
+      const l = r.concat(s), T = l.map((c) => c.name), L = l.filter(({ name: c }, k) => !T.includes(c, k + 1));
+      h(L), m == null || m(s, e);
     }
-  };
-  const onButtonClickRemoveAll = () => setFileList([]);
-  const handleRemoveFile = fileName => {
-    setFileList(prevState => prevState.filter(file => file.name !== fileName));
-  };
-  const generateListArray = () => {
-    if (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: `${file.name}${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 ${skeletonize ? '-skeletonized' : ''}`
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: `${message.class} ${!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'
+  }, X = () => h([]), Y = (e) => {
+    h((s) => s.filter((a) => a.name !== e));
+  }, Z = () => (r == null ? void 0 : r.length) === 1 ? /* @__PURE__ */ t.jsxs(M, { children: [
+    r[0].type === "image/jpeg" || r[0].type === "image/png" ? /* @__PURE__ */ t.jsx("img", { alt: r[0].name, src: URL.createObjectURL(r[0]) }) : /* @__PURE__ */ t.jsx(B, { size: 64, name: "file_excel" }),
+    /* @__PURE__ */ t.jsx("div", { className: "image-preview-solo", children: /* @__PURE__ */ t.jsx("div", { className: "description-file", children: /* @__PURE__ */ t.jsx("span", { className: "subtitle", children: r[0].name }) }) })
+  ] }) : /* @__PURE__ */ t.jsx("ul", { className: "file-list", children: r.length > 0 && r.map((e) => /* @__PURE__ */ t.jsxs(
+    "li",
+    {
+      className: "file-card",
+      children: [
+        /* @__PURE__ */ t.jsx(
+          U,
+          {
+            transparent: !0,
+            boxShadow: !1,
+            className: "delete-button",
+            onClick: () => Y(e.name),
+            icon: /* @__PURE__ */ t.jsx(B, { customClass: "color-icon-upload", name: "close" })
+          }
+        ),
+        /* @__PURE__ */ t.jsx("div", { className: "image-content", children: (e.type === "image/jpeg" || e.type === "image/png") && /* @__PURE__ */ t.jsx(
+          "img",
+          {
+            alt: e.name,
+            className: "image-preview",
+            src: URL.createObjectURL(e)
+          }
+        ) }),
+        /* @__PURE__ */ t.jsx("div", { className: "description-file", children: /* @__PURE__ */ t.jsx("span", { className: "subtitle", children: e.name }) })
+      ]
     },
-    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
-  }));
+    `${e.name}${e.size}`
+  )) });
+  return /* @__PURE__ */ t.jsxs("div", { className: "input-dragdrop-container", onDragEnter: O, onSubmit: (e) => e.preventDefault(), children: [
+    /* @__PURE__ */ t.jsxs("div", { className: `drag-content ${A ? "-skeletonized" : ""}`, children: [
+      /* @__PURE__ */ t.jsx("div", { className: `${p.class} ${A ? "" : "content"}`, children: p.error || r.length === 0 ? /* @__PURE__ */ t.jsxs("label", { htmlFor: n, children: [
+        /* @__PURE__ */ t.jsx("h1", { className: "title", style: { paddingBottom: "20px" }, children: p.text }),
+        H && /* @__PURE__ */ t.jsx("p", { className: "subtitle", children: p.subtitle }),
+        !A && /* @__PURE__ */ t.jsx(P, { onClick: C, label: w })
+      ] }) : /* @__PURE__ */ t.jsxs(M, { children: [
+        Z(),
+        /* @__PURE__ */ t.jsxs("footer", { className: "footer-button-action", children: [
+          (!x && r.length < 1 || x) && /* @__PURE__ */ t.jsx(
+            P,
+            {
+              className: "selectButton",
+              onClick: C,
+              label: w
+            }
+          ),
+          /* @__PURE__ */ t.jsx(
+            U,
+            {
+              className: "cancelButton",
+              onClick: X,
+              icon: /* @__PURE__ */ t.jsx(B, { name: "close", color: "white" }),
+              label: "Limpar"
+            }
+          )
+        ] })
+      ] }) }),
+      /* @__PURE__ */ t.jsx(
+        te,
+        {
+          ...i,
+          inputRef: _,
+          style: { display: "none" },
+          type: "file",
+          id: n,
+          accept: o,
+          multiple: x,
+          onDragOver: q,
+          onDrop: z,
+          onDragLeave: $,
+          onChange: V
+        }
+      ),
+      J && /* @__PURE__ */ t.jsx(
+        "div",
+        {
+          className: "drag-position-element",
+          id: "dragFileElement",
+          onDragEnter: O,
+          onDragLeave: $,
+          onDragOver: q,
+          onDrop: z
+        }
+      )
+    ] }),
+    /* @__PURE__ */ t.jsx(ae, { messages: G }),
+    /* @__PURE__ */ t.jsx(se, { visible: !!S && W === "below", customClass: "hint", description: S })
+  ] });
+};
+export {
+  xe as default
 };
-var _default = exports.default = DragDropFile;