@nextblock-cms/ecom 0.8.6 → 0.8.7

package/lib/components/ProductDetailsLayout.es.js

@@ -0,0 +1,361 @@
+'use client';
+import { jsxs as a, jsx as t } from "react/jsx-runtime";
+import Q, { useState as B, useEffect as R, useMemo as T } from "react";
+import { Download as Y, Package as Z, ShieldCheck as ee } from "lucide-react";
+import { Badge as I } from "@nextblock-cms/ui/badge";
+import { Button as te } from "@nextblock-cms/ui/button";
+import { Label as re } from "@nextblock-cms/ui/label";
+import { Separator as se } from "@nextblock-cms/ui/separator";
+import { useTranslations as ae, formatPrice as D } from "@nextblock-cms/utils";
+import { useProduct as ie } from "../product-context.es.js";
+import { ProductGallery as ce } from "./ProductGallery.es.js";
+import { AddToCartButton as ne } from "./AddToCartButton.es.js";
+import { SubscriptionSelector as le } from "./SubscriptionSelector.es.js";
+import { SimpleTiptapRenderer as oe } from "./SimpleTiptapRenderer.es.js";
+import { chooseInitialVariantSelections as F, normalizeSelectionsToAvailableVariants as J, findMatchingVariant as de, resolveTranslatedText as me, getAvailableTermIdsForAttribute as pe } from "../variation-utils.es.js";
+import { useCurrency as ue } from "../CurrencyProvider.es.js";
+import { resolveEffectivePriceForCurrency as M } from "../currency.es.js";
+import { isDigitalProduct as fe } from "../types.es.js";
+import { getTrialSummary as ge } from "../trials.es.js";
+function A(o, x, e, d) {
+  const y = {
+    kind: "product-field",
+    field: x,
+    input: e,
+    label: d
+  }, u = typeof window < "u" ? window.location.origin : process.env.NEXT_PUBLIC_URL || process.env.TARGET_URL || (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "") || "http://localhost:3000";
+  let f = (typeof window < "u" ? window.location.origin : process.env.NEXT_PUBLIC_URL || process.env.TARGET_URL || (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "") || "http://localhost:3000").replace(/\/+$/, "");
+  try {
+    (f.startsWith("http://") || f.startsWith("https://")) && (f = new URL(f).hostname);
+  } catch {
+  }
+  const k = process.env.NEXTBLOCK_VERCEL_PROJECT_ID || process.env.VERCEL_PROJECT_ID, w = process.env.NEXTBLOCK_VERCEL_WORKSPACE_ID || process.env.VERCEL_ORG_ID, l = {
+    origin: f,
+    editUrl: `${u}/cms/products/${o.id}/edit`,
+    data: {
+      parentType: "product",
+      parentId: o.id,
+      slug: o.slug,
+      languageId: o.language_id,
+      draftId: null,
+      target: y
+    }
+  };
+  return k && (l.projectId = k), w && (l.workspaceId = w), {
+    "data-vercel-edit-info": JSON.stringify(l),
+    "data-vercel-edit-target": JSON.stringify(y),
+    "data-nextblock-visual-edit": `product:${x}`
+  };
+}
+const Ve = ({
+  visualEditingEnabled: o = !1,
+  descriptionNode: x
+}) => {
+  const e = ie(), { t: d, lang: y } = ae(), { activeCurrencyCode: u, currencies: P } = ue(), f = o ? A(
+    e,
+    "title",
+    "plain-text",
+    "Product title"
+  ) : void 0, k = o ? A(
+    e,
+    "short_description",
+    "plain-text",
+    "Short description"
+  ) : void 0, w = o ? A(
+    e,
+    "description_json",
+    "tiptap",
+    "Product description"
+  ) : void 0, l = (s, p, c) => {
+    const $ = d(s, c);
+    return $ === s ? p : $;
+  }, C = e.images && e.images.length > 0 ? e.images : e.image_url ? [{ url: e.image_url, alt: e.title }] : [], v = e.custom_props?.provider === "freemius" || fe(e), V = ge(e), i = !v && !!(e.has_variants && e.attributes?.length && e.variants?.length), g = e.attributes || [], m = e.variants || [], [_, L] = B(() => F(g, m)), [S, E] = B(1);
+  R(() => {
+    E(1);
+  }, [e.id]), R(() => {
+    i && L(F(g, m));
+  }, [g, i, e.id, m]);
+  const h = T(() => i ? J(
+    g,
+    m,
+    _
+  ) : _, [g, i, _, m]);
+  R(() => {
+    JSON.stringify(h) !== JSON.stringify(_) && L(h);
+  }, [h, _]);
+  const r = T(() => i ? de(m, h) : null, [i, h, m]), O = M({
+    prices: e.prices,
+    salePrices: e.sale_prices,
+    fallbackPrice: e.price,
+    fallbackSalePrice: e.sale_price,
+    saleStartAt: e.sale_start_at,
+    saleEndAt: e.sale_end_at,
+    scheduledPrice: e.scheduled_price,
+    scheduledPrices: e.scheduled_prices,
+    scheduledPriceAt: e.scheduled_price_at,
+    currencyCode: u,
+    currencies: P
+  }), U = i && r ? M({
+    prices: r.prices,
+    salePrices: r.sale_prices,
+    fallbackPrice: r.price,
+    fallbackSalePrice: r.sale_price,
+    saleStartAt: r.sale_start_at,
+    saleEndAt: r.sale_end_at,
+    scheduledPrice: r.scheduled_price,
+    scheduledPrices: r.scheduled_prices,
+    scheduledPriceAt: r.scheduled_price_at,
+    currencyCode: u,
+    currencies: P
+  }) : null, b = U?.price ?? O.price, N = U?.sale_price ?? O.sale_price, n = i ? r?.stock_quantity ?? 0 : e.stock ?? 0, G = T(() => {
+    if (!r?.image_url)
+      return C;
+    const s = {
+      url: r.image_url,
+      alt: `${e.title} ${r.label}`
+    }, p = C.filter(
+      (c) => c.url !== r.image_url
+    );
+    return [s, ...p];
+  }, [C, e.title, r]), K = typeof N == "number" && b > 0 ? Math.round(
+    (b - N) / b * 100
+  ) : 0, X = i && r ? {
+    ...e,
+    sku: r.sku,
+    price: r.price,
+    prices: r.prices,
+    sale_price: typeof r.sale_price == "number" ? r.sale_price : null,
+    sale_prices: r.sale_prices,
+    image_url: r.image_url || e.image_url,
+    stock: r.stock_quantity,
+    variant_id: r.id,
+    variant_label: r.label,
+    selected_options: r.selected_options,
+    currency_code: u
+  } : {
+    ...e,
+    currency_code: u
+  }, q = (s, p) => {
+    L(
+      (c) => J(g, m, {
+        ...c,
+        [s]: p
+      })
+    );
+  }, W = l(
+    "ecommerce.in_stock",
+    `${n} in stock`,
+    { count: String(n) }
+  ), j = l(
+    "ecommerce.out_of_stock",
+    "Out of stock"
+  ), z = l(
+    "ecommerce.select_options",
+    "Select Options"
+  ), H = l(
+    "ecommerce.variant_selection_required",
+    "Select one term from every dropdown to resolve a variation."
+  );
+  return /* @__PURE__ */ a("div", { className: "w-full animate-in fade-in slide-in-from-bottom-4 duration-700 ease-out", children: [
+    /* @__PURE__ */ t("div", { className: "container mx-auto px-4 md:px-6 py-12", children: /* @__PURE__ */ a("div", { className: "grid gap-12 lg:grid-cols-[2fr_3fr] items-start", children: [
+      /* @__PURE__ */ t("div", { className: "w-full max-w-2xl mx-auto lg:max-w-none", children: /* @__PURE__ */ t(ce, { images: G, className: "w-full" }) }),
+      /* @__PURE__ */ a("div", { className: "flex flex-col gap-4 pb-2 max-w-xl mx-auto lg:mx-0 lg:max-w-none", children: [
+        /* @__PURE__ */ t("div", { className: "space-y-6", children: /* @__PURE__ */ a("div", { className: "space-y-4", children: [
+          /* @__PURE__ */ t(
+            "h1",
+            {
+              className: "text-3xl sm:text-4xl lg:text-5xl font-extrabold tracking-tight text-foreground leading-[1.1] lg:mt-0",
+              ...f,
+              children: e.title
+            }
+          ),
+          e.categories && e.categories.length > 0 && /* @__PURE__ */ t("div", { className: "flex flex-wrap items-center gap-1.5 text-xs font-bold uppercase tracking-widest text-amber-600 dark:text-amber-400", children: e.categories.map((s, p) => {
+            const c = me(
+              s.name,
+              s.name_translations,
+              y
+            );
+            return /* @__PURE__ */ a(Q.Fragment, { children: [
+              p > 0 && /* @__PURE__ */ t("span", { className: "text-muted-foreground/30", children: "•" }),
+              /* @__PURE__ */ t("span", { children: c })
+            ] }, s.id);
+          }) }),
+          /* @__PURE__ */ t(
+            "div",
+            {
+              className: "prose prose-neutral dark:prose-invert max-w-none text-muted-foreground leading-relaxed text-left",
+              ...k,
+              children: e.short_description ? /* @__PURE__ */ t(
+                "div",
+                {
+                  className: "text-lg mb-4 leading-relaxed",
+                  dangerouslySetInnerHTML: {
+                    __html: e.short_description
+                  }
+                }
+              ) : o ? /* @__PURE__ */ t("p", { className: "text-lg mb-4 italic text-muted-foreground", children: "Add a short product description." }) : null
+            }
+          ),
+          /* @__PURE__ */ a("div", { className: "flex items-center gap-3", children: [
+            typeof N == "number" && /* @__PURE__ */ t(
+              I,
+              {
+                variant: "destructive",
+                className: "px-2.5 py-1 text-xs font-bold uppercase tracking-wide animate-pulse shadow-sm",
+                children: d("ecommerce.sale_badge", {
+                  percent: String(K)
+                })
+              }
+            ),
+            !v && n > 0 && n < 10 && /* @__PURE__ */ t(
+              I,
+              {
+                variant: "outline",
+                className: "text-amber-600 border-amber-200 bg-amber-50",
+                children: d("ecommerce.low_stock", {
+                  count: String(n)
+                })
+              }
+            ),
+            V && /* @__PURE__ */ t(
+              I,
+              {
+                variant: "secondary",
+                className: "border border-emerald-200 bg-emerald-50 text-emerald-800",
+                children: V.label
+              }
+            )
+          ] })
+        ] }) }),
+        /* @__PURE__ */ a("div", { className: "p-5 rounded-2xl bg-card/60 border border-border/80 shadow-md backdrop-blur-md space-y-4", children: [
+          v ? /* @__PURE__ */ t(le, { product: e }) : /* @__PURE__ */ a("div", { className: "space-y-3.5", children: [
+            /* @__PURE__ */ a("div", { className: "flex items-center justify-between gap-4", children: [
+              /* @__PURE__ */ a("div", { className: "space-y-1", children: [
+                /* @__PURE__ */ t("span", { className: "text-[10px] font-bold text-muted-foreground uppercase tracking-widest", children: l("ecommerce.price", "Price") }),
+                /* @__PURE__ */ a("div", { className: "flex items-baseline gap-2.5", children: [
+                  /* @__PURE__ */ t("span", { className: "text-3xl font-extrabold text-foreground", children: D(
+                    N ?? b,
+                    u
+                  ) }),
+                  typeof N == "number" && /* @__PURE__ */ t("span", { className: "text-lg text-muted-foreground line-through decoration-destructive/20 decoration-1", children: D(b, u) })
+                ] })
+              ] }),
+              !v && (r || !i) && /* @__PURE__ */ a("div", { className: "text-right space-y-1", children: [
+                /* @__PURE__ */ a("span", { className: "text-[10px] font-bold text-muted-foreground uppercase tracking-widest block", children: [
+                  !i && e.sku && /* @__PURE__ */ a("span", { className: "mr-2 font-normal lowercase normal-case text-muted-foreground/70", children: [
+                    "SKU: ",
+                    e.sku
+                  ] }),
+                  l("ecommerce.status", "Status")
+                ] }),
+                /* @__PURE__ */ t("div", { className: (n ?? 0) > 0 ? "text-emerald-600 dark:text-emerald-400 font-semibold text-sm" : "text-destructive font-semibold text-sm", children: (n ?? 0) > 0 ? W : j })
+              ] })
+            ] }),
+            i && /* @__PURE__ */ t("div", { className: "space-y-3", children: /* @__PURE__ */ t("div", { className: "grid gap-3 sm:grid-cols-2", children: g.map((s) => {
+              const p = pe(
+                m,
+                s.id,
+                h
+              );
+              return /* @__PURE__ */ a("div", { className: "space-y-1", children: [
+                /* @__PURE__ */ a("div", { className: "flex items-center justify-between", children: [
+                  /* @__PURE__ */ t(
+                    re,
+                    {
+                      htmlFor: `attribute-${s.id}`,
+                      className: "text-[11px] font-semibold text-muted-foreground uppercase tracking-wider",
+                      children: s.name
+                    }
+                  ),
+                  r?.sku && /* @__PURE__ */ t("span", { className: "text-[10px] text-muted-foreground font-mono", children: r.sku })
+                ] }),
+                /* @__PURE__ */ t(
+                  "select",
+                  {
+                    id: `attribute-${s.id}`,
+                    className: "flex h-9 w-full rounded-md border border-input bg-background px-3 py-1 text-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
+                    value: h[s.id] || "",
+                    onChange: (c) => q(
+                      s.id,
+                      c.target.value
+                    ),
+                    children: s.terms.map((c) => /* @__PURE__ */ t(
+                      "option",
+                      {
+                        value: c.id,
+                        disabled: !p.has(c.id),
+                        children: c.value
+                      },
+                      c.id
+                    ))
+                  }
+                )
+              ] }, s.id);
+            }) }) }),
+            i && !r && /* @__PURE__ */ t("p", { className: "text-xs text-muted-foreground italic pt-1", children: H }),
+            /* @__PURE__ */ a("div", { className: "flex items-center gap-3 pt-1", children: [
+              !v && (n ?? 0) > 0 && /* @__PURE__ */ a("div", { className: "flex items-center border rounded-lg h-12 bg-background border-input select-none", children: [
+                /* @__PURE__ */ t(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => E((s) => Math.max(1, s - 1)),
+                    className: "px-3 h-full flex items-center justify-center text-muted-foreground hover:text-foreground active:scale-95 transition-all text-lg font-medium",
+                    disabled: S <= 1,
+                    children: "-"
+                  }
+                ),
+                /* @__PURE__ */ t("span", { className: "w-8 text-center text-sm font-semibold", children: S }),
+                /* @__PURE__ */ t(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => E(
+                      (s) => n !== null && s >= n ? s : s + 1
+                    ),
+                    className: "px-3 h-full flex items-center justify-center text-muted-foreground hover:text-foreground active:scale-95 transition-all text-lg font-medium",
+                    disabled: n !== null && S >= n,
+                    children: "+"
+                  }
+                )
+              ] }),
+              i && (!r || (n ?? 0) <= 0) ? /* @__PURE__ */ t(
+                te,
+                {
+                  disabled: !0,
+                  className: "flex-1 h-12 text-md font-bold shadow-md",
+                  children: r ? j : z
+                }
+              ) : /* @__PURE__ */ t(
+                ne,
+                {
+                  product: X,
+                  quantity: S,
+                  className: "flex-1 h-12 text-md font-bold shadow-md transition-all hover:shadow-lg active:scale-[0.98]"
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ t(se, { className: "opacity-60 my-0.5" }),
+          /* @__PURE__ */ a("div", { className: "grid grid-cols-2 gap-4 text-center text-[11px] font-medium text-muted-foreground pt-1", children: [
+            /* @__PURE__ */ t("div", { className: "flex items-center justify-center gap-2", children: v ? /* @__PURE__ */ a("span", { className: "inline-flex items-center gap-1.5", children: [
+              /* @__PURE__ */ t(Y, { className: "h-3.5 w-3.5" }),
+              d("ecommerce.instant_digital_delivery")
+            ] }) : /* @__PURE__ */ a("span", { className: "inline-flex items-center gap-1.5", children: [
+              /* @__PURE__ */ t(Z, { className: "h-3.5 w-3.5" }),
+              d("ecommerce.free_shipping")
+            ] }) }),
+            /* @__PURE__ */ t("div", { className: "flex items-center justify-center gap-2", children: /* @__PURE__ */ a("span", { className: "inline-flex items-center gap-1.5", children: [
+              /* @__PURE__ */ t(ee, { className: "h-3.5 w-3.5" }),
+              d("ecommerce.secure_checkout")
+            ] }) })
+          ] })
+        ] })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ t("div", { className: "min-w-0 w-full", ...x ? void 0 : w, children: x || (e.description_json ? /* @__PURE__ */ t("div", { className: "container mx-auto px-4 md:px-6 pb-12 prose prose-neutral dark:prose-invert max-w-none leading-relaxed", children: /* @__PURE__ */ t(oe, { content: e.description_json }) }) : /* @__PURE__ */ t("div", { className: "container mx-auto px-4 md:px-6 pb-12", children: /* @__PURE__ */ t("p", { className: "italic text-sm text-muted-foreground", children: d("ecommerce.no_description") }) })) })
+  ] });
+};
+export {
+  Ve as ProductDetailsLayout
+};

package/lib/components/ProductGallery.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("@nextblock-cms/utils"),a=require("react"),d=({images:r=[],className:s})=>{const[l,n]=a.useState(0);return a.useEffect(()=>{n(0)},[r]),r.length?e.jsxs("div",{className:c.cn("flex flex-col gap-4",s),children:[e.jsx("div",{className:"relative aspect-square w-full overflow-hidden rounded-lg border bg-white",children:e.jsx("img",{src:r[l].url,alt:r[l].alt,className:"h-full w-full object-cover object-center"})}),r.length>1&&e.jsx("div",{className:"flex gap-4 overflow-x-auto pb-2",children:r.map((o,t)=>e.jsx("button",{onClick:()=>n(t),className:c.cn("relative aspect-square w-20 flex-shrink-0 overflow-hidden rounded-md border",l===t?"ring-2 ring-primary":"ring-1 ring-transparent hover:ring-primary/50"),children:e.jsx("img",{src:o.url,alt:o.alt,className:"h-full w-full object-cover object-center"})},t))})]}):e.jsx("div",{className:c.cn("relative aspect-square w-full overflow-hidden rounded-lg bg-secondary",s),children:e.jsx("div",{className:"flex h-full items-center justify-center text-muted-foreground",children:"No Image"})})};exports.ProductGallery=d;

package/lib/components/ProductGallery.es.js

@@ -0,0 +1,41 @@
+'use client';
+import { jsx as e, jsxs as d } from "react/jsx-runtime";
+import { cn as c } from "@nextblock-cms/utils";
+import { useState as s, useEffect as i } from "react";
+const m = ({ images: r = [], className: o }) => {
+  const [l, n] = s(0);
+  return i(() => {
+    n(0);
+  }, [r]), r.length ? /* @__PURE__ */ d("div", { className: c("flex flex-col gap-4", o), children: [
+    /* @__PURE__ */ e("div", { className: "relative aspect-square w-full overflow-hidden rounded-lg border bg-white", children: /* @__PURE__ */ e(
+      "img",
+      {
+        src: r[l].url,
+        alt: r[l].alt,
+        className: "h-full w-full object-cover object-center"
+      }
+    ) }),
+    r.length > 1 && /* @__PURE__ */ e("div", { className: "flex gap-4 overflow-x-auto pb-2", children: r.map((a, t) => /* @__PURE__ */ e(
+      "button",
+      {
+        onClick: () => n(t),
+        className: c(
+          "relative aspect-square w-20 flex-shrink-0 overflow-hidden rounded-md border",
+          l === t ? "ring-2 ring-primary" : "ring-1 ring-transparent hover:ring-primary/50"
+        ),
+        children: /* @__PURE__ */ e(
+          "img",
+          {
+            src: a.url,
+            alt: a.alt,
+            className: "h-full w-full object-cover object-center"
+          }
+        )
+      },
+      t
+    )) })
+  ] }) : /* @__PURE__ */ e("div", { className: c("relative aspect-square w-full overflow-hidden rounded-lg bg-secondary", o), children: /* @__PURE__ */ e("div", { className: "flex h-full items-center justify-center text-muted-foreground", children: "No Image" }) });
+};
+export {
+  m as ProductGallery
+};

package/lib/components/ProductGrid.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),s=require("./ProductCard.cjs.js"),c=require("@nextblock-cms/utils"),o=({products:e,columns:t=3,className:i})=>e.length?r.jsx("div",{className:c.cn("grid gap-6 sm:grid-cols-2",t===3&&"lg:grid-cols-3",t===4&&"lg:grid-cols-4",i),children:e.map(d=>r.jsx(s.ProductCard,{product:d},d.id))}):r.jsx("div",{className:"py-12 text-center text-muted-foreground",children:"No products found."});exports.ProductGrid=o;

package/lib/components/ProductGrid.es.js

@@ -0,0 +1,19 @@
+'use client';
+import { jsx as r } from "react/jsx-runtime";
+import { ProductCard as i } from "./ProductCard.es.js";
+import { cn as c } from "@nextblock-cms/utils";
+const n = ({ products: d, columns: o = 3, className: e }) => d.length ? /* @__PURE__ */ r(
+  "div",
+  {
+    className: c(
+      "grid gap-6 sm:grid-cols-2",
+      o === 3 && "lg:grid-cols-3",
+      o === 4 && "lg:grid-cols-4",
+      e
+    ),
+    children: d.map((t) => /* @__PURE__ */ r(i, { product: t }, t.id))
+  }
+) : /* @__PURE__ */ r("div", { className: "py-12 text-center text-muted-foreground", children: "No products found." });
+export {
+  n as ProductGrid
+};

package/lib/components/ShippingEstimator.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("react"),L=require("@nextblock-cms/ui/button"),E=require("@nextblock-cms/ui/input"),m=require("@nextblock-cms/ui/label"),i=require("lucide-react"),R=require("../countries.cjs.js"),T=require("../server-actions/shipping-actions.cjs.js"),N=require("@nextblock-cms/utils"),x=require("../states.cjs.js"),O=require("../CurrencyProvider.cjs.js"),I=({physicalSubtotal:y})=>{const[c,S]=a.useState("CA"),[n,p]=a.useState(""),[h,C]=a.useState(""),[g,j]=a.useState(!1),[r,b]=a.useState(null),[d,v]=a.useState(null),{t:s,lang:_}=N.useTranslations(),{activeCurrencyCode:f}=O.useCurrency(),u=(t,o)=>{const l=s(t);return l===t?o:l},q=x.getStatesForCountry(c),w=x.countryUsesStructuredStates(c),k=u("select_an_option","Select an option"),F=u("state_province","State / Province"),P=async()=>{j(!0),v(null),b(null);const t=await T.getShippingEstimates(y,{country:c,state:n||void 0,postal_code:h},_,f);t.success&&t.methods?b(t.methods):v(t.errorKey?u(t.errorKey,t.error||s("ecommerce.no_rates_found")):t.error||s("ecommerce.no_rates_found")),j(!1)};return e.jsxs("div",{className:"space-y-4 rounded-lg border bg-muted/30 p-4 mt-6",children:[e.jsxs("div",{className:"flex items-center gap-2 font-semibold text-sm",children:[e.jsx(i.Truck,{className:"h-4 w-4"}),e.jsx("span",{children:s("ecommerce.estimate_shipping")})]}),e.jsxs("div",{className:"grid gap-3",children:[e.jsxs("div",{className:"space-y-1.5",children:[e.jsx(m.Label,{htmlFor:"estimate-country",className:"text-xs uppercase tracking-wider text-muted-foreground",children:s("ecommerce.country")}),e.jsx("select",{id:"estimate-country",value:c,onChange:t=>{const o=t.target.value,l=x.getStatesForCountry(o);S(o),p(l.some(A=>A.code===n)?n:"")},className:"flex h-9 w-full rounded-md border border-input bg-background px-3 py-2 text-sm",children:R.countries.map(t=>e.jsx("option",{value:t.code,children:t.name},t.code))})]}),w&&e.jsxs("div",{className:"space-y-1.5",children:[e.jsx(m.Label,{htmlFor:"estimate-state",className:"text-xs uppercase tracking-wider text-muted-foreground",children:s("state_province")}),e.jsxs("select",{id:"estimate-state",value:n,onChange:t=>p(t.target.value),className:"flex h-9 w-full rounded-md border border-input bg-background px-3 py-2 text-sm",children:[e.jsx("option",{value:"",children:`${k}: ${F}`}),q.map(t=>e.jsx("option",{value:t.code,children:t.name},t.code))]})]}),e.jsxs("div",{className:"space-y-1.5",children:[e.jsx(m.Label,{htmlFor:"estimate-postal",className:"text-xs uppercase tracking-wider text-muted-foreground",children:s("ecommerce.postal_code")}),e.jsxs("div",{className:"flex gap-2",children:[e.jsx(E.Input,{id:"estimate-postal",placeholder:"A1A 1A1",value:h,onChange:t=>C(t.target.value),className:"h-9 text-sm bg-background"}),e.jsxs(L.Button,{size:"sm",variant:"secondary",onClick:P,disabled:g,className:"shrink-0",children:[g?e.jsx(i.Loader2,{className:"h-4 w-4 animate-spin"}):e.jsx(i.Calculator,{className:"h-4 w-4 mr-1.5"}),s("ecommerce.calculate")]})]})]})]}),d&&e.jsx("p",{className:"text-xs text-destructive mt-2",children:d}),r&&r.length>0&&e.jsxs("div",{className:"mt-4 space-y-2 border-t pt-3",children:[e.jsxs("p",{className:"text-xs font-medium text-muted-foreground uppercase",children:[s("ecommerce.available_rates"),":"]}),r.map(t=>e.jsxs("div",{className:"flex justify-between items-center p-3 border rounded-lg bg-muted/30",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(i.Truck,{className:"h-4 w-4 text-muted-foreground"}),e.jsx("span",{className:"text-sm font-medium",children:t.name})]}),e.jsx("span",{className:"text-sm font-bold",children:t.amount===0?s("ecommerce.free"):N.formatPrice(t.amount,f)})]},t.id))]}),r&&r.length===0&&!d&&e.jsx("p",{className:"text-xs text-muted-foreground mt-2 italic",children:s("ecommerce.no_rates_found")})]})};exports.ShippingEstimator=I;

package/lib/components/ShippingEstimator.es.js

@@ -0,0 +1,125 @@
+'use client';
+import { jsxs as s, jsx as t } from "react/jsx-runtime";
+import { useState as r } from "react";
+import { Button as L } from "@nextblock-cms/ui/button";
+import { Input as I } from "@nextblock-cms/ui/input";
+import { Label as u } from "@nextblock-cms/ui/label";
+import { Truck as b, Loader2 as K, Calculator as O } from "lucide-react";
+import { countries as T } from "../countries.es.js";
+import { getShippingEstimates as $ } from "../server-actions/shipping-actions.es.js";
+import { useTranslations as z, formatPrice as B } from "@nextblock-cms/utils";
+import { getStatesForCountry as y, countryUsesStructuredStates as R } from "../states.es.js";
+import { useCurrency as U } from "../CurrencyProvider.es.js";
+const Z = ({ physicalSubtotal: C }) => {
+  const [c, _] = r("CA"), [n, p] = r(""), [h, S] = r(""), [g, f] = r(!1), [o, x] = r(null), [i, v] = r(null), { t: a, lang: w } = z(), { activeCurrencyCode: N } = U(), d = (e, l) => {
+    const m = a(e);
+    return m === e ? l : m;
+  }, k = y(c), F = R(c), A = d("select_an_option", "Select an option"), P = d("state_province", "State / Province"), j = async () => {
+    f(!0), v(null), x(null);
+    const e = await $(
+      C,
+      {
+        country: c,
+        state: n || void 0,
+        postal_code: h
+      },
+      w,
+      N
+    );
+    e.success && e.methods ? x(e.methods) : v(
+      e.errorKey ? d(
+        e.errorKey,
+        e.error || a("ecommerce.no_rates_found")
+      ) : e.error || a("ecommerce.no_rates_found")
+    ), f(!1);
+  };
+  return /* @__PURE__ */ s("div", { className: "space-y-4 rounded-lg border bg-muted/30 p-4 mt-6", children: [
+    /* @__PURE__ */ s("div", { className: "flex items-center gap-2 font-semibold text-sm", children: [
+      /* @__PURE__ */ t(b, { className: "h-4 w-4" }),
+      /* @__PURE__ */ t("span", { children: a("ecommerce.estimate_shipping") })
+    ] }),
+    /* @__PURE__ */ s("div", { className: "grid gap-3", children: [
+      /* @__PURE__ */ s("div", { className: "space-y-1.5", children: [
+        /* @__PURE__ */ t(u, { htmlFor: "estimate-country", className: "text-xs uppercase tracking-wider text-muted-foreground", children: a("ecommerce.country") }),
+        /* @__PURE__ */ t(
+          "select",
+          {
+            id: "estimate-country",
+            value: c,
+            onChange: (e) => {
+              const l = e.target.value, m = y(l);
+              _(l), p(
+                m.some((E) => E.code === n) ? n : ""
+              );
+            },
+            className: "flex h-9 w-full rounded-md border border-input bg-background px-3 py-2 text-sm",
+            children: T.map((e) => /* @__PURE__ */ t("option", { value: e.code, children: e.name }, e.code))
+          }
+        )
+      ] }),
+      F && /* @__PURE__ */ s("div", { className: "space-y-1.5", children: [
+        /* @__PURE__ */ t(u, { htmlFor: "estimate-state", className: "text-xs uppercase tracking-wider text-muted-foreground", children: a("state_province") }),
+        /* @__PURE__ */ s(
+          "select",
+          {
+            id: "estimate-state",
+            value: n,
+            onChange: (e) => p(e.target.value),
+            className: "flex h-9 w-full rounded-md border border-input bg-background px-3 py-2 text-sm",
+            children: [
+              /* @__PURE__ */ t("option", { value: "", children: `${A}: ${P}` }),
+              k.map((e) => /* @__PURE__ */ t("option", { value: e.code, children: e.name }, e.code))
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ s("div", { className: "space-y-1.5", children: [
+        /* @__PURE__ */ t(u, { htmlFor: "estimate-postal", className: "text-xs uppercase tracking-wider text-muted-foreground", children: a("ecommerce.postal_code") }),
+        /* @__PURE__ */ s("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ t(
+            I,
+            {
+              id: "estimate-postal",
+              placeholder: "A1A 1A1",
+              value: h,
+              onChange: (e) => S(e.target.value),
+              className: "h-9 text-sm bg-background"
+            }
+          ),
+          /* @__PURE__ */ s(
+            L,
+            {
+              size: "sm",
+              variant: "secondary",
+              onClick: j,
+              disabled: g,
+              className: "shrink-0",
+              children: [
+                g ? /* @__PURE__ */ t(K, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ t(O, { className: "h-4 w-4 mr-1.5" }),
+                a("ecommerce.calculate")
+              ]
+            }
+          )
+        ] })
+      ] })
+    ] }),
+    i && /* @__PURE__ */ t("p", { className: "text-xs text-destructive mt-2", children: i }),
+    o && o.length > 0 && /* @__PURE__ */ s("div", { className: "mt-4 space-y-2 border-t pt-3", children: [
+      /* @__PURE__ */ s("p", { className: "text-xs font-medium text-muted-foreground uppercase", children: [
+        a("ecommerce.available_rates"),
+        ":"
+      ] }),
+      o.map((e) => /* @__PURE__ */ s("div", { className: "flex justify-between items-center p-3 border rounded-lg bg-muted/30", children: [
+        /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ t(b, { className: "h-4 w-4 text-muted-foreground" }),
+          /* @__PURE__ */ t("span", { className: "text-sm font-medium", children: e.name })
+        ] }),
+        /* @__PURE__ */ t("span", { className: "text-sm font-bold", children: e.amount === 0 ? a("ecommerce.free") : B(e.amount, N) })
+      ] }, e.id))
+    ] }),
+    o && o.length === 0 && !i && /* @__PURE__ */ t("p", { className: "text-xs text-muted-foreground mt-2 italic", children: a("ecommerce.no_rates_found") })
+  ] });
+};
+export {
+  Z as ShippingEstimator
+};

package/lib/components/SubscriptionSelector.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),_=require("react"),$=require("@nextblock-cms/ui/button"),S=require("@nextblock-cms/ui/Skeleton"),L=require("../use-cart.cjs.js"),F=require("lucide-react"),N=require("sonner"),I=require("../pages/cms/products/actions.cjs.js"),a=require("@nextblock-cms/utils"),B=require("../CurrencyProvider.cjs.js"),g=require("../currency.cjs.js"),E=require("../trials.cjs.js"),O=({product:e})=>{const y=L.useCart(l=>l),{t:o}=a.useTranslations(),{activeCurrencyCode:s,currencies:u,defaultCurrency:i}=B.useCurrency(),[q,M]=_.useState([]),[k,w]=_.useState(!0),[t,d]=_.useState("annual");if(_.useEffect(()=>{async function l(){try{if(!e.id)return;const c=await I.getPublicFreemiusPricing(e.id);M(c)}catch(c){console.error("Failed to load pricing:",c)}finally{w(!1)}}l()},[e.id]),!y)return r.jsx(S.Skeleton,{className:"h-14 w-full"});const{addItem:A}=y,m=q[0],n=m?.pricing?.[0],P=()=>{let l=e.price,c=e.freemius_plan_id;n&&(t==="monthly"&&n.monthly_price!=null&&(l=a.majorUnitAmountToMinor(n.monthly_price,i.code)),t==="annual"&&n.annual_price!=null&&(l=a.majorUnitAmountToMinor(n.annual_price,i.code)),t==="lifetime"&&n.lifetime_price!=null&&(l=a.majorUnitAmountToMinor(n.lifetime_price,i.code)));const C=u.reduce((j,v)=>(j[v.code]=g.convertMinorUnitAmount({amount:l,fromCurrencyCode:i.code,toCurrencyCode:v.code,currencies:u,applyRounding:!0}),j),{}),T=C[s]??l;m&&m.id&&(c=m.id);const{success:U,error:R}=A({id:e.id,product_id:e.id,title:e.title,price:T,prices:C,image_url:e.image_url,slug:e.slug,sku:e.sku,language_id:e.language_id,translation_group_id:e.translation_group_id,product_type:"digital",payment_provider:"freemius",provider:"freemius",billing_cycle:t,freemius_product_id:e.freemius_product_id,freemius_plan_id:c,trial_period_days:e.trial_period_days??0,trial_requires_payment_method:e.trial_requires_payment_method??!1,is_taxable:e.is_taxable,currency_code:s});U?N.toast.success(o("ecommerce.added_to_cart_success",{item:e.title})):N.toast.error(R||o("ecommerce.added_to_cart_error"))};if(k)return r.jsx(S.Skeleton,{className:"h-32 w-full"});if(!m||!n)return r.jsx("div",{className:"p-4 border border-dashed rounded-lg text-center text-muted-foreground",children:o("ecommerce.pricing_unavailable")});const h=n.monthly_price!=null,p=n.annual_price!=null,b=n.lifetime_price!=null;t==="annual"&&!p&&(h?d("monthly"):b&&d("lifetime"));const f=E.getTrialSummary(e);let x=e.price;return t==="monthly"&&n.monthly_price!=null&&(x=g.convertMinorUnitAmount({amount:a.majorUnitAmountToMinor(n.monthly_price,i.code),fromCurrencyCode:i.code,toCurrencyCode:s,currencies:u,applyRounding:!0})),t==="annual"&&n.annual_price!=null&&(x=g.convertMinorUnitAmount({amount:a.majorUnitAmountToMinor(n.annual_price,i.code),fromCurrencyCode:i.code,toCurrencyCode:s,currencies:u,applyRounding:!0})),t==="lifetime"&&n.lifetime_price!=null&&(x=g.convertMinorUnitAmount({amount:a.majorUnitAmountToMinor(n.lifetime_price,i.code),fromCurrencyCode:i.code,toCurrencyCode:s,currencies:u,applyRounding:!0})),r.jsxs("div",{className:"flex flex-col gap-4",children:[r.jsxs("div",{className:"flex bg-secondary/35 p-1 rounded-lg w-full max-w-sm mx-auto shadow-inner",children:[h&&r.jsx("button",{onClick:()=>d("monthly"),className:`flex-1 py-1.5 text-xs font-semibold rounded-md transition-all ${t==="monthly"?"bg-background shadow-sm text-foreground":"text-muted-foreground hover:text-foreground"}`,children:o("ecommerce.monthly")}),p&&r.jsx("button",{onClick:()=>d("annual"),className:`flex-1 py-1.5 text-xs font-semibold rounded-md transition-all ${t==="annual"?"bg-background shadow-sm text-foreground":"text-muted-foreground hover:text-foreground"}`,children:o("ecommerce.annual")}),b&&r.jsx("button",{onClick:()=>d("lifetime"),className:`flex-1 py-1.5 text-xs font-semibold rounded-md transition-all ${t==="lifetime"?"bg-background shadow-sm text-foreground":"text-muted-foreground hover:text-foreground"}`,children:o("ecommerce.lifetime")})]}),r.jsxs("div",{className:"text-center",children:[r.jsx("span",{className:"text-3xl font-extrabold text-foreground",children:a.formatPrice(x,s)}),t!=="lifetime"&&r.jsxs("span",{className:"text-muted-foreground text-sm ml-1.5",children:["/ ",o(t==="annual"?"ecommerce.year":"ecommerce.month")]}),f&&r.jsxs("div",{className:"mt-1 text-xs font-medium text-emerald-600 dark:text-emerald-400",children:[f.label,r.jsx("span",{className:"mx-2 text-muted-foreground/50",children:"|"}),r.jsx("span",{className:"text-muted-foreground",children:f.paymentRequirementLabel})]})]}),r.jsxs($.Button,{onClick:P,className:"w-full h-12 text-md font-bold shadow-md transition-all hover:shadow-lg active:scale-[0.98]",children:[r.jsx(F.ShoppingCart,{className:"mr-2 h-4 w-4"}),f?.label?`Start ${f.label}`:o("ecommerce.get_license")]})]})};exports.SubscriptionSelector=O;