import snippets from './snippets';
import { fontSize, pxProp, stringProp } from '../_utils/css';

export default {
  snippets,
  componentName: 'AMCascadeRadio',
  docUrl: 'https://mobile.ant.design/zh/components/radio#radiogroup',
  title: '级联单选',
  category: '表单',
  group: '基础组件',
  props: [
    {
      name: 'value',
      title: { label: '当前值', tip: '当前选中的选项' },
      propType: { type: 'arrayOf', value: 'string' },
      setter: {
        componentName: 'ArraySetter',
        props: {
          itemSetter: {
            componentName: 'StringSetter',
          },
        },
      },
      supportVariable: true,
    },
    {
      name: 'options',
      title: { label: '数据', tip: 'columns | 数据' },
      propType: 'object',
      setter: 'JsonSetter',
      supportVariable: true,
    },
    {
      title: '单选框CSS变量',
      display: 'block',
      type: 'group',
      items: [
        fontSize('', '文字的字号'),
        pxProp('gap', '图标和文字的间距'),
        pxProp('icon-size', '图标的大小'),
      ],
    },

    {
      title: '间距CSS变量',
      display: 'block',
      type: 'group',
      items: [
        stringProp('space-gap', '间距大小', '间距大小'),
        stringProp('gap-horizontal', '水平间距'),
        stringProp('gap-vertical', '垂直间距'),
      ],
    },
  ],
  configure: {
    supports: {
      style: true,
      events: [
        {
          name: 'onChange',
          description: '值变化时的回调',
          template:
            "\tonChange(value,${extParams}){\n\t\t// 值变化时的回调\n\t\tconsole.log('onChange',value);\n\t}\n",
        },
      ],
    },
  },
};