@pepperi-addons/ngx-lib 0.4.2-beta.316 → 0.4.2-beta.317
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/list/list-pager.component.mjs +4 -6
- package/esm2020/list/list.model.mjs +1 -1
- package/fesm2015/pepperi-addons-ngx-lib-list.mjs +3 -5
- package/fesm2015/pepperi-addons-ngx-lib-list.mjs.map +1 -1
- package/fesm2020/pepperi-addons-ngx-lib-list.mjs +3 -5
- package/fesm2020/pepperi-addons-ngx-lib-list.mjs.map +1 -1
- package/list/list-pager.component.d.ts +2 -3
- package/package.json +1 -1
|
@@ -1129,8 +1129,7 @@ const DEFAULT_PAGE_SIZE = 50;
|
|
|
1129
1129
|
class IPepListPagerChangeEvent {
|
|
1130
1130
|
}
|
|
1131
1131
|
class PepListPagerComponent {
|
|
1132
|
-
constructor(
|
|
1133
|
-
this._changeDetectorRef = _changeDetectorRef;
|
|
1132
|
+
constructor(layoutService) {
|
|
1134
1133
|
this.layoutService = layoutService;
|
|
1135
1134
|
this.disabled = false;
|
|
1136
1135
|
this.showPageSizeSelector = false;
|
|
@@ -1149,7 +1148,6 @@ class PepListPagerComponent {
|
|
|
1149
1148
|
this.pagerChange = new EventEmitter();
|
|
1150
1149
|
this.resizeSub = this.layoutService.onResize$.subscribe((size) => {
|
|
1151
1150
|
this.screenSize = size;
|
|
1152
|
-
this._changeDetectorRef.detectChanges();
|
|
1153
1151
|
});
|
|
1154
1152
|
}
|
|
1155
1153
|
set pageSizeOptions(value) {
|
|
@@ -1256,7 +1254,7 @@ class PepListPagerComponent {
|
|
|
1256
1254
|
});
|
|
1257
1255
|
}
|
|
1258
1256
|
}
|
|
1259
|
-
PepListPagerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepListPagerComponent, deps: [{ token:
|
|
1257
|
+
PepListPagerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepListPagerComponent, deps: [{ token: i1.PepLayoutService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1260
1258
|
PepListPagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PepListPagerComponent, selector: "pep-list-pager", inputs: { disabled: "disabled", showPageSizeSelector: "showPageSizeSelector", showFirstLastButtons: "showFirstLastButtons", pageSizeOptions: "pageSizeOptions", pageIndex: "pageIndex", length: "length", pageSize: "pageSize" }, outputs: { pagerChange: "pagerChange" }, ngImport: i0, template: "<div class=\"pager-container body-sm\">\n <span class=\"pep-spacing-element\">{{ 'LIST.PAGER_PAGE' | translate }}</span>\n <button *ngIf=\"showFirstLastButtons && screenSize <= PepScreenSizeType.MD\" mat-button [disabled]=\"disabled || !hasPreviousPage()\"\n [ngClass]=\"{ disabled: disabled || !hasPreviousPage() }\"\n class=\"pep-button icon-button pep-spacing-element sm weak\" pepRtlDirection pepMenuBlur (click)=\"firstPage()\"\n [title]=\"('LIST.PAGER_FIRST' | translate)\">\n <mat-icon>\n <pep-icon [name]=\"layoutService.isRtl() ? 'arrow_back_right' : 'arrow_back_left'\"></pep-icon>\n </mat-icon>\n </button>\n <button mat-button [disabled]=\"disabled || _previousButtonsDisabled()\"\n [ngClass]=\"{ disabled: disabled || _previousButtonsDisabled() }\"\n class=\"pep-button icon-button pep-spacing-element sm weak\" pepRtlDirection pepMenuBlur (click)=\"previousPage()\"\n [title]=\"('LIST.PAGER_PREVIOUS' | translate)\">\n <mat-icon>\n <pep-icon [name]=\"layoutService.isRtl() ? 'arrow_right' : 'arrow_left'\"></pep-icon>\n </mat-icon>\n </button>\n <pep-textbox pepAutoWidth class=\"page-index pep-spacing-element\" [key]=\"'pageIndex'\" [type]=\"'int'\"\n [disabled]=\"disabled\" [xAlignment]=\"'center'\" [renderTitle]=\"false\" [renderError]=\"false\" [renderSymbol]=\"false\"\n [value]=\"pageIndex + 1\" [minValue]=\"1\" [maxValue]=\"this.getNumberOfPages()\"\n [maxFieldCharacters]=\"6\" [mandatory]=\"true\" (valueChange)=\"onValueChange($event)\">\n </pep-textbox>\n <button mat-button [disabled]=\"disabled || _nextButtonsDisabled()\"\n [ngClass]=\"{ disabled: disabled || _nextButtonsDisabled() }\"\n class=\"pep-button icon-button pep-spacing-element sm weak\" pepRtlDirection pepMenuBlur (click)=\"nextPage()\"\n [title]=\"('LIST.PAGER_NEXT' | translate)\">\n <mat-icon>\n <pep-icon [name]=\"layoutService.isRtl() ? 'arrow_left' : 'arrow_right'\"></pep-icon>\n </mat-icon>\n </button>\n <button *ngIf=\"showFirstLastButtons && screenSize <= PepScreenSizeType.MD\" mat-button [disabled]=\"disabled || !hasNextPage()\"\n [ngClass]=\"{ disabled: disabled || !hasNextPage() }\"\n class=\"pep-button icon-button pep-spacing-element sm weak\" pepRtlDirection pepMenuBlur (click)=\"lastPage()\"\n [title]=\"('LIST.PAGER_LAST' | translate)\">\n <mat-icon>\n <pep-icon [name]=\"layoutService.isRtl() ? 'arrow_back_left' : 'arrow_back_right'\"></pep-icon>\n </mat-icon>\n </button>\n <span class=\"pep-spacing-element\">{{ 'LIST.PAGER_OUT_OF' | translate }}</span>\n <span class=\"pep-spacing-element\">{{ getNumberOfPages() }}</span>\n <ng-container *ngIf=\"showPageSizeSelector\">\n <pep-select pepAutoWidth class=\"page-size pep-spacing-element\" [key]=\"'pageSize'\" [value]=\"pageSize?.toString()\"\n [disabled]=\"disabled\" [renderTitle]=\"false\" [emptyOption]=\"false\" [options]=\"pageSizeOptionsForSelect\"\n (valueChange)=\"onPageSizeChange($event)\">\n </pep-select>\n <span class=\"pep-spacing-element\">{{ 'LIST.PAGER_ITEMS_PER_PAGE' | translate }}</span>\n </ng-container>\n</div>", styles: [".pager-container{display:flex;justify-content:center;align-items:center;height:calc(2rem + calc(var(--pep-spacing-sm, .5rem) * 2));padding:var(--pep-spacing-sm, .5rem)}.pager-container .page-size{min-height:unset;margin-bottom:0}.pager-container .page-size ::ng-deep .mat-form-field-flex{padding:0 .5rem;min-height:2rem}.pager-container .page-index{min-height:unset;margin-bottom:0}.pager-container .page-index ::ng-deep .mat-form-field-flex{padding:0 .5rem;min-height:2rem}.pager-container .page-index ::ng-deep .mat-form-field-flex .mat-input-element{min-width:1.25rem}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1.PepInputAutoWidthDirective, selector: "[pepAutoWidth]", inputs: ["includePadding"] }, { kind: "directive", type: i1.PepMenuBlurDirective, selector: "[pepMenuBlur]" }, { kind: "directive", type: i1.PepRtlDirectionDirective, selector: "[pepRtlDirection]" }, { kind: "component", type: i5.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }, { kind: "component", type: i6.PepSelectComponent, selector: "pep-select", inputs: ["key", "value", "label", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "placeholder", "placeholderWhenDisabled", "autoSortOptions", "options", "visible", "emptyOption", "form", "layoutType", "parentFieldKey", "isActive", "showTitle", "renderTitle", "typeaheadDebounceInterval", "addValueToOptionsIfNotExist"], outputs: ["valueChange", "validationChange"] }, { kind: "component", type: i7.PepTextboxComponent, selector: "pep-textbox", inputs: ["key", "value", "minFractionDigits", "maxFractionDigits", "accessory", "label", "placeholder", "type", "mandatory", "disabled", "readonly", "maxFieldCharacters", "hint", "textColor", "xAlignment", "rowSpan", "minValue", "maxValue", "visible", "form", "isActive", "showTitle", "renderTitle", "renderError", "renderSymbol", "layoutType", "parentFieldKey", "regex", "regexError", "isInFocus"], outputs: ["valueChange", "keyup", "validationChange"] }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }] });
|
|
1261
1259
|
PepListPagerComponent.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepListPagerComponent });
|
|
1262
1260
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepListPagerComponent, decorators: [{
|
|
@@ -1264,7 +1262,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImpor
|
|
|
1264
1262
|
args: [{ selector: 'pep-list-pager', template: "<div class=\"pager-container body-sm\">\n <span class=\"pep-spacing-element\">{{ 'LIST.PAGER_PAGE' | translate }}</span>\n <button *ngIf=\"showFirstLastButtons && screenSize <= PepScreenSizeType.MD\" mat-button [disabled]=\"disabled || !hasPreviousPage()\"\n [ngClass]=\"{ disabled: disabled || !hasPreviousPage() }\"\n class=\"pep-button icon-button pep-spacing-element sm weak\" pepRtlDirection pepMenuBlur (click)=\"firstPage()\"\n [title]=\"('LIST.PAGER_FIRST' | translate)\">\n <mat-icon>\n <pep-icon [name]=\"layoutService.isRtl() ? 'arrow_back_right' : 'arrow_back_left'\"></pep-icon>\n </mat-icon>\n </button>\n <button mat-button [disabled]=\"disabled || _previousButtonsDisabled()\"\n [ngClass]=\"{ disabled: disabled || _previousButtonsDisabled() }\"\n class=\"pep-button icon-button pep-spacing-element sm weak\" pepRtlDirection pepMenuBlur (click)=\"previousPage()\"\n [title]=\"('LIST.PAGER_PREVIOUS' | translate)\">\n <mat-icon>\n <pep-icon [name]=\"layoutService.isRtl() ? 'arrow_right' : 'arrow_left'\"></pep-icon>\n </mat-icon>\n </button>\n <pep-textbox pepAutoWidth class=\"page-index pep-spacing-element\" [key]=\"'pageIndex'\" [type]=\"'int'\"\n [disabled]=\"disabled\" [xAlignment]=\"'center'\" [renderTitle]=\"false\" [renderError]=\"false\" [renderSymbol]=\"false\"\n [value]=\"pageIndex + 1\" [minValue]=\"1\" [maxValue]=\"this.getNumberOfPages()\"\n [maxFieldCharacters]=\"6\" [mandatory]=\"true\" (valueChange)=\"onValueChange($event)\">\n </pep-textbox>\n <button mat-button [disabled]=\"disabled || _nextButtonsDisabled()\"\n [ngClass]=\"{ disabled: disabled || _nextButtonsDisabled() }\"\n class=\"pep-button icon-button pep-spacing-element sm weak\" pepRtlDirection pepMenuBlur (click)=\"nextPage()\"\n [title]=\"('LIST.PAGER_NEXT' | translate)\">\n <mat-icon>\n <pep-icon [name]=\"layoutService.isRtl() ? 'arrow_left' : 'arrow_right'\"></pep-icon>\n </mat-icon>\n </button>\n <button *ngIf=\"showFirstLastButtons && screenSize <= PepScreenSizeType.MD\" mat-button [disabled]=\"disabled || !hasNextPage()\"\n [ngClass]=\"{ disabled: disabled || !hasNextPage() }\"\n class=\"pep-button icon-button pep-spacing-element sm weak\" pepRtlDirection pepMenuBlur (click)=\"lastPage()\"\n [title]=\"('LIST.PAGER_LAST' | translate)\">\n <mat-icon>\n <pep-icon [name]=\"layoutService.isRtl() ? 'arrow_back_left' : 'arrow_back_right'\"></pep-icon>\n </mat-icon>\n </button>\n <span class=\"pep-spacing-element\">{{ 'LIST.PAGER_OUT_OF' | translate }}</span>\n <span class=\"pep-spacing-element\">{{ getNumberOfPages() }}</span>\n <ng-container *ngIf=\"showPageSizeSelector\">\n <pep-select pepAutoWidth class=\"page-size pep-spacing-element\" [key]=\"'pageSize'\" [value]=\"pageSize?.toString()\"\n [disabled]=\"disabled\" [renderTitle]=\"false\" [emptyOption]=\"false\" [options]=\"pageSizeOptionsForSelect\"\n (valueChange)=\"onPageSizeChange($event)\">\n </pep-select>\n <span class=\"pep-spacing-element\">{{ 'LIST.PAGER_ITEMS_PER_PAGE' | translate }}</span>\n </ng-container>\n</div>", styles: [".pager-container{display:flex;justify-content:center;align-items:center;height:calc(2rem + calc(var(--pep-spacing-sm, .5rem) * 2));padding:var(--pep-spacing-sm, .5rem)}.pager-container .page-size{min-height:unset;margin-bottom:0}.pager-container .page-size ::ng-deep .mat-form-field-flex{padding:0 .5rem;min-height:2rem}.pager-container .page-index{min-height:unset;margin-bottom:0}.pager-container .page-index ::ng-deep .mat-form-field-flex{padding:0 .5rem;min-height:2rem}.pager-container .page-index ::ng-deep .mat-form-field-flex .mat-input-element{min-width:1.25rem}\n"] }]
|
|
1265
1263
|
}, {
|
|
1266
1264
|
type: Injectable
|
|
1267
|
-
}], ctorParameters: function () { return [{ type:
|
|
1265
|
+
}], ctorParameters: function () { return [{ type: i1.PepLayoutService }]; }, propDecorators: { disabled: [{
|
|
1268
1266
|
type: Input
|
|
1269
1267
|
}], showPageSizeSelector: [{
|
|
1270
1268
|
type: Input
|