vlite3 0.1.0 → 0.1.2

package/components/FileTree/FileTreeNode.vue.js

@@ -0,0 +1,184 @@
+import { defineComponent as q, computed as c, resolveComponent as z, openBlock as s, createElementBlock as d, createElementVNode as r, normalizeClass as y, normalizeStyle as f, withModifiers as M, createVNode as L, createCommentVNode as k, createBlock as u, Fragment as v, renderList as w, toDisplayString as p } from "vue";
+import g from "../Icon.vue.js";
+import I from "../CheckBox.vue.js";
+const V = { class: "flex flex-col select-none" }, D = ["title"], O = {
+  key: 1,
+  class: "w-6 mr-1"
+}, j = { class: "mr-2 text-muted-foreground shrink-0" }, U = { class: "flex-1 truncate text-sm font-medium" }, A = { class: "mr-2 text-gray-400 select-none shrink-0" }, G = { class: "truncate" }, H = {
+  key: 0,
+  class: "relative flex flex-col"
+}, X = /* @__PURE__ */ q({
+  name: "FileTreeNode",
+  __name: "FileTreeNode",
+  props: {
+    node: {},
+    depth: { default: 0 },
+    selectionMode: { default: "single" },
+    selectedKeys: {},
+    indeterminateKeys: {},
+    expandedKeys: {},
+    loadingKeys: {},
+    showCheckboxes: { type: Boolean, default: !1 },
+    highlightSearch: { type: Boolean, default: !1 },
+    searchQuery: {}
+  },
+  emits: ["toggle-expand", "toggle-select", "click-node"],
+  setup(e, { emit: N }) {
+    const n = e, m = N, b = c(() => n.selectedKeys.has(n.node.id)), S = c(() => n.indeterminateKeys.has(n.node.id)), x = c(() => n.expandedKeys.has(n.node.id)), C = c(() => n.loadingKeys.has(n.node.id)), h = c(
+      () => n.node.isFolder || n.node.children && n.node.children.length > 0
+    ), F = c(() => n.depth * 20 + "px"), T = c(() => {
+      const t = n.node.label, l = 35;
+      if (t.length <= l) return t;
+      const o = t.lastIndexOf(".");
+      if (o === -1 || t.length - o > 10)
+        return t.substring(0, l) + "...";
+      const i = t.substring(o), a = t.substring(0, o), Q = Math.max(0, l - i.length - 3);
+      return a.substring(0, Q) + "..." + i;
+    }), B = c(() => {
+      const t = T.value;
+      if (!n.highlightSearch || !n.searchQuery)
+        return [{ text: t, highlight: !1 }];
+      const l = n.searchQuery.toLowerCase(), o = t.toLowerCase().indexOf(l);
+      return o === -1 ? [{ text: t, highlight: !1 }] : [
+        { text: t.slice(0, o), highlight: !1 },
+        {
+          text: t.slice(o, o + l.length),
+          highlight: !0
+        },
+        { text: t.slice(o + l.length), highlight: !1 }
+      ];
+    }), E = c(() => {
+      const t = n.node.searchMatch;
+      if (!t) return [];
+      const l = t.line_content, o = t.match_start, i = t.match_length;
+      return o < 0 || o >= l.length ? [{ text: l, highlight: !1 }] : [
+        { text: l.substring(0, o), highlight: !1 },
+        { text: l.substring(o, o + i), highlight: !0 },
+        { text: l.substring(o + i), highlight: !1 }
+      ];
+    }), K = (t) => {
+      t && t.stopPropagation(), m("toggle-expand", n.node);
+    }, $ = () => {
+      m("toggle-select", n.node);
+    }, P = (t) => {
+      t.stopPropagation(), h.value ? K() : n.selectionMode !== "none" && m("toggle-select", n.node), m("click-node", n.node);
+    };
+    return (t, l) => {
+      const o = z("FileTreeNode", !0);
+      return s(), d("div", V, [
+        r("div", {
+          class: y(["group flex flex-col rounded-md transition-colors cursor-pointer", {
+            "bg-accent/50 text-accent-foreground": b.value && e.selectionMode === "single" && !e.showCheckboxes,
+            "hover:bg-accent/50": !b.value || e.selectionMode !== "single",
+            "opacity-50 pointer-events-none": e.node.disabled
+          }]),
+          onClick: P,
+          title: e.node.label
+        }, [
+          r("div", {
+            class: "flex items-center py-1 pr-2 min-h-[32px]",
+            style: f({ paddingLeft: F.value })
+          }, [
+            h.value ? (s(), d("button", {
+              key: 0,
+              type: "button",
+              class: y(["p-1 mr-1 rounded-sm hover:bg-muted text-muted-foreground transition-transform duration-200 focus:outline-none", { "rotate-90": x.value }]),
+              onClick: M(K, ["stop"])
+            }, [
+              L(g, {
+                icon: "lucide:chevron-right",
+                class: "w-4 h-4"
+              })
+            ], 2)) : (s(), d("div", O)),
+            e.showCheckboxes && e.selectionMode !== "none" ? (s(), d("div", {
+              key: 2,
+              class: "mr-2 flex items-center justify-center bg-transparent",
+              onClick: l[0] || (l[0] = M(() => {
+              }, ["stop"]))
+            }, [
+              L(I, {
+                checked: b.value,
+                indeterminate: S.value,
+                disabled: e.node.disabled,
+                "onUpdate:checked": $,
+                rounded: "sm",
+                size: "sm"
+              }, null, 8, ["checked", "indeterminate", "disabled"])
+            ])) : k("", !0),
+            r("div", j, [
+              C.value ? (s(), u(g, {
+                key: 0,
+                icon: "lucide:loader-2",
+                class: "w-4 h-4 animate-spin"
+              })) : e.node.icon ? (s(), u(g, {
+                key: 1,
+                icon: e.node.icon,
+                class: "w-4 h-4"
+              }, null, 8, ["icon"])) : h.value ? (s(), u(g, {
+                key: 2,
+                icon: x.value ? "lucide:folder-open" : "lucide:folder",
+                class: "w-4 h-4"
+              }, null, 8, ["icon"])) : (s(), u(g, {
+                key: 3,
+                icon: "lucide:file",
+                class: "w-4 h-4"
+              }))
+            ]),
+            r("div", U, [
+              (s(!0), d(v, null, w(B.value, (i, a) => (s(), d("span", {
+                key: a,
+                class: y({
+                  "bg-yellow-100 text-yellow-900 rounded-sm px-0.5": i.highlight
+                })
+              }, p(i.text), 3))), 128))
+            ])
+          ], 4),
+          e.node.searchMatch ? (s(), d("div", {
+            key: 0,
+            class: "flex items-center text-[11px] text-gray-500 font-mono pr-2 pb-1.5 truncate",
+            style: f({ paddingLeft: e.depth * 20 + 28 + "px" })
+          }, [
+            r("span", A, "L" + p(e.node.searchMatch.line_number), 1),
+            r("div", G, [
+              (s(!0), d(v, null, w(E.value, (i, a) => (s(), d("span", {
+                key: a,
+                class: y({
+                  "bg-yellow-500/20 text-gray-900 px-0.5 rounded-[1px] font-medium border border-yellow-600/30": i.highlight
+                })
+              }, p(i.text), 3))), 128))
+            ])
+          ], 4)) : k("", !0)
+        ], 10, D),
+        x.value && h.value && !C.value ? (s(), d("div", H, [
+          r("div", {
+            class: "absolute top-1 bottom-1 border-l border-border",
+            style: f({ left: e.depth * 20 + 10 + "px" })
+          }, null, 4),
+          e.node.children && e.node.children.length > 0 ? (s(!0), d(v, { key: 0 }, w(e.node.children, (i) => (s(), u(o, {
+            key: i.id,
+            node: i,
+            depth: e.depth + 1,
+            "selection-mode": e.selectionMode,
+            "selected-keys": e.selectedKeys,
+            "expanded-keys": e.expandedKeys,
+            "indeterminate-keys": e.indeterminateKeys,
+            "loading-keys": e.loadingKeys,
+            "show-checkboxes": e.showCheckboxes,
+            "highlight-search": e.highlightSearch,
+            "search-query": e.searchQuery,
+            onToggleExpand: l[1] || (l[1] = (a) => t.$emit("toggle-expand", a)),
+            onToggleSelect: l[2] || (l[2] = (a) => t.$emit("toggle-select", a)),
+            onClickNode: l[3] || (l[3] = (a) => t.$emit("click-node", a))
+          }, null, 8, ["node", "depth", "selection-mode", "selected-keys", "expanded-keys", "indeterminate-keys", "loading-keys", "show-checkboxes", "highlight-search", "search-query"]))), 128)) : x.value && h.value && (!e.node.children || e.node.children.length === 0) ? (s(), d("div", {
+            key: 1,
+            class: "py-0.5 text-xs text-muted-foreground italic",
+            style: f({ paddingLeft: (e.depth + 1) * 20 + 26 + "px" })
+          }, null, 4)) : k("", !0)
+        ])) : k("", !0)
+      ]);
+    };
+  }
+});
+export {
+  X as default
+};

