rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: update super floating toolbar positioning [skip e2e]

Browse Source
This commit is contained in:
Aman Harwara
2023-08-12 00:59:25 +05:30
parent 796e78f642
commit 2194bdaf75
4 changed files with 15 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
packages/web/src/javascripts/Components/SuperEditor/Lexical/Utils/getDOMRangeRect.ts
View File

@@ -1,10 +1,12 @@
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*/
function mergeRects(rects: DOMRect[]): DOMRect {
const left = Math.min(...rects.map((rect) => rect.left))
const top = Math.min(...rects.map((rect) => rect.top))
const right = Math.max(...rects.map((rect) => rect.right))
const bottom = Math.max(...rects.map((rect) => rect.bottom))
return new DOMRect(left, top, right - left, bottom - top)
}
export function getDOMRangeRect(nativeSelection: Selection, rootElement: HTMLElement): DOMRect {
const domRange = nativeSelection.getRangeAt(0)
@@ -17,7 +19,8 @@ export function getDOMRangeRect(nativeSelection: Selection, rootElement: HTMLEle
}
rect = inner.getBoundingClientRect()
} else {
rect = domRange.getBoundingClientRect()
const clientRects = domRange.getClientRects()
rect = mergeRects(Array.from(clientRects))
}
return rect

2
packages/web/src/javascripts/Components/SuperEditor/Plugins/FloatingTextFormatToolbarPlugin/index.tsx
View File

@@ -57,7 +57,6 @@ import { getDOMRangeRect } from '../../Lexical/Utils/getDOMRangeRect'
import { getPositionedPopoverStyles } from '@/Components/Popover/GetPositionedPopoverStyles'
import { getAdjustedStylesForNonPortalPopover } from '@/Components/Popover/Utils/getAdjustedStylesForNonPortal'
import LinkEditor from '../FloatingLinkEditorPlugin/LinkEditor'
import { movePopoverToFitInsideRect } from '@/Components/Popover/Utils/movePopoverToFitInsideRect'
import LinkTextEditor, { $isLinkTextNode } from '../FloatingLinkEditorPlugin/LinkTextEditor'
import { URL_REGEX } from '@/Constants/Constants'
@@ -237,7 +236,6 @@ function TextFormatFloatingToolbar({
const adjustedStyles = getAdjustedStylesForNonPortalPopover(toolbarElement, calculatedStyles, rootElement)
toolbarElement.style.setProperty('--translate-x', adjustedStyles['--translate-x'])
toolbarElement.style.setProperty('--translate-y', adjustedStyles['--translate-y'])
movePopoverToFitInsideRect(toolbarElement, rootElementRect)
}
} else if (!activeElement || activeElement.id !== 'link-input') {
setLastSelection(null)