@libs-ui/components-pagination 0.2.321-0 → 0.2.322-0
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.
|
@@ -132,10 +132,10 @@ export class LibsUiComponentsPaginationComponent {
|
|
|
132
132
|
this.renderPagination();
|
|
133
133
|
}
|
|
134
134
|
}
|
|
135
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
136
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.
|
|
135
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsPaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
136
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsPaginationComponent, isStandalone: true, selector: "libs_ui-components-pagination", inputs: { showTotalPage: { classPropertyName: "showTotalPage", publicName: "showTotalPage", isSignal: true, isRequired: false, transformFunction: null }, showInputGotoPage: { classPropertyName: "showInputGotoPage", publicName: "showInputGotoPage", isSignal: true, isRequired: false, transformFunction: null }, modeDisplayTotalPageAndGotoPage: { classPropertyName: "modeDisplayTotalPageAndGotoPage", publicName: "modeDisplayTotalPageAndGotoPage", isSignal: true, isRequired: false, transformFunction: null }, classDisplayTotalPageAndGotoPage: { classPropertyName: "classDisplayTotalPageAndGotoPage", publicName: "classDisplayTotalPageAndGotoPage", isSignal: true, isRequired: false, transformFunction: null }, classIncludeContainer: { classPropertyName: "classIncludeContainer", publicName: "classIncludeContainer", isSignal: true, isRequired: false, transformFunction: null }, classIncludeItem: { classPropertyName: "classIncludeItem", publicName: "classIncludeItem", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, numberPageDispaly: { classPropertyName: "numberPageDispaly", publicName: "numberPageDispaly", isSignal: true, isRequired: false, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: true, transformFunction: null }, perPage: { classPropertyName: "perPage", publicName: "perPage", isSignal: true, isRequired: true, transformFunction: null }, currentPage: { classPropertyName: "currentPage", publicName: "currentPage", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { currentPage: "currentPageChange", outPageSelect: "outPageSelect" }, providers: [TranslateProviderConfig], ngImport: i0, template: "<div class=\"flex flex-col items-center flex-wrap w-full justify-center {{ classIncludeContainer() ?? '' }}\">\n @let constHtmlDisplayTotalPageAndGotoPage = showTotalPage() || showInputGotoPage();\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'top') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n <div class=\"flex shrink-0 h-full items-center\">\n @let constHtmlDisableButtonPre = currentPage() <= 1 || totalPage() <= 1 || disable();\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'left') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n <div\n class=\"libs-ui-components-pagination-button rotate-[180deg] pl-[14px] pr-[6px]\"\n [class.libs-ui-disable]=\"constHtmlDisableButtonPre\"\n [class.pointer-events-none]=\"constHtmlDisableButtonPre\"\n (click)=\"prePage($event)\">\n <i class=\"libs-ui-icon-chevron-right libs-ui-font-h2r\"></i>\n </div>\n @for (item of listPageDisplay(); track item.key) {\n <div\n class=\"libs-ui-components-pagination-item libs-ui-font-h3m {{ classIncludeItem() ?? '' }}\"\n [class.libs-ui-components-pagination-active]=\"item.key === currentPage() + ''\"\n [class.libs-ui-disable]=\"disable()\"\n [class.pointer-events-none]=\"disable()\"\n (click)=\"selectPage($event, item)\">\n {{ item.value }}\n </div>\n } @empty {\n <div class=\"libs-ui-font-h5m text-[#9CA2AD] mx-[12px] flex shrink-0\">\n {{ 'i18n_no_data_yet' | translate }}\n </div>\n }\n @let constHtmlDisableButtonNext = currentPage() >= totalPage() || disable();\n <div\n class=\"libs-ui-components-pagination-button pl-[14px] pr-[6p]x\"\n [class.libs-ui-disable]=\"constHtmlDisableButtonNext\"\n [class.pointer-events-none]=\"constHtmlDisableButtonNext\"\n (click)=\"nextPage($event)\">\n <i class=\"libs-ui-icon-chevron-right libs-ui-font-h2r\"></i>\n </div>\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'right') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n </div>\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'bottom') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n</div>\n\n<ng-template #gotoPageNumberRef>\n <div\n class=\"flex shrink-0 h-full items-center {{ classDisplayTotalPageAndGotoPage() ?? '' }}\"\n [class.mb-[16px]]=\"modeDisplayTotalPageAndGotoPage() === 'top'\"\n [class.mt-[16px]]=\"modeDisplayTotalPageAndGotoPage() === 'bottom'\">\n @if (showTotalPage()) {\n <div class=\"libs-ui-font-h5m text-[#9CA2AD] mx-[12px]\">\n {{ 'i18n_value_sum_page' | translate: { value: totalPage() } }}\n </div>\n }\n @if (showInputGotoPage()) {\n @if (showTotalPage()) {\n <div class=\"h-[16px] w-[1px] bg-[#CDD0D6]\"></div>\n }\n <div class=\"libs-ui-font-h5m text-[#9CA2AD] mx-[12px] flex shrink-0\">\n {{ 'i18n_go_to' | translate }}\n </div>\n <div class=\"w-[60px] mr-[12px] shrink-0\">\n <libs_ui-components-inputs-input\n [dataType]=\"'int'\"\n classInclude=\"!rounded-[6px]\"\n [maxValueNumber]=\"totalPage()\"\n [emitEmptyInDataTypeNumber]=\"true\"\n [defaultHeight]=\"28\"\n [value]=\"gotoPageNumber() || ''\"\n (outChange)=\"changePage($event)\"\n (outEnterEvent)=\"handlerEnterInput()\"\n [disable]=\"disable() || totalPage() <= 5\" />\n </div>\n }\n </div>\n</ng-template>\n", styles: [":host{width:100%}.libs-ui-components-pagination-item{color:#1c1f22;display:flex;flex-shrink:0;align-items:center;justify-content:center;padding:4px 12px;cursor:pointer}.libs-ui-components-pagination-item [class^=mo-svg-font]:before{color:#1c1f22;font-size:var(--mo-heading-4-size)!important}.libs-ui-components-pagination-item.libs-ui-components-pagination-active{color:var(--libs-ui-color-default)}.libs-ui-components-pagination-item.libs-ui-components-pagination-active [class^=mo-svg-font]:before{color:var(--libs-ui-color-default)}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: LibsUiComponentsInputsInputComponent, selector: "libs_ui-components-inputs-input", inputs: ["tagInput", "dataType", "typeInput", "modeInput", "tabInsertContentTagInput", "textAreaEnterNotNewLine", "emitEmptyInDataTypeNumber", "keepZeroInTypeInt", "autoAddZeroLessThan10InTypeInt", "ignoreBlockInputMaxValue", "maxValueNumber", "minValueNumber", "fixedFloat", "acceptNegativeValue", "valueUpDownNumber", "classInclude", "maxLength", "readonly", "disable", "noBorder", "backgroundNone", "borderError", "useColorModeExist", "placeholder", "keepPlaceholderOnly", "value", "autoRemoveEmoji", "defaultHeight", "minHeightTextArea", "maxHeightTextArea", "focusTimeOut", "selectAllTimeOut", "blurTimeOut", "zIndexPopoverContent", "classContainerInput", "showCount", "ignoreStopPropagationEvent", "resize", "templateLeftBottomInput", "templateRightBottomInput", "classContainerBottomInput", "ignoreWidthInput100", "iframeTextareaCustomStyle", "iconLeftClass", "popoverContentIconLeft", "iconRightClass", "popoverContentIconRight", "resetAutoCompletePassword", "acceptOnlyClickIcon", "setIconRightColorSameColorDisableReadOnly", "onlyAcceptNegativeValue", "maxLengthNumberCount", "focusInput"], outputs: ["maxValueNumberChange", "minValueNumberChange", "fixedFloatChange", "acceptNegativeValueChange", "maxLengthChange", "valueChange", "maxLengthNumberCountChange", "outHeightAreaChange", "outChange", "outFocusAndBlurEvent", "outEnterEvent", "outInputEvent", "outIconLeft", "outIconRight", "outFunctionsControl", "outFilesDrop", "outFileDrop", "outChangeValueByButtonUpDown"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
137
137
|
}
|
|
138
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
138
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsPaginationComponent, decorators: [{
|
|
139
139
|
type: Component,
|
|
140
140
|
args: [{ selector: 'libs_ui-components-pagination', standalone: true, imports: [TranslateModule, LibsUiComponentsInputsInputComponent, NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, providers: [TranslateProviderConfig], template: "<div class=\"flex flex-col items-center flex-wrap w-full justify-center {{ classIncludeContainer() ?? '' }}\">\n @let constHtmlDisplayTotalPageAndGotoPage = showTotalPage() || showInputGotoPage();\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'top') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n <div class=\"flex shrink-0 h-full items-center\">\n @let constHtmlDisableButtonPre = currentPage() <= 1 || totalPage() <= 1 || disable();\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'left') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n <div\n class=\"libs-ui-components-pagination-button rotate-[180deg] pl-[14px] pr-[6px]\"\n [class.libs-ui-disable]=\"constHtmlDisableButtonPre\"\n [class.pointer-events-none]=\"constHtmlDisableButtonPre\"\n (click)=\"prePage($event)\">\n <i class=\"libs-ui-icon-chevron-right libs-ui-font-h2r\"></i>\n </div>\n @for (item of listPageDisplay(); track item.key) {\n <div\n class=\"libs-ui-components-pagination-item libs-ui-font-h3m {{ classIncludeItem() ?? '' }}\"\n [class.libs-ui-components-pagination-active]=\"item.key === currentPage() + ''\"\n [class.libs-ui-disable]=\"disable()\"\n [class.pointer-events-none]=\"disable()\"\n (click)=\"selectPage($event, item)\">\n {{ item.value }}\n </div>\n } @empty {\n <div class=\"libs-ui-font-h5m text-[#9CA2AD] mx-[12px] flex shrink-0\">\n {{ 'i18n_no_data_yet' | translate }}\n </div>\n }\n @let constHtmlDisableButtonNext = currentPage() >= totalPage() || disable();\n <div\n class=\"libs-ui-components-pagination-button pl-[14px] pr-[6p]x\"\n [class.libs-ui-disable]=\"constHtmlDisableButtonNext\"\n [class.pointer-events-none]=\"constHtmlDisableButtonNext\"\n (click)=\"nextPage($event)\">\n <i class=\"libs-ui-icon-chevron-right libs-ui-font-h2r\"></i>\n </div>\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'right') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n </div>\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'bottom') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n</div>\n\n<ng-template #gotoPageNumberRef>\n <div\n class=\"flex shrink-0 h-full items-center {{ classDisplayTotalPageAndGotoPage() ?? '' }}\"\n [class.mb-[16px]]=\"modeDisplayTotalPageAndGotoPage() === 'top'\"\n [class.mt-[16px]]=\"modeDisplayTotalPageAndGotoPage() === 'bottom'\">\n @if (showTotalPage()) {\n <div class=\"libs-ui-font-h5m text-[#9CA2AD] mx-[12px]\">\n {{ 'i18n_value_sum_page' | translate: { value: totalPage() } }}\n </div>\n }\n @if (showInputGotoPage()) {\n @if (showTotalPage()) {\n <div class=\"h-[16px] w-[1px] bg-[#CDD0D6]\"></div>\n }\n <div class=\"libs-ui-font-h5m text-[#9CA2AD] mx-[12px] flex shrink-0\">\n {{ 'i18n_go_to' | translate }}\n </div>\n <div class=\"w-[60px] mr-[12px] shrink-0\">\n <libs_ui-components-inputs-input\n [dataType]=\"'int'\"\n classInclude=\"!rounded-[6px]\"\n [maxValueNumber]=\"totalPage()\"\n [emitEmptyInDataTypeNumber]=\"true\"\n [defaultHeight]=\"28\"\n [value]=\"gotoPageNumber() || ''\"\n (outChange)=\"changePage($event)\"\n (outEnterEvent)=\"handlerEnterInput()\"\n [disable]=\"disable() || totalPage() <= 5\" />\n </div>\n }\n </div>\n</ng-template>\n", styles: [":host{width:100%}.libs-ui-components-pagination-item{color:#1c1f22;display:flex;flex-shrink:0;align-items:center;justify-content:center;padding:4px 12px;cursor:pointer}.libs-ui-components-pagination-item [class^=mo-svg-font]:before{color:#1c1f22;font-size:var(--mo-heading-4-size)!important}.libs-ui-components-pagination-item.libs-ui-components-pagination-active{color:var(--libs-ui-color-default)}.libs-ui-components-pagination-item.libs-ui-components-pagination-active [class^=mo-svg-font]:before{color:var(--libs-ui-color-default)}\n"] }]
|
|
141
141
|
}], ctorParameters: () => [] });
|
|
@@ -133,10 +133,10 @@ class LibsUiComponentsPaginationComponent {
|
|
|
133
133
|
this.renderPagination();
|
|
134
134
|
}
|
|
135
135
|
}
|
|
136
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
137
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.
|
|
136
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsPaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
137
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsPaginationComponent, isStandalone: true, selector: "libs_ui-components-pagination", inputs: { showTotalPage: { classPropertyName: "showTotalPage", publicName: "showTotalPage", isSignal: true, isRequired: false, transformFunction: null }, showInputGotoPage: { classPropertyName: "showInputGotoPage", publicName: "showInputGotoPage", isSignal: true, isRequired: false, transformFunction: null }, modeDisplayTotalPageAndGotoPage: { classPropertyName: "modeDisplayTotalPageAndGotoPage", publicName: "modeDisplayTotalPageAndGotoPage", isSignal: true, isRequired: false, transformFunction: null }, classDisplayTotalPageAndGotoPage: { classPropertyName: "classDisplayTotalPageAndGotoPage", publicName: "classDisplayTotalPageAndGotoPage", isSignal: true, isRequired: false, transformFunction: null }, classIncludeContainer: { classPropertyName: "classIncludeContainer", publicName: "classIncludeContainer", isSignal: true, isRequired: false, transformFunction: null }, classIncludeItem: { classPropertyName: "classIncludeItem", publicName: "classIncludeItem", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, numberPageDispaly: { classPropertyName: "numberPageDispaly", publicName: "numberPageDispaly", isSignal: true, isRequired: false, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: true, transformFunction: null }, perPage: { classPropertyName: "perPage", publicName: "perPage", isSignal: true, isRequired: true, transformFunction: null }, currentPage: { classPropertyName: "currentPage", publicName: "currentPage", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { currentPage: "currentPageChange", outPageSelect: "outPageSelect" }, providers: [TranslateProviderConfig], ngImport: i0, template: "<div class=\"flex flex-col items-center flex-wrap w-full justify-center {{ classIncludeContainer() ?? '' }}\">\n @let constHtmlDisplayTotalPageAndGotoPage = showTotalPage() || showInputGotoPage();\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'top') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n <div class=\"flex shrink-0 h-full items-center\">\n @let constHtmlDisableButtonPre = currentPage() <= 1 || totalPage() <= 1 || disable();\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'left') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n <div\n class=\"libs-ui-components-pagination-button rotate-[180deg] pl-[14px] pr-[6px]\"\n [class.libs-ui-disable]=\"constHtmlDisableButtonPre\"\n [class.pointer-events-none]=\"constHtmlDisableButtonPre\"\n (click)=\"prePage($event)\">\n <i class=\"libs-ui-icon-chevron-right libs-ui-font-h2r\"></i>\n </div>\n @for (item of listPageDisplay(); track item.key) {\n <div\n class=\"libs-ui-components-pagination-item libs-ui-font-h3m {{ classIncludeItem() ?? '' }}\"\n [class.libs-ui-components-pagination-active]=\"item.key === currentPage() + ''\"\n [class.libs-ui-disable]=\"disable()\"\n [class.pointer-events-none]=\"disable()\"\n (click)=\"selectPage($event, item)\">\n {{ item.value }}\n </div>\n } @empty {\n <div class=\"libs-ui-font-h5m text-[#9CA2AD] mx-[12px] flex shrink-0\">\n {{ 'i18n_no_data_yet' | translate }}\n </div>\n }\n @let constHtmlDisableButtonNext = currentPage() >= totalPage() || disable();\n <div\n class=\"libs-ui-components-pagination-button pl-[14px] pr-[6p]x\"\n [class.libs-ui-disable]=\"constHtmlDisableButtonNext\"\n [class.pointer-events-none]=\"constHtmlDisableButtonNext\"\n (click)=\"nextPage($event)\">\n <i class=\"libs-ui-icon-chevron-right libs-ui-font-h2r\"></i>\n </div>\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'right') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n </div>\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'bottom') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n</div>\n\n<ng-template #gotoPageNumberRef>\n <div\n class=\"flex shrink-0 h-full items-center {{ classDisplayTotalPageAndGotoPage() ?? '' }}\"\n [class.mb-[16px]]=\"modeDisplayTotalPageAndGotoPage() === 'top'\"\n [class.mt-[16px]]=\"modeDisplayTotalPageAndGotoPage() === 'bottom'\">\n @if (showTotalPage()) {\n <div class=\"libs-ui-font-h5m text-[#9CA2AD] mx-[12px]\">\n {{ 'i18n_value_sum_page' | translate: { value: totalPage() } }}\n </div>\n }\n @if (showInputGotoPage()) {\n @if (showTotalPage()) {\n <div class=\"h-[16px] w-[1px] bg-[#CDD0D6]\"></div>\n }\n <div class=\"libs-ui-font-h5m text-[#9CA2AD] mx-[12px] flex shrink-0\">\n {{ 'i18n_go_to' | translate }}\n </div>\n <div class=\"w-[60px] mr-[12px] shrink-0\">\n <libs_ui-components-inputs-input\n [dataType]=\"'int'\"\n classInclude=\"!rounded-[6px]\"\n [maxValueNumber]=\"totalPage()\"\n [emitEmptyInDataTypeNumber]=\"true\"\n [defaultHeight]=\"28\"\n [value]=\"gotoPageNumber() || ''\"\n (outChange)=\"changePage($event)\"\n (outEnterEvent)=\"handlerEnterInput()\"\n [disable]=\"disable() || totalPage() <= 5\" />\n </div>\n }\n </div>\n</ng-template>\n", styles: [":host{width:100%}.libs-ui-components-pagination-item{color:#1c1f22;display:flex;flex-shrink:0;align-items:center;justify-content:center;padding:4px 12px;cursor:pointer}.libs-ui-components-pagination-item [class^=mo-svg-font]:before{color:#1c1f22;font-size:var(--mo-heading-4-size)!important}.libs-ui-components-pagination-item.libs-ui-components-pagination-active{color:var(--libs-ui-color-default)}.libs-ui-components-pagination-item.libs-ui-components-pagination-active [class^=mo-svg-font]:before{color:var(--libs-ui-color-default)}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: LibsUiComponentsInputsInputComponent, selector: "libs_ui-components-inputs-input", inputs: ["tagInput", "dataType", "typeInput", "modeInput", "tabInsertContentTagInput", "textAreaEnterNotNewLine", "emitEmptyInDataTypeNumber", "keepZeroInTypeInt", "autoAddZeroLessThan10InTypeInt", "ignoreBlockInputMaxValue", "maxValueNumber", "minValueNumber", "fixedFloat", "acceptNegativeValue", "valueUpDownNumber", "classInclude", "maxLength", "readonly", "disable", "noBorder", "backgroundNone", "borderError", "useColorModeExist", "placeholder", "keepPlaceholderOnly", "value", "autoRemoveEmoji", "defaultHeight", "minHeightTextArea", "maxHeightTextArea", "focusTimeOut", "selectAllTimeOut", "blurTimeOut", "zIndexPopoverContent", "classContainerInput", "showCount", "ignoreStopPropagationEvent", "resize", "templateLeftBottomInput", "templateRightBottomInput", "classContainerBottomInput", "ignoreWidthInput100", "iframeTextareaCustomStyle", "iconLeftClass", "popoverContentIconLeft", "iconRightClass", "popoverContentIconRight", "resetAutoCompletePassword", "acceptOnlyClickIcon", "setIconRightColorSameColorDisableReadOnly", "onlyAcceptNegativeValue", "maxLengthNumberCount", "focusInput"], outputs: ["maxValueNumberChange", "minValueNumberChange", "fixedFloatChange", "acceptNegativeValueChange", "maxLengthChange", "valueChange", "maxLengthNumberCountChange", "outHeightAreaChange", "outChange", "outFocusAndBlurEvent", "outEnterEvent", "outInputEvent", "outIconLeft", "outIconRight", "outFunctionsControl", "outFilesDrop", "outFileDrop", "outChangeValueByButtonUpDown"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
138
138
|
}
|
|
139
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
139
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsPaginationComponent, decorators: [{
|
|
140
140
|
type: Component,
|
|
141
141
|
args: [{ selector: 'libs_ui-components-pagination', standalone: true, imports: [TranslateModule, LibsUiComponentsInputsInputComponent, NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, providers: [TranslateProviderConfig], template: "<div class=\"flex flex-col items-center flex-wrap w-full justify-center {{ classIncludeContainer() ?? '' }}\">\n @let constHtmlDisplayTotalPageAndGotoPage = showTotalPage() || showInputGotoPage();\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'top') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n <div class=\"flex shrink-0 h-full items-center\">\n @let constHtmlDisableButtonPre = currentPage() <= 1 || totalPage() <= 1 || disable();\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'left') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n <div\n class=\"libs-ui-components-pagination-button rotate-[180deg] pl-[14px] pr-[6px]\"\n [class.libs-ui-disable]=\"constHtmlDisableButtonPre\"\n [class.pointer-events-none]=\"constHtmlDisableButtonPre\"\n (click)=\"prePage($event)\">\n <i class=\"libs-ui-icon-chevron-right libs-ui-font-h2r\"></i>\n </div>\n @for (item of listPageDisplay(); track item.key) {\n <div\n class=\"libs-ui-components-pagination-item libs-ui-font-h3m {{ classIncludeItem() ?? '' }}\"\n [class.libs-ui-components-pagination-active]=\"item.key === currentPage() + ''\"\n [class.libs-ui-disable]=\"disable()\"\n [class.pointer-events-none]=\"disable()\"\n (click)=\"selectPage($event, item)\">\n {{ item.value }}\n </div>\n } @empty {\n <div class=\"libs-ui-font-h5m text-[#9CA2AD] mx-[12px] flex shrink-0\">\n {{ 'i18n_no_data_yet' | translate }}\n </div>\n }\n @let constHtmlDisableButtonNext = currentPage() >= totalPage() || disable();\n <div\n class=\"libs-ui-components-pagination-button pl-[14px] pr-[6p]x\"\n [class.libs-ui-disable]=\"constHtmlDisableButtonNext\"\n [class.pointer-events-none]=\"constHtmlDisableButtonNext\"\n (click)=\"nextPage($event)\">\n <i class=\"libs-ui-icon-chevron-right libs-ui-font-h2r\"></i>\n </div>\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'right') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n </div>\n @if (constHtmlDisplayTotalPageAndGotoPage && modeDisplayTotalPageAndGotoPage() === 'bottom') {\n <ng-container *ngTemplateOutlet=\"gotoPageNumberRef\" />\n }\n</div>\n\n<ng-template #gotoPageNumberRef>\n <div\n class=\"flex shrink-0 h-full items-center {{ classDisplayTotalPageAndGotoPage() ?? '' }}\"\n [class.mb-[16px]]=\"modeDisplayTotalPageAndGotoPage() === 'top'\"\n [class.mt-[16px]]=\"modeDisplayTotalPageAndGotoPage() === 'bottom'\">\n @if (showTotalPage()) {\n <div class=\"libs-ui-font-h5m text-[#9CA2AD] mx-[12px]\">\n {{ 'i18n_value_sum_page' | translate: { value: totalPage() } }}\n </div>\n }\n @if (showInputGotoPage()) {\n @if (showTotalPage()) {\n <div class=\"h-[16px] w-[1px] bg-[#CDD0D6]\"></div>\n }\n <div class=\"libs-ui-font-h5m text-[#9CA2AD] mx-[12px] flex shrink-0\">\n {{ 'i18n_go_to' | translate }}\n </div>\n <div class=\"w-[60px] mr-[12px] shrink-0\">\n <libs_ui-components-inputs-input\n [dataType]=\"'int'\"\n classInclude=\"!rounded-[6px]\"\n [maxValueNumber]=\"totalPage()\"\n [emitEmptyInDataTypeNumber]=\"true\"\n [defaultHeight]=\"28\"\n [value]=\"gotoPageNumber() || ''\"\n (outChange)=\"changePage($event)\"\n (outEnterEvent)=\"handlerEnterInput()\"\n [disable]=\"disable() || totalPage() <= 5\" />\n </div>\n }\n </div>\n</ng-template>\n", styles: [":host{width:100%}.libs-ui-components-pagination-item{color:#1c1f22;display:flex;flex-shrink:0;align-items:center;justify-content:center;padding:4px 12px;cursor:pointer}.libs-ui-components-pagination-item [class^=mo-svg-font]:before{color:#1c1f22;font-size:var(--mo-heading-4-size)!important}.libs-ui-components-pagination-item.libs-ui-components-pagination-active{color:var(--libs-ui-color-default)}.libs-ui-components-pagination-item.libs-ui-components-pagination-active [class^=mo-svg-font]:before{color:var(--libs-ui-color-default)}\n"] }]
|
|
142
142
|
}], ctorParameters: () => [] });
|