@kotao/storefront 0.2.1 → 0.2.3

package/dist/createCartHandler-C4RrPwSG.d.ts

@@ -0,0 +1,58 @@
+import { S as StorefrontClient } from './client-D51WdvYR.js';
+import { C as Cart, a as CartLineInput, b as CartAttribute, c as CartBuyerIdentityInput, d as CartMutationResult, e as CartLineUpdateInput, f as CartMetafield, g as CartMetafieldIdentifier, h as CartDeliveryAddress, i as CartSelectedDeliveryOption, j as CartFormAction } from './types-bcbQzx87.js';
+
+interface CartCreateInput {
+    readonly lines?: readonly CartLineInput[];
+    readonly note?: string | null;
+    readonly attributes?: readonly CartAttribute[];
+    readonly buyerIdentity?: CartBuyerIdentityInput;
+}
+interface CartDispatchAction {
+    readonly action: CartFormAction;
+    readonly inputs: Record<string, unknown>;
+}
+interface CartHandler {
+    get(): Promise<Cart | null>;
+    getCart(): Promise<Cart | null>;
+    create(input?: CartCreateInput): Promise<CartMutationResult>;
+    addLines(lines: readonly CartLineInput[]): Promise<CartMutationResult>;
+    updateLines(lines: readonly CartLineUpdateInput[]): Promise<CartMutationResult>;
+    removeLines(lineIds: readonly string[]): Promise<CartMutationResult>;
+    updateBuyerIdentity(buyerIdentity: CartBuyerIdentityInput): Promise<CartMutationResult>;
+    updateDiscountCodes(discountCodes: readonly string[]): Promise<CartMutationResult>;
+    setCartId(cartId: string): Headers;
+    cartCreate(input?: CartCreateInput): Promise<CartMutationResult>;
+    linesAdd(lines: readonly CartLineInput[]): Promise<CartMutationResult>;
+    linesUpdate(lines: readonly CartLineUpdateInput[]): Promise<CartMutationResult>;
+    linesRemove(lineIds: readonly string[]): Promise<CartMutationResult>;
+    buyerIdentityUpdate(buyerIdentity: CartBuyerIdentityInput): Promise<CartMutationResult>;
+    discountCodesUpdate(discountCodes: readonly string[]): Promise<CartMutationResult>;
+    giftCardCodesAdd(giftCardCodes: readonly string[]): Promise<CartMutationResult>;
+    giftCardCodesRemove(giftCardCodes: readonly string[]): Promise<CartMutationResult>;
+    noteUpdate(note: string | null): Promise<CartMutationResult>;
+    attributesUpdate(attributes: readonly CartAttribute[]): Promise<CartMutationResult>;
+    metafieldsSet(metafields: readonly CartMetafield[]): Promise<CartMutationResult>;
+    metafieldsDelete(metafields: readonly CartMetafieldIdentifier[]): Promise<CartMutationResult>;
+    deliveryAddressesReplace(addresses: readonly CartDeliveryAddress[]): Promise<CartMutationResult>;
+    selectedDeliveryOptionsUpdate(selectedDeliveryOptions: readonly CartSelectedDeliveryOption[]): Promise<CartMutationResult>;
+    dispatch(action: CartDispatchAction): Promise<CartMutationResult>;
+}
+type MaybePromise<T> = T | Promise<T>;
+type CartGetId = () => MaybePromise<string | null | undefined>;
+type CartSetId = (cartId: string) => MaybePromise<string | Headers | null | undefined | void>;
+interface RequestCartHandlerOptions {
+    request: Request;
+    storefront: StorefrontClient;
+}
+interface HydrogenCartHandlerOptions {
+    storefront: StorefrontClient;
+    customerAccount?: unknown;
+    getCartId: CartGetId;
+    setCartId: CartSetId;
+}
+type CreateCartHandlerOptions = RequestCartHandlerOptions | HydrogenCartHandlerOptions;
+declare function cartGetIdDefault(headers: Headers): CartGetId;
+declare function cartSetIdDefault(): CartSetId;
+declare function createCartHandler(opts: CreateCartHandlerOptions): CartHandler;
+
+export { type CartHandler as C, type HydrogenCartHandlerOptions as H, type RequestCartHandlerOptions as R, type CartDispatchAction as a, type CartGetId as b, type CartSetId as c, type CreateCartHandlerOptions as d, cartGetIdDefault as e, cartSetIdDefault as f, createCartHandler as g };

