minerva-design 1.1.0 → 1.2.0

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

@@ -0,0 +1 @@
+{"version":3,"file":"scene.js","names":["DEFAULT_PADDING","fallbackResolve","fallback","resolveAnnotations","resolve","theme","annotations","a","color","mix","layoutChart","input","yCount","model","height","yTicks","axisTicks","view","yLabelWidth","label","measure","categoryWidth","step","i","padding","plot","computePlot","xCount","xTicks","createScales","collectPointLabels","labels","series","texts","count","text","xi","x","yi","y","d","size","s","pointOf","xv","yv","sc","candidateOf","p","inside","half","base","px","py","dotSize","nearestScatter","radius","slop","rx","ry","best","bestDist","gridOf","nearestX","sorted","nearestIndex","bestD","hoverItemOf","pc","index","toCss","eventOf","candidates","b","items","c","hitTest","margin","scatter","others","all","bestDx","bandPx","aligned","first","event","sameHover","it","tooltipContent","yFormat","rows","hoverMarks","marks","cx","showsCrosshair","crosshair"],"sources":["../../../../charts/src/engine/scene.ts"],"sourcesContent":["// The DOM-free half of a chart: annotations, layout, point labels, hit\n// testing and tooltip content. Shared by createChart (DOM + GPU),\n// createCanvasChart (any 2D context) and the React Native views.\n\nimport { axisTicks, type AxisTicks } from \"./axis\";\nimport { mix, toCss, type Rgba } from \"./color\";\nimport { nearestIndex } from \"./data\";\nimport { computePlot, createScales, type Rect, type Scales } from \"./layout\";\nimport { gridOf, type ChartModel, type SeriesModel } from \"./model\";\nimport type { PointLabel, ResolvedAnnotation } from \"./overlay\";\nimport type { ChartTheme } from \"./theme\";\nimport type {\n  ChartAnnotation,\n  ChartHoverEvent,\n  ChartHoverItem,\n  ChartPadding,\n  ChartView,\n} from \"./types\";\n\nexport const MAX_POINT_LABELS = 300;\nexport const DEFAULT_PADDING = { top: 12, right: 16, bottom: 4, left: 4 };\n\nexport const fallbackResolve = (_value: string, fallback: Rgba) => fallback;\n\n/** Annotation colors resolved against the theme */\nexport const resolveAnnotations = (\n  annotations: readonly ChartAnnotation[] | undefined,\n  theme: ChartTheme,\n): ResolvedAnnotation[] => {\n  const resolve = theme.resolve ?? fallbackResolve;\n  return (annotations ?? []).map((a) => {\n    if (a.type === \"rect\") {\n      const color = a.color ? resolve(a.color, theme.primary) : theme.primary;\n      return {\n        type: \"rect\",\n        x0: a.x0,\n        x1: a.x1,\n        y0: a.y0,\n        y1: a.y1,\n        color,\n        opacity: a.opacity ?? 0.08,\n        label: a.label,\n        labelPosition: a.labelPosition ?? \"top-left\",\n        labelColor: a.labelColor\n          ? resolve(a.labelColor, color)\n          : mix(color, theme.text, 0.2),\n      };\n    }\n    if (a.type === \"text\") {\n      return {\n        type: \"text\",\n        x: a.x,\n        y: a.y,\n        text: a.text,\n        anchor: a.anchor ?? \"center\",\n        color: a.color ? resolve(a.color, theme.textMuted) : theme.textMuted,\n        weight: a.weight ?? 500,\n      };\n    }\n    return {\n      type: \"line\",\n      axis: a.axis,\n      value: a.value,\n      color: a.color ? resolve(a.color, theme.textMuted) : theme.textMuted,\n      width: a.width ?? 1,\n      dash: [...(a.dash ?? [4, 4])],\n      label: a.label,\n    };\n  });\n};\n\nexport interface ChartLayout {\n  plot: Rect;\n  scales: Scales;\n  xTicks: AxisTicks;\n  yTicks: AxisTicks;\n}\n\nexport interface LayoutInput {\n  model: ChartModel;\n  view: ChartView;\n  theme: ChartTheme;\n  /** Size of the drawing area (legend excluded), CSS pixels */\n  width: number;\n  height: number;\n  padding?: ChartPadding;\n  /** Offset of the drawing area (e.g. below a legend) */\n  top?: number;\n  /** Width of a tick label in the theme font */\n  measure: (text: string) => number;\n}\n\n/** Ticks, room for the axes and the plot rectangle */\nexport const layoutChart = (input: LayoutInput): ChartLayout => {\n  const { model, view, theme, width, height, measure } = input;\n  // same count as the nice range of the model (its ends are then ticks),\n  // fewer on short charts\n  const yCount =\n    model.y.tickCount ??\n    (height >= 220 ? 5 : Math.max(2, Math.round((height - 48) / 52)));\n  const yTicks = axisTicks(model.y, view.y, yCount);\n  let yLabelWidth = 0;\n  if (model.y.visible) {\n    for (const label of yTicks.labels)\n      yLabelWidth = Math.max(yLabelWidth, measure(label));\n  }\n  let categoryWidth = 48;\n  if (model.x.type === \"category\") {\n    categoryWidth = 0;\n    const step = Math.max(1, Math.floor(model.x.categories.length / 200));\n    for (let i = 0; i < model.x.categories.length; i += step) {\n      categoryWidth = Math.max(categoryWidth, measure(model.x.categories[i]));\n    }\n  }\n  const padding = { ...DEFAULT_PADDING, ...input.padding };\n  const plot = computePlot({\n    width,\n    height,\n    padding,\n    yLabelWidth: model.y.visible ? Math.ceil(yLabelWidth) : 0,\n    xAxisVisible: model.x.visible,\n    xTitle: !!model.x.title && model.x.visible,\n    yTitle: !!model.y.title && model.y.visible,\n    fontSize: theme.fontSize,\n  });\n  if (input.top) plot.y += input.top;\n  const xCount =\n    model.x.type === \"category\"\n      ? Math.max(1, Math.floor(plot.width / (categoryWidth + 14)))\n      : (model.x.tickCount ?? Math.max(2, Math.floor(plot.width / 96)));\n  const xTicks = axisTicks(model.x, view.x, xCount);\n  const scales = createScales(plot, view, model.x.reverse, model.y.reverse);\n  return { plot, scales, xTicks, yTicks };\n};\n\n/** Labels of the visible scatter points (`showLabels`) */\nexport const collectPointLabels = (\n  model: ChartModel,\n  view: ChartView,\n  s: Scales,\n): PointLabel[] => {\n  const labels: PointLabel[] = [];\n  for (const series of model.series) {\n    if (series.hidden || series.type !== \"scatter\" || !series.showLabels)\n      continue;\n    const { x, y, count, labels: texts, size } = series.cols;\n    if (!texts) continue;\n    for (let i = 0; i < count && labels.length < MAX_POINT_LABELS; i++) {\n      const text = texts[i];\n      if (!text) continue;\n      const xi = x[i];\n      const yi = y[i];\n      if (xi < view.x[0] || xi > view.x[1] || yi < view.y[0] || yi > view.y[1])\n        continue;\n      const d = size && size[i] > 0 ? size[i] : series.pointSize;\n      labels.push({ x: s.xToPx(xi), y: s.yToPx(yi), r: d / 2, text });\n    }\n  }\n  return labels;\n};\n\n// ---------------------------------------------------------------- hit tests\n\ninterface Candidate {\n  series: SeriesModel;\n  index: number;\n  /** Pixel position of the point */\n  px: number;\n  py: number;\n  dx: number;\n  dist: number;\n  inside: boolean;\n}\n\n/** Pixel position of a point (the top of a bar) */\nexport const pointOf = (s: SeriesModel, i: number, sc: Scales) => {\n  const xv = s.cols.x[i] + (s.type === \"bar\" ? s.barOffset : 0);\n  const yv = s.type === \"bar\" && s.barTop ? s.barTop[i] : s.cols.y[i];\n  return { px: sc.xToPx(xv), py: sc.yToPx(yv) };\n};\n\nconst candidateOf = (\n  s: SeriesModel,\n  i: number,\n  px: number,\n  py: number,\n  sc: Scales,\n): Candidate => {\n  const p = pointOf(s, i, sc);\n  let inside = false;\n  if (s.type === \"bar\" && s.barBase) {\n    const half = s.barHalfWidth / sc.xPerPx;\n    const base = sc.yToPx(s.barBase[i]);\n    inside =\n      Math.abs(px - p.px) <= half &&\n      py >= Math.min(base, p.py) - 2 &&\n      py <= Math.max(base, p.py) + 2;\n  }\n  return {\n    series: s,\n    index: i,\n    px: p.px,\n    py: p.py,\n    dx: Math.abs(sc.xToPx(s.cols.x[i]) - px),\n    dist: inside ? 0 : Math.hypot(p.px - px, p.py - py),\n    inside,\n  };\n};\n\n/** Diameter of a scatter dot */\nexport const dotSize = (s: SeriesModel, i: number) =>\n  s.cols.size && s.cols.size[i] > 0 ? s.cols.size[i] : s.pointSize;\n\nconst nearestScatter = (\n  s: SeriesModel,\n  px: number,\n  py: number,\n  sc: Scales,\n  slop: number,\n) => {\n  const radius = Math.max(s.pointSize / 2 + 6, 10) + slop;\n  const xv = sc.pxToX(px);\n  const yv = sc.pxToY(py);\n  const rx = radius * sc.xPerPx;\n  const ry = radius * sc.yPerPx;\n  let best = -1;\n  let bestDist = Infinity;\n  const { x, y } = s.cols;\n  gridOf(s).query(xv - rx, xv + rx, yv - ry, yv + ry, (i) => {\n    const d = Math.hypot(sc.xToPx(x[i]) - px, sc.yToPx(y[i]) - py);\n    const reach = Math.max(dotSize(s, i) / 2 + 4, 8) + slop;\n    if (d <= reach && d <= bestDist) {\n      bestDist = d;\n      best = i;\n    }\n  });\n  return best;\n};\n\nconst nearestX = (s: SeriesModel, xv: number) => {\n  const { x, y, count, sorted } = s.cols;\n  if (sorted) return nearestIndex(x, y, count, xv);\n  let best = -1;\n  let bestD = Infinity;\n  for (let i = 0; i < count; i++) {\n    if (!Number.isFinite(y[i])) continue;\n    const d = Math.abs(x[i] - xv);\n    if (d < bestD) {\n      bestD = d;\n      best = i;\n    }\n  }\n  return best;\n};\n\n/** Hover payload item of a point */\nexport const hoverItemOf = (s: SeriesModel, index: number): ChartHoverItem => {\n  const pc = s.pointColors?.[index];\n  const label = s.cols.labels?.[index];\n  return {\n    seriesIndex: s.index,\n    seriesId: s.id,\n    seriesName: s.name,\n    index,\n    x: s.cols.x[index],\n    y: s.cols.y[index],\n    color: pc ? toCss(pc) : s.colorCss,\n    ...(label !== undefined ? { label } : {}),\n  };\n};\n\nconst eventOf = (\n  candidates: Candidate[],\n  xTicks: AxisTicks | null,\n): ChartHoverEvent | null => {\n  if (!candidates.length) return null;\n  candidates.sort((a, b) => a.series.index - b.series.index);\n  const items = candidates.map((c) => hoverItemOf(c.series, c.index));\n  const x = items[0].x;\n  return { items, x, xLabel: xTicks?.formatValue(x) ?? String(x) };\n};\n\n/**\n * Points under a pixel of the stage: the nearest point (scatter / `nearest`\n * tooltips) or every series at the nearest x (`axis` tooltips).\n * `slop` widens the reach of the dots (touch screens).\n */\nexport const hitTest = (\n  model: ChartModel,\n  sc: Scales,\n  xTicks: AxisTicks | null,\n  px: number,\n  py: number,\n  slop = 0,\n): ChartHoverEvent | null => {\n  const { plot } = sc;\n  const margin = 6 + slop;\n  if (\n    px < plot.x - margin ||\n    px > plot.x + plot.width + margin ||\n    py < plot.y - margin ||\n    py > plot.y + plot.height + margin\n  ) {\n    return null;\n  }\n  const xv = sc.pxToX(px);\n  const scatter: Candidate[] = [];\n  const others: Candidate[] = [];\n  for (const s of model.series) {\n    if (s.hidden || s.cols.count === 0) continue;\n    if (s.type === \"scatter\") {\n      const i = nearestScatter(s, px, py, sc, slop);\n      if (i >= 0) scatter.push(candidateOf(s, i, px, py, sc));\n    } else {\n      const i = nearestX(s, xv);\n      if (i >= 0) others.push(candidateOf(s, i, px, py, sc));\n    }\n  }\n  if (model.tooltipMode === \"nearest\") {\n    const all = [...scatter, ...others].filter(\n      (c) => c.inside || c.series.type === \"scatter\" || c.dist <= 32 + slop,\n    );\n    if (!all.length) return null;\n    const best = all.reduce((a, b) => (b.dist <= a.dist ? b : a));\n    return eventOf([best], xTicks);\n  }\n  if (!others.length) {\n    if (!scatter.length) return null;\n    return eventOf(\n      [scatter.reduce((a, b) => (b.dist <= a.dist ? b : a))],\n      xTicks,\n    );\n  }\n  const bestDx = Math.min(...others.map((c) => c.dx));\n  const bandPx = model.x.type === \"category\" ? 0.5 / sc.xPerPx : 0;\n  const aligned = others.filter((c) => c.dx <= bestDx + Math.max(1, bandPx));\n  const first = aligned.reduce((a, b) => (b.dx < a.dx ? b : a));\n  const ordered = [first, ...aligned.filter((c) => c !== first), ...scatter];\n  const event = eventOf(ordered, xTicks);\n  if (event) {\n    event.x = hoverItemOf(first.series, first.index).x;\n    event.xLabel = xTicks?.formatValue(event.x) ?? String(event.x);\n  }\n  return event;\n};\n\n/** Whether two hover payloads point at the same points */\nexport const sameHover = (\n  a: ChartHoverEvent | null,\n  b: ChartHoverEvent | null,\n): boolean =>\n  a === b ||\n  (!!a &&\n    !!b &&\n    a.items.length === b.items.length &&\n    a.items.every(\n      (it, i) =>\n        it.index === b.items[i].index &&\n        it.seriesIndex === b.items[i].seriesIndex,\n    ));\n\n// ------------------------------------------------------------------ tooltip\n\nexport interface TooltipRow {\n  /** Swatch color (CSS) */\n  color: string | null;\n  name: string;\n  value: string;\n}\n\nexport interface TooltipContent {\n  title: string;\n  /** Swatch of the title (single scatter point) */\n  titleColor: string | null;\n  rows: TooltipRow[];\n}\n\n/** Default tooltip content of a hover payload */\nexport const tooltipContent = (\n  model: ChartModel,\n  event: ChartHoverEvent,\n  yTicks: AxisTicks | null,\n): TooltipContent => {\n  const yFormat = yTicks?.formatValue ?? String;\n  const scatterOnly = event.items.every(\n    (it) => model.series[it.seriesIndex].type === \"scatter\",\n  );\n  if (scatterOnly && event.items.length === 1) {\n    const it = event.items[0];\n    const rows: TooltipRow[] = [\n      { color: null, name: model.x.title ?? \"x\", value: event.xLabel },\n      { color: null, name: model.y.title ?? \"y\", value: yFormat(it.y) },\n    ];\n    if (it.label !== undefined && model.series.length > 1)\n      rows.push({ color: null, name: \"\", value: it.seriesName });\n    return { title: it.label ?? it.seriesName, titleColor: it.color, rows };\n  }\n  return {\n    title: event.xLabel,\n    titleColor: null,\n    rows: event.items.map((it) => ({\n      color: it.color,\n      name: it.label ? `${it.seriesName} · ${it.label}` : it.seriesName,\n      value: yFormat(it.y),\n    })),\n  };\n};\n\n/** Shape of the hover marker of an item: a ring on a point, or a bar highlight */\nexport type HoverMark =\n  | { kind: \"dot\"; x: number; y: number; size: number; color: string }\n  | { kind: \"bar\"; x: number; y: number; width: number; height: number };\n\n/** Markers of the hovered points (pixels of the stage) */\nexport const hoverMarks = (\n  model: ChartModel,\n  sc: Scales,\n  event: ChartHoverEvent,\n): HoverMark[] => {\n  const marks: HoverMark[] = [];\n  const { plot } = sc;\n  for (const it of event.items) {\n    const s = model.series[it.seriesIndex];\n    if (s.type === \"bar\" && s.barBase && s.barTop) {\n      const cx = sc.xToPx(it.x + s.barOffset);\n      const half = Math.max(s.barHalfWidth / sc.xPerPx, 1);\n      const a = sc.yToPx(s.barBase[it.index]);\n      const b = sc.yToPx(s.barTop[it.index]);\n      marks.push({\n        kind: \"bar\",\n        x: cx - half,\n        y: Math.min(a, b),\n        width: half * 2,\n        height: Math.max(1, Math.abs(a - b)),\n      });\n      continue;\n    }\n    const px = sc.xToPx(it.x);\n    const py = sc.yToPx(it.y);\n    if (\n      px < plot.x - 1 ||\n      px > plot.x + plot.width + 1 ||\n      py < plot.y - 1 ||\n      py > plot.y + plot.height + 1\n    ) {\n      continue;\n    }\n    const size =\n      s.type === \"scatter\"\n        ? dotSize(s, it.index) + 6\n        : Math.max(10, s.lineWidth * 2 + 6);\n    marks.push({ kind: \"dot\", x: px, y: py, size, color: it.color });\n  }\n  return marks;\n};\n\n/** Whether the guide line follows the pointer */\nexport const showsCrosshair = (\n  model: ChartModel,\n  event: ChartHoverEvent,\n  crosshair: boolean | undefined,\n) =>\n  crosshair ??\n  (model.tooltipMode === \"axis\" &&\n    event.items.some((it) => model.series[it.seriesIndex].type !== \"scatter\"));\n"],"mappings":"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"}

