"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.WizardLegend = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const SimpleButton_1 = tslib_1.__importDefault(require("../../components/SimpleButton"));
const Flex_1 = require("../../components/Flex");
class WizardLegend extends React.Component {
    render() {
        let count = this.props.StepNames.length - 1;
        let activeStepIndex = this.props.StepNames.findIndex((s) => s == this.props.ActiveStepName);
        let stepButtons = this.props.StepNames.map((s, index) => {
            let isActiveStep = index == activeStepIndex;
            let isDisabled = this.props.CanShowAllSteps
                ? false
                : isActiveStep || index > activeStepIndex;
            let lastStep = index == count;
            return (React.createElement("div", { className: "ab-WizardLegend__step twa:inline-block", "data-name": s, key: index },
                React.createElement(SimpleButton_1.default, { variant: isActiveStep ? 'raised' : 'outlined', tone: isActiveStep ? 'accent' : 'neutral', disabled: isDisabled, onClick: () => this.onStepButtonClicked(s) }, s),
                lastStep == false && (React.createElement(Flex_1.Box, { "data-name": "separator", className: "ab-WizardLegend__step__separator twa:mx-2 twa:inline-block" }, "\u2014"))));
        });
        return React.createElement("div", null, stepButtons);
    }
    onStepButtonClicked(stepName) {
        this.props.onStepButtonClicked(stepName);
    }
}
exports.WizardLegend = WizardLegend;
