borgar / textbox

Library to layout text for display on SVG or Canvas.
Other
26 stars 6 forks source link

Support rel and target attrs on SVG <a> elements #33

Closed flother closed 1 year ago

flother commented 1 year ago

Adds support to the SVG renderer for target and rel attributes on <a> elements. These two attributes are useful for limiting access to window.opener, for example, or for opening links in new windows/tabs.

When Textbox's HTML parser is used, any rel or target attributes on an <a> element are included in the rendered SVG. For example:

import Textbox from '@borgar/textbox';
const box = new Textbox({ parser: Textbox.htmlparser });
const line = box.render('<a href="https://example.com/" rel="noopener noreferrer nofollow" target="_blank">Hello world</a>');

Will produce:

<text font-family="sans-serif" font-size="12" text-anchor="start">
    <a href="https://example.com/" rel="noopener noreferrer nofollow" target="_blank">
        Hello world
    </a>
</text>

These two attributes are only supported on <a> elements, and only in the SVG renderer.

borgar commented 1 year ago

Amazing! ✨