@mantine/dropzone 9.0.0-alpha.7 → 9.0.1

package/cjs/Dropzone.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Dropzone.cjs","names":["DropzoneProvider","Box","LoadingOverlay","classes","DropzoneAccept","DropzoneIdle","DropzoneReject"],"sources":["../src/Dropzone.tsx"],"sourcesContent":["import {\n  Accept,\n  DropEvent,\n  FileError,\n  FileRejection,\n  FileWithPath,\n  useDropzone,\n} from 'react-dropzone';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getRadius,\n  LoaderProps,\n  LoadingOverlay,\n  MantineColor,\n  MantineRadius,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { assignRef } from '@mantine/hooks';\nimport { DropzoneProvider } from './Dropzone.context';\nimport type { DropzoneFullScreenType } from './DropzoneFullScreen';\nimport { DropzoneAccept, DropzoneIdle, DropzoneReject } from './DropzoneStatus';\nimport classes from './Dropzone.module.css';\n\nexport type DropzoneStylesNames = 'root' | 'inner';\nexport type DropzoneVariant = 'filled' | 'light';\nexport type DropzoneCssVariables = {\n  root:\n    | '--dropzone-radius'\n    | '--dropzone-accept-color'\n    | '--dropzone-accept-bg'\n    | '--dropzone-reject-color'\n    | '--dropzone-reject-bg';\n};\n\nexport interface DropzoneProps\n  extends BoxProps, StylesApiProps<DropzoneFactory>, ElementProps<'div', 'onDrop'> {\n  /** Key of `theme.colors` or any valid CSS color to set colors of `Dropzone.Accept` @default theme.primaryColor */\n  acceptColor?: MantineColor;\n\n  /** Key of `theme.colors` or any valid CSS color to set colors of `Dropzone.Reject` @default 'red' */\n  rejectColor?: MantineColor;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Determines whether files capturing should be disabled @default false */\n  disabled?: boolean;\n\n  /** Called when any files are dropped to the dropzone */\n  onDropAny?: (files: FileWithPath[], fileRejections: FileRejection[]) => void;\n\n  /** Called when valid files are dropped to the dropzone */\n  onDrop: (files: FileWithPath[]) => void;\n\n  /** Called when dropped files do not meet file restrictions */\n  onReject?: (fileRejections: FileRejection[]) => void;\n\n  /** Determines whether a loading overlay should be displayed over the dropzone @default false */\n  loading?: boolean;\n\n  /** Mime types of the files that dropzone can accepts. By default, dropzone accepts all file types. */\n  accept?: Accept | string[];\n\n  /** A ref function which when called opens the file system file picker */\n  openRef?: React.Ref<() => void | undefined>;\n\n  /** Determines whether multiple files can be dropped to the dropzone or selected from file system picker @default true */\n  multiple?: boolean;\n\n  /** Maximum file size in bytes */\n  maxSize?: number;\n\n  /** Name of the form control. Submitted with the form as part of a name/value pair. */\n  name?: string;\n\n  /** Maximum number of files that can be picked at once */\n  maxFiles?: number;\n\n  /** Set to autofocus the root element */\n  autoFocus?: boolean;\n\n  /** If `false`, disables click to open the native file selection dialog */\n  activateOnClick?: boolean;\n\n  /** If `false`, disables drag 'n' drop */\n  activateOnDrag?: boolean;\n\n  /** If `false`, disables Space/Enter to open the native file selection dialog. Note that it also stops tracking the focus state. */\n  activateOnKeyboard?: boolean;\n\n  /** If `false`, stops drag event propagation to parents */\n  dragEventsBubbling?: boolean;\n\n  /** Called when the `dragenter` event occurs */\n  onDragEnter?: (event: React.DragEvent<HTMLElement>) => void;\n\n  /** Called when the `dragleave` event occurs */\n  onDragLeave?: (event: React.DragEvent<HTMLElement>) => void;\n\n  /** Called when the `dragover` event occurs */\n  onDragOver?: (event: React.DragEvent<HTMLElement>) => void;\n\n  /** Called when user closes the file selection dialog with no selection */\n  onFileDialogCancel?: () => void;\n\n  /** Called when user opens the file selection dialog */\n  onFileDialogOpen?: () => void;\n\n  /** If `false`, allow dropped items to take over the current browser window */\n  preventDropOnDocument?: boolean;\n\n  /** Set to true to use the File System Access API to open the file picker instead of using an `input type=\"file\"` click event @default true */\n  useFsAccessApi?: boolean;\n\n  /** Use this to provide a custom file aggregator */\n  getFilesFromEvent?: (event: DropEvent) => Promise<Array<File | DataTransferItem>>;\n\n  /** Custom validation function. It must return null if there's no errors. */\n  validator?: <T extends File>(file: T) => FileError | FileError[] | null;\n\n  /** Determines whether pointer events should be enabled on the inner element @default false */\n  enablePointerEvents?: boolean;\n\n  /** Props passed down to the Loader component */\n  loaderProps?: LoaderProps;\n\n  /** Props passed down to the internal Input component */\n  inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n}\n\nexport type DropzoneFactory = Factory<{\n  props: DropzoneProps;\n  ref: HTMLDivElement;\n  stylesNames: DropzoneStylesNames;\n  vars: DropzoneCssVariables;\n  staticComponents: {\n    Accept: typeof DropzoneAccept;\n    Idle: typeof DropzoneIdle;\n    Reject: typeof DropzoneReject;\n    FullScreen: DropzoneFullScreenType;\n  };\n}>;\n\nconst defaultProps = {\n  multiple: true,\n  maxSize: Infinity,\n  activateOnClick: true,\n  activateOnDrag: true,\n  dragEventsBubbling: true,\n  activateOnKeyboard: true,\n  useFsAccessApi: true,\n  variant: 'light',\n  rejectColor: 'red',\n} satisfies Partial<DropzoneProps>;\n\nconst varsResolver = createVarsResolver<DropzoneFactory>(\n  (theme, { radius, variant, acceptColor, rejectColor }) => {\n    const acceptColors = theme.variantColorResolver({\n      color: acceptColor || theme.primaryColor,\n      theme,\n      variant: variant!,\n    });\n\n    const rejectColors = theme.variantColorResolver({\n      color: rejectColor || 'red',\n      theme,\n      variant: variant!,\n    });\n\n    return {\n      root: {\n        '--dropzone-radius': getRadius(radius),\n        '--dropzone-accept-color': acceptColors.color,\n        '--dropzone-accept-bg': acceptColors.background,\n        '--dropzone-reject-color': rejectColors.color,\n        '--dropzone-reject-bg': rejectColors.background,\n      },\n    };\n  }\n);\n\nexport const Dropzone = factory<DropzoneFactory>((_props) => {\n  const props = useProps('Dropzone', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    radius,\n    disabled,\n    loading,\n    multiple,\n    maxSize,\n    accept,\n    children,\n    onDropAny,\n    onDrop,\n    onReject,\n    openRef,\n    name,\n    maxFiles,\n    autoFocus,\n    activateOnClick,\n    activateOnDrag,\n    dragEventsBubbling,\n    activateOnKeyboard,\n    onDragEnter,\n    onDragLeave,\n    onDragOver,\n    onFileDialogCancel,\n    onFileDialogOpen,\n    preventDropOnDocument,\n    useFsAccessApi,\n    getFilesFromEvent,\n    validator,\n    rejectColor,\n    acceptColor,\n    enablePointerEvents,\n    loaderProps,\n    inputProps,\n    mod,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<DropzoneFactory>({\n    name: 'Dropzone',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { getRootProps, getInputProps, isDragAccept, isDragReject, isDragActive, open } =\n    useDropzone({\n      onDrop: onDropAny,\n      onDropAccepted: onDrop,\n      onDropRejected: onReject,\n      disabled: disabled || loading,\n      accept: Array.isArray(accept) ? accept.reduce((r, key) => ({ ...r, [key]: [] }), {}) : accept,\n      multiple,\n      maxSize,\n      maxFiles,\n      autoFocus,\n      noClick: !activateOnClick,\n      noDrag: !activateOnDrag,\n      noDragEventsBubbling: !dragEventsBubbling,\n      noKeyboard: !activateOnKeyboard,\n      onDragEnter,\n      onDragLeave,\n      onDragOver,\n      onFileDialogCancel,\n      onFileDialogOpen,\n      preventDropOnDocument,\n      useFsAccessApi,\n      validator,\n      ...(getFilesFromEvent ? { getFilesFromEvent } : null),\n    });\n\n  assignRef(openRef, open);\n\n  const isAccepted = isDragActive && isDragAccept;\n  const isRejected = isDragActive && isDragReject;\n  const isIdle = !isAccepted && !isRejected;\n\n  return (\n    <DropzoneProvider value={{ accept: isAccepted, reject: isRejected, idle: isIdle }}>\n      <Box\n        {...getRootProps()}\n        {...getStyles('root', { focusable: true })}\n        {...others}\n        mod={[\n          {\n            accept: isAccepted,\n            reject: isRejected,\n            idle: isIdle,\n            disabled,\n            loading,\n            'activate-on-click': activateOnClick,\n          },\n          mod,\n        ]}\n      >\n        <LoadingOverlay\n          visible={loading}\n          overlayProps={{ radius }}\n          unstyled={unstyled}\n          loaderProps={loaderProps}\n        />\n        <input {...getInputProps(inputProps)} name={name} />\n        <div {...getStyles('inner')} data-enable-pointer-events={enablePointerEvents || undefined}>\n          {children}\n        </div>\n      </Box>\n    </DropzoneProvider>\n  );\n});\n\nDropzone.classes = classes;\nDropzone.varsResolver = varsResolver;\nDropzone.displayName = '@mantine/dropzone/Dropzone';\nDropzone.Accept = DropzoneAccept;\nDropzone.Idle = DropzoneIdle;\nDropzone.Reject = DropzoneReject;\n"],"mappings":"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"}
+{"version":3,"file":"Dropzone.cjs","names":["DropzoneProvider","Box","LoadingOverlay","classes","DropzoneAccept","DropzoneIdle","DropzoneReject"],"sources":["../src/Dropzone.tsx"],"sourcesContent":["import {\n  Accept,\n  DropEvent,\n  FileError,\n  FileRejection,\n  FileWithPath,\n  useDropzone,\n} from 'react-dropzone';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getRadius,\n  LoaderProps,\n  LoadingOverlay,\n  MantineColor,\n  MantineRadius,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { assignRef } from '@mantine/hooks';\nimport { DropzoneProvider } from './Dropzone.context';\nimport type {\n  DropzoneFullScreenFactory,\n  DropzoneFullScreenProps,\n  DropzoneFullScreenStylesNames,\n  DropzoneFullScreenType,\n} from './DropzoneFullScreen';\nimport { DropzoneAccept, DropzoneIdle, DropzoneReject } from './DropzoneStatus';\nimport classes from './Dropzone.module.css';\n\nexport type DropzoneStylesNames = 'root' | 'inner';\nexport type DropzoneVariant = 'filled' | 'light';\nexport type DropzoneCssVariables = {\n  root:\n    | '--dropzone-radius'\n    | '--dropzone-accept-color'\n    | '--dropzone-accept-bg'\n    | '--dropzone-reject-color'\n    | '--dropzone-reject-bg';\n};\n\nexport interface DropzoneProps\n  extends BoxProps, StylesApiProps<DropzoneFactory>, ElementProps<'div', 'onDrop'> {\n  /** Key of `theme.colors` or any valid CSS color to set colors of `Dropzone.Accept` @default theme.primaryColor */\n  acceptColor?: MantineColor;\n\n  /** Key of `theme.colors` or any valid CSS color to set colors of `Dropzone.Reject` @default 'red' */\n  rejectColor?: MantineColor;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Determines whether files capturing should be disabled @default false */\n  disabled?: boolean;\n\n  /** Called when any files are dropped to the dropzone */\n  onDropAny?: (files: FileWithPath[], fileRejections: FileRejection[]) => void;\n\n  /** Called when valid files are dropped to the dropzone */\n  onDrop: (files: FileWithPath[]) => void;\n\n  /** Called when dropped files do not meet file restrictions */\n  onReject?: (fileRejections: FileRejection[]) => void;\n\n  /** Determines whether a loading overlay should be displayed over the dropzone @default false */\n  loading?: boolean;\n\n  /** Mime types of the files that dropzone can accepts. By default, dropzone accepts all file types. */\n  accept?: Accept | string[];\n\n  /** A ref function which when called opens the file system file picker */\n  openRef?: React.Ref<() => void | undefined>;\n\n  /** Determines whether multiple files can be dropped to the dropzone or selected from file system picker @default true */\n  multiple?: boolean;\n\n  /** Maximum file size in bytes */\n  maxSize?: number;\n\n  /** Name of the form control. Submitted with the form as part of a name/value pair. */\n  name?: string;\n\n  /** Maximum number of files that can be picked at once */\n  maxFiles?: number;\n\n  /** Set to autofocus the root element */\n  autoFocus?: boolean;\n\n  /** If `false`, disables click to open the native file selection dialog */\n  activateOnClick?: boolean;\n\n  /** If `false`, disables drag 'n' drop */\n  activateOnDrag?: boolean;\n\n  /** If `false`, disables Space/Enter to open the native file selection dialog. Note that it also stops tracking the focus state. */\n  activateOnKeyboard?: boolean;\n\n  /** If `false`, stops drag event propagation to parents */\n  dragEventsBubbling?: boolean;\n\n  /** Called when the `dragenter` event occurs */\n  onDragEnter?: (event: React.DragEvent<HTMLElement>) => void;\n\n  /** Called when the `dragleave` event occurs */\n  onDragLeave?: (event: React.DragEvent<HTMLElement>) => void;\n\n  /** Called when the `dragover` event occurs */\n  onDragOver?: (event: React.DragEvent<HTMLElement>) => void;\n\n  /** Called when user closes the file selection dialog with no selection */\n  onFileDialogCancel?: () => void;\n\n  /** Called when user opens the file selection dialog */\n  onFileDialogOpen?: () => void;\n\n  /** If `false`, allow dropped items to take over the current browser window */\n  preventDropOnDocument?: boolean;\n\n  /** Set to true to use the File System Access API to open the file picker instead of using an `input type=\"file\"` click event @default true */\n  useFsAccessApi?: boolean;\n\n  /** Use this to provide a custom file aggregator */\n  getFilesFromEvent?: (event: DropEvent) => Promise<Array<File | DataTransferItem>>;\n\n  /** Custom validation function. It must return null if there's no errors. */\n  validator?: <T extends File>(file: T) => FileError | FileError[] | null;\n\n  /** Determines whether pointer events should be enabled on the inner element @default false */\n  enablePointerEvents?: boolean;\n\n  /** Props passed down to the Loader component */\n  loaderProps?: LoaderProps;\n\n  /** Props passed down to the internal Input component */\n  inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n}\n\nexport type DropzoneFactory = Factory<{\n  props: DropzoneProps;\n  ref: HTMLDivElement;\n  stylesNames: DropzoneStylesNames;\n  vars: DropzoneCssVariables;\n  staticComponents: {\n    Accept: typeof DropzoneAccept;\n    Idle: typeof DropzoneIdle;\n    Reject: typeof DropzoneReject;\n    FullScreen: DropzoneFullScreenType;\n  };\n}>;\n\nconst defaultProps = {\n  multiple: true,\n  maxSize: Infinity,\n  activateOnClick: true,\n  activateOnDrag: true,\n  dragEventsBubbling: true,\n  activateOnKeyboard: true,\n  useFsAccessApi: true,\n  variant: 'light',\n  rejectColor: 'red',\n} satisfies Partial<DropzoneProps>;\n\nconst varsResolver = createVarsResolver<DropzoneFactory>(\n  (theme, { radius, variant, acceptColor, rejectColor }) => {\n    const acceptColors = theme.variantColorResolver({\n      color: acceptColor || theme.primaryColor,\n      theme,\n      variant: variant!,\n    });\n\n    const rejectColors = theme.variantColorResolver({\n      color: rejectColor || 'red',\n      theme,\n      variant: variant!,\n    });\n\n    return {\n      root: {\n        '--dropzone-radius': getRadius(radius),\n        '--dropzone-accept-color': acceptColors.color,\n        '--dropzone-accept-bg': acceptColors.background,\n        '--dropzone-reject-color': rejectColors.color,\n        '--dropzone-reject-bg': rejectColors.background,\n      },\n    };\n  }\n);\n\nexport const Dropzone = factory<DropzoneFactory>((_props) => {\n  const props = useProps('Dropzone', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    radius,\n    disabled,\n    loading,\n    multiple,\n    maxSize,\n    accept,\n    children,\n    onDropAny,\n    onDrop,\n    onReject,\n    openRef,\n    name,\n    maxFiles,\n    autoFocus,\n    activateOnClick,\n    activateOnDrag,\n    dragEventsBubbling,\n    activateOnKeyboard,\n    onDragEnter,\n    onDragLeave,\n    onDragOver,\n    onFileDialogCancel,\n    onFileDialogOpen,\n    preventDropOnDocument,\n    useFsAccessApi,\n    getFilesFromEvent,\n    validator,\n    rejectColor,\n    acceptColor,\n    enablePointerEvents,\n    loaderProps,\n    inputProps,\n    mod,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<DropzoneFactory>({\n    name: 'Dropzone',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { getRootProps, getInputProps, isDragAccept, isDragReject, isDragActive, open } =\n    useDropzone({\n      onDrop: onDropAny,\n      onDropAccepted: onDrop,\n      onDropRejected: onReject,\n      disabled: disabled || loading,\n      accept: Array.isArray(accept) ? accept.reduce((r, key) => ({ ...r, [key]: [] }), {}) : accept,\n      multiple,\n      maxSize,\n      maxFiles,\n      autoFocus,\n      noClick: !activateOnClick,\n      noDrag: !activateOnDrag,\n      noDragEventsBubbling: !dragEventsBubbling,\n      noKeyboard: !activateOnKeyboard,\n      onDragEnter,\n      onDragLeave,\n      onDragOver,\n      onFileDialogCancel,\n      onFileDialogOpen,\n      preventDropOnDocument,\n      useFsAccessApi,\n      validator,\n      ...(getFilesFromEvent ? { getFilesFromEvent } : null),\n    });\n\n  assignRef(openRef, open);\n\n  const isAccepted = isDragActive && isDragAccept;\n  const isRejected = isDragActive && isDragReject;\n  const isIdle = !isAccepted && !isRejected;\n\n  return (\n    <DropzoneProvider value={{ accept: isAccepted, reject: isRejected, idle: isIdle }}>\n      <Box\n        {...getRootProps()}\n        {...getStyles('root', { focusable: true })}\n        {...others}\n        mod={[\n          {\n            accept: isAccepted,\n            reject: isRejected,\n            idle: isIdle,\n            disabled,\n            loading,\n            'activate-on-click': activateOnClick,\n          },\n          mod,\n        ]}\n      >\n        <LoadingOverlay\n          visible={loading}\n          overlayProps={{ radius }}\n          unstyled={unstyled}\n          loaderProps={loaderProps}\n        />\n        <input {...getInputProps(inputProps)} name={name} />\n        <div {...getStyles('inner')} data-enable-pointer-events={enablePointerEvents || undefined}>\n          {children}\n        </div>\n      </Box>\n    </DropzoneProvider>\n  );\n});\n\nDropzone.classes = classes;\nDropzone.varsResolver = varsResolver;\nDropzone.displayName = '@mantine/dropzone/Dropzone';\nDropzone.Accept = DropzoneAccept;\nDropzone.Idle = DropzoneIdle;\nDropzone.Reject = DropzoneReject;\n\nexport namespace Dropzone {\n  export type Props = DropzoneProps;\n  export type StylesNames = DropzoneStylesNames;\n  export type CssVariables = DropzoneCssVariables;\n  export type Factory = DropzoneFactory;\n\n  export namespace FullScreen {\n    export type Props = DropzoneFullScreenProps;\n    export type StylesNames = DropzoneFullScreenStylesNames;\n    export type Factory = DropzoneFullScreenFactory;\n  }\n}\n"],"mappings":"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"}

package/cjs/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["DropzoneFullScreen","_Dropzone"],"sources":["../src/index.ts"],"sourcesContent":["import type { FileRejection, FileWithPath } from 'react-dropzone';\nimport type {\n  DropzoneCssVariables,\n  DropzoneFactory,\n  DropzoneProps,\n  DropzoneStylesNames,\n  DropzoneVariant,\n} from './Dropzone';\nimport { Dropzone as _Dropzone } from './Dropzone.js';\nimport type {\n  DropzoneFullScreenFactory,\n  DropzoneFullScreenProps,\n  DropzoneFullScreenStylesNames,\n} from './DropzoneFullScreen';\nimport { DropzoneFullScreen } from './DropzoneFullScreen.js';\nimport type { DropzoneAcceptProps, DropzoneIdleProps, DropzoneRejectProps } from './DropzoneStatus';\n\n_Dropzone.FullScreen = DropzoneFullScreen;\nexport const Dropzone = _Dropzone;\n\nexport { DropzoneFullScreen };\nexport { DropzoneAccept, DropzoneIdle, DropzoneReject } from './DropzoneStatus.js';\nexport * from './mime-types.js';\n\nexport type {\n  DropzoneProps,\n  DropzoneStylesNames,\n  DropzoneCssVariables,\n  DropzoneFactory,\n  DropzoneVariant,\n  DropzoneFullScreenProps,\n  DropzoneFullScreenStylesNames,\n  DropzoneFullScreenFactory,\n  DropzoneAcceptProps,\n  DropzoneRejectProps,\n  DropzoneIdleProps,\n  FileWithPath,\n  FileRejection,\n};\n\nexport namespace Dropzone {\n  export type Props = DropzoneProps;\n  export type StylesNames = DropzoneStylesNames;\n  export type CssVariables = DropzoneCssVariables;\n  export type Factory = DropzoneFactory;\n\n  export namespace FullScreen {\n    export type Props = DropzoneFullScreenProps;\n    export type StylesNames = DropzoneFullScreenStylesNames;\n    export type Factory = DropzoneFullScreenFactory;\n  }\n}\n"],"mappings":";;;;;;AAiBA,iBAAA,SAAU,aAAaA,2BAAAA;AACvB,MAAa,WAAWC,iBAAAA"}
+{"version":3,"file":"index.cjs","names":["DropzoneFullScreen","_Dropzone"],"sources":["../src/index.ts"],"sourcesContent":["import type { FileRejection, FileWithPath } from 'react-dropzone';\nimport type {\n  DropzoneCssVariables,\n  DropzoneFactory,\n  DropzoneProps,\n  DropzoneStylesNames,\n  DropzoneVariant,\n} from './Dropzone';\nimport { Dropzone as _Dropzone } from './Dropzone.js';\nimport type {\n  DropzoneFullScreenFactory,\n  DropzoneFullScreenProps,\n  DropzoneFullScreenStylesNames,\n} from './DropzoneFullScreen';\nimport { DropzoneFullScreen } from './DropzoneFullScreen.js';\nimport type { DropzoneAcceptProps, DropzoneIdleProps, DropzoneRejectProps } from './DropzoneStatus';\n\n_Dropzone.FullScreen = DropzoneFullScreen;\nexport const Dropzone = _Dropzone;\n\nexport { DropzoneFullScreen };\nexport { DropzoneAccept, DropzoneIdle, DropzoneReject } from './DropzoneStatus.js';\nexport * from './mime-types.js';\n\nexport type {\n  DropzoneProps,\n  DropzoneStylesNames,\n  DropzoneCssVariables,\n  DropzoneFactory,\n  DropzoneVariant,\n  DropzoneFullScreenProps,\n  DropzoneFullScreenStylesNames,\n  DropzoneFullScreenFactory,\n  DropzoneAcceptProps,\n  DropzoneRejectProps,\n  DropzoneIdleProps,\n  FileWithPath,\n  FileRejection,\n};\n"],"mappings":";;;;;;AAiBA,iBAAA,SAAU,aAAaA,2BAAAA;AACvB,MAAa,WAAWC,iBAAAA"}

package/esm/Dropzone.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Dropzone.mjs","names":["classes"],"sources":["../src/Dropzone.tsx"],"sourcesContent":["import {\n  Accept,\n  DropEvent,\n  FileError,\n  FileRejection,\n  FileWithPath,\n  useDropzone,\n} from 'react-dropzone';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getRadius,\n  LoaderProps,\n  LoadingOverlay,\n  MantineColor,\n  MantineRadius,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { assignRef } from '@mantine/hooks';\nimport { DropzoneProvider } from './Dropzone.context';\nimport type { DropzoneFullScreenType } from './DropzoneFullScreen';\nimport { DropzoneAccept, DropzoneIdle, DropzoneReject } from './DropzoneStatus';\nimport classes from './Dropzone.module.css';\n\nexport type DropzoneStylesNames = 'root' | 'inner';\nexport type DropzoneVariant = 'filled' | 'light';\nexport type DropzoneCssVariables = {\n  root:\n    | '--dropzone-radius'\n    | '--dropzone-accept-color'\n    | '--dropzone-accept-bg'\n    | '--dropzone-reject-color'\n    | '--dropzone-reject-bg';\n};\n\nexport interface DropzoneProps\n  extends BoxProps, StylesApiProps<DropzoneFactory>, ElementProps<'div', 'onDrop'> {\n  /** Key of `theme.colors` or any valid CSS color to set colors of `Dropzone.Accept` @default theme.primaryColor */\n  acceptColor?: MantineColor;\n\n  /** Key of `theme.colors` or any valid CSS color to set colors of `Dropzone.Reject` @default 'red' */\n  rejectColor?: MantineColor;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Determines whether files capturing should be disabled @default false */\n  disabled?: boolean;\n\n  /** Called when any files are dropped to the dropzone */\n  onDropAny?: (files: FileWithPath[], fileRejections: FileRejection[]) => void;\n\n  /** Called when valid files are dropped to the dropzone */\n  onDrop: (files: FileWithPath[]) => void;\n\n  /** Called when dropped files do not meet file restrictions */\n  onReject?: (fileRejections: FileRejection[]) => void;\n\n  /** Determines whether a loading overlay should be displayed over the dropzone @default false */\n  loading?: boolean;\n\n  /** Mime types of the files that dropzone can accepts. By default, dropzone accepts all file types. */\n  accept?: Accept | string[];\n\n  /** A ref function which when called opens the file system file picker */\n  openRef?: React.Ref<() => void | undefined>;\n\n  /** Determines whether multiple files can be dropped to the dropzone or selected from file system picker @default true */\n  multiple?: boolean;\n\n  /** Maximum file size in bytes */\n  maxSize?: number;\n\n  /** Name of the form control. Submitted with the form as part of a name/value pair. */\n  name?: string;\n\n  /** Maximum number of files that can be picked at once */\n  maxFiles?: number;\n\n  /** Set to autofocus the root element */\n  autoFocus?: boolean;\n\n  /** If `false`, disables click to open the native file selection dialog */\n  activateOnClick?: boolean;\n\n  /** If `false`, disables drag 'n' drop */\n  activateOnDrag?: boolean;\n\n  /** If `false`, disables Space/Enter to open the native file selection dialog. Note that it also stops tracking the focus state. */\n  activateOnKeyboard?: boolean;\n\n  /** If `false`, stops drag event propagation to parents */\n  dragEventsBubbling?: boolean;\n\n  /** Called when the `dragenter` event occurs */\n  onDragEnter?: (event: React.DragEvent<HTMLElement>) => void;\n\n  /** Called when the `dragleave` event occurs */\n  onDragLeave?: (event: React.DragEvent<HTMLElement>) => void;\n\n  /** Called when the `dragover` event occurs */\n  onDragOver?: (event: React.DragEvent<HTMLElement>) => void;\n\n  /** Called when user closes the file selection dialog with no selection */\n  onFileDialogCancel?: () => void;\n\n  /** Called when user opens the file selection dialog */\n  onFileDialogOpen?: () => void;\n\n  /** If `false`, allow dropped items to take over the current browser window */\n  preventDropOnDocument?: boolean;\n\n  /** Set to true to use the File System Access API to open the file picker instead of using an `input type=\"file\"` click event @default true */\n  useFsAccessApi?: boolean;\n\n  /** Use this to provide a custom file aggregator */\n  getFilesFromEvent?: (event: DropEvent) => Promise<Array<File | DataTransferItem>>;\n\n  /** Custom validation function. It must return null if there's no errors. */\n  validator?: <T extends File>(file: T) => FileError | FileError[] | null;\n\n  /** Determines whether pointer events should be enabled on the inner element @default false */\n  enablePointerEvents?: boolean;\n\n  /** Props passed down to the Loader component */\n  loaderProps?: LoaderProps;\n\n  /** Props passed down to the internal Input component */\n  inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n}\n\nexport type DropzoneFactory = Factory<{\n  props: DropzoneProps;\n  ref: HTMLDivElement;\n  stylesNames: DropzoneStylesNames;\n  vars: DropzoneCssVariables;\n  staticComponents: {\n    Accept: typeof DropzoneAccept;\n    Idle: typeof DropzoneIdle;\n    Reject: typeof DropzoneReject;\n    FullScreen: DropzoneFullScreenType;\n  };\n}>;\n\nconst defaultProps = {\n  multiple: true,\n  maxSize: Infinity,\n  activateOnClick: true,\n  activateOnDrag: true,\n  dragEventsBubbling: true,\n  activateOnKeyboard: true,\n  useFsAccessApi: true,\n  variant: 'light',\n  rejectColor: 'red',\n} satisfies Partial<DropzoneProps>;\n\nconst varsResolver = createVarsResolver<DropzoneFactory>(\n  (theme, { radius, variant, acceptColor, rejectColor }) => {\n    const acceptColors = theme.variantColorResolver({\n      color: acceptColor || theme.primaryColor,\n      theme,\n      variant: variant!,\n    });\n\n    const rejectColors = theme.variantColorResolver({\n      color: rejectColor || 'red',\n      theme,\n      variant: variant!,\n    });\n\n    return {\n      root: {\n        '--dropzone-radius': getRadius(radius),\n        '--dropzone-accept-color': acceptColors.color,\n        '--dropzone-accept-bg': acceptColors.background,\n        '--dropzone-reject-color': rejectColors.color,\n        '--dropzone-reject-bg': rejectColors.background,\n      },\n    };\n  }\n);\n\nexport const Dropzone = factory<DropzoneFactory>((_props) => {\n  const props = useProps('Dropzone', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    radius,\n    disabled,\n    loading,\n    multiple,\n    maxSize,\n    accept,\n    children,\n    onDropAny,\n    onDrop,\n    onReject,\n    openRef,\n    name,\n    maxFiles,\n    autoFocus,\n    activateOnClick,\n    activateOnDrag,\n    dragEventsBubbling,\n    activateOnKeyboard,\n    onDragEnter,\n    onDragLeave,\n    onDragOver,\n    onFileDialogCancel,\n    onFileDialogOpen,\n    preventDropOnDocument,\n    useFsAccessApi,\n    getFilesFromEvent,\n    validator,\n    rejectColor,\n    acceptColor,\n    enablePointerEvents,\n    loaderProps,\n    inputProps,\n    mod,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<DropzoneFactory>({\n    name: 'Dropzone',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { getRootProps, getInputProps, isDragAccept, isDragReject, isDragActive, open } =\n    useDropzone({\n      onDrop: onDropAny,\n      onDropAccepted: onDrop,\n      onDropRejected: onReject,\n      disabled: disabled || loading,\n      accept: Array.isArray(accept) ? accept.reduce((r, key) => ({ ...r, [key]: [] }), {}) : accept,\n      multiple,\n      maxSize,\n      maxFiles,\n      autoFocus,\n      noClick: !activateOnClick,\n      noDrag: !activateOnDrag,\n      noDragEventsBubbling: !dragEventsBubbling,\n      noKeyboard: !activateOnKeyboard,\n      onDragEnter,\n      onDragLeave,\n      onDragOver,\n      onFileDialogCancel,\n      onFileDialogOpen,\n      preventDropOnDocument,\n      useFsAccessApi,\n      validator,\n      ...(getFilesFromEvent ? { getFilesFromEvent } : null),\n    });\n\n  assignRef(openRef, open);\n\n  const isAccepted = isDragActive && isDragAccept;\n  const isRejected = isDragActive && isDragReject;\n  const isIdle = !isAccepted && !isRejected;\n\n  return (\n    <DropzoneProvider value={{ accept: isAccepted, reject: isRejected, idle: isIdle }}>\n      <Box\n        {...getRootProps()}\n        {...getStyles('root', { focusable: true })}\n        {...others}\n        mod={[\n          {\n            accept: isAccepted,\n            reject: isRejected,\n            idle: isIdle,\n            disabled,\n            loading,\n            'activate-on-click': activateOnClick,\n          },\n          mod,\n        ]}\n      >\n        <LoadingOverlay\n          visible={loading}\n          overlayProps={{ radius }}\n          unstyled={unstyled}\n          loaderProps={loaderProps}\n        />\n        <input {...getInputProps(inputProps)} name={name} />\n        <div {...getStyles('inner')} data-enable-pointer-events={enablePointerEvents || undefined}>\n          {children}\n        </div>\n      </Box>\n    </DropzoneProvider>\n  );\n});\n\nDropzone.classes = classes;\nDropzone.varsResolver = varsResolver;\nDropzone.displayName = '@mantine/dropzone/Dropzone';\nDropzone.Accept = DropzoneAccept;\nDropzone.Idle = DropzoneIdle;\nDropzone.Reject = DropzoneReject;\n"],"mappings":";;;;;;;;;AAsJA,MAAM,eAAe;CACnB,UAAU;CACV,SAAS;CACT,iBAAiB;CACjB,gBAAgB;CAChB,oBAAoB;CACpB,oBAAoB;CACpB,gBAAgB;CAChB,SAAS;CACT,aAAa;CACd;AAED,MAAM,eAAe,oBAClB,OAAO,EAAE,QAAQ,SAAS,aAAa,kBAAkB;CACxD,MAAM,eAAe,MAAM,qBAAqB;EAC9C,OAAO,eAAe,MAAM;EAC5B;EACS;EACV,CAAC;CAEF,MAAM,eAAe,MAAM,qBAAqB;EAC9C,OAAO,eAAe;EACtB;EACS;EACV,CAAC;AAEF,QAAO,EACL,MAAM;EACJ,qBAAqB,UAAU,OAAO;EACtC,2BAA2B,aAAa;EACxC,wBAAwB,aAAa;EACrC,2BAA2B,aAAa;EACxC,wBAAwB,aAAa;EACtC,EACF;EAEJ;AAED,MAAa,WAAW,SAA0B,WAAW;CAC3D,MAAM,QAAQ,SAAS,YAAY,cAAc,OAAO;CACxD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,QACA,UACA,SACA,UACA,SACA,QACA,UACA,WACA,QACA,UACA,SACA,MACA,UACA,WACA,iBACA,gBACA,oBACA,oBACA,aACA,aACA,YACA,oBACA,kBACA,uBACA,gBACA,mBACA,WACA,aACA,aACA,qBACA,aACA,YACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA2B;EAC3C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,EAAE,cAAc,eAAe,cAAc,cAAc,cAAc,SAC7E,YAAY;EACV,QAAQ;EACR,gBAAgB;EAChB,gBAAgB;EAChB,UAAU,YAAY;EACtB,QAAQ,MAAM,QAAQ,OAAO,GAAG,OAAO,QAAQ,GAAG,SAAS;GAAE,GAAG;IAAI,MAAM,EAAE;GAAE,GAAG,EAAE,CAAC,GAAG;EACvF;EACA;EACA;EACA;EACA,SAAS,CAAC;EACV,QAAQ,CAAC;EACT,sBAAsB,CAAC;EACvB,YAAY,CAAC;EACb;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,GAAI,oBAAoB,EAAE,mBAAmB,GAAG;EACjD,CAAC;AAEJ,WAAU,SAAS,KAAK;CAExB,MAAM,aAAa,gBAAgB;CACnC,MAAM,aAAa,gBAAgB;CACnC,MAAM,SAAS,CAAC,cAAc,CAAC;AAE/B,QACE,oBAAC,kBAAD;EAAkB,OAAO;GAAE,QAAQ;GAAY,QAAQ;GAAY,MAAM;GAAQ;YAC/E,qBAAC,KAAD;GACE,GAAI,cAAc;GAClB,GAAI,UAAU,QAAQ,EAAE,WAAW,MAAM,CAAC;GAC1C,GAAI;GACJ,KAAK,CACH;IACE,QAAQ;IACR,QAAQ;IACR,MAAM;IACN;IACA;IACA,qBAAqB;IACtB,EACD,IACD;aAdH;IAgBE,oBAAC,gBAAD;KACE,SAAS;KACT,cAAc,EAAE,QAAQ;KACd;KACG;KACb,CAAA;IACF,oBAAC,SAAD;KAAO,GAAI,cAAc,WAAW;KAAQ;KAAQ,CAAA;IACpD,oBAAC,OAAD;KAAK,GAAI,UAAU,QAAQ;KAAE,8BAA4B,uBAAuB,KAAA;KAC7E;KACG,CAAA;IACF;;EACW,CAAA;EAErB;AAEF,SAAS,UAAUA;AACnB,SAAS,eAAe;AACxB,SAAS,cAAc;AACvB,SAAS,SAAS;AAClB,SAAS,OAAO;AAChB,SAAS,SAAS"}
+{"version":3,"file":"Dropzone.mjs","names":["classes"],"sources":["../src/Dropzone.tsx"],"sourcesContent":["import {\n  Accept,\n  DropEvent,\n  FileError,\n  FileRejection,\n  FileWithPath,\n  useDropzone,\n} from 'react-dropzone';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getRadius,\n  LoaderProps,\n  LoadingOverlay,\n  MantineColor,\n  MantineRadius,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { assignRef } from '@mantine/hooks';\nimport { DropzoneProvider } from './Dropzone.context';\nimport type {\n  DropzoneFullScreenFactory,\n  DropzoneFullScreenProps,\n  DropzoneFullScreenStylesNames,\n  DropzoneFullScreenType,\n} from './DropzoneFullScreen';\nimport { DropzoneAccept, DropzoneIdle, DropzoneReject } from './DropzoneStatus';\nimport classes from './Dropzone.module.css';\n\nexport type DropzoneStylesNames = 'root' | 'inner';\nexport type DropzoneVariant = 'filled' | 'light';\nexport type DropzoneCssVariables = {\n  root:\n    | '--dropzone-radius'\n    | '--dropzone-accept-color'\n    | '--dropzone-accept-bg'\n    | '--dropzone-reject-color'\n    | '--dropzone-reject-bg';\n};\n\nexport interface DropzoneProps\n  extends BoxProps, StylesApiProps<DropzoneFactory>, ElementProps<'div', 'onDrop'> {\n  /** Key of `theme.colors` or any valid CSS color to set colors of `Dropzone.Accept` @default theme.primaryColor */\n  acceptColor?: MantineColor;\n\n  /** Key of `theme.colors` or any valid CSS color to set colors of `Dropzone.Reject` @default 'red' */\n  rejectColor?: MantineColor;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Determines whether files capturing should be disabled @default false */\n  disabled?: boolean;\n\n  /** Called when any files are dropped to the dropzone */\n  onDropAny?: (files: FileWithPath[], fileRejections: FileRejection[]) => void;\n\n  /** Called when valid files are dropped to the dropzone */\n  onDrop: (files: FileWithPath[]) => void;\n\n  /** Called when dropped files do not meet file restrictions */\n  onReject?: (fileRejections: FileRejection[]) => void;\n\n  /** Determines whether a loading overlay should be displayed over the dropzone @default false */\n  loading?: boolean;\n\n  /** Mime types of the files that dropzone can accepts. By default, dropzone accepts all file types. */\n  accept?: Accept | string[];\n\n  /** A ref function which when called opens the file system file picker */\n  openRef?: React.Ref<() => void | undefined>;\n\n  /** Determines whether multiple files can be dropped to the dropzone or selected from file system picker @default true */\n  multiple?: boolean;\n\n  /** Maximum file size in bytes */\n  maxSize?: number;\n\n  /** Name of the form control. Submitted with the form as part of a name/value pair. */\n  name?: string;\n\n  /** Maximum number of files that can be picked at once */\n  maxFiles?: number;\n\n  /** Set to autofocus the root element */\n  autoFocus?: boolean;\n\n  /** If `false`, disables click to open the native file selection dialog */\n  activateOnClick?: boolean;\n\n  /** If `false`, disables drag 'n' drop */\n  activateOnDrag?: boolean;\n\n  /** If `false`, disables Space/Enter to open the native file selection dialog. Note that it also stops tracking the focus state. */\n  activateOnKeyboard?: boolean;\n\n  /** If `false`, stops drag event propagation to parents */\n  dragEventsBubbling?: boolean;\n\n  /** Called when the `dragenter` event occurs */\n  onDragEnter?: (event: React.DragEvent<HTMLElement>) => void;\n\n  /** Called when the `dragleave` event occurs */\n  onDragLeave?: (event: React.DragEvent<HTMLElement>) => void;\n\n  /** Called when the `dragover` event occurs */\n  onDragOver?: (event: React.DragEvent<HTMLElement>) => void;\n\n  /** Called when user closes the file selection dialog with no selection */\n  onFileDialogCancel?: () => void;\n\n  /** Called when user opens the file selection dialog */\n  onFileDialogOpen?: () => void;\n\n  /** If `false`, allow dropped items to take over the current browser window */\n  preventDropOnDocument?: boolean;\n\n  /** Set to true to use the File System Access API to open the file picker instead of using an `input type=\"file\"` click event @default true */\n  useFsAccessApi?: boolean;\n\n  /** Use this to provide a custom file aggregator */\n  getFilesFromEvent?: (event: DropEvent) => Promise<Array<File | DataTransferItem>>;\n\n  /** Custom validation function. It must return null if there's no errors. */\n  validator?: <T extends File>(file: T) => FileError | FileError[] | null;\n\n  /** Determines whether pointer events should be enabled on the inner element @default false */\n  enablePointerEvents?: boolean;\n\n  /** Props passed down to the Loader component */\n  loaderProps?: LoaderProps;\n\n  /** Props passed down to the internal Input component */\n  inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n}\n\nexport type DropzoneFactory = Factory<{\n  props: DropzoneProps;\n  ref: HTMLDivElement;\n  stylesNames: DropzoneStylesNames;\n  vars: DropzoneCssVariables;\n  staticComponents: {\n    Accept: typeof DropzoneAccept;\n    Idle: typeof DropzoneIdle;\n    Reject: typeof DropzoneReject;\n    FullScreen: DropzoneFullScreenType;\n  };\n}>;\n\nconst defaultProps = {\n  multiple: true,\n  maxSize: Infinity,\n  activateOnClick: true,\n  activateOnDrag: true,\n  dragEventsBubbling: true,\n  activateOnKeyboard: true,\n  useFsAccessApi: true,\n  variant: 'light',\n  rejectColor: 'red',\n} satisfies Partial<DropzoneProps>;\n\nconst varsResolver = createVarsResolver<DropzoneFactory>(\n  (theme, { radius, variant, acceptColor, rejectColor }) => {\n    const acceptColors = theme.variantColorResolver({\n      color: acceptColor || theme.primaryColor,\n      theme,\n      variant: variant!,\n    });\n\n    const rejectColors = theme.variantColorResolver({\n      color: rejectColor || 'red',\n      theme,\n      variant: variant!,\n    });\n\n    return {\n      root: {\n        '--dropzone-radius': getRadius(radius),\n        '--dropzone-accept-color': acceptColors.color,\n        '--dropzone-accept-bg': acceptColors.background,\n        '--dropzone-reject-color': rejectColors.color,\n        '--dropzone-reject-bg': rejectColors.background,\n      },\n    };\n  }\n);\n\nexport const Dropzone = factory<DropzoneFactory>((_props) => {\n  const props = useProps('Dropzone', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    radius,\n    disabled,\n    loading,\n    multiple,\n    maxSize,\n    accept,\n    children,\n    onDropAny,\n    onDrop,\n    onReject,\n    openRef,\n    name,\n    maxFiles,\n    autoFocus,\n    activateOnClick,\n    activateOnDrag,\n    dragEventsBubbling,\n    activateOnKeyboard,\n    onDragEnter,\n    onDragLeave,\n    onDragOver,\n    onFileDialogCancel,\n    onFileDialogOpen,\n    preventDropOnDocument,\n    useFsAccessApi,\n    getFilesFromEvent,\n    validator,\n    rejectColor,\n    acceptColor,\n    enablePointerEvents,\n    loaderProps,\n    inputProps,\n    mod,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<DropzoneFactory>({\n    name: 'Dropzone',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { getRootProps, getInputProps, isDragAccept, isDragReject, isDragActive, open } =\n    useDropzone({\n      onDrop: onDropAny,\n      onDropAccepted: onDrop,\n      onDropRejected: onReject,\n      disabled: disabled || loading,\n      accept: Array.isArray(accept) ? accept.reduce((r, key) => ({ ...r, [key]: [] }), {}) : accept,\n      multiple,\n      maxSize,\n      maxFiles,\n      autoFocus,\n      noClick: !activateOnClick,\n      noDrag: !activateOnDrag,\n      noDragEventsBubbling: !dragEventsBubbling,\n      noKeyboard: !activateOnKeyboard,\n      onDragEnter,\n      onDragLeave,\n      onDragOver,\n      onFileDialogCancel,\n      onFileDialogOpen,\n      preventDropOnDocument,\n      useFsAccessApi,\n      validator,\n      ...(getFilesFromEvent ? { getFilesFromEvent } : null),\n    });\n\n  assignRef(openRef, open);\n\n  const isAccepted = isDragActive && isDragAccept;\n  const isRejected = isDragActive && isDragReject;\n  const isIdle = !isAccepted && !isRejected;\n\n  return (\n    <DropzoneProvider value={{ accept: isAccepted, reject: isRejected, idle: isIdle }}>\n      <Box\n        {...getRootProps()}\n        {...getStyles('root', { focusable: true })}\n        {...others}\n        mod={[\n          {\n            accept: isAccepted,\n            reject: isRejected,\n            idle: isIdle,\n            disabled,\n            loading,\n            'activate-on-click': activateOnClick,\n          },\n          mod,\n        ]}\n      >\n        <LoadingOverlay\n          visible={loading}\n          overlayProps={{ radius }}\n          unstyled={unstyled}\n          loaderProps={loaderProps}\n        />\n        <input {...getInputProps(inputProps)} name={name} />\n        <div {...getStyles('inner')} data-enable-pointer-events={enablePointerEvents || undefined}>\n          {children}\n        </div>\n      </Box>\n    </DropzoneProvider>\n  );\n});\n\nDropzone.classes = classes;\nDropzone.varsResolver = varsResolver;\nDropzone.displayName = '@mantine/dropzone/Dropzone';\nDropzone.Accept = DropzoneAccept;\nDropzone.Idle = DropzoneIdle;\nDropzone.Reject = DropzoneReject;\n\nexport namespace Dropzone {\n  export type Props = DropzoneProps;\n  export type StylesNames = DropzoneStylesNames;\n  export type CssVariables = DropzoneCssVariables;\n  export type Factory = DropzoneFactory;\n\n  export namespace FullScreen {\n    export type Props = DropzoneFullScreenProps;\n    export type StylesNames = DropzoneFullScreenStylesNames;\n    export type Factory = DropzoneFullScreenFactory;\n  }\n}\n"],"mappings":";;;;;;;;;AA2JA,MAAM,eAAe;CACnB,UAAU;CACV,SAAS;CACT,iBAAiB;CACjB,gBAAgB;CAChB,oBAAoB;CACpB,oBAAoB;CACpB,gBAAgB;CAChB,SAAS;CACT,aAAa;CACd;AAED,MAAM,eAAe,oBAClB,OAAO,EAAE,QAAQ,SAAS,aAAa,kBAAkB;CACxD,MAAM,eAAe,MAAM,qBAAqB;EAC9C,OAAO,eAAe,MAAM;EAC5B;EACS;EACV,CAAC;CAEF,MAAM,eAAe,MAAM,qBAAqB;EAC9C,OAAO,eAAe;EACtB;EACS;EACV,CAAC;AAEF,QAAO,EACL,MAAM;EACJ,qBAAqB,UAAU,OAAO;EACtC,2BAA2B,aAAa;EACxC,wBAAwB,aAAa;EACrC,2BAA2B,aAAa;EACxC,wBAAwB,aAAa;EACtC,EACF;EAEJ;AAED,MAAa,WAAW,SAA0B,WAAW;CAC3D,MAAM,QAAQ,SAAS,YAAY,cAAc,OAAO;CACxD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,QACA,UACA,SACA,UACA,SACA,QACA,UACA,WACA,QACA,UACA,SACA,MACA,UACA,WACA,iBACA,gBACA,oBACA,oBACA,aACA,aACA,YACA,oBACA,kBACA,uBACA,gBACA,mBACA,WACA,aACA,aACA,qBACA,aACA,YACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA2B;EAC3C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,EAAE,cAAc,eAAe,cAAc,cAAc,cAAc,SAC7E,YAAY;EACV,QAAQ;EACR,gBAAgB;EAChB,gBAAgB;EAChB,UAAU,YAAY;EACtB,QAAQ,MAAM,QAAQ,OAAO,GAAG,OAAO,QAAQ,GAAG,SAAS;GAAE,GAAG;IAAI,MAAM,EAAE;GAAE,GAAG,EAAE,CAAC,GAAG;EACvF;EACA;EACA;EACA;EACA,SAAS,CAAC;EACV,QAAQ,CAAC;EACT,sBAAsB,CAAC;EACvB,YAAY,CAAC;EACb;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,GAAI,oBAAoB,EAAE,mBAAmB,GAAG;EACjD,CAAC;AAEJ,WAAU,SAAS,KAAK;CAExB,MAAM,aAAa,gBAAgB;CACnC,MAAM,aAAa,gBAAgB;CACnC,MAAM,SAAS,CAAC,cAAc,CAAC;AAE/B,QACE,oBAAC,kBAAD;EAAkB,OAAO;GAAE,QAAQ;GAAY,QAAQ;GAAY,MAAM;GAAQ;YAC/E,qBAAC,KAAD;GACE,GAAI,cAAc;GAClB,GAAI,UAAU,QAAQ,EAAE,WAAW,MAAM,CAAC;GAC1C,GAAI;GACJ,KAAK,CACH;IACE,QAAQ;IACR,QAAQ;IACR,MAAM;IACN;IACA;IACA,qBAAqB;IACtB,EACD,IACD;aAdH;IAgBE,oBAAC,gBAAD;KACE,SAAS;KACT,cAAc,EAAE,QAAQ;KACd;KACG;KACb,CAAA;IACF,oBAAC,SAAD;KAAO,GAAI,cAAc,WAAW;KAAQ;KAAQ,CAAA;IACpD,oBAAC,OAAD;KAAK,GAAI,UAAU,QAAQ;KAAE,8BAA4B,uBAAuB,KAAA;KAC7E;KACG,CAAA;IACF;;EACW,CAAA;EAErB;AAEF,SAAS,UAAUA;AACnB,SAAS,eAAe;AACxB,SAAS,cAAc;AACvB,SAAS,SAAS;AAClB,SAAS,OAAO;AAChB,SAAS,SAAS"}

package/esm/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["_Dropzone"],"sources":["../src/index.ts"],"sourcesContent":["import type { FileRejection, FileWithPath } from 'react-dropzone';\nimport type {\n  DropzoneCssVariables,\n  DropzoneFactory,\n  DropzoneProps,\n  DropzoneStylesNames,\n  DropzoneVariant,\n} from './Dropzone';\nimport { Dropzone as _Dropzone } from './Dropzone.js';\nimport type {\n  DropzoneFullScreenFactory,\n  DropzoneFullScreenProps,\n  DropzoneFullScreenStylesNames,\n} from './DropzoneFullScreen';\nimport { DropzoneFullScreen } from './DropzoneFullScreen.js';\nimport type { DropzoneAcceptProps, DropzoneIdleProps, DropzoneRejectProps } from './DropzoneStatus';\n\n_Dropzone.FullScreen = DropzoneFullScreen;\nexport const Dropzone = _Dropzone;\n\nexport { DropzoneFullScreen };\nexport { DropzoneAccept, DropzoneIdle, DropzoneReject } from './DropzoneStatus.js';\nexport * from './mime-types.js';\n\nexport type {\n  DropzoneProps,\n  DropzoneStylesNames,\n  DropzoneCssVariables,\n  DropzoneFactory,\n  DropzoneVariant,\n  DropzoneFullScreenProps,\n  DropzoneFullScreenStylesNames,\n  DropzoneFullScreenFactory,\n  DropzoneAcceptProps,\n  DropzoneRejectProps,\n  DropzoneIdleProps,\n  FileWithPath,\n  FileRejection,\n};\n\nexport namespace Dropzone {\n  export type Props = DropzoneProps;\n  export type StylesNames = DropzoneStylesNames;\n  export type CssVariables = DropzoneCssVariables;\n  export type Factory = DropzoneFactory;\n\n  export namespace FullScreen {\n    export type Props = DropzoneFullScreenProps;\n    export type StylesNames = DropzoneFullScreenStylesNames;\n    export type Factory = DropzoneFullScreenFactory;\n  }\n}\n"],"mappings":";;;;;AAiBA,WAAU,aAAa;AACvB,MAAa,WAAWA"}
+{"version":3,"file":"index.mjs","names":["_Dropzone"],"sources":["../src/index.ts"],"sourcesContent":["import type { FileRejection, FileWithPath } from 'react-dropzone';\nimport type {\n  DropzoneCssVariables,\n  DropzoneFactory,\n  DropzoneProps,\n  DropzoneStylesNames,\n  DropzoneVariant,\n} from './Dropzone';\nimport { Dropzone as _Dropzone } from './Dropzone.js';\nimport type {\n  DropzoneFullScreenFactory,\n  DropzoneFullScreenProps,\n  DropzoneFullScreenStylesNames,\n} from './DropzoneFullScreen';\nimport { DropzoneFullScreen } from './DropzoneFullScreen.js';\nimport type { DropzoneAcceptProps, DropzoneIdleProps, DropzoneRejectProps } from './DropzoneStatus';\n\n_Dropzone.FullScreen = DropzoneFullScreen;\nexport const Dropzone = _Dropzone;\n\nexport { DropzoneFullScreen };\nexport { DropzoneAccept, DropzoneIdle, DropzoneReject } from './DropzoneStatus.js';\nexport * from './mime-types.js';\n\nexport type {\n  DropzoneProps,\n  DropzoneStylesNames,\n  DropzoneCssVariables,\n  DropzoneFactory,\n  DropzoneVariant,\n  DropzoneFullScreenProps,\n  DropzoneFullScreenStylesNames,\n  DropzoneFullScreenFactory,\n  DropzoneAcceptProps,\n  DropzoneRejectProps,\n  DropzoneIdleProps,\n  FileWithPath,\n  FileRejection,\n};\n"],"mappings":";;;;;AAiBA,WAAU,aAAa;AACvB,MAAa,WAAWA"}

package/lib/Dropzone.d.ts

@@ -1,6 +1,6 @@
 import { Accept, DropEvent, FileError, FileRejection, FileWithPath } from 'react-dropzone';
 import { BoxProps, ElementProps, Factory, LoaderProps, MantineColor, MantineRadius, StylesApiProps } from '@mantine/core';
-import type { DropzoneFullScreenType } from './DropzoneFullScreen';
+import type { DropzoneFullScreenFactory, DropzoneFullScreenProps, DropzoneFullScreenStylesNames, DropzoneFullScreenType } from './DropzoneFullScreen';
 import { DropzoneAccept, DropzoneIdle, DropzoneReject } from './DropzoneStatus';
 export type DropzoneStylesNames = 'root' | 'inner';
 export type DropzoneVariant = 'filled' | 'light';
@@ -95,3 +95,14 @@ export declare const Dropzone: import("@mantine/core").MantineComponent<{
         FullScreen: DropzoneFullScreenType;
     };
 }>;
+export declare namespace Dropzone {
+    type Props = DropzoneProps;
+    type StylesNames = DropzoneStylesNames;
+    type CssVariables = DropzoneCssVariables;
+    type Factory = DropzoneFactory;
+    namespace FullScreen {
+        type Props = DropzoneFullScreenProps;
+        type StylesNames = DropzoneFullScreenStylesNames;
+        type Factory = DropzoneFullScreenFactory;
+    }
+}

package/lib/index.d.mts

@@ -19,14 +19,3 @@ export { DropzoneFullScreen };
 export { DropzoneAccept, DropzoneIdle, DropzoneReject } from './DropzoneStatus.js';
 export * from './mime-types.js';
 export type { DropzoneProps, DropzoneStylesNames, DropzoneCssVariables, DropzoneFactory, DropzoneVariant, DropzoneFullScreenProps, DropzoneFullScreenStylesNames, DropzoneFullScreenFactory, DropzoneAcceptProps, DropzoneRejectProps, DropzoneIdleProps, FileWithPath, FileRejection, };
-export declare namespace Dropzone {
-    type Props = DropzoneProps;
-    type StylesNames = DropzoneStylesNames;
-    type CssVariables = DropzoneCssVariables;
-    type Factory = DropzoneFactory;
-    namespace FullScreen {
-        type Props = DropzoneFullScreenProps;
-        type StylesNames = DropzoneFullScreenStylesNames;
-        type Factory = DropzoneFullScreenFactory;
-    }
-}

package/lib/index.d.ts

@@ -19,14 +19,3 @@ export { DropzoneFullScreen };
 export { DropzoneAccept, DropzoneIdle, DropzoneReject } from './DropzoneStatus.js';
 export * from './mime-types.js';
 export type { DropzoneProps, DropzoneStylesNames, DropzoneCssVariables, DropzoneFactory, DropzoneVariant, DropzoneFullScreenProps, DropzoneFullScreenStylesNames, DropzoneFullScreenFactory, DropzoneAcceptProps, DropzoneRejectProps, DropzoneIdleProps, FileWithPath, FileRejection, };
-export declare namespace Dropzone {
-    type Props = DropzoneProps;
-    type StylesNames = DropzoneStylesNames;
-    type CssVariables = DropzoneCssVariables;
-    type Factory = DropzoneFactory;
-    namespace FullScreen {
-        type Props = DropzoneFullScreenProps;
-        type StylesNames = DropzoneFullScreenStylesNames;
-        type Factory = DropzoneFullScreenFactory;
-    }
-}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mantine/dropzone",
-  "version": "9.0.0-alpha.7",
+  "version": "9.0.1",
   "description": "Dropzone component built with Mantine theme and components",
   "homepage": "https://mantine.dev/x/dropzone/",
   "license": "MIT",
@@ -44,8 +44,8 @@
     "directory": "packages/@mantine/dropzone"
   },
   "peerDependencies": {
-    "@mantine/core": "9.0.0-alpha.7",
-    "@mantine/hooks": "9.0.0-alpha.7",
+    "@mantine/core": "9.0.1",
+    "@mantine/hooks": "9.0.1",
     "react": "^19.2.0",
     "react-dom": "^19.2.0"
   },