diff --git a/docs/app/(home)/hero/DemoEditor.tsx b/docs/app/(home)/hero/DemoEditor.tsx index bc8d3d4a89..e2587414af 100644 --- a/docs/app/(home)/hero/DemoEditor.tsx +++ b/docs/app/(home)/hero/DemoEditor.tsx @@ -22,7 +22,7 @@ import { import { useTheme } from "next-themes"; import { useCallback, useMemo, useState } from "react"; import YPartyKitProvider from "y-partykit/provider"; -import * as Y from "yjs"; +import * as Y from "@y/y"; const colors = [ "#958DF1", diff --git a/docs/content/docs/features/collaboration/index.mdx b/docs/content/docs/features/collaboration/index.mdx index 8c2557a5da..a21fe8a3fd 100644 --- a/docs/content/docs/features/collaboration/index.mdx +++ b/docs/content/docs/features/collaboration/index.mdx @@ -24,7 +24,7 @@ _Try the live demo on the [homepage](https://www.blocknotejs.org)_ BlockNote uses [Yjs](https://github.com/yjs/yjs) for this, and you can set it up with the `collaboration` option: ```typescript -import * as Y from "yjs"; +import * as Y from "@y/y"; import { WebrtcProvider } from "y-webrtc"; // ... diff --git a/docs/content/docs/reference/editor/yjs-utilities.mdx b/docs/content/docs/reference/editor/yjs-utilities.mdx index 50ead8d1c6..7da2a9e250 100644 --- a/docs/content/docs/reference/editor/yjs-utilities.mdx +++ b/docs/content/docs/reference/editor/yjs-utilities.mdx @@ -75,7 +75,7 @@ function blocksToYDoc< ```typescript import { BlockNoteEditor } from "@blocknote/core"; import { blocksToYDoc } from "@blocknote/core/yjs"; -import * as Y from "yjs"; +import * as Y from "@y/y"; const editor = BlockNoteEditor.create(); @@ -127,7 +127,7 @@ function blocksToYXmlFragment< ```typescript import { BlockNoteEditor } from "@blocknote/core"; import { blocksToYXmlFragment } from "@blocknote/core/yjs"; -import * as Y from "yjs"; +import * as Y from "@y/y"; const editor = BlockNoteEditor.create(); const doc = new Y.Doc(); @@ -175,7 +175,7 @@ function yDocToBlocks< ```typescript import { BlockNoteEditor } from "@blocknote/core"; import { yDocToBlocks } from "@blocknote/core/yjs"; -import * as Y from "yjs"; +import * as Y from "@y/y"; const editor = BlockNoteEditor.create(); const ydoc = new Y.Doc(); @@ -215,7 +215,7 @@ function yXmlFragmentToBlocks< ```typescript import { BlockNoteEditor } from "@blocknote/core"; import { yXmlFragmentToBlocks } from "@blocknote/core/yjs"; -import * as Y from "yjs"; +import * as Y from "@y/y"; const editor = BlockNoteEditor.create(); const doc = new Y.Doc(); diff --git a/docs/package.json b/docs/package.json index 51290a6cc4..dd5b8a699f 100644 --- a/docs/package.json +++ b/docs/package.json @@ -35,11 +35,6 @@ "@fumadocs/mdx-remote": "1.3.0", "@headlessui/react": "^2.2.9", "@heroicons/react": "^2.2.0", - "@liveblocks/client": "3.7.1-tiptap3", - "@liveblocks/react": "3.7.1-tiptap3", - "@liveblocks/react-blocknote": "3.7.1-tiptap3", - "@liveblocks/react-tiptap": "3.7.1-tiptap3", - "@liveblocks/react-ui": "3.7.1-tiptap3", "@mantine/core": "^8.3.4", "@mantine/hooks": "^8.3.4", "@mantine/utils": "^6.0.22", @@ -70,7 +65,6 @@ "@uppy/xhr-upload": "^3.4.0", "@vercel/analytics": "^1.5.0", "@vercel/og": "^0.6.8", - "@y-sweet/react": "^0.6.3", "ai": "^5.0.102", "babel-plugin-react-compiler": "19.1.0-rc.2", "better-auth": "^1.3.27", @@ -88,7 +82,6 @@ "import-in-the-middle": "^1.15.0", "next": "15.5.9", "nodemailer": "^7.0.11", - "partykit": "^0.0.115", "pg": "^8.16.3", "react": "^19.2.1", "react-dom": "^19.2.1", @@ -101,8 +94,7 @@ "shiki": "^3.13.0", "ts-morph": "26.0.0", "twoslash": "^0.3.4", - "y-partykit": "^0.0.25", - "yjs": "^13.6.27", + "@y/y": "14.0.0-19", "zod": "^3.25.76" }, "devDependencies": { @@ -115,9 +107,6 @@ "@blocknote/xl-docx-exporter": "workspace:*", "@blocknote/xl-multi-column": "workspace:*", "@blocknote/xl-pdf-exporter": "workspace:*", - "@liveblocks/react": "^2.24.3", - "@liveblocks/react-tiptap": "^2.24.3", - "@liveblocks/react-ui": "^2.24.3", "@mui/material": "^5.17.1", "@react-email/components": "^0.0.36", "@react-pdf/renderer": "^4.3.0", @@ -129,7 +118,6 @@ "@types/pg": "8.11.14", "@types/react": "^19.2.2", "@types/react-dom": "^19.2.2", - "@y-sweet/react": "^0.6.4", "next-themes": "0.4.6", "next-validate-link": "^1.6.3", "postcss": "^8.5.6", @@ -138,7 +126,6 @@ "tailwindcss": "^4.1.14", "tw-animate-css": "^1.4.0", "typescript": "^5.9.3", - "y-partykit": "^0.0.33", - "yjs": "^13.6.27" + "@y/y": "14.0.0-19" } -} \ No newline at end of file +} diff --git a/examples/01-basic/01-minimal/package.json b/examples/01-basic/01-minimal/package.json index e33d53239f..61a9846d32 100644 --- a/examples/01-basic/01-minimal/package.json +++ b/examples/01-basic/01-minimal/package.json @@ -11,6 +11,8 @@ "preview": "vite preview" }, "dependencies": { + "@y/protocols": "1.0.6-3", + "@y/y": "14.0.0-19", "@blocknote/ariakit": "latest", "@blocknote/core": "latest", "@blocknote/mantine": "latest", @@ -28,4 +30,4 @@ "@vitejs/plugin-react": "^4.7.0", "vite": "^5.4.20" } -} \ No newline at end of file +} diff --git a/examples/01-basic/01-minimal/src/App.tsx b/examples/01-basic/01-minimal/src/App.tsx index a3b92bafd2..1eabd5cdaf 100644 --- a/examples/01-basic/01-minimal/src/App.tsx +++ b/examples/01-basic/01-minimal/src/App.tsx @@ -2,11 +2,142 @@ import "@blocknote/core/fonts/inter.css"; import { BlockNoteView } from "@blocknote/mantine"; import "@blocknote/mantine/style.css"; import { useCreateBlockNote } from "@blocknote/react"; +import * as Y from "@y/y"; +import { Awareness } from "@y/protocols/awareness"; -export default function App() { - // Creates a new editor instance. - const editor = useCreateBlockNote(); +const doc = new Y.Doc(); +const provider = { + awareness: new Awareness(doc), +}; + +const doc2 = new Y.Doc(); +const provider2 = { + awareness: new Awareness(doc2), +}; + +const suggestingDoc = new Y.Doc({ isSuggestionDoc: true }); +const suggestingProvider = { + awareness: new Awareness(suggestingDoc), +}; +const suggestingAttributionManager = Y.createAttributionManagerFromDiff( + doc, + suggestingDoc, + { + attrs: [Y.createAttributionItem("insert", ["nickthesick"])], + }, +); +suggestingAttributionManager.suggestionMode = false; + +const suggestionModeDoc = new Y.Doc({ isSuggestionDoc: true }); +const suggestionModeProvider = { + awareness: new Awareness(suggestionModeDoc), +}; +const suggestionModeAttributionManager = Y.createAttributionManagerFromDiff( + doc, + suggestionModeDoc, + { attrs: [Y.createAttributionItem("insert", ["nickthesick"])] }, +); +suggestionModeAttributionManager.suggestionMode = true; + +// Function to sync two documents +function syncDocs(sourceDoc: Y.Doc, targetDoc: Y.Doc) { + // Create update message from source + const update = Y.encodeStateAsUpdate(sourceDoc); + + // Apply update to target + Y.applyUpdate(targetDoc, update); +} + +// Set up two-way sync +function setupTwoWaySync(doc1: Y.Doc, doc2: Y.Doc) { + // Sync initial states + syncDocs(doc1, doc2); + syncDocs(doc2, doc1); + + // Set up observers for future changes + doc1.on("update", (update: Uint8Array) => { + Y.applyUpdate(doc2, update); + }); + + doc2.on("update", (update: Uint8Array) => { + Y.applyUpdate(doc1, update); + }); +} + +setupTwoWaySync(doc, doc2); + +setupTwoWaySync(suggestingDoc, suggestionModeDoc); + +function Editor({ + fragment, + provider, + attributionManager, +}: { + fragment: Y.XmlFragment; + provider: { awareness: Awareness }; + attributionManager?: Y.AbstractAttributionManager; +}) { + const editor = useCreateBlockNote({ + collaboration: { + fragment, + provider, + user: { + name: "Hello", + color: "#FFFFFF", + }, + attributionManager, + }, + }); - // Renders the editor instance using a React component. return ; } + +export default function App() { + // Renders the editor instance using a React component. + return ( +
+
+
+ Client A + +
+
+ Client B + +
+
+
+
+ View Suggestions Mode + +
+
+ Suggestion Mode + +
+
+
+ ); +} diff --git a/examples/07-collaboration/01-partykit/.bnexample.json b/examples/07-collaboration/01-partykit/.bnexample.json deleted file mode 100644 index 87250048fe..0000000000 --- a/examples/07-collaboration/01-partykit/.bnexample.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "playground": true, - "docs": true, - "author": "yousefed", - "tags": ["Advanced", "Saving/Loading", "Collaboration"], - "dependencies": { - "y-partykit": "^0.0.25", - "yjs": "^13.6.27" - } -} diff --git a/examples/07-collaboration/01-partykit/README.md b/examples/07-collaboration/01-partykit/README.md deleted file mode 100644 index 600fcd0943..0000000000 --- a/examples/07-collaboration/01-partykit/README.md +++ /dev/null @@ -1,10 +0,0 @@ -# Collaborative Editing with PartyKit - -In this example, we use PartyKit to let multiple users collaborate on a single BlockNote document in real-time. - -**Try it out:** Open this page in a new browser tab or window to see it in action! - -**Relevant Docs:** - -- [Editor Setup](/docs/getting-started/editor-setup) -- [PartyKit](/docs/features/collaboration#partykit) diff --git a/examples/07-collaboration/01-partykit/index.html b/examples/07-collaboration/01-partykit/index.html deleted file mode 100644 index 707eae21e1..0000000000 --- a/examples/07-collaboration/01-partykit/index.html +++ /dev/null @@ -1,14 +0,0 @@ - - - - - Collaborative Editing with PartyKit - - - -
- - - diff --git a/examples/07-collaboration/01-partykit/main.tsx b/examples/07-collaboration/01-partykit/main.tsx deleted file mode 100644 index 677c7f7eed..0000000000 --- a/examples/07-collaboration/01-partykit/main.tsx +++ /dev/null @@ -1,11 +0,0 @@ -// 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( - - - -); diff --git a/examples/07-collaboration/01-partykit/package.json b/examples/07-collaboration/01-partykit/package.json deleted file mode 100644 index 4f77f3f17b..0000000000 --- a/examples/07-collaboration/01-partykit/package.json +++ /dev/null @@ -1,33 +0,0 @@ -{ - "name": "@blocknote/example-collaboration-partykit", - "description": "AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY", - "type": "module", - "private": true, - "version": "0.12.4", - "scripts": { - "start": "vite", - "dev": "vite", - "build:prod": "tsc && vite build", - "preview": "vite preview" - }, - "dependencies": { - "@blocknote/ariakit": "latest", - "@blocknote/core": "latest", - "@blocknote/mantine": "latest", - "@blocknote/react": "latest", - "@blocknote/shadcn": "latest", - "@mantine/core": "^8.3.4", - "@mantine/hooks": "^8.3.4", - "@mantine/utils": "^6.0.22", - "react": "^19.2.1", - "react-dom": "^19.2.1", - "y-partykit": "^0.0.25", - "yjs": "^13.6.27" - }, - "devDependencies": { - "@types/react": "^19.2.2", - "@types/react-dom": "^19.2.2", - "@vitejs/plugin-react": "^4.7.0", - "vite": "^5.4.20" - } -} \ No newline at end of file diff --git a/examples/07-collaboration/01-partykit/src/App.tsx b/examples/07-collaboration/01-partykit/src/App.tsx deleted file mode 100644 index 4d317c9b3b..0000000000 --- a/examples/07-collaboration/01-partykit/src/App.tsx +++ /dev/null @@ -1,34 +0,0 @@ -import "@blocknote/core/fonts/inter.css"; -import { useCreateBlockNote } from "@blocknote/react"; -import { BlockNoteView } from "@blocknote/mantine"; -import "@blocknote/mantine/style.css"; -import YPartyKitProvider from "y-partykit/provider"; -import * as Y from "yjs"; - -// Sets up Yjs document and PartyKit Yjs provider. -const doc = new Y.Doc(); -const provider = new YPartyKitProvider( - "blocknote-dev.yousefed.partykit.dev", - // Use a unique name as a "room" for your application. - "your-project-name", - doc, -); - -export default function App() { - const editor = useCreateBlockNote({ - collaboration: { - // The Yjs Provider responsible for transporting updates: - provider, - // Where to store BlockNote data in the Y.Doc: - fragment: doc.getXmlFragment("document-store"), - // Information (name and color) for this user: - user: { - name: "My Username", - color: "#ff0000", - }, - }, - }); - - // Renders the editor instance. - return ; -} diff --git a/examples/07-collaboration/01-partykit/tsconfig.json b/examples/07-collaboration/01-partykit/tsconfig.json deleted file mode 100644 index dbe3e6f62d..0000000000 --- a/examples/07-collaboration/01-partykit/tsconfig.json +++ /dev/null @@ -1,36 +0,0 @@ -{ - "__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/01-partykit/vite.config.ts b/examples/07-collaboration/01-partykit/vite.config.ts deleted file mode 100644 index f62ab20bc2..0000000000 --- a/examples/07-collaboration/01-partykit/vite.config.ts +++ /dev/null @@ -1,32 +0,0 @@ -// 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/examples/07-collaboration/02-liveblocks/.bnexample.json b/examples/07-collaboration/02-liveblocks/.bnexample.json deleted file mode 100644 index b212ead624..0000000000 --- a/examples/07-collaboration/02-liveblocks/.bnexample.json +++ /dev/null @@ -1,14 +0,0 @@ -{ - "playground": true, - "docs": true, - "author": "yousefed", - "tags": ["Advanced", "Saving/Loading", "Collaboration"], - "dependencies": { - "@liveblocks/client": "3.7.1-tiptap3", - "@liveblocks/react": "3.7.1-tiptap3", - "@liveblocks/react-blocknote": "3.7.1-tiptap3", - "@liveblocks/react-tiptap": "3.7.1-tiptap3", - "@liveblocks/react-ui": "3.7.1-tiptap3", - "yjs": "^13.6.27" - } -} diff --git a/examples/07-collaboration/02-liveblocks/README.md b/examples/07-collaboration/02-liveblocks/README.md deleted file mode 100644 index 50292b8d42..0000000000 --- a/examples/07-collaboration/02-liveblocks/README.md +++ /dev/null @@ -1,25 +0,0 @@ -# Collaborative Editing with Liveblocks - -In this example, we use -the [Liveblocks + BlockNote setup guide](https://liveblocks.io/docs/get-started/react-blocknote) -to create a collaborative BlockNote editor, where multiple people can work on -the same document in real-time. - -Users can also add comments to the documents to start threads, which are -displayed next to the editor. As well as that, they can react to, reply to, and -resolve existing comments. - -**Try it out:** Open this page in a new browser tab or window to see it in -action! - -**Relevant Docs:** - -- [Editor Setup](/docs/getting-started/editor-setup) -- [Liveblocks](/docs/features/collaboration#liveblocks) - -**From Liveblocks Website:** - -- [Get Started with BlockNote](https://liveblocks.io/docs/get-started/react-blocknote) -- [Ready Made Features](https://liveblocks.io/docs/ready-made-features/text-editor/blocknote) -- [API Reference](https://liveblocks.io/docs/api-reference/liveblocks-react-blocknote) -- [Advanced Example](https://liveblocks.io/examples/collaborative-text-editor/nextjs-blocknote) diff --git a/examples/07-collaboration/02-liveblocks/index.html b/examples/07-collaboration/02-liveblocks/index.html deleted file mode 100644 index af8a9f53fb..0000000000 --- a/examples/07-collaboration/02-liveblocks/index.html +++ /dev/null @@ -1,14 +0,0 @@ - - - - - Collaborative Editing with Liveblocks - - - -
- - - diff --git a/examples/07-collaboration/02-liveblocks/liveblocks.config.ts b/examples/07-collaboration/02-liveblocks/liveblocks.config.ts deleted file mode 100644 index 28db2e07be..0000000000 --- a/examples/07-collaboration/02-liveblocks/liveblocks.config.ts +++ /dev/null @@ -1,49 +0,0 @@ -// Define Liveblocks types for your application -// https://liveblocks.io/docs/api-reference/liveblocks-react#Typing-your-data -declare global { - interface Liveblocks { - // Each user's Presence, for useMyPresence, useOthers, etc. - Presence: { - // Example, real-time cursor coordinates - // cursor: { x: number; y: number }; - }; - - // The Storage tree for the room, for useMutation, useStorage, etc. - Storage: { - // Example, a conflict-free list - // animals: LiveList; - }; - - // Custom user info set when authenticating with a secret key - UserMeta: { - id: string; - info: { - // Example properties, for useSelf, useUser, useOthers, etc. - // name: string; - // avatar: string; - }; - }; - - // Custom events, for useBroadcastEvent, useEventListener - RoomEvent: {}; - // Example has two events, using a union - // | { type: "PLAY" } - // | { type: "REACTION"; emoji: "šŸ”„" }; - - // Custom metadata set on threads, for useThreads, useCreateThread, etc. - ThreadMetadata: { - // Example, attaching coordinates to a thread - // x: number; - // y: number; - }; - - // Custom room info set with resolveRoomsInfo, for useRoomInfo - RoomInfo: { - // Example, rooms with a title and url - // title: string; - // url: string; - }; - } -} - -export {}; diff --git a/examples/07-collaboration/02-liveblocks/main.tsx b/examples/07-collaboration/02-liveblocks/main.tsx deleted file mode 100644 index 677c7f7eed..0000000000 --- a/examples/07-collaboration/02-liveblocks/main.tsx +++ /dev/null @@ -1,11 +0,0 @@ -// 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( - - - -); diff --git a/examples/07-collaboration/02-liveblocks/package.json b/examples/07-collaboration/02-liveblocks/package.json deleted file mode 100644 index f200937daf..0000000000 --- a/examples/07-collaboration/02-liveblocks/package.json +++ /dev/null @@ -1,37 +0,0 @@ -{ - "name": "@blocknote/example-collaboration-liveblocks", - "description": "AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY", - "type": "module", - "private": true, - "version": "0.12.4", - "scripts": { - "start": "vite", - "dev": "vite", - "build:prod": "tsc && vite build", - "preview": "vite preview" - }, - "dependencies": { - "@blocknote/ariakit": "latest", - "@blocknote/core": "latest", - "@blocknote/mantine": "latest", - "@blocknote/react": "latest", - "@blocknote/shadcn": "latest", - "@mantine/core": "^8.3.4", - "@mantine/hooks": "^8.3.4", - "@mantine/utils": "^6.0.22", - "react": "^19.2.1", - "react-dom": "^19.2.1", - "@liveblocks/client": "3.7.1-tiptap3", - "@liveblocks/react": "3.7.1-tiptap3", - "@liveblocks/react-blocknote": "3.7.1-tiptap3", - "@liveblocks/react-tiptap": "3.7.1-tiptap3", - "@liveblocks/react-ui": "3.7.1-tiptap3", - "yjs": "^13.6.27" - }, - "devDependencies": { - "@types/react": "^19.2.2", - "@types/react-dom": "^19.2.2", - "@vitejs/plugin-react": "^4.7.0", - "vite": "^5.4.20" - } -} \ No newline at end of file diff --git a/examples/07-collaboration/02-liveblocks/src/App.tsx b/examples/07-collaboration/02-liveblocks/src/App.tsx deleted file mode 100644 index e523e79dd2..0000000000 --- a/examples/07-collaboration/02-liveblocks/src/App.tsx +++ /dev/null @@ -1,30 +0,0 @@ -// See https://liveblocks.io/docs/get-started/react-blocknote to see how this -// example was created, and an explanation for all the code. -import { - ClientSideSuspense, - LiveblocksProvider, - RoomProvider, -} from "@liveblocks/react/suspense"; -import "@liveblocks/react-ui/styles.css"; -import "@liveblocks/react-ui/styles/dark/media-query.css"; -import "@liveblocks/react-tiptap/styles.css"; - -import { Editor } from "./Editor"; -import "./globals.css"; -import "./styles.css"; - -export default function App() { - return ( - - - Loadingā€¦}> - - - - - ); -} diff --git a/examples/07-collaboration/02-liveblocks/src/Editor.tsx b/examples/07-collaboration/02-liveblocks/src/Editor.tsx deleted file mode 100644 index 2c6da47379..0000000000 --- a/examples/07-collaboration/02-liveblocks/src/Editor.tsx +++ /dev/null @@ -1,21 +0,0 @@ -import "@blocknote/core/fonts/inter.css"; -import { BlockNoteEditor } from "@blocknote/core"; -import { BlockNoteView } from "@blocknote/mantine"; -import "@blocknote/mantine/style.css"; -import { useCreateBlockNoteWithLiveblocks } from "@liveblocks/react-blocknote"; - -import { Threads } from "./Threads"; - -export function Editor() { - const editor = useCreateBlockNoteWithLiveblocks( - {}, - { mentions: true }, - ) as BlockNoteEditor; - - return ( -
- - -
- ); -} diff --git a/examples/07-collaboration/02-liveblocks/src/Threads.tsx b/examples/07-collaboration/02-liveblocks/src/Threads.tsx deleted file mode 100644 index b79c1ecd7f..0000000000 --- a/examples/07-collaboration/02-liveblocks/src/Threads.tsx +++ /dev/null @@ -1,29 +0,0 @@ -import { BlockNoteEditor } from "@blocknote/core"; -import { useThreads } from "@liveblocks/react/suspense"; -import { - AnchoredThreads, - FloatingComposer, - FloatingThreads, -} from "@liveblocks/react-blocknote"; - -export function Threads({ editor }: { editor: BlockNoteEditor | null }) { - const { threads } = useThreads({ query: { resolved: false } }); - - if (!editor) { - return null; - } - - return ( - <> -
- -
- - - - ); -} diff --git a/examples/07-collaboration/02-liveblocks/src/globals.css b/examples/07-collaboration/02-liveblocks/src/globals.css deleted file mode 100644 index 1b40f1f4ca..0000000000 --- a/examples/07-collaboration/02-liveblocks/src/globals.css +++ /dev/null @@ -1,47 +0,0 @@ -html { - font-family: Inter, sans-serif; - background: #f9f9f9; -} - -@media (prefers-color-scheme: dark) { - html { - background: #0c0c0c; - } -} - -.editor { - position: absolute; - inset: 0; - max-width: 1024px; - margin: 0 auto; - padding: 48px 0; -} - -.bn-editor { - padding: 36px 52px; - min-height: 100%; -} - -/* For mobile */ -.floating-threads { - display: none; -} - -/* For desktop */ -.anchored-threads { - display: block; - max-width: 300px; - width: 100%; - position: absolute; - right: 12px; -} - -@media (max-width: 640px) { - .floating-threads { - display: block; - } - - .anchored-threads { - display: none; - } -} diff --git a/examples/07-collaboration/02-liveblocks/src/styles.css b/examples/07-collaboration/02-liveblocks/src/styles.css deleted file mode 100644 index 74625c7432..0000000000 --- a/examples/07-collaboration/02-liveblocks/src/styles.css +++ /dev/null @@ -1,8 +0,0 @@ -.editor { - position: relative; - height: 100%; -} - -div:has(> .editor) { - height: 100%; -} diff --git a/examples/07-collaboration/02-liveblocks/tsconfig.json b/examples/07-collaboration/02-liveblocks/tsconfig.json deleted file mode 100644 index dbe3e6f62d..0000000000 --- a/examples/07-collaboration/02-liveblocks/tsconfig.json +++ /dev/null @@ -1,36 +0,0 @@ -{ - "__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/02-liveblocks/vite.config.ts b/examples/07-collaboration/02-liveblocks/vite.config.ts deleted file mode 100644 index f62ab20bc2..0000000000 --- a/examples/07-collaboration/02-liveblocks/vite.config.ts +++ /dev/null @@ -1,32 +0,0 @@ -// 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/examples/07-collaboration/03-y-sweet/.bnexample.json b/examples/07-collaboration/03-y-sweet/.bnexample.json deleted file mode 100644 index ec9d562b0e..0000000000 --- a/examples/07-collaboration/03-y-sweet/.bnexample.json +++ /dev/null @@ -1,9 +0,0 @@ -{ - "playground": true, - "docs": true, - "author": "jakelazaroff", - "tags": ["Advanced", "Saving/Loading", "Collaboration"], - "dependencies": { - "@y-sweet/react": "^0.6.3" - } -} diff --git a/examples/07-collaboration/03-y-sweet/README.md b/examples/07-collaboration/03-y-sweet/README.md deleted file mode 100644 index aa897aab16..0000000000 --- a/examples/07-collaboration/03-y-sweet/README.md +++ /dev/null @@ -1,11 +0,0 @@ -# Collaborative Editing with Y-Sweet - -In this example, we use Y-Sweet to let multiple users collaborate on a single BlockNote document in real-time. - -**Try it out:** Open the [Y-Sweet BlockNote demo](https://demos.y-sweet.dev/blocknote) in multiple browser tabs to see it in action! - -**Relevant Docs:** - -- [Editor Setup](/docs/getting-started/editor-setup) -- [Real-time collaboration](/docs/features/collaboration) -- [Y-Sweet on Jamsocket](https://docs.jamsocket.com/y-sweet/tutorials/blocknote) diff --git a/examples/07-collaboration/03-y-sweet/index.html b/examples/07-collaboration/03-y-sweet/index.html deleted file mode 100644 index 0f89a74040..0000000000 --- a/examples/07-collaboration/03-y-sweet/index.html +++ /dev/null @@ -1,14 +0,0 @@ - - - - - Collaborative Editing with Y-Sweet - - - -
- - - diff --git a/examples/07-collaboration/03-y-sweet/main.tsx b/examples/07-collaboration/03-y-sweet/main.tsx deleted file mode 100644 index 677c7f7eed..0000000000 --- a/examples/07-collaboration/03-y-sweet/main.tsx +++ /dev/null @@ -1,11 +0,0 @@ -// 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( - - - -); diff --git a/examples/07-collaboration/03-y-sweet/package.json b/examples/07-collaboration/03-y-sweet/package.json deleted file mode 100644 index 8e9072a3e9..0000000000 --- a/examples/07-collaboration/03-y-sweet/package.json +++ /dev/null @@ -1,32 +0,0 @@ -{ - "name": "@blocknote/example-collaboration-y-sweet", - "description": "AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY", - "type": "module", - "private": true, - "version": "0.12.4", - "scripts": { - "start": "vite", - "dev": "vite", - "build:prod": "tsc && vite build", - "preview": "vite preview" - }, - "dependencies": { - "@blocknote/ariakit": "latest", - "@blocknote/core": "latest", - "@blocknote/mantine": "latest", - "@blocknote/react": "latest", - "@blocknote/shadcn": "latest", - "@mantine/core": "^8.3.4", - "@mantine/hooks": "^8.3.4", - "@mantine/utils": "^6.0.22", - "react": "^19.2.1", - "react-dom": "^19.2.1", - "@y-sweet/react": "^0.6.3" - }, - "devDependencies": { - "@types/react": "^19.2.2", - "@types/react-dom": "^19.2.2", - "@vitejs/plugin-react": "^4.7.0", - "vite": "^5.4.20" - } -} \ No newline at end of file diff --git a/examples/07-collaboration/03-y-sweet/src/App.tsx b/examples/07-collaboration/03-y-sweet/src/App.tsx deleted file mode 100644 index 5a238ac497..0000000000 --- a/examples/07-collaboration/03-y-sweet/src/App.tsx +++ /dev/null @@ -1,35 +0,0 @@ -"use client"; - -import { useYDoc, useYjsProvider, YDocProvider } from "@y-sweet/react"; -import { useCreateBlockNote } from "@blocknote/react"; -import { BlockNoteView } from "@blocknote/mantine"; - -import "@blocknote/mantine/style.css"; - -export default function App() { - const docId = "my-blocknote-document"; - - return ( - - - - ); -} - -function Document() { - const provider = useYjsProvider(); - const doc = useYDoc(); - - const editor = useCreateBlockNote({ - collaboration: { - provider, - fragment: doc.getXmlFragment("blocknote"), - user: { color: "#ff0000", name: "My Username" }, - }, - }); - - return ; -} diff --git a/examples/07-collaboration/03-y-sweet/tsconfig.json b/examples/07-collaboration/03-y-sweet/tsconfig.json deleted file mode 100644 index dbe3e6f62d..0000000000 --- a/examples/07-collaboration/03-y-sweet/tsconfig.json +++ /dev/null @@ -1,36 +0,0 @@ -{ - "__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/03-y-sweet/vite.config.ts b/examples/07-collaboration/03-y-sweet/vite.config.ts deleted file mode 100644 index f62ab20bc2..0000000000 --- a/examples/07-collaboration/03-y-sweet/vite.config.ts +++ /dev/null @@ -1,32 +0,0 @@ -// 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/examples/07-collaboration/04-electric-sql/.bnexample.json b/examples/07-collaboration/04-electric-sql/.bnexample.json deleted file mode 100644 index 29a56bc991..0000000000 --- a/examples/07-collaboration/04-electric-sql/.bnexample.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "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 deleted file mode 100644 index 58296a8e95..0000000000 --- a/examples/07-collaboration/04-electric-sql/README.md +++ /dev/null @@ -1,11 +0,0 @@ -# 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 deleted file mode 100644 index a7a5977cc1..0000000000 --- a/examples/07-collaboration/04-electric-sql/index.html +++ /dev/null @@ -1,14 +0,0 @@ - - - - - Collaborative Editing with ElectricSQL - - - -
- - - diff --git a/examples/07-collaboration/04-electric-sql/main.tsx b/examples/07-collaboration/04-electric-sql/main.tsx deleted file mode 100644 index 677c7f7eed..0000000000 --- a/examples/07-collaboration/04-electric-sql/main.tsx +++ /dev/null @@ -1,11 +0,0 @@ -// 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( - - - -); diff --git a/examples/07-collaboration/04-electric-sql/package.json b/examples/07-collaboration/04-electric-sql/package.json deleted file mode 100644 index 75105c29da..0000000000 --- a/examples/07-collaboration/04-electric-sql/package.json +++ /dev/null @@ -1,31 +0,0 @@ -{ - "name": "@blocknote/example-collaboration-electric-sql", - "description": "AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY", - "type": "module", - "private": true, - "version": "0.12.4", - "scripts": { - "start": "vite", - "dev": "vite", - "build:prod": "tsc && vite build", - "preview": "vite preview" - }, - "dependencies": { - "@blocknote/ariakit": "latest", - "@blocknote/core": "latest", - "@blocknote/mantine": "latest", - "@blocknote/react": "latest", - "@blocknote/shadcn": "latest", - "@mantine/core": "^8.3.4", - "@mantine/hooks": "^8.3.4", - "@mantine/utils": "^6.0.22", - "react": "^19.2.1", - "react-dom": "^19.2.1" - }, - "devDependencies": { - "@types/react": "^19.2.2", - "@types/react-dom": "^19.2.2", - "@vitejs/plugin-react": "^4.7.0", - "vite": "^5.4.20" - } -} \ 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 deleted file mode 100644 index 10e68bfd35..0000000000 --- a/examples/07-collaboration/04-electric-sql/src/App.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import "./style.css"; - -export default function App() { - return ( -