@yamada-ui/dropzone 1.0.46-next-20241005220055 → 1.0.46-next-20241008193728

Sign up to get free protection for your applications and to get access to all the features.
Files changed (22) hide show
  1. package/dist/accept-types.d.mts +13 -13
  2. package/dist/accept-types.d.ts +13 -13
  3. package/dist/accept-types.js +12 -12
  4. package/dist/accept-types.js.map +1 -1
  5. package/dist/accept-types.mjs +1 -1
  6. package/dist/{chunk-CIOUYT32.mjs → chunk-3DTTC4QM.mjs} +13 -13
  7. package/dist/chunk-3DTTC4QM.mjs.map +1 -0
  8. package/dist/{chunk-DRLF3PX5.mjs → chunk-3QSKWUOX.mjs} +47 -45
  9. package/dist/chunk-3QSKWUOX.mjs.map +1 -0
  10. package/dist/dropzone.d.mts +10 -10
  11. package/dist/dropzone.d.ts +10 -10
  12. package/dist/dropzone.js +45 -43
  13. package/dist/dropzone.js.map +1 -1
  14. package/dist/dropzone.mjs +1 -1
  15. package/dist/index.d.mts +1 -1
  16. package/dist/index.d.ts +1 -1
  17. package/dist/index.js +81 -79
  18. package/dist/index.js.map +1 -1
  19. package/dist/index.mjs +2 -2
  20. package/package.json +6 -6
  21. package/dist/chunk-CIOUYT32.mjs.map +0 -1
  22. package/dist/chunk-DRLF3PX5.mjs.map +0 -1
package/dist/accept-types.d.mts CHANGED
@@ -1,26 +1,26 @@
1
1
  declare const ACCEPT_TYPES: {
2
- readonly txt: "text/plain";
3
- readonly html: "text/html";
4
2
  readonly csv: "text/csv";
5
- readonly png: "image/png";
3
+ readonly doc: "application/msword";
4
+ readonly docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document";
5
+ readonly exe: "application/vnd.microsoft.portable-executable";
6
6
  readonly gif: "image/gif";
7
+ readonly html: "text/html";
7
8
  readonly jpeg: "image/jpeg";
8
- readonly svg: "image/svg+xml";
9
- readonly webp: "image/webp";
10
9
  readonly mp3: "audio/mpeg";
11
- readonly mpeg: "video/mpeg";
12
10
  readonly mp4: "video/mp4";
13
- readonly zip: "application/zip";
11
+ readonly mpeg: "video/mpeg";
14
12
  readonly pdf: "application/pdf";
15
- readonly doc: "application/msword";
16
- readonly docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document";
17
- readonly xls: "application/vnd.ms-excel";
18
- readonly xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
13
+ readonly png: "image/png";
19
14
  readonly ppt: "application/vnd.ms-powerpoint";
20
15
  readonly pptx: "application/vnd.openxmlformats-officedocument.presentationml.presentation";
21
- readonly exe: "application/vnd.microsoft.portable-executable";
16
+ readonly svg: "image/svg+xml";
17
+ readonly txt: "text/plain";
18
+ readonly webp: "image/webp";
19
+ readonly xls: "application/vnd.ms-excel";
20
+ readonly xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
21
+ readonly zip: "application/zip";
22
22
  };
23
- declare const IMAGE_ACCEPT_TYPE: ("image/png" | "image/gif" | "image/jpeg" | "image/svg+xml" | "image/webp")[];
23
+ declare const IMAGE_ACCEPT_TYPE: ("image/gif" | "image/jpeg" | "image/png" | "image/svg+xml" | "image/webp")[];
24
24
  declare const PDF_ACCEPT_TYPE: "application/pdf"[];
25
25
  declare const MS_WORD_ACCEPT_TYPE: ("application/msword" | "application/vnd.openxmlformats-officedocument.wordprocessingml.document")[];
26
26
  declare const MS_EXCEL_ACCEPT_TYPE: ("application/vnd.ms-excel" | "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet")[];
package/dist/accept-types.d.ts CHANGED
@@ -1,26 +1,26 @@
1
1
  declare const ACCEPT_TYPES: {
2
- readonly txt: "text/plain";
3
- readonly html: "text/html";
4
2
  readonly csv: "text/csv";
5
- readonly png: "image/png";
3
+ readonly doc: "application/msword";
4
+ readonly docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document";
5
+ readonly exe: "application/vnd.microsoft.portable-executable";
6
6
  readonly gif: "image/gif";
7
+ readonly html: "text/html";
7
8
  readonly jpeg: "image/jpeg";
8
- readonly svg: "image/svg+xml";
9
- readonly webp: "image/webp";
10
9
  readonly mp3: "audio/mpeg";
11
- readonly mpeg: "video/mpeg";
12
10
  readonly mp4: "video/mp4";
13
- readonly zip: "application/zip";
11
+ readonly mpeg: "video/mpeg";
14
12
  readonly pdf: "application/pdf";
15
- readonly doc: "application/msword";
16
- readonly docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document";
17
- readonly xls: "application/vnd.ms-excel";
18
- readonly xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
13
+ readonly png: "image/png";
19
14
  readonly ppt: "application/vnd.ms-powerpoint";
20
15
  readonly pptx: "application/vnd.openxmlformats-officedocument.presentationml.presentation";
21
- readonly exe: "application/vnd.microsoft.portable-executable";
16
+ readonly svg: "image/svg+xml";
17
+ readonly txt: "text/plain";
18
+ readonly webp: "image/webp";
19
+ readonly xls: "application/vnd.ms-excel";
20
+ readonly xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
21
+ readonly zip: "application/zip";
22
22
  };
23
- declare const IMAGE_ACCEPT_TYPE: ("image/png" | "image/gif" | "image/jpeg" | "image/svg+xml" | "image/webp")[];
23
+ declare const IMAGE_ACCEPT_TYPE: ("image/gif" | "image/jpeg" | "image/png" | "image/svg+xml" | "image/webp")[];
24
24
  declare const PDF_ACCEPT_TYPE: "application/pdf"[];
25
25
  declare const MS_WORD_ACCEPT_TYPE: ("application/msword" | "application/vnd.openxmlformats-officedocument.wordprocessingml.document")[];
26
26
  declare const MS_EXCEL_ACCEPT_TYPE: ("application/vnd.ms-excel" | "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet")[];
package/dist/accept-types.js CHANGED
@@ -31,26 +31,26 @@ __export(accept_types_exports, {
31
31
  });
32
32
  module.exports = __toCommonJS(accept_types_exports);
33
33
  var ACCEPT_TYPES = {
34
- txt: "text/plain",
35
- html: "text/html",
36
34
  csv: "text/csv",
37
- png: "image/png",
35
+ doc: "application/msword",
36
+ docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
37
+ exe: "application/vnd.microsoft.portable-executable",
38
38
  gif: "image/gif",
39
+ html: "text/html",
39
40
  jpeg: "image/jpeg",
40
- svg: "image/svg+xml",
41
- webp: "image/webp",
42
41
  mp3: "audio/mpeg",
43
- mpeg: "video/mpeg",
44
42
  mp4: "video/mp4",
45
- zip: "application/zip",
43
+ mpeg: "video/mpeg",
46
44
  pdf: "application/pdf",
47
- doc: "application/msword",
48
- docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
49
- xls: "application/vnd.ms-excel",
50
- xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
45
+ png: "image/png",
51
46
  ppt: "application/vnd.ms-powerpoint",
52
47
  pptx: "application/vnd.openxmlformats-officedocument.presentationml.presentation",
53
- exe: "application/vnd.microsoft.portable-executable"
48
+ svg: "image/svg+xml",
49
+ txt: "text/plain",
50
+ webp: "image/webp",
51
+ xls: "application/vnd.ms-excel",
52
+ xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
53
+ zip: "application/zip"
54
54
  };
