@thg-agentic/hyper-personalisation-web 3.22.2 → 3.23.0

package/src/onsite/wheel-loader.js

@@ -0,0 +1,5 @@
+/**
+ * The wheel, only for a form that spins: a bundler splits this import out of ./onsite, and the CDN
+ * build swaps this module for cdn/wheel-loader.js, which loads dist/onsite-wheel.min.js.
+ */
+export const loadWheel = () => import('./wheel.js');

package/src/onsite/wheel.js

@@ -0,0 +1,148 @@
+/**
+ * The spin-to-win wheel (`./onsite/wheel`), a chunk of its own: an SVG of the form's prize labels
+ * that only animates, in the theme's colours: the accent and its tints, a rim of lights, a hub and
+ * a pointer. The prize is drawn on the server (`POST /v1/offers/claim`), so the wheel is told where
+ * to stop; the segments are equal, and say nothing about the odds. The angle math is ours, after
+ * spin-wheel's spinToItem (CrazyTim, MIT).
+ */
+
+import { restAngle } from './rules.js';
+
+const NS = 'http://www.w3.org/2000/svg';
+const SPIN_MS = 4500;
+const MAX_LABEL = 16;
+const ACCENT = 'var(--hp-accent,#111)';
+const ON_ACCENT = 'var(--hp-on-accent,#fff)';
+const BG = 'var(--hp-bg,#fff)';
+const TEXT = 'var(--hp-text,#111)';
+
+function make(tag, attrs = {}) {
+	const node = document.createElementNS(NS, tag);
+	for (const [key, value] of Object.entries(attrs))
+		node.setAttribute(key, String(value));
+	return node;
+}
+
+/** Colours as style, not attributes, so the theme's custom properties resolve. */
+function paint(node, fill, stroke, opacity = 1) {
+	node.style.fill = fill;
+	if (opacity < 1) node.style.fillOpacity = String(opacity);
+	if (stroke) node.style.stroke = stroke;
+	return node;
+}
+
+const reducedMotion = () =>
+	globalThis.matchMedia?.('(prefers-reduced-motion: reduce)')?.matches === true;
+
+const point = (deg, r = 1) => {
+	const rad = ((deg - 90) * Math.PI) / 180;
+	return `${(r * Math.cos(rad)).toFixed(4)} ${(r * Math.sin(rad)).toFixed(4)}`;
+};
+
+/**
+ * Draw the wheel for `prizes` (`[{ key, label }]`) into `container`. Null for fewer than two.
+ *
+ * @returns {{ spinTo(index: number): Promise<void>, remove(): void } | null}
+ */
+export function mountWheel(container, prizes) {
+	const labels = (Array.isArray(prizes) ? prizes : []).map((p) =>
+		String(p?.label ?? p?.key ?? ''),
+	);
+	const n = labels.length;
+	if (n < 2) return null;
+	const size = 360 / n;
+	const svg = make('svg', {
+		viewBox: '-1.2 -1.2 2.4 2.4',
+		role: 'img',
+		'aria-label': `Prize wheel: ${labels.join(', ')}`,
+	});
+	const wheel = make('g');
+	// Spun about its own box, the unit circle round 0 0. A view-box origin sits at the user space's
+	// 0 0, not the viewBox's corner, so 50% there is off centre and the wheel swings out of its rim.
+	wheel.style.transformBox = 'fill-box';
+	wheel.style.transformOrigin = '50% 50%';
+	// The accent, a tint of it over the background, and for an odd count a third tone, so no two
+	// neighbours match.
+	const tones = [
+		[1, ON_ACCENT],
+		[0.14, TEXT],
+		[0.72, ON_ACCENT],
+	];
+	wheel.append(paint(make('circle', { r: 1 }), BG));
+	const lights = [];
+	labels.forEach((label, i) => {
+		const [tone, ink] = tones[n % 2 === 1 && i === n - 1 ? 2 : i % 2];
+		wheel.append(
+			paint(
+				make('path', {
+					d: `M0 0L${point(i * size)}A1 1 0 ${size > 180 ? 1 : 0} 1 ${point((i + 1) * size)}Z`,
+					'stroke-width': 0.012,
+				}),
+				ACCENT,
+				BG,
+				tone,
+			),
+		);
+		// Along its slice's middle; on the left half turned about its own centre, so at rest no label
+		// reads upside down.
+		const angle = (i + 0.5) * size - 90;
+		const text = paint(
+			make('text', {
+				transform: `rotate(${angle}) translate(0.6 0)${angle > 90 && angle < 270 ? ' rotate(180)' : ''}`,
+				'text-anchor': 'middle',
+				'dominant-baseline': 'central',
+				'font-size': n > 6 ? 0.09 : 0.105,
+				'font-weight': 700,
+				'aria-hidden': 'true',
+			}),
+			ink,
+		);
+		text.textContent =
+			label.length > MAX_LABEL ? `${label.slice(0, MAX_LABEL - 1)}…` : label;
+		wheel.append(text);
+		for (const at of [i * size, (i + 0.5) * size]) {
+			const [cx, cy] = point(at, 1.075).split(' ');
+			lights.push(paint(make('circle', { cx, cy, r: 0.024 }), BG));
+		}
+	});
+	svg.append(
+		paint(make('circle', { r: 1.13 }), TEXT),
+		...lights,
+		wheel,
+		paint(make('circle', { r: 0.17, 'stroke-width': 0.035 }), BG, TEXT),
+		paint(make('circle', { r: 0.065 }), ACCENT),
+		paint(
+			make('path', {
+				d: 'M-0.12 -1.2L0.12 -1.2L0 -0.86Z',
+				'stroke-width': 0.03,
+				'stroke-linejoin': 'round',
+			}),
+			ACCENT,
+			BG,
+		),
+	);
+	container.append(svg);
+
+	return {
+		spinTo(index) {
+			const still = reducedMotion();
+			wheel.style.transition = still
+				? 'none'
+				: `transform ${SPIN_MS}ms cubic-bezier(.15,.7,.1,1)`;
+			wheel.style.transform = `rotate(${restAngle(index, labels.length, still ? 0 : 5)}deg)`;
+			if (still) return Promise.resolve();
+			return new Promise((resolve) => {
+				const done = setTimeout(resolve, SPIN_MS + 200);
+				wheel.addEventListener(
+					'transitionend',
+					() => {
+						clearTimeout(done);
+						resolve();
+					},
+					{ once: true },
+				);
+			});
+		},
+		remove: () => svg.remove(),
+	};
+}

