@yamada-ui/dropzone 1.0.53-dev-20241124042929 → 1.1.0-dev-20241124060937
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/{chunk-HNJJPP2P.mjs → chunk-L4DNAHMP.mjs} +5 -1
- package/dist/chunk-L4DNAHMP.mjs.map +1 -0
- package/dist/dropzone.js +4 -0
- package/dist/dropzone.js.map +1 -1
- package/dist/dropzone.mjs +1 -1
- package/dist/index.js +4 -0
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1 -1
- package/package.json +5 -5
- package/dist/chunk-HNJJPP2P.mjs.map +0 -1
@@ -21,6 +21,7 @@ import {
|
|
21
21
|
isArray,
|
22
22
|
splitObject
|
23
23
|
} from "@yamada-ui/utils";
|
24
|
+
import { useId } from "react";
|
24
25
|
import { useDropzone } from "react-dropzone-esm";
|
25
26
|
import { jsx, jsxs } from "react/jsx-runtime";
|
26
27
|
var [DropzoneProvider, useDropzoneContext] = createContext({
|
@@ -60,6 +61,7 @@ var Dropzone = forwardRef((props, ref) => {
|
|
60
61
|
onFileDialogOpen,
|
61
62
|
...rest
|
62
63
|
} = useFormControlProps(omitThemeProps(mergedProps));
|
64
|
+
const labelledbyId = useId();
|
63
65
|
loading != null ? loading : loading = isLoading;
|
64
66
|
const disabled = loading || rest.disabled || rest.readOnly;
|
65
67
|
const [
|
@@ -116,6 +118,7 @@ var Dropzone = forwardRef((props, ref) => {
|
|
116
118
|
children: /* @__PURE__ */ jsxs(
|
117
119
|
ui.div,
|
118
120
|
{
|
121
|
+
id: labelledbyId,
|
119
122
|
className: cx("ui-dropzone", className),
|
120
123
|
__css: css,
|
121
124
|
...formControlProps,
|
@@ -133,6 +136,7 @@ var Dropzone = forwardRef((props, ref) => {
|
|
133
136
|
id,
|
134
137
|
ref,
|
135
138
|
name,
|
139
|
+
"aria-labelledby": labelledbyId,
|
136
140
|
"aria-readonly": ariaReadOnly,
|
137
141
|
...formControlProps,
|
138
142
|
...getInputProps()
|
@@ -209,4 +213,4 @@ export {
|
|
209
213
|
DropzoneReject,
|
210
214
|
DropzoneIdle
|
211
215
|
};
|
212
|
-
//# sourceMappingURL=chunk-
|
216
|
+
//# sourceMappingURL=chunk-L4DNAHMP.mjs.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../src/dropzone.tsx"],"sourcesContent":["import type {\n ColorModeToken,\n CSS,\n CSSUIObject,\n FC,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport type { FadeProps } from \"@yamada-ui/transitions\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport type { ForwardedRef, PropsWithChildren } from \"react\"\nimport type {\n Accept,\n DropzoneOptions as ReactDropzoneOptions,\n} from \"react-dropzone-esm\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { Loading } from \"@yamada-ui/loading\"\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 { useId } from \"react\"\nimport { useDropzone } from \"react-dropzone-esm\"\n\ninterface DropzoneContext {\n dragAccept: boolean\n dragIdle: boolean\n dragReject: boolean\n styles: { [key: string]: CSSUIObject | undefined }\n loading?: boolean\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\ninterface DropzoneOptions {\n /**\n * File types to accept.\n */\n accept?: Accept | string[]\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n *\n * @deprecated Use `loading` instead.\n */\n isLoading?: boolean\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n */\n loading?: boolean\n /**\n * Ref to a open function.\n */\n openRef?: ForwardedRef<() => undefined | void>\n /**\n * Props for dropzone loading icon element.\n */\n loadingProps?: LoadingProps\n /**\n * Props for dropzone overlay element.\n */\n overlayProps?: FadeProps\n}\n\nexport interface DropzoneProps\n extends Merge<HTMLUIProps, Omit<ReactDropzoneOptions, \"accept\">>,\n ThemeProps<\"Dropzone\">,\n DropzoneOptions,\n FormControlOptions {}\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] = useComponentMultiStyle(\"Dropzone\", props)\n let {\n id,\n name,\n className,\n accept,\n autoFocus,\n children,\n isLoading,\n loading,\n maxFiles,\n maxSize,\n multiple,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n openRef,\n preventDropOnDocument,\n useFsAccessApi,\n loadingProps,\n overlayProps,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onDrop,\n onDropAccepted,\n onDropRejected,\n onFileDialogCancel,\n onFileDialogOpen,\n ...rest\n } = useFormControlProps(omitThemeProps(mergedProps))\n const labelledbyId = useId()\n\n loading ??= isLoading\n\n const disabled = loading || rest.disabled || rest.readOnly\n\n const [\n { \"aria-readonly\": ariaReadOnly, ...formControlProps },\n containerProps,\n ] = splitObject(rest, formControlProperties)\n\n const {\n isDragAccept: dragAccept,\n isDragReject: dragReject,\n open,\n getInputProps,\n getRootProps,\n } = useDropzone({\n accept: isArray(accept)\n ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {})\n : accept,\n autoFocus,\n disabled,\n maxFiles,\n maxSize,\n multiple,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n preventDropOnDocument,\n useFsAccessApi,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onDrop,\n onDropAccepted,\n onDropRejected,\n onFileDialogCancel,\n onFileDialogOpen,\n })\n\n assignRef(openRef, open)\n\n const dragIdle = !dragAccept && !dragReject\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n justifyContent: \"center\",\n position: \"relative\",\n ...styles.container,\n }\n\n return (\n <DropzoneProvider\n value={{\n dragAccept,\n dragIdle,\n dragReject,\n loading,\n styles,\n }}\n >\n <ui.div\n id={labelledbyId}\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...formControlProps}\n {...containerProps}\n {...getRootProps({})}\n data-accept={dataAttr(dragAccept)}\n data-idle={dataAttr(dragIdle)}\n data-loading={dataAttr(loading)}\n data-reject={dataAttr(dragReject)}\n >\n <DropzoneLoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n\n <ui.input\n id={id}\n ref={ref}\n name={name}\n aria-labelledby={labelledbyId}\n aria-readonly={ariaReadOnly}\n {...formControlProps}\n {...getInputProps()}\n />\n {children}\n </ui.div>\n </DropzoneProvider>\n )\n})\n\nDropzone.displayName = \"Dropzone\"\nDropzone.__ui__ = \"Dropzone\"\n\ninterface DropzoneLoadingOverlayProps extends FadeProps {\n loadingProps?: LoadingProps\n}\n\nconst DropzoneLoadingOverlay: FC<DropzoneLoadingOverlayProps> = ({\n loadingProps,\n ...rest\n}) => {\n const { loading, styles } = useDropzoneContext()\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n h: \"100%\",\n justifyContent: \"center\",\n left: 0,\n position: \"absolute\",\n top: 0,\n w: \"100%\",\n ...styles.overlay,\n }\n\n return (\n <Fade\n className=\"ui-dropzone__overlay\"\n open={loading}\n unmountOnExit\n __css={css}\n {...rest}\n >\n <Loading\n className=\"ui-dropzone__overlay__loading\"\n fontSize=\"4xl\"\n {...loadingProps}\n />\n </Fade>\n )\n}\n\nDropzoneLoadingOverlay.displayName = \"DropzoneLoadingOverlay\"\nDropzoneLoadingOverlay.__ui__ = \"DropzoneLoadingOverlay\"\n\nexport const DropzoneAccept: FC<PropsWithChildren> = ({ children }) => {\n const { dragAccept } = useDropzoneContext()\n\n return dragAccept ? children : null\n}\n\nDropzoneAccept.displayName = \"DropzoneAccept\"\nDropzoneAccept.__ui__ = \"DropzoneAccept\"\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { dragReject } = useDropzoneContext()\n\n return dragReject ? children : null\n}\n\nDropzoneReject.displayName = \"DropzoneReject\"\nDropzoneReject.__ui__ = \"DropzoneReject\"\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { dragIdle } = useDropzoneContext()\n\n return dragIdle ? children : null\n}\n\nDropzoneIdle.displayName = \"DropzoneIdle\"\nDropzoneIdle.__ui__ = \"DropzoneIdle\"\n"],"mappings":"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","names":[]}
|
package/dist/dropzone.js
CHANGED
@@ -32,6 +32,7 @@ var import_form_control = require("@yamada-ui/form-control");
|
|
32
32
|
var import_loading = require("@yamada-ui/loading");
|
33
33
|
var import_transitions = require("@yamada-ui/transitions");
|
34
34
|
var import_utils = require("@yamada-ui/utils");
|
35
|
+
var import_react = require("react");
|
35
36
|
var import_react_dropzone_esm = require("react-dropzone-esm");
|
36
37
|
var import_jsx_runtime = require("react/jsx-runtime");
|
37
38
|
var [DropzoneProvider, useDropzoneContext] = (0, import_utils.createContext)({
|
@@ -71,6 +72,7 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
|
|
71
72
|
onFileDialogOpen,
|
72
73
|
...rest
|
73
74
|
} = (0, import_form_control.useFormControlProps)((0, import_core.omitThemeProps)(mergedProps));
|
75
|
+
const labelledbyId = (0, import_react.useId)();
|
74
76
|
loading != null ? loading : loading = isLoading;
|
75
77
|
const disabled = loading || rest.disabled || rest.readOnly;
|
76
78
|
const [
|
@@ -127,6 +129,7 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
|
|
127
129
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
128
130
|
import_core.ui.div,
|
129
131
|
{
|
132
|
+
id: labelledbyId,
|
130
133
|
className: (0, import_utils.cx)("ui-dropzone", className),
|
131
134
|
__css: css,
|
132
135
|
...formControlProps,
|
@@ -144,6 +147,7 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
|
|
144
147
|
id,
|
145
148
|
ref,
|
146
149
|
name,
|
150
|
+
"aria-labelledby": labelledbyId,
|
147
151
|
"aria-readonly": ariaReadOnly,
|
148
152
|
...formControlProps,
|
149
153
|
...getInputProps()
|
package/dist/dropzone.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/dropzone.tsx"],"sourcesContent":["import type {\n ColorModeToken,\n CSS,\n CSSUIObject,\n FC,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport type { FadeProps } from \"@yamada-ui/transitions\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport type { ForwardedRef, PropsWithChildren } from \"react\"\nimport type {\n Accept,\n DropzoneOptions as ReactDropzoneOptions,\n} from \"react-dropzone-esm\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { Loading } from \"@yamada-ui/loading\"\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 { useDropzone } from \"react-dropzone-esm\"\n\ninterface DropzoneContext {\n dragAccept: boolean\n dragIdle: boolean\n dragReject: boolean\n styles: { [key: string]: CSSUIObject | undefined }\n loading?: boolean\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\ninterface DropzoneOptions {\n /**\n * File types to accept.\n */\n accept?: Accept | string[]\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n *\n * @deprecated Use `loading` instead.\n */\n isLoading?: boolean\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n */\n loading?: boolean\n /**\n * Ref to a open function.\n */\n openRef?: ForwardedRef<() => undefined | void>\n /**\n * Props for dropzone loading icon element.\n */\n loadingProps?: LoadingProps\n /**\n * Props for dropzone overlay element.\n */\n overlayProps?: FadeProps\n}\n\nexport interface DropzoneProps\n extends Merge<HTMLUIProps, Omit<ReactDropzoneOptions, \"accept\">>,\n ThemeProps<\"Dropzone\">,\n DropzoneOptions,\n FormControlOptions {}\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] = useComponentMultiStyle(\"Dropzone\", props)\n let {\n id,\n name,\n className,\n accept,\n autoFocus,\n children,\n isLoading,\n loading,\n maxFiles,\n maxSize,\n multiple,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n openRef,\n preventDropOnDocument,\n useFsAccessApi,\n loadingProps,\n overlayProps,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onDrop,\n onDropAccepted,\n onDropRejected,\n onFileDialogCancel,\n onFileDialogOpen,\n ...rest\n } = useFormControlProps(omitThemeProps(mergedProps))\n\n loading ??= isLoading\n\n const disabled = loading || rest.disabled || rest.readOnly\n\n const [\n { \"aria-readonly\": ariaReadOnly, ...formControlProps },\n containerProps,\n ] = splitObject(rest, formControlProperties)\n\n const {\n isDragAccept: dragAccept,\n isDragReject: dragReject,\n open,\n getInputProps,\n getRootProps,\n } = useDropzone({\n accept: isArray(accept)\n ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {})\n : accept,\n autoFocus,\n disabled,\n maxFiles,\n maxSize,\n multiple,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n preventDropOnDocument,\n useFsAccessApi,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onDrop,\n onDropAccepted,\n onDropRejected,\n onFileDialogCancel,\n onFileDialogOpen,\n })\n\n assignRef(openRef, open)\n\n const dragIdle = !dragAccept && !dragReject\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n justifyContent: \"center\",\n position: \"relative\",\n ...styles.container,\n }\n\n return (\n <DropzoneProvider\n value={{\n dragAccept,\n dragIdle,\n dragReject,\n loading,\n styles,\n }}\n >\n <ui.div\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...formControlProps}\n {...containerProps}\n {...getRootProps({})}\n data-accept={dataAttr(dragAccept)}\n data-idle={dataAttr(dragIdle)}\n data-loading={dataAttr(loading)}\n data-reject={dataAttr(dragReject)}\n >\n <DropzoneLoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n\n <ui.input\n id={id}\n ref={ref}\n name={name}\n aria-readonly={ariaReadOnly}\n {...formControlProps}\n {...getInputProps()}\n />\n {children}\n </ui.div>\n </DropzoneProvider>\n )\n})\n\nDropzone.displayName = \"Dropzone\"\nDropzone.__ui__ = \"Dropzone\"\n\ninterface DropzoneLoadingOverlayProps extends FadeProps {\n loadingProps?: LoadingProps\n}\n\nconst DropzoneLoadingOverlay: FC<DropzoneLoadingOverlayProps> = ({\n loadingProps,\n ...rest\n}) => {\n const { loading, styles } = useDropzoneContext()\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n h: \"100%\",\n justifyContent: \"center\",\n left: 0,\n position: \"absolute\",\n top: 0,\n w: \"100%\",\n ...styles.overlay,\n }\n\n return (\n <Fade\n className=\"ui-dropzone__overlay\"\n open={loading}\n unmountOnExit\n __css={css}\n {...rest}\n >\n <Loading\n className=\"ui-dropzone__overlay__loading\"\n fontSize=\"4xl\"\n {...loadingProps}\n />\n </Fade>\n )\n}\n\nDropzoneLoadingOverlay.displayName = \"DropzoneLoadingOverlay\"\nDropzoneLoadingOverlay.__ui__ = \"DropzoneLoadingOverlay\"\n\nexport const DropzoneAccept: FC<PropsWithChildren> = ({ children }) => {\n const { dragAccept } = useDropzoneContext()\n\n return dragAccept ? children : null\n}\n\nDropzoneAccept.displayName = \"DropzoneAccept\"\nDropzoneAccept.__ui__ = \"DropzoneAccept\"\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { dragReject } = useDropzoneContext()\n\n return dragReject ? children : null\n}\n\nDropzoneReject.displayName = \"DropzoneReject\"\nDropzoneReject.__ui__ = \"DropzoneReject\"\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { dragIdle } = useDropzoneContext()\n\n return dragIdle ? children : null\n}\n\nDropzoneIdle.displayName = \"DropzoneIdle\"\nDropzoneIdle.__ui__ = \"DropzoneIdle\"\n"],"mappings":"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","names":[]}
|
1
|
+
{"version":3,"sources":["../src/dropzone.tsx"],"sourcesContent":["import type {\n ColorModeToken,\n CSS,\n CSSUIObject,\n FC,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport type { FadeProps } from \"@yamada-ui/transitions\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport type { ForwardedRef, PropsWithChildren } from \"react\"\nimport type {\n Accept,\n DropzoneOptions as ReactDropzoneOptions,\n} from \"react-dropzone-esm\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { Loading } from \"@yamada-ui/loading\"\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 { useId } from \"react\"\nimport { useDropzone } from \"react-dropzone-esm\"\n\ninterface DropzoneContext {\n dragAccept: boolean\n dragIdle: boolean\n dragReject: boolean\n styles: { [key: string]: CSSUIObject | undefined }\n loading?: boolean\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\ninterface DropzoneOptions {\n /**\n * File types to accept.\n */\n accept?: Accept | string[]\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n *\n * @deprecated Use `loading` instead.\n */\n isLoading?: boolean\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n */\n loading?: boolean\n /**\n * Ref to a open function.\n */\n openRef?: ForwardedRef<() => undefined | void>\n /**\n * Props for dropzone loading icon element.\n */\n loadingProps?: LoadingProps\n /**\n * Props for dropzone overlay element.\n */\n overlayProps?: FadeProps\n}\n\nexport interface DropzoneProps\n extends Merge<HTMLUIProps, Omit<ReactDropzoneOptions, \"accept\">>,\n ThemeProps<\"Dropzone\">,\n DropzoneOptions,\n FormControlOptions {}\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] = useComponentMultiStyle(\"Dropzone\", props)\n let {\n id,\n name,\n className,\n accept,\n autoFocus,\n children,\n isLoading,\n loading,\n maxFiles,\n maxSize,\n multiple,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n openRef,\n preventDropOnDocument,\n useFsAccessApi,\n loadingProps,\n overlayProps,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onDrop,\n onDropAccepted,\n onDropRejected,\n onFileDialogCancel,\n onFileDialogOpen,\n ...rest\n } = useFormControlProps(omitThemeProps(mergedProps))\n const labelledbyId = useId()\n\n loading ??= isLoading\n\n const disabled = loading || rest.disabled || rest.readOnly\n\n const [\n { \"aria-readonly\": ariaReadOnly, ...formControlProps },\n containerProps,\n ] = splitObject(rest, formControlProperties)\n\n const {\n isDragAccept: dragAccept,\n isDragReject: dragReject,\n open,\n getInputProps,\n getRootProps,\n } = useDropzone({\n accept: isArray(accept)\n ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {})\n : accept,\n autoFocus,\n disabled,\n maxFiles,\n maxSize,\n multiple,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n preventDropOnDocument,\n useFsAccessApi,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onDrop,\n onDropAccepted,\n onDropRejected,\n onFileDialogCancel,\n onFileDialogOpen,\n })\n\n assignRef(openRef, open)\n\n const dragIdle = !dragAccept && !dragReject\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n justifyContent: \"center\",\n position: \"relative\",\n ...styles.container,\n }\n\n return (\n <DropzoneProvider\n value={{\n dragAccept,\n dragIdle,\n dragReject,\n loading,\n styles,\n }}\n >\n <ui.div\n id={labelledbyId}\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...formControlProps}\n {...containerProps}\n {...getRootProps({})}\n data-accept={dataAttr(dragAccept)}\n data-idle={dataAttr(dragIdle)}\n data-loading={dataAttr(loading)}\n data-reject={dataAttr(dragReject)}\n >\n <DropzoneLoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n\n <ui.input\n id={id}\n ref={ref}\n name={name}\n aria-labelledby={labelledbyId}\n aria-readonly={ariaReadOnly}\n {...formControlProps}\n {...getInputProps()}\n />\n {children}\n </ui.div>\n </DropzoneProvider>\n )\n})\n\nDropzone.displayName = \"Dropzone\"\nDropzone.__ui__ = \"Dropzone\"\n\ninterface DropzoneLoadingOverlayProps extends FadeProps {\n loadingProps?: LoadingProps\n}\n\nconst DropzoneLoadingOverlay: FC<DropzoneLoadingOverlayProps> = ({\n loadingProps,\n ...rest\n}) => {\n const { loading, styles } = useDropzoneContext()\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n h: \"100%\",\n justifyContent: \"center\",\n left: 0,\n position: \"absolute\",\n top: 0,\n w: \"100%\",\n ...styles.overlay,\n }\n\n return (\n <Fade\n className=\"ui-dropzone__overlay\"\n open={loading}\n unmountOnExit\n __css={css}\n {...rest}\n >\n <Loading\n className=\"ui-dropzone__overlay__loading\"\n fontSize=\"4xl\"\n {...loadingProps}\n />\n </Fade>\n )\n}\n\nDropzoneLoadingOverlay.displayName = \"DropzoneLoadingOverlay\"\nDropzoneLoadingOverlay.__ui__ = \"DropzoneLoadingOverlay\"\n\nexport const DropzoneAccept: FC<PropsWithChildren> = ({ children }) => {\n const { dragAccept } = useDropzoneContext()\n\n return dragAccept ? children : null\n}\n\nDropzoneAccept.displayName = \"DropzoneAccept\"\nDropzoneAccept.__ui__ = \"DropzoneAccept\"\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { dragReject } = useDropzoneContext()\n\n return dragReject ? children : null\n}\n\nDropzoneReject.displayName = \"DropzoneReject\"\nDropzoneReject.__ui__ = \"DropzoneReject\"\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { dragIdle } = useDropzoneContext()\n\n return dragIdle ? children : null\n}\n\nDropzoneIdle.displayName = \"DropzoneIdle\"\nDropzoneIdle.__ui__ = \"DropzoneIdle\"\n"],"mappings":"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","names":[]}
|
package/dist/dropzone.mjs
CHANGED
package/dist/index.js
CHANGED
@@ -77,6 +77,7 @@ var import_form_control = require("@yamada-ui/form-control");
|
|
77
77
|
var import_loading = require("@yamada-ui/loading");
|
78
78
|
var import_transitions = require("@yamada-ui/transitions");
|
79
79
|
var import_utils = require("@yamada-ui/utils");
|
80
|
+
var import_react = require("react");
|
80
81
|
var import_react_dropzone_esm = require("react-dropzone-esm");
|
81
82
|
var import_jsx_runtime = require("react/jsx-runtime");
|
82
83
|
var [DropzoneProvider, useDropzoneContext] = (0, import_utils.createContext)({
|
@@ -116,6 +117,7 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
|
|
116
117
|
onFileDialogOpen,
|
117
118
|
...rest
|
118
119
|
} = (0, import_form_control.useFormControlProps)((0, import_core.omitThemeProps)(mergedProps));
|
120
|
+
const labelledbyId = (0, import_react.useId)();
|
119
121
|
loading != null ? loading : loading = isLoading;
|
120
122
|
const disabled = loading || rest.disabled || rest.readOnly;
|
121
123
|
const [
|
@@ -172,6 +174,7 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
|
|
172
174
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
173
175
|
import_core.ui.div,
|
174
176
|
{
|
177
|
+
id: labelledbyId,
|
175
178
|
className: (0, import_utils.cx)("ui-dropzone", className),
|
176
179
|
__css: css,
|
177
180
|
...formControlProps,
|
@@ -189,6 +192,7 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
|
|
189
192
|
id,
|
190
193
|
ref,
|
191
194
|
name,
|
195
|
+
"aria-labelledby": labelledbyId,
|
192
196
|
"aria-readonly": ariaReadOnly,
|
193
197
|
...formControlProps,
|
194
198
|
...getInputProps()
|
package/dist/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/accept-types.ts","../src/dropzone.tsx"],"sourcesContent":["export * from \"./accept-types\"\nexport {\n Dropzone,\n DropzoneAccept,\n DropzoneIdle,\n DropzoneReject,\n} from \"./dropzone\"\nexport type { DropzoneProps } from \"./dropzone\"\nexport type {\n DropEvent,\n ErrorCode,\n FileError,\n FileRejection,\n} from \"react-dropzone-esm\"\n","export const ACCEPT_TYPES = {\n csv: \"text/csv\",\n doc: \"application/msword\",\n docx: \"application/vnd.openxmlformats-officedocument.wordprocessingml.document\",\n exe: \"application/vnd.microsoft.portable-executable\",\n gif: \"image/gif\",\n html: \"text/html\",\n jpeg: \"image/jpeg\",\n mp3: \"audio/mpeg\",\n mp4: \"video/mp4\",\n mpeg: \"video/mpeg\",\n pdf: \"application/pdf\",\n png: \"image/png\",\n ppt: \"application/vnd.ms-powerpoint\",\n pptx: \"application/vnd.openxmlformats-officedocument.presentationml.presentation\",\n svg: \"image/svg+xml\",\n txt: \"text/plain\",\n webp: \"image/webp\",\n xls: \"application/vnd.ms-excel\",\n xlsx: \"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet\",\n zip: \"application/zip\",\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","import type {\n ColorModeToken,\n CSS,\n CSSUIObject,\n FC,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport type { FadeProps } from \"@yamada-ui/transitions\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport type { ForwardedRef, PropsWithChildren } from \"react\"\nimport type {\n Accept,\n DropzoneOptions as ReactDropzoneOptions,\n} from \"react-dropzone-esm\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { Loading } from \"@yamada-ui/loading\"\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 { useDropzone } from \"react-dropzone-esm\"\n\ninterface DropzoneContext {\n dragAccept: boolean\n dragIdle: boolean\n dragReject: boolean\n styles: { [key: string]: CSSUIObject | undefined }\n loading?: boolean\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\ninterface DropzoneOptions {\n /**\n * File types to accept.\n */\n accept?: Accept | string[]\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n *\n * @deprecated Use `loading` instead.\n */\n isLoading?: boolean\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n */\n loading?: boolean\n /**\n * Ref to a open function.\n */\n openRef?: ForwardedRef<() => undefined | void>\n /**\n * Props for dropzone loading icon element.\n */\n loadingProps?: LoadingProps\n /**\n * Props for dropzone overlay element.\n */\n overlayProps?: FadeProps\n}\n\nexport interface DropzoneProps\n extends Merge<HTMLUIProps, Omit<ReactDropzoneOptions, \"accept\">>,\n ThemeProps<\"Dropzone\">,\n DropzoneOptions,\n FormControlOptions {}\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] = useComponentMultiStyle(\"Dropzone\", props)\n let {\n id,\n name,\n className,\n accept,\n autoFocus,\n children,\n isLoading,\n loading,\n maxFiles,\n maxSize,\n multiple,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n openRef,\n preventDropOnDocument,\n useFsAccessApi,\n loadingProps,\n overlayProps,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onDrop,\n onDropAccepted,\n onDropRejected,\n onFileDialogCancel,\n onFileDialogOpen,\n ...rest\n } = useFormControlProps(omitThemeProps(mergedProps))\n\n loading ??= isLoading\n\n const disabled = loading || rest.disabled || rest.readOnly\n\n const [\n { \"aria-readonly\": ariaReadOnly, ...formControlProps },\n containerProps,\n ] = splitObject(rest, formControlProperties)\n\n const {\n isDragAccept: dragAccept,\n isDragReject: dragReject,\n open,\n getInputProps,\n getRootProps,\n } = useDropzone({\n accept: isArray(accept)\n ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {})\n : accept,\n autoFocus,\n disabled,\n maxFiles,\n maxSize,\n multiple,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n preventDropOnDocument,\n useFsAccessApi,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onDrop,\n onDropAccepted,\n onDropRejected,\n onFileDialogCancel,\n onFileDialogOpen,\n })\n\n assignRef(openRef, open)\n\n const dragIdle = !dragAccept && !dragReject\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n justifyContent: \"center\",\n position: \"relative\",\n ...styles.container,\n }\n\n return (\n <DropzoneProvider\n value={{\n dragAccept,\n dragIdle,\n dragReject,\n loading,\n styles,\n }}\n >\n <ui.div\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...formControlProps}\n {...containerProps}\n {...getRootProps({})}\n data-accept={dataAttr(dragAccept)}\n data-idle={dataAttr(dragIdle)}\n data-loading={dataAttr(loading)}\n data-reject={dataAttr(dragReject)}\n >\n <DropzoneLoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n\n <ui.input\n id={id}\n ref={ref}\n name={name}\n aria-readonly={ariaReadOnly}\n {...formControlProps}\n {...getInputProps()}\n />\n {children}\n </ui.div>\n </DropzoneProvider>\n )\n})\n\nDropzone.displayName = \"Dropzone\"\nDropzone.__ui__ = \"Dropzone\"\n\ninterface DropzoneLoadingOverlayProps extends FadeProps {\n loadingProps?: LoadingProps\n}\n\nconst DropzoneLoadingOverlay: FC<DropzoneLoadingOverlayProps> = ({\n loadingProps,\n ...rest\n}) => {\n const { loading, styles } = useDropzoneContext()\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n h: \"100%\",\n justifyContent: \"center\",\n left: 0,\n position: \"absolute\",\n top: 0,\n w: \"100%\",\n ...styles.overlay,\n }\n\n return (\n <Fade\n className=\"ui-dropzone__overlay\"\n open={loading}\n unmountOnExit\n __css={css}\n {...rest}\n >\n <Loading\n className=\"ui-dropzone__overlay__loading\"\n fontSize=\"4xl\"\n {...loadingProps}\n />\n </Fade>\n )\n}\n\nDropzoneLoadingOverlay.displayName = \"DropzoneLoadingOverlay\"\nDropzoneLoadingOverlay.__ui__ = \"DropzoneLoadingOverlay\"\n\nexport const DropzoneAccept: FC<PropsWithChildren> = ({ children }) => {\n const { dragAccept } = useDropzoneContext()\n\n return dragAccept ? children : null\n}\n\nDropzoneAccept.displayName = \"DropzoneAccept\"\nDropzoneAccept.__ui__ = \"DropzoneAccept\"\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { dragReject } = useDropzoneContext()\n\n return dragReject ? children : null\n}\n\nDropzoneReject.displayName = \"DropzoneReject\"\nDropzoneReject.__ui__ = \"DropzoneReject\"\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { dragIdle } = useDropzoneContext()\n\n return dragIdle ? children : null\n}\n\nDropzoneIdle.displayName = \"DropzoneIdle\"\nDropzoneIdle.__ui__ = \"DropzoneIdle\"\n"],"mappings":"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","names":[]}
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/accept-types.ts","../src/dropzone.tsx"],"sourcesContent":["export * from \"./accept-types\"\nexport {\n Dropzone,\n DropzoneAccept,\n DropzoneIdle,\n DropzoneReject,\n} from \"./dropzone\"\nexport type { DropzoneProps } from \"./dropzone\"\nexport type {\n DropEvent,\n ErrorCode,\n FileError,\n FileRejection,\n} from \"react-dropzone-esm\"\n","export const ACCEPT_TYPES = {\n csv: \"text/csv\",\n doc: \"application/msword\",\n docx: \"application/vnd.openxmlformats-officedocument.wordprocessingml.document\",\n exe: \"application/vnd.microsoft.portable-executable\",\n gif: \"image/gif\",\n html: \"text/html\",\n jpeg: \"image/jpeg\",\n mp3: \"audio/mpeg\",\n mp4: \"video/mp4\",\n mpeg: \"video/mpeg\",\n pdf: \"application/pdf\",\n png: \"image/png\",\n ppt: \"application/vnd.ms-powerpoint\",\n pptx: \"application/vnd.openxmlformats-officedocument.presentationml.presentation\",\n svg: \"image/svg+xml\",\n txt: \"text/plain\",\n webp: \"image/webp\",\n xls: \"application/vnd.ms-excel\",\n xlsx: \"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet\",\n zip: \"application/zip\",\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","import type {\n ColorModeToken,\n CSS,\n CSSUIObject,\n FC,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport type { FadeProps } from \"@yamada-ui/transitions\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport type { ForwardedRef, PropsWithChildren } from \"react\"\nimport type {\n Accept,\n DropzoneOptions as ReactDropzoneOptions,\n} from \"react-dropzone-esm\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { Loading } from \"@yamada-ui/loading\"\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 { useId } from \"react\"\nimport { useDropzone } from \"react-dropzone-esm\"\n\ninterface DropzoneContext {\n dragAccept: boolean\n dragIdle: boolean\n dragReject: boolean\n styles: { [key: string]: CSSUIObject | undefined }\n loading?: boolean\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\ninterface DropzoneOptions {\n /**\n * File types to accept.\n */\n accept?: Accept | string[]\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n *\n * @deprecated Use `loading` instead.\n */\n isLoading?: boolean\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n */\n loading?: boolean\n /**\n * Ref to a open function.\n */\n openRef?: ForwardedRef<() => undefined | void>\n /**\n * Props for dropzone loading icon element.\n */\n loadingProps?: LoadingProps\n /**\n * Props for dropzone overlay element.\n */\n overlayProps?: FadeProps\n}\n\nexport interface DropzoneProps\n extends Merge<HTMLUIProps, Omit<ReactDropzoneOptions, \"accept\">>,\n ThemeProps<\"Dropzone\">,\n DropzoneOptions,\n FormControlOptions {}\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] = useComponentMultiStyle(\"Dropzone\", props)\n let {\n id,\n name,\n className,\n accept,\n autoFocus,\n children,\n isLoading,\n loading,\n maxFiles,\n maxSize,\n multiple,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n openRef,\n preventDropOnDocument,\n useFsAccessApi,\n loadingProps,\n overlayProps,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onDrop,\n onDropAccepted,\n onDropRejected,\n onFileDialogCancel,\n onFileDialogOpen,\n ...rest\n } = useFormControlProps(omitThemeProps(mergedProps))\n const labelledbyId = useId()\n\n loading ??= isLoading\n\n const disabled = loading || rest.disabled || rest.readOnly\n\n const [\n { \"aria-readonly\": ariaReadOnly, ...formControlProps },\n containerProps,\n ] = splitObject(rest, formControlProperties)\n\n const {\n isDragAccept: dragAccept,\n isDragReject: dragReject,\n open,\n getInputProps,\n getRootProps,\n } = useDropzone({\n accept: isArray(accept)\n ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {})\n : accept,\n autoFocus,\n disabled,\n maxFiles,\n maxSize,\n multiple,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n preventDropOnDocument,\n useFsAccessApi,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onDrop,\n onDropAccepted,\n onDropRejected,\n onFileDialogCancel,\n onFileDialogOpen,\n })\n\n assignRef(openRef, open)\n\n const dragIdle = !dragAccept && !dragReject\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n justifyContent: \"center\",\n position: \"relative\",\n ...styles.container,\n }\n\n return (\n <DropzoneProvider\n value={{\n dragAccept,\n dragIdle,\n dragReject,\n loading,\n styles,\n }}\n >\n <ui.div\n id={labelledbyId}\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...formControlProps}\n {...containerProps}\n {...getRootProps({})}\n data-accept={dataAttr(dragAccept)}\n data-idle={dataAttr(dragIdle)}\n data-loading={dataAttr(loading)}\n data-reject={dataAttr(dragReject)}\n >\n <DropzoneLoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n\n <ui.input\n id={id}\n ref={ref}\n name={name}\n aria-labelledby={labelledbyId}\n aria-readonly={ariaReadOnly}\n {...formControlProps}\n {...getInputProps()}\n />\n {children}\n </ui.div>\n </DropzoneProvider>\n )\n})\n\nDropzone.displayName = \"Dropzone\"\nDropzone.__ui__ = \"Dropzone\"\n\ninterface DropzoneLoadingOverlayProps extends FadeProps {\n loadingProps?: LoadingProps\n}\n\nconst DropzoneLoadingOverlay: FC<DropzoneLoadingOverlayProps> = ({\n loadingProps,\n ...rest\n}) => {\n const { loading, styles } = useDropzoneContext()\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n h: \"100%\",\n justifyContent: \"center\",\n left: 0,\n position: \"absolute\",\n top: 0,\n w: \"100%\",\n ...styles.overlay,\n }\n\n return (\n <Fade\n className=\"ui-dropzone__overlay\"\n open={loading}\n unmountOnExit\n __css={css}\n {...rest}\n >\n <Loading\n className=\"ui-dropzone__overlay__loading\"\n fontSize=\"4xl\"\n {...loadingProps}\n />\n </Fade>\n )\n}\n\nDropzoneLoadingOverlay.displayName = \"DropzoneLoadingOverlay\"\nDropzoneLoadingOverlay.__ui__ = \"DropzoneLoadingOverlay\"\n\nexport const DropzoneAccept: FC<PropsWithChildren> = ({ children }) => {\n const { dragAccept } = useDropzoneContext()\n\n return dragAccept ? children : null\n}\n\nDropzoneAccept.displayName = \"DropzoneAccept\"\nDropzoneAccept.__ui__ = \"DropzoneAccept\"\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { dragReject } = useDropzoneContext()\n\n return dragReject ? children : null\n}\n\nDropzoneReject.displayName = \"DropzoneReject\"\nDropzoneReject.__ui__ = \"DropzoneReject\"\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { dragIdle } = useDropzoneContext()\n\n return dragIdle ? children : null\n}\n\nDropzoneIdle.displayName = \"DropzoneIdle\"\nDropzoneIdle.__ui__ = \"DropzoneIdle\"\n"],"mappings":"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","names":[]}
|
package/dist/index.mjs
CHANGED
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@yamada-ui/dropzone",
|
3
|
-
"version": "1.0
|
3
|
+
"version": "1.1.0-dev-20241124060937",
|
4
4
|
"description": "Yamada UI dropzone component",
|
5
5
|
"keywords": [
|
6
6
|
"yamada",
|
@@ -37,10 +37,10 @@
|
|
37
37
|
},
|
38
38
|
"dependencies": {
|
39
39
|
"react-dropzone-esm": "^15.0.1",
|
40
|
-
"@yamada-ui/core": "1.15.6-dev-
|
41
|
-
"@yamada-ui/form-control": "2.1.8-dev-
|
42
|
-
"@yamada-ui/loading": "1.1.25-dev-
|
43
|
-
"@yamada-ui/transitions": "1.1.12-dev-
|
40
|
+
"@yamada-ui/core": "1.15.6-dev-20241124060937",
|
41
|
+
"@yamada-ui/form-control": "2.1.8-dev-20241124060937",
|
42
|
+
"@yamada-ui/loading": "1.1.25-dev-20241124060937",
|
43
|
+
"@yamada-ui/transitions": "1.1.12-dev-20241124060937",
|
44
44
|
"@yamada-ui/utils": "1.5.4"
|
45
45
|
},
|
46
46
|
"devDependencies": {
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"sources":["../src/dropzone.tsx"],"sourcesContent":["import type {\n ColorModeToken,\n CSS,\n CSSUIObject,\n FC,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport type { FadeProps } from \"@yamada-ui/transitions\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport type { ForwardedRef, PropsWithChildren } from \"react\"\nimport type {\n Accept,\n DropzoneOptions as ReactDropzoneOptions,\n} from \"react-dropzone-esm\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { Loading } from \"@yamada-ui/loading\"\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 { useDropzone } from \"react-dropzone-esm\"\n\ninterface DropzoneContext {\n dragAccept: boolean\n dragIdle: boolean\n dragReject: boolean\n styles: { [key: string]: CSSUIObject | undefined }\n loading?: boolean\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\ninterface DropzoneOptions {\n /**\n * File types to accept.\n */\n accept?: Accept | string[]\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n *\n * @deprecated Use `loading` instead.\n */\n isLoading?: boolean\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n */\n loading?: boolean\n /**\n * Ref to a open function.\n */\n openRef?: ForwardedRef<() => undefined | void>\n /**\n * Props for dropzone loading icon element.\n */\n loadingProps?: LoadingProps\n /**\n * Props for dropzone overlay element.\n */\n overlayProps?: FadeProps\n}\n\nexport interface DropzoneProps\n extends Merge<HTMLUIProps, Omit<ReactDropzoneOptions, \"accept\">>,\n ThemeProps<\"Dropzone\">,\n DropzoneOptions,\n FormControlOptions {}\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] = useComponentMultiStyle(\"Dropzone\", props)\n let {\n id,\n name,\n className,\n accept,\n autoFocus,\n children,\n isLoading,\n loading,\n maxFiles,\n maxSize,\n multiple,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n openRef,\n preventDropOnDocument,\n useFsAccessApi,\n loadingProps,\n overlayProps,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onDrop,\n onDropAccepted,\n onDropRejected,\n onFileDialogCancel,\n onFileDialogOpen,\n ...rest\n } = useFormControlProps(omitThemeProps(mergedProps))\n\n loading ??= isLoading\n\n const disabled = loading || rest.disabled || rest.readOnly\n\n const [\n { \"aria-readonly\": ariaReadOnly, ...formControlProps },\n containerProps,\n ] = splitObject(rest, formControlProperties)\n\n const {\n isDragAccept: dragAccept,\n isDragReject: dragReject,\n open,\n getInputProps,\n getRootProps,\n } = useDropzone({\n accept: isArray(accept)\n ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {})\n : accept,\n autoFocus,\n disabled,\n maxFiles,\n maxSize,\n multiple,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n preventDropOnDocument,\n useFsAccessApi,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onDrop,\n onDropAccepted,\n onDropRejected,\n onFileDialogCancel,\n onFileDialogOpen,\n })\n\n assignRef(openRef, open)\n\n const dragIdle = !dragAccept && !dragReject\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n justifyContent: \"center\",\n position: \"relative\",\n ...styles.container,\n }\n\n return (\n <DropzoneProvider\n value={{\n dragAccept,\n dragIdle,\n dragReject,\n loading,\n styles,\n }}\n >\n <ui.div\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...formControlProps}\n {...containerProps}\n {...getRootProps({})}\n data-accept={dataAttr(dragAccept)}\n data-idle={dataAttr(dragIdle)}\n data-loading={dataAttr(loading)}\n data-reject={dataAttr(dragReject)}\n >\n <DropzoneLoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n\n <ui.input\n id={id}\n ref={ref}\n name={name}\n aria-readonly={ariaReadOnly}\n {...formControlProps}\n {...getInputProps()}\n />\n {children}\n </ui.div>\n </DropzoneProvider>\n )\n})\n\nDropzone.displayName = \"Dropzone\"\nDropzone.__ui__ = \"Dropzone\"\n\ninterface DropzoneLoadingOverlayProps extends FadeProps {\n loadingProps?: LoadingProps\n}\n\nconst DropzoneLoadingOverlay: FC<DropzoneLoadingOverlayProps> = ({\n loadingProps,\n ...rest\n}) => {\n const { loading, styles } = useDropzoneContext()\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n h: \"100%\",\n justifyContent: \"center\",\n left: 0,\n position: \"absolute\",\n top: 0,\n w: \"100%\",\n ...styles.overlay,\n }\n\n return (\n <Fade\n className=\"ui-dropzone__overlay\"\n open={loading}\n unmountOnExit\n __css={css}\n {...rest}\n >\n <Loading\n className=\"ui-dropzone__overlay__loading\"\n fontSize=\"4xl\"\n {...loadingProps}\n />\n </Fade>\n )\n}\n\nDropzoneLoadingOverlay.displayName = \"DropzoneLoadingOverlay\"\nDropzoneLoadingOverlay.__ui__ = \"DropzoneLoadingOverlay\"\n\nexport const DropzoneAccept: FC<PropsWithChildren> = ({ children }) => {\n const { dragAccept } = useDropzoneContext()\n\n return dragAccept ? children : null\n}\n\nDropzoneAccept.displayName = \"DropzoneAccept\"\nDropzoneAccept.__ui__ = \"DropzoneAccept\"\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { dragReject } = useDropzoneContext()\n\n return dragReject ? children : null\n}\n\nDropzoneReject.displayName = \"DropzoneReject\"\nDropzoneReject.__ui__ = \"DropzoneReject\"\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { dragIdle } = useDropzoneContext()\n\n return dragIdle ? children : null\n}\n\nDropzoneIdle.displayName = \"DropzoneIdle\"\nDropzoneIdle.__ui__ = \"DropzoneIdle\"\n"],"mappings":"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","names":[]}
|