feat: add default content
This commit is contained in:
@@ -6,26 +6,29 @@ import '@blocksuite/editor';
|
|||||||
import '@blocksuite/blocks/style';
|
import '@blocksuite/blocks/style';
|
||||||
import { useEditor } from '@/components/editor-provider';
|
import { useEditor } from '@/components/editor-provider';
|
||||||
import pkg from '../../package.json';
|
import pkg from '../../package.json';
|
||||||
|
import exampleMarkdown from './example-markdown';
|
||||||
export const Editor = () => {
|
export const Editor = () => {
|
||||||
const editorRef = useRef<EditorContainer>();
|
const editorRef = useRef<EditorContainer>();
|
||||||
const { setEditor } = useEditor();
|
const { setEditor } = useEditor();
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setEditor(editorRef.current!);
|
setEditor(editorRef.current!);
|
||||||
const { store } = editorRef.current as EditorContainer;
|
const { store } = editorRef.current as EditorContainer;
|
||||||
|
|
||||||
const version = pkg.dependencies['@blocksuite/editor'].substring(1);
|
|
||||||
const pageId = store.addBlock({
|
const pageId = store.addBlock({
|
||||||
flavour: 'page',
|
flavour: 'page',
|
||||||
title: `BlockSuite live demo ${version}`,
|
title: 'Welcome to the AFFiNE Alpha',
|
||||||
});
|
});
|
||||||
const groupId = store.addBlock({ flavour: 'group' }, pageId);
|
const groupId = store.addBlock({ flavour: 'group' }, pageId);
|
||||||
|
// const text = new Text(store, 'Legend from here...');
|
||||||
const text = new Text(store, 'Legend from here...');
|
// store.addBlock({ flavour: 'paragraph', text }, groupId);
|
||||||
store.addBlock({ flavour: 'paragraph', text }, groupId);
|
editorRef.current!.clipboard.importMarkdown(exampleMarkdown, `${groupId}`);
|
||||||
store.resetHistory();
|
store.resetHistory();
|
||||||
}, [setEditor]);
|
}, [setEditor]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const version = pkg.dependencies['@blocksuite/editor'].substring(1);
|
||||||
|
console.log(`BlockSuite live demo ${version}`);
|
||||||
|
}, []);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Suspense fallback={<div>Error!</div>}>
|
<Suspense fallback={<div>Error!</div>}>
|
||||||
<editor-container ref={editorRef} />
|
<editor-container ref={editorRef} />
|
||||||
|
|||||||
62
packages/app/src/components/example-markdown.ts
Normal file
62
packages/app/src/components/example-markdown.ts
Normal file
@@ -0,0 +1,62 @@
|
|||||||
|
const exampleMarkdown = `The [AFFiNE Alpha](https://pathfinder.affine.systems/) is here! 👏
|
||||||
|
|
||||||
|
**What's different in AFFiNE Alpha?**
|
||||||
|
|
||||||
|
1. A much ~smoother editing~ experience, with much ~greater stability~;
|
||||||
|
2. More complete ~Markdown~ support and improved ~keyboard shortcuts~;
|
||||||
|
3. New features such as ~dark mode~
|
||||||
|
* **Switch between view styles using the** ☀ **and** 🌙.
|
||||||
|
4. ~Clean and modern UI/UX~ design.
|
||||||
|
|
||||||
|
**Looking for Markdown syntax or keyboard shortcuts?**
|
||||||
|
|
||||||
|
* Find the (?) in the bottom right, then the ️, to view a full list. of \`Keyboard Shortcuts\`
|
||||||
|
|
||||||
|
**Have an enjoyable editing experience !!!** **😃**
|
||||||
|
|
||||||
|
Have some feedback or just want to get in touch? Use the (?), then 🎧 to get in touch and join our communities.
|
||||||
|
|
||||||
|
**Still in development**
|
||||||
|
|
||||||
|
There also somethings you should consider about this AFFiNE Alpha including some ~limitations~:
|
||||||
|
|
||||||
|
* Single page editing - currently editing multiple docs/pages is not supported;
|
||||||
|
* Changes are not automatically stored, to save changes you should export your data. Options can be found by going to the top right and finding the \`⋮\` icon.
|
||||||
|
* Without an import/open feature you are still able to access your data by copying it back in.
|
||||||
|
|
||||||
|
**Keyboard Shortcuts:**
|
||||||
|
|
||||||
|
1. Undo: \`⌘ + Z\` or \`Ctrl+Z\`
|
||||||
|
2. Redo: \`⌘ + ⇧ + Z\` or \`Ctrl+Shift+Z\`
|
||||||
|
3. Bold: \`⌘ + B\` or \`Ctrl+B\`
|
||||||
|
4. Italic: \`⌘ + I\` or \`Ctrl+I\`
|
||||||
|
5. Underline: \`⌘ + U\` or \`Ctrl+U\`
|
||||||
|
6. Strikethrough: \`⌘ + ⇧ + S\` or \`Ctrl+Shift+S\`
|
||||||
|
7. Inline code: \`⌘ + E\` or \`Ctrl+E\`
|
||||||
|
8. Link: \`⌘ + K\` or \`Ctrl+K\`
|
||||||
|
9. Body text: \`⌘ + ⌥ + 0\` or \`Ctrl+Shift+0\`
|
||||||
|
10. Heading 1: \`⌘ + ⌥ + 1\` or \`Ctrl+Shift+1\`
|
||||||
|
11. Heading 2: \`⌘ + ⌥ + 2\` or \`Ctrl+Shift+2\`
|
||||||
|
12. Heading 3: \`⌘ + ⌥ + 3\` or \`Ctrl+Shift+3\`
|
||||||
|
13. Heading 4: \`⌘ + ⌥ + 4\` or \`Ctrl+Shift+4\`
|
||||||
|
14. Heading 5: \`⌘ + ⌥ + 5\` or \`Ctrl+Shift+5\`
|
||||||
|
15. Heading 6: \`⌘ + ⌥ + 6\` or \`Ctrl+Shift+6\`
|
||||||
|
16. Increase indent: \`Tab\`
|
||||||
|
17. Reduce indent: \`⇧ + Tab\` or \`Shift+Tab\`
|
||||||
|
|
||||||
|
_Markdown Syntax:_
|
||||||
|
|
||||||
|
1. Bold: \`**text**\`
|
||||||
|
2. Italic: \`*text*\`
|
||||||
|
3. Underline: \`~text~\`
|
||||||
|
4. Strikethrough: \`~~text~~\`
|
||||||
|
5. Inline code: \`\` \`code\` \`\`
|
||||||
|
6. Heading 1: \`# text\`
|
||||||
|
7. Heading 2: \`## text\`
|
||||||
|
8. Heading 3: \`### text\`
|
||||||
|
9. Heading 4: \`#### text\`
|
||||||
|
10. Heading 5: \`##### text\`
|
||||||
|
11. Heading 6: \`###### text\`
|
||||||
|
`;
|
||||||
|
|
||||||
|
export default exampleMarkdown;
|
||||||
Reference in New Issue
Block a user