minerva-design 1.1.0 → 1.3.0

package/dist/charts/engine/theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.js","names":["DEFAULT_PALETTE","readVar","style","name","readTheme","element","color","names","resolveColor","fallback","background","text","textMuted","border","colors","palette","c","custom","i","fontFamily","mix","watchTheme","cleanups","observer","onChange","node","query","fn"],"sources":["../../../../charts/src/engine/theme.ts"],"sourcesContent":["// Chart colors and fonts read from the Minerva CSS variables.\n\nimport { mix, resolveColor, type Rgba } from \"./color\";\n\nexport interface ChartTheme {\n  palette: Rgba[];\n  text: Rgba;\n  textMuted: Rgba;\n  grid: Rgba;\n  axis: Rgba;\n  background: Rgba;\n  surface: Rgba;\n  primary: Rgba;\n  fontFamily: string;\n  /** Tick label font size in CSS pixels */\n  fontSize: number;\n}\n\n/** Used when no CSS variable is defined (e.g. without the Minerva stylesheet) */\nconst DEFAULT_PALETTE = [\n  \"#4f46e5\",\n  \"#10b981\",\n  \"#f59e0b\",\n  \"#ef4444\",\n  \"#0ea5e9\",\n  \"#8b5cf6\",\n  \"#14b8a6\",\n  \"#f97316\",\n];\n\nconst readVar = (style: CSSStyleDeclaration | null, name: string) =>\n  style?.getPropertyValue(name).trim() ?? \"\";\n\n/** Reads the theme from the computed style of `element` */\nexport const readTheme = (\n  element: Element | null,\n  palette?: readonly string[],\n): ChartTheme => {\n  const style =\n    element && typeof getComputedStyle === \"function\"\n      ? getComputedStyle(element)\n      : null;\n  const color = (names: string[], fallback: string): Rgba => {\n    for (const name of names) {\n      if (readVar(style, name)) return resolveColor(`var(${name})`, element);\n    }\n    return resolveColor(fallback, element);\n  };\n\n  const background = color(\n    [\"--surface-color\", \"--background-color\"],\n    \"#ffffff\",\n  );\n  const text = color([\"--text-color\"], \"#1f2937\");\n  const textMuted = color(\n    [\"--text-secondary-color\", \"--text-muted-color\"],\n    \"#6b7280\",\n  );\n  const border = color([\"--border-color\"], \"#e5e7eb\");\n\n  let colors: Rgba[];\n  if (palette && palette.length) {\n    colors = palette.map((c) => resolveColor(c, element));\n  } else {\n    const custom: Rgba[] = [];\n    for (let i = 1; i <= 8; i++) {\n      const name = `--chart-series-${i}`;\n      if (readVar(style, name))\n        custom.push(resolveColor(`var(${name})`, element));\n    }\n    if (custom.length) {\n      colors = custom;\n    } else {\n      const themed = [\n        \"--primary-color\",\n        \"--success-color\",\n        \"--warning-color\",\n        \"--danger-color\",\n        \"--info-color\",\n      ].map((name, i) =>\n        readVar(style, name)\n          ? resolveColor(`var(${name})`, element)\n          : resolveColor(DEFAULT_PALETTE[i], element),\n      );\n      colors = [\n        ...themed,\n        ...DEFAULT_PALETTE.slice(5).map((c) => resolveColor(c, element)),\n      ];\n    }\n  }\n\n  const fontFamily =\n    readVar(style, \"--font-family-sans\") ||\n    (style?.fontFamily ?? \"\") ||\n    \"system-ui, -apple-system, 'Segoe UI', sans-serif\";\n\n  return {\n    palette: colors,\n    text,\n    textMuted,\n    grid: mix(background, border, 0.75),\n    axis: border,\n    background,\n    surface: background,\n    primary: colors[0],\n    fontFamily,\n    fontSize: 11,\n  };\n};\n\n/**\n * Calls `onChange` when the theme may have changed: attributes of `<html>` /\n * `<body>` (class, style, data-theme) and the color scheme.\n */\nexport const watchTheme = (onChange: () => void): (() => void) => {\n  if (typeof document === \"undefined\") return () => {};\n  const cleanups: (() => void)[] = [];\n  if (typeof MutationObserver === \"function\") {\n    const observer = new MutationObserver(onChange);\n    for (const node of [document.documentElement, document.body]) {\n      if (node) {\n        observer.observe(node, {\n          attributes: true,\n          attributeFilter: [\"class\", \"style\", \"data-theme\", \"data-mode\"],\n        });\n      }\n    }\n    cleanups.push(() => observer.disconnect());\n  }\n  if (typeof matchMedia === \"function\") {\n    const query = matchMedia(\"(prefers-color-scheme: dark)\");\n    query.addEventListener?.(\"change\", onChange);\n    cleanups.push(() => query.removeEventListener?.(\"change\", onChange));\n  }\n  return () => cleanups.forEach((fn) => fn());\n};\n"],"mappings":";;AAmBA,IAAMA,IAAkB;CACtB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,GAEMC,KAAW,GAAmC,MAClDC,GAAO,iBAAiBC,CAAI,CAAC,CAAC,KAAK,KAAK,IAG7BC,KACX,GACA,MACe;CACf,IAAMF,IACJG,KAAW,OAAO,oBAAqB,aACnC,iBAAiBA,CAAO,IACxB,MACAC,KAAS,GAAiB,MAA2B;EACzD,KAAK,IAAMH,KAAQI,GACjB,IAAIN,EAAQC,GAAOC,CAAI,GAAG,OAAOK,EAAa,OAAOL,EAAK,IAAIE,CAAO;EAEvE,OAAOG,EAAaC,GAAUJ,CAAO;CACvC,GAEMK,IAAaJ,EACjB,CAAC,mBAAmB,oBAAoB,GACxC,SACF,GACMK,IAAOL,EAAM,CAAC,cAAc,GAAG,SAAS,GACxCM,IAAYN,EAChB,CAAC,0BAA0B,oBAAoB,GAC/C,SACF,GACMO,IAASP,EAAM,CAAC,gBAAgB,GAAG,SAAS,GAE9CQ;CACJ,IAAIC,KAAWA,EAAQ,QACrB,IAASA,EAAQ,KAAK,MAAMP,EAAaQ,GAAGX,CAAO,CAAC;MAC/C;EACL,IAAMY,IAAiB,CAAC;EACxB,KAAK,IAAIC,IAAI,GAAGA,KAAK,GAAG,KAAK;GAC3B,IAAMf,IAAO,kBAAkBe;GAC/B,AAAIjB,EAAQC,GAAOC,CAAI,KACrBc,EAAO,KAAKT,EAAa,OAAOL,EAAK,IAAIE,CAAO,CAAC;EACrD;EACA,AAcES,IAdEG,EAAO,SACAA,IAaA,CACP,GAZa;GACb;GACA;GACA;GACA;GACA;EACF,CAAC,CAAC,KAAK,GAAM,MACXhB,EAAQC,GAAOC,CAAI,IACfK,EAAa,OAAOL,EAAK,IAAIE,CAAO,IACpCG,EAAaR,EAAgBkB,IAAIb,CAAO,CAGzC,GACH,GAAGL,EAAgB,MAAM,CAAC,CAAC,CAAC,KAAK,MAAMQ,EAAaQ,GAAGX,CAAO,CAAC,CACjE;CAEJ;CAEA,IAAMc,IACJlB,EAAQC,GAAO,oBAAoB,MAClCA,GAAO,cAAc,OACtB;CAEF,OAAO;EACL,SAASY;EACT;EACA;EACA,MAAMM,EAAIV,GAAYG,GAAQ,GAAI;EAClC,MAAMA;EACN;EACA,SAASH;EACT,SAASI,EAAO;EAChB;EACA,UAAU;CACZ;AACF,GAMaO,KAAc,MAAuC;CAChE,IAAI,OAAO,WAAa,KAAa,aAAa,CAAC;CACnD,IAAMC,IAA2B,CAAC;CAClC,IAAI,OAAO,oBAAqB,YAAY;EAC1C,IAAMC,IAAW,IAAI,iBAAiBC,CAAQ;EAC9C,KAAK,IAAMC,KAAQ,CAAC,SAAS,iBAAiB,SAAS,IAAI,GACzD,AAAIA,KACFF,EAAS,QAAQE,GAAM;GACrB,YAAY;GACZ,iBAAiB;IAAC;IAAS;IAAS;IAAc;GAAW;EAC/D,CAAC;EAGL,EAAS,WAAWF,EAAS,WAAW,CAAC;CAC3C;CACA,IAAI,OAAO,cAAe,YAAY;EACpC,IAAMG,IAAQ,WAAW,8BAA8B;EAEvD,AADAA,EAAM,mBAAmB,UAAUF,CAAQ,GAC3CF,EAAS,WAAWI,EAAM,sBAAsB,UAAUF,CAAQ,CAAC;CACrE;CACA,aAAaF,EAAS,SAAS,MAAOK,EAAG,CAAC;AAC5C"}
+{"version":3,"file":"theme.js","names":["DEFAULT_PALETTE","readVar","style","name","readTheme","element","buildTheme","memoizeColorResolver","domColorResolver","palette","THEME_COLORS","themeColorsChanged","previous","next","sameColor","c","i","key","cache","probe","value","color","resolved","createTheme","variables","input","staticColorResolver","resolveStaticColor","fallback","fallbackGray","resolveColor","resolve","names","readVariable","background","text","textMuted","border","colors","custom","fontFamily","inheritedFont","mix","watchTheme","cleanups","observer","onChange","node","query","fn"],"sources":["../../../../charts/src/engine/theme.ts"],"sourcesContent":["// Chart colors and fonts read from the Minerva CSS variables.\n\nimport {\n  domColorResolver,\n  memoizeColorResolver,\n  mix,\n  resolveStaticColor,\n  sameColor,\n  type ColorResolver,\n  type MemoizedColorResolver,\n  type Rgba,\n} from \"./color\";\n\nexport interface ChartTheme {\n  palette: Rgba[];\n  text: Rgba;\n  textMuted: Rgba;\n  grid: Rgba;\n  axis: Rgba;\n  background: Rgba;\n  surface: Rgba;\n  primary: Rgba;\n  fontFamily: string;\n  /** Tick label font size in CSS pixels */\n  fontSize: number;\n  /** Resolves the colors of the options (`var(--x)` included); static colors only when omitted */\n  resolve?: ColorResolver;\n}\n\n/** Used when no CSS variable is defined (e.g. without the Minerva stylesheet) */\nconst DEFAULT_PALETTE = [\n  \"#4f46e5\",\n  \"#10b981\",\n  \"#f59e0b\",\n  \"#ef4444\",\n  \"#0ea5e9\",\n  \"#8b5cf6\",\n  \"#14b8a6\",\n  \"#f97316\",\n];\n\nconst readVar = (style: CSSStyleDeclaration | null, name: string) =>\n  style?.getPropertyValue(name).trim() ?? \"\";\n\n/**\n * Reads the theme from the computed style of `element`. Its resolver caches\n * the colors (DOM probes are costly): read the theme again to see new values.\n */\nexport const readTheme = (\n  element: Element | null,\n  palette?: readonly string[],\n): ChartTheme => {\n  const style =\n    element && typeof getComputedStyle === \"function\"\n      ? getComputedStyle(element)\n      : null;\n  return buildTheme(\n    (name) => readVar(style, name),\n    memoizeColorResolver(domColorResolver(element)),\n    palette,\n    style?.fontFamily ?? \"\",\n  );\n};\n\nconst THEME_COLORS = [\n  \"text\",\n  \"textMuted\",\n  \"grid\",\n  \"axis\",\n  \"background\",\n  \"surface\",\n  \"primary\",\n] as const;\n\n/**\n * Whether `next` (a re-read of `previous`) resolves any color differently:\n * the theme colors, the palette and every color `previous` has resolved so\n * far (series, points, annotations...). `true` when it cannot tell.\n */\nexport const themeColorsChanged = (\n  previous: ChartTheme,\n  next: ChartTheme,\n): boolean => {\n  if (previous === next) return false;\n  if (previous.palette.length !== next.palette.length) return true;\n  if (previous.palette.some((c, i) => !sameColor(c, next.palette[i])))\n    return true;\n  if (THEME_COLORS.some((key) => !sameColor(previous[key], next[key])))\n    return true;\n  const cache = (previous.resolve as Partial<MemoizedColorResolver> | undefined)\n    ?.cache;\n  if (!cache || !next.resolve) return true;\n  const probe: Rgba = [NaN, NaN, NaN, NaN];\n  for (const [value, color] of cache) {\n    const resolved = next.resolve(value, probe);\n    if (!sameColor(color, resolved === probe ? null : resolved)) return true;\n  }\n  return false;\n};\n\n/** Theme of the charts drawn without a DOM (mini-programs, React Native) */\nexport interface ChartThemeInput {\n  /**\n   * Values of the Minerva CSS variables (`--primary-color`, `--text-color`,\n   * `--chart-series-1`, ...) used for the theme colors and to resolve\n   * `var(--name)` colors of the options\n   */\n  variables?: Readonly<Record<string, string>>;\n  /** Series colors (hex / rgb) */\n  palette?: readonly string[];\n  /** Font family of the labels */\n  fontFamily?: string;\n  /**\n   * Font size of the tick labels, in pixels\n   * @default 11\n   */\n  fontSize?: number;\n}\n\n/** Builds a theme from plain values (no DOM) */\nexport const createTheme = (\n  input: ChartThemeInput = {},\n  palette?: readonly string[],\n): ChartTheme => {\n  const variables = input.variables ?? {};\n  const theme = buildTheme(\n    (name) => variables[name]?.trim() ?? \"\",\n    staticColorResolver(variables),\n    palette?.length ? palette : input.palette,\n    \"\",\n  );\n  return {\n    ...theme,\n    ...(input.fontFamily ? { fontFamily: input.fontFamily } : {}),\n    ...(input.fontSize ? { fontSize: input.fontSize } : {}),\n  };\n};\n\n/** Resolver of `var(--name, fallback)` colors against plain variables */\nexport const staticColorResolver =\n  (variables: Readonly<Record<string, string>>): ColorResolver =>\n  (value, fallback) =>\n    resolveStaticColor(value, variables, fallback);\n\nconst buildTheme = (\n  readVariable: (name: string) => string,\n  resolve: ColorResolver,\n  palette: readonly string[] | undefined,\n  inheritedFont: string,\n): ChartTheme => {\n  const fallbackGray: Rgba = [0.4, 0.4, 0.4, 1];\n  const resolveColor = (value: string) => resolve(value, fallbackGray);\n  const color = (names: string[], fallback: string): Rgba => {\n    for (const name of names) {\n      if (readVariable(name)) return resolveColor(`var(${name})`);\n    }\n    return resolveColor(fallback);\n  };\n\n  const background = color(\n    [\"--surface-color\", \"--background-color\"],\n    \"#ffffff\",\n  );\n  const text = color([\"--text-color\"], \"#1f2937\");\n  const textMuted = color(\n    [\"--text-secondary-color\", \"--text-muted-color\"],\n    \"#6b7280\",\n  );\n  const border = color([\"--border-color\"], \"#e5e7eb\");\n\n  let colors: Rgba[];\n  if (palette && palette.length) {\n    colors = palette.map((c) => resolveColor(c));\n  } else {\n    const custom: Rgba[] = [];\n    for (let i = 1; i <= 8; i++) {\n      const name = `--chart-series-${i}`;\n      if (readVariable(name)) custom.push(resolveColor(`var(${name})`));\n    }\n    if (custom.length) {\n      colors = custom;\n    } else {\n      const themed = [\n        \"--primary-color\",\n        \"--success-color\",\n        \"--warning-color\",\n        \"--danger-color\",\n        \"--info-color\",\n      ].map((name, i) =>\n        readVariable(name)\n          ? resolveColor(`var(${name})`)\n          : resolveColor(DEFAULT_PALETTE[i]),\n      );\n      colors = [\n        ...themed,\n        ...DEFAULT_PALETTE.slice(5).map((c) => resolveColor(c)),\n      ];\n    }\n  }\n\n  const fontFamily =\n    readVariable(\"--font-family-sans\") ||\n    inheritedFont ||\n    \"system-ui, -apple-system, 'Segoe UI', sans-serif\";\n\n  return {\n    palette: colors,\n    text,\n    textMuted,\n    grid: mix(background, border, 0.75),\n    axis: border,\n    background,\n    surface: background,\n    primary: colors[0],\n    fontFamily,\n    fontSize: 11,\n    resolve,\n  };\n};\n\n/**\n * Calls `onChange` when the theme may have changed: attributes of `<html>` /\n * `<body>` (class, style, data-theme) and the color scheme.\n */\nexport const watchTheme = (onChange: () => void): (() => void) => {\n  if (typeof document === \"undefined\") return () => {};\n  const cleanups: (() => void)[] = [];\n  if (typeof MutationObserver === \"function\") {\n    const observer = new MutationObserver(onChange);\n    for (const node of [document.documentElement, document.body]) {\n      if (node) {\n        observer.observe(node, {\n          attributes: true,\n          attributeFilter: [\"class\", \"style\", \"data-theme\", \"data-mode\"],\n        });\n      }\n    }\n    cleanups.push(() => observer.disconnect());\n  }\n  if (typeof matchMedia === \"function\") {\n    const query = matchMedia(\"(prefers-color-scheme: dark)\");\n    query.addEventListener?.(\"change\", onChange);\n    cleanups.push(() => query.removeEventListener?.(\"change\", onChange));\n  }\n  return () => cleanups.forEach((fn) => fn());\n};\n"],"mappings":"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"}

