@react-magma/dropzone 7.0.0-next.1 → 7.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"fileuploader.modern.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';\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';\nimport { magma } from 'react-magma-dom';\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: number = 2,\n bytesLabel: string = '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","import React, { forwardRef, useContext, useEffect, useState } from 'react';\n\nimport {\n CheckCircleIcon,\n CloseIcon,\n DeleteIcon,\n ErrorIcon,\n} from 'react-magma-icons';\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 styled,\n useIsInverse,\n} from 'react-magma-dom';\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.danger200\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 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<HTMLDivElement, PreviewProps>(\n // eslint-disable-next-line complexity\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 setTimeout(() => {\n if (mounted) {\n setDone(true);\n }\n }, 1000);\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}\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}\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={\n isInverse ? theme.colors.danger200 : theme.colors.danger\n }\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 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);\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 from 'react';\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 styled,\n useGenerateId,\n useIsInverse,\n} from 'react-magma-dom';\n\nimport { CloudUploadIcon } from 'react-magma-icons';\nimport { Preview } from './Preview';\nimport { FilePreview, FileError } from './FilePreview';\nimport { transparentize } from 'polished';\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.danger200}`\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`;\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\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\n const onDrop = React.useCallback(\n (acceptedFiles: FilePreview[], rejectedFiles: FileRejection[]) => {\n setFiles((files: FilePreview[]) => [\n ...files,\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 []\n );\n\n const {\n getInputProps,\n getRootProps,\n isDragAccept,\n isDragActive,\n isDragReject,\n open,\n } = useDropzone({\n noClick: true,\n disabled,\n multiple,\n maxSize,\n minSize,\n accept,\n onDrop,\n noDrag,\n });\n\n const inputProps = getInputProps({ id });\n\n const dragState: DragState = errorMessage\n ? 'error'\n : isDragAccept\n ? 'dragAccept'\n : isDragReject\n ? 'dragReject'\n : isDragActive\n ? 'dragActive'\n : 'default';\n\n const handleRemoveFile = (removedFile: FilePreview) => {\n setFiles(files => files.filter(file => file !== removedFile));\n onRemoveFile &&\n typeof onRemoveFile === 'function' &&\n onRemoveFile(removedFile);\n };\n\n const handleDeleteFile = (removedFile: FilePreview) => {\n setFiles(files => files.filter(file => file !== removedFile));\n onDeleteFile &&\n typeof onDeleteFile === 'function' &&\n onDeleteFile(removedFile);\n };\n\n const setProgress = (props: { percent: number; file: FilePreview }) => {\n setFiles(files =>\n files.map(file =>\n file === props.file\n ? Object.assign(file, {\n processor: {\n ...file.processor,\n percent: `${props.percent}%`,\n status: 'pending',\n },\n })\n : file\n )\n );\n };\n\n const setFinished = (props: { file: FilePreview }) => {\n setFiles(files =>\n files.map(file =>\n file === props.file\n ? Object.assign(file, {\n processor: {\n ...file.processor,\n percent: '',\n status: 'finished',\n },\n })\n : file\n )\n );\n };\n\n const setError = (props: { errors: FileError[]; file: FilePreview }) => {\n setFiles(files =>\n files.map(file =>\n file === props.file\n ? Object.assign(file, {\n errors: props.errors,\n processor: { ...file.processor, status: 'error' },\n })\n : file\n )\n );\n };\n\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 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 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 minFileError = minFiles && files.length < minFiles;\n const maxFileError = maxFiles && files.length > maxFiles;\n\n setErrorMessage(\n formatError(\n maxFileError\n ? 'too-many-files'\n : minFileError\n ? 'too-few-files'\n : null,\n { minFiles, maxFiles }\n )\n );\n\n if (sendFiles && files.length > 0 && !maxFileError && !minFileError) {\n setFiles((files: FilePreview[]) => {\n return files.map((file: FilePreview) => {\n !file.errors &&\n !file.processor &&\n onSendFile &&\n onSendFile({\n file,\n onError: setError,\n onFinish: setFinished,\n onProgress: setProgress,\n });\n return file;\n });\n });\n }\n }, [sendFiles, files.length, onSendFile]);\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 theme={theme} isInverse={isInverse}>\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={ref}\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 />\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 >\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 >\n {i18n.dropzone.browseFiles}\n </Button>\n </Flex>\n )}\n </Container>\n </FormFieldContainer>\n {files.map((file: FilePreview) => (\n <Preview\n accept={accept}\n file={file}\n isInverse={isInverse}\n key={file.name}\n maxSize={maxSize}\n minSize={minSize}\n onDeleteFile={handleDeleteFile}\n onRemoveFile={handleRemoveFile}\n thumbnails={thumbnails}\n />\n ))}\n </InverseContext.Provider>\n );\n }\n);\n"],"names":["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","icons","xlsx","xlsm","xlsb","xltx","xls","xlt","doc","docx","docm","dotx","dotm","docb","pptx","pptm","ppt","png","svg","zip","file","isInverse","path","type","split","pop","iconMapping","extension","category","_jsx","size","iconSizes","medium","bytes","decimalPoint","bytesLabel","undefined","Math","floor","log","pow","i","toFixed","sizes","styled","div","preview","marginRight","display","theme","neutral300","typeScale","size02","fontSize","lineHeight","Flex","Card","errors","danger200","danger","span","forwardRef","props","ref","accept","isInverseProp","maxSize","minSize","onDeleteFile","onRemoveFile","thumbnails","rest","useContext","ThemeContext","React","I18nContext","useIsInverse","actions","setActions","useState","CloseIcon","status","done","setDone","useEffect","setTimeout","mounted","StatusIcons","IconButton","onClick","handleRemoveFile","variant","ButtonVariant","link","ButtonColor","secondary","i18n","dropzone","removeFile","icon","Spinner","neutral100","primary","_jsxs","Transition","isOpen","unmountOnExit","fade","CheckCircleIcon","success200","success","marginTop","handleDeleteFile","deleteFile","DeleteIcon","FinishedActions","processor","_file$processor","_file$processor2","InverseContext","Provider","value","StyledCard","testId","role","StyledFlex","behavior","FlexBehavior","container","alignItems","FlexAlignItems","center","item","IconStyles","ErrorIcon","startsWith","Thumb","FileIcon","FileName","xs","name","marginLeft","percent","Errors","slice","map","_ref","code","header","message","error","constraints","byteLabel","Array","isArray","length","join","formatFileSize","messageSuffix","formatError","Fragment","ErrorHeader","ErrorMessage","noDrag","dragState","neutral400","transparentize","neutral900","neutral200","neutral700","spaceScale","spacing01","containerStyle","disabled","dropzoneOptions","multiple","helperMessage","id","defaultId","inputSize","isLabelVisuallyHidden","labelStyle","labelText","maxFiles","minFiles","onSendFile","sendFiles","files","setFiles","errorMessage","setErrorMessage","useGenerateId","useCallback","acceptedFiles","rejectedFiles","Object","assign","URL","createObjectURL","getInputProps","getRootProps","isDragAccept","isDragActive","isDragReject","open","useDropzone","noClick","onDrop","removedFile","filter","forEach","revokeObjectURL","maxFileError","minFileError","onError","setError","onFinish","setFinished","onProgress","setProgress","FormFieldContainer","actionable","fieldId","messageStyle","minHeight","HelperMessage","Container","tabIndex","inputProps","autoComplete","onChange","Button","margin","browseFiles","CloudUploadIcon","Wrapper","dragMessage","solid","Preview"],"mappings":"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"}
1
+ {"version":3,"file":"fileuploader.modern.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';\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';\nimport { magma } from 'react-magma-dom';\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: number = 2,\n bytesLabel: string = '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","import React, { forwardRef, useContext, useEffect, useState } from 'react';\n\nimport {\n CheckCircleIcon,\n CloseIcon,\n DeleteIcon,\n ErrorIcon,\n} from 'react-magma-icons';\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} from 'react-magma-dom';\n\nimport { FileIcon } from './FileIcon';\nimport { FilePreview } from './FilePreview';\nimport { formatFileSize } from './utils';\n\nimport styled, { CreateStyled } from '@emotion/styled';\n\nconst typedStyled = styled as CreateStyled<ThemeInterface>;\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 = typedStyled.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 = typedStyled.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 = typedStyled.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 = typedStyled(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 = typedStyled(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 = typedStyled(Card)<{ file: FilePreview; isInverse: boolean }>`\n background-color: none;\n border-color: ${({ file, theme, isInverse }) =>\n file.errors\n ? isInverse\n ? theme.colors.danger200\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 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<HTMLDivElement, PreviewProps>(\n // eslint-disable-next-line complexity\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 setTimeout(() => {\n if (mounted) {\n setDone(true);\n }\n }, 1000);\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}\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}\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={\n isInverse ? theme.colors.danger200 : theme.colors.danger\n }\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 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);\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 from 'react';\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} from 'react-magma-dom';\n\nimport { CloudUploadIcon } from 'react-magma-icons';\nimport { Preview } from './Preview';\nimport { FilePreview, FileError } from './FilePreview';\nimport { transparentize } from 'polished';\nimport styled, { CreateStyled } from '@emotion/styled';\n\nconst typedStyled = styled as CreateStyled<ThemeInterface>;\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 = typedStyled(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.danger200}`\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 = typedStyled.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 = typedStyled.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`;\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\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\n const onDrop = React.useCallback(\n (acceptedFiles: FilePreview[], rejectedFiles: FileRejection[]) => {\n setFiles((files: FilePreview[]) => [\n ...files,\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 []\n );\n\n const {\n getInputProps,\n getRootProps,\n isDragAccept,\n isDragActive,\n isDragReject,\n open,\n } = useDropzone({\n noClick: true,\n disabled,\n multiple,\n maxSize,\n minSize,\n accept,\n onDrop,\n noDrag,\n });\n\n const inputProps = getInputProps({ id });\n\n const dragState: DragState = errorMessage\n ? 'error'\n : isDragAccept\n ? 'dragAccept'\n : isDragReject\n ? 'dragReject'\n : isDragActive\n ? 'dragActive'\n : 'default';\n\n const handleRemoveFile = (removedFile: FilePreview) => {\n setFiles(files => files.filter(file => file !== removedFile));\n onRemoveFile &&\n typeof onRemoveFile === 'function' &&\n onRemoveFile(removedFile);\n };\n\n const handleDeleteFile = (removedFile: FilePreview) => {\n setFiles(files => files.filter(file => file !== removedFile));\n onDeleteFile &&\n typeof onDeleteFile === 'function' &&\n onDeleteFile(removedFile);\n };\n\n const setProgress = (props: { percent: number; file: FilePreview }) => {\n setFiles(files =>\n files.map(file =>\n file === props.file\n ? Object.assign(file, {\n processor: {\n ...file.processor,\n percent: `${props.percent}%`,\n status: 'pending',\n },\n })\n : file\n )\n );\n };\n\n const setFinished = (props: { file: FilePreview }) => {\n setFiles(files =>\n files.map(file =>\n file === props.file\n ? Object.assign(file, {\n processor: {\n ...file.processor,\n percent: '',\n status: 'finished',\n },\n })\n : file\n )\n );\n };\n\n const setError = (props: { errors: FileError[]; file: FilePreview }) => {\n setFiles(files =>\n files.map(file =>\n file === props.file\n ? Object.assign(file, {\n errors: props.errors,\n processor: { ...file.processor, status: 'error' },\n })\n : file\n )\n );\n };\n\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 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 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 minFileError = minFiles && files.length < minFiles;\n const maxFileError = maxFiles && files.length > maxFiles;\n\n setErrorMessage(\n formatError(\n maxFileError\n ? 'too-many-files'\n : minFileError\n ? 'too-few-files'\n : null,\n { minFiles, maxFiles }\n )\n );\n\n if (sendFiles && files.length > 0 && !maxFileError && !minFileError) {\n setFiles((files: FilePreview[]) => {\n return files.map((file: FilePreview) => {\n !file.errors &&\n !file.processor &&\n onSendFile &&\n onSendFile({\n file,\n onError: setError,\n onFinish: setFinished,\n onProgress: setProgress,\n });\n return file;\n });\n });\n }\n }, [sendFiles, files.length, onSendFile]);\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 theme={theme} isInverse={isInverse}>\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={ref}\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 />\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 >\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 >\n {i18n.dropzone.browseFiles}\n </Button>\n </Flex>\n )}\n </Container>\n </FormFieldContainer>\n {files.map((file: FilePreview) => (\n <Preview\n accept={accept}\n file={file}\n isInverse={isInverse}\n key={file.name}\n maxSize={maxSize}\n minSize={minSize}\n onDeleteFile={handleDeleteFile}\n onRemoveFile={handleRemoveFile}\n thumbnails={thumbnails}\n />\n ))}\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","file","isInverse","path","type","category","split","extension","pop","_jsx","size","iconSizes","medium","formatFileSize","bytes","decimalPoint","bytesLabel","undefined","sizes","i","Math","floor","log","parseFloat","pow","toFixed","typedStyled","styled","Thumb","div","_t","_","preview","StatusIcons","_t2","IconStyles","marginRight","display","Errors","_t3","theme","neutral300","typeScale","size02","fontSize","lineHeight","StyledFlex","Flex","_t4","FileName","_t5","StyledCard","Card","_t6","errors","danger200","danger","ErrorHeader","span","_t7","ErrorMessage","_t8","Preview","forwardRef","props","ref","accept","isInverseProp","maxSize","minSize","onDeleteFile","onRemoveFile","thumbnails","rest","_objectWithoutPropertiesLoose","_excluded","useContext","ThemeContext","i18n","React","I18nContext","useIsInverse","actions","setActions","useState","CloseIcon","handleRemoveFile","handleDeleteFile","FinishedActions","status","done","setDone","useEffect","mounted","setTimeout","children","IconButton","onClick","variant","ButtonVariant","link","ButtonColor","secondary","dropzone","removeFile","icon","Spinner","neutral100","primary","_jsxs","Transition","isOpen","unmountOnExit","fade","CheckCircleIcon","success200","success","marginTop","deleteFile","DeleteIcon","_file$processor","processor","_file$processor2","InverseContext","Provider","value","testId","role","_extends","behavior","FlexBehavior","container","alignItems","FlexAlignItems","center","item","ErrorIcon","startsWith","xs","name","marginLeft","percent","slice","map","_ref","code","_excluded2","header","message","formatError","error","constraints","byteLabel","Array","isArray","length","messageSuffix","join","Fragment","Container","noDrag","dragState","neutral400","transparentize","neutral900","neutral200","HelperMessage","neutral700","Wrapper","spaceScale","spacing01","Dropzone","containerStyle","disabled","dropzoneOptions","multiple","helperMessage","id","defaultId","inputSize","isLabelVisuallyHidden","labelStyle","labelText","maxFiles","minFiles","onSendFile","sendFiles","files","setFiles","errorMessage","setErrorMessage","useGenerateId","onDrop","useCallback","acceptedFiles","rejectedFiles","Object","assign","URL","createObjectURL","getInputProps","getRootProps","isDragAccept","isDragActive","isDragReject","open","useDropzone","noClick","inputProps","removedFile","filter","setProgress","setFinished","setError","forEach","revokeObjectURL","minFileError","maxFileError","onError","onFinish","onProgress","FormFieldContainer","actionable","fieldId","messageStyle","minHeight","tabIndex","autoComplete","onChange","Button","margin","browseFiles","CloudUploadIcon","dragMessage","solid"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{InsertDriveFileIcon as e,FileWordIcon as n,FileExcelIcon as r,FilePowerpointIcon as t,FilePdfIcon as o,ImageIcon as i,VideocamIcon as l,AudiotrackIcon as s,FileZipIcon as a,CloseIcon as c,ErrorIcon as u,CheckCircleIcon as d,DeleteIcon as p,CloudUploadIcon as f}from"react-magma-icons";import{magma as m,styled as g,Flex as h,Card as v,ThemeContext as x,I18nContext as y,useIsInverse as b,InverseContext as z,FlexBehavior as S,FlexAlignItems as I,IconButton as w,ButtonVariant as F,ButtonColor as k,Spinner as D,Transition as O,useGenerateId as j,FormFieldContainer as C,Button as R}from"react-magma-dom";import{jsx as A,jsxs as B}from"react/jsx-runtime";import M,{forwardRef as H,useContext as L,useState as E,useEffect as P}from"react";import{useDropzone as T}from"react-dropzone";import{transparentize as U}from"polished";var V={default:{Icon:e,style:{color:m.colors.neutral500}},word:{Icon:n,style:{color:m.colors.info500}},excel:{Icon:r,style:{color:m.colors.success500}},powerpoint:{Icon:t,style:{color:m.colors.warning500}},pdf:{Icon:o,style:{color:m.colors.danger500}},image:{Icon:i,style:{color:m.colors.neutral500}},video:{Icon:l,style:{color:m.colors.neutral500}},audio:{Icon:s,style:{color:m.colors.neutral500}},archive:{Icon:a,style:{color:m.colors.neutral500}}},G={default:V.default,xlsx:V.excel,xlsm:V.excel,xlsb:V.excel,xltx:V.excel,xls:V.excel,xlt:V.excel,doc:V.word,docx:V.word,docm:V.word,dotx:V.word,dotm:V.word,docb:V.word,pptx:V.powerpoint,pptm:V.powerpoint,ppt:V.powerpoint,pdf:V.pdf,png:V.image,svg:V.image,image:V.image,audio:V.audio,video:V.video,zip:V.archive},K=function(e){var n=e.file,r=e.isInverse,t=n.path,o=void 0===t?"":t,i=n.type,l=(void 0===i?"":i).split("/")[0],s=o.split(".").pop()||"default",a=G[s]||G[l]||G.default;return A(a.Icon,{size:m.iconSizes.medium,style:r?{}:a.style})};function W(){return W=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t])}return e},W.apply(this,arguments)}function Y(e,n){if(null==e)return{};var r,t,o={},i=Object.keys(e);for(t=0;t<i.length;t++)n.indexOf(r=i[t])>=0||(o[r]=e[r]);return o}function Z(e,n){return n||(n=e.slice(0)),e.raw=n,e}var q,J,N,Q,X,$,_,ee,ne,re,te,oe=function(e,n,r){if(void 0===n&&(n=2),void 0===r&&(r="Bytes"),void 0!==e){if(0==e)return"0 "+r;var t=[r,"KB","MB","GB","TB","PB","EB","ZB","YB"],o=Math.floor(Math.log(e)/Math.log(1024));return parseFloat((e/Math.pow(1024,o)).toFixed(n))+" "+t[o]}},ie=["accept","file","isInverse","maxSize","minSize","onDeleteFile","onRemoveFile","testId","thumbnails"],le=["code"],se=g.div(q||(q=Z(["\n background-image: ",";\n background-repeat: no-repeat;\n background-size: cover;\n display: inline-block;\n vertical-align: middle;\n height: 40px;\n width: 40px;\n"])),function(e){var n=e.file;return"url('"+("preview"in n&&n.preview)+"')"}),ae=g.div(J||(J=Z(["\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"]))),ce={marginRight:"12px",display:"flex"},ue=g.div(N||(N=Z(["\n border-top: 1px solid ",";\n padding: 16px;\n font-size: ",";\n line-height: ",";\n"])),function(e){return e.theme.colors.neutral300},function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight}),de=g(h)(Q||(Q=Z(["\n height: 56px;\n padding: 0 8px 0 16px;\n font-size: ",";\n line-height: ",";\n"])),function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight}),pe=g(h)(X||(X=Z(["\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: ",";\n line-height: ",";\n"])),function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight}),fe=g(v)($||($=Z(["\n background-color: none;\n border-color: ",";\n border-width: 1px;\n margin: 10px 0;\n"])),function(e){var n=e.theme;return e.file.errors?e.isInverse?n.colors.danger200:n.colors.danger:n.colors.neutral300}),me=g.span(_||(_=Z(["\n display: block;\n\n > div {\n display: flex;\n align-self: center;\n margin-right: 12px;\n }\n"]))),ge=g.span(ee||(ee=Z(["\n display: block;\n"]))),he=H(function(e,n){var r,t=e.accept,o=e.file,i=e.isInverse,l=e.maxSize,s=e.minSize,a=e.onDeleteFile,f=e.onRemoveFile,m=e.thumbnails,g=Y(e,ie),v=L(x),j=M.useContext(y),C=b(i),R=E(A(c,{})),H=R[0],T=R[1],U=function(){f&&"function"==typeof f&&f(o)},V=function(){a&&"function"==typeof a&&a(o)},G=function(e){var n=e.status,r=void 0===n?"ready":n,t=E(!1),o=t[0],i=t[1];return P(function(){var e=!0;return setTimeout(function(){e&&i(!0)},1e3),function(){e=!1}},[r]),"error"===r||"ready"===r?A(ae,{children:A(w,{onClick:U,variant:F.link,color:k.secondary,"aria-label":j.dropzone.removeFile,icon:A(c,{})})}):"pending"===r?A(ae,{children:A(D,{color:C?v.colors.neutral100:v.colors.primary})}):B(ae,{children:[A(O,{isOpen:!o,unmountOnExit:!0,fade:!0,children:A(d,{color:C?v.colors.success200:v.colors.success,style:{marginTop:"4px"}})}),A(O,{isOpen:o,unmountOnExit:!0,fade:!0,children:A(w,{onClick:V,variant:F.link,color:k.secondary,"aria-label":j.dropzone.deleteFile,icon:A(p,{})})})]})};return P(function(){var e;T(A(G,{status:null==o||null==(e=o.processor)?void 0:e.status}))},[null==o||null==(r=o.processor)?void 0:r.status]),A(z.Provider,{value:{isInverse:C},children:B(fe,{isInverse:C,theme:v,file:o,"data-testid":e.testId,ref:n,role:o.errors?"alert":"",children:[B(de,W({theme:v,behavior:S.container,alignItems:I.center},g,{children:[A(h,{behavior:S.item,alignItems:I.center,style:ce,children:o.errors?A(u,{color:C?v.colors.danger200:v.colors.danger,size:24}):o.preview&&m&&o.type&&o.type.startsWith("image")?A(se,{role:"img",file:o}):A(K,{isInverse:C,file:o})}),A(pe,{xs:!0,behavior:S.item,theme:v,children:o.name}),o.processor&&"pending"===o.processor.status&&A(h,{role:"progressbar",style:{marginLeft:"auto"},behavior:S.item,children:o.processor.percent}),A(h,{behavior:S.item,children:H})]})),o.errors&&A(ue,{theme:v,children:o.errors.slice(0,1).map(function(e){var n=e.code,r=function(e,n,r){var t=Array.isArray(n.accept)&&1===n.accept.length?n.accept[0]:n.accept,o=Array.isArray(t)?"one of "+t.join(", "):t;switch(e.code){case"file-too-large":return W({},e,{message:e.message+" "+oe(n.maxSize,2,r)+"."});case"file-too-small":return W({},e,{message:e.message+" "+oe(n.minSize,2,r)+"."});case"file-invalid-type":return W({},e,{message:e.message+": "+o});default:return e}}(W({code:n},Y(e,le),j.dropzone.errors[n]),{accept:t,minSize:s,maxSize:l},j.dropzone.bytes),o=r.header,i=r.message;return B(M.Fragment,{children:[A(me,{style:{color:C?v.colors.danger200:v.colors.danger},children:void 0===o?"":o}),A(ge,{children:i})]},n)})})]})})}),ve=["accept","containerStyle","disabled","dropzoneOptions","helperMessage","id","inputSize","isInverse","isLabelVisuallyHidden","labelStyle","labelText","maxFiles","minFiles","maxSize","minSize","multiple","noDrag","onSendFile","onDeleteFile","onRemoveFile","sendFiles","testId","thumbnails"],xe=g(h)(ne||(ne=Z(["\n flex-direction: column;\n align-items: ",";\n justify-content: ",";\n text-align: ",";\n padding: ",";\n border-radius: ",";\n border: ",";\n\n border-style: ",";\n background-color: ",";\n outline: none;\n transition: ",";\n"])),function(e){return e.noDrag?"left":"center"},function(e){return e.noDrag?"left":"center"},function(e){return e.noDrag?"left":"center"},function(e){return e.noDrag?"0px":"24px"},function(e){return e.noDrag?"0px":"4px"},function(e){var n=e.dragState,r=void 0===n?"default":n,t=e.theme;return e.noDrag?"0px":"dragReject"===r||"error"===r?e.isInverse?"1px dashed "+t.colors.danger200:"1px dashed "+t.colors.danger:"dragActive"===r?"1px dashed "+t.colors.primary:"dragAccept"===r?"1px dashed "+t.colors.success:"1px dashed "+t.colors.neutral400},function(e){var n=e.dragState;return"error"===(void 0===n?"default":n)?"solid":"dashed"},function(e){var n=e.theme;return e.noDrag?"transparent":e.isInverse?U(.75,n.colors.neutral900):n.colors.neutral200},function(e){return"border "+(e.noDrag?0:".24s")+" ease-in-out"}),ye=g.span(re||(re=Z(["\n color: ",";\n display: block;\n font-size: 14px;\n margin: -8px 0 16px 0;\n"])),function(e){var n=e.theme;return e.isInverse?n.colors.neutral100:n.colors.neutral700}),be=g.div(te||(te=Z(["\n color: ",";\n margin: 0 0 24px 0;\n font-size: ",";\n line-height: ",";\n font-weight: 500;\n padding: ",";\n"])),function(e){var n=e.theme;return e.isInverse?n.colors.neutral100:n.colors.neutral700},function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight},function(e){return e.theme.spaceScale.spacing01}),ze=M.forwardRef(function(e,n){var r=e.accept,t=e.containerStyle,o=e.disabled,i=e.helperMessage,l=e.id,s=e.inputSize,a=e.isInverse,c=e.isLabelVisuallyHidden,u=e.labelStyle,d=e.labelText,p=e.maxFiles,m=e.minFiles,g=e.maxSize,v=e.minSize,I=e.multiple,w=void 0===I||I,D=e.noDrag,O=void 0!==D&&D,H=e.onSendFile,L=e.onDeleteFile,E=e.onRemoveFile,P=e.sendFiles,U=void 0!==P&&P,V=e.testId,G=e.thumbnails,K=void 0===G||G,Z=Y(e,ve),q=M.useState([]),J=q[0],N=q[1],Q=M.useState(null),X=Q[0],$=Q[1],_=b(a),ee=M.useContext(x),ne=M.useContext(y),re=j(l),te=M.useCallback(function(e,n){N(function(r){return[].concat(r,e.map(function(e){return Object.assign(e,{preview:URL.createObjectURL(e)})}),n.map(function(e){return Object.assign(e.file,{errors:e.errors})}))})},[]),oe=T({noClick:!0,disabled:o,multiple:w,maxSize:g,minSize:v,accept:r,onDrop:te,noDrag:O}),ie=oe.getRootProps,le=oe.isDragAccept,se=oe.isDragActive,ae=oe.isDragReject,ce=oe.open,ue=(0,oe.getInputProps)({id:re}),de=X?"error":le?"dragAccept":ae?"dragReject":se?"dragActive":"default",pe=function(e){N(function(n){return n.filter(function(n){return n!==e})}),E&&"function"==typeof E&&E(e)},fe=function(e){N(function(n){return n.filter(function(n){return n!==e})}),L&&"function"==typeof L&&L(e)},me=function(e){N(function(n){return n.map(function(n){return n===e.file?Object.assign(n,{processor:W({},n.processor,{percent:e.percent+"%",status:"pending"})}):n})})},ge=function(e){N(function(n){return n.map(function(n){return n===e.file?Object.assign(n,{processor:W({},n.processor,{percent:"",status:"finished"})}):n})})},ze=function(e){N(function(n){return n.map(function(n){return n===e.file?Object.assign(n,{errors:e.errors,processor:W({},n.processor,{status:"error"})}):n})})};return M.useEffect(function(){return function(){J.forEach(function(e){return e.preview&&URL.revokeObjectURL(e.preview)})}},[J]),M.useEffect(function(){var e=m&&J.length<m,n=p&&J.length>p;$(function(e,n){if(null===e)return null;var r=ne.dropzone.errors[e];switch(e){case"too-many-files":return r.message+" "+n.maxFiles+" "+ne.dropzone.files+".";case"too-few-files":return r.message+" "+n.minFiles+" "+ne.dropzone.files+".";default:return r.message}}(n?"too-many-files":e?"too-few-files":null,{minFiles:m,maxFiles:p})),U&&J.length>0&&!n&&!e&&N(function(e){return e.map(function(e){return!e.errors&&!e.processor&&H&&H({file:e,onError:ze,onFinish:ge,onProgress:me}),e})})},[U,J.length,H]),B(z.Provider,{value:{isInverse:_},children:[B(C,{actionable:!1,containerStyle:t,errorMessage:X,fieldId:re,inputSize:s,isInverse:_,isLabelVisuallyHidden:c,labelStyle:u,labelText:d,messageStyle:{minHeight:0},"data-testid":V,children:[A(ye,{theme:ee,isInverse:_,children:i}),B(xe,W({behavior:S.container,dragState:de,isInverse:_,noDrag:O,theme:ee},ie(),Z,{testId:V,tabIndex:-1,children:[A("input",{ref:n,type:ue.type,accept:ue.accept,autoComplete:ue.autoComplete,id:ue.id,multiple:ue.multiple,onChange:ue.onChange,onClick:ue.onClick,style:ue.style,tabIndex:ue.tabIndex}),O?A(h,{xs:!0,behavior:S.item,children:A(R,{color:k.primary,disabled:o,isInverse:_,onClick:ce,style:{margin:0},children:ne.dropzone.browseFiles})}):B(h,{behavior:S.item,children:[A(f,{"aria-hidden":"true",color:_?ee.colors.neutral100:ee.colors.neutral500,size:48}),A(be,{isInverse:_,theme:ee,children:ne.dropzone.dragMessage}),A(R,{color:k.primary,disabled:o,isInverse:_,onClick:ce,style:{margin:0},variant:F.solid,children:ne.dropzone.browseFiles})]})]}))]}),J.map(function(e){return A(he,{accept:r,file:e,isInverse:_,maxSize:g,minSize:v,onDeleteFile:fe,onRemoveFile:pe,thumbnails:K},e.name)})]})});export{ze as Dropzone,K as FileIcon};
1
+ import{InsertDriveFileIcon as e,FileWordIcon as n,FileExcelIcon as r,FilePowerpointIcon as t,FilePdfIcon as o,ImageIcon as i,VideocamIcon as l,AudiotrackIcon as s,FileZipIcon as a,CloseIcon as c,ErrorIcon as u,CheckCircleIcon as d,DeleteIcon as p,CloudUploadIcon as f}from"react-magma-icons";import{magma as m,Flex as g,Card as h,ThemeContext as v,I18nContext as x,useIsInverse as y,InverseContext as b,FlexBehavior as z,FlexAlignItems as S,IconButton as I,ButtonVariant as w,ButtonColor as F,Spinner as k,Transition as D,useGenerateId as O,FormFieldContainer as j,Button as C}from"react-magma-dom";import{jsx as R,jsxs as A}from"react/jsx-runtime";import B,{forwardRef as M,useContext as H,useState as L,useEffect as P}from"react";import{useDropzone as E}from"react-dropzone";import T from"@emotion/styled";import{transparentize as U}from"polished";var V={default:{Icon:e,style:{color:m.colors.neutral500}},word:{Icon:n,style:{color:m.colors.info500}},excel:{Icon:r,style:{color:m.colors.success500}},powerpoint:{Icon:t,style:{color:m.colors.warning500}},pdf:{Icon:o,style:{color:m.colors.danger500}},image:{Icon:i,style:{color:m.colors.neutral500}},video:{Icon:l,style:{color:m.colors.neutral500}},audio:{Icon:s,style:{color:m.colors.neutral500}},archive:{Icon:a,style:{color:m.colors.neutral500}}},G={default:V.default,xlsx:V.excel,xlsm:V.excel,xlsb:V.excel,xltx:V.excel,xls:V.excel,xlt:V.excel,doc:V.word,docx:V.word,docm:V.word,dotx:V.word,dotm:V.word,docb:V.word,pptx:V.powerpoint,pptm:V.powerpoint,ppt:V.powerpoint,pdf:V.pdf,png:V.image,svg:V.image,image:V.image,audio:V.audio,video:V.video,zip:V.archive},K=function(e){var n=e.file,r=e.isInverse,t=n.path,o=void 0===t?"":t,i=n.type,l=(void 0===i?"":i).split("/")[0],s=o.split(".").pop()||"default",a=G[s]||G[l]||G.default;return R(a.Icon,{size:m.iconSizes.medium,style:r?{}:a.style})};function W(){return W=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t])}return e},W.apply(this,arguments)}function Y(e,n){if(null==e)return{};var r={};for(var t in e)if(Object.prototype.hasOwnProperty.call(e,t)){if(n.indexOf(t)>=0)continue;r[t]=e[t]}return r}function Z(e,n){return n||(n=e.slice(0)),e.raw=n,e}var q,J,N,Q,X,$,_,ee,ne,re,te,oe=function(e,n,r){if(void 0===n&&(n=2),void 0===r&&(r="Bytes"),void 0!==e){if(0==e)return"0 "+r;var t=[r,"KB","MB","GB","TB","PB","EB","ZB","YB"],o=Math.floor(Math.log(e)/Math.log(1024));return parseFloat((e/Math.pow(1024,o)).toFixed(n))+" "+t[o]}},ie=["accept","file","isInverse","maxSize","minSize","onDeleteFile","onRemoveFile","testId","thumbnails"],le=["code"],se=T,ae=se.div(q||(q=Z(["\n background-image: ",";\n background-repeat: no-repeat;\n background-size: cover;\n display: inline-block;\n vertical-align: middle;\n height: 40px;\n width: 40px;\n"])),function(e){var n=e.file;return"url('"+("preview"in n&&n.preview)+"')"}),ce=se.div(J||(J=Z(["\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"]))),ue={marginRight:"12px",display:"flex"},de=se.div(N||(N=Z(["\n border-top: 1px solid ",";\n padding: 16px;\n font-size: ",";\n line-height: ",";\n"])),function(e){return e.theme.colors.neutral300},function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight}),pe=se(g)(Q||(Q=Z(["\n height: 56px;\n padding: 0 8px 0 16px;\n font-size: ",";\n line-height: ",";\n"])),function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight}),fe=se(g)(X||(X=Z(["\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: ",";\n line-height: ",";\n"])),function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight}),me=se(h)($||($=Z(["\n background-color: none;\n border-color: ",";\n border-width: 1px;\n margin: 10px 0;\n"])),function(e){var n=e.theme;return e.file.errors?e.isInverse?n.colors.danger200:n.colors.danger:n.colors.neutral300}),ge=T.span(_||(_=Z(["\n display: block;\n\n > div {\n display: flex;\n align-self: center;\n margin-right: 12px;\n }\n"]))),he=T.span(ee||(ee=Z(["\n display: block;\n"]))),ve=M(function(e,n){var r,t=e.accept,o=e.file,i=e.isInverse,l=e.maxSize,s=e.minSize,a=e.onDeleteFile,f=e.onRemoveFile,m=e.thumbnails,h=Y(e,ie),O=H(v),j=B.useContext(x),C=y(i),M=L(R(c,{})),E=M[0],T=M[1],U=function(){f&&"function"==typeof f&&f(o)},V=function(){a&&"function"==typeof a&&a(o)},G=function(e){var n=e.status,r=void 0===n?"ready":n,t=L(!1),o=t[0],i=t[1];return P(function(){var e=!0;return setTimeout(function(){e&&i(!0)},1e3),function(){e=!1}},[r]),"error"===r||"ready"===r?R(ce,{children:R(I,{onClick:U,variant:w.link,color:F.secondary,"aria-label":j.dropzone.removeFile,icon:R(c,{})})}):"pending"===r?R(ce,{children:R(k,{color:C?O.colors.neutral100:O.colors.primary})}):A(ce,{children:[R(D,{isOpen:!o,unmountOnExit:!0,fade:!0,children:R(d,{color:C?O.colors.success200:O.colors.success,style:{marginTop:"4px"}})}),R(D,{isOpen:o,unmountOnExit:!0,fade:!0,children:R(I,{onClick:V,variant:w.link,color:F.secondary,"aria-label":j.dropzone.deleteFile,icon:R(p,{})})})]})};return P(function(){var e;T(R(G,{status:null==o||null==(e=o.processor)?void 0:e.status}))},[null==o||null==(r=o.processor)?void 0:r.status]),R(b.Provider,{value:{isInverse:C},children:A(me,{isInverse:C,theme:O,file:o,"data-testid":e.testId,ref:n,role:o.errors?"alert":"",children:[A(pe,W({theme:O,behavior:z.container,alignItems:S.center},h,{children:[R(g,{behavior:z.item,alignItems:S.center,style:ue,children:o.errors?R(u,{color:C?O.colors.danger200:O.colors.danger,size:24}):o.preview&&m&&o.type&&o.type.startsWith("image")?R(ae,{role:"img",file:o}):R(K,{isInverse:C,file:o})}),R(fe,{xs:!0,behavior:z.item,theme:O,children:o.name}),o.processor&&"pending"===o.processor.status&&R(g,{role:"progressbar",style:{marginLeft:"auto"},behavior:z.item,children:o.processor.percent}),R(g,{behavior:z.item,children:E})]})),o.errors&&R(de,{theme:O,children:o.errors.slice(0,1).map(function(e){var n=e.code,r=function(e,n,r){var t=Array.isArray(n.accept)&&1===n.accept.length?n.accept[0]:n.accept,o=Array.isArray(t)?"one of "+t.join(", "):t;switch(e.code){case"file-too-large":return W({},e,{message:e.message+" "+oe(n.maxSize,2,r)+"."});case"file-too-small":return W({},e,{message:e.message+" "+oe(n.minSize,2,r)+"."});case"file-invalid-type":return W({},e,{message:e.message+": "+o});default:return e}}(W({code:n},Y(e,le),j.dropzone.errors[n]),{accept:t,minSize:s,maxSize:l},j.dropzone.bytes),o=r.header,i=r.message;return A(B.Fragment,{children:[R(ge,{style:{color:C?O.colors.danger200:O.colors.danger},children:void 0===o?"":o}),R(he,{children:i})]},n)})})]})})}),xe=["accept","containerStyle","disabled","dropzoneOptions","helperMessage","id","inputSize","isInverse","isLabelVisuallyHidden","labelStyle","labelText","maxFiles","minFiles","maxSize","minSize","multiple","noDrag","onSendFile","onDeleteFile","onRemoveFile","sendFiles","testId","thumbnails"],ye=T,be=ye(g)(ne||(ne=Z(["\n flex-direction: column;\n align-items: ",";\n justify-content: ",";\n text-align: ",";\n padding: ",";\n border-radius: ",";\n border: ",";\n\n border-style: ",";\n background-color: ",";\n outline: none;\n transition: ",";\n"])),function(e){return e.noDrag?"left":"center"},function(e){return e.noDrag?"left":"center"},function(e){return e.noDrag?"left":"center"},function(e){return e.noDrag?"0px":"24px"},function(e){return e.noDrag?"0px":"4px"},function(e){var n=e.dragState,r=void 0===n?"default":n,t=e.theme;return e.noDrag?"0px":"dragReject"===r||"error"===r?e.isInverse?"1px dashed "+t.colors.danger200:"1px dashed "+t.colors.danger:"dragActive"===r?"1px dashed "+t.colors.primary:"dragAccept"===r?"1px dashed "+t.colors.success:"1px dashed "+t.colors.neutral400},function(e){var n=e.dragState;return"error"===(void 0===n?"default":n)?"solid":"dashed"},function(e){var n=e.theme;return e.noDrag?"transparent":e.isInverse?U(.75,n.colors.neutral900):n.colors.neutral200},function(e){return"border "+(e.noDrag?0:".24s")+" ease-in-out"}),ze=ye.span(re||(re=Z(["\n color: ",";\n display: block;\n font-size: 14px;\n margin: -8px 0 16px 0;\n"])),function(e){var n=e.theme;return e.isInverse?n.colors.neutral100:n.colors.neutral700}),Se=ye.div(te||(te=Z(["\n color: ",";\n margin: 0 0 24px 0;\n font-size: ",";\n line-height: ",";\n font-weight: 500;\n padding: ",";\n"])),function(e){var n=e.theme;return e.isInverse?n.colors.neutral100:n.colors.neutral700},function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight},function(e){return e.theme.spaceScale.spacing01}),Ie=B.forwardRef(function(e,n){var r=e.accept,t=e.containerStyle,o=e.disabled,i=e.helperMessage,l=e.id,s=e.inputSize,a=e.isInverse,c=e.isLabelVisuallyHidden,u=e.labelStyle,d=e.labelText,p=e.maxFiles,m=e.minFiles,h=e.maxSize,S=e.minSize,I=e.multiple,k=void 0===I||I,D=e.noDrag,M=void 0!==D&&D,H=e.onSendFile,L=e.onDeleteFile,P=e.onRemoveFile,T=e.sendFiles,U=void 0!==T&&T,V=e.testId,G=e.thumbnails,K=void 0===G||G,Z=Y(e,xe),q=B.useState([]),J=q[0],N=q[1],Q=B.useState(null),X=Q[0],$=Q[1],_=y(a),ee=B.useContext(v),ne=B.useContext(x),re=O(l),te=B.useCallback(function(e,n){N(function(r){return[].concat(r,e.map(function(e){return Object.assign(e,{preview:URL.createObjectURL(e)})}),n.map(function(e){return Object.assign(e.file,{errors:e.errors})}))})},[]),oe=E({noClick:!0,disabled:o,multiple:k,maxSize:h,minSize:S,accept:r,onDrop:te,noDrag:M}),ie=oe.getRootProps,le=oe.isDragAccept,se=oe.isDragActive,ae=oe.isDragReject,ce=oe.open,ue=(0,oe.getInputProps)({id:re}),de=X?"error":le?"dragAccept":ae?"dragReject":se?"dragActive":"default",pe=function(e){N(function(n){return n.filter(function(n){return n!==e})}),P&&"function"==typeof P&&P(e)},fe=function(e){N(function(n){return n.filter(function(n){return n!==e})}),L&&"function"==typeof L&&L(e)},me=function(e){N(function(n){return n.map(function(n){return n===e.file?Object.assign(n,{processor:W({},n.processor,{percent:e.percent+"%",status:"pending"})}):n})})},ge=function(e){N(function(n){return n.map(function(n){return n===e.file?Object.assign(n,{processor:W({},n.processor,{percent:"",status:"finished"})}):n})})},he=function(e){N(function(n){return n.map(function(n){return n===e.file?Object.assign(n,{errors:e.errors,processor:W({},n.processor,{status:"error"})}):n})})};return B.useEffect(function(){return function(){J.forEach(function(e){return e.preview&&URL.revokeObjectURL(e.preview)})}},[J]),B.useEffect(function(){var e=m&&J.length<m,n=p&&J.length>p;$(function(e,n){if(null===e)return null;var r=ne.dropzone.errors[e];switch(e){case"too-many-files":return r.message+" "+n.maxFiles+" "+ne.dropzone.files+".";case"too-few-files":return r.message+" "+n.minFiles+" "+ne.dropzone.files+".";default:return r.message}}(n?"too-many-files":e?"too-few-files":null,{minFiles:m,maxFiles:p})),U&&J.length>0&&!n&&!e&&N(function(e){return e.map(function(e){return!e.errors&&!e.processor&&H&&H({file:e,onError:he,onFinish:ge,onProgress:me}),e})})},[U,J.length,H]),A(b.Provider,{value:{isInverse:_},children:[A(j,{actionable:!1,containerStyle:t,errorMessage:X,fieldId:re,inputSize:s,isInverse:_,isLabelVisuallyHidden:c,labelStyle:u,labelText:d,messageStyle:{minHeight:0},"data-testid":V,children:[R(ze,{theme:ee,isInverse:_,children:i}),A(be,W({behavior:z.container,dragState:de,isInverse:_,noDrag:M,theme:ee},ie(),Z,{testId:V,tabIndex:-1,children:[R("input",{ref:n,type:ue.type,accept:ue.accept,autoComplete:ue.autoComplete,id:ue.id,multiple:ue.multiple,onChange:ue.onChange,onClick:ue.onClick,style:ue.style,tabIndex:ue.tabIndex}),M?R(g,{xs:!0,behavior:z.item,children:R(C,{color:F.primary,disabled:o,isInverse:_,onClick:ce,style:{margin:0},children:ne.dropzone.browseFiles})}):A(g,{behavior:z.item,children:[R(f,{"aria-hidden":"true",color:_?ee.colors.neutral100:ee.colors.neutral500,size:48}),R(Se,{isInverse:_,theme:ee,children:ne.dropzone.dragMessage}),R(C,{color:F.primary,disabled:o,isInverse:_,onClick:ce,style:{margin:0},variant:w.solid,children:ne.dropzone.browseFiles})]})]}))]}),J.map(function(e){return R(ve,{accept:r,file:e,isInverse:_,maxSize:h,minSize:S,onDeleteFile:fe,onRemoveFile:pe,thumbnails:K},e.name)})]})});export{Ie as Dropzone,K as FileIcon};
2
2
  //# sourceMappingURL=fileuploader.modern.module.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fileuploader.modern.module.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';\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';\nimport { magma } from 'react-magma-dom';\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: number = 2,\n bytesLabel: string = '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","import React, { forwardRef, useContext, useEffect, useState } from 'react';\n\nimport {\n CheckCircleIcon,\n CloseIcon,\n DeleteIcon,\n ErrorIcon,\n} from 'react-magma-icons';\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 styled,\n useIsInverse,\n} from 'react-magma-dom';\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.danger200\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 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<HTMLDivElement, PreviewProps>(\n // eslint-disable-next-line complexity\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 setTimeout(() => {\n if (mounted) {\n setDone(true);\n }\n }, 1000);\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}\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}\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={\n isInverse ? theme.colors.danger200 : theme.colors.danger\n }\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 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);\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 from 'react';\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 styled,\n useGenerateId,\n useIsInverse,\n} from 'react-magma-dom';\n\nimport { CloudUploadIcon } from 'react-magma-icons';\nimport { Preview } from './Preview';\nimport { FilePreview, FileError } from './FilePreview';\nimport { transparentize } from 'polished';\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.danger200}`\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`;\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\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\n const onDrop = React.useCallback(\n (acceptedFiles: FilePreview[], rejectedFiles: FileRejection[]) => {\n setFiles((files: FilePreview[]) => [\n ...files,\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 []\n );\n\n const {\n getInputProps,\n getRootProps,\n isDragAccept,\n isDragActive,\n isDragReject,\n open,\n } = useDropzone({\n noClick: true,\n disabled,\n multiple,\n maxSize,\n minSize,\n accept,\n onDrop,\n noDrag,\n });\n\n const inputProps = getInputProps({ id });\n\n const dragState: DragState = errorMessage\n ? 'error'\n : isDragAccept\n ? 'dragAccept'\n : isDragReject\n ? 'dragReject'\n : isDragActive\n ? 'dragActive'\n : 'default';\n\n const handleRemoveFile = (removedFile: FilePreview) => {\n setFiles(files => files.filter(file => file !== removedFile));\n onRemoveFile &&\n typeof onRemoveFile === 'function' &&\n onRemoveFile(removedFile);\n };\n\n const handleDeleteFile = (removedFile: FilePreview) => {\n setFiles(files => files.filter(file => file !== removedFile));\n onDeleteFile &&\n typeof onDeleteFile === 'function' &&\n onDeleteFile(removedFile);\n };\n\n const setProgress = (props: { percent: number; file: FilePreview }) => {\n setFiles(files =>\n files.map(file =>\n file === props.file\n ? Object.assign(file, {\n processor: {\n ...file.processor,\n percent: `${props.percent}%`,\n status: 'pending',\n },\n })\n : file\n )\n );\n };\n\n const setFinished = (props: { file: FilePreview }) => {\n setFiles(files =>\n files.map(file =>\n file === props.file\n ? Object.assign(file, {\n processor: {\n ...file.processor,\n percent: '',\n status: 'finished',\n },\n })\n : file\n )\n );\n };\n\n const setError = (props: { errors: FileError[]; file: FilePreview }) => {\n setFiles(files =>\n files.map(file =>\n file === props.file\n ? Object.assign(file, {\n errors: props.errors,\n processor: { ...file.processor, status: 'error' },\n })\n : file\n )\n );\n };\n\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 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 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 minFileError = minFiles && files.length < minFiles;\n const maxFileError = maxFiles && files.length > maxFiles;\n\n setErrorMessage(\n formatError(\n maxFileError\n ? 'too-many-files'\n : minFileError\n ? 'too-few-files'\n : null,\n { minFiles, maxFiles }\n )\n );\n\n if (sendFiles && files.length > 0 && !maxFileError && !minFileError) {\n setFiles((files: FilePreview[]) => {\n return files.map((file: FilePreview) => {\n !file.errors &&\n !file.processor &&\n onSendFile &&\n onSendFile({\n file,\n onError: setError,\n onFinish: setFinished,\n onProgress: setProgress,\n });\n return file;\n });\n });\n }\n }, [sendFiles, files.length, onSendFile]);\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 theme={theme} isInverse={isInverse}>\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={ref}\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 />\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 >\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 >\n {i18n.dropzone.browseFiles}\n </Button>\n </Flex>\n )}\n </Container>\n </FormFieldContainer>\n {files.map((file: FilePreview) => (\n <Preview\n accept={accept}\n file={file}\n isInverse={isInverse}\n key={file.name}\n maxSize={maxSize}\n minSize={minSize}\n onDeleteFile={handleDeleteFile}\n onRemoveFile={handleRemoveFile}\n thumbnails={thumbnails}\n />\n ))}\n </InverseContext.Provider>\n );\n }\n);\n"],"names":["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","icons","xlsx","xlsm","xlsb","xltx","xls","xlt","doc","docx","docm","dotx","dotm","docb","pptx","pptm","ppt","png","svg","zip","file","isInverse","path","type","split","pop","iconMapping","extension","category","_jsx","size","iconSizes","medium","bytes","decimalPoint","bytesLabel","undefined","Math","floor","log","pow","i","toFixed","sizes","styled","div","preview","marginRight","display","theme","neutral300","typeScale","size02","fontSize","lineHeight","Flex","Card","errors","danger200","danger","span","forwardRef","props","ref","accept","isInverseProp","maxSize","minSize","onDeleteFile","onRemoveFile","thumbnails","rest","useContext","ThemeContext","React","I18nContext","useIsInverse","useState","CloseIcon","actions","setActions","status","done","setDone","useEffect","setTimeout","mounted","StatusIcons","IconButton","onClick","handleRemoveFile","variant","ButtonVariant","link","ButtonColor","secondary","i18n","dropzone","removeFile","icon","Spinner","neutral100","primary","_jsxs","Transition","isOpen","unmountOnExit","fade","CheckCircleIcon","success200","success","marginTop","handleDeleteFile","deleteFile","DeleteIcon","FinishedActions","processor","_file$processor","_file$processor2","InverseContext","Provider","value","StyledCard","testId","role","StyledFlex","behavior","FlexBehavior","container","alignItems","FlexAlignItems","center","item","IconStyles","ErrorIcon","startsWith","Thumb","FileIcon","FileName","xs","name","marginLeft","percent","Errors","slice","map","code","error","constraints","byteLabel","Array","isArray","length","join","message","formatFileSize","messageSuffix","formatError","header","Fragment","ErrorHeader","ErrorMessage","noDrag","dragState","neutral400","transparentize","neutral900","neutral200","neutral700","spaceScale","spacing01","containerStyle","disabled","helperMessage","defaultId","id","inputSize","isLabelVisuallyHidden","labelStyle","labelText","maxFiles","minFiles","multiple","onSendFile","sendFiles","files","setFiles","errorMessage","setErrorMessage","useGenerateId","useCallback","acceptedFiles","rejectedFiles","assign","URL","createObjectURL","useDropzone","noClick","onDrop","getRootProps","isDragAccept","isDragActive","isDragReject","open","getInputProps","removedFile","filter","Object","forEach","revokeObjectURL","maxFileError","minFileError","onError","setError","onFinish","setFinished","onProgress","setProgress","FormFieldContainer","actionable","fieldId","messageStyle","minHeight","HelperMessage","Container","tabIndex","inputProps","autoComplete","onChange","Button","margin","browseFiles","CloudUploadIcon","Wrapper","dragMessage","solid","Preview"],"mappings":"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"}
