@weasel-js/svg 1.0.3 → 1.1.0

package/dist/index.js

@@ -78,6 +78,16 @@ function parseTransform(attr, onWarn) {
   }
   return result;
 }
+function invertMatrix(m) {
+  const det = m[0] * m[3] - m[1] * m[2];
+  if (!Number.isFinite(det) || Math.abs(det) < 1e-12) return null;
+  const a = m[3] / det, b = -m[1] / det, c = -m[2] / det, d = m[0] / det;
+  return [a, b, c, d, -(a * m[4] + c * m[5]), -(b * m[4] + d * m[5])];
+}
+function rebaseTransform(ctm, local) {
+  const inv = invertMatrix(ctm);
+  return inv ? multiply(multiply(ctm, local), inv) : local;
+}
 function decomposeRotation(m, cx, cy, eps = 1e-4) {
   const [a, b, c, d, e, f] = m;
   if (Math.abs(a - d) > eps) return null;
@@ -243,6 +253,22 @@ function parsePaintAttr(raw) {
     return null;
   }
 }
+
+// src/elements.ts
+function collectElementsByTag(root, tags) {
+  const out = /* @__PURE__ */ new Map();
+  const consider = (el) => {
+    if (!tags.has(el.tagName.toLowerCase())) return;
+    const id = el.getAttribute("id");
+    if (id && !out.has(id)) out.set(id, el);
+  };
+  consider(root);
+  const all = root.getElementsByTagName("*");
+  for (let i = 0; i < all.length; i++) consider(all[i]);
+  return out;
+}
+
+// src/patterns.ts
 function patternSpecOf(paint) {
   return "tile" in paint.pattern ? paint.pattern : null;
 }
