live-search enhancement ideas

[cal-zone]

1. Create an option for live-search to include option values in addition to option labels and tokens.
2. Enable having data tokens that are more than one word by employing a different delimiter other than space
3. Create a means and an option for live-search to display matches in the list when they are not actually visible in the option label text.

For example:

(For #3)

• You have a list of vehicles. The list displays Make and Model to the user. Data tokens contain vehicle type.
• User types "tr" — this matches "Trucks" in data tokens.
• UI displays "Trucks" as something like an optgroup along with all matching makes and models listed beneath… any other matches that are not found in tokens are displayed individually (above or below data token matches — maybe a configurable option)

For (#2)

• You have a list of vehicles. The list displays Make and Model to the user. Data tokens contain vehicle type.
• User types "SU" — this matches "SUV / Sport Utility Vehicles" in data tokens.
• UI displays "SUV / Sport Utility Vehicles" in example above

For (#1)

• You have a list of countries. The list (option label) displays full country name to the user. Option value contains the 2-letter country code. Tokens contain other associated tags (continent, political groupings)
• User types 'DE' — this matches "DE" in one option value as well as Denmark in on option label
• UI displays both Germany and Denmark
• Since the match occurred on an option value as opposed to a data token, the matches are displayed individually instead of using a grouping (i.e., as opposed to something like an optgroup)
• Ideally, UI would append the option values for all results in a column to the right (applying a CSS class to differentiate it from the option label) — whenever an option value match for one value has occurred. So in this case, it would be something like:

Denmark | DK
Germany | DE

• (Ideally, the De and DE in both would be underlined/bolded/highlighted in some way.
• I realize this could be problematic when either or both option labels and values are long strings, as displaying both would be even harder. This could either be a trade-off up to the developer to weigh, or it could be dealt with by limiting the display width of each, truncating what is displayed, and using a hover popover to reveal the full text of each in those cases, although it's likely the user will recognize them to be the desired results just from what is visible.