@yamada-ui/dropzone 0.2.7 → 0.2.9
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-VKPIH4R6.mjs → chunk-7WHLAO5H.mjs} +53 -19
- package/dist/dropzone.js +42 -17
- package/dist/dropzone.mjs +1 -1
- package/dist/index.js +42 -17
- package/dist/index.mjs +1 -1
- package/package.json +6 -6
|
@@ -11,9 +11,18 @@ import {
|
|
|
11
11
|
} from "@yamada-ui/form-control";
|
|
12
12
|
import { Loading } from "@yamada-ui/loading";
|
|
13
13
|
import { Fade } from "@yamada-ui/transitions";
|
|
14
|
-
import {
|
|
14
|
+
import {
|
|
15
|
+
assignRef,
|
|
16
|
+
createContext,
|
|
17
|
+
cx,
|
|
18
|
+
dataAttr,
|
|
19
|
+
isArray,
|
|
20
|
+
pickObject
|
|
21
|
+
} from "@yamada-ui/utils";
|
|
15
22
|
import { Fragment } from "react";
|
|
16
|
-
import {
|
|
23
|
+
import {
|
|
24
|
+
useDropzone
|
|
25
|
+
} from "react-dropzone";
|
|
17
26
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
18
27
|
var [DropzoneProvider, useDropzoneContext] = createContext({
|
|
19
28
|
name: "NativeSelectContext",
|
|
@@ -84,24 +93,39 @@ var Dropzone = forwardRef((props, ref) => {
|
|
|
84
93
|
alignItems: "center",
|
|
85
94
|
...styles.container
|
|
86
95
|
};
|
|
87
|
-
return /* @__PURE__ */ jsx(
|
|
88
|
-
|
|
96
|
+
return /* @__PURE__ */ jsx(
|
|
97
|
+
DropzoneProvider,
|
|
89
98
|
{
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
99
|
+
value: { isLoading, isDragAccept, isDragReject, isDragIdle, styles },
|
|
100
|
+
children: /* @__PURE__ */ jsxs(
|
|
101
|
+
ui.div,
|
|
102
|
+
{
|
|
103
|
+
className: cx("ui-dropzone", className),
|
|
104
|
+
__css: css,
|
|
105
|
+
...rest,
|
|
106
|
+
...getRootProps(),
|
|
107
|
+
"data-accept": dataAttr(isDragAccept),
|
|
108
|
+
"data-reject": dataAttr(isDragReject),
|
|
109
|
+
"data-idle": dataAttr(isDragIdle),
|
|
110
|
+
"data-loading": dataAttr(isLoading),
|
|
111
|
+
children: [
|
|
112
|
+
/* @__PURE__ */ jsx(LoadingOverlay, { loadingProps, ...overlayProps }),
|
|
113
|
+
/* @__PURE__ */ jsx(
|
|
114
|
+
ui.input,
|
|
115
|
+
{
|
|
116
|
+
ref,
|
|
117
|
+
id,
|
|
118
|
+
name,
|
|
119
|
+
...formControlProps,
|
|
120
|
+
...getInputProps()
|
|
121
|
+
}
|
|
122
|
+
),
|
|
123
|
+
children
|
|
124
|
+
]
|
|
125
|
+
}
|
|
126
|
+
)
|
|
103
127
|
}
|
|
104
|
-
)
|
|
128
|
+
);
|
|
105
129
|
});
|
|
106
130
|
var LoadingOverlay = ({ loadingProps, ...rest }) => {
|
|
107
131
|
const { isLoading, styles } = useDropzoneContext();
|
|
@@ -116,7 +140,17 @@ var LoadingOverlay = ({ loadingProps, ...rest }) => {
|
|
|
116
140
|
alignItems: "center",
|
|
117
141
|
...styles.overlay
|
|
118
142
|
};
|
|
119
|
-
return /* @__PURE__ */ jsx(
|
|
143
|
+
return /* @__PURE__ */ jsx(
|
|
144
|
+
Fade,
|
|
145
|
+
{
|
|
146
|
+
isOpen: isLoading,
|
|
147
|
+
unmountOnExit: true,
|
|
148
|
+
className: "ui-dropzone-overlay",
|
|
149
|
+
__css: css,
|
|
150
|
+
...rest,
|
|
151
|
+
children: /* @__PURE__ */ jsx(Loading, { className: "ui-dropzone-loading", size: "4xl", ...loadingProps })
|
|
152
|
+
}
|
|
153
|
+
);
|
|
120
154
|
};
|
|
121
155
|
var DropzoneAccept = ({ children }) => {
|
|
122
156
|
const { isDragAccept } = useDropzoneContext();
|
package/dist/dropzone.js
CHANGED
|
@@ -103,24 +103,39 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
|
|
|
103
103
|
alignItems: "center",
|
|
104
104
|
...styles.container
|
|
105
105
|
};
|
|
106
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
107
|
-
|
|
106
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
107
|
+
DropzoneProvider,
|
|
108
108
|
{
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
109
|
+
value: { isLoading, isDragAccept, isDragReject, isDragIdle, styles },
|
|
110
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
111
|
+
import_core.ui.div,
|
|
112
|
+
{
|
|
113
|
+
className: (0, import_utils.cx)("ui-dropzone", className),
|
|
114
|
+
__css: css,
|
|
115
|
+
...rest,
|
|
116
|
+
...getRootProps(),
|
|
117
|
+
"data-accept": (0, import_utils.dataAttr)(isDragAccept),
|
|
118
|
+
"data-reject": (0, import_utils.dataAttr)(isDragReject),
|
|
119
|
+
"data-idle": (0, import_utils.dataAttr)(isDragIdle),
|
|
120
|
+
"data-loading": (0, import_utils.dataAttr)(isLoading),
|
|
121
|
+
children: [
|
|
122
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(LoadingOverlay, { loadingProps, ...overlayProps }),
|
|
123
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
124
|
+
import_core.ui.input,
|
|
125
|
+
{
|
|
126
|
+
ref,
|
|
127
|
+
id,
|
|
128
|
+
name,
|
|
129
|
+
...formControlProps,
|
|
130
|
+
...getInputProps()
|
|
131
|
+
}
|
|
132
|
+
),
|
|
133
|
+
children
|
|
134
|
+
]
|
|
135
|
+
}
|
|
136
|
+
)
|
|
122
137
|
}
|
|
123
|
-
)
|
|
138
|
+
);
|
|
124
139
|
});
|
|
125
140
|
var LoadingOverlay = ({ loadingProps, ...rest }) => {
|
|
126
141
|
const { isLoading, styles } = useDropzoneContext();
|
|
@@ -135,7 +150,17 @@ var LoadingOverlay = ({ loadingProps, ...rest }) => {
|
|
|
135
150
|
alignItems: "center",
|
|
136
151
|
...styles.overlay
|
|
137
152
|
};
|
|
138
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
153
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
154
|
+
import_transitions.Fade,
|
|
155
|
+
{
|
|
156
|
+
isOpen: isLoading,
|
|
157
|
+
unmountOnExit: true,
|
|
158
|
+
className: "ui-dropzone-overlay",
|
|
159
|
+
__css: css,
|
|
160
|
+
...rest,
|
|
161
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_loading.Loading, { className: "ui-dropzone-loading", size: "4xl", ...loadingProps })
|
|
162
|
+
}
|
|
163
|
+
);
|
|
139
164
|
};
|
|
140
165
|
var DropzoneAccept = ({ children }) => {
|
|
141
166
|
const { isDragAccept } = useDropzoneContext();
|
package/dist/dropzone.mjs
CHANGED
package/dist/index.js
CHANGED
|
@@ -112,24 +112,39 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
|
|
|
112
112
|
alignItems: "center",
|
|
113
113
|
...styles.container
|
|
114
114
|
};
|
|
115
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
116
|
-
|
|
115
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
116
|
+
DropzoneProvider,
|
|
117
117
|
{
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
118
|
+
value: { isLoading, isDragAccept, isDragReject, isDragIdle, styles },
|
|
119
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
120
|
+
import_core.ui.div,
|
|
121
|
+
{
|
|
122
|
+
className: (0, import_utils.cx)("ui-dropzone", className),
|
|
123
|
+
__css: css,
|
|
124
|
+
...rest,
|
|
125
|
+
...getRootProps(),
|
|
126
|
+
"data-accept": (0, import_utils.dataAttr)(isDragAccept),
|
|
127
|
+
"data-reject": (0, import_utils.dataAttr)(isDragReject),
|
|
128
|
+
"data-idle": (0, import_utils.dataAttr)(isDragIdle),
|
|
129
|
+
"data-loading": (0, import_utils.dataAttr)(isLoading),
|
|
130
|
+
children: [
|
|
131
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(LoadingOverlay, { loadingProps, ...overlayProps }),
|
|
132
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
133
|
+
import_core.ui.input,
|
|
134
|
+
{
|
|
135
|
+
ref,
|
|
136
|
+
id,
|
|
137
|
+
name,
|
|
138
|
+
...formControlProps,
|
|
139
|
+
...getInputProps()
|
|
140
|
+
}
|
|
141
|
+
),
|
|
142
|
+
children
|
|
143
|
+
]
|
|
144
|
+
}
|
|
145
|
+
)
|
|
131
146
|
}
|
|
132
|
-
)
|
|
147
|
+
);
|
|
133
148
|
});
|
|
134
149
|
var LoadingOverlay = ({ loadingProps, ...rest }) => {
|
|
135
150
|
const { isLoading, styles } = useDropzoneContext();
|
|
@@ -144,7 +159,17 @@ var LoadingOverlay = ({ loadingProps, ...rest }) => {
|
|
|
144
159
|
alignItems: "center",
|
|
145
160
|
...styles.overlay
|
|
146
161
|
};
|
|
147
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
162
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
163
|
+
import_transitions.Fade,
|
|
164
|
+
{
|
|
165
|
+
isOpen: isLoading,
|
|
166
|
+
unmountOnExit: true,
|
|
167
|
+
className: "ui-dropzone-overlay",
|
|
168
|
+
__css: css,
|
|
169
|
+
...rest,
|
|
170
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_loading.Loading, { className: "ui-dropzone-loading", size: "4xl", ...loadingProps })
|
|
171
|
+
}
|
|
172
|
+
);
|
|
148
173
|
};
|
|
149
174
|
var DropzoneAccept = ({ children }) => {
|
|
150
175
|
const { isDragAccept } = useDropzoneContext();
|
package/dist/index.mjs
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@yamada-ui/dropzone",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.9",
|
|
4
4
|
"description": "Yamada UI dropzone component",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"yamada",
|
|
@@ -36,11 +36,11 @@
|
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
38
|
"react-dropzone": "14.2.3",
|
|
39
|
-
"@yamada-ui/core": "0.5.
|
|
40
|
-
"@yamada-ui/utils": "0.1.
|
|
41
|
-
"@yamada-ui/form-control": "0.2.
|
|
42
|
-
"@yamada-ui/transitions": "0.2.
|
|
43
|
-
"@yamada-ui/loading": "0.3.
|
|
39
|
+
"@yamada-ui/core": "0.5.3",
|
|
40
|
+
"@yamada-ui/utils": "0.1.4",
|
|
41
|
+
"@yamada-ui/form-control": "0.2.8",
|
|
42
|
+
"@yamada-ui/transitions": "0.2.9",
|
|
43
|
+
"@yamada-ui/loading": "0.3.8"
|
|
44
44
|
},
|
|
45
45
|
"devDependencies": {
|
|
46
46
|
"react": "^18.0.0",
|