diff --git a/wax-prosemirror-components/src/components/Button.js b/wax-prosemirror-components/src/components/Button.js index 2f2dd9406bc4ffe09a77891a18feaf4de16487e7..5c6ca68f4883976100c9f2a43cb2a129df9110b6 100644 --- a/wax-prosemirror-components/src/components/Button.js +++ b/wax-prosemirror-components/src/components/Button.js @@ -1,6 +1,6 @@ /* eslint react/prop-types: 0 */ -import React, { useContext, useMemo } from 'react'; +import React, { useContext, useMemo, useState } from 'react'; import { WaxContext } from 'wax-prosemirror-core'; import MenuButton from '../ui/buttons/MenuButton'; @@ -16,9 +16,9 @@ const Button = ({ view = {}, item }) => { const { dispatch, state } = view; - const handleMouseDown = e => { + const handleMouseDown = (e, editorState, editorDispatch) => { e.preventDefault(); - run(state, dispatch); + run(editorState, dispatch); }; const isActive = active && active(state, activeViewId); @@ -33,11 +33,13 @@ const Button = ({ view = {}, item }) => { disabled={isDisabled} iconName={icon} label={label} - onMouseDown={handleMouseDown} + onMouseDown={(e, editorState, editorDispatch) => + handleMouseDown(e, view.state, view.dispatch) + } title={title} /> ), - [], + [isActive, isDisabled], ); return MenuButtonComponent; diff --git a/wax-prosemirror-components/src/ui/buttons/MenuButton.js b/wax-prosemirror-components/src/ui/buttons/MenuButton.js index 173f8d1743de36720b4ad35992742db7d9b32580..91e81f11dd89bd92c54439106247607a261f3a48 100644 --- a/wax-prosemirror-components/src/ui/buttons/MenuButton.js +++ b/wax-prosemirror-components/src/ui/buttons/MenuButton.js @@ -78,7 +78,6 @@ const MenuButton = props => { title, onMouseDown, } = props; - console.log('here?'); return ( <Wrapper active={active} diff --git a/wax-prosemirror-services/src/lib/ToolGroup.js b/wax-prosemirror-services/src/lib/ToolGroup.js index 60d6393c9d175109594c22baae10fbf9b7bc48d9..efe1c529b940c81b97e3a2768e27aa53302ea0e2 100644 --- a/wax-prosemirror-services/src/lib/ToolGroup.js +++ b/wax-prosemirror-services/src/lib/ToolGroup.js @@ -1,4 +1,4 @@ -import React, { useState } from 'react'; +import React, { useMemo } from 'react'; import { injectable } from 'inversify'; import { ToolGroupComponent, ToolGroups } from 'wax-prosemirror-components'; import { v4 as uuidv4 } from 'uuid'; @@ -61,14 +61,20 @@ class ToolGroup { if (this._toolGroups > 0) { return <ToolGroups toolGroups={this._toolGroups} view={view} />; } - return ( - <ToolGroupComponent - key={uuidv4()} - view={view} - tools={this._tools} - title={this.title} - name={name} - /> + + const MemorizedToolGroupComponent = useMemo( + () => ( + <ToolGroupComponent + key={uuidv4()} + view={view} + tools={this._tools} + title={this.title} + name={name} + /> + ), + [view], ); + + return MemorizedToolGroupComponent; } }