← All changes | includes/widgets/toggle.php +84 -205 4.1.1 → 3.1.2 View file →

		@@ -42,9 +42,9 @@
42	42	*
43	43	* @return string Widget title.
44	44	*/
45	45	public function get_title() {
46		- return esc_html__( 'Toggle', 'elementor' );
	46	+ return __( 'Toggle', 'elementor' );
47	47	}
48	48
49	49	/**
50	50	* Get widget icon.
		@@ -73,43 +73,9 @@
73	73	public function get_keywords() {
74	74	return [ 'tabs', 'accordion', 'toggle' ];
75	75	}
76	76
77		- protected function is_dynamic_content(): bool {
78		- return false;
79		- }
80		-
81	77	/**
82		- * Get style dependencies.
83		- *
84		- * Retrieve the list of style dependencies the widget requires.
85		- *
86		- * @since 3.24.0
87		- * @access public
88		- *
89		- * @return array Widget style dependencies.
90		- */
91		- public function get_style_depends(): array {
92		- return [ 'widget-toggle' ];
93		- }
94		-
95		- /**
96		- * Hide widget from panel.
97		- *
98		- * Hide the toggle widget from the panel if nested-accordion experiment is active.
99		- *
100		- * @since 3.15.0
101		- * @return bool
102		- */
103		- public function show_in_panel(): bool {
104		- return ! Plugin::$instance->experiments->is_feature_active( 'nested-elements', true );
105		- }
106		-
107		- public function has_widget_inner_wrapper(): bool {
108		- return ! Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
109		- }
110		-
111		- /**
112	78	* Register toggle widget controls.
113	79	*
114	80	* Adds different input fields to allow the user to change and customize the widget settings.
115	81	*
		@@ -119,9 +85,9 @@
119	85	protected function register_controls() {
120	86	$this->start_controls_section(
121	87	'section_toggle',
122	88	[
123		- 'label' => esc_html__( 'Toggle', 'elementor' ),
	89	+ 'label' => __( 'Toggle', 'elementor' ),
124	90	]
125	91	);
126	92
127	93	$repeater = new Repeater();
		@@ -128,11 +94,11 @@
128	94
129	95	$repeater->add_control(
130	96	'tab_title',
131	97	[
132		- 'label' => esc_html__( 'Title', 'elementor' ),
	98	+ 'label' => __( 'Title & Description', 'elementor' ),
133	99	'type' => Controls_Manager::TEXT,
134		- 'default' => esc_html__( 'Toggle Title', 'elementor' ),
	100	+ 'default' => __( 'Toggle Title', 'elementor' ),
135	101	'label_block' => true,
136	102	'dynamic' => [
137	103	'active' => true,
138	104	],
		@@ -141,11 +107,12 @@
141	107
142	108	$repeater->add_control(
143	109	'tab_content',
144	110	[
145		- 'label' => esc_html__( 'Content', 'elementor' ),
	111	+ 'label' => __( 'Content', 'elementor' ),
146	112	'type' => Controls_Manager::WYSIWYG,
147		- 'default' => esc_html__( 'Toggle Content', 'elementor' ),
	113	+ 'default' => __( 'Toggle Content', 'elementor' ),
	114	+ 'show_label' => false,
148	115	'dynamic' => [
149	116	'active' => true,
150	117	],
151	118	]
		@@ -150,33 +117,22 @@
150	117	],
151	118	]
152	119	);
153	120
154		- if ( Plugin::$instance->widgets_manager->get_widget_types( 'nested-accordion' ) ) {
155		- $this->add_deprecation_message(
156		- '3.15.0',
157		- esc_html__(
158		- 'You are currently editing a Toggle widget in its old version. Drag a new Accordion widget onto your page to use a newer version, providing nested capabilities.',
159		- 'elementor'
160		- ),
161		- 'nested-accordion'
162		- );
163		- }
164		-
165	121	$this->add_control(
166	122	'tabs',
167	123	[
168		- 'label' => esc_html__( 'Toggle Items', 'elementor' ),
	124	+ 'label' => __( 'Toggle Items', 'elementor' ),
169	125	'type' => Controls_Manager::REPEATER,
170	126	'fields' => $repeater->get_controls(),
171	127	'default' => [
172	128	[
173		- 'tab_title' => esc_html__( 'Toggle #1', 'elementor' ),
174		- 'tab_content' => esc_html__( 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.', 'elementor' ),
	129	+ 'tab_title' => __( 'Toggle #1', 'elementor' ),
	130	+ 'tab_content' => __( 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.', 'elementor' ),
175	131	],
176	132	[
177		- 'tab_title' => esc_html__( 'Toggle #2', 'elementor' ),
178		- 'tab_content' => esc_html__( 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.', 'elementor' ),
	133	+ 'tab_title' => __( 'Toggle #2', 'elementor' ),
	134	+ 'tab_content' => __( 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.', 'elementor' ),
179	135	],
180	136	],
181	137	'title_field' => '{{{ tab_title }}}',
182	138	]
		@@ -182,11 +138,20 @@
182	138	]
183	139	);
184	140
185	141	$this->add_control(
	142	+ 'view',
	143	+ [
	144	+ 'label' => __( 'View', 'elementor' ),
	145	+ 'type' => Controls_Manager::HIDDEN,
	146	+ 'default' => 'traditional',
	147	+ ]
	148	+ );
	149	+
	150	+ $this->add_control(
186	151	'selected_icon',
187	152	[
188		- 'label' => esc_html__( 'Icon', 'elementor' ),
	153	+ 'label' => __( 'Icon', 'elementor' ),
189	154	'type' => Controls_Manager::ICONS,
190	155	'separator' => 'before',
191	156	'fa4compatibility' => 'icon',
192	157	'default' => [
		@@ -212,9 +177,9 @@
212	177
213	178	$this->add_control(
214	179	'selected_active_icon',
215	180	[
216		- 'label' => esc_html__( 'Active Icon', 'elementor' ),
	181	+ 'label' => __( 'Active Icon', 'elementor' ),
217	182	'type' => Controls_Manager::ICONS,
218	183	'fa4compatibility' => 'icon_active',
219	184	'default' => [
220	185	'value' => 'fas fa-caret-up',
		@@ -242,9 +207,9 @@
242	207
243	208	$this->add_control(
244	209	'title_html_tag',
245	210	[
246		- 'label' => esc_html__( 'Title HTML Tag', 'elementor' ),
	211	+ 'label' => __( 'Title HTML Tag', 'elementor' ),
247	212	'type' => Controls_Manager::SELECT,
248	213	'options' => [
249	214	'h1' => 'H1',
250	215	'h2' => 'H2',
		@@ -258,23 +223,14 @@
258	223	'separator' => 'before',
259	224	]
260	225	);
261	226
262		- $this->add_control(
263		- 'faq_schema',
264		- [
265		- 'label' => esc_html__( 'FAQ Schema', 'elementor' ),
266		- 'type' => Controls_Manager::SWITCHER,
267		- 'separator' => 'before',
268		- ]
269		- );
270		-
271	227	$this->end_controls_section();
272	228
273	229	$this->start_controls_section(
274	230	'section_toggle_style',
275	231	[
276		- 'label' => esc_html__( 'Toggle', 'elementor' ),
	232	+ 'label' => __( 'Toggle', 'elementor' ),
277	233	'tab' => Controls_Manager::TAB_STYLE,
278	234	]
279	235	);
280	236
		@@ -280,22 +236,19 @@
280	236
281	237	$this->add_control(
282	238	'border_width',
283	239	[
284		- 'label' => esc_html__( 'Border Width', 'elementor' ),
	240	+ 'label' => __( 'Border Width', 'elementor' ),
285	241	'type' => Controls_Manager::SLIDER,
286		- 'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
287	242	'range' => [
288	243	'px' => [
289		- 'max' => 20,
	244	+ 'min' => 0,
	245	+ 'max' => 10,
290	246	],
291		- 'em' => [
292		- 'max' => 2,
293		- ],
294	247	],
295	248	'selectors' => [
296		- '{{WRAPPER}} .elementor-tab-title' => 'border-width: {{SIZE}}{{UNIT}};',
297		- '{{WRAPPER}} .elementor-tab-content' => 'border-width: {{SIZE}}{{UNIT}};',
	249	+ '{{WRAPPER}} .elementor-toggle .elementor-tab-title' => 'border-width: {{SIZE}}{{UNIT}};',
	250	+ '{{WRAPPER}} .elementor-toggle .elementor-tab-content' => 'border-width: {{SIZE}}{{UNIT}};',
298	251	],
299	252	]
300	253	);
301	254
		@@ -301,13 +254,13 @@
301	254
302	255	$this->add_control(
303	256	'border_color',
304	257	[
305		- 'label' => esc_html__( 'Border Color', 'elementor' ),
	258	+ 'label' => __( 'Border Color', 'elementor' ),
306	259	'type' => Controls_Manager::COLOR,
307	260	'selectors' => [
308		- '{{WRAPPER}} .elementor-tab-content' => 'border-block-end-color: {{VALUE}};',
309		- '{{WRAPPER}} .elementor-tab-title' => 'border-color: {{VALUE}};',
	261	+ '{{WRAPPER}} .elementor-toggle .elementor-tab-content' => 'border-bottom-color: {{VALUE}};',
	262	+ '{{WRAPPER}} .elementor-toggle .elementor-tab-title' => 'border-color: {{VALUE}};',
310	263	],
311	264	]
312	265	);
313	266
		@@ -313,24 +266,18 @@
313	266
314	267	$this->add_responsive_control(
315	268	'space_between',
316	269	[
317		- 'label' => esc_html__( 'Space Between', 'elementor' ),
	270	+ 'label' => __( 'Space Between', 'elementor' ),
318	271	'type' => Controls_Manager::SLIDER,
319		- 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
320	272	'range' => [
321	273	'px' => [
	274	+ 'min' => 0,
322	275	'max' => 100,
323	276	],
324		- 'em' => [
325		- 'max' => 10,
326		- ],
327		- 'rem' => [
328		- 'max' => 10,
329		- ],
330	277	],
331	278	'selectors' => [
332		- '{{WRAPPER}} .elementor-toggle-item:not(:last-child)' => 'margin-block-end: {{SIZE}}{{UNIT}}',
	279	+ '{{WRAPPER}} .elementor-toggle .elementor-toggle-item:not(:last-child)' => 'margin-bottom: {{SIZE}}{{UNIT}}',
333	280	],
334	281	]
335	282	);
336	283
		@@ -337,9 +284,9 @@
337	284	$this->add_group_control(
338	285	Group_Control_Box_Shadow::get_type(),
339	286	[
340	287	'name' => 'box_shadow',
341		- 'selector' => '{{WRAPPER}} .elementor-toggle-item',
	288	+ 'selector' => '{{WRAPPER}} .elementor-toggle .elementor-toggle-item',
342	289	]
343	290	);
344	291
345	292	$this->end_controls_section();
		@@ -346,9 +293,9 @@
346	293
347	294	$this->start_controls_section(
348	295	'section_toggle_style_title',
349	296	[
350		- 'label' => esc_html__( 'Title', 'elementor' ),
	297	+ 'label' => __( 'Title', 'elementor' ),
351	298	'tab' => Controls_Manager::TAB_STYLE,
352	299	]
353	300	);
354	301
		@@ -354,12 +301,12 @@
354	301
355	302	$this->add_control(
356	303	'title_background',
357	304	[
358		- 'label' => esc_html__( 'Background', 'elementor' ),
	305	+ 'label' => __( 'Background', 'elementor' ),
359	306	'type' => Controls_Manager::COLOR,
360	307	'selectors' => [
361		- '{{WRAPPER}} .elementor-tab-title' => 'background-color: {{VALUE}};',
	308	+ '{{WRAPPER}} .elementor-toggle .elementor-tab-title' => 'background-color: {{VALUE}};',
362	309	],
363	310	]
364	311	);
365	312
		@@ -366,13 +313,12 @@
366	313	// The title selector specificity is to override Theme Style
367	314	$this->add_control(
368	315	'title_color',
369	316	[
370		- 'label' => esc_html__( 'Color', 'elementor' ),
	317	+ 'label' => __( 'Color', 'elementor' ),
371	318	'type' => Controls_Manager::COLOR,
372	319	'selectors' => [
373	320	'{{WRAPPER}} .elementor-toggle-title, {{WRAPPER}} .elementor-toggle-icon' => 'color: {{VALUE}};',
374		- '{{WRAPPER}} .elementor-toggle-icon svg' => 'fill: {{VALUE}};',
375	321	],
376	322	'global' => [
377	323	'default' => Global_Colors::COLOR_PRIMARY,
378	324	],
		@@ -381,9 +327,9 @@
381	327
382	328	$this->add_control(
383	329	'tab_active_color',
384	330	[
385		- 'label' => esc_html__( 'Active Color', 'elementor' ),
	331	+ 'label' => __( 'Active Color', 'elementor' ),
386	332	'type' => Controls_Manager::COLOR,
387	333	'selectors' => [
388	334	'{{WRAPPER}} .elementor-tab-title.elementor-active a, {{WRAPPER}} .elementor-tab-title.elementor-active .elementor-toggle-icon' => 'color: {{VALUE}};',
389	335	],
		@@ -396,9 +342,9 @@
396	342	$this->add_group_control(
397	343	Group_Control_Typography::get_type(),
398	344	[
399	345	'name' => 'title_typography',
400		- 'selector' => '{{WRAPPER}} .elementor-toggle-title',
	346	+ 'selector' => '{{WRAPPER}} .elementor-toggle .elementor-toggle-title',
401	347	'global' => [
402	348	'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
403	349	],
404	350	]
		@@ -403,24 +349,16 @@
403	349	],
404	350	]
405	351	);
406	352
407		- $this->add_group_control(
408		- Group_Control_Text_Shadow::get_type(),
409		- [
410		- 'name' => 'title_shadow',
411		- 'selector' => '{{WRAPPER}} .elementor-toggle-title',
412		- ]
413		- );
414		-
415	353	$this->add_responsive_control(
416	354	'title_padding',
417	355	[
418		- 'label' => esc_html__( 'Padding', 'elementor' ),
	356	+ 'label' => __( 'Padding', 'elementor' ),
419	357	'type' => Controls_Manager::DIMENSIONS,
420		- 'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
	358	+ 'size_units' => [ 'px', 'em', '%' ],
421	359	'selectors' => [
422		- '{{WRAPPER}} .elementor-tab-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	360	+ '{{WRAPPER}} .elementor-toggle .elementor-tab-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
423	361	],
424	362	]
425	363	);
426	364
		@@ -428,9 +366,9 @@
428	366
429	367	$this->start_controls_section(
430	368	'section_toggle_style_icon',
431	369	[
432		- 'label' => esc_html__( 'Icon', 'elementor' ),
	370	+ 'label' => __( 'Icon', 'elementor' ),
433	371	'tab' => Controls_Manager::TAB_STYLE,
434	372	'condition' => [
435	373	'selected_icon[value]!' => '',
436	374	],
		@@ -439,17 +377,17 @@
439	377
440	378	$this->add_control(
441	379	'icon_align',
442	380	[
443		- 'label' => esc_html__( 'Alignment', 'elementor' ),
	381	+ 'label' => __( 'Alignment', 'elementor' ),
444	382	'type' => Controls_Manager::CHOOSE,
445	383	'options' => [
446	384	'left' => [
447		- 'title' => esc_html__( 'Start', 'elementor' ),
	385	+ 'title' => __( 'Start', 'elementor' ),
448	386	'icon' => 'eicon-h-align-left',
449	387	],
450	388	'right' => [
451		- 'title' => esc_html__( 'End', 'elementor' ),
	389	+ 'title' => __( 'End', 'elementor' ),
452	390	'icon' => 'eicon-h-align-right',
453	391	],
454	392	],
455	393	'default' => is_rtl() ? 'right' : 'left',
		@@ -459,13 +397,13 @@
459	397
460	398	$this->add_control(
461	399	'icon_color',
462	400	[
463		- 'label' => esc_html__( 'Color', 'elementor' ),
	401	+ 'label' => __( 'Color', 'elementor' ),
464	402	'type' => Controls_Manager::COLOR,
465	403	'selectors' => [
466		- '{{WRAPPER}} .elementor-tab-title .elementor-toggle-icon i:before' => 'color: {{VALUE}};',
467		- '{{WRAPPER}} .elementor-tab-title .elementor-toggle-icon svg' => 'fill: {{VALUE}};',
	404	+ '{{WRAPPER}} .elementor-toggle .elementor-tab-title .elementor-toggle-icon i:before' => 'color: {{VALUE}};',
	405	+ '{{WRAPPER}} .elementor-toggle .elementor-tab-title .elementor-toggle-icon svg' => 'fill: {{VALUE}};',
468	406	],
469	407	]
470	408	);
471	409
		@@ -471,13 +409,13 @@
471	409
472	410	$this->add_control(
473	411	'icon_active_color',
474	412	[
475		- 'label' => esc_html__( 'Active Color', 'elementor' ),
	413	+ 'label' => __( 'Active Color', 'elementor' ),
476	414	'type' => Controls_Manager::COLOR,
477	415	'selectors' => [
478		- '{{WRAPPER}} .elementor-tab-title.elementor-active .elementor-toggle-icon i:before' => 'color: {{VALUE}};',
479		- '{{WRAPPER}} .elementor-tab-title.elementor-active .elementor-toggle-icon svg' => 'fill: {{VALUE}};',
	416	+ '{{WRAPPER}} .elementor-toggle .elementor-tab-title.elementor-active .elementor-toggle-icon i:before' => 'color: {{VALUE}};',
	417	+ '{{WRAPPER}} .elementor-toggle .elementor-tab-title.elementor-active .elementor-toggle-icon svg' => 'fill: {{VALUE}};',
480	418	],
481	419	]
482	420	);
483	421
		@@ -483,24 +421,19 @@
483	421
484	422	$this->add_responsive_control(
485	423	'icon_space',
486	424	[
487		- 'label' => esc_html__( 'Spacing', 'elementor' ),
	425	+ 'label' => __( 'Spacing', 'elementor' ),
488	426	'type' => Controls_Manager::SLIDER,
489		- 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
490	427	'range' => [
491	428	'px' => [
	429	+ 'min' => 0,
492	430	'max' => 100,
493	431	],
494		- 'em' => [
495		- 'max' => 10,
496		- ],
497		- 'rem' => [
498		- 'max' => 10,
499		- ],
500	432	],
501	433	'selectors' => [
502		- '{{WRAPPER}} .elementor-toggle-icon' => 'margin-inline-end: {{SIZE}}{{UNIT}};',
	434	+ '{{WRAPPER}} .elementor-toggle .elementor-toggle-icon.elementor-toggle-icon-left' => 'margin-right: {{SIZE}}{{UNIT}};',
	435	+ '{{WRAPPER}} .elementor-toggle .elementor-toggle-icon.elementor-toggle-icon-right' => 'margin-left: {{SIZE}}{{UNIT}};',
503	436	],
504	437	]
505	438	);
506	439
		@@ -508,9 +441,9 @@
508	441
509	442	$this->start_controls_section(
510	443	'section_toggle_style_content',
511	444	[
512		- 'label' => esc_html__( 'Content', 'elementor' ),
	445	+ 'label' => __( 'Content', 'elementor' ),
513	446	'tab' => Controls_Manager::TAB_STYLE,
514	447	]
515	448	);
516	449
		@@ -516,12 +449,12 @@
516	449
517	450	$this->add_control(
518	451	'content_background_color',
519	452	[
520		- 'label' => esc_html__( 'Background', 'elementor' ),
	453	+ 'label' => __( 'Background', 'elementor' ),
521	454	'type' => Controls_Manager::COLOR,
522	455	'selectors' => [
523		- '{{WRAPPER}} .elementor-tab-content' => 'background-color: {{VALUE}};',
	456	+ '{{WRAPPER}} .elementor-toggle .elementor-tab-content' => 'background-color: {{VALUE}};',
524	457	],
525	458	]
526	459	);
527	460
		@@ -527,12 +460,12 @@
527	460
528	461	$this->add_control(
529	462	'content_color',
530	463	[
531		- 'label' => esc_html__( 'Color', 'elementor' ),
	464	+ 'label' => __( 'Color', 'elementor' ),
532	465	'type' => Controls_Manager::COLOR,
533	466	'selectors' => [
534		- '{{WRAPPER}} .elementor-tab-content' => 'color: {{VALUE}};',
	467	+ '{{WRAPPER}} .elementor-toggle .elementor-tab-content' => 'color: {{VALUE}};',
535	468	],
536	469	'global' => [
537	470	'default' => Global_Colors::COLOR_TEXT,
538	471	],
		@@ -542,9 +475,9 @@
542	475	$this->add_group_control(
543	476	Group_Control_Typography::get_type(),
544	477	[
545	478	'name' => 'content_typography',
546		- 'selector' => '{{WRAPPER}} .elementor-tab-content',
	479	+ 'selector' => '{{WRAPPER}} .elementor-toggle .elementor-tab-content',
547	480	'global' => [
548	481	'default' => Global_Typography::TYPOGRAPHY_TEXT,
549	482	],
550	483	]
		@@ -549,24 +482,16 @@
549	482	],
550	483	]
551	484	);
552	485
553		- $this->add_group_control(
554		- Group_Control_Text_Shadow::get_type(),
555		- [
556		- 'name' => 'content_shadow',
557		- 'selector' => '{{WRAPPER}} .elementor-tab-content',
558		- ]
559		- );
560		-
561	486	$this->add_responsive_control(
562	487	'content_padding',
563	488	[
564		- 'label' => esc_html__( 'Padding', 'elementor' ),
	489	+ 'label' => __( 'Padding', 'elementor' ),
565	490	'type' => Controls_Manager::DIMENSIONS,
566		- 'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
	491	+ 'size_units' => [ 'px', 'em', '%' ],
567	492	'selectors' => [
568		- '{{WRAPPER}} .elementor-tab-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	493	+ '{{WRAPPER}} .elementor-toggle .elementor-tab-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
569	494	],
570	495	]
571	496	);
572	497
		@@ -599,9 +524,9 @@
599	524	$is_new = empty( $settings['icon'] ) && Icons_Manager::is_migration_allowed();
600	525	$has_icon = ( ! $is_new || ! empty( $settings['selected_icon']['value'] ) );
601	526
602	527	?>
603		- <div class="elementor-toggle">
	528	+ <div class="elementor-toggle" role="tablist">
604	529	<?php
605	530	foreach ( $settings['tabs'] as $index => $item ) :
606	531	$tab_count = $index + 1;
607	532
		@@ -612,11 +537,10 @@
612	537	$this->add_render_attribute( $tab_title_setting_key, [
613	538	'id' => 'elementor-tab-title-' . $id_int . $tab_count,
614	539	'class' => [ 'elementor-tab-title' ],
615	540	'data-tab' => $tab_count,
616		- 'role' => 'button',
	541	+ 'role' => 'tab',
617	542	'aria-controls' => 'elementor-tab-content-' . $id_int . $tab_count,
618		- 'aria-expanded' => 'false',
619	543	] );
620	544
621	545	$this->add_render_attribute( $tab_content_setting_key, [
622	546	'id' => 'elementor-tab-content-' . $id_int . $tab_count,
		@@ -621,9 +545,9 @@
621	545	$this->add_render_attribute( $tab_content_setting_key, [
622	546	'id' => 'elementor-tab-content-' . $id_int . $tab_count,
623	547	'class' => [ 'elementor-tab-content', 'elementor-clearfix' ],
624	548	'data-tab' => $tab_count,
625		- 'role' => 'region',
	549	+ 'role' => 'tabpanel',
626	550	'aria-labelledby' => 'elementor-tab-title-' . $id_int . $tab_count,
627	551	] );
628	552
629	553	$this->add_inline_editing_attributes( $tab_content_setting_key, 'advanced' );
		@@ -628,9 +552,9 @@
628	552
629	553	$this->add_inline_editing_attributes( $tab_content_setting_key, 'advanced' );
630	554	?>
631	555	<div class="elementor-toggle-item">
632		- <<?php Utils::print_validated_html_tag( $settings['title_html_tag'] ); ?> <?php $this->print_render_attribute_string( $tab_title_setting_key ); ?>>
	556	+ <<?php echo esc_html( $settings['title_html_tag'] ); ?> <?php echo $this->get_render_attribute_string( $tab_title_setting_key ); ?>>
633	557	<?php if ( $has_icon ) : ?>
634	558	<span class="elementor-toggle-icon elementor-toggle-icon-<?php echo esc_attr( $settings['icon_align'] ); ?>" aria-hidden="true">
635	559	<?php
636	560	if ( $is_new || $migrated ) { ?>
		@@ -641,35 +565,13 @@
641	565	<i class="elementor-toggle-icon-opened <?php echo esc_attr( $settings['icon_active'] ); ?>"></i>
642	566	<?php } ?>
643	567	</span>
644	568	<?php endif; ?>
645		- <a class="elementor-toggle-title" tabindex="0"><?php $this->print_unescaped_setting( 'tab_title', 'tabs', $index ); ?></a>
646		- </<?php Utils::print_validated_html_tag( $settings['title_html_tag'] ); ?>>
647		-
648		- <div <?php $this->print_render_attribute_string( $tab_content_setting_key ); ?>><?php Utils::print_unescaped_internal_string( $this->parse_text_editor( $item['tab_content'] ) ); ?></div>
	569	+ <a href="" class="elementor-toggle-title"><?php echo $item['tab_title']; ?></a>
	570	+ </<?php echo esc_html( $settings['title_html_tag'] ); ?>>
	571	+ <div <?php echo $this->get_render_attribute_string( $tab_content_setting_key ); ?>><?php echo $this->parse_text_editor( $item['tab_content'] ); ?></div>
649	572	</div>
650	573	<?php endforeach; ?>
651		- <?php
652		- if ( isset( $settings['faq_schema'] ) && 'yes' === $settings['faq_schema'] ) {
653		- $json = [
654		- '@context' => 'https://schema.org',
655		- '@type' => 'FAQPage',
656		- 'mainEntity' => [],
657		- ];
658		-
659		- foreach ( $settings['tabs'] as $index => $item ) {
660		- $json['mainEntity'][] = [
661		- '@type' => 'Question',
662		- 'name' => wp_strip_all_tags( $item['tab_title'] ),
663		- 'acceptedAnswer' => [
664		- '@type' => 'Answer',
665		- 'text' => $this->parse_text_editor( $item['tab_content'] ),
666		- ],
667		- ];
668		- }
669		- ?>
670		- <script type="application/ld+json"><?php echo wp_json_encode( $json ); ?></script>
671		- <?php } ?>
672	574	</div>
673	575	<?php
674	576	}
675	577
		@@ -682,16 +584,15 @@
682	584	* @access protected
683	585	*/
684	586	protected function content_template() {
685	587	?>
686		- <div class="elementor-toggle">
	588	+ <div class="elementor-toggle" role="tablist">
687	589	<#
688	590	if ( settings.tabs ) {
689	591	var tabindex = view.getIDInt().toString().substr( 0, 3 ),
690	592	iconHTML = elementor.helpers.renderIcon( view, settings.selected_icon, {}, 'i' , 'object' ),
691	593	iconActiveHTML = elementor.helpers.renderIcon( view, settings.selected_active_icon, {}, 'i' , 'object' ),
692		- migrated = elementor.helpers.isIconMigrated( settings, 'selected_icon' ),
693		- titleHTMLTag = elementor.helpers.validateHTMLTag( settings.title_html_tag );
	594	+ migrated = elementor.helpers.isIconMigrated( settings, 'selected_icon' );
694	595
695	596	_.each( settings.tabs, function( item, index ) {
696	597	var tabCount = index + 1,
697	598	tabTitleKey = view.getRepeaterSettingKey( 'tab_title', 'tabs', index ),
		@@ -700,11 +601,10 @@
700	601	view.addRenderAttribute( tabTitleKey, {
701	602	'id': 'elementor-tab-title-' + tabindex + tabCount,
702	603	'class': [ 'elementor-tab-title' ],
703	604	'data-tab': tabCount,
704		- 'role': 'button',
705		- 'aria-controls': 'elementor-tab-content-' + tabindex + tabCount,
706		- 'aria-expanded': 'false',
	605	+ 'role': 'tab',
	606	+ 'aria-controls': 'elementor-tab-content-' + tabindex + tabCount
707	607	} );
708	608
709	609	view.addRenderAttribute( tabContentKey, {
710	610	'id': 'elementor-tab-content-' + tabindex + tabCount,
		@@ -709,9 +609,9 @@
709	609	view.addRenderAttribute( tabContentKey, {
710	610	'id': 'elementor-tab-content-' + tabindex + tabCount,
711	611	'class': [ 'elementor-tab-content', 'elementor-clearfix' ],
712	612	'data-tab': tabCount,
713		- 'role': 'region',
	613	+ 'role': 'tabpanel',
714	614	'aria-labelledby': 'elementor-tab-title-' + tabindex + tabCount
715	615	} );
716	616
717	617	view.addInlineEditingAttributes( tabContentKey, 'advanced' );
		@@ -716,9 +616,9 @@
716	616
717	617	view.addInlineEditingAttributes( tabContentKey, 'advanced' );
718	618	#>
719	619	<div class="elementor-toggle-item">
720		- <{{{ titleHTMLTag }}} {{{ view.getRenderAttributeString( tabTitleKey ) }}}>
	620	+ <{{{ settings.title_html_tag }}} {{{ view.getRenderAttributeString( tabTitleKey ) }}}>
721	621	<# if ( settings.icon || settings.selected_icon ) { #>
722	622	<span class="elementor-toggle-icon elementor-toggle-icon-{{ settings.icon_align }}" aria-hidden="true">
723	623	<# if ( iconHTML && iconHTML.rendered && ( ! settings.icon || migrated ) ) { #>
724	624	<span class="elementor-toggle-icon-closed">{{{ iconHTML.value }}}</span>
		@@ -728,10 +628,10 @@
728	628	<i class="elementor-toggle-icon-opened {{ settings.icon_active }}"></i>
729	629	<# } #>
730	630	</span>
731	631	<# } #>
732		- <a class="elementor-toggle-title" tabindex="0">{{{ item.tab_title }}}</a>
733		- </{{{ titleHTMLTag }}}>
	632	+ <a href="" class="elementor-toggle-title">{{{ item.tab_title }}}</a>
	633	+ </{{{ settings.title_html_tag }}}>
734	634	<div {{{ view.getRenderAttributeString( tabContentKey ) }}}>{{{ item.tab_content }}}</div>
735	635	</div>
736	636	<#
737	637	} );
		@@ -737,27 +637,6 @@
737	637	} );
738	638	} #>
739	639	</div>
740	640	<?php
741		- }
742		-
743		- public function render_markdown(): string {
744		- $settings = $this->get_settings_for_display();
745		- if ( empty( $settings['tabs'] ) ) {
746		- return '';
747		- }
748		- $sections = [];
749		- foreach ( $settings['tabs'] as $item ) {
750		- $title = Utils::html_to_plain_text( $item['tab_title'] ?? '' );
751		- $content = \Elementor\Modules\MarkdownRender\Html_To_Markdown::convert( $item['tab_content'] ?? '' );
752		- if ( empty( $title ) && empty( $content ) ) {
753		- continue;
754		- }
755		- $section = '### ' . $title;
756		- if ( ! empty( $content ) ) {
757		- $section .= "\n\n" . $content;
758		- }
759		- $sections[] = $section;
760		- }
761		- return implode( "\n\n", $sections );
762	641	}
763	642	}