preview

name	preview
description	Build the distributable and launch a local preview server to see the website
trigger	when user says "preview", "show me", "let me see", "run the website", "start the server"

Preview Skill

Build and preview the RikkaUI showcase website.

Steps

1. Build the distributable:

   ./gradlew :composeApp:wasmJsBrowserDevelopmentExecutableDistribution
   

   Wait for BUILD SUCCESSFUL (timeout: 180s).

2. Start the preview server using the launch configuration:

   • The project has a launch.json config named rikka-preview
   • It serves composeApp/build/dist/wasmJs/developmentExecutable on port 3000
   • Use the Claude Preview MCP: preview_start with url http://localhost:3000

3. Take a screenshot after the page loads to show the user what it looks like.

4. If the user asks to scroll or interact, use preview MCP tools (click, screenshot, etc.)

Notes

• The website is a Compose Wasm canvas app — CSS selectors don't work, window.scrollBy() doesn't scroll the Compose canvas
• To navigate, use keyboard events or page reload
• The preview server must be stopped before rebuilding