minerva-design 1.4.0 → 1.5.0

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

@@ -0,0 +1,213 @@
+import { CSSProperties, Ref } from 'react';
+import { GraphChartInstance, GraphChartLabels, GraphCircularOptions, GraphDagOptions, GraphData, GraphDirection, GraphEdge, GraphEdgeStyle, GraphForceOptions, GraphGroup, GraphGroupToggleEvent, GraphHoverEvent, GraphInteractionOptions, GraphLayoutEndEvent, GraphLayoutType, GraphLegendOptions, GraphNode, GraphNodeShape, GraphPoint, GraphToggleEvent, GraphTooltipOptions, GraphTreeOptions } from '../engine/graph/types.js';
+import { ChartRendererKind, ChartRendererPreference } from '../engine/types.js';
+/** Imperative handle of the graph components (`ref`) */
+export interface GraphChartHandle {
+    /** Fits the visible nodes in the view */
+    fit(animate?: boolean): void;
+    /** Centers a node (expanding its collapsed ancestors), optionally zooming */
+    focusNode(id: string, options?: {
+        zoom?: number;
+        animate?: boolean;
+    }): void;
+    /** Replaces the data until the next render with new props */
+    setData(data: GraphData): void;
+    /** Selects nodes (`null` clears the selection) */
+    select(ids: readonly string[] | string | null): void;
+    /** Ids of the selected nodes */
+    getSelection(): string[];
+    /** Expands a node (all nodes without an id) */
+    expand(id?: string): void;
+    /** Collapses a node (all nodes with children without an id) */
+    collapse(id?: string): void;
+    /** Collapses / expands a node */
+    toggle(id: string): void;
+    /** Current positions of the nodes in layout units */
+    getPositions(): Record<string, GraphPoint>;
+    /** Computes the layout again */
+    relayout(): void;
+    /** Backend in use, `null` until ready */
+    getRenderer(): ChartRendererKind | null;
+    /** The underlying engine instance (minerva-design/charts/core) */
+    getInstance(): GraphChartInstance | null;
+}
+/** Props shared by `GraphChart`, `DependencyGraph` and `TreeChart` */
+export interface GraphCommonProps {
+    /** The nodes */
+    nodes: readonly GraphNode[];
+    /** The edges (parent → child in trees, prerequisite → dependent in DAGs) */
+    edges: readonly GraphEdge[];
+    /** Groups: legend order, names and colors */
+    groups?: readonly GraphGroup[];
+    /**
+     * Height of the chart (the legend included); numbers are pixels
+     * @default 480
+     */
+    height?: number | string;
+    /**
+     * Width of the chart; numbers are pixels
+     * @default "100%"
+     */
+    width?: number | string;
+    /** Shape of the nodes without `shape` (boxes for DAGs, org charts and mind maps, circles otherwise) */
+    nodeShape?: GraphNodeShape;
+    /** Circle diameter in layout units, or `[min, max]` scaled by the node `value` */
+    nodeSize?: number | readonly [number, number];
+    /** Edge shape; depends on the layout when omitted */
+    edgeStyle?: GraphEdgeStyle;
+    /** Edge width in CSS pixels, or `[min, max]` scaled by the edge `value` */
+    edgeWidth?: number | readonly [number, number];
+    /**
+     * Edge colors: neutral or tinted with the source / target node
+     * @default "neutral"
+     */
+    edgeColor?: "neutral" | "source" | "target";
+    /** Arrowheads on the edges without `directed` */
+    arrows?: boolean;
+    /**
+     * Node labels; `auto` hides minor and overlapping labels when zoomed out.
+     * Text inside boxes keeps a readable minimum size and is shortened with an ellipsis;
+     * it is hidden only when the box is too small for any text, or with `false`
+     * @default "auto"
+     */
+    nodeLabels?: boolean | "auto";
+    /**
+     * Edge labels: always, `auto` (zoomed in or highlighted), only `hover`, or never
+     * @default "auto"
+     */
+    edgeLabels?: boolean | "auto" | "hover";
+    /** What hovering / selecting a node highlights */
+    highlight?: "neighbors" | "lineage" | "none";
+    /** Ids of the selected nodes (changing it updates the selection) */
+    selected?: readonly string[];
+    /**
+     * Animates layout and data changes; a number is the duration in ms
+     * @default true
+     */
+    animation?: boolean | number;
+    /**
+     * Padding around the graph when fitting it, in CSS pixels
+     * @default 24
+     */
+    fitPadding?: number;
+    /**
+     * Zoom buttons (zoom in, zoom out, fit)
+     * @default true
+     */
+    controls?: boolean;
+    /** Legend of the groups; shown by default with several groups */
+    legend?: boolean | GraphLegendOptions;
+    /** Tooltip; `false` disables it */
+    tooltip?: boolean | GraphTooltipOptions;
+    /**
+     * Drag pans, Ctrl / ⌘ + wheel and pinch zoom, nodes can be dragged
+     * (force, circular), click selects, arrow keys move between nodes;
+     * `false` makes the chart static
+     * @default true
+     */
+    interaction?: boolean | GraphInteractionOptions;
+    /**
+     * Backend of the nodes and edges: `auto` tries WebGPU, then WebGL2, then
+     * WebGL, then Canvas2D, skipping GPUs running in software
+     * @default "auto"
+     */
+    renderer?: ChartRendererPreference;
+    /** Group colors (defaults to the `--chart-series-1..8` CSS variables, then the theme colors) */
+    palette?: readonly string[];
+    /** Accessible name of the chart */
+    ariaLabel?: string;
+    /**
+     * Language of the built-in texts (summary, announcements, tooltip,
+     * buttons); built-in texts in English, Chinese, Japanese and French
+     * @default the page language (`<html lang>`), then the browser language
+     */
+    locale?: string;
+    /** Overrides of the built-in texts of the `locale` */
+    labels?: Partial<GraphChartLabels>;
+    /** Called when the hovered (or keyboard-focused) node / edge changes */
+    onHover?: (event: GraphHoverEvent | null) => void;
+    /** Called when a node or an edge is clicked (or a node activated with Enter) */
+    onItemClick?: (event: GraphHoverEvent) => void;
+    /** Called with the ids of the selected nodes when the selection changes */
+    onSelectionChange?: (ids: string[]) => void;
+    /** Called when a tree node is collapsed or expanded */
+    onToggle?: (event: GraphToggleEvent) => void;
+    /** Called when the legend shows / hides a group */
+    onGroupToggle?: (event: GraphGroupToggleEvent) => void;
+    /** Called when the layout is done (the force simulation cooled down) */
+    onLayoutEnd?: (event: GraphLayoutEndEvent) => void;
+    /** Called with the backend once it is ready (and after a fallback) */
+    onRendererChange?: (renderer: ChartRendererKind) => void;
+    /** Class of the outer element */
+    className?: string;
+    /** Style of the outer element */
+    style?: CSSProperties;
+    /** Imperative handle */
+    ref?: Ref<GraphChartHandle>;
+}
+/** Props of `GraphChart` */
+export interface GraphChartProps extends GraphCommonProps {
+    /**
+     * Placement of the nodes
+     * @default "force"
+     */
+    layout?: GraphLayoutType;
+    /** Direction of the `dag` and `tree` layouts */
+    direction?: GraphDirection;
+    /** Force layout settings (Barnes–Hut, worker for large graphs) */
+    force?: GraphForceOptions;
+    /** Circular / arc layout settings */
+    circular?: GraphCircularOptions;
+    /** Layered layout settings (`layout="dag"`) */
+    dag?: GraphDagOptions;
+    /** Tree layout settings (tree layouts) */
+    tree?: GraphTreeOptions;
+}
+/** Props of `DependencyGraph` */
+export interface DependencyGraphProps extends GraphCommonProps {
+    /**
+     * Flow direction
+     * @default "TB"
+     */
+    direction?: GraphDirection;
+    /** Layer / node spacing, crossing reduction sweeps */
+    dag?: GraphDagOptions;
+    /**
+     * Highlights the longest path (node `value` = duration); `true` computes it, a list of ids sets it
+     * @default false
+     */
+    criticalPath?: boolean | readonly string[];
+}
+/** Props of `TreeChart` */
+export interface TreeChartProps extends GraphCommonProps {
+    /**
+     * Kind of tree: tidy tree, radial tree, two-sided mind map or org chart
+     * @default "tree"
+     */
+    layout?: "tree" | "radial" | "mindmap" | "org";
+    /**
+     * Direction of `layout="tree"`
+     * @default "LR"
+     */
+    direction?: GraphDirection;
+    /** Root, spacing, collapsing, card size */
+    tree?: GraphTreeOptions;
+}
+/**
+ * Relationship network (关系图): force-directed by default (Barnes–Hut,
+ * a Web Worker for large graphs), or circular, arc diagram, layered or
+ * tree layouts; GPU rendering, pan / zoom, drag, neighbor highlight,
+ * legend toggles and keyboard navigation.
+ */
+export declare function GraphChart(props: GraphChartProps): import('react').JSX.Element;
+/**
+ * Dependency graph (依赖图): layered (Sugiyama) layout of a DAG with
+ * crossing reduction, spline or orthogonal edges with arrowheads,
+ * upstream / downstream highlight and the critical path.
+ */
+export declare function DependencyGraph(props: DependencyGraphProps): import('react').JSX.Element;
+/**
+ * Tree chart (树图): tidy tree, radial tree, mind map or org chart, with
+ * animated collapse / expand of the subtrees.
+ */
+export declare function TreeChart(props: TreeChartProps): import('react').JSX.Element;

