minerva-design 1.1.0 → 1.2.0

package/dist/charts/react/Chart.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Chart.cjs","names":["useRef","createChart","require_chart","react","react_jsx_runtime","size","value","fallback","engineOptions","props","ChartBase","handlers","containerRef","chartRef","handlersRef","optionsRef","options","container","chart","offs","v","r","off","handleRef","view","width","height","style","Chart","ref"],"sources":["../../../../charts/src/react/Chart.tsx"],"sourcesContent":["import {\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  type CSSProperties,\n} from \"react\";\nimport { createChart } from \"../engine/chart\";\nimport type {\n  ChartHoverEvent,\n  ChartInstance,\n  ChartOptions,\n  ChartRendererKind,\n  ChartView,\n} from \"../engine/types\";\nimport type { ChartCommonProps, ChartProps } from \"./types\";\n\ninterface Handlers {\n  onHover?: (event: ChartHoverEvent | null) => void;\n  onPointClick?: (event: ChartHoverEvent) => void;\n  onZoom?: (view: ChartView) => void;\n  onRendererChange?: (renderer: ChartRendererKind) => void;\n}\n\nconst size = (value: number | string | undefined, fallback: string) =>\n  value === undefined\n    ? fallback\n    : typeof value === \"number\"\n      ? `${value}px`\n      : value;\n\n/** Engine options of the common props */\nexport const engineOptions = (\n  props: Omit<ChartCommonProps, \"onPointClick\"> & Pick<ChartOptions, \"series\">,\n): ChartOptions => ({\n  series: props.series,\n  xAxis: props.xAxis,\n  yAxis: props.yAxis,\n  renderer: props.renderer,\n  legend: props.legend,\n  tooltip: props.tooltip,\n  crosshair: props.crosshair,\n  annotations: props.annotations,\n  interaction: props.interaction,\n  padding: props.padding,\n  palette: props.palette,\n  ariaLabel: props.ariaLabel,\n});\n\ninterface ChartBaseProps extends Handlers {\n  options: ChartOptions;\n  height?: number | string;\n  width?: number | string;\n  className?: string;\n  style?: CSSProperties;\n  handleRef?: ChartCommonProps[\"ref\"];\n}\n\n/** Mounts the engine in a sized <div> and forwards option / handler changes */\nexport function ChartBase({\n  options,\n  height,\n  width,\n  className,\n  style,\n  handleRef,\n  ...handlers\n}: ChartBaseProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const chartRef = useRef<ChartInstance | null>(null);\n  const handlersRef = useRef<Handlers>(handlers);\n  const optionsRef = useRef(options);\n\n  useEffect(() => {\n    handlersRef.current = handlers;\n  });\n\n  useEffect(() => {\n    const container = containerRef.current;\n    if (!container) return;\n    const chart = createChart(container, optionsRef.current);\n    chartRef.current = chart;\n    const offs = [\n      chart.on(\"hover\", (e) => handlersRef.current.onHover?.(e)),\n      chart.on(\"click\", (e) => handlersRef.current.onPointClick?.(e)),\n      chart.on(\"zoom\", (v) => handlersRef.current.onZoom?.(v)),\n      chart.on(\"renderer\", (r) => handlersRef.current.onRendererChange?.(r)),\n    ];\n    return () => {\n      offs.forEach((off) => off());\n      chart.destroy();\n      chartRef.current = null;\n    };\n  }, []);\n\n  useEffect(() => {\n    if (optionsRef.current === options) return;\n    optionsRef.current = options;\n    chartRef.current?.setOptions(options);\n  }, [options]);\n\n  useImperativeHandle(\n    handleRef,\n    () => ({\n      resetZoom: () => chartRef.current?.resetZoom(),\n      getView: () => chartRef.current?.getView() ?? null,\n      setView: (view) => chartRef.current?.setView(view),\n      getRenderer: () => chartRef.current?.getRenderer() ?? null,\n      getInstance: () => chartRef.current,\n    }),\n    [],\n  );\n\n  return (\n    <div\n      ref={containerRef}\n      className={className}\n      style={{\n        position: \"relative\",\n        width: size(width, \"100%\"),\n        height: size(height, \"320px\"),\n        ...style,\n      }}\n    />\n  );\n}\n\n/**\n * GPU chart (WebGPU, then WebGL2, then Canvas2D) mixing line, area, bar and\n * scatter series; zoomable, keyboard accessible and themed by the Minerva\n * CSS variables.\n */\nexport function Chart(props: ChartProps) {\n  const {\n    height,\n    width,\n    className,\n    style,\n    ref,\n    onHover,\n    onPointClick,\n    onZoom,\n    onRendererChange,\n  } = props;\n  return (\n    <ChartBase\n      options={engineOptions(props)}\n      height={height}\n      width={width}\n      className={className}\n      style={style}\n      handleRef={ref}\n      onHover={onHover}\n      onPointClick={onPointClick}\n      onZoom={onZoom}\n      onRendererChange={onRendererChange}\n    />\n  );\n}\n"],"mappings":"0GAuBA,IAAMK,GAAQ,EAAoC,IAChDC,IAAU,IAAA,GACNC,EACA,OAAOD,GAAU,SACf,GAAGA,EAAM,IACTA,EAGKE,EACX,IACkB,CAClB,OAAQC,EAAM,OACd,MAAOA,EAAM,MACb,MAAOA,EAAM,MACb,SAAUA,EAAM,SAChB,OAAQA,EAAM,OACd,QAASA,EAAM,QACf,UAAWA,EAAM,UACjB,YAAaA,EAAM,YACnB,YAAaA,EAAM,YACnB,QAASA,EAAM,QACf,QAASA,EAAM,QACf,UAAWA,EAAM,SACnB,GAYA,SAAgBC,EAAU,CACxB,UACA,SACA,QACA,YACA,QACA,YACA,GAAGC,GACc,CACjB,IAAMC,GAAA,EAAeZ,EAAAA,OAAAA,CAAuB,IAAI,EAC1Ca,GAAA,EAAWb,EAAAA,OAAAA,CAA6B,IAAI,EAC5Cc,GAAA,EAAcd,EAAAA,OAAAA,CAAiBW,CAAQ,EACvCI,GAAA,EAAaf,EAAAA,OAAAA,CAAOgB,CAAO,EA0CjC,OAxCA,EAAAb,EAAA,UAAA,KAAgB,CACd,EAAY,QAAUQ,CACxB,CAAC,GAED,EAAAR,EAAA,UAAA,KAAgB,CACd,IAAMc,EAAYL,EAAa,QAC/B,GAAI,CAACK,EAAW,OAChB,IAAMC,EAAQjB,EAAAA,YAAYgB,EAAWF,EAAW,OAAO,EACvD,EAAS,QAAUG,EACnB,IAAMC,EAAO,CACXD,EAAM,GAAG,QAAU,GAAMJ,EAAY,QAAQ,UAAU,CAAC,CAAC,EACzDI,EAAM,GAAG,QAAU,GAAMJ,EAAY,QAAQ,eAAe,CAAC,CAAC,EAC9DI,EAAM,GAAG,OAAS,GAAMJ,EAAY,QAAQ,SAASM,CAAC,CAAC,EACvDF,EAAM,GAAG,WAAa,GAAMJ,EAAY,QAAQ,mBAAmBO,CAAC,CAAC,CACvE,EACA,UAAa,CACXF,EAAK,QAAS,GAAQG,EAAI,CAAC,EAC3BJ,EAAM,QAAQ,EACd,EAAS,QAAU,IACrB,CACF,EAAG,CAAC,CAAC,GAEL,EAAAf,EAAA,UAAA,KAAgB,CACVY,EAAW,UAAYC,IAC3B,EAAW,QAAUA,EACrBH,EAAS,SAAS,WAAWG,CAAO,EACtC,EAAG,CAACA,CAAO,CAAC,GAEZ,EAAAb,EAAA,oBAAA,CACEoB,OACO,CACL,cAAiBV,EAAS,SAAS,UAAU,EAC7C,YAAeA,EAAS,SAAS,QAAQ,GAAK,KAC9C,QAAU,GAASA,EAAS,SAAS,QAAQW,CAAI,EACjD,gBAAmBX,EAAS,SAAS,YAAY,GAAK,KACtD,gBAAmBA,EAAS,OAC9B,GACA,CAAC,CACH,GAGE,EAAAT,EAAA,IAAA,CAAC,MAAD,CACE,IAAKQ,EACM,YACX,MAAO,CACL,SAAU,WACV,MAAOP,EAAKoB,EAAO,MAAM,EACzB,OAAQpB,EAAKqB,EAAQ,OAAO,EAC5B,GAAGC,CACL,CACD,CAAA,CAEL,CAOA,SAAgBC,EAAM,EAAmB,CACvC,GAAM,CACJ,SACA,QACA,YACA,QACA,MACA,UACA,eACA,SACA,oBACEnB,EACJ,OACE,EAAAL,EAAA,IAAA,CAACM,EAAD,CACE,QAASF,EAAcC,CAAK,EACpB,SACD,QACI,YACJ,QACP,UAAWoB,EACF,UACK,eACN,SACU,kBACnB,CAAA,CAEL"}
+{"version":3,"file":"Chart.cjs","names":["useRef","useState","useMemo","createChart","createPortal","require_chart","react","react_dom","react_jsx_runtime","size","value","fallback","engineOptions","props","ChartBase","handlers","containerRef","chartRef","handlersRef","tooltipRef","renderTooltip","tipEvent","setTipEvent","plot","setPlot","tipHost","resolved","options","base","event","optionsRef","container","chart","offs","v","r","rect","off","handleRef","view","width","height","style","overlay","Chart","ref"],"sources":["../../../../charts/src/react/Chart.tsx"],"sourcesContent":["import {\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n  type CSSProperties,\n  type ReactNode,\n} from \"react\";\nimport { createPortal, flushSync } from \"react-dom\";\nimport { createChart } from \"../engine/chart\";\nimport type {\n  ChartDragEvent,\n  ChartHoverEvent,\n  ChartInstance,\n  ChartOptions,\n  ChartPlotClickEvent,\n  ChartRect,\n  ChartRendererKind,\n  ChartView,\n} from \"../engine/types\";\nimport type { ChartCommonProps, ChartProps } from \"./types\";\n\ninterface Handlers {\n  onHover?: (event: ChartHoverEvent | null) => void;\n  onPointClick?: (event: ChartHoverEvent) => void;\n  onPlotClick?: (event: ChartPlotClickEvent) => void;\n  onZoom?: (view: ChartView) => void;\n  onRendererChange?: (renderer: ChartRendererKind) => void;\n  onDrag?: (event: ChartDragEvent) => void;\n  onDrop?: (event: ChartDragEvent) => void;\n}\n\nconst size = (value: number | string | undefined, fallback: string) =>\n  value === undefined\n    ? fallback\n    : typeof value === \"number\"\n      ? `${value}px`\n      : value;\n\n/** Engine options of the common props */\nexport const engineOptions = (\n  props: Pick<\n    ChartCommonProps,\n    | \"xAxis\"\n    | \"yAxis\"\n    | \"renderer\"\n    | \"legend\"\n    | \"tooltip\"\n    | \"crosshair\"\n    | \"annotations\"\n    | \"interaction\"\n    | \"padding\"\n    | \"palette\"\n    | \"ariaLabel\"\n  > &\n    Pick<ChartOptions, \"series\">,\n): ChartOptions => ({\n  series: props.series,\n  xAxis: props.xAxis,\n  yAxis: props.yAxis,\n  renderer: props.renderer,\n  legend: props.legend,\n  tooltip: props.tooltip,\n  crosshair: props.crosshair,\n  annotations: props.annotations,\n  interaction: props.interaction,\n  padding: props.padding,\n  palette: props.palette,\n  ariaLabel: props.ariaLabel,\n});\n\ninterface ChartBaseProps extends Handlers {\n  options: ChartOptions;\n  height?: number | string;\n  width?: number | string;\n  className?: string;\n  style?: CSSProperties;\n  handleRef?: ChartCommonProps[\"ref\"];\n  /** React content of the tooltip (replaces the engine's content) */\n  renderTooltip?: (event: ChartHoverEvent) => ReactNode;\n  /** React content placed over the chart, given the plot area */\n  overlay?: (plot: ChartRect) => ReactNode;\n}\n\n/** Mounts the engine in a sized <div> and forwards option / handler changes */\nexport function ChartBase({\n  options,\n  height,\n  width,\n  className,\n  style,\n  handleRef,\n  renderTooltip,\n  overlay,\n  ...handlers\n}: ChartBaseProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const chartRef = useRef<ChartInstance | null>(null);\n  const handlersRef = useRef<Handlers>(handlers);\n  const tooltipRef = useRef(renderTooltip);\n  const [tipEvent, setTipEvent] = useState<ChartHoverEvent | null>(null);\n  const [plot, setPlot] = useState<ChartRect | null>(null);\n  const tipHost = useMemo(\n    () =>\n      typeof document === \"undefined\" ? null : document.createElement(\"div\"),\n    [],\n  );\n\n  const resolved = useMemo((): ChartOptions => {\n    if (!renderTooltip || !tipHost || options.tooltip === false) return options;\n    const base = typeof options.tooltip === \"object\" ? options.tooltip : {};\n    return {\n      ...options,\n      tooltip: {\n        ...base,\n        render: (event) => {\n          if (!tooltipRef.current) return null;\n          // render synchronously so the engine measures the final size\n          flushSync(() => setTipEvent(event));\n          return tipHost;\n        },\n      },\n    };\n  }, [options, renderTooltip, tipHost]);\n  const optionsRef = useRef(resolved);\n\n  useEffect(() => {\n    handlersRef.current = handlers;\n    tooltipRef.current = renderTooltip;\n  });\n\n  useEffect(() => {\n    const container = containerRef.current;\n    if (!container) return;\n    const chart = createChart(container, optionsRef.current);\n    chartRef.current = chart;\n    const offs = [\n      chart.on(\"hover\", (e) => handlersRef.current.onHover?.(e)),\n      chart.on(\"click\", (e) => handlersRef.current.onPointClick?.(e)),\n      chart.on(\"plotClick\", (e) => handlersRef.current.onPlotClick?.(e)),\n      chart.on(\"zoom\", (v) => handlersRef.current.onZoom?.(v)),\n      chart.on(\"renderer\", (r) => handlersRef.current.onRendererChange?.(r)),\n      chart.on(\"drag\", (e) => handlersRef.current.onDrag?.(e)),\n      chart.on(\"drop\", (e) => handlersRef.current.onDrop?.(e)),\n      chart.on(\"layout\", (rect) => setPlot(rect)),\n    ];\n    return () => {\n      offs.forEach((off) => off());\n      chart.destroy();\n      chartRef.current = null;\n    };\n  }, []);\n\n  useEffect(() => {\n    if (optionsRef.current === resolved) return;\n    optionsRef.current = resolved;\n    chartRef.current?.setOptions(resolved);\n  }, [resolved]);\n\n  useImperativeHandle(\n    handleRef,\n    () => ({\n      resetZoom: () => chartRef.current?.resetZoom(),\n      getView: () => chartRef.current?.getView() ?? null,\n      setView: (view) => chartRef.current?.setView(view),\n      getRenderer: () => chartRef.current?.getRenderer() ?? null,\n      getInstance: () => chartRef.current,\n    }),\n    [],\n  );\n\n  return (\n    <div\n      className={className}\n      style={{\n        position: \"relative\",\n        width: size(width, \"100%\"),\n        height: size(height, \"320px\"),\n        ...style,\n      }}\n    >\n      <div ref={containerRef} style={{ position: \"absolute\", inset: 0 }} />\n      {overlay && plot && (\n        <div\n          className=\"minerva-chart-overlay\"\n          style={{\n            position: \"absolute\",\n            left: plot.x,\n            top: plot.y,\n            width: plot.width,\n            height: plot.height,\n            pointerEvents: \"none\",\n          }}\n        >\n          {overlay(plot)}\n        </div>\n      )}\n      {tipHost &&\n        tipEvent &&\n        renderTooltip &&\n        createPortal(renderTooltip(tipEvent), tipHost)}\n    </div>\n  );\n}\n\n/**\n * GPU chart (WebGPU, then WebGL2, then Canvas2D) mixing line, area, bar and\n * scatter series; zoomable, keyboard accessible and themed by the Minerva\n * CSS variables.\n */\nexport function Chart(props: ChartProps) {\n  const {\n    height,\n    width,\n    className,\n    style,\n    ref,\n    onHover,\n    onPointClick,\n    onPlotClick,\n    onZoom,\n    onRendererChange,\n    renderTooltip,\n  } = props;\n  return (\n    <ChartBase\n      options={engineOptions(props)}\n      height={height}\n      width={width}\n      className={className}\n      style={style}\n      handleRef={ref}\n      onHover={onHover}\n      onPointClick={onPointClick}\n      onPlotClick={onPlotClick}\n      onZoom={onZoom}\n      onRendererChange={onRendererChange}\n      renderTooltip={renderTooltip}\n    />\n  );\n}\n"],"mappings":"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"}

