Skip to content

Commit d86b418

Browse files
committed
Merge branch 'main' into new-release
2 parents 934299b + 99385e0 commit d86b418

File tree

93 files changed

+3661
-1436
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

93 files changed

+3661
-1436
lines changed

docs/next.config.mjs

+5
Original file line numberDiff line numberDiff line change
@@ -118,6 +118,11 @@ const nextConfig = withAnalyzer(
118118
destination: "/docs/advanced/vanilla-js",
119119
permanent: true,
120120
},
121+
{
122+
source: "/examples/basic/all-blocks",
123+
destination: "/examples/basic/default-blocks",
124+
permanent: true,
125+
},
121126
],
122127
experimental: {
123128
externalDir: true,

docs/pages/docs/advanced/real-time-collaboration.mdx

+3
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,9 @@ const editor = useCreateBlockNote({
3838
name: "My Username",
3939
color: "#ff0000",
4040
},
41+
// When to show user labels on the collaboration cursor. Set by default to
42+
// "activity" (show when the cursor moves), but can also be set to "always".
43+
showCursorLabels: "activity"
4144
},
4245
// ...
4346
});

docs/pages/docs/editor-basics/default-schema.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ BlockNote supports a number of built-in blocks, inline content types, and styles
1414

1515
The demo below showcases each of BlockNote's built-in block and inline content types:
1616

17-
<Example name="basic/all-blocks" />
17+
<Example name="basic/default-blocks" />
1818

1919
## Default Blocks
2020

examples/01-basic/04-all-blocks/.bnexample.json

-9
This file was deleted.
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"playground": true,
3+
"docs": true,
4+
"author": "yousefed",
5+
"tags": ["Basic", "Blocks", "Inline Content"]
6+
}

examples/01-basic/04-all-blocks/App.tsx examples/01-basic/04-default-blocks/App.tsx

