From 0b9347c19165bc1ccce65c2ce9a969ad8f9deb5e Mon Sep 17 00:00:00 2001
From: Phil Pluckthun <phil@kitten.sh>
Date: Mon, 27 Mar 2023 18:18:00 +0100
Subject: [PATCH] chore(examples): Update package versions in examples and keep
 up-to-date (#3071)

---
 .gitignore                                    |   5 +
 examples/pnpm-workspace.yaml                  |   2 +
 examples/with-apq/package.json                |  13 +-
 examples/with-apq/src/App.jsx                 |   8 +-
 examples/with-apq/src/index.jsx               |   9 +-
 examples/with-apq/vite.config.js              |   4 +-
 .../with-defer-stream-directives/package.json |  25 +--
 .../with-defer-stream-directives/src/App.jsx  |  12 +-
 .../src/index.jsx                             |   9 +-
 .../vite.config.js                            |   4 +-
 .../with-graphcache-pagination/package.json   |  15 +-
 .../with-graphcache-pagination/src/App.jsx    |   5 +-
 .../with-graphcache-pagination/src/index.jsx  |   9 +-
 .../with-graphcache-pagination/vite.config.js |   4 +-
 examples/with-graphcache-updates/package.json |  17 +-
 .../with-graphcache-updates/src/client.js     | 115 ++++++--------
 .../with-graphcache-updates/src/index.jsx     |   9 +-
 .../with-graphcache-updates/vite.config.js    |   4 +-
 examples/with-multipart/package.json          |  14 +-
 examples/with-multipart/src/App.jsx           |   7 +-
 examples/with-multipart/src/index.jsx         |   9 +-
 examples/with-multipart/vite.config.js        |   4 +-
 examples/with-next/package.json               |  13 +-
 examples/with-next/pages/_app.js              |   4 +-
 examples/with-next/pages/index.js             |   5 +-
 examples/with-next/pages/server.js            |  12 +-
 examples/with-next/pages/static.js            |  12 +-
 examples/with-pagination/package.json         |  13 +-
 examples/with-pagination/src/App.jsx          |   5 +-
 examples/with-pagination/src/index.jsx        |   9 +-
 examples/with-pagination/vite.config.js       |   4 +-
 examples/with-react-native/App.js             |   5 +-
 examples/with-react-native/package.json       |  13 +-
 examples/with-react/package.json              |  13 +-
 examples/with-react/src/App.jsx               |   5 +-
 examples/with-react/src/index.jsx             |   9 +-
 examples/with-react/vite.config.js            |   4 +-
 examples/with-refresh-auth/package.json       |  15 +-
 examples/with-refresh-auth/src/client.js      | 148 +++++++-----------
 examples/with-refresh-auth/src/index.jsx      |   9 +-
 examples/with-refresh-auth/vite.config.js     |   4 +-
 examples/with-retry/package.json              |  15 +-
 examples/with-retry/src/App.jsx               |   7 +-
 examples/with-retry/src/Color.jsx             |   4 +-
 examples/with-retry/src/index.jsx             |   9 +-
 examples/with-retry/vite.config.js            |   4 +-
 examples/with-svelte/package.json             |  14 +-
 examples/with-svelte/src/App.svelte           |   7 +-
 examples/with-vue3/package.json               |  11 +-
 examples/with-vue3/src/App.vue                |   3 +-
 package.json                                  |   2 +-
 pnpm-workspace.yaml                           |   1 +
 scripts/actions/lib/packages.mjs              |  26 +++
 scripts/changesets/version.mjs                |  62 ++++++++
 54 files changed, 388 insertions(+), 382 deletions(-)
 create mode 100644 examples/pnpm-workspace.yaml
 create mode 100644 scripts/changesets/version.mjs

diff --git a/.gitignore b/.gitignore
index 37668852..a05f7d4c 100644
--- a/.gitignore
+++ b/.gitignore
@@ -17,8 +17,13 @@ exchanges/*/LICENSE
 # TODO: Figure out how to remove these:
 tmp/
 dist/
+examples/yarn.lock
+examples/pnpm-lock.yaml
+examples/package-lock.json
 examples/*/public
 examples/*/yarn.lock
+examples/*/pnpm-lock.yaml
+examples/*/package-lock.json
 examples/*/ios/
 examples/*/android/
 examples/*/.watchmanconfig
diff --git a/examples/pnpm-workspace.yaml b/examples/pnpm-workspace.yaml
new file mode 100644
index 00000000..a2dc0713
--- /dev/null
+++ b/examples/pnpm-workspace.yaml
@@ -0,0 +1,2 @@
+packages:
+  - '*'
diff --git a/examples/with-apq/package.json b/examples/with-apq/package.json
index 57346811..4dff0931 100644
--- a/examples/with-apq/package.json
+++ b/examples/with-apq/package.json
@@ -6,14 +6,15 @@
     "start": "vite"
   },
   "dependencies": {
+    "@urql/core": "^3.2.2",
     "@urql/exchange-persisted-fetch": "^1.3.0",
-    "graphql": "^15.5.0",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "urql": "^2.0.2"
+    "graphql": "^16.6.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "urql": "^3.0.4"
   },
   "devDependencies": {
-    "@vitejs/plugin-react-refresh": "^1.3.3",
-    "vite": "^2.2.4"
+    "@vitejs/plugin-react": "^3.1.0",
+    "vite": "^4.2.0"
   }
 }
diff --git a/examples/with-apq/src/App.jsx b/examples/with-apq/src/App.jsx
index eb7adb16..3a3994be 100644
--- a/examples/with-apq/src/App.jsx
+++ b/examples/with-apq/src/App.jsx
@@ -1,13 +1,13 @@
 import React from 'react';
-import { createClient, Provider, fetchExchange } from 'urql';
-import { persistedFetchExchange } from '@urql/exchange-persisted-fetch';
+import { Client, Provider, fetchExchange } from 'urql';
+import { persistedExchange } from '@urql/exchange-persisted';
 
 import LocationsList from './LocationsList';
 
