@wordpress/block-editor
Version:
8 lines (7 loc) • 10 kB
Source Map (JSON)
{
"version": 3,
"sources": ["../../../src/components/inspector-controls-tabs/index.js"],
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tIcon,\n\tTooltip,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useEffect, useState, useRef } from '@wordpress/element';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport { useSelect, useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { TAB_SETTINGS, TAB_STYLES, TAB_LIST_VIEW, TAB_CONTENT } from './utils';\nimport SettingsTab from './settings-tab';\nimport StylesTab from './styles-tab';\nimport ContentTab from './content-tab';\nimport { ListViewContentPopover } from '../inspector-controls/list-view-content-popover';\nimport InspectorControls from '../inspector-controls';\nimport { unlock } from '../../lock-unlock';\nimport { store as blockEditorStore } from '../../store';\n\nconst { Tabs } = unlock( componentsPrivateApis );\n\nexport default function InspectorControlsTabs( {\n\tblockName,\n\tclientId,\n\thasBlockStyles,\n\ttabs,\n\tisSectionBlock,\n\tcontentClientIds,\n} ) {\n\tconst listViewRef = useRef( null );\n\tconst showIconLabels = useSelect( ( select ) => {\n\t\treturn select( preferencesStore ).get( 'core', 'showIconLabels' );\n\t}, [] );\n\n\t// Get any requested inspector tab (used for initial state when programmatically switching)\n\tconst { requestedTab } = useSelect( ( select ) => ( {\n\t\trequestedTab: unlock(\n\t\t\tselect( blockEditorStore )\n\t\t).getRequestedInspectorTab(),\n\t} ) );\n\n\tconst [ selectedTabId, setSelectedTabId ] = useState(\n\t\t() => requestedTab?.tabName ?? tabs[ 0 ]?.name\n\t);\n\tconst hasUserSelectionRef = useRef( false );\n\tconst isProgrammaticSwitchRef = useRef( false );\n\tconst {\n\t\t__unstableSetOpenListViewPanel: setOpenListViewPanel,\n\t\t__unstableIncrementListViewExpandRevision:\n\t\t\tincrementListViewExpandRevision,\n\t\t__unstableSetAllListViewPanelsOpen: setAllListViewPanelsOpen,\n\t} = useDispatch( blockEditorStore );\n\tconst { clearRequestedInspectorTab } = unlock(\n\t\tuseDispatch( blockEditorStore )\n\t);\n\n\t// Reset when switching blocks\n\tuseEffect( () => {\n\t\thasUserSelectionRef.current = false;\n\t}, [ clientId ] );\n\n\t// Handle explicit inspector tab requests (panel opening, refs, clear).\n\t// Tab state is initialized from requestedTab above.\n\tuseEffect( () => {\n\t\tif ( ! requestedTab ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Switch to the requested tab\n\t\tsetSelectedTabId( requestedTab.tabName );\n\n\t\t// Handle tab-specific options\n\t\tif (\n\t\t\trequestedTab.tabName === TAB_LIST_VIEW.name &&\n\t\t\trequestedTab.options?.openPanel\n\t\t) {\n\t\t\t// Open the specific panel for List View\n\t\t\tsetOpenListViewPanel( requestedTab.options.openPanel );\n\t\t\tincrementListViewExpandRevision();\n\t\t}\n\n\t\t// Mark as handled (programmatic switch)\n\t\tisProgrammaticSwitchRef.current = true;\n\t\thasUserSelectionRef.current = true;\n\n\t\t// Clear the request\n\t\tclearRequestedInspectorTab();\n\t}, [\n\t\trequestedTab,\n\t\tsetOpenListViewPanel,\n\t\tincrementListViewExpandRevision,\n\t\tclearRequestedInspectorTab,\n\t] );\n\n\t// Initialize List View panels when the tab is selected and clientId changes\n\tuseEffect( () => {\n\t\tif (\n\t\t\tselectedTabId === TAB_LIST_VIEW.name &&\n\t\t\t! hasUserSelectionRef.current\n\t\t) {\n\t\t\tsetAllListViewPanelsOpen();\n\t\t\tincrementListViewExpandRevision();\n\t\t}\n\t}, [\n\t\tclientId,\n\t\tselectedTabId,\n\t\tsetAllListViewPanelsOpen,\n\t\tincrementListViewExpandRevision,\n\t] );\n\n\t// Auto-select first available tab unless user has made a selection\n\tuseEffect( () => {\n\t\tif (\n\t\t\t! tabs?.length ||\n\t\t\t( hasUserSelectionRef.current &&\n\t\t\t\ttabs.some( ( tab ) => tab.name === selectedTabId ) )\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst firstTabName = tabs[ 0 ]?.name;\n\t\tif ( selectedTabId !== firstTabName ) {\n\t\t\tsetSelectedTabId( firstTabName );\n\t\t}\n\t}, [ tabs, selectedTabId ] );\n\n\tconst handleTabSelect = ( tabId ) => {\n\t\tsetSelectedTabId( tabId );\n\t\thasUserSelectionRef.current = true;\n\n\t\t// If manually switching to List View tab (not via click-through), open all panels\n\t\tif (\n\t\t\ttabId === TAB_LIST_VIEW.name &&\n\t\t\t! isProgrammaticSwitchRef.current\n\t\t) {\n\t\t\tsetAllListViewPanelsOpen();\n\t\t\tincrementListViewExpandRevision();\n\t\t}\n\n\t\t// Reset the flag\n\t\tisProgrammaticSwitchRef.current = false;\n\t};\n\n\tconst hasListViewTab = tabs.some(\n\t\t( tab ) => tab.name === TAB_LIST_VIEW.name\n\t);\n\n\tconst switchToListView = ( targetClientId ) => {\n\t\tif ( hasListViewTab ) {\n\t\t\t// Open only the target panel\n\t\t\tsetOpenListViewPanel( targetClientId );\n\t\t\tincrementListViewExpandRevision();\n\t\t\t// Mark this as a programmatic switch\n\t\t\tisProgrammaticSwitchRef.current = true;\n\t\t\thandleTabSelect( TAB_LIST_VIEW.name );\n\t\t}\n\t};\n\n\treturn (\n\t\t<div className=\"block-editor-block-inspector__tabs\">\n\t\t\t<Tabs\n\t\t\t\tselectedTabId={ selectedTabId }\n\t\t\t\tonSelect={ handleTabSelect }\n\t\t\t\tkey={ clientId }\n\t\t\t>\n\t\t\t\t<Tabs.TabList>\n\t\t\t\t\t{ tabs.map( ( tab ) =>\n\t\t\t\t\t\tshowIconLabels ? (\n\t\t\t\t\t\t\t<Tabs.Tab key={ tab.name } tabId={ tab.name }>\n\t\t\t\t\t\t\t\t{ tab.title }\n\t\t\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<Tooltip text={ tab.title } key={ tab.name }>\n\t\t\t\t\t\t\t\t<Tabs.Tab\n\t\t\t\t\t\t\t\t\ttabId={ tab.name }\n\t\t\t\t\t\t\t\t\taria-label={ tab.title }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<Icon icon={ tab.icon } />\n\t\t\t\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t)\n\t\t\t\t\t) }\n\t\t\t\t</Tabs.TabList>\n\t\t\t\t<Tabs.TabPanel tabId={ TAB_CONTENT.name } focusable={ false }>\n\t\t\t\t\t<ContentTab\n\t\t\t\t\t\tcontentClientIds={ contentClientIds }\n\t\t\t\t\t\tonSwitchToListView={ switchToListView }\n\t\t\t\t\t\thasListViewTab={ hasListViewTab }\n\t\t\t\t\t/>\n\t\t\t\t\t<InspectorControls.Slot group=\"content\" />\n\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t<Tabs.TabPanel tabId={ TAB_LIST_VIEW.name } focusable={ false }>\n\t\t\t\t\t<InspectorControls.Slot group=\"list\" ref={ listViewRef } />\n\t\t\t\t\t<ListViewContentPopover listViewRef={ listViewRef } />\n\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t<Tabs.TabPanel tabId={ TAB_SETTINGS.name } focusable={ false }>\n\t\t\t\t\t<SettingsTab showAdvancedControls={ !! blockName } />\n\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t<Tabs.TabPanel tabId={ TAB_STYLES.name } focusable={ false }>\n\t\t\t\t\t<StylesTab\n\t\t\t\t\t\tblockName={ blockName }\n\t\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\t\thasBlockStyles={ hasBlockStyles }\n\t\t\t\t\t\tisSectionBlock={ isSectionBlock }\n\t\t\t\t\t\tcontentClientIds={ contentClientIds }\n\t\t\t\t\t/>\n\t\t\t\t</Tabs.TabPanel>\n\t\t\t</Tabs>\n\t\t</div>\n\t);\n}\n"],
"mappings": "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",
"names": []
}