Copy

El componente Copy permite copiar un texto al portapapeles cuando se hace click en él, con la opción de mostrar una notificación al usuario.

Ejemplo

Importación

Para importar el componente Copy, se puede hacer desde fenextjs

import { Copy } from "fenextjs";

Parámetros

ParámetroTipoRequeridoDefaultDescripcion
textstringno''Texto que se copiará al portapapeles al hacer click en el componente.
childrenReactNodenoundefinedEl contenido que se mostrará dentro del componente Copy.
onClickForCopyfunctionnoundefinedFunción personalizada que se ejecuta después de copiar el texto.
notificationNotificationDataPropsno{ message: 'Copy', type: RequestResultTypeProps.OK }Configuración de la notificación que se muestra al copiar el texto.
classNamestringno''Clase CSS para personalizar el contenedor del componente.

Storybook

Para ver el storybook del componente lo puede hacer con este link (opens in a new tab)

Usos

  • Básico
<Copy text="Texto a copiar">Copia este texto</Copy>
  • Copy con notificación personalizada
<Copy
  text="Texto a copiar"
  notification={{ message: "Texto copiado", type: "success" }}
>
  Copia este texto
</Copy>
  • Copy con función personalizada
<Copy
  text="Texto a copiar"
  onClickForCopy={(text) => console.log("Texto copiado:", text)}
>
  Copia este texto
</Copy>