-const client = createClient({
+const client = new Client({
   url: 'https://trygql.formidable.dev/graphql/apq-weather',
   exchanges: [
-    persistedFetchExchange({
+    persistedExchange({
       preferGetForPersistedQueries: true,
     }),
     fetchExchange,
diff --git a/examples/with-apq/src/index.jsx b/examples/with-apq/src/index.jsx
index f16bd3d1..7b6e0272 100644
--- a/examples/with-apq/src/index.jsx
+++ b/examples/with-apq/src/index.jsx
@@ -1,11 +1,6 @@
 import React from 'react';
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 
 import App from './App';
 
-render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-  document.getElementById('root')
-);
+createRoot(document.getElementById('root')).render(<App />);
diff --git a/examples/with-apq/vite.config.js b/examples/with-apq/vite.config.js
index 75f50ede..627a3196 100644
--- a/examples/with-apq/vite.config.js
+++ b/examples/with-apq/vite.config.js
@@ -1,7 +1,7 @@
 import { defineConfig } from 'vite';
-import reactRefresh from '@vitejs/plugin-react-refresh';
+import react from '@vitejs/plugin-react';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [reactRefresh()],
+  plugins: [react()],
 });
diff --git a/examples/with-defer-stream-directives/package.json b/examples/with-defer-stream-directives/package.json
index cf58c143..70ca028e 100644
--- a/examples/with-defer-stream-directives/package.json
+++ b/examples/with-defer-stream-directives/package.json
@@ -8,21 +8,28 @@
     "client": "vite",
     "start": "run-p client server:yoga"
   },
+  "pnpm": {
+    "peerDependencyRules": {
+      "allowedVersions": {
+        "graphql": "17"
+      }
+    }
+  },
   "dependencies": {
-    "@apollo/server": "^4.4.1",
     "@graphql-yoga/plugin-defer-stream": "^1.7.1",
-    "@urql/core": "^3.1.1",
-    "@urql/exchange-graphcache": "^5.0.9",
+    "@urql/core": "^3.2.2",
+    "@urql/exchange-graphcache": "^5.2.0",
     "graphql": "17.0.0-alpha.2",
-    "graphql-yoga": "^3.7.1",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "urql": "^3.0.3"
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "urql": "^3.0.4"
   },
   "devDependencies": {
-    "@vitejs/plugin-react-refresh": "^1.3.6",
+    "@apollo/server": "^4.4.1",
+    "@vitejs/plugin-react": "^3.1.0",
     "graphql-helix": "^1.13.0",
+    "graphql-yoga": "^3.7.1",
     "npm-run-all": "^4.1.5",
-    "vite": "^2.9.15"
+    "vite": "^4.2.0"
   }
 }
diff --git a/examples/with-defer-stream-directives/src/App.jsx b/examples/with-defer-stream-directives/src/App.jsx
index 5037b1e0..4e45e605 100644
--- a/examples/with-defer-stream-directives/src/App.jsx
+++ b/examples/with-defer-stream-directives/src/App.jsx
@@ -1,11 +1,5 @@
 import React from 'react';
-import {
-  createClient,
-  Provider,
-  dedupExchange,
-  debugExchange,
-  fetchExchange,
-} from 'urql';
+import { Client, Provider, fetchExchange } from 'urql';
 
 import { cacheExchange } from '@urql/exchange-graphcache';
 
@@ -18,9 +12,9 @@ const cache = cacheExchange({
   },
 });
 
-const client = createClient({
+const client = new Client({
   url: 'http://localhost:3004/graphql',
-  exchanges: [dedupExchange, cache, debugExchange, fetchExchange],
+  exchanges: [cache, fetchExchange],
 });
 
 function App() {
diff --git a/examples/with-defer-stream-directives/src/index.jsx b/examples/with-defer-stream-directives/src/index.jsx
index f16bd3d1..7b6e0272 100644
--- a/examples/with-defer-stream-directives/src/index.jsx
+++ b/examples/with-defer-stream-directives/src/index.jsx
@@ -1,11 +1,6 @@
 import React from 'react';
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 
 import App from './App';
 
-render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-  document.getElementById('root')
-);
+createRoot(document.getElementById('root')).render(<App />);
diff --git a/examples/with-defer-stream-directives/vite.config.js b/examples/with-defer-stream-directives/vite.config.js
index 75f50ede..627a3196 100644
--- a/examples/with-defer-stream-directives/vite.config.js
+++ b/examples/with-defer-stream-directives/vite.config.js
@@ -1,7 +1,7 @@
 import { defineConfig } from 'vite';
-import reactRefresh from '@vitejs/plugin-react-refresh';
+import react from '@vitejs/plugin-react';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [reactRefresh()],
+  plugins: [react()],
 });
diff --git a/examples/with-graphcache-pagination/package.json b/examples/with-graphcache-pagination/package.json
index 84a94140..b8b4efd4 100644
--- a/examples/with-graphcache-pagination/package.json
+++ b/examples/with-graphcache-pagination/package.json
@@ -6,14 +6,15 @@
     "start": "vite"
   },
   "dependencies": {
-    "@urql/exchange-graphcache": "^4.0.0",
-    "graphql": "^15.5.0",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "urql": "^2.0.2"
+    "@urql/core": "^3.2.2",
+    "@urql/exchange-graphcache": "^5.2.0",
+    "graphql": "^16.6.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "urql": "^3.0.4"
   },
   "devDependencies": {
-    "@vitejs/plugin-react-refresh": "^1.3.3",
-    "vite": "^2.2.4"
+    "@vitejs/plugin-react": "^3.1.0",
+    "vite": "^4.2.0"
   }
 }
diff --git a/examples/with-graphcache-pagination/src/App.jsx b/examples/with-graphcache-pagination/src/App.jsx
index 264947f6..6f7c0f5a 100644
--- a/examples/with-graphcache-pagination/src/App.jsx
+++ b/examples/with-graphcache-pagination/src/App.jsx
@@ -1,14 +1,13 @@
 import React from 'react';
-import { createClient, Provider, dedupExchange, fetchExchange } from 'urql';
+import { Client, Provider, fetchExchange } from 'urql';
 import { cacheExchange } from '@urql/exchange-graphcache';
 import { relayPagination } from '@urql/exchange-graphcache/extras';
 
 import PaginatedNpmSearch from './PaginatedNpmSearch';
 
