Skip to content

Commit

Permalink
prep build 08/01
Browse files Browse the repository at this point in the history
  • Loading branch information
@bph
bph committed Aug 1, 2023
2 parents c9568bb + 1d9352f commit a850b5a
Show file tree
Hide file tree
Showing 37 changed files with 644 additions and 372 deletions.
2 changes: 1 addition & 1 deletion .github/workflows/enforce-pr-labels.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ jobs:
with:
mode: exactly
count: 1
labels: '[Type] Accessibility (a11y), [Type] Automated Testing, [Type] Breaking Change, [Type] Bug, [Type] Build Tooling, [Type] Code Quality, [Type] Copy, [Type] Developer Documentation, [Type] Enhancement, [Type] Experimental, [Type] Feature, [Type] New API, [Type] Task, [Type] Performance, [Type] Project Management, [Type] Regression, [Type] Security, [Type] WP Core Ticket'
labels: '[Type] Accessibility (a11y), [Type] Automated Testing, [Type] Breaking Change, [Type] Bug, [Type] Build Tooling, [Type] Code Quality, [Type] Copy, [Type] Developer Documentation, [Type] Enhancement, [Type] Experimental, [Type] Feature, [Type] New API, [Type] Task, [Type] Performance, [Type] Project Management, [Type] Regression, [Type] Security, [Type] WP Core Ticket, Backport from WordPress Core'
add_comment: true
message: "## ⚠️ Type of PR label error\n To merge this PR, it requires {{ errorString }} {{ count }} label indicating the type of PR. Other labels are optional and not being checked here. \n- **Type-related labels to choose from**: {{ provided }}.\n- **Labels found**: {{ applied }}.\n\nYou can learn more about the Type labels in Gutenberg [here](https://github.com/WordPress/gutenberg/labels?q=type)"
exit_type: failure
72 changes: 30 additions & 42 deletions packages/block-editor/src/components/block-parent-selector/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import { useRef } from '@wordpress/element';
*/
import useBlockDisplayInformation from '../use-block-display-information';
import BlockIcon from '../block-icon';
import { useShowMoversGestures } from '../block-toolbar/utils';
import { useShowHoveredOrFocusedGestures } from '../block-toolbar/utils';
import { store as blockEditorStore } from '../../store';
import { unlock } from '../../lock-unlock';

