Elementor Website Builder – more than just a page builder / 4.0.2

Elementor Website Builder – more than just a page builder v4.0.2

elementor / assets / js / toggle.b75e66d2aca6f6ee742e.bundle.js

toggle.b75e66d2aca6f6ee742e.bundle.js in Elementor Website Builder – more than just a page builder 4.0.2, at assets/js/toggle.b75e66d2aca6f6ee742e.bundle.js

236 lines 7.8 KB

Raw Download Zip

1	"use strict";
2	(self["webpackChunkelementorFrontend"] = self["webpackChunkelementorFrontend"] \|\| []).push([["toggle"],{
3
4	/***/ "../assets/dev/js/frontend/handlers/base-tabs.js":
5	/!*****************************************************!\
6	!* ../assets/dev/js/frontend/handlers/base-tabs.js *!
7	\*******************************************************/
8	/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
9
10
11
12	Object.defineProperty(exports, "__esModule", ({
13	value: true
14	}));
15	exports["default"] = void 0;
16	__webpack_require__(/! core-js/modules/esnext.iterator.constructor.js / "../node_modules/core-js/modules/esnext.iterator.constructor.js");
17	__webpack_require__(/! core-js/modules/esnext.iterator.filter.js / "../node_modules/core-js/modules/esnext.iterator.filter.js");
18	__webpack_require__(/! core-js/modules/esnext.iterator.find.js / "../node_modules/core-js/modules/esnext.iterator.find.js");
19	class baseTabs extends elementorModules.frontend.handlers.Base {
20	getDefaultSettings() {
21	return {
22	selectors: {
23	tablist: '[role="tablist"]',
24	tabTitle: '.elementor-tab-title',
25	tabContent: '.elementor-tab-content'
26	},
27	classes: {
28	active: 'elementor-active'
29	},
30	showTabFn: 'show',
31	hideTabFn: 'hide',
32	toggleSelf: true,
33	hidePrevious: true,
34	autoExpand: true,
35	keyDirection: {
36	ArrowLeft: elementorFrontendConfig.is_rtl ? 1 : -1,
37	ArrowUp: -1,
38	ArrowRight: elementorFrontendConfig.is_rtl ? -1 : 1,
39	ArrowDown: 1
40	}
41	};
42	}
43	getDefaultElements() {
44	const selectors = this.getSettings('selectors');
45	return {
46	$tabTitles: this.findElement(selectors.tabTitle),
47	$tabContents: this.findElement(selectors.tabContent)
48	};
49	}
50	activateDefaultTab() {
51	const settings = this.getSettings();
52	if (!settings.autoExpand \|\| 'editor' === settings.autoExpand && !this.isEdit) {
53	return;
54	}
55	const defaultActiveTab = this.getEditSettings('activeItemIndex') \|\| 1,
56	originalToggleMethods = {
57	showTabFn: settings.showTabFn,
58	hideTabFn: settings.hideTabFn
59	};
60
61	// Toggle tabs without animation to avoid jumping
62	this.setSettings({
63	showTabFn: 'show',
64	hideTabFn: 'hide'
65	});
66	this.changeActiveTab(defaultActiveTab);
67
68	// Return back original toggle effects
69	this.setSettings(originalToggleMethods);
70	}
71	handleKeyboardNavigation(event) {
72	const tab = event.currentTarget,
73	$tabList = jQuery(tab.closest(this.getSettings('selectors').tablist)),
74	// eslint-disable-next-line @wordpress/no-unused-vars-before-return
75	$tabs = $tabList.find(this.getSettings('selectors').tabTitle),
76	isVertical = 'vertical' === $tabList.attr('aria-orientation');
77	switch (event.key) {
78	case 'ArrowLeft':
79	case 'ArrowRight':
80	if (isVertical) {
81	return;
82	}
83	break;
84	case 'ArrowUp':
85	case 'ArrowDown':
86	if (!isVertical) {
87	return;
88	}
89	event.preventDefault();
90	break;
91	case 'Home':
92	event.preventDefault();
93	$tabs.first().trigger('focus');
94	return;
95	case 'End':
96	event.preventDefault();
97	$tabs.last().trigger('focus');
98	return;
99	default:
100	return;
101	}
102	const tabIndex = tab.getAttribute('data-tab') - 1,
103	direction = this.getSettings('keyDirection')[event.key],
104	nextTab = $tabs[tabIndex + direction];
105	if (nextTab) {
106	nextTab.focus();
107	} else if (-1 === tabIndex + direction) {
108	$tabs.last().trigger('focus');
109	} else {
110	$tabs.first().trigger('focus');
111	}
112	}
113	deactivateActiveTab(tabIndex) {
114	const settings = this.getSettings(),
115	activeClass = settings.classes.active,
116	activeFilter = tabIndex ? '[data-tab="' + tabIndex + '"]' : '.' + activeClass,
117	$activeTitle = this.elements.$tabTitles.filter(activeFilter),
118	$activeContent = this.elements.$tabContents.filter(activeFilter);
119	$activeTitle.add($activeContent).removeClass(activeClass);
120	$activeTitle.attr({
121	tabindex: '-1',
122	'aria-selected': 'false',
123	'aria-expanded': 'false'
124	});
125	$activeContent[settings.hideTabFn]();
126	$activeContent.attr('hidden', 'hidden');
127	}
128	activateTab(tabIndex) {
129	const settings = this.getSettings(),
130	activeClass = settings.classes.active,
131	$requestedTitle = this.elements.$tabTitles.filter('[data-tab="' + tabIndex + '"]'),
132	$requestedContent = this.elements.$tabContents.filter('[data-tab="' + tabIndex + '"]'),
133	animationDuration = 'show' === settings.showTabFn ? 0 : 400;
134	$requestedTitle.add($requestedContent).addClass(activeClass);
135	$requestedTitle.attr({
136	tabindex: '0',
137	'aria-selected': 'true',
138	'aria-expanded': 'true'
139	});
140	$requestedContent[settings.showTabFn](animationDuration, () => elementorFrontend.elements.$window.trigger('elementor-pro/motion-fx/recalc'));
141	$requestedContent.removeAttr('hidden');
142	}
143	isActiveTab(tabIndex) {
144	return this.elements.$tabTitles.filter('[data-tab="' + tabIndex + '"]').hasClass(this.getSettings('classes.active'));
145	}
146	bindEvents() {
147	this.elements.$tabTitles.on({
148	keydown: event => {
149	// Support for old markup that includes an `<a>` tag in the tab
150	if (jQuery(event.target).is('a') && `Enter` === event.key) {
151	event.preventDefault();
152	}
153
154	// We listen to keydowon event for these keys in order to prevent undesired page scrolling
155	if (['End', 'Home', 'ArrowUp', 'ArrowDown'].includes(event.key)) {
156	this.handleKeyboardNavigation(event);
157	}
158	},
159	keyup: event => {
160	switch (event.code) {
161	case 'ArrowLeft':
162	case 'ArrowRight':
163	this.handleKeyboardNavigation(event);
164	break;
165	case 'Enter':
166	case 'Space':
167	event.preventDefault();
168	this.changeActiveTab(event.currentTarget.getAttribute('data-tab'));
169	break;
170	}
171	},
172	click: event => {
173	event.preventDefault();
174	this.changeActiveTab(event.currentTarget.getAttribute('data-tab'));
175	}
176	});
177	}
178	onInit(...args) {
179	super.onInit(...args);
180	this.activateDefaultTab();
181	}
182	onEditSettingsChange(propertyName) {
183	if ('activeItemIndex' === propertyName) {
184	this.activateDefaultTab();
185	}
186	}
187	changeActiveTab(tabIndex) {
188	const isActiveTab = this.isActiveTab(tabIndex),
189	settings = this.getSettings();
190	if ((settings.toggleSelf \|\| !isActiveTab) && settings.hidePrevious) {
191	this.deactivateActiveTab();
192	}
193	if (!settings.hidePrevious && isActiveTab) {
194	this.deactivateActiveTab(tabIndex);
195	}
196	if (!isActiveTab) {
197	this.activateTab(tabIndex);
198	}
199	}
200	}
201	exports["default"] = baseTabs;
202
203	/***/ }),
204
205	/***/ "../assets/dev/js/frontend/handlers/toggle.js":
206	/!**************************************************!\
207	!* ../assets/dev/js/frontend/handlers/toggle.js *!
208	\****************************************************/
209	/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
210
211
212
213	var _interopRequireDefault = __webpack_require__(/! @babel/runtime/helpers/interopRequireDefault / "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
214	Object.defineProperty(exports, "__esModule", ({
215	value: true
216	}));
217	exports["default"] = void 0;
218	var _baseTabs = _interopRequireDefault(__webpack_require__(/! ./base-tabs / "../assets/dev/js/frontend/handlers/base-tabs.js"));
219	class Toggle extends _baseTabs.default {
220	getDefaultSettings() {
221	const defaultSettings = super.getDefaultSettings();
222	return {
223	...defaultSettings,
224	showTabFn: 'slideDown',
225	hideTabFn: 'slideUp',
226	hidePrevious: false,
227	autoExpand: 'editor'
228	};
229	}
230	}
231	exports["default"] = Toggle;
232
233	/***/ })
234
235	}]);
236	//# sourceMappingURL=toggle.b75e66d2aca6f6ee742e.bundle.js.map