@spatika/react 1.0.0 → 1.2.0

package/dist/composites/EventTimeline.js

@@ -0,0 +1,184 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useRef, useState } from "react";
+import { expandVisibleEvents } from "../lib/rrule";
+import { useControllableState } from "../lib/use-controllable-state";
+import { eventCanDrag, eventCanResize, eventColorStyle, formatMonthYear, getTimelineRange, layoutTimelineBars, normalizeEvents, occurrenceKey, resizeEvent, shiftByMs, shiftTimelineDate, toDate, visibleEvents, } from "../lib/scheduler";
+import { EventEditor } from "./EventEditor";
+import { EventResizeHandle, ResourceLegend, SchedulerShell, SchedulerToolbar, TIMELINE_SCALE_LABEL, } from "./scheduler-ui";
+import { DropdownMenuItem } from "../primitives/DropdownMenu";
+const LANE_HEIGHT = 28;
+const LANE_GAP = 4;
+const ROW_PAD = 10;
+function sourceEvent(events, id) {
+    return events.find((event) => event.id === id);
+}
+function draftFromSource(source) {
+    return {
+        id: source.id,
+        title: source.title,
+        start: toDate(source.start),
+        end: toDate(source.end),
+        allDay: source.allDay,
+        resourceId: source.resourceId,
+        color: source.color,
+        description: source.description,
+        rrule: source.rrule,
+    };
+}
+function timelineTitle(scale, date, rangeStart, rangeEnd, locale) {
+    if (scale === "hours") {
+        return new Intl.DateTimeFormat(locale, { weekday: "short", month: "short", day: "numeric" }).format(date);
+    }
+    if (scale === "years") {
+        return `${rangeStart.getFullYear()}–${rangeEnd.getFullYear() - 1}`;
+    }
+    if (scale === "months")
+        return String(date.getFullYear());
+    return formatMonthYear(date, locale);
+}
+/** Horizontal resource timeline — rows are resources, bars are allocations across time. */
+export function EventTimeline({ events = [], resources = [], scale: scaleProp, defaultScale = "months", onScaleChange, date: dateProp, defaultDate, onDateChange, scales = ["hours", "days", "weeks", "months", "years"], locale, readOnly = false, areEventsDraggable, areEventsResizable, onEventClick, onEventChange, onEventCreate, onEventDelete, className, }) {
+    const [scale, setScale] = useControllableState({
+        prop: scaleProp,
+        defaultProp: defaultScale,
+        onChange: onScaleChange,
+    });
+    const [date, setDate] = useControllableState({
+        prop: dateProp,
+        defaultProp: defaultDate ?? new Date(),
+        onChange: onDateChange,
+    });
+    const [hiddenIds, setHiddenIds] = useState(new Set());
+    const [draft, setDraft] = useState(null);
+    const dragRef = useRef(null);
+    const resolvedScale = scale ?? "months";
+    const resolvedDate = date ?? new Date();
+    const range = useMemo(() => getTimelineRange(resolvedDate, resolvedScale, locale), [resolvedDate, resolvedScale, locale]);
+    const canDrag = !readOnly && (areEventsDraggable ?? Boolean(onEventChange));
+    const canResize = !readOnly && (areEventsResizable ?? Boolean(onEventChange));
+    const editorLocked = readOnly || Boolean(draft?.id && sourceEvent(events, draft.id)?.readOnly);
+    const normalized = useMemo(() => {
+        const visible = visibleEvents(normalizeEvents(events, resources), hiddenIds);
+        return expandVisibleEvents(visible, range.start, range.end, events);
+    }, [events, resources, hiddenIds, range.start, range.end]);
+    const visibleResources = resources.filter((resource) => !hiddenIds.has(resource.id));
+    const rows = visibleResources.length > 0
+        ? visibleResources
+        : [{ id: "__all", title: "Events", color: "blue" }];
+    const title = timelineTitle(resolvedScale, resolvedDate, range.start, range.end, locale);
+    function toggleResource(id) {
+        setHiddenIds((prev) => {
+            const next = new Set(prev);
+            if (next.has(id))
+                next.delete(id);
+            else
+                next.add(id);
+            return next;
+        });
+    }
+    function openEvent(event) {
+        const source = sourceEvent(events, event.id);
+        if (source)
+            onEventClick?.(source);
+        setDraft(source ? draftFromSource(source) : {
+            id: event.id,
+            title: event.title,
+            start: event.start,
+            end: event.end,
+            allDay: event.allDay,
+            resourceId: event.resourceId,
+            color: event.color,
+            description: event.description,
+            rrule: event.rrule,
+        });
+    }
+    function handlePointerDown(event, pointer) {
+        if (!onEventChange || !eventCanDrag(event, { readOnly, enabled: canDrag }))
+            return;
+        pointer.currentTarget.setPointerCapture?.(pointer.pointerId);
+        dragRef.current = { id: event.id, x: pointer.clientX, active: false };
+    }
+    function handlePointerMove(pointer) {
+        const drag = dragRef.current;
+        if (!drag)
+            return;
+        if (Math.abs(pointer.clientX - drag.x) > 6)
+            drag.active = true;
+    }
+    function handlePointerUp(event, pointer) {
+        const drag = dragRef.current;
+        dragRef.current = null;
+        if (!drag?.active || !onEventChange)
+            return;
+        const grid = pointer.currentTarget.closest("[data-scheduler-grid]");
+        if (!grid)
+            return;
+        const rect = grid.getBoundingClientRect();
+        const rangeMs = range.end.getTime() - range.start.getTime();
+        const deltaPx = pointer.clientX - drag.x;
+        const deltaMs = (deltaPx / rect.width) * rangeMs;
+        const source = sourceEvent(events, event.id);
+        if (!source)
+            return;
+        const master = normalizeEvents([source], resources)[0];
+        onEventChange(source, shiftByMs(master, deltaMs));
+    }
+    function commitResize(event, edge, instant) {
+        if (!onEventChange)
+            return;
+        const next = resizeEvent(event, edge, instant);
+        const source = sourceEvent(events, event.id);
+        if (!source)
+            return;
+        const master = normalizeEvents([source], resources)[0];
+        onEventChange(source, {
+            start: new Date(master.start.getTime() + (next.start.getTime() - event.start.getTime())),
+            end: new Date(master.end.getTime() + (next.end.getTime() - event.end.getTime())),
+        });
+    }
+    function renderBar(event) {
+        const resizable = eventCanResize(event, { readOnly, enabled: canResize }) && Boolean(onEventChange);
+        const button = (_jsx("button", { type: "button", className: "flex h-6 w-full items-center truncate rounded-md px-2 text-left text-[11px] font-semibold shadow-sm", style: eventColorStyle(event.color, "bar"), onClick: () => {
+                if (dragRef.current?.active)
+                    return;
+                openEvent(event);
+            }, onPointerDown: (pointer) => handlePointerDown(event, pointer), onPointerMove: handlePointerMove, onPointerUp: (pointer) => handlePointerUp(event, pointer), children: event.title }));
+        if (!resizable)
+            return button;
+        return (_jsxs("div", { className: "relative h-full", children: [button, _jsx(EventResizeHandle, { event: event, edge: "start", axis: "ew", onCommit: commitResize }), _jsx(EventResizeHandle, { event: event, edge: "end", axis: "ew", onCommit: commitResize })] }));
+    }
+    return (_jsxs(SchedulerShell, { slot: "event-timeline", className: className, "aria-label": "Event timeline", children: [_jsx(SchedulerToolbar, { title: title, onPrev: () => setDate(shiftTimelineDate(resolvedDate, resolvedScale, -1)), onNext: () => setDate(shiftTimelineDate(resolvedDate, resolvedScale, 1)), onToday: () => setDate(new Date()), menuLabel: TIMELINE_SCALE_LABEL[resolvedScale], menu: scales.map((item) => (_jsx(DropdownMenuItem, { onClick: () => setScale(item), children: TIMELINE_SCALE_LABEL[item] }, item))) }), _jsx("div", { className: "overflow-x-auto", children: _jsx("div", { className: "min-w-[720px]", children: _jsxs("div", { className: "grid", style: { gridTemplateColumns: "11rem minmax(0, 1fr)" }, children: [_jsx("div", { className: "border-b border-r border-border/50 px-3 py-2 text-[10px] font-black uppercase tracking-widest text-muted-foreground", children: "Resource" }), _jsx("div", { className: "grid border-b border-border/50", style: { gridTemplateColumns: `repeat(${range.ticks.length}, minmax(0, 1fr))` }, children: range.ticks.map((tick) => (_jsx("div", { className: "border-l border-border/40 px-2 py-2 text-center text-xs font-bold text-foreground first:border-l-0", children: tick.label }, tick.date.toISOString()))) }), rows.map((resource) => {
+                                const rowEvents = resource.id === "__all"
+                                    ? normalized
+                                    : normalized.filter((event) => event.resourceId === resource.id);
+                                const bars = layoutTimelineBars(rowEvents, range.start, range.end);
+                                const laneCount = Math.max(1, ...bars.map((bar) => bar.lane + 1), 1);
+                                const height = ROW_PAD * 2 + laneCount * LANE_HEIGHT + (laneCount - 1) * LANE_GAP;
+                                const tone = resource.color ?? (rowEvents[0]?.color ?? "blue");
+                                return (_jsxs("div", { className: "contents", children: [_jsxs("div", { className: "flex items-center gap-2 border-b border-r border-border/40 px-3 py-2", style: { minHeight: height }, children: [_jsx("span", { className: "size-2.5 shrink-0 rounded-full", style: eventColorStyle(tone, "dot") }), _jsx("span", { className: "truncate text-sm font-semibold text-foreground", children: resource.title })] }), _jsx("div", { "data-scheduler-grid": true, "data-range-start": range.start.getTime(), "data-range-end": range.end.getTime(), className: "relative border-b border-border/40", style: {
+                                                minHeight: height,
+                                                backgroundImage: `repeating-linear-gradient(90deg, transparent, transparent calc(${100 / range.ticks.length}% - 1px), color-mix(in srgb, var(--border) 40%, transparent) calc(${100 / range.ticks.length}% - 1px), color-mix(in srgb, var(--border) 40%, transparent) ${100 / range.ticks.length}%)`,
+                                            }, children: bars.map((bar) => (_jsx("div", { className: "absolute", style: {
+                                                    top: ROW_PAD + bar.lane * (LANE_HEIGHT + LANE_GAP),
+                                                    left: `${bar.left}%`,
+                                                    width: `${bar.width}%`,
+                                                    height: LANE_HEIGHT,
+                                                }, children: renderBar(bar.event) }, occurrenceKey(bar.event)))) })] }, resource.id));
+                            })] }) }) }), _jsx(ResourceLegend, { resources: resources, hiddenIds: hiddenIds, onToggle: toggleResource }), _jsx(EventEditor, { open: draft != null, onOpenChange: (open) => {
+                    if (!open)
+                        setDraft(null);
+                }, draft: draft, resources: resources, readOnly: editorLocked, onSave: (event) => {
+                    if (event.id && sourceEvent(events, event.id)) {
+                        onEventChange?.(sourceEvent(events, event.id), event);
+                    }
+                    else {
+                        onEventCreate?.(event);
+                    }
+                }, onDelete: onEventDelete
+                    ? (id) => {
+                        const source = sourceEvent(events, id);
+                        if (source)
+                            onEventDelete(source);
+                    }
+                    : undefined })] }));
+}

