@fjader/svelte 0.2.2 → 0.2.3

package/dist/interactors/ParallelAxisSource.svelte

@@ -37,7 +37,8 @@
 		filterGroup: FilterGroup;
 		column: string;
 		chartId: string;
-		excludeMarkIds: () => Set<string>;
+		/** The chart the brush skips, or null for a chart that filters its own lines. */
+		chart: object | null;
 		/** The axis's scale state now: removing another column renumbers the axes. */
 		scaleState: () => LinearScaleState | null;
 		/** The axes' pixel extent (the chart's inner height). */
@@ -47,13 +48,12 @@
 	}
 
 	// Keyed by column in the parent, so none of these change for an instance.
-	const { filterGroup, column, chartId, excludeMarkIds, scaleState, pixelExtent, axes }: Props =
-		$props();
+	const { filterGroup, column, chartId, chart, scaleState, pixelExtent, axes }: Props = $props();
 
 	const columnRef = sqlColumn(column);
 
 	const handle = filterGroup.register(`parallel-brush-${column}-${chartId}`, {
-		excludeMarkIds,
+		chart,
 		activeDims: () => {
 			const state = scaleState();
 			if (!state) return [];

package/dist/interactors/ParallelAxisSource.svelte.d.ts

@@ -31,7 +31,8 @@ interface Props {
     filterGroup: FilterGroup;
     column: string;
     chartId: string;
-    excludeMarkIds: () => Set<string>;
+    /** The chart the brush skips, or null for a chart that filters its own lines. */
+    chart: object | null;
     /** The axis's scale state now: removing another column renumbers the axes. */
     scaleState: () => LinearScaleState | null;
     /** The axes' pixel extent (the chart's inner height). */

package/dist/interactors/ParallelBrushes.svelte

@@ -19,9 +19,9 @@
 	interface Props {
 		/** Filter group name — selects which FilterGroup these brushes write to. */
 		selection?: string;
-		/** When true, the parallel chart excludes itself from its own brush filters
-		 *  (standard crossfilter behavior). When false (default), brushes self-filter
-		 *  the chart — typical for parallel coordinates. */
+		/** When true, the brushes skip their own chart (standard crossfilter
+		 *  behavior). When false (default), they filter it — typical for parallel
+		 *  coordinates. */
 		cross?: boolean;
 	}
 
@@ -105,11 +105,10 @@
 		return Math.min(30, (chart.innerWidth / (ps.columns.length - 1)) * 0.35);
 	});
 
-	// Cross-filter: when cross=true, exclude chart's own marks (standard crossfilter).
-	// When cross=false (default for parallel coords), empty set — all marks self-filter.
-	const excludeMarkIds = cross
-		? () => new Set(chart.config.entries.keys())
-		: () => new Set<string>();
+	// Cross-filter: with cross=true the brushes skip their own chart (standard
+	// crossfilter). With cross=false, the default for parallel coordinates, the
+	// chart filters its own lines.
+	const skips = cross ? chart.config : null;
 
 	/** An axis's scale state, looked up by column: removing a column renumbers the axes. */
 	function scaleStateOf(col: string): LinearScaleState | null {
@@ -344,7 +343,7 @@
 			{filterGroup}
 			column={col}
 			chartId={chart.chartId}
-			{excludeMarkIds}
+			chart={skips}
 			scaleState={() => scaleStateOf(col)}
 			pixelExtent={() => chart.innerHeight}
 			{axes}

package/dist/interactors/ParallelBrushes.svelte.d.ts

@@ -1,9 +1,9 @@
 interface Props {
     /** Filter group name — selects which FilterGroup these brushes write to. */
     selection?: string;
-    /** When true, the parallel chart excludes itself from its own brush filters
-     *  (standard crossfilter behavior). When false (default), brushes self-filter
-     *  the chart — typical for parallel coordinates. */
+    /** When true, the brushes skip their own chart (standard crossfilter
+     *  behavior). When false (default), they filter it — typical for parallel
+     *  coordinates. */
     cross?: boolean;
 }
 declare const ParallelBrushes: import("svelte").Component<Props, {}, "">;

package/dist/interactors/Toggle.svelte

@@ -1,8 +1,7 @@
 <script lang="ts">
 	import { getContext, onDestroy } from 'svelte';
 	import type { ChartContext } from '../types';
-	import type { ScaleRegistry } from '../scales/ScaleRegistry.svelte';
-	import type { ActiveValueScale, ToggleHandle } from '../query-engine/FilterGroup.svelte';
+	import type { ToggleHandle } from '../query-engine/FilterGroup.svelte';
 	import type { FilterGroupRegistry } from '../query-engine/FilterGroupRegistry.svelte';
 	import type { BandScaleState } from '../scales/BandScaleState.svelte';
 	import BandLabelToggle from './BandLabelToggle.svelte';
@@ -16,9 +15,10 @@
 	 * - Band axis label: toggles the axis's own source field, whatever the
 	 *   declared field is. Labels are a ready-made category picker.
 	 *
-	 * Toggles on different fields AND together. The source chart is excluded
-	 * from its own toggles (crossfilter semantics) and dims instead via scale
-	 * active-value projection; other charts in the filter group filter.
+	 * Toggles on different fields AND together. The chart skips its own toggles
+	 * (crossfilter): its marks that read the toggled field dim, the rest keep
+	 * their data. Elsewhere in the group, marks that read the field dim and the
+	 * rest filter.
 	 */
 
 	interface Props {
@@ -32,33 +32,18 @@
 	const filterGroups = getContext<FilterGroupRegistry>('filter-groups');
 	const filterGroup = filterGroups.get(selection);
 	const chart = getContext<ChartContext>('chart');
-	const scaleRegistry = getContext<ScaleRegistry>('scale-registry');
 
 	// Normalize field to array for multi-column support
 	const fields = Array.isArray(field) ? field : [field];
 	const declaredField = fields.length === 1 ? fields[0] : null;
 
-	/** Marks in this chart — excluded so the source dims rather than filters. */
-	const excludeMarkIds = () => new Set(chart.config.entries.keys());
-
-	/** Scales keyed by the toggled field: its color scale and any band scale
-	 *  whose source column is that field. Never a band scale for another field. */
-	function scalesFor(toggleField: string): ActiveValueScale[] {
-		const out: ActiveValueScale[] = [];
-		const color = scaleRegistry?.getScaleByField(toggleField, 'color');
-		if (color) out.push(color as unknown as ActiveValueScale);
-		for (const axis of ['x', 'y'] as const) {
-			if (chart.scaleTypes?.[axis] !== 'band') continue;
-			const band = chart[`${axis}ScaleState`] as BandScaleState | null | undefined;
-			if (band && band.sourceField === toggleField) out.push(band as unknown as ActiveValueScale);
-		}
-		return out;
-	}
+	/**
+	 * This chart skips its own toggles (crossfilter): its marks keyed by the
+	 * toggled field dim, the rest keep their data.
+	 */
+	const skips = chart.config;
 
-	const declared = filterGroup.registerToggle(fields, {
-		excludeMarkIds,
-		scales: () => (declaredField ? scalesFor(declaredField) : [])
-	});
+	const declared = filterGroup.registerToggle(fields, { chart: skips });
 	chart.activators.add(declared.activate);
 
 	/** One BandLabelToggle per band axis field (see bandFieldsOf). */
@@ -92,8 +77,9 @@
 		const slot = bandState.invertScreenToData(innerPos, extent, axis === 'y');
 		if (slot == null) return null;
 		const id = bandState.idAtSlot(slot);
-		const value = id == null ? null : (bandState.categoryAt(id) ?? null);
-		return value == null ? null : { field: bandState.sourceField, value };
+		// undefined is "no category here"; null is the NULL category, a real one.
+		const value = id == null ? undefined : bandState.categoryAt(id);
+		return value === undefined ? null : { field: bandState.sourceField, value };
 	}
 
 	chart.onChartClick = (event) => {
@@ -106,7 +92,8 @@
 		// pointer micro-movement during click hides tooltip but data stays valid)
 		if (xInBounds && yInBounds && tm?.currentPoint) {
 			const tuple = fields.map((f) => tm.currentPoint![f]);
-			if (tuple.some((v) => v == null)) return;
+			// A missing field is undefined; null is the NULL category, selectable.
+			if (tuple.some((v) => v === undefined)) return;
 			declared.toggle(tuple, isMulti);
 			return;
 		}
@@ -139,11 +126,5 @@
 </script>
 
 {#each bandFields as bandField (bandField)}
-	<BandLabelToggle
-		{filterGroup}
-		field={bandField}
-		{excludeMarkIds}
-		scales={() => scalesFor(bandField)}
-		handles={bandToggles}
-	/>
+	<BandLabelToggle {filterGroup} field={bandField} chart={skips} handles={bandToggles} />
 {/each}

package/dist/interactors/Toggle.svelte.d.ts

@@ -6,9 +6,10 @@
  * - Band axis label: toggles the axis's own source field, whatever the
  *   declared field is. Labels are a ready-made category picker.
  *
- * Toggles on different fields AND together. The source chart is excluded
- * from its own toggles (crossfilter semantics) and dims instead via scale
- * active-value projection; other charts in the filter group filter.
+ * Toggles on different fields AND together. The chart skips its own toggles
+ * (crossfilter): its marks that read the toggled field dim, the rest keep
+ * their data. Elsewhere in the group, marks that read the field dim and the
+ * rest filter.
  */
 interface Props {
     /** Filter group name — selects which FilterGroup this toggle writes to. */

package/dist/interactors/Tooltip.svelte

@@ -12,6 +12,7 @@
 <script lang="ts">
 	import { getContext } from 'svelte';
 	import { format as d3format } from 'd3-format';
+	import { categoryLabel } from '../query-engine/categorical-identity';
 	import type { ChartContext, ContinuousScaleState } from '../types';
 
 	const commaFormat = d3format(',.4~g');
@@ -117,7 +118,7 @@
 			if (fmt) return fmt(value);
 			return commaFormat(value);
 		}
-		return String(value);
+		return String(categoryLabel(value));
 	}
 
 	const channelIcons: Record<string, string> = { x: '\u2192', y: '\u2191' };

package/dist/interactors/TooltipManager.svelte.js

@@ -440,7 +440,8 @@ export class TooltipManager {
             if (index == null)
                 return null;
             const category = this.#bandScale(axis)?.categoryAt(index);
-            if (category == null)
+            // undefined is no category; null is the NULL category, which has a band.
+            if (category === undefined)
                 return null;
             const pos = scale(category);
             const bandwidth = 'bandwidth' in scale ? scale.bandwidth() : 0;
@@ -492,7 +493,8 @@ export class TooltipManager {
         const { scaleTypes, bandDomains } = config;
         // Band channel → category label
         if ((key === 'x' || key === 'y') && scaleTypes[key] === 'band' && bandDomains?.[key]) {
-            return this.#bandScale(key)?.categoryAt(value) ?? value;
+            const category = this.#bandScale(key)?.categoryAt(value);
+            return category === undefined ? value : category;
         }
         // Time offset → formatted datetime
         if (key.startsWith(axis) && isTemporalScale(scaleTypes[axis]) && typeof value === 'number') {
@@ -577,7 +579,10 @@ export class TooltipManager {
             // field name to build its filter tuples, so this is also what makes a
             // click on a reordered band axis filter the right category.
             if ((key === 'x' || key === 'y') && scaleTypes[key] === 'band' && bandDomains?.[key]) {
-                point[fieldName] = this.#bandScale(key)?.categoryAt(value) ?? value;
+                // Not `??`: the NULL category decodes to null, which must stay null
+                // (Toggle selects it) rather than fall back to the raw id.
+                const category = this.#bandScale(key)?.categoryAt(value);
+                point[fieldName] = category === undefined ? value : category;
                 continue;
             }
             // Resolve time offset to formatted datetime string

package/dist/interactors/relay-clauses.d.ts

@@ -0,0 +1,23 @@
+import type { FilterGroup } from '../query-engine/FilterGroup.svelte';
+/**
+ * Mirrors one group's clauses into another, for DerivedInterval1D: every
+ * clause but the range brush on the derived axis, which the interactor
+ * replaces with its shifted copy.
+ *
+ * `sync` runs on every change in the source group, which is every brush frame
+ * there. It relays the source's clause objects themselves, so an unchanged
+ * one is the object the target already holds, which it ignores: a brush in the
+ * source re-queries nothing in the target for the clauses it did not touch.
+ */
+export declare class ClauseRelay {
+    #private;
+    constructor(source: FilterGroup, target: FilterGroup);
+    /**
+     * Relay the source's clauses (all of them but the range on `axisColumn`),
+     * and remove relayed clauses the source no longer has. With `relay` false,
+     * only the removal. Call untracked: it reads the target group it writes.
+     */
+    sync(relay: boolean, axisColumn: string): void;
+    /** Remove every relayed clause, for an interactor going away. */
+    clear(): void;
+}

package/dist/interactors/relay-clauses.js

@@ -0,0 +1,60 @@
+/**
+ * Mirrors one group's clauses into another, for DerivedInterval1D: every
+ * clause but the range brush on the derived axis, which the interactor
+ * replaces with its shifted copy.
+ *
+ * `sync` runs on every change in the source group, which is every brush frame
+ * there. It relays the source's clause objects themselves, so an unchanged
+ * one is the object the target already holds, which it ignores: a brush in the
+ * source re-queries nothing in the target for the clauses it did not touch.
+ */
+export class ClauseRelay {
+    #source;
+    #target;
+    #relayed = new Set();
+    /** Reused as the next pass's key set, swapped with #relayed after each. */
+    #current = new Set();
+    #axisColumn = '';
+    constructor(source, target) {
+        this.#source = source;
+        this.#target = target;
+    }
+    /**
+     * Relay the source's clauses (all of them but the range on `axisColumn`),
+     * and remove relayed clauses the source no longer has. With `relay` false,
+     * only the removal. Call untracked: it reads the target group it writes.
+     */
+    sync(relay, axisColumn) {
+        this.#current.clear();
+        if (relay) {
+            this.#axisColumn = axisColumn;
+            this.#source.selection.forEach(this.#visit);
+        }
+        for (const key of this.#relayed) {
+            if (!this.#current.has(key))
+                this.#target.removeManual(key);
+        }
+        const done = this.#relayed;
+        this.#relayed = this.#current;
+        this.#current = done;
+    }
+    /** Remove every relayed clause, for an interactor going away. */
+    clear() {
+        for (const key of this.#relayed)
+            this.#target.removeManual(key);
+        this.#relayed.clear();
+    }
+    #visit = (clause, sourceId) => {
+        const { schema } = clause;
+        if (schema?.kind === 'range' && schema.column === this.#axisColumn)
+            return;
+        if (!clause.predicate)
+            return;
+        const key = `relay:${sourceId}`;
+        this.#current.add(key);
+        // The clause itself: nothing in it depends on its group, so a relayed
+        // toggle routes and dims in the target as a native one would, and an
+        // unchanged clause is the same object, which the target ignores.
+        this.#target.relayClause(key, clause);
+    };
+}

package/dist/query-engine/CrossfilterSelection.svelte.d.ts

@@ -2,12 +2,19 @@
  * CrossfilterSelection — Svelte 5-native crossfilter predicate engine.
  *
  * Replaces Mosaic's Selection.intersect({ cross: true }) with a reactive
- * $state Map. Marks derive their filter via predicate(markId), which
- * returns all active predicates except those that exclude that mark.
+ * $state Map of clauses, plus the registrations of the sources that write
+ * them. Marks derive their filter via predicate(route): every clause that
+ * filters the mark.
  *
- * Cross-filtering is chart-level: interactors pass excludeMarkIds (the set
- * of all marks in the source chart). When a brush in chart A fires, all
- * marks in chart A skip that clause. All other marks receive it.
+ * WHICH CLAUSES FILTER A MARK. The mark decides, not the control that wrote
+ * the clause. A clause filters a mark unless:
+ * - it is a categorical selection on a field the mark reads selection
+ *   activity for (the mark dims by it instead), or
+ * - the mark's chart holds a registration of the clause's source that opted
+ *   into skipping its chart (crossfilter: a brush does not filter its own
+ *   chart).
+ * Both are computed when asked, from the clause, the mark's route and the
+ * live registrations: nothing is cached, so nothing goes stale.
  */
 import type { ExprNode } from '@uwdata/mosaic-sql';
 export type FilterExpr = ExprNode | string | boolean;
@@ -18,52 +25,118 @@ export interface FilterSchema {
     values?: unknown[];
     [key: string]: unknown;
 }
-/** A clause stored in the selection. */
+/**
+ * A single-field categorical selection, as a clause states it: the field's
+ * identity key and the selected values. Brushes, tuples and manual clauses have
+ * none.
+ */
+export interface CategoricalSelection {
+    key: string;
+    values: ReadonlySet<unknown>;
+}
+/** A clause stored in the selection. Nothing in it depends on its group. */
 export interface Clause {
     predicate: FilterExpr;
-    excludeMarkIds: Set<string>;
     value: unknown;
     schema?: FilterSchema;
+    /** Set when the clause selects categories of one field; written with the clause. */
+    categorical?: CategoricalSelection | null;
+}
+/**
+ * What routing needs to know about a mark: the identity keys of the
+ * categorical fields its renderer reads selection activity for, its chart, and
+ * its selectionResponse. One object per mark, owned by its lifecycle and
+ * handed around by reference.
+ *
+ * A categorical selection on a field in `reads` dims the mark instead of
+ * filtering it. `chart` is the chart's ChartConfig, compared by reference: a
+ * faceted chart's cells have ids of their own, but share one config.
+ * `response` 'filter' makes every selection filter the mark, and a click
+ * control's (a discrete registration's) in its own chart too; brushes still
+ * skip their own chart.
+ */
+export interface MarkRoute {
+    readonly reads: readonly string[];
+    readonly chart: object | null;
+    readonly response?: 'auto' | 'filter';
 }
+/**
+ * What routing reads from one registration of a source: the chart it skips,
+ * if it opted into skipping one. Compared by reference with a mark's route.
+ */
+export interface SourceRegistration {
+    readonly chart?: object | null;
+    /**
+     * The source writes its clauses on a click (a Toggle, a legend, a band
+     * label), not under a dragged pointer. A 'filter' mark in the chart it
+     * skips is filtered by it all the same.
+     */
+    readonly discrete?: boolean;
+}
+/** A mark with no route: it reads no activity and is in no chart. */
+export declare const NO_ROUTE: MarkRoute;
 /** A clause with its source identifier, for external consumers. */
 export interface ClauseEntry extends Clause {
     sourceId: string;
 }
 export declare class CrossfilterSelection {
     #private;
+    /** Add a registration of `sourceId`. */
+    addRegistration(sourceId: string, registration: SourceRegistration): void;
+    /** Remove a registration of `sourceId`; the last one removes the source. */
+    removeRegistration(sourceId: string, registration: SourceRegistration): void;
+    /** The live registrations of `sourceId`, or undefined when it has none. */
+    registrationsOf(sourceId: string): ReadonlySet<SourceRegistration> | undefined;
     /**
-     * Compute the filter predicate for a given mark.
-     * Returns all active predicates except those whose excludeMarkIds
-     * contains the given markId.
+     * Whether a clause of `sourceId` filters the mark with `route`. `key` is
+     * the clause's categorical field (its identity key), or null for a brush,
+     * a tuple or a manual clause; before the source has written a clause, its
+     * registrations' key, which preagg activation needs on hover.
+     *
+     * A plain loop over the registrations, which are one to three: no closure,
+     * no allocation, as it runs per mark per clause on every brush frame.
      */
-    predicate(markId: string): FilterExpr[];
+    filters(route: MarkRoute, sourceId: string, key: string | null): boolean;
+    /** Whether `clause`, written by `sourceId`, filters the mark with `route`. */
+    applies(sourceId: string, clause: Clause, route: MarkRoute): boolean;
+    /** Every predicate that filters the mark with `route`. */
+    predicate(route: MarkRoute): FilterExpr[];
     /**
      * Update or remove a clause.
      * Pass null to remove (clear) the clause for the given source.
+     *
+     * Returns the clause it replaced or removed, so the caller can re-query the
+     * marks either one applies to.
      */
-    update(sourceId: string, clause: Clause | null): void;
+    update(sourceId: string, clause: Clause | null): Clause | undefined;
     /** Whether a given source has an active (non-null) clause. */
     isActive(sourceId: string): boolean;
     /** O(1) lookup of a clause by source ID. */
     get(sourceId: string): Clause | undefined;
+    /**
+     * Visit every active clause: the stored objects themselves, not copies, so a
+     * caller can tell an unchanged clause by reference. Reactive like `items`,
+     * without building an entry object per clause.
+     */
+    forEach(visit: (clause: Clause, sourceId: string) => void): void;
     /** Reactive list of all active clauses with their source IDs. */
     get items(): ClauseEntry[];
     /**
      * The clause objects a preagg table bakes in, in map insertion order.
      * Stored at build time so bakedClausesMatch() can compare by reference.
      */
-    bakedClauses(markId: string, activeSourceId: string): Clause[];
+    bakedClauses(route: MarkRoute, activeSourceId: string): Clause[];
     /**
      * The baked predicates sorted by source ID, so the same filters always
      * produce the same preagg SQL whatever order their clauses were added in.
      */
-    bakedPredicates(markId: string, activeSourceId: string): FilterExpr[];
+    bakedPredicates(route: MarkRoute, activeSourceId: string): FilterExpr[];
     /**
      * Whether the clauses baked into a preagg table are still the ones in force.
      * Every filter change replaces its Clause object, so an unchanged filter
      * keeps its reference. Runs every brush frame, so it allocates nothing.
      */
-    bakedClausesMatch(markId: string, activeSourceId: string, then: Clause[]): boolean;
+    bakedClausesMatch(route: MarkRoute, activeSourceId: string, then: Clause[]): boolean;
     /** Number of active clauses. */
     get activeCount(): number;
     /** Remove all clauses. */