React Spectrum S2 (Spectrum 2)

React Spectrum S2 is Adobe's implementation of the Spectrum 2 design system in React. It provides a collection of accessible, adaptive, and high-quality UI components.

Documentation Structure

The references/ directory contains detailed documentation organized as follows:

Guides

• Collections: Many components display a collection of items, and provide functionality such as keyboard navigation, and selection. Learn how to load and render collections using React Spectrum's compositional API.
• Forms: Learn how to integrate with HTML forms, validate and submit data, and use React Spectrum with form libraries.
• Getting started: ## Installation
• Migrating to Spectrum 2: Learn how to migrate from React Spectrum v3 to Spectrum 2.
• Selection: Many collection components support selecting items by clicking or tapping them, or by using the keyboard. Learn how to handle selection events, how to control selection programmatically, and the data structures used to represent a selection.
• Style Macro: The macro supports a constrained set of values per property that conform to Spectrum 2.
• Styling: Learn how to use the macro to apply Spectrum tokens directly in your components with type-safe autocompletion.
• Working with AI: Learn how to use the React Spectrum MCP Server, Agent Skills, and more to help you build with AI.