feat(custom-tag-block): added custom-tag-block

editors/editoria/src/config/config.js

@@ -42,8 +42,8 @@ import {
   TrackCommentOptionsToolGroupService,
   CustomTagInlineService,
   CustomTagInlineToolGroupService,
-  CustomTagBlockService,
   CustomTagBlockToolGroupService,
+  CustomTagService,
 } from 'wax-prosemirror-services';
 
 import { DefaultSchema } from 'wax-prosemirror-utilities';
@@ -172,9 +172,8 @@ export default {
     new TransformToolGroupService(),
     new TrackOptionsToolGroupService(),
     new TrackCommentOptionsToolGroupService(),
+    new CustomTagService(),
     new CustomTagInlineToolGroupService(),
-    new CustomTagInlineService(),
-    new CustomTagBlockService(),
     new CustomTagBlockToolGroupService(),
   ],
 };

editors/editoria/src/config/configMobile.js

@@ -31,10 +31,9 @@ import {
   BottomInfoService,
   TransformService,
   TransformToolGroupService,
-  CustomTagInlineService,
   CustomTagInlineToolGroupService,
-  CustomTagBlockService,
   CustomTagBlockToolGroupService,
+  CustomTagService,
 } from 'wax-prosemirror-services';
 
 import { WaxSelectionPlugin } from 'wax-prosemirror-plugins';
@@ -124,9 +123,8 @@ export default {
     new BottomInfoService(),
     new TransformService(),
     new TransformToolGroupService(),
+    new CustomTagService(),
     new CustomTagInlineToolGroupService(),
-    new CustomTagInlineService(),
-    new CustomTagBlockService(),
     new CustomTagBlockToolGroupService(),
   ],
 };

wax-prosemirror-components/src/components/customtag/CustomTagBlockComponent.js

 import React, { useContext, useMemo, useRef, useState } from 'react';
 import styled from 'styled-components';
 import { WaxContext } from 'wax-prosemirror-core';
-import { DocumentHelpers } from 'wax-prosemirror-utilities';
-import { selectParentNode } from 'prosemirror-commands';
-import { node } from 'prop-types';
+import { Commands } from 'wax-prosemirror-utilities';
 
 const Wrapper = styled.div``;
 