package/dist/editor.d.ts

@@ -1,4 +1,4 @@
-import { c as ThemeSettingsStore, b as ResolvedSettings, a as ResolvedSection, R as ResolvedBlock } from './store-DQK1nhob.js';
+import { T as ThemeSettingsStore, R as ResolvedSettings, c as ResolvedSection, b as ResolvedBlock } from './store-CtCWHI8H.js';
 
 interface StorefrontEditorMessageTarget {
     postMessage(message: unknown, targetOrigin: string): void;

package/dist/events-react.d.ts

@@ -0,0 +1,68 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+import { O as OfferTokenLocation, a as OfferTokenHistory } from './offer-token-C-nk_nj8.js';
+import { E as EventsClient, a as EventCheckoutSession, b as EventApprovalOfferResolution, P as PublicEvent, c as EventRegistrationSubmission } from './client-bsiNPHBi.js';
+import './types-CSNXbGFW.js';
+import './http-types-CGh8WGHB.js';
+
+type EventRegistrationState = 'idle' | 'submitting' | 'awaiting_approval' | 'waitlisted' | 'checkout_ready' | 'request_error';
+declare function useEventRegistration(input: {
+    readonly client: EventsClient;
+    readonly onCheckoutSession?: (session: EventCheckoutSession) => void;
+}): {
+    readonly state: EventRegistrationState;
+    readonly submit: (submission: EventRegistrationSubmission) => Promise<void>;
+    readonly reset: () => void;
+};
+interface EventRegistrationLabels {
+    readonly submit: string;
+    readonly submitting: string;
+    readonly awaiting_approval: string;
+    readonly waitlisted: string;
+    readonly checkout_ready: string;
+    readonly request_error: string;
+    readonly email: string;
+    readonly quantity: string;
+    readonly ticket: string;
+}
+interface EventRegistrationFormProps {
+    readonly event: PublicEvent;
+    readonly locale: string;
+    readonly client: EventsClient;
+    readonly cartToken?: string;
+    readonly fallbackLocale?: string;
+    readonly onCheckoutSession?: (session: EventCheckoutSession) => void;
+    readonly labels?: Partial<EventRegistrationLabels>;
+    readonly className?: string;
+}
+declare function EventRegistrationForm({ event, locale, client, cartToken, fallbackLocale, onCheckoutSession, labels, className, }: EventRegistrationFormProps): react.JSX.Element;
+type EventOfferState = 'resolving' | 'active' | 'claiming' | 'claimed' | 'expired' | 'unavailable' | 'request_error';
+interface EventApprovalOfferLabels {
+    readonly resolving: ReactNode;
+    readonly claim: ReactNode;
+    readonly resume: ReactNode;
+    readonly claiming: ReactNode;
+    readonly claimed: ReactNode;
+    readonly expired: ReactNode;
+    readonly unavailable: ReactNode;
+    readonly requestError: ReactNode;
+    readonly retry?: ReactNode;
+    readonly expires: ReactNode;
+}
+interface EventApprovalOfferProps {
+    readonly client: EventsClient;
+    readonly offerId: string;
+    readonly cartToken: string;
+    readonly locale: string;
+    readonly idempotencyKey?: string;
+    readonly location?: OfferTokenLocation;
+    readonly history?: OfferTokenHistory;
+    readonly labels?: Partial<EventApprovalOfferLabels>;
+    readonly onCheckoutSession?: (session: EventCheckoutSession) => void;
+    readonly initialResolution?: EventApprovalOfferResolution;
+    readonly initialState?: Exclude<EventOfferState, 'resolving' | 'active' | 'claiming'>;
+    readonly className?: string;
+}
+declare function EventApprovalOffer({ client, offerId, cartToken, locale, idempotencyKey, location, history, labels, onCheckoutSession, initialResolution, initialState, className, }: EventApprovalOfferProps): react.JSX.Element;
+
+export { EventApprovalOffer, type EventApprovalOfferLabels, type EventApprovalOfferProps, type EventOfferState, EventRegistrationForm, type EventRegistrationFormProps, type EventRegistrationLabels, type EventRegistrationState, useEventRegistration };

package/dist/events-react.js

@@ -0,0 +1,557 @@
+import { StorefrontFormFields } from './chunk-VV653S52.js';
+import { offerTokenHrefMarker, consumeOfferTokenFragment } from './chunk-WG7HYVHJ.js';
+import { StorefrontEventsRequestError } from './chunk-7MTCGXIG.js';
+import './chunk-IIOHENCG.js';
+import { useState, useRef, useEffect, useCallback, useId, useMemo, useLayoutEffect } from 'react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+function useEventRegistration(input) {
+  const [state, setState] = useState("idle");
+  const generation = useRef(0);
+  const logicalPayload = useRef(null);
+  const idempotencyKey = useRef(null);
+  const activeClient = useRef(input.client);
+  const activeCallback = useRef(input.onCheckoutSession);
+  useEffect(() => {
+    if (activeClient.current !== input.client || activeCallback.current !== input.onCheckoutSession) {
+      activeClient.current = input.client;
+      activeCallback.current = input.onCheckoutSession;
+      generation.current += 1;
+      setState("idle");
+    }
+  }, [input.client, input.onCheckoutSession]);
+  useEffect(
+    () => () => {
+      generation.current += 1;
+    },
+    []
+  );
+  const reset = useCallback(() => {
+    generation.current += 1;
+    setState("idle");
+  }, []);
+  async function submit(submission) {
+    const attempt = ++generation.current;
+    const prepared = registrationSubmission(submission, logicalPayload, idempotencyKey);
+    setState("submitting");
+    try {
+      const result = await input.client.submitRegistration(prepared);
+      if (attempt !== generation.current) return;
+      if (result.kind === "checkout") {
+        input.onCheckoutSession?.(result.checkoutSession);
+        setState("checkout_ready");
+      } else if (result.kind === "approval") {
+        setState("awaiting_approval");
+      } else {
+        setState("waitlisted");
+      }
+    } catch {
+      if (attempt !== generation.current) return;
+      setState("request_error");
+    }
+  }
+  return { state, submit, reset };
+}
+function registrationKey(mode) {
+  const kind = mode === "approval_then_payment" ? "application" : "checkout";
+  return `events-${kind}-${Date.now()}-${Math.random().toString(36).slice(2)}`;
+}
+function stablePayload(value) {
+  return JSON.stringify(value, (_key, item) => {
+    if (item === null || typeof item !== "object" || Array.isArray(item)) return item;
+    return Object.fromEntries(
+      Object.entries(item).sort(
+        ([left], [right]) => left.localeCompare(right)
+      )
+    );
+  });
+}
+function registrationSubmission(submission, previousPayload, previousKey) {
+  if (submission.registrationMode === "waitlist_only") return submission;
+  if (submission.idempotencyKey.trim() !== "") return submission;
+  const payload = {
+    registrationMode: submission.registrationMode,
+    handle: submission.handle,
+    input: submission.input
+  };
+  const identity = stablePayload(payload);
+  if (identity !== previousPayload.current || previousKey.current === null) {
+    previousPayload.current = identity;
+    previousKey.current = registrationKey(submission.registrationMode);
+  }
+  return { ...submission, idempotencyKey: previousKey.current };
+}
+function eventFormForRenderer(form) {
+  return {
+    definition: {
+      id: form.definitionId,
+      handle: form.definitionId,
+      title: form.title
+    },
+    version: {
+      id: form.versionId,
+      definitionId: form.definitionId,
+      schema: form.schema
+    }
+  };
+}
+var REGISTRATION_COPY = {
+  en: {
+    submit: "Register",
+    submitting: "Submitting\u2026",
+    awaiting_approval: "Application received. Awaiting approval.",
+    waitlisted: "You joined the waitlist.",
+    checkout_ready: "Registration ready for checkout.",
+    request_error: "Something went wrong. Please try again.",
+    email: "Email",
+    quantity: "Quantity",
+    ticket: "Ticket"
+  },
+  de: {
+    submit: "Anmelden",
+    submitting: "Wird gesendet\u2026",
+    awaiting_approval: "Anmeldung erhalten. Sie wartet auf Freigabe.",
+    waitlisted: "Du stehst auf der Warteliste.",
+    checkout_ready: "Die Anmeldung kann bezahlt werden.",
+    request_error: "Etwas ist schiefgelaufen. Bitte versuche es erneut.",
+    email: "E-Mail",
+    quantity: "Anzahl",
+    ticket: "Ticket"
+  }
+};
+function registrationCopy(locale) {
+  return locale.toLowerCase().startsWith("de") ? REGISTRATION_COPY.de : REGISTRATION_COPY.en;
+}
+function selectable(ticket) {
+  return ticket.salesState === "on_sale" && ticket.maxPerOrder >= ticket.minPerOrder && (ticket.available === null || ticket.available >= ticket.minPerOrder);
+}
+function EventRegistrationForm({
+  event,
+  locale,
+  client,
+  cartToken,
+  fallbackLocale,
+  onCheckoutSession,
+  labels,
+  className
+}) {
+  const tickets = event.occurrences.flatMap((occurrence) => occurrence.ticketTypes);
+  const firstTicket = tickets.find(selectable);
+  const [ticketTypeId, setTicketTypeId] = useState(firstTicket?.id ?? "");
+  const ticket = tickets.find((candidate) => candidate.id === ticketTypeId);
+  const initialQuantity = ticket?.minPerOrder ?? 1;
+  const [quantity, setQuantity] = useState(initialQuantity);
+  const [email, setEmail] = useState("");
+  const [preflightError, setPreflightError] = useState(false);
+  const [buyerAnswers, setBuyerAnswers] = useState({});
+  const [participantAnswers, setParticipantAnswers] = useState(
+    () => Array.from({ length: initialQuantity }, () => ({}))
+  );
+  const generatedId = useId();
+  const instanceId = `event-registration-${generatedId.replaceAll(":", "")}`;
+  const selectedProjectionIdentity = stablePayload({
+    buyerForm: ticket?.buyerForm ?? null,
+    participantForm: ticket?.participantForm ?? null
+  });
+  const previousProjection = useRef(selectedProjectionIdentity);
+  const [projectionGeneration, setProjectionGeneration] = useState(0);
+  const registration = useEventRegistration({
+    client,
+    ...onCheckoutSession ? { onCheckoutSession } : {}
+  });
+  const copy = { ...registrationCopy(locale), ...labels };
+  const previousEvent = useRef(`${event.id}:${event.handle}:${event.registrationMode}:${locale}`);
+  const previousCartToken = useRef(cartToken);
+  useEffect(() => {
+    const eventIdentity = `${event.id}:${event.handle}:${event.registrationMode}:${locale}`;
+    if (previousEvent.current !== eventIdentity) {
+      previousEvent.current = eventIdentity;
+      const nextTicket = tickets.find(selectable);
+      setTicketTypeId(nextTicket?.id ?? "");
+      setQuantity(nextTicket?.minPerOrder ?? 1);
+      setEmail("");
+      setBuyerAnswers({});
+      setParticipantAnswers(Array.from({ length: nextTicket?.minPerOrder ?? 1 }, () => ({})));
+      previousProjection.current = selectedProjectionIdentity;
+      setProjectionGeneration((current) => current + 1);
+      setPreflightError(false);
+      registration.reset();
+    } else if (previousProjection.current !== selectedProjectionIdentity) {
+      previousProjection.current = selectedProjectionIdentity;
+      setBuyerAnswers({});
+      setParticipantAnswers(Array.from({ length: quantity }, () => ({})));
+      setProjectionGeneration((current) => current + 1);
+      setPreflightError(false);
+      registration.reset();
+    }
+    if (previousCartToken.current !== cartToken) {
+      previousCartToken.current = cartToken;
+      setPreflightError(false);
+      registration.reset();
+    }
+  }, [
+    cartToken,
+    event.handle,
+    event.id,
+    event.registrationMode,
+    locale,
+    quantity,
+    selectedProjectionIdentity
+  ]);
+  function selectTicket(nextId) {
+    const next = tickets.find((candidate) => candidate.id === nextId);
+    if (!next || !selectable(next)) return;
+    setTicketTypeId(nextId);
+    setQuantity(next.minPerOrder);
+    setBuyerAnswers({});
+    setParticipantAnswers(Array.from({ length: next.minPerOrder }, () => ({})));
+    registration.reset();
+    setPreflightError(false);
+  }
+  function updateQuantity(next) {
+    if (!ticket) return;
+    const maximum2 = Math.min(ticket.maxPerOrder, ticket.available ?? ticket.maxPerOrder);
+    const normalized = Number.isFinite(next) ? Math.trunc(next) : ticket.minPerOrder;
+    const bounded = Math.max(ticket.minPerOrder, Math.min(maximum2, normalized));
+    setQuantity(bounded);
+    setParticipantAnswers(
+      (current) => Array.from({ length: bounded }, (_, index) => current[index] ?? {})
+    );
+    registration.reset();
+    setPreflightError(false);
+  }
+  async function handleSubmit(submitEvent) {
+    submitEvent.preventDefault();
+    if (!ticket || !selectable(ticket)) {
+      setPreflightError(true);
+      return;
+    }
+    setPreflightError(false);
+    const buyer = ticket.buyerForm ? { versionId: ticket.buyerForm.versionId, answers: buyerAnswers } : void 0;
+    const participants = ticket.participantForm ? participantAnswers.map((answers) => ({
+      versionId: ticket.participantForm.versionId,
+      answers
+    })) : void 0;
+    let submission;
+    if (event.registrationMode === "instant") {
+      if (!cartToken) {
+        setPreflightError(true);
+        return;
+      }
+      submission = {
+        registrationMode: "instant",
+        handle: event.handle,
+        idempotencyKey: "",
+        input: {
+          ticketTypeId: ticket.id,
+          quantity,
+          cartToken,
+          locale,
+          ...buyer ? { buyer } : {},
+          ...participants ? { participants } : {}
+        }
+      };
+    } else if (event.registrationMode === "approval_then_payment") {
+      submission = {
+        registrationMode: "approval_then_payment",
+        handle: event.handle,
+        idempotencyKey: "",
+        input: {
+          ticketTypeId: ticket.id,
+          quantity,
+          contactEmail: email,
+          locale,
+          ...buyer ? { buyer } : {},
+          ...participants ? { participants } : {}
+        }
+      };
+    } else {
+      submission = {
+        registrationMode: "waitlist_only",
+        handle: event.handle,
+        input: { ticketTypeId: ticket.id, quantity, email }
+      };
+    }
+    await registration.submit(submission);
+  }
+  const maximum = ticket ? Math.min(ticket.maxPerOrder, ticket.available ?? ticket.maxPerOrder) : void 0;
+  const renderedState = preflightError ? "request_error" : registration.state;
+  const status = renderedState === "idle" ? "" : copy[renderedState];
+  return /* @__PURE__ */ jsxs("form", { className, "data-kotao-event-registration": true, onSubmit: handleSubmit, children: [
+    /* @__PURE__ */ jsxs("label", { children: [
+      /* @__PURE__ */ jsx("span", { children: copy.ticket }),
+      /* @__PURE__ */ jsx(
+        "select",
+        {
+          "data-kotao-event-ticket": true,
+          value: ticketTypeId,
+          onChange: (changeEvent) => selectTicket(changeEvent.currentTarget.value),
+          children: tickets.map((candidate) => /* @__PURE__ */ jsx("option", { value: candidate.id, disabled: !selectable(candidate), children: candidate.title }, candidate.id))
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("label", { children: [
+      /* @__PURE__ */ jsx("span", { children: copy.quantity }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          name: "quantity",
+          type: "number",
+          value: quantity,
+          min: ticket?.minPerOrder,
+          max: maximum,
+          required: true,
+          step: 1,
+          onChange: (changeEvent) => updateQuantity(changeEvent.currentTarget.valueAsNumber)
+        }
+      )
+    ] }),
+    event.registrationMode !== "instant" ? /* @__PURE__ */ jsxs("label", { children: [
+      /* @__PURE__ */ jsx("span", { children: copy.email }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "email",
+          required: true,
+          value: email,
+          onChange: (changeEvent) => {
+            setEmail(changeEvent.currentTarget.value);
+            setPreflightError(false);
+            registration.reset();
+          }
+        }
+      )
+    ] }) : null,
+    ticket?.buyerForm ? /* @__PURE__ */ jsx("div", { "data-kotao-event-buyer-form": true, children: /* @__PURE__ */ jsx(
+      StorefrontFormFields,
+      {
+        form: eventFormForRenderer(ticket.buyerForm),
+        locale,
+        ...fallbackLocale === void 0 ? {} : { fallbackLocale },
+        answers: buyerAnswers,
+        idPrefix: `${instanceId}-event-${event.id}-ticket-${ticket.id}-buyer`,
+        onAnswersChange: (next) => {
+          setBuyerAnswers(next);
+          setPreflightError(false);
+          registration.reset();
+        }
+      },
+      `${projectionGeneration}:${ticket.id}:${ticket.buyerForm.versionId}`
+    ) }) : null,
+    ticket?.participantForm ? participantAnswers.map((answers, index) => /* @__PURE__ */ jsx(
+      "div",
+      {
+        "data-kotao-event-participant-form": true,
+        children: /* @__PURE__ */ jsx(
+          StorefrontFormFields,
+          {
+            form: eventFormForRenderer(ticket.participantForm),
+            locale,
+            ...fallbackLocale === void 0 ? {} : { fallbackLocale },
+            answers,
+            idPrefix: `${instanceId}-event-${event.id}-ticket-${ticket.id}-participant-${index}`,
+            onAnswersChange: (next) => {
+              setParticipantAnswers(
+                (current) => current.map(
+                  (value, participantIndex) => participantIndex === index ? next : value
+                )
+              );
+              setPreflightError(false);
+              registration.reset();
+            }
+          }
+        )
+      },
+      `${projectionGeneration}:${ticket.id}:${ticket.participantForm.versionId}:${index}`
+    )) : null,
+    /* @__PURE__ */ jsx("button", { type: "submit", disabled: registration.state === "submitting", children: copy.submit }),
+    /* @__PURE__ */ jsx("p", { role: "status", "aria-live": "polite", "aria-atomic": "true", "data-kotao-event-state": renderedState, children: status })
+  ] });
+}
+var OFFER_LABELS = {
+  resolving: "Loading offer\u2026",
+  claim: "Claim offer",
+  resume: "Continue to checkout",
+  claiming: "Starting checkout\u2026",
+  claimed: "Offer claimed. Continue to checkout.",
+  expired: "This offer has expired.",
+  unavailable: "This offer is not available.",
+  requestError: "Something went wrong. Please try again.",
+  retry: "Try again",
+  expires: "Offer expires at"
+};
+function browserLocation() {
+  return typeof window === "undefined" ? void 0 : window.location;
+}
+function browserHistory() {
+  return typeof window === "undefined" ? void 0 : window.history;
+}
+function EventApprovalOffer({
+  client,
+  offerId,
+  cartToken,
+  locale,
+  idempotencyKey,
+  location,
+  history,
+  labels,
+  onCheckoutSession,
+  initialResolution,
+  initialState,
+  className
+}) {
+  const copy = { ...OFFER_LABELS, ...labels };
+  const token = useRef(null);
+  const consumedHrefMarkers = useRef(/* @__PURE__ */ new Set());
+  const offerGeneration = useRef(0);
+  const resolvedGeneration = useRef(initialResolution ? 0 : null);
+  const mounted = useRef(false);
+  const strictCleanupGeneration = useRef(null);
+  const activeDependencies = useRef({ client, cartToken, locale, onCheckoutSession });
+  const claimIdempotencyKey = useMemo(
+    () => idempotencyKey ?? `events-claim-${Date.now()}-${Math.random().toString(36).slice(2)}`,
+    [idempotencyKey, offerId]
+  );
+  const resolveIdempotencyKey = useMemo(
+    () => `events-resolve-${Date.now()}-${Math.random().toString(36).slice(2)}`,
+    [offerId]
+  );
+  const [canClaim, setCanClaim] = useState(initialResolution?.state === "active");
+  const [resolution, setResolution] = useState(
+    initialResolution ?? null
+  );
+  const [state, setState] = useState(
+    initialResolution ? initialResolution.state === "claimed" ? "claimed" : "active" : initialState ?? "resolving"
+  );
+  async function resolveCapability(generation, claimToken) {
+    try {
+      const offer = await client.resolveOffer(offerId, claimToken, resolveIdempotencyKey);
+      if (!mounted.current || generation !== offerGeneration.current) return;
+      resolvedGeneration.current = generation;
+      setResolution(offer);
+      if (offer.state === "claimed") setState("claimed");
+      else if (new Date(offer.expiresAt).getTime() <= Date.now()) setState("expired");
+      else setState("active");
+    } catch (error) {
+      if (!mounted.current || generation !== offerGeneration.current) return;
+      setState(
+        error instanceof StorefrontEventsRequestError && error.status === 409 ? "unavailable" : "request_error"
+      );
+    }
+  }
+  useLayoutEffect(() => {
+    if (strictCleanupGeneration.current !== null && offerGeneration.current === strictCleanupGeneration.current + 1) {
+      offerGeneration.current = strictCleanupGeneration.current;
+    }
+    strictCleanupGeneration.current = null;
+    mounted.current = true;
+    return () => {
+      mounted.current = false;
+      strictCleanupGeneration.current = offerGeneration.current;
+      offerGeneration.current += 1;
+    };
+  }, []);
+  useLayoutEffect(() => {
+    const previous = activeDependencies.current;
+    if (previous.client === client && previous.cartToken === cartToken && previous.locale === locale && previous.onCheckoutSession === onCheckoutSession) {
+      return;
+    }
+    activeDependencies.current = { client, cartToken, locale, onCheckoutSession };
+    offerGeneration.current += 1;
+    resolvedGeneration.current = null;
+    token.current = null;
+    setCanClaim(false);
+    setResolution(null);
+    setState("unavailable");
+  }, [cartToken, client, locale, onCheckoutSession]);
+  useLayoutEffect(() => {
+    if (initialState !== void 0) return;
+    const currentLocation = location ?? browserLocation();
+    const currentHistory = history ?? browserHistory();
+    if (currentLocation === void 0 || currentHistory === void 0) {
+      if (initialResolution === void 0) setState("unavailable");
+      return;
+    }
+    const hrefMarker = offerTokenHrefMarker(currentLocation.href);
+    if (consumedHrefMarkers.current.has(hrefMarker)) return;
+    consumedHrefMarkers.current.add(hrefMarker);
+    offerGeneration.current += 1;
+    const generation = offerGeneration.current;
+    resolvedGeneration.current = null;
+    token.current = null;
+    setCanClaim(false);
+    setResolution(null);
+    setState("resolving");
+    const claimToken = consumeOfferTokenFragment(currentLocation, currentHistory);
+    consumedHrefMarkers.current.add(offerTokenHrefMarker(currentLocation.href));
+    token.current = claimToken;
+    setCanClaim(claimToken !== null);
+    if (claimToken === null) {
+      if (initialResolution === void 0) setState("unavailable");
+      return;
+    }
+    void resolveCapability(generation, claimToken);
+  });
+  function retryResolve() {
+    const claimToken = token.current;
+    if (claimToken === null) {
+      setState("unavailable");
+      return;
+    }
+    const generation = offerGeneration.current;
+    setState("resolving");
+    void resolveCapability(generation, claimToken);
+  }
+  async function claim() {
+    const claimToken = token.current;
+    const generation = offerGeneration.current;
+    if (claimToken === null || resolvedGeneration.current !== generation || resolution?.offerId !== offerId) {
+      setState("unavailable");
+      return;
+    }
+    setState("claiming");
+    try {
+      const session = await client.claimOffer(
+        offerId,
+        { claimToken, cartToken, locale },
+        claimIdempotencyKey
+      );
+      if (!mounted.current || generation !== offerGeneration.current) return;
+      token.current = null;
+      setCanClaim(false);
+      setState("claimed");
+      onCheckoutSession?.(session);
+    } catch (error) {
+      if (!mounted.current || generation !== offerGeneration.current) return;
+      setState(
+        error instanceof StorefrontEventsRequestError && error.status === 409 ? "unavailable" : "request_error"
+      );
+    }
+  }
+  const status = state === "resolving" ? copy.resolving : state === "claiming" ? copy.claiming : state === "claimed" ? copy.claimed : state === "expired" ? copy.expired : state === "unavailable" ? copy.unavailable : state === "request_error" ? copy.requestError : null;
+  return /* @__PURE__ */ jsxs("section", { className, "data-kotao-event-approval-offer": true, children: [
+    resolution ? /* @__PURE__ */ jsxs("header", { children: [
+      /* @__PURE__ */ jsx("h1", { children: resolution.eventTitle }),
+      /* @__PURE__ */ jsxs("p", { children: [
+        resolution.ticketTypeTitle,
+        " \xB7 ",
+        resolution.quantity
+      ] }),
+      /* @__PURE__ */ jsx("time", { dateTime: resolution.occurrenceStartsAt, children: resolution.occurrenceStartsAt })
+    ] }) : null,
+    (state === "active" || state === "claimed" && canClaim || state === "request_error" && canClaim) && resolution ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs("p", { children: [
+        copy.expires,
+        ": ",
+        /* @__PURE__ */ jsx("time", { dateTime: resolution.expiresAt, children: resolution.expiresAt })
+      ] }),
+      /* @__PURE__ */ jsx("button", { type: "button", onClick: claim, children: state === "claimed" ? copy.resume : copy.claim })
+    ] }) : null,
+    state === "request_error" && canClaim && resolution === null ? /* @__PURE__ */ jsx("button", { type: "button", onClick: retryResolve, children: copy.retry }) : null,
+    /* @__PURE__ */ jsx("p", { role: "status", "aria-live": "polite", "aria-atomic": "true", children: status })
+  ] });
+}
+
+export { EventApprovalOffer, EventRegistrationForm, useEventRegistration };
+//# sourceMappingURL=events-react.js.map
+//# sourceMappingURL=events-react.js.map