From f1607da4ad2b7defabc9a921c65dc36ebecc2486 Mon Sep 17 00:00:00 2001 From: Dylan Schiemann Date: Sun, 17 Oct 2021 14:31:33 +0100 Subject: [PATCH] Revert "in examples, move withReact in front of withHistory (#4604)" (#4607) This reverts commit 9cf2f4eea2878a7acce84273c3a65c09f0d0ea98. --- site/examples/check-lists.tsx | 2 +- site/examples/code-highlighting.tsx | 4 ++-- site/examples/custom-placeholder.tsx | 2 +- site/examples/editable-voids.tsx | 2 +- site/examples/embeds.tsx | 2 +- site/examples/forced-layout.tsx | 2 +- site/examples/hovering-toolbar.tsx | 2 +- site/examples/iframe.tsx | 2 +- site/examples/images.tsx | 2 +- site/examples/links.tsx | 2 +- site/examples/markdown-preview.tsx | 2 +- site/examples/markdown-shortcuts.tsx | 2 +- site/examples/mentions.tsx | 2 +- site/examples/plaintext.tsx | 2 +- site/examples/richtext.tsx | 2 +- site/examples/scroll-into-view.tsx | 2 +- site/examples/search-highlighting.tsx | 2 +- site/examples/shadow-dom.tsx | 2 +- site/examples/tables.tsx | 2 +- 19 files changed, 20 insertions(+), 20 deletions(-) diff --git a/site/examples/check-lists.tsx b/site/examples/check-lists.tsx index 0fed9641da..3f46d24e3a 100644 --- a/site/examples/check-lists.tsx +++ b/site/examples/check-lists.tsx @@ -69,7 +69,7 @@ const CheckListsExample = () => { const [value, setValue] = useState(initialValue) const renderElement = useCallback(props => , []) const editor = useMemo( - () => withReact(withChecklists(withHistory(createEditor()))), + () => withChecklists(withHistory(withReact(createEditor()))), [] ) diff --git a/site/examples/code-highlighting.tsx b/site/examples/code-highlighting.tsx index 48bad98b12..b2ad12a83b 100644 --- a/site/examples/code-highlighting.tsx +++ b/site/examples/code-highlighting.tsx @@ -13,7 +13,7 @@ const CodeHighlightingExample = () => { const [value, setValue] = useState(initialValue) const [language, setLanguage] = useState('html') const renderLeaf = useCallback(props => , []) - const editor = useMemo(() => withReact(withHistory(createEditor())), []) + const editor = useMemo(() => withHistory(withReact(createEditor())), []) // decorate function depends on the language selected const decorate = useCallback( @@ -99,7 +99,7 @@ const Leaf = ({ attributes, children, leaf }) => { ${leaf.comment && css` color: slategray; - `} + `} ${(leaf.operator || leaf.url) && css` diff --git a/site/examples/custom-placeholder.tsx b/site/examples/custom-placeholder.tsx index 5a0e44f66e..9181e633d8 100644 --- a/site/examples/custom-placeholder.tsx +++ b/site/examples/custom-placeholder.tsx @@ -5,7 +5,7 @@ import { withHistory } from 'slate-history' const PlainTextExample = () => { const [value, setValue] = useState(initialValue) - const editor = useMemo(() => withReact(withHistory(createEditor())), []) + const editor = useMemo(() => withHistory(withReact(createEditor())), []) return ( setValue(value)}> { const [value, setValue] = useState(initialValue) const editor = useMemo( - () => withReact(withEditableVoids(withHistory(createEditor()))), + () => withEditableVoids(withHistory(withReact(createEditor()))), [] ) diff --git a/site/examples/embeds.tsx b/site/examples/embeds.tsx index 5e07df1bce..561aa9c1a0 100644 --- a/site/examples/embeds.tsx +++ b/site/examples/embeds.tsx @@ -15,7 +15,7 @@ import { const EmbedsExample = () => { const [value, setValue] = useState(initialValue) - const editor = useMemo(() => withReact(withEmbeds(createEditor())), []) + const editor = useMemo(() => withEmbeds(withReact(createEditor())), []) return ( setValue(value)}> { const [value, setValue] = useState(initialValue) const renderElement = useCallback(props => , []) const editor = useMemo( - () => withReact(withLayout(withHistory(createEditor()))), + () => withLayout(withHistory(withReact(createEditor()))), [] ) return ( diff --git a/site/examples/hovering-toolbar.tsx b/site/examples/hovering-toolbar.tsx index 902b4319ec..8420f3fd0a 100644 --- a/site/examples/hovering-toolbar.tsx +++ b/site/examples/hovering-toolbar.tsx @@ -16,7 +16,7 @@ import { Button, Icon, Menu, Portal } from '../components' const HoveringMenuExample = () => { const [value, setValue] = useState(initialValue) - const editor = useMemo(() => withReact(withHistory(createEditor())), []) + const editor = useMemo(() => withHistory(withReact(createEditor())), []) return ( setValue(value)}> diff --git a/site/examples/iframe.tsx b/site/examples/iframe.tsx index 809299bc18..e6cd922b4b 100644 --- a/site/examples/iframe.tsx +++ b/site/examples/iframe.tsx @@ -21,7 +21,7 @@ const IFrameExample = () => { [] ) const renderLeaf = useCallback(props => , []) - const editor = useMemo(() => withReact(withHistory(createEditor())), []) + const editor = useMemo(() => withHistory(withReact(createEditor())), []) const handleBlur = useCallback(() => ReactEditor.deselect(editor), [editor]) diff --git a/site/examples/images.tsx b/site/examples/images.tsx index 53bf539cee..30fb3964a6 100644 --- a/site/examples/images.tsx +++ b/site/examples/images.tsx @@ -19,7 +19,7 @@ import { ImageElement } from './custom-types' const ImagesExample = () => { const [value, setValue] = useState(initialValue) const editor = useMemo( - () => withImages(withReact(withHistory(createEditor()))), + () => withImages(withHistory(withReact(createEditor()))), [] ) diff --git a/site/examples/links.tsx b/site/examples/links.tsx index 247340566a..ab66fd2d75 100644 --- a/site/examples/links.tsx +++ b/site/examples/links.tsx @@ -17,7 +17,7 @@ import { Button, Icon, Toolbar } from '../components' const LinkExample = () => { const [value, setValue] = useState(initialValue) const editor = useMemo( - () => withLinks(withReact(withHistory(createEditor()))), + () => withLinks(withHistory(withReact(createEditor()))), [] ) diff --git a/site/examples/markdown-preview.tsx b/site/examples/markdown-preview.tsx index cfbabcc42b..0d6703f8fa 100644 --- a/site/examples/markdown-preview.tsx +++ b/site/examples/markdown-preview.tsx @@ -11,7 +11,7 @@ import { css } from 'emotion' const MarkdownPreviewExample = () => { const [value, setValue] = useState(initialValue) const renderLeaf = useCallback(props => , []) - const editor = useMemo(() => withReact(withHistory(createEditor())), []) + const editor = useMemo(() => withHistory(withReact(createEditor())), []) const decorate = useCallback(([node, path]) => { const ranges = [] diff --git a/site/examples/markdown-shortcuts.tsx b/site/examples/markdown-shortcuts.tsx index f1307f44a2..ffecace2bb 100644 --- a/site/examples/markdown-shortcuts.tsx +++ b/site/examples/markdown-shortcuts.tsx @@ -29,7 +29,7 @@ const MarkdownShortcutsExample = () => { const [value, setValue] = useState(initialValue) const renderElement = useCallback(props => , []) const editor = useMemo( - () => withReact(withShortcuts(withHistory(createEditor()))), + () => withShortcuts(withReact(withHistory(createEditor()))), [] ) return ( diff --git a/site/examples/mentions.tsx b/site/examples/mentions.tsx index 9935c87830..44d56e9891 100644 --- a/site/examples/mentions.tsx +++ b/site/examples/mentions.tsx @@ -21,7 +21,7 @@ const MentionExample = () => { const [search, setSearch] = useState('') const renderElement = useCallback(props => , []) const editor = useMemo( - () => withReact(withMentions(withHistory(createEditor()))), + () => withMentions(withReact(withHistory(createEditor()))), [] ) diff --git a/site/examples/plaintext.tsx b/site/examples/plaintext.tsx index bcd4a28062..9ba20dda7f 100644 --- a/site/examples/plaintext.tsx +++ b/site/examples/plaintext.tsx @@ -5,7 +5,7 @@ import { withHistory } from 'slate-history' const PlainTextExample = () => { const [value, setValue] = useState(initialValue) - const editor = useMemo(() => withReact(withHistory(createEditor())), []) + const editor = useMemo(() => withHistory(withReact(createEditor())), []) return ( setValue(value)}> diff --git a/site/examples/richtext.tsx b/site/examples/richtext.tsx index 99d3c92061..29bce988c2 100644 --- a/site/examples/richtext.tsx +++ b/site/examples/richtext.tsx @@ -25,7 +25,7 @@ const RichTextExample = () => { const [value, setValue] = useState(initialValue) const renderElement = useCallback(props => , []) const renderLeaf = useCallback(props => , []) - const editor = useMemo(() => withReact(withHistory(createEditor())), []) + const editor = useMemo(() => withHistory(withReact(createEditor())), []) return ( setValue(value)}> diff --git a/site/examples/scroll-into-view.tsx b/site/examples/scroll-into-view.tsx index 37a9d487d1..938a3e597c 100644 --- a/site/examples/scroll-into-view.tsx +++ b/site/examples/scroll-into-view.tsx @@ -50,7 +50,7 @@ const ScrollIntoViewExample = () => { const PlainTextEditor = () => { const [value, setValue] = useState(initialValue) - const editor = useMemo(() => withReact(withHistory(createEditor())), []) + const editor = useMemo(() => withHistory(withReact(createEditor())), []) return ( setValue(value)}> diff --git a/site/examples/search-highlighting.tsx b/site/examples/search-highlighting.tsx index c081b7069b..4731f9ed59 100644 --- a/site/examples/search-highlighting.tsx +++ b/site/examples/search-highlighting.tsx @@ -9,7 +9,7 @@ import { Icon, Toolbar } from '../components' const SearchHighlightingExample = () => { const [value, setValue] = useState(initialValue) const [search, setSearch] = useState() - const editor = useMemo(() => withReact(withHistory(createEditor())), []) + const editor = useMemo(() => withHistory(withReact(createEditor())), []) const decorate = useCallback( ([node, path]) => { const ranges = [] diff --git a/site/examples/shadow-dom.tsx b/site/examples/shadow-dom.tsx index e03c8509cb..30ee46bf40 100644 --- a/site/examples/shadow-dom.tsx +++ b/site/examples/shadow-dom.tsx @@ -29,7 +29,7 @@ const ShadowDOM = () => { const ShadowEditor = () => { const [value, setValue] = useState(initialValue) - const editor = useMemo(() => withReact(withHistory(createEditor())), []) + const editor = useMemo(() => withHistory(withReact(createEditor())), []) return ( setValue(value)}> diff --git a/site/examples/tables.tsx b/site/examples/tables.tsx index 085fdd1e38..7eee22d504 100644 --- a/site/examples/tables.tsx +++ b/site/examples/tables.tsx @@ -15,7 +15,7 @@ const TablesExample = () => { const renderElement = useCallback(props => , []) const renderLeaf = useCallback(props => , []) const editor = useMemo( - () => withReact(withTables(withHistory(createEditor()))), + () => withTables(withHistory(withReact(createEditor()))), [] ) return (