@epilot/spark-ui 0.10.0

package/dist/hooks/use-chart-zoom.cjs

@@ -0,0 +1,236 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_utils_chart_zoom = require("../utils/chart-zoom.cjs");
+let react = require("react");
+//#region src/hooks/use-chart-zoom.ts
+const PAN_ACTIVATION_THRESHOLD = .02;
+const DOMAIN_SPRING_STIFFNESS = 420;
+const DOMAIN_SPRING_DAMPING = 40;
+function toBand(a, b) {
+	return a <= b ? [a, b] : [b, a];
+}
+function useAnimatedChartDomain(domain, { animateChanges, reducedMotion }) {
+	const stateRef = (0, react.useRef)(null);
+	if (!stateRef.current) stateRef.current = {
+		frame: null,
+		lastTime: null,
+		target: [domain[0], domain[1]],
+		value: [domain[0], domain[1]],
+		velocity: [0, 0]
+	};
+	const domainStart = domain[0];
+	const domainEnd = domain[1];
+	const [displayed, setDisplayed] = (0, react.useState)(() => [domainStart, domainEnd]);
+	(0, react.useEffect)(() => {
+		const state = stateRef.current;
+		if (!state) return;
+		const targetChanged = state.target[0] !== domainStart || state.target[1] !== domainEnd;
+		state.target = [domainStart, domainEnd];
+		const snap = () => {
+			if (state.frame != null) cancelAnimationFrame(state.frame);
+			state.frame = null;
+			state.lastTime = null;
+			state.value = [domainStart, domainEnd];
+			state.velocity = [0, 0];
+			setDisplayed([domainStart, domainEnd]);
+		};
+		if (reducedMotion || targetChanged && !animateChanges) {
+			snap();
+			return;
+		}
+		if (!targetChanged || state.frame != null) return;
+		const step = (time) => {
+			const current = stateRef.current;
+			if (!current) return;
+			const elapsed = current.lastTime == null ? 1 / 60 : Math.min(1 / 30, (time - current.lastTime) / 1e3);
+			current.lastTime = time;
+			const advance = (index) => {
+				const acceleration = DOMAIN_SPRING_STIFFNESS * (current.target[index] - current.value[index]) - DOMAIN_SPRING_DAMPING * current.velocity[index];
+				current.velocity[index] += acceleration * elapsed;
+				current.value[index] += current.velocity[index] * elapsed;
+			};
+			advance(0);
+			advance(1);
+			const span = Math.abs(current.target[1] - current.target[0]);
+			const epsilon = Math.max(1e-4, span * 1e-4);
+			if (Math.abs(current.target[0] - current.value[0]) <= epsilon && Math.abs(current.target[1] - current.value[1]) <= epsilon && Math.abs(current.velocity[0]) <= epsilon * 20 && Math.abs(current.velocity[1]) <= epsilon * 20) {
+				current.value = [current.target[0], current.target[1]];
+				current.velocity = [0, 0];
+				current.frame = null;
+				current.lastTime = null;
+			} else current.frame = requestAnimationFrame(step);
+			setDisplayed([current.value[0], current.value[1]]);
+		};
+		state.frame = requestAnimationFrame(step);
+	}, [
+		animateChanges,
+		domainStart,
+		domainEnd,
+		reducedMotion
+	]);
+	(0, react.useEffect)(() => () => {
+		const frame = stateRef.current?.frame;
+		if (frame != null) cancelAnimationFrame(frame);
+	}, []);
+	return displayed;
+}
+function useChartZoom({ enabled, fullDomain, zoomDomain: controlledDomain, onZoomDomainChange }) {
+	const [uncontrolled, setUncontrolled] = (0, react.useState)(null);
+	const isControlled = controlledDomain !== void 0;
+	const zoomDomain = isControlled ? controlledDomain ?? null : uncontrolled;
+	const prevFullRef = (0, react.useRef)(null);
+	const onChangeRef = (0, react.useRef)(onZoomDomainChange);
+	onChangeRef.current = onZoomDomainChange;
+	const fullStart = fullDomain?.[0];
+	const fullEnd = fullDomain?.[1];
+	(0, react.useEffect)(() => {
+		if (fullStart == null || fullEnd == null) {
+			prevFullRef.current = null;
+			return;
+		}
+		const nextFullDomain = [fullStart, fullEnd];
+		if (require_utils_chart_zoom.shouldInvalidateZoom(prevFullRef.current, nextFullDomain)) {
+			if (!isControlled) setUncontrolled(null);
+			onChangeRef.current?.(null);
+		}
+		prevFullRef.current = nextFullDomain;
+	}, [
+		fullStart,
+		fullEnd,
+		isControlled
+	]);
+	const [brushOrigin, setBrushOrigin] = (0, react.useState)(null);
+	const [brushCurrent, setBrushCurrent] = (0, react.useState)(null);
+	const brushOriginRef = (0, react.useRef)(null);
+	const pinchRef = (0, react.useRef)(null);
+	const panRef = (0, react.useRef)(null);
+	const [isPanning, setIsPanning] = (0, react.useState)(false);
+	const [isPinching, setIsPinching] = (0, react.useState)(false);
+	const suppressTapRef = (0, react.useRef)(false);
+	const lastTapAtRef = (0, react.useRef)(0);
+	const zoomWindow = enabled && fullDomain ? require_utils_chart_zoom.resolveZoomWindow(fullDomain, zoomDomain) : fullDomain;
+	const isZoomed = enabled && fullDomain != null && zoomWindow != null && (zoomWindow[0] !== fullDomain[0] || zoomWindow[1] !== fullDomain[1]);
+	const brushBand = enabled && brushOrigin != null && brushCurrent != null ? toBand(brushOrigin, brushCurrent) : null;
+	const setZoom = (next) => {
+		let resolved = next;
+		if (resolved && fullDomain && resolved[0] === fullDomain[0] && resolved[1] === fullDomain[1]) resolved = null;
+		if (!isControlled) setUncontrolled(resolved);
+		onChangeRef.current?.(resolved);
+	};
+	const clearBrush = () => {
+		brushOriginRef.current = null;
+		setBrushOrigin(null);
+		setBrushCurrent(null);
+	};
+	const clearPan = () => {
+		panRef.current = null;
+		setIsPanning(false);
+	};
+	const reset = () => {
+		if (!enabled || !fullDomain) return;
+		clearBrush();
+		clearPan();
+		pinchRef.current = null;
+		setIsPinching(false);
+		setZoom(null);
+	};
+	return {
+		zoomWindow,
+		brushBand,
+		isBrushing: brushOrigin != null,
+		isPanning,
+		isPinching,
+		isZoomed,
+		onPointerDown(domainX) {
+			if (!enabled || !fullDomain || !zoomWindow || require_utils_chart_zoom.isInertZoom(fullDomain)) return;
+			pinchRef.current = null;
+			setIsPinching(false);
+			brushOriginRef.current = domainX;
+			setBrushOrigin(domainX);
+			setBrushCurrent(domainX);
+		},
+		onPointerMove(domainX) {
+			if (!enabled || brushOriginRef.current == null) return;
+			setBrushCurrent(domainX);
+		},
+		onPointerUp(domainX) {
+			const origin = brushOriginRef.current;
+			if (!enabled || !fullDomain || !zoomWindow || origin == null) return;
+			clearBrush();
+			const next = require_utils_chart_zoom.commitBrushZoom(fullDomain, zoomWindow, origin, domainX);
+			if (next) setZoom(next);
+		},
+		onPointerCancel() {
+			clearBrush();
+		},
+		onDoubleClick() {
+			reset();
+		},
+		onTap() {
+			if (!enabled || suppressTapRef.current) {
+				suppressTapRef.current = false;
+				return;
+			}
+			const now = performance.now();
+			if (now - lastTapAtRef.current < 300) {
+				lastTapAtRef.current = 0;
+				reset();
+				return;
+			}
+			lastTapAtRef.current = now;
+		},
+		onPinchStart(distance, midpoint) {
+			if (!enabled || !fullDomain || !zoomWindow || distance <= 0 || require_utils_chart_zoom.isInertZoom(fullDomain)) return;
+			clearBrush();
+			clearPan();
+			suppressTapRef.current = true;
+			setIsPinching(true);
+			const fraction = Math.min(1, Math.max(0, midpoint));
+			pinchRef.current = {
+				anchor: zoomWindow[0] + fraction * (zoomWindow[1] - zoomWindow[0]),
+				distance,
+				window: zoomWindow
+			};
+		},
+		onPinchMove(distance, midpoint) {
+			if (!enabled || !fullDomain || !pinchRef.current || distance <= 0) return;
+			const scaleFactor = pinchRef.current.distance / distance;
+			setZoom(require_utils_chart_zoom.applyPinchZoom(fullDomain, pinchRef.current.window, scaleFactor, pinchRef.current.anchor, midpoint));
+		},
+		onPinchEnd() {
+			pinchRef.current = null;
+			setIsPinching(false);
+		},
+		onPanStart(point) {
+			if (!enabled || !fullDomain || !zoomWindow || !isZoomed) return;
+			panRef.current = {
+				direction: "pending",
+				start: point,
+				window: zoomWindow
+			};
+		},
+		onPanMove(point) {
+			const pan = panRef.current;
+			if (!enabled || !fullDomain || !pan) return;
+			const dx = point.x - pan.start.x;
+			const dy = point.y - pan.start.y;
+			if (pan.direction === "pending") {
+				if (Math.max(Math.abs(dx), Math.abs(dy)) < PAN_ACTIVATION_THRESHOLD) return;
+				pan.direction = Math.abs(dx) > Math.abs(dy) ? "horizontal" : "vertical";
+			}
+			if (pan.direction !== "horizontal") return;
+			suppressTapRef.current = true;
+			setIsPanning(true);
+			setZoom(require_utils_chart_zoom.panZoomWindow(fullDomain, pan.window, -dx * (pan.window[1] - pan.window[0])));
+		},
+		onPanEnd() {
+			clearPan();
+		},
+		resetZoom: reset
+	};
+}
+//#endregion
+exports.useAnimatedChartDomain = useAnimatedChartDomain;
+exports.useChartZoom = useChartZoom;
+
+//# sourceMappingURL=use-chart-zoom.cjs.map

