@yamada-ui/dropzone 0.5.16 → 1.0.1

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.
@@ -181,4 +181,4 @@ export {
181
181
  DropzoneReject,
182
182
  DropzoneIdle
183
183
  };
184
- //# sourceMappingURL=chunk-252BWCWL.mjs.map
184
+ //# sourceMappingURL=chunk-OKY7MF3L.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/dropzone.tsx"],"sourcesContent":["import type {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useMultiComponentStyle,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport type { FadeProps } from \"@yamada-ui/transitions\"\nimport { Fade } from \"@yamada-ui/transitions\"\nimport {\n assignRef,\n createContext,\n cx,\n dataAttr,\n isArray,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type { FC, ForwardedRef, PropsWithChildren } from \"react\"\nimport { Fragment } from \"react\"\nimport type {\n Accept,\n DropzoneOptions as ReactDropzoneOptions,\n} from \"react-dropzone-esm\"\nimport { useDropzone } from \"react-dropzone-esm\"\n\ntype DropzoneContext = {\n isLoading?: boolean\n isDragAccept: boolean\n isDragReject: boolean\n isDragIdle: boolean\n styles: Record<string, CSSUIObject>\n}\n\nconst [DropzoneProvider, useDropzoneContext] = createContext<DropzoneContext>({\n name: \"DropzoneContext\",\n errorMessage: `useDropzoneContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Dropzone />\"`,\n})\n\ntype DropzoneOptions = {\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n */\n isLoading?: boolean\n /**\n * Props for dropzone overlay element.\n */\n overlayProps?: FadeProps\n /**\n * Props for dropzone loading icon element.\n */\n loadingProps?: LoadingProps\n /**\n * File types to accept.\n */\n accept?: Accept | string[]\n /**\n * Ref to a open function.\n */\n openRef?: ForwardedRef<() => void | undefined>\n}\n\nexport type DropzoneProps = Omit<HTMLUIProps<\"div\">, \"onDrop\"> &\n ThemeProps<\"Dropzone\"> &\n DropzoneOptions &\n FormControlOptions &\n Omit<ReactDropzoneOptions, \"accept\">\n\n/**\n * Dropzone is a component used for uploading files via drag and drop.\n *\n * @see Docs https://yamada-ui.com/components/forms/dropzone\n */\nexport const Dropzone = forwardRef<DropzoneProps, \"input\">((props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"Dropzone\", props)\n const {\n id,\n name,\n className,\n isLoading,\n overlayProps,\n loadingProps,\n openRef,\n accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n children,\n ...rest\n } = useFormControlProps(omitThemeProps(mergedProps))\n\n const disabled = isLoading || rest.disabled || rest.readOnly\n\n const [formControlProps, containerProps] = splitObject(\n rest,\n formControlProperties,\n )\n\n const { getRootProps, getInputProps, isDragAccept, isDragReject, open } =\n useDropzone({\n disabled,\n accept: isArray(accept)\n ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {})\n : accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n })\n\n assignRef(openRef, open)\n\n const isDragIdle = !isDragAccept && !isDragReject\n\n const css: CSSUIObject = {\n position: \"relative\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.container,\n }\n\n return (\n <DropzoneProvider\n value={{ isLoading, isDragAccept, isDragReject, isDragIdle, styles }}\n >\n <ui.div\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...containerProps}\n {...getRootProps()}\n data-accept={dataAttr(isDragAccept)}\n data-reject={dataAttr(isDragReject)}\n data-idle={dataAttr(isDragIdle)}\n data-loading={dataAttr(isLoading)}\n >\n <LoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n <ui.input\n ref={ref}\n id={id}\n name={name}\n {...formControlProps}\n {...getInputProps()}\n />\n {children}\n </ui.div>\n </DropzoneProvider>\n )\n})\n\ntype LoadingOverlayProps = FadeProps & { loadingProps?: LoadingProps }\n\nconst LoadingOverlay: FC<LoadingOverlayProps> = ({ loadingProps, ...rest }) => {\n const { isLoading, styles } = useDropzoneContext()\n\n const css: CSSUIObject = {\n position: \"absolute\",\n top: 0,\n left: 0,\n w: \"100%\",\n h: \"100%\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.overlay,\n }\n\n return (\n <Fade\n isOpen={isLoading}\n unmountOnExit\n className=\"ui-dropzone__overlay\"\n __css={css}\n {...rest}\n >\n <Loading\n className=\"ui-dropzone__overlay__loading\"\n size=\"4xl\"\n {...loadingProps}\n />\n </Fade>\n )\n}\n\nexport const DropzoneAccept: FC<PropsWithChildren> = ({ children }) => {\n const { isDragAccept } = useDropzoneContext()\n\n return isDragAccept ? <Fragment>{children}</Fragment> : null\n}\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { isDragReject } = useDropzoneContext()\n\n return isDragReject ? <Fragment>{children}</Fragment> : null\n}\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { isDragIdle } = useDropzoneContext()\n\n return isDragIdle ? <Fragment>{children}</Fragment> : null\n}\n"],"mappings":"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","names":[]}
@@ -39,6 +39,11 @@ type DropzoneOptions = {
39
39
  openRef?: ForwardedRef<() => void | undefined>;
40
40
  };
