@txdfe/at/types/button/index.d.ts

一个设计体系组件库

/// <reference types="react" />

import * as React from 'react';

export interface GroupProps extends React.HTMLAttributes<HTMLElement> {
    /**
     * 统一设置 Button 组件的按钮大小
     */
    size?: string;
}

export class Group extends React.Component<GroupProps, any> {}
interface HTMLAttributesWeak extends React.HTMLAttributes<HTMLElement> {
    onClick?: any;
}

export interface ButtonProps extends HTMLAttributesWeak {
    /**
     * 按钮的类型
     */
    type?: 'primary' | 'secondary' | 'normal' | 'tertiary';

    /**
     * 按钮的尺寸
     */
    size?: 'xs' | 'small' | 'medium';

    /**
     * 按钮中 Icon 的尺寸，用于替代 Icon 的默认大小
     */
    iconSize?:
        | 'xs'
        | 'small'
        | 'medium'
        | 'large'
        | 'xl'
        | 'xxl'
        | 'xxxl';

    /**
     * 当 component = 'button' 时，设置 button 标签的 type 值
     */
    htmlType?: 'submit' | 'reset' | 'button';

    /**
     * 设置标签类型
     */
    component?: 'button' | 'a' | 'div' | 'span';

    /**
     * 设置按钮的载入状态
     */
    loading?: boolean;

    /**
     * 是否为幽灵按钮
     */
    ghost?: true | false | 'light' | 'dark';

    /**
     * 是否为文本按钮
     */
    text?: boolean;

    /**
     * 是否为警告按钮
     */
    warning?: boolean;

    /**
     * 是否禁用
     */
    disabled?: boolean;

    /**
     * 点击按钮的回调
     */
    onClick?: (e: {}) => void;
}

export interface IconButtonProps extends React.HTMLAttributes<HTMLElement> {
  prefix?: string;
  /**
   * 图标按钮的图标名字
   */
  name?: string;
  /**
   * 图标按钮的图标类型
   */
  type?: 'primary'|'secondary'|'tertiary';
  /**
   * 当 component = 'button' 时，设置 button 标签的 type 值
   */
  htmlType?: 'submit'|'reset'|'button';
  /**
   * 设置标签类型
   */
  component?: 'button'|'a'|'div'|'span';
  /**
   * 统一设置 Button 组件的按钮大小
   */
  size?: 'medium'|'large';
  /**
   * 图标按钮的图标颜色
   */
  color?: 'default'|'gray';
  /**
   * 是否禁用
   */
  disabled?: boolean;
  /**
   * 点击按钮的回调
   * @param {Object} e Event Object
   */
  onClick?: (e: React.MouseEvent) => void;
  className?: string;
}

export class IconButton extends React.Component<IconButtonProps, any> {}

export default class Button extends React.Component<ButtonProps, any> {
    static Group: typeof Group;
    static Icon: typeof IconButton;
}