@react-magma/dropzone 15.0.0-rc.1 → 15.0.0

package/dist/fileuploader.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"fileuploader.umd.js","sources":["../src/components/dropzone/FileIcon.tsx","../src/components/dropzone/utils.ts","../src/components/dropzone/Preview.tsx","../src/components/dropzone/Dropzone.tsx"],"sourcesContent":["import React from 'react';\n\nimport { magma } from 'react-magma-dom';\nimport {\n  InsertDriveFileIcon,\n  ImageIcon,\n  AudiotrackIcon,\n  VideocamIcon,\n  FileExcelIcon,\n  FilePdfIcon,\n  FilePowerpointIcon,\n  FileWordIcon,\n  FileZipIcon,\n  IconProps,\n} from 'react-magma-icons';\n\nimport { FilePreview } from './FilePreview';\n\nexport interface FileIconProps extends IconProps {\n  file: FilePreview;\n  isInverse?: boolean;\n}\n\nconst icons = {\n  default: {\n    Icon: InsertDriveFileIcon,\n    style: {\n      color: magma.colors.neutral500,\n    },\n  },\n  word: {\n    Icon: FileWordIcon,\n    style: {\n      color: magma.colors.info500,\n    },\n  },\n  excel: {\n    Icon: FileExcelIcon,\n    style: {\n      color: magma.colors.success500,\n    },\n  },\n  powerpoint: {\n    Icon: FilePowerpointIcon,\n    style: {\n      color: magma.colors.warning500,\n    },\n  },\n  pdf: {\n    Icon: FilePdfIcon,\n    style: {\n      color: magma.colors.danger500,\n    },\n  },\n  image: {\n    Icon: ImageIcon,\n    style: {\n      color: magma.colors.neutral500,\n    },\n  },\n  video: {\n    Icon: VideocamIcon,\n    style: {\n      color: magma.colors.neutral500,\n    },\n  },\n  audio: {\n    Icon: AudiotrackIcon,\n    style: {\n      color: magma.colors.neutral500,\n    },\n  },\n  archive: {\n    Icon: FileZipIcon,\n    style: {\n      color: magma.colors.neutral500,\n    },\n  },\n};\n\nconst iconMapping: {\n  [key: string]: { Icon: any; style: React.CSSProperties };\n} = {\n  default: icons.default,\n  xlsx: icons.excel,\n  xlsm: icons.excel,\n  xlsb: icons.excel,\n  xltx: icons.excel,\n  xls: icons.excel,\n  xlt: icons.excel,\n  doc: icons.word,\n  docx: icons.word,\n  docm: icons.word,\n  dotx: icons.word,\n  dotm: icons.word,\n  docb: icons.word,\n  pptx: icons.powerpoint,\n  pptm: icons.powerpoint,\n  ppt: icons.powerpoint,\n  pdf: icons.pdf,\n  png: icons.image,\n  svg: icons.image,\n  image: icons.image,\n  audio: icons.audio,\n  video: icons.video,\n  zip: icons.archive,\n};\n\nexport const FileIcon = ({ file, isInverse }: FileIconProps) => {\n  const { path = '', type = '' } = file;\n  const category = type.split('/')[0];\n  const extension = path.split('.').pop() || 'default';\n  const { Icon, style } =\n    iconMapping[extension] || iconMapping[category] || iconMapping.default;\n\n  return <Icon size={magma.iconSizes.medium} style={isInverse ? {} : style} />;\n};\n","export const formatFileSize = (\n  bytes: number | undefined,\n  decimalPoint = 2,\n  bytesLabel = 'Bytes'\n) => {\n  if (bytes === undefined) return;\n  if (bytes == 0) return `0 ${bytesLabel}`;\n  const k = 1024;\n  const sizes = [bytesLabel, 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];\n  const i = Math.floor(Math.log(bytes) / Math.log(k));\n\n  return (\n    parseFloat((bytes / Math.pow(k, i)).toFixed(decimalPoint)) + ' ' + sizes[i]\n  );\n};\n","import React, { forwardRef, useContext, useEffect, useState } from 'react';\n\nimport {\n  ButtonColor,\n  ButtonVariant,\n  Card,\n  Flex,\n  FlexAlignItems,\n  FlexBehavior,\n  FlexProps,\n  I18nContext,\n  I18nInterface,\n  IconButton,\n  InverseContext,\n  ThemeContext,\n  ThemeInterface,\n  Transition,\n  Spinner,\n  useIsInverse,\n  styled,\n} from 'react-magma-dom';\nimport {\n  CheckCircleIcon,\n  CloseIcon,\n  DeleteIcon,\n  ErrorIcon,\n} from 'react-magma-icons';\n\nimport { FileIcon } from './FileIcon';\nimport { FilePreview } from './FilePreview';\nimport { formatFileSize } from './utils';\n\nexport interface PreviewProps extends Omit<FlexProps, 'behavior'> {\n  accept?: string | string[];\n  file: FilePreview;\n  isInverse?: boolean;\n  maxSize?: number;\n  minSize?: number;\n  onDeleteFile?: (file: FilePreview) => void;\n  onRemoveFile?: (file: FilePreview) => void;\n  /**\n   * @internal\n   */\n  testId?: string;\n  thumbnails: boolean;\n}\n\nconst Thumb = styled.div<{ file: FilePreview }>`\n  background-image: ${({ file }) =>\n    `url('${'preview' in file && file.preview}')`};\n  background-repeat: no-repeat;\n  background-size: cover;\n  display: inline-block;\n  vertical-align: middle;\n  height: 40px;\n  width: 40px;\n`;\n\nconst StatusIcons = styled.div`\n  display: grid;\n  grid-template-areas: 'inner-div';\n  height: auto;\n  place-items: center;\n  width: 46px;\n  & > div {\n    display: inline-block;\n    right: 0;\n    grid-area: inner-div;\n  }\n`;\n\nconst IconStyles = {\n  marginRight: '12px',\n  display: 'flex',\n};\n\nconst Errors = styled.div`\n  border-top: 1px solid ${({ theme }) => theme.colors.neutral300};\n  padding: 16px;\n  font-size: ${({ theme }) => theme.typeScale.size02.fontSize};\n  line-height: ${({ theme }) => theme.typeScale.size02.lineHeight};\n`;\n\nconst StyledFlex = styled(Flex)`\n  height: 56px;\n  padding: 0 8px 0 16px;\n  font-size: ${({ theme }) => theme.typeScale.size02.fontSize};\n  line-height: ${({ theme }) => theme.typeScale.size02.lineHeight};\n`;\n\nconst FileName = styled(Flex)`\n  overflow: hidden;\n  white-space: nowrap;\n  align-items: center;\n  text-overflow: ellipsis;\n  display: block;\n  margin-right: 24px;\n  font-size: ${({ theme }) => theme.typeScale.size02.fontSize};\n  line-height: ${({ theme }) => theme.typeScale.size02.lineHeight};\n`;\n\nconst StyledCard = styled(Card)<{ file: FilePreview; isInverse: boolean }>`\n  background-color: none;\n  border-color: ${({ file, theme, isInverse }) =>\n    file.errors\n      ? isInverse\n        ? theme.colors.danger300\n        : theme.colors.danger\n      : theme.colors.neutral300};\n  border-width: 1px;\n  margin: 10px 0;\n`;\n\nconst ErrorHeader = styled.span`\n  display: block;\n\n  > div {\n    display: flex;\n    align-self: center;\n    margin-right: 12px;\n  }\n`;\n\nconst ErrorMessage = styled.span`\n  display: block;\n`;\n\nconst formatError = (\n  error: { header?: string; message: string; code: string },\n  constraints: {\n    maxSize?: number;\n    minSize?: number;\n    accept?: string | string[];\n  },\n  byteLabel: string\n) => {\n  const accept =\n    Array.isArray(constraints.accept) && constraints.accept.length === 1\n      ? constraints.accept[0]\n      : constraints.accept;\n  const messageSuffix = Array.isArray(accept)\n    ? `one of ${accept.join(', ')}`\n    : accept;\n\n  switch (error.code) {\n    case 'file-too-large':\n      return {\n        ...error,\n        message: `${error.message} ${formatFileSize(\n          constraints.maxSize,\n          2,\n          byteLabel\n        )}.`,\n      };\n    case 'file-too-small':\n      return {\n        ...error,\n        message: `${error.message} ${formatFileSize(\n          constraints.minSize,\n          2,\n          byteLabel\n        )}.`,\n      };\n    case 'file-invalid-type':\n      return { ...error, message: `${error.message}: ${messageSuffix}` };\n    default:\n      return error;\n  }\n};\n\nexport const Preview = forwardRef<\n  HTMLDivElement,\n  Omit<PreviewProps, 'children'>\n>((props, ref) => {\n  const {\n    accept,\n    file,\n    isInverse: isInverseProp,\n    maxSize,\n    minSize,\n    onDeleteFile,\n    onRemoveFile,\n    testId,\n    thumbnails,\n    ...rest\n  } = props;\n\n  const theme: ThemeInterface = useContext(ThemeContext);\n  const i18n: I18nInterface = React.useContext(I18nContext);\n  const isInverse = useIsInverse(isInverseProp);\n  const [actions, setActions] = useState(<CloseIcon />);\n\n  const handleRemoveFile = () => {\n    onRemoveFile && typeof onRemoveFile === 'function' && onRemoveFile(file);\n  };\n\n  const handleDeleteFile = () => {\n    onDeleteFile && typeof onDeleteFile === 'function' && onDeleteFile(file);\n  };\n\n  const FinishedActions = ({ status = 'ready' }: { status?: string }) => {\n    const [done, setDone] = useState<boolean>(false);\n\n    useEffect(() => {\n      let mounted = true;\n\n      setTimeout(() => {\n        if (mounted) {\n          setDone(true);\n        }\n      }, 1000);\n\n      return () => {\n        mounted = false;\n      };\n    }, [status]);\n\n    if (status === 'error' || status === 'ready') {\n      return (\n        <StatusIcons>\n          <IconButton\n            onClick={handleRemoveFile}\n            variant={ButtonVariant.link}\n            color={ButtonColor.secondary}\n            aria-label={`${i18n.dropzone.removeFile} ${file.name}`}\n            icon={<CloseIcon />}\n          />\n        </StatusIcons>\n      );\n    }\n\n    if (status === 'pending') {\n      return (\n        <StatusIcons>\n          <Spinner\n            color={isInverse ? theme.colors.neutral100 : theme.colors.primary}\n          />\n        </StatusIcons>\n      );\n    }\n\n    return (\n      <StatusIcons>\n        <Transition isOpen={!done} unmountOnExit fade>\n          <CheckCircleIcon\n            color={isInverse ? theme.colors.success200 : theme.colors.success}\n            style={{ marginTop: '4px' }}\n          />\n        </Transition>\n        <Transition isOpen={done} unmountOnExit fade>\n          <IconButton\n            onClick={handleDeleteFile}\n            variant={ButtonVariant.link}\n            color={ButtonColor.secondary}\n            aria-label={`${i18n.dropzone.deleteFile} ${file.name}`}\n            icon={<DeleteIcon />}\n          />\n        </Transition>\n      </StatusIcons>\n    );\n  };\n\n  useEffect(() => {\n    setActions(<FinishedActions status={file?.processor?.status} />);\n  }, [file?.processor?.status]);\n\n  return (\n    <InverseContext.Provider value={{ isInverse }}>\n      <StyledCard\n        isInverse={isInverse}\n        theme={theme}\n        file={file}\n        data-testid={props.testId}\n        ref={ref}\n        role={file.errors ? 'alert' : ''}\n      >\n        <StyledFlex\n          theme={theme}\n          behavior={FlexBehavior.container}\n          alignItems={FlexAlignItems.center}\n          {...rest}\n        >\n          <Flex\n            behavior={FlexBehavior.item}\n            alignItems={FlexAlignItems.center}\n            style={IconStyles}\n          >\n            {file.errors ? (\n              <ErrorIcon\n                color={isInverse ? theme.colors.danger300 : theme.colors.danger}\n                size={24}\n              />\n            ) : file.preview &&\n              thumbnails &&\n              file.type &&\n              file.type.startsWith('image') ? (\n              <Thumb role=\"img\" file={file} />\n            ) : (\n              <FileIcon isInverse={isInverse} file={file} />\n            )}\n          </Flex>\n          <FileName xs behavior={FlexBehavior.item} theme={theme}>\n            {file.name}\n          </FileName>\n          {file.processor && file.processor.status === 'pending' && (\n            <Flex\n              role=\"progressbar\"\n              style={{ marginLeft: 'auto' }}\n              behavior={FlexBehavior.item}\n            >\n              {file.processor.percent}\n            </Flex>\n          )}\n          <Flex behavior={FlexBehavior.item}>{actions}</Flex>\n        </StyledFlex>\n        {file.errors && (\n          <Errors theme={theme}>\n            {file.errors.slice(0, 1).map(({ code, ...rest }) => {\n              const { header = '', message } = formatError(\n                { code, ...rest, ...i18n.dropzone.errors[code] },\n                { accept, minSize, maxSize },\n                i18n.dropzone.bytes\n              );\n\n              return (\n                <React.Fragment key={code}>\n                  <ErrorHeader\n                    style={{\n                      color: isInverse\n                        ? theme.colors.danger200\n                        : theme.colors.danger,\n                    }}\n                  >\n                    {header}\n                  </ErrorHeader>\n                  <ErrorMessage>{message}</ErrorMessage>\n                </React.Fragment>\n              );\n            })}\n          </Errors>\n        )}\n      </StyledCard>\n    </InverseContext.Provider>\n  );\n});\n","/* eslint-disable no-empty-pattern */\n/**\n * HELPFUL NOTE!\n * SINCE THIS PACKAGE USES `FILE` WE MUST USE `Object.assign` IN LIEU OF SPREADING\n * `{...file}` WILL NOT COPY ALL OF THE FILE PROPERTIES\n */\n\nimport React, { useImperativeHandle } from 'react';\n\nimport { transparentize } from 'polished';\nimport {\n  useDropzone,\n  DropzoneOptions,\n  DropzoneRootProps,\n  FileRejection,\n} from 'react-dropzone';\nimport {\n  Button,\n  ButtonColor,\n  ButtonVariant,\n  Flex,\n  FlexBehavior,\n  FlexProps,\n  FormFieldContainer,\n  FormFieldContainerBaseProps,\n  I18nContext,\n  I18nInterface,\n  InverseContext,\n  ThemeContext,\n  ThemeInterface,\n  useGenerateId,\n  useIsInverse,\n  styled,\n  Announce,\n  VisuallyHidden,\n} from 'react-magma-dom';\nimport { CloudUploadIcon } from 'react-magma-icons';\n\nimport { FilePreview, FileError } from './FilePreview';\nimport { Preview } from './Preview';\n\nexport interface OnSendFileProps {\n  file: FilePreview;\n  onError?: ({}: { errors: FileError[]; file: FilePreview }) => void;\n  onFinish?: ({}: { file: FilePreview }) => void;\n  onProgress?: ({}: { percent: number; file: FilePreview }) => void;\n}\n\ntype DragState =\n  | 'error'\n  | 'dragAccept'\n  | 'dragReject'\n  | 'dragActive'\n  | 'default';\n\n// NOTE: These props are manually copied to dropzone.mdx\nexport interface DropzoneProps\n  extends Omit<FormFieldContainerBaseProps, 'fieldId' | 'errorMessage'> {\n  /**\n   * Set accepted file types. See https://github.com/okonet/attr-accept for more information. Keep in mind that mime type determination is not reliable across platforms. CSV files, for example, are reported as text/plain under macOS but as application/vnd.ms-excel under Windows. In some cases there might not be a mime type set at all. See: https://github.com/react-dropzone/react-dropzone/issues/276\n   */\n  accept?: string | string[];\n  /**\n   * Enable/Disable the input\n   */\n  disabled?: boolean;\n  /**\n   * Additional props to pass to the dropzone, see https://react-dropzone.js.org/#src\n   */\n  dropzoneOptions?: Partial<Omit<DropzoneOptions, 'onDrop'>>;\n  /**\n   * Content of the helper message.\n   */\n  helperMessage?: string;\n  /**\n   * @internal\n   */\n  id?: string;\n  /**\n   * Maximum accepted number of files The default value is 0 which means there is no limitation to how many files are accepted.\n   * @default 0\n   */\n  maxFiles?: number;\n  /**\n   * Minimum accepted number of files.\n   */\n  minFiles?: number;\n  /**\n   * Maximum file size (in bytes)\n   * @default Infinity\n   */\n  maxSize?: number;\n  /**\n   * Minimum file size (in bytes)\n   * @default 0\n   */\n  minSize?: number;\n  /**\n   * Allow drag 'n' drop (or selection from the file dialog) of multiple files.\n   * @default true\n   */\n  multiple?: boolean;\n  /**\n   * If true, disables drag 'n' drop\n   * @default false\n   */\n  noDrag?: boolean;\n  /**\n   * Callback for when a file is deleted\n   */\n  onDeleteFile?: (file: FilePreview) => void;\n  /**\n   * Callback for when a file is deleted\n   */\n  onRemoveFile?: (file: FilePreview) => void;\n  /**\n   * Callback for when a file is added to the preview list via dropping or selecting. Will be ran on new files when `sendFiles` is true.\n   */\n  onSendFile?: (props: OnSendFileProps) => void;\n  /**\n   * Run `onSendFile` on any new files. Delay processing by setting to `false` until processing is desired.\n   * @default false\n   */\n  sendFiles?: boolean;\n  /**\n   * @internal\n   */\n  testId?: string;\n  /**\n   * Show thumbnails for images in lieu of the file icon.\n   * @default true\n   */\n  thumbnails?: boolean;\n}\n\nconst Container = styled(Flex)<\n  DropzoneRootProps &\n    FlexProps & {\n      dragState?: DragState;\n      noDrag?: boolean;\n      isInverse?: boolean;\n    }\n>`\n  flex-direction: column;\n  align-items: ${({ noDrag }) => (noDrag ? 'left' : 'center')};\n  justify-content: ${({ noDrag }) => (noDrag ? 'left' : 'center')};\n  text-align: ${({ noDrag }) => (noDrag ? 'left' : 'center')};\n  padding: ${({ noDrag }) => (noDrag ? '0px' : '24px')};\n  border-radius: ${({ noDrag }) => (noDrag ? '0px' : '4px')};\n  border: ${({ dragState = 'default', noDrag, theme, isInverse }) =>\n    noDrag\n      ? `0px`\n      : dragState === 'dragReject' || dragState === 'error'\n        ? isInverse\n          ? `1px dashed ${theme.colors.danger300}`\n          : `1px dashed ${theme.colors.danger}`\n        : dragState === 'dragActive'\n          ? `1px dashed ${theme.colors.primary}`\n          : dragState === 'dragAccept'\n            ? `1px dashed ${theme.colors.success}`\n            : `1px dashed ${theme.colors.neutral400}`};\n\n  border-style: ${({ dragState = 'default' }) =>\n    dragState === 'error' ? 'solid' : 'dashed'};\n  background-color: ${({ theme, noDrag, isInverse }) =>\n    noDrag\n      ? 'transparent'\n      : isInverse\n        ? transparentize(0.75, theme.colors.neutral900)\n        : theme.colors.neutral200};\n  outline: none;\n  transition: ${({ noDrag }) => `border ${noDrag ? 0 : '.24s'} ease-in-out`};\n`;\n\nconst HelperMessage = styled.span<{ isInverse?: boolean }>`\n  color: ${({ theme, isInverse }) =>\n    isInverse ? theme.colors.neutral100 : theme.colors.neutral700};\n  display: block;\n  font-size: 14px;\n  margin: -8px 0 16px 0;\n`;\n\nconst Wrapper = styled.div<{ isInverse?: boolean }>`\n  color: ${({ theme, isInverse }) =>\n    isInverse ? theme.colors.neutral100 : theme.colors.neutral700};\n  margin: 0 0 24px 0;\n  font-size: ${({ theme }) => theme.typeScale.size02.fontSize};\n  line-height: ${({ theme }) => theme.typeScale.size02.lineHeight};\n  font-weight: 500;\n  padding: ${({ theme }) => theme.spaceScale.spacing01};\n`;\n\nconst PreviewList = styled.ul`\n  list-style: none;\n  padding: 0;\n`;\n\nconst PreviewItem = styled.li``;\n\nexport const Dropzone = React.forwardRef<HTMLInputElement, DropzoneProps>(\n  (props, ref) => {\n    const {\n      accept,\n      containerStyle,\n      disabled,\n\n      dropzoneOptions = {\n        multiple: true,\n      },\n      helperMessage,\n      id: defaultId,\n      inputSize,\n      isInverse: isInverseProp,\n      isLabelVisuallyHidden,\n      labelStyle,\n      labelText,\n      maxFiles,\n      minFiles,\n      maxSize,\n      minSize,\n      multiple = true,\n      noDrag = false,\n      onSendFile,\n      onDeleteFile,\n      onRemoveFile,\n      sendFiles = false,\n      testId,\n      thumbnails = true,\n      ...rest\n    } = props;\n\n    const [files, setFiles] = React.useState<FilePreview[]>([]);\n    const [errorMessage, setErrorMessage] = React.useState<string | null>(null);\n    const [announcement, setAnnouncement] = React.useState<string>('');\n\n    const isInverse = useIsInverse(isInverseProp);\n    const theme: ThemeInterface = React.useContext(ThemeContext);\n    const i18n: I18nInterface = React.useContext(I18nContext);\n    const id = useGenerateId(defaultId);\n    const helperMessageId = useGenerateId(`${id}-helper`);\n\n    const browseFileButtonRef = React.useRef<HTMLButtonElement>(null);\n\n    const onDrop = React.useCallback(\n      (acceptedFiles: FilePreview[], rejectedFiles: FileRejection[]) => {\n        const newFiles = [\n          ...acceptedFiles.map((file: FilePreview) =>\n            Object.assign(file, {\n              preview: URL.createObjectURL(file),\n            })\n          ),\n          ...rejectedFiles.map(\n            ({ file, errors }: { file: FilePreview; errors: FileError[] }) =>\n              Object.assign(file, {\n                errors,\n              })\n          ),\n        ];\n\n        setFiles((prevFiles: FilePreview[]) => [...prevFiles, ...newFiles]);\n\n        if (acceptedFiles.length > 0) {\n          const fileNames = acceptedFiles.map(file => file.name).join(', ');\n          const message =\n            acceptedFiles.length === 1\n              ? i18n.dropzone.fileAdded.replace(/\\{fileName\\}/g, fileNames)\n              : i18n.dropzone.filesAdded\n                  .replace(/\\{count\\}/g, acceptedFiles.length.toString())\n                  .replace(/\\{fileNames\\}/g, fileNames);\n\n          setAnnouncement(message);\n        }\n\n        browseFileButtonRef.current && browseFileButtonRef.current.focus();\n      },\n      [i18n]\n    );\n\n    const {\n      getInputProps,\n      getRootProps,\n      isDragAccept,\n      isDragActive,\n      isDragReject,\n      open,\n      inputRef,\n    } = useDropzone({\n      noClick: true,\n      disabled,\n      multiple,\n      maxSize,\n      minSize,\n      accept,\n      onDrop,\n      noDrag,\n      ...dropzoneOptions,\n    });\n\n    useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(\n      ref,\n      () => inputRef.current\n    );\n\n    const inputProps = getInputProps({ id });\n\n    let dragState: DragState = 'default';\n\n    if (errorMessage) {\n      dragState = 'error';\n    } else if (isDragAccept) {\n      dragState = 'dragAccept';\n    } else if (isDragReject) {\n      dragState = 'dragReject';\n    } else if (isDragActive) {\n      dragState = 'dragActive';\n    }\n\n    const handleRemoveFile = (removedFile: FilePreview) => {\n      setFiles(prevFiles => prevFiles.filter(file => file !== removedFile));\n\n      if (onRemoveFile && typeof onRemoveFile === 'function') {\n        onRemoveFile(removedFile);\n      }\n\n      const message = i18n.dropzone.fileRemoved.replace(\n        /\\{fileName\\}/g,\n        removedFile.name\n      );\n\n      setAnnouncement(message);\n\n      browseFileButtonRef.current && browseFileButtonRef.current.focus();\n    };\n\n    const handleDeleteFile = (removedFile: FilePreview) => {\n      setFiles(prevFiles => prevFiles.filter(file => file !== removedFile));\n\n      if (onDeleteFile && typeof onDeleteFile === 'function') {\n        onDeleteFile(removedFile);\n      }\n\n      const message = i18n.dropzone.fileDeleted.replace(\n        /\\{fileName\\}/g,\n        removedFile.name\n      );\n\n      setAnnouncement(message);\n\n      browseFileButtonRef.current && browseFileButtonRef.current.focus();\n    };\n\n    const setProgress = (progressProps: {\n      percent: number;\n      file: FilePreview;\n    }) => {\n      setFiles(prevFiles =>\n        prevFiles.map(file =>\n          file === progressProps.file\n            ? Object.assign(file, {\n                processor: {\n                  ...file.processor,\n                  percent: `${progressProps.percent}%`,\n                  status: 'pending',\n                },\n              })\n            : file\n        )\n      );\n\n      // Announce progress every 25% to avoid too many announcements\n      if (progressProps.percent > 0 && progressProps.percent % 25 === 0) {\n        const message = i18n.dropzone.fileUploading\n          .replace(/\\{fileName\\}/g, progressProps.file.name)\n          .replace(/\\{percent\\}/g, progressProps.percent.toString());\n\n        setAnnouncement(message);\n      }\n    };\n\n    const setFinished = (finishedProps: { file: FilePreview }) => {\n      setFiles(prevFiles =>\n        prevFiles.map(file =>\n          file === finishedProps.file\n            ? Object.assign(file, {\n                processor: {\n                  ...file.processor,\n                  percent: '',\n                  status: 'finished',\n                },\n              })\n            : file\n        )\n      );\n\n      // Announce successful upload\n      const message = i18n.dropzone.fileUploaded.replace(\n        /\\{fileName\\}/g,\n        finishedProps.file.name\n      );\n\n      setAnnouncement(message);\n    };\n\n    const setError = (errorProps: {\n      errors: FileError[];\n      file: FilePreview;\n    }) => {\n      setFiles(prevFiles =>\n        prevFiles.map(file =>\n          file === errorProps.file\n            ? Object.assign(file, {\n                errors: errorProps.errors,\n                processor: { ...file.processor, status: 'error' },\n              })\n            : file\n        )\n      );\n    };\n\n    React.useEffect(\n      () => () => {\n        files.forEach(\n          file => file.preview && URL.revokeObjectURL(file.preview)\n        );\n      },\n      [files]\n    );\n\n    React.useEffect(() => {\n      const formatError = (\n        code: string | null,\n        constraints: { maxFiles?: number; minFiles?: number }\n      ) => {\n        if (code === null) return null;\n        const error = i18n.dropzone.errors[code];\n\n        switch (code) {\n          case 'too-many-files':\n            return `${error.message} ${constraints.maxFiles} ${i18n.dropzone.files}.`;\n          case 'too-few-files':\n            return `${error.message} ${constraints.minFiles} ${i18n.dropzone.files}.`;\n          default:\n            return error.message;\n        }\n      };\n\n      const minFileError = minFiles && files.length < minFiles;\n      const maxFileError = maxFiles && files.length > maxFiles;\n\n      let errorCode: string | null = null;\n\n      if (maxFileError) {\n        errorCode = 'too-many-files';\n      } else if (minFileError) {\n        errorCode = 'too-few-files';\n      }\n\n      setErrorMessage(formatError(errorCode, { minFiles, maxFiles }));\n\n      if (sendFiles && files.length > 0 && !maxFileError && !minFileError) {\n        setFiles((prevFiles: FilePreview[]) => {\n          return prevFiles.map((file: FilePreview) => {\n            if (!file.errors && !file.processor && onSendFile) {\n              onSendFile({\n                file,\n                onError: setError,\n                onFinish: setFinished,\n                onProgress: setProgress,\n              });\n            }\n\n            return file;\n          });\n        });\n      }\n    }, [\n      sendFiles,\n      files.length,\n      onSendFile,\n      maxFiles,\n      minFiles,\n      i18n.dropzone.errors,\n      i18n.dropzone.files,\n    ]);\n\n    return (\n      <InverseContext.Provider value={{ isInverse }}>\n        <FormFieldContainer\n          actionable={false}\n          containerStyle={containerStyle}\n          errorMessage={errorMessage}\n          fieldId={id}\n          inputSize={inputSize}\n          isInverse={isInverse}\n          isLabelVisuallyHidden={isLabelVisuallyHidden}\n          labelStyle={labelStyle}\n          labelText={labelText}\n          messageStyle={{ minHeight: 0 }}\n          data-testid={testId}\n        >\n          <HelperMessage\n            id={helperMessageId}\n            theme={theme}\n            isInverse={isInverse}\n          >\n            {helperMessage}\n          </HelperMessage>\n          <Container\n            behavior={FlexBehavior.container}\n            dragState={dragState}\n            isInverse={isInverse}\n            noDrag={noDrag}\n            theme={theme}\n            {...getRootProps()}\n            {...rest}\n            testId={testId}\n            tabIndex={-1}\n          >\n            <input\n              ref={inputRef}\n              type={inputProps.type}\n              accept={inputProps.accept}\n              autoComplete={inputProps.autoComplete}\n              id={inputProps.id}\n              multiple={inputProps.multiple}\n              onChange={inputProps.onChange}\n              onClick={inputProps.onClick}\n              style={inputProps.style}\n              tabIndex={inputProps.tabIndex}\n              data-testid=\"file-input\"\n            />\n            {noDrag ? (\n              <Flex xs behavior={FlexBehavior.item}>\n                <Button\n                  color={ButtonColor.primary}\n                  disabled={disabled}\n                  isInverse={isInverse}\n                  onClick={open}\n                  style={{ margin: 0 }}\n                  ref={browseFileButtonRef}\n                  aria-describedby={helperMessage ? helperMessageId : undefined}\n                >\n                  {i18n.dropzone.browseFiles}\n                </Button>\n              </Flex>\n            ) : (\n              <Flex behavior={FlexBehavior.item}>\n                <CloudUploadIcon\n                  aria-hidden=\"true\"\n                  color={\n                    isInverse\n                      ? theme.colors.neutral100\n                      : theme.colors.neutral500\n                  }\n                  size={48}\n                />\n                <Wrapper isInverse={isInverse} theme={theme}>\n                  {i18n.dropzone.dragMessage}\n                </Wrapper>\n                <Button\n                  color={ButtonColor.primary}\n                  disabled={disabled}\n                  isInverse={isInverse}\n                  onClick={open}\n                  style={{ margin: 0 }}\n                  variant={ButtonVariant.solid}\n                  ref={browseFileButtonRef}\n                  aria-describedby={helperMessage ? helperMessageId : undefined}\n                >\n                  {i18n.dropzone.browseFiles}\n                </Button>\n              </Flex>\n            )}\n          </Container>\n        </FormFieldContainer>\n        <PreviewList>\n          {files.map((file: FilePreview) => (\n            <PreviewItem key={file.name}>\n              <Preview\n                accept={accept}\n                file={file}\n                isInverse={isInverse}\n                maxSize={maxSize}\n                minSize={minSize}\n                onDeleteFile={handleDeleteFile}\n                onRemoveFile={handleRemoveFile}\n                thumbnails={thumbnails}\n              />\n            </PreviewItem>\n          ))}\n        </PreviewList>\n\n        <VisuallyHidden>\n          <Announce>{announcement}</Announce>\n        </VisuallyHidden>\n      </InverseContext.Provider>\n    );\n  }\n);\n"],"names":["icons","default","Icon","InsertDriveFileIcon","style","color","magma","colors","neutral500","word","FileWordIcon","info500","excel","FileExcelIcon","success500","powerpoint","FilePowerpointIcon","warning500","pdf","FilePdfIcon","danger500","image","ImageIcon","video","VideocamIcon","audio","AudiotrackIcon","archive","FileZipIcon","iconMapping","xlsx","xlsm","xlsb","xltx","xls","xlt","doc","docx","docm","dotx","dotm","docb","pptx","pptm","ppt","png","svg","zip","FileIcon","_ref","file","isInverse","_file$path","path","_file$type","type","category","split","extension","pop","_ref2","_jsx","size","iconSizes","medium","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","formatFileSize","bytes","decimalPoint","bytesLabel","undefined","sizes","i","Math","floor","log","parseFloat","pow","toFixed","_excluded","_excluded2","Thumb","styled","div","_taggedTemplateLiteralLoose","preview","StatusIcons","IconStyles","marginRight","display","Errors","theme","neutral300","_ref3","typeScale","size02","fontSize","_ref4","lineHeight","StyledFlex","Flex","_ref5","_ref6","FileName","_ref7","_ref8","StyledCard","Card","_ref9","errors","danger300","danger","ErrorHeader","span","ErrorMessage","Preview","forwardRef","props","ref","_file$processor2","accept","isInverseProp","maxSize","minSize","onDeleteFile","onRemoveFile","thumbnails","rest","_objectWithoutPropertiesLoose","useContext","ThemeContext","i18n","React","I18nContext","useIsInverse","_useState","useState","CloseIcon","actions","setActions","handleRemoveFile","handleDeleteFile","FinishedActions","_ref0","_ref0$status","status","_useState2","done","setDone","useEffect","mounted","setTimeout","jsx","children","IconButton","onClick","variant","ButtonVariant","link","ButtonColor","secondary","dropzone","removeFile","name","icon","Spinner","neutral100","primary","_jsxs","jsxs","Transition","isOpen","unmountOnExit","fade","CheckCircleIcon","success200","success","marginTop","deleteFile","DeleteIcon","_file$processor","processor","InverseContext","Provider","value","testId","role","_extends","behavior","FlexBehavior","container","alignItems","FlexAlignItems","center","item","ErrorIcon","startsWith","xs","marginLeft","percent","slice","map","_ref1","code","_formatError","error","constraints","byteLabel","Array","isArray","length","messageSuffix","join","message","formatError","_formatError$header","header","Fragment","danger200","Container","noDrag","_ref6$dragState","dragState","neutral400","_ref7$dragState","transparentize","neutral900","neutral200","HelperMessage","neutral700","Wrapper","_ref10","_ref11","_ref12","spaceScale","spacing01","PreviewList","ul","PreviewItem","li","containerStyle","disabled","_props$dropzoneOption","dropzoneOptions","multiple","helperMessage","defaultId","id","inputSize","isLabelVisuallyHidden","labelStyle","labelText","maxFiles","minFiles","_props$multiple","_props$noDrag","onSendFile","_props$sendFiles","sendFiles","_props$thumbnails","_React$useState","files","setFiles","_React$useState2","errorMessage","setErrorMessage","_React$useState3","announcement","setAnnouncement","useGenerateId","helperMessageId","browseFileButtonRef","useRef","onDrop","useCallback","acceptedFiles","rejectedFiles","newFiles","concat","Object","assign","URL","createObjectURL","_ref13","prevFiles","fileNames","fileAdded","replace","filesAdded","toString","current","focus","_useDropzone","useDropzone","noClick","getInputProps","getRootProps","isDragAccept","isDragActive","isDragReject","open","inputRef","useImperativeHandle","inputProps","removedFile","filter","fileRemoved","fileDeleted","setProgress","progressProps","fileUploading","setFinished","finishedProps","fileUploaded","setError","errorProps","forEach","revokeObjectURL","minFileError","maxFileError","errorCode","onError","onFinish","onProgress","FormFieldContainer","actionable","fieldId","messageStyle","minHeight","tabIndex","autoComplete","onChange","Button","margin","browseFiles","CloudUploadIcon","dragMessage","solid","VisuallyHidden","Announce"],"mappings":"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"}
+{"version":3,"file":"fileuploader.umd.js","sources":["../src/components/dropzone/FileIcon.tsx","../src/components/dropzone/utils.ts","../src/components/dropzone/Dropzone.tsx","../src/components/dropzone/Preview.tsx"],"sourcesContent":["import React from 'react';\n\nimport { magma } from 'react-magma-dom';\nimport {\n  InsertDriveFileIcon,\n  ImageIcon,\n  AudiotrackIcon,\n  VideocamIcon,\n  FileExcelIcon,\n  FilePdfIcon,\n  FilePowerpointIcon,\n  FileWordIcon,\n  FileZipIcon,\n  IconProps,\n} from 'react-magma-icons';\n\nimport { FilePreview } from './FilePreview';\n\nexport interface FileIconProps extends IconProps {\n  file: FilePreview;\n  isInverse?: boolean;\n}\n\nconst icons = {\n  default: {\n    Icon: InsertDriveFileIcon,\n    style: {\n      color: magma.colors.neutral700,\n    },\n    inverseStyle: {\n      color: magma.colors.neutral300,\n    },\n  },\n  word: {\n    Icon: FileWordIcon,\n    style: {\n      color: magma.colors.blue500,\n    },\n    inverseStyle: {\n      color: magma.colors.blue500,\n    },\n  },\n  excel: {\n    Icon: FileExcelIcon,\n    style: {\n      color: magma.colors.green500,\n    },\n    inverseStyle: {\n      color: magma.colors.green500,\n    },\n  },\n  powerpoint: {\n    Icon: FilePowerpointIcon,\n    style: {\n      color: magma.colors.tangerine600,\n    },\n    inverseStyle: {\n      color: magma.colors.tangerine500,\n    },\n  },\n  pdf: {\n    Icon: FilePdfIcon,\n    style: {\n      color: magma.colors.red600,\n    },\n    inverseStyle: {\n      color: magma.colors.red500,\n    },\n  },\n  image: {\n    Icon: ImageIcon,\n    style: {\n      color: magma.colors.neutral700,\n    },\n    inverseStyle: {\n      color: magma.colors.neutral300,\n    },\n  },\n  video: {\n    Icon: VideocamIcon,\n    style: {\n      color: magma.colors.neutral700,\n    },\n    inverseStyle: {\n      color: magma.colors.neutral300,\n    },\n  },\n  audio: {\n    Icon: AudiotrackIcon,\n    style: {\n      color: magma.colors.neutral700,\n    },\n    inverseStyle: {\n      color: magma.colors.neutral300,\n    },\n  },\n  archive: {\n    Icon: FileZipIcon,\n    style: {\n      color: magma.colors.neutral700,\n    },\n    inverseStyle: {\n      color: magma.colors.neutral300,\n    },\n  },\n};\n\nconst iconMapping: {\n  [key: string]: {\n    Icon: any;\n    style: React.CSSProperties;\n    inverseStyle: React.CSSProperties;\n  };\n} = {\n  default: icons.default,\n  xlsx: icons.excel,\n  xlsm: icons.excel,\n  xlsb: icons.excel,\n  xltx: icons.excel,\n  xls: icons.excel,\n  xlt: icons.excel,\n  doc: icons.word,\n  docx: icons.word,\n  docm: icons.word,\n  dotx: icons.word,\n  dotm: icons.word,\n  docb: icons.word,\n  pptx: icons.powerpoint,\n  pptm: icons.powerpoint,\n  ppt: icons.powerpoint,\n  pdf: icons.pdf,\n  png: icons.image,\n  svg: icons.image,\n  image: icons.image,\n  audio: icons.audio,\n  video: icons.video,\n  zip: icons.archive,\n};\n\nexport const FileIcon = ({ file, isInverse }: FileIconProps) => {\n  const { path = '', type = '' } = file;\n  const category = type.split('/')[0];\n  const extension = path.split('.').pop() || 'default';\n  const { Icon, style, inverseStyle } =\n    iconMapping[extension] || iconMapping[category] || iconMapping.default;\n\n  return (\n    <Icon\n      size={magma.iconSizes.medium}\n      style={isInverse ? inverseStyle : style}\n    />\n  );\n};\n","export const formatFileSize = (\n  bytes: number | undefined,\n  decimalPoint = 2,\n  bytesLabel = 'Bytes'\n) => {\n  if (bytes === undefined) return;\n  if (bytes == 0) return `0 ${bytesLabel}`;\n  const k = 1024;\n  const sizes = [bytesLabel, 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];\n  const i = Math.floor(Math.log(bytes) / Math.log(k));\n  return (\n    parseFloat((bytes / Math.pow(k, i)).toFixed(decimalPoint)) + ' ' + sizes[i]\n  );\n};\n","/* eslint-disable no-empty-pattern */\n/**\n * HELPFUL NOTE!\n * SINCE THIS PACKAGE USES `FILE` WE MUST USE `Object.assign` IN LIEU OF SPREADING\n * `{...file}` WILL NOT COPY ALL OF THE FILE PROPERTIES\n */\n\nimport React, { useImperativeHandle } from 'react';\n\nimport { transparentize } from 'polished';\nimport {\n  useDropzone,\n  DropzoneOptions,\n  DropzoneRootProps,\n  FileRejection,\n} from 'react-dropzone';\nimport {\n  Button,\n  ButtonColor,\n  ButtonVariant,\n  Flex,\n  FlexBehavior,\n  FlexProps,\n  FormFieldContainer,\n  FormFieldContainerBaseProps,\n  I18nContext,\n  I18nInterface,\n  InverseContext,\n  ThemeContext,\n  ThemeInterface,\n  useGenerateId,\n  useIsInverse,\n  styled,\n  Announce,\n  VisuallyHidden,\n} from 'react-magma-dom';\nimport { CloudUploadIcon } from 'react-magma-icons';\n\nimport { FilePreview, FileError } from './FilePreview';\nimport { Preview } from './Preview';\n\nexport interface OnSendFileProps {\n  file: FilePreview;\n  onError?: ({}: { errors: FileError[]; file: FilePreview }) => void;\n  onFinish?: ({}: { file: FilePreview }) => void;\n  onProgress?: ({}: { percent: number; file: FilePreview }) => void;\n}\n\nenum DragState {\n  error = 'error',\n  dragAccept = 'dragAccept',\n  dragReject = 'dragReject',\n  dragActive = 'dragActive',\n  default = 'default',\n}\n\n// NOTE: These props are manually copied to dropzone.mdx\nexport interface DropzoneProps\n  extends Omit<FormFieldContainerBaseProps, 'fieldId' | 'errorMessage'> {\n  /**\n   * Set accepted file types. See https://github.com/okonet/attr-accept for more information. Keep in mind that mime type determination is not reliable across platforms. CSV files, for example, are reported as text/plain under macOS but as application/vnd.ms-excel under Windows. In some cases there might not be a mime type set at all. See: https://github.com/react-dropzone/react-dropzone/issues/276\n   */\n  accept?: string | string[];\n  /**\n   * Enable/Disable the input\n   */\n  disabled?: boolean;\n  /**\n   * Additional props to pass to the dropzone, see https://react-dropzone.js.org/#src\n   */\n  dropzoneOptions?: Partial<Omit<DropzoneOptions, 'onDrop'>>;\n  /**\n   * Content of the helper message.\n   */\n  helperMessage?: string;\n  /**\n   * @internal\n   */\n  id?: string;\n  /**\n   * Maximum accepted number of files The default value is 0 which means there is no limitation to how many files are accepted.\n   * @default 0\n   */\n  maxFiles?: number;\n  /**\n   * Minimum accepted number of files.\n   */\n  minFiles?: number;\n  /**\n   * Maximum file size (in bytes)\n   * @default Infinity\n   */\n  maxSize?: number;\n  /**\n   * Minimum file size (in bytes)\n   * @default 0\n   */\n  minSize?: number;\n  /**\n   * Allow drag 'n' drop (or selection from the file dialog) of multiple files.\n   * @default true\n   */\n  multiple?: boolean;\n  /**\n   * If true, disables drag 'n' drop\n   * @default false\n   */\n  noDrag?: boolean;\n  /**\n   * Callback for when a file is deleted\n   */\n  onDeleteFile?: (file: FilePreview) => void;\n  /**\n   * Callback for when a file is deleted\n   */\n  onRemoveFile?: (file: FilePreview) => void;\n  /**\n   * Callback for when a file is added to the preview list via dropping or selecting. Will be ran on new files when `sendFiles` is true.\n   */\n  onSendFile?: (props: OnSendFileProps) => void;\n  /**\n   * Run `onSendFile` on any new files. Delay processing by setting to `false` until processing is desired.\n   * @default false\n   */\n  sendFiles?: boolean;\n  /**\n   * @internal\n   */\n  testId?: string;\n  /**\n   * Show thumbnails for images in lieu of the file icon.\n   * @default true\n   */\n  thumbnails?: boolean;\n}\n\nconst getErrorBorderColor = (\n  dragState: DragState,\n  theme: ThemeInterface,\n  isInverse?: boolean\n) => {\n  if (!isInverse) {\n    return theme.colors.danger;\n  }\n\n  return dragState === DragState.error\n    ? theme.colors.red500\n    : theme.colors.red400;\n};\n\nconst getContainerBorder = ({\n  dragState = DragState.default,\n  noDrag,\n  theme,\n  isInverse,\n}: {\n  dragState?: DragState;\n  noDrag?: boolean;\n  theme: ThemeInterface;\n  isInverse?: boolean;\n}) => {\n  if (noDrag) {\n    return '0px';\n  }\n\n  if (dragState === DragState.dragReject || dragState === DragState.error) {\n    const width = dragState === DragState.error ? '1px' : '2px';\n\n    return `${width} dashed ${getErrorBorderColor(dragState, theme, isInverse)}`;\n  }\n\n  if (dragState === DragState.dragActive) {\n    return `2px dashed ${theme.colors.blue500}`;\n  }\n\n  if (dragState === DragState.dragAccept) {\n    return `2px dashed ${theme.colors.green500}`;\n  }\n\n  return `2px dashed ${\n    isInverse ? theme.colors.neutral800 : theme.colors.neutral300\n  }`;\n};\n\nconst Container = styled(Flex)<\n  DropzoneRootProps &\n    FlexProps & {\n      dragState?: DragState;\n      noDrag?: boolean;\n      isInverse?: boolean;\n    }\n>`\n  flex-direction: column;\n  align-items: ${({ noDrag }) => (noDrag ? 'left' : 'center')};\n  justify-content: ${({ noDrag }) => (noDrag ? 'left' : 'center')};\n  text-align: ${({ noDrag }) => (noDrag ? 'left' : 'center')};\n  padding: ${({ noDrag }) => (noDrag ? '0px' : '24px')};\n  border-radius: ${({ noDrag, theme }) =>\n    noDrag ? theme.borderRadiusNone : theme.borderRadiusSmall};\n  border: ${getContainerBorder};\n\n  border-style: ${({ dragState = DragState.default }) =>\n    dragState === DragState.error ? 'solid' : 'dashed'};\n  background-color: ${({ theme, noDrag, isInverse }) =>\n    noDrag\n      ? 'transparent'\n      : isInverse\n        ? transparentize(0.6, theme.colors.neutral1200)\n        : theme.colors.neutral100};\n  outline: none;\n  transition: ${({ noDrag }) => `border ${noDrag ? 0 : '.24s'} ease-in-out`};\n`;\n\nconst HelperMessage = styled.span<{ isInverse?: boolean }>`\n  color: ${({ theme, isInverse }) =>\n    isInverse ? theme.colors.neutral500 : theme.colors.neutral700};\n  display: block;\n  font-size: 14px;\n  margin: -8px 0 16px 0;\n`;\n\nconst Wrapper = styled.div<{ isInverse?: boolean }>`\n  color: ${({ theme, isInverse }) =>\n    isInverse ? theme.colors.neutral0 : theme.colors.brand.navy};\n  margin: 0 0 24px 0;\n  font-size: ${({ theme }) => theme.typeScale.size02.fontSize};\n  line-height: ${({ theme }) => theme.typeScale.size02.lineHeight};\n  font-weight: 500;\n  padding: ${({ theme }) => theme.spaceScale.spacing01};\n`;\n\nconst PreviewList = styled.ul`\n  list-style: none;\n  padding: 0;\n`;\n\nconst PreviewItem = styled.li``;\n\nexport const Dropzone = React.forwardRef<HTMLInputElement, DropzoneProps>(\n  (props, ref) => {\n    const {\n      accept,\n      containerStyle,\n      disabled,\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      dropzoneOptions = {\n        multiple: true,\n      },\n      helperMessage,\n      id: defaultId,\n      inputSize,\n      isInverse: isInverseProp,\n      isLabelVisuallyHidden,\n      labelStyle,\n      labelText,\n      maxFiles,\n      minFiles,\n      maxSize,\n      minSize,\n      multiple = true,\n      noDrag = false,\n      onSendFile,\n      onDeleteFile,\n      onRemoveFile,\n      sendFiles = false,\n      testId,\n      thumbnails = true,\n      ...rest\n    } = props;\n\n    const [files, setFiles] = React.useState<FilePreview[]>([]);\n    const [errorMessage, setErrorMessage] = React.useState<string | null>(null);\n    const [announcement, setAnnouncement] = React.useState<string>('');\n\n    const isInverse = useIsInverse(isInverseProp);\n    const theme: ThemeInterface = React.useContext(ThemeContext);\n    const i18n: I18nInterface = React.useContext(I18nContext);\n    const id = useGenerateId(defaultId);\n    const helperMessageId = useGenerateId(`${id}-helper`);\n\n    const browseFileButtonRef = React.useRef<HTMLButtonElement>(null);\n\n    const onDrop = React.useCallback(\n      (acceptedFiles: FilePreview[], rejectedFiles: FileRejection[]) => {\n        const newFiles = [\n          ...acceptedFiles.map((file: FilePreview) =>\n            Object.assign(file, {\n              preview: URL.createObjectURL(file),\n            })\n          ),\n          ...rejectedFiles.map(\n            ({ file, errors }: { file: FilePreview; errors: FileError[] }) =>\n              Object.assign(file, {\n                errors,\n              })\n          ),\n        ];\n\n        setFiles((prevFiles: FilePreview[]) => [...prevFiles, ...newFiles]);\n\n        if (acceptedFiles.length > 0) {\n          const fileNames = acceptedFiles.map(file => file.name).join(', ');\n          const message =\n            acceptedFiles.length === 1\n              ? i18n.dropzone.fileAdded.replace(/\\{fileName\\}/g, fileNames)\n              : i18n.dropzone.filesAdded\n                  .replace(/\\{count\\}/g, acceptedFiles.length.toString())\n                  .replace(/\\{fileNames\\}/g, fileNames);\n\n          setAnnouncement(message);\n        }\n\n        browseFileButtonRef.current && browseFileButtonRef.current.focus();\n      },\n      [i18n]\n    );\n\n    const {\n      getInputProps,\n      getRootProps,\n      isDragAccept,\n      isDragActive,\n      isDragReject,\n      open,\n      inputRef,\n    } = useDropzone({\n      noClick: true,\n      disabled,\n      multiple,\n      maxSize,\n      minSize,\n      accept,\n      onDrop,\n      noDrag,\n      ...dropzoneOptions,\n    });\n\n    useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(\n      ref,\n      () => inputRef.current\n    );\n\n    const inputProps = getInputProps({ id });\n\n    let dragState = DragState.default;\n\n    if (errorMessage) {\n      dragState = DragState.error;\n    } else if (isDragAccept) {\n      dragState = DragState.dragAccept;\n    } else if (isDragReject) {\n      dragState = DragState.dragReject;\n    } else if (isDragActive) {\n      dragState = DragState.dragActive;\n    }\n\n    const handleRemoveFile = (removedFile: FilePreview) => {\n      setFiles(prevFiles => prevFiles.filter(file => file !== removedFile));\n\n      if (onRemoveFile && typeof onRemoveFile === 'function') {\n        onRemoveFile(removedFile);\n      }\n\n      const message = i18n.dropzone.fileRemoved.replace(\n        /\\{fileName\\}/g,\n        removedFile.name\n      );\n\n      setAnnouncement(message);\n\n      browseFileButtonRef.current && browseFileButtonRef.current.focus();\n    };\n\n    const handleDeleteFile = (removedFile: FilePreview) => {\n      setFiles(prevFiles => prevFiles.filter(file => file !== removedFile));\n\n      if (onDeleteFile && typeof onDeleteFile === 'function') {\n        onDeleteFile(removedFile);\n      }\n\n      const message = i18n.dropzone.fileDeleted.replace(\n        /\\{fileName\\}/g,\n        removedFile.name\n      );\n\n      setAnnouncement(message);\n\n      browseFileButtonRef.current && browseFileButtonRef.current.focus();\n    };\n\n    const setProgress = (progressProps: {\n      percent: number;\n      file: FilePreview;\n    }) => {\n      setFiles(prevFiles =>\n        prevFiles.map(file =>\n          file === progressProps.file\n            ? Object.assign(file, {\n                processor: {\n                  ...file.processor,\n                  percent: `${progressProps.percent}%`,\n                  status: 'pending',\n                },\n              })\n            : file\n        )\n      );\n\n      // Announce progress every 25% to avoid too many announcements\n      if (progressProps.percent > 0 && progressProps.percent % 25 === 0) {\n        const message = i18n.dropzone.fileUploading\n          .replace(/\\{fileName\\}/g, progressProps.file.name)\n          .replace(/\\{percent\\}/g, progressProps.percent.toString());\n\n        setAnnouncement(message);\n      }\n    };\n\n    const setFinished = (finishedProps: { file: FilePreview }) => {\n      setFiles(prevFiles =>\n        prevFiles.map(file =>\n          file === finishedProps.file\n            ? Object.assign(file, {\n                processor: {\n                  ...file.processor,\n                  percent: '',\n                  status: 'finished',\n                },\n              })\n            : file\n        )\n      );\n\n      // Announce successful upload\n      const message = i18n.dropzone.fileUploaded.replace(\n        /\\{fileName\\}/g,\n        finishedProps.file.name\n      );\n\n      setAnnouncement(message);\n    };\n\n    const setError = (errorProps: {\n      errors: FileError[];\n      file: FilePreview;\n    }) => {\n      setFiles(prevFiles =>\n        prevFiles.map(file =>\n          file === errorProps.file\n            ? Object.assign(file, {\n                errors: errorProps.errors,\n                processor: { ...file.processor, status: 'error' },\n              })\n            : file\n        )\n      );\n    };\n\n    React.useEffect(\n      () => () => {\n        files.forEach(\n          file => file.preview && URL.revokeObjectURL(file.preview)\n        );\n      },\n      [files]\n    );\n\n    React.useEffect(() => {\n      const formatError = (\n        code: string | null,\n        constraints: { maxFiles?: number; minFiles?: number }\n      ) => {\n        if (code === null) return null;\n        const error = i18n.dropzone.errors[code];\n\n        switch (code) {\n          case 'too-many-files':\n            return `${error.message} ${constraints.maxFiles} ${i18n.dropzone.files}.`;\n          case 'too-few-files':\n            return `${error.message} ${constraints.minFiles} ${i18n.dropzone.files}.`;\n          default:\n            return error.message;\n        }\n      };\n\n      const minFileError = minFiles && files.length < minFiles;\n      const maxFileError = maxFiles && files.length > maxFiles;\n\n      let errorCode: string | null = null;\n\n      if (maxFileError) {\n        errorCode = 'too-many-files';\n      } else if (minFileError) {\n        errorCode = 'too-few-files';\n      }\n\n      setErrorMessage(formatError(errorCode, { minFiles, maxFiles }));\n\n      if (sendFiles && files.length > 0 && !maxFileError && !minFileError) {\n        setFiles((prevFiles: FilePreview[]) => {\n          return prevFiles.map((file: FilePreview) => {\n            if (!file.errors && !file.processor && onSendFile) {\n              onSendFile({\n                file,\n                onError: setError,\n                onFinish: setFinished,\n                onProgress: setProgress,\n              });\n            }\n\n            return file;\n          });\n        });\n      }\n    }, [\n      sendFiles,\n      files.length,\n      onSendFile,\n      maxFiles,\n      minFiles,\n      i18n.dropzone.errors,\n      i18n.dropzone.files,\n    ]);\n\n    return (\n      <InverseContext.Provider value={{ isInverse }}>\n        <FormFieldContainer\n          actionable={false}\n          containerStyle={containerStyle}\n          errorMessage={errorMessage}\n          fieldId={id}\n          inputSize={inputSize}\n          isInverse={isInverse}\n          isLabelVisuallyHidden={isLabelVisuallyHidden}\n          labelStyle={{\n            color: isInverse ? theme.colors.neutral0 : theme.colors.brand.navy,\n            ...labelStyle,\n          }}\n          labelText={labelText}\n          messageStyle={{ minHeight: 0 }}\n          data-testid={testId}\n        >\n          <HelperMessage\n            id={helperMessageId}\n            theme={theme}\n            isInverse={isInverse}\n          >\n            {helperMessage}\n          </HelperMessage>\n          <Container\n            behavior={FlexBehavior.container}\n            dragState={dragState}\n            isInverse={isInverse}\n            noDrag={noDrag}\n            theme={theme}\n            {...getRootProps()}\n            {...rest}\n            testId={testId}\n            tabIndex={-1}\n          >\n            <input\n              ref={inputRef}\n              type={inputProps.type}\n              accept={inputProps.accept}\n              autoComplete={inputProps.autoComplete}\n              id={inputProps.id}\n              multiple={inputProps.multiple}\n              onChange={inputProps.onChange}\n              onClick={inputProps.onClick}\n              style={inputProps.style}\n              tabIndex={inputProps.tabIndex}\n              data-testid=\"file-input\"\n            />\n            {noDrag ? (\n              <Flex xs behavior={FlexBehavior.item}>\n                <Button\n                  color={ButtonColor.primary}\n                  disabled={disabled}\n                  isInverse={isInverse}\n                  onClick={open}\n                  style={{ margin: 0 }}\n                  ref={browseFileButtonRef}\n                  aria-describedby={helperMessage ? helperMessageId : undefined}\n                >\n                  {i18n.dropzone.browseFiles}\n                </Button>\n              </Flex>\n            ) : (\n              <Flex behavior={FlexBehavior.item}>\n                <CloudUploadIcon\n                  aria-hidden=\"true\"\n                  color={\n                    isInverse ? theme.colors.neutral0 : theme.colors.neutral700\n                  }\n                  size={48}\n                />\n                <Wrapper isInverse={isInverse} theme={theme}>\n                  {i18n.dropzone.dragMessage}\n                </Wrapper>\n                <Button\n                  color={ButtonColor.primary}\n                  disabled={disabled}\n                  isInverse={isInverse}\n                  onClick={open}\n                  style={{ margin: 0 }}\n                  variant={ButtonVariant.solid}\n                  ref={browseFileButtonRef}\n                  aria-describedby={helperMessage ? helperMessageId : undefined}\n                >\n                  {i18n.dropzone.browseFiles}\n                </Button>\n              </Flex>\n            )}\n          </Container>\n        </FormFieldContainer>\n        <PreviewList>\n          {files.map((file: FilePreview) => (\n            <PreviewItem key={file.name}>\n              <Preview\n                accept={accept}\n                file={file}\n                isInverse={isInverse}\n                maxSize={maxSize}\n                minSize={minSize}\n                onDeleteFile={handleDeleteFile}\n                onRemoveFile={handleRemoveFile}\n                thumbnails={thumbnails}\n              />\n            </PreviewItem>\n          ))}\n        </PreviewList>\n\n        <VisuallyHidden>\n          <Announce>{announcement}</Announce>\n        </VisuallyHidden>\n      </InverseContext.Provider>\n    );\n  }\n);\n","import React, { forwardRef, useContext, useEffect, useState } from 'react';\n\nimport {\n  ButtonColor,\n  ButtonVariant,\n  Card,\n  CardBorderRadius,\n  CardCornerTreatment,\n  Flex,\n  FlexAlignItems,\n  FlexBehavior,\n  FlexProps,\n  I18nContext,\n  I18nInterface,\n  IconButton,\n  InverseContext,\n  ThemeContext,\n  ThemeInterface,\n  Transition,\n  Spinner,\n  useIsInverse,\n  styled,\n} from 'react-magma-dom';\nimport {\n  CheckCircleIcon,\n  CloseIcon,\n  DeleteIcon,\n  ErrorIcon,\n} from 'react-magma-icons';\n\nimport { FileIcon } from './FileIcon';\nimport { FilePreview } from './FilePreview';\nimport { formatFileSize } from './utils';\n\nexport interface PreviewProps extends Omit<FlexProps, 'behavior'> {\n  accept?: string | string[];\n  file: FilePreview;\n  isInverse?: boolean;\n  maxSize?: number;\n  minSize?: number;\n  onDeleteFile?: (file: FilePreview) => void;\n  onRemoveFile?: (file: FilePreview) => void;\n  /**\n   * @internal\n   */\n  testId?: string;\n  thumbnails: boolean;\n}\n\nconst Thumb = styled.div<{ file: FilePreview }>`\n  background-image: ${({ file }) =>\n    `url('${'preview' in file && file.preview}')`};\n  background-repeat: no-repeat;\n  background-size: cover;\n  display: inline-block;\n  vertical-align: middle;\n  height: 40px;\n  width: 40px;\n`;\n\nconst StatusIcons = styled.div`\n  display: grid;\n  grid-template-areas: 'inner-div';\n  height: auto;\n  place-items: center;\n  width: 46px;\n  & > div {\n    display: inline-block;\n    right: 0;\n    grid-area: inner-div;\n  }\n`;\n\nconst PreviewIcon = ({\n  file,\n  isInverse,\n  theme,\n  thumbnails,\n}: {\n  file: FilePreview;\n  isInverse: boolean;\n  theme: ThemeInterface;\n  thumbnails: boolean;\n}) => {\n  if (file.errors) {\n    return (\n      <ErrorIcon\n        color={isInverse ? theme.colors.red500 : theme.colors.danger}\n        size={24}\n      />\n    );\n  }\n\n  if (\n    file.preview &&\n    thumbnails &&\n    file.type &&\n    file.type.startsWith('image')\n  ) {\n    return <Thumb role=\"img\" file={file} />;\n  }\n\n  return <FileIcon isInverse={isInverse} file={file} />;\n};\n\nconst IconStyles = {\n  marginRight: '12px',\n  display: 'flex',\n};\n\nconst Errors = styled.div<{ isInverse: boolean }>`\n  border-top: 1px solid\n    ${({ theme, isInverse }) =>\n      isInverse ? theme.colors.neutral500 : theme.colors.neutral300};\n  padding: 16px;\n  font-size: ${({ theme }) => theme.typeScale.size02.fontSize};\n  line-height: ${({ theme }) => theme.typeScale.size02.lineHeight};\n`;\n\nconst StyledFlex = styled(Flex)`\n  height: 56px;\n  padding: 0 8px 0 16px;\n  font-size: ${({ theme }) => theme.typeScale.size02.fontSize};\n  line-height: ${({ theme }) => theme.typeScale.size02.lineHeight};\n`;\n\nconst FileName = styled(Flex)`\n  overflow: hidden;\n  white-space: nowrap;\n  align-items: center;\n  text-overflow: ellipsis;\n  display: block;\n  margin-right: 24px;\n  font-size: ${({ theme }) => theme.typeScale.size02.fontSize};\n  line-height: ${({ theme }) => theme.typeScale.size02.lineHeight};\n`;\n\nconst StyledCard = styled(Card)<{ file: FilePreview; isInverse: boolean }>`\n  background-color: none;\n  border-color: ${({ file, theme, isInverse }) =>\n    file.errors\n      ? isInverse\n        ? theme.colors.red500\n        : theme.colors.danger\n      : isInverse\n        ? theme.colors.neutral800\n        : theme.colors.neutral200};\n  border-width: 1px;\n  color: ${({ file, theme, isInverse }) =>\n    isInverse\n      ? theme.colors.neutral0\n      : file.errors\n        ? theme.colors.neutral700\n        : theme.colors.brand.navy};\n  margin: 10px 0;\n`;\n\nconst ErrorHeader = styled.span`\n  display: block;\n\n  > div {\n    display: flex;\n    align-self: center;\n    margin-right: 12px;\n  }\n`;\n\nconst ErrorMessage = styled.span`\n  display: block;\n`;\n\nconst formatError = (\n  error: { header?: string; message: string; code: string },\n  constraints: {\n    maxSize?: number;\n    minSize?: number;\n    accept?: string | string[];\n  },\n  byteLabel: string\n) => {\n  const accept =\n    Array.isArray(constraints.accept) && constraints.accept.length === 1\n      ? constraints.accept[0]\n      : constraints.accept;\n  const messageSuffix = Array.isArray(accept)\n    ? `one of ${accept.join(', ')}`\n    : accept;\n\n  switch (error.code) {\n    case 'file-too-large':\n      return {\n        ...error,\n        message: `${error.message} ${formatFileSize(\n          constraints.maxSize,\n          2,\n          byteLabel\n        )}.`,\n      };\n    case 'file-too-small':\n      return {\n        ...error,\n        message: `${error.message} ${formatFileSize(\n          constraints.minSize,\n          2,\n          byteLabel\n        )}.`,\n      };\n    case 'file-invalid-type':\n      return { ...error, message: `${error.message}: ${messageSuffix}` };\n    default:\n      return error;\n  }\n};\n\nexport const Preview = forwardRef<\n  HTMLDivElement,\n  Omit<PreviewProps, 'children'>\n>((props, ref) => {\n  const {\n    accept,\n    file,\n    isInverse: isInverseProp,\n    maxSize,\n    minSize,\n    onDeleteFile,\n    onRemoveFile,\n    testId,\n    thumbnails,\n    ...rest\n  } = props;\n\n  const theme: ThemeInterface = useContext(ThemeContext);\n  const i18n: I18nInterface = React.useContext(I18nContext);\n  const isInverse = useIsInverse(isInverseProp);\n  const [actions, setActions] = useState(<CloseIcon />);\n\n  const handleRemoveFile = () => {\n    onRemoveFile && typeof onRemoveFile === 'function' && onRemoveFile(file);\n  };\n\n  const handleDeleteFile = () => {\n    onDeleteFile && typeof onDeleteFile === 'function' && onDeleteFile(file);\n  };\n\n  const FinishedActions = ({ status = 'ready' }: { status?: string }) => {\n    const [done, setDone] = useState<boolean>(false);\n\n    useEffect(() => {\n      let mounted = true;\n\n      setTimeout(() => {\n        if (mounted) {\n          setDone(true);\n        }\n      }, 1000);\n\n      return () => {\n        mounted = false;\n      };\n    }, [status]);\n\n    if (status === 'error' || status === 'ready') {\n      return (\n        <StatusIcons>\n          <IconButton\n            onClick={handleRemoveFile}\n            variant={ButtonVariant.link}\n            color={ButtonColor.subtle}\n            aria-label={`${i18n.dropzone.removeFile} ${file.name}`}\n            icon={<CloseIcon />}\n          />\n        </StatusIcons>\n      );\n    }\n\n    if (status === 'pending') {\n      return (\n        <StatusIcons>\n          <Spinner\n            color={\n              isInverse ? theme.colors.brand.skyBlue : theme.colors.primary\n            }\n          />\n        </StatusIcons>\n      );\n    }\n\n    return (\n      <StatusIcons>\n        <Transition isOpen={!done} unmountOnExit fade>\n          <CheckCircleIcon\n            color={isInverse ? theme.colors.green500 : theme.colors.success}\n            style={{ marginTop: '4px' }}\n          />\n        </Transition>\n        <Transition isOpen={done} unmountOnExit fade>\n          <IconButton\n            onClick={handleDeleteFile}\n            variant={ButtonVariant.link}\n            color={ButtonColor.subtle}\n            aria-label={`${i18n.dropzone.deleteFile} ${file.name}`}\n            icon={<DeleteIcon />}\n          />\n        </Transition>\n      </StatusIcons>\n    );\n  };\n\n  useEffect(() => {\n    setActions(<FinishedActions status={file?.processor?.status} />);\n  }, [file?.processor?.status]);\n\n  return (\n    <InverseContext.Provider value={{ isInverse }}>\n      <StyledCard\n        borderRadius={CardBorderRadius.small}\n        cornerTreatment={CardCornerTreatment.all}\n        isInverse={isInverse}\n        theme={theme}\n        file={file}\n        data-testid={props.testId}\n        ref={ref}\n        role={file.errors ? 'alert' : ''}\n      >\n        <StyledFlex\n          theme={theme}\n          behavior={FlexBehavior.container}\n          alignItems={FlexAlignItems.center}\n          {...rest}\n        >\n          <Flex\n            behavior={FlexBehavior.item}\n            alignItems={FlexAlignItems.center}\n            style={IconStyles}\n          >\n            <PreviewIcon\n              file={file}\n              isInverse={isInverse}\n              theme={theme}\n              thumbnails={thumbnails}\n            />\n          </Flex>\n          <FileName xs behavior={FlexBehavior.item} theme={theme}>\n            {file.name}\n          </FileName>\n          {file.processor && file.processor.status === 'pending' && (\n            <Flex\n              role=\"progressbar\"\n              style={{ marginLeft: 'auto' }}\n              behavior={FlexBehavior.item}\n            >\n              {file.processor.percent}\n            </Flex>\n          )}\n          <Flex behavior={FlexBehavior.item}>{actions}</Flex>\n        </StyledFlex>\n        {file.errors && (\n          <Errors theme={theme} isInverse={isInverse}>\n            {file.errors.slice(0, 1).map(({ code, ...rest }) => {\n              const { header = '', message } = formatError(\n                { code, ...rest, ...i18n.dropzone.errors[code] },\n                { accept, minSize, maxSize },\n                i18n.dropzone.bytes\n              );\n\n              return (\n                <React.Fragment key={code}>\n                  <ErrorHeader\n                    style={{\n                      color: isInverse\n                        ? theme.colors.red500\n                        : theme.colors.danger,\n                    }}\n                  >\n                    {header}\n                  </ErrorHeader>\n                  <ErrorMessage>{message}</ErrorMessage>\n                </React.Fragment>\n              );\n            })}\n          </Errors>\n        )}\n      </StyledCard>\n    </InverseContext.Provider>\n  );\n});\n"],"names":["icons","default","Icon","InsertDriveFileIcon","style","color","magma","colors","neutral700","inverseStyle","neutral300","word","FileWordIcon","blue500","excel","FileExcelIcon","green500","powerpoint","FilePowerpointIcon","tangerine600","tangerine500","pdf","FilePdfIcon","red600","red500","image","ImageIcon","video","VideocamIcon","audio","AudiotrackIcon","archive","FileZipIcon","iconMapping","xlsx","xlsm","xlsb","xltx","xls","xlt","doc","docx","docm","dotx","dotm","docb","pptx","pptm","ppt","png","svg","zip","FileIcon","_ref","file","isInverse","_file$path","path","_file$type","type","category","split","extension","pop","_ref2","_jsx","size","iconSizes","medium","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","DragState","formatFileSize","bytes","decimalPoint","bytesLabel","undefined","sizes","i","Math","floor","log","parseFloat","pow","toFixed","Thumb","styled","div","_taggedTemplateLiteralLoose","preview","StatusIcons","PreviewIcon","theme","thumbnails","errors","jsx","ErrorIcon","danger","startsWith","role","IconStyles","marginRight","display","Errors","_ref3","neutral500","_ref4","typeScale","size02","fontSize","_ref5","lineHeight","StyledFlex","Flex","_ref6","_ref7","FileName","_ref8","_ref9","StyledCard","Card","_templateObject6","_ref0","neutral800","neutral200","_ref1","neutral0","brand","navy","ErrorHeader","span","_templateObject7","ErrorMessage","_templateObject8","Preview","forwardRef","props","ref","_file$processor2","accept","isInverseProp","maxSize","minSize","onDeleteFile","onRemoveFile","rest","_objectWithoutPropertiesLoose","_excluded","useContext","ThemeContext","i18n","React","I18nContext","useIsInverse","_useState","useState","CloseIcon","actions","setActions","handleRemoveFile","handleDeleteFile","FinishedActions","_ref10","_ref10$status","status","_useState2","done","setDone","useEffect","mounted","setTimeout","children","IconButton","onClick","variant","ButtonVariant","link","ButtonColor","subtle","dropzone","removeFile","name","icon","Spinner","skyBlue","primary","_jsxs","Transition","isOpen","unmountOnExit","fade","CheckCircleIcon","success","marginTop","deleteFile","DeleteIcon","_file$processor","processor","InverseContext","Provider","value","borderRadius","CardBorderRadius","small","cornerTreatment","CardCornerTreatment","all","testId","_extends","behavior","FlexBehavior","container","alignItems","FlexAlignItems","center","item","xs","marginLeft","percent","slice","map","_ref11","code","_formatError","error","constraints","byteLabel","Array","isArray","length","messageSuffix","join","message","formatError","_excluded2","_formatError$header","header","Fragment","Container","noDrag","borderRadiusNone","borderRadiusSmall","_ref$dragState","dragState","dragReject","red400","getErrorBorderColor","dragActive","dragAccept","_ref7$dragState","transparentize","neutral1200","neutral100","HelperMessage","Wrapper","_ref12","spaceScale","spacing01","PreviewList","ul","PreviewItem","li","containerStyle","disabled","_props$dropzoneOption","dropzoneOptions","multiple","helperMessage","defaultId","id","inputSize","isLabelVisuallyHidden","labelStyle","labelText","maxFiles","minFiles","_props$multiple","_props$noDrag","onSendFile","_props$sendFiles","sendFiles","_props$thumbnails","_React$useState","files","setFiles","_React$useState2","errorMessage","setErrorMessage","_React$useState3","announcement","setAnnouncement","useGenerateId","helperMessageId","browseFileButtonRef","useRef","onDrop","useCallback","acceptedFiles","rejectedFiles","newFiles","concat","Object","assign","URL","createObjectURL","_ref13","prevFiles","fileNames","fileAdded","replace","filesAdded","toString","current","focus","_useDropzone","useDropzone","noClick","getInputProps","getRootProps","isDragAccept","isDragActive","isDragReject","open","inputRef","useImperativeHandle","inputProps","removedFile","filter","fileRemoved","fileDeleted","setProgress","progressProps","fileUploading","setFinished","finishedProps","fileUploaded","setError","errorProps","forEach","revokeObjectURL","minFileError","maxFileError","errorCode","onError","onFinish","onProgress","jsxs","FormFieldContainer","actionable","fieldId","messageStyle","minHeight","tabIndex","autoComplete","onChange","Button","margin","browseFiles","CloudUploadIcon","dragMessage","solid","VisuallyHidden","Announce"],"mappings":"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"}