package/dist/charts/engine/types.d.cts

@@ -8,30 +8,51 @@ export type ChartRendererPreference = "auto" | ChartRendererKind;
 /** Scale of an axis */
 export type ChartAxisType = "linear" | "time" | "category";
 /** How a series is drawn */
-export type ChartSeriesType = "line" | "area" | "bar" | "scatter";
+export type ChartSeriesType = "line" | "area" | "bar" | "scatter" | "candlestick" | "heatmap";
+/** Shape of a line (and of the edge of an area) between its points */
+export type ChartCurve = "linear" | "smooth" | "step";
 /** X value of a datum: a number, a `Date` (time axis) or a category name */
 export type ChartXValue = number | Date | string;
 /** One datum written as an object */
 export interface ChartPointDatum {
     /** X value; the datum index when omitted */
     x?: ChartXValue;
-    /** Y value; `null` leaves a gap */
-    y: number | null;
+    /**
+     * Y value; `null` leaves a gap. Candlesticks: the close. Heatmaps: the
+     * row (a number, or a category name of a `category` y axis)
+     */
+    y: number | string | null;
     /** Diameter of the dot in CSS pixels (scatter) */
     size?: number;
-    /** Color of the dot (scatter); any CSS color */
+    /** Color of the dot or bar (scatter, bar); any CSS color */
     color?: string;
     /** Text drawn next to the dot (scatter with `showLabels`) and shown in the tooltip */
     label?: string;
+    /** Candlestick: opening value */
+    open?: number;
+    /** Candlestick: highest value */
+    high?: number;
+    /** Candlestick: lowest value */
+    low?: number;
+    /** Heatmap: value of the cell, mapped to `colorScale` */
+    value?: number | null;
 }
 /** Column-oriented data: the fastest form for large data sets (typed arrays are used as is) */
 export interface ChartColumnData {
     /** X values; the index when omitted */
     x?: ArrayLike<number> | readonly ChartXValue[];
-    /** Y values (`NaN` / `null` leave a gap) */
-    y: ArrayLike<number> | readonly (number | null)[];
+    /** Y values (`NaN` / `null` leave a gap); candlesticks: the closes; heatmaps: the rows */
+    y: ArrayLike<number> | readonly (number | string | null)[];
     /** Per-point diameters in CSS pixels (scatter) */
     size?: ArrayLike<number>;
+    /** Candlestick: opening values */
+    open?: ArrayLike<number>;
+    /** Candlestick: highest values */
+    high?: ArrayLike<number>;
+    /** Candlestick: lowest values */
+    low?: ArrayLike<number>;
+    /** Heatmap: values of the cells */
+    value?: ArrayLike<number> | readonly (number | null)[];
 }
 /**
  * Data of a series: y values only (`[3, 5, 2]`, typed arrays included),
@@ -65,17 +86,45 @@ export interface ChartSeries {
     pointSize?: number;
     /** Fill opacity (area, scatter), 0-1 */
     opacity?: number;
