@voila.dev/chart 4.0.0

package/dist/react/focus-overlay.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/react/focus-overlay.tsx"],
+  "sourcesContent": ["import type * as React from \"react\";\nimport { arcPath, roundedBarPath } from \"#/core/paths.ts\";\nimport type { ChartPoint, ChartScene, ChartTheme } from \"#/core/types.ts\";\nimport type { ActiveFocus } from \"#/react/use-chart-focus.ts\";\n\nconst RING_RADIUS = 4.5;\nconst RING_OUTSET = 2;\n\nfunction PointRing({\n\tpoint,\n\tkeyboard,\n\ttheme,\n}: {\n\tpoint: ChartPoint;\n\tkeyboard: boolean;\n\ttheme: ChartTheme;\n}) {\n\tconst ring = keyboard ? \"var(--ring, Highlight)\" : theme.background;\n\tif (point.hit?.kind === \"rect\" && point.hit.rect.width > RING_RADIUS * 4) {\n\t\tif (!keyboard) {\n\t\t\treturn null;\n\t\t}\n\t\tconst { rect } = point.hit;\n\t\treturn (\n\t\t\t<path\n\t\t\t\tdata-slot=\"chart-focus-ring\"\n\t\t\t\td={roundedBarPath({\n\t\t\t\t\tx: rect.x - RING_OUTSET,\n\t\t\t\t\ty: rect.y - RING_OUTSET,\n\t\t\t\t\twidth: rect.width + RING_OUTSET * 2,\n\t\t\t\t\theight: rect.height + RING_OUTSET * 2,\n\t\t\t\t\tradius: 4,\n\t\t\t\t})}\n\t\t\t\tfill=\"none\"\n\t\t\t\tstroke={ring}\n\t\t\t\tstrokeWidth={2}\n\t\t\t/>\n\t\t);\n\t}\n\tif (point.hit?.kind === \"arc\") {\n\t\treturn (\n\t\t\t<path\n\t\t\t\tdata-slot=\"chart-focus-ring\"\n\t\t\t\td={arcPath({\n\t\t\t\t\t...point.hit,\n\t\t\t\t\touterRadius: point.hit.outerRadius + RING_OUTSET,\n\t\t\t\t})}\n\t\t\t\tfill=\"none\"\n\t\t\t\tstroke={keyboard ? ring : theme.foreground}\n\t\t\t\tstrokeWidth={2}\n\t\t\t/>\n\t\t);\n\t}\n\treturn (\n\t\t<circle\n\t\t\tdata-slot=\"chart-focus-ring\"\n\t\t\tcx={point.x}\n\t\t\tcy={point.y}\n\t\t\tr={RING_RADIUS}\n\t\t\tfill={point.color}\n\t\t\tstroke={ring}\n\t\t\tstrokeWidth={2}\n\t\t/>\n\t);\n}\n\n/**\n * The focus layer, drawn over the marks whichever renderer drew them: the\n * column or row band under the pointer, and a ring on the focused point.\n * Hidden from assistive tech: the live region says what it shows.\n */\nexport function FocusOverlay({\n\tscene,\n\tactive,\n\ttheme,\n}: {\n\tscene: ChartScene;\n\tactive: ActiveFocus | null;\n\ttheme: ChartTheme;\n}) {\n\tif (active === null) {\n\t\treturn null;\n\t}\n\tconst { focusOrder, scales } = scene;\n\t// On a faceted chart the cursor spans the focused point's own cell.\n\tconst plot =\n\t\tscene.cells?.find((cell) => cell.key === active.point.facet)?.plot ??\n\t\tscene.plot;\n\tconst keyboard = active.source === \"keyboard\";\n\tconst along = focusOrder === \"y\" ? scales.y : scales.x;\n\tconst band = along?.kind === \"band\" ? along.bandwidth : 0;\n\tlet cursor: React.ReactNode = null;\n\tif (focusOrder !== \"point\") {\n\t\tcursor =\n\t\t\tband > 0 ? (\n\t\t\t\t<rect\n\t\t\t\t\tdata-slot=\"chart-cursor\"\n\t\t\t\t\t{...(focusOrder === \"y\"\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\tx: plot.x,\n\t\t\t\t\t\t\t\ty: active.stop.at - band / 2,\n\t\t\t\t\t\t\t\twidth: plot.width,\n\t\t\t\t\t\t\t\theight: band,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\tx: active.stop.at - band / 2,\n\t\t\t\t\t\t\t\ty: plot.y,\n\t\t\t\t\t\t\t\twidth: band,\n\t\t\t\t\t\t\t\theight: plot.height,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\tfill=\"currentColor\"\n\t\t\t\t\topacity={0.06}\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<line\n\t\t\t\t\tdata-slot=\"chart-cursor\"\n\t\t\t\t\t{...(focusOrder === \"y\"\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\tx1: plot.x,\n\t\t\t\t\t\t\t\tx2: plot.x + plot.width,\n\t\t\t\t\t\t\t\ty1: active.stop.at,\n\t\t\t\t\t\t\t\ty2: active.stop.at,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\tx1: active.stop.at,\n\t\t\t\t\t\t\t\tx2: active.stop.at,\n\t\t\t\t\t\t\t\ty1: plot.y,\n\t\t\t\t\t\t\t\ty2: plot.y + plot.height,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\tstroke={theme.muted}\n\t\t\t\t\tstrokeWidth={1}\n\t\t\t\t\tstrokeDasharray=\"3 3\"\n\t\t\t\t/>\n\t\t\t);\n\t}\n\tconst ringed =\n\t\tfocusOrder === \"point\" || (keyboard && active.stop.points.length > 1)\n\t\t\t? [active.point]\n\t\t\t: active.stop.points;\n\treturn (\n\t\t<svg\n\t\t\taria-hidden=\"true\"\n\t\t\tdata-slot=\"chart-focus\"\n\t\t\twidth={scene.width}\n\t\t\theight={scene.height}\n\t\t\tstyle={{\n\t\t\t\tposition: \"absolute\",\n\t\t\t\tinset: 0,\n\t\t\t\toverflow: \"visible\",\n\t\t\t\tpointerEvents: \"none\",\n\t\t\t}}\n\t\t>\n\t\t\t{cursor}\n\t\t\t{ringed.map((point) => (\n\t\t\t\t<PointRing\n\t\t\t\t\tkey={point.key}\n\t\t\t\t\tpoint={point}\n\t\t\t\t\tkeyboard={keyboard}\n\t\t\t\t\ttheme={theme}\n\t\t\t\t/>\n\t\t\t))}\n\t\t</svg>\n\t);\n}\n"],
+  "mappings": "AAwBG,cAoHD,YApHC;AAvBH,SAAS,SAAS,sBAAsB;AAIxC,MAAM,cAAc;AACpB,MAAM,cAAc;AAEpB,SAAS,UAAU;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AACD,GAIG;AACF,QAAM,OAAO,WAAW,2BAA2B,MAAM;AACzD,MAAI,MAAM,KAAK,SAAS,UAAU,MAAM,IAAI,KAAK,QAAQ,cAAc,GAAG;AACzE,QAAI,CAAC,UAAU;AACd,aAAO;AAAA,IACR;AACA,UAAM,EAAE,KAAK,IAAI,MAAM;AACvB,WACC;AAAA,MAAC;AAAA;AAAA,QACA,aAAU;AAAA,QACV,GAAG,eAAe;AAAA,UACjB,GAAG,KAAK,IAAI;AAAA,UACZ,GAAG,KAAK,IAAI;AAAA,UACZ,OAAO,KAAK,QAAQ,cAAc;AAAA,UAClC,QAAQ,KAAK,SAAS,cAAc;AAAA,UACpC,QAAQ;AAAA,QACT,CAAC;AAAA,QACD,MAAK;AAAA,QACL,QAAQ;AAAA,QACR,aAAa;AAAA;AAAA,IACd;AAAA,EAEF;AACA,MAAI,MAAM,KAAK,SAAS,OAAO;AAC9B,WACC;AAAA,MAAC;AAAA;AAAA,QACA,aAAU;AAAA,QACV,GAAG,QAAQ;AAAA,UACV,GAAG,MAAM;AAAA,UACT,aAAa,MAAM,IAAI,cAAc;AAAA,QACtC,CAAC;AAAA,QACD,MAAK;AAAA,QACL,QAAQ,WAAW,OAAO,MAAM;AAAA,QAChC,aAAa;AAAA;AAAA,IACd;AAAA,EAEF;AACA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,aAAU;AAAA,MACV,IAAI,MAAM;AAAA,MACV,IAAI,MAAM;AAAA,MACV,GAAG;AAAA,MACH,MAAM,MAAM;AAAA,MACZ,QAAQ;AAAA,MACR,aAAa;AAAA;AAAA,EACd;AAEF;AAOO,SAAS,aAAa;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AACD,GAIG;AACF,MAAI,WAAW,MAAM;AACpB,WAAO;AAAA,EACR;AACA,QAAM,EAAE,YAAY,OAAO,IAAI;AAE/B,QAAM,OACL,MAAM,OAAO,KAAK,CAAC,SAAS,KAAK,QAAQ,OAAO,MAAM,KAAK,GAAG,QAC9D,MAAM;AACP,QAAM,WAAW,OAAO,WAAW;AACnC,QAAM,QAAQ,eAAe,MAAM,OAAO,IAAI,OAAO;AACrD,QAAM,OAAO,OAAO,SAAS,SAAS,MAAM,YAAY;AACxD,MAAI,SAA0B;AAC9B,MAAI,eAAe,SAAS;AAC3B,aACC,OAAO,IACN;AAAA,MAAC;AAAA;AAAA,QACA,aAAU;AAAA,QACT,GAAI,eAAe,MACjB;AAAA,UACA,GAAG,KAAK;AAAA,UACR,GAAG,OAAO,KAAK,KAAK,OAAO;AAAA,UAC3B,OAAO,KAAK;AAAA,UACZ,QAAQ;AAAA,QACT,IACC;AAAA,UACA,GAAG,OAAO,KAAK,KAAK,OAAO;AAAA,UAC3B,GAAG,KAAK;AAAA,UACR,OAAO;AAAA,UACP,QAAQ,KAAK;AAAA,QACd;AAAA,QACF,MAAK;AAAA,QACL,SAAS;AAAA;AAAA,IACV,IAEA;AAAA,MAAC;AAAA;AAAA,QACA,aAAU;AAAA,QACT,GAAI,eAAe,MACjB;AAAA,UACA,IAAI,KAAK;AAAA,UACT,IAAI,KAAK,IAAI,KAAK;AAAA,UAClB,IAAI,OAAO,KAAK;AAAA,UAChB,IAAI,OAAO,KAAK;AAAA,QACjB,IACC;AAAA,UACA,IAAI,OAAO,KAAK;AAAA,UAChB,IAAI,OAAO,KAAK;AAAA,UAChB,IAAI,KAAK;AAAA,UACT,IAAI,KAAK,IAAI,KAAK;AAAA,QACnB;AAAA,QACF,QAAQ,MAAM;AAAA,QACd,aAAa;AAAA,QACb,iBAAgB;AAAA;AAAA,IACjB;AAAA,EAEH;AACA,QAAM,SACL,eAAe,WAAY,YAAY,OAAO,KAAK,OAAO,SAAS,IAChE,CAAC,OAAO,KAAK,IACb,OAAO,KAAK;AAChB,SACC;AAAA,IAAC;AAAA;AAAA,MACA,eAAY;AAAA,MACZ,aAAU;AAAA,MACV,OAAO,MAAM;AAAA,MACb,QAAQ,MAAM;AAAA,MACd,OAAO;AAAA,QACN,UAAU;AAAA,QACV,OAAO;AAAA,QACP,UAAU;AAAA,QACV,eAAe;AAAA,MAChB;AAAA,MAEC;AAAA;AAAA,QACA,OAAO,IAAI,CAAC,UACZ;AAAA,UAAC;AAAA;AAAA,YAEA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,UAHK,MAAM;AAAA,QAIZ,CACA;AAAA;AAAA;AAAA,EACF;AAEF;",
+  "names": []
+}