package/dist/hooks/use-chart-zoom.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-chart-zoom.cjs","names":["shouldInvalidateZoom","resolveZoomWindow","isInertZoom","commitBrushZoom","applyPinchZoom","panZoomWindow"],"sources":["../../src/hooks/use-chart-zoom.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\nimport {\n  applyPinchZoom,\n  commitBrushZoom,\n  isInertZoom,\n  panZoomWindow,\n  resolveZoomWindow,\n  shouldInvalidateZoom,\n  type TimeDomain,\n} from '../utils/chart-zoom'\n\nexport type { TimeDomain }\n\nexport interface UseChartZoomOptions {\n  enabled: boolean\n  fullDomain: TimeDomain | null\n  zoomDomain?: TimeDomain | null\n  onZoomDomainChange?: (domain: TimeDomain | null) => void\n}\n\nexport interface UseChartZoomResult {\n  zoomWindow: TimeDomain | null\n  brushBand: TimeDomain | null\n  isBrushing: boolean\n  isPanning: boolean\n  isPinching: boolean\n  isZoomed: boolean\n  onPointerDown: (domainX: number) => void\n  onPointerMove: (domainX: number) => void\n  onPointerUp: (domainX: number) => void\n  onPointerCancel: () => void\n  onDoubleClick: () => void\n  onTap: () => void\n  onPinchStart: (distance: number, midpoint: number) => void\n  onPinchMove: (distance: number, midpoint: number) => void\n  onPinchEnd: () => void\n  onPanStart: (point: NormalizedPoint) => void\n  onPanMove: (point: NormalizedPoint) => void\n  onPanEnd: () => void\n  resetZoom: () => void\n}\n\ninterface NormalizedPoint {\n  x: number\n  y: number\n}\n\ntype PanDirection = 'pending' | 'horizontal' | 'vertical'\n\nconst PAN_ACTIVATION_THRESHOLD = 0.02\nconst DOMAIN_SPRING_STIFFNESS = 420\nconst DOMAIN_SPRING_DAMPING = 40\n\ninterface AnimatedChartDomainOptions {\n  animateChanges: boolean\n  reducedMotion: boolean\n}\n\ninterface AnimatedChartDomainState {\n  frame: number | null\n  lastTime: number | null\n  target: [number, number]\n  value: [number, number]\n  velocity: [number, number]\n}\n\nfunction toBand(a: number, b: number): TimeDomain {\n  return a <= b ? [a, b] : [b, a]\n}\n\nexport function useAnimatedChartDomain(\n  domain: TimeDomain,\n  { animateChanges, reducedMotion }: AnimatedChartDomainOptions,\n): TimeDomain {\n  const stateRef = useRef<AnimatedChartDomainState | null>(null)\n  if (!stateRef.current) {\n    stateRef.current = {\n      frame: null,\n      lastTime: null,\n      target: [domain[0], domain[1]],\n      value: [domain[0], domain[1]],\n      velocity: [0, 0],\n    }\n  }\n\n  const domainStart = domain[0]\n  const domainEnd = domain[1]\n\n  const [displayed, setDisplayed] = useState<TimeDomain>(() => [\n    domainStart,\n    domainEnd,\n  ])\n\n  useEffect(() => {\n    const state = stateRef.current\n    if (!state) return\n\n    const targetChanged =\n      state.target[0] !== domainStart || state.target[1] !== domainEnd\n    state.target = [domainStart, domainEnd]\n\n    const snap = () => {\n      if (state.frame != null) cancelAnimationFrame(state.frame)\n      state.frame = null\n      state.lastTime = null\n      state.value = [domainStart, domainEnd]\n      state.velocity = [0, 0]\n      setDisplayed([domainStart, domainEnd])\n    }\n\n    if (reducedMotion || (targetChanged && !animateChanges)) {\n      snap()\n      return\n    }\n    if (!targetChanged || state.frame != null) return\n\n    const step = (time: number) => {\n      const current = stateRef.current\n      if (!current) return\n      const elapsed =\n        current.lastTime == null\n          ? 1 / 60\n          : Math.min(1 / 30, (time - current.lastTime) / 1000)\n      current.lastTime = time\n\n      const advance = (index: 0 | 1) => {\n        const displacement = current.target[index] - current.value[index]\n        const acceleration =\n          DOMAIN_SPRING_STIFFNESS * displacement -\n          DOMAIN_SPRING_DAMPING * current.velocity[index]\n        current.velocity[index] += acceleration * elapsed\n        current.value[index] += current.velocity[index] * elapsed\n      }\n      advance(0)\n      advance(1)\n\n      const span = Math.abs(current.target[1] - current.target[0])\n      const epsilon = Math.max(0.0001, span * 0.0001)\n      const settled =\n        Math.abs(current.target[0] - current.value[0]) <= epsilon &&\n        Math.abs(current.target[1] - current.value[1]) <= epsilon &&\n        Math.abs(current.velocity[0]) <= epsilon * 20 &&\n        Math.abs(current.velocity[1]) <= epsilon * 20\n\n      if (settled) {\n        current.value = [current.target[0], current.target[1]]\n        current.velocity = [0, 0]\n        current.frame = null\n        current.lastTime = null\n      } else {\n        current.frame = requestAnimationFrame(step)\n      }\n      setDisplayed([current.value[0], current.value[1]])\n    }\n\n    state.frame = requestAnimationFrame(step)\n  }, [animateChanges, domainStart, domainEnd, reducedMotion])\n\n  useEffect(\n    () => () => {\n      const frame = stateRef.current?.frame\n      if (frame != null) cancelAnimationFrame(frame)\n    },\n    [],\n  )\n\n  return displayed\n}\n\nexport function useChartZoom({\n  enabled,\n  fullDomain,\n  zoomDomain: controlledDomain,\n  onZoomDomainChange,\n}: UseChartZoomOptions): UseChartZoomResult {\n  const [uncontrolled, setUncontrolled] = useState<TimeDomain | null>(null)\n  const isControlled = controlledDomain !== undefined\n  const zoomDomain = isControlled ? (controlledDomain ?? null) : uncontrolled\n\n  const prevFullRef = useRef<TimeDomain | null>(null)\n  const onChangeRef = useRef(onZoomDomainChange)\n  onChangeRef.current = onZoomDomainChange\n\n  const fullStart = fullDomain?.[0]\n  const fullEnd = fullDomain?.[1]\n\n  useEffect(() => {\n    if (fullStart == null || fullEnd == null) {\n      prevFullRef.current = null\n      return\n    }\n    const nextFullDomain: TimeDomain = [fullStart, fullEnd]\n    if (shouldInvalidateZoom(prevFullRef.current, nextFullDomain)) {\n      if (!isControlled) setUncontrolled(null)\n      onChangeRef.current?.(null)\n    }\n    prevFullRef.current = nextFullDomain\n  }, [fullStart, fullEnd, isControlled])\n\n  const [brushOrigin, setBrushOrigin] = useState<number | null>(null)\n  const [brushCurrent, setBrushCurrent] = useState<number | null>(null)\n  const brushOriginRef = useRef<number | null>(null)\n  const pinchRef = useRef<{\n    anchor: number\n    distance: number\n    window: TimeDomain\n  } | null>(null)\n  const panRef = useRef<{\n    direction: PanDirection\n    start: NormalizedPoint\n    window: TimeDomain\n  } | null>(null)\n  const [isPanning, setIsPanning] = useState(false)\n  const [isPinching, setIsPinching] = useState(false)\n  const suppressTapRef = useRef(false)\n  const lastTapAtRef = useRef(0)\n\n  const zoomWindow =\n    enabled && fullDomain\n      ? resolveZoomWindow(fullDomain, zoomDomain)\n      : fullDomain\n  const isZoomed =\n    enabled &&\n    fullDomain != null &&\n    zoomWindow != null &&\n    (zoomWindow[0] !== fullDomain[0] || zoomWindow[1] !== fullDomain[1])\n\n  const brushBand =\n    enabled && brushOrigin != null && brushCurrent != null\n      ? toBand(brushOrigin, brushCurrent)\n      : null\n\n  const setZoom = (next: TimeDomain | null) => {\n    let resolved = next\n    if (\n      resolved &&\n      fullDomain &&\n      resolved[0] === fullDomain[0] &&\n      resolved[1] === fullDomain[1]\n    ) {\n      resolved = null\n    }\n    if (!isControlled) setUncontrolled(resolved)\n    onChangeRef.current?.(resolved)\n  }\n\n  const clearBrush = () => {\n    brushOriginRef.current = null\n    setBrushOrigin(null)\n    setBrushCurrent(null)\n  }\n\n  const clearPan = () => {\n    panRef.current = null\n    setIsPanning(false)\n  }\n\n  const reset = () => {\n    if (!enabled || !fullDomain) return\n    clearBrush()\n    clearPan()\n    pinchRef.current = null\n    setIsPinching(false)\n    setZoom(null)\n  }\n\n  return {\n    zoomWindow,\n    brushBand,\n    isBrushing: brushOrigin != null,\n    isPanning,\n    isPinching,\n    isZoomed,\n    onPointerDown(domainX) {\n      if (!enabled || !fullDomain || !zoomWindow || isInertZoom(fullDomain)) {\n        return\n      }\n      pinchRef.current = null\n      setIsPinching(false)\n      brushOriginRef.current = domainX\n      setBrushOrigin(domainX)\n      setBrushCurrent(domainX)\n    },\n    onPointerMove(domainX) {\n      if (!enabled || brushOriginRef.current == null) return\n      setBrushCurrent(domainX)\n    },\n    onPointerUp(domainX) {\n      const origin = brushOriginRef.current\n      if (!enabled || !fullDomain || !zoomWindow || origin == null) return\n      clearBrush()\n      const next = commitBrushZoom(fullDomain, zoomWindow, origin, domainX)\n      if (next) setZoom(next)\n    },\n    onPointerCancel() {\n      clearBrush()\n    },\n    onDoubleClick() {\n      reset()\n    },\n    onTap() {\n      if (!enabled || suppressTapRef.current) {\n        suppressTapRef.current = false\n        return\n      }\n      const now = performance.now()\n      if (now - lastTapAtRef.current < 300) {\n        lastTapAtRef.current = 0\n        reset()\n        return\n      }\n      lastTapAtRef.current = now\n    },\n    onPinchStart(distance, midpoint) {\n      if (\n        !enabled ||\n        !fullDomain ||\n        !zoomWindow ||\n        distance <= 0 ||\n        isInertZoom(fullDomain)\n      ) {\n        return\n      }\n      clearBrush()\n      clearPan()\n      suppressTapRef.current = true\n      setIsPinching(true)\n      const fraction = Math.min(1, Math.max(0, midpoint))\n      const anchor = zoomWindow[0] + fraction * (zoomWindow[1] - zoomWindow[0])\n      pinchRef.current = { anchor, distance, window: zoomWindow }\n    },\n    onPinchMove(distance, midpoint) {\n      if (!enabled || !fullDomain || !pinchRef.current || distance <= 0) return\n      const scaleFactor = pinchRef.current.distance / distance\n      const next = applyPinchZoom(\n        fullDomain,\n        pinchRef.current.window,\n        scaleFactor,\n        pinchRef.current.anchor,\n        midpoint,\n      )\n      setZoom(next)\n    },\n    onPinchEnd() {\n      pinchRef.current = null\n      setIsPinching(false)\n    },\n    onPanStart(point) {\n      if (!enabled || !fullDomain || !zoomWindow || !isZoomed) return\n      panRef.current = {\n        direction: 'pending',\n        start: point,\n        window: zoomWindow,\n      }\n    },\n    onPanMove(point) {\n      const pan = panRef.current\n      if (!enabled || !fullDomain || !pan) return\n      const dx = point.x - pan.start.x\n      const dy = point.y - pan.start.y\n      if (pan.direction === 'pending') {\n        if (Math.max(Math.abs(dx), Math.abs(dy)) < PAN_ACTIVATION_THRESHOLD) {\n          return\n        }\n        pan.direction = Math.abs(dx) > Math.abs(dy) ? 'horizontal' : 'vertical'\n      }\n      if (pan.direction !== 'horizontal') return\n      suppressTapRef.current = true\n      setIsPanning(true)\n      setZoom(\n        panZoomWindow(\n          fullDomain,\n          pan.window,\n          -dx * (pan.window[1] - pan.window[0]),\n        ),\n      )\n    },\n    onPanEnd() {\n      clearPan()\n    },\n    resetZoom: reset,\n  }\n}\n"],"mappings":"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"}

