fritz2 icon indicating copy to clipboard operation
fritz2 copied to clipboard

Adds a headless `combobox` component

Open haukesomm opened this issue 5 months ago • 0 comments

This PR adds a headless combobox component inspired by the HeadlessUI Combobox.

The component can be created via the combobox factory.

For the full documentation visit the online documentation.
During the review phase the documentation needs to be accessed through the locally running 11ty page, of course.

API-sketch:

combobox<T> {
    val items: ItemsHook()
    // params: List<T> / Flow<List<T>>

    var itemFormat: (T) -> String

    val value: DatabindingProperty<T>

    var filterBy: FilterFunctionProperty
    // params: (Sequence<T>, String) -> Sequence<T> / T.() -> String

    val selectionStrategy: SelectionStrategyProperty
    // methods: autoSelectMatches() / manual()

    var maximumDisplayedItems: Int = 20
    var inputDebounceMillis: Long = 50L
    var renderDebounceMillis: Long = 50L

    comboboxPanelReference() { }
    comboboxInput() { }
    comboboxLabel() { }
    comboboxItems() {
        // inherited by `PopUpPanel`
        var placement: Placement
        var strategy: Strategy
        var flip: Boolean
        var skidding: Int
        var distance: int

        val results: Flow<QueryResult.ItemList<T>>

        // state.render {
        // for each QueryResult.ItemList<T>.Item<T> {
        comboboxItem(Item<T>) { }
        // }
        // }
    }
    comboboxValidationMessages() {
        val msgs: Flow<List<ComponentValidationMessage>>
    }
}

Closes #674 Closes #850

haukesomm avatar Aug 29 '24 16:08 haukesomm