RFC: Bring the CAP visual language into Fluent UI v9

[GianoglioEnrico]

Overview

Proposes making the CAP visual language a first-class part of Fluent UI v9: consumers opt in via @fluentui/react-components alone (no @fluentui-contrib/* dependency), CAP source lives in the Fluent monorepo, and CAP is discoverable on the docs site as a visual-language picker alongside the theme picker.

Implementation tracked in #36308 .

What's in this RFC

A phased move of CAP_STYLE_HOOKS from fluentui-contrib into Fluent v9:

• Phase 1 — re-export. @fluentui/react-components adds the contrib package as an internal dependency and re-exports CAP_STYLE_HOOKS from the main barrel. Consumers drop @fluentui-contrib/* from package.json and write import { CAP_STYLE_HOOKS } from '@fluentui/react-components'.
• Phase 2 — move source. A new packages/react-components/react-cap-theme/ package owns CAP inside the monorepo, on Fluent's release cadence, gated by Fluent's CI (bundle size, VR, conformance). The contrib package becomes a deprecated re-export shim.

What's already validated

• Bundle size. Phase 1 was prototyped against live monosize fixtures: 0 bytes for tree-shakable named-import consumers across all 3 component-level fixtures; ≈+16 kB gz only for import *. When CAP is actively imported on a small-app baseline, +36.78 kB gz — that's the cost of the visual language (transitively imports override modules from ~20 Fluent component packages), not the re-export. Tables and methodology are in the RFC.
• Docs-site toggle UX. A working prototype is up at feat(react-components): integrate CAP visual language as a opt-in #36308 — adds a CAP visual-language toggle to the Storybook toolbar that overlays the currently-selected theme.

What I'm asking reviewers to decide

The RFC closes with the following open questions:

1. Skip Phase 1 entirely? Collapse Phase 1+2 into a single @fluentui/react-cap-theme move?
2. Distribution shape — confirm main-barrel re-export over subpath or separate preview package.
3. Docs-site toggle UX — does docs-site engineering agree with the toolbar-toggle design? https://fluentuipr.z22.web.core.windows.net/pull/36308/public-docsite-v9/react/index.html?path=/docs/components-button-button--docs

[github-actions]

📊 Bundle size report

✅ No changes found

[github-actions]

Pull request demo site: URL