package/dist/charts/react/graph.js

@@ -0,0 +1,159 @@
+"use client";
+import { createGraphChart as e } from "../engine/graph/chart.js";
+import { useEffect as t, useImperativeHandle as n, useRef as r, useState as i } from "react";
+import { jsx as a } from "react/jsx-runtime";
+//#region src/react/graph.tsx
+var o = (e) => {
+	if (typeof e != "object" || !e) return !1;
+	let t = Object.getPrototypeOf(e);
+	return t === Object.prototype || t === null;
+}, s = (e, t) => {
+	let n = Object.keys(e);
+	return n.length === Object.keys(t).length && n.every((n) => e[n] === t[n] && Object.prototype.hasOwnProperty.call(t, n));
+}, c = (e, t) => e === t ? !0 : Array.isArray(e) && Array.isArray(t) ? e.length === t.length && e.every((e, n) => e === t[n]) : o(e) && o(t) && s(e, t), l = (e, t) => {
+	if (e === t) return !0;
+	let n = Object.keys(e);
+	return n.length === Object.keys(t).length && n.every((n) => Object.prototype.hasOwnProperty.call(t, n) && c(e[n], t[n]));
+}, u = (e, t) => e === void 0 ? t : typeof e == "number" ? `${e}px` : e;
+function d({ options: o, height: s, width: c, className: d, style: f, handleRef: p, ...m }) {
+	let h = r(null), g = r(null), _ = r(m), [v, y] = i(o);
+	v !== o && !l(v, o) && y(o);
+	let b = r(v);
+	return t(() => {
+		_.current = m;
+	}), t(() => {
+		let t = h.current;
+		if (!t) return;
+		let n = e(t, b.current);
+		g.current = n;
+		let r = [
+			n.on("hover", (e) => _.current.onHover?.(e)),
+			n.on("click", (e) => _.current.onItemClick?.(e)),
+			n.on("select", (e) => _.current.onSelectionChange?.(e.ids)),
+			n.on("toggle", (e) => _.current.onToggle?.(e)),
+			n.on("groupToggle", (e) => _.current.onGroupToggle?.(e)),
+			n.on("layoutEnd", (e) => _.current.onLayoutEnd?.(e)),
+			n.on("renderer", (e) => _.current.onRendererChange?.(e))
+		];
+		return () => {
+			r.forEach((e) => e()), n.destroy(), g.current = null;
+		};
+	}, []), t(() => {
+		b.current !== v && (b.current = v, g.current?.setOptions(v));
+	}, [v]), n(p, () => ({
+		fit: (e) => g.current?.fit(e),
+		focusNode: (e, t) => g.current?.focusNode(e, t),
+		setData: (e) => g.current?.setData(e),
+		select: (e) => g.current?.select(e),
+		getSelection: () => g.current?.getSelection() ?? [],
+		expand: (e) => g.current?.expand(e),
+		collapse: (e) => g.current?.collapse(e),
+		toggle: (e) => g.current?.toggle(e),
+		getPositions: () => g.current?.getPositions() ?? {},
+		relayout: () => g.current?.relayout(),
+		getRenderer: () => g.current?.getRenderer() ?? null,
+		getInstance: () => g.current
+	}), []), /* @__PURE__ */ a("div", {
+		className: d,
+		style: {
+			position: "relative",
+			width: u(c, "100%"),
+			height: u(s, "480px"),
+			...f
+		},
+		children: /* @__PURE__ */ a("div", {
+			ref: h,
+			style: {
+				position: "absolute",
+				inset: 0
+			}
+		})
+	});
+}
+function f({ props: e, layout: t }) {
+	let { nodes: n, edges: r, groups: i, height: o, width: s, nodeShape: c, nodeSize: l, edgeStyle: u, edgeWidth: f, edgeColor: p, arrows: m, nodeLabels: h, edgeLabels: g, highlight: _, selected: v, animation: y, fitPadding: b, controls: x, legend: S, tooltip: C, interaction: w, renderer: T, palette: E, ariaLabel: D, locale: O, labels: k, onHover: A, onItemClick: j, onSelectionChange: M, onToggle: N, onGroupToggle: P, onLayoutEnd: F, onRendererChange: I, className: L, style: R, ref: z } = e, B = {
+		nodes: n,
+		edges: r,
+		groups: i,
+		...t,
+		nodeShape: c,
+		nodeSize: l,
+		edgeStyle: u,
+		edgeWidth: f,
+		edgeColor: p,
+		arrows: m,
+		nodeLabels: h,
+		edgeLabels: g,
+		highlight: _,
+		selected: v,
+		animation: y,
+		fitPadding: b,
+		controls: x,
+		legend: S,
+		tooltip: C,
+		interaction: w,
+		renderer: T,
+		palette: E,
+		ariaLabel: D,
+		locale: O,
+		labels: k
+	};
+	return /* @__PURE__ */ a(d, {
+		options: B,
+		height: o,
+		width: s,
+		className: L,
+		style: R,
+		handleRef: z,
+		onHover: A,
+		onItemClick: j,
+		onSelectionChange: M,
+		onToggle: N,
+		onGroupToggle: P,
+		onLayoutEnd: F,
+		onRendererChange: I
+	});
+}
+function p(e) {
+	let { layout: t, direction: n, force: r, circular: i, dag: o, tree: s } = e;
+	return /* @__PURE__ */ a(f, {
+		props: e,
+		layout: {
+			layout: t ?? "force",
+			direction: n,
+			force: r,
+			circular: i,
+			dag: o,
+			tree: s
+		}
+	});
+}
+function m(e) {
+	let { direction: t, dag: n, criticalPath: r } = e;
+	return /* @__PURE__ */ a(f, {
+		props: e,
+		layout: {
+			layout: "dag",
+			direction: t ?? "TB",
+			dag: r === void 0 ? n : {
+				...n,
+				criticalPath: r
+			}
+		}
+	});
+}
+function h(e) {
+	let { layout: t, direction: n, tree: r } = e;
+	return /* @__PURE__ */ a(f, {
+		props: e,
+		layout: {
+			layout: t ?? "tree",
+			direction: n,
+			tree: r
+		}
+	});
+}
+//#endregion
+export { m as DependencyGraph, p as GraphChart, h as TreeChart };
+
+//# sourceMappingURL=graph.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"graph.js","names":["isPlainObject","value","proto","shallowEqual","keys","a","b","key","sameValue","v","i","sameGraphOptions","cssSize","fallback","GraphBase","handlers","containerRef","useRef","chartRef","handlersRef","stable","setStable","useState","options","optionsRef","useEffect","container","chart","createGraphChart","offs","r","off","useImperativeHandle","handleRef","animate","id","opts","data","ids","width","height","style","GraphFrame","props","layout","ref","GraphChart","DependencyGraph","direction","criticalPath","dag","TreeChart"],"sources":["../../../../charts/src/react/graph.tsx"],"sourcesContent":["import {\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  useState,\n  type CSSProperties,\n  type Ref,\n} from \"react\";\nimport { createGraphChart } from \"../engine/graph/chart\";\nimport type {\n  GraphChartInstance,\n  GraphChartLabels,\n  GraphChartOptions,\n  GraphCircularOptions,\n  GraphDagOptions,\n  GraphData,\n  GraphDirection,\n  GraphEdge,\n  GraphEdgeStyle,\n  GraphForceOptions,\n  GraphGroup,\n  GraphGroupToggleEvent,\n  GraphHoverEvent,\n  GraphInteractionOptions,\n  GraphLayoutEndEvent,\n  GraphLayoutType,\n  GraphLegendOptions,\n  GraphNode,\n  GraphNodeShape,\n  GraphPoint,\n  GraphToggleEvent,\n  GraphTooltipOptions,\n  GraphTreeOptions,\n} from \"../engine/graph/types\";\nimport type {\n  ChartRendererKind,\n  ChartRendererPreference,\n} from \"../engine/types\";\n\n/** Imperative handle of the graph components (`ref`) */\nexport interface GraphChartHandle {\n  /** Fits the visible nodes in the view */\n  fit(animate?: boolean): void;\n  /** Centers a node (expanding its collapsed ancestors), optionally zooming */\n  focusNode(id: string, options?: { zoom?: number; animate?: boolean }): void;\n  /** Replaces the data until the next render with new props */\n  setData(data: GraphData): void;\n  /** Selects nodes (`null` clears the selection) */\n  select(ids: readonly string[] | string | null): void;\n  /** Ids of the selected nodes */\n  getSelection(): string[];\n  /** Expands a node (all nodes without an id) */\n  expand(id?: string): void;\n  /** Collapses a node (all nodes with children without an id) */\n  collapse(id?: string): void;\n  /** Collapses / expands a node */\n  toggle(id: string): void;\n  /** Current positions of the nodes in layout units */\n  getPositions(): Record<string, GraphPoint>;\n  /** Computes the layout again */\n  relayout(): void;\n  /** Backend in use, `null` until ready */\n  getRenderer(): ChartRendererKind | null;\n  /** The underlying engine instance (minerva-design/charts/core) */\n  getInstance(): GraphChartInstance | null;\n}\n\n/** Props shared by `GraphChart`, `DependencyGraph` and `TreeChart` */\nexport interface GraphCommonProps {\n  /** The nodes */\n  nodes: readonly GraphNode[];\n  /** The edges (parent → child in trees, prerequisite → dependent in DAGs) */\n  edges: readonly GraphEdge[];\n  /** Groups: legend order, names and colors */\n  groups?: readonly GraphGroup[];\n  /**\n   * Height of the chart (the legend included); numbers are pixels\n   * @default 480\n   */\n  height?: number | string;\n  /**\n   * Width of the chart; numbers are pixels\n   * @default \"100%\"\n   */\n  width?: number | string;\n  /** Shape of the nodes without `shape` (boxes for DAGs, org charts and mind maps, circles otherwise) */\n  nodeShape?: GraphNodeShape;\n  /** Circle diameter in layout units, or `[min, max]` scaled by the node `value` */\n  nodeSize?: number | readonly [number, number];\n  /** Edge shape; depends on the layout when omitted */\n  edgeStyle?: GraphEdgeStyle;\n  /** Edge width in CSS pixels, or `[min, max]` scaled by the edge `value` */\n  edgeWidth?: number | readonly [number, number];\n  /**\n   * Edge colors: neutral or tinted with the source / target node\n   * @default \"neutral\"\n   */\n  edgeColor?: \"neutral\" | \"source\" | \"target\";\n  /** Arrowheads on the edges without `directed` */\n  arrows?: boolean;\n  /**\n   * Node labels; `auto` hides minor and overlapping labels when zoomed out.\n   * Text inside boxes keeps a readable minimum size and is shortened with an ellipsis;\n   * it is hidden only when the box is too small for any text, or with `false`\n   * @default \"auto\"\n   */\n  nodeLabels?: boolean | \"auto\";\n  /**\n   * Edge labels: always, `auto` (zoomed in or highlighted), only `hover`, or never\n   * @default \"auto\"\n   */\n  edgeLabels?: boolean | \"auto\" | \"hover\";\n  /** What hovering / selecting a node highlights */\n  highlight?: \"neighbors\" | \"lineage\" | \"none\";\n  /** Ids of the selected nodes (changing it updates the selection) */\n  selected?: readonly string[];\n  /**\n   * Animates layout and data changes; a number is the duration in ms\n   * @default true\n   */\n  animation?: boolean | number;\n  /**\n   * Padding around the graph when fitting it, in CSS pixels\n   * @default 24\n   */\n  fitPadding?: number;\n  /**\n   * Zoom buttons (zoom in, zoom out, fit)\n   * @default true\n   */\n  controls?: boolean;\n  /** Legend of the groups; shown by default with several groups */\n  legend?: boolean | GraphLegendOptions;\n  /** Tooltip; `false` disables it */\n  tooltip?: boolean | GraphTooltipOptions;\n  /**\n   * Drag pans, Ctrl / ⌘ + wheel and pinch zoom, nodes can be dragged\n   * (force, circular), click selects, arrow keys move between nodes;\n   * `false` makes the chart static\n   * @default true\n   */\n  interaction?: boolean | GraphInteractionOptions;\n  /**\n   * Backend of the nodes and edges: `auto` tries WebGPU, then WebGL2, then\n   * WebGL, then Canvas2D, skipping GPUs running in software\n   * @default \"auto\"\n   */\n  renderer?: ChartRendererPreference;\n  /** Group colors (defaults to the `--chart-series-1..8` CSS variables, then the theme colors) */\n  palette?: readonly string[];\n  /** Accessible name of the chart */\n  ariaLabel?: string;\n  /**\n   * Language of the built-in texts (summary, announcements, tooltip,\n   * buttons); built-in texts in English, Chinese, Japanese and French\n   * @default the page language (`<html lang>`), then the browser language\n   */\n  locale?: string;\n  /** Overrides of the built-in texts of the `locale` */\n  labels?: Partial<GraphChartLabels>;\n  /** Called when the hovered (or keyboard-focused) node / edge changes */\n  onHover?: (event: GraphHoverEvent | null) => void;\n  /** Called when a node or an edge is clicked (or a node activated with Enter) */\n  onItemClick?: (event: GraphHoverEvent) => void;\n  /** Called with the ids of the selected nodes when the selection changes */\n  onSelectionChange?: (ids: string[]) => void;\n  /** Called when a tree node is collapsed or expanded */\n  onToggle?: (event: GraphToggleEvent) => void;\n  /** Called when the legend shows / hides a group */\n  onGroupToggle?: (event: GraphGroupToggleEvent) => void;\n  /** Called when the layout is done (the force simulation cooled down) */\n  onLayoutEnd?: (event: GraphLayoutEndEvent) => void;\n  /** Called with the backend once it is ready (and after a fallback) */\n  onRendererChange?: (renderer: ChartRendererKind) => void;\n  /** Class of the outer element */\n  className?: string;\n  /** Style of the outer element */\n  style?: CSSProperties;\n  /** Imperative handle */\n  ref?: Ref<GraphChartHandle>;\n}\n\n/** Props of `GraphChart` */\nexport interface GraphChartProps extends GraphCommonProps {\n  /**\n   * Placement of the nodes\n   * @default \"force\"\n   */\n  layout?: GraphLayoutType;\n  /** Direction of the `dag` and `tree` layouts */\n  direction?: GraphDirection;\n  /** Force layout settings (Barnes–Hut, worker for large graphs) */\n  force?: GraphForceOptions;\n  /** Circular / arc layout settings */\n  circular?: GraphCircularOptions;\n  /** Layered layout settings (`layout=\"dag\"`) */\n  dag?: GraphDagOptions;\n  /** Tree layout settings (tree layouts) */\n  tree?: GraphTreeOptions;\n}\n\n/** Props of `DependencyGraph` */\nexport interface DependencyGraphProps extends GraphCommonProps {\n  /**\n   * Flow direction\n   * @default \"TB\"\n   */\n  direction?: GraphDirection;\n  /** Layer / node spacing, crossing reduction sweeps */\n  dag?: GraphDagOptions;\n  /**\n   * Highlights the longest path (node `value` = duration); `true` computes it, a list of ids sets it\n   * @default false\n   */\n  criticalPath?: boolean | readonly string[];\n}\n\n/** Props of `TreeChart` */\nexport interface TreeChartProps extends GraphCommonProps {\n  /**\n   * Kind of tree: tidy tree, radial tree, two-sided mind map or org chart\n   * @default \"tree\"\n   */\n  layout?: \"tree\" | \"radial\" | \"mindmap\" | \"org\";\n  /**\n   * Direction of `layout=\"tree\"`\n   * @default \"LR\"\n   */\n  direction?: GraphDirection;\n  /** Root, spacing, collapsing, card size */\n  tree?: GraphTreeOptions;\n}\n\n// ----------------------------------------------------------------- base\n\ninterface Handlers {\n  onHover?: (event: GraphHoverEvent | null) => void;\n  onItemClick?: (event: GraphHoverEvent) => void;\n  onSelectionChange?: (ids: string[]) => void;\n  onToggle?: (event: GraphToggleEvent) => void;\n  onGroupToggle?: (event: GraphGroupToggleEvent) => void;\n  onLayoutEnd?: (event: GraphLayoutEndEvent) => void;\n  onRendererChange?: (renderer: ChartRendererKind) => void;\n}\n\nconst isPlainObject = (value: unknown): value is Record<string, unknown> => {\n  if (typeof value !== \"object\" || value === null) return false;\n  const proto = Object.getPrototypeOf(value);\n  return proto === Object.prototype || proto === null;\n};\n\nconst shallowEqual = (\n  a: Record<string, unknown>,\n  b: Record<string, unknown>,\n): boolean => {\n  const keys = Object.keys(a);\n  if (keys.length !== Object.keys(b).length) return false;\n  return keys.every(\n    (key) => a[key] === b[key] && Object.prototype.hasOwnProperty.call(b, key),\n  );\n};\n\nconst sameValue = (a: unknown, b: unknown): boolean => {\n  if (a === b) return true;\n  if (Array.isArray(a) && Array.isArray(b))\n    return a.length === b.length && a.every((v, i) => v === b[i]);\n  return isPlainObject(a) && isPlainObject(b) && shallowEqual(a, b);\n};\n\n/**\n * Whether two option objects describe the same chart: top-level values by\n * identity, one level deep for inline arrays / objects (node and edge\n * arrays rebuilt with the same objects are the same data)\n */\nconst sameGraphOptions = (\n  a: GraphChartOptions,\n  b: GraphChartOptions,\n): boolean => {\n  if (a === b) return true;\n  const keys = Object.keys(a) as (keyof GraphChartOptions)[];\n  if (keys.length !== Object.keys(b).length) return false;\n  return keys.every(\n    (key) =>\n      Object.prototype.hasOwnProperty.call(b, key) && sameValue(a[key], b[key]),\n  );\n};\n\nconst cssSize = (value: number | string | undefined, fallback: string) =>\n  value === undefined\n    ? fallback\n    : typeof value === \"number\"\n      ? `${value}px`\n      : value;\n\ninterface GraphBaseProps extends Handlers {\n  options: GraphChartOptions;\n  height?: number | string;\n  width?: number | string;\n  className?: string;\n  style?: CSSProperties;\n  handleRef?: Ref<GraphChartHandle>;\n}\n\nfunction GraphBase({\n  options,\n  height,\n  width,\n  className,\n  style,\n  handleRef,\n  ...handlers\n}: GraphBaseProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const chartRef = useRef<GraphChartInstance | null>(null);\n  const handlersRef = useRef<Handlers>(handlers);\n  // keep the previous options while they describe the same chart\n  const [stable, setStable] = useState(options);\n  if (stable !== options && !sameGraphOptions(stable, options))\n    setStable(options);\n  const optionsRef = useRef(stable);\n\n  useEffect(() => {\n    handlersRef.current = handlers;\n  });\n\n  useEffect(() => {\n    const container = containerRef.current;\n    if (!container) return;\n    const chart = createGraphChart(container, optionsRef.current);\n    chartRef.current = chart;\n    const offs = [\n      chart.on(\"hover\", (e) => handlersRef.current.onHover?.(e)),\n      chart.on(\"click\", (e) => handlersRef.current.onItemClick?.(e)),\n      chart.on(\"select\", (e) => handlersRef.current.onSelectionChange?.(e.ids)),\n      chart.on(\"toggle\", (e) => handlersRef.current.onToggle?.(e)),\n      chart.on(\"groupToggle\", (e) => handlersRef.current.onGroupToggle?.(e)),\n      chart.on(\"layoutEnd\", (e) => handlersRef.current.onLayoutEnd?.(e)),\n      chart.on(\"renderer\", (r) => handlersRef.current.onRendererChange?.(r)),\n    ];\n    return () => {\n      offs.forEach((off) => off());\n      chart.destroy();\n      chartRef.current = null;\n    };\n  }, []);\n\n  useEffect(() => {\n    if (optionsRef.current === stable) return;\n    optionsRef.current = stable;\n    chartRef.current?.setOptions(stable);\n  }, [stable]);\n\n  useImperativeHandle(\n    handleRef,\n    () => ({\n      fit: (animate) => chartRef.current?.fit(animate),\n      focusNode: (id, opts) => chartRef.current?.focusNode(id, opts),\n      setData: (data) => chartRef.current?.setData(data),\n      select: (ids) => chartRef.current?.select(ids),\n      getSelection: () => chartRef.current?.getSelection() ?? [],\n      expand: (id) => chartRef.current?.expand(id),\n      collapse: (id) => chartRef.current?.collapse(id),\n      toggle: (id) => chartRef.current?.toggle(id),\n      getPositions: () => chartRef.current?.getPositions() ?? {},\n      relayout: () => chartRef.current?.relayout(),\n      getRenderer: () => chartRef.current?.getRenderer() ?? null,\n      getInstance: () => chartRef.current,\n    }),\n    [],\n  );\n\n  return (\n    <div\n      className={className}\n      style={{\n        position: \"relative\",\n        width: cssSize(width, \"100%\"),\n        height: cssSize(height, \"480px\"),\n        ...style,\n      }}\n    >\n      <div ref={containerRef} style={{ position: \"absolute\", inset: 0 }} />\n    </div>\n  );\n}\n\n/** Renders a chart from the common props and the layout options */\nfunction GraphFrame({\n  props,\n  layout,\n}: {\n  props: GraphCommonProps;\n  layout: Pick<\n    GraphChartOptions,\n    \"layout\" | \"direction\" | \"force\" | \"circular\" | \"dag\" | \"tree\"\n  >;\n}) {\n  const {\n    nodes,\n    edges,\n    groups,\n    height,\n    width,\n    nodeShape,\n    nodeSize,\n    edgeStyle,\n    edgeWidth,\n    edgeColor,\n    arrows,\n    nodeLabels,\n    edgeLabels,\n    highlight,\n    selected,\n    animation,\n    fitPadding,\n    controls,\n    legend,\n    tooltip,\n    interaction,\n    renderer,\n    palette,\n    ariaLabel,\n    locale,\n    labels,\n    onHover,\n    onItemClick,\n    onSelectionChange,\n    onToggle,\n    onGroupToggle,\n    onLayoutEnd,\n    onRendererChange,\n    className,\n    style,\n    ref,\n  } = props;\n  const options: GraphChartOptions = {\n    nodes,\n    edges,\n    groups,\n    ...layout,\n    nodeShape,\n    nodeSize,\n    edgeStyle,\n    edgeWidth,\n    edgeColor,\n    arrows,\n    nodeLabels,\n    edgeLabels,\n    highlight,\n    selected,\n    animation,\n    fitPadding,\n    controls,\n    legend,\n    tooltip,\n    interaction,\n    renderer,\n    palette,\n    ariaLabel,\n    locale,\n    labels,\n  };\n  return (\n    <GraphBase\n      options={options}\n      height={height}\n      width={width}\n      className={className}\n      style={style}\n      handleRef={ref}\n      onHover={onHover}\n      onItemClick={onItemClick}\n      onSelectionChange={onSelectionChange}\n      onToggle={onToggle}\n      onGroupToggle={onGroupToggle}\n      onLayoutEnd={onLayoutEnd}\n      onRendererChange={onRendererChange}\n    />\n  );\n}\n\n// ----------------------------------------------------------- components\n\n/**\n * Relationship network (关系图): force-directed by default (Barnes–Hut,\n * a Web Worker for large graphs), or circular, arc diagram, layered or\n * tree layouts; GPU rendering, pan / zoom, drag, neighbor highlight,\n * legend toggles and keyboard navigation.\n */\nexport function GraphChart(props: GraphChartProps) {\n  const { layout, direction, force, circular, dag, tree } = props;\n  return (\n    <GraphFrame\n      props={props}\n      layout={{\n        layout: layout ?? \"force\",\n        direction,\n        force,\n        circular,\n        dag,\n        tree,\n      }}\n    />\n  );\n}\n\n/**\n * Dependency graph (依赖图): layered (Sugiyama) layout of a DAG with\n * crossing reduction, spline or orthogonal edges with arrowheads,\n * upstream / downstream highlight and the critical path.\n */\nexport function DependencyGraph(props: DependencyGraphProps) {\n  const { direction, dag, criticalPath } = props;\n  return (\n    <GraphFrame\n      props={props}\n      layout={{\n        layout: \"dag\",\n        direction: direction ?? \"TB\",\n        dag: criticalPath === undefined ? dag : { ...dag, criticalPath },\n      }}\n    />\n  );\n}\n\n/**\n * Tree chart (树图): tidy tree, radial tree, mind map or org chart, with\n * animated collapse / expand of the subtrees.\n */\nexport function TreeChart(props: TreeChartProps) {\n  const { layout, direction, tree } = props;\n  return (\n    <GraphFrame\n      props={props}\n      layout={{ layout: layout ?? \"tree\", direction, tree }}\n    />\n  );\n}\n"],"mappings":";;;;;AAqPA,IAAMA,KAAiB,MAAqD;CAC1E,IAAI,OAAOC,KAAU,aAAYA,GAAgB,OAAO;CACxD,IAAMC,IAAQ,OAAO,eAAeD,CAAK;CACzC,OAAOC,MAAU,OAAO,aAAaA,MAAU;AACjD,GAEMC,KACJ,GACA,MACY;CACZ,IAAMC,IAAO,OAAO,KAAKC,CAAC;CAE1B,OADID,EAAK,WAAW,OAAO,KAAKE,CAAC,CAAC,CAAC,UAC5BF,EAAK,OACT,MAAQC,EAAEE,OAASD,EAAEC,MAAQ,OAAO,UAAU,eAAe,KAAKD,GAAGC,CAAG,CAC3E;AACF,GAEMC,KAAa,GAAY,MACzBH,MAAMC,IAAU,KAChB,MAAM,QAAQD,CAAC,KAAK,MAAM,QAAQC,CAAC,IAC9BD,EAAE,WAAWC,EAAE,UAAUD,EAAE,OAAO,GAAG,MAAMI,MAAMH,EAAEI,EAAE,IACvDV,EAAcK,CAAC,KAAKL,EAAcM,CAAC,KAAKH,EAAaE,GAAGC,CAAC,GAQ5DK,KACJ,GACA,MACY;CACZ,IAAIN,MAAMC,GAAG,OAAO;CACpB,IAAMF,IAAO,OAAO,KAAKC,CAAC;CAE1B,OADID,EAAK,WAAW,OAAO,KAAKE,CAAC,CAAC,CAAC,UAC5BF,EAAK,OACT,MACC,OAAO,UAAU,eAAe,KAAKE,GAAGC,CAAG,KAAKC,EAAUH,EAAEE,IAAMD,EAAEC,EAAI,CAC5E;AACF,GAEMK,KAAW,GAAoC,MACnDX,MAAU,KAAA,IACNY,IACA,OAAOZ,KAAU,WACf,GAAGA,EAAM,MACTA;AAWR,SAASa,EAAU,EACjB,YACA,WACA,UACA,cACA,UACA,cACA,GAAGC,KACc;CACjB,IAAMC,IAAeC,EAAuB,IAAI,GAC1CC,IAAWD,EAAkC,IAAI,GACjDE,IAAcF,EAAiBF,CAAQ,GAEvC,CAACK,GAAQC,KAAaC,EAASC,CAAO;CAC5C,AAAIH,MAAWG,KAAW,CAACZ,EAAiBS,GAAQG,CAAO,KACzDF,EAAUE,CAAO;CACnB,IAAMC,IAAaP,EAAOG,CAAM;CAoDhC,OAlDAK,QAAgB;EACd,EAAY,UAAUV;CACxB,CAAC,GAEDU,QAAgB;EACd,IAAMC,IAAYV,EAAa;EAC/B,IAAI,CAACU,GAAW;EAChB,IAAMC,IAAQC,EAAiBF,GAAWF,EAAW,OAAO;EAC5D,EAAS,UAAUG;EACnB,IAAME,IAAO;GACXF,EAAM,GAAG,UAAU,MAAMR,EAAY,QAAQ,UAAU,CAAC,CAAC;GACzDQ,EAAM,GAAG,UAAU,MAAMR,EAAY,QAAQ,cAAc,CAAC,CAAC;GAC7DQ,EAAM,GAAG,WAAW,MAAMR,EAAY,QAAQ,oBAAoB,EAAE,GAAG,CAAC;GACxEQ,EAAM,GAAG,WAAW,MAAMR,EAAY,QAAQ,WAAW,CAAC,CAAC;GAC3DQ,EAAM,GAAG,gBAAgB,MAAMR,EAAY,QAAQ,gBAAgB,CAAC,CAAC;GACrEQ,EAAM,GAAG,cAAc,MAAMR,EAAY,QAAQ,cAAc,CAAC,CAAC;GACjEQ,EAAM,GAAG,aAAa,MAAMR,EAAY,QAAQ,mBAAmBW,CAAC,CAAC;EACvE;EACA,aAAa;GAGX,AAFAD,EAAK,SAAS,MAAQE,EAAI,CAAC,GAC3BJ,EAAM,QAAQ,GACd,EAAS,UAAU;EACrB;CACF,GAAG,CAAC,CAAC,GAELF,QAAgB;EACd,AAAID,EAAW,YAAYJ,MAC3B,EAAW,UAAUA,GACrBF,EAAS,SAAS,WAAWE,CAAM;CACrC,GAAG,CAACA,CAAM,CAAC,GAEXY,EACEC,UACO;EACL,MAAM,MAAYf,EAAS,SAAS,IAAIgB,CAAO;EAC/C,YAAY,GAAI,MAAShB,EAAS,SAAS,UAAUiB,GAAIC,CAAI;EAC7D,UAAU,MAASlB,EAAS,SAAS,QAAQmB,CAAI;EACjD,SAAS,MAAQnB,EAAS,SAAS,OAAOoB,CAAG;EAC7C,oBAAoBpB,EAAS,SAAS,aAAa,KAAK,CAAC;EACzD,SAAS,MAAOA,EAAS,SAAS,OAAOiB,CAAE;EAC3C,WAAW,MAAOjB,EAAS,SAAS,SAASiB,CAAE;EAC/C,SAAS,MAAOjB,EAAS,SAAS,OAAOiB,CAAE;EAC3C,oBAAoBjB,EAAS,SAAS,aAAa,KAAK,CAAC;EACzD,gBAAgBA,EAAS,SAAS,SAAS;EAC3C,mBAAmBA,EAAS,SAAS,YAAY,KAAK;EACtD,mBAAmBA,EAAS;CAC9B,IACA,CAAC,CACH,GAGE,kBAAC,OAAD;EACa;EACX,OAAO;GACL,UAAU;GACV,OAAON,EAAQ2B,GAAO,MAAM;GAC5B,QAAQ3B,EAAQ4B,GAAQ,OAAO;GAC/B,GAAGC;EACL;EAEA,UAAA,kBAAC,OAAD;GAAK,KAAKzB;GAAc,OAAO;IAAE,UAAU;IAAY,OAAO;GAAE;EAAI,CAAA;CACjE,CAAA;AAET;AAGA,SAAS0B,EAAW,EAClB,UACA,aAOC;CACD,IAAM,EACJ,UACA,UACA,WACA,WACA,UACA,cACA,aACA,cACA,cACA,cACA,WACA,eACA,eACA,cACA,aACA,cACA,eACA,aACA,WACA,YACA,gBACA,aACA,YACA,cACA,WACA,WACA,YACA,gBACA,sBACA,aACA,kBACA,gBACA,qBACA,cACA,UACA,WACEC,GACEpB,IAA6B;EACjC;EACA;EACA;EACA,GAAGqB;EACH;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CACA,OACE,kBAAC9B,GAAD;EACW;EACD;EACD;EACI;EACJ;EACP,WAAW+B;EACF;EACI;EACM;EACT;EACK;EACF;EACK;CACnB,CAAA;AAEL;AAUA,SAAgBC,EAAW,GAAwB;CACjD,IAAM,EAAE,WAAQ,cAAW,UAAO,aAAU,QAAK,YAASH;CAC1D,OACE,kBAACD,GAAD;EACS;EACP,QAAQ;GACN,QAAQE,KAAU;GAClB;GACA;GACA;GACA;GACA;EACF;CACD,CAAA;AAEL;AAOA,SAAgBG,EAAgB,GAA6B;CAC3D,IAAM,EAAE,cAAW,QAAK,oBAAiBJ;CACzC,OACE,kBAACD,GAAD;EACS;EACP,QAAQ;GACN,QAAQ;GACR,WAAWM,KAAa;GACxB,KAAKC,MAAiB,KAAA,IAAYC,IAAM;IAAE,GAAGA;IAAK;GAAa;EACjE;CACD,CAAA;AAEL;AAMA,SAAgBC,EAAU,GAAuB;CAC/C,IAAM,EAAE,WAAQ,cAAW,YAASR;CACpC,OACE,kBAACD,GAAD;EACS;EACP,QAAQ;GAAE,QAAQE,KAAU;GAAQ;GAAW;EAAK;CACrD,CAAA;AAEL"}