package/dist/react/index.d.ts

@@ -0,0 +1,7 @@
+export type { ChartBrush, ChartBrushRange } from "./brush-contract.js";
+export { Chart } from "./chart.js";
+export { ChartTooltipContent, type ChartTooltipRenderProps, } from "./chart-tooltip.js";
+export type { ChartRenderer, ChartRendererProps } from "./renderer.js";
+export { SvgRenderer } from "./svg-renderer.js";
+export type { ActiveFocus } from "./use-chart-focus.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/react/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/react/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAC7E,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,EACN,mBAAmB,EACnB,KAAK,uBAAuB,GAC5B,MAAM,2BAA2B,CAAC;AACnC,YAAY,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAC7E,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,YAAY,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC"}

package/dist/react/index.js

@@ -0,0 +1,11 @@
+import { Chart } from "./chart.js";
+import {
+  ChartTooltipContent
+} from "./chart-tooltip.js";
+import { SvgRenderer } from "./svg-renderer.js";
+export {
+  Chart,
+  ChartTooltipContent,
+  SvgRenderer
+};
+//# sourceMappingURL=index.js.map

package/dist/react/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/react/index.ts"],
+  "sourcesContent": ["export type { ChartBrush, ChartBrushRange } from \"#/react/brush-contract.ts\";\nexport { Chart } from \"#/react/chart.tsx\";\nexport {\n\tChartTooltipContent,\n\ttype ChartTooltipRenderProps,\n} from \"#/react/chart-tooltip.tsx\";\nexport type { ChartRenderer, ChartRendererProps } from \"#/react/renderer.ts\";\nexport { SvgRenderer } from \"#/react/svg-renderer.tsx\";\nexport type { ActiveFocus } from \"#/react/use-chart-focus.ts\";\n"],
+  "mappings": "AACA,SAAS,aAAa;AACtB;AAAA,EACC;AAAA,OAEM;AAEP,SAAS,mBAAmB;",
+  "names": []
+}

