devextreme/esm/__internal/ui/button/icon.js

HTML5 JavaScript Component Suite for Responsive Web Development

/**
 * DevExtreme (esm/__internal/ui/button/icon.js)
 * Version: 24.2.7
 * Build date: Mon Apr 28 2025
 *
 * Copyright (c) 2012 - 2025 Developer Express Inc. ALL RIGHTS RESERVED
 * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
 */
import _extends from "@babel/runtime/helpers/esm/extends";
import {
    createVNode,
    createFragment
} from "inferno";
import {
    BaseInfernoComponent
} from "@devextreme/runtime/inferno";
import {
    getImageSourceType
} from "../../../core/utils/icon";
import {
    getTemplate
} from "../../core/r1/utils/index";
import {
    combineClasses
} from "../../core/utils/combine_classes";
export const defaultIconProps = {
    position: "left",
    source: ""
};
export class Icon extends BaseInfernoComponent {
    constructor(props) {
        super(props);
        this.state = {}
    }
    get sourceType() {
        return getImageSourceType(this.props.source)
    }
    get cssClass() {
        return "left" !== this.props.position ? "dx-icon-right" : ""
    }
    get iconClassName() {
        const generalClasses = {
            "dx-icon": true,
            [this.cssClass]: !!this.cssClass
        };
        const {
            source: source
        } = this.props;
        if ("dxIcon" === this.sourceType) {
            return combineClasses(_extends({}, generalClasses, {
                [`dx-icon-${source}`]: true
            }))
        }
        if ("fontIcon" === this.sourceType) {
            return combineClasses(_extends({}, generalClasses, {
                [String(source)]: !!source
            }))
        }
        if ("image" === this.sourceType) {
            return combineClasses(generalClasses)
        }
        if ("svg" === this.sourceType) {
            return combineClasses(_extends({}, generalClasses, {
                "dx-svg-icon": true
            }))
        }
        return ""
    }
    get restAttributes() {
        const restProps = _extends({}, this.props);
        ["iconTemplate", "position", "source"].forEach((excluded => {
            delete restProps[excluded]
        }));
        return restProps
    }
    render() {
        const {
            iconClassName: iconClassName,
            props: {
                source: source
            },
            sourceType: sourceType
        } = this;
        const IconTemplate = getTemplate(this.props.iconTemplate);
        return createFragment(["dxIcon" === sourceType && createVNode(1, "i", iconClassName), "fontIcon" === sourceType && createVNode(1, "i", iconClassName), "image" === sourceType && createVNode(1, "img", iconClassName, null, 1, {
            alt: "",
            src: source
        }), IconTemplate && createVNode(1, "i", iconClassName, IconTemplate({}), 0)], 0)
    }
}
Icon.defaultProps = defaultIconProps;