canvu-react 0.4.37 → 0.4.39

package/dist/native.d.cts

@@ -373,6 +373,7 @@ type SvgPathNode = {
     readonly strokeOpacity?: number;
     readonly strokeLinecap?: string;
     readonly strokeLinejoin?: string;
+    readonly strokeDasharray?: string;
     readonly shapeRendering?: string;
     readonly vectorEffect?: string;
 };

package/dist/native.d.ts

@@ -373,6 +373,7 @@ type SvgPathNode = {
     readonly strokeOpacity?: number;
     readonly strokeLinecap?: string;
     readonly strokeLinejoin?: string;
+    readonly strokeDasharray?: string;
     readonly shapeRendering?: string;
     readonly vectorEffect?: string;
 };

package/dist/native.js

@@ -1713,6 +1713,11 @@ function rgbaFromHexAndOpacity(hex, opacity) {
 function toNum(v) {
   return typeof v === "number" ? v : Number(v) || 0;
 }
+function dashIntervalsFromStrokeDasharray(strokeDasharray) {
+  if (!strokeDasharray) return null;
+  const intervals = strokeDasharray.split(/[\s,]+/).map((part) => Number(part)).filter((part) => Number.isFinite(part) && part > 0);
+  return intervals.length > 0 ? intervals : null;
+}
 function SvgNodeRenderer({ nodes }) {
   return /* @__PURE__ */ jsx(Fragment, { children: nodes.map((node, i) => /* @__PURE__ */ jsx(SvgNodeItem, { node }, i)) });
 }
@@ -1827,6 +1832,7 @@ function SvgNodeItem({ node }) {
       const stroke = rgbaFromHexAndOpacity(node.stroke, node.strokeOpacity);
       const fill = isFill ? rgbaFromHexAndOpacity(node.fill, node.fillOpacity) ?? node.fill : void 0;
       const style = fill && fill !== "none" ? "fill" : "stroke";
+      const intervals = style === "stroke" ? dashIntervalsFromStrokeDasharray(node.strokeDasharray) : null;
       return /* @__PURE__ */ jsx(
         Path,
         {
@@ -1837,7 +1843,8 @@ function SvgNodeItem({ node }) {
           strokeCap: node.strokeLinecap === "round" ? "round" : "butt",
           strokeJoin: node.strokeLinejoin === "round" ? "round" : "miter",
           fillType: node.fillRule === "evenodd" ? "evenOdd" : "winding",
-          antiAlias: true
+          antiAlias: true,
+          children: intervals ? /* @__PURE__ */ jsx(DashPathEffect, { intervals }) : null
         }
       );
     }
@@ -2020,6 +2027,7 @@ function parsePathNode(attrs) {
     strokeOpacity: parseNumOpt(attrs["stroke-opacity"]),
     strokeLinecap: attrs["stroke-linecap"],
     strokeLinejoin: attrs["stroke-linejoin"],
+    strokeDasharray: attrs["stroke-dasharray"],
     shapeRendering: attrs["shape-rendering"],
     vectorEffect: attrs["vector-effect"]
   };
@@ -2172,6 +2180,11 @@ function rgba(hex, alpha) {
   if (Number.isNaN(r) || Number.isNaN(g) || Number.isNaN(b)) return hex;
   return `rgba(${r},${g},${b},${alpha})`;
 }
+function dashIntervalsFromStrokeDasharray2(strokeDasharray) {
+  if (!strokeDasharray) return null;
+  const intervals = strokeDasharray.split(/[\s,]+/).map((part) => Number(part)).filter((part) => Number.isFinite(part) && part > 0);
+  return intervals.length > 0 ? intervals : null;
+}
 function localBounds(bounds) {
   const b = normalizeRect(bounds);
   return { w: Math.max(0, b.width), h: Math.max(0, b.height) };
@@ -2461,6 +2474,7 @@ function NativeShapeRenderer({ item }) {
         }
       );
     }
+    const intervals = dashIntervalsFromStrokeDasharray2(payload.strokeDasharray);
     return /* @__PURE__ */ jsx(
       Path,
       {
@@ -2470,7 +2484,8 @@ function NativeShapeRenderer({ item }) {
         strokeWidth: payload.strokeWidth,
         strokeCap: "round",
         strokeJoin: "round",
-        antiAlias: true
+        antiAlias: true,
+        children: intervals ? /* @__PURE__ */ jsx(DashPathEffect, { intervals }) : null
       }
     );
   }
@@ -2644,7 +2659,7 @@ function pointsToSmoothPathD(points) {
   const d = smoothFreehandPointsToPathD(points);
   return d || null;
 }
-function dashIntervalsFromStrokeDasharray(strokeDasharray) {
+function dashIntervalsFromStrokeDasharray3(strokeDasharray) {
   if (!strokeDasharray) return null;
   const intervals = strokeDasharray.split(/\s+/).map((part) => Number(part)).filter((part) => Number.isFinite(part) && part > 0);
   return intervals.length > 0 ? intervals : null;
@@ -2934,7 +2949,7 @@ function NativeInteractionOverlay({
         );
       }
       if (payload.kind === "strokePath") {
-        const intervals = dashIntervalsFromStrokeDasharray(payload.strokeDasharray);
+        const intervals = dashIntervalsFromStrokeDasharray3(payload.strokeDasharray);
         return /* @__PURE__ */ jsx(
           Path,
           {