oomi-ai 0.2.49 → 0.3.0

package/templates/persona-app/src/App.css

@@ -1,379 +0,0 @@
-:root {
-  --surface-ink: #1f1b16;
-  --surface-muted: #6c665f;
-  --surface-line: rgba(47, 39, 29, 0.14);
-  --surface-panel: rgba(255, 252, 246, 0.84);
-  --surface-panel-strong: rgba(255, 252, 246, 0.94);
-  --surface-shadow: 0 28px 90px rgba(73, 55, 35, 0.12);
-  --surface-pill: #26211c;
-  --surface-pill-copy: #fff8f0;
-}
-
-code {
-  font-family: "Cascadia Code", "SFMono-Regular", Consolas, monospace;
-  background: rgba(43, 37, 31, 0.08);
-  color: #312821;
-  padding: 0.12rem 0.42rem;
-  border-radius: 999px;
-  font-size: 0.9em;
-}
-
-#root {
-  width: 100%;
-}
-
-[enable-xr] {
-  position: relative;
-  isolation: isolate;
-}
-
-.persona-home,
-.scene-shell {
-  width: min(1320px, calc(100% - 56px));
-  margin: 0 auto;
-  padding: 36px 0 72px;
-}
-
-.persona-home {
-  display: grid;
-  gap: 22px;
-}
-
-.home-grid,
-.home-card-grid,
-.scene-workspace-grid,
-.scene-support-grid {
-  display: grid;
-  gap: 20px;
-}
-
-.home-grid {
-  grid-template-columns: minmax(0, 1.28fr) minmax(300px, 0.72fr);
-  align-items: start;
-}
-
-.home-card-grid,
-.scene-support-grid {
-  grid-template-columns: repeat(3, minmax(0, 1fr));
-}
-
-.home-panel,
-.scene-header,
-.scene-surface {
-  border: 1px solid var(--surface-line);
-  border-radius: 34px;
-  background: var(--surface-panel);
-  box-shadow: var(--surface-shadow);
-  backdrop-filter: blur(26px);
-}
-
-.home-panel {
-  padding: 30px;
-}
-
-.home-hero {
-  display: grid;
-  gap: 26px;
-}
-
-.home-eyebrow,
-.scene-eyebrow,
-.scene-surface-label {
-  margin: 0;
-  color: var(--surface-muted);
-  font-size: 0.78rem;
-  letter-spacing: 0.18em;
-  text-transform: uppercase;
-}
-
-.home-title,
-.scene-title,
-.scene-surface-title {
-  margin: 10px 0 0;
-  color: var(--surface-ink);
-  font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;
-  font-weight: 500;
-  letter-spacing: -0.04em;
-}
-
-.home-title {
-  font-size: clamp(3rem, 5vw, 5.2rem);
-  line-height: 0.94;
-}
-
-.scene-title {
-  font-size: clamp(2.7rem, 4vw, 4.2rem);
-  line-height: 0.96;
-}
-
-.scene-surface-title {
-  font-size: 1.75rem;
-  line-height: 1.08;
-}
-
-.home-description,
-.home-supporting-copy,
-.home-feature-card p,
-.home-copy-card p,
-.home-copy-card li,
-.scene-copy,
-.scene-step-card p,
-.scene-note-list li {
-  color: var(--surface-muted);
-}
-
-.home-description,
-.home-supporting-copy,
-.scene-copy {
-  max-width: 56rem;
-  line-height: 1.8;
-}
-
-.home-description {
-  margin: 16px 0 0;
-}
-
-.home-supporting-copy {
-  margin: 0;
-}
-
-.home-actions,
-.scene-chip-row,
-.scene-badge-stack,
-.scene-footer {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 12px;
-}
-
-.home-primary-button,
-.home-secondary-link,
-.scene-link {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  min-height: 50px;
-  padding: 0 20px;
-  border-radius: 18px;
-  border: 1px solid var(--surface-line);
-  transition:
-    transform 160ms ease,
-    box-shadow 160ms ease,
-    border-color 160ms ease;
-}
-
-.home-primary-button,
-.scene-link {
-  background: var(--surface-pill);
-  color: var(--surface-pill-copy);
-}
-
-.home-secondary-link {
-  background: rgba(255, 255, 255, 0.58);
-  color: var(--surface-ink);
-}
-
-.home-primary-button:hover,
-.home-secondary-link:hover,
-.scene-link:hover {
-  transform: translateY(-1px);
-  box-shadow: 0 14px 28px rgba(49, 37, 25, 0.08);
-}
-
-.home-feature-card,
-.home-copy-card {
-  min-height: 220px;
-}
-
-.home-feature-card h2,
-.home-copy-card h2 {
-  margin: 0 0 12px;
-  color: var(--surface-ink);
-  font-size: 1.05rem;
-  letter-spacing: 0.04em;
-  text-transform: uppercase;
-}
-
-.home-runtime-list,
-.scene-status-grid {
-  display: grid;
-  gap: 14px;
-}
-
-.home-runtime-row,
-.scene-status-row {
-  display: flex;
-  justify-content: space-between;
-  gap: 16px;
-  padding-bottom: 12px;
-  border-bottom: 1px solid var(--surface-line);
-  color: var(--surface-muted);
-}
-
-.home-runtime-row:last-child,
-.scene-status-row:last-child {
-  padding-bottom: 0;
-  border-bottom: 0;
-}
-
-.home-runtime-row span:last-child,
-.scene-status-row span:last-child {
-  color: var(--surface-ink);
-  font-weight: 600;
-  text-align: right;
-}
-
-.home-note-list,
-.scene-note-list {
-  margin: 16px 0 0;
-  padding-left: 18px;
-  display: grid;
-  gap: 10px;
-  line-height: 1.75;
-}
-
-.scene-shell {
-  display: grid;
-  gap: 22px;
-}
-
-.scene-header,
-.scene-surface {
-  padding: 30px;
-}
-
-.scene-header {
-  display: grid;
-  grid-template-columns: minmax(0, 1fr) auto;
-  gap: 18px;
-  background:
-    radial-gradient(circle at top right, rgba(232, 221, 198, 0.72), transparent 28%),
-    var(--surface-panel-strong);
-}
-
-.scene-badge-stack {
-  align-content: start;
-  justify-content: flex-end;
-}
-
-.scene-badge,
-.scene-tool-chip {
-  display: inline-flex;
-  align-items: center;
-  min-height: 40px;
-  padding: 0 14px;
-  border-radius: 999px;
-  border: 1px solid var(--surface-line);
-  background: rgba(255, 255, 255, 0.62);
-  color: var(--surface-ink);
-  font-size: 0.92rem;
-}
-
-.scene-workspace-grid {
-  grid-template-columns: minmax(0, 1.34fr) minmax(300px, 0.66fr);
-  align-items: start;
-}
-
-.scene-workspace-primary {
-  min-height: 450px;
-  background:
-    radial-gradient(circle at top left, rgba(244, 235, 216, 0.86), transparent 30%),
-    var(--surface-panel-strong);
-}
-
-.scene-step-grid,
-.scene-secondary-stack {
-  display: grid;
-  gap: 16px;
-}
-
-.scene-step-grid {
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-  margin-top: 24px;
-}
-
-.scene-step-card {
-  padding: 18px;
-  border-radius: 22px;
-  border: 1px solid var(--surface-line);
-  background: rgba(255, 255, 255, 0.58);
-}
-
-.scene-step-card h3 {
-  margin: 0 0 10px;
-  color: var(--surface-ink);
-  font-size: 1rem;
-}
-
-.scene-footer {
-  justify-content: space-between;
-  align-items: center;
-}
-
-.scene-footer-copy {
-  margin: 0;
-  color: var(--surface-muted);
-  line-height: 1.7;
-}
-
-html.is-spatial {
-  --xr-background-material: transparent;
-}
-
-html.is-spatial .scene-shell {
-  width: min(1400px, calc(100% - 24px));
-  padding-top: 20px;
-}
-
-html.is-spatial .scene-header,
-html.is-spatial .scene-surface {
-  background:
-    radial-gradient(circle at top left, rgba(255, 255, 255, 0.22), transparent 28%),
-    rgba(255, 250, 241, 0.22);
-}
-
-@media (max-width: 1080px) {
-  .home-grid,
-  .scene-workspace-grid,
-  .scene-header {
-    grid-template-columns: 1fr;
-  }
-
-  .home-card-grid,
-  .scene-support-grid,
-  .scene-step-grid {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-  }
-
-  .scene-badge-stack {
-    justify-content: flex-start;
-  }
-}
-
-@media (max-width: 820px) {
-  .persona-home,
-  .scene-shell {
-    width: min(100%, calc(100% - 28px));
-    padding-top: 22px;
-  }
-
-  .home-card-grid,
-  .scene-support-grid,
-  .scene-step-grid {
-    grid-template-columns: 1fr;
-  }
-
-  .home-panel,
-  .scene-header,
-  .scene-surface {
-    padding: 24px;
-  }
-
-  .home-title {
-    font-size: clamp(2.6rem, 12vw, 4rem);
-  }
-
-  .scene-title {
-    font-size: clamp(2.2rem, 10vw, 3.2rem);
-  }
-}

