import * as React from "react";
import { action } from "@storybook/addon-actions";
import { withKnobs, text, boolean, select } from "@storybook/addon-knobs";
import { DndProvider } from "react-dnd";
import Backend from "react-dnd-html5-backend";

import EditorObject, { EditorObjectState } from "./EditorObject";

export default {
  title: "Modules|Editor/EditorObject",
  component: EditorObject,
  decorators: [withKnobs],
};

export const Default: any = () => (
  <DndProvider backend={Backend}>
    <EditorObject
      id="sample"
      title="Sample Object"
      state={select("State", EditorObjectState, EditorObjectState.ACTIVE)}
    >
      <span onClick={() => action("Clicked")}>This is an action!</span>
    </EditorObject>
  </DndProvider>
);

Default.story = {
  parameters: {
    jest: ["EditorObject"],
  },
};