| 1 |
<?php |
| 2 |
/** |
| 3 |
* Server-side customizations for the `core/group` block. |
| 4 |
* |
| 5 |
* @package twentig |
| 6 |
*/ |
| 7 |
|
| 8 |
defined( 'ABSPATH' ) || exit; |
| 9 |
|
| 10 |
/** |
| 11 |
* Filters the group block output. |
| 12 |
* |
| 13 |
* @param string $block_content Rendered block content. |
| 14 |
* @param array $block Block object. |
| 15 |
* @return string Filtered block content. |
| 16 |
*/ |
| 17 |
function twentig_filter_group_block( $block_content, $block ) { |
| 18 |
|
| 19 |
$attributes = $block['attrs'] ?? array(); |
| 20 |
$hover_bg = $attributes['twHoverBackgroundColor'] ?? ''; |
| 21 |
$hover_text = $attributes['twHoverTextColor'] ?? ''; |
| 22 |
$hover_border = $attributes['twHoverBorderColor'] ?? ''; |
| 23 |
$hover_shadow = $attributes['twHoverShadow'] ?? ''; |
| 24 |
|
| 25 |
if ( ! $hover_bg && ! $hover_text && ! $hover_border && ! $hover_shadow ) { |
| 26 |
return $block_content; |
| 27 |
} |
| 28 |
|
| 29 |
$tag_processor = new WP_HTML_Tag_Processor( $block_content ); |
| 30 |
if ( $tag_processor->next_tag() ) { |
| 31 |
|
| 32 |
$style = ''; |
| 33 |
if ( $hover_bg ) { |
| 34 |
$style .= twentig_get_color_preset_value( $hover_bg, '--hover-background-color' ); |
| 35 |
$tag_processor->add_class( 'tw-has-hover-bg' ); |
| 36 |
} |
| 37 |
|
| 38 |
if ( $hover_text ) { |
| 39 |
$style .= twentig_get_color_preset_value( $hover_text, '--hover-text-color' ); |
| 40 |
$tag_processor->add_class( 'tw-has-hover-text' ); |
| 41 |
} |
| 42 |
|
| 43 |
if ( $hover_border ) { |
| 44 |
$style .= twentig_get_color_preset_value( $hover_border, '--hover-border-color' ); |
| 45 |
$tag_processor->add_class( 'tw-has-hover-border' ); |
| 46 |
} |
| 47 |
|
| 48 |
if ( $hover_shadow ) { |
| 49 |
$style .= twentig_get_shadow_preset_value( $hover_shadow, '--hover-box-shadow' ); |
| 50 |
$tag_processor->add_class( 'tw-has-hover-shadow' ); |
| 51 |
} |
| 52 |
|
| 53 |
$style_attr = $tag_processor->get_attribute( 'style' ); |
| 54 |
$tag_processor->set_attribute( 'style', $style . $style_attr ); |
| 55 |
|
| 56 |
return $tag_processor->get_updated_html(); |
| 57 |
} |
| 58 |
|
| 59 |
return $block_content; |
| 60 |
} |
| 61 |
add_filter( 'render_block_core/group', 'twentig_filter_group_block', 10, 2 ); |
| 62 |
|
| 63 |
/** |
| 64 |
* Converts color value to CSS custom property. |
| 65 |
* |
| 66 |
* @param string $value Color value or preset reference. |
| 67 |
* @param string $css_var CSS custom property name. |
| 68 |
* |
| 69 |
* @return string CSS declaration. |
| 70 |
*/ |
| 71 |
function twentig_get_color_preset_value( $value, $css_var ) { |
| 72 |
if ( str_contains( $value, 'var:preset|color|' ) ) { |
| 73 |
$index_to_splice = strrpos( $value, '|' ) + 1; |
| 74 |
$slug = _wp_to_kebab_case( substr( $value, $index_to_splice ) ); |
| 75 |
$color = "var(--wp--preset--color--$slug)"; |
| 76 |
} else { |
| 77 |
$color = $value; |
| 78 |
} |
| 79 |
return $css_var . ':' . esc_attr( $color ) . ';'; |
| 80 |
} |
| 81 |
|
| 82 |
/** |
| 83 |
* Converts shadow preset to CSS custom property. |
| 84 |
* |
| 85 |
* @param string $value Shadow preset slug. |
| 86 |
* @param string $css_var CSS custom property name. |
| 87 |
* |
| 88 |
* @return string CSS declaration. |
| 89 |
*/ |
| 90 |
function twentig_get_shadow_preset_value( $value, $css_var ) { |
| 91 |
$value = sanitize_key( $value ); |
| 92 |
if ( ! $value ) { |
| 93 |
return ''; |
| 94 |
} |
| 95 |
$shadow = "var(--wp--preset--shadow--$value)"; |
| 96 |
return $css_var . ':' . esc_attr( $shadow ) . ';'; |
| 97 |
} |
| 98 |
|
