@unoverse-platform/studio 0.1.56 → 0.1.58

package/local/sample-template/chat/states/welcome.yaml

@@ -0,0 +1,119 @@
+type: Box
+visibleWhen: isEmpty
+style:
+  direction: column
+  flex: 1
+  minHeight: "0"
+  overflow: hidden
+  justify: end
+  gap: "6"
+  padding: [ "8", "8", "4", "8" ]
+children:
+  - type: Box
+    style:
+      direction: column
+      align: start
+      gap: "2"
+      maxWidth: reading
+      padding: [ "0", "8", "0", "0" ]
+    children:
+      - type: Text
+        style:
+          font: display
+          color: text.primary
+          lineHeight: none
+          align: start
+        value: How can I help?
+      - type: Text
+        style:
+          font: body.lg
+          color: text.secondary
+          align: start
+        value: Ask a question, or pick a place to start.
+  - type: Each
+    style:
+      direction: row
+      align: start
+      gap: "4"
+      width: full
+      padding: [ "2", "0", "2", "0" ]
+    template:
+      type: Button
+      action: sendMessage
+      style:
+        position: relative
+        flex: 1 1 0
+        minWidth: 0
+        height: "90"
+        padding: "0"
+        radius: 2xl
+        border: none
+        overflow: hidden
+        cursor: pointer
+        transition: all 200ms ease
+        shadow: lg
+        hover:
+          shadow: xl
+          transform: scale(1.02)
+      children:
+        - type: Image
+          bind:
+            src: image
+            alt: title
+          style:
+            position: absolute
+            inset: "0"
+            width: full
+            height: full
+            fit: cover
+        - type: Box
+          style:
+            position: absolute
+            inset: "0"
+            direction: column
+            align: start
+            justify: end
+            gap: "2"
+            padding: "4"
+            background: overlay.scrim
+            textAlign: start
+          children:
+            - type: Text
+              bind:
+                value: tag
+              style:
+                font: caption
+                color: white
+                lineHeight: tight
+            - type: Text
+              bind:
+                value: title
+              style:
+                font: title
+                color: white
+                lineHeight: tight
+                align: start
+            - type: Text
+              bind:
+                value: subtitle
+              style:
+                font: body.sm
+                color: white
+                lineHeight: snug
+                align: start
+    items:
+      - image: https://picsum.photos/seed/explore/840/1160
+        tag: Explore
+        title: What can you do?
+        subtitle: See what this assistant can help with.
+        text: What can you help me with?
+      - image: https://picsum.photos/seed/learn/840/1160
+        tag: Learn
+        title: Show me around
+        subtitle: A quick tour of how this works.
+        text: Give me a quick tour of what I can do here
+      - image: https://picsum.photos/seed/start/840/1160
+        tag: Start
+        title: Jump right in
+        subtitle: Describe what you need in your own words.
+        text: I would like some help getting started

package/local/scaffold.mjs