package/dist/react/messages.d.ts

@@ -0,0 +1,16 @@
+/** The few words the chart says itself. French when the chart's locale is, English otherwise. */
+export interface ChartMessages {
+    readonly keyboardHint: string;
+    readonly roleDescription: string;
+    readonly legend: string;
+    readonly series: string;
+    readonly resetZoom: string;
+    readonly showing: (from: string, to: string) => string;
+    readonly zoomHint: string;
+    readonly brushStart: string;
+    readonly brushEnd: string;
+    readonly selected: (from: string, to: string) => string;
+    readonly dataTable: (label: string) => string;
+}
+export declare function messagesFor(locale: string): ChartMessages;
+//# sourceMappingURL=messages.d.ts.map

package/dist/react/messages.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"messages.d.ts","sourceRoot":"","sources":["../../src/react/messages.ts"],"names":[],"mappings":"AAAA,iGAAiG;AACjG,MAAM,WAAW,aAAa;IAC7B,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;IAC9B,QAAQ,CAAC,eAAe,EAAE,MAAM,CAAC;IACjC,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,OAAO,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,MAAM,CAAC;IACvD,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,MAAM,CAAC;IACxD,QAAQ,CAAC,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CAC9C;AAiCD,wBAAgB,WAAW,CAAC,MAAM,EAAE,MAAM,GAAG,aAAa,CAEzD"}

package/dist/react/messages.js

@@ -0,0 +1,33 @@
+const FRENCH = {
+  keyboardHint: "Fl\xE8ches pour parcourir les valeurs, Entr\xE9e pour \xE9pingler, \xC9chap pour quitter.",
+  roleDescription: "graphique",
+  legend: "L\xE9gende",
+  series: "S\xE9rie",
+  resetZoom: "R\xE9initialiser le zoom",
+  showing: (from, to) => `Affich\xE9 : ${from} \u2013 ${to}`,
+  zoomHint: " + et \u2212 pour zoomer, Maj et fl\xE8ches pour se d\xE9placer, 0 pour revenir.",
+  brushStart: "D\xE9but de la s\xE9lection",
+  brushEnd: "Fin de la s\xE9lection",
+  selected: (from, to) => `S\xE9lection : ${from} \u2013 ${to}`,
+  dataTable: (label) => `Donn\xE9es : ${label}`
+};
+const ENGLISH = {
+  keyboardHint: "Arrow keys to move through the values, Enter to pin, Escape to leave.",
+  roleDescription: "chart",
+  legend: "Legend",
+  series: "Series",
+  resetZoom: "Reset zoom",
+  showing: (from, to) => `Showing ${from} \u2013 ${to}`,
+  zoomHint: " + and \u2212 to zoom, Shift and the arrows to pan, 0 to reset.",
+  brushStart: "Selection start",
+  brushEnd: "Selection end",
+  selected: (from, to) => `Selected ${from} \u2013 ${to}`,
+  dataTable: (label) => `Data: ${label}`
+};
+function messagesFor(locale) {
+  return locale.toLowerCase().startsWith("fr") ? FRENCH : ENGLISH;
+}
+export {
+  messagesFor
+};
+//# sourceMappingURL=messages.js.map

