Cleanup CI and add chromatic

.github/actions/setup/action.yml

@@ -0,0 +1,23 @@
+name: Setup
+description: Setup Build Step
+inputs:
+  node-version:
+    required: true
+    default: '18.x'
+
+runs:
+  using: "composite"
+  steps:
+    - uses: pnpm/action-setup@v3
+      with:
+        version: 7
+
+    - name: Use Node.js
+      uses: actions/setup-node@v4
+      with:
+        node-version: ${{ inputs.node-version }}
+        cache: 'pnpm'
+
+    - name: Install dependencies
+      shell: bash
+      run: pnpm install

.github/workflows/chromatic.yml

@@ -0,0 +1,32 @@
+name: Chromatic
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+    paths:
+      - 'packages/**'
+
+jobs:
+  chromatic:
+    name: Storybook Publish
+    runs-on: ubuntu-latest
+    steps:
+      # requires all branches and tags to be fetched for chromatic
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - uses: ./.github/actions/setup
+
+      - name: Build
+        run: pnpm build
+
+      - name: Publish to Chromatic
+        uses: chromaui/action@v1
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}

.github/workflows/ci.yml

@@ -12,36 +12,12 @@ jobs:
   build:
     name: Check and build codebase
     runs-on: ubuntu-latest
-    strategy:
-      matrix:
-        node-version: [ 16.x, 18.x ]
     steps:
-      - uses: actions/checkout@v2
-      - uses: actions/setup-node@v2
-        with:
-          node-version: ${{ matrix.node-version }}
+      - uses: actions/checkout@v4
+      - uses: ./.github/actions/setup
 
-      - uses: pnpm/[email protected]
-        with:
-          version: 7
-
-      - name: Get pnpm store directory
-        id: pnpm-cache
-        run: echo "::set-output name=pnpm_cache_dir::$(pnpm store path)"
-
-      - name: Setup pnpm cache
-        uses: actions/cache@v3
-        with:
-          path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }}
-          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('./pnpm-lock.yaml') }}
-          restore-keys: |
-            ${{ runner.os }}-pnpm-store-
-
-      - name: Install dependencies
-        run: pnpm install
-
-      - name: Check Code ${{ matrix.node-version }}
+      - name: Check Code
         run: pnpm check:ci
 
-      - name: Build ${{ matrix.node-version }}
+      - name: Build
         run: pnpm build

.github/workflows/release.yml

@@ -18,33 +18,8 @@ jobs:
       pull-requests: write
 
     steps:
-      - uses: actions/checkout@v2
-        with:
-          fetch-depth: 0
-
-      - name: Use Node.js
-        uses: actions/setup-node@v1
-        with:
-          node-version: 18.x
-
-      - uses: pnpm/[email protected]
-        with:
-          version: 7
-
-      - name: Get pnpm store directory
-        id: pnpm-cache
-        run: echo "::set-output name=pnpm_cache_dir::$(pnpm store path)"
-
-      - name: Setup pnpm cache
-        uses: actions/cache@v3
-        with:
-          path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }}
-          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
-          restore-keys: |
-            ${{ runner.os }}-pnpm-store-
-
-      - name: Install dependencies
-        run: pnpm install
+      - uses: actions/checkout@v4
+      - uses: ./.github/actions/setup
 
       - name: Build packages
         run: pnpm run build
@@ -53,9 +28,6 @@ jobs:
         id: changesets
         uses: changesets/action@v1
         with:
-          # Note: Our `package.json:scripts.version` currently doesn't have `--fix-lockfile` for
-          # `pnpm install` because of a PNPM bug of some kind.
-          # https://github.com/FormidableLabs/spectacle/issues/1156
           version: pnpm run version
           publish: pnpm changeset publish
         env:

.github/workflows/storybook-tests.yml

@@ -2,22 +2,17 @@ name: 'Storybook Tests'
 on: push
 jobs:
   test:
-    timeout-minutes: 60
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
-      - uses: pnpm/[email protected]
-        with:
-          version: 7
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 18.x
-      - name: Install dependencies
-        run: pnpm install
+      - uses: ./.github/actions/setup
+
       - name: Install Playwright
         run: npx playwright install --with-deps
+
       - name: Build Storybook
         run: pnpm build:storybook --quiet
+
       - name: Serve Storybook and run tests
         run: |
           npx concurrently -k -s first -n "SB,TEST" -c "magenta,blue" \