@liforma/client 0.2.1

package/dist/svelte/experienceLoadErrorOverlay.js

@@ -0,0 +1,48 @@
+import { injectExperienceLoadErrorStyles } from './experienceLoadErrorStyles';
+export function createExperienceLoadErrorOverlay(container, initial) {
+    injectExperienceLoadErrorStyles();
+    let presentation = initial;
+    let advancedOpen = false;
+    const root = document.createElement('div');
+    root.className = 'liforma-loading-screen liforma-loading-screen-absolute';
+    root.setAttribute('role', 'alert');
+    root.setAttribute('aria-live', 'assertive');
+    const card = document.createElement('div');
+    card.className = 'liforma-loading-card liforma-loading-card-error';
+    const kicker = document.createElement('p');
+    kicker.className = 'liforma-loading-kicker';
+    kicker.textContent = 'Avatar experience';
+    const title = document.createElement('p');
+    title.className = 'liforma-loading-error-title';
+    const advancedBtn = document.createElement('button');
+    advancedBtn.type = 'button';
+    advancedBtn.className = 'liforma-loading-error-advanced';
+    const detail = document.createElement('p');
+    detail.className = 'liforma-loading-error-detail';
+    advancedBtn.addEventListener('click', () => {
+        advancedOpen = !advancedOpen;
+        render();
+    });
+    card.append(kicker, title, advancedBtn, detail);
+    root.append(card);
+    container.append(root);
+    function render() {
+        title.textContent = presentation.title;
+        detail.textContent = presentation.detail;
+        detail.hidden = !advancedOpen;
+        advancedBtn.textContent = advancedOpen ? 'Hide details' : 'Advanced';
+        advancedBtn.setAttribute('aria-expanded', advancedOpen ? 'true' : 'false');
+    }
+    render();
+    return {
+        root,
+        setPresentation(next) {
+            presentation = next;
+            advancedOpen = false;
+            render();
+        },
+        remove() {
+            root.remove();
+        }
+    };
+}

package/dist/svelte/experienceLoadErrorStyles.d.ts

