semiotic 3.2.2 → 3.3.0

package/dist/components/server/staticAnnotations.d.ts

@@ -0,0 +1,40 @@
+/**
+ * Static annotation rendering for server-side SVG.
+ *
+ * Supports common annotation types without DOM or React hooks.
+ * Converts data coordinates to pixels using provided scales.
+ */
+import * as React from "react";
+import type { SemioticTheme } from "../store/ThemeStore";
+interface AnnotationScales {
+    x?: (v: any) => number;
+    y?: (v: any) => number;
+    /** For ordinal charts: band scale */
+    o?: {
+        (v: string): number | undefined;
+        bandwidth?: () => number;
+    };
+    /** For ordinal charts: value scale */
+    r?: (v: number) => number;
+}
+interface AnnotationLayout {
+    width: number;
+    height: number;
+}
+export interface StaticAnnotationConfig {
+    annotations: Record<string, any>[];
+    scales: AnnotationScales;
+    layout: AnnotationLayout;
+    theme: SemioticTheme;
+    /** ID prefix for multi-chart documents */
+    idPrefix?: string;
+    xAccessor?: string;
+    yAccessor?: string;
+    /** Ordinal projection — determines whether r maps to x or y */
+    projection?: "vertical" | "horizontal" | "radial";
+}
+/**
+ * Render annotations as static SVG elements.
+ */
+export declare function renderStaticAnnotations(config: StaticAnnotationConfig): React.ReactNode;
+export {};

package/dist/components/server/staticLegend.d.ts

@@ -0,0 +1,39 @@
+/**
+ * Static legend rendering for server-side SVG.
+ *
+ * Builds legend SVG elements from data + colorScheme without React hooks.
+ * Used by renderToStaticSVG when showLegend is true.
+ */
+import * as React from "react";
+import type { SemioticTheme } from "../store/ThemeStore";
+export interface StaticLegendConfig {
+    /** Category labels to show in legend */
+    categories: string[];
+    /** Color scheme — array of colors or d3-scale-chromatic name */
+    colorScheme?: string | string[];
+    /** Theme for text/font colors */
+    theme: SemioticTheme;
+    /** Legend position */
+    position?: "right" | "left" | "top" | "bottom";
+    /** Chart dimensions for positioning */
+    totalWidth: number;
+    totalHeight: number;
+    /** Chart margins */
+    margin: {
+        top: number;
+        right: number;
+        bottom: number;
+        left: number;
+    };
+    /** Title presence (affects top-position offset) */
+    hasTitle?: boolean;
+}
+/**
+ * Render a static legend as SVG elements.
+ * Returns null if no categories to show.
+ */
+export declare function renderStaticLegend(config: StaticLegendConfig): React.ReactNode;
+/**
+ * Extract unique categories from data using an accessor.
+ */
+export declare function extractCategories(data: any[], accessor: string | ((d: any) => string) | undefined): string[];

package/dist/components/server/svgHatchPattern.d.ts

@@ -0,0 +1,26 @@
+/**
+ * SVG hatch pattern for server-side rendering.
+ *
+ * Creates a <pattern> element that can be referenced via url(#id) fill.
+ * The SVG equivalent of createHatchPattern() which produces CanvasPatterns.
+ */
+import * as React from "react";
+export interface SVGHatchOptions {
+    /** Pattern ID — must be unique within the SVG */
+    id: string;
+    /** Background color */
+    background?: string;
+    /** Line color */
+    stroke?: string;
+    /** Line width @default 1.5 */
+    lineWidth?: number;
+    /** Spacing between lines @default 6 */
+    spacing?: number;
+    /** Angle in degrees @default 45 */
+    angle?: number;
+}
+/**
+ * Create an SVG <pattern> element for diagonal hatch fills.
+ * Place inside <defs> and reference with fill="url(#id)".
+ */
+export declare function createSVGHatchPattern(options: SVGHatchOptions): React.ReactElement;

