From 8cf28d61febba8b498d915359a0d169f7389c264 Mon Sep 17 00:00:00 2001
From: chris <kokosias@yahoo.gr>
Date: Sun, 7 Feb 2021 18:52:55 +0200
Subject: [PATCH] set disabled
---
.../customtag/CustomTagBlockComponent.js | 50 +++++++++++++++----
.../CustomTagBlockTool.js | 5 ++
2 files changed, 45 insertions(+), 10 deletions(-)
diff --git a/wax-prosemirror-components/src/components/customtag/CustomTagBlockComponent.js b/wax-prosemirror-components/src/components/customtag/CustomTagBlockComponent.js
index a95794e80..a20cafc36 100644
--- a/wax-prosemirror-components/src/components/customtag/CustomTagBlockComponent.js
+++ b/wax-prosemirror-components/src/components/customtag/CustomTagBlockComponent.js
@@ -35,10 +35,29 @@ const CustomTagList = styled.div`
flex-direction: column;
button {
- margin-top: 5px;
+ border-radius: 4px;
+ left: -33px;
+ margin-left: 4px;
+ padding-left: 25px;
+ position: relative;
}
`;
+const ListWrapper = styled.div`
+ display: flex;
+`;
+
+const Box = styled.div`
+ background: #bfc4cd;
+ border-radius: 4px;
+ height: 22px;
+ position: relative;
+ right: 3px;
+ top: 3px;
+ width: 22px;
+ z-index: 999;
+`;
+
const CustomTagBlockComponent = ({ isShowTag, item }) => {
const ref = useRef();
const [inputValue, setInputValue] = useState('');
@@ -63,6 +82,13 @@ const CustomTagBlockComponent = ({ isShowTag, item }) => {
allTags,
);
+ const isEditable = main.props.editable(editable => {
+ return editable;
+ });
+
+ let isDisabled = !item.select(state, activeViewId, activeView);
+ if (!isEditable) isDisabled = true;
+
const onChangeTagName = () => {
setInputValue(ref.current.value);
};
@@ -87,14 +113,18 @@ const CustomTagBlockComponent = ({ isShowTag, item }) => {
blockTags.forEach(blockTag => {
tagList.push(
- <MenuButton
- active={tagStatus[blockTag.label]}
- disabled={false}
- key={uuidv4()}
- label={blockTag.label}
- onMouseDown={() => onSelectTag(blockTag.label)}
- title={blockTag.label}
- />,
+ <ListWrapper>
+ <Box />
+ <MenuButton
+ active={tagStatus[blockTag.label]}
+ disabled={isDisabled}
+ key={uuidv4()}
+ label={blockTag.label}
+ onMouseDown={() => onSelectTag(blockTag.label)}
+ title={blockTag.label}
+ />
+ ,
+ </ListWrapper>,
);
});
return <CustomTagList>{tagList}</CustomTagList>;
@@ -117,7 +147,7 @@ const CustomTagBlockComponent = ({ isShowTag, item }) => {
{renderTagList()}
</>
),
- [isShowTag, inputValue, tagStatus],
+ [isShowTag, inputValue, tagStatus, isDisabled],
);
};
diff --git a/wax-prosemirror-services/src/CustomTagService/CustomTagBlockService/CustomTagBlockTool.js b/wax-prosemirror-services/src/CustomTagService/CustomTagBlockService/CustomTagBlockTool.js
index 8c0496003..c53581338 100644
--- a/wax-prosemirror-services/src/CustomTagService/CustomTagBlockService/CustomTagBlockTool.js
+++ b/wax-prosemirror-services/src/CustomTagService/CustomTagBlockService/CustomTagBlockTool.js
@@ -35,6 +35,11 @@ class CustomTagBlockTool extends Tools {
return tagsActive;
};
}
+
+ select = (state, activeViewId) => {
+ if (activeViewId !== 'main') return false;
+ return true;
+ };
}
export default CustomTagBlockTool;
--
GitLab