feat: fumadocs

Author: nperez0111

examples/.eslintrc.js

@@ -0,0 +1,6 @@
+module.exports = {
+  extends: ["../.eslintrc.js"],
+  rules: {
+    "import/extensions": "off",
+  },
+};

examples/03-ui-components/02-formatting-toolbar-buttons/src/App.tsx

@@ -16,7 +16,7 @@ import {
   useCreateBlockNote,
 } from "@blocknote/react";
 
-import { BlueButton } from "./BlueButton.js";
+import { BlueButton } from "./BlueButton";
 
 export default function App() {
   // Creates a new editor instance.

examples/03-ui-components/03-formatting-toolbar-block-type-items/src/App.tsx

@@ -11,7 +11,7 @@ import {
 } from "@blocknote/react";
 
 import { RiAlertFill } from "react-icons/ri";
-import { Alert } from "./Alert.js";
+import { Alert } from "./Alert";
 
 // Our schema with block specs, which contain the configs and implementations for
 // blocks that we want our editor to use.

examples/03-ui-components/04-side-menu-buttons/src/App.tsx

@@ -8,7 +8,7 @@ import {
   useCreateBlockNote,
 } from "@blocknote/react";
 
-import { RemoveBlockButton } from "./RemoveBlockButton.js";
+import { RemoveBlockButton } from "./RemoveBlockButton";
 
 export default function App() {
   // Creates a new editor instance.

examples/03-ui-components/05-side-menu-drag-handle-items/src/App.tsx

@@ -11,7 +11,7 @@ import {
   useCreateBlockNote,
 } from "@blocknote/react";
 
-import { ResetBlockTypeItem } from "./ResetBlockTypeItem.js";
+import { ResetBlockTypeItem } from "./ResetBlockTypeItem";
 
 // To avoid rendering issues, it's good practice to define your custom drag
 // handle menu in a separate component, instead of inline within the `sideMenu`

examples/03-ui-components/10-suggestion-menus-grid-mentions/src/App.tsx

@@ -12,7 +12,7 @@ import {
   useCreateBlockNote,
 } from "@blocknote/react";
 
-import { Mention } from "./Mention.js";
+import { Mention } from "./Mention";
 
 // Our schema with inline content specs, which contain the configs and
 // implementations for inline content  that we want our editor to use.
@@ -27,7 +27,7 @@ const schema = BlockNoteSchema.create({
 
 // Function which gets all users for the mentions menu.
 const getMentionMenuItems = (
-  editor: typeof schema.BlockNoteEditor
+  editor: typeof schema.BlockNoteEditor,
 ): DefaultReactGridSuggestionItem[] => {
   const users = ["Steve", "Bob", "Joe", "Mike"];
 
@@ -95,7 +95,7 @@ export function App() {
               ...item,
               title: item.id,
             })),
-            query
+            query,
           ) as DefaultReactGridSuggestionItem[]
         }
         columns={2}

examples/03-ui-components/11-uppy-file-panel/src/App.tsx

@@ -9,8 +9,8 @@ import {
   useCreateBlockNote,
 } from "@blocknote/react";
 
-import { FileReplaceButton } from "./FileReplaceButton.js";
-import { uploadFile, UppyFilePanel } from "./UppyFilePanel.js";
+import { FileReplaceButton } from "./FileReplaceButton";
+import { uploadFile, UppyFilePanel } from "./UppyFilePanel";
 
 export default function App() {
   // Creates a new editor instance.
@@ -44,7 +44,7 @@ export default function App() {
           items.splice(
             items.findIndex((c) => c.key === "replaceFileButton"),
             1,
-            <FileReplaceButton key={"fileReplaceButton"} />
+            <FileReplaceButton key={"fileReplaceButton"} />,
           );
 
           return <FormattingToolbar {...props}>{items}</FormattingToolbar>;

examples/03-ui-components/11-uppy-file-panel/src/FileReplaceButton.tsx

@@ -14,7 +14,7 @@ import { useEffect, useState } from "react";
 
 import { RiImageEditFill } from "react-icons/ri";
 
-import { UppyFilePanel } from "./UppyFilePanel.js";
+import { UppyFilePanel } from "./UppyFilePanel";
 
 // Copied with minor changes from:
 // https://github.com/TypeCellOS/BlockNote/blob/main/packages/react/src/components/FormattingToolbar/DefaultButtons/FileReplaceButton.tsx

examples/03-ui-components/13-custom-ui/src/App.tsx

@@ -11,10 +11,10 @@ import "@blocknote/react/style.css";
 import { createTheme, ThemeProvider, useMediaQuery } from "@mui/material";
 import { useMemo } from "react";
 
-import { schema } from "./schema.js";
-import { CustomMUIFormattingToolbar } from "./MUIFormattingToolbar.js";
-import { CustomMUISideMenu } from "./MUISideMenu.js";
-import { MUISuggestionMenu } from "./MUISuggestionMenu.js";
+import { schema } from "./schema";
+import { CustomMUIFormattingToolbar } from "./MUIFormattingToolbar";
+import { CustomMUISideMenu } from "./MUISideMenu";
+import { MUISuggestionMenu } from "./MUISuggestionMenu";
 
 import "./style.css";
 
@@ -42,7 +42,7 @@ export default function App() {
           mode: prefersDarkMode ? "dark" : "light",
         },
       }),
-    [prefersDarkMode]
+    [prefersDarkMode],
   );
 
   // Renders the editor instance.
@@ -76,9 +76,9 @@ export default function App() {
           getItems={async (query) =>
             filterSuggestionItems(
               getDefaultReactSlashMenuItems(editor).filter(
-                (item) => item.title !== "Emoji"
+                (item) => item.title !== "Emoji",
               ),
-              query
+              query,
             )
           }
           suggestionMenuComponent={MUISuggestionMenu}

examples/03-ui-components/13-custom-ui/src/MUIFormattingToolbar.tsx

@@ -42,7 +42,7 @@ import {
   ReactNode,
 } from "react";
 
-import { TextBlockSchema } from "./schema.js";
+import { TextBlockSchema } from "./schema";
 
 // This replaces the generic Mantine `ToolbarSelect` component with a simplified
 // MUI version: