new services files

editors/demo/src/Editoria/config/config.js

@@ -113,6 +113,7 @@ export default {
         'HighlightToolGroup',
         'TransformToolGroup',
         'CustomTagInline',
+        'CustomTagBlock',
         'Notes',
         'Lists',
         'Images',

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

+import { Service } from 'wax-prosemirror-core';
+import customBlockNode from '../CustomTagBlockService/schema/customBlockNode';
+import CustomTagBlockNewTool from './CustomTagBlockNewTool';
+
+class CustomTagBlockNewService extends Service {
+  register() {
+    this.container.bind('CustomTagBlockNewTool').to(CustomTagBlockNewTool);
+    const createNode = this.container.get('CreateNode');
+    createNode(
+      {
+        customTagBlock: customBlockNode,
+      },
+      { toWaxSchema: true },
+    );
+  }
+}
+
+export default CustomTagBlockNewService;

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

+import React from 'react';
+import { isEmpty } from 'lodash';
+import { Commands, Tools } from 'wax-prosemirror-core';
+import CustomBlockDropDownComponent from '../components/CustomBlockDropDownComponent';
+
+class CustomTagBlockNewTool extends Tools {
+  title = 'Custom Tag Block';
+  name = 'CustomTagBlock';
+
+  get run() {
+    return (state, dispatch, val) => {
+      Commands.setBlockType(state.config.schema.nodes.customTagBlock, {
+        class: val.replace(/ /g, '-').toLowerCase(),
+      })(state, dispatch);
+    };
+  }
+
+  get active() {
+    return (state, activeViewId, className, allTags) => {
+      const isActive = Commands.customTagBlockActive(
+        state.config.schema.nodes.customTagBlock,
+        { class: className },
+      )(state);
+
+      const blockTags = allTags.filter(tag => {
+        return tag.tagType === 'block';
+      });
+
+      const tagsActive = {};
+      blockTags.forEach(tag => {
+        if (
+          isActive &&
+          className === tag.label.replace(/ /g, '-').toLowerCase()
+        ) {
+          tagsActive[tag.label] = true;
+        } else {
+          tagsActive[tag.label] = false;
+        }
+      });
+      return tagsActive;
+    };
+  }
+
+  select = (state, activeViewId) => {
+    if (activeViewId !== 'main') return false;
+    return true;
+  };
+
+  renderTool(view) {
+    if (isEmpty(view)) return null;
+    return this.isDisplayed() ? (
+      <CustomBlockDropDownComponent
+        item={this.toJSON()}
+        key="Save"
+        view={view}
+      />
+    ) : null;
+  }
+}
+
+export default CustomTagBlockNewTool;

wax-prosemirror-services/src/CustomTagService/CustomTagToolGroupService/CustomTagBlockNewToolGroupService/CustomTagBlockNewToolGroup.js

+import { injectable, inject } from 'inversify';
+import { ToolGroup } from 'wax-prosemirror-core';
+
+@injectable()
+class CustomTagBlockToolGroup extends ToolGroup {
+  tools = [];
+  title = 'Custom Block';
+
+  constructor(@inject('CustomTagBlockNewTool') customTagBlockNewTool) {
+    super();
+    this.tools = [customTagBlockNewTool];
+  }
+}
+
+export default CustomTagBlockToolGroup;

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

+import { Service } from 'wax-prosemirror-core';
+import CustomTagBlockNewToolGroup from './CustomTagBlockNewToolGroup';
+
+class CustomTagBlockNewToolGroupService extends Service {
+  register() {
+    this.container.bind('CustomTagBlock').to(CustomTagBlockNewToolGroup);
+  }
+}
+
+export default CustomTagBlockNewToolGroupService;

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

+import React from 'react';
+
+const CustomBlockDropDownComponent = ({ view, tools }) => {
+  return <span>hi</span>;
+};
+
+export default CustomBlockDropDownComponent;

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

 import CustomTagBlockService from './CustomTagBlockService/CustomTagBlockService';
+import CustomTagBlockNewService from './CustomTagBlockNewService/CustomTagBlockNewService';
 import CustomTagInlineService from './CustomTagInlineService/CustomTagInlineService';
 import CustomTagBlockToolGroupService from './CustomTagToolGroupService/CustomTagBlockToolGroupService/CustomTagBlockToolGroupService';
 import CustomTagInlineToolGroupService from './CustomTagToolGroupService/CustomTagInlineToolGroupService/CustomTagInlineToolGroupService';
+import CustomTagBlockNewToolGroupService from './CustomTagToolGroupService/CustomTagBlockNewToolGroupService/CustomTagBlockNewToolGroupService';
 
 export default [
+  new CustomTagBlockNewService(),
   new CustomTagBlockService(),
   new CustomTagInlineService(),
   new CustomTagBlockToolGroupService(),
   new CustomTagInlineToolGroupService(),
+  new CustomTagBlockNewToolGroupService(),
 ];

wax-prosemirror-services/src/WaxToolGroups/BlockDropDownToolGroupService/BlockDropDownComponent.js

@@ -110,11 +110,6 @@ const BlockDropDownComponent = ({ view, tools }) => {
       value: '8',
       item: tools[8],
     },
-    // {
-    //   label: translatedLabel(`Wax.BlockLevel.Block Quote`, 'Block Quote'),
-    //   value: '13',
-    //   item: tools[13],
-    // },
   ];
 
   const { app } = useContext(ApplicationContext);