← All changes | includes/widgets/tabs.php +31 -98 4.2.0-dev2 → 3.14.0-beta4 View file →

		@@ -73,34 +73,12 @@
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		- /**
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-tabs' ];
93		- }
94		-
95	77	public function show_in_panel(): bool {
96		- return ! Plugin::$instance->experiments->is_feature_active( 'nested-elements', true );
	78	+ return ! Plugin::$instance->experiments->is_feature_active( 'nested-elements' );
97	79	}
98	80
99		- public function has_widget_inner_wrapper(): bool {
100		- return ! Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
101		- }
102		-
103	81	/**
104	82	* Register tabs widget controls.
105	83	*
106	84	* Adds different input fields to allow the user to change and customize the widget settings.
		@@ -108,11 +86,8 @@
108	86	* @since 3.1.0
109	87	* @access protected
110	88	*/
111	89	protected function register_controls() {
112		- $start = is_rtl() ? 'end' : 'start';
113		- $end = is_rtl() ? 'start' : 'end';
114		-
115	90	$this->start_controls_section(
116	91	'section_tabs',
117	92	[
118	93	'label' => esc_html__( 'Tabs', 'elementor' ),
		@@ -178,24 +153,26 @@
178	153	]
179	154	);
180	155
181	156	$this->add_control(
	157	+ 'view',
	158	+ [
	159	+ 'label' => esc_html__( 'View', 'elementor' ),
	160	+ 'type' => Controls_Manager::HIDDEN,
	161	+ 'default' => 'traditional',
	162	+ ]
	163	+ );
	164	+
	165	+ $this->add_control(
182	166	'type',
183	167	[
184	168	'label' => esc_html__( 'Position', 'elementor' ),
185		- 'type' => Controls_Manager::CHOOSE,
	169	+ 'type' => Controls_Manager::SELECT,
186	170	'default' => 'horizontal',
187	171	'options' => [
188		- 'vertical' => [
189		- 'title' => esc_html__( 'Vertical', 'elementor' ),
190		- 'icon' => 'eicon-h-align-left',
191		- ],
192		- 'horizontal' => [
193		- 'title' => esc_html__( 'Horizontal', 'elementor' ),
194		- 'icon' => 'eicon-v-align-top',
195		- ],
	172	+ 'horizontal' => esc_html__( 'Horizontal', 'elementor' ),
	173	+ 'vertical' => esc_html__( 'Vertical', 'elementor' ),
196	174	],
197		- 'classes' => 'elementor-control-start-end',
198	175	'prefix_class' => 'elementor-tabs-view-',
199	176	'separator' => 'before',
200	177	]
201	178	);
		@@ -207,21 +184,21 @@
207	184	'type' => Controls_Manager::CHOOSE,
208	185	'options' => [
209	186	'' => [
210	187	'title' => esc_html__( 'Start', 'elementor' ),
211		- 'icon' => "eicon-align-$start-h",
	188	+ 'icon' => 'eicon-h-align-left',
212	189	],
213	190	'center' => [
214	191	'title' => esc_html__( 'Center', 'elementor' ),
215		- 'icon' => 'eicon-align-center-h',
	192	+ 'icon' => 'eicon-h-align-center',
216	193	],
217	194	'end' => [
218	195	'title' => esc_html__( 'End', 'elementor' ),
219		- 'icon' => "eicon-align-$end-h",
	196	+ 'icon' => 'eicon-h-align-right',
220	197	],
221	198	'stretch' => [
222		- 'title' => esc_html__( 'Stretch', 'elementor' ),
223		- 'icon' => 'eicon-align-stretch-h',
	199	+ 'title' => esc_html__( 'Justified', 'elementor' ),
	200	+ 'icon' => 'eicon-h-align-stretch',
224	201	],
225	202	],
226	203	'prefix_class' => 'elementor-tabs-alignment-',
227	204	'condition' => [
		@@ -237,21 +214,21 @@
237	214	'type' => Controls_Manager::CHOOSE,
238	215	'options' => [
239	216	'' => [
240	217	'title' => esc_html__( 'Start', 'elementor' ),
241		- 'icon' => 'eicon-align-start-v',
	218	+ 'icon' => 'eicon-v-align-top',
242	219	],
243	220	'center' => [
244	221	'title' => esc_html__( 'Center', 'elementor' ),
245		- 'icon' => 'eicon-align-center-v',
	222	+ 'icon' => 'eicon-v-align-middle',
246	223	],
247	224	'end' => [
248	225	'title' => esc_html__( 'End', 'elementor' ),
249		- 'icon' => 'eicon-align-end-v',
	226	+ 'icon' => 'eicon-v-align-bottom',
250	227	],
251	228	'stretch' => [
252		- 'title' => esc_html__( 'Stretch', 'elementor' ),
253		- 'icon' => 'eicon-align-stretch-v',
	229	+ 'title' => esc_html__( 'Justified', 'elementor' ),
	230	+ 'icon' => 'eicon-v-align-stretch',
254	231	],
255	232	],
256	233	'prefix_class' => 'elementor-tabs-alignment-',
257	234	'condition' => [
		@@ -274,29 +251,16 @@
274	251	'navigation_width',
275	252	[
276	253	'label' => esc_html__( 'Navigation Width', 'elementor' ),
277	254	'type' => Controls_Manager::SLIDER,
278		- 'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
279	255	'default' => [
280	256	'unit' => '%',
281	257	],
282	258	'range' => [
283		- 'px' => [
284		- 'min' => 10,
285		- 'max' => 500,
286		- ],
287	259	'%' => [
288	260	'min' => 10,
289	261	'max' => 50,
290	262	],
291		- 'em' => [
292		- 'min' => 1,
293		- 'max' => 50,
294		- ],
295		- 'rem' => [
296		- 'min' => 1,
297		- 'max' => 50,
298		- ],
299	263	],
300	264	'selectors' => [
301	265	'{{WRAPPER}} .elementor-tabs-wrapper' => 'width: {{SIZE}}{{UNIT}}',
302	266	],
		@@ -422,10 +386,10 @@
422	386	[
423	387	'label' => esc_html__( 'Alignment', 'elementor' ),
424	388	'type' => Controls_Manager::CHOOSE,
425	389	'options' => [
426		- 'start' => [
427		- 'title' => esc_html__( 'Start', 'elementor' ),
	390	+ 'left' => [
	391	+ 'title' => esc_html__( 'Left', 'elementor' ),
428	392	'icon' => 'eicon-text-align-left',
429	393	],
430	394	'center' => [
431	395	'title' => esc_html__( 'Center', 'elementor' ),
		@@ -430,18 +394,13 @@
430	394	'center' => [
431	395	'title' => esc_html__( 'Center', 'elementor' ),
432	396	'icon' => 'eicon-text-align-center',
433	397	],
434		- 'end' => [
435		- 'title' => esc_html__( 'End', 'elementor' ),
	398	+ 'right' => [
	399	+ 'title' => esc_html__( 'Right', 'elementor' ),
436	400	'icon' => 'eicon-text-align-right',
437	401	],
438	402	],
439		- 'classes' => 'elementor-control-start-end',
440		- 'selectors_dictionary' => [
441		- 'left' => is_rtl() ? 'end' : 'start',
442		- 'right' => is_rtl() ? 'start' : 'end',
443		- ],
444	403	'selectors' => [
445	404	'{{WRAPPER}} .elementor-tab-title' => 'text-align: {{VALUE}};',
446	405	],
447	406	'condition' => [
		@@ -507,8 +466,10 @@
507	466	$tabs = $this->get_settings_for_display( 'tabs' );
508	467
509	468	$id_int = substr( $this->get_id_int(), 0, 3 );
510	469
	470	+ $a11y_improvements_experiment = Plugin::$instance->experiments->is_feature_active( 'a11y_improvements' );
	471	+
511	472	$this->add_render_attribute( 'elementor-tabs', 'class', 'elementor-tabs' );
512	473
513	474	?>
514	475	<div <?php $this->print_render_attribute_string( 'elementor-tabs' ); ?>>
		@@ -516,8 +477,9 @@
516	477	<?php
517	478	foreach ( $tabs as $index => $item ) :
518	479	$tab_count = $index + 1;
519	480	$tab_title_setting_key = $this->get_repeater_setting_key( 'tab_title', 'tabs', $index );
	481	+ $tab_title = $a11y_improvements_experiment ? $item['tab_title'] : '<a href="">' . $item['tab_title'] . '</a>';
520	482
521	483	$this->add_render_attribute( $tab_title_setting_key, [
522	484	'id' => 'elementor-tab-title-' . $id_int . $tab_count,
523	485	'class' => [ 'elementor-tab-title', 'elementor-tab-desktop-title' ],
		@@ -530,9 +492,9 @@
530	492	] );
531	493	?>
532	494	<div <?php $this->print_render_attribute_string( $tab_title_setting_key ); ?>><?php
533	495	// PHPCS - the main text of a widget should not be escaped.
534		- echo $item['tab_title']; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
	496	+ echo $tab_title; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
535	497	?></div>
536	498	<?php endforeach; ?>
537	499	</div>
538	500	<div class="elementor-tabs-content-wrapper" role="tablist" aria-orientation="vertical">
		@@ -585,37 +547,8 @@
585	547	*
586	548	* @since 2.9.0
587	549	* @access protected
588	550	*/
589		- public function render_markdown(): string {
590		- $tabs = $this->get_settings_for_display( 'tabs' );
591		-
592		- if ( empty( $tabs ) ) {
593		- return '';
594		- }
595		-
596		- $sections = [];
597		-
598		- foreach ( $tabs as $item ) {
599		- $title = Utils::html_to_plain_text( $item['tab_title'] ?? '' );
600		- $content = \Elementor\Modules\MarkdownRender\Html_To_Markdown::convert( $item['tab_content'] ?? '' );
601		-
602		- if ( empty( $title ) && empty( $content ) ) {
603		- continue;
604		- }
605		-
606		- $section = '### ' . $title;
607		-
608		- if ( ! empty( $content ) ) {
609		- $section .= "\n\n" . $content;
610		- }
611		-
612		- $sections[] = $section;
613		- }
614		-
615		- return implode( "\n\n", $sections );
616		- }
617		-
618	551	protected function content_template() {
619	552	?>
620	553	<div class="elementor-tabs" role="tablist" aria-orientation="vertical">
621	554	<# if ( settings.tabs ) {