Fluent 2-styled, Office-like Ribbon — the kit's flagship composite, with two layouts from one tree. **single-line** (Word's 'Faixa de Opções de Linha Única') composes the kit Tabs, Toolbar (APG roving-tabindex), and the headless Overflow priority system so the lowest-priority commands drop into a '…' menu as the row shrinks; each RibbonItem renders two ways at once (an icon in the bar and an icon + full-label row in the menu, grouped by source group). **classic** (Word's two-row band) swaps Overflow for the headless GroupCollapse manager: as the ~96px band shrinks, whole groups collapse — highest collapsePriority first — to a dropdown button whose Popover flyout holds the group's same children, then the band falls back to horizontal scroll. New classic form parts RibbonLargeButton / RibbonRow / RibbonColumn compose group content; a `layouts` escape hatch on RibbonItem/RibbonGroup shows a command in only one layout. Controlled/uncontrolled tab selection plus a `collapsed` (tabs-only) axis; unknown `layout` values degrade to single-line. Custom overflowRender lets split buttons/combos supply their own menu form; focus follows a command into the '…' trigger (single-line) or its group's dropdown button (classic) when it overflows/collapses. The `layout` axis is controllable (`layout`/`defaultLayout`/`onLayoutChange`), as is `autoAdjust` (`autoAdjust`/`defaultAutoAdjust`/`onAutoAdjustChange`); the optional RibbonLayoutSwitcher reproduces Word's far-right display-options chevron (Clássica / Linha Única + Sempre mostrar / Apenas as guias / Ajustar automaticamente), pinned via RibbonTabList's `actions` slot.
pnpm dlx shadcn@latest add "https://fluent2-react-kit.graund.io/r/ribbon.json"