chartai 0.1.0 → 1.1.0

package/dist/plugins/experimental/ruler.min.js

@@ -0,0 +1,59 @@
+import{j as w,k as R}from"../../chunk-cbydth3q.js";import{l as L}from"../../chunk-cvtt04m6.js";import{o as E}from"../../chunk-0eh4rzy9.js";import{q as v}from"../../chunk-50bcv2hw.js";import"../../chunk-wdfq2fpx.js";import"../../chunk-bbyt23tw.js";var P=new WeakMap,X=12;function A(e,n){let t=e.hasAttribute("data-visible");if(n===t)return;if(e.style.transform="",n)e.setAttribute("data-visible","");else e.removeAttribute("data-visible")}function I(){if(document.getElementById("chart-ruler-styles"))return;let e=document.createElement("style");e.id="chart-ruler-styles",e.textContent=`
+@layer chartai.ruler {
+  .chart-ruler-wrapper {
+    position: absolute;
+    z-index: 1000;
+    pointer-events: none;
+    display: inline-block;
+  }
+  .chart-ruler-btn {
+    position: relative;
+    width: 28px;
+    height: 28px;
+    border-radius: 50%;
+    border: 1.5px solid var(--ruler-btn-border);
+    background: var(--ruler-btn-bg);
+    color: var(--ruler-btn-color);
+    z-index: 100;
+    cursor: pointer;
+    pointer-events: auto;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0;
+    box-shadow: 0 1px 4px rgba(0,0,0,0.18);
+  }
+  .chart-ruler-btn[data-active] {
+    --ruler-btn-border: var(--ruler-active-border);
+    --ruler-btn-bg: var(--ruler-active-bg);
+    --ruler-btn-color: var(--ruler-active-color);
+  }
+  .chart-ruler-clear {
+    position: absolute;
+    top: -6px;
+    right: -6px;
+    width: 18px;
+    height: 18px;
+    border-radius: 50%;
+    border: 1px solid oklch(from var(--ruler-active-color) calc(l * 0.7) c h / 1);
+    background: oklch(from var(--ruler-active-color) calc(l * 0.22) c h / 1);
+    color: var(--ruler-active-color);
+    z-index: 101;
+    cursor: pointer;
+    pointer-events: none;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0;
+    box-shadow: 0 1px 3px rgba(0,0,0,0.22);
+    opacity: 0;
+    transform: scale(0.5);
+    transition: opacity 0.18s ease, transform 0.18s cubic-bezier(0.4, 0, 1, 1);
+  }
+  .chart-ruler-clear[data-visible] {
+    opacity: 1;
+    transform: scale(1);
+    pointer-events: auto;
+    transition: opacity 0.22s ease, transform 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
+  }
+}`,document.head.appendChild(e)}function Y(e,n){let t=e.style;if(n)t.setProperty("--ruler-btn-border","rgba(255,255,255,0.2)"),t.setProperty("--ruler-btn-bg","rgba(30,30,32,0.88)"),t.setProperty("--ruler-btn-color","rgba(200,200,200,0.9)"),t.setProperty("--ruler-active-border","rgba(255,200,50,0.8)"),t.setProperty("--ruler-active-bg","rgba(255,200,50,0.2)"),t.setProperty("--ruler-active-color","rgba(255,200,50,0.95)"),t.setProperty("--ruler-clear-border","rgba(255,255,255,0.18)"),t.setProperty("--ruler-clear-bg","rgba(30,30,32,0.95)"),t.setProperty("--ruler-clear-color","rgba(200,200,200,0.9)");else t.setProperty("--ruler-btn-border","rgba(0,0,0,0.15)"),t.setProperty("--ruler-btn-bg","rgba(255,255,255,0.92)"),t.setProperty("--ruler-btn-color","rgba(80,80,80,0.9)"),t.setProperty("--ruler-active-border","rgba(180,100,0,0.8)"),t.setProperty("--ruler-active-bg","rgba(180,100,0,0.12)"),t.setProperty("--ruler-active-color","rgba(180,100,0,0.95)"),t.setProperty("--ruler-clear-border","rgba(0,0,0,0.13)"),t.setProperty("--ruler-clear-bg","rgba(255,255,255,0.97)"),t.setProperty("--ruler-clear-color","rgba(80,80,80,0.9)")}function M(e,n="bottom-right"){let t=E,c=8;switch(e.style.removeProperty("top"),e.style.removeProperty("bottom"),e.style.removeProperty("left"),e.style.removeProperty("right"),n){case"top-left":e.style.top=`${t.top+8}px`,e.style.left=`${t.left+8}px`;break;case"top-right":e.style.top=`${t.top+8}px`,e.style.right=`${t.right+8}px`;break;case"bottom-right":e.style.bottom=`${t.bottom+8}px`,e.style.right=`${t.right+8}px`;break;default:e.style.bottom=`${t.bottom+8}px`,e.style.left=`${t.left+8}px`}}function x(e,n,t,c,h,p,g){e.font=`500 11px ${p}`;let r=e.measureText(n).width+16,o=20,s=t-r/2,d=c-o/2;e.beginPath(),e.roundRect(s,d,r,o,5),e.fillStyle=g?"rgba(20,20,22,0.90)":"rgba(255,255,255,0.95)",e.fill(),e.strokeStyle=h,e.lineWidth=1.5,e.stroke(),e.fillStyle=h,e.textAlign="center",e.textBaseline="middle",e.fillText(n,t,c)}function C(e,n,t,c,h){e.beginPath(),e.arc(n,t,5,0,Math.PI*2),e.fillStyle=c,e.fill(),e.strokeStyle=h?"rgba(0,0,0,0.5)":"rgba(255,255,255,0.8)",e.lineWidth=1.5,e.stroke()}function B(e,n,t,c,h,p,g,u,r,o,s,d){let a=w(n.dataX,n.dataY,h,p,g),i=w(t.dataX,t.dataY,h,p,g);e.save(),e.strokeStyle=u,e.lineWidth=1.5,e.setLineDash([5,4]);let y=6;if(c==="x"){let l=(a.y+i.y)/2;e.beginPath(),e.moveTo(a.x,l),e.lineTo(i.x,l),e.stroke(),e.setLineDash([]),e.beginPath(),e.moveTo(a.x,l-y),e.lineTo(a.x,l+y),e.moveTo(i.x,l-y),e.lineTo(i.x,l+y),e.stroke(),C(e,a.x,a.y,u,d),C(e,i.x,i.y,u,d);let b=(a.x+i.x)/2,f=l-16,m=Math.abs(t.dataX-n.dataX);x(e,`ΔX: ${r(m)}`,b,f,u,s,d)}else if(c==="y"){let l=(a.x+i.x)/2;e.beginPath(),e.moveTo(l,a.y),e.lineTo(l,i.y),e.stroke(),e.setLineDash([]),e.beginPath(),e.moveTo(l-y,a.y),e.lineTo(l+y,a.y),e.moveTo(l-y,i.y),e.lineTo(l+y,i.y),e.stroke(),C(e,a.x,a.y,u,d),C(e,i.x,i.y,u,d);let b=l+20,f=(a.y+i.y)/2,m=Math.abs(t.dataY-n.dataY);x(e,`ΔY: ${o(m)}`,b,f,u,s,d)}else{e.beginPath(),e.moveTo(a.x,a.y),e.lineTo(i.x,i.y),e.stroke(),C(e,a.x,a.y,u,d),C(e,i.x,i.y,u,d);let l=(a.x+i.x)/2,b=(a.y+i.y)/2-18,f=Math.abs(t.dataX-n.dataX),m=Math.abs(t.dataY-n.dataY);x(e,`ΔX: ${r(f)}  ΔY: ${o(m)}`,l,b,u,s,d)}e.restore()}var N={name:"ruler",install(e,n){I();let t=new AbortController,c=e.config,h=v.isDark,p=document.createElement("div");p.className="chart-ruler-wrapper",M(p,c.rulerPosition),Y(p,h);let g=document.createElement("button");g.type="button",g.className="chart-ruler-btn",g.title="Toggle ruler tool",g.innerHTML='<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="1" y="4.5" width="12" height="5" rx="1" stroke="currentColor" stroke-width="1.3"/><line x1="3.5" y1="4.5" x2="3.5" y2="7" stroke="currentColor" stroke-width="1.2"/><line x1="5.5" y1="4.5" x2="5.5" y2="6" stroke="currentColor" stroke-width="1.2"/><line x1="7" y1="4.5" x2="7" y2="7" stroke="currentColor" stroke-width="1.2"/><line x1="8.5" y1="4.5" x2="8.5" y2="6" stroke="currentColor" stroke-width="1.2"/><line x1="10.5" y1="4.5" x2="10.5" y2="7" stroke="currentColor" stroke-width="1.2"/></svg>';let u=document.createElement("button");u.type="button",u.className="chart-ruler-clear",u.title="Clear all rulers",u.innerHTML='<svg width="5" height="5" viewBox="0 0 6 6" fill="none" xmlns="http://www.w3.org/2000/svg"><line x1="1" y1="1" x2="5" y2="5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><line x1="5" y1="1" x2="1" y2="5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>',p.appendChild(g),p.appendChild(u),n.appendChild(p);let r={rulers:[],pending:null,cursorDataX:0,cursorDataY:0,active:!1,justToggledButton:!1,abort:t,button:g,clearBtn:u,wrapper:p};P.set(e,r),g.addEventListener("pointerdown",(o)=>{if(o.stopPropagation(),o.stopImmediatePropagation(),o.preventDefault(),r.active=!r.active,!r.active)r.pending=null;if(r.justToggledButton=!0,r.active)g.dataset.active="";else delete g.dataset.active;v.drawChart(e)},{signal:t.signal}),u.addEventListener("pointerdown",(o)=>{o.stopPropagation(),o.stopImmediatePropagation(),o.preventDefault(),u.style.transform="scale(0.78)",r.rulers=[],r.pending=null,r.justToggledButton=!0,v.drawChart(e)},{signal:t.signal}),u.addEventListener("click",(o)=>{o.stopPropagation(),o.stopImmediatePropagation(),o.preventDefault()},{signal:t.signal}),n.addEventListener("mousemove",(o)=>{let s=n.getBoundingClientRect(),{x:d,y:a}=R(o.clientX-s.left,o.clientY-s.top,e,s.width,s.height);if(r.cursorDataX=d,r.cursorDataY=a,r.active||r.pending!==null)v.drawChart(e);o.preventDefault()},{signal:t.signal}),n.addEventListener("click",(o)=>{if(!r.active)return;if(r.justToggledButton){r.justToggledButton=!1;return}if(e.dragging)return;o.preventDefault();let s=n.getBoundingClientRect(),d=o.clientX-s.left,a=o.clientY-s.top,{x:i,y}=R(d,a,e,s.width,s.height);for(let l=r.rulers.length-1;l>=0;l--){let b=r.rulers[l],f=w(b.a.dataX,b.a.dataY,e,s.width,s.height),m=w(b.b.dataX,b.b.dataY,e,s.width,s.height),k=Math.hypot(f.x-d,f.y-a),T=Math.hypot(m.x-d,m.y-a);if(k<=X||T<=X){r.rulers.splice(l,1),v.drawChart(e);return}}if(r.pending===null)r.pending={dataX:i,dataY:y};else{let l=e.config.rulerMax??10;if(r.rulers.length>=l)r.rulers.shift();r.rulers.push({a:r.pending,b:{dataX:i,dataY:y}}),r.pending=null,v.drawChart(e)}},{signal:t.signal}),n.addEventListener("contextmenu",(o)=>{if(o.preventDefault(),r.pending!==null)r.pending=null;else{let s=n.getBoundingClientRect(),d=o.clientX-s.left,a=o.clientY-s.top,i=-1,y=1/0;for(let l=0;l<r.rulers.length;l++){let b=r.rulers[l],f=w(b.a.dataX,b.a.dataY,e,s.width,s.height),m=w(b.b.dataX,b.b.dataY,e,s.width,s.height),k=Math.hypot(f.x-d,f.y-a),T=Math.hypot(m.x-d,m.y-a),D=Math.min(k,T);if(D<y)y=D,i=l}if(i!==-1)r.rulers.splice(i,1)}v.drawChart(e)},{signal:t.signal}),window.addEventListener("keydown",(o)=>{if(o.key==="Escape"&&r.active)r.pending=null,v.drawChart(e)},{signal:t.signal})},afterDraw(e,n){let t=P.get(n);if(!t)return;let{width:c,height:h}=n,p=v.isDark,g=n.config,u=g.rulerAxis??"x",r=g.rulerColor??(p?"rgba(255,200,50,0.9)":"rgba(180,100,0,0.9)"),o=g.formatX??String,s=g.formatY??String,d=g.fontFamily??L;if(M(t.wrapper,g.rulerPosition),Y(t.wrapper,p),t.active)t.button.dataset.active="";else delete t.button.dataset.active;A(t.clearBtn,t.rulers.length>0),e.save();for(let a of t.rulers)B(e,a.a,a.b,u,n,c,h,r,o,s,d,p);if(t.pending!==null){let a={dataX:t.cursorDataX,dataY:t.cursorDataY};B(e,t.pending,a,u,n,c,h,r,o,s,d,p);let i=w(t.cursorDataX,t.cursorDataY,n,c,h);e.save(),e.beginPath(),e.arc(i.x,i.y,5,0,Math.PI*2),e.strokeStyle=r,e.lineWidth=1.5,e.stroke(),e.restore()}e.restore()},uninstall(e){let n=P.get(e);if(!n)return;n.abort.abort(),n.wrapper.remove(),P.delete(e)}};export{N as rulerPlugin};

