@ankhorage/studio 8.0.0 → 8.0.2

package/dist/host/layout/templates/index.d.ts

@@ -1,5 +1,9 @@
 /*** Audit coverage: exports-only entrypoint for generated layout and auth template sources. */
 export { getRootLayoutImportRequirements, getRootLayoutTsx } from './rootLayout';
+export { getRootShellImportRequirements, getRootShellTsx } from './rootShell';
+export { getRuntimeShellImportRequirements, getRuntimeShellTsx } from './runtimeShell';
+export { getStudioAppHeaderImportRequirements, getStudioAppHeaderTsx } from './studioAppHeader';
+export { getStudioShellImportRequirements, getStudioShellTsx } from './studioShell';
 export type { RootNavigationContent } from './rootLayout';
 export { getScreenTsx } from './screen';
 export { getAuthSessionTs } from './auth/session';

package/dist/host/layout/templates/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/host/layout/templates/index.ts"],"names":[],"mappings":"AAAA,+FAA+F;AAC/F,OAAO,EAAE,+BAA+B,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AACjF,YAAY,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACxC,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,uBAAuB,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAC1E,OAAO,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,wBAAwB,EAAE,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/host/layout/templates/index.ts"],"names":[],"mappings":"AAAA,+FAA+F;AAC/F,OAAO,EAAE,+BAA+B,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AACjF,OAAO,EAAE,8BAA8B,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAC9E,OAAO,EAAE,iCAAiC,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AACvF,OAAO,EAAE,oCAAoC,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAChG,OAAO,EAAE,gCAAgC,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AACpF,YAAY,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACxC,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,uBAAuB,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAC1E,OAAO,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,wBAAwB,EAAE,MAAM,YAAY,CAAC"}

package/dist/host/layout/templates/index.js

@@ -1,5 +1,9 @@
 /*** Audit coverage: exports-only entrypoint for generated layout and auth template sources. */
 export { getRootLayoutImportRequirements, getRootLayoutTsx } from './rootLayout';
+export { getRootShellImportRequirements, getRootShellTsx } from './rootShell';
+export { getRuntimeShellImportRequirements, getRuntimeShellTsx } from './runtimeShell';
+export { getStudioAppHeaderImportRequirements, getStudioAppHeaderTsx } from './studioAppHeader';
+export { getStudioShellImportRequirements, getStudioShellTsx } from './studioShell';
 export { getScreenTsx } from './screen';
 export { getAuthSessionTs } from './auth/session';
 export { getSignOutScreenTsx } from './auth/signOut';

package/dist/host/layout/templates/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/host/layout/templates/index.ts"],"names":[],"mappings":"AAAA,+FAA+F;AAC/F,OAAO,EAAE,+BAA+B,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAEjF,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACxC,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,uBAAuB,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAC1E,OAAO,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,wBAAwB,EAAE,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/host/layout/templates/index.ts"],"names":[],"mappings":"AAAA,+FAA+F;AAC/F,OAAO,EAAE,+BAA+B,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AACjF,OAAO,EAAE,8BAA8B,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAC9E,OAAO,EAAE,iCAAiC,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AACvF,OAAO,EAAE,oCAAoC,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAChG,OAAO,EAAE,gCAAgC,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAEpF,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACxC,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,uBAAuB,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAC1E,OAAO,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,wBAAwB,EAAE,MAAM,YAAY,CAAC"}

package/dist/host/layout/templates/rootLayout.d.ts

