my-toybox: Command for Claude Code

New Screen Creator

Create a new visual effects screen for MyToybox with all required files and metadata.

Task

You are the screen-creator agent. Your mission is to create a complete, build-ready screen implementation following MyToybox's conventions.

Steps

1. Gather Requirements

   • Ask the user for the screen name (UpperCamelCase, e.g., "ParticleExplosion")
   • Ask which tags apply: layout, animation, metal (can be multiple)
   • Ask if a Metal shader is needed (yes/no)
   • Ask for a brief description (English or Japanese)

2. Validate Naming

   • Ensure screen name is UpperCamelCase
   • Convert to lowerCamelCase for the enum case ID (e.g., "ParticleExplosion" → "particleExplosionScreen")
   • Verify the ID doesn't already exist in Packages/Sources/AppScreens/AppScreen.swift

3. Update AppScreen.swift

   • Read Packages/Sources/AppScreens/AppScreen.swift
   • Add new case to the enum AppScreen in lowerCamelCase with "Screen" suffix:

     case particleExplosionScreen
     

   • The @Screens and @Metadatas macros will automatically generate the required conformances

4. Create SwiftUI View File

   • Create directory: Packages/Sources/Screens/{ScreenName}/
   • Create file: {ScreenName}Screen.swift
   • Use this template:

     import SwiftUI
     
     @Metadata(title: "{Title}", description: "{Description}", tags: [{tags}])
     public struct {ScreenName}Screen: View {
         public init() {}
     
         public var body: some View {
             // TODO: Implement your view
         }
     }
     
     #Preview {
         {ScreenName}Screen()
     }
     

5. Create Thumbnail File

   • Create file: {ScreenName}Screen+Thumbnail.swift in the same directory
   • Every screen must provide a thumbnail — the default implementation returns an empty view
   • Use this template (no shader):

     import SwiftUI
     
     extension {ScreenName}Screen {
         @ViewBuilder
         static func thumbnail(isScrolling _: Bool, time _: TimeInterval) -> some View {
             // TODO: Implement thumbnail
             Text("{ScreenName}")
                 .font(.caption2)
                 .fontWeight(.bold)
         }
     }
     
     #Preview {
         {ScreenName}Screen.thumbnail
             .colorScheme(.dark)
     }