fl_select_genui 0.0.1
fl_select_genui: ^0.0.1 copied to clipboard
GenUI SDK (A2UI) integration for fl_select. Provides ready-made CatalogItems so conversational AI agents can render fl_select filter widgets inside chat surfaces and receive user selections as structu [...]
fl_select_genui #
GenUI SDK (A2UI) integration for
fl_select: exposes fl_select filter
panels as CatalogItems so conversational AI agents can render real,
interactive filter UIs inside chat surfaces — and receive the user's
selections back as structured query data.
agent ──JSON payload──▶ SelectFilter (fl_select UI) ──selection──▶ Map<String, List<String>>
How it works #
- You register [
FlSelectCatalogItems.asCatalog()] (or.all) with your GenUISurfaceControlleralongside the core catalog. - Your agent's system prompt includes
[
FlSelectCatalogItems.systemPromptFragment], which teaches it theSelectFiltervocabulary. - When the user needs to narrow down results, the agent emits a
SelectFilterpayload — adelegate(list / grid / flatten / cascading) plus anentriestree authored in theSelectEntryCodecJSON format. - The user interacts with a real fl_select panel; selections are written
back to the GenUI data model at
<id>.valueas aMap<String, List<String>>(same shape as fl_select'stoQueryMap), ready for the next agent turn or your query layer.
Invalid agent payloads render an inline error card instead of crashing.
Usage #
import 'package:fl_select_genui/fl_select_genui.dart';
import 'package:genui/genui.dart';
final controller = SurfaceController(
catalogs: [
CoreCatalogItems.asCatalog().copyWith(
newItems: FlSelectCatalogItems.all,
),
],
// ...agent transport
);
// System prompt:
FlSelectCatalogItems.systemPromptFragment;
See example/ for an end-to-end demo of the payload →
render → write-back loop.
Entry tree format #
{"type": "category", "id": "price", "name": "Price", "children": [
{"type": "any", "name": "Any"},
{"type": "range", "id": "0-100", "name": "$0 - $100", "min": 0, "max": 100},
{"type": "custom", "name": "Custom", "min": 0, "max": 1000}
]}
Node types: category (group, optional selectionMode / layout),
text (option or sub-branch), range (slider), any (reset sentinel),
custom (user-typed range). See SelectEntrySchema for the generated
JSON Schema and FlSelectCatalogItems.systemPromptFragment for the
agent-facing documentation.