Add accordion component

[rose-liang]

Closes: https://vimean.atlassian.net/browse/DSYS-26

What this PR does

creates Accordion component:

• Accordion and Accordion.Item minor component

Screenshots & Recordings

light mode:

dark mode:

Testing

https://vimeo.github.io/iris/sb/DSYS-26-accordion/?path=/story/components-accordion--controls

[juliewongbandue]

Hey @rose-liang ! Thanks for taking this on. A few things!:

• Let's add some accessibility: each section should be accessible via keyboard (tab to section and open with enter or space) and include a focus state. See this pattern for reference. We do have a Focus component, but this can also be achieved with css.
• I would consolidate the stories that you have under examples/ to one story, with all components and their visual props/states (open, closed, disabled, etc..) displayed there in effort to keep our snapshot quantity reasonable (1 story = 1 snapshot).

Hope that's clear. Let me know if you have any questions!

[juliewongbandue]

Should this be a Header component?

[juliewongbandue]

Same goes for here, would this technically be a subheader? If so, the header component should also be used. Size and weight can be modified using the variant and size props. See this header story for example.

[juliewongbandue]

If the border color is based on the surface token, you could hold that value in a const (or css property!). You should be able to use the -- css custom property syntax (see example from https://styled-components.com/)

[juliewongbandue]

Let's leave some comments to describe these props. You can see examples of how some other props were documented here: https://github.com/vimeo/iris/blob/main/src/components/Button/Button.types.ts#L40-L47, this way, the descriptions will render in our storybook args tables:

[juliewongbandue]

My concern about this here is what if we want want a different composition of of where the chevron is? What if we just want to render a different kind of warning icon? We should allow devs to compose the contents here however they might need to.