import snippets from './snippets';

export default {
  snippets,
  componentName: 'Mentions',
  title: '提及',
  category: '表单',
  group: "基础组件",
  props: [
    {
      name: 'defaultValue',
      title: { label: '默认值', tip: 'defaultValue | 默认值' },
      propType: 'string',
      setter: 'StringSetter'
    },
    {
      name: 'autoFocus',
      title: { label: '自动聚焦', tip: 'autoFocus | 自动聚焦' },
      propType: 'bool',
      defaultValue: false,
      setter: 'BoolSetter'
    },
    {
      name: 'filterOption',
      title: { label: '自定义过滤逻辑', tip: 'filterOption | 自定义过滤逻辑' },
      propType: { type: 'oneOfType', value: ['bool', 'func'] },
    },
    {
      name: 'notFoundContent',
      title: {
        label: '空值展示',
        tip: 'notFoundContent | 当下拉列表为空时显示的内容',
      },
      propType: 'node',
    },
    {
      name: 'placement',
      title: { label: '弹出层展示位置', tip: 'placement | 弹出层展示位置' },
      propType: { type: 'oneOf', value: ['top', 'bottom'] },
      setter: {
        componentName: 'RadioGroupSetter',
        props: {
          options: [
            {
              title: '上',
              value: 'top',
            },
            {
              title: '下',
              value: 'bottom',
            },
          ],
        },
      },
    },
    {
      name: 'prefix',
      title: { label: '设置触发关键字', tip: 'prefix | 设置触发关键字' },
      propType: {
        type: 'oneOfType',
        value: ['string', { type: 'arrayOf', value: 'string' }],
      },
    },
    {
      name: 'split',
      title: { label: '设置选中项前后分隔符', tip: 'split | 设置选中项前后分隔符' },
      propType: 'string',
    },
    {
      name: 'validateSearch',
      title: { label: '自定义触发验证逻辑', tip: 'validateSearch | 自定义触发验证逻辑' },
      propType: 'func',
    },
    {
      name: 'onChange',
      title: { label: '值改变时触发', tip: 'onChange | 值改变时触发' },
      propType: 'func',
    },
    {
      name: 'onSelect',
      title: { label: '选择选项时触发', tip: 'onSelect | 选择选项时触发' },
      propType: 'func',
    },
    {
      name: 'onSearch',
      title: { label: '搜索时触发', tip: 'onSearch | 搜索时触发' },
      propType: 'func',
    },
    {
      name: 'onFocus',
      title: { label: '获得焦点时触发', tip: 'onFocus | 获得焦点时触发' },
      propType: 'func',
    },
    {
      name: 'onBlur',
      title: { label: '失去焦点时触发', tip: 'onBlur | 失去焦点时触发' },
      propType: 'func',
    },
    {
      name: 'autoSize',
      title: {
        label: '内容高度',
        tip: 'autoSize | 自适应内容高度，可设置为 true | false 或对象：{ minRows: 2, maxRows: 6 }',
      },
      propType: { type: 'oneOfType', value: ['bool', 'object'] },
    },
    {
      name: 'onResize',
      title: { label: 'resize 回调', tip: 'onResize | resize 回调' },
      propType: 'func',
    },
  ],
  configure: {
    supports: {
      style: true,
      events: [
        {
          name: 'onChange',
          description: '值改变时触发',
          template: "\tonChange(text,${extParams}){\n\t\t// 值改变时触发\n\t\tconsole.log('onChange',text);\n\t}\n",
        },
        {
          name: 'onSelect',
          description: '选择选项时触发',
          template:
            "\tonSelect(option,prefix,${extParams}){\n\t\t// 选择选项时触发\n\t\tconsole.log('onSelect',option,prefix);\n\t}\n",
        },
        {
          name: 'onSearch',
          description: '搜索时触发',
          template:
            "\tonSearch(text,prefix,${extParams}){\n\t\t// 搜索时触发\n\t\tconsole.log('onSearch',text,prefix);\n\t}\n",
        },
        {
          name: 'onFocus',
          description: '获得焦点时触发',
          template: "\tonFocus(${extParams}){\n\t\t// 获得焦点时触发\n\t\tconsole.log('onFocus');\n\t}\n",
        },
        {
          name: 'onBlur',
          description: '失去焦点时触发',
          template: "\tonBlur(${extParams}){\n\t\t// 失去焦点时触发\n\t\tconsole.log('onBlur');\n\t}\n",
        },
        {
          name: 'onResize',
          description: 'resize 回调',
          template:
            "\tonResize({width,height},${extParams}){\n\t\t// resize 回调\n\t\tconsole.log('onResize',width,height);\n\t}\n",
        },
      ],
    },
  },
};