@tecsinapse/cortex-react 1.6.0 → 1.7.0-beta.0

package/dist/cjs/index.js

@@ -26,7 +26,7 @@ var Loading = require('./components/Loading.js');
 var index$1 = require('./components/Menubar/index.js');
 var Modal = require('./components/Modal.js');
 var index$2 = require('./components/Popover/index.js');
-var ProgressBar = require('./components/ProgressBar.js');
+var ProgressBar = require('./components/ProgressBar/ProgressBar.js');
 var RadioButton = require('./components/RadioButton.js');
 var index$3 = require('./components/Select/index.js');
 var Skeleton = require('./components/Skeleton.js');
@@ -39,6 +39,7 @@ var TimeField = require('./components/TimeField/TimeField.js');
 var TimeFieldInput = require('./components/TimeField/TimeFieldInput.js');
 var Toggle = require('./components/Toggle.js');
 var Tooltip = require('./components/Tooltip.js');
+var index$5 = require('./components/Uploader/index.js');
 var useCalendar = require('./hooks/useCalendar.js');
 var useCalendarCell = require('./hooks/useCalendarCell.js');
 var useCalendarGrid = require('./hooks/useCalendarGrid.js');
@@ -52,12 +53,15 @@ var useRangeCalendar = require('./hooks/useRangeCalendar.js');
 var useSelectGroupedOptions = require('./hooks/useSelectGroupedOptions.js');
 var useSelectOptions = require('./hooks/useSelectOptions.js');
 var useStringMask = require('./hooks/useStringMask.js');
+var useFileUpload = require('./hooks/useFileUpload.js');
 var SnackbarSonner = require('./service/SnackbarSonner.js');
 var MenubarProvider = require('./provider/MenubarProvider.js');
 var SnackbarProvider = require('./provider/SnackbarProvider.js');
 var MenubarContext = require('./provider/MenubarContext.js');
 var useMenubar = require('./provider/useMenubar.js');
 var masks = require('./components/Input/masks.js');
+var Root = require('./components/Uploader/Root.js');
+var types = require('./components/Uploader/types.js');
 
 
 
@@ -109,6 +113,7 @@ exports.TimeField = TimeField.TimeField;
 exports.TimeFieldInput = TimeFieldInput.TimeFieldInput;
 exports.Toggle = Toggle.Toggle;
 exports.Tooltip = Tooltip.Tooltip;
+exports.Uploader = index$5.Uploader;
 exports.useCalendar = useCalendar.useCalendar;
 exports.useCalendarCell = useCalendarCell.useCalendarCell;
 exports.useCalendarGrid = useCalendarGrid.useCalendarGrid;
@@ -125,6 +130,7 @@ exports.useSelectOptions = useSelectOptions.useSelectOptions;
 exports.getMask = useStringMask.getMask;
 exports.mergeMask = useStringMask.mergeMask;
 exports.useStringMask = useStringMask.useStringMask;
+exports.useFileUpload = useFileUpload.useFileUpload;
 exports.SnackbarSonner = SnackbarSonner.SnackbarSonner;
 exports.MenubarProvider = MenubarProvider.MenubarProvider;
 exports.SnackbarProvider = SnackbarProvider.SnackbarProvider;
@@ -138,3 +144,6 @@ exports.Masks = masks.Masks;
 exports.NumberIMask = masks.NumberIMask;
 exports.PercentageIMask = masks.PercentageIMask;
 exports.PercentageMask = masks.PercentageMask;
+exports.Root = Root.Root;
+exports.AcceptSpecificMap = types.AcceptSpecificMap;
+exports.FileStatus = types.FileStatus;

package/dist/cjs/provider/MenubarProvider.js

@@ -7,6 +7,8 @@ require('react-stately');
 require('@floating-ui/react');
 require('currency.js');
 var useOutsideClickListener = require('../hooks/useOutsideClickListener.js');
