import snippets from './snippets';

export default {
  snippets,
  componentName: 'PisellActionPanel',
  title: '操作面板',
  category: '通用',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  npm: {
    package: '@pisell/materials',
    version: '1.0.1',
    exportName: 'PisellActionPanel',
    main: 'src/index.tsx',
    destructuring: true,
    subName: '',
  },
  experimental: { hideSelectTools: true },
  configure: {
    component: { isContainer: false },
    supports: {
      style: true,
      events: [],
    },
    props: [
      {
        title: { label: { type: 'i18n', 'en-US': 'Data', 'zh-CN': '数据' } },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'groups',
            title: {
              label: { type: 'i18n', 'en-US': 'Groups', 'zh-CN': '操作分组' },
              tip: 'groups | 分组列表，每组含 items 操作项',
            },
            propType: { type: 'arrayOf', value: 'object' },
            setter: {
              componentName: 'ArraySetter',
              props: {
                itemSetter: {
                  componentName: 'ObjectSetter',
                  props: {
                    config: {
                      items: [
                        {
                          name: 'items',
                          title: { label: '操作项列表' },
                          propType: { type: 'arrayOf', value: 'object' },
                          setter: {
                            componentName: 'ArraySetter',
                            props: {
                              itemSetter: {
                                componentName: 'ObjectSetter',
                                props: {
                                  config: {
                                    items: [
                                      { name: 'label', title: { label: '文案' }, propType: 'string', setter: ['PisellI18nSetter', 'StringSetter'] },
                                      { name: 'priority', title: { label: '层级' }, propType: { type: 'oneOf', value: ['primary', 'secondary', 'danger', 'default'] }, setter: 'RadioGroupSetter' },
                                      { name: 'visible', title: { label: '显示' }, propType: 'bool', setter: 'BoolSetter' },
                                      { name: 'disabled', title: { label: '禁用' }, propType: 'bool', setter: 'BoolSetter' },
                                    ],
                                  },
                                },
                              },
                            },
                          },
                        },
                        { name: 'visible', title: { label: '显示该组' }, propType: 'bool', setter: 'BoolSetter' },
                      ],
                    },
                  },
                },
              },
            },
          },
        ],
      },
      {
        title: { label: { type: 'i18n', 'en-US': 'Layout', 'zh-CN': '布局' } },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'layout',
            title: { label: '布局方式' },
            propType: { type: 'oneOf', value: ['horizontal', 'vertical', 'grid'] },
            defaultValue: 'horizontal',
            setter: [
              {
                componentName: 'RadioGroupSetter',
                props: {
                  options: [
                    { title: '水平', value: 'horizontal' },
                    { title: '竖向', value: 'vertical' },
                    { title: '网格', value: 'grid' },
                  ],
                },
              },
              'VariableSetter',
            ],
          },
          {
            name: 'align',
            title: { label: '对齐方式' },
            propType: { type: 'oneOf', value: ['left', 'center', 'right', 'space-between'] },
            defaultValue: 'left',
            setter: [
              {
                componentName: 'RadioGroupSetter',
                props: {
                  options: [
                    { title: '左', value: 'left' },
                    { title: '居中', value: 'center' },
                    { title: '右', value: 'right' },
                    { title: '两端', value: 'space-between' },
                  ],
                },
              },
              'VariableSetter',
            ],
          },
          {
            name: 'overflowStrategy',
            title: { label: '溢出策略' },
            propType: { type: 'oneOf', value: ['wrap', 'scroll', 'moreMenu'] },
            defaultValue: 'wrap',
            setter: 'RadioGroupSetter',
          },
          { name: 'groupGap', title: { label: '组间距' }, propType: { type: 'oneOfType', value: ['number', 'string'] }, setter: ['NumberSetter', 'StringSetter'] },
          { name: 'itemGap', title: { label: '项间距' }, propType: { type: 'oneOfType', value: ['number', 'string'] }, defaultValue: 8, setter: ['NumberSetter', 'StringSetter'] },
        ],
      },
      {
        title: { label: { type: 'i18n', 'en-US': 'Base', 'zh-CN': '基础' } },
        display: 'block',
        type: 'group',
        items: [
          { name: 'className', title: { label: '样式类名' }, propType: 'string', setter: 'StringSetter' },
          { name: 'style', title: { label: '样式' }, propType: 'object', setter: 'StyleSetter' },
        ],
      },
    ],
  },
};
