feat(skills): add create solid vite skill @rodydavis

skills/create-solid-vite/SKILL.md

@@ -0,0 +1,30 @@
+---
+name: create-solid-vite
+description: Creates a new Solid + Vite workspace with optional TypeScript support and installs custom AI rules.
+metadata:
+  category: ["Web app"]
+  tags: ["solid-vite", "create-solid-vite"]
+  version: "1.0.0"
+  author: "Google"
+---
+
+
+## When to Use This Skill
+
+     Use this skill when the user wants to create a new Solid + Vite workspace with optional TypeScript support.
+
+## Instructions
+
+1.  **Ask for User Preferences**
+    Before proceeding, you MUST ask the user for their solid-vite project preferences:
+    *   **Language**: TypeScript (default) or JavaScript?
+
+    *Action:* Mandatorily ask the user for these preferences before doing anything else. You must also provide a clear option for the user to "Proceed with default selections". Depending on their choices, you will customize the solid-vite creation command.
+
+2.  **Read Setup Instructions**
+    Review the [setup instructions](resources/setup_instructions.md) to understand how to initialize the project and install dependencies.
+
+    *Action:* Read `resources/setup_instructions.md`.
+
+3.  **Final Verification**
+    Check that `package.json` exists and the `.agents/rules/solid_vite.md` file is present in the new workspace.

skills/create-solid-vite/resources/airules.md

@@ -0,0 +1,50 @@
+# Gemini AI Rules for SolidJS with Vite Projects
+
+## 1. Persona & Expertise
+
+You are an expert front-end developer specializing in building high-performance, reactive web applications with SolidJS. You are proficient in TypeScript, JSX, and the core principles of SolidJS, including its fine-grained reactivity system (signals, effects, memos). You have a deep understanding of the Vite build tool and how it enables a fast development workflow for SolidJS projects.
+
+## 2. Project Context
+
+This project is a front-end application built with SolidJS and TypeScript, using Vite as the development server and build tool. It is designed to be developed within the Firebase Studio (formerly Project IDX) environment. The primary focus is on creating a highly performant application with a minimal footprint, leveraging SolidJS's direct DOM manipulation and lack of a virtual DOM.
+
+## 3. Development Environment
+
+This project is configured to run in a pre-built developer environment provided by Firebase Studio. The environment is defined in the `dev.nix` file and includes the following:
+
+- **Runtime:** Node.js 20.
+- **Tools:** Git and VS Code.
+- **Workspace Setup:** On creation, the workspace automatically runs `npm ci` to install dependencies and opens `src/App.tsx` (or equivalent).
+- **Previews:** The web preview is enabled and configured to run `npm run dev`.
+
+When providing instructions, assume that these tools are pre-installed and configured.
+
+## 4. Coding Standards & Best Practices
+
+### General
+- **Language:** Always use TypeScript and JSX.
+- **Styling:** Use standard CSS with CSS Modules for scoped styles.
+- **Dependencies:** The project uses `npm ci` on startup. After suggesting new npm dependencies, remind the user to run `npm install`.
+- **Testing:** Encourage the use of Vitest and the Solid Testing Library for unit and component testing.
+
+### SolidJS & Vite Specific
+- **Reactivity:** Embrace SolidJS's reactivity model.
+    - Use `createSignal` for creating reactive state.
+    - Use `createEffect` for running side effects in response to state changes.
+    - Use `createMemo` for memoizing expensive computations.
+- **Component Structure:**
+    - Components are regular functions that run once. Do not use React hooks-like patterns (e.g., calling `createSignal` inside a conditional).
+    - Keep components small and focused on a single responsibility.
+- **Performance:**
+    - Leverage SolidJS's performance by default. Avoid patterns that would fight against its fine-grained reactivity.
+    - Use Solid's control flow components (`<For>`, `<Show>`, `<Index>`) for efficient rendering of lists and conditional UI.
+- **Vite Configuration:** When modifying `vite.config.ts`, explain the purpose of the changes, especially if they affect the Solid plugin or build process.
+- **API Keys:** Never expose API keys on the client-side. For interacting with AI services, recommend creating a backend proxy or using serverless functions to keep API keys secure.
+
+## 5. Interaction Guidelines
+
+- Assume the user is familiar with modern front-end development concepts but may be new to SolidJS's unique reactivity model.
+- Provide clear, concise, and actionable code examples for SolidJS components and reactive primitives.
+- When generating a new component, provide the full file content for a `.tsx` file.
+- If a request is ambiguous, ask for clarification regarding component state, props, or the intended reactive behavior.
+- Emphasize the differences between SolidJS and other frameworks like React, particularly regarding component rendering and state management.

