@epilot/spark-ui 0.19.0 → 0.20.0

package/dist/components/onboarding-layout.d.ts

@@ -1,44 +0,0 @@
-"use client";
-
-//#region src/components/onboarding-layout.d.ts
-declare const OnboardingLayout: ({
-  className,
-  ...rest
-}: React.ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
-/**
- * Top section: typically wraps the title row, optional description, and a
- * progress bar.
- */
-declare const OnboardingLayoutHeader: ({
-  className,
-  ...rest
-}: React.ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
-/** Text-only group inside the header (title row + description). */
-declare const OnboardingLayoutHeading: ({
-  className,
-  ...rest
-}: React.ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
-/** Row that holds the title on the left and (optionally) a step badge on the right. */
-declare const OnboardingLayoutTitleRow: ({
-  className,
-  ...rest
-}: React.ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
-declare const OnboardingLayoutTitle: ({
-  className,
-  ...rest
-}: React.ComponentProps<"h2">) => import("react/jsx-runtime").JSX.Element;
-declare const OnboardingLayoutDescription: ({
-  className,
-  ...rest
-}: React.ComponentProps<"p">) => import("react/jsx-runtime").JSX.Element;
-/**
- * Bottom action row. Use with `justify-between`-aware children — typically a
- * back action on the left and a cancel/primary action on the right.
- */
-declare const OnboardingLayoutFooter: ({
-  className,
-  ...rest
-}: React.ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
-//#endregion
-export { OnboardingLayout, OnboardingLayoutDescription, OnboardingLayoutFooter, OnboardingLayoutHeader, OnboardingLayoutHeading, OnboardingLayoutTitle, OnboardingLayoutTitleRow };
-//# sourceMappingURL=onboarding-layout.d.ts.map

package/dist/components/onboarding-layout.js

@@ -1,60 +0,0 @@
-"use client";
-import { cn } from "../utils/cn.js";
-import { jsx } from "react/jsx-runtime";
-//#region src/components/onboarding-layout.tsx
-const OnboardingLayout = ({ className, ...rest }) => {
-	return /* @__PURE__ */ jsx("div", {
-		className: cn("flex flex-col gap-[calc(var(--spark-layout-gap)*6)]", className),
-		...rest
-	});
-};
-/**
-* Top section: typically wraps the title row, optional description, and a
-* progress bar.
-*/
-const OnboardingLayoutHeader = ({ className, ...rest }) => {
-	return /* @__PURE__ */ jsx("div", {
-		className: cn("flex flex-col gap-[calc(var(--spark-layout-gap)*3)] pt-4", className),
-		...rest
-	});
-};
-/** Text-only group inside the header (title row + description). */
-const OnboardingLayoutHeading = ({ className, ...rest }) => {
-	return /* @__PURE__ */ jsx("div", {
-		className: cn("flex flex-col gap-[calc(var(--spark-layout-gap)*1)]", className),
-		...rest
-	});
-};
-/** Row that holds the title on the left and (optionally) a step badge on the right. */
-const OnboardingLayoutTitleRow = ({ className, ...rest }) => {
-	return /* @__PURE__ */ jsx("div", {
-		className: cn("flex items-center justify-between", className),
-		...rest
-	});
-};
-const OnboardingLayoutTitle = ({ className, ...rest }) => {
-	return /* @__PURE__ */ jsx("h2", {
-		className: cn("text-lg font-bold text-gray", className),
-		...rest
-	});
-};
-const OnboardingLayoutDescription = ({ className, ...rest }) => {
-	return /* @__PURE__ */ jsx("p", {
-		className: cn("text-sm text-gray-light", className),
-		...rest
-	});
-};
-/**
-* Bottom action row. Use with `justify-between`-aware children — typically a
-* back action on the left and a cancel/primary action on the right.
-*/
-const OnboardingLayoutFooter = ({ className, ...rest }) => {
-	return /* @__PURE__ */ jsx("div", {
-		className: cn("flex items-center justify-between", className),
-		...rest
-	});
-};
-//#endregion
-export { OnboardingLayout, OnboardingLayoutDescription, OnboardingLayoutFooter, OnboardingLayoutHeader, OnboardingLayoutHeading, OnboardingLayoutTitle, OnboardingLayoutTitleRow };
-
-//# sourceMappingURL=onboarding-layout.js.map

package/dist/components/onboarding-layout.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"onboarding-layout.js","names":[],"sources":["../../src/components/onboarding-layout.tsx"],"sourcesContent":["import { cn } from '../utils/cn'\n\nconst OnboardingLayout = ({\n  className,\n  ...rest\n}: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      className={cn(\n        'flex flex-col gap-[calc(var(--spark-layout-gap)*6)]',\n        className,\n      )}\n      {...rest}\n    />\n  )\n}\n\n/**\n * Top section: typically wraps the title row, optional description, and a\n * progress bar.\n */\nconst OnboardingLayoutHeader = ({\n  className,\n  ...rest\n}: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      className={cn(\n        'flex flex-col gap-[calc(var(--spark-layout-gap)*3)] pt-4',\n        className,\n      )}\n      {...rest}\n    />\n  )\n}\n\n/** Text-only group inside the header (title row + description). */\nconst OnboardingLayoutHeading = ({\n  className,\n  ...rest\n}: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      className={cn(\n        'flex flex-col gap-[calc(var(--spark-layout-gap)*1)]',\n        className,\n      )}\n      {...rest}\n    />\n  )\n}\n\n/** Row that holds the title on the left and (optionally) a step badge on the right. */\nconst OnboardingLayoutTitleRow = ({\n  className,\n  ...rest\n}: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      className={cn('flex items-center justify-between', className)}\n      {...rest}\n    />\n  )\n}\n\nconst OnboardingLayoutTitle = ({\n  className,\n  ...rest\n}: React.ComponentProps<'h2'>) => {\n  return (\n    <h2 className={cn('text-lg font-bold text-gray', className)} {...rest} />\n  )\n}\n\nconst OnboardingLayoutDescription = ({\n  className,\n  ...rest\n}: React.ComponentProps<'p'>) => {\n  return <p className={cn('text-sm text-gray-light', className)} {...rest} />\n}\n\n/**\n * Bottom action row. Use with `justify-between`-aware children — typically a\n * back action on the left and a cancel/primary action on the right.\n */\nconst OnboardingLayoutFooter = ({\n  className,\n  ...rest\n}: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      className={cn('flex items-center justify-between', className)}\n      {...rest}\n    />\n  )\n}\n\nexport {\n  OnboardingLayout,\n  OnboardingLayoutHeader,\n  OnboardingLayoutHeading,\n  OnboardingLayoutTitleRow,\n  OnboardingLayoutTitle,\n  OnboardingLayoutDescription,\n  OnboardingLayoutFooter,\n}\n"],"mappings":";;;;AAEA,MAAM,oBAAoB,EACxB,WACA,GAAG,WAC8B;CACjC,OACE,oBAAC,OAAD;EACE,WAAW,GACT,uDACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;;;;AAMA,MAAM,0BAA0B,EAC9B,WACA,GAAG,WAC8B;CACjC,OACE,oBAAC,OAAD;EACE,WAAW,GACT,4DACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,MAAM,2BAA2B,EAC/B,WACA,GAAG,WAC8B;CACjC,OACE,oBAAC,OAAD;EACE,WAAW,GACT,uDACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,MAAM,4BAA4B,EAChC,WACA,GAAG,WAC8B;CACjC,OACE,oBAAC,OAAD;EACE,WAAW,GAAG,qCAAqC,SAAS;EAC5D,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,yBAAyB,EAC7B,WACA,GAAG,WAC6B;CAChC,OACE,oBAAC,MAAD;EAAI,WAAW,GAAG,+BAA+B,SAAS;EAAG,GAAI;CAAO,CAAA;AAE5E;AAEA,MAAM,+BAA+B,EACnC,WACA,GAAG,WAC4B;CAC/B,OAAO,oBAAC,KAAD;EAAG,WAAW,GAAG,2BAA2B,SAAS;EAAG,GAAI;CAAO,CAAA;AAC5E;;;;;AAMA,MAAM,0BAA0B,EAC9B,WACA,GAAG,WAC8B;CACjC,OACE,oBAAC,OAAD;EACE,WAAW,GAAG,qCAAqC,SAAS;EAC5D,GAAI;CACL,CAAA;AAEL"}

package/dist/components/power-history-chart.cjs

@@ -1,498 +0,0 @@
-"use client";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_chunk = require("../chunk-DY84GLCh.cjs");
-require("../utils/chars.cjs");
-const require_utils_format = require("../utils/format.cjs");
-const require_utils_chart_scale = require("../utils/chart-scale.cjs");
-const require_utils_chart_time_ticks = require("../utils/chart-time-ticks.cjs");
-const require_hooks_use_chart_zoom = require("../hooks/use-chart-zoom.cjs");
-const require_hooks_use_reduced_motion = require("../hooks/use-reduced-motion.cjs");
-const require_components_chart = require("./chart.cjs");
-const require_components_series_legend = require("./series-legend.cjs");
-const require_components_typography = require("./typography.cjs");
-let react = require("react");
-react = require_chunk.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-let _visx_event = require("@visx/event");
-let _visx_scale = require("@visx/scale");
-let _visx_shape = require("@visx/shape");
-let _visx_curve = require("@visx/curve");
-let _visx_tooltip = require("@visx/tooltip");
-let _visx_vendor_d3_array = require("@visx/vendor/d3-array");
-let cnfast = require("cnfast");
-//#region src/components/power-history-chart.tsx
-const AREA_KEYS = [
-	"solar",
-	"grid",
-	"battery"
-];
-const SERIES_KEYS = [
-	"solar",
-	"grid",
-	"battery",
-	"consumption"
-];
-const SERIES_COLORS = {
-	solar: "var(--orange-a9)",
-	grid: "var(--blue-9)",
-	battery: "var(--green-a9)",
-	consumption: "var(--neutral-12)"
-};
-const PADDING_TOP = 20;
-const PADDING_BOTTOM = 28;
-const PADDING_RIGHT = 8;
-const X_TICK_COUNT = 6;
-const DEFAULT_HEIGHT = 260;
-const DETAILED_X_AXIS_THRESHOLD = 360 * 60 * 1e3;
-const tBisector = (0, _visx_vendor_d3_array.bisector)((d) => d.t);
-function touchDistance(a, b) {
-	return Math.hypot(a.clientX - b.clientX, a.clientY - b.clientY);
-}
-function touchMidpoint(a, b) {
-	return {
-		clientX: (a.clientX + b.clientX) / 2,
-		clientY: (a.clientY + b.clientY) / 2
-	};
-}
-/**
-* Diverging "power sources" area chart over a continuous time axis: solar
-* (orange), grid (blue) and battery (green) areas around a zero baseline, with
-* consumption overlaid as a line. Negative values (grid feed-in, battery
-* charging) dip below zero. For instantaneous power (day view). A legend at the
-* top toggles each series on/off; the y-axis rescales to the visible ones. visx.
-*/
-function PowerHistoryChart({ data, unit, formatX, formatTooltipX, formatValue, labels, omitSeries, highlightAt, title, className, height = DEFAULT_HEIGHT, zoomable = false, zoomResetLabel, zoomDomain, onZoomDomainChange }) {
-	const plotClipId = react.useId();
-	const fmtTooltipX = formatTooltipX ?? formatX;
-	const containerRef = (0, react.useRef)(null);
-	const reducedMotion = require_hooks_use_reduced_motion.useReducedMotion();
-	const [width, setWidth] = (0, react.useState)(0);
-	const [hiddenSeries, setHiddenSeries] = (0, react.useState)(() => /* @__PURE__ */ new Set());
-	const omitted = (0, react.useMemo)(() => new Set(omitSeries), [omitSeries]);
-	const toggleSeries = (0, react.useCallback)((id) => {
-		setHiddenSeries((prev) => {
-			const next = new Set(prev);
-			if (next.has(id)) next.delete(id);
-			else next.add(id);
-			return next;
-		});
-	}, []);
-	const isHidden = (0, react.useCallback)((key) => omitted.has(key) || hiddenSeries.has(key), [hiddenSeries, omitted]);
-	const { showTooltip, hideTooltip, tooltipData, tooltipLeft, tooltipTop, tooltipOpen } = (0, _visx_tooltip.useTooltip)();
-	(0, react.useEffect)(() => {
-		const element = containerRef.current;
-		if (!element) return;
-		const resizeObserver = new ResizeObserver((entries) => {
-			const entry = entries[0];
-			if (!entry) return;
-			setWidth(entry.contentRect.width);
-		});
-		resizeObserver.observe(element);
-		return () => resizeObserver.disconnect();
-	}, []);
-	const fmtValue = (value) => formatValue ? formatValue(value) : `${require_utils_format.twoDecimalFormat.format(value)} ${unit}`;
-	const tMin = data.length ? data[0]?.t ?? 0 : 0;
-	const tMax = data.length ? data[data.length - 1]?.t ?? 0 : 0;
-	const zoom = require_hooks_use_chart_zoom.useChartZoom({
-		enabled: zoomable,
-		fullDomain: (0, react.useMemo)(() => {
-			if (data.length === 0) return null;
-			return [tMin, tMax];
-		}, [
-			data.length,
-			tMin,
-			tMax
-		]),
-		zoomDomain,
-		onZoomDomainChange
-	});
-	const viewMin = zoom.zoomWindow?.[0] ?? tMin;
-	const viewMax = zoom.zoomWindow?.[1] ?? tMax;
-	const visibleData = (0, react.useMemo)(() => data.filter((d) => d.t >= viewMin && d.t <= viewMax), [
-		data,
-		viewMin,
-		viewMax
-	]);
-	const { yMin, yMax } = (0, react.useMemo)(() => {
-		let min = 0;
-		let max = 0;
-		for (const d of visibleData) {
-			if (!isHidden("solar")) max = Math.max(max, d.solar);
-			if (!isHidden("consumption")) max = Math.max(max, d.consumption);
-			if (!isHidden("grid")) {
-				max = Math.max(max, d.grid);
-				min = Math.min(min, d.grid);
-			}
-			if (!isHidden("battery")) {
-				max = Math.max(max, d.battery);
-				min = Math.min(min, d.battery);
-			}
-		}
-		return {
-			yMin: min,
-			yMax: max
-		};
-	}, [visibleData, isHidden]);
-	const { ticks: yTicks, min: lo, max: hi } = (0, react.useMemo)(() => require_utils_chart_scale.buildYAxisScale(yMin, yMax), [yMin, yMax]);
-	const displayedYDomain = require_hooks_use_chart_zoom.useAnimatedChartDomain([lo, hi], {
-		animateChanges: zoom.isPinching,
-		reducedMotion
-	});
-	const gutter = (0, react.useMemo)(() => require_utils_chart_scale.measureYAxisGutter(yTicks, require_utils_chart_scale.formatYAxisTick), [yTicks]);
-	const plotRight = Math.max(gutter, width - PADDING_RIGHT);
-	const xScale = (0, react.useMemo)(() => (0, _visx_scale.scaleLinear)({
-		domain: [viewMin, viewMax === viewMin ? viewMin + 1 : viewMax],
-		range: [gutter, plotRight]
-	}), [
-		viewMin,
-		viewMax,
-		plotRight,
-		gutter
-	]);
-	const plotHeight = Math.max(0, height - PADDING_BOTTOM - PADDING_TOP);
-	const plotWidth = Math.max(0, plotRight - gutter);
-	const yScale = (0, react.useMemo)(() => (0, _visx_scale.scaleLinear)({
-		domain: [displayedYDomain[0], displayedYDomain[1] === displayedYDomain[0] ? displayedYDomain[0] + 1 : displayedYDomain[1]],
-		range: [height - PADDING_BOTTOM, PADDING_TOP]
-	}), [displayedYDomain, height]);
-	const xTicks = (0, react.useMemo)(() => require_utils_chart_time_ticks.buildTimeTicks(viewMin, viewMax, X_TICK_COUNT), [viewMin, viewMax]);
-	const formatAxisX = zoom.isZoomed && viewMax - viewMin <= DETAILED_X_AXIS_THRESHOLD ? fmtTooltipX : formatX;
-	const domainXFromEvent = (0, react.useCallback)((event) => {
-		const point = (0, _visx_event.localPoint)(event);
-		if (!point) return null;
-		return xScale.invert(point.x);
-	}, [xScale]);
-	const handleTooltip = (0, react.useCallback)((event) => {
-		if (zoom.isBrushing || zoom.isPanning) return;
-		const point = (0, _visx_event.localPoint)(event);
-		if (!point || data.length === 0) return;
-		const xMs = xScale.invert(point.x);
-		const index = tBisector.left(data, xMs, 1);
-		const d0 = data[index - 1];
-		const d1 = data[index];
-		if (!d0) return;
-		const d = d1 && xMs - d0.t > d1.t - xMs ? d1 : d0;
-		showTooltip({
-			tooltipData: d,
-			tooltipLeft: xScale(d.t),
-			tooltipTop: PADDING_TOP
-		});
-	}, [
-		data,
-		showTooltip,
-		xScale,
-		zoom.isBrushing,
-		zoom.isPanning
-	]);
-	const legendItems = SERIES_KEYS.filter((key) => !omitted.has(key)).map((key) => ({
-		id: key,
-		label: labels[key],
-		color: SERIES_COLORS[key]
-	}));
-	const tooltipRows = tooltipData ? SERIES_KEYS.filter((key) => !isHidden(key)).map((key) => ({
-		key,
-		label: labels[key],
-		color: SERIES_COLORS[key],
-		value: fmtValue(tooltipData[key])
-	})) : [];
-	const showHighlight = highlightAt !== void 0 && highlightAt >= viewMin && highlightAt <= viewMax;
-	const [tooltipRef, tooltipSize] = require_components_chart.useMeasuredSize();
-	const tooltipPos = require_components_chart.clampTooltipPosition({
-		anchorX: tooltipLeft ?? 0,
-		anchorY: tooltipTop ?? PADDING_TOP,
-		width,
-		height,
-		tipWidth: tooltipSize.width,
-		tipHeight: tooltipSize.height,
-		placement: "beside"
-	});
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: (0, cnfast.cn)("flex w-full flex-col gap-2", className),
-		children: [
-			title && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_typography.SectionTitle, { children: title }),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_series_legend.SeriesLegend, {
-				items: legendItems,
-				hiddenIds: hiddenSeries,
-				onToggle: toggleSeries
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: "px-1 text-xs text-gray-light",
-				children: unit
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				ref: containerRef,
-				className: "relative w-full",
-				style: { height },
-				children: [
-					width > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
-						width,
-						height,
-						children: [
-							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("defs", { children: [AREA_KEYS.map((key) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("linearGradient", {
-								id: `power-history-fill-${key}`,
-								x1: "0",
-								y1: "0",
-								x2: "0",
-								y2: "1",
-								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("stop", {
-									offset: "0%",
-									stopColor: SERIES_COLORS[key],
-									stopOpacity: .35
-								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("stop", {
-									offset: "100%",
-									stopColor: SERIES_COLORS[key],
-									stopOpacity: .04
-								})]
-							}, key)), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("clipPath", {
-								id: plotClipId,
-								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
-									height: plotHeight,
-									width: plotWidth,
-									x: gutter,
-									y: PADDING_TOP
-								})
-							})] }),
-							yTicks.map((tick) => {
-								const y = yScale(tick);
-								return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
-									x1: gutter,
-									x2: plotRight,
-									y1: y,
-									y2: y,
-									stroke: "var(--neutral-a4)",
-									strokeWidth: 1
-								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
-									x: gutter - 7,
-									y: y + 3,
-									textAnchor: "end",
-									fill: "var(--neutral-a11)",
-									fontSize: 10,
-									children: require_utils_chart_scale.formatYAxisTick(tick)
-								})] }, `y-tick-${tick}`);
-							}),
-							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
-								clipPath: `url(#${plotClipId})`,
-								"data-testid": "chart-plot-clip",
-								children: [
-									AREA_KEYS.filter((key) => !isHidden(key)).map((key) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_visx_shape.Area, {
-										data,
-										x: (d) => xScale(d.t),
-										y0: yScale(0),
-										y1: (d) => yScale(d[key]),
-										curve: _visx_curve.curveMonotoneX,
-										fill: `url(#power-history-fill-${key})`,
-										stroke: "transparent"
-									}, `area-${key}`)),
-									AREA_KEYS.filter((key) => !isHidden(key)).map((key) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_visx_shape.LinePath, {
-										data,
-										x: (d) => xScale(d.t),
-										y: (d) => yScale(d[key]),
-										curve: _visx_curve.curveMonotoneX,
-										stroke: SERIES_COLORS[key],
-										strokeWidth: 1.5,
-										fill: "none"
-									}, `line-${key}`)),
-									!isHidden("consumption") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_visx_shape.LinePath, {
-										data,
-										x: (d) => xScale(d.t),
-										y: (d) => yScale(d.consumption),
-										curve: _visx_curve.curveMonotoneX,
-										stroke: SERIES_COLORS.consumption,
-										strokeWidth: 1.5,
-										fill: "none"
-									})
-								]
-							}),
-							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
-								x1: gutter,
-								x2: plotRight,
-								y1: yScale(0),
-								y2: yScale(0),
-								stroke: "var(--neutral-a6)",
-								strokeWidth: 1
-							}),
-							showHighlight && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
-								x1: xScale(highlightAt),
-								x2: xScale(highlightAt),
-								y1: PADDING_TOP,
-								y2: height - PADDING_BOTTOM,
-								stroke: "var(--spark-a9)",
-								strokeWidth: 1.5,
-								strokeDasharray: "5 4",
-								pointerEvents: "none"
-							}),
-							xTicks.map((tick, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
-								x: xScale(tick),
-								y: height - PADDING_BOTTOM + 16,
-								textAnchor: index === 0 ? "start" : index === xTicks.length - 1 ? "end" : "middle",
-								fill: "var(--neutral-a11)",
-								fontSize: 10,
-								children: formatAxisX(tick)
-							}, `x-tick-${tick}`)),
-							tooltipOpen && tooltipData && !zoom.isBrushing && !zoom.isPanning && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
-									x1: xScale(tooltipData.t),
-									x2: xScale(tooltipData.t),
-									y1: PADDING_TOP,
-									y2: height - PADDING_BOTTOM,
-									stroke: "var(--neutral-a6)",
-									strokeDasharray: "4 4",
-									pointerEvents: "none"
-								}),
-								AREA_KEYS.filter((key) => !isHidden(key)).map((key) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
-									cx: xScale(tooltipData.t),
-									cy: yScale(tooltipData[key]),
-									r: 3.5,
-									fill: SERIES_COLORS[key],
-									stroke: "white",
-									strokeWidth: 1.5,
-									pointerEvents: "none"
-								}, `dot-${key}`)),
-								!isHidden("consumption") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
-									cx: xScale(tooltipData.t),
-									cy: yScale(tooltipData.consumption),
-									r: 3.5,
-									fill: SERIES_COLORS.consumption,
-									stroke: "white",
-									strokeWidth: 1.5,
-									pointerEvents: "none"
-								})
-							] }),
-							zoom.brushBand && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
-								"data-testid": "chart-brush-band",
-								x: Math.min(xScale(zoom.brushBand[0]), xScale(zoom.brushBand[1])),
-								y: PADDING_TOP,
-								width: Math.abs(xScale(zoom.brushBand[1]) - xScale(zoom.brushBand[0])),
-								height: plotHeight,
-								fill: "var(--spark-a4)",
-								pointerEvents: "none"
-							}),
-							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
-								x: gutter,
-								y: PADDING_TOP,
-								width: plotWidth,
-								height: plotHeight,
-								fill: "transparent",
-								style: zoomable ? { touchAction: "pan-y" } : void 0,
-								onMouseLeave: () => {
-									if (!zoom.isBrushing) hideTooltip();
-								},
-								onMouseMove: (event) => {
-									if (zoom.isBrushing) {
-										const domainX = domainXFromEvent(event);
-										if (domainX != null) zoom.onPointerMove(domainX);
-										return;
-									}
-									handleTooltip(event);
-								},
-								onPointerDown: (event) => {
-									if (!zoomable || event.pointerType === "touch") return;
-									if (event.button !== 0) return;
-									const domainX = domainXFromEvent(event);
-									if (domainX == null) return;
-									event.currentTarget.setPointerCapture?.(event.pointerId);
-									hideTooltip();
-									zoom.onPointerDown(domainX);
-								},
-								onPointerMove: (event) => {
-									if (!zoomable) return;
-									const domainX = domainXFromEvent(event);
-									if (domainX != null) zoom.onPointerMove(domainX);
-								},
-								onPointerUp: (event) => {
-									if (!zoomable) return;
-									const domainX = domainXFromEvent(event);
-									if (domainX != null) zoom.onPointerUp(domainX);
-									else zoom.onPointerCancel();
-								},
-								onPointerCancel: () => {
-									zoom.onPointerCancel();
-								},
-								onDoubleClick: () => {
-									if (zoomable) zoom.onDoubleClick();
-								},
-								onTouchStart: (event) => {
-									if (!zoomable) return;
-									if (event.touches.length === 2) {
-										const [a, b] = [event.touches[0], event.touches[1]];
-										if (!a || !b) return;
-										const point = (0, _visx_event.localPoint)(event.currentTarget, touchMidpoint(a, b));
-										if (!point) return;
-										const midpoint = Math.min(1, Math.max(0, (point.x - gutter) / plotWidth));
-										zoom.onPinchStart(touchDistance(a, b), midpoint);
-										hideTooltip();
-										return;
-									}
-									if (event.touches.length === 1 && zoom.isZoomed) {
-										const point = (0, _visx_event.localPoint)(event);
-										if (!point) return;
-										zoom.onPanStart({
-											x: (point.x - gutter) / plotWidth,
-											y: (point.y - PADDING_TOP) / plotHeight
-										});
-										hideTooltip();
-									}
-								},
-								onTouchMove: (event) => {
-									if (zoomable && event.touches.length === 2) {
-										const [a, b] = [event.touches[0], event.touches[1]];
-										if (!a || !b) return;
-										const point = (0, _visx_event.localPoint)(event.currentTarget, touchMidpoint(a, b));
-										if (!point) return;
-										const midpoint = Math.min(1, Math.max(0, (point.x - gutter) / plotWidth));
-										zoom.onPinchMove(touchDistance(a, b), midpoint);
-										return;
-									}
-									if (event.touches.length === 1 && zoom.isZoomed) {
-										const point = (0, _visx_event.localPoint)(event);
-										if (!point) return;
-										zoom.onPanMove({
-											x: (point.x - gutter) / plotWidth,
-											y: (point.y - PADDING_TOP) / plotHeight
-										});
-										return;
-									}
-									if (event.touches.length === 1) handleTooltip(event);
-								},
-								onTouchEnd: (event) => {
-									if (zoomable && event.touches.length < 2) zoom.onPinchEnd();
-									if (event.touches.length === 0) {
-										if (zoomable) zoom.onPanEnd();
-										if (zoomable) zoom.onTap();
-										hideTooltip();
-									}
-								},
-								onTouchCancel: () => {
-									zoom.onPinchEnd();
-									zoom.onPanEnd();
-								}
-							})
-						]
-					}),
-					zoom.isZoomed && zoomResetLabel && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_chart.ChartZoomResetButton, {
-						label: zoomResetLabel,
-						onReset: zoom.resetZoom
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-						ref: tooltipRef,
-						className: "pointer-events-none absolute z-10",
-						style: {
-							left: tooltipPos.left,
-							top: tooltipPos.top,
-							opacity: tooltipOpen && tooltipData && !zoom.isPanning && !zoom.isBrushing ? 1 : 0,
-							transition: reducedMotion ? "opacity 140ms ease-out" : "left 140ms ease-out, top 140ms ease-out, opacity 140ms ease-out"
-						},
-						children: tooltipData && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_chart.ChartTooltipCard, {
-							label: fmtTooltipX(tooltipData.t),
-							rows: tooltipRows
-						})
-					})
-				]
-			})
-		]
-	});
-}
-//#endregion
-exports.PowerHistoryChart = PowerHistoryChart;
-
-//# sourceMappingURL=power-history-chart.cjs.map