UNPKG

@gechiui/block-editor

Version:
116 lines (105 loc) 4.08 kB
/** * GeChiUI dependencies */ import { useLayoutEffect, useMemo } from '@gechiui/element'; import { useSelect, useDispatch } from '@gechiui/data'; import isShallowEqual from '@gechiui/is-shallow-equal'; /** * Internal dependencies */ import { store as blockEditorStore } from '../../store'; import { getLayoutType } from '../../layouts'; /** * This hook is a side effect which updates the block-editor store when changes * happen to inner block settings. The given props are transformed into a * settings object, and if that is different from the current settings object in * the block-editor store, then the store is updated with the new settings which * came from props. * * @param {string} clientId The client ID of the block to update. * @param {string[]} allowedBlocks An array of block names which are permitted * in inner blocks. * @param {?Array} __experimentalDefaultBlock The default block to insert: [ blockName, { blockAttributes } ]. * @param {?Function|boolean} __experimentalDirectInsert If a default block should be inserted directly by the * appender. * @param {string} [templateLock] The template lock specified for the inner * blocks component. (e.g. "all") * @param {boolean} captureToolbars Whether or children toolbars should be shown * in the inner blocks component rather than on * the child block. * @param {string} orientation The direction in which the block * should face. * @param {Object} layout The layout object for the block container. */ export default function useNestedSettingsUpdate( clientId, allowedBlocks, __experimentalDefaultBlock, __experimentalDirectInsert, templateLock, captureToolbars, orientation, layout ) { const { updateBlockListSettings } = useDispatch( blockEditorStore ); const { blockListSettings, parentLock } = useSelect( ( select ) => { const rootClientId = select( blockEditorStore ).getBlockRootClientId( clientId ); return { blockListSettings: select( blockEditorStore ).getBlockListSettings( clientId ), parentLock: select( blockEditorStore ).getTemplateLock( rootClientId ), }; }, [ clientId ] ); // Memoize as inner blocks implementors often pass a new array on every // render. const _allowedBlocks = useMemo( () => allowedBlocks, allowedBlocks ); useLayoutEffect( () => { const newSettings = { allowedBlocks: _allowedBlocks, templateLock: templateLock === undefined ? parentLock : templateLock, }; // These values are not defined for RN, so only include them if they // are defined. if ( captureToolbars !== undefined ) { newSettings.__experimentalCaptureToolbars = captureToolbars; } // Orientation depends on layout, // ideally the separate orientation prop should be deprecated. if ( orientation !== undefined ) { newSettings.orientation = orientation; } else { const layoutType = getLayoutType( layout?.type ); newSettings.orientation = layoutType.getOrientation( layout ); } if ( __experimentalDefaultBlock !== undefined ) { newSettings.__experimentalDefaultBlock = __experimentalDefaultBlock; } if ( __experimentalDirectInsert !== undefined ) { newSettings.__experimentalDirectInsert = __experimentalDirectInsert; } if ( ! isShallowEqual( blockListSettings, newSettings ) ) { updateBlockListSettings( clientId, newSettings ); } }, [ clientId, blockListSettings, _allowedBlocks, __experimentalDefaultBlock, __experimentalDirectInsert, templateLock, parentLock, captureToolbars, orientation, updateBlockListSettings, layout, ] ); }