package/dist/hooks/use-chart-zoom.d.cts

@@ -0,0 +1,53 @@
+"use client";
+
+import { TimeDomain } from "../utils/chart-zoom.cjs";
+
+//#region src/hooks/use-chart-zoom.d.ts
+interface UseChartZoomOptions {
+  enabled: boolean;
+  fullDomain: TimeDomain | null;
+  zoomDomain?: TimeDomain | null;
+  onZoomDomainChange?: (domain: TimeDomain | null) => void;
+}
+interface UseChartZoomResult {
+  zoomWindow: TimeDomain | null;
+  brushBand: TimeDomain | null;
+  isBrushing: boolean;
+  isPanning: boolean;
+  isPinching: boolean;
+  isZoomed: boolean;
+  onPointerDown: (domainX: number) => void;
+  onPointerMove: (domainX: number) => void;
+  onPointerUp: (domainX: number) => void;
+  onPointerCancel: () => void;
+  onDoubleClick: () => void;
+  onTap: () => void;
+  onPinchStart: (distance: number, midpoint: number) => void;
+  onPinchMove: (distance: number, midpoint: number) => void;
+  onPinchEnd: () => void;
+  onPanStart: (point: NormalizedPoint) => void;
+  onPanMove: (point: NormalizedPoint) => void;
+  onPanEnd: () => void;
+  resetZoom: () => void;
+}
+interface NormalizedPoint {
+  x: number;
+  y: number;
+}
+interface AnimatedChartDomainOptions {
+  animateChanges: boolean;
+  reducedMotion: boolean;
+}
+declare function useAnimatedChartDomain(domain: TimeDomain, {
+  animateChanges,
+  reducedMotion
+}: AnimatedChartDomainOptions): TimeDomain;
+declare function useChartZoom({
+  enabled,
+  fullDomain,
+  zoomDomain: controlledDomain,
+  onZoomDomainChange
+}: UseChartZoomOptions): UseChartZoomResult;
+//#endregion
+export { type TimeDomain, UseChartZoomOptions, UseChartZoomResult, useAnimatedChartDomain, useChartZoom };
+//# sourceMappingURL=use-chart-zoom.d.cts.map

