Components: Missing components

[JasonVMo]

Summary

Track and order the 32 canonical Fluent Flex components that are still missing from the agentic library, with one implementation task and a current blocker assessment for each. The work closes the catalog gap without hiding prerequisites: 14 components first need local specs, while the remaining waves depend chiefly on overlay infrastructure, roving focus, status icons, or React Native contract retargeting.

Observed. The canonical catalog contains 50 components. 18 are generated.
The gap is 32, of which 18 already have a staged spec folder in this repository and
14 have no local presence at all.

Goal

Enumerate, scope, and order every component in the canonical Fluent Flex catalog that
packages/agentic/components has not generated, one issue-ready task per component,
with each recorded blocker reassessed against current repository evidence.

Stage

Stage 0 for the inclusion rules and the count; Stage 2 for waves 1 and 2; Stage 3 for
waves 3 and 4.

Canonical source

Observed. The catalog is x3-design/fluent-design, default branch main, HEAD
d334acf
at retrieval on 2026-08-20. The authoritative enumeration is
component-map.yaml,
which contains exactly 50 component keys, each pointing at
plugins/components/skills/<name>/SKILL.md. Tier (atom / molecule), platform
coverage, and the component description come from
components-index/SKILL.md.

Inclusion and exclusion rules

These rules were fixed before the gap list was produced, so the count is derived
rather than curated.

Included

1. Catalog membership decides the universe. The universe is exactly the 50 keys in
   upstream component-map.yaml at the pinned SHA. Nothing is added from Fluent UI
   React v9, from the legacy FURN catalogs, or from judgement.
2. "Missing" means no directory under
   src/components whose
   name matches the upstream kebab-case key. Having a staged spec under
   specs/ does not count as
   generated.
3. Upstream first-class entries get their own task, even when they look like a
   subcomponent of another entry. Upstream catalogs list-item, listbox-item,
   menu-item, and nav-item as independent components, so nav-item is its own task
   rather than being folded into nav.
4. Upstream first-class entries get their own task, even when they look like a
   variant of another entry. destructive-button, toggle-button, and
   split-button are separate catalog entries. Each task must resolve, as an explicit
   decision, whether FURN implements it as a distinct component or as an axis on
   button; it does not get silently merged here.
5. Components that need native or platform host work stay in scope. scrollbar and
   select are kept as tasks in wave 4 with a decision gate, rather than dropped,
   because dropping them silently would remove them from the catalog reconciliation.

Excluded

1. FURN-only primitives. checkbox-indicator, compound-item-layout,
   focus-visual, icon, and layout-stable-text have no upstream catalog entry.
   They are implementation building blocks, not gap items, and get no task here.
   Upstream has no primitives tier at all; it classifies components only as atom or
   molecule.
2. Sub-parts that upstream does not catalog separately. Anatomy elements described
   inside another component's spec - a breadcrumb item, a menu section header, a
   toolbar separator, a card header - are owned by their parent component's task and do
   not get their own file. If upstream later promotes one to a catalog key, it becomes a
   task then.
3. Aliases. No upstream key is an alias of another; every key has its own
   SKILL.md. Should an alias appear, it would be folded into the aliased component's
   task.
4. Platform companions. Upstream mobile/ios and mobile/android companion specs
   do not create separate tasks. FURN's agentic library targets Windows and macOS
   (platform: react-native (Windows, macOS) in every local SPEC.md), so the web
   companion is the applicable source. Every one of the 50 catalog entries has web
   coverage, so no entry is excluded on platform grounds.
5. Speculative additions. Nothing that is not in the catalog appears here.
   Cross-cutting proposals live in the workstream README Suggested
   Additions section.

Resulting count

50 catalog entries - 18 generated = 32 tasks, listed below and each linked to
exactly one file in this directory.

Catalog reconciliation

Observed. Full mapping of the 50 upstream keys to local state.

Upstream key	Tier	Local state
accordion	atom	Generated
avatar	atom	Generated
avatar-group	molecule	Missing, no local spec
badge	atom	Generated
breadcrumb	molecule	Missing, spec staged
button	atom	Generated (contract drifted from upstream)
card	molecule	Generated
checkbox	molecule	Generated
combobox	molecule	Missing, no local spec
destructive-button	atom	Missing, no local spec
dialog	molecule	Missing, no local spec
divider	atom	Generated
drawer	molecule	Missing, spec staged
dropdown	molecule	Missing, spec staged
field	molecule	Missing, no local spec
info-label	molecule	Missing, spec staged
input	atom	Generated
interaction-tag	molecule	Missing, spec staged
label	atom	Missing, spec staged
link	atom	Missing, spec staged
list	molecule	Missing, spec staged
list-item	molecule	Generated
listbox-item	atom	Generated
menu	molecule	Missing, spec staged
menu-button	molecule	Missing, spec staged
menu-item	atom	Generated
message-bar	molecule	Missing, spec staged
nav	molecule	Missing, no local spec
nav-item	molecule	Missing, no local spec
popover	atom	Missing, spec staged
progress-bar	atom	Generated
radio	molecule	Generated
radio-group	molecule	Missing, spec staged
scrollbar	atom	Missing, spec staged
search-box	molecule	Missing, no local spec
select	atom	Missing, no local spec
simple-nav	molecule	Missing, no local spec
skeleton	atom	Generated
spinner	atom	Generated
split-button	atom	Missing, no local spec
switch	atom	Generated
tab	atom	Generated
tablist	molecule	Missing, spec staged
tag	atom	Generated
teaching-popover	molecule	Missing, no local spec
textarea	atom	Missing, spec staged
toast	molecule	Missing, no local spec
toggle-button	atom	Missing, no local spec
toolbar	molecule	Missing, spec staged
tooltip	atom	Missing, spec staged

