import React from 'react';
import BlockSwiper from './block-swiper';
import BlockRepeatImage from './block-repeat-image';
import BlockRepeatNumber from './block-repeat-number';
import BlockRepeatSelect from './block-repeat-select';
import BlockHead from './block-head';
import BlockList from "./block-list";
import BlockSketch from './block-sketch';
import connect from "../connect";

export interface Props {
  type:
    | 'swiper' // 轮播图
    | 'repeat-number' // 含数字的重复块
    | 'repeat-image' // 图文重复块
    | 'repeat-select' // 可选择的重复块
    | 'head' // 头部
    | 'list' // 列表
    | 'sketch'; // 设计稿块
}

/**
 * 区块
 */
const Block: React.FC<Props> = ({ type, ...otherProps }) => {
  if (type === 'swiper') return <BlockSwiper {...otherProps} />;
  if (type === 'repeat-image') return <BlockRepeatImage {...otherProps} />;
  if (type === 'repeat-number') return <BlockRepeatNumber {...otherProps} />;
  if (type === 'repeat-select') return <BlockRepeatSelect {...otherProps} />;
  if (type === 'head') return <BlockHead {...otherProps} />;
  if (type === 'list') return <BlockList {...otherProps} />;
  if (type === 'sketch') return <BlockSketch {...otherProps} />;
  return null;
};

export default connect(Block, {}, {
  'swiper': (BlockSwiper as any).default,
  'repeat-image': (BlockRepeatImage as any).default,
  'repeat-number': (BlockRepeatNumber as any).default,
  'repeat-select': (BlockRepeatSelect as any).default,
  'head': (BlockHead as any).default,
  'list': (BlockList as any).default,
  'sketch': (BlockSketch as any).default,
});