-const client = createClient({
+const client = new Client({
   url: 'https://trygql.formidable.dev/graphql/relay-npm',
   exchanges: [
-    dedupExchange,
     cacheExchange({
       resolvers: {
         Query: {
diff --git a/examples/with-graphcache-pagination/src/index.jsx b/examples/with-graphcache-pagination/src/index.jsx
index f16bd3d1..7b6e0272 100644
--- a/examples/with-graphcache-pagination/src/index.jsx
+++ b/examples/with-graphcache-pagination/src/index.jsx
@@ -1,11 +1,6 @@
 import React from 'react';
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 
 import App from './App';
 
-render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-  document.getElementById('root')
-);
+createRoot(document.getElementById('root')).render(<App />);
diff --git a/examples/with-graphcache-pagination/vite.config.js b/examples/with-graphcache-pagination/vite.config.js
index 75f50ede..627a3196 100644
--- a/examples/with-graphcache-pagination/vite.config.js
+++ b/examples/with-graphcache-pagination/vite.config.js
@@ -1,7 +1,7 @@
 import { defineConfig } from 'vite';
-import reactRefresh from '@vitejs/plugin-react-refresh';
+import react from '@vitejs/plugin-react';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [reactRefresh()],
+  plugins: [react()],
 });
diff --git a/examples/with-graphcache-updates/package.json b/examples/with-graphcache-updates/package.json
index cb281a97..eb4d4f62 100644
--- a/examples/with-graphcache-updates/package.json
+++ b/examples/with-graphcache-updates/package.json
@@ -6,15 +6,16 @@
     "start": "vite"
   },
   "dependencies": {
-    "@urql/exchange-auth": "^0.1.2",
-    "@urql/exchange-graphcache": "^4.0.0",
-    "graphql": "^15.5.0",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "urql": "^2.0.2"
+    "@urql/core": "^3.2.2",
+    "@urql/exchange-auth": "^2.0.0",
+    "@urql/exchange-graphcache": "^5.2.0",
+    "graphql": "^16.6.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "urql": "^3.0.4"
   },
   "devDependencies": {
-    "@vitejs/plugin-react-refresh": "^1.3.3",
-    "vite": "^2.2.4"
+    "@vitejs/plugin-react": "^3.1.0",
+    "vite": "^4.2.0"
   }
 }
diff --git a/examples/with-graphcache-updates/src/client.js b/examples/with-graphcache-updates/src/client.js
index d6f7b121..ea5cf6ee 100644
--- a/examples/with-graphcache-updates/src/client.js
+++ b/examples/with-graphcache-updates/src/client.js
@@ -1,5 +1,4 @@
-import { createClient, dedupExchange, fetchExchange, gql } from 'urql';
-import { makeOperation } from '@urql/core';
+import { Client, fetchExchange, gql } from 'urql';
 import { authExchange } from '@urql/exchange-auth';
 import { cacheExchange } from '@urql/exchange-graphcache';
 
@@ -40,78 +39,56 @@ const cache = cacheExchange({
   },
 });
 
-const client = createClient({
-  url: 'https://trygql.formidable.dev/graphql/web-collections',
-  exchanges: [
-    dedupExchange,
-    cache,
-    authExchange({
-      getAuth: async ({ authState }) => {
-        if (!authState) {
-          const token = localStorage.getItem('authToken');
-
-          if (token) {
-            return { token };
-          }
-
-          return null;
-        }
+const auth = authExchange(async utilities => {
+  let token = localStorage.getItem('authToken');
 
+  return {
+    addAuthToOperation(operation) {
+      if (!token) return operation;
+      return token
+        ? utilities.appendHeaders(operation, {
+            Authorization: `Bearer ${token}`,
+          })
+        : operation;
+    },
+    didAuthError(error) {
+      return error.graphQLErrors.some(
+        e => e.extensions?.code === 'UNAUTHORIZED'
+      );
+    },
+    willAuthError(operation) {
+      if (!token) {
+        // Detect our login mutation and let this operation through:
+        return (
+          operation.kind !== 'mutation' ||
+          // Here we find any mutation definition with the "signin" field
+          !operation.query.definitions.some(definition => {
+            return (
+              definition.kind === 'OperationDefinition' &&
+              definition.selectionSet.selections.some(node => {
+                // The field name is just an example, since register may also be an exception
+                return node.kind === 'Field' && node.name.value === 'signin';
+              })
+            );
+          })
+        );
+      }
+      return false;
+    },
+    async refreshAuth() {
+      token = localStorage.getItem('authToken');
+      if (!token) {
         // This is where auth has gone wrong and we need to clean up and redirect to a login page
         localStorage.clear();
         window.location.reload();
+      }
+    },
+  };
+});
 
-        return null;
-      },
-      addAuthToOperation: ({ authState, operation }) => {
-        if (!authState || !authState.token) {
-          return operation;
-        }
-
-        const fetchOptions =
-          typeof operation.context.fetchOptions === 'function'
-            ? operation.context.fetchOptions()
-            : operation.context.fetchOptions || {};
-
-        return makeOperation(operation.kind, operation, {
-          ...operation.context,
-          fetchOptions: {
-            ...fetchOptions,
-            headers: {
-              ...fetchOptions.headers,
-              Authorization: `Bearer ${authState.token}`,
-            },
-          },
-        });
-      },
-      didAuthError: ({ error }) => {
-        return error.graphQLErrors.some(
-          e => e.extensions?.code === 'UNAUTHORIZED'
-        );
-      },
-      willAuthError: ({ operation, authState }) => {
-        if (!authState) {
-          // Detect our login mutation and let this operation through:
-          return (
-            operation.kind !== 'mutation' ||
-            // Here we find any mutation definition with the "signin" field
-            !operation.query.definitions.some(definition => {
-              return (
-                definition.kind === 'OperationDefinition' &&
-                definition.selectionSet.selections.some(node => {
-                  // The field name is just an example, since register may also be an exception
-                  return node.kind === 'Field' && node.name.value === 'signin';
-                })
-              );
-            })
-          );
-        }
-
-        return false;
-      },
-    }),
-    fetchExchange,
-  ],
+const client = new Client({
+  url: 'https://trygql.formidable.dev/graphql/web-collections',
+  exchanges: [cache, auth, fetchExchange],
 });
 
 export default client;
diff --git a/examples/with-graphcache-updates/src/index.jsx b/examples/with-graphcache-updates/src/index.jsx
index f16bd3d1..7b6e0272 100644
--- a/examples/with-graphcache-updates/src/index.jsx
+++ b/examples/with-graphcache-updates/src/index.jsx
@@ -1,11 +1,6 @@
 import React from 'react';
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 
 import App from './App';
 
-render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-  document.getElementById('root')
-);
+createRoot(document.getElementById('root')).render(<App />);
diff --git a/examples/with-graphcache-updates/vite.config.js b/examples/with-graphcache-updates/vite.config.js
index 75f50ede..627a3196 100644
--- a/examples/with-graphcache-updates/vite.config.js
+++ b/examples/with-graphcache-updates/vite.config.js
@@ -1,7 +1,7 @@
 import { defineConfig } from 'vite';
-import reactRefresh from '@vitejs/plugin-react-refresh';
+import react from '@vitejs/plugin-react';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [reactRefresh()],
+  plugins: [react()],
 });
diff --git a/examples/with-multipart/package.json b/examples/with-multipart/package.json
index 24f682e6..06a457ff 100644
--- a/examples/with-multipart/package.json
+++ b/examples/with-multipart/package.json
@@ -6,14 +6,14 @@
     "start": "vite"
   },
   "dependencies": {
-    "@urql/exchange-multipart-fetch": "^0.1.11",
-    "graphql": "^15.5.0",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "urql": "^2.0.2"
+    "@urql/core": "^3.2.2",
+    "graphql": "^16.6.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "urql": "^3.0.4"
   },
   "devDependencies": {
-    "@vitejs/plugin-react-refresh": "^1.3.3",
-    "vite": "^2.2.4"
+    "@vitejs/plugin-react": "^3.1.0",
+    "vite": "^4.2.0"
   }
 }
