Maofeng
31 lines
1.2 KiB
Plaintext
31 lines
1.2 KiB
Plaintext
---
|
|
title: Choose components
|
|
description: Select primitives by responsibility instead of importing a single monolithic component index.
|
|
order: 11
|
|
toc:
|
|
- id: forms
|
|
title: Forms and input
|
|
- id: overlays
|
|
title: Overlays and menus
|
|
- id: content
|
|
title: Content and feedback
|
|
- id: icons
|
|
title: Icons
|
|
---
|
|
|
|
## Forms and input {#forms}
|
|
|
|
Use `Button`, `Input`, `Textarea`, `Field`, and `Label` for ordinary forms. Add `Checkbox`, `RadioGroup`, `Switch`, or `Slider` for choices, and `Select`, `Combobox`, `Command`, or `Calendar` for richer selection.
|
|
|
|
## Overlays and menus {#overlays}
|
|
|
|
`Dialog`, `AlertDialog`, `Sheet`, and `Drawer` cover modal surfaces. `Popover`, `HoverCard`, and `Tooltip` provide anchored information, while the menu modules cover context, dropdown, menubar, and navigation patterns.
|
|
|
|
## Content and feedback {#content}
|
|
|
|
Cards, items, tables, charts, progress, skeletons, spinners, empty states, messages, and toasts provide the common display vocabulary. Accordion, Collapsible, Tabs, Carousel, and Pagination organize larger content sets.
|
|
|
|
## Icons {#icons}
|
|
|
|
Import named icons from `@workspace/ui/components/icon`. The module centralizes the `@icones/react` vocabulary so applications and packages use the same icon source.
|