package/dist/hooks/use-chart-zoom.d.ts

@@ -0,0 +1,53 @@
+"use client";
+
+import { TimeDomain } from "../utils/chart-zoom.js";
+
+//#region src/hooks/use-chart-zoom.d.ts
+interface UseChartZoomOptions {
+  enabled: boolean;
+  fullDomain: TimeDomain | null;
+  zoomDomain?: TimeDomain | null;
+  onZoomDomainChange?: (domain: TimeDomain | null) => void;
+}
+interface UseChartZoomResult {
+  zoomWindow: TimeDomain | null;
+  brushBand: TimeDomain | null;
+  isBrushing: boolean;
+  isPanning: boolean;
+  isPinching: boolean;
+  isZoomed: boolean;
+  onPointerDown: (domainX: number) => void;
+  onPointerMove: (domainX: number) => void;
+  onPointerUp: (domainX: number) => void;
+  onPointerCancel: () => void;
+  onDoubleClick: () => void;
+  onTap: () => void;
+  onPinchStart: (distance: number, midpoint: number) => void;
+  onPinchMove: (distance: number, midpoint: number) => void;
+  onPinchEnd: () => void;
+  onPanStart: (point: NormalizedPoint) => void;
+  onPanMove: (point: NormalizedPoint) => void;
+  onPanEnd: () => void;
+  resetZoom: () => void;
+}
+interface NormalizedPoint {
+  x: number;
+  y: number;
+}
+interface AnimatedChartDomainOptions {
+  animateChanges: boolean;
+  reducedMotion: boolean;
+}
+declare function useAnimatedChartDomain(domain: TimeDomain, {
+  animateChanges,
+  reducedMotion
+}: AnimatedChartDomainOptions): TimeDomain;
+declare function useChartZoom({
+  enabled,
+  fullDomain,
+  zoomDomain: controlledDomain,
+  onZoomDomainChange
+}: UseChartZoomOptions): UseChartZoomResult;
+//#endregion
+export { type TimeDomain, UseChartZoomOptions, UseChartZoomResult, useAnimatedChartDomain, useChartZoom };
+//# sourceMappingURL=use-chart-zoom.d.ts.map

