Skip to content

feat(example-layouts): PR-0 auto-install side effect + pilot cleanup#338

Merged
blove merged 8 commits into
mainfrom
examples-theme-sync-stage-2
May 15, 2026
Merged

feat(example-layouts): PR-0 auto-install side effect + pilot cleanup#338
blove merged 8 commits into
mainfrom
examples-theme-sync-stage-2

Conversation

@blove
Copy link
Copy Markdown
Contributor

@blove blove commented May 15, 2026

Summary

PR-0 of Stage 2 (spec: `docs/superpowers/specs/2026-05-15-examples-theme-sync-stage-2-design.md`, plan: `docs/superpowers/plans/2026-05-15-examples-theme-sync-stage-2-pr-0.md`).

  • `@ngaf/example-layouts` auto-install: new module-level side effect in `src/public-api.ts` calls `installEmbeddedTheme()` once on module load. Any app importing a layout component (or the function itself) triggers theme sync automatically — Stage 2 apps' `main.ts` files no longer need cockpit-specific boilerplate. Side effect guarded on `typeof document` for SSR safety; benign when not iframed.
  • `package.json` sideEffects fix: switched from `false` to `["./src/public-api.ts"]`. Without this, bundlers would tree-shake the auto-install. Layout components and `installEmbeddedTheme` itself remain tree-shake-safe individually.
  • Pilot cleanup: `cockpit/chat/timeline/angular` (Stage 1 pilot) had an explicit `installEmbeddedTheme()` import + call in `main.ts`. Removed — auto-install handles it via the transitive `ExampleChatLayoutComponent` import. Pilot template also migrated from `--ds-` to `--ngaf-chat-` per Stage 2 Q2=B convention.
  • New test: `public-api.spec.ts` verifies the side effect — imports the barrel via `vi.resetModules()`, asserts `data-theme` and `--ds-canvas` get set on ``.

After this PR lands, wave PRs (PR-1 chat, PR-2 langgraph, PR-3 deep-agents, PR-4 render+ag-ui) migrate the remaining 31 apps following the same clean pattern (no explicit `installEmbeddedTheme` in any app's `main.ts`).

Test plan

  • `pnpm nx run-many -t lint,test -p design-tokens,ui-react,example-layouts,chat,cockpit` — green
  • `pnpm nx e2e cockpit` — 6/6 green
  • `pnpm nx build website` — green
  • `pnpm nx build cockpit-chat-timeline-angular` — green (auto-install verified to run via side-effects array)
  • Post-merge chrome MCP smoke: chat-timeline pilot in cockpit, light + dark, verify theme sync still works after pilot-cleanup changes

🤖 Generated with Claude Code

blove and others added 8 commits May 15, 2026 13:00
Completes the rollout of cockpit-example theme sync to the remaining 31
Angular example apps. Five-PR sequence: PR-0 (library auto-install +
pilot cleanup), PR-1 (chat wave, 10 apps incl. a2ui migration to
example-chat-layout), PR-2 (langgraph, 8 apps), PR-3 (deep-agents,
6 apps), PR-4 (render + ag-ui, 7 apps).

Key decisions:
- installEmbeddedTheme moves to module-level side effect in
  @ngaf/example-layouts; main.ts files stay clean
- Templates use --ngaf-chat-* (chat lib namespace), not --ds-*
- A2UI wrapped in <example-chat-layout> for structural consistency
- Manual chrome MCP smoke per app per wave

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
The auto-install side effect added in this PR runs at module load
in public-api.ts. With `sideEffects: false`, bundlers (esbuild/webpack/
rollup) are free to drop the module-level statement when only the
named exports are consumed — tree-shaking would silently break the
auto-install in production builds.

Switch to an array form listing public-api.ts as the only file with
side effects. Layout components and the installEmbeddedTheme function
are still tree-shake-safe individually.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
@vercel
Copy link
Copy Markdown

vercel Bot commented May 15, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
cacheplane Ready Ready Preview, Comment May 15, 2026 8:34pm

Request Review

@blove blove merged commit b12c80f into main May 15, 2026
16 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant