@pedidopago/ui 1.0.6

package/dist/components/Dropzone/index.js

@@ -0,0 +1,283 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = require("react");
+
+var _framerMotion = require("framer-motion");
+
+var _Icon = _interopRequireDefault(require("../Icon"));
+
+var _Flex = _interopRequireDefault(require("../Flex"));
+
+var _styles = require("./styles");
+
+var _accepts = require("./utils/accepts");
+
+var _generateUUID = require("../../utils/generateUUID");
+
+var _excluded = ["multiple", "onChange", "onDropAccepted", "onDropRejected", "accept", "onDragEnter", "onDragLeave", "disabled"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+var Dropzone = function Dropzone(_ref) {
+  var multiple = _ref.multiple,
+      onChange = _ref.onChange,
+      onDropAccepted = _ref.onDropAccepted,
+      onDropRejected = _ref.onDropRejected,
+      _ref$accept = _ref.accept,
+      accept = _ref$accept === void 0 ? '' : _ref$accept,
+      onDragEnter = _ref.onDragEnter,
+      onDragLeave = _ref.onDragLeave,
+      disabled = _ref.disabled,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  var _useState = (0, _react.useState)([]),
+      _useState2 = _slicedToArray(_useState, 2),
+      acceptedFiles = _useState2[0],
+      setAcceptedFiles = _useState2[1];
+
+  var _useState3 = (0, _react.useState)(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      isDragging = _useState4[0],
+      setIsDragging = _useState4[1];
+
+  var fileInputRef = (0, _react.useRef)(null);
+
+  function updateInputFiles(files) {
+    if (fileInputRef.current) {
+      var acceptedFilesFilter = new DataTransfer();
+      files.forEach(function (file) {
+        var newFile = new File([file.preview], file.name, {
+          type: file.type
+        });
+        acceptedFilesFilter.items.add(newFile);
+      });
+      fileInputRef.current.files = acceptedFilesFilter.files;
+    }
+  }
+
+  function addIdToFiles(files) {
+    var filesWithId = files.map(function (file) {
+      var newFile = file;
+      newFile.id = (0, _generateUUID.generateUUID)();
+      newFile.preview = URL.createObjectURL(file);
+      return newFile;
+    });
+    return filesWithId;
+  }
+
+  function handleUploadFile(files, isDropEvent) {
+    var filterAcceptedFiles = files.filter(function (file) {
+      return (0, _accepts.accepts)(file, accept);
+    });
+    var filterRejectedFiles = files.filter(function (file) {
+      return !(0, _accepts.accepts)(file, accept);
+    });
+    setAcceptedFiles(function (oldValue) {
+      var filesWithId = addIdToFiles(filterAcceptedFiles);
+      var mergedValues = [].concat(_toConsumableArray(oldValue), _toConsumableArray(filesWithId));
+      var newValue = multiple ? mergedValues : filesWithId;
+      updateInputFiles(newValue);
+
+      if (filterAcceptedFiles.length > 0 && fileInputRef.current) {
+        var allAcceptedFiles = Array.from(fileInputRef.current.files || []);
+        onChange === null || onChange === void 0 ? void 0 : onChange(allAcceptedFiles);
+        isDropEvent && (onDropAccepted === null || onDropAccepted === void 0 ? void 0 : onDropAccepted(filterAcceptedFiles));
+      }
+
+      if (isDropEvent && filterRejectedFiles.length > 0) {
+        onDropRejected === null || onDropRejected === void 0 ? void 0 : onDropRejected(filterRejectedFiles);
+      }
+
+      return newValue;
+    });
+  }
+
+  function handleDrop(e) {
+    e.preventDefault();
+    e.stopPropagation();
+    var files = Array.from(e.dataTransfer.files);
+    handleUploadFile(files, true);
+    setIsDragging(false);
+  }
+
+  function handleChange(e) {
+    var files = Array.from(e.target.files || []);
+    handleUploadFile(files);
+  }
+
+  function handleDragEnterLeave(e, type) {
+    e.preventDefault();
+    e.stopPropagation();
+
+    if (type === 'enter') {
+      setIsDragging(true);
+      onDragEnter === null || onDragEnter === void 0 ? void 0 : onDragEnter(e);
+    } else {
+      setIsDragging(false);
+      onDragLeave === null || onDragLeave === void 0 ? void 0 : onDragLeave(e);
+    }
+  }
+
+  function handleRemoveFile(fileId) {
+    var filteredFiles = acceptedFiles.filter(function (file) {
+      return file.id !== fileId;
+    });
+    setAcceptedFiles(filteredFiles);
+    onChange === null || onChange === void 0 ? void 0 : onChange(filteredFiles);
+
+    if (filteredFiles.length === 0 && fileInputRef.current) {
+      fileInputRef.current.value = '';
+      fileInputRef.current.files = null;
+    }
+  }
+
+  var dropzoneVariants = {
+    initial: {
+      opacity: 0,
+      scale: 0.8
+    },
+    visible: {
+      opacity: 1,
+      y: 0,
+      scale: 1
+    },
+    hidden: {
+      opacity: 0,
+      scale: 0.8
+    }
+  };
+  return /*#__PURE__*/React.createElement(_styles.DropzoneContainer, _extends({
+    isDraggingOver: isDragging,
+    haveItems: acceptedFiles.length > 0,
+    isDisabled: disabled
+  }, rest), /*#__PURE__*/React.createElement(_styles.DropzoneInput, {
+    ref: fileInputRef,
+    type: "file",
+    multiple: multiple,
+    accept: accept,
+    onChange: handleChange,
+    onDrop: handleDrop,
+    onDragEnter: function onDragEnter(event) {
+      return handleDragEnterLeave(event, 'enter');
+    },
+    onDragLeave: function onDragLeave(event) {
+      return handleDragEnterLeave(event, 'leave');
+    },
+    disabled: disabled
+  }), /*#__PURE__*/React.createElement(_framerMotion.AnimatePresence, null, acceptedFiles.length > 0 ? /*#__PURE__*/React.createElement(_Flex.default, {
+    alignItems: "center",
+    spacing: "4",
+    wrap: "wrap",
+    justifyContent: "center"
+  }, acceptedFiles.map(function (file) {
+    return /*#__PURE__*/React.createElement(_framerMotion.motion.div, {
+      key: file.id,
+      variants: dropzoneVariants,
+      initial: "initial",
+      animate: "visible",
+      exit: "hidden",
+      transition: {
+        duration: 0.2,
+        ease: 'easeInOut'
+      }
+    }, /*#__PURE__*/React.createElement(_styles.DropzoneFileBox, {
+      disabled: disabled
+    }, file.type.indexOf('image') !== -1 ? /*#__PURE__*/React.createElement("img", {
+      src: file.preview,
+      alt: file.name
+    }) : /*#__PURE__*/React.createElement(_Flex.default, {
+      direction: "column",
+      spacing: "2",
+      justifyContent: "center",
+      alignItems: "center",
+      style: {
+        maxWidth: '100%'
+      }
+    }, /*#__PURE__*/React.createElement(_Icon.default, {
+      name: file.type.split('/').includes('pdf') ? 'pdf' : file.type.split('/').includes('csv') ? 'csv' : file.type.split('/').includes('xls') ? 'xls' : 'file',
+      size: "30",
+      color: "neutral.black"
+    }), /*#__PURE__*/React.createElement(_styles.DropzoneText, {
+      isFileName: true
+    }, file.name)), /*#__PURE__*/React.createElement(_styles.DropzoneRemoveButton, {
+      onClick: function onClick() {
+        return !disabled && handleRemoveFile(file.id);
+      }
+    }, /*#__PURE__*/React.createElement(_Icon.default, {
+      name: "x",
+      color: "background.light",
+      size: 25
+    }))));
+  }), /*#__PURE__*/React.createElement(_styles.DropzoneImageAddButton, {
+    isDraggingOver: isDragging
+  }, /*#__PURE__*/React.createElement(_Icon.default, {
+    name: "plus-circle",
+    color: "neutral.neutral3"
+  }))) : /*#__PURE__*/React.createElement(_framerMotion.motion.div, {
+    variants: dropzoneVariants,
+    initial: "initial",
+    animate: "visible",
+    exit: "hidden",
+    transition: {
+      duration: 0.2,
+      ease: 'easeInOut'
+    }
+  }, /*#__PURE__*/React.createElement(_Flex.default, {
+    direction: "column",
+    spacing: "4",
+    alignItems: "center",
+    justifyContent: "center"
+  }, /*#__PURE__*/React.createElement(_framerMotion.motion.div, {
+    initial: {
+      opacity: 0,
+      y: 10
+    },
+    animate: {
+      opacity: 1,
+      y: 0
+    },
+    transition: {
+      duration: 0.2,
+      ease: 'easeInOut',
+      delay: 0.2
+    }
+  }, /*#__PURE__*/React.createElement(_styles.DropzoneIcon, null, /*#__PURE__*/React.createElement(_Icon.default, {
+    name: "arrow-up-circle",
+    size: 48,
+    color: "neutral.neutral5"
+  }))), /*#__PURE__*/React.createElement(_styles.DropzoneButton, null, "Selecionar um arquivo"), /*#__PURE__*/React.createElement(_styles.DropzoneText, null, "ou solte um arquivo aqui")))));
+};
+
+var _default = Dropzone;
+exports.default = _default;

package/dist/components/Dropzone/styles.d.ts

@@ -0,0 +1,47 @@
+/// <reference types="react" />
+export declare const DropzoneContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    isDraggingOver: boolean;
+    haveItems: boolean;
+    isDisabled?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const DropzoneInput: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    disabled?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {}>;
+export declare const DropzoneFileBox: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    disabled?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const DropzoneImageAddButton: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    isDraggingOver: boolean;
+}, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
+export declare const DropzoneRemoveButton: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
+export declare const DropzoneIcon: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const DropzoneText: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    isHiddenOnMobile?: boolean | undefined;
+    isFileName?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {}>;
+export declare const DropzoneButton: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
+//# sourceMappingURL=styles.d.ts.map

package/dist/components/Dropzone/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Dropzone/styles.ts"],"names":[],"mappings":";AAGA,eAAO,MAAM,iBAAiB;;;;oBACZ,OAAO;eACZ,OAAO;;yGA4CnB,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;kHAWzB,CAAC;AAEF,eAAO,MAAM,eAAe;;;;;yGAwC3B,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;;oBACjB,OAAO;qHAmCxB,CAAC;AAEF,eAAO,MAAM,oBAAoB;;;qHA8BhC,CAAC;AAEF,eAAO,MAAM,YAAY;;;yGAUxB,CAAC;AAEF,eAAO,MAAM,YAAY;;;;;;qHA6BxB,CAAC;AAEF,eAAO,MAAM,cAAc;;;qHAiB1B,CAAC"}

package/dist/components/Dropzone/styles.js

@@ -0,0 +1,94 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DropzoneText = exports.DropzoneRemoveButton = exports.DropzoneInput = exports.DropzoneImageAddButton = exports.DropzoneIcon = exports.DropzoneFileBox = exports.DropzoneContainer = exports.DropzoneButton = void 0;
+
+var _react = require("@emotion/react");
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
+var DropzoneContainer = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  position: relative;\n  flex-direction: column;\n  justify-content: ", ";\n  align-items: ", ";\n  flex-wrap: wrap;\n\n  ", "\n\n  ", "\n\n  &:after {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background: black;\n    border-radius: 8px;\n    pointer-events: none;\n    visibility: hidden;\n    opacity: 0;\n  }\n\n  ", "\n"])), function (props) {
+  return props.haveItems ? 'flex-start' : 'center';
+}, function (props) {
+  return props.haveItems ? 'flex-start' : 'center';
+}, function (props) {
+  return props.isDisabled && 'opacity: 0.5;';
+}, function (props) {
+  return !props.haveItems && "\n    padding: 3.875rem 1.625rem;\n    border: 2px dashed ".concat(props.theme.colors.neutral.neutral3, ";\n    border-radius: 8px;\n  ");
+}, function (props) {
+  return props.isDraggingOver && !props.haveItems && !props.isDisabled && (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      &:after {\n        opacity: 0.1;\n        visibility: visible;\n      }\n    "])));
+});
+
+exports.DropzoneContainer = DropzoneContainer;
+
+var DropzoneInput = _styled.default.input(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  opacity: 0;\n  cursor: ", ";\n  z-index: ", ";\n"])), function (props) {
+  return props.disabled ? 'default' : 'pointer';
+}, function (props) {
+  return props.theme.zIndex.default;
+});
+
+exports.DropzoneInput = DropzoneInput;
+
+var DropzoneFileBox = _styled.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  position: relative;\n  justify-content: center;\n  align-items: center;\n  width: 80px;\n  height: 80px;\n  border-radius: 8px;\n\n  & > img {\n    width: 100%;\n    height: 100%;\n    border-radius: 8px;\n    object-fit: cover;\n  }\n\n  ", "\n\n  @media screen and (min-width: ", ") {\n    width: 100px;\n    height: 100px;\n  }\n\n  @media screen and (min-width: ", ") {\n    width: 160px;\n    height: 160px;\n  }\n"])), function (props) {
+  return props.disabled ? "\n        & > button {\n          display: none;\n        }\n      " : "\n        &:hover > button {\n          opacity: 1;\n        }\n      ";
+}, function (props) {
+  return props.theme.breakpoints.sm;
+}, function (props) {
+  return props.theme.breakpoints.md;
+});
+
+exports.DropzoneFileBox = DropzoneFileBox;
+
+var DropzoneImageAddButton = _styled.default.button(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 80px;\n  height: 80px;\n  border-radius: 8px;\n  outline: 0;\n\n  transition: all 0.3s ease-in-out;\n\n  border: 2px dashed\n    ", ";\n  background: ", ";\n\n  @media screen and (min-width: ", ") {\n    width: 100px;\n    height: 100px;\n  }\n\n  @media screen and (min-width: ", ") {\n    width: 160px;\n    height: 160px;\n  }\n"])), function (props) {
+  return props.theme.colorMode === 'light' ? props.theme.colors.neutral.neutral3 : props.theme.colors.neutral.neutral4;
+}, function (props) {
+  return props.isDraggingOver ? props.theme.colorMode === 'light' ? props.theme.colors.neutral.neutral2 : props.theme.colors.neutral.neutral3 : props.theme.colorMode === 'light' ? props.theme.colors.neutral.neutral1 : props.theme.colors.neutral.neutral6;
+}, function (props) {
+  return props.theme.breakpoints.sm;
+}, function (props) {
+  return props.theme.breakpoints.md;
+});
+
+exports.DropzoneImageAddButton = DropzoneImageAddButton;
+
+var DropzoneRemoveButton = _styled.default.button(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: absolute;\n  z-index: ", ";\n  opacity: 0;\n  top: 0;\n  right: 0;\n  outline: 0;\n  border: 0;\n  width: 100%;\n  height: 100%;\n  border-radius: 8px;\n  background: rgba(0, 0, 0, 0.7);\n  cursor: pointer;\n  transition: all 150ms ease-out;\n\n  & > svg {\n    transition: transform 200ms ease-out;\n    transform: translateY(10px);\n    opacity: 0;\n  }\n\n  &:hover {\n    & > svg {\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n"])), function (props) {
+  return props.theme.zIndex.level2;
+});
+
+exports.DropzoneRemoveButton = DropzoneRemoveButton;
+
+var DropzoneIcon = _styled.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  display: block;\n\n  @media screen and (min-width: ", ") {\n    display: none;\n  }\n\n  @media screen and (min-width: ", ") {\n    display: block;\n  }\n"])), function (props) {
+  return props.theme.breakpoints.sm;
+}, function (props) {
+  return props.theme.breakpoints.md;
+});
+
+exports.DropzoneIcon = DropzoneIcon;
+
+var DropzoneText = _styled.default.p(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  font-family: inherit;\n  text-align: center;\n  font-size: 1rem;\n  text-align: center;\n  margin: 0;\n  padding: 0;\n  color: ", ";\n\n  ", "\n\n  ", "\n"])), function (props) {
+  return props.theme.colors.neutral.neutral2;
+}, function (props) {
+  return props.isFileName && (0, _react.css)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n      max-width: 70%;\n      text-overflow: ellipsis;\n      overflow: hidden;\n    "])));
+}, function (props) {
+  return props.isHiddenOnMobile && (0, _react.css)(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n      display: none;\n\n      @media screen and (min-width: ", ") {\n        display: block;\n      }\n    "])), props.theme.breakpoints.sm);
+});
+
+exports.DropzoneText = DropzoneText;
+
+var DropzoneButton = _styled.default.button(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n  font-family: inherit;\n  font-weight: 600;\n  font-size: 1rem;\n  padding: 0.875rem 1.5rem;\n  border-radius: 0.5rem;\n  background-color: transparent;\n  color: ", ";\n  border: 2px solid ", ";\n  display: none;\n\n  @media screen and (min-width: ", ") {\n    display: block;\n  }\n"])), function (props) {
+  return props.theme.colorMode === 'light' ? props.theme.colors.neutral.black : props.theme.colors.neutral.white;
+}, function (props) {
+  return props.theme.colors.neutral.neutral2;
+}, function (props) {
+  return props.theme.breakpoints.sm;
+});
+
+exports.DropzoneButton = DropzoneButton;

