vlite3 1.0.10 → 1.1.2

package/components/Invoice/InvoiceVariant3.vue.js

@@ -0,0 +1,292 @@
+import { defineComponent as _, computed as f, openBlock as o, createElementBlock as s, normalizeStyle as I, normalizeClass as n, createElementVNode as t, createVNode as i, createCommentVNode as c, toDisplayString as l, createBlock as z, unref as u, Fragment as y, renderList as b, createTextVNode as N } from "vue";
+import v from "../Price/Price.vue.js";
+import g from "../DateTime/DateTime.vue.js";
+import D from "../QRCode/QRCode.vue.js";
+import B from "../Barcode/Barcode.vue.js";
+import k from "../Avatar.vue.js";
+import T from "../StatusChip/StatusChip.vue.js";
+const V = { class: "flex items-center gap-3" }, $ = {
+  key: 0,
+  class: "shrink-0"
+}, L = { class: "flex flex-col leading-tight" }, S = { class: "flex items-center gap-3" }, j = { key: 0 }, q = { class: "mt-0.5 text-muted-foreground space-y-0.5 text-xs" }, C = { key: 0 }, E = { key: 1 }, F = { key: 2 }, P = {
+  key: 3,
+  class: "pt-0.5"
+}, G = { key: 1 }, K = { class: "mt-0.5 text-muted-foreground space-y-0.5 text-xs" }, O = { key: 0 }, Q = { key: 1 }, U = { key: 2 }, A = { class: "flex flex-col md:items-end gap-2" }, H = {
+  key: 0,
+  class: "flex gap-2 items-center"
+}, J = {
+  key: 1,
+  class: "flex gap-2 items-center"
+}, M = {
+  key: 2,
+  class: "flex items-center justify-end gap-2 mt-1"
+}, R = {
+  key: 0,
+  class: "p-1 bg-white border border-border rounded shadow-sm"
+}, W = {
+  key: 1,
+  class: "p-1 bg-white border border-border rounded shadow-sm overflow-hidden"
+}, X = { class: "border border-border rounded-md overflow-x-auto" }, Y = { class: "invoice-table" }, Z = { class: "invoice-thead" }, ee = { class: "invoice-tbody text-xs" }, te = { class: "invoice-td" }, oe = { class: "flex items-center gap-2.5" }, se = { class: "min-w-0 flex-1" }, ae = ["title"], ce = ["title"], le = { class: "invoice-td invoice-text-right tabular-nums text-muted-foreground font-medium" }, ne = {
+  key: 0,
+  class: "invoice-td invoice-text-right tabular-nums text-muted-foreground"
+}, de = { class: "invoice-td invoice-text-right tabular-nums text-muted-foreground" }, re = {
+  key: 1,
+  class: "invoice-td invoice-text-right tabular-nums text-success/80 font-medium"
+}, ie = {
+  key: 0,
+  class: "flex flex-col items-end"
+}, ue = {
+  key: 0,
+  class: "text-[8px] uppercase font-bold"
+}, me = {
+  key: 1,
+  class: "text-muted-foreground"
+}, ve = { class: "invoice-td invoice-text-right tabular-nums font-semibold text-foreground" }, xe = {
+  key: 0,
+  class: "text-muted-foreground text-xs border-t border-border pt-3"
+}, fe = { class: "whitespace-pre-wrap" }, pe = {
+  key: 1,
+  class: "text-center text-muted-foreground opacity-70 text-xs"
+}, Ie = /* @__PURE__ */ _({
+  __name: "InvoiceVariant3",
+  props: {
+    data: {},
+    compact: { type: Boolean, default: !1 },
+    displayBarcodeValue: { type: Boolean, default: !1 }
+  },
+  setup(a) {
+    const w = a, e = f(() => w.data), p = f(() => e.value.items.some((m) => !!m.size)), h = f(() => e.value.items.some((m) => m.discount !== void 0));
+    return (m, r) => (o(), s("div", {
+      class: n(["v-invoice-v3 bg-background text-foreground border border-border rounded-lg overflow-hidden", a.compact ? "text-xs" : "text-sm"]),
+      style: I({
+        "--invoice-cell-px": a.compact ? "0.75rem" : "1rem",
+        "--invoice-cell-py": a.compact ? "0.375rem" : "0.5rem",
+        "--invoice-thead-bg": "var(--color-muted)",
+        "--invoice-tr-border": "1px solid var(--color-border)",
+        "--invoice-tr-hover-bg": "color-mix(in oklab, var(--color-muted) 30%, transparent)"
+      })
+    }, [
+      t("div", {
+        class: n(["bg-primary flex justify-between items-center text-primary-foreground", a.compact ? "px-5 py-2.5" : "px-6 py-3.5"])
+      }, [
+        t("div", V, [
+          e.value.brandLogo ? (o(), s("div", $, [
+            i(k, {
+              src: e.value.brandLogo,
+              alt: e.value.brandName,
+              class: n(a.compact ? "h-7 w-7" : "h-8 w-8"),
+              rounded: "sm"
+            }, null, 8, ["src", "alt", "class"])
+          ])) : c("", !0),
+          t("div", L, [
+            e.value.brandName ? (o(), s("span", {
+              key: 0,
+              class: n(["font-bold text-primary-foreground leading-tight", a.compact ? "text-sm" : "text-base"])
+            }, l(e.value.brandName), 3)) : c("", !0),
+            e.value.brandTitle ? (o(), s("span", {
+              key: 1,
+              class: n(["opacity-75 font-medium", a.compact ? "text-[10px]" : "text-xs"])
+            }, l(e.value.brandTitle), 3)) : c("", !0)
+          ])
+        ]),
+        t("div", S, [
+          t("span", {
+            class: n(["opacity-80 font-medium", a.compact ? "text-xs" : "text-sm"])
+          }, "#" + l(e.value.invoiceNumber), 3),
+          e.value.status ? (o(), z(T, {
+            key: 0,
+            status: e.value.status,
+            "hide-icon": "",
+            size: "small"
+          }, null, 8, ["status"])) : c("", !0)
+        ])
+      ], 2),
+      t("div", {
+        class: n(a.compact ? "p-4 space-y-4" : "p-5 space-y-5")
+      }, [
+        t("div", {
+          class: n(["grid grid-cols-1 md:grid-cols-3", a.compact ? "gap-3" : "gap-5"])
+        }, [
+          e.value.companyInfo ? (o(), s("div", j, [
+            t("p", {
+              class: n(["text-muted-foreground uppercase tracking-widest font-semibold mb-1.5", a.compact ? "text-[9px]" : "text-[10px]"])
+            }, " From ", 2),
+            t("p", {
+              class: n(["font-bold text-foreground", a.compact ? "text-xs" : "text-sm"])
+            }, l(e.value.companyInfo.name || e.value.brandName), 3),
+            t("div", q, [
+              e.value.companyInfo.address ? (o(), s("p", C, l(e.value.companyInfo.address), 1)) : c("", !0),
+              e.value.companyInfo.city ? (o(), s("p", E, l(e.value.companyInfo.city) + ", " + l(e.value.companyInfo.state) + " " + l(e.value.companyInfo.zip), 1)) : c("", !0),
+              e.value.companyInfo.country ? (o(), s("p", F, l(e.value.companyInfo.country), 1)) : c("", !0),
+              e.value.companyInfo.email ? (o(), s("p", P, l(e.value.companyInfo.email), 1)) : c("", !0)
+            ])
+          ])) : c("", !0),
+          e.value.customerInfo ? (o(), s("div", G, [
+            t("p", {
+              class: n(["text-muted-foreground uppercase tracking-widest font-semibold mb-1.5", a.compact ? "text-[9px]" : "text-[10px]"])
+            }, " Billed To ", 2),
+            t("p", {
+              class: n(["font-bold text-foreground", a.compact ? "text-xs" : "text-sm"])
+            }, l(e.value.customerInfo.name), 3),
+            t("div", K, [
+              e.value.customerInfo.address ? (o(), s("p", O, l(e.value.customerInfo.address), 1)) : c("", !0),
+              e.value.customerInfo.city ? (o(), s("p", Q, l(e.value.customerInfo.city) + ", " + l(e.value.customerInfo.state) + " " + l(e.value.customerInfo.zip), 1)) : c("", !0),
+              e.value.customerInfo.email ? (o(), s("p", U, l(e.value.customerInfo.email), 1)) : c("", !0)
+            ])
+          ])) : c("", !0),
+          t("div", A, [
+            e.value.issuedDate ? (o(), s("div", H, [
+              r[0] || (r[0] = t("span", { class: "text-muted-foreground font-medium text-xs" }, "Issued:", -1)),
+              i(u(g), {
+                value: e.value.issuedDate,
+                type: "date",
+                class: "font-semibold text-xs text-foreground"
+              }, null, 8, ["value"])
+            ])) : c("", !0),
+            e.value.dueDate ? (o(), s("div", J, [
+              r[1] || (r[1] = t("span", { class: "text-muted-foreground font-medium text-xs" }, "Due:", -1)),
+              i(u(g), {
+                value: e.value.dueDate,
+                type: "date",
+                class: "font-semibold text-xs text-foreground"
+              }, null, 8, ["value"])
+            ])) : c("", !0),
+            e.value.qrcode || e.value.barcode ? (o(), s("div", M, [
+              e.value.qrcode ? (o(), s("div", R, [
+                i(u(D), {
+                  value: e.value.qrcode,
+                  size: a.compact ? 40 : 48
+                }, null, 8, ["value", "size"])
+              ])) : c("", !0),
+              e.value.barcode ? (o(), s("div", W, [
+                i(u(B), {
+                  value: e.value.barcode,
+                  format: "CODE128",
+                  height: a.compact ? 20 : 26,
+                  width: a.compact ? 1 : 1.2,
+                  "display-value": a.displayBarcodeValue
+                }, null, 8, ["value", "height", "width", "display-value"])
+              ])) : c("", !0)
+            ])) : c("", !0)
+          ])
+        ], 2),
+        t("div", X, [
+          t("table", Y, [
+            t("thead", Z, [
+              t("tr", null, [
+                r[2] || (r[2] = t("th", {
+                  scope: "col",
+                  class: "invoice-th"
+                }, "Product", -1)),
+                t("th", {
+                  scope: "col",
+                  class: n(["invoice-th invoice-text-right", a.compact ? "w-14" : "w-20"])
+                }, "Qty", 2),
+                p.value ? (o(), s("th", {
+                  key: 0,
+                  scope: "col",
+                  class: n(["invoice-th invoice-text-right", a.compact ? "w-14" : "w-20"])
+                }, "Size", 2)) : c("", !0),
+                t("th", {
+                  scope: "col",
+                  class: n(["invoice-th invoice-text-right", a.compact ? "w-20" : "w-28"])
+                }, "Price", 2),
+                h.value ? (o(), s("th", {
+                  key: 1,
+                  scope: "col",
+                  class: n(["invoice-th invoice-text-right", a.compact ? "w-20" : "w-28"])
+                }, "Discount", 2)) : c("", !0),
+                t("th", {
+                  scope: "col",
+                  class: n(["invoice-th invoice-text-right", a.compact ? "w-20" : "w-28"])
+                }, "Total", 2)
+              ])
+            ]),
+            t("tbody", ee, [
+              (o(!0), s(y, null, b(e.value.items, (d, x) => (o(), s("tr", {
+                key: d.id || x,
+                class: "invoice-tr group"
+              }, [
+                t("td", te, [
+                  t("div", oe, [
+                    d.thumbnail ? (o(), s("div", {
+                      key: 0,
+                      class: n(["shrink-0 overflow-hidden border border-border", a.compact ? "w-8 h-8 rounded" : "w-9 h-9 rounded-md"])
+                    }, [
+                      i(k, {
+                        src: d.thumbnail,
+                        alt: d.name,
+                        class: "w-full h-full",
+                        rounded: "sm"
+                      }, null, 8, ["src", "alt"])
+                    ], 2)) : c("", !0),
+                    t("div", se, [
+                      t("div", {
+                        class: n(["font-semibold text-foreground truncate", a.compact ? "" : "text-[13px]"]),
+                        title: d.name
+                      }, l(d.name), 11, ae),
+                      d.sku ? (o(), s("div", {
+                        key: 0,
+                        class: "text-[9px] text-muted-foreground font-normal uppercase tracking-tight truncate",
+                        title: d.sku
+                      }, " SKU: " + l(d.sku), 9, ce)) : c("", !0)
+                    ])
+                  ])
+                ]),
+                t("td", le, l(d.quantity), 1),
+                p.value ? (o(), s("td", ne, l(d.size || "-"), 1)) : c("", !0),
+                t("td", de, [
+                  i(u(v), {
+                    value: d.price
+                  }, null, 8, ["value"])
+                ]),
+                h.value ? (o(), s("td", re, [
+                  d.discount !== void 0 ? (o(), s("div", ie, [
+                    i(u(v), {
+                      value: -d.discount
+                    }, null, 8, ["value"]),
+                    d.discountLabel ? (o(), s("span", ue, l(d.discountLabel), 1)) : c("", !0)
+                  ])) : (o(), s("span", me, "-"))
+                ])) : c("", !0),
+                t("td", ve, [
+                  i(u(v), {
+                    value: d.total
+                  }, null, 8, ["value"])
+                ])
+              ]))), 128))
+            ])
+          ]),
+          t("div", {
+            class: n(["bg-muted/30 border-t border-border flex justify-end", a.compact ? "p-3" : "p-4"])
+          }, [
+            t("div", {
+              class: n(a.compact ? "w-full max-w-[200px] space-y-1 text-xs" : "w-full max-w-[240px] space-y-1.5 text-xs")
+            }, [
+              (o(!0), s(y, null, b(e.value.totals, (d, x) => (o(), s("div", {
+                key: x,
+                class: n([
+                  "flex justify-between items-center",
+                  d.isGrandTotal ? a.compact ? "pt-1.5 mt-1.5 border-t border-border font-bold text-sm text-foreground" : "pt-2 mt-2 border-t border-border font-bold text-sm text-foreground" : "text-muted-foreground font-medium"
+                ])
+              }, [
+                t("span", null, l(d.label), 1),
+                i(u(v), {
+                  value: d.value
+                }, null, 8, ["value"])
+              ], 2))), 128))
+            ], 2)
+          ], 2)
+        ]),
+        e.value.notes ? (o(), s("div", xe, [
+          r[3] || (r[3] = t("strong", { class: "text-foreground" }, "Notes:", -1)),
+          r[4] || (r[4] = N()),
+          t("span", fe, l(e.value.notes), 1)
+        ])) : c("", !0),
+        e.value.footerText ? (o(), s("div", pe, l(e.value.footerText), 1)) : c("", !0)
+      ], 2)
+    ], 6));
+  }
+});
+export {
+  Ie as default
+};