41
41
  type DropzoneProps = Omit<HTMLUIProps<"div">, "onDrop"> & ThemeProps<"Dropzone"> & DropzoneOptions & FormControlOptions & Omit<DropzoneOptions$1, "accept">;
42
+ /**
43
+ * Dropzone is a component used for uploading files via drag and drop.
44
+ *
45
+ * @see Docs https://yamada-ui.com/components/forms/dropzone
46
+ */
42
47
  declare const Dropzone: _yamada_ui_core.Component<"input", DropzoneProps>;
43
48
  declare const DropzoneAccept: FC<PropsWithChildren>;
44
49
  declare const DropzoneReject: FC<PropsWithChildren>;
@@ -39,6 +39,11 @@ type DropzoneOptions = {
39
39
  openRef?: ForwardedRef<() => void | undefined>;
40
40
  };
41
41
  type DropzoneProps = Omit<HTMLUIProps<"div">, "onDrop"> & ThemeProps<"Dropzone"> & DropzoneOptions & FormControlOptions & Omit<DropzoneOptions$1, "accept">;
42
+ /**
43
+ * Dropzone is a component used for uploading files via drag and drop.
44
+ *
45
+ * @see Docs https://yamada-ui.com/components/forms/dropzone
46
+ */
42
47
  declare const Dropzone: _yamada_ui_core.Component<"input", DropzoneProps>;
43
48
  declare const DropzoneAccept: FC<PropsWithChildren>;
