import * as React from "react";

import EditorObject from "@sc/modules/page/Builder/EditorObject";
import { Image } from "./live";
import { PluginProps } from "./types";
import PropertiesBuilder from "@sc/modules/v2/Properties/components/generator";
import _ from "lodash";
import imageSettings from "./settings";

const Properties: React.FC = (props) => {
  const { properties } = imageSettings;
  return <PropertiesBuilder data={properties} {...props} />;
};

/**
 * An Image
 */
export const EditorImage: React.FC<PluginProps> = (props) => {
  const { id, mode, settings } = props;

  return (
    <EditorObject title="Button" id={id} {...props} PropertiesView={Properties}>
      <Image {...settings} />
    </EditorObject>
  );
};

export default EditorImage;