import { __decorate, __extends } from "tslib";
import Component from 'vue-class-component';
import { Emit, Prop, Ref } from 'vue-property-decorator';
import { BackdropMode, Portal } from '../../mixins/portal/portal';
import { MFocusTrap } from '../../mixins/window-focus-trap/window-focus-trap';
import DialogServicePlugin from '../../utils/dialog/dialog-service.plugin';
import { Enums } from '../../utils/enums/enums';
import { ModulVue } from '../../utils/vue/vue';
import { MButton, MButtonSkin } from '../button/button';
import { DIALOG_NAME } from '../component-names';
import { MIcon } from '../icon/icon';
import { MLink } from '../link/link';
import { MMessagePage, MMessagePageState } from '../message-page/message-page';
import WithRender from './dialog.html?style=./dialog.scss';
export var MDialogWidth;
(function (MDialogWidth) {
    MDialogWidth["Default"] = "default";
    MDialogWidth["Large"] = "large";
})(MDialogWidth || (MDialogWidth = {}));
export var MDialogState;
(function (MDialogState) {
    MDialogState["Default"] = "default";
    MDialogState["Warning"] = "warning";
    MDialogState["Confirmation"] = "confirmation";
    MDialogState["Information"] = "information";
    MDialogState["Error"] = "error";
})(MDialogState || (MDialogState = {}));
export var MDialogMessageStyle;
(function (MDialogMessageStyle) {
    MDialogMessageStyle["LargeAndCenter"] = "large-and-center";
    MDialogMessageStyle["Regular"] = "regular";
})(MDialogMessageStyle || (MDialogMessageStyle = {}));
var MDialog = /** @class */ (function (_super) {
    __extends(MDialog, _super);
    function MDialog() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    Object.defineProperty(MDialog.prototype, "titleId", {
        get: function () {
            return this.title ? this.as().propId + "-title" : undefined;
        },
        enumerable: false,
        configurable: true
    });
    Object.defineProperty(MDialog.prototype, "messageId", {
        get: function () {
            return this.as().propId + "-message";
        },
        enumerable: false,
        configurable: true
    });
    MDialog.prototype.setFocusToPortal = function () {
        var _a, _b, _c;
        if (!this.refArticle) {
            return;
        }
        var initialFocusElement = (_a = this.refButtonOk) === null || _a === void 0 ? void 0 : _a.$el;
        if (!initialFocusElement) {
            if ((_b = this.refButonSecondary) === null || _b === void 0 ? void 0 : _b.$el) {
                initialFocusElement = this.refButonSecondary.$el;
            }
            else if ((_c = this.refLink) === null || _c === void 0 ? void 0 : _c.$el) {
                initialFocusElement = this.refLink.$el;
            }
        }
        this.as().setFocusTrap(this.refArticle, { initialFocus: initialFocusElement });
    };
    MDialog.prototype.setFocusToTrigger = function () {
        this.as().removeFocusTrap();
    };
    MDialog.prototype.handlesFocus = function () {
        return true;
    };
    MDialog.prototype.openDialog = function () {
        this.as().propOpen = true;
    };
    MDialog.prototype.doCustomPropOpen = function (value) {
        return false;
    };
    MDialog.prototype.getBackdropMode = function () {
        return BackdropMode.BackdropFast;
    };
    MDialog.prototype.getPortalElement = function () {
        return this.$refs.article;
    };
    MDialog.prototype.onOk = function (event) {
        this.as().propOpen = false;
    };
    MDialog.prototype.onSecondaryBtn = function (event) {
        this.as().propOpen = false;
    };
    MDialog.prototype.onCancel = function (event) {
        this.as().propOpen = false;
    };
    Object.defineProperty(MDialog.prototype, "dialogStyles", {
        get: function () {
            return { 'width': this.btnWidth };
        },
        enumerable: false,
        configurable: true
    });
    Object.defineProperty(MDialog.prototype, "isMessageStyleLargeAndCenter", {
        get: function () {
            return this.messageStyle === MDialogMessageStyle.LargeAndCenter;
        },
        enumerable: false,
        configurable: true
    });
    Object.defineProperty(MDialog.prototype, "hasWidthLarge", {
        get: function () {
            return this.width === MDialogWidth.Large;
        },
        enumerable: false,
        configurable: true
    });
    Object.defineProperty(MDialog.prototype, "getState", {
        get: function () {
            switch (this.state) {
                case MDialogState.Confirmation:
                    return MMessagePageState.Confirmation;
                case MDialogState.Information:
                    return MMessagePageState.Information;
                case MDialogState.Warning:
                    return MMessagePageState.Warning;
                case MDialogState.Error:
                    return MMessagePageState.Error;
                default:
                    return '';
            }
        },
        enumerable: false,
        configurable: true
    });
    Object.defineProperty(MDialog.prototype, "isStateDefault", {
        get: function () {
            return this.state === MDialogState.Default;
        },
        enumerable: false,
        configurable: true
    });
    __decorate([
        Prop()
    ], MDialog.prototype, "title", void 0);
    __decorate([
        Prop()
    ], MDialog.prototype, "message", void 0);
    __decorate([
        Prop()
    ], MDialog.prototype, "okLabel", void 0);
    __decorate([
        Prop()
    ], MDialog.prototype, "okPrecision", void 0);
    __decorate([
        Prop({ default: MButtonSkin.Primary })
    ], MDialog.prototype, "okButtonSkin", void 0);
    __decorate([
        Prop({ default: false })
    ], MDialog.prototype, "secBtn", void 0);
    __decorate([
        Prop()
    ], MDialog.prototype, "secBtnLabel", void 0);
    __decorate([
        Prop()
    ], MDialog.prototype, "secBtnPrecision", void 0);
    __decorate([
        Prop({ default: '100%' })
    ], MDialog.prototype, "btnWidth", void 0);
    __decorate([
        Prop()
    ], MDialog.prototype, "cancelLabel", void 0);
    __decorate([
        Prop({ default: true })
    ], MDialog.prototype, "negativeLink", void 0);
    __decorate([
        Prop()
    ], MDialog.prototype, "hint", void 0);
    __decorate([
        Prop({
            default: MDialogWidth.Default,
            validator: function (value) { return Enums.toValueArray(MDialogWidth).includes(value); }
        })
    ], MDialog.prototype, "width", void 0);
    __decorate([
        Prop({
            default: MDialogState.Default,
            validator: function (value) { return Enums.toValueArray(MDialogState).includes(value); }
        })
    ], MDialog.prototype, "state", void 0);
    __decorate([
        Prop({
            default: MDialogMessageStyle.LargeAndCenter,
            validator: function (value) { return Enums.toValueArray(MDialogMessageStyle).includes(value); }
        })
    ], MDialog.prototype, "messageStyle", void 0);
    __decorate([
        Ref('article')
    ], MDialog.prototype, "refArticle", void 0);
    __decorate([
        Ref('buttonOk')
    ], MDialog.prototype, "refButtonOk", void 0);
    __decorate([
        Ref('butonSecondary')
    ], MDialog.prototype, "refButonSecondary", void 0);
    __decorate([
        Ref('link')
    ], MDialog.prototype, "refLink", void 0);
    __decorate([
        Emit('ok')
    ], MDialog.prototype, "onOk", null);
    __decorate([
        Emit('secondaryBtn')
    ], MDialog.prototype, "onSecondaryBtn", null);
    __decorate([
        Emit('cancel')
    ], MDialog.prototype, "onCancel", null);
    MDialog = __decorate([
        WithRender,
        Component({
            components: {
                MButton: MButton,
                MLink: MLink,
                MMessagePage: MMessagePage,
                MIcon: MIcon
            },
            mixins: [Portal, MFocusTrap]
        })
    ], MDialog);
    return MDialog;
}(ModulVue));
export { MDialog };
var DialogPlugin = {
    install: function (v, options) {
        v.use(DialogServicePlugin);
        v.component(DIALOG_NAME, MDialog);
    }
};
export default DialogPlugin;
//# sourceMappingURL=dialog.js.map