@@ -43,7 +43,11 @@ export function checkProjectName(name) {
 const WELCOME = [
   "unoverse: '1.0'",
   "kind: component",
-  "name: Welcome",
+  // name === filename (the item-key rule the publish lint enforces), and the closed
+  // style vocabulary has `font`, not `fontSize` — both caught by linting the scaffold
+  // output itself, which is the guard: the first component a developer ever sees must
+  // lint clean, or every rule the platform states is undermined by its own starter.
+  "name: welcome",
   "category: Content",
   "description: A first component. Edit this file and Studio updates as you save.",
   "root:",
@@ -52,7 +56,7 @@ const WELCOME = [
   "  children:",
   "    - type: Text",
   "      value: Hello from your first component",
-  "      style: { fontSize: 'lg', color: 'text.primary' }",
+  "      style: { font: 'body.lg', color: 'text.primary' }",
   "",
 ].join("\n");
 
@@ -81,6 +85,15 @@ export function createProject(home, name) {
   if (existsSync(sampleStyles) && readdirSync(join(root, "styles")).length === 0) {
     cpSync(sampleStyles, join(root, "styles"), { recursive: true });
   }
+
+  // A worked example TEMPLATE (a generic chat: welcome hero, suggestions, focus
+  // overlay — the bpp-chat-layout shape, neutralized to foundation tokens), so
+  // templates/ is never an empty folder and the first app is a rename away. Same
+  // rule as the styles: copied only into an empty folder, then the developer's.
+  const sampleTemplate = join(dirname(fileURLToPath(import.meta.url)), "sample-template/chat");
+  if (existsSync(sampleTemplate) && readdirSync(join(root, "templates")).length === 0) {
+    cpSync(sampleTemplate, join(root, "templates/chat"), { recursive: true });
+  }
   return root;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unoverse-platform/studio",
-  "version": "0.1.56",
+  "version": "0.1.58",
   "type": "module",
   "description": "Unoverse Studio: the local authoring app. Reads your own rx/ folder, no backend.",
   "scripts": {

package/screens/DesignSystemView.tsx

@@ -167,7 +167,10 @@ export function DesignSystemView({
                   {isOverride("text", name) && <OverrideMark />}
                 </div>
                 <div className="min-w-0 flex-1">
-                  <div style={style as React.CSSProperties}>The quick brown fox</div>
+                  {/* A typography token carries family/size/weight/line-height only — never a
+                      colour — so the specimen would otherwise inherit Studio's ambient text
+                      colour and wash out. Paint it in the THEME's ink, like the family name below. */}
+                  <div style={{ ...(style as React.CSSProperties), color: ink }}>The quick brown fox</div>
                   <div className="mt-0.5 text-[10px]" style={{ color: sub }}>
                     {fams.length ? (
                       <>

package/screens/NativeAppHost.tsx

@@ -33,7 +33,7 @@ export function NativeAppHost({
    *  (appEngine) and this relays it, so the host's badge can tell the truth.
    *  `refused` carries the server's terminal refusal text (register_session refused
    *  the session — public-entry gate, requires.role, stale token); undefined otherwise. */
-  onStatus?: (s: { ready: boolean; connected: boolean; refused?: string }) => void;
+  onStatus?: (s: { ready: boolean; connected: boolean; refused?: string; failure?: { nodeIds: string[]; errors: Record<string, string> } }) => void;
 }) {
   const [html, setHtml] = useState<string | null>(null);
   const [error, setError] = useState<string | null>(null);
@@ -47,7 +47,7 @@ export function NativeAppHost({
       if (e.source !== frame.current?.contentWindow) return;
       if (e.data?.type === "unoverse:size" && e.data.width) setAppWidth(String(e.data.width));
       if (e.data?.type === "unoverse:status")
-        onStatus?.({ ready: !!e.data.ready, connected: !!e.data.connected, refused: typeof e.data.refused === "string" ? e.data.refused : undefined });
+        onStatus?.({ ready: !!e.data.ready, connected: !!e.data.connected, refused: typeof e.data.refused === "string" ? e.data.refused : undefined, failure: e.data.failure ?? undefined });
     };
     window.addEventListener("message", onSize);
     return () => window.removeEventListener("message", onSize);

package/screens/TemplatesView.tsx

@@ -217,7 +217,7 @@ export function TemplatesView({
   // connection and posts `unoverse:status` up; the in-page `conn` below is never
   // opened in native mode, so a badge reading it said "Offline" while the app
   // streamed (observed live). Native status wins whenever the iframe has reported.
-  const [nativeStatus, setNativeStatus] = useState<{ ready: boolean; connected: boolean; refused?: string } | null>(null);
+  const [nativeStatus, setNativeStatus] = useState<{ ready: boolean; connected: boolean; refused?: string; failure?: { nodeIds: string[]; errors: Record<string, string> } } | null>(null);
   useEffect(() => setNativeStatus(null), [selected, live]);
   // LIVE output inspector — the last submitted app output, projected through the
   // component's declared `outputs` (the same object the held tool call returns to
@@ -519,6 +519,11 @@ export function TemplatesView({
         nodeId: `${c.name}-${i}`,
         component: {
           type: c.name,
+          // The ADDRESS, exactly as a real server arrival carries it: the type alone
+          // cannot rebuild it (names are unique only within a tier — store.ts), so a
+          // mock seed without it resolved bare `unoverse://components/<name>` and the
+          // resolver rightly refused to guess between two orgs' clones.
+          componentUrl: `unoverse://components/${c.org ? `${c.org}/` : ""}${c.name}`,
           props: { ...defaultsOf(c), ...restState, defaultState: "inline" },
         },
       });
@@ -545,9 +550,12 @@ export function TemplatesView({
     Promise.all([
       // The header's org scope filters the list ("all" → every org's apps, each
       // tagged); the selected app's org still picks its own preview theme.
-      // Components are universal — one catalog.
+      // Components are SCOPED like the templates: an org sees "universal + its own".
+      // Fetched unscoped, a cloned org's same-named component (design/lyceum cloned
+      // from design/bpp → two bare `journey-finder`s) sat beside the original and
+      // Mock seeding picked whichever listed first.
       authedFetch(`/dev/templates${org !== "all" ? `?org=${encodeURIComponent(org)}` : ""}`).then((r) => (r.ok ? r.json() : { templates: [] })),
-      authedFetch("/dev/components").then((r) => (r.ok ? r.json() : { components: [] })),
+      authedFetch(`/dev/components${org !== "all" ? `?org=${encodeURIComponent(org)}` : ""}`).then((r) => (r.ok ? r.json() : { components: [] })),
     ])
       .then(([t, c]) => {
         const tl: Def[] = t.templates ?? [];
@@ -599,7 +607,14 @@ export function TemplatesView({
     const wantComponent = Boolean(layoutSel) || Boolean((activeState?.where as { field?: string } | undefined)?.field);
     let seededSet: Def[] = [];
     if (!wantEmpty) {
-      const byName = (name: string) => components.find((c) => c.name.toLowerCase() === name.toLowerCase());
+      // ORG-AWARE: names are unique only within a tier, so a bare preview ref must
+      // resolve to the SELECTED APP's own org first, then the universal tier — never
+      // to another org's same-named clone (which the "all" scope still lists).
+      const appOrg = (selectedDef?.org ?? "").toLowerCase();
+      const byName = (name: string) => {
+        const hits = components.filter((c) => c.name.toLowerCase() === name.toLowerCase());
+        return hits.find((c) => (c.org ?? "").toLowerCase() === appOrg) ?? hits.find((c) => !c.org) ?? hits[0];
+      };
       const set = entry
         ? entry.map(byName).filter((c): c is Def => Boolean(c))
         : wantComponent
@@ -816,6 +831,15 @@ export function TemplatesView({
                         {nativeStatus.refused}
                       </div>
                     )}
+                    {nativeStatus?.failure && (
+                      /* The last run's WORKFLOW_ERROR, verbatim per node — developer surface
+                         only; a production app never renders this. */
+                      <div className="mb-2 rounded border px-2 py-1.5 text-[11px] leading-snug" style={{ borderColor: "#ef4444", color: "#ef4444" }}>
+                        {Object.entries(nativeStatus.failure.errors).map(([nodeId, err]) => (
+                          <div key={nodeId}><span className="font-medium">{nodeId}</span>: {err}</div>
+                        ))}
+                      </div>
+                    )}
                     {/* Read-only: the app decides. Server is environment; Workflow + Trigger
                         come from the selected app's manifest binding (no manual entry). */}
                     {(

package/src/App.tsx

@@ -18,11 +18,8 @@ import {
   PromptBlocksView,
 } from "@unoverse/studio";
 import { client, usePersistentState } from "./host";
-import { UniverseSession } from "./UniverseSession";
-import { ConnectUniverse } from "./ConnectUniverse";
-import { PublishDialog } from "./PublishDialog";
+import { OfflineSession } from "./OfflineSession";
 import { NewProject } from "./NewProject";
-import { loadUniverses, type Universe } from "./universes";
 // Local-only screens. Nodes are AUTHORED and TESTED here and nowhere else: Canvas keeps
 // the node library (using nodes), the marketplace acquires them (a universe's job).
 import { NodesView } from "./NodesView";
@@ -40,37 +37,23 @@ const NAV: { key: View; label: string; group: string }[] = [
 ];
 
 /**
- * The shell, wrapped in the session for the selected universe.
+ * The shell, inside the permanently signed-out session.
  *
- * The provider must sit ABOVE every screen, because a screen deep in the tree
- * (TemplatesView) already calls `useAuth()`. With no universe selected nothing is
- * mounted and Studio behaves exactly as it did offline.
+ * The provider must sit ABOVE every screen, because a shared screen deep in the tree
+ * (TemplatesView) calls `useAuth()` unconditionally. Local Studio has no login and no
+ * publish button — identity lives in the CLI at publish time (`unoverse publish`;
+ * LOCAL_STUDIO.md §Publish is terminal-only) — so the session it provides is the
+ * signed-out one, always.
  */
 export function App() {
-  // Which universe is selected, remembered across refreshes. The list itself lives in
-  // localStorage (universes.ts); this is only the pointer into it.
-  const [activeUrl, setActiveUrl] = usePersistentState<string | null>("studio:universe", null);
-  const active = loadUniverses().find((u) => u.url === activeUrl) ?? null;
-
   return (
-    <UniverseSession universe={active}>
-      <Shell
-        active={active}
-        onSelectUniverse={(u: Universe | null) => setActiveUrl(u?.url ?? null)}
-      />
-    </UniverseSession>
+    <OfflineSession>
+      <Shell />
+    </OfflineSession>
   );
 }
 
-function Shell({
-  active,
-  onSelectUniverse,
-}: {
-  active: Universe | null;
-  onSelectUniverse: (u: Universe | null) => void;
-}) {
-  const [connectOpen, setConnectOpen] = useState(false);
-  const [publishOpen, setPublishOpen] = useState(false);
+function Shell() {
   const [newProjectOpen, setNewProjectOpen] = useState(false);
   const [view, setView] = usePersistentState<View>("studio:view", "components");
   const [org, setOrg] = usePersistentState<string>("studio:org", "all");
@@ -168,43 +151,12 @@ function Shell({
           >
             {variant}
           </button>
-          {/* The ONLY place Studio asks for anything. Unconnected reads as an invitation,
-              not an error: working offline is a supported state, not a missing step. */}
-          <button
-            onClick={() => setConnectOpen(true)}
-            className="rounded border border-gray-700 px-2 py-1 text-gray-300 hover:text-gray-100"
-            title="Where your work publishes to"
-          >
-            {active ? active.label : "Not connected"}
-          </button>
-          {/* PUBLISHES THE SELECTED PROJECT. Disabled rather than hidden when there is
-              nowhere to send or nothing selected: a missing button reads as a missing
-              feature, a disabled one with a reason reads as a next step. */}
-          <button
-            onClick={() => setPublishOpen(true)}
-            disabled={!active || org === "all"}
-            title={
-              !active
-                ? "Connect a universe first"
-                : org === "all"
-                  ? "Pick one project to publish"
-                  : `Publish ${org} to ${active.label}`
-            }
-            className={
-              active && org !== "all"
-                ? "rounded bg-emerald-500 px-3 py-1 font-medium text-emerald-950 hover:bg-emerald-400"
-                : "rounded border border-gray-700 px-2 py-1 text-gray-500 disabled:cursor-not-allowed"
-            }
-          >
-            Publish
-          </button>
+          {/* NO PUBLISH BUTTON, DELIBERATELY (LOCAL_STUDIO.md §Publish is terminal-only).
+              Studio renders; shipping is `unoverse publish` in the terminal the developer
+              already has open, which signs in by itself when it needs to. */}
         </div>
       </header>
 
-      {publishOpen && active && org !== "all" && (
-        <PublishDialog project={org} universe={active} onClose={() => setPublishOpen(false)} />
-      )}
-
       {/* Created, then SELECTED. Making a project and leaving the developer looking at the
           old one would be a step they have to discover. */}
       {newProjectOpen && (
@@ -218,14 +170,6 @@ function Shell({
         />
       )}
 
-      {connectOpen && (
-        <ConnectUniverse
-          active={active}
-          onSelect={onSelectUniverse}
-          onClose={() => setConnectOpen(false)}
-        />
-      )}
-
       {/* The shared screens size themselves with `flex-1`, so the host must be a flex
           column. As a grid cell they would collapse to their content height. */}
       <main className="flex min-h-0 flex-col overflow-hidden">

package/src/OfflineSession.tsx

@@ -0,0 +1,50 @@
+/**
+ * The permanently signed-out session local Studio hands the shared screens.
+ *
+ * Local Studio has NO auth chrome and NO publish path (LOCAL_STUDIO.md §Publish is
+ * terminal-only, 2026-08-21): authoring is offline, and identity exists only in the CLI
+ * at publish time (`unoverse login`). But the shared screens are also Canvas's, where a
+ * real session exists, so they call `useAuth()` unconditionally — and react-oidc-context
+ * warns loudly whenever the context VALUE is falsy. So the host supplies a real value
+ * meaning SIGNED OUT, permanently.
+ *
+ * The sign-in actions throw rather than no-op: reaching one from local Studio means a
+ * shared screen forgot which host it is in (the `hasAuth` capability flag is the check
+ * it should have made), and silence would hide that.
+ */
+import type { ReactNode } from "react";
+import { AuthContext, type AuthContextProps } from "react-oidc-context";
+
+function offline(name: string) {
+  return async () => {
+    throw new Error(`${name} is not available in local Studio. Publishing signs in from the terminal: unoverse publish.`);
+  };
+}
+
+/**
+ * Cast because `AuthContextProps` also carries the oidc-client-ts settings and event
+ * surface, none of which exists without a provider and none of which the screens touch.
+ */
+const OFFLINE_SESSION = {
+  isAuthenticated: false,
+  isLoading: false,
+  user: undefined,
+  error: undefined,
+  activeNavigator: undefined,
+  signinRedirect: offline("signinRedirect"),
+  signinPopup: offline("signinPopup"),
+  signinSilent: offline("signinSilent"),
+  signoutRedirect: offline("signoutRedirect"),
+  signoutPopup: offline("signoutPopup"),
+  signoutSilent: offline("signoutSilent"),
+  removeUser: offline("removeUser"),
+  clearStaleState: offline("clearStaleState"),
+  querySessionStatus: offline("querySessionStatus"),
+  revokeTokens: offline("revokeTokens"),
+  startSilentRenew: () => {},
+  stopSilentRenew: () => {},
+} as unknown as AuthContextProps;
+
+export function OfflineSession({ children }: { children: ReactNode }) {
+  return <AuthContext.Provider value={OFFLINE_SESSION}>{children}</AuthContext.Provider>;
+}

package/vendor/sdk/appEngine.tsx

@@ -188,11 +188,24 @@ export function AppEngine(cfg: AppConfig) {
   // connection, so a host badge watching its own (never-opened) in-page connection
   // reads "offline" forever while this session streams (observed live). Report the
   // truth the same way size is reported; hosts that don't listen lose nothing.
+  //
+  // `failure` is the last run's WORKFLOW_ERROR detail (which node, what error) —
+  // DEVELOPER information. A production embed host doesn't listen and its users see
+  // nothing; Studio's preview listens and shows it, so a dead run stops being a
+  // silence only the server logs could explain.
+  const [failure, setFailure] = useState(store.getLastFailure());
+  useEffect(() => store.subscribe(() => setFailure(store.getLastFailure())), [store]);
   useEffect(() => {
     // `refused` carries the server's terminal refusal text (register_session isError) —
     // the one state a "Connecting…" badge must not sit on forever.
-    postToEmbedHost({ type: "unoverse:status", ready: !!conn.isReady, connected: !!conn.isConnected, refused: conn.refusal ?? undefined });
-  }, [conn.isReady, conn.isConnected, conn.refusal]);
+    postToEmbedHost({
+      type: "unoverse:status",
+      ready: !!conn.isReady,
+      connected: !!conn.isConnected,
+      refused: conn.refusal ?? undefined,
+      failure: failure ?? undefined,
+    });
+  }, [conn.isReady, conn.isConnected, conn.refusal, failure]);
 
   // VOICE (§2e-1): a `service: "voice"` app runs the native voice service — which now lives
   // in the shared renderer (StreamedUnoverseTemplate), identical to Studio. The host only

package/vendor/sdk/lib/core/connection.ts

@@ -114,8 +114,19 @@ export function applyServerMessage(store: ComponentStore, msg: ServerMessage, se
       // born WITH its first component, so the streaming-and-empty window never exists.
       if (m.state === "WORKFLOW_STARTED" || m.state === "THINKING" || m.state === "RESPONDING" || m.state === "WAITING") {
         if (m.chatId) store.startResponse(m.chatId);
+        // A new run supersedes the previous run's failure detail.
+        if (m.state === "WORKFLOW_STARTED") store.setLastFailure(null);
       } else if (m.state === "WORKFLOW_COMPLETED" || m.state === "COMPLETE") {
         store.completeResponse(m.chatId);
+      } else if (m.state === "ERROR" || m.state === "WORKFLOW_ERROR") {
+        // SETTLE the turn exactly as completion does — a failed run must not leave the
+        // thinking state open forever (the eternal dots). What DIFFERS is invisible to
+        // a production user: the failure detail is stored for a developer host to
+        // read (Studio's preview); the SDK renders none of it.
+        store.completeResponse(m.chatId);
+        const failure = (m.metadata as { failure?: { nodeIds: string[]; errors: Record<string, string> } } | undefined)
+          ?.failure;
+        if (failure) store.setLastFailure(failure);
       }
       // Lifecycle machine — the global turn status (projected for visibleWhen).
       if (m.state === "WORKFLOW_STARTED" || m.state === "THINKING") store.setLifecycle("thinking");

package/vendor/sdk/lib/core/store.ts

@@ -274,6 +274,23 @@ export class ComponentStore {
     this.bump();
   }
 
+  // --- lastFailure: DEVELOPER detail from WORKFLOW_ERROR, stored and never rendered ---
+  //
+  // The SDK is a dumb renderer: a production app's experience does not change on a
+  // failed run (the turn settles exactly as on success). The failure detail is HELD
+  // here so a developer HOST that chooses to look (Studio's app preview) can show
+  // which node died and why. No SDK surface reads it.
+  private failure: { nodeIds: string[]; errors: Record<string, string> } | null = null;
+
+  /** The last run's failure detail, or null. Cleared when a new run starts. */
+  getLastFailure(): { nodeIds: string[]; errors: Record<string, string> } | null {
+    return this.failure;
+  }
+  setLastFailure(f: { nodeIds: string[]; errors: Record<string, string> } | null): void {
+    this.failure = f;
+    this.bump();
+  }
+
   /** Apply a streamed event (COMPONENT_INIT or COMPONENT_DATA). */
   apply(event: UnoverseEvent): void {
     const key = `${event.chatId}:${event.nodeId}`;