@@ -0,0 +1,4 @@
+/** Subset of session loading overlay styles for pre-attach Experience load errors. */
+export declare const EXPERIENCE_LOAD_ERROR_STYLE_ID = "liforma-experience-load-error-styles";
+export declare function injectExperienceLoadErrorStyles(): void;
+export declare const EXPERIENCE_LOAD_ERROR_CSS = "\n\t.liforma-loading-screen {\n\t\tinset: 0;\n\t\tz-index: 20;\n\t\tbox-sizing: border-box;\n\t\toverflow-x: clip;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tmax-width: 100vw;\n\t\tbackground:\n\t\t\tradial-gradient(circle at 50% 60%, rgba(79, 126, 196, 0.18), transparent 38%),\n\t\t\t#030508;\n\t\tfont-family: system-ui, -apple-system, sans-serif;\n\t\tcolor: #e8f0ff;\n\t\ttext-align: center;\n\t}\n\t.liforma-loading-screen-absolute {\n\t\tposition: absolute;\n\t}\n\t.liforma-loading-card {\n\t\tposition: absolute;\n\t\tleft: 50%;\n\t\ttop: 60%;\n\t\ttransform: translate(-50%, -50%);\n\t\twidth: min(22rem, calc(100% - 2.5rem));\n\t\tmax-width: calc(100% - max(1.25rem, env(safe-area-inset-left, 0px)) - max(1.25rem, env(safe-area-inset-right, 0px)));\n\t\tbox-sizing: border-box;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\tborder: 0;\n\t\tbackground: transparent;\n\t\tbox-shadow: none;\n\t}\n\t.liforma-loading-card-error {\n\t\tdisplay: block;\n\t\ttext-align: center;\n\t\tpadding: 1rem 1.05rem;\n\t\tborder-radius: 14px;\n\t\tborder: 1px solid rgba(255, 154, 154, 0.28);\n\t\tbackground:\n\t\t\tlinear-gradient(180deg, rgba(21, 29, 42, 0.92), rgba(9, 13, 20, 0.92));\n\t}\n\t.liforma-loading-kicker {\n\t\tmargin: 0 0 0.18rem;\n\t\tcolor: #8ba4c5;\n\t\tfont-size: 0.68rem;\n\t\tfont-weight: 700;\n\t\ttext-transform: uppercase;\n\t\tletter-spacing: 0.08em;\n\t}\n\t.liforma-loading-error {\n\t\tmargin: 0;\n\t\tmax-width: 28rem;\n\t\tcolor: #ffb4b4;\n\t\tfont-size: 0.92rem;\n\t\tline-height: 1.4;\n\t}\n\t.liforma-loading-error-title {\n\t\tmargin: 0;\n\t\tcolor: #f6ebe8;\n\t\tfont-size: 0.98rem;\n\t\tfont-weight: 650;\n\t\tline-height: 1.35;\n\t}\n\t.liforma-loading-error-advanced {\n\t\tmargin: 0.85rem 0 0;\n\t\tpadding: 0;\n\t\tborder: 0;\n\t\tbackground: transparent;\n\t\tcolor: #9eb7d8;\n\t\tfont: inherit;\n\t\tfont-size: 0.78rem;\n\t\tfont-weight: 650;\n\t\tletter-spacing: 0.02em;\n\t\ttext-decoration: underline;\n\t\ttext-underline-offset: 0.18em;\n\t\tcursor: pointer;\n\t}\n\t.liforma-loading-error-advanced:hover,\n\t.liforma-loading-error-advanced:focus-visible {\n\t\tcolor: #d7e6ff;\n\t\toutline: none;\n\t}\n\t.liforma-loading-error-detail {\n\t\tmargin: 0.7rem 0 0;\n\t\tpadding: 0.65rem 0.7rem;\n\t\tborder-radius: 10px;\n\t\tborder: 1px solid rgba(158, 191, 255, 0.16);\n\t\tbackground: rgba(3, 5, 8, 0.45);\n\t\tcolor: #c6d4e8;\n\t\tfont-size: 0.78rem;\n\t\tfont-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n\t\tline-height: 1.4;\n\t\ttext-align: left;\n\t\tword-break: break-word;\n\t}\n\t.liforma-loading-error-detail[hidden] {\n\t\tdisplay: none;\n\t}\n";

package/dist/svelte/experienceLoadErrorStyles.js