package/templates/persona-app/src/App.tsx

@@ -1,17 +0,0 @@
-import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
-import { HomePage } from "./pages/HomePage";
-import { ScenePage } from "./pages/ScenePage";
-
-const isSpatialRuntime = __XR_ENV_BASE__.startsWith("/webspatial/avp");
-
-export default function App() {
-  return (
-    <Router basename={__XR_ENV_BASE__}>
-      <Routes>
-        <Route index element={isSpatialRuntime ? <ScenePage /> : <HomePage />} />
-        <Route path="home" element={<HomePage />} />
-        <Route path="scene" element={<ScenePage />} />
-      </Routes>
-    </Router>
-  );
-}

package/templates/persona-app/src/index.css

@@ -1,53 +0,0 @@
-:root {
-  font-family: "Segoe UI", system-ui, sans-serif;
-  line-height: 1.5;
-  font-weight: 400;
-  color: #1f1b16;
-  background:
-    radial-gradient(circle at top left, rgba(222, 207, 180, 0.5), transparent 34%),
-    linear-gradient(180deg, #faf7f1 0%, #efe7db 100%);
-  font-synthesis: none;
-  text-rendering: optimizeLegibility;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-* {
-  box-sizing: border-box;
-}
-
-html,
-body,
-#root {
-  min-height: 100%;
-}
-
-body {
-  margin: 0;
-  min-width: 320px;
-  min-height: 100vh;
-  background:
-    radial-gradient(circle at top left, rgba(255, 255, 255, 0.7), transparent 28%),
-    radial-gradient(circle at top right, rgba(228, 216, 196, 0.62), transparent 26%),
-    linear-gradient(180deg, #faf7f1 0%, #eee5d8 100%);
-}
-
-button,
-a {
-  font: inherit;
-  color: inherit;
-  text-decoration: none;
-}
-
-button {
-  cursor: pointer;
-}
-
-html.is-spatial,
-html.is-spatial body {
-  background: transparent;
-}
-
-html.is-spatial #root {
-  min-height: 100vh;
-}

package/templates/persona-app/src/main.tsx

@@ -1,23 +0,0 @@
-import { StrictMode } from "react";
-import { createRoot } from "react-dom/client";
-import { snapdom } from "@zumer/snapdom";
-import html2canvas from "html2canvas";
-import "./index.css";
-import App from "./App";
-
-// WebSpatial AndroidXR uses DOM capture to turn enable-xr surfaces into native panels.
-// Expose both libraries globally so the SDK can pick the fast path when available.
-(window as Window & {
-  snapdom?: typeof snapdom;
-  html2canvas?: typeof html2canvas;
-}).snapdom = snapdom;
-(window as Window & {
-  snapdom?: typeof snapdom;
-  html2canvas?: typeof html2canvas;
-}).html2canvas = html2canvas;
-
-createRoot(document.getElementById("root")!).render(
-  <StrictMode>
-    <App />
-  </StrictMode>,
-);

package/templates/persona-app/src/pages/HomePage.tsx

@@ -1,127 +0,0 @@
-import { Link } from "react-router-dom";
-import "../App.css";
-import { personaConfig } from "../persona/config";
-import { personaNotes } from "../persona/notes";
-import {
-  WEBSPATIAL_FORK_COMMIT,
-  detectSpatialEnvironment,
-  openPersonaScene,
-} from "../spatial";
-
-const browserCards = [
-  {
-    title: "Browser route stays valid",
-    body: "Keep a normal web route for previews, fallback browsers, and non-spatial editing.",
-  },
-  {
-    title: "XR route stays separate",
-    body: "The mounted scene component should own scene bootstrap, diagnostics, and the real spatial surfaces.",
-  },
-  {
-    title: "Oomi opens the entry URL",
-    body: "When the runtime is spatial, the entry route should land directly in the scene instead of a flat homepage.",
-  },
-];
-
-export function HomePage() {
-  const environment = detectSpatialEnvironment();
-
-  return (
-    <main className="persona-home">
-      <section className="home-grid">
-        <article className="home-panel home-hero">
-          <div>
-            <p className="home-eyebrow">Oomi Persona Surface</p>
-            <h1 className="home-title">{personaConfig.name}</h1>
-            <p className="home-description">{personaConfig.description}</p>
-            <p className="home-supporting-copy">
-              This browser route exists for non-spatial parity. In XR mode, the index route should
-              open directly into the mounted scene so Oomi lands on a real WebSpatial workspace
-              instead of another 2D page.
-            </p>
-          </div>
-
-          <div className="home-actions">
-            <button className="home-primary-button" onClick={openPersonaScene}>
-              Launch XR Workspace
-            </button>
-            <Link className="home-secondary-link" to="/scene" target="_blank" rel="noreferrer">
-              Open Scene Route
-            </Link>
-          </div>
-
-          <div className="home-card-grid">
-            {browserCards.map(card => (
-              <article key={card.title} className="home-panel home-feature-card">
-                <h2>{card.title}</h2>
-                <p>{card.body}</p>
-              </article>
-            ))}
-          </div>
-        </article>
-
-        <aside className="home-panel home-runtime">
-          <p className="home-eyebrow">Runtime Snapshot</p>
-          <div className="home-runtime-list">
-            <div className="home-runtime-row">
-              <span>Slug</span>
-              <span>{personaConfig.slug}</span>
-            </div>
-            <div className="home-runtime-row">
-              <span>SDK</span>
-              <span>@webspatial/react-sdk {environment.sdkVersion}</span>
-            </div>
-            <div className="home-runtime-row">
-              <span>Bridge</span>
-              <span>{environment.hasBridge ? "available" : "waiting"}</span>
-            </div>
-            <div className="home-runtime-row">
-              <span>Native</span>
-              <span>{environment.nativeVersion ?? "browser fallback"}</span>
-            </div>
-            <div className="home-runtime-row">
-              <span>Fork</span>
-              <span>{WEBSPATIAL_FORK_COMMIT.slice(0, 7)}</span>
-            </div>
-            <div className="home-runtime-row">
-              <span>Spatial mode</span>
-              <span>{environment.isWebSpatial ? "active" : "not active"}</span>
-            </div>
-          </div>
-        </aside>
-      </section>
-
-      <section className="home-card-grid">
-        <article className="home-panel home-copy-card">
-          <h2>Template Contract</h2>
-          <p>
-            XR mode should default into <code>ScenePage</code>, mount scene bootstrap from that
-            component, and render multiple authored panels with explicit depth and material.
-          </p>
-          <p>
-            The scaffold should teach agents to build surfaces, not just pages wrapped in one
-            captured DOM card.
-          </p>
-        </article>
-
-        <article className="home-panel home-copy-card">
-          <h2>Editing Notes</h2>
-          <ul className="home-note-list">
-            {personaNotes.map(note => (
-              <li key={note}>{note}</li>
-            ))}
-          </ul>
-        </article>
-
-        <article className="home-panel home-copy-card">
-          <h2>Spatial Defaults</h2>
-          <p>
-            Preserve the transparent spatial shell, the vendored WebSpatial fork, and the DOM
-            capture hooks in <code>main.tsx</code>. Those pieces are part of the runtime contract,
-            not optional polish.
-          </p>
-        </article>
-      </section>
-    </main>
-  );
-}