package/src/onsite-facade.js

@@ -0,0 +1,99 @@
+/**
+ * `hp.onsite`: open (`show`) a form by hand, listen to the forms, keep the screen clear, or read why
+ * each form did or did not show, all callable before the onsite runtime has loaded. Listeners and
+ * suppressions wait on the page for the runtime. An `open` made before it started waits for it, and resolves with what
+ * the runtime did, or `false` once the page knows no runtime will start; nothing here throws.
+ */
+
+const CONTROLLER = Symbol.for('@thg-agentic/hyper-personalisation-web.onsite');
+const PENDING = Symbol.for(
+	'@thg-agentic/hyper-personalisation-web.onsite.pending',
+);
+const LISTENERS = Symbol.for(
+	'@thg-agentic/hyper-personalisation-web.onsite.listeners',
+);
+const SUPPRESSED = Symbol.for(
+	'@thg-agentic/hyper-personalisation-web.onsite.suppressed',
+);
+const EVENTS = ['shown', 'submitted', 'apply', 'closed'];
+const MAX_PENDING = 10;
+
+const page = () => (typeof window === 'undefined' ? null : window);
+
+/** No onsite runtime will start on this page: every `open` waiting for one resolves `false`. */
+export function dropPendingOpens() {
+	try {
+		for (const { resolve } of page()?.[PENDING]?.splice(0) ?? [])
+			resolve(false);
+	} catch {
+		/* never into the page */
+	}
+}
+
+export const onsite = Object.freeze({
+	/** Show the form on `slot` now, if its rules allow it. Resolves to whether it was shown. */
+	open(slot) {
+		try {
+			const w = page();
+			if (!w || typeof slot !== 'string') return Promise.resolve(false);
+			if (w[CONTROLLER]) return w[CONTROLLER].open(slot);
+			w[PENDING] ??= [];
+			if (w[PENDING].length < MAX_PENDING)
+				return new Promise((resolve) => w[PENDING].push({ slot, resolve }));
+		} catch {
+			/* never into the page */
+		}
+		return Promise.resolve(false);
+	},
+	/** The same as `open`, by the name the console's snippets use. */
+	show(slot) {
+		return onsite.open(slot);
+	},
+	/**
+	 * Listen to the forms: `shown`, `submitted` (`{ coupon }`: the claimed code for a form that
+	 * spins, else null), `apply` (`{ coupon }`: a reminder's code to apply) and `closed`
+	 * (`{ reason }`). Each detail carries the `slot`, `arm` and `format`. Returns a function that
+	 * stops listening.
+	 */
+	on(name, fn) {
+		try {
+			const w = page();
+			if (!w || !EVENTS.includes(name) || typeof fn !== 'function')
+				return () => {};
+			w[LISTENERS] ??= {};
+			(w[LISTENERS][name] ??= new Set()).add(fn);
+			return () => w[LISTENERS][name].delete(fn);
+		} catch {
+			return () => {};
+		}
+	},
+	/** Keep the screen clear, for `reason`: a form showing goes, quietly, and none shows until every reason is lifted. */
+	suppress(reason = 'page') {
+		try {
+			const w = page();
+			if (!w) return;
+			(w[SUPPRESSED] ??= new Set()).add(String(reason));
+			w[CONTROLLER]?.suppress();
+		} catch {
+			/* never into the page */
+		}
+	},
+	/** Lift `reason`, or every reason when none is given. */
+	unsuppress(reason) {
+		try {
+			const set = page()?.[SUPPRESSED];
+			if (reason === undefined) set?.clear();
+			else set?.delete(String(reason));
+		} catch {
+			/* never into the page */
+		}
+	},
+	/** Each form's eligibility on this page, and why: `[]` until the runtime has started. */
+	debug() {
+		try {
+			return page()?.[CONTROLLER]?.debug() ?? [];
+		} catch {
+			return [];
+		}
+	},
+});

