var _a;
import { __decorate, __extends } from "tslib";
import { Component, Emit, Prop, Watch } from 'vue-property-decorator';
import { FormatMode } from '../../utils/i18n/i18n';
import { ModulVue } from '../../utils/vue/vue';
import { I18N_NAME, LIMIT_ELEMENTS, LINK_NAME } from '../component-names';
import { MI18n } from '../i18n/i18n';
import { MLink, MLinkMode } from '../link/link';
import WithRender from './limit-elements.html?style=./limit-elements.scss';
var MLimitElements = /** @class */ (function (_super) {
    __extends(MLimitElements, _super);
    function MLimitElements() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.internalOpen = _this.open;
        _this.mLinkModeButton = MLinkMode.Button;
        _this.i18nCloseLabelDefault = _this.$i18n.translate('m-limit-elements:show-less-label');
        return _this;
    }
    MLimitElements.prototype.onListOpened = function () { };
    MLimitElements.prototype.onListClosed = function () { };
    Object.defineProperty(MLimitElements.prototype, "i18nOpenLabel", {
        get: function () {
            return this.openLabel || this.$i18n.translate('m-limit-elements:show-more-label', { nbElements: this.numberOfExtraElements }, undefined, undefined, undefined, FormatMode.Sprintf);
        },
        enumerable: false,
        configurable: true
    });
    Object.defineProperty(MLimitElements.prototype, "i18nCloseLabel", {
        get: function () {
            return this.closeLabel || this.i18nCloseLabelDefault;
        },
        enumerable: false,
        configurable: true
    });
    Object.defineProperty(MLimitElements.prototype, "i18nLinkLabel", {
        get: function () {
            return this.internalOpen ? this.i18nCloseLabel : this.i18nOpenLabel;
        },
        enumerable: false,
        configurable: true
    });
    Object.defineProperty(MLimitElements.prototype, "limitedElements", {
        get: function () {
            return this.isLinkDisplay ? this.elements.slice(0, this.limit) : this.elements.slice(0, this.limit + 1);
        },
        enumerable: false,
        configurable: true
    });
    Object.defineProperty(MLimitElements.prototype, "numberOfExtraElements", {
        get: function () {
            return this.elements.length - this.limit;
        },
        enumerable: false,
        configurable: true
    });
    Object.defineProperty(MLimitElements.prototype, "isLimitedElementDisplay", {
        get: function () {
            return !this.internalOpen;
        },
        enumerable: false,
        configurable: true
    });
    Object.defineProperty(MLimitElements.prototype, "isExtraElementDisplay", {
        get: function () {
            return this.internalOpen && this.isLinkDisplay;
        },
        enumerable: false,
        configurable: true
    });
    Object.defineProperty(MLimitElements.prototype, "isLinkDisplay", {
        get: function () {
            return this.elements.length > this.limit + 1;
        },
        enumerable: false,
        configurable: true
    });
    MLimitElements.prototype.toggleOpen = function () {
        this.internalOpen = !this.internalOpen;
        this.$emit('update:open', this.internalOpen);
        if (this.internalOpen) {
            this.onListOpened();
        }
        else {
            this.onListClosed();
        }
    };
    MLimitElements.prototype.updateOpen = function () {
        this.internalOpen = this.open;
    };
    __decorate([
        Prop({ required: true })
    ], MLimitElements.prototype, "elements", void 0);
    __decorate([
        Prop({ default: 2 })
    ], MLimitElements.prototype, "limit", void 0);
    __decorate([
        Prop({ default: false })
    ], MLimitElements.prototype, "open", void 0);
    __decorate([
        Prop()
    ], MLimitElements.prototype, "openLabel", void 0);
    __decorate([
        Prop()
    ], MLimitElements.prototype, "closeLabel", void 0);
    __decorate([
        Emit('list-opened')
    ], MLimitElements.prototype, "onListOpened", null);
    __decorate([
        Emit('list-closed')
    ], MLimitElements.prototype, "onListClosed", null);
    __decorate([
        Watch('open')
    ], MLimitElements.prototype, "updateOpen", null);
    MLimitElements = __decorate([
        WithRender,
        Component({
            components: (_a = {},
                _a[LINK_NAME] = MLink,
                _a[I18N_NAME] = MI18n,
                _a)
        })
    ], MLimitElements);
    return MLimitElements;
}(ModulVue));
export { MLimitElements };
var LimitElementsPlugin = {
    install: function (v, options) {
        v.component(LIMIT_ELEMENTS, MLimitElements);
    }
};
export default LimitElementsPlugin;
//# sourceMappingURL=limit-elements.js.map