A Component Sample is a standalone JavaScript module (ESM), with a default export that is a React component.
The Component Sample Module can be used in the following ways:
<Exhibit>
in a documentation page, to illustrate how the component looks in various states.At the very least it's useful to have at least one sample. In fact, the Timvir CLI tool generates a basic
sample
when you create a new component. Besides the basic sample, consider other samples such as:
The sample component should not depend on any props. That allows it to be used as a standalone page. However sometimes you may want to be able to slightly tweak the sample so you can reuse the same sample module in the documentation page. For that purpose the sample may consume optional props and tweak itself accordingly.
For example, if you have a checkbox-like component and want to show it as checked, unchecked, disabled in the documentation page.
Such an example you can use multiple times inside the documentation page: