@f5-sales-demo/docs-theme 4.11.6 → 4.12.0

package/config.ts

@@ -23,13 +23,12 @@ import { defaultLocale as f5xcDefaultLocale, f5xcDefaultLocales } from './src/i1
 import { mobileLabels } from './src/i18n/mega-menu-translations.ts';
 import { sidebarTranslations } from './src/i18n/translations.ts';
 import remarkMermaid from './src/plugins/remark-mermaid.mjs';
+import { sharedSearchIntegration } from './src/shared/search-integration.mjs';
+import { sharedMode } from './src/shared/settings.mjs';
 import canonicalLlms from './src/utils/canonical-llms.mjs';
-import { providerMegaMenu } from './src/utils/canonical-provider.ts';
 import { menuLocalizationPolicy } from './src/utils/menu-localization.ts';
-import { stagedProviderSections } from './src/utils/provider-sections.ts';
 import { publicationSidebar, repositoryPublicationProfile } from './src/utils/publication-profiles.ts';
-import { resolveMegaMenuIcon } from './src/utils/resolve-icon.ts';
-import { federatedSearchSites } from './src/utils/search-sites';
+import { localSearchSites as federatedSearchSites } from './src/utils/search-sites';
 import providerSharedAssets from './src/utils/share-provider-assets.mjs';
 import { statisticsScriptMarkdown } from './src/utils/statistics-script-markdown.mjs';
 import { buildSubcategorySidebar } from './src/utils/subcategory-sidebar.ts';
@@ -126,333 +125,7 @@ export interface F5xcDocsConfigOptions {
   };
 }
 
