FilterItem: `value` prop

[rafarubim]

trafficstars

Support or Feedback

• [X] I've searched for any related issues/questions on Github before submitting this request.

Context

Shoreline's component FilterItem receives a value and a children prop (it works like the <select>/<option> HTML tags).

The children text is presented at each of the Filter popover options. But after an option is "selected" then "applied", the value prop is what is actually shown by the Filter button (in the following image, look at the Roles: 123 text):

Suggestion

My suggestion is to change this behavior, to show the children prop text instead:

This would make the <Filter>/<FilterOption> behavior work more like HTML's <select>/<option> tags, making the children prop related to the visuals and the value prop related to React's controlled state. This would allow us to use ID strings in the value prop without harming UI visuals - and without constantly converting IDs<=>strings within controlled filters.

Additional Suggestion

If the previous suggestion is accepted, I would also suggest accepting the type number in the value prop, so there's no need for constant conversion from/to numeric IDs (id.toString()/Number.parseInt(value, 10)).``

[matheusps]

I agree with the suggestion for the children! Regarding numbers, I don't. I think that is better to stick with string, which is the standard for inputs in HTML, and convert to a number if you need to.

[davicostalf]

@matheusps can you update the issue title with a definition of what should be done?