feat: Sana Canvas Switch, Radio & Checkbox

[jaclynjessup]

🚀 Feature Proposal

Update Switch, Radio, and Checkbox components to align with v16 token and style changes.

Components in this ticket:

• Switch
• Radio
• Checkbox

---

Prerequisites

• Design review: Confirm all Figma components are marked ready for dev
• A11y review completed for Switch icon removal and Checkbox click target (see below)
• Switch hover state design confirmed

---

Token Updates Required

All components: Space ✅, Size ✅, Shape ✅, Color ✅, Depth No, Theme ✅

---

Visual Changes

Component	Changes
Switch	Checkmark/x icon potentially removed; new hover state added
Radio	Color and corner radius updates
Checkbox	Color and corner radius updates

---

API Changes

Switch

• No API changes. Icon removal is a visual/style change only.

Radio

• inverse variant deprecated. Codemod required.

Checkbox

• inverse variant deprecated. Codemod required.

---

⚠️ Accessibility Concerns

Switch

Removing the checkmark/x icon removes a non-color visual indicator of on/off state, which may fail WCAG 1.4.1 (Use of Color). The new hover state also needs a11y validation.

• A11y review must be completed before shipping.

Checkbox

The click target has decreased to 20px, which is below the recommended minimum. This is especially problematic when used in tables without labels.

• A11y review must be completed before shipping.

---

Effort & Timeline

• Priority: Medium
• Switch Effort: Medium (potential icon removal, token changes)
• Radio Effort: Medium (token changes, deprecation)
• Checkbox Effort: Medium (token changes, deprecation)

---

Dependencies

• No blockers
• A11y review required for Switch and Checkbox before shipping

---

Acceptance Criteria

• Switch token updates applied; icon removal decision made and implemented
• Switch hover state added per Sana spec
• Switch a11y review signed off
• Radio token updates applied; inverse variant deprecated with codemod
• Checkbox token updates applied; inverse variant deprecated with codemod
• Checkbox click target a11y review signed off
• Codemods written and documented for Radio and Checkbox
• Visual regression tests pass
• Storybook updated