// #region Imports
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
import { HTMLElementEventEmitter } from '@breadstone/mosaik-elements';
import { Emit } from '../../../../events/Decorators/EmitDecorator';
import { Themeable } from '../../../Behaviors/Themeable';
import { Component } from '../../../Decorators/ComponentDecorator';
import { Property } from '../../../Decorators/PropertyDecorator';
import { CustomElement } from '../../Abstracts/CustomElement';
import { ButtonElement } from '../../Buttons/Button/ButtonElement';
import { tourStepElementCosmopolitanStyle } from './Themes/TourStepElement.Cosmopolitan';
import { tourStepElementJoyStyle } from './Themes/TourStepElement.Joy';
import { tourStepElementMemphisStyle } from './Themes/TourStepElement.Memphis';
import { tourStepElementTemplate } from './TourStepElementTemplate';
// #endregion
const TOUR_STEP_LABELS_DEFAULT = {
    next: 'Next',
    previous: 'Previous',
    finish: 'Finish',
    skip: 'Skip'
};
/**
 * Tour Step - Displays the content and actions for a single tour step.
 *
 * @name TourStepElement
 * @element mosaik-tour-step
 * @category Overlays
 *
 * @public
 */
let TourStepElement = class TourStepElement extends Themeable(CustomElement) {
    // #region Fields
    _previous;
    _next;
    _finish;
    _skip;
    _step;
    _isFirstStep;
    _isLastStep;
    // #endregion
    // #region Ctor
    /**
     * @public
     */
    constructor() {
        super();
        this._step = null;
        this._isFirstStep = true;
        this._isLastStep = false;
        this._previous = new HTMLElementEventEmitter(this, 'previous');
        this._next = new HTMLElementEventEmitter(this, 'next');
        this._finish = new HTMLElementEventEmitter(this, 'finish');
        this._skip = new HTMLElementEventEmitter(this, 'skip');
    }
    // #endregion
    // #region Properties
    /**
     * Gets or sets the step data.
     *
     * @public
     */
    get step() {
        return this._step;
    }
    set step(value) {
        if (this._step !== value) {
            this._step = value;
            this.requestUpdate('step');
        }
    }
    /**
     * Gets or sets whether this is the first step.
     *
     * @public
     */
    get isFirstStep() {
        return this._isFirstStep;
    }
    set isFirstStep(value) {
        if (this._isFirstStep !== value) {
            this._isFirstStep = value;
            this.requestUpdate('isFirstStep');
        }
    }
    /**
     * Gets or sets whether this is the last step.
     *
     * @public
     */
    get isLastStep() {
        return this._isLastStep;
    }
    set isLastStep(value) {
        if (this._isLastStep !== value) {
            this._isLastStep = value;
            this.requestUpdate('isLastStep');
        }
    }
    /**
     * Provides resolved labels for the current step.
     *
     * @public
     * @readonly
     */
    get resolvedLabels() {
        return {
            ...TOUR_STEP_LABELS_DEFAULT,
            ...(this._step?.labels ?? {})
        };
    }
    /**
     * Fired when the previous action is triggered.
     *
     * @public
     * @readonly
     * @eventProperty
     */
    get previous() {
        return this._previous;
    }
    /**
     * Fired when the next action is triggered.
     *
     * @public
     * @readonly
     * @eventProperty
     */
    get next() {
        return this._next;
    }
    /**
     * Fired when the finish action is triggered.
     *
     * @public
     * @readonly
     * @eventProperty
     */
    get finish() {
        return this._finish;
    }
    /**
     * Fired when the skip action is triggered.
     *
     * @public
     * @readonly
     * @eventProperty
     */
    get skip() {
        return this._skip;
    }
    // #endregion
    // #region Methods
    /**
     * Emits the previous action event.
     *
     * @public
     */
    onPreviousClicked() {
        this._previous.emit({});
    }
    /**
     * Emits the next action event.
     *
     * @public
     */
    onNextClicked() {
        this._next.emit({});
    }
    /**
     * Emits the finish action event.
     *
     * @public
     */
    onFinishClicked() {
        this._finish.emit({});
    }
    /**
     * Emits the skip action event.
     *
     * @public
     */
    onSkipClicked() {
        this._skip.emit({});
    }
};
__decorate([
    Property({ type: Object }),
    __metadata("design:type", Object),
    __metadata("design:paramtypes", [Object])
], TourStepElement.prototype, "step", null);
__decorate([
    Property({ type: Boolean }),
    __metadata("design:type", Boolean),
    __metadata("design:paramtypes", [Boolean])
], TourStepElement.prototype, "isFirstStep", null);
__decorate([
    Property({ type: Boolean }),
    __metadata("design:type", Boolean),
    __metadata("design:paramtypes", [Boolean])
], TourStepElement.prototype, "isLastStep", null);
__decorate([
    Emit({ eventName: 'previous' }),
    __metadata("design:type", Object),
    __metadata("design:paramtypes", [])
], TourStepElement.prototype, "previous", null);
__decorate([
    Emit({ eventName: 'next' }),
    __metadata("design:type", Object),
    __metadata("design:paramtypes", [])
], TourStepElement.prototype, "next", null);
__decorate([
    Emit({ eventName: 'finish' }),
    __metadata("design:type", Object),
    __metadata("design:paramtypes", [])
], TourStepElement.prototype, "finish", null);
__decorate([
    Emit({ eventName: 'skip' }),
    __metadata("design:type", Object),
    __metadata("design:paramtypes", [])
], TourStepElement.prototype, "skip", null);
TourStepElement = __decorate([
    Component({
        selector: 'mosaik-tour-step',
        template: tourStepElementTemplate,
        themes: {
            joy: tourStepElementJoyStyle,
            memphis: tourStepElementMemphisStyle,
            cosmopolitan: tourStepElementCosmopolitanStyle
        },
        imports: [
            ButtonElement
        ]
    }),
    __metadata("design:paramtypes", [])
], TourStepElement);
export { TourStepElement };
//# sourceMappingURL=TourStepElement.js.map