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] Improved SearchBox for stories #4139

Closed
3 tasks
ghost opened this issue Sep 7, 2018 · 7 comments
Closed
3 tasks

[Feature] Improved SearchBox for stories #4139

ghost opened this issue Sep 7, 2018 · 7 comments

Comments

@ghost
Copy link

ghost commented Sep 7, 2018

Hello everyone! First time poster here.

Currently search is performed exclusively on the name of the story, but it might be relatively easy/safe to take advantage of Story Parameters to make search a bit smarter.

I wanted to implement an interactive Design System in storybook in which stories could be "tagged" and searched for by typing in such tags, and enable using the same Markdown files used to document a story so that matching terms within them would be found and consequently the story "matched" in the search results. (inspired by Storybook Readme).

I was thinking it could be a matter of providing the attributes directly in the story, such as:

import ButtonReadme from '../components/button/README.md';

storiesOf('Button', module)
  .add('with text', () => (
    <Button onClick={action('clicked')}>Click me!</Button>
  ),
  {
     searchTags: ['button', 'generic'],
     searchMarkdown: [ButtonReadme] // Could provide several files if needed
  }
)

I'm not sure of what this all involves, but I presume it would mean:

  • edit <SearchBox /> to receive additional data from the stories (possibly here).
  • read from said markdown files somewhere
  • reserve/use some specific parameter from api.add(title, story, params) so that you can provide said tags and/or markdown files.

What do you guys think? I'd be happy to help with the implementation and feedback!

@igor-dv
Copy link
Member

igor-dv commented Sep 11, 2018

Interesting Idea 👍
I would wait though until @ndelangen and co will finish a major refactoring of the UI and State management.

@ndelangen ndelangen mentioned this issue Sep 12, 2018
82 tasks
@ndelangen
Copy link
Member

@christopherstat Let's have a chat on our slack?
https://now-examples-slackin-rrirkqohko.now.sh/

@nicholasmaddren
Copy link

Wow, I was literally just explaining to my team how cool this functionality would be to find that a few days ago it had been raised here!

I found myself scrolling through the list of my components trying to find form related components. It would be really nice if you could tag components and then filter by those tags, e.g... ['form', 'input'].

@ndelangen
Copy link
Member

In my branch the search is expanded to full text on every property of the story.

I'd like to implement fuzzy search on it, would you care to help with that @nicholasmaddren or @christopherstat ?

@ndelangen
Copy link
Member

WIP: #4086

@ndelangen ndelangen added this to the v5.0.0 milestone Oct 13, 2018
@tmeasday
Copy link
Member

The features @ndelangen described are merged in the v5 branch.

@shilman
Copy link
Member

shilman commented Jan 14, 2019

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

6 participants