diff options
Diffstat (limited to 'src/client/views/nodes/formattedText')
| -rw-r--r-- | src/client/views/nodes/formattedText/FormattedTextBox.tsx | 13 | ||||
| -rw-r--r-- | src/client/views/nodes/formattedText/RichTextMenu.tsx | 36 | 
2 files changed, 23 insertions, 26 deletions
| diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index 2ded33346..54d79f4b8 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -34,7 +34,7 @@ import { DictationManager } from '../../../util/DictationManager';  import { DragManager } from "../../../util/DragManager";  import { makeTemplate } from '../../../util/DropConverter';  import buildKeymap, { updateBullets } from "./ProsemirrorExampleTransfer"; -import RichTextMenu from './RichTextMenu'; +import RichTextMenu, { RichTextMenuPlugin } from './RichTextMenu';  import { RichTextRules } from "./RichTextRules";  //import { DashDocView } from "./DashDocView"; @@ -1307,7 +1307,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp          // jump rich text menu to this textbox          const bounds = this._ref.current?.getBoundingClientRect(); -        if (bounds && this.layoutDoc._chromeStatus !== "disabled") { +        if (bounds && this.layoutDoc._chromeStatus !== "disabled" && RichTextMenu.Instance) {              const x = Math.min(Math.max(bounds.left, 0), window.innerWidth - RichTextMenu.Instance.width);              let y = Math.min(Math.max(0, bounds.top - RichTextMenu.Instance.height - 50), window.innerHeight - RichTextMenu.Instance.height);              if (coords && coords.left > x && coords.left < x + RichTextMenu.Instance.width && coords.top > y && coords.top < y + RichTextMenu.Instance.height + 50) { @@ -1411,11 +1411,14 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp          }      } +    menuPlugin: any; +      richTextMenuPlugin() { +        const self = this;          return new Plugin({              view(newView) { -                RichTextMenu.Instance?.changeView(newView); -                return RichTextMenu.Instance; +                self.props.isSelected(true) && (RichTextMenu.Instance.view = newView); +                return self.menuPlugin = new RichTextMenuPlugin({ editorProps: this.props });              }          });      } @@ -1525,7 +1528,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp          const scale = this.props.hideOnLeave ? 1 : this.props.ContentScaling() * NumCast(this.layoutDoc._viewScale, 1);          const rounded = StrCast(this.layoutDoc.borderRounding) === "100%" ? "-rounded" : "";          const interactive = Doc.GetSelectedTool() === InkTool.None && !this.layoutDoc.isBackground; -        setTimeout(() => this._editorView && RichTextMenu.Instance.updateFromDash(this._editorView, undefined, this.props), this.props.isSelected() ? 10 : 0); // need to make sure that we update a text box that is selected after updating the one that was deselected +        setTimeout(() => this._editorView && RichTextMenu.Instance?.updateMenu(this._editorView, undefined, this.props), this.props.isSelected() ? 10 : 0); // need to make sure that we update a text box that is selected after updating the one that was deselected          if (!this.props.isSelected() && FormattedTextBoxComment.textBox === this) {              setTimeout(() => FormattedTextBoxComment.Hide(), 0);          } diff --git a/src/client/views/nodes/formattedText/RichTextMenu.tsx b/src/client/views/nodes/formattedText/RichTextMenu.tsx index b683fb25d..e5cc62082 100644 --- a/src/client/views/nodes/formattedText/RichTextMenu.tsx +++ b/src/client/views/nodes/formattedText/RichTextMenu.tsx @@ -16,7 +16,7 @@ import { unimplementedFunction, Utils } from "../../../../Utils";  import { DocServer } from "../../../DocServer";  import { LinkManager } from "../../../util/LinkManager";  import { SelectionManager } from "../../../util/SelectionManager"; -import AntimodeMenu from "../../AntimodeMenu"; +import AntimodeMenu, { AntimodeMenuProps } from "../../AntimodeMenu";  import { FieldViewProps } from "../FieldView";  import { FormattedTextBox, FormattedTextBoxProps } from "./FormattedTextBox";  import { updateBullets } from "./ProsemirrorExampleTransfer"; @@ -31,11 +31,11 @@ library.add(faBold, faItalic, faChevronLeft, faUnderline, faStrikethrough, faSup  @observer -export default class RichTextMenu extends AntimodeMenu { +export default class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {      static Instance: RichTextMenu;      public overMenu: boolean = false; // kind of hacky way to prevent selects not being selectable -    private view?: EditorView; +    public view?: EditorView;      public editorProps: FieldViewProps & FormattedTextBoxProps | undefined;      public _brushMap: Map<string, Set<Mark>> = new Map(); @@ -156,22 +156,8 @@ export default class RichTextMenu extends AntimodeMenu {      public delayHide = () => this._delayHide = true;      @action -    changeView(view: EditorView) { -        if ((view as any)?.TextView?.props.isSelected(true)) { -            this.view = view; -        } -    } - -    update(view: EditorView, lastState: EditorState | undefined) { -        RichTextMenu.Instance.updateFromDash(view, lastState, this.editorProps); -    } - -    @action -    public async updateFromDash(view: EditorView, lastState: EditorState | undefined, props: any) { -        RichTextMenu.Instance.finalUpdateFromDash(view, lastState, props); -    } -    public async finalUpdateFromDash(view: EditorView, lastState: EditorState | undefined, props: any) { -        if (!view || !(view as any).TextView?.props.isSelected(true)) { +    public updateMenu(view: EditorView, lastState: EditorState | undefined, props: any) { +        if (!view || !(view as any).TextView?.props.isSelected(true) || !view.hasFocus()) {              return;          }          this.view = view; @@ -199,8 +185,7 @@ export default class RichTextMenu extends AntimodeMenu {          this.activeHighlightColor = !activeHighlights.length ? "" : activeHighlights.length === 1 ? String(activeHighlights[0]) : "...";          // update link in current selection -        const targetTitle = await this.getTextLinkTargetTitle(); -        this.setCurrentLink(targetTitle); +        this.getTextLinkTargetTitle().then(targetTitle => this.setCurrentLink(targetTitle));      }      setMark = (mark: Mark, state: EditorState<any>, dispatch: any, dontToggle: boolean = false) => { @@ -1070,4 +1055,13 @@ export class ButtonDropdown extends React.Component<ButtonDropdownProps> {              </div>          );      } +} + + +interface RichTextMenuPluginProps { +    editorProps: any; +} +export class RichTextMenuPlugin extends React.Component<RichTextMenuPluginProps> { +    render() { return null; } +    update(view: EditorView, lastState: EditorState | undefined) { RichTextMenu.Instance?.updateMenu(view, lastState, this.props.editorProps); }  }
\ No newline at end of file | 
