import snippets from './snippets';

export default {
  snippets,
  componentName: 'PisellContactBrief',
  title: '联系人简要卡片',
  category: '数据展示',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  npm: {
    package: '@pisell/materials',
    version: '1.0.1',
    exportName: 'PisellContactBrief',
    main: 'src/index.tsx',
    destructuring: true,
    subName: '',
  },
  experimental: { hideSelectTools: true },
  configure: {
    component: { isContainer: false },
    supports: {
      style: true,
      events: [
        {
          name: 'onClick',
          template:
            "onClick(event,${extParams}){\n// 点击卡片时的回调\nconsole.log('onClick', event);}",
        },
        {
          name: 'onSubmit',
          template:
            "onSubmit(values,${extParams}){\n// 编辑弹窗提交后的回调，values 含 name/phone/email 及扩展字段\nconsole.log('onSubmit', values);}",
        },
        {
          name: 'onDelete',
          template:
            "onDelete(${extParams}){\n// 左滑删除确认后的回调\nconsole.log('onDelete');}",
        },
      ],
    },
    props: [
      {
        title: { label: { type: 'i18n', 'en-US': 'Data', 'zh-CN': '数据' } },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'name',
            title: {
              label: { type: 'i18n', 'en-US': 'Name', 'zh-CN': '姓名' },
              tip: 'name | 联系人姓名（主文案）',
            },
            propType: 'string',
            setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
            isRequired: true,
          },
          {
            name: 'phone',
            title: {
              label: { type: 'i18n', 'en-US': 'Phone', 'zh-CN': '电话' },
              tip: 'phone | 电话（与姓名同行的副标题）',
            },
            propType: 'string',
            setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
          },
          {
            name: 'email',
            title: {
              label: { type: 'i18n', 'en-US': 'Email', 'zh-CN': '邮箱' },
              tip: 'email | 邮箱（次级文案）',
            },
            propType: 'string',
            setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
          },
          {
            name: 'avatar',
            title: {
              label: { type: 'i18n', 'en-US': 'Avatar', 'zh-CN': '头像' },
              tip: 'avatar | 头像图片地址，不传则显示默认占位',
            },
            propType: 'string',
            setter: ['StringSetter', 'VariableSetter'],
          },
          {
            name: 'extraData',
            title: {
              label: { type: 'i18n', 'en-US': 'Extra Data', 'zh-CN': '扩展字段值' },
              tip: 'extraData | 扩展字段 key-value，与 extraFields 配置对应',
            },
            propType: 'object',
            setter: ['JsonSetter', 'VariableSetter'],
          },
          {
            name: 'extraFields',
            title: {
              label: { type: 'i18n', 'en-US': 'Extra Fields', 'zh-CN': '可增加字段配置' },
              tip: 'extraFields | 扩展字段配置 [{ key, label }]，顺序即展示与表单顺序',
            },
            propType: { type: 'arrayOf', value: 'object' },
            setter: {
              componentName: 'ArraySetter',
              props: {
                itemSetter: {
                  componentName: 'ObjectSetter',
                  props: {
                    config: {
                      items: [
                        { name: 'key', title: { label: '字段 key' }, propType: 'string', setter: ['StringSetter', 'VariableSetter'] },
                        { name: 'label', title: { label: '展示/表单项 label' }, propType: 'string', setter: ['PisellI18nSetter', 'StringSetter'] },
                      ],
                    },
                  },
                },
              },
            },
          },
        ],
      },
      {
        title: { label: { type: 'i18n', 'en-US': 'Visibility', 'zh-CN': '显隐' } },
        display: 'block',
        type: 'group',
        items: [
          { name: 'showAvatar', title: { label: '显示头像' }, propType: 'bool', defaultValue: true, setter: 'BoolSetter' },
          { name: 'showPhone', title: { label: '显示电话' }, propType: 'bool', defaultValue: true, setter: 'BoolSetter' },
          { name: 'showEmail', title: { label: '显示邮箱' }, propType: 'bool', defaultValue: true, 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'] },
            defaultValue: 'horizontal',
            setter: [
              {
                componentName: 'RadioGroupSetter',
                props: {
                  options: [
                    { title: '水平', value: 'horizontal' },
                    { title: '竖向', value: 'vertical' },
                  ],
                },
              },
              'VariableSetter',
            ],
          },
          { name: 'primaryLineClamp', title: { label: '主文案行数限制' }, propType: 'number', setter: ['NumberSetter', 'VariableSetter'] },
          { name: 'secondaryLineClamp', title: { label: '次级文案行数限制' }, propType: 'number', setter: ['NumberSetter', 'VariableSetter'] },
        ],
      },
      {
        title: { label: { type: 'i18n', 'en-US': 'Swipe Delete', 'zh-CN': '左滑删除' } },
        display: 'block',
        type: 'group',
        items: [
          { name: 'swipeToDelete', title: { label: '开启左滑删除' }, propType: 'bool', defaultValue: false, setter: 'BoolSetter' },
        ],
      },
      {
        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' },
          { name: 'clickable', title: { label: '可点击' }, propType: 'bool', defaultValue: true, setter: 'BoolSetter' },
          { name: 'disabled', title: { label: '禁用' }, propType: 'bool', defaultValue: false, setter: 'BoolSetter' },
        ],
      },
    ],
  },
};
