@pixldocs/canvas-renderer 0.5.79 → 0.5.81

package/dist/index.d.ts

@@ -256,7 +256,7 @@ export declare function normalizeFontFamily(fontStack: string): string;
  * Package version banner. Bump alongside package.json so we can confirm
  * (via browser:log) that the deployed bundle matches the expected build.
  */
-export declare const PACKAGE_VERSION = "0.5.79";
+export declare const PACKAGE_VERSION = "0.5.81";
 
 export declare interface PageSettings {
     backgroundColor?: string;

package/dist/index.js

@@ -5205,6 +5205,17 @@ const stringifyDiag = (payload) => {
     return String(payload);
   }
 };
+function hasAnyCharStyleFlag(styles, flag) {
+  if (!styles || typeof styles !== "object") return void 0;
+  const lineEntries = Array.isArray(styles) ? styles : Object.values(styles);
+  for (const lineStyle of lineEntries) {
+    if (!lineStyle || typeof lineStyle !== "object") continue;
+    for (const charStyle of Object.values(lineStyle)) {
+      if (charStyle && charStyle[flag] === true) return true;
+    }
+  }
+  return void 0;
+}
 function buildRoundedRectPath(w, h, tl, tr, br, bl) {
   return buildRoundedRectPath$1(w, h, getRoundedRectRadii(w, h, { rxTL: tl, rxTR: tr, rxBR: br, rxBL: bl }));
 }
@@ -5444,13 +5455,14 @@ function createText(element) {
     fontWeight: element.fontWeight || 400,
     textAlign: element.textAlign || "left",
     fontStyle: element.fontStyle || "normal",
-    underline: element.underline ?? false,
-    linethrough: element.linethrough ?? false,
+    underline: element.underline ?? hasAnyCharStyleFlag(element.styles, "underline") ?? false,
+    linethrough: element.linethrough ?? hasAnyCharStyleFlag(element.styles, "linethrough") ?? false,
     lineHeight: element.lineHeight || 1.2,
     charSpacing: element.charSpacing || 0,
     objectCaching: false,
     noScaleCache: true,
-    splitByGrapheme
+    splitByGrapheme,
+    ...element.styles ? { styles: element.styles } : {}
   });
   textbox.initDimensions();
   textbox.set({
@@ -12578,7 +12590,7 @@ function PixldocsPreview(props) {
     !canvasSettled && /* @__PURE__ */ jsx("div", { style: { position: "absolute", inset: 0, display: "flex", alignItems: "center", justifyContent: "center", minHeight: 200 }, children: /* @__PURE__ */ jsx("div", { style: { color: "#888", fontSize: 14 }, children: "Loading preview..." }) })
   ] });
 }
-const PACKAGE_VERSION = "0.5.79";
+const PACKAGE_VERSION = "0.5.81";
 const roundParityValue = (value) => {
   if (typeof value !== "number") return value;
   return Number.isFinite(value) ? Number(value.toFixed(3)) : value;
@@ -15423,7 +15435,9 @@ async function convertTextDecorationsToLines(svg) {
       const fontFamily = tspan.getAttribute("data-source-font-family") || textEl.getAttribute("data-source-font-family") || resolveInheritedSvgValue(tspan, "font-family") || "sans-serif";
       const fontWeight = tspan.getAttribute("data-source-font-weight") || textEl.getAttribute("data-source-font-weight") || resolveInheritedSvgValue(tspan, "font-weight") || "normal";
       const fontStyle = tspan.getAttribute("data-source-font-style") || textEl.getAttribute("data-source-font-style") || resolveInheritedSvgValue(tspan, "font-style") || "normal";
-      const fill = tspan.getAttribute("fill") || textEl.getAttribute("fill") || "#000000";
+      const resolvedFill = tspan.getAttribute("fill") || getInlineStyleValue(tspan, "fill") || resolveInheritedSvgValue(tspan, "fill") || textEl.getAttribute("fill") || getInlineStyleValue(textEl, "fill") || "#000000";
+      const fill = resolvedFill;
+      const fillOpacity = tspan.getAttribute("fill-opacity") || getInlineStyleValue(tspan, "fill-opacity") || resolveInheritedSvgValue(tspan, "fill-opacity") || textEl.getAttribute("fill-opacity") || getInlineStyleValue(textEl, "fill-opacity") || null;
       let textWidth = content.length * fontSize * 0.6;
       if (ctx) {
         ctx.font = `${fontStyle} ${fontWeight} ${fontSize}px ${fontFamily.replace(/'/g, "")}`;
@@ -15474,6 +15488,7 @@ async function convertTextDecorationsToLines(svg) {
       line.setAttribute("stroke-width", String(thickness));
       line.setAttribute("stroke-linecap", "butt");
       line.setAttribute("fill", "none");
+      if (fillOpacity) line.setAttribute("stroke-opacity", fillOpacity);
       if (textEl.parentElement) {
         textEl.parentElement.insertBefore(line, textEl.nextSibling);
       }