Merge branch 'master' into trails-aubrey

1 files changed, 24 insertions, 11 deletions

diff --git a/src/client/views/nodes/LabelBox.tsx b/src/client/views/nodes/LabelBox.tsx
index db1ae0537..90b9ce55d 100644
--- a/src/client/views/nodes/LabelBox.tsx
+++ b/src/client/views/nodes/LabelBox.tsx
@@ -1,19 +1,20 @@
-import { action, computed, observable, runInAction } from 'mobx';
+import { action, computed, observable } from 'mobx';
 import { observer } from 'mobx-react';
 import * as React from 'react';
 import { Doc, DocListCast } from '../../../fields/Doc';
 import { documentSchema } from '../../../fields/documentSchemas';
 import { List } from '../../../fields/List';
 import { createSchema, listSpec, makeInterface } from '../../../fields/Schema';
-import { Cast, NumCast, StrCast } from '../../../fields/Types';
+import { Cast, StrCast } from '../../../fields/Types';
 import { DragManager } from '../../util/DragManager';
 import { undoBatch } from '../../util/UndoManager';
 import { ContextMenu } from '../ContextMenu';
 import { ContextMenuProps } from '../ContextMenuItem';
 import { ViewBoxBaseComponent } from '../DocComponent';
+import { StyleProp } from '../StyleProvider';
 import { FieldView, FieldViewProps } from './FieldView';
+import BigText from './LabelBigText';
 import './LabelBox.scss';
-import { StyleProp } from '../StyleProvider';
 
 const LabelSchema = createSchema({});
 
@@ -37,7 +38,8 @@ export class LabelBox extends ViewBoxBaseComponent<(FieldViewProps & LabelBoxPro
     }
 
     getTitle() {
-        return this.props.label || "";
+        return this.props.label ? this.props.label : this.rootDoc["title-custom"] ? StrCast(this.rootDoc.title) :
+            typeof this.rootDoc[this.fieldKey] === "string" ? StrCast(this.rootDoc[this.fieldKey]) : StrCast(this.rootDoc.title);
     }
 
     protected createDropTarget = (ele: HTMLDivElement) => {
@@ -81,7 +83,7 @@ export class LabelBox extends ViewBoxBaseComponent<(FieldViewProps & LabelBoxPro
         const params = Cast(this.paramsDoc["onClick-paramFieldKeys"], listSpec("string"), []);
         const missingParams = params?.filter(p => !this.paramsDoc[p]);
         params?.map(p => DocListCast(this.paramsDoc[p])); // bcz: really hacky form of prefetching ...
-        const label = this.props.label ? this.props.label : typeof this.rootDoc[this.fieldKey] === "string" ? StrCast(this.rootDoc[this.fieldKey]) : StrCast(this.rootDoc.title);
+        const label = this.getTitle();
         return (
             <div className="labelBox-outerDiv"
                 onMouseLeave={action(() => this._mouseOver = false)}
@@ -90,17 +92,28 @@ export class LabelBox extends ViewBoxBaseComponent<(FieldViewProps & LabelBoxPro
                 style={{ boxShadow: this.props.styleProvider?.(this.layoutDoc, this.props, StyleProp.BoxShadow) }}>
                 <div className="labelBox-mainButton" style={{
                     backgroundColor: this.hoverColor,
-                    fontSize: StrCast(this.layoutDoc._fontSize) || "inherit",
+                    fontSize: StrCast(this.layoutDoc._fontSize) || Math.min(18, this.props.PanelHeight() / 2),
                     fontFamily: StrCast(this.layoutDoc._fontFamily) || "inherit",
                     letterSpacing: StrCast(this.layoutDoc.letterSpacing),
                     textTransform: StrCast(this.layoutDoc.textTransform) as any,
-                    paddingLeft: NumCast(this.layoutDoc._xPadding),
-                    paddingRight: NumCast(this.layoutDoc._xPadding),
-                    paddingTop: NumCast(this.layoutDoc._yPadding),
-                    paddingBottom: NumCast(this.layoutDoc._yPadding),
+                    width: this.props.PanelWidth(),
+                    height: this.props.PanelHeight(),
                     whiteSpace: this.layoutDoc._singleLine ? "pre" : "pre-wrap"
                 }} >
-                    {label.startsWith("#") ? (null) : label}
+                    <span ref={r => {
+                        if (r) {
+                            BigText(r, {
+                                rotateText: null,
+                                fontSizeFactor: 1,
+                                maximumFontSize: null,
+                                limitingDimension: "both",
+                                horizontalAlign: "center",
+                                verticalAlign: "center",
+                                textAlign: "center",
+                                whiteSpace: "nowrap"
+                            });
+                        }
+                    }}>{label.startsWith("#") ? (null) : label}</span>
                 </div>
                 <div className="labelBox-fieldKeyParams" >
                     {!missingParams?.length ? (null) : missingParams.map(m => <div key={m} className="labelBox-missingParam">{m}</div>)}