Skip to content

Add 'allowCustomValue' flag to string field combobox - #115

Merged
joshunrau merged 2 commits into
DouglasNeuroInformatics:mainfrom
david-roper:adjust-stringFieldComboBox
Aug 11, 2026
Merged

Add 'allowCustomValue' flag to string field combobox#115
joshunrau merged 2 commits into
DouglasNeuroInformatics:mainfrom
david-roper:adjust-stringFieldComboBox

Conversation

@david-roper

Copy link
Copy Markdown
Contributor

Summary

Exposes the ComboBox allowCustomValue flag through the form's combobox string field variant, so a form field can accept text that doesn't match any of its options.

Changes

StringFieldComboBox

  • Added an optional allowCustomValue?: boolean prop (defaults to false, preserving current behaviour).
  • The flag is translated into a value-builder rather than forwarded as-is. This field's items are { label, value } objects, and ComboboxRoot's boolean path commits the raw typed string as the value — which would make onValueChange's item?.value come back undefined. It now passes (inputValue) => ({ label: inputValue, value: inputValue }).
  • Fixed the derivation of selected. A custom value is by definition absent from items, so items.find(...) ?? null resolved to null; because the ComboBox is controlled, the input blanked out the instant a custom value was committed. It now falls back to an item built from the value itself when the flag is on.

StringField.stories.tsx

  • The ComboBox story's allowCustomValue is now toggleable from the controls panel, with an explicit argTypes entry (docgen inference on the union-typed StringField doesn't reliably produce the boolean control).
  • The decorator reads allowCustomValue from its story context. Args passed to <Story args={...} /> inside a decorator override story-level args, so a hardcoded value there would render the control but make it inert.
  • Typed this one story as StoryObj<StringFieldComboBoxProps>. Reading args.allowCustomValue off StoryObj<typeof StringField> doesn't typecheck, since those args are the full StringFieldProps union and the input/textarea/password members have no such property. Runtime is unchanged — the meta still renders StringField, which dispatches on variant.

Notes for reviewers

  • Consumers can't set this from a form config yet. Form fields are typed by StringFormField from @douglasneuroinformatics/libui-form-types, where combobox shares a union member with radio and select. A form config object literal carrying allowCustomValue will fail excess-property checking until that package splits the combobox variant out and adds the prop. For now the flag only reaches the component when StringFieldComboBox is rendered directly (as the Storybook story does). Upstream change to follow.
  • A committed custom value is not a key of options, so any validation schema for the field has to accept arbitrary strings rather than a fixed enum. This is documented in the prop's JSDoc.

Testing

  • tsc --noEmit and eslint clean.
  • Existing ComboBox and Form suites pass (30 tests).
  • No new tests added. The selected fallback in particular is worth covering — it's the kind of thing a future refactor could quietly undo — so a spec that types a custom value and asserts the input retains it after re-render would be a good follow-up.

@david-roper
david-roper requested a review from joshunrau as a code owner August 11, 2026 18:21
@joshunrau
joshunrau merged commit cbe0f9a into DouglasNeuroInformatics:main Aug 11, 2026
1 check passed
@github-actions

Copy link
Copy Markdown

🎉 This PR is included in version 6.14.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants