Divergent

AdaptiveProjectionDemo

Shows one record adapting into several contract-driven views.

System role

Hand-written storytelling components reuse the same tokens, primitives and accessibility policies.

Variants
5
Theme
70 / 20 / 10

Rendered component states

Every documented variant

RESPONSIVE · REDUCED MOTION SAFE
01

form

AdaptiveProjectionDemo
formAPPLIED RECIPE
ADAPTIVEPROJECTIONDEMOOne operational truth.
Every role in flow.
standard densitybordered surfaceneutral tone

Use

form is selected by contract metadata, responsive context or explicit recipe configuration for AdaptiveProjectionDemo.

Motion

Static by default; local state changes use a short 240ms opacity/transform transition when helpful.

Accessibility

Meaning remains in text, focus order and semantic state; never colour or motion alone.

02

table

AdaptiveProjectionDemo
tableAPPLIED RECIPE
ADAPTIVEPROJECTIONDEMOOne operational truth.
Every role in flow.
standard densitybordered surfaceneutral tone

Use

table is selected by contract metadata, responsive context or explicit recipe configuration for AdaptiveProjectionDemo.

Motion

Static by default; local state changes use a short 240ms opacity/transform transition when helpful.

Accessibility

Meaning remains in text, focus order and semantic state; never colour or motion alone.

03

card

AdaptiveProjectionDemo
cardAPPLIED RECIPE
ADAPTIVEPROJECTIONDEMOOne operational truth.
Every role in flow.
standard densitybordered surfaceneutral tone

Use

card is selected by contract metadata, responsive context or explicit recipe configuration for AdaptiveProjectionDemo.

Motion

Static by default; local state changes use a short 240ms opacity/transform transition when helpful.

Accessibility

Meaning remains in text, focus order and semantic state; never colour or motion alone.

04

timeline

AdaptiveProjectionDemo
timelineAPPLIED RECIPE
ADAPTIVEPROJECTIONDEMOOne operational truth.
Every role in flow.
standard densitybordered surfaceneutral tone

Use

timeline is selected by contract metadata, responsive context or explicit recipe configuration for AdaptiveProjectionDemo.

Motion

Static by default; local state changes use a short 240ms opacity/transform transition when helpful.

Accessibility

Meaning remains in text, focus order and semantic state; never colour or motion alone.

05

dashboard

AdaptiveProjectionDemo
dashboardAPPLIED RECIPE
ADAPTIVEPROJECTIONDEMOOne operational truth.
Every role in flow.
spacious densitybordered surfaceneutral tone

Use

dashboard is selected by contract metadata, responsive context or explicit recipe configuration for AdaptiveProjectionDemo.

Motion

Static by default; local state changes use a short 240ms opacity/transform transition when helpful.

Accessibility

Meaning remains in text, focus order and semantic state; never colour or motion alone.

Previous← ModuleFeatureGridNextRoleOutcomeTabs →