From 19adcca1a89405a47da57fee64fe5fde4720c16a Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Mon, 5 May 2025 14:05:32 -0400
Subject: got rid of dash _xPadding/_yPadding in favor of just using
 _xMargin/_yMargin.  cleaned up linearView field names

---
 src/client/views/nodes/trails/PresSlideBox.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

(limited to 'src/client/views/nodes/trails/PresSlideBox.tsx')

diff --git a/src/client/views/nodes/trails/PresSlideBox.tsx b/src/client/views/nodes/trails/PresSlideBox.tsx
index 3dbb3da88..3440b29dd 100644
--- a/src/client/views/nodes/trails/PresSlideBox.tsx
+++ b/src/client/views/nodes/trails/PresSlideBox.tsx
@@ -559,10 +559,10 @@ export class PresSlideBox extends ViewBoxBaseComponent<FieldViewProps>() {
                 style={{
                     backgroundColor: presColorBool ? (isSelected ? 'rgba(250,250,250,0.3)' : 'transparent') : isSelected ? Colors.LIGHT_BLUE : 'transparent',
                     opacity: this._dragging ? 0.3 : 1,
-                    paddingLeft: NumCast(this.layoutDoc._xPadding, this._props.xPadding),
-                    paddingRight: NumCast(this.layoutDoc._xPadding, this._props.xPadding),
-                    paddingTop: NumCast(this.layoutDoc._yPadding, this._props.yPadding),
-                    paddingBottom: NumCast(this.layoutDoc._yPadding, this._props.yPadding),
+                    paddingLeft: NumCast(this.layoutDoc._xMargin, this._props._xMargin),
+                    paddingRight: NumCast(this.layoutDoc._xMargin, this._props._xMargin),
+                    paddingTop: NumCast(this.layoutDoc._yPadding, this._props.yMargin),
+                    paddingBottom: NumCast(this.layoutDoc._yPadding, this._props.yMargin),
                 }}
                 onDoubleClick={action(() => {
                     this.toggleProperties();
-- 
cgit v1.2.3-70-g09d2


From 74836a59c4af0a3c240c5e3435359935282ce049 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Mon, 5 May 2025 14:53:49 -0400
Subject: fixed keeping focus on labelBox when text butons are clicked.

---
 src/client/views/nodes/LabelBox.tsx                | 35 ++++++++++++----------
 .../views/nodes/formattedText/FormattedTextBox.tsx | 11 ++++---
 src/client/views/nodes/trails/PresSlideBox.tsx     |  4 +--
 3 files changed, 28 insertions(+), 22 deletions(-)

(limited to 'src/client/views/nodes/trails/PresSlideBox.tsx')

diff --git a/src/client/views/nodes/LabelBox.tsx b/src/client/views/nodes/LabelBox.tsx
index f901c32fc..4cbe01b82 100644
--- a/src/client/views/nodes/LabelBox.tsx
+++ b/src/client/views/nodes/LabelBox.tsx
@@ -27,7 +27,7 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps>() {
     private dropDisposer?: DragManager.DragDropDisposer;
     private _timeout: NodeJS.Timeout | undefined;
     private _divRef: HTMLDivElement | null = null;
-    private _reaction: IReactionDisposer | undefined;
+    private _disposers: { [key: string]: IReactionDisposer } = {};
 
     constructor(props: FieldViewProps) {
         super(props);
@@ -43,7 +43,7 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps>() {
 
     componentDidMount() {
         this._props.setContentViewBox?.(this);
-        this._reaction = reaction(
+        this._disposers.active = reaction(
             () => this.Title,
             () => document.activeElement !== this._divRef && this._forceRerender++
         );
@@ -51,7 +51,7 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps>() {
     componentWillUnMount() {
         this._timeout && clearTimeout(this._timeout);
         this.setText(this._divRef?.innerText ?? '');
-        this._reaction?.();
+        Object.values(this._disposers).forEach(disposer => disposer());
     }
 
     @observable _forceRerender = 0;
@@ -171,20 +171,21 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps>() {
     render() {
         TraceMobx();
         const boxParams = this.fitTextToBox(undefined); // this causes mobx to trigger re-render when data changes
+        const [xmargin, ymargin] = [NumCast(this.layoutDoc._xMargin), NumCast(this.layoutDoc._uMargin)];
         return (
             <div className="labelBox-outerDiv" ref={this.createDropTarget} style={{ boxShadow: this.boxShadow }}>
                 <div
                     className="labelBox-mainButton"
                     style={{
                         backgroundColor: this.backgroundColor,
-                        color: StrCast(this.layoutDoc._text_fontColor, StrCast(this.layoutDoc._color)),
-                        fontFamily: StrCast(this.layoutDoc._text_fontFamily, StrCast(Doc.UserDoc().fontFamily)) || 'inherit',
+                        color: StrCast(this.layoutDoc[`${this.fieldKey}_fontColor`], StrCast(this.layoutDoc._color)),
+                        fontFamily: StrCast(this.layoutDoc[`${this.fieldKey}_fontFamily`], StrCast(Doc.UserDoc().fontFamily)) || 'inherit',
                         letterSpacing: StrCast(this.layoutDoc.letterSpacing),
-                        textTransform: StrCast(this.layoutDoc[this.fieldKey + '_transform']) as Property.TextTransform,
-                        paddingLeft: NumCast(this.layoutDoc._xMargin),
-                        paddingRight: NumCast(this.layoutDoc._xMargin),
-                        paddingTop: NumCast(this.layoutDoc._yMargin),
-                        paddingBottom: NumCast(this.layoutDoc._yMargin),
+                        textTransform: StrCast(this.layoutDoc[`${this.fieldKey}_transform`]) as Property.TextTransform,
+                        paddingLeft: xmargin,
+                        paddingRight: xmargin,
+                        paddingTop: ymargin,
+                        paddingBottom: ymargin,
                         width: this._props.PanelWidth(),
                         height: this._props.PanelHeight(),
                         whiteSpace: boxParams.multiLine ? 'pre-wrap' : 'pre',
@@ -192,8 +193,8 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps>() {
                     <div
                         key={this._forceRerender}
                         style={{
-                            width: this._props.PanelWidth() - 2 * NumCast(this.layoutDoc._xMargin),
-                            height: this._props.PanelHeight() - 2 * NumCast(this.layoutDoc._yMargin),
+                            width: this._props.PanelWidth() - 2 * xmargin,
+                            height: this._props.PanelHeight() - 2 * ymargin,
                             outline: 'unset !important',
                         }}
                         onKeyDown={e => {
@@ -214,12 +215,14 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps>() {
                             this._divRef?.removeEventListener('focusout', this.keepFocus);
                             this._divRef?.addEventListener('focusout', this.keepFocus);
                         }}
-                        onBlur={() => {
+                        onBlur={e => {
                             this._divRef?.removeEventListener('focusout', this.keepFocus);
                             this.setText(this._divRef?.innerText ?? '');
-                            RichTextMenu.Instance?.updateMenu(undefined, undefined, undefined, undefined);
-                            FormattedTextBox.LiveTextUndo?.end();
-                            FormattedTextBox.LiveTextUndo = undefined;
+                            if (!FormattedTextBox.tryKeepingFocus(e.relatedTarget, () => this._divRef?.focus())) {
+                                RichTextMenu.Instance?.updateMenu(undefined, undefined, undefined, undefined);
+                                FormattedTextBox.LiveTextUndo?.end();
+                                FormattedTextBox.LiveTextUndo = undefined;
+                            }
                         }}
                         dangerouslySetInnerHTML={{
                             __html: `<span class="textFitted textFitAlignVert" style="display: inline-block; text-align: center; font-size: 100px; height: 0px;">${this.Title?.startsWith('#') ? '' : (this.Title ?? '')}</span>`,
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index abf44b54d..824ac97da 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -1750,19 +1750,22 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB
      * When a text box loses focus, it might be because a text button was clicked (eg, bold, italics) or color picker.
      * In these cases, force focus back onto the text box.
      * @param target
+     * @returns true if focus was kept on the text box, false otherwise
      */
-    tryKeepingFocus = (target: Element | null) => {
+    public static tryKeepingFocus(target: Element | null, refocusFunc?: () => void) {
         for (let newFocusEle = target instanceof HTMLElement ? target : null; newFocusEle; newFocusEle = newFocusEle?.parentElement) {
             // bcz: HACK!! test if parent of new focused element is a UI button (should be more specific than testing className)
             if (['fonticonbox', 'antimodeMenu-cont', 'popup-container'].includes(newFocusEle?.className ?? '')) {
-                return this.EditorView?.focus(); // keep focus on text box
+                refocusFunc?.(); // keep focus on text box
+                return true;
             }
         }
-    };
+        return false;
+    }
 
     @action
     onBlur = (e: React.FocusEvent) => {
-        this.tryKeepingFocus(e.relatedTarget);
+        FormattedTextBox.tryKeepingFocus(e.relatedTarget, () => this.EditorView?.focus());
         if (this.ProseRef?.children[0] !== e.nativeEvent.target) return;
         if (!(this.EditorView?.state.selection instanceof NodeSelection) || this.EditorView.state.selection.node.type !== this.EditorView.state.schema.nodes.footnote) {
             const stordMarks = this.EditorView?.state.storedMarks?.slice();
diff --git a/src/client/views/nodes/trails/PresSlideBox.tsx b/src/client/views/nodes/trails/PresSlideBox.tsx
index 3440b29dd..55a655c7a 100644
--- a/src/client/views/nodes/trails/PresSlideBox.tsx
+++ b/src/client/views/nodes/trails/PresSlideBox.tsx
@@ -559,8 +559,8 @@ export class PresSlideBox extends ViewBoxBaseComponent<FieldViewProps>() {
                 style={{
                     backgroundColor: presColorBool ? (isSelected ? 'rgba(250,250,250,0.3)' : 'transparent') : isSelected ? Colors.LIGHT_BLUE : 'transparent',
                     opacity: this._dragging ? 0.3 : 1,
-                    paddingLeft: NumCast(this.layoutDoc._xMargin, this._props._xMargin),
-                    paddingRight: NumCast(this.layoutDoc._xMargin, this._props._xMargin),
+                    paddingLeft: NumCast(this.layoutDoc._xMargin, this._props.xMargin),
+                    paddingRight: NumCast(this.layoutDoc._xMargin, this._props.xMargin),
                     paddingTop: NumCast(this.layoutDoc._yPadding, this._props.yMargin),
                     paddingBottom: NumCast(this.layoutDoc._yPadding, this._props.yMargin),
                 }}
-- 
cgit v1.2.3-70-g09d2

