fix: filterable multiselect readonly state implemented #17662
Conversation
✅ Deploy Preview for carbon-elements ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
✅ Deploy Preview for v11-carbon-react ready!Built without sensitive environment variables
To edit notification comments on pull requests, go to your Netlify site configuration. |
packages/react/src/components/MultiSelect/FilterableMultiSelect.tsx
Outdated
Show resolved
Hide resolved
packages/react/src/components/MultiSelect/FilterableMultiSelect.tsx
Outdated
Show resolved
Hide resolved
packages/react/src/components/MultiSelect/FilterableMultiSelect.tsx
Outdated
Show resolved
Hide resolved
Codecov ReportAttention: Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## main #17662 +/- ##
==========================================
- Coverage 79.72% 79.70% -0.02%
==========================================
Files 406 406
Lines 14012 14030 +18
Branches 4333 4364 +31
==========================================
+ Hits 11171 11183 +12
- Misses 2676 2681 +5
- Partials 165 166 +1 ☔ View full report in Codecov by Sentry. |
packages/react/src/components/MultiSelect/FilterableMultiSelect.tsx
Outdated
Show resolved
Hide resolved
tay1orjones
requested review from
a team and
laurenmrice
and removed request for
a team
There was a problem hiding this comment.
Looks good to me 👍
@laurenmrice could you do a review as well? Just want to be sure we didn't miss anything design-wise
There was a problem hiding this comment.
- The tag border should be color token
$border-subtle. I notice this is also wrong though in the regular Multiselect playground story.
- When you hover on the x icon in the tag, it turns black and lets you dismiss the tag. The x should not receive any color change or interaction in the read-only state.
Hey @laurenmrice , I have added the functionality to not have any interaction during the |
There was a problem hiding this comment.
Okay thanks, @Gururajj77 ! One last thing I noticed for the Filterable Multiselect is if you hover on the number in the tag in the read-only state, a disabled mouse cursor appears. The mouse cursor should just be the arrow, like how it appears when you hover on the x icon in the tag. I also see the number 2 in the tag looks like it has a highlighted background color behind it which it should not have.
✅ Deploy Preview for v11-carbon-web-components ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
|
Have created an issue, #17820 to keep track for the hover issue separately |
7115f33
…-system#17662) * fix: filterable multiselect readonly state implemented * fix: reviewed changes added * fix: resovled pr review comments * feat: added readonly state for listboxselection * fix: removed conditional class on readonly matching disabled --------- Co-authored-by: Preeti Bansal <[email protected]>
Closes #17587
read only state for filterable multiselect is implemented
Changelog
New
readOnlypropreadOnlyEventHandlersmethod to handle events during thereadOnlystate.Changed
Testing / Reviewing
readOnlyprop and see if it works as expected.