package/dist/components/server/themeResolver.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Theme resolution for server-side rendering.
+ *
+ * Resolves theme presets and partial theme objects to concrete
+ * SemioticTheme instances with all color/font values resolved.
+ * No CSS custom properties — everything is concrete for inline SVG.
+ */
+import type { SemioticTheme } from "../store/ThemeStore";
+export type ThemeInput = string | Partial<SemioticTheme> | undefined;
+/**
+ * Resolve a theme input to a full SemioticTheme object.
+ *
+ * - undefined → LIGHT_THEME
+ * - string → named preset ("dark", "tufte", "carbon-dark", etc.)
+ * - object with mode → merge onto matching base theme
+ * - object without mode → merge onto LIGHT_THEME
+ */
+export declare function resolveTheme(theme: ThemeInput): SemioticTheme;
+/**
+ * Extract concrete style values from a resolved theme for use in SVG attributes.
+ * Returns a flat object of commonly-needed values.
+ */
+export declare function themeStyles(theme: SemioticTheme): {
+    background: string;
+    text: string;
+    textSecondary: string;
+    grid: string;
+    border: string;
+    primary: string;
+    fontFamily: string;
+    titleSize: number;
+    labelSize: number;
+    tickSize: number;
+    categorical: string[];
+};

package/dist/components/store/LinkedCrosshairStore.d.ts

@@ -1,11 +1,15 @@
 export declare function setCrosshairPosition(name: string, xValue: number, sourceId: string): void;
 export declare function clearCrosshairPosition(name: string, sourceId: string): void;
+/** Toggle lock: if unlocked, lock at xValue; if locked, unlock and clear. Returns new locked state. */
+export declare function toggleCrosshairLock(name: string, xValue: number, sourceId: string): boolean;
+/** Force-unlock a crosshair by name. When sourceId is provided, only unlocks if it matches (safe for multi-chart unmount). */
+export declare function unlockCrosshair(name: string, sourceId?: string): void;
 /**
  * Hook to read a specific crosshair position by name.
- * Returns the X value and sourceId, or null if no crosshair is active.
- * When name is undefined, uses a no-op subscription to avoid unnecessary re-renders.
+ * Returns the X value, sourceId, and locked state, or null if no crosshair is active.
  */
 export declare function useCrosshairPosition(name: string | undefined): {
     xValue: number;
     sourceId: string;
+    locked?: boolean;
 } | null;

package/dist/components/stream/CanvasHitTester.d.ts