package/dist/hooks/use-chart-zoom.js

@@ -0,0 +1,234 @@
+"use client";
+import { applyPinchZoom, commitBrushZoom, isInertZoom, panZoomWindow, resolveZoomWindow, shouldInvalidateZoom } from "../utils/chart-zoom.js";
+import { useEffect, useRef, useState } from "react";
+//#region src/hooks/use-chart-zoom.ts
+const PAN_ACTIVATION_THRESHOLD = .02;
+const DOMAIN_SPRING_STIFFNESS = 420;
+const DOMAIN_SPRING_DAMPING = 40;
+function toBand(a, b) {
+	return a <= b ? [a, b] : [b, a];
+}
+function useAnimatedChartDomain(domain, { animateChanges, reducedMotion }) {
+	const stateRef = useRef(null);
+	if (!stateRef.current) stateRef.current = {
+		frame: null,
+		lastTime: null,
+		target: [domain[0], domain[1]],
+		value: [domain[0], domain[1]],
+		velocity: [0, 0]
+	};
+	const domainStart = domain[0];
+	const domainEnd = domain[1];
+	const [displayed, setDisplayed] = useState(() => [domainStart, domainEnd]);
+	useEffect(() => {
+		const state = stateRef.current;
+		if (!state) return;
+		const targetChanged = state.target[0] !== domainStart || state.target[1] !== domainEnd;
+		state.target = [domainStart, domainEnd];
+		const snap = () => {
+			if (state.frame != null) cancelAnimationFrame(state.frame);
+			state.frame = null;
+			state.lastTime = null;
+			state.value = [domainStart, domainEnd];
+			state.velocity = [0, 0];
+			setDisplayed([domainStart, domainEnd]);
+		};
+		if (reducedMotion || targetChanged && !animateChanges) {
+			snap();
+			return;
+		}
+		if (!targetChanged || state.frame != null) return;
+		const step = (time) => {
+			const current = stateRef.current;
+			if (!current) return;
+			const elapsed = current.lastTime == null ? 1 / 60 : Math.min(1 / 30, (time - current.lastTime) / 1e3);
+			current.lastTime = time;
+			const advance = (index) => {
+				const acceleration = DOMAIN_SPRING_STIFFNESS * (current.target[index] - current.value[index]) - DOMAIN_SPRING_DAMPING * current.velocity[index];
+				current.velocity[index] += acceleration * elapsed;
+				current.value[index] += current.velocity[index] * elapsed;
+			};
+			advance(0);
+			advance(1);
+			const span = Math.abs(current.target[1] - current.target[0]);
+			const epsilon = Math.max(1e-4, span * 1e-4);
+			if (Math.abs(current.target[0] - current.value[0]) <= epsilon && Math.abs(current.target[1] - current.value[1]) <= epsilon && Math.abs(current.velocity[0]) <= epsilon * 20 && Math.abs(current.velocity[1]) <= epsilon * 20) {
+				current.value = [current.target[0], current.target[1]];
+				current.velocity = [0, 0];
+				current.frame = null;
+				current.lastTime = null;
+			} else current.frame = requestAnimationFrame(step);
+			setDisplayed([current.value[0], current.value[1]]);
+		};
+		state.frame = requestAnimationFrame(step);
+	}, [
+		animateChanges,
+		domainStart,
+		domainEnd,
+		reducedMotion
+	]);
+	useEffect(() => () => {
+		const frame = stateRef.current?.frame;
+		if (frame != null) cancelAnimationFrame(frame);
+	}, []);
+	return displayed;
+}
+function useChartZoom({ enabled, fullDomain, zoomDomain: controlledDomain, onZoomDomainChange }) {
+	const [uncontrolled, setUncontrolled] = useState(null);
+	const isControlled = controlledDomain !== void 0;
+	const zoomDomain = isControlled ? controlledDomain ?? null : uncontrolled;
+	const prevFullRef = useRef(null);
+	const onChangeRef = useRef(onZoomDomainChange);
+	onChangeRef.current = onZoomDomainChange;
+	const fullStart = fullDomain?.[0];
+	const fullEnd = fullDomain?.[1];
+	useEffect(() => {
+		if (fullStart == null || fullEnd == null) {
+			prevFullRef.current = null;
+			return;
+		}
+		const nextFullDomain = [fullStart, fullEnd];
+		if (shouldInvalidateZoom(prevFullRef.current, nextFullDomain)) {
+			if (!isControlled) setUncontrolled(null);
+			onChangeRef.current?.(null);
+		}
+		prevFullRef.current = nextFullDomain;
+	}, [
+		fullStart,
+		fullEnd,
+		isControlled
+	]);
+	const [brushOrigin, setBrushOrigin] = useState(null);
+	const [brushCurrent, setBrushCurrent] = useState(null);
+	const brushOriginRef = useRef(null);
+	const pinchRef = useRef(null);
+	const panRef = useRef(null);
+	const [isPanning, setIsPanning] = useState(false);
+	const [isPinching, setIsPinching] = useState(false);
+	const suppressTapRef = useRef(false);
+	const lastTapAtRef = useRef(0);
+	const zoomWindow = enabled && fullDomain ? resolveZoomWindow(fullDomain, zoomDomain) : fullDomain;
+	const isZoomed = enabled && fullDomain != null && zoomWindow != null && (zoomWindow[0] !== fullDomain[0] || zoomWindow[1] !== fullDomain[1]);
+	const brushBand = enabled && brushOrigin != null && brushCurrent != null ? toBand(brushOrigin, brushCurrent) : null;
+	const setZoom = (next) => {
+		let resolved = next;
+		if (resolved && fullDomain && resolved[0] === fullDomain[0] && resolved[1] === fullDomain[1]) resolved = null;
+		if (!isControlled) setUncontrolled(resolved);
+		onChangeRef.current?.(resolved);
+	};
+	const clearBrush = () => {
+		brushOriginRef.current = null;
+		setBrushOrigin(null);
+		setBrushCurrent(null);
+	};
+	const clearPan = () => {
+		panRef.current = null;
+		setIsPanning(false);
+	};
+	const reset = () => {
+		if (!enabled || !fullDomain) return;
+		clearBrush();
+		clearPan();
+		pinchRef.current = null;
+		setIsPinching(false);
+		setZoom(null);
+	};
+	return {
+		zoomWindow,
+		brushBand,
+		isBrushing: brushOrigin != null,
+		isPanning,
+		isPinching,
+		isZoomed,
+		onPointerDown(domainX) {
+			if (!enabled || !fullDomain || !zoomWindow || isInertZoom(fullDomain)) return;
+			pinchRef.current = null;
+			setIsPinching(false);
+			brushOriginRef.current = domainX;
+			setBrushOrigin(domainX);
+			setBrushCurrent(domainX);
+		},
+		onPointerMove(domainX) {
+			if (!enabled || brushOriginRef.current == null) return;
+			setBrushCurrent(domainX);
+		},
+		onPointerUp(domainX) {
+			const origin = brushOriginRef.current;
+			if (!enabled || !fullDomain || !zoomWindow || origin == null) return;
+			clearBrush();
+			const next = commitBrushZoom(fullDomain, zoomWindow, origin, domainX);
+			if (next) setZoom(next);
+		},
+		onPointerCancel() {
+			clearBrush();
+		},
+		onDoubleClick() {
+			reset();
+		},
+		onTap() {
+			if (!enabled || suppressTapRef.current) {
+				suppressTapRef.current = false;
+				return;
+			}
+			const now = performance.now();
+			if (now - lastTapAtRef.current < 300) {
+				lastTapAtRef.current = 0;
+				reset();
+				return;
+			}
+			lastTapAtRef.current = now;
+		},
+		onPinchStart(distance, midpoint) {
+			if (!enabled || !fullDomain || !zoomWindow || distance <= 0 || isInertZoom(fullDomain)) return;
+			clearBrush();
+			clearPan();
+			suppressTapRef.current = true;
+			setIsPinching(true);
+			const fraction = Math.min(1, Math.max(0, midpoint));
+			pinchRef.current = {
+				anchor: zoomWindow[0] + fraction * (zoomWindow[1] - zoomWindow[0]),
+				distance,
+				window: zoomWindow
+			};
+		},
+		onPinchMove(distance, midpoint) {
+			if (!enabled || !fullDomain || !pinchRef.current || distance <= 0) return;
+			const scaleFactor = pinchRef.current.distance / distance;
+			setZoom(applyPinchZoom(fullDomain, pinchRef.current.window, scaleFactor, pinchRef.current.anchor, midpoint));
+		},
+		onPinchEnd() {
+			pinchRef.current = null;
+			setIsPinching(false);
+		},
+		onPanStart(point) {
+			if (!enabled || !fullDomain || !zoomWindow || !isZoomed) return;
+			panRef.current = {
+				direction: "pending",
+				start: point,
+				window: zoomWindow
+			};
+		},
+		onPanMove(point) {
+			const pan = panRef.current;
+			if (!enabled || !fullDomain || !pan) return;
+			const dx = point.x - pan.start.x;
+			const dy = point.y - pan.start.y;
+			if (pan.direction === "pending") {
+				if (Math.max(Math.abs(dx), Math.abs(dy)) < PAN_ACTIVATION_THRESHOLD) return;
+				pan.direction = Math.abs(dx) > Math.abs(dy) ? "horizontal" : "vertical";
+			}
+			if (pan.direction !== "horizontal") return;
+			suppressTapRef.current = true;
+			setIsPanning(true);
+			setZoom(panZoomWindow(fullDomain, pan.window, -dx * (pan.window[1] - pan.window[0])));
+		},
+		onPanEnd() {
+			clearPan();
+		},
+		resetZoom: reset
+	};
+}
+//#endregion
+export { useAnimatedChartDomain, useChartZoom };
+
+//# sourceMappingURL=use-chart-zoom.js.map

