<?php
/**
 * SVG Icon block server-side render.
 *
 * @package Eryndo
 *
 * @var array    $attributes Block attributes.
 * @var string   $content    Block content.
 * @var WP_Block $block      Block instance.
 */

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

$icon_url         = $attributes['iconUrl'] ?? '';
$icon_svg         = $attributes['iconSvg'] ?? '';
$size             = isset( $attributes['size'] ) ? (int) $attributes['size'] : 48;
$align            = $attributes['align'] ?? 'center';
$enable_color_mod = ! empty( $attributes['enableColorModification'] );
$link_url         = $attributes['linkUrl'] ?? '';
$open_in_new_tab  = ! empty( $attributes['openInNewTab'] );
$link_label       = $attributes['linkLabel'] ?? '';
$style            = $attributes['style'] ?? array();
$color_value      = $style['color']['text'] ?? 'currentColor';
$background_color = $style['color']['background'] ?? 'transparent';

$wrapper_attributes = get_block_wrapper_attributes(
	array(
		'class' => sprintf( 'has-text-align-%s eryndo-svg-icon-block', esc_attr( $align ) ),
		'style' => sprintf(
			'display:inline-block;text-align:%1$s;width:fit-content;margin:0 auto;--icon-color:%2$s;--icon-bg-color:%3$s',
			esc_attr( $align ),
			esc_attr( $color_value ),
			esc_attr( $background_color )
		),
	)
);

$container_style = sprintf(
	'display:inline-flex;align-items:center;justify-content:center;width:%1$dpx;height:%1$dpx;line-height:0;color:var(--icon-color);background-color:var(--icon-bg-color)',
	$size
);

$icon_markup = '';

if ( $icon_url && $enable_color_mod ) {
	$mask_url   = esc_url( $icon_url );
	$mask_style = sprintf(
		'width:100%%;height:100%%;background-color:currentColor;-webkit-mask:url("%1$s") center / contain no-repeat;mask:url("%1$s") center / contain no-repeat',
		$mask_url
	);
	$icon_markup = sprintf(
		'<div class="svg-icon-mask" data-icon-url="%1$s" style="%2$s"></div>',
		$mask_url,
		esc_attr( $mask_style )
	);
} elseif ( $icon_url ) {
	$icon_markup = sprintf(
		'<img src="%1$s" alt="" aria-hidden="true" style="width:100%%;height:100%%;object-fit:contain" />',
		esc_url( $icon_url )
	);
} elseif ( $icon_svg ) {
	$icon_markup = wp_kses_post( $icon_svg );
}

$inner_html = sprintf(
	'<div class="svg-icon-container" style="%1$s">%2$s</div>',
	esc_attr( $container_style ),
	$icon_markup
);

if ( $link_url ) {
	$accessible_name = $link_label ? $link_label : __( 'Icon link', 'eryndo' );
	$rel             = $open_in_new_tab ? ' rel="noopener noreferrer"' : '';
	$target          = $open_in_new_tab ? ' target="_blank"' : '';
	printf(
		'<div %1$s><a href="%2$s" class="eryndo-svg-icon-link" aria-label="%3$s"%4$s%5$s>%6$s</a></div>',
		$wrapper_attributes, // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
		esc_url( $link_url ),
		esc_attr( $accessible_name ),
		$target, // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
		$rel, // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
		$inner_html // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
	);
} else {
	printf(
		'<div %1$s>%2$s</div>',
		$wrapper_attributes, // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
		$inner_html // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
	);
}
