// eslint-disable-next-line @typescript-eslint/no-unused-vars
import { IPublicTypeComponentMetadata, IPublicTypeSnippet } from '@alilc/lowcode-types';

const SwiperMeta: IPublicTypeComponentMetadata = {
  componentName: 'Swiper',
  title: 'Swiper',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  group: '基础组件',
  category: '展示组件',
  npm: {
    package: 'kernelsoft-lowcode-material',
    version: '0.1.1-alpha1',
    exportName: 'Swiper',
    main: 'src/index.tsx',
    destructuring: true,
    subName: '',
  },
  configure: {
    props: [
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'items',
            'zh-CN': '选项',
          },
        },
        name: 'items',
        setter: {
          componentName: 'MixedSetter',
          props: {
            setters: [
              'ExpressionSetter',
              {
                componentName: 'ArraySetter',
                props: {
                  itemSetter: {
                    componentName: 'SlotSetter',
                  },
                },
              },
            ],
          },
        },
      },
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'width',
            'zh-CN': '宽度',
          },
        },
        name: 'width',
        setter: {
          componentName: 'MixedSetter',
          props: {
            setters: [
              {
                componentName: 'StringSetter',
                isRequired: false,
                initialValue: '',
              },
              {
                componentName: 'NumberSetter',
                isRequired: false,
                initialValue: 0,
              },
            ],
          },
          isRequired: true,
        },
      },
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'height',
            'zh-CN': '高度',
          },
        },
        name: 'height',
        setter: {
          componentName: 'MixedSetter',
          props: {
            setters: [
              {
                componentName: 'StringSetter',
                isRequired: false,
                initialValue: '',
              },
              {
                componentName: 'NumberSetter',
                isRequired: false,
                initialValue: 0,
              },
            ],
          },
          isRequired: true,
        },
      },
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'duration',
            'zh-CN': '动画市场',
          },
        },
        name: 'duration',
        setter: {
          componentName: 'NumberSetter',
        },
      },
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'autoPlay',
            'zh-CN': '自动轮播时长',
          },
        },
        name: 'autoPlay',
        setter: {
          componentName: 'NumberSetter',
        },
      },
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'direction',
            'zh-CN': '轮播方向',
          },
        },
        name: 'direction',
        setter: {
          componentName: 'RadioGroupSetter',
          props: {
            dataSource: [
              {
                label: 'horizontal',
                value: 'horizontal',
              },
              {
                label: 'vertical',
                value: 'vertical',
              },
            ],
            options: [
              {
                label: 'horizontal',
                value: 'horizontal',
              },
              {
                label: 'vertical',
                value: 'vertical',
              },
            ],
          },
          initialValue: 'horizontal',
        },
      },
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'loop',
            'zh-CN': '是否循环轮播',
          },
        },
        name: 'loop',
        setter: {
          componentName: 'BoolSetter',
          isRequired: true,
          initialValue: false,
        },
      },
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'touchable',
            'zh-CN': '是否可触摸滑动',
          },
        },
        name: 'touchable',
        setter: {
          componentName: 'BoolSetter',
          isRequired: true,
          initialValue: false,
        },
      },
    ],
    supports: {
      className: true,
      style: true,
    },
    component: {},
  },
};
// const snippets = [
//   {
//     title: '轮播',
//     screenshot: '',
//     schema: {
//       componentName: 'Swiper',
//       props: {
//         items: [1, 2, 3],
//       },
//     },
//   },
// ];

export default {
  ...SwiperMeta,
  // snippets,
};
