import snippets from './snippets';

export default {
  snippets,
  componentName: 'PisellSingleSelect',
  title: '单选下拉',
  category: '表单',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  npm: {
    package: '@pisell/materials',
    version: '1.0.1',
    exportName: 'PisellSingleSelect',
    main: 'src/index.tsx',
    destructuring: true,
    subName: '',
  },
  configure: {
    props: [
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'Basic',
            'zh-CN': '基础配置',
          },
        },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'value',
            title: {
              label: '当前值',
              tip: 'value | 当前选中值（受控模式）',
            },
            propType: { type: 'oneOfType', value: ['string', 'number', 'null'] },
            setter: ['StringSetter', 'NumberSetter', 'VariableSetter'],
          },
          {
            name: 'defaultValue',
            title: {
              label: '默认值',
              tip: 'defaultValue | 默认选中值（非受控模式）',
            },
            propType: { type: 'oneOfType', value: ['string', 'number'] },
            setter: ['StringSetter', 'NumberSetter', 'VariableSetter'],
          },
          {
            name: 'options',
            title: {
              label: '选项列表',
              tip: 'options | 下拉选项列表（必填）',
            },
            propType: 'object',
            setter: [
              {
                componentName: 'ArraySetter',
                props: {
                  itemSetter: {
                    componentName: 'ObjectSetter',
                    props: {
                      config: {
                        items: [
                          {
                            name: 'value',
                            title: '值',
                            setter: ['StringSetter', 'NumberSetter'],
                            isRequired: true,
                          },
                          {
                            name: 'label',
                            title: '标签',
                            setter: ['PisellI18nSetter', 'StringSetter'],
                            isRequired: true,
                          },
                          {
                            name: 'disabled',
                            title: '禁用',
                            setter: 'BoolSetter',
                          },
                        ],
                      },
                    },
                  },
                },
              },
              'JsonSetter',
              'VariableSetter',
            ],
            isRequired: true,
          },
          {
            name: 'placeholder',
            title: {
              label: '占位文本',
              tip: 'placeholder | 输入框占位文本',
            },
            propType: 'string',
            setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
            defaultValue: '请选择',
          },
          {
            name: 'disabled',
            title: {
              label: '是否禁用',
              tip: 'disabled | 是否禁用状态',
            },
            propType: 'bool',
            setter: ['BoolSetter', 'VariableSetter'],
            defaultValue: false,
          },
          {
            name: 'readOnly',
            title: {
              label: '是否只读',
              tip: 'readOnly | 是否只读状态',
            },
            propType: 'bool',
            setter: ['BoolSetter', 'VariableSetter'],
            defaultValue: false,
          },
        ],
      },
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'Interaction',
            'zh-CN': '交互配置',
          },
        },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'showSearch',
            title: {
              label: '显示搜索',
              tip: 'showSearch | 是否显示搜索框',
            },
            propType: 'bool',
            setter: ['BoolSetter', 'VariableSetter'],
            defaultValue: false,
          },
          {
            name: 'allowClear',
            title: {
              label: '显示清空',
              tip: 'allowClear | 是否显示清空按钮',
            },
            propType: 'bool',
            setter: ['BoolSetter', 'VariableSetter'],
            defaultValue: false,
          },
          {
            name: 'size',
            title: {
              label: '尺寸',
              tip: 'size | 组件尺寸',
            },
            propType: { type: 'oneOf', value: ['small', 'medium', 'large'] },
            setter: [
              {
                componentName: 'RadioGroupSetter',
                props: {
                  options: [
                    {
                      title: '小',
                      value: 'small',
                    },
                    {
                      title: '中',
                      value: 'medium',
                    },
                    {
                      title: '大',
                      value: 'large',
                    },
                  ],
                },
              },
              'VariableSetter',
            ],
            defaultValue: 'medium',
          },
        ],
      },
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'Form',
            'zh-CN': '表单配置',
          },
        },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'label',
            title: {
              label: '标签文本',
              tip: 'label | 表单项标签',
            },
            propType: 'string',
            setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
          },
          {
            name: 'helperText',
            title: {
              label: '辅助文本',
              tip: 'helperText | 辅助提示文本',
            },
            propType: 'string',
            setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
          },
          {
            name: 'required',
            title: {
              label: '是否必填',
              tip: 'required | 是否为必填项',
            },
            propType: 'bool',
            setter: ['BoolSetter', 'VariableSetter'],
            defaultValue: false,
          },
          {
            name: 'error',
            title: {
              label: '错误状态',
              tip: 'error | 是否显示错误状态',
            },
            propType: 'bool',
            setter: ['BoolSetter', 'VariableSetter'],
            defaultValue: false,
          },
          {
            name: 'errorText',
            title: {
              label: '错误文本',
              tip: 'errorText | 错误提示文本',
            },
            propType: 'string',
            setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
          },
        ],
      },
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'Filter',
            'zh-CN': '筛选配置',
          },
        },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'filterable',
            title: {
              label: '启用过滤',
              tip: 'filterable | 是否启用过滤功能',
            },
            propType: 'bool',
            setter: ['BoolSetter', 'VariableSetter'],
            defaultValue: false,
          },
          {
            name: 'sortable',
            title: {
              label: '启用排序',
              tip: 'sortable | 是否启用排序功能',
            },
            propType: 'bool',
            setter: ['BoolSetter', 'VariableSetter'],
            defaultValue: false,
          },
          {
            name: 'sortDirection',
            title: {
              label: '排序方向',
              tip: 'sortDirection | 排序方向',
            },
            propType: { type: 'oneOf', value: ['asc', 'desc'] },
            setter: [
              {
                componentName: 'RadioGroupSetter',
                props: {
                  options: [
                    {
                      title: '升序',
                      value: 'asc',
                    },
                    {
                      title: '降序',
                      value: 'desc',
                    },
                  ],
                },
              },
              'VariableSetter',
            ],
          },
        ],
      },
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'Style',
            'zh-CN': '样式',
          },
        },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'className',
            title: {
              label: '样式类名',
              tip: 'className | 自定义样式类名',
            },
            propType: 'string',
            setter: 'StringSetter',
          },
          {
            name: 'style',
            title: {
              label: '自定义样式',
              tip: 'style | 自定义样式对象',
            },
            propType: 'object',
            setter: 'StyleSetter',
          },
        ],
      },
    ],
    supports: {
      style: true,
      events: [
        {
          name: 'onChange',
          template:
            "onChange(value, option, ${extParams}){\n// 值变化时的回调\nconsole.log('onChange', value, option);}",
        },
        {
          name: 'onSearch',
          template: "onSearch(keyword, ${extParams}){\n// 搜索回调\nconsole.log('onSearch', keyword);}",
        },
        {
          name: 'onFocus',
          template: "onFocus(event, ${extParams}){\n// 聚焦回调\nconsole.log('onFocus', event);}",
        },
        {
          name: 'onBlur',
          template: "onBlur(event, ${extParams}){\n// 失焦回调\nconsole.log('onBlur', event);}",
        },
        {
          name: 'onDropdownVisibleChange',
          template:
            "onDropdownVisibleChange(visible, ${extParams}){\n// 下拉框显隐回调\nconsole.log('onDropdownVisibleChange', visible);}",
        },
      ],
    },
    component: {},
  },
};