import { Meta, Story, Preview, Props } from '@storybook/addon-docs/blocks';

# Select Option
<Meta
  title='Select Option'
  component='fw-select-option'
   />

## Props

<Props of="fw-select-option"/>

## Usage

### Default
<Preview>
<Story name='Default'>{() => '<fw-select-option> am an ordinary Option</fw-select-option>'}</Story>
</Preview>

### Selected State
<Preview>
<Story name='Selected'>{() => '<fw-select-option selected="true">Sample Option</fw-select-option>'}</Story>
</Preview>

### Disabled State
<Preview>
<Story name='Disabled'>{() => `
    <fw-select-option disabled>I am the chosen one</fw-select-option>
    `}</Story>
</Preview>

### Multiple Options
<Preview>
<Story name='MultipleOptions'>{() => `
    <fw-select-option selected="true">I am the chosen one</fw-select-option>
    <fw-select-option>Me,nein</fw-select-option>
    <fw-select-option>I am another option</fw-select-option>
    <fw-select-option disabled>I am the chosen one</fw-select-option>
    `}</Story>
</Preview>

