Tryout wasm2js for controller-rs

.cursor/Dockerfile

@@ -21,7 +21,7 @@ RUN curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh -s -- -y && \
 # Add cargo to PATH
 ENV PATH="/root/.cargo/bin:${PATH}"
 
-RUN npm i -g pnpm
+RUN npm i -g bun
 
 # Setup display with consistent resolution
 RUN Xvfb :99 -screen 0 1280x1024x24 2>/dev/null & 
@@ -32,7 +32,7 @@ WORKDIR /app
 COPY . .
 
 # Install dependencies
-RUN pnpm install --frozen-lockfile
+RUN bun i
 
 # Default command that can be overridden
 CMD ["bash"]

.cursor/environment.json

@@ -4,5 +4,5 @@
 		"context": "."
 	},
 	"terminals": [],
-	"install": "pnpm  i"
+	"install": "bun i"
 }

.github/workflows/claude.yml

@@ -82,9 +82,9 @@ jobs:
             This is a React Native UI component library that mirrors the web UI library. Key considerations:
 
             **Development Workflow:**
-            - Use `pnpm storybook` for component development and preview
-            - Run `pnpm screenshots:generate` after component changes to update visual tests
-            - Use `pnpm lint` for code quality checks with Biome
+            - Use `bun storybook` for component development and preview
+            - Run `bun screenshots:generate` after component changes to update visual tests
+            - Use `bun lint` for code quality checks with Biome
             - Test across iOS, Android, and Web platforms
 
             **Component Development:**
@@ -95,7 +95,7 @@ jobs:
 
             **Visual Testing:**
             - Generate screenshots for new/modified components
-            - Update baselines with `pnpm screenshots:update` when changes are intentional
+            - Update baselines with `bun screenshots:update` when changes are intentional
             - Review visual comparisons in `visual-comparisons/index.html`
 
             **Platform Considerations:**
@@ -108,4 +108,4 @@ jobs:
             2. If responding to an issue, include "Closes #[ISSUE_NUMBER]" in the PR description
             3. Provide a clear title and description explaining what was changed and why
 
-            Never commit directly to main branch. Always create PRs for changes.
+            Never commit directly to main branch. Always create PRs for changes.

.gitignore

@@ -10,9 +10,6 @@ npm-debug.*
 *.orig.*
 web-build/
 
-
-
-
 ios
 android
 

.gitmodules

@@ -1,3 +1,6 @@
 [submodule "ui"]
 	path = ui
 	url = https://github.com/cartridge-gg/ui.git
+[submodule "controller-rs"]
+	path = controller-rs
+	url = https://github.com/cartridge-gg/controller-rs.git

CLAUDE.md

@@ -6,29 +6,29 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
 
 ### Core Development
 
-- `pnpm start` - Starts Expo development server for React Native
-- `pnpm android` - Launch Android development build
-- `pnpm ios` - Launch iOS development build  
-- `pnpm web` - Launch web version using React Native Web
-- `pnpm prebuild` - Generate native platform code (iOS/Android)
+- `bun start` - Starts Expo development server for React Native
+- `bun android` - Launch Android development build
+- `bun ios` - Launch iOS development build  
+- `bun web` - Launch web version using React Native Web
+- `bun prebuild` - Generate native platform code (iOS/Android)
 
 ### Component Development
 
-- `pnpm storybook` - Launches Storybook development server on port 6006
-- `pnpm build-storybook` - Builds Storybook for production
+- `bun storybook` - Launches Storybook development server on port 6006
+- `bun build-storybook` - Builds Storybook for production
 
 ### Testing & Quality Assurance
 
-- `pnpm test:storybook` - Runs visual regression tests against Storybook
-- `pnpm test:storybook:update` - Updates visual regression test baselines
-- `pnpm screenshots:generate` - Generates screenshots for all 203+ components
-- `pnpm screenshots:update` - Updates screenshot baselines
-- `pnpm screenshots:clean` - Generates screenshots without cleanup
+- `bun test:storybook` - Runs visual regression tests against Storybook
+- `bun test:storybook:update` - Updates visual regression test baselines
+- `bun screenshots:generate` - Generates screenshots for all 203+ components
+- `bun screenshots:update` - Updates screenshot baselines
+- `bun screenshots:clean` - Generates screenshots without cleanup
 
 ### Code Quality
 
