# Astryx Roadmap: Development Plans for Meta's Open-Source Design System > Explore the Astryx roadmap for Meta's open-source design system. Discover plans for new components AI generation charting improvements and theme authoring. - Repository: [Meta/astryx](https://github.com/facebook/astryx) - Tags: roadmap - Published: 2026-07-15 --- **The Astryx roadmap outlines a quarterly release strategy focused on expanding the component library with 50+ new elements, introducing AI-powered prompt-to-component generation, stabilizing charting packages, and delivering a visual theme authoring interface.** The Astryx repository (`facebook/astryx`) provides a styling-agnostic, open-source design system that prioritizes open internals and AI-fluent tooling. According to the source code and planning documents, the project maintains a public roadmap targeting significant enhancements across core components, theming, CLI workflows, and artificial intelligence integration. The following sections detail the technical milestones planned for upcoming releases. ## Core Component Expansion The roadmap targets adding approximately **50 new components** to the existing library, including complex elements like data grids and rich-text editors. These additions follow the established open-internals architecture located in `packages/core/src/`. ### Component Architecture New components automatically integrate with the existing CLI infrastructure. As implemented in `facebook/astryx`, components reside under `packages/core/src/` and expose themselves through commands like `astryx component --list`. The open-internals convention ensures every component remains customizable at the implementation level. ### Accessibility Automation Future releases will introduce automated **a11y-manifest generation** and expanded accessibility test coverage. This automation ensures that new components meet accessibility standards without manual documentation overhead, maintaining parity with the existing component-doc-mjs format used throughout the repository. ## Theme System Evolution ### Visual Theme Authoring The roadmap includes a **theme authoring UI** that allows designers to tweak design tokens without writing code. This tool builds upon the existing static token bundles found in `packages/themes/*`, such as `neutral`, `butter`, and `gothic`. The UI will generate valid token configurations compatible with the current `ThemeProvider` API. ### Runtime Dynamic Theming Support for **dynamic runtime theming** is planned, enabling features like instant dark-mode switching. The implementation will utilize a lightweight provider pattern already partially described in the core README, allowing applications to switch themes without page reloads by updating CSS custom properties defined in the token bundles. ## CLI and Developer Experience Enhancements ### Interactive Scaffolding The CLI located in `packages/cli/` will expand beyond its current command set (`component`, `template`, `swizzle`) to support **interactive scaffolding**. This feature will prompt developers for component variants and automatically generate complete example pages, reducing boilerplate setup time. ### Automated Upgrade Migrations Future versions will enhance the `astryx upgrade` command with additional **codemods** for handling breaking changes. These automated migrations will help teams transition between major versions by transforming existing component usage patterns to match updated APIs. ## AI-Fluent Tooling ### Prompt-to-Component Generation A flagship roadmap feature includes **natural-language component generation**. Developers will run commands like `npm run astryx -- generate "a searchable dropdown with keyboard shortcuts"` to receive fully typed TypeScript components complete with StyleX styling and accessibility attributes. This functionality parses plain English UI specifications and outputs production-ready code to `src/components/`. ### Vibe-Tests Validation The `internal/vibe-tests/` directory contains a testing harness that will validate AI-generated output. According to the source analysis, this framework continuously evaluates AI-generated components to ensure they meet quality standards before integration. The roadmap extends this harness to support prompt-to-component benchmarking. ## Data Visualization Stability The roadmap promotes `@astryxdesign/charts` and `@astryxdesign/vega` from experimental `@canary` distribution tags to stable releases. Located in `packages/charts/` and `packages/vega/`, these packages will receive **higher-level chart composition APIs** and full TypeScript typings. The stabilization ensures data visualization components meet the same AI-fluent standards as core elements. ## Documentation and Testing Infrastructure ### Component Documentation Automation The project will automate migration of component documentation into the **component-doc-mjs** format (`*.doc.mjs` files). This automation extracts JSDoc comments from component source code to generate living documentation, ensuring API references remain synchronized with implementation details. ### Vitest Coverage Expansion Quality milestones target **90%+ Vitest coverage** across all packages. This includes unit tests for the CLI, theme utilities, and the `vibe-tests` harness itself, ensuring reliability as the toolchain expands. ## Release Cadence and Public Roadmap Astryx will adopt a **quarterly release schedule** (Q1, Q2, Q3, Q4) with visible planning documents. The CLI template at [`packages/cli/templates/pages/shell-side-nav/page.tsx`](https://github.com/facebook/astryx/blob/main/packages/cli/templates/pages/shell-side-nav/page.tsx) already contains a placeholder entry for "Q3 roadmap draft" (line 74), indicating that roadmap visibility will integrate directly into the CLI's navigational interface and help output. ## Summary - **Component Growth**: Approximately 50 new components targeting data grids and rich-text editors, located in `packages/core/src/`. - **AI Integration**: Prompt-to-component generation utilizing the `internal/vibe-tests/` harness for validation. - **Theming Tools**: Visual token editor and runtime theme switching via `ThemeProvider`. - **Stabilization**: Promotion of `packages/charts/` and `packages/vega/` from `@canary` to stable releases. - **Developer Experience**: Enhanced `astryx upgrade` migrations and interactive scaffolding in `packages/cli/`. - **Release Schedule**: Quarterly cycles with public roadmap visibility through CLI templates. ## Frequently Asked Questions ### What is the Astryx release schedule? Astryx follows a **quarterly release cycle** (Q1, Q2, Q3, Q4). The project maintains a public roadmap draft that will be kept up-to-date, with references already appearing in the CLI template at [`packages/cli/templates/pages/shell-side-nav/page.tsx`](https://github.com/facebook/astryx/blob/main/packages/cli/templates/pages/shell-side-nav/page.tsx). ### How does Astryx plan to support AI-assisted development? The roadmap includes **prompt-to-component generation** that converts natural language descriptions into TypeScript components with StyleX styling. These AI-generated components are validated against the `internal/vibe-tests/` framework to ensure quality and consistency with the design system's standards. ### Which packages are moving from experimental to stable? The `@astryxdesign/charts` and `@astryxdesign/vega` packages, currently located in `packages/charts/` and `packages/vega/` under the `@canary` distribution tag, will be promoted to stable releases. They will receive full TypeScript support and higher-level composition APIs. ### Where can I find the public roadmap documentation? The roadmap is referenced within the CLI template system at [`packages/cli/templates/pages/shell-side-nav/page.tsx`](https://github.com/facebook/astryx/blob/main/packages/cli/templates/pages/shell-side-nav/page.tsx), which contains a stub for "Q3 roadmap draft." Future updates will render the roadmap directly within the CLI's navigational UI, making version planning visible to all contributors.