@koalarx/ui 12.4.1 → 12.4.2

package/list/koalarx-ui-list.metadata.json

@@ -0,0 +1 @@
+{"__symbolic":"module","version":4,"metadata":{"PaginationProvider":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@angular/material/paginator","name":"MatPaginatorIntl","line":4,"character":40},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":3,"character":1}}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"getAndInitTranslations":[{"__symbolic":"method"}]}},"KoalaListService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":3,"character":1},"arguments":[{"providedIn":"any"}]}],"members":{"build":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"KoalaListPageSize":{"__symbolic":"interface"},"ListAbstract":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@koalarx/ui/form","name":"FormAbstract","line":15,"character":43},"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"error","message":"Expression form not supported","line":37,"character":29,"module":"./lib/list.abstract"},{"__symbolic":"error","message":"Expression form not supported","line":38,"character":37,"module":"./lib/list.abstract"},{"__symbolic":"error","message":"Expression form not supported","line":39,"character":16,"module":"./lib/list.abstract"}]}],"selectAll":[{"__symbolic":"method"}],"defineStatusSelectAll":[{"__symbolic":"method"}],"selectItem":[{"__symbolic":"method"}],"search":[{"__symbolic":"method"}],"onDestroy":[{"__symbolic":"method"}],"afterViewInit":[{"__symbolic":"method"}],"prepareSearch":[{"__symbolic":"method"}],"isAllSelected":[{"__symbolic":"method"}],"runRequestFunction":[{"__symbolic":"method"}]}},"ListComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"ListAbstract"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":16,"character":1},"arguments":[{"selector":"koala-list","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":20,"character":19},"member":"OnPush"},"template":"<div class=\"list-container\">\n  <div *ngIf=\"filterFormConfig\" class=\"list-filter\">\n    <form (ngSubmit)=\"filterSubmit()\" [formGroup]=\"formFilter\">\n      <div class=\"main\">\n        <koala-dynamic-form\n          *ngIf=\"filterFormConfig.main\"\n          [form]=\"filterFormConfig.main.form\"\n          [formConfig]=\"filterFormConfig.main.formConfig\"\n          [setValues]=\"filterFormConfig.main.setValues\"\n          [showFields]=\"filterFormConfig.main.showFields\">\n        </koala-dynamic-form>\n        <ul>\n          <li *ngIf=\"filterFormConfig.advanced\" class=\"option\">\n            <button (click)=\"toogleFilter()\" color=\"primary\" mat-icon-button matTooltip=\"Filtro Avançado\"\n                    matTooltipPosition=\"below\" type=\"button\">\n              <mat-icon>tune</mat-icon>\n            </button>\n          </li>\n          <li *ngIf=\"filterFormConfig.checkAndSearch\" class=\"checkbox-filter\">\n            <mat-checkbox (click)=\"filterSubmit()\"\n                          [formControlName]=\"filterFormConfig.checkAndSearch.formControlName\">\n              {{filterFormConfig.checkAndSearch.label}}\n            </mat-checkbox>\n          </li>\n          <li class=\"option\">\n            <koala-submit\n              [btnSubmitDisabled]=\"btnSubmitDisabled\"\n              [fg]=\"formFilter\"\n              [iconButton]=\"true\"\n              [loader]=\"loader\"\n              icon=\"search\">\n            </koala-submit>\n          </li>\n        </ul>\n      </div>\n      <div *ngIf=\"filterFormConfig.advanced\" [ngClass]=\"{'show': showAdvancedFilter}\" class=\"advanced\">\n        <div class=\"container-filter\">\n          <koala-dynamic-form\n            [form]=\"filterFormConfig.advanced.form\"\n            [formConfig]=\"filterFormConfig.advanced.formConfig\"\n            [setValues]=\"filterFormConfig.advanced.setValues\"\n            [showFields]=\"filterFormConfig.advanced.showFields\">\n          </koala-dynamic-form>\n        </div>\n      </div>\n    </form>\n  </div>\n  <nav class=\"menu-list\">\n    <ul class=\"menu\">\n      <li *ngIf=\"selection.hasValue()\">\n        <ng-content select=\"[itemsSelectList]\"></ng-content>\n      </li>\n      <li *ngIf=\"selection.hasValue()\" class=\"text-center\">|</li>\n      <li>\n        <ng-content select=\"[itemsList]\"></ng-content>\n      </li>\n    </ul>\n  </nav>\n  <div *ngIf=\"loader | async\" class=\"spinner-container\" [ngClass]=\"{\n    'no-filter': !filterFormConfig\n  }\">\n    <mat-spinner diameter=\"40\"></mat-spinner>\n  </div>\n  <div class=\"list\">\n    <table\n      *ngIf=\"!emptyListComponent || (emptyListComponent && dataSource?.data?.length > 0) else emptyList\"\n      [dataSource]=\"dataSource\"\n      [matSortActive]=\"columnSort\"\n      class=\"table-hover\"\n      mat-table\n      matSort\n      [matSortDirection]=\"sortDirection\" matSortDisableClear>\n      <ng-container matColumnDef=\"select\">\n        <th *matHeaderCellDef mat-header-cell>\n          <mat-checkbox (change)=\"$event ? selectAll() : null\"\n                        [checked]=\"selection.hasValue() && allSelected$ | async\"\n                        [indeterminate]=\"selection.hasValue() && !(allSelected$ | async)\">\n          </mat-checkbox>\n        </th>\n        <td *matCellDef=\"let item\" mat-cell>\n          <mat-checkbox *ngIf=\"disabledCheckboxItemList ? !disabledCheckboxItemList(item) : true\"\n                        (change)=\"$event ? selection.toggle(item) : null\"\n                        (click)=\"$event.stopPropagation(); selectItem();\"\n                        [checked]=\"selection.isSelected(item)\">\n          </mat-checkbox>\n        </td>\n      </ng-container>\n\n      <ng-container *ngFor=\"let itemList of itemsList\" [matColumnDef]=\"itemList.columnDef\">\n        <th *matHeaderCellDef [mat-sort-header]=\"itemList.sortHeader\" [disabled]=\"!itemList.sortHeader\" mat-header-cell>{{itemList.label}}</th>\n        <td (dblclick)=\"itemList.dblClick(item)\" *matCellDef=\"let item\" mat-cell>\n\t        <koala-dynamic-component *ngIf=\"itemList.itemComponent else itemText\"\n\t                                 [dynamicComponent]=\"itemList.itemComponent(item)\"></koala-dynamic-component>\n\t        <ng-template #itemText>\n\t          {{itemList.itemNameProperty(item)}}\n\t        </ng-template>\n        </td>\n      </ng-container>\n\n      <ng-container matColumnDef=\"options\">\n        <th *matHeaderCellDef mat-header-cell></th>\n        <td *matCellDef=\"let item\" mat-cell>\n          <div *ngIf=\"haveOptionsOnItemLine(item)\">\n            <button [matMenuTriggerFor]=\"options\" mat-icon-button type=\"button\">\n              <i class='material-icons'>more_vert</i>\n            </button>\n            <mat-menu #options=\"matMenu\" class=\"menu-list\" yPosition=\"below\">\n\t            <div *ngFor=\"let option of itemsMenuListOptions\">\n\t              <button\n\t\t              (click)=\"option.action(item)\"\n\t\t              *ngIf=\"option.havePermission && (\n\t\t                !option.showByItemList ||\n\t\t                option.showByItemList(item)\n\t                )\"\n\t\t              mat-menu-item>\n\t                <mat-icon>{{option.icon}}</mat-icon>\n\t                <span>{{option.name}}</span>\n\t              </button>\n\t            </div>\n            </mat-menu>\n          </div>\n        </td>\n      </ng-container>\n      <tr *matHeaderRowDef=\"columnsToShowInList; sticky: true\" mat-header-row></tr>\n      <tr *matRowDef=\"let item; columns: columnsToShowInList;\" mat-row></tr>\n    </table>\n    <ng-template #emptyList>\n      <koala-dynamic-component *ngIf=\"!(filterError$ | async) else errorList\" [dynamicComponent]=\"emptyListComponent\"></koala-dynamic-component>\n      <ng-template #errorList>\n        <koala-dynamic-component [dynamicComponent]=\"errorListComponent\"></koala-dynamic-component>\n      </ng-template>\n    </ng-template>\n  </div>\n  <div class=\"content-paginator\">\n    <mat-paginator\n      [length]=\"qtdListResult\"\n      [pageSizeOptions]=\"limitOptions\"\n      [pageSize]=\"pageSize\"\n      showFirstLastButtons>\n    </mat-paginator>\n  </div>\n</div>\n","styles":[".list-container{border-radius:10px;margin:0 auto;overflow-x:hidden;width:calc(100% - 40px);position:relative}.list-container .spinner-container{position:absolute;width:100%;height:calc(100vh - 320px);top:100px;left:0;background:rgba(0,0,0,.15);z-index:2;display:flex;align-items:center;justify-content:center}.list-container .spinner-container.no-filter{top:40px}.list-container .list{display:block;height:calc(100vh - 320px);overflow-y:auto;position:relative;top:0;width:100%;z-index:1}.list-container .list table:not(.table-not-selection) .mat-header-cell:first-child,.list-container .list .mat-header-cell:last-child{width:5%}.list-container .list .mat-header-cell:last-child{text-align:center}.list-container .list .mat-header-row,.list-container .list .mat-row{height:35px}.list-container .list .mat-row .mat-icon-button{height:35px;line-height:35px;width:35px}.list-container .list tr.detail-row:not(.expanded-row){height:0}.list-container .list .element-detail{display:flex;overflow:hidden}.list-container .list table{position:relative;width:100%;font-family:OpenSans,sans-serif;font-size:1em}.list-container .list table.table-hover tr{cursor:pointer;transition:.2s}.list-container .list table th:first-child,.list-container .list table td:first-child{padding:0 8px 0 20px}.list-container .list table th{font-size:.7em;padding:0 8px;font-family:\"OpenSans\",sans-serif;line-height:1em}.list-container .list table td{font-size:.8em;padding:0 8px;font-family:OpenSans,sans-serif}.list-container .list table th:last-child,.list-container .list table td:last-child{padding:0 20px 0 8px}.list-container .list .mat-list-item-content,.list-container .list .mat-list-item-content .mat-list-text{padding:0}.list-container .list-filter{box-shadow:0 1px 3px #0000004d;height:60px;position:relative;z-index:3}.list-container .list-filter .main{display:flex;justify-content:space-between;font-size:1.05em;height:60px;overflow:hidden;padding-left:2.5px;position:relative;width:100%}.list-container .list-filter .main koala-dynamic-form{width:100%}.list-container .list-filter .main mat-form-field{display:inline-block}.list-container .list-filter .main .mat-form-field-appearance-fill .mat-form-field-flex{background:transparent}.list-container .list-filter .main .mat-form-field .mat-form-field-wrapper{padding-bottom:0}.list-container .list-filter .main .mat-form-field-underline{display:none}.list-container .list-filter .main .mat-form-field-appearance-legacy .mat-form-field-subscript-wrapper{display:none}.list-container .list-filter .main .mat-form-field-wrapper .mat-form-field-subscript-wrapper{display:none}.list-container .list-filter ul{display:flex;align-items:center;font-size:0;list-style:none;margin:0;padding:0 15px 0 0;position:relative;text-align:right}.list-container .list-filter ul li{display:inline-block;font-size:14px;padding:5px;position:relative}.list-container .list-filter ul li.option button{transition:.2s}.list-container .list-filter ul li.option button:hover{background:rgba(0,0,0,.1)}.list-container .list-filter ul li.checkbox-filter{text-align:center}.list-container .list-filter ul li.checkbox-filter .checkbox-inline{top:-5px}.list-container .list-filter ul li.checkbox-filter input[type=checkbox]{margin-left:0}.list-container .list-filter ul li.checkbox-filter label{padding:0!important;width:auto}.list-container .list-filter .advanced{border-top:1px solid #dddddd;box-shadow:0 3px 10px #0000004d;height:0;overflow-x:hidden;overflow-y:auto;position:absolute;top:60px;transition:.2s;width:100%;z-index:1}.list-container .list-filter .advanced .container-filter{padding:15px}.list-container .list-filter .advanced.show{height:360px}.list-container nav.menu-list{height:40px;margin:0;padding:3px 0;position:relative;transition:.2s;width:100%;z-index:2;box-sizing:border-box}.list-container nav.menu-list ul.menu{float:left;font-size:0;list-style:none;margin:0;padding:0 10px;position:relative;text-align:left}.list-container nav.menu-list ul.menu li{color:#616161;display:inline-block;font-size:16px;padding:0 4px}.list-container nav.menu-list ul.menu li button.mat-button,.list-container nav.menu-list ul.menu li button.koala-icon-button{display:inline-block}.list-container .content-paginator mat-paginator .mat-paginator-container{height:40px!important;min-height:40px!important}.list-container .content-paginator mat-paginator .mat-paginator-container .mat-paginator-page-size-select{height:40px;margin-top:0!important}.list-container .content-paginator mat-paginator .mat-paginator-container .mat-paginator-range-label{margin-top:3px}.list-container .content-paginator{position:relative;background:transparent!important;z-index:2;box-shadow:-3px 1px 3px #0000004d}@media (max-width: 900px){.list-container{width:100%;box-shadow:none!important;padding:15px 10px 15px 15px;box-sizing:border-box}.list-container .list{height:auto;overflow:unset}.list-container .list-filter .main{justify-content:flex-end}}\n"]}]}],"members":{"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"paginator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":25,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/material/paginator","name":"MatPaginator","line":25,"character":13}]}]}],"sort":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":26,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/material/sort","name":"MatSort","line":26,"character":13},{"static":false}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":45,"character":16},{"__symbolic":"reference","module":"@koalarx/ui/form","name":"KoalaDynamicFormService","line":46,"character":32},{"__symbolic":"reference","module":"ngx-device-detector","name":"DeviceDetectorService","line":47,"character":27}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"filterSubmit":[{"__symbolic":"method"}],"toogleFilter":[{"__symbolic":"method"}],"haveOptionsOnItemLine":[{"__symbolic":"method"}],"initConfig":[{"__symbolic":"method"}]}},"KoalaListFilterInterface":{"__symbolic":"interface"},"KoalaListFormFilterInterface":{"__symbolic":"interface"},"KoalaListItemMenuOptionInterface":{"__symbolic":"interface"},"KoalaListConfigInterface":{"__symbolic":"interface"},"KoalaListModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":13,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"ListComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":18,"character":4},{"__symbolic":"reference","module":"@koalarx/ui/folder-page","name":"KoalaFolderPageModule","line":19,"character":4},{"__symbolic":"reference","module":"@koalarx/ui/form","name":"KoalaFormModule","line":20,"character":4},{"__symbolic":"reference","module":"@koalarx/ui/dynamic-component","name":"KoalaDynamicComponentModule","line":21,"character":4},{"__symbolic":"reference","module":"@angular/material/menu","name":"MatMenuModule","line":22,"character":4},{"__symbolic":"reference","module":"@angular/material/table","name":"MatTableModule","line":23,"character":4},{"__symbolic":"reference","module":"@angular/material/sort","name":"MatSortModule","line":24,"character":4},{"__symbolic":"reference","module":"@angular/material/tooltip","name":"MatTooltipModule","line":25,"character":4},{"__symbolic":"reference","module":"@angular/material/paginator","name":"MatPaginatorModule","line":26,"character":4}],"exports":[{"__symbolic":"reference","name":"ListComponent"}],"providers":[{"provide":{"__symbolic":"reference","module":"@angular/material/paginator","name":"MatPaginatorIntl","line":32,"character":13},"useClass":{"__symbolic":"reference","name":"PaginationProvider"}}]}]}],"members":{}},"KoalaListItemInterface":{"__symbolic":"interface"}},"origins":{"PaginationProvider":"./lib/providers/pagination/pagination.provider","KoalaListService":"./lib/koala.list.service","KoalaListPageSize":"./lib/list.abstract","ListAbstract":"./lib/list.abstract","ListComponent":"./lib/list.component","KoalaListFilterInterface":"./lib/koala-list-filter.interface","KoalaListFormFilterInterface":"./lib/koala-list-form-filter.interface","KoalaListItemMenuOptionInterface":"./lib/koala-list-item-menu-option.interface","KoalaListConfigInterface":"./lib/koala.list-config.interface","KoalaListModule":"./lib/koala.list.module","KoalaListItemInterface":"./lib/koala-list-item.interface"},"importAs":"@koalarx/ui/list"}

