Skip to content

Commit

Permalink
enable vertical toolbar for non full width elements, anchor based on …
Browse files Browse the repository at this point in the history
…parent
  • Loading branch information
draganescu committed Sep 24, 2024
1 parent 4f5380e commit 00bda8f
Show file tree
Hide file tree
Showing 2 changed files with 20 additions and 3 deletions.
19 changes: 19 additions & 0 deletions packages/block-editor/src/components/block-popover/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import clsx from 'clsx';
*/
import { useMergeRefs } from '@wordpress/compose';
import { Popover } from '@wordpress/components';
import { useSelect } from '@wordpress/data';
import {
forwardRef,
useMemo,
Expand All @@ -21,6 +22,8 @@ import {
import { useBlockElement } from '../block-list/use-block-props/use-block-refs';
import usePopoverScroll from './use-popover-scroll';
import { rectUnion, getVisibleElementBounds } from '../../utils/dom';
import { store as blockEditorStore } from '../../store';
import { unlock } from '../../lock-unlock';

const MAX_POPOVER_RECOMPUTE_COUNTER = Number.MAX_SAFE_INTEGER;

Expand Down Expand Up @@ -74,6 +77,8 @@ function BlockPopover(
};
}, [ selectedElement ] );

const { isZoomOut } = unlock( useSelect( blockEditorStore ) );

const popoverAnchor = useMemo( () => {
if (
// popoverDimensionsRecomputeCounter is by definition always equal or greater
Expand All @@ -88,6 +93,20 @@ function BlockPopover(

return {
getBoundingClientRect() {
if ( isZoomOut() ) {
const selectedRect =
getVisibleElementBounds( selectedElement );
const parentRect = getVisibleElementBounds(
selectedElement.parentElement
);
return new window.DOMRectReadOnly(
parentRect.left,
selectedRect.top,
parentRect.right - parentRect.left,
selectedRect.bottom - selectedRect.top
);
}

return lastSelectedElement
? rectUnion(
getVisibleElementBounds( selectedElement ),
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -43,9 +43,7 @@ export function useShowBlockTools() {
isEmptyDefaultBlock;
const isZoomOut = editorMode === 'zoom-out';
const _showZoomOutToolbar =
isZoomOut &&
block?.attributes?.align === 'full' &&
! _showEmptyBlockSideInserter;
clientId && isZoomOut && ! _showEmptyBlockSideInserter;
const _showBlockToolbarPopover =
! _showZoomOutToolbar &&
! getSettings().hasFixedToolbar &&
Expand Down

0 comments on commit 00bda8f

Please sign in to comment.