package/dist/plugins/experimental/stats.js

@@ -0,0 +1,229 @@
+import {
+  DEFAULT_FONT
+} from "../../chunk-1ngxm8t2.js";
+import {
+  MARGIN
+} from "../../chunk-831dem4f.js";
+import {
+  ChartManager
+} from "../../chunk-n8ew0z0e.js";
+import"../../chunk-93yrr7er.js";
+import"../../chunk-5gtx3pza.js";
+
+// src/plugins/experimental/stats.ts
+var states = new WeakMap;
+function computeStats(values) {
+  if (values.length === 0)
+    return null;
+  let min = Infinity, max = -Infinity, sum = 0;
+  for (const v of values) {
+    if (v < min)
+      min = v;
+    if (v > max)
+      max = v;
+    sum += v;
+  }
+  const mean = sum / values.length;
+  let variance = 0;
+  for (const v of values) {
+    const d = v - mean;
+    variance += d * d;
+  }
+  const stddev = Math.sqrt(variance / values.length);
+  return { min, max, mean, stddev, count: values.length };
+}
+function updateOverlay(chart, state) {
+  const { overlay, header, body } = state;
+  const dark = ChartManager.isDark;
+  const cfg = chart.config;
+  const bgColor = cfg.bgColor ?? (dark ? [0.11, 0.11, 0.12] : [0.98, 0.98, 0.98]);
+  const rgb = bgColor.map((c) => Math.round(c * 255)).join(",");
+  const panelBg = dark ? `rgba(${rgb},0.92)` : "rgba(255,255,255,0.95)";
+  const border = dark ? "rgba(255,255,255,0.14)" : "rgba(0,0,0,0.10)";
+  const text = cfg.textColor ?? (dark ? "#c0c0c0" : "#333333");
+  const muted = dark ? "#777" : "#aaa";
+  const font = cfg.fontFamily ?? DEFAULT_FONT;
+  const precision = cfg.statsPrecision ?? 2;
+  const fmt = cfg.formatValue ?? ((n) => n.toFixed(precision));
+  const pos = cfg.statsPosition ?? "top-left";
+  overlay.style.display = "block";
+  overlay.style.position = "absolute";
+  overlay.style.pointerEvents = "auto";
+  overlay.style.zIndex = "15";
+  overlay.style.background = panelBg;
+  overlay.style.border = `1px solid ${border}`;
+  overlay.style.borderRadius = "6px";
+  overlay.style.padding = "7px 10px";
+  overlay.style.fontFamily = font;
+  overlay.style.fontSize = "11px";
+  overlay.style.color = text;
+  overlay.style.minWidth = "100px";
+  overlay.style.userSelect = "none";
+  if (!state.dragOffset) {
+    const m = MARGIN;
+    const pad = 6;
+    if (state.customPos) {
+      overlay.style.top = `${state.customPos.y}px`;
+      overlay.style.left = `${state.customPos.x}px`;
+      overlay.style.right = "auto";
+      overlay.style.bottom = "auto";
+    } else {
+      overlay.style.right = "auto";
+      overlay.style.bottom = "auto";
+      overlay.style.top = "auto";
+      overlay.style.left = "auto";
+      if (pos === "top-left") {
+        overlay.style.top = `${m.top + pad}px`;
+        overlay.style.left = `${m.left + pad}px`;
+      }
+      if (pos === "top-right") {
+        overlay.style.top = `${m.top + pad}px`;
+        overlay.style.right = `${m.right + pad}px`;
+        overlay.style.left = "auto";
+      }
+      if (pos === "bottom-left") {
+        overlay.style.bottom = `${m.bottom + pad}px`;
+        overlay.style.left = `${m.left + pad}px`;
+        overlay.style.top = "auto";
+      }
+      if (pos === "bottom-right") {
+        overlay.style.bottom = `${m.bottom + pad}px`;
+        overlay.style.right = `${m.right + pad}px`;
+        overlay.style.top = "auto";
+        overlay.style.left = "auto";
+      }
+    }
+  }
+  if (state.collapsed) {
+    header.innerHTML = `<span style="color:${muted};font-size:10px;font-weight:600;letter-spacing:.04em;cursor:grab">STATS &#9660;</span>`;
+    body.innerHTML = "";
+    return;
+  }
+  const { bounds: b, view: v } = chart;
+  const fullX = b.maxX - b.minX;
+  const visMinX = b.minX + v.panX * fullX;
+  const visMaxX = visMinX + fullX / v.zoomX;
+  const allValues = [];
+  for (const s of chart.series) {
+    let lo = 0, hi = s.rawX.length;
+    while (lo < hi) {
+      const mid = lo + hi >> 1;
+      if (s.rawX[mid] < visMinX)
+        lo = mid + 1;
+      else
+        hi = mid;
+    }
+    const start = lo;
+    lo = 0;
+    hi = s.rawX.length;
+    while (lo < hi) {
+      const mid = lo + hi >> 1;
+      if (s.rawX[mid] <= visMaxX)
+        lo = mid + 1;
+      else
+        hi = mid;
+    }
+    const end = lo;
+    for (let i = start;i < end; i++)
+      allValues.push(s.rawY[i]);
+  }
+  const stats = computeStats(allValues);
+  if (!stats) {
+    overlay.style.display = "none";
+    return;
+  }
+  header.innerHTML = `<div style="margin-bottom:4px"><span style="color:${muted};font-size:10px;font-weight:600;letter-spacing:.04em;cursor:grab">STATS &#9650;</span></div>`;
+  body.innerHTML = `
+    <div style="display:grid;grid-template-columns:auto auto;gap:1px 10px">
+      <span style="color:${muted}">min</span><span>${fmt(stats.min)}</span>
+      <span style="color:${muted}">max</span><span>${fmt(stats.max)}</span>
+      <span style="color:${muted}">avg</span><span>${fmt(stats.mean)}</span>
+      <span style="color:${muted}">&#963;</span><span>${fmt(stats.stddev)}</span>
+      <span style="color:${muted}">n</span><span>${stats.count.toLocaleString()}</span>
+    </div>`;
+}
+var statsPlugin = {
+  name: "stats",
+  install(chart, el) {
+    const ac = new AbortController;
+    const overlay = document.createElement("div");
+    overlay.style.cssText = "position:absolute;pointer-events:auto;z-index:15;";
+    const header = document.createElement("div");
+    const body = document.createElement("div");
+    overlay.appendChild(header);
+    overlay.appendChild(body);
+    el.appendChild(overlay);
+    const state = { overlay, header, body, collapsed: false, abort: ac, dragOffset: null, customPos: null, tiltAngle: 0, tiltVelocity: 0, tiltRafId: null };
+    states.set(chart, state);
+    header.addEventListener("click", () => {
+      state.collapsed = !state.collapsed;
+      updateOverlay(chart, state);
+    }, { signal: ac.signal });
+    overlay.addEventListener("pointerdown", (e) => {
+      e.stopPropagation();
+      if (!state.customPos) {
+        state.customPos = { x: overlay.offsetLeft, y: overlay.offsetTop };
+        overlay.style.left = state.customPos.x + "px";
+        overlay.style.top = state.customPos.y + "px";
+        overlay.style.right = "auto";
+        overlay.style.bottom = "auto";
+      }
+      state.dragOffset = { x: 0, y: 0 };
+      if (state.tiltRafId !== null) {
+        cancelAnimationFrame(state.tiltRafId);
+        state.tiltRafId = null;
+      }
+      overlay.setPointerCapture(e.pointerId);
+      overlay.style.cursor = "grabbing";
+    }, { signal: ac.signal });
+    overlay.addEventListener("pointermove", (e) => {
+      if (!state.dragOffset || !state.customPos)
+        return;
+      const x = Math.max(0, Math.min(state.customPos.x + e.movementX, el.clientWidth - overlay.offsetWidth));
+      const y = Math.max(0, Math.min(state.customPos.y + e.movementY, el.clientHeight - overlay.offsetHeight));
+      state.customPos = { x, y };
+      overlay.style.left = x + "px";
+      overlay.style.top = y + "px";
+      state.tiltVelocity = state.tiltVelocity * 0.6 + e.movementX * 0.4;
+      state.tiltAngle = Math.max(-15, Math.min(15, state.tiltVelocity * 1.5));
+      overlay.style.transform = `rotate(${state.tiltAngle}deg)`;
+    }, { signal: ac.signal });
+    overlay.addEventListener("pointerup", () => {
+      state.dragOffset = null;
+      overlay.style.cursor = "";
+      const decayTilt = () => {
+        state.tiltAngle *= 0.78;
+        state.tiltVelocity *= 0.78;
+        if (Math.abs(state.tiltAngle) > 0.05) {
+          overlay.style.transform = `rotate(${state.tiltAngle}deg)`;
+          state.tiltRafId = requestAnimationFrame(decayTilt);
+        } else {
+          state.tiltAngle = 0;
+          state.tiltVelocity = 0;
+          overlay.style.transform = "";
+          state.tiltRafId = null;
+        }
+      };
+      state.tiltRafId = requestAnimationFrame(decayTilt);
+    }, { signal: ac.signal });
+  },
+  afterDraw(_, chart) {
+    const state = states.get(chart);
+    if (!state)
+      return;
+    updateOverlay(chart, state);
+  },
+  uninstall(chart) {
+    const state = states.get(chart);
+    if (state) {
+      if (state.tiltRafId !== null)
+        cancelAnimationFrame(state.tiltRafId);
+      state.abort.abort();
+      state.overlay.remove();
+      states.delete(chart);
+    }
+  }
+};
+export {
+  statsPlugin
+};

