Carregando…

Dual Action Button

Inputs

Pill with a stateful save action (idle/saving/saved) and a joined secondary link, no dropdown.

Instalação via CLI

$ npx kikitocn add dual-action-button

Interno:

@/lib/utils

Exemplo de uso

Dual Action ButtonExample.tsx

import { DualActionButton } from "@/components/ui/cn/dual-action-button/DualActionButton";

export function DualActionButtonExample() {
  return (
    <DualActionButton />
  );
}

Props

Prop	Tipo	Padrão	Descrição
`saveLabel`	`string`	`'Save'`	Texto do botão primário em idle
`savingLabel`	`string`	`'Saving'`	Texto enquanto onSave está pendente
`savedLabel`	`string`	`'Saved'`	Texto após onSave resolver
`onSave`	`() => Promise<void> \| void`	—	Ação assíncrona; resolve → 'saved' (clicar de novo volta pra idle)
`secondaryLabel`	`string`	`'Explore site'`	Texto da ação secundária
`secondaryHref`	`string`	`'#'`	Destino da ação secundária
`onSecondaryClick`	`(e: React.MouseEvent<HTMLAnchorElement>) => void`	—	Handler extra do link
`className`	`string`	—	Classes CSS extras
`style`	`React.CSSProperties`	—	Estilos inline extras

Voltar para Inputs

Carregando…