@@ -0,0 +1,112 @@
+/** Subset of session loading overlay styles for pre-attach Experience load errors. */
+export const EXPERIENCE_LOAD_ERROR_STYLE_ID = 'liforma-experience-load-error-styles';
+export function injectExperienceLoadErrorStyles() {
+    if (typeof document === 'undefined')
+        return;
+    if (document.getElementById(EXPERIENCE_LOAD_ERROR_STYLE_ID))
+        return;
+    const style = document.createElement('style');
+    style.id = EXPERIENCE_LOAD_ERROR_STYLE_ID;
+    style.textContent = EXPERIENCE_LOAD_ERROR_CSS;
+    document.head.append(style);
+}
+export const EXPERIENCE_LOAD_ERROR_CSS = `
+	.liforma-loading-screen {
+		inset: 0;
+		z-index: 20;
+		box-sizing: border-box;
+		overflow-x: clip;
+		width: 100%;
+		height: 100%;
+		max-width: 100vw;
+		background:
+			radial-gradient(circle at 50% 60%, rgba(79, 126, 196, 0.18), transparent 38%),
+			#030508;
+		font-family: system-ui, -apple-system, sans-serif;
+		color: #e8f0ff;
+		text-align: center;
+	}
+	.liforma-loading-screen-absolute {
+		position: absolute;
+	}
+	.liforma-loading-card {
+		position: absolute;
+		left: 50%;
+		top: 60%;
+		transform: translate(-50%, -50%);
+		width: min(22rem, calc(100% - 2.5rem));
+		max-width: calc(100% - max(1.25rem, env(safe-area-inset-left, 0px)) - max(1.25rem, env(safe-area-inset-right, 0px)));
+		box-sizing: border-box;
+		margin: 0;
+		padding: 0;
+		border: 0;
+		background: transparent;
+		box-shadow: none;
+	}
+	.liforma-loading-card-error {
+		display: block;
+		text-align: center;
+		padding: 1rem 1.05rem;
+		border-radius: 14px;
+		border: 1px solid rgba(255, 154, 154, 0.28);
+		background:
+			linear-gradient(180deg, rgba(21, 29, 42, 0.92), rgba(9, 13, 20, 0.92));
+	}
+	.liforma-loading-kicker {
+		margin: 0 0 0.18rem;
+		color: #8ba4c5;
+		font-size: 0.68rem;
+		font-weight: 700;
+		text-transform: uppercase;
+		letter-spacing: 0.08em;
+	}
+	.liforma-loading-error {
+		margin: 0;
+		max-width: 28rem;
+		color: #ffb4b4;
+		font-size: 0.92rem;
+		line-height: 1.4;
+	}
+	.liforma-loading-error-title {
+		margin: 0;
+		color: #f6ebe8;
+		font-size: 0.98rem;
+		font-weight: 650;
+		line-height: 1.35;
+	}
+	.liforma-loading-error-advanced {
+		margin: 0.85rem 0 0;
+		padding: 0;
+		border: 0;
+		background: transparent;
+		color: #9eb7d8;
+		font: inherit;
+		font-size: 0.78rem;
+		font-weight: 650;
+		letter-spacing: 0.02em;
+		text-decoration: underline;
+		text-underline-offset: 0.18em;
+		cursor: pointer;
+	}
+	.liforma-loading-error-advanced:hover,
+	.liforma-loading-error-advanced:focus-visible {
+		color: #d7e6ff;
+		outline: none;
+	}
+	.liforma-loading-error-detail {
+		margin: 0.7rem 0 0;
+		padding: 0.65rem 0.7rem;
+		border-radius: 10px;
+		border: 1px solid rgba(158, 191, 255, 0.16);
+		background: rgba(3, 5, 8, 0.45);
+		color: #c6d4e8;
+		font-size: 0.78rem;
+		font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+		line-height: 1.4;
+		text-align: left;
+		word-break: break-word;
+	}
+	.liforma-loading-error-detail[hidden] {
+		display: none;
+	}
+`;

package/dist/svelte/index.d.ts

@@ -0,0 +1,7 @@
+export { default as Experience } from './Experience.svelte';
+export { default as ExperienceThumbnail } from './ExperienceThumbnail.svelte';
+export { default as ExperienceWidget } from './ExperienceWidget.svelte';
+export type { ExperienceHandle, ExperienceProps } from './types';
+export type { GalleryThumb } from '@liforma/client';
+/** @deprecated Use `Experience` from `@liforma/client/svelte`. */
+export { default as LiformaExperience } from './Experience.svelte';

package/dist/svelte/index.js

@@ -0,0 +1,5 @@
+export { default as Experience } from './Experience.svelte';
+export { default as ExperienceThumbnail } from './ExperienceThumbnail.svelte';
+export { default as ExperienceWidget } from './ExperienceWidget.svelte';
+/** @deprecated Use `Experience` from `@liforma/client/svelte`. */
+export { default as LiformaExperience } from './Experience.svelte';

package/dist/svelte/types.d.ts

@@ -0,0 +1 @@
+export type { ExperienceHandle, ExperienceProps } from '../component/experienceComponentTypes';

