import React from 'react';
import { storiesOf } from '@storybook/react';
import { action } from '@storybook/addon-actions';
import { withInfo } from "@storybook/addon-info";
import { withKnobs, number, boolean, select } from "@storybook/addon-knobs";
import { addReadme } from 'storybook-readme';

import RichTextEditor from '@components/Editor/RichTextEditor';
import RichTextEditorForSlate from '@components/Editor/RichTextEditorForSlate';
import { BarftEditorPage } from '@components/Editor/BraftEditor';

const stories = storiesOf('Editor', module);
stories.addDecorator((storyFn) => <div style={{padding: "0px 40px"}}>{storyFn()}</div>)
stories.addDecorator(withKnobs);
stories.addDecorator(withInfo);
stories.addDecorator(addReadme);

stories.add(
  'RichTextEditor',
  () => (
    <RichTextEditor />
  ),
  {
    info: {
      inline: true,
    },
    notes: 'A very simple example of addon notes',
  }
)

stories.add(
  'RichTextEditorForSlate',
  () => (
    <RichTextEditorForSlate />
  ),
  {
    info: {
      inline: true,
    },
    notes: 'A very simple example of addon notes',
  }
)

stories.add(
  'BraftEditor',
  () => (
      <BarftEditorPage />
  ),
  {
    info: {
      inline: true,
    },
    notes: 'A very simple example of addon notes',
  }
)