diff --git a/examples/with-multipart/src/App.jsx b/examples/with-multipart/src/App.jsx
index bb88aeaf..6c45911c 100644
--- a/examples/with-multipart/src/App.jsx
+++ b/examples/with-multipart/src/App.jsx
@@ -1,12 +1,11 @@
 import React from 'react';
-import { createClient, Provider } from 'urql';
-import { multipartFetchExchange } from '@urql/exchange-multipart-fetch';
+import { Client, Provider, fetchExchange } from 'urql';
 
 import FileUpload from './FileUpload';
 
-const client = createClient({
+const client = new Client({
   url: 'https://trygql.formidable.dev/graphql/uploads-mock',
-  exchanges: [multipartFetchExchange],
+  exchanges: [fetchExchange],
 });
 
 function App() {
diff --git a/examples/with-multipart/src/index.jsx b/examples/with-multipart/src/index.jsx
index f16bd3d1..7b6e0272 100644
--- a/examples/with-multipart/src/index.jsx
+++ b/examples/with-multipart/src/index.jsx
@@ -1,11 +1,6 @@
 import React from 'react';
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 
 import App from './App';
 
-render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-  document.getElementById('root')
-);
+createRoot(document.getElementById('root')).render(<App />);
diff --git a/examples/with-multipart/vite.config.js b/examples/with-multipart/vite.config.js
index 75f50ede..627a3196 100644
--- a/examples/with-multipart/vite.config.js
+++ b/examples/with-multipart/vite.config.js
@@ -1,7 +1,7 @@
 import { defineConfig } from 'vite';
-import reactRefresh from '@vitejs/plugin-react-refresh';
+import react from '@vitejs/plugin-react';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [reactRefresh()],
+  plugins: [react()],
 });
