| @@ -5,8 +5,27 @@ | ||
| 5 | 5 | * @package gutenberg |
| 6 | 6 | */ |
| 7 | 7 | |
| 8 | 8 | /** |
| 9 | + * Fetches the preferences for each origin (core, theme, user) | |
| 10 | + * and enqueues the resulting stylesheet. | |
| 11 | + */ | |
| 12 | +function gutenberg_experimental_global_styles_enqueue_assets() { | |
| 13 | + $stylesheet = wp_get_global_stylesheet(); | |
| 14 | + if ( empty( $stylesheet ) ) { | |
| 15 | + return; | |
| 16 | + } | |
| 17 | + | |
| 18 | + if ( isset( wp_styles()->registered['global-styles'] ) ) { | |
| 19 | + wp_styles()->registered['global-styles']->extra['after'][0] = $stylesheet; | |
| 20 | + } else { | |
| 21 | + wp_register_style( 'global-styles', false, array(), true, true ); | |
| 22 | + wp_add_inline_style( 'global-styles', $stylesheet ); | |
| 23 | + wp_enqueue_style( 'global-styles' ); | |
| 24 | + } | |
| 25 | +} | |
| 26 | + | |
| 27 | +/** | |
| 9 | 28 | * Adds the necessary settings for the Global Styles client UI. |
| 10 | 29 | * |
| 11 | 30 | * @param array $settings Existing block editor settings. |
| 12 | 31 | * |
| @@ -51,36 +70,40 @@ | ||
| 51 | 70 | } |
| 52 | 71 | } |
| 53 | 72 | |
| 54 | 73 | $new_global_styles = array(); |
| 55 | - | |
| 56 | - $css_variables = wp_get_global_stylesheet( array( 'variables' ) ); | |
| 57 | - if ( '' !== $css_variables ) { | |
| 58 | - $new_global_styles[] = array( | |
| 59 | - 'css' => $css_variables, | |
| 74 | + $new_presets = array( | |
| 75 | + array( | |
| 76 | + 'css' => 'variables', | |
| 77 | + '__unstableType' => 'presets', | |
| 78 | + '__experimentalNoWrapper' => true, | |
| 79 | + ), | |
| 80 | + array( | |
| 81 | + 'css' => 'presets', | |
| 60 | 82 | '__unstableType' => 'presets', |
| 61 | - ); | |
| 83 | + ), | |
| 84 | + ); | |
| 85 | + foreach ( $new_presets as $new_style ) { | |
| 86 | + $style_css = wp_get_global_stylesheet( array( $new_style['css'] ) ); | |
| 87 | + if ( '' !== $style_css ) { | |
| 88 | + $new_style['css'] = $style_css; | |
| 89 | + $new_global_styles[] = $new_style; | |
| 90 | + } | |
| 62 | 91 | } |
| 63 | 92 | |
| 64 | - $css_presets = wp_get_global_stylesheet( array( 'presets' ) ); | |
| 65 | - if ( '' !== $css_presets ) { | |
| 66 | - $new_global_styles[] = array( | |
| 67 | - 'css' => $css_presets, | |
| 68 | - '__unstableType' => 'presets', | |
| 69 | - ); | |
| 70 | - } | |
| 71 | - | |
| 93 | + $new_block_classes = array( | |
| 94 | + 'css' => 'styles', | |
| 95 | + '__unstableType' => 'theme', | |
| 96 | + ); | |
| 72 | 97 | if ( WP_Theme_JSON_Resolver_Gutenberg::theme_has_support() ) { |
| 73 | - $css_blocks = wp_get_global_stylesheet( array( 'styles' ) ); | |
| 74 | - if ( '' !== $css_blocks ) { | |
| 75 | - $new_global_styles[] = array( | |
| 76 | - 'css' => $css_blocks, | |
| 77 | - '__unstableType' => 'theme', | |
| 78 | - ); | |
| 98 | + $style_css = wp_get_global_stylesheet( array( $new_block_classes['css'] ) ); | |
| 99 | + if ( '' !== $style_css ) { | |
| 100 | + $new_block_classes['css'] = $style_css; | |
| 101 | + $new_global_styles[] = $new_block_classes; | |
| 79 | 102 | } |
| 80 | 103 | } |
| 81 | 104 | |
| 82 | - $settings['styles'] = array_merge( $new_global_styles, $styles_without_existing_global_styles ); | |
| 105 | + $settings['styles'] = array_merge( $styles_without_existing_global_styles, $new_global_styles ); | |
| 83 | 106 | } |
| 84 | 107 | |
| 85 | 108 | // Copied from get_block_editor_settings() at wordpress-develop/block-editor.php. |
| 86 | 109 | $settings['__experimentalFeatures'] = wp_get_global_settings(); |
| @@ -142,8 +165,28 @@ | ||
| 142 | 165 | return $settings; |
| 143 | 166 | } |
| 144 | 167 | |
| 145 | 168 | /** |
| 169 | + * Whether or not the Site Editor is available. | |
| 170 | + * | |
| 171 | + * @return boolean | |
| 172 | + */ | |
| 173 | +function gutenberg_experimental_is_site_editor_available() { | |
| 174 | + return gutenberg_is_fse_theme(); | |
| 175 | +} | |
| 176 | + | |
| 177 | +/** | |
| 178 | + * Register CPT to store/access user data. | |
| 179 | + * | |
| 180 | + * @return void | |
| 181 | + */ | |
| 182 | +function gutenberg_experimental_global_styles_register_user_cpt() { | |
| 183 | + if ( gutenberg_experimental_is_site_editor_available() ) { | |
| 184 | + register_global_styles_custom_post_type(); | |
| 185 | + } | |
| 186 | +} | |
| 187 | + | |
| 188 | +/** | |
| 146 | 189 | * Sanitizes global styles user content removing unsafe rules. |
| 147 | 190 | * |
| 148 | 191 | * @param string $content Post content to filter. |
| 149 | 192 | * @return string Filtered post content with unsafe rules removed. |
| @@ -210,11 +253,54 @@ | ||
| 210 | 253 | } |
| 211 | 254 | return $arg; |
| 212 | 255 | } |
| 213 | 256 | |
| 214 | -add_filter( 'block_editor_settings_all', 'gutenberg_experimental_global_styles_settings', PHP_INT_MAX ); | |
| 257 | +// TODO: Remove this filter when minimum supported version is WP 5.8 | |
| 258 | +// As all this code is not needed anymore now core supports all variables. | |
| 259 | +/** | |
| 260 | + * This filter is the last being executed on force_filtered_html_on_import. | |
| 261 | + * If the input of the filter is true it means we are in an import situation and should | |
| 262 | + * enable kses, independently of the user capabilities. | |
| 263 | + * So in that case we call gutenberg_global_styles_kses_init_filters; | |
| 264 | + * | |
| 265 | + * @param bool $allow_css Whether the CSS in the test string is considered safe. | |
| 266 | + * @param bool $css_test_string The CSS string to test.. | |
| 267 | + * @return bool If $allow_css is true it returns true. | |
| 268 | + * If $allow_css is false and the CSS rule is referencing a WordPress css variable it returns true. | |
| 269 | + * Otherwise the function return false. | |
| 270 | + */ | |
| 271 | +function gutenberg_global_styles_include_support_for_wp_variables( $allow_css, $css_test_string ) { | |
| 272 | + if ( $allow_css ) { | |
| 273 | + return $allow_css; | |
| 274 | + } | |
| 275 | + $allowed_preset_attributes = array( | |
| 276 | + 'background', | |
| 277 | + 'background-color', | |
| 278 | + 'border-color', | |
| 279 | + 'color', | |
| 280 | + 'font-family', | |
| 281 | + 'font-size', | |
| 282 | + ); | |
| 283 | + $parts = explode( ':', $css_test_string, 2 ); | |
| 215 | 284 | |
| 285 | + if ( ! in_array( trim( $parts[0] ), $allowed_preset_attributes, true ) ) { | |
| 286 | + return $allow_css; | |
| 287 | + } | |
| 288 | + return ! ! preg_match( '/^var\(--wp-[a-zA-Z0-9\-]+\)$/', trim( $parts[1] ) ); | |
| 289 | +} | |
| 290 | + | |
| 291 | +// The else clause can be removed when plugin support requires WordPress 5.8.0+. | |
| 292 | +if ( function_exists( 'get_block_editor_settings' ) ) { | |
| 293 | + add_filter( 'block_editor_settings_all', 'gutenberg_experimental_global_styles_settings', PHP_INT_MAX ); | |
| 294 | +} else { | |
| 295 | + add_filter( 'block_editor_settings', 'gutenberg_experimental_global_styles_settings', PHP_INT_MAX ); | |
| 296 | +} | |
| 297 | + | |
| 298 | +add_action( 'init', 'gutenberg_experimental_global_styles_register_user_cpt' ); | |
| 299 | +add_action( 'wp_enqueue_scripts', 'gutenberg_experimental_global_styles_enqueue_assets' ); | |
| 300 | + | |
| 216 | 301 | // kses actions&filters. |
| 217 | 302 | add_action( 'init', 'gutenberg_global_styles_kses_init' ); |
| 218 | 303 | add_action( 'set_current_user', 'gutenberg_global_styles_kses_init' ); |
| 219 | 304 | add_filter( 'force_filtered_html_on_import', 'gutenberg_global_styles_force_filtered_html_on_import_filter', 999 ); |
| 305 | +add_filter( 'safecss_filter_attr_allow_css', 'gutenberg_global_styles_include_support_for_wp_variables', 10, 2 ); | |
| 220 | 306 | // This filter needs to be executed last. |
