@pyric/ui 0.1.0-alpha.7

package/dist/traffic/components/TrafficLog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrafficLog.js","sourceRoot":"","sources":["../../../src/traffic/components/TrafficLog.tsx"],"names":[],"mappings":"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"}

package/dist/traffic/components/TrafficMetricCards.d.ts

@@ -0,0 +1,26 @@
+import type { MetricSeries } from '../hooks/useTrafficMetrics.js';
+export interface TrafficMetricCardsProps {
+    series: readonly MetricSeries[];
+    /** When supplied (with `onToggle`), each card gets a checkbox and
+     *  doubles as the chart's legend — Console reference semantics
+     *  ("toggle series visibility"). Omit for a read-only totals strip. */
+    visible?: ReadonlySet<string>;
+    onToggle?: (key: string) => void;
+    formatValue?: (n: number) => string;
+    className?: string;
+}
+/**
+ * The period-total strip: one card per series, each showing the series'
+ * total for the current window. Doubles as BOTH the chart's legend row
+ * (pass `visible` + `onToggle` to get the checkbox-toggle semantics) AND
+ * the standalone fallback presentation when a chart isn't warranted —
+ * this component never depends on {@link TrafficLineChart}.
+ *
+ * Styling hooks: `[data-pyric-ui="traffic-metric-cards"]`,
+ * `[data-pyric-metric-card]` (with `data-pyric-metric-key`,
+ * `data-pyric-series-index` — the color channel a chart's lines also
+ * key off of, so a card and its line always match), `[data-pyric-metric-hidden]`
+ * when toggled off.
+ */
+export declare function TrafficMetricCards({ series, visible, onToggle, formatValue, className, }: TrafficMetricCardsProps): import("react").JSX.Element;
+//# sourceMappingURL=TrafficMetricCards.d.ts.map

package/dist/traffic/components/TrafficMetricCards.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrafficMetricCards.d.ts","sourceRoot":"","sources":["../../../src/traffic/components/TrafficMetricCards.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAElE,MAAM,WAAW,uBAAuB;IACtC,MAAM,EAAE,SAAS,YAAY,EAAE,CAAC;IAChC;;2EAEuE;IACvE,OAAO,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC9B,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAID;;;;;;;;;;;;GAYG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,MAAM,EACN,OAAO,EACP,QAAQ,EACR,WAAgC,EAChC,SAAS,GACV,EAAE,uBAAuB,+BA0CzB"}

package/dist/traffic/components/TrafficMetricCards.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+const defaultFormatValue = (n) => String(n);
+/**
+ * The period-total strip: one card per series, each showing the series'
+ * total for the current window. Doubles as BOTH the chart's legend row
+ * (pass `visible` + `onToggle` to get the checkbox-toggle semantics) AND
+ * the standalone fallback presentation when a chart isn't warranted —
+ * this component never depends on {@link TrafficLineChart}.
+ *
+ * Styling hooks: `[data-pyric-ui="traffic-metric-cards"]`,
+ * `[data-pyric-metric-card]` (with `data-pyric-metric-key`,
+ * `data-pyric-series-index` — the color channel a chart's lines also
+ * key off of, so a card and its line always match), `[data-pyric-metric-hidden]`
+ * when toggled off.
+ */
+export function TrafficMetricCards({ series, visible, onToggle, formatValue = defaultFormatValue, className, }) {
+    const toggleable = visible !== undefined && onToggle !== undefined;
+    return (_jsx("div", { className: className, "data-pyric-ui": "traffic-metric-cards", role: toggleable ? 'group' : undefined, children: series.map((s, index) => {
+            const isVisible = visible ? visible.has(s.key) : true;
+            const card = (_jsxs(_Fragment, { children: [_jsx("span", { "data-pyric-metric-swatch": "", "aria-hidden": "true" }), _jsx("span", { "data-pyric-metric-label": "", children: s.label }), _jsx("span", { "data-pyric-metric-value": "", children: formatValue(s.total) })] }));
+            return toggleable ? (_jsxs("label", { "data-pyric-metric-card": "", "data-pyric-metric-key": s.key, "data-pyric-series-index": index, "data-pyric-metric-hidden": isVisible ? undefined : '', children: [_jsx("input", { type: "checkbox", checked: isVisible, onChange: () => onToggle(s.key), "data-pyric-metric-checkbox": "" }), card] }, s.key)) : (_jsx("span", { "data-pyric-metric-card": "", "data-pyric-metric-key": s.key, "data-pyric-series-index": index, children: card }, s.key));
+        }) }));
+}
+//# sourceMappingURL=TrafficMetricCards.js.map

package/dist/traffic/components/TrafficMetricCards.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrafficMetricCards.js","sourceRoot":"","sources":["../../../src/traffic/components/TrafficMetricCards.tsx"],"names":[],"mappings":";AAaA,MAAM,kBAAkB,GAAG,CAAC,CAAS,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;AAEpD;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,kBAAkB,CAAC,EACjC,MAAM,EACN,OAAO,EACP,QAAQ,EACR,WAAW,GAAG,kBAAkB,EAChC,SAAS,GACe;IACxB,MAAM,UAAU,GAAG,OAAO,KAAK,SAAS,IAAI,QAAQ,KAAK,SAAS,CAAC;IACnE,OAAO,CACL,cAAK,SAAS,EAAE,SAAS,mBAAgB,sBAAsB,EAAC,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,YACnG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE;YACvB,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;YACtD,MAAM,IAAI,GAAG,CACX,8BACE,2CAA+B,EAAE,iBAAa,MAAM,GAAG,EACvD,0CAA8B,EAAE,YAAE,CAAC,CAAC,KAAK,GAAQ,EACjD,0CAA8B,EAAE,YAAE,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,GAAQ,IAC7D,CACJ,CAAC;YACF,OAAO,UAAU,CAAC,CAAC,CAAC,CAClB,2CAEyB,EAAE,2BACF,CAAC,CAAC,GAAG,6BACH,KAAK,8BACJ,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,aAEpD,gBACE,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,SAAS,EAClB,QAAQ,EAAE,GAAG,EAAE,CAAC,QAAS,CAAC,CAAC,CAAC,GAAG,CAAC,gCACL,EAAE,GAC7B,EACD,IAAI,KAZA,CAAC,CAAC,GAAG,CAaJ,CACT,CAAC,CAAC,CAAC,CACF,yCAEyB,EAAE,2BACF,CAAC,CAAC,GAAG,6BACH,KAAK,YAE7B,IAAI,IALA,CAAC,CAAC,GAAG,CAML,CACR,CAAC;QACJ,CAAC,CAAC,GACE,CACP,CAAC;AACJ,CAAC"}

