@incodetech/web 2.3.2 → 2.4.0-rc.0

package/dist/spacer-CRMb016O.js

@@ -0,0 +1,741 @@
+import { r as __toESM } from "./rolldown-runtime--E5BIlTp.js";
+import { o as useTranslation, r as useUiConfig } from "./uiConfig-CzjzpmLx.js";
+import { _ as y, b as Q, c as A, d as _, f as d, g as x, h as q, u as T, v as u } from "./vendor-preact-C0jX1Cbq.js";
+//#region src/styles/cn.tsx
+var cn = (...classes) => {
+	const result = [];
+	for (const cls of classes) {
+		if (!cls) continue;
+		if (typeof cls === "string") result.push(cls);
+		else if (typeof cls === "object") {
+			for (const [key, value] of Object.entries(cls)) if (value) result.push(key);
+		}
+	}
+	return result.join(" ");
+};
+//#endregion
+//#region src/shared/assets/instanceOverrides.ts
+var InstanceOverridesContext = Q({});
+var InstanceOverridesProvider = InstanceOverridesContext.Provider;
+function useInstanceOverrides() {
+	return x(InstanceOverridesContext);
+}
+//#endregion
+//#region src/shared/assets/assetRegistry.ts
+var defaultExport = (module) => module.default;
+var decorative = { ariaHidden: true };
+var assetRegistry = {
+	"faceMatch.success": { a11y: decorative },
+	"faceMatch.fail": { a11y: decorative },
+	"documentCapture.tutorial": { a11y: decorative },
+	"id.uploadScreen": { a11y: decorative },
+	"id.ageVerification.dob": { a11y: decorative },
+	"id.ageVerification.scan": { a11y: decorative },
+	"id.ageVerification.privacy": { a11y: decorative },
+	"videoSelfie.success": { a11y: decorative },
+	"videoSelfie.fail": { a11y: decorative },
+	"videoSelfie.tutorial.permission": { a11y: decorative },
+	"videoSelfie.tutorial.selfie": { a11y: decorative },
+	"videoSelfie.tutorial.frontId": { a11y: decorative },
+	"videoSelfie.tutorial.backId": { a11y: decorative },
+	"videoSelfie.tutorial.poa": { a11y: decorative },
+	"videoSelfie.tutorial.questions": { a11y: decorative },
+	"videoSelfie.tutorial.speech": { a11y: decorative },
+	"loader.spinner": { a11y: decorative }
+};
+var animationRegistry = {
+	"id.tutorial.front": {
+		default: () => import("./id-tutorial-DM9Pkfs-.js").then(defaultExport),
+		a11y: decorative
+	},
+	"id.tutorial.back": {
+		default: () => import("./back-tutorial-CZrMmj1_.js").then(defaultExport),
+		a11y: decorative
+	},
+	"id.tutorial.passport": {
+		default: () => import("./passport-tutorial-CKZZuDf_.js").then(defaultExport),
+		a11y: decorative
+	},
+	"id.flip": {
+		default: () => import("./flip-animation-BU5LNKYx.js").then(defaultExport),
+		a11y: decorative
+	},
+	"id.processing": {
+		default: {
+			horizontal: () => import("./id-laser-h-Dr-hBxrq.js").then(defaultExport),
+			vertical: () => import("./id-laser-v-D_r0QNY8.js").then(defaultExport)
+		},
+		a11y: decorative
+	},
+	"selfie.tutorial": {
+		default: () => import("./selfieTutorial-Dz6lDFMn.js").then(defaultExport),
+		a11y: decorative
+	},
+	"loader.spinner": {
+		default: null,
+		a11y: decorative
+	}
+};
+//#endregion
+//#region src/shared/assets/devWarn.ts
+/**
+* Emits a namespaced `console.warn` in development only. Override load
+* failures and bad catalog keys are non-fatal (we always fall back to a
+* built-in default), so they must never surface in production consoles.
+*/
+function devWarn(message, error) {}
+//#endregion
+//#region src/shared/assets/resolveAsset.ts
+/**
+* Whether a resolved value represents an active override, as opposed to no
+* override at all (`type === 'default'`).
+*/
+function isActiveOverride(resolved) {
+	return resolved !== null && resolved.type !== "default";
+}
+function warnUnknownKey(key) {
+	`${key}`;
+}
+function isValidUrl(url) {
+	const SCHEME_PREFIX = /^[a-zA-Z][a-zA-Z0-9+.-]*:/;
+	if (url === "" || /\s/.test(url)) return false;
+	if (!SCHEME_PREFIX.test(url)) return true;
+	try {
+		new URL(url);
+		return true;
+	} catch {
+		return false;
+	}
+}
+function normalizeAssetOverride(override) {
+	if (override === void 0) return null;
+	if (typeof override === "string") {
+		const value = override.trim();
+		if (value === "") return null;
+		if (value.startsWith("<")) return {
+			type: "override-raw",
+			raw: value
+		};
+		if (!isValidUrl(value)) return null;
+		return {
+			type: "override-url",
+			url: value
+		};
+	}
+	if ("svg" in override) return {
+		type: "override-component",
+		component: override.svg
+	};
+	if ("raw" in override) {
+		const raw = override.raw.trim();
+		return raw === "" ? null : {
+			type: "override-raw",
+			raw
+		};
+	}
+	if ("url" in override) {
+		const url = override.url.trim();
+		if (url === "") return null;
+		if (!isValidUrl(url)) return null;
+		return {
+			type: "override-url",
+			url
+		};
+	}
+	return null;
+}
+function normalizeAnimationOverride(override) {
+	if (override === void 0) return null;
+	if ("url" in override) {
+		const url = override.url.trim();
+		if (url === "") return null;
+		if (!isValidUrl(url)) return null;
+		return {
+			type: "override-url",
+			url
+		};
+	}
+	if ("animationData" in override) return {
+		type: "override-data",
+		animationData: override.animationData
+	};
+	return {
+		type: "override-data",
+		animationData: override
+	};
+}
+function resolveAsset(key, scopes = {}) {
+	scopes.instance;
+	scopes.global;
+	const entry = assetRegistry[key];
+	if (entry === void 0) {
+		warnUnknownKey(key);
+		return null;
+	}
+	const override = normalizeAssetOverride(scopes.instance?.[key]) ?? normalizeAssetOverride(scopes.global?.[key]);
+	if (override !== null) return {
+		...override,
+		a11y: entry.a11y
+	};
+	return {
+		type: "default",
+		a11y: entry.a11y
+	};
+}
+function resolveAnimation(key, scopes = {}) {
+	scopes.instance;
+	scopes.global;
+	const entry = animationRegistry[key];
+	if (entry === void 0) {
+		warnUnknownKey(key);
+		return null;
+	}
+	const override = normalizeAnimationOverride(scopes.instance?.[key]) ?? normalizeAnimationOverride(scopes.global?.[key]);
+	if (override !== null) return {
+		...override,
+		a11y: entry.a11y
+	};
+	return {
+		type: "default",
+		default: entry.default,
+		a11y: entry.a11y
+	};
+}
+//#endregion
+//#region src/shared/assets/useAsset.ts
+function useAsset(key) {
+	const instance = useInstanceOverrides();
+	const uiConfig = useUiConfig();
+	return T(() => {
+		return resolveAsset(key, {
+			instance: instance.assets,
+			global: uiConfig.assets
+		});
+	}, [
+		key,
+		instance.assets,
+		uiConfig.assets
+	]);
+}
+function useAnimation(key) {
+	const instance = useInstanceOverrides();
+	const uiConfig = useUiConfig();
+	return T(() => {
+		return resolveAnimation(key, {
+			instance: instance.animations,
+			global: uiConfig.animations
+		});
+	}, [
+		key,
+		instance.animations,
+		uiConfig.animations
+	]);
+}
+//#endregion
+//#region src/shared/assets/asset.tsx
+function altText(a11y, t) {
+	return "altKey" in a11y ? t(a11y.altKey) : "";
+}
+function svgA11y(a11y, t) {
+	return "altKey" in a11y ? {
+		role: "img",
+		"aria-label": t(a11y.altKey)
+	} : { "aria-hidden": "true" };
+}
+/**
+* Normalizes the call-site `default` into a renderable shape. Trusted (it is a
+* bundled SDK asset), so raw markup is not sanitized — unlike a customer raw
+* override.
+*/
+function defaultToRenderable(value) {
+	if (value === void 0) return null;
+	if (typeof value === "function") return {
+		kind: "component",
+		value
+	};
+	return value.trim().startsWith("<") ? {
+		kind: "raw",
+		value
+	} : {
+		kind: "url",
+		value
+	};
+}
+/**
+* Sanitizes a raw override with DOMPurify, loaded on first use. Only raw SVG
+* overrides need it, and `Asset` renders in every module (the loader
+* spinner), so a static import would ship it everywhere. Returns `null` while
+* it loads. A failed load counts as markup that sanitizes to nothing, so the
+* caller falls back to the built-in default.
+*/
+function useSanitizedSvg(raw) {
+	const [result, setResult] = d(null);
+	y(() => {
+		if (raw === null) return;
+		let active = true;
+		import("./sanitizeSvg-BC-qLUgS.js").then(({ sanitizeSvg }) => sanitizeSvg(raw)).catch(() => ({
+			markup: "",
+			strippedHref: false
+		})).then((svg) => {
+			if (active) setResult({
+				raw,
+				svg
+			});
+		});
+		return () => {
+			active = false;
+		};
+	}, [raw]);
+	return result?.raw === raw ? result.svg : null;
+}
+function useAssetContent(key, defaultAsset, onFallback) {
+	const resolved = useAsset(key);
+	const [failedUrl, setFailedUrl] = d(null);
+	const rawOverride = resolved?.type === "override-raw" ? resolved.raw : null;
+	const sanitizedRaw = useSanitizedSvg(rawOverride);
+	const urlFailed = resolved?.type === "override-url" && resolved.url === failedUrl;
+	const rawStripped = sanitizedRaw !== null && (sanitizedRaw.strippedHref || sanitizedRaw.markup.trim() === "");
+	y(() => {
+		if (urlFailed || rawStripped) onFallback?.();
+	}, [
+		urlFailed,
+		rawStripped,
+		onFallback
+	]);
+	if (resolved === null || rawOverride !== null && sanitizedRaw === null) return null;
+	const useDefault = resolved.type === "default" || urlFailed || rawStripped;
+	const { a11y } = resolved;
+	if (!useDefault) switch (resolved.type) {
+		case "override-component": return {
+			content: {
+				kind: "component",
+				value: resolved.component
+			},
+			a11y
+		};
+		case "override-url": return {
+			content: {
+				kind: "url",
+				value: resolved.url,
+				onError: () => setFailedUrl(resolved.url)
+			},
+			a11y
+		};
+		case "override-raw": return {
+			content: {
+				kind: "raw",
+				value: sanitizedRaw?.markup ?? ""
+			},
+			a11y
+		};
+	}
+	const content = defaultToRenderable(defaultAsset);
+	return content ? {
+		content,
+		a11y
+	} : null;
+}
+function renderAsset(content, a11y, t, className) {
+	switch (content.kind) {
+		case "component": {
+			const Svg = content.value;
+			return /* @__PURE__ */ u(Svg, {
+				class: className,
+				...svgA11y(a11y, t)
+			});
+		}
+		case "url": return /* @__PURE__ */ u("img", {
+			src: content.value,
+			alt: altText(a11y, t),
+			"aria-hidden": "altKey" in a11y ? void 0 : "true",
+			class: className,
+			onError: content.onError
+		});
+		case "raw": return /* @__PURE__ */ u("span", {
+			class: cn("IncodeAssetRaw", className),
+			...svgA11y(a11y, t),
+			dangerouslySetInnerHTML: { __html: content.value }
+		});
+		default: return content;
+	}
+}
+/**
+* Renders a branded illustration by catalog key, honoring the resolved
+* precedence (per-instance → global → built-in default). The built-in default
+* is supplied by the call site via `default` (imported on-site).
+*/
+function Asset({ name, class: className, default: defaultAsset, onFallback }) {
+	const { t } = useTranslation();
+	const result = useAssetContent(name, defaultAsset, onFallback);
+	if (result === null) return null;
+	return renderAsset(result.content, result.a11y, t, className);
+}
+//#endregion
+//#region src/shared/lottie/lottie.tsx
+var lottiePromise = null;
+async function loadLottie() {
+	if (lottiePromise) return lottiePromise;
+	lottiePromise = import("./lottie_light-aMg9Q9iO.js").then((m) => /* @__PURE__ */ __toESM(m.default, 1)).then((mod) => mod.default);
+	return lottiePromise;
+}
+var AUTO_STOP_AFTER_MS = 5e3;
+function Lottie({ animationData, loop = true, autoplay = true, reverse = false, style, className, onComplete, autoStop = false, stopFramePosition }) {
+	const containerRef = A(null);
+	const effectiveAutoplay = reverse ? false : autoplay;
+	const animationOptionsRef = A({
+		container: containerRef.current,
+		renderer: "svg",
+		loop,
+		autoplay: effectiveAutoplay,
+		animationData
+	});
+	y(() => {
+		animationOptionsRef.current = {
+			container: containerRef.current,
+			renderer: "svg",
+			loop,
+			autoplay: effectiveAutoplay,
+			animationData
+		};
+	}, [
+		animationData,
+		loop,
+		effectiveAutoplay
+	]);
+	y(() => {
+		if (!containerRef.current) return;
+		let anim;
+		let stopTimer;
+		let isMounted = true;
+		loadLottie().then((lottie) => {
+			if (!isMounted) return;
+			anim = lottie.loadAnimation(animationOptionsRef.current);
+			if (reverse) {
+				anim.setDirection(-1);
+				anim.goToAndPlay(anim.totalFrames - 1, true);
+			}
+			if (onComplete) anim.addEventListener("complete", onComplete);
+			if (autoStop) stopTimer = window.setTimeout(() => {
+				const current = anim;
+				if (!current) return;
+				if (!stopFramePosition) {
+					current.pause();
+					return;
+				}
+				const totalFrames = current.totalFrames;
+				if (!totalFrames || totalFrames <= 0) {
+					current.stop();
+					return;
+				}
+				const targetFrame = stopFramePosition === "last" ? Math.max(totalFrames - 1, 0) : stopFramePosition === "first" ? 0 : Math.floor((totalFrames - 1) / 2);
+				current.goToAndStop(targetFrame, true);
+			}, AUTO_STOP_AFTER_MS);
+		});
+		return () => {
+			isMounted = false;
+			if (stopTimer !== void 0) window.clearTimeout(stopTimer);
+			if (anim) {
+				if (onComplete) anim.removeEventListener("complete", onComplete);
+				anim.destroy();
+			}
+		};
+	}, [
+		onComplete,
+		reverse,
+		autoStop,
+		stopFramePosition
+	]);
+	return /* @__PURE__ */ u("div", {
+		ref: containerRef,
+		style,
+		className,
+		"aria-hidden": "true"
+	});
+}
+//#endregion
+//#region src/shared/assets/animatedAsset.tsx
+var overrideUrlCache = /* @__PURE__ */ new Map();
+function fetchAnimation(url) {
+	const cached = overrideUrlCache.get(url);
+	if (cached) return cached;
+	const pending = fetch(url).then((response) => {
+		if (!response.ok) throw new Error(`Request for "${url}" failed with status ${response.status}.`);
+		return response.json();
+	});
+	overrideUrlCache.set(url, pending);
+	pending.catch(() => overrideUrlCache.delete(url));
+	return pending;
+}
+function loadAnimationDefault(def, orientation) {
+	if (def === null) return Promise.resolve(null);
+	if (typeof def === "function") return def();
+	return def[orientation]();
+}
+var defaultCache = /* @__PURE__ */ new Map();
+function defaultCacheKey(name, orientation) {
+	return `${name}|${orientation}`;
+}
+function loadDefaultCached(name, orientation) {
+	const cacheKey = defaultCacheKey(name, orientation);
+	if (defaultCache.has(cacheKey)) return Promise.resolve(defaultCache.get(cacheKey) ?? null);
+	return loadAnimationDefault(animationRegistry[name]?.default ?? null, orientation).then((value) => {
+		defaultCache.set(cacheKey, value);
+		return value;
+	});
+}
+/**
+* Warms the built-in animation cache for the given catalog keys so a later
+* render is synchronous (no flash). Best-effort; call it before the screen
+* mounts.
+*/
+function preloadAnimations(keys, orientation = "vertical") {
+	for (const key of keys) loadDefaultCached(key, orientation).catch(() => {});
+}
+/**
+* Resolves the winning animation to parsed `animationData` plus whether it came
+* from a customer override. Reads the default cache synchronously on first
+* render, so a preloaded animation shows with no flash. A failed override URL
+* silently falls back to the built-in default.
+*
+* Shared by `AnimatedAsset` and by tutorial surfaces that render Lottie
+* themselves (e.g. `BaseTutorial`, which recolors only built-in defaults).
+*
+* `onFallback`, if given, fires only when a *configured* override actually
+* fails to load (never when there was simply no override to begin with) —
+* for a caller whose true fallback lives outside this system entirely, so it
+* can react to a real failure instead of committing to render this component before
+* knowing whether the override will actually work.
+*/
+function useAnimationData(name, orientation = "vertical", onFallback) {
+	const resolved = useAnimation(name);
+	const type = resolved?.type;
+	const isOverride = isActiveOverride(resolved);
+	const overrideUrl = resolved?.type === "override-url" ? resolved.url : void 0;
+	const overrideData = resolved?.type === "override-data" ? resolved.animationData : void 0;
+	const [data, setData] = d(() => {
+		if (type === "override-data") return overrideData ?? null;
+		if (type === "default") return defaultCache.get(defaultCacheKey(name, orientation)) ?? null;
+		return null;
+	});
+	const [overrideFailed, setOverrideFailed] = d(false);
+	y(() => {
+		let active = true;
+		setOverrideFailed(false);
+		if (type === void 0) setData(null);
+		else if (type === "override-data") setData(overrideData ?? null);
+		else if (type === "override-url" && overrideUrl !== void 0) fetchAnimation(overrideUrl).then((value) => {
+			if (active) setData(value);
+		}, (error) => {
+			`${name}`;
+			if (active) {
+				setOverrideFailed(true);
+				loadDefaultCached(name, orientation).then((value) => {
+					if (active) setData(value);
+				}, () => {});
+			}
+		});
+		else loadDefaultCached(name, orientation).then((value) => {
+			if (active) setData(value);
+		}, (error) => {
+			if (active) {
+				setData(null);
+				`${name}`;
+			}
+		});
+		return () => {
+			active = false;
+		};
+	}, [
+		name,
+		orientation,
+		type,
+		overrideUrl,
+		overrideData
+	]);
+	y(() => {
+		if (overrideFailed) onFallback?.();
+	}, [overrideFailed, onFallback]);
+	return {
+		data,
+		isOverride
+	};
+}
+/**
+* Renders a Lottie animation by catalog key, honoring the resolved precedence
+* (per-instance → global → built-in default). Renders nothing while pending or
+* when there is no Lottie to show; the container is `aria-hidden` (all catalog
+* animations are decorative).
+*/
+function AnimatedAsset({ name, autoStop, stopFramePosition, orientation = "vertical", loop, reverse, onComplete, class: className, onFallback }) {
+	const { data } = useAnimationData(name, orientation, onFallback);
+	if (data === null) return null;
+	return /* @__PURE__ */ u(Lottie, {
+		animationData: data,
+		autoStop,
+		stopFramePosition,
+		loop,
+		reverse,
+		onComplete,
+		className
+	});
+}
+//#endregion
+//#region src/shared/loader/loadingIcon.tsx
+/**
+* Duration of the CSS spin animation on `.IncodeLoadingIcon`.
+* Must stay in sync with the `animation-duration` declared in the stylesheet.
+*/
+var SPIN_DURATION_MS = 1e3;
+var SpinnerPrimary = ({ size, className }) => {
+	return /* @__PURE__ */ u("svg", {
+		width: size,
+		height: size,
+		viewBox: "0 0 31 31",
+		fill: "none",
+		xmlns: "http://www.w3.org/2000/svg",
+		class: cn("IncodeLoadingIconPrimaryIcon", className),
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ u("path", { d: "M28.161 15.284c1.292 0 2.358-1.054 2.157-2.33A15 15 0 0 0 17.83.466c-1.276-.2-2.329.865-2.329 2.156s1.06 2.313 2.319 2.603a10.32 10.32 0 0 1 7.74 7.74c.29 1.259 1.31 2.319 2.602 2.319Z" })
+	});
+};
+var SpinnerSecondary = ({ size, className }) => {
+	return /* @__PURE__ */ u("svg", {
+		width: size,
+		height: size,
+		viewBox: "0 0 31 31",
+		fill: "none",
+		xmlns: "http://www.w3.org/2000/svg",
+		class: cn("IncodeLoadingIconSecondaryIcon", className),
+		"aria-hidden": "true",
+		children: [/* @__PURE__ */ u("title", { children: "Spinner Outer part" }), /* @__PURE__ */ u("path", { d: "M30.5 15.284c0 8.284-6.716 15-15 15s-15-6.716-15-15c0-8.285 6.716-15 15-15s15 6.715 15 15Zm-25.323 0c0 5.7 4.622 10.322 10.323 10.322s10.323-4.621 10.323-10.322S21.2 4.96 15.5 4.96 5.177 9.583 5.177 15.284Z" })]
+	});
+};
+var LoadingIcon = ({ size = 30, secondaryClass, primaryClass }) => {
+	const ref = A(null);
+	const overrideRef = A(null);
+	const animation = useAnimation("loader.spinner");
+	const svg = useAsset("loader.spinner");
+	const hasAnimationOverride = isActiveOverride(animation);
+	const hasSvgOverride = isActiveOverride(svg);
+	const [overrideFailed, setOverrideFailed] = d(false);
+	const handleFallback = q(() => setOverrideFailed(true), []);
+	const hasOverride = (hasAnimationOverride || hasSvgOverride) && !overrideFailed;
+	/**
+	* Cross-module loaders (e.g. ID processing → selfie initialising) unmount
+	* and remount this component as the user moves between flow steps. By
+	* default each remount restarts the CSS spin animation from frame 0, which
+	* reads as a visible "stutter" or reset of the spinner during otherwise
+	* seamless transitions.
+	*
+	* To keep the rotation continuous across remounts we anchor the animation
+	* to a wall-clock offset: `performance.now() % SPIN_DURATION_MS` tells us
+	* how far into the current spin cycle we are, and applying it as a
+	* negative `animation-delay` makes the new instance pick up exactly where
+	* the previous one left off. (Built-in default only.)
+	*/
+	_(() => {
+		if (hasOverride || !ref.current) return;
+		const offsetMs = performance.now() % SPIN_DURATION_MS;
+		ref.current.style.animationDelay = `-${offsetMs}ms`;
+	}, [hasOverride]);
+	_(() => {
+		if (!overrideRef.current) return;
+		overrideRef.current.style.width = `${size}px`;
+		overrideRef.current.style.height = `${size}px`;
+	}, [size, hasOverride]);
+	if (hasOverride) return /* @__PURE__ */ u("div", {
+		ref: overrideRef,
+		class: "IncodeLoadingIconOverride",
+		children: hasAnimationOverride ? /* @__PURE__ */ u(AnimatedAsset, {
+			name: "loader.spinner",
+			loop: true,
+			onFallback: handleFallback
+		}) : /* @__PURE__ */ u(Asset, {
+			name: "loader.spinner",
+			onFallback: handleFallback
+		})
+	});
+	return /* @__PURE__ */ u("div", {
+		ref,
+		class: "IncodeLoadingIcon",
+		children: [/* @__PURE__ */ u(SpinnerSecondary, {
+			size,
+			className: secondaryClass
+		}), /* @__PURE__ */ u("div", {
+			class: "IncodeLoadingIconPrimary",
+			children: /* @__PURE__ */ u(SpinnerPrimary, {
+				size,
+				className: primaryClass
+			})
+		})]
+	});
+};
+//#endregion
+//#region src/shared/spacer/spacer.tsx
+var scaleTokens = new Set([
+	0,
+	2,
+	4,
+	8,
+	12,
+	16,
+	20,
+	24,
+	32,
+	40,
+	48,
+	64,
+	80,
+	96,
+	104,
+	120,
+	200
+]);
+var scaleToClassName = (size, direction) => {
+	if (direction === "horizontal") return {
+		0: "IncodeSpacerHorizontal0",
+		2: "IncodeSpacerHorizontal2",
+		4: "IncodeSpacerHorizontal4",
+		8: "IncodeSpacerHorizontal8",
+		12: "IncodeSpacerHorizontal12",
+		16: "IncodeSpacerHorizontal16",
+		20: "IncodeSpacerHorizontal20",
+		24: "IncodeSpacerHorizontal24",
+		32: "IncodeSpacerHorizontal32",
+		40: "IncodeSpacerHorizontal40",
+		48: "IncodeSpacerHorizontal48",
+		64: "IncodeSpacerHorizontal64",
+		80: "IncodeSpacerHorizontal80",
+		96: "IncodeSpacerHorizontal96",
+		104: "IncodeSpacerHorizontal104",
+		120: "IncodeSpacerHorizontal120",
+		200: "IncodeSpacerHorizontal200"
+	}[size];
+	return {
+		0: "IncodeSpacerVertical0",
+		2: "IncodeSpacerVertical2",
+		4: "IncodeSpacerVertical4",
+		8: "IncodeSpacerVertical8",
+		12: "IncodeSpacerVertical12",
+		16: "IncodeSpacerVertical16",
+		20: "IncodeSpacerVertical20",
+		24: "IncodeSpacerVertical24",
+		32: "IncodeSpacerVertical32",
+		40: "IncodeSpacerVertical40",
+		48: "IncodeSpacerVertical48",
+		64: "IncodeSpacerVertical64",
+		80: "IncodeSpacerVertical80",
+		96: "IncodeSpacerVertical96",
+		104: "IncodeSpacerVertical104",
+		120: "IncodeSpacerVertical120",
+		200: "IncodeSpacerVertical200"
+	}[size];
+};
+var Spacer = ({ size, className, direction = "vertical" }) => {
+	if (size === void 0) return /* @__PURE__ */ u("div", { class: `IncodeSpacerFlex ${className || ""}` });
+	if (!(direction === "horizontal" ? "w" : direction === "vertical" ? "h" : void 0)) return /* @__PURE__ */ u("div", { class: `${className || ""}` });
+	if (typeof size === "number" && scaleTokens.has(size)) return /* @__PURE__ */ u("div", { class: `${scaleToClassName(size, direction)} ${className || ""}` });
+	return /* @__PURE__ */ u("div", { class: `${className || ""}` });
+};
+//#endregion
+export { useAnimationData as a, devWarn as c, cn as d, preloadAnimations as i, InstanceOverridesProvider as l, LoadingIcon as n, Lottie as o, AnimatedAsset as r, Asset as s, Spacer as t, useInstanceOverrides as u };