package/dist/hooks/use-chart-zoom.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-chart-zoom.js","names":[],"sources":["../../src/hooks/use-chart-zoom.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\nimport {\n  applyPinchZoom,\n  commitBrushZoom,\n  isInertZoom,\n  panZoomWindow,\n  resolveZoomWindow,\n  shouldInvalidateZoom,\n  type TimeDomain,\n} from '../utils/chart-zoom'\n\nexport type { TimeDomain }\n\nexport interface UseChartZoomOptions {\n  enabled: boolean\n  fullDomain: TimeDomain | null\n  zoomDomain?: TimeDomain | null\n  onZoomDomainChange?: (domain: TimeDomain | null) => void\n}\n\nexport interface UseChartZoomResult {\n  zoomWindow: TimeDomain | null\n  brushBand: TimeDomain | null\n  isBrushing: boolean\n  isPanning: boolean\n  isPinching: boolean\n  isZoomed: boolean\n  onPointerDown: (domainX: number) => void\n  onPointerMove: (domainX: number) => void\n  onPointerUp: (domainX: number) => void\n  onPointerCancel: () => void\n  onDoubleClick: () => void\n  onTap: () => void\n  onPinchStart: (distance: number, midpoint: number) => void\n  onPinchMove: (distance: number, midpoint: number) => void\n  onPinchEnd: () => void\n  onPanStart: (point: NormalizedPoint) => void\n  onPanMove: (point: NormalizedPoint) => void\n  onPanEnd: () => void\n  resetZoom: () => void\n}\n\ninterface NormalizedPoint {\n  x: number\n  y: number\n}\n\ntype PanDirection = 'pending' | 'horizontal' | 'vertical'\n\nconst PAN_ACTIVATION_THRESHOLD = 0.02\nconst DOMAIN_SPRING_STIFFNESS = 420\nconst DOMAIN_SPRING_DAMPING = 40\n\ninterface AnimatedChartDomainOptions {\n  animateChanges: boolean\n  reducedMotion: boolean\n}\n\ninterface AnimatedChartDomainState {\n  frame: number | null\n  lastTime: number | null\n  target: [number, number]\n  value: [number, number]\n  velocity: [number, number]\n}\n\nfunction toBand(a: number, b: number): TimeDomain {\n  return a <= b ? [a, b] : [b, a]\n}\n\nexport function useAnimatedChartDomain(\n  domain: TimeDomain,\n  { animateChanges, reducedMotion }: AnimatedChartDomainOptions,\n): TimeDomain {\n  const stateRef = useRef<AnimatedChartDomainState | null>(null)\n  if (!stateRef.current) {\n    stateRef.current = {\n      frame: null,\n      lastTime: null,\n      target: [domain[0], domain[1]],\n      value: [domain[0], domain[1]],\n      velocity: [0, 0],\n    }\n  }\n\n  const domainStart = domain[0]\n  const domainEnd = domain[1]\n\n  const [displayed, setDisplayed] = useState<TimeDomain>(() => [\n    domainStart,\n    domainEnd,\n  ])\n\n  useEffect(() => {\n    const state = stateRef.current\n    if (!state) return\n\n    const targetChanged =\n      state.target[0] !== domainStart || state.target[1] !== domainEnd\n    state.target = [domainStart, domainEnd]\n\n    const snap = () => {\n      if (state.frame != null) cancelAnimationFrame(state.frame)\n      state.frame = null\n      state.lastTime = null\n      state.value = [domainStart, domainEnd]\n      state.velocity = [0, 0]\n      setDisplayed([domainStart, domainEnd])\n    }\n\n    if (reducedMotion || (targetChanged && !animateChanges)) {\n      snap()\n      return\n    }\n    if (!targetChanged || state.frame != null) return\n\n    const step = (time: number) => {\n      const current = stateRef.current\n      if (!current) return\n      const elapsed =\n        current.lastTime == null\n          ? 1 / 60\n          : Math.min(1 / 30, (time - current.lastTime) / 1000)\n      current.lastTime = time\n\n      const advance = (index: 0 | 1) => {\n        const displacement = current.target[index] - current.value[index]\n        const acceleration =\n          DOMAIN_SPRING_STIFFNESS * displacement -\n          DOMAIN_SPRING_DAMPING * current.velocity[index]\n        current.velocity[index] += acceleration * elapsed\n        current.value[index] += current.velocity[index] * elapsed\n      }\n      advance(0)\n      advance(1)\n\n      const span = Math.abs(current.target[1] - current.target[0])\n      const epsilon = Math.max(0.0001, span * 0.0001)\n      const settled =\n        Math.abs(current.target[0] - current.value[0]) <= epsilon &&\n        Math.abs(current.target[1] - current.value[1]) <= epsilon &&\n        Math.abs(current.velocity[0]) <= epsilon * 20 &&\n        Math.abs(current.velocity[1]) <= epsilon * 20\n\n      if (settled) {\n        current.value = [current.target[0], current.target[1]]\n        current.velocity = [0, 0]\n        current.frame = null\n        current.lastTime = null\n      } else {\n        current.frame = requestAnimationFrame(step)\n      }\n      setDisplayed([current.value[0], current.value[1]])\n    }\n\n    state.frame = requestAnimationFrame(step)\n  }, [animateChanges, domainStart, domainEnd, reducedMotion])\n\n  useEffect(\n    () => () => {\n      const frame = stateRef.current?.frame\n      if (frame != null) cancelAnimationFrame(frame)\n    },\n    [],\n  )\n\n  return displayed\n}\n\nexport function useChartZoom({\n  enabled,\n  fullDomain,\n  zoomDomain: controlledDomain,\n  onZoomDomainChange,\n}: UseChartZoomOptions): UseChartZoomResult {\n  const [uncontrolled, setUncontrolled] = useState<TimeDomain | null>(null)\n  const isControlled = controlledDomain !== undefined\n  const zoomDomain = isControlled ? (controlledDomain ?? null) : uncontrolled\n\n  const prevFullRef = useRef<TimeDomain | null>(null)\n  const onChangeRef = useRef(onZoomDomainChange)\n  onChangeRef.current = onZoomDomainChange\n\n  const fullStart = fullDomain?.[0]\n  const fullEnd = fullDomain?.[1]\n\n  useEffect(() => {\n    if (fullStart == null || fullEnd == null) {\n      prevFullRef.current = null\n      return\n    }\n    const nextFullDomain: TimeDomain = [fullStart, fullEnd]\n    if (shouldInvalidateZoom(prevFullRef.current, nextFullDomain)) {\n      if (!isControlled) setUncontrolled(null)\n      onChangeRef.current?.(null)\n    }\n    prevFullRef.current = nextFullDomain\n  }, [fullStart, fullEnd, isControlled])\n\n  const [brushOrigin, setBrushOrigin] = useState<number | null>(null)\n  const [brushCurrent, setBrushCurrent] = useState<number | null>(null)\n  const brushOriginRef = useRef<number | null>(null)\n  const pinchRef = useRef<{\n    anchor: number\n    distance: number\n    window: TimeDomain\n  } | null>(null)\n  const panRef = useRef<{\n    direction: PanDirection\n    start: NormalizedPoint\n    window: TimeDomain\n  } | null>(null)\n  const [isPanning, setIsPanning] = useState(false)\n  const [isPinching, setIsPinching] = useState(false)\n  const suppressTapRef = useRef(false)\n  const lastTapAtRef = useRef(0)\n\n  const zoomWindow =\n    enabled && fullDomain\n      ? resolveZoomWindow(fullDomain, zoomDomain)\n      : fullDomain\n  const isZoomed =\n    enabled &&\n    fullDomain != null &&\n    zoomWindow != null &&\n    (zoomWindow[0] !== fullDomain[0] || zoomWindow[1] !== fullDomain[1])\n\n  const brushBand =\n    enabled && brushOrigin != null && brushCurrent != null\n      ? toBand(brushOrigin, brushCurrent)\n      : null\n\n  const setZoom = (next: TimeDomain | null) => {\n    let resolved = next\n    if (\n      resolved &&\n      fullDomain &&\n      resolved[0] === fullDomain[0] &&\n      resolved[1] === fullDomain[1]\n    ) {\n      resolved = null\n    }\n    if (!isControlled) setUncontrolled(resolved)\n    onChangeRef.current?.(resolved)\n  }\n\n  const clearBrush = () => {\n    brushOriginRef.current = null\n    setBrushOrigin(null)\n    setBrushCurrent(null)\n  }\n\n  const clearPan = () => {\n    panRef.current = null\n    setIsPanning(false)\n  }\n\n  const reset = () => {\n    if (!enabled || !fullDomain) return\n    clearBrush()\n    clearPan()\n    pinchRef.current = null\n    setIsPinching(false)\n    setZoom(null)\n  }\n\n  return {\n    zoomWindow,\n    brushBand,\n    isBrushing: brushOrigin != null,\n    isPanning,\n    isPinching,\n    isZoomed,\n    onPointerDown(domainX) {\n      if (!enabled || !fullDomain || !zoomWindow || isInertZoom(fullDomain)) {\n        return\n      }\n      pinchRef.current = null\n      setIsPinching(false)\n      brushOriginRef.current = domainX\n      setBrushOrigin(domainX)\n      setBrushCurrent(domainX)\n    },\n    onPointerMove(domainX) {\n      if (!enabled || brushOriginRef.current == null) return\n      setBrushCurrent(domainX)\n    },\n    onPointerUp(domainX) {\n      const origin = brushOriginRef.current\n      if (!enabled || !fullDomain || !zoomWindow || origin == null) return\n      clearBrush()\n      const next = commitBrushZoom(fullDomain, zoomWindow, origin, domainX)\n      if (next) setZoom(next)\n    },\n    onPointerCancel() {\n      clearBrush()\n    },\n    onDoubleClick() {\n      reset()\n    },\n    onTap() {\n      if (!enabled || suppressTapRef.current) {\n        suppressTapRef.current = false\n        return\n      }\n      const now = performance.now()\n      if (now - lastTapAtRef.current < 300) {\n        lastTapAtRef.current = 0\n        reset()\n        return\n      }\n      lastTapAtRef.current = now\n    },\n    onPinchStart(distance, midpoint) {\n      if (\n        !enabled ||\n        !fullDomain ||\n        !zoomWindow ||\n        distance <= 0 ||\n        isInertZoom(fullDomain)\n      ) {\n        return\n      }\n      clearBrush()\n      clearPan()\n      suppressTapRef.current = true\n      setIsPinching(true)\n      const fraction = Math.min(1, Math.max(0, midpoint))\n      const anchor = zoomWindow[0] + fraction * (zoomWindow[1] - zoomWindow[0])\n      pinchRef.current = { anchor, distance, window: zoomWindow }\n    },\n    onPinchMove(distance, midpoint) {\n      if (!enabled || !fullDomain || !pinchRef.current || distance <= 0) return\n      const scaleFactor = pinchRef.current.distance / distance\n      const next = applyPinchZoom(\n        fullDomain,\n        pinchRef.current.window,\n        scaleFactor,\n        pinchRef.current.anchor,\n        midpoint,\n      )\n      setZoom(next)\n    },\n    onPinchEnd() {\n      pinchRef.current = null\n      setIsPinching(false)\n    },\n    onPanStart(point) {\n      if (!enabled || !fullDomain || !zoomWindow || !isZoomed) return\n      panRef.current = {\n        direction: 'pending',\n        start: point,\n        window: zoomWindow,\n      }\n    },\n    onPanMove(point) {\n      const pan = panRef.current\n      if (!enabled || !fullDomain || !pan) return\n      const dx = point.x - pan.start.x\n      const dy = point.y - pan.start.y\n      if (pan.direction === 'pending') {\n        if (Math.max(Math.abs(dx), Math.abs(dy)) < PAN_ACTIVATION_THRESHOLD) {\n          return\n        }\n        pan.direction = Math.abs(dx) > Math.abs(dy) ? 'horizontal' : 'vertical'\n      }\n      if (pan.direction !== 'horizontal') return\n      suppressTapRef.current = true\n      setIsPanning(true)\n      setZoom(\n        panZoomWindow(\n          fullDomain,\n          pan.window,\n          -dx * (pan.window[1] - pan.window[0]),\n        ),\n      )\n    },\n    onPanEnd() {\n      clearPan()\n    },\n    resetZoom: reset,\n  }\n}\n"],"mappings":"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"}

