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

import {
  sampleContentData,
  EditorWithCustomData,
} from "@sc/modules/page/Builder/Builder.stories";

import SectionEditorWidget from "./SectionEditorWidget";
import EditorSection from "./EditorSection";
import LiveSection from "./LiveSection";

export default {
  title: "Plugins|Page Sections/SectionEditorWidget",
  component: SectionEditorWidget,
  subcomponents: { EditorSection, LiveSection },
  excludeStories: /.*Data$/,
};

export const Default: any = () => (
  <SectionEditorWidget>
    <span onClick={() => action("Clicked")}>This is an action!</span>
  </SectionEditorWidget>
);

export const InTheEditor: React.FC = () => {
  return (
    <EditorWithCustomData
      content={[
        // { id: "CustomField", parent: "u5j1r64m5rf", ...settings.default },
        ...sampleContentData,
      ]}
    />
  );
};

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