Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Make BlockPopover component public #61529

Merged
merged 5 commits into from
May 13, 2024
Merged

Make BlockPopover component public #61529

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
862dc76
make BlockPopover component public
gigitux May 9, 2024
b6092cc
create a public and a private version of blockpopover
gigitux May 10, 2024
2a1ef53
update import
gigitux May 10, 2024
6f6f6f9
fix unit test
gigitux May 10, 2024
82fb83c
pass ref in the right way
gigitux May 10, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions packages/block-editor/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -207,6 +207,12 @@ _Related_

Undocumented declaration.

### BlockPopover

_Related_

- <https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-popover/README.md>

### BlockPreview

BlockPreview renders a preview of a block or array of blocks.
Expand Down
2 changes: 1 addition & 1 deletion packages/block-editor/src/components/block-popover/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ This determines whether the block popover always shifts into the viewport or rem
- Required: No
- Default: `true`

## BlockPopoverInbetween
## BlockPopoverInbetween - Private Component

### Props

Expand Down
6 changes: 3 additions & 3 deletions packages/block-editor/src/components/block-popover/cover.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { useEffect, useState, useMemo, forwardRef } from '@wordpress/element';
* Internal dependencies
*/
import { __unstableUseBlockElement as useBlockElement } from '../block-list/use-block-props/use-block-refs';
import BlockPopover from '.';
import { PrivateBlockPopover } from '.';

function BlockPopoverCover(
{ clientId, bottomClientId, children, shift = false, ...props },
Expand All @@ -18,7 +18,7 @@ function BlockPopoverCover(
const selectedElement = useBlockElement( clientId );

return (
<BlockPopover
<PrivateBlockPopover
ref={ ref }
clientId={ clientId }
bottomClientId={ bottomClientId }
Expand All @@ -32,7 +32,7 @@ function BlockPopoverCover(
) : (
children
) }
</BlockPopover>
</PrivateBlockPopover>
);
}

Expand Down
23 changes: 22 additions & 1 deletion packages/block-editor/src/components/block-popover/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -152,4 +152,25 @@ function BlockPopover(
);
}

export default forwardRef( BlockPopover );
export const PrivateBlockPopover = forwardRef( BlockPopover );

const PublicBlockPopover = (
{ clientId, bottomClientId, children, ...props },
ref
) => (
<PrivateBlockPopover
{ ...props }
bottomClientId={ bottomClientId }
clientId={ clientId }
__unstableContentRef={ undefined }
__unstablePopoverSlot={ undefined }
ref={ ref }
>
{ children }
</PrivateBlockPopover>
);

/**
* @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-popover/README.md
*/
export default forwardRef( PublicBlockPopover );
6 changes: 3 additions & 3 deletions packages/block-editor/src/components/block-tools/block-toolbar-breadcrumb.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import clsx from 'clsx';
* Internal dependencies
*/
import BlockSelectionButton from './block-selection-button';
import BlockPopover from '../block-popover';
import { PrivateBlockPopover } from '../block-popover';
import useBlockToolbarPopoverProps from './use-block-toolbar-popover-props';
import useSelectedBlockToolProps from './use-selected-block-tool-props';

Expand All @@ -28,7 +28,7 @@ export default function BlockToolbarBreadcrumb( {
} );

return (
<BlockPopover
<PrivateBlockPopover
clientId={ capturingClientId || clientId }
bottomClientId={ lastClientId }
className={ clsx( 'block-editor-block-list__block-popover', {
Expand All @@ -41,6 +41,6 @@ export default function BlockToolbarBreadcrumb( {
clientId={ clientId }
rootClientId={ rootClientId }
/>
</BlockPopover>
</PrivateBlockPopover>
);
}
1 change: 1 addition & 0 deletions packages/block-editor/src/components/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -160,6 +160,7 @@ export {
export { default as __experimentalBlockPatternsList } from './block-patterns-list';
export { default as __experimentalPublishDateTimePicker } from './publish-date-time-picker';
export { default as __experimentalInspectorPopoverHeader } from './inspector-popover-header';
export { default as BlockPopover } from './block-popover';
export { useBlockEditingMode } from './block-editing-mode';

/*
Expand Down
2 changes: 2 additions & 0 deletions packages/block-editor/src/private-apis.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@ import {
} from './store/private-keys';
import { requiresWrapperOnCopy } from './components/writing-flow/utils';
import { PrivateRichText } from './components/rich-text/';
import { PrivateBlockPopover } from './components/block-popover';

/**
* Private @wordpress/block-editor APIs.
Expand Down Expand Up @@ -76,4 +77,5 @@ lock( privateApis, {
requiresWrapperOnCopy,
PrivateRichText,
reusableBlocksSelectKey,
PrivateBlockPopover,
} );
Loading