@wordpress/style-engine 0.11.0 → 0.14.0

package/class-wp-style-engine-css-rules-store.php

@@ -0,0 +1,143 @@
+<?php
+/**
+ * WP_Style_Engine_CSS_Rules_Store
+ *
+ * A store for WP_Style_Engine_CSS_Rule objects.
+ *
+ * @package Gutenberg
+ */
+
+if ( class_exists( 'WP_Style_Engine_CSS_Rules_Store' ) ) {
+	return;
+}
+
+/**
+ * Holds, sanitizes, processes and prints CSS declarations for the style engine.
+ *
+ * @access private
+ */
+class WP_Style_Engine_CSS_Rules_Store {
+
+	/**
+	 * An array of named WP_Style_Engine_CSS_Rules_Store objects.
+	 *
+	 * @static
+	 *
+	 * @var WP_Style_Engine_CSS_Rules_Store[]
+	 */
+	protected static $stores = array();
+
+
+	/**
+	 * The store name.
+	 *
+	 * @var string
+	 */
+	protected $name = '';
+
+	/**
+	 * An array of CSS Rules objects assigned to the store.
+	 *
+	 * @var WP_Style_Engine_CSS_Rule[]
+	 */
+	protected $rules = array();
+
+	/**
+	 * Get an instance of the store.
+	 *
+	 * @param string $store_name The name of the store.
+	 *
+	 * @return WP_Style_Engine_CSS_Rules_Store
+	 */
+	public static function get_store( $store_name = 'default' ) {
+		if ( ! isset( static::$stores[ $store_name ] ) ) {
+			static::$stores[ $store_name ] = new static();
+			// Set the store name.
+			static::$stores[ $store_name ]->set_name( $store_name );
+		}
+		return static::$stores[ $store_name ];
+	}
+
+	/**
+	 * Get an array of all available stores.
+	 *
+	 * @return WP_Style_Engine_CSS_Rules_Store[]
+	 */
+	public static function get_stores() {
+		return static::$stores;
+	}
+
+	/**
+	 * Clears all stores from static::$stores.
+	 *
+	 * @return void
+	 */
+	public static function remove_all_stores() {
+		static::$stores = array();
+	}
+
+	/**
+	 * Set the store name.
+	 *
+	 * @param string $name The store name.
+	 *
+	 * @return void
+	 */
+	public function set_name( $name ) {
+		$this->name = $name;
+	}
+
+	/**
+	 * Get the store name.
+	 *
+	 * @return string
+	 */
+	public function get_name() {
+		return $this->name;
+	}
+
+	/**
+	 * Get an array of all rules.
+	 *
+	 * @return WP_Style_Engine_CSS_Rule[]
+	 */
+	public function get_all_rules() {
+		return $this->rules;
+	}
+
+	/**
+	 * Get a WP_Style_Engine_CSS_Rule object by its selector.
+	 * If the rule does not exist, it will be created.
+	 *
+	 * @param string $selector The CSS selector.
+	 *
+	 * @return WP_Style_Engine_CSS_Rule|null Returns a WP_Style_Engine_CSS_Rule object, or null if the selector is empty.
+	 */
+	public function add_rule( $selector ) {
+
+		$selector = trim( $selector );
+
+		// Bail early if there is no selector.
+		if ( empty( $selector ) ) {
+			return;
+		}
+
+		// Create the rule if it doesn't exist.
+		if ( empty( $this->rules[ $selector ] ) ) {
+			$this->rules[ $selector ] = new WP_Style_Engine_CSS_Rule( $selector );
+		}
+
+		return $this->rules[ $selector ];
+	}
+
+	/**
+	 * Remove a selector from the store.
+	 *
+	 * @param string $selector The CSS selector.
+	 *
+	 * @return void
+	 */
+	public function remove_rule( $selector ) {
+		unset( $this->rules[ $selector ] );
+	}
+}

package/class-wp-style-engine-processor.php