package/dist/react/messages.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/react/messages.ts"],
+  "sourcesContent": ["/** The few words the chart says itself. French when the chart's locale is, English otherwise. */\nexport interface ChartMessages {\n\treadonly keyboardHint: string;\n\treadonly roleDescription: string;\n\treadonly legend: string;\n\treadonly series: string;\n\treadonly resetZoom: string;\n\treadonly showing: (from: string, to: string) => string;\n\treadonly zoomHint: string;\n\treadonly brushStart: string;\n\treadonly brushEnd: string;\n\treadonly selected: (from: string, to: string) => string;\n\treadonly dataTable: (label: string) => string;\n}\n\nconst FRENCH: ChartMessages = {\n\tkeyboardHint:\n\t\t\"Fl\u00E8ches pour parcourir les valeurs, Entr\u00E9e pour \u00E9pingler, \u00C9chap pour quitter.\",\n\troleDescription: \"graphique\",\n\tlegend: \"L\u00E9gende\",\n\tseries: \"S\u00E9rie\",\n\tresetZoom: \"R\u00E9initialiser le zoom\",\n\tshowing: (from, to) => `Affich\u00E9 : ${from} \u2013 ${to}`,\n\tzoomHint:\n\t\t\" + et \u2212 pour zoomer, Maj et fl\u00E8ches pour se d\u00E9placer, 0 pour revenir.\",\n\tbrushStart: \"D\u00E9but de la s\u00E9lection\",\n\tbrushEnd: \"Fin de la s\u00E9lection\",\n\tselected: (from, to) => `S\u00E9lection : ${from} \u2013 ${to}`,\n\tdataTable: (label) => `Donn\u00E9es : ${label}`,\n};\n\nconst ENGLISH: ChartMessages = {\n\tkeyboardHint:\n\t\t\"Arrow keys to move through the values, Enter to pin, Escape to leave.\",\n\troleDescription: \"chart\",\n\tlegend: \"Legend\",\n\tseries: \"Series\",\n\tresetZoom: \"Reset zoom\",\n\tshowing: (from, to) => `Showing ${from} \u2013 ${to}`,\n\tzoomHint: \" + and \u2212 to zoom, Shift and the arrows to pan, 0 to reset.\",\n\tbrushStart: \"Selection start\",\n\tbrushEnd: \"Selection end\",\n\tselected: (from, to) => `Selected ${from} \u2013 ${to}`,\n\tdataTable: (label) => `Data: ${label}`,\n};\n\nexport function messagesFor(locale: string): ChartMessages {\n\treturn locale.toLowerCase().startsWith(\"fr\") ? FRENCH : ENGLISH;\n}\n"],
+  "mappings": "AAeA,MAAM,SAAwB;AAAA,EAC7B,cACC;AAAA,EACD,iBAAiB;AAAA,EACjB,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,SAAS,CAAC,MAAM,OAAO,gBAAa,IAAI,WAAM,EAAE;AAAA,EAChD,UACC;AAAA,EACD,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,UAAU,CAAC,MAAM,OAAO,kBAAe,IAAI,WAAM,EAAE;AAAA,EACnD,WAAW,CAAC,UAAU,gBAAa,KAAK;AACzC;AAEA,MAAM,UAAyB;AAAA,EAC9B,cACC;AAAA,EACD,iBAAiB;AAAA,EACjB,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,SAAS,CAAC,MAAM,OAAO,WAAW,IAAI,WAAM,EAAE;AAAA,EAC9C,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,UAAU,CAAC,MAAM,OAAO,YAAY,IAAI,WAAM,EAAE;AAAA,EAChD,WAAW,CAAC,UAAU,SAAS,KAAK;AACrC;AAEO,SAAS,YAAY,QAA+B;AAC1D,SAAO,OAAO,YAAY,EAAE,WAAW,IAAI,IAAI,SAAS;AACzD;",
+  "names": []
+}

package/dist/react/renderer.d.ts

@@ -0,0 +1,14 @@
+import type * as React from "react";
+import type { ChartScene } from "../core/types.js";
+/**
+ * What draws the scene. The SVG renderer is the default; `@voila.dev/chart/canvas`
+ * exports one that paints the same scene onto a canvas, for thousands of marks.
+ * Either way the focus ring, tooltip, legend and data table are the same.
+ */
+export interface ChartRendererProps {
+    readonly scene: ChartScene;
+    /** Unique per chart, for clip-path ids. */
+    readonly chartId: string;
+}
+export type ChartRenderer = React.ComponentType<ChartRendererProps>;
+//# sourceMappingURL=renderer.d.ts.map

package/dist/react/renderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderer.d.ts","sourceRoot":"","sources":["../../src/react/renderer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AACpC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD;;;;GAIG;AACH,MAAM,WAAW,kBAAkB;IAClC,QAAQ,CAAC,KAAK,EAAE,UAAU,CAAC;IAC3B,2CAA2C;IAC3C,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC"}

package/dist/react/renderer.js

@@ -0,0 +1 @@
+//# sourceMappingURL=renderer.js.map

package/dist/react/renderer.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/dist/react/sr-only.d.ts

@@ -0,0 +1,4 @@
+import type * as React from "react";
+/** Present to assistive tech, invisible on screen, and never wider than one pixel. */
+export declare const SR_ONLY: React.CSSProperties;
+//# sourceMappingURL=sr-only.d.ts.map

package/dist/react/sr-only.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sr-only.d.ts","sourceRoot":"","sources":["../../src/react/sr-only.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAEpC,sFAAsF;AACtF,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,aAU3B,CAAC"}

package/dist/react/sr-only.js

@@ -0,0 +1,15 @@
+const SR_ONLY = {
+  position: "absolute",
+  width: 1,
+  height: 1,
+  padding: 0,
+  margin: -1,
+  overflow: "hidden",
+  clip: "rect(0, 0, 0, 0)",
+  whiteSpace: "nowrap",
+  border: 0
+};
+export {
+  SR_ONLY
+};
+//# sourceMappingURL=sr-only.js.map

package/dist/react/sr-only.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/react/sr-only.ts"],
+  "sourcesContent": ["import type * as React from \"react\";\n\n/** Present to assistive tech, invisible on screen, and never wider than one pixel. */\nexport const SR_ONLY: React.CSSProperties = {\n\tposition: \"absolute\",\n\twidth: 1,\n\theight: 1,\n\tpadding: 0,\n\tmargin: -1,\n\toverflow: \"hidden\",\n\tclip: \"rect(0, 0, 0, 0)\",\n\twhiteSpace: \"nowrap\",\n\tborder: 0,\n};\n"],
+  "mappings": "AAGO,MAAM,UAA+B;AAAA,EAC3C,UAAU;AAAA,EACV,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,QAAQ;AACT;",
+  "names": []
+}

