@teachinglab/jsvg

Lightweight SVG helpers with browser and headless rendering support.

Install

npm install @teachinglab/jsvg

Headless behavior

Importing jsvg is safe in Node and SSR runtimes. It does not create global window, document, or XMLSerializer values during module evaluation.

jsvg uses a private headless DOM internally. For compatibility with OMD 0.9.x and older Node consumers, the first jsvg object construction lazily installs document and XMLSerializer when those globals do not already exist. The headless document implements the document-head operations used by CSS-in-JS libraries, so it can safely coexist with packages imported later in the same process. jsvg never creates a global window.

New headless consumers should avoid ambient globals:

import {
    jsvgContainer,
    jsvgRect,
    serializeJsvgNode,
} from "@teachinglab/jsvg";

const canvas = new jsvgContainer();
const rect = new jsvgRect();
rect.setWidthAndHeight(120, 80);
canvas.addChild(rect);

const svg = serializeJsvgNode(canvas.svgObject);

The headless helpers are also available from @teachinglab/jsvg/headless.js:

• getJsvgDocument()
• getJsvgWindow()
• getJsvgXMLSerializer()
• serializeJsvgNode(node)
• installJsvgHeadlessGlobals(scope?)
• ensureJsvgHeadlessDocument(scope?) (legacy alias)

Browser usage

When browser DOM APIs exist, jsvg uses the host window, document, and XMLSerializer without replacing them.

Release

npm test
npm pack --dry-run
npm publish

prepublishOnly runs the test suite automatically before publishing.