view design_system/wiki/PRIMITIVE_MAP.md @ 266:efaf4c63cc94

fix clean production bundle staging Recreate deployment staging before copying the Bazel bundle and verify required inference runtime paths before promoting it. Co-authored-by: Copilot <[email protected]>
author MrJuneJune <me@mrjunejune.com>
date Fri, 07 Aug 2026 12:52:30 -0700
parents 60a876c4587a
children
line wrap: on
line source

# Primitive map

| Native authored element | Owning Zenbu primitive |
| --- | --- |
| `button`, button-like `a` | `zen-button` |
| text/email/file/etc. `input` | `zen-input` or `zen-field` |
| `textarea` | `zen-textarea` or `zen-field` |
| native `select` | `zen-native-select`, `zen-select`, or `zen-field` |
| checkbox input | `zen-checkbox` |
| radio inputs/fieldset | `zen-radio-group` |
| switch checkbox | `zen-switch` |
| range input | `zen-slider` |
| date value | `zen-calendar` or `zen-date-picker` |
| one-time-code input | `zen-input-otp` |
| filter input and options | `zen-combobox` |
| command input and items | `zen-command` |
| anchor with reusable effect | `zen-link` |
| heading with canonical type role | `zen-heading` |
| text with canonical type role | `zen-text` |
| padded container | `zen-box` |

## Control-owning composites

These behavior primitives already own their native buttons. Do not add a second
`zen-button`:

- menus, context menus, menubars, and navigation menus;
- tabs, toggles, toggle groups, and sidebars;
- calendars, carousels, commands, and data tables;
- notifications and dismissible alerts.

## Coordinating containers

Dialogs, alert dialogs, sheets, drawers, popovers, tooltips, forms, empty
states, and items coordinate or arrange content. They do not own application
actions. Wrap authored action buttons in `zen-button`, then put the native
`button` inside it.

## Generated controls

Component implementation code may create native buttons for accessibility.
Generated controls are owned by that component. Application-authored controls
are checked separately.