-- `pnpm lint` - Runs Biome linting and formatting checks
-- `pnpm format` - Applies Biome formatting automatically
+- `bun lint` - Runs Biome linting and formatting checks
+- `bun format` - Applies Biome formatting automatically
 
 ## Architecture Overview
 
@@ -102,18 +102,18 @@ The repository includes a comprehensive visual testing infrastructure:
 
 ### Code Quality Requirements
 
-- **Always run linting** before committing: `pnpm lint`
+- **Always run linting** before committing: `bun lint`
 - **TypeScript compliance** - All TypeScript errors must be resolved
-- **Visual testing** - Run `pnpm screenshots:generate` after component changes
+- **Visual testing** - Run `bun screenshots:generate` after component changes
 - **Cross-platform testing** - Verify components work on iOS, Android, and Web
 
 ### Common Development Tasks
 
 **Working with Components:**
 
-- After modifying components, run `pnpm storybook` to verify visually
-- Generate new screenshots with `pnpm screenshots:generate`
-- Update baselines with `pnpm screenshots:update` if changes are intentional
+- After modifying components, run `bun storybook` to verify visually
+- Generate new screenshots with `bun screenshots:generate`
+- Update baselines with `bun screenshots:update` if changes are intentional
 - Check visual comparisons in `visual-comparisons/index.html`
 
 **Adding New Components:**
@@ -134,8 +134,8 @@ The repository includes a comprehensive visual testing infrastructure:
 **Visual Testing Workflow:**
 
 1. Make component changes
-2. Run `pnpm storybook` to preview changes
-3. Run `pnpm screenshots:generate` to capture new visuals
+2. Run `bun storybook` to preview changes
+3. Run `bun screenshots:generate` to capture new visuals
 4. Review generated comparisons in `visual-comparisons/`
 5. Update baselines if changes are intentional
 
@@ -182,4 +182,4 @@ Expected differences between React Native and Web versions:
 - **Accessibility**: Implement proper accessibility props and behavior
 - **Performance**: Optimize for mobile performance and memory usage
 - **Reusability**: Design components for maximum reusability across platforms
-- **Documentation**: Provide clear prop documentation and usage examples
+- **Documentation**: Provide clear prop documentation and usage examples

MIGRATION_STRATEGY.md

@@ -296,25 +296,25 @@ These map to Tailwind classes like:
 ### 2. Snapshot Update Tool
 ```bash
 # Update all snapshots
-pnpm screenshots:update
+bun screenshots:update
 
 # Update specific component snapshots
-pnpm screenshots:update achievement
-pnpm screenshots:update button
-pnpm screenshots:update "activities.*card"
+bun screenshots:update achievement
+bun screenshots:update button
+bun screenshots:update "activities.*card"
 ```
 
 ### 3. Visual Comparison Tool
 ```bash
 # Compare specific snapshots
-pnpm screenshots:compare achievement
-pnpm screenshots:compare button
+bun screenshots:compare achievement
+bun screenshots:compare button
 
 # List all available snapshots
-pnpm screenshots:compare --list
+bun screenshots:compare --list
 
 # Get help
-pnpm screenshots:compare --help
+bun screenshots:compare --help
 ```
 
 ## Migration Process
@@ -332,7 +332,7 @@ pnpm screenshots:compare --help
 #### Step 2: Check Migration Status
 ```bash
 # List all snapshots and their migration status
-pnpm screenshots:summary
+bun screenshots:summary
 ```
 
 Look for:
@@ -485,13 +485,13 @@ Look for:
 #### Step 6: Generate Initial Snapshot
 ```bash
 # Generate snapshot for the new component
-pnpm screenshots:update [component-name]
+bun screenshots:update [component-name]
 ```
 
 #### Step 7: Perform Visual Comparison
 ```bash
 # Compare with UI version
-pnpm screenshots:compare [component-name]
+bun screenshots:compare [component-name]
 ```
 
 **Expected outputs**:
