@wordpress/block-library
Version:
Block library for the WordPress editor.
8 lines (7 loc) • 3.51 kB
Source Map (JSON)
{
"version": 3,
"sources": ["../../src/tab-list/tab-movers.js"],
"sourcesContent": ["import { __, isRTL } from '@wordpress/i18n';\nimport {\n\tBlockControls,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { ToolbarButton } from '@wordpress/components';\nimport { chevronLeft, chevronRight } from '@wordpress/icons';\nimport { useSelect } from '@wordpress/data';\nimport useTabActions from '../tabs/use-tab-actions';\n\n/**\n * Block toolbar buttons that reorder the active tab one position before or after.\n * Reordering acts on the underlying core/tab-panel blocks; the tab-list labels\n * follow their panel automatically via useTabListItemsSync. The buttons are\n * disabled at the first/last position.\n *\n * @param {Object} props\n * @param {string} props.tabsClientId The client ID of the parent tabs block.\n * @return {React.JSX.Element} The toolbar control element.\n */\nexport default function TabMovers( { tabsClientId } ) {\n\tconst { moveTab } = useTabActions( tabsClientId );\n\tconst { tabCount, activeIndex } = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! tabsClientId ) {\n\t\t\t\treturn { tabCount: 0, activeIndex: 0 };\n\t\t\t}\n\t\t\tconst { getBlocks, getBlockAttributes } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\tconst tabsAttributes = getBlockAttributes( tabsClientId );\n\t\t\tconst tabPanels = getBlocks( tabsClientId ).find(\n\t\t\t\t( block ) => block.name === 'core/tab-panels'\n\t\t\t);\n\t\t\treturn {\n\t\t\t\ttabCount: tabPanels?.innerBlocks.length ?? 0,\n\t\t\t\tactiveIndex:\n\t\t\t\t\ttabsAttributes?.editorActiveTabIndex ??\n\t\t\t\t\ttabsAttributes?.activeTabIndex ??\n\t\t\t\t\t0,\n\t\t\t};\n\t\t},\n\t\t[ tabsClientId ]\n\t);\n\n\treturn (\n\t\t<BlockControls group=\"parent\">\n\t\t\t<ToolbarButton\n\t\t\t\tclassName=\"wp-block-tab-list__mover-button\"\n\t\t\t\ticon={ isRTL() ? chevronRight : chevronLeft }\n\t\t\t\tlabel={ __( 'Move tab before' ) }\n\t\t\t\tonClick={ () => moveTab( -1 ) }\n\t\t\t\tdisabled={ activeIndex <= 0 }\n\t\t\t\taccessibleWhenDisabled\n\t\t\t/>\n\t\t\t<ToolbarButton\n\t\t\t\tclassName=\"wp-block-tab-list__mover-button\"\n\t\t\t\ticon={ isRTL() ? chevronLeft : chevronRight }\n\t\t\t\tlabel={ __( 'Move tab after' ) }\n\t\t\t\tonClick={ () => moveTab( 1 ) }\n\t\t\t\tdisabled={ activeIndex >= tabCount - 1 }\n\t\t\t\taccessibleWhenDisabled\n\t\t\t/>\n\t\t</BlockControls>\n\t);\n}\n"],
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA0B;AAC1B,0BAGO;AACP,wBAA8B;AAC9B,mBAA0C;AAC1C,kBAA0B;AAC1B,6BAA0B;AAqCxB;AAzBa,SAAR,UAA4B,EAAE,aAAa,GAAI;AACrD,QAAM,EAAE,QAAQ,QAAI,uBAAAA,SAAe,YAAa;AAChD,QAAM,EAAE,UAAU,YAAY,QAAI;AAAA,IACjC,CAAE,WAAY;AACb,UAAK,CAAE,cAAe;AACrB,eAAO,EAAE,UAAU,GAAG,aAAa,EAAE;AAAA,MACtC;AACA,YAAM,EAAE,WAAW,mBAAmB,IACrC,OAAQ,oBAAAC,KAAiB;AAC1B,YAAM,iBAAiB,mBAAoB,YAAa;AACxD,YAAM,YAAY,UAAW,YAAa,EAAE;AAAA,QAC3C,CAAE,UAAW,MAAM,SAAS;AAAA,MAC7B;AACA,aAAO;AAAA,QACN,UAAU,WAAW,YAAY,UAAU;AAAA,QAC3C,aACC,gBAAgB,wBAChB,gBAAgB,kBAChB;AAAA,MACF;AAAA,IACD;AAAA,IACA,CAAE,YAAa;AAAA,EAChB;AAEA,SACC,6CAAC,qCAAc,OAAM,UACpB;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV,UAAO,mBAAM,IAAI,4BAAe;AAAA,QAChC,WAAQ,gBAAI,iBAAkB;AAAA,QAC9B,SAAU,MAAM,QAAS,EAAG;AAAA,QAC5B,UAAW,eAAe;AAAA,QAC1B,wBAAsB;AAAA;AAAA,IACvB;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV,UAAO,mBAAM,IAAI,2BAAc;AAAA,QAC/B,WAAQ,gBAAI,gBAAiB;AAAA,QAC7B,SAAU,MAAM,QAAS,CAAE;AAAA,QAC3B,UAAW,eAAe,WAAW;AAAA,QACrC,wBAAsB;AAAA;AAAA,IACvB;AAAA,KACD;AAEF;",
"names": ["useTabActions", "blockEditorStore"]
}