diff --git a/packages/block-editor/src/components/block-bindings-toolbar-indicator/style.scss b/packages/block-editor/src/components/block-bindings-toolbar-indicator/style.scss deleted file mode 100644 index f37276290ca713..00000000000000 --- a/packages/block-editor/src/components/block-bindings-toolbar-indicator/style.scss +++ /dev/null @@ -1,12 +0,0 @@ -.block-editor-block-bindings-toolbar-indicator__popover .components-popover__content { - min-width: 260px; - padding: $grid-unit-20; -} - -.block-editor-block-bindings-toolbar-indicator .block-editor-block-bindings-toolbar-indicator-icon.has-colors svg { - fill: var(--wp-block-synced-color); -} - -.editor-collapsible-block-toolbar .block-editor-block-bindings-toolbar-indicator { - height: 32px; -} diff --git a/packages/block-editor/src/components/block-toolbar/index.js b/packages/block-editor/src/components/block-toolbar/index.js index b215b06e5fdeee..cffb46413c5bbb 100644 --- a/packages/block-editor/src/components/block-toolbar/index.js +++ b/packages/block-editor/src/components/block-toolbar/index.js @@ -35,7 +35,7 @@ import { store as blockEditorStore } from '../../store'; import __unstableBlockNameContext from './block-name-context'; import NavigableToolbar from '../navigable-toolbar'; import Shuffle from './shuffle'; -import BlockBindingsIndicator from '../block-bindings-toolbar-indicator'; +import PatternOverridesToolbarIndicator from '../pattern-overrides-toolbar-indicator'; import { useHasBlockToolbar } from './use-has-block-toolbar'; import { canBindBlock } from '../../hooks/use-bindings-attributes'; /** @@ -179,7 +179,9 @@ export function PrivateBlockToolbar( { { isUsingBindings && hasParentPattern && canBindBlock( blockName ) && ( - + ) } { ( shouldShowVisualToolbar || isMultiToolbar ) && ( isDefaultEditingMode || isSynced ) && ( diff --git a/packages/block-editor/src/components/block-bindings-toolbar-indicator/index.js b/packages/block-editor/src/components/pattern-overrides-toolbar-indicator/index.js similarity index 83% rename from packages/block-editor/src/components/block-bindings-toolbar-indicator/index.js rename to packages/block-editor/src/components/pattern-overrides-toolbar-indicator/index.js index f1b74a8437c205..af359da542d37a 100644 --- a/packages/block-editor/src/components/block-bindings-toolbar-indicator/index.js +++ b/packages/block-editor/src/components/pattern-overrides-toolbar-indicator/index.js @@ -20,7 +20,13 @@ import { store as blockEditorStore } from '../../store'; import BlockIcon from '../block-icon'; import useBlockDisplayTitle from '../block-title/use-block-display-title'; -export default function BlockBindingsToolbarIndicator( { clientIds } ) { +/** + * This component is currently only for pattern overrides, which is a WP-only feature. + * Ideally, this should be moved to the `patterns` package once ready. + * @param {Object} props The component props. + * @param {Array} props.clientIds The client IDs of the selected blocks. + */ +export default function PatternOverridesToolbarIndicator( { clientIds } ) { const isSingleBlockSelected = clientIds.length === 1; const { icon, firstBlockName } = useSelect( ( select ) => { @@ -76,18 +82,18 @@ export default function BlockBindingsToolbarIndicator( { clientIds } ) { { ( toggleProps ) => ( diff --git a/packages/block-editor/src/components/pattern-overrides-toolbar-indicator/style.scss b/packages/block-editor/src/components/pattern-overrides-toolbar-indicator/style.scss new file mode 100644 index 00000000000000..90b2c1cdd79a5e --- /dev/null +++ b/packages/block-editor/src/components/pattern-overrides-toolbar-indicator/style.scss @@ -0,0 +1,12 @@ +.block-editor-pattern-overrides-toolbar-indicator__popover .components-popover__content { + min-width: 260px; + padding: $grid-unit-20; +} + +.block-editor-pattern-overrides-toolbar-indicator .block-editor-pattern-overrides-toolbar-indicator-icon.has-colors svg { + fill: var(--wp-block-synced-color); +} + +.editor-collapsible-block-toolbar .block-editor-pattern-overrides-toolbar-indicator { + height: 32px; +}