@doku-dev/doku-fragment
Version:
A new Angular UI library that moving away from Bootstrap and built from scratch.
84 lines • 13.9 kB
JavaScript
import { CommonModule } from '@angular/common';
import { ChangeDetectionStrategy, Component, Inject, Input, ViewEncapsulation, } from '@angular/core';
import { FormControl, ReactiveFormsModule } from '@angular/forms';
import { ReplaySubject, distinctUntilChanged, map, skip, takeUntil, startWith } from 'rxjs';
import { DokuFormFieldModule } from '../../form-field';
import { DokuSelectModule } from '../../select';
import { DokuPaginationContainer } from './pagination-container.component';
import * as i0 from "@angular/core";
import * as i1 from "../../form-field/form-field.component";
import * as i2 from "../../select/select.component";
import * as i3 from "@angular/forms";
import * as i4 from "./pagination-container.component";
export class DokuPaginationPerPage {
constructor(cdr, container) {
this.cdr = cdr;
this.container = container;
this.defaultItemsPerPage = 5;
/**
* Items per page options.
* @default [5,10,15,20,25]
*/
this.options = [5, 10, 15, 20, 25];
/**
* Label of the options.
* @default 'items per page'
*/
this.optionLabel = 'items per page';
// The value can be a number or string because it passed to the select component
// where the value will always be converted to string.
this.itemsPerPage = new FormControl(this.defaultItemsPerPage, {
nonNullable: true,
});
this.destroy$ = new ReplaySubject();
}
get normalizedOptions() {
return this.options.map((option) => ({
label: `${option} ${this.optionLabel}`,
value: option,
}));
}
ngOnInit() {
this.itemsPerPage.valueChanges
.pipe(distinctUntilChanged(), skip(1), map(this.convertValueToNumber), takeUntil(this.destroy$))
.subscribe((value) => {
this.container?.['pagination']?.['changeItemsPerPage']?.(value);
});
}
ngAfterViewInit() {
// Set initial items per page from pagination component
this.container?.['pagination']?.['triggerChange']
.pipe(startWith(this.container['pagination'].itemsPerPage || this.defaultItemsPerPage), takeUntil(this.destroy$))
.subscribe(() => {
const itemsPerPage = this.container?.['pagination']?.itemsPerPage || this.defaultItemsPerPage;
this.itemsPerPage.setValue(itemsPerPage);
});
this.cdr.detectChanges();
}
ngOnDestroy() {
this.destroy$.next(true);
this.destroy$.complete();
}
convertValueToNumber(value) {
try {
return typeof value === 'string' ? parseInt(value) : value;
}
catch (error) {
return this.defaultItemsPerPage;
}
}
}
DokuPaginationPerPage.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DokuPaginationPerPage, deps: [{ token: i0.ChangeDetectorRef }, { token: DokuPaginationContainer }], target: i0.ɵɵFactoryTarget.Component });
DokuPaginationPerPage.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DokuPaginationPerPage, isStandalone: true, selector: "doku-pagination-per-page", inputs: { options: "options", optionLabel: "optionLabel" }, exportAs: ["dokuPaginationPerPage"], ngImport: i0, template: "<div class=\"d-pagination-per-page\">\n <doku-form-field>\n <doku-select [items]=\"normalizedOptions\" [formControl]=\"itemsPerPage\"></doku-select>\n </doku-form-field>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: DokuFormFieldModule }, { kind: "component", type: i1.DokuFormField, selector: "doku-form-field", inputs: ["showSuccessBehavior", "isErrorState", "isSuccessState"], exportAs: ["dokuFormField"] }, { kind: "ngmodule", type: DokuSelectModule }, { kind: "component", type: i2.DokuSelect, selector: "doku-select", inputs: ["items", "bindLabel", "bindValue", "value", "placeholder", "portalClass", "multiple", "truncateLabel", "arrowPlacement", "disabled", "readonly", "searchable", "isAsync", "searchMatcherFn", "clearable"], outputs: ["valueChange", "search"], exportAs: ["dokuSelect"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DokuPaginationPerPage, decorators: [{
type: Component,
args: [{ selector: 'doku-pagination-per-page', exportAs: 'dokuPaginationPerPage', standalone: true, imports: [CommonModule, DokuFormFieldModule, DokuSelectModule, ReactiveFormsModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"d-pagination-per-page\">\n <doku-form-field>\n <doku-select [items]=\"normalizedOptions\" [formControl]=\"itemsPerPage\"></doku-select>\n </doku-form-field>\n</div>\n" }]
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i4.DokuPaginationContainer, decorators: [{
type: Inject,
args: [DokuPaginationContainer]
}] }]; }, propDecorators: { options: [{
type: Input
}], optionLabel: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFnaW5hdGlvbi1wZXItcGFnZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kb2t1LWZyYWdtZW50L3NyYy9saWIvcGFnaW5hdGlvbi9pbnRlZ3JhdGlvbnMvcGFnaW5hdGlvbi1wZXItcGFnZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kb2t1LWZyYWdtZW50L3NyYy9saWIvcGFnaW5hdGlvbi9pbnRlZ3JhdGlvbnMvcGFnaW5hdGlvbi1wZXItcGFnZS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUVMLHVCQUF1QixFQUV2QixTQUFTLEVBQ1QsTUFBTSxFQUNOLEtBQUssRUFHTCxpQkFBaUIsR0FDbEIsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLFdBQVcsRUFBRSxtQkFBbUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ2xFLE9BQU8sRUFBRSxhQUFhLEVBQUUsb0JBQW9CLEVBQUUsR0FBRyxFQUFFLElBQUksRUFBRSxTQUFTLEVBQUUsU0FBUyxFQUFFLE1BQU0sTUFBTSxDQUFDO0FBQzVGLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLGtCQUFrQixDQUFDO0FBQ3ZELE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLGNBQWMsQ0FBQztBQUNoRCxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQzs7Ozs7O0FBVzNFLE1BQU0sT0FBTyxxQkFBcUI7SUF1QmhDLFlBQ1UsR0FBc0IsRUFDVyxTQUFtQztRQURwRSxRQUFHLEdBQUgsR0FBRyxDQUFtQjtRQUNXLGNBQVMsR0FBVCxTQUFTLENBQTBCO1FBeEJyRSx3QkFBbUIsR0FBRyxDQUFDLENBQUM7UUFFakM7OztXQUdHO1FBQ00sWUFB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LENBQUMsSUFBSSxtQkFDcEIsdUJBQXVCLENBQUMsTUFBTTs7MEJBMkI1QyxNQUFNOzJCQUFDLHVCQUF1Qjs0Q0FsQnhCLE9BQU87c0JBQWYsS0FBSztnQkFNRyxXQUFXO3NCQUFuQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7XG4gIEFmdGVyVmlld0luaXQsXG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICBDaGFuZ2VEZXRlY3RvclJlZixcbiAgQ29tcG9uZW50LFxuICBJbmplY3QsXG4gIElucHV0LFxuICBPbkRlc3Ryb3ksXG4gIE9uSW5pdCxcbiAgVmlld0VuY2Fwc3VsYXRpb24sXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRm9ybUNvbnRyb2wsIFJlYWN0aXZlRm9ybXNNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQgeyBSZXBsYXlTdWJqZWN0LCBkaXN0aW5jdFVudGlsQ2hhbmdlZCwgbWFwLCBza2lwLCB0YWtlVW50aWwsIHN0YXJ0V2l0aCB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHsgRG9rdUZvcm1GaWVsZE1vZHVsZSB9IGZyb20gJy4uLy4uL2Zvcm0tZmllbGQnO1xuaW1wb3J0IHsgRG9rdVNlbGVjdE1vZHVsZSB9IGZyb20gJy4uLy4uL3NlbGVjdCc7XG5pbXBvcnQgeyBEb2t1UGFnaW5hdGlvbkNvbnRhaW5lciB9IGZyb20gJy4vcGFnaW5hdGlvbi1jb250YWluZXIuY29tcG9uZW50JztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZG9rdS1wYWdpbmF0aW9uLXBlci1wYWdlJyxcbiAgZXhwb3J0QXM6ICdkb2t1UGFnaW5hdGlvblBlclBhZ2UnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBEb2t1Rm9ybUZpZWxkTW9kdWxlLCBEb2t1U2VsZWN0TW9kdWxlLCBSZWFjdGl2ZUZvcm1zTW9kdWxlXSxcbiAgdGVtcGxhdGVVcmw6ICcuL3BhZ2luYXRpb24tcGVyLXBhZ2UuY29tcG9uZW50Lmh0bWwnLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgRG9rdVBhZ2luYXRpb25QZXJQYWdlIGltcGxlbWVudHMgT25Jbml0LCBPbkRlc3Ryb3ksIEFmdGVyVmlld0luaXQge1xuICByZWFkb25seSBkZWZhdWx0SXRlbXNQZXJQYWdlID0gNTtcblxuICAvKipcbiAgICogSXRlbXMgcGVyIHBhZ2Ugb3B0aW9ucy5cbiAgICogQGRlZmF1bHQgWzUsMTAsMTUsMjAsMjVdXG4gICAqL1xuICBASW5wdXQoKSBvcHRpb25zOiBudW1iZXJbXSA9IFs1LCAxMCwgMTUsIDIwLCAyNV07XG5cbiAgLyoqXG4gICAqIExhYmVsIG9mIHRoZSBvcHRpb25zLlxuICAgKiBAZGVmYXVsdCAnaXRlbXMgcGVyIHBhZ2UnXG4gICAqL1xuICBASW5wdXQoKSBvcHRpb25MYWJlbCA9ICdpdGVtcyBwZXIgcGFnZSc7XG5cbiAgLy8gVGhlIHZhbHVlIGNhbiBiZSBhIG51bWJlciBvciBzdHJpbmcgYmVjYXVzZSBpdCBwYXNzZWQgdG8gdGhlIHNlbGVjdCBjb21wb25lbnRcbiAgLy8gd2hlcmUgdGhlIHZhbHVlIHdpbGwgYWx3YXlzIGJlIGNvbnZlcnRlZCB0byBzdHJpbmcuXG4gIHByb3RlY3RlZCBpdGVtc1BlclBhZ2UgPSBuZXcgRm9ybUNvbnRyb2w8c3RyaW5nIHwgbnVtYmVyPih0aGlzLmRlZmF1bHRJdGVtc1BlclBhZ2UsIHtcbiAgICBub25OdWxsYWJsZTogdHJ1ZSxcbiAgfSk7XG5cbiAgcHJpdmF0ZSBkZXN0cm95JCA9IG5ldyBSZXBsYXlTdWJqZWN0KCk7XG5cbiAgY29uc3RydWN0b3IoXG4gICAgcHJpdmF0ZSBjZHI6IENoYW5nZURldGVjdG9yUmVmLFxuICAgIEBJbmplY3QoRG9rdVBhZ2luYXRpb25Db250YWluZXIpIHByaXZhdGUgY29udGFpbmVyPzogRG9rdVBhZ2luYXRpb25Db250YWluZXJcbiAgKSB7fVxuXG4gIHByb3RlY3RlZCBnZXQgbm9ybWFsaXplZE9wdGlvbnMoKSB7XG4gICAgcmV0dXJuIHRoaXMub3B0aW9ucy5tYXAoKG9wdGlvbikgPT4gKHtcbiAgICAgIGxhYmVsOiBgJHtvcHRpb259ICR7dGhpcy5vcHRpb25MYWJlbH1gLFxuICAgICAgdmFsdWU6IG9wdGlvbixcbiAgICB9KSk7XG4gIH1cblxuICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICB0aGlzLml0ZW1zUGVyUGFnZS52YWx1ZUNoYW5nZXNcbiAgICAgIC5waXBlKFxuICAgICAgICBkaXN0aW5jdFVudGlsQ2hhbmdlZCgpLFxuICAgICAgICBza2lwKDEpLFxuICAgICAgICBtYXAodGhpcy5jb252ZXJ0VmFsdWVUb051bWJlciksXG4gICAgICAgIHRha2VVbnRpbCh0aGlzLmRlc3Ryb3kkKVxuICAgICAgKVxuICAgICAgLnN1YnNjcmliZSgodmFsdWUpID0+IHtcbiAgICAgICAgdGhpcy5jb250YWluZXI/LlsncGFnaW5hdGlvbiddPy5bJ2NoYW5nZUl0ZW1zUGVyUGFnZSddPy4odmFsdWUpO1xuICAgICAgfSk7XG4gIH1cblxuICBuZ0FmdGVyVmlld0luaXQoKTogdm9pZCB7XG4gICAgLy8gU2V0IGluaXRpYWwgaXRlbXMgcGVyIHBhZ2UgZnJvbSBwYWdpbmF0aW9uIGNvbXBvbmVudFxuICAgIHRoaXMuY29udGFpbmVyPy5bJ3BhZ2luYXRpb24nXT8uWyd0cmlnZ2VyQ2hhbmdlJ11cbiAgICAgIC5waXBlKFxuICAgICAgICBzdGFydFdpdGgodGhpcy5jb250YWluZXJbJ3BhZ2luYXRpb24nXS5pdGVtc1BlclBhZ2UgfHwgdGhpcy5kZWZhdWx0SXRlbXNQZXJQYWdlKSxcbiAgICAgICAgdGFrZVVudGlsKHRoaXMuZGVzdHJveSQpXG4gICAgICApXG4gICAgICAuc3Vic2NyaWJlKCgpID0+IHtcbiAgICAgICAgY29uc3QgaXRlbXNQZXJQYWdlID1cbiAgICAgICAgICB0aGlzLmNvbnRhaW5lcj8uWydwYWdpbmF0aW9uJ10/Lml0ZW1zUGVyUGFnZSB8fCB0aGlzLmRlZmF1bHRJdGVtc1BlclBhZ2U7XG4gICAgICAgIHRoaXMuaXRlbXNQZXJQYWdlLnNldFZhbHVlKGl0ZW1zUGVyUGFnZSk7XG4gICAgICB9KTtcbiAgICB0aGlzLmNkci5kZXRlY3RDaGFuZ2VzKCk7XG4gIH1cblxuICBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICB0aGlzLmRlc3Ryb3kkLm5leHQodHJ1ZSk7XG4gICAgdGhpcy5kZXN0cm95JC5jb21wbGV0ZSgpO1xuICB9XG5cbiAgcHJpdmF0ZSBjb252ZXJ0VmFsdWVUb051bWJlcih2YWx1ZTogc3RyaW5nIHwgbnVtYmVyKSB7XG4gICAgdHJ5IHtcbiAgICAgIHJldHVybiB0eXBlb2YgdmFsdWUgPT09ICdzdHJpbmcnID8gcGFyc2VJbnQodmFsdWUpIDogdmFsdWU7XG4gICAgfSBjYXRjaCAoZXJyb3IpIHtcbiAgICAgIHJldHVybiB0aGlzLmRlZmF1bHRJdGVtc1BlclBhZ2U7XG4gICAgfVxuICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwiZC1wYWdpbmF0aW9uLXBlci1wYWdlXCI+XG4gIDxkb2t1LWZvcm0tZmllbGQ+XG4gICAgPGRva3Utc2VsZWN0IFtpdGVtc109XCJub3JtYWxpemVkT3B0aW9uc1wiIFtmb3JtQ29udHJvbF09XCJpdGVtc1BlclBhZ2VcIj48L2Rva3Utc2VsZWN0PlxuICA8L2Rva3UtZm9ybS1maWVsZD5cbjwvZGl2PlxuIl19