vlite3 0.4.8 → 0.5.2

package/components/ImportData/ImportData.vue.js

@@ -0,0 +1,242 @@
+import { defineComponent as te, computed as h, ref as c, openBlock as n, createBlock as v, withCtx as x, createElementVNode as S, createTextVNode as C, toDisplayString as I, createElementBlock as F, createCommentVNode as $, createVNode as ae, unref as le, Fragment as ie, renderList as oe, renderSlot as re } from "vue";
+import se from "../Modal.vue.js";
+import _ from "../Button.vue.js";
+import ne from "../Timeline/Timeline.vue.js";
+import "@iconify/vue";
+import { $t as z } from "../../utils/i18n.js";
+import ue from "./ImportStep1.vue.js";
+import pe from "./ImportStep2.vue.js";
+import de from "./ImportStep3.vue.js";
+import ce from "./ImportStep4.vue.js";
+import { showToast as j } from "../../composables/useNotifications.js";
+const ve = { class: "px-2 sm:px-4 py-2" }, me = { class: "min-h-[300px]" }, fe = {
+  key: 0,
+  class: "mt-4 p-3 bg-destructive/10 border border-destructive/20 rounded-lg text-sm text-destructive"
+}, ge = { class: "list-disc pl-5 space-y-1" }, he = { class: "flex items-center justify-between w-full" }, be = { key: 1 }, $e = /* @__PURE__ */ te({
+  __name: "ImportData",
+  props: {
+    title: { default: "Import Data" },
+    titleI18n: {},
+    buttonText: { default: "Import" },
+    buttonIcon: { default: "lucide:upload" },
+    fields: {},
+    batchSize: { default: 200 },
+    processBatch: {},
+    onComplete: {},
+    show: { type: Boolean, default: !1 }
+  },
+  emits: ["update:show"],
+  setup(y, { emit: K }) {
+    const s = y, L = K, E = h({
+      get: () => s.show,
+      set: (e) => L("update:show", e)
+    }), d = (e, a, u) => {
+      const t = u ? z(e, u) : z(e);
+      return t !== e ? t : a;
+    }, P = h(() => {
+      if (s.titleI18n) {
+        const e = z(s.titleI18n);
+        if (e !== s.titleI18n) return e;
+      }
+      return s.title;
+    }), i = c(1), f = c(!1), B = c([]), m = c({}), N = c({
+      existing: "replace",
+      new: "create"
+    }), M = c(""), T = c(null), q = c([]), O = c([]), w = c([]), U = {
+      total: 0,
+      processed: 0,
+      created: 0,
+      updated: 0,
+      skipped: 0,
+      failed: 0,
+      percentage: 0,
+      errors: []
+    }, o = c({ ...U }), A = () => {
+      i.value = 1, f.value = !1, B.value = [], m.value = {}, N.value = { existing: "replace", new: "create" }, M.value = "", T.value = null, q.value = [], O.value = [], w.value = [], o.value = { ...U };
+    }, R = () => {
+      const e = [], a = {};
+      for (const l in m.value) {
+        const p = m.value[l];
+        p && (a[p] || (a[p] = []), a[p].push(l));
+      }
+      for (const l in a)
+        a[l].length > 1 && e.push(
+          `Field "${l}" is mapped to multiple headers: ${a[l].join(", ")}`
+        );
+      const u = s.fields.filter((l) => l.required).map((l) => l.field), t = Object.values(m.value);
+      for (const l of u)
+        if (!t.includes(l)) {
+          const p = s.fields.find((r) => r.field === l)?.title || l;
+          e.push(`Required field "${p}" is not mapped.`);
+        }
+      return e;
+    }, V = () => {
+      i.value === 2 && (w.value = R(), w.value.length > 0) || i.value < 4 && i.value++;
+    }, G = () => {
+      i.value > 1 && !f.value && i.value--;
+    }, H = (e, a) => e.map((u) => {
+      const t = {};
+      for (const l in a) {
+        const p = a[l];
+        if (!p) continue;
+        let r = u[l];
+        const b = s.fields.find((g) => g.field === p);
+        if ((r == null || r === "") && b?.defaultValue !== void 0 && (r = b.defaultValue), b?.expectedType && (b.expectedType === "number" && (r = Number(r) || 0), b.expectedType === "boolean" && (r = !!(r && r.toString().toLowerCase() !== "false" && r !== "0"))), b?.onMatch && (r = b.onMatch(r)), p.includes(".")) {
+          const g = p.split(".");
+          let k = t;
+          for (let D = 0; D < g.length - 1; D++)
+            k[g[D]] || (k[g[D]] = {}), k = k[g[D]];
+          k[g[g.length - 1]] = r;
+        } else
+          t[p] = r;
+      }
+      return t;
+    }), J = async () => {
+      f.value = !0, V();
+      try {
+        const e = H(B.value, m.value);
+        o.value = { ...U, total: e.length };
+        const a = [];
+        for (let t = 0; t < e.length; t += s.batchSize)
+          a.push(e.slice(t, t + s.batchSize));
+        const u = setInterval(() => {
+          o.value.percentage < 90 && (o.value.percentage += Math.floor(Math.random() * 5) + 1);
+        }, 1e3);
+        for (const t of a) {
+          const l = await s.processBatch({
+            data: t,
+            options: N.value
+          });
+          o.value.processed += l.processed, o.value.created += l.created, o.value.updated += l.updated, o.value.skipped += l.skipped, o.value.failed += l.failed, o.value.errors = [...o.value.errors, ...l.errors || []], o.value.percentage = Math.min(
+            99,
+            Math.floor(o.value.processed / o.value.total * 100)
+          );
+        }
+        clearInterval(u), o.value.percentage = 100, o.value.failed === 0 ? j(d("vlite.importData.success", "Data imported successfully."), "success") : j(d("vlite.importData.partial", "Import completed with some errors."), "warning"), s.onComplete && s.onComplete();
+      } catch (e) {
+        console.error(e), j(d("vlite.importData.error", "A critical error occurred during import."), "error");
+      } finally {
+        f.value = !1;
+      }
+    }, Q = h(() => s.fields.map((e) => ({ value: e.field, label: e.title, required: e.required }))), W = h(() => [
+      { id: 1, title: d("vlite.importData.stepUpload", "Upload"), icon: "lucide:upload" },
+      { id: 2, title: d("vlite.importData.stepMapping", "Mapping"), icon: "lucide:git-pull-request" },
+      { id: 3, title: d("vlite.importData.stepOptions", "Options"), icon: "lucide:settings-2" },
+      { id: 4, title: d("vlite.importData.stepImport", "Import"), icon: "lucide:loader" }
+    ]), X = h(() => d("vlite.importData.btnBack", "Back")), Y = h(() => d("vlite.importData.btnNext", "Next")), Z = h(() => d("vlite.importData.btnStart", "Start Import")), ee = h(() => d("vlite.importData.btnDone", "Done"));
+    return (e, a) => (n(), v(se, {
+      show: E.value,
+      "onUpdate:show": a[4] || (a[4] = (u) => E.value = u),
+      title: P.value,
+      "max-width": "sm:max-w-4xl",
+      onClose: A,
+      "close-outside": !f.value
+    }, {
+      trigger: x(() => [
+        re(e.$slots, "trigger", {}, () => [
+          y.show ? $("", !0) : (n(), v(_, {
+            key: 0,
+            text: y.buttonText,
+            icon: y.buttonIcon,
+            variant: "outline"
+          }, null, 8, ["text", "icon"]))
+        ])
+      ]),
+      default: x(({ close: u }) => [
+        S("div", ve, [
+          ae(le(ne), {
+            steps: W.value,
+            "active-step": i.value - 1,
+            class: "mb-13"
+          }, null, 8, ["steps", "active-step"]),
+          S("div", me, [
+            i.value === 1 ? (n(), v(ue, {
+              key: 0,
+              importMethod: M.value,
+              "onUpdate:importMethod": a[0] || (a[0] = (t) => M.value = t),
+              csvFile: T.value,
+              "onUpdate:csvFile": a[1] || (a[1] = (t) => T.value = t),
+              mappings: m.value,
+              "onUpdate:mappings": a[2] || (a[2] = (t) => m.value = t),
+              fields: y.fields,
+              headers: q.value,
+              preview: O.value,
+              importData: B.value,
+              onNext: V
+            }, null, 8, ["importMethod", "csvFile", "mappings", "fields", "headers", "preview", "importData"])) : i.value === 2 ? (n(), v(pe, {
+              key: 1,
+              mappings: m.value,
+              "onUpdate:mappings": a[3] || (a[3] = (t) => m.value = t),
+              headers: q.value,
+              preview: O.value,
+              availableFields: Q.value
+            }, null, 8, ["mappings", "headers", "preview", "availableFields"])) : i.value === 3 ? (n(), v(de, {
+              key: 2,
+              importOptions: N.value
+            }, null, 8, ["importOptions"])) : i.value === 4 ? (n(), v(ce, {
+              key: 3,
+              progress: o.value
+            }, null, 8, ["progress"])) : $("", !0)
+          ]),
+          w.value.length > 0 && i.value === 2 ? (n(), F("div", fe, [
+            S("ul", ge, [
+              (n(!0), F(ie, null, oe(w.value, (t) => (n(), F("li", { key: t }, I(t), 1))), 128))
+            ])
+          ])) : $("", !0)
+        ])
+      ]),
+      footer: x(({ close: u }) => [
+        S("div", he, [
+          i.value > 1 && i.value < 4 ? (n(), v(_, {
+            key: 0,
+            variant: "outline",
+            onClick: G,
+            disabled: f.value,
+            icon: "lucide:arrow-left"
+          }, {
+            default: x(() => [
+              C(I(X.value), 1)
+            ]),
+            _: 1
+          }, 8, ["disabled"])) : (n(), F("div", be)),
+          i.value < 3 ? (n(), v(_, {
+            key: 2,
+            variant: "primary",
+            onClick: V,
+            disabled: i.value === 1 && !M.value || f.value,
+            "icon-right": "lucide:arrow-right"
+          }, {
+            default: x(() => [
+              C(I(Y.value), 1)
+            ]),
+            _: 1
+          }, 8, ["disabled"])) : i.value === 3 ? (n(), v(_, {
+            key: 3,
+            variant: "primary",
+            icon: "lucide:play",
+            onClick: J,
+            loading: f.value
+          }, {
+            default: x(() => [
+              C(I(Z.value), 1)
+            ]),
+            _: 1
+          }, 8, ["loading"])) : i.value === 4 && o.value.percentage >= 100 ? (n(), v(_, {
+            key: 4,
+            variant: "primary",
+            onClick: u
+          }, {
+            default: x(() => [
+              C(I(ee.value), 1)
+            ]),
+            _: 1
+          }, 8, ["onClick"])) : $("", !0)
+        ])
+      ]),
+      _: 3
+    }, 8, ["show", "title", "close-outside"]));
+  }
+});
+export {
+  $e as default
+};

