diff --git a/wax-prosemirror-services/src/CommentsService/CommentBubbleComponent.js b/wax-prosemirror-services/src/CommentsService/CommentBubbleComponent.js index e17ca7f7e3e52cf4dfe511b1bf93e6d3f456ad7f..1cddc36a5761eac5b3f30b8296b9d98e288dffe1 100644 --- a/wax-prosemirror-services/src/CommentsService/CommentBubbleComponent.js +++ b/wax-prosemirror-services/src/CommentsService/CommentBubbleComponent.js @@ -4,7 +4,20 @@ import { WaxContext } from "wax-prosemirror-core/src/ioc-react"; import { DocumentHelpers } from "wax-prosemirror-utilities"; const CommentBubbleComponent = ({ setPosition, position }) => { - return <div>bubble</div>; + const { view: { main } } = useContext(WaxContext); + const { state, dispatch } = main; + const ref = useRef(null); + + useEffect( + () => { + const WaxSurface = main.dom.offsetParent.firstChild.getBoundingClientRect(); + const left = WaxSurface.width; + setPosition({ ...position, left }); + }, + [position.left] + ); + + return <div ref={ref}>bubble</div>; }; export default CommentBubbleComponent; diff --git a/wax-prosemirror-services/src/CommentsService/CommentsService.js b/wax-prosemirror-services/src/CommentsService/CommentsService.js index 7f85f4f65bd25acc93966065cecd80cdb76019d6..ecdef230e708c50263e13f9847bbe1f8bc637ec3 100644 --- a/wax-prosemirror-services/src/CommentsService/CommentsService.js +++ b/wax-prosemirror-services/src/CommentsService/CommentsService.js @@ -8,8 +8,9 @@ export default class CommentsService extends Service { boot() { const createOverlay = this.container.get("CreateOverlay"); createOverlay(CommentBubbleComponent, { - markType: "selection", - followCursor: false + markType: "", + followCursor: false, + selection: true }); } diff --git a/wax-prosemirror-services/src/LinkService/LinkComponent.js b/wax-prosemirror-services/src/LinkService/LinkComponent.js index 160863f31511fa348aa160135cd414a21639c9b0..bbcc6582fbeaa28a4bff3321aef98b65ab2073e9 100644 --- a/wax-prosemirror-services/src/LinkService/LinkComponent.js +++ b/wax-prosemirror-services/src/LinkService/LinkComponent.js @@ -34,8 +34,6 @@ const LinkComponent = ({ mark, setPosition, position }) => { const width = ref.current ? ref.current.offsetWidth : 0; const left = Math.abs(position.left - width / 2); - //TODO Overwrite default position in order to position LinkOverlay - // setPosition({ ...position, left }); setLinkText(); removeMarkIfEmptyHref(); }, diff --git a/wax-prosemirror-services/src/LinkService/LinkService.js b/wax-prosemirror-services/src/LinkService/LinkService.js index 6cb2fefe93056ecd358035645341a184b359d703..f9ffa8383a74faa42761c136b2dc5ff1569d776d 100644 --- a/wax-prosemirror-services/src/LinkService/LinkService.js +++ b/wax-prosemirror-services/src/LinkService/LinkService.js @@ -10,7 +10,11 @@ export default class LinkService extends Service { boot() { const createOverlay = this.container.get("CreateOverlay"); - createOverlay(LinkComponent, { markType: "link", followCursor: false }); + createOverlay(LinkComponent, { + markType: "link", + followCursor: false, + selection: false + }); } register() { diff --git a/wax-prosemirror-services/src/OverlayService/usePosition.js b/wax-prosemirror-services/src/OverlayService/usePosition.js index 0b22466fa954b59b1a04a5d3e3953b3cebb9a274..ad8003e5ca59a656ec5bccbb2b8afb347da3fcf2 100644 --- a/wax-prosemirror-services/src/OverlayService/usePosition.js +++ b/wax-prosemirror-services/src/OverlayService/usePosition.js @@ -35,7 +35,7 @@ export default options => { }; }; - const displayOnSelection = main => { + const displayOnSelection = (main, options) => { const { selection } = main.state; const { from, to } = selection; if (from === to) return defaultOverlay; @@ -73,9 +73,9 @@ export default options => { const updatePosition = useCallback((followCursor = true) => { if (!main) return defaultOverlay; - const { markType } = options; + const { markType, selection } = options; - if (markType === "selection") return displayOnSelection(main); + if (selection) return displayOnSelection(main, options); return displayOnMark(main, options); });