import snippets from './snippets';
import {
  formItemGeneralDataGroup,
  getFormItemGeneralInfoGroup,
  getFormItemValidateGroup,
  generalItemMap,
} from '../_utils/defaultSchema';

export default {
  snippets,
  componentName: 'FormItemInput.TextArea',
  title: '多行文本',
  category: '无代码表单',
  group: '无代码组件',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  npm: {
    package: '@pisell/materials',
    version: '1.0.1',
    exportName: 'FormItemInput',
    main: 'src/index.tsx',
    destructuring: true,
    subName: 'TextArea',
  },
  generalProps: [
    formItemGeneralDataGroup,
    getFormItemGeneralInfoGroup([
      generalItemMap['label'],
      generalItemMap['placeholder'],
      generalItemMap['tooltip'],
      generalItemMap['extra'],
      generalItemMap['hideLabel'],
      {
        name: 'rows',
        title: {
          label: {
            type: 'i18n',
            'en-US': 'Text area height',
            'zh-CN': '文本域高度',
          },
          tip: {
            type: 'i18n',
            'en-US': 'Text area height',
            'zh-CN': '文本域高度',
          },
        },
        setter: [
          {
            componentName: 'NumberSetter',
          },
        ],
      },
      {
        name: 'heightResize',
        title: {
          label: {
            type: 'i18n',
            'en-US': 'Height resize',
            'zh-CN': '高度可调节',
          },
          tip: {
            type: 'i18n',
            'en-US': 'Height resize',
            'zh-CN': '高度可调节',
          },
        },
        defaultValue: true,
        extraProps: {
          setValue(target: any, value: boolean) {
            target.getProps().setPropValue('innerStyle', {
              resize: value ? 'vertical' : 'none',
            });
            return target.getProps().setPropValue('heightResize', value);
          },
        },
        setter: [
          {
            componentName: 'BoolSetter',
          },
        ],
      },
      {
        name: 'showCount',
        title: {
          label: {
            type: 'i18n',
            'en-US': 'Show count',
            'zh-CN': '字数提示',
          },
          tip: {
            type: 'i18n',
            'en-US': 'Show count',
            'zh-CN': '是否展示字数提示',
          },
        },
        setter: [
          {
            componentName: 'BoolSetter',
          },
        ],
      },
      generalItemMap['renderMode'],
      generalItemMap['defaultValue'],
    ]),
    getFormItemValidateGroup([
      generalItemMap['requiredobj'],
      generalItemMap['minLengthobj'],
      generalItemMap['maxLengthobj'],
    ]),
  ],
  props: [
    {
      name: 'defaultValue',
      title: {
        label: {
          type: 'i18n',
          'en-US': 'Default value',
          'zh-CN': '默认值',
        },
        tip: {
          type: 'i18n',
          'en-US': 'Default value',
          'zh-CN': '默认内容',
        },
      },
      propType: 'string',
      setter: 'TextAreaSetter',
    },
    {
      name: 'value',
      title: {
        label: {
          type: 'i18n',
          'en-US': 'Current value',
          'zh-CN': '当前值',
        },
        tip: {
          type: 'i18n',
          'en-US': 'Current value',
          'zh-CN': '当前值',
        },
      },
      propType: 'string',
      setter: 'TextAreaSetter',
    },
    {
      name: 'bordered',
      title: {
        label: {
          type: 'i18n',
          'en-US': 'Bordered',
          'zh-CN': '显示边框',
        },
        tip: {
          type: 'i18n',
          'en-US': 'Bordered',
          'zh-CN': '是否有边框',
        },
      },
      propType: 'bool',
      defaultValue: true,
      setter: 'BoolSetter',
    },
    {
      name: 'disabled',
      title: {
        label: {
          type: 'i18n',
          'en-US': 'Disabled',
          'zh-CN': '是否禁用',
        },
        tip: {
          type: 'i18n',
          'en-US': 'Disabled',
          'zh-CN': '是否为禁用状态',
        },
      },
      propType: 'bool',
      defaultValue: false,
      setter: 'BoolSetter',
    },
    {
      name: 'placeholder',
      title: {
        label: {
          type: 'i18n',
          'en-US': 'Placeholder',
          'zh-CN': '占位提示',
        },
        tip: {
          type: 'i18n',
          'en-US': 'Placeholder',
          'zh-CN': '占位提示',
        },
      },
      propType: 'string',
      defaultValue: '请输入',
      setter: 'PisellI18nSetter',
    },
    {
      name: 'showCount',
      title: {
        label: {
          type: 'i18n',
          'en-US': 'Show count',
          'zh-CN': '展示字数',
        },
        tip: {
          type: 'i18n',
          'en-US': 'Show count',
          'zh-CN': '是否展示字数',
        },
      },
      propType: 'bool',
      defaultValue: false,
      setter: 'BoolSetter',
    },
    {
      name: 'id',
      title: {
        label: {
          type: 'i18n',
          'en-US': 'Input ID',
          'zh-CN': '输入框ID',
        },
        tip: {
          type: 'i18n',
          'en-US': 'Input ID',
          'zh-CN': '输入框的ID',
        },
      },
      propType: 'string',
      setter: 'StringSetter',
    },
    {
      name: 'maxLength',
      title: {
        label: {
          type: 'i18n',
          'en-US': 'Maximum length',
          'zh-CN': '最大长度',
        },
        tip: {
          type: 'i18n',
          'en-US': 'Maximum length',
          'zh-CN': '最大长度',
        },
      },
      propType: 'number',
      setter: 'NumberSetter',
    },
    {
      name: 'size',
      title: {
        label: {
          type: 'i18n',
          'en-US': 'Size',
          'zh-CN': '控件大小',
        },
        tip: {
          type: 'i18n',
          'en-US': 'Size',
          'zh-CN': '控件大小',
        },
      },
      propType: { type: 'oneOf', value: ['large', 'middle', 'small'] },
      setter: {
        componentName: 'RadioGroupSetter',
        props: {
          options: [
            {
              title: '大',
              value: 'large',
            },
            {
              title: '中',
              value: 'middle',
            },
            {
              title: '小',
              value: 'small',
            },
          ],
        },
      },
      defaultValue: 'middle',
    },
    {
      name: 'autoSize',
      title: {
        label: {
          type: 'i18n',
          'en-US': 'Auto size',
          'zh-CN': '高度自适应设置',
        },
        tip: {
          type: 'i18n',
          'en-US': 'Auto size',
          'zh-CN': '高度自适应设置',
        },
      },
      propType: {
        type: 'oneOfType',
        value: [
          'bool',
          {
            type: 'shape',
            value: [
              {
                name: 'minRows',
                title: {
                  type: 'i18n',
                  'en-US': 'Minimum rows',
                  'zh-CN': '最小行数',
                },
                setter: 'NumberSetter',
              },
              {
                name: 'maxRows',
                title: {
                  type: 'i18n',
                  'en-US': 'Maximum rows',
                  'zh-CN': '最大行数',
                },
                setter: 'NumberSetter',
              },
            ],
          },
        ],
      },
      defaultValue: false,
    },
    {
      name: 'onChange',
      title: { label: '输入框内容变化时的回调', tip: '输入框内容变化时的回调' },
      propType: 'func',
    },
    {
      name: 'onPressEnter',
      title: { label: '按下回车的回调', tip: '按下回车的回调' },
      propType: 'func',
    },
    {
      name: 'onResize',
      title: { label: 'resize 回调', tip: 'resize 回调' },
      propType: 'func',
    },
    {
      name: 'onFocus',
      title: { label: '获取焦点回调', tip: '获取焦点回调' },
      propType: 'func',
    },
    {
      name: 'onKeyDown',
      title: { label: '按键按下时的回调', tip: '按键按下时的回调' },
      propType: 'func',
    },
    {
      name: 'onKeyPress',
      title: { label: '按键按下后的回调', tip: '按键按下之后释放之前的回调' },
      propType: 'func',
    },
    {
      name: 'onKeyUp',
      title: { label: '按键释放回调', tip: '按键释放之后的回调' },
      propType: 'func',
    },
    {
      name: 'onBlur',
      title: { label: '失去焦点回调', tip: '失去焦点回调' },
      propType: 'func',
    },
  ],
  configure: {
    supports: {
      style: true,
      events: [
        {
          name: 'onChange',
          template:
            "onChange(event,${extParams}){\n// 输入框内容变化时的回调\nconsole.log('onChange',event);}",
        },
        {
          name: 'onPressEnter',
          template:
            "onPressEnter(event,${extParams}){\n// 按下回车的回调\nconsole.log('onPressEnter',event);}",
        },
        {
          name: 'onResize',
          template:
            "onResize({width,height},${extParams}){\n// resize 回调\nconsole.log('onResize',width,height);}",
        },
        {
          name: 'onFocus',
          template:
            "onFocus(event,${extParams}){\n// 获取焦点回调\nconsole.log('onFocus',event);}",
        },
        {
          name: 'onKeyDown',
          template:
            "onKeyDown(event,${extParams}){\n// 按键按下时的回调\nconsole.log('onKeyDown',event);}",
        },
        {
          name: 'onKeyPress',
          template:
            "onKeyPress(event,${extParams}){\n// 按键按下后的回调\nconsole.log('onKeyPress',event);}",
        },
        {
          name: 'onKeyUp',
          template:
            "onKeyUp(event,${extParams}){\n// 按键释放回调\nconsole.log('onKeyUp',event);}",
        },
        {
          name: 'onBlur',
          template:
            "onBlur(event,${extParams}){\n// 按键释放回调\nconsole.log('onBlur',event);}",
        },
      ],
    },
  },
};