migrate slate-plugins to newest version, dropping peer dep of styled-components

src/client/components/forms/field-types/RichText/icons/Headings/H3/index.js

@@ -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>
   );
 };

src/client/components/forms/field-types/RichText/index.js

@@ -19,7 +19,6 @@ import {
   SoftBreakPlugin,
   StrikethroughPlugin,
   UnderlinePlugin,
-  withList,
   withToggleType,
 } from '@udecode/slate-plugins';
 
@@ -64,7 +63,6 @@ const plugins = [
 const withPlugins = [
   withReact,
   withHistory,
-  withList(nodeTypes),
   withToggleType({ defaultType: nodeTypes.typeP }),
 ];
 

src/client/components/forms/field-types/RichText/types/index.js

@@ -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,