+require('react-dropzone');
+require('uuid');
 var MenubarContext = require('./MenubarContext.js');
 
 const MenubarProvider = ({ children }) => {

package/dist/cjs/styles/progressBar.js

@@ -10,12 +10,43 @@ const progressBarFilled = tailwindVariants.tv({
       error: "bg-error-medium",
       info: "bg-info-medium",
       warning: "bg-warning-medium",
-      success: "bg-success-medium"
+      success: "bg-success-medium",
+      uploading: ""
     },
     showAnimation: {
       true: "transition-[width] duration-1000 ease-linear"
     }
   }
 });
+const progressBarInfiniteVariants = tailwindVariants.tv({
+  slots: {
+    container: "relative mb-mili",
+    bar: "h-1.5 w-full overflow-hidden",
+    progress: "w-full h-full origin-left-right rounded-b-mili"
+  },
+  variants: {
+    status: {
+      uploading: {
+        progress: "bg-info-medium animate-progress"
+      },
+      success: {
+        progress: "bg-success-medium"
+      },
+      error: {
+        progress: "bg-error-medium"
+      },
+      default: {
+        progress: "bg-primary-medium"
+      },
+      info: {
+        progress: "bg-info-medium"
+      },
+      warning: {
+        progress: "bg-warning-medium"
+      }
+    }
+  }
+});
 
 exports.progressBarFilled = progressBarFilled;
+exports.progressBarInfiniteVariants = progressBarInfiniteVariants;

package/dist/esm/components/Calendar/Calendar.js

@@ -5,6 +5,8 @@ import 'react-aria';
 import 'react-stately';
 import '@floating-ui/react';
 import 'currency.js';
+import 'react-dropzone';
+import 'uuid';
 import { CalendarGrid } from './CalendarGrid.js';
 import { CalendarHeader } from './CalendarHeader.js';
 

package/dist/esm/components/Calendar/CalendarCell.js

@@ -5,6 +5,8 @@ import 'react-stately';
 import { useCalendarCell } from '../../hooks/useCalendarCell.js';
 import '@floating-ui/react';
 import 'currency.js';
+import 'react-dropzone';
+import 'uuid';
 import { calendarCell } from '../../styles/calendar-cell.js';
 import '../../styles/groupButton.js';
 import '../../styles/progressBar.js';

package/dist/esm/components/Calendar/CalendarGrid.js

@@ -5,6 +5,8 @@ import 'react-stately';
 import { useCalendarGrid } from '../../hooks/useCalendarGrid.js';
 import '@floating-ui/react';
 import 'currency.js';
+import 'react-dropzone';
+import 'uuid';
 import { CalendarGridBodyRows } from './CalendarGridBodyRows.js';
 import { CalendarGridHeaderRow } from './CalendarGridHeaderRow.js';
 

package/dist/esm/components/Calendar/RangeCalendar.js

@@ -5,6 +5,8 @@ import 'react-stately';
 import '@floating-ui/react';
 import 'currency.js';
 import { useRangeCalendar } from '../../hooks/useRangeCalendar.js';
+import 'react-dropzone';
+import 'uuid';
 import { CalendarGrid } from './CalendarGrid.js';
 import { CalendarHeader } from './CalendarHeader.js';
 

package/dist/esm/components/DatePicker/DatePickerInput.js

@@ -6,6 +6,8 @@ import { dateToCalendarDate } from '../utils.js';
 import { useDatePickerInput } from '../../hooks/useDatePickerInput.js';
 import '@floating-ui/react';
 import 'currency.js';
+import 'react-dropzone';
+import 'uuid';
 import { Calendar } from '../Calendar/Calendar.js';
 import { DateField } from './DateField.js';
 import { DatePickerInputBase } from './DatePickerInputBase.js';

package/dist/esm/components/DatePicker/DateRangePickerInput.js

