diff --git a/.eslintrc.js b/.eslintrc.js
index 816f4b09f35a17ef9031b053fb125038ac992104..0b9660367fc43d434456378fc96fca932bae91ba 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -22,7 +22,8 @@ eslint.parserOptions = {
};
eslint.rules = {
- 'sort-keys': 'off',
+ 'class-methods-use-this': [1, { exceptMethods: ['run', 'enable', 'active'] }],
+ // 'import/no-named-as-default': 0,
'import/no-extraneous-dependencies': [
'error',
{
@@ -30,8 +31,6 @@ eslint.rules = {
},
],
'react/jsx-filename-extension': [1, { extensions: ['.js', '.jsx'] }],
- 'class-methods-use-this': [1, { exceptMethods: ['run', 'enable', 'active'] }],
-
'react/prop-types': [
2,
{
@@ -45,7 +44,7 @@ eslint.rules = {
],
},
],
- // 'import/no-named-as-default': 0,
+ 'sort-keys': 'off',
};
module.exports = eslint;
diff --git a/wax-prosemirror-components/src/components/Button.js b/wax-prosemirror-components/src/components/Button.js
index 4f6fe323be2b90a6d93bb58bf6f37bab9fe1b984..7f6ec04c5010ab201202c7ec203764fcd8c66753 100644
--- a/wax-prosemirror-components/src/components/Button.js
+++ b/wax-prosemirror-components/src/components/Button.js
@@ -1,22 +1,7 @@
import React, { useContext } from 'react';
-// import styled from 'styled-components';
-// import { ButtonStyles } from 'wax-prosemirror-themes';
import { WaxContext } from 'wax-prosemirror-core';
import MenuButton from '../ui/buttons/MenuButton';
-// const ButtonStyled = styled.button`
-// ${ButtonStyles};
-// opacity: ${props => (props.select ? 1 : 0.4)};
-// pointer-events: ${props => (props.select ? 'default' : 'none')};
-// color: ${props => (props.isActive ? 'white' : props.theme.colorButton)};
-// background-color: ${props =>
-// props.isActive ? props.theme.colorPrimary : 'transparent'};
-// &:hover {
-// background-color: ${props =>
-// props.isActive ? props.theme.colorPrimary : 'transparent'};
-// }
-// `;
-
const Button = ({ view = {}, item }) => {
const { active, enable, icon, label, onlyOnMain, run, select, title } = item;
@@ -37,7 +22,7 @@ const Button = ({ view = {}, item }) => {
const isActive = active && active(state);
const isDisabled =
- enable && !enable(state) && select && select(view.state, activeViewId);
+ enable && !enable(state) && !(select && select(view.state, activeViewId));
return (
<MenuButton
diff --git a/wax-prosemirror-components/src/components/ImageUpload.js b/wax-prosemirror-components/src/components/ImageUpload.js
index 48e78c9319b9851de66883f1e2f0cf86d60c4686..f34fca7bc4131967f0f6b1999c1c4c45c3449c82 100644
--- a/wax-prosemirror-components/src/components/ImageUpload.js
+++ b/wax-prosemirror-components/src/components/ImageUpload.js
@@ -5,19 +5,12 @@ import styled from 'styled-components';
import MenuButton from '../ui/buttons/MenuButton';
-const UploadImage = styled.div`
- /* opacity: ${props => (props.select ? 1 : 0.4)};
- pointer-events: ${props => (props.select ? 'default' : 'none')};
- display: inline-flex;
- padding: 0px 10px; */
-
+const Wrapper = styled.div`
input {
display: none;
}
`;
-// TO DO -- select should be done with MenuButton's disabled prop
-
const ImageUpload = ({ item, fileUpload, view }) => {
const { activeViewId } = useContext(WaxContext);
@@ -25,7 +18,7 @@ const ImageUpload = ({ item, fileUpload, view }) => {
const handleMouseDown = () => inputRef.current.click();
return (
- <UploadImage>
+ <Wrapper>
<label htmlFor="file-upload">
<MenuButton
active={false}
@@ -42,7 +35,7 @@ const ImageUpload = ({ item, fileUpload, view }) => {
type="file"
/>
</label>
- </UploadImage>
+ </Wrapper>
);
};
export default ImageUpload;
diff --git a/wax-prosemirror-components/src/components/tables/CreateTable.js b/wax-prosemirror-components/src/components/tables/CreateTable.js
index 2285e72007c59506ed137a539f73896e1b2f2534..aaac04e050c2a46d0f6f70cee277e58f1f074408 100644
--- a/wax-prosemirror-components/src/components/tables/CreateTable.js
+++ b/wax-prosemirror-components/src/components/tables/CreateTable.js
@@ -1,90 +1,43 @@
-/* eslint react/prop-types: 0 */
import React, { useState, useContext } from 'react';
-// import styled from 'styled-components';
-// import { ButtonStyles } from 'wax-prosemirror-themes';
import { WaxContext } from 'wax-prosemirror-core';
import Dropdown from '../../ui/buttons/Dropdown';
import InsertTableTool from '../../ui/tables/InsertTableTool';
-// const ButtonStyled = styled.button`
-// ${ButtonStyles};
-// opacity: ${props => (props.select ? 1 : 0.4)};
-// pointer-events: ${props => (props.select ? 'default' : 'none')};
-// color: ${props => (props.isActive ? 'white' : props.theme.colorButton)};
-// background-color: ${props =>
-// props.isActive ? props.theme.colorPrimary : 'transparent'};
-// &:hover {
-// background-color: ${props =>
-// props.isActive ? props.theme.colorPrimary : 'transparent'};
-// }
-// `;
-
-// const InsertTableToolContainer = styled.div`
-// display: block !important;
-// height: auto;
-// top: 53px;
-// left: 556px;
-// position: absolute;
-// `;
-
const CreateTable = ({ view = {}, item }) => {
const {
view: { main },
- // activeViewId,
+ activeViewId,
} = useContext(WaxContext);
if (item.onlyOnMain) {
view = main;
}
+ const [showTool, setShowTool] = useState(false);
+ const toggleShowTool = () => setShowTool(!showTool);
+
const { state, dispatch } = view;
- const [isTableToolDisplayed, setTableToolDisplay] = useState(false);
+ const { enable, icon, run, select, title } = item;
+
+ const dropComponent = (
+ <InsertTableTool
+ onGridSelect={colRows => {
+ run(colRows, state, dispatch);
+ }}
+ />
+ );
- // const CreateButton = (
- // <ButtonStyled
- // type="button"
- // isActive={isTableToolDisplayed}
- // title={item.title}
- // disabled={item.enable && !item.enable(view.state)}
- // onMouseDown={e => {
- // e.preventDefault();
- // setTableToolDisplay(!isTableToolDisplayed);
- // }}
- // select={item.select && item.select(view.state, activeViewId)}
- // >
- // {item.content}
- // </ButtonStyled>
- // );
- // return isTableToolDisplayed ? (
- // <>
- // {CreateButton}
- // <InsertTableToolContainer>
- // <InsertTableTool
- // onGridSelect={colRows => {
- // item.run(colRows, state, dispatch);
- // }}
- // />
- // </InsertTableToolContainer>
- // </>
- // ) : (
- // <>{CreateButton}</>
- // );
+ const isDisabled =
+ enable && !enable(state) && !(select && select(state, activeViewId));
- // select pending
return (
<Dropdown
- active={isTableToolDisplayed}
- dropComponent={
- <InsertTableTool
- onGridSelect={colRows => {
- item.run(colRows, state, dispatch);
- }}
- />
- }
- iconName={item.icon}
- disabled={item.enable && !item.enable(view.state)}
- onClick={() => setTableToolDisplay(!isTableToolDisplayed)}
- title={item.title}
+ active={showTool}
+ dropComponent={dropComponent}
+ iconName={icon}
+ disabled={isDisabled}
+ onClick={toggleShowTool}
+ title={title}
/>
);
};
diff --git a/wax-prosemirror-components/src/ui/buttons/Dropdown.js b/wax-prosemirror-components/src/ui/buttons/Dropdown.js
index 241820d81aad56d48a2080225ad1ea3972885e6e..617302671b65fff39958250c2123dc0e075d3300 100644
--- a/wax-prosemirror-components/src/ui/buttons/Dropdown.js
+++ b/wax-prosemirror-components/src/ui/buttons/Dropdown.js
@@ -17,7 +17,7 @@ const DropWrapper = styled.div`
`;
const Dropdown = props => {
- const { className, dropComponent, iconName, label, title } = props;
+ const { className, disabled, dropComponent, iconName, label, title } = props;
const [isOpen, setIsOpen] = useState(false);
@@ -27,6 +27,7 @@ const Dropdown = props => {
<Wrapper className={className}>
<MenuButton
active={isOpen}
+ disabled={disabled}
iconName={iconName}
label={label}
onMouseDown={() => setIsOpen(!isOpen)}
@@ -39,6 +40,7 @@ const Dropdown = props => {
};
Dropdown.propTypes = {
+ disabled: PropTypes.bool,
dropComponent: PropTypes.node.isRequired,
iconName: PropTypes.string,
label: PropTypes.string,
@@ -46,6 +48,7 @@ Dropdown.propTypes = {
};
Dropdown.defaultProps = {
+ disabled: false,
iconName: null,
label: null,
title: null,
diff --git a/wax-prosemirror-services/src/NoteService/Note.js b/wax-prosemirror-services/src/NoteService/Note.js
index 8613909594ca923187b61471585cf60c0654de2a..4614ba2d17bc58247a6eb177e6863f68ff8e0c4f 100644
--- a/wax-prosemirror-services/src/NoteService/Note.js
+++ b/wax-prosemirror-services/src/NoteService/Note.js
@@ -36,7 +36,7 @@ class Note extends Tools {
get enable() {
return state => {
- return true;
+ return false;
};
}
}
diff --git a/wax-prosemirror-services/src/WaxToolGroups/DisplayTextToolGroupService/DisplayText.js b/wax-prosemirror-services/src/WaxToolGroups/DisplayTextToolGroupService/DisplayText.js
index df6bb97bf00bb6377685c7fc4bb9e7fd8eedd9db..481200f5b7fccfc4441436604e9b52cb3bab2143 100644
--- a/wax-prosemirror-services/src/WaxToolGroups/DisplayTextToolGroupService/DisplayText.js
+++ b/wax-prosemirror-services/src/WaxToolGroups/DisplayTextToolGroupService/DisplayText.js
@@ -33,13 +33,10 @@ class DisplayText extends ToolGroup {
icon: 'title',
component: (
<BlockLevelTools
- groups={this._toolGroups[0].groups.map(group => {
- console.log(group);
- return {
- groupName: group.title.props.title,
- items: group._tools,
- };
- })}
+ groups={this._toolGroups[0].groups.map(group => ({
+ groupName: group.title.props.title,
+ items: group._tools,
+ }))}
view={view}
/>
),