Cloaked Design SystemReference

Segmented control

Compare the real components, explore every example, and follow the guidance into implementation.

Implementation preview

COMPLETE STORYBOOK REFERENCE

SegmentedControl

Explore every named example, including states, compositions, and theme variants.

4 stories

Playground selectedOpen canvas

Example source

packages/design-system/src/components/controls/SegmentedControl/SegmentedControl.stories.tsxExport Playground

Implementation preview Local Storybook build 0.2.0-preview.1. Source specification status does not approve this runtime.

Stories + source JSON ↗

Local specification source status: preview. Implementation preview pending sign-off.

A list of buttons for switching one view mode, with the selected option marked by aria-current.

Design-owned component contract ↗Version 0.2.0-preview.1 · Implementation preview pending sign-off

Read SegmentedControl guidance →

COMPLETE STORYBOOK REFERENCE

Tabs

Explore every named example, including states, compositions, and theme variants.

5 stories

Playground selectedOpen canvas

Example source

packages/design-system/src/components/controls/Tabs/Tabs.stories.tsxExport Playground

Implementation preview Local Storybook build 0.2.0-preview.1. Source specification status does not approve this runtime.

Stories + source JSON ↗

Local specification source status: preview. Implementation preview pending sign-off.

A horizontal tab list for choosing one sibling content panel, with a bold underline marking the controlled active tab.

Design-owned component contract ↗Version 0.2.0-preview.1 · Implementation preview pending sign-off

Read Tabs guidance →

Implementation preview

This design-owned implementation is ready to try and review. It does not establish product approval. Imported specifications retain their original review status.

Inspect version 0.2.0-preview.1