Does this skill automatically convert my React code to SolidJS?

No, this is a knowledge skill that provides the rules and mappings used by other transformation agents to ensure accurate and reactive migrations.

Can I use these rules for custom React components?

Yes, the core syntax transformation rules, such as attribute mapping and prop handling, are applicable to any React-to-SolidJS migration.

How does it handle SolidJS reactivity during conversion?

It provides specific patterns for using splitProps and mergeProps to ensure that component props remain reactive after the conversion from React.

Which UI libraries are supported by the mapping tables?

The skill focuses on mapping React's Shadcn (Base UI) architecture to SolidJS equivalents like Kobalte and Corvu.

React to SolidJS Conversion Guide

Name: React to SolidJS Conversion Guide
Author: carere

bycarere

•

Design Tools

Provides comprehensive transformation rules and mapping tables for migrating React (shadcn/ui) components to SolidJS equivalents.

The react-to-solid skill serves as a central knowledge repository for the Zaidan project, offering a standardized set of rules for converting React components into idiomatic SolidJS. It contains detailed mappings for syntax differences, such as transforming className to class and React.map to Solid's For component, while providing deep integration guides for UI primitives like Kobalte and Corvu. This skill acts as a critical reference for AI agents, ensuring that codebase migrations maintain reactivity and follow SolidJS best practices for prop handling and component architecture.

Key Features

01Anatomy and API mapping for Kobalte and Corvu UI primitives

02Standardized patterns for polymorphic components and SolidJS-specific prop handling

0362 GitHub stars

04Reference tables for React hooks and lifecycle methods to SolidJS primitives

05Direct library translations from @base-ui/react to @kobalte/core and corvu

06Syntax mapping for attributes, props destructuring, and conditional rendering

Use Cases

01Migrating existing Shadcn/ui React components to a SolidJS project

02Learning idiomatic SolidJS equivalents for common React design patterns

03Providing context for AI agents during automated codebase refactoring

Key Features

01Anatomy and API mapping for Kobalte and Corvu UI primitives

02Standardized patterns for polymorphic components and SolidJS-specific prop handling

0362 GitHub stars

04Reference tables for React hooks and lifecycle methods to SolidJS primitives

05Direct library translations from @base-ui/react to @kobalte/core and corvu

06Syntax mapping for attributes, props destructuring, and conditional rendering

Use Cases

01Migrating existing Shadcn/ui React components to a SolidJS project

02Learning idiomatic SolidJS equivalents for common React design patterns

03Providing context for AI agents during automated codebase refactoring