@wordpress/block-editor
Version:
95 lines (88 loc) • 2.51 kB
JavaScript
/**
* WordPress dependencies
*/
import { useSelect } from '@wordpress/data';
import {
getBlockType,
__experimentalGetBlockLabel as getBlockLabel,
isReusableBlock,
} from '@wordpress/blocks';
/**
* Internal dependencies
*/
import useBlockDisplayInformation from '../use-block-display-information';
import { store as blockEditorStore } from '../../store';
/**
* Returns the block's configured title as a string, or empty if the title
* cannot be determined.
*
* @example
*
* ```js
* useBlockDisplayTitle( { clientId: 'afd1cb17-2c08-4e7a-91be-007ba7ddc3a1', maximumLength: 17 } );
* ```
*
* @param {Object} props
* @param {string} props.clientId Client ID of block.
* @param {number|undefined} props.maximumLength The maximum length that the block title string may be before truncated.
* @param {string|undefined} props.context The context to pass to `getBlockLabel`.
* @return {?string} Block title.
*/
export default function useBlockDisplayTitle( {
clientId,
maximumLength,
context,
} ) {
const { attributes, name, reusableBlockTitle } = useSelect(
( select ) => {
if ( ! clientId ) {
return {};
}
const {
getBlockName,
getBlockAttributes,
__experimentalGetReusableBlockTitle,
} = select( blockEditorStore );
const blockName = getBlockName( clientId );
if ( ! blockName ) {
return {};
}
const isReusable = isReusableBlock( getBlockType( blockName ) );
return {
attributes: getBlockAttributes( clientId ),
name: blockName,
reusableBlockTitle:
isReusable &&
__experimentalGetReusableBlockTitle(
getBlockAttributes( clientId ).ref
),
};
},
[ clientId ]
);
const blockInformation = useBlockDisplayInformation( clientId );
if ( ! name || ! blockInformation ) {
return null;
}
const blockType = getBlockType( name );
const blockLabel = blockType
? getBlockLabel( blockType, attributes, context )
: null;
const label = reusableBlockTitle || blockLabel;
// Label will fallback to the title if no label is defined for the current
// label context. If the label is defined we prioritize it over a
// possible block variation title match.
const blockTitle =
label && label !== blockType.title ? label : blockInformation.title;
if (
maximumLength &&
maximumLength > 0 &&
blockTitle.length > maximumLength
) {
const omission = '...';
return (
blockTitle.slice( 0, maximumLength - omission.length ) + omission
);
}
return blockTitle;
}