elementor / modules / atomic-widgets / css-converter / converters / transition-property-converter.php

transition-property-converter.php in Elementor Website Builder – more than just a page builder 4.3.0, at modules/atomic-widgets/css-converter/converters/transition-property-converter.php

150 lines 3.9 KB

Raw Download Zip

1	<?php
2
3	namespace Elementor\Modules\AtomicWidgets\CssConverter\Converters;
4
5	use Elementor\Modules\AtomicWidgets\CssConverter\Conversion_Context;
6	use Elementor\Modules\AtomicWidgets\CssConverter\Property_Converter_Base;
7	use Elementor\Modules\AtomicWidgets\CssConverter\ValueParsers\Css_Token_Splitter;
8	use Elementor\Modules\AtomicWidgets\CssConverter\ValueParsers\Size_Value_Parser;
9	use Elementor\Modules\AtomicWidgets\PropTypes\Key_Value_Prop_Type;
10	use Elementor\Modules\AtomicWidgets\PropTypes\Primitives\String_Prop_Type;
11	use Elementor\Modules\AtomicWidgets\PropTypes\Selection_Size_Prop_Type;
12	use Elementor\Modules\AtomicWidgets\PropTypes\Size_Prop_Type;
13	use Elementor\Modules\AtomicWidgets\PropTypes\Transition_Prop_Type;
14
15	if ( ! defined( 'ABSPATH' ) ) {
16	exit; // Exit if accessed directly.
17	}
18
19	/**
20	* Converter for the `transition` CSS property -> Transition_Prop_Type (array of Selection_Size).
21	*
22	* Parses comma-separated transition layers. Each layer is whitespace-split into tokens:
23	* <property> <duration> [<easing>] [<delay>]
24	*
25	* Only the property name and the FIRST duration/delay time value are mapped — the schema has no
26	* field for easing or delay, so they are intentionally dropped (silently).
27	*
28	* The `property` token must be in ALLOWED_PROPERTIES (sourced from the Elementor UI data).
29	* Layers with an unrecognised property decline the entire declaration to customCss.
30	*
31	* Time values must be in `s` or `ms`; any other unit declines the layer.
32	*/
33	class Transition_Property_Converter extends Property_Converter_Base {
34	const ALLOWED_PROPERTIES = [
35	'all',
36	'background-color',
37	'background-position',
38	'border',
39	'border-color',
40	'border-radius',
41	'border-width',
42	'box-shadow',
43	'color',
44	'filter',
45	'flex',
46	'flex-basis',
47	'flex-grow',
48	'flex-shrink',
49	'font-size',
50	'font-variation-settings',
51	'height',
52	'inset-block-end',
53	'inset-block-start',
54	'inset-inline-end',
55	'inset-inline-start',
56	'letter-spacing',
57	'line-height',
58	'margin',
59	'margin-block-end',
60	'margin-block-start',
61	'margin-inline-end',
62	'margin-inline-start',
63	'max-height',
64	'max-width',
65	'min-height',
66	'min-width',
67	'opacity',
68	'padding',
69	'padding-block-end',
70	'padding-block-start',
71	'padding-inline-end',
72	'padding-inline-start',
73	'transform',
74	'width',
75	'word-spacing',
76	'-webkit-text-stroke-color',
77	'z-index',
78	];
79
80	const TIME_UNITS = [ 's', 'ms' ];
81
82	protected function get_supported_properties(): array {
83	return [ 'transition' ];
84	}
85
86	protected function do_convert( Conversion_Context $context, array $rule ): bool {
87	$layers = Css_Token_Splitter::split_by_comma( trim( $rule['value'] ) );
88
89	if ( empty( $layers ) ) {
90	return false;
91	}
92
93	$items = [];
94
95	foreach ( $layers as $layer ) {
96	$item = $this->parse_layer( trim( $layer ) );
97
98	if ( null === $item ) {
99	return false;
100	}
101
102	$items[] = $item;
103	}
104
105	$context->set_prop( 'transition', Transition_Prop_Type::generate( $items ) );
106
107	return true;
108	}
109
110	private function parse_layer( string $layer ): ?array {
111	$tokens = Css_Token_Splitter::split_by_whitespace( $layer );
112
113	if ( empty( $tokens ) ) {
114	return null;
115	}
116
117	$property = strtolower( $tokens[0] );
118
119	if ( ! in_array( $property, self::ALLOWED_PROPERTIES, true ) ) {
120	return null;
121	}
122
123	$duration = $this->find_first_time( array_slice( $tokens, 1 ) );
124
125	if ( null === $duration ) {
126	return null;
127	}
128
129	return Selection_Size_Prop_Type::generate( [
130	'selection' => Key_Value_Prop_Type::generate( [
131	'key' => String_Prop_Type::generate( $property ),
132	'value' => String_Prop_Type::generate( $property ),
133	] ),
134	'size' => Size_Prop_Type::generate( $duration ),
135	] );
136	}
137
138	private function find_first_time( array $tokens ): ?array {
139	foreach ( $tokens as $token ) {
140	$parsed = Size_Value_Parser::parse( $token );
141
142	if ( null !== $parsed && in_array( $parsed['unit'], self::TIME_UNITS, true ) ) {
143	return $parsed;
144	}
145	}
146
147	return null;
148	}
149	}
150