@@ -7,45 +7,10 @@ export default class extends Controller {
77 static targets = [ "tab" ] ;
88
99 connect ( ) {
10- // this.initializeFirstTabs();
1110 this . activateTabFromHash ( ) ;
1211 this . setupTabChangeListener ( ) ;
1312 }
1413
15- // initializeFirstTabs() {
16- // // Ensure the first tab in each group is active and shown
17- // const tabGroups = this.element.querySelectorAll('[data-bs-target]');
18- // tabGroups.forEach((tab) => {
19- // // Skip tabs inside the localized-fields class
20- // if (tab.closest('.localized-fields')) return;
21-
22- // const tabPane = this.element.querySelector(tab.dataset.bsTarget);
23- // if (tabPane) {
24- // const nestedTabs = tabPane.querySelectorAll('[data-bs-target]');
25- // if (nestedTabs.length > 0) {
26- // const firstNestedTab = nestedTabs[0];
27- // const firstNestedTabTarget = tabPane.querySelector(firstNestedTab.dataset.bsTarget);
28-
29- // nestedTabs.forEach((nestedTab) => {
30- // nestedTab.classList.remove('active');
31- // });
32- // firstNestedTab.classList.add('active');
33-
34- // if (firstNestedTabTarget) {
35- // const nestedTabPanes = tabPane.querySelectorAll('.tab-pane');
36- // nestedTabPanes.forEach((nestedPane) => {
37- // nestedPane.classList.remove('active');
38- // nestedPane.classList.remove('show');
39- // });
40-
41- // firstNestedTabTarget.classList.add('active');
42- // firstNestedTabTarget.classList.add('show');
43- // }
44- // }
45- // }
46- // });
47- // }
48-
4914 activateTabFromHash ( ) {
5015 const hash = window . location . hash ;
5116 if ( hash ) {
@@ -70,29 +35,6 @@ export default class extends Controller {
7035 if ( tabTarget ) {
7136 tabTarget . classList . add ( 'active' ) ;
7237 tabTarget . classList . add ( 'show' ) ;
73-
74- // // Activate the first tab inside the activated tab pane
75- // const nestedTabs = tabTarget.querySelectorAll('[data-bs-target]');
76- // if (nestedTabs.length > 0) {
77- // const firstNestedTab = nestedTabs[0];
78- // const firstNestedTabTarget = tabTarget.querySelector(firstNestedTab.dataset.bsTarget);
79-
80- // nestedTabs.forEach((nestedTab) => {
81- // nestedTab.classList.remove('active');
82- // });
83- // firstNestedTab.classList.add('active');
84-
85- // if (firstNestedTabTarget) {
86- // const nestedTabPanes = tabTarget.querySelectorAll('.tab-pane');
87- // nestedTabPanes.forEach((nestedPane) => {
88- // nestedPane.classList.remove('active');
89- // nestedPane.classList.remove('show');
90- // });
91-
92- // firstNestedTabTarget.classList.add('active');
93- // firstNestedTabTarget.classList.add('show');
94- // }
95- // }
9638 }
9739
9840 // Check if the selected tab is nested and activate its parent tab
@@ -108,13 +50,14 @@ export default class extends Controller {
10850 }
10951
11052 setupTabChangeListener ( ) {
111- const tabLinks = this . tabTargets ;
112- tabLinks . forEach ( ( link ) => {
113- // Skip tabs inside the localized-fields class
53+ this . tabTargets . forEach ( ( link ) => {
11454 if ( link . closest ( '.localized-fields' ) ) return ;
11555
11656 link . addEventListener ( "shown.bs.tab" , ( event ) => {
117- history . pushState ( { } , "" , event . target . getAttribute ( "data-bs-target" ) )
57+ const targetHash = event . target . getAttribute ( "data-bs-target" ) ;
58+ if ( targetHash ) {
59+ history . pushState ( { } , "" , targetHash ) ; // Add the hash to the address bar
60+ }
11861 } ) ;
11962 } ) ;
12063 }
0 commit comments