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

feat(store-ui): components migration to .tsx + .mdx and update storybook version to v6.3 #782

Merged
merged 8 commits into from
Jul 1, 2021

Conversation

Gmantiqueira
Copy link
Contributor

@Gmantiqueira Gmantiqueira commented Jun 20, 2021

What's the purpose of this pull request?

This PR migrates the rest of component docs to MDX in our Storybook.

  • Icon
  • Input
  • Popover
  • Price
  • SearchInput

@Gmantiqueira Gmantiqueira requested a review from a team as a code owner June 20, 2021 01:50
@netlify
Copy link

netlify bot commented Jun 20, 2021

✔️ Deploy Preview for storeui ready!

🔨 Explore the source changes: 6340289

🔍 Inspect the deploy log: https://app.netlify.com/sites/storeui/deploys/60ddee977cb63b0007a28b20

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

@Gmantiqueira Gmantiqueira changed the title [Storybook] Migrate components docs to MDX WIP | [Storybook] Migrate components docs to MDX Jun 20, 2021
@codesandbox-ci
Copy link

codesandbox-ci bot commented Jun 20, 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 6340289:

Sandbox Source
Store UI Typescript Configuration

@Gmantiqueira Gmantiqueira changed the title WIP | [Storybook] Migrate components docs to MDX [Storybook] Migrate components docs to MDX Jun 20, 2021
packages/store-ui/src/atoms/Input/Input.stories.mdx Outdated Show resolved Hide resolved
Comment on lines 84 to 87
args={{
value: 3.45,
variant: 'selling',
}}
Copy link
Contributor

Choose a reason for hiding this comment

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

It's sad that I can't see these args when I look into the code on the storybook. Is there a way we can show both the args and the function?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

@icazevedo Like this?

Screen Shot 2021-06-22 at 4 15 59 PM

Copy link
Contributor Author

Choose a reason for hiding this comment

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

But I'm not sure. I like the idea of showing how we are doing the formatter function. I'll test some things.

Copy link
Contributor

Choose a reason for hiding this comment

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

I would like the best of both worlds: show all the args, but also show the function.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Well, we can. We have the function in the Story tab and the values in the Show Code tab. I pushed this update just now.

Screen Shot 2021-06-22 at 6 20 58 PM

Screen Shot 2021-06-22 at 6 20 47 PM

Copy link
Contributor

Choose a reason for hiding this comment

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

No way we can have the function and the values on the "Show code" section? 😢

Copy link
Contributor Author

Choose a reason for hiding this comment

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

@icazevedo Nope :( We only have those two behaviors here: https://storybook.js.org/623cdb3c7a67ea4ce222bac6ede9cb59/button-story-code-doc-type-optimized.mp4

  • Show literal code with variable names.
  • Show the returned component with each value.

Idk if there's another way, but I think not.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

The docs of the docs hehe.

@Gmantiqueira Gmantiqueira changed the title [Storybook] Migrate components docs to MDX WIP | [Storybook] Migrate components docs to MDX Jun 27, 2021
@Gmantiqueira Gmantiqueira changed the title WIP | [Storybook] Migrate components docs to MDX feat(store-ui): components migration to .tsx + .mdx and update storybook version to v6.3 Jul 1, 2021
@Gmantiqueira Gmantiqueira force-pushed the storybook/migration-to-mdx branch from 3f48d62 to 6340289 Compare July 1, 2021 16:34
Copy link
Contributor

@tlgimenes tlgimenes left a comment

Choose a reason for hiding this comment

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

LGTM

@Gmantiqueira Gmantiqueira merged commit 9c8da3c into master Jul 1, 2021
@Gmantiqueira Gmantiqueira deleted the storybook/migration-to-mdx branch July 1, 2021 16:53
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.

3 participants