var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
import * as React from 'react';
import { scrollElementIntoView } from '../../utils/functions';
import { DangerousHTML } from '../DangerousHTML';
import { Button } from '../Button';
import { Spinner } from '../Spinner';
import { FlexBlock } from '../flexBlock';
import { Block } from '../Block';
import lang from '../../../lang/common/index-en_US';
import classnames from 'classnames';
var CatalogListDetails = /** @class */ (function (_super) {
    __extends(CatalogListDetails, _super);
    function CatalogListDetails() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.getNodeRef = function (element) {
            if (_this.ref !== element && element) {
                var shouldScrollIntoView = _this.props.shouldScrollIntoView;
                if (shouldScrollIntoView) {
                    scrollElementIntoView(element);
                }
            }
            _this.ref = element;
        };
        return _this;
    }
    CatalogListDetails.prototype.renderRightDetails = function () {
        var renderRightDetails = this.props.renderRightDetails;
        return renderRightDetails || null;
    };
    CatalogListDetails.prototype.renderActionButton = function () {
        var _a = this.props, action = _a.action, textPurchase = _a.textPurchase, isLoading = _a.isLoading, isActionDisabled = _a.isActionDisabled;
        if (!action) {
            return null;
        }
        var isDisabled = isLoading || isActionDisabled || typeof action !== 'function';
        var loadingSpinnerNode = isLoading ? React.createElement(Spinner, { size: 18 }) : null;
        return (React.createElement("div", { className: "rc-catalog-list-details__actions text-right" },
            React.createElement(FlexBlock, { align: FlexBlock.CENTER, justify: FlexBlock.END, gutterWidth: 10 },
                loadingSpinnerNode,
                React.createElement(Button, { bsStyle: "primary", onClick: action, testAutomationId: "catalogListDetailsButton", disabled: isDisabled }, textPurchase))));
    };
    CatalogListDetails.prototype.renderAlert = function () {
        var alert = this.props.alert;
        if (!alert) {
            return null;
        }
        return (React.createElement(Block, { addHorizontalOffset: true, cancelBottomOffset: true }, alert));
    };
    CatalogListDetails.prototype.renderWarning = function () {
        var warning = this.props.warning;
        if (!warning) {
            return null;
        }
        return (React.createElement(Block, { addTopOffset: true, cancelBottomOffset: true }, warning));
    };
    CatalogListDetails.prototype.renderTitle = function () {
        var title = this.props.title;
        if (!title) {
            return null;
        }
        return (React.createElement("div", { className: "rc-catalog-list-details__titlebar", "data-test-automation-id": "header" }, title));
    };
    CatalogListDetails.prototype.render = function () {
        var _a = this.props, testAutomationId = _a.testAutomationId, textDetails = _a.textDetails;
        var _b = this.props, description = _b.description, narrow = _b.narrow;
        if (typeof description === 'string') {
            description = React.createElement(DangerousHTML, null, description);
        }
        var className = classnames('rc-catalog-list-details', { narrow: narrow });
        return (React.createElement("section", { ref: this.getNodeRef, className: className, "data-test-automation-id": testAutomationId },
            React.createElement("div", { className: "rc-catalog-list-details__content" },
                this.renderTitle(),
                React.createElement("div", { className: "rc-catalog-list-details__description-container" },
                    React.createElement(FlexBlock, { direction: FlexBlock.COLUMN, align: FlexBlock.START, justify: FlexBlock.SPACE_BETWEEN, className: "rc-catalog-list-details__description-wrap" },
                        React.createElement("div", { className: "rc-catalog-list-details__description-heading-wrap" },
                            React.createElement("div", { className: "rc-catalog-list-details__description-heading" }, textDetails),
                            React.createElement("div", { className: "rc-catalog-list-details__description", "data-test-automation-id": "catalogListDetailsDescription" }, description)),
                        this.renderWarning())),
                React.createElement("div", { className: "rc-catalog-list-details__right" },
                    this.renderRightDetails(),
                    this.renderAlert())),
            this.renderActionButton()));
    };
    CatalogListDetails.defaultProps = {
        testAutomationId: 'catalogListDetails',
        action: null,
        get textDetails() {
            return lang.DETAILS;
        },
        get textPurchase() {
            return lang.PURCHASE;
        },
        title: null,
        shouldScrollIntoView: false,
        isActionDisabled: false,
        isLoading: false,
        isDisabled: false,
        alert: null,
        warning: null,
        narrow: false
    };
    return CatalogListDetails;
}(React.PureComponent));
export { CatalogListDetails };
//# sourceMappingURL=CatalogListDetails.js.map