@@ -6,6 +6,8 @@ import { dateToCalendarDate } from '../utils.js';
 import { useDateRangePickerInput } from '../../hooks/useDateRangePickerInput.js';
 import '@floating-ui/react';
 import 'currency.js';
+import 'react-dropzone';
+import 'uuid';
 import { RangeCalendar } from '../Calendar/RangeCalendar.js';
 import { DateField } from './DateField.js';
 import { DatePickerInputBase } from './DatePickerInputBase.js';

package/dist/esm/components/Input/Mask.js

@@ -5,6 +5,8 @@ import 'react-stately';
 import '@floating-ui/react';
 import { useNumberMask } from '../../hooks/useNumberMask.js';
 import { useStringMask } from '../../hooks/useStringMask.js';
+import 'react-dropzone';
+import 'uuid';
 import { InputRoot } from './Root.js';
 
 const InputMask = React__default.forwardRef(

package/dist/esm/components/Input/Search.js

@@ -6,6 +6,8 @@ import 'react-stately';
 import { useDebouncedState } from '../../hooks/useDebouncedState.js';
 import '@floating-ui/react';
 import 'currency.js';
+import 'react-dropzone';
+import 'uuid';
 import { InputBox } from './Box.js';
 import { InputFace } from './Face.js';
 import { InputLeft } from './Left.js';

package/dist/esm/components/Menubar/Dropdown.js

@@ -6,6 +6,8 @@ import 'react-aria';
 import 'react-stately';
 import '@floating-ui/react';
 import 'currency.js';
+import 'react-dropzone';
+import 'uuid';
 import '../../provider/MenubarContext.js';
 import '../../provider/SnackbarProvider.js';
 import { useMenubar } from '../../provider/useMenubar.js';

package/dist/esm/components/Menubar/Header.js

@@ -5,6 +5,8 @@ import 'react-aria';
 import 'react-stately';
 import '@floating-ui/react';
 import 'currency.js';
+import 'react-dropzone';
+import 'uuid';
 import '../../provider/MenubarContext.js';
 import '../../provider/SnackbarProvider.js';
 import { useMenubar } from '../../provider/useMenubar.js';

package/dist/esm/components/Menubar/ItemLink.js

@@ -5,6 +5,8 @@ import 'react-aria';
 import 'react-stately';
 import '@floating-ui/react';
 import 'currency.js';
+import 'react-dropzone';
+import 'uuid';
 import '../../provider/MenubarContext.js';
 import '../../provider/SnackbarProvider.js';
 import { useMenubar } from '../../provider/useMenubar.js';

package/dist/esm/components/Menubar/Search.js

@@ -7,6 +7,8 @@ import 'react-aria';
 import 'react-stately';
 import '@floating-ui/react';
 import 'currency.js';
+import 'react-dropzone';
+import 'uuid';
 import '../../provider/MenubarContext.js';
 import '../../provider/SnackbarProvider.js';
 import { useMenubar } from '../../provider/useMenubar.js';

package/dist/esm/components/Popover/Provider.js

@@ -4,6 +4,8 @@ import 'react-aria';
 import 'react-stately';
 import { useFloatingLogic } from '../../hooks/useFloatingLogic.js';
 import 'currency.js';
+import 'react-dropzone';
+import 'uuid';
 import { Context } from './Context.js';
 
 const PopoverProvider = ({

package/dist/esm/components/ProgressBar/ProgressBar.js

@@ -0,0 +1,39 @@
+import React__default, { useState, useEffect } from 'react';
+import { ProgressBarInfinite } from './ProgressBarInfinite.js';
+import { ProgressBarSegments } from './ProgressBarSegments.js';
+
+const ProgressBar = ({
+  segments: _segments = 1,
+  valueMin = 0,
+  valueMax = 100,
+  valueCurrent = 50,
+  intentProgress = "default",
+  type = "default",
+  animated = true
+}) => {
+  const [displayedValue, setDisplayedValue] = useState(0);
+  const [showAnimation, setShowAnimation] = useState(true);
+  useEffect(() => {
+    const timeout = setTimeout(() => {
+      if (valueCurrent < displayedValue) {
+        setShowAnimation(false);
+      }
+      if (animated && valueCurrent > displayedValue) setShowAnimation(true);
+      setDisplayedValue(valueCurrent);
+    }, 0);
+    return () => clearTimeout(timeout);
+  }, [valueCurrent]);
+  const totalProgress = (displayedValue - valueMin) / (valueMax - valueMin) * 100;
+  const segments = Math.max(1, _segments);
+  return type === "infinite" ? /* @__PURE__ */ React__default.createElement(ProgressBarInfinite, { intentProgress }) : /* @__PURE__ */ React__default.createElement(
+    ProgressBarSegments,
+    {
+      segments,
+      totalProgress,
+      intentProgress,
+      showAnimation
+    }
+  );
+};
+
+export { ProgressBar };

package/dist/esm/components/ProgressBar/ProgressBarInfinite.js

@@ -0,0 +1,13 @@
+import React__default from 'react';
+import '../../styles/calendar-cell.js';
+import '../../styles/groupButton.js';
+import { progressBarInfiniteVariants } from '../../styles/progressBar.js';
+
+const { container, bar, progress } = progressBarInfiniteVariants();
+const ProgressBarInfinite = ({
+  intentProgress
+}) => {
+  return /* @__PURE__ */ React__default.createElement("div", { className: container() }, /* @__PURE__ */ React__default.createElement("div", { className: bar(), "data-testid": "infinite-progress-bar" }, /* @__PURE__ */ React__default.createElement("div", { className: progress({ status: intentProgress }) })));
+};
+
+export { ProgressBarInfinite };

package/dist/esm/components/ProgressBar/ProgressBarSegments.js

@@ -0,0 +1,46 @@
+import React__default, { useCallback } from 'react';
+import '../../styles/calendar-cell.js';
+import '../../styles/groupButton.js';
+import { progressBarFilled } from '../../styles/progressBar.js';
+
+const ProgressBarSegments = ({
+  segments,
+  totalProgress,
+  intentProgress,
+  showAnimation
+}) => {
+  const lengthSeg = 100 / segments;
+  const items = [...Array(segments).keys()];
+  const progressStyle = useCallback(
+    (width, index) => {
+      return {
+        width: `${width}%`,
+        transitionDelay: `${showAnimation ? `${index * 1e3}ms` : `0ms`}`
+      };
+    },
+    [showAnimation]
+  );
+  return /* @__PURE__ */ React__default.createElement("div", { className: "flex gap-x-nano flex-row", "data-testid": "progress-bar" }, items.map((_, index) => {
+    const max = lengthSeg * (index + 1);
+    const min = lengthSeg * index;
+    const minmax = (totalProgress - min) / (max - min);
+    const width = (minmax > 1 ? 1 : minmax < 0 ? 0 : minmax) * 100;
+    return /* @__PURE__ */ React__default.createElement(
+      "div",
+      {
+        key: index,
+        className: "h-[0.5rem] bg-secondary-light flex flex-1 first:rounded-l-pill last:rounded-r-pill"
+      },
+      /* @__PURE__ */ React__default.createElement(
+        "div",
+        {
+          style: progressStyle(width, index),
+          "data-testid": "div-segment-filled",
+          className: progressBarFilled({ intentProgress, showAnimation })
+        }
+      )
+    );
+  }));
+};
+
+export { ProgressBarSegments };

package/dist/esm/components/Select/GroupedOptions.js

@@ -6,6 +6,8 @@ import 'react-stately';
 import '@floating-ui/react';
 import 'currency.js';
 import { useSelectGroupedOptions } from '../../hooks/useSelectGroupedOptions.js';
+import 'react-dropzone';
+import 'uuid';
 import { usePopoverContext } from '../Popover/Context.js';
 import { SelectOption } from './Option.js';
 import { SkeletonOptions } from './SkeletonOptions.js';

package/dist/esm/components/Select/MultiGroupedOptions.js

@@ -6,6 +6,8 @@ import 'react-stately';
 import '@floating-ui/react';
 import 'currency.js';
 import { useSelectGroupedOptions } from '../../hooks/useSelectGroupedOptions.js';
+import 'react-dropzone';
+import 'uuid';
 import { SelectMultiOption } from './MultiOption.js';
 import { SkeletonOptions } from './SkeletonOptions.js';
 import { SelectContext, SelectMultiOptionsContext } from './context.js';

package/dist/esm/components/Select/MultiOptions.js

@@ -6,6 +6,8 @@ import 'react-stately';
 import '@floating-ui/react';
 import 'currency.js';
 import { useSelectOptions } from '../../hooks/useSelectOptions.js';
+import 'react-dropzone';
+import 'uuid';
 import { SelectMultiOption } from './MultiOption.js';
 import { SkeletonOptions } from './SkeletonOptions.js';
 import { SelectContext, SelectMultiOptionsContext } from './context.js';

package/dist/esm/components/Select/Options.js

@@ -6,6 +6,8 @@ import 'react-stately';
 import '@floating-ui/react';
 import 'currency.js';
 import { useSelectOptions } from '../../hooks/useSelectOptions.js';
+import 'react-dropzone';
+import 'uuid';
 import { usePopoverContext } from '../Popover/Context.js';
 import { SelectOption } from './Option.js';
 import { SkeletonOptions } from './SkeletonOptions.js';

package/dist/esm/components/Tooltip.js

@@ -6,6 +6,8 @@ import 'react-stately';
 import { cloneWithProps } from './utils.js';
 import { useFloatingLogic } from '../hooks/useFloatingLogic.js';
 import 'currency.js';
+import 'react-dropzone';
+import 'uuid';
 
 const Tooltip = forwardRef(
   (props, ref) => {

package/dist/esm/components/Uploader/Dropzone.js

@@ -0,0 +1,28 @@
+import React__default from 'react';
+import { HiOutlineCloudArrowUp } from 'react-icons/hi2';
+import { button } from '@tecsinapse/cortex-core';
+import clsx from 'clsx';
+
+const Dropzone = ({
+  dropzoneProps,
+  selectFileText = "Select a file to start",
+  dropText = "By dragging and dropping it here or clicking the button below",
+  buttonText = "Select File"
+}) => {
+  return /* @__PURE__ */ React__default.createElement(
+    "div",
+    {
+      ...dropzoneProps.getRootProps(),
+      className: clsx(
+        "bg-white w-full border-dashed border-2 p-deca flex flex-col justify-center rounded-mili",
+        {
+          "border-success-medium bg-gray-100": dropzoneProps.isDragActive
+        }
+      )
+    },
+    /* @__PURE__ */ React__default.createElement("input", { ...dropzoneProps.getInputProps() }),
+    /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col justify-center text-center items-center gap-deca" }, /* @__PURE__ */ React__default.createElement(HiOutlineCloudArrowUp, { className: "text-primary-medium", size: 35 }), /* @__PURE__ */ React__default.createElement("div", { className: "gap-mili" }, /* @__PURE__ */ React__default.createElement("p", { className: "text-lg font-semibold", "data-testid": "select-dropzone" }, selectFileText), /* @__PURE__ */ React__default.createElement("p", { className: "text-sm text-secondary-medium" }, dropText)), /* @__PURE__ */ React__default.createElement("button", { className: button() }, buttonText))
+  );
+};
+
+export { Dropzone };

package/dist/esm/components/Uploader/Files.js

@@ -0,0 +1,12 @@
+import React__default from 'react';
+import { File } from './Upload.js';
+
+const Files = ({
+  files,
+  onDelete,
+  uploadProgressText = "Upload(s) in progress"
+}) => {
+  return /* @__PURE__ */ React__default.createElement("div", { className: "bg-white w-full border-2 p-deca flex flex-col overflow-y-auto rounded-mili" }, /* @__PURE__ */ React__default.createElement("div", { className: "flex gap-mili items-center mb-deca" }, /* @__PURE__ */ React__default.createElement("div", { className: "flex items-center justify-center w-deca h-deca bg-primary-medium rounded-full text-micro text-white" }, `${files.length}`), /* @__PURE__ */ React__default.createElement("h2", { className: "text-md font-semibold", "data-testid": "upload-progress" }, uploadProgressText)), files.map((file, index) => /* @__PURE__ */ React__default.createElement(File, { key: file.uid, file, index, onDelete })));
+};
+
+export { Files };

package/dist/esm/components/Uploader/Modal.js

@@ -0,0 +1,36 @@
+import React__default from 'react';
+import { MdClose } from 'react-icons/md';
+import { button } from '@tecsinapse/cortex-core';
+import { Modal as Modal$1 } from '../Modal.js';
+import { createPortal } from 'react-dom';
+
+const Modal = ({
+  open,
+  onClose,
+  children,
+  title = "File Upload"
+}) => {
+  return createPortal(
+    /* @__PURE__ */ React__default.createElement(
+      Modal$1,
+      {
+        open,
+        onClose,
+        className: "flex-col w-[70%] h-[50%] bg-secondary-xlight rounded-mili"
+      },
+      /* @__PURE__ */ React__default.createElement("div", { className: "flex w-full items-center justify-between mb-deca" }, /* @__PURE__ */ React__default.createElement("div", null), /* @__PURE__ */ React__default.createElement("h2", { className: "text-deca font-semibold" }, title), /* @__PURE__ */ React__default.createElement(
+        "button",
+        {
+          className: button({ size: "square" }),
+          onClick: onClose,
+          "data-testid": "close-button"
+        },
+        /* @__PURE__ */ React__default.createElement(MdClose, { size: 20 })
+      )),
+      /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col md:flex-row w-full h-full max-h-[85%] gap-deca" }, children)
+    ),
+    document.body
+  );
+};
+
+export { Modal };

package/dist/esm/components/Uploader/Root.js

@@ -0,0 +1,36 @@
+import React__default from 'react';
+import { Modal } from './Modal.js';
+import { Dropzone } from './Dropzone.js';
+import { Files } from './Files.js';
+
+const Root = ({
+  open,
+  onClose,
+  files,
+  onDelete,
+  dropzoneProps,
+  selectFileText,
+  dropText,
+  buttonText,
+  uploadProgressText,
+  titleModal
+}) => {
+  return /* @__PURE__ */ React__default.createElement(Modal, { onClose, open, title: titleModal }, /* @__PURE__ */ React__default.createElement(
+    Dropzone,
+    {
+      dropzoneProps,
+      selectFileText,
+      dropText,
+      buttonText
+    }
+  ), /* @__PURE__ */ React__default.createElement(
+    Files,
+    {
+      files,
+      onDelete,
+      uploadProgressText
+    }
+  ));
+};
+
+export { Root };

package/dist/esm/components/Uploader/Upload.js

@@ -0,0 +1,29 @@
+import React__default from 'react';
+import { FaRegFileLines } from 'react-icons/fa6';
+import { button } from '@tecsinapse/cortex-core';
+import { MdClose } from 'react-icons/md';
+import { ProgressBar } from '../ProgressBar/ProgressBar.js';
+
+const File = ({ file, index, onDelete }) => {
+  return /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col", key: index }, /* @__PURE__ */ React__default.createElement("div", { className: "flex items-center justify-between border rounded-t-mili shadow p-mili" }, /* @__PURE__ */ React__default.createElement("div", { className: "flex gap-centi" }, file.file && file.file.type.startsWith("image/") ? /* @__PURE__ */ React__default.createElement(
+    "img",
+    {
+      src: URL.createObjectURL(file.file),
+      alt: "Preview",
+      className: "w-tera h-tera rounded-mili"
+    }
+  ) : /* @__PURE__ */ React__default.createElement("span", { className: "border-2 text-kilo text-primary-medium w-tera h-tera flex items-center justify-center rounded-mili" }, /* @__PURE__ */ React__default.createElement(FaRegFileLines, null)), /* @__PURE__ */ React__default.createElement("div", { className: "flex-col" }, /* @__PURE__ */ React__default.createElement("p", { className: "font-semibold truncate max-w-[200px]" }, file.file.name), /* @__PURE__ */ React__default.createElement("p", { className: "text-sm text-gray-500" }, (file.file.size / 1024).toFixed(2), " KB"))), file.status === "success" && /* @__PURE__ */ React__default.createElement(
+    "button",
+    {
+      onClick: () => onDelete(index),
+      "data-testid": "remove-button",
+      className: button({
+        className: " bg-inherit border-2 border-primary-light text-primary-light",
+        size: "small"
+      })
+    },
+    /* @__PURE__ */ React__default.createElement(MdClose, { size: 20 })
+  )), /* @__PURE__ */ React__default.createElement(ProgressBar, { intentProgress: file.status, type: "infinite" }));
+};
+
+export { File };

package/dist/esm/components/Uploader/index.js

@@ -0,0 +1,13 @@
+import { Dropzone } from './Dropzone.js';
+import { Files } from './Files.js';
+import { Modal } from './Modal.js';
+import { Root } from './Root.js';
+
+const Uploader = {
+  Dropzone,
+  Files,
+  Modal,
+  Root
+};
+
+export { Root, Uploader };

package/dist/esm/components/Uploader/types.js

@@ -0,0 +1,67 @@
+var FileStatus = /* @__PURE__ */ ((FileStatus2) => {
+  FileStatus2["SUCCESS"] = "success";
+  FileStatus2["ERROR"] = "error";
+  FileStatus2["UPLOADING"] = "uploading";
+  return FileStatus2;
+})(FileStatus || {});
+const AcceptSpecificMap = {
+  APPLICATION: [
+    "application/pdf",
+    "application/zip",
+    "application/msword",
+    "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
+    "application/vnd.ms-excel",
+    "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+    "application/vnd.ms-powerpoint",
+    "application/vnd.openxmlformats-officedocument.presentationml.presentation",
+    "application/x-rar-compressed",
+    "application/x-7z-compressed",
+    "application/json",
+    "application/xml",
+    "application/rtf",
+    "application/x-tar",
+    "application/x-httpd-php",
+    "application/octet-stream"
+  ],
+  IMAGE: [
+    "image/jpeg",
+    "image/png",
+    "image/gif",
+    "image/bmp",
+    "image/svg+xml",
+    "image/tiff",
+    "image/webp",
+    "image/x-icon"
+  ],
+  VIDEO: [
+    "video/mp4",
+    "video/mpeg",
+    "video/quicktime",
+    "video/x-msvideo",
+    "video/x-ms-wmv",
+    "video/webm",
+    "video/ogg",
+    "video/x-flv"
+  ],
+  AUDIO: [
+    "audio/mpeg",
+    "audio/wav",
+    "audio/ogg",
+    "audio/x-aac",
+    "audio/flac",
+    "audio/mp4",
+    "audio/aac",
+    "audio/webm"
+  ],
+  TEXT: [
+    "text/plain",
+    "text/csv",
+    "text/html",
+    "text/css",
+    "text/xml",
+    "text/javascript",
+    "text/markdown"
+  ]
+};
+
+export { AcceptSpecificMap, FileStatus };