@yamada-ui/dropzone 1.0.53-dev-20241124042929 → 1.1.0-dev-20241124060937
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.
- 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":[]}
|