vlite3 0.1.0 → 0.1.2

package/components/FilePicker/FilePicker.vue.d.ts

@@ -0,0 +1,65 @@
+import { InputSize, InputRounded } from '../../types';
+export interface FilePickerValue {
+    fileName: string;
+    fileType: string;
+    fileSize: number;
+    file: File;
+    base64: string;
+}
+interface Props {
+    modelValue?: FilePickerValue | FilePickerValue[] | null;
+    multiSelect?: boolean;
+    fileTypes?: string[];
+    returnFormat?: 'file' | 'base64';
+    loading?: boolean;
+    disabled?: boolean;
+    maxSize?: number;
+    variant?: 'dropzone' | 'input';
+    placeholder?: string;
+    size?: InputSize;
+    rounded?: InputRounded;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        trigger?(_: {
+            trigger: () => void;
+            isDragging: boolean;
+            isLoading: boolean;
+            files: any[];
+        }): any;
+    };
+    refs: {
+        fileInput: HTMLInputElement;
+    };
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    "update:modelValue": (value: FilePickerValue | FilePickerValue[]) => any;
+    change: (value: FilePickerValue | FilePickerValue[]) => any;
+    error: (error: string) => any;
+}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
+    "onUpdate:modelValue"?: (value: FilePickerValue | FilePickerValue[]) => any;
+    onChange?: (value: FilePickerValue | FilePickerValue[]) => any;
+    onError?: (error: string) => any;
+}>, {
+    disabled: boolean;
+    size: InputSize;
+    variant: "dropzone" | "input";
+    modelValue: FilePickerValue | FilePickerValue[] | null;
+    loading: boolean;
+    rounded: InputRounded;
+    multiSelect: boolean;
+    fileTypes: string[];
+    returnFormat: "file" | "base64";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
+    fileInput: HTMLInputElement;
+}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/components/FilePicker/FilePicker.vue.js