44
49
  declare const DropzoneReject: FC<PropsWithChildren>;
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/dropzone.tsx"],"sourcesContent":["import type {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useMultiComponentStyle,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport type { FadeProps } from \"@yamada-ui/transitions\"\nimport { Fade } from \"@yamada-ui/transitions\"\nimport {\n assignRef,\n createContext,\n cx,\n dataAttr,\n isArray,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type { FC, ForwardedRef, PropsWithChildren } from \"react\"\nimport { Fragment } from \"react\"\nimport type {\n Accept,\n DropzoneOptions as ReactDropzoneOptions,\n} from \"react-dropzone-esm\"\nimport { useDropzone } from \"react-dropzone-esm\"\n\ntype DropzoneContext = {\n isLoading?: boolean\n isDragAccept: boolean\n isDragReject: boolean\n isDragIdle: boolean\n styles: Record<string, CSSUIObject>\n}\n\nconst [DropzoneProvider, useDropzoneContext] = createContext<DropzoneContext>({\n name: \"DropzoneContext\",\n errorMessage: `useDropzoneContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Dropzone />\"`,\n})\n\ntype DropzoneOptions = {\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n */\n isLoading?: boolean\n /**\n * Props for dropzone overlay element.\n */\n overlayProps?: FadeProps\n /**\n * Props for dropzone loading icon element.\n */\n loadingProps?: LoadingProps\n /**\n * File types to accept.\n */\n accept?: Accept | string[]\n /**\n * Ref to a open function.\n */\n openRef?: ForwardedRef<() => void | undefined>\n}\n\nexport type DropzoneProps = Omit<HTMLUIProps<\"div\">, \"onDrop\"> &\n ThemeProps<\"Dropzone\"> &\n DropzoneOptions &\n FormControlOptions &\n Omit<ReactDropzoneOptions, \"accept\">\n\nexport const Dropzone = forwardRef<DropzoneProps, \"input\">((props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"Dropzone\", props)\n const {\n id,\n name,\n className,\n isLoading,\n overlayProps,\n loadingProps,\n openRef,\n accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n children,\n ...rest\n } = useFormControlProps(omitThemeProps(mergedProps))\n\n const disabled = isLoading || rest.disabled || rest.readOnly\n\n const [formControlProps, containerProps] = splitObject(\n rest,\n formControlProperties,\n )\n\n const { getRootProps, getInputProps, isDragAccept, isDragReject, open } =\n useDropzone({\n disabled,\n accept: isArray(accept)\n ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {})\n : accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n })\n\n assignRef(openRef, open)\n\n const isDragIdle = !isDragAccept && !isDragReject\n\n const css: CSSUIObject = {\n position: \"relative\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.container,\n }\n\n return (\n <DropzoneProvider\n value={{ isLoading, isDragAccept, isDragReject, isDragIdle, styles }}\n >\n <ui.div\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...containerProps}\n {...getRootProps()}\n data-accept={dataAttr(isDragAccept)}\n data-reject={dataAttr(isDragReject)}\n data-idle={dataAttr(isDragIdle)}\n data-loading={dataAttr(isLoading)}\n >\n <LoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n <ui.input\n ref={ref}\n id={id}\n name={name}\n {...formControlProps}\n {...getInputProps()}\n />\n {children}\n </ui.div>\n </DropzoneProvider>\n )\n})\n\ntype LoadingOverlayProps = FadeProps & { loadingProps?: LoadingProps }\n\nconst LoadingOverlay: FC<LoadingOverlayProps> = ({ loadingProps, ...rest }) => {\n const { isLoading, styles } = useDropzoneContext()\n\n const css: CSSUIObject = {\n position: \"absolute\",\n top: 0,\n left: 0,\n w: \"100%\",\n h: \"100%\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.overlay,\n }\n\n return (\n <Fade\n isOpen={isLoading}\n unmountOnExit\n className=\"ui-dropzone__overlay\"\n __css={css}\n {...rest}\n >\n <Loading\n className=\"ui-dropzone__overlay__loading\"\n size=\"4xl\"\n {...loadingProps}\n />\n </Fade>\n )\n}\n\nexport const DropzoneAccept: FC<PropsWithChildren> = ({ children }) => {\n const { isDragAccept } = useDropzoneContext()\n\n return isDragAccept ? <Fragment>{children}</Fragment> : null\n}\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { isDragReject } = useDropzoneContext()\n\n return isDragReject ? <Fragment>{children}</Fragment> : null\n}\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { isDragIdle } = useDropzoneContext()\n\n return isDragIdle ? <Fragment>{children}</Fragment> : null\n}\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../src/dropzone.tsx"],"sourcesContent":["import type {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useMultiComponentStyle,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport type { FadeProps } from \"@yamada-ui/transitions\"\nimport { Fade } from \"@yamada-ui/transitions\"\nimport {\n assignRef,\n createContext,\n cx,\n dataAttr,\n isArray,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type { FC, ForwardedRef, PropsWithChildren } from \"react\"\nimport { Fragment } from \"react\"\nimport type {\n Accept,\n DropzoneOptions as ReactDropzoneOptions,\n} from \"react-dropzone-esm\"\nimport { useDropzone } from \"react-dropzone-esm\"\n\ntype DropzoneContext = {\n isLoading?: boolean\n isDragAccept: boolean\n isDragReject: boolean\n isDragIdle: boolean\n styles: Record<string, CSSUIObject>\n}\n\nconst [DropzoneProvider, useDropzoneContext] = createContext<DropzoneContext>({\n name: \"DropzoneContext\",\n errorMessage: `useDropzoneContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Dropzone />\"`,\n})\n\ntype DropzoneOptions = {\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n */\n isLoading?: boolean\n /**\n * Props for dropzone overlay element.\n */\n overlayProps?: FadeProps\n /**\n * Props for dropzone loading icon element.\n */\n loadingProps?: LoadingProps\n /**\n * File types to accept.\n */\n accept?: Accept | string[]\n /**\n * Ref to a open function.\n */\n openRef?: ForwardedRef<() => void | undefined>\n}\n\nexport type DropzoneProps = Omit<HTMLUIProps<\"div\">, \"onDrop\"> &\n ThemeProps<\"Dropzone\"> &\n DropzoneOptions &\n FormControlOptions &\n Omit<ReactDropzoneOptions, \"accept\">\n\n/**\n * Dropzone is a component used for uploading files via drag and drop.\n *\n * @see Docs https://yamada-ui.com/components/forms/dropzone\n */\nexport const Dropzone = forwardRef<DropzoneProps, \"input\">((props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"Dropzone\", props)\n const {\n id,\n name,\n className,\n isLoading,\n overlayProps,\n loadingProps,\n openRef,\n accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n children,\n ...rest\n } = useFormControlProps(omitThemeProps(mergedProps))\n\n const disabled = isLoading || rest.disabled || rest.readOnly\n\n const [formControlProps, containerProps] = splitObject(\n rest,\n formControlProperties,\n )\n\n const { getRootProps, getInputProps, isDragAccept, isDragReject, open } =\n useDropzone({\n disabled,\n accept: isArray(accept)\n ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {})\n : accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n })\n\n assignRef(openRef, open)\n\n const isDragIdle = !isDragAccept && !isDragReject\n\n const css: CSSUIObject = {\n position: \"relative\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.container,\n }\n\n return (\n <DropzoneProvider\n value={{ isLoading, isDragAccept, isDragReject, isDragIdle, styles }}\n >\n <ui.div\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...containerProps}\n {...getRootProps()}\n data-accept={dataAttr(isDragAccept)}\n data-reject={dataAttr(isDragReject)}\n data-idle={dataAttr(isDragIdle)}\n data-loading={dataAttr(isLoading)}\n >\n <LoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n <ui.input\n ref={ref}\n id={id}\n name={name}\n {...formControlProps}\n {...getInputProps()}\n />\n {children}\n </ui.div>\n </DropzoneProvider>\n )\n})\n\ntype LoadingOverlayProps = FadeProps & { loadingProps?: LoadingProps }\n\nconst LoadingOverlay: FC<LoadingOverlayProps> = ({ loadingProps, ...rest }) => {\n const { isLoading, styles } = useDropzoneContext()\n\n const css: CSSUIObject = {\n position: \"absolute\",\n top: 0,\n left: 0,\n w: \"100%\",\n h: \"100%\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.overlay,\n }\n\n return (\n <Fade\n isOpen={isLoading}\n unmountOnExit\n className=\"ui-dropzone__overlay\"\n __css={css}\n {...rest}\n >\n <Loading\n className=\"ui-dropzone__overlay__loading\"\n size=\"4xl\"\n {...loadingProps}\n />\n </Fade>\n )\n}\n\nexport const DropzoneAccept: FC<PropsWithChildren> = ({ children }) => {\n const { isDragAccept } = useDropzoneContext()\n\n return isDragAccept ? <Fragment>{children}</Fragment> : null\n}\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { isDragReject } = useDropzoneContext()\n\n return isDragReject ? <Fragment>{children}</Fragment> : null\n}\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { isDragIdle } = useDropzoneContext()\n\n return isDragIdle ? <Fragment>{children}</Fragment> : null\n}\n"],"mappings":"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","names":[]}
package/dist/dropzone.mjs CHANGED
@@ -4,7 +4,7 @@ import {
4
4
  DropzoneAccept,
5
5
  DropzoneIdle,
6
6
  DropzoneReject
7
- } from "./chunk-252BWCWL.mjs";
7
+ } from "./chunk-OKY7MF3L.mjs";
8
8
  export {
9
9
  Dropzone,
10
10
  DropzoneAccept,
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/dropzone.tsx","../src/accept-types.ts"],"sourcesContent":["export {\n Dropzone,\n DropzoneAccept,\n DropzoneIdle,\n DropzoneReject,\n} from \"./dropzone\"\nexport type { DropzoneProps } from \"./dropzone\"\nexport * from \"./accept-types\"\nexport type {\n FileRejection,\n FileError,\n ErrorCode,\n DropEvent,\n} from \"react-dropzone-esm\"\n","import type {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useMultiComponentStyle,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport type { FadeProps } from \"@yamada-ui/transitions\"\nimport { Fade } from \"@yamada-ui/transitions\"\nimport {\n assignRef,\n createContext,\n cx,\n dataAttr,\n isArray,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type { FC, ForwardedRef, PropsWithChildren } from \"react\"\nimport { Fragment } from \"react\"\nimport type {\n Accept,\n DropzoneOptions as ReactDropzoneOptions,\n} from \"react-dropzone-esm\"\nimport { useDropzone } from \"react-dropzone-esm\"\n\ntype DropzoneContext = {\n isLoading?: boolean\n isDragAccept: boolean\n isDragReject: boolean\n isDragIdle: boolean\n styles: Record<string, CSSUIObject>\n}\n\nconst [DropzoneProvider, useDropzoneContext] = createContext<DropzoneContext>({\n name: \"DropzoneContext\",\n errorMessage: `useDropzoneContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Dropzone />\"`,\n})\n\ntype DropzoneOptions = {\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n */\n isLoading?: boolean\n /**\n * Props for dropzone overlay element.\n */\n overlayProps?: FadeProps\n /**\n * Props for dropzone loading icon element.\n */\n loadingProps?: LoadingProps\n /**\n * File types to accept.\n */\n accept?: Accept | string[]\n /**\n * Ref to a open function.\n */\n openRef?: ForwardedRef<() => void | undefined>\n}\n\nexport type DropzoneProps = Omit<HTMLUIProps<\"div\">, \"onDrop\"> &\n ThemeProps<\"Dropzone\"> &\n DropzoneOptions &\n FormControlOptions &\n Omit<ReactDropzoneOptions, \"accept\">\n\nexport const Dropzone = forwardRef<DropzoneProps, \"input\">((props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"Dropzone\", props)\n const {\n id,\n name,\n className,\n isLoading,\n overlayProps,\n loadingProps,\n openRef,\n accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n children,\n ...rest\n } = useFormControlProps(omitThemeProps(mergedProps))\n\n const disabled = isLoading || rest.disabled || rest.readOnly\n\n const [formControlProps, containerProps] = splitObject(\n rest,\n formControlProperties,\n )\n\n const { getRootProps, getInputProps, isDragAccept, isDragReject, open } =\n useDropzone({\n disabled,\n accept: isArray(accept)\n ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {})\n : accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n })\n\n assignRef(openRef, open)\n\n const isDragIdle = !isDragAccept && !isDragReject\n\n const css: CSSUIObject = {\n position: \"relative\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.container,\n }\n\n return (\n <DropzoneProvider\n value={{ isLoading, isDragAccept, isDragReject, isDragIdle, styles }}\n >\n <ui.div\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...containerProps}\n {...getRootProps()}\n data-accept={dataAttr(isDragAccept)}\n data-reject={dataAttr(isDragReject)}\n data-idle={dataAttr(isDragIdle)}\n data-loading={dataAttr(isLoading)}\n >\n <LoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n <ui.input\n ref={ref}\n id={id}\n name={name}\n {...formControlProps}\n {...getInputProps()}\n />\n {children}\n </ui.div>\n </DropzoneProvider>\n )\n})\n\ntype LoadingOverlayProps = FadeProps & { loadingProps?: LoadingProps }\n\nconst LoadingOverlay: FC<LoadingOverlayProps> = ({ loadingProps, ...rest }) => {\n const { isLoading, styles } = useDropzoneContext()\n\n const css: CSSUIObject = {\n position: \"absolute\",\n top: 0,\n left: 0,\n w: \"100%\",\n h: \"100%\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.overlay,\n }\n\n return (\n <Fade\n isOpen={isLoading}\n unmountOnExit\n className=\"ui-dropzone__overlay\"\n __css={css}\n {...rest}\n >\n <Loading\n className=\"ui-dropzone__overlay__loading\"\n size=\"4xl\"\n {...loadingProps}\n />\n </Fade>\n )\n}\n\nexport const DropzoneAccept: FC<PropsWithChildren> = ({ children }) => {\n const { isDragAccept } = useDropzoneContext()\n\n return isDragAccept ? <Fragment>{children}</Fragment> : null\n}\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { isDragReject } = useDropzoneContext()\n\n return isDragReject ? <Fragment>{children}</Fragment> : null\n}\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { isDragIdle } = useDropzoneContext()\n\n return isDragIdle ? <Fragment>{children}</Fragment> : null\n}\n","export const ACCEPT_TYPES = {\n txt: \"text/plain\",\n html: \"text/html\",\n csv: \"text/csv\",\n png: \"image/png\",\n gif: \"image/gif\",\n jpeg: \"image/jpeg\",\n svg: \"image/svg+xml\",\n webp: \"image/webp\",\n mp3: \"audio/mpeg\",\n mpeg: \"video/mpeg\",\n mp4: \"video/mp4\",\n zip: \"application/zip\",\n pdf: \"application/pdf\",\n doc: \"application/msword\",\n docx: \"application/vnd.openxmlformats-officedocument.wordprocessingml.document\",\n xls: \"application/vnd.ms-excel\",\n xlsx: \"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet\",\n ppt: \"application/vnd.ms-powerpoint\",\n pptx: \"application/vnd.openxmlformats-officedocument.presentationml.presentation\",\n exe: \"application/vnd.microsoft.portable-executable\",\n} as const\n\nexport const IMAGE_ACCEPT_TYPE = [\n ACCEPT_TYPES.png,\n ACCEPT_TYPES.gif,\n ACCEPT_TYPES.jpeg,\n ACCEPT_TYPES.svg,\n ACCEPT_TYPES.webp,\n]\nexport const PDF_ACCEPT_TYPE = [ACCEPT_TYPES.pdf]\nexport const MS_WORD_ACCEPT_TYPE = [ACCEPT_TYPES.doc, ACCEPT_TYPES.docx]\nexport const MS_EXCEL_ACCEPT_TYPE = [ACCEPT_TYPES.xls, ACCEPT_TYPES.xlsx]\nexport const MS_POWER_POINT_ACCEPT_TYPE = [ACCEPT_TYPES.ppt, ACCEPT_TYPES.pptx]\nexport const EXE_ACCEPT_TYPE = [ACCEPT_TYPES.exe]\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../src/index.ts","../src/dropzone.tsx","../src/accept-types.ts"],"sourcesContent":["export {\n Dropzone,\n DropzoneAccept,\n DropzoneIdle,\n DropzoneReject,\n} from \"./dropzone\"\nexport type { DropzoneProps } from \"./dropzone\"\nexport * from \"./accept-types\"\nexport type {\n FileRejection,\n FileError,\n ErrorCode,\n DropEvent,\n} from \"react-dropzone-esm\"\n","import type {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useMultiComponentStyle,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport type { FadeProps } from \"@yamada-ui/transitions\"\nimport { Fade } from \"@yamada-ui/transitions\"\nimport {\n assignRef,\n createContext,\n cx,\n dataAttr,\n isArray,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type { FC, ForwardedRef, PropsWithChildren } from \"react\"\nimport { Fragment } from \"react\"\nimport type {\n Accept,\n DropzoneOptions as ReactDropzoneOptions,\n} from \"react-dropzone-esm\"\nimport { useDropzone } from \"react-dropzone-esm\"\n\ntype DropzoneContext = {\n isLoading?: boolean\n isDragAccept: boolean\n isDragReject: boolean\n isDragIdle: boolean\n styles: Record<string, CSSUIObject>\n}\n\nconst [DropzoneProvider, useDropzoneContext] = createContext<DropzoneContext>({\n name: \"DropzoneContext\",\n errorMessage: `useDropzoneContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Dropzone />\"`,\n})\n\ntype DropzoneOptions = {\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n */\n isLoading?: boolean\n /**\n * Props for dropzone overlay element.\n */\n overlayProps?: FadeProps\n /**\n * Props for dropzone loading icon element.\n */\n loadingProps?: LoadingProps\n /**\n * File types to accept.\n */\n accept?: Accept | string[]\n /**\n * Ref to a open function.\n */\n openRef?: ForwardedRef<() => void | undefined>\n}\n\nexport type DropzoneProps = Omit<HTMLUIProps<\"div\">, \"onDrop\"> &\n ThemeProps<\"Dropzone\"> &\n DropzoneOptions &\n FormControlOptions &\n Omit<ReactDropzoneOptions, \"accept\">\n\n/**\n * Dropzone is a component used for uploading files via drag and drop.\n *\n * @see Docs https://yamada-ui.com/components/forms/dropzone\n */\nexport const Dropzone = forwardRef<DropzoneProps, \"input\">((props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"Dropzone\", props)\n const {\n id,\n name,\n className,\n isLoading,\n overlayProps,\n loadingProps,\n openRef,\n accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n children,\n ...rest\n } = useFormControlProps(omitThemeProps(mergedProps))\n\n const disabled = isLoading || rest.disabled || rest.readOnly\n\n const [formControlProps, containerProps] = splitObject(\n rest,\n formControlProperties,\n )\n\n const { getRootProps, getInputProps, isDragAccept, isDragReject, open } =\n useDropzone({\n disabled,\n accept: isArray(accept)\n ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {})\n : accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n })\n\n assignRef(openRef, open)\n\n const isDragIdle = !isDragAccept && !isDragReject\n\n const css: CSSUIObject = {\n position: \"relative\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.container,\n }\n\n return (\n <DropzoneProvider\n value={{ isLoading, isDragAccept, isDragReject, isDragIdle, styles }}\n >\n <ui.div\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...containerProps}\n {...getRootProps()}\n data-accept={dataAttr(isDragAccept)}\n data-reject={dataAttr(isDragReject)}\n data-idle={dataAttr(isDragIdle)}\n data-loading={dataAttr(isLoading)}\n >\n <LoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n <ui.input\n ref={ref}\n id={id}\n name={name}\n {...formControlProps}\n {...getInputProps()}\n />\n {children}\n </ui.div>\n </DropzoneProvider>\n )\n})\n\ntype LoadingOverlayProps = FadeProps & { loadingProps?: LoadingProps }\n\nconst LoadingOverlay: FC<LoadingOverlayProps> = ({ loadingProps, ...rest }) => {\n const { isLoading, styles } = useDropzoneContext()\n\n const css: CSSUIObject = {\n position: \"absolute\",\n top: 0,\n left: 0,\n w: \"100%\",\n h: \"100%\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.overlay,\n }\n\n return (\n <Fade\n isOpen={isLoading}\n unmountOnExit\n className=\"ui-dropzone__overlay\"\n __css={css}\n {...rest}\n >\n <Loading\n className=\"ui-dropzone__overlay__loading\"\n size=\"4xl\"\n {...loadingProps}\n />\n </Fade>\n )\n}\n\nexport const DropzoneAccept: FC<PropsWithChildren> = ({ children }) => {\n const { isDragAccept } = useDropzoneContext()\n\n return isDragAccept ? <Fragment>{children}</Fragment> : null\n}\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { isDragReject } = useDropzoneContext()\n\n return isDragReject ? <Fragment>{children}</Fragment> : null\n}\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { isDragIdle } = useDropzoneContext()\n\n return isDragIdle ? <Fragment>{children}</Fragment> : null\n}\n","export const ACCEPT_TYPES = {\n txt: \"text/plain\",\n html: \"text/html\",\n csv: \"text/csv\",\n png: \"image/png\",\n gif: \"image/gif\",\n jpeg: \"image/jpeg\",\n svg: \"image/svg+xml\",\n webp: \"image/webp\",\n mp3: \"audio/mpeg\",\n mpeg: \"video/mpeg\",\n mp4: \"video/mp4\",\n zip: \"application/zip\",\n pdf: \"application/pdf\",\n doc: \"application/msword\",\n docx: \"application/vnd.openxmlformats-officedocument.wordprocessingml.document\",\n xls: \"application/vnd.ms-excel\",\n xlsx: \"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet\",\n ppt: \"application/vnd.ms-powerpoint\",\n pptx: \"application/vnd.openxmlformats-officedocument.presentationml.presentation\",\n exe: \"application/vnd.microsoft.portable-executable\",\n} as const\n\nexport const IMAGE_ACCEPT_TYPE = [\n ACCEPT_TYPES.png,\n ACCEPT_TYPES.gif,\n ACCEPT_TYPES.jpeg,\n ACCEPT_TYPES.svg,\n ACCEPT_TYPES.webp,\n]\nexport const PDF_ACCEPT_TYPE = [ACCEPT_TYPES.pdf]\nexport const MS_WORD_ACCEPT_TYPE = [ACCEPT_TYPES.doc, ACCEPT_TYPES.docx]\nexport const MS_EXCEL_ACCEPT_TYPE = [ACCEPT_TYPES.xls, ACCEPT_TYPES.xlsx]\nexport const MS_POWER_POINT_ACCEPT_TYPE = [ACCEPT_TYPES.ppt, ACCEPT_TYPES.pptx]\nexport const EXE_ACCEPT_TYPE = [ACCEPT_TYPES.exe]\n"],"mappings":"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","names":[]}
package/dist/index.mjs CHANGED
@@ -13,7 +13,7 @@ import {
13
13
  DropzoneAccept,
14
14
  DropzoneIdle,
15
15
  DropzoneReject
16
- } from "./chunk-252BWCWL.mjs";
16
+ } from "./chunk-OKY7MF3L.mjs";
17
17
  export {
18
18
  ACCEPT_TYPES,
19
19
  Dropzone,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yamada-ui/dropzone",
3
- "version": "0.5.16",
3
+ "version": "1.0.1",
4
4
  "description": "Yamada UI dropzone component",
5
5
  "keywords": [
6
6
  "yamada",
@@ -26,6 +26,7 @@
26
26
  "publishConfig": {
27
27
  "access": "public"
28
28
  },
29
+ "homepage": "https://yamada-ui.com",
29
30
  "repository": {
30
31
  "type": "git",
31
32
  "url": "git+https://github.com/hirotomoyamada/yamada-ui",
@@ -36,11 +37,11 @@
36
37
  },
37
38
  "dependencies": {
38
39
  "react-dropzone-esm": "^15.0.1",
39
- "@yamada-ui/core": "0.15.4",
40
- "@yamada-ui/form-control": "0.3.32",
41
- "@yamada-ui/loading": "0.5.17",
42
- "@yamada-ui/transitions": "0.3.31",
43
- "@yamada-ui/utils": "0.5.1"
40
+ "@yamada-ui/core": "1.1.0",
41
+ "@yamada-ui/form-control": "1.0.1",
42
+ "@yamada-ui/loading": "1.0.1",
43
+ "@yamada-ui/transitions": "1.0.1",
44
+ "@yamada-ui/utils": "1.0.0"
44
45
  },
45
46
  "devDependencies": {
46
47
  "clean-package": "2.2.0",
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/dropzone.tsx"],"sourcesContent":["import type {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useMultiComponentStyle,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport type { FadeProps } from \"@yamada-ui/transitions\"\nimport { Fade } from \"@yamada-ui/transitions\"\nimport {\n assignRef,\n createContext,\n cx,\n dataAttr,\n isArray,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type { FC, ForwardedRef, PropsWithChildren } from \"react\"\nimport { Fragment } from \"react\"\nimport type {\n Accept,\n DropzoneOptions as ReactDropzoneOptions,\n} from \"react-dropzone-esm\"\nimport { useDropzone } from \"react-dropzone-esm\"\n\ntype DropzoneContext = {\n isLoading?: boolean\n isDragAccept: boolean\n isDragReject: boolean\n isDragIdle: boolean\n styles: Record<string, CSSUIObject>\n}\n\nconst [DropzoneProvider, useDropzoneContext] = createContext<DropzoneContext>({\n name: \"DropzoneContext\",\n errorMessage: `useDropzoneContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Dropzone />\"`,\n})\n\ntype DropzoneOptions = {\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n */\n isLoading?: boolean\n /**\n * Props for dropzone overlay element.\n */\n overlayProps?: FadeProps\n /**\n * Props for dropzone loading icon element.\n */\n loadingProps?: LoadingProps\n /**\n * File types to accept.\n */\n accept?: Accept | string[]\n /**\n * Ref to a open function.\n */\n openRef?: ForwardedRef<() => void | undefined>\n}\n\nexport type DropzoneProps = Omit<HTMLUIProps<\"div\">, \"onDrop\"> &\n ThemeProps<\"Dropzone\"> &\n DropzoneOptions &\n FormControlOptions &\n Omit<ReactDropzoneOptions, \"accept\">\n\nexport const Dropzone = forwardRef<DropzoneProps, \"input\">((props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"Dropzone\", props)\n const {\n id,\n name,\n className,\n isLoading,\n overlayProps,\n loadingProps,\n openRef,\n accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n children,\n ...rest\n } = useFormControlProps(omitThemeProps(mergedProps))\n\n const disabled = isLoading || rest.disabled || rest.readOnly\n\n const [formControlProps, containerProps] = splitObject(\n rest,\n formControlProperties,\n )\n\n const { getRootProps, getInputProps, isDragAccept, isDragReject, open } =\n useDropzone({\n disabled,\n accept: isArray(accept)\n ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {})\n : accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n })\n\n assignRef(openRef, open)\n\n const isDragIdle = !isDragAccept && !isDragReject\n\n const css: CSSUIObject = {\n position: \"relative\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.container,\n }\n\n return (\n <DropzoneProvider\n value={{ isLoading, isDragAccept, isDragReject, isDragIdle, styles }}\n >\n <ui.div\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...containerProps}\n {...getRootProps()}\n data-accept={dataAttr(isDragAccept)}\n data-reject={dataAttr(isDragReject)}\n data-idle={dataAttr(isDragIdle)}\n data-loading={dataAttr(isLoading)}\n >\n <LoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n <ui.input\n ref={ref}\n id={id}\n name={name}\n {...formControlProps}\n {...getInputProps()}\n />\n {children}\n </ui.div>\n </DropzoneProvider>\n )\n})\n\ntype LoadingOverlayProps = FadeProps & { loadingProps?: LoadingProps }\n\nconst LoadingOverlay: FC<LoadingOverlayProps> = ({ loadingProps, ...rest }) => {\n const { isLoading, styles } = useDropzoneContext()\n\n const css: CSSUIObject = {\n position: \"absolute\",\n top: 0,\n left: 0,\n w: \"100%\",\n h: \"100%\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.overlay,\n }\n\n return (\n <Fade\n isOpen={isLoading}\n unmountOnExit\n className=\"ui-dropzone__overlay\"\n __css={css}\n {...rest}\n >\n <Loading\n className=\"ui-dropzone__overlay__loading\"\n size=\"4xl\"\n {...loadingProps}\n />\n </Fade>\n )\n}\n\nexport const DropzoneAccept: FC<PropsWithChildren> = ({ children }) => {\n const { isDragAccept } = useDropzoneContext()\n\n return isDragAccept ? <Fragment>{children}</Fragment> : null\n}\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { isDragReject } = useDropzoneContext()\n\n return isDragReject ? <Fragment>{children}</Fragment> : null\n}\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { isDragIdle } = useDropzoneContext()\n\n return isDragIdle ? <Fragment>{children}</Fragment> : null\n}\n"],"mappings":"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","names":[]}