package/dist/traffic/components/TrafficRow.d.ts

@@ -0,0 +1,40 @@
+import type { ReactNode } from 'react';
+import type { TrafficEvent } from '../types.js';
+export interface TrafficRowProps {
+    event: TrafficEvent;
+    /** Marks the row as the active selection (`data-pyric-selected`). */
+    selected?: boolean;
+    onSelect?: (event: TrafficEvent) => void;
+    /**
+     * Render-prop slot for a consumer-specific classification badge —
+     * e.g. the playground's `expected`/`ambiguous`/`unexpected`
+     * verdict, which is app-source analysis the library doesn't own.
+     * Returns `null` to render nothing.
+     */
+    renderClassification?: (event: TrafficEvent) => ReactNode;
+    /** Override the timestamp rendering. Default is `HH:MM:SS`. */
+    formatTime?: (at: number) => string;
+    className?: string;
+}
+/**
+ * One headless traffic row — timestamp, method badge, path, and an
+ * optional consumer classification slot. The raw result is exposed as
+ * `data-pyric-result` on the row (for tinting/filtering); rendering a
+ * verdict/outcome label is the consumer's job via
+ * `renderClassification` — the row itself draws no result chip, so a
+ * consumer verdict never collides with a built-in one. Latency is
+ * intentionally absent: this is a local simulator, so `evalMs` lives
+ * in `<TrafficDetail>` only.
+ *
+ * Styling hooks:
+ * - `[data-pyric-traffic-row]` — the row button, with
+ *   `data-pyric-result`, `data-pyric-origin`, `data-pyric-method`
+ * - `[data-pyric-traffic-row][data-pyric-selected]` — active row
+ * - `[data-pyric-traffic-time]` / `[data-pyric-traffic-path]`
+ * - `[data-pyric-traffic-service]` — the service label (firestore / rtdb /
+ *   storage / auth), rendered even when unknown (empty) so fixed-width
+ *   styling keeps the columns aligned
+ * - method renders as `<Badge>` (`data-pyric-badge-kind`)
+ */
+export declare function TrafficRow({ event, selected, onSelect, renderClassification, formatTime, className, }: TrafficRowProps): import("react").JSX.Element;
+//# sourceMappingURL=TrafficRow.d.ts.map

package/dist/traffic/components/TrafficRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrafficRow.d.ts","sourceRoot":"","sources":["../../../src/traffic/components/TrafficRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAGhD,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,YAAY,CAAC;IACpB,qEAAqE;IACrE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IACzC;;;;;OAKG;IACH,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,SAAS,CAAC;IAC1D,+DAA+D;IAC/D,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,MAAM,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,oBAAoB,EACpB,UAA8B,EAC9B,SAAS,GACV,EAAE,eAAe,+BAmBjB"}

package/dist/traffic/components/TrafficRow.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge } from '../../primitives/Badge.js';
+import { defaultFormatTime } from './format.js';
+/**
+ * One headless traffic row — timestamp, method badge, path, and an
+ * optional consumer classification slot. The raw result is exposed as
+ * `data-pyric-result` on the row (for tinting/filtering); rendering a
+ * verdict/outcome label is the consumer's job via
+ * `renderClassification` — the row itself draws no result chip, so a
+ * consumer verdict never collides with a built-in one. Latency is
+ * intentionally absent: this is a local simulator, so `evalMs` lives
+ * in `<TrafficDetail>` only.
+ *
+ * Styling hooks:
+ * - `[data-pyric-traffic-row]` — the row button, with
+ *   `data-pyric-result`, `data-pyric-origin`, `data-pyric-method`
+ * - `[data-pyric-traffic-row][data-pyric-selected]` — active row
+ * - `[data-pyric-traffic-time]` / `[data-pyric-traffic-path]`
+ * - `[data-pyric-traffic-service]` — the service label (firestore / rtdb /
+ *   storage / auth), rendered even when unknown (empty) so fixed-width
+ *   styling keeps the columns aligned
+ * - method renders as `<Badge>` (`data-pyric-badge-kind`)
+ */
+export function TrafficRow({ event, selected, onSelect, renderClassification, formatTime = defaultFormatTime, className, }) {
+    return (_jsxs("button", { type: "button", onClick: () => onSelect?.(event), className: className, "data-pyric-traffic-row": "", "data-pyric-result": event.result, "data-pyric-origin": event.origin, "data-pyric-method": event.method, "data-pyric-selected": selected ? '' : undefined, children: [_jsx("span", { "data-pyric-traffic-time": "", children: formatTime(event.at) }), _jsx("span", { "data-pyric-traffic-service": event.service ?? '', children: event.service ?? '' }), _jsx(Badge, { kind: event.method, children: event.method }), _jsx("span", { "data-pyric-traffic-path": "", children: event.path }), renderClassification ? renderClassification(event) : null] }));
+}
+//# sourceMappingURL=TrafficRow.js.map