package/dist/src/src/components/dropzone/Dropzone.d.ts

@@ -1,101 +1,101 @@
-/**
- * HELPFUL NOTE!
- * SINCE THIS PACKAGE USES `FILE` WE MUST USE `Object.assign` IN LIEU OF SPREADING
- * `{...file}` WILL NOT COPY ALL OF THE FILE PROPERTIES
- */
-import React from 'react';
-import { DropzoneOptions } from 'react-dropzone';
-import { FormFieldContainerBaseProps } from 'react-magma-dom';
-import { FilePreview, FileError } from './FilePreview';
-export interface OnSendFileProps {
-    file: FilePreview;
-    onError?: ({}: {
-        errors: FileError[];
-        file: FilePreview;
-    }) => void;
-    onFinish?: ({}: {
-        file: FilePreview;
-    }) => void;
-    onProgress?: ({}: {
-        percent: number;
-        file: FilePreview;
-    }) => void;
-}
-export interface DropzoneProps extends Omit<FormFieldContainerBaseProps, 'fieldId' | 'errorMessage'> {
-    /**
-     * Set accepted file types. See https://github.com/okonet/attr-accept for more information. Keep in mind that mime type determination is not reliable across platforms. CSV files, for example, are reported as text/plain under macOS but as application/vnd.ms-excel under Windows. In some cases there might not be a mime type set at all. See: https://github.com/react-dropzone/react-dropzone/issues/276
-     */
-    accept?: string | string[];
-    /**
-     * Enable/Disable the input
-     */
-    disabled?: boolean;
-    /**
-     * Additional props to pass to the dropzone, see https://react-dropzone.js.org/#src
-     */
-    dropzoneOptions?: Partial<Omit<DropzoneOptions, 'onDrop'>>;
-    /**
-     * Content of the helper message.
-     */
-    helperMessage?: string;
-    /**
-     * @internal
-     */
-    id?: string;
-    /**
-     * Maximum accepted number of files The default value is 0 which means there is no limitation to how many files are accepted.
-     * @default 0
-     */
-    maxFiles?: number;
-    /**
-     * Minimum accepted number of files.
-     */
-    minFiles?: number;
-    /**
-     * Maximum file size (in bytes)
-     * @default Infinity
-     */
-    maxSize?: number;
-    /**
-     * Minimum file size (in bytes)
-     * @default 0
-     */
-    minSize?: number;
-    /**
-     * Allow drag 'n' drop (or selection from the file dialog) of multiple files.
-     * @default true
-     */
-    multiple?: boolean;
-    /**
-     * If true, disables drag 'n' drop
-     * @default false
-     */
-    noDrag?: boolean;
-    /**
-     * Callback for when a file is deleted
-     */
-    onDeleteFile?: (file: FilePreview) => void;
-    /**
-     * Callback for when a file is deleted
-     */
-    onRemoveFile?: (file: FilePreview) => void;
-    /**
-     * Callback for when a file is added to the preview list via dropping or selecting. Will be ran on new files when `sendFiles` is true.
-     */
-    onSendFile?: (props: OnSendFileProps) => void;
-    /**
-     * Run `onSendFile` on any new files. Delay processing by setting to `false` until processing is desired.
-     * @default false
-     */
-    sendFiles?: boolean;
-    /**
-     * @internal
-     */
-    testId?: string;
-    /**
-     * Show thumbnails for images in lieu of the file icon.
-     * @default true
-     */
-    thumbnails?: boolean;
-}
-export declare const Dropzone: React.ForwardRefExoticComponent<DropzoneProps & React.RefAttributes<HTMLInputElement>>;
+/**
+ * HELPFUL NOTE!
+ * SINCE THIS PACKAGE USES `FILE` WE MUST USE `Object.assign` IN LIEU OF SPREADING
+ * `{...file}` WILL NOT COPY ALL OF THE FILE PROPERTIES
+ */
+import React from 'react';
+import { DropzoneOptions } from 'react-dropzone';
+import { FormFieldContainerBaseProps } from 'react-magma-dom';
+import { FilePreview, FileError } from './FilePreview';
+export interface OnSendFileProps {
+    file: FilePreview;
+    onError?: ({}: {
+        errors: FileError[];
+        file: FilePreview;
+    }) => void;
+    onFinish?: ({}: {
+        file: FilePreview;
+    }) => void;
+    onProgress?: ({}: {
+        percent: number;
+        file: FilePreview;
+    }) => void;
+}
+export interface DropzoneProps extends Omit<FormFieldContainerBaseProps, 'fieldId' | 'errorMessage'> {
+    /**
+     * Set accepted file types. See https://github.com/okonet/attr-accept for more information. Keep in mind that mime type determination is not reliable across platforms. CSV files, for example, are reported as text/plain under macOS but as application/vnd.ms-excel under Windows. In some cases there might not be a mime type set at all. See: https://github.com/react-dropzone/react-dropzone/issues/276
+     */
+    accept?: string | string[];
+    /**
+     * Enable/Disable the input
+     */
+    disabled?: boolean;
+    /**
+     * Additional props to pass to the dropzone, see https://react-dropzone.js.org/#src
+     */
+    dropzoneOptions?: Partial<Omit<DropzoneOptions, 'onDrop'>>;
+    /**
+     * Content of the helper message.
+     */
+    helperMessage?: string;
+    /**
+     * @internal
+     */
+    id?: string;
+    /**
+     * Maximum accepted number of files The default value is 0 which means there is no limitation to how many files are accepted.
+     * @default 0
+     */
+    maxFiles?: number;
+    /**
+     * Minimum accepted number of files.
+     */
+    minFiles?: number;
+    /**
+     * Maximum file size (in bytes)
+     * @default Infinity
+     */
+    maxSize?: number;
+    /**
+     * Minimum file size (in bytes)
+     * @default 0
+     */
+    minSize?: number;
+    /**
+     * Allow drag 'n' drop (or selection from the file dialog) of multiple files.
+     * @default true
+     */
+    multiple?: boolean;
+    /**
+     * If true, disables drag 'n' drop
+     * @default false
+     */
+    noDrag?: boolean;
+    /**
+     * Callback for when a file is deleted
+     */
+    onDeleteFile?: (file: FilePreview) => void;
+    /**
+     * Callback for when a file is deleted
+     */
+    onRemoveFile?: (file: FilePreview) => void;
+    /**
+     * Callback for when a file is added to the preview list via dropping or selecting. Will be ran on new files when `sendFiles` is true.
+     */
+    onSendFile?: (props: OnSendFileProps) => void;
+    /**
+     * Run `onSendFile` on any new files. Delay processing by setting to `false` until processing is desired.
+     * @default false
+     */
+    sendFiles?: boolean;
+    /**
+     * @internal
+     */
+    testId?: string;
+    /**
+     * Show thumbnails for images in lieu of the file icon.
+     * @default true
+     */
+    thumbnails?: boolean;
+}
+export declare const Dropzone: React.ForwardRefExoticComponent<DropzoneProps & React.RefAttributes<HTMLInputElement>>;

