true,
'fill' => true,
'fill-rule' => true,
'clip-rule' => true,
'stroke' => true,
'stroke-width' => true,
'stroke-linecap' => true,
'stroke-linejoin' => true,
'stroke-dasharray' => true,
'opacity' => true,
'transform' => true,
'cx' => true,
'cy' => true,
'r' => true,
'rx' => true,
'ry' => true,
'x' => true,
'y' => true,
'x1' => true,
'y1' => true,
'x2' => true,
'y2' => true,
'width' => true,
'height' => true,
'points' => true,
];
$allowed = [
'svg' => [
'class' => true,
'xmlns' => true,
'viewbox' => true,
'width' => true,
'height' => true,
'fill' => true,
'stroke' => true,
'stroke-width' => true,
'stroke-linecap' => true,
'stroke-linejoin' => true,
'role' => true,
'aria-hidden' => true,
'focusable' => true,
],
'g' => [ 'fill' => true, 'stroke' => true, 'transform' => true, 'opacity' => true ],
'title' => [],
'defs' => [],
'path' => $shape_attrs,
'circle' => $shape_attrs,
'ellipse' => $shape_attrs,
'rect' => $shape_attrs,
'line' => $shape_attrs,
'polyline' => $shape_attrs,
'polygon' => $shape_attrs,
];
$clean = wp_kses( $svg, $allowed );
// wp_kses lowercases attribute names, but a few SVG attributes are
// case-sensitive in the browser — restore them, or the icon won't scale.
return str_ireplace(
[ 'viewbox=', 'preserveaspectratio=' ],
[ 'viewBox=', 'preserveAspectRatio=' ],
$clean
);
}
/**
* Render a standalone IconValue to safe HTML.
*
* Uploaded SVGs become an '
. ' ';
}
/**
* Render an inline clock glyph for a feed date/time. Inherits `currentColor` and
* sizes to 1em. Mirrors the editor `ClockIcon`. Shared by the feed blocks.
*
* @param string $class Class(es) for the (sizing/spacing).
* @return string Safe SVG.
*/
public static function clock_icon( $class = '' ) {
$class_attr = '' !== $class ? ' class="' . esc_attr( $class ) . '"' : '';
return ' ';
}
/**
* Render a "media type" badge for a social-feed thumbnail — a small chip marking
* a video (play glyph) or an album / carousel (stacked squares). Shared by the
* Facebook and Instagram feed blocks; mirrors the editor `MediaBadge` component.
* Returns '' for a plain single image.
*
* @param string $type Normalised media type: 'video' | 'album' | anything else.
* @param string $extra_class Extra class(es) appended to the badge (for positioning).
* @return string Safe badge HTML, or ''.
*/
public static function media_badge( $type, $extra_class = '' ) {
$type = (string) $type;
if ( 'video' === $type ) {
$svg = '' . $svg . ' ';
}
/**
* Build custom data-* attributes from htmlAttributes.customAttributes.
*
* Only `data-*` attribute names are emitted. Anything else — event handlers
* (`onclick`, `onmouseover`, …), `style`, `href`, etc. — is dropped, so a
* stored custom attribute can never become an inline-script XSS vector.
*
* @param array $attributes Block attributes.
* @return string Leading-space-prefixed attribute string or ''.
*/
public static function build_data_attrs( $attributes ) {
$html = '';
$custom = $attributes['htmlAttributes']['customAttributes'] ?? [];
if ( is_array( $custom ) ) {
foreach ( $custom as $pair ) {
$key = isset( $pair['key'] ) ? sanitize_key( $pair['key'] ) : '';
$val = isset( $pair['value'] ) ? (string) $pair['value'] : '';
// Restrict to data-* names; sanitize_key() alone would let
// through `onclick`/`style`/etc. and reopen an XSS hole.
if ( '' === $key || 0 !== strpos( $key, 'data-' ) ) {
continue;
}
$html .= ' ' . $key . '="' . esc_attr( $val ) . '"';
}
}
return $html;
}
/**
* Inline formatting allowed inside a promo heading / button label.
*
* @var array
*/
const PROMO_INLINE_ALLOWED = [
'strong' => [],
'em' => [],
'b' => [],
'i' => [],
'br' => [],
'span' => [],
];
/**
* Build the shared "promo content" markup — a heading, a description and a
* primary + optional secondary CTA button. Shared by the Banner and CTA
* render.php files so the identical markup isn't copied (guide §4.5). Returns
* '' when nothing is filled in.
*
* @param array $attributes Block attributes (PromoContentAttributes shape).
* @return string
*/
public static function promo_content_html( $attributes ) {
$text_tags = [ 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p', 'span', 'div' ];
$heading_tag = in_array( $attributes['headingTag'] ?? 'h2', $text_tags, true ) ? $attributes['headingTag'] : 'h2';
$heading = (string) ( $attributes['heading'] ?? '' );
$description = (string) ( $attributes['description'] ?? '' );
$desc_allowed = self::PROMO_INLINE_ALLOWED + [ 'a' => [ 'href' => true, 'target' => true, 'rel' => true ] ];
$heading_html = '' !== trim( $heading )
? '<' . $heading_tag . ' class="flexa-promo__heading">' . wp_kses( $heading, self::PROMO_INLINE_ALLOWED ) . ''
: '';
$description_html = '' !== trim( $description )
? '' . wp_kses( $description, $desc_allowed ) . '
'
: '';
$text_html = ( '' !== $heading_html || '' !== $description_html )
? '' . $heading_html . $description_html . '
'
: '';
$primary_html = self::promo_button_html( $attributes, 'primary' );
$secondary_html = ! empty( $attributes['showSecondary'] ) ? self::promo_button_html( $attributes, 'secondary' ) : '';
$buttons_html = ( '' !== $primary_html || '' !== $secondary_html )
? '' . $primary_html . $secondary_html . '
'
: '';
if ( '' === $text_html && '' === $buttons_html ) {
return '';
}
return '' . $text_html . $buttons_html . '
';
}
/**
* Build one promo CTA button (``), reading the prefixed attributes
* (`primary*` / `secondary*`). Returns '' when the label is empty.
*
* @param array $attributes Block attributes.
* @param string $kind 'primary' or 'secondary'.
* @return string
*/
private static function promo_button_html( $attributes, $kind ) {
$prefix = 'secondary' === $kind ? 'secondary' : 'primary';
$text = (string) ( $attributes[ $prefix . 'Text' ] ?? '' );
if ( '' === trim( $text ) ) {
return '';
}
$url = (string) ( $attributes[ $prefix . 'Url' ] ?? '' );
$new_tab = '_blank' === ( $attributes[ $prefix . 'Target' ] ?? '' );
$rel = trim( (string) ( $attributes[ $prefix . 'Rel' ] ?? '' ) );
$link_attrs = 'class="wp-element-button flexa-promo__button flexa-promo__button--' . $prefix . '"';
if ( '' !== $url ) {
$link_attrs .= ' href="' . esc_url( $url ) . '"';
}
if ( $new_tab ) {
$link_attrs .= ' target="_blank"';
if ( '' === $rel ) {
$rel = 'noopener noreferrer';
}
}
if ( '' !== $rel ) {
$rel = trim( (string) preg_replace( '/[^a-z0-9 _-]/i', '', $rel ) );
$link_attrs .= ' rel="' . esc_attr( $rel ) . '"';
}
// Resolve the button icon to inline SVG (builtin/library) or an ' . wp_kses( $text, self::PROMO_INLINE_ALLOWED ) . ' ';
$inner = '';
if ( '' !== $icon_svg && 'before' === $icon_pos ) {
$inner .= $icon_svg;
}
$inner .= $label;
if ( '' !== $icon_svg && 'after' === $icon_pos ) {
$inner .= $icon_svg;
}
return ' ' . $inner . ' ';
}
/**
* Allowed native input types for a subscribe-form field.
*
* @var array
*/
const FIELD_INPUT_TYPES = [ 'text', 'email', 'tel', 'url', 'number', 'date' ];
/**
* Slugify a label into a safe field key (a-z 0-9 and underscores).
*
* Mirrors the editor-side deriveFieldName() so the front-end name matches the
* hint shown in the inspector.
*
* @param string $label Raw label text.
* @return string
*/
public static function slugify_field_name( $label ) {
$slug = strtolower( (string) $label );
$slug = preg_replace( '/[^a-z0-9]+/', '_', $slug );
return trim( (string) $slug, '_' );
}
/**
* Resolve a field's submitted `name`: the explicit `fieldName`, else derived
* from the label, else the block-supplied fallback.
*
* @param array $attributes Field attributes.
* @param string $fallback Fallback key when nothing else resolves.
* @return string
*/
public static function subscribe_field_name( $attributes, $fallback ) {
$name = trim( (string) ( $attributes['fieldName'] ?? '' ) );
if ( '' === $name ) {
$name = self::slugify_field_name( (string) ( $attributes['label'] ?? '' ) );
}
if ( '' === $name ) {
$name = $fallback;
}
return $name;
}
/**
* Render one subscribe-form field: a `.flexa-field` wrapper holding an optional
* label and the input (or textarea). Shared by all four field children so the
* markup isn't copied (guide §4.5). All user text is escaped here.
*
* @param array $attributes Field attributes (SubscribeFieldAttributes shape).
* @param string $type Native input type (used when not multiline).
* @param string $fallback Fallback field name.
* @param bool $multiline Render a ';
} else {
$control = '* ' : '';
$label_html = '' . esc_html( $label ) . $req_mark . ' ';
}
return self::field_shell( $attributes, $label_html . $control );
}
/**
* Render a choice subscribe-form field: a select dropdown, or a radio /
* checkbox group. Shared by those three field children. All user text escaped.
*
* @param array $attributes Field attributes (SubscribeFieldAttributes shape).
* @param string $variant 'select' | 'radio' | 'checkbox'.
* @param string $fallback Fallback field name.
* @return string
*/
public static function subscribe_choice_field( $attributes, $variant, $fallback ) {
$variant = in_array( $variant, [ 'select', 'radio', 'checkbox' ], true ) ? $variant : 'select';
$label = (string) ( $attributes['label'] ?? '' );
$show_label = ( $attributes['showLabel'] ?? true ) !== false;
$placeholder = (string) ( $attributes['placeholder'] ?? '' );
$required = ! empty( $attributes['required'] );
$name = self::subscribe_field_name( $attributes, $fallback );
$block_id = (string) ( $attributes['blockId'] ?? '' );
$base_id = 'flexa-field-' . sanitize_html_class( '' !== $block_id ? $block_id : $name );
$options = self::normalize_field_options( $attributes['options'] ?? [] );
$req_mark = $required ? ' * ' : '';
if ( 'select' === $variant ) {
$req_attr = $required ? ' required aria-required="true"' : '';
$control = '';
if ( '' !== $placeholder ) {
$control .= '' . esc_html( $placeholder ) . ' ';
}
foreach ( $options as $opt ) {
$control .= '' . esc_html( $opt ) . ' ';
}
$control .= ' ';
$label_html = ( $show_label && '' !== trim( $label ) )
? '' . esc_html( $label ) . $req_mark . ' '
: '';
return self::field_shell( $attributes, $label_html . $control );
}
// Radio / checkbox group. Native `required` is applied per-radio (a radio
// group is satisfied by any one), and only to a lone checkbox (a consent
// box) — never to every box of a multi-choice group, which would force all.
$input_type = 'radio' === $variant ? 'radio' : 'checkbox';
$single = count( $options ) <= 1;
// "At least one" for a group can't be expressed with native `required`
// (checkbox) or shows a bare bubble (radio), so view.js validates it —
// flagged here with data-required.
$group_required = $required ? ' data-required="1"' : '';
$group = '';
foreach ( $options as $i => $opt ) {
$oid = $base_id . '-' . $i;
$req_attr = ( $required && ( 'radio' === $variant || $single ) ) ? ' required aria-required="true"' : '';
$group .= ''
. '' . esc_html( $opt ) . ' ';
}
$group .= '
';
$legend = ( $show_label && '' !== trim( $label ) )
? '' . esc_html( $label ) . $req_mark . ' '
: '';
return self::field_shell( $attributes, $legend . $group );
}
/**
* Normalise a choice-options list: trim, drop blanks, cap the count.
*
* @param mixed $options Raw options (expected string[]).
* @return array
*/
private static function normalize_field_options( $options ) {
if ( ! is_array( $options ) ) {
return [];
}
$out = [];
foreach ( $options as $opt ) {
$opt = trim( (string) $opt );
if ( '' === $opt ) {
continue;
}
$out[] = $opt;
if ( count( $out ) >= 30 ) {
break;
}
}
return $out;
}
/**
* Render a toggle (on/off switch) subscribe-form field — a single checkbox
* styled as a switch that submits "Yes" when on.
*
* @param array $attributes Field attributes.
* @param string $fallback Fallback field name.
* @return string
*/
public static function subscribe_toggle_field( $attributes, $fallback ) {
$label = (string) ( $attributes['label'] ?? '' );
$show_label = ( $attributes['showLabel'] ?? true ) !== false;
$required = ! empty( $attributes['required'] );
$name = self::subscribe_field_name( $attributes, $fallback );
$block_id = (string) ( $attributes['blockId'] ?? '' );
$input_id = 'flexa-field-' . sanitize_html_class( '' !== $block_id ? $block_id : $name );
$req_attr = $required ? ' required aria-required="true"' : '';
$req_mark = $required ? ' * ' : '';
$control = ''
. ' ';
$label_html = ( $show_label && '' !== trim( $label ) )
? '' . esc_html( $label ) . $req_mark . ' '
: '';
return self::field_shell( $attributes, $label_html . $control );
}
/**
* Render a file-upload subscribe-form field. The actual file is transferred as
* multipart form data by view.js and attached to the notification email by
* Form_Handler; this only outputs the input.
*
* @param array $attributes Field attributes.
* @param string $fallback Fallback field name.
* @return string
*/
public static function subscribe_upload_field( $attributes, $fallback ) {
$label = (string) ( $attributes['label'] ?? '' );
$show_label = ( $attributes['showLabel'] ?? true ) !== false;
$required = ! empty( $attributes['required'] );
$multiple = ! empty( $attributes['multiple'] );
$accept = trim( (string) ( $attributes['accept'] ?? '' ) );
$name = self::subscribe_field_name( $attributes, $fallback );
$field_name = $multiple ? $name . '[]' : $name;
$block_id = (string) ( $attributes['blockId'] ?? '' );
$input_id = 'flexa-field-' . sanitize_html_class( '' !== $block_id ? $block_id : $name );
$attr = ' name="' . esc_attr( $field_name ) . '" id="' . esc_attr( $input_id ) . '" class="flexa-field__control"';
if ( '' !== $accept ) {
$attr .= ' accept="' . esc_attr( $accept ) . '"';
}
if ( $multiple ) {
$attr .= ' multiple';
}
if ( $required ) {
$attr .= ' required aria-required="true"';
}
$control = '* ' : '';
$label_html = ( $show_label && '' !== trim( $label ) )
? '' . esc_html( $label ) . $req_mark . ' '
: '';
return self::field_shell( $attributes, $label_html . $control );
}
/**
* Render a hidden subscribe-form field — an invisible input carrying a fixed
* value submitted with the form (e.g. a campaign source tag).
*
* @param array $attributes Field attributes.
* @param string $fallback Fallback field name.
* @return string
*/
public static function subscribe_hidden_field( $attributes, $fallback ) {
$name = self::subscribe_field_name( $attributes, $fallback );
$value = (string) ( $attributes['value'] ?? '' );
return '%2$s
', $wrapper, $inner );
}
}