package/dist/traffic/components/TrafficRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrafficRow.js","sourceRoot":"","sources":["../../../src/traffic/components/TrafficRow.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AAElD,OAAO,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAmBhD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,UAAU,UAAU,CAAC,EACzB,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,oBAAoB,EACpB,UAAU,GAAG,iBAAiB,EAC9B,SAAS,GACO;IAChB,OAAO,CACL,kBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,EAChC,SAAS,EAAE,SAAS,4BACG,EAAE,uBACN,KAAK,CAAC,MAAM,uBACZ,KAAK,CAAC,MAAM,uBACZ,KAAK,CAAC,MAAM,yBACV,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,aAE9C,0CAA8B,EAAE,YAAE,UAAU,CAAC,KAAK,CAAC,EAAE,CAAC,GAAQ,EAC9D,6CAAkC,KAAK,CAAC,OAAO,IAAI,EAAE,YAAG,KAAK,CAAC,OAAO,IAAI,EAAE,GAAQ,EACnF,KAAC,KAAK,IAAC,IAAI,EAAE,KAAK,CAAC,MAAM,YAAG,KAAK,CAAC,MAAM,GAAS,EACjD,0CAA8B,EAAE,YAAE,KAAK,CAAC,IAAI,GAAQ,EACnD,oBAAoB,CAAC,CAAC,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,IACnD,CACV,CAAC;AACJ,CAAC"}

package/dist/traffic/components/TrafficStats.d.ts

@@ -0,0 +1,18 @@
+import type { TrafficStatsSummary } from '../hooks/useTrafficStats.js';
+export interface TrafficStatsProps {
+    stats: TrafficStatsSummary;
+    className?: string;
+}
+/**
+ * Headless aggregation panel. Renders the totals, the deny rate, and
+ * count breakdowns by method / origin / path. The deny rate is
+ * exposed both as text and as a `--pyric-deny-rate` CSS custom
+ * property on the root for a proportional meter.
+ *
+ * Styling hooks: `[data-pyric-ui="traffic-stats"]`,
+ * `[data-pyric-stat]` (with `data-pyric-stat-key`),
+ * `[data-pyric-stat-group]` (with `data-pyric-stat-group-label`),
+ * `[data-pyric-stat-bucket]`.
+ */
+export declare function TrafficStats({ stats, className }: TrafficStatsProps): import("react").JSX.Element;
+//# sourceMappingURL=TrafficStats.d.ts.map

package/dist/traffic/components/TrafficStats.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrafficStats.d.ts","sourceRoot":"","sources":["../../../src/traffic/components/TrafficStats.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAEvE,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,mBAAmB,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAwBD;;;;;;;;;;GAUG;AACH,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,iBAAiB,+BAgCnE"}

package/dist/traffic/components/TrafficStats.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function BucketList({ label, buckets, }) {
+    return (_jsxs("div", { "data-pyric-stat-group": "", "data-pyric-stat-group-label": label, children: [_jsx("h4", { "data-pyric-stat-group-heading": "", children: label }), _jsx("ul", { "data-pyric-stat-buckets": "", children: buckets.map((b) => (_jsxs("li", { "data-pyric-stat-bucket": "", "data-pyric-stat-key": b.key, children: [_jsx("span", { "data-pyric-stat-bucket-label": "", children: b.key }), _jsx("span", { "data-pyric-stat-bucket-count": "", children: b.count })] }, b.key))) })] }));
+}
+/**
+ * Headless aggregation panel. Renders the totals, the deny rate, and
+ * count breakdowns by method / origin / path. The deny rate is
+ * exposed both as text and as a `--pyric-deny-rate` CSS custom
+ * property on the root for a proportional meter.
+ *
+ * Styling hooks: `[data-pyric-ui="traffic-stats"]`,
+ * `[data-pyric-stat]` (with `data-pyric-stat-key`),
+ * `[data-pyric-stat-group]` (with `data-pyric-stat-group-label`),
+ * `[data-pyric-stat-bucket]`.
+ */
+export function TrafficStats({ stats, className }) {
+    return (_jsxs("div", { className: className, "data-pyric-ui": "traffic-stats", style: { '--pyric-deny-rate': stats.denyRate }, children: [_jsxs("div", { "data-pyric-stat-totals": "", children: [_jsxs("span", { "data-pyric-stat": "", "data-pyric-stat-key": "total", children: [_jsx("span", { "data-pyric-stat-label": "", children: "total" }), _jsx("span", { "data-pyric-stat-value": "", children: stats.total })] }), _jsxs("span", { "data-pyric-stat": "", "data-pyric-stat-key": "allows", children: [_jsx("span", { "data-pyric-stat-label": "", children: "allowed" }), _jsx("span", { "data-pyric-stat-value": "", children: stats.allows })] }), _jsxs("span", { "data-pyric-stat": "", "data-pyric-stat-key": "denies", children: [_jsx("span", { "data-pyric-stat-label": "", children: "denied" }), _jsx("span", { "data-pyric-stat-value": "", children: stats.denies })] }), _jsxs("span", { "data-pyric-stat": "", "data-pyric-stat-key": "deny-rate", children: [_jsx("span", { "data-pyric-stat-label": "", children: "deny rate" }), _jsxs("span", { "data-pyric-stat-value": "", children: [(stats.denyRate * 100).toFixed(0), "%"] })] })] }), _jsx(BucketList, { label: "method", buckets: stats.byMethod }), _jsx(BucketList, { label: "origin", buckets: stats.byOrigin }), _jsx(BucketList, { label: "path", buckets: stats.byPath })] }));
+}
+//# sourceMappingURL=TrafficStats.js.map