package/dist/plugins/experimental/stats.min.js

@@ -0,0 +1,8 @@
+import{l as V}from"../../chunk-cvtt04m6.js";import{o as N}from"../../chunk-0eh4rzy9.js";import{q as F}from"../../chunk-50bcv2hw.js";import"../../chunk-wdfq2fpx.js";import"../../chunk-bbyt23tw.js";var I=new WeakMap;function p(P){if(P.length===0)return null;let H=1/0,j=-1/0,z=0;for(let J of P){if(J<H)H=J;if(J>j)j=J;z+=J}let Z=z/P.length,Q=0;for(let J of P){let $=J-Z;Q+=$*$}let q=Math.sqrt(Q/P.length);return{min:H,max:j,mean:Z,stddev:q,count:P.length}}function A(P,H){let{overlay:j,header:z,body:Z}=H,Q=F.isDark,q=P.config,$=(q.bgColor??(Q?[0.11,0.11,0.12]:[0.98,0.98,0.98])).map((K)=>Math.round(K*255)).join(","),D=Q?`rgba(${$},0.92)`:"rgba(255,255,255,0.95)",O=Q?"rgba(255,255,255,0.14)":"rgba(0,0,0,0.10)",T=q.textColor??(Q?"#c0c0c0":"#333333"),w=Q?"#777":"#aaa",k=q.fontFamily??V,M=q.statsPrecision??2,E=q.formatValue??((K)=>K.toFixed(M)),G=q.statsPosition??"top-left";if(j.style.display="block",j.style.position="absolute",j.style.pointerEvents="auto",j.style.zIndex="15",j.style.background=D,j.style.border=`1px solid ${O}`,j.style.borderRadius="6px",j.style.padding="7px 10px",j.style.fontFamily=k,j.style.fontSize="11px",j.style.color=T,j.style.minWidth="100px",j.style.userSelect="none",!H.dragOffset){let K=N,Y=6;if(H.customPos)j.style.top=`${H.customPos.y}px`,j.style.left=`${H.customPos.x}px`,j.style.right="auto",j.style.bottom="auto";else{if(j.style.right="auto",j.style.bottom="auto",j.style.top="auto",j.style.left="auto",G==="top-left")j.style.top=`${K.top+6}px`,j.style.left=`${K.left+6}px`;if(G==="top-right")j.style.top=`${K.top+6}px`,j.style.right=`${K.right+6}px`,j.style.left="auto";if(G==="bottom-left")j.style.bottom=`${K.bottom+6}px`,j.style.left=`${K.left+6}px`,j.style.top="auto";if(G==="bottom-right")j.style.bottom=`${K.bottom+6}px`,j.style.right=`${K.right+6}px`,j.style.top="auto",j.style.left="auto"}}if(H.collapsed){z.innerHTML=`<span style="color:${w};font-size:10px;font-weight:600;letter-spacing:.04em;cursor:grab">STATS &#9660;</span>`,Z.innerHTML="";return}let{bounds:L,view:R}=P,S=L.maxX-L.minX,U=L.minX+R.panX*S,X=U+S/R.zoomX,_=[];for(let K of P.series){let Y=0,B=K.rawX.length;while(Y<B){let W=Y+B>>1;if(K.rawX[W]<U)Y=W+1;else B=W}let x=Y;Y=0,B=K.rawX.length;while(Y<B){let W=Y+B>>1;if(K.rawX[W]<=X)Y=W+1;else B=W}let b=Y;for(let W=x;W<b;W++)_.push(K.rawY[W])}let C=p(_);if(!C){j.style.display="none";return}z.innerHTML=`<div style="margin-bottom:4px"><span style="color:${w};font-size:10px;font-weight:600;letter-spacing:.04em;cursor:grab">STATS &#9650;</span></div>`,Z.innerHTML=`
+    <div style="display:grid;grid-template-columns:auto auto;gap:1px 10px">
+      <span style="color:${w}">min</span><span>${E(C.min)}</span>
+      <span style="color:${w}">max</span><span>${E(C.max)}</span>
+      <span style="color:${w}">avg</span><span>${E(C.mean)}</span>
+      <span style="color:${w}">&#963;</span><span>${E(C.stddev)}</span>
+      <span style="color:${w}">n</span><span>${C.count.toLocaleString()}</span>
+    </div>`}var u={name:"stats",install(P,H){let j=new AbortController,z=document.createElement("div");z.style.cssText="position:absolute;pointer-events:auto;z-index:15;";let Z=document.createElement("div"),Q=document.createElement("div");z.appendChild(Z),z.appendChild(Q),H.appendChild(z);let q={overlay:z,header:Z,body:Q,collapsed:!1,abort:j,dragOffset:null,customPos:null,tiltAngle:0,tiltVelocity:0,tiltRafId:null};I.set(P,q),Z.addEventListener("click",()=>{q.collapsed=!q.collapsed,A(P,q)},{signal:j.signal}),z.addEventListener("pointerdown",(J)=>{if(J.stopPropagation(),!q.customPos)q.customPos={x:z.offsetLeft,y:z.offsetTop},z.style.left=q.customPos.x+"px",z.style.top=q.customPos.y+"px",z.style.right="auto",z.style.bottom="auto";if(q.dragOffset={x:0,y:0},q.tiltRafId!==null)cancelAnimationFrame(q.tiltRafId),q.tiltRafId=null;z.setPointerCapture(J.pointerId),z.style.cursor="grabbing"},{signal:j.signal}),z.addEventListener("pointermove",(J)=>{if(!q.dragOffset||!q.customPos)return;let $=Math.max(0,Math.min(q.customPos.x+J.movementX,H.clientWidth-z.offsetWidth)),D=Math.max(0,Math.min(q.customPos.y+J.movementY,H.clientHeight-z.offsetHeight));q.customPos={x:$,y:D},z.style.left=$+"px",z.style.top=D+"px",q.tiltVelocity=q.tiltVelocity*0.6+J.movementX*0.4,q.tiltAngle=Math.max(-15,Math.min(15,q.tiltVelocity*1.5)),z.style.transform=`rotate(${q.tiltAngle}deg)`},{signal:j.signal}),z.addEventListener("pointerup",()=>{q.dragOffset=null,z.style.cursor="";let J=()=>{if(q.tiltAngle*=0.78,q.tiltVelocity*=0.78,Math.abs(q.tiltAngle)>0.05)z.style.transform=`rotate(${q.tiltAngle}deg)`,q.tiltRafId=requestAnimationFrame(J);else q.tiltAngle=0,q.tiltVelocity=0,z.style.transform="",q.tiltRafId=null};q.tiltRafId=requestAnimationFrame(J)},{signal:j.signal})},afterDraw(P,H){let j=I.get(H);if(!j)return;A(H,j)},uninstall(P){let H=I.get(P);if(H){if(H.tiltRafId!==null)cancelAnimationFrame(H.tiltRafId);H.abort.abort(),H.overlay.remove(),I.delete(P)}}};export{u as statsPlugin};

