Skip to content
Verified Commit d2ada9d7 authored by Mark Florian's avatar Mark Florian
Browse files

feat(GlFilteredSearch): Improve option interactions

This changes several aspects of options lists:

- The first static option which case-insensitively contains the given
  non-empty text is now selected automatically. This includes token
  options of a search term, which previously were only selected when the
  entire `value` was typed out. Custom token components which use the
  `suggestions` slot are not affected.
- Static options can now be rendered with a custom component by
  providing a `component` property on them. The component is given the
  `option` prop object representing the option.
- Token options (i.e., when choosing the type of token) can now be
  rendered with a custom component by providing an `optionComponent`
  property to the token definition in `GlFilteredSearch`'s
  `available-tokens` prop. This keeps the information
  about how to display the option near the option definition.
- Token option rendering is now delegated to
  `GlFilteredSearchTokenSegment` via its `options` prop, deduplicating
  some display logic.
- The `complete` event emitted by a title segment now passes the token
  `type` instead of its `title`. This is more consistent with other
  `complete` events in the component tree, as `type` is designed to be
  a unique value, whereas `title` is designed to be a user-facing
  string.
- `GlFilteredSearchTokenSegment`'s `optionTextField` prop now defaults
  to `title` instead of `value`, as that's a more sensible default. Only
  the operator segment needs the latter.

This also reverts
!3274 and
!3318 (see
below).

BREAKING CHANGE: `GlFilteredSearch`/`GlFilteredSearchTerm`'s `title`
slot and `GlFilteredSearchToken`'s `title-option` slot have been
removed. Similar functionality is available by setting the
`optionComponent` property on the given token object passed to
`GlFilteredSearch`'s `available-tokens` prop. The component will be
given an `option` prop, which will be the option object representing the
token.
parent 3b69a685
Loading
Loading
Loading
Loading
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment