Merge branch 'master' into heartbeat

1 files changed, 13 insertions, 21 deletions

diff --git a/src/client/views/nodes/EquationBox.tsx b/src/client/views/nodes/EquationBox.tsx
index c279341cc..8d45c5724 100644
--- a/src/client/views/nodes/EquationBox.tsx
+++ b/src/client/views/nodes/EquationBox.tsx
@@ -2,7 +2,7 @@ import EquationEditor from 'equation-editor-react';
 import { action, reaction } from 'mobx';
 import { observer } from 'mobx-react';
 import * as React from 'react';
-import { WidthSym } from '../../../fields/Doc';
+import { Width } from '../../../fields/DocSymbols';
 import { Id } from '../../../fields/FieldSymbols';
 import { NumCast, StrCast } from '../../../fields/Types';
 import { TraceMobx } from '../../../fields/util';
@@ -21,6 +21,7 @@ export class EquationBox extends ViewBoxBaseComponent<FieldViewProps>() {
     public static SelectOnLoad: string = '';
     _ref: React.RefObject<EquationEditor> = React.createRef();
     componentDidMount() {
+        this.props.setContentView?.(this);
         if (EquationBox.SelectOnLoad === this.rootDoc[Id] && (!LightboxView.LightboxDoc || LightboxView.IsLightboxDocView(this.props.docViewPath()))) {
             this.props.select(false);
 
@@ -66,7 +67,7 @@ export class EquationBox extends ViewBoxBaseComponent<FieldViewProps>() {
         }
         if (e.key === 'Tab') {
             const graph = Docs.Create.FunctionPlotDocument([this.rootDoc], {
-                x: NumCast(this.layoutDoc.x) + this.layoutDoc[WidthSym](),
+                x: NumCast(this.layoutDoc.x) + this.layoutDoc[Width](),
                 y: NumCast(this.layoutDoc.y),
                 _width: 400,
                 _height: 300,
@@ -78,31 +79,21 @@ export class EquationBox extends ViewBoxBaseComponent<FieldViewProps>() {
         if (e.key === 'Backspace' && !this.dataDoc.text) this.props.removeDocument?.(this.rootDoc);
     };
     @undoBatch
-    onChange = (str: string) => {
-        this.dataDoc.text = str;
+    onChange = (str: string) => (this.dataDoc.text = str);
+
+    updateSize = () => {
         const style = this._ref.current && getComputedStyle(this._ref.current.element.current);
-        if (style) {
-            const _height = Number(style.height.replace('px', ''));
-            const _width = Number(style.width.replace('px', ''));
-            this.layoutDoc._width = Math.max(35, _width);
-            this.layoutDoc._height = Math.max(25, _height);
+        if (style?.width.endsWith('px') && style?.height.endsWith('px')) {
+            this.layoutDoc._width = Math.max(35, Number(style.width.replace('px', '')));
+            this.layoutDoc._height = Math.max(25, Number(style.height.replace('px', '')));
         }
     };
     render() {
         TraceMobx();
-        const scale = (this.props.NativeDimScaling?.() || 1) * NumCast(this.layoutDoc._viewScale, 1);
+        const scale = (this.props.NativeDimScaling?.() || 1) * NumCast(this.layoutDoc._freeform_scale, 1);
         return (
             <div
-                ref={r => {
-                    r instanceof HTMLDivElement &&
-                        new ResizeObserver(
-                            action((entries: any) => {
-                                if (entries[0].contentBoxSize[0].inlineSize) {
-                                    this.rootDoc._width = entries[0].contentBoxSize[0].inlineSize;
-                                }
-                            })
-                        ).observe(r);
-                }}
+                ref={r => this.updateSize()}
                 className="equationBox-cont"
                 onPointerDown={e => !e.ctrlKey && e.stopPropagation()}
                 style={{
@@ -110,9 +101,10 @@ export class EquationBox extends ViewBoxBaseComponent<FieldViewProps>() {
                     width: 'fit-content', // `${100 / scale}%`,
                     height: `${100 / scale}%`,
                     pointerEvents: !this.props.isSelected() ? 'none' : undefined,
+                    fontSize: StrCast(this.rootDoc._text_fontSize),
                 }}
                 onKeyDown={e => e.stopPropagation()}>
-                <EquationEditor ref={this._ref} value={this.dataDoc.text || 'x'} spaceBehavesLikeTab={true} onChange={this.onChange} autoCommands="pi theta sqrt sum prod alpha beta gamma rho" autoOperatorNames="sin cos tan" />
+                <EquationEditor ref={this._ref} value={StrCast(this.dataDoc.text, 'x')} spaceBehavesLikeTab={true} onChange={this.onChange} autoCommands="pi theta sqrt sum prod alpha beta gamma rho" autoOperatorNames="sin cos tan" />
             </div>
         );
     }