@pond-ts/charts API Reference
    Preparing search index...

    Interface RegionProps

    interface RegionProps {
        edges?: boolean;
        editing?: boolean;
        from: number;
        hovered?: boolean;
        id?: string;
        label?: string | false;
        onChange?: (next: { from: number; to: number }) => void;
        selectable?: boolean;
        selected?: boolean;
        to: number;
    }
    Index

    Properties

    edges?: boolean

    Draw the vertical side outlines at from/to. Default true. false shades the span with no edge lines (fill only) — a soft highlight band. Edit-mode resizing still works (the grab areas are invisible).

    editing?: boolean

    When true, this mark is in single-annotation edit (the double-click target): handles stay out, it's draggable, and it reads as level 1 — while other marks stay static. Independent of the container's global editAnnotations. Pair with onEditAnnotation (the consumer holds an editingId and sets editing={editingId === id}).

    from: number

    Start x in axis units (time or value).

    hovered?: boolean

    Controlled hover (OR'd with pointer hover) — lets a legend row light the mark remotely. Pair with the container's onHoverAnnotation to sync both ways.

    id?: string

    Stable consumer id — a click (or double-click outside edit) reports it via onSelectAnnotation.

    label?: string | false

    Chip label. Omit to auto-label from–to with the shared x formatter; pass false (or '') to render no label chip — e.g. an inert selectable={false} highlight band, where the auto-label would just show raw axis values.

    onChange?: (next: { from: number; to: number }) => void

    Make the region editable (in edit mode): drag the body to move it (both edges shift), drag an edge to resize. Reports the new { from, to }.

    selectable?: boolean

    Whether the region responds to hover + selection (default true). When false it's inert background context — drawn at the back (level 3) always, and the double-click hit-test skips it.

    selected?: boolean

    Controlled selection — brightens to the front (level 1; the body too). Edge handles are an edit-mode hover affordance, not a selection cue. Ignored if not selectable.

    to: number

    End x in axis units.