import AboutModal from '../../AboutModal';
import { ArgsTable, Story, Canvas, Meta } from '@storybook/addon-docs';
import {
  createComponentTemplate,
  createStoryMetaSettings,
} from '../../../storybook/functions/create-component-story';

export const argTypes = {
  component: AboutModal,
  title: 'Modals/About',
};

<Meta
  title="Modals/About"
  component={AboutModal}
/>

export const aboutTemplate = args => (
  <div className="bg-primary-dark">
    <AboutModal {...args} />
  </div>
);

<Heading
  title="About Modal"
  componentRelativePath="AboutModal/AboutModal.tsx"
/>

- [Overview](#overview)
- [Props](#props)
- [Usage](#usage)
- [Contribute](#contribute)

## Overview

OHIF about modal component provides information about the application version and build number

<Canvas>
  <Story name="Overview">{aboutTemplate.bind({})}</Story>
</Canvas>

## Props

<ArgsTable of={AboutModal} />

## Usage

## Contribute

<Footer componentRelativePath="AboutModal/__stories__/aboutModal.stories.mdx" />
