class Bar extends ReactComponentOfProps<BarProps> {
    override public function render() {
        var classNames = ClassNames.fast( 
            "base",
            props.className, 
            {
                disabled: props.disabled, 
                checked: !props.disabled && props.checked 
            }
        );
 
        return jsx('<div className=$classNames />');
    }
}

class Bar extends ReactComponentOfProps<BarProps> {
    override public function render() {
        var classes = ClassNames.fastAsObject( 
            "base",
            props.className, 
            {
                disabled: props.disabled, 
                checked: !props.disabled && props.checked 
            }
        );
 
        return jsx('<div {...classes} />');
    }
}

// className="base myclass checked"
jsx('<$Bar className="myclass" checked=$true />');
 
// className="base myclass1 myclass2 disabled"
jsx('<$Bar className="myclass1 myclass2" disabled=$true />');
 
// className="base disabled"
jsx('<$Bar className="checked" disabled=$true />');

var classNames = ClassNames.fast( 
    "base",
    {
        disabled: props.disabled, 
        checked: !props.disabled && props.checked 
    }
);
 
// Will be transpiled to:
var classNames = "base" + (props.disabled?" disabled":"") + (!props.disabled && props.checked?" checked":"");

var classNames = ClassNames.fast("btn", "btn--large");
var classNames = ClassNames.fast(["btn", "btn--large"]);
var classNames = ClassNames.fast({"btn": true, "btn--large": true});
 
// Will all be transpiled to:
var classNames = "btn btn--large";