@opendata-ai/openchart-vanilla 6.5.1 → 6.5.2

package/dist/index.js

@@ -3264,7 +3264,7 @@ function cancelAnimations(svg) {
     svg.classList.remove("oc-animate");
   }
 }
-function setupAnimationCleanup(svg) {
+function setupAnimationCleanup(svg, onComplete) {
   const style = svg.style;
   const duration = parseFloat(style.getPropertyValue("--oc-animation-duration")) || 600;
   const stagger = parseFloat(style.getPropertyValue("--oc-animation-stagger")) || 0;
@@ -3274,6 +3274,7 @@ function setupAnimationCleanup(svg) {
   const totalTime = totalStagger + duration + annotationDelay + 500;
   const timer2 = setTimeout(() => {
     svg.classList.remove("oc-animate");
+    onComplete?.();
   }, totalTime);
   return () => {
     clearTimeout(timer2);
@@ -3955,32 +3956,7 @@ function renderAnnotation(parent, annotation, index2) {
   if (annotation.label?.visible) {
     if (annotation.label.connector) {
       const c2 = annotation.label.connector;
-      if (c2.style === "caret") {
-        const pointsDown = c2.to.y > c2.from.y;
-        const caretSize = 4;
-        const labelLines = annotation.label.text.split("\n");
-        const labelFontSize = annotation.label.style.fontSize ?? 12;
-        const labelLineHeight = labelFontSize * (annotation.label.style.lineHeight ?? 1.3);
-        const textBottom = annotation.label.y + (labelLines.length - 1) * labelLineHeight + labelFontSize * 0.25;
-        const textTop = annotation.label.y - labelFontSize;
-        const gapEdge = pointsDown ? textBottom : textTop;
-        const midY = (gapEdge + c2.to.y) / 2;
-        const tipX = c2.to.x;
-        const tipY = pointsDown ? midY + caretSize / 2 : midY - caretSize / 2;
-        const baseY = pointsDown ? tipY - caretSize : tipY + caretSize;
-        const path = createSVGElement("path");
-        path.setAttribute("class", "oc-annotation-connector");
-        setAttrs(path, {
-          d: `M${tipX - caretSize},${baseY} L${tipX},${tipY} L${tipX + caretSize},${baseY}`,
-          fill: "none",
-          stroke: c2.stroke,
-          "stroke-width": 1.5,
-          "stroke-opacity": 0.4,
-          "stroke-linecap": "round",
-          "stroke-linejoin": "round"
-        });
-        g.appendChild(path);
-      } else if (c2.style === "curve") {
+      if (c2.style === "curve") {
         renderCurvedArrow(g, c2.from, c2.to, c2.stroke);
       } else {
         const connector = createSVGElement("line");
@@ -5561,6 +5537,7 @@ function createChart(container, spec, options) {
   let resizeTimer = null;
   let isFirstRender = true;
   let cleanupAnimations = null;
+  let pendingResize = false;
   let selectedElement = options?.selectedElement ?? null;
   let overlayElement = null;
   let isTextEditingActive = false;
@@ -5927,7 +5904,13 @@ function createChart(container, spec, options) {
       container.classList.remove("oc-dark");
     }
     if (shouldAnimate && svgElement) {
-      cleanupAnimations = setupAnimationCleanup(svgElement);
+      cleanupAnimations = setupAnimationCleanup(svgElement, () => {
+        cleanupAnimations = null;
+        if (pendingResize) {
+          pendingResize = false;
+          resize();
+        }
+      });
     }
     if (isFirstRender) {
       isFirstRender = false;
@@ -5943,7 +5926,10 @@ function createChart(container, spec, options) {
   }
   function resize() {
     if (destroyed) return;
-    if (cleanupAnimations) return;
+    if (cleanupAnimations) {
+      pendingResize = true;
+      return;
+    }
     render();
   }
   function doExport(format, exportOptions) {
@@ -5973,6 +5959,7 @@ function createChart(container, spec, options) {
     if (cleanupAnimations) {
       cleanupAnimations();
       cleanupAnimations = null;
+      pendingResize = false;
     }
     cancelAnimations(svgElement);
     if (resizeTimer !== null) {