import snippets from './snippets';

export default {
  snippets,
  componentName: 'PisellEntityCard',
  title: '实体卡片',
  category: '数据展示',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  npm: {
    package: '@pisell/materials',
    version: '1.0.1',
    exportName: 'PisellEntityCard',
    main: 'src/index.tsx',
    destructuring: true,
    subName: '',
  },
  experimental: { hideSelectTools: true },
  configure: {
    component: { isContainer: true },
    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: 'primaryText',
            title: {
              label: { type: 'i18n', 'en-US': 'Primary Text', 'zh-CN': '主文案' },
              tip: 'primaryText | 主标题/名称',
            },
            propType: 'string',
            setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
          },
          {
            name: 'subtitleText',
            title: {
              label: { type: 'i18n', 'en-US': 'Subtitle', 'zh-CN': '副标题' },
              tip: 'subtitleText | 与主标题同行、紧跟主标题后的副标题',
            },
            propType: 'string',
            setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
          },
          {
            name: 'secondaryTexts',
            title: {
              label: { type: 'i18n', 'en-US': 'Secondary Texts', 'zh-CN': '次级文案列表' },
              tip: 'secondaryTexts | 次级信息，顺序即展示顺序',
            },
            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: 'media',
            title: {
              label: { type: 'i18n', 'en-US': 'Media', 'zh-CN': '媒体区' },
              tip: 'media | 头像/缩略图/图标配置',
            },
            propType: 'object',
            setter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      name: 'type',
                      title: { label: { type: 'i18n', 'en-US': 'Type', 'zh-CN': '类型' } },
                      propType: { type: 'oneOf', value: ['avatar', 'thumbnail', 'icon'] },
                      setter: [
                        {
                          componentName: 'RadioGroupSetter',
                          props: {
                            options: [
                              { title: '头像', value: 'avatar' },
                              { title: '缩略图', value: 'thumbnail' },
                              { title: '图标', value: 'icon' },
                            ],
                          },
                        },
                        'VariableSetter',
                      ],
                    },
                    { name: 'src', title: { label: '图片地址' }, propType: 'string', setter: ['StringSetter', 'VariableSetter'] },
                    { name: 'alt', title: { label: '替换文本' }, propType: 'string', setter: ['PisellI18nSetter', 'StringSetter'] },
                    { name: 'size', title: { label: '尺寸' }, propType: { type: 'oneOfType', value: ['number', 'string'] }, setter: ['NumberSetter', 'StringSetter', 'VariableSetter'] },
                    {
                      name: 'shape',
                      title: { label: '形状' },
                      propType: { type: 'oneOf', value: ['circle', 'square'] },
                      setter: [
                        {
                          componentName: 'RadioGroupSetter',
                          props: {
                            options: [
                              { title: '圆形', value: 'circle' },
                              { title: '方形', value: 'square' },
                            ],
                          },
                        },
                        'VariableSetter',
                      ],
                    },
                    { name: 'color', title: { label: '图标颜色' }, propType: 'string', setter: ['ColorSetter', 'StringSetter'] },
                    { name: 'icon', title: { label: '图标' }, propType: 'node', setter: 'SlotSetter' },
                  ],
                },
              },
            },
          },
          {
            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）',
            },
            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: 'showMedia', title: { label: '显示媒体区' }, propType: 'bool', defaultValue: true, setter: 'BoolSetter' },
          { name: 'showPrimaryText', title: { label: '显示主文案' }, propType: 'bool', defaultValue: true, setter: 'BoolSetter' },
          { name: 'showSecondaryText', 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 Card', 'zh-CN': '基础卡片' } },
        display: 'block',
        type: 'group',
        items: [
          { name: 'className', title: { label: '样式类名' }, propType: 'string', setter: ['PisellI18nSetter', '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' },
        ],
      },
      {
        title: { label: { type: 'i18n', 'en-US': 'Slots', 'zh-CN': '插槽' } },
        display: 'block',
        type: 'group',
        items: [
          { name: 'renderMedia', title: { label: '自定义媒体区' }, propType: 'func', setter: 'SlotSetter' },
          { name: 'renderPrimary', title: { label: '自定义主文案' }, propType: 'func', setter: 'SlotSetter' },
          { name: 'renderSecondary', title: { label: '自定义次级文案' }, propType: 'func', setter: 'SlotSetter' },
          { name: 'renderTags', title: { label: '自定义标签区' }, propType: 'func', setter: 'SlotSetter' },
          { name: 'renderActions', title: { label: '自定义操作区' }, propType: 'func', setter: 'SlotSetter' },
        ],
      },
    ],
  },
};