package/dist/traffic/components/TrafficStats.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrafficStats.js","sourceRoot":"","sources":["../../../src/traffic/components/TrafficStats.tsx"],"names":[],"mappings":";AAOA,SAAS,UAAU,CAAC,EAClB,KAAK,EACL,OAAO,GAIR;IACC,OAAO,CACL,wCAA2B,EAAE,iCAA8B,KAAK,aAC9D,8CAAkC,EAAE,YAAE,KAAK,GAAM,EACjD,wCAA4B,EAAE,YAC3B,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAClB,wCAAuC,EAAE,yBAAsB,CAAC,CAAC,GAAG,aAClE,+CAAmC,EAAE,YAAE,CAAC,CAAC,GAAG,GAAQ,EACpD,+CAAmC,EAAE,YAAE,CAAC,CAAC,KAAK,GAAQ,KAF/C,CAAC,CAAC,GAAG,CAGT,CACN,CAAC,GACC,IACD,CACP,CAAC;AACJ,CAAC;AAED;;;;;;;;;;GAUG;AACH,MAAM,UAAU,YAAY,CAAC,EAAE,KAAK,EAAE,SAAS,EAAqB;IAClE,OAAO,CACL,eACE,SAAS,EAAE,SAAS,mBACN,eAAe,EAC7B,KAAK,EAAE,EAAE,mBAAmB,EAAE,KAAK,CAAC,QAAQ,EAAyB,aAErE,yCAA4B,EAAE,aAC5B,mCAAsB,EAAE,yBAAqB,OAAO,aAClD,wCAA4B,EAAE,sBAAa,EAC3C,wCAA4B,EAAE,YAAE,KAAK,CAAC,KAAK,GAAQ,IAC9C,EACP,mCAAsB,EAAE,yBAAqB,QAAQ,aACnD,wCAA4B,EAAE,wBAAe,EAC7C,wCAA4B,EAAE,YAAE,KAAK,CAAC,MAAM,GAAQ,IAC/C,EACP,mCAAsB,EAAE,yBAAqB,QAAQ,aACnD,wCAA4B,EAAE,uBAAc,EAC5C,wCAA4B,EAAE,YAAE,KAAK,CAAC,MAAM,GAAQ,IAC/C,EACP,mCAAsB,EAAE,yBAAqB,WAAW,aACtD,wCAA4B,EAAE,0BAAiB,EAC/C,yCAA4B,EAAE,aAC3B,CAAC,KAAK,CAAC,QAAQ,GAAG,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAC7B,IACF,IACH,EACN,KAAC,UAAU,IAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAE,KAAK,CAAC,QAAQ,GAAI,EACtD,KAAC,UAAU,IAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAE,KAAK,CAAC,QAAQ,GAAI,EACtD,KAAC,UAAU,IAAC,KAAK,EAAC,MAAM,EAAC,OAAO,EAAE,KAAK,CAAC,MAAM,GAAI,IAC9C,CACP,CAAC;AACJ,CAAC"}

package/dist/traffic/components/TrafficTimeline.d.ts

@@ -0,0 +1,81 @@
+import type { ReactNode } from 'react';
+import type { TimeWindow, UseTrafficBucketsResult } from '../hooks/useTrafficBuckets.js';
+import type { TrafficEvent } from '../types.js';
+export interface TrafficTimelineProps {
+    /**
+     * Raw traffic events to bucket. Ignored when `buckets` is supplied
+     * (the consumer pre-bucketed). Exactly one of `events` / `buckets`
+     * should drive the histogram.
+     */
+    events?: TrafficEvent[];
+    /**
+     * Pre-bucketed counts — the escape hatch when the caller already
+     * ran {@link useTrafficBuckets} (or `bucketTraffic`) upstream, e.g.
+     * to share one bucketing pass across the timeline + a stats header.
+     * Takes precedence over `events`.
+     */
+    buckets?: UseTrafficBucketsResult;
+    /** The time range the histogram spans. */
+    window: TimeWindow;
+    /** Number of bars. Default 30. Only used on the `events` path. */
+    bucketCount?: number;
+    /**
+     * A brushed sub-range (`[start, end)`) drawn as an overlay over the
+     * bars. Position is derived from where it falls inside `window`, so
+     * a partly-out-of-window brush clamps to the chart edges.
+     */
+    brush?: TimeWindow;
+    /**
+     * Fired when a bar inside the brush region is clicked-through — the
+     * component itself is presentation-agnostic about drag, so the
+     * primary brush gesture is owned by the consumer. As a built-in
+     * affordance, clicking a bucket calls this with a one-bucket-wide
+     * window so a bare consumer still gets a working selection.
+     */
+    onBrush?: (window: TimeWindow) => void;
+    /**
+     * Where the live edge marker sits, in epoch-ms. Defaults to
+     * `window.end` (the right edge = "now"). Omit / pass `null` to hide
+     * the marker entirely (e.g. a frozen, non-live window).
+     */
+    liveAt?: number | null;
+    /**
+     * Header slot — title, deny summary, live label. Rendered above the
+     * bars inside `[data-pyric-timeline-header]`. The mock puts
+     * "142 requests · 16 denied · live" here.
+     */
+    header?: ReactNode;
+    /**
+     * Axis slot — tick labels below the bars inside
+     * `[data-pyric-timeline-axis]`. The mock puts "14m ago · 7m · now"
+     * here. Receives the resolved window so labels can be derived.
+     */
+    axis?: ReactNode | ((window: TimeWindow) => ReactNode);
+    emptyState?: ReactNode;
+    className?: string;
+}
+/**
+ * Headless volume-over-time histogram — the time axis for the traffic
+ * lens. Buckets events into N bars; each bar stacks denies (dark, at
+ * the base) under the allow remainder, matching the Studio mock.
+ *
+ * Per-bucket styling channels (on `[data-pyric-bucket]`):
+ * - `data-pyric-bucket-count` / `-denies` — raw integers.
+ * - `--pyric-bucket-h` — full bar height, 0..1 of the tallest bucket.
+ * - `--pyric-bucket-deny-h` — deny sub-stack height, same scale.
+ * The deny segment (`[data-pyric-bucket-deny]`) and allow segment
+ * (`[data-pyric-bucket-allow]`) are separate children so the consumer
+ * colors them independently.
+ *
+ * A `[data-pyric-brush]` overlay marks a sub-range via
+ * `--pyric-brush-left` / `--pyric-brush-right` (0..1 fractions). The
+ * `[data-pyric-live]` edge marker sits at `--pyric-live-x`.
+ *
+ * Styling hooks: `[data-pyric-ui="traffic-timeline"]`,
+ * `[data-pyric-timeline-header]`, `[data-pyric-timeline-bars]`,
+ * `[data-pyric-bucket]` (with `data-pyric-bucket-index`,
+ * `data-pyric-has-denies`), `[data-pyric-brush]`,
+ * `[data-pyric-live]`, `[data-pyric-timeline-axis]`.
+ */
+export declare function TrafficTimeline({ events, buckets: prebucketed, window, bucketCount, brush, onBrush, liveAt, header, axis, emptyState, className, }: TrafficTimelineProps): import("react").JSX.Element;
+//# sourceMappingURL=TrafficTimeline.d.ts.map