package/dist/plugins/experimental/threshold.js

@@ -0,0 +1,96 @@
+import {
+  dataToScreen
+} from "../../chunk-mmsy3yqt.js";
+import {
+  DEFAULT_FONT
+} from "../../chunk-1ngxm8t2.js";
+import {
+  MARGIN
+} from "../../chunk-831dem4f.js";
+import {
+  ChartManager
+} from "../../chunk-n8ew0z0e.js";
+import"../../chunk-93yrr7er.js";
+import"../../chunk-5gtx3pza.js";
+
+// src/plugins/experimental/threshold.ts
+var thresholdPlugin = {
+  name: "threshold",
+  beforeDraw(ctx, chart) {
+    const cfg = chart.config;
+    const thresholds = cfg.thresholds;
+    if (!thresholds?.length)
+      return;
+    const w = chart.width;
+    const h = chart.height;
+    const m = MARGIN;
+    for (const threshold of thresholds) {
+      if (!threshold.fillAbove && !threshold.fillBelow)
+        continue;
+      const sy = dataToScreen(0, threshold.y, chart, w, h).y;
+      ctx.save();
+      ctx.beginPath();
+      ctx.rect(m.left, m.top, w - m.left - m.right, h - m.top - m.bottom);
+      ctx.clip();
+      if (threshold.fillAbove) {
+        ctx.fillStyle = threshold.fillAbove;
+        ctx.fillRect(m.left, m.top, w - m.left - m.right, sy - m.top);
+      }
+      if (threshold.fillBelow) {
+        ctx.fillStyle = threshold.fillBelow;
+        ctx.fillRect(m.left, sy, w - m.left - m.right, h - m.bottom - sy);
+      }
+      ctx.restore();
+    }
+  },
+  afterDraw(ctx, chart) {
+    const cfg = chart.config;
+    const thresholds = cfg.thresholds;
+    if (!thresholds?.length)
+      return;
+    const w = chart.width;
+    const h = chart.height;
+    const m = MARGIN;
+    const dark = ChartManager.isDark;
+    const fontFamily = cfg.fontFamily ?? DEFAULT_FONT;
+    for (const threshold of thresholds) {
+      const sy = dataToScreen(0, threshold.y, chart, w, h).y;
+      if (sy < m.top || sy > h - m.bottom)
+        continue;
+      ctx.save();
+      ctx.strokeStyle = threshold.color;
+      ctx.lineWidth = threshold.lineWidth ?? 1.5;
+      ctx.setLineDash(threshold.dash ?? [5, 3]);
+      ctx.beginPath();
+      ctx.moveTo(m.left, sy);
+      ctx.lineTo(w - m.right, sy);
+      ctx.stroke();
+      ctx.restore();
+      if (threshold.label) {
+        ctx.save();
+        ctx.font = `600 10px ${fontFamily}`;
+        const tw = ctx.measureText(threshold.label).width;
+        const pw = tw + 10;
+        const ph = 17;
+        const px = w - m.right - pw - 4;
+        const py = sy - ph / 2;
+        ctx.beginPath();
+        ctx.roundRect(px, py, pw, ph, 3);
+        ctx.fillStyle = dark ? "rgba(20,20,22,0.88)" : "rgba(255,255,255,0.92)";
+        ctx.fill();
+        ctx.strokeStyle = threshold.color;
+        ctx.lineWidth = 1;
+        ctx.setLineDash([]);
+        ctx.stroke();
+        ctx.fillStyle = threshold.color;
+        ctx.textAlign = "left";
+        ctx.textBaseline = "middle";
+        ctx.fillText(threshold.label, px + 5, sy);
+        ctx.restore();
+      }
+    }
+  }
+};
+export {
+  thresholdPlugin
+};

