import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@clr/angular";
import * as i2 from "../dropdown/dropdown.component";
import * as i3 from "../dropdown/dropdown-menu.component";
import * as i4 from "../dropdown/dropdown-trigger.directive";
import * as i5 from "../dropdown/dropdown-item.directive";
import * as i6 from "@ngx-translate/core";
/**
 * A control for setting the number of items per page in a paginated list.
 */
export class ItemsPerPageControlsComponent {
    constructor() {
        this.itemsPerPage = 10;
        this.itemsPerPageChange = new EventEmitter();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: ItemsPerPageControlsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: ItemsPerPageControlsComponent, selector: "vdr-items-per-page-controls", inputs: { itemsPerPage: "itemsPerPage" }, outputs: { itemsPerPageChange: "itemsPerPageChange" }, ngImport: i0, template: "<vdr-dropdown>\n    <button class=\"button\" vdrDropdownTrigger>\n        <span>{{ 'common.items-per-page-option' | translate : { count: itemsPerPage } }}</span>\n        <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n    </button>\n    <vdr-dropdown-menu vdrPosition=\"bottom-left\">\n        <button vdrDropdownItem (click)=\"itemsPerPageChange.emit(10)\">\n            {{ 'common.items-per-page-option' | translate : { count: 10 } }}\n        </button>\n        <button vdrDropdownItem (click)=\"itemsPerPageChange.emit(25)\">\n            {{ 'common.items-per-page-option' | translate : { count: 25 } }}\n        </button>\n        <button vdrDropdownItem (click)=\"itemsPerPageChange.emit(50)\">\n            {{ 'common.items-per-page-option' | translate : { count: 50 } }}\n        </button>\n        <button vdrDropdownItem (click)=\"itemsPerPageChange.emit(100)\">\n            {{ 'common.items-per-page-option' | translate : { count: 100 } }}\n        </button>\n    </vdr-dropdown-menu>\n</vdr-dropdown>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.ClrIconCustomTag, selector: "clr-icon" }, { kind: "component", type: i2.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i3.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i4.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i5.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "pipe", type: i6.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: ItemsPerPageControlsComponent, decorators: [{
            type: Component,
            args: [{ selector: 'vdr-items-per-page-controls', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-dropdown>\n    <button class=\"button\" vdrDropdownTrigger>\n        <span>{{ 'common.items-per-page-option' | translate : { count: itemsPerPage } }}</span>\n        <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n    </button>\n    <vdr-dropdown-menu vdrPosition=\"bottom-left\">\n        <button vdrDropdownItem (click)=\"itemsPerPageChange.emit(10)\">\n            {{ 'common.items-per-page-option' | translate : { count: 10 } }}\n        </button>\n        <button vdrDropdownItem (click)=\"itemsPerPageChange.emit(25)\">\n            {{ 'common.items-per-page-option' | translate : { count: 25 } }}\n        </button>\n        <button vdrDropdownItem (click)=\"itemsPerPageChange.emit(50)\">\n            {{ 'common.items-per-page-option' | translate : { count: 50 } }}\n        </button>\n        <button vdrDropdownItem (click)=\"itemsPerPageChange.emit(100)\">\n            {{ 'common.items-per-page-option' | translate : { count: 100 } }}\n        </button>\n    </vdr-dropdown-menu>\n</vdr-dropdown>\n" }]
        }], propDecorators: { itemsPerPage: [{
                type: Input
            }], itemsPerPageChange: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaXRlbXMtcGVyLXBhZ2UtY29udHJvbHMuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9jb3JlL3NyYy9zaGFyZWQvY29tcG9uZW50cy9pdGVtcy1wZXItcGFnZS1jb250cm9scy9pdGVtcy1wZXItcGFnZS1jb250cm9scy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9zcmMvbGliL2NvcmUvc3JjL3NoYXJlZC9jb21wb25lbnRzL2l0ZW1zLXBlci1wYWdlLWNvbnRyb2xzL2l0ZW1zLXBlci1wYWdlLWNvbnRyb2xzLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7Ozs7Ozs7O0FBRWhHOztHQUVHO0FBT0gsTUFBTSxPQUFPLDZCQUE2QjtJQU4xQztRQU9hLGlCQUFZLEdBQUcsRUFBRSxDQUFDO1FBQ2pCLHVCQUFrQixHQUFHLElBQUksWUFBWSxFQUFVLENBQUM7S0FDN0Q7OEdBSFksNkJBQTZCO2tHQUE3Qiw2QkFBNkIsb0tDWDFDLDYvQkFvQkE7OzJGRFRhLDZCQUE2QjtrQkFOekMsU0FBUzsrQkFDSSw2QkFBNkIsbUJBR3RCLHVCQUF1QixDQUFDLE1BQU07OEJBR3RDLFlBQVk7c0JBQXBCLEtBQUs7Z0JBQ0ksa0JBQWtCO3NCQUEzQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbi8qKlxuICogQSBjb250cm9sIGZvciBzZXR0aW5nIHRoZSBudW1iZXIgb2YgaXRlbXMgcGVyIHBhZ2UgaW4gYSBwYWdpbmF0ZWQgbGlzdC5cbiAqL1xuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICd2ZHItaXRlbXMtcGVyLXBhZ2UtY29udHJvbHMnLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9pdGVtcy1wZXItcGFnZS1jb250cm9scy5jb21wb25lbnQuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vaXRlbXMtcGVyLXBhZ2UtY29udHJvbHMuY29tcG9uZW50LnNjc3MnXSxcbiAgICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgSXRlbXNQZXJQYWdlQ29udHJvbHNDb21wb25lbnQge1xuICAgIEBJbnB1dCgpIGl0ZW1zUGVyUGFnZSA9IDEwO1xuICAgIEBPdXRwdXQoKSBpdGVtc1BlclBhZ2VDaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyPG51bWJlcj4oKTtcbn1cbiIsIjx2ZHItZHJvcGRvd24+XG4gICAgPGJ1dHRvbiBjbGFzcz1cImJ1dHRvblwiIHZkckRyb3Bkb3duVHJpZ2dlcj5cbiAgICAgICAgPHNwYW4+e3sgJ2NvbW1vbi5pdGVtcy1wZXItcGFnZS1vcHRpb24nIHwgdHJhbnNsYXRlIDogeyBjb3VudDogaXRlbXNQZXJQYWdlIH0gfX08L3NwYW4+XG4gICAgICAgIDxjbHItaWNvbiBzaGFwZT1cImVsbGlwc2lzLXZlcnRpY2FsXCI+PC9jbHItaWNvbj5cbiAgICA8L2J1dHRvbj5cbiAgICA8dmRyLWRyb3Bkb3duLW1lbnUgdmRyUG9zaXRpb249XCJib3R0b20tbGVmdFwiPlxuICAgICAgICA8YnV0dG9uIHZkckRyb3Bkb3duSXRlbSAoY2xpY2spPVwiaXRlbXNQZXJQYWdlQ2hhbmdlLmVtaXQoMTApXCI+XG4gICAgICAgICAgICB7eyAnY29tbW9uLml0ZW1zLXBlci1wYWdlLW9wdGlvbicgfCB0cmFuc2xhdGUgOiB7IGNvdW50OiAxMCB9IH19XG4gICAgICAgIDwvYnV0dG9uPlxuICAgICAgICA8YnV0dG9uIHZkckRyb3Bkb3duSXRlbSAoY2xpY2spPVwiaXRlbXNQZXJQYWdlQ2hhbmdlLmVtaXQoMjUpXCI+XG4gICAgICAgICAgICB7eyAnY29tbW9uLml0ZW1zLXBlci1wYWdlLW9wdGlvbicgfCB0cmFuc2xhdGUgOiB7IGNvdW50OiAyNSB9IH19XG4gICAgICAgIDwvYnV0dG9uPlxuICAgICAgICA8YnV0dG9uIHZkckRyb3Bkb3duSXRlbSAoY2xpY2spPVwiaXRlbXNQZXJQYWdlQ2hhbmdlLmVtaXQoNTApXCI+XG4gICAgICAgICAgICB7eyAnY29tbW9uLml0ZW1zLXBlci1wYWdlLW9wdGlvbicgfCB0cmFuc2xhdGUgOiB7IGNvdW50OiA1MCB9IH19XG4gICAgICAgIDwvYnV0dG9uPlxuICAgICAgICA8YnV0dG9uIHZkckRyb3Bkb3duSXRlbSAoY2xpY2spPVwiaXRlbXNQZXJQYWdlQ2hhbmdlLmVtaXQoMTAwKVwiPlxuICAgICAgICAgICAge3sgJ2NvbW1vbi5pdGVtcy1wZXItcGFnZS1vcHRpb24nIHwgdHJhbnNsYXRlIDogeyBjb3VudDogMTAwIH0gfX1cbiAgICAgICAgPC9idXR0b24+XG4gICAgPC92ZHItZHJvcGRvd24tbWVudT5cbjwvdmRyLWRyb3Bkb3duPlxuIl19