@@ -82,22 +80,10 @@ const CustomTagBlockComponent = (isIconClicked) => {
   }
 
   const onSelectTag = (e, item) => {
-
-    const $pos = main.state.tr.doc.resolve($from.pos);
-    const $topos = main.state.tr.doc.resolve($to.pos);
-    const startPos = $pos.start();
-    const endPos = $topos.end();
-
-    dispatch(
-      state.tr.addMark(
-        startPos,
-        endPos,
-        state.schema.marks.customTagBlock.create({
-          tagName: item,
-          class: 'custom-tag-block',
-        }),
-      ),
-    );
+    item = item.replace(/ /g, "-");
+    Commands.setBlockType(state.config.schema.nodes.customTagBlock, {
+      class: 'custom-tag-block ' + item
+    })(state, dispatch);
   }
 
   return useMemo(

wax-prosemirror-components/src/ui/tabs/BlockElement.js

@@ -27,7 +27,6 @@ const Box = styled.div`
 
 const BlockElement = props => {
   const { item, onClick, view } = props;
-console.log('item : ', item);
   return (
     <Wrapper onClick={onClick}>
       <Box />

wax-prosemirror-schema/index.js

@@ -16,7 +16,6 @@ export { default as mathSelectMark } from './src/marks/mathSelectMark';
 export { default as highlightMark } from './src/marks/highlightMark';
 export { default as transformMark } from './src/marks/transformMark';
 export { default as customtagInlineMark } from './src/marks/customTagInlineMark';
-export { default as customtagBlockMark } from './src/marks/customTagBlockMark';
 /*
 LIST OF TRACK CHANGES MARKS
 */
@@ -46,6 +45,7 @@ export { default as footNoteNode } from './src/nodes/footNoteNode';
 export { default as codeBlockNode } from './src/nodes/codeBlockNode';
 export { default as mathInlineNode } from './src/nodes/mathInlineNode';
 export { default as mathDisplayNode } from './src/nodes/mathDisplayNode';
+export { default as customBlockNode } from './src/nodes/customBlockNode';
 /*
 LIST OF TRACK CHANGES NODES
 */

wax-prosemirror-schema/src/nodes/customBlockNode.js

+const customBlockNode = {
+  content: "inline*",
+  group: "block",
+  priority: 0,
+  defining: true,
+  attrs: {
+    class: { default: "custom-tag-block" }
+  },
+  parseDOM: [
+    {
+      tag: "custom-tag-block",
+      getAttrs(hook, next) {
+        Object.assign(hook, {
+          class: hook.dom.getAttribute("class")
+        });
+        next();
+      }
+    }
+  ],
+  toDOM(hook, next) {
+   const attrs = { class: hook.attrs.class };
+   return hook.value = ["custom-tag-block", attrs, 0];
+  }
+};
+
+export default customBlockNode;

wax-prosemirror-services/index.js

@@ -38,6 +38,7 @@ export { default as EditingSuggestingService } from './src/EditingSuggestingServ
 export { default as TrackOptionsService } from './src/TrackOptionsService/TrackOptionsService';
 export { default as CustomTagInlineService } from './src/CustomTagService/CustomTagInlineService/CustomTagInlineService';
 export { default as CustomTagBlockService } from './src/CustomTagService/CustomTagBlockService/CustomTagBlockService';
+export { default as CustomTagService } from './src/CustomTagService/CustomTagService';
 
 /*
 ToolGroups

wax-prosemirror-services/src/CustomTagService/CustomTagBlockService/CustomTagBlockService.js

 import CustomTagBlockTool from './CustomTagBlockTool';
 import Service from '../../Service';
-import { customtagBlockMark } from 'wax-prosemirror-schema';
+import { customBlockNode } from 'wax-prosemirror-schema';
+
+
+class CustomTagBlockService extends Service {
 
-export default class CustomTagBlockService extends Service {
-  
   register() {
     this.container.bind('CustomTagBlockTool').to(CustomTagBlockTool);
-    const createMark = this.container.get('CreateMark');
-    createMark(
+    const createNode = this.container.get('CreateNode');
+    createNode(
       {
-        customTagBlock: customtagBlockMark,
-      },
-      { toWaxSchema: true },
+        customTagBlock: customBlockNode,
+      }
     );
   }
-}
\ No newline at end of file
+
+}
+
+export default CustomTagBlockService;
\ No newline at end of file

wax-prosemirror-services/src/CustomTagService/CustomTagInlineService/CustomTagInlineService.js

@@ -2,9 +2,8 @@ import CustomTagInlineTool from './CustomTagInlineTool';
 import Service from '../../Service';
 import { CustomTagInlineOverlayComponent } from 'wax-prosemirror-components';
 import { customtagInlineMark } from 'wax-prosemirror-schema';
-import { WaxContext } from 'wax-prosemirror-core';
 
-export default class CustomTagInlineService extends Service {
+class CustomTagInlineService extends Service {
 
   boot() {
     const createOverlay = this.container.get('CreateOverlay');
@@ -19,7 +18,7 @@ export default class CustomTagInlineService extends Service {
     );
   }
 
-  
+
   register() {
     this.container.bind('CustomTagInlineTool').to(CustomTagInlineTool);
     const createMark = this.container.get('CreateMark');
@@ -30,4 +29,7 @@ export default class CustomTagInlineService extends Service {
       { toWaxSchema: true },
     );
   }
-}
\ No newline at end of file
+}
+
+
+export default CustomTagInlineService;
\ No newline at end of file

wax-prosemirror-services/src/CustomTagService/CustomTagService.js

+import Service from '../Service';
+import CustomService from './index';
+
+class CustomTagService extends Service {
+  dependencies = CustomService;
+}
+
+export default CustomTagService;
\ No newline at end of file

wax-prosemirror-services/src/CustomTagService/index.js

+import CustomTagBlockService from "./CustomTagBlockService/CustomTagBlockService";
+import CustomTagInlineService from "./CustomTagInlineService/CustomTagInlineService";
+
+
+export default [
+  new CustomTagBlockService(),
+  new CustomTagInlineService()
+];
\ No newline at end of file