import React from "react";
import { Icon, Bubble, Copy } from "@tencent/tea-component";

const largeIconTypes = ["warning", "error", "pending", "infoblue", "success"];

export default function IconExample() {
  return largeIconTypes.map(type => (
    <Bubble key={type} content={`<Icon type="${type}" size="l" />`}>
      <Copy
        text={`<Icon type="${type}" size="l" />`}
        tips={copied =>
          copied ? (
            "复制成功"
          ) : (
            <>
              <div style={{ textAlign: "center" }}>点击复制</div>
              <div>{`<Icon type="${type}" size="l" />`}</div>
            </>
          )
        }
      >
        <Icon
          type={type}
          size="l"
          style={{ margin: "0 10px 10px 0", cursor: "pointer" }}
        />
      </Copy>
    </Bubble>
  ));
}