Kendo React PDF导出带颜色图标失败问题求助

我最近在开发React项目时，遇到了Kendo React PDF导出组件的图标显示问题，折腾了很久都没解决，想请各位大佬帮忙看看：

我想要在导出的PDF文档里显示带颜色的图标，但目前遇到两个头疼的问题：

• Kendo React的<Icon>组件直接消失了，完全不显示
• Material UI的<EmailIcon>只能显示黑色，哪怕我在组件上设置了color: 'blue'的内联样式也无效

另外，我尝试用Kendo提供的.k-pdf-export全局类来统一控制PDF内的样式，结果只有<p>标签的文字变成了绿色，图标完全不受这个类的样式影响。

以下是我的代码：

main.jsx #

import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { PDFExport } from '@progress/kendo-react-pdf';
import EmailIcon from '@mui/icons-material/Email';
import { Icon } from '@progress/kendo-react-common';
import './styles.css';

const App = () => {
  const pdfExportComponent = React.useRef(null);

  return (
    <div>
      <button
        onClick={() => {
          pdfExportComponent.current.save();
        }}
      >
        Export PDF
      </button>
      <PDFExport
        paperSize="A4"
        ref={pdfExportComponent}
      >
        p
        <Icon name="twitter" style={{ color: 'red' }} />
        <EmailIcon sx={{ fontSize: 15, color: 'blue' }} />
      </PDFExport>
    </div>
  );
};

ReactDOM.render(<App />, document.querySelector('my-app'));

styles.css #

.k-pdf-export div {
  color: green;
}

我已经尝试过的方法：

• 分别使用MUI图标和Kendo React图标
• 删除图标组件上的内联样式，仅依赖全局.k-pdf-export类控制样式
• 查阅Kendo React PDF的官方文档，但没找到对应的解决方案

实在找不到头绪了，有没有大佬遇到过类似的问题，或者能给我一些排查方向？

备注：内容来源于stack exchange，提问作者uriel sabag