@wordpress/style-engine 0.12.0 → 0.14.1-next.d6164808d3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +4 -0
- package/README.md +206 -42
- package/build/index.js +7 -5
- package/build/index.js.map +1 -1
- package/build/styles/typography/index.js +7 -1
- package/build/styles/typography/index.js.map +1 -1
- package/build/styles/utils.js +5 -5
- package/build/styles/utils.js.map +1 -1
- package/build-module/index.js +6 -4
- package/build-module/index.js.map +1 -1
- package/build-module/styles/typography/index.js +7 -1
- package/build-module/styles/typography/index.js.map +1 -1
- package/build-module/styles/utils.js +5 -5
- package/build-module/styles/utils.js.map +1 -1
- package/build-types/index.d.ts +4 -4
- package/build-types/index.d.ts.map +1 -1
- package/build-types/styles/color/background.d.ts +1 -1
- package/build-types/styles/color/gradient.d.ts +1 -1
- package/build-types/styles/color/index.d.ts +1 -1
- package/build-types/styles/color/text.d.ts +1 -1
- package/build-types/styles/typography/index.d.ts +1 -1
- package/build-types/styles/typography/index.d.ts.map +1 -1
- package/build-types/styles/utils.d.ts +6 -6
- package/build-types/types.d.ts +3 -4
- package/build-types/types.d.ts.map +1 -1
- package/class-wp-style-engine-css-declarations.php +61 -10
- package/class-wp-style-engine-css-rule.php +125 -0
- package/class-wp-style-engine-css-rules-store.php +144 -0
- package/class-wp-style-engine-processor.php +143 -0
- package/class-wp-style-engine.php +265 -144
- package/package.json +2 -2
- package/phpunit/class-wp-style-engine-css-declarations-test.php +129 -3
- package/phpunit/class-wp-style-engine-css-rule-test.php +127 -0
- package/phpunit/class-wp-style-engine-css-rules-store-test.php +171 -0
- package/phpunit/class-wp-style-engine-processor-test.php +266 -0
- package/phpunit/class-wp-style-engine-test.php +223 -22
- package/src/index.ts +4 -4
- package/src/styles/typography/index.ts +13 -0
- package/src/styles/utils.ts +5 -5
- package/src/test/index.js +64 -11
- package/src/types.ts +3 -4
- package/tsconfig.tsbuildinfo +1 -1
|
@@ -0,0 +1,143 @@
|
|
|
1
|
+
<?php
|
|
2
|
+
/**
|
|
3
|
+
* WP_Style_Engine_Processor
|
|
4
|
+
*
|
|
5
|
+
* Compiles styles from stores or collection of CSS rules.
|
|
6
|
+
*
|
|
7
|
+
* @package Gutenberg
|
|
8
|
+
*/
|
|
9
|
+
|
|
10
|
+
if ( class_exists( 'WP_Style_Engine_Processor' ) ) {
|
|
11
|
+
return;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
/**
|
|
15
|
+
* Compiles styles from stores or collection of CSS rules.
|
|
16
|
+
*
|
|
17
|
+
* @access private
|
|
18
|
+
*/
|
|
19
|
+
class WP_Style_Engine_Processor {
|
|
20
|
+
|
|
21
|
+
/**
|
|
22
|
+
* The Style-Engine Store objects
|
|
23
|
+
*
|
|
24
|
+
* @var WP_Style_Engine_CSS_Rules_Store[]
|
|
25
|
+
*/
|
|
26
|
+
protected $stores = array();
|
|
27
|
+
|
|
28
|
+
/**
|
|
29
|
+
* The set of CSS rules that this processor will work on.
|
|
30
|
+
*
|
|
31
|
+
* @var WP_Style_Engine_CSS_Rule[]
|
|
32
|
+
*/
|
|
33
|
+
protected $css_rules = array();
|
|
34
|
+
|
|
35
|
+
/**
|
|
36
|
+
* Add a store to the processor.
|
|
37
|
+
*
|
|
38
|
+
* @param WP_Style_Engine_CSS_Rules_Store $store The store to add.
|
|
39
|
+
*
|
|
40
|
+
* @return WP_Style_Engine_Processor Returns the object to allow chaining methods.
|
|
41
|
+
*/
|
|
42
|
+
public function add_store( WP_Style_Engine_CSS_Rules_Store $store ) {
|
|
43
|
+
$this->stores[ $store->get_name() ] = $store;
|
|
44
|
+
|
|
45
|
+
return $this;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
/**
|
|
49
|
+
* Adds rules to be processed.
|
|
50
|
+
*
|
|
51
|
+
* @param WP_Style_Engine_CSS_Rule|WP_Style_Engine_CSS_Rule[] $css_rules A single, or an array of, WP_Style_Engine_CSS_Rule objects from a store or otherwise.
|
|
52
|
+
*
|
|
53
|
+
* @return WP_Style_Engine_Processor Returns the object to allow chaining methods.
|
|
54
|
+
*/
|
|
55
|
+
public function add_rules( $css_rules ) {
|
|
56
|
+
if ( ! is_array( $css_rules ) ) {
|
|
57
|
+
$css_rules = array( $css_rules );
|
|
58
|
+
}
|
|
59
|
+
foreach ( $css_rules as $rule ) {
|
|
60
|
+
$selector = $rule->get_selector();
|
|
61
|
+
if ( isset( $this->css_rules[ $selector ] ) ) {
|
|
62
|
+
$this->css_rules[ $selector ]->add_declarations( $rule->get_declarations() );
|
|
63
|
+
continue;
|
|
64
|
+
}
|
|
65
|
+
$this->css_rules[ $rule->get_selector() ] = $rule;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
return $this;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
/**
|
|
72
|
+
* Get the CSS rules as a string.
|
|
73
|
+
*
|
|
74
|
+
* @param array $options array(
|
|
75
|
+
* 'optimize' => (boolean) Whether to optimize the CSS output, e.g., combine rules.
|
|
76
|
+
* 'prettify' => (boolean) Whether to add new lines to output.
|
|
77
|
+
* );.
|
|
78
|
+
*
|
|
79
|
+
* @return string The computed CSS.
|
|
80
|
+
*/
|
|
81
|
+
public function get_css( $options = array() ) {
|
|
82
|
+
$defaults = array(
|
|
83
|
+
'optimize' => true,
|
|
84
|
+
'prettify' => defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG,
|
|
85
|
+
);
|
|
86
|
+
$options = wp_parse_args( $options, $defaults );
|
|
87
|
+
|
|
88
|
+
// If we have stores, get the rules from them.
|
|
89
|
+
foreach ( $this->stores as $store ) {
|
|
90
|
+
$this->add_rules( $store->get_all_rules() );
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
// Combine CSS selectors that have identical declarations.
|
|
94
|
+
if ( true === $options['optimize'] ) {
|
|
95
|
+
$this->combine_rules_selectors();
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
// Build the CSS.
|
|
99
|
+
$css = '';
|
|
100
|
+
foreach ( $this->css_rules as $rule ) {
|
|
101
|
+
$css .= $rule->get_css( $options['prettify'] );
|
|
102
|
+
$css .= $options['prettify'] ? "\n" : '';
|
|
103
|
+
}
|
|
104
|
+
return $css;
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
/**
|
|
108
|
+
* Combines selectors from the rules store when they have the same styles.
|
|
109
|
+
*
|
|
110
|
+
* @return void
|
|
111
|
+
*/
|
|
112
|
+
private function combine_rules_selectors() {
|
|
113
|
+
// Build an array of selectors along with the JSON-ified styles to make comparisons easier.
|
|
114
|
+
$selectors_json = array();
|
|
115
|
+
foreach ( $this->css_rules as $rule ) {
|
|
116
|
+
$declarations = $rule->get_declarations()->get_declarations();
|
|
117
|
+
ksort( $declarations );
|
|
118
|
+
$selectors_json[ $rule->get_selector() ] = wp_json_encode( $declarations );
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
// Combine selectors that have the same styles.
|
|
122
|
+
foreach ( $selectors_json as $selector => $json ) {
|
|
123
|
+
// Get selectors that use the same styles.
|
|
124
|
+
$duplicates = array_keys( $selectors_json, $json, true );
|
|
125
|
+
// Skip if there are no duplicates.
|
|
126
|
+
if ( 1 >= count( $duplicates ) ) {
|
|
127
|
+
continue;
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
$declarations = $this->css_rules[ $selector ]->get_declarations();
|
|
131
|
+
|
|
132
|
+
foreach ( $duplicates as $key ) {
|
|
133
|
+
// Unset the duplicates from the $selectors_json array to avoid looping through them as well.
|
|
134
|
+
unset( $selectors_json[ $key ] );
|
|
135
|
+
// Remove the rules from the rules collection.
|
|
136
|
+
unset( $this->css_rules[ $key ] );
|
|
137
|
+
}
|
|
138
|
+
// Create a new rule with the combined selectors.
|
|
139
|
+
$duplicate_selectors = implode( ',', $duplicates );
|
|
140
|
+
$this->css_rules[ $duplicate_selectors ] = new WP_Style_Engine_CSS_Rule( $duplicate_selectors, $declarations );
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
}
|