import { Meta, Story, Canvas } from '@storybook/addon-docs/blocks';
import { CoolButton } from '../cool-button/cool-button';
import { addComponents } from '@storybook/aurelia';
import { text, withKnobs } from '@storybook/addon-knobs';
import Button from './button';

<Meta title="Welcome" component={CoolButton} decorators={[withKnobs]} />

# Welcome

This is a test document written in MDX that defines a `CoolButton` story wrapped in a `Canvas` doc block:

<Canvas withToolbar>
  <Story name="to Storybook">
    {{
      template: `<cool-button text.bind="testText"></cool-button>`,
      state: {
        testText: text('asfdafds', 'asasfdsa'),
      },
    }}
  </Story>
</Canvas>
