From 7fa3dbdead0c16a4bb0a4437e1591e469b9324dc Mon Sep 17 00:00:00 2001
From: Matthew Lipski <matthewlipski@gmail.com>
Date: Mon, 22 Sep 2025 12:00:24 +0200
Subject: [PATCH 1/4] Added ElectricSQL example

---
 .../04-electric-sql/.bnexample.json           |  6 ++++
 .../04-electric-sql/README.md                 | 11 ++++++
 .../04-electric-sql/index.html                | 14 ++++++++
 .../{04-comments => 04-electric-sql}/main.tsx |  0
 .../04-electric-sql/package.json              | 27 ++++++++++++++
 .../04-electric-sql/src/App.tsx               |  9 +++++
 .../tsconfig.json                             |  0
 .../vite.config.ts                            |  0
 .../.bnexample.json                           |  0
 .../{04-comments => 05-comments}/README.md    |  0
 .../{04-comments => 05-comments}/index.html   |  0
 .../main.tsx                                  |  0
 .../{04-comments => 05-comments}/package.json |  0
 .../{04-comments => 05-comments}/src/App.tsx  |  0
 .../src/SettingsSelect.tsx                    |  0
 .../src/style.css                             |  0
 .../src/userdata.ts                           |  0
 .../tsconfig.json                             |  0
 .../vite.config.ts                            |  0
 .../.bnexample.json                           |  0
 .../README.md                                 |  0
 .../index.html                                |  0
 .../main.tsx                                  |  0
 .../package.json                              |  0
 .../src/App.tsx                               |  0
 .../src/SettingsSelect.tsx                    |  0
 .../src/style.css                             |  0
 .../src/userdata.ts                           |  0
 .../tsconfig.json                             |  0
 .../vite.config.ts                            |  0
 .../.bnexample.json                           |  0
 .../README.md                                 |  0
 .../index.html                                |  0
 .../{07-forking => 07-ghost-writer}/main.tsx  |  0
 .../package.json                              |  0
 .../src/App.tsx                               |  0
 .../src/styles.css                            |  0
 .../tsconfig.json                             |  0
 .../vite.config.ts                            |  0
 .../.bnexample.json                           |  0
 .../{07-forking => 08-forking}/README.md      |  0
 .../{07-forking => 08-forking}/index.html     |  0
 examples/07-collaboration/08-forking/main.tsx | 11 ++++++
 .../{07-forking => 08-forking}/package.json   |  0
 .../{07-forking => 08-forking}/src/App.tsx    |  0
 .../07-collaboration/08-forking/tsconfig.json | 36 +++++++++++++++++++
 .../08-forking/vite.config.ts                 | 32 +++++++++++++++++
 playground/src/examples.gen.tsx               | 29 ++++++++++++---
 48 files changed, 171 insertions(+), 4 deletions(-)
 create mode 100644 examples/07-collaboration/04-electric-sql/.bnexample.json
 create mode 100644 examples/07-collaboration/04-electric-sql/README.md
 create mode 100644 examples/07-collaboration/04-electric-sql/index.html
 rename examples/07-collaboration/{04-comments => 04-electric-sql}/main.tsx (100%)
 create mode 100644 examples/07-collaboration/04-electric-sql/package.json
 create mode 100644 examples/07-collaboration/04-electric-sql/src/App.tsx
 rename examples/07-collaboration/{04-comments => 04-electric-sql}/tsconfig.json (100%)
 rename examples/07-collaboration/{04-comments => 04-electric-sql}/vite.config.ts (100%)
 rename examples/07-collaboration/{04-comments => 05-comments}/.bnexample.json (100%)
 rename examples/07-collaboration/{04-comments => 05-comments}/README.md (100%)
 rename examples/07-collaboration/{04-comments => 05-comments}/index.html (100%)
 rename examples/07-collaboration/{05-comments-with-sidebar => 05-comments}/main.tsx (100%)
 rename examples/07-collaboration/{04-comments => 05-comments}/package.json (100%)
 rename examples/07-collaboration/{04-comments => 05-comments}/src/App.tsx (100%)
 rename examples/07-collaboration/{04-comments => 05-comments}/src/SettingsSelect.tsx (100%)
 rename examples/07-collaboration/{04-comments => 05-comments}/src/style.css (100%)
 rename examples/07-collaboration/{04-comments => 05-comments}/src/userdata.ts (100%)
 rename examples/07-collaboration/{05-comments-with-sidebar => 05-comments}/tsconfig.json (100%)
 rename examples/07-collaboration/{05-comments-with-sidebar => 05-comments}/vite.config.ts (100%)
 rename examples/07-collaboration/{05-comments-with-sidebar => 06-comments-with-sidebar}/.bnexample.json (100%)
 rename examples/07-collaboration/{05-comments-with-sidebar => 06-comments-with-sidebar}/README.md (100%)
 rename examples/07-collaboration/{05-comments-with-sidebar => 06-comments-with-sidebar}/index.html (100%)
 rename examples/07-collaboration/{06-ghost-writer => 06-comments-with-sidebar}/main.tsx (100%)
 rename examples/07-collaboration/{05-comments-with-sidebar => 06-comments-with-sidebar}/package.json (100%)
 rename examples/07-collaboration/{05-comments-with-sidebar => 06-comments-with-sidebar}/src/App.tsx (100%)
 rename examples/07-collaboration/{05-comments-with-sidebar => 06-comments-with-sidebar}/src/SettingsSelect.tsx (100%)
 rename examples/07-collaboration/{05-comments-with-sidebar => 06-comments-with-sidebar}/src/style.css (100%)
 rename examples/07-collaboration/{05-comments-with-sidebar => 06-comments-with-sidebar}/src/userdata.ts (100%)
 rename examples/07-collaboration/{06-ghost-writer => 06-comments-with-sidebar}/tsconfig.json (100%)
 rename examples/07-collaboration/{06-ghost-writer => 06-comments-with-sidebar}/vite.config.ts (100%)
 rename examples/07-collaboration/{06-ghost-writer => 07-ghost-writer}/.bnexample.json (100%)
 rename examples/07-collaboration/{06-ghost-writer => 07-ghost-writer}/README.md (100%)
 rename examples/07-collaboration/{06-ghost-writer => 07-ghost-writer}/index.html (100%)
 rename examples/07-collaboration/{07-forking => 07-ghost-writer}/main.tsx (100%)
 rename examples/07-collaboration/{06-ghost-writer => 07-ghost-writer}/package.json (100%)
 rename examples/07-collaboration/{06-ghost-writer => 07-ghost-writer}/src/App.tsx (100%)
 rename examples/07-collaboration/{06-ghost-writer => 07-ghost-writer}/src/styles.css (100%)
 rename examples/07-collaboration/{07-forking => 07-ghost-writer}/tsconfig.json (100%)
 rename examples/07-collaboration/{07-forking => 07-ghost-writer}/vite.config.ts (100%)
 rename examples/07-collaboration/{07-forking => 08-forking}/.bnexample.json (100%)
 rename examples/07-collaboration/{07-forking => 08-forking}/README.md (100%)
 rename examples/07-collaboration/{07-forking => 08-forking}/index.html (100%)
 create mode 100644 examples/07-collaboration/08-forking/main.tsx
 rename examples/07-collaboration/{07-forking => 08-forking}/package.json (100%)
 rename examples/07-collaboration/{07-forking => 08-forking}/src/App.tsx (100%)
 create mode 100644 examples/07-collaboration/08-forking/tsconfig.json
 create mode 100644 examples/07-collaboration/08-forking/vite.config.ts