package/dist/components/Dropzone/types.d.ts

@@ -0,0 +1,20 @@
+import { HTMLAttributes, DragEvent as ReactDragEvent } from 'react';
+import { ExtendThemeProps } from './../../shared/theme/theme.types';
+export declare type DropzoneProps = HTMLAttributes<HTMLDivElement> & {
+    multiple?: boolean;
+    disabled?: boolean;
+    accept?: string;
+    onChange?: (acceptedFiles: File[]) => void;
+    onDropAccepted?: (files: File[]) => void;
+    onDropRejected?: (files: File[]) => void;
+    onDragEnter?: (event: ReactDragEvent<HTMLDivElement>) => void;
+    onDragLeave?: (event: ReactDragEvent<HTMLDivElement>) => void;
+};
+export declare type GenericStyledProps = {
+    theme?: ExtendThemeProps;
+};
+export declare type FileProps = File & {
+    id: string;
+    preview: string;
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/components/Dropzone/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Dropzone/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,IAAI,cAAc,EAAE,MAAM,OAAO,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AAEpE,oBAAY,aAAa,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,CAAC,aAAa,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IAC3C,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IACzC,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IACzC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC9D,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;CAC/D,CAAC;AAEF,oBAAY,kBAAkB,GAAG;IAC/B,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC1B,CAAC;AAEF,oBAAY,SAAS,GAAG,IAAI,GAAG;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;CACjB,CAAC"}

package/dist/components/Dropzone/types.js

@@ -0,0 +1 @@
+"use strict";

package/dist/components/Dropzone/utils/accepts.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Verify if the given file can be accepted by the dropzone.
+ *
+ * Code abstration of: https://github.com/react-dropzone/attr-accept
+ *
+ * @param file The file to verify
+ * @param acceptedFiles The accepted files
+ * @returns true if the file can be accepted, false otherwise
+ */
+export declare const accepts: (file: File, acceptedFormats: string) => boolean;
+//# sourceMappingURL=accepts.d.ts.map

package/dist/components/Dropzone/utils/accepts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accepts.d.ts","sourceRoot":"","sources":["../../../../src/components/Dropzone/utils/accepts.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AACH,eAAO,MAAM,OAAO,SAAU,IAAI,mBAAmB,MAAM,KAAG,OAyB7D,CAAC"}

package/dist/components/Dropzone/utils/accepts.js

@@ -0,0 +1,39 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.accepts = void 0;
+
+/**
+ * Verify if the given file can be accepted by the dropzone.
+ *
+ * Code abstration of: https://github.com/react-dropzone/attr-accept
+ *
+ * @param file The file to verify
+ * @param acceptedFiles The accepted files
+ * @returns true if the file can be accepted, false otherwise
+ */
+var accepts = function accepts(file, acceptedFormats) {
+  if (file && acceptedFormats) {
+    var acceptedFiles = acceptedFormats.split(',');
+    var fileName = file.name || '';
+    var mimeType = file.type || '';
+    var baseMimeType = mimeType.replace(/\/.*$/, '');
+    return acceptedFiles.some(function (type) {
+      var validType = type.trim();
+
+      if (validType.charAt(0) === '.') {
+        return fileName.toLowerCase().indexOf(validType.toLowerCase(), fileName.toLowerCase().length - validType.toLowerCase().length) !== -1;
+      } else if (/\/\*$/.test(validType)) {
+        return baseMimeType === validType.replace(/\/.*$/, '');
+      }
+
+      return mimeType === validType;
+    });
+  }
+
+  return true;
+};
+
+exports.accepts = accepts;

package/dist/components/Flex/flex.test.d.ts

@@ -0,0 +1,2 @@
+import '@testing-library/jest-dom';
+//# sourceMappingURL=flex.test.d.ts.map

package/dist/components/Flex/flex.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"flex.test.d.ts","sourceRoot":"","sources":["../../../src/components/Flex/flex.test.tsx"],"names":[],"mappings":"AAIA,OAAO,2BAA2B,CAAC"}