Let an optional SearchableSelect be cleared again - #29
Merged
Conversation
SearchableSelect picks from a closed set and only ever emits option.value, so once anything was picked there was no gesture that returned to "nothing chosen" — a trap for nullable fields like the consuming app's store-dialog select. A new `clearable` prop shows an ✕ (accessible name via `clear-label`) that emits '' — the native Select's placeholder payload, so non-clearable call sites' types stay untouched — and hands focus back to the trigger. Pinned by the Clearable story. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Why
SearchableSelect picks from a closed set and only ever emits
option.value, so once anything was picked there was no gesture that returned to "nothing chosen" — a trap for nullable fields. flows.codebar hit it on the data-source form: the store-dialog field is nullable all the way down, but a selected dialog could never be unselected. Its sibling controls both already had an exit (nativeSelectrenders a selectable placeholder option;Comboboxis erasable free text); this closes the gap for the third sibling.What
clearableprop (+clear-labelfor the ✕'s accessible name, default "Clear selection"). While a selection is visible, an ✕ appears between the label and the chevron; pressing it clears, keeps the menu closed, and hands focus back to the trigger (the ✕ it was on has just unmounted).'', notnull— the nativeSelect's placeholder payload. Emittingnullwould widen the emit type toT | nullfor every consumer, forcing null-handling onto call sites whose select is not clearable and can never receive it. ForT = stringsites,T | ''collapses tostring: existing handlers type-check unchanged.<button>, and nested buttons are invalid HTML that browsers "repair" by splitting apart. Absolutely positioned into the trigger's right end at full control height; only rendered while a selected option's label is actually on screen.verify-versiondocuments for v1.17.0, so the next tag must be cut from a merged bump.)Testing
Clearablestory pins the loop: clear → model'', placeholder restored, menu closed, focus on trigger, ✕ unmounted; re-pick → ✕ back.typecheck,lint,buildclean.docuware_store_dialog_idis stored asnull.🤖 Generated with Claude Code