import { HTMLAttributes, ReactNode, ElementType } from 'react';
import { BaseProps } from '../types.js';
import '@emotion/react';

type ButtonCommonProps = Pick<HTMLAttributes<HTMLButtonElement>, "onClick"> & {
    /**
     * 버튼의 size를 설정할 수 있습니다.
     * @default medium
     */
    size?: "medium" | "large" | "small" | "tiny";
    /**
     * 둥근 버튼 여부를 선택할 수 있습니다.
     * @default undefined
     */
    rounded?: boolean;
    /**
     * width 100%를 지정할 수 있는 속성입니다.
     * @default undefined
     */
    fullWidth?: boolean;
    /**
     * disabled 상태를 제어할 수 있습니다.
     * @default undefined
     */
    isDisabled?: boolean;
    /**
     * 로딩 상태를 제어합니다.
     * @default undefined
     */
    isLoading?: boolean;
    /**
     * Button의 text를 담당하는 prop 입니다
     */
    text: string;
    /**
     * 전달 받은 icon component를 leading 위치에 렌더링해줍니다.
     * icon의 color를 'inherit' 로 설정해주면 버튼의 상태에 따른 색상 변경이 자동으로 됩니다.
     *
     * @default undefined
     */
    leadingIcon?: ReactNode;
    /**
     * 전달 받은 icon component를 trailing 위치에 렌더링해줍니다.
     * icon의 color를 'inherit' 로 설정해주면 버튼의 상태에 따른 색상 변경이 자동으로 됩니다.
     *
     * @default undefined
     */
    trailingIcon?: ReactNode;
};
type ButtonPrimaryVariantProps<Element extends ElementType> = BaseProps<Element> & ButtonCommonProps & {
    variant: "primary";
    tonal?: boolean;
};
type ButtonAccentVariantProps<Element extends ElementType> = BaseProps<Element> & ButtonCommonProps & {
    variant: "accent";
    tonal?: boolean;
};
type ButtonCriticalVariantProps<Element extends ElementType> = BaseProps<Element> & ButtonCommonProps & {
    variant: "critical";
    tonal?: boolean;
};
type ButtonOutlinedVariantProps<Element extends ElementType> = BaseProps<Element> & ButtonCommonProps & {
    variant: "outlined";
};
type ButtonSecondaryVariantProps<Element extends ElementType> = BaseProps<Element> & ButtonCommonProps & {
    variant: "secondary";
};
type ButtonProps<Element extends ElementType> = ButtonPrimaryVariantProps<Element> | ButtonAccentVariantProps<Element> | ButtonCriticalVariantProps<Element> | ButtonOutlinedVariantProps<Element> | ButtonSecondaryVariantProps<Element>;

export { ButtonAccentVariantProps, ButtonCommonProps, ButtonCriticalVariantProps, ButtonOutlinedVariantProps, ButtonPrimaryVariantProps, ButtonProps, ButtonSecondaryVariantProps };