package/dist/composites/FloatChip.d.ts

@@ -0,0 +1,15 @@
+import type { ReactNode } from "react";
+export type FloatChipProps = {
+    icon?: ReactNode;
+    title?: ReactNode;
+    subtitle?: ReactNode;
+    /** Compact live row (green pip + uppercase label) instead of title/subtitle. */
+    live?: boolean;
+    children?: ReactNode;
+    /** CSS float animation. */
+    float?: boolean;
+    className?: string;
+};
+/** Frosted floating fact chip used around a marketing hero portrait. */
+export declare function FloatChip({ icon, title, subtitle, live, children, float, className, }: FloatChipProps): import("react").JSX.Element;
+//# sourceMappingURL=FloatChip.d.ts.map

package/dist/composites/FloatChip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FloatChip.d.ts","sourceRoot":"","sources":["../../src/composites/FloatChip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,MAAM,MAAM,cAAc,GAAG;IAC3B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,gFAAgF;IAChF,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,2BAA2B;IAC3B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wEAAwE;AACxE,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,IAAY,EACZ,QAAQ,EACR,KAAa,EACb,SAAS,GACV,EAAE,cAAc,+BAqChB"}

package/dist/composites/FloatChip.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/cn";
+import { PresenceDot } from "./PresenceDot";
+/** Frosted floating fact chip used around a marketing hero portrait. */
+export function FloatChip({ icon, title, subtitle, live = false, children, float = false, className, }) {
+    return (_jsxs("div", { "data-slot": "float-chip", className: cn("inline-flex items-center gap-2.5 rounded-2xl border border-border bg-[color-mix(in_srgb,var(--background)_90%,transparent)] px-3 py-2.5 shadow-[0_12px_32px_rgba(0,0,0,0.12)] backdrop-blur-md", float && "spk-float", className), children: [icon ? (_jsx("div", { className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-primary/10 text-base", children: icon })) : null, live ? (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(PresenceDot, { tone: "success" }), _jsx("p", { className: "text-[11px] font-black uppercase leading-none tracking-widest text-[var(--accent-info)]", children: children ?? title })] })) : (_jsxs("div", { children: [title ? (_jsx("p", { className: "text-[12px] font-black uppercase leading-none tracking-wide text-foreground", children: title })) : null, subtitle ? (_jsx("p", { className: "mt-1 text-[10px] font-bold text-muted-foreground", children: subtitle })) : null, children] }))] }));
+}

package/dist/composites/GradientText.d.ts

@@ -0,0 +1,11 @@
+import type { ReactNode } from "react";
+export type GradientTextProps = {
+    children: ReactNode;
+    /** `static` clips a 3-stop theme gradient; `flow` animates it. */
+    variant?: "static" | "flow";
+    className?: string;
+    as?: "span" | "em" | "strong";
+};
+/** Theme-colored gradient type for wordmarks and display names. */
+export declare function GradientText({ children, variant, className, as: Tag, }: GradientTextProps): import("react").JSX.Element;
+//# sourceMappingURL=GradientText.d.ts.map

package/dist/composites/GradientText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GradientText.d.ts","sourceRoot":"","sources":["../../src/composites/GradientText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,MAAM,MAAM,iBAAiB,GAAG;IAC9B,QAAQ,EAAE,SAAS,CAAC;IACpB,kEAAkE;IAClE,OAAO,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,QAAQ,CAAC;CAC/B,CAAC;AAEF,mEAAmE;AACnE,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,OAAkB,EAClB,SAAS,EACT,EAAE,EAAE,GAAY,GACjB,EAAE,iBAAiB,+BAanB"}

package/dist/composites/GradientText.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "../lib/cn";
+/** Theme-colored gradient type for wordmarks and display names. */
+export function GradientText({ children, variant = "static", className, as: Tag = "span", }) {
+    return (_jsx(Tag, { "data-slot": "gradient-text", "data-variant": variant, className: cn(variant === "flow" ? "spk-gradient-text" : "spk-gradient-text-static", className), children: children }));
+}

package/dist/composites/IconTile.d.ts

@@ -0,0 +1,10 @@
+import type { ReactNode } from "react";
+export type IconTileProps = {
+    icon: ReactNode;
+    title: ReactNode;
+    description?: ReactNode;
+    className?: string;
+};
+/** Horizontal domain / feature tile: icon well + italic title + caption. */
+export declare function IconTile({ icon, title, description, className }: IconTileProps): import("react").JSX.Element;
+//# sourceMappingURL=IconTile.d.ts.map

package/dist/composites/IconTile.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconTile.d.ts","sourceRoot":"","sources":["../../src/composites/IconTile.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,MAAM,MAAM,aAAa,GAAG;IAC1B,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,4EAA4E;AAC5E,wBAAgB,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE,aAAa,+BAoB9E"}

package/dist/composites/IconTile.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/cn";
+import { Card } from "./Card";
+/** Horizontal domain / feature tile: icon well + italic title + caption. */
+export function IconTile({ icon, title, description, className }) {
+    return (_jsx("div", { "data-slot": "icon-tile", children: _jsxs(Card, { variant: "panel", padding: "md", className: cn("group flex items-center gap-5 p-5", className), children: [_jsx("div", { className: "flex h-14 w-14 shrink-0 items-center justify-center rounded-2xl border border-border bg-secondary text-3xl", children: icon }), _jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "text-[16px] font-[900] italic text-foreground", children: title }), description ? (_jsx("p", { className: "mt-0.5 text-[12px] font-bold text-muted-foreground", children: description })) : null] })] }) }));
+}

package/dist/composites/MapChart.d.ts

@@ -0,0 +1,24 @@
+import { type ChartMargin } from "../lib/charts";
+import { type GeoJsonFeatureCollection, type GeoProjectionKind } from "../lib/geo";
+export type MapShapeDatum = {
+    id: string | number;
+    value: number;
+    label?: string;
+    color?: string;
+};
+export type MapChartProps = {
+    geoData: GeoJsonFeatureCollection;
+    series?: Array<{
+        data: MapShapeDatum[];
+    }>;
+    idProperty?: string;
+    projection?: GeoProjectionKind;
+    height?: number;
+    width?: number;
+    colors?: string[];
+    hideLegend?: boolean;
+    margin?: ChartMargin;
+    className?: string;
+};
+export declare function MapChart({ geoData, series, idProperty, projection, height, width, colors, hideLegend, margin, className, }: MapChartProps): import("react").JSX.Element;
+//# sourceMappingURL=MapChart.d.ts.map

package/dist/composites/MapChart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MapChart.d.ts","sourceRoot":"","sources":["../../src/composites/MapChart.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiC,KAAK,WAAW,EAAE,MAAM,eAAe,CAAC;AAChF,OAAO,EAIL,KAAK,wBAAwB,EAC7B,KAAK,iBAAiB,EACvB,MAAM,YAAY,CAAC;AAGpB,MAAM,MAAM,aAAa,GAAG;IAC1B,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,OAAO,EAAE,wBAAwB,CAAC;IAClC,MAAM,CAAC,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,aAAa,EAAE,CAAA;KAAE,CAAC,CAAC;IAC1C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,QAAQ,CAAC,EACvB,OAAO,EACP,MAAM,EACN,UAAiB,EACjB,UAAuB,EACvB,MAAY,EACZ,KAAK,EACL,MAAM,EACN,UAAU,EACV,MAAM,EACN,SAAS,GACV,EAAE,aAAa,+BA2Ef"}

package/dist/composites/MapChart.js

@@ -0,0 +1,58 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { chartColor, formatChartNumber } from "../lib/charts";
+import { featureId, fitFeatures, geoPath, } from "../lib/geo";
+import { ChartFrame, useChartHover } from "./chart-ui";
+export function MapChart({ geoData, series, idProperty = "id", projection = "mercator", height = 280, width, colors, hideLegend, margin, className, }) {
+    const features = geoData.features ?? [];
+    const data = series?.[0]?.data ?? [];
+    const byId = new Map(data.map((item) => [String(item.id), item]));
+    const values = data.map((item) => item.value);
+    const min = values.length ? Math.min(...values) : 0;
+    const max = values.length ? Math.max(...values) : 1;
+    const { hover, setHover, clear } = useChartHover();
+    const legend = hideLegend
+        ? undefined
+        : data.slice(0, 8).map((item, i) => ({
+            id: String(item.id),
+            label: item.label ?? String(item.id),
+            color: item.color ?? choroplethFill(item.value, min, max, i, colors),
+        }));
+    return (_jsx(ChartFrame, { slot: "map-chart", className: className, width: width, height: height, margin: margin ?? { top: 8, right: 8, bottom: 8, left: 8 }, legend: legend, hover: hover, "aria-label": "Map chart", children: ({ width: w, height: h, m }) => {
+            const pad = Math.min(m.left, m.right, m.top, m.bottom);
+            const project = fitFeatures(features, w, h, pad, projection);
+            return (_jsx("svg", { width: w, height: h, viewBox: `0 0 ${w} ${h}`, children: features.map((feature, i) => {
+                    if (!feature.geometry)
+                        return null;
+                    const id = featureId(feature, idProperty) || String(i);
+                    const datum = byId.get(id);
+                    const label = datum?.label ??
+                        (feature.properties?.name != null ? String(feature.properties.name) : id);
+                    const fill = datum
+                        ? (datum.color ?? choroplethFill(datum.value, min, max, i, colors))
+                        : "color-mix(in srgb, var(--muted) 55%, transparent)";
+                    const d = geoPath(feature.geometry, project);
+                    if (!d)
+                        return null;
+                    return (_jsx("path", { d: d, fill: fill, className: "spk-chart-map-region spk-chart-mark", onMouseEnter: (event) => setHover({
+                            x: event.nativeEvent.offsetX,
+                            y: event.nativeEvent.offsetY,
+                            title: label,
+                            items: datum
+                                ? [
+                                    {
+                                        color: fill,
+                                        label: label,
+                                        value: formatChartNumber(datum.value),
+                                    },
+                                ]
+                                : [{ color: fill, label: label, value: "—" }],
+                        }), onMouseLeave: clear }, id));
+                }) }));
+        } }));
+}
+function choroplethFill(value, min, max, index, colors) {
+    const t = max === min ? 0.6 : (value - min) / (max - min);
+    const base = chartColor(index, colors);
+    const mix = Math.round(28 + t * 72);
+    return `color-mix(in srgb, ${base} ${mix}%, var(--muted))`;
+}

package/dist/composites/MetaChip.d.ts

@@ -0,0 +1,9 @@
+import type { ReactNode } from "react";
+export type MetaChipProps = {
+    icon?: ReactNode;
+    children: ReactNode;
+    className?: string;
+};
+/** Compact “powered by” chip: icon + label with a quiet ring. */
+export declare function MetaChip({ icon, children, className }: MetaChipProps): import("react").JSX.Element;
+//# sourceMappingURL=MetaChip.d.ts.map

package/dist/composites/MetaChip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MetaChip.d.ts","sourceRoot":"","sources":["../../src/composites/MetaChip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,MAAM,MAAM,aAAa,GAAG;IAC1B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,iEAAiE;AACjE,wBAAgB,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,aAAa,+BAapE"}

package/dist/composites/MetaChip.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/cn";
+/** Compact “powered by” chip: icon + label with a quiet ring. */
+export function MetaChip({ icon, children, className }) {
+    return (_jsxs("span", { "data-slot": "meta-chip", className: cn("inline-flex items-center gap-1.5 rounded-lg bg-secondary px-2.5 py-1.5 text-[11px] font-medium text-muted-foreground ring-1 ring-border/80", className), children: [icon ? _jsx("span", { className: "inline-flex h-4 w-4 shrink-0 items-center justify-center opacity-90", children: icon }) : null, children] }));
+}

package/dist/composites/PresenceDot.d.ts

@@ -0,0 +1,10 @@
+export type PresenceDotProps = {
+    tone?: "primary" | "success";
+    /** Dual-span scale ping. Defaults to true. */
+    ping?: boolean;
+    className?: string;
+    label?: string;
+};
+/** Live status pip with optional ping halo (availability badges, hero chips). */
+export declare function PresenceDot({ tone, ping, className, label, }: PresenceDotProps): import("react").JSX.Element;
+//# sourceMappingURL=PresenceDot.d.ts.map

package/dist/composites/PresenceDot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PresenceDot.d.ts","sourceRoot":"","sources":["../../src/composites/PresenceDot.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAC7B,8CAA8C;IAC9C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAOF,iFAAiF;AACjF,wBAAgB,WAAW,CAAC,EAC1B,IAAgB,EAChB,IAAW,EACX,SAAS,EACT,KAAK,GACN,EAAE,gBAAgB,+BAoBlB"}

package/dist/composites/PresenceDot.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/cn";
+const toneClass = {
+    primary: "bg-primary",
+    success: "bg-[var(--accent-info)]",
+};
+/** Live status pip with optional ping halo (availability badges, hero chips). */
+export function PresenceDot({ tone = "primary", ping = true, className, label, }) {
+    return (_jsxs("span", { "data-slot": "presence-dot", role: label ? "img" : undefined, "aria-label": label, className: cn("relative flex h-2 w-2", className), children: [ping ? (_jsx("span", { className: cn("absolute inline-flex h-full w-full animate-ping rounded-full opacity-75", toneClass[tone]), "aria-hidden": true })) : null, _jsx("span", { className: cn("relative inline-flex h-2 w-2 rounded-full", toneClass[tone]) })] }));
+}

package/dist/composites/ProfileHero.d.ts

@@ -24,11 +24,13 @@ export type ProfileHeroProps = {
     coverKind?: CoverPatternKind | null;
     dark?: boolean;
     warm?: boolean;
+    /** When false, keep the cover inside this frame (catalog previews). */
+    bleed?: boolean;
 };
 /**
- * Profile / entity hero: cover bleeds into app chrome, overlapping avatar
- * notches the frosted identity plate. Stacked in a narrow column; left-notched
- * once the plate is wide enough (container query, not viewport).
+ * Profile / entity hero: cover fills the frame, overlapping avatar notches
+ * the frosted identity plate. Stacked in a narrow column; left-notched once
+ * the plate is wide enough (container query, not viewport).
  */
-export declare function ProfileHero({ name, alias, coverUrl, avatarUrl, hideImages, statusBadges, metaLines, stats, tags, topLeading, topActions, avatarAccessory, onAvatarClick, className, coverClassName, identityClassName, children, coverSeed, coverHue, coverKind, dark, warm, }: ProfileHeroProps): import("react").JSX.Element;
+export declare function ProfileHero({ name, alias, coverUrl, avatarUrl, hideImages, statusBadges, metaLines, stats, tags, topLeading, topActions, avatarAccessory, onAvatarClick, className, coverClassName, identityClassName, children, coverSeed, coverHue, coverKind, dark, warm, bleed, }: ProfileHeroProps): import("react").JSX.Element;
 //# sourceMappingURL=ProfileHero.d.ts.map

package/dist/composites/ProfileHero.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProfileHero.d.ts","sourceRoot":"","sources":["../../src/composites/ProfileHero.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQvC,OAAO,EAAmB,KAAK,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAG9E,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACpC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,SAAS,EACT,UAAU,EACV,YAAY,EACZ,SAAS,EACT,KAAK,EACL,IAAI,EACJ,UAAU,EACV,UAAU,EACV,eAAe,EACf,aAAa,EACb,SAAS,EACT,cAAc,EACd,iBAAiB,EACjB,QAAQ,EACR,SAAS,EACT,QAAc,EACd,SAAS,EACT,IAAI,EACJ,IAAI,GACL,EAAE,gBAAgB,+BAiGlB"}
+{"version":3,"file":"ProfileHero.d.ts","sourceRoot":"","sources":["../../src/composites/ProfileHero.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQvC,OAAO,EAAmB,KAAK,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAG9E,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACpC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,uEAAuE;IACvE,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,SAAS,EACT,UAAU,EACV,YAAY,EACZ,SAAS,EACT,KAAK,EACL,IAAI,EACJ,UAAU,EACV,UAAU,EACV,eAAe,EACf,aAAa,EACb,SAAS,EACT,cAAc,EACd,iBAAiB,EACjB,QAAQ,EACR,SAAS,EACT,QAAc,EACd,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,KAAY,GACb,EAAE,gBAAgB,+BA+GlB"}

package/dist/composites/ProfileHero.js

@@ -5,17 +5,17 @@ import { coverMutedClass, coverPlateClass, coverTitleClass, } from "../lib/cover
 import { getCoverPattern } from "../lib/cover-pattern";
 import { CoverPattern } from "./CoverPattern";
 /**
- * Profile / entity hero: cover bleeds into app chrome, overlapping avatar
- * notches the frosted identity plate. Stacked in a narrow column; left-notched
- * once the plate is wide enough (container query, not viewport).
+ * Profile / entity hero: cover fills the frame, overlapping avatar notches
+ * the frosted identity plate. Stacked in a narrow column; left-notched once
+ * the plate is wide enough (container query, not viewport).
  */
-export function ProfileHero({ name, alias, coverUrl, avatarUrl, hideImages, statusBadges, metaLines, stats, tags, topLeading, topActions, avatarAccessory, onAvatarClick, className, coverClassName, identityClassName, children, coverSeed, coverHue = 210, coverKind, dark, warm, }) {
+export function ProfileHero({ name, alias, coverUrl, avatarUrl, hideImages, statusBadges, metaLines, stats, tags, topLeading, topActions, avatarAccessory, onAvatarClick, className, coverClassName, identityClassName, children, coverSeed, coverHue = 210, coverKind, dark, warm, bleed = true, }) {
     const initials = getInitials(name);
     const seed = coverSeed ?? name;
     const scene = getCoverPattern({ seed, hue: coverHue, dark, warm, kind: coverKind });
     const ink = scene.headerInk;
-    return (_jsxs("div", { "data-slot": "profile-hero", className: cn("relative overflow-visible", className), children: [_jsxs("div", { className: cn("relative min-h-[9rem] overflow-hidden sm:min-h-[12rem] lg:min-h-[13rem]", coverClassName), children: [_jsxs("div", { className: "cover-media cover-media--profile sm:rounded-b-[2rem]", "aria-hidden": true, children: [!hideImages && coverUrl ? (_jsx("img", { src: coverUrl, alt: "", className: "absolute inset-0 size-full object-cover" })) : (_jsx(CoverPattern, { seed: seed, hue: coverHue, dark: dark, warm: warm, kind: coverKind })), _jsx("div", { className: "absolute inset-x-0 top-0 h-8 bg-gradient-to-b from-black/[0.04] to-transparent dark:from-black/12" }), _jsx("div", { className: "absolute inset-x-0 bottom-0 h-[22%] bg-gradient-to-t from-black/[0.03] via-transparent to-transparent dark:from-black/10" })] }), _jsxs("div", { className: "relative z-10 flex min-h-[9rem] items-start justify-between gap-2 p-3 sm:min-h-[12rem] sm:p-4 lg:min-h-[13rem]", children: [_jsx("div", { children: topLeading }), topActions ? (_jsx("div", { "data-cover-ink": ink, className: "cover-floating-shell flex items-center gap-1 p-1", children: topActions })) : null] })] }), _jsx("div", { className: "relative z-10 px-3 pb-4 sm:px-4 sm:pb-5 lg:px-8", children: _jsxs("div", { className: cn("profile-identity", identityClassName), children: [_jsx("div", { "aria-hidden": true, className: cn("pointer-events-none absolute inset-0 rounded-[1.35rem] profile-identity__plate", coverPlateClass(ink)) }), _jsxs("div", { className: "profile-identity__body", children: [_jsxs("button", { type: "button", disabled: !onAvatarClick, onClick: onAvatarClick, "aria-label": name, className: "profile-identity__avatar", children: [_jsx("span", { className: "flex items-center justify-center overflow-hidden rounded-full border-[3px] border-white bg-muted text-lg font-black leading-none text-primary shadow-[0_16px_40px_rgba(0,0,0,0.38)] dark:border-white/30", style: {
-                                                width: "var(--profile-avatar-size)",
-                                                height: "var(--profile-avatar-size)",
-                                            }, children: !hideImages && avatarUrl ? (_jsx("img", { src: avatarUrl, alt: "", className: "size-full object-cover" })) : (initials) }), avatarAccessory] }), _jsxs("div", { className: "profile-identity__copy", children: [_jsxs("div", { className: "profile-identity__heading", children: [_jsx("h1", { className: cn("truncate text-[1.15rem] font-black leading-tight tracking-tight sm:text-2xl", coverTitleClass(ink)), children: name }), statusBadges] }), alias ? (_jsx("p", { className: cn("mt-0.5 truncate text-sm font-medium", coverMutedClass(ink)), children: alias })) : null, metaLines ? (_jsx("div", { className: cn("mt-2 space-y-1 text-sm", coverMutedClass(ink)), children: metaLines })) : null, stats ? _jsx("div", { className: "mt-3", children: stats }) : null, tags ? _jsx("div", { className: "profile-identity__tags", children: tags }) : null] })] }), children ? _jsx("div", { className: "relative z-10 px-3 pb-3 sm:px-6", children: children }) : null] }) })] }));
+    return (_jsxs("div", { "data-slot": "profile-hero", "data-cover-bleed": bleed ? "true" : undefined, className: cn("relative w-full", bleed ? "overflow-visible" : "overflow-hidden rounded-[1.35rem] sm:rounded-[1.75rem]", className), children: [_jsxs("div", { className: cn("cover-media cover-media--profile", bleed && "sm:rounded-b-[2rem]"), "aria-hidden": true, children: [!hideImages && coverUrl ? (_jsx("img", { src: coverUrl, alt: "", className: "absolute inset-0 size-full object-cover" })) : (_jsx(CoverPattern, { seed: seed, hue: coverHue, dark: dark, warm: warm, kind: coverKind })), _jsx("div", { className: "absolute inset-x-0 top-0 h-8 bg-gradient-to-b from-black/[0.04] to-transparent dark:from-black/12" }), _jsx("div", { className: "absolute inset-x-0 bottom-0 h-[22%] bg-gradient-to-t from-black/[0.03] via-transparent to-transparent dark:from-black/10" })] }), _jsxs("div", { className: "relative z-10 flex flex-col", children: [_jsx("div", { className: cn("relative min-h-[8.5rem] sm:min-h-[11rem] lg:min-h-[12rem]", coverClassName), children: _jsxs("div", { className: "absolute inset-x-0 top-0 z-30 flex items-start justify-between gap-2 p-3 sm:p-4", children: [_jsx("div", { children: topLeading }), topActions ? (_jsx("div", { "data-cover-ink": ink, className: "cover-floating-shell flex items-center gap-1 p-1", children: topActions })) : null] }) }), _jsx("div", { className: "relative z-20 px-3 pb-4 sm:px-4 sm:pb-5 lg:px-6", children: _jsxs("div", { className: cn("profile-identity", identityClassName), children: [_jsx("div", { "aria-hidden": true, className: cn("pointer-events-none absolute inset-0 rounded-[1.35rem] profile-identity__plate", coverPlateClass(ink)) }), _jsxs("div", { className: "profile-identity__body", children: [_jsxs("button", { type: "button", disabled: !onAvatarClick, onClick: onAvatarClick, "aria-label": name, className: "profile-identity__avatar", children: [_jsx("span", { className: "flex items-center justify-center overflow-hidden rounded-full border-[3px] border-white bg-muted text-lg font-black leading-none text-primary shadow-[0_16px_40px_rgba(0,0,0,0.38)] dark:border-white/30", style: {
+                                                        width: "var(--profile-avatar-size)",
+                                                        height: "var(--profile-avatar-size)",
+                                                    }, children: !hideImages && avatarUrl ? (_jsx("img", { src: avatarUrl, alt: "", className: "size-full object-cover" })) : (initials) }), avatarAccessory] }), _jsxs("div", { className: "profile-identity__copy", children: [_jsxs("div", { className: "profile-identity__heading", children: [_jsx("h1", { className: cn("truncate text-[1.15rem] font-black leading-tight tracking-tight sm:text-2xl", coverTitleClass(ink)), children: name }), statusBadges] }), alias ? (_jsx("p", { className: cn("mt-0.5 truncate text-sm font-medium", coverMutedClass(ink)), children: alias })) : null, metaLines ? (_jsx("div", { className: cn("mt-2 space-y-1 text-sm", coverMutedClass(ink)), children: metaLines })) : null, stats ? _jsx("div", { className: "mt-3", children: stats }) : null, tags ? _jsx("div", { className: "profile-identity__tags", children: tags }) : null] })] }), children ? _jsx("div", { className: "relative z-10 px-3 pb-3 sm:px-6", children: children }) : null] }) })] })] }));
 }

package/dist/composites/ProjectCard.d.ts

@@ -0,0 +1,12 @@
+import type { ReactNode } from "react";
+export type ProjectCardProps = {
+    title: ReactNode;
+    company?: ReactNode;
+    outcome?: ReactNode;
+    description?: ReactNode;
+    tags?: string[];
+    className?: string;
+};
+/** Marketing project tile: title, company, outcome pill, body, tech tags. */
+export declare function ProjectCard({ title, company, outcome, description, tags, className, }: ProjectCardProps): import("react").JSX.Element;
+//# sourceMappingURL=ProjectCard.d.ts.map

package/dist/composites/ProjectCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProjectCard.d.ts","sourceRoot":"","sources":["../../src/composites/ProjectCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvC,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,SAAS,CAAC;IACjB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,6EAA6E;AAC7E,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,OAAO,EACP,OAAO,EACP,WAAW,EACX,IAAS,EACT,SAAS,GACV,EAAE,gBAAgB,+BAyClB"}

package/dist/composites/ProjectCard.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/cn";
+import { Badge } from "../primitives/Badge";
+import { Card, CardContent, CardHeader, CardTitle } from "./Card";
+import { Tag } from "./Tag";
+/** Marketing project tile: title, company, outcome pill, body, tech tags. */
+export function ProjectCard({ title, company, outcome, description, tags = [], className, }) {
+    return (_jsxs(Card, { variant: "panel", padding: "md", className: cn("group flex h-full flex-col hover:border-primary/30 hover:shadow-[0_12px_32px_color-mix(in_srgb,var(--primary)_7%,transparent)]", className), children: [_jsxs(CardHeader, { className: "mb-2", children: [_jsxs("div", { className: "min-w-0", children: [_jsx(CardTitle, { className: "text-[15px] leading-snug font-[900] group-hover:text-primary sm:text-[16px]", children: title }), company ? (_jsx("p", { className: "mt-0.5 text-[11px] font-bold tracking-wider text-muted-foreground uppercase", children: company })) : null] }), outcome ? (_jsx(Badge, { variant: "warm", className: "rounded-full px-2.5 py-1 text-[10px] font-black", children: outcome })) : null] }), _jsxs(CardContent, { className: "flex flex-1 flex-col", children: [description ? (_jsx("p", { className: "mb-3 flex-1 text-[13px] leading-relaxed text-muted-foreground", children: description })) : null, tags.length > 0 ? (_jsx("div", { className: "flex flex-wrap gap-1.5", children: tags.map((tag) => (_jsx(Tag, { children: tag }, tag))) })) : null] })] }));
+}

package/dist/composites/ScatterWebGL.d.ts

@@ -0,0 +1,22 @@
+import type { ChartLegendItem } from "./chart-ui";
+type ScatterSeriesLike = {
+    data: Array<{
+        x: number;
+        y: number;
+        z?: number;
+    }>;
+};
+export declare function ScatterWebGLLayer({ width, height, series, meta, hidden, xAt, yAt, sizeAt, bubble, onUnavailable, }: {
+    width: number;
+    height: number;
+    series: ScatterSeriesLike[];
+    meta: ChartLegendItem[];
+    hidden: Set<string>;
+    xAt: (value: number) => number;
+    yAt: (value: number) => number;
+    sizeAt: (z: number) => number;
+    bubble: boolean;
+    onUnavailable?: () => void;
+}): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=ScatterWebGL.d.ts.map

package/dist/composites/ScatterWebGL.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScatterWebGL.d.ts","sourceRoot":"","sources":["../../src/composites/ScatterWebGL.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAElD,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,KAAK,CAAC;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CACnD,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,MAAM,EACN,MAAM,EACN,IAAI,EACJ,MAAM,EACN,GAAG,EACH,GAAG,EACH,MAAM,EACN,MAAM,EACN,aAAa,GACd,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,iBAAiB,EAAE,CAAC;IAC5B,IAAI,EAAE,eAAe,EAAE,CAAC;IACxB,MAAM,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IACpB,GAAG,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC/B,GAAG,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC/B,MAAM,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IAC9B,MAAM,EAAE,OAAO,CAAC;IAChB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B,+BAgDA"}

package/dist/composites/ScatterWebGL.js

@@ -0,0 +1,45 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useRef } from "react";
+import { createScatterGL, destroyScatterGL, drawScatterGL } from "../lib/webgl-scatter";
+export function ScatterWebGLLayer({ width, height, series, meta, hidden, xAt, yAt, sizeAt, bubble, onUnavailable, }) {
+    const canvasRef = useRef(null);
+    const gpuRef = useRef(null);
+    useEffect(() => {
+        const canvas = canvasRef.current;
+        if (!canvas)
+            return;
+        const gpu = createScatterGL(canvas);
+        if (!gpu) {
+            onUnavailable?.();
+            return;
+        }
+        gpuRef.current = gpu;
+        return () => {
+            destroyScatterGL(gpu);
+            gpuRef.current = null;
+        };
+    }, [onUnavailable]);
+    useEffect(() => {
+        const gpu = gpuRef.current;
+        const canvas = canvasRef.current;
+        if (!gpu || !canvas)
+            return;
+        const batches = series.flatMap((item, s) => {
+            const info = meta[s];
+            if (hidden.has(info.id))
+                return [];
+            return [
+                {
+                    color: info.color,
+                    positions: item.data.map((point) => ({
+                        x: xAt(point.x),
+                        y: yAt(point.y),
+                        size: bubble ? sizeAt(point.z ?? 1) * 2 : 9,
+                    })),
+                },
+            ];
+        });
+        drawScatterGL(gpu, canvas, width, height, batches);
+    });
+    return (_jsx("canvas", { ref: canvasRef, className: "spk-chart-webgl", "data-slot": "scatter-webgl", "aria-hidden": true }));
+}

package/dist/composites/SectionHeading.d.ts

@@ -0,0 +1,16 @@
+import type { ReactNode } from "react";
+export type SectionHeadingProps = {
+    eyebrow?: ReactNode;
+    title: ReactNode;
+    subtitle?: ReactNode;
+    align?: "left" | "center";
+    className?: string;
+    /** Hide the accent rule under the copy. */
+    showRule?: boolean;
+};
+/**
+ * Marketing / page-section title: optional eyebrow, heading, subtitle, and accent rule.
+ * Renders a `div` (not `<header>`) so it never competes with the site navbar.
+ */
+export declare function SectionHeading({ eyebrow, title, subtitle, align, className, showRule, }: SectionHeadingProps): import("react").JSX.Element;
+//# sourceMappingURL=SectionHeading.d.ts.map

package/dist/composites/SectionHeading.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SectionHeading.d.ts","sourceRoot":"","sources":["../../src/composites/SectionHeading.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvC,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF;;;GAGG;AACH,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,KAAK,EACL,QAAQ,EACR,KAAc,EACd,SAAS,EACT,QAAe,GAChB,EAAE,mBAAmB,+BAkCrB"}

package/dist/composites/SectionHeading.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/cn";
+import { AccentRule } from "./AccentRule";
+import { GradientText } from "./GradientText";
+/**
+ * Marketing / page-section title: optional eyebrow, heading, subtitle, and accent rule.
+ * Renders a `div` (not `<header>`) so it never competes with the site navbar.
+ */
+export function SectionHeading({ eyebrow, title, subtitle, align = "left", className, showRule = true, }) {
+    const centered = align === "center";
+    return (_jsxs("div", { "data-slot": "section-heading", className: cn("mb-8 sm:mb-10", centered && "text-center", className), children: [eyebrow ? (_jsx("p", { className: cn("mb-2 text-[11px] font-bold uppercase tracking-[0.14em]", centered && "text-center"), children: _jsx(GradientText, { children: eyebrow }) })) : null, _jsx("h2", { className: "text-[clamp(1.6rem,3.6vw,2.1rem)] font-[800] leading-[1.12] tracking-tight text-foreground", children: title }), subtitle ? (_jsx("p", { className: cn("mt-2 text-[14px] leading-relaxed text-muted-foreground", centered ? "mx-auto max-w-xl" : "max-w-lg"), children: subtitle })) : null, showRule ? _jsx(AccentRule, { className: cn("mt-4", centered && "mx-auto") }) : null] }));
+}