editor/BlockEditor.jsx

@@ -1,5 +1,5 @@
 import { InterfaceSkeleton, FullscreenMode, ComplementaryArea } from '@wordpress/interface';
-import { BlockBreadcrumb, BlockCanvas, __experimentalLibrary as BlockLibrary } from '@wordpress/block-editor';
+import { BlockBreadcrumb, BlockCanvas, store as blockEditorStore } from '@wordpress/block-editor';
 
 import Header from './Header';
 import Sidebar from './Sidebar';
@@ -28,7 +28,6 @@ export default function BlockEditor() {
 								header={ <Header /> }
 								content={ <BlockCanvas height="100%" styles={styles} /> }
 								sidebar={ <ComplementaryArea.Slot scope={ scope } /> }
-								secondarySidebar={ <BlockLibrary /> }
 								footer={ <BlockBreadcrumb /> }
 						/>
 				</>

editor/Editor.jsx

@@ -6,15 +6,54 @@ import BlockEditor from './BlockEditor';
 import './editor.scss';
 
 export default function Editor() {
-		const [ blocks, updateBlocks ] = useState([]);
+		const [ blocks, updateBlocks ] = useState();
 
-		return (
+		return <BlockEditorProvider
-				<BlockEditorProvider
+							 value={ blocks }
-						value={ blocks }
+							 onInput={ updateBlocks }
-						onInput={ updateBlocks }
+							 onChange={ updateBlocks }
-						onChange={ updateBlocks }
+							 settings={ {
-				>
+									 __experimentalFeatures: {
-						<BlockEditor/>
+											 typography: {
-				</BlockEditorProvider>
+													 defaultFontSizes: true,
-		);
+													 dropCap: true,
+													 fontSizes: {
+															 default: [
+																	 {
+																			 name: "Small",
+																			 slug: "small",
+																			 size: "13px",
+																	 },
+																	 {
+																			 name: "Medium",
+																			 slug: "medium",
+																			 size: "20px",
+																	 },
+																	 {
+																			 name: "Large",
+																			 slug: "large",
+																			 size: "36px",
+																	 },
+																	 {
+																			 name: "Extra Large",
+																			 slug: "x-large",
+																			 size: "42px",
+																	 },
+															 ],
+													 },
+													 customFontSize: true,
+													 fontStyle: true,
+													 fontWeight: true,
+													 letterSpacing: true,
+													 textAlign: true,
+													 textColumns: false,
+													 textDecoration: true,
+													 textTransform: true,
+													 writingMode: false,
+											 },
+									 },
+							 } }
+					 >
+							 <BlockEditor/>
+					 </BlockEditorProvider>;
 }

editor/Sidebar.jsx

@@ -1,3 +1,5 @@
+import { useSelect } from '@wordpress/data';
+import { useEffect } from '@wordpress/element';
 import { ComplementaryArea } from '@wordpress/interface';
 import { Panel } from '@wordpress/components';
 import { BlockInspector } from '@wordpress/block-editor';
@@ -5,7 +7,7 @@ import { drawerRight } from '@wordpress/icons';
 
 import { scope } from './constants';
 
-export default function Sidebar() {
+export default function Sidebar () {
 		return (
 				<ComplementaryArea
 						scope={ scope }

editor/main.jsx

@@ -2,13 +2,13 @@ import { createRoot, StrictMode } from '@wordpress/element';
 import { registerCoreBlocks } from '@wordpress/block-library';
 import '@wordpress/format-library';
 
-import Editor from './Editor';
-
 registerCoreBlocks();
 
+import Editor from './Editor';
+
 const root = createRoot(document.querySelector('main'));
 root.render(
 		<StrictMode>
-				<Editor />
+				<Editor/>
 		</StrictMode>
 );

package.json

@@ -11,14 +11,14 @@
 				"preview": "vite preview"
 		},
 		"dependencies": {
-				"@wordpress/block-editor": "^13.0.0",
+				"@wordpress/block-editor": "13.0.0",
-				"@wordpress/block-library": "^9.0.0",
+				"@wordpress/block-library": "9.0.0",
-				"@wordpress/components": "^28.0.0",
+				"@wordpress/components": "28.0.0",
 				"@wordpress/data": "^10.0.0",
-				"@wordpress/element": "^6.0.0",
+				"@wordpress/element": "6.0.0",
-				"@wordpress/format-library": "^5.0.0",
+				"@wordpress/format-library": "5.0.0",
-				"@wordpress/icons": "^10.0.0",
+				"@wordpress/icons": "10.0.0",
-				"@wordpress/interface": "^6.0.0"
+				"@wordpress/interface": "6.0.0"
 		},
 		"devDependencies": {
 				"@vitejs/plugin-react": "^4.3.1",