skills/create-solid-vite/resources/setup_instructions.md

@@ -0,0 +1,82 @@
+# Solid-Vite Workspace Setup Instructions
+
+This guide will walk you through creating a new Solid + Vite project and configuring your environment.
+
+
+## 1. Prerequisites
+
+Before running the setup, verify the environment has the following system packages available:
+- Node.js: Version 20.x or higher.
+
+*Action:* Run `node -v` to check the installed version. If Node.js 20.x or higher is not installed, install it or prompt the user to install it before proceeding.
+
+
+### 1.1 Verify
+Run:
+- `node -v`
+- `npm -v`
+
+If both work, go to **Step 2**.
+
+### 1.2 Install automatically from official Node.js downloads (recommended)
+Use the provided prereq installer script that:
+- detects OS + CPU architecture
+- fetches the latest LTS from Node’s official release index
+- downloads the correct official installer/binary from nodejs.org
+- installs it
+
+Run ONE of the following depending on your OS:
+
+#### Windows (PowerShell)
+Run:
+- `powershell -ExecutionPolicy Bypass -File "scripts/install_node_official.ps1"`
+
+Then restart terminal / Antigravity session and verify:
+- `node -v`
+- `npm -v`
+
+#### macOS / Linux (bash)
+Run:
+- `bash "scripts/install_node_official.sh"`
+
+Then restart shell and verify:
+- `node -v`
+- `npm -v`
+
+> Note: macOS/Linux install may require `sudo` for system-wide installation.
+
+## 2. Create the Project
+
+First, create a new Solid + Vite project using the `create -y vite@4` command-line tool. Append the appropriate flags based on the user's preferences gathered in Step 1 of `SKILL.md`:
+- **Language**: `-ts` or `-js`
+
+
+*Action:* Construct and run the command in the terminal. Example:
+```bash
+ npm create -y vite@4 "$WS_NAME" -- --template ${if language == "ts" then "solid-ts" else "solid"}
+```
+
+This will create a new directory named `$WS_NAME` with a solid-vite starter project.
+
+## 3. Install Dependencies
+
+Navigate into your new project directory and install the dependencies.
+
+```bash
+cd $WS_NAME
+npm install
+```
+
+
+## 4. Configure Agent Rules
+Copy the AI rules to the project's agent configuration.
+
+*Action:* Create a file named `.agents/rules/solid_vite.md` inside the new workspace directory (`$WS_NAME/.agents/rules/solid_vite.md`).
+*Content Source:* Read the content from the `airules.md` resource file provided with this skill.
+
+## 5. Run Server
+Run the development server using the command
+
+```bash
+npm run dev
+```

skills/create-solid-vite/scripts/install_node_official.ps1

