export type ButtonType = "primary" | "secondary" | "ghost" | "conversion" | "conversion-secondary" | "conversion-ghost" | "conversion-icon-only" | "icon-only" | "secondary-icon-only" | "black-secondary" | "black-ghost" | "black-icon-only" | "white" | "white-secondary" | "white-ghost" | "white-icon-only" | "subscription" | "subscription-secondary" | "subscription-ghost" | "subscription-icon-only"; export type ButtonSize = "small" | "medium"; interface ButtonCommonProps { /** * Tipo do elemento renderizado. Essa propriedade permite renderizar * um HTMLButtonElement ou HTMLLinkElement. */ renderElementType?: "button" | "a"; /** * Tipo de elemento renderizado para passar um feedback de carregamento * para o usuário. */ loading?: boolean; /** * Tipo visual do botão. Para configurar o type do botão, * olhar a Prop buttonType. *
* Os seguintes tipos estão descontinuada (deprecated)
* icon-only, secondary-icon-only, white-icon-only,
* black-icon-only, subscription-icon-only, conversion-icon-only * *
*/ type: ButtonType; /** * Tamanho do botão. */ size: ButtonSize; /** * Texto do botão. */ label?: string; /** * Habilita o estilo inverse do componente. *
* Essa propriedade está descontinuada (deprecated) * *
*/ inverse?: boolean; /** * Configura o posicionamento do ícone no componente, caso exista. * "leading-icon" posiciona o ícone à esquerda do texto, "step" à direita ou "double" para ambos lados. */ icon?: string; /** * Nome do ícone que deve ser carregado, caso exista. * O ícone deve estar contido na biblioteca de ícones do Pulso. */ iconName?: string; /** * Atributo padrão do elemento \ do HTML. */ autofocus?: boolean | undefined; /** * Atributo padrão do elemento \ do HTML. */ form?: string | undefined; /** * Atributo padrão do elemento \ do HTML. */ formaction?: string | undefined; /** * Atributo padrão do elemento \ do HTML. */ formenctype?: "application/x-www-form-urlencoded" | "multipart/form-data" | "text/plain" | undefined; /** * Atributo padrão do elemento \ do HTML. */ formmethod?: "post" | "get" | undefined; /** * Atributo padrão do elemento \ do HTML. */ formnovalidate?: boolean | undefined; /** * Atributo padrão do elemento \ do HTML. */ formtarget?: "_self" | "_blank" | "_parent" | "_top" | undefined; /** * Atributo padrão do elemento \ do HTML. */ name?: string | undefined; /** * Atributo "type" padrão do elemento \ do HTML. */ buttonType?: "submit" | "reset" | "button" | undefined; /** * Atributo padrão do elemento \ do HTML. */ value?: string | undefined; /** * Atributo padrão do elemento \ do HTML. */ onClick?: Function; /** * Atributo padrão do elemento \ do HTML. */ onMouseUp?: Function; /** * Atributo padrão do elemento \ do HTML. */ onMouseDown?: Function; /** * Atributo padrão do elemento \ do HTML. */ disabled?: boolean; /** * Propriedade compatível quando o elemento é do tipo HTMLLinkElement. * Responsável por adicionar o endereço do link. */ href?: string | never; /** * Propriedade compatível quando o elemento é do tipo HTMLLinkElement. * Responsável por lidar com o comportamento do link. */ target?: "_self" | "_blank" | "_parent" | "_top"; /** * Propriedade compatível quando o elemento é do tipo HTMLLinkElement. * Responsável por criar uma relação no link. */ rel?: string | never; /** * Essa Prop inclui um atributo data-qa com o valor configurado no botão. */ dataQA?: string | null; /** * Essa Prop inclui um atributo data-collect com o valor configurado no botão. */ dataCollect?: string | null; /** * Essa Prop inclui um atributo data-collect-info com o valor * configurado no botão. */ dataCollectInfo?: string | null; /** * Essa Prop inclui um atributo data-testid com o valor configurado no botão. */ dataTestId?: string | null; /** * Essa prop define se o botão deve ocupar 100% da largura do container. */ fullWidth?: boolean; } interface LeadingIconProps { /** * Configura o posicionamento do ícone no componente, caso exista. * "leading-icon" posiciona o ícone à esquerda do texto. */ icon?: "leading-icon"; /** * Nome do ícone que deve ser carregado, caso exista. * O ícone deve estar contido na biblioteca de ícones do Pulso. */ iconName?: string | { leadingIcon: string; step?: never; }; } interface StepProps { icon?: "step"; iconName?: string | { leadingIcon?: never; step: string; }; } interface DoubleProps { icon?: "double"; iconName?: { leadingIcon: string; step: string; }; } export type ButtonProps = ButtonCommonProps & (LeadingIconProps | StepProps | DoubleProps); export interface IRefreshRaia { [value: string]: "brand" | "highlight" | "black" | "white"; } export {};