/**
 * title: "横向排列"
 * description: "通过direction属性设置排列方向。"
 */
import React, { useState } from 'react';
import { Radio } from '@alicloud/console-components';

const List = [
  {
    label: '文字信息',
    value: 'A',
  },
  {
    label: '文字信息',
    value: 'B',
  },
  {
    label: '文字信息',
    value: 'C',
  },
  {
    label: '文字信息',
    value: 'D',
  },
];

export default () => {
  const [checkedList, setCheckedList] = useState<string | number>('');

  return (
    <div>
      <h5>单选合集标题</h5>
      <Radio.Group
        dataSource={List}
        value={checkedList}
        direction="hoz"
        onChange={(value) => setCheckedList(`${value}`)}
      />
    </div>
  );
};