-    /** Bars with the same stack id are stacked */
+    /**
+     * Series with the same stack id are stacked (bars, areas and lines; see
+     * `stackMode` for 100% stacks)
+     */
     stack?: string;
     /** Hides the series (it stays in the legend) */
     hidden?: boolean;
-    /** Draws the `label` of each point next to it (scatter) */
+    /**
+     * Draws the `label` of each point next to it (scatter) or the value above
+     * each bar (bar)
+     */
     showLabels?: boolean;
+    /**
+     * Shape of the line between the points: straight, smooth (monotone, never
+     * overshoots the data) or steps (line / area)
+     * @default "linear"
+     */
+    curve?: ChartCurve;
+    /** Candlestick: color of the rising candles (close >= open); `--success-color` by default */
+    upColor?: string;
+    /** Candlestick: color of the falling candles; `--danger-color` by default */
+    downColor?: string;
+    /**
+     * Heatmap: colors from the lowest to the highest value (two or more)
+     * @default a ramp from the background to the series color
+     */
+    colorScale?: readonly string[];
+    /** Heatmap: values mapped to the ends of `colorScale`; the data range by default */
+    valueRange?: readonly [number, number];
+    /** Bar / heatmap: corner radius in CSS pixels (bars: 3, heatmap cells: 2) */
+    radius?: number;
+    /** Formats the values of this series in the tooltip (the y axis format by default) */
+    format?: (value: number) => string;
 }
 /** Options of an axis */
 export interface ChartAxisOptions {
     /**
-     * Scale of the axis: `linear` numbers, `time` timestamps / dates, `category` names
+     * Scale of the axis: `linear` numbers, `time` timestamps / dates, `category`
+     * names (x axis, and y axis of heatmaps)
      * @default "linear"
      */
     type?: ChartAxisType;
@@ -145,8 +194,28 @@ export interface ChartLineAnnotation {
     /** Text drawn at the end of the line */
     label?: string;
 }
-/** Background area or reference line */
-export type ChartAnnotation = ChartRectAnnotation | ChartLineAnnotation;
+/** Text placed at a data position (omitted coordinates center it on the plot) */
+export interface ChartTextAnnotation {
+    type: "text";
+    x?: number;
+    y?: number;
+    text: string;
+    /**
+     * Side of the text that touches the position: `top` hangs the text below
+     * it, `left` starts it there, ...; the text always stays inside the plot
+     * @default "center"
+     */
+    anchor?: "center" | "top" | "bottom" | "left" | "right";
+    /** Text color (defaults to the secondary text color) */
+    color?: string;
+    /**
+     * Font weight
+     * @default 500
+     */
+    weight?: number;
+}
+/** Background area, reference line or text */
+export type ChartAnnotation = ChartRectAnnotation | ChartLineAnnotation | ChartTextAnnotation;
 /** Zoom / pan / keyboard options */
 export interface ChartInteractionOptions {
     /**
@@ -169,6 +238,12 @@ export interface ChartInteractionOptions {
      * @default true
      */
     keyboard?: boolean;
+    /**
+     * Scatter points can be dragged: `drag` events follow the pointer and a
+     * `drop` event ends the gesture (the data is not changed by the chart)
+     * @default false
+     */
+    dragPoints?: boolean;
 }
 /** Tooltip options */
 export interface ChartTooltipOptions {
@@ -229,6 +304,12 @@ export interface ChartOptions {
     palette?: readonly string[];
     /** Accessible name of the chart */
     ariaLabel?: string;
+    /**
+     * `percent` scales every stack to 100% at each x (the axis shows percents,
+     * the tooltip the actual values)
+     * @default "normal"
+     */
+    stackMode?: "normal" | "percent";
 }
 /** A point under the pointer */
 export interface ChartHoverItem {
@@ -242,6 +323,12 @@ export interface ChartHoverItem {
     /** Resolved color of the point */
     color: string;
     label?: string;
+    /** Candlestick: open / high / low (`y` is the close) */
+    open?: number;
+    high?: number;
+    low?: number;
+    /** Heatmap: value of the cell */
+    value?: number;
 }
 /** Hover / click payload */
 export interface ChartHoverEvent {
@@ -257,12 +344,41 @@ export interface ChartView {
     x: [number, number];
     y: [number, number];
 }
+/** Rectangle in CSS pixels, relative to the chart's container */
+export interface ChartRect {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+/** A dragged point (`drag` / `drop` events) */
+export interface ChartDragEvent {
+    /** The point being dragged */
+    item: ChartHoverItem;
+    /** Data coordinates under the pointer */
+    x: number;
+    y: number;
+}
+/** A click (or tap) on the plot area outside the points */
+export interface ChartPlotClickEvent {
+    /** Data coordinates of the click */
+    x: number;
+    y: number;
+}
 /** Events of a chart instance */
 export interface ChartEventMap {
     hover: ChartHoverEvent | null;
     click: ChartHoverEvent;
+    /** Click on the plot area where there is no point */
+    plotClick: ChartPlotClickEvent;
     zoom: ChartView;
     renderer: ChartRendererKind;
+    /** The plot area moved or was resized */
+    layout: ChartRect;
+    /** A point is dragged (`interaction.dragPoints`) */
+    drag: ChartDragEvent;
+    /** A dragged point was released */
+    drop: ChartDragEvent;
 }
 /** Chart created by `createChart` */
 export interface ChartInstance {
@@ -276,6 +392,18 @@ export interface ChartInstance {
     getView(): ChartView;
     /** Sets the visible range */
     setView(view: Partial<ChartView>): void;
+    /** Plot area in CSS pixels of the container (`null` before the first frame) */
+    getPlotRect(): ChartRect | null;
+    /** Data coordinates -> CSS pixels of the container (`null` before the first frame) */
+    toPixel(x: number, y: number): {
+        x: number;
+        y: number;
+    } | null;
+    /** CSS pixels of the container -> data coordinates (`null` before the first frame) */
+    fromPixel(x: number, y: number): {
+        x: number;
+        y: number;
+    } | null;
     /** Backend in use, `null` until ready */
     getRenderer(): ChartRendererKind | null;
     /** Resolves with the backend once the first frame can be drawn (`null` when the browser has no canvas support) */

package/dist/charts/engine/types.d.ts

@@ -8,30 +8,51 @@ export type ChartRendererPreference = "auto" | ChartRendererKind;
 /** Scale of an axis */
 export type ChartAxisType = "linear" | "time" | "category";
 /** How a series is drawn */
-export type ChartSeriesType = "line" | "area" | "bar" | "scatter";
+export type ChartSeriesType = "line" | "area" | "bar" | "scatter" | "candlestick" | "heatmap";
+/** Shape of a line (and of the edge of an area) between its points */
+export type ChartCurve = "linear" | "smooth" | "step";
 /** X value of a datum: a number, a `Date` (time axis) or a category name */
 export type ChartXValue = number | Date | string;
 /** One datum written as an object */
 export interface ChartPointDatum {
     /** X value; the datum index when omitted */
     x?: ChartXValue;
-    /** Y value; `null` leaves a gap */
-    y: number | null;
+    /**
+     * Y value; `null` leaves a gap. Candlesticks: the close. Heatmaps: the
+     * row (a number, or a category name of a `category` y axis)
+     */
+    y: number | string | null;
     /** Diameter of the dot in CSS pixels (scatter) */
     size?: number;
-    /** Color of the dot (scatter); any CSS color */
+    /** Color of the dot or bar (scatter, bar); any CSS color */
     color?: string;
     /** Text drawn next to the dot (scatter with `showLabels`) and shown in the tooltip */
     label?: string;
+    /** Candlestick: opening value */
+    open?: number;
+    /** Candlestick: highest value */
+    high?: number;
+    /** Candlestick: lowest value */
+    low?: number;
+    /** Heatmap: value of the cell, mapped to `colorScale` */
+    value?: number | null;
 }
 /** Column-oriented data: the fastest form for large data sets (typed arrays are used as is) */
 export interface ChartColumnData {
     /** X values; the index when omitted */
     x?: ArrayLike<number> | readonly ChartXValue[];
-    /** Y values (`NaN` / `null` leave a gap) */
-    y: ArrayLike<number> | readonly (number | null)[];
+    /** Y values (`NaN` / `null` leave a gap); candlesticks: the closes; heatmaps: the rows */
+    y: ArrayLike<number> | readonly (number | string | null)[];
     /** Per-point diameters in CSS pixels (scatter) */
     size?: ArrayLike<number>;
+    /** Candlestick: opening values */
+    open?: ArrayLike<number>;
+    /** Candlestick: highest values */
+    high?: ArrayLike<number>;
+    /** Candlestick: lowest values */
+    low?: ArrayLike<number>;
+    /** Heatmap: values of the cells */
+    value?: ArrayLike<number> | readonly (number | null)[];
 }
 /**
  * Data of a series: y values only (`[3, 5, 2]`, typed arrays included),
@@ -65,17 +86,45 @@ export interface ChartSeries {
     pointSize?: number;
     /** Fill opacity (area, scatter), 0-1 */
     opacity?: number;
-    /** Bars with the same stack id are stacked */
+    /**
+     * Series with the same stack id are stacked (bars, areas and lines; see
+     * `stackMode` for 100% stacks)
+     */
     stack?: string;
     /** Hides the series (it stays in the legend) */
     hidden?: boolean;
-    /** Draws the `label` of each point next to it (scatter) */
+    /**
+     * Draws the `label` of each point next to it (scatter) or the value above
+     * each bar (bar)
+     */
     showLabels?: boolean;
+    /**
+     * Shape of the line between the points: straight, smooth (monotone, never
+     * overshoots the data) or steps (line / area)
+     * @default "linear"
+     */
+    curve?: ChartCurve;
+    /** Candlestick: color of the rising candles (close >= open); `--success-color` by default */
+    upColor?: string;
+    /** Candlestick: color of the falling candles; `--danger-color` by default */
+    downColor?: string;
+    /**
+     * Heatmap: colors from the lowest to the highest value (two or more)
+     * @default a ramp from the background to the series color
+     */
+    colorScale?: readonly string[];
+    /** Heatmap: values mapped to the ends of `colorScale`; the data range by default */
+    valueRange?: readonly [number, number];
+    /** Bar / heatmap: corner radius in CSS pixels (bars: 3, heatmap cells: 2) */
+    radius?: number;
+    /** Formats the values of this series in the tooltip (the y axis format by default) */
+    format?: (value: number) => string;
 }
 /** Options of an axis */
 export interface ChartAxisOptions {
     /**
-     * Scale of the axis: `linear` numbers, `time` timestamps / dates, `category` names
+     * Scale of the axis: `linear` numbers, `time` timestamps / dates, `category`
+     * names (x axis, and y axis of heatmaps)
      * @default "linear"
      */
     type?: ChartAxisType;
@@ -145,8 +194,28 @@ export interface ChartLineAnnotation {
     /** Text drawn at the end of the line */
     label?: string;
 }
-/** Background area or reference line */
-export type ChartAnnotation = ChartRectAnnotation | ChartLineAnnotation;
+/** Text placed at a data position (omitted coordinates center it on the plot) */
+export interface ChartTextAnnotation {
+    type: "text";
+    x?: number;
+    y?: number;
+    text: string;
+    /**
+     * Side of the text that touches the position: `top` hangs the text below
+     * it, `left` starts it there, ...; the text always stays inside the plot
+     * @default "center"
+     */
+    anchor?: "center" | "top" | "bottom" | "left" | "right";
+    /** Text color (defaults to the secondary text color) */
+    color?: string;
+    /**
+     * Font weight
+     * @default 500
+     */
+    weight?: number;
+}
+/** Background area, reference line or text */
+export type ChartAnnotation = ChartRectAnnotation | ChartLineAnnotation | ChartTextAnnotation;
 /** Zoom / pan / keyboard options */
 export interface ChartInteractionOptions {
     /**
@@ -169,6 +238,12 @@ export interface ChartInteractionOptions {
      * @default true
      */
     keyboard?: boolean;
+    /**
+     * Scatter points can be dragged: `drag` events follow the pointer and a
+     * `drop` event ends the gesture (the data is not changed by the chart)
+     * @default false
+     */
+    dragPoints?: boolean;
 }
 /** Tooltip options */
 export interface ChartTooltipOptions {
@@ -229,6 +304,12 @@ export interface ChartOptions {
     palette?: readonly string[];
     /** Accessible name of the chart */
     ariaLabel?: string;
+    /**
+     * `percent` scales every stack to 100% at each x (the axis shows percents,
+     * the tooltip the actual values)
+     * @default "normal"
+     */
+    stackMode?: "normal" | "percent";
 }
 /** A point under the pointer */
 export interface ChartHoverItem {
@@ -242,6 +323,12 @@ export interface ChartHoverItem {
     /** Resolved color of the point */
     color: string;
     label?: string;
+    /** Candlestick: open / high / low (`y` is the close) */
+    open?: number;
+    high?: number;
+    low?: number;
+    /** Heatmap: value of the cell */
+    value?: number;
 }
 /** Hover / click payload */
 export interface ChartHoverEvent {
@@ -257,12 +344,41 @@ export interface ChartView {
     x: [number, number];
     y: [number, number];
 }
+/** Rectangle in CSS pixels, relative to the chart's container */
+export interface ChartRect {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+/** A dragged point (`drag` / `drop` events) */
+export interface ChartDragEvent {
+    /** The point being dragged */
+    item: ChartHoverItem;
+    /** Data coordinates under the pointer */
+    x: number;
+    y: number;
+}
+/** A click (or tap) on the plot area outside the points */
+export interface ChartPlotClickEvent {
+    /** Data coordinates of the click */
+    x: number;
+    y: number;
+}
 /** Events of a chart instance */
 export interface ChartEventMap {
     hover: ChartHoverEvent | null;
     click: ChartHoverEvent;
+    /** Click on the plot area where there is no point */
+    plotClick: ChartPlotClickEvent;
     zoom: ChartView;
     renderer: ChartRendererKind;
+    /** The plot area moved or was resized */
+    layout: ChartRect;
+    /** A point is dragged (`interaction.dragPoints`) */
+    drag: ChartDragEvent;
+    /** A dragged point was released */
+    drop: ChartDragEvent;
 }
 /** Chart created by `createChart` */
 export interface ChartInstance {
@@ -276,6 +392,18 @@ export interface ChartInstance {
     getView(): ChartView;
     /** Sets the visible range */
     setView(view: Partial<ChartView>): void;
+    /** Plot area in CSS pixels of the container (`null` before the first frame) */
+    getPlotRect(): ChartRect | null;
+    /** Data coordinates -> CSS pixels of the container (`null` before the first frame) */
+    toPixel(x: number, y: number): {
+        x: number;
+        y: number;
+    } | null;
+    /** CSS pixels of the container -> data coordinates (`null` before the first frame) */
+    fromPixel(x: number, y: number): {
+        x: number;
+        y: number;
+    } | null;
     /** Backend in use, `null` until ready */
     getRenderer(): ChartRendererKind | null;
     /** Resolves with the backend once the first frame can be drawn (`null` when the browser has no canvas support) */

package/dist/charts/index.cjs

@@ -1 +1 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./engine/format.cjs"),t=require("./engine/chart.cjs"),n=require("./react/Chart.cjs"),r=require("./react/charts.cjs");require("./core.cjs"),exports.BarChart=r.BarChart,exports.Chart=n.Chart,exports.LineChart=r.LineChart,exports.QuadrantChart=r.QuadrantChart,exports.ScatterChart=r.ScatterChart,exports.createChart=t.createChart,exports.formatCompact=e.formatCompact;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./engine/format.cjs"),t=require("./engine/chart.cjs"),n=require("./react/Chart.cjs"),r=require("./engine/presets.cjs"),i=require("./react/charts.cjs"),a=require("./engine/shapes/chart.cjs"),o=require("./react/shapes.cjs"),s=require("./engine/shapes/canvas.cjs"),c=require("./engine/controller.cjs"),l=require("./engine/canvas.cjs");require("./core.cjs"),exports.AreaChart=i.AreaChart,exports.BarChart=i.BarChart,exports.CandlestickChart=i.CandlestickChart,exports.Chart=n.Chart,exports.DonutChart=o.DonutChart,exports.FunnelChart=o.FunnelChart,exports.GaugeChart=o.GaugeChart,exports.HeatmapChart=i.HeatmapChart,exports.LineChart=i.LineChart,exports.PieChart=o.PieChart,exports.QuadrantChart=i.QuadrantChart,exports.RadarChart=o.RadarChart,exports.ScatterChart=i.ScatterChart,exports.Sparkline=i.Sparkline,exports.TreemapChart=o.TreemapChart,exports.createCanvasChart=l.createCanvasChart,exports.createCanvasShapeChart=s.createCanvasShapeChart,exports.createChart=t.createChart,exports.createChartController=c.createChartController,exports.createShapeChart=a.createShapeChart,exports.formatCompact=e.formatCompact,exports.heatmapChartOptions=r.heatmapChartOptions,exports.quadrantCenter=r.quadrantCenter,exports.quadrantChartOptions=r.quadrantChartOptions,exports.quadrantOf=r.quadrantOf,exports.scenePrimitives=c.scenePrimitives,exports.sparklineOptions=r.sparklineOptions;

package/dist/charts/index.d.cts

@@ -1,4 +1,6 @@
 export { Chart } from './react/Chart.cjs';
-export { BarChart, LineChart, QuadrantChart, ScatterChart, } from './react/charts.cjs';
-export type { BarChartProps, ChartCommonProps, ChartHandle, ChartProps, LineChartProps, QuadrantChartProps, QuadrantPoint, QuadrantRegion, QuadrantRegions, ScatterChartProps, } from './react/types.cjs';
+export { AreaChart, BarChart, CandlestickChart, HeatmapChart, LineChart, QuadrantChart, ScatterChart, Sparkline, } from './react/charts.cjs';
+export { DonutChart, FunnelChart, GaugeChart, PieChart, RadarChart, TreemapChart, } from './react/shapes.cjs';
+export type { AreaChartProps, BarChartProps, CandlestickChartProps, ChartCommonProps, ChartHandle, ChartProps, HeatmapChartProps, LineChartProps, QuadrantChartProps, QuadrantDropTarget, ScatterChartProps, SparklineProps, } from './react/types.cjs';
+export type { DonutChartProps, FunnelChartProps, GaugeChartProps, PieChartProps, RadarChartProps, ShapeChartCommonProps, ShapeChartHandle, TreemapChartProps, } from './react/shapes.cjs';
 export * from './core.cjs';

package/dist/charts/index.d.ts

@@ -1,4 +1,6 @@
 export { Chart } from './react/Chart.js';
-export { BarChart, LineChart, QuadrantChart, ScatterChart, } from './react/charts.js';
-export type { BarChartProps, ChartCommonProps, ChartHandle, ChartProps, LineChartProps, QuadrantChartProps, QuadrantPoint, QuadrantRegion, QuadrantRegions, ScatterChartProps, } from './react/types.js';
+export { AreaChart, BarChart, CandlestickChart, HeatmapChart, LineChart, QuadrantChart, ScatterChart, Sparkline, } from './react/charts.js';
+export { DonutChart, FunnelChart, GaugeChart, PieChart, RadarChart, TreemapChart, } from './react/shapes.js';
+export type { AreaChartProps, BarChartProps, CandlestickChartProps, ChartCommonProps, ChartHandle, ChartProps, HeatmapChartProps, LineChartProps, QuadrantChartProps, QuadrantDropTarget, ScatterChartProps, SparklineProps, } from './react/types.js';
+export type { DonutChartProps, FunnelChartProps, GaugeChartProps, PieChartProps, RadarChartProps, ShapeChartCommonProps, ShapeChartHandle, TreemapChartProps, } from './react/shapes.js';
 export * from './core.js';

package/dist/charts/index.js

@@ -2,6 +2,12 @@
 import { formatCompact as e } from "./engine/format.js";
 import { createChart as t } from "./engine/chart.js";
 import { Chart as n } from "./react/Chart.js";
-import { BarChart as r, LineChart as i, QuadrantChart as a, ScatterChart as o } from "./react/charts.js";
+import { heatmapChartOptions as r, quadrantCenter as i, quadrantChartOptions as a, quadrantOf as o, sparklineOptions as s } from "./engine/presets.js";
+import { AreaChart as c, BarChart as l, CandlestickChart as u, HeatmapChart as d, LineChart as f, QuadrantChart as p, ScatterChart as m, Sparkline as h } from "./react/charts.js";
+import { createShapeChart as g } from "./engine/shapes/chart.js";
+import { DonutChart as _, FunnelChart as v, GaugeChart as y, PieChart as b, RadarChart as x, TreemapChart as S } from "./react/shapes.js";
+import { createCanvasShapeChart as C } from "./engine/shapes/canvas.js";
+import { createChartController as w, scenePrimitives as T } from "./engine/controller.js";
+import { createCanvasChart as E } from "./engine/canvas.js";
 import "./core.js";
-export { r as BarChart, n as Chart, i as LineChart, a as QuadrantChart, o as ScatterChart, t as createChart, e as formatCompact };
+export { c as AreaChart, l as BarChart, u as CandlestickChart, n as Chart, _ as DonutChart, v as FunnelChart, y as GaugeChart, d as HeatmapChart, f as LineChart, b as PieChart, p as QuadrantChart, x as RadarChart, m as ScatterChart, h as Sparkline, S as TreemapChart, E as createCanvasChart, C as createCanvasShapeChart, t as createChart, w as createChartController, g as createShapeChart, e as formatCompact, r as heatmapChartOptions, i as quadrantCenter, a as quadrantChartOptions, o as quadrantOf, T as scenePrimitives, s as sparklineOptions };

package/dist/charts/react/Chart.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require("../engine/chart.cjs");let t=require("react"),n=require("react/jsx-runtime");var r=(e,t)=>e===void 0?t:typeof e==`number`?`${e}px`:e,i=e=>({series:e.series,xAxis:e.xAxis,yAxis:e.yAxis,renderer:e.renderer,legend:e.legend,tooltip:e.tooltip,crosshair:e.crosshair,annotations:e.annotations,interaction:e.interaction,padding:e.padding,palette:e.palette,ariaLabel:e.ariaLabel});function a({options:i,height:a,width:o,className:s,style:c,handleRef:l,...u}){let d=(0,t.useRef)(null),f=(0,t.useRef)(null),p=(0,t.useRef)(u),m=(0,t.useRef)(i);return(0,t.useEffect)(()=>{p.current=u}),(0,t.useEffect)(()=>{let t=d.current;if(!t)return;let n=e.createChart(t,m.current);f.current=n;let r=[n.on(`hover`,e=>p.current.onHover?.(e)),n.on(`click`,e=>p.current.onPointClick?.(e)),n.on(`zoom`,e=>p.current.onZoom?.(e)),n.on(`renderer`,e=>p.current.onRendererChange?.(e))];return()=>{r.forEach(e=>e()),n.destroy(),f.current=null}},[]),(0,t.useEffect)(()=>{m.current!==i&&(m.current=i,f.current?.setOptions(i))},[i]),(0,t.useImperativeHandle)(l,()=>({resetZoom:()=>f.current?.resetZoom(),getView:()=>f.current?.getView()??null,setView:e=>f.current?.setView(e),getRenderer:()=>f.current?.getRenderer()??null,getInstance:()=>f.current}),[]),(0,n.jsx)(`div`,{ref:d,className:s,style:{position:`relative`,width:r(o,`100%`),height:r(a,`320px`),...c}})}function o(e){let{height:t,width:r,className:o,style:s,ref:c,onHover:l,onPointClick:u,onZoom:d,onRendererChange:f}=e;return(0,n.jsx)(a,{options:i(e),height:t,width:r,className:o,style:s,handleRef:c,onHover:l,onPointClick:u,onZoom:d,onRendererChange:f})}exports.Chart=o,exports.ChartBase=a,exports.engineOptions=i;
+"use client";const e=require("../engine/chart.cjs");let t=require("react"),n=require("react-dom"),r=require("react/jsx-runtime");var i=(e,t)=>e===void 0?t:typeof e==`number`?`${e}px`:e,a=e=>({series:e.series,xAxis:e.xAxis,yAxis:e.yAxis,renderer:e.renderer,legend:e.legend,tooltip:e.tooltip,crosshair:e.crosshair,annotations:e.annotations,interaction:e.interaction,padding:e.padding,palette:e.palette,ariaLabel:e.ariaLabel,stackMode:e.stackMode}),o=e=>{if(typeof e!=`object`||!e)return!1;let t=Object.getPrototypeOf(e);return t===Object.prototype||t===null},s=(e,t)=>{let n=Object.keys(e);return n.length===Object.keys(t).length&&n.every(n=>e[n]===t[n]&&Object.prototype.hasOwnProperty.call(t,n))},c=(e,t)=>e===t?!0:Array.isArray(e)&&Array.isArray(t)?e.length===t.length&&e.every((e,n)=>e===t[n]):o(e)&&o(t)&&s(e,t),l=(e,t)=>{if(e===t)return!0;let n=Object.keys(e);return n.length===Object.keys(t).length&&n.every(n=>{if(!Object.prototype.hasOwnProperty.call(t,n))return!1;if(n!==`series`)return c(e[n],t[n]);let r=e.series,i=t.series;return r===i||r.length===i.length&&r.every((e,t)=>e===i[t]||s(e,i[t]))})},u=(e,t)=>!!e&&e.x===t.x&&e.xLabel===t.xLabel&&e.items.length===t.items.length&&e.items.every((e,n)=>s(e,t.items[n]));function d({options:a,height:o,width:s,className:c,style:d,handleRef:f,renderTooltip:p,overlay:m,...h}){let g=(0,t.useRef)(null),_=(0,t.useRef)(null),v=(0,t.useRef)(h),y=(0,t.useRef)(p),b=(0,t.useRef)(null),[x,S]=(0,t.useState)(null),[C,w]=(0,t.useState)(null),T=(0,t.useMemo)(()=>typeof document>`u`?null:document.createElement(`div`),[]),[E,D]=(0,t.useState)(a);E!==a&&!l(E,a)&&D(a);let O=!!p,k=(0,t.useMemo)(()=>{if(!O||!T||E.tooltip===!1)return E;let e=typeof E.tooltip==`object`?E.tooltip:{};return{...E,tooltip:{...e,render:e=>y.current?(u(b.current,e)||(b.current=e,(0,n.flushSync)(()=>S(e))),T):null}}},[E,O,T]),A=(0,t.useRef)(k);return(0,t.useEffect)(()=>{v.current=h,y.current=p}),(0,t.useEffect)(()=>{let t=g.current;if(!t)return;let n=e.createChart(t,A.current);_.current=n;let r=[n.on(`hover`,e=>v.current.onHover?.(e)),n.on(`click`,e=>v.current.onPointClick?.(e)),n.on(`plotClick`,e=>v.current.onPlotClick?.(e)),n.on(`zoom`,e=>v.current.onZoom?.(e)),n.on(`renderer`,e=>v.current.onRendererChange?.(e)),n.on(`drag`,e=>v.current.onDrag?.(e)),n.on(`drop`,e=>v.current.onDrop?.(e)),n.on(`layout`,e=>w(e))];return()=>{r.forEach(e=>e()),n.destroy(),_.current=null}},[]),(0,t.useEffect)(()=>{A.current!==k&&(A.current=k,_.current?.setOptions(k))},[k]),(0,t.useImperativeHandle)(f,()=>({resetZoom:()=>_.current?.resetZoom(),getView:()=>_.current?.getView()??null,setView:e=>_.current?.setView(e),getRenderer:()=>_.current?.getRenderer()??null,getInstance:()=>_.current}),[]),(0,r.jsxs)(`div`,{className:c,style:{position:`relative`,width:i(s,`100%`),height:i(o,`320px`),...d},children:[(0,r.jsx)(`div`,{ref:g,style:{position:`absolute`,inset:0}}),m&&C&&(0,r.jsx)(`div`,{className:`minerva-chart-overlay`,style:{position:`absolute`,left:C.x,top:C.y,width:C.width,height:C.height,pointerEvents:`none`},children:m(C)}),T&&x&&p&&(0,n.createPortal)(p(x),T)]})}function f(e){let{height:t,width:n,className:i,style:o,ref:s,onHover:c,onPointClick:l,onPlotClick:u,onZoom:f,onRendererChange:p,renderTooltip:m}=e;return(0,r.jsx)(d,{options:a(e),height:t,width:n,className:i,style:o,handleRef:s,onHover:c,onPointClick:l,onPlotClick:u,onZoom:f,onRendererChange:p,renderTooltip:m})}exports.Chart=f,exports.ChartBase=d,exports.engineOptions=a,exports.sameOptions=l;
 //# sourceMappingURL=Chart.cjs.map

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","isPlainObject","proto","shallowEqual","keys","a","b","key","sameValue","v","i","sameOptions","sa","sb","s","sameTooltipEvent","item","ChartBase","handlers","containerRef","chartRef","handlersRef","tooltipRef","renderTooltip","tipEventRef","tipEvent","setTipEvent","plot","setPlot","tipHost","stable","setStable","options","hasTooltip","resolved","base","event","optionsRef","container","chart","offs","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\" | \"stackMode\">,\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  stackMode: props.stackMode,\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\nconst isPlainObject = (value: unknown): value is Record<string, unknown> => {\n  if (typeof value !== \"object\" || value === null) return false;\n  const proto = Object.getPrototypeOf(value);\n  return proto === Object.prototype || proto === null;\n};\n\n/** Same keys with identical values */\nconst shallowEqual = (\n  a: Record<string, unknown>,\n  b: Record<string, unknown>,\n): boolean => {\n  const keys = Object.keys(a);\n  if (keys.length !== Object.keys(b).length) return false;\n  return keys.every(\n    (key) => a[key] === b[key] && Object.prototype.hasOwnProperty.call(b, key),\n  );\n};\n\n/**\n * Identical values, or plain arrays / objects whose items are identical\n * (`[\"#f00\"]`, `{ title: \"x\" }` written inline)\n */\nconst sameValue = (a: unknown, b: unknown): boolean => {\n  if (a === b) return true;\n  if (Array.isArray(a) && Array.isArray(b))\n    return a.length === b.length && a.every((v, i) => v === b[i]);\n  return isPlainObject(a) && isPlainObject(b) && shallowEqual(a, b);\n};\n\n/**\n * Whether `b` describes the same chart as `a`: top-level options compared by\n * identity (or one level deep for inline arrays / objects), series compared\n * one by one, each series shallowly (inline `series={[{ name, data }]}`\n * with a stable `data` stays equal). Data is never compared by content.\n */\nexport const sameOptions = (a: ChartOptions, b: ChartOptions): boolean => {\n  if (a === b) return true;\n  const keys = Object.keys(a) as (keyof ChartOptions)[];\n  if (keys.length !== Object.keys(b).length) return false;\n  return keys.every((key) => {\n    if (!Object.prototype.hasOwnProperty.call(b, key)) return false;\n    if (key !== \"series\") return sameValue(a[key], b[key]);\n    const sa = a.series;\n    const sb = b.series;\n    return (\n      sa === sb ||\n      (sa.length === sb.length &&\n        sa.every(\n          (s, i) =>\n            s === sb[i] ||\n            shallowEqual(\n              s as unknown as Record<string, unknown>,\n              sb[i] as unknown as Record<string, unknown>,\n            ),\n        ))\n    );\n  });\n};\n\n/** Same hovered points with the same values (same tooltip content) */\nconst sameTooltipEvent = (\n  a: ChartHoverEvent | null,\n  b: ChartHoverEvent,\n): boolean =>\n  !!a &&\n  a.x === b.x &&\n  a.xLabel === b.xLabel &&\n  a.items.length === b.items.length &&\n  a.items.every((item, i) =>\n    shallowEqual(\n      item as unknown as Record<string, unknown>,\n      b.items[i] as unknown as Record<string, unknown>,\n    ),\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 tipEventRef = useRef<ChartHoverEvent | null>(null);\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  // Parents pass a new options object on every render: keep the previous\n  // one while it describes the same chart, so the engine isn't rebuilt\n  // (state derived during render, the pattern React documents for it)\n  const [stable, setStable] = useState(options);\n  if (stable !== options && !sameOptions(stable, options)) setStable(options);\n  // the render callback reads the latest `renderTooltip` through a ref: only\n  // its presence matters here (inline callbacks change on every render)\n  const hasTooltip = !!renderTooltip;\n\n  const resolved = useMemo((): ChartOptions => {\n    if (!hasTooltip || !tipHost || stable.tooltip === false) return stable;\n    const base = typeof stable.tooltip === \"object\" ? stable.tooltip : {};\n    return {\n      ...stable,\n      tooltip: {\n        ...base,\n        render: (event) => {\n          if (!tooltipRef.current) return null;\n          // render synchronously so the engine measures the final size;\n          // pointer moves over the same points keep the rendered content\n          if (!sameTooltipEvent(tipEventRef.current, event)) {\n            tipEventRef.current = event;\n            flushSync(() => setTipEvent(event));\n          }\n          return tipHost;\n        },\n      },\n    };\n  }, [stable, hasTooltip, 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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"}