Binding Navio to other reactive widgets

NavioWidget follows the Reactive Widget contract: it is an HTML element whose .value holds the multi-level filter chain, and which emits an input event whenever you change it. That is all Inputs.bind needs.

1. Two Navios, bound

Filter either one — the other follows. The binding copies .value, so the whole drill-down chain is reproduced, not just the resulting rows.

Navio A

Navio B (bound to A)

Shared .value

(no filters yet)

2. Bridging a widget whose value is rows, not filters

This is the real @john-guerra/faceted-search, loaded from its Observable notebook export. Its .value is the surviving rows, with the facets on value.filters — so it cannot be bound to Navio directly. But the facets and Navio's filters describe the same thing, and translate.

Both facet kinds map across. A checkbox facet becomes value filters on one level — tick Adelie and Navio gains a level with species == Adelie, exactly as clicking that value would. A range facet becomes a valueRange filter, e.g. beak in [38, 46]. That is a different thing from Navio's own brush, which selects a band of positions in the current ordering — a value range means the same thing however the level is sorted, which is what makes it portable between widgets.

@john-guerra/faceted-search (value = rows)

Navio C (bound to the facets)

What each side holds