import snippets from './snippets';

import items from '../anfa-menu/items'

export default {
  snippets,
  componentName: 'Dropdown',
  title: '下拉菜单',
  category: '导航',
  group: 'Antd组件',
  props: [
    {
      name: 'arrow',
      title: { label: '显示下拉箭头', tip: '下拉箭头是否显示' },
      propType: 'bool',
      defaultValue: false,
      setter: 'BoolSetter',
    },
    {
      name: 'autoAdjustOverflow',
      title: { label: '自动调整溢出', tip: '下拉框被遮挡时自动调整位置' },
      propType: 'bool',
      defaultValue: true,
      setter: 'BoolSetter',
    },
    {
      name: 'autoFocus',
      title: { label: '自动聚焦', tip: '打开后自动聚焦下拉框' },
      propType: 'bool',
      defaultValue: false,
      setter: 'BoolSetter',
    },
    {
      name: 'disabled',
      title: { label: '是否禁用', tip: '菜单是否禁用' },
      propType: 'bool',
      setter: 'BoolSetter',
    },
    {
      name: 'destroyPopupOnHide',
      title: { label: '关闭销毁', tip: '关闭后是否销毁 Dropdown' },
      propType: 'bool',
      defaultValue: false,
      setter: 'BoolSetter',
    },
    {
      name: 'dropdownRender',
      title: { label: '自定义下拉内容', tip: '自定义下拉内容渲染函数' },
      propType: 'func',
      setter: 'FunctionSetter',
    },
    {
      name: 'getPopupContainer',
      title: { label: '渲染父节点', tip: '菜单渲染父节点，默认渲染到 body' },
      propType: 'func',
      setter: 'FunctionSetter',
    },
    {
      name: 'menu',
      title: { label: '菜单项', tip: '菜单项配置，推荐用法，4.24.0+' },
      propType: 'array',
      setter: {
        componentName: 'ArraySetter',
        props:items
      },
    },
    {
      name: 'overlayClassName',
      title: { label: '下拉类名', tip: '下拉根元素的类名' },
      propType: 'string',
      setter: 'StringSetter',
    },
    {
      name: 'overlayStyle',
      title: { label: '下拉样式', tip: '下拉根元素的样式' },
      propType: 'object',
      setter: 'StyleSetter',
    },
    {
      name: 'placement',
      title: { label: '弹出位置', tip: '菜单弹出位置' },
      propType: {
        type: 'oneOf',
        value: ['bottomLeft', 'bottom', 'bottomRight', 'topLeft', 'top', 'topRight'],
      },
      defaultValue: 'bottomLeft',
      setter: {
        componentName: 'SelectSetter',
        props: {
          options: [
            { label: 'bottomLeft', value: 'bottomLeft' },
            { label: 'bottom', value: 'bottom' },
            { label: 'bottomRight', value: 'bottomRight' },
            { label: 'topLeft', value: 'topLeft' },
            { label: 'top', value: 'top' },
            { label: 'topRight', value: 'topRight' },
          ],
        },
      },
    },
    {
      name: 'trigger',
      title: { label: '触发行为', tip: '触发下拉的行为, 移动端不支持 hover' },
      propType: {
        type: 'arrayOf',
        value: { type: 'oneOf', value: ['click', 'hover', 'contextMenu'] },
      },
      defaultValue: ['click'],
      setter: {
        componentName: 'SelectSetter',
        props: {
          mode: 'multiple',
          options: [
            { label: 'click', value: 'click' },
            { label: 'hover', value: 'hover' },
            { label: 'contextMenu', value: 'contextMenu' },
          ],
          defaultValue: ['click'],
        },
      },
    },
    {
      name: 'onOpenChange',
      title: { label: '显示状态回调', tip: '菜单显示状态改变时调用，参数为 open' },
      propType: 'func',
      setter: 'FunctionSetter',
    },
  ],
  configure: {
    supports: {
      style: true,
      events: [
        {
          name: 'onClick',
          title: '点击菜单项的回调',
          template:
            "onClick(event,${extParams}){\n// 点击菜单项时回调\nconsole.log('onClick', event);}",
        },
        {
          name: 'onSelect',
          title: '被选中时调用',
          template:
            "onSelect(event,${extParams}){\n// 菜单项被选中时回调\nconsole.log('onSelect', event);}",
        },
        {
          name: 'onDeselect',
          title: '取消选中时调用',
          template:
            "onDeselect(event,${extParams}){\n// 菜单项取消选中时回调\nconsole.log('onDeselect', event);}",
        },
        {
          name: 'onOpenChange',
          title: '展开/收起子菜单时调用',
          template:
            "onOpenChange(event,${extParams}){\n// 展开/收起子菜单时回调\nconsole.log('onOpenChange', event);}",
        },
      ],
    },
  }
};