@elizaos/app-core 2.0.0-alpha.69 → 2.0.0-alpha.71

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elizaos/app-core",
-  "version": "2.0.0-alpha.69",
+  "version": "2.0.0-alpha.71",
   "description": "Shared application core for Milady shells and white-label apps.",
   "type": "module",
   "license": "MIT",
@@ -68,8 +68,8 @@
     "@capacitor/haptics": "8.0.0",
     "@capacitor/keyboard": "8.0.0",
     "@capacitor/preferences": "^8.0.1",
-    "@elizaos/autonomous": "2.0.0-alpha.69",
-    "@elizaos/ui": "2.0.0-alpha.69",
+    "@elizaos/autonomous": "2.0.0-alpha.71",
+    "@elizaos/ui": "2.0.0-alpha.71",
     "@sparkjsdev/spark": "^0.1.10",
     "lucide-react": "^0.575.0",
     "three": "^0.182.0",
@@ -87,5 +87,5 @@
     "typescript": "^5.9.3",
     "vitest": "^4.0.18"
   },
-  "gitHead": "774937c9cbefd3d95fc181ca40295bb4fd5a7d3b"
+  "gitHead": "c150a8cf4bffddd7e934f3a6073a092ca1cd6520"
 }

package/src/api/client.ts

@@ -2087,6 +2087,10 @@ export class MiladyClient {
     }
   }
 
+  getBaseUrl(): string {
+    return this.baseUrl;
+  }
+
   setBaseUrl(baseUrl: string | null): void {
     const normalized = baseUrl?.trim().replace(/\/+$/, "") || "";
     this._explicitBase = normalized.length > 0;
@@ -5519,7 +5523,137 @@ export class MiladyClient {
       body: JSON.stringify({ settings }),
     });
   }