package/src/onsite-loader.js

@@ -0,0 +1,5 @@
+/**
+ * The onsite runtime, as a separate chunk: a bundler splits this import out of the core, and the
+ * CDN build swaps this module for cdn/onsite-loader.js, which loads dist/onsite.min.js.
+ */
+export const loadOnsite = () => import('./onsite/index.js');

package/src/settings.js

@@ -156,6 +156,22 @@ function readAnonymousId(raw) {
 		: null;
 }
 
+/**
+ * The live onsite forms (`hp.onsite`), or null when there are none. Only the shape is checked here:
+ * ./onsite reads each form itself, so the core never grows with the forms' rules.
+ */
+function readOnsite(raw) {
+	const forms = Array.isArray(raw?.forms) ? raw.forms.filter(isObject) : [];
+	if (forms.length === 0) return null;
+	return {
+		forms,
+		capture: isObject(raw.capture) ? raw.capture : null,
+		...(Number.isInteger(raw.overlay_gap_minutes)
+			? { overlay_gap_minutes: raw.overlay_gap_minutes }
+			: {}),
+	};
+}
+
 /**
  * Whether a 2xx body is a settings answer at all: an `hp` block saying on or off. Anything else (a
  * captive portal's page, a proxy's error) is no answer, so the last good settings and what was
@@ -174,6 +190,7 @@ export function isSettingsAnswer(body) {
 export function readSettings(body) {
 	const hp = isObject(body) ? body.hp : null;
 	if (!isObject(hp) || hp.enabled !== true) return DISABLED;
+	const onsite = readOnsite(hp.onsite);
 	return {
 		enabled: true,
 		propertyId:
@@ -192,6 +209,7 @@ export function readSettings(body) {
 		// The share of visitors sent for (3.18). Anything that is not a share sends for everyone.
 		sampleRate: isFraction(hp.sampleRate) ? hp.sampleRate : 1,
 		debug: readDebug(hp.debug),
+		...(onsite && { onsite }),
 		plan:
 			isObject(body.plan) && isObject(body.plan.track)
 				? { track: body.plan.track }

package/src/spec-version.js

@@ -1,4 +1,4 @@
 // Generated from the spec by scripts/build-types.mjs. DO NOT EDIT: run `pnpm run build:types`.
 
 /** The event specification this SDK emits, stamped on every event as context.spec.version. */
-export const SPEC_VERSION = '1.16';
+export const SPEC_VERSION = '1.18';

package/src/storage-scope.js

