[refactor] Convert playground to an NPM workspace (#16806)

## Summary

This is prep-work for the Red Knot playground. We'll have two
playgrounds, one for Red Knot and Ruff.
I want to share some components between the two, a "shared" NPM package
in a local workspace is a great fit for that.
I also want to share the dev dependencies and dev scripts. Again, NPM
workspaces are great for that.

This PR also sets up a CI workflow for the playground to prevent
surprises during the release.

## Test Plan

CI, local `npm install`, `npm start`, ...

I verified that the new CI step fails if there's a typescript or
formatting error.

* [Deployment test
run](https://github.com/astral-sh/ruff/actions/runs/13904914480/job/38905524353)

.github/workflows/ci.yaml

@@ -36,6 +36,9 @@ jobs:
       code: ${{ steps.check_code.outputs.changed }}
       # Flag that is raised when any code that affects the fuzzer is changed
       fuzz: ${{ steps.check_fuzzer.outputs.changed }}
+
+      # Flag that is set to "true" when code related to the playground changes.
+      playground: ${{ steps.check_playground.outputs.changed }}
     steps:
       - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4
         with:
@@ -87,6 +90,15 @@ jobs:
               echo "changed=true" >> "$GITHUB_OUTPUT"
           fi
 
+      - name: Check if there was any playground related change
+        id: check_playground
+        run: |
+          if git diff --quiet ${{ github.event.pull_request.base.sha || 'origin/main' }}...HEAD -- ':playground/**'; then
+              echo "changed=false" >> "$GITHUB_OUTPUT"
+          else
+              echo "changed=true" >> "$GITHUB_OUTPUT"
+          fi
+
   cargo-fmt:
     name: "cargo fmt"
     runs-on: ubuntu-latest
@@ -701,6 +713,40 @@ jobs:
 
           just test
 
+  check-playground:
+    name: "check playground"
+    runs-on: ubuntu-latest
+    timeout-minutes: 5
+    needs:
+      - determine_changes
+    if: ${{ (needs.determine_changes.outputs.playground == 'true') }}
+    steps:
+      - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4
+        with:
+          persist-credentials: false
+      - name: "Install Rust toolchain"
+        run: rustup target add wasm32-unknown-unknown
+      - uses: Swatinem/rust-cache@f0deed1e0edfc6a9be95417288c0e1099b1eeec3 # v2
+      - uses: actions/setup-node@cdca7365b2dadb8aad0a33bc7601856ffabcc48e # v4
+        with:
+          node-version: 22
+          cache: "npm"
+          cache-dependency-path: playground/package-lock.json
+      - uses: jetli/wasm-bindgen-action@20b33e20595891ab1a0ed73145d8a21fc96e7c29 # v0.2.0
+      - name: "Install Node dependencies"
+        run: npm ci
+        working-directory: playground
+      - name: "Build Ruff playground"
+        run: npm run dev:build --workspace ruff-playground
+        working-directory: playground
+        # Requires a build for ruff_wasm to exist
+      - name: "Run TypeScript checks"
+        run: npm run check
+        working-directory: playground
+      - name: "Check formatting"
+        run: npm run fmt:check
+        working-directory: playground
+
   benchmarks:
     runs-on: ubuntu-24.04
     needs: determine_changes

.github/workflows/publish-playground.yml

@@ -31,24 +31,19 @@ jobs:
         run: rustup target add wasm32-unknown-unknown
       - uses: actions/setup-node@cdca7365b2dadb8aad0a33bc7601856ffabcc48e # v4
         with:
-          node-version: 20
+          node-version: 22
           cache: "npm"
           cache-dependency-path: playground/package-lock.json
-      - uses: jetli/wasm-pack-action@0d096b08b4e5a7de8c28de67e11e945404e9eefa # v0.4.0
-        with:
-          version: v0.13.1
       - uses: jetli/wasm-bindgen-action@20b33e20595891ab1a0ed73145d8a21fc96e7c29 # v0.2.0
-      - name: "Run wasm-pack"
-        run: wasm-pack build --target web --out-dir ../../playground/src/pkg crates/ruff_wasm
       - name: "Install Node dependencies"
         run: npm ci
         working-directory: playground
+      - name: "Build Ruff playground"
+        run: npm run build --workspace ruff-playground
+        working-directory: playground
       - name: "Run TypeScript checks"
         run: npm run check
         working-directory: playground
-      - name: "Build JavaScript bundle"
-        run: npm run build
-        working-directory: playground
       - name: "Deploy to Cloudflare Pages"
         if: ${{ env.CF_API_TOKEN_EXISTS == 'true' }}
         uses: cloudflare/wrangler-action@da0e0dfe58b7a431659754fdf3f186c529afbe65 # v3.14.1
@@ -56,4 +51,4 @@ jobs:
           apiToken: ${{ secrets.CF_API_TOKEN }}
           accountId: ${{ secrets.CF_ACCOUNT_ID }}
           # `github.head_ref` is only set during pull requests and for manual runs or tags we use `main` to deploy to production
-          command: pages deploy playground/dist --project-name=ruff-playground --branch ${{ github.head_ref || 'main' }} --commit-hash ${GITHUB_SHA}
+          command: pages deploy playground/ruff/dist --project-name=ruff-playground --branch ${{ github.head_ref || 'main' }} --commit-hash ${GITHUB_SHA}