| @@ -175,23 +175,37 @@ | ||
| 175 | 175 | } |
| 176 | 176 | } |
| 177 | 177 | }, |
| 178 | 178 | callbacks: { |
| 179 | - /** | |
| 180 | - * When the tabs are initialized, we need to check if there is a hash in the url and if so if it exists in the current tabsList, set the active tab to that index. | |
| 181 | - * | |
| 182 | - */ | |
| 183 | - onTabsInit: () => { | |
| 179 | + activateTabByHash: () => { | |
| 184 | 180 | const { tabsList } = state; |
| 185 | - if (tabsList.length === 0) { | |
| 181 | + if (!tabsList || tabsList.length === 0) { | |
| 186 | 182 | return; |
| 187 | 183 | } |
| 188 | - const { hash } = window.location; | |
| 189 | - const tabId = hash.replace("#", ""); | |
| 190 | - const tabIndex = tabsList.findIndex((t) => t === tabId); | |
| 191 | - if (tabIndex >= 0) { | |
| 192 | - actions.setActiveTab(tabIndex, true); | |
| 184 | + const targetElement = document.querySelector(":target"); | |
| 185 | + if (!targetElement) { | |
| 186 | + return; | |
| 193 | 187 | } |
| 188 | + const panelIndex = tabsList.findIndex( | |
| 189 | + (t) => t === targetElement.id | |
| 190 | + ); | |
| 191 | + if (panelIndex >= 0) { | |
| 192 | + actions.setActiveTab(panelIndex, true); | |
| 193 | + return; | |
| 194 | + } | |
| 195 | + let panel = targetElement.closest(".wp-block-tab-panel"); | |
| 196 | + let tabIndex = -1; | |
| 197 | + while (panel && tabIndex < 0) { | |
| 198 | + tabIndex = tabsList.findIndex((t) => t === panel.id); | |
| 199 | + panel = panel.parentElement?.closest(".wp-block-tab-panel") ?? null; | |
| 200 | + } | |
| 201 | + if (tabIndex < 0) { | |
| 202 | + return; | |
| 203 | + } | |
| 204 | + actions.setActiveTab(tabIndex); | |
| 205 | + window.setTimeout(() => { | |
| 206 | + targetElement.scrollIntoView(); | |
| 207 | + }, 0); | |
| 194 | 208 | } |
| 195 | 209 | } |
| 196 | 210 | }, |
| 197 | 211 | { |
