From c0fab9d685b495c94d5756579935aa6b12d157e0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Mon, 8 Mar 2021 22:10:51 +0100
Subject: [PATCH] remove old react example

---
 docs/src/demos/React/components/Editor.jsx | 34 -----------
 docs/src/demos/React/index.jsx             | 69 ----------------------
 docs/src/docPages/installation/react.md    |  2 +-
 3 files changed, 1 insertion(+), 104 deletions(-)
 delete mode 100644 docs/src/demos/React/components/Editor.jsx
 delete mode 100644 docs/src/demos/React/index.jsx

diff --git a/docs/src/demos/React/components/Editor.jsx b/docs/src/demos/React/components/Editor.jsx
deleted file mode 100644
index 8eec95cd6..000000000
--- a/docs/src/demos/React/components/Editor.jsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import React, {
-  useState, useRef, useEffect, createContext, useContext,
-} from 'react'
-import { Editor as Tiptap } from '@tiptap/core'
-
-export const EditorContext = createContext({})
-
-export const useEditor = () => useContext(EditorContext)
-
-export const Editor = ({
-  value, onChange, children, ...props
-}) => {
-  const [editor, setEditor] = useState(null)
-  const editorRef = useRef(null)
-
-  useEffect(() => {
-    const e = new Tiptap({
-      element: editorRef.current,
-      content: value,
-      ...props,
-    }).on('transaction', () => {
-      onChange(e.getJSON())
-    })
-
-    setEditor(e)
-  }, [])
-
-  return (
-    <EditorContext.Provider value={editor}>
-      {editorRef.current && children}
-      <div ref={editorRef} />
-    </EditorContext.Provider>
-  )
-}
diff --git a/docs/src/demos/React/index.jsx b/docs/src/demos/React/index.jsx
deleted file mode 100644
index 3e0bd73a7..000000000
--- a/docs/src/demos/React/index.jsx
+++ /dev/null
@@ -1,69 +0,0 @@
-import React, { useState } from 'react'
-import { defaultExtensions } from '@tiptap/starter-kit'
-import { useEditor, Editor } from '@tiptap/react'
-
-// Menu bar example component
-// useEditor only works for child components of <Editor />
-const MenuBar = () => {
-  const editor = useEditor()
-
-  return (
-    <>
-      <button onClick={() => editor.chain().focus().unsetAllMarks().run()}>
-        Clear formatting
-      </button>
-      <button
-        className={`${editor.isActive('bold') ? 'is-active' : ''}`}
-        onClick={() => editor.chain().focus().toggleBold().run()}
-      >
-        Bold
-      </button>
-    </>
-  )
-}
-
-export default () => {
-  const [value, setValue] = useState({
-    type: 'doc',
-    content: [
-      {
-        type: 'paragraph',
-        content: [
-          {
-            type: 'text',
-            text: 'rendered in ',
-          },
-          {
-            type: 'text',
-            marks: [
-              {
-                type: 'bold',
-              },
-            ],
-            text: 'react',
-          },
-          {
-            type: 'text',
-            text: '!',
-          },
-        ],
-      },
-    ],
-  })
-
-  return (
-    <>
-      <p>
-        <button onClick={() => alert(JSON.stringify(value))}>Alert state</button>
-      </p>
-      <hr style={{ margin: '0.85rem 0' }} />
-      <Editor
-        value={value}
-        onChange={setValue}
-        extensions={defaultExtensions()}
-      >
-        <MenuBar />
-      </Editor>
-    </>
-  )
-}
diff --git a/docs/src/docPages/installation/react.md b/docs/src/docPages/installation/react.md
index 511150c97..554666d81 100644
--- a/docs/src/docPages/installation/react.md
+++ b/docs/src/docPages/installation/react.md
@@ -7,4 +7,4 @@ The following guide describes how to integrate tiptap with your [React](https://
 
 TODO
 
-<demo name="React" />
+<demo name="Examples/Default/React" />