package/dist/traffic/components/TrafficTimeline.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrafficTimeline.d.ts","sourceRoot":"","sources":["../../../src/traffic/components/TrafficTimeline.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EACV,UAAU,EAEV,uBAAuB,EACxB,MAAM,+BAA+B,CAAC;AACvC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,MAAM,WAAW,oBAAoB;IACnC;;;;OAIG;IACH,MAAM,CAAC,EAAE,YAAY,EAAE,CAAC;IACxB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,uBAAuB,CAAC;IAClC,0CAA0C;IAC1C,MAAM,EAAE,UAAU,CAAC;IACnB,kEAAkE;IAClE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC;IACvC;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB;;;;OAIG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,CAAC,CAAC,MAAM,EAAE,UAAU,KAAK,SAAS,CAAC,CAAC;IACvD,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAgBD;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,eAAe,CAAC,EAC9B,MAAM,EACN,OAAO,EAAE,WAAW,EACpB,MAAM,EACN,WAAgB,EAChB,KAAK,EACL,OAAO,EACP,MAAM,EACN,MAAM,EACN,IAAI,EACJ,UAAU,EACV,SAAS,GACV,EAAE,oBAAoB,+BAyEtB"}

package/dist/traffic/components/TrafficTimeline.js

@@ -0,0 +1,72 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useTrafficBuckets } from '../hooks/useTrafficBuckets.js';
+/** Clamp a 0..1 fraction. */
+function clamp01(n) {
+    if (n < 0)
+        return 0;
+    if (n > 1)
+        return 1;
+    return n;
+}
+/** Fraction (0..1) of `t` across `[window.start, window.end)`. */
+function fraction(t, window) {
+    const span = window.end - window.start;
+    if (span <= 0)
+        return 0;
+    return clamp01((t - window.start) / span);
+}
+/**
+ * Headless volume-over-time histogram — the time axis for the traffic
+ * lens. Buckets events into N bars; each bar stacks denies (dark, at
+ * the base) under the allow remainder, matching the Studio mock.
+ *
+ * Per-bucket styling channels (on `[data-pyric-bucket]`):
+ * - `data-pyric-bucket-count` / `-denies` — raw integers.
+ * - `--pyric-bucket-h` — full bar height, 0..1 of the tallest bucket.
+ * - `--pyric-bucket-deny-h` — deny sub-stack height, same scale.
+ * The deny segment (`[data-pyric-bucket-deny]`) and allow segment
+ * (`[data-pyric-bucket-allow]`) are separate children so the consumer
+ * colors them independently.
+ *
+ * A `[data-pyric-brush]` overlay marks a sub-range via
+ * `--pyric-brush-left` / `--pyric-brush-right` (0..1 fractions). The
+ * `[data-pyric-live]` edge marker sits at `--pyric-live-x`.
+ *
+ * Styling hooks: `[data-pyric-ui="traffic-timeline"]`,
+ * `[data-pyric-timeline-header]`, `[data-pyric-timeline-bars]`,
+ * `[data-pyric-bucket]` (with `data-pyric-bucket-index`,
+ * `data-pyric-has-denies`), `[data-pyric-brush]`,
+ * `[data-pyric-live]`, `[data-pyric-timeline-axis]`.
+ */
+export function TrafficTimeline({ events, buckets: prebucketed, window, bucketCount = 30, brush, onBrush, liveAt, header, axis, emptyState, className, }) {
+    // Hook is always called (rules of hooks); its result is discarded
+    // when the caller pre-bucketed.
+    const computed = useTrafficBuckets({
+        events: events ?? [],
+        window,
+        bucketCount,
+    });
+    const result = prebucketed ?? computed;
+    const { buckets, total } = result;
+    if (buckets.length === 0) {
+        return (_jsx("div", { className: className, "data-pyric-ui": "traffic-timeline", "data-pyric-empty": "", children: emptyState }));
+    }
+    const isEmpty = total === 0;
+    const livePoint = liveAt === undefined ? window.end : liveAt;
+    const liveX = livePoint == null ? null : fraction(livePoint, window);
+    const resolvedAxis = typeof axis === 'function' ? axis(window) : axis;
+    return (_jsxs("div", { className: className, "data-pyric-ui": "traffic-timeline", "data-pyric-empty": isEmpty ? '' : undefined, children: [header !== undefined && (_jsx("div", { "data-pyric-timeline-header": "", children: header })), _jsxs("div", { "data-pyric-timeline-chart": "", children: [_jsx("div", { "data-pyric-timeline-bars": "", role: "img", "aria-label": "request volume over time", children: buckets.map((bucket) => (_jsx(Bar, { bucket: bucket, window: window, onBrush: onBrush }, bucket.index))) }), brush && (_jsx("div", { "data-pyric-brush": "", "aria-hidden": "true", style: {
+                            '--pyric-brush-left': fraction(brush.start, window),
+                            '--pyric-brush-right': 1 - fraction(brush.end, window),
+                        } })), liveX != null && (_jsx("div", { "data-pyric-live": "", "aria-hidden": "true", style: { '--pyric-live-x': liveX } }))] }), resolvedAxis !== undefined && resolvedAxis !== null && (_jsx("div", { "data-pyric-timeline-axis": "", children: resolvedAxis }))] }));
+}
+function Bar({ bucket, window, onBrush, }) {
+    const interactive = onBrush !== undefined;
+    return (_jsxs("button", { type: "button", "data-pyric-bucket": "", "data-pyric-bucket-index": bucket.index, "data-pyric-bucket-count": bucket.count, "data-pyric-bucket-denies": bucket.denies, "data-pyric-has-denies": bucket.denies > 0 ? '' : undefined, disabled: !interactive, onClick: interactive
+            ? () => onBrush?.({ start: bucket.start, end: bucket.end })
+            : undefined, style: {
+            '--pyric-bucket-h': bucket.heightRatio,
+            '--pyric-bucket-deny-h': bucket.denyHeightRatio,
+        }, children: [_jsx("span", { "data-pyric-bucket-allow": "", "aria-hidden": "true" }), _jsx("span", { "data-pyric-bucket-deny": "", "aria-hidden": "true" })] }));
+}
+//# sourceMappingURL=TrafficTimeline.js.map