55
55
  var IMAGE_ACCEPT_TYPE = [
56
56
  ACCEPT_TYPES.png,
package/dist/accept-types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/accept-types.ts"],"sourcesContent":["export const ACCEPT_TYPES = {\n txt: \"text/plain\",\n html: \"text/html\",\n csv: \"text/csv\",\n png: \"image/png\",\n gif: \"image/gif\",\n jpeg: \"image/jpeg\",\n svg: \"image/svg+xml\",\n webp: \"image/webp\",\n mp3: \"audio/mpeg\",\n mpeg: \"video/mpeg\",\n mp4: \"video/mp4\",\n zip: \"application/zip\",\n pdf: \"application/pdf\",\n doc: \"application/msword\",\n docx: \"application/vnd.openxmlformats-officedocument.wordprocessingml.document\",\n xls: \"application/vnd.ms-excel\",\n xlsx: \"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet\",\n ppt: \"application/vnd.ms-powerpoint\",\n pptx: \"application/vnd.openxmlformats-officedocument.presentationml.presentation\",\n exe: \"application/vnd.microsoft.portable-executable\",\n} as const\n\nexport const IMAGE_ACCEPT_TYPE = [\n ACCEPT_TYPES.png,\n ACCEPT_TYPES.gif,\n ACCEPT_TYPES.jpeg,\n ACCEPT_TYPES.svg,\n ACCEPT_TYPES.webp,\n]\nexport const PDF_ACCEPT_TYPE = [ACCEPT_TYPES.pdf]\nexport const MS_WORD_ACCEPT_TYPE = [ACCEPT_TYPES.doc, ACCEPT_TYPES.docx]\nexport const MS_EXCEL_ACCEPT_TYPE = [ACCEPT_TYPES.xls, ACCEPT_TYPES.xlsx]\nexport const MS_POWER_POINT_ACCEPT_TYPE = [ACCEPT_TYPES.ppt, ACCEPT_TYPES.pptx]\nexport const EXE_ACCEPT_TYPE = [ACCEPT_TYPES.exe]\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAO,IAAM,eAAe;AAAA,EAC1B,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AACP;AAEO,IAAM,oBAAoB;AAAA,EAC/B,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AACf;AACO,IAAM,kBAAkB,CAAC,aAAa,GAAG;AACzC,IAAM,sBAAsB,CAAC,aAAa,KAAK,aAAa,IAAI;AAChE,IAAM,uBAAuB,CAAC,aAAa,KAAK,aAAa,IAAI;AACjE,IAAM,6BAA6B,CAAC,aAAa,KAAK,aAAa,IAAI;AACvE,IAAM,kBAAkB,CAAC,aAAa,GAAG;","names":[]}
1
+ {"version":3,"sources":["../src/accept-types.ts"],"sourcesContent":["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"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAO,IAAM,eAAe;AAAA,EAC1B,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AACP;AAEO,IAAM,oBAAoB;AAAA,EAC/B,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AACf;AACO,IAAM,kBAAkB,CAAC,aAAa,GAAG;AACzC,IAAM,sBAAsB,CAAC,aAAa,KAAK,aAAa,IAAI;AAChE,IAAM,uBAAuB,CAAC,aAAa,KAAK,aAAa,IAAI;AACjE,IAAM,6BAA6B,CAAC,aAAa,KAAK,aAAa,IAAI;AACvE,IAAM,kBAAkB,CAAC,aAAa,GAAG;","names":[]}
package/dist/accept-types.mjs CHANGED
@@ -7,7 +7,7 @@ import {
7
7
  MS_POWER_POINT_ACCEPT_TYPE,
8
8
  MS_WORD_ACCEPT_TYPE,
9
9
  PDF_ACCEPT_TYPE
10
- } from "./chunk-CIOUYT32.mjs";
10
+ } from "./chunk-3DTTC4QM.mjs";
11
11
  export {
12
12
  ACCEPT_TYPES,
13
13
  EXE_ACCEPT_TYPE,
package/dist/{chunk-CIOUYT32.mjs → chunk-3DTTC4QM.mjs} RENAMED
@@ -2,26 +2,26 @@
2
2
 
3
3
  // src/accept-types.ts
4
4
  var ACCEPT_TYPES = {
5
- txt: "text/plain",
6
- html: "text/html",
7
5
  csv: "text/csv",
8
- png: "image/png",
6
+ doc: "application/msword",
7
+ docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
8
+ exe: "application/vnd.microsoft.portable-executable",
9
9
  gif: "image/gif",
10
+ html: "text/html",
10
11
  jpeg: "image/jpeg",
11
- svg: "image/svg+xml",
12
- webp: "image/webp",
13
12
  mp3: "audio/mpeg",
14
- mpeg: "video/mpeg",
15
13
  mp4: "video/mp4",
16
- zip: "application/zip",
14
+ mpeg: "video/mpeg",
17
15
  pdf: "application/pdf",
18
- doc: "application/msword",
19
- docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
20
- xls: "application/vnd.ms-excel",
21
- xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
16
+ png: "image/png",
22
17
  ppt: "application/vnd.ms-powerpoint",
23
18
  pptx: "application/vnd.openxmlformats-officedocument.presentationml.presentation",
24
- exe: "application/vnd.microsoft.portable-executable"
19
+ svg: "image/svg+xml",
20
+ txt: "text/plain",
21
+ webp: "image/webp",
22
+ xls: "application/vnd.ms-excel",
23
+ xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
24
+ zip: "application/zip"
25
25
  };
26
26
  var IMAGE_ACCEPT_TYPE = [
27
27
  ACCEPT_TYPES.png,
@@ -45,4 +45,4 @@ export {
45
45
  MS_POWER_POINT_ACCEPT_TYPE,
46
46
  EXE_ACCEPT_TYPE
47
47
  };
48
- //# sourceMappingURL=chunk-CIOUYT32.mjs.map
48
+ //# sourceMappingURL=chunk-3DTTC4QM.mjs.map
package/dist/chunk-3DTTC4QM.mjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/accept-types.ts"],"sourcesContent":["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"],"mappings":";;;AAAO,IAAM,eAAe;AAAA,EAC1B,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AACP;AAEO,IAAM,oBAAoB;AAAA,EAC/B,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AACf;AACO,IAAM,kBAAkB,CAAC,aAAa,GAAG;AACzC,IAAM,sBAAsB,CAAC,aAAa,KAAK,aAAa,IAAI;AAChE,IAAM,uBAAuB,CAAC,aAAa,KAAK,aAAa,IAAI;AACjE,IAAM,6BAA6B,CAAC,aAAa,KAAK,aAAa,IAAI;AACvE,IAAM,kBAAkB,CAAC,aAAa,GAAG;","names":[]}
package/dist/{chunk-DRLF3PX5.mjs → chunk-3QSKWUOX.mjs} RENAMED
@@ -2,9 +2,9 @@
2
2
 
3
3
  // src/dropzone.tsx
4
4
  import {
5
- ui,
6
5
  forwardRef,
7
6
  omitThemeProps,
7
+ ui,
8
8
  useComponentMultiStyle
9
9
  } from "@yamada-ui/core";
10
10
  import {
@@ -21,7 +21,6 @@ import {
21
21
  isArray,
22
22
  splitObject
23
23
  } from "@yamada-ui/utils";
24
- import { Fragment } from "react";
25
24
  import { useDropzone } from "react-dropzone-esm";
26
25
  import { jsx, jsxs } from "react/jsx-runtime";
27
26
  var [DropzoneProvider, useDropzoneContext] = createContext({
@@ -34,30 +33,30 @@ var Dropzone = forwardRef((props, ref) => {
34
33
  id,
35
34
  name,
36
35
  className,
37
- isLoading,
38
- overlayProps,
39
- loadingProps,
40
- openRef,
41
36
  accept,
42
- onDrop,
43
- onDropAccepted,
44
- onDropRejected,
45
- multiple,
46
- maxSize,
47
- maxFiles,
48
37
  autoFocus,
38
+ children,
39
+ isLoading,
40
+ maxFiles,
41
+ maxSize,
42
+ multiple,
49
43
  noClick,
50
44
  noDrag,
51
45
  noDragEventsBubbling,
52
46
  noKeyboard,
47
+ openRef,
48
+ preventDropOnDocument,
49
+ useFsAccessApi,
50
+ loadingProps,
51
+ overlayProps,
53
52
  onDragEnter,
54
53
  onDragLeave,
55
54
  onDragOver,
55
+ onDrop,
56
+ onDropAccepted,
57
+ onDropRejected,
56
58
  onFileDialogCancel,
57
59
  onFileDialogOpen,
58
- preventDropOnDocument,
59
- useFsAccessApi,
60
- children,
61
60
  ...rest
62
61
  } = useFormControlProps(omitThemeProps(mergedProps));
63
62
  const disabled = isLoading || rest.disabled || rest.readOnly;
@@ -65,41 +64,41 @@ var Dropzone = forwardRef((props, ref) => {
65
64
  rest,
66
65
  formControlProperties
67
66
  );
68
- const { getRootProps, getInputProps, isDragAccept, isDragReject, open } = useDropzone({
69
- disabled,
67
+ const { isDragAccept, isDragReject, open, getInputProps, getRootProps } = useDropzone({
70
68
  accept: isArray(accept) ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {}) : accept,
71
- onDrop,
72
- onDropAccepted,
73
- onDropRejected,
74
- multiple,
75
- maxSize,
76
- maxFiles,
77
69
  autoFocus,
70
+ disabled,
71
+ maxFiles,
72
+ maxSize,
73
+ multiple,
78
74
  noClick,
79
75
  noDrag,
80
76
  noDragEventsBubbling,
81
77
  noKeyboard,
78
+ preventDropOnDocument,
79
+ useFsAccessApi,
82
80
  onDragEnter,
83
81
  onDragLeave,
84
82
  onDragOver,
83
+ onDrop,
84
+ onDropAccepted,
85
+ onDropRejected,
85
86
  onFileDialogCancel,
86
- onFileDialogOpen,
87
- preventDropOnDocument,
88
- useFsAccessApi
87
+ onFileDialogOpen
89
88
  });
90
89
  assignRef(openRef, open);
91
90
  const isDragIdle = !isDragAccept && !isDragReject;
92
91
  const css = {
93
- position: "relative",
92
+ alignItems: "center",
94
93
  display: "flex",
95
94
  justifyContent: "center",
96
- alignItems: "center",
95
+ position: "relative",
97
96
  ...styles.container
98
97
  };
99
98
  return /* @__PURE__ */ jsx(
100
99
  DropzoneProvider,
101
100
  {
102
- value: { isLoading, isDragAccept, isDragReject, isDragIdle, styles },
101
+ value: { isDragAccept, isDragIdle, isDragReject, isLoading, styles },
103
102
  children: /* @__PURE__ */ jsxs(
104
103
  ui.div,
105
104
  {
@@ -108,16 +107,16 @@ var Dropzone = forwardRef((props, ref) => {
108
107
  ...containerProps,
109
108
  ...getRootProps({}),
110
109
  "data-accept": dataAttr(isDragAccept),
111
- "data-reject": dataAttr(isDragReject),
112
110
  "data-idle": dataAttr(isDragIdle),
113
111
  "data-loading": dataAttr(isLoading),
112
+ "data-reject": dataAttr(isDragReject),
114
113
  children: [
115
- /* @__PURE__ */ jsx(LoadingOverlay, { loadingProps, ...overlayProps }),
114
+ /* @__PURE__ */ jsx(DropzoneLoadingOverlay, { loadingProps, ...overlayProps }),
116
115
  /* @__PURE__ */ jsx(
117
116
  ui.input,
118
117
  {
119
- ref,
120
118
  id,
119
+ ref,
121
120
  name,
122
121
  ...formControlProps,
123
122
  ...getInputProps()
@@ -132,25 +131,28 @@ var Dropzone = forwardRef((props, ref) => {
132
131
  });
133
132
  Dropzone.displayName = "Dropzone";
134
133
  Dropzone.__ui__ = "Dropzone";
135
- var LoadingOverlay = ({ loadingProps, ...rest }) => {
134
+ var DropzoneLoadingOverlay = ({
135
+ loadingProps,
136
+ ...rest
137
+ }) => {
136
138
  const { isLoading, styles } = useDropzoneContext();
137
139
  const css = {
140
+ alignItems: "center",
141
+ display: "flex",
142
+ h: "100%",
143
+ justifyContent: "center",
144
+ left: 0,
138
145
  position: "absolute",
139
146
  top: 0,
140
- left: 0,
141
147
  w: "100%",
142
- h: "100%",
143
- display: "flex",
144
- justifyContent: "center",
145
- alignItems: "center",
146
148
  ...styles.overlay
147
149
  };
148
150
  return /* @__PURE__ */ jsx(
149
151
  Fade,
150
152
  {
153
+ className: "ui-dropzone__overlay",
151
154
  isOpen: isLoading,
152
155
  unmountOnExit: true,
153
- className: "ui-dropzone__overlay",
154
156
  __css: css,
155
157
  ...rest,
156
158
  children: /* @__PURE__ */ jsx(
@@ -164,23 +166,23 @@ var LoadingOverlay = ({ loadingProps, ...rest }) => {
164
166
  }
165
167
  );
166
168
  };
167
- LoadingOverlay.displayName = "LoadingOverlay";
168
- LoadingOverlay.__ui__ = "LoadingOverlay";
169
+ DropzoneLoadingOverlay.displayName = "DropzoneLoadingOverlay";
170
+ DropzoneLoadingOverlay.__ui__ = "DropzoneLoadingOverlay";
169
171
  var DropzoneAccept = ({ children }) => {
170
172
  const { isDragAccept } = useDropzoneContext();
171
- return isDragAccept ? /* @__PURE__ */ jsx(Fragment, { children }) : null;
173
+ return isDragAccept ? children : null;
172
174
  };
173
175
  DropzoneAccept.displayName = "DropzoneAccept";
174
176
  DropzoneAccept.__ui__ = "DropzoneAccept";
175
177
  var DropzoneReject = ({ children }) => {
176
178
  const { isDragReject } = useDropzoneContext();
177
- return isDragReject ? /* @__PURE__ */ jsx(Fragment, { children }) : null;
179
+ return isDragReject ? children : null;
178
180
  };
179
181
  DropzoneReject.displayName = "DropzoneReject";
180
182
  DropzoneReject.__ui__ = "DropzoneReject";
181
183
  var DropzoneIdle = ({ children }) => {
182
184
  const { isDragIdle } = useDropzoneContext();
183
- return isDragIdle ? /* @__PURE__ */ jsx(Fragment, { children }) : null;
185
+ return isDragIdle ? children : null;
184
186
  };
185
187
  DropzoneIdle.displayName = "DropzoneIdle";
186
188
  DropzoneIdle.__ui__ = "DropzoneIdle";
@@ -191,4 +193,4 @@ export {
191
193
  DropzoneReject,
192
194
  DropzoneIdle
193
195
  };
194
- //# sourceMappingURL=chunk-DRLF3PX5.mjs.map
196
+ //# sourceMappingURL=chunk-3QSKWUOX.mjs.map
package/dist/chunk-3QSKWUOX.mjs.map ADDED
@@ -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 { useDropzone } from \"react-dropzone-esm\"\n\ninterface DropzoneContext {\n isDragAccept: boolean\n isDragIdle: boolean\n isDragReject: boolean\n styles: { [key: string]: CSSUIObject | undefined }\n isLoading?: 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 isLoading?: 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 const {\n id,\n name,\n className,\n accept,\n autoFocus,\n children,\n isLoading,\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 const disabled = isLoading || rest.disabled || rest.readOnly\n\n const [formControlProps, containerProps] = splitObject(\n rest,\n formControlProperties,\n )\n\n const { isDragAccept, isDragReject, open, getInputProps, 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 isDragIdle = !isDragAccept && !isDragReject\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={{ isDragAccept, isDragIdle, isDragReject, isLoading, styles }}\n >\n <ui.div\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...containerProps}\n {...getRootProps({})}\n data-accept={dataAttr(isDragAccept)}\n data-idle={dataAttr(isDragIdle)}\n data-loading={dataAttr(isLoading)}\n data-reject={dataAttr(isDragReject)}\n >\n <DropzoneLoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n\n <ui.input\n id={id}\n ref={ref}\n name={name}\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 { isLoading, 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 isOpen={isLoading}\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 { isDragAccept } = useDropzoneContext()\n\n return isDragAccept ? children : null\n}\n\nDropzoneAccept.displayName = \"DropzoneAccept\"\nDropzoneAccept.__ui__ = \"DropzoneAccept\"\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { isDragReject } = useDropzoneContext()\n\n return isDragReject ? children : null\n}\n\nDropzoneReject.displayName = \"DropzoneReject\"\nDropzoneReject.__ui__ = \"DropzoneReject\"\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { isDragIdle } = useDropzoneContext()\n\n return isDragIdle ? children : null\n}\n\nDropzoneIdle.displayName = \"DropzoneIdle\"\nDropzoneIdle.__ui__ = \"DropzoneIdle\"\n"],"mappings":"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","names":[]}
package/dist/dropzone.d.mts CHANGED
@@ -9,13 +9,17 @@ import { DropzoneOptions as DropzoneOptions$1, Accept } from 'react-dropzone-esm
9
9
 
10
10
  interface DropzoneOptions {
11
11
  /**
12
- * The border color when the input is focused.
12
+ * File types to accept.
13
13
  */
14
- focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, "colors">;
14
+ accept?: Accept | string[];
15
15
  /**
16
16
  * The border color when the input is invalid.
17
17
  */
18
18
  errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, "colors">;
19
+ /**
20
+ * The border color when the input is focused.
21
+ */
22
+ focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, "colors">;
19
23
  /**
20
24
  * If `true`, display the dropzone loading icon.
21
25
  *
@@ -23,21 +27,17 @@ interface DropzoneOptions {
23
27
  */
24
28
  isLoading?: boolean;
25
29
  /**
26
- * Props for dropzone overlay element.
30
+ * Ref to a open function.
27
31
  */
28
- overlayProps?: FadeProps;
32
+ openRef?: ForwardedRef<() => undefined | void>;
29
33
  /**
30
34
  * Props for dropzone loading icon element.
31
35
  */
32
36
  loadingProps?: LoadingProps;
33
37
  /**
34
- * File types to accept.
35
- */
36
- accept?: Accept | string[];
37
- /**
38
- * Ref to a open function.
38
+ * Props for dropzone overlay element.
39
39
  */
40
- openRef?: ForwardedRef<() => void | undefined>;
40
+ overlayProps?: FadeProps;
41
41
  }
42
42
  interface DropzoneProps extends Merge<HTMLUIProps, Omit<DropzoneOptions$1, "accept">>, ThemeProps<"Dropzone">, DropzoneOptions, FormControlOptions {
43
43
  }
package/dist/dropzone.d.ts CHANGED
@@ -9,13 +9,17 @@ import { DropzoneOptions as DropzoneOptions$1, Accept } from 'react-dropzone-esm
9
9
 
10
10
  interface DropzoneOptions {
11
11
  /**
12
- * The border color when the input is focused.
12
+ * File types to accept.
13
13
  */
14
- focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, "colors">;
14
+ accept?: Accept | string[];
15
15
  /**
16
16
  * The border color when the input is invalid.
17
17
  */
18
18
  errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, "colors">;
19
+ /**
20
+ * The border color when the input is focused.
21
+ */
22
+ focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, "colors">;
19
23
  /**
20
24
  * If `true`, display the dropzone loading icon.
21
25
  *
@@ -23,21 +27,17 @@ interface DropzoneOptions {
23
27
  */
24
28
  isLoading?: boolean;
25
29
  /**
26
- * Props for dropzone overlay element.
30
+ * Ref to a open function.
27
31
  */
28
- overlayProps?: FadeProps;
32
+ openRef?: ForwardedRef<() => undefined | void>;
29
33
  /**
30
34
  * Props for dropzone loading icon element.
31
35
  */
32
36
  loadingProps?: LoadingProps;
33
37
  /**
34
- * File types to accept.
35
- */
36
- accept?: Accept | string[];
37
- /**
38
- * Ref to a open function.
38
+ * Props for dropzone overlay element.
39
39
  */
40
- openRef?: ForwardedRef<() => void | undefined>;
40
+ overlayProps?: FadeProps;
41
41
  }
42
42
  interface DropzoneProps extends Merge<HTMLUIProps, Omit<DropzoneOptions$1, "accept">>, ThemeProps<"Dropzone">, DropzoneOptions, FormControlOptions {
43
43
  }
package/dist/dropzone.js CHANGED
@@ -32,7 +32,6 @@ 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");
36
35
  var import_react_dropzone_esm = require("react-dropzone-esm");
37
36
  var import_jsx_runtime = require("react/jsx-runtime");
38
37
  var [DropzoneProvider, useDropzoneContext] = (0, import_utils.createContext)({
@@ -45,30 +44,30 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
45
44
  id,
46
45
  name,
47
46
  className,
48
- isLoading,
49
- overlayProps,
50
- loadingProps,
51
- openRef,
52
47
  accept,
53
- onDrop,
54
- onDropAccepted,
55
- onDropRejected,
56
- multiple,
57
- maxSize,
58
- maxFiles,
59
48
  autoFocus,
49
+ children,
50
+ isLoading,
51
+ maxFiles,
52
+ maxSize,
53
+ multiple,
60
54
  noClick,
61
55
  noDrag,
62
56
  noDragEventsBubbling,
63
57
  noKeyboard,
58
+ openRef,
59
+ preventDropOnDocument,
60
+ useFsAccessApi,
61
+ loadingProps,
62
+ overlayProps,
64
63
  onDragEnter,
65
64
  onDragLeave,
66
65
  onDragOver,
66
+ onDrop,
67
+ onDropAccepted,
68
+ onDropRejected,
67
69
  onFileDialogCancel,
68
70
  onFileDialogOpen,
69
- preventDropOnDocument,
70
- useFsAccessApi,
71
- children,
72
71
  ...rest
73
72
  } = (0, import_form_control.useFormControlProps)((0, import_core.omitThemeProps)(mergedProps));
74
73
  const disabled = isLoading || rest.disabled || rest.readOnly;
@@ -76,41 +75,41 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
76
75
  rest,
77
76
  import_form_control.formControlProperties
78
77
  );
79
- const { getRootProps, getInputProps, isDragAccept, isDragReject, open } = (0, import_react_dropzone_esm.useDropzone)({
80
- disabled,
78
+ const { isDragAccept, isDragReject, open, getInputProps, getRootProps } = (0, import_react_dropzone_esm.useDropzone)({
81
79
  accept: (0, import_utils.isArray)(accept) ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {}) : accept,
82
- onDrop,
83
- onDropAccepted,
84
- onDropRejected,
85
- multiple,
86
- maxSize,
87
- maxFiles,
88
80
  autoFocus,
81
+ disabled,
82
+ maxFiles,
83
+ maxSize,
84
+ multiple,
89
85
  noClick,
90
86
  noDrag,
91
87
  noDragEventsBubbling,
92
88
  noKeyboard,
89
+ preventDropOnDocument,
90
+ useFsAccessApi,
93
91
  onDragEnter,
94
92
  onDragLeave,
95
93
  onDragOver,
94
+ onDrop,
95
+ onDropAccepted,
96
+ onDropRejected,
96
97
  onFileDialogCancel,
97
- onFileDialogOpen,
98
- preventDropOnDocument,
99
- useFsAccessApi
98
+ onFileDialogOpen
100
99
  });
101
100
  (0, import_utils.assignRef)(openRef, open);
102
101
  const isDragIdle = !isDragAccept && !isDragReject;
103
102
  const css = {
104
- position: "relative",
103
+ alignItems: "center",
105
104
  display: "flex",
106
105
  justifyContent: "center",
107
- alignItems: "center",
106
+ position: "relative",
108
107
  ...styles.container
109
108
  };
110
109
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
111
110
  DropzoneProvider,
112
111
  {
113
- value: { isLoading, isDragAccept, isDragReject, isDragIdle, styles },
112
+ value: { isDragAccept, isDragIdle, isDragReject, isLoading, styles },
114
113
  children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
115
114
  import_core.ui.div,
116
115
  {
@@ -119,16 +118,16 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
119
118
  ...containerProps,
120
119
  ...getRootProps({}),
121
120
  "data-accept": (0, import_utils.dataAttr)(isDragAccept),
122
- "data-reject": (0, import_utils.dataAttr)(isDragReject),
123
121
  "data-idle": (0, import_utils.dataAttr)(isDragIdle),
124
122
  "data-loading": (0, import_utils.dataAttr)(isLoading),
123
+ "data-reject": (0, import_utils.dataAttr)(isDragReject),
125
124
  children: [
126
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LoadingOverlay, { loadingProps, ...overlayProps }),
125
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DropzoneLoadingOverlay, { loadingProps, ...overlayProps }),
127
126
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
128
127
  import_core.ui.input,
129
128
  {
130
- ref,
131
129
  id,
130
+ ref,
132
131
  name,
133
132
  ...formControlProps,
134
133
  ...getInputProps()
@@ -143,25 +142,28 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
143
142
  });
144
143
  Dropzone.displayName = "Dropzone";
145
144
  Dropzone.__ui__ = "Dropzone";
146
- var LoadingOverlay = ({ loadingProps, ...rest }) => {
145
+ var DropzoneLoadingOverlay = ({
146
+ loadingProps,
147
+ ...rest
148
+ }) => {
147
149
  const { isLoading, styles } = useDropzoneContext();
148
150
  const css = {
151
+ alignItems: "center",
152
+ display: "flex",
153
+ h: "100%",
154
+ justifyContent: "center",
155
+ left: 0,
149
156
  position: "absolute",
150
157
  top: 0,
151
- left: 0,
152
158
  w: "100%",
153
- h: "100%",
154
- display: "flex",
155
- justifyContent: "center",
156
- alignItems: "center",
157
159
  ...styles.overlay
158
160
  };
159
161
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
160
162
  import_transitions.Fade,
161
163
  {
164
+ className: "ui-dropzone__overlay",
162
165
  isOpen: isLoading,
163
166
  unmountOnExit: true,
164
- className: "ui-dropzone__overlay",
165
167
  __css: css,
166
168
  ...rest,
167
169
  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -175,23 +177,23 @@ var LoadingOverlay = ({ loadingProps, ...rest }) => {
175
177
  }
176
178
  );
177
179
  };
178
- LoadingOverlay.displayName = "LoadingOverlay";
179
- LoadingOverlay.__ui__ = "LoadingOverlay";
180
+ DropzoneLoadingOverlay.displayName = "DropzoneLoadingOverlay";
181
+ DropzoneLoadingOverlay.__ui__ = "DropzoneLoadingOverlay";
180
182
  var DropzoneAccept = ({ children }) => {
181
183
  const { isDragAccept } = useDropzoneContext();
182
- return isDragAccept ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.Fragment, { children }) : null;
184
+ return isDragAccept ? children : null;
183
185
  };
184
186
  DropzoneAccept.displayName = "DropzoneAccept";
185
187
  DropzoneAccept.__ui__ = "DropzoneAccept";
186
188
  var DropzoneReject = ({ children }) => {
187
189
  const { isDragReject } = useDropzoneContext();
188
- return isDragReject ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.Fragment, { children }) : null;
190
+ return isDragReject ? children : null;
189
191
  };
190
192
  DropzoneReject.displayName = "DropzoneReject";
191
193
  DropzoneReject.__ui__ = "DropzoneReject";
192
194
  var DropzoneIdle = ({ children }) => {
193
195
  const { isDragIdle } = useDropzoneContext();
194
- return isDragIdle ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.Fragment, { children }) : null;
196
+ return isDragIdle ? children : null;
195
197
  };
196
198
  DropzoneIdle.displayName = "DropzoneIdle";
197
199
  DropzoneIdle.__ui__ = "DropzoneIdle";
package/dist/dropzone.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/dropzone.tsx"],"sourcesContent":["import type {\n FC,\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport type { FadeProps } from \"@yamada-ui/transitions\"\nimport { Fade } from \"@yamada-ui/transitions\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport {\n assignRef,\n createContext,\n cx,\n dataAttr,\n isArray,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type { ForwardedRef, PropsWithChildren } from \"react\"\nimport { Fragment } from \"react\"\nimport type {\n Accept,\n DropzoneOptions as ReactDropzoneOptions,\n} from \"react-dropzone-esm\"\nimport { useDropzone } from \"react-dropzone-esm\"\n\ninterface DropzoneContext {\n isLoading?: boolean\n isDragAccept: boolean\n isDragReject: boolean\n isDragIdle: boolean\n styles: { [key: string]: CSSUIObject }\n}\n\nconst [DropzoneProvider, useDropzoneContext] = createContext<DropzoneContext>({\n name: \"DropzoneContext\",\n errorMessage: `useDropzoneContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Dropzone />\"`,\n})\n\ninterface DropzoneOptions {\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n */\n isLoading?: boolean\n /**\n * Props for dropzone overlay element.\n */\n overlayProps?: FadeProps\n /**\n * Props for dropzone loading icon element.\n */\n loadingProps?: LoadingProps\n /**\n * File types to accept.\n */\n accept?: Accept | string[]\n /**\n * Ref to a open function.\n */\n openRef?: ForwardedRef<() => void | undefined>\n}\n\nexport 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 const {\n id,\n name,\n className,\n isLoading,\n overlayProps,\n loadingProps,\n openRef,\n accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n children,\n ...rest\n } = useFormControlProps(omitThemeProps(mergedProps))\n\n const disabled = isLoading || rest.disabled || rest.readOnly\n\n const [formControlProps, containerProps] = splitObject(\n rest,\n formControlProperties,\n )\n\n const { getRootProps, getInputProps, isDragAccept, isDragReject, open } =\n useDropzone({\n disabled,\n accept: isArray(accept)\n ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {})\n : accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n })\n\n assignRef(openRef, open)\n\n const isDragIdle = !isDragAccept && !isDragReject\n\n const css: CSSUIObject = {\n position: \"relative\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.container,\n }\n\n return (\n <DropzoneProvider\n value={{ isLoading, isDragAccept, isDragReject, isDragIdle, styles }}\n >\n <ui.div\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...containerProps}\n {...getRootProps({})}\n data-accept={dataAttr(isDragAccept)}\n data-reject={dataAttr(isDragReject)}\n data-idle={dataAttr(isDragIdle)}\n data-loading={dataAttr(isLoading)}\n >\n <LoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n <ui.input\n ref={ref}\n id={id}\n name={name}\n {...formControlProps}\n {...getInputProps()}\n />\n {children}\n </ui.div>\n </DropzoneProvider>\n )\n})\n\nDropzone.displayName = \"Dropzone\"\nDropzone.__ui__ = \"Dropzone\"\n\ninterface LoadingOverlayProps extends FadeProps {\n loadingProps?: LoadingProps\n}\n\nconst LoadingOverlay: FC<LoadingOverlayProps> = ({ loadingProps, ...rest }) => {\n const { isLoading, styles } = useDropzoneContext()\n\n const css: CSSUIObject = {\n position: \"absolute\",\n top: 0,\n left: 0,\n w: \"100%\",\n h: \"100%\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.overlay,\n }\n\n return (\n <Fade\n isOpen={isLoading}\n unmountOnExit\n className=\"ui-dropzone__overlay\"\n __css={css}\n {...rest}\n >\n <Loading\n className=\"ui-dropzone__overlay__loading\"\n fontSize=\"4xl\"\n {...loadingProps}\n />\n </Fade>\n )\n}\n\nLoadingOverlay.displayName = \"LoadingOverlay\"\nLoadingOverlay.__ui__ = \"LoadingOverlay\"\n\nexport const DropzoneAccept: FC<PropsWithChildren> = ({ children }) => {\n const { isDragAccept } = useDropzoneContext()\n\n return isDragAccept ? <Fragment>{children}</Fragment> : null\n}\n\nDropzoneAccept.displayName = \"DropzoneAccept\"\nDropzoneAccept.__ui__ = \"DropzoneAccept\"\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { isDragReject } = useDropzoneContext()\n\n return isDragReject ? <Fragment>{children}</Fragment> : null\n}\n\nDropzoneReject.displayName = \"DropzoneReject\"\nDropzoneReject.__ui__ = \"DropzoneReject\"\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { isDragIdle } = useDropzoneContext()\n\n return isDragIdle ? <Fragment>{children}</Fragment> : 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 { useDropzone } from \"react-dropzone-esm\"\n\ninterface DropzoneContext {\n isDragAccept: boolean\n isDragIdle: boolean\n isDragReject: boolean\n styles: { [key: string]: CSSUIObject | undefined }\n isLoading?: 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 isLoading?: 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 const {\n id,\n name,\n className,\n accept,\n autoFocus,\n children,\n isLoading,\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 const disabled = isLoading || rest.disabled || rest.readOnly\n\n const [formControlProps, containerProps] = splitObject(\n rest,\n formControlProperties,\n )\n\n const { isDragAccept, isDragReject, open, getInputProps, 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 isDragIdle = !isDragAccept && !isDragReject\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={{ isDragAccept, isDragIdle, isDragReject, isLoading, styles }}\n >\n <ui.div\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...containerProps}\n {...getRootProps({})}\n data-accept={dataAttr(isDragAccept)}\n data-idle={dataAttr(isDragIdle)}\n data-loading={dataAttr(isLoading)}\n data-reject={dataAttr(isDragReject)}\n >\n <DropzoneLoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n\n <ui.input\n id={id}\n ref={ref}\n name={name}\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 { isLoading, 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 isOpen={isLoading}\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 { isDragAccept } = useDropzoneContext()\n\n return isDragAccept ? children : null\n}\n\nDropzoneAccept.displayName = \"DropzoneAccept\"\nDropzoneAccept.__ui__ = \"DropzoneAccept\"\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { isDragReject } = useDropzoneContext()\n\n return isDragReject ? children : null\n}\n\nDropzoneReject.displayName = \"DropzoneReject\"\nDropzoneReject.__ui__ = \"DropzoneReject\"\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { isDragIdle } = useDropzoneContext()\n\n return isDragIdle ? children : null\n}\n\nDropzoneIdle.displayName = \"DropzoneIdle\"\nDropzoneIdle.__ui__ = \"DropzoneIdle\"\n"],"mappings":"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","names":[]}
package/dist/dropzone.mjs CHANGED
@@ -4,7 +4,7 @@ import {
4
4
  DropzoneAccept,
5
5
  DropzoneIdle,
6
6
  DropzoneReject
7
- } from "./chunk-DRLF3PX5.mjs";
7
+ } from "./chunk-3QSKWUOX.mjs";
8
8
  export {
9
9
  Dropzone,
10
10
  DropzoneAccept,
package/dist/index.d.mts CHANGED
@@ -1,5 +1,5 @@
1
- export { Dropzone, DropzoneAccept, DropzoneIdle, DropzoneProps, DropzoneReject } from './dropzone.mjs';
2
1
  export { ACCEPT_TYPES, EXE_ACCEPT_TYPE, IMAGE_ACCEPT_TYPE, MS_EXCEL_ACCEPT_TYPE, MS_POWER_POINT_ACCEPT_TYPE, MS_WORD_ACCEPT_TYPE, PDF_ACCEPT_TYPE } from './accept-types.mjs';
2
+ export { Dropzone, DropzoneAccept, DropzoneIdle, DropzoneProps, DropzoneReject } from './dropzone.mjs';
3
3
  export { DropEvent, ErrorCode, FileError, FileRejection } from 'react-dropzone-esm';
4
4
  import '@yamada-ui/core';
5
5
  import '@yamada-ui/form-control';
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- export { Dropzone, DropzoneAccept, DropzoneIdle, DropzoneProps, DropzoneReject } from './dropzone.js';
2
1
  export { ACCEPT_TYPES, EXE_ACCEPT_TYPE, IMAGE_ACCEPT_TYPE, MS_EXCEL_ACCEPT_TYPE, MS_POWER_POINT_ACCEPT_TYPE, MS_WORD_ACCEPT_TYPE, PDF_ACCEPT_TYPE } from './accept-types.js';
2
+ export { Dropzone, DropzoneAccept, DropzoneIdle, DropzoneProps, DropzoneReject } from './dropzone.js';
3
3
  export { DropEvent, ErrorCode, FileError, FileRejection } from 'react-dropzone-esm';
4
4
  import '@yamada-ui/core';
5
5
  import '@yamada-ui/form-control';
package/dist/index.js CHANGED
@@ -35,13 +35,48 @@ __export(src_exports, {
35
35
  });
36
36
  module.exports = __toCommonJS(src_exports);
37
37
 
38
+ // src/accept-types.ts
39
+ var ACCEPT_TYPES = {
40
+ csv: "text/csv",
41
+ doc: "application/msword",
42
+ docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
43
+ exe: "application/vnd.microsoft.portable-executable",
44
+ gif: "image/gif",
45
+ html: "text/html",
46
+ jpeg: "image/jpeg",
47
+ mp3: "audio/mpeg",
48
+ mp4: "video/mp4",
49
+ mpeg: "video/mpeg",
50
+ pdf: "application/pdf",
51
+ png: "image/png",
52
+ ppt: "application/vnd.ms-powerpoint",
53
+ pptx: "application/vnd.openxmlformats-officedocument.presentationml.presentation",
54
+ svg: "image/svg+xml",
55
+ txt: "text/plain",
56
+ webp: "image/webp",
57
+ xls: "application/vnd.ms-excel",
58
+ xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
59
+ zip: "application/zip"
60
+ };
61
+ var IMAGE_ACCEPT_TYPE = [
62
+ ACCEPT_TYPES.png,
63
+ ACCEPT_TYPES.gif,
64
+ ACCEPT_TYPES.jpeg,
65
+ ACCEPT_TYPES.svg,
66
+ ACCEPT_TYPES.webp
67
+ ];
68
+ var PDF_ACCEPT_TYPE = [ACCEPT_TYPES.pdf];
69
+ var MS_WORD_ACCEPT_TYPE = [ACCEPT_TYPES.doc, ACCEPT_TYPES.docx];
70
+ var MS_EXCEL_ACCEPT_TYPE = [ACCEPT_TYPES.xls, ACCEPT_TYPES.xlsx];
71
+ var MS_POWER_POINT_ACCEPT_TYPE = [ACCEPT_TYPES.ppt, ACCEPT_TYPES.pptx];
72
+ var EXE_ACCEPT_TYPE = [ACCEPT_TYPES.exe];
73
+
38
74
  // src/dropzone.tsx
39
75
  var import_core = require("@yamada-ui/core");
40
76
  var import_form_control = require("@yamada-ui/form-control");
41
77
  var import_loading = require("@yamada-ui/loading");
42
78
  var import_transitions = require("@yamada-ui/transitions");
43
79
  var import_utils = require("@yamada-ui/utils");
44
- var import_react = require("react");
45
80
  var import_react_dropzone_esm = require("react-dropzone-esm");
46
81
  var import_jsx_runtime = require("react/jsx-runtime");
47
82
  var [DropzoneProvider, useDropzoneContext] = (0, import_utils.createContext)({
@@ -54,30 +89,30 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
54
89
  id,
55
90
  name,
56
91
  className,
57
- isLoading,
58
- overlayProps,
59
- loadingProps,
60
- openRef,
61
92
  accept,
62
- onDrop,
63
- onDropAccepted,
64
- onDropRejected,
65
- multiple,
66
- maxSize,
67
- maxFiles,
68
93
  autoFocus,
94
+ children,
95
+ isLoading,
96
+ maxFiles,
97
+ maxSize,
98
+ multiple,
69
99
  noClick,
70
100
  noDrag,
71
101
  noDragEventsBubbling,
72
102
  noKeyboard,
103
+ openRef,
104
+ preventDropOnDocument,
105
+ useFsAccessApi,
106
+ loadingProps,
107
+ overlayProps,
73
108
  onDragEnter,
74
109
  onDragLeave,
75
110
  onDragOver,
111
+ onDrop,
112
+ onDropAccepted,
113
+ onDropRejected,
76
114
  onFileDialogCancel,
77
115
  onFileDialogOpen,
78
- preventDropOnDocument,
79
- useFsAccessApi,
80
- children,
81
116
  ...rest
82
117
  } = (0, import_form_control.useFormControlProps)((0, import_core.omitThemeProps)(mergedProps));
83
118
  const disabled = isLoading || rest.disabled || rest.readOnly;
@@ -85,41 +120,41 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
85
120
  rest,
86
121
  import_form_control.formControlProperties
87
122
  );
88
- const { getRootProps, getInputProps, isDragAccept, isDragReject, open } = (0, import_react_dropzone_esm.useDropzone)({
89
- disabled,
123
+ const { isDragAccept, isDragReject, open, getInputProps, getRootProps } = (0, import_react_dropzone_esm.useDropzone)({
90
124
  accept: (0, import_utils.isArray)(accept) ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {}) : accept,
91
- onDrop,
92
- onDropAccepted,
93
- onDropRejected,
94
- multiple,
95
- maxSize,
96
- maxFiles,
97
125
  autoFocus,
126
+ disabled,
127
+ maxFiles,
128
+ maxSize,
129
+ multiple,
98
130
  noClick,
99
131
  noDrag,
100
132
  noDragEventsBubbling,
101
133
  noKeyboard,
134
+ preventDropOnDocument,
135
+ useFsAccessApi,
102
136
  onDragEnter,
103
137
  onDragLeave,
104
138
  onDragOver,
139
+ onDrop,
140
+ onDropAccepted,
141
+ onDropRejected,
105
142
  onFileDialogCancel,
106
- onFileDialogOpen,
107
- preventDropOnDocument,
108
- useFsAccessApi
143
+ onFileDialogOpen
109
144
  });
110
145
  (0, import_utils.assignRef)(openRef, open);
111
146
  const isDragIdle = !isDragAccept && !isDragReject;
112
147
  const css = {
113
- position: "relative",
148
+ alignItems: "center",
114
149
  display: "flex",
115
150
  justifyContent: "center",
116
- alignItems: "center",
151
+ position: "relative",
117
152
  ...styles.container
118
153
  };
119
154
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
120
155
  DropzoneProvider,
121
156
  {
122
- value: { isLoading, isDragAccept, isDragReject, isDragIdle, styles },
157
+ value: { isDragAccept, isDragIdle, isDragReject, isLoading, styles },
123
158
  children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
124
159
  import_core.ui.div,
125
160
  {
@@ -128,16 +163,16 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
128
163
  ...containerProps,
129
164
  ...getRootProps({}),
130
165
  "data-accept": (0, import_utils.dataAttr)(isDragAccept),
131
- "data-reject": (0, import_utils.dataAttr)(isDragReject),
132
166
  "data-idle": (0, import_utils.dataAttr)(isDragIdle),
133
167
  "data-loading": (0, import_utils.dataAttr)(isLoading),
168
+ "data-reject": (0, import_utils.dataAttr)(isDragReject),
134
169
  children: [
135
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LoadingOverlay, { loadingProps, ...overlayProps }),
170
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DropzoneLoadingOverlay, { loadingProps, ...overlayProps }),
136
171
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
137
172
  import_core.ui.input,
138
173
  {
139
- ref,
140
174
  id,
175
+ ref,
141
176
  name,
142
177
  ...formControlProps,
143
178
  ...getInputProps()
@@ -152,25 +187,28 @@ var Dropzone = (0, import_core.forwardRef)((props, ref) => {
152
187
  });
153
188
  Dropzone.displayName = "Dropzone";
154
189
  Dropzone.__ui__ = "Dropzone";
155
- var LoadingOverlay = ({ loadingProps, ...rest }) => {
190
+ var DropzoneLoadingOverlay = ({
191
+ loadingProps,
192
+ ...rest
193
+ }) => {
156
194
  const { isLoading, styles } = useDropzoneContext();
157
195
  const css = {
196
+ alignItems: "center",
197
+ display: "flex",
198
+ h: "100%",
199
+ justifyContent: "center",
200
+ left: 0,
158
201
  position: "absolute",
159
202
  top: 0,
160
- left: 0,
161
203
  w: "100%",
162
- h: "100%",
163
- display: "flex",
164
- justifyContent: "center",
165
- alignItems: "center",
166
204
  ...styles.overlay
167
205
  };
168
206
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
169
207
  import_transitions.Fade,
170
208
  {
209
+ className: "ui-dropzone__overlay",
171
210
  isOpen: isLoading,
172
211
  unmountOnExit: true,
173
- className: "ui-dropzone__overlay",
174
212
  __css: css,
175
213
  ...rest,
176
214
  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -184,62 +222,26 @@ var LoadingOverlay = ({ loadingProps, ...rest }) => {
184
222
  }
185
223
  );
186
224
  };
187
- LoadingOverlay.displayName = "LoadingOverlay";
188
- LoadingOverlay.__ui__ = "LoadingOverlay";
225
+ DropzoneLoadingOverlay.displayName = "DropzoneLoadingOverlay";
226
+ DropzoneLoadingOverlay.__ui__ = "DropzoneLoadingOverlay";
189
227
  var DropzoneAccept = ({ children }) => {
190
228
  const { isDragAccept } = useDropzoneContext();
191
- return isDragAccept ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.Fragment, { children }) : null;
229
+ return isDragAccept ? children : null;
192
230
  };
193
231
  DropzoneAccept.displayName = "DropzoneAccept";
194
232
  DropzoneAccept.__ui__ = "DropzoneAccept";
195
233
  var DropzoneReject = ({ children }) => {
196
234
  const { isDragReject } = useDropzoneContext();
197
- return isDragReject ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.Fragment, { children }) : null;
235
+ return isDragReject ? children : null;
198
236
  };
199
237
  DropzoneReject.displayName = "DropzoneReject";
200
238
  DropzoneReject.__ui__ = "DropzoneReject";
201
239
  var DropzoneIdle = ({ children }) => {
202
240
  const { isDragIdle } = useDropzoneContext();
203
- return isDragIdle ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.Fragment, { children }) : null;
241
+ return isDragIdle ? children : null;
204
242
  };
205
243
  DropzoneIdle.displayName = "DropzoneIdle";
206
244
  DropzoneIdle.__ui__ = "DropzoneIdle";
207
-
208
- // src/accept-types.ts
209
- var ACCEPT_TYPES = {
210
- txt: "text/plain",
211
- html: "text/html",
212
- csv: "text/csv",
213
- png: "image/png",
214
- gif: "image/gif",
215
- jpeg: "image/jpeg",
216
- svg: "image/svg+xml",
217
- webp: "image/webp",
218
- mp3: "audio/mpeg",
219
- mpeg: "video/mpeg",
220
- mp4: "video/mp4",
221
- zip: "application/zip",
222
- pdf: "application/pdf",
223
- doc: "application/msword",
224
- docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
225
- xls: "application/vnd.ms-excel",
226
- xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
227
- ppt: "application/vnd.ms-powerpoint",
228
- pptx: "application/vnd.openxmlformats-officedocument.presentationml.presentation",
229
- exe: "application/vnd.microsoft.portable-executable"
230
- };
231
- var IMAGE_ACCEPT_TYPE = [
232
- ACCEPT_TYPES.png,
233
- ACCEPT_TYPES.gif,
234
- ACCEPT_TYPES.jpeg,
235
- ACCEPT_TYPES.svg,
236
- ACCEPT_TYPES.webp
237
- ];
238
- var PDF_ACCEPT_TYPE = [ACCEPT_TYPES.pdf];
239
- var MS_WORD_ACCEPT_TYPE = [ACCEPT_TYPES.doc, ACCEPT_TYPES.docx];
240
- var MS_EXCEL_ACCEPT_TYPE = [ACCEPT_TYPES.xls, ACCEPT_TYPES.xlsx];
241
- var MS_POWER_POINT_ACCEPT_TYPE = [ACCEPT_TYPES.ppt, ACCEPT_TYPES.pptx];
242
- var EXE_ACCEPT_TYPE = [ACCEPT_TYPES.exe];
243
245
  // Annotate the CommonJS export names for ESM import in node:
244
246
  0 && (module.exports = {
245
247
  ACCEPT_TYPES,
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/dropzone.tsx","../src/accept-types.ts"],"sourcesContent":["export {\n Dropzone,\n DropzoneAccept,\n DropzoneIdle,\n DropzoneReject,\n} from \"./dropzone\"\nexport type { DropzoneProps } from \"./dropzone\"\nexport * from \"./accept-types\"\nexport type {\n FileRejection,\n FileError,\n ErrorCode,\n DropEvent,\n} from \"react-dropzone-esm\"\n","import type {\n FC,\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport type { FadeProps } from \"@yamada-ui/transitions\"\nimport { Fade } from \"@yamada-ui/transitions\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport {\n assignRef,\n createContext,\n cx,\n dataAttr,\n isArray,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type { ForwardedRef, PropsWithChildren } from \"react\"\nimport { Fragment } from \"react\"\nimport type {\n Accept,\n DropzoneOptions as ReactDropzoneOptions,\n} from \"react-dropzone-esm\"\nimport { useDropzone } from \"react-dropzone-esm\"\n\ninterface DropzoneContext {\n isLoading?: boolean\n isDragAccept: boolean\n isDragReject: boolean\n isDragIdle: boolean\n styles: { [key: string]: CSSUIObject }\n}\n\nconst [DropzoneProvider, useDropzoneContext] = createContext<DropzoneContext>({\n name: \"DropzoneContext\",\n errorMessage: `useDropzoneContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Dropzone />\"`,\n})\n\ninterface DropzoneOptions {\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n */\n isLoading?: boolean\n /**\n * Props for dropzone overlay element.\n */\n overlayProps?: FadeProps\n /**\n * Props for dropzone loading icon element.\n */\n loadingProps?: LoadingProps\n /**\n * File types to accept.\n */\n accept?: Accept | string[]\n /**\n * Ref to a open function.\n */\n openRef?: ForwardedRef<() => void | undefined>\n}\n\nexport 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 const {\n id,\n name,\n className,\n isLoading,\n overlayProps,\n loadingProps,\n openRef,\n accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n children,\n ...rest\n } = useFormControlProps(omitThemeProps(mergedProps))\n\n const disabled = isLoading || rest.disabled || rest.readOnly\n\n const [formControlProps, containerProps] = splitObject(\n rest,\n formControlProperties,\n )\n\n const { getRootProps, getInputProps, isDragAccept, isDragReject, open } =\n useDropzone({\n disabled,\n accept: isArray(accept)\n ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {})\n : accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n })\n\n assignRef(openRef, open)\n\n const isDragIdle = !isDragAccept && !isDragReject\n\n const css: CSSUIObject = {\n position: \"relative\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.container,\n }\n\n return (\n <DropzoneProvider\n value={{ isLoading, isDragAccept, isDragReject, isDragIdle, styles }}\n >\n <ui.div\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...containerProps}\n {...getRootProps({})}\n data-accept={dataAttr(isDragAccept)}\n data-reject={dataAttr(isDragReject)}\n data-idle={dataAttr(isDragIdle)}\n data-loading={dataAttr(isLoading)}\n >\n <LoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n <ui.input\n ref={ref}\n id={id}\n name={name}\n {...formControlProps}\n {...getInputProps()}\n />\n {children}\n </ui.div>\n </DropzoneProvider>\n )\n})\n\nDropzone.displayName = \"Dropzone\"\nDropzone.__ui__ = \"Dropzone\"\n\ninterface LoadingOverlayProps extends FadeProps {\n loadingProps?: LoadingProps\n}\n\nconst LoadingOverlay: FC<LoadingOverlayProps> = ({ loadingProps, ...rest }) => {\n const { isLoading, styles } = useDropzoneContext()\n\n const css: CSSUIObject = {\n position: \"absolute\",\n top: 0,\n left: 0,\n w: \"100%\",\n h: \"100%\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.overlay,\n }\n\n return (\n <Fade\n isOpen={isLoading}\n unmountOnExit\n className=\"ui-dropzone__overlay\"\n __css={css}\n {...rest}\n >\n <Loading\n className=\"ui-dropzone__overlay__loading\"\n fontSize=\"4xl\"\n {...loadingProps}\n />\n </Fade>\n )\n}\n\nLoadingOverlay.displayName = \"LoadingOverlay\"\nLoadingOverlay.__ui__ = \"LoadingOverlay\"\n\nexport const DropzoneAccept: FC<PropsWithChildren> = ({ children }) => {\n const { isDragAccept } = useDropzoneContext()\n\n return isDragAccept ? <Fragment>{children}</Fragment> : null\n}\n\nDropzoneAccept.displayName = \"DropzoneAccept\"\nDropzoneAccept.__ui__ = \"DropzoneAccept\"\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { isDragReject } = useDropzoneContext()\n\n return isDragReject ? <Fragment>{children}</Fragment> : null\n}\n\nDropzoneReject.displayName = \"DropzoneReject\"\nDropzoneReject.__ui__ = \"DropzoneReject\"\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { isDragIdle } = useDropzoneContext()\n\n return isDragIdle ? <Fragment>{children}</Fragment> : null\n}\n\nDropzoneIdle.displayName = \"DropzoneIdle\"\nDropzoneIdle.__ui__ = \"DropzoneIdle\"\n","export const ACCEPT_TYPES = {\n txt: \"text/plain\",\n html: \"text/html\",\n csv: \"text/csv\",\n png: \"image/png\",\n gif: \"image/gif\",\n jpeg: \"image/jpeg\",\n svg: \"image/svg+xml\",\n webp: \"image/webp\",\n mp3: \"audio/mpeg\",\n mpeg: \"video/mpeg\",\n mp4: \"video/mp4\",\n zip: \"application/zip\",\n pdf: \"application/pdf\",\n doc: \"application/msword\",\n docx: \"application/vnd.openxmlformats-officedocument.wordprocessingml.document\",\n xls: \"application/vnd.ms-excel\",\n xlsx: \"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet\",\n ppt: \"application/vnd.ms-powerpoint\",\n pptx: \"application/vnd.openxmlformats-officedocument.presentationml.presentation\",\n exe: \"application/vnd.microsoft.portable-executable\",\n} as const\n\nexport const IMAGE_ACCEPT_TYPE = [\n ACCEPT_TYPES.png,\n ACCEPT_TYPES.gif,\n ACCEPT_TYPES.jpeg,\n ACCEPT_TYPES.svg,\n ACCEPT_TYPES.webp,\n]\nexport const PDF_ACCEPT_TYPE = [ACCEPT_TYPES.pdf]\nexport const MS_WORD_ACCEPT_TYPE = [ACCEPT_TYPES.doc, ACCEPT_TYPES.docx]\nexport const MS_EXCEL_ACCEPT_TYPE = [ACCEPT_TYPES.xls, ACCEPT_TYPES.xlsx]\nexport const MS_POWER_POINT_ACCEPT_TYPE = [ACCEPT_TYPES.ppt, ACCEPT_TYPES.pptx]\nexport const EXE_ACCEPT_TYPE = [ACCEPT_TYPES.exe]\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../src/index.ts","../src/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 isDragAccept: boolean\n isDragIdle: boolean\n isDragReject: boolean\n styles: { [key: string]: CSSUIObject | undefined }\n isLoading?: 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 isLoading?: 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 const {\n id,\n name,\n className,\n accept,\n autoFocus,\n children,\n isLoading,\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 const disabled = isLoading || rest.disabled || rest.readOnly\n\n const [formControlProps, containerProps] = splitObject(\n rest,\n formControlProperties,\n )\n\n const { isDragAccept, isDragReject, open, getInputProps, 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 isDragIdle = !isDragAccept && !isDragReject\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={{ isDragAccept, isDragIdle, isDragReject, isLoading, styles }}\n >\n <ui.div\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...containerProps}\n {...getRootProps({})}\n data-accept={dataAttr(isDragAccept)}\n data-idle={dataAttr(isDragIdle)}\n data-loading={dataAttr(isLoading)}\n data-reject={dataAttr(isDragReject)}\n >\n <DropzoneLoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n\n <ui.input\n id={id}\n ref={ref}\n name={name}\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 { isLoading, 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 isOpen={isLoading}\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 { isDragAccept } = useDropzoneContext()\n\n return isDragAccept ? children : null\n}\n\nDropzoneAccept.displayName = \"DropzoneAccept\"\nDropzoneAccept.__ui__ = \"DropzoneAccept\"\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { isDragReject } = useDropzoneContext()\n\n return isDragReject ? children : null\n}\n\nDropzoneReject.displayName = \"DropzoneReject\"\nDropzoneReject.__ui__ = \"DropzoneReject\"\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { isDragIdle } = useDropzoneContext()\n\n return isDragIdle ? children : null\n}\n\nDropzoneIdle.displayName = \"DropzoneIdle\"\nDropzoneIdle.__ui__ = \"DropzoneIdle\"\n"],"mappings":"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","names":[]}
package/dist/index.mjs CHANGED
@@ -7,13 +7,13 @@ import {
7
7
  MS_POWER_POINT_ACCEPT_TYPE,
8
8
  MS_WORD_ACCEPT_TYPE,
9
9
  PDF_ACCEPT_TYPE
10
- } from "./chunk-CIOUYT32.mjs";
10
+ } from "./chunk-3DTTC4QM.mjs";
11
11
  import {
12
12
  Dropzone,
13
13
  DropzoneAccept,
14
14
  DropzoneIdle,
15
15
  DropzoneReject
16
- } from "./chunk-DRLF3PX5.mjs";
16
+ } from "./chunk-3QSKWUOX.mjs";
17
17
  export {
18
18
  ACCEPT_TYPES,
19
19
  Dropzone,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yamada-ui/dropzone",
3
- "version": "1.0.46-next-20241005220055",
3
+ "version": "1.0.46-next-20241008193728",
4
4
  "description": "Yamada UI dropzone component",
5
5
  "keywords": [
6
6
  "yamada",
@@ -37,11 +37,11 @@
37
37
  },
38
38
  "dependencies": {
39
39
  "react-dropzone-esm": "^15.0.1",
40
- "@yamada-ui/form-control": "2.1.4-next-20241005220055",
41
- "@yamada-ui/loading": "1.1.18-next-20241005220055",
42
- "@yamada-ui/core": "1.15.2-next-20241005220055",
43
- "@yamada-ui/transitions": "1.1.7-next-20241005220055",
44
- "@yamada-ui/utils": "1.5.2"
40
+ "@yamada-ui/core": "1.15.2-next-20241008193728",
41
+ "@yamada-ui/form-control": "2.1.4-next-20241008193728",
42
+ "@yamada-ui/loading": "1.1.18-next-20241008193728",
43
+ "@yamada-ui/transitions": "1.1.7-next-20241008193728",
44
+ "@yamada-ui/utils": "1.5.3-next-20241008193728"
45
45
  },
46
46
  "devDependencies": {
47
47
  "clean-package": "2.2.0",
package/dist/chunk-CIOUYT32.mjs.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/accept-types.ts"],"sourcesContent":["export const ACCEPT_TYPES = {\n txt: \"text/plain\",\n html: \"text/html\",\n csv: \"text/csv\",\n png: \"image/png\",\n gif: \"image/gif\",\n jpeg: \"image/jpeg\",\n svg: \"image/svg+xml\",\n webp: \"image/webp\",\n mp3: \"audio/mpeg\",\n mpeg: \"video/mpeg\",\n mp4: \"video/mp4\",\n zip: \"application/zip\",\n pdf: \"application/pdf\",\n doc: \"application/msword\",\n docx: \"application/vnd.openxmlformats-officedocument.wordprocessingml.document\",\n xls: \"application/vnd.ms-excel\",\n xlsx: \"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet\",\n ppt: \"application/vnd.ms-powerpoint\",\n pptx: \"application/vnd.openxmlformats-officedocument.presentationml.presentation\",\n exe: \"application/vnd.microsoft.portable-executable\",\n} as const\n\nexport const IMAGE_ACCEPT_TYPE = [\n ACCEPT_TYPES.png,\n ACCEPT_TYPES.gif,\n ACCEPT_TYPES.jpeg,\n ACCEPT_TYPES.svg,\n ACCEPT_TYPES.webp,\n]\nexport const PDF_ACCEPT_TYPE = [ACCEPT_TYPES.pdf]\nexport const MS_WORD_ACCEPT_TYPE = [ACCEPT_TYPES.doc, ACCEPT_TYPES.docx]\nexport const MS_EXCEL_ACCEPT_TYPE = [ACCEPT_TYPES.xls, ACCEPT_TYPES.xlsx]\nexport const MS_POWER_POINT_ACCEPT_TYPE = [ACCEPT_TYPES.ppt, ACCEPT_TYPES.pptx]\nexport const EXE_ACCEPT_TYPE = [ACCEPT_TYPES.exe]\n"],"mappings":";;;AAAO,IAAM,eAAe;AAAA,EAC1B,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AACP;AAEO,IAAM,oBAAoB;AAAA,EAC/B,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AACf;AACO,IAAM,kBAAkB,CAAC,aAAa,GAAG;AACzC,IAAM,sBAAsB,CAAC,aAAa,KAAK,aAAa,IAAI;AAChE,IAAM,uBAAuB,CAAC,aAAa,KAAK,aAAa,IAAI;AACjE,IAAM,6BAA6B,CAAC,aAAa,KAAK,aAAa,IAAI;AACvE,IAAM,kBAAkB,CAAC,aAAa,GAAG;","names":[]}
package/dist/chunk-DRLF3PX5.mjs.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/dropzone.tsx"],"sourcesContent":["import type {\n FC,\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport type { FadeProps } from \"@yamada-ui/transitions\"\nimport { Fade } from \"@yamada-ui/transitions\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport {\n assignRef,\n createContext,\n cx,\n dataAttr,\n isArray,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type { ForwardedRef, PropsWithChildren } from \"react\"\nimport { Fragment } from \"react\"\nimport type {\n Accept,\n DropzoneOptions as ReactDropzoneOptions,\n} from \"react-dropzone-esm\"\nimport { useDropzone } from \"react-dropzone-esm\"\n\ninterface DropzoneContext {\n isLoading?: boolean\n isDragAccept: boolean\n isDragReject: boolean\n isDragIdle: boolean\n styles: { [key: string]: CSSUIObject }\n}\n\nconst [DropzoneProvider, useDropzoneContext] = createContext<DropzoneContext>({\n name: \"DropzoneContext\",\n errorMessage: `useDropzoneContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Dropzone />\"`,\n})\n\ninterface DropzoneOptions {\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the dropzone loading icon.\n *\n * @default false\n */\n isLoading?: boolean\n /**\n * Props for dropzone overlay element.\n */\n overlayProps?: FadeProps\n /**\n * Props for dropzone loading icon element.\n */\n loadingProps?: LoadingProps\n /**\n * File types to accept.\n */\n accept?: Accept | string[]\n /**\n * Ref to a open function.\n */\n openRef?: ForwardedRef<() => void | undefined>\n}\n\nexport 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 const {\n id,\n name,\n className,\n isLoading,\n overlayProps,\n loadingProps,\n openRef,\n accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n children,\n ...rest\n } = useFormControlProps(omitThemeProps(mergedProps))\n\n const disabled = isLoading || rest.disabled || rest.readOnly\n\n const [formControlProps, containerProps] = splitObject(\n rest,\n formControlProperties,\n )\n\n const { getRootProps, getInputProps, isDragAccept, isDragReject, open } =\n useDropzone({\n disabled,\n accept: isArray(accept)\n ? accept.reduce((prev, current) => ({ ...prev, [current]: [] }), {})\n : accept,\n onDrop,\n onDropAccepted,\n onDropRejected,\n multiple,\n maxSize,\n maxFiles,\n autoFocus,\n noClick,\n noDrag,\n noDragEventsBubbling,\n noKeyboard,\n onDragEnter,\n onDragLeave,\n onDragOver,\n onFileDialogCancel,\n onFileDialogOpen,\n preventDropOnDocument,\n useFsAccessApi,\n })\n\n assignRef(openRef, open)\n\n const isDragIdle = !isDragAccept && !isDragReject\n\n const css: CSSUIObject = {\n position: \"relative\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.container,\n }\n\n return (\n <DropzoneProvider\n value={{ isLoading, isDragAccept, isDragReject, isDragIdle, styles }}\n >\n <ui.div\n className={cx(\"ui-dropzone\", className)}\n __css={css}\n {...containerProps}\n {...getRootProps({})}\n data-accept={dataAttr(isDragAccept)}\n data-reject={dataAttr(isDragReject)}\n data-idle={dataAttr(isDragIdle)}\n data-loading={dataAttr(isLoading)}\n >\n <LoadingOverlay loadingProps={loadingProps} {...overlayProps} />\n <ui.input\n ref={ref}\n id={id}\n name={name}\n {...formControlProps}\n {...getInputProps()}\n />\n {children}\n </ui.div>\n </DropzoneProvider>\n )\n})\n\nDropzone.displayName = \"Dropzone\"\nDropzone.__ui__ = \"Dropzone\"\n\ninterface LoadingOverlayProps extends FadeProps {\n loadingProps?: LoadingProps\n}\n\nconst LoadingOverlay: FC<LoadingOverlayProps> = ({ loadingProps, ...rest }) => {\n const { isLoading, styles } = useDropzoneContext()\n\n const css: CSSUIObject = {\n position: \"absolute\",\n top: 0,\n left: 0,\n w: \"100%\",\n h: \"100%\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n ...styles.overlay,\n }\n\n return (\n <Fade\n isOpen={isLoading}\n unmountOnExit\n className=\"ui-dropzone__overlay\"\n __css={css}\n {...rest}\n >\n <Loading\n className=\"ui-dropzone__overlay__loading\"\n fontSize=\"4xl\"\n {...loadingProps}\n />\n </Fade>\n )\n}\n\nLoadingOverlay.displayName = \"LoadingOverlay\"\nLoadingOverlay.__ui__ = \"LoadingOverlay\"\n\nexport const DropzoneAccept: FC<PropsWithChildren> = ({ children }) => {\n const { isDragAccept } = useDropzoneContext()\n\n return isDragAccept ? <Fragment>{children}</Fragment> : null\n}\n\nDropzoneAccept.displayName = \"DropzoneAccept\"\nDropzoneAccept.__ui__ = \"DropzoneAccept\"\n\nexport const DropzoneReject: FC<PropsWithChildren> = ({ children }) => {\n const { isDragReject } = useDropzoneContext()\n\n return isDragReject ? <Fragment>{children}</Fragment> : null\n}\n\nDropzoneReject.displayName = \"DropzoneReject\"\nDropzoneReject.__ui__ = \"DropzoneReject\"\n\nexport const DropzoneIdle: FC<PropsWithChildren> = ({ children }) => {\n const { isDragIdle } = useDropzoneContext()\n\n return isDragIdle ? <Fragment>{children}</Fragment> : null\n}\n\nDropzoneIdle.displayName = \"DropzoneIdle\"\nDropzoneIdle.__ui__ = \"DropzoneIdle\"\n"],"mappings":"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","names":[]}