@@ -59,6 +59,11 @@ export const DEFAULT_STORAGE_NAMES = Object.freeze({
 	 * (`?hp_debug=`), checked against the settings on every page (3.18).
 	 */
 	debug: 'thg_hp_debug',
+	/**
+	 * localStorage and sessionStorage, per property: onsite forms' opaque counters per slot (shown,
+	 * last closed, submitted) and a subscribed flag. Never contact data (onsite).
+	 */
+	onsite: 'thg_hp_onsite',
 });
 
 /**

package/src/version.js

@@ -1,2 +1,2 @@
-export const VERSION = '3.22.2';
+export const VERSION = '3.23.0';
 export const LIB = '@thg-agentic/hyper-personalisation-web';

package/types/bootstrap.d.ts

@@ -19,6 +19,7 @@ import type {
 	PageType,
 	StorageNames,
 } from './index';
+import type { OnsiteFacade, OnsiteOptions, OnsiteSettings } from './onsite';
 
 /** Everything the page itself configures: the rest is the tenant's, and comes from settings. */
 export interface HpConfig {
@@ -68,6 +69,8 @@ export interface SettingsResponse {
 			string,
 			{ share: number; salt: string; readoutSlots?: string[] }
 		>;
+		/** The live onsite forms (ADR 0064). Started only for a page that passes `onsite`. */
+		onsite?: OnsiteSettings;
 	};
 }
 