package/dist/src/src/components/dropzone/Dropzone.stories.d.ts

@@ -0,0 +1,48 @@
+import React from 'react';
+import { DropzoneProps } from './Dropzone';
+declare const _default: {
+    component: React.ForwardRefExoticComponent<DropzoneProps & React.RefAttributes<HTMLInputElement>>;
+    title: string;
+    argTypes: {
+        noDrag: {
+            control: {
+                type: string;
+            };
+            defaultValue: boolean;
+        };
+        isInverse: {
+            control: {
+                type: string;
+            };
+            defaultValue: boolean;
+        };
+        sendFiles: {
+            control: {
+                type: string;
+            };
+            defaultValue: boolean;
+        };
+        thumbnails: {
+            control: {
+                type: string;
+            };
+            defaultValue: boolean;
+        };
+    };
+};
+export default _default;
+export declare const Default: {
+    render: (args: DropzoneProps) => JSX.Element;
+};
+export declare const NoLimits: {
+    render: (args: DropzoneProps) => JSX.Element;
+};
+export declare const Image: {
+    render: (args: DropzoneProps) => JSX.Element;
+};
+export declare const Text: {
+    render: (args: DropzoneProps) => JSX.Element;
+};
+export declare const Csv: {
+    render: (args: DropzoneProps) => JSX.Element;
+};