package/components/FileTree/FileTreeNode.vue2.js

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

package/components/FileTree/index.d.ts

@@ -0,0 +1,4 @@
+export { default as FileTree } from './FileTree.vue';
+export { default as FileTreeNode } from './FileTreeNode.vue';
+export * from './types';
+export * from './useTreeSelection';

package/components/FileTree/types.d.ts

@@ -0,0 +1,36 @@
+export interface SearchMatch {
+    path?: string;
+    line_content: string;
+    line_number: number;
+    match_start: number;
+    match_length: number;
+}
+export interface FileNode {
+    id: string;
+    label: string;
+    isFolder?: boolean;
+    children?: FileNode[];
+    icon?: string;
+    disabled?: boolean;
+    isLoaded?: boolean;
+    data?: any;
+    searchMatch?: SearchMatch;
+}
+export type FileTreeSelectionMode = 'single' | 'multiple' | 'none';
+export interface FileTreeProps {
+    modelValue?: string[];
+    data?: FileNode[];
+    selectionMode?: FileTreeSelectionMode;
+    showCheckboxes?: boolean;
+    defaultExpandedKeys?: string[];
+    loadData?: (node: FileNode) => Promise<FileNode[]>;
+    highlightSearch?: boolean;
+    searchQuery?: string;
+    class?: string;
+}
+export interface FileTreeEvents {
+    (e: 'update:modelValue', keys: string[]): void;
+    (e: 'select', node: FileNode, selected: boolean): void;
+    (e: 'expand', node: FileNode, expanded: boolean): void;
+    (e: 'node-click', node: FileNode): void;
+}

