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

Wrap current API to extend it to align with Atomic Design #161

Closed
travi opened this issue May 4, 2016 · 9 comments
Closed

Wrap current API to extend it to align with Atomic Design #161

travi opened this issue May 4, 2016 · 9 comments

Comments

@travi
Copy link

travi commented May 4, 2016

I am a big fan of the idea behind atomic design and the pattern lab tools that have been built around it. React components fit this model incredibly well, but there is no implementation of pattern lab for React components (yet at least).

When I came across this project, pattern lab for React was the first thing that came to mind. Most of my desires for such an implementation are covered well by react-storybook, so I first want to say thank you very much for the work you've put into such a helpful tool.

The feature that I think would take react-storybook to the next level as a tool that would compare to pattern lab would be the ability to group stories into categories, like atoms, molecules, organisms, templates, and pages. The last bullet under the Basic API heading mentions prefixing a story with a ., but does not explain what to expect as a result. My hope was that this was syntax that would enable grouping, but I did not notice any change in the handling of a story that I applied this to.

Is there a plan to add the ability to group stories like I describe? Was the dot notation intended for something along these lines?

@arunoda
Copy link
Member

arunoda commented May 4, 2016

Atomic design is kind cool. But the problem is I don't it's suitable for everyone. The components grouping in atomic may be too much for some apps. And for some components, it may be less.

So, currently this is our suggestion for this: #151 (comment)

I'm going to close this issue in-favour of #151

@arunoda arunoda closed this as completed May 4, 2016
@travi
Copy link
Author

travi commented May 5, 2016

Sorry that I missed that existing issue. I do want to clarify that my intent wasn't to suggest that react-storybook should shift to follow atomic design, but only to enable users that would like to follow it simply to have the ability to categorize stories that could align with its suggested groupings.

Enabling groups could simply provide added flexibility that could greatly improve the abiity to handle the needs of larger projects.

@arunoda
Copy link
Member

arunoda commented May 5, 2016

@travi Yep. I got it.
But, I think it's better we provide some layer on top of React Storybook. I hard to get that a core feature in Storybook. This is just like the CSS issue.

I'll reopen this and you may change the title to mention Atomic Design.

@arunoda arunoda reopened this May 5, 2016
@travi
Copy link
Author

travi commented May 5, 2016

Honestly, I'm not sure that reopening this issue is actually beneficial since my intention of mentioning atomic design was really only to highlight one use case for grouping. Because of this, I think it was appropriate to close in favor of the other issue.

I agree that atomic design likely doesn't make sense as a core feature of storybook at this point. However, I'm not clear about what you mean by providing a layer on top of atomic design. I'm also not sure which css issue you are referring to. Are you suggesting some extension of storybook that could enable custom uses like this outside of the core?

I'm happy to discuss further if you are suggesting something like that happening in the future, but I do think groups/categories can satisfy my needs for now.

@arunoda
Copy link
Member

arunoda commented May 5, 2016

Actually I was talking about a layer on top of Storybook. (sorry for the typo, I corrected that). CSS issue is there is no correct or wrong way. There are a lot of choices.

I think this can be closed. Feel free to do that.

@travi
Copy link
Author

travi commented May 5, 2016

Well, before we close it, I am interested in your thoughts about this extra layer and how it would be approached. Would you like to expand on your thoughts?

@arunoda
Copy link
Member

arunoda commented May 6, 2016

Basically, it's a way to wrap the current API for atomic design.
Then stories are created with dot(.)s.

If needed, we can introduce some core changes for additional things.

@travi travi changed the title Grouping of stories Wrap current API to extend it to align with Atomic Design May 6, 2016
@travi
Copy link
Author

travi commented May 6, 2016

If you see a reasonable way to get to that point and see value in getting there, I think that would be a great enhancement. How can I help make such an evolution successful?

@ndelangen
Copy link
Member

ndelangen commented Jul 7, 2017

#151 Support for deeper hierarchies is going to be released with 3.2.0, No API changes.

#1356
#1387
#1401
#1427

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants