@kisstar/rc-ui
Version:
UI component library built with React Hooks.
75 lines (74 loc) • 3.22 kB
JavaScript
// Iconfont
//
// Manually forked from ant-design-icons/packages/icons-react/
// How it works：https://www.iconfont.cn/help/detail?spm=a313x.7781069.1998910419.d0091c141&helptype=code
//
// ant-design-icons is licensed MIT. https://github.com/ant-design/ant-design-icons
import React, { useContext } from 'react';
import classNames from 'classnames';
import { ConfigContext } from '../config-provider';
var customCache = new Set();
function isValidCustomScriptUrl(scriptUrl) {
return Boolean(typeof scriptUrl === 'string' && scriptUrl.length && !customCache.has(scriptUrl));
}
function createScriptUrlElements(scriptUrls, index) {
if (index === void 0) { index = 0; }
var currentScriptUrl = scriptUrls[index];
if (isValidCustomScriptUrl(currentScriptUrl)) {
var script = document.createElement('script');
script.setAttribute('src', currentScriptUrl);
script.setAttribute('data-namespace', currentScriptUrl);
if (scriptUrls.length > index + 1) {
script.onload = function () {
createScriptUrlElements(scriptUrls, index + 1);
};
script.onerror = function () {
createScriptUrlElements(scriptUrls, index + 1);
};
}
customCache.add(currentScriptUrl);
document.body.appendChild(script);
}
}
export default function create(options) {
if (options === void 0) { options = {}; }
var _a = options.scriptUrl, scriptUrl = _a === void 0 ? '' : _a;
/**
* DOM API required, make sure in browser environment.
* The Custom Icon will create a <script/>
* that loads SVG symbols and insert the SVG Element into the document body.
*/
if (scriptUrl &&
typeof document !== 'undefined' &&
typeof window !== 'undefined' &&
typeof document.createElement === 'function') {
if (Array.isArray(scriptUrl)) {
// 因为 IconFont 资源会把 svg 插入 before，所以前加载相同 type 会覆盖后加载
// 倒叙插入，为了数组覆盖顺序
createScriptUrlElements(scriptUrl.reverse());
}
else {
createScriptUrlElements([scriptUrl]);
}
}
var Iconfont = function (props) {
var _a;
var type = props.type, _b = props.style, style = _b === void 0 ? {} : _b, className = props.className, customizePrefixCls = props.prefixCls, spin = props.spin, rotate = props.rotate;
var getPrefixCls = useContext(ConfigContext).getPrefixCls;
var prefixCls = getPrefixCls('icon', customizePrefixCls);
var classes = classNames(prefixCls, className, (_a = {},
_a[prefixCls + "-spin"] = !!spin,
_a));
var svgStyle = rotate
? {
msTransform: "rotate(" + rotate + "deg)",
transform: "rotate(" + rotate + "deg)",
}
: {};
var retStyle = Object.assign(svgStyle, style);
return (React.createElement("svg", { className: classes, style: retStyle, "aria-hidden": "true" },
React.createElement("use", { xlinkHref: "#icon-" + type })));
};
Iconfont.displayName = 'Iconfont';
return Iconfont;
}