+
+  // ── Direct Eliza Cloud Auth (no local backend required) ─────────────
+
+  /**
+   * Initiate a direct login to Eliza Cloud without going through a local agent.
+   * Used in sandbox mode when no local backend exists yet.
+   */
+  async cloudLoginDirect(
+    cloudApiBase: string,
+  ): Promise<{ ok: boolean; browserUrl?: string; sessionId?: string; error?: string }> {
+    const res = await fetch(`${cloudApiBase}/api/v1/auth/login`, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+    });
+    if (!res.ok) {
+      return { ok: false, error: `Login failed (${res.status})` };
+    }
+    return res.json();
+  }
+
+  /**
+   * Poll a direct Eliza Cloud login session for authentication status.
+   */
+  async cloudLoginPollDirect(
+    cloudApiBase: string,
+    sessionId: string,
+  ): Promise<{
+    status: "pending" | "authenticated" | "expired" | "error";
+    token?: string;
+    userId?: string;
+    error?: string;
+  }> {
+    const res = await fetch(
+      `${cloudApiBase}/api/v1/auth/login/status?sessionId=${encodeURIComponent(sessionId)}`,
+    );
+    if (!res.ok) {
+      return { status: "error", error: `Poll failed (${res.status})` };
+    }
+    return res.json();
+  }
+
+  // ── Eliza Cloud Sandbox Provisioning ───────────────────────────────
+
+  /**
+   * Create a sandbox agent on Eliza Cloud and provision it.
+   * Returns the bridge URL when provisioning completes.
+   *
+   * Flow:
+   *   1. POST /api/v1/milady/agents — create agent record
+   *   2. POST /api/v1/milady/agents/{id}/provision — start async provisioning
+   *   3. Poll GET /api/v1/jobs/{jobId} until completed
+   *   4. Return bridgeUrl from job result
+   */
+  async provisionCloudSandbox(options: {
+    cloudApiBase: string;
+    authToken: string;
+    name: string;
+    bio?: string[];
+    onProgress?: (status: string, detail?: string) => void;
+  }): Promise<{ bridgeUrl: string; agentId: string }> {
+    const { cloudApiBase, authToken, name, bio, onProgress } = options;
+    const headers: Record<string, string> = {
+      "Content-Type": "application/json",
+      Authorization: `Bearer ${authToken}`,
+    };
+
+    onProgress?.("creating", "Creating agent...");
+
+    // Step 1: Create agent
+    const createRes = await fetch(`${cloudApiBase}/api/v1/milady/agents`, {
+      method: "POST",
+      headers,
+      body: JSON.stringify({ name, bio }),
+    });
+    if (!createRes.ok) {
+      const err = await createRes.text().catch(() => "Unknown error");
+      throw new Error(`Failed to create cloud agent: ${err}`);
+    }
+    const createData = (await createRes.json()) as { id: string };
+    const agentId = createData.id;
+
+    onProgress?.("provisioning", "Provisioning sandbox environment...");
+
+    // Step 2: Start provisioning
+    const provisionRes = await fetch(
+      `${cloudApiBase}/api/v1/milady/agents/${agentId}/provision`,
+      { method: "POST", headers },
+    );
+    if (!provisionRes.ok) {
+      const err = await provisionRes.text().catch(() => "Unknown error");
+      throw new Error(`Failed to start provisioning: ${err}`);
+    }
+    const provisionData = (await provisionRes.json()) as { jobId: string };
+    const jobId = provisionData.jobId;
+
+    // Step 3: Poll job status
+    const deadline = Date.now() + 120_000; // 2 minute timeout
+    while (Date.now() < deadline) {
+      await new Promise((r) => setTimeout(r, 2000));
+
+      const jobRes = await fetch(`${cloudApiBase}/api/v1/jobs/${jobId}`, {
+        headers,
+      });
+      if (!jobRes.ok) continue;
+
+      const jobData = (await jobRes.json()) as {
+        status: string;
+        result?: { bridgeUrl?: string };
+        error?: string;
+      };
+
+      if (jobData.status === "completed" && jobData.result?.bridgeUrl) {
+        onProgress?.("ready", "Sandbox ready!");
+        return { bridgeUrl: jobData.result.bridgeUrl, agentId };
+      }
+
+      if (jobData.status === "failed") {
+        throw new Error(
+          `Provisioning failed: ${jobData.error ?? "Unknown error"}`,
+        );
+      }
+
+      onProgress?.("provisioning", `Status: ${jobData.status}...`);
+    }
+
+    throw new Error("Provisioning timed out after 2 minutes");
+  }
 }
 
+/** @deprecated Use MiladyClient directly. */
+export type ElizaClient = MiladyClient;
+
 // Singleton
 export const client = new MiladyClient();

package/src/bridge/electrobun-rpc.ts