package/dist/traffic/components/TrafficTimeline.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrafficTimeline.js","sourceRoot":"","sources":["../../../src/traffic/components/TrafficTimeline.tsx"],"names":[],"mappings":"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"}

package/dist/traffic/components/format.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Default `HH:MM:SS` timestamp formatter. Components accept a
+ * `formatTime` prop to override — this is just the fallback so the
+ * library has no hard locale dependency.
+ */
+export declare function defaultFormatTime(at: number): string;
+/**
+ * Classifies a simulator debug line as a deny / allow / neutral
+ * verdict so consumers can tint reason rows via
+ * `[data-pyric-reason-verdict="…"]`.
+ */
+export declare function reasonVerdict(reason: string): 'deny' | 'allow' | 'neutral';
+//# sourceMappingURL=format.d.ts.map

package/dist/traffic/components/format.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"format.d.ts","sourceRoot":"","sources":["../../../src/traffic/components/format.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,CAIpD;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAK1E"}

package/dist/traffic/components/format.js

@@ -0,0 +1,24 @@
+/**
+ * Default `HH:MM:SS` timestamp formatter. Components accept a
+ * `formatTime` prop to override — this is just the fallback so the
+ * library has no hard locale dependency.
+ */
+export function defaultFormatTime(at) {
+    const d = new Date(at);
+    const pad = (n) => String(n).padStart(2, '0');
+    return `${pad(d.getHours())}:${pad(d.getMinutes())}:${pad(d.getSeconds())}`;
+}
+/**
+ * Classifies a simulator debug line as a deny / allow / neutral
+ * verdict so consumers can tint reason rows via
+ * `[data-pyric-reason-verdict="…"]`.
+ */
+export function reasonVerdict(reason) {
+    const lower = reason.toLowerCase();
+    if (lower.includes('deny'))
+        return 'deny';
+    if (lower.includes('allow'))
+        return 'allow';
+    return 'neutral';
+}
+//# sourceMappingURL=format.js.map

package/dist/traffic/components/format.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"format.js","sourceRoot":"","sources":["../../../src/traffic/components/format.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,MAAM,UAAU,iBAAiB,CAAC,EAAU;IAC1C,MAAM,CAAC,GAAG,IAAI,IAAI,CAAC,EAAE,CAAC,CAAC;IACvB,MAAM,GAAG,GAAG,CAAC,CAAS,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;IACtD,OAAO,GAAG,GAAG,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC,EAAE,CAAC;AAC9E,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,aAAa,CAAC,MAAc;IAC1C,MAAM,KAAK,GAAG,MAAM,CAAC,WAAW,EAAE,CAAC;IACnC,IAAI,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC;QAAE,OAAO,MAAM,CAAC;IAC1C,IAAI,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC;QAAE,OAAO,OAAO,CAAC;IAC5C,OAAO,SAAS,CAAC;AACnB,CAAC"}

package/dist/traffic/components/index.d.ts

@@ -0,0 +1,11 @@
+export { TrafficRow, type TrafficRowProps } from './TrafficRow.js';
+export { TrafficLog, type TrafficLogProps } from './TrafficLog.js';
+export { TrafficGroupRow, type TrafficGroupRowProps, } from './TrafficGroupRow.js';
+export { TrafficDetail, type TrafficDetailProps } from './TrafficDetail.js';
+export { RuleHeatmap, type RuleHeatmapProps } from './RuleHeatmap.js';
+export { TrafficStats, type TrafficStatsProps } from './TrafficStats.js';
+export { TrafficTimeline, type TrafficTimelineProps, } from './TrafficTimeline.js';
+export { defaultFormatTime, reasonVerdict } from './format.js';
+export { TrafficMetricCards, type TrafficMetricCardsProps, } from './TrafficMetricCards.js';
+export { TrafficLineChart, type TrafficLineChartProps, } from './TrafficLineChart.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/traffic/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/traffic/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACnE,OAAO,EACL,eAAe,EACf,KAAK,oBAAoB,GAC1B,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAC5E,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AACtE,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACzE,OAAO,EACL,eAAe,EACf,KAAK,oBAAoB,GAC1B,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC/D,OAAO,EACL,kBAAkB,EAClB,KAAK,uBAAuB,GAC7B,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACL,gBAAgB,EAChB,KAAK,qBAAqB,GAC3B,MAAM,uBAAuB,CAAC"}

package/dist/traffic/components/index.js

@@ -0,0 +1,11 @@
+export { TrafficRow } from './TrafficRow.js';
+export { TrafficLog } from './TrafficLog.js';
+export { TrafficGroupRow, } from './TrafficGroupRow.js';
+export { TrafficDetail } from './TrafficDetail.js';
+export { RuleHeatmap } from './RuleHeatmap.js';
+export { TrafficStats } from './TrafficStats.js';
+export { TrafficTimeline, } from './TrafficTimeline.js';
+export { defaultFormatTime, reasonVerdict } from './format.js';
+export { TrafficMetricCards, } from './TrafficMetricCards.js';
+export { TrafficLineChart, } from './TrafficLineChart.js';
+//# sourceMappingURL=index.js.map

package/dist/traffic/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/traffic/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAwB,MAAM,iBAAiB,CAAC;AACnE,OAAO,EAAE,UAAU,EAAwB,MAAM,iBAAiB,CAAC;AACnE,OAAO,EACL,eAAe,GAEhB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,aAAa,EAA2B,MAAM,oBAAoB,CAAC;AAC5E,OAAO,EAAE,WAAW,EAAyB,MAAM,kBAAkB,CAAC;AACtE,OAAO,EAAE,YAAY,EAA0B,MAAM,mBAAmB,CAAC;AACzE,OAAO,EACL,eAAe,GAEhB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC/D,OAAO,EACL,kBAAkB,GAEnB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACL,gBAAgB,GAEjB,MAAM,uBAAuB,CAAC"}

package/dist/traffic/hooks/index.d.ts

