diff --git a/editors/demo/src/Editoria/Editoria.js b/editors/demo/src/Editoria/Editoria.js
index c6e78c65d83d1ef0a00175204df77b65496e2358..1508bf9fa9fe7303affab4cb5adab339e0350218 100644
--- a/editors/demo/src/Editoria/Editoria.js
+++ b/editors/demo/src/Editoria/Editoria.js
@@ -51,10 +51,10 @@ const Editoria = () => {
value={demo}
// readonly
layout={layout}
- onChange={debounce(source => {
- console.log(source);
- }, 200)}
- onBlur={source => console.log(source)}
+ // onChange={debounce(source => {
+ // console.log(source);
+ // }, 200)}
+ // onBlur={source => console.log(source)}
user={user}
/>
</>
diff --git a/editors/demo/src/Editors.js b/editors/demo/src/Editors.js
index fa52e35509b57dc1e5f1d06514566f8cc480bbe7..977ed5cc4dbf7c694157ede01a713d4b2f5b983e 100644
--- a/editors/demo/src/Editors.js
+++ b/editors/demo/src/Editors.js
@@ -54,7 +54,7 @@ const Editors = () => {
case 'ncbi':
break;
default:
- return <Editoria />;
+ return <HHMI />;
}
};
diff --git a/editors/demo/src/HHMI/HHMI.js b/editors/demo/src/HHMI/HHMI.js
index 58e26fb8cf0939141047a8e97f1609070ce149dc..1baf671f6dc2e4885b2bfe82bf6cf02f0176c567 100644
--- a/editors/demo/src/HHMI/HHMI.js
+++ b/editors/demo/src/HHMI/HHMI.js
@@ -183,7 +183,7 @@ const Hhmi = () => {
config={config}
autoFocus
fileUpload={file => renderImage(file)}
- value={initialValue}
+ value=""
targetFormat="JSON"
// readonly
layout={HhmiLayout}
diff --git a/wax-prosemirror-components/src/components/EditorInfo/CounterInfo/EditorInfoTool.js b/wax-prosemirror-components/src/components/EditorInfo/CounterInfo/EditorInfoTool.js
index 1b2b6f6e6732b74bf77031625df41150c419bb20..23e5a44382937781b8cb6f1fdf0095ff4c1bf25d 100644
--- a/wax-prosemirror-components/src/components/EditorInfo/CounterInfo/EditorInfoTool.js
+++ b/wax-prosemirror-components/src/components/EditorInfo/CounterInfo/EditorInfoTool.js
@@ -7,7 +7,7 @@ import React, {
useCallback,
} from 'react';
import styled from 'styled-components';
-import { grid, th } from '@pubsweet/ui-toolkit';
+import { grid, override } from '@pubsweet/ui-toolkit';
import { v4 as uuidv4 } from 'uuid';
import { WaxContext } from 'wax-prosemirror-core';
import { DocumentHelpers } from 'wax-prosemirror-utilities';
@@ -43,6 +43,7 @@ const Wrapper = styled.div`
position: relative;
width: 0;
}
+ ${override('Wax.CounterWrapper')}
`;
const DropWrapper = styled.div`
@@ -51,7 +52,9 @@ const DropWrapper = styled.div`
position: absolute;
top: 32px;
width: max-content;
+ ${override('Wax.CounterDropWrapper')}
`;
+
const CounterInfoComponent = styled.div`
background: #fff;
border-radius: 1.03093% / 8%;
@@ -65,7 +68,9 @@ const CounterInfoComponent = styled.div`
position: fixed;
right: 31px;
transform-origin: 50% 50% 0px;
+ ${override('Wax.CounterInfoComponent')}
`;
+
const Counter = styled.div`
color: black;
display: block;
@@ -73,6 +78,7 @@ const Counter = styled.div`
height: 25px;
margin: 5px;
min-width: 150px;
+ ${override('Wax.Counters')}
`;
const EditorInfoTool = ({ view: { state }, item }) => {
diff --git a/wax-prosemirror-components/src/components/ToolGroupComponent.js b/wax-prosemirror-components/src/components/ToolGroupComponent.js
index 361f3a49450a3e2620f0cb5364cebe751bb40bc7..48d71f905e8342ea3a6db0beaa10c43e35934a7b 100644
--- a/wax-prosemirror-components/src/components/ToolGroupComponent.js
+++ b/wax-prosemirror-components/src/components/ToolGroupComponent.js
@@ -36,8 +36,8 @@ const ToolGroupComponent = ({ view, tools, name }) => {
{toolsShown}
{rest.length > 0 && (
<Dropdown
- iconName="more"
dropComponent={<DropWrapper>{rest}</DropWrapper>}
+ iconName="more"
title="Show more tools"
/>
)}
diff --git a/wax-prosemirror-components/src/components/ToolGroups.js b/wax-prosemirror-components/src/components/ToolGroups.js
index 374fb6f15a63edb7e272aa3b8e7b16b2334d0f81..0c60229d3d024b18836a55f7590f88db3f56c806 100644
--- a/wax-prosemirror-components/src/components/ToolGroups.js
+++ b/wax-prosemirror-components/src/components/ToolGroups.js
@@ -12,8 +12,8 @@ const ToolGroups = ({ toolGroups, view }) => {
return (
<ToolGroupComponent
key={uuidv4()}
- view={view}
tools={toolGroup._tools}
+ view={view}
// title={this.title}
// name={name}
/>
diff --git a/wax-prosemirror-components/src/ui/buttons/Dropdown.js b/wax-prosemirror-components/src/ui/buttons/Dropdown.js
index 4dd6147fa36016dd9f4671666dda268f72406fd6..3085205fc08110fae72cb558ebf69314a2420d14 100644
--- a/wax-prosemirror-components/src/ui/buttons/Dropdown.js
+++ b/wax-prosemirror-components/src/ui/buttons/Dropdown.js
@@ -34,7 +34,10 @@ const Dropdown = props => {
disabled={disabled}
iconName={iconName}
label={label}
- onMouseDown={() => setIsOpen(!isOpen)}
+ onMouseDown={event => {
+ event.preventDefault();
+ setIsOpen(!isOpen);
+ }}
title={title}
/>
diff --git a/wax-prosemirror-core/src/Wax.js b/wax-prosemirror-core/src/Wax.js
index 23d6140129d7c9dea045477560a8c153a107ea44..9cda7e62c3fd4cd62f1781bfd7da792e4fafc584 100644
--- a/wax-prosemirror-core/src/Wax.js
+++ b/wax-prosemirror-core/src/Wax.js
@@ -34,6 +34,7 @@ const Wax = props => {
const {
autoFocus,
+ browserSpellCheck,
className,
debug,
fileUpload,
@@ -95,17 +96,18 @@ const Wax = props => {
<PortalProvider>
<WaxView
autoFocus={autoFocus}
+ browserSpellCheck={browserSpellCheck}
debug={debug}
fileUpload={fileUpload}
onBlur={onBlur || (v => true)}
onChange={finalOnChange || (v => true)}
placeholder={placeholder}
readonly={readonly}
+ serializer={serializer}
targetFormat={targetFormat}
TrackChange={TrackChange}
user={user}
value={value}
- serializer={serializer}
>
{({ editor }) => <WaxRender className={className} editor={editor} />}
</WaxView>
diff --git a/wax-prosemirror-core/src/WaxView.js b/wax-prosemirror-core/src/WaxView.js
index 517051f11e283bb85bbe8bf5784c2598d297ce9b..101389c3d8e787bc6382964e085a8f6cfa36b953 100644
--- a/wax-prosemirror-core/src/WaxView.js
+++ b/wax-prosemirror-core/src/WaxView.js
@@ -24,7 +24,15 @@ const WaxPortals = ComponentPlugin('waxPortals');
let previousDoc;
export default props => {
- const { readonly, onBlur, debug, autoFocus, user, targetFormat } = props;
+ const {
+ browserSpellCheck,
+ readonly,
+ onBlur,
+ debug,
+ autoFocus,
+ user,
+ targetFormat,
+ } = props;
const editorRef = useRef();
let view;
const [mounted, setMounted] = useState(false);
@@ -75,7 +83,7 @@ export default props => {
return transformPasted(slice, view);
},
attributes: {
- spellcheck: 'false',
+ spellcheck: browserSpellCheck ? 'true' : 'false',
},
},
);
diff --git a/wax-prosemirror-schema/src/marks/strongMark.js b/wax-prosemirror-schema/src/marks/strongMark.js
index bea068b2906db5cb19232e364a3b5676c0da1ea2..e1fc8ea10cb4d8796a9a275513869770ef9bb524 100644
--- a/wax-prosemirror-schema/src/marks/strongMark.js
+++ b/wax-prosemirror-schema/src/marks/strongMark.js
@@ -1,19 +1,18 @@
const strong = {
parseDOM: [
- { tag: "strong" },
+ { tag: 'strong' },
+ // This works around a Google Docs misbehavior where
+ // pasted content will be inexplicably wrapped in `<b>`
+ // tags with a font-weight normal.
+ { tag: 'b', getAttrs: node => node.style.fontWeight !== 'normal' && null },
{
- tag: "b",
- getAttrs: node => node.style.fontWeight != "normal" && null
- }
- // {
- // style: "font-weight",
- // getAttrs: value => /^(bold(er)?|[5-9]\d{2,})$/.test(value) && null
- // }
+ style: 'font-weight',
+ getAttrs: value => /^(bold(er)?|[5-9]\d{2,})$/.test(value) && null,
+ },
],
- toDOM(hook, next) {
- hook.value = ["strong", 0];
- next();
- }
+ toDOM() {
+ return ['strong', 0];
+ },
};
export default strong;
diff --git a/wax-prosemirror-services/src/InlineAnnotations/StrongService/StrongService.js b/wax-prosemirror-services/src/InlineAnnotations/StrongService/StrongService.js
index 21d9ad3d4528fe86bfae4877ef2a695e4c09b6b8..44f66b6ecd169d24288c7961726665b6512e2a46 100644
--- a/wax-prosemirror-services/src/InlineAnnotations/StrongService/StrongService.js
+++ b/wax-prosemirror-services/src/InlineAnnotations/StrongService/StrongService.js
@@ -1,23 +1,20 @@
-import Service from "../../Service";
-import { toggleMark } from "prosemirror-commands";
-import { strongMark } from "wax-prosemirror-schema";
-import Strong from "./Strong";
+import Service from '../../Service';
+import { toggleMark } from 'prosemirror-commands';
+import { strongMark } from 'wax-prosemirror-schema';
+import Strong from './Strong';
class StrongService extends Service {
boot() {
- const shortCuts = this.container.get("ShortCuts");
- shortCuts.addShortCut({ "Mod-b": toggleMark(this.schema.marks.strong) });
+ const shortCuts = this.container.get('ShortCuts');
+ shortCuts.addShortCut({ 'Mod-b': toggleMark(this.schema.marks.strong) });
}
register() {
- this.container.bind("Strong").to(Strong);
- const createMark = this.container.get("CreateMark");
- createMark(
- {
- strong: strongMark
- },
- { toWaxSchema: true }
- );
+ this.container.bind('Strong').to(Strong);
+ const createMark = this.container.get('CreateMark');
+ createMark({
+ strong: strongMark,
+ });
}
}