// @ts-ignore
import React, { useEffect, useState } from 'react';
import { SelectCustom, TreeSelectCustom, Option, OptGroup, SHOW_PARENT } from '../index';
import { HomeOutlined } from '@ant-design/icons';
import './index.less';

const Demo3 = (props) => {
  const handleChange = (value) => {
    console.log(`selected ${value}`);
  };
  return (
    <SelectCustom
      defaultValue="研发一部"
      style={{
        width: 150,
      }}
      onChange={handleChange}
      showSearch={true}
      dropdownStyle={{ width: '280px' }}
      dropdownMatchSelectWidth={false}
      options={[
        {
          value: '熊猫智慧水务',
          label: (
            <div className="optionItem">
              <b className="optionValue">熊猫智慧水务</b>
            </div>
          ),
        },
        {
          value: '研发一部',
          label: (
            <div className="optionItem">
              <span className="optionValue">研发一部</span>
              <span className="optionTitle" title="熊猫智慧水务/产品研发部">
                熊猫智慧水务/产品研发部
              </span>
            </div>
          ),
        },
      ]}
    />
  );
};

export default Demo3;
