1 files changed, 15 insertions, 11 deletions

diff --git a/src/client/views/nodes/formattedText/EquationView.tsx b/src/client/views/nodes/formattedText/EquationView.tsx
index 5167c8f2a..df1421a33 100644
--- a/src/client/views/nodes/formattedText/EquationView.tsx
+++ b/src/client/views/nodes/formattedText/EquationView.tsx
@@ -1,22 +1,23 @@
-/* eslint-disable jsx-a11y/no-static-element-interactions */
 import { IReactionDisposer } from 'mobx';
 import { observer } from 'mobx-react';
+import { Node } from 'prosemirror-model';
 import { TextSelection } from 'prosemirror-state';
+import { EditorView } from 'prosemirror-view';
 import * as React from 'react';
 import * as ReactDOM from 'react-dom/client';
 import { Doc } from '../../../../fields/Doc';
+import { DocData } from '../../../../fields/DocSymbols';
 import { StrCast } from '../../../../fields/Types';
 import './DashFieldView.scss';
 import EquationEditor from './EquationEditor';
 import { FormattedTextBox } from './FormattedTextBox';
-import { DocData } from '../../../../fields/DocSymbols';
 
 interface IEquationViewInternal {
     fieldKey: string;
     tbox: FormattedTextBox;
     width: number;
     height: number;
-    getPos: () => number;
+    getPos: () => number | undefined;
     setEditor: (editor: EquationEditor | undefined) => void;
 }
 
@@ -27,7 +28,7 @@ export class EquationViewInternal extends React.Component<IEquationViewInternal>
     _fieldKey: string;
     _ref: React.RefObject<EquationEditor> = React.createRef();
 
-    constructor(props: any) {
+    constructor(props: IEquationViewInternal) {
         super(props);
         this._fieldKey = props.fieldKey;
         this._textBoxDoc = props.tbox.Document;
@@ -46,7 +47,7 @@ export class EquationViewInternal extends React.Component<IEquationViewInternal>
                 className="equationView"
                 onKeyDown={e => {
                     if (e.key === 'Enter') {
-                        this.props.tbox.EditorView!.dispatch(this.props.tbox.EditorView!.state.tr.setSelection(new TextSelection(this.props.tbox.EditorView!.state.doc.resolve(this.props.getPos() + 1))));
+                        this.props.tbox.EditorView!.dispatch(this.props.tbox.EditorView!.state.tr.setSelection(new TextSelection(this.props.tbox.EditorView!.state.doc.resolve((this.props.getPos() ?? 0) + 1))));
                         this.props.tbox.EditorView!.focus();
                         e.preventDefault();
                     }
@@ -63,7 +64,7 @@ export class EquationViewInternal extends React.Component<IEquationViewInternal>
                 <EquationEditor
                     ref={this._ref}
                     value={StrCast(this._textBoxDoc[DocData][this._fieldKey])}
-                    onChange={(str: any) => {
+                    onChange={str => {
                         this._textBoxDoc[DocData][this._fieldKey] = str;
                     }}
                     autoCommands="pi theta sqrt sum prod alpha beta gamma rho"
@@ -77,25 +78,27 @@ export class EquationViewInternal extends React.Component<IEquationViewInternal>
 
 export class EquationView {
     dom: HTMLDivElement; // container for label and value
-    root: any;
+    root: ReactDOM.Root;
     tbox: FormattedTextBox;
-    view: any;
-    constructor(node: any, view: any, getPos: any, tbox: FormattedTextBox) {
+    view: EditorView;
+    _editor: EquationEditor | undefined;
+    getPos: () => number | undefined;
+    constructor(node: Node, view: EditorView, getPos: () => number | undefined, tbox: FormattedTextBox) {
         this.tbox = tbox;
         this.view = view;
+        this.getPos = getPos;
         this.dom = document.createElement('div');
         this.dom.style.width = node.attrs.width;
         this.dom.style.height = node.attrs.height;
         this.dom.style.position = 'relative';
         this.dom.style.display = 'inline-block';
-        this.dom.onmousedown = function (e: any) {
+        this.dom.onmousedown = (e: MouseEvent) => {
             e.stopPropagation();
         };
 
         this.root = ReactDOM.createRoot(this.dom);
         this.root.render(<EquationViewInternal fieldKey={node.attrs.fieldKey} width={node.attrs.width} height={node.attrs.height} getPos={getPos} setEditor={this.setEditor} tbox={tbox} />);
     }
-    _editor: EquationEditor | undefined;
     setEditor = (editor?: EquationEditor) => {
         this._editor = editor;
     };
@@ -106,6 +109,7 @@ export class EquationView {
         this._editor?.mathField.focus();
     }
     selectNode() {
+        this.view.dispatch(this.view.state.tr.setSelection(new TextSelection(this.view.state.doc.resolve(this.getPos() ?? 0))));
         this.tbox._applyingChange = this.tbox.fieldKey; // setting focus will make prosemirror lose focus, which will cause it to change its selection to a text selection, which causes this view to get rebuilt but it's no longer node selected, so the equationview won't have focus
         setTimeout(() => {
             this._editor?.mathField.focus();