@d4gger/design-system 2.7.0 → 3.0.0

package/dist/components.css

@@ -14,6 +14,7 @@
 @import 'components/checkbox.css';
 @import 'components/checkbox-cards.css';
 @import 'components/checkbox-group.css';
+@import 'components/control-group.css';
 @import 'components/context-menu.css';
 @import 'components/color-picker.css';
 @import 'components/color-swatch.css';
@@ -62,6 +63,7 @@
 @import 'components/kbd.css';
 @import 'components/navigation-menu.css';
 @import 'components/number-input.css';
+@import 'components/phone-input.css';
 @import 'components/page-content.css';
 @import 'components/page-header.css';
 @import 'components/progress.css';
@@ -71,14 +73,15 @@
 @import 'components/rich-text-editor.css';
 @import 'components/scroll-area.css';
 @import 'components/search-bar.css';
-@import 'components/sheet.css';
 @import 'components/sidebar.css';
 @import 'components/sonner.css';
 @import 'components/table.css';
 @import 'components/tabs.css';
 @import 'components/tab-nav.css';
 @import 'components/tags-input.css';
+@import 'components/tag.css';
 @import 'components/textarea.css';
+@import 'components/text-area-field.css';
 @import 'components/toast.css';
 @import 'components/toggle.css';
 @import 'components/toggle-group.css';
@@ -155,6 +158,7 @@
 .dsx-date-picker__trigger,
 .dsx-theme,
 .dsx-input-group,
+.dsx-control-group,
 .dsx-item,
 .dsx-kbd,
 .dsx-calendar,
@@ -186,12 +190,6 @@
   color: var(--dsx-color-on-surface);
 }
 
-.dsx-select__trigger:focus-visible,
-.dsx-menubar__trigger:focus-visible {
-  outline: none;
-  box-shadow: var(--dsx-shadow-focus-ring);
-}
-
 .dsx-table__caption {
   margin-bottom: var(--dsx-space-md);
   text-align: left;
@@ -203,24 +201,6 @@
   letter-spacing: var(--dsx-typography-label-small-letter-spacing);
 }
 
-.dsx-menubar__trigger {
-  display: inline-flex;
-  align-items: center;
-  gap: var(--dsx-space-sm);
-  color: var(--dsx-color-on-surface);
-  text-decoration: none;
-}
-
-.dsx-menubar__trigger[data-highlighted] {
-  background: var(--dsx-effect-hover-ghost);
-  color: var(--dsx-color-primary);
-}
-
-.dsx-menubar__trigger[data-disabled] {
-  opacity: var(--dsx-opacity-disabled);
-  pointer-events: none;
-}
-
 .dsx-pills {
   display: flex;
   align-items: center;
@@ -235,23 +215,6 @@
   cursor: default;
 }
 