package/dist/charts/react/Chart.d.cts

@@ -1,14 +1,17 @@
-import { CSSProperties } from 'react';
-import { ChartHoverEvent, ChartOptions, ChartRendererKind, ChartView } from '../engine/types.cjs';
+import { CSSProperties, ReactNode } from 'react';
+import { ChartDragEvent, ChartHoverEvent, ChartOptions, ChartPlotClickEvent, ChartRect, ChartRendererKind, ChartView } from '../engine/types.cjs';
 import { ChartCommonProps, ChartProps } from './types.cjs';
 interface Handlers {
     onHover?: (event: ChartHoverEvent | null) => void;
     onPointClick?: (event: ChartHoverEvent) => void;
+    onPlotClick?: (event: ChartPlotClickEvent) => void;
     onZoom?: (view: ChartView) => void;
     onRendererChange?: (renderer: ChartRendererKind) => void;
+    onDrag?: (event: ChartDragEvent) => void;
+    onDrop?: (event: ChartDragEvent) => void;
 }
 /** Engine options of the common props */
-export declare const engineOptions: (props: Omit<ChartCommonProps, "onPointClick"> & Pick<ChartOptions, "series">) => ChartOptions;
+export declare const engineOptions: (props: Pick<ChartCommonProps, "xAxis" | "yAxis" | "renderer" | "legend" | "tooltip" | "crosshair" | "annotations" | "interaction" | "padding" | "palette" | "ariaLabel"> & Pick<ChartOptions, "series">) => ChartOptions;
 interface ChartBaseProps extends Handlers {
     options: ChartOptions;
     height?: number | string;
@@ -16,9 +19,13 @@ interface ChartBaseProps extends Handlers {
     className?: string;
     style?: CSSProperties;
     handleRef?: ChartCommonProps["ref"];
+    /** React content of the tooltip (replaces the engine's content) */
+    renderTooltip?: (event: ChartHoverEvent) => ReactNode;
+    /** React content placed over the chart, given the plot area */
+    overlay?: (plot: ChartRect) => ReactNode;
 }
 /** Mounts the engine in a sized <div> and forwards option / handler changes */
-export declare function ChartBase({ options, height, width, className, style, handleRef, ...handlers }: ChartBaseProps): import('react').JSX.Element;
+export declare function ChartBase({ options, height, width, className, style, handleRef, renderTooltip, overlay, ...handlers }: ChartBaseProps): import('react').JSX.Element;
 /**
  * GPU chart (WebGPU, then WebGL2, then Canvas2D) mixing line, area, bar and
  * scatter series; zoomable, keyboard accessible and themed by the Minerva

package/dist/charts/react/Chart.d.ts

@@ -1,14 +1,17 @@
-import { CSSProperties } from 'react';
-import { ChartHoverEvent, ChartOptions, ChartRendererKind, ChartView } from '../engine/types.js';
+import { CSSProperties, ReactNode } from 'react';
+import { ChartDragEvent, ChartHoverEvent, ChartOptions, ChartPlotClickEvent, ChartRect, ChartRendererKind, ChartView } from '../engine/types.js';
 import { ChartCommonProps, ChartProps } from './types.js';
 interface Handlers {
     onHover?: (event: ChartHoverEvent | null) => void;
     onPointClick?: (event: ChartHoverEvent) => void;
+    onPlotClick?: (event: ChartPlotClickEvent) => void;
     onZoom?: (view: ChartView) => void;
     onRendererChange?: (renderer: ChartRendererKind) => void;
+    onDrag?: (event: ChartDragEvent) => void;
+    onDrop?: (event: ChartDragEvent) => void;
 }
 /** Engine options of the common props */
-export declare const engineOptions: (props: Omit<ChartCommonProps, "onPointClick"> & Pick<ChartOptions, "series">) => ChartOptions;
+export declare const engineOptions: (props: Pick<ChartCommonProps, "xAxis" | "yAxis" | "renderer" | "legend" | "tooltip" | "crosshair" | "annotations" | "interaction" | "padding" | "palette" | "ariaLabel"> & Pick<ChartOptions, "series">) => ChartOptions;
 interface ChartBaseProps extends Handlers {
     options: ChartOptions;
     height?: number | string;
@@ -16,9 +19,13 @@ interface ChartBaseProps extends Handlers {
     className?: string;
     style?: CSSProperties;
     handleRef?: ChartCommonProps["ref"];
+    /** React content of the tooltip (replaces the engine's content) */
+    renderTooltip?: (event: ChartHoverEvent) => ReactNode;
+    /** React content placed over the chart, given the plot area */
+    overlay?: (plot: ChartRect) => ReactNode;
 }
 /** Mounts the engine in a sized <div> and forwards option / handler changes */
-export declare function ChartBase({ options, height, width, className, style, handleRef, ...handlers }: ChartBaseProps): import('react').JSX.Element;
+export declare function ChartBase({ options, height, width, className, style, handleRef, renderTooltip, overlay, ...handlers }: ChartBaseProps): import('react').JSX.Element;
 /**
  * GPU chart (WebGPU, then WebGL2, then Canvas2D) mixing line, area, bar and
  * scatter series; zoomable, keyboard accessible and themed by the Minerva

package/dist/charts/react/Chart.js

@@ -1,9 +1,10 @@
 "use client";
 import { createChart as e } from "../engine/chart.js";
-import { useEffect as t, useImperativeHandle as n, useRef as r } from "react";
-import { jsx as i } from "react/jsx-runtime";
+import { useEffect as t, useImperativeHandle as n, useMemo as r, useRef as i, useState as a } from "react";
+import { createPortal as o, flushSync as s } from "react-dom";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region src/react/Chart.tsx
-var a = (e, t) => e === void 0 ? t : typeof e == "number" ? `${e}px` : e, o = (e) => ({
+var u = (e, t) => e === void 0 ? t : typeof e == "number" ? `${e}px` : e, d = (e) => ({
 	series: e.series,
 	xAxis: e.xAxis,
 	yAxis: e.yAxis,
@@ -17,59 +18,100 @@ var a = (e, t) => e === void 0 ? t : typeof e == "number" ? `${e}px` : e, o = (e
 	palette: e.palette,
 	ariaLabel: e.ariaLabel
 });
-function s({ options: o, height: s, width: c, className: l, style: u, handleRef: d, ...f }) {
-	let p = r(null), m = r(null), h = r(f), g = r(o);
+function f({ options: d, height: f, width: p, className: m, style: h, handleRef: g, renderTooltip: _, overlay: v, ...y }) {
+	let b = i(null), x = i(null), S = i(y), C = i(_), [w, T] = a(null), [E, D] = a(null), O = r(() => typeof document > "u" ? null : document.createElement("div"), []), k = r(() => {
+		if (!_ || !O || d.tooltip === !1) return d;
+		let e = typeof d.tooltip == "object" ? d.tooltip : {};
+		return {
+			...d,
+			tooltip: {
+				...e,
+				render: (e) => C.current ? (s(() => T(e)), O) : null
+			}
+		};
+	}, [
+		d,
+		_,
+		O
+	]), A = i(k);
 	return t(() => {
-		h.current = f;
+		S.current = y, C.current = _;
 	}), t(() => {
-		let t = p.current;
+		let t = b.current;
 		if (!t) return;
-		let n = e(t, g.current);
-		m.current = n;
+		let n = e(t, A.current);
+		x.current = n;
 		let r = [
-			n.on("hover", (e) => h.current.onHover?.(e)),
-			n.on("click", (e) => h.current.onPointClick?.(e)),
-			n.on("zoom", (e) => h.current.onZoom?.(e)),
-			n.on("renderer", (e) => h.current.onRendererChange?.(e))
+			n.on("hover", (e) => S.current.onHover?.(e)),
+			n.on("click", (e) => S.current.onPointClick?.(e)),
+			n.on("plotClick", (e) => S.current.onPlotClick?.(e)),
+			n.on("zoom", (e) => S.current.onZoom?.(e)),
+			n.on("renderer", (e) => S.current.onRendererChange?.(e)),
+			n.on("drag", (e) => S.current.onDrag?.(e)),
+			n.on("drop", (e) => S.current.onDrop?.(e)),
+			n.on("layout", (e) => D(e))
 		];
 		return () => {
-			r.forEach((e) => e()), n.destroy(), m.current = null;
+			r.forEach((e) => e()), n.destroy(), x.current = null;
 		};
 	}, []), t(() => {
-		g.current !== o && (g.current = o, m.current?.setOptions(o));
-	}, [o]), n(d, () => ({
-		resetZoom: () => m.current?.resetZoom(),
-		getView: () => m.current?.getView() ?? null,
-		setView: (e) => m.current?.setView(e),
-		getRenderer: () => m.current?.getRenderer() ?? null,
-		getInstance: () => m.current
-	}), []), /* @__PURE__ */ i("div", {
-		ref: p,
-		className: l,
+		A.current !== k && (A.current = k, x.current?.setOptions(k));
+	}, [k]), n(g, () => ({
+		resetZoom: () => x.current?.resetZoom(),
+		getView: () => x.current?.getView() ?? null,
+		setView: (e) => x.current?.setView(e),
+		getRenderer: () => x.current?.getRenderer() ?? null,
+		getInstance: () => x.current
+	}), []), /* @__PURE__ */ l("div", {
+		className: m,
 		style: {
 			position: "relative",
-			width: a(c, "100%"),
-			height: a(s, "320px"),
-			...u
-		}
+			width: u(p, "100%"),
+			height: u(f, "320px"),
+			...h
+		},
+		children: [
+			/* @__PURE__ */ c("div", {
+				ref: b,
+				style: {
+					position: "absolute",
+					inset: 0
+				}
+			}),
+			v && E && /* @__PURE__ */ c("div", {
+				className: "minerva-chart-overlay",
+				style: {
+					position: "absolute",
+					left: E.x,
+					top: E.y,
+					width: E.width,
+					height: E.height,
+					pointerEvents: "none"
+				},
+				children: v(E)
+			}),
+			O && w && _ && o(_(w), O)
+		]
 	});
 }
