@weasel-js/labkit 1.6.1 → 1.7.1

package/dist/{chunk-QGMOA2YE.js → chunk-E23Q6A3Y.js}

@@ -1,22 +1,7 @@
-import { resolveScreenLength, SCRIPT_METRICS, boundsOfPath, getMarker, PATH_M, PATH_L, PATH_C, PATH_Q, PATH_Z, resolveAlign, getPaintKind } from '@weasel-js/core';
+import { identity, multiply } from './chunk-XVUKDSYV.js';
+import { resolveScreenLength, scriptMetricsFor, boundsOfPath, getMarker, PATH_M, PATH_L, PATH_C, PATH_Q, PATH_Z, resolveAlign, resolveRunFace, resolveTextStyle, parseColor, rgbaToHex, getPaintKind, resolveMarkerSize } from '@weasel-js/core';
 import { tileGeometry } from '@weasel-js/core/patterns-builtin';
 
-// ../svg/dist/index.js
-
-// ../geom/dist/index.js
-function identity() {
-  return [1, 0, 0, 1, 0, 0];
-}
-function multiply(m, n) {
-  return [
-    m[0] * n[0] + m[2] * n[1],
-    m[1] * n[0] + m[3] * n[1],
-    m[0] * n[2] + m[2] * n[3],
-    m[1] * n[2] + m[3] * n[3],
-    m[0] * n[4] + m[2] * n[5] + m[4],
-    m[1] * n[4] + m[3] * n[5] + m[5]
-  ];
-}
 var IDENTITY_MATRIX = identity();
 function isIdentity(m, eps = 1e-9) {
   return Math.abs(m[0] - 1) < eps && Math.abs(m[1]) < eps && Math.abs(m[2]) < eps && Math.abs(m[3] - 1) < eps && Math.abs(m[4]) < eps && Math.abs(m[5]) < eps;
@@ -31,10 +16,201 @@ function trimNumber(n) {
   if (Number.isInteger(r)) return String(r);
   return String(r);
 }
-function anchorOffset(style, width) {
+function anchorOffset(style, width2) {
   const edge = resolveAlign(style?.align ?? "left", style?.direction ?? "ltr");
-  return edge === "center" ? width / 2 : edge === "right" ? width : 0;
+  return edge === "center" ? width2 / 2 : edge === "right" ? width2 : 0;
+}
+function parsePaintAttr(raw) {
+  if (raw == null) return null;
+  const s = raw.trim();
+  if (s === "") return null;
+  if (s === "none") return { kind: "none" };
+  if (s.toLowerCase() === "currentcolor") {
+    return { kind: "solid", color: "#000000", alpha: 1 };
+  }
+  const urlMatch = /^url\(\s*#([^)\s]+)\s*\)(.*)$/.exec(s);
+  if (urlMatch) {
+    const out = { kind: "ref", id: urlMatch[1] };
+    const rest = urlMatch[2].trim();
+    if (rest !== "" && rest !== "none") {
+      const fallback = parsePaintAttr(rest);
+      if (fallback?.kind === "solid") {
+        out.fallback = { color: fallback.color, alpha: fallback.alpha };
+      }
+    }
+    return out;
+  }
+  try {
+    const [r, g, b, a] = parseColor(s);
+    return { kind: "solid", color: rgbaToHex([r, g, b]), alpha: a };
+  } catch {
+    return null;
+  }
+}
+var TEXT_TRANSFORMS = /* @__PURE__ */ new Set(["none", "uppercase", "lowercase", "capitalize"]);
+var DIMENSION = /^([+-]?(?:\d+\.?\d*|\.\d+)(?:e[+-]?\d+)?)([a-z%]*)$/i;
+function dimension(v) {
+  const m = DIMENSION.exec(v);
+  return m ? { n: Number(m[1]), unit: m[2].toLowerCase() } : void 0;
+}
+var clamp01 = (n) => n < 0 ? 0 : n > 1 ? 1 : n;
+var length = (native, coercedAs) => (v, warn, prop) => {
+  const d = dimension(v);
+  if (!d) return void 0;
+  if (d.unit && !native.includes(d.unit)) {
+    warn(`${prop} "${v}" uses unit "${d.unit}", which is not converted; treated as ${d.n} ${coercedAs}`);
+  }
+  return d.n;
+};
+var worldLength = length(["px"], "world units");
+var keyword2 = (...words) => (v) => words.includes(v) ? v : void 0;
+var isCurrentColor = (v) => v.toLowerCase() === "currentcolor";
+function readPaint(v) {
+  if (v === "context-fill") return { kind: "context", of: "fill" };
+  if (v === "context-stroke") return { kind: "context", of: "stroke" };
+  return parsePaintAttr(v) ?? void 0;
+}
+function readRatio(v) {
+  const d = dimension(v);
+  if (!d || d.unit !== "" && d.unit !== "%") return void 0;
+  return clamp01(d.unit === "%" ? d.n / 100 : d.n);
+}
+function readSolidColor(v, warn, prop) {
+  const parsed = parsePaintAttr(v);
+  if (parsed?.kind !== "solid") return void 0;
+  if (isCurrentColor(v)) warn(`${prop}="${v}" is read as black; it is not resolved against color`);
+  return parsed;
+}
+function readMarkerRef(v) {
+  if (v === "none") return null;
+  return /^url\(\s*#([^)\s]+)\s*\)$/.exec(v)?.[1];
+}
+function readLinecap(v, warn) {
+  const cap = keyword2("butt", "round", "square")(v);
+  if (!cap) warn(`unsupported stroke-linecap: ${v}`);
+  return cap;
+}
+function readLinejoin(v, warn) {
+  const join = keyword2("miter", "round", "bevel")(v);
+  if (join) return join;
+  if (v === "arcs" || v === "miter-clip") {
+    warn(`stroke-linejoin "${v}" not supported; falling back to miter`);
+    return "miter";
+  }
+  warn(`unsupported stroke-linejoin: ${v}`);
+  return void 0;
+}
+function readDashArray(v, warn) {
+  if (v === "none" || v === "") return null;
+  const nums = [];
+  for (const t of v.split(/[\s,]+/).filter(Boolean)) {
+    const d = dimension(t);
+    if (!d || d.unit !== "" && d.unit !== "px" || d.n < 0) {
+      warn(`unrecognized stroke-dasharray: ${v}`);
+      return void 0;
+    }
+    nums.push(d.n);
+  }
+  return nums.length % 2 === 1 ? [...nums, ...nums] : nums;
+}
+function readMiterLimit(v, warn) {
+  const d = dimension(v);
+  if (d && d.unit === "" && d.n >= 1) return d.n;
+  warn(`unrecognized stroke-miterlimit: ${v}`);
+  return void 0;
+}
+function readColor(v) {
+  return isCurrentColor(v) || parsePaintAttr(v)?.kind === "solid" ? v : void 0;
+}
+function readFontSize(v, warn, prop) {
+  const d = dimension(v);
+  if (d?.unit === "%") return { fontScale: d.n / 100 };
+  const n = worldLength(v, warn, prop);
+  return n == null ? void 0 : { fontSize: n };
+}
+function readFontWeight(v) {
+  if (v === "normal" || v === "bold" || v === "bolder") return v;
+  const d = dimension(v);
+  return d && d.unit === "" && d.n >= 1 && d.n <= 1e3 ? d.n : void 0;
+}
+function readFontStyle(v, warn) {
+  if (v === "normal" || v === "italic") return v;
+  if (v === "oblique") {
+    warn('font-style "oblique" is read as italic');
+    return "italic";
+  }
+  return void 0;
+}
+function readLetterSpacing(v, warn, prop) {
+  return v === "normal" ? null : worldLength(v, warn, prop);
+}
+function readDecoration(v, warn) {
+  const out = {};
+  for (const t of v.toLowerCase().split(/\s+/)) {
+    if (t === "underline") out.underline = true;
+    else if (t === "line-through") out.strikethrough = true;
+    else if (t === "overline") out.overline = true;
+    else if (t !== "none" && t !== "blink") warn(`text-decoration "${v}": "${t}" is not modeled; dropped`);
+  }
+  return out;
+}
+function readFontVariant(v, warn) {
+  let out;
+  for (const t of v.toLowerCase().split(/\s+/)) {
+    if (t === "small-caps" || t === "normal") out = t;
+    else if (t) warn(`font-variant "${v}": "${t}" is not modeled; dropped`);
+  }
+  return out;
 }
+function readTextTransform(v) {
+  const t = v.toLowerCase();
+  return TEXT_TRANSFORMS.has(t) ? t : void 0;
+}
+var emLength = length(["em"], "em");
+function readBaselineShift(v, warn, prop) {
+  const k = v.toLowerCase();
+  if (k === "super" || k === "sub") return { script: k };
+  if (k === "baseline") return {};
+  const d = dimension(v);
+  if (d?.unit === "%") return d.n === 0 ? {} : { baselineShift: d.n / 100 };
+  const n = emLength(v, warn, prop);
+  if (n == null) return void 0;
+  return n === 0 ? {} : { baselineShift: n };
+}
+var inherited = (read) => ({ inherits: true, read });
+var own = (read) => ({ inherits: false, read });
+var PROPERTIES = {
+  "fill": inherited(readPaint),
+  "fill-opacity": inherited(readRatio),
+  "fill-rule": inherited(keyword2("nonzero", "evenodd")),
+  "stroke": inherited(readPaint),
+  "stroke-width": inherited(worldLength),
+  "stroke-opacity": inherited(readRatio),
+  "stroke-linecap": inherited(readLinecap),
+  "stroke-linejoin": inherited(readLinejoin),
+  "stroke-dasharray": inherited(readDashArray),
+  "stroke-miterlimit": inherited(readMiterLimit),
+  "marker-start": inherited(readMarkerRef),
+  "marker-mid": inherited(readMarkerRef),
+  "marker-end": inherited(readMarkerRef),
+  "color": inherited(readColor),
+  "font-size": inherited(readFontSize),
+  "font-family": inherited((v) => v.length > 0 ? v : void 0),
+  "font-weight": inherited(readFontWeight),
+  "font-style": inherited(readFontStyle),
+  "text-anchor": inherited(keyword2("start", "middle", "end")),
+  "letter-spacing": inherited(readLetterSpacing),
+  "text-decoration": inherited(readDecoration),
+  "direction": inherited(keyword2("ltr", "rtl")),
+  "text-transform": inherited(readTextTransform),
+  "font-variant": inherited(readFontVariant),
+  "opacity": own(readRatio),
+  "stop-color": own(readSolidColor),
+  "stop-opacity": own(readRatio),
+  "baseline-shift": own(readBaselineShift),
+  "vector-effect": own(keyword2("none", "non-scaling-stroke"))
+};
+Object.keys(PROPERTIES).filter((p) => PROPERTIES[p].inherits);
 function patternSpecOf(paint) {
   return "tile" in paint.pattern ? paint.pattern : null;
 }
@@ -53,7 +229,11 @@ function patternXml(id, paint, onWarn) {
     `width="${trimNumber(geometry.size)}"`,
     `height="${trimNumber(geometry.size)}"`
   ];
-  if (origin.x !== 0 || origin.y !== 0) {
+  const [a, b, c, d] = paint.transform ?? [1, 0, 0, 1];
+  const placement = formatMatrix([a, b, c, d, origin.x, origin.y]);
+  if (paint.transform && !isIdentity([a, b, c, d, 0, 0]) && placement) {
+    attrs.push(`patternTransform="${placement}"`);
+  } else if (origin.x !== 0 || origin.y !== 0) {
     attrs.push(`x="${trimNumber(origin.x)}"`, `y="${trimNumber(origin.y)}"`);
   }
   attrs.push(`data-weasel-tile="${escapeAttr(JSON.stringify(spec))}"`);
@@ -90,8 +270,8 @@ function escapeAttr(s) {
 }
 function serializePathD(path) {
   if (path.kind === "rect") {
-    const { x, y, width, height } = path;
-    return `M${trimNumber(x)} ${trimNumber(y)}h${trimNumber(width)}v${trimNumber(height)}h${trimNumber(-width)}Z`;
+    const { x, y, width: width2, height: height2 } = path;
+    return `M${trimNumber(x)} ${trimNumber(y)}h${trimNumber(width2)}v${trimNumber(height2)}h${trimNumber(-width2)}Z`;
   }
   const cmds = path.commands;
   const xs = path.coords;
@@ -123,29 +303,35 @@ function serializePathD(path) {
 }
 var WEASEL_NS = "urn:weasel-js:svg";
 var WEASEL_NS_PREFIX = "wzl";
-function hasNativeSvgForm(paint) {
-  const kind = paint.fill ?? "solid";
+function nativeSvgKind(kind) {
   return kind === "solid" || kind === "linear-gradient" || kind === "radial-gradient" || kind === "pattern";
 }
+function hasNativeSvgForm(paint) {
+  return nativeSvgKind(paint.fill ?? "solid");
+}
 var INTERPOLATE_SPACES = /* @__PURE__ */ new Set(["rgb", "oklab", "oklch"]);
+function nativeSvgSpace(space) {
+  return !space || space === "rgb";
+}
 function interpolateAttr(space) {
-  if (!space || space === "rgb") return "";
+  if (nativeSvgSpace(space)) return "";
   return ` ${WEASEL_NS_PREFIX}:interpolate="${space}"`;
 }
 function usesInterpolateAttr(paint) {
   const space = paint.interpolate;
-  return space != null && space !== "rgb" && INTERPOLATE_SPACES.has(space);
+  return !nativeSvgSpace(space) && INTERPOLATE_SPACES.has(space);
 }
 var PaintServerRegistry = class {
   byPaint = /* @__PURE__ */ new Map();
   order = [];
   counter = 0;
-  // Marker keys referenced by any stroke, in first-use order. The `<defs>`
-  // id is the marker key itself, not a minted counter id: `parseSvg` reads a
-  // `marker-end="url(#id)"` fragment back as the marker key directly when the
-  // registry knows it, so a synthetic id would come back as a stranger.
-  markerKeys = [];
-  markerKeySet = /* @__PURE__ */ new Set();
+  // Marker defs referenced by any stroke, by `<defs>` id in first-use order.
+  // An unsized reference's id is the marker key itself, not a minted counter
+  // id: `parseSvg` reads a `marker-end="url(#id)"` fragment back as the marker
+  // key directly when the registry knows it, so a synthetic id would come
+  // back as a stranger. A sized one gets a def of its own, stamped with its
+  // key and size so the parser can read the reference back whole.
+  markers = /* @__PURE__ */ new Map();
   // Clip paths, in first-use order. Identity, not value: two groups clipped by
   // equal outlines get a def each, which costs bytes and misleads nobody.
   clips = [];
@@ -170,22 +356,26 @@ var PaintServerRegistry = class {
     if (hasNativeSvgForm(paint)) return `url(#${id})`;
     return `url(#${id}) ${paintFallback(paint)}`;
   }
+  /** The paint kind of each registered paint, once, in first-use order. */
+  paintKinds() {
+    return [...new Set(this.order.map((paint) => paint.fill ?? "solid"))];
+  }
   /** Whether any registered paint serializes outside SVG's own vocabulary, so
    *  the root has to declare {@link WEASEL_NS}. */
   usesPrivateNamespace() {
-    return this.order.some((paint) => !hasNativeSvgForm(paint) || usesInterpolateAttr(paint));
+    return this.order.some((paint) => !hasNativeSvgForm(paint) || usesInterpolateAttr(paint)) || [...this.markers.values()].some((m) => m.size !== void 0 || writesInset(getMarker(m.key)));
   }
-  /** The `<defs>` id for a marker key — the key itself, minting nothing.
-   *  `undefined` when nothing is registered under `key`, so a caller emits no
-   *  attribute at all rather than a `url(#…)` pointing at a def that will
-   *  never be written. */
-  markerId(key) {
+  /** The `<defs>` id for a marker reference — the key itself when it has no
+   *  size, else the key suffixed with the size. `undefined` when nothing is
+   *  registered under the key, so a caller emits no attribute at all rather
+   *  than a `url(#…)` pointing at a def that will never be written. */
+  markerId(ref) {
+    const key = typeof ref === "string" ? ref : ref.key;
+    const size = typeof ref === "string" ? void 0 : ref.size;
     if (getMarker(key) === void 0) return void 0;
-    if (!this.markerKeySet.has(key)) {
-      this.markerKeySet.add(key);
-      this.markerKeys.push(key);
-    }
-    return key;
+    const id = size === void 0 ? key : `${key}-s${typeof size === "number" ? trimNumber(size) : `${trimNumber(size.px)}px`}`;
+    if (!this.markers.has(id)) this.markers.set(id, size === void 0 ? { key } : { key, size });
+    return id;
   }
   /** Mint (or recall) the `<defs>` id for a clip outline. */
   clipId(path) {
@@ -199,17 +389,22 @@ var PaintServerRegistry = class {
   /** Emit `<defs>...</defs>` XML for every registered paint server, marker
    *  and clip path. */
   toDefsXml(onWarn) {
-    if (this.order.length === 0 && this.markerKeys.length === 0 && this.clips.length === 0) {
+    if (this.order.length === 0 && this.markers.size === 0 && this.clips.length === 0) {
       return "";
     }
     const parts = ["<defs>"];
     for (const paint of this.order) {
       parts.push(paintServerXml(this.byPaint.get(paint), paint, onWarn));
     }
-    for (const key of this.markerKeys) {
+    for (const [id, { key, size }] of this.markers) {
       const entry = getMarker(key);
       if (!entry) continue;
-      parts.push(entry.toSvg ? entry.toSvg(key, entry) : defaultMarkerXml(key, entry, onWarn));
+      if (entry.toSvg) {
+        if (size !== void 0) onWarn?.(`marker "${key}" writes its own <marker> def, which cannot carry a reference's size; written at its own size`);
+        parts.push(entry.toSvg(id, entry));
+      } else {
+        parts.push(defaultMarkerXml(id, entry, onWarn, key, size));
+      }
     }
     for (const path of this.clips) {
       parts.push(
@@ -220,13 +415,19 @@ var PaintServerRegistry = class {
     return parts.join("");
   }
 };
-function defaultMarkerXml(id, entry, onWarn) {
-  const path = entry.path({ size: 1, stroke: { paint: { fill: "solid", color: "#000" } } });
+function writesInset(entry) {
+  return entry !== void 0 && !entry.toSvg && (entry.inset ?? 0) !== 0;
+}
+function defaultMarkerXml(id, entry, onWarn, key, size) {
+  const unit = size === void 0 ? 1 : resolveMarkerSize({ key: key ?? id, size }, 1);
+  const path = entry.path({ size: unit, stroke: { paint: { fill: "solid", color: "#000" } } });
   const d = serializePathD(path);
   const fill = markerPaintAttrs("fill", entry.fill, id, onWarn);
-  const outline = entry.outline ? ` ${markerPaintAttrs("stroke", entry.outline.paint, id, onWarn)} stroke-width="${trimNumber(entry.outline.width)}" stroke-linecap="round" stroke-linejoin="round"` : "";
+  const outline = entry.outline ? ` ${markerPaintAttrs("stroke", entry.outline.paint, id, onWarn)} stroke-width="${trimNumber(entry.outline.width * unit)}" stroke-linecap="round" stroke-linejoin="round"` : "";
   const orient = typeof entry.orient === "number" ? trimNumber(entry.orient * 180 / Math.PI) : "auto-start-reverse";
-  return `<marker id="${id}" markerUnits="strokeWidth" markerWidth="8" markerHeight="8" refX="0" refY="0" orient="${orient}" overflow="visible"><path d="${d}" ${fill}${outline}/></marker>`;
+  const units = size === void 0 ? 'markerUnits="strokeWidth" markerWidth="8" markerHeight="8"' : `markerUnits="userSpaceOnUse" markerWidth="${trimNumber(8 * unit)}" markerHeight="${trimNumber(8 * unit)}" ${WEASEL_NS_PREFIX}:key="${key}" ${WEASEL_NS_PREFIX}:size="${typeof size === "number" ? trimNumber(size) : `${trimNumber(size.px)}px`}"`;
+  const inset = writesInset(entry) ? ` ${WEASEL_NS_PREFIX}:inset="${trimNumber(entry.inset)}"` : "";
+  return `<marker id="${id}" ${units}${inset} refX="0" refY="0" orient="${orient}" overflow="visible"><path d="${d}" ${fill}${outline}/></marker>`;
 }
 function markerPaintAttrs(attr, paint, id, onWarn) {
   if (paint === "none") return `${attr}="none"`;
@@ -241,9 +442,10 @@ function paintServerXml(id, paint, onWarn) {
   if (paint.fill === "pattern") return patternXml(id, paint, onWarn);
   const builtin = gradientXml(id, paint);
   if (builtin) return builtin;
-  const custom = getPaintKind(paint.fill)?.toSvg?.(id, paint);
+  const kind = getPaintKind(paint.fill);
+  const custom = kind?.toSvg?.(id, paint);
   if (custom) return custom;
-  onWarn?.(`${paint.fill} fill has no vector form \u2014 omitted from <defs>`);
+  onWarn?.(kind ? `${paint.fill} fill has no vector form \u2014 omitted from <defs>` : `${paint.fill} fill is not registered \u2014 omitted from <defs>; a kind loaded on demand needs \`await warmSvg(nodes)\` before a synchronous export`);
   return "";
 }
 function gradientUnitsAttr(units) {
@@ -388,16 +590,10 @@ function registerPaintServers(nodes, registry) {
 function registerTextPaint(paint, registry) {
   if (paint && !("color" in paint)) registry.register(paint);
 }
-function markerKeyOfRef(ref) {
-  if (typeof ref === "string") return ref;
-  if (ref && typeof ref === "object" && "key" in ref) return String(ref.key);
-  return void 0;
-}
 function registerMarkers(stroke, registry) {
   if (!stroke) return;
   for (const ref of [stroke.markerStart, stroke.markerMid, stroke.markerEnd]) {
-    const key = markerKeyOfRef(ref);
-    if (key) registry.markerId(key);
+    if (ref !== void 0) registry.markerId(ref);
   }
 }
 function nodeXml(node, registry, namespaces, warn) {
@@ -486,35 +682,30 @@ function pathXml(node, registry, namespaces, warn) {
 }
 function paintAttrs(paint, name, registry, includeOpacity = true) {
   if (paint.kind === "none") return [`${name}="none"`];
-  if (paint.kind === "solid") {
-    const out = [`${name}="${paint.color}"`];
-    if (includeOpacity && paint.opacity != null && paint.opacity !== 1) {
-      out.push(`${name}-opacity="${trimNumber(paint.opacity)}"`);
-    }
-    return out;
-  }
-  return [`${name}="${registry.ref(paint.paint)}"`];
+  const out = [`${name}="${paint.kind === "solid" ? paint.color : registry.ref(paint.paint)}"`];
+  if (includeOpacity) out.push(...opacityAttr(`${name}-opacity`, svgPaintOpacity(paint)));
+  return out;
+}
+function svgPaintOpacity(paint) {
+  if (paint.kind === "solid") return paint.opacity;
+  return paint.kind === "gradient" ? paint.paint.opacity : void 0;
+}
+function opacityAttr(name, v) {
+  return v != null && v !== 1 ? [`${name}="${trimNumber(v)}"`] : [];
 }
-function strokeWidthAttrs(width) {
-  if (typeof width === "number") return [`stroke-width="${trimNumber(width)}"`];
-  return [`stroke-width="${trimNumber(width.px)}"`, 'vector-effect="non-scaling-stroke"'];
+function strokeWidthAttrs(width2) {
+  if (typeof width2 === "number") return [`stroke-width="${trimNumber(width2)}"`];
+  return [`stroke-width="${trimNumber(width2.px)}"`, 'vector-effect="non-scaling-stroke"'];
 }
 function coreStrokeAttrs(stroke, registry, warn) {
   const paint = stroke?.paint;
   if (!stroke || !paint) return [];
-  const width = stroke.width ?? 1;
-  if (!((typeof width === "object" ? width.px : width) > 0)) return [];
+  const width2 = stroke.width ?? 1;
+  if (!((typeof width2 === "object" ? width2.px : width2) > 0)) return [];
   warnStrokeAlign(stroke.align, warn);
-  const attrs = [];
-  if ("color" in paint) {
-    attrs.push(`stroke="${paint.color}"`);
-    if (paint.opacity != null && paint.opacity !== 1) {
-      attrs.push(`stroke-opacity="${trimNumber(paint.opacity)}"`);
-    }
-  } else {
-    attrs.push(`stroke="${registry.ref(paint)}"`);
-  }
-  attrs.push(...strokeWidthAttrs(width));
+  const attrs = [`stroke="${"color" in paint ? paint.color : registry.ref(paint)}"`];
+  attrs.push(...opacityAttr("stroke-opacity", paint.opacity));
+  attrs.push(...strokeWidthAttrs(width2));
   if (stroke.cap) attrs.push(`stroke-linecap="${stroke.cap}"`);
   if (stroke.join) attrs.push(`stroke-linejoin="${stroke.join}"`);
   if (stroke.dash && stroke.dash.length > 0) {
@@ -528,8 +719,7 @@ function coreStrokeAttrs(stroke, registry, warn) {
   ]) {
     const ref = stroke[field];
     if (ref === void 0) continue;
-    const key = typeof ref === "string" ? ref : ref.key;
-    const id = registry.markerId(key);
+    const id = registry.markerId(ref);
     if (id === void 0) continue;
     attrs.push(`${attr}="url(#${id})"`);
   }
@@ -539,10 +729,7 @@ function strokeAttrsFor(stroke, registry, warn) {
   warnStrokeAlign(stroke.align, warn);
   const attrs = paintAttrs(stroke.paint, "stroke", registry, false);
   attrs.push(...strokeWidthAttrs(stroke.width));
-  const opacity = stroke.opacity ?? (stroke.paint.kind === "solid" ? stroke.paint.opacity : void 0);
-  if (opacity != null && opacity !== 1) {
-    attrs.push(`stroke-opacity="${trimNumber(opacity)}"`);
-  }
+  attrs.push(...opacityAttr("stroke-opacity", stroke.opacity ?? svgPaintOpacity(stroke.paint)));
   if (stroke.cap) {
     attrs.push(`stroke-linecap="${stroke.cap}"`);
   }
@@ -619,18 +806,21 @@ function textXml(node, registry, namespaces, warn) {
   if (style?.fontFamily) attrs.push(`font-family="${escapeAttr2(style.fontFamily)}"`);
   if (style?.fontWeight != null) attrs.push(`font-weight="${String(style.fontWeight)}"`);
   if (style?.fontStyle && style.fontStyle !== "normal") attrs.push(`font-style="${style.fontStyle}"`);
+  if (style?.fontVariantCaps === "small-caps") attrs.push('font-variant="small-caps"');
   const direction = style?.direction ?? "ltr";
   if (direction === "rtl") attrs.push('direction="rtl"');
   if (style?.align != null || direction === "rtl") {
     const align = style?.align ?? "left";
-    const anchor = align === "center" ? "middle" : align === "start" ? "start" : align === "end" ? "end" : align === "left" === (direction === "ltr") ? "start" : "end";
+    const anchor = align === "center" ? "middle" : align === "start" || align === "justify" ? "start" : align === "end" ? "end" : align === "left" === (direction === "ltr") ? "start" : "end";
     if (anchor !== "start") attrs.push(`text-anchor="${anchor}"`);
+    if (align === "justify") attrs.push('data-weasel-align="justify"');
   }
   if (style?.letterSpacing != null && style.letterSpacing !== 0) {
     attrs.push(`letter-spacing="${trimNumber(resolveScreenLength(style.letterSpacing, 1))}"`);
   }
   const decoration = textDecorationValue(style?.underline, style?.strikethrough, style?.overline);
   if (decoration) attrs.push(`text-decoration="${decoration}"`);
+  if (style?.script) attrs.push(`baseline-shift="${style.script}"`);
   if (style?.textTransform && style.textTransform !== "none") {
     attrs.push(`style="text-transform:${style.textTransform}"`);
   }
@@ -645,14 +835,8 @@ function textXml(node, registry, namespaces, warn) {
   if (node.fill === null) {
     attrs.push('fill="none"');
   } else if (node.fill) {
-    if ("color" in node.fill) {
-      attrs.push(`fill="${node.fill.color}"`);
-      if (node.fill.opacity != null && node.fill.opacity !== 1) {
-        attrs.push(`fill-opacity="${trimNumber(node.fill.opacity)}"`);
-      }
-    } else {
-      attrs.push(`fill="${registry.ref(node.fill)}"`);
-    }
+    attrs.push(`fill="${"color" in node.fill ? node.fill.color : registry.ref(node.fill)}"`);
+    attrs.push(...opacityAttr("fill-opacity", node.fill.opacity));
   }
   for (const a of coreStrokeAttrs(node.stroke, registry, warn)) attrs.push(a);
   if (node.opacity != null && node.opacity !== 1) {
@@ -664,17 +848,25 @@ function textXml(node, registry, namespaces, warn) {
     const deg = node.rotation * 180 / Math.PI;
     attrs.push(`transform="rotate(${trimNumber(deg)} ${trimNumber(cx)} ${trimNumber(cy)})"`);
   }
-  const body = node.runs && node.runs.length > 0 ? node.runs.map((r) => runXml(r, registry, warn)).join("") : escapeText(node.text);
+  const body = node.runs && node.runs.length > 0 ? node.runs.map((r) => runXml(r, style, registry, warn)).join("") : escapeText(node.text);
   const metaAttrs = metaAttrsXml(node.meta, namespaces);
   const metaEls = metaElementsXml(node.meta, namespaces);
   return `<text ${attrs.join(" ")}${metaAttrs}>${body}${metaEls}</text>`;
 }
-function runXml(run, registry, warn) {
+function scriptSizeFace(run, style) {
+  if (run.script == null || run.baselineShift == null) return void 0;
+  const face = resolveRunFace(run, resolveTextStyle(style));
+  return { family: face.fontFamily, weight: face.fontWeight, style: face.fontStyle };
+}
+function runXml(run, style, registry, warn) {
   const attrs = [];
-  if (run.bold) attrs.push(`font-weight="700"`);
+  if (run.fontWeight != null) attrs.push(`font-weight="${run.fontWeight}"`);
+  else if (run.bold) attrs.push(`font-weight="700"`);
   if (run.italic) attrs.push(`font-style="italic"`);
+  if (run.fontVariantCaps) attrs.push(`font-variant="${run.fontVariantCaps}"`);
   if (run.fontFamily) attrs.push(`font-family="${escapeAttr2(run.fontFamily)}"`);
-  const presetScale = run.script != null && run.baselineShift != null ? SCRIPT_METRICS[run.script].size : void 0;
+  const face = scriptSizeFace(run, style);
+  const presetScale = face && run.script ? scriptMetricsFor(face.family, face.weight, face.style)[run.script].size : void 0;
   const scale = run.fontScale ?? presetScale;
   if (run.fontSize != null) attrs.push(`font-size="${trimNumber(resolveScreenLength(run.fontSize, 1))}"`);
   else if (scale != null) attrs.push(`font-size="${trimNumber(scale * 100)}%"`);
@@ -726,6 +918,6 @@ function pathBounds(path) {
   return { minX: b.x, minY: b.y, maxX: b.x + b.width, maxY: b.y + b.height };
 }
 
-export { serializeSvg, tilePreviewCssUrl };
-//# sourceMappingURL=chunk-QGMOA2YE.js.map
-//# sourceMappingURL=chunk-QGMOA2YE.js.map
+export { nativeSvgKind, nativeSvgSpace, serializeSvg, tilePreviewCssUrl };
+//# sourceMappingURL=chunk-E23Q6A3Y.js.map
+//# sourceMappingURL=chunk-E23Q6A3Y.js.map