set save method for editora

editors/editoria/src/config/config.js

@@ -58,6 +58,10 @@ const updateTitle = title => {
   console.log(title);
 };
 
+const saveTags = tags => {
+  console.log(tags);
+};
+
 export default {
   MenuService: [
     {
@@ -135,6 +139,7 @@ export default {
       { label: 'custom-tag-label-3', tagType: 'block' },
       { label: 'label 2', tagType: 'block' },
     ],
+    // updateTags: saveTags,
   },
 
   services: [

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

@@ -80,6 +80,12 @@ const CustomTagBlockComponent = ({ isShowTag, item }) => {
     customTagsConfig && customTagsConfig.tags
       ? customTagsConfig.tags
       : initialArr;
+
+  const saveTags =
+    customTagsConfig && customTagsConfig.tags
+      ? customTagsConfig.updateTags
+      : () => true;
+
   const [allTags, setAllTags] = useState(configTags);
   const tagStatus = item.active(
     activeView.state,
@@ -105,9 +111,9 @@ const CustomTagBlockComponent = ({ isShowTag, item }) => {
 
   const onClickAdd = () => {
     if (inputValue.trim() === '') return;
-
     configTags.push({ label: inputValue, tagType: 'block' });
     setAllTags(configTags);
+    saveTags(configTags);
     setInputValue('');
     if (ref.current) ref.current.focus();
   };

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

-import React, { useMemo, useRef, useState } from 'react';
-import styled from 'styled-components';
-import MenuButton from '../../ui/buttons/MenuButton';
+import React, { useMemo, useState, useContext } from 'react';
+import { WaxContext } from 'wax-prosemirror-core';
 
-const Wrapper = styled.div`
-  font-size: 0;
-  position: relative;
-  z-index: 2;
-`;
+import MenuButton from '../../ui/buttons/MenuButton';
 
 const CustomTagInlineComponent = ({ view: { state }, item }) => {
   const { icon, title } = item;
@@ -14,7 +9,16 @@ const CustomTagInlineComponent = ({ view: { state }, item }) => {
   const [isOpen, setIsOpen] = useState(
     !!(localInline !== null && localInline !== false),
   );
-  const ref = useRef();
+
+  const {
+    view: { main },
+  } = useContext(WaxContext);
+
+  let isDisabled = false;
+  const isEditable = main.props.editable(editable => {
+    return editable;
+  });
+  if (!isEditable) isDisabled = true;
 
   const onClickIcon = () => {
     setIsOpen(isOpen !== true);
@@ -23,16 +27,13 @@ const CustomTagInlineComponent = ({ view: { state }, item }) => {
 
   return useMemo(
     () => (
-      <Wrapper ref={ref}>
-        <div onClick={onClickIcon}>
-          <MenuButton
-            active={isOpen}
-            disabled={false}
-            iconName={icon}
-            title={title}
-          />
-        </div>
-      </Wrapper>
+      <MenuButton
+        active={isOpen}
+        disabled={isDisabled}
+        iconName={icon}
+        onMouseDown={onClickIcon}
+        title={title}
+      />
     ),
     [isOpen],
   );

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

@@ -100,6 +100,10 @@ const CustomTagInlineOverlayComponent = ({ mark, setPosition, position }) => {
     customTagsConfig && customTagsConfig.tags
       ? customTagsConfig.tags
       : initialArr;
+  const saveTags =
+    customTagsConfig && customTagsConfig.tags
+      ? customTagsConfig.updateTags
+      : () => true;
   const [allTags, setAllTags] = useState(configTags);
 
   const onChangeTagName = () => {
@@ -117,6 +121,7 @@ const CustomTagInlineOverlayComponent = ({ mark, setPosition, position }) => {
 
     configTags.push({ label: inputValue, tagType: 'inline' });
     setAllTags(configTags);
+    saveTags(configTags);
     setInputValue('');
     if (ref.current) ref.current.focus();
     setInputValue('');

wax-prosemirror-components/src/ui/buttons/MenuButton.js

@@ -21,7 +21,6 @@ const disabledStyles = css`
 const activeStyles = css`
   background: ${th('colorPrimary')};
   color: ${th('colorTextReverse')};
-  pointer-events: none;
 
   > svg {
     fill: ${th('colorTextReverse')};

wax-prosemirror-plugins/src/images/captionPlugin.js

@@ -7,9 +7,7 @@ const captionPlugin = key =>
       init() {
         return DecorationSet.empty;
       },
-      apply(tr, set) {
-        console.log('in apply');
-      },
+      apply(tr, set) {},
     },
     props: {
       decorations(state) {