+3-68
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,11 @@
1-
import {
2-
BlockNoteSchema,
3-
combineByGroup,
4-
filterSuggestionItems,
5-
locales,
6-
} from "@blocknote/core";
71
import "@blocknote/core/fonts/inter.css";
82
import { BlockNoteView } from "@blocknote/mantine";
93
import "@blocknote/mantine/style.css";
10-
import {
11-
SuggestionMenuController,
12-
getDefaultReactSlashMenuItems,
13-
useCreateBlockNote,
14-
} from "@blocknote/react";
15-
import {
16-
getMultiColumnSlashMenuItems,
17-
multiColumnDropCursor,
18-
locales as multiColumnLocales,
19-
withMultiColumn,
20-
} from "@blocknote/xl-multi-column";
21-
import { useMemo } from "react";
4+
import { useCreateBlockNote } from "@blocknote/react";
5+
226
export default function App() {
237
// Creates a new editor instance.
248
const editor = useCreateBlockNote({
25-
schema: withMultiColumn(BlockNoteSchema.create()),
26-
dropCursor: multiColumnDropCursor,
27-
dictionary: {
28-
...locales.en,
29-
multi_column: multiColumnLocales.en,
30-
},
319
initialContent: [
3210
{
3311
type: "paragraph",
@@ -50,35 +28,6 @@ export default function App() {
5028
type: "paragraph",
5129
content: "Paragraph",
5230
},
53-
{
54-
type: "columnList",
55-
children: [
56-
{
57-
type: "column",
58-
props: {
59-
width: 0.8,
60-
},
61-
children: [
62-
{
63-
type: "paragraph",
64-
content: "Hello to the left!",
65-
},
66-
],
67-
},
68-
{
69-
type: "column",
70-
props: {
71-
width: 1.2,
72-
},
73-
children: [
74-
{
75-
type: "paragraph",
76-
content: "Hello to the right!",
77-
},
78-
],
79-
},
80-
],
81-
},
8231
{
8332
type: "heading",
8433
content: "Heading",
@@ -188,20 +137,6 @@ export default function App() {
188137
],
189138
});
190139

191-
const slashMenuItems = useMemo(() => {
192-
return combineByGroup(
193-
getDefaultReactSlashMenuItems(editor),
194-
getMultiColumnSlashMenuItems(editor)
195-
);
196-
}, [editor]);
197-
198140
// Renders the editor instance using a React component.
199-
return (
200-
<BlockNoteView editor={editor} slashMenu={false}>
201-
<SuggestionMenuController
202-
triggerCharacter={"/"}
203-
getItems={async (query) => filterSuggestionItems(slashMenuItems, query)}
204-
/>
205-
</BlockNoteView>
206-
);
141+
return <BlockNoteView editor={editor} />;
207142
}

examples/01-basic/04-all-blocks/package.json examples/01-basic/04-default-blocks/package.json

+2-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{
2-
"name": "@blocknote/example-all-blocks",
2+
"name": "@blocknote/example-default-blocks",
33
"description": "AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY",
44
"private": true,
55
"version": "0.12.4",
@@ -17,8 +17,7 @@
1717
"@blocknote/mantine": "latest",
1818
"@blocknote/shadcn": "latest",
1919
"react": "^18.3.1",
20-
"react-dom": "^18.3.1",
21-
"@blocknote/xl-multi-column": "latest"
20+
"react-dom": "^18.3.1"
2221
},
2322
"devDependencies": {
2423
"@types/react": "^18.0.25",
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"playground": true,
3+
"docs": true,
4+
"author": "areknawo",
5+
"tags": ["Basic"]
6+
}
+55
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
import { PartialBlock } from "@blocknote/core";
2+
import "@blocknote/core/fonts/inter.css";
3+
import { BlockNoteView } from "@blocknote/mantine";
4+
import "@blocknote/mantine/style.css";
5+
import { useCreateBlockNote } from "@blocknote/react";
6+
7+
// Component that creates & renders a BlockNote editor.
8+
function Editor(props: { initialContent?: PartialBlock[] }) {
9+
// Creates a new editor instance.
10+
const editor = useCreateBlockNote({
11+
sideMenuDetection: "editor",
12+
initialContent: props.initialContent,
13+
});
14+
15+
// Renders the editor instance using a React component.
16+
return <BlockNoteView editor={editor} style={{ flex: 1 }} />;
17+
}
18+
19+
export default function App() {
20+
// Creates & renders two editors side by side.
21+
return (
22+
<div style={{ display: "flex" }}>
23+
<Editor
24+
initialContent={[
25+
{
26+
type: "paragraph",
27+
content: "Welcome to this demo!",
28+
},
29+
{
30+
type: "paragraph",
31+
content: "This is a block in the first editor",
32+
},
33+
{
34+
type: "paragraph",
35+
},
36+
]}
37+
/>
38+
<Editor
39+
initialContent={[
40+
{
41+
type: "paragraph",
42+
content: "This is a block in the second editor",
43+
},
44+
{
45+
type: "paragraph",
46+
content: "Try dragging blocks from one editor to the other",
47+
},
48+
{
49+
type: "paragraph",
50+
},
51+
]}
52+
/>
53+
</div>
54+
);
55+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
# Multi-Editor Setup
2+
3+
This example showcases use of multiple editors in a single page - you can even drag blocks between them.
4+
5+
**Relevant Docs:**
6+
7+
- [Editor Setup](/docs/editor-basics/setup)
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<html lang="en">
2+
<head>
3+
<script>
4+
<!-- AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY -->
5+
</script>
6+
<meta charset="UTF-8" />
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
8+
<title>Multi-Editor Setup</title>
9+
</head>
10+
<body>
11+
<div id="root"></div>
12+
<script type="module" src="./main.tsx"></script>
13+
</body>
14+
</html>
+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
// AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY
2+
import React from "react";
3+
import { createRoot } from "react-dom/client";
4+
import App from "./App";
5+
6+
const root = createRoot(document.getElementById("root")!);
7+
root.render(
8+
<React.StrictMode>
9+
<App />
10+
</React.StrictMode>
11+
);
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
{
2+
"name": "@blocknote/example-multi-editor",
3+
"description": "AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY",
4+
"private": true,
5+
"version": "0.12.4",
6+
"scripts": {
7+
"start": "vite",
8+
"dev": "vite",
9+
"build": "tsc && vite build",
10+
"preview": "vite preview",
11+
"lint": "eslint . --max-warnings 0"
12+
},
13+
"dependencies": {
14+
"@blocknote/core": "latest",
15+
"@blocknote/react": "latest",
16+
"@blocknote/ariakit": "latest",
17+
"@blocknote/mantine": "latest",
18+
"@blocknote/shadcn": "latest",
19+
"react": "^18.3.1",
20+
"react-dom": "^18.3.1"
21+
},
22+
"devDependencies": {
23+
"@types/react": "^18.0.25",
24+
"@types/react-dom": "^18.0.9",
25+
"@vitejs/plugin-react": "^4.3.1",
26+
"eslint": "^8.10.0",
27+
"vite": "^5.3.4"
28+
},
29+
"eslintConfig": {
30+
"extends": [
31+
"../../../.eslintrc.js"
32+
]
33+
},
34+
"eslintIgnore": [
35+
"dist"
36+
]
37+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
{
2+
"__comment": "AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY",
3+
"compilerOptions": {
4+
"target": "ESNext",
5+
"useDefineForClassFields": true,
6+
"lib": [
7+
"DOM",
8+
"DOM.Iterable",
9+
"ESNext"
10+
],
11+
"allowJs": false,
12+
"skipLibCheck": true,
13+
"esModuleInterop": false,
14+
"allowSyntheticDefaultImports": true,
15+
"strict": true,
16+
"forceConsistentCasingInFileNames": true,
17+
"module": "ESNext",
18+
"moduleResolution": "Node",
19+
"resolveJsonModule": true,
20+
"isolatedModules": true,
21+
"noEmit": true,
22+
"jsx": "react-jsx",
23+
"composite": true
24+
},
25+
"include": [
26+
"."
27+
],
28+
"__ADD_FOR_LOCAL_DEV_references": [
29+
{
30+
"path": "../../../packages/core/"
31+
},
32+
{
33+
"path": "../../../packages/react/"
34+
}
35+
]
36+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
// AUTO-GENERATED FILE, DO NOT EDIT DIRECTLY
2+
import react from "@vitejs/plugin-react";
3+
import * as fs from "fs";
4+
import * as path from "path";
5+
import { defineConfig } from "vite";
6+
// import eslintPlugin from "vite-plugin-eslint";
7+
// https://vitejs.dev/config/
8+
export default defineConfig((conf) => ({
9+
plugins: [react()],
10+
optimizeDeps: {},
11+
build: {
12+
sourcemap: true,
13+
},
14+
resolve: {
15+
alias:
16+
conf.command === "build" ||
17+
!fs.existsSync(path.resolve(__dirname, "../../packages/core/src"))
18+
? {}
19+
: ({
20+
// Comment out the lines below to load a built version of blocknote
21+
// or, keep as is to load live from sources with live reload working
22+
"@blocknote/core": path.resolve(
23+
__dirname,
24+
"../../packages/core/src/"
25+
),
26+
"@blocknote/react": path.resolve(
27+
__dirname,
28+
"../../packages/react/src/"
29+
),
30+
} as any),
31+
},
32+
}));

0 commit comments

Comments
 (0)