@@ -0,0 +1,8 @@
+export { useTrafficMonitor, type UseTrafficMonitorOptions, type UseTrafficMonitorResult, type TrafficCounts, } from './useTrafficMonitor.js';
+export { useTrafficFilter, type UseTrafficFilterOptions, type UseTrafficFilterResult, type TrafficFilterState, type TrafficOriginFilter, type TrafficResultFilter, } from './useTrafficFilter.js';
+export { useRuleHeatmap, type UseRuleHeatmapOptions, type UseRuleHeatmapResult, type RuleHeatmapEntry, } from './useRuleHeatmap.js';
+export { useTrafficStats, type UseTrafficStatsOptions, type TrafficStatsSummary, type TrafficStatBucket, } from './useTrafficStats.js';
+export { useTrafficGroups, type UseTrafficGroupsOptions, type UseTrafficGroupsResult, type TrafficLogItem, type TrafficGroup, type TrafficSingle, type TrafficGroupKind, } from './useTrafficGroups.js';
+export { useTrafficBuckets, bucketTraffic, type UseTrafficBucketsOptions, type UseTrafficBucketsResult, type TrafficBucket, type TimeWindow, } from './useTrafficBuckets.js';
+export { useBillableMetrics, useRulesMetrics, bucketBillableMetrics, bucketRulesMetrics, classifyBillable, classifyRules, isAdminEvent, BILLABLE_SERIES_DEFS, RULES_SERIES_DEFS, type UseTrafficMetricsOptions, type TrafficMetricsResult, type MetricPoint, type MetricSeries, type BillableSeriesKey, type RulesSeriesKey, } from './useTrafficMetrics.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/traffic/hooks/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/traffic/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EACjB,KAAK,wBAAwB,EAC7B,KAAK,uBAAuB,EAC5B,KAAK,aAAa,GACnB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EACL,gBAAgB,EAChB,KAAK,uBAAuB,EAC5B,KAAK,sBAAsB,EAC3B,KAAK,kBAAkB,EACvB,KAAK,mBAAmB,EACxB,KAAK,mBAAmB,GACzB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EACL,cAAc,EACd,KAAK,qBAAqB,EAC1B,KAAK,oBAAoB,EACzB,KAAK,gBAAgB,GACtB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,eAAe,EACf,KAAK,sBAAsB,EAC3B,KAAK,mBAAmB,EACxB,KAAK,iBAAiB,GACvB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EACL,gBAAgB,EAChB,KAAK,uBAAuB,EAC5B,KAAK,sBAAsB,EAC3B,KAAK,cAAc,EACnB,KAAK,YAAY,EACjB,KAAK,aAAa,EAClB,KAAK,gBAAgB,GACtB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EACL,iBAAiB,EACjB,aAAa,EACb,KAAK,wBAAwB,EAC7B,KAAK,uBAAuB,EAC5B,KAAK,aAAa,EAClB,KAAK,UAAU,GAChB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EACL,kBAAkB,EAClB,eAAe,EACf,qBAAqB,EACrB,kBAAkB,EAClB,gBAAgB,EAChB,aAAa,EACb,YAAY,EACZ,oBAAoB,EACpB,iBAAiB,EACjB,KAAK,wBAAwB,EAC7B,KAAK,oBAAoB,EACzB,KAAK,WAAW,EAChB,KAAK,YAAY,EACjB,KAAK,iBAAiB,EACtB,KAAK,cAAc,GACpB,MAAM,wBAAwB,CAAC"}

package/dist/traffic/hooks/index.js

@@ -0,0 +1,8 @@
+export { useTrafficMonitor, } from './useTrafficMonitor.js';
+export { useTrafficFilter, } from './useTrafficFilter.js';
+export { useRuleHeatmap, } from './useRuleHeatmap.js';
+export { useTrafficStats, } from './useTrafficStats.js';
+export { useTrafficGroups, } from './useTrafficGroups.js';
+export { useTrafficBuckets, bucketTraffic, } from './useTrafficBuckets.js';
+export { useBillableMetrics, useRulesMetrics, bucketBillableMetrics, bucketRulesMetrics, classifyBillable, classifyRules, isAdminEvent, BILLABLE_SERIES_DEFS, RULES_SERIES_DEFS, } from './useTrafficMetrics.js';
+//# sourceMappingURL=index.js.map

package/dist/traffic/hooks/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/traffic/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,GAIlB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EACL,gBAAgB,GAMjB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EACL,cAAc,GAIf,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,eAAe,GAIhB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EACL,gBAAgB,GAOjB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EACL,iBAAiB,EACjB,aAAa,GAKd,MAAM,wBAAwB,CAAC;AAChC,OAAO,EACL,kBAAkB,EAClB,eAAe,EACf,qBAAqB,EACrB,kBAAkB,EAClB,gBAAgB,EAChB,aAAa,EACb,YAAY,EACZ,oBAAoB,EACpB,iBAAiB,GAOlB,MAAM,wBAAwB,CAAC"}

package/dist/traffic/hooks/useRuleHeatmap.d.ts

@@ -0,0 +1,33 @@
+import type { TrafficEvent } from '../types.js';
+export interface RuleHeatmapEntry {
+    /** The rule's index in the rules file. */
+    ruleIndex: number;
+    /** Union of all operations seen matching this rule. */
+    operations: string[];
+    /** Total events that matched this rule. */
+    total: number;
+    allows: number;
+    denies: number;
+    unsupported: number;
+    /** `denies / total` — 0 when the rule never denied. */
+    denyRatio: number;
+}
+export interface UseRuleHeatmapOptions {
+    events: TrafficEvent[];
+}
+export interface UseRuleHeatmapResult {
+    /** Per-rule rollup, sorted by `total` descending (busiest first),
+     *  ties broken by `ruleIndex` ascending. */
+    entries: RuleHeatmapEntry[];
+    /** Events that matched no rule — counted here, not attributed to
+     *  any entry. */
+    unmatchedCount: number;
+}
+/**
+ * Rolls a traffic buffer up by `matchedRule.ruleIndex`: how often
+ * each rule fired, and how that split across allow / deny /
+ * unsupported. Pure derivation — feed it the filtered or full
+ * event list depending on what the heatmap should reflect.
+ */
+export declare function useRuleHeatmap({ events, }: UseRuleHeatmapOptions): UseRuleHeatmapResult;
+//# sourceMappingURL=useRuleHeatmap.d.ts.map