Reverse gap

Observed. Five local items have no upstream catalog entry:
checkbox-indicator, compound-item-layout, focus-visual, icon, and
layout-stable-text, all under
src/primitives. Per
exclusion rule 1 they are not gap items. Whether they should be public API at all is a
Suggested Addition in the workstream README.

Blocker reassessment

Observed. Every one of the 18 staged specs carries a blockers.md. Reading all 18
shows they fall into three classes:

Class	Meaning	Components
A - Scope artifact, now stale	Blocked because a dependency did not exist in the package, or because the generation session was forbidden from editing src/index.ts. Those dependencies now exist.	interaction-tag, list, menu (partly), radio-group (partly), tablist
B - Real missing infrastructure	Blocked on overlay/anchoring, focus orchestration, or icon assets that still do not exist.	breadcrumb, drawer, dropdown, info-label, menu, menu-button, message-bar, popover, toolbar, tooltip
C - Contract conflict with React Native	The authored contract assumes web-native behavior that React Native does not provide, so the spec must be retargeted before implementation.	label, link, scrollbar, textarea

Observed examples of class A going stale: specs/list/blockers.md cites the absence
of a ListItem implementation, and src/components/list-item now exists;
specs/tablist/blockers.md cites the absence of a Tab, and src/components/tab now
exists; specs/radio-group/blockers.md cites the absence of a Radio, and
src/components/radio now exists; specs/interaction-tag/blockers.md cites only that
"the task explicitly forbids editing shared exports/manifests/config".

Observed. Several blocker files also describe the package as containing "only
Button and Icon", which was true when they were written and is no longer true.
Every individual task records this and states whether the blocker still holds.

Inferred. Class B collapses to two pieces of shared infrastructure -
popover (overlay, anchoring, light dismiss, focus return) and the
roving-focus decision in focus-zone.md - plus a status-icon source
set for message-bar. Class C requires a spec retargeting pass,
which is a decision in spec-ingestion-and-generation.md.

Waves and ordering

Inferred from the upstream dependency statements in each component's catalog
description and from the local implementation state.

Wave 1 - local component dependencies already generated (11)

No generated component dependency is missing. Five tasks still have a
cross-cutting prerequisite: label, link, and textarea need the
React-Native spec-retargeting decision; list needs the roving-focus decision;
and message-bar owns the shared status-icon source needed by itself, field,
and toast.

Component	Depends on (local, present)
avatar-group	avatar
destructive-button	button
interaction-tag	tag, avatar, icon
label	none
link	icon
list	list-item, checkbox, radio, divider
message-bar	button, icon
nav-item	icon, avatar, badge
search-box	input, button, icon
textarea	input patterns
toggle-button	button

Wave 2 - overlay and popover stack (9)

popover is the keystone; the rest depend on it.

combobox, dialog, drawer,
dropdown, menu, popover,
teaching-popover, toast,
tooltip.

Wave 3 - focus-orchestrated and composed (10)

Depend on wave 2, on the roving-focus decision in focus-zone.md, or
on a wave 1 component.

breadcrumb, field, info-label,
menu-button, nav,
radio-group, simple-nav,
split-button, tablist,
toolbar.

Wave 4 - platform or native decision required (2)

scrollbar, select.

Shared prerequisites

Rather than duplicating infrastructure work into 32 tasks, these are owned elsewhere
and referenced by the tasks that need them:

Prerequisite	Owner	Needed by
Pull the 14 absent specs from upstream	spec-ingestion-and-generation.md	all 14 no-local-spec tasks
Retarget web-native contracts to React Native	spec-ingestion-and-generation.md	label, link, scrollbar, textarea
Overlay, anchoring, light dismiss, focus return	popover	wave 2 and most of wave 3
Roving focus for agentic components	focus-zone.md	toolbar, tablist, radio-group, nav, simple-nav, menu, list
Cross-platform status icon source	message-bar	message-bar, field, toast
Coverage contract each new component must satisfy	component-test-strategy.md	all 32
Readiness level each new component targets	readiness-model.md	all 32
On-device macOS and Windows validation	storybook-e2e.md	all 32; a documented manual macOS run satisfies beta, required CI gates satisfy production

Evidence and references

• Upstream catalog: x3-design/fluent-design @
  d334acf,
  component-map.yaml,
  components-index/SKILL.md.
• Generated library:
  packages/agentic/components/src/components,
  src/primitives,
  src/index.ts.
• Staged specs and blocker records:
  packages/agentic/components/specs.
• Legacy catalogs used as comparison implementations:
  packages/components,
  packages/experimental,
  packages/native.

Sources retrieved 2026-08-20.