@@ -0,0 +1,285 @@
+import { defineComponent as K, ref as S, useSlots as O, computed as v, openBlock as a, createElementBlock as u, createElementVNode as s, renderSlot as q, normalizeClass as z, createBlock as y, withModifiers as D, createVNode as b, createTextVNode as H, toDisplayString as F, createCommentVNode as x, Fragment as J, renderList as Q } from "vue";
+import f from "../Icon.vue.js";
+import T from "../Button.vue.js";
+const X = { class: "w-full" }, Y = ["multiple", "accept"], Z = ["value", "placeholder", "disabled"], _ = { class: "absolute right-3 top-1/2 -translate-y-1/2 flex items-center justify-center gap-2 bg-background" }, ee = { class: "p-3 bg-muted rounded-full text-muted-foreground" }, le = { class: "space-y-1" }, te = {
+  key: 0,
+  class: "text-xs text-muted-foreground"
+}, oe = {
+  key: 1,
+  class: "space-y-3"
+}, ie = { class: "shrink-0 mr-3" }, re = { class: "p-2 bg-primary/10 rounded text-primary" }, ae = { class: "flex-1 min-w-0" }, ne = { class: "text-sm font-medium text-foreground truncate" }, se = { class: "text-xs text-muted-foreground" }, de = { class: "flex-shrink-0 ml-3 flex gap-2" }, ue = {
+  key: 0,
+  class: "flex gap-2"
+}, ce = {
+  key: 2,
+  class: "absolute inset-0 bg-white/60 backdrop-blur-[1px] flex items-center justify-center rounded-lg z-10"
+}, fe = { class: "bg-white p-2 rounded-full shadow-lg" }, ve = /* @__PURE__ */ K({
+  name: "FilePicker",
+  __name: "FilePicker",
+  props: {
+    modelValue: { default: null },
+    multiSelect: { type: Boolean, default: !1 },
+    fileTypes: { default: () => [] },
+    returnFormat: { default: "file" },
+    loading: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 },
+    maxSize: {},
+    variant: { default: "dropzone" },
+    placeholder: {},
+    size: { default: "md" },
+    rounded: { default: "md" }
+  },
+  emits: ["update:modelValue", "change", "error"],
+  setup(o, { emit: B }) {
+    const e = o, c = B, C = S(null), m = S(!1), d = S(!1);
+    O();
+    const N = v(() => e.fileTypes.join(",")), k = v(() => Array.isArray(e.modelValue) ? e.modelValue.length > 0 : e.modelValue !== null), w = v(() => {
+      let t = [];
+      return Array.isArray(e.modelValue) ? t = e.modelValue : e.modelValue && (t = [e.modelValue]), t.map((l) => {
+        if (typeof l == "string") {
+          const r = l.split("/").pop() || "Unknown File";
+          return {
+            fileName: decodeURIComponent(r),
+            fileType: "unknown",
+            fileSize: 0,
+            file: null,
+            base64: l,
+            isUrl: !0
+          };
+        }
+        return l;
+      });
+    }), g = () => {
+      e.disabled || e.loading || d.value || C.value?.click();
+    }, j = (t) => {
+      t.preventDefault(), !(e.disabled || e.loading) && (m.value = !0);
+    }, $ = (t) => {
+      t.preventDefault(), m.value = !1;
+    }, M = (t) => {
+      t.preventDefault(), m.value = !1, !(e.disabled || e.loading || d.value) && t.dataTransfer?.files && A(t.dataTransfer.files);
+    }, I = (t) => {
+      const l = t.target;
+      l.files && A(l.files), l.value = "";
+    }, L = (t) => {
+      if (t === 0 || !t) return "";
+      const l = 1024, r = ["Bytes", "KB", "MB", "GB", "TB"], n = Math.floor(Math.log(t) / Math.log(l));
+      return parseFloat((t / Math.pow(l, n)).toFixed(2)) + " " + r[n];
+    }, P = (t) => new Promise((l, r) => {
+      const n = new FileReader();
+      n.readAsDataURL(t), n.onload = () => {
+        typeof n.result == "string" ? l(n.result) : r(new Error("Failed to read file as base64"));
+      }, n.onerror = (p) => r(p);
+    }), A = async (t) => {
+      if (t.length === 0) return;
+      d.value = !0;
+      const l = [], r = [], n = Array.from(t), p = e.multiSelect ? n : [n[0]];
+      try {
+        for (const i of p) {
+          if (e.fileTypes.length > 0 && !e.fileTypes.some((h) => {
+            if (h.startsWith("."))
+              return i.name.toLowerCase().endsWith(h.toLowerCase());
+            if (h.endsWith("/*")) {
+              const G = h.split("/")[0];
+              return i.type.startsWith(G);
+            }
+            return i.type === h;
+          })) {
+            r.push(`File type not allowed: ${i.name}`);
+            continue;
+          }
+          if (e.maxSize && i.size > e.maxSize) {
+            r.push(`File too large: ${i.name}`);
+            continue;
+          }
+          let V = "";
+          e.returnFormat === "base64" && (V = await P(i)), l.push({
+            fileName: i.name,
+            fileType: i.type,
+            fileSize: i.size,
+            file: i,
+            base64: V
+          });
+        }
+        if (r.length > 0 && c("error", r.join("; ")), l.length > 0) {
+          let i;
+          e.multiSelect ? i = [...Array.isArray(e.modelValue) ? e.modelValue : [], ...l] : i = l[0], c("update:modelValue", i), c("change", i);
+        }
+      } catch (i) {
+        console.error("Error processing files:", i), c("error", "Failed to process files");
+      } finally {
+        d.value = !1;
+      }
+    }, E = (t) => {
+      if (!(e.disabled || e.loading))
+        if (e.multiSelect && Array.isArray(e.modelValue)) {
+          const l = [...e.modelValue];
+          l.splice(t, 1), c("update:modelValue", l), c("change", l);
+        } else
+          c("update:modelValue", null), c("change", null);
+    }, U = () => {
+      e.disabled || e.loading || (c("update:modelValue", null), c("change", null));
+    }, W = v(() => k.value ? w.value.map((l) => l.fileName).join(", ") : ""), R = v(() => {
+      const t = "block w-full bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 transition-all focus-visible:outline-none cursor-pointer", l = {
+        sm: "h-8 text-xs",
+        md: "h-10 text-sm",
+        lg: "h-12 text-base"
+      }, r = {
+        none: "rounded-none",
+        sm: "rounded-sm",
+        md: "rounded-md",
+        lg: "rounded-lg",
+        xl: "rounded-xl",
+        "2xl": "rounded-2xl",
+        full: "rounded-full"
+      };
+      return [
+        t,
+        "border border-input focus-visible:border-primary",
+        // Default outline style
+        l[e.size],
+        r[e.rounded],
+        "pr-10",
+        // Space for icon
+        e.disabled ? "cursor-not-allowed opacity-50" : ""
+      ].join(" ");
+    });
+    return (t, l) => (a(), u("div", X, [
+      s("input", {
+        ref_key: "fileInput",
+        ref: C,
+        type: "file",
+        multiple: o.multiSelect,
+        accept: N.value,
+        class: "hidden",
+        onChange: I
+      }, null, 40, Y),
+      q(t.$slots, "trigger", {
+        trigger: g,
+        isDragging: m.value,
+        isLoading: o.loading || d.value,
+        files: w.value
+      }, () => [
+        o.variant === "input" ? (a(), u("div", {
+          key: 0,
+          class: "relative",
+          onClick: g
+        }, [
+          s("input", {
+            type: "text",
+            value: W.value,
+            placeholder: o.placeholder || "Select file...",
+            readonly: "",
+            class: z(R.value),
+            disabled: o.disabled || o.loading || d.value
+          }, null, 10, Z),
+          s("div", _, [
+            o.loading || d.value ? (a(), y(f, {
+              key: 0,
+              icon: "lucide:loader-2",
+              class: "h-4 w-4 animate-spin text-muted-foreground"
+            })) : k.value && !o.disabled ? (a(), u("button", {
+              key: 1,
+              type: "button",
+              class: "text-muted-foreground hover:text-foreground focus:outline-none",
+              onClick: D(U, ["stop"])
+            }, [
+              b(f, {
+                icon: "lucide:x-circle",
+                class: "h-4 w-4"
+              })
+            ])) : (a(), y(f, {
+              key: 2,
+              icon: "lucide:upload",
+              class: "h-4 w-4 text-muted-foreground"
+            }))
+          ])
+        ])) : (a(), u("div", {
+          key: 1,
+          class: "relative",
+          onDragover: j,
+          onDragleave: $,
+          onDrop: M
+        }, [
+          k.value ? (a(), u("div", oe, [
+            (a(!0), u(J, null, Q(w.value, (r, n) => (a(), u("div", {
+              key: n,
+              class: z(["relative flex items-center p-3 border border-border rounded-lg bg-card shadow-sm transition-colors group", [!o.multiSelect && !o.disabled ? "cursor-pointer hover:border-primary/50" : ""]]),
+              onClick: l[0] || (l[0] = (p) => !o.multiSelect && !o.disabled ? g() : null)
+            }, [
+              s("div", ie, [
+                s("div", re, [
+                  b(f, {
+                    icon: "lucide:file-text",
+                    class: "w-5 h-5"
+                  })
+                ])
+              ]),
+              s("div", ae, [
+                s("p", ne, F(r.fileName), 1),
+                s("p", se, F(L(r.fileSize)), 1)
+              ]),
+              s("div", de, [
+                !o.disabled && !o.loading ? (a(), y(T, {
+                  key: 0,
+                  size: "xs",
+                  variant: "ghost",
+                  icon: "lucide:x",
+                  rounded: "full",
+                  class: "text-muted-foreground hover:text-destructive hover:bg-destructive/10",
+                  onClick: D((p) => E(n), ["stop"])
+                }, null, 8, ["onClick"])) : x("", !0)
+              ])
+            ], 2))), 128)),
+            o.multiSelect ? (a(), u("div", ue, [
+              b(T, {
+                size: "sm",
+                variant: "outline",
+                icon: "lucide:plus",
+                text: "Add more",
+                disabled: o.disabled || o.loading || d.value,
+                onClick: g
+              }, null, 8, ["disabled"])
+            ])) : x("", !0)
+          ])) : (a(), u("div", {
+            key: 0,
+            class: z(["border-2 border-dashed border-border rounded-lg p-6 transition-all duration-200 ease-in-out cursor-pointer flex flex-col items-center justify-center text-center gap-3", [
+              m.value ? "border-primary bg-primary/5" : "hover:border-primary/50 hover:bg-muted/50",
+              o.disabled || o.loading || d.value ? "opacity-50 cursor-not-allowed" : ""
+            ]]),
+            onClick: g
+          }, [
+            s("div", ee, [
+              o.loading || d.value ? (a(), y(f, {
+                key: 0,
+                icon: "lucide:loader-2",
+                class: "w-6 h-6 animate-spin"
+              })) : (a(), y(f, {
+                key: 1,
+                icon: "lucide:upload-cloud",
+                class: "w-6 h-6"
+              }))
+            ]),
+            s("div", le, [
+              l[1] || (l[1] = s("p", { class: "text-sm font-medium text-foreground" }, [
+                s("span", { class: "text-primary hover:underline" }, "Click to upload"),
+                H(" or drag and drop ")
+              ], -1)),
+              o.fileTypes.length ? (a(), u("p", te, F(o.fileTypes.join(", ")), 1)) : x("", !0)
+            ])
+          ], 2)),
+          o.loading || d.value ? (a(), u("div", ce, [
+            s("div", fe, [
+              b(f, {
+                icon: "lucide:loader-2",
+                class: "w-6 h-6 animate-spin text-primary"
+              })
+            ])
+          ])) : x("", !0)
+        ], 32))
+      ])
+    ]));
+  }
+});
+export {
+  ve as default
+};