package/components/ImportData/ImportData.vue2.js

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

package/components/ImportData/ImportStep1.vue.d.ts

@@ -0,0 +1,23 @@
+import { ImportField } from './types';
+type __VLS_Props = {
+    importMethod: string;
+    csvFile: File | null;
+    headers: string[];
+    fields: ImportField[];
+    preview: any[];
+    importData: any[];
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    next: (...args: any[]) => void;
+    "update:importMethod": (...args: any[]) => void;
+    "update:csvFile": (...args: any[]) => void;
+    "update:mappings": (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onNext?: (...args: any[]) => any;
+    "onUpdate:importMethod"?: (...args: any[]) => any;
+    "onUpdate:csvFile"?: (...args: any[]) => any;
+    "onUpdate:mappings"?: (...args: any[]) => any;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    fileInput: HTMLInputElement;
+}, HTMLDivElement>;
+export default _default;

package/components/ImportData/ImportStep1.vue.js

@@ -0,0 +1,162 @@
+import { defineComponent as A, ref as b, computed as d, openBlock as w, createElementBlock as V, createElementVNode as a, toDisplayString as l, withModifiers as F, normalizeClass as E, createVNode as h, createCommentVNode as J, withCtx as K, createTextVNode as L } from "vue";
+import R from "../../_virtual/papaparse.min.js";
+import M from "../Icon.vue.js";
+import W from "../Button.vue.js";
+import q from "../Textarea.vue.js";
+import { showToast as g } from "../../composables/useNotifications.js";
+import { $t as k } from "../../utils/i18n.js";
+import { camelCase as y } from "../../utils/functions.js";
+const G = { class: "space-y-2" }, Q = { class: "font-medium text-md" }, X = { class: "space-y-6" }, Y = { class: "flex flex-col items-center justify-center pointer-events-none" }, Z = { class: "w-12 h-12 rounded-full bg-primary/10 flex items-center justify-center mb-4 text-primary" }, ee = { class: "font-medium text-foreground mb-1" }, te = { class: "text-sm text-muted-foreground" }, re = {
+  key: 0,
+  class: "mt-4 text-sm font-semibold text-primary bg-background px-3 py-1 rounded-md border border-border shadow-sm inline-block"
+}, ae = { class: "flex items-center gap-3 mb-4" }, oe = { class: "w-8 h-8 rounded-lg bg-secondary flex items-center justify-center text-secondary-foreground" }, se = { class: "font-medium text-foreground leading-none" }, ie = { class: "flex justify-end mt-3" }, ve = /* @__PURE__ */ A({
+  __name: "ImportStep1",
+  props: {
+    importMethod: {},
+    csvFile: {},
+    headers: {},
+    fields: {},
+    preview: {},
+    importData: {}
+  },
+  emits: ["update:importMethod", "update:csvFile", "update:mappings", "next"],
+  setup(n, { emit: P }) {
+    const i = n, c = P, o = (t, e, r) => {
+      const s = r ? k(t, r) : k(t);
+      return s !== t ? s : e;
+    }, D = b(null), f = b(!1), p = b(""), S = (t) => {
+      if (t.preventDefault(), f.value = !1, t.dataTransfer?.files && t.dataTransfer.files.length > 0) {
+        const e = t.dataTransfer.files[0];
+        e.type === "text/csv" || e.name.endsWith(".csv") ? _(e) : g(o("vlite.importData.csvOnly", "Please upload a CSV file"), "error");
+      }
+    }, _ = (t) => {
+      c("update:csvFile", t), c("update:importMethod", "file");
+      const e = new FileReader();
+      e.onload = (r) => {
+        r.target?.result && C(r.target.result);
+      }, e.readAsText(t);
+    }, T = () => {
+      c("update:importMethod", "paste"), p.value && C(p.value);
+    }, j = (t) => {
+      const e = y(t).replace(/\s+/g, ""), r = {};
+      return i.fields.forEach((s) => {
+        r[y(s.field)] = s.field, s.matchings?.forEach((u) => {
+          r[y(u)] = s.field;
+        });
+      }), r[e] || "";
+    }, C = (t) => {
+      try {
+        R.parse(t, {
+          header: !0,
+          skipEmptyLines: !0,
+          complete: (e) => {
+            if (!e.data || e.data.length === 0) {
+              g(o("vlite.importData.emptyCsv", "The CSV file is empty."), "warning");
+              return;
+            }
+            const r = Object.keys(e.data[0]);
+            i.headers.splice(0, i.headers.length, ...r);
+            const s = e.data.map((m) => {
+              const v = {};
+              return Object.keys(m).forEach((x) => {
+                v[x] = m[x] || i.fields.find((B) => B.field === x)?.defaultValue;
+              }), v;
+            });
+            i.importData.splice(0, i.importData.length, ...s), i.preview.splice(0, i.preview.length, ...e.data.slice(0, 3));
+            const u = {};
+            r.forEach((m) => {
+              const v = j(m);
+              u[m] = v || "";
+            }), c("update:mappings", u), c("next");
+          },
+          error: (e) => g(
+            o("vlite.importData.parseError", "Failed to parse CSV: ") + e.message,
+            "error"
+          )
+        });
+      } catch (e) {
+        g(o("vlite.importData.processError", "Error processing CSV data"), "error"), console.error(e);
+      }
+    }, O = (t) => {
+      const e = t.target;
+      e.files && e.files.length > 0 && _(e.files[0]);
+    }, $ = d(() => o("vlite.importData.uploadData", "Upload Data")), I = d(() => o("vlite.importData.dragDrop", "Drag & drop a file here or click to browse")), z = d(() => o("vlite.importData.csvOnlyHint", "Only CSV files are supported")), H = d(() => o("vlite.importData.pasteData", "Or paste CSV/Excel data")), N = d(() => o("vlite.importData.process", "Process Data")), U = d(() => o("vlite.importData.pastePlaceholder", `id, name, email
+1, John Doe, john@example.com`));
+    return (t, e) => (w(), V("div", G, [
+      a("h5", Q, l($.value), 1),
+      a("div", X, [
+        a("div", {
+          class: E([
+            "relative border-2 border-dashed rounded-xl p-8 text-center cursor-pointer transition-colors",
+            n.importMethod === "file" ? "border-primary bg-primary/5" : "border-border hover:border-primary/50",
+            f.value ? "border-primary bg-primary/10 scale-[1.01]" : ""
+          ]),
+          onClick: e[0] || (e[0] = (r) => D.value?.click()),
+          onDragover: e[1] || (e[1] = F((r) => f.value = !0, ["prevent"])),
+          onDragleave: e[2] || (e[2] = F((r) => f.value = !1, ["prevent"])),
+          onDrop: S
+        }, [
+          a("input", {
+            type: "file",
+            ref_key: "fileInput",
+            ref: D,
+            class: "hidden",
+            accept: ".csv",
+            onChange: O
+          }, null, 544),
+          a("div", Y, [
+            a("div", Z, [
+              h(M, {
+                icon: "lucide:upload-cloud",
+                class: "w-6 h-6"
+              })
+            ]),
+            a("p", ee, l(I.value), 1),
+            a("p", te, l(z.value), 1),
+            n.csvFile ? (w(), V("p", re, l(n.csvFile.name) + " (" + l((n.csvFile.size / 1024).toFixed(2)) + " KB) ", 1)) : J("", !0)
+          ])
+        ], 34),
+        a("div", {
+          class: E([
+            "border rounded-xl p-6 transition-colors",
+            n.importMethod === "paste" ? "border-primary shadow-sm ring-1 ring-primary/20" : "border-border"
+          ])
+        }, [
+          a("div", ae, [
+            a("div", oe, [
+              h(M, {
+                icon: "lucide:clipboard-paste",
+                class: "w-4 h-4"
+              })
+            ]),
+            a("div", null, [
+              a("p", se, l(H.value), 1)
+            ])
+          ]),
+          h(q, {
+            modelValue: p.value,
+            "onUpdate:modelValue": e[3] || (e[3] = (r) => p.value = r),
+            class: "w-full h-32",
+            placeholder: U.value
+          }, null, 8, ["modelValue", "placeholder"]),
+          a("div", ie, [
+            h(W, {
+              variant: "secondary",
+              size: "sm",
+              onClick: T,
+              disabled: !p.value
+            }, {
+              default: K(() => [
+                L(l(N.value), 1)
+              ]),
+              _: 1
+            }, 8, ["disabled"])
+          ])
+        ], 2)
+      ])
+    ]));
+  }
+});
+export {
+  ve as default
+};

package/components/ImportData/ImportStep1.vue2.js

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

package/components/ImportData/ImportStep2.vue.d.ts

@@ -0,0 +1,20 @@
+type __VLS_Props = {
+    headers: string[];
+    preview: any[];
+    mappings: Record<string, string>;
+    availableFields: {
+        value: string;
+        label: string;
+        required?: boolean;
+    }[];
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    next: (...args: any[]) => void;
+    "update:mappings": (...args: any[]) => void;
+    prev: (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onNext?: (...args: any[]) => any;
+    "onUpdate:mappings"?: (...args: any[]) => any;
+    onPrev?: (...args: any[]) => any;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/components/ImportData/ImportStep2.vue.js

@@ -0,0 +1,98 @@
+import { defineComponent as H, ref as M, computed as c, openBlock as o, createElementBlock as l, createElementVNode as e, toDisplayString as a, Fragment as m, renderList as v, normalizeClass as N, createBlock as V, unref as $, createCommentVNode as x, createVNode as z } from "vue";
+import A from "../Dropdown/Dropdown.vue.js";
+import "@iconify/vue";
+import { $t as B } from "../../utils/i18n.js";
+import I from "../CheckBox.vue.js";
+const O = { class: "space-y-6" }, j = { class: "font-medium text-lg mb-1" }, E = { class: "text-sm text-muted-foreground" }, P = { class: "border border-border rounded-xl overflow-hidden" }, R = { class: "overflow-x-auto max-h-[400px]" }, U = { class: "w-full text-sm text-left" }, q = { class: "text-xs text-muted-foreground uppercase bg-muted sticky top-0 z-10" }, L = { class: "px-4 py-3 font-medium" }, W = { class: "px-4 py-3 font-medium" }, G = { class: "px-4 py-3 font-medium" }, J = { class: "divide-y divide-border" }, K = { class: "px-4 py-3 font-medium text-foreground whitespace-nowrap" }, Q = { class: "px-4 py-2 min-w-[200px]" }, T = {
+  key: 1,
+  class: "text-xs italic text-muted-foreground"
+}, X = { class: "px-4 py-3 text-muted-foreground min-w-[200px] max-w-[300px]" }, Y = {
+  key: 0,
+  class: "space-y-1"
+}, Z = { class: "px-4 py-3 text-center align-middle" }, ee = { class: "flex justify-center items-center h-full" }, te = {
+  key: 0,
+  class: "text-center text-sm text-warning font-medium p-4 bg-warning/10 rounded-lg border border-warning/20"
+}, ae = /* @__PURE__ */ H({
+  __name: "ImportStep2",
+  props: {
+    headers: {},
+    preview: {},
+    mappings: {},
+    availableFields: {}
+  },
+  emits: ["next", "prev", "update:mappings"],
+  setup(p, { emit: g }) {
+    const u = p, _ = g, n = M([]), d = (t, i) => {
+      const s = B(t);
+      return s !== t ? s : i;
+    }, f = c(() => u.headers.filter((t) => u.mappings[t] !== "")), h = (t) => {
+      const i = { ...u.mappings };
+      n.value.includes(t) ? n.value = n.value.filter((r) => r !== t) : n.value.push(t), i[t] !== "" && (i[t] = ""), _("update:mappings", i);
+    }, y = () => u.availableFields.map((t) => ({
+      label: t.required ? `${t.label} *` : t.label,
+      value: t.value
+    })), w = c(() => d("vlite.importData.assignFields", "Assign Fields")), b = c(() => d("vlite.importData.assignDesc", "Match your CSV columns to the correct system fields.")), k = c(() => d("vlite.importData.csvHeader", "CSV Header")), D = c(() => d("vlite.importData.fieldMapping", "System Field")), S = c(() => d("vlite.importData.preview", "Data Preview")), F = c(() => d("vlite.importData.noHeaders", "No headers mapped. Data will not be imported properly."));
+    return (t, i) => (o(), l("div", O, [
+      e("div", null, [
+        e("h4", j, a(w.value), 1),
+        e("p", E, a(b.value), 1)
+      ]),
+      e("div", P, [
+        e("div", R, [
+          e("table", U, [
+            e("thead", q, [
+              e("tr", null, [
+                e("th", L, a(k.value), 1),
+                e("th", W, a(D.value), 1),
+                e("th", G, a(S.value), 1),
+                i[0] || (i[0] = e("th", { class: "px-4 py-3 font-medium text-center w-16" }, "Ignore", -1))
+              ])
+            ]),
+            e("tbody", J, [
+              (o(!0), l(m, null, v(p.headers, (s) => (o(), l("tr", {
+                key: s,
+                class: N(n.value.includes(s) ? "bg-muted/30 opacity-60" : "hover:bg-muted/10")
+              }, [
+                e("td", K, a(s), 1),
+                e("td", Q, [
+                  n.value.includes(s) ? (o(), l("span", T, "Ignored")) : (o(), V($(A), {
+                    key: 0,
+                    class: "w-full",
+                    options: y(),
+                    selected: p.mappings[s],
+                    placeholder: "Select Field",
+                    variant: "outline",
+                    showCaret: "",
+                    "btn-props": { class: "w-full justify-between" },
+                    onOnSelect: (r) => p.mappings[s] = r.value
+                  }, null, 8, ["options", "selected", "onOnSelect"]))
+                ]),
+                e("td", X, [
+                  n.value.includes(s) ? x("", !0) : (o(), l("div", Y, [
+                    (o(!0), l(m, null, v(p.preview, (r, C) => (o(), l("div", {
+                      key: C,
+                      class: "truncate text-xs"
+                    }, a(String(r[s] || "").slice(0, 50)), 1))), 128))
+                  ]))
+                ]),
+                e("td", Z, [
+                  e("div", ee, [
+                    z(I, {
+                      checked: n.value.includes(s),
+                      "onUpdate:checked": (r) => h(s),
+                      size: "sm"
+                    }, null, 8, ["checked", "onUpdate:checked"])
+                  ])
+                ])
+              ], 2))), 128))
+            ])
+          ])
+        ])
+      ]),
+      f.value.length === 0 ? (o(), l("div", te, a(F.value), 1)) : x("", !0)
+    ]));
+  }
+});
+export {
+  ae as default
+};

package/components/ImportData/ImportStep2.vue2.js

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

package/components/ImportData/ImportStep3.vue.d.ts

@@ -0,0 +1,6 @@
+import { ImportOptions } from './types';
+type __VLS_Props = {
+    importOptions: ImportOptions;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/components/ImportData/ImportStep3.vue.js

@@ -0,0 +1,98 @@
+import { defineComponent as _, computed as o, openBlock as g, createElementBlock as w, createElementVNode as e, toDisplayString as r, createVNode as a, unref as l } from "vue";
+import c from "../Icon.vue.js";
+import p from "../ChoiceBox/ChoiceBox.vue.js";
+import { $t as b } from "../../utils/i18n.js";
+const k = { class: "space-y-8" }, y = { class: "font-medium text-md mb-2" }, O = { class: "bg-card rounded-xl p-5 border border-border shadow-sm" }, N = { class: "flex items-center mb-6" }, S = { class: "bg-primary/10 p-2.5 rounded-lg mr-4 text-primary shrink-0" }, V = { class: "font-semibold text-foreground text-base" }, C = { class: "text-sm text-muted-foreground" }, M = { class: "bg-card rounded-xl p-5 border border-border shadow-sm" }, T = { class: "flex items-center mb-6" }, F = { class: "bg-primary/10 p-2.5 rounded-lg mr-4 text-primary shrink-0" }, A = { class: "font-semibold text-foreground text-base" }, I = { class: "text-sm text-muted-foreground" }, R = /* @__PURE__ */ _({
+  __name: "ImportStep3",
+  props: {
+    importOptions: {}
+  },
+  setup(n) {
+    const t = (d, i) => {
+      const s = b(d);
+      return s !== d ? s : i;
+    }, m = o(() => t("vlite.importData.options", "Import Options")), u = o(() => t("vlite.importData.matchFound", "When a match is found")), h = o(() => t("vlite.importData.matchFoundDesc", "Determine how to handle records that already exist in the system.")), v = o(() => t("vlite.importData.noMatch", "When no match is found")), x = o(() => t("vlite.importData.noMatchDesc", "Determine how to handle completely new records.")), f = o(() => [
+      {
+        id: "add",
+        title: t("vlite.importData.optAddTitle", "Add New"),
+        description: t("vlite.importData.optAddDesc", "Creates a duplicate record instead of overwriting."),
+        icon: "lucide:plus-circle"
+      },
+      {
+        id: "replace",
+        title: t("vlite.importData.optReplaceTitle", "Update"),
+        description: t("vlite.importData.optReplaceDesc", "Overwrites existing fields with the imported data."),
+        icon: "lucide:refresh-cw"
+      },
+      {
+        id: "skip",
+        title: t("vlite.importData.optSkipTitle", "Skip"),
+        description: t("vlite.importData.optSkipDesc", "Leaves existing records completely untouched."),
+        icon: "lucide:skip-forward"
+      }
+    ]), D = o(() => [
+      {
+        id: "create",
+        title: t("vlite.importData.optCreateTitle", "Create New"),
+        description: t("vlite.importData.optCreateDesc", "Creates a completely new record in the system."),
+        icon: "lucide:check-circle-2"
+      },
+      {
+        id: "skip",
+        title: t("vlite.importData.optSkipNewTitle", "Skip"),
+        description: t("vlite.importData.optSkipNewDesc", "Ignores the row if it does not already exist."),
+        icon: "lucide:ban"
+      }
+    ]);
+    return (d, i) => (g(), w("div", k, [
+      e("div", null, [
+        e("div", null, [
+          e("h5", y, r(m.value), 1)
+        ]),
+        e("div", O, [
+          e("div", N, [
+            e("div", S, [
+              a(c, {
+                icon: "lucide:git-compare",
+                class: "w-6 h-6"
+              })
+            ]),
+            e("div", null, [
+              e("h6", V, r(u.value), 1),
+              e("p", C, r(h.value), 1)
+            ])
+          ]),
+          a(l(p), {
+            modelValue: n.importOptions.existing,
+            "onUpdate:modelValue": i[0] || (i[0] = (s) => n.importOptions.existing = s),
+            options: f.value,
+            grid: 3
+          }, null, 8, ["modelValue", "options"])
+        ])
+      ]),
+      e("div", M, [
+        e("div", T, [
+          e("div", F, [
+            a(c, {
+              icon: "lucide:file-plus",
+              class: "w-6 h-6"
+            })
+          ]),
+          e("div", null, [
+            e("h6", A, r(v.value), 1),
+            e("p", I, r(x.value), 1)
+          ])
+        ]),
+        a(l(p), {
+          modelValue: n.importOptions.new,
+          "onUpdate:modelValue": i[1] || (i[1] = (s) => n.importOptions.new = s),
+          options: D.value,
+          grid: 2
+        }, null, 8, ["modelValue", "options"])
+      ])
+    ]));
+  }
+});
+export {
+  R as default
+};