dequelabs / dequelabs/cauldron

Connect Cauldron components to Figma

Open
#2,373 4 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
127
Forks
31
Avg merge
2d 12h
Merged PRs (30d)
8

Description

## Summary

Connect the rest of the Cauldron React components to Figma via [Code Connect](https://www.figma.com/code-connect-docs/) so designers see real Cauldron snippets in Dev Mode. `IconButton` is already connected and serves as the working pattern.

The full breakdown — conventions, per-component Figma node IDs, prop-mapping suggestions, and known gotchas — is in the attached **[cauldron-figma-code-connect-plan.md](https://github.com/user-attachments/files/27711403/CODE_CONNECT_PLAN.md)**.

## High-level shape

- **5 batches of components** with a clean 1:1 Figma mapping, easy first.
- **1 batch (Batch 6) blocked on Figma-side changes** — splitting shared component sets and converting pseudo-boolean VARIANTs to real BOOLEANs.
- **~25 components have no Figma counterpart** and are explicitly out of scope.

## Figma-side changes (designer)

Listed in the attached plan, priority-ordered. The high-priority ones:
1. Split the `Forms` set into separate `TextField` / `Select` / `Combobox` sets
2. Convert pseudo-boolean VARIANTs (`"True"` / `"False"`) to real BOOLEANs

## Setup for contributors

[CONTRIBUTING.md → Figma Code Connect](./CONTRIBUTING.md#figma-code-connect)

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.