@jay-framework/wix-cart 0.15.0

package/dist/index.js

@@ -0,0 +1,445 @@
+import { registerService, getService } from "@jay-framework/stack-server-runtime";
+import { currentCart } from "@wix/ecom";
+import { createJayService, makeJayStackComponent, RenderPipeline, makeJayInit } from "@jay-framework/fullstack-component";
+import { createJayContext, useGlobalContext } from "@jay-framework/runtime";
+import { registerReactiveGlobalContext, createSignal, useReactive } from "@jay-framework/component";
+import { WIX_CLIENT_CONTEXT, WIX_CLIENT_SERVICE } from "@jay-framework/wix-server-client";
+let currentCartInstance;
+function getCurrentCartClient(wixClient) {
+  if (!currentCartInstance) {
+    currentCartInstance = wixClient.use(currentCart);
+  }
+  return currentCartInstance;
+}
+const WIX_CART_SERVICE = createJayService("Wix Cart Service");
+function provideWixCartService(wixClient) {
+  const service = {
+    cart: getCurrentCartClient(wixClient)
+  };
+  registerService(WIX_CART_SERVICE, service);
+  return service;
+}
+function parseWixMediaUrl(url) {
+  if (!url) return null;
+  const match = url.match(
+    /^wix:(image|video|document|audio):\/\/v1\/([^/]+)\/([^#]+)(?:#(.*))?$/
+  );
+  if (!match) return null;
+  const [, type, mediaId, fileName, hashParams] = match;
+  const result = {
+    type,
+    mediaId,
+    fileName: decodeURIComponent(fileName)
+  };
+  if (hashParams) {
+    const params = new URLSearchParams(hashParams);
+    const originWidth = params.get("originWidth");
+    const originHeight = params.get("originHeight");
+    if (originWidth) result.originWidth = parseInt(originWidth, 10);
+    if (originHeight) result.originHeight = parseInt(originHeight, 10);
+    const posterUri = params.get("posterUri");
+    const posterWidth = params.get("posterWidth");
+    const posterHeight = params.get("posterHeight");
+    if (posterUri) result.posterUri = decodeURIComponent(posterUri);
+    if (posterWidth) result.posterWidth = parseInt(posterWidth, 10);
+    if (posterHeight) result.posterHeight = parseInt(posterHeight, 10);
+  }
+  return result;
+}
+function formatWixMediaUrl(_id, url, resize) {
+  const resizeFragment = "";
+  if (url == null ? void 0 : url.startsWith("wix:")) {
+    const parsed = parseWixMediaUrl(url);
+    if (parsed) {
+      return `https://static.wixstatic.com/media/${parsed.mediaId}${resizeFragment}`;
+    }
+  }
+  if ((url == null ? void 0 : url.startsWith("http://")) || (url == null ? void 0 : url.startsWith("https://"))) {
+    return url;
+  }
+  return "";
+}
+function mapLineItem(item) {
+  const catalogRef = item.catalogReference;
+  const physicalProperties = item.physicalProperties;
+  const priceData = item.price;
+  const descriptionLines = item.descriptionLines || [];
+  const variantParts = descriptionLines.filter((line) => line.name?.translated).map(
+    (line) => `${line.name?.translated}: ${line.colorInfo?.translated || line.plainText?.translated || ""}`
+  );
+  const slug = item.url?.split("/").pop() || "";
+  return {
+    lineItemId: item._id || "",
+    productId: catalogRef?.catalogItemId || "",
+    productName: item.productName?.translated || item.productName?.original || "",
+    productUrl: slug ? `/products/${slug}` : "",
+    variantName: variantParts.join(" / "),
+    sku: physicalProperties?.sku || "",
+    image: {
+      url: formatWixMediaUrl("", item.image || ""),
+      altText: item.productName?.translated || ""
+    },
+    quantity: item.quantity || 1,
+    unitPrice: {
+      amount: priceData?.amount || "0",
+      formattedAmount: priceData?.formattedAmount || ""
+    },
+    lineTotal: {
+      amount: item.lineItemPrice?.amount || "0",
+      formattedAmount: item.lineItemPrice?.formattedAmount || ""
+    },
+    lineDiscount: {
+      amount: "0",
+      formattedAmount: ""
+    },
+    hasDiscount: false
+  };
+}
+function calculateTotalDiscount(appliedDiscounts) {
+  if (!appliedDiscounts) return 0;
+  return appliedDiscounts.reduce(
+    (sum, d) => sum + parseFloat(d.merchantDiscount?.amount?.amount || "0"),
+    0
+  );
+}
+function calculateItemCount(lineItems) {
+  if (!lineItems) return 0;
+  return lineItems.reduce((sum, item) => sum + (item.quantity || 0), 0);
+}
+function getEmptySummary() {
+  return {
+    itemCount: 0,
+    subtotal: { amount: "0", formattedAmount: "$0.00" },
+    discount: { amount: "0", formattedAmount: "" },
+    hasDiscount: false,
+    estimatedTax: { amount: "0", formattedAmount: "" },
+    showTax: false,
+    estimatedTotal: { amount: "0", formattedAmount: "$0.00" },
+    currency: "USD"
+  };
+}
+function mapCartSummary(cart) {
+  if (!cart) {
+    return getEmptySummary();
+  }
+  const totalDiscount = calculateTotalDiscount(cart.appliedDiscounts);
+  const itemCount = calculateItemCount(cart.lineItems);
+  return {
+    itemCount,
+    subtotal: {
+      amount: "0",
+      formattedAmount: "$0.00"
+    },
+    discount: {
+      amount: totalDiscount.toString(),
+      formattedAmount: totalDiscount > 0 ? `-$${totalDiscount.toFixed(2)}` : ""
+    },
+    hasDiscount: totalDiscount > 0,
+    estimatedTax: {
+      amount: "0",
+      formattedAmount: ""
+    },
+    showTax: false,
+    estimatedTotal: {
+      amount: "0",
+      formattedAmount: "$0.00"
+    },
+    currency: cart.currency || "USD"
+  };
+}
+function mapCartToState(cart) {
+  if (!cart) {
+    return getEmptyCartState();
+  }
+  const lineItems = (cart.lineItems || []).map(mapLineItem);
+  const appliedCoupon = cart.appliedDiscounts?.find((d) => d.coupon?.code)?.coupon?.code || "";
+  return {
+    cartId: cart._id || "",
+    isEmpty: lineItems.length === 0,
+    lineItems,
+    summary: mapCartSummary(cart),
+    appliedCoupon,
+    hasAppliedCoupon: !!appliedCoupon
+  };
+}
+function getEmptyCartState() {
+  return {
+    cartId: "",
+    isEmpty: true,
+    lineItems: [],
+    summary: getEmptySummary(),
+    appliedCoupon: "",
+    hasAppliedCoupon: false
+  };
+}
+function mapCartToIndicator(cart) {
+  if (!cart || !cart.lineItems?.length) {
+    return {
+      itemCount: 0,
+      hasItems: false
+    };
+  }
+  const itemCount = calculateItemCount(cart.lineItems);
+  return {
+    itemCount,
+    hasItems: itemCount > 0
+  };
+}
+function isCartNotFoundError(error) {
+  const err = error;
+  if (err?.response?.status === 404) return true;
+  if (err?.status === 404) return true;
+  if (err?.code === 404) return true;
+  const message = err?.message?.toLowerCase() || "";
+  if (message.includes("not found") && message.includes("cart")) return true;
+  return false;
+}
+async function getCurrentCartOrNull(cartClient) {
+  try {
+    const response = await cartClient.getCurrentCart();
+    return response ?? null;
+  } catch (error) {
+    if (isCartNotFoundError(error)) {
+      return null;
+    }
+    throw error;
+  }
+}
+async function estimateCurrentCartTotalsOrNull(cartClient) {
+  try {
+    const response = await cartClient.estimateCurrentCartTotals({});
+    return response ?? null;
+  } catch (error) {
+    if (isCartNotFoundError(error)) {
+      return null;
+    }
+    throw error;
+  }
+}
+function mapEstimateTotalsToState(estimate) {
+  if (!estimate?.cart) {
+    return getEmptyCartState();
+  }
+  const cart = estimate.cart;
+  const lineItems = (cart.lineItems || []).map(mapLineItem);
+  const appliedCoupon = cart.appliedDiscounts?.find((d) => d.coupon?.code)?.coupon?.code || "";
+  const itemCount = lineItems.reduce((sum, item) => sum + item.quantity, 0);
+  const priceSummary = estimate.priceSummary;
+  const taxSummary = estimate.taxSummary;
+  const discountAmount = parseFloat(priceSummary?.discount?.amount || "0");
+  const hasTax = parseFloat(taxSummary?.totalTax?.amount || "0") > 0;
+  return {
+    cartId: cart._id || "",
+    isEmpty: lineItems.length === 0,
+    lineItems,
+    summary: {
+      itemCount,
+      subtotal: {
+        amount: priceSummary?.subtotal?.amount || "0",
+        formattedAmount: priceSummary?.subtotal?.formattedAmount || "$0.00"
+      },
+      discount: {
+        amount: discountAmount.toString(),
+        formattedAmount: priceSummary?.discount?.formattedAmount || ""
+      },
+      hasDiscount: discountAmount > 0,
+      estimatedTax: {
+        amount: taxSummary?.totalTax?.amount || "0",
+        formattedAmount: taxSummary?.totalTax?.formattedAmount || ""
+      },
+      showTax: hasTax,
+      estimatedTotal: {
+        amount: priceSummary?.total?.amount || priceSummary?.subtotal?.amount || "0",
+        formattedAmount: priceSummary?.total?.formattedAmount || priceSummary?.subtotal?.formattedAmount || "$0.00"
+      },
+      currency: cart.currency || "USD"
+    },
+    appliedCoupon,
+    hasAppliedCoupon: !!appliedCoupon
+  };
+}
+const WIX_STORES_APP_ID = "215238eb-22a5-4c36-9e7b-e7c08025e04e";
+const WIX_CART_CONTEXT = createJayContext();
+function provideWixCartContext() {
+  const wixClientContext = useGlobalContext(WIX_CLIENT_CONTEXT);
+  const wixClient = wixClientContext.client;
+  const cartClient = getCurrentCartClient(wixClient);
+  const cartContext = registerReactiveGlobalContext(WIX_CART_CONTEXT, () => {
+    const [itemCount, setItemCount] = createSignal(0);
+    const [hasItems, setHasItems] = createSignal(false);
+    const reactive = useReactive();
+    function updateIndicatorFromCart(cart) {
+      const indicator = mapCartToIndicator(cart);
+      reactive.batchReactions(() => {
+        setItemCount(indicator.itemCount);
+        setHasItems(indicator.hasItems);
+      });
+    }
+    async function refreshCartIndicator() {
+      const cart = await getCurrentCartOrNull(cartClient);
+      updateIndicatorFromCart(cart);
+    }
+    async function getEstimatedCart() {
+      const estimate = await estimateCurrentCartTotalsOrNull(cartClient);
+      return mapEstimateTotalsToState(estimate);
+    }
+    async function addToCart(productId, quantity = 1, options) {
+      console.log(`[WixCart] Adding to cart: ${productId} x ${quantity}`, options);
+      const lineItem = {
+        catalogReference: {
+          catalogItemId: productId,
+          appId: WIX_STORES_APP_ID,
+          options: {
+            variantId: options?.variantId,
+            options: options?.modifiers,
+            customTextFields: options?.customTextFields
+          }
+        },
+        quantity
+      };
+      const result = await cartClient.addToCurrentCart({
+        lineItems: [lineItem]
+      });
+      updateIndicatorFromCart(result.cart ?? null);
+      return { cartState: mapCartToState(result.cart ?? null) };
+    }
+    async function removeLineItems(lineItemIds) {
+      const result = await cartClient.removeLineItemsFromCurrentCart(lineItemIds);
+      updateIndicatorFromCart(result.cart ?? null);
+      return { cartState: mapCartToState(result.cart ?? null) };
+    }
+    async function updateLineItemQuantity(lineItemId, quantity) {
+      let result;
+      if (quantity === 0) {
+        result = await cartClient.removeLineItemsFromCurrentCart([lineItemId]);
+      } else {
+        result = await cartClient.updateCurrentCartLineItemQuantity([
+          { _id: lineItemId, quantity }
+        ]);
+      }
+      updateIndicatorFromCart(result.cart ?? null);
+      return { cartState: mapCartToState(result.cart ?? null) };
+    }
+    async function clearCart() {
+      const cart = await getCurrentCartOrNull(cartClient);
+      if (cart?.lineItems?.length) {
+        const lineItemIds = cart.lineItems.map((item) => item._id || "").filter(Boolean);
+        if (lineItemIds.length > 0) {
+          await cartClient.removeLineItemsFromCurrentCart(lineItemIds);
+        }
+      }
+      setItemCount(0);
+      setHasItems(false);
+    }
+    async function applyCoupon(couponCode) {
+      const result = await cartClient.updateCurrentCart({ couponCode });
+      updateIndicatorFromCart(result ?? null);
+      return { cartState: mapCartToState(result ?? null) };
+    }
+    async function removeCoupon() {
+      const result = await cartClient.removeCouponFromCurrentCart();
+      updateIndicatorFromCart(result.cart ?? null);
+      return { cartState: mapCartToState(result.cart ?? null) };
+    }
+    return {
+      cartIndicator: {
+        itemCount,
+        hasItems
+      },
+      refreshCartIndicator,
+      getEstimatedCart,
+      addToCart,
+      removeLineItems,
+      updateLineItemQuantity,
+      clearCart,
+      applyCoupon,
+      removeCoupon
+    };
+  });
+  console.log("[wix-cart] Client cart context initialized (reactive)");
+  return cartContext;
+}
+async function renderFastChanging$1(_props, _wixCart) {
+  const Pipeline = RenderPipeline.for();
+  return Pipeline.ok(null).toPhaseOutput(() => ({
+    viewState: {
+      itemCount: 0,
+      hasItems: false,
+      isLoading: true,
+      justAdded: false
+    },
+    carryForward: {}
+  }));
+}
+const cartIndicator = makeJayStackComponent().withProps().withServices(WIX_CART_SERVICE).withFastRender(renderFastChanging$1);
+function createEmptyCartViewState() {
+  return {
+    isEmpty: true,
+    isLoading: true,
+    isCheckingOut: false,
+    lineItems: [],
+    summary: {
+      itemCount: 0,
+      subtotal: { amount: "0", formattedAmount: "$0.00" },
+      discount: { amount: "0", formattedAmount: "" },
+      hasDiscount: false,
+      estimatedTax: { amount: "0", formattedAmount: "" },
+      showTax: false,
+      estimatedTotal: { amount: "0", formattedAmount: "$0.00" },
+      currency: "USD"
+    },
+    coupon: {
+      code: "",
+      isApplying: false,
+      appliedCode: "",
+      hasAppliedCoupon: false,
+      errorMessage: "",
+      hasError: false
+    }
+  };
+}
+async function renderSlowlyChanging(_props, _wixCart) {
+  const Pipeline = RenderPipeline.for();
+  return Pipeline.ok(null).toPhaseOutput(() => ({
+    viewState: {
+      cartId: "",
+      emptyCartMessage: "Your cart is empty"
+    },
+    carryForward: {}
+  }));
+}
+async function renderFastChanging(_props, _slowCarryForward, _wixCart) {
+  const Pipeline = RenderPipeline.for();
+  return Pipeline.ok(null).toPhaseOutput(() => ({
+    viewState: createEmptyCartViewState(),
+    carryForward: {}
+  }));
+}
+const cartPage = makeJayStackComponent().withProps().withServices(WIX_CART_SERVICE).withSlowlyRender(renderSlowlyChanging).withFastRender(renderFastChanging);
+const init = makeJayInit().withServer(async () => {
+  console.log("[wix-cart] Initializing Wix Cart service...");
+  const wixClient = getService(WIX_CLIENT_SERVICE);
+  provideWixCartService(wixClient);
+  console.log("[wix-cart] Server initialization complete");
+  return {
+    enableClientCart: true
+  };
+});
+export {
+  WIX_CART_CONTEXT,
+  WIX_CART_SERVICE,
+  cartIndicator,
+  cartPage,
+  estimateCurrentCartTotalsOrNull,
+  getCurrentCartClient,
+  getCurrentCartOrNull,
+  getEmptyCartState,
+  init,
+  mapCartSummary,
+  mapCartToIndicator,
+  mapCartToState,
+  mapEstimateTotalsToState,
+  mapLineItem,
+  provideWixCartContext,
+  provideWixCartService
+};

package/package.json

@@ -0,0 +1,66 @@
+{
+  "name": "@jay-framework/wix-cart",
+  "version": "0.15.0",
+  "type": "module",
+  "description": "Wix Cart/Ecom shared package for Jay Framework",
+  "license": "Apache-2.0",
+  "main": "dist/index.js",
+  "files": [
+    "dist",
+    "plugin.yaml"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./client": {
+      "types": "./dist/index.client.d.ts",
+      "default": "./dist/index.client.js"
+    },
+    "./plugin.yaml": "./plugin.yaml",
+    "./cart-indicator.jay-contract": "./dist/contracts/cart-indicator.jay-contract",
+    "./cart-page.jay-contract": "./dist/contracts/cart-page.jay-contract"
+  },
+  "scripts": {
+    "build": "npm run clean && npm run definitions && npm run build:client && npm run build:server && npm run build:copy-contract && npm run build:types",
+    "definitions": "jay-cli definitions lib",
+    "build:client": "vite build",
+    "build:server": "vite build --ssr",
+    "build:copy-contract": "mkdir -p dist/contracts && cp lib/contracts/*.jay-contract* dist/contracts/",
+    "build:types": "tsup lib/index.ts lib/index.client.ts --dts-only --format esm",
+    "build:check-types": "tsc",
+    "clean": "rimraf dist",
+    "confirm": "npm run clean && npm run build && npm run test",
+    "test": ":"
+  },
+  "dependencies": {
+    "@jay-framework/component": "^0.14.0",
+    "@jay-framework/fullstack-component": "^0.14.0",
+    "@jay-framework/reactive": "^0.14.0",
+    "@jay-framework/runtime": "^0.14.0",
+    "@jay-framework/secure": "^0.14.0",
+    "@jay-framework/stack-client-runtime": "^0.14.0",
+    "@jay-framework/stack-server-runtime": "^0.14.0",
+    "@jay-framework/wix-server-client": "^0.15.0",
+    "@jay-framework/wix-utils": "^0.15.0",
+    "@wix/ecom": "^1.0.1978",
+    "@wix/sdk": "^1.21.5"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.23.7",
+    "@babel/preset-env": "^7.23.8",
+    "@babel/preset-typescript": "^7.23.3",
+    "@jay-framework/compiler-jay-stack": "^0.14.0",
+    "@jay-framework/jay-cli": "^0.14.0",
+    "@jay-framework/vite-plugin": "^0.14.0",
+    "@jay-framework/wix-dev-environment": "^0.6.10",
+    "nodemon": "^3.0.3",
+    "rimraf": "^5.0.5",
+    "tslib": "^2.6.2",
+    "tsup": "^8.5.1",
+    "typescript": "^5.3.3",
+    "vite": "^5.0.11",
+    "vitest": "^1.2.0"
+  }
+}

package/plugin.yaml

@@ -0,0 +1,14 @@
+name: wix-cart
+# Shared Wix Cart/Ecom package for Jay Framework
+
+contracts:
+  - name: cart-indicator
+    contract: cart-indicator.jay-contract
+    component: cartIndicator
+    description: Lightweight cart indicator for site headers showing item count
+  - name: cart-page
+    contract: cart-page.jay-contract
+    component: cartPage
+    description: Full cart page with line item management and checkout
+
+# Plugin initialization uses makeJayInit pattern in lib/init.ts