@@ -295,20 +321,13 @@ function shapeXml(shape) {
 }
 function collectPatterns(svg, onWarn) {
   const out = /* @__PURE__ */ new Map();
-  const defs = svg.getElementsByTagName("defs");
-  for (let d = 0; d < defs.length; d++) {
-    const root = defs[d];
-    for (let i = 0; i < root.children.length; i++) {
-      const child = root.children[i];
-      if (child.tagName.toLowerCase() !== "pattern") continue;
-      const id = child.getAttribute("id");
-      if (!id) continue;
-      const paint = readPattern(child, onWarn);
-      if (paint) out.set(id, paint);
-    }
+  for (const [id, el] of collectElementsByTag(svg, PATTERN_TAGS)) {
+    const paint = readPattern(el, onWarn);
+    if (paint) out.set(id, paint);
   }
   return out;
 }
+var PATTERN_TAGS = /* @__PURE__ */ new Set(["pattern"]);
 function readPattern(el, onWarn) {
   const raw = el.getAttribute("data-weasel-tile");
   if (!raw) {
@@ -337,41 +356,69 @@ function escapeAttr(s) {
 }
 
 // src/gradients.ts
+var GRADIENT_TAGS = /* @__PURE__ */ new Set(["lineargradient", "radialgradient"]);
+var XLINK_NS = "http://www.w3.org/1999/xlink";
 function collectGradients(svg, onWarn) {
   const out = /* @__PURE__ */ new Map();
+  const elements = collectElementsByTag(svg, GRADIENT_TAGS);
+  for (const [id, el] of elements) {
+    const paint = el.tagName.toLowerCase() === "lineargradient" ? readLinearGradient(el, elements, onWarn) : readRadialGradient(el, elements, onWarn);
+    if (paint) out.set(id, paint);
+  }
+  warnUnsupportedDefsChildren(svg, onWarn);
+  return out;
+}
+function warnUnsupportedDefsChildren(svg, onWarn) {
+  if (!onWarn) return;
   const defs = svg.getElementsByTagName("defs");
   for (let d = 0; d < defs.length; d++) {
     const root = defs[d];
     for (let i = 0; i < root.children.length; i++) {
       const child = root.children[i];
       const tag = child.tagName.toLowerCase();
-      const id = child.getAttribute("id");
-      if (!id) continue;
-      if (tag === "lineargradient") {
-        const paint = readLinearGradient(child, onWarn);
-        if (paint) out.set(id, paint);
-      } else if (tag === "radialgradient") {
-        const paint = readRadialGradient(child, onWarn);
-        if (paint) out.set(id, paint);
-      } else if (tag !== "pattern") {
-        onWarn?.(`unsupported <defs> child: <${child.tagName}>`);
-      }
+      if (GRADIENT_TAGS.has(tag) || tag === "pattern") continue;
+      onWarn(`unsupported <defs> child: <${child.tagName}>`);
     }
   }
-  return out;
+}
+function hrefTarget(el, elements) {
+  const raw = el.getAttribute("href") ?? el.getAttributeNS(XLINK_NS, "href") ?? el.getAttribute("xlink:href");
+  if (!raw || !raw.startsWith("#")) return null;
+  return elements.get(raw.slice(1)) ?? null;
+}
+function inheritedAttr(el, elements, name, seen = /* @__PURE__ */ new Set()) {
+  if (el.hasAttribute(name)) return el.getAttribute(name);
+  seen.add(el);
+  const ref = hrefTarget(el, elements);
+  if (!ref || seen.has(ref)) return null;
+  return inheritedAttr(ref, elements, name, seen);
+}
+function inheritedStops(el, elements, onWarn, seen = /* @__PURE__ */ new Set()) {
+  const own = readStops(el, onWarn);
+  if (own.length > 0) return own;
+  seen.add(el);
+  const ref = hrefTarget(el, elements);
+  if (!ref || seen.has(ref)) return own;
+  return inheritedStops(ref, elements, onWarn, seen);
+}
+function parseRatio(raw) {
+  const n = parseFloat(raw);
+  if (!Number.isFinite(n)) return NaN;
+  return raw.trimEnd().endsWith("%") ? n / 100 : n;
 }
 function readStops(el, onWarn) {
   const stops = [];
   for (let i = 0; i < el.children.length; i++) {
     const c = el.children[i];
     if (c.tagName.toLowerCase() !== "stop") continue;
-    const offsetRaw = c.getAttribute("offset") ?? "0";
-    const offset = offsetRaw.endsWith("%") ? parseFloat(offsetRaw) / 100 : parseFloat(offsetRaw);
+    const offsetRaw = parseRatio(c.getAttribute("offset") ?? "0");
+    const offset = Number.isFinite(offsetRaw) ? offsetRaw : 0;
     const colorAttr = c.getAttribute("stop-color") ?? "#000000";
     const parsed = parsePaintAttr(colorAttr);
     if (parsed && parsed.kind === "solid") {
       const opacityAttr = c.getAttribute("stop-opacity");
-      const alpha = opacityAttr != null ? parseFloat(opacityAttr) : parsed.alpha;
+      const own = opacityAttr != null ? parseRatio(opacityAttr) : NaN;
+      const alpha = Number.isFinite(own) ? own : parsed.alpha;
       stops.push({ offset, color: alpha < 1 ? applyAlpha(parsed.color, alpha) : parsed.color });
     } else {
       onWarn?.(`gradient stop has unrecognized stop-color: ${colorAttr}`);
@@ -384,34 +431,47 @@ function applyAlpha(hex, alpha) {
   const a = Math.max(0, Math.min(255, Math.round(alpha * 255)));
   return `${hex}${a.toString(16).padStart(2, "0")}`;
 }
-function readGradientUnits(el) {
-  return el.getAttribute("gradientUnits") === "userSpaceOnUse" ? "world" : "bounds";
+function readGradientUnits(el, elements) {
+  return inheritedAttr(el, elements, "gradientUnits") === "userSpaceOnUse" ? "world" : "bounds";
 }
-function readLinearGradient(el, onWarn) {
-  const x1 = parseFloat(el.getAttribute("x1") ?? "0");
-  const y1 = parseFloat(el.getAttribute("y1") ?? "0");
-  const x2 = parseFloat(el.getAttribute("x2") ?? "1");
-  const y2 = parseFloat(el.getAttribute("y2") ?? "0");
-  const stops = readStops(el, onWarn);
+function warnGradientTransform(el, elements, onWarn) {
+  const t = inheritedAttr(el, elements, "gradientTransform");
+  if (t != null && t.trim() !== "") {
+    onWarn?.(`gradientTransform="${t}" is not modeled; the gradient paints untransformed`);
+  }
+}
+function num(raw, fallback) {
+  if (raw == null) return fallback;
+  const n = parseRatio(raw);
+  return Number.isFinite(n) ? n : fallback;
+}
+function readLinearGradient(el, elements, onWarn) {
+  warnGradientTransform(el, elements, onWarn);
   return {
     fill: "linear-gradient",
-    from: { x: x1, y: y1 },
-    to: { x: x2, y: y2 },
-    stops,
-    units: readGradientUnits(el)
+    from: {
+      x: num(inheritedAttr(el, elements, "x1"), 0),
+      y: num(inheritedAttr(el, elements, "y1"), 0)
+    },
+    to: {
+      x: num(inheritedAttr(el, elements, "x2"), 1),
+      y: num(inheritedAttr(el, elements, "y2"), 0)
+    },
+    stops: inheritedStops(el, elements, onWarn),
+    units: readGradientUnits(el, elements)
   };
 }
-function readRadialGradient(el, onWarn) {
-  const cx = parseFloat(el.getAttribute("cx") ?? "0.5");
-  const cy = parseFloat(el.getAttribute("cy") ?? "0.5");
-  const r = parseFloat(el.getAttribute("r") ?? "0.5");
-  const stops = readStops(el, onWarn);
+function readRadialGradient(el, elements, onWarn) {
+  warnGradientTransform(el, elements, onWarn);
   return {
     fill: "radial-gradient",
-    center: { x: cx, y: cy },
-    radius: r,
-    stops,
-    units: readGradientUnits(el)
+    center: {
+      x: num(inheritedAttr(el, elements, "cx"), 0.5),
+      y: num(inheritedAttr(el, elements, "cy"), 0.5)
+    },
+    radius: num(inheritedAttr(el, elements, "r"), 0.5),
+    stops: inheritedStops(el, elements, onWarn),
+    units: readGradientUnits(el, elements)
   };
 }
 var PaintServerRegistry = class {
@@ -523,7 +583,15 @@ var SUPPORTED_LEAF_TAGS = /* @__PURE__ */ new Set([
   "path"
 ]);
 var SUPPORTED_GROUP_TAGS = /* @__PURE__ */ new Set(["g", "svg"]);
-var IGNORED_TAGS = /* @__PURE__ */ new Set(["defs", "linearGradient", "radialGradient", "title", "desc", "metadata"]);
+var IGNORED_TAGS = /* @__PURE__ */ new Set([
+  "defs",
+  "lineargradient",
+  "radialgradient",
+  "pattern",
+  "title",
+  "desc",
+  "metadata"
+]);
 function parseSvg(svg, opts = {}) {
   const warnings = [];
   const onWarn = (m) => {
@@ -557,16 +625,10 @@ function parseSvg(svg, opts = {}) {
   if (documentMeta) result.documentMeta = documentMeta;
   const viewBox = parseViewBoxAttr(root.getAttribute("viewBox"));
   if (viewBox) result.viewBox = viewBox;
-  const widthAttr = root.getAttribute("width");
-  if (widthAttr != null) {
-    const n = parseFloat(widthAttr);
-    if (Number.isFinite(n)) result.width = n;
-  }
-  const heightAttr = root.getAttribute("height");
-  if (heightAttr != null) {
-    const n = parseFloat(heightAttr);
-    if (Number.isFinite(n)) result.height = n;
-  }
+  const width = parseRootLength(root.getAttribute("width"), "width", onWarn);
+  if (width != null) result.width = width;
+  const height = parseRootLength(root.getAttribute("height"), "height", onWarn);
+  if (height != null) result.height = height;
   for (let i = 0; i < root.children.length; i++) {
     const c = root.children[i];
     if (c.tagName.toLowerCase() === "title") {
@@ -584,6 +646,14 @@ function parseViewBoxAttr(raw) {
   if (nums.some((n) => !Number.isFinite(n))) return void 0;
   return { x: nums[0], y: nums[1], width: nums[2], height: nums[3] };
 }
+function parseRootLength(raw, name, onWarn) {
+  if (raw == null) return void 0;
+  const n = parseFloat(raw);
+  if (!Number.isFinite(n)) return void 0;
+  const unit = /^\s*[-+]?[\d.eE+-]+\s*([a-z%]+)\s*$/i.exec(raw)?.[1];
+  if (unit) onWarn(`<svg ${name}="${raw}"> unit "${unit}" is not converted; read as ${n}`);
+  return n;
+}
 function collectDocumentMeta(root, uriToPrefix) {
   if (uriToPrefix.size === 0) return void 0;
   const meta = {};
@@ -684,7 +754,13 @@ function parseElement(el, ctm, style, gradients, onWarn, uriToPrefix) {
   }
   if (SUPPORTED_GROUP_TAGS.has(tag)) {
     const childStyle = deriveStyle(style, el);
-    return parseChildren(el, ctm, childStyle, gradients, onWarn, uriToPrefix);
+    const x = parseFloat(el.getAttribute("x") ?? "0");
+    const y = parseFloat(el.getAttribute("y") ?? "0");
+    const offset = [1, 0, 0, 1, Number.isFinite(x) ? x : 0, Number.isFinite(y) ? y : 0];
+    if (el.hasAttribute("viewBox")) {
+      onWarn("nested <svg> viewBox is not modeled; its children are not rescaled");
+    }
+    return parseChildren(el, multiply(ctm, offset), childStyle, gradients, onWarn, uriToPrefix);
   }
   if (tag === "text") {
     const textNode = parseTextElement(el, ctm, style, gradients, onWarn);
@@ -711,15 +787,16 @@ function parseElement(el, ctm, style, gradients, onWarn, uriToPrefix) {
   if (!path) return null;
   let rotation;
   if (!isIdentity(localTransform)) {
+    const worldLocal = rebaseTransform(ctm, localTransform);
     const bounds = pathAabb(path);
     const cx = bounds.x + bounds.width / 2;
     const cy = bounds.y + bounds.height / 2;
-    const angle = decomposeRotation(localTransform, cx, cy);
+    const angle = decomposeRotation(worldLocal, cx, cy);
     if (angle != null) {
       rotation = angle;
     } else {
-      path = transformPath(path, localTransform);
-      const rotComp = rotationComponent(localTransform);
+      path = transformPath(path, worldLocal);
+      const rotComp = rotationComponent(worldLocal);
       if (Math.abs(rotComp) > 1e-4) {
         onWarn(`leaf transform has a rotational component that can't be cleanly stored as rotation; baked into geometry (may not round-trip identically)`);
       }
@@ -740,30 +817,29 @@ function parseElement(el, ctm, style, gradients, onWarn, uriToPrefix) {
   if (tag === "line" && (leafStyle["fill"] ?? null) == null) {
     node.fill = { kind: "none" };
   }
-  if (tag === "polyline" && !el.hasAttribute("fill")) ;
   const meta = collectElementMeta(el, uriToPrefix);
   if (meta) node.meta = meta;
   return node;
 }
 function lowerLeaf(el, tag, m, onWarn) {
-  const num = (name, fallback = 0) => {
+  const num2 = (name, fallback = 0) => {
     const v = el.getAttribute(name);
     if (v == null) return fallback;
     const n = parseFloat(v);
     return Number.isFinite(n) ? n : fallback;
   };
   if (tag === "rect") {
-    const x = num("x", 0);
-    const y = num("y", 0);
-    const w = num("width", 0);
-    const h = num("height", 0);
-    const rx = num("rx", 0);
-    const ry = num("ry", 0);
+    const x = num2("x", 0);
+    const y = num2("y", 0);
+    const w = num2("width", 0);
+    const h = num2("height", 0);
+    const rx = num2("rx", 0);
+    const ry = num2("ry", 0);
     return rectElementToPath(x, y, w, h, rx, ry, m);
   }
-  if (tag === "circle") return circleToPath(num("cx"), num("cy"), num("r"), m);
-  if (tag === "ellipse") return ellipseToPath(num("cx"), num("cy"), num("rx"), num("ry"), m);
-  if (tag === "line") return lineToPath(num("x1"), num("y1"), num("x2"), num("y2"), m);
+  if (tag === "circle") return circleToPath(num2("cx"), num2("cy"), num2("r"), m);
+  if (tag === "ellipse") return ellipseToPath(num2("cx"), num2("cy"), num2("rx"), num2("ry"), m);
+  if (tag === "line") return lineToPath(num2("x1"), num2("y1"), num2("x2"), num2("y2"), m);
   if (tag === "polyline") return polylineToPath(parsePoints(el.getAttribute("points") ?? ""), m);
   if (tag === "polygon") return polygonToPath(parsePoints(el.getAttribute("points") ?? ""), m);
   if (tag === "path") {
@@ -925,7 +1001,7 @@ function parseDashArray(s) {
   return nums.length % 2 === 1 ? [...nums, ...nums] : nums;
 }
 function readOpacityAttr(el, name) {
-  const raw = el.getAttribute(name);
+  const raw = ownProp(el, name);
   if (raw == null) return void 0;
   const n = parseFloat(raw);
   return Number.isFinite(n) ? clamp01(n) : void 0;
@@ -950,22 +1026,22 @@ function parseTextDecoration(raw) {
   if (tokens.includes("line-through")) out.strikethrough = true;
   return out;
 }
-var XLINK_NS = "http://www.w3.org/1999/xlink";
+var XLINK_NS2 = "http://www.w3.org/1999/xlink";
 function parseImageElement(el, ctm, onWarn) {
-  const href = el.getAttribute("href") ?? el.getAttributeNS(XLINK_NS, "href") ?? el.getAttribute("xlink:href");
+  const href = el.getAttribute("href") ?? el.getAttributeNS(XLINK_NS2, "href") ?? el.getAttribute("xlink:href");
   if (!href) {
     onWarn("<image> without href; dropped");
     return null;
   }
-  const num = (raw, fallback) => {
+  const num2 = (raw, fallback) => {
     if (raw == null) return fallback;
     const n = parseFloat(raw);
     return Number.isFinite(n) ? n : fallback;
   };
-  const rawX = num(el.getAttribute("x"), 0);
-  const rawY = num(el.getAttribute("y"), 0);
-  const rawW = num(el.getAttribute("width"), 0);
-  const rawH = num(el.getAttribute("height"), 0);
+  const rawX = num2(el.getAttribute("x"), 0);
+  const rawY = num2(el.getAttribute("y"), 0);
+  const rawW = num2(el.getAttribute("width"), 0);
+  const rawH = num2(el.getAttribute("height"), 0);
   const px = (x, y) => [ctm[0] * x + ctm[2] * y + ctm[4], ctm[1] * x + ctm[3] * y + ctm[5]];
   const [x0, y0] = px(rawX, rawY);
   const [x1, y1] = px(rawX + rawW, rawY + rawH);
@@ -981,13 +1057,14 @@ function parseImageElement(el, ctm, onWarn) {
   if (opacity != null) node.opacity = opacity;
   const localTransform = parseTransform(el.getAttribute("transform"), onWarn);
   if (!isIdentity(localTransform)) {
+    const worldLocal = rebaseTransform(ctm, localTransform);
     const cx = node.x + node.width / 2;
     const cy = node.y + node.height / 2;
-    const angle = decomposeRotation(localTransform, cx, cy);
+    const angle = decomposeRotation(worldLocal, cx, cy);
     if (angle != null) {
       node.rotation = angle;
     } else {
-      const rotComp = rotationComponent(localTransform);
+      const rotComp = rotationComponent(worldLocal);
       if (Math.abs(rotComp) > 1e-4) {
         onWarn("<image> transform has a rotational component that can't be cleanly stored as rotation; dropped (may not round-trip identically)");
       }
@@ -998,16 +1075,52 @@ function parseImageElement(el, ctm, onWarn) {
   }
   return node;
 }
+var XML_NS = "http://www.w3.org/XML/1998/namespace";
+function preservesSpace(el) {
+  for (let e = el; e; e = e.parentElement) {
+    const v = e.getAttributeNS(XML_NS, "space") ?? e.getAttribute("xml:space");
+    if (v === "preserve") return true;
+    if (v === "default") return false;
+  }
+  return false;
+}
+function collapseRunWhitespace(runs) {
+  let atStart = true;
+  let lastWasSpace = false;
+  for (const run of runs) {
+    let out = "";
+    for (const ch of run.text.replace(/\n/g, "").replace(/[\t\r]/g, " ")) {
+      if (ch === " ") {
+        if (atStart || lastWasSpace) continue;
+        out += " ";
+        lastWasSpace = true;
+        continue;
+      }
+      out += ch;
+      lastWasSpace = false;
+      atStart = false;
+    }
+    run.text = out;
+  }
+  for (let i = runs.length - 1; i >= 0; i--) {
+    if (runs[i].text === "") continue;
+    if (runs[i].text.endsWith(" ")) runs[i].text = runs[i].text.slice(0, -1);
+    break;
+  }
+  for (let i = runs.length - 1; i >= 0; i--) {
+    if (runs[i].text === "") runs.splice(i, 1);
+  }
+}
 function parseTextElement(el, ctm, style, gradients, onWarn) {
-  const num = (raw, fallback) => {
+  const num2 = (raw, fallback) => {
     if (raw == null) return fallback;
     const n = parseFloat(raw);
     return Number.isFinite(n) ? n : fallback;
   };
   const localTransform = parseTransform(el.getAttribute("transform"), onWarn);
   const m = ctm;
-  const rawX = num(el.getAttribute("x"), 0);
-  const rawY = num(el.getAttribute("y"), 0);
+  const rawX = num2(el.getAttribute("x"), 0);
+  const rawY = num2(el.getAttribute("y"), 0);
   const ax = m[0] * rawX + m[2] * rawY + m[4];
   const ay = m[1] * rawX + m[3] * rawY + m[5];
   const leafStyle = deriveStyle(style, el);
@@ -1018,40 +1131,35 @@ function parseTextElement(el, ctm, style, gradients, onWarn) {
   const explicitTopAnchor = dominantBaseline === "text-before-edge" || dominantBaseline === "hanging";
   const topY = explicitTopAnchor ? ay : ay - fontSize;
   const runs = [];
-  let plain = "";
   for (let i = 0; i < el.childNodes.length; i++) {
     const child = el.childNodes[i];
     if (child.nodeType === 3) {
       const t = child.textContent ?? "";
       if (!t) continue;
       runs.push({ text: t });
-      plain += t;
     } else if (child.nodeType === 1) {
       const sp = child;
       if (sp.tagName.toLowerCase() !== "tspan") {
         onWarn(`<text> child <${sp.tagName}> not supported; flattening text content`);
         const t = sp.textContent ?? "";
-        if (t) {
-          runs.push({ text: t });
-          plain += t;
-        }
+        if (t) runs.push({ text: t });
         continue;
       }
       const run = readTspanRun(sp, gradients, leafStyle, onWarn);
       runs.push(run);
-      plain += run.text;
     }
   }
-  const dataW = num(el.getAttribute("data-weasel-width"), NaN);
-  const dataH = num(el.getAttribute("data-weasel-height"), NaN);
+  if (!preservesSpace(el)) collapseRunWhitespace(runs);
+  const plain = runs.map((r) => r.text).join("");
+  const dataW = num2(el.getAttribute("data-weasel-width"), NaN);
+  const dataH = num2(el.getAttribute("data-weasel-height"), NaN);
   const width = Number.isFinite(dataW) ? dataW : UNBOUNDED_TEXT_WIDTH;
   const lines = (plain.match(/\n/g)?.length ?? 0) + 1;
   const height = Number.isFinite(dataH) ? dataH : fontSize * lineHeight * lines;
   const opacity = readOpacityAttr(el, "opacity");
   const node = {
     kind: "text",
-    x: topY === ay ? ax : ax,
-    // x is unchanged by the baseline shift
+    x: ax,
     y: topY,
     width,
     height,
@@ -1064,13 +1172,14 @@ function parseTextElement(el, ctm, style, gradients, onWarn) {
   if (Object.keys(textStyle).length > 0) node.style = textStyle;
   if (opacity != null) node.opacity = opacity;
   if (!isIdentity(localTransform)) {
+    const worldLocal = rebaseTransform(ctm, localTransform);
     const cx = node.x + node.width / 2;
     const cy = node.y + node.height / 2;
-    const angle = decomposeRotation(localTransform, cx, cy);
+    const angle = decomposeRotation(worldLocal, cx, cy);
     if (angle != null) {
       node.rotation = angle;
     } else {
-      const rotComp = rotationComponent(localTransform);
+      const rotComp = rotationComponent(worldLocal);
       if (Math.abs(rotComp) > 1e-4) {
         onWarn(`<text> transform has a rotational component that can't be cleanly stored as rotation; dropped (may not round-trip identically)`);
       }
@@ -1362,11 +1471,11 @@ function pathXml(node, registry, namespaces) {
   }
   return `<path ${attrs.join(" ")}${metaAttrs}/>`;
 }
-function paintAttrs(paint, name, registry) {
+function paintAttrs(paint, name, registry, includeOpacity = true) {
   if (paint.kind === "none") return [`${name}="none"`];
   if (paint.kind === "solid") {
     const out = [`${name}="${paint.color}"`];
-    if (paint.opacity != null && paint.opacity !== 1) {
+    if (includeOpacity && paint.opacity != null && paint.opacity !== 1) {
       out.push(`${name}-opacity="${trimNumber(paint.opacity)}"`);
     }
     return out;
@@ -1397,10 +1506,11 @@ function coreStrokeAttrs(stroke, registry) {
   return attrs;
 }
 function strokeAttrsFor(stroke, registry) {
-  const attrs = paintAttrs(stroke.paint, "stroke", registry);
+  const attrs = paintAttrs(stroke.paint, "stroke", registry, false);
   attrs.push(`stroke-width="${trimNumber(stroke.width)}"`);
-  if (stroke.opacity != null && stroke.opacity !== 1) {
-    attrs.push(`stroke-opacity="${trimNumber(stroke.opacity)}"`);
+  const opacity = stroke.opacity ?? (stroke.paint.kind === "solid" ? stroke.paint.opacity : void 0);
+  if (opacity != null && opacity !== 1) {
+    attrs.push(`stroke-opacity="${trimNumber(opacity)}"`);
   }
   if (stroke.cap) {
     attrs.push(`stroke-linecap="${stroke.cap}"`);
@@ -1418,28 +1528,47 @@ function strokeAttrsFor(stroke, registry) {
 }
 function computeBounds(nodes) {
   let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
-  const visit = (n) => {
+  const visit = (n, ctm) => {
     if (n.kind === "group") {
-      n.children.forEach(visit);
+      const childCtm = n.transform ? multiply(ctm, n.transform) : ctm;
+      n.children.forEach((c) => visit(c, childCtm));
       return;
     }
     const b = n.kind === "text" || n.kind === "image" ? { minX: n.x, minY: n.y, maxX: n.x + n.width, maxY: n.y + n.height } : pathBounds(n.path);
-    if (b.minX < minX) minX = b.minX;
-    if (b.minY < minY) minY = b.minY;
-    if (b.maxX > maxX) maxX = b.maxX;
-    if (b.maxY > maxY) maxY = b.maxY;
+    const local = n.rotation ? rotateAboutCenter(ctm, b, n.rotation) : ctm;
+    for (const [x, y] of corners(b)) {
+      const px = local[0] * x + local[2] * y + local[4];
+      const py = local[1] * x + local[3] * y + local[5];
+      if (px < minX) minX = px;
+      if (py < minY) minY = py;
+      if (px > maxX) maxX = px;
+      if (py > maxY) maxY = py;
+    }
   };
-  nodes.forEach(visit);
+  nodes.forEach((n) => visit(n, IDENTITY_MATRIX));
   if (!Number.isFinite(minX)) {
     return { x: 0, y: 0, width: 0, height: 0 };
   }
   return { x: minX, y: minY, width: maxX - minX, height: maxY - minY };
 }
+function corners(b) {
+  return [[b.minX, b.minY], [b.maxX, b.minY], [b.maxX, b.maxY], [b.minX, b.maxY]];
+}
+function rotateAboutCenter(ctm, b, angle) {
+  const cx = (b.minX + b.maxX) / 2;
+  const cy = (b.minY + b.maxY) / 2;
+  const c = Math.cos(angle);
+  const s = Math.sin(angle);
+  return multiply(ctm, [c, s, -s, c, cx - cx * c + cy * s, cy - cx * s - cy * c]);
+}
 function textXml(node, registry, namespaces) {
   const attrs = [
     `x="${trimNumber(node.x)}"`,
     `y="${trimNumber(node.y)}"`,
     `dominant-baseline="text-before-edge"`,
+    // The runs model stores real line breaks; SVG's default whitespace
+    // handling would collapse them (and any indentation) away on re-import.
+    `xml:space="preserve"`,
     `data-weasel-width="${trimNumber(node.width)}"`,
     `data-weasel-height="${trimNumber(node.height)}"`
   ];