diff --git a/wax-prosemirror-services/src/MatchingService/components/DropDownComponent.js b/wax-prosemirror-services/src/MatchingService/components/DropDownComponent.js index 107c1e0c5cdfce3f96af702f8f92195283dfb21c..7446e0e732d3a0f9c2f600dd3977268f5cacd9ae 100644 --- a/wax-prosemirror-services/src/MatchingService/components/DropDownComponent.js +++ b/wax-prosemirror-services/src/MatchingService/components/DropDownComponent.js @@ -15,8 +15,6 @@ import { Icon, useOnClickOutside, } from 'wax-prosemirror-core'; -import Dropdown from 'react-dropdown'; -import { v4 as uuidv4 } from 'uuid'; const Wrapper = styled.div` opacity: ${props => (props.disabled ? '0.4' : '1')}; diff --git a/wax-prosemirror-services/src/MatchingService/components/DropDownComponent1.js b/wax-prosemirror-services/src/MatchingService/components/DropDownComponent1.js deleted file mode 100644 index cc2f3d4502687b273b88bae79f9df24326ce4bda..0000000000000000000000000000000000000000 --- a/wax-prosemirror-services/src/MatchingService/components/DropDownComponent1.js +++ /dev/null @@ -1,100 +0,0 @@ -/* eslint-disable no-underscore-dangle */ -import React, { useContext, useMemo, useState } from 'react'; -import styled from 'styled-components'; -import { - WaxContext, - DocumentHelpers, - ReactDropDownStyles, -} from 'wax-prosemirror-core'; -import Dropdown from 'react-dropdown'; -import { v4 as uuidv4 } from 'uuid'; - -const Wrapper = styled.div` - ${ReactDropDownStyles}; -`; -const DropdownStyled = styled(Dropdown)` - cursor: not-allowed; - display: inline-flex; - margin-left: auto; - opacity: ${props => (props.select ? 1 : 0.4)}; - pointer-events: ${props => (props.select ? 'default' : 'none')}; - - .Dropdown-control { - border: none; - padding: 8px 30px 8px 10px; - - &:hover { - box-shadow: none; - } - } - - .Dropdown-arrow { - top: 17px; - } - - .Dropdown-menu { - align-items: flex-start; - display: flex; - flex-direction: column; - width: 102%; - - .Dropdown-option { - width: 100%; - } - } -`; - -const DropComponent = ({ getPos, node, view }) => { - const [selectedOption, setSelectedOption] = useState(node.attrs.correct); - - const context = useContext(WaxContext); - const { - pmViews: { main }, - } = context; - - const isEditable = main.props.editable(editable => { - return editable; - }); - - const onChange = option => { - const allNodes = getNodes(main); - allNodes.forEach(singleNode => { - if (singleNode.node.attrs.id === node.attrs.id) { - main.dispatch( - main.state.tr - .setMeta('addToHistory', false) - .setNodeMarkup(singleNode.pos, undefined, { - ...singleNode.node.attrs, - correct: option.value, - }), - ); - } - }); - }; - - const MultipleDropDown = useMemo( - () => ( - <Wrapper key={uuidv4()}> - <DropdownStyled - key={uuidv4()} - onChange={option => onChange(option)} - options={node.attrs.options} - placeholder="Select option" - select={isEditable} - value={ - selectedOption === 'undefined' ? 'Select Option' : selectedOption - } - /> - </Wrapper> - ), - [node.attrs.options, selectedOption], - ); - - return MultipleDropDown; -}; - -export default DropComponent; - -const getNodes = view => { - return DocumentHelpers.findInlineNodes(view.state.doc); -}; diff --git a/wax-prosemirror-services/src/MatchingService/components/TestModeDropDownComponent.js b/wax-prosemirror-services/src/MatchingService/components/TestModeDropDownComponent.js index 6bb5fbfba16e8d754a3f9bacd69d78d78c49c5d8..3d471faaf68d83a88861562d5e8aa32d6f7e90f0 100644 --- a/wax-prosemirror-services/src/MatchingService/components/TestModeDropDownComponent.js +++ b/wax-prosemirror-services/src/MatchingService/components/TestModeDropDownComponent.js @@ -1,3 +1,4 @@ +/* eslint-disable no-unused-vars */ /* eslint-disable no-underscore-dangle */ import React, { useContext, useMemo, useEffect, useState } from 'react'; import styled from 'styled-components';