@@ -23,14 +23,11 @@ interface GetRootLayoutTsxArgs {
     includeStudio: boolean;
     authRuntime?: RootLayoutAuthRuntimeConfig;
     initialRouteNameOverride?: string;
-    runtimeModuleDeclarations?: string;
-    runtimeCapabilityExecutorHookName?: string;
     runtimeProviderEnd?: string[];
     runtimeProviderStart?: string[];
-    useStoredAuthSessionCredentialResolver?: boolean;
 }
 /***
- * Describe the generated root-layout import requirements, including Studio-only runtime and media-picker dependencies when authoring is enabled.
+ * Describe generated root-layout imports for splash-screen lifecycle and Studio media-picker ownership.
  */
 export declare function getRootLayoutImportRequirements(includeStudio: boolean): GeneratedImportRequirement[];
 /***

package/dist/host/layout/templates/rootLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"rootLayout.d.ts","sourceRoot":"","sources":["../../../../src/host/layout/templates/rootLayout.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAExD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,4BAA4B,CAAC;AAE7E,MAAM,WAAW,qBAAqB;IACpC,YAAY,EAAE,MAAM,CAAC;IACrB,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,UAAU,2BAA2B;IACnC,WAAW,EAAE,MAAM,CAAC;IACpB,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,EAAE,MAAM,CAAC;IACpB,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,EAAE,MAAM,EAAE,CAAC;CACxB;AAED,UAAU,oBAAoB;IAC5B,QAAQ,EAAE,WAAW,CAAC;IACtB,SAAS,EAAE,cAAc,EAAE,CAAC;IAC5B,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,qBAAqB,CAAC;IACvC,aAAa,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,2BAA2B,CAAC;IAC1C,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,iCAAiC,CAAC,EAAE,MAAM,CAAC;IAC3C,kBAAkB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC9B,oBAAoB,CAAC,EAAE,MAAM,EAAE,CAAC;IAChC,sCAAsC,CAAC,EAAE,OAAO,CAAC;CAClD;AAED;;GAEG;AACH,wBAAgB,+BAA+B,CAC7C,aAAa,EAAE,OAAO,GACrB,0BAA0B,EAAE,CAoD9B;AAaD;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,oBAAoB,UAshB1D"}
+{"version":3,"file":"rootLayout.d.ts","sourceRoot":"","sources":["../../../../src/host/layout/templates/rootLayout.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAExD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,4BAA4B,CAAC;AAE7E,MAAM,WAAW,qBAAqB;IACpC,YAAY,EAAE,MAAM,CAAC;IACrB,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,UAAU,2BAA2B;IACnC,WAAW,EAAE,MAAM,CAAC;IACpB,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,EAAE,MAAM,CAAC;IACpB,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,EAAE,MAAM,EAAE,CAAC;CACxB;AAED,UAAU,oBAAoB;IAC5B,QAAQ,EAAE,WAAW,CAAC;IACtB,SAAS,EAAE,cAAc,EAAE,CAAC;IAC5B,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,qBAAqB,CAAC;IACvC,aAAa,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,2BAA2B,CAAC;IAC1C,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,kBAAkB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC9B,oBAAoB,CAAC,EAAE,MAAM,EAAE,CAAC;CACjC;AAED;;GAEG;AACH,wBAAgB,+BAA+B,CAC7C,aAAa,EAAE,OAAO,GACrB,0BAA0B,EAAE,CAmB9B;AAaD;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,oBAAoB,UA8M1D"}

package/dist/host/layout/templates/rootLayout.js

@@ -1,5 +1,5 @@
 /***
- * Describe the generated root-layout import requirements, including Studio-only runtime and media-picker dependencies when authoring is enabled.
+ * Describe generated root-layout imports for splash-screen lifecycle and Studio media-picker ownership.
  */
 export function getRootLayoutImportRequirements(includeStudio) {
     return [
@@ -7,30 +7,10 @@ export function getRootLayoutImportRequirements(includeStudio) {
             source: 'react',
             namedImports: [{ imported: 'ReactNode', typeOnly: true }, { imported: 'useEffect' }],
         },
-        {
-            source: 'react-native',
-            namedImports: !includeStudio ? [{ imported: 'Alert' }] : [],
-        },
-        {
-            source: '@ankhorage/expo-runtime/bundled-media',
-            namedImports: [{ imported: 'createExpoBundledMediaResolver' }],
-        },
-        {
-            source: '@ankhorage/utility/object',
-            namedImports: [{ imported: 'readOwnProperty' }],
-        },
-        {
-            source: '@ankhorage/expo-runtime/icon-fonts',
-            namedImports: [{ imported: 'ExpoZoraIconFontProvider' }],
-        },
         {
             source: 'expo-splash-screen',
             namespaceImport: 'SplashScreen',
         },
-        {
-            source: '@/generated/bundledMediaRegistry',
-            namedImports: [{ imported: 'bundledMediaRegistry' }],
-        },
         ...(includeStudio
             ? [
                 {
@@ -39,19 +19,6 @@ export function getRootLayoutImportRequirements(includeStudio) {
                 },
             ]
             : []),
-        ...(includeStudio
-            ? [
-                {
-                    source: '@ankhorage/studio/runtime',
-                    namedImports: [
-                        { imported: 'createStudioActionSuppressionConfig' },
-                        { imported: 'createStudioInteractionPolicyResolver' },
-                        { imported: 'createStudioStationarySelectionWrapNode' },
-                        { imported: 'StationaryTapSelector' },
-                    ],
-                },
-            ]
-            : []),
     ];
 }
 /***
@@ -69,86 +36,19 @@ function indentGeneratedBlock(content, indent = '  ') {
  * TODO: Move generated application-shell template ownership out of the generic host/layout bucket into the project/template generation domain.
  */
 export function getRootLayoutTsx(args) {
-    const { manifest, mutations, allImports, allHooks, innerNavigation, includeStudio, authRuntime, initialRouteNameOverride, runtimeModuleDeclarations, runtimeCapabilityExecutorHookName, runtimeProviderEnd = [], runtimeProviderStart = [], useStoredAuthSessionCredentialResolver = false, } = args;
+    const { manifest, mutations, allImports, allHooks, innerNavigation, includeStudio, authRuntime, initialRouteNameOverride, runtimeProviderEnd = [], runtimeProviderStart = [], } = args;
     const moduleProvidersStart = mutations.flatMap((m) => m.providerStart);
     const moduleProvidersEnd = mutations.flatMap((m) => m.providerEnd).reverse();
     const innerThemeHook = innerNavigation.usesTheme ? '  const { theme } = useZoraTheme();\n' : '';
-    const resolvedRuntimeCapabilityExecutorHookName = runtimeCapabilityExecutorHookName ??
-        (includeStudio
-            ? 'useStudioRuntimeCapabilityExecutor'
-            : 'useGeneratedRuntimeCapabilityExecutor');
     const providersStart = [...runtimeProviderStart, ...moduleProvidersStart].join('\n    ');
     const providersEnd = [...moduleProvidersEnd, ...runtimeProviderEnd].join('\n    ');
     const finalJsx = providersStart ? `{${providersStart}{output}${providersEnd}}` : '{output}';
     const studioFinalJsx = finalJsx.replace('{output}', '{studioOutput}');
-    const appHeaderHelpers = `
-function findRouteByScreenId(navigator: NavigatorNode, screenId: string): RouteDefinition | null {
-  for (const route of navigator.routes) {
-    if (route.screenId === screenId) {
-      return route;
-    }
-
-    if (route.navigator) {
-      const nestedRoute = findRouteByScreenId(route.navigator, screenId);
-      if (nestedRoute) {
-        return nestedRoute;
-      }
-    }
-  }
-
-  return null;
-}
-
-function resolveAppHeaderTitle(manifest: AppManifest, pathname: string): string {
-  const screenId = resolveScreenIdForPathname(manifest.navigator, pathname, manifest.screens);
-  const route = screenId ? findRouteByScreenId(manifest.navigator, screenId) : null;
-  const screen = screenId ? manifest.screens[screenId] : undefined;
-  return route?.label ?? screen?.title ?? screen?.name ?? route?.name ?? 'App';
-}
-
-function resolveAppHeaderTitleForScreenId(
-  manifest: AppManifest,
-  screenId: string | null | undefined,
-): string | null {
-  if (!screenId) return null;
-
-  const screen = manifest.screens[screenId];
-  if (!screen) return null;
-
-  const route = findRouteByScreenId(manifest.navigator, screenId);
-  return route?.label ?? screen.title ?? screen.name;
-}
-
-function resolveStudioAppHeaderTitle(args: {
-  runtimeManifest: AppManifest;
-  studioManifest: AppManifest | null;
-  previewMode: boolean;
-  activeScreenId: string | null;
-  pathname: string;
-}): string {
-  const { runtimeManifest, studioManifest, previewMode, activeScreenId, pathname } = args;
-
-  if (previewMode) {
-    const previewTitle = resolveAppHeaderTitleForScreenId(
-      studioManifest ?? runtimeManifest,
-      activeScreenId,
-    );
-    if (previewTitle) return previewTitle;
-  }
-
-  return resolveAppHeaderTitle(runtimeManifest, pathname);
-}
-`;
     const authRuntimeHook = authRuntime
         ? includeStudio
             ? `
-const {
-  authState,
-  canAccessStudioAdmin,
-  handleInnerContentReady,
-  isAuthRuntimeReady,
-  pathname,
-} = useGeneratedAuthNavigation();
+const { authState, canAccessStudioAdmin, handleInnerContentReady, isAuthRuntimeReady, pathname } =
+  useGeneratedAuthNavigation();
 `
             : `
 const { authState, handleInnerContentReady } = useGeneratedAuthNavigation();
@@ -158,7 +58,13 @@ const { authState, handleInnerContentReady } = useGeneratedAuthNavigation();
     const indentedRootHookBlock = rootHookBlock.length > 0 ? `${indentGeneratedBlock(rootHookBlock)}\n\n` : '';
     const innerContentNode = authRuntime
         ? includeStudio
-            ? '<InnerContent authState={authState} canAccessStudioAdmin={canAccessStudioAdmin} onReady={handleInnerContentReady} />'
+            ? `(
+    <InnerContent
+      authState={authState}
+      canAccessStudioAdmin={canAccessStudioAdmin}
+      onReady={handleInnerContentReady}
+    />
+  )`
             : '<InnerContent authState={authState} onReady={handleInnerContentReady} />'
         : '<InnerContent />';
     const innerContentSignature = authRuntime
@@ -184,130 +90,43 @@ const { authState, handleInnerContentReady } = useGeneratedAuthNavigation();
   }
 `
         : '';
-    const runtimeCredentialResolver = useStoredAuthSessionCredentialResolver
-        ? '\n          credentialResolver: resolveRuntimeOperationCredential,'
-        : '';
-    const runtimeOperationHelpers = `
-async function runtimeApiFetch(
-  url: string,
-  init: {
-    readonly method: string;
-    readonly headers: Readonly<Record<string, string>>;
-    readonly body?: string;
-  },
-) {
-  const response = await fetch(url, {
-    method: init.method,
-    headers: init.headers,
-    body: init.body,
-  });
-
-  return {
-    status: response.status,
-    headers: Object.fromEntries(response.headers.entries()),
-    text: () => response.text(),
-  };
-}
-${useStoredAuthSessionCredentialResolver
-        ? `
-function resolveRuntimeOperationCredential(credential: { readonly kind?: string } | undefined) {
-  if (credential?.kind !== 'bearer' && credential?.kind !== 'oauth2') return undefined;
-
-  const session = getStoredAuthSession();
-  if (!session?.accessToken) return undefined;
-
-  return {
-    headers: {
-      Authorization: \`Bearer \${session.accessToken}\`,
-    },
-  };
-}
-`
-        : ''}
-`;
     const runtimeContentDeclaration = `const runtimeContent = (
-    <GeneratedRuntimeContent runtimeManifest={runtimeManifest}>
-      {appContent}
-    </GeneratedRuntimeContent>
+    <GeneratedRuntimeShell runtimeManifest={runtimeManifest}>{appContent}</GeneratedRuntimeShell>
   );`;
-    const generatedRuntimeContent = `function GeneratedRuntimeContent({
-  children,
+    const outputDeclaration = includeStudio
+        ? `const output = getGeneratedAppOutput({ appContent, appPathname, runtimeManifest });`
+        : `${runtimeContentDeclaration}
+  const output = runtimeContent;`;
+    const generatedAppOutput = includeStudio
+        ? `function getGeneratedAppOutput({
+  appContent,
+  appPathname,
   runtimeManifest,
 }: {
-  children: ReactNode;
-  runtimeManifest: AppManifest;
-}) {${includeStudio ? '\n  const { setMode } = useZoraTheme();' : ''}
-  const { executeCapability: executeApplicationCapability } =
-    ${resolvedRuntimeCapabilityExecutorHookName}(${includeStudio ? '{ setThemeMode: setMode }' : ''});
-  const executeCapability = useMemo(
-    () =>
-      composeRuntimeCapabilityExecutor({
-        apiCapabilityExecutor: createRuntimeApiCapabilityExecutor({
-          apis: runtimeManifest.infra.apis ?? {},
-          fetch: runtimeApiFetch,${runtimeCredentialResolver}
-        }),
-        capabilityExecutor: executeApplicationCapability,
-      }),
-    [executeApplicationCapability, runtimeManifest.infra.apis],
-  );
-
-  const generatedRuntimeConfig = useMemo(
-    () => ({
-      executeCapability,
-      registry: runtimeComponentRegistry,
-      mediaAssets: runtimeManifest.media?.assets,
-      resolveMediaAsset: bundledMediaResolver,
-    }),
-    [executeCapability, runtimeManifest.media?.assets],
+  readonly appContent: ReactNode;
+  readonly appPathname: string;
+  readonly runtimeManifest: AppManifest;
+}) {
+  const runtimeContent = (
+    <GeneratedRuntimeShell runtimeManifest={runtimeManifest}>{appContent}</GeneratedRuntimeShell>
   );
-
+  if (!__DEV__ || isStudioAdminPath(appPathname)) return runtimeContent;
   return (
-    <RuntimeRendererConfigProvider value={generatedRuntimeConfig}>
-      {children}
-    </RuntimeRendererConfigProvider>
+    <AnkhStudio
+      runtimeRegistry={runtimeComponentRegistry}
+      bundledMediaRegistry={bundledMediaRegistry}
+    >
+      {runtimeContent}
+    </AnkhStudio>
   );
-}`;
-    const outputDeclaration = includeStudio
-        ? `${runtimeContentDeclaration}
-  const output = __DEV__ ? (
-    isStudioAdminPath(appPathname) ? (
-      runtimeContent
-    ) : (
-      <AnkhStudio
-        runtimeRegistry={runtimeComponentRegistry}
-        bundledMediaRegistry={bundledMediaRegistry}
-      >
-        {runtimeContent}
-      </AnkhStudio>
-    )
-  ) : (
-    runtimeContent
-  );`
-        : `${runtimeContentDeclaration}
-  const output = runtimeContent;`;
+}`
+        : '';
     const moduleLevelDeclarations = [
-        runtimeModuleDeclarations?.trim(),
-        'const bundledMediaResolver = createExpoBundledMediaResolver(bundledMediaRegistry);',
-        runtimeOperationHelpers.trim(),
-        includeStudio ? appHeaderHelpers.trim() : '',
         includeStudio ? 'const studioMediaPicker = createExpoMediaPickerAdapter();' : '',
         innerNavigation.declarations.trim(),
     ]
         .filter(Boolean)
         .join('\n\n');
-    const studioRuntimeLines = includeStudio
-        ? `const appPathname = ${authRuntime ? 'pathname' : 'usePathname()'};
-const appRouteSearchParams = useGlobalSearchParams();
-const appRouteSearchParamsKey = JSON.stringify(appRouteSearchParams);
-const appLocation = useMemo(
-  () => resolveStudioNavigableLocation(appPathname),
-  [appPathname, appRouteSearchParamsKey],
-);
-const shouldMountAppHeader =
-  !isStudioAdminPath(appPathname) &&
-  ${authRuntime ? 'shouldMountAuthenticatedAppHeader(appPathname, isAuthRuntimeReady)' : 'true'};`
-        : '';
-    const indentedStudioRuntimeLines = studioRuntimeLines.length > 0 ? `\n${indentGeneratedBlock(studioRuntimeLines)}\n` : '\n';
     const handleInnerContentReadyDeclaration = '';
     const indentedHandleInnerContentReadyDeclaration = handleInnerContentReadyDeclaration.length > 0
         ? `${indentGeneratedBlock(handleInnerContentReadyDeclaration)}\n\n`
@@ -315,7 +134,7 @@ const shouldMountAppHeader =
     const studioShellBlock = includeStudio
         ? `if (__DEV__) {
   return (
-    <GeneratedRootView>
+    <GeneratedRootShell>
       <StudioProvider
         projectId={ankhConfig.metadata.slug}
         initialManifest={runtimeManifest}
@@ -331,9 +150,10 @@ const shouldMountAppHeader =
           appPathname={appPathname}
           appLocation={appLocation}
           shouldMountAppHeader={shouldMountAppHeader}
+          wrapOutput={(studioOutput) => <>${studioFinalJsx}</>}
         />
       </StudioProvider>
-    </GeneratedRootView>
+    </GeneratedRootShell>
   );
 }`
         : '';
@@ -344,232 +164,58 @@ const shouldMountAppHeader =
     const generatedAppShell = finalJsx === '{output}'
         ? '<AppShell>{output}</AppShell>'
         : `<AppShell>
-          ${finalJsx}
-        </AppShell>`;
-    const runtimeComponentRegistryDeclaration = 'const runtimeComponentRegistry = APP_COMPONENT_REGISTRY;';
-    return `
-${allImports}
-
-void SplashScreen.preventAutoHideAsync();
-
-${moduleLevelDeclarations}
-
-const fallbackManifest = ankhConfig as unknown as AppManifest;
-${runtimeComponentRegistryDeclaration}
-const rootViewStyle = { flex: 1 } as const;
-
-function GeneratedRootView({ children }: { children: ReactNode }) {
-  return (
-    <ExpoZoraIconFontProvider>
-      <GestureHandlerRootView style={rootViewStyle}>{children}</GestureHandlerRootView>
-    </ExpoZoraIconFontProvider>
-  );
-}
-
-function resolveZoraSurfaceThemeConfig(\n  theme: AppManifest['themes'][string],\n): AppManifest['themes'][string] {
-  return {
-    id: theme.id,
-    name: theme.name,
-    light: { ...theme.light },
-    dark: { ...theme.dark },
-    ...(theme.tokens === undefined ? {} : { tokens: theme.tokens }),
-    ...(theme.recipes === undefined ? {} : { recipes: theme.recipes }),
-  };
-}
-
-function resolveManifestActiveTheme(manifest: AppManifest): AppManifest['themes'][string] {
-  const theme = readOwnProperty<AppManifest['themes'][string]>(\n    manifest.themes,\n    manifest.activeThemeId,\n  );
-  if (!theme) {
-    throw new Error("Manifest active theme '" + manifest.activeThemeId + "' is missing.");
-  }
-  return theme;
-}
-
-function resolveThemeMode(
-  mode: AppManifest['activeThemeMode'],
-  fallback: NonNullable<AppManifest['activeThemeMode']>,
-): NonNullable<AppManifest['activeThemeMode']> {
-  if (mode === 'dark' || mode === 'light') return mode;
-  return fallback;
-}
-
-export const unstable_settings = {
-  initialRouteName: '${initialRouteNameOverride ?? manifest.navigator.initialRouteName ?? 'index'}',
-};
-
-export default function RootLayout() {
-${indentedRootHookBlock}  const manifestContext = useOptionalManifestContext();
-  const runtimeManifest = manifestContext?.manifest ?? fallbackManifest;${indentedStudioRuntimeLines}
+        ${finalJsx}
+      </AppShell>`;
+    const generatedAppRoot = `function GeneratedAppRoot({
+  appContent,
+  ${includeStudio ? 'appLocation,\n  appPathname,\n  shouldMountAppHeader,\n  ' : ''}runtimeManifest,
+}: {
+  readonly appContent: ReactNode;
+  ${includeStudio ? 'readonly appLocation: string;\n  readonly appPathname: string;\n  readonly shouldMountAppHeader: boolean;\n  ' : ''}readonly runtimeManifest: AppManifest;
+}) {
   const activeTheme = resolveManifestActiveTheme(runtimeManifest);
   const activeThemeMode = resolveThemeMode(runtimeManifest.activeThemeMode, 'light');
-${indentedHandleInnerContentReadyDeclaration}  const appContent = ${innerContentNode};
-
   ${outputDeclaration}
 
   const shell = (
-    <GeneratedZoraProvider theme={activeTheme} initialMode={activeThemeMode}>
-      <SafeAreaProvider>
-        ${generatedAppShell}
-        <GeneratedStatusBar />
-      </SafeAreaProvider>
-    </GeneratedZoraProvider>
-  );
-${indentedStudioShellBlock}  return <GeneratedRootView>{shell}</GeneratedRootView>;
-}${includeStudio
-        ? `
-function StudioShell({
-  output,
-  activeThemeMode,
-  runtimeManifest,
-  appPathname,
-  appLocation,
-  shouldMountAppHeader,
-}: {
-  output: ReactNode;
-  activeThemeMode: NonNullable<AppManifest['activeThemeMode']>;
-  runtimeManifest: AppManifest;
-  appPathname: string;
-  appLocation: string;
-  shouldMountAppHeader: boolean;
-}) {
-  const {
-    activeCanvasDragNodeId,
-    activeScreenId,
-    componentMeta,
-    manifest: studioManifest,
-    moveNodeToPlacement,
-    previewMode,
-    rootNode,
-    selectedNodeId,
-    selectNode,
-    setActiveCanvasDragNodeId,
-    setLastNonAdminLocation,
-  } = useStudio();
-  const { theme } = useZoraTheme();
-  useEffect(() => {
-    const nextAppLocation = resolveStudioLastNonAdminLocation({
-      pathname: appPathname,
-      navigableLocation: appLocation,
-    });
-    if (nextAppLocation) setLastNonAdminLocation(nextAppLocation);
-  }, [appLocation, appPathname, setLastNonAdminLocation]);
-
-  const studioWrapNode = useMemo(
-    () =>
-      createStudioStationarySelectionWrapNode({
-        builtInComponentRegistry: studioInteractionPolicyComponentRegistry,
-        previewMode,
-        thirdPartySupport: APP_EXTENSION_INTERACTION_POLICY_SUPPORT,
-      }),
-    [previewMode],
-  );
-  const studioResolveNodeProps = useMemo(
-    () =>
-      createStudioInteractionPolicyResolver({
-        builtInComponentRegistry: studioInteractionPolicyComponentRegistry,
-        previewMode,
-        thirdPartySupport: APP_EXTENSION_INTERACTION_POLICY_SUPPORT,
-      }),
-    [previewMode],
-  );
-  const appHeaderTitle = resolveStudioAppHeaderTitle({
-    runtimeManifest,
-    studioManifest,
-    previewMode,
-    activeScreenId,
-    pathname: appPathname,
-  });
-  const header = shouldMountAppHeader ? (
-    <StudioAppHeader appHeaderTitle={appHeaderTitle} />
-  ) : undefined;
-  const studioRuntimeManifest = studioManifest ?? runtimeManifest;
-  const activeStudioTheme = resolveManifestActiveTheme(studioRuntimeManifest);
-  const activeStudioThemeMode = resolveThemeMode(
-    studioRuntimeManifest.activeThemeMode,
-    activeThemeMode,
-  );
-  const studioRuntimeConfig = useMemo(
-    () => ({
-      ...createStudioActionSuppressionConfig(previewMode),
-      wrapNode: studioWrapNode,
-      resolveNodeProps: studioResolveNodeProps,
-    }),
-    [previewMode, studioWrapNode, studioResolveNodeProps],
-  );
-  const studioOutput = isStudioAdminPath(appPathname) ? (
-    output
-  ) : (
-    <StationaryTapSelector
-      canvasInteraction={{
-        activeDragNodeId: activeCanvasDragNodeId,
-        componentMeta,
-        moveNodeToPlacement,
-        rootNode,
-        setActiveDragNodeId: setActiveCanvasDragNodeId,
-      }}
-      isEditMode={!previewMode}
-      selectionColor={theme.semantics.action.primary.base}
-      selectedNodeId={selectedNodeId}
-      selectNode={selectNode}
-    >
-      <RuntimeRendererConfigProvider value={studioRuntimeConfig}>
-        {output}
-      </RuntimeRendererConfigProvider>
-    </StationaryTapSelector>
-  );
-
-  return (
-    <GeneratedZoraProvider theme={activeStudioTheme} initialMode={activeStudioThemeMode}>
-      <SafeAreaProvider>
-        <AppShell header={header}>
-          ${studioFinalJsx}
-        </AppShell>
-        <GeneratedStatusBar />
-      </SafeAreaProvider>
-    </GeneratedZoraProvider>
-  );
-}
-
-function StudioAppHeader({ appHeaderTitle }: { appHeaderTitle: string }) {
-  const studioAppBar = useStudioAppBarAugmentation();
-
-  return (
-    <>
-      <AppBar title={appHeaderTitle} actions={studioAppBar.actions} />
-      {studioAppBar.overlays}
-    </>
-  );
-}`
-        : ''}
-
-${generatedRuntimeContent}
-
-function GeneratedZoraProvider({
-  children,
-  theme,
-  initialMode,
-}: {
-  children: ReactNode;
-  theme: AppManifest['themes'][string];
-  initialMode: NonNullable<AppManifest['activeThemeMode']>;
-}) {
-  const themeConfig = useMemo(() => resolveZoraSurfaceThemeConfig(theme), [theme]);
-
-  return (
-    <ZoraProvider themeConfig={themeConfig} initialMode={initialMode}>
-      {children}
-    </ZoraProvider>
-  );
-}
-
-function GeneratedStatusBar() {
-  const { mode } = useZoraTheme();
-  return <StatusBar style={mode === 'dark' ? 'light' : 'dark'} />;
+    <GeneratedThemeShell theme={activeTheme} initialMode={activeThemeMode}>
+      ${generatedAppShell}
+      <GeneratedStatusBar />
+    </GeneratedThemeShell>
+  );${indentedStudioShellBlock}  return <GeneratedRootShell>{shell}</GeneratedRootShell>;
+}`;
+    return [
+        allImports,
+        'void SplashScreen.preventAutoHideAsync();',
+        moduleLevelDeclarations,
+        `const fallbackManifest = ankhConfig as unknown as AppManifest;
+export const unstable_settings = {
+  initialRouteName: '${initialRouteNameOverride ?? manifest.navigator.initialRouteName ?? 'index'}',
+};`,
+        generatedAppOutput,
+        generatedAppRoot,
+        `export default function RootLayout() {
+${indentedRootHookBlock}  const manifestContext = useOptionalManifestContext();
+  const runtimeManifest = manifestContext?.manifest ?? fallbackManifest;
+${indentedHandleInnerContentReadyDeclaration}  const appContent = ${innerContentNode};
+  ${includeStudio
+            ? `const appPathname = ${authRuntime ? 'pathname' : 'usePathname()'};
+  const appLocation = resolveStudioNavigableLocation(appPathname);
+  const shouldMountAppHeader =
+    !isStudioAdminPath(appPathname) &&
+    ${authRuntime ? 'shouldMountAuthenticatedAppHeader(appPathname, isAuthRuntimeReady)' : 'true'};
+  `
+            : ''}return ${includeStudio
+            ? `(\n    <GeneratedAppRoot\n      appContent={appContent}\n      appLocation={appLocation}\n      appPathname={appPathname}\n      shouldMountAppHeader={shouldMountAppHeader}\n      runtimeManifest={runtimeManifest}\n    />\n  )`
+            : '<GeneratedAppRoot appContent={appContent} runtimeManifest={runtimeManifest} />'};
 }
 
 function InnerContent(${innerContentSignature}) {${innerContentReadyHook}
 ${innerThemeHook}${innerContentPendingBoundary}  ${innerContentReturn}
-}
-`.trimStart();
+}`,
+    ]
+        .filter(Boolean)
+        .join('\n\n')
+        .concat('\n');
 }
 //# sourceMappingURL=rootLayout.js.map