package/dist/plugins/experimental/threshold.min.js

@@ -0,0 +1 @@
+import{j as d}from"../../chunk-cbydth3q.js";import{l as C}from"../../chunk-cvtt04m6.js";import{o as g}from"../../chunk-0eh4rzy9.js";import{q as y}from"../../chunk-50bcv2hw.js";import"../../chunk-wdfq2fpx.js";import"../../chunk-bbyt23tw.js";var S={name:"threshold",beforeDraw(e,l){let h=l.config.thresholds;if(!h?.length)return;let{width:r,height:n}=l,o=g;for(let t of h){if(!t.fillAbove&&!t.fillBelow)continue;let f=d(0,t.y,l,r,n).y;if(e.save(),e.beginPath(),e.rect(o.left,o.top,r-o.left-o.right,n-o.top-o.bottom),e.clip(),t.fillAbove)e.fillStyle=t.fillAbove,e.fillRect(o.left,o.top,r-o.left-o.right,f-o.top);if(t.fillBelow)e.fillStyle=t.fillBelow,e.fillRect(o.left,f,r-o.left-o.right,n-o.bottom-f);e.restore()}},afterDraw(e,l){let a=l.config,h=a.thresholds;if(!h?.length)return;let{width:r,height:n}=l,o=g,t=y.isDark,f=a.fontFamily??C;for(let i of h){let s=d(0,i.y,l,r,n).y;if(s<o.top||s>n-o.bottom)continue;if(e.save(),e.strokeStyle=i.color,e.lineWidth=i.lineWidth??1.5,e.setLineDash(i.dash??[5,3]),e.beginPath(),e.moveTo(o.left,s),e.lineTo(r-o.right,s),e.stroke(),e.restore(),i.label){e.save(),e.font=`600 10px ${f}`;let m=e.measureText(i.label).width+10,p=17,b=r-o.right-m-4,u=s-p/2;e.beginPath(),e.roundRect(b,u,m,p,3),e.fillStyle=t?"rgba(20,20,22,0.88)":"rgba(255,255,255,0.92)",e.fill(),e.strokeStyle=i.color,e.lineWidth=1,e.setLineDash([]),e.stroke(),e.fillStyle=i.color,e.textAlign="left",e.textBaseline="middle",e.fillText(i.label,b+5,s),e.restore()}}}};export{S as thresholdPlugin};

