import { DangerousHtml, PureComponent } from "../React";
import { isObject } from "lodash";
export class Translate extends PureComponent {
    /**
     * @returns {JSX.Element}
     */
    render() {
        let params = Object.assign({}, this.props);
        delete params.children;
        let translatedValue;
        try {
            translatedValue = null;
            if (!translatedValue) {
                translatedValue = this.props.children;
            }
        }
        catch (error) {
            translatedValue = this.props.children;
        }
        let list = [];
        Object.keys(params).forEach(name => {
            if (isObject(params[name])) {
                list.push(params[name]);
                try {
                    translatedValue = translatedValue.replace(`%(${name})`, '{REACT}');
                }
                catch (error) {
                    console.error(error);
                    console.warn(translatedValue);
                    console.warn(name);
                }
            }
            else {
                translatedValue = translatedValue.replace(`%(${name})`, params[name]);
            }
        });
        if (Object.keys(list).length > 0) {
            let result = translatedValue.split('{REACT}');
            let newResult = [];
            let offset = 0;
            result.forEach((item) => {
                offset++;
                newResult.push(<DangerousHtml key={offset}>{item}</DangerousHtml>);
                if (list.length > 0) {
                    offset++;
                    newResult.push(<span key={offset}>{list.shift()}</span>);
                }
            });
            return (<span>
                    {[null].concat(newResult)}
                </span>);
        }
        if (-1 !== translatedValue.indexOf('&') || (-1 !== translatedValue.indexOf('<') && -1 !== translatedValue.indexOf('>'))) {
            return <DangerousHtml>{translatedValue}</DangerousHtml>;
        }
        return <span>{translatedValue}</span>;
    }
}