vlite3 1.2.1 → 1.2.2

package/components/Invoice/InvoiceVariant1.vue.js

@@ -1,80 +1,86 @@
-import { defineComponent as _, computed as p, openBlock as o, createElementBlock as a, normalizeStyle as w, createElementVNode as s, normalizeClass as n, createVNode as r, toDisplayString as t, createCommentVNode as c, unref as d, createBlock as z, createTextVNode as m, Fragment as x, renderList as D } from "vue";
+import { defineComponent as _, computed as v, openBlock as o, createElementBlock as a, normalizeStyle as w, createElementVNode as c, normalizeClass as l, createVNode as d, toDisplayString as t, createCommentVNode as s, unref as m, createBlock as z, createTextVNode as r, Fragment as x, renderList as D } from "vue";
 import f from "../Price/Price.vue.js";
 import b from "../DateTime/DateTime.vue.js";
-import N from "../Barcode/Barcode.vue.js";
-import T from "../QRCode/QRCode.vue.js";
+import T from "../Barcode/Barcode.vue.js";
+import N from "../QRCode/QRCode.vue.js";
 import k from "../Avatar.vue.js";
-import B from "../StatusChip/StatusChip.vue.js";
-import V from "./InvoiceTotals.vue.js";
-const $ = { class: "flex items-center justify-between gap-3" }, q = { class: "shrink-0" }, S = {
+import M from "../StatusChip/StatusChip.vue.js";
+import B from "./InvoiceTotals.vue.js";
+const V = { class: "flex items-center justify-between gap-3" }, S = { class: "shrink-0" }, $ = {
   key: 0,
   class: "flex items-center gap-3 border-r-[1.5px] pr-3 border-gray-300"
-}, C = { class: "text-muted-foreground uppercase tracking-wider font-medium" }, L = {
+}, q = { class: "text-muted-foreground uppercase tracking-wider font-medium" }, C = {
   key: 1,
   class: "flex items-center gap-3 border-r-[1.5px] pr-3 border-gray-250"
-}, j = { class: "text-muted-foreground uppercase tracking-wider font-medium" }, E = { class: "grid grid-cols-2 gap-8" }, F = { key: 0 }, U = { key: 0 }, K = { key: 1 }, O = { key: 2 }, P = {
+}, L = { class: "text-muted-foreground uppercase tracking-wider font-medium" }, j = { key: 0 }, E = { key: 0 }, F = { key: 1 }, P = { key: 2 }, U = {
   key: 3,
   class: "pt-0.5"
-}, Q = { key: 4 }, A = {
+}, K = { key: 4 }, O = {
   key: 5,
   class: "pt-0.5"
-}, G = { key: 1 }, H = { key: 0 }, J = { key: 1 }, M = { key: 2 }, R = {
+}, Q = { key: 1 }, A = { key: 0 }, G = { key: 1 }, H = { key: 2 }, J = {
   key: 3,
   class: "pt-0.5"
-}, W = { key: 4 }, X = {
+}, R = { key: 4 }, W = {
   key: 5,
   class: "pt-0.5"
-}, Y = {
+}, X = { key: 2 }, Y = { key: 0 }, Z = { key: 1 }, ee = { key: 2 }, te = {
+  key: 3,
+  class: "pt-0.5"
+}, oe = { key: 4 }, ae = {
   key: 1,
   class: "border-b border-border overflow-x-auto"
-}, Z = { class: "invoice-thead" }, ee = {
+}, se = { class: "invoice-thead" }, ce = {
   scope: "col",
   class: "invoice-th"
-}, te = {
+}, ne = {
   scope: "col",
   class: "invoice-th invoice-text-right"
-}, oe = {
+}, le = {
   key: 0,
   scope: "col",
   class: "invoice-th invoice-text-right"
-}, ae = {
+}, ie = {
   scope: "col",
   class: "invoice-th invoice-text-right"
-}, se = {
+}, ue = {
   key: 1,
   scope: "col",
   class: "invoice-th invoice-text-right"
-}, ce = {
+}, de = {
   scope: "col",
   class: "invoice-th invoice-text-right"
-}, le = { class: "invoice-tbody" }, ne = { class: "invoice-td" }, ue = { class: "flex items-start gap-3" }, ie = { class: "min-w-0 flex-1" }, re = ["title"], de = {
+}, re = { class: "invoice-tbody" }, me = { class: "invoice-td" }, pe = { class: "flex items-start gap-3" }, ve = { class: "min-w-0 flex-1" }, xe = ["title"], fe = {
   key: 0,
   class: "text-muted-foreground uppercase tracking-wider font-medium mt-0.5 text-xs"
-}, me = {
+}, he = {
   key: 1,
   class: "text-muted-foreground mt-0.5 whitespace-normal max-w-xs text-xs leading-snug"
-}, ve = { class: "invoice-td invoice-text-right tabular-nums font-medium text-sm" }, pe = {
+}, ge = { class: "invoice-td invoice-text-right tabular-nums font-medium text-sm" }, ye = {
   key: 0,
   class: "invoice-td invoice-text-right tabular-nums text-muted-foreground"
-}, xe = { class: "invoice-td invoice-text-right tabular-nums" }, fe = {
+}, be = { class: "invoice-td invoice-text-right tabular-nums" }, ke = {
   key: 1,
   class: "invoice-td invoice-text-right tabular-nums text-success font-semibold"
-}, he = {
+}, Ie = {
   key: 0,
   class: "flex flex-col items-end gap-0.5"
-}, ye = {
+}, _e = {
   key: 1,
   class: "text-muted-foreground font-normal"
-}, ge = { class: "invoice-td invoice-text-right tabular-nums font-bold text-foreground" }, be = { key: 0 }, ke = {
-  key: 1,
+}, we = { class: "invoice-td invoice-text-right tabular-nums font-bold text-foreground" }, ze = {
+  key: 0,
+  class: "flex flex-wrap gap-6"
+}, De = { key: 0 }, Te = { key: 1 }, Ne = { key: 1 }, Me = {
+  key: 2,
   class: "flex flex-row flex-wrap gap-3 items-center"
-}, Ie = {
+}, Be = {
   key: 0,
   class: "shrink-0"
-}, _e = {
+}, Ve = {
   key: 1,
   class: "shrink-0"
-}, we = { class: "w-full lg:w-2/5 min-w-[220px]" }, Ce = /* @__PURE__ */ _({
+}, Se = { class: "w-full lg:w-2/5 min-w-[220px]" }, Ke = /* @__PURE__ */ _({
   __name: "InvoiceVariant1",
   props: {
     data: {},
@@ -82,28 +88,28 @@ const $ = { class: "flex items-center justify-between gap-3" }, q = { class: "sh
     displayBarcodeValue: { type: Boolean, default: !1 },
     labels: {}
   },
-  setup(l) {
-    const h = l, e = p(() => h.data), i = p(() => h.labels || {}), y = p(() => e.value.items.some((v) => !!v.size)), g = p(() => e.value.items.some((v) => v.discount !== void 0));
-    return (v, ze) => (o(), a("div", {
+  setup(n) {
+    const h = n, e = v(() => h.data), i = v(() => h.labels || {}), g = v(() => e.value.items.some((p) => !!p.size)), y = v(() => e.value.items.some((p) => p.discount !== void 0));
+    return (p, $e) => (o(), a("div", {
       class: "v-invoice-v1 bg-background text-foreground border border-border rounded-sm",
       style: w({
-        "--text-sm": l.compact ? "12.5px" : "13.5px",
-        "--invoice-cell-px": l.compact ? "0.875rem" : "1.25rem",
-        "--invoice-cell-py": l.compact ? "0.625rem" : "0.875rem",
+        "--text-sm": n.compact ? "12.5px" : "13.5px",
+        "--invoice-cell-px": n.compact ? "0.875rem" : "1.25rem",
+        "--invoice-cell-py": n.compact ? "0.625rem" : "0.875rem",
         "--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) 40%, transparent)"
       })
     }, [
-      s("div", {
-        class: n(["border-b border-border", l.compact ? "px-5 py-3" : "px-6 pt-5 pb-3.5"])
+      c("div", {
+        class: l(["border-b border-border", n.compact ? "px-5 py-3" : "px-6 pt-5 pb-3.5"])
       }, [
-        s("div", $, [
-          s("div", q, [
-            s("div", {
-              class: n(l.compact ? "h-10 w-10" : "h-13 w-13")
+        c("div", V, [
+          c("div", S, [
+            c("div", {
+              class: l(n.compact ? "h-10 w-10" : "h-13 w-13")
             }, [
-              r(k, {
+              d(k, {
                 src: e.value.brandLogo,
                 alt: e.value.brandName,
                 class: "h-full w-auto object-contain",
@@ -111,178 +117,203 @@ const $ = { class: "flex items-center justify-between gap-3" }, q = { class: "sh
               }, null, 8, ["src", "alt"])
             ], 2)
           ]),
-          s("div", {
-            class: n(["flex-1 min-w-0", l.compact ? "space-y-0.5" : "space-y-1"])
+          c("div", {
+            class: l(["flex-1 min-w-0", n.compact ? "space-y-0.5" : "space-y-1"])
           }, [
             e.value.brandName ? (o(), a("p", {
               key: 0,
-              class: n(["font-bold text-foreground leading-tight truncate", l.compact ? "text-base" : "text-lg"])
-            }, t(e.value.brandName), 3)) : c("", !0),
+              class: l(["font-bold text-foreground leading-tight truncate", n.compact ? "text-base" : "text-lg"])
+            }, t(e.value.brandName), 3)) : s("", !0),
             e.value.brandTitle ? (o(), a("p", {
               key: 1,
-              class: n(["text-muted-foreground font-medium truncate", l.compact ? "text-xs" : "text-sm"])
-            }, t(e.value.brandTitle), 3)) : c("", !0)
+              class: l(["text-muted-foreground font-medium truncate", n.compact ? "text-xs" : "text-sm"])
+            }, t(e.value.brandTitle), 3)) : s("", !0)
           ], 2),
-          s("div", {
-            class: n(["text-right shrink-0", l.compact ? "space-y-2" : "space-y-3"])
+          c("div", {
+            class: l(["text-right shrink-0", n.compact ? "space-y-2" : "space-y-3"])
           }, [
-            s("div", null, [
-              s("h1", {
-                class: n(["font-black tracking-tight text-foreground uppercase", l.compact ? "text-2xl" : "text-3xl"])
+            c("div", null, [
+              c("h1", {
+                class: l(["font-black tracking-tight text-foreground uppercase", n.compact ? "text-2xl" : "text-3xl"])
               }, t(i.value.invoice || "Invoice"), 3),
-              s("p", {
-                class: n(["text-muted-foreground font-medium mt-0.5", l.compact ? "text-xs" : "text-sm"])
+              c("p", {
+                class: l(["text-muted-foreground font-medium mt-0.5", n.compact ? "text-xs" : "text-sm"])
               }, " #" + t(e.value.invoiceNumber), 3)
             ])
           ], 2)
         ]),
-        s("div", {
-          class: n(["flex items-center gap-4 text-xs", l.compact ? "mt-2" : "mt-4"])
+        c("div", {
+          class: l(["flex items-center gap-4 text-xs", n.compact ? "mt-2" : "mt-4"])
         }, [
-          e.value.issuedDate ? (o(), a("div", S, [
-            s("span", C, t(i.value.issued || "Issued"), 1),
-            r(d(b), {
+          e.value.issuedDate ? (o(), a("div", $, [
+            c("span", q, t(i.value.issued || "Issued"), 1),
+            d(m(b), {
               value: e.value.issuedDate,
               type: "date",
               class: "font-semibold text-foreground tabular-nums"
             }, null, 8, ["value"])
-          ])) : c("", !0),
-          e.value.dueDate ? (o(), a("div", L, [
-            s("span", j, t(i.value.due || "Due"), 1),
-            r(d(b), {
+          ])) : s("", !0),
+          e.value.dueDate ? (o(), a("div", C, [
+            c("span", L, t(i.value.due || "Due"), 1),
+            d(m(b), {
               value: e.value.dueDate,
               type: "date",
               class: "font-semibold text-foreground tabular-nums"
             }, null, 8, ["value"])
-          ])) : c("", !0),
-          e.value.status ? (o(), z(B, {
+          ])) : s("", !0),
+          e.value.status ? (o(), z(M, {
             key: 2,
             status: e.value.status,
             "hide-icon": "",
             size: "small"
-          }, null, 8, ["status"])) : c("", !0)
+          }, null, 8, ["status"])) : s("", !0)
         ], 2)
       ], 2),
-      e.value.companyInfo || e.value.customerInfo ? (o(), a("div", {
+      e.value.companyInfo || e.value.customerInfo || e.value.shippingInfo ? (o(), a("div", {
         key: 0,
-        class: n(["border-b border-border", l.compact ? "px-5 py-4" : "px-6 pt-4 pb-5"])
+        class: l(["border-b border-border", n.compact ? "px-5 py-4" : "px-6 pt-4 pb-5"])
       }, [
-        s("div", E, [
-          e.value.companyInfo ? (o(), a("div", F, [
-            s("p", {
-              class: n(["text-muted-foreground uppercase tracking-widest font-semibold mb-2", l.compact ? "text-[9px]" : "text-[10px]"])
+        c("div", {
+          class: l(["grid gap-8", e.value.shippingInfo ? "grid-cols-2 md:grid-cols-3" : "grid-cols-2"])
+        }, [
+          e.value.companyInfo ? (o(), a("div", j, [
+            c("p", {
+              class: l(["text-muted-foreground uppercase tracking-widest font-semibold mb-2", n.compact ? "text-[9px]" : "text-[10px]"])
             }, t(i.value.from || "From"), 3),
             e.value.brandName ? (o(), a("p", {
               key: 0,
-              class: n(["font-bold text-foreground", l.compact ? "text-sm" : "text-base"])
-            }, t(e.value.brandName), 3)) : c("", !0),
-            s("div", {
-              class: n(["text-muted-foreground leading-snug mt-1", l.compact ? "text-xs space-y-0.5" : "text-sm space-y-0.5"])
+              class: l(["font-bold text-foreground", n.compact ? "text-sm" : "text-base"])
+            }, t(e.value.brandName), 3)) : s("", !0),
+            c("div", {
+              class: l(["text-muted-foreground leading-snug mt-1", n.compact ? "text-xs space-y-0.5" : "text-sm space-y-0.5"])
             }, [
-              e.value.companyInfo.address ? (o(), a("p", U, t(e.value.companyInfo.address), 1)) : c("", !0),
-              e.value.companyInfo.city || e.value.companyInfo.state || e.value.companyInfo.zip ? (o(), a("p", K, [
-                m(t(e.value.companyInfo.city), 1),
+              e.value.companyInfo.address ? (o(), a("p", E, t(e.value.companyInfo.address), 1)) : s("", !0),
+              e.value.companyInfo.city || e.value.companyInfo.state || e.value.companyInfo.zip ? (o(), a("p", F, [
+                r(t(e.value.companyInfo.city), 1),
                 e.value.companyInfo.city && e.value.companyInfo.state ? (o(), a(x, { key: 0 }, [
-                  m(", ")
-                ], 64)) : c("", !0),
-                m(t(e.value.companyInfo.state) + " " + t(e.value.companyInfo.zip), 1)
-              ])) : c("", !0),
-              e.value.companyInfo.country ? (o(), a("p", O, t(e.value.companyInfo.country), 1)) : c("", !0),
-              e.value.companyInfo.email ? (o(), a("p", P, t(e.value.companyInfo.email), 1)) : c("", !0),
-              e.value.companyInfo.phone ? (o(), a("p", Q, t(e.value.companyInfo.phone), 1)) : c("", !0),
-              e.value.companyInfo.taxId ? (o(), a("p", A, t(i.value.taxId || "Tax ID") + ": " + t(e.value.companyInfo.taxId), 1)) : c("", !0)
+                  r(", ")
+                ], 64)) : s("", !0),
+                r(t(e.value.companyInfo.state) + " " + t(e.value.companyInfo.zip), 1)
+              ])) : s("", !0),
+              e.value.companyInfo.country ? (o(), a("p", P, t(e.value.companyInfo.country), 1)) : s("", !0),
+              e.value.companyInfo.email ? (o(), a("p", U, t(e.value.companyInfo.email), 1)) : s("", !0),
+              e.value.companyInfo.phone ? (o(), a("p", K, t(e.value.companyInfo.phone), 1)) : s("", !0),
+              e.value.companyInfo.taxId ? (o(), a("p", O, t(i.value.taxId || "Tax ID") + ": " + t(e.value.companyInfo.taxId), 1)) : s("", !0)
             ], 2)
-          ])) : c("", !0),
-          e.value.customerInfo ? (o(), a("div", G, [
-            s("p", {
-              class: n(["text-muted-foreground uppercase tracking-widest font-semibold mb-2", l.compact ? "text-[9px]" : "text-[10px]"])
+          ])) : s("", !0),
+          e.value.customerInfo ? (o(), a("div", Q, [
+            c("p", {
+              class: l(["text-muted-foreground uppercase tracking-widest font-semibold mb-2", n.compact ? "text-[9px]" : "text-[10px]"])
             }, t(i.value.billedTo || "Billed To"), 3),
-            s("p", {
-              class: n(["font-bold text-foreground", l.compact ? "text-sm" : "text-base"])
+            c("p", {
+              class: l(["font-bold text-foreground", n.compact ? "text-sm" : "text-base"])
             }, t(e.value.customerInfo.name), 3),
-            s("div", {
-              class: n(["text-muted-foreground leading-snug mt-1", l.compact ? "text-xs space-y-0.5" : "text-sm space-y-0.5"])
+            c("div", {
+              class: l(["text-muted-foreground leading-snug mt-1", n.compact ? "text-xs space-y-0.5" : "text-sm space-y-0.5"])
             }, [
-              e.value.customerInfo.address ? (o(), a("p", H, t(e.value.customerInfo.address), 1)) : c("", !0),
-              e.value.customerInfo.city || e.value.customerInfo.state ? (o(), a("p", J, [
-                m(t(e.value.customerInfo.city), 1),
+              e.value.customerInfo.address ? (o(), a("p", A, t(e.value.customerInfo.address), 1)) : s("", !0),
+              e.value.customerInfo.city || e.value.customerInfo.state ? (o(), a("p", G, [
+                r(t(e.value.customerInfo.city), 1),
                 e.value.customerInfo.city && e.value.customerInfo.state ? (o(), a(x, { key: 0 }, [
-                  m(", ")
-                ], 64)) : c("", !0),
-                m(t(e.value.customerInfo.state) + " " + t(e.value.customerInfo.zip), 1)
-              ])) : c("", !0),
-              e.value.customerInfo.country ? (o(), a("p", M, t(e.value.customerInfo.country), 1)) : c("", !0),
-              e.value.customerInfo.email ? (o(), a("p", R, t(e.value.customerInfo.email), 1)) : c("", !0),
-              e.value.customerInfo.phone ? (o(), a("p", W, t(e.value.customerInfo.phone), 1)) : c("", !0),
-              e.value.customerInfo.taxId ? (o(), a("p", X, t(i.value.taxId || "Tax ID") + ": " + t(e.value.customerInfo.taxId), 1)) : c("", !0)
+                  r(", ")
+                ], 64)) : s("", !0),
+                r(t(e.value.customerInfo.state) + " " + t(e.value.customerInfo.zip), 1)
+              ])) : s("", !0),
+              e.value.customerInfo.country ? (o(), a("p", H, t(e.value.customerInfo.country), 1)) : s("", !0),
+              e.value.customerInfo.email ? (o(), a("p", J, t(e.value.customerInfo.email), 1)) : s("", !0),
+              e.value.customerInfo.phone ? (o(), a("p", R, t(e.value.customerInfo.phone), 1)) : s("", !0),
+              e.value.customerInfo.taxId ? (o(), a("p", W, t(i.value.taxId || "Tax ID") + ": " + t(e.value.customerInfo.taxId), 1)) : s("", !0)
             ], 2)
-          ])) : c("", !0)
-        ])
-      ], 2)) : c("", !0),
-      e.value.items && e.value.items.length ? (o(), a("div", Y, [
-        s("table", {
-          class: n(["invoice-table", l.compact ? "text-xs" : "text-sm"])
+          ])) : s("", !0),
+          e.value.shippingInfo ? (o(), a("div", X, [
+            c("p", {
+              class: l(["text-muted-foreground uppercase tracking-widest font-semibold mb-2", n.compact ? "text-[9px]" : "text-[10px]"])
+            }, t(i.value.shipTo || "Ship To"), 3),
+            c("p", {
+              class: l(["font-bold text-foreground", n.compact ? "text-sm" : "text-base"])
+            }, t(e.value.shippingInfo.name), 3),
+            c("div", {
+              class: l(["text-muted-foreground leading-snug mt-1", n.compact ? "text-xs space-y-0.5" : "text-sm space-y-0.5"])
+            }, [
+              e.value.shippingInfo.address ? (o(), a("p", Y, t(e.value.shippingInfo.address), 1)) : s("", !0),
+              e.value.shippingInfo.city || e.value.shippingInfo.state ? (o(), a("p", Z, [
+                r(t(e.value.shippingInfo.city), 1),
+                e.value.shippingInfo.city && e.value.shippingInfo.state ? (o(), a(x, { key: 0 }, [
+                  r(", ")
+                ], 64)) : s("", !0),
+                r(t(e.value.shippingInfo.state) + " " + t(e.value.shippingInfo.zip), 1)
+              ])) : s("", !0),
+              e.value.shippingInfo.country ? (o(), a("p", ee, t(e.value.shippingInfo.country), 1)) : s("", !0),
+              e.value.shippingInfo.email ? (o(), a("p", te, t(e.value.shippingInfo.email), 1)) : s("", !0),
+              e.value.shippingInfo.phone ? (o(), a("p", oe, t(e.value.shippingInfo.phone), 1)) : s("", !0)
+            ], 2)
+          ])) : s("", !0)
+        ], 2)
+      ], 2)) : s("", !0),
+      e.value.items && e.value.items.length ? (o(), a("div", ae, [
+        c("table", {
+          class: l(["invoice-table", n.compact ? "text-xs" : "text-sm"])
         }, [
-          s("thead", Z, [
-            s("tr", null, [
-              s("th", ee, t(i.value.item || "Description"), 1),
-              s("th", te, t(i.value.qty || "Qty"), 1),
-              y.value ? (o(), a("th", oe, t(i.value.size || "Size"), 1)) : c("", !0),
-              s("th", ae, t(i.value.price || "Unit Price"), 1),
-              g.value ? (o(), a("th", se, t(i.value.discount || "Discount"), 1)) : c("", !0),
-              s("th", ce, t(i.value.total || "Total"), 1)
+          c("thead", se, [
+            c("tr", null, [
+              c("th", ce, t(i.value.item || "Description"), 1),
+              c("th", ne, t(i.value.qty || "Qty"), 1),
+              g.value ? (o(), a("th", le, t(i.value.size || "Size"), 1)) : s("", !0),
+              c("th", ie, t(i.value.price || "Unit Price"), 1),
+              y.value ? (o(), a("th", ue, t(i.value.discount || "Discount"), 1)) : s("", !0),
+              c("th", de, t(i.value.total || "Total"), 1)
             ])
           ]),
-          s("tbody", le, [
+          c("tbody", re, [
             (o(!0), a(x, null, D(e.value.items, (u, I) => (o(), a("tr", {
               key: u.id || I,
               class: "invoice-tr group"
             }, [
-              s("td", ne, [
-                s("div", ue, [
+              c("td", me, [
+                c("div", pe, [
                   u.thumbnail ? (o(), a("div", {
                     key: 0,
-                    class: n(["shrink-0 overflow-hidden", l.compact ? "w-9 h-9" : "w-10 h-10"])
+                    class: l(["shrink-0 overflow-hidden", n.compact ? "w-9 h-9" : "w-10 h-10"])
                   }, [
-                    r(k, {
+                    d(k, {
                       src: u.thumbnail,
                       alt: u.name,
                       class: "w-full h-full ronded!",
                       rounded: "md"
                     }, null, 8, ["src", "alt"])
-                  ], 2)) : c("", !0),
-                  s("div", ie, [
-                    s("p", {
+                  ], 2)) : s("", !0),
+                  c("div", ve, [
+                    c("p", {
                       class: "font-semibold text-foreground whitespace-normal text-sm",
                       title: u.name
-                    }, t(u.name), 9, re),
-                    u.sku ? (o(), a("p", de, t(i.value.sku || "SKU") + ": " + t(u.sku), 1)) : c("", !0),
-                    u.description && !l.compact ? (o(), a("p", me, t(u.description), 1)) : c("", !0)
+                    }, t(u.name), 9, xe),
+                    u.sku ? (o(), a("p", fe, t(i.value.sku || "SKU") + ": " + t(u.sku), 1)) : s("", !0),
+                    u.description && !n.compact ? (o(), a("p", he, t(u.description), 1)) : s("", !0)
                   ])
                 ])
               ]),
-              s("td", ve, t(u.quantity), 1),
-              y.value ? (o(), a("td", pe, t(u.size || "—"), 1)) : c("", !0),
-              s("td", xe, [
-                r(d(f), {
+              c("td", ge, t(u.quantity), 1),
+              g.value ? (o(), a("td", ye, t(u.size || "—"), 1)) : s("", !0),
+              c("td", be, [
+                d(m(f), {
                   value: u.price,
                   class: "text-sm"
                 }, null, 8, ["value"])
               ]),
-              g.value ? (o(), a("td", fe, [
-                u.discount !== void 0 ? (o(), a("div", he, [
-                  r(d(f), {
+              y.value ? (o(), a("td", ke, [
+                u.discount !== void 0 ? (o(), a("div", Ie, [
+                  d(m(f), {
                     value: -u.discount,
                     class: "text-sm"
                   }, null, 8, ["value"]),
                   u.discountLabel ? (o(), a("span", {
                     key: 0,
-                    class: n(["uppercase tracking-wider font-bold text-muted-foreground", l.compact ? "text-[8px]" : "text-[9px]"])
-                  }, t(u.discountLabel), 3)) : c("", !0)
-                ])) : (o(), a("span", ye, "—"))
-              ])) : c("", !0),
-              s("td", ge, [
-                r(d(f), {
+                    class: l(["uppercase tracking-wider font-bold text-muted-foreground", n.compact ? "text-[8px]" : "text-[9px]"])
+                  }, t(u.discountLabel), 3)) : s("", !0)
+                ])) : (o(), a("span", _e, "—"))
+              ])) : s("", !0),
+              c("td", we, [
+                d(m(f), {
                   value: u.total,
                   class: "text-sm"
                 }, null, 8, ["value"])
@@ -290,46 +321,64 @@ const $ = { class: "flex items-center justify-between gap-3" }, q = { class: "sh
             ]))), 128))
           ])
         ], 2)
-      ])) : c("", !0),
-      s("div", {
-        class: n(l.compact ? "p-6" : "p-8")
+      ])) : s("", !0),
+      c("div", {
+        class: l(n.compact ? "p-6" : "p-8")
       }, [
-        s("div", {
-          class: n(["flex flex-col-reverse lg:flex-row justify-between", l.compact ? "gap-6" : "gap-8"])
+        c("div", {
+          class: l(["flex flex-col-reverse lg:flex-row justify-between", n.compact ? "gap-6" : "gap-8"])
         }, [
-          s("div", {
-            class: n(["w-full lg:w-1/2 flex flex-col", l.compact ? "gap-4" : "gap-5"])
+          c("div", {
+            class: l(["w-full lg:w-1/2 flex flex-col", n.compact ? "gap-4" : "gap-5"])
           }, [
-            e.value.notes ? (o(), a("div", be, [
-              s("p", {
-                class: n(["text-muted-foreground uppercase tracking-widest font-semibold mb-2", l.compact ? "text-[9px]" : "text-[10px]"])
+            e.value.paymentMethod || e.value.shippingMethod ? (o(), a("div", ze, [
+              e.value.paymentMethod ? (o(), a("div", De, [
+                c("p", {
+                  class: l(["text-muted-foreground uppercase tracking-widest font-semibold mb-2", n.compact ? "text-[9px]" : "text-[10px]"])
+                }, t(i.value.paymentMethod || "Payment Method"), 3),
+                c("p", {
+                  class: l(["font-medium text-foreground", n.compact ? "text-xs" : "text-sm"])
+                }, t(e.value.paymentMethod), 3)
+              ])) : s("", !0),
+              e.value.shippingMethod ? (o(), a("div", Te, [
+                c("p", {
+                  class: l(["text-muted-foreground uppercase tracking-widest font-semibold mb-2", n.compact ? "text-[9px]" : "text-[10px]"])
+                }, t(i.value.shippingMethod || "Shipping Method"), 3),
+                c("p", {
+                  class: l(["font-medium text-foreground", n.compact ? "text-xs" : "text-sm"])
+                }, t(e.value.shippingMethod), 3)
+              ])) : s("", !0)
+            ])) : s("", !0),
+            e.value.notes ? (o(), a("div", Ne, [
+              c("p", {
+                class: l(["text-muted-foreground uppercase tracking-widest font-semibold mb-2", n.compact ? "text-[9px]" : "text-[10px]"])
               }, t(i.value.notes || "Notes"), 3),
-              s("p", {
-                class: n(["text-muted-foreground whitespace-pre-wrap leading-relaxed", l.compact ? "text-xs" : "text-sm"])
+              c("p", {
+                class: l(["text-muted-foreground whitespace-pre-wrap leading-relaxed", n.compact ? "text-xs" : "text-sm"])
               }, t(e.value.notes), 3)
-            ])) : c("", !0),
-            e.value.qrcode || e.value.barcode ? (o(), a("div", ke, [
-              e.value.qrcode ? (o(), a("div", Ie, [
-                r(d(T), {
+            ])) : s("", !0),
+            e.value.qrcode || e.value.barcode ? (o(), a("div", Me, [
+              e.value.qrcode ? (o(), a("div", Be, [
+                d(m(N), {
                   value: e.value.qrcode,
-                  size: l.compact ? 48 : 56
+                  size: n.compact ? 48 : 56
                 }, null, 8, ["value", "size"])
-              ])) : c("", !0),
-              e.value.barcode ? (o(), a("div", _e, [
-                r(d(N), {
+              ])) : s("", !0),
+              e.value.barcode ? (o(), a("div", Ve, [
+                d(m(T), {
                   value: e.value.barcode,
                   format: "CODE128",
-                  height: l.compact ? 24 : 30,
-                  width: l.compact ? 1.2 : 1.4,
-                  "display-value": l.displayBarcodeValue
+                  height: n.compact ? 24 : 30,
+                  width: n.compact ? 1.2 : 1.4,
+                  "display-value": n.displayBarcodeValue
                 }, null, 8, ["value", "height", "width", "display-value"])
-              ])) : c("", !0)
-            ])) : c("", !0)
+              ])) : s("", !0)
+            ])) : s("", !0)
           ], 2),
-          s("div", we, [
-            r(V, {
+          c("div", Se, [
+            d(B, {
               totals: e.value.totals,
-              compact: l.compact,
+              compact: n.compact,
               variant: "Variant1"
             }, null, 8, ["totals", "compact"])
           ])
@@ -337,11 +386,11 @@ const $ = { class: "flex items-center justify-between gap-3" }, q = { class: "sh
       ], 2),
       e.value.footerText ? (o(), a("div", {
         key: 2,
-        class: n(["border-t border-border text-center text-muted-foreground font-medium uppercase tracking-widest", l.compact ? "px-6 py-3 text-[9px]" : "px-6 py-4 text-[10px]"])
-      }, t(e.value.footerText), 3)) : c("", !0)
+        class: l(["border-t border-border text-center text-muted-foreground font-medium uppercase tracking-widest", n.compact ? "px-6 py-3 text-[9px]" : "px-6 py-4 text-[10px]"])
+      }, t(e.value.footerText), 3)) : s("", !0)
     ], 4));
   }
 });
 export {
-  Ce as default
+  Ke as default
 };