import { createElement, render, useState } from 'rax';
import DriverUniversal from 'driver-universal';
import { Select, Button } from '@alifd/meet';
import View from 'rax-view';
import Text from 'rax-text';

import './index.css';

const data = [];
for (let i = 0; i < 20; i++) {
  data.push({
    label: `Option ${i}`,
    value: i,
  });
}
const sizes = ['small', 'medium', 'large'];

const SelectDemo = () => {
  const [val, setVal] = useState([]);
  const handleChange = (v) => {
    setVal(v);
  };

  return (
    <View>
      <Text className="demo-title">Mode</Text>
      <View className="demo-content">
        <Select
          mode="single"
          defaultValue={2}
          onChange={(v) => {
            console.log(v);
          }}
        >
          <Select.Option value={1}>option 1</Select.Option>
          <Select.Option value={2}>option 2</Select.Option>
          <Select.Option value={3}>option 3</Select.Option>
        </Select>
        <Select
          defaultValue={[2]}
          mode="multiple"
          onChange={(v) => {
            console.log(v);
          }}
        >
          <Select.Option value={1}>option 1</Select.Option>
          <Select.Option value={2}>option 2</Select.Option>
          <Select.Option value={3}>option 3</Select.Option>
          <Select.Option value={4}>option 4</Select.Option>
          <Select.Option value={5}>option 5</Select.Option>
          <Select.Option value={6}>option 6</Select.Option>
        </Select>
      </View>
    </View>
  );
};

// render(<SelectDemo />, null, { driver: DriverUniversal });
 export default SelectDemo