import { Meta, Story, ArgsTable, Canvas } from '@storybook/addon-docs/blocks';
import SelectedEdition from '../SelectedEdition';
import { selectedEditionsMock } from '../../../../mocks/product/configuratorSelectedEdition';
import { CollapsibleJsonSnippet } from '../../../tools/docTools';

export const selectedEditionData = selectedEditionsMock.configurator.selectedEdition;

<Meta title="Atoms/SelectedEdition" component={SelectedEdition} />

# SelectedEdition
<br />

## `SelectedEditions` are useful to display editions in contexts like product previews.
<br />

### Default
<Canvas>
    <Story name="Default">
        <SelectedEdition
            selectedEdition={selectedEditionData}
        />
    </Story>
</Canvas>


## Usage Example
<CollapsibleJsonSnippet
    summary="selectedEditionData"
    code={selectedEditionData}
/>

```jsx
import SelectedEdition from '@appdirect/sfb-theme-components/src/atoms/selected-edition/SelectedEdition';

<SelectedEdition data={selectedEditionData} />
```
## Props

<ArgsTable of={SelectedEdition} />