package/dist/charts/engine/theme.cjs

@@ -1,2 +1,2 @@
-const e=require("./color.cjs");var t=[`#4f46e5`,`#10b981`,`#f59e0b`,`#ef4444`,`#0ea5e9`,`#8b5cf6`,`#14b8a6`,`#f97316`],n=(e,t)=>e?.getPropertyValue(t).trim()??``,r=(r,i)=>{let a=r&&typeof getComputedStyle==`function`?getComputedStyle(r):null,o=(t,i)=>{for(let i of t)if(n(a,i))return e.resolveColor(`var(${i})`,r);return e.resolveColor(i,r)},s=o([`--surface-color`,`--background-color`],`#ffffff`),c=o([`--text-color`],`#1f2937`),l=o([`--text-secondary-color`,`--text-muted-color`],`#6b7280`),u=o([`--border-color`],`#e5e7eb`),d;if(i&&i.length)d=i.map(t=>e.resolveColor(t,r));else{let i=[];for(let t=1;t<=8;t++){let o=`--chart-series-${t}`;n(a,o)&&i.push(e.resolveColor(`var(${o})`,r))}d=i.length?i:[...[`--primary-color`,`--success-color`,`--warning-color`,`--danger-color`,`--info-color`].map((i,o)=>n(a,i)?e.resolveColor(`var(${i})`,r):e.resolveColor(t[o],r)),...t.slice(5).map(t=>e.resolveColor(t,r))]}let f=n(a,`--font-family-sans`)||(a?.fontFamily??``)||`system-ui, -apple-system, 'Segoe UI', sans-serif`;return{palette:d,text:c,textMuted:l,grid:e.mix(s,u,.75),axis:u,background:s,surface:s,primary:d[0],fontFamily:f,fontSize:11}},i=e=>{if(typeof document>`u`)return()=>{};let t=[];if(typeof MutationObserver==`function`){let n=new MutationObserver(e);for(let e of[document.documentElement,document.body])e&&n.observe(e,{attributes:!0,attributeFilter:[`class`,`style`,`data-theme`,`data-mode`]});t.push(()=>n.disconnect())}if(typeof matchMedia==`function`){let n=matchMedia(`(prefers-color-scheme: dark)`);n.addEventListener?.(`change`,e),t.push(()=>n.removeEventListener?.(`change`,e))}return()=>t.forEach(e=>e())};exports.readTheme=r,exports.watchTheme=i;
+const e=require("./color.cjs");var t=[`#4f46e5`,`#10b981`,`#f59e0b`,`#ef4444`,`#0ea5e9`,`#8b5cf6`,`#14b8a6`,`#f97316`],n=(e,t)=>e?.getPropertyValue(t).trim()??``,r=(t,r)=>{let i=t&&typeof getComputedStyle==`function`?getComputedStyle(t):null;return o(e=>n(i,e),e.domColorResolver(t),r,i?.fontFamily??``)},i=(e={},t)=>{let n=e.variables??{};return{...o(e=>n[e]?.trim()??``,a(n),t?.length?t:e.palette,``),...e.fontFamily?{fontFamily:e.fontFamily}:{},...e.fontSize?{fontSize:e.fontSize}:{}}},a=t=>(n,r)=>e.resolveStaticColor(n,t,r),o=(n,r,i,a)=>{let o=[.4,.4,.4,1],s=e=>r(e,o),c=(e,t)=>{for(let t of e)if(n(t))return s(`var(${t})`);return s(t)},l=c([`--surface-color`,`--background-color`],`#ffffff`),u=c([`--text-color`],`#1f2937`),d=c([`--text-secondary-color`,`--text-muted-color`],`#6b7280`),f=c([`--border-color`],`#e5e7eb`),p;if(i&&i.length)p=i.map(e=>s(e));else{let e=[];for(let t=1;t<=8;t++){let r=`--chart-series-${t}`;n(r)&&e.push(s(`var(${r})`))}p=e.length?e:[...[`--primary-color`,`--success-color`,`--warning-color`,`--danger-color`,`--info-color`].map((e,r)=>n(e)?s(`var(${e})`):s(t[r])),...t.slice(5).map(e=>s(e))]}let m=n(`--font-family-sans`)||a||`system-ui, -apple-system, 'Segoe UI', sans-serif`;return{palette:p,text:u,textMuted:d,grid:e.mix(l,f,.75),axis:f,background:l,surface:l,primary:p[0],fontFamily:m,fontSize:11,resolve:r}},s=e=>{if(typeof document>`u`)return()=>{};let t=[];if(typeof MutationObserver==`function`){let n=new MutationObserver(e);for(let e of[document.documentElement,document.body])e&&n.observe(e,{attributes:!0,attributeFilter:[`class`,`style`,`data-theme`,`data-mode`]});t.push(()=>n.disconnect())}if(typeof matchMedia==`function`){let n=matchMedia(`(prefers-color-scheme: dark)`);n.addEventListener?.(`change`,e),t.push(()=>n.removeEventListener?.(`change`,e))}return()=>t.forEach(e=>e())};exports.createTheme=i,exports.readTheme=r,exports.staticColorResolver=a,exports.watchTheme=s;
 //# sourceMappingURL=theme.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"theme.cjs","names":["resolveColor","mix","require_color","DEFAULT_PALETTE","readVar","style","name","readTheme","element","color","names","fallback","background","text","textMuted","border","colors","palette","c","custom","i","fontFamily","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":"+BAmBA,IAAMG,EAAkB,CACtB,UACA,UACA,UACA,UACA,UACA,UACA,UACA,SACF,EAEMC,GAAW,EAAmC,IAClDC,GAAO,iBAAiBC,CAAI,CAAC,CAAC,KAAK,GAAK,GAG7BC,GACX,EACA,IACe,CACf,IAAMF,EACJG,GAAW,OAAO,kBAAqB,WACnC,iBAAiBA,CAAO,EACxB,KACAC,GAAS,EAAiB,IAA2B,CACzD,IAAK,IAAMH,KAAQI,EACjB,GAAIN,EAAQC,EAAOC,CAAI,EAAG,OAAON,EAAAA,aAAa,OAAOM,EAAK,GAAIE,CAAO,EAEvE,OAAOR,EAAAA,aAAaW,EAAUH,CAAO,CACvC,EAEMI,EAAaH,EACjB,CAAC,kBAAmB,oBAAoB,EACxC,SACF,EACMI,EAAOJ,EAAM,CAAC,cAAc,EAAG,SAAS,EACxCK,EAAYL,EAChB,CAAC,yBAA0B,oBAAoB,EAC/C,SACF,EACMM,EAASN,EAAM,CAAC,gBAAgB,EAAG,SAAS,EAE9CO,EACJ,GAAIC,GAAWA,EAAQ,OACrB,EAASA,EAAQ,IAAK,GAAMjB,EAAAA,aAAakB,EAAGV,CAAO,CAAC,MAC/C,CACL,IAAMW,EAAiB,CAAC,EACxB,IAAK,IAAIC,EAAI,EAAGA,GAAK,EAAG,IAAK,CAC3B,IAAMd,EAAO,kBAAkBc,IAC3BhB,EAAQC,EAAOC,CAAI,GACrBa,EAAO,KAAKnB,EAAAA,aAAa,OAAOM,EAAK,GAAIE,CAAO,CAAC,CACrD,CACA,AAcEQ,EAdEG,EAAO,OACAA,EAaA,CACP,GAZa,CACb,kBACA,kBACA,kBACA,iBACA,cACF,CAAC,CAAC,KAAK,EAAM,IACXf,EAAQC,EAAOC,CAAI,EACfN,EAAAA,aAAa,OAAOM,EAAK,GAAIE,CAAO,EACpCR,EAAAA,aAAaG,EAAgBiB,GAAIZ,CAAO,CAGzC,EACH,GAAGL,EAAgB,MAAM,CAAC,CAAC,CAAC,IAAK,GAAMH,EAAAA,aAAakB,EAAGV,CAAO,CAAC,CACjE,CAEJ,CAEA,IAAMa,EACJjB,EAAQC,EAAO,oBAAoB,IAClCA,GAAO,YAAc,KACtB,mDAEF,MAAO,CACL,QAASW,EACT,OACA,YACA,KAAMf,EAAAA,IAAIW,EAAYG,EAAQ,GAAI,EAClC,KAAMA,EACN,aACA,QAASH,EACT,QAASI,EAAO,GAChB,aACA,SAAU,EACZ,CACF,EAMaM,EAAc,GAAuC,CAChE,GAAI,OAAO,SAAa,IAAa,UAAa,CAAC,EACnD,IAAMC,EAA2B,CAAC,EAClC,GAAI,OAAO,kBAAqB,WAAY,CAC1C,IAAMC,EAAW,IAAI,iBAAiBC,CAAQ,EAC9C,IAAK,IAAMC,IAAQ,CAAC,SAAS,gBAAiB,SAAS,IAAI,EACrDA,GACFF,EAAS,QAAQE,EAAM,CACrB,WAAY,GACZ,gBAAiB,CAAC,QAAS,QAAS,aAAc,WAAW,CAC/D,CAAC,EAGLH,EAAS,SAAWC,EAAS,WAAW,CAAC,CAC3C,CACA,GAAI,OAAO,YAAe,WAAY,CACpC,IAAMG,EAAQ,WAAW,8BAA8B,EACvDA,EAAM,mBAAmB,SAAUF,CAAQ,EAC3CF,EAAS,SAAWI,EAAM,sBAAsB,SAAUF,CAAQ,CAAC,CACrE,CACA,UAAaF,EAAS,QAAS,GAAOK,EAAG,CAAC,CAC5C"}
