element-hq / element-hq/element-web
Add Storybook support for Element
- Dominant language
- TypeScript
- Stars
- 13.5k
- Forks
- 2.8k
- PR merge metrics
- PR metrics pending
Description
To help the discovery and development of UI components we want to use [Storybook](https://storybook.js.org/). A developer would be able to create stories alongside components in `matrix-react-sdk` or `element-web` to preview certain components and understand how they behave when provided with a different set of properties
# Setup for element-web
The project is currently split across `element-web`, `matrix-react-sdk` and `matrix-js-sdk`.
All the information to compile the project, load the CSS are located in `element-web` whereas the components live in the React SDK.
Ideally we would want the storybook configuration to live in `element-web` so that it can piggy back our webpack configs. I have experimented with that setup and faced an issue that I raised on the main repo, storybookjs/storybook#15694
We can alternatively have the entire Storybook setup living in the React SDK. This means that we will need to mimic the webpack configuration that `element-web` has. This could lead to a disjointed experience when components are loaded in a Storybook context or inside `element-web`.
This problem could be mitigated by making those limitations clear to developers so that they make sure to test their code in both places
Contributor guide
Assessment
This issue has not been assessed yet.