package/dist/react/svg-renderer.d.ts

@@ -0,0 +1,4 @@
+import type { ChartRendererProps } from "./renderer.js";
+/** The default renderer: the scene as inline SVG, server-renderable and crisp at any zoom. */
+export declare function SvgRenderer({ scene, chartId }: ChartRendererProps): import("react").JSX.Element;
+//# sourceMappingURL=svg-renderer.d.ts.map

package/dist/react/svg-renderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"svg-renderer.d.ts","sourceRoot":"","sources":["../../src/react/svg-renderer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAG9D,8FAA8F;AAC9F,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,kBAAkB,+BAajE"}

package/dist/react/svg-renderer.js

@@ -0,0 +1,20 @@
+import { jsx } from "react/jsx-runtime";
+import { SvgSceneNodes } from "./svg-scene.js";
+function SvgRenderer({ scene, chartId }) {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "data-slot": "chart-svg",
+      "aria-hidden": "true",
+      width: scene.width,
+      height: scene.height,
+      viewBox: `0 0 ${scene.width} ${scene.height}`,
+      style: { position: "absolute", inset: 0, overflow: "visible" },
+      children: /* @__PURE__ */ jsx(SvgSceneNodes, { scene, clipPrefix: chartId })
+    }
+  );
+}
+export {
+  SvgRenderer
+};
+//# sourceMappingURL=svg-renderer.js.map

package/dist/react/svg-renderer.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/react/svg-renderer.tsx"],
+  "sourcesContent": ["import type { ChartRendererProps } from \"#/react/renderer.ts\";\nimport { SvgSceneNodes } from \"#/react/svg-scene.tsx\";\n\n/** The default renderer: the scene as inline SVG, server-renderable and crisp at any zoom. */\nexport function SvgRenderer({ scene, chartId }: ChartRendererProps) {\n\treturn (\n\t\t<svg\n\t\t\tdata-slot=\"chart-svg\"\n\t\t\taria-hidden=\"true\"\n\t\t\twidth={scene.width}\n\t\t\theight={scene.height}\n\t\t\tviewBox={`0 0 ${scene.width} ${scene.height}`}\n\t\t\tstyle={{ position: \"absolute\", inset: 0, overflow: \"visible\" }}\n\t\t>\n\t\t\t<SvgSceneNodes scene={scene} clipPrefix={chartId} />\n\t\t</svg>\n\t);\n}\n"],
+  "mappings": "AAcG;AAbH,SAAS,qBAAqB;AAGvB,SAAS,YAAY,EAAE,OAAO,QAAQ,GAAuB;AACnE,SACC;AAAA,IAAC;AAAA;AAAA,MACA,aAAU;AAAA,MACV,eAAY;AAAA,MACZ,OAAO,MAAM;AAAA,MACb,QAAQ,MAAM;AAAA,MACd,SAAS,OAAO,MAAM,KAAK,IAAI,MAAM,MAAM;AAAA,MAC3C,OAAO,EAAE,UAAU,YAAY,OAAO,GAAG,UAAU,UAAU;AAAA,MAE7D,8BAAC,iBAAc,OAAc,YAAY,SAAS;AAAA;AAAA,EACnD;AAEF;",
+  "names": []
+}

package/dist/react/svg-scene.d.ts

@@ -0,0 +1,8 @@
+import type * as React from "react";
+import type { ChartScene } from "../core/types.js";
+/** The scene's nodes as SVG elements, keyed so React reconciles a data update in place. */
+export declare function SvgSceneNodes({ scene, clipPrefix, }: {
+    scene: ChartScene;
+    clipPrefix: string;
+}): React.JSX.Element[];
+//# sourceMappingURL=svg-scene.d.ts.map

package/dist/react/svg-scene.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"svg-scene.d.ts","sourceRoot":"","sources":["../../src/react/svg-scene.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAEpC,OAAO,KAAK,EAEX,UAAU,EAGV,MAAM,iBAAiB,CAAC;AA+HzB,2FAA2F;AAC3F,wBAAgB,aAAa,CAAC,EAC7B,KAAK,EACL,UAAU,GACV,EAAE;IACF,KAAK,EAAE,UAAU,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;CACnB,uBAIA"}

package/dist/react/svg-scene.js

