@uptrademedia/site-kit 1.0.34 → 1.0.36

package/dist/{chunk-7BEMFSF6.js → chunk-WTMMXY7S.js}

@@ -254,6 +254,24 @@ async function registerForEvent(eventId, scheduleId, customer) {
     return { success: false, error: "Network error. Please try again." };
   }
 }
+async function fetchProcessorConfig() {
+  const { apiUrl, apiKey } = getApiConfig();
+  if (!apiKey) return null;
+  try {
+    const response = await fetch(`${apiUrl}/api/public/commerce/processor-config`, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        "x-api-key": apiKey
+      },
+      body: JSON.stringify({})
+    });
+    if (!response.ok) return null;
+    return await response.json();
+  } catch {
+    return null;
+  }
+}
 async function createCheckoutSession(optionsOrOfferingId, legacyOptions) {
   const { apiUrl, apiKey } = getApiConfig();
   const options = typeof optionsOrOfferingId === "string" ? { offeringId: optionsOrOfferingId, ...legacyOptions } : optionsOrOfferingId;
@@ -274,8 +292,12 @@ async function createCheckoutSession(optionsOrOfferingId, legacyOptions) {
       })
     });
     if (!response.ok) {
-      const error = await response.json();
-      return { success: false, error: error.message || "Checkout failed" };
+      const error = await response.json().catch(() => ({}));
+      const message = error?.message || (typeof error?.error === "string" ? error.error : null) || "Checkout failed";
+      if (typeof console !== "undefined" && console.error) {
+        console.error("[Commerce] Checkout failed:", response.status, message, error);
+      }
+      return { success: false, error: message };
     }
     const result = await response.json();
     return {
@@ -2811,6 +2833,17 @@ function CalendarView({
     }, children: "Loading..." })
   ] });
 }