package/dist/plugins/experimental/tooltip-pin.js

@@ -0,0 +1,177 @@
+import {
+  dataToScreen,
+  screenToData
+} from "../../chunk-mmsy3yqt.js";
+import {
+  DEFAULT_FONT
+} from "../../chunk-1ngxm8t2.js";
+import {
+  MARGIN
+} from "../../chunk-831dem4f.js";
+import {
+  ChartManager
+} from "../../chunk-n8ew0z0e.js";
+import"../../chunk-93yrr7er.js";
+import"../../chunk-5gtx3pza.js";
+
+// src/plugins/experimental/tooltip-pin.ts
+var states = new WeakMap;
+var MAX_PIN_PX = 30;
+function findNearestPin(chart, screenX, screenY, width, height) {
+  if (chart.series.length === 0)
+    return null;
+  const { x: dataX, y: dataY } = screenToData(screenX, screenY, chart, width, height);
+  let bestSi = -1;
+  let bestIdx = -1;
+  let bestDx = Infinity;
+  let bestDy = Infinity;
+  for (let s = 0;s < chart.series.length; s++) {
+    const sr2 = chart.series[s];
+    const n = sr2.rawX.length;
+    if (n === 0)
+      continue;
+    let lo = 0, hi = n - 1;
+    while (lo < hi) {
+      const mid = lo + hi >> 1;
+      if (sr2.rawX[mid] < dataX)
+        lo = mid + 1;
+      else
+        hi = mid;
+    }
+    let idx = lo;
+    if (lo > 0 && Math.abs(sr2.rawX[lo - 1] - dataX) < Math.abs(sr2.rawX[lo] - dataX)) {
+      idx = lo - 1;
+    }
+    const dx = Math.abs(sr2.rawX[idx] - dataX);
+    const dy = Math.abs(sr2.rawY[idx] - dataY);
+    if (dx < bestDx || dx === bestDx && dy < bestDy) {
+      bestDx = dx;
+      bestDy = dy;
+      bestSi = s;
+      bestIdx = idx;
+    }
+  }
+  if (bestSi === -1)
+    return null;
+  const sr = chart.series[bestSi];
+  const { x: candidateSx, y: candidateSy } = dataToScreen(sr.rawX[bestIdx], sr.rawY[bestIdx], chart, width, height);
+  if (Math.hypot(candidateSx - screenX, candidateSy - screenY) > MAX_PIN_PX)
+    return null;
+  return {
+    dataX: sr.rawX[bestIdx],
+    dataY: sr.rawY[bestIdx],
+    seriesIndex: bestSi,
+    seriesLabel: sr.label,
+    color: sr.color
+  };
+}
+var tooltipPinPlugin = {
+  name: "tooltip-pin",
+  install(chart, el) {
+    const ac = new AbortController;
+    const state = { pins: [], abort: ac };
+    states.set(chart, state);
+    el.addEventListener("click", (e) => {
+      if (chart.dragging)
+        return;
+      const r = el.getBoundingClientRect();
+      const sx = e.clientX - r.left;
+      const sy = e.clientY - r.top;
+      for (let i = state.pins.length - 1;i >= 0; i--) {
+        const pin = state.pins[i];
+        const { x: pinSx, y: pinSy } = dataToScreen(pin.dataX, pin.dataY, chart, r.width, r.height);
+        if (Math.hypot(pinSx - sx, pinSy - sy) < 20) {
+          state.pins.splice(i, 1);
+          e.preventDefault();
+          ChartManager.drawChart(chart);
+          return;
+        }
+      }
+      const nearest = findNearestPin(chart, sx, sy, r.width, r.height);
+      if (!nearest)
+        return;
+      e.preventDefault();
+      const cfg = chart.config;
+      const maxPins = cfg.pinMax ?? 5;
+      if (state.pins.length >= maxPins)
+        state.pins.shift();
+      state.pins.push(nearest);
+      ChartManager.drawChart(chart);
+    }, { signal: ac.signal });
+  },
+  afterDraw(ctx, chart) {
+    const state = states.get(chart);
+    if (!state || state.pins.length === 0)
+      return;
+    const w = chart.width;
+    const h = chart.height;
+    const m = MARGIN;
+    const dark = ChartManager.isDark;
+    const cfg = chart.config;
+    const formatX = cfg.formatX ?? String;
+    const formatY = cfg.formatY ?? String;
+    const fontFamily = cfg.fontFamily ?? DEFAULT_FONT;
+    ctx.save();
+    ctx.font = `500 10px ${fontFamily}`;
+    for (const pin of state.pins) {
+      const { x: pinSx, y: pinSy } = dataToScreen(pin.dataX, pin.dataY, chart, w, h);
+      const colRgb = `${Math.round(pin.color.r * 255)},${Math.round(pin.color.g * 255)},${Math.round(pin.color.b * 255)}`;
+      const col = `rgb(${colRgb})`;
+      ctx.save();
+      ctx.setLineDash([4, 3]);
+      ctx.strokeStyle = `rgba(${colRgb},0.4)`;
+      ctx.lineWidth = 1;
+      ctx.beginPath();
+      ctx.moveTo(pinSx, m.top);
+      ctx.lineTo(pinSx, h - m.bottom);
+      ctx.stroke();
+      ctx.restore();
+      ctx.beginPath();
+      ctx.arc(pinSx, pinSy, 5, 0, Math.PI * 2);
+      ctx.fillStyle = col;
+      ctx.fill();
+      ctx.strokeStyle = dark ? "rgba(0,0,0,0.5)" : "rgba(255,255,255,0.8)";
+      ctx.lineWidth = 1.5;
+      ctx.stroke();
+      const xLabel = formatX(pin.dataX);
+      const yLabel = `${pin.seriesLabel}: ${formatY(pin.dataY)}`;
+      ctx.font = `500 10px ${fontFamily}`;
+      const cardW = Math.max(ctx.measureText(xLabel).width, ctx.measureText(yLabel).width) + 20;
+      const cardH = 14 + 2 * 17;
+      let bx = pinSx + 10;
+      let by = pinSy - cardH - 8;
+      if (bx + cardW > w)
+        bx = pinSx - cardW - 10;
+      by = Math.max(m.top + 4, Math.min(h - m.bottom - cardH - 4, by));
+      ctx.beginPath();
+      ctx.roundRect(bx, by, cardW, cardH, 5);
+      ctx.fillStyle = dark ? "rgba(28,28,30,0.94)" : "rgba(255,255,255,0.96)";
+      ctx.fill();
+      ctx.strokeStyle = `rgba(${colRgb},0.4)`;
+      ctx.lineWidth = 1.5;
+      ctx.stroke();
+      ctx.fillStyle = col;
+      ctx.beginPath();
+      ctx.roundRect(bx, by, cardW, 3, [5, 5, 0, 0]);
+      ctx.fill();
+      ctx.font = `500 10px ${fontFamily}`;
+      ctx.textAlign = "left";
+      ctx.textBaseline = "middle";
+      ctx.fillStyle = dark ? "#888" : "#999";
+      ctx.fillText(xLabel, bx + 10, by + 10);
+      ctx.fillStyle = dark ? "#eee" : "#1a1a1a";
+      ctx.fillText(yLabel, bx + 10, by + 27);
+    }
+    ctx.restore();
+  },
+  uninstall(chart) {
+    const state = states.get(chart);
+    if (state) {
+      state.abort.abort();
+      states.delete(chart);
+    }
+  }
+};
+export {
+  tooltipPinPlugin
+};