@@ -0,0 +1,121 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { roundedBarPath } from "../core/paths.js";
+const BASELINE = {
+  top: "hanging",
+  middle: "central",
+  bottom: "text-after-edge",
+  alphabetic: "alphabetic"
+};
+function paintProps(paint) {
+  return {
+    fill: paint.fill ?? "none",
+    stroke: paint.stroke,
+    strokeWidth: paint.strokeWidth,
+    strokeDasharray: paint.strokeDasharray,
+    strokeLinecap: paint.strokeLinecap,
+    strokeLinejoin: paint.strokeLinejoin,
+    opacity: paint.opacity,
+    fillOpacity: paint.fillOpacity,
+    strokeOpacity: paint.strokeOpacity
+  };
+}
+function SceneElement({
+  node,
+  clipPrefix
+}) {
+  const data = { "data-role": node.role, "data-series": node.series };
+  switch (node.kind) {
+    case "group": {
+      const clipId = node.clip ? `${clipPrefix}-${node.key}` : void 0;
+      return /* @__PURE__ */ jsxs(
+        "g",
+        {
+          ...data,
+          transform: node.translate ? `translate(${node.translate.x} ${node.translate.y})` : void 0,
+          clipPath: clipId ? `url(#${clipId})` : void 0,
+          children: [
+            node.clip && clipId ? /* @__PURE__ */ jsx("clipPath", { id: clipId, children: /* @__PURE__ */ jsx("rect", { ...node.clip }) }) : null,
+            node.children.map((child) => /* @__PURE__ */ jsx(
+              SceneElement,
+              {
+                node: child,
+                clipPrefix
+              },
+              child.key
+            ))
+          ]
+        }
+      );
+    }
+    case "rect":
+      return node.corners ? /* @__PURE__ */ jsx(
+        "path",
+        {
+          ...data,
+          d: roundedBarPath({ ...node, radius: node.corners }),
+          ...paintProps(node.paint)
+        }
+      ) : /* @__PURE__ */ jsx(
+        "rect",
+        {
+          ...data,
+          x: node.x,
+          y: node.y,
+          width: node.width,
+          height: node.height,
+          ...paintProps(node.paint)
+        }
+      );
+    case "path":
+      return /* @__PURE__ */ jsx("path", { ...data, d: node.d, ...paintProps(node.paint) });
+    case "circle":
+      return /* @__PURE__ */ jsx(
+        "circle",
+        {
+          ...data,
+          cx: node.cx,
+          cy: node.cy,
+          r: node.r,
+          ...paintProps(node.paint)
+        }
+      );
+    case "line":
+      return /* @__PURE__ */ jsx(
+        "line",
+        {
+          ...data,
+          x1: node.x1,
+          y1: node.y1,
+          x2: node.x2,
+          y2: node.y2,
+          ...paintProps(node.paint)
+        }
+      );
+    case "text":
+      return /* @__PURE__ */ jsx(
+        "text",
+        {
+          ...data,
+          x: node.x,
+          y: node.y,
+          transform: node.rotate ? `rotate(${node.rotate} ${node.x} ${node.y})` : void 0,
+          fontSize: node.paint.fontSize,
+          fontWeight: node.paint.fontWeight,
+          textAnchor: node.paint.textAnchor,
+          dominantBaseline: node.paint.baseline ? BASELINE[node.paint.baseline] : void 0,
+          ...paintProps(node.paint),
+          children: node.text
+        }
+      );
+  }
+}
+function SvgSceneNodes({
+  scene,
+  clipPrefix
+}) {
+  return scene.nodes.map((node) => /* @__PURE__ */ jsx(SceneElement, { node, clipPrefix }, node.key));
+}
+export {
+  SvgSceneNodes
+};
+//# sourceMappingURL=svg-scene.js.map

