Tengo una aplicación mediante la cual el usuario puede copiar firmas de correo electrónico en el portapapeles y pegarlas en la firma de Gmail en reaccionar js

Aquí hay un código mínimo

 import React, { useRef } from "react"; export default function App() { const tableRef = useRef(null); const CopyHtmlTableToCripboard = () => { let tableRange = document.createRange(); tableRange.selectNodeContents(tableRef.current); let sel = window.getSelection(); sel.removeAllRanges(); sel.addRange(tableRange); document.execCommand("Copy"); sel.removeAllRanges(); }; return ( <div className="App"> <div ref={tableRef} className="table"> <table width="500" cellPadding="0" cellSpacing="0" border="0" className="apply-font" > <thead> <tr> <th>#</th> <th>First Name</th> <th>Last Name</th> <th>Username</th> </tr> </thead> <tbody> <tr style={{ fontSize: "8px", fontFamily: "Verdana", color: "#fff", lineHeight: "10px", paddingTop: "10px", backgroundColor: "red" }} > <td>1</td> <td>Mark</td> <td>Otto</td> <td>@mdo</td> </tr> </tbody> </table> </div> <button onClick={CopyHtmlTableToCripboard}> Copy to Clipboard using execCommand </button> </div>

); }

Problema: cuando copio la tabla en Clipborad y la pego en la firma de Gmail, agrega CSS no deseado

¿Qué debo hacer para evitar que Gmail agregue estos css no deseados a mi firma?