package/dist/traffic/hooks/useRuleHeatmap.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRuleHeatmap.d.ts","sourceRoot":"","sources":["../../../src/traffic/hooks/useRuleHeatmap.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,MAAM,WAAW,gBAAgB;IAC/B,0CAA0C;IAC1C,SAAS,EAAE,MAAM,CAAC;IAClB,uDAAuD;IACvD,UAAU,EAAE,MAAM,EAAE,CAAC;IACrB,2CAA2C;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,uDAAuD;IACvD,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,qBAAqB;IACpC,MAAM,EAAE,YAAY,EAAE,CAAC;CACxB;AAED,MAAM,WAAW,oBAAoB;IACnC;gDAC4C;IAC5C,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B;qBACiB;IACjB,cAAc,EAAE,MAAM,CAAC;CACxB;AAWD;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,EAC7B,MAAM,GACP,EAAE,qBAAqB,GAAG,oBAAoB,CA4C9C"}

package/dist/traffic/hooks/useRuleHeatmap.js

@@ -0,0 +1,54 @@
+import { useMemo } from 'react';
+/**
+ * Rolls a traffic buffer up by `matchedRule.ruleIndex`: how often
+ * each rule fired, and how that split across allow / deny /
+ * unsupported. Pure derivation — feed it the filtered or full
+ * event list depending on what the heatmap should reflect.
+ */
+export function useRuleHeatmap({ events, }) {
+    return useMemo(() => {
+        const byRule = new Map();
+        let unmatchedCount = 0;
+        for (const event of events) {
+            if (!event.matchedRule) {
+                unmatchedCount++;
+                continue;
+            }
+            const { ruleIndex, operations } = event.matchedRule;
+            let acc = byRule.get(ruleIndex);
+            if (!acc) {
+                acc = {
+                    ruleIndex,
+                    operations: new Set(),
+                    total: 0,
+                    allows: 0,
+                    denies: 0,
+                    unsupported: 0,
+                };
+                byRule.set(ruleIndex, acc);
+            }
+            for (const op of operations)
+                acc.operations.add(op);
+            acc.total++;
+            if (event.result === 'allow')
+                acc.allows++;
+            else if (event.result === 'deny')
+                acc.denies++;
+            else
+                acc.unsupported++;
+        }
+        const entries = [...byRule.values()]
+            .map((acc) => ({
+            ruleIndex: acc.ruleIndex,
+            operations: [...acc.operations],
+            total: acc.total,
+            allows: acc.allows,
+            denies: acc.denies,
+            unsupported: acc.unsupported,
+            denyRatio: acc.total === 0 ? 0 : acc.denies / acc.total,
+        }))
+            .sort((a, b) => b.total - a.total || a.ruleIndex - b.ruleIndex);
+        return { entries, unmatchedCount };
+    }, [events]);
+}
+//# sourceMappingURL=useRuleHeatmap.js.map

package/dist/traffic/hooks/useRuleHeatmap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRuleHeatmap.js","sourceRoot":"","sources":["../../../src/traffic/hooks/useRuleHeatmap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAuChC;;;;;GAKG;AACH,MAAM,UAAU,cAAc,CAAC,EAC7B,MAAM,GACgB;IACtB,OAAO,OAAO,CAAC,GAAG,EAAE;QAClB,MAAM,MAAM,GAAG,IAAI,GAAG,EAAuB,CAAC;QAC9C,IAAI,cAAc,GAAG,CAAC,CAAC;QAEvB,KAAK,MAAM,KAAK,IAAI,MAAM,EAAE,CAAC;YAC3B,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC;gBACvB,cAAc,EAAE,CAAC;gBACjB,SAAS;YACX,CAAC;YACD,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,GAAG,KAAK,CAAC,WAAW,CAAC;YACpD,IAAI,GAAG,GAAG,MAAM,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;YAChC,IAAI,CAAC,GAAG,EAAE,CAAC;gBACT,GAAG,GAAG;oBACJ,SAAS;oBACT,UAAU,EAAE,IAAI,GAAG,EAAE;oBACrB,KAAK,EAAE,CAAC;oBACR,MAAM,EAAE,CAAC;oBACT,MAAM,EAAE,CAAC;oBACT,WAAW,EAAE,CAAC;iBACf,CAAC;gBACF,MAAM,CAAC,GAAG,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC;YAC7B,CAAC;YACD,KAAK,MAAM,EAAE,IAAI,UAAU;gBAAE,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;YACpD,GAAG,CAAC,KAAK,EAAE,CAAC;YACZ,IAAI,KAAK,CAAC,MAAM,KAAK,OAAO;gBAAE,GAAG,CAAC,MAAM,EAAE,CAAC;iBACtC,IAAI,KAAK,CAAC,MAAM,KAAK,MAAM;gBAAE,GAAG,CAAC,MAAM,EAAE,CAAC;;gBAC1C,GAAG,CAAC,WAAW,EAAE,CAAC;QACzB,CAAC;QAED,MAAM,OAAO,GAAuB,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC;aACrD,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;YACb,SAAS,EAAE,GAAG,CAAC,SAAS;YACxB,UAAU,EAAE,CAAC,GAAG,GAAG,CAAC,UAAU,CAAC;YAC/B,KAAK,EAAE,GAAG,CAAC,KAAK;YAChB,MAAM,EAAE,GAAG,CAAC,MAAM;YAClB,MAAM,EAAE,GAAG,CAAC,MAAM;YAClB,WAAW,EAAE,GAAG,CAAC,WAAW;YAC5B,SAAS,EAAE,GAAG,CAAC,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,MAAM,GAAG,GAAG,CAAC,KAAK;SACxD,CAAC,CAAC;aACF,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,SAAS,GAAG,CAAC,CAAC,SAAS,CAAC,CAAC;QAElE,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,CAAC;IACrC,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;AACf,CAAC"}