package/dist/react/svg-scene.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/react/svg-scene.tsx"],
+  "sourcesContent": ["import type * as React from \"react\";\nimport { roundedBarPath } from \"#/core/paths.ts\";\nimport type {\n\tChartPaint,\n\tChartScene,\n\tChartTextPaint,\n\tSceneNode,\n} from \"#/core/types.ts\";\n\nconst BASELINE: Record<\n\tNonNullable<ChartTextPaint[\"baseline\"]>,\n\tReact.SVGAttributes<SVGTextElement>[\"dominantBaseline\"]\n> = {\n\ttop: \"hanging\",\n\tmiddle: \"central\",\n\tbottom: \"text-after-edge\",\n\talphabetic: \"alphabetic\",\n};\n\nfunction paintProps(paint: ChartPaint): React.SVGAttributes<SVGElement> {\n\treturn {\n\t\tfill: paint.fill ?? \"none\",\n\t\tstroke: paint.stroke,\n\t\tstrokeWidth: paint.strokeWidth,\n\t\tstrokeDasharray: paint.strokeDasharray,\n\t\tstrokeLinecap: paint.strokeLinecap,\n\t\tstrokeLinejoin: paint.strokeLinejoin,\n\t\topacity: paint.opacity,\n\t\tfillOpacity: paint.fillOpacity,\n\t\tstrokeOpacity: paint.strokeOpacity,\n\t};\n}\n\nfunction SceneElement({\n\tnode,\n\tclipPrefix,\n}: {\n\tnode: SceneNode;\n\tclipPrefix: string;\n}) {\n\tconst data = { \"data-role\": node.role, \"data-series\": node.series };\n\tswitch (node.kind) {\n\t\tcase \"group\": {\n\t\t\tconst clipId = node.clip ? `${clipPrefix}-${node.key}` : undefined;\n\t\t\treturn (\n\t\t\t\t<g\n\t\t\t\t\t{...data}\n\t\t\t\t\ttransform={\n\t\t\t\t\t\tnode.translate\n\t\t\t\t\t\t\t? `translate(${node.translate.x} ${node.translate.y})`\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tclipPath={clipId ? `url(#${clipId})` : undefined}\n\t\t\t\t>\n\t\t\t\t\t{node.clip && clipId ? (\n\t\t\t\t\t\t<clipPath id={clipId}>\n\t\t\t\t\t\t\t<rect {...node.clip} />\n\t\t\t\t\t\t</clipPath>\n\t\t\t\t\t) : null}\n\t\t\t\t\t{node.children.map((child) => (\n\t\t\t\t\t\t<SceneElement\n\t\t\t\t\t\t\tkey={child.key}\n\t\t\t\t\t\t\tnode={child}\n\t\t\t\t\t\t\tclipPrefix={clipPrefix}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</g>\n\t\t\t);\n\t\t}\n\t\tcase \"rect\":\n\t\t\treturn node.corners ? (\n\t\t\t\t<path\n\t\t\t\t\t{...data}\n\t\t\t\t\td={roundedBarPath({ ...node, radius: node.corners })}\n\t\t\t\t\t{...paintProps(node.paint)}\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<rect\n\t\t\t\t\t{...data}\n\t\t\t\t\tx={node.x}\n\t\t\t\t\ty={node.y}\n\t\t\t\t\twidth={node.width}\n\t\t\t\t\theight={node.height}\n\t\t\t\t\t{...paintProps(node.paint)}\n\t\t\t\t/>\n\t\t\t);\n\t\tcase \"path\":\n\t\t\treturn <path {...data} d={node.d} {...paintProps(node.paint)} />;\n\t\tcase \"circle\":\n\t\t\treturn (\n\t\t\t\t<circle\n\t\t\t\t\t{...data}\n\t\t\t\t\tcx={node.cx}\n\t\t\t\t\tcy={node.cy}\n\t\t\t\t\tr={node.r}\n\t\t\t\t\t{...paintProps(node.paint)}\n\t\t\t\t/>\n\t\t\t);\n\t\tcase \"line\":\n\t\t\treturn (\n\t\t\t\t<line\n\t\t\t\t\t{...data}\n\t\t\t\t\tx1={node.x1}\n\t\t\t\t\ty1={node.y1}\n\t\t\t\t\tx2={node.x2}\n\t\t\t\t\ty2={node.y2}\n\t\t\t\t\t{...paintProps(node.paint)}\n\t\t\t\t/>\n\t\t\t);\n\t\tcase \"text\":\n\t\t\treturn (\n\t\t\t\t<text\n\t\t\t\t\t{...data}\n\t\t\t\t\tx={node.x}\n\t\t\t\t\ty={node.y}\n\t\t\t\t\ttransform={\n\t\t\t\t\t\tnode.rotate\n\t\t\t\t\t\t\t? `rotate(${node.rotate} ${node.x} ${node.y})`\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tfontSize={node.paint.fontSize}\n\t\t\t\t\tfontWeight={node.paint.fontWeight}\n\t\t\t\t\ttextAnchor={node.paint.textAnchor}\n\t\t\t\t\tdominantBaseline={\n\t\t\t\t\t\tnode.paint.baseline ? BASELINE[node.paint.baseline] : undefined\n\t\t\t\t\t}\n\t\t\t\t\t{...paintProps(node.paint)}\n\t\t\t\t>\n\t\t\t\t\t{node.text}\n\t\t\t\t</text>\n\t\t\t);\n\t}\n}\n\n/** The scene's nodes as SVG elements, keyed so React reconciles a data update in place. */\nexport function SvgSceneNodes({\n\tscene,\n\tclipPrefix,\n}: {\n\tscene: ChartScene;\n\tclipPrefix: string;\n}) {\n\treturn scene.nodes.map((node) => (\n\t\t<SceneElement key={node.key} node={node} clipPrefix={clipPrefix} />\n\t));\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/react/use-animated-scene.d.ts

@@ -0,0 +1,10 @@
+import type { ChartScene } from "../core/types.js";
+/**
+ * The scene to draw this frame. A data change (`trigger` changed: a new
+ * definition, a series toggled) tweens from what is on screen to the new
+ * scene; a resize snaps, since watching bars slide while a window is dragged
+ * helps no one. Reduced motion always snaps. An update that lands mid-tween
+ * starts from the frame already painted, so nothing jumps.
+ */
+export declare function useAnimatedScene(scene: ChartScene, trigger: unknown, duration: number): ChartScene;
+//# sourceMappingURL=use-animated-scene.d.ts.map

package/dist/react/use-animated-scene.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-animated-scene.d.ts","sourceRoot":"","sources":["../../src/react/use-animated-scene.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AASlD;;;;;;GAMG;AACH,wBAAgB,gBAAgB,CAC/B,KAAK,EAAE,UAAU,EACjB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,MAAM,GACd,UAAU,CAkCZ"}

package/dist/react/use-animated-scene.js

@@ -0,0 +1,41 @@
+import * as React from "react";
+import { easeOutCubic, tweenScene } from "../core/motion/tween.js";
+function prefersReducedMotion() {
+  return typeof window !== "undefined" && window.matchMedia?.("(prefers-reduced-motion: reduce)").matches === true;
+}
+function useAnimatedScene(scene, trigger, duration) {
+  const [shown, setShown] = React.useState(scene);
+  const shownRef = React.useRef(scene);
+  const triggerRef = React.useRef(trigger);
+  React.useLayoutEffect(() => {
+    const changed = triggerRef.current !== trigger;
+    triggerRef.current = trigger;
+    if (!changed || duration <= 0 || prefersReducedMotion()) {
+      shownRef.current = scene;
+      setShown(scene);
+      return;
+    }
+    const from = shownRef.current;
+    const first = tweenScene(from, scene, 0);
+    shownRef.current = first;
+    setShown(first);
+    const start = performance.now();
+    let frame = 0;
+    function step(now) {
+      const t = Math.min(1, (now - start) / duration);
+      const next = tweenScene(from, scene, easeOutCubic(t));
+      shownRef.current = next;
+      setShown(next);
+      if (t < 1) {
+        frame = requestAnimationFrame(step);
+      }
+    }
+    frame = requestAnimationFrame(step);
+    return () => cancelAnimationFrame(frame);
+  }, [scene, trigger, duration]);
+  return shown;
+}
+export {
+  useAnimatedScene
+};
+//# sourceMappingURL=use-animated-scene.js.map

package/dist/react/use-animated-scene.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/react/use-animated-scene.ts"],
+  "sourcesContent": ["import * as React from \"react\";\nimport { easeOutCubic, tweenScene } from \"#/core/motion/tween.ts\";\nimport type { ChartScene } from \"#/core/types.ts\";\n\nfunction prefersReducedMotion(): boolean {\n\treturn (\n\t\ttypeof window !== \"undefined\" &&\n\t\twindow.matchMedia?.(\"(prefers-reduced-motion: reduce)\").matches === true\n\t);\n}\n\n/**\n * The scene to draw this frame. A data change (`trigger` changed: a new\n * definition, a series toggled) tweens from what is on screen to the new\n * scene; a resize snaps, since watching bars slide while a window is dragged\n * helps no one. Reduced motion always snaps. An update that lands mid-tween\n * starts from the frame already painted, so nothing jumps.\n */\nexport function useAnimatedScene(\n\tscene: ChartScene,\n\ttrigger: unknown,\n\tduration: number,\n): ChartScene {\n\tconst [shown, setShown] = React.useState(scene);\n\tconst shownRef = React.useRef(scene);\n\tconst triggerRef = React.useRef(trigger);\n\n\tReact.useLayoutEffect(() => {\n\t\tconst changed = triggerRef.current !== trigger;\n\t\ttriggerRef.current = trigger;\n\t\tif (!changed || duration <= 0 || prefersReducedMotion()) {\n\t\t\tshownRef.current = scene;\n\t\t\tsetShown(scene);\n\t\t\treturn;\n\t\t}\n\t\tconst from = shownRef.current;\n\t\t// Frame zero now, before paint: nodes that left are gone at once.\n\t\tconst first = tweenScene(from, scene, 0);\n\t\tshownRef.current = first;\n\t\tsetShown(first);\n\t\tconst start = performance.now();\n\t\tlet frame = 0;\n\t\tfunction step(now: number) {\n\t\t\tconst t = Math.min(1, (now - start) / duration);\n\t\t\tconst next = tweenScene(from, scene, easeOutCubic(t));\n\t\t\tshownRef.current = next;\n\t\t\tsetShown(next);\n\t\t\tif (t < 1) {\n\t\t\t\tframe = requestAnimationFrame(step);\n\t\t\t}\n\t\t}\n\t\tframe = requestAnimationFrame(step);\n\t\treturn () => cancelAnimationFrame(frame);\n\t}, [scene, trigger, duration]);\n\n\treturn shown;\n}\n"],
+  "mappings": "AAAA,YAAY,WAAW;AACvB,SAAS,cAAc,kBAAkB;AAGzC,SAAS,uBAAgC;AACxC,SACC,OAAO,WAAW,eAClB,OAAO,aAAa,kCAAkC,EAAE,YAAY;AAEtE;AASO,SAAS,iBACf,OACA,SACA,UACa;AACb,QAAM,CAAC,OAAO,QAAQ,IAAI,MAAM,SAAS,KAAK;AAC9C,QAAM,WAAW,MAAM,OAAO,KAAK;AACnC,QAAM,aAAa,MAAM,OAAO,OAAO;AAEvC,QAAM,gBAAgB,MAAM;AAC3B,UAAM,UAAU,WAAW,YAAY;AACvC,eAAW,UAAU;AACrB,QAAI,CAAC,WAAW,YAAY,KAAK,qBAAqB,GAAG;AACxD,eAAS,UAAU;AACnB,eAAS,KAAK;AACd;AAAA,IACD;AACA,UAAM,OAAO,SAAS;AAEtB,UAAM,QAAQ,WAAW,MAAM,OAAO,CAAC;AACvC,aAAS,UAAU;AACnB,aAAS,KAAK;AACd,UAAM,QAAQ,YAAY,IAAI;AAC9B,QAAI,QAAQ;AACZ,aAAS,KAAK,KAAa;AAC1B,YAAM,IAAI,KAAK,IAAI,IAAI,MAAM,SAAS,QAAQ;AAC9C,YAAM,OAAO,WAAW,MAAM,OAAO,aAAa,CAAC,CAAC;AACpD,eAAS,UAAU;AACnB,eAAS,IAAI;AACb,UAAI,IAAI,GAAG;AACV,gBAAQ,sBAAsB,IAAI;AAAA,MACnC;AAAA,IACD;AACA,YAAQ,sBAAsB,IAAI;AAClC,WAAO,MAAM,qBAAqB,KAAK;AAAA,EACxC,GAAG,CAAC,OAAO,SAAS,QAAQ,CAAC;AAE7B,SAAO;AACR;",
+  "names": []
+}