package/dist/plugins/experimental/tooltip-pin.min.js

@@ -0,0 +1 @@
+import{j as X,k as $}from"../../chunk-cbydth3q.js";import{l as I}from"../../chunk-cvtt04m6.js";import{o as Y}from"../../chunk-0eh4rzy9.js";import{q as c}from"../../chunk-50bcv2hw.js";import"../../chunk-wdfq2fpx.js";import"../../chunk-bbyt23tw.js";var M=new WeakMap,k=30;function D(t,i,d,o,r){if(t.series.length===0)return null;let{x:e,y:p}=$(i,d,t,o,r),a=-1,l=-1,C=1/0,h=1/0;for(let g=0;g<t.series.length;g++){let m=t.series[g],S=m.rawX.length;if(S===0)continue;let s=0,y=S-1;while(s<y){let T=s+y>>1;if(m.rawX[T]<e)s=T+1;else y=T}let P=s;if(s>0&&Math.abs(m.rawX[s-1]-e)<Math.abs(m.rawX[s]-e))P=s-1;let b=Math.abs(m.rawX[P]-e),u=Math.abs(m.rawY[P]-p);if(b<C||b===C&&u<h)C=b,h=u,a=g,l=P}if(a===-1)return null;let n=t.series[a],{x:f,y:w}=X(n.rawX[l],n.rawY[l],t,o,r);if(Math.hypot(f-i,w-d)>k)return null;return{dataX:n.rawX[l],dataY:n.rawY[l],seriesIndex:a,seriesLabel:n.label,color:n.color}}var F={name:"tooltip-pin",install(t,i){let d=new AbortController,o={pins:[],abort:d};M.set(t,o),i.addEventListener("click",(r)=>{if(t.dragging)return;let e=i.getBoundingClientRect(),p=r.clientX-e.left,a=r.clientY-e.top;for(let n=o.pins.length-1;n>=0;n--){let f=o.pins[n],{x:w,y:g}=X(f.dataX,f.dataY,t,e.width,e.height);if(Math.hypot(w-p,g-a)<20){o.pins.splice(n,1),r.preventDefault(),c.drawChart(t);return}}let l=D(t,p,a,e.width,e.height);if(!l)return;r.preventDefault();let h=t.config.pinMax??5;if(o.pins.length>=h)o.pins.shift();o.pins.push(l),c.drawChart(t)},{signal:d.signal})},afterDraw(t,i){let d=M.get(i);if(!d||d.pins.length===0)return;let{width:o,height:r}=i,e=Y,p=c.isDark,a=i.config,l=a.formatX??String,C=a.formatY??String,h=a.fontFamily??I;t.save(),t.font=`500 10px ${h}`;for(let n of d.pins){let{x:f,y:w}=X(n.dataX,n.dataY,i,o,r),g=`${Math.round(n.color.r*255)},${Math.round(n.color.g*255)},${Math.round(n.color.b*255)}`,m=`rgb(${g})`;t.save(),t.setLineDash([4,3]),t.strokeStyle=`rgba(${g},0.4)`,t.lineWidth=1,t.beginPath(),t.moveTo(f,e.top),t.lineTo(f,r-e.bottom),t.stroke(),t.restore(),t.beginPath(),t.arc(f,w,5,0,Math.PI*2),t.fillStyle=m,t.fill(),t.strokeStyle=p?"rgba(0,0,0,0.5)":"rgba(255,255,255,0.8)",t.lineWidth=1.5,t.stroke();let S=l(n.dataX),s=`${n.seriesLabel}: ${C(n.dataY)}`;t.font=`500 10px ${h}`;let y=Math.max(t.measureText(S).width,t.measureText(s).width)+20,P=48,b=f+10,u=w-P-8;if(b+y>o)b=f-y-10;u=Math.max(e.top+4,Math.min(r-e.bottom-P-4,u)),t.beginPath(),t.roundRect(b,u,y,P,5),t.fillStyle=p?"rgba(28,28,30,0.94)":"rgba(255,255,255,0.96)",t.fill(),t.strokeStyle=`rgba(${g},0.4)`,t.lineWidth=1.5,t.stroke(),t.fillStyle=m,t.beginPath(),t.roundRect(b,u,y,3,[5,5,0,0]),t.fill(),t.font=`500 10px ${h}`,t.textAlign="left",t.textBaseline="middle",t.fillStyle=p?"#888":"#999",t.fillText(S,b+10,u+10),t.fillStyle=p?"#eee":"#1a1a1a",t.fillText(s,b+10,u+27)}t.restore()},uninstall(t){let i=M.get(t);if(i)i.abort.abort(),M.delete(t)}};export{F as tooltipPinPlugin};