@@ -0,0 +1,103 @@
+# Installs the latest Node.js LTS from official nodejs.org releases (user-local install).
+# - Detects CPU architecture
+# - Fetches latest LTS from Node dist index.json
+# - Downloads the official ZIP
+# - Extracts to %LOCALAPPDATA%\Programs\nodejs\<version>
+# - Adds to user PATH (no admin required)
+# - Prompts to restart terminal / Antigravity
+
+$ErrorActionPreference = "Stop"
+Set-StrictMode -Version Latest
+
+function Get-LatestLtsVersion {
+  $index = Invoke-RestMethod -Uri "https://nodejs.org/dist/index.json"
+  $lts = $index | Where-Object { $_.lts -ne $false } | Select-Object -First 1
+  if (-not $lts -or -not $lts.version) {
+    throw "Could not determine latest LTS from https://nodejs.org/dist/index.json"
+  }
+  return $lts.version  # e.g., v20.11.1
+}
+
+function Get-PlatformSuffix {
+  $arch = $env:PROCESSOR_ARCHITECTURE
+  switch ($arch) {
+    "AMD64" { return "win-x64" }
+    "ARM64" { return "win-arm64" }
+    "x86"   { return "win-x86" }
+    default { throw "Unsupported Windows architecture: $arch" }
+  }
+}
+
+function Get-MajorVersion([string]$v) {
+  # v like "v20.11.1"
+  $v = $v.Trim()
+  if ($v.StartsWith("v")) { $v = $v.Substring(1) }
+  return [int]($v.Split(".")[0])
+}
+
+# If Node already installed and >= 20, do nothing.
+try {
+  $existing = & node -v 2>$null
+  if ($LASTEXITCODE -eq 0) {
+    $major = Get-MajorVersion $existing
+    if ($major -ge 20) {
+      Write-Host "Node is already installed ($existing). No action needed."
+      Write-Host "npm version: " -NoNewline; & npm -v
+      exit 0
+    }
+    Write-Host "Node detected ($existing) but < 20; proceeding to install latest LTS."
+  }
+} catch {
+  # node not found
+}
+
+$version  = Get-LatestLtsVersion
+$platform = Get-PlatformSuffix
+$zipName  = "node-$version-$platform.zip"
+$zipUrl   = "https://nodejs.org/dist/$version/$zipName"
+
+$installBase = Join-Path $env:LOCALAPPDATA "Programs\nodejs"
+New-Item -ItemType Directory -Force -Path $installBase | Out-Null
+
+$tmpDir = Join-Path $env:TEMP ("node-install-" + [guid]::NewGuid().ToString("N"))
+New-Item -ItemType Directory -Force -Path $tmpDir | Out-Null
+$zipPath = Join-Path $tmpDir $zipName
+
+try {
+  Write-Host "Downloading $zipUrl"
+  Invoke-WebRequest -Uri $zipUrl -OutFile $zipPath
+
+  Write-Host "Extracting to $installBase"
+  Expand-Archive -Path $zipPath -DestinationPath $installBase -Force
+
+  $extractedDir = Join-Path $installBase ("node-" + $version + "-" + $platform)
+  if (-not (Test-Path $extractedDir)) {
+    throw "Extraction failed; expected folder not found: $extractedDir"
+  }
+
+  # Add to user PATH if not present
+  $userPath = [Environment]::GetEnvironmentVariable("Path", "User")
+  if (-not $userPath) { $userPath = "" }
+
+  $already = $userPath.Split(";") | Where-Object { $_.Trim() -ieq $extractedDir }
+  if (-not $already) {
+    $newUserPath = ($extractedDir + ";" + $userPath).TrimEnd(";")
+    [Environment]::SetEnvironmentVariable("Path", $newUserPath, "User")
+    Write-Host "Added Node to user PATH: $extractedDir"
+  } else {
+    Write-Host "Node path already present in user PATH."
+  }
+
+  # Also update current session PATH
+  $env:Path = $extractedDir + ";" + $env:Path
+
+  Write-Host "Installed Node $version"
+  Write-Host "Verify:"
+  & node -v
+  & npm -v
+
+  Write-Host ""
+  Write-Host "Restart your terminal / Antigravity session so PATH updates fully."
+} finally {
+  if (Test-Path $tmpDir) { Remove-Item -Recurse -Force $tmpDir }
+}