chore: migrate yarn v1 to pnpm v10

Author: jamiehenson

.github/CODEOWNERS

@@ -3,4 +3,4 @@
 
 # Only set ownership on our package management files to help with dependabot updates
 package.json @ably/team-website
-yarn.lock @ably/team-website
+pnpm-lock.yaml @ably/team-website

.github/workflows/push.yml

@@ -22,8 +22,11 @@ jobs:
         uses: actions/setup-node@v4
         with:
           node-version: 20
+      - uses: pnpm/action-setup@v4
+        with:
+          version: latest
       - name: Install dependencies
-        run: yarn && npx playwright install --with-deps
+        run: pnpm install && npx playwright install --with-deps
       - name: Lint
         uses: wearerequired/lint-action@v2
         with:
@@ -35,4 +38,4 @@ jobs:
           prettier_extensions: js,ts,tsx
           prettier_auto_fix: false
       - name: Run Storybook test-runner
-        run: yarn test
+        run: pnpm test

.github/workflows/release.yml

@@ -21,7 +21,9 @@ jobs:
       - uses: actions/setup-node@v4
         with:
           node-version: 20
-      - run: npm install -g yarn
+      - uses: pnpm/action-setup@v4
+        with:
+          version: latest
       - name: Release latest Ably UI version
         env:
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
@@ -42,7 +44,7 @@ jobs:
       - name: Checkout
         uses: actions/checkout@v4
       - name: Build
-        run: yarn && yarn build-storybook
+        run: pnpm install && pnpm build-storybook
       - name: Upload
         uses: actions/upload-pages-artifact@v3.0.1
         with:

.github/workflows/review.yml

@@ -22,8 +22,11 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
+        with:
+          version: latest
       - name: Build
-        run: yarn && yarn build-storybook
+        run: pnpm install && pnpm build-storybook
       - name: Upload
         uses: actions/upload-pages-artifact@v3.0.1
         with:

.gitignore

@@ -1,7 +1,8 @@
 .bundle
 .DS_Store
 node_modules
-yarn-error.log
+pnpm-debug.log*
+pnpm-error.log
 /dist
 /preview
 /core

.npmrc

@@ -1 +1,6 @@
 //registry.npmjs.org/:_authToken=${NPM_TOKEN}
+
+# pnpm configuration
+auto-install-peers=true
+shamefully-hoist=false
+strict-peer-dependencies=false

.tool-versions

@@ -1,2 +1,2 @@
 nodejs 20.13.1
-yarn 1.22.22
+pnpm 10.12.4

README.md

@@ -37,7 +37,7 @@ npm install @ably/ui
 
 # or
 
-yarn add @ably/ui # Preferred
+pnpm add @ably/ui # Preferred
 ```
 
 To attach the imported JavaScript from the `Core` module to the `window` object:
@@ -211,11 +211,11 @@ An important part of ably-ui is ensuring the produced UI is accessible to as wid
 
 To visualise the assets in `ably-ui`, there is a Storybook instance, which serves as both a showcase and a development environment.
 
-Firstly, ensure you have all of the required project dependencies by running `yarn` in the project root.
+Firstly, ensure you have all of the required project dependencies by running `pnpm install` in the project root.
 
-Then, to run Storybook, run `yarn storybook` in the project root - it should open automatically in your browser.
+Then, to run Storybook, run `pnpm storybook` in the project root - it should open automatically in your browser.
 
-To build Storybook as if it was a statically built site (i.e. what it looks like when deployed), run `yarn build-storybook` from the project root, go to the generated directory with `cd preview`, and then run `npx http-server` (accepting the prompt to install that package if you haven't done already). The built site will be available at the listed local URL.
+To build Storybook as if it was a statically built site (i.e. what it looks like when deployed), run `pnpm build-storybook` from the project root, go to the generated directory with `cd preview`, and then run `npx http-server` (accepting the prompt to install that package if you haven't done already). The built site will be available at the listed local URL.
 
 ### SWC compile flags
 
@@ -236,7 +236,7 @@ if (__DEBUG_MODE__) {
 The flag can be added to the list in `swc.config.ts`, and enabled with an environment variable:
 
 ```
