@replohq/sdk 2.1.0 → 2.2.1

package/_vendor/schemas/generated/consent.d.ts

@@ -1,4 +1,4 @@
-export type ReploScriptType = "GA4" | "GoogleTagManager" | "Meta" | "TikTok" | "Pinterest" | "Reddit" | "Snapchat" | "X" | "Hotjar" | "MicrosoftClarity" | "Contentsquare" | "Segment" | "Northbeam" | "Gorgias" | "Converge" | "HubSpot" | "Cookiebot" | "snippet" | "custom" | "consentPlatform";
+export type ReploScriptType = "GA4" | "GoogleTagManager" | "Meta" | "TikTok" | "Pinterest" | "Reddit" | "Snapchat" | "X" | "Hotjar" | "MicrosoftClarity" | "Contentsquare" | "Segment" | "Northbeam" | "Gorgias" | "Converge" | "Mixpanel" | "HubSpot" | "Cookiebot" | "snippet" | "custom" | "consentPlatform";
 export type ConsentCategory = "necessary" | "analytics" | "marketing" | "preferences" | "sale_of_data";
 export type ConsentMode = "off" | "simple" | "per-category";
 export type ScriptTagDescriptor = {
@@ -19,6 +19,7 @@ export type XPixelEvents = {
     startCheckout?: string;
     purchase?: string;
 };
+export type MixpanelRegion = "us" | "eu" | "in";
 export type ReploScriptEntry = {
     type: "GA4" | "GoogleTagManager" | "Meta" | "TikTok" | "Pinterest" | "Reddit" | "Snapchat" | "Hotjar" | "MicrosoftClarity" | "Contentsquare" | "Segment" | "Northbeam" | "Gorgias" | "Converge" | "HubSpot";
     identifier: string;
@@ -28,6 +29,11 @@ export type ReploScriptEntry = {
     identifier: string;
     events?: Partial<XPixelEvents>;
     requiredConsent?: ConsentCategory[];
+} | {
+    type: "Mixpanel";
+    identifier: string;
+    region?: MixpanelRegion;
+    requiredConsent?: ConsentCategory[];
 } | {
     type: "Cookiebot";
     identifier: string;

package/analytics/get-analytics-sinks.js

@@ -4,6 +4,7 @@ import { ConvergeSink } from "./sinks/converge-sink";
 import { ElevarSink } from "./sinks/elevar-sink";
 import { GA4Sink } from "./sinks/ga4-sink";
 import { MetaSink } from "./sinks/meta-sink";
+import { MixpanelSink } from "./sinks/mixpanel-sink";
 import { NorthbeamSink } from "./sinks/northbeam-sink";
 import { PinterestSink } from "./sinks/pinterest-sink";
 import { RedditSink } from "./sinks/reddit-sink";
@@ -23,12 +24,13 @@ const PROVIDER_SINK_FACTORIES = {
   Reddit: () => new RedditSink(),
   Northbeam: () => new NorthbeamSink(),
   Converge: () => new ConvergeSink(),
-  Segment: () => new SegmentSink()
+  Segment: () => new SegmentSink(),
+  Mixpanel: () => new MixpanelSink()
 };
 const SNIPPET_PROVIDER_SINK_FACTORIES = {
   [snippetScriptId("Elevar")]: () => new ElevarSink()
 };
-const SHOPIFY_FUNNEL_GATE_EXEMPT_PROVIDERS = /* @__PURE__ */ new Set(["Segment"]);
+const SHOPIFY_FUNNEL_GATE_EXEMPT_PROVIDERS = /* @__PURE__ */ new Set(["Segment", "Mixpanel"]);
 function findSinkFactory(script) {
   if (script.type === "X") {
     return () => {

package/analytics/sinks/mixpanel-event-mapper.d.ts

@@ -0,0 +1,48 @@
+import type { AnalyticsProductLine, CartViewedData, CheckoutStartedData, CollectionViewedData, PurchasePayload } from "../analytics-sink";
+/**
+ * Maps Replo's analytics payloads onto Mixpanel's conventional e-commerce
+ * property names (the Segment-style vocabulary Mixpanel's docs recommend:
+ * `product_id`, `name`, `price`, `quantity`, `products`, `revenue`, ...).
+ *
+ * Mixpanel accepts any property bag, so unlike the Converge mapper nothing
+ * here rejects an event: a funnel built on `Product Viewed` still counts an
+ * event whose payload had no price. Empty SKUs and variant titles are left
+ * out rather than sent blank.
+ */
+export type MixpanelProductProperties = {
+    product_id: string;
+    sku?: string;
+    name?: string;
+    variant?: string;
+    variant_id?: string;
+    price?: number;
+    quantity?: number;
+    currency?: string;
+};
+export type MixpanelCartProperties = {
+    total: number;
+    currency?: string;
+    products?: MixpanelProductProperties[];
+};
+export type MixpanelOrderProperties = {
+    total: number;
+    /** The property Mixpanel's revenue reports read. */
+    revenue: number;
+    currency: string;
+    order_id?: string;
+    products?: MixpanelProductProperties[];
+    tax?: number;
+    shipping?: number;
+    discount?: number;
+    coupon?: string;
+};
+export type MixpanelCollectionProperties = {
+    list_id: string;
+    name?: string;
+    products?: MixpanelProductProperties[];
+};
+export declare function mapMixpanelProduct(line: AnalyticsProductLine): MixpanelProductProperties;
+export declare function mapMixpanelViewedCart(data: CartViewedData): MixpanelCartProperties;
+export declare function mapMixpanelCheckout(data: CheckoutStartedData): MixpanelCartProperties;
+export declare function mapMixpanelCollection(data: CollectionViewedData): MixpanelCollectionProperties;
+export declare function mapMixpanelOrder({ amount, currency, data, }: PurchasePayload): MixpanelOrderProperties;

package/analytics/sinks/mixpanel-event-mapper.js

@@ -0,0 +1,96 @@
+import { filterUndefined } from "../../_vendor/replo-utils/lib/object.mjs";
+import { legacyResourceId } from "../utils/analytics-products";
+function mapProduct({
+  line,
+  fallbackCurrency
+}) {
+  return {
+    product_id: legacyResourceId(line.productId),
+    ...filterUndefined({
+      sku: line.variantSku || void 0,
+      name: line.productTitle || void 0,
+      variant: line.variantTitle || void 0,
+      variant_id: line.variantId ? legacyResourceId(line.variantId) : void 0,
+      price: line.price,
+      quantity: line.quantity,
+      currency: line.currency ?? fallbackCurrency ?? void 0
+    })
+  };
+}
+function mapProducts({
+  lines,
+  currency
+}) {
+  if (lines.length === 0) {
+    return void 0;
+  }
+  return lines.map((line) => mapProduct({ line, fallbackCurrency: currency }));
+}
+function mapMixpanelProduct(line) {
+  return mapProduct({ line, fallbackCurrency: null });
+}
+function mapCart({
+  total,
+  currency,
+  lineItems
+}) {
+  return {
+    total,
+    ...filterUndefined({
+      currency: currency ?? void 0,
+      products: mapProducts({ lines: lineItems, currency })
+    })
+  };
+}
+function mapMixpanelViewedCart(data) {
+  return mapCart({
+    total: data.subtotal,
+    currency: data.currency ?? null,
+    lineItems: data.lineItems
+  });
+}
+function mapMixpanelCheckout(data) {
+  return mapCart({
+    total: data.total,
+    currency: data.currency ?? null,
+    lineItems: data.lineItems
+  });
+}
+function mapMixpanelCollection(data) {
+  return {
+    list_id: legacyResourceId(data.collectionId),
+    ...filterUndefined({
+      name: data.collectionTitle || void 0,
+      products: mapProducts({
+        lines: data.products,
+        currency: data.currency ?? null
+      })
+    })
+  };
+}
+function mapMixpanelOrder({
+  amount,
+  currency,
+  data
+}) {
+  return {
+    total: amount,
+    revenue: amount,
+    currency,
+    ...filterUndefined({
+      order_id: data.orderId || void 0,
+      products: mapProducts({ lines: data.lineItems ?? [], currency }),
+      tax: data.totalTax,
+      shipping: data.totalShipping,
+      discount: data.totalDiscount,
+      coupon: data.discountCodes && data.discountCodes.length > 0 ? data.discountCodes.join(", ") : void 0
+    })
+  };
+}
+export {
+  mapMixpanelCheckout,
+  mapMixpanelCollection,
+  mapMixpanelOrder,
+  mapMixpanelProduct,
+  mapMixpanelViewedCart
+};

package/analytics/sinks/mixpanel-sink.d.ts

@@ -0,0 +1,27 @@
+import type { AnalyticsSink, CartLineEventPayload, CartViewedPayload, CheckoutStartedPayload, ClickPayload, CollectionViewedPayload, CustomEventPayload, LegacyCheckoutStartedPayload, ProductViewedPayload, PurchasePayload } from "../analytics-sink";
+import type { PageMetadata } from "../utils/navigation-tracker";
+declare global {
+    interface Window {
+        mixpanel?: {
+            track: (eventName: string, properties: Record<string, unknown>) => void;
+        };
+    }
+}
+/**
+ * Sends Replo's analytics events to Mixpanel with its conventional e-commerce
+ * event names. The consent-gated snippet sends the landing "Page Viewed"; this
+ * sink adds one for each in-site navigation, so each load counts once.
+ */
+export declare class MixpanelSink implements AnalyticsSink {
+    private send;
+    customEvent({ event, properties }: CustomEventPayload): Promise<void>;
+    pageView(metadata?: PageMetadata): Promise<void>;
+    purchase(payload: PurchasePayload): Promise<void>;
+    click({ data }: ClickPayload): Promise<void>;
+    productViewed({ data }: ProductViewedPayload): Promise<void>;
+    addToCart({ data }: CartLineEventPayload): Promise<void>;
+    removeFromCart({ data }: CartLineEventPayload): Promise<void>;
+    viewCart({ data }: CartViewedPayload): Promise<void>;
+    startCheckout(payload: CheckoutStartedPayload | LegacyCheckoutStartedPayload): Promise<void>;
+    viewCollection({ data }: CollectionViewedPayload): Promise<void>;
+}

package/analytics/sinks/mixpanel-sink.js

@@ -0,0 +1,99 @@
+import { filterUndefined } from "../../_vendor/replo-utils/lib/object.mjs";
+import { toCheckoutStartedData } from "../legacy-checkout";
+import { createAnalyticsQueue } from "../utils/analytics-utils";
+import {
+  mapMixpanelCheckout,
+  mapMixpanelCollection,
+  mapMixpanelOrder,
+  mapMixpanelProduct,
+  mapMixpanelViewedCart
+} from "./mixpanel-event-mapper";
+function findMixpanel() {
+  if (typeof window === "undefined") {
+    return null;
+  }
+  return window.mixpanel ?? null;
+}
+function pathFromUrl(url) {
+  try {
+    return new URL(url).pathname;
+  } catch {
+    return void 0;
+  }
+}
+class MixpanelSink {
+  send = createAnalyticsQueue({
+    isReady: () => Boolean(findMixpanel()),
+    send: ({ eventName, properties }) => {
+      findMixpanel()?.track(eventName, properties);
+    },
+    queueName: "Mixpanel"
+  });
+  async customEvent({ event, properties }) {
+    this.send({ eventName: event, properties: properties ?? {} });
+  }
+  async pageView(metadata) {
+    if (metadata?.navigationType === "initial") {
+      return;
+    }
+    const url = metadata?.url ?? (typeof window === "undefined" ? void 0 : window.location.href);
+    this.send({
+      eventName: "Page Viewed",
+      properties: filterUndefined({
+        url,
+        path: url ? pathFromUrl(url) : void 0,
+        title: metadata?.title || void 0,
+        referrer: metadata?.referrer || void 0,
+        navigation_type: metadata?.navigationType
+      })
+    });
+  }
+  async purchase(payload) {
+    this.send({
+      eventName: "Order Completed",
+      properties: mapMixpanelOrder(payload)
+    });
+  }
+  async click({ data }) {
+    this.send({ eventName: "Click", properties: data });
+  }
+  async productViewed({ data }) {
+    this.send({
+      eventName: "Product Viewed",
+      properties: mapMixpanelProduct(data)
+    });
+  }
+  async addToCart({ data }) {
+    this.send({
+      eventName: "Product Added",
+      properties: mapMixpanelProduct(data)
+    });
+  }
+  async removeFromCart({ data }) {
+    this.send({
+      eventName: "Product Removed",
+      properties: mapMixpanelProduct(data)
+    });
+  }
+  async viewCart({ data }) {
+    this.send({
+      eventName: "Cart Viewed",
+      properties: mapMixpanelViewedCart(data)
+    });
+  }
+  async startCheckout(payload) {
+    this.send({
+      eventName: "Checkout Started",
+      properties: mapMixpanelCheckout(toCheckoutStartedData(payload.data))
+    });
+  }
+  async viewCollection({ data }) {
+    this.send({
+      eventName: "Collection Viewed",
+      properties: mapMixpanelCollection(data)
+    });
+  }
+}
+export {
+  MixpanelSink
+};

package/consent/consent-platform.js

@@ -1,4 +1,4 @@
-import * as z from "zod";
+import * as v from "valibot";
 import { DENIED_CATEGORIES } from "./cookie";
 const COOKIEBOT_CATEGORY_BY_CONSENT = {
   analytics: "statistics",
@@ -75,7 +75,7 @@ const OPTIONAL_CONSENT_CATEGORIES = [
   "preferences",
   "sale_of_data"
 ];
-const genericConsentCategorySchema = z.enum(OPTIONAL_CONSENT_CATEGORIES);
+const genericConsentCategorySchema = v.picklist(OPTIONAL_CONSENT_CATEGORIES);
 const GENERIC_CONSENT_GRANTED_EVENT = "reploConsentCategoryGranted";
 let delegatedPlatform = null;
 let listeningToCookiebot = false;
@@ -134,11 +134,11 @@ function handleGenericConsentActivation(event) {
   if (!(event instanceof CustomEvent)) {
     return;
   }
-  const result = genericConsentCategorySchema.safeParse(event.detail);
-  if (!result.success || categories[result.data]) {
+  const result = v.safeParse(genericConsentCategorySchema, event.detail);
+  if (!result.success || categories[result.output]) {
     return;
   }
-  categories = { ...categories, [result.data]: true };
+  categories = { ...categories, [result.output]: true };
   decidedAt = Date.now();
   notifyConsentListeners();
 }

package/consent/cookie.d.ts

@@ -1,4 +1,5 @@
 import type { ConsentCategory } from "../_vendor/schemas/generated/consent";
+import * as v from "valibot";
 /**
  * Pure (non-React, framework-agnostic) consent cookie helpers used by the client
  * store (`consent-store.ts`).
@@ -6,20 +7,21 @@ import type { ConsentCategory } from "../_vendor/schemas/generated/consent";
 export declare const CONSENT_COOKIE_NAME = "replo_consent";
 export declare const CONSENT_COOKIE_VERSION = 1;
 export declare const CONSENT_COOKIE_MAX_AGE_SECONDS: number;
+declare const persistedCookieSchema: v.ObjectSchema<{
+    readonly version: v.LiteralSchema<1, undefined>;
+    readonly decidedAt: v.OptionalSchema<v.SchemaWithPipe<readonly [v.NumberSchema<undefined>, v.FiniteAction<number, undefined>]>, () => number>;
+    /** Persistent pseudonymous per-browser id; absent on pre-id (legacy) cookies. */
+    readonly consentId: v.OptionalSchema<v.StringSchema<undefined>, undefined>;
+    readonly categories: v.ObjectSchema<{
+        readonly analytics: v.BooleanSchema<undefined>;
+        readonly marketing: v.BooleanSchema<undefined>;
+        readonly preferences: v.BooleanSchema<undefined>;
+        readonly sale_of_data: v.BooleanSchema<undefined>;
+    }, undefined>;
+}, undefined>;
 export type ConsentCategories = Record<ConsentCategory, boolean>;
 /** Persisted cookie payload. `necessary` is always granted and never stored. */
-export interface ConsentCookiePayload {
-    version: number;
-    decidedAt: number;
-    /** Persistent pseudonymous per-browser id; absent on pre-id (legacy) cookies. */
-    consentId?: string;
-    categories: {
-        analytics: boolean;
-        marketing: boolean;
-        preferences: boolean;
-        sale_of_data: boolean;
-    };
-}
+export type ConsentCookiePayload = v.InferOutput<typeof persistedCookieSchema>;
 export declare const DENIED_CATEGORIES: ConsentCategories;
 export declare const GRANTED_CATEGORIES: ConsentCategories;
 /**
@@ -34,3 +36,4 @@ export declare function serializeConsentCookieValue({ categories, decidedAt, con
     decidedAt: number;
     consentId?: string;
 }): string;
+export {};

package/consent/cookie.js

@@ -1,17 +1,17 @@
 import { parseJsonOrNull } from "../_vendor/replo-utils/lib/json.mjs";
-import * as z from "zod";
+import * as v from "valibot";
 const CONSENT_COOKIE_NAME = "replo_consent";
 const CONSENT_COOKIE_VERSION = 1;
 const CONSENT_COOKIE_MAX_AGE_SECONDS = 60 * 60 * 24 * 180;
-const persistedCookieSchema = z.object({
-  version: z.literal(CONSENT_COOKIE_VERSION),
-  decidedAt: z.number().optional(),
-  consentId: z.string().optional(),
-  categories: z.object({
-    analytics: z.boolean(),
-    marketing: z.boolean(),
-    preferences: z.boolean(),
-    sale_of_data: z.boolean()
+const persistedCookieSchema = v.object({
+  version: v.literal(CONSENT_COOKIE_VERSION),
+  decidedAt: v.optional(v.pipe(v.number(), v.finite()), () => Date.now()),
+  consentId: v.optional(v.string()),
+  categories: v.object({
+    analytics: v.boolean(),
+    marketing: v.boolean(),
+    preferences: v.boolean(),
+    sale_of_data: v.boolean()
   })
 });
 const DENIED_CATEGORIES = {
@@ -40,14 +40,14 @@ function parseConsentCookie(rawCookie) {
   } catch {
     return null;
   }
-  const result = persistedCookieSchema.safeParse(parseJsonOrNull(decoded));
+  const result = v.safeParse(persistedCookieSchema, parseJsonOrNull(decoded));
   if (!result.success) {
     return null;
   }
-  const { decidedAt, categories, consentId } = result.data;
+  const { decidedAt, categories, consentId } = result.output;
   return {
     version: CONSENT_COOKIE_VERSION,
-    decidedAt: decidedAt ?? Date.now(),
+    decidedAt,
     consentId,
     categories
   };

package/consent/script-snippets.d.ts

@@ -1,5 +1,8 @@
 import type { ConsentCategory, ReploScriptEntry, ReploScriptType, ScriptTagDescriptor } from "../_vendor/schemas/generated/consent";
 type ProviderType = Exclude<ReploScriptType, "custom" | "snippet" | "consentPlatform" | "Cookiebot">;
+type ProviderScriptEntry = Extract<ReploScriptEntry, {
+    type: ProviderType;
+}>;
 /**
  * Snippet providers don't synthesize tags (the user pastes the provider-issued
  * snippet as the entry's `body`), but they still get a first-class default
@@ -11,9 +14,7 @@ export declare function isXEventIdForPixel({ eventId, pixelId, }: {
     pixelId: string;
 }): boolean;
 /** The runtime injects these tags in order after consent allows tracking. */
-export declare function buildScriptTags(entry: Extract<ReploScriptEntry, {
-    type: ProviderType;
-}>): ScriptTagDescriptor[];
+export declare function buildScriptTags(entry: ProviderScriptEntry): ScriptTagDescriptor[];
 /**
  * The default consent categories that gate an identifier-provider script when an
  * entry does not specify `requiredConsent`. `snippet` and `custom` entries carry

package/consent/script-snippets.js

@@ -1,3 +1,12 @@
+const MIXPANEL_API_HOSTS = {
+  us: null,
+  eu: "https://api-eu.mixpanel.com",
+  in: "https://api-in.mixpanel.com"
+};
+function mixpanelInitOptions(region) {
+  const apiHost = MIXPANEL_API_HOSTS[region ?? "us"];
+  return apiHost ? `{track_pageview:false,api_host:${JSON.stringify(apiHost)}}` : "{track_pageview:false}";
+}
 const PROVIDER_SNIPPETS = {
   GA4: {
     defaultConsent: ["analytics"],
@@ -138,6 +147,15 @@ gtag('config', '${id}');`
       }
     ]
   },
+  Mixpanel: {
+    defaultConsent: ["analytics"],
+    buildTags: (id, entry) => [
+      {
+        kind: "inline",
+        body: `(function(f,b){if(!b.__SV){var e,g,i,h;window.mixpanel=b;b._i=[];b.init=function(e,f,c){function g(a,d){var b=d.split(".");2==b.length&&(a=a[b[0]],d=b[1]);a[d]=function(){a.push([d].concat(Array.prototype.slice.call(arguments,0)))}}var a=b;"undefined"!==typeof c?a=b[c]=[]:c="mixpanel";a.people=a.people||[];a.toString=function(a){var d="mixpanel";"mixpanel"!==c&&(d+="."+c);a||(d+=" (stub)");return d};a.people.toString=function(){return a.toString(1)+".people (stub)"};i="disable time_event track track_pageview track_links track_forms track_with_groups add_group set_group remove_group register register_once alias unregister identify name_tag set_config reset opt_in_tracking opt_out_tracking has_opted_in_tracking has_opted_out_tracking clear_opt_in_out_tracking start_batch_senders people.set people.set_once people.unset people.increment people.append people.union people.track_charge people.clear_charges people.delete_user people.remove".split(" ");for(h=0;h<i.length;h++)g(a,i[h]);var j="set set_once union unset remove delete".split(" ");a.get_group=function(){function b(c){d[c]=function(){var e=arguments;a.push([f,[c].concat(Array.prototype.slice.call(e,0))])}}for(var d={},f=["get_group"].concat(Array.prototype.slice.call(arguments,0)),c=0;c<j.length;c++)b(j[c]);return d};b._i.push([e,f,c])};b.__SV=1.2;e=f.createElement("script");e.type="text/javascript";e.async=!0;e.src="https://cdn.mxpnl.com/libs/mixpanel-2-latest.min.js";f.head.appendChild(e)}})(document,window.mixpanel||[]);mixpanel.init("${id}",${mixpanelInitOptions(entry.type === "Mixpanel" ? entry.region : void 0)});mixpanel.track("Page Viewed",{url:location.href,path:location.pathname,title:document.title||undefined,referrer:document.referrer||undefined,navigation_type:"initial"});`
+      }
+    ]
+  },
   Gorgias: {
     defaultConsent: ["preferences"],
     buildTags: (id) => [
@@ -167,7 +185,7 @@ function isXEventIdForPixel({
   return match?.[1]?.toLowerCase() === pixelId.toLowerCase();
 }
 function buildScriptTags(entry) {
-  const tags = PROVIDER_SNIPPETS[entry.type].buildTags(entry.identifier);
+  const tags = PROVIDER_SNIPPETS[entry.type].buildTags(entry.identifier, entry);
   if (entry.type === "X") {
     const pageViewId = entry.events?.pageView?.trim();
     if (pageViewId && isXEventIdForPixel({ eventId: pageViewId, pixelId: entry.identifier })) {

package/consent/types.d.ts

@@ -1,4 +1,4 @@
-export type ReploScriptType = "GA4" | "GoogleTagManager" | "Meta" | "TikTok" | "Pinterest" | "Reddit" | "Snapchat" | "X" | "Hotjar" | "MicrosoftClarity" | "Contentsquare" | "Segment" | "Northbeam" | "Gorgias" | "Converge" | "HubSpot" | "Cookiebot" | "snippet" | "custom" | "consentPlatform";
+export type ReploScriptType = "GA4" | "GoogleTagManager" | "Meta" | "TikTok" | "Pinterest" | "Reddit" | "Snapchat" | "X" | "Hotjar" | "MicrosoftClarity" | "Contentsquare" | "Segment" | "Northbeam" | "Gorgias" | "Converge" | "HubSpot" | "Mixpanel" | "Cookiebot" | "snippet" | "custom" | "consentPlatform";
 export type ConsentCategory = "necessary" | "analytics" | "marketing" | "preferences" | "sale_of_data";
 export type ConsentMode = "off" | "simple" | "per-category";
 declare module "react" {
@@ -23,6 +23,7 @@ export type XPixelEvents = {
     startCheckout?: string;
     purchase?: string;
 };
+export type MixpanelRegion = "us" | "eu" | "in";
 export type ReploScriptEntry = {
     type: "GA4" | "GoogleTagManager" | "Meta" | "TikTok" | "Pinterest" | "Reddit" | "Snapchat" | "Hotjar" | "MicrosoftClarity" | "Contentsquare" | "Segment" | "Northbeam" | "Gorgias" | "Converge" | "HubSpot" | "Cookiebot";
     identifier: string;
@@ -32,6 +33,11 @@ export type ReploScriptEntry = {
     identifier: string;
     events?: XPixelEvents;
     requiredConsent?: ConsentCategory[];
+} | {
+    type: "Mixpanel";
+    identifier: string;
+    region?: MixpanelRegion;
+    requiredConsent?: ConsentCategory[];
 } | {
     type: "snippet";
     id: string;

package/integrations/mailchimp.d.ts

@@ -1,19 +1,10 @@
 import React from "react";
-import * as z from "zod";
+import * as v from "valibot";
 import { CanopyError } from "../lib/canopy-error";
-declare const mailchimpSubscribeErrorCodeSchema: z.ZodEnum<{
-    notConnected: "notConnected";
-    listNotFound: "listNotFound";
-    invalidEmail: "invalidEmail";
-    invalidRequest: "invalidRequest";
-    emailNotSubscribable: "emailNotSubscribable";
-    mergeFieldsInvalid: "mergeFieldsInvalid";
-    rateLimited: "rateLimited";
-    upstreamError: "upstreamError";
-}>;
+declare const mailchimpSubscribeErrorCodeSchema: v.PicklistSchema<["notConnected", "listNotFound", "invalidEmail", "invalidRequest", "emailNotSubscribable", "mergeFieldsInvalid", "rateLimited", "upstreamError"], undefined>;
 /** `pending` means Mailchimp emailed a confirmation link the visitor must click. */
 export type MailchimpSubscribeStatus = "subscribed" | "pending";
-export type MailchimpSubscribeErrorCode = z.infer<typeof mailchimpSubscribeErrorCodeSchema>;
+export type MailchimpSubscribeErrorCode = v.InferOutput<typeof mailchimpSubscribeErrorCodeSchema>;
 export declare class MailchimpSubscribeError extends CanopyError {
     readonly code: MailchimpSubscribeErrorCode;
     constructor({ code, message, cause, }: {

package/integrations/mailchimp.js

@@ -2,10 +2,10 @@
 import React from "react";
 import { useMutation } from "@tanstack/react-query";
 import { parseJsonOrNull } from "../_vendor/replo-utils/lib/json.mjs";
-import * as z from "zod";
+import * as v from "valibot";
 import { CanopyError } from "../lib/canopy-error";
 import { useCanopyClientConfig } from "../providers/canopy-client-config";
-const mailchimpSubscribeErrorCodeSchema = z.enum([
+const mailchimpSubscribeErrorCodeSchema = v.picklist([
   "notConnected",
   "listNotFound",
   "invalidEmail",
@@ -15,12 +15,12 @@ const mailchimpSubscribeErrorCodeSchema = z.enum([
   "rateLimited",
   "upstreamError"
 ]);
-const mailchimpSubscribeSuccessSchema = z.object({
-  status: z.enum(["subscribed", "pending"])
+const mailchimpSubscribeSuccessSchema = v.object({
+  status: v.picklist(["subscribed", "pending"])
 });
-const mailchimpSubscribeFailureSchema = z.object({
+const mailchimpSubscribeFailureSchema = v.object({
   key: mailchimpSubscribeErrorCodeSchema,
-  message: z.string()
+  message: v.string()
 });
 class MailchimpSubscribeError extends CanopyError {
   code;
@@ -65,24 +65,28 @@ async function postSubscribe({
   }
   const body = parseJsonOrNull(responseText);
   if (!response.ok) {
-    const failure = mailchimpSubscribeFailureSchema.safeParse(body);
+    const failure = v.safeParse(mailchimpSubscribeFailureSchema, body);
     throw new MailchimpSubscribeError(
-      failure.success ? { code: failure.data.key, message: failure.data.message, cause: null } : {
+      failure.success ? {
+        code: failure.output.key,
+        message: failure.output.message,
+        cause: null
+      } : {
         code: "upstreamError",
         message: `The Mailchimp subscribe endpoint failed with status ${response.status}`,
-        cause: failure.error
+        cause: new v.ValiError(failure.issues)
       }
     );
   }
-  const success = mailchimpSubscribeSuccessSchema.safeParse(body);
+  const success = v.safeParse(mailchimpSubscribeSuccessSchema, body);
   if (!success.success) {
     throw new MailchimpSubscribeError({
       code: "upstreamError",
       message: "The Mailchimp subscribe endpoint returned an unexpected response",
-      cause: success.error
+      cause: new v.ValiError(success.issues)
     });
   }
-  return success.data.status;
+  return success.output.status;
 }
 function useMailchimpSubscribe({
   listId,

package/lib/buildMetadata.js

@@ -1,7 +1,7 @@
 export const BUILD_METADATA = {
   "packageName": "@replohq/sdk",
-  "version": "2.1.0",
+  "version": "2.2.1",
   "branch": "HEAD",
-  "commit": "fd5e2e68393795f73c76f04e5fbccad127d8ee31",
-  "builtAt": "2026-10-20T14:39:29.462Z"
+  "commit": "cb0991cc863d256c3df479ed294f1a2dc48dba29",
+  "builtAt": "2026-10-20T23:18:54.483Z"
 };

package/loaders/preview-placeholder.d.ts

@@ -1,3 +1,20 @@
+/**
+ * Sample-data substitution for previewing dynamic routes inside the editor.
+ *
+ * When the editor previews an unfilled Next.js dynamic route (the literal
+ * `/products/[handle]` URL), the page receives the bracket token itself as its
+ * param, every lookup misses, and the preview 404s. Loader invocations detect
+ * that exact case — editor iframe + a bracket-token arg — and substitute a
+ * type-correct sample fixture so the page renders its real layout with sample
+ * data. A `replo:preview:placeholder-render` message tells the embedding
+ * editor the preview is showing sample data (mirrors `replo:preview:status`
+ * from NextErrorReporter).
+ *
+ * Substitution is gated to editor iframes only: production traffic to a
+ * bracket URL still misses lookups and 404s, so this can never soft-404 a
+ * published site.
+ */
+import type { FullCollection, FullProduct, PaginatedProducts } from "./loader-schemas";
 export declare function hasUnfilledRouteParam(args: Record<string, unknown>): boolean;
 /**
  * Sample data for a loader invoked with an unfilled dynamic-route param, or
@@ -13,8 +30,9 @@ export declare function resolvePreviewPlaceholderData({ loaderKey, args, }: {
     loaderKey: string;
     args: Record<string, unknown>;
 }): unknown;
+type PreviewableLoaderData = FullProduct | FullCollection | PaginatedProducts;
 /** Whether loader output is one of this module's sample fixtures. */
-export declare function isPreviewPlaceholderData(data: unknown): boolean;
+export declare function isPreviewPlaceholderData(data: PreviewableLoaderData): boolean;
 /**
  * Notify the embedding editor when a loader component rendered sample data.
  * The single reporting path: inspecting rendered data (rather than hooking
@@ -22,4 +40,5 @@ export declare function isPreviewPlaceholderData(data: unknown): boolean;
  * hydration never re-invokes the loader on the client. Receivers treat the
  * message as idempotent, so no dedupe is needed.
  */
-export declare function useReportPreviewPlaceholderRender(data: unknown): void;
+export declare function useReportPreviewPlaceholderRender(data: PreviewableLoaderData): void;
+export {};

package/loaders/preview-placeholder.js

@@ -1,5 +1,4 @@
 import { useEffect } from "react";
-import * as z from "zod";
 import { DATA_LOADER_KEYS } from "./loader-keys";
 const PLACEHOLDER_RENDER_MESSAGE_TYPE = "replo:preview:placeholder-render";
 const UNFILLED_ROUTE_PARAM_RE = /^\[{1,2}(?:\.\.\.)?[^\]]+\]{1,2}$/;
@@ -184,17 +183,9 @@ function resolvePreviewPlaceholderData({
   }
   return window.parent === window ? null : placeholderData;
 }
-const placeholderIdSchema = z.object({ id: z.string() });
-const placeholderProductsSchema = z.object({
-  products: z.array(z.object({ id: z.string() })).min(1)
-});
 function isPreviewPlaceholderData(data) {
-  const withId = placeholderIdSchema.safeParse(data);
-  if (withId.success) {
-    return withId.data.id.startsWith(SAMPLE_ID_PREFIX);
-  }
-  const withProducts = placeholderProductsSchema.safeParse(data);
-  return withProducts.success && (withProducts.data.products[0]?.id.startsWith(SAMPLE_ID_PREFIX) ?? false);
+  const id = "products" in data ? data.products[0]?.id : data.id;
+  return id?.startsWith(SAMPLE_ID_PREFIX) ?? false;
 }
 function useReportPreviewPlaceholderRender(data) {
   useEffect(() => {

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@replohq/sdk",
-  "version": "2.1.0",
+  "version": "2.2.1",
   "reploBuild": {
     "packageName": "@replohq/sdk",
-    "version": "2.1.0",
+    "version": "2.2.1",
     "branch": "HEAD",
-    "commit": "fd5e2e68393795f73c76f04e5fbccad127d8ee31",
-    "builtAt": "2026-10-20T14:39:29.462Z"
+    "commit": "cb0991cc863d256c3df479ed294f1a2dc48dba29",
+    "builtAt": "2026-10-20T23:18:54.483Z"
   },
   "description": "Replo SDK — cart, analytics, and data loaders for agent-built Next.js sites.",
   "license": "SEE LICENSE IN LICENSE",
@@ -300,6 +300,7 @@
     "server-only": "^0.0.1",
     "tiny-jsonc": "^1.0.2",
     "uuid": "^11.1.0",
+    "valibot": "^1.5.0",
     "yaml": "^2.8.3",
     "zod": "^4.3.6"
   },