@xuda.io/xuda-widget-plugin-xuda-drive 1.0.97 → 1.0.99

package/dist/es/runtime.es.js

@@ -1,860 +0,0 @@
-import { r as registerPlugin, p as plugin, a as plugin$1, b as plugin$2, c as plugin$3, g as getEditorDefaults, d as create$f, l as legacyDataToImageState, e as processImage, f as createDefaultImageWriter, h as createDefaultImageReader, o as openEditor, i as createApp, u as useDebounceFn, S as Swiper, j as useDropZone, k as hooks, G as Gt } from "./vendor-C-Nj-m2v.mjs";
-async function upload(fields, e) {
-  return new Promise(async (resolve, reject) => {
-    var u;
-    var overrideAction = "replace", existingFiles = {};
-    fields.method = e.method;
-    var ret_obj = { app_files: [], addedArr: [], deletedArr: [] }, init_files = [], widget_cssClass = fields.widget_cssClass, pond = void 0, init_files_fn = (i) => {
-      $.each(i, function(l, a) {
-        a != null && a.server_fileName && (a = a.server_fileName), a = func.utils.get_drive_url(e.SESSION_ID, a).value, ret_obj.app_files.push(a), init_files.push({
-          source: a,
-          options: {
-            type: "local"
-          }
-        });
-      });
-    };
-    _.isEmpty(fields.file_upload_init_file_array) || (typeof fields.file_upload_init_file_array == "string" && (fields.file_upload_init_file_array = eval(fields.file_upload_init_file_array)), (u = fields.file_upload_init_file_array) != null && u.length && init_files_fn(fields.file_upload_init_file_array));
-    var initialBindValue;
-    if (!_.isEmpty(fields["xu-bind"])) {
-      initialBindValue = await e.api_utils.get_field_value(fields["xu-bind"]);
-      let i = initialBindValue;
-      typeof i == "string" && (i = i.split(",").filter((l) => l)), i != null && i.length && init_files_fn(i);
-    }
-    const do_callback = function(i) {
-      setTimeout(async () => {
-        var l = pond.getFiles();
-        if (ret_obj.app_files = [], l.forEach((p) => {
-          var n = { data: {} };
-          i ? n.data.server_fileName = p.serverId : n.data = JSON.parse(p.serverId).data, ret_obj.app_files.push(n.data);
-        }), !_.isEmpty(fields["xu-bind"])) {
-          var a = ret_obj.app_files;
-          typeof initialBindValue == "string" && (a = ret_obj.app_files.map((p) => p.server_fileName).join(",")), await e.api_utils.set_field_value(fields["xu-bind"], a);
-        }
-        i && fields.event_name_for_successful_remove_callback && await e.api_utils.invoke_event(fields.event_name_for_successful_remove_callback), !i && fields.event_name_for_successful_callback && await e.api_utils.invoke_event(fields.event_name_for_successful_callback), fields.clear_on_file_upload && (pond.removeFiles(), e.api_utils.set_field_value(fields["xu-bind"], []));
-      }, 100);
-    };
-    var $pallet_wrapper = $('<div class="image_wrapper" style="border: none !important;">'), input_id = (/* @__PURE__ */ new Date()).valueOf(), $imgInp = $(`<input   class="filepond ${widget_cssClass}"  id="${input_id}" />`).appendTo($pallet_wrapper);
-    e.$containerP.html($pallet_wrapper), registerPlugin(plugin), registerPlugin(plugin$1), registerPlugin(plugin$2), registerPlugin(plugin$3);
-    const axios_ajax = function(i, l) {
-      $.each(l, function(a, p) {
-        e.append(a, p);
-      }), fetch(i, {
-        method: "POST",
-        body: e
-      }).then((a) => {
-        console.log("Request complete! response:", a);
-      });
-    };
-    var opt = {
-      allowProcess: !0,
-      allowRemove: !0,
-      allowRevert: !0,
-      imageCropAspectRatio: 1,
-      imageResizeTargetWidth: 200,
-      // allowProcess: false,
-      imageEditInstantEdit: !1,
-      credits: !1,
-      allowMultiple: !1,
-      imageEditorSupportImage: (i) => i.type !== "image/svg+xml" && i.type !== "image/gif" && !i.type.includes("audio") && !i.type.includes("video"),
-      imageEditor: {
-        createEditor: openEditor,
-        imageReader: [createDefaultImageReader],
-        imageWriter: [createDefaultImageWriter],
-        imageProcessor: processImage,
-        editorOptions: {
-          ...getEditorDefaults()
-        },
-        legacyDataToImageState
-      },
-      server: {
-        load: (i, l, a, p, n, h) => {
-          try {
-            fetch(i).then(function(v) {
-              try {
-                if (v.ok) return v.blob();
-                throw new Error("bad image");
-              } catch {
-                a({});
-              }
-            }).then(l).catch((v) => {
-              a({});
-            });
-          } catch {
-            a({});
-          }
-          return {
-            abort: () => {
-              n();
-            }
-          };
-        },
-        process: (i, l, a, p, n, h, v, g, k) => {
-          var w;
-          let f = new FormData();
-          f.append("file", l, l.name);
-          const { app_id: m, gtp_token: x, app_token: t } = e._session;
-          f.append("app_id_reference", (w = APP_OBJ == null ? void 0 : APP_OBJ[m]) == null ? void 0 : w.app_id_reference), f.append("app_id", m), f.append("gtp_token", x), f.append("app_token", t), f.append("drive_type", "workspace"), fields.file_upload_folder && f.append("folder", fields.file_upload_folder), fields.public_file && f.append("make_public", fields.public_file);
-          let o = fields.assign_file_tags || [], d = [];
-          if (fields.auto_tag_generator) {
-            let r = fields.auto_tag_identifier || " ";
-            if (d = l.name.split(".").slice(0, -1).join(".").split(r), fields.auto_tag_translation)
-              for (let b of d)
-                fields.auto_tag_translation[b] && (b = fields.auto_tag_translation[b]);
-          }
-          f.append("tags", [...o, ...d]);
-          const s = new XMLHttpRequest();
-          let c = e._session.domain;
-          return e._session.is_deployment && (c = e._session.opt.regional_server === "dev.xuda.io" ? "dev.xuda.io" : "xuda.io"), overrideAction === "replace" && l.name in existingFiles ? (f.append("file_path", "/" + l.name), f.append("file_name", l.name), s.open("POST", `https://${c}/cpi/update_drive_file_workspace`)) : s.open("POST", `https://${c}/cpi/upload_drive_file_workspace`), s.setRequestHeader("xu-gtp-token", x), s.setRequestHeader("xu-app-token", t), s.upload.onprogress = (r) => {
-            h(r.lengthComputable, r.loaded, r.total);
-          }, s.onload = async function() {
-            var r = {};
-            try {
-              r = JSON.parse(s.responseText);
-            } catch {
-            }
-            if (s.status >= 200 && s.status < 300 && r.code > 0) {
-              p(s.responseText);
-              var y = r.data;
-              ret_obj.addedArr.push(y), delete r.code, ret_obj.app_files.push(y);
-            } else
-              n(r.data);
-          }, s.onerror = () => {
-            var r = JSON.parse(s.responseText);
-            n(r.data), this.$emit("error", n);
-          }, s.send(f), {
-            abort: () => {
-              s.abort(), v();
-            }
-          };
-        },
-        revert: (i, l, a) => {
-          var p = JSON.parse(i), n = p.data;
-          ret_obj.deletedArr.push(n);
-          var h = ret_obj.app_files.indexOf(n.server_fileName);
-          h !== -1 && ret_obj.app_files.splice(h, 1);
-          let v = e._session.app_id, g = APP_OBJ[v].app_id_reference;
-          axios_ajax(func.common.get_url(e.SESSION_ID, "rpi", "runtime_delete_file_bulk"), {
-            app_id: v,
-            server_files: ret_obj.deletedArr,
-            app_id_reference: g,
-            gtp_token: e._session.gtp_token
-          }), l();
-        },
-        remove: (i, l, a) => {
-          var p = i.split("/").pop();
-          ret_obj.deletedArr.push(p);
-          var n = ret_obj.app_files.indexOf((h) => h.server_fileName === i);
-          n !== -1 && ret_obj.app_files.splice(n, 1), fields.instant_file_upload !== "N" && do_callback(!0), l();
-        }
-      }
-    };
-    if (fields.file_upload_drop_area_label && (opt.labelIdle = fields.file_upload_drop_area_label), fields.file_upload_allow_multiple_files && (opt.allowMultiple = !0), init_files && (opt.files = init_files), opt.instantUpload = fields.instant_file_upload !== "N", fields.file_upload_mime_type_preset)
-      switch (fields.file_upload_mime_type_preset) {
-        case "image":
-          opt.acceptedFileTypes = ["image/*"];
-          break;
-        case "video":
-          opt.acceptedFileTypes = ["video/*"];
-          break;
-        case "audio":
-          opt.acceptedFileTypes = ["audio/*"];
-          break;
-        default:
-          opt.acceptedFileTypes = ["image/*"];
-      }
-    else
-      fields.file_upload_custom_mime_types ? opt.acceptedFileTypes = fields.file_upload_custom_mime_types.split(",") : opt.allowFileTypeValidation = !1;
-    fields.file_upload_mask === "circle" && (opt.imagePreviewHeight = 170, opt.imageCropAspectRatio = "1:1", opt.imageResizeTargetWidth = 200, opt.imageResizeTargetHeight = 200, opt.stylePanelLayout = "compact circle", opt.styleLoadIndicatorPosition = "center bottom", opt.styleProgressIndicatorPosition = "right bottom", opt.styleButtonRemoveItemPosition = "left bottom", opt.styleButtonProcessItemPosition = "right bottom"), pond = create$f($imgInp[0], opt), pond.on("processfiles", (i) => {
-      do_callback();
-    });
-    function processFiles(i, l = {}) {
-      overrideAction = l.overrideAction, existingFiles = l.existingFiles, i ? pond.processFiles(i) : pond.processFiles();
-    }
-    resolve({
-      pond,
-      processFiles
-    });
-  });
-}
-async function viewer(u, i) {
-  const { app_id: l, gtp_token: a, app_token: p } = i._session;
-  var n = {
-    template: `
-                <div class="relative isolate [--spinner-dots-stroke-dasharray:0_3.315] [--spinner-stroke:1] [--spinner-thumb-animation-duration:1.5s] *:size-full">
-                <span class="sr-only">Loading…</span>
-
-                <span class="absolute grid place-items-center inset-0 font-semibold">
-                  <slot> </slot>
-                </span>
-
-                <svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-                  <g class="motion-safe:origin-[--spinner-origin] motion-safe:animate-spin motion-safe:will-change-transform motion-safe:[animation-direction:reverse] motion-safe:[animation-duration:12s]" fill="currentColor" opacity="0.5">
-                    <circle cx="8" cy="2.75" r="0.5"></circle>
-                    <circle cx="8" cy="13.25" r="0.5"></circle>
-                    <circle cx="3.01001" cy="6.35999" r="0.5"></circle>
-                    <circle cx="12.98" cy="6.35999" r="0.5"></circle>
-                    <circle cx="3.01001" cy="9.62" r="0.5"></circle>
-                    <circle cx="12.99" cy="9.62" r="0.5"></circle>
-                    <circle cx="4.91998" cy="3.75" r="0.5"></circle>
-                    <circle cx="11.08" cy="3.75" r="0.5"></circle>
-                    <circle cx="4.91998" cy="12.25" r="0.5"></circle>
-                    <circle cx="11.08" cy="12.25" r="0.5"></circle>
-                  </g>
-
-                  <circle
-                    class="motion-safe:origin-[--spinner-origin] motion-safe:animate-spin motion-safe:will-change-transform motion-safe:[animation-duration:--spinner-thumb-animation-duration]"
-                    cx="8"
-                    cy="8"
-                    r="5.25"
-                    pathLength="360"
-                    stroke="currentColor"
-                    stroke-linecap="round"
-                    stroke-linejoin="round"
-                    stroke-dashoffset="100"
-                    stroke-dasharray="90 270"
-                    stroke-width="var(--spinner-stroke,1.5)"
-                  ></circle>
-                </svg>
-              </div>
-    `
-  }, h = {
-    props: ["options", "modelValue"],
-    computed: {
-      model: {
-        get() {
-          var t = this.modelValue;
-          return t;
-        },
-        set(t) {
-          this.$emit("update:modelValue", t);
-        }
-      },
-      segmentActive() {
-        var t = _.findIndex(this.options, (o) => o.value === this.model);
-        return t;
-      }
-    },
-    template: `
-          <div class="flex relative items-center rounded-lg bg-gray-100 [&>button]:px-4 [&>button]:py-2">
-          <button v-for="option in options" @click="model = option.value" type="button" class="flex items-center gap-2 text-gray-500 focus:outline-none relative z-20 text-sm">
-            <span v-html="option.icon"/> 
-            <div class="truncate empty:hidden">{{ option.label }}</div>
-            <span class="sr-only">Use {{option.label}} view</span>
-          </button>
-        
-        
-          <div :style="{ left: segmentActive > 0 ? (Number(segmentActive) / options.length) * 100 + '%' : 0, width: 100 / options.length + '%' }" class="after:absolute transition-all duration-300 after:inset-[3px] after:bg-white after:rounded-lg after:shadow absolute h-full rounded"></div>
-        </div>
-    `
-  }, v = {
-    props: ["file", "size"],
-    template: `
-
-  
-      <div class="aspect-[3/2] group relative block w-full overflow-hidden rounded-lg bg-gray-100 border">
-          <div v-if="size === 'sm' && (file.extension === 'mp3' || file.extension === 'mp4')">
-              <svg class="h-5 w-10" v-if="file.extension === 'mp3'" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
-                <path fill="#dc2625" d="M12,20a1.00061,1.00061,0,0,1-.625-.21875L6.64941,16H3a.99943.99943,0,0,1-1-1V9A.99943.99943,0,0,1,3,8H6.64941L11.375,4.21875A1.00025,1.00025,0,0,1,13,5V19a.9993.9993,0,0,1-1,1Z" />
-                <path fill="#f1a8a7" d="M18.501,18.3623a.99995.99995,0,0,1-.64356-1.76562,6.00231,6.00231,0,0,0,.38574-8.83984.9999.9999,0,0,1,1.41407-1.41407,8.00064,8.00064,0,0,1-.51465,11.78516A.99536.99536,0,0,1,18.501,18.3623Z" />
-                <path fill="#ea7c7c" d="M15.92969,15.29785a1,1,0,0,1-.64356-1.7666A1.99114,1.99114,0,0,0,16,12a2.01438,2.01438,0,0,0-.58594-1.41406.99989.99989,0,0,1,1.41406-1.41406,3.99974,3.99974,0,0,1-.25683,5.89257A.99968.99968,0,0,1,15.92969,15.29785Z" />
-              </svg>
-
-              <svg class="h-5 w-10" v-else-if="file.extension === 'mp4'" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24">
-                <path fill="#ea7c7c" d="M14,18H5c-1.65611-0.00181-2.99819-1.34389-3-3V9c0.00181-1.65611,1.34389-2.99819,3-3h9c1.65611,0.00181,2.99819,1.34389,3,3v6C16.99819,16.65611,15.65611,17.99819,14,18z" />
-                <path
-                  fill="#dc2625"
-                  d="M21.89465,7.55359c-0.24683-0.49432-0.8476-0.69495-1.34192-0.44812l-3.56421,1.7821C16.98999,8.92572,16.99994,8.96149,17,9v6c-0.00006,0.03851-0.01001,0.07428-0.01147,0.11243l3.56421,1.7821C20.69165,16.96381,20.84479,16.99994,21,17c0.55212-0.00037,0.99969-0.44788,1-1V8C21.99994,7.84503,21.96387,7.6922,21.89465,7.55359z" />
-              </svg>
-          </div>
-
-          <template v-else-if="size !== 'sm' && (file.extension === 'mp3' || file.extension === 'mp4')">
-            <div v-if="file.extension === 'mp3'" class="flex h-full flex-col items-center justify-center bg-light-50">
-              <audio class="w-[90%]" controls>
-                <source :src="file.access_link" type="audio/ogg" />
-                <source :src="file.access_link" type="audio/mpeg" />
-                <source :src="file.access_link" type="audio/mp3" />
-              </audio>
-            </div>
-
-            <video v-else-if="file.extension === 'mp4'" controls class="h-full object-cover">
-              <source :src="file.access_link" type="video/mp4" />
-              <source :src="file.access_link" type="video/ogg" />
-            </video>
-          </template>
-
-          <a v-else-if="file.extension === 'svg' || file.extension === 'png' || file.extension === 'jpg' || file.extension === 'jpeg' || file.extension === 'webp'" data-fslightbox="gallery" :href="file.access_link">
-            <img :src="file.access_link" :alt="file.name" class="pointer-events-none object-cover checker-bg" />
-          </a>
-
-          <div v-else-if="file.type === 'directory'">
-            <div class="flex h-full cursor-pointer flex-col items-center justify-center gap-4">
-              <svg class="h-24 w-24 text-light-800 dark:text-newDark-700" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M2 6a2 2 0 012-2h5l2 2h5a2 2 0 012 2v6a2 2 0 01-2 2H4a2 2 0 01-2-2V6z"></path></svg>
-            </div>
-          </div>
-
-          <div class="flex items-center justify-center bg-light-50 dark:bg-newDark-950" v-else>
-            <h1 :class="[size === 'sm' ? 'text-xs' : 'text-2xl  sm:text-5xl', 'bg-gradient-to-r from-xudaTint-300 to-xudaTint-600 bg-clip-text py-2  font-extrabold text-transparent']">{{ file.extension }}</h1>
-          </div>
-
-
-          <div v-tooltip="file.tags.join(', ')" class="rounded-full flex items-center gap-2 absolute top-3 right-3 px-3 py-1 text-sm bg-white border" v-if="file.tags?.length">
-              <svg class="size-4" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 256 256">
-                <g fill="#878787">
-                  <path d="m240 128l-45.62 68.44a8 8 0 0 1-6.66 3.56H40a8 8 0 0 1-8-8V64a8 8 0 0 1 8-8h147.72a8 8 0 0 1 6.66 3.56Z" opacity=".2" />
-                  <path d="M246.66 123.56L201 55.13A15.94 15.94 0 0 0 187.72 48H40a16 16 0 0 0-16 16v128a16 16 0 0 0 16 16h147.72a16 16 0 0 0 13.28-7.12l45.63-68.44a8 8 0 0 0 .03-8.88M187.72 192H40V64h147.72l42.66 64Z" />
-                </g>
-              </svg>
-              {{ file.tags.length }} tags
-           </div>
-
-      </div>
-    `
-  };
-  const g = `
-      <div class="flex flex-col divide-y overflow-hidden h-full" dir="ltr">
-          <div v-if="options.show_toolbar !== false" class="flex items-center py-2 px-6">
-            <div class="flex gap-2 items-center flex-1">
-              <h1 class="text-2xl font-bold text-gray-900 capitalize" v-text="options.toolbar_label || view"></h1>
-            </div>
-
-            <div class="flex items-center gap-4">
-              <div class="relative">
-                <div class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3">
-                  <svg class="h-5 w-5 text-gray-400" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
-                    <path fill-rule="evenodd" d="M9 3.5a5.5 5.5 0 100 11 5.5 5.5 0 000-11zM2 9a7 7 0 1112.452 4.391l3.328 3.329a.75.75 0 11-1.06 1.06l-3.329-3.328A7 7 0 012 9z" clip-rule="evenodd"></path>
-                  </svg>
-                </div>
-
-                <VDropdown popperClass="w-96" :triggers="[]" :disposeTimeout="10" :shown="showSearchPopper" :autoHide="false" placement="bottom">
-                  <ul class="focus:ring-2 focus:ring-offset-2 focus:ring-neutral-400 relative min-h-[38px] flex items-center justify-between w-full py-2 px-3 text-left bg-white border rounded-md shadow-sm cursor-default border-neutral-200/70 focus:outline-none text-sm flex items-center gap-2 px-2">
-                    <li v-for="(chip, i) in searchTags" :class="[removeChipCount && i == searchTags.length - 1 ? 'bg-neutral-400' : 'bg-neutral-200 ']" class="rounded-lg flex items-stretch text-sm overflow-hidden">
-                      <div :class="[removeChipCount && i == searchTags.length - 1 ? 'bg-neutral-500/20' : 'bg-neutral-300']" class="uppercase flex items-center text-[0.65rem] px-2">{{ chip.split(':')[0] }}</div>
-                      <div class="px-2 flex items-center">{{ chip.split(':')[1] }}</div>
-                    </li>
-                    <li>
-                      <input type="text" ref="search" placeholder="Search" @focus="search.length ? (showSearchPopper = true) : ''"  @blur="hideSearchPopper"  class="border-0 ring-0 focus:ring-0 py-0 px-1" v-model.trim="search" @keyup.delete="removeLastSearch" />
-                    </li>
-
-                    <div class="absolute right-4 flex items-center gap-2 empty:hidden">
-                      <sepcial-loader class="size-5" v-if="loadingSearch" />
-
-                      <template v-if="search.length">
-                        <button @click="search = '' ">
-                          <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
-                            <path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path>
-                          </svg>
-                        </button>
-                      </template>
-                    </div>
-                  </ul>
-                  <template #popper>
-                    <div class="space-y-3 divide-y xuda-divide p-4">
-                      <div v-for="option in searchOptions" class="search-option [&:not(:first-child)]:pt-3">
-                        <div class="search-option-label text-xs font-semibold mb-1 text-light-800">{{ option.label }}</div>
-                        <button class="search-option-action hover:bg-black px-2 -mx-2 py-1 block w-full text-left rounded-md hover:text-white text-sm" @click="search ? ((search = option.tag+':'+ search), $refs.search.focus()) : ''">{{option.label}} {{option.modifier}} "{{ search }}"</button>
-                      </div>
-                    </div>
-                  </template>
-                </VDropdown>
-              </div>
-
-              <segment-component :options="sortDirOptions" v-model="opts.sort_dir" />
-
-              <segment-component :options="sortOptions" v-model="opts.sort_by" />
-
-              <segment-component :options="viewOptions" v-model="view" />
-
-              <div>
-                <button
-                  @click="uploadModal = true"
-                  type="button"
-                  class="inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-white transition-colors duration-200 rounded-md bg-neutral-950 hover:bg-neutral-900 focus:ring-2 focus:ring-offset-2 focus:ring-neutral-900 focus:shadow-outline focus:outline-none"
-                >
-                  Upload
-                </button>
-              </div>
-            </div>
-          </div>
-
-          <!-- Tabs -->
-          <div ref="dropZoneRef"  class="flex-1 overflow-auto size-full relative">
-            <div v-if="isOverDropZone && view !== 'slider'" class="absolute inset-0 z-10 px-2 py-2 animate">
-              <div class="size-full flex flex-col justify-between items-center !border-black border-2 rounded-2xl bg-black/20">
-                <div></div>
-
-                <div></div>
-              </div>
-            </div>
-
-            <template v-if="view === 'gallery' || view === 'list'">
-              <div class="flex-1 overflow-auto" :class="{ 'grid gap-x-4 gap-y-4 grid-cols-2 sm:grid-cols-3 sm:gap-x-6 md:grid-cols-4 lg:grid-cols-4 xl:grid-cols-5 xl:gap-x-6 p-4': view === 'gallery', 'flex flex-col divide-y': view === 'list' }">
-                <div :class="{ 'md:col-span-4 xl:col-span-5 grid gap-x-4 gap-y-3 grid-cols-2 sm:grid-cols-3 sm:gap-x-6 md:grid-cols-4 lg:grid-cols-4 xl:grid-cols-5 sm:gap-x-6': view === 'gallery'}">
-                  <template v-for="folder in folders">
-                    <div v-if="view === 'gallery'" class="flex items-center justify-between px-3 group gap-2 rounded-lg bg-gray-100 border py-3">
-                      <div class="flex items-center gap-2 truncate flex-1">
-                        <svg class="h-7 w-7 shrink-0" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M2 6a2 2 0 012-2h5l2 2h5a2 2 0 012 2v6a2 2 0 01-2 2H4a2 2 0 01-2-2V6z"></path></svg>
-                        <div>{{folder.name}}</div>
-                      </div>
-                      <div class="flex items-center justify-between gap-2">
-                        <div class="hidden font-normal sm:block">{{ folder.size }}</div>
-                      </div>
-                    </div>
-                  </template>
-                </div>
-
-                <template v-for="file in (view === 'list' ? [...folders, ...files] : files)">
-                  <div v-if="view === 'gallery'" class="relative">
-                 
-
-                    <imagePreview :file="file" />
-
-                    <div class="mt-2 block truncate font-medium text-sm text-gray-900" v-text="file.name"></div>
-                    <div class="flex items-center justify-between text-xs text-gray-500">
-                      <div class="truncate" v-text="file.size"></div>
-                      <div class="truncate" v-text="moment(file.date_created).format('lll')"></div>
-                    </div>
-                  </div>
-                  <div v-if="view === 'list'" class="flex group items-center justify-between py-2 px-4 hover:bg-neutral-100 transition-all">
-                    <div class="flex items-center gap-4 truncate max-w-6xl">
-                      <a v-if="file.type==='file'" data-fslightbox="gallery" :href="file.access_link" class="group block shrink-0 overflow-hidden">
-                        <img :src="file.access_link" :alt="file.name" class="pointer-events-none object-cover checker-bg flex w-10 h-8 items-center" />
-                      </a>
-                      <div class="w-10 h-8 grid place-items-center shrink-0 rounded-lg bg-gray-100 border" v-if="file.type==='directory'">
-                        <svg class="size-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M2 6a2 2 0 012-2h5l2 2h5a2 2 0 012 2v6a2 2 0 01-2 2H4a2 2 0 01-2-2V6z"></path></svg>
-                      </div>
-
-                      <div class="pointer-events-none block w-56 truncate text-left font-medium 2xl:w-full" v-text="file.name"></div>
-                    </div>
-                    <div class="flex items-center gap-3 truncate text-gray-500">
-                      <div class="flex flex-wrap gap-1">
-                        <div class="inline-flex bg-neutral-100 group-hover:bg-neutral-200 py-1 px-2 text-xs rounded-full" v-for="tag in file.tags">{{ tag }}</div>
-                      </div>
-                      <div class="truncate" v-text="file.size"></div>
-                      <div class="truncate" v-text="moment(file.date_created).format('lll')"></div>
-                    </div>
-                  </div>
-                </template>
-              </div>
-
-              <div v-if="!isEndOfList && (!loadingSearch || loadingSearch && allLoading)  && files.length" class="sticky text-center col-span-5 py-6 bottom-0 left-0 right-0">
-                <button :class="[allLoading ? 'px-1.5' : 'px-4']" class="px-4 bg-black/80 rounded-full py-1.5 transition-all text-white font-semibold" @click="refreshDirectory(true)">
-                  <template v-if="allLoading">
-                    <sepcial-loader class="size-6" />
-                  </template>
-
-                  <template v-else> Load all </template>
-                </button>
-              </div>
-            </template>
-
-            <div v-if="view === 'slider'" class="relative flex items-center justify-between py-4 px-4 flex-1 h-full overflow-hidden">
-              <div v-if="options.navigation" class="absolute inset-y-0 left-6 z-10 flex items-center">
-                <button @click="options.direction === 'rtl' ? swiper.slideNext() : swiper.slidePrev()" class="bg-white -ml-2 lg:-ml-4 flex justify-center items-center w-10 h-10 rounded-full shadow focus:outline-none">
-                  <svg viewBox="0 0 20 20" fill="currentColor" class="chevron-left w-6 h-6"><path fill-rule="evenodd" d="M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
-                </button>
-              </div>
-
-              <div class="swiper-container flex-1 w-full h-full" :dir="options.direction || 'ltr'" ref="swiper-container">
-                <div class="swiper-wrapper">
-                  <!-- Slides -->
-                  <template v-for="file in files" hidden>
-                    <div class="swiper-slide">
-                        <a data-fslightbox="gallery" :href="file.access_link" class="flex-shrink-0">
-                          <img class="h-full w-full object-cover" :src="file.access_link" :alt="file.name" />
-                        </a>
-                    </div>
-                  </template>
-                </div>
-              </div>
-
-              <div v-if="options.navigation" class="absolute inset-y-0 right-6 z-10 flex items-center">
-                <button @click="options.direction === 'rtl' ? swiper.slidePrev() : swiper.slideNext()" class="bg-white -mr-2 lg:-mr-4 flex justify-center items-center w-10 h-10 rounded-full shadow focus:outline-none">
-                  <svg viewBox="0 0 20 20" fill="currentColor" class="chevron-right w-6 h-6"><path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd"></path></svg>
-                </button>
-              </div>
-            </div>
-          </div>
-
-          <teleport to="body">
-            <div @keydown.escape.window="uploadModal = false" v-show="uploadModal" class="fixed top-0 left-0 z-[99] w-screen h-screen" x-cloak>
-              <div v-show="uploadModal" @click="uploadModal=false" class="absolute inset-0 w-full h-full bg-white backdrop-blur-sm bg-opacity-70"></div>
-
-              <transition key="wrapper" enter-from-class="opacity-0" enter-active-class="ease-out duration-300" enter-to-class="opacity-100" leave-from-class="opacity-100" leave-active-class="ease-in duration-300" leave-to-class="opacity-0">
-                <div class="flex items-center justify-center size-full" v-show="uploadModal">
-                  <transition
-                    key="inner"
-                    enter-active-class="ease-out duration-300"
-                    enter-from-class="opacity-0 -translate-y-2 sm:scale-95"
-                    enter-to-class="opacity-100 translate-y-0 sm:scale-100"
-                    leave-active-class="ease-in duration-200"
-                    leave-from-class="opacity-100 translate-y-0 sm:scale-100"
-                    leave-to-class="opacity-0 -translate-y-2 sm:scale-95"
-                  >
-                    <div v-show="uploadModal" class="relative w-full py-6 bg-white border shadow-lg px-7 border-neutral-200 sm:max-w-lg sm:rounded-lg overflow-hidden">
-                      <div class="flex items-center justify-between pb-3">
-                        <h3 class="text-lg font-semibold" v-text="'Upload file' + (options.file_upload_allow_multiple_files ? 's' : '')"></h3>
-                        <button @click="uploadModal=false" class="absolute top-0 right-0 flex items-center justify-center w-8 h-8 mt-5 mr-5 text-gray-600 rounded-full hover:text-gray-800 hover:bg-gray-50">
-                          <svg class="w-5 h-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" /></svg>
-                        </button>
-                      </div>
-                      <div id="imageUploaderComponent" class="relative w-auto pb-8 h-48 [&>div]:h-full [&>div>div]:h-full"></div>
-                      <div class="flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2">
-                        <button @click="uploadModal=false" type="button" class="inline-flex gap-2 items-center justify-center h-10 px-4 py-2 text-sm font-medium transition-colors border rounded-md focus:outline-none focus:ring-2 focus:ring-neutral-100 focus:ring-offset-2">
-                          <div>Dismiss</div>
-                        </button>
-                        <button
-                          @click="uploadFiles(false)"
-                          :disabled="uploaderLoading"
-                          type="button"
-                          class="inline-flex items-center gap-2 justify-center h-10 px-4 py-2 text-sm font-medium text-white transition-colors border border-transparent rounded-md focus:outline-none focus:ring-2 focus:ring-neutral-900 focus:ring-offset-2 bg-neutral-950 hover:bg-neutral-900 disabled:opacity-50 disabled:cursor-not-allowed"
-                        >
-                          <template v-if="uploaderLoading">
-                            <sepcial-loader class="size-5" />
-                            Uploading
-                          </template>
-
-                          <template v-else>Upload</template>
-                        </button>
-                      </div>
-
-                      <div v-show="showExistModal" class="absolute inset-0 bg-white py-6 px-7 flex flex-col">
-                        <div class="flex items-center justify-between pb-3">
-                          <h3 class="text-lg font-semibold">Upload options</h3>
-                          <button @click="showExistModal=false" class="absolute top-0 right-0 flex items-center justify-center w-8 h-8 mt-5 mr-5 text-gray-600 rounded-full hover:text-gray-800 hover:bg-gray-50">
-                            <svg class="w-5 h-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" /></svg>
-                          </button>
-                        </div>
-
-                        <div class="flex-1">
-                          <p class="text-gray-800">One or more items already exists in this location. Do you want to replace the existing items with a new version or keep both items? Replacing the items won't change sharing settings.</p>
-
-                          <fieldset>
-                            <div class="mt-6 space-y-5 pl-2">
-                              <div v-for="option in replaceOptions" :key="option.value">
-                                <label :for="option.value" class="flex items-center cursor-pointer">
-                                  <input :id="option.value" name="notification-method" type="radio" :value="option.value" v-model="overrideAction" :checked="option.value === overrideAction" class="option-radio peer" />
-                                  <div class="ml-3 block font-medium peer-checked:text-black text-light-700 cursor-pointer">{{ option.label }}</div>
-                                </label>
-                              </div>
-                            </div>
-                          </fieldset>
-                        </div>
-
-                        <div class="flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2">
-                          <button @click="showExistModal=false" type="button" class="inline-flex gap-2 items-center justify-center h-10 px-4 py-2 text-sm font-medium transition-colors border rounded-md focus:outline-none focus:ring-2 focus:ring-neutral-100 focus:ring-offset-2">
-                            <div>Dismiss</div>
-                          </button>
-                          <button
-                            @click="uploadFiles(true)"
-                            :disabled="uploaderLoading"
-                            type="button"
-                            class="inline-flex items-center gap-2 justify-center h-10 px-4 py-2 text-sm font-medium text-white transition-colors border border-transparent rounded-md focus:outline-none focus:ring-2 focus:ring-neutral-900 focus:ring-offset-2 bg-neutral-950 hover:bg-neutral-900 disabled:opacity-50 disabled:cursor-not-allowed"
-                          >
-                            Upload
-                          </button>
-                        </div>
-                      </div>
-                    </div>
-                  </transition>
-                </div>
-              </transition>
-            </div>
-          </teleport>
-      </div>
- 
-`, k = async function(t, o) {
-    let d = i._session.domain;
-    i._session.is_deployment && (d = i._session.opt.regional_server === "dev.xuda.io" ? "dev.xuda.io" : "xuda.io"), o.app_id = l;
-    const s = await fetch(`https://${d}/cpi/${t}`, {
-      method: "POST",
-      headers: {
-        Accept: "application/json",
-        "Content-Type": "application/json",
-        "xu-gtp-token": a,
-        "xu-app-token": p
-      },
-      body: JSON.stringify(o)
-    }), c = await s.json();
-    if (!s.ok)
-      throw c;
-    return c;
-  }, f = function(t) {
-    return t < 1024 ? t + " Bytes" : t < 1024 * 1024 ? (t / 1024).toFixed(2) + " KB" : t < 1024 * 1024 * 1024 ? (t / (1024 * 1024)).toFixed(2) + " MB" : (t / (1024 * 1024 * 1024)).toFixed(2) + " GB";
-  };
-  var m = crypto.randomUUID();
-  i.$containerP.attr("widget-id", m);
-  var x = createApp({
-    template: g,
-    components: {
-      segmentComponent: h,
-      sepcialLoader: n,
-      imagePreview: v
-    },
-    data() {
-      var t;
-      return {
-        replaceOptions: [
-          { label: "Replace existing items", value: "replace" },
-          { label: "Keep all items", value: "keep" }
-        ],
-        sortDirOptions: [
-          {
-            label: "Ascending",
-            value: "asc"
-          },
-          {
-            label: "Descending",
-            value: "desc"
-          }
-        ],
-        sortOptions: [
-          {
-            label: "Date",
-            value: "date"
-          },
-          {
-            label: "Name",
-            value: "name"
-          }
-        ],
-        viewOptions: [
-          {
-            icon: ` <svg class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
-              <path
-                fill-rule="evenodd"
-                d="M4.25 2A2.25 2.25 0 002 4.25v2.5A2.25 2.25 0 004.25 9h2.5A2.25 2.25 0 009 6.75v-2.5A2.25 2.25 0 006.75 2h-2.5zm0 9A2.25 2.25 0 002 13.25v2.5A2.25 2.25 0 004.25 18h2.5A2.25 2.25 0 009 15.75v-2.5A2.25 2.25 0 006.75 11h-2.5zm9-9A2.25 2.25 0 0011 4.25v2.5A2.25 2.25 0 0013.25 9h2.5A2.25 2.25 0 0018 6.75v-2.5A2.25 2.25 0 0015.75 2h-2.5zm0 9A2.25 2.25 0 0011 13.25v2.5A2.25 2.25 0 0013.25 18h2.5A2.25 2.25 0 0018 15.75v-2.5A2.25 2.25 0 0015.75 11h-2.5z"
-                clip-rule="evenodd"
-              ></path>
-            </svg>`,
-            label: "",
-            value: "gallery"
-          },
-          {
-            icon: ` <svg class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
-              <path
-                fill-rule="evenodd"
-                d="M2 3.75A.75.75 0 012.75 3h14.5a.75.75 0 010 1.5H2.75A.75.75 0 012 3.75zm0 4.167a.75.75 0 01.75-.75h14.5a.75.75 0 010 1.5H2.75a.75.75 0 01-.75-.75zm0 4.166a.75.75 0 01.75-.75h14.5a.75.75 0 010 1.5H2.75a.75.75 0 01-.75-.75zm0 4.167a.75.75 0 01.75-.75h14.5a.75.75 0 010 1.5H2.75a.75.75 0 01-.75-.75z"
-                clip-rule="evenodd"
-              ></path>
-            </svg>`,
-            label: "",
-            value: "list"
-          },
-          {
-            icon: ` <svg class="h-5 w-5" xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor" viewBox="0 0 256 256">
-                <path d="M200,64V192a8,8,0,0,1-8,8H64a8,8,0,0,1-8-8V64a8,8,0,0,1,8-8H192A8,8,0,0,1,200,64Z" opacity="0.2"></path>
-                <path d="M192,48H64A16,16,0,0,0,48,64V192a16,16,0,0,0,16,16H192a16,16,0,0,0,16-16V64A16,16,0,0,0,192,48Zm0,144H64V64H192V192ZM240,56V200a8,8,0,0,1-16,0V56a8,8,0,0,1,16,0ZM32,56V200a8,8,0,0,1-16,0V56a8,8,0,0,1,16,0Z"></path>
-              </svg>`,
-            label: "",
-            value: "slider"
-          }
-        ],
-        options: u,
-        folders: [],
-        files: [],
-        view: u.default_view_type || "gallery",
-        uploadModal: !1,
-        uploaderLoading: !1,
-        loadingSearch: !1,
-        fetcher: k,
-        formatBytes: f,
-        initUploader: upload,
-        swiper: null,
-        existingTags: "",
-        showSearchPopper: !1,
-        isOverDropZone: !1,
-        removeChipCount: 0,
-        searchOptions: [
-          {
-            label: "Filename",
-            tag: "name",
-            modifier: "contains"
-          },
-          {
-            label: "Tag",
-            tag: "tag",
-            modifier: "equals"
-          },
-          {
-            label: "Content",
-            tag: "any",
-            modifier: "contains"
-          }
-        ],
-        opts: {
-          app_id: l,
-          path: "/",
-          search_string: "",
-          sort_by: u.sort_by || "date",
-          sort_dir: u.sort_dir || "desc",
-          ...(t = u.filter_tags) != null && t.length ? { tags: u.filter_tags } : {}
-          // ...filter_tags
-        },
-        limit: 50,
-        isEndOfList: !1,
-        existingFiles: {},
-        allLoading: !1,
-        showExistModal: !1,
-        overrideAction: "replace",
-        pond: null,
-        processFiles: null
-      };
-    },
-    methods: {
-      async refreshDirectory(t, o = !1) {
-        if (this.view === "slider" && (o = !0), this.loadingSearch = !0, t ? this.allLoading = !0 : this.isEndOfList = !1, !o) {
-          const s = await this.fetcher("get_drive_files_workspace", {
-            ...this.opts,
-            type: "directory"
-          });
-          this.folders = s.data.children || [];
-        }
-        const d = await this.fetcher("get_drive_files_workspace", {
-          ...this.opts,
-          ...t ? {} : { from: 0, to: this.limit },
-          type: "file"
-        });
-        this.files = d.data.children || [], t && (this.allLoading = !1, this.isEndOfList = !0), this.files.length < this.limit && (this.allLoading = !1, this.isEndOfList = !0), this.loadingSearch = !1, this.$nextTick(() => {
-          refreshFsLightbox();
-        });
-      },
-      uploadFiles(t) {
-        if (this.uploaderLoading = !0, t)
-          this.showExistModal = !1, this.processFiles(null, {
-            overrideAction: this.overrideAction,
-            existingFiles: this.existingFiles
-          });
-        else {
-          let d = [];
-          this.existingFiles = {};
-          var o = this.pond.getFiles().map((s) => ({ id: s.id, filename: s.file.name }));
-          o.forEach(({ filename: s }) => {
-            d.push(
-              new Promise((c, w) => {
-                this.fetcher("check_drive_file_workspace", {
-                  file_path: "/" + s,
-                  file_name: s,
-                  type: "file"
-                }).then((r) => {
-                  c(r);
-                }).catch((r) => {
-                  if (this.uploaderLoading = !1, r.code === -764) {
-                    this.existingFiles[s] = r.duplicates, c(r);
-                    return;
-                  }
-                  w(r);
-                });
-              })
-            );
-          }), Promise.all(d).then((s) => {
-            Object.keys(this.existingFiles).length && (this.showExistModal = !0), o.filter((c) => !Object.keys(this.existingFiles).includes(c.filename)).forEach((c) => {
-              this.processFiles(c.id);
-            });
-          }).catch((s) => {
-            debugger;
-            this.showExistModal = !0;
-          });
-        }
-      },
-      removeLastSearch(t) {
-        t.target.value || (this.removeChipCount === 1 ? (this.opts.search_string = this.opts.search_string.replaceAll(
-          this.opts.search_string.split(" ").filter((o) => o.includes(":")).at(-1),
-          ""
-        ).trim(), this.removeChipCount = 0) : this.removeChipCount++);
-      },
-      // hideSearchPopper() {
-      //   debugger;
-      // setTimeout(() => {
-      // this.showSearchPopper = false;
-      // }, 100);
-      // },
-      searchDebounce: _.debounce(async function(t) {
-        await this.refreshDirectory();
-      }, 400),
-      moment: hooks
-    },
-    mounted() {
-      var t = (d) => {
-        this.view !== "slider" && (this.uploadModal = !0, this.pond.addFiles(d));
-      };
-      const { isOverDropZone: o } = useDropZone(this.$refs.dropZoneRef, {
-        onDrop: t
-      });
-      this.isOverDropZone = o;
-    },
-    computed: {
-      searchTags() {
-        return this.opts.search_string.split(" ").filter((t) => t.includes(":"));
-      },
-      search: {
-        get() {
-          return this.opts.search_string.split(" ").filter((t) => !t.includes(":")).filter((t) => t).join(" ").trim();
-        },
-        set(t) {
-          var o = this.opts.search_string.split(" ").filter((d) => d.includes(":"));
-          this.opts.search_string = (o.join(" ") + " " + t).trim(), console.log(t), t.length && (this.showSearchPopper = !0), t.includes(":") && setTimeout(() => {
-            this.showSearchPopper = !1;
-          }, 50);
-        }
-      }
-    },
-    watch: {
-      opts: {
-        deep: !0,
-        handler() {
-          this.searchDebounce();
-        }
-      },
-      view: {
-        handler(t) {
-          t === "slider" && this.$nextTick(() => {
-            this.swiper = new Swiper(this.$refs["swiper-container"], {
-              loop: !0,
-              slidesPerView: 1,
-              spaceBetween: 20,
-              observer: !0,
-              observeParents: !0,
-              ...u.swiper_options
-              // ...(fields?.direction === "rtl" ? { reverseDirection: true } : {})
-            }), this.swiper.on("slideChange", (o) => {
-              o.activeIndex >= 5 && !this.isEndOfList && !this.loadingSearch && !this.allLoading && this.refreshDirectory(!0);
-            });
-          }), this.$nextTick(() => {
-            refreshFsLightbox();
-          });
-        },
-        immediate: !0
-      },
-      files() {
-        this.$nextTick(() => {
-          var t, o;
-          refreshFsLightbox(), (o = (t = this.swiper) == null ? void 0 : t.update) == null || o.call(t);
-        });
-      }
-    },
-    async created() {
-      this.refreshDirectory(), this.$nextTick(async () => {
-        var { pond: t, processFiles: o } = await this.initUploader({ ...u, instant_file_upload: "N" }, { ...i, $containerP: $("#imageUploaderComponent") });
-        this.pond = t, this.processFiles = o;
-        var d = useDebounceFn(() => {
-          this.refreshDirectory(!1, !0);
-        }, 2500);
-        this.pond.on("processfile", (s, { id: c }) => {
-          !(s != null && s.type) !== "error" && this.pond.removeFiles(c), this.pond.getFiles().length || (this.uploaderLoading = !1, this.uploadModal = !1, this.pond.removeFiles()), d();
-        }), this.pond.on("processfiles", (s, c) => {
-          console.log("Finished all");
-        });
-      }), this.$watch("opts", (t) => {
-        this.refreshDirectory();
-      });
-    }
-  });
-  x.use(Gt), setTimeout(() => {
-    x.mount(`[widget-id='${m}']`);
-  }, 1e3);
-}
-export {
-  upload,
-  viewer
-};