import { __decorate, __extends } from "tslib";
import Component from 'vue-class-component';
import { Emit, Prop } from 'vue-property-decorator';
import { ScrollToDuration } from '../../../utils/scroll-to/scroll-to';
import { ModulVue } from '../../../utils/vue/vue';
import { SLIDE_TRANSITION_NAME } from '../../component-names';
import WithRender from './slide-transition.html?style=./slide-transition.scss';
export var MSlideTransitionDirection;
(function (MSlideTransitionDirection) {
    MSlideTransitionDirection["LeftToRight"] = "left-to-right";
    MSlideTransitionDirection["RightToLeft"] = "right-to-left";
})(MSlideTransitionDirection || (MSlideTransitionDirection = {}));
var MSlideTransition = /** @class */ (function (_super) {
    __extends(MSlideTransition, _super);
    function MSlideTransition() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    Object.defineProperty(MSlideTransition.prototype, "transitionName", {
        get: function () {
            return !this.disabled ? 'm--is' : undefined;
        },
        enumerable: false,
        configurable: true
    });
    Object.defineProperty(MSlideTransition.prototype, "isLeftToRight", {
        get: function () {
            return this.direction === MSlideTransitionDirection.LeftToRight;
        },
        enumerable: false,
        configurable: true
    });
    MSlideTransition.prototype.beforeEnter = function (el) { };
    MSlideTransition.prototype.enter = function (el, done) {
        var _this = this;
        if (!this.disabled) {
            if (this.automaticScroll) {
                this.$scrollTo.goTo(this.$el, this.scrollToOffset, ScrollToDuration.Regular);
            }
            setTimeout(function () {
                _this.addStyleProperty(el);
            }, 100);
        }
        else {
            done();
        }
    };
    MSlideTransition.prototype.afterEnter = function (el) {
        this.removeStyleProperty(el);
    };
    MSlideTransition.prototype.enterCancelled = function (el) { };
    MSlideTransition.prototype.beforeLeave = function (el) {
        this.addStyleProperty(el);
    };
    MSlideTransition.prototype.leave = function (el, done) { };
    MSlideTransition.prototype.afterLeave = function (el) {
        this.removeStyleProperty(el);
    };
    MSlideTransition.prototype.leaveCancelled = function (el) { };
    MSlideTransition.prototype.addStyleProperty = function (el) {
        this.$el.style.height = this.getHeightEl(el) + 'px';
        this.$el.style.overflow = 'hidden';
    };
    MSlideTransition.prototype.removeStyleProperty = function (el) {
        this.$el.style.removeProperty('height');
        this.$el.style.removeProperty('overflow');
    };
    MSlideTransition.prototype.getHeightEl = function (el) {
        var elComputedStyle = window.getComputedStyle(el);
        return el.getBoundingClientRect().height +
            +parseInt(elComputedStyle.marginTop, 10)
            + parseInt(elComputedStyle.marginBottom, 10);
    };
    __decorate([
        Prop({ default: MSlideTransitionDirection.LeftToRight })
    ], MSlideTransition.prototype, "direction", void 0);
    __decorate([
        Prop({ default: 0 })
    ], MSlideTransition.prototype, "scrollToOffset", void 0);
    __decorate([
        Prop({ default: true })
    ], MSlideTransition.prototype, "automaticScroll", void 0);
    __decorate([
        Prop({ default: false })
    ], MSlideTransition.prototype, "disabled", void 0);
    __decorate([
        Emit('before-enter')
    ], MSlideTransition.prototype, "beforeEnter", null);
    __decorate([
        Emit('enter')
    ], MSlideTransition.prototype, "enter", null);
    __decorate([
        Emit('after-enter')
    ], MSlideTransition.prototype, "afterEnter", null);
    __decorate([
        Emit('enter-cancelled')
    ], MSlideTransition.prototype, "enterCancelled", null);
    __decorate([
        Emit('before-leave')
    ], MSlideTransition.prototype, "beforeLeave", null);
    __decorate([
        Emit('leave')
    ], MSlideTransition.prototype, "leave", null);
    __decorate([
        Emit('after-leave')
    ], MSlideTransition.prototype, "afterLeave", null);
    __decorate([
        Emit('leave-cancelled')
    ], MSlideTransition.prototype, "leaveCancelled", null);
    MSlideTransition = __decorate([
        WithRender,
        Component
    ], MSlideTransition);
    return MSlideTransition;
}(ModulVue));
export { MSlideTransition };
var SlideTransitionPlugin = {
    install: function (v, options) {
        v.component(SLIDE_TRANSITION_NAME, MSlideTransition);
    }
};
export default SlideTransitionPlugin;
//# sourceMappingURL=slide-transition.js.map