@@ -47,6 +47,7 @@ export interface DetectedProvider {
   apiKey?: string;
   authMode?: string;
   cliInstalled: boolean;
+  status?: string;
 }
 
 export async function scanProviderCredentials(): Promise<DetectedProvider[]> {

package/src/components/CharacterRoster.tsx

@@ -90,7 +90,7 @@ export function CharacterRoster({
 
   return (
     <div
-      className="flex flex-wrap items-start justify-center gap-y-1"
+      className="ce-roster"
       data-testid={`${testIdPrefix}-roster-grid`}
     >
       {entries.map((entry) => {
@@ -100,26 +100,16 @@ export function CharacterRoster({
           <button
             key={entry.id}
             type="button"
-            className={`group relative -mx-3 min-w-0 w-[9.75rem] text-center transition-all duration-300 ease-out ${
-              isSelected
-                ? "z-100 scale-[1.00] opacity-100"
-                : "scale-[1.00] opacity-70 hover:scale-[1.00] hover:opacity-100"
-            }`}
+            className={`ce-roster-card ${isSelected ? "ce-roster-card--active" : ""}`}
             onClick={() => onSelect(entry)}
             data-testid={`${testIdPrefix}-preset-${entry.id}`}
           >
             <div
-              className={`relative h-[10rem] w-full p-[2px] transition-all duration-300 ${
-                isSelected
-                  ? "bg-yellow-400 shadow-[0_0_28px_rgba(250,204,21,0.32)]"
-                  : useWhiteBorders
-                    ? "bg-white/10 hover:bg-white/35"
-                    : "bg-border/20 hover:bg-border/60"
-              }`}
+              className={`ce-roster-card-frame ${isSelected ? "ce-roster-card-frame--active" : ""}`}
               style={{ clipPath: SLANT_CLIP }}
             >
               <div
-                className="relative h-full w-full overflow-hidden"
+                className="ce-roster-card-inner"
                 style={{ clipPath: SLANT_CLIP }}
               >
                 {isSelected && (
@@ -132,19 +122,11 @@ export function CharacterRoster({
                   src={getVrmPreviewUrl(entry.avatarIndex)}
                   alt={entry.name}
                   draggable={false}
-                  className={`h-full w-full object-cover transition-transform duration-300 ease-out ${
-                    isSelected
-                      ? "scale-[1.04]"
-                      : "scale-100 group-hover:scale-[1.02]"
-                  }`}
+                  className={`ce-roster-card-img ${isSelected ? "ce-roster-card-img--active" : ""}`}
                 />
-                <div className="absolute inset-x-0 bottom-0">
+                <div className="ce-roster-card-label">
                   <div
-                    className={`px-2 py-1 text-sm font-semibold text-white transition-all ${
-                      isSelected
-                        ? "bg-black/78 shadow-[inset_0_1px_0_rgba(255,255,255,0.08)]"
-                        : "bg-black/62"
-                    }`}
+                    className={`ce-roster-card-name ${isSelected ? "ce-roster-card-name--active" : ""}`}
                     style={{ clipPath: INSET_CLIP }}
                   >
                     {entry.name}

package/src/components/CloudSourceControls.tsx

@@ -1,5 +1,4 @@
 import { Button } from "@elizaos/ui";
-import { useBranding } from "../config/branding";
 import { useApp } from "../state";
 
 export type CloudSourceMode = "cloud" | "own-key";
@@ -7,7 +6,7 @@ export type CloudSourceMode = "cloud" | "own-key";
 export function CloudSourceModeToggle({
   mode,
   onChange,
-  cloudLabel,
+  cloudLabel = "Eliza Cloud",
   ownKeyLabel = "Own API Key",
 }: {
   mode: CloudSourceMode;
@@ -15,8 +14,7 @@ export function CloudSourceModeToggle({
   cloudLabel?: string;
   ownKeyLabel?: string;
 }) {
-  const branding = useBranding();
-  const resolvedCloudLabel = cloudLabel ?? branding.cloudName;
+  const resolvedCloudLabel = cloudLabel;
   return (
     <div className="inline-flex overflow-hidden rounded-lg border border-[var(--border)] bg-[var(--card)] shadow-sm">
       <Button
@@ -59,9 +57,8 @@ export function CloudConnectionStatus({
   disconnectedText: string;
 }) {
   const { t } = useApp();
-  const branding = useBranding();
   const resolvedConnectedText =
-    connectedText ?? `Connected to ${branding.cloudName}`;
+    connectedText ?? "Connected to Eliza Cloud";
   return (
     <div className="flex items-center justify-between py-2.5 px-3 border border-[var(--border)] bg-[var(--bg-muted)]">
       {connected ? (

package/src/components/CompanionSceneHost.tsx

@@ -415,6 +415,19 @@ function CompanionSceneSurface({
     });
   }, [tab]);
 
+  /* ── Preload all VRM files into browser cache for instant character swaps ── */
+  const preloadedRef = useRef(false);
+  useEffect(() => {
+    if (preloadedRef.current || preloadAvatars.length === 0) return;
+    preloadedRef.current = true;
+    for (const entry of preloadAvatars) {
+      // Fire-and-forget fetch to warm browser cache; low priority.
+      void fetch(entry.vrmPath, { priority: "low" } as RequestInit).catch(
+        () => {},
+      );
+    }
+  }, [preloadAvatars]);
+
   return (
     <div
       ref={rootRef}

package/src/components/ConfigPageView.tsx

@@ -17,7 +17,6 @@ import {
   defaultRegistry,
   type JsonSchemaObject,
 } from "../config";
-import { DEFAULT_BRANDING, useBranding } from "../config/branding";
 import { useApp } from "../state";
 import type { ConfigUiHint } from "../types";
 import {
@@ -64,13 +63,12 @@ function CloudRpcStatus({
   onLogin,
 }: CloudRpcStatusProps) {
   const { t, setState, setTab } = useApp();
-  const branding = useBranding();
   if (connected) {
     return (
       <div className="flex items-center gap-2 text-xs">
         <span className="inline-block w-2 h-2 rounded-full bg-[var(--ok,#16a34a)]" />
         <span className="font-semibold">
-          {`Connected to ${branding.cloudName}`}
+          Connected to Eliza Cloud
         </span>
         {credits !== null && (
           <span className="text-[var(--muted)] ml-auto">
@@ -107,7 +105,7 @@ function CloudRpcStatus({
       <div className="flex items-center gap-2 text-xs">
         <span className="inline-block w-2 h-2 rounded-full bg-[var(--muted)]" />
         <span className="text-[var(--muted)]">
-          {`Requires ${branding.cloudName}`}
+          Requires Eliza Cloud
         </span>
       </div>
       <button
@@ -197,7 +195,6 @@ function RpcConfigSection<T extends string>({
   cloud,
   containerClassName,
 }: RpcSectionProps<T>) {
-  const branding = useBranding();
   const rpcConfig = buildRpcRendererConfig(
     selectedProvider,
     providerConfigs,
@@ -217,7 +214,7 @@ function RpcConfigSection<T extends string>({
         (key: string) => {
           // hack to get t function without breaking hook rules
           return key === "elizaclouddashboard.ElizaCloud"
-            ? branding.cloudName
+            ? "Eliza Cloud"
             : key;
         },
       )}
@@ -294,27 +291,27 @@ const CLOUD_SERVICE_DEFS: {
   {
     key: "inference",
     label: "Model Inference",
-    description: `Use ${DEFAULT_BRANDING.cloudName} for LLM calls. Turn off to use your own API keys (Anthropic, OpenAI, etc.)`,
+    description: `Use Eliza Cloud for LLM calls. Turn off to use your own API keys (Anthropic, OpenAI, etc.)`,
   },
   {
     key: "rpc",
     label: "Blockchain RPC",
-    description: `Use ${DEFAULT_BRANDING.cloudName} RPC endpoints for EVM, BSC, and Solana`,
+    description: `Use Eliza Cloud RPC endpoints for EVM, BSC, and Solana`,
   },
   {
     key: "media",
     label: "Media Generation",
-    description: `Use ${DEFAULT_BRANDING.cloudName} for image, video, audio, and vision`,
+    description: `Use Eliza Cloud for image, video, audio, and vision`,
   },
   {
     key: "tts",
     label: "Text-to-Speech",
-    description: `Use ${DEFAULT_BRANDING.cloudName} for TTS voice synthesis`,
+    description: `Use Eliza Cloud for TTS voice synthesis`,
   },
   {
     key: "embeddings",
     label: "Embeddings",
-    description: `Use ${DEFAULT_BRANDING.cloudName} for text embedding generation`,
+    description: `Use Eliza Cloud for text embedding generation`,
   },
 ];
 

package/src/components/FlaminaGuide.tsx

@@ -177,7 +177,7 @@ export function DeferredSetupChecklist({
       </div>
 
       <div className="space-y-2">
-        {onboardingDeferredTasks.map((task) => (
+        {(onboardingDeferredTasks as FlaminaGuideTopic[]).map((task) => (
           <div
             key={task}
             className="flex flex-col gap-2 rounded-xl border border-border/50 bg-bg/50 px-3 py-3 md:flex-row md:items-center md:justify-between"
@@ -199,7 +199,7 @@ export function DeferredSetupChecklist({
               <button
                 type="button"
                 className="rounded-full border border-border/60 px-3 py-1.5 text-[11px] font-semibold uppercase tracking-[0.12em] text-muted transition-colors hover:text-txt"
-                onClick={() => markDone(task)}
+                onClick={() => markDone(task as FlaminaGuideTopic)}
               >
                 Done
               </button>

package/src/components/VrmStage.tsx

@@ -83,6 +83,8 @@ export const VrmStage = memo(function VrmStage({
   const [loaderFading, setLoaderFading] = useState(false);
   const [loaderHidden, setLoaderHidden] = useState(false);
   const loaderFadingStartedRef = useRef(false);
+  /** After the first successful VRM load, suppress the loader on subsequent swaps. */
+  const hasLoadedFirstVrmRef = useRef(false);
 
   const chatAvatarVoice = useChatAvatarVoiceState();
 
@@ -142,6 +144,7 @@ export const VrmStage = memo(function VrmStage({
       if (state.vrmLoaded) {
         setVrmLoaded(true);
         setShowVrmFallback(false);
+        hasLoadedFirstVrmRef.current = true;
         if (!loaderFadingStartedRef.current) {
           loaderFadingStartedRef.current = true;
           setLoaderFading(true);
@@ -173,13 +176,17 @@ export const VrmStage = memo(function VrmStage({
     if (vrmPath === prevVrmPathRef.current && hasMountedRef.current) return;
     prevVrmPathRef.current = vrmPath;
     if (hasMountedRef.current) {
-      // Avatar changed — reset loading state but NOT the world
-      setVrmLoaded(false);
-      setShowVrmFallback(false);
-      setLoadingProgress(undefined);
-      setLoaderFading(false);
-      setLoaderHidden(false);
-      loaderFadingStartedRef.current = false;
+      // Avatar changed — reset loading state but NOT the world.
+      // After the first successful VRM load, keep the loader hidden so
+      // subsequent character swaps feel instant (no flash of loading bar).
+      if (!hasLoadedFirstVrmRef.current) {
+        setVrmLoaded(false);
+        setShowVrmFallback(false);
+        setLoadingProgress(undefined);
+        setLoaderFading(false);
+        setLoaderHidden(false);
+        loaderFadingStartedRef.current = false;
+      }
     }
     hasMountedRef.current = true;
   }, [vrmPath]);

package/src/components/avatar/VrmEngine.ts

@@ -838,6 +838,9 @@ export class VrmEngine {
     if (!this.scene || !this.renderer) return;
 
     const { SparkRenderer } = await this.loadSparkModule();
+    // Re-check after async import — the engine may have been disposed during
+    // the await (e.g. React StrictMode double-mount).
+    if (!this.scene || !this.renderer) return;
     const sparkRenderer = new SparkRenderer({
       renderer: this.renderer as THREE.WebGLRenderer,
       apertureAngle: 0.0,
@@ -1911,7 +1914,11 @@ export class VrmEngine {
     }
 
     await this.ensureSparkRenderer();
+    // Re-check after async — the engine may have been disposed during the
+    // await (e.g. React StrictMode double-mount or rapid navigation).
+    if (!this.scene || this.loadingAborted || requestId !== this.worldLoadRequestId) return;
     const spark = await this.loadSparkModule();
+    if (!this.scene || this.loadingAborted || requestId !== this.worldLoadRequestId) return;
     const { SplatMesh } = spark;
     let worldAnchor = new THREE.Vector3(0, 0, 0);
     let worldRevealRadius = 1;

package/src/components/avatar/VrmViewer.tsx

@@ -5,8 +5,8 @@
  * the `mouthOpen` prop. Sized to fill its parent container.
  */
 
-import { resolveAppAssetUrl } from "@elizaos/app-core/utils";
 import { useEffect, useEffectEvent, useRef } from "react";
+import { getVrmUrl } from "../../state/vrm";
 import {
   type CameraProfile,
   type InteractionMode,
@@ -15,7 +15,7 @@ import {
   type VrmEngineState,
 } from "./VrmEngine";
 
-const DEFAULT_VRM_PATH = resolveAppAssetUrl("vrms/eliza-1.vrm.gz");
+const DEFAULT_VRM_PATH = getVrmUrl(1);
 
 export type VrmViewerProps = {
   /** When false the loaded scene stays resident but the render loop is paused */

package/src/components/onboarding/ConnectionStep.tsx

@@ -4,11 +4,12 @@ import type {
   ProviderOption,
 } from "@elizaos/app-core/api";
 import { client } from "@elizaos/app-core/api";
+import { useBranding } from "@elizaos/app-core/config";
 import { isNative } from "@elizaos/app-core/platform";
 import { getProviderLogo } from "@elizaos/app-core/providers";
 import { useApp } from "@elizaos/app-core/state";
 import { openExternalUrl } from "@elizaos/app-core/utils";
-import { useState } from "react";
+import { useEffect, useState } from "react";
 
 function formatRequestError(err: unknown): string {
   if (err instanceof Error) {
@@ -46,6 +47,8 @@ export function ConnectionStep() {
     t,
   } = useApp();
 
+  const branding = useBranding();
+
   const [openaiOAuthStarted, setOpenaiOAuthStarted] = useState(false);
   const [openaiCallbackUrl, setOpenaiCallbackUrl] = useState("");
   const [openaiConnected, setOpenaiConnected] = useState(false);
@@ -148,7 +151,22 @@ export function ConnectionStep() {
     setState("onboardingOpenRouterModel", modelId);
   };
 
-  const providers = onboardingOptions?.providers ?? [];
+  const catalogProviders = onboardingOptions?.providers ?? [];
+  // Merge custom providers from branding (app-injected) with the catalog.
+  // Custom providers are appended; duplicates (by id) are skipped.
+  const customProviders = branding.customProviders ?? [];
+  const catalogIds = new Set(catalogProviders.map((p: ProviderOption) => p.id));
+  const providers = [
+    ...catalogProviders,
+    ...customProviders.filter((cp) => !catalogIds.has(cp.id as never)),
+  ] as ProviderOption[];
+  // Build a map of custom provider logos for getProviderLogo lookups.
+  const customLogoMap = new Map(
+    customProviders
+      .filter((cp) => cp.logoDark || cp.logoLight)
+      .map((cp) => [cp.id, { logoDark: cp.logoDark, logoLight: cp.logoLight }]),
+  );
+  const getCustomLogo = (id: string) => customLogoMap.get(id);
   const elizaCloudReady =
     elizaCloudConnected ||
     (onboardingRunMode === "cloud" &&
@@ -275,6 +293,20 @@ export function ConnectionStep() {
     }
   };
 
+  // On native (mobile) or when branding requires cloud-only, force sandbox mode
+  // — skip straight to Eliza Cloud login. These platforms cannot run a local
+  // backend, so cloud is the only option.
+  const forceCloud = isNative || branding.cloudOnly;
+  useEffect(() => {
+    if (forceCloud && !onboardingRunMode) {
+      setState("onboardingRunMode", "cloud");
+      setState("onboardingCloudProvider", "elizacloud");
+      setState("onboardingProvider", "");
+      setState("onboardingApiKey", "");
+      setState("onboardingPrimaryModel", "");
+    }
+  }, [forceCloud, onboardingRunMode, setState]);
+
   if (!showProviderSelection) {
     if (!onboardingRunMode) {
       return (
@@ -289,7 +321,7 @@ export function ConnectionStep() {
             {t("onboarding.hostingQuestion")}
           </div>
           <div className="onboarding-provider-grid">
-            {!isNative && (
+            {!isNative && !branding.cloudOnly && (
               <button
                 type="button"
                 className="onboarding-provider-card onboarding-provider-card--recommended"
@@ -730,7 +762,7 @@ export function ConnectionStep() {
                 onClick={() => handleProviderSelect(p.id)}
               >
                 <img
-                  src={getProviderLogo(p.id, false)}
+                  src={getProviderLogo(p.id, false, getCustomLogo(p.id))}
                   alt={display.name}
                   className="onboarding-provider-icon"
                 />
@@ -795,7 +827,7 @@ export function ConnectionStep() {
         >
           {selectedProvider && (
             <img
-              src={getProviderLogo(selectedProvider.id, false)}
+              src={getProviderLogo(selectedProvider.id, false, getCustomLogo(selectedProvider.id))}
               alt={selectedDisplay.name}
               className="onboarding-provider-icon"
               style={{ width: "1.5rem", height: "1.5rem" }}

package/src/components/onboarding/OnboardingStepNav.tsx

@@ -6,11 +6,14 @@ export function OnboardingStepNav() {
   const branding = useBranding();
 
   const isEliza = branding.appName === "Eliza";
+  const isCloudOnly = !!branding.cloudOnly;
   const activeSteps = isEliza
     ? ONBOARDING_STEPS.filter(
         (s) => s.id === "connection" || s.id === "activate",
       )
-    : ONBOARDING_STEPS;
+    : isCloudOnly
+      ? ONBOARDING_STEPS.filter((s) => s.id !== "wakeUp")
+      : ONBOARDING_STEPS;
 
   const currentIndex = activeSteps.findIndex((s) => s.id === onboardingStep);
 

package/src/config/branding.ts

@@ -1,10 +1,30 @@
 import { createContext, useContext } from "react";
 
+/**
+ * Custom provider that apps can inject into the onboarding flow.
+ * Uses `string` for id/family so apps aren't restricted to the built-in union.
+ */
+export interface CustomProviderOption {
+  id: string;
+  name: string;
+  envKey: string | null;
+  pluginName: string;
+  keyPrefix: string | null;
+  description: string;
+  family: string;
+  authMode: "api-key" | "cloud" | "credentials" | "local" | "subscription";
+  group: "cloud" | "local" | "subscription";
+  order: number;
+  recommended?: boolean;
+  /** Dark-mode logo path (e.g. "/logos/my-provider.png") */
+  logoDark?: string;
+  /** Light-mode logo path */
+  logoLight?: string;
+}
+
 export interface BrandingConfig {
   /** Product name shown in UI ("Eliza" | "Milady") */
   appName: string;
-  /** Cloud service name ("Eliza Cloud" | "Milady Cloud") */
-  cloudName: string;
   /** GitHub org ("elizaos" | "milady-ai") */
   orgName: string;
   /** GitHub repo name ("eliza" | "milady") */
@@ -21,11 +41,14 @@ export interface BrandingConfig {
   fileExtension: string;
   /** npm package scope ("elizaos" | "miladyai") */
   packageScope: string;
+  /** Custom providers injected by the app into the onboarding flow */
+  customProviders?: CustomProviderOption[];
+  /** When true, the app requires Eliza Cloud — local backend mode is disabled. */
+  cloudOnly?: boolean;
 }
 
 export const DEFAULT_BRANDING: BrandingConfig = {
   appName: "Eliza",
-  cloudName: "Eliza Cloud",
   orgName: "elizaos",
   repoName: "eliza",
   docsUrl: "https://docs.elizaos.ai",