import * as React from 'react';
import { Col, Icon, Radio, Row, Space, Switch } from '@btri-ui/base';
import style from './index.less';

const Base = () => {
  return (
    <>
      <Row autoMode={true}>
        <Col span={2}>
          <Space direction="vertical">
            <div className={style.height}>开关类型</div>
            <div className={style.height}>大尺寸</div>
            <div className={style.height}>默认</div>
            <div className={style.height}>小尺寸</div>
          </Space>
        </Col>
        <Col span={4}>
          <Space direction="vertical">
            <div className={style.height}>默认样式</div>
            <div className={style.height}>
              <Radio.Group defaultValue="a" size="large">
                <Radio.Button value="a" iconName="Calendar"></Radio.Button>
                <Radio.Button value="b">上海</Radio.Button>
                <Radio.Button value="c" iconName="Copy">
                  佛山
                </Radio.Button>
              </Radio.Group>
            </div>
            <div className={style.height}>
              <Radio.Group defaultValue="a">
                <Radio.Button value="a" iconName="Calendar"></Radio.Button>
                <Radio.Button value="b">上海</Radio.Button>
                <Radio.Button value="c" iconName="Copy">
                  佛山
                </Radio.Button>
              </Radio.Group>
            </div>
            <div className={style.height}>
              <Radio.Group defaultValue="a" size="small">
                <Radio.Button value="a" iconName="Calendar"></Radio.Button>
                <Radio.Button value="b">上海</Radio.Button>
                <Radio.Button value="c" iconName="Copy">
                  佛山
                </Radio.Button>
              </Radio.Group>
            </div>
          </Space>
        </Col>
        <Col span={4}>
          <Space direction="vertical">
            <div className={style.height}>solid样式</div>
            <div className={style.height}>
              <Radio.Group defaultValue="a" size="large" buttonStyle="solid">
                <Radio.Button value="a" iconName="Calendar"></Radio.Button>
                <Radio.Button value="b">上海</Radio.Button>
                <Radio.Button value="c" iconName="Copy">
                  佛山
                </Radio.Button>
              </Radio.Group>
            </div>
            <div className={style.height}>
              <Radio.Group defaultValue="a" buttonStyle="solid">
                <Radio.Button value="a" iconName="Calendar"></Radio.Button>
                <Radio.Button value="b">上海</Radio.Button>
                <Radio.Button value="c" iconName="Copy">
                  佛山
                </Radio.Button>
              </Radio.Group>
            </div>
            <div className={style.height}>
              <Radio.Group defaultValue="a" size="small" buttonStyle="solid">
                <Radio.Button value="a" iconName="Calendar"></Radio.Button>
                <Radio.Button value="b">上海</Radio.Button>
                <Radio.Button value="c" iconName="Copy">
                  佛山
                </Radio.Button>
              </Radio.Group>
            </div>
          </Space>
        </Col>
      </Row>
      <Row autoMode={true}>
        <Col span={2}>
          <Space direction="vertical">
            <div className={style.height}>默认样式</div>
            <div className={style.height}>默认</div>
            <div className={style.height}>禁用</div>
          </Space>
        </Col>
        <Col span={4}>
          <Space direction="vertical">
            <div className={style.height}>默认样式</div>
            <div className={style.height}>
              <Radio.Group defaultValue="a" size="large">
                <Radio value="a">杭州</Radio>
                <Radio value="b">上海</Radio>
                <Radio value="c">佛山</Radio>
              </Radio.Group>
            </div>
            <div>
              <Radio.Group defaultValue="a" size="large" disabled>
                <Radio value="a">杭州</Radio>
                <Radio value="b">上海</Radio>
                <Radio value="c">佛山</Radio>
              </Radio.Group>
            </div>
          </Space>
        </Col>
      </Row>
    </>
  );
};

export default Base;