@@ -548,10 +548,10 @@ Based on the analysis, fix issues in order of impact:
 #### Step 10: Re-test After Each Fix
 ```bash
 # Update snapshot after changes
-pnpm screenshots:update [component-name]
+bun screenshots:update [component-name]
 
 # Re-run comparison
-pnpm screenshots:compare [component-name]
+bun screenshots:compare [component-name]
 ```
 
 **Iteration Guidelines**:
@@ -787,24 +787,24 @@ git commit -m "Migrated TokenCard"
 
 ```bash
 # 1. Discover and assess
-pnpm screenshots:summary
+bun screenshots:summary
 
 # 2. Implement component (manual development)
 
 # 3. Generate snapshot
-pnpm screenshots:update [component-name]
+bun screenshots:update [component-name]
 
 # 4. Compare and analyze
-pnpm screenshots:compare [component-name]
+bun screenshots:compare [component-name]
 
 # 5. Fix and iterate
 # (make changes, then repeat steps 3-4)
 
 # 6. Validate final result
-pnpm screenshots:compare [component-name]
+bun screenshots:compare [component-name]
 
 # 7. Check lint and format
-pnpm lint
+bun lint
 
 # 8. Create migration commit
 git add .

README.md

@@ -15,22 +15,22 @@ A comprehensive React Native component library that mirrors the web UI library,
 ### Installation
 ```bash
 # Install dependencies
-pnpm install
+bun install
 
 # Start Storybook for development
-pnpm storybook
+bun storybook
 
 # Start React Native development
-pnpm start
+bun start
 ```
 
 ### Screenshot Generation
 ```bash
 # Generate screenshots for all components
-pnpm screenshots:generate
+bun screenshots:generate
 
 # Update existing screenshot baselines
-pnpm screenshots:update
+bun screenshots:update
 
 # View visual comparisons
 open visual-comparisons/index.html
@@ -57,28 +57,28 @@ open visual-comparisons/index.html
 ### Storybook Development
 ```bash
 # Start Storybook
-pnpm storybook
+bun storybook
 
 # Build Storybook
-pnpm build-storybook
+bun build-storybook
 ```
 
 ### Testing
 ```bash
 # Run visual tests
-pnpm test:storybook
+bun test:storybook
 
 # Update visual baselines
-pnpm test:storybook:update
+bun test:storybook:update
 ```
 
 ### Linting and Formatting
 ```bash
 # Lint code
-pnpm lint
+bun lint
 
 # Format code
-pnpm format
+bun format
 ```
 
 ## Screenshot System
@@ -94,9 +94,9 @@ See [SCREENSHOT_GENERATION.md](./SCREENSHOT_GENERATION.md) for detailed document
 
 ### Quick Screenshot Commands
 ```bash
-pnpm screenshots:generate  # Generate all screenshots
-pnpm screenshots:update    # Update baselines
-pnpm screenshots:clean     # Generate without cleanup
+bun screenshots:generate  # Generate all screenshots
+bun screenshots:update    # Update baselines
+bun screenshots:clean     # Generate without cleanup
 ```
 
 ## Visual Comparisons
@@ -152,20 +152,20 @@ These differences are expected and documented in the visual comparison reports.
 ### Adding New Components
 1. Create component in appropriate category (`primitives/`, `modules/`, etc.)
 2. Add comprehensive Storybook stories
-3. Run `pnpm screenshots:generate` to capture visuals
+3. Run `bun screenshots:generate` to capture visuals
 4. Update documentation as needed
 
 ## Scripts Reference
 
 | Script | Description |
 |--------|-------------|
-| `pnpm storybook` | Start Storybook development server |
-| `pnpm build-storybook` | Build Storybook for production |
-| `pnpm screenshots:generate` | Generate all component screenshots |
-| `pnpm screenshots:update` | Update screenshot baselines |
-| `pnpm test:storybook` | Run visual regression tests |
-| `pnpm lint` | Lint codebase |
-| `pnpm format` | Format codebase |
+| `bun storybook` | Start Storybook development server |
+| `bun build-storybook` | Build Storybook for production |
+| `bun screenshots:generate` | Generate all component screenshots |
+| `bun screenshots:update` | Update screenshot baselines |
+| `bun test:storybook` | Run visual regression tests |
+| `bun lint` | Lint codebase |
+| `bun format` | Format codebase |
 
 ## Documentation