UNPKG

@wordpress/block-editor

Version:
8 lines (7 loc) 3.66 kB
{ "version": 3, "sources": ["../../../src/components/block-parent-selector/index.js"], "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { ToolbarButton } from '@wordpress/components';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useBlockDisplayInformation from '../use-block-display-information';\nimport BlockIcon from '../block-icon';\nimport { useShowHoveredOrFocusedGestures } from '../block-toolbar/utils';\nimport { store as blockEditorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\n\n/**\n * Block parent selector component, displaying the hierarchy of the\n * current block selection as a single icon to \"go up\" a level.\n *\n * @return {Component} Parent block selector.\n */\nexport default function BlockParentSelector() {\n\tconst { selectBlock } = useDispatch( blockEditorStore );\n\tconst { parentClientId } = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetBlockParents,\n\t\t\tgetSelectedBlockClientId,\n\t\t\tgetParentSectionBlock,\n\t\t} = unlock( select( blockEditorStore ) );\n\t\tconst selectedBlockClientId = getSelectedBlockClientId();\n\t\tconst parentSection = getParentSectionBlock( selectedBlockClientId );\n\t\tconst parents = getBlockParents( selectedBlockClientId );\n\t\tconst _parentClientId = parentSection ?? parents[ parents.length - 1 ];\n\t\treturn {\n\t\t\tparentClientId: _parentClientId,\n\t\t};\n\t}, [] );\n\tconst blockInformation = useBlockDisplayInformation( parentClientId );\n\n\t// Allows highlighting the parent block outline when focusing or hovering\n\t// the parent block selector within the child.\n\tconst nodeRef = useRef();\n\tconst showHoveredOrFocusedGestures = useShowHoveredOrFocusedGestures( {\n\t\tref: nodeRef,\n\t\thighlightParent: true,\n\t} );\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"block-editor-block-parent-selector\"\n\t\t\tkey={ parentClientId }\n\t\t\tref={ nodeRef }\n\t\t\t{ ...showHoveredOrFocusedGestures }\n\t\t>\n\t\t\t<ToolbarButton\n\t\t\t\tclassName=\"block-editor-block-parent-selector__button\"\n\t\t\t\tonClick={ () => selectBlock( parentClientId ) }\n\t\t\t\tlabel={ sprintf(\n\t\t\t\t\t/* translators: %s: Name of the block's parent. */\n\t\t\t\t\t__( 'Select parent block: %s' ),\n\t\t\t\t\tblockInformation?.title\n\t\t\t\t) }\n\t\t\t\tshowTooltip\n\t\t\t\ticon={ <BlockIcon icon={ blockInformation?.icon } /> }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n"], "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAA8B;AAC9B,kBAAuC;AACvC,kBAA4B;AAC5B,qBAAuB;AAKvB,2CAAuC;AACvC,wBAAsB;AACtB,mBAAgD;AAChD,mBAA0C;AAC1C,yBAAuB;AAkDZ;AA1CI,SAAR,sBAAuC;AAC7C,QAAM,EAAE,YAAY,QAAI,yBAAa,aAAAA,KAAiB;AACtD,QAAM,EAAE,eAAe,QAAI,uBAAW,CAAE,WAAY;AACnD,UAAM;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACD,QAAI,2BAAQ,OAAQ,aAAAA,KAAiB,CAAE;AACvC,UAAM,wBAAwB,yBAAyB;AACvD,UAAM,gBAAgB,sBAAuB,qBAAsB;AACnE,UAAM,UAAU,gBAAiB,qBAAsB;AACvD,UAAM,kBAAkB,iBAAiB,QAAS,QAAQ,SAAS,CAAE;AACrE,WAAO;AAAA,MACN,gBAAgB;AAAA,IACjB;AAAA,EACD,GAAG,CAAC,CAAE;AACN,QAAM,uBAAmB,qCAAAC,SAA4B,cAAe;AAIpE,QAAM,cAAU,uBAAO;AACvB,QAAM,mCAA+B,8CAAiC;AAAA,IACrE,KAAK;AAAA,IACL,iBAAiB;AAAA,EAClB,CAAE;AAEF,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MAEV,KAAM;AAAA,MACJ,GAAG;AAAA,MAEL;AAAA,QAAC;AAAA;AAAA,UACA,WAAU;AAAA,UACV,SAAU,MAAM,YAAa,cAAe;AAAA,UAC5C,WAAQ;AAAA;AAAA,gBAEP,gBAAI,yBAA0B;AAAA,YAC9B,kBAAkB;AAAA,UACnB;AAAA,UACA,aAAW;AAAA,UACX,MAAO,4CAAC,kBAAAC,SAAA,EAAU,MAAO,kBAAkB,MAAO;AAAA;AAAA,MACnD;AAAA;AAAA,IAdM;AAAA,EAeP;AAEF;", "names": ["blockEditorStore", "useBlockDisplayInformation", "BlockIcon"] }