package/dist/charts/react/shapes.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require("../engine/shapes/calendar.cjs"),t=require("../engine/shapes/chart.cjs");let n=require("react"),r=require("react-dom"),i=require("react/jsx-runtime");var a=(e,t)=>e===void 0?t:typeof e==`number`?`${e}px`:e,o=e=>{if(typeof document>`u`||typeof MutationObserver!=`function`)return()=>{};let t=new MutationObserver(e);return t.observe(document.documentElement,{attributes:!0,attributeFilter:[`lang`]}),()=>t.disconnect()},s=()=>typeof document>`u`?``:document.documentElement.lang,c=()=>``,l=({palette:e,legend:t,tooltip:r,format:i,percentFormat:a,locale:l,texts:u,hidden:d,animation:f,padding:p,ariaLabel:m})=>{let h=(0,n.useSyncExternalStore)(o,s,c),g=l??(h||void 0),_=d?d.join(`,`):null,v=(0,n.useMemo)(()=>_===null?void 0:_?_.split(`,`).map(Number):[],[_]);return(0,n.useMemo)(()=>({palette:e,legend:t,tooltip:r,format:i,percentFormat:a,locale:g,texts:u,hidden:v,animation:f,padding:p,ariaLabel:m}),[e,t,r,i,a,g,u,v,f,p,m])};function u({options:e,height:o,width:s,className:c,style:l,handleRef:u,renderTooltip:d,...f}){let p=(0,n.useRef)(null),m=(0,n.useRef)(null),h=(0,n.useRef)(f),g=(0,n.useRef)(d),[_,v]=(0,n.useState)(null),y=(0,n.useMemo)(()=>typeof document>`u`?null:document.createElement(`div`),[]),b=!!d,x=(0,n.useMemo)(()=>{if(!b||!y||e.tooltip===!1)return e;let t=typeof e.tooltip==`object`?e.tooltip:{};return{...e,tooltip:{...t,render:e=>g.current?((0,r.flushSync)(()=>v(e)),y):null}}},[e,b,y]),S=(0,n.useRef)(x);return(0,n.useEffect)(()=>{h.current=f,g.current=d}),(0,n.useEffect)(()=>{let e=p.current;if(!e)return;let n=t.createShapeChart(e,S.current);m.current=n;let r=[n.on(`hover`,e=>h.current.onHover?.(e)),n.on(`click`,e=>h.current.onClick?.(e)),n.on(`toggle`,e=>h.current.onToggle?.(e)),n.on(`drill`,e=>h.current.onDrill?.(e))];return()=>{r.forEach(e=>e()),n.destroy(),m.current=null}},[]),(0,n.useEffect)(()=>{S.current!==x&&(S.current=x,m.current?.setOptions(x))},[x]),(0,n.useImperativeHandle)(u,()=>({getInstance:()=>m.current}),[]),(0,i.jsxs)(`div`,{className:c,style:{position:`relative`,width:a(s,`100%`),height:a(o,`320px`),...l},children:[(0,i.jsx)(`div`,{ref:p,style:{position:`absolute`,inset:0}}),y&&_&&d&&(0,r.createPortal)(d(_),y)]})}function d(e){return(0,i.jsx)(p,{...e,defaultInner:0})}function f(e){return(0,i.jsx)(p,{...e,defaultInner:.62})}function p(e){let{data:t,innerRadius:r,startAngle:a,padAngle:o,cornerRadius:s,rose:c,labels:u,labelContent:d,centerValue:f,centerLabel:p,defaultInner:m}=e,h=l(e),g=(0,n.useMemo)(()=>({...h,type:`pie`,data:t,innerRadius:r??m,startAngle:a,padAngle:o,cornerRadius:s,rose:c,labels:u,labelContent:d,centerValue:f,centerLabel:p}),[h,t,r,m,a,o,s,c,u,d,f,p]);return(0,i.jsx)(C,{props:e,options:g,defaultHeight:320})}function m(e){let{indicators:t,series:r,shape:a,levels:o,dots:s}=e,c=l(e),u=(0,n.useMemo)(()=>({...c,type:`radar`,indicators:t,series:r,shape:a,levels:o,dots:s}),[c,t,r,a,o,s]);return(0,i.jsx)(C,{props:e,options:u,defaultHeight:320})}function h(e){let{value:t,min:r,max:a,label:o,sweep:s,thickness:c,bands:u,color:d,needle:f,ticks:p}=e,m=l(e),h=(0,n.useMemo)(()=>({...m,type:`gauge`,value:t,min:r,max:a,label:o,sweep:s,thickness:c,bands:u,color:d,needle:f,ticks:p}),[m,t,r,a,o,s,c,u,d,f,p]);return(0,i.jsx)(C,{props:e,options:h,defaultHeight:240})}function g(e){let{data:t,sort:r,gap:a,conversion:o,shape:s}=e,c=l(e),u=(0,n.useMemo)(()=>({...c,type:`funnel`,data:t,sort:r,gap:a,conversion:o,shape:s}),[c,t,r,a,o,s]);return(0,i.jsx)(C,{props:e,options:u,defaultHeight:320})}function _(e){let{data:t,gap:r,headers:a}=e,o=l(e),s=(0,n.useMemo)(()=>({...o,type:`treemap`,data:t,gap:r,headers:a}),[o,t,r,a]);return(0,i.jsx)(C,{props:e,options:s,defaultHeight:320})}function v(e){let{nodes:t,links:r,nodeWidth:a,nodePadding:o,align:s,iterations:c,linkColor:u,linkOpacity:d,labels:f,labelValues:p}=e,m=l(e),h=(0,n.useMemo)(()=>({...m,type:`sankey`,nodes:t,links:r,nodeWidth:a,nodePadding:o,align:s,iterations:c,linkColor:u,linkOpacity:d,labels:f,labelValues:p}),[m,t,r,a,o,s,c,u,d,f,p]);return(0,i.jsx)(C,{props:e,options:h,defaultHeight:360})}function y(e){let{data:t,innerRadius:r,levels:a,startAngle:o,padAngle:s,cornerRadius:c,labels:u,drill:d,drillPath:f,onDrill:p}=e,m=l(e),h=f?JSON.stringify(f):null,g=(0,n.useMemo)(()=>h===null?void 0:JSON.parse(h),[h]),_=(0,n.useMemo)(()=>({...m,type:`sunburst`,data:t,innerRadius:r,levels:a,startAngle:o,padAngle:s,cornerRadius:c,labels:u,drill:d,drillPath:g}),[m,t,r,a,o,s,c,u,d,g]);return(0,i.jsx)(C,{props:e,options:_,defaultHeight:360,onDrill:p})}function b(e){let{data:t,max:r,innerRadius:a,startAngle:o,sweep:s,gap:c,track:u,rounded:d,labels:f,labelContent:p,centerValue:m,centerLabel:h}=e,g=l(e),_=(0,n.useMemo)(()=>({...g,type:`radialBar`,data:t,max:r,innerRadius:a,startAngle:o,sweep:s,gap:c,track:u,rounded:d,labels:f,labelContent:p,centerValue:m,centerLabel:h}),[g,t,r,a,o,s,c,u,d,f,p,m,h]);return(0,i.jsx)(C,{props:e,options:_,defaultHeight:300})}function x(t){let{data:r,range:a,layout:o,weekStart:s,color:c,colors:u,levels:d,thresholds:f,gap:p,radius:m,maxCellSize:h,monthLabels:g,weekdayLabels:_}=t,v=l(t),y=(0,n.useMemo)(()=>({...v,type:`calendarHeatmap`,data:r,range:a,layout:o,weekStart:s,color:c,colors:u,levels:d,thresholds:f,gap:p,radius:m,maxCellSize:h,monthLabels:g,weekdayLabels:_}),[v,r,a,o,s,c,u,d,f,p,m,h,g,_]),b=(0,n.useMemo)(()=>{let t=y.legend===!1?0:34;return o===`months`?560:e.calendarStrips(y)*120+t+16},[y,o]);return(0,i.jsx)(C,{props:t,options:y,defaultHeight:b})}function S(e){let{data:t,orientation:r,ranges:a,rangeLabels:o,rangeColors:s,barSize:c,targetColor:u,ticks:d}=e,f=l(e),p=(0,n.useMemo)(()=>({...f,type:`bullet`,data:t,orientation:r,ranges:a,rangeLabels:o,rangeColors:s,barSize:c,targetColor:u,ticks:d}),[f,t,r,a,o,s,c,u,d]),m=p.legend?34:0,h=r===`vertical`?320:Math.max(96,t.length*64+16)+m;return(0,i.jsx)(C,{props:e,options:p,defaultHeight:h})}function C({props:e,options:t,defaultHeight:n,onDrill:r}){return(0,i.jsx)(u,{options:t,height:e.height??n,width:e.width,className:e.className,style:e.style,handleRef:e.ref,onHover:e.onHover,onClick:e.onClick,onToggle:e.onToggle,onDrill:r,renderTooltip:e.renderTooltip})}exports.BulletChart=S,exports.CalendarHeatmap=x,exports.DonutChart=f,exports.FunnelChart=g,exports.GaugeChart=h,exports.PieChart=d,exports.RadarChart=m,exports.RadialBarChart=b,exports.SankeyChart=v,exports.SunburstChart=y,exports.TreemapChart=_;
+"use client";const e=require("../engine/shapes/calendar.cjs"),t=require("../engine/shapes/chart.cjs");let n=require("react"),r=require("react-dom"),i=require("react/jsx-runtime");var a=(e,t)=>e===void 0?t:typeof e==`number`?`${e}px`:e,o=e=>{if(typeof document>`u`||typeof MutationObserver!=`function`)return()=>{};let t=new MutationObserver(e);return t.observe(document.documentElement,{attributes:!0,attributeFilter:[`lang`]}),()=>t.disconnect()},s=()=>typeof document>`u`?``:document.documentElement.lang,c=()=>``,l=({palette:e,legend:t,tooltip:r,format:i,percentFormat:a,locale:l,texts:u,hidden:d,animation:f,padding:p,ariaLabel:m})=>{let h=(0,n.useSyncExternalStore)(o,s,c),g=l??(h||void 0),_=d?d.join(`,`):null,v=(0,n.useMemo)(()=>_===null?void 0:_?_.split(`,`).map(Number):[],[_]);return(0,n.useMemo)(()=>({palette:e,legend:t,tooltip:r,format:i,percentFormat:a,locale:g,texts:u,hidden:v,animation:f,padding:p,ariaLabel:m}),[e,t,r,i,a,g,u,v,f,p,m])};function u({options:e,height:o,width:s,className:c,style:l,handleRef:u,renderTooltip:d,...f}){let p=(0,n.useRef)(null),m=(0,n.useRef)(null),h=(0,n.useRef)(f),g=(0,n.useRef)(d),[_,v]=(0,n.useState)(null),y=(0,n.useMemo)(()=>typeof document>`u`?null:document.createElement(`div`),[]),b=!!d,x=(0,n.useMemo)(()=>{if(!b||!y||e.tooltip===!1)return e;let t=typeof e.tooltip==`object`?e.tooltip:{};return{...e,tooltip:{...t,render:e=>g.current?((0,r.flushSync)(()=>v(e)),y):null}}},[e,b,y]),S=(0,n.useRef)(x);return(0,n.useEffect)(()=>{h.current=f,g.current=d}),(0,n.useEffect)(()=>{let e=p.current;if(!e)return;let n=t.createShapeChart(e,S.current);m.current=n;let r=[n.on(`hover`,e=>h.current.onHover?.(e)),n.on(`click`,e=>h.current.onClick?.(e)),n.on(`toggle`,e=>h.current.onToggle?.(e)),n.on(`drill`,e=>h.current.onDrill?.(e))];return()=>{r.forEach(e=>e()),n.destroy(),m.current=null}},[]),(0,n.useEffect)(()=>{S.current!==x&&(S.current=x,m.current?.setOptions(x))},[x]),(0,n.useImperativeHandle)(u,()=>({getInstance:()=>m.current}),[]),(0,i.jsxs)(`div`,{className:c,style:{position:`relative`,width:a(s,`100%`),height:a(o,`320px`),...l},children:[(0,i.jsx)(`div`,{ref:p,style:{position:`absolute`,inset:0}}),y&&_&&d&&(0,r.createPortal)(d(_),y)]})}function d(e){return(0,i.jsx)(p,{...e,defaultInner:0})}function f(e){return(0,i.jsx)(p,{...e,defaultInner:.62})}function p(e){let{data:t,innerRadius:r,startAngle:a,padAngle:o,cornerRadius:s,rose:c,labels:u,labelContent:d,centerValue:f,centerLabel:p,defaultInner:m}=e,h=l(e),g=(0,n.useMemo)(()=>({...h,type:`pie`,data:t,innerRadius:r??m,startAngle:a,padAngle:o,cornerRadius:s,rose:c,labels:u,labelContent:d,centerValue:f,centerLabel:p}),[h,t,r,m,a,o,s,c,u,d,f,p]);return(0,i.jsx)(w,{props:e,options:g,defaultHeight:320})}function m(e){let{indicators:t,series:r,shape:a,levels:o,dots:s}=e,c=l(e),u=(0,n.useMemo)(()=>({...c,type:`radar`,indicators:t,series:r,shape:a,levels:o,dots:s}),[c,t,r,a,o,s]);return(0,i.jsx)(w,{props:e,options:u,defaultHeight:320})}function h(e){let{value:t,min:r,max:a,label:o,sweep:s,thickness:c,bands:u,color:d,needle:f,ticks:p}=e,m=l(e),h=(0,n.useMemo)(()=>({...m,type:`gauge`,value:t,min:r,max:a,label:o,sweep:s,thickness:c,bands:u,color:d,needle:f,ticks:p}),[m,t,r,a,o,s,c,u,d,f,p]);return(0,i.jsx)(w,{props:e,options:h,defaultHeight:240})}function g(e){let{data:t,sort:r,gap:a,conversion:o,shape:s}=e,c=l(e),u=(0,n.useMemo)(()=>({...c,type:`funnel`,data:t,sort:r,gap:a,conversion:o,shape:s}),[c,t,r,a,o,s]);return(0,i.jsx)(w,{props:e,options:u,defaultHeight:320})}function _(e){let{data:t,gap:r,headers:a}=e,o=l(e),s=(0,n.useMemo)(()=>({...o,type:`treemap`,data:t,gap:r,headers:a}),[o,t,r,a]);return(0,i.jsx)(w,{props:e,options:s,defaultHeight:320})}function v(e){let{nodes:t,links:r,nodeWidth:a,nodePadding:o,align:s,iterations:c,linkColor:u,linkOpacity:d,labels:f,labelValues:p}=e,m=l(e),h=(0,n.useMemo)(()=>({...m,type:`sankey`,nodes:t,links:r,nodeWidth:a,nodePadding:o,align:s,iterations:c,linkColor:u,linkOpacity:d,labels:f,labelValues:p}),[m,t,r,a,o,s,c,u,d,f,p]);return(0,i.jsx)(w,{props:e,options:h,defaultHeight:360})}function y(e){let{data:t,innerRadius:r,levels:a,startAngle:o,padAngle:s,cornerRadius:c,labels:u,drill:d,drillPath:f,onDrill:p}=e,m=l(e),h=f?JSON.stringify(f):null,g=(0,n.useMemo)(()=>h===null?void 0:JSON.parse(h),[h]),_=(0,n.useMemo)(()=>({...m,type:`sunburst`,data:t,innerRadius:r,levels:a,startAngle:o,padAngle:s,cornerRadius:c,labels:u,drill:d,drillPath:g}),[m,t,r,a,o,s,c,u,d,g]);return(0,i.jsx)(w,{props:e,options:_,defaultHeight:360,onDrill:p})}function b(e){let{data:t,max:r,innerRadius:a,startAngle:o,sweep:s,gap:c,track:u,rounded:d,labels:f,labelContent:p,centerValue:m,centerLabel:h}=e,g=l(e),_=(0,n.useMemo)(()=>({...g,type:`radialBar`,data:t,max:r,innerRadius:a,startAngle:o,sweep:s,gap:c,track:u,rounded:d,labels:f,labelContent:p,centerValue:m,centerLabel:h}),[g,t,r,a,o,s,c,u,d,f,p,m,h]);return(0,i.jsx)(w,{props:e,options:_,defaultHeight:300})}function x(t){let{data:r,range:a,layout:o,weekStart:s,color:c,colors:u,levels:d,thresholds:f,gap:p,radius:m,maxCellSize:h,monthLabels:g,weekdayLabels:_}=t,v=l(t),y=(0,n.useMemo)(()=>({...v,type:`calendarHeatmap`,data:r,range:a,layout:o,weekStart:s,color:c,colors:u,levels:d,thresholds:f,gap:p,radius:m,maxCellSize:h,monthLabels:g,weekdayLabels:_}),[v,r,a,o,s,c,u,d,f,p,m,h,g,_]),b=(0,n.useMemo)(()=>{let t=y.legend===!1?0:34;return o===`months`?560:e.calendarStrips(y)*120+t+16},[y,o]);return(0,i.jsx)(w,{props:t,options:y,defaultHeight:b})}function S(e){let{data:t,orientation:r,ranges:a,rangeLabels:o,rangeColors:s,barSize:c,targetColor:u,ticks:d}=e,f=l(e),p=(0,n.useMemo)(()=>({...f,type:`bullet`,data:t,orientation:r,ranges:a,rangeLabels:o,rangeColors:s,barSize:c,targetColor:u,ticks:d}),[f,t,r,a,o,s,c,u,d]),m=p.legend?34:0,h=r===`vertical`?320:Math.max(96,t.length*64+16)+m;return(0,i.jsx)(w,{props:e,options:p,defaultHeight:h})}function C(e){let{groups:t,matrix:r,links:a,directed:o,arrows:s,padAngle:c,startAngle:u,sortGroups:d,sortSubgroups:f,ribbonColor:p,ribbonOpacity:m,arcWidth:h,ticks:g,tickFormat:_,labels:v}=e,y=l(e),b=(0,n.useMemo)(()=>({...y,type:`chord`,groups:t,matrix:r,links:a,directed:o,arrows:s,padAngle:c,startAngle:u,sortGroups:d,sortSubgroups:f,ribbonColor:p,ribbonOpacity:m,arcWidth:h,ticks:g,tickFormat:_,labels:v}),[y,t,r,a,o,s,c,u,d,f,p,m,h,g,_,v]);return(0,i.jsx)(w,{props:e,options:b,defaultHeight:420})}function w({props:e,options:t,defaultHeight:n,onDrill:r}){return(0,i.jsx)(u,{options:t,height:e.height??n,width:e.width,className:e.className,style:e.style,handleRef:e.ref,onHover:e.onHover,onClick:e.onClick,onToggle:e.onToggle,onDrill:r,renderTooltip:e.renderTooltip})}exports.BulletChart=S,exports.CalendarHeatmap=x,exports.ChordChart=C,exports.DonutChart=f,exports.FunnelChart=g,exports.GaugeChart=h,exports.PieChart=d,exports.RadarChart=m,exports.RadialBarChart=b,exports.SankeyChart=v,exports.SunburstChart=y,exports.TreemapChart=_;
 //# sourceMappingURL=shapes.cjs.map