Skip to content

Preserve safe inline SVG icons during HTML-to-block conversion #53

Description

@chubes4

Problem

HTML-to-block conversion currently records inline SVG as fallback metadata and emits the surrounding CSS-addressable wrappers as empty group blocks. That preserves layout classes, but drops visible icon glyphs.

This is generic HTML behavior, not a Figma-specific rule. Figma exports are one reproducer because many icons arrive as inline SVG vectors inside styled wrappers.

Reproducer shape

<main>
  <div class="icon-wrapper">
    <div class="icon-vector">
      <svg viewBox="0 0 24 24" role="img" aria-label="Phone">
        <path d="M0 0h24v24H0z" fill="#a28b77" />
      </svg>
    </div>
  </div>
</main>

Current result keeps icon-wrapper / icon-vector groups but drops the svg, so the rendered icon disappears.

Desired behavior

Convert safe inline SVG/vector content into a WordPress-renderable representation without reintroducing raw fallback blocks.

Possible directions:

  • Materialize sanitized SVG as an asset and emit core/image.
  • Preserve sanitized inline SVG in a controlled block representation if Gutenberg accepts it safely.
  • Keep diagnostics for unsafe or unsupported SVG, but avoid silent visual loss for safe icon glyphs.

Acceptance criteria

  • Generic php-transformer contract covers safe inline SVG icon preservation without Figma-specific names.
  • Existing fallback/core-html quality gates remain intact.
  • Figma-origin fixtures with location/phone/clock/WhatsApp icons render visible glyphs after import.

Evidence

Local Fisiostetic fixture contains icons as inline SVG. Imported WordPress content keeps wrapper classes but has svg_count=0 and img_count=0; import diagnostics include inline SVG fallback records.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions