Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature/accordion molecule #985

Merged
merged 11 commits into from
Oct 14, 2021
Merged

Feature/accordion molecule #985

merged 11 commits into from
Oct 14, 2021

Conversation

lariciamota
Copy link
Contributor

@lariciamota lariciamota commented Oct 11, 2021

What's the purpose of this pull request?

Implement the Accordion molecule

How it works?

It exports these components: Accordion, AccordionItem, AccordionButton, and AccordionPanel.
In Accordion's context you'll have access to which panels should be opened, the function that should be triggered when opening/closing panels and the number of accordion items.
In AccordionItem's context you'll have access to its index and its button/panel ids.
The structure is:

<Accordion indices={} onChange={}>
   <AccordionItem>
      <AccordionButton>
             Button 1
      </AccordionButton>
      <AccordionPanel>
             Text
      </AccordionPanel>
   </AccordionItem>
   <AccordionItem>
      <AccordionButton>
             Button 2
      </AccordionButton>
      <AccordionPanel>
             Text
      </AccordionPanel>
   </AccordionItem>
// ...
</Accordion>

How to test it?

References

https://www.w3.org/TR/wai-aria-practices-1.2/#accordion

@netlify
Copy link

netlify bot commented Oct 11, 2021

✔️ Deploy Preview for storeui ready!

🔨 Explore the source changes: 0cf6e86

🔍 Inspect the deploy log: https://app.netlify.com/sites/storeui/deploys/61685024598a9600075446f7

😎 Browse the preview: https://deploy-preview-985--storeui.netlify.app

@codesandbox-ci
Copy link

codesandbox-ci bot commented Oct 11, 2021

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 0cf6e86:

Sandbox Source
Store UI Typescript Configuration

@lariciamota lariciamota force-pushed the feature/accordion-molecule branch from 20cd7ad to 0b1fd18 Compare October 11, 2021 18:22
@lariciamota lariciamota marked this pull request as ready for review October 11, 2021 18:27
@lariciamota lariciamota requested a review from a team as a code owner October 11, 2021 18:27
@lariciamota lariciamota self-assigned this Oct 11, 2021
@lariciamota lariciamota linked an issue Oct 11, 2021 that may be closed by this pull request
Copy link
Contributor

@icazevedo icazevedo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great job 👏 . I have a suggestion: instead of using number[] to type indices, I think we should use Iterable<number>. By doing this, we can use Sets to make all operations O(1). We would also accept arrays that we could internally convert to Sets: new Set(indices). What do you think?

@lariciamota
Copy link
Contributor Author

Great job 👏 . I have a suggestion: instead of using number[] to type indices, I think we should use Iterable<number>. By doing this, we can use Sets to make all operations O(1). We would also accept arrays that we could internally convert to Sets: new Set(indices). What do you think?

Great suggestion! I'll make the necessary changes

Copy link
Contributor

@Gmantiqueira Gmantiqueira left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Only some punctuations 😆 but LGTM, really great job!

packages/store-ui/src/molecules/Accordion/Accordion.tsx Outdated Show resolved Hide resolved
packages/store-ui/src/molecules/Accordion/Accordion.tsx Outdated Show resolved Hide resolved
@lariciamota lariciamota force-pushed the feature/accordion-molecule branch from 2d66491 to 82c5b3c Compare October 12, 2021 21:40
Copy link
Contributor

@igorbrasileiro igorbrasileiro left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great job, @lariciamota! This PR is excellent 👏 🚀
I left some comments.

@lariciamota lariciamota force-pushed the feature/accordion-molecule branch from 82c5b3c to 257b080 Compare October 13, 2021 12:36
Copy link
Member

@victorhmp victorhmp left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome!! 👏🏻
I just left a naming suggestion :)

@lariciamota lariciamota force-pushed the feature/accordion-molecule branch from d44b6c2 to 7dbbfdf Compare October 14, 2021 15:26
@lariciamota lariciamota merged commit a35fb51 into master Oct 14, 2021
@lariciamota lariciamota deleted the feature/accordion-molecule branch October 14, 2021 15:52
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Accordion
6 participants