package/components/FileTree/useTreeSelection.d.ts

@@ -0,0 +1,12 @@
+import { Ref } from 'vue';
+import { FileNode } from './types';
+interface UseTreeSelectionProps {
+    data: Ref<FileNode[]>;
+    selectedKeys: Ref<Set<string>>;
+    selectionMode: Ref<'single' | 'multiple' | 'none'>;
+    emit: (event: 'update:modelValue' | 'select', ...args: any[]) => void;
+}
+export declare function useTreeSelection({ data, selectedKeys, selectionMode, emit, }: UseTreeSelectionProps): {
+    toggleSelection: (node: FileNode, selected: boolean) => void;
+};
+export {};

package/components/FileTree/useTreeSelection.js

@@ -0,0 +1,25 @@
+function s({
+  data: n,
+  selectedKeys: c,
+  selectionMode: t,
+  emit: a
+}) {
+  return {
+    toggleSelection: (i, r) => {
+      if (i.disabled) return;
+      const e = new Set(c.value);
+      if (t.value === "single")
+        e.clear(), r && e.add(i.id);
+      else if (t.value === "multiple") {
+        const d = (l, u) => {
+          l.disabled || (u ? e.add(l.id) : e.delete(l.id), l.children && l.children.forEach((f) => d(f, u)));
+        };
+        d(i, r);
+      }
+      a("update:modelValue", Array.from(e)), a("select", i, r);
+    }
+  };
+}
+export {
+  s as useTreeSelection
+};