package/dist/hooks/use-container-width.cjs

@@ -0,0 +1,21 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+let react = require("react");
+//#region src/hooks/use-container-width.ts
+function useContainerWidth() {
+	const ref = (0, react.useRef)(null);
+	const [width, setWidth] = (0, react.useState)(0);
+	(0, react.useEffect)(() => {
+		const el = ref.current;
+		if (!el) return;
+		const obs = new ResizeObserver(([entry]) => setWidth(entry?.contentRect.width ?? 0));
+		obs.observe(el);
+		setWidth(el.clientWidth);
+		return () => obs.disconnect();
+	}, []);
+	return [ref, width];
+}
+//#endregion
+exports.useContainerWidth = useContainerWidth;
+
+//# sourceMappingURL=use-container-width.cjs.map

package/dist/hooks/use-container-width.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-container-width.cjs","names":[],"sources":["../../src/hooks/use-container-width.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\n\nfunction useContainerWidth<T extends HTMLElement>(): [\n  React.RefObject<T | null>,\n  number,\n] {\n  const ref = useRef<T | null>(null)\n  const [width, setWidth] = useState(0)\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n\n    const obs = new ResizeObserver(([entry]) =>\n      setWidth(entry?.contentRect.width ?? 0),\n    )\n    obs.observe(el)\n    setWidth(el.clientWidth)\n\n    return () => obs.disconnect()\n  }, [])\n\n  return [ref, width]\n}\n\nexport { useContainerWidth }\n"],"mappings":";;;;AAEA,SAAS,oBAGP;CACA,MAAM,OAAA,GAAA,MAAA,QAAuB,IAAI;CACjC,MAAM,CAAC,OAAO,aAAA,GAAA,MAAA,UAAqB,CAAC;CAEpC,CAAA,GAAA,MAAA,iBAAgB;EACd,MAAM,KAAK,IAAI;EACf,IAAI,CAAC,IAAI;EAET,MAAM,MAAM,IAAI,gBAAgB,CAAC,WAC/B,SAAS,OAAO,YAAY,SAAS,CAAC,CACxC;EACA,IAAI,QAAQ,EAAE;EACd,SAAS,GAAG,WAAW;EAEvB,aAAa,IAAI,WAAW;CAC9B,GAAG,CAAC,CAAC;CAEL,OAAO,CAAC,KAAK,KAAK;AACpB"}