package/list/{koala-list-filter.interface.d.ts → lib/koala-list-filter.interface.d.ts}

@@ -1,4 +1,4 @@
-import { KoalaDynamicFormConfigInterface } from "../form/dynamic-form/interfaces/koala.dynamic-form-config.interface";
+import { KoalaDynamicFormConfigInterface } from "@koalarx/ui/form";
 export interface KoalaListFilterInterface {
     main?: KoalaDynamicFormConfigInterface;
     advanced?: KoalaDynamicFormConfigInterface;

package/list/{koala-list-item.interface.d.ts → lib/koala-list-item.interface.d.ts}

@@ -1,4 +1,4 @@
-import { KoalaDynamicComponent } from '../dynamic-component/koala-dynamic-component';
+import { KoalaDynamicComponent } from '@koalarx/ui/dynamic-component';
 export interface KoalaListItemInterface<DataType> {
     label: string;
     columnDef: string;

package/list/{koala.list-config.interface.d.ts → lib/koala.list-config.interface.d.ts}

@@ -4,7 +4,7 @@ import { KoalaListItemInterface } from "./koala-list-item.interface";
 import { BehaviorSubject, Observable } from "rxjs";
 import { KoalaListFilterInterface } from "./koala-list-filter.interface";
 import { KoalaListFormFilterInterface } from "./koala-list-form-filter.interface";
-import { KoalaDynamicComponent } from "../dynamic-component/koala-dynamic-component";
+import { KoalaDynamicComponent } from "@koalarx/ui/dynamic-component";
 import { KoalaListPageSize } from "./list.abstract";
 import { SortDirection } from "@angular/material/sort";
 export interface KoalaListConfigInterface {
@@ -14,7 +14,7 @@ export interface KoalaListConfigInterface {
     itemsMenuListOptions?: KoalaListItemMenuOptionInterface<any>[];
     itemsList: KoalaListItemInterface<any>[];
     request: Observable<any>;
-    responseIndexName: string;
+    responseIndexName?: string;
     responseQtdResultIndexName: (response: any) => number;
     typeRequest?: 'all' | 'onDemand';
     filterFormConfig: KoalaListFilterInterface;

package/list/lib/koala.list.module.d.ts

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

package/list/lib/koala.list.service.d.ts

@@ -0,0 +1,4 @@
+import { ListBuilder } from "./list-builder/list.builder";
+export declare class KoalaListService {
+    build<DataType>(): ListBuilder<DataType>;
+}

package/list/{list-builder → lib/list-builder}/list.builder.d.ts

@@ -9,7 +9,7 @@ import { SelectionModel } from "@angular/cdk/collections";
 import { KoalaListPageSize } from "../list.abstract";
 export declare class ListBuilder<DataType> {
     private config;
-    service(service: (filter: BehaviorSubject<KoalaListFormFilterInterface>) => Observable<any> | Promise<any>, type?: 'all' | 'onDemand', resultIndexName?: string, qtdResultIndexName?: string): this;
+    service(service: (filter: BehaviorSubject<KoalaListFormFilterInterface> | null) => Observable<any> | Promise<any>, type?: 'all' | 'onDemand', resultIndexName?: string, qtdResultIndexName?: string): this;
     filterConfig(config: KoalaListFilterInterface): this;
     defaultFilter(config: KoalaListFormFilterInterface): this;
     pageSize(size: KoalaListPageSize): this;

package/list/{list.abstract.d.ts → lib/list.abstract.d.ts}

@@ -2,11 +2,11 @@ import { SelectionModel } from '@angular/cdk/collections';
 import { MatPaginator } from '@angular/material/paginator';
 import { MatSort } from '@angular/material/sort';
 import { BehaviorSubject, Observable } from 'rxjs';
-import { FormAbstract } from '../core/form.abstract';
+import { FormAbstract } from '@koalarx/ui/form';
 import { FormGroup } from '@angular/forms';
 import { MatTableDataSource } from '@angular/material/table';
 import { KoalaListFormFilterInterface } from './koala-list-form-filter.interface';
-import { KoalaDynamicComponent } from "../dynamic-component/koala-dynamic-component";
+import { KoalaDynamicComponent } from "@koalarx/ui/dynamic-component";
 import { KoalaListConfigInterface } from "./koala.list-config.interface";
 export declare type KoalaListPageSize = 10 | 20 | 30 | 50 | 100;
 export declare abstract class ListAbstract extends FormAbstract {
@@ -23,11 +23,11 @@ export declare abstract class ListAbstract extends FormAbstract {
     emptyListComponent?: KoalaDynamicComponent;
     errorListComponent?: KoalaDynamicComponent;
     pageSize: KoalaListPageSize;
-    protected config: KoalaListConfigInterface;
-    protected paginator: MatPaginator;
-    protected sort: MatSort;
-    private subscriptionList;
-    private subscriptionSortList;
+    protected config?: KoalaListConfigInterface;
+    protected paginator?: MatPaginator;
+    protected sort?: MatSort;
+    private subscriptionList?;
+    private subscriptionSortList?;
     private intervalSortList;
     protected constructor(requestFunction: () => Observable<any>, requestResponseFunction: <T>(results: T[]) => void, formSearch: () => FormGroup);
     selectAll(): void;

package/list/{list.component.d.ts → lib/list.component.d.ts}

@@ -4,32 +4,31 @@ import { KoalaListItemMenuOptionInterface } from './koala-list-item-menu-option.
 import { FormBuilder, FormGroup } from '@angular/forms';
 import { BehaviorSubject, Observable } from 'rxjs';
 import { KoalaListFilterInterface } from './koala-list-filter.interface';
-import { KoalaDynamicFormService } from '../form/dynamic-form/koala.dynamic-form.service';
+import { KoalaDynamicFormService } from '@koalarx/ui/form';
 import { KoalaListItemInterface } from './koala-list-item.interface';
 import { MatSort, SortDirection } from "@angular/material/sort";
 import { DeviceDetectorService } from "ngx-device-detector";
 import { KoalaListConfigInterface } from "./koala.list-config.interface";
 import { MatPaginator } from "@angular/material/paginator";
-import * as i0 from "@angular/core";
 export declare class ListComponent extends ListAbstract implements OnInit, AfterViewInit, OnDestroy {
     private fb;
     private dynamicFormService;
     private deviceService;
-    config: KoalaListConfigInterface;
+    config?: KoalaListConfigInterface;
     protected paginator: MatPaginator;
     protected sort: MatSort;
-    columnsToShowInList: string[];
-    columnSort: string;
+    columnsToShowInList?: string[];
+    columnSort?: string;
     sortDirection: SortDirection;
-    itemsMenuListOptions: KoalaListItemMenuOptionInterface<any>[];
-    itemsList: KoalaListItemInterface<any>[];
-    request: Observable<any>;
-    responseIndexName: string;
-    responseQtdResultIndexName: (response: any) => number;
+    itemsMenuListOptions?: KoalaListItemMenuOptionInterface<any>[];
+    itemsList?: KoalaListItemInterface<any>[];
+    request?: Observable<any>;
+    responseIndexName?: string;
+    responseQtdResultIndexName?: (response: any) => number;
     typeRequest: 'all' | 'onDemand';
-    filterFormConfig: KoalaListFilterInterface;
-    reload: BehaviorSubject<boolean>;
-    formFilter: FormGroup;
+    filterFormConfig?: KoalaListFilterInterface;
+    reload?: BehaviorSubject<boolean>;
+    formFilter?: FormGroup;
     showAdvancedFilter: boolean;
     qtdListResult: number;
     disabledCheckboxItemList?: (item: any) => boolean;
@@ -41,6 +40,4 @@ export declare class ListComponent extends ListAbstract implements OnInit, After
     toogleFilter(): void;
     haveOptionsOnItemLine(item: any): boolean;
     private initConfig;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ListComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ListComponent, "koala-list", never, { "config": "config"; }, {}, never, ["[itemsSelectList]", "[itemsList]"]>;
 }

package/{core → list/lib}/providers/pagination/pagination.provider.d.ts

@@ -1,9 +1,6 @@
 import { MatPaginatorIntl } from '@angular/material/paginator';
-import * as i0 from "@angular/core";
 export declare class PaginationProvider extends MatPaginatorIntl {
     constructor();
     getAndInitTranslations(): void;
     getRangeLabel: (page: number, pageSize: number, length: number) => string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<PaginationProvider, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<PaginationProvider>;
 }

package/list/package.json

@@ -0,0 +1,19 @@
+{
+  "name": "@koalarx/ui/list",
+  "version": "0.0.1",
+  "peerDependencies": {
+    "@angular/common": "^12.0.3",
+    "@angular/core": "^12.0.3"
+  },
+  "dependencies": {
+    "tslib": "^2.1.0"
+  },
+  "main": "bundles/koalarx-ui-list.umd.js",
+  "module": "fesm2015/koalarx-ui-list.js",
+  "es2015": "fesm2015/koalarx-ui-list.js",
+  "esm2015": "esm2015/koalarx-ui-list.js",
+  "fesm2015": "fesm2015/koalarx-ui-list.js",
+  "typings": "koalarx-ui-list.d.ts",
+  "metadata": "koalarx-ui-list.metadata.json",
+  "sideEffects": false
+}

package/menu/README.md

@@ -0,0 +1,24 @@
+# Menu
+
+This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 12.0.3.
+
+## Code scaffolding
+
+Run `ng generate component component-name --project menu` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project menu`.
+> Note: Don't forget to add `--project menu` or else it will be added to the default project in your `angular.json` file. 
+
+## Build
+
+Run `ng build menu` to build the project. The build artifacts will be stored in the `dist/` directory.
+
+## Publishing
+
+After building your library with `ng build menu`, go to the dist folder `cd dist/menu` and run `npm publish`.
+
+## Running unit tests
+
+Run `ng test menu` to execute the unit tests via [Karma](https://karma-runner.github.io).
+
+## Further help
+
+To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.