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ámetro | Tipo | Requerido | Default | Descripcion |
---|---|---|---|---|
text | string | no | '' | Texto que se copiará al portapapeles al hacer click en el componente. |
children | ReactNode | no | undefined | El contenido que se mostrará dentro del componente Copy. |
onClickForCopy | function | no | undefined | Función personalizada que se ejecuta después de copiar el texto. |
notification | NotificationDataProps | no | { message: 'Copy', type: RequestResultTypeProps.OK } | Configuración de la notificación que se muestra al copiar el texto. |
className | string | no | '' | 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>