import React, { PureComponent } from 'react';
import { st, classes } from './CounterBadge.st.css.js';
import Caption from '../Text/Caption';
import Text from '../Text';
import { dataHooks } from './constants';
import { WixStyleReactEnvironmentContext } from '../WixStyleReactEnvironmentProvider/context';
const MAX_NUMBER = 100;
/** CounterBadge */
class CounterBadge extends PureComponent {
    constructor() {
        super(...arguments);
        this._renderNumberContent = (n, truncate) => n < MAX_NUMBER || !truncate ? (Intl.NumberFormat(this._getLocale()).format(n)) : (React.createElement("div", { className: classes.numberContent },
            MAX_NUMBER - 1,
            React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "5", height: "5", viewBox: "0 0 5 5" },
                React.createElement("path", { fill: "currentColor", d: "M3,0 L3,2 L5,2 L5,3 L3,3 L3,5 L2,5 L2,3 L0,3 L0,2 L2,2 L2,0 L3,0 Z" }))));
        this._renderCounterBadgeContent = (size, content) => size === 'small' ? (React.createElement(Caption, { tagName: "span", caption: "c1", light: true, dataHook: dataHooks.content, className: classes.caption }, content)) : (React.createElement(Text, { dataHook: dataHooks.content, size: "tiny", weight: "bold", light: true, className: classes.text }, content));
    }
    _getLocale() {
        return this.props.locale || this.context.locale || 'en';
    }
    render() {
        const { dataHook, size, skin, children, className, showShadow, truncate } = this.props;
        const custom = isNaN(Number(children));
        const longNumber = !custom && truncate && Number(children) >= MAX_NUMBER;
        const content = custom
            ? children
            : this._renderNumberContent(Number(children), truncate);
        return (React.createElement("div", { className: st(classes.root, { skin, custom, size, longNumber, showShadow }, className), "data-hook": dataHook, "data-locale": this._getLocale() }, this._renderCounterBadgeContent(size, content)));
    }
}
CounterBadge.displayName = 'CounterBadge';
CounterBadge.defaultProps = {
    skin: 'general',
    size: 'small',
    showShadow: false,
    truncate: true,
};
CounterBadge.contextType = WixStyleReactEnvironmentContext;
export default CounterBadge;
//# sourceMappingURL=CounterBadge.js.map