Bug/v2/fix rtl (#4958)

This commit is contained in:
Reece Browne
2025-11-24 16:57:36 +00:00
committed by GitHub
parent 5d18184e46
commit 861e4394df
20 changed files with 225 additions and 54 deletions
@@ -42,11 +42,26 @@ export function useToolPanelGeometry({
const computeAndSetGeometry = () => {
const rect = panelEl.getBoundingClientRect();
const rail = rightRailEl();
const rightOffset = rail ? Math.max(0, window.innerWidth - rail.getBoundingClientRect().left) : 0;
const width = Math.max(360, window.innerWidth - rect.left - rightOffset);
const isRTL = typeof document !== 'undefined' && document.documentElement.dir === 'rtl';
const railRect = rail?.getBoundingClientRect();
const railIsOnRight = railRect ? railRect.right > window.innerWidth / 2 : false;
const rightOffset = railRect && railIsOnRight ? Math.max(0, window.innerWidth - railRect.right) : 0;
let width: number;
let left: number;
if (isRTL) {
// In RTL, QuickAccessBar is on the right, so start after it (using rect.right as the right edge)
const quickAccessRect = quickAccessRef.current?.getBoundingClientRect();
const quickAccessWidth = quickAccessRect ? quickAccessRect.width : 0;
width = Math.max(360, window.innerWidth - quickAccessWidth - rightOffset);
left = quickAccessWidth;
} else {
width = Math.max(360, window.innerWidth - rect.left - rightOffset);
left = rect.left;
}
const height = Math.max(rect.height, window.innerHeight - rect.top);
setGeometry({
left: rect.left,
left,
top: rect.top,
width,
height,