import snippets from './snippets';

export default {
  snippets,
  componentName: "DragSortTree",
  title: "拖拽排序",
  category: "数据展示",
  docUrl: "",
  screenshot: "",
  devMode: "proCode",
  npm: {
    package: "@pisell/materials",
    version: "1.0.1",
    exportName: "DragSortTree",
    main: "src/index.tsx",
    destructuring: true,
    subName: "",
  },
  props: [
    {
      title: '数据源',
      display: 'block',
      type: 'group',
      items: [
        {
          name: 'value',
          title: '列表数据源',
          propType: { type: 'arrayOf', value: 'any' },
          setter: ['JsonSetter', 'VariableSetter'],
        },
        {
          name: 'rowKey',
          title: {
            label: '行Key',
            tip: 'rowKey | 当 renderItem 自定义渲染列表项有效时，自定义每一行的 key 的获取方式',
          },
          propType: {
            type: 'oneOfType',
            value: ['string', 'function'],
          },
          defaultValue: 'id',
          setter: [
            'StringSetter',
            {
              componentName: 'FunctionSetter',
              props: {
                template:
                  'rowKey(item,${extParams}){\n// 自定义每一行的 key\nreturn `${item.id}`;\n}',
              },
            },
            'VariableSetter',
          ],
        },
        {
          name: 'className',
          title: {
            label: '样式类名',
            tip: 'className | 样式类名',
          },
          propType: 'string',
          setter: 'StringSetter',
        },
      ]
    },
    {
      name: "tabKey",
      title: { label: 'tabKey', tip: 'tabKey | 标识当前选中的tab' },
      propType: 'string',
    },
    {
      name: "hiddenKeys",
      title: { label: '折叠当前项', tip: 'hiddenKeys | 折叠当前项的keys' },
      propType: 'array',
    },
    {
      name: "titleRender",
      title: { label: '标题', tip: '是否自定义标题内容 | node/func' },
      propType: { type: 'oneOfType', value: ['node', 'func'] },
    },
    {
      name: "hiddenDraggableIcon",
      title: { label: "隐藏拖拽图标", tip: "是否隐藏拖拽图标 | 谨慎隐藏，移动端根据拖拽图标进行拖拽" },
      propType: "bool",
      defaultValue: false,
    },
    {
      name: "hiddenRightIcon",
      title: { label: "右侧图标", tip: "是否隐藏右侧图标" },
      propType: "bool",
      defaultValue: false,
    },
    {
      name: "hiddenWarningIcon",
      title: { label: "警告图标", tip: "子元素是否隐藏警告图标" },
      propType: "bool",
      defaultValue: false,
    },
  ],
  configure: {
    component: {
      isContainer: true,
    },
    supports: {
      style: true,
      events: [
        {
          name: 'onChange',
          template: 'onChange(value,${extParams}){\n// 排序 改变的回调\n}',
        },
        {
          name: 'onHiddenChange',
          template: 'onHiddenChange(value,${extParams}){\n// 折叠当前项的回调\n}',
        },
      ]
    },
  },
};