Design System Docz assets
Where to put component documentation related assets
To respect the modularity of each component, the suggested approach is to have a __docs__
dicrectory in each component's directory and put all the documentation assets there.
The following structure is used for the images and other doc related stuff:
src/select
├── __docs__
│ ├── docs.fixtures.js
│ ├── docs.styles.scss
│ └── img
│ ├── select_doc_briefexaple1.png
│ └── select_doc_briefexaple2.png
.mdx
files
How to use images in The default ![foo](__docs__/img/bar.png)
notation authomatically exposes the image assets to the bundler and the pipeline will upload them to the S3 bucket.
However for the <Playground/>
components with image address, the suggested approach would be:
import fooImgUrl from './__docs__/img/foo.png'
<Playground>
<FooComponent img={fooImgUrl} />
</Playground>