Decathlon / vitamin-web

Decathlon Design System UI components for web applications
https://decathlon.github.io/vitamin-web
Apache License 2.0
279 stars 77 forks source link

feat(`@vtmn/react`, `@vtmn/vue`, `@vtmn/svelte`): add summaryComponent on `VtmnAccordion` #1441

Closed Tlahey closed 1 year ago

Tlahey commented 1 year ago

Changes description

Add a new slot summaryComponent in order to put more informations than only a string. No breaking changes here, only override the summary property if summaryComponent is found.

Context

Closes #1438 For a new filter component on NFS, we want to create a accordion with a badge information.

image

Checklist

Does this introduce a breaking change?

Other information

image
lauthieb commented 1 year ago

Thanks @Tlahey. @Sabrinavigil @SimonLeclercq @MARIEDELATTRE do you think that's possible to do this on the summary of the Accordion component (Web)? Thanks in advance for your help.

MARIEDELATTRE commented 1 year ago

Hi, from a design point of view the number of filters selected doesn't bring any value to the UX. It's better to show what is selected with chips for example (outside the accordion) like on the website. CleanShot 2023-06-15 at 11 58 54@2x My reco is to validate with your designer if you implement chips I think it could be ok to don't have the badge in tehe accordion (which bring zero value).

Tlahey commented 1 year ago

Hello @MARIEDELATTRE, for more context, the feature come from a mock from UX designer Alexandre Nacache and we have done a meet with @Sabrinavigil.

You can check the figma here -> https://www.figma.com/file/hn0KOvc9OrEsMe7ruPRrKO/%5BPLP%5D-Revamp-Filters-%E2%9A%99%EF%B8%8F?type=design&node-id=5309-188572&t=KfNBqcOKi5IpvjgS-0

lauthieb commented 1 year ago

Hi @Tlahey, after discussing with @Sabrinavigil, we will accept your request. It will cause a dephasing between the design & dev of Vitamin, but we don't want to hold you back and we've validated this behavior. Thank you.