package/dist/react/use-chart-focus.d.ts

@@ -0,0 +1,29 @@
+import * as React from "react";
+import type { ChartFocusStop, findNearest } from "../core/nearest.js";
+import type { ChartFocusOrder, ChartPoint } from "../core/types.js";
+export interface ActiveFocus {
+    readonly stop: ChartFocusStop;
+    readonly point: ChartPoint;
+    readonly source: "pointer" | "keyboard";
+    readonly pinned: boolean;
+}
+interface Options {
+    readonly stops: ReadonlyArray<ChartFocusStop>;
+    readonly order: ChartFocusOrder;
+    readonly hitTest: (x: number, y: number) => ReturnType<typeof findNearest>;
+    readonly onFocusChange?: (point: ChartPoint | null) => void;
+    readonly onSelect?: (point: ChartPoint | null) => void;
+}
+export declare function useChartFocus({ stops, order, hitTest, onFocusChange, onSelect, }: Options): {
+    active: ActiveFocus | null;
+    handlers: {
+        onKeyDown: (event: React.KeyboardEvent<HTMLElement>) => void;
+        onPointerMove: (event: React.PointerEvent<HTMLElement>) => void;
+        onPointerLeave: () => void;
+        onClick: (event: React.MouseEvent<HTMLElement>) => void;
+        onFocus: (event: React.FocusEvent<HTMLElement>) => void;
+        onBlur: () => void;
+    };
+};
+export {};
+//# sourceMappingURL=use-chart-focus.d.ts.map

package/dist/react/use-chart-focus.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-chart-focus.d.ts","sourceRoot":"","sources":["../../src/react/use-chart-focus.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACrE,OAAO,KAAK,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAcnE,MAAM,WAAW,WAAW;IAC3B,QAAQ,CAAC,IAAI,EAAE,cAAc,CAAC;IAC9B,QAAQ,CAAC,KAAK,EAAE,UAAU,CAAC;IAC3B,QAAQ,CAAC,MAAM,EAAE,SAAS,GAAG,UAAU,CAAC;IACxC,QAAQ,CAAC,MAAM,EAAE,OAAO,CAAC;CACzB;AAED,UAAU,OAAO;IAChB,QAAQ,CAAC,KAAK,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IAC9C,QAAQ,CAAC,KAAK,EAAE,eAAe,CAAC;IAChC,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,KAAK,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;IAC3E,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,KAAK,IAAI,CAAC;IAC5D,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,KAAK,IAAI,CAAC;CACvD;AAiCD,wBAAgB,aAAa,CAAC,EAC7B,KAAK,EACL,KAAK,EACL,OAAO,EACP,aAAa,EACb,QAAQ,GACR,EAAE,OAAO;;;2BAsCiB,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC;+BAqE5B,KAAK,CAAC,YAAY,CAAC,WAAW,CAAC;;yBA4BrC,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC;yBAoB7B,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC;;;EAqBrD"}