@@ -18,6 +18,19 @@ export interface HitResult {
  * use the linear scan.
  */
 export declare function findNearestNode(scene: SceneNode[], px: number, py: number, maxDistance?: number, pointQuadtree?: Quadtree<PointSceneNode> | null): HitResult | null;
+/**
+ * Find all line/area nodes at a given X pixel coordinate.
+ * For each node, interpolates the Y value at px using the path data.
+ * Used for multi-point tooltip (show all series values at the hovered X).
+ */
+export declare function findAllNodesAtX(scene: SceneNode[], px: number, maxXDistance?: number): Array<{
+    node: SceneNode;
+    datum: any;
+    x: number;
+    y: number;
+    group?: string;
+    color?: string;
+}>;
 /**
  * Binary search for nearest point by time value in a RingBuffer.
  */

package/dist/components/stream/GeoPipelineStore.d.ts

@@ -39,6 +39,11 @@ export declare class GeoPipelineStore {
     pushPoint(datum: Record<string, any>): void;
     /** Push multiple streaming points */
     pushMany(data: Record<string, any>[]): void;
+    /**
+     * Remove points by ID. Requires pointIdAccessor to be configured.
+     * Returns the removed items.
+     */
+    removePoint(id: string | string[]): Record<string, any>[];
     clear(): void;
     computeScene(layout: StreamLayout): void;
     private fitProjection;
@@ -70,7 +75,7 @@ export declare class GeoPipelineStore {
         scale: number;
         translate: [number, number];
     };
-    private getPoints;
+    getPoints(): Record<string, any>[];
     private buildSceneNodes;
     private applyCartogramTransform;
     private applyDecay;

package/dist/components/stream/NetworkPipelineStore.d.ts

@@ -126,5 +126,25 @@ export declare class NetworkPipelineStore {
         nodes: RealtimeNode[];
         edges: RealtimeEdge[];
     };
+    /**
+     * Update a node's data by ID. Returns the previous data, or null if not found.
+     */
+    updateNode(id: string, updater: (data: Record<string, any>) => Record<string, any>): Record<string, any> | null;
+    /**
+     * Update all edges between source and target. Handles parallel edges.
+     * Returns array of previous data values (one per updated edge), or empty array.
+     */
+    updateEdge(sourceId: string, targetId: string, updater: (data: Record<string, any>) => Record<string, any>): Record<string, any>[];
+    /**
+     * Remove a node by ID. Also removes all edges connected to this node.
+     * Returns true if the node was found and removed.
+     */
+    removeNode(id: string): boolean;
+    /**
+     * Remove all edges between source and target node IDs.
+     * Handles parallel edges (multiple edges between the same pair).
+     * Returns true if at least one edge was removed.
+     */
+    removeEdge(sourceId: string, targetId: string): boolean;
     clear(): void;
 }

package/dist/components/stream/OrdinalPipelineStore.d.ts

@@ -32,6 +32,7 @@ export declare class OrdinalPipelineStore {
     private getGroup;
     private getColor;
     private getConnector;
+    private getDataId;
     /** Discovered categories in insertion order */
     private categories;
     /** True once a non-bounded (push) changeset has been ingested */
@@ -77,6 +78,16 @@ export declare class OrdinalPipelineStore {
     private startTransition;
     advanceTransition(now: number): boolean;
     getData(): Record<string, any>[];
+    /**
+     * Remove data items by ID. Requires dataIdAccessor to be configured.
+     * Returns the removed items. Marks the store dirty for scene rebuild.
+     */
+    remove(id: string | string[]): Record<string, any>[];
+    /**
+     * Update data items by ID. Requires dataIdAccessor.
+     * Returns the previous values. Categories and extents are rebuilt.
+     */
+    update(id: string | string[], updater: (d: Record<string, any>) => Record<string, any>): Record<string, any>[];
     clear(): void;
     get size(): number;
     getOAccessor(): (d: any) => string;

package/dist/components/stream/OrdinalSVGOverlay.d.ts

@@ -19,8 +19,12 @@ interface OrdinalSVGOverlayProps {
     showCategoryTicks?: boolean;
     oLabel?: string;
     rLabel?: string;
-    oFormat?: (d: string, index?: number) => string;
+    oFormat?: (d: string, index?: number) => string | React.ReactNode;
     rFormat?: (d: number) => string;
+    /** Custom tick values for the value (r) axis */
+    rTickValues?: number[];
+    /** Align first tick label to start, last to end */
+    tickLabelEdgeAlign?: boolean;
     showGrid?: boolean;
     title?: string | ReactNode;
     legend?: ReactNode | {
@@ -63,6 +67,7 @@ interface OrdinalSVGUnderlayProps {
     showAxes?: boolean;
     showGrid?: boolean;
     rFormat?: (d: number) => string;
+    rTickValues?: number[];
 }
 export declare function OrdinalSVGUnderlay(props: OrdinalSVGUnderlayProps): React.JSX.Element | null;
 export declare function OrdinalSVGOverlay(props: OrdinalSVGOverlayProps): React.JSX.Element | null;

package/dist/components/stream/PipelineStore.d.ts

@@ -9,6 +9,8 @@ export interface PipelineConfig {
     windowMode: WindowMode;
     arrowOfTime: ArrowOfTime;
     extentPadding: number;
+    /** Pixel inset on scale ranges to prevent glyph clipping at chart edges. Default 0. */
+    scalePadding?: number;
     maxCapacity?: number;
     xAccessor?: string | ((d: any) => number);
     yAccessor?: string | ((d: any) => number);
@@ -19,7 +21,7 @@ export interface PipelineConfig {
     groupAccessor?: string | ((d: any) => string);
     categoryAccessor?: string | ((d: any) => string);
     lineDataAccessor?: string;
-    xScaleType?: "linear" | "log";
+    xScaleType?: "linear" | "log" | "time";
     yScaleType?: "linear" | "log";
     xExtent?: [number | undefined, number | undefined] | [number];
     yExtent?: [number | undefined, number | undefined] | [number];
@@ -31,12 +33,26 @@ export interface PipelineConfig {
     lowAccessor?: string | ((d: any) => number);
     closeAccessor?: string | ((d: any) => number);
     candlestickStyle?: CandlestickStyle;
+    /** Internal: set by PipelineStore when open/close accessors are both missing */
+    candlestickRangeMode?: boolean;
     boundsAccessor?: string | ((d: any) => number);
     boundsStyle?: any;
     y0Accessor?: string | ((d: any) => number);
     gradientFill?: {
         topOpacity: number;
         bottomOpacity: number;
+    } | {
+        colorStops: Array<{
+            offset: number;
+            color: string;
+        }>;
+    };
+    areaGroups?: Set<string>;
+    lineGradient?: {
+        colorStops: Array<{
+            offset: number;
+            color: string;
+        }>;
     };
     lineStyle?: any;
     pointStyle?: (d: any) => Style & {
@@ -181,6 +197,17 @@ export declare class PipelineStore {
      */
     private getBufferArray;
     getData(): Record<string, any>[];
+    /**
+     * Remove data points by ID. Requires pointIdAccessor to be configured.
+     * Returns the removed items. Marks the store dirty for scene rebuild.
+     */
+    remove(id: string | string[]): Record<string, any>[];
+    /**
+     * Update data points by ID. Requires pointIdAccessor.
+     * The updater receives the current datum and returns the replacement.
+     * Returns the previous values. Extents and scene are marked dirty.
+     */
+    update(id: string | string[], updater: (d: Record<string, any>) => Record<string, any>): Record<string, any>[];
     /** Returns sorted bin boundary values from the last bar scene build. Persists until clear() or the next bar scene build. */
     getBinBoundaries(): number[];
     getExtents(): {

package/dist/components/stream/SVGOverlay.d.ts

@@ -7,9 +7,15 @@ export interface AxisConfig {
     orient: "left" | "right" | "top" | "bottom";
     label?: string;
     ticks?: number;
-    tickFormat?: (d: any, index?: number, allTicks?: number[]) => string;
+    tickFormat?: (d: any, index?: number, allTicks?: number[]) => string | ReactNode;
     baseline?: boolean | "under";
     jaggedBase?: boolean;
+    /** Grid line stroke style: "dashed" (6,4), "dotted" (2,4), or a custom strokeDasharray string. Applied to grid lines extending from ticks across the chart area. */
+    gridStyle?: "dashed" | "dotted" | string;
+    /** Always include the domain max as a tick, even if d3 omits it. */
+    includeMax?: boolean;
+    /** Auto-rotate labels 45° when horizontal spacing is too tight. */
+    autoRotate?: boolean;
     /** Highlight ticks at time boundaries (new month, year, etc.) with semibold text.
      * `true` auto-detects Date boundaries. A function receives (value, index) and returns true for landmark ticks. */
     landmarkTicks?: boolean | ((value: any, index: number) => boolean);
@@ -32,8 +38,8 @@ interface SVGOverlayProps {
     yLabel?: string;
     /** Label for the right Y axis (dual-axis charts) */
     yLabelRight?: string;
-    xFormat?: (d: any, index?: number, allTicks?: number[]) => string;
-    yFormat?: (d: any) => string;
+    xFormat?: (d: any, index?: number, allTicks?: number[]) => string | ReactNode;
+    yFormat?: (d: any) => string | ReactNode;
     showGrid?: boolean;
     title?: string | ReactNode;
     legend?: ReactNode | {
@@ -96,8 +102,8 @@ interface SVGUnderlayProps {
     showAxes?: boolean;
     axes?: AxisConfig[];
     showGrid?: boolean;
-    xFormat?: (d: any, index?: number, allTicks?: number[]) => string;
-    yFormat?: (d: any) => string;
+    xFormat?: (d: any, index?: number, allTicks?: number[]) => string | ReactNode;
+    yFormat?: (d: any) => string | ReactNode;
 }
 export declare function SVGUnderlay(props: SVGUnderlayProps): React.JSX.Element | null;
 export declare function SVGOverlay(props: SVGOverlayProps): React.JSX.Element | null;

package/dist/components/stream/accessorUtils.d.ts

@@ -12,6 +12,6 @@
  * the variable in the dependency array so the reference changes when behavior changes.
  */
 export declare function accessorsEquivalent(a: string | ((...args: any[]) => any) | undefined, b: string | ((...args: any[]) => any) | undefined): boolean;
-export declare function resolveAccessor<T>(accessor: string | ((d: T) => number) | undefined, fallback: string): (d: T) => number;
-export declare function resolveRawAccessor<T>(accessor: string | ((d: T) => any) | undefined, fallback: string): (d: T) => any;
-export declare function resolveStringAccessor<T>(accessor: string | ((d: T) => string) | undefined, fallback?: string): ((d: T) => string) | undefined;
+export declare function resolveAccessor<T extends Record<string, unknown>>(accessor: string | ((d: T) => number) | undefined, fallback: string): (d: T) => number;
+export declare function resolveRawAccessor<T extends Record<string, unknown>>(accessor: string | ((d: T) => unknown) | undefined, fallback: string): (d: T) => unknown;
+export declare function resolveStringAccessor<T extends Record<string, unknown>>(accessor: string | ((d: T) => string) | undefined, fallback?: string): ((d: T) => string) | undefined;

package/dist/components/stream/geoTypes.d.ts

@@ -171,6 +171,8 @@ export interface StreamGeoFrameProps<T = Record<string, any>> {
 export interface StreamGeoFrameHandle {
     push(datum: Record<string, any>): void;
     pushMany(data: Record<string, any>[]): void;
+    /** Remove points by ID. Requires pointIdAccessor. */
+    removePoint(id: string | string[]): Record<string, any>[];
     clear(): void;
     getProjection(): GeoProjection | null;
     getGeoPath(): GeoPath<any, GeoPermissibleObjects> | null;

package/dist/components/stream/hitTestUtils.d.ts

@@ -17,6 +17,21 @@ export declare function hitTestRect(px: number, py: number, node: {
     w: number;
     h: number;
 }): RectHitResult;
+/**
+ * Compute the effective hit radius for a point/circle node.
+ * Uses the larger of the visual radius + tolerance, Fitts's law minimum (12px),
+ * and the caller's maxDistance (default 30px).
+ */
+export declare function getHitRadius(nodeRadius: number | undefined, maxDistance?: number): number;
+/**
+ * Convert a value to a Date if possible. Returns null for non-date values.
+ * Treats numbers > 1e9 as millisecond timestamps.
+ */
+export declare function toDate(value: any): Date | null;
+/**
+ * Detect whether a tick marks a time boundary (new month or year) compared to the previous tick.
+ */
+export declare function isTimeLandmark(value: any, prevValue: any): boolean;
 /**
  * Normalize an angle to the [0, 2π) range.
  */

package/dist/components/stream/networkTypes.d.ts

@@ -35,6 +35,9 @@ export interface RealtimeNode {
     createdByFrame?: boolean;
     sourceLinks?: RealtimeEdge[];
     targetLinks?: RealtimeEdge[];
+    _pulseIntensity?: number;
+    _pulseColor?: string;
+    _pulseGlowRadius?: number;
 }
 export interface RealtimeEdge {
     source: RealtimeNode | string;
@@ -56,6 +59,12 @@ export interface RealtimeEdge {
     data?: Record<string, any>;
     /** Unique key for this edge (supports parallel edges between same node pair) */
     _edgeKey?: string;
+    _pulseIntensity?: number;
+    _pulseColor?: string;
+    _pulseGlowRadius?: number;
+    /** @internal Circular sankey layout fields */
+    _circularWidth?: number;
+    _circularStub?: boolean;
 }
 export interface BezierPoint {
     x: number;
@@ -171,6 +180,9 @@ export interface NetworkArcNode {
     datum: any;
     id?: string;
     label?: string;
+    _pulseIntensity?: number;
+    _pulseColor?: string;
+    _pulseGlowRadius?: number;
 }
 /** Line edge — used by force */
 export interface NetworkLineEdge {
@@ -200,6 +212,8 @@ export interface NetworkRibbonEdge {
     pathD: string;
     style: Style;
     datum: any;
+    _pulseIntensity?: number;
+    _pulseColor?: string;
 }
 /** Curved edge — used by tree, cluster */
 export interface NetworkCurvedEdge {
@@ -207,6 +221,8 @@ export interface NetworkCurvedEdge {
     pathD: string;
     style: Style;
     datum: any;
+    _pulseIntensity?: number;
+    _pulseColor?: string;
 }
 export type NetworkSceneNode = NetworkCircleNode | NetworkRectNode | NetworkArcNode;
 export type NetworkSceneEdge = NetworkLineEdge | NetworkBezierEdge | NetworkRibbonEdge | NetworkCurvedEdge;
@@ -333,6 +349,15 @@ export interface NetworkPipelineConfig {
     orbitShowRings?: boolean;
     /** Enable orbit animation. @default true */
     orbitAnimated?: boolean;
+    /** @internal Hierarchy root stashed for tree/treemap/circlepack plugins */
+    __hierarchyRoot?: unknown;
+    /** @internal Orbit animation state preserved across config updates */
+    __orbitState?: unknown;
+    /** @internal Previous node positions for warm-start force layout */
+    __previousPositions?: Map<string, {
+        x: number;
+        y: number;
+    }>;
 }
 export interface StreamNetworkFrameProps<T = Record<string, any>> {
     chartType: NetworkChartType;
@@ -450,6 +475,14 @@ export interface StreamNetworkFrameProps<T = Record<string, any>> {
 export interface StreamNetworkFrameHandle {
     push(edge: EdgePush): void;
     pushMany(edges: EdgePush[]): void;
+    /** Remove a node by ID. Also removes connected edges. */
+    removeNode(id: string): boolean;
+    /** Remove all edges between source and target node IDs. */
+    removeEdge(sourceId: string, targetId: string): boolean;
+    /** Update a node's data by ID. Returns previous data. */
+    updateNode(id: string, updater: (data: Record<string, any>) => Record<string, any>): Record<string, any> | null;
+    /** Update all edges between source+target. Returns array of previous data. */
+    updateEdge(sourceId: string, targetId: string, updater: (data: Record<string, any>) => Record<string, any>): Record<string, any>[];
     clear(): void;
     getTopology(): {
         nodes: RealtimeNode[];

package/dist/components/stream/ordinalTypes.d.ts

@@ -20,12 +20,11 @@ export interface WedgeSceneNode {
     style: Style;
     datum: any;
     category?: string;
-    /** Pulse intensity 0–1 (set when aggregated category value changes) */
     _pulseIntensity?: number;
-    /** Pulse color */
     _pulseColor?: string;
-    /** Animation target opacity (set during enter/exit transitions) */
+    _pulseGlowRadius?: number;
     _targetOpacity?: number;
+    _transitionKey?: string;
 }
 export interface BoxplotSceneNode {
     type: "boxplot";
@@ -51,7 +50,11 @@ export interface BoxplotSceneNode {
         value: number;
         datum: any;
     }[];
+    _pulseIntensity?: number;
+    _pulseColor?: string;
+    _pulseGlowRadius?: number;
     _targetOpacity?: number;
+    _transitionKey?: string;
 }
 export interface DistributionStats {
     n: number;
@@ -89,7 +92,11 @@ export interface ViolinSceneNode {
     style: Style;
     datum: any;
     category?: string;
+    _pulseIntensity?: number;
+    _pulseColor?: string;
+    _pulseGlowRadius?: number;
     _targetOpacity?: number;
+    _transitionKey?: string;
 }
 export interface ConnectorSceneNode {
     type: "connector";
@@ -100,7 +107,11 @@ export interface ConnectorSceneNode {
     style: Style;
     datum: any;
     group?: string;
+    _pulseIntensity?: number;
+    _pulseColor?: string;
+    _pulseGlowRadius?: number;
     _targetOpacity?: number;
+    _transitionKey?: string;
 }
 export interface TrapezoidSceneNode {
     type: "trapezoid";
@@ -109,7 +120,11 @@ export interface TrapezoidSceneNode {
     style: Style;
     datum: any;
     category?: string;
+    _pulseIntensity?: number;
+    _pulseColor?: string;
+    _pulseGlowRadius?: number;
     _targetOpacity?: number;
+    _transitionKey?: string;
 }
 export type { Style, PointSceneNode, RectSceneNode } from "./types";
 import type { PointSceneNode, RectSceneNode } from "./types";
@@ -146,9 +161,13 @@ export interface OrdinalPipelineConfig {
     rExtent?: [number?, number?];
     oExtent?: string[];
     barPadding?: number;
+    /** When true, adds padding below the 0 baseline. When false (default), bars are flush with the axis line. */
+    baselinePadding?: boolean;
     innerRadius?: number;
     normalize?: boolean;
     startAngle?: number;
+    /** Total arc sweep in degrees (default 360 = full circle). Used by GaugeChart for partial arcs. */
+    sweepAngle?: number;
     bins?: number;
     showOutliers?: boolean;
     showIQR?: boolean;
@@ -163,6 +182,8 @@ export interface OrdinalPipelineConfig {
     summaryStyle?: (d: any, category?: string) => Style;
     colorScheme?: string | string[];
     barColors?: Record<string, string>;
+    /** ID accessor for remove() — extracts a unique identifier from each datum */
+    dataIdAccessor?: string | ((d: any) => string);
     decay?: DecayConfig;
     pulse?: PulseConfig;
     transition?: TransitionConfig;
@@ -192,9 +213,11 @@ export interface StreamOrdinalFrameProps<T = Record<string, any>> {
         left?: number;
     };
     barPadding?: number;
+    baselinePadding?: boolean;
     innerRadius?: number;
     normalize?: boolean;
     startAngle?: number;
+    sweepAngle?: number;
     dynamicColumnWidth?: string | ((data: T[]) => number);
     bins?: number;
     showOutliers?: boolean;
@@ -211,6 +234,12 @@ export interface StreamOrdinalFrameProps<T = Record<string, any>> {
     windowSize?: number;
     connectorAccessor?: string | ((d: T) => string);
     connectorStyle?: Style | ((d: any) => Style);
+    /** ID accessor for remove()/update() — extracts a unique identifier from each datum */
+    dataIdAccessor?: string | ((d: any) => string);
+    /** Custom tick values for the value (r) axis. Overrides the default d3 ticks. */
+    rTickValues?: number[];
+    /** Align first tick label to start and last tick label to end. Default false. */
+    tickLabelEdgeAlign?: boolean;
     pieceStyle?: (d: any, category?: string) => Style;
     summaryStyle?: (d: any, category?: string) => Style;
     colorScheme?: string | string[];
@@ -219,7 +248,7 @@ export interface StreamOrdinalFrameProps<T = Record<string, any>> {
     showCategoryTicks?: boolean;
     oLabel?: string;
     rLabel?: string;
-    oFormat?: (d: string, index?: number) => string;
+    oFormat?: (d: string, index?: number) => string | ReactNode;
     rFormat?: (d: number | string) => string;
     enableHover?: boolean;
     hoverAnnotation?: boolean | HoverAnnotationConfig;
@@ -270,6 +299,10 @@ export interface StreamOrdinalFrameProps<T = Record<string, any>> {
 export interface StreamOrdinalFrameHandle<T = Record<string, any>> {
     push(datum: T): void;
     pushMany(data: T[]): void;
+    /** Remove data items by ID. Requires dataIdAccessor. */
+    remove(id: string | string[]): T[];
+    /** Update data items by ID in place. Requires dataIdAccessor. Returns previous values. */
+    update(id: string | string[], updater: (d: T) => T): T[];
     clear(): void;
     getData(): T[];
     getScales(): OrdinalScales | null;

package/dist/components/stream/renderers/resolveCSSColor.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Resolve a CSS custom property value to a concrete color string.
+ *
+ * If the input is a `var(--name)` or `var(--name, fallback)` string,
+ * reads the computed value from the canvas element. Otherwise returns
+ * the input unchanged.
+ *
+ * Per-canvas cache avoids repeated getComputedStyle calls within a single
+ * paint cycle. The cache is cleared on theme changes via clearCSSColorCache(),
+ * which each Stream Frame calls in its theme-change useEffect.
+ */
+export declare function resolveCSSColor(ctx: CanvasRenderingContext2D, value: string | undefined): string | undefined;
+/**
+ * Clear the per-canvas CSS variable cache. Called by Stream Frames
+ * when the theme changes so the next paint reads fresh computed values.
+ */
+export declare function clearCSSColorCache(canvas: HTMLCanvasElement): void;