merges rte-crashing
This commit is contained in:
@@ -30,7 +30,7 @@
|
||||
"@faceless-ui/modal": "^1.0.4",
|
||||
"@faceless-ui/scroll-info": "^1.1.1",
|
||||
"@faceless-ui/window-info": "^1.2.2",
|
||||
"@udecode/slate-plugins": "^0.60.0",
|
||||
"@udecode/slate-plugins": "^0.64.3",
|
||||
"async-some": "^1.0.2",
|
||||
"autoprefixer": "^9.7.4",
|
||||
"babel-core": "^7.0.0-bridge.0",
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { useSlate, useFocused } from 'slate-react';
|
||||
import { ToolbarElement, ToolbarMark, ToolbarList } from '@udecode/slate-plugins';
|
||||
|
||||
|
||||
@@ -12,12 +12,12 @@ const H3Icon = () => {
|
||||
>
|
||||
<path
|
||||
fill="none"
|
||||
d="M0 0h24v24H0z"
|
||||
/>
|
||||
d="M.01 0h24v24h-24z"
|
||||
></path>
|
||||
<path
|
||||
className="fill"
|
||||
d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-4 8a2 2 0 01-2 2h-2v2h4v2H9v-4a2 2 0 012-2h2V9H9V7h4a2 2 0 012 2v2z"
|
||||
/>
|
||||
d="M19.01 3h-14c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-4 7.5c0 .83-.67 1.5-1.5 1.5.83 0 1.5.67 1.5 1.5V15a2 2 0 01-2 2h-4v-2h4v-2h-2v-2h2V9h-4V7h4a2 2 0 012 2v1.5z"
|
||||
></path>
|
||||
</svg>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -15,10 +15,10 @@ import {
|
||||
ListPlugin,
|
||||
ParagraphPlugin,
|
||||
pipe,
|
||||
ExitBreakPlugin,
|
||||
SoftBreakPlugin,
|
||||
StrikethroughPlugin,
|
||||
UnderlinePlugin,
|
||||
withList,
|
||||
withToggleType,
|
||||
} from '@udecode/slate-plugins';
|
||||
|
||||
@@ -63,7 +63,6 @@ const plugins = [
|
||||
const withPlugins = [
|
||||
withReact,
|
||||
withHistory,
|
||||
withList(nodeTypes),
|
||||
withToggleType({ defaultType: nodeTypes.typeP }),
|
||||
];
|
||||
|
||||
@@ -101,19 +100,6 @@ const RichText = (props) => {
|
||||
errorMessage,
|
||||
} = fieldType;
|
||||
|
||||
const [internalState, setInternalState] = useState(value);
|
||||
const [valueHasLoaded, setValueHasLoaded] = useState(false);
|
||||
|
||||
useEffect(() => { setValue(internalState); }, [setValue, internalState]);
|
||||
|
||||
useEffect(() => {
|
||||
// ! could use review
|
||||
if (value !== undefined && !valueHasLoaded) {
|
||||
setInternalState(value);
|
||||
setValueHasLoaded(true);
|
||||
}
|
||||
}, [value, valueHasLoaded]);
|
||||
|
||||
const classes = [
|
||||
baseClass,
|
||||
'field-type',
|
||||
@@ -141,8 +127,8 @@ const RichText = (props) => {
|
||||
<div className={`${baseClass}__wrapper`}>
|
||||
<Slate
|
||||
editor={editor}
|
||||
value={internalState ?? emptyRichTextNode}
|
||||
onChange={(val) => setInternalState(val)}
|
||||
value={value ?? emptyRichTextNode}
|
||||
onChange={val => setValue(val)}
|
||||
>
|
||||
<CommandToolbar enabledPluginList={plugins} />
|
||||
|
||||
|
||||
@@ -1,11 +1,29 @@
|
||||
import {
|
||||
ACTION_ITEM,
|
||||
BLOCKQUOTE,
|
||||
CODE_BLOCK,
|
||||
HeadingType,
|
||||
IMAGE,
|
||||
LINK,
|
||||
ListType,
|
||||
ELEMENT_PARAGRAPH,
|
||||
ELEMENT_MENTION,
|
||||
ELEMENT_BLOCKQUOTE,
|
||||
ELEMENT_CODE_BLOCK,
|
||||
ELEMENT_LINK,
|
||||
ELEMENT_IMAGE,
|
||||
ELEMENT_MEDIA_EMBED,
|
||||
ELEMENT_TODO_LI,
|
||||
ELEMENT_H1,
|
||||
ELEMENT_H2,
|
||||
ELEMENT_H3,
|
||||
ELEMENT_H4,
|
||||
ELEMENT_H5,
|
||||
ELEMENT_H6,
|
||||
ELEMENT_ALIGN_LEFT,
|
||||
ELEMENT_ALIGN_CENTER,
|
||||
ELEMENT_ALIGN_RIGHT,
|
||||
ELEMENT_UL,
|
||||
ELEMENT_OL,
|
||||
ELEMENT_LI,
|
||||
ELEMENT_TABLE,
|
||||
ELEMENT_TH,
|
||||
ELEMENT_TR,
|
||||
ELEMENT_TD,
|
||||
|
||||
MARK_BOLD,
|
||||
MARK_CODE,
|
||||
MARK_HIGHLIGHT,
|
||||
@@ -15,43 +33,31 @@ import {
|
||||
MARK_SUBSCRIPT,
|
||||
MARK_SUPERSCRIPT,
|
||||
MARK_UNDERLINE,
|
||||
MEDIA_EMBED,
|
||||
MENTION,
|
||||
PARAGRAPH,
|
||||
TableType,
|
||||
} from '@udecode/slate-plugins';
|
||||
|
||||
export const headingTypes = [
|
||||
HeadingType.H1,
|
||||
HeadingType.H2,
|
||||
HeadingType.H3,
|
||||
HeadingType.H4,
|
||||
HeadingType.H5,
|
||||
HeadingType.H6,
|
||||
];
|
||||
|
||||
export const nodeTypes = {
|
||||
// elements
|
||||
typeP: PARAGRAPH,
|
||||
typeMention: MENTION,
|
||||
typeBlockquote: BLOCKQUOTE,
|
||||
typeCodeBlock: CODE_BLOCK,
|
||||
typeLink: LINK,
|
||||
typeImg: IMAGE,
|
||||
typeMediaEmbed: MEDIA_EMBED,
|
||||
typeActionItem: ACTION_ITEM,
|
||||
typeTable: TableType.TABLE,
|
||||
typeTr: TableType.ROW,
|
||||
typeTd: TableType.CELL,
|
||||
typeUl: ListType.UL,
|
||||
typeOl: ListType.OL,
|
||||
typeLi: ListType.LI,
|
||||
typeH1: HeadingType.H1,
|
||||
typeH2: HeadingType.H2,
|
||||
typeH3: HeadingType.H3,
|
||||
typeH4: HeadingType.H4,
|
||||
typeH5: HeadingType.H5,
|
||||
typeH6: HeadingType.H6,
|
||||
typeP: ELEMENT_PARAGRAPH,
|
||||
typeMention: ELEMENT_MENTION,
|
||||
typeBlockquote: ELEMENT_BLOCKQUOTE,
|
||||
typeCodeBlock: ELEMENT_CODE_BLOCK,
|
||||
typeLink: ELEMENT_LINK,
|
||||
typeImg: ELEMENT_IMAGE,
|
||||
typeMediaEmbed: ELEMENT_MEDIA_EMBED,
|
||||
typeTodoLi: ELEMENT_TODO_LI,
|
||||
typeTable: ELEMENT_TABLE,
|
||||
typeTh: ELEMENT_TH,
|
||||
typeTr: ELEMENT_TR,
|
||||
typeTd: ELEMENT_TD,
|
||||
typeUl: ELEMENT_UL,
|
||||
typeOl: ELEMENT_OL,
|
||||
typeLi: ELEMENT_LI,
|
||||
typeH1: ELEMENT_H1,
|
||||
typeH2: ELEMENT_H2,
|
||||
typeH3: ELEMENT_H3,
|
||||
typeH4: ELEMENT_H4,
|
||||
typeH5: ELEMENT_H5,
|
||||
typeH6: ELEMENT_H6,
|
||||
// marks
|
||||
typeBold: MARK_BOLD,
|
||||
typeItalic: MARK_ITALIC,
|
||||
|
||||
Reference in New Issue
Block a user