@wordpress/block-editor
Version:
77 lines (73 loc) • 2.27 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.useBlockEditingMode = useBlockEditingMode;
var _data = require("@wordpress/data");
var _element = require("@wordpress/element");
var _store = require("../../store");
var _context = require("../block-edit/context");
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* @typedef {'disabled'|'contentOnly'|'default'} BlockEditingMode
*/
/**
* Allows a block to restrict the user interface that is displayed for editing
* that block and its inner blocks.
*
* @example
* ```js
* function MyBlock( { attributes, setAttributes } ) {
* useBlockEditingMode( 'disabled' );
* return <div { ...useBlockProps() }></div>;
* }
* ```
*
* `mode` can be one of three options:
*
* - `'disabled'`: Prevents editing the block entirely, i.e. it cannot be
* selected.
* - `'contentOnly'`: Hides all non-content UI, e.g. auxiliary controls in the
* toolbar, the block movers, block settings.
* - `'default'`: Allows editing the block as normal.
*
* The mode is inherited by all of the block's inner blocks, unless they have
* their own mode.
*
* If called outside of a block context, the mode is applied to all blocks.
*
* @param {?BlockEditingMode} mode The editing mode to apply. If undefined, the
* current editing mode is not changed.
*
* @return {BlockEditingMode} The current editing mode.
*/
function useBlockEditingMode(mode) {
const context = (0, _context.useBlockEditContext)();
const {
clientId = ''
} = context;
const {
setBlockEditingMode,
unsetBlockEditingMode
} = (0, _data.useDispatch)(_store.store);
const globalBlockEditingMode = (0, _data.useSelect)(select =>
// Avoid adding the subscription if not needed!
clientId ? null : select(_store.store).getBlockEditingMode(), [clientId]);
(0, _element.useEffect)(() => {
if (mode) {
setBlockEditingMode(clientId, mode);
}
return () => {
if (mode) {
unsetBlockEditingMode(clientId);
}
};
}, [clientId, mode, setBlockEditingMode, unsetBlockEditingMode]);
return clientId ? context[_context.blockEditingModeKey] : globalBlockEditingMode;
}
//# sourceMappingURL=index.js.map