aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/linking/LinkMenu.tsx
diff options
context:
space:
mode:
authorbobzel <zzzman@gmail.com>2022-06-03 08:39:14 -0400
committerbobzel <zzzman@gmail.com>2022-06-03 08:39:14 -0400
commit3e75896a0c6e59036a6b9467521f4fe68fdda1a0 (patch)
tree758cfb37a9a17d4b276f7bcc908a56185b718978 /src/client/views/linking/LinkMenu.tsx
parentca26b43095622d07ae81fc08d4037be38d9a8b28 (diff)
parent8799738abd11a878579814e64163e0f8a95b5116 (diff)
Merge branch 'master' into presentation_upgrade
Diffstat (limited to 'src/client/views/linking/LinkMenu.tsx')
-rw-r--r--src/client/views/linking/LinkMenu.tsx18
1 files changed, 12 insertions, 6 deletions
diff --git a/src/client/views/linking/LinkMenu.tsx b/src/client/views/linking/LinkMenu.tsx
index bc922be36..17d28e886 100644
--- a/src/client/views/linking/LinkMenu.tsx
+++ b/src/client/views/linking/LinkMenu.tsx
@@ -2,8 +2,7 @@ import { action, computed, observable } from "mobx";
import { observer } from "mobx-react";
import { Doc } from "../../../fields/Doc";
import { LinkManager } from "../../util/LinkManager";
-import { DocumentLinksButton } from "../nodes/DocumentLinksButton";
-import { DocumentView, DocumentViewSharedProps } from "../nodes/DocumentView";
+import { DocumentView } from "../nodes/DocumentView";
import { LinkDocPreview } from "../nodes/LinkDocPreview";
import { LinkEditor } from "./LinkEditor";
import './LinkMenu.scss';
@@ -14,6 +13,7 @@ interface Props {
docView: DocumentView;
position?: { x?: number, y?: number };
itemHandler?: (doc: Doc) => void;
+ clearLinkEditor: () => void;
}
/**
@@ -21,7 +21,7 @@ interface Props {
*/
@observer
export class LinkMenu extends React.Component<Props> {
- private _editorRef = React.createRef<HTMLDivElement>();
+ _editorRef = React.createRef<HTMLDivElement>();
@observable _editingLink?: Doc;
@observable _linkMenuRef = React.createRef<HTMLDivElement>();
@@ -29,16 +29,21 @@ export class LinkMenu extends React.Component<Props> {
return this.props.position ?? (dv => ({ x: dv?.left || 0, y: (dv?.bottom || 0) + 15 }))(this.props.docView.getBounds());
}
+ clear = action(() => {
+ this.props.clearLinkEditor();
+ this._editingLink = undefined;
+ });
+
componentDidMount() { document.addEventListener("pointerdown", this.onPointerDown); }
componentWillUnmount() { document.removeEventListener("pointerdown", this.onPointerDown); }
- onPointerDown = (e: PointerEvent) => {
+ onPointerDown = action((e: PointerEvent) => {
LinkDocPreview.Clear();
if (!this._linkMenuRef.current?.contains(e.target as any) &&
!this._editorRef.current?.contains(e.target as any)) {
- DocumentLinksButton.ClearLinkEditor();
+ this.clear();
}
- }
+ });
/**
* maps each link to a JSX element to be rendered
@@ -54,6 +59,7 @@ export class LinkMenu extends React.Component<Props> {
sourceDoc={this.props.docView.props.Document}
group={group[1]}
groupType={group[0]}
+ clearLinkEditor={this.clear}
showEditor={action(linkDoc => this._editingLink = linkDoc)} />);
return linkItems.length ? linkItems : this.props.position ? [<></>] : [<p key="">No links have been created yet. Drag the linking button onto another document to create a link.</p>];