diff --git a/examples/07-collaboration/04-electric-sql/.bnexample.json b/examples/07-collaboration/04-electric-sql/.bnexample.json
new file mode 100644
index 0000000000..29a56bc991
--- /dev/null
+++ b/examples/07-collaboration/04-electric-sql/.bnexample.json
@@ -0,0 +1,6 @@
+{
+  "playground": true,
+  "docs": true,
+  "author": "matthewlipski",
+  "tags": ["Advanced", "Saving/Loading", "Collaboration"]
+}
diff --git a/examples/07-collaboration/04-electric-sql/README.md b/examples/07-collaboration/04-electric-sql/README.md
new file mode 100644
index 0000000000..58296a8e95
--- /dev/null
+++ b/examples/07-collaboration/04-electric-sql/README.md
@@ -0,0 +1,11 @@
+# Collaborative Editing with ElectricSQL
+
+In this example, we use ElectricSQL to let multiple users collaborate on a single BlockNote document in real-time. The setup for this demo is more involved than the other collaboration examples, as it requires a running server and has a more fully-fledged UI. Therefore, the demo just uses an iframe element to show a hosted instance of the full ElectricSQL + BlockNote setup, which you can find the code for [here](https://github.com/TypeCellOS/blocknote-electric-example).
+
+**Try it out:** Open this page (or the [iframe url](https://blocknote-electric-example.vercel.app/)) in a new browser tab or window to see it in action!
+
+**Relevant Docs:**
+
+- [Editor Setup](/docs/getting-started/editor-setup)
+- [Real-time collaboration](/docs/features/collaboration)
+- [ElectricSQL](https://electric-sql.com/)
diff --git a/examples/07-collaboration/04-electric-sql/index.html b/examples/07-collaboration/04-electric-sql/index.html
new file mode 100644
index 0000000000..6f1336e280
--- /dev/null
+++ b/examples/07-collaboration/04-electric-sql/index.html
@@ -0,0 +1,14 @@
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Collaborative Editing with Electric SQL</title>
+    <script>
+      <!-- AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY -->
+    </script>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="./main.tsx"></script>
+  </body>
+</html>
diff --git a/examples/07-collaboration/04-comments/main.tsx b/examples/07-collaboration/04-electric-sql/main.tsx
similarity index 100%
rename from examples/07-collaboration/04-comments/main.tsx
rename to examples/07-collaboration/04-electric-sql/main.tsx
diff --git a/examples/07-collaboration/04-electric-sql/package.json b/examples/07-collaboration/04-electric-sql/package.json
new file mode 100644
index 0000000000..cbd8e42e4b
--- /dev/null
+++ b/examples/07-collaboration/04-electric-sql/package.json
@@ -0,0 +1,27 @@
+{
+  "name": "@blocknote/example-collaboration-electric-sql",
+  "description": "AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY",
+  "private": true,
+  "version": "0.12.4",
+  "scripts": {
+    "start": "vite",
+    "dev": "vite",
+    "build:prod": "tsc && vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@blocknote/core": "latest",
+    "@blocknote/react": "latest",
+    "@blocknote/ariakit": "latest",
+    "@blocknote/mantine": "latest",
+    "@blocknote/shadcn": "latest",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19.1.0",
+    "@types/react-dom": "^19.1.0",
+    "@vitejs/plugin-react": "^4.3.1",
+    "vite": "^5.3.4"
+  }
+}
\ No newline at end of file
diff --git a/examples/07-collaboration/04-electric-sql/src/App.tsx b/examples/07-collaboration/04-electric-sql/src/App.tsx
new file mode 100644
index 0000000000..20c21849e1
--- /dev/null
+++ b/examples/07-collaboration/04-electric-sql/src/App.tsx
@@ -0,0 +1,9 @@
+export default function App() {
+  return (
+    <iframe
+      src="https://blocknote-electric-example.vercel.app/"
+      height="100%"
+      width="100%"
+    />
+  );
+}
diff --git a/examples/07-collaboration/04-comments/tsconfig.json b/examples/07-collaboration/04-electric-sql/tsconfig.json
similarity index 100%
rename from examples/07-collaboration/04-comments/tsconfig.json
rename to examples/07-collaboration/04-electric-sql/tsconfig.json
diff --git a/examples/07-collaboration/04-comments/vite.config.ts b/examples/07-collaboration/04-electric-sql/vite.config.ts
similarity index 100%
rename from examples/07-collaboration/04-comments/vite.config.ts
rename to examples/07-collaboration/04-electric-sql/vite.config.ts
diff --git a/examples/07-collaboration/04-comments/.bnexample.json b/examples/07-collaboration/05-comments/.bnexample.json
similarity index 100%
rename from examples/07-collaboration/04-comments/.bnexample.json
rename to examples/07-collaboration/05-comments/.bnexample.json
diff --git a/examples/07-collaboration/04-comments/README.md b/examples/07-collaboration/05-comments/README.md
similarity index 100%
rename from examples/07-collaboration/04-comments/README.md
rename to examples/07-collaboration/05-comments/README.md
diff --git a/examples/07-collaboration/04-comments/index.html b/examples/07-collaboration/05-comments/index.html
similarity index 100%
rename from examples/07-collaboration/04-comments/index.html
rename to examples/07-collaboration/05-comments/index.html
diff --git a/examples/07-collaboration/05-comments-with-sidebar/main.tsx b/examples/07-collaboration/05-comments/main.tsx
similarity index 100%
rename from examples/07-collaboration/05-comments-with-sidebar/main.tsx
rename to examples/07-collaboration/05-comments/main.tsx
diff --git a/examples/07-collaboration/04-comments/package.json b/examples/07-collaboration/05-comments/package.json
similarity index 100%
rename from examples/07-collaboration/04-comments/package.json
rename to examples/07-collaboration/05-comments/package.json
diff --git a/examples/07-collaboration/04-comments/src/App.tsx b/examples/07-collaboration/05-comments/src/App.tsx
similarity index 100%
rename from examples/07-collaboration/04-comments/src/App.tsx
rename to examples/07-collaboration/05-comments/src/App.tsx
diff --git a/examples/07-collaboration/04-comments/src/SettingsSelect.tsx b/examples/07-collaboration/05-comments/src/SettingsSelect.tsx
similarity index 100%
rename from examples/07-collaboration/04-comments/src/SettingsSelect.tsx
rename to examples/07-collaboration/05-comments/src/SettingsSelect.tsx
diff --git a/examples/07-collaboration/04-comments/src/style.css b/examples/07-collaboration/05-comments/src/style.css
similarity index 100%
rename from examples/07-collaboration/04-comments/src/style.css
rename to examples/07-collaboration/05-comments/src/style.css
diff --git a/examples/07-collaboration/04-comments/src/userdata.ts b/examples/07-collaboration/05-comments/src/userdata.ts
similarity index 100%
rename from examples/07-collaboration/04-comments/src/userdata.ts
rename to examples/07-collaboration/05-comments/src/userdata.ts
diff --git a/examples/07-collaboration/05-comments-with-sidebar/tsconfig.json b/examples/07-collaboration/05-comments/tsconfig.json
similarity index 100%
rename from examples/07-collaboration/05-comments-with-sidebar/tsconfig.json
rename to examples/07-collaboration/05-comments/tsconfig.json
diff --git a/examples/07-collaboration/05-comments-with-sidebar/vite.config.ts b/examples/07-collaboration/05-comments/vite.config.ts
similarity index 100%
rename from examples/07-collaboration/05-comments-with-sidebar/vite.config.ts
rename to examples/07-collaboration/05-comments/vite.config.ts
diff --git a/examples/07-collaboration/05-comments-with-sidebar/.bnexample.json b/examples/07-collaboration/06-comments-with-sidebar/.bnexample.json
similarity index 100%
rename from examples/07-collaboration/05-comments-with-sidebar/.bnexample.json
rename to examples/07-collaboration/06-comments-with-sidebar/.bnexample.json
diff --git a/examples/07-collaboration/05-comments-with-sidebar/README.md b/examples/07-collaboration/06-comments-with-sidebar/README.md
similarity index 100%
rename from examples/07-collaboration/05-comments-with-sidebar/README.md
rename to examples/07-collaboration/06-comments-with-sidebar/README.md
diff --git a/examples/07-collaboration/05-comments-with-sidebar/index.html b/examples/07-collaboration/06-comments-with-sidebar/index.html
similarity index 100%
rename from examples/07-collaboration/05-comments-with-sidebar/index.html
rename to examples/07-collaboration/06-comments-with-sidebar/index.html
diff --git a/examples/07-collaboration/06-ghost-writer/main.tsx b/examples/07-collaboration/06-comments-with-sidebar/main.tsx
similarity index 100%
rename from examples/07-collaboration/06-ghost-writer/main.tsx
rename to examples/07-collaboration/06-comments-with-sidebar/main.tsx
diff --git a/examples/07-collaboration/05-comments-with-sidebar/package.json b/examples/07-collaboration/06-comments-with-sidebar/package.json
similarity index 100%
rename from examples/07-collaboration/05-comments-with-sidebar/package.json
rename to examples/07-collaboration/06-comments-with-sidebar/package.json
diff --git a/examples/07-collaboration/05-comments-with-sidebar/src/App.tsx b/examples/07-collaboration/06-comments-with-sidebar/src/App.tsx
similarity index 100%
rename from examples/07-collaboration/05-comments-with-sidebar/src/App.tsx
rename to examples/07-collaboration/06-comments-with-sidebar/src/App.tsx
diff --git a/examples/07-collaboration/05-comments-with-sidebar/src/SettingsSelect.tsx b/examples/07-collaboration/06-comments-with-sidebar/src/SettingsSelect.tsx
similarity index 100%
rename from examples/07-collaboration/05-comments-with-sidebar/src/SettingsSelect.tsx
rename to examples/07-collaboration/06-comments-with-sidebar/src/SettingsSelect.tsx
diff --git a/examples/07-collaboration/05-comments-with-sidebar/src/style.css b/examples/07-collaboration/06-comments-with-sidebar/src/style.css
similarity index 100%
rename from examples/07-collaboration/05-comments-with-sidebar/src/style.css
rename to examples/07-collaboration/06-comments-with-sidebar/src/style.css
diff --git a/examples/07-collaboration/05-comments-with-sidebar/src/userdata.ts b/examples/07-collaboration/06-comments-with-sidebar/src/userdata.ts
similarity index 100%
rename from examples/07-collaboration/05-comments-with-sidebar/src/userdata.ts
rename to examples/07-collaboration/06-comments-with-sidebar/src/userdata.ts
diff --git a/examples/07-collaboration/06-ghost-writer/tsconfig.json b/examples/07-collaboration/06-comments-with-sidebar/tsconfig.json
similarity index 100%
rename from examples/07-collaboration/06-ghost-writer/tsconfig.json
rename to examples/07-collaboration/06-comments-with-sidebar/tsconfig.json
diff --git a/examples/07-collaboration/06-ghost-writer/vite.config.ts b/examples/07-collaboration/06-comments-with-sidebar/vite.config.ts
similarity index 100%
rename from examples/07-collaboration/06-ghost-writer/vite.config.ts
rename to examples/07-collaboration/06-comments-with-sidebar/vite.config.ts
diff --git a/examples/07-collaboration/06-ghost-writer/.bnexample.json b/examples/07-collaboration/07-ghost-writer/.bnexample.json
similarity index 100%
rename from examples/07-collaboration/06-ghost-writer/.bnexample.json
rename to examples/07-collaboration/07-ghost-writer/.bnexample.json
diff --git a/examples/07-collaboration/06-ghost-writer/README.md b/examples/07-collaboration/07-ghost-writer/README.md
similarity index 100%
rename from examples/07-collaboration/06-ghost-writer/README.md
rename to examples/07-collaboration/07-ghost-writer/README.md
diff --git a/examples/07-collaboration/06-ghost-writer/index.html b/examples/07-collaboration/07-ghost-writer/index.html
similarity index 100%
rename from examples/07-collaboration/06-ghost-writer/index.html
rename to examples/07-collaboration/07-ghost-writer/index.html
diff --git a/examples/07-collaboration/07-forking/main.tsx b/examples/07-collaboration/07-ghost-writer/main.tsx
similarity index 100%
rename from examples/07-collaboration/07-forking/main.tsx
rename to examples/07-collaboration/07-ghost-writer/main.tsx
diff --git a/examples/07-collaboration/06-ghost-writer/package.json b/examples/07-collaboration/07-ghost-writer/package.json
similarity index 100%
rename from examples/07-collaboration/06-ghost-writer/package.json
rename to examples/07-collaboration/07-ghost-writer/package.json
diff --git a/examples/07-collaboration/06-ghost-writer/src/App.tsx b/examples/07-collaboration/07-ghost-writer/src/App.tsx
similarity index 100%
rename from examples/07-collaboration/06-ghost-writer/src/App.tsx
rename to examples/07-collaboration/07-ghost-writer/src/App.tsx
diff --git a/examples/07-collaboration/06-ghost-writer/src/styles.css b/examples/07-collaboration/07-ghost-writer/src/styles.css
similarity index 100%
rename from examples/07-collaboration/06-ghost-writer/src/styles.css
rename to examples/07-collaboration/07-ghost-writer/src/styles.css
diff --git a/examples/07-collaboration/07-forking/tsconfig.json b/examples/07-collaboration/07-ghost-writer/tsconfig.json
similarity index 100%
rename from examples/07-collaboration/07-forking/tsconfig.json
rename to examples/07-collaboration/07-ghost-writer/tsconfig.json
diff --git a/examples/07-collaboration/07-forking/vite.config.ts b/examples/07-collaboration/07-ghost-writer/vite.config.ts
similarity index 100%
rename from examples/07-collaboration/07-forking/vite.config.ts
rename to examples/07-collaboration/07-ghost-writer/vite.config.ts
diff --git a/examples/07-collaboration/07-forking/.bnexample.json b/examples/07-collaboration/08-forking/.bnexample.json
similarity index 100%
rename from examples/07-collaboration/07-forking/.bnexample.json
rename to examples/07-collaboration/08-forking/.bnexample.json
diff --git a/examples/07-collaboration/07-forking/README.md b/examples/07-collaboration/08-forking/README.md
similarity index 100%
rename from examples/07-collaboration/07-forking/README.md
rename to examples/07-collaboration/08-forking/README.md
diff --git a/examples/07-collaboration/07-forking/index.html b/examples/07-collaboration/08-forking/index.html
similarity index 100%
rename from examples/07-collaboration/07-forking/index.html
rename to examples/07-collaboration/08-forking/index.html
diff --git a/examples/07-collaboration/08-forking/main.tsx b/examples/07-collaboration/08-forking/main.tsx
new file mode 100644
index 0000000000..677c7f7eed
--- /dev/null
+++ b/examples/07-collaboration/08-forking/main.tsx
@@ -0,0 +1,11 @@
+// AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY
+import React from "react";
+import { createRoot } from "react-dom/client";
+import App from "./src/App.jsx";
+
+const root = createRoot(document.getElementById("root")!);
+root.render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>
+);
diff --git a/examples/07-collaboration/07-forking/package.json b/examples/07-collaboration/08-forking/package.json
similarity index 100%
rename from examples/07-collaboration/07-forking/package.json
rename to examples/07-collaboration/08-forking/package.json
diff --git a/examples/07-collaboration/07-forking/src/App.tsx b/examples/07-collaboration/08-forking/src/App.tsx
similarity index 100%
rename from examples/07-collaboration/07-forking/src/App.tsx
rename to examples/07-collaboration/08-forking/src/App.tsx
diff --git a/examples/07-collaboration/08-forking/tsconfig.json b/examples/07-collaboration/08-forking/tsconfig.json
new file mode 100644
index 0000000000..dbe3e6f62d
--- /dev/null
+++ b/examples/07-collaboration/08-forking/tsconfig.json
@@ -0,0 +1,36 @@
+{
+  "__comment": "AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY",
+  "compilerOptions": {
+    "target": "ESNext",
+    "useDefineForClassFields": true,
+    "lib": [
+      "DOM",
+      "DOM.Iterable",
+      "ESNext"
+    ],
+    "allowJs": false,
+    "skipLibCheck": true,
+    "esModuleInterop": false,
+    "allowSyntheticDefaultImports": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "react-jsx",
+    "composite": true
+  },
+  "include": [
+    "."
+  ],
+  "__ADD_FOR_LOCAL_DEV_references": [
+    {
+      "path": "../../../packages/core/"
+    },
+    {
+      "path": "../../../packages/react/"
+    }
+  ]
+}
\ No newline at end of file
diff --git a/examples/07-collaboration/08-forking/vite.config.ts b/examples/07-collaboration/08-forking/vite.config.ts
new file mode 100644
index 0000000000..f62ab20bc2
--- /dev/null
+++ b/examples/07-collaboration/08-forking/vite.config.ts
@@ -0,0 +1,32 @@
+// AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY
+import react from "@vitejs/plugin-react";
+import * as fs from "fs";
+import * as path from "path";
+import { defineConfig } from "vite";
+// import eslintPlugin from "vite-plugin-eslint";
+// https://vitejs.dev/config/
+export default defineConfig((conf) => ({
+  plugins: [react()],
+  optimizeDeps: {},
+  build: {
+    sourcemap: true,
+  },
+  resolve: {
+    alias:
+      conf.command === "build" ||
+      !fs.existsSync(path.resolve(__dirname, "../../packages/core/src"))
+        ? {}
+        : ({
+            // Comment out the lines below to load a built version of blocknote
+            // or, keep as is to load live from sources with live reload working
+            "@blocknote/core": path.resolve(
+              __dirname,
+              "../../packages/core/src/"
+            ),
+            "@blocknote/react": path.resolve(
+              __dirname,
+              "../../packages/react/src/"
+            ),
+          } as any),
+  },
+}));
diff --git a/playground/src/examples.gen.tsx b/playground/src/examples.gen.tsx
index 49ef038167..9e4fe0cf62 100644
--- a/playground/src/examples.gen.tsx
+++ b/playground/src/examples.gen.tsx
@@ -1427,10 +1427,31 @@
         },
         "readme": "In this example, we use Y-Sweet to let multiple users collaborate on a single BlockNote document in real-time.\n\n**Try it out:** Open the [Y-Sweet BlockNote demo](https://demos.y-sweet.dev/blocknote) in multiple browser tabs to see it in action!\n\n**Relevant Docs:**\n\n- [Editor Setup](/docs/getting-started/editor-setup)\n- [Real-time collaboration](/docs/features/collaboration)\n- [Y-Sweet on Jamsocket](https://docs.jamsocket.com/y-sweet/tutorials/blocknote)"
       },
+      {
+        "projectSlug": "electric-sql",
+        "fullSlug": "collaboration/electric-sql",
+        "pathFromRoot": "examples/07-collaboration/04-electric-sql",
+        "config": {
+          "playground": true,
+          "docs": true,
+          "author": "matthewlipski",
+          "tags": [
+            "Advanced",
+            "Saving/Loading",
+            "Collaboration"
+          ]
+        },
+        "title": "Collaborative Editing with Electric SQL",
+        "group": {
+          "pathFromRoot": "examples/07-collaboration",
+          "slug": "collaboration"
+        },
+        "readme": "In this example, we use Y-Sweet to let multiple users collaborate on a single BlockNote document in real-time.\n\n**Try it out:** Open the [Y-Sweet BlockNote demo](https://demos.y-sweet.dev/blocknote) in multiple browser tabs to see it in action!\n\n**Relevant Docs:**\n\n- [Editor Setup](/docs/getting-started/editor-setup)\n- [Real-time collaboration](/docs/features/collaboration)\n- [Y-Sweet on Jamsocket](https://docs.jamsocket.com/y-sweet/tutorials/blocknote)"
+      },
       {
         "projectSlug": "comments",
         "fullSlug": "collaboration/comments",
-        "pathFromRoot": "examples/07-collaboration/04-comments",
+        "pathFromRoot": "examples/07-collaboration/05-comments",
         "config": {
           "playground": true,
           "docs": true,
@@ -1455,7 +1476,7 @@
       {
         "projectSlug": "comments-with-sidebar",
         "fullSlug": "collaboration/comments-with-sidebar",
-        "pathFromRoot": "examples/07-collaboration/05-comments-with-sidebar",
+        "pathFromRoot": "examples/07-collaboration/06-comments-with-sidebar",
         "config": {
           "playground": true,
           "docs": true,
@@ -1480,7 +1501,7 @@
       {
         "projectSlug": "ghost-writer",
         "fullSlug": "collaboration/ghost-writer",
-        "pathFromRoot": "examples/07-collaboration/06-ghost-writer",
+        "pathFromRoot": "examples/07-collaboration/07-ghost-writer",
         "config": {
           "playground": true,
           "docs": false,
@@ -1505,7 +1526,7 @@
       {
         "projectSlug": "forking",
         "fullSlug": "collaboration/forking",
-        "pathFromRoot": "examples/07-collaboration/07-forking",
+        "pathFromRoot": "examples/07-collaboration/08-forking",
         "config": {
           "playground": true,
           "docs": false,

From 6749651598bfc3f537e62ec7994e5635e25b3426 Mon Sep 17 00:00:00 2001
From: Matthew Lipski <matthewlipski@gmail.com>
Date: Mon, 22 Sep 2025 15:13:55 +0200
Subject: [PATCH 2/4] Fixed build

---
 .../04-electric-sql/index.html                |  2 +-
 playground/src/examples.gen.tsx               |  4 +-
 pnpm-lock.yaml                                | 45 +++++++++++++++++--
 3 files changed, 44 insertions(+), 7 deletions(-)

diff --git a/examples/07-collaboration/04-electric-sql/index.html b/examples/07-collaboration/04-electric-sql/index.html
index 6f1336e280..a7a5977cc1 100644
--- a/examples/07-collaboration/04-electric-sql/index.html
+++ b/examples/07-collaboration/04-electric-sql/index.html
@@ -2,7 +2,7 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Collaborative Editing with Electric SQL</title>
+    <title>Collaborative Editing with ElectricSQL</title>
     <script>
       <!-- AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY -->
     </script>
diff --git a/playground/src/examples.gen.tsx b/playground/src/examples.gen.tsx
index 9e4fe0cf62..df2defbb2f 100644
--- a/playground/src/examples.gen.tsx
+++ b/playground/src/examples.gen.tsx
@@ -1441,12 +1441,12 @@
             "Collaboration"
           ]
         },
-        "title": "Collaborative Editing with Electric SQL",
+        "title": "Collaborative Editing with ElectricSQL",
         "group": {
           "pathFromRoot": "examples/07-collaboration",
           "slug": "collaboration"
         },
-        "readme": "In this example, we use Y-Sweet to let multiple users collaborate on a single BlockNote document in real-time.\n\n**Try it out:** Open the [Y-Sweet BlockNote demo](https://demos.y-sweet.dev/blocknote) in multiple browser tabs to see it in action!\n\n**Relevant Docs:**\n\n- [Editor Setup](/docs/getting-started/editor-setup)\n- [Real-time collaboration](/docs/features/collaboration)\n- [Y-Sweet on Jamsocket](https://docs.jamsocket.com/y-sweet/tutorials/blocknote)"
+        "readme": "In this example, we use ElectricSQL to let multiple users collaborate on a single BlockNote document in real-time. The setup for this demo is more involved than the other collaboration examples, as it requires a running server and has a more fully-fledged UI. Therefore, the demo just uses an iframe element to show a hosted instance of the full ElectricSQL + BlockNote setup, which you can find the code for [here](https://github.com/TypeCellOS/blocknote-electric-example).\n\n**Try it out:** Open this page (or the [iframe url](https://blocknote-electric-example.vercel.app/)) in a new browser tab or window to see it in action!\n\n**Relevant Docs:**\n\n- [Editor Setup](/docs/getting-started/editor-setup)\n- [Real-time collaboration](/docs/features/collaboration)\n- [ElectricSQL](https://electric-sql.com/)"
       },
       {
         "projectSlug": "comments",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e7642ba7b2..65c33ffb53 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -2896,7 +2896,44 @@ importers:
         specifier: ^5.3.4
         version: 5.4.15(@types/node@22.15.2)(lightningcss@1.30.1)(terser@5.44.0)
 
-  examples/07-collaboration/04-comments:
+  examples/07-collaboration/04-electric-sql:
+    dependencies:
+      '@blocknote/ariakit':
+        specifier: latest
+        version: link:../../../packages/ariakit
+      '@blocknote/core':
+        specifier: latest
+        version: link:../../../packages/core
+      '@blocknote/mantine':
+        specifier: latest
+        version: link:../../../packages/mantine
+      '@blocknote/react':
+        specifier: latest
+        version: link:../../../packages/react
+      '@blocknote/shadcn':
+        specifier: latest
+        version: link:../../../packages/shadcn
+      react:
+        specifier: ^19.1.0
+        version: 19.1.0
+      react-dom:
+        specifier: ^19.1.0
+        version: 19.1.0(react@19.1.0)
+    devDependencies:
+      '@types/react':
+        specifier: ^19.1.0
+        version: 19.1.8
+      '@types/react-dom':
+        specifier: ^19.1.0
+        version: 19.1.6(@types/react@19.1.8)
+      '@vitejs/plugin-react':
+        specifier: ^4.3.1
+        version: 4.4.1(vite@5.4.15(@types/node@22.15.2)(lightningcss@1.30.1)(terser@5.44.0))
+      vite:
+        specifier: ^5.3.4
+        version: 5.4.15(@types/node@22.15.2)(lightningcss@1.30.1)(terser@5.44.0)
+
+  examples/07-collaboration/05-comments:
     dependencies:
       '@blocknote/ariakit':
         specifier: latest
@@ -2939,7 +2976,7 @@ importers:
         specifier: ^5.3.4
         version: 5.4.15(@types/node@22.15.2)(lightningcss@1.30.1)(terser@5.44.0)
 
-  examples/07-collaboration/05-comments-with-sidebar:
+  examples/07-collaboration/06-comments-with-sidebar:
     dependencies:
       '@blocknote/ariakit':
         specifier: latest
@@ -2982,7 +3019,7 @@ importers:
         specifier: ^5.3.4
         version: 5.4.15(@types/node@22.15.2)(lightningcss@1.30.1)(terser@5.44.0)
 
-  examples/07-collaboration/06-ghost-writer:
+  examples/07-collaboration/07-ghost-writer:
     dependencies:
       '@blocknote/ariakit':
         specifier: latest
@@ -3025,7 +3062,7 @@ importers:
         specifier: ^5.3.4
         version: 5.4.15(@types/node@22.15.2)(lightningcss@1.30.1)(terser@5.44.0)
 
-  examples/07-collaboration/07-forking:
+  examples/07-collaboration/08-forking:
     dependencies:
       '@blocknote/ariakit':
         specifier: latest

From 4dc47fe33f21eae297937e342f8cb9adfe738f52 Mon Sep 17 00:00:00 2001
From: Nick the Sick <nick@blocknotejs.org>
Date: Mon, 22 Sep 2025 15:26:27 +0200
Subject: [PATCH 3/4] fix: minor cleanup

---
 docs/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/package.json b/docs/package.json
index 0d2d376cd4..6104272225 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -140,4 +140,4 @@
     "y-partykit": "^0.0.33",
     "yjs": "^13.6.27"
   }
-}
+}
\ No newline at end of file

From ab4a89e520938a30f3f869fbf536e05423483952 Mon Sep 17 00:00:00 2001
From: Matthew Lipski <matthewlipski@gmail.com>
Date: Tue, 23 Sep 2025 11:09:28 +0200
Subject: [PATCH 4/4] Removed default iframe border

---
 examples/07-collaboration/04-electric-sql/src/App.tsx   | 2 ++
 examples/07-collaboration/04-electric-sql/src/style.css | 3 +++
 2 files changed, 5 insertions(+)
 create mode 100644 examples/07-collaboration/04-electric-sql/src/style.css

diff --git a/examples/07-collaboration/04-electric-sql/src/App.tsx b/examples/07-collaboration/04-electric-sql/src/App.tsx
index 20c21849e1..10e68bfd35 100644
--- a/examples/07-collaboration/04-electric-sql/src/App.tsx
+++ b/examples/07-collaboration/04-electric-sql/src/App.tsx
@@ -1,3 +1,5 @@
+import "./style.css";
+
 export default function App() {
   return (
     <iframe
diff --git a/examples/07-collaboration/04-electric-sql/src/style.css b/examples/07-collaboration/04-electric-sql/src/style.css
new file mode 100644
index 0000000000..993a28fb3e
--- /dev/null
+++ b/examples/07-collaboration/04-electric-sql/src/style.css
@@ -0,0 +1,3 @@
+iframe {
+  border: none;
+}