← All changes | assets/js/tabs-preview-handler.js +3 -66 4.2.0-beta2 → 4.0.0-dev4 View file →

		@@ -11,9 +11,8 @@
11	11
12	12	var _frontendHandlers = __webpack_require__(/*! @elementor/frontend-handlers */ "@elementor/frontend-handlers");
13	13	var _alpinejs = __webpack_require__(/*! @elementor/alpinejs */ "@elementor/alpinejs");
14	14	var _utils = __webpack_require__(/*! ./utils */ "../modules/atomic-widgets/elements/atomic-tabs/handlers/utils.js");
15		-var _editorTabsState = __webpack_require__(/*! ./editor-tabs-state */ "../modules/atomic-widgets/elements/atomic-tabs/handlers/editor-tabs-state.js");
16	15	(0, _frontendHandlers.register)({
17	16	elementType: 'e-tabs',
18	17	id: 'e-tabs-preview-handler',
19	18	callback: ({
		@@ -33,78 +32,20 @@
33	32	if (!targetElement) {
34	33	return;
35	34	}
36	35	const targetIndex = (0, _utils.getIndex)(targetElement, type);
37		- (0, _editorTabsState.setActiveTabIndex)(element.dataset.id, targetIndex);
	36	+ _alpinejs.Alpine.$data(element).activeTab = (0, _utils.getTabId)(element.dataset.id, targetIndex);
38	37	}, {
39	38	signal
40	39	});
41	40
42	41	// Re-initialize Alpine to sync with editor DOM manipulations that bypass Alpine's reactivity.
43		- listenToChildren([_utils.TAB_ELEMENT_TYPE, _utils.TAB_CONTENT_ELEMENT_TYPE]).render(event => {
44		- const childElement = event.detail.element;
45		- const nearestTabs = childElement.closest('[data-e-type="e-tabs"]');
46		- if (nearestTabs !== element) {
47		- return;
48		- }
49		- (0, _alpinejs.refreshTree)(element);
50		- });
	42	+ listenToChildren([_utils.TAB_ELEMENT_TYPE, _utils.TAB_CONTENT_ELEMENT_TYPE]).render(() => (0, _alpinejs.refreshTree)(element));
51	43	}
52	44	});
53	45
54	46	/***/ }),
55	47
56		-/***/ "../modules/atomic-widgets/elements/atomic-tabs/handlers/editor-tabs-state.js":
57		-/*!************************************************************************************!*\
58		- !*** ../modules/atomic-widgets/elements/atomic-tabs/handlers/editor-tabs-state.js ***!
59		- \************************************************************************************/
60		-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
61		-
62		-
63		-
64		-Object.defineProperty(exports, "__esModule", ({
65		- value: true
66		-}));
67		-exports.getActiveTabId = getActiveTabId;
68		-exports.setActiveTabIndex = setActiveTabIndex;
69		-exports.validateActiveTab = validateActiveTab;
70		-var _alpinejs = __webpack_require__(/*! @elementor/alpinejs */ "@elementor/alpinejs");
71		-var _utils = __webpack_require__(/*! ./utils */ "../modules/atomic-widgets/elements/atomic-tabs/handlers/utils.js");
72		-/**
73		- * @typedef {Record<string, number>} TabsState - Maps tabsId to the selected tab index.
74		- */
75		-const STORE_NAME = 'editor-atomic-tabs-state';
76		-function ensureStore() {
77		- if (!_alpinejs.Alpine.store(STORE_NAME)) {
78		- _alpinejs.Alpine.store(STORE_NAME, /** @type {TabsState} */{});
79		- }
80		- return /** @type {TabsState} */_alpinejs.Alpine.store(STORE_NAME);
81		-}
82		-function getActiveTabId(tabsId, fallback) {
83		- const store = ensureStore();
84		- const storedIndex = store[tabsId];
85		- if (storedIndex === undefined) {
86		- return fallback;
87		- }
88		- return (0, _utils.getTabId)(tabsId, storedIndex);
89		-}
90		-function setActiveTabIndex(tabsId, index) {
91		- const store = ensureStore();
92		- store[tabsId] = index;
93		-}
94		-function validateActiveTab(tabsId, tabCount) {
95		- const store = ensureStore();
96		- const storedIndex = store[tabsId];
97		- if (storedIndex === undefined) {
98		- return;
99		- }
100		- if (storedIndex >= tabCount) {
101		- delete store[tabsId];
102		- }
103		-}
104		-
105		-/***/ }),
106		-
107	48	/***/ "../modules/atomic-widgets/elements/atomic-tabs/handlers/utils.js":
108	49	/*!************************************************************************!*\
109	50	!*** ../modules/atomic-widgets/elements/atomic-tabs/handlers/utils.js ***!
110	51	\************************************************************************/
		@@ -114,9 +55,9 @@
114	55
115	56	Object.defineProperty(exports, "__esModule", ({
116	57	value: true
117	58	}));
118		-exports.getTabId = exports.getTabContentId = exports.getNextTab = exports.getIndex = exports.getDirectTabCount = exports.getChildren = exports.TAB_ELEMENT_TYPE = exports.TAB_CONTENT_ELEMENT_TYPE = exports.TABS_MENU_ELEMENT_TYPE = exports.TABS_CONTENT_AREA_ELEMENT_TYPE = void 0;
	59	+exports.getTabId = exports.getTabContentId = exports.getNextTab = exports.getIndex = exports.getChildren = exports.TAB_ELEMENT_TYPE = exports.TAB_CONTENT_ELEMENT_TYPE = exports.TABS_MENU_ELEMENT_TYPE = exports.TABS_CONTENT_AREA_ELEMENT_TYPE = void 0;
119	60	__webpack_require__(/*! core-js/modules/esnext.iterator.constructor.js */ "../node_modules/core-js/modules/esnext.iterator.constructor.js");
120	61	__webpack_require__(/*! core-js/modules/esnext.iterator.filter.js */ "../node_modules/core-js/modules/esnext.iterator.filter.js");
121	62	const TAB_ELEMENT_TYPE = exports.TAB_ELEMENT_TYPE = 'e-tab';
122	63	const TAB_CONTENT_ELEMENT_TYPE = exports.TAB_CONTENT_ELEMENT_TYPE = 'e-tab-content';
		@@ -143,12 +84,8 @@
143	84	const children = getChildren(el, elementType);
144	85	return children.indexOf(el);
145	86	};
146	87	exports.getIndex = getIndex;
147		-const getDirectTabCount = tabsRootElement => {
148		- return tabsRootElement.querySelectorAll(`:scope > [data-element_type="${TABS_MENU_ELEMENT_TYPE}"] > [data-element_type="${TAB_ELEMENT_TYPE}"]`).length;
149		-};
150		-exports.getDirectTabCount = getDirectTabCount;
151	88	const getNextTab = (key, tab) => {
152	89	const tabs = getChildren(tab, TAB_ELEMENT_TYPE);
153	90	const tabsLength = tabs.length;
154	91	const currentIndex = getIndex(tab, TAB_ELEMENT_TYPE);