@open-mercato/checkout 0.6.7-develop.6862.1.c11a64ce0a → 0.6.7

package/dist/modules/checkout/components/PayPage.js

@@ -1,9 +1,9 @@
 "use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { extensionPoints } from "@open-mercato/checkout/modules/checkout/extension-points";
 import Link from "next/link";
 import { useParams, useRouter, useSearchParams } from "next/navigation";
+import { ComponentReplacementHandles } from "@open-mercato/shared/modules/widgets/component-registry";
 import { useLocale, useT } from "@open-mercato/shared/lib/i18n/context";
 import { locales } from "@open-mercato/shared/lib/i18n/config";
 import { resolveLocaleFromCandidates } from "@open-mercato/shared/lib/i18n/locale";
@@ -36,17 +36,17 @@ import {
 } from "../lib/customerDataValidation.js";
 import { createLogger } from "@open-mercato/shared/lib/logger";
 const logger = createLogger("checkout").child({ component: "PayPage" });
-const PAGE_HANDLE = extensionPoints.hosts.payPage.componentId;
-const HEADER_HANDLE = extensionPoints.hosts.header.componentId;
-const DESCRIPTION_HANDLE = extensionPoints.hosts.description.componentId;
-const SUMMARY_HANDLE = extensionPoints.hosts.summary.componentId;
-const PRICING_HANDLE = extensionPoints.hosts.pricing.componentId;
-const PAYMENT_HANDLE = extensionPoints.hosts.payment.componentId;
-const CUSTOMER_FORM_HANDLE = extensionPoints.hosts.customerForm.componentId;
-const LEGAL_CONSENT_HANDLE = extensionPoints.hosts.legalConsent.componentId;
-const GATEWAY_FORM_HANDLE = extensionPoints.hosts.gatewayForm.componentId;
-const HELP_HANDLE = extensionPoints.hosts.help.componentId;
-const FOOTER_HANDLE = extensionPoints.hosts.footer.componentId;
+const PAGE_HANDLE = ComponentReplacementHandles.page("checkout.pay-page");
+const HEADER_HANDLE = ComponentReplacementHandles.section("checkout.pay-page", "header");
+const DESCRIPTION_HANDLE = ComponentReplacementHandles.section("checkout.pay-page", "description");
+const SUMMARY_HANDLE = ComponentReplacementHandles.section("checkout.pay-page", "summary");
+const PRICING_HANDLE = ComponentReplacementHandles.section("checkout.pay-page", "pricing");
+const PAYMENT_HANDLE = ComponentReplacementHandles.section("checkout.pay-page", "payment");
+const CUSTOMER_FORM_HANDLE = ComponentReplacementHandles.section("checkout.pay-page", "customer-form");
+const LEGAL_CONSENT_HANDLE = ComponentReplacementHandles.section("checkout.pay-page", "legal-consent");
+const GATEWAY_FORM_HANDLE = ComponentReplacementHandles.section("checkout.pay-page", "gateway-form");
+const HELP_HANDLE = ComponentReplacementHandles.section("checkout.pay-page", "help");
+const FOOTER_HANDLE = ComponentReplacementHandles.section("checkout.pay-page", "footer");
 const CHECKOUT_THEME_FALLBACKS = {
   accent: "#1E3A8A",
   accentSecondary: "#F59E0B",
@@ -855,9 +855,9 @@ function PayPagePaymentForm({
   const embeddedPaymentSession = paymentSession?.type === "embedded" ? paymentSession : null;
   return /* @__PURE__ */ jsxs("section", { className: "space-y-4", children: [
     submissionError ? /* @__PURE__ */ jsx(Alert, { status: "error", style: "lighter", size: "default", children: /* @__PURE__ */ jsx(AlertDescription, { children: submissionError }) }) : null,
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.gatewayWidgetBefore.spotId, context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:gateway-widget:before", context: injectionContext }),
     embeddedPaymentSession && embeddedRenderer ? /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.gatewayRendererBefore.spotId, context: injectionContext }),
+      /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:gateway-widget:renderer:before", context: injectionContext }),
       React.createElement(embeddedRenderer, {
         providerKey: embeddedPaymentSession.providerKey ?? "",
         transactionId: activeTransactionId ?? "",
@@ -867,9 +867,9 @@ function PayPagePaymentForm({
         onComplete,
         onError
       }),
-      /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.gatewayRendererAfter.spotId, context: injectionContext })
+      /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:gateway-widget:renderer:after", context: injectionContext })
     ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.gatewayActionsBefore.spotId, context: injectionContext }),
+      /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:gateway-widget:actions:before", context: injectionContext }),
       /* @__PURE__ */ jsx(
         Button,
         {
@@ -886,9 +886,9 @@ function PayPagePaymentForm({
           ] })
         }
       ),
-      /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.gatewayActionsAfter.spotId, context: injectionContext })
+      /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:gateway-widget:actions:after", context: injectionContext })
     ] }),
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.gatewayWidgetAfter.spotId, context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:gateway-widget:after", context: injectionContext }),
     paymentSession ? /* @__PURE__ */ jsx(
       Button,
       {
@@ -971,8 +971,7 @@ function PayPageFooter({ payload, themeTokens }) {
     en: t("common.languages.english", "English"),
     pl: t("common.languages.polish", "Polski"),
     es: t("common.languages.spanish", "Espa\xF1ol"),
-    de: t("common.languages.german", "Deutsch"),
-    ko: t("common.languages.korean", "\uD55C\uAD6D\uC5B4")
+    de: t("common.languages.german", "Deutsch")
   }), [t]);
   const setLocale = React.useCallback(async (nextLocale) => {
     if (nextLocale === locale) return;
@@ -1644,9 +1643,9 @@ function PayPage({
   }
   if (!injectionContext) return null;
   const leftColumn = /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.headerBefore.spotId, context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:header:before", context: injectionContext }),
     /* @__PURE__ */ jsx("div", { "data-component-handle": HEADER_HANDLE, children: /* @__PURE__ */ jsx(HeaderComponent, { payload, preview: isPreview, themeTokens }) }),
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.headerAfter.spotId, context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:header:after", context: injectionContext }),
     payload.description || publicCustomFields.length > 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx("div", { "data-component-handle": DESCRIPTION_HANDLE, children: /* @__PURE__ */ jsx(
         DescriptionComponent,
@@ -1656,9 +1655,9 @@ function PayPage({
           themeTokens
         }
       ) }),
-      /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.descriptionAfter.spotId, context: injectionContext })
+      /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:description:after", context: injectionContext })
     ] }) : null,
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.customerFieldsBefore.spotId, context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:customer-fields:before", context: injectionContext }),
     shouldCollectCustomerDetails ? /* @__PURE__ */ jsx("div", { "data-component-handle": CUSTOMER_FORM_HANDLE, children: /* @__PURE__ */ jsx(
       CustomerFormComponent,
       {
@@ -1671,10 +1670,10 @@ function PayPage({
         themeTokens
       }
     ) }) : null,
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.customerFieldsAfter.spotId, context: injectionContext })
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:customer-fields:after", context: injectionContext })
   ] });
   const paymentFlow = /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.pricingBefore.spotId, context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:pricing:before", context: injectionContext }),
     /* @__PURE__ */ jsx("div", { "data-component-handle": PRICING_HANDLE, children: /* @__PURE__ */ jsx(
       PricingComponent,
       {
@@ -1707,8 +1706,8 @@ function PayPage({
         themeTokens
       }
     ) }),
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.pricingAfter.spotId, context: injectionContext }),
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.summaryBefore.spotId, context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:pricing:after", context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:summary:before", context: injectionContext }),
     /* @__PURE__ */ jsx("div", { "data-component-handle": SUMMARY_HANDLE, children: /* @__PURE__ */ jsx(
       SummaryComponent,
       {
@@ -1720,8 +1719,8 @@ function PayPage({
         themeTokens
       }
     ) }),
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.summaryAfter.spotId, context: injectionContext }),
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.legalConsentBefore.spotId, context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:summary:after", context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:legal-consent:before", context: injectionContext }),
     /* @__PURE__ */ jsx("div", { "data-component-handle": LEGAL_CONSENT_HANDLE, children: /* @__PURE__ */ jsx(
       LegalConsentComponent,
       {
@@ -1734,8 +1733,8 @@ function PayPage({
         themeTokens
       }
     ) }),
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.legalConsentAfter.spotId, context: injectionContext }),
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.submitBefore.spotId, context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:legal-consent:after", context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:submit:before", context: injectionContext }),
     /* @__PURE__ */ jsx("div", { "data-component-handle": GATEWAY_FORM_HANDLE, children: /* @__PURE__ */ jsx(
       PaymentFormComponent,
       {
@@ -1764,20 +1763,20 @@ function PayPage({
         themeTokens
       }
     ) }),
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.submitAfter.spotId, context: injectionContext }),
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.helpBefore.spotId, context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:submit:after", context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:help:before", context: injectionContext }),
     /* @__PURE__ */ jsx("div", { "data-component-handle": HELP_HANDLE, children: /* @__PURE__ */ jsx(HelpComponent, { payload, preview: isPreview, themeTokens }) }),
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.helpAfter.spotId, context: injectionContext })
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:help:after", context: injectionContext })
   ] });
   const rightColumn = /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.paymentBefore.spotId, context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:payment:before", context: injectionContext }),
     /* @__PURE__ */ jsx("div", { "data-component-handle": PAYMENT_HANDLE, children: /* @__PURE__ */ jsx(PaymentSectionComponent, { payload, preview: isPreview, themeTokens, children: paymentFlow }) }),
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.paymentAfter.spotId, context: injectionContext })
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:payment:after", context: injectionContext })
   ] });
   const footer = /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.footerBefore.spotId, context: injectionContext }),
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:footer:before", context: injectionContext }),
     /* @__PURE__ */ jsx("div", { "data-component-handle": FOOTER_HANDLE, children: /* @__PURE__ */ jsx(FooterComponent, { payload, themeTokens }) }),
-    /* @__PURE__ */ jsx(InjectionSpot, { spotId: extensionPoints.hosts.footerAfter.spotId, context: injectionContext })
+    /* @__PURE__ */ jsx(InjectionSpot, { spotId: "checkout.pay-page:footer:after", context: injectionContext })
   ] });
   return /* @__PURE__ */ jsx("div", { "data-component-handle": PAGE_HANDLE, children: /* @__PURE__ */ jsx(
     SurfaceComponent,