// import { Input } from "@alifd/next";
import ConfigProvider from '../config-provider';
import React, { Component } from 'react';
import cls from 'classnames';
import { Button as NextButton } from '@alifd/next';
import { ButtonProps as NextButtonProps } from '@alifd/next/types/button';
import { GroupProps as NextGroupProps } from '@alifd/next/types/button';

interface ButtonProps extends NextButtonProps {
  href?: string;
}
class LinkGroup extends Component<NextGroupProps> {
  render() {
    const {
      prefix = 'next-',
      className,
      size = 'medium',
      ...otherProps
    } = this.props;
    return (
      <NextButton.Group
        {...otherProps}
        size={size}
        className={cls(className, {
          [`${prefix}link-group`]: true,
          [`${prefix}link-group-small`]: size === 'small',
          [`${prefix}link-group-medium`]: size === 'medium',
          [`${prefix}link-group-large`]: size === 'large',
        })}
      />
    );
  }
}
class Link extends Component<ButtonProps> {
  static Group = ConfigProvider.config(LinkGroup);
  render() {
    const { prefix = 'next-', href, className, ...otherProps } = this.props;
    // right 模式
    return (
      <NextButton
        {...otherProps}
        text
        prefix={prefix}
        href={href}
        target="_blank"
        component="a"
        className={cls(className, {
          [`${prefix}link`]: true,
        })}
      />
    );
  }
}
export default ConfigProvider.config(Link);