@bagelink/vue 1.2.93 → 1.2.97

package/dist/index.cjs

@@ -15730,8 +15730,8 @@ const _hoisted_12$3 = {
   key: 1,
   class: "bgl-single-preview"
 };
-const _hoisted_13$1 = { class: "position-start m-05 flex opacity-7 z-99 gap-025" };
-const _hoisted_14$1 = {
+const _hoisted_13$2 = { class: "position-start m-05 flex opacity-7 z-99 gap-025" };
+const _hoisted_14$2 = {
   key: 0,
   class: "h-100"
 };
@@ -16081,7 +16081,7 @@ const _sfc_main$M = /* @__PURE__ */ vue.defineComponent({
                   key: file.id,
                   class: vue.normalizeClass(["single-image-item-preview", { "bgl_fill-image": _ctx.fill }])
                 }, [
-                  vue.createElementVNode("div", _hoisted_13$1, [
+                  vue.createElementVNode("div", _hoisted_13$2, [
                     vue.withDirectives(vue.createVNode(vue.unref(Btn), {
                       color: "gray",
                       thin: "",
@@ -16111,7 +16111,7 @@ const _sfc_main$M = /* @__PURE__ */ vue.defineComponent({
                       [_directive_tooltip, "Download"]
                     ])
                   ]),
-                  isImage(file.extension || file.url) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14$1, [
+                  isImage(file.extension || file.url) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14$2, [
                     vue.withDirectives(vue.createVNode(vue.unref(Image$1), {
                       class: "single-preview",
                       src: file.url,
@@ -27657,6 +27657,108 @@ const files = {
     return axios$1.get("/files_v2/list", { params: { dir_path: dirPath } });
   }
 };
+function useFileUpload(props2 = {}) {
+  files.setBaseUrl(useBagel().host);
+  const fileQueue = vue.ref([]);
+  const storageFiles = vue.ref([]);
+  const pk = vue.ref([]);
+  const pathKeys = vue.computed(() => {
+    const storagePathKeys = storageFiles.value.map((file) => file.path_key);
+    return [...pk.value, ...storagePathKeys];
+  });
+  const fileToUrl = (file) => URL.createObjectURL(file);
+  const addFile = (file) => {
+    if (!file) return;
+    let filesToAdd = [];
+    if (file instanceof File) {
+      filesToAdd = [file];
+    } else if (file instanceof FileList) {
+      filesToAdd = Array.from(file);
+    } else if (Array.isArray(file)) {
+      filesToAdd = file;
+    }
+    const newQueueFiles = filesToAdd.map((f2) => ({
+      name: f2.name,
+      file: f2,
+      progress: 0
+    }));
+    fileQueue.value.push(...newQueueFiles);
+  };
+  const removeFile = async (pathKeyOrFile) => {
+    if (typeof pathKeyOrFile === "string") {
+      storageFiles.value = storageFiles.value.filter((file) => file.path_key !== pathKeyOrFile);
+      const pathKeyIndex = pk.value.indexOf(pathKeyOrFile);
+      if (pathKeyIndex !== -1) {
+        pk.value.splice(pathKeyIndex, 1);
+      }
+      try {
+        await files.delete(pathKeyOrFile);
+      } catch (error) {
+        console.error("Error deleting file:", error);
+      }
+    } else if (pathKeyOrFile) {
+      const index2 = fileQueue.value.findIndex(({ file }) => file.name === pathKeyOrFile.name);
+      if (index2 !== -1) {
+        fileQueue.value.splice(index2, 1);
+      }
+    }
+  };
+  const flushQueue = async () => {
+    for (const file of fileQueue.value) {
+      file.uploading = true;
+      if (!props2.multiple) {
+        pk.value.splice(0, 1);
+      }
+      try {
+        const { data: data2 } = await files.upload(file.file, {
+          onUploadProgress: (e) => {
+            file.progress = e.loaded / e.total * 100 - 1;
+          },
+          dirPath: props2.dirPath
+        });
+        pk.value.push(data2.path_key);
+      } catch (error) {
+        console.error("Error uploading file:", error);
+      }
+    }
+    fileQueue.value = [];
+  };
+  const browse = (upload = false) => {
+    if (props2.disabled) return;
+    const input = document.createElement("input");
+    input.type = "file";
+    input.multiple = !!props2.multiple;
+    input.accept = props2.accept || "";
+    input.onchange = (e) => {
+      addFile(e.target.files);
+      if (upload) {
+        flushQueue();
+      }
+    };
+    input.click();
+  };
+  vue.onMounted(() => {
+    if (props2.dirPath) {
+      files.list(props2.dirPath).then((response) => {
+        const responseData = Array.isArray(response.data) ? response.data : [response.data];
+        storageFiles.value.push(...responseData);
+      }).catch((error) => {
+        console.error("Error loading files:", error);
+      });
+    }
+  });
+  return {
+    fileQueue,
+    storageFiles,
+    pk,
+    pathKeys,
+    fileToUrl,
+    removeFile,
+    flushQueue,
+    addFile,
+    browse
+  };
+}
 const _hoisted_1$o = { class: "bagel-input" };
 const _hoisted_2$e = { key: 0 };
 const _hoisted_3$b = {
@@ -27687,8 +27789,8 @@ const _hoisted_12$2 = {
   key: 1,
   class: "bgl-single-preview"
 };
-const _hoisted_13 = { class: "position-start m-05 flex opacity-7 z-99 gap-025" };
-const _hoisted_14 = {
+const _hoisted_13$1 = { class: "position-start m-05 flex opacity-7 z-99 gap-025" };
+const _hoisted_14$1 = {
   key: 0,
   class: "h-100"
 };
@@ -27722,111 +27824,61 @@ const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
   setup(__props, { emit: __emit }) {
     const props2 = __props;
     const emit2 = __emit;
-    const bagel = useBagel(bagelInjectionKey);
-    files.setBaseUrl(bagel.host);
-    const fileQueue = vue.ref([]);
-    let storageFiles = vue.ref([]);
-    const pk = vue.ref([props2.modelValue].flat().filter(Boolean));
-    const pathKeys = vue.computed(() => {
-      const sf = storageFiles.value.map((file) => file.path_key);
-      return [...pk.value, ...sf];
-    });
-    vue.watch(() => pk.value, (value) => {
-      if (props2.multiple) emit2("update:modelValue", value);
-      else emit2("update:modelValue", value[0] || void 0);
-    }, { deep: true });
+    const {
+      fileQueue,
+      pathKeys,
+      removeFile,
+      flushQueue,
+      fileToUrl,
+      addFile,
+      browse
+    } = useFileUpload({
+      disabled: props2.disabled,
+      dirPath: props2.dirPath,
+      multiple: props2.multiple,
+      accept: props2.accept
+    });
     const isImage = (str) => IMAGE_FORMATS_REGEXP.test(str);
-    const fileToUrl = (file) => URL.createObjectURL(file);
     let isDragOver = vue.ref(false);
-    async function removeFile(path_key) {
-      storageFiles.value = storageFiles.value.filter((file) => file.path_key !== path_key);
-      const pki = pk.value.indexOf(path_key);
-      if (pki !== -1) pk.value.splice(pki, 1);
-      try {
-        await files.delete(path_key);
-      } catch (error) {
-        console.error(error);
-      }
-    }
-    async function flushQueue() {
-      emit2("addFileStart");
-      for (const file of fileQueue.value) {
-        file.uploading = true;
-        if (!props2.multiple) pk.value.splice(0, 1);
-        try {
-          const { data: data2 } = await files.upload(file.file, {
-            onUploadProgress: (e) => {
-              file.progress = e.loaded / e.total * 100 - 1;
-            },
-            dirPath: props2.dirPath
-          });
-          pk.value.push(data2.path_key);
-        } catch (error) {
-          console.error("error flushing queue", error);
-        }
-      }
-      fileQueue.value.splice(0, fileQueue.value.length);
-    }
-    function browse() {
-      if (props2.disabled) return;
-      const input = document.createElement("input");
-      input.type = "file";
-      input.multiple = props2.multiple;
-      input.accept = props2.accept;
-      input.onchange = (e) => {
-        const files2 = Array.from(e.target.files || []);
-        fileQueue.value.push(...files2.map((file) => ({ name: file.name, file, progress: 0 })));
-        flushQueue();
-      };
-      input.click();
-    }
     function handleDrag(e, isDragging = false) {
       e.preventDefault();
       e.stopPropagation();
       if (!props2.disabled) isDragOver.value = isDragging;
     }
-    function handleDrop(e) {
+    async function handleDrop(e) {
       var _a;
       if (props2.disabled) return;
       e.preventDefault();
       e.stopPropagation();
-      if ((_a = e.dataTransfer) == null ? void 0 : _a.files) {
-        fileQueue.value.push(...Array.from(e.dataTransfer.files).map((file) => ({ name: file.name, file, progress: 0 })));
-        flushQueue();
-      }
+      emit2("addFileStart");
+      addFile((_a = e.dataTransfer) == null ? void 0 : _a.files);
+      await flushQueue();
+      emit2("update:modelValue", pathKeys.value);
       isDragOver.value = false;
     }
-    if (props2.dirPath) {
-      files.list(props2.dirPath).then((response) => storageFiles.value.push(...[response.data].flat())).catch(console.error);
-    }
-    vue.watch(() => props2.dirPath, () => {
-      if (props2.dirPath) {
-        files.list(props2.dirPath).then((response) => storageFiles.value.push(...[response.data].flat())).catch(console.error);
-      }
-    });
     return (_ctx, _cache) => {
       const _directive_tooltip = vue.resolveDirective("tooltip");
       const _directive_lightbox = vue.resolveDirective("lightbox");
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$o, [
         _ctx.label ? (vue.openBlock(), vue.createElementBlock("label", _hoisted_2$e, vue.toDisplayString(_ctx.label), 1)) : vue.createCommentVNode("", true),
-        _ctx.required && !pathKeys.value.length ? (vue.openBlock(), vue.createElementBlock("input", _hoisted_3$b)) : vue.createCommentVNode("", true),
+        _ctx.required && !vue.unref(pathKeys).length ? (vue.openBlock(), vue.createElementBlock("input", _hoisted_3$b)) : vue.createCommentVNode("", true),
         _ctx.theme === "basic" ? (vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$13), {
           key: 2,
           outline: "",
           class: "flex p-05 gap-1",
-          onDragover: _cache[0] || (_cache[0] = (e) => handleDrag(e, true)),
+          onDragover: _cache[2] || (_cache[2] = (e) => handleDrag(e, true)),
           onDrop: handleDrop
         }, {
           default: vue.withCtx(() => [
-            !pathKeys.value.length && !fileQueue.value.length ? (vue.openBlock(), vue.createBlock(vue.unref(Btn), {
+            !vue.unref(pathKeys).length && !vue.unref(fileQueue).length ? (vue.openBlock(), vue.createBlock(vue.unref(Btn), {
               key: 0,
               class: "px-1-5",
               icon: "upload",
               outline: "",
               value: _ctx.btnPlaceholder || "Upload",
-              onClick: browse
+              onClick: _cache[0] || (_cache[0] = ($event) => vue.unref(browse)(true))
             }, null, 8, ["value"])) : vue.createCommentVNode("", true),
-            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(pathKeys.value, (path_key) => {
+            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(pathKeys), (path_key) => {
               return vue.openBlock(), vue.createElementBlock("div", {
                 key: path_key,
                 class: "txt-gray txt-12 flex"
@@ -27836,7 +27888,7 @@ const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
                     color: "gray",
                     thin: "",
                     icon: "delete",
-                    onClick: ($event) => removeFile(path_key)
+                    onClick: ($event) => vue.unref(removeFile)(path_key)
                   }, null, 8, ["onClick"]), [
                     [_directive_tooltip, "Delete"]
                   ]),
@@ -27844,7 +27896,7 @@ const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
                     color: "gray",
                     thin: "",
                     icon: "autorenew",
-                    onClick: browse
+                    onClick: _cache[1] || (_cache[1] = ($event) => vue.unref(browse)(true))
                   }, null, 512), [
                     [_directive_tooltip, "Replace"]
                   ]),
@@ -27869,28 +27921,28 @@ const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
                 ])
               ]);
             }), 128)),
-            !pathKeys.value.length && !fileQueue.value.length ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_7$4, vue.toDisplayString(_ctx.noFilePlaceholder || "No file selected"), 1)) : vue.createCommentVNode("", true)
+            !vue.unref(pathKeys).length && !vue.unref(fileQueue).length ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_7$4, vue.toDisplayString(_ctx.noFilePlaceholder || "No file selected"), 1)) : vue.createCommentVNode("", true)
           ]),
           _: 1
         })) : (vue.openBlock(), vue.createElementBlock("div", {
           key: 3,
           class: vue.normalizeClass(["fileUploadWrap", {
-            "fileDropZone": !pathKeys.value.length && !fileQueue.value.length,
+            "fileDropZone": !vue.unref(pathKeys).length && !vue.unref(fileQueue).length,
             "dragover": vue.unref(isDragOver),
             "bgl_oval-upload": _ctx.oval
           }]),
           style: vue.normalizeStyle({ width: _ctx.width, height: _ctx.height }),
-          onClick: browse,
-          onDragover: _cache[1] || (_cache[1] = (e) => handleDrag(e, true)),
+          onClick: _cache[4] || (_cache[4] = ($event) => vue.unref(browse)(true)),
+          onDragover: _cache[5] || (_cache[5] = (e) => handleDrag(e, true)),
           onDrop: handleDrop,
-          onDragleave: _cache[2] || (_cache[2] = (e) => handleDrag(e))
+          onDragleave: _cache[6] || (_cache[6] = (e) => handleDrag(e))
         }, [
           vue.renderSlot(_ctx.$slots, "files", {
-            files: pathKeys.value,
-            fileQueue: fileQueue.value
+            files: vue.unref(pathKeys),
+            fileQueue: vue.unref(fileQueue)
           }, () => [
             _ctx.multiple ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_8$3, [
-              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(pathKeys.value, (path_key) => {
+              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(pathKeys), (path_key) => {
                 return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
                   key: path_key,
                   class: vue.normalizeClass(["multi-image-item-preview", { "bgl_fill-image": _ctx.fill }])
@@ -27910,13 +27962,13 @@ const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
                     flat: "",
                     icon: "delete",
                     color: "red",
-                    onClick: ($event) => removeFile(path_key)
+                    onClick: ($event) => vue.unref(removeFile)(path_key)
                   }, null, 8, ["onClick"])
                 ], 2)), [
                   [_directive_lightbox, { src: vue.unref(pathKeyToURL)(path_key), download: true }]
                 ]);
               }), 128)),
-              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(fileQueue.value, (file) => {
+              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(fileQueue), (file) => {
                 return vue.openBlock(), vue.createElementBlock("div", {
                   key: file.name,
                   class: vue.normalizeClass(["multi-image-item-preview", { "bgl_fill-image": _ctx.fill }])
@@ -27924,7 +27976,7 @@ const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
                   isImage(file.file.type) ? (vue.openBlock(), vue.createBlock(vue.unref(Image$1), {
                     key: 0,
                     class: "multi-preview",
-                    src: fileToUrl(file.file),
+                    src: vue.unref(fileToUrl)(file.file),
                     alt: ""
                   }, null, 8, ["src"])) : (vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$u), {
                     key: 1,
@@ -27944,18 +27996,18 @@ const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
                   ], 6)
                 ], 2);
               }), 128))
-            ])) : pathKeys.value.length > 0 || fileQueue.value.length > 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12$2, [
-              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(pathKeys.value, (path_key) => {
+            ])) : vue.unref(pathKeys).length > 0 || vue.unref(fileQueue).length > 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12$2, [
+              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(pathKeys), (path_key) => {
                 return vue.openBlock(), vue.createElementBlock("div", {
                   key: path_key,
                   class: vue.normalizeClass(["single-image-item-preview", { "bgl_fill-image": _ctx.fill }])
                 }, [
-                  vue.createElementVNode("div", _hoisted_13, [
+                  vue.createElementVNode("div", _hoisted_13$1, [
                     vue.withDirectives(vue.createVNode(vue.unref(Btn), {
                       color: "gray",
                       thin: "",
                       icon: "delete",
-                      onClick: ($event) => removeFile(path_key)
+                      onClick: ($event) => vue.unref(removeFile)(path_key)
                     }, null, 8, ["onClick"]), [
                       [_directive_tooltip, "Delete"]
                     ]),
@@ -27963,7 +28015,7 @@ const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
                       color: "gray",
                       thin: "",
                       icon: "autorenew",
-                      onClick: browse
+                      onClick: _cache[3] || (_cache[3] = ($event) => vue.unref(browse)(true))
                     }, null, 512), [
                       [_directive_tooltip, "Replace"]
                     ]),
@@ -27977,7 +28029,7 @@ const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
                       [_directive_tooltip, "Download"]
                     ])
                   ]),
-                  isImage(path_key) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14, [
+                  isImage(path_key) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14$1, [
                     vue.withDirectives(vue.createVNode(vue.unref(Image$1), {
                       class: "single-preview",
                       pathKey: path_key,
@@ -27996,7 +28048,7 @@ const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
                   ])
                 ], 2);
               }), 128)),
