import snippets from './snippets';

export default {
  snippets,
  componentName: 'PisellCustomerBrief',
  title: '客户简要卡片',
  category: '数据展示',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  npm: {
    package: '@pisell/materials',
    version: '1.0.1',
    exportName: 'PisellCustomerBrief',
    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: '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: 'subtitle',
            title: {
              label: { type: 'i18n', 'en-US': 'Subtitle', 'zh-CN': '副标题' },
              tip: 'subtitle | 与主标题同行（如电话、客户编号）',
            },
            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: 'email',
            title: { label: { type: 'i18n', 'en-US': 'Email', 'zh-CN': '邮箱' }, tip: '扩展信息' },
            propType: 'string',
            setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
          },
          {
            name: 'address',
            title: { label: { type: 'i18n', 'en-US': 'Address', 'zh-CN': '地址' }, tip: '扩展信息' },
            propType: 'string',
            setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
          },
          {
            name: 'company',
            title: { label: { type: 'i18n', 'en-US': 'Company', 'zh-CN': '公司' }, tip: '扩展信息' },
            propType: 'string',
            setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
          },
          {
            name: 'date',
            title: { label: { type: 'i18n', 'en-US': 'Date', 'zh-CN': '日期' }, tip: '扩展信息（如创建日期）' },
            propType: 'string',
            setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
          },
          {
            name: 'extendedFields',
            title: {
              label: { type: 'i18n', 'en-US': 'Extended Fields', 'zh-CN': '自定义扩展字段' },
              tip: 'extendedFields | [{ text, showTooltip? }]，顺序即展示顺序',
            },
            propType: { type: 'arrayOf', value: 'object' },
            setter: {
              componentName: 'ArraySetter',
              props: {
                itemSetter: {
                  componentName: 'ObjectSetter',
                  props: {
                    config: {
                      items: [
                        { name: 'text', title: { label: '文本' }, propType: 'string', setter: ['PisellI18nSetter', 'StringSetter'] },
                        { name: 'showTooltip', title: { label: '显示提示图标' }, propType: 'bool', setter: 'BoolSetter' },
                      ],
                    },
                  },
                },
              },
            },
          },
          {
            name: 'tags',
            title: {
              label: { type: 'i18n', 'en-US': 'Tags', 'zh-CN': '标签' },
              tip: 'tags | 如等级、状态，顺序即展示顺序',
            },
            propType: { type: 'arrayOf', value: 'object' },
            setter: {
              componentName: 'ArraySetter',
              props: {
                itemSetter: {
                  componentName: 'ObjectSetter',
                  props: {
                    config: {
                      items: [
                        { name: 'text', title: { label: '文本' }, propType: 'string', setter: ['PisellI18nSetter', 'StringSetter'] },
                        { name: 'style', title: { label: '样式' }, propType: 'object', setter: 'StyleSetter' },
                      ],
                    },
                  },
                },
              },
            },
          },
          {
            name: 'actions',
            title: {
              label: { type: 'i18n', 'en-US': 'Actions', 'zh-CN': '操作项' },
              tip: 'actions | 需开启 showActions；支持 text/button/icon',
            },
            propType: { type: 'arrayOf', value: 'object' },
            setter: {
              componentName: 'ArraySetter',
              props: {
                itemSetter: {
                  componentName: 'ObjectSetter',
                  props: {
                    config: {
                      items: [
                        {
                          name: 'type',
                          title: { label: '形式' },
                          propType: { type: 'oneOf', value: ['text', 'button', 'icon'] },
                          setter: 'RadioGroupSetter',
                        },
                        { name: 'label', title: { label: '文案' }, propType: 'string', setter: ['PisellI18nSetter', 'StringSetter'] },
                        { name: 'icon', title: { label: '图标' }, propType: 'node', setter: 'SlotSetter' },
                        { name: 'style', title: { label: '样式' }, propType: 'object', setter: 'StyleSetter' },
                        { name: 'className', title: { label: '类名' }, propType: 'string', setter: '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: 'showPrimaryText', title: { label: '显示主文案' }, propType: 'bool', defaultValue: true, setter: 'BoolSetter' },
          { name: 'showSubtitle', title: { label: '显示副标题' }, propType: 'bool', defaultValue: true, setter: 'BoolSetter' },
          { name: 'showExtended', title: { label: '显示扩展信息' }, propType: 'bool', defaultValue: true, setter: 'BoolSetter' },
          { name: 'showTags', title: { label: '显示标签' }, propType: 'bool', defaultValue: true, setter: 'BoolSetter' },
          { name: 'showActions', title: { label: '显示操作区' }, propType: 'bool', defaultValue: false, setter: 'BoolSetter' },
        ],
      },
      {
        title: { label: { type: 'i18n', 'en-US': 'Layout', 'zh-CN': '密度与布局' } },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'density',
            title: { label: '信息密度', tip: 'B1/B2/B5/B9' },
            propType: { type: 'oneOf', value: ['B1', 'B2', 'B5', 'B9'] },
            defaultValue: 'B2',
            setter: [
              {
                componentName: 'RadioGroupSetter',
                props: {
                  options: [
                    { title: 'B1-一行', value: 'B1' },
                    { title: 'B2-两行', value: 'B2' },
                    { title: 'B5-五行', value: 'B5' },
                    { title: 'B9-全部', value: 'B9' },
                  ],
                },
              },
              'VariableSetter',
            ],
          },
          {
            name: 'layout',
            title: { label: '布局方向' },
            propType: { type: 'oneOf', value: ['horizontal', 'vertical'] },
            defaultValue: 'horizontal',
            setter: ['RadioGroupSetter', 'VariableSetter'],
          },
          {
            name: 'width',
            title: { label: '卡片宽度', tip: 'content | full | 数字(px)' },
            propType: { type: 'oneOfType', value: ['string', 'number'] },
            defaultValue: 'content',
            setter: ['StringSetter', 'NumberSetter', 'VariableSetter'],
          },
          {
            name: 'tagPosition',
            title: { label: '标签位置' },
            propType: { type: 'oneOf', value: ['inline', 'below'] },
            defaultValue: 'below',
            setter: 'RadioGroupSetter',
          },
          { name: 'contentGap', title: { label: '内容间距' }, propType: { type: 'oneOfType', value: ['number', 'string'] }, setter: ['NumberSetter', 'StringSetter'] },
          { 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' },
        ],
      },
    ],
  },
};
