Filter Builder

The component is self-contained: one file, no dependencies, the palette in --vibeui-datagrid-019-*. A client component: useState holds the array of conditions and the joiner; changing the field resets the operator and the value, because numbers and text take different operator sets. The builder is collected in a fieldset with a legend — for a screen reader this is one group rather than a scatter of fields; the legend carries float:left with width:100%, so the condition rows get clear:both. The joiner is shown as a separate line between the conditions and is not built into them: otherwise "and" reads as part of the neighbouring condition. Every field has its own aria-label with the number of the condition, and the counter of matches is declared role=status. The theme comes from the surrounding color-scheme through light-dark(): by default the grid lays no panel under itself, it sits directly on the page background and darkens along with it. The joiner and defaultRules props keep acting after mounting: the reader's edits are stored alongside them rather than instead of them.