package/dist/src/src/components/dropzone/Dropzone.test.d.ts

@@ -1 +1 @@
-export {};
+export {};

package/dist/src/src/components/dropzone/FileIcon.d.ts

@@ -1,7 +1,8 @@
-import { IconProps } from 'react-magma-icons';
-import { FilePreview } from './FilePreview';
-export interface FileIconProps extends IconProps {
-    file: FilePreview;
-    isInverse?: boolean;
-}
-export declare const FileIcon: ({ file, isInverse }: FileIconProps) => JSX.Element;
+/// <reference types="react" />
+import { IconProps } from 'react-magma-icons';
+import { FilePreview } from './FilePreview';
+export interface FileIconProps extends IconProps {
+    file: FilePreview;
+    isInverse?: boolean;
+}
+export declare const FileIcon: ({ file, isInverse }: FileIconProps) => JSX.Element;

package/dist/src/src/components/dropzone/FilePreview.d.ts

@@ -1,15 +1,15 @@
-import { FileWithPath } from 'react-dropzone';
-export interface FileError {
-    header?: string;
-    message: string;
-    code: 'file-too-large' | 'file-too-small' | 'too-many-files' | 'file-invalid-type' | string;
-}
-export interface FilePreview extends FileWithPath {
-    preview?: string;
-    errors?: FileError[];
-    processor?: {
-        percent?: string;
-        status?: string;
-        error?: string;
-    };
-}
+import { FileWithPath } from 'react-dropzone';
+export interface FileError {
+    header?: string;
+    message: string;
+    code: 'file-too-large' | 'file-too-small' | 'too-many-files' | 'file-invalid-type' | string;
+}
+export interface FilePreview extends FileWithPath {
+    preview?: string;
+    errors?: FileError[];
+    processor?: {
+        percent?: string;
+        status?: string;
+        error?: string;
+    };
+}

