@alifd/next/lib/icon/icon-font.js

A configurable component library for web built on React.

'use strict';

exports.__esModule = true;

var _extends2 = require('babel-runtime/helpers/extends');

var _extends3 = _interopRequireDefault(_extends2);

var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');

var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);

exports.default = createFromIconfontCN;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _classnames = require('classnames');

var _classnames2 = _interopRequireDefault(_classnames);

var _configProvider = require('../config-provider');

var _configProvider2 = _interopRequireDefault(_configProvider);

var _icon = require('./icon');

var _icon2 = _interopRequireDefault(_icon);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var customCache = new Set();

var ConfigIcon = _configProvider2.default.config(_icon2.default);

/** Icon.createFromIconfontCN
 *  @description 通过自定义 iconfont源来使用使用svg格式的图片
 *  @order 1
 */
function createFromIconfontCN() {
    var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
    var scriptUrl = options.scriptUrl,
        _options$extraCommonP = options.extraCommonProps,
        extraCommonProps = _options$extraCommonP === undefined ? {} : _options$extraCommonP;

    var hasExist = customCache.has(scriptUrl);

    if (document.querySelector('script[data-namespace="' + scriptUrl + '"]')) {
        hasExist = true;
    }

    /**
     * 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 (typeof document !== 'undefined' && typeof window !== 'undefined' && typeof document.createElement === 'function' && typeof scriptUrl === 'string' && scriptUrl.length && !hasExist) {
        var script = document.createElement('script');
        script.setAttribute('src', scriptUrl);
        script.setAttribute('data-namespace', scriptUrl);
        customCache.add(scriptUrl);
        document.body.appendChild(script);
    }

    var Iconfont = function Iconfont(props) {
        var _cx;

        var type = props.type,
            size = props.size,
            children = props.children,
            className = props.className,
            _props$prefix = props.prefix,
            prefix = _props$prefix === undefined ? 'next-' : _props$prefix,
            others = (0, _objectWithoutProperties3.default)(props, ['type', 'size', 'children', 'className', 'prefix']);

        // component > children > type

        var content = null;
        if (props.type) {
            content = _react2.default.createElement('use', { xlinkHref: '#' + type });
        }
        if (children) {
            content = children;
        }

        var classes = (0, _classnames2.default)((_cx = {}, _cx[prefix + 'icon-remote'] = true, _cx), className);

        return (
            // FIXME: 这里理论上优先级是 props 中的 prefix 优先级更高，不过之前的行为一直是取上层 ConfigProvider 中的 prefix，
            // 先兼容之前的表现，will be fixed in 2.x
            // https://github.com/alibaba-fusion/next/issues/3906
            _react2.default.createElement(
                ConfigIcon,
                { size: size },
                _react2.default.createElement(
                    'svg',
                    (0, _extends3.default)({ className: classes, focusable: false }, others, extraCommonProps),
                    content
                )
            )
        );
    };

    Iconfont.displayName = 'Iconfont';

    return _configProvider2.default.config(Iconfont);
}
module.exports = exports['default'];