Expand All @@ -23,52 +23,40 @@ import { unlock } from '../../lock-unlock';
* @return {WPComponent} Parent block selector.
*/
export default function BlockParentSelector() {
const { selectBlock, toggleBlockHighlight } =
useDispatch( blockEditorStore );
const { firstParentClientId, isVisible, isDistractionFree } = useSelect(
( select ) => {
const {
getBlockName,
getBlockParents,
getSelectedBlockClientId,
getSettings,
getBlockEditingMode,
} = unlock( select( blockEditorStore ) );
const { hasBlockSupport } = select( blocksStore );
const selectedBlockClientId = getSelectedBlockClientId();
const parents = getBlockParents( selectedBlockClientId );
const _firstParentClientId = parents[ parents.length - 1 ];
const parentBlockName = getBlockName( _firstParentClientId );
const _parentBlockType = getBlockType( parentBlockName );
const settings = getSettings();
return {
firstParentClientId: _firstParentClientId,
isVisible:
_firstParentClientId &&
getBlockEditingMode( _firstParentClientId ) === 'default' &&
hasBlockSupport(
_parentBlockType,
'__experimentalParentSelector',
true
),
isDistractionFree: settings.isDistractionFree,
};
},
[]
);
const { selectBlock } = useDispatch( blockEditorStore );
const { firstParentClientId, isVisible } = useSelect( ( select ) => {
const {
getBlockName,
getBlockParents,
getSelectedBlockClientId,
getBlockEditingMode,
} = unlock( select( blockEditorStore ) );
const { hasBlockSupport } = select( blocksStore );
const selectedBlockClientId = getSelectedBlockClientId();
const parents = getBlockParents( selectedBlockClientId );
const _firstParentClientId = parents[ parents.length - 1 ];
const parentBlockName = getBlockName( _firstParentClientId );
const _parentBlockType = getBlockType( parentBlockName );
return {
firstParentClientId: _firstParentClientId,
isVisible:
_firstParentClientId &&
getBlockEditingMode( _firstParentClientId ) === 'default' &&
hasBlockSupport(
_parentBlockType,
'__experimentalParentSelector',
true
),
};
}, [] );
const blockInformation = useBlockDisplayInformation( firstParentClientId );

// Allows highlighting the parent block outline when focusing or hovering
// the parent block selector within the child.
const nodeRef = useRef();
const { gestures: showMoversGestures } = useShowMoversGestures( {
const showHoveredOrFocusedGestures = useShowHoveredOrFocusedGestures( {
ref: nodeRef,
onChange( isFocused ) {
if ( isFocused && isDistractionFree ) {
return;
}
toggleBlockHighlight( firstParentClientId, isFocused );
},
highlightParent: true,
} );

if ( ! isVisible ) {
Expand All @@ -80,7 +68,7 @@ export default function BlockParentSelector() {
className="block-editor-block-parent-selector"
key={ firstParentClientId }
ref={ nodeRef }
{ ...showMoversGestures }
{ ...showHoveredOrFocusedGestures }
>
<ToolbarButton
className="block-editor-block-parent-selector__button"
Expand Down
17 changes: 4 additions & 13 deletions packages/block-editor/src/components/block-settings-menu/block-settings-dropdown.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ import BlockHTMLConvertButton from './block-html-convert-button';
import __unstableBlockSettingsMenuFirstItem from './block-settings-menu-first-item';
import BlockSettingsMenuControls from '../block-settings-menu-controls';
import { store as blockEditorStore } from '../../store';
import { useShowMoversGestures } from '../block-toolbar/utils';
import { useShowHoveredOrFocusedGestures } from '../block-toolbar/utils';

const POPOVER_PROPS = {
className: 'block-editor-block-settings-menu__popover',
Expand Down Expand Up @@ -60,7 +60,6 @@ export function BlockSettingsDropdown( {
const firstBlockClientId = blockClientIds[ 0 ];
const {
firstParentClientId,
isDistractionFree,
onlyBlock,
parentBlockType,
previousBlockClientId,
Expand All @@ -73,7 +72,6 @@ export function BlockSettingsDropdown( {
getBlockRootClientId,
getPreviousBlockClientId,
getSelectedBlockClientIds,
getSettings,
getBlockAttributes,
} = select( blockEditorStore );

Expand All @@ -86,7 +84,6 @@ export function BlockSettingsDropdown( {

return {
firstParentClientId: _firstParentClientId,
isDistractionFree: getSettings().isDistractionFree,
onlyBlock: 1 === getBlockCount( _firstParentClientId ),
parentBlockType:
_firstParentClientId &&
Expand Down Expand Up @@ -122,8 +119,7 @@ export function BlockSettingsDropdown( {
}, [] );
const isMatch = __unstableUseShortcutEventMatch();

const { selectBlock, toggleBlockHighlight } =
useDispatch( blockEditorStore );
const { selectBlock } = useDispatch( blockEditorStore );
const hasSelectedBlocks = selectedBlockClientIds.length > 0;

const updateSelectionAfterDuplicate = useCallback(
Expand Down Expand Up @@ -168,14 +164,9 @@ export function BlockSettingsDropdown( {
// Allows highlighting the parent block outline when focusing or hovering
// the parent block selector within the child.
const selectParentButtonRef = useRef();
const { gestures: showParentOutlineGestures } = useShowMoversGestures( {
const showParentOutlineGestures = useShowHoveredOrFocusedGestures( {
ref: selectParentButtonRef,
onChange( isFocused ) {
if ( isFocused && isDistractionFree ) {
return;
}
toggleBlockHighlight( firstParentClientId, isFocused );
},
highlightParent: true,
} );

// This can occur when the selected block (the parent)
Expand Down
99 changes: 36 additions & 63 deletions packages/block-editor/src/components/block-toolbar/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import classnames from 'classnames';
/**
* WordPress dependencies
*/
import { useSelect, useDispatch } from '@wordpress/data';
import { useSelect } from '@wordpress/data';
import { useRef } from '@wordpress/element';
import { useViewportMatch } from '@wordpress/compose';
import {
Expand All @@ -29,76 +29,52 @@ import BlockSettingsMenu from '../block-settings-menu';
import { BlockLockToolbar } from '../block-lock';
import { BlockGroupToolbar } from '../convert-to-group-buttons';
import BlockEditVisuallyButton from '../block-edit-visually-button';
import { useShowMoversGestures } from './utils';
import { useShowHoveredOrFocusedGestures } from './utils';
import { store as blockEditorStore } from '../../store';
import __unstableBlockNameContext from './block-name-context';
import { unlock } from '../../lock-unlock';

const BlockToolbar = ( { hideDragHandle } ) => {
const { getSelectedBlockClientId } = useSelect( blockEditorStore );
const {
blockClientIds,
blockType,
hasFixedToolbar,
isDistractionFree,
isValid,
isVisual,
blockEditingMode,
} = useSelect( ( select ) => {
const {
getBlockName,
getBlockMode,
getSelectedBlockClientIds,
isBlockValid,
getBlockRootClientId,
getSettings,
getBlockEditingMode,
} = unlock( select( blockEditorStore ) );
const selectedBlockClientIds = getSelectedBlockClientIds();
const selectedBlockClientId = selectedBlockClientIds[ 0 ];
const blockRootClientId = getBlockRootClientId( selectedBlockClientId );
const settings = getSettings();

return {
blockClientIds: selectedBlockClientIds,
blockType:
selectedBlockClientId &&
getBlockType( getBlockName( selectedBlockClientId ) ),
hasFixedToolbar: settings.hasFixedToolbar,
isDistractionFree: settings.isDistractionFree,
rootClientId: blockRootClientId,
isValid: selectedBlockClientIds.every( ( id ) =>
isBlockValid( id )
),
isVisual: selectedBlockClientIds.every(
( id ) => getBlockMode( id ) === 'visual'
),
blockEditingMode: getBlockEditingMode( selectedBlockClientId ),
};
}, [] );
const { blockClientIds, blockType, isValid, isVisual, blockEditingMode } =
useSelect( ( select ) => {
const {
getBlockName,
getBlockMode,
getSelectedBlockClientIds,
isBlockValid,
getBlockRootClientId,
getBlockEditingMode,
} = unlock( select( blockEditorStore ) );
const selectedBlockClientIds = getSelectedBlockClientIds();
const selectedBlockClientId = selectedBlockClientIds[ 0 ];
const blockRootClientId = getBlockRootClientId(
selectedBlockClientId
);
return {
blockClientIds: selectedBlockClientIds,
blockType:
selectedBlockClientId &&
getBlockType( getBlockName( selectedBlockClientId ) ),
rootClientId: blockRootClientId,
isValid: selectedBlockClientIds.every( ( id ) =>
isBlockValid( id )
),
isVisual: selectedBlockClientIds.every(
( id ) => getBlockMode( id ) === 'visual'
),
blockEditingMode: getBlockEditingMode( selectedBlockClientId ),
};
}, [] );

const toolbarWrapperRef = useRef( null );

// Handles highlighting the current block outline on hover or focus of the
// block type toolbar area.
const { toggleBlockHighlight } = useDispatch( blockEditorStore );
const nodeRef = useRef();
const { showMovers, gestures: showMoversGestures } = useShowMoversGestures(
{
ref: nodeRef,
onChange( isFocused ) {
if ( isFocused && isDistractionFree ) {
return;
}
toggleBlockHighlight( getSelectedBlockClientId(), isFocused );
},
}
);
const showHoveredOrFocusedGestures = useShowHoveredOrFocusedGestures( {
ref: nodeRef,
} );

// Account for the cases where the block toolbar is rendered within the
// header area and not contextually to the block.
const displayHeaderToolbar =
useViewportMatch( 'medium', '<' ) || hasFixedToolbar;
const isLargeViewport = ! useViewportMatch( 'medium', '<' );

if ( blockType ) {
Expand All @@ -107,8 +83,6 @@ const BlockToolbar = ( { hideDragHandle } ) => {
}
}

const shouldShowMovers = displayHeaderToolbar || showMovers;

if ( blockClientIds.length === 0 ) {
return null;
}
Expand All @@ -119,7 +93,6 @@ const BlockToolbar = ( { hideDragHandle } ) => {
isReusableBlock( blockType ) || isTemplatePart( blockType );

const classes = classnames( 'block-editor-block-toolbar', {
'is-showing-movers': shouldShowMovers,
'is-synced': isSynced,
} );

Expand All @@ -130,7 +103,7 @@ const BlockToolbar = ( { hideDragHandle } ) => {
blockEditingMode === 'default' && <BlockParentSelector /> }
{ ( shouldShowVisualToolbar || isMultiToolbar ) &&
blockEditingMode === 'default' && (
<div ref={ nodeRef } { ...showMoversGestures }>
<div ref={ nodeRef } { ...showHoveredOrFocusedGestures }>
<ToolbarGroup className="block-editor-block-toolbar__block-controls">
<BlockSwitcher clientIds={ blockClientIds } />
{ ! isMultiToolbar && (
Expand Down
Loading

0 comments on commit a850b5a

Please sign in to comment.