@antv/s2-react
Version:
use S2 with react
29 lines • 1.33 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.HtmlIcon = void 0;
const tslib_1 = require("tslib");
const s2_1 = require("@antv/s2");
const classnames_1 = tslib_1.__importDefault(require("classnames"));
const react_1 = tslib_1.__importDefault(require("react"));
require("./html-icon.less");
const HtmlIcon = (props) => {
const { style = {}, width, height, className, name } = props;
const svgIcon = () => (0, s2_1.getIcon)(name);
// fix: Uncaught TypeError: Cannot assign to read only property 'width' of object '#<Object>'
const newStyle = Object.assign({}, style);
/*
* html-icon 和 gui-icon 的接口趋于一致，都有 width 和 height 的便携属性
* 但在 html-icon 中，需要将 width 和 height 合入 style 中，且 width 比 style.width 优先级高
*/
if (width) {
newStyle.width = `${width}px`;
}
if (height) {
newStyle.height = `${height}px`;
}
return (react_1.default.createElement("span", { style: newStyle, className: (0, classnames_1.default)(`${s2_1.S2_PREFIX_CLS}-html-icon`, className),
// svg icon 都要求是本地文件，所以暂不担心 xss 问题了
dangerouslySetInnerHTML: { __html: svgIcon() } }));
};
exports.HtmlIcon = HtmlIcon;
//# sourceMappingURL=html-icon.js.map