-export const defaultMegaMenuItems: MegaMenuItem[] = [
-  {
-    label: 'Demos',
-    content: {
-      layout: 'grid',
-      columns: 2,
-      categories: [
-        {
-          title: 'Security',
-          items: [
-            {
-              label: 'Web App & API Protection',
-              description: 'Deploy an application security demo with Terraform and follow its protection walkthroughs.',
-              href: 'https://f5-sales-demo.github.io/webapp-api-protection/en/',
-              icon: resolveMegaMenuIcon('f5xc:web-app-and-api-protection'),
-            },
-            {
-              label: 'API Protection',
-              description: 'Find guides to API discovery, schema validation, and request controls.',
-              href: 'https://f5-sales-demo.github.io/api-protection/en/',
-              icon: resolveMegaMenuIcon('f5xc:application-traffic-insight'),
-            },
-            {
-              label: 'Bot Defense Advanced',
-              description: 'Review behavioral bot detection and mitigation scenarios.',
-              href: 'https://f5-sales-demo.github.io/bot-advanced/en/',
-              icon: resolveMegaMenuIcon('f5xc:bot-defense'),
-            },
-            {
-              label: 'Bot Defense Standard',
-              description: 'Review bot classification, verified crawlers, and blocking policies.',
-              href: 'https://f5-sales-demo.github.io/bot-standard/en/',
-              icon: resolveMegaMenuIcon('f5xc:bot-defense'),
-            },
-            {
-              label: 'Client-Side Defense',
-              description: 'Deploy browser script monitoring with an API or Terraform workflow.',
-              href: 'https://f5-sales-demo.github.io/csd/en/',
-              icon: resolveMegaMenuIcon('f5xc:client-side-defense'),
-            },
-            {
-              label: 'DDoS Mitigation',
-              description: 'Review distributed denial-of-service defenses and demo scenarios.',
-              href: 'https://f5-sales-demo.github.io/ddos/en/',
-              icon: resolveMegaMenuIcon('f5xc:ddos-and-transit-services'),
-            },
-            {
-              label: 'Web App Scanning',
-              description: 'Find web application vulnerability scanning guides.',
-              href: 'https://f5-sales-demo.github.io/was/en/',
-              icon: resolveMegaMenuIcon('f5xc:web-app-scanning'),
-            },
-            {
-              label: 'Custom responses',
-              description: 'Configure application replies, redirects, and security response pages.',
-              href: 'https://f5-sales-demo.github.io/custom-responses/en/',
-              icon: resolveMegaMenuIcon('f5xc:web-app-and-api-protection'),
-            },
-          ],
-        },
-        {
-          title: 'Networking and performance',
-          items: [
-            {
-              label: 'Multi-Cloud Networking',
-              description: 'Find site deployment and cross-cloud connectivity guides.',
-              href: 'https://f5-sales-demo.github.io/multi-cloud-networking/en/',
-              icon: resolveMegaMenuIcon('f5xc:multi-cloud-network-connect'),
-            },
-            {
-              label: 'Canada topology',
-              description: 'Deploy Canadian application hosting and demonstrate regional access controls.',
-              href: 'https://f5-sales-demo.github.io/canada/en/',
-              icon: {
-                body: fs
-                  .readFileSync(new URL('./assets/canada-flag.svg', import.meta.url), 'utf8')
-                  .replace(/<svg[^>]*>|<\/svg>/g, ''),
-                width: 640,
-                height: 480,
-                mode: 'original',
-              },
-            },
-            {
-              label: 'Content Delivery Network',
-              description: 'Review content delivery network (CDN) caching and origin configuration.',
-              href: 'https://f5-sales-demo.github.io/cdn/en/',
-              icon: resolveMegaMenuIcon('f5xc:content-delivery-network'),
-            },
-            {
-              label: 'DNS Management',
-              description: 'Find Domain Name System (DNS) zone and load balancing guides.',
-              href: 'https://f5-sales-demo.github.io/dns/en/',
-              icon: resolveMegaMenuIcon('f5xc:dns-management'),
-            },
-            {
-              label: 'NGINX One',
-              description: 'Review NGINX instance visibility and configuration management.',
-              href: 'https://f5-sales-demo.github.io/nginx/en/',
-              icon: resolveMegaMenuIcon('f5xc:nginx-one'),
-            },
-          ],
-        },
-      ],
-      footer: {
-        label: 'Demo catalog',
-        href: 'https://f5-sales-demo.github.io/en/demos/',
-        description: 'All demonstration and capability guides',
-      },
-    },
-  },
-  {
-    label: 'Demo environment',
-    content: {
-      layout: 'list',
-      categories: [
-        {
-          title: 'Deployment resources',
-          items: [
-            {
-              label: 'Origin server',
-              description: 'Compare the Azure full-origin stack with the separate AWS Juice Shop deployment.',
-              href: 'https://f5-sales-demo.github.io/origin-server/en/',
-              icon: resolveMegaMenuIcon('f5xc:distributed-apps'),
-            },
-            {
-              label: 'Traffic generator',
-              description:
-                'Choose Azure or AWS deployment guides for controlled security traffic and browser scenarios.',
-              href: 'https://f5-sales-demo.github.io/traffic-generator/en/',
-              icon: resolveMegaMenuIcon('f5xc:application-traffic-insight'),
-            },
-            {
-              label: 'CDN simulator',
-              description: 'Deploy an Azure proxy that adds CDN headers to origin requests.',
-              href: 'https://f5-sales-demo.github.io/cdn-simulator/en/',
-              icon: resolveMegaMenuIcon('f5xc:content-delivery-network'),
-            },
-          ],
-        },
-      ],
-      footer: {
-        label: 'Demo resource catalog',
-        href: 'https://f5-sales-demo.github.io/demo-resources/en/',
-        description: 'Azure and AWS offerings vary by component',
-      },
-    },
-  },
-  {
-    label: 'Operations',
-    content: {
-      layout: 'list',
-      categories: [
-        {
-          title: 'Queries and administration',
-          items: [
-            {
-              label: 'Statistics',
-              description: 'Query access logs, application metrics, and security telemetry through the API.',
-              href: 'https://f5-sales-demo.github.io/statistics/en/',
-              icon: resolveMegaMenuIcon('f5xc:doc'),
-            },
-            {
-              label: 'Observability',
-              description: 'Find monitoring, metrics, tracing, and alerting guides.',
-              href: 'https://f5-sales-demo.github.io/observability/en/',
-              icon: resolveMegaMenuIcon('f5xc:observability'),
-            },
-            {
-              label: 'Administration',
-              description: 'Find tenant, namespace, and role management guides.',
-              href: 'https://f5-sales-demo.github.io/administration/en/',
-              icon: resolveMegaMenuIcon('f5xc:administration'),
-            },
-          ],
-        },
-      ],
-    },
-  },
-  {
-    label: 'Developer tools',
-    content: {
-      layout: 'grid',
-      columns: 2,
-      categories: [
-        {
-          title: 'Tools and automation',
-          items: [
-            {
-              label: 'xcsh',
-              description:
-                'Install the independent terminal assistant for engineering and F5 Distributed Cloud workflows.',
-              href: 'https://f5-sales-demo.github.io/xcsh/en/',
-              icon: resolveMegaMenuIcon('carbon:terminal'),
-            },
-            {
-              label: 'Terraform provider',
-              description: 'Configure F5 Distributed Cloud resources with Terraform.',
-              href: 'https://f5-sales-demo.github.io/terraform-provider-xcsh/',
-              icon: resolveMegaMenuIcon('f5xc:doc'),
-            },
-            {
-              label: 'xcsh GitHub Action',
-              description: 'Run pinned xcsh manifest operations in GitHub Actions.',
-              href: 'https://f5-sales-demo.github.io/xcsh-action/en/',
-              icon: resolveMegaMenuIcon('carbon:workflow-automation'),
-            },
-            {
-              label: 'VS Code extension',
-              description: 'Author manifests and manage F5 Distributed Cloud resources in Visual Studio Code.',
-              href: 'https://f5-sales-demo.github.io/vscode-xcsh/en/',
-              icon: resolveMegaMenuIcon('carbon:code'),
-            },
-            {
-              label: 'xcsh Chrome extension',
-              description: 'Connect xcsh to the F5 Distributed Cloud console through a local browser bridge.',
-              href: 'https://f5-sales-demo.github.io/xcsh-chrome-extension/en/',
-              icon: resolveMegaMenuIcon('carbon:application-web'),
-            },
-            {
-              label: 'APT repository',
-              description: 'Install signed Debian and Ubuntu packages for xcsh and supporting tools.',
-              href: 'https://f5-sales-demo.github.io/apt-repo/en/',
-              icon: resolveMegaMenuIcon('f5xc:doc'),
-            },
-          ],
-        },
-        {
-          title: 'Specifications and plugins',
-          items: [
-            {
-              label: 'API specifications',
-              description: 'Find validated OpenAPI specifications and the specification update pipeline.',
-              href: 'https://f5-sales-demo.github.io/api-specs/en/',
-              icon: resolveMegaMenuIcon('f5xc:data-intelligence'),
-            },
-            {
-              label: 'Enriched API specifications',
-              description: 'Browse OpenAPI schemas with additional constraints and examples.',
-              href: 'https://f5-sales-demo.github.io/api-specs-enriched/en/',
-              icon: resolveMegaMenuIcon('f5xc:data-intelligence'),
-            },
-            {
-              label: 'xcsh marketplace',
-              description: 'Find xcsh plugins for documentation, sales, cloud, security, and desktop work.',
-              href: 'https://f5-sales-demo.github.io/marketplace/en/',
-              icon: resolveMegaMenuIcon('f5xc:ai_assistant_logo'),
-            },
-            {
-              label: 'Marketplace for Claude Code',
-              description: 'Find Language Server Protocol integrations and developer tools for Claude Code.',
-              href: 'https://f5-sales-demo.github.io/marketplace-claude-code/en/',
-              icon: resolveMegaMenuIcon('f5xc:doc'),
-            },
-            {
-              label: 'Console catalog',
-              description: 'Browse documented console routes and browser automation workflows.',
-              href: 'https://f5-sales-demo.github.io/console/en/',
-              icon: resolveMegaMenuIcon('f5xc:ai_assistant_logo'),
-            },
-          ],
-        },
-      ],
-    },
-  },
-  {
-    label: 'Ecosystem',
-    content: {
-      layout: 'list',
-      categories: [
-        {
-          title: 'Public projects',
-          items: [
-            {
-              label: 'F5 documentation corpus',
-              description: 'Browse curated F5 documentation and its Markdown sources.',
-              href: 'https://f5-sales-demo.github.io/html-to-markdown/',
-              icon: resolveMegaMenuIcon('f5xc:doc'),
-            },
-            {
-              label: 'Ecosystem directory',
-              description: 'Documentation, tools, and public project sources',
-              href: 'https://f5-sales-demo.github.io/en/ecosystem/',
-              icon: resolveMegaMenuIcon('f5xc:doc'),
-            },
-          ],
-        },
-      ],
-      footer: {
-        label: 'Project sources',
-        href: 'https://github.com/f5-sales-demo',
-        description: 'Public repositories in the community organization',
-      },
-    },
-  },
-  {
-    label: 'F5 services',
-    content: {
-      layout: 'list',
-      categories: [
-        {
-          title: 'Official documentation and services',
-          items: [
-            {
-              label: 'F5 Distributed Cloud console',
-              description: 'Management service; sign-in required',
-              href: 'https://console.ves.volterra.io',
-              icon: resolveMegaMenuIcon('f5xc:platform'),
-            },
-            {
-              label: 'F5 Distributed Cloud documentation',
-              description: 'Official public product documentation',
-              href: 'https://docs.cloud.f5.com',
-              icon: resolveMegaMenuIcon('f5xc:doc'),
-            },
-            {
-              label: 'MyF5 support',
-              description: 'Support portal; sign-in required for account services',
-              href: 'https://my.f5.com/manage/s/',
-              icon: resolveMegaMenuIcon('f5xc:support'),
-            },
-          ],
-        },
-      ],
-    },
-  },
-];
-
+export const defaultMegaMenuItems: MegaMenuItem[] = [];
 const defaultHead: HeadEntry[] = [
   {
     tag: 'script',
@@ -528,6 +201,7 @@ export function createF5xcDocsConfig(options: F5xcDocsConfigOptions = {}) {
   const githubRepository = options.githubRepository || process.env.GITHUB_REPOSITORY || '';
   const publicationProfile = repositoryPublicationProfile(githubRepository);
   const favicon = options.favicon || publicationProfile?.favicon;
+  if (options.favicon) process.env.DOCS_CUSTOM_FAVICON = options.favicon;
   let llmsOptionalLinks: Array<{ title: string; url: string }> = options.llmsOptionalLinks || [];
   if (!options.llmsOptionalLinks && process.env.LLMS_OPTIONAL_LINKS) {
     try {
@@ -568,19 +242,18 @@ export function createF5xcDocsConfig(options: F5xcDocsConfigOptions = {}) {
       console.warn('[docs-theme] OPENAPI_SPECS_CONFIG contains invalid JSON; skipping OpenAPI plugin.', e);
     }
   }
-  const megaMenuItems =
-    options.megaMenuItems ||
-    (canonicalProvider
-      ? [...defaultMegaMenuItems, ...providerMegaMenu(base, stagedProviderSections(canonicalProvider.manifest))]
-      : defaultMegaMenuItems);
+  const mode = sharedMode(githubRepository);
+  const megaMenuItems = options.megaMenuItems || defaultMegaMenuItems;
   const head =
     options.head ||
     (canonicalProvider || githubRepository === 'f5-sales-demo/f5-sales-demo.github.io' ? [] : defaultHead);
-  const logo = options.logo || { src: '@f5-sales-demo/docs-theme/assets/f5-distributed-cloud.svg' };
+  const logo =
+    options.logo ||
+    (mode === 'local' ? { src: '@f5-sales-demo/docs-theme/assets/f5-distributed-cloud.svg' } : undefined);
   const additionalRemarkPlugins = options.additionalRemarkPlugins || [];
   const additionalIntegrations = options.additionalIntegrations || [];
 
-  const federatedSearch = !canonicalProvider && options.federatedSearch !== false;
+  const federatedSearch = mode === 'local' && !canonicalProvider && options.federatedSearch !== false;
   const normalizedBase = base.replace(/\/+$/, '');
   const repositoryCorpusPolicy = progressiveCorpusPolicy(llmsConfig);
   const progressiveCorpus =
@@ -610,7 +283,7 @@ export function createF5xcDocsConfig(options: F5xcDocsConfigOptions = {}) {
     : undefined;
 
   const starlightPlugins: StarlightPlugin[] = [
-    starlightMegaMenu({ items: megaMenuItems, mobileLabels }),
+    ...(mode === 'local' ? [starlightMegaMenu({ items: megaMenuItems, mobileLabels })] : []),
     starlightVideosPlugin(),
     starlightImageZoom(),
     f5xcDocsTheme(githubRepository),
@@ -734,7 +407,10 @@ export function createF5xcDocsConfig(options: F5xcDocsConfigOptions = {}) {
   return defineConfig({
     site,
     base,
-    vite: { plugins: [menuLocalizationPolicy()], ...(canonicalProvider ? { build: { assetsInlineLimit: 0 } } : {}) },
+    vite: {
+      plugins: mode === 'local' ? [menuLocalizationPolicy()] : [sharedSearchIntegration()],
+      ...(canonicalProvider ? { build: { assetsInlineLimit: 0 } } : {}),
+    },
     ...(canonicalProvider
       ? {
           experimental: { collectionStorage: { type: 'chunked' as const, chunkSize: 1024 * 1024 } },

package/index.ts

@@ -1,5 +1,6 @@
 import type { StarlightPlugin } from '@astrojs/starlight/types';
 import { translations } from './src/i18n/translations.ts';
+import { sharedMode } from './src/shared/settings.mjs';
 
 export default function f5xcDocsTheme(repository = process.env.GITHUB_REPOSITORY || ''): StarlightPlugin {
   return {
@@ -19,12 +20,20 @@ export default function f5xcDocsTheme(repository = process.env.GITHUB_REPOSITORY
         updateConfig({
           customCss: [
             ...(config.customCss ?? []),
-            '@f5-sales-demo/docs-theme/fonts/font-face.css',
-            '@f5-sales-demo/docs-theme/styles/custom.css',
+            ...(sharedMode(repository) === 'local'
+              ? [
+                  '@f5-sales-demo/docs-theme/fonts/font-face.css',
+                  '@f5-sales-demo/docs-theme/styles/custom.css',
+                  '@f5-sales-demo/docs-theme/styles/shell.css',
+                ]
+              : []),
           ],
           components: {
             ...config.components,
-            Header: '@f5-sales-demo/docs-theme/components/SharedHeader.astro',
+            Header:
+              sharedMode(repository) === 'local'
+                ? '@f5-sales-demo/docs-theme/components/LocalHeader.astro'
+                : '@f5-sales-demo/docs-theme/components/SharedHeader.astro',
             Head: '@f5-sales-demo/docs-theme/components/Head.astro',
             ...(process.env.DOCS_PROFILE === 'canonical-provider'
               ? {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@f5-sales-demo/docs-theme",
-  "version": "4.11.6",
+  "version": "4.12.0",
   "description": "F5 Distributed Cloud branded Starlight documentation theme",
   "type": "module",
   "engines": {
@@ -48,7 +48,9 @@
     "./components/SharedHeader.astro": "./components/SharedHeader.astro",
     "./components/Head.astro": "./components/Head.astro",
     "./assets/canada-flag.svg": "./assets/canada-flag.svg",
-    "./assets/canada-favicon.svg": "./assets/canada-favicon.svg"
+    "./assets/canada-favicon.svg": "./assets/canada-favicon.svg",
+    "./styles/shell.css": "./styles/shell.css",
+    "./components/LocalHeader.astro": "./components/LocalHeader.astro"
   },
   "files": [
     "index.ts",
@@ -100,10 +102,11 @@
     "build": "node scripts/run-astro-with-content.mjs build",
     "dev": "node scripts/run-astro-with-content.mjs dev",
     "preview": "astro preview",
-    "test": "vitest run",
+    "test": "vitest run && npm run test:shared",
     "test:watch": "vitest",
     "test:visual": "playwright test",
-    "test:visual:update": "playwright test --update-snapshots"
+    "test:visual:update": "playwright test --update-snapshots",
+    "test:shared": "node --test tests/shared-shell.node.mjs"
   },
   "peerDependencies": {
     "@astrojs/markdown-remark": "^7.2.4",

package/src/shared/baseline.json

@@ -0,0 +1,30 @@
+{
+  "pointer": {
+    "contract": "v1",
+    "release": {
+      "url": "https://f5-sales-demo.github.io/shared/v1/releases/e3434cae2b7a79b34171b674e9378cdf3bfe3965071ca9c9b231e2d819f035e4.json",
+      "sha256": "e3434cae2b7a79b34171b674e9378cdf3bfe3965071ca9c9b231e2d819f035e4",
+      "bytes": 5766
+    }
+  },
+  "assets": {
+    "css": {
+      "url": "https://f5-sales-demo.github.io/shared/assets/b208db097ace5238f60a621abd4b03965c6c0bb5a35f1d498ea76172b23f6f29.css",
+      "sha256": "b208db097ace5238f60a621abd4b03965c6c0bb5a35f1d498ea76172b23f6f29",
+      "bytes": 44879,
+      "extension": "css"
+    },
+    "logo": {
+      "url": "https://f5-sales-demo.github.io/shared/assets/487f0f7a70ffaa67c7127b2eef2b094c6eae42d8d6e6ba0a14c784013b2c6d48.svg",
+      "sha256": "487f0f7a70ffaa67c7127b2eef2b094c6eae42d8d6e6ba0a14c784013b2c6d48",
+      "bytes": 2294,
+      "extension": "svg"
+    },
+    "favicon": {
+      "url": "https://f5-sales-demo.github.io/shared/assets/3402d9a74d6a627f098da467fda72cde93ee686ecb1ceba2c96d1f4bd18857b3.svg",
+      "sha256": "3402d9a74d6a627f098da467fda72cde93ee686ecb1ceba2c96d1f4bd18857b3",
+      "bytes": 4282,
+      "extension": "svg"
+    }
+  }
+}

package/src/shared/bootstrap.mjs

@@ -0,0 +1,135 @@
+import { ROOT, validateConsumer, validateData, validateManifest, validatePointer } from './contract.mjs';
+
+const CACHE_KEY = 'f5-shared-v1:last-success';
+const TIMEOUT = 12000;
+export async function verifiedBytes(receipt, fetcher = fetch, cryptoProvider = crypto) {
+  const response = await fetcher(receipt.url, { signal: AbortSignal.timeout(TIMEOUT) });
+  if (!response.ok) throw new Error(`Shared asset unavailable: ${response.status}`);
+  const bytes = await response.arrayBuffer();
+  const digest = Array.from(new Uint8Array(await cryptoProvider.subtle.digest('SHA-256', bytes)), (value) =>
+    value.toString(16).padStart(2, '0'),
+  ).join('');
+  if (bytes.byteLength !== receipt.bytes || digest !== receipt.sha256)
+    throw new Error('Shared asset integrity mismatch');
+  return bytes;
+}
+export async function loadRelease(pointer, fetcher = fetch, cryptoProvider = crypto) {
+  validatePointer(pointer);
+  const manifest = validateManifest(
+    JSON.parse(new TextDecoder().decode(await verifiedBytes(pointer.release, fetcher, cryptoProvider))),
+  );
+  const entries = Object.entries(manifest.assets);
+  const buffers = await Promise.all(entries.map(([, asset]) => verifiedBytes(asset, fetcher, cryptoProvider)));
+  const dataIndex = entries.findIndex(([key]) => key === 'data');
+  const data = validateData(JSON.parse(new TextDecoder().decode(buffers[dataIndex])));
+  return { pointer, manifest, data };
+}
+export async function selectRelease({ baseline, fetcher = fetch, storage, activate, cryptoProvider = crypto }) {
+  let cached;
+  try {
+    cached = JSON.parse(storage?.getItem(CACHE_KEY) || 'null');
+  } catch {
+    /* Storage may be unavailable. */
+  }
+  let active;
+  try {
+    const response = await fetcher(`${ROOT}v1/current.json`, {
+      cache: 'no-store',
+      signal: AbortSignal.timeout(TIMEOUT),
+    });
+    if (!response.ok) throw new Error('Active release unavailable');
+    active = validatePointer(await response.json());
+  } catch {
+    /* Try the previously verified release, then the build baseline. */
+  }
+  const attempted = new Set();
+  for (const pointer of [active, cached, baseline]) {
+    if (!pointer || attempted.has(pointer.release?.sha256)) continue;
+    attempted.add(pointer.release?.sha256);
+    try {
+      const release = await loadRelease(pointer, fetcher, cryptoProvider);
+      await activate(release);
+      try {
+        storage?.setItem(CACHE_KEY, JSON.stringify(pointer));
+      } catch {
+        /* Cache is optional. */
+      }
+      return release;
+    } catch {
+      /* A partial release must never replace the working shell. */
+    }
+  }
+  return null;
+}
+function integrity(receipt) {
+  return `sha256-${btoa(String.fromCharCode(...receipt.sha256.match(/../g).map((pair) => parseInt(pair, 16))))}`;
+}
+async function loadElement(element, parent) {
+  await new Promise((resolve, reject) => {
+    const timer = setTimeout(() => {
+      element.remove();
+      reject(new Error('Shared load timed out'));
+    }, TIMEOUT);
+    element.onload = () => {
+      clearTimeout(timer);
+      resolve();
+    };
+    element.onerror = () => {
+      clearTimeout(timer);
+      element.remove();
+      reject(new Error('Shared load failed'));
+    };
+    parent.append(element);
+  });
+}
+export async function startSharedShell(consumer, baseline) {
+  validateConsumer(consumer);
+  let storage;
+  try {
+    storage = window.localStorage;
+  } catch {
+    /* Browser policy can reject even property access. */
+  }
+  return selectRelease({
+    baseline,
+    storage,
+    activate: async (release) => {
+      const { css, runtime } = release.manifest.assets;
+      const link = document.createElement('link');
+      Object.assign(link, {
+        rel: 'stylesheet',
+        href: css.url,
+        integrity: integrity(css),
+        crossOrigin: 'anonymous',
+        media: 'not all',
+      });
+      let prepared;
+      try {
+        await loadElement(link, document.head);
+        window.F5SharedV1 ||= new Map();
+        if (!window.F5SharedV1.has(runtime.url)) {
+          const script = document.createElement('script');
+          Object.assign(script, {
+            type: 'module',
+            src: runtime.url,
+            integrity: integrity(runtime),
+            crossOrigin: 'anonymous',
+          });
+          await loadElement(script, document.head);
+        }
+        const implementation = window.F5SharedV1.get(runtime.url);
+        if (!implementation) throw new Error('Shared runtime did not register');
+        prepared = implementation.prepare(consumer, release);
+        prepared.commit();
+        link.media = 'all';
+        document.querySelector('[data-f5-baseline-css]')?.remove();
+        document.documentElement.dataset.f5SharedRelease = release.pointer.release.sha256;
+        document.dispatchEvent(new CustomEvent('f5:shared-ready', { detail: release.pointer }));
+      } catch (error) {
+        prepared?.dispose();
+        link.remove();
+        throw error;
+      }
+    },
+  });
+}