@colijnit/corecomponents_v12 12.0.46 → 12.0.49

package/lib/components/drop-down-list/drop-down-list.component.d.ts

@@ -17,6 +17,9 @@ export declare class DropDownListComponent extends BaseInputComponent<any> {
      */
     fields: Object;
     placeholder: string;
+    allowFiltering: boolean;
+    filterBarPlaceholder: string;
+    filterType: string;
     itemTemplate: TemplateRef<any>;
     headerTemplate: TemplateRef<any>;
     valueTemplate: TemplateRef<any>;

package/lib/components/input-search/input-search.component.d.ts

@@ -4,9 +4,9 @@ import { BaseInputComponent } from '../base/base-input.component';
 export declare class InputSearchComponent extends BaseInputComponent<string> implements OnDestroy {
     readonly searchIcon: CoreComponentsIcon;
     placeholder: string;
-    iconRight: boolean;
-    noIcon: boolean;
     search: EventEmitter<string>;
+    useLeftIcon: boolean;
+    useRightIcon: boolean;
     showClass(): boolean;
     handleKeyDown(event: KeyboardEvent): void;
 }

package/lib/components/input-text/style/_layout.scss

@@ -23,18 +23,21 @@
         width: calc(100% - #{$cc-item-size});
       }
     }
+
     &.has-right-icon {
       .input-text-right-icon {
         position: absolute;
+        right: 0;
         height: $cc-item-size;
         width: $cc-item-size;
-        top: 0;
-        right: 0;
       }
       input, label {
+        margin-right: $cc-item-size;
         width: calc(100% - #{$cc-item-size});
       }
     }
+
+
     &.hideArrows {
       input::-webkit-outer-spin-button,
       input::-webkit-inner-spin-button {

package/lib/components/pagination/paginate.pipe.d.ts

@@ -0,0 +1,18 @@
+import { PipeTransform } from "@angular/core";
+import { PaginationService } from "./pagination.service";
+export declare class PaginatePipe implements PipeTransform {
+    private paginateService;
+    private state;
+    constructor(paginateService: PaginationService);
+    transform(collection: any[], args: any): any;
+    private _createInstance;
+    private _checkConfig;
+    /**
+     * To avoid returning a brand new array each time the pipe is run, we store the state of the sliced
+     * array for a given id. This means that the next time the pipe is run on this collection & id, we just
+     * need to check that the collection, start and end points are all identical, and if so, return the
+     * last sliced array.
+     */
+    private _saveState;
+    private _stateIsIdentical;
+}

package/lib/components/pagination/pagination-instance.d.ts

@@ -0,0 +1,14 @@
+export interface IPaginationInstance {
+    id?: string;
+    itemsPerPage: number;
+    currentPage: number;
+    /**
+     * The total number of items in the collection. Only useful when
+     * doing server-side paging, where the collection size is limited
+     * to a single page returned by the server API.
+     *
+     * For in-memory paging, this property should not be set, as it
+     * will be automatically set to the value of  collection.length.
+     */
+    totalItems?: number;
+}

package/lib/components/pagination/pagination.component.d.ts

@@ -0,0 +1,46 @@
+import { ElementRef, EventEmitter, OnChanges, OnDestroy, OnInit } from '@angular/core';
+import { PaginationService } from './pagination.service';
+export interface IPage {
+    label: string;
+    value: any;
+}
+export declare class PaginationComponent implements OnInit, OnChanges, OnDestroy {
+    private _paginationService;
+    readonly template: ElementRef;
+    id: string;
+    maxSize: number;
+    directionLinks: boolean;
+    previousLabel: string;
+    nextLabel: string;
+    autoHide: boolean;
+    readonly pageChange: EventEmitter<number>;
+    showClass: boolean;
+    pages: IPage[];
+    private changeSub;
+    constructor(_paginationService: PaginationService);
+    ngOnInit(): void;
+    ngOnChanges(): void;
+    ngOnDestroy(): void;
+    goToFirstPage(): void;
+    goToPreviousPage(): void;
+    goToNextPage(): void;
+    setCurrentPage(page: number): void;
+    isOnFirstPage(): boolean;
+    isOnLastPage(): boolean;
+    shouldBeHidden(): boolean;
+    /**
+     * Updates the page links and checks that the current page is valid. Should run whenever the
+     * PaginationService.change stream emits a value matching the current ID, or when any of the
+     * input values changes.
+     */
+    private _updatePageLinks;
+    getCurrentPage(): number;
+    private getLastPage;
+    /**
+     * Checks that the instance.currentPage property is within bounds for the current page range.
+     * If not, return a correct value for currentPage, or the current value if OK.
+     */
+    private outOfBoundCorrection;
+    private createPageArray;
+    private calculatePageNumber;
+}

package/lib/components/pagination/pagination.module.d.ts

@@ -0,0 +1,2 @@
+export declare class PaginationModule {
+}

package/lib/components/pagination/pagination.service.d.ts

@@ -0,0 +1,24 @@
+import { Subject } from "rxjs";
+import { IPaginationInstance } from "./pagination-instance";
+export declare class PaginationService {
+    private static readonly DEFAULT_ID;
+    change: Subject<string>;
+    get DEFAULT_ID(): string;
+    private readonly instances;
+    constructor();
+    register(instance: IPaginationInstance): void;
+    getCurrentPage(id: string): number;
+    setCurrentPage(id: string, page: number): void;
+    setTotalItems(id: string, totalItems: number): void;
+    setItemsPerPage(id: string, itemsPerPage: number): void;
+    /**
+     * Returns a clone of the pagination instance object matching the id. If no
+     * id specified, returns the instance corresponding to the default id.
+     */
+    getInstance(id?: string): IPaginationInstance;
+    /**
+     * Check each property of the instance and update any that have changed. Return
+     * true if any changes were made, else return false.
+     */
+    private updateInstance;
+}

package/lib/components/pagination/style/_layout.scss

@@ -0,0 +1,87 @@
+@include export-module('cc-pagination-layout') {
+  .co-pagination {
+    display: block;
+    height: $cc-co-pagination-height;
+    font-family: $cc-co-pagination-font-family;
+    font-size: $cc-co-pagination-font-size;
+
+    .pagination-component-main-wrapper {
+      background: none;
+      display: flex;
+      align-items: center;
+      padding: 0 20px;
+      height: 100%;
+
+      ul.pagination {
+        display: flex;
+        justify-content: flex-end;
+        flex-wrap: wrap;
+        width: 100%;
+        list-style-type: none;
+      }
+
+      li {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        flex-grow: 0;
+        flex-shrink: 0;
+        width: 40px;
+        height: 40px;
+        cursor: default;
+        color: #2b60a7;
+        border: 1px solid $cc-co-pagination-border-color;
+        border-radius: 5px;
+        background-color: transparent;
+        font-size: $cc-co-pagination-font-size;
+        -webkit-user-select: none;
+        -moz-user-select: none;
+        -ms-user-select: none;
+        user-select: none;
+
+        &:not(:last-child) {
+          margin-right: 4px;
+        }
+      }
+
+      li.pagination-next, li.pagination-previous {
+        font-size: $cc-co-pagination-font-size-small;
+        cursor: pointer;
+        flex-grow: 0;
+        width: auto;
+        text-align: center;
+        padding: 0 15px;
+      }
+
+      li.pagination-next a:after {
+        content: '';
+        border: solid #2b60a7;
+        border-width: 0 3px 3px 0;
+        display: inline-block;
+        padding: 3px;
+        transform: rotate(-45deg);
+        -webkit-transform: rotate(-45deg);
+        margin-left: 5px;
+      }
+
+      li.pagination-previous a:before {
+        content: '';
+        border: solid #2b60a7;
+        border-width: 0 3px 3px 0;
+        display: inline-block;
+        padding: 3px;
+        transform: rotate(135deg);
+        -webkit-transform: rotate(135deg);
+        margin-right: 5px;
+      }
+
+      li.current {
+        border: 1px solid $cc-co-pagination-active-color;
+        font-weight: bold;
+        opacity: 1;
+        cursor: default;
+      }
+    }
+  }
+}
+

package/lib/components/pagination/style/_material-definition.scss

@@ -0,0 +1,6 @@
+$cc-co-pagination-font-family: $cc-font-family !default;
+$cc-co-pagination-font-size: $cc-font-size-default !default;
+$cc-co-pagination-font-size-small: $cc-font-size-small !default;
+$cc-co-pagination-height: 60px !default;
+$cc-co-pagination-active-color: $cc-color-action;
+$cc-co-pagination-border-color: $cc-color-border;

package/lib/components/pagination/style/_theme.scss

@@ -0,0 +1,5 @@
+@include export-module('cc-pagination-theme') {
+  .co-pagination {
+  }
+}
+

package/lib/components/pagination/style/material.scss

@@ -0,0 +1,5 @@
+@import "../../../style/mixin";
+@import "../../../style/input.mixins";
+@import "./material-definition";
+@import "./layout";
+@import "./theme";

package/lib/components/simple-grid/simple-grid-cell.component.d.ts

@@ -1,6 +1,6 @@
-import { ChangeDetectorRef, EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
+import { ChangeDetectorRef, EventEmitter } from '@angular/core';
 import { ColumnAlign, SimpleGridColumnDirective } from "./simple-grid-column.directive";
-export declare class SimpleGridCellComponent implements OnChanges {
+export declare class SimpleGridCellComponent {
     private _changeDetector;
     readonly defaultTextAlign: ColumnAlign;
     set editTemplateContent(template: any);
@@ -20,7 +20,6 @@ export declare class SimpleGridCellComponent implements OnChanges {
     private _template;
     private _inputTemplate;
     constructor(_changeDetector: ChangeDetectorRef);
-    ngOnChanges(changes: SimpleChanges): void;
     private _setFocusComponent;
     private _getFirstFormInput;
     private _createNewEvent;

package/lib/core/interface/filter-item-viewmodel.d.ts

@@ -3,4 +3,5 @@ export interface FilterItemViewmodel {
     code: string | number;
     description: string;
     count?: number;
+    valueName?: string;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@colijnit/corecomponents_v12",
-  "version": "12.0.46",
+  "version": "12.0.49",
   "description": "Colijn IT core components for Angular 12",
   "private": false,
   "peerDependencies": {

package/public-api.d.ts

@@ -90,3 +90,5 @@ export * from './lib/components/filter-item/filter-item.component';
 export * from './lib/components/filter-item/filter-item.module';
 export * from './lib/directives/clickoutside/clickoutside.module';
 export * from './lib/directives/observe-visibility/observe-visibility.module';
+export * from './lib/components/pagination/pagination.component';
+export * from './lib/components/pagination/pagination.module';