package/dist/svelte/types.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -0,0 +1,154 @@
+{
+	"name": "@liforma/client",
+	"version": "0.2.1",
+	"type": "module",
+	"description": "Liforma browser SDK — Experience sessions, speech API, and Svelte embed component.",
+	"license": "MIT",
+	"homepage": "https://docs.liforma.ai",
+	"repository": {
+		"type": "git",
+		"url": "git+https://github.com/LiformaLtd/cdn.liforma.ai.git"
+	},
+	"bugs": {
+		"url": "https://github.com/LiformaLtd/cdn.liforma.ai/issues"
+	},
+	"publishConfig": {
+		"access": "public"
+	},
+	"exports": {
+		".": {
+			"types": "./dist/npm/v2/npm.d.ts",
+			"import": "./dist/npm/index.js"
+		},
+		"./svelte": {
+			"types": "./dist/svelte/index.d.ts",
+			"import": "./dist/svelte/index.js",
+			"svelte": "./dist/svelte/index.js"
+		},
+		"./react": {
+			"types": "./dist/react/react/index.d.ts",
+			"import": "./dist/react/index.js"
+		},
+		"./next": {
+			"types": "./dist/next/next/index.d.ts",
+			"import": "./dist/next/index.js"
+		}
+	},
+	"files": [
+		"dist/npm",
+		"dist/svelte",
+		"dist/react",
+		"dist/next",
+		"dist/sdk",
+		"README.md",
+		"CHANGELOG.md",
+		"LICENSE"
+	],
+	"peerDependencies": {
+		"svelte": "^5.0.0",
+		"react": "^18.0.0 || ^19.0.0",
+		"react-dom": "^18.0.0 || ^19.0.0"
+	},
+	"peerDependenciesMeta": {
+		"svelte": {
+			"optional": true
+		},
+		"react": {
+			"optional": true
+		},
+		"react-dom": {
+			"optional": true
+		}
+	},
+	"scripts": {
+		"build": "npm run build:v2 && npm run build:npm && npm run build:svelte && npm run build:react && npm run build:next && npm run copy:preview",
+		"build:react": "vite build --config vite.config.react.ts && tsc -p tsconfig.react.json",
+		"build:next": "vite build --config vite.config.next.ts && tsc -p tsconfig.next.json",
+		"copy:preview": "mkdir -p dist/preview && cp preview/v2-embed-test.html dist/preview/ && cp preview/v2-embed-test-redirect.html dist/preview/",
+		"build:v2": "vite build --config vite.config.v2.ts",
+		"build:npm": "vite build --config vite.config.npm.ts && tsc -p tsconfig.npm.json",
+		"build:svelte": "svelte-package -i src/svelte -o dist/svelte && vite build --config vite.config.svelte.ts",
+		"check:consumer": "svelte-check --workspace test/consumer --tsconfig ./tsconfig.json",
+		"test": "vitest run",
+		"preview": "node scripts/preview-local.mjs",
+		"dev:sdk": "npm run build:v2 && npm run copy:preview && npm run preview",
+		"dev": "npm run build && npm run preview",
+		"publish:sdk": "node scripts/publish-sdk.mjs",
+		"publish:npm": "node scripts/publish-npm.mjs",
+		"publish:avatar": "node scripts/publish-avatar.mjs",
+		"publish:avatars-dist": "node scripts/publish-avatars.mjs",
+		"publish:avatars": "node scripts/republish-avatars.mjs",
+		"build:avatars": "node scripts/build-avatars.mjs",
+		"republish:avatars": "node scripts/republish-avatars.mjs",
+		"catalogue:avatars": "node ../labs.liforma.ai/scripts/generate-avatar-index.mjs",
+		"verify:avatars-dist": "node scripts/verify-avatars-dist.mjs",
+		"verify:avatar-pack": "node scripts/verify-avatar-pack.mjs",
+		"repair:render-plate-metadata": "node scripts/repair-render-plate-metadata.mjs",
+		"verify:render-plate-crop": "node scripts/verify-render-plate-crop.mjs",
+		"migrate:avatar-render-prep": "npm run migrate:avatar-render-prep --prefix ../labs.liforma.ai --",
+		"convert:avatar-teeth": "node scripts/convert-avatar-teeth-webp.mjs",
+		"warm:avatar-composites": "node scripts/warm-avatar-composites.mjs",
+		"test:compose-costume": "node scripts/test-compose-costume-layers.mjs",
+		"test:compose-costume-wasm": "node scripts/test-compose-costume-wasm.mjs",
+		"test:parse-composite-filename": "node scripts/test-parse-composite-filename.mjs",
+		"test:avatar-composite-rendered-path": "node scripts/test-avatar-composite-rendered-path.mjs",
+		"test:avatar-compose-worker-cors": "node scripts/test-avatar-compose-worker-cors.mjs",
+		"test:location-depth-paths": "node scripts/test-location-depth-paths.mjs",
+		"test:location-interactions": "node scripts/test-location-interactions.mjs",
+		"test:render-plate-chroma-key": "node scripts/test-render-plate-chroma-key.mjs",
+		"test:sparse-plate": "node scripts/test-sparse-plate.mjs",
+		"test:face-meshes-publish-depth": "node scripts/test-face-meshes-publish-depth.mjs",
+		"test:avatar-avif-sibling": "node scripts/test-avatar-avif-sibling.mjs",
+		"test:screen-chroma-key": "node scripts/test-screen-chroma-key.mjs",
+		"pull:sources": "node scripts/sync-authoring-sources.mjs",
+		"push:sources": "node scripts/sync-authoring-sources.mjs",
+		"catalogue:locations": "node scripts/catalogue-locations.mjs",
+		"generate:location-interactions": "node scripts/generate-location-interactions.mjs",
+		"generate:location-depth": "node scripts/generate-location-depth.mjs",
+		"build:locations": "node scripts/build-locations.mjs",
+		"publish:locations": "node scripts/publish-locations.mjs",
+		"verify:locations": "node scripts/verify-location-sources.mjs",
+		"publish:models": "node scripts/publish-models.mjs",
+		"fetch:depth-anything-v2": "node scripts/fetch-depth-anything-v2.mjs",
+		"fetch:video-depth-anything": "node scripts/fetch-video-depth-anything.mjs",
+		"fetch:depth-pro": "node scripts/fetch-depth-pro.mjs",
+		"fetch:face-landmarker": "node scripts/fetch-face-landmarker.mjs",
+		"fetch:anime-face-detector": "node scripts/fetch-anime-face-detector.mjs",
+		"fetch:face-parsing": "node scripts/fetch-face-parsing.mjs",
+		"fetch:models": "npm run fetch:depth-anything-v2 && npm run fetch:video-depth-anything && npm run fetch:depth-pro && npm run fetch:face-landmarker && npm run fetch:anime-face-detector && npm run fetch:face-parsing",
+		"locations": "npm run catalogue:locations && npm run build:locations",
+		"configure:cors": "node scripts/configure-r2-cors.mjs",
+		"verify:cors": "node scripts/verify-cdn-cors.mjs",
+		"deploy:worker:avatar-compose": "node scripts/deploy-avatar-compose-worker.mjs",
+		"deploy": "npm run build && npm run publish:sdk",
+		"verify": "npm run build && node scripts/check-sdk-size.mjs && node scripts/test-embed-protocol.mjs && node scripts/test-manifest-embed-url.mjs && node scripts/test-player-reachability.mjs && node scripts/test-session-endpoint.mjs && node scripts/verify-package.mjs",
+		"preview:test": "npm run build && npm run preview"
+	},
+	"dependencies": {
+		"@jsquash/webp": "^1.5.0",
+		"zod": "^4.4.3"
+	},
+	"devDependencies": {
+		"@aws-sdk/client-s3": "^3.1000.0",
+		"@sveltejs/package": "^2.5.8",
+		"@sveltejs/vite-plugin-svelte": "^7.0.0",
+		"@testing-library/react": "^16.3.0",
+		"@testing-library/svelte": "^5.4.2",
+		"@types/react": "^19.1.12",
+		"@types/react-dom": "^19.1.9",
+		"@vitejs/plugin-react": "^5.0.2",
+		"@types/node": "^25.9.3",
+		"@webgpu/types": "^0.1.70",
+		"dotenv": "^17.2.3",
+		"jsdom": "^30.0.1",
+		"sharp": "^0.34.2",
+		"react": "^19.1.1",
+		"react-dom": "^19.1.1",
+		"svelte": "^5.55.2",
+		"svelte-check": "^4.7.4",
+		"typescript": "^6.0.3",
+		"vite": "^8.0.16",
+		"vitest": "^4.1.10",
+		"wrangler": "^4.101.0"
+	}
+}