+{"version":3,"file":"theme.cjs","names":["domColorResolver","resolveStaticColor","mix","require_color","DEFAULT_PALETTE","readVar","style","name","readTheme","element","buildTheme","palette","createTheme","variables","input","staticColorResolver","value","fallback","fallbackGray","resolveColor","resolve","color","names","readVariable","background","text","textMuted","border","colors","c","custom","i","fontFamily","inheritedFont","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  mix,\n  resolveStaticColor,\n  type ColorResolver,\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/** 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  return buildTheme(\n    (name) => readVar(style, name),\n    domColorResolver(element),\n    palette,\n    style?.fontFamily ?? \"\",\n  );\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/theme.d.cts

@@ -1,4 +1,4 @@
-import { Rgba } from './color.cjs';
+import { ColorResolver, Rgba } from './color.cjs';
 export interface ChartTheme {
     palette: Rgba[];
     text: Rgba;
@@ -11,9 +11,33 @@ export interface ChartTheme {
     fontFamily: string;
     /** Tick label font size in CSS pixels */
     fontSize: number;
+    /** Resolves the colors of the options (`var(--x)` included); static colors only when omitted */
+    resolve?: ColorResolver;
 }
 /** Reads the theme from the computed style of `element` */
 export declare const readTheme: (element: Element | null, palette?: readonly string[]) => ChartTheme;
+/** Theme of the charts drawn without a DOM (mini-programs, React Native) */
+export interface ChartThemeInput {
+    /**
+     * Values of the Minerva CSS variables (`--primary-color`, `--text-color`,
+     * `--chart-series-1`, ...) used for the theme colors and to resolve
+     * `var(--name)` colors of the options
+     */
+    variables?: Readonly<Record<string, string>>;
+    /** Series colors (hex / rgb) */
+    palette?: readonly string[];
+    /** Font family of the labels */
+    fontFamily?: string;
+    /**
+     * Font size of the tick labels, in pixels
+     * @default 11
+     */
+    fontSize?: number;
+}
+/** Builds a theme from plain values (no DOM) */
+export declare const createTheme: (input?: ChartThemeInput, palette?: readonly string[]) => ChartTheme;
+/** Resolver of `var(--name, fallback)` colors against plain variables */
+export declare const staticColorResolver: (variables: Readonly<Record<string, string>>) => ColorResolver;
 /**
  * Calls `onChange` when the theme may have changed: attributes of `<html>` /
  * `<body>` (class, style, data-theme) and the color scheme.

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

@@ -1,4 +1,4 @@
-import { Rgba } from './color.js';
+import { ColorResolver, Rgba } from './color.js';
 export interface ChartTheme {
     palette: Rgba[];
     text: Rgba;
@@ -11,9 +11,33 @@ export interface ChartTheme {
     fontFamily: string;
     /** Tick label font size in CSS pixels */
     fontSize: number;
+    /** Resolves the colors of the options (`var(--x)` included); static colors only when omitted */
+    resolve?: ColorResolver;
 }
 /** Reads the theme from the computed style of `element` */
 export declare const readTheme: (element: Element | null, palette?: readonly string[]) => ChartTheme;
+/** Theme of the charts drawn without a DOM (mini-programs, React Native) */
+export interface ChartThemeInput {
+    /**
+     * Values of the Minerva CSS variables (`--primary-color`, `--text-color`,
+     * `--chart-series-1`, ...) used for the theme colors and to resolve
+     * `var(--name)` colors of the options
+     */
+    variables?: Readonly<Record<string, string>>;
+    /** Series colors (hex / rgb) */
+    palette?: readonly string[];
+    /** Font family of the labels */
+    fontFamily?: string;
+    /**
+     * Font size of the tick labels, in pixels
+     * @default 11
+     */
+    fontSize?: number;
+}
+/** Builds a theme from plain values (no DOM) */
+export declare const createTheme: (input?: ChartThemeInput, palette?: readonly string[]) => ChartTheme;
+/** Resolver of `var(--name, fallback)` colors against plain variables */
+export declare const staticColorResolver: (variables: Readonly<Record<string, string>>) => ColorResolver;
 /**
  * Calls `onChange` when the theme may have changed: attributes of `<html>` /
  * `<body>` (class, style, data-theme) and the color scheme.

package/dist/charts/engine/theme.js

@@ -1,6 +1,6 @@
-import { mix as e, resolveColor as t } from "./color.js";
+import { domColorResolver as e, mix as t, resolveStaticColor as n } from "./color.js";
 //#region src/engine/theme.ts
-var n = [
+var r = [
 	"#4f46e5",
 	"#10b981",
 	"#f59e0b",
@@ -9,40 +9,56 @@ var n = [
 	"#8b5cf6",
 	"#14b8a6",
 	"#f97316"
-], r = (e, t) => e?.getPropertyValue(t).trim() ?? "", i = (i, a) => {
-	let o = i && typeof getComputedStyle == "function" ? getComputedStyle(i) : null, s = (e, n) => {
-		for (let n of e) if (r(o, n)) return t(`var(${n})`, i);
-		return t(n, i);
-	}, c = s(["--surface-color", "--background-color"], "#ffffff"), l = s(["--text-color"], "#1f2937"), u = s(["--text-secondary-color", "--text-muted-color"], "#6b7280"), d = s(["--border-color"], "#e5e7eb"), f;
-	if (a && a.length) f = a.map((e) => t(e, i));
+], i = (e, t) => e?.getPropertyValue(t).trim() ?? "", a = (t, n) => {
+	let r = t && typeof getComputedStyle == "function" ? getComputedStyle(t) : null;
+	return c((e) => i(r, e), e(t), n, r?.fontFamily ?? "");
+}, o = (e = {}, t) => {
+	let n = e.variables ?? {};
+	return {
+		...c((e) => n[e]?.trim() ?? "", s(n), t?.length ? t : e.palette, ""),
+		...e.fontFamily ? { fontFamily: e.fontFamily } : {},
+		...e.fontSize ? { fontSize: e.fontSize } : {}
+	};
+}, s = (e) => (t, r) => n(t, e, r), c = (e, n, i, a) => {
+	let o = [
+		.4,
+		.4,
+		.4,
+		1
+	], s = (e) => n(e, o), c = (t, n) => {
+		for (let n of t) if (e(n)) return s(`var(${n})`);
+		return s(n);
+	}, l = c(["--surface-color", "--background-color"], "#ffffff"), u = c(["--text-color"], "#1f2937"), d = c(["--text-secondary-color", "--text-muted-color"], "#6b7280"), f = c(["--border-color"], "#e5e7eb"), p;
+	if (i && i.length) p = i.map((e) => s(e));
 	else {
-		let e = [];
+		let t = [];
 		for (let n = 1; n <= 8; n++) {
-			let a = `--chart-series-${n}`;
-			r(o, a) && e.push(t(`var(${a})`, i));
+			let r = `--chart-series-${n}`;
+			e(r) && t.push(s(`var(${r})`));
 		}
-		f = e.length ? e : [...[
+		p = t.length ? t : [...[
 			"--primary-color",
 			"--success-color",
 			"--warning-color",
 			"--danger-color",
 			"--info-color"
-		].map((e, a) => r(o, e) ? t(`var(${e})`, i) : t(n[a], i)), ...n.slice(5).map((e) => t(e, i))];
+		].map((t, n) => e(t) ? s(`var(${t})`) : s(r[n])), ...r.slice(5).map((e) => s(e))];
 	}
-	let p = r(o, "--font-family-sans") || (o?.fontFamily ?? "") || "system-ui, -apple-system, 'Segoe UI', sans-serif";
+	let m = e("--font-family-sans") || a || "system-ui, -apple-system, 'Segoe UI', sans-serif";
 	return {
-		palette: f,
-		text: l,
-		textMuted: u,
-		grid: e(c, d, .75),
-		axis: d,
-		background: c,
-		surface: c,
-		primary: f[0],
-		fontFamily: p,
-		fontSize: 11
+		palette: p,
+		text: u,
+		textMuted: d,
+		grid: t(l, f, .75),
+		axis: f,
+		background: l,
+		surface: l,
+		primary: p[0],
+		fontFamily: m,
+		fontSize: 11,
+		resolve: n
 	};
-}, a = (e) => {
+}, l = (e) => {
 	if (typeof document > "u") return () => {};
 	let t = [];
 	if (typeof MutationObserver == "function") {
@@ -65,6 +81,6 @@ var n = [
 	return () => t.forEach((e) => e());
 };
 //#endregion
-export { i as readTheme, a as watchTheme };
+export { o as createTheme, a as readTheme, s as staticColorResolver, l as watchTheme };
 
 //# sourceMappingURL=theme.js.map

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","domColorResolver","palette","createTheme","variables","input","staticColorResolver","resolveStaticColor","value","fallback","fallbackGray","resolveColor","resolve","color","names","readVariable","background","text","textMuted","border","colors","c","custom","i","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  mix,\n  resolveStaticColor,\n  type ColorResolver,\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/** 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  return buildTheme(\n    (name) => readVar(style, name),\n    domColorResolver(element),\n    palette,\n    style?.fontFamily ?? \"\",\n  );\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

@@ -145,8 +145,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 +189,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 {
@@ -257,12 +283,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 +331,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

@@ -145,8 +145,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 +189,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 {
@@ -257,12 +283,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 +331,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/controller.cjs"),o=require("./engine/canvas.cjs");require("./core.cjs"),exports.BarChart=i.BarChart,exports.Chart=n.Chart,exports.LineChart=i.LineChart,exports.QuadrantChart=i.QuadrantChart,exports.ScatterChart=i.ScatterChart,exports.createCanvasChart=o.createCanvasChart,exports.createChart=t.createChart,exports.createChartController=a.createChartController,exports.formatCompact=e.formatCompact,exports.quadrantCenter=r.quadrantCenter,exports.quadrantChartOptions=r.quadrantChartOptions,exports.quadrantOf=r.quadrantOf,exports.scenePrimitives=a.scenePrimitives;

package/dist/charts/index.d.cts

@@ -1,4 +1,4 @@
 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 type { BarChartProps, ChartCommonProps, ChartHandle, ChartProps, LineChartProps, QuadrantChartProps, QuadrantDropTarget, ScatterChartProps, } from './react/types.cjs';
 export * from './core.cjs';

package/dist/charts/index.d.ts

@@ -1,4 +1,4 @@
 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 type { BarChartProps, ChartCommonProps, ChartHandle, ChartProps, LineChartProps, QuadrantChartProps, QuadrantDropTarget, ScatterChartProps, } from './react/types.js';
 export * from './core.js';

package/dist/charts/index.js

@@ -2,6 +2,9 @@
 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 { quadrantCenter as r, quadrantChartOptions as i, quadrantOf as a } from "./engine/presets.js";
+import { BarChart as o, LineChart as s, QuadrantChart as c, ScatterChart as l } from "./react/charts.js";
+import { createChartController as u, scenePrimitives as d } from "./engine/controller.js";
+import { createCanvasChart as f } 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 { o as BarChart, n as Chart, s as LineChart, c as QuadrantChart, l as ScatterChart, f as createCanvasChart, t as createChart, u as createChartController, e as formatCompact, r as quadrantCenter, i as quadrantChartOptions, a as quadrantOf, d as scenePrimitives };

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});function o({options:a,height:o,width:s,className:c,style:l,handleRef:u,renderTooltip:d,overlay:f,...p}){let m=(0,t.useRef)(null),h=(0,t.useRef)(null),g=(0,t.useRef)(p),_=(0,t.useRef)(d),[v,y]=(0,t.useState)(null),[b,x]=(0,t.useState)(null),S=(0,t.useMemo)(()=>typeof document>`u`?null:document.createElement(`div`),[]),C=(0,t.useMemo)(()=>{if(!d||!S||a.tooltip===!1)return a;let e=typeof a.tooltip==`object`?a.tooltip:{};return{...a,tooltip:{...e,render:e=>_.current?((0,n.flushSync)(()=>y(e)),S):null}}},[a,d,S]),w=(0,t.useRef)(C);return(0,t.useEffect)(()=>{g.current=p,_.current=d}),(0,t.useEffect)(()=>{let t=m.current;if(!t)return;let n=e.createChart(t,w.current);h.current=n;let r=[n.on(`hover`,e=>g.current.onHover?.(e)),n.on(`click`,e=>g.current.onPointClick?.(e)),n.on(`plotClick`,e=>g.current.onPlotClick?.(e)),n.on(`zoom`,e=>g.current.onZoom?.(e)),n.on(`renderer`,e=>g.current.onRendererChange?.(e)),n.on(`drag`,e=>g.current.onDrag?.(e)),n.on(`drop`,e=>g.current.onDrop?.(e)),n.on(`layout`,e=>x(e))];return()=>{r.forEach(e=>e()),n.destroy(),h.current=null}},[]),(0,t.useEffect)(()=>{w.current!==C&&(w.current=C,h.current?.setOptions(C))},[C]),(0,t.useImperativeHandle)(u,()=>({resetZoom:()=>h.current?.resetZoom(),getView:()=>h.current?.getView()??null,setView:e=>h.current?.setView(e),getRenderer:()=>h.current?.getRenderer()??null,getInstance:()=>h.current}),[]),(0,r.jsxs)(`div`,{className:c,style:{position:`relative`,width:i(s,`100%`),height:i(o,`320px`),...l},children:[(0,r.jsx)(`div`,{ref:m,style:{position:`absolute`,inset:0}}),f&&b&&(0,r.jsx)(`div`,{className:`minerva-chart-overlay`,style:{position:`absolute`,left:b.x,top:b.y,width:b.width,height:b.height,pointerEvents:`none`},children:f(b)}),S&&v&&d&&(0,n.createPortal)(d(v),S)]})}function s(e){let{height:t,width:n,className:i,style:s,ref:c,onHover:l,onPointClick:u,onPlotClick:d,onZoom:f,onRendererChange:p,renderTooltip:m}=e;return(0,r.jsx)(o,{options:a(e),height:t,width:n,className:i,style:s,handleRef:c,onHover:l,onPointClick:u,onPlotClick:d,onZoom:f,onRendererChange:p,renderTooltip:m})}exports.Chart=s,exports.ChartBase=o,exports.engineOptions=a;
 //# sourceMappingURL=Chart.cjs.map