-.dsx-navigation-menu {
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  gap: var(--dsx-space-sm);
-}
-
-.dsx-navigation-menu {
-  display: inline-flex;
-  flex-direction: row;
-  gap: var(--dsx-space-xs);
-  padding: var(--dsx-space-xs);
-  border-radius: var(--dsx-rounded-md);
-  border: var(--dsx-border-width-sm) solid var(--dsx-color-outline);
-  background: var(--dsx-color-surface-overlay);
-}
-
 @keyframes dsx-skeleton-shimmer {
   0% {
     background-position: 200% 0;

package/dist/docs/README.md

@@ -0,0 +1,154 @@
+# D4gger Design System Documentation
+
+These consumer documents are generated from the canonical repository specifications at package build time.
+They describe public intent and contracts; TypeScript declarations remain the exact executable API.
+
+- [Consumer guide](./consumer-guide.md)
+- [Theme guide](./theme-guide.md)
+- [Component attribute contract](./component-contract.md)
+- [Machine-readable component index](./component-index.json)
+
+## Foundations
+
+- [Box](./components/box.md)
+- [ConfigDrawer](./components/config-drawer.md)
+- [Container](./components/container.md)
+- [DirectionProvider](./components/direction-provider.md)
+- [Flex](./components/flex.md)
+- [FontProvider](./components/font-provider.md)
+- [Grid](./components/grid.md)
+- [Inset](./components/inset.md)
+- [Layout (props)](./components/layout-props.md)
+- [Section](./components/section.md)
+- [Shared](./components/shared.md)
+- [Stack](./components/stack.md)
+- [Theme](./components/theme.md)
+- [ThemePanel](./components/theme-panel.md)
+- [ThemeProvider](./components/theme-provider.md)
+- [Typography](./components/typography.md)
+
+## Primitives
+
+- [AccessibleIcon](./components/accessible-icon.md)
+- [AspectRatio](./components/aspect-ratio.md)
+- [Avatar](./components/avatar.md)
+- [Badge](./components/badge.md)
+- [Blockquote](./components/blockquote.md)
+- [Button](./components/button.md)
+- [Checkbox](./components/checkbox.md)
+- [Code](./components/code.md)
+- [ColorSwatch](./components/color-swatch.md)
+- [CopyButton](./components/copy-button.md)
+- [Em](./components/em.md)
+- [Heading](./components/heading.md)
+- [Icon](./components/icon.md)
+- [IconButton](./components/icon-button.md)
+- [Input](./components/input.md)
+- [Kbd](./components/kbd.md)
+- [Label](./components/label.md)
+- [Link](./components/link.md)
+- [Progress](./components/progress.md)
+- [Quote](./components/quote.md)
+- [SegmentedMeter](./components/segmented-meter.md)
+- [Separator](./components/separator.md)
+- [Skeleton](./components/skeleton.md)
+- [Slider](./components/slider.md)
+- [Slot](./components/slot.md)
+- [Spinner](./components/spinner.md)
+- [Strong](./components/strong.md)
+- [Switch](./components/switch.md)
+- [Tag](./components/tag.md)
+- [Text](./components/text.md)
+- [TextArea](./components/text-area.md)
+- [Toggle](./components/toggle.md)
+- [Tooltip](./components/tooltip.md)
+- [VisuallyHidden](./components/visually-hidden.md)
+
+## Components
+
+- [Accordion](./components/accordion.md)
+- [Alert](./components/alert.md)
+- [AlertDialog](./components/alert-dialog.md)
+- [ArticleNodes](./components/article-nodes.md)
+- [Breadcrumb](./components/breadcrumb.md)
+- [ButtonGroup](./components/button-group.md)
+- [Calendar](./components/calendar.md)
+- [Callout](./components/callout.md)
+- [Card](./components/card.md)
+- [Carousel](./components/carousel.md)
+- [Chart](./components/chart.md)
+- [CheckboxCards](./components/checkbox-cards.md)
+- [CheckboxGroup](./components/checkbox-group.md)
+- [CodeInput](./components/code-input.md)
+- [Collapsible](./components/collapsible.md)
+- [ColorPicker](./components/color-picker.md)
+- [Combobox](./components/combobox.md)
+- [Command](./components/command.md)
+- [CommentThread](./components/comment-thread.md)
+- [ContextMenu](./components/context-menu.md)
+- [ControlGroup](./components/control-group.md)
+- [CopyField](./components/copy-field.md)
+- [DataList](./components/data-list.md)
+- [DataTable](./components/data-table.md)
+- [DatePicker](./components/date-picker.md)
+- [Dialog](./components/dialog.md)
+- [Drawer](./components/drawer.md)
+- [DropdownMenu](./components/dropdown-menu.md)
+- [Editable](./components/editable.md)
+- [EmptyState](./components/empty-state.md)
+- [Field](./components/field.md)
+- [FileUpload](./components/file-upload.md)
+- [FilterBar](./components/filter-bar.md)
+- [FloatingPanel](./components/floating-panel.md)
+- [Form](./components/form.md)
+- [HoverCard](./components/hover-card.md)
+- [InputGroup](./components/input-group.md)
+- [InputOtp](./components/input-otp.md)
+- [Item](./components/item.md)
+- [Marquee](./components/marquee.md)
+- [Menu](./components/menu.md)
+- [Menubar](./components/menubar.md)
+- [Metric](./components/metric.md)
+- [NativeSelect](./components/native-select.md)
+- [NavigationMenu](./components/navigation-menu.md)
+- [NotificationCenter](./components/notification-center.md)
+- [NumberInput](./components/number-input.md)
+- [PageContent](./components/page-content.md)
+- [PageHeader](./components/page-header.md)
+- [Pagination](./components/pagination.md)
+- [PasswordInput](./components/password-input.md)
+- [PhoneInput](./components/phone-input.md)
+- [Pills](./components/pills.md)
+- [Popover](./components/popover.md)
+- [Prose](./components/prose.md)
+- [QRCode](./components/qr-code.md)
+- [RadioCards](./components/radio-cards.md)
+- [RadioGroup](./components/radio-group.md)
+- [Rating](./components/rating.md)
+- [Resizable](./components/resizable.md)
+- [Result](./components/result.md)
+- [RichTextEditor](./components/rich-text-editor.md)
+- [ScrollArea](./components/scroll-area.md)
+- [SearchBar](./components/search-bar.md)
+- [SegmentedControl](./components/segmented-control.md)
+- [Select](./components/select.md)
+- [Sidebar](./components/sidebar.md)
+- [Sonner](./components/sonner.md)
+- [SortableList](./components/sortable-list.md)
+- [StatCard](./components/stat-card.md)
+- [Status](./components/status.md)
+- [Stepper](./components/stepper.md)
+- [Table](./components/table.md)
+- [TableOfContents](./components/table-of-contents.md)
+- [TabNav](./components/tab-nav.md)
+- [Tabs](./components/tabs.md)
+- [TagsInput](./components/tags-input.md)
+- [TextAreaField](./components/text-area-field.md)
+- [TextField](./components/text-field.md)
+- [Timeline](./components/timeline.md)
+- [TimePicker](./components/time-picker.md)
+- [Toast](./components/toast.md)
+- [ToggleGroup](./components/toggle-group.md)
+- [ToggleTip](./components/toggle-tip.md)
+- [Toolbar](./components/toolbar.md)
+- [TreeView](./components/tree-view.md)

package/dist/docs/component-contract.md

@@ -0,0 +1,224 @@
+# Component Contract Matrix
+
+**Authority**: A DSX component emits a `data-*` attribute iff the closest Radix Themes counterpart
+exposes that prop. For components without a Radix Themes equivalent the contract is derived by analogy
+from the closest RT category (see legend).
+
+**Reference**: Radix Themes v3 component API. Tiebreaker for any dispute: check
+[Radix Themes source](https://github.com/radix-ui/themes) for the matching component's prop list.
+
+## Tracked Attributes
+
+| `data-*` attr | Source prop | Notes |
+|---|---|---|
+| `data-variant` | `variant` | enum; values vary per component |
+| `data-size` | `size` | enum; values vary per component |
+| `data-accent-color` | `color` | `undefined` → attribute omitted entirely |
+| `data-radius` | `radius` | `none \| sm \| md \| lg \| full` |
+| `data-high-contrast` | `highContrast` | boolean; `false` → attribute omitted |
+
+## Legend
+
+**RT Counterpart column:**
+- `RT <Name>` — direct Radix Themes component; contract is authoritative
+- `Primitive` — Radix Primitive only (no Themes styling); contract by category analogy
+- `Custom` — no Radix equivalent; contract by analogy noted in "Notes" column
+
+**Analogy categories for Custom/Primitive components:**
+- `→ Button` — inherits Button contract (V+S+C+R+H)
+- `→ TextField` — inherits TextField contract (V+S+C+R, no H)
+- `→ Dialog` — inherits Dialog contract (S only)
+- `→ none` — utility/layout; no styling data-* attrs
+
+---
+
+## Contract Matrix
+
+`✓` = component SHOULD emit this `data-*` attribute  
+`—` = component should NOT emit (Radix does not expose this prop for this type)
+
+| Component | RT Counterpart | V | S | C | R | H | Notes |
+|---|---|:---:|:---:|:---:|:---:|:---:|---|
+| AccessibleIcon | RT AccessibleIcon | — | — | — | — | — | Utility wrapper |
+| Accordion | Primitive → none | — | — | — | — | — | No Themes counterpart |
+| Alert | Custom → RT Callout | ✓ | ✓ | ✓ | — | ✓ | Callout pattern; no radius in RT Callout |
+| AlertDialog | RT AlertDialog | — | ✓ | — | — | — | RT exposes size only |
+| ArticleNodes | Custom → none | — | — | — | — | — | Adapter-backed renderer collection; no shared styling root |
+| AspectRatio | RT AspectRatio | — | — | — | — | — | Layout utility |
+| Avatar | RT Avatar | ✓ | ✓ | ✓ | ✓ | ✓ | Full set |
+| Badge | RT Badge | ✓ | ✓ | ✓ | ✓ | ✓ | Full set |
+| Blockquote | RT Blockquote | — | — | — | — | — | Typographic; no styling props in RT |
+| Box | RT Box (layout) | — | — | — | — | — | Layout; no styling attrs |
+| Breadcrumb | Custom → none | — | ✓ | — | — | — | Size only; no RT counterpart |
+| Button | RT Button | ✓ | ✓ | ✓ | ✓ | ✓ | Reference implementation ✓ done |
+| ButtonGroup | Custom → Button | — | ✓ | — | — | — | Wraps buttons; size propagates |
+| Calendar | Custom → none | — | ✓ | ✓ | — | — | Date picker surface; size + accent |
+| Callout | RT Callout | ✓ | ✓ | ✓ | — | ✓ | No radius in RT Callout |
+| Card | RT Card | ✓ | ✓ | — | — | — | RT Card: variant+size only, no color/radius/H |
+| Carousel | Custom → none | — | ✓ | — | — | — | Size only |
+| Chart | Custom → none | — | — | — | — | — | Data viz; no standard styling attrs |
+| Checkbox | RT Checkbox | ✓ | ✓ | ✓ | — | ✓ | RT has no radius for Checkbox |
+| CheckboxCards | RT CheckboxCards | ✓ | ✓ | ✓ | — | — | RT CheckboxCards: V+S+C, no R or H |
+| CheckboxGroup | Custom → Checkbox | — | ✓ | ✓ | — | — | Container; propagates size + color |
+| Code | RT Code | ✓ | ✓ | ✓ | — | ✓ | RT Code: no radius |
+| CodeInput | Custom → TextField | — | ✓ | — | — | — | Composite input shell; size only on the root |
+| Collapsible | Primitive → none | — | — | — | — | — | No styling props in Primitive |
+| ColorPicker | Custom → none | — | ✓ | — | — | — | Size only |
+| ColorSwatch | Custom → none | — | ✓ | — | — | — | Defines own color; no accent override |
+| Combobox | Custom → TextField | ✓ | ✓ | ✓ | ✓ | — | Input-like trigger; follows TextField |
+| Command | Custom → none | — | ✓ | — | — | — | Command palette; size only |
+| CommentThread | Custom → none | — | — | — | — | — | Controlled discussion composition; no shared styling attrs |
+| ConfigDrawer | Custom → none | — | — | — | — | — | Configuration UI; no data-* styling |
+| Container | RT Container | — | ✓ | — | — | — | Layout; size only in RT |
+| ContextMenu | Primitive → Dialog | — | ✓ | — | — | — | Content size by Dialog analogy |
+| ControlGroup | Custom → InputGroup/ButtonGroup | — | ✓ | — | ✓ | — | Wraps unlike controls (Select, ToggleGroup, Button); size + radius only, no variant/accent/high-contrast of its own |
+| CopyButton | Custom → Button | ✓ | ✓ | ✓ | ✓ | ✓ | Button clone; full contract |
+| CopyField | Custom → TextField | — | ✓ | — | — | — | Read-only field composition; size only on the root |
+| DataList | RT DataList | ✓ | ✓ | — | — | — | RT DataList: variant+size, no C/R/H |
+| DataTable | Custom → none | — | ✓ | — | — | — | Table surface; size only |
+| DatePicker | Custom → TextField | — | ✓ | — | — | — | Trigger is button-like but no variant in DSX |
+| Dialog | RT Dialog | — | ✓ | — | — | — | RT Dialog: size only |
+| DirectionProvider | Utility → none | — | — | — | — | — | No styling |
+| Drawer | Custom → Dialog | — | ✓ | — | — | — | Sheet variant; size only |
+| DropdownMenu | Primitive → Dialog | — | ✓ | — | — | — | Content size; items have own variant |
+| Editable | Custom → TextField | ✓ | ✓ | — | ✓ | — | Inline edit; variant+size+radius |
+| Em | RT Em | — | — | — | — | — | Typographic; no props in RT |
+| EmptyState | Custom → none | ✓ | ✓ | — | — | — | Size + variant (`default`/`unavailable`) |
+| Field | Custom → none | — | ✓ | — | — | — | Form field wrapper; size only |
+| FileUpload | Custom → TextField | — | ✓ | — | — | — | Input-like; size only |
+| FilterBar | Custom → none | — | ✓ | — | — | — | Toolbar composition; size only on the root |
+| Flex | RT Flex (layout) | — | — | — | — | — | Layout; no styling attrs |
+| FloatingPanel | Custom → Card | — | ✓ | — | — | — | Panel; size only |
+| FontProvider | Utility → none | — | — | — | — | — | No styling |
+| Form | Custom → none | — | — | — | — | — | Form wrapper; no data-* needed |
+| Grid | RT Grid (layout) | — | — | — | — | — | Layout; no styling attrs |
+| Heading | RT Heading | — | ✓ | ✓ | — | ✓ | RT Heading: size+color+H, no variant/radius |
+| HoverCard | RT HoverCard | — | ✓ | — | — | — | Content size only in RT |
+| Icon | Custom → none | — | ✓ | — | — | — | Size only |
+| IconButton | RT IconButton | ✓ | ✓ | ✓ | ✓ | ✓ | Full set |
+| Inset | Custom → none | — | — | — | — | — | Layout; no styling attrs |
+| Input | RT TextField | ✓ | ✓ | ✓ | ✓ | — | RT TextField: V+S+C+R, no highContrast |
+| InputGroup | Custom → TextField | — | ✓ | — | — | — | Wrapper; size only |
+| InputOtp | Custom → TextField | — | ✓ | — | ✓ | — | Input-like; size+radius |
+| Item | Custom → none | — | — | — | — | — | Generic slot; no data-* |
+| Kbd | RT Kbd | — | ✓ | — | — | — | RT Kbd: size only |
+| Label | RT Label | — | ✓ | — | — | — | RT Label: size only |
+| Link | RT Link | — | ✓ | ✓ | — | ✓ | RT Link: size+color+H, no variant/radius |
+| Marquee | Custom → none | — | — | — | — | — | Animation; no styling attrs |
+| Menu | Custom → DropdownMenu | — | ✓ | — | — | — | Menu surface; size only |
+| Menubar | Primitive → DropdownMenu | — | ✓ | — | — | — | Content size by analogy |
+| Metric | Custom → none | — | ✓ | — | — | — | Metric composition; size only on root/value regions |
+| NativeSelect | Custom → Select | ✓ | ✓ | — | — | — | Select-like; variant+size, radius removed (no CSS backing) |
+| NavigationMenu | Primitive → none | — | ✓ | — | — | — | Size only |
+| NotificationCenter | Custom → none | — | — | — | — | — | Container; no data-* |
+| NumberInput | Custom → TextField | ✓ | ✓ | — | ✓ | — | Input-like; variant+size+radius |
+| Pagination | Custom → none | — | ✓ | — | — | — | Size only |
+| PasswordInput | Custom → TextField | ✓ | ✓ | — | ✓ | — | Input-like; variant+size+radius |
+| PhoneInput | Custom → TextField | ✓ | ✓ | — | — | — | Input-like; variant+size (density writes data-size); no accent/radius/high-contrast |
+| PageContent | Custom → none | — | — | — | — | — | Padding is represented by classes, not tracked attributes |
+| PageHeader | Custom → none | — | — | — | — | — | Structural page composition; no styling attrs |
+| Pills | Custom → Badge | ✓ | ✓ | ✓ | ✓ | — | Badge-like chip list; V+S+C+R |
+| Popover | Primitive → Dialog | — | ✓ | — | — | — | Content size by Dialog analogy |
+| Progress | RT Progress | ✓ | ✓ | ✓ | — | ✓ | RT Progress: no radius |
+| Prose | Custom → none | — | — | — | — | — | Read-side typography wrapper; no styling attrs |
+| QrCode | Custom → none | — | ✓ | — | — | — | Size only |
+| Quote | RT Blockquote | — | — | — | — | — | Alias; no props |
+| RadioCards | RT RadioCards | ✓ | ✓ | ✓ | — | — | RT RadioCards: V+S+C, no R or H |
+| RadioGroup | RT RadioGroup | ✓ | ✓ | ✓ | — | ✓ | RT RadioGroup: V+S+C+H, no radius |
+| Rating | Custom → none | — | ✓ | ✓ | — | — | Size + accent color |
+| Resizable | Primitive → none | — | — | — | — | — | Layout utility |
+| Result | Custom → none | — | — | — | — | — | State and tone use component-specific attributes only |
+| RichTextEditor | Custom → none | — | — | — | — | — | Complex editor; no data-* |
+| ScrollArea | RT ScrollArea | — | ✓ | — | ✓ | — | RT ScrollArea: size+radius, no V/C/H |
+| SearchBar | Custom → TextField | ✓ | ✓ | — | ✓ | — | Input-like; variant+size+radius |
+| Section | RT Section | — | ✓ | — | — | — | Layout; size only in RT |
+| SegmentedControl | RT SegmentedControl | ✓ | ✓ | — | — | — | RT: V+S, no C/R/H |
+| SegmentedMeter | Custom → Progress | — | ✓ | ✓ | — | — | Discrete meter; size + accent color |
+| Select | RT Select | ✓ | ✓ | — | — | — | RT Select.Trigger: V+S, no C/R/H |
+| Separator | RT Separator | — | ✓ | ✓ | — | — | RT Separator: size+color, no V/R/H |
+| Sheet | Custom → Dialog | — | ✓ | — | — | — | Dialog side-panel variant; size only |
+| Sidebar | Custom → variant | ✓ | — | — | — | — | Layout shell; ring `MenuBadge` emits `data-variant="ring"` |
+| Skeleton | RT Skeleton | — | — | — | — | — | No styling props in RT |
+| Slider | RT Slider | ✓ | ✓ | ✓ | ✓ | ✓ | Full set |
+| Slot | Radix Slot (utility) | — | — | — | — | — | Pure slot; no styling |
+| Sonner | Custom → none | — | — | — | — | — | Toast library wrapper |
+| SortableList | Custom → none | — | — | — | — | — | Adapter-backed reorder composition; no shared styling attrs |
+| Spinner | RT Spinner | — | ✓ | — | — | — | RT Spinner: size only |
+| Stack | Custom → none | — | — | — | — | — | Layout; no styling attrs |
+| StatCard | Custom → Card | ✓ | ✓ | — | — | — | Card variant; V+S |
+| Status | Custom → Badge | — | ✓ | ✓ | — | — | Status dot; size+color |
+| Stepper | Custom → none | — | ✓ | — | — | — | Size only |
+| Strong | RT Strong | — | — | — | — | — | Typographic; no props in RT |
+| Switch | RT Switch | ✓ | ✓ | ✓ | ✓ | ✓ | Full set ✓ done |
+| Tag | Custom → Button, Icon | ✓ | ✓ | ✓ | ✓ | ✓ | Full set; remove button is a plain host button |
+| Table | RT Table | ✓ | ✓ | — | — | — | RT Table: V+S, no C/R/H |
+| TableOfContents | Custom → none | — | — | — | — | — | Article navigation composition; no shared styling attrs |
+| TabNav | Custom → Tabs | ✓ | ✓ | — | — | — | Tab-nav bar; V+S |
+| Tabs | RT Tabs | ✓ | ✓ | — | — | — | RT TabsList: V+S, no C/R/H |
+| TagsInput | Custom → TextField | ✓ | ✓ | — | ✓ | — | Input with tags; V+S+R |
+| Text | RT Text | — | ✓ | ✓ | — | ✓ | RT Text: size+color+H, no variant/radius |
+| TextArea | RT TextArea | ✓ | ✓ | ✓ | ✓ | — | RT TextArea: V+S+C+R, no highContrast |
+| TextAreaField | Custom → TextField | ✓ | ✓ | ✓ | ✓ | — | Multiline field composite; V+S+C+R like TextField |
+| TextField | RT TextField | ✓ | ✓ | ✓ | ✓ | — | RT TextField: V+S+C+R, no highContrast |
+| Theme | Utility → none | — | — | — | — | — | Wrapper+document contract by design: writes `data-dsx-theme`, `data-dsx-density`, `data-dsx-scaling`, `data-accent-color`, `data-gray-color`, `data-radius`, `data-panel-background`, `data-has-background` to its host (and to `html`/`body` when `applyToDocument`); not a styling-variant contract |
+| ThemePanel | Custom → none | — | — | — | — | — | Dev utility; no data-* |
+| ThemeProvider | Custom → none | — | — | — | — | — | Theme root; no data-* |
+| Timeline | Custom → none | — | ✓ | — | — | — | Size only |
+| TimePicker | Custom → TextField | — | ✓ | — | — | — | Trigger; size only |
+| Toast | Primitive → none | ✓ | ✓ | ✓ | ✓ | — | V+S on ToastRoot; C+R on ToastViewport for portal theme propagation |
+| Toggle | Custom → Button | ✓ | ✓ | — | — | ✓ | No RT Toggle; Button-like with H |
+| ToggleGroup | Custom → Button | ✓ | ✓ | — | — | ✓ | No RT ToggleGroup; Toggle container |
+| ToggleTip | Custom → Tooltip | — | ✓ | — | — | — | Tooltip-like; size only |
+| Toolbar | Primitive → none | — | ✓ | — | — | — | Container; size only |
+| Tooltip | RT Tooltip | — | — | — | — | — | RT Tooltip: no styling props |
+| TreeView | Custom → none | — | ✓ | — | — | — | Size only |
+| VisuallyHidden | RT VisuallyHidden | — | — | — | — | — | Accessibility utility |
+
+---
+
+## Summary by Contract Profile
+
+| Profile | Components | Count |
+|---|---|---|
+| Full (V+S+C+R+H) | Avatar, Badge, Button, CopyButton, IconButton, Slider, Switch, Tag | 8 |
+| V+S+C+R | Combobox, Input, Pills, TextArea, TextField | 5 |
+| V+S+C+H | Alert, Callout, Checkbox, Code, Progress, RadioGroup | 6 |
+| V+S+C | Calendar (S+C), CheckboxCards, RadioCards, Rating (S+C) | 4 |
+| V+S+R | Editable, NumberInput, PasswordInput, SearchBar, TagsInput | 5 |
+| V+S+H | Toggle, ToggleGroup | 2 |
+| V+S | Card, DataList, NativeSelect, SegmentedControl, Select, StatCard, Table, TabNav, Tabs, Toast | 10 |
+| S+C+H | Heading, Link, Text | 3 |
+| S+C | SegmentedMeter, Separator, Status | 3 |
+| S+R | ControlGroup, InputOtp, ScrollArea | 3 |
+| S only | AlertDialog, Breadcrumb, ButtonGroup, Calendar (see above), Carousel, CodeInput,<br>ColorPicker, ColorSwatch, Command, Container, ContextMenu, CopyField, DataTable,<br>DatePicker, Dialog, Drawer, DropdownMenu, EmptyState, Field, FileUpload, FilterBar,<br>FloatingPanel, HoverCard, Icon, InputGroup, Kbd, Label, Menu, Menubar, Metric,<br>NavigationMenu, Pagination, Popover, QrCode, Section, Sheet, Spinner, Stepper,<br>Timeline, TimePicker, ToggleTip, Toolbar, TreeView | 43 |
+| None | AccessibleIcon, Accordion, ArticleNodes, AspectRatio, Blockquote, Box, Chart,<br>Collapsible, CommentThread, ConfigDrawer, DirectionProvider, Em, Flex, FontProvider,<br>Form, Grid, Inset, Item, Marquee, NotificationCenter, PageContent, PageHeader, Prose, Quote,<br>Resizable, Result, RichTextEditor, Sidebar, Skeleton, Slot, Sonner, SortableList, Stack, Strong,<br>TableOfContents, Theme, ThemePanel, ThemeProvider, Tooltip, VisuallyHidden | 40 |
+
+**Total components covered: 131**
+
+---
+
+## Open Questions
+
+- [ ] **ColorSwatch**: confirm it should never carry `data-accent-color` even in a palette picker context.
+      (Current stance: no — it IS the color, not a consumer of the accent system.)
+- [ ] **Toast variant values**: what enum values — `info | success | warning | error`? Decide in milestone 4.
+- [ ] **Toggle/ToggleGroup radius**: Button analogy would include radius; omitted here because RT has no
+      Toggle. Revisit in milestone 3 audit if CSS targets `data-radius` on these elements.
+- [ ] **Combobox highContrast**: omitted (TextField analogy). If Combobox gains full color accent support,
+      H may be warranted. Audit in milestone 3.
+- [x] **`data-radius` is not safe as a component-local attribute name** (found live, 2026-08-26,
+      via `ControlGroup`): `_internal/BaseDialog.tsx`'s `PortalThemeBoundary` mirrors the app's
+      global radius setting into portaled content via `getClosestThemeAttribute(el,
+      'data-radius')` — a nearest-ancestor walk, not a read from `document.documentElement`.
+      Any component sitting between a portal trigger and `<html>` that emits its own literal
+      `data-radius` attribute for a *different, local* purpose gets picked up instead of the
+      real document-level value, silently corrupting portal-rendered content's radius (and,
+      transitively, any token that itself resolves through `--dsx-rounded-*`). `ControlGroup`
+      worked around this by using `data-group-radius` instead. The systemic fix —
+      `getClosestThemeAttribute` reading the true theme root directly rather than nearest-match
+      — lives in `_internal/` and wasn't made here (out of `component-build`'s scope for a
+      single-component change); flagged for whoever next touches `PortalThemeBoundary`.
+
+---
+
+*Status: canonical package contract input. Enforced by `qa:contracts`.*