+function loadSquareSDK(environment) {
+  return new Promise((resolve, reject) => {
+    if (typeof window === "undefined") return reject(new Error("No window"));
+    if (window.Square) return resolve();
+    const script = document.createElement("script");
+    script.src = environment === "sandbox" ? "https://sandbox.web.squarecdn.com/v1/square.js" : "https://web.squarecdn.com/v1/square.js";
+    script.onload = () => resolve();
+    script.onerror = () => reject(new Error("Failed to load Square SDK"));
+    document.head.appendChild(script);
+  });
+}
 function EventModal({
   event,
   schedule: propSchedule,
@@ -2834,7 +2867,56 @@ function EventModal({
     phone: ""
   });
   const [additionalData, setAdditionalData] = React5.useState({});
+  const [processor, setProcessor] = React5.useState(null);
+  const [processorConfig, setProcessorConfig] = React5.useState(null);
+  const [squareCard, setSquareCard] = React5.useState(null);
+  const [cardReady, setCardReady] = React5.useState(false);
+  const cardContainerRef = React5.useRef(null);
   const schedule = propSchedule || event?.schedules?.[0] || event?.next_schedule;
+  React5.useEffect(() => {
+    if (!isOpen) return;
+    fetchProcessorConfig().then(async (config) => {
+      setProcessorConfig(config);
+      if (config?.processor) setProcessor(config.processor);
+      if (config?.processor === "square" && config.squareAppId && config.squareLocationId) {
+        try {
+          await loadSquareSDK(config.squareEnvironment || "production");
+          const Square = window.Square;
+          const payments = Square.payments(config.squareAppId, config.squareLocationId);
+          const card = await payments.card({
+            style: {
+              ".input-container": {
+                borderColor: "#d1d5db",
+                borderRadius: "6px"
+              },
+              ".input-container.is-focus": {
+                borderColor: "#2563eb"
+              },
+              ".input-container.is-error": {
+                borderColor: "#dc2626"
+              }
+            }
+          });
+          await card.attach("#sq-card-container");
+          setSquareCard(card);
+          setCardReady(true);
+        } catch (err) {
+          console.error("[Commerce] Square card init failed:", err);
+        }
+      }
+    });
+    return () => {
+      setSquareCard((prev) => {
+        if (prev) {
+          prev.destroy?.().catch(() => {
+          });
+        }
+        return null;
+      });
+      setCardReady(false);
+      setProcessorConfig(null);
+    };
+  }, [isOpen]);
   React5.useEffect(() => {
     if (isOpen && event) {
       setError(null);
@@ -2895,17 +2977,34 @@ function EventModal({
           onError?.(result.error || "Registration failed");
         }
       } else {
-        const result = await createCheckoutSession(event.id, {
+        let sourceId;
+        if (squareCard && cardReady) {
+          const tokenResult = await squareCard.tokenize();
+          if (tokenResult.status !== "OK") {
+            const msg = tokenResult.errors?.[0]?.message || "Card verification failed. Please check your card details.";
+            setError(msg);
+            onError?.(msg);
+            setLoading(false);
+            return;
+          }
+          sourceId = tokenResult.token;
+        }
+        const result = await createCheckoutSession({
+          offeringId: event.id,
           scheduleId: schedule.id,
           quantity,
           customer: {
             ...customer,
             ...additionalData
           },
+          sourceId,
           successUrl: window.location.href + "?registration=success",
           cancelUrl: window.location.href
         });
-        if (result.success && result.payment_url) {
+        if (result.success && !result.payment_url) {
+          setSuccess(true);
+          onSuccess?.(result);
+        } else if (result.success && result.payment_url) {
           window.location.href = result.payment_url;
         } else {
           setError(result.error || "Checkout failed");
@@ -3229,6 +3328,30 @@ function EventModal({
                     )
                   ] }, field.name))
                 ] }),
+                !isFree && processor === "square" && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginTop: "1rem" }, children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("label", { style: {
+                    display: "block",
+                    fontSize: "0.875rem",
+                    fontWeight: 500,
+                    color: "#374151",
+                    marginBottom: "0.375rem"
+                  }, children: "Card Details *" }),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "div",
+                    {
+                      id: "sq-card-container",
+                      ref: cardContainerRef,
+                      style: {
+                        minHeight: "42px",
+                        border: "1px solid #d1d5db",
+                        borderRadius: "6px",
+                        padding: "0.5rem 0.75rem",
+                        background: "#fff"
+                      }
+                    }
+                  ),
+                  !cardReady && /* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: "0.75rem", color: "#9ca3af", marginTop: "0.25rem" }, children: "Loading card form..." })
+                ] }),
                 error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
                   marginTop: "1rem",
                   padding: "0.75rem",
@@ -3242,7 +3365,7 @@ function EventModal({
                   "button",
                   {
                     type: "submit",
-                    disabled: loading,
+                    disabled: loading || !isFree && processor === "square" && !cardReady,
                     style: {
                       width: "100%",
                       marginTop: "1.25rem",
@@ -3251,19 +3374,26 @@ function EventModal({
                       fontWeight: 600,
                       borderRadius: "8px",
                       border: "none",
-                      background: loading ? "#93c5fd" : "#2563eb",
+                      background: loading || !isFree && processor === "square" && !cardReady ? "#93c5fd" : "#2563eb",
                       color: "white",
-                      cursor: loading ? "not-allowed" : "pointer"
+                      cursor: loading || !isFree && processor === "square" && !cardReady ? "not-allowed" : "pointer"
                     },
                     children: loading ? "Processing..." : isFree ? "Register Free" : `Pay ${formatPrice(total, event.currency)}`
                   }
                 ),
-                !isFree && /* @__PURE__ */ jsxRuntime.jsx("p", { style: {
+                !isFree && /* @__PURE__ */ jsxRuntime.jsxs("p", { style: {
                   textAlign: "center",
                   fontSize: "0.75rem",
                   color: "#666",
                   margin: "0.75rem 0 0"
-                }, children: "\u{1F512} Secure checkout via Stripe" })
+                }, children: [
+                  "\u{1F512} Secure checkout via ",
+                  processor === "square" ? "Square" : processor === "stripe" ? "Stripe" : "secure payment"
+                ] }),
+                !isFree && processor && /* @__PURE__ */ jsxRuntime.jsxs("p", { style: { fontSize: "0.625rem", color: "#999", margin: "0.25rem 0 0", textAlign: "center" }, children: [
+                  "Powered by ",
+                  processor === "stripe" ? "Stripe" : "Square"
+                ] })
               ] })
             ] }) })
           ]
@@ -3922,6 +4052,7 @@ exports.fetchLatestOffering = fetchLatestOffering;
 exports.fetchNextEvent = fetchNextEvent;
 exports.fetchOffering = fetchOffering;
 exports.fetchOfferings = fetchOfferings;
+exports.fetchProcessorConfig = fetchProcessorConfig;
 exports.fetchProductBySlug = fetchProductBySlug;
 exports.fetchProducts = fetchProducts;
 exports.fetchProductsPublic = fetchProductsPublic;
@@ -3938,5 +4069,5 @@ exports.getSpotsRemaining = getSpotsRemaining;
 exports.isEventSoldOut = isEventSoldOut;
 exports.registerForEvent = registerForEvent;
 exports.useEventModal = useEventModal;
-//# sourceMappingURL=chunk-7BEMFSF6.js.map
-//# sourceMappingURL=chunk-7BEMFSF6.js.map
+//# sourceMappingURL=chunk-WTMMXY7S.js.map
+//# sourceMappingURL=chunk-WTMMXY7S.js.map