@mantine-vue/dropzone 3.0.0 → 3.2.0
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/cjs/index.cjs +356 -290
- package/cjs/index.cjs.map +1 -1
- package/esm/index.mjs +353 -289
- package/esm/index.mjs.map +1 -1
- package/lib/components/Dropzone/Dropzone.types.d.ts +102 -0
- package/lib/components/Dropzone/Dropzone.vue.d.ts +32 -0
- package/lib/components/Dropzone/index.d.ts +19 -0
- package/lib/components/DropzoneFullScreen/DropzoneFullScreen.types.d.ts +30 -0
- package/lib/components/DropzoneFullScreen/DropzoneFullScreen.vue.d.ts +33 -0
- package/lib/components/DropzoneFullScreen/index.d.ts +11 -0
- package/lib/components/DropzoneStatus/DropzoneAccept.vue.d.ts +3 -0
- package/lib/components/DropzoneStatus/DropzoneIdle.vue.d.ts +3 -0
- package/lib/components/DropzoneStatus/DropzoneReject.vue.d.ts +3 -0
- package/lib/components/DropzoneStatus/DropzoneStatus.types.d.ts +8 -0
- package/lib/components/DropzoneStatus/DropzoneStatus.vue.d.ts +8 -0
- package/lib/components/DropzoneStatus/index.d.ts +4 -0
- package/lib/index.d.mts +6 -6
- package/lib/index.d.ts +6 -6
- package/package.json +3 -3
- package/lib/Dropzone.d.ts +0 -1240
- package/lib/DropzoneFullScreen.d.ts +0 -101
- package/lib/DropzoneStatus.d.ts +0 -58
package/esm/index.mjs
CHANGED
|
@@ -1,38 +1,9 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { Box, LoadingOverlay, OptionalPortal, createSafeContext, createVarsResolver, factory, getDefaultZIndex, getRadius, useProps, useStyles } from "@mantine-vue/core";
|
|
2
|
+
import { cloneVNode, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, guardReactiveProps, isVNode, mergeProps, normalizeProps, onMounted, onUnmounted, openBlock, reactive, ref, renderSlot, resolveDynamicComponent, unref, useAttrs, useSlots, watch, withCtx } from "vue";
|
|
2
3
|
import { assignRef, useDisclosure } from "@mantine-vue/hooks";
|
|
3
|
-
import { Box, LoadingOverlay, OptionalPortal, createSafeContext, createVarsResolver, getDefaultZIndex, getRadius, useProps, useStyles, withBoxProps } from "@mantine-vue/core";
|
|
4
4
|
//#region src/Dropzone.context.ts
|
|
5
5
|
var [provideDropzoneContext, useDropzoneContext] = createSafeContext("Dropzone component was not found in tree");
|
|
6
6
|
//#endregion
|
|
7
|
-
//#region src/DropzoneStatus.ts
|
|
8
|
-
function upperFirst(value) {
|
|
9
|
-
return value.charAt(0).toUpperCase() + value.slice(1);
|
|
10
|
-
}
|
|
11
|
-
function createDropzoneStatus(status) {
|
|
12
|
-
return defineComponent({
|
|
13
|
-
name: `Dropzone${upperFirst(status)}`,
|
|
14
|
-
slots: Object,
|
|
15
|
-
props: { children: {
|
|
16
|
-
type: null,
|
|
17
|
-
default: void 0
|
|
18
|
-
} },
|
|
19
|
-
setup(props, { slots, attrs }) {
|
|
20
|
-
const ctx = useDropzoneContext();
|
|
21
|
-
return () => {
|
|
22
|
-
if (!ctx[status]) return null;
|
|
23
|
-
const slotChildren = slots.default?.();
|
|
24
|
-
const children = props.children !== void 0 ? props.children : slotChildren;
|
|
25
|
-
const child = Array.isArray(children) && children.length === 1 ? children[0] : children;
|
|
26
|
-
if (isVNode(child) && !Array.isArray(child)) return cloneVNode(child, attrs);
|
|
27
|
-
return h("span", attrs, children);
|
|
28
|
-
};
|
|
29
|
-
}
|
|
30
|
-
});
|
|
31
|
-
}
|
|
32
|
-
var DropzoneAccept = createDropzoneStatus("accept");
|
|
33
|
-
var DropzoneReject = createDropzoneStatus("reject");
|
|
34
|
-
var DropzoneIdle = createDropzoneStatus("idle");
|
|
35
|
-
//#endregion
|
|
36
7
|
//#region src/get-files-from-event.ts
|
|
37
8
|
function toFileWithPath(file, path) {
|
|
38
9
|
const fileWithPath = file;
|
|
@@ -458,19 +429,8 @@ var Dropzone_module_default = {
|
|
|
458
429
|
dropzone: "_dropzone_27ynu_71"
|
|
459
430
|
};
|
|
460
431
|
//#endregion
|
|
461
|
-
//#region src/Dropzone.ts
|
|
462
|
-
var
|
|
463
|
-
multiple: true,
|
|
464
|
-
maxSize: Infinity,
|
|
465
|
-
activateOnClick: true,
|
|
466
|
-
activateOnDrag: true,
|
|
467
|
-
dragEventsBubbling: true,
|
|
468
|
-
activateOnKeyboard: true,
|
|
469
|
-
useFsAccessApi: false,
|
|
470
|
-
preventDropOnDocument: true,
|
|
471
|
-
variant: "light",
|
|
472
|
-
rejectColor: "red"
|
|
473
|
-
};
|
|
432
|
+
//#region src/components/Dropzone/Dropzone.vue?vue&type=script&setup=true&lang.ts
|
|
433
|
+
var _hoisted_1 = ["data-enable-pointer-events"];
|
|
474
434
|
var varsResolver = createVarsResolver((theme, { radius, variant, acceptColor, rejectColor }) => {
|
|
475
435
|
const acceptColors = theme.variantColorResolver({
|
|
476
436
|
color: acceptColor || theme.primaryColor,
|
|
@@ -490,22 +450,17 @@ var varsResolver = createVarsResolver((theme, { radius, variant, acceptColor, re
|
|
|
490
450
|
"--dropzone-reject-bg": rejectColors.background
|
|
491
451
|
} };
|
|
492
452
|
});
|
|
493
|
-
|
|
453
|
+
//#endregion
|
|
454
|
+
//#region src/components/Dropzone/Dropzone.vue
|
|
455
|
+
var Dropzone_default = /* @__PURE__ */ defineComponent({
|
|
494
456
|
name: "Dropzone",
|
|
495
457
|
inheritAttrs: false,
|
|
458
|
+
__name: "Dropzone",
|
|
496
459
|
props: {
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
},
|
|
501
|
-
rejectColor: {
|
|
502
|
-
type: String,
|
|
503
|
-
default: void 0
|
|
504
|
-
},
|
|
505
|
-
radius: {
|
|
506
|
-
type: [String, Number],
|
|
507
|
-
default: void 0
|
|
508
|
-
},
|
|
460
|
+
rootRef: {},
|
|
461
|
+
acceptColor: {},
|
|
462
|
+
rejectColor: { default: "red" },
|
|
463
|
+
radius: {},
|
|
509
464
|
disabled: {
|
|
510
465
|
type: Boolean,
|
|
511
466
|
default: false
|
|
@@ -514,133 +469,69 @@ var DropzoneBaseComponent = defineComponent({
|
|
|
514
469
|
type: Boolean,
|
|
515
470
|
default: false
|
|
516
471
|
},
|
|
517
|
-
accept: {
|
|
518
|
-
|
|
519
|
-
default: void 0
|
|
520
|
-
},
|
|
472
|
+
accept: {},
|
|
473
|
+
openRef: {},
|
|
521
474
|
multiple: {
|
|
522
475
|
type: Boolean,
|
|
523
|
-
default:
|
|
524
|
-
},
|
|
525
|
-
maxSize: {
|
|
526
|
-
type: Number,
|
|
527
|
-
default: void 0
|
|
528
|
-
},
|
|
529
|
-
name: {
|
|
530
|
-
type: String,
|
|
531
|
-
default: void 0
|
|
532
|
-
},
|
|
533
|
-
maxFiles: {
|
|
534
|
-
type: Number,
|
|
535
|
-
default: void 0
|
|
536
|
-
},
|
|
537
|
-
autoFocus: {
|
|
538
|
-
type: Boolean,
|
|
539
|
-
default: false
|
|
476
|
+
default: true
|
|
540
477
|
},
|
|
478
|
+
maxSize: { default: Infinity },
|
|
479
|
+
name: {},
|
|
480
|
+
maxFiles: {},
|
|
481
|
+
autoFocus: { type: Boolean },
|
|
541
482
|
activateOnClick: {
|
|
542
483
|
type: Boolean,
|
|
543
|
-
default:
|
|
484
|
+
default: true
|
|
544
485
|
},
|
|
545
486
|
activateOnDrag: {
|
|
546
487
|
type: Boolean,
|
|
547
|
-
default:
|
|
488
|
+
default: true
|
|
548
489
|
},
|
|
549
490
|
activateOnKeyboard: {
|
|
550
491
|
type: Boolean,
|
|
551
|
-
default:
|
|
492
|
+
default: true
|
|
552
493
|
},
|
|
553
494
|
dragEventsBubbling: {
|
|
554
495
|
type: Boolean,
|
|
555
|
-
default:
|
|
496
|
+
default: true
|
|
556
497
|
},
|
|
557
498
|
preventDropOnDocument: {
|
|
558
499
|
type: Boolean,
|
|
559
|
-
default:
|
|
500
|
+
default: true
|
|
560
501
|
},
|
|
561
502
|
useFsAccessApi: {
|
|
562
503
|
type: Boolean,
|
|
563
|
-
default:
|
|
504
|
+
default: false
|
|
564
505
|
},
|
|
506
|
+
getFilesFromEvent: {},
|
|
507
|
+
validator: {},
|
|
565
508
|
enablePointerEvents: {
|
|
566
509
|
type: Boolean,
|
|
567
510
|
default: false
|
|
568
511
|
},
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
},
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
},
|
|
577
|
-
inputProps: {
|
|
578
|
-
type: Object,
|
|
579
|
-
default: void 0
|
|
580
|
-
},
|
|
581
|
-
validator: {
|
|
582
|
-
type: Function,
|
|
583
|
-
default: void 0
|
|
584
|
-
},
|
|
585
|
-
getFilesFromEvent: {
|
|
586
|
-
type: Function,
|
|
587
|
-
default: void 0
|
|
588
|
-
},
|
|
589
|
-
openRef: {
|
|
590
|
-
type: [Object, Function],
|
|
591
|
-
default: void 0
|
|
592
|
-
},
|
|
593
|
-
onDrop: {
|
|
594
|
-
type: Function,
|
|
595
|
-
required: true
|
|
596
|
-
},
|
|
597
|
-
onDropAny: {
|
|
598
|
-
type: Function,
|
|
599
|
-
default: void 0
|
|
600
|
-
},
|
|
601
|
-
onReject: {
|
|
602
|
-
type: Function,
|
|
603
|
-
default: void 0
|
|
604
|
-
},
|
|
605
|
-
onDragEnter: {
|
|
606
|
-
type: Function,
|
|
607
|
-
default: void 0
|
|
608
|
-
},
|
|
609
|
-
onDragLeave: {
|
|
610
|
-
type: Function,
|
|
611
|
-
default: void 0
|
|
612
|
-
},
|
|
613
|
-
onDragOver: {
|
|
614
|
-
type: Function,
|
|
615
|
-
default: void 0
|
|
616
|
-
},
|
|
617
|
-
onFileDialogCancel: {
|
|
618
|
-
type: Function,
|
|
619
|
-
default: void 0
|
|
620
|
-
},
|
|
621
|
-
onFileDialogOpen: {
|
|
622
|
-
type: Function,
|
|
623
|
-
default: void 0
|
|
624
|
-
},
|
|
625
|
-
classNames: {
|
|
626
|
-
type: [Object, Function],
|
|
627
|
-
default: void 0
|
|
628
|
-
},
|
|
629
|
-
styles: {
|
|
630
|
-
type: [Object, Function],
|
|
631
|
-
default: void 0
|
|
632
|
-
},
|
|
633
|
-
vars: {
|
|
634
|
-
type: [Object, Function],
|
|
635
|
-
default: void 0
|
|
636
|
-
},
|
|
637
|
-
unstyled: {
|
|
638
|
-
type: Boolean,
|
|
639
|
-
default: false
|
|
640
|
-
}
|
|
512
|
+
loaderProps: {},
|
|
513
|
+
inputProps: {},
|
|
514
|
+
variant: { default: "light" },
|
|
515
|
+
classNames: {},
|
|
516
|
+
styles: {},
|
|
517
|
+
vars: {},
|
|
518
|
+
unstyled: { type: Boolean }
|
|
641
519
|
},
|
|
642
|
-
|
|
643
|
-
|
|
520
|
+
emits: [
|
|
521
|
+
"drop-any",
|
|
522
|
+
"drop",
|
|
523
|
+
"reject",
|
|
524
|
+
"drag-enter",
|
|
525
|
+
"drag-leave",
|
|
526
|
+
"drag-over",
|
|
527
|
+
"file-dialog-cancel",
|
|
528
|
+
"file-dialog-open"
|
|
529
|
+
],
|
|
530
|
+
setup(__props, { expose: __expose, emit: __emit }) {
|
|
531
|
+
const rawProps = __props;
|
|
532
|
+
const emit = __emit;
|
|
533
|
+
const props = useProps("Dropzone", null, rawProps);
|
|
534
|
+
const attrs = useAttrs();
|
|
644
535
|
const getStyles = useStyles({
|
|
645
536
|
name: "Dropzone",
|
|
646
537
|
classes: Dropzone_module_default,
|
|
@@ -654,8 +545,8 @@ var DropzoneBaseComponent = defineComponent({
|
|
|
654
545
|
unstyled: props.unstyled
|
|
655
546
|
});
|
|
656
547
|
const dz = useDropzone({
|
|
657
|
-
accept: () => Array.isArray(props.accept) ? props.accept.reduce((
|
|
658
|
-
...
|
|
548
|
+
accept: () => Array.isArray(props.accept) ? props.accept.reduce((result, key) => ({
|
|
549
|
+
...result,
|
|
659
550
|
[key]: []
|
|
660
551
|
}), {}) : props.accept,
|
|
661
552
|
disabled: () => props.disabled || props.loading,
|
|
@@ -671,127 +562,267 @@ var DropzoneBaseComponent = defineComponent({
|
|
|
671
562
|
useFsAccessApi: () => props.useFsAccessApi,
|
|
672
563
|
validator: () => props.validator,
|
|
673
564
|
getFilesFromEvent: () => props.getFilesFromEvent,
|
|
674
|
-
onDrop: (files,
|
|
675
|
-
onDropAccepted: (files) =>
|
|
676
|
-
onDropRejected: (
|
|
677
|
-
onDragEnter: (event) =>
|
|
678
|
-
onDragLeave: (event) =>
|
|
679
|
-
onDragOver: (event) =>
|
|
680
|
-
onFileDialogCancel: () =>
|
|
681
|
-
onFileDialogOpen: () =>
|
|
565
|
+
onDrop: (files, rejected) => emit("drop-any", files, rejected),
|
|
566
|
+
onDropAccepted: (files) => emit("drop", files),
|
|
567
|
+
onDropRejected: (rejected) => emit("reject", rejected),
|
|
568
|
+
onDragEnter: (event) => emit("drag-enter", event),
|
|
569
|
+
onDragLeave: (event) => emit("drag-leave", event),
|
|
570
|
+
onDragOver: (event) => emit("drag-over", event),
|
|
571
|
+
onFileDialogCancel: () => emit("file-dialog-cancel"),
|
|
572
|
+
onFileDialogOpen: () => emit("file-dialog-open")
|
|
682
573
|
});
|
|
683
|
-
|
|
574
|
+
watch(() => props.openRef, (value) => assignRef(value, dz.open), { immediate: true });
|
|
575
|
+
const accepted = computed(() => dz.isDragActive.value && dz.isDragAccept.value);
|
|
576
|
+
const rejected = computed(() => dz.isDragActive.value && dz.isDragReject.value);
|
|
577
|
+
const idle = computed(() => !accepted.value && !rejected.value);
|
|
684
578
|
provideDropzoneContext({
|
|
685
579
|
get accept() {
|
|
686
|
-
return
|
|
580
|
+
return accepted.value;
|
|
687
581
|
},
|
|
688
582
|
get reject() {
|
|
689
|
-
return
|
|
583
|
+
return rejected.value;
|
|
690
584
|
},
|
|
691
585
|
get idle() {
|
|
692
|
-
|
|
693
|
-
const rejected = dz.isDragActive.value && dz.isDragReject.value;
|
|
694
|
-
return !accepted && !rejected;
|
|
586
|
+
return idle.value;
|
|
695
587
|
}
|
|
696
588
|
});
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
|
|
730
|
-
|
|
589
|
+
const rootAttrs = () => ({
|
|
590
|
+
...dz.getRootProps(),
|
|
591
|
+
...getStyles("root"),
|
|
592
|
+
...attrs,
|
|
593
|
+
mod: [{
|
|
594
|
+
accept: accepted.value,
|
|
595
|
+
reject: rejected.value,
|
|
596
|
+
idle: idle.value,
|
|
597
|
+
disabled: props.disabled,
|
|
598
|
+
loading: props.loading,
|
|
599
|
+
"activate-on-click": props.activateOnClick
|
|
600
|
+
}, attrs.mod]
|
|
601
|
+
});
|
|
602
|
+
const inputAttrs = () => ({
|
|
603
|
+
...dz.getInputProps(props.inputProps),
|
|
604
|
+
name: props.name
|
|
605
|
+
});
|
|
606
|
+
const rootElement = ref(null);
|
|
607
|
+
const setRootRef = (node) => {
|
|
608
|
+
rootElement.value = node;
|
|
609
|
+
assignRef(props.rootRef, node);
|
|
610
|
+
};
|
|
611
|
+
__expose({ rootElement });
|
|
612
|
+
return (_ctx, _cache) => {
|
|
613
|
+
return openBlock(), createBlock(unref(Box), mergeProps({ rootRef: setRootRef }, rootAttrs()), {
|
|
614
|
+
default: withCtx(() => [
|
|
615
|
+
createVNode(unref(LoadingOverlay), {
|
|
616
|
+
visible: unref(props).loading,
|
|
617
|
+
"overlay-props": { radius: unref(props).radius },
|
|
618
|
+
unstyled: unref(props).unstyled,
|
|
619
|
+
"loader-props": unref(props).loaderProps
|
|
620
|
+
}, null, 8, [
|
|
621
|
+
"visible",
|
|
622
|
+
"overlay-props",
|
|
623
|
+
"unstyled",
|
|
624
|
+
"loader-props"
|
|
625
|
+
]),
|
|
626
|
+
createElementVNode("input", normalizeProps(guardReactiveProps(inputAttrs())), null, 16),
|
|
627
|
+
createElementVNode("div", mergeProps(unref(getStyles)("inner"), { "data-enable-pointer-events": unref(props).enablePointerEvents || void 0 }), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_1)
|
|
628
|
+
]),
|
|
629
|
+
_: 3
|
|
630
|
+
}, 16);
|
|
731
631
|
};
|
|
732
632
|
}
|
|
733
633
|
});
|
|
734
|
-
|
|
634
|
+
//#endregion
|
|
635
|
+
//#region src/components/DropzoneStatus/DropzoneStatus.vue
|
|
636
|
+
var DropzoneStatus_default = /* @__PURE__ */ defineComponent({
|
|
637
|
+
name: "DropzoneStatus",
|
|
638
|
+
inheritAttrs: false,
|
|
639
|
+
__name: "DropzoneStatus",
|
|
640
|
+
props: {
|
|
641
|
+
children: { type: [
|
|
642
|
+
Object,
|
|
643
|
+
String,
|
|
644
|
+
Number,
|
|
645
|
+
Boolean,
|
|
646
|
+
null,
|
|
647
|
+
Array
|
|
648
|
+
] },
|
|
649
|
+
status: {}
|
|
650
|
+
},
|
|
651
|
+
setup(__props) {
|
|
652
|
+
const props = __props;
|
|
653
|
+
const slots = useSlots();
|
|
654
|
+
const attrs = useAttrs();
|
|
655
|
+
const ctx = useDropzoneContext();
|
|
656
|
+
const renderContent = () => {
|
|
657
|
+
const slotChildren = slots.default?.();
|
|
658
|
+
const children = props.children !== void 0 ? props.children : slotChildren;
|
|
659
|
+
const child = Array.isArray(children) && children.length === 1 ? children[0] : children;
|
|
660
|
+
return isVNode(child) && !Array.isArray(child) ? cloneVNode(child, attrs) : child;
|
|
661
|
+
};
|
|
662
|
+
return (_ctx, _cache) => {
|
|
663
|
+
return unref(ctx)[props.status] && isVNode(renderContent()) ? (openBlock(), createBlock(resolveDynamicComponent(renderContent), { key: 0 })) : unref(ctx)[props.status] ? (openBlock(), createElementBlock("span", normalizeProps(mergeProps({ key: 1 }, unref(attrs))), [(openBlock(), createBlock(resolveDynamicComponent(renderContent)))], 16)) : createCommentVNode("", true);
|
|
664
|
+
};
|
|
665
|
+
}
|
|
666
|
+
});
|
|
667
|
+
//#endregion
|
|
668
|
+
//#region src/components/DropzoneStatus/DropzoneAccept.vue
|
|
669
|
+
var DropzoneAccept_default = /* @__PURE__ */ defineComponent({
|
|
670
|
+
name: "DropzoneAccept",
|
|
671
|
+
inheritAttrs: false,
|
|
672
|
+
__name: "DropzoneAccept",
|
|
673
|
+
props: { children: { type: [
|
|
674
|
+
Object,
|
|
675
|
+
String,
|
|
676
|
+
Number,
|
|
677
|
+
Boolean,
|
|
678
|
+
null,
|
|
679
|
+
Array
|
|
680
|
+
] } },
|
|
681
|
+
setup(__props) {
|
|
682
|
+
const slots = useSlots();
|
|
683
|
+
return (_ctx, _cache) => {
|
|
684
|
+
return openBlock(), createBlock(DropzoneStatus_default, mergeProps({
|
|
685
|
+
..._ctx.$props,
|
|
686
|
+
..._ctx.$attrs
|
|
687
|
+
}, {
|
|
688
|
+
status: "accept",
|
|
689
|
+
children: unref(slots).default?.()
|
|
690
|
+
}), null, 16, ["children"]);
|
|
691
|
+
};
|
|
692
|
+
}
|
|
693
|
+
});
|
|
694
|
+
//#endregion
|
|
695
|
+
//#region src/components/DropzoneStatus/DropzoneReject.vue
|
|
696
|
+
var DropzoneReject_default = /* @__PURE__ */ defineComponent({
|
|
697
|
+
name: "DropzoneReject",
|
|
698
|
+
inheritAttrs: false,
|
|
699
|
+
__name: "DropzoneReject",
|
|
700
|
+
props: { children: { type: [
|
|
701
|
+
Object,
|
|
702
|
+
String,
|
|
703
|
+
Number,
|
|
704
|
+
Boolean,
|
|
705
|
+
null,
|
|
706
|
+
Array
|
|
707
|
+
] } },
|
|
708
|
+
setup(__props) {
|
|
709
|
+
const slots = useSlots();
|
|
710
|
+
return (_ctx, _cache) => {
|
|
711
|
+
return openBlock(), createBlock(DropzoneStatus_default, mergeProps({
|
|
712
|
+
..._ctx.$props,
|
|
713
|
+
..._ctx.$attrs
|
|
714
|
+
}, {
|
|
715
|
+
status: "reject",
|
|
716
|
+
children: unref(slots).default?.()
|
|
717
|
+
}), null, 16, ["children"]);
|
|
718
|
+
};
|
|
719
|
+
}
|
|
720
|
+
});
|
|
721
|
+
//#endregion
|
|
722
|
+
//#region src/components/DropzoneStatus/DropzoneIdle.vue
|
|
723
|
+
var DropzoneIdle_default = /* @__PURE__ */ defineComponent({
|
|
724
|
+
name: "DropzoneIdle",
|
|
725
|
+
inheritAttrs: false,
|
|
726
|
+
__name: "DropzoneIdle",
|
|
727
|
+
props: { children: { type: [
|
|
728
|
+
Object,
|
|
729
|
+
String,
|
|
730
|
+
Number,
|
|
731
|
+
Boolean,
|
|
732
|
+
null,
|
|
733
|
+
Array
|
|
734
|
+
] } },
|
|
735
|
+
setup(__props) {
|
|
736
|
+
const slots = useSlots();
|
|
737
|
+
return (_ctx, _cache) => {
|
|
738
|
+
return openBlock(), createBlock(DropzoneStatus_default, mergeProps({
|
|
739
|
+
..._ctx.$props,
|
|
740
|
+
..._ctx.$attrs
|
|
741
|
+
}, {
|
|
742
|
+
status: "idle",
|
|
743
|
+
children: unref(slots).default?.()
|
|
744
|
+
}), null, 16, ["children"]);
|
|
745
|
+
};
|
|
746
|
+
}
|
|
747
|
+
});
|
|
748
|
+
//#endregion
|
|
749
|
+
//#region src/components/Dropzone/index.ts
|
|
750
|
+
var Dropzone$1 = factory(Dropzone_default, {
|
|
735
751
|
classes: Dropzone_module_default,
|
|
736
752
|
varsResolver,
|
|
737
|
-
Accept:
|
|
738
|
-
Idle:
|
|
739
|
-
Reject:
|
|
753
|
+
Accept: DropzoneAccept_default,
|
|
754
|
+
Idle: DropzoneIdle_default,
|
|
755
|
+
Reject: DropzoneReject_default
|
|
740
756
|
});
|
|
741
757
|
//#endregion
|
|
742
|
-
//#region src/DropzoneFullScreen.ts
|
|
743
|
-
var
|
|
744
|
-
maxSize: Infinity,
|
|
745
|
-
activateOnDrag: true,
|
|
746
|
-
dragEventsBubbling: true,
|
|
747
|
-
activateOnKeyboard: true,
|
|
748
|
-
active: true,
|
|
749
|
-
zIndex: getDefaultZIndex("max"),
|
|
750
|
-
withinPortal: true
|
|
751
|
-
};
|
|
752
|
-
var DropzoneFullScreen = withBoxProps(defineComponent({
|
|
758
|
+
//#region src/components/DropzoneFullScreen/index.ts
|
|
759
|
+
var DropzoneFullScreen = factory(/* @__PURE__ */ defineComponent({
|
|
753
760
|
name: "DropzoneFullScreen",
|
|
754
761
|
inheritAttrs: false,
|
|
762
|
+
__name: "DropzoneFullScreen",
|
|
755
763
|
props: {
|
|
756
764
|
active: {
|
|
757
765
|
type: Boolean,
|
|
758
|
-
default:
|
|
759
|
-
},
|
|
760
|
-
onDrop: {
|
|
761
|
-
type: Function,
|
|
762
|
-
required: true
|
|
763
|
-
},
|
|
764
|
-
onReject: {
|
|
765
|
-
type: Function,
|
|
766
|
-
default: void 0
|
|
767
|
-
},
|
|
768
|
-
zIndex: {
|
|
769
|
-
type: [String, Number],
|
|
770
|
-
default: void 0
|
|
766
|
+
default: true
|
|
771
767
|
},
|
|
768
|
+
zIndex: { default: getDefaultZIndex("max") },
|
|
772
769
|
withinPortal: {
|
|
773
770
|
type: Boolean,
|
|
774
|
-
default:
|
|
775
|
-
},
|
|
776
|
-
portalProps: {
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
},
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
771
|
+
default: true
|
|
772
|
+
},
|
|
773
|
+
portalProps: {},
|
|
774
|
+
classNames: {},
|
|
775
|
+
styles: {},
|
|
776
|
+
rootRef: {},
|
|
777
|
+
acceptColor: {},
|
|
778
|
+
rejectColor: {},
|
|
779
|
+
radius: {},
|
|
780
|
+
disabled: { type: Boolean },
|
|
781
|
+
loading: { type: Boolean },
|
|
782
|
+
accept: {},
|
|
783
|
+
openRef: {},
|
|
784
|
+
multiple: { type: Boolean },
|
|
785
|
+
maxSize: { default: Infinity },
|
|
786
|
+
name: {},
|
|
787
|
+
maxFiles: {},
|
|
788
|
+
autoFocus: { type: Boolean },
|
|
789
|
+
activateOnClick: { type: Boolean },
|
|
790
|
+
activateOnDrag: {
|
|
791
|
+
type: Boolean,
|
|
792
|
+
default: true
|
|
783
793
|
},
|
|
784
|
-
|
|
785
|
-
type:
|
|
786
|
-
default:
|
|
794
|
+
activateOnKeyboard: {
|
|
795
|
+
type: Boolean,
|
|
796
|
+
default: true
|
|
787
797
|
},
|
|
788
|
-
|
|
798
|
+
dragEventsBubbling: {
|
|
789
799
|
type: Boolean,
|
|
790
|
-
default:
|
|
791
|
-
}
|
|
800
|
+
default: true
|
|
801
|
+
},
|
|
802
|
+
preventDropOnDocument: { type: Boolean },
|
|
803
|
+
useFsAccessApi: { type: Boolean },
|
|
804
|
+
getFilesFromEvent: {},
|
|
805
|
+
validator: {},
|
|
806
|
+
enablePointerEvents: { type: Boolean },
|
|
807
|
+
loaderProps: {},
|
|
808
|
+
inputProps: {},
|
|
809
|
+
unstyled: { type: Boolean }
|
|
792
810
|
},
|
|
793
|
-
|
|
794
|
-
|
|
811
|
+
emits: [
|
|
812
|
+
"drop-any",
|
|
813
|
+
"drop",
|
|
814
|
+
"reject",
|
|
815
|
+
"drag-enter",
|
|
816
|
+
"drag-leave",
|
|
817
|
+
"drag-over",
|
|
818
|
+
"file-dialog-cancel",
|
|
819
|
+
"file-dialog-open"
|
|
820
|
+
],
|
|
821
|
+
setup(__props, { expose: __expose, emit: __emit }) {
|
|
822
|
+
const rawProps = __props;
|
|
823
|
+
const emit = __emit;
|
|
824
|
+
const props = useProps("DropzoneFullScreen", null, rawProps);
|
|
825
|
+
const attrs = useAttrs();
|
|
795
826
|
const getStyles = useStyles({
|
|
796
827
|
name: "DropzoneFullScreen",
|
|
797
828
|
classes: Dropzone_module_default,
|
|
@@ -805,63 +836,96 @@ var DropzoneFullScreen = withBoxProps(defineComponent({
|
|
|
805
836
|
});
|
|
806
837
|
const counter = ref(0);
|
|
807
838
|
const [visible, { open, close }] = useDisclosure(false);
|
|
808
|
-
|
|
839
|
+
function reset() {
|
|
840
|
+
close();
|
|
841
|
+
counter.value = 0;
|
|
842
|
+
}
|
|
843
|
+
function handleDragEnter(event) {
|
|
809
844
|
if (event.dataTransfer?.types.includes("Files")) {
|
|
810
845
|
counter.value += 1;
|
|
811
846
|
open();
|
|
812
847
|
}
|
|
813
|
-
}
|
|
814
|
-
|
|
815
|
-
counter.value
|
|
816
|
-
}
|
|
848
|
+
}
|
|
849
|
+
function handleDragLeave() {
|
|
850
|
+
counter.value = Math.max(0, counter.value - 1);
|
|
851
|
+
}
|
|
817
852
|
watch(counter, (value) => {
|
|
818
853
|
if (value === 0) close();
|
|
819
854
|
});
|
|
820
855
|
let attached = false;
|
|
821
|
-
|
|
856
|
+
function attach() {
|
|
822
857
|
if (attached) return;
|
|
823
858
|
document.addEventListener("dragenter", handleDragEnter, false);
|
|
824
859
|
document.addEventListener("dragleave", handleDragLeave, false);
|
|
825
860
|
attached = true;
|
|
826
|
-
}
|
|
827
|
-
|
|
861
|
+
}
|
|
862
|
+
function detach() {
|
|
828
863
|
if (!attached) return;
|
|
829
864
|
document.removeEventListener("dragenter", handleDragEnter, false);
|
|
830
865
|
document.removeEventListener("dragleave", handleDragLeave, false);
|
|
831
866
|
attached = false;
|
|
832
|
-
}
|
|
867
|
+
}
|
|
833
868
|
watch(() => props.active, (active) => {
|
|
834
869
|
detach();
|
|
835
870
|
if (active) attach();
|
|
871
|
+
else reset();
|
|
836
872
|
}, { immediate: true });
|
|
837
873
|
onUnmounted(detach);
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
|
|
861
|
-
|
|
862
|
-
|
|
874
|
+
const rootElement = ref(null);
|
|
875
|
+
const setRootRef = (node) => {
|
|
876
|
+
const element = node && "$el" in node ? node.$el : node;
|
|
877
|
+
rootElement.value = element;
|
|
878
|
+
assignRef(props.rootRef, element);
|
|
879
|
+
};
|
|
880
|
+
__expose({ rootElement });
|
|
881
|
+
const dropzoneAttrs = () => {
|
|
882
|
+
const rest = Object.fromEntries(Object.entries(props).filter(([key]) => ![
|
|
883
|
+
"active",
|
|
884
|
+
"zIndex",
|
|
885
|
+
"withinPortal",
|
|
886
|
+
"portalProps",
|
|
887
|
+
"classNames",
|
|
888
|
+
"styles"
|
|
889
|
+
].includes(key)));
|
|
890
|
+
const { classNames, styles } = props;
|
|
891
|
+
return {
|
|
892
|
+
...rest,
|
|
893
|
+
...attrs,
|
|
894
|
+
activateOnClick: false,
|
|
895
|
+
classNames,
|
|
896
|
+
styles,
|
|
897
|
+
class: Dropzone_module_default.dropzone,
|
|
898
|
+
onDrop: (files) => {
|
|
899
|
+
emit("drop", files);
|
|
900
|
+
reset();
|
|
901
|
+
},
|
|
902
|
+
onReject: (rejections) => {
|
|
903
|
+
emit("reject", rejections);
|
|
904
|
+
reset();
|
|
905
|
+
},
|
|
906
|
+
onDropAny: (files, rejections) => emit("drop-any", files, rejections),
|
|
907
|
+
onDragEnter: (event) => emit("drag-enter", event),
|
|
908
|
+
onDragLeave: (event) => emit("drag-leave", event),
|
|
909
|
+
onDragOver: (event) => emit("drag-over", event),
|
|
910
|
+
onFileDialogCancel: () => emit("file-dialog-cancel"),
|
|
911
|
+
onFileDialogOpen: () => emit("file-dialog-open")
|
|
912
|
+
};
|
|
913
|
+
};
|
|
914
|
+
return (_ctx, _cache) => {
|
|
915
|
+
return openBlock(), createBlock(unref(OptionalPortal), mergeProps(unref(props).portalProps, { "within-portal": unref(props).withinPortal }), {
|
|
916
|
+
default: withCtx(() => [createElementVNode("div", mergeProps({ ref: setRootRef }, unref(getStyles)("fullScreen", { style: {
|
|
917
|
+
opacity: unref(visible) ? 1 : 0,
|
|
918
|
+
pointerEvents: unref(visible) ? "all" : "none",
|
|
919
|
+
zIndex: unref(props).zIndex
|
|
920
|
+
} })), [createVNode(Dropzone_default, normalizeProps(guardReactiveProps(dropzoneAttrs())), {
|
|
921
|
+
default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
|
|
922
|
+
_: 3
|
|
923
|
+
}, 16)], 16)]),
|
|
924
|
+
_: 3
|
|
925
|
+
}, 16, ["within-portal"]);
|
|
926
|
+
};
|
|
863
927
|
}
|
|
864
|
-
}));
|
|
928
|
+
}), { classes: Dropzone_module_default });
|
|
865
929
|
//#endregion
|
|
866
930
|
//#region src/mime-types.ts
|
|
867
931
|
var MIME_TYPES = {
|
|
@@ -907,6 +971,6 @@ var EXE_MIME_TYPE = [MIME_TYPES.exe];
|
|
|
907
971
|
Object.assign(Dropzone$1, { FullScreen: DropzoneFullScreen });
|
|
908
972
|
var Dropzone = Dropzone$1;
|
|
909
973
|
//#endregion
|
|
910
|
-
export { Dropzone, DropzoneAccept, DropzoneFullScreen, DropzoneIdle, DropzoneReject, EXE_MIME_TYPE, ErrorCode, FILE_INVALID_TYPE, FILE_TOO_LARGE, FILE_TOO_SMALL, IMAGE_MIME_TYPE, MIME_TYPES, MS_EXCEL_MIME_TYPE, MS_POWERPOINT_MIME_TYPE, MS_WORD_MIME_TYPE, PDF_MIME_TYPE, TOO_MANY_FILES, TOO_MANY_FILES_REJECTION, acceptPropAsAcceptAttr, allFilesAccepted, canUseFileSystemAccessAPI, fileAccepted, fileMatchSize, getInvalidTypeRejectionErr, getTooLargeRejectionErr, getTooSmallRejectionErr, isAbort, isDataTransferItemWithEmptyType, isEvtWithFiles, isExt, isMIMEType, isSecurityError, pickerOptionsFromAccept, useDropzone };
|
|
974
|
+
export { Dropzone, DropzoneAccept_default as DropzoneAccept, DropzoneFullScreen, DropzoneIdle_default as DropzoneIdle, DropzoneReject_default as DropzoneReject, EXE_MIME_TYPE, ErrorCode, FILE_INVALID_TYPE, FILE_TOO_LARGE, FILE_TOO_SMALL, IMAGE_MIME_TYPE, MIME_TYPES, MS_EXCEL_MIME_TYPE, MS_POWERPOINT_MIME_TYPE, MS_WORD_MIME_TYPE, PDF_MIME_TYPE, TOO_MANY_FILES, TOO_MANY_FILES_REJECTION, acceptPropAsAcceptAttr, allFilesAccepted, canUseFileSystemAccessAPI, fileAccepted, fileMatchSize, getInvalidTypeRejectionErr, getTooLargeRejectionErr, getTooSmallRejectionErr, isAbort, isDataTransferItemWithEmptyType, isEvtWithFiles, isExt, isMIMEType, isSecurityError, pickerOptionsFromAccept, useDropzone };
|
|
911
975
|
|
|
912
976
|
//# sourceMappingURL=index.mjs.map
|