/**
 * title: "下拉按钮"
 * description: "最简单的用法。支持 Button 的 shape, type, size, component, ghost 等属性透传"
 */
import React from 'react';
import { MenuButton } from '@alicloud/console-components';

const centerStyle = {
  display: 'flex',
  gap: '16px',
};

export default () => {
  const menuList = ['选项1', '选项2', '选项3'].map((item) => (
    <MenuButton.Item key={item}>{item}</MenuButton.Item>
  ));
  return (
    <div style={centerStyle}>
      <MenuButton type="primary" label="基础按钮">
        {menuList}
      </MenuButton>
      <MenuButton type="secondary" label="基础按钮">
        {menuList}
      </MenuButton>
      <MenuButton label="基础按钮" type="primary" disabled>
        {menuList}
      </MenuButton>
    </div>
  );
};