package/dist/src/src/components/dropzone/Preview.d.ts

@@ -1,18 +1,18 @@
-import React from 'react';
-import { FlexProps } from 'react-magma-dom';
-import { FilePreview } from './FilePreview';
-export interface PreviewProps extends Omit<FlexProps, 'behavior'> {
-    accept?: string | string[];
-    file: FilePreview;
-    isInverse?: boolean;
-    maxSize?: number;
-    minSize?: number;
-    onDeleteFile?: (file: FilePreview) => void;
-    onRemoveFile?: (file: FilePreview) => void;
-    /**
-     * @internal
-     */
-    testId?: string;
-    thumbnails: boolean;
-}
-export declare const Preview: React.ForwardRefExoticComponent<Omit<PreviewProps, "children"> & React.RefAttributes<HTMLDivElement>>;
+import React from 'react';
+import { FlexProps } from 'react-magma-dom';
+import { FilePreview } from './FilePreview';
+export interface PreviewProps extends Omit<FlexProps, 'behavior'> {
+    accept?: string | string[];
+    file: FilePreview;
+    isInverse?: boolean;
+    maxSize?: number;
+    minSize?: number;
+    onDeleteFile?: (file: FilePreview) => void;
+    onRemoveFile?: (file: FilePreview) => void;
+    /**
+     * @internal
+     */
+    testId?: string;
+    thumbnails: boolean;
+}
+export declare const Preview: React.ForwardRefExoticComponent<Pick<PreviewProps, "isInverse" | "testId" | "accept" | "id" | "maxSize" | "minSize" | "onDeleteFile" | "onRemoveFile" | "thumbnails" | "onProgress" | "file" | "slot" | "style" | "title" | "onDragEnter" | "onDragOver" | "onDragLeave" | "onDrop" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "hidden" | "lang" | "nonce" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeaveCapture" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "alignContent" | "alignItems" | "direction" | "justify" | "spacing" | "wrap" | "xs" | "sm" | "md" | "lg" | "xl"> & React.RefAttributes<HTMLDivElement>>;