package/components/Invoice/InvoiceVariant3.vue2.js

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

package/components/Invoice/InvoiceVariant4.vue.d.ts

@@ -0,0 +1,13 @@
+import { InvoiceData } from './types';
+type __VLS_Props = {
+    data: InvoiceData;
+    /** Reduces padding, spacing, and font sizes for print-friendly output */
+    compact?: boolean;
+    /** Toggles the display of the barcode text value underneath the bars */
+    displayBarcodeValue?: boolean;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    compact: boolean;
+    displayBarcodeValue: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/components/Invoice/InvoiceVariant4.vue.js

@@ -0,0 +1,343 @@
+import { defineComponent as _, computed as b, openBlock as t, createElementBlock as a, normalizeStyle as D, createElementVNode as o, normalizeClass as n, toDisplayString as l, createBlock as T, createCommentVNode as c, createVNode as i, unref as u, createTextVNode as m, Fragment as v, renderList as g } from "vue";
+import p from "../Price/Price.vue.js";
+import k from "../DateTime/DateTime.vue.js";
+import z from "../Barcode/Barcode.vue.js";
+import N from "../QRCode/QRCode.vue.js";
+import I from "../Avatar.vue.js";
+import B from "../StatusChip/StatusChip.vue.js";
+const V = { class: "flex flex-col sm:flex-row justify-between items-start gap-4" }, $ = { class: "flex flex-col gap-3" }, j = { class: "flex items-center gap-2.5 mt-1.5 flex-wrap" }, C = { class: "flex flex-wrap gap-5" }, L = { key: 0 }, S = { key: 1 }, E = { class: "flex flex-col items-start sm:items-end gap-2 shrink-0" }, q = { class: "grid grid-cols-1 md:grid-cols-2 gap-5 mb-6" }, F = { key: 0 }, G = { key: 1 }, O = { key: 2 }, P = { key: 3 }, K = { class: "flex flex-col gap-0.5" }, Q = { key: 0 }, U = { key: 1 }, A = {
+  key: 2,
+  class: "text-primary font-medium"
+}, H = { key: 4 }, J = { key: 1 }, M = { key: 1 }, R = { key: 2 }, W = { key: 3 }, X = { class: "flex flex-col gap-0.5" }, Y = { key: 0 }, Z = { key: 1 }, ee = {
+  key: 4,
+  class: "text-xs font-semibold"
+}, te = {
+  key: 0,
+  scope: "col",
+  class: "invoice-th invoice-text-right font-bold"
+}, oe = {
+  key: 1,
+  scope: "col",
+  class: "invoice-th invoice-text-right font-bold"
+}, ae = { class: "invoice-tbody" }, se = { class: "invoice-td" }, ce = { class: "flex items-center gap-3" }, le = { class: "min-w-0 flex-1" }, ne = ["title"], re = ["title"], ie = {
+  key: 1,
+  class: "block text-xs text-muted-foreground line-clamp-2 max-w-md whitespace-normal mt-0.5 leading-relaxed"
+}, de = { class: "invoice-td invoice-text-right tabular-nums text-muted-foreground font-semibold text-sm" }, ue = {
+  key: 0,
+  class: "invoice-td invoice-text-right tabular-nums text-muted-foreground text-sm"
+}, me = { class: "invoice-td invoice-text-right tabular-nums text-muted-foreground font-medium" }, xe = {
+  key: 1,
+  class: "invoice-td invoice-text-right tabular-nums text-success font-bold"
+}, ve = {
+  key: 0,
+  class: "flex flex-col items-end"
+}, pe = {
+  key: 0,
+  class: "text-sm uppercase tracking-wider font-extrabold opacity-80 mt-0.5"
+}, fe = {
+  key: 1,
+  class: "text-muted-foreground font-normal"
+}, be = { class: "invoice-td invoice-text-right tabular-nums font-bold text-foreground" }, ye = { class: "flex flex-row flex-wrap gap-3 items-center" }, he = {
+  key: 0,
+  class: "shrink-0 inline-block border border-border rounded-lg bg-white p-1.5"
+}, ge = {
+  key: 1,
+  class: "shrink-0 inline-block border border-border rounded-lg bg-white p-2 overflow-hidden"
+}, ke = { key: 0 }, Ie = { class: "w-full md:w-[42%] min-w-[260px]" }, we = { key: 0 }, _e = { key: 1 }, je = /* @__PURE__ */ _({
+  __name: "InvoiceVariant4",
+  props: {
+    data: {},
+    compact: { type: Boolean, default: !1 },
+    displayBarcodeValue: { type: Boolean, default: !1 }
+  },
+  setup(s) {
+    const w = s, e = b(() => w.data), y = b(() => e.value.items.some((x) => !!x.size)), h = b(() => e.value.items.some((x) => x.discount !== void 0));
+    return (x, d) => (t(), a("div", {
+      class: "v-invoice-v4 bg-background border border-border text-foreground overflow-hidden rounded-xl font-sans print:shadow-none print:border-none",
+      style: D({
+        "--invoice-cell-px": s.compact ? "0.75rem" : "1rem",
+        "--invoice-cell-py": s.compact ? "0.5rem" : "0.75rem",
+        "--invoice-thead-bg": "var(--color-muted)",
+        "--invoice-thead-border": "1px solid var(--color-border)",
+        "--invoice-thead-color": "var(--color-muted-foreground)",
+        "--invoice-tr-border": "1px solid var(--color-border)",
+        "--invoice-tr-hover-bg": "color-mix(in oklab, var(--color-muted) 40%, transparent)",
+        "--invoice-td-valign": "middle"
+      })
+    }, [
+      o("div", {
+        class: n(["bg-primary text-primary-fg", s.compact ? "px-5 py-4" : "px-6 py-5 sm:px-8"])
+      }, [
+        o("div", V, [
+          o("div", $, [
+            o("div", null, [
+              o("h1", {
+                class: n(["font-black tracking-tighter uppercase leading-none text-primary-fg", s.compact ? "text-3xl" : "text-4xl"])
+              }, l(e.value.brandTitle || "INVOICE"), 3),
+              o("div", j, [
+                o("span", {
+                  class: n(["font-semibold opacity-80", s.compact ? "text-sm" : "text-base"])
+                }, " #" + l(e.value.invoiceNumber), 3),
+                e.value.status ? (t(), T(B, {
+                  key: 0,
+                  status: e.value.status,
+                  "hide-icon": "",
+                  size: "small"
+                }, null, 8, ["status"])) : c("", !0)
+              ])
+            ]),
+            o("div", C, [
+              e.value.issuedDate ? (t(), a("div", L, [
+                o("p", {
+                  class: n(["font-semibold uppercase tracking-widest opacity-60", s.compact ? "text-[9px] mb-0.5" : "text-[10px] mb-1"])
+                }, " Issue Date ", 2),
+                i(u(k), {
+                  value: e.value.issuedDate,
+                  type: "date",
+                  class: n(["font-extrabold", s.compact ? "text-sm" : "text-base"])
+                }, null, 8, ["value", "class"])
+              ])) : c("", !0),
+              e.value.dueDate ? (t(), a("div", S, [
+                o("p", {
+                  class: n(["font-semibold uppercase tracking-widest opacity-60", s.compact ? "text-[9px] mb-0.5" : "text-[10px] mb-1"])
+                }, " Due Date ", 2),
+                i(u(k), {
+                  value: e.value.dueDate,
+                  type: "date",
+                  class: n(["font-extrabold", s.compact ? "text-sm" : "text-base"])
+                }, null, 8, ["value", "class"])
+              ])) : c("", !0)
+            ])
+          ]),
+          o("div", E, [
+            e.value.brandLogo ? (t(), a("div", {
+              key: 0,
+              class: n(["bg-white/10 rounded-lg p-2 border border-white/20", s.compact ? "h-11" : "h-14"])
+            }, [
+              i(I, {
+                src: e.value.brandLogo,
+                alt: e.value.brandName,
+                class: "h-full w-auto object-contain",
+                rounded: "sm"
+              }, null, 8, ["src", "alt"])
+            ], 2)) : c("", !0),
+            e.value.brandName ? (t(), a("h2", {
+              key: 1,
+              class: n(["font-extrabold tracking-tight opacity-90 text-primary-fg", s.compact ? "text-base" : "text-lg"])
+            }, l(e.value.brandName), 3)) : c("", !0)
+          ])
+        ])
+      ], 2),
+      o("div", {
+        class: n(s.compact ? "p-5" : "px-7 py-4.5")
+      }, [
+        o("div", q, [
+          e.value.companyInfo ? (t(), a("div", F, [
+            o("p", {
+              class: n(["font-bold text-primary uppercase tracking-widest border-b border-primary/20 pb-1 inline-block mb-2", s.compact ? "text-[10px]" : "text-[11px]"])
+            }, " From ", 2),
+            o("div", {
+              class: n(["text-muted-foreground leading-relaxed", s.compact ? "text-xs space-y-0.5" : "text-sm space-y-1"])
+            }, [
+              e.value.companyInfo.name ? (t(), a("p", {
+                key: 0,
+                class: n(["font-extrabold text-foreground", s.compact ? "text-sm mb-0.5" : "text-base mb-1"])
+              }, l(e.value.companyInfo.name), 3)) : c("", !0),
+              e.value.companyInfo.address ? (t(), a("p", G, l(e.value.companyInfo.address), 1)) : c("", !0),
+              e.value.companyInfo.city || e.value.companyInfo.state ? (t(), a("p", O, [
+                m(l(e.value.companyInfo.city), 1),
+                e.value.companyInfo.city && e.value.companyInfo.state ? (t(), a(v, { key: 0 }, [
+                  m(", ")
+                ], 64)) : c("", !0),
+                m(l(e.value.companyInfo.state) + " " + l(e.value.companyInfo.zip), 1)
+              ])) : c("", !0),
+              e.value.companyInfo.country ? (t(), a("p", P, l(e.value.companyInfo.country), 1)) : c("", !0),
+              o("div", K, [
+                e.value.companyInfo.email ? (t(), a("p", Q, l(e.value.companyInfo.email), 1)) : c("", !0),
+                e.value.companyInfo.phone ? (t(), a("p", U, l(e.value.companyInfo.phone), 1)) : c("", !0),
+                e.value.companyInfo.website ? (t(), a("p", A, l(e.value.companyInfo.website), 1)) : c("", !0)
+              ]),
+              e.value.companyInfo.taxId ? (t(), a("p", H, "Tax ID: " + l(e.value.companyInfo.taxId), 1)) : c("", !0)
+            ], 2)
+          ])) : c("", !0),
+          e.value.customerInfo ? (t(), a("div", J, [
+            o("p", {
+              class: n(["font-bold text-primary uppercase tracking-widest border-b border-primary/20 pb-1 inline-block mb-2", s.compact ? "text-[10px]" : "text-[11px]"])
+            }, " Billed To ", 2),
+            o("div", {
+              class: n(["text-muted-foreground leading-relaxed", s.compact ? "text-xs space-y-0.5" : "text-sm space-y-1"])
+            }, [
+              e.value.customerInfo.name ? (t(), a("p", {
+                key: 0,
+                class: n(["font-extrabold text-foreground", s.compact ? "text-sm mb-0.5" : "text-base mb-1"])
+              }, l(e.value.customerInfo.name), 3)) : c("", !0),
+              e.value.customerInfo.address ? (t(), a("p", M, l(e.value.customerInfo.address), 1)) : c("", !0),
+              e.value.customerInfo.city || e.value.customerInfo.state ? (t(), a("p", R, [
+                m(l(e.value.customerInfo.city), 1),
+                e.value.customerInfo.city && e.value.customerInfo.state ? (t(), a(v, { key: 0 }, [
+                  m(", ")
+                ], 64)) : c("", !0),
+                m(l(e.value.customerInfo.state) + " " + l(e.value.customerInfo.zip), 1)
+              ])) : c("", !0),
+              e.value.customerInfo.country ? (t(), a("p", W, l(e.value.customerInfo.country), 1)) : c("", !0),
+              o("div", X, [
+                e.value.customerInfo.email ? (t(), a("p", Y, l(e.value.customerInfo.email), 1)) : c("", !0),
+                e.value.customerInfo.phone ? (t(), a("p", Z, l(e.value.customerInfo.phone), 1)) : c("", !0)
+              ]),
+              e.value.customerInfo.taxId ? (t(), a("p", ee, " Tax ID: " + l(e.value.customerInfo.taxId), 1)) : c("", !0)
+            ], 2)
+          ])) : c("", !0)
+        ]),
+        o("div", {
+          class: n(["border border-border rounded-lg overflow-x-auto", s.compact ? "mb-5" : "mb-6"])
+        }, [
+          o("table", {
+            class: n(["invoice-table", s.compact ? "text-xs" : "text-sm"])
+          }, [
+            o("thead", {
+              class: n(["invoice-thead uppercase", s.compact ? "text-[9px]" : "text-[10px]"])
+            }, [
+              o("tr", null, [
+                d[0] || (d[0] = o("th", {
+                  scope: "col",
+                  class: "invoice-th font-bold"
+                }, "Product", -1)),
+                d[1] || (d[1] = o("th", {
+                  scope: "col",
+                  class: "invoice-th invoice-text-right font-bold"
+                }, "Qty", -1)),
+                y.value ? (t(), a("th", te, " Size ")) : c("", !0),
+                d[2] || (d[2] = o("th", {
+                  scope: "col",
+                  class: "invoice-th invoice-text-right font-bold"
+                }, "Price", -1)),
+                h.value ? (t(), a("th", oe, " Discount ")) : c("", !0),
+                d[3] || (d[3] = o("th", {
+                  scope: "col",
+                  class: "invoice-th invoice-text-right font-bold text-primary"
+                }, " Total ", -1))
+              ])
+            ], 2),
+            o("tbody", ae, [
+              (t(!0), a(v, null, g(e.value.items, (r, f) => (t(), a("tr", {
+                key: r.id || f,
+                class: "invoice-tr group"
+              }, [
+                o("td", se, [
+                  o("div", ce, [
+                    r.thumbnail ? (t(), a("div", {
+                      key: 0,
+                      class: n(["shrink-0 overflow-hidden border border-border", s.compact ? "w-9 h-9 rounded-md" : "w-10 h-10 rounded-lg"])
+                    }, [
+                      i(I, {
+                        src: r.thumbnail,
+                        alt: r.name,
+                        class: "w-full h-full",
+                        rounded: "sm"
+                      }, null, 8, ["src", "alt"])
+                    ], 2)) : c("", !0),
+                    o("div", le, [
+                      o("span", {
+                        class: "block truncate font-semibold text-foreground text-sm",
+                        title: r.name
+                      }, l(r.name), 9, ne),
+                      r.sku ? (t(), a("div", {
+                        key: 0,
+                        class: "text-xs uppercase tracking-widest text-muted-foreground font-medium truncate mt-0.5",
+                        title: r.sku
+                      }, " SKU: " + l(r.sku), 9, re)) : c("", !0),
+                      r.description && !s.compact ? (t(), a("span", ie, l(r.description), 1)) : c("", !0)
+                    ])
+                  ])
+                ]),
+                o("td", de, l(r.quantity), 1),
+                y.value ? (t(), a("td", ue, l(r.size || "-"), 1)) : c("", !0),
+                o("td", me, [
+                  i(u(p), {
+                    value: r.price,
+                    class: "text-sm"
+                  }, null, 8, ["value"])
+                ]),
+                h.value ? (t(), a("td", xe, [
+                  r.discount !== void 0 ? (t(), a("div", ve, [
+                    i(u(p), {
+                      value: -r.discount,
+                      class: "text-sm"
+                    }, null, 8, ["value"]),
+                    r.discountLabel ? (t(), a("span", pe, l(r.discountLabel), 1)) : c("", !0)
+                  ])) : (t(), a("span", fe, "-"))
+                ])) : c("", !0),
+                o("td", be, [
+                  i(u(p), {
+                    value: r.total,
+                    class: "text-sm"
+                  }, null, 8, ["value"])
+                ])
+              ]))), 128))
+            ])
+          ], 2)
+        ], 2),
+        o("div", {
+          class: n(["flex flex-col-reverse md:flex-row justify-between items-start", s.compact ? "gap-5" : "gap-6"])
+        }, [
+          o("div", {
+            class: n(["w-full md:w-1/2 flex flex-col", s.compact ? "gap-3" : "gap-4"])
+          }, [
+            o("div", ye, [
+              e.value.qrcode ? (t(), a("div", he, [
+                i(u(N), {
+                  value: e.value.qrcode,
+                  size: s.compact ? 56 : 72
+                }, null, 8, ["value", "size"])
+              ])) : c("", !0),
+              e.value.barcode ? (t(), a("div", ge, [
+                i(u(z), {
+                  value: e.value.barcode,
+                  format: "CODE128",
+                  height: s.compact ? 28 : 36,
+                  width: s.compact ? 1.3 : 1.5,
+                  "display-value": s.displayBarcodeValue
+                }, null, 8, ["value", "height", "width", "display-value"])
+              ])) : c("", !0)
+            ]),
+            e.value.notes ? (t(), a("div", ke, [
+              o("h4", {
+                class: n(["font-bold text-muted-foreground uppercase tracking-widest mb-1.5", s.compact ? "text-[9px]" : "text-[10px]"])
+              }, " Notes & Terms ", 2),
+              o("div", {
+                class: n(["text-muted-foreground leading-relaxed whitespace-pre-wrap p-3 bg-muted/30 rounded-lg border border-border", s.compact ? "text-xs max-w-xs" : "text-xs max-w-sm"])
+              }, l(e.value.notes), 3)
+            ])) : c("", !0)
+          ], 2),
+          o("div", Ie, [
+            o("div", {
+              class: n(["border border-border rounded-lg", s.compact ? "p-4 space-y-2" : "p-5 space-y-2.5"])
+            }, [
+              (t(!0), a(v, null, g(e.value.totals, (r, f) => (t(), a("div", {
+                key: f,
+                class: n(["flex justify-between items-center", [
+                  r.isGrandTotal ? s.compact ? "pt-2.5 mt-1 border-t border-primary/30 text-base font-black text-primary" : "pt-3 mt-1.5 border-t border-primary/30 text-lg font-black text-primary" : s.compact ? "text-xs font-semibold text-muted-foreground" : "text-sm font-semibold text-muted-foreground"
+                ]])
+              }, [
+                o("span", {
+                  class: n(r.isGrandTotal ? "uppercase tracking-widest text-xs" : "")
+                }, l(r.label), 3),
+                i(u(p), {
+                  value: r.value
+                }, null, 8, ["value"])
+              ], 2))), 128))
+            ], 2)
+          ])
+        ], 2)
+      ], 2),
+      o("div", {
+        class: n(["bg-primary text-primary-foreground flex justify-center font-bold uppercase tracking-widest", s.compact ? "py-2 px-4 text-[9px]" : "py-2.5 px-6 text-[10px]"])
+      }, [
+        e.value.footerText ? (t(), a("span", we, l(e.value.footerText), 1)) : (t(), a("span", _e, "Thank you for your business"))
+      ], 2)
+    ], 4));
+  }
+});
+export {
+  je as default
+};

package/components/Invoice/InvoiceVariant4.vue2.js

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

package/components/Invoice/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Invoice } from './Invoice.vue';
+export * from './types';