A calm place to write long-form, and publish it to the open social web.
skypress.blog/
Register mention format + autocompleter in SkyEditor
author
Jeremy Herve
date
(Jun 12, 2026, 6:28 PM +0200)
commit
0a11739e
0a11739e7bddfdfc8e40e3fe715fa31b9f818eae
parent
f66ea2e2
f66ea2e20195ec5d15d5e2d41a8bf2e3406cd114
+13
-6
+13
-6
src/components/SkyEditor.tsx
+13
-6
src/components/SkyEditor.tsx
···
23
23
24
24
import { ALLOWED_BLOCKS } from '../lib/blocks/allowlist';
25
25
import type { MediaUploadHandler } from '../lib/media/mediaUpload';
26
+
import { registerMentionFormat } from '../lib/editor/mention-format';
27
+
import { registerMentionAutocompleter } from '../lib/editor/mention-autocompleter';
26
28
27
29
export const SPIKE_BLOCKS_KEY = 'skypress:spike:blocks';
28
30
···
52
54
// it from the accessibility tree and suppress the announcement) while idle.
53
55
const [ status, setStatus ] = useState< string >( '' );
54
56
55
-
// Load existing content (editing) by rebuilding block instances from the stored tree.
56
-
// Core blocks are registered globally by the time onLoad runs.
57
-
const onLoad =
58
-
initialBlocks && initialBlocks.length > 0
59
-
? () => toEditorBlocks( initialBlocks )
60
-
: undefined;
57
+
// Runs once per editor mount, after the isolated editor has registered its
58
+
// `@wordpress` stores and core blocks globally. We use it to activate the
59
+
// `@`-mention format + autocompleter (both idempotent) and, when editing, to
60
+
// rebuild block instances from the stored tree.
61
+
const onLoad = useCallback( (): BlockInstance[] => {
62
+
registerMentionFormat();
63
+
registerMentionAutocompleter();
64
+
return initialBlocks && initialBlocks.length > 0
65
+
? toEditorBlocks( initialBlocks )
66
+
: [];
67
+
}, [ initialBlocks ] );
61
68
62
69
const onSaveBlocks = useCallback(
63
70
( blocks: BlockInstance[] ) => {