petals-ui/dist/icon/logic/Icon.js

Front-end UI components foundation

import { getComponentConfig, BaseHeadlessComponent } from '../../basic';
import { getIconProvider, getDefaultIconProvider } from './utils';
class IconHeadlessComponent extends BaseHeadlessComponent {
    getComponentName() {
        return getComponentConfig('icon', 'name') || 'Icon';
    }
    getOption() {
        const splitRefs = this.sc.refs.split(':');
        const iconRef = splitRefs.pop();
        const providerAlias = splitRefs[0] || getDefaultIconProvider();
        const { type, resolve } = getIconProvider(providerAlias);
        return { provider: providerAlias, ref: iconRef, type, resolve };
    }
    getClassNames() {
        return [...super.getClassNames(), this.getModifierClassName(this.getOption().type)];
    }
    getFontIconClassNames() {
        const { ref, type, resolve } = this.getOption();
        let classNames = [];
        if (type === 'font' && typeof resolve === 'function') {
            const resolved = resolve(ref);
            if (typeof resolved === 'string' || Array.isArray(resolved)) {
                classNames = [].concat(resolved);
            }
        }
        return classNames;
    }
    getExtraClassNames() {
        return [...this.getFontIconClassNames(), ...super.getExtraClassNames()];
    }
    getSvgIconRef() {
        const { ref, type, resolve } = this.getOption();
        let iconRef = '';
        if (type === 'svg' && typeof resolve === 'function') {
            const resolved = resolve(ref);
            if (typeof resolved === 'string') {
                iconRef = resolved;
            }
        }
        return iconRef;
    }
}
export { IconHeadlessComponent };