import snippets from './snippets';
import { stringProp } from '../_utils/css';

export default {
  snippets,
  componentName: 'AMErrorBlock',
  docUrl: 'https://mobile.ant.design/zh/components/error-block',
  title: '异常区块',
  category: '反馈',
  group: '基础组件',
  props: [
    {
      name: 'title',
      title: {
        label: '标题',
        tip: 'title | 标题',
      },
      propType: {
        type: 'oneOfType',
        value: ['node', 'string'],
      },
      setter: ['SlotSetter', 'StringSetter', 'VariableSetter'],
    },
    {
      name: 'description',
      title: {
        label: '描述',
        tip: 'description | 描述',
      },
      propType: {
        type: 'oneOfType',
        value: ['node', 'string'],
      },
      setter: ['SlotSetter', 'StringSetter', 'VariableSetter'],
    },
    {
      name: 'image',
      title: {
        label: '图片',
        tip: 'image | 图片',
      },
      propType: {
        type: 'oneOfType',
        value: ['node', 'string'],
      },
      setter: ['SlotSetter', 'StringSetter', 'VariableSetter'],
    },
    {
      name: 'status',
      title: { label: '错误类型', tip: 'status | 错误类型' },
      propType: {
        type: 'oneOf',
        value: ['default', 'disconnected', 'empty', 'busy'],
      },
      setter: [
        {
          componentName: 'SelectSetter',
          props: {
            options: [
              {
                title: '默认',
                value: 'default',
              },
              {
                title: '网络异常',
                value: 'disconnected',
              },
              {
                title: '空异常',
                value: 'empty',
              },
              {
                title: '繁忙异常',
                value: 'busy',
              },
            ],
          },
        },
        'VariableSetter',
      ],
      defaultValue: 'default',
    },
    {
      name: 'fullPage',
      title: { label: '整页异常', tip: 'fullPage | 是否懒加载' },
      propType: 'bool',
      setter: 'BoolSetter',
      supportVariable: true,
    },
    {
      title: 'CSS变量',
      display: 'block',
      type: 'group',
      items: [
        stringProp('image-height', '图片高度', '图片高度', '仅支持 px rem 和 vw 单位'),
        stringProp(
          'image-height-full-page',
          '整页模式下的图片高度',
          '整页模式下的图片高度',
          '仅支持 px rem 和 vw 单位',
        ),
      ],
    },
  ],
  configure: {
    supports: {
      style: true,
      events: [
        {
          name: 'onError',
          template: "onError(${extParams}){\n// 图片加载失败的事件\nconsole.log('onError');}",
        },
      ],
    },
  },
};