-
-
Notifications
You must be signed in to change notification settings - Fork 9.2k
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 Request]: Allow hooks to be passed in component
or similar property - React/Typescript
#23216
Comments
I am working on this. |
Hi @kdavidenkovmware , I’ve been working on a workaround for the issue regarding passing React hooks as components in Storybook. Here’s a solution that I’ve found effective: Solution Overview The workaround involves creating a custom Storybook configuration to handle TypeScript types and JSDoc documentation for React hooks. This approach allows you to use hooks in Storybook while ensuring they are properly documented and tested. The solution includes updating your Storybook setup and writing the hook with appropriate JSDoc comments. Detailed Steps Here’s an example of a React hook with JSDoc comments:
Add a Story for the Hook Create a story for the custom hook in Storybook:
Additional Notes Testing: After updating the configuration and creating the story, I tested it by running Storybook and verifying that the custom hook’s documentation was displayed correctly. Feedback: I’d appreciate feedback on this workaround and any additional suggestions for improvements. Feel free to test this workaround and let me know if you encounter any issues or have further questions. I’m happy to assist with any clarifications needed. Best, |
Is your feature request related to a problem? Please describe
Our organization has several hooks documented with storybook, using a component in the story to render them, but on two of them we need to bring in the associated jsdoc commentary which can only be achieved at the moment by passing the hook as the
component
like so:With the goal of a result like:
however, written in this results in a typescript error, as hooks themselves are not rendered components.
Describe the solution you'd like
In a React/Typescript environment, we would like to be able to pass hooks either as the
component
or with their own key.Describe alternatives you've considered
The main workaround we've found is the following, but it requires an
as
type assertion:Are you able to assist to bring the feature to reality?
no
Additional context
No response
The text was updated successfully, but these errors were encountered: