add resolution

package.json

@@ -35,6 +35,9 @@
     "stylelint": "^8.2.0",
     "svg-inline-loader": "^0.8.0"
   },
+  "resolutions": {
+    "styled-components": "4.2.0"
+  },
   "workspaces": [
     "wax-prosemirror-core",
     "wax-prosemirror-schema",

wax-prosemirror-components/src/components/button/Button.js

 import React from "react";
 import styled from "styled-components";
-import { override } from "@pubsweet/ui-toolkit";
+import { ButtonStyles } from "wax-prosemirror-themes";
 
 const ButtonStyled = styled.button`
   opacity: ${props => (props.select ? 1 : 0.4)};
@@ -10,7 +10,7 @@ const ButtonStyled = styled.button`
   &:hover {
     color: ${props => (props.isActive ? props.theme.colorPrimary : "#000")};
   }
-  ${override("ui.Button")};
+  ${ButtonStyles};
 `;
 
 const Button = ({ view = {}, item }) => (

wax-prosemirror-themes/index.js

 export { default as cokoTheme } from "./src/coko-theme/index";
+export {
+  default as ButtonStyles
+} from "./src/coko-theme/elements/ButtonStyles";

wax-prosemirror-themes/src/coko-theme/elements/Button.js

-import styled, { css } from "styled-components";
-
-export default css`
-  background: #fff;
-  border: none;
-  font-size: inherit;
-  cursor: pointer;
-  border-radius: 0;
-  padding: 5px 10px;
-  &:disabled {
-    color: #ccc;
-    pointer-events: none;
-  }
-  &:hover {
-    background: #f6f6f6;
-  }
-`;

wax-prosemirror-themes/src/coko-theme/elements/index.js

-export { default as Button } from "./Button";
+export { default as ButtonStyles } from "./ButtonStyles";

wax-prosemirror-themes/src/coko-theme/index.js

@@ -2,7 +2,7 @@
 import "typeface-fira-sans-condensed";
 import "typeface-vollkorn";
 
-import { Button } from "./elements";
+import { ButtonStyled } from "./elements";
 
 const cokoTheme = {
   /* Colors */
@@ -69,7 +69,7 @@ const cokoTheme = {
 
   cssOverrides: {
     ui: {
-      Button
+      ButtonStyled
     }
   }
 };