UNPKG

@wordpress/block-library

Version:
8 lines (7 loc) 3.27 kB
{ "version": 3, "sources": ["../../src/tabs/use-tab-list-items-sync.js"], "sourcesContent": ["import { store as blockEditorStore } from '@wordpress/block-editor';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useEffect } from '@wordpress/element';\n\nconst EMPTY_ARRAY = [];\n\n/**\n * Keep the tab-list block's `tabs` attribute in sync with the tab-panel blocks.\n *\n * Whenever the list of core/tab-panel blocks changes (add, remove, reorder, or\n * label edit), this hook updates the `tabs` attribute on the core/tab-list\n * block so that save.js can render the correct buttons.\n *\n * @param {string} tabsClientId Client ID of the core/tabs block.\n */\nexport default function useTabListItemsSync( tabsClientId ) {\n\tconst { tabPanels, tabListClientId } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlocks } = select( blockEditorStore );\n\t\t\tconst innerBlocks = getBlocks( tabsClientId );\n\n\t\t\tconst tabPanelsBlock = innerBlocks.find(\n\t\t\t\t( block ) => block.name === 'core/tab-panels'\n\t\t\t);\n\t\t\tconst tabList = innerBlocks.find(\n\t\t\t\t( block ) => block.name === 'core/tab-list'\n\t\t\t);\n\n\t\t\treturn {\n\t\t\t\ttabPanels: tabPanelsBlock?.innerBlocks ?? EMPTY_ARRAY,\n\t\t\t\ttabListClientId: tabList?.clientId ?? null,\n\t\t\t};\n\t\t},\n\t\t[ tabsClientId ]\n\t);\n\n\tconst { updateBlockAttributes, __unstableMarkNextChangeAsNotPersistent } =\n\t\tuseDispatch( blockEditorStore );\n\tconst { getBlockAttributes } = useSelect( blockEditorStore );\n\n\tuseEffect( () => {\n\t\tif ( ! tabListClientId ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst newTabs = tabPanels.map( ( tab ) => ( {\n\t\t\tlabel: tab.attributes.label || '',\n\t\t} ) );\n\n\t\t// Skip the update when the stored tabs already match the derived ones.\n\t\tconst currentTabs = getBlockAttributes( tabListClientId )?.tabs ?? [];\n\t\tif ( JSON.stringify( newTabs ) === JSON.stringify( currentTabs ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\tupdateBlockAttributes( tabListClientId, { tabs: newTabs } );\n\t}, [\n\t\ttabPanels,\n\t\ttabListClientId,\n\t\tgetBlockAttributes,\n\t\tupdateBlockAttributes,\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t] );\n}\n"], "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAA0C;AAC1C,kBAAuC;AACvC,qBAA0B;AAE1B,IAAM,cAAc,CAAC;AAWN,SAAR,oBAAsC,cAAe;AAC3D,QAAM,EAAE,WAAW,gBAAgB,QAAI;AAAA,IACtC,CAAE,WAAY;AACb,YAAM,EAAE,UAAU,IAAI,OAAQ,oBAAAA,KAAiB;AAC/C,YAAM,cAAc,UAAW,YAAa;AAE5C,YAAM,iBAAiB,YAAY;AAAA,QAClC,CAAE,UAAW,MAAM,SAAS;AAAA,MAC7B;AACA,YAAM,UAAU,YAAY;AAAA,QAC3B,CAAE,UAAW,MAAM,SAAS;AAAA,MAC7B;AAEA,aAAO;AAAA,QACN,WAAW,gBAAgB,eAAe;AAAA,QAC1C,iBAAiB,SAAS,YAAY;AAAA,MACvC;AAAA,IACD;AAAA,IACA,CAAE,YAAa;AAAA,EAChB;AAEA,QAAM,EAAE,uBAAuB,wCAAwC,QACtE,yBAAa,oBAAAA,KAAiB;AAC/B,QAAM,EAAE,mBAAmB,QAAI,uBAAW,oBAAAA,KAAiB;AAE3D,gCAAW,MAAM;AAChB,QAAK,CAAE,iBAAkB;AACxB;AAAA,IACD;AAEA,UAAM,UAAU,UAAU,IAAK,CAAE,SAAW;AAAA,MAC3C,OAAO,IAAI,WAAW,SAAS;AAAA,IAChC,EAAI;AAGJ,UAAM,cAAc,mBAAoB,eAAgB,GAAG,QAAQ,CAAC;AACpE,QAAK,KAAK,UAAW,OAAQ,MAAM,KAAK,UAAW,WAAY,GAAI;AAClE;AAAA,IACD;AAEA,4CAAwC;AACxC,0BAAuB,iBAAiB,EAAE,MAAM,QAAQ,CAAE;AAAA,EAC3D,GAAG;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAE;AACH;", "names": ["blockEditorStore"] }