-              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(fileQueue.value, (file) => {
+              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(fileQueue), (file) => {
                 return vue.openBlock(), vue.createElementBlock("div", {
                   key: file.name,
                   class: vue.normalizeClass(["single-image-item-preview", { "bgl_fill-image": _ctx.fill }])
@@ -28014,20 +28066,20 @@ const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
                   isImage(file.file.type) ? vue.withDirectives((vue.openBlock(), vue.createBlock(vue.unref(Image$1), {
                     key: 0,
                     class: "single-preview",
-                    src: fileToUrl(file.file),
+                    src: vue.unref(fileToUrl)(file.file),
                     alt: ""
                   }, null, 8, ["src"])), [
-                    [_directive_lightbox, { src: fileToUrl(file.file), download: true }]
+                    [_directive_lightbox, { src: vue.unref(fileToUrl)(file.file), download: true }]
                   ]) : vue.createCommentVNode("", true)
                 ], 2);
               }), 128))
             ])) : vue.createCommentVNode("", true)
           ], true),
-          !pathKeys.value.length && !fileQueue.value.length || _ctx.multiple ? vue.renderSlot(_ctx.$slots, "placeholder", {
+          !vue.unref(pathKeys).length && !vue.unref(fileQueue).length || _ctx.multiple ? vue.renderSlot(_ctx.$slots, "placeholder", {
             key: 0,
-            files: pathKeys.value,
-            fileQueue: fileQueue.value,
-            browse
+            files: vue.unref(pathKeys),
+            fileQueue: vue.unref(fileQueue),
+            browse: vue.unref(browse)
           }, () => [
             vue.createElementVNode("p", _hoisted_16, [
               vue.createVNode(vue.unref(_sfc_main$u), { icon: "upload_2" }),
@@ -28039,7 +28091,7 @@ const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const UploadInput = /* @__PURE__ */ _export_sfc(_sfc_main$v, [["__scopeId", "data-v-d8f3ff01"]]);
+const UploadInput = /* @__PURE__ */ _export_sfc(_sfc_main$v, [["__scopeId", "data-v-38a4d4a9"]]);
 const FONT_AWESOME_ICONS = [
   "trash-can",
   "message",
@@ -34065,8 +34117,8 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
   },
   setup(__props) {
     vue.useCssVars((_ctx) => ({
-      "dbb738e2": computedBackgroundColor.value,
-      "418961aa": cumputedTextColor.value
+      "09d70b6a": computedBackgroundColor.value,
+      "69df9534": cumputedTextColor.value
     }));
     const props2 = __props;
     const slots = vue.useSlots();
@@ -34150,7 +34202,8 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
               vue.createVNode(vue.unref(Btn), vue.mergeProps({
                 class: "bgl_pill-btn",
                 round: "",
-                thin: ""
+                thin: "",
+                flat: ""
               }, _ctx.btnEnd), null, 16)
             ])) : vue.createCommentVNode("", true)
           ]))
@@ -34159,7 +34212,7 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const Pill = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-764b6b8b"]]);
+const Pill = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-ae730ec5"]]);
 const _sfc_main$8 = {};
 function _sfc_render$2(_ctx, _cache) {
   const _component_router_view = vue.resolveComponent("router-view");
@@ -36589,17 +36642,22 @@ const _hoisted_3 = {
   class: "center"
 };
 const _hoisted_4 = { key: 3 };
-const _hoisted_5 = ["src", "title"];
-const _hoisted_6 = {
+const _hoisted_5 = {
+  key: 2,
+  class: "vw90"
+};
+const _hoisted_6 = ["src", "title"];
+const _hoisted_7 = {
   key: 3,
-  class: "file-info txt-white flex m_block align-items-start gap-025"
+  class: "vw90"
 };
-const _hoisted_7 = { class: "txt-start" };
-const _hoisted_8 = { class: "mx-0 light" };
-const _hoisted_9 = { class: "semi word-break-all" };
-const _hoisted_10 = { class: "mx-0" };
-const _hoisted_11 = { class: "semi" };
-const _hoisted_12 = {
+const _hoisted_8 = { class: "file-info txt-white flex m_block align-items-start gap-025" };
+const _hoisted_9 = { class: "txt-start" };
+const _hoisted_10 = { class: "mx-0 light" };
+const _hoisted_11 = { class: "semi word-break-all" };
+const _hoisted_12 = { class: "mx-0" };
+const _hoisted_13 = { class: "semi" };
+const _hoisted_14 = {
   key: 0,
   class: "flex justify-content-center mt-2 overflow p-1 fixed bottom start end gap-1 m_justify-content-start"
 };
@@ -36654,11 +36712,21 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       if (zoom.value === 1) close();
     }
     const upgradeHeaders = (url) => url.replace(/http:\/\//, "//");
+    function downloadFile() {
+      const link = document.createElement("a");
+      const src = currentItem.value.src || "";
+      link.target = "_blank";
+      link.href = upgradeHeaders(src);
+      link.download = src ? src.split("/").pop() || "download" : "download";
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+    }
     __expose({ open, close });
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createBlock(vue.Transition, { name: "fade" }, {
         default: vue.withCtx(() => {
-          var _a, _b, _c, _d, _e2, _f, _g, _h, _i, _j;
+          var _a, _b, _c, _d, _e2, _f, _g, _h, _i;
           return [
             vue.unref(isOpen) ? (vue.openBlock(), vue.createElementBlock("div", {
               key: 0,
@@ -36738,10 +36806,9 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                     flat: "",
                     icon: "download",
                     value: "Download File",
-                    href: upgradeHeaders((_h = vue.unref(currentItem)) == null ? void 0 : _h.src),
-                    download: ""
-                  }, null, 8, ["href"])) : vue.createCommentVNode("", true),
-                  !((_i = vue.unref(currentItem)) == null ? void 0 : _i.openFile) && !((_j = vue.unref(currentItem)) == null ? void 0 : _j.download) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4)) : vue.createCommentVNode("", true)
+                    onClick: downloadFile
+                  })) : vue.createCommentVNode("", true),
+                  !((_h = vue.unref(currentItem)) == null ? void 0 : _h.openFile) && !((_i = vue.unref(currentItem)) == null ? void 0 : _i.download) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4)) : vue.createCommentVNode("", true)
                 ]),
                 vue.createVNode(vue.unref(Carousel), {
                   index: vue.unref(currentIndex),
@@ -36777,44 +36844,47 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                           autoplay: "",
                           controls: "",
                           class: "vw90"
-                        }, null, 8, ["src"])) : (item == null ? void 0 : item.type) === "pdf" && (item == null ? void 0 : item.src) ? (vue.openBlock(), vue.createElementBlock("embed", {
-                          key: 2,
-                          src: vue.unref(normalizeURL)(item == null ? void 0 : item.src),
-                          type: "application/pdf",
-                          width: "100%",
-                          height: "1080",
-                          title: item == null ? void 0 : item.name,
-                          class: "vw90"
-                        }, null, 8, _hoisted_5)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_6, [
-                          vue.createVNode(vue.unref(_sfc_main$u), {
-                            class: "m-0 m_none",
-                            icon: "draft",
-                            size: 10,
-                            weight: "12"
-                          }),
-                          vue.createVNode(vue.unref(_sfc_main$u), {
-                            class: "m-0 none m_block m_-mb-1",
-                            icon: "draft",
-                            size: 4,
-                            weight: "2"
-                          }),
-                          vue.createElementVNode("div", _hoisted_7, [
-                            vue.createElementVNode("p", _hoisted_8, [
-                              _cache[6] || (_cache[6] = vue.createTextVNode(" File: ")),
-                              vue.createElementVNode("span", _hoisted_9, vue.toDisplayString(item == null ? void 0 : item.name), 1)
-                            ]),
-                            vue.createElementVNode("p", _hoisted_10, [
-                              _cache[7] || (_cache[7] = vue.createTextVNode(" Type: ")),
-                              vue.createElementVNode("span", _hoisted_11, vue.toDisplayString(item == null ? void 0 : item.type), 1)
-                            ]),
-                            vue.createVNode(vue.unref(Btn), {
-                              href: item == null ? void 0 : item.src,
-                              target: "_blank",
-                              round: "",
-                              thin: "",
-                              class: "mt-1",
-                              value: "Open file"
-                            }, null, 8, ["href"])
+                        }, null, 8, ["src"])) : (item == null ? void 0 : item.type) === "pdf" && (item == null ? void 0 : item.src) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, [
+                          vue.createElementVNode("embed", {
+                            src: vue.unref(normalizeURL)(item == null ? void 0 : item.src),
+                            type: "application/pdf",
+                            width: "100%",
+                            height: "1080",
+                            title: item == null ? void 0 : item.name,
+                            class: "vw90"
+                          }, null, 8, _hoisted_6)
+                        ])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_7, [
+                          vue.createElementVNode("div", _hoisted_8, [
+                            vue.createVNode(vue.unref(_sfc_main$u), {
+                              class: "m-0 m_none",
+                              icon: "draft",
+                              size: 10,
+                              weight: "12"
+                            }),
+                            vue.createVNode(vue.unref(_sfc_main$u), {
+                              class: "m-0 none m_block m_-mb-1",
+                              icon: "draft",
+                              size: 4,
+                              weight: "2"
+                            }),
+                            vue.createElementVNode("div", _hoisted_9, [
+                              vue.createElementVNode("p", _hoisted_10, [
+                                _cache[6] || (_cache[6] = vue.createTextVNode(" File: ")),
+                                vue.createElementVNode("span", _hoisted_11, vue.toDisplayString(item == null ? void 0 : item.name), 1)
+                              ]),
+                              vue.createElementVNode("p", _hoisted_12, [
+                                _cache[7] || (_cache[7] = vue.createTextVNode(" Type: ")),
+                                vue.createElementVNode("span", _hoisted_13, vue.toDisplayString(item == null ? void 0 : item.type), 1)
+                              ]),
+                              vue.createVNode(vue.unref(Btn), {
+                                href: item == null ? void 0 : item.src,
+                                target: "_blank",
+                                round: "",
+                                thin: "",
+                                class: "mt-1",
+                                value: "Open file"
+                              }, null, 8, ["href"])
+                            ])
                           ])
                         ]))
                       ], 64);
@@ -36822,7 +36892,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                   ]),
                   _: 1
                 }, 8, ["index", "class", "freeDrag"]),
-                vue.unref(group) && vue.unref(group).length > 1 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12, [
+                vue.unref(group) && vue.unref(group).length > 1 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14, [
                   (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(group), (item, index2) => {
                     return vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: index2 }, [
                       item.type === "image" ? (vue.openBlock(), vue.createBlock(vue.unref(Image$1), {
@@ -36849,7 +36919,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const Lightbox = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-fb2d5763"]]);
+const Lightbox = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-4789af69"]]);
 const groups = {};
 let clickHandler = (_e2) => void 0;
 const lightboxDirective = {
@@ -38111,6 +38181,7 @@ exports.useDebounceFn = useDebounceFn;
 exports.useDevice = useDevice;
 exports.useDraggable = useDraggable;
 exports.useEscape = useEscape;
+exports.useFileUpload = useFileUpload;
 exports.useForm = useForm;
 exports.useI18nT = useI18nT;
 exports.useLang = useLang;