@@ -0,0 +1,135 @@
+<?php
+/**
+ * WP_Style_Engine_Processor
+ *
+ * Compiles styles from stores or collection of CSS rules.
+ *
+ * @package Gutenberg
+ */
+
+if ( class_exists( 'WP_Style_Engine_Processor' ) ) {
+	return;
+}
+
+/**
+ * Compiles styles from stores or collection of CSS rules.
+ *
+ * @access private
+ */
+class WP_Style_Engine_Processor {
+
+	/**
+	 * The Style-Engine Store objects
+	 *
+	 * @var WP_Style_Engine_CSS_Rules_Store[]
+	 */
+	protected $stores = array();
+
+	/**
+	 * The set of CSS rules that this processor will work on.
+	 *
+	 * @var WP_Style_Engine_CSS_Rule[]
+	 */
+	protected $css_rules = array();
+
+	/**
+	 * Add a store to the processor.
+	 *
+	 * @param WP_Style_Engine_CSS_Rules_Store $store The store to add.
+	 */
+	public function add_store( WP_Style_Engine_CSS_Rules_Store $store ) {
+		$this->stores[ $store->get_name() ] = $store;
+	}
+
+	/**
+	 * Adds rules to be processed.
+	 *
+	 * @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.
+	 */
+	public function add_rules( $css_rules ) {
+		if ( ! is_array( $css_rules ) ) {
+			$css_rules = array( $css_rules );
+		}
+		foreach ( $css_rules as $rule ) {
+			$selector = $rule->get_selector();
+			if ( isset( $this->css_rules[ $selector ] ) ) {
+				$this->css_rules[ $selector ]->add_declarations( $rule->get_declarations() );
+				continue;
+			}
+			$this->css_rules[ $rule->get_selector() ] = $rule;
+		}
+	}
+
+	/**
+	 * Get the CSS rules as a string.
+	 *
+	 * @param array $options array(
+	 *    'optimize' => (boolean) Whether to optimize the CSS output, e.g., combine rules.
+	 *    'prettify' => (boolean) Whether to add new lines to output.
+	 * );.
+	 *
+	 * @return string The computed CSS.
+	 */
+	public function get_css( $options = array() ) {
+		$defaults = array(
+			'optimize' => true,
+			'prettify' => false,
+		);
+		$options  = wp_parse_args( $options, $defaults );
+
+		// If we have stores, get the rules from them.
+		foreach ( $this->stores as $store ) {
+			$this->add_rules( $store->get_all_rules() );
+		}
+
+		// Combine CSS selectors that have identical declarations.
+		if ( true === $options['optimize'] ) {
+			$this->combine_rules_selectors();
+		}
+
+		// Build the CSS.
+		$css = '';
+		foreach ( $this->css_rules as $rule ) {
+			$css .= $rule->get_css( $options['prettify'] );
+			$css .= $options['prettify'] ? "\n" : '';
+		}
+		return $css;
+	}
+
+	/**
+	 * Combines selectors from the rules store when they have the same styles.
+	 *
+	 * @return void
+	 */
+	private function combine_rules_selectors() {
+		// Build an array of selectors along with the JSON-ified styles to make comparisons easier.
+		$selectors_json = array();
+		foreach ( $this->css_rules as $rule ) {
+			$declarations = $rule->get_declarations()->get_declarations();
+			ksort( $declarations );
+			$selectors_json[ $rule->get_selector() ] = wp_json_encode( $declarations );
+		}
+
+		// Combine selectors that have the same styles.
+		foreach ( $selectors_json as $selector => $json ) {
+			// Get selectors that use the same styles.
+			$duplicates = array_keys( $selectors_json, $json, true );
+			// Skip if there are no duplicates.
+			if ( 1 >= count( $duplicates ) ) {
+				continue;
+			}
+
+			$declarations = $this->css_rules[ $selector ]->get_declarations();
+
+			foreach ( $duplicates as $key ) {
+				// Unset the duplicates from the $selectors_json array to avoid looping through them as well.
+				unset( $selectors_json[ $key ] );
+				// Remove the rules from the rules collection.
+				unset( $this->css_rules[ $key ] );
+			}
+			// Create a new rule with the combined selectors.
+			$duplicate_selectors                     = implode( ',', $duplicates );
+			$this->css_rules[ $duplicate_selectors ] = new WP_Style_Engine_CSS_Rule( $duplicate_selectors, $declarations );
+		}
+	}
+}