@@ -148,6 +151,17 @@ export interface BootstrapOptions {
 	settings?: SettingsResponse;
 	/** createAnalytics options that are functions, e.g. getRecommendations or getExtensions. */
 	extend?: Partial<AnalyticsOptions>;
+	/**
+	 * Onsite forms: `true` (or the options) loads `./onsite` as a separate chunk when the settings
+	 * have a live form, and starts it. Absent or false: never loaded.
+	 */
+	onsite?: boolean | OnsiteOptions;
+}
+
+/** The client bootstrap resolves to: the lower-level client, plus `onsite`. */
+export interface BootstrappedClient extends AnalyticsClient {
+	/** Open a form by hand, or read why each form did or did not show (`[]` before it started). */
+	onsite: OnsiteFacade;
 }
 
 /**
@@ -157,7 +171,7 @@ export interface BootstrapOptions {
 export declare function bootstrap(
 	config: HpConfig,
 	options: BootstrapOptions,
-): Promise<AnalyticsClient | null>;
+): Promise<BootstrappedClient | null>;
 /** Every reason the config and options cannot be used; empty when they can. */
 export declare function validateConfig(
 	config: unknown,

package/types/events.d.ts

@@ -1,7 +1,7 @@
 // Generated from spec/registry.json by scripts/generate-sdk-models.mjs.
 // DO NOT EDIT. Change the schema and regenerate — the schema is the contract,
 // and a hand-edit here is an SDK that disagrees with the ingest.
-// Spec version: 1.16
+// Spec version: 1.18
 
 /** context.source.environment. Environment the producer runs in. */
 export type CdpSourceEnvironment = 'production' | 'staging' | 'development';
@@ -76,12 +76,28 @@ export interface DecisionMade {
 	latency_ms?: number | null;
 }
 
-/** A visitor acted on a personalised surface: clicked it (for example opened a product from a rail) or dismissed it. */
+/** A triggered journey fired for one shopper: an entry event happened, the journey's delay passed, its exit event did not happen, and the shopper passed its gates (marketing consent, suppression, frequency cap, quiet hours). */
+export interface JourneyTriggered {
+	trigger_id: string;
+	journey: string;
+	entry_event: string;
+	entry_message_id: string;
+	entry_at: string;
+	delay_seconds: number;
+	holdout: boolean;
+	holdout_share?: number | null;
+	cart_id?: string | null;
+	currency?: string | null;
+	products?: CdpProduct[];
+}
+
+/** A visitor acted on a personalised surface: clicked it (for example opened a product from a rail), dismissed it, or submitted a step of an onsite form. */
 export interface SlotEngaged {
 	decision_id: string;
 	slot: string;
-	engagement: 'view' | 'click' | 'dismiss';
+	engagement: 'view' | 'click' | 'dismiss' | 'submit';
 	arm?: string | null;
+	step?: string | null;
 	position?: number | null;
 	products?: CdpProduct[] | null;
 }
@@ -432,13 +448,18 @@ export interface SignedUp {
 /** The shopper signed out. */
 export type SignedOut = Record<string, never>;
 
-/** The shopper opted in to marketing messages on the site or in the app, for example through a footer form, a modal, or a checkbox at checkout or in their account. */
+/** The shopper opted in to marketing messages on the site or in the app, for example through a footer form, an onsite sign-up form, or a checkbox at checkout or in their account. */
 export interface NewsletterSubscribed {
 	email_sha256: string;
 	requires_verification?: boolean | null;
 	placement?: string | null;
 	channel?: 'email' | 'sms' | 'post' | 'push' | null;
 	phone_sha256?: string | null;
+	slot?: string | null;
+	arm?: string | null;
+	decision_id?: string | null;
+	receipt_id?: string | null;
+	consent_text?: string | null;
 }
 
 /** A shopper submitted a review of a product. */
@@ -630,12 +651,47 @@ export interface ApplicationUpdated {
 	build: string;
 }
 
+/** The shopper answered a preference question, for example what they are shopping for or which categories they want to hear about. */
+export interface PreferencesStated {
+	question: string;
+	values: string[];
+	source: 'onsite' | 'account' | 'quiz';
+	slot?: string | null;
+	arm?: string | null;
+	decision_id?: string | null;
+	step?: string | null;
+}
+
+/** A shopper who signed up through an onsite form claimed its offer, for example the prize of a spin-to-win or a welcome discount. */
+export interface OfferClaimed {
+	slot: string;
+	prize: string;
+	email_sha256: string;
+	fallback: boolean;
+	arm?: string | null;
+	decision_id?: string | null;
+	pool?: string | null;
+	code_sha256?: string | null;
+}
+
+/** Hyper-Personalisation delivered a sign-up from an onsite form to one of the brand's systems of record, such as its account service or its email platform, or gave up trying. */
+export interface SignUpRelayed {
+	receipt_id: string;
+	destination: string;
+	kind: 'thg' | 'listrak' | 'klaviyo' | 'webhook';
+	outcome: 'delivered' | 'duplicate' | 'verify' | 'failed';
+	attempts: number;
+	email_sha256?: string | null;
+	phone_sha256?: string | null;
+}
+
 /** The spec version these models implement. SDKs stamp it on context.spec.version. */
-export const SPEC_VERSION = '1.16';
+export const SPEC_VERSION = '1.18';
 
 /** Every event name the registry accepts. Anything else is rejected at the ingest. */
 export type CdpEventName =
 	| 'Decision Made'
+	| 'Journey Triggered'
 	| 'Slot Engaged'
 	| 'Recommendations Viewed'
 	| 'Promotion Viewed'
@@ -690,11 +746,15 @@ export type CdpEventName =
 	| 'Application Opened'
 	| 'Application Backgrounded'
 	| 'Application Updated'
+	| 'Preferences Stated'
+	| 'Offer Claimed'
+	| 'Sign-up Relayed'
 ;
 
 /** Event name -> its properties, so a generic emitter stays type-safe. */
 export interface CdpEventProperties {
 	'Decision Made': DecisionMade;
+	'Journey Triggered': JourneyTriggered;
 	'Slot Engaged': SlotEngaged;
 	'Recommendations Viewed': RecommendationsViewed;
 	'Promotion Viewed': PromotionViewed;
@@ -749,6 +809,9 @@ export interface CdpEventProperties {
 	'Application Opened': ApplicationOpened;
 	'Application Backgrounded': ApplicationBackgrounded;
 	'Application Updated': ApplicationUpdated;
+	'Preferences Stated': PreferencesStated;
+	'Offer Claimed': OfferClaimed;
+	'Sign-up Relayed': SignUpRelayed;
 }
 
 /** Which producers the registry permits for each event. Emitting from another is refused. */

package/types/hp.d.ts

@@ -4,6 +4,7 @@ import type {
 	CallOptions,
 	RecommendationContext,
 } from './index';
+import type { OnsiteFacade } from './onsite';
 
 type Methods = {
 	[K in keyof AnalyticsClient as AnalyticsClient[K] extends (
@@ -40,7 +41,7 @@ interface HpTrack {
  * into the caller.
  */
 export declare const hp: {
-	[K in Exclude<keyof Methods, 'track' | 'recommendationContext'>]: (
+	[K in Exclude<keyof Methods, 'track' | 'recommendationContext' | 'onsite'>]: (
 		...args: Parameters<Methods[K]>
 	) => void;
 } & {
@@ -61,4 +62,6 @@ export declare const hp: {
 	 * client has started, and without personalisation consent. Since 3.11.
 	 */
 	recommendationContext(): RecommendationContext;
+	/** Onsite forms: `hp.onsite.open(slot)` opens a form by hand; `debug()` says why each did or did not show. */
+	onsite: OnsiteFacade;
 };

package/types/index.d.ts

@@ -22,6 +22,7 @@ import type {
 	NewsletterUnsubscribed,
 	PaymentInfoEntered,
 	PersonalisationExposed,
+	PreferencesStated,
 	ProductAdded,
 	ProductAddedToWishlist,
 	ProductClicked,
@@ -335,6 +336,11 @@ export interface AnalyticsClient {
 	newsletterSubscribed: Emit<NewsletterSubscribed>;
 	/** An on-site opt-out. The ESP reports its own as Email Unsubscribed. */
 	newsletterUnsubscribed: Emit<NewsletterUnsubscribed>;
+	/**
+	 * Answers to an approved preference question (spec 1.18). Answers sent with an onsite sign-up are
+	 * the gateway's to report, so never send those.
+	 */
+	preferencesStated: Emit<PreferencesStated>;
 	/** An alert request for one product: back in stock, a price drop or a launch. */
 	backInStockSubscribed: Emit<BackInStockSubscribed>;
 	productReviewed: Emit<ProductReviewed>;
@@ -436,6 +442,10 @@ export interface ServingBody {
 		 * computes it from the settings. `default` is no decision and is not put in force. Since 3.16.
 		 */
 		variant?: 'bandit' | 'default';
+		/** The A/B test the arm was assigned in, when the slot runs one. Since 3.23. */
+		experiment?: string;
+		/** The test's split token, sent back with the pin. Since 3.23. */
+		split?: string;
 	}>;
 	recommendation_request_id?: string;
 }

package/types/onsite-preview.d.ts

@@ -0,0 +1,58 @@
+/** A question the form's settings publish, as the preview renders it. */
+export interface PreviewQuestion {
+	key: string;
+	type?: 'one' | 'many' | 'date' | 'number';
+	label?: string;
+	/** A choice's options. */
+	options?: Array<{ value: string; label?: string }>;
+	/** A date's or a number's format, as the settings publish it. */
+	format?: {
+		kind?: 'birthday' | 'date';
+		year?: 'none' | 'optional' | 'required';
+		min?: number;
+		max?: number;
+		decimals?: boolean;
+		unit?: string;
+	};
+}
+
+export interface PreviewOptions {
+	/** The step to show; the first when left out or unknown. */
+	step?: string;
+	/** The small-screen layout (`mobile`) or the large one, whatever the host's own width. */
+	device?: 'desktop' | 'mobile';
+	/** The form's consent text; a sample sentence when left out. */
+	consentText?: string;
+	/** The consent text a step taking a phone number shows; a sample sentence when left out. */
+	smsConsentText?: string;
+	/**
+	 * The form's language (the settings' `locale`, e.g. `en-GB`): a birthday's field order and month
+	 * names, and a phone field's first country. The page's `<html lang>` when left out.
+	 */
+	locale?: string;
+	questions?: PreviewQuestion[];
+	prizes?: Array<{ key: string; label: string }>;
+	/** The basket a progress block is drawn against; 32 when left out. */
+	basketValue?: number;
+}
+
+export interface OnsitePreview {
+	/** Re-render, on the step shown unless `options.step` names another. */
+	update(creative: unknown, options?: PreviewOptions): void;
+	destroy(): void;
+	/** The step on screen, or null when the creative could not be read. */
+	step(): string | null;
+}
+
+/**
+ * Render a creative with the shoppers' renderer inside `host`, for the console: no request, no
+ * event, no counter; its buttons only move between steps.
+ */
+export declare function mountPreview(
+	host: HTMLElement,
+	creative: unknown,
+	options?: PreviewOptions,
+): OnsitePreview;
+
+/** The countries a phone field's country code picker offers, by ISO code, with their calling codes. */
+export declare const CALLING_CODES: Readonly<Record<string, string>>;

package/types/onsite-wheel.d.ts

@@ -0,0 +1,11 @@
+export interface OnsiteWheel {
+	/** Turn to the prize at `index`, the one the server drew. Instant under reduced motion. */
+	spinTo(index: number): Promise<void>;
+	remove(): void;
+}
+
+/** Draw the prize wheel into `container`. Null for fewer than two prizes. */
+export declare function mountWheel(
+	container: Element,
+	prizes: Array<{ key: string; label: string }>,
+): OnsiteWheel | null;