Ping

Display

Animated status dot with intent colors and optional static/pulse modes.

Instalação via CLI

$ npx kikitocn add ping

Exemplo de uso

PingExample.tsx

import { Ping } from "@/components/ui/cn/ping/Ping";

export function PingExample() {
  return (
    <Ping intent="primary" size="sm">
      Ping
    </Ping>
  );
}

Props

Prop	Tipo	Padrão	Descrição
`intent`	`'primary' \| 'success' \| 'warning' \| 'danger' \| 'info' \| 'neutral'`	`'primary'`	Cor do ponto
`size`	`'sm' \| 'md' \| 'lg'`	`'md'`	Tamanho do ponto
`animate`	`boolean`	`true`	Ativar animação de pulso
`label`	`string`	—	Nome acessível do ponto de status (leitor de tela)
`children`	`React.ReactNode`	—	Conteúdo (o dot aparece como overlay)
`className`	`string`	—	Classes CSS extras
`style`	`CSSProperties`	—	Estilos inline pro container

Voltar para Display

Carregando…