Storybook Documentation

Storybook is a frontend workshop for building UI components and pages in isolation. It helps you develop and share hard-to-reach states and edge cases without needing to run your whole app.

We are creating

• UI page where we are importing or creating needed component.
• Story Page to call that Ui component and show it in storybook individually.

For Example

We have craeted calendar component here (src\components\calendar.tsx). and we have imported mantine component in it. so we can use calendar from mantine library.

Another page we have created here in (src\stories). Which helps us to show the components individually in storybook. in calender example we are creating new page as a calendar.stories.tsx here. and calender will be shown in storybook.

Note:

we are using

• Mantine (https://www.medplum.com/docs/react)
• storybook (https://storybook.medplum.com/?path=/docs/medplum-introduction--docs)

libraries to import essensial components.

To run storybook use npm run storybook