diff --git a/examples/with-next/package.json b/examples/with-next/package.json
index 79e5d3bc..ddb7d899 100644
--- a/examples/with-next/package.json
+++ b/examples/with-next/package.json
@@ -3,12 +3,13 @@
   "version": "0.0.0",
   "private": true,
   "dependencies": {
-    "graphql": "^15.5.0",
-    "next": "10.1.2",
-    "next-urql": "^3.0.1",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "urql": "^2.0.2"
+    "@urql/core": "^3.2.2",
+    "graphql": "^16.6.0",
+    "next": "13.2.4",
+    "next-urql": "^4.0.3",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "urql": "^3.0.4"
   },
   "scripts": {
     "dev": "next dev",
diff --git a/examples/with-next/pages/_app.js b/examples/with-next/pages/_app.js
index 25d5d9ff..828487cf 100644
--- a/examples/with-next/pages/_app.js
+++ b/examples/with-next/pages/_app.js
@@ -1,10 +1,12 @@
 import { withUrqlClient } from 'next-urql';
+import { cacheExchange, fetchExchange } from 'urql';
 
 const App = ({ Component, pageProps }) => <Component {...pageProps} />;
 
 export default withUrqlClient(
-  () => ({
+  ssrExchange => ({
     url: 'https://trygql.formidable.dev/graphql/basic-pokedex',
+    exchanges: [cacheExchange, ssrExchange, fetchExchange],
   }),
   { ssr: false }
 )(App);
diff --git a/examples/with-next/pages/index.js b/examples/with-next/pages/index.js
index f8209410..57e9dead 100644
--- a/examples/with-next/pages/index.js
+++ b/examples/with-next/pages/index.js
@@ -1,5 +1,5 @@
 import { withUrqlClient } from 'next-urql';
-import { useQuery, gql } from 'urql';
+import { useQuery, cacheExchange, fetchExchange, gql } from 'urql';
 
 const POKEMONS_QUERY = gql`
   query {
@@ -26,8 +26,9 @@ function Index() {
 }
 
 export default withUrqlClient(
-  () => ({
+  ssrExchange => ({
     url: 'https://trygql.formidable.dev/graphql/basic-pokedex',
+    exchanges: [cacheExchange, ssrExchange, fetchExchange],
   }),
   { ssr: true }
 )(Index);
diff --git a/examples/with-next/pages/server.js b/examples/with-next/pages/server.js
index 7351f3ab..819d2c49 100644
--- a/examples/with-next/pages/server.js
+++ b/examples/with-next/pages/server.js
@@ -1,12 +1,6 @@
 import { initUrqlClient } from 'next-urql';
-import {
-  ssrExchange,
-  dedupExchange,
-  cacheExchange,
-  fetchExchange,
-  useQuery,
-  gql,
-} from 'urql';
+
+import { ssrExchange, cacheExchange, fetchExchange, useQuery, gql } from 'urql';
 
 const POKEMONS_QUERY = gql`
   query {
@@ -37,7 +31,7 @@ export async function getServerSideProps() {
   const client = initUrqlClient(
     {
       url: 'https://trygql.formidable.dev/graphql/basic-pokedex',
-      exchanges: [dedupExchange, cacheExchange, ssrCache, fetchExchange],
+      exchanges: [cacheExchange, ssrCache, fetchExchange],
     },
     false
   );
diff --git a/examples/with-next/pages/static.js b/examples/with-next/pages/static.js
index 793ca103..7832a670 100644
--- a/examples/with-next/pages/static.js
+++ b/examples/with-next/pages/static.js
@@ -1,12 +1,6 @@
 import { initUrqlClient } from 'next-urql';
-import {
-  ssrExchange,
-  dedupExchange,
-  cacheExchange,
-  fetchExchange,
-  useQuery,
-  gql,
-} from 'urql';
+
+import { ssrExchange, cacheExchange, fetchExchange, useQuery, gql } from 'urql';
 
 const POKEMONS_QUERY = gql`
   query {
@@ -37,7 +31,7 @@ export async function getStaticProps() {
   const client = initUrqlClient(
     {
       url: 'https://trygql.formidable.dev/graphql/basic-pokedex',
-      exchanges: [dedupExchange, cacheExchange, ssrCache, fetchExchange],
+      exchanges: [cacheExchange, ssrCache, fetchExchange],
     },
     false
   );
diff --git a/examples/with-pagination/package.json b/examples/with-pagination/package.json
index bcafd737..33ee35bb 100644
--- a/examples/with-pagination/package.json
+++ b/examples/with-pagination/package.json
@@ -6,13 +6,14 @@
     "start": "vite"
   },
   "dependencies": {
-    "graphql": "^15.5.0",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "urql": "^2.0.2"
+    "@urql/core": "^3.2.2",
+    "graphql": "^16.6.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "urql": "^3.0.4"
   },
   "devDependencies": {
-    "@vitejs/plugin-react-refresh": "^1.3.3",
-    "vite": "^2.2.4"
+    "@vitejs/plugin-react": "^3.1.0",
+    "vite": "^4.2.0"
   }
 }
diff --git a/examples/with-pagination/src/App.jsx b/examples/with-pagination/src/App.jsx
index 07e38aa3..f1d02127 100644
--- a/examples/with-pagination/src/App.jsx
+++ b/examples/with-pagination/src/App.jsx
@@ -1,10 +1,11 @@
 import React from 'react';
-import { createClient, Provider } from 'urql';
+import { Client, Provider, cacheExchange, fetchExchange } from 'urql';
 
 import PaginatedNpmSearch from './PaginatedNpmSearch';
 
-const client = createClient({
+const client = new Client({
   url: 'https://trygql.formidable.dev/graphql/relay-npm',
+  exchanges: [cacheExchange, fetchExchange],
 });
 
 function App() {
diff --git a/examples/with-pagination/src/index.jsx b/examples/with-pagination/src/index.jsx
index f16bd3d1..7b6e0272 100644
--- a/examples/with-pagination/src/index.jsx
+++ b/examples/with-pagination/src/index.jsx
@@ -1,11 +1,6 @@
 import React from 'react';
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 
 import App from './App';
 
-render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-  document.getElementById('root')
-);
+createRoot(document.getElementById('root')).render(<App />);
diff --git a/examples/with-pagination/vite.config.js b/examples/with-pagination/vite.config.js
index 75f50ede..627a3196 100644
--- a/examples/with-pagination/vite.config.js
+++ b/examples/with-pagination/vite.config.js
@@ -1,7 +1,7 @@
 import { defineConfig } from 'vite';
-import reactRefresh from '@vitejs/plugin-react-refresh';
+import react from '@vitejs/plugin-react';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [reactRefresh()],
+  plugins: [react()],
 });
diff --git a/examples/with-react-native/App.js b/examples/with-react-native/App.js
index 3a9d5dac..2ed5d010 100644
--- a/examples/with-react-native/App.js
+++ b/examples/with-react-native/App.js
@@ -1,10 +1,11 @@
 import React from 'react';
-import { createClient, Provider } from 'urql';
+import { Client, Provider, cacheExchange, fetchExchange } from 'urql';
 
 import PokemonList from './src/screens/PokemonList';
 
-const client = createClient({
+const client = new Client({
   url: 'https://trygql.formidable.dev/graphql/basic-pokedex',
+  exchanges: [cacheExchange, fetchExchange],
 });
 
 const App = () => {
diff --git a/examples/with-react-native/package.json b/examples/with-react-native/package.json
index f5568dad..b9efb2d9 100644
--- a/examples/with-react-native/package.json
+++ b/examples/with-react-native/package.json
@@ -8,15 +8,16 @@
     "start": "react-native start"
   },
   "dependencies": {
-    "graphql": "^15.5.0",
-    "react": "17.0.1",
-    "react-native": "0.64.0",
-    "urql": "^2.0.2"
+    "@urql/core": "^3.2.2",
+    "graphql": "^16.6.0",
+    "react": "18.2.0",
+    "react-native": "0.71.4",
+    "urql": "^3.0.4"
   },
   "devDependencies": {
     "@babel/core": "^7.12.9",
+    "@babel/preset-env": "^7.20.2",
     "@babel/runtime": "^7.12.5",
-    "babel-jest": "^26.6.3",
-    "metro-react-native-babel-preset": "^0.64.0"
+    "metro-react-native-babel-preset": "^0.76.0"
   }
 }
diff --git a/examples/with-react/package.json b/examples/with-react/package.json
index b52642ba..0f7bb365 100644
--- a/examples/with-react/package.json
+++ b/examples/with-react/package.json
@@ -6,13 +6,14 @@
     "start": "vite"
   },
   "dependencies": {
-    "graphql": "^15.5.0",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "urql": "^2.0.2"
+    "@urql/core": "^3.2.2",
+    "graphql": "^16.6.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "urql": "^3.0.4"
   },
   "devDependencies": {
-    "@vitejs/plugin-react-refresh": "^1.3.3",
-    "vite": "^2.2.4"
+    "@vitejs/plugin-react": "^3.1.0",
+    "vite": "^4.2.0"
   }
 }
diff --git a/examples/with-react/src/App.jsx b/examples/with-react/src/App.jsx
index cc972792..c993b525 100644
--- a/examples/with-react/src/App.jsx
+++ b/examples/with-react/src/App.jsx
@@ -1,10 +1,11 @@
 import React from 'react';
-import { createClient, Provider } from 'urql';
+import { Client, Provider, cacheExchange, fetchExchange } from 'urql';
 
 import PokemonList from './PokemonList';
 
-const client = createClient({
+const client = new Client({
   url: 'https://trygql.formidable.dev/graphql/basic-pokedex',
+  exchanges: [cacheExchange, fetchExchange],
 });
 
 function App() {
diff --git a/examples/with-react/src/index.jsx b/examples/with-react/src/index.jsx
index f16bd3d1..7b6e0272 100644
--- a/examples/with-react/src/index.jsx
+++ b/examples/with-react/src/index.jsx
@@ -1,11 +1,6 @@
 import React from 'react';
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 
 import App from './App';
 
-render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-  document.getElementById('root')
-);
+createRoot(document.getElementById('root')).render(<App />);
diff --git a/examples/with-react/vite.config.js b/examples/with-react/vite.config.js
index 75f50ede..627a3196 100644
--- a/examples/with-react/vite.config.js
+++ b/examples/with-react/vite.config.js
@@ -1,7 +1,7 @@
 import { defineConfig } from 'vite';
-import reactRefresh from '@vitejs/plugin-react-refresh';
+import react from '@vitejs/plugin-react';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [reactRefresh()],
+  plugins: [react()],
 });
diff --git a/examples/with-refresh-auth/package.json b/examples/with-refresh-auth/package.json
index 4ab49277..cef4da25 100644
--- a/examples/with-refresh-auth/package.json
+++ b/examples/with-refresh-auth/package.json
@@ -6,14 +6,15 @@
     "start": "vite"
   },
   "dependencies": {
-    "@urql/exchange-auth": "^0.1.2",
-    "graphql": "^15.5.0",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "urql": "^2.0.2"
+    "@urql/core": "^3.2.2",
+    "@urql/exchange-auth": "^2.0.0",
+    "graphql": "^16.6.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "urql": "^3.0.4"
   },
   "devDependencies": {
-    "@vitejs/plugin-react-refresh": "^1.3.3",
-    "vite": "^2.2.4"
+    "@vitejs/plugin-react": "^3.1.0",
+    "vite": "^4.2.0"
   }
 }
diff --git a/examples/with-refresh-auth/src/client.js b/examples/with-refresh-auth/src/client.js
index 03213ac2..8a41c6eb 100644
--- a/examples/with-refresh-auth/src/client.js
+++ b/examples/with-refresh-auth/src/client.js
@@ -1,12 +1,4 @@
-import {
-  makeOperation,
-  createClient,
-  dedupExchange,
-  fetchExchange,
-  cacheExchange,
-  gql,
-} from 'urql';
-
+import { Client, fetchExchange, cacheExchange, gql } from 'urql';
 import { authExchange } from '@urql/exchange-auth';
 
 import {
@@ -25,92 +17,70 @@ const REFRESH_TOKEN_MUTATION = gql`
   }
 `;
 
-const client = createClient({
-  url: 'https://trygql.formidable.dev/graphql/web-collections',
-  exchanges: [
-    dedupExchange,
-    cacheExchange,
-    authExchange({
-      async getAuth({ authState, mutate }) {
-        if (!authState) {
-          const token = getToken();
-          const refreshToken = getRefreshToken();
-
-          if (token && refreshToken) {
-            return { token, refreshToken };
-          }
-
-          return null;
-        }
-
-        const result = await mutate(REFRESH_TOKEN_MUTATION, {
-          refreshToken: authState.refreshToken,
+const auth = authExchange(async utilities => {
+  let token = getToken();
+  let refreshToken = getRefreshToken();
+
+  return {
+    addAuthToOperation(operation) {
+      return token
+        ? utilities.appendHeaders(operation, {
+            Authorization: `Bearer ${token}`,
+          })
+        : operation;
+    },
+    didAuthError(error) {
+      return error.graphQLErrors.some(
+        e => e.extensions?.code === 'UNAUTHORIZED'
+      );
+    },
+    willAuthError(operation) {
+      // Sync tokens on every operation
+      token = getToken();
+      refreshToken = getRefreshToken();
+
+      if (!token) {
+        // Detect our login mutation and let this operation through:
+        return (
+          operation.kind !== 'mutation' ||
+          // Here we find any mutation definition with the "signin" field
+          !operation.query.definitions.some(definition => {
+            return (
+              definition.kind === 'OperationDefinition' &&
+              definition.selectionSet.selections.some(node => {
+                // The field name is just an example, since register may also be an exception
+                return node.kind === 'Field' && node.name.value === 'signin';
+              })
+            );
+          })
+        );
+      }
+      return false;
+    },
+    async refreshAuth() {
+      if (refreshToken) {
+        const result = await utilities.mutate(REFRESH_TOKEN_MUTATION, {
+          refreshToken,
         });
 
         if (result.data?.refreshCredentials) {
-          saveAuthData(result.data.refreshCredentials);
-
-          return result.data.refreshCredentials;
+          token = result.data.refreshCredentials.token;
+          refreshToken = result.data.refreshCredentials.refreshToken;
+          saveAuthData({ token, refreshToken });
+          return;
         }
+      }
 
-        // This is where auth has gone wrong and we need to clean up and redirect to a login page
-        clearStorage();
-        window.location.reload();
-
-        return null;
-      },
-
-      addAuthToOperation({ authState, operation }) {
-        if (!authState || !authState.token) {
-          return operation;
-        }
-
-        const fetchOptions =
-          typeof operation.context.fetchOptions === 'function'
-            ? operation.context.fetchOptions()
-            : operation.context.fetchOptions || {};
-
-        return makeOperation(operation.kind, operation, {
-          ...operation.context,
-          fetchOptions: {
-            ...fetchOptions,
-            headers: {
-              ...fetchOptions.headers,
-              Authorization: `Bearer ${authState.token}`,
-            },
-          },
-        });
-      },
-
-      didAuthError({ error }) {
-        return error.graphQLErrors.some(
-          e => e.extensions?.code === 'UNAUTHORIZED'
-        );
-      },
-
-      willAuthError({ operation, authState }) {
-        if (!authState) {
-          // Detect our login mutation and let this operation through:
-          return (
-            operation.kind !== 'mutation' ||
-            // Here we find any mutation definition with the "signin" field
-            !operation.query.definitions.some(definition => {
-              return (
-                definition.kind === 'OperationDefinition' &&
-                definition.selectionSet.selections.some(node => {
-                  // The field name is just an example, since register may also be an exception
-                  return node.kind === 'Field' && node.name.value === 'signin';
-                })
-              );
-            })
-          );
-        }
+      // This is where auth has gone wrong and we need to clean up and redirect to a login page
+      clearStorage();
+      window.location.reload();
+    },
+  };
+});
 
-        return false;
-      },
-    }),
-    fetchExchange,
-  ],
+const client = new Client({
+  url: 'https://trygql.formidable.dev/graphql/web-collections',
+  exchanges: [cacheExchange, auth, fetchExchange],
 });
 
 export default client;
diff --git a/examples/with-refresh-auth/src/index.jsx b/examples/with-refresh-auth/src/index.jsx
index f16bd3d1..7b6e0272 100644
--- a/examples/with-refresh-auth/src/index.jsx
+++ b/examples/with-refresh-auth/src/index.jsx
@@ -1,11 +1,6 @@
 import React from 'react';
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 
 import App from './App';
 
-render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-  document.getElementById('root')
-);
+createRoot(document.getElementById('root')).render(<App />);
diff --git a/examples/with-refresh-auth/vite.config.js b/examples/with-refresh-auth/vite.config.js
index 75f50ede..627a3196 100644
--- a/examples/with-refresh-auth/vite.config.js
+++ b/examples/with-refresh-auth/vite.config.js
@@ -1,7 +1,7 @@
 import { defineConfig } from 'vite';
-import reactRefresh from '@vitejs/plugin-react-refresh';
+import react from '@vitejs/plugin-react';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [reactRefresh()],
+  plugins: [react()],
 });
diff --git a/examples/with-retry/package.json b/examples/with-retry/package.json
index a9755bd3..48712f7a 100644
--- a/examples/with-retry/package.json
+++ b/examples/with-retry/package.json
@@ -6,14 +6,15 @@
     "start": "vite"
   },
   "dependencies": {
-    "@urql/exchange-retry": "^0.2.0",
-    "graphql": "^15.5.0",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "urql": "^2.0.2"
+    "@urql/core": "^3.2.2",
+    "@urql/exchange-retry": "^1.0.0",
+    "graphql": "^16.6.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "urql": "^3.0.4"
   },
   "devDependencies": {
-    "@vitejs/plugin-react-refresh": "^1.3.3",
-    "vite": "^2.2.4"
+    "@vitejs/plugin-react": "^3.1.0",
+    "vite": "^4.2.0"
   }
 }
diff --git a/examples/with-retry/src/App.jsx b/examples/with-retry/src/App.jsx
index 4ba224f3..97eca32a 100644
--- a/examples/with-retry/src/App.jsx
+++ b/examples/with-retry/src/App.jsx
@@ -1,14 +1,15 @@
 import React from 'react';
-import { createClient, fetchExchange, Provider } from 'urql';
+import { Client, fetchExchange, Provider } from 'urql';
 import { retryExchange } from '@urql/exchange-retry';
 
 import Color from './Color';
 
-const client = createClient({
+const client = new Client({
   url: 'https://trygql.formidable.dev/graphql/intermittent-colors',
   exchanges: [
     retryExchange({
-      maxNumberAttempts: 5,
+      maxNumberAttempts: 10,
+      maxDelayMs: 500,
       retryIf: error => {
         // NOTE: With this deemo schema we have a specific random error to look out for:
         return (
diff --git a/examples/with-retry/src/Color.jsx b/examples/with-retry/src/Color.jsx
index 96b990a6..a92a0e74 100644
--- a/examples/with-retry/src/Color.jsx
+++ b/examples/with-retry/src/Color.jsx
@@ -29,8 +29,8 @@ const RandomColorDisplay = () => {
 
       {result.operation && (
         <p>
-          We retried {result.operation.context.retryCount} times to get a result
-          without an error.
+          To get a result, the retry exchange retried:{' '}
+          {result.operation.context.retryCount || 0} times.
         </p>
       )}
     </div>
diff --git a/examples/with-retry/src/index.jsx b/examples/with-retry/src/index.jsx
index f16bd3d1..7b6e0272 100644
--- a/examples/with-retry/src/index.jsx
+++ b/examples/with-retry/src/index.jsx
@@ -1,11 +1,6 @@
 import React from 'react';
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 
 import App from './App';
 
-render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-  document.getElementById('root')
-);
+createRoot(document.getElementById('root')).render(<App />);
diff --git a/examples/with-retry/vite.config.js b/examples/with-retry/vite.config.js
index 75f50ede..627a3196 100644
--- a/examples/with-retry/vite.config.js
+++ b/examples/with-retry/vite.config.js
@@ -1,7 +1,7 @@
 import { defineConfig } from 'vite';
-import reactRefresh from '@vitejs/plugin-react-refresh';
+import react from '@vitejs/plugin-react';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [reactRefresh()],
+  plugins: [react()],
 });
diff --git a/examples/with-svelte/package.json b/examples/with-svelte/package.json
index c8583ff1..38f93e8e 100644
--- a/examples/with-svelte/package.json
+++ b/examples/with-svelte/package.json
@@ -7,12 +7,14 @@
     "build": "vite build",
     "serve": "vite preview"
   },
-  "devDependencies": {
-    "@sveltejs/vite-plugin-svelte": "^1.0.0-next.44",
-    "vite": "^2.2.4"
-  },
   "dependencies": {
-    "@urql/svelte": "^2.0.0",
-    "svelte": "^3.48.0"
+    "@urql/core": "^3.2.2",
+    "@urql/svelte": "^3.0.4",
+    "graphql": "^16.6.0",
+    "svelte": "^3.57.0"
+  },
+  "devDependencies": {
+    "@sveltejs/vite-plugin-svelte": "^2.0.3",
+    "vite": "^4.2.0"
   }
 }
diff --git a/examples/with-svelte/src/App.svelte b/examples/with-svelte/src/App.svelte
index fa4da8b7..073dcf0c 100644
--- a/examples/with-svelte/src/App.svelte
+++ b/examples/with-svelte/src/App.svelte
@@ -1,9 +1,10 @@
 <script>
-  import { setContextClient, createClient } from "@urql/svelte";
+  import { setContextClient, Client, cacheExchange, fetchExchange } from "@urql/svelte";
   import PokemonList from "./PokemonList.svelte";
 
-  setContextClient(createClient({
-    url: "https://trygql.formidable.dev/graphql/basic-pokedex"
+  setContextClient(new Client({
+    url: "https://trygql.formidable.dev/graphql/basic-pokedex",
+    exchanges: [cacheExchange, fetchExchange],
   }));
 </script>
 
diff --git a/examples/with-vue3/package.json b/examples/with-vue3/package.json
index 7c4479d5..bbebe86b 100644
--- a/examples/with-vue3/package.json
+++ b/examples/with-vue3/package.json
@@ -8,12 +8,13 @@
     "serve": "vite preview"
   },
   "dependencies": {
-    "@urql/vue": "0.3.0",
-    "vue": "^3.0.11"
+    "@urql/core": "^3.2.2",
+    "@urql/vue": "^1.0.5",
+    "graphql": "^16.6.0",
+    "vue": "^3.2.47"
   },
   "devDependencies": {
-    "@vitejs/plugin-vue": "^1.2.2",
-    "@vue/compiler-sfc": "^3.0.11",
-    "vite": "^2.2.4"
+    "@vitejs/plugin-vue": "^4.1.0",
+    "vite": "^4.2.0"
   }
 }
diff --git a/examples/with-vue3/src/App.vue b/examples/with-vue3/src/App.vue
index edac1caf..8179f640 100644
--- a/examples/with-vue3/src/App.vue
+++ b/examples/with-vue3/src/App.vue
@@ -10,7 +10,7 @@
 </template>
 
 <script>
-import { provideClient } from '@urql/vue';
+import { provideClient, cacheExchange, fetchExchange } from '@urql/vue';
 import PokemonList from './PokemonList.vue'
 
 export default {
@@ -18,6 +18,7 @@ export default {
   setup() {
     provideClient({
       url: 'https://trygql.formidable.dev/graphql/basic-pokedex',
+      exchanges: [cacheExchange, fetchExchange],
     });
   },
   components: {
diff --git a/package.json b/package.json
index e7d7b0c7..45866590 100644
--- a/package.json
+++ b/package.json
@@ -7,7 +7,7 @@
     "build": "node ./scripts/actions/build-all.mjs",
     "postinstall": "node ./scripts/prepare/postinstall.js",
     "pack": "node ./scripts/actions/pack-all.mjs",
-    "changeset:version": "changeset version && pnpm install --lockfile-only",
+    "changeset:version": "node ./scripts/changesets/version.mjs",
     "changeset:publish": "changeset publish"
   },
   "eslintConfig": {
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
index dbda806b..cca7fbe7 100644
--- a/pnpm-workspace.yaml
+++ b/pnpm-workspace.yaml
@@ -1,3 +1,4 @@
 packages:
   - 'packages/*'
   - 'exchanges/*'
+  - '!examples/*'
diff --git a/scripts/actions/lib/packages.mjs b/scripts/actions/lib/packages.mjs
index 969cfdc0..3a890527 100644
--- a/scripts/actions/lib/packages.mjs
+++ b/scripts/actions/lib/packages.mjs
@@ -1,4 +1,5 @@
 import * as path from 'path';
+import * as fs from 'fs/promises';
 import glob from 'glob';
 
 import { workspaceRoot, workspaces, require } from './constants.mjs';
@@ -6,6 +7,30 @@ import { workspaceRoot, workspaces, require } from './constants.mjs';
 const getPackageManifest = (cwd) =>
   require(path.resolve(cwd, 'package.json'));
 
+const updatePackageManifest = async (cwd, manifest) => {
+  const sortDependencies = (dependencies) => {
+    if (dependencies == null)
+      return undefined;
+    return Object.keys(dependencies).sort().reduce((acc, key) => {
+      acc[key] = dependencies[key];
+      return acc;
+    }, {});
+  };
+
+  try {
+    if (!!getPackageManifest(cwd)) {
+      manifest.dependencies = sortDependencies(manifest.dependencies);
+      manifest.devDependencies = sortDependencies(manifest.devDependencies);
+      await fs.writeFile(
+        path.resolve(cwd, 'package.json'),
+        JSON.stringify(manifest, null, 2) + '\n',
+      );
+    }
+  } catch (_error) {
+    throw new Error('package.json does not exist in: ' + cwd);
+  }
+};
+
 const getPackageArtifact = (cwd) => {
   const pkg = getPackageManifest(cwd);
   const name =
@@ -48,6 +73,7 @@ const listArtifacts = async () => {
 
 export {
   getPackageManifest,
+  updatePackageManifest,
   getPackageArtifact,
   listPackages,
   listArtifacts,
diff --git a/scripts/changesets/version.mjs b/scripts/changesets/version.mjs
new file mode 100644
index 00000000..4f8cbc44
--- /dev/null
+++ b/scripts/changesets/version.mjs
@@ -0,0 +1,62 @@
+#!/usr/bin/env node
+
+import glob from 'glob';
+import { execa } from 'execa';
+
+import {
+  getPackageManifest,
+  updatePackageManifest,
+  listPackages
+} from '../actions/lib/packages.mjs';
+
+const versionRe = /^\d+\.\d+\.\d+/i;
+const execaOpts = { stdio: 'inherit' };
+
+await execa('changeset', ['changeset', 'version'], execaOpts);
+await execa('pnpm', ['install', '--lockfile-only'], execaOpts);
+
+const packages = (await listPackages()).reduce((map, dir) => {
+  const manifest = getPackageManifest(dir);
+  const versionMatch = manifest.version.match(versionRe);
+  if (versionMatch) {
+    const { name } = manifest;
+    const version = `^${versionMatch[0]}`;
+    map[name] = version;
+  }
+  return map;
+}, {});
+
+const examples = (await glob('./examples/*/')).filter(x => !/node_modules$/.test(x));
+console.log(`Scope: updating ${examples.length} examples`)
+for (const example of examples) {
+  let hadMatch = false;
+
+  const manifest = getPackageManifest(example);
+
+  if (manifest.dependencies) {
+    for (const name in manifest.dependencies) {
+      hadMatch = hadMatch || !!packages[name];
+      if (packages[name] && packages[name] !== manifest.dependencies)
+        manifest.dependencies[name] = packages[name];
+    }
+  }
+
+  if (manifest.devDependencies) {
+    for (const name in manifest.devDependencies) {
+      hadMatch = hadMatch || !!packages[name];
+      if (packages[name] && packages[name] !== manifest.devDependencies)
+        manifest.devDependencies[name] = packages[name];
+    }
+  }
+
+  if (
+    hadMatch &&
+    !(manifest.devDependencies || {})['@urql/core'] &&
+    !(manifest.dependencies || {})['@urql/core']
+  ) {
+    (manifest.dependencies || manifest.devDependencies || {})['@urql/core']
+      = packages['@urql/core'];
+  }
+
+  await updatePackageManifest(example, manifest);
+}
-- 
knotmirror 0.0.1