1
+ {"version":3,"file":"fileuploader.modern.module.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';\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';\nimport { magma } from 'react-magma-dom';\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: number = 2,\n bytesLabel: string = '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","import React, { forwardRef, useContext, useEffect, useState } from 'react';\n\nimport {\n CheckCircleIcon,\n CloseIcon,\n DeleteIcon,\n ErrorIcon,\n} from 'react-magma-icons';\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} from 'react-magma-dom';\n\nimport { FileIcon } from './FileIcon';\nimport { FilePreview } from './FilePreview';\nimport { formatFileSize } from './utils';\n\nimport styled, { CreateStyled } from '@emotion/styled';\n\nconst typedStyled = styled as CreateStyled<ThemeInterface>;\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 = typedStyled.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 = typedStyled.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 = typedStyled.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 = typedStyled(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 = typedStyled(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 = typedStyled(Card)<{ file: FilePreview; isInverse: boolean }>`\n background-color: none;\n border-color: ${({ file, theme, isInverse }) =>\n file.errors\n ? isInverse\n ? theme.colors.danger200\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 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<HTMLDivElement, PreviewProps>(\n // eslint-disable-next-line complexity\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 setTimeout(() => {\n if (mounted) {\n setDone(true);\n }\n }, 1000);\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}\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}\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={\n isInverse ? theme.colors.danger200 : theme.colors.danger\n }\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 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);\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 from 'react';\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} from 'react-magma-dom';\n\nimport { CloudUploadIcon } from 'react-magma-icons';\nimport { Preview } from './Preview';\nimport { FilePreview, FileError } from './FilePreview';\nimport { transparentize } from 'polished';\nimport styled, { CreateStyled } from '@emotion/styled';\n\nconst typedStyled = styled as CreateStyled<ThemeInterface>;\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 = typedStyled(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.danger200}`\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 = typedStyled.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 = typedStyled.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`;\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\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\n const onDrop = React.useCallback(\n (acceptedFiles: FilePreview[], rejectedFiles: FileRejection[]) => {\n setFiles((files: FilePreview[]) => [\n ...files,\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 []\n );\n\n const {\n getInputProps,\n getRootProps,\n isDragAccept,\n isDragActive,\n isDragReject,\n open,\n } = useDropzone({\n noClick: true,\n disabled,\n multiple,\n maxSize,\n minSize,\n accept,\n onDrop,\n noDrag,\n });\n\n const inputProps = getInputProps({ id });\n\n const dragState: DragState = errorMessage\n ? 'error'\n : isDragAccept\n ? 'dragAccept'\n : isDragReject\n ? 'dragReject'\n : isDragActive\n ? 'dragActive'\n : 'default';\n\n const handleRemoveFile = (removedFile: FilePreview) => {\n setFiles(files => files.filter(file => file !== removedFile));\n onRemoveFile &&\n typeof onRemoveFile === 'function' &&\n onRemoveFile(removedFile);\n };\n\n const handleDeleteFile = (removedFile: FilePreview) => {\n setFiles(files => files.filter(file => file !== removedFile));\n onDeleteFile &&\n typeof onDeleteFile === 'function' &&\n onDeleteFile(removedFile);\n };\n\n const setProgress = (props: { percent: number; file: FilePreview }) => {\n setFiles(files =>\n files.map(file =>\n file === props.file\n ? Object.assign(file, {\n processor: {\n ...file.processor,\n percent: `${props.percent}%`,\n status: 'pending',\n },\n })\n : file\n )\n );\n };\n\n const setFinished = (props: { file: FilePreview }) => {\n setFiles(files =>\n files.map(file =>\n file === props.file\n ? Object.assign(file, {\n processor: {\n ...file.processor,\n percent: '',\n status: 'finished',\n },\n })\n : file\n )\n );\n };\n\n const setError = (props: { errors: FileError[]; file: FilePreview }) => {\n setFiles(files =>\n files.map(file =>\n file === props.file\n ? Object.assign(file, {\n errors: props.errors,\n processor: { ...file.processor, status: 'error' },\n })\n : file\n )\n );\n };\n\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 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 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 minFileError = minFiles && files.length < minFiles;\n const maxFileError = maxFiles && files.length > maxFiles;\n\n setErrorMessage(\n formatError(\n maxFileError\n ? 'too-many-files'\n : minFileError\n ? 'too-few-files'\n : null,\n { minFiles, maxFiles }\n )\n );\n\n if (sendFiles && files.length > 0 && !maxFileError && !minFileError) {\n setFiles((files: FilePreview[]) => {\n return files.map((file: FilePreview) => {\n !file.errors &&\n !file.processor &&\n onSendFile &&\n onSendFile({\n file,\n onError: setError,\n onFinish: setFinished,\n onProgress: setProgress,\n });\n return file;\n });\n });\n }\n }, [sendFiles, files.length, onSendFile]);\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 theme={theme} isInverse={isInverse}>\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={ref}\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 />\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 >\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 >\n {i18n.dropzone.browseFiles}\n </Button>\n </Flex>\n )}\n </Container>\n </FormFieldContainer>\n {files.map((file: FilePreview) => (\n <Preview\n accept={accept}\n file={file}\n isInverse={isInverse}\n key={file.name}\n maxSize={maxSize}\n minSize={minSize}\n onDeleteFile={handleDeleteFile}\n onRemoveFile={handleRemoveFile}\n thumbnails={thumbnails}\n />\n ))}\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","formatFileSize","bytes","decimalPoint","bytesLabel","undefined","sizes","i","Math","floor","log","parseFloat","pow","toFixed","typedStyled","styled","Thumb","div","_templateObject","_taggedTemplateLiteralLoose","preview","StatusIcons","_templateObject2","IconStyles","marginRight","display","Errors","_templateObject3","theme","neutral300","_ref3","typeScale","size02","fontSize","_ref4","lineHeight","StyledFlex","Flex","_templateObject4","_ref5","_ref6","FileName","_templateObject5","_ref7","_ref8","StyledCard","Card","_templateObject6","_ref9","errors","danger200","danger","ErrorHeader","span","_templateObject7","ErrorMessage","_templateObject8","Preview","forwardRef","props","ref","accept","isInverseProp","maxSize","minSize","onDeleteFile","onRemoveFile","thumbnails","rest","_objectWithoutPropertiesLoose","_excluded","useContext","ThemeContext","i18n","React","I18nContext","useIsInverse","_useState","useState","CloseIcon","actions","setActions","handleRemoveFile","handleDeleteFile","FinishedActions","_ref10","status","_ref10$status","_useState2","done","setDone","useEffect","mounted","setTimeout","children","IconButton","onClick","variant","ButtonVariant","link","ButtonColor","secondary","dropzone","removeFile","icon","Spinner","neutral100","primary","_jsxs","Transition","isOpen","unmountOnExit","fade","CheckCircleIcon","success200","success","marginTop","deleteFile","DeleteIcon","_file$processor","processor","_file$processor2","InverseContext","Provider","value","testId","role","_extends","behavior","FlexBehavior","container","alignItems","FlexAlignItems","center","item","ErrorIcon","startsWith","xs","name","marginLeft","percent","slice","map","_ref11","code","_formatError","error","constraints","byteLabel","Array","isArray","length","messageSuffix","join","message","formatError","_excluded2","_formatError$header","header","Fragment","Container","noDrag","_ref6$dragState","dragState","neutral400","_ref7$dragState","transparentize","neutral900","neutral200","HelperMessage","neutral700","Wrapper","_ref12","_ref13","_ref14","spaceScale","spacing01","Dropzone","containerStyle","disabled","helperMessage","defaultId","id","inputSize","isLabelVisuallyHidden","labelStyle","labelText","maxFiles","minFiles","_props$multiple","multiple","_props$noDrag","onSendFile","_props$sendFiles","sendFiles","_props$thumbnails","_React$useState","files","setFiles","_React$useState2","errorMessage","setErrorMessage","useGenerateId","onDrop","useCallback","acceptedFiles","rejectedFiles","concat","Object","assign","URL","createObjectURL","_ref15","_useDropzone","useDropzone","noClick","getRootProps","isDragAccept","isDragActive","isDragReject","open","inputProps","getInputProps","removedFile","filter","setProgress","setFinished","setError","forEach","revokeObjectURL","minFileError","maxFileError","onError","onFinish","onProgress","FormFieldContainer","actionable","fieldId","messageStyle","minHeight","tabIndex","autoComplete","onChange","Button","margin","browseFiles","CloudUploadIcon","dragMessage","solid"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- !function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react-magma-icons"),require("react-magma-dom"),require("react/jsx-runtime"),require("react"),require("react-dropzone"),require("polished")):"function"==typeof define&&define.amd?define(["exports","react-magma-icons","react-magma-dom","react/jsx-runtime","react","react-dropzone","polished"],n):n((e||self).dropzone={},e.reactMagmaIcons,e.reactMagmaDom,e.jsx,e.react,e.reactDropzone,e.polished)}(this,function(e,n,r,t,o,i,s){function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=l(o),c={default:{Icon:n.InsertDriveFileIcon,style:{color:r.magma.colors.neutral500}},word:{Icon:n.FileWordIcon,style:{color:r.magma.colors.info500}},excel:{Icon:n.FileExcelIcon,style:{color:r.magma.colors.success500}},powerpoint:{Icon:n.FilePowerpointIcon,style:{color:r.magma.colors.warning500}},pdf:{Icon:n.FilePdfIcon,style:{color:r.magma.colors.danger500}},image:{Icon:n.ImageIcon,style:{color:r.magma.colors.neutral500}},video:{Icon:n.VideocamIcon,style:{color:r.magma.colors.neutral500}},audio:{Icon:n.AudiotrackIcon,style:{color:r.magma.colors.neutral500}},archive:{Icon:n.FileZipIcon,style:{color:r.magma.colors.neutral500}}},u={default:c.default,xlsx:c.excel,xlsm:c.excel,xlsb:c.excel,xltx:c.excel,xls:c.excel,xlt:c.excel,doc:c.word,docx:c.word,docm:c.word,dotx:c.word,dotm:c.word,docb:c.word,pptx:c.powerpoint,pptm:c.powerpoint,ppt:c.powerpoint,pdf:c.pdf,png:c.image,svg:c.image,image:c.image,audio:c.audio,video:c.video,zip:c.archive},d=function(e){var n=e.file,o=e.isInverse,i=n.path,s=void 0===i?"":i,l=n.type,a=(void 0===l?"":l).split("/")[0],c=s.split(".").pop()||"default",d=u[c]||u[a]||u.default;return t.jsx(d.Icon,{size:r.magma.iconSizes.medium,style:o?{}:d.style})};function p(){return p=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t])}return e},p.apply(this,arguments)}function f(e,n){if(null==e)return{};var r,t,o={},i=Object.keys(e);for(t=0;t<i.length;t++)n.indexOf(r=i[t])>=0||(o[r]=e[r]);return o}function m(e,n){return n||(n=e.slice(0)),e.raw=n,e}var g,x,h,v,y,I,b,j,z,F,S,w=function(e,n,r){if(void 0===n&&(n=2),void 0===r&&(r="Bytes"),void 0!==e){if(0==e)return"0 "+r;var t=[r,"KB","MB","GB","TB","PB","EB","ZB","YB"],o=Math.floor(Math.log(e)/Math.log(1024));return parseFloat((e/Math.pow(1024,o)).toFixed(n))+" "+t[o]}},C=["accept","file","isInverse","maxSize","minSize","onDeleteFile","onRemoveFile","testId","thumbnails"],B=["code"],D=r.styled.div(g||(g=m(["\n background-image: ",";\n background-repeat: no-repeat;\n background-size: cover;\n display: inline-block;\n vertical-align: middle;\n height: 40px;\n width: 40px;\n"])),function(e){var n=e.file;return"url('"+("preview"in n&&n.preview)+"')"}),k=r.styled.div(x||(x=m(["\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"]))),O={marginRight:"12px",display:"flex"},R=r.styled.div(h||(h=m(["\n border-top: 1px solid ",";\n padding: 16px;\n font-size: ",";\n line-height: ",";\n"])),function(e){return e.theme.colors.neutral300},function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight}),A=r.styled(r.Flex)(v||(v=m(["\n height: 56px;\n padding: 0 8px 0 16px;\n font-size: ",";\n line-height: ",";\n"])),function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight}),T=r.styled(r.Flex)(y||(y=m(["\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: ",";\n line-height: ",";\n"])),function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight}),E=r.styled(r.Card)(I||(I=m(["\n background-color: none;\n border-color: ",";\n border-width: 1px;\n margin: 10px 0;\n"])),function(e){var n=e.theme;return e.file.errors?e.isInverse?n.colors.danger200:n.colors.danger:n.colors.neutral300}),M=r.styled.span(b||(b=m(["\n display: block;\n\n > div {\n display: flex;\n align-self: center;\n margin-right: 12px;\n }\n"]))),P=r.styled.span(j||(j=m(["\n display: block;\n"]))),H=o.forwardRef(function(e,i){var s,l=e.accept,c=e.file,u=e.isInverse,m=e.maxSize,g=e.minSize,x=e.onDeleteFile,h=e.onRemoveFile,v=e.thumbnails,y=f(e,C),I=o.useContext(r.ThemeContext),b=a.default.useContext(r.I18nContext),j=r.useIsInverse(u),z=o.useState(t.jsx(n.CloseIcon,{})),F=z[0],S=z[1],H=function(){h&&"function"==typeof h&&h(c)},L=function(){x&&"function"==typeof x&&x(c)},V=function(e){var i=e.status,s=void 0===i?"ready":i,l=o.useState(!1),a=l[0],c=l[1];return o.useEffect(function(){var e=!0;return setTimeout(function(){e&&c(!0)},1e3),function(){e=!1}},[s]),"error"===s||"ready"===s?t.jsx(k,{children:t.jsx(r.IconButton,{onClick:H,variant:r.ButtonVariant.link,color:r.ButtonColor.secondary,"aria-label":b.dropzone.removeFile,icon:t.jsx(n.CloseIcon,{})})}):"pending"===s?t.jsx(k,{children:t.jsx(r.Spinner,{color:j?I.colors.neutral100:I.colors.primary})}):t.jsxs(k,{children:[t.jsx(r.Transition,{isOpen:!a,unmountOnExit:!0,fade:!0,children:t.jsx(n.CheckCircleIcon,{color:j?I.colors.success200:I.colors.success,style:{marginTop:"4px"}})}),t.jsx(r.Transition,{isOpen:a,unmountOnExit:!0,fade:!0,children:t.jsx(r.IconButton,{onClick:L,variant:r.ButtonVariant.link,color:r.ButtonColor.secondary,"aria-label":b.dropzone.deleteFile,icon:t.jsx(n.DeleteIcon,{})})})]})};return o.useEffect(function(){var e;S(t.jsx(V,{status:null==c||null==(e=c.processor)?void 0:e.status}))},[null==c||null==(s=c.processor)?void 0:s.status]),t.jsx(r.InverseContext.Provider,{value:{isInverse:j},children:t.jsxs(E,{isInverse:j,theme:I,file:c,"data-testid":e.testId,ref:i,role:c.errors?"alert":"",children:[t.jsxs(A,p({theme:I,behavior:r.FlexBehavior.container,alignItems:r.FlexAlignItems.center},y,{children:[t.jsx(r.Flex,{behavior:r.FlexBehavior.item,alignItems:r.FlexAlignItems.center,style:O,children:c.errors?t.jsx(n.ErrorIcon,{color:j?I.colors.danger200:I.colors.danger,size:24}):c.preview&&v&&c.type&&c.type.startsWith("image")?t.jsx(D,{role:"img",file:c}):t.jsx(d,{isInverse:j,file:c})}),t.jsx(T,{xs:!0,behavior:r.FlexBehavior.item,theme:I,children:c.name}),c.processor&&"pending"===c.processor.status&&t.jsx(r.Flex,{role:"progressbar",style:{marginLeft:"auto"},behavior:r.FlexBehavior.item,children:c.processor.percent}),t.jsx(r.Flex,{behavior:r.FlexBehavior.item,children:F})]})),c.errors&&t.jsx(R,{theme:I,children:c.errors.slice(0,1).map(function(e){var n=e.code,r=function(e,n,r){var t=Array.isArray(n.accept)&&1===n.accept.length?n.accept[0]:n.accept,o=Array.isArray(t)?"one of "+t.join(", "):t;switch(e.code){case"file-too-large":return p({},e,{message:e.message+" "+w(n.maxSize,2,r)+"."});case"file-too-small":return p({},e,{message:e.message+" "+w(n.minSize,2,r)+"."});case"file-invalid-type":return p({},e,{message:e.message+": "+o});default:return e}}(p({code:n},f(e,B),b.dropzone.errors[n]),{accept:l,minSize:g,maxSize:m},b.dropzone.bytes),o=r.header,i=r.message;return t.jsxs(a.default.Fragment,{children:[t.jsx(M,{style:{color:j?I.colors.danger200:I.colors.danger},children:void 0===o?"":o}),t.jsx(P,{children:i})]},n)})})]})})}),L=["accept","containerStyle","disabled","dropzoneOptions","helperMessage","id","inputSize","isInverse","isLabelVisuallyHidden","labelStyle","labelText","maxFiles","minFiles","maxSize","minSize","multiple","noDrag","onSendFile","onDeleteFile","onRemoveFile","sendFiles","testId","thumbnails"],V=r.styled(r.Flex)(z||(z=m(["\n flex-direction: column;\n align-items: ",";\n justify-content: ",";\n text-align: ",";\n padding: ",";\n border-radius: ",";\n border: ",";\n\n border-style: ",";\n background-color: ",";\n outline: none;\n transition: ",";\n"])),function(e){return e.noDrag?"left":"center"},function(e){return e.noDrag?"left":"center"},function(e){return e.noDrag?"left":"center"},function(e){return e.noDrag?"0px":"24px"},function(e){return e.noDrag?"0px":"4px"},function(e){var n=e.dragState,r=void 0===n?"default":n,t=e.theme;return e.noDrag?"0px":"dragReject"===r||"error"===r?e.isInverse?"1px dashed "+t.colors.danger200:"1px dashed "+t.colors.danger:"dragActive"===r?"1px dashed "+t.colors.primary:"dragAccept"===r?"1px dashed "+t.colors.success:"1px dashed "+t.colors.neutral400},function(e){var n=e.dragState;return"error"===(void 0===n?"default":n)?"solid":"dashed"},function(e){var n=e.theme;return e.noDrag?"transparent":e.isInverse?s.transparentize(.75,n.colors.neutral900):n.colors.neutral200},function(e){return"border "+(e.noDrag?0:".24s")+" ease-in-out"}),q=r.styled.span(F||(F=m(["\n color: ",";\n display: block;\n font-size: 14px;\n margin: -8px 0 16px 0;\n"])),function(e){var n=e.theme;return e.isInverse?n.colors.neutral100:n.colors.neutral700}),U=r.styled.div(S||(S=m(["\n color: ",";\n margin: 0 0 24px 0;\n font-size: ",";\n line-height: ",";\n font-weight: 500;\n padding: ",";\n"])),function(e){var n=e.theme;return e.isInverse?n.colors.neutral100:n.colors.neutral700},function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight},function(e){return e.theme.spaceScale.spacing01});e.Dropzone=a.default.forwardRef(function(e,o){var s=e.accept,l=e.containerStyle,c=e.disabled,u=e.helperMessage,d=e.id,m=e.inputSize,g=e.isInverse,x=e.isLabelVisuallyHidden,h=e.labelStyle,v=e.labelText,y=e.maxFiles,I=e.minFiles,b=e.maxSize,j=e.minSize,z=e.multiple,F=void 0===z||z,S=e.noDrag,w=void 0!==S&&S,C=e.onSendFile,B=e.onDeleteFile,D=e.onRemoveFile,k=e.sendFiles,O=void 0!==k&&k,R=e.testId,A=e.thumbnails,T=void 0===A||A,E=f(e,L),M=a.default.useState([]),P=M[0],G=M[1],W=a.default.useState(null),Z=W[0],K=W[1],Y=r.useIsInverse(g),J=a.default.useContext(r.ThemeContext),N=a.default.useContext(r.I18nContext),Q=r.useGenerateId(d),X=a.default.useCallback(function(e,n){G(function(r){return[].concat(r,e.map(function(e){return Object.assign(e,{preview:URL.createObjectURL(e)})}),n.map(function(e){return Object.assign(e.file,{errors:e.errors})}))})},[]),$=i.useDropzone({noClick:!0,disabled:c,multiple:F,maxSize:b,minSize:j,accept:s,onDrop:X,noDrag:w}),_=$.getRootProps,ee=$.isDragAccept,ne=$.isDragActive,re=$.isDragReject,te=$.open,oe=(0,$.getInputProps)({id:Q}),ie=Z?"error":ee?"dragAccept":re?"dragReject":ne?"dragActive":"default",se=function(e){G(function(n){return n.filter(function(n){return n!==e})}),D&&"function"==typeof D&&D(e)},le=function(e){G(function(n){return n.filter(function(n){return n!==e})}),B&&"function"==typeof B&&B(e)},ae=function(e){G(function(n){return n.map(function(n){return n===e.file?Object.assign(n,{processor:p({},n.processor,{percent:e.percent+"%",status:"pending"})}):n})})},ce=function(e){G(function(n){return n.map(function(n){return n===e.file?Object.assign(n,{processor:p({},n.processor,{percent:"",status:"finished"})}):n})})},ue=function(e){G(function(n){return n.map(function(n){return n===e.file?Object.assign(n,{errors:e.errors,processor:p({},n.processor,{status:"error"})}):n})})};return a.default.useEffect(function(){return function(){P.forEach(function(e){return e.preview&&URL.revokeObjectURL(e.preview)})}},[P]),a.default.useEffect(function(){var e=I&&P.length<I,n=y&&P.length>y;K(function(e,n){if(null===e)return null;var r=N.dropzone.errors[e];switch(e){case"too-many-files":return r.message+" "+n.maxFiles+" "+N.dropzone.files+".";case"too-few-files":return r.message+" "+n.minFiles+" "+N.dropzone.files+".";default:return r.message}}(n?"too-many-files":e?"too-few-files":null,{minFiles:I,maxFiles:y})),O&&P.length>0&&!n&&!e&&G(function(e){return e.map(function(e){return!e.errors&&!e.processor&&C&&C({file:e,onError:ue,onFinish:ce,onProgress:ae}),e})})},[O,P.length,C]),t.jsxs(r.InverseContext.Provider,{value:{isInverse:Y},children:[t.jsxs(r.FormFieldContainer,{actionable:!1,containerStyle:l,errorMessage:Z,fieldId:Q,inputSize:m,isInverse:Y,isLabelVisuallyHidden:x,labelStyle:h,labelText:v,messageStyle:{minHeight:0},"data-testid":R,children:[t.jsx(q,{theme:J,isInverse:Y,children:u}),t.jsxs(V,p({behavior:r.FlexBehavior.container,dragState:ie,isInverse:Y,noDrag:w,theme:J},_(),E,{testId:R,tabIndex:-1,children:[t.jsx("input",{ref:o,type:oe.type,accept:oe.accept,autoComplete:oe.autoComplete,id:oe.id,multiple:oe.multiple,onChange:oe.onChange,onClick:oe.onClick,style:oe.style,tabIndex:oe.tabIndex}),w?t.jsx(r.Flex,{xs:!0,behavior:r.FlexBehavior.item,children:t.jsx(r.Button,{color:r.ButtonColor.primary,disabled:c,isInverse:Y,onClick:te,style:{margin:0},children:N.dropzone.browseFiles})}):t.jsxs(r.Flex,{behavior:r.FlexBehavior.item,children:[t.jsx(n.CloudUploadIcon,{"aria-hidden":"true",color:Y?J.colors.neutral100:J.colors.neutral500,size:48}),t.jsx(U,{isInverse:Y,theme:J,children:N.dropzone.dragMessage}),t.jsx(r.Button,{color:r.ButtonColor.primary,disabled:c,isInverse:Y,onClick:te,style:{margin:0},variant:r.ButtonVariant.solid,children:N.dropzone.browseFiles})]})]}))]}),P.map(function(e){return t.jsx(H,{accept:s,file:e,isInverse:Y,maxSize:b,minSize:j,onDeleteFile:le,onRemoveFile:se,thumbnails:T},e.name)})]})}),e.FileIcon=d});
1
+ !function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react-magma-icons"),require("react-magma-dom"),require("react/jsx-runtime"),require("react"),require("react-dropzone"),require("@emotion/styled"),require("polished")):"function"==typeof define&&define.amd?define(["exports","react-magma-icons","react-magma-dom","react/jsx-runtime","react","react-dropzone","@emotion/styled","polished"],n):n((e||self).dropzone={},e.reactMagmaIcons,e.reactMagmaDom,e.jsx,e.react,e.reactDropzone,e.styled,e.polished)}(this,function(e,n,r,t,o,i,s,a){function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=l(o),u=l(s),d={default:{Icon:n.InsertDriveFileIcon,style:{color:r.magma.colors.neutral500}},word:{Icon:n.FileWordIcon,style:{color:r.magma.colors.info500}},excel:{Icon:n.FileExcelIcon,style:{color:r.magma.colors.success500}},powerpoint:{Icon:n.FilePowerpointIcon,style:{color:r.magma.colors.warning500}},pdf:{Icon:n.FilePdfIcon,style:{color:r.magma.colors.danger500}},image:{Icon:n.ImageIcon,style:{color:r.magma.colors.neutral500}},video:{Icon:n.VideocamIcon,style:{color:r.magma.colors.neutral500}},audio:{Icon:n.AudiotrackIcon,style:{color:r.magma.colors.neutral500}},archive:{Icon:n.FileZipIcon,style:{color:r.magma.colors.neutral500}}},p={default:d.default,xlsx:d.excel,xlsm:d.excel,xlsb:d.excel,xltx:d.excel,xls:d.excel,xlt:d.excel,doc:d.word,docx:d.word,docm:d.word,dotx:d.word,dotm:d.word,docb:d.word,pptx:d.powerpoint,pptm:d.powerpoint,ppt:d.powerpoint,pdf:d.pdf,png:d.image,svg:d.image,image:d.image,audio:d.audio,video:d.video,zip:d.archive},f=function(e){var n=e.file,o=e.isInverse,i=n.path,s=void 0===i?"":i,a=n.type,l=(void 0===a?"":a).split("/")[0],c=s.split(".").pop()||"default",u=p[c]||p[l]||p.default;return t.jsx(u.Icon,{size:r.magma.iconSizes.medium,style:o?{}:u.style})};function m(){return m=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t])}return e},m.apply(this,arguments)}function g(e,n){if(null==e)return{};var r={};for(var t in e)if(Object.prototype.hasOwnProperty.call(e,t)){if(n.indexOf(t)>=0)continue;r[t]=e[t]}return r}function x(e,n){return n||(n=e.slice(0)),e.raw=n,e}var h,v,y,I,b,j,z,F,S,w,C,B=function(e,n,r){if(void 0===n&&(n=2),void 0===r&&(r="Bytes"),void 0!==e){if(0==e)return"0 "+r;var t=[r,"KB","MB","GB","TB","PB","EB","ZB","YB"],o=Math.floor(Math.log(e)/Math.log(1024));return parseFloat((e/Math.pow(1024,o)).toFixed(n))+" "+t[o]}},D=["accept","file","isInverse","maxSize","minSize","onDeleteFile","onRemoveFile","testId","thumbnails"],k=["code"],O=u.default,R=O.div(h||(h=x(["\n background-image: ",";\n background-repeat: no-repeat;\n background-size: cover;\n display: inline-block;\n vertical-align: middle;\n height: 40px;\n width: 40px;\n"])),function(e){var n=e.file;return"url('"+("preview"in n&&n.preview)+"')"}),A=O.div(v||(v=x(["\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"]))),T={marginRight:"12px",display:"flex"},E=O.div(y||(y=x(["\n border-top: 1px solid ",";\n padding: 16px;\n font-size: ",";\n line-height: ",";\n"])),function(e){return e.theme.colors.neutral300},function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight}),M=O(r.Flex)(I||(I=x(["\n height: 56px;\n padding: 0 8px 0 16px;\n font-size: ",";\n line-height: ",";\n"])),function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight}),P=O(r.Flex)(b||(b=x(["\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: ",";\n line-height: ",";\n"])),function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight}),H=O(r.Card)(j||(j=x(["\n background-color: none;\n border-color: ",";\n border-width: 1px;\n margin: 10px 0;\n"])),function(e){var n=e.theme;return e.file.errors?e.isInverse?n.colors.danger200:n.colors.danger:n.colors.neutral300}),L=u.default.span(z||(z=x(["\n display: block;\n\n > div {\n display: flex;\n align-self: center;\n margin-right: 12px;\n }\n"]))),q=u.default.span(F||(F=x(["\n display: block;\n"]))),V=o.forwardRef(function(e,i){var s,a=e.accept,l=e.file,u=e.isInverse,d=e.maxSize,p=e.minSize,x=e.onDeleteFile,h=e.onRemoveFile,v=e.thumbnails,y=g(e,D),I=o.useContext(r.ThemeContext),b=c.default.useContext(r.I18nContext),j=r.useIsInverse(u),z=o.useState(t.jsx(n.CloseIcon,{})),F=z[0],S=z[1],w=function(){h&&"function"==typeof h&&h(l)},C=function(){x&&"function"==typeof x&&x(l)},O=function(e){var i=e.status,s=void 0===i?"ready":i,a=o.useState(!1),l=a[0],c=a[1];return o.useEffect(function(){var e=!0;return setTimeout(function(){e&&c(!0)},1e3),function(){e=!1}},[s]),"error"===s||"ready"===s?t.jsx(A,{children:t.jsx(r.IconButton,{onClick:w,variant:r.ButtonVariant.link,color:r.ButtonColor.secondary,"aria-label":b.dropzone.removeFile,icon:t.jsx(n.CloseIcon,{})})}):"pending"===s?t.jsx(A,{children:t.jsx(r.Spinner,{color:j?I.colors.neutral100:I.colors.primary})}):t.jsxs(A,{children:[t.jsx(r.Transition,{isOpen:!l,unmountOnExit:!0,fade:!0,children:t.jsx(n.CheckCircleIcon,{color:j?I.colors.success200:I.colors.success,style:{marginTop:"4px"}})}),t.jsx(r.Transition,{isOpen:l,unmountOnExit:!0,fade:!0,children:t.jsx(r.IconButton,{onClick:C,variant:r.ButtonVariant.link,color:r.ButtonColor.secondary,"aria-label":b.dropzone.deleteFile,icon:t.jsx(n.DeleteIcon,{})})})]})};return o.useEffect(function(){var e;S(t.jsx(O,{status:null==l||null==(e=l.processor)?void 0:e.status}))},[null==l||null==(s=l.processor)?void 0:s.status]),t.jsx(r.InverseContext.Provider,{value:{isInverse:j},children:t.jsxs(H,{isInverse:j,theme:I,file:l,"data-testid":e.testId,ref:i,role:l.errors?"alert":"",children:[t.jsxs(M,m({theme:I,behavior:r.FlexBehavior.container,alignItems:r.FlexAlignItems.center},y,{children:[t.jsx(r.Flex,{behavior:r.FlexBehavior.item,alignItems:r.FlexAlignItems.center,style:T,children:l.errors?t.jsx(n.ErrorIcon,{color:j?I.colors.danger200:I.colors.danger,size:24}):l.preview&&v&&l.type&&l.type.startsWith("image")?t.jsx(R,{role:"img",file:l}):t.jsx(f,{isInverse:j,file:l})}),t.jsx(P,{xs:!0,behavior:r.FlexBehavior.item,theme:I,children:l.name}),l.processor&&"pending"===l.processor.status&&t.jsx(r.Flex,{role:"progressbar",style:{marginLeft:"auto"},behavior:r.FlexBehavior.item,children:l.processor.percent}),t.jsx(r.Flex,{behavior:r.FlexBehavior.item,children:F})]})),l.errors&&t.jsx(E,{theme:I,children:l.errors.slice(0,1).map(function(e){var n=e.code,r=function(e,n,r){var t=Array.isArray(n.accept)&&1===n.accept.length?n.accept[0]:n.accept,o=Array.isArray(t)?"one of "+t.join(", "):t;switch(e.code){case"file-too-large":return m({},e,{message:e.message+" "+B(n.maxSize,2,r)+"."});case"file-too-small":return m({},e,{message:e.message+" "+B(n.minSize,2,r)+"."});case"file-invalid-type":return m({},e,{message:e.message+": "+o});default:return e}}(m({code:n},g(e,k),b.dropzone.errors[n]),{accept:a,minSize:p,maxSize:d},b.dropzone.bytes),o=r.header,i=r.message;return t.jsxs(c.default.Fragment,{children:[t.jsx(L,{style:{color:j?I.colors.danger200:I.colors.danger},children:void 0===o?"":o}),t.jsx(q,{children:i})]},n)})})]})})}),U=["accept","containerStyle","disabled","dropzoneOptions","helperMessage","id","inputSize","isInverse","isLabelVisuallyHidden","labelStyle","labelText","maxFiles","minFiles","maxSize","minSize","multiple","noDrag","onSendFile","onDeleteFile","onRemoveFile","sendFiles","testId","thumbnails"],G=u.default,W=G(r.Flex)(S||(S=x(["\n flex-direction: column;\n align-items: ",";\n justify-content: ",";\n text-align: ",";\n padding: ",";\n border-radius: ",";\n border: ",";\n\n border-style: ",";\n background-color: ",";\n outline: none;\n transition: ",";\n"])),function(e){return e.noDrag?"left":"center"},function(e){return e.noDrag?"left":"center"},function(e){return e.noDrag?"left":"center"},function(e){return e.noDrag?"0px":"24px"},function(e){return e.noDrag?"0px":"4px"},function(e){var n=e.dragState,r=void 0===n?"default":n,t=e.theme;return e.noDrag?"0px":"dragReject"===r||"error"===r?e.isInverse?"1px dashed "+t.colors.danger200:"1px dashed "+t.colors.danger:"dragActive"===r?"1px dashed "+t.colors.primary:"dragAccept"===r?"1px dashed "+t.colors.success:"1px dashed "+t.colors.neutral400},function(e){var n=e.dragState;return"error"===(void 0===n?"default":n)?"solid":"dashed"},function(e){var n=e.theme;return e.noDrag?"transparent":e.isInverse?a.transparentize(.75,n.colors.neutral900):n.colors.neutral200},function(e){return"border "+(e.noDrag?0:".24s")+" ease-in-out"}),Z=G.span(w||(w=x(["\n color: ",";\n display: block;\n font-size: 14px;\n margin: -8px 0 16px 0;\n"])),function(e){var n=e.theme;return e.isInverse?n.colors.neutral100:n.colors.neutral700}),K=G.div(C||(C=x(["\n color: ",";\n margin: 0 0 24px 0;\n font-size: ",";\n line-height: ",";\n font-weight: 500;\n padding: ",";\n"])),function(e){var n=e.theme;return e.isInverse?n.colors.neutral100:n.colors.neutral700},function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight},function(e){return e.theme.spaceScale.spacing01});e.Dropzone=c.default.forwardRef(function(e,o){var s=e.accept,a=e.containerStyle,l=e.disabled,u=e.helperMessage,d=e.id,p=e.inputSize,f=e.isInverse,x=e.isLabelVisuallyHidden,h=e.labelStyle,v=e.labelText,y=e.maxFiles,I=e.minFiles,b=e.maxSize,j=e.minSize,z=e.multiple,F=void 0===z||z,S=e.noDrag,w=void 0!==S&&S,C=e.onSendFile,B=e.onDeleteFile,D=e.onRemoveFile,k=e.sendFiles,O=void 0!==k&&k,R=e.testId,A=e.thumbnails,T=void 0===A||A,E=g(e,U),M=c.default.useState([]),P=M[0],H=M[1],L=c.default.useState(null),q=L[0],G=L[1],Y=r.useIsInverse(f),J=c.default.useContext(r.ThemeContext),N=c.default.useContext(r.I18nContext),Q=r.useGenerateId(d),X=c.default.useCallback(function(e,n){H(function(r){return[].concat(r,e.map(function(e){return Object.assign(e,{preview:URL.createObjectURL(e)})}),n.map(function(e){return Object.assign(e.file,{errors:e.errors})}))})},[]),$=i.useDropzone({noClick:!0,disabled:l,multiple:F,maxSize:b,minSize:j,accept:s,onDrop:X,noDrag:w}),_=$.getRootProps,ee=$.isDragAccept,ne=$.isDragActive,re=$.isDragReject,te=$.open,oe=(0,$.getInputProps)({id:Q}),ie=q?"error":ee?"dragAccept":re?"dragReject":ne?"dragActive":"default",se=function(e){H(function(n){return n.filter(function(n){return n!==e})}),D&&"function"==typeof D&&D(e)},ae=function(e){H(function(n){return n.filter(function(n){return n!==e})}),B&&"function"==typeof B&&B(e)},le=function(e){H(function(n){return n.map(function(n){return n===e.file?Object.assign(n,{processor:m({},n.processor,{percent:e.percent+"%",status:"pending"})}):n})})},ce=function(e){H(function(n){return n.map(function(n){return n===e.file?Object.assign(n,{processor:m({},n.processor,{percent:"",status:"finished"})}):n})})},ue=function(e){H(function(n){return n.map(function(n){return n===e.file?Object.assign(n,{errors:e.errors,processor:m({},n.processor,{status:"error"})}):n})})};return c.default.useEffect(function(){return function(){P.forEach(function(e){return e.preview&&URL.revokeObjectURL(e.preview)})}},[P]),c.default.useEffect(function(){var e=I&&P.length<I,n=y&&P.length>y;G(function(e,n){if(null===e)return null;var r=N.dropzone.errors[e];switch(e){case"too-many-files":return r.message+" "+n.maxFiles+" "+N.dropzone.files+".";case"too-few-files":return r.message+" "+n.minFiles+" "+N.dropzone.files+".";default:return r.message}}(n?"too-many-files":e?"too-few-files":null,{minFiles:I,maxFiles:y})),O&&P.length>0&&!n&&!e&&H(function(e){return e.map(function(e){return!e.errors&&!e.processor&&C&&C({file:e,onError:ue,onFinish:ce,onProgress:le}),e})})},[O,P.length,C]),t.jsxs(r.InverseContext.Provider,{value:{isInverse:Y},children:[t.jsxs(r.FormFieldContainer,{actionable:!1,containerStyle:a,errorMessage:q,fieldId:Q,inputSize:p,isInverse:Y,isLabelVisuallyHidden:x,labelStyle:h,labelText:v,messageStyle:{minHeight:0},"data-testid":R,children:[t.jsx(Z,{theme:J,isInverse:Y,children:u}),t.jsxs(W,m({behavior:r.FlexBehavior.container,dragState:ie,isInverse:Y,noDrag:w,theme:J},_(),E,{testId:R,tabIndex:-1,children:[t.jsx("input",{ref:o,type:oe.type,accept:oe.accept,autoComplete:oe.autoComplete,id:oe.id,multiple:oe.multiple,onChange:oe.onChange,onClick:oe.onClick,style:oe.style,tabIndex:oe.tabIndex}),w?t.jsx(r.Flex,{xs:!0,behavior:r.FlexBehavior.item,children:t.jsx(r.Button,{color:r.ButtonColor.primary,disabled:l,isInverse:Y,onClick:te,style:{margin:0},children:N.dropzone.browseFiles})}):t.jsxs(r.Flex,{behavior:r.FlexBehavior.item,children:[t.jsx(n.CloudUploadIcon,{"aria-hidden":"true",color:Y?J.colors.neutral100:J.colors.neutral500,size:48}),t.jsx(K,{isInverse:Y,theme:J,children:N.dropzone.dragMessage}),t.jsx(r.Button,{color:r.ButtonColor.primary,disabled:l,isInverse:Y,onClick:te,style:{margin:0},variant:r.ButtonVariant.solid,children:N.dropzone.browseFiles})]})]}))]}),P.map(function(e){return t.jsx(V,{accept:s,file:e,isInverse:Y,maxSize:b,minSize:j,onDeleteFile:ae,onRemoveFile:se,thumbnails:T},e.name)})]})}),e.FileIcon=f});
2
2
  //# sourceMappingURL=fileuploader.umd.js.map