package/components/FilePicker/FilePicker.vue2.js

@@ -0,0 +1,4 @@
+import f from "./FilePicker.vue.js";
+export {
+  f as default
+};

package/components/FilePicker/index.d.ts

@@ -0,0 +1,2 @@
+export { default as FilePicker } from './FilePicker.vue';
+export type { FilePickerValue } from './FilePicker.vue';

package/components/FileTree/FileTree.vue.d.ts

@@ -0,0 +1,20 @@
+import { FileNode, FileTreeProps } from './types';
+declare const _default: import('vue').DefineComponent<FileTreeProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    select: (node: FileNode, selected: boolean) => any;
+    "update:modelValue": (keys: string[]) => any;
+    expand: (node: FileNode, expanded: boolean) => any;
+    "node-click": (node: FileNode) => any;
+}, string, import('vue').PublicProps, Readonly<FileTreeProps> & Readonly<{
+    onSelect?: (node: FileNode, selected: boolean) => any;
+    "onUpdate:modelValue"?: (keys: string[]) => any;
+    onExpand?: (node: FileNode, expanded: boolean) => any;
+    "onNode-click"?: (node: FileNode) => any;
+}>, {
+    data: FileNode[];
+    modelValue: string[];
+    selectionMode: import('./types').FileTreeSelectionMode;
+    showCheckboxes: boolean;
+    highlightSearch: boolean;
+    defaultExpandedKeys: string[];
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+export default _default;

package/components/FileTree/FileTree.vue.js

@@ -0,0 +1,139 @@
+import { defineComponent as N, ref as g, watch as E, computed as w, openBlock as p, createElementBlock as S, normalizeClass as T, Fragment as q, renderList as Q, createBlock as V } from "vue";
+import F from "./FileTreeNode.vue.js";
+const z = {
+  key: 1,
+  class: "text-sm text-muted-foreground p-4 text-center"
+}, $ = /* @__PURE__ */ N({
+  __name: "FileTree",
+  props: {
+    modelValue: { default: () => [] },
+    data: { default: () => [] },
+    selectionMode: { default: "single" },
+    showCheckboxes: { type: Boolean, default: !1 },
+    defaultExpandedKeys: { default: () => [] },
+    loadData: {},
+    highlightSearch: { type: Boolean, default: !1 },
+    searchQuery: {},
+    class: {}
+  },
+  emits: ["update:modelValue", "select", "expand", "node-click"],
+  setup(h, { emit: C }) {
+    const l = h, f = C, u = g(new Set(l.defaultExpandedKeys)), y = g(/* @__PURE__ */ new Set()), m = g(/* @__PURE__ */ new Map()), k = g(/* @__PURE__ */ new Map()), M = (t, a) => {
+      for (const e of t)
+        m.value.set(e.id, e), a && k.value.set(e.id, a), e.children && M(e.children, e.id);
+    };
+    E(
+      () => l.data,
+      (t) => {
+        m.value.clear(), k.value.clear(), M(t);
+      },
+      { immediate: !0, deep: !0 }
+    );
+    const v = (t) => {
+      let a = [];
+      if (t.children)
+        for (const e of t.children)
+          a.push(e.id), a = a.concat(v(e));
+      return a;
+    }, x = w(() => new Set(l.modelValue)), K = w(() => {
+      const t = /* @__PURE__ */ new Set();
+      if (l.selectionMode !== "multiple") return t;
+      const a = (e) => {
+        if (!e.children || e.children.length === 0)
+          return x.value.has(e.id) ? { status: "checked" } : { status: "unchecked" };
+        let c = !1, s = !1, i = !1;
+        for (const d of e.children) {
+          const n = a(d);
+          n.status === "checked" && (c = !0), n.status === "unchecked" && (s = !0), n.status === "indeterminate" && (i = !0);
+        }
+        return i || c && s ? (t.add(e.id), { status: "indeterminate" }) : c ? { status: "checked" } : { status: "unchecked" };
+      };
+      return l.data.forEach(a), t;
+    }), L = async (t) => {
+      if (t.disabled) return;
+      if (u.value.has(t.id)) {
+        u.value.delete(t.id);
+        const e = m.value.get(t.id) || t;
+        v(e).forEach((s) => u.value.delete(s)), f("expand", t, !1);
+      } else if (u.value.add(t.id), f("expand", t, !0), l.loadData && !t.isLoaded && (!t.children || t.children.length === 0)) {
+        y.value.add(t.id);
+        try {
+          await l.loadData(t);
+        } finally {
+          y.value.delete(t.id);
+        }
+      }
+    }, B = (t) => {
+      if (t.disabled) return;
+      const a = m.value.get(t.id) || t;
+      let e = new Set(x.value);
+      const c = e.has(t.id);
+      if (l.selectionMode === "single")
+        e.clear(), c || e.add(t.id);
+      else if (l.selectionMode === "multiple") {
+        const s = v(a), i = !c, d = (o, r) => {
+          r ? e.add(o) : e.delete(o);
+        };
+        d(t.id, i), s.forEach((o) => d(o, i));
+        let n = a;
+        for (; ; ) {
+          const o = k.value.get(n.id);
+          if (!o) break;
+          const r = m.value.get(o);
+          if (!r || !r.children) break;
+          r.children.every((D) => e.has(D.id)) ? e.add(r.id) : e.delete(r.id), n = r;
+        }
+      }
+      f("update:modelValue", Array.from(e)), f("select", a, !c);
+    }, b = w(() => {
+      if (!l.searchQuery) return l.data;
+      const t = l.searchQuery.toLowerCase(), a = (e) => {
+        const c = e.label.toLowerCase().includes(t), s = !!e.searchMatch;
+        let i = [];
+        return e.children && (i = e.children.map(a).filter((d) => d !== null)), c || s || i.length > 0 ? {
+          ...e,
+          children: i
+        } : null;
+      };
+      return l.data.map(a).filter((e) => e !== null);
+    });
+    return E(
+      () => [l.searchQuery, l.data],
+      ([t]) => {
+        if (t) {
+          const a = t.toLowerCase(), e = /* @__PURE__ */ new Set(), c = (s) => {
+            let i = !1;
+            if (s.children)
+              for (const n of s.children)
+                c(n) && (i = !0);
+            const d = s.label.toLowerCase().includes(a) || !!s.searchMatch;
+            return i && e.add(s.id), d || i;
+          };
+          l.data.forEach(c), e.forEach((s) => u.value.add(s));
+        }
+      },
+      { deep: !0 }
+    ), (t, a) => (p(), S("div", {
+      class: T(["w-full h-full overflow-y-auto", l.class])
+    }, [
+      b.value.length > 0 ? (p(!0), S(q, { key: 0 }, Q(b.value, (e) => (p(), V(F, {
+        key: e.id,
+        node: e,
+        "selection-mode": h.selectionMode,
+        "selected-keys": x.value,
+        "expanded-keys": u.value,
+        "indeterminate-keys": K.value,
+        "loading-keys": y.value,
+        "show-checkboxes": h.showCheckboxes,
+        "highlight-search": h.highlightSearch,
+        "search-query": h.searchQuery,
+        onToggleExpand: L,
+        onToggleSelect: B,
+        onClickNode: a[0] || (a[0] = (c) => f("node-click", c))
+      }, null, 8, ["node", "selection-mode", "selected-keys", "expanded-keys", "indeterminate-keys", "loading-keys", "show-checkboxes", "highlight-search", "search-query"]))), 128)) : (p(), S("div", z, "No results found."))
+    ], 2));
+  }
+});
+export {
+  $ as default
+};

package/components/FileTree/FileTree.vue2.js

@@ -0,0 +1,4 @@
+import f from "./FileTree.vue.js";
+export {
+  f as default
+};

package/components/FileTree/FileTreeNode.vue.d.ts

@@ -0,0 +1,28 @@
+import { FileNode, FileTreeSelectionMode } from './types';
+interface Props {
+    node: FileNode;
+    depth?: number;
+    selectionMode?: FileTreeSelectionMode;
+    selectedKeys: Set<string>;
+    indeterminateKeys: Set<string>;
+    expandedKeys: Set<string>;
+    loadingKeys: Set<string>;
+    showCheckboxes?: boolean;
+    highlightSearch?: boolean;
+    searchQuery?: string;
+}
+declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    "toggle-expand": (node: FileNode) => any;
+    "toggle-select": (node: FileNode) => any;
+    "click-node": (node: FileNode) => any;
+}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
+    "onToggle-expand"?: (node: FileNode) => any;
+    "onToggle-select"?: (node: FileNode) => any;
+    "onClick-node"?: (node: FileNode) => any;
+}>, {
+    depth: number;
+    selectionMode: FileTreeSelectionMode;
+    showCheckboxes: boolean;
+    highlightSearch: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;