Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Adds a headless combobox component #880

Merged
merged 9 commits into from
Sep 9, 2024
Merged

Conversation

haukesomm
Copy link
Collaborator

@haukesomm haukesomm commented Aug 29, 2024

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

    comboboxInput() { }
    comboboxPanelReference() {
        // this brick is often used with a nested
        // 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 haukesomm added the enhancement New feature or request label Aug 29, 2024
@haukesomm haukesomm requested a review from Lysander August 29, 2024 16:47
@haukesomm haukesomm added this to the 1.0-RC19 milestone Aug 29, 2024
@haukesomm haukesomm self-assigned this Aug 29, 2024
@haukesomm haukesomm force-pushed the haukesomm/headless-combobox branch from b22fc0b to 7196f3b Compare September 5, 2024 09:35
www/src/pages/headless/combobox.md Outdated Show resolved Hide resolved
www/src/pages/headless/combobox.md Outdated Show resolved Hide resolved
www/src/pages/headless/combobox.md Outdated Show resolved Hide resolved
www/src/pages/headless/combobox.md Outdated Show resolved Hide resolved
www/src/pages/headless/combobox.md Show resolved Hide resolved
www/src/pages/headless/combobox.md Outdated Show resolved Hide resolved
www/src/pages/headless/combobox.md Outdated Show resolved Hide resolved
www/src/pages/headless/combobox.md Outdated Show resolved Hide resolved
www/src/pages/headless/combobox.md Outdated Show resolved Hide resolved
@haukesomm haukesomm force-pushed the haukesomm/headless-combobox branch from 8d18263 to 8f4be10 Compare September 9, 2024 09:11
@haukesomm haukesomm force-pushed the haukesomm/headless-combobox branch from 8f4be10 to 6be0ac8 Compare September 9, 2024 09:30
@haukesomm haukesomm merged commit fd123bb into master Sep 9, 2024
2 checks passed
@haukesomm haukesomm deleted the haukesomm/headless-combobox branch September 9, 2024 10:22
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Popover panel with input button ( and Bootstrap ) Add some ComboBox aka TypeAhead to the headless components
2 participants