import { __assign } from "tslib";
import { withThemeableProps } from '../../useThemeable';
import { classNamesFunction } from '@uifabric-vue/utilities';
import Vue from 'vue';
import { getIconContent } from './FontIcon';
var getClassNames = classNamesFunction({
    // Icon is used a lot by other components.
    // It's likely to see expected cases which pass different className to the Icon.
    // Therefore setting a larger cache size.
    cacheSize: 100,
});
export var IconBase = Vue.extend({
    name: 'IconBase',
    functional: true,
    props: __assign(__assign({}, withThemeableProps()), { iconName: { type: String, default: '' }, imageProps: { type: Object, default: undefined } }),
    render: function (h, ctx) {
        var _a = ctx.props, className = _a.className, iconName = _a.iconName, theme = _a.theme, styles = _a.styles;
        var isPlaceholder = typeof iconName === 'string' && iconName.length === 0;
        var isImage = !!ctx.props.imageProps;
        var iconContent = getIconContent(iconName) || {};
        var children = iconContent.children;
        var iconClassName = iconContent.iconClassName;
        var classNames = getClassNames(styles, {
            theme: theme,
            className: className,
            iconClassName: iconClassName,
            isImage: isImage,
            isPlaceholder: isPlaceholder,
        });
        var RootType = isImage ? 'span' : 'i';
        return h(RootType, __assign(__assign({}, ctx.data), { class: classNames.root, attrs: {
                'aria-hidden': 'true',
                'data-icon-name': iconName,
            } }), typeof children === 'function'
            ? [children(h)]
            : (children instanceof Array)
                ? children
                : [children]);
    },
});
//# sourceMappingURL=Icon.base.js.map