-$ DEBUG_MODE=true yarn build
+$ DEBUG_MODE=true pnpm build
 ```
 
 ### Publishing pre-release packages for review apps
@@ -349,6 +349,6 @@ This will release the packages and update library and create & push the commit &
 
 `ably-ui` uses Storybook's `test-runner`, which on push automatically turns all stories into executable tests, underpinned by Jest and Playright. This means that we don't have to explicitly write tests for stories, though we have the ability to write [https://storybook.js.org/docs/writing-stories/play-function](play functions), which allow us to test more detailed interactions. More information on the capabilities of `test-runner` can be found [https://storybook.js.org/docs/writing-tests/test-runner](here).
 
-Snapshots are also assessed via `test-runner`. To generate new snapshots, run `yarn test:update-snapshots`.
+Snapshots are also assessed via `test-runner`. To generate new snapshots, run `pnpm test:update-snapshots`.
 
-You can run the tests by either running a dev instance of Storybook locally and then running `yarn test`, or by pushing a branch to GitHub.
+You can run the tests by either running a dev instance of Storybook locally and then running `pnpm test`, or by pushing a branch to GitHub.

package.json

@@ -21,6 +21,7 @@
   "devDependencies": {
     "@storybook/addon-essentials": "^8.6.14",
     "@storybook/addon-interactions": "^8.6.14",
+    "@storybook/react": "^8.6.14",
     "@storybook/react-vite": "^8.6.14",
     "@storybook/test": "^8.6.14",
     "@storybook/test-runner": "^0.23.0",
@@ -69,20 +70,20 @@
     "build:tsc": "tsc && node tsc.js && rm -r types",
     "build:cleanup": "mv dist/* . && rm -r dist",
     "build:icons": "ts-node scripts/generate-icons.ts",
-    "build": "yarn build:prebuild && yarn build:icons && yarn build:swc && yarn build:tsc && yarn build:cleanup",
-    "watch": "yarn build:swc -w",
+    "build": "pnpm build:prebuild && pnpm build:icons && pnpm build:swc && pnpm build:tsc && pnpm build:cleanup",
+    "watch": "pnpm build:swc -w",
     "format:check": "prettier -c *.{js,ts} src/**/*.{js,ts,tsx,stories.tsx}",
     "format:write": "prettier -w *.{js,ts} src/**/*.{js,ts,tsx,stories.tsx}",
     "lint": "eslint *.{js,ts} src/**/*.{js,ts,tsx,stories.tsx}",
     "update:all": "./scripts/update-dependents.sh",
     "pre-release": "./scripts/pre-release.sh",
     "release": "./scripts/release.sh",
     "start": "vite --port 5000",
-    "storybook": "yarn build && storybook dev -p 6006",
-    "build-storybook": "yarn build && storybook build --quiet -o preview",
-    "test": "yarn test:storybook && yarn test:vitest run",
-    "test:storybook": "npx concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"yarn build-storybook && yarn http-server preview --port 6007 --silent\" \"wait-on tcp:6007 && yarn test-storybook --url http://127.0.0.1:6007\"",
-    "test:update-snapshots": "npx concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"yarn build-storybook && yarn http-server preview --port 6007 --silent\" \"wait-on tcp:6007 && yarn test-storybook -u --url http://127.0.0.1:6007\"",
+    "storybook": "pnpm build && storybook dev -p 6006",
+    "build-storybook": "pnpm build && storybook build --quiet -o preview",
+    "test": "pnpm test:storybook && pnpm test:vitest run",
+    "test:storybook": "npx concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"pnpm build-storybook && pnpm http-server preview --port 6007 --silent\" \"wait-on tcp:6007 && pnpm test-storybook --url http://127.0.0.1:6007\"",
+    "test:update-snapshots": "npx concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"pnpm build-storybook && pnpm http-server preview --port 6007 --silent\" \"wait-on tcp:6007 && pnpm test-storybook -u --url http://127.0.0.1:6007\"",
     "test:vitest": "vitest --environment=jsdom --dir=src"
   },
   "dependencies": {