@bagelink/vue 1.15.202 → 1.15.205

package/src/components/charts/core/arc.ts

@@ -0,0 +1,53 @@
+/**
+ * SVG arc helpers for pie / donut slices.
+ * Full 360° arcs must be split — a single SVG arc with coincident endpoints collapses.
+ */
+const TWO_PI = Math.PI * 2
+const EPS = 1e-6
+
+/**
+ * Build an SVG path for a pie wedge (`ri === 0`) or donut slice (`ri > 0`)
+ * spanning `sweep` radians clockwise from `a0` (0 = east, −π/2 = north).
+ */
+export function slicePath(
+	cx: number,
+	cy: number,
+	r: number,
+	ri: number,
+	a0: number,
+	sweep: number,
+): string {
+	if (sweep <= EPS || r <= 0) return ''
+
+	// Full circle / ring — two semicircle arcs (SVG can't draw 360° in one A).
+	if (sweep >= TWO_PI - EPS) {
+		if (ri <= 0) {
+			return `M ${cx + r} ${cy} A ${r} ${r} 0 1 1 ${cx - r} ${cy} A ${r} ${r} 0 1 1 ${cx + r} ${cy} Z`
+		}
+		return [
+			`M ${cx + r} ${cy}`,
+			`A ${r} ${r} 0 1 1 ${cx - r} ${cy}`,
+			`A ${r} ${r} 0 1 1 ${cx + r} ${cy}`,
+			`L ${cx + ri} ${cy}`,
+			`A ${ri} ${ri} 0 1 0 ${cx - ri} ${cy}`,
+			`A ${ri} ${ri} 0 1 0 ${cx + ri} ${cy}`,
+			'Z',
+		].join(' ')
+	}
+
+	const a1 = a0 + sweep
+	const large = sweep > Math.PI ? 1 : 0
+	const x0 = cx + r * Math.cos(a0)
+	const y0 = cy + r * Math.sin(a0)
+	const x1 = cx + r * Math.cos(a1)
+	const y1 = cy + r * Math.sin(a1)
+
+	if (ri > 0) {
+		const xi1 = cx + ri * Math.cos(a1)
+		const yi1 = cy + ri * Math.sin(a1)
+		const xi0 = cx + ri * Math.cos(a0)
+		const yi0 = cy + ri * Math.sin(a0)
+		return `M ${x0} ${y0} A ${r} ${r} 0 ${large} 1 ${x1} ${y1} L ${xi1} ${yi1} A ${ri} ${ri} 0 ${large} 0 ${xi0} ${yi0} Z`
+	}
+	return `M ${cx} ${cy} L ${x0} ${y0} A ${r} ${r} 0 ${large} 1 ${x1} ${y1} Z`
+}

package/src/components/charts/core/useChartTip.ts

@@ -0,0 +1,35 @@
+/**
+ * Shared tooltip anchoring helpers for charts.
+ *
+ * Two placement modes (match ChartTooltip `prefer`):
+ * - **follow** (`prefer="above"`): cursor-anchored — Donut, Map, Funnel
+ * - **pinned** (`prefer="top"`): top of chart, x follows mouse — Line, Bar
+ */
+import { computed, type Ref } from 'vue'
+
+/** Update tip coords from a mouse event relative to `currentTarget`. */
+export function trackLocalPointer(
+	e: MouseEvent,
+	tipX: Ref<number>,
+	tipY?: Ref<number>,
+) {
+	const el = e.currentTarget as HTMLElement | null
+	if (!el) return
+	const rect = el.getBoundingClientRect()
+	tipX.value = e.clientX - rect.left
+	if (tipY) tipY.value = e.clientY - rect.top
+}
+
+/** Cursor-follow style: `{ left, top }` for `prefer="above"|"below"`. */
+export function tipFollowStyle(tipX: Ref<number>, tipY: Ref<number>) {
+	return computed(() => ({ left: `${tipX.value}px`, top: `${tipY.value}px` }))
+}
+
+/** Pinned-to-top style: `{ left }` clamped inside the chart for `prefer="top"`. */
+export function tipPinnedStyle(tipX: Ref<number>, width: Ref<number>, half = 70) {
+	return computed(() => {
+		const w = width.value
+		const x = Math.min(Math.max(tipX.value, half), Math.max(half, w - half))
+		return { left: `${x}px` }
+	})
+}