-function c(e) {
-	let { height: t, width: n, className: r, style: a, ref: c, onHover: l, onPointClick: u, onZoom: d, onRendererChange: f } = e;
-	return /* @__PURE__ */ i(s, {
-		options: o(e),
+function p(e) {
+	let { height: t, width: n, className: r, style: i, ref: a, onHover: o, onPointClick: s, onPlotClick: l, onZoom: u, onRendererChange: p, renderTooltip: m } = e;
+	return /* @__PURE__ */ c(f, {
+		options: d(e),
 		height: t,
 		width: n,
 		className: r,
-		style: a,
-		handleRef: c,
-		onHover: l,
-		onPointClick: u,
-		onZoom: d,
-		onRendererChange: f
+		style: i,
+		handleRef: a,
+		onHover: o,
+		onPointClick: s,
+		onPlotClick: l,
+		onZoom: u,
+		onRendererChange: p,
+		renderTooltip: m
 	});
 }
 //#endregion
-export { c as Chart, s as ChartBase, o as engineOptions };
+export { p as Chart, f as ChartBase, d as engineOptions };
 
 //# sourceMappingURL=Chart.js.map

package/dist/charts/react/Chart.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chart.js","names":["size","value","fallback","engineOptions","props","ChartBase","handlers","containerRef","useRef","chartRef","handlersRef","optionsRef","options","useEffect","container","chart","createChart","offs","v","r","off","useImperativeHandle","handleRef","view","width","height","style","Chart","ref"],"sources":["../../../../charts/src/react/Chart.tsx"],"sourcesContent":["import {\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  type CSSProperties,\n} from \"react\";\nimport { createChart } from \"../engine/chart\";\nimport type {\n  ChartHoverEvent,\n  ChartInstance,\n  ChartOptions,\n  ChartRendererKind,\n  ChartView,\n} from \"../engine/types\";\nimport type { ChartCommonProps, ChartProps } from \"./types\";\n\ninterface Handlers {\n  onHover?: (event: ChartHoverEvent | null) => void;\n  onPointClick?: (event: ChartHoverEvent) => void;\n  onZoom?: (view: ChartView) => void;\n  onRendererChange?: (renderer: ChartRendererKind) => void;\n}\n\nconst size = (value: number | string | undefined, fallback: string) =>\n  value === undefined\n    ? fallback\n    : typeof value === \"number\"\n      ? `${value}px`\n      : value;\n\n/** Engine options of the common props */\nexport const engineOptions = (\n  props: Omit<ChartCommonProps, \"onPointClick\"> & Pick<ChartOptions, \"series\">,\n): ChartOptions => ({\n  series: props.series,\n  xAxis: props.xAxis,\n  yAxis: props.yAxis,\n  renderer: props.renderer,\n  legend: props.legend,\n  tooltip: props.tooltip,\n  crosshair: props.crosshair,\n  annotations: props.annotations,\n  interaction: props.interaction,\n  padding: props.padding,\n  palette: props.palette,\n  ariaLabel: props.ariaLabel,\n});\n\ninterface ChartBaseProps extends Handlers {\n  options: ChartOptions;\n  height?: number | string;\n  width?: number | string;\n  className?: string;\n  style?: CSSProperties;\n  handleRef?: ChartCommonProps[\"ref\"];\n}\n\n/** Mounts the engine in a sized <div> and forwards option / handler changes */\nexport function ChartBase({\n  options,\n  height,\n  width,\n  className,\n  style,\n  handleRef,\n  ...handlers\n}: ChartBaseProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const chartRef = useRef<ChartInstance | null>(null);\n  const handlersRef = useRef<Handlers>(handlers);\n  const optionsRef = useRef(options);\n\n  useEffect(() => {\n    handlersRef.current = handlers;\n  });\n\n  useEffect(() => {\n    const container = containerRef.current;\n    if (!container) return;\n    const chart = createChart(container, optionsRef.current);\n    chartRef.current = chart;\n    const offs = [\n      chart.on(\"hover\", (e) => handlersRef.current.onHover?.(e)),\n      chart.on(\"click\", (e) => handlersRef.current.onPointClick?.(e)),\n      chart.on(\"zoom\", (v) => handlersRef.current.onZoom?.(v)),\n      chart.on(\"renderer\", (r) => handlersRef.current.onRendererChange?.(r)),\n    ];\n    return () => {\n      offs.forEach((off) => off());\n      chart.destroy();\n      chartRef.current = null;\n    };\n  }, []);\n\n  useEffect(() => {\n    if (optionsRef.current === options) return;\n    optionsRef.current = options;\n    chartRef.current?.setOptions(options);\n  }, [options]);\n\n  useImperativeHandle(\n    handleRef,\n    () => ({\n      resetZoom: () => chartRef.current?.resetZoom(),\n      getView: () => chartRef.current?.getView() ?? null,\n      setView: (view) => chartRef.current?.setView(view),\n      getRenderer: () => chartRef.current?.getRenderer() ?? null,\n      getInstance: () => chartRef.current,\n    }),\n    [],\n  );\n\n  return (\n    <div\n      ref={containerRef}\n      className={className}\n      style={{\n        position: \"relative\",\n        width: size(width, \"100%\"),\n        height: size(height, \"320px\"),\n        ...style,\n      }}\n    />\n  );\n}\n\n/**\n * GPU chart (WebGPU, then WebGL2, then Canvas2D) mixing line, area, bar and\n * scatter series; zoomable, keyboard accessible and themed by the Minerva\n * CSS variables.\n */\nexport function Chart(props: ChartProps) {\n  const {\n    height,\n    width,\n    className,\n    style,\n    ref,\n    onHover,\n    onPointClick,\n    onZoom,\n    onRendererChange,\n  } = props;\n  return (\n    <ChartBase\n      options={engineOptions(props)}\n      height={height}\n      width={width}\n      className={className}\n      style={style}\n      handleRef={ref}\n      onHover={onHover}\n      onPointClick={onPointClick}\n      onZoom={onZoom}\n      onRendererChange={onRendererChange}\n    />\n  );\n}\n"],"mappings":";;;;;AAuBA,IAAMA,KAAQ,GAAoC,MAChDC,MAAU,KAAA,IACNC,IACA,OAAOD,KAAU,WACf,GAAGA,EAAM,MACTA,GAGKE,KACX,OACkB;CAClB,QAAQC,EAAM;CACd,OAAOA,EAAM;CACb,OAAOA,EAAM;CACb,UAAUA,EAAM;CAChB,QAAQA,EAAM;CACd,SAASA,EAAM;CACf,WAAWA,EAAM;CACjB,aAAaA,EAAM;CACnB,aAAaA,EAAM;CACnB,SAASA,EAAM;CACf,SAASA,EAAM;CACf,WAAWA,EAAM;AACnB;AAYA,SAAgBC,EAAU,EACxB,YACA,WACA,UACA,cACA,UACA,cACA,GAAGC,KACc;CACjB,IAAMC,IAAeC,EAAuB,IAAI,GAC1CC,IAAWD,EAA6B,IAAI,GAC5CE,IAAcF,EAAiBF,CAAQ,GACvCK,IAAaH,EAAOI,CAAO;CA0CjC,OAxCAC,QAAgB;EACd,EAAY,UAAUP;CACxB,CAAC,GAEDO,QAAgB;EACd,IAAMC,IAAYP,EAAa;EAC/B,IAAI,CAACO,GAAW;EAChB,IAAMC,IAAQC,EAAYF,GAAWH,EAAW,OAAO;EACvD,EAAS,UAAUI;EACnB,IAAME,IAAO;GACXF,EAAM,GAAG,UAAU,MAAML,EAAY,QAAQ,UAAU,CAAC,CAAC;GACzDK,EAAM,GAAG,UAAU,MAAML,EAAY,QAAQ,eAAe,CAAC,CAAC;GAC9DK,EAAM,GAAG,SAAS,MAAML,EAAY,QAAQ,SAASQ,CAAC,CAAC;GACvDH,EAAM,GAAG,aAAa,MAAML,EAAY,QAAQ,mBAAmBS,CAAC,CAAC;EACvE;EACA,aAAa;GAGX,AAFAF,EAAK,SAAS,MAAQG,EAAI,CAAC,GAC3BL,EAAM,QAAQ,GACd,EAAS,UAAU;EACrB;CACF,GAAG,CAAC,CAAC,GAELF,QAAgB;EACd,AAAIF,EAAW,YAAYC,MAC3B,EAAW,UAAUA,GACrBH,EAAS,SAAS,WAAWG,CAAO;CACtC,GAAG,CAACA,CAAO,CAAC,GAEZS,EACEC,UACO;EACL,iBAAiBb,EAAS,SAAS,UAAU;EAC7C,eAAeA,EAAS,SAAS,QAAQ,KAAK;EAC9C,UAAU,MAASA,EAAS,SAAS,QAAQc,CAAI;EACjD,mBAAmBd,EAAS,SAAS,YAAY,KAAK;EACtD,mBAAmBA,EAAS;CAC9B,IACA,CAAC,CACH,GAGE,kBAAC,OAAD;EACE,KAAKF;EACM;EACX,OAAO;GACL,UAAU;GACV,OAAOP,EAAKwB,GAAO,MAAM;GACzB,QAAQxB,EAAKyB,GAAQ,OAAO;GAC5B,GAAGC;EACL;CACD,CAAA;AAEL;AAOA,SAAgBC,EAAM,GAAmB;CACvC,IAAM,EACJ,WACA,UACA,cACA,UACA,QACA,YACA,iBACA,WACA,wBACEvB;CACJ,OACE,kBAACC,GAAD;EACE,SAASF,EAAcC,CAAK;EACpB;EACD;EACI;EACJ;EACP,WAAWwB;EACF;EACK;EACN;EACU;CACnB,CAAA;AAEL"}
+{"version":3,"file":"Chart.js","names":["size","value","fallback","engineOptions","props","ChartBase","handlers","containerRef","useRef","chartRef","handlersRef","tooltipRef","renderTooltip","tipEvent","setTipEvent","useState","plot","setPlot","tipHost","useMemo","resolved","options","base","flushSync","event","optionsRef","useEffect","container","chart","createChart","offs","v","r","rect","off","useImperativeHandle","handleRef","view","width","height","style","overlay","createPortal","Chart","ref"],"sources":["../../../../charts/src/react/Chart.tsx"],"sourcesContent":["import {\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n  type CSSProperties,\n  type ReactNode,\n} from \"react\";\nimport { createPortal, flushSync } from \"react-dom\";\nimport { createChart } from \"../engine/chart\";\nimport type {\n  ChartDragEvent,\n  ChartHoverEvent,\n  ChartInstance,\n  ChartOptions,\n  ChartPlotClickEvent,\n  ChartRect,\n  ChartRendererKind,\n  ChartView,\n} from \"../engine/types\";\nimport type { ChartCommonProps, ChartProps } from \"./types\";\n\ninterface Handlers {\n  onHover?: (event: ChartHoverEvent | null) => void;\n  onPointClick?: (event: ChartHoverEvent) => void;\n  onPlotClick?: (event: ChartPlotClickEvent) => void;\n  onZoom?: (view: ChartView) => void;\n  onRendererChange?: (renderer: ChartRendererKind) => void;\n  onDrag?: (event: ChartDragEvent) => void;\n  onDrop?: (event: ChartDragEvent) => void;\n}\n\nconst size = (value: number | string | undefined, fallback: string) =>\n  value === undefined\n    ? fallback\n    : typeof value === \"number\"\n      ? `${value}px`\n      : value;\n\n/** Engine options of the common props */\nexport const engineOptions = (\n  props: Pick<\n    ChartCommonProps,\n    | \"xAxis\"\n    | \"yAxis\"\n    | \"renderer\"\n    | \"legend\"\n    | \"tooltip\"\n    | \"crosshair\"\n    | \"annotations\"\n    | \"interaction\"\n    | \"padding\"\n    | \"palette\"\n    | \"ariaLabel\"\n  > &\n    Pick<ChartOptions, \"series\">,\n): ChartOptions => ({\n  series: props.series,\n  xAxis: props.xAxis,\n  yAxis: props.yAxis,\n  renderer: props.renderer,\n  legend: props.legend,\n  tooltip: props.tooltip,\n  crosshair: props.crosshair,\n  annotations: props.annotations,\n  interaction: props.interaction,\n  padding: props.padding,\n  palette: props.palette,\n  ariaLabel: props.ariaLabel,\n});\n\ninterface ChartBaseProps extends Handlers {\n  options: ChartOptions;\n  height?: number | string;\n  width?: number | string;\n  className?: string;\n  style?: CSSProperties;\n  handleRef?: ChartCommonProps[\"ref\"];\n  /** React content of the tooltip (replaces the engine's content) */\n  renderTooltip?: (event: ChartHoverEvent) => ReactNode;\n  /** React content placed over the chart, given the plot area */\n  overlay?: (plot: ChartRect) => ReactNode;\n}\n\n/** Mounts the engine in a sized <div> and forwards option / handler changes */\nexport function ChartBase({\n  options,\n  height,\n  width,\n  className,\n  style,\n  handleRef,\n  renderTooltip,\n  overlay,\n  ...handlers\n}: ChartBaseProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const chartRef = useRef<ChartInstance | null>(null);\n  const handlersRef = useRef<Handlers>(handlers);\n  const tooltipRef = useRef(renderTooltip);\n  const [tipEvent, setTipEvent] = useState<ChartHoverEvent | null>(null);\n  const [plot, setPlot] = useState<ChartRect | null>(null);\n  const tipHost = useMemo(\n    () =>\n      typeof document === \"undefined\" ? null : document.createElement(\"div\"),\n    [],\n  );\n\n  const resolved = useMemo((): ChartOptions => {\n    if (!renderTooltip || !tipHost || options.tooltip === false) return options;\n    const base = typeof options.tooltip === \"object\" ? options.tooltip : {};\n    return {\n      ...options,\n      tooltip: {\n        ...base,\n        render: (event) => {\n          if (!tooltipRef.current) return null;\n          // render synchronously so the engine measures the final size\n          flushSync(() => setTipEvent(event));\n          return tipHost;\n        },\n      },\n    };\n  }, [options, renderTooltip, tipHost]);\n  const optionsRef = useRef(resolved);\n\n  useEffect(() => {\n    handlersRef.current = handlers;\n    tooltipRef.current = renderTooltip;\n  });\n\n  useEffect(() => {\n    const container = containerRef.current;\n    if (!container) return;\n    const chart = createChart(container, optionsRef.current);\n    chartRef.current = chart;\n    const offs = [\n      chart.on(\"hover\", (e) => handlersRef.current.onHover?.(e)),\n      chart.on(\"click\", (e) => handlersRef.current.onPointClick?.(e)),\n      chart.on(\"plotClick\", (e) => handlersRef.current.onPlotClick?.(e)),\n      chart.on(\"zoom\", (v) => handlersRef.current.onZoom?.(v)),\n      chart.on(\"renderer\", (r) => handlersRef.current.onRendererChange?.(r)),\n      chart.on(\"drag\", (e) => handlersRef.current.onDrag?.(e)),\n      chart.on(\"drop\", (e) => handlersRef.current.onDrop?.(e)),\n      chart.on(\"layout\", (rect) => setPlot(rect)),\n    ];\n    return () => {\n      offs.forEach((off) => off());\n      chart.destroy();\n      chartRef.current = null;\n    };\n  }, []);\n\n  useEffect(() => {\n    if (optionsRef.current === resolved) return;\n    optionsRef.current = resolved;\n    chartRef.current?.setOptions(resolved);\n  }, [resolved]);\n\n  useImperativeHandle(\n    handleRef,\n    () => ({\n      resetZoom: () => chartRef.current?.resetZoom(),\n      getView: () => chartRef.current?.getView() ?? null,\n      setView: (view) => chartRef.current?.setView(view),\n      getRenderer: () => chartRef.current?.getRenderer() ?? null,\n      getInstance: () => chartRef.current,\n    }),\n    [],\n  );\n\n  return (\n    <div\n      className={className}\n      style={{\n        position: \"relative\",\n        width: size(width, \"100%\"),\n        height: size(height, \"320px\"),\n        ...style,\n      }}\n    >\n      <div ref={containerRef} style={{ position: \"absolute\", inset: 0 }} />\n      {overlay && plot && (\n        <div\n          className=\"minerva-chart-overlay\"\n          style={{\n            position: \"absolute\",\n            left: plot.x,\n            top: plot.y,\n            width: plot.width,\n            height: plot.height,\n            pointerEvents: \"none\",\n          }}\n        >\n          {overlay(plot)}\n        </div>\n      )}\n      {tipHost &&\n        tipEvent &&\n        renderTooltip &&\n        createPortal(renderTooltip(tipEvent), tipHost)}\n    </div>\n  );\n}\n\n/**\n * GPU chart (WebGPU, then WebGL2, then Canvas2D) mixing line, area, bar and\n * scatter series; zoomable, keyboard accessible and themed by the Minerva\n * CSS variables.\n */\nexport function Chart(props: ChartProps) {\n  const {\n    height,\n    width,\n    className,\n    style,\n    ref,\n    onHover,\n    onPointClick,\n    onPlotClick,\n    onZoom,\n    onRendererChange,\n    renderTooltip,\n  } = props;\n  return (\n    <ChartBase\n      options={engineOptions(props)}\n      height={height}\n      width={width}\n      className={className}\n      style={style}\n      handleRef={ref}\n      onHover={onHover}\n      onPointClick={onPointClick}\n      onPlotClick={onPlotClick}\n      onZoom={onZoom}\n      onRendererChange={onRendererChange}\n      renderTooltip={renderTooltip}\n    />\n  );\n}\n"],"mappings":"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"}

package/dist/charts/react/charts.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require("./Chart.cjs");let t=require("react"),n=require("react/jsx-runtime");var r=(e,t,n)=>e.map(e=>({...e,type:e.type??t,...n!==void 0&&(e.type??t)===`bar`?{stack:e.stack??n}:{}})),i=e=>({height:e.height,width:e.width,className:e.className,style:e.style,handleRef:e.ref,onHover:e.onHover,onPointClick:e.onPointClick,onZoom:e.onZoom,onRendererChange:e.onRendererChange});function a(a){let{series:o,area:s=!1}=a,c=(0,t.useMemo)(()=>r(o,s?`area`:`line`),[o,s]);return(0,n.jsx)(e.ChartBase,{options:e.engineOptions({...a,series:c}),...i(a)})}function o(a){let{series:o,stacked:s=!1}=a,c=(0,t.useMemo)(()=>r(o,`bar`,s?`stack`:void 0),[o,s]);return(0,n.jsx)(e.ChartBase,{options:e.engineOptions({...a,series:c}),...i(a)})}function s(a){let{series:o}=a,s=(0,t.useMemo)(()=>r(o,`scatter`),[o]);return(0,n.jsx)(e.ChartBase,{options:e.engineOptions({...a,series:s}),...i(a)})}var c={topLeft:`var(--danger-color, #ef4444)`,topRight:`var(--primary-color, #4f46e5)`,bottomLeft:`var(--warning-color, #f59e0b)`,bottomRight:`var(--text-secondary-color, #64748b)`};function l(r){let{points:a,xDomain:o=[0,10],yDomain:s=[0,10],xSplit:l,ySplit:u,quadrants:d,xLabel:f,yLabel:p,reverseX:m=!1,showLabels:h=!0,pointSize:g=12,name:_,onPointClick:v}=r,[y,b]=o,[x,S]=s,C=l??(y+b)/2,w=u??(x+S)/2,T=(0,t.useMemo)(()=>{let e=e=>({...d?.[e],color:d?.[e]?.color??c[e]});return{topLeft:e(`topLeft`),topRight:e(`topRight`),bottomLeft:e(`bottomLeft`),bottomRight:e(`bottomRight`)}},[d]),E=(0,t.useMemo)(()=>{let e=(e,t)=>{let n=m?e<C:e>=C;return t>=w?n?`topRight`:`topLeft`:n?`bottomRight`:`bottomLeft`};return[{type:`scatter`,name:_??``,pointSize:g,showLabels:h,opacity:.9,data:a.map(t=>({x:t.x,y:t.y,label:t.label,size:t.size,color:t.color??T[e(t.x,t.y)].color}))}]},[a,T,m,C,w,_,g,h]),D=(0,t.useMemo)(()=>{let e=m?[C,b]:[y,C],t=m?[y,C]:[C,b],n=(e,[t,n],[r,i],a)=>({type:`rect`,x0:t,x1:n,y0:r,y1:i,color:T[e].color,opacity:.07,label:T[e].label,labelPosition:a});return[n(`topLeft`,e,[w,S],`top-left`),n(`topRight`,t,[w,S],`top-right`),n(`bottomLeft`,e,[x,w],`bottom-left`),n(`bottomRight`,t,[x,w],`bottom-right`),{type:`line`,axis:`x`,value:C,dash:[],color:`var(--border-strong-color, var(--border-color, #cbd5e1))`},{type:`line`,axis:`y`,value:w,dash:[],color:`var(--border-strong-color, var(--border-color, #cbd5e1))`},...r.annotations??[]]},[T,m,y,b,x,S,C,w,r.annotations]),O=e.engineOptions({...r,series:E,annotations:D,xAxis:{min:y,max:b,title:f,reverse:m,nice:!1,grid:!1,tickCount:4},yAxis:{min:x,max:S,title:p,nice:!1,grid:!1,tickCount:4},legend:r.legend??!1,interaction:r.interaction??{zoom:!1}});return(0,n.jsx)(e.ChartBase,{options:O,...i({...r,onPointClick:void 0}),onPointClick:v?e=>{let t=e.items[0]?.index;t!==void 0&&a[t]&&v(a[t],t)}:void 0})}exports.BarChart=o,exports.LineChart=a,exports.QuadrantChart=l,exports.ScatterChart=s;
+"use client";const e=require("./Chart.cjs"),t=require("../engine/presets.cjs");let n=require("react"),r=require("react/jsx-runtime");var i=e=>({height:e.height,width:e.width,className:e.className,style:e.style,handleRef:e.ref,onHover:e.onHover,onPointClick:e.onPointClick,onPlotClick:e.onPlotClick,onZoom:e.onZoom,onRendererChange:e.onRendererChange,renderTooltip:e.renderTooltip});function a(a){let{series:o,area:s=!1}=a,c=(0,n.useMemo)(()=>t.lineSeries(o,s),[o,s]);return(0,r.jsx)(e.ChartBase,{options:e.engineOptions({...a,series:c}),...i(a)})}function o(a){let{series:o,stacked:s=!1}=a,c=(0,n.useMemo)(()=>t.barSeries(o,s),[o,s]);return(0,r.jsx)(e.ChartBase,{options:e.engineOptions({...a,series:c}),...i(a)})}function s(a){let{series:o}=a,s=(0,n.useMemo)(()=>t.scatterSeries(o),[o]);return(0,r.jsx)(e.ChartBase,{options:e.engineOptions({...a,series:s}),...i(a)})}var c=[`topLeft`,`topRight`,`bottomLeft`,`bottomRight`],l=(e,t,n)=>{let r=e.endsWith(`Left`),i=e.startsWith(`top`);return{position:`absolute`,left:r?0:n.x-t.x,top:i?0:n.y-t.y,width:r?n.x-t.x:t.x+t.width-n.x,height:i?n.y-t.y:t.y+t.height-n.y,pointerEvents:`none`}};function u(n){let{points:a,xDomain:o,yDomain:s,xSplit:u,ySplit:d,quadrants:f,xLabel:p,yLabel:m,axisLabels:h,showTicks:g,reverseX:_,showLabels:v,pointSize:y,name:b,draggable:x,onPointClick:S,onPointDrop:C,onQuadrantClick:w,renderTooltip:T,quadrantContent:E}=n,D={xDomain:o,yDomain:s,xSplit:u,ySplit:d,reverseX:_},O=t.quadrantChartOptions({points:a,xDomain:o,yDomain:s,xSplit:u,ySplit:d,quadrants:f,xLabel:p,yLabel:m,axisLabels:h,showTicks:g,reverseX:_,showLabels:v,pointSize:y,name:b,draggable:x??!!C},e.engineOptions({...n,series:[]})),k=E?e=>{let[t,n]=o??[0,10],[i,a]=s??[0,10],f=u??(t+n)/2,p=d??(i+a)/2,m=(f-t)/(n-t||1),h=(p-i)/(a-i||1),g={x:e.x+e.width*(_?1-m:m),y:e.y+e.height*(1-h)};return c.map(t=>E[t]?(0,r.jsx)(`div`,{className:`minerva-chart-quadrant minerva-chart-quadrant-${t}`,style:l(t,e,g),children:E[t]},t):null)}:void 0;return(0,r.jsx)(e.ChartBase,{options:O,...i({...n,onPointClick:void 0,renderTooltip:void 0}),overlay:k,onPointClick:S?e=>{let t=e.items[0]?.index;t!==void 0&&a[t]&&S(a[t],t)}:void 0,onPlotClick:w?e=>w(t.quadrantOf(D,e.x,e.y),e):void 0,onDrop:C?e=>{let n=e.item.index;a[n]&&C(a[n],n,{x:e.x,y:e.y,quadrant:t.quadrantOf(D,e.x,e.y)})}:void 0,renderTooltip:T?e=>{let t=e.items[0]?.index;return t!==void 0&&a[t]?T(a[t],t):null}:void 0})}exports.BarChart=o,exports.LineChart=a,exports.QuadrantChart=u,exports.ScatterChart=s;
 //# sourceMappingURL=charts.cjs.map

package/dist/charts/react/charts.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"charts.cjs","names":["useMemo","ChartBase","engineOptions","require_Chart","react","react_jsx_runtime","withType","series","s","type","stack","frameProps","props","LineChart","input","area","BarChart","stacked","ScatterChart","DEFAULT_QUADRANT_COLORS","QuadrantChart","x0","x1","xDomain","y0","y1","yDomain","xs","xSplit","ys","ySplit","regions","region","quadrants","corner","cornerOf","right","reverseX","x","y","name","points","p","pointSize","showLabels","annotations","left","rect","xa","xb","ya","yb","position","options","xLabel","yLabel","onPointClick","index","event"],"sources":["../../../../charts/src/react/charts.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport type {\n  ChartAnnotation,\n  ChartSeries,\n  ChartSeriesType,\n} from \"../engine/types\";\nimport { ChartBase, engineOptions } from \"./Chart\";\nimport type {\n  BarChartProps,\n  ChartCommonProps,\n  LineChartProps,\n  QuadrantChartProps,\n  QuadrantRegion,\n  ScatterChartProps,\n} from \"./types\";\n\nconst withType = (\n  series: readonly ChartSeries[],\n  type: ChartSeriesType,\n  stack?: string,\n): ChartSeries[] =>\n  series.map((s) => ({\n    ...s,\n    type: s.type ?? type,\n    ...(stack !== undefined && (s.type ?? type) === \"bar\"\n      ? { stack: s.stack ?? stack }\n      : {}),\n  }));\n\nconst frameProps = (props: ChartCommonProps) => ({\n  height: props.height,\n  width: props.width,\n  className: props.className,\n  style: props.style,\n  handleRef: props.ref,\n  onHover: props.onHover,\n  onPointClick: props.onPointClick,\n  onZoom: props.onZoom,\n  onRendererChange: props.onRendererChange,\n});\n\n/** Line (or area) chart; handles millions of points on the GPU */\nexport function LineChart(props: LineChartProps) {\n  const { series: input, area = false } = props;\n  const series = useMemo(\n    () => withType(input, area ? \"area\" : \"line\"),\n    [input, area],\n  );\n  return (\n    <ChartBase\n      options={engineOptions({ ...props, series })}\n      {...frameProps(props)}\n    />\n  );\n}\n\n/** Bar chart: grouped side by side, or stacked */\nexport function BarChart(props: BarChartProps) {\n  const { series: input, stacked = false } = props;\n  const series = useMemo(\n    () => withType(input, \"bar\", stacked ? \"stack\" : undefined),\n    [input, stacked],\n  );\n  return (\n    <ChartBase\n      options={engineOptions({ ...props, series })}\n      {...frameProps(props)}\n    />\n  );\n}\n\n/** Scatter chart: zooms on both axes, hit testing through a spatial index */\nexport function ScatterChart(props: ScatterChartProps) {\n  const { series: input } = props;\n  const series = useMemo(() => withType(input, \"scatter\"), [input]);\n  return (\n    <ChartBase\n      options={engineOptions({ ...props, series })}\n      {...frameProps(props)}\n    />\n  );\n}\n\nconst DEFAULT_QUADRANT_COLORS = {\n  topLeft: \"var(--danger-color, #ef4444)\",\n  topRight: \"var(--primary-color, #4f46e5)\",\n  bottomLeft: \"var(--warning-color, #f59e0b)\",\n  bottomRight: \"var(--text-secondary-color, #64748b)\",\n} as const;\n\ntype Corner = keyof typeof DEFAULT_QUADRANT_COLORS;\n\n/**\n * Four-quadrant matrix (priority matrix, Eisenhower, BCG, ...): tinted\n * quadrants with titles, dividers, and labelled dots placed without\n * overlapping labels.\n */\nexport function QuadrantChart(props: QuadrantChartProps) {\n  const {\n    points,\n    xDomain = [0, 10],\n    yDomain = [0, 10],\n    xSplit,\n    ySplit,\n    quadrants,\n    xLabel,\n    yLabel,\n    reverseX = false,\n    showLabels = true,\n    pointSize = 12,\n    name,\n    onPointClick,\n  } = props;\n  const [x0, x1] = xDomain;\n  const [y0, y1] = yDomain;\n  const xs = xSplit ?? (x0 + x1) / 2;\n  const ys = ySplit ?? (y0 + y1) / 2;\n\n  const regions = useMemo(() => {\n    const region = (\n      corner: Corner,\n    ): Required<Pick<QuadrantRegion, \"color\">> & QuadrantRegion => ({\n      ...quadrants?.[corner],\n      color: quadrants?.[corner]?.color ?? DEFAULT_QUADRANT_COLORS[corner],\n    });\n    return {\n      topLeft: region(\"topLeft\"),\n      topRight: region(\"topRight\"),\n      bottomLeft: region(\"bottomLeft\"),\n      bottomRight: region(\"bottomRight\"),\n    };\n  }, [quadrants]);\n\n  const series = useMemo((): ChartSeries[] => {\n    const cornerOf = (x: number, y: number): Corner => {\n      const right = reverseX ? x < xs : x >= xs;\n      const top = y >= ys;\n      return top\n        ? right\n          ? \"topRight\"\n          : \"topLeft\"\n        : right\n          ? \"bottomRight\"\n          : \"bottomLeft\";\n    };\n    return [\n      {\n        type: \"scatter\",\n        name: name ?? \"\",\n        pointSize,\n        showLabels,\n        opacity: 0.9,\n        data: points.map((p) => ({\n          x: p.x,\n          y: p.y,\n          label: p.label,\n          size: p.size,\n          color: p.color ?? regions[cornerOf(p.x, p.y)].color,\n        })),\n      },\n    ];\n  }, [points, regions, reverseX, xs, ys, name, pointSize, showLabels]);\n\n  const annotations = useMemo((): ChartAnnotation[] => {\n    // visual left / right -> data ranges\n    const left: [number, number] = reverseX ? [xs, x1] : [x0, xs];\n    const right: [number, number] = reverseX ? [x0, xs] : [xs, x1];\n    const rect = (\n      corner: Corner,\n      [xa, xb]: [number, number],\n      [ya, yb]: [number, number],\n      position: \"top-left\" | \"top-right\" | \"bottom-left\" | \"bottom-right\",\n    ): ChartAnnotation => ({\n      type: \"rect\",\n      x0: xa,\n      x1: xb,\n      y0: ya,\n      y1: yb,\n      color: regions[corner].color,\n      opacity: 0.07,\n      label: regions[corner].label,\n      labelPosition: position,\n    });\n    return [\n      rect(\"topLeft\", left, [ys, y1], \"top-left\"),\n      rect(\"topRight\", right, [ys, y1], \"top-right\"),\n      rect(\"bottomLeft\", left, [y0, ys], \"bottom-left\"),\n      rect(\"bottomRight\", right, [y0, ys], \"bottom-right\"),\n      {\n        type: \"line\",\n        axis: \"x\",\n        value: xs,\n        dash: [],\n        color: \"var(--border-strong-color, var(--border-color, #cbd5e1))\",\n      },\n      {\n        type: \"line\",\n        axis: \"y\",\n        value: ys,\n        dash: [],\n        color: \"var(--border-strong-color, var(--border-color, #cbd5e1))\",\n      },\n      ...(props.annotations ?? []),\n    ];\n  }, [regions, reverseX, x0, x1, y0, y1, xs, ys, props.annotations]);\n\n  const options = engineOptions({\n    ...props,\n    series,\n    annotations,\n    xAxis: {\n      min: x0,\n      max: x1,\n      title: xLabel,\n      reverse: reverseX,\n      nice: false,\n      grid: false,\n      tickCount: 4,\n    },\n    yAxis: {\n      min: y0,\n      max: y1,\n      title: yLabel,\n      nice: false,\n      grid: false,\n      tickCount: 4,\n    },\n    legend: props.legend ?? false,\n    interaction: props.interaction ?? { zoom: false },\n  });\n\n  return (\n    <ChartBase\n      options={options}\n      {...frameProps({ ...props, onPointClick: undefined })}\n      onPointClick={\n        onPointClick\n          ? (event) => {\n              const index = event.items[0]?.index;\n              if (index !== undefined && points[index])\n                onPointClick(points[index], index);\n            }\n          : undefined\n      }\n    />\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"charts.cjs","names":["useMemo","lineSeries","ChartBase","engineOptions","barSeries","scatterSeries","quadrantChartOptions","quadrantOf","require_Chart","require_presets","react","react_jsx_runtime","frameProps","props","LineChart","input","series","area","BarChart","stacked","ScatterChart","CORNERS","cornerStyle","left","corner","top","split","plot","QuadrantChart","geometry","options","draggable","onPointDrop","overlay","quadrantContent","x0","x1","xDomain","y0","y1","yDomain","xs","xSplit","ys","ySplit","fx","fy","reverseX","onPointClick","index","event","points","onQuadrantClick","at","renderTooltip"],"sources":["../../../../charts/src/react/charts.tsx"],"sourcesContent":["import { useMemo, type CSSProperties } from \"react\";\nimport {\n  barSeries,\n  lineSeries,\n  quadrantChartOptions,\n  quadrantOf,\n  scatterSeries,\n  type QuadrantCorner,\n} from \"../engine/presets\";\nimport type { ChartRect } from \"../engine/types\";\nimport { ChartBase, engineOptions } from \"./Chart\";\nimport type {\n  BarChartProps,\n  ChartCommonProps,\n  LineChartProps,\n  QuadrantChartProps,\n  ScatterChartProps,\n} from \"./types\";\n\nconst frameProps = (props: ChartCommonProps) => ({\n  height: props.height,\n  width: props.width,\n  className: props.className,\n  style: props.style,\n  handleRef: props.ref,\n  onHover: props.onHover,\n  onPointClick: props.onPointClick,\n  onPlotClick: props.onPlotClick,\n  onZoom: props.onZoom,\n  onRendererChange: props.onRendererChange,\n  renderTooltip: props.renderTooltip,\n});\n\n/** Line (or area) chart; handles millions of points on the GPU */\nexport function LineChart(props: LineChartProps) {\n  const { series: input, area = false } = props;\n  const series = useMemo(() => lineSeries(input, area), [input, area]);\n  return (\n    <ChartBase\n      options={engineOptions({ ...props, series })}\n      {...frameProps(props)}\n    />\n  );\n}\n\n/** Bar chart: grouped side by side, or stacked */\nexport function BarChart(props: BarChartProps) {\n  const { series: input, stacked = false } = props;\n  const series = useMemo(() => barSeries(input, stacked), [input, stacked]);\n  return (\n    <ChartBase\n      options={engineOptions({ ...props, series })}\n      {...frameProps(props)}\n    />\n  );\n}\n\n/** Scatter chart: zooms on both axes, hit testing through a spatial index */\nexport function ScatterChart(props: ScatterChartProps) {\n  const { series: input } = props;\n  const series = useMemo(() => scatterSeries(input), [input]);\n  return (\n    <ChartBase\n      options={engineOptions({ ...props, series })}\n      {...frameProps(props)}\n    />\n  );\n}\n\nconst CORNERS: QuadrantCorner[] = [\n  \"topLeft\",\n  \"topRight\",\n  \"bottomLeft\",\n  \"bottomRight\",\n];\n\nconst cornerStyle = (\n  corner: QuadrantCorner,\n  plot: ChartRect,\n  split: { x: number; y: number },\n): CSSProperties => {\n  const left = corner.endsWith(\"Left\");\n  const top = corner.startsWith(\"top\");\n  return {\n    position: \"absolute\",\n    left: left ? 0 : split.x - plot.x,\n    top: top ? 0 : split.y - plot.y,\n    width: left ? split.x - plot.x : plot.x + plot.width - split.x,\n    height: top ? split.y - plot.y : plot.y + plot.height - split.y,\n    pointerEvents: \"none\",\n  };\n};\n\n/**\n * Four-quadrant matrix (priority matrix, Eisenhower, BCG, ...): tinted\n * quadrants with titles, dividers, and labelled dots placed without\n * overlapping labels. Dots can be dragged to another quadrant.\n */\nexport function QuadrantChart(props: QuadrantChartProps) {\n  const {\n    points,\n    xDomain,\n    yDomain,\n    xSplit,\n    ySplit,\n    quadrants,\n    xLabel,\n    yLabel,\n    axisLabels,\n    showTicks,\n    reverseX,\n    showLabels,\n    pointSize,\n    name,\n    draggable,\n    onPointClick,\n    onPointDrop,\n    onQuadrantClick,\n    renderTooltip,\n    quadrantContent,\n  } = props;\n  const geometry = { xDomain, yDomain, xSplit, ySplit, reverseX };\n\n  const options = quadrantChartOptions(\n    {\n      points,\n      xDomain,\n      yDomain,\n      xSplit,\n      ySplit,\n      quadrants,\n      xLabel,\n      yLabel,\n      axisLabels,\n      showTicks,\n      reverseX,\n      showLabels,\n      pointSize,\n      name,\n      draggable: draggable ?? !!onPointDrop,\n    },\n    engineOptions({ ...props, series: [] }),\n  );\n\n  const overlay = quadrantContent\n    ? (plot: ChartRect) => {\n        const [x0, x1] = xDomain ?? [0, 10];\n        const [y0, y1] = yDomain ?? [0, 10];\n        const xs = xSplit ?? (x0 + x1) / 2;\n        const ys = ySplit ?? (y0 + y1) / 2;\n        const fx = (xs - x0) / (x1 - x0 || 1);\n        const fy = (ys - y0) / (y1 - y0 || 1);\n        const split = {\n          x: plot.x + plot.width * (reverseX ? 1 - fx : fx),\n          y: plot.y + plot.height * (1 - fy),\n        };\n        return CORNERS.map((corner) =>\n          quadrantContent[corner] ? (\n            <div\n              key={corner}\n              className={`minerva-chart-quadrant minerva-chart-quadrant-${corner}`}\n              style={cornerStyle(corner, plot, split)}\n            >\n              {quadrantContent[corner]}\n            </div>\n          ) : null,\n        );\n      }\n    : undefined;\n\n  return (\n    <ChartBase\n      options={options}\n      {...frameProps({\n        ...props,\n        onPointClick: undefined,\n        renderTooltip: undefined,\n      })}\n      overlay={overlay}\n      onPointClick={\n        onPointClick\n          ? (event) => {\n              const index = event.items[0]?.index;\n              if (index !== undefined && points[index])\n                onPointClick(points[index], index);\n            }\n          : undefined\n      }\n      onPlotClick={\n        onQuadrantClick\n          ? (at) => onQuadrantClick(quadrantOf(geometry, at.x, at.y), at)\n          : undefined\n      }\n      onDrop={\n        onPointDrop\n          ? (event) => {\n              const index = event.item.index;\n              if (!points[index]) return;\n              onPointDrop(points[index], index, {\n                x: event.x,\n                y: event.y,\n                quadrant: quadrantOf(geometry, event.x, event.y),\n              });\n            }\n          : undefined\n      }\n      renderTooltip={\n        renderTooltip\n          ? (event) => {\n              const index = event.items[0]?.index;\n              return index !== undefined && points[index]\n                ? renderTooltip(points[index], index)\n                : null;\n            }\n          : undefined\n      }\n    />\n  );\n}\n"],"mappings":"qIAmBA,IAAMY,EAAc,IAA6B,CAC/C,OAAQC,EAAM,OACd,MAAOA,EAAM,MACb,UAAWA,EAAM,UACjB,MAAOA,EAAM,MACb,UAAWA,EAAM,IACjB,QAASA,EAAM,QACf,aAAcA,EAAM,aACpB,YAAaA,EAAM,YACnB,OAAQA,EAAM,OACd,iBAAkBA,EAAM,iBACxB,cAAeA,EAAM,aACvB,GAGA,SAAgBC,EAAU,EAAuB,CAC/C,GAAM,CAAE,OAAQC,EAAO,OAAO,IAAUF,EAClCG,GAAA,EAAShB,EAAAA,QAAAA,KAAcC,EAAAA,WAAWc,EAAOE,CAAI,EAAG,CAACF,EAAOE,CAAI,CAAC,EACnE,OACE,EAAAN,EAAA,IAAA,CAACT,EAAAA,UAAD,CACE,QAASC,EAAAA,cAAc,CAAE,GAAGU,EAAO,QAAO,CAAC,EAC3C,GAAID,EAAWC,CAAK,CACrB,CAAA,CAEL,CAGA,SAAgBK,EAAS,EAAsB,CAC7C,GAAM,CAAE,OAAQH,EAAO,UAAU,IAAUF,EACrCG,GAAA,EAAShB,EAAAA,QAAAA,KAAcI,EAAAA,UAAUW,EAAOI,CAAO,EAAG,CAACJ,EAAOI,CAAO,CAAC,EACxE,OACE,EAAAR,EAAA,IAAA,CAACT,EAAAA,UAAD,CACE,QAASC,EAAAA,cAAc,CAAE,GAAGU,EAAO,QAAO,CAAC,EAC3C,GAAID,EAAWC,CAAK,CACrB,CAAA,CAEL,CAGA,SAAgBO,EAAa,EAA0B,CACrD,GAAM,CAAE,OAAQL,GAAUF,EACpBG,GAAA,EAAShB,EAAAA,QAAAA,KAAcK,EAAAA,cAAcU,CAAK,EAAG,CAACA,CAAK,CAAC,EAC1D,OACE,EAAAJ,EAAA,IAAA,CAACT,EAAAA,UAAD,CACE,QAASC,EAAAA,cAAc,CAAE,GAAGU,EAAO,QAAO,CAAC,EAC3C,GAAID,EAAWC,CAAK,CACrB,CAAA,CAEL,CAEA,IAAMQ,EAA4B,CAChC,UACA,WACA,aACA,aACF,EAEMC,GACJ,EACA,EACA,IACkB,CAClB,IAAMC,EAAOC,EAAO,SAAS,MAAM,EAC7BC,EAAMD,EAAO,WAAW,KAAK,EACnC,MAAO,CACL,SAAU,WACV,KAAMD,EAAO,EAAIG,EAAM,EAAIC,EAAK,EAChC,IAAKF,EAAM,EAAIC,EAAM,EAAIC,EAAK,EAC9B,MAAOJ,EAAOG,EAAM,EAAIC,EAAK,EAAIA,EAAK,EAAIA,EAAK,MAAQD,EAAM,EAC7D,OAAQD,EAAMC,EAAM,EAAIC,EAAK,EAAIA,EAAK,EAAIA,EAAK,OAASD,EAAM,EAC9D,cAAe,MACjB,CACF,EAOA,SAAgBE,EAAc,EAA2B,CACvD,GAAM,CACJ,SACA,UACA,UACA,SACA,SACA,YACA,SACA,SACA,aACA,YACA,WACA,aACA,YACA,OACA,YACA,eACA,cACA,kBACA,gBACA,mBACEf,EACEgB,EAAW,CAAE,UAAS,UAAS,SAAQ,SAAQ,UAAS,EAExDC,EAAUxB,EAAAA,qBACd,CACE,SACA,UACA,UACA,SACA,SACA,YACA,SACA,SACA,aACA,YACA,WACA,aACA,YACA,OACA,UAAWyB,GAAa,CAAC,CAACC,CAC5B,EACA7B,EAAAA,cAAc,CAAE,GAAGU,EAAO,OAAQ,CAAC,CAAE,CAAC,CACxC,EAEMoB,EAAUC,EACX,GAAoB,CACnB,GAAM,CAACC,EAAIC,GAAMC,GAAW,CAAC,EAAG,EAAE,EAC5B,CAACC,EAAIC,GAAMC,GAAW,CAAC,EAAG,EAAE,EAC5BC,EAAKC,IAAWP,EAAKC,GAAM,EAC3BO,EAAKC,IAAWN,EAAKC,GAAM,EAC3BM,GAAMJ,EAAKN,IAAOC,EAAKD,GAAM,GAC7BW,GAAMH,EAAKL,IAAOC,EAAKD,GAAM,GAC7BZ,EAAQ,CACZ,EAAGC,EAAK,EAAIA,EAAK,OAASoB,EAAW,EAAIF,EAAKA,GAC9C,EAAGlB,EAAK,EAAIA,EAAK,QAAU,EAAImB,EACjC,EACA,OAAOzB,EAAQ,IAAK,GAClBa,EAAgBV,IACd,EAAAb,EAAA,IAAA,CAAC,MAAD,CAEE,UAAW,iDAAiDa,IAC5D,MAAOF,EAAYE,EAAQG,EAAMD,CAAK,EAErC,SAAAQ,EAAgBV,EACd,EALEA,CAKF,EACH,IACN,CACF,EACA,IAAA,GAEJ,OACE,EAAAb,EAAA,IAAA,CAACT,EAAAA,UAAD,CACW,UACT,GAAIU,EAAW,CACb,GAAGC,EACH,aAAc,IAAA,GACd,cAAe,IAAA,EACjB,CAAC,EACQ,UACT,aACEmC,EACK,GAAU,CACT,IAAMC,EAAQC,EAAM,MAAM,EAAE,EAAE,MAC1BD,IAAU,IAAA,IAAaE,EAAOF,IAChCD,EAAaG,EAAOF,GAAQA,CAAK,CACrC,EACA,IAAA,GAEN,YACEG,EACK,GAAOA,EAAgB7C,EAAAA,WAAWsB,EAAUwB,EAAG,EAAGA,EAAG,CAAC,EAAGA,CAAE,EAC5D,IAAA,GAEN,OACErB,EACK,GAAU,CACT,IAAMiB,EAAQC,EAAM,KAAK,MACpBC,EAAOF,IACZjB,EAAYmB,EAAOF,GAAQA,EAAO,CAChC,EAAGC,EAAM,EACT,EAAGA,EAAM,EACT,SAAU3C,EAAAA,WAAWsB,EAAUqB,EAAM,EAAGA,EAAM,CAAC,CACjD,CAAC,CACH,EACA,IAAA,GAEN,cACEI,EACK,GAAU,CACT,IAAML,EAAQC,EAAM,MAAM,EAAE,EAAE,MAC9B,OAAOD,IAAU,IAAA,IAAaE,EAAOF,GACjCK,EAAcH,EAAOF,GAAQA,CAAK,EAClC,IACN,EACA,IAAA,EAEP,CAAA,CAEL"}

package/dist/charts/react/charts.d.cts

@@ -8,6 +8,6 @@ export declare function ScatterChart(props: ScatterChartProps): import('react').
 /**
  * Four-quadrant matrix (priority matrix, Eisenhower, BCG, ...): tinted
  * quadrants with titles, dividers, and labelled dots placed without
- * overlapping labels.
+ * overlapping labels. Dots can be dragged to another quadrant.
  */
 export declare function QuadrantChart(props: QuadrantChartProps): import('react').JSX.Element;

package/dist/charts/react/charts.d.ts

@@ -8,6 +8,6 @@ export declare function ScatterChart(props: ScatterChartProps): import('react').
 /**
  * Four-quadrant matrix (priority matrix, Eisenhower, BCG, ...): tinted
  * quadrants with titles, dividers, and labelled dots placed without
- * overlapping labels.
+ * overlapping labels. Dots can be dragged to another quadrant.
  */
 export declare function QuadrantChart(props: QuadrantChartProps): import('react').JSX.Element;