package/components/Form/CustomFields.vue.d.ts

@@ -0,0 +1,38 @@
+import { IForm } from './types';
+import { InputVariant, InputSize, InputRounded } from '../../types';
+interface Props {
+    modelValue?: Record<string, any>[];
+    schema: IForm[];
+    headers?: string[];
+    variant?: InputVariant;
+    size?: InputSize;
+    rounded?: InputRounded;
+    disabled?: boolean;
+    minRows?: number;
+    maxRows?: number;
+    addButtonText?: string;
+    label: string;
+    showRowNumbers?: boolean;
+    /** All form values for context */
+    values?: Record<string, any>;
+    isUpdate?: boolean;
+}
+declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    "update:modelValue": (value: Record<string, any>[]) => any;
+    change: (value: Record<string, any>[]) => any;
+}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
+    "onUpdate:modelValue"?: (value: Record<string, any>[]) => any;
+    onChange?: (value: Record<string, any>[]) => any;
+}>, {
+    disabled: boolean;
+    size: InputSize;
+    variant: InputVariant;
+    modelValue: Record<string, any>[];
+    rounded: InputRounded;
+    headers: string[];
+    isUpdate: boolean;
+    minRows: number;
+    addButtonText: string;
+    showRowNumbers: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/components/Form/CustomFields.vue.js

@@ -0,0 +1,7 @@
+import o from "./CustomFields.vue2.js";
+/* empty css                  */
+import t from "../../_virtual/_plugin-vue_export-helper.js";
+const d = /* @__PURE__ */ t(o, [["__scopeId", "data-v-79b7dd60"]]);
+export {
+  d as default
+};

package/components/Form/CustomFields.vue2.js

@@ -0,0 +1,161 @@
+import { defineComponent as U, ref as E, watch as T, computed as b, openBlock as r, createElementBlock as n, createElementVNode as m, createVNode as c, withCtx as R, createTextVNode as D, toDisplayString as v, createCommentVNode as u, Fragment as h, renderList as w, normalizeClass as _, TransitionGroup as S } from "vue";
+import G from "./FormField.vue.js";
+import k from "../Button.vue.js";
+import H from "../Label.vue.js";
+const L = { class: "custom-fields-wrapper" }, M = { class: "flex justify-between items-center mb-2" }, q = { class: "custom-fields-table border border-border rounded overflow-hidden bg-background" }, J = {
+  key: 0,
+  class: "flex border-b border-border bg-muted/50 text-gray-800 text-xs font-semibold uppercase tracking-wider"
+}, K = {
+  key: 0,
+  class: "w-10 flex-none p-3 text-center border-r border-border"
+}, O = {
+  key: 1,
+  class: "w-10 flex-none p-3"
+}, P = {
+  key: 0,
+  class: "w-10 flex-none flex items-center justify-center text-xs text-muted-foreground border-r border-border bg-muted/20"
+}, Q = {
+  key: 1,
+  class: "w-10 flex-none flex items-center justify-center border-l border-border bg-muted/20"
+}, W = {
+  key: 1,
+  class: "flex flex-col items-center justify-center py-6 text-center bg-muted/5"
+}, ee = /* @__PURE__ */ U({
+  __name: "CustomFields",
+  props: {
+    modelValue: { default: () => [] },
+    schema: {},
+    headers: { default: () => [] },
+    variant: { default: "outline" },
+    size: { default: "md" },
+    rounded: { default: "md" },
+    disabled: { type: Boolean, default: !1 },
+    minRows: { default: 0 },
+    maxRows: {},
+    addButtonText: { default: "Add Row" },
+    label: {},
+    showRowNumbers: { type: Boolean, default: !1 },
+    values: {},
+    isUpdate: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(d, { emit: C }) {
+    const a = d, x = C, s = E([]), g = () => `row_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+    T(
+      () => a.modelValue,
+      (e) => {
+        Array.isArray(e) ? s.value = e.map((t, o) => {
+          const l = s.value[o];
+          return {
+            ...t,
+            _id: l?._id || g()
+          };
+        }) : s.value = [];
+      },
+      { immediate: !0, deep: !0 }
+    );
+    const V = () => {
+      const e = {};
+      for (const t of a.schema) {
+        const o = typeof t.value == "function" ? t.value() : t.value;
+        e[t.name] = o ?? null;
+      }
+      return { ...e, _id: g() };
+    }, N = () => {
+      if (a.disabled || a.maxRows && s.value.length >= a.maxRows) return;
+      const e = [...s.value, V()];
+      s.value = e, f(e);
+    }, B = (e) => {
+      if (a.disabled || s.value.length <= a.minRows) return;
+      const t = [...s.value];
+      t.splice(e, 1), s.value = t, f(t);
+    }, $ = (e, t, o) => {
+      const l = [...s.value];
+      l[e] = {
+        ...l[e],
+        [t]: o.value
+      }, s.value = l, f(l);
+    }, f = (e) => {
+      const t = e.map(({ _id: o, ...l }) => l);
+      x("update:modelValue", t), x("change", t);
+    }, z = (e, t) => s.value[e]?.[t], A = b(() => !(a.disabled || a.maxRows && s.value.length >= a.maxRows)), p = b(() => a.disabled ? !1 : s.value.length > a.minRows), y = b(() => a.headers && a.headers.length > 0 ? a.headers : a.schema.map((e) => e.label || e.name));
+    return (e, t) => (r(), n("div", L, [
+      m("div", M, [
+        c(H, { class: "text-sm font-medium text-foreground" }, {
+          default: R(() => [
+            D(v(d.label), 1)
+          ]),
+          _: 1
+        }),
+        c(k, {
+          type: "button",
+          variant: "outline",
+          size: "xs",
+          rounded: "full",
+          icon: "lucide:plus",
+          disabled: !A.value,
+          onClick: N
+        }, null, 8, ["disabled"])
+      ]),
+      m("div", q, [
+        y.value.length > 0 ? (r(), n("div", J, [
+          d.showRowNumbers ? (r(), n("div", K, " # ")) : u("", !0),
+          (r(!0), n(h, null, w(y.value, (o, l) => (r(), n("div", {
+            key: l,
+            class: _(["flex-1 p-3 min-w-0 truncate", { "border-l border-border": l > 0 }])
+          }, v(o), 3))), 128)),
+          p.value ? (r(), n("div", O)) : u("", !0)
+        ])) : u("", !0),
+        c(S, {
+          name: "list",
+          tag: "div",
+          class: "divide-y divide-border"
+        }, {
+          default: R(() => [
+            (r(!0), n(h, null, w(s.value, (o, l) => (r(), n("div", {
+              key: o._id,
+              class: "flex group bg-white transition-colors"
+            }, [
+              d.showRowNumbers ? (r(), n("div", P, v(l + 1), 1)) : u("", !0),
+              (r(!0), n(h, null, w(d.schema, (i, j) => (r(), n("div", {
+                key: i.name,
+                class: _(["flex-1 min-w-0 relative", { "border-l border-border": j > 0 }])
+              }, [
+                c(G, {
+                  field: { ...i, label: void 0 },
+                  value: z(l, i.name),
+                  values: d.values || {},
+                  variant: "transparent",
+                  size: "sm",
+                  rounded: "none",
+                  disabled: d.disabled,
+                  isUpdate: d.isUpdate,
+                  class: "w-full h-full min-h-[40px]",
+                  onChange: (F) => $(l, i.name, F)
+                }, null, 8, ["field", "value", "values", "disabled", "isUpdate", "onChange"])
+              ], 2))), 128)),
+              p.value ? (r(), n("div", Q, [
+                c(k, {
+                  type: "button",
+                  variant: "ghost",
+                  size: "xs",
+                  icon: "lucide:trash-2",
+                  disabled: d.disabled,
+                  onClick: (i) => B(l)
+                }, null, 8, ["disabled", "onClick"])
+              ])) : u("", !0)
+            ]))), 128))
+          ]),
+          _: 1
+        }),
+        s.value.length === 0 ? (r(), n("div", W, [...t[0] || (t[0] = [
+          m("p", { class: "text-sm font-medium text-foreground" }, "No items added", -1),
+          m("p", { class: "text-xs text-muted-foreground mt-1" }, "Add a new item to get started", -1)
+        ])])) : u("", !0)
+      ])
+    ]));
+  }
+});
+export {
+  ee as default
+};

package/components/Form/Form.vue.d.ts

@@ -0,0 +1,94 @@
+import { IForm, IFormStep, IFormSubmitPayload } from './types';
+import { InputVariant, InputSize, InputRounded, TimelineTextPosition, ButtonProps } from '../../types';
+interface Props {
+    /** Schema - single array or grouped arrays */
+    schema: IForm[] | IForm[][];
+    /** Initial/bound values */
+    values?: Record<string, any>;
+    /** Input variant applied to all fields */
+    variant?: InputVariant;
+    /** Input size applied to all fields */
+    size?: InputSize;
+    /** Input rounded applied to all fields */
+    rounded?: InputRounded;
+    /** Loading state during submit */
+    loading?: boolean;
+    /** Show/hide default footer with submit button */
+    footer?: boolean;
+    /** Headings for grouped schemas */
+    groupsHeadings?: string[];
+    /** Descriptions for grouped schemas */
+    groupHeadingsDescription?: string[];
+    /** Timeline steps for multi-step form mode */
+    tabs?: IFormStep[];
+    /** Submit button text */
+    submitText?: string;
+    submitProps?: ButtonProps;
+    /** Cancel button text */
+    cancelText?: string;
+    /** Show cancel button */
+    showCancel?: boolean;
+    /** Whether this is an update operation */
+    isUpdate?: boolean;
+    /** Custom class for form element */
+    class?: string;
+    /** Custom class for the grid layout (overrides columns) */
+    className?: string;
+    /** Custom class for group containers */
+    groupClass?: string;
+    /** Custom class for group/step headers */
+    headerClass?: string;
+    /** Custom class for the footer area */
+    footerClass?: string;
+    /** Timeline text position */
+    timelineTextPosition?: TimelineTextPosition;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {
+            values: Record<string, any>;
+            errors: Record<string, string>;
+            isSubmitting: boolean;
+            handleSubmit: () => Promise<void>;
+        }): any;
+    };
+    refs: {};
+    rootEl: HTMLFormElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    onSubmit: (payload: IFormSubmitPayload) => any;
+    onCancel: () => any;
+    onStepChange: (step: number) => any;
+}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
+    onOnSubmit?: (payload: IFormSubmitPayload) => any;
+    onOnCancel?: () => any;
+    onOnStepChange?: (step: number) => any;
+}>, {
+    values: Record<string, any>;
+    footer: boolean;
+    class: string;
+    size: InputSize;
+    variant: InputVariant;
+    loading: boolean;
+    rounded: InputRounded;
+    className: string;
+    headerClass: string;
+    footerClass: string;
+    cancelText: string;
+    isUpdate: boolean;
+    groupsHeadings: string[];
+    groupHeadingsDescription: string[];
+    submitText: string;
+    showCancel: boolean;
+    groupClass: string;
+    timelineTextPosition: TimelineTextPosition;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLFormElement>;
+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/Form/Form.vue.js

@@ -0,0 +1,7 @@
+import o from "./Form.vue2.js";
+/* empty css          */
+import r from "../../_virtual/_plugin-vue_export-helper.js";
+const p = /* @__PURE__ */ r(o, [["__scopeId", "data-v-25a5775d"]]);
+export {
+  p as default
+};