@testgorilla/tgo-ui 0.0.1

package/README.md

@@ -0,0 +1,55 @@
+# TgoTalentFrontend
+
+This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 13.3.3.
+
+## Development server
+
+Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The application will automatically reload if you change any of the source files.
+
+## Code scaffolding
+
+Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
+
+## Build
+
+Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
+
+## Running unit tests
+
+Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
+
+## Running end-to-end tests
+
+Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
+
+## 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.
+
+## Visual regression
+
+We are using playwright on top of storybook to capture the visual differences. Code for the same can be found in `common.spec.ts` file. 
+
+In order to update the existing snapshots, we need to use DOCKER to update, since updating from mac or windows has its own effect on the rendering, we might want to use the following way to update the snapshots to be consistant with CI.
+
+```
+docker run --rm --network host -v $(pwd):/work/ -w /work/ -it mcr.microsoft.com/playwright:v1.22.0-focal /bin/bash
+npm install
+npx playwright test e2e/common.spec.ts  --update-snapshots
+```
+
+In order to execute the visual tests, we need to use same docker so that the screenshots are aligned with the same OS.
+
+```
+docker run --rm --network host -v $(pwd):/work/ -w /work/ -it mcr.microsoft.com/playwright:v1.22.0-focal /bin/bash
+npm install
+npx playwright test e2e/common.spec.ts
+```
+
+Currently we are using `toMatchSnapshot` instead of the latest `toHaveScreenshot` from playwright. Since `toHaveScreenshot` doesn't support firefox now, we are going ahead with `toMatchSnapshot`. In (near) future once it supports firefox, we will be using the latest `toHaveScreenshot` method.
+
+### Visual Regression Important to note !!!
+
+* To add a new component to visual regression one has to provide the `/iframe.html?id=<element_id>` in the file `common.spec.ts` which will take care of taking snapshot whenever we initiate visual tests. 
+* We need to have the elements in such a way that `element_id` in `/iframe.html?id=<element_id>` should be present in the DOM. i.e., we should have a dom element `<element_id> ... </element_id>`. 
+* We are using that element_id to wait until its fully loaded and then we are taking the snapshot.

package/components/table/table.component.d.ts

@@ -0,0 +1,53 @@
+import { EventEmitter, OnInit } from '@angular/core';
+import { MatSort, Sort } from '@angular/material/sort';
+import { MatTableDataSource } from '@angular/material/table';
+import { IDataSource, ITableColumn } from './table.types';
+import * as i0 from "@angular/core";
+export declare class TableComponent implements OnInit {
+    /**
+     * @ignore
+     */
+    dataSource: MatTableDataSource<any>;
+    /**
+     * @ignore
+     */
+    displayedColumns: string[];
+    /**
+     * @ignore
+     */
+    sort: MatSort;
+    /**
+     * Data to be rendered
+     *
+     * @type {IDataSource}
+     * @memberof TableComponent
+     */
+    set tableData(data: IDataSource[]);
+    /**
+     * Data structure to select which columns should be rendered and their capabilities
+     *
+     * @type {ITableColumn}
+     * @memberof TableComponent
+     */
+    tableColumns: ITableColumn[];
+    /**
+     * @ignore
+     */
+    onSortEvent: EventEmitter<Sort>;
+    /**
+     * @ignore
+     */
+    onRowClickEvent: EventEmitter<any>;
+    /**
+     * @ignore
+     */
+    ngOnInit(): void;
+    onSort(sortParams: Sort): void;
+    onRowClick(rowParams: any): void;
+    /**
+     * @ignore
+     */
+    private setTableDataSource;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TableComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TableComponent, "ui-table", never, { "tableData": "tableData"; "tableColumns": "tableColumns"; }, { "onSortEvent": "onSortEvent"; "onRowClickEvent": "onRowClickEvent"; }, never, never>;
+}

package/components/table/table.component.module.d.ts

@@ -0,0 +1,10 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./table.component";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/material/table";
+import * as i4 from "@angular/material/sort";
+export declare class TableComponentModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<TableComponentModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<TableComponentModule, [typeof i1.TableComponent], [typeof i2.CommonModule, typeof i3.MatTableModule, typeof i4.MatSortModule], [typeof i1.TableComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<TableComponentModule>;
+}

package/components/table/table.types.d.ts

@@ -0,0 +1,8 @@
+export declare type IDataSource = {
+    [key: string]: string | number;
+};
+export interface ITableColumn {
+    name: string;
+    dataKey: string;
+    isSortable?: boolean;
+}

package/esm2020/components/table/table.component.mjs

@@ -0,0 +1,87 @@
+import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewChild } from '@angular/core';
+import { MatSort } from '@angular/material/sort';
+import { MatTableDataSource } from '@angular/material/table';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/material/table";
+import * as i2 from "@angular/material/sort";
+import * as i3 from "@angular/common";
+export class TableComponent {
+    constructor() {
+        // TODO: Some properties and methods are ignored on purpose because of a current issue with compodoc and angular 13
+        // https://github.com/storybookjs/storybook/issues/16865
+        // https://github.com/storybookjs/storybook/issues/17004
+        /**
+         * @ignore
+         */
+        this.dataSource = new MatTableDataSource([]);
+        /**
+         * @ignore
+         */
+        this.displayedColumns = [];
+        /**
+         * Data structure to select which columns should be rendered and their capabilities
+         *
+         * @type {ITableColumn}
+         * @memberof TableComponent
+         */
+        this.tableColumns = [];
+        /**
+         * @ignore
+         */
+        this.onSortEvent = new EventEmitter();
+        /**
+         * @ignore
+         */
+        this.onRowClickEvent = new EventEmitter();
+    }
+    /**
+     * Data to be rendered
+     *
+     * @type {IDataSource}
+     * @memberof TableComponent
+     */
+    set tableData(data) {
+        this.setTableDataSource(data);
+    }
+    /**
+     * @ignore
+     */
+    ngOnInit() {
+        this.displayedColumns = this.tableColumns.map((tableColumn) => tableColumn.name);
+    }
+    onSort(sortParams) {
+        const column = this.tableColumns.find((column) => column.name === sortParams.active);
+        if (column?.dataKey) {
+            sortParams.active = column?.dataKey;
+        }
+        this.onSortEvent.emit(sortParams);
+    }
+    onRowClick(rowParams) {
+        this.onRowClickEvent.emit(rowParams);
+    }
+    /**
+     * @ignore
+     */
+    setTableDataSource(data) {
+        this.dataSource = new MatTableDataSource(data);
+        this.dataSource.sort = this.sort;
+    }
+}
+TableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+TableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: TableComponent, selector: "ui-table", inputs: { tableData: "tableData", tableColumns: "tableColumns" }, outputs: { onSortEvent: "onSortEvent", onRowClickEvent: "onRowClickEvent" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }], ngImport: i0, template: "<table mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"onSort($event)\">\n  <ng-container *ngFor=\"let tableColumn of tableColumns\" [matColumnDef]=\"tableColumn.name\">\n    <ng-container *ngIf=\"tableColumn.isSortable; else notSortable\">\n      <th mat-header-cell *matHeaderCellDef=\"let element\" [mat-sort-header]=\"tableColumn.dataKey\" arrowPosition=\"after\">\n        {{tableColumn.name}}\n      </th>\n    </ng-container>\n    <ng-template #notSortable>\n      <th mat-header-cell *matHeaderCellDef>\n        {{tableColumn.name}}\n      </th>\n    </ng-template>\n    <td mat-cell *matCellDef=\"let element\" (click)=\"onRowClick(element)\">\n      {{element[tableColumn.dataKey]}}\n    </td>\n  </ng-container>\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n  <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n</table>\n", styles: ["table{width:100%}table .mat-header-cell{font-weight:700}\n"], components: [{ type: i1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { type: i1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }], directives: [{ type: i2.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i1.MatCellDef, selector: "[matCellDef]" }, { type: i1.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ui-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<table mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"onSort($event)\">\n  <ng-container *ngFor=\"let tableColumn of tableColumns\" [matColumnDef]=\"tableColumn.name\">\n    <ng-container *ngIf=\"tableColumn.isSortable; else notSortable\">\n      <th mat-header-cell *matHeaderCellDef=\"let element\" [mat-sort-header]=\"tableColumn.dataKey\" arrowPosition=\"after\">\n        {{tableColumn.name}}\n      </th>\n    </ng-container>\n    <ng-template #notSortable>\n      <th mat-header-cell *matHeaderCellDef>\n        {{tableColumn.name}}\n      </th>\n    </ng-template>\n    <td mat-cell *matCellDef=\"let element\" (click)=\"onRowClick(element)\">\n      {{element[tableColumn.dataKey]}}\n    </td>\n  </ng-container>\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n  <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n</table>\n", styles: ["table{width:100%}table .mat-header-cell{font-weight:700}\n"] }]
+        }], propDecorators: { sort: [{
+                type: ViewChild,
+                args: [MatSort, { static: true }]
+            }], tableData: [{
+                type: Input
+            }], tableColumns: [{
+                type: Input
+            }], onSortEvent: [{
+                type: Output
+            }], onRowClickEvent: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFibGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdGFibGUvdGFibGUuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdGFibGUvdGFibGUuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFVLE1BQU0sRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDbkgsT0FBTyxFQUFFLE9BQU8sRUFBUSxNQUFNLHdCQUF3QixDQUFDO0FBQ3ZELE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLHlCQUF5QixDQUFDOzs7OztBQVM3RCxNQUFNLE9BQU8sY0FBYztJQU4zQjtRQU9FLG1IQUFtSDtRQUNuSCx3REFBd0Q7UUFDeEQsd0RBQXdEO1FBRXhEOztXQUVHO1FBQ0gsZUFBVSxHQUFHLElBQUksa0JBQWtCLENBQU0sRUFBRSxDQUFDLENBQUM7UUFFN0M7O1dBRUc7UUFDSCxxQkFBZ0IsR0FBYSxFQUFFLENBQUM7UUFpQmhDOzs7OztXQUtHO1FBQ00saUJBQVksR0FBbUIsRUFBRSxDQUFDO1FBRTNDOztXQUVHO1FBQ08sZ0JBQVcsR0FBdUIsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUVyRTs7V0FFRztRQUNPLG9CQUFlLEdBQXNCLElBQUksWUFBWSxFQUFPLENBQUM7S0E0QnhFO0lBdERDOzs7OztPQUtHO0lBQ0gsSUFBYSxTQUFTLENBQUMsSUFBbUI7UUFDeEMsSUFBSSxDQUFDLGtCQUFrQixDQUFDLElBQUksQ0FBQyxDQUFDO0lBQ2hDLENBQUM7SUFvQkQ7O09BRUc7SUFDSCxRQUFRO1FBQ04sSUFBSSxDQUFDLGdCQUFnQixHQUFHLElBQUksQ0FBQyxZQUFZLENBQUMsR0FBRyxDQUFDLENBQUMsV0FBeUIsRUFBRSxFQUFFLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQ2pHLENBQUM7SUFFRCxNQUFNLENBQUMsVUFBZ0I7UUFDckIsTUFBTSxNQUFNLEdBQUcsSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsQ0FBQyxNQUFvQixFQUFFLEVBQUUsQ0FBQyxNQUFNLENBQUMsSUFBSSxLQUFLLFVBQVUsQ0FBQyxNQUFNLENBQUMsQ0FBQztRQUNuRyxJQUFJLE1BQU0sRUFBRSxPQUFPLEVBQUU7WUFDbkIsVUFBVSxDQUFDLE1BQU0sR0FBRyxNQUFNLEVBQUUsT0FBTyxDQUFDO1NBQ3JDO1FBQ0QsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUM7SUFDcEMsQ0FBQztJQUVELFVBQVUsQ0FBQyxTQUFjO1FBQ3ZCLElBQUksQ0FBQyxlQUFlLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxDQUFDO0lBQ3ZDLENBQUM7SUFFRDs7T0FFRztJQUNLLGtCQUFrQixDQUFDLElBQW1CO1FBQzVDLElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxrQkFBa0IsQ0FBTSxJQUFJLENBQUMsQ0FBQztRQUNwRCxJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUMsSUFBSSxDQUFDO0lBQ25DLENBQUM7OzRHQXpFVSxjQUFjO2dHQUFkLGNBQWMscU9Ba0JkLE9BQU8sOERDN0JwQiwwM0JBbUJBOzRGRFJhLGNBQWM7a0JBTjFCLFNBQVM7K0JBQ0UsVUFBVSxtQkFHSCx1QkFBdUIsQ0FBQyxNQUFNOzhCQW9CVCxJQUFJO3NCQUF6QyxTQUFTO3VCQUFDLE9BQU8sRUFBRSxFQUFFLE1BQU0sRUFBRSxJQUFJLEVBQUU7Z0JBUXZCLFNBQVM7c0JBQXJCLEtBQUs7Z0JBVUcsWUFBWTtzQkFBcEIsS0FBSztnQkFLSSxXQUFXO3NCQUFwQixNQUFNO2dCQUtHLGVBQWU7c0JBQXhCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPbkluaXQsIE91dHB1dCwgVmlld0NoaWxkIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBNYXRTb3J0LCBTb3J0IH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvc29ydCc7XG5pbXBvcnQgeyBNYXRUYWJsZURhdGFTb3VyY2UgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC90YWJsZSc7XG5pbXBvcnQgeyBJRGF0YVNvdXJjZSwgSVRhYmxlQ29sdW1uIH0gZnJvbSAnLi90YWJsZS50eXBlcyc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3VpLXRhYmxlJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3RhYmxlLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vdGFibGUuY29tcG9uZW50LnNjc3MnXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIFRhYmxlQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcbiAgLy8gVE9ETzogU29tZSBwcm9wZXJ0aWVzIGFuZCBtZXRob2RzIGFyZSBpZ25vcmVkIG9uIHB1cnBvc2UgYmVjYXVzZSBvZiBhIGN1cnJlbnQgaXNzdWUgd2l0aCBjb21wb2RvYyBhbmQgYW5ndWxhciAxM1xuICAvLyBodHRwczovL2dpdGh1Yi5jb20vc3Rvcnlib29ranMvc3Rvcnlib29rL2lzc3Vlcy8xNjg2NVxuICAvLyBodHRwczovL2dpdGh1Yi5jb20vc3Rvcnlib29ranMvc3Rvcnlib29rL2lzc3Vlcy8xNzAwNFxuXG4gIC8qKlxuICAgKiBAaWdub3JlXG4gICAqL1xuICBkYXRhU291cmNlID0gbmV3IE1hdFRhYmxlRGF0YVNvdXJjZTxhbnk+KFtdKTtcblxuICAvKipcbiAgICogQGlnbm9yZVxuICAgKi9cbiAgZGlzcGxheWVkQ29sdW1uczogc3RyaW5nW10gPSBbXTtcblxuICAvKipcbiAgICogQGlnbm9yZVxuICAgKi9cbiAgQFZpZXdDaGlsZChNYXRTb3J0LCB7IHN0YXRpYzogdHJ1ZSB9KSBzb3J0ITogTWF0U29ydDtcblxuICAvKipcbiAgICogRGF0YSB0byBiZSByZW5kZXJlZFxuICAgKlxuICAgKiBAdHlwZSB7SURhdGFTb3VyY2V9XG4gICAqIEBtZW1iZXJvZiBUYWJsZUNvbXBvbmVudFxuICAgKi9cbiAgQElucHV0KCkgc2V0IHRhYmxlRGF0YShkYXRhOiBJRGF0YVNvdXJjZVtdKSB7XG4gICAgdGhpcy5zZXRUYWJsZURhdGFTb3VyY2UoZGF0YSk7XG4gIH1cblxuICAvKipcbiAgICogRGF0YSBzdHJ1Y3R1cmUgdG8gc2VsZWN0IHdoaWNoIGNvbHVtbnMgc2hvdWxkIGJlIHJlbmRlcmVkIGFuZCB0aGVpciBjYXBhYmlsaXRpZXNcbiAgICpcbiAgICogQHR5cGUge0lUYWJsZUNvbHVtbn1cbiAgICogQG1lbWJlcm9mIFRhYmxlQ29tcG9uZW50XG4gICAqL1xuICBASW5wdXQoKSB0YWJsZUNvbHVtbnM6IElUYWJsZUNvbHVtbltdID0gW107XG5cbiAgLyoqXG4gICAqIEBpZ25vcmVcbiAgICovXG4gIEBPdXRwdXQoKSBvblNvcnRFdmVudDogRXZlbnRFbWl0dGVyPFNvcnQ+ID0gbmV3IEV2ZW50RW1pdHRlcjxTb3J0PigpO1xuXG4gIC8qKlxuICAgKiBAaWdub3JlXG4gICAqL1xuICBAT3V0cHV0KCkgb25Sb3dDbGlja0V2ZW50OiBFdmVudEVtaXR0ZXI8YW55PiA9IG5ldyBFdmVudEVtaXR0ZXI8YW55PigpO1xuXG4gIC8qKlxuICAgKiBAaWdub3JlXG4gICAqL1xuICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICB0aGlzLmRpc3BsYXllZENvbHVtbnMgPSB0aGlzLnRhYmxlQ29sdW1ucy5tYXAoKHRhYmxlQ29sdW1uOiBJVGFibGVDb2x1bW4pID0+IHRhYmxlQ29sdW1uLm5hbWUpO1xuICB9XG5cbiAgb25Tb3J0KHNvcnRQYXJhbXM6IFNvcnQpIHtcbiAgICBjb25zdCBjb2x1bW4gPSB0aGlzLnRhYmxlQ29sdW1ucy5maW5kKChjb2x1bW46IElUYWJsZUNvbHVtbikgPT4gY29sdW1uLm5hbWUgPT09IHNvcnRQYXJhbXMuYWN0aXZlKTtcbiAgICBpZiAoY29sdW1uPy5kYXRhS2V5KSB7XG4gICAgICBzb3J0UGFyYW1zLmFjdGl2ZSA9IGNvbHVtbj8uZGF0YUtleTtcbiAgICB9XG4gICAgdGhpcy5vblNvcnRFdmVudC5lbWl0KHNvcnRQYXJhbXMpO1xuICB9XG5cbiAgb25Sb3dDbGljayhyb3dQYXJhbXM6IGFueSkge1xuICAgIHRoaXMub25Sb3dDbGlja0V2ZW50LmVtaXQocm93UGFyYW1zKTtcbiAgfVxuXG4gIC8qKlxuICAgKiBAaWdub3JlXG4gICAqL1xuICBwcml2YXRlIHNldFRhYmxlRGF0YVNvdXJjZShkYXRhOiBJRGF0YVNvdXJjZVtdKSB7XG4gICAgdGhpcy5kYXRhU291cmNlID0gbmV3IE1hdFRhYmxlRGF0YVNvdXJjZTxhbnk+KGRhdGEpO1xuICAgIHRoaXMuZGF0YVNvdXJjZS5zb3J0ID0gdGhpcy5zb3J0O1xuICB9XG59XG4iLCI8dGFibGUgbWF0LXRhYmxlIFtkYXRhU291cmNlXT1cImRhdGFTb3VyY2VcIiBtYXRTb3J0IChtYXRTb3J0Q2hhbmdlKT1cIm9uU29ydCgkZXZlbnQpXCI+XG4gIDxuZy1jb250YWluZXIgKm5nRm9yPVwibGV0IHRhYmxlQ29sdW1uIG9mIHRhYmxlQ29sdW1uc1wiIFttYXRDb2x1bW5EZWZdPVwidGFibGVDb2x1bW4ubmFtZVwiPlxuICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJ0YWJsZUNvbHVtbi5pc1NvcnRhYmxlOyBlbHNlIG5vdFNvcnRhYmxlXCI+XG4gICAgICA8dGggbWF0LWhlYWRlci1jZWxsICptYXRIZWFkZXJDZWxsRGVmPVwibGV0IGVsZW1lbnRcIiBbbWF0LXNvcnQtaGVhZGVyXT1cInRhYmxlQ29sdW1uLmRhdGFLZXlcIiBhcnJvd1Bvc2l0aW9uPVwiYWZ0ZXJcIj5cbiAgICAgICAge3t0YWJsZUNvbHVtbi5uYW1lfX1cbiAgICAgIDwvdGg+XG4gICAgPC9uZy1jb250YWluZXI+XG4gICAgPG5nLXRlbXBsYXRlICNub3RTb3J0YWJsZT5cbiAgICAgIDx0aCBtYXQtaGVhZGVyLWNlbGwgKm1hdEhlYWRlckNlbGxEZWY+XG4gICAgICAgIHt7dGFibGVDb2x1bW4ubmFtZX19XG4gICAgICA8L3RoPlxuICAgIDwvbmctdGVtcGxhdGU+XG4gICAgPHRkIG1hdC1jZWxsICptYXRDZWxsRGVmPVwibGV0IGVsZW1lbnRcIiAoY2xpY2spPVwib25Sb3dDbGljayhlbGVtZW50KVwiPlxuICAgICAge3tlbGVtZW50W3RhYmxlQ29sdW1uLmRhdGFLZXldfX1cbiAgICA8L3RkPlxuICA8L25nLWNvbnRhaW5lcj5cbiAgPHRyIG1hdC1oZWFkZXItcm93ICptYXRIZWFkZXJSb3dEZWY9XCJkaXNwbGF5ZWRDb2x1bW5zXCI+PC90cj5cbiAgPHRyIG1hdC1yb3cgKm1hdFJvd0RlZj1cImxldCByb3c7IGNvbHVtbnM6IGRpc3BsYXllZENvbHVtbnM7XCI+PC90cj5cbjwvdGFibGU+XG4iXX0=

package/esm2020/components/table/table.component.module.mjs

@@ -0,0 +1,20 @@
+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+import { MatSortModule } from '@angular/material/sort';
+import { MatTableModule } from '@angular/material/table';
+import { TableComponent } from './table.component';
+import * as i0 from "@angular/core";
+export class TableComponentModule {
+}
+TableComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+TableComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponentModule, declarations: [TableComponent], imports: [CommonModule, MatTableModule, MatSortModule], exports: [TableComponent] });
+TableComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponentModule, imports: [[CommonModule, MatTableModule, MatSortModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponentModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [TableComponent],
+                    imports: [CommonModule, MatTableModule, MatSortModule],
+                    exports: [TableComponent],
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFibGUuY29tcG9uZW50Lm1vZHVsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL3RhYmxlL3RhYmxlLmNvbXBvbmVudC5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBQ3ZELE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQztBQUN6RCxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0sbUJBQW1CLENBQUM7O0FBT25ELE1BQU0sT0FBTyxvQkFBb0I7O2tIQUFwQixvQkFBb0I7bUhBQXBCLG9CQUFvQixpQkFKaEIsY0FBYyxhQUNuQixZQUFZLEVBQUUsY0FBYyxFQUFFLGFBQWEsYUFDM0MsY0FBYzttSEFFYixvQkFBb0IsWUFIdEIsQ0FBQyxZQUFZLEVBQUUsY0FBYyxFQUFFLGFBQWEsQ0FBQzs0RkFHM0Msb0JBQW9CO2tCQUxoQyxRQUFRO21CQUFDO29CQUNSLFlBQVksRUFBRSxDQUFDLGNBQWMsQ0FBQztvQkFDOUIsT0FBTyxFQUFFLENBQUMsWUFBWSxFQUFFLGNBQWMsRUFBRSxhQUFhLENBQUM7b0JBQ3RELE9BQU8sRUFBRSxDQUFDLGNBQWMsQ0FBQztpQkFDMUIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgTmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE1hdFNvcnRNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9zb3J0JztcbmltcG9ydCB7IE1hdFRhYmxlTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvdGFibGUnO1xuaW1wb3J0IHsgVGFibGVDb21wb25lbnQgfSBmcm9tICcuL3RhYmxlLmNvbXBvbmVudCc7XG5cbkBOZ01vZHVsZSh7XG4gIGRlY2xhcmF0aW9uczogW1RhYmxlQ29tcG9uZW50XSxcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZSwgTWF0VGFibGVNb2R1bGUsIE1hdFNvcnRNb2R1bGVdLFxuICBleHBvcnRzOiBbVGFibGVDb21wb25lbnRdLFxufSlcbmV4cG9ydCBjbGFzcyBUYWJsZUNvbXBvbmVudE1vZHVsZSB7fVxuIl19

package/esm2020/components/table/table.types.mjs

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFibGUudHlwZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50cy90YWJsZS90YWJsZS50eXBlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0IHR5cGUgSURhdGFTb3VyY2UgPSB7XG4gIFtrZXk6IHN0cmluZ106IHN0cmluZyB8IG51bWJlcjtcbn07XG5cbmV4cG9ydCBpbnRlcmZhY2UgSVRhYmxlQ29sdW1uIHtcbiAgbmFtZTogc3RyaW5nO1xuICBkYXRhS2V5OiBzdHJpbmc7XG4gIGlzU29ydGFibGU/OiBib29sZWFuO1xufVxuIl19

package/esm2020/public-api.mjs

@@ -0,0 +1,6 @@
+// PUBLIC API
+// Table Component
+export * from './components/table/table.component';
+export * from './components/table/table.component.module';
+export * from './components/table/table.types';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9wdWJsaWMtYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGFBQWE7QUFFYixrQkFBa0I7QUFDbEIsY0FBYyxvQ0FBb0MsQ0FBQztBQUNuRCxjQUFjLDJDQUEyQyxDQUFDO0FBQzFELGNBQWMsZ0NBQWdDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvLyBQVUJMSUMgQVBJXG5cbi8vIFRhYmxlIENvbXBvbmVudFxuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL3RhYmxlL3RhYmxlLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvdGFibGUvdGFibGUuY29tcG9uZW50Lm1vZHVsZSc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvdGFibGUvdGFibGUudHlwZXMnO1xuIl19

package/esm2020/testgorilla-tgo-ui.mjs

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './public-api';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGVzdGdvcmlsbGEtdGdvLXVpLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL3Rlc3Rnb3JpbGxhLXRnby11aS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVILGNBQWMsY0FBYyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBHZW5lcmF0ZWQgYnVuZGxlIGluZGV4LiBEbyBub3QgZWRpdC5cbiAqL1xuXG5leHBvcnQgKiBmcm9tICcuL3B1YmxpYy1hcGknO1xuIl19

package/fesm2015/testgorilla-tgo-ui.mjs

@@ -0,0 +1,111 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, Component, ChangeDetectionStrategy, ViewChild, Input, Output, NgModule } from '@angular/core';
+import * as i2 from '@angular/material/sort';
+import { MatSort, MatSortModule } from '@angular/material/sort';
+import * as i1 from '@angular/material/table';
+import { MatTableDataSource, MatTableModule } from '@angular/material/table';
+import * as i3 from '@angular/common';
+import { CommonModule } from '@angular/common';
+
+class TableComponent {
+    constructor() {
+        // TODO: Some properties and methods are ignored on purpose because of a current issue with compodoc and angular 13
+        // https://github.com/storybookjs/storybook/issues/16865
+        // https://github.com/storybookjs/storybook/issues/17004
+        /**
+         * @ignore
+         */
+        this.dataSource = new MatTableDataSource([]);
+        /**
+         * @ignore
+         */
+        this.displayedColumns = [];
+        /**
+         * Data structure to select which columns should be rendered and their capabilities
+         *
+         * @type {ITableColumn}
+         * @memberof TableComponent
+         */
+        this.tableColumns = [];
+        /**
+         * @ignore
+         */
+        this.onSortEvent = new EventEmitter();
+        /**
+         * @ignore
+         */
+        this.onRowClickEvent = new EventEmitter();
+    }
+    /**
+     * Data to be rendered
+     *
+     * @type {IDataSource}
+     * @memberof TableComponent
+     */
+    set tableData(data) {
+        this.setTableDataSource(data);
+    }
+    /**
+     * @ignore
+     */
+    ngOnInit() {
+        this.displayedColumns = this.tableColumns.map((tableColumn) => tableColumn.name);
+    }
+    onSort(sortParams) {
+        const column = this.tableColumns.find((column) => column.name === sortParams.active);
+        if (column === null || column === void 0 ? void 0 : column.dataKey) {
+            sortParams.active = column === null || column === void 0 ? void 0 : column.dataKey;
+        }
+        this.onSortEvent.emit(sortParams);
+    }
+    onRowClick(rowParams) {
+        this.onRowClickEvent.emit(rowParams);
+    }
+    /**
+     * @ignore
+     */
+    setTableDataSource(data) {
+        this.dataSource = new MatTableDataSource(data);
+        this.dataSource.sort = this.sort;
+    }
+}
+TableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+TableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: TableComponent, selector: "ui-table", inputs: { tableData: "tableData", tableColumns: "tableColumns" }, outputs: { onSortEvent: "onSortEvent", onRowClickEvent: "onRowClickEvent" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }], ngImport: i0, template: "<table mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"onSort($event)\">\n  <ng-container *ngFor=\"let tableColumn of tableColumns\" [matColumnDef]=\"tableColumn.name\">\n    <ng-container *ngIf=\"tableColumn.isSortable; else notSortable\">\n      <th mat-header-cell *matHeaderCellDef=\"let element\" [mat-sort-header]=\"tableColumn.dataKey\" arrowPosition=\"after\">\n        {{tableColumn.name}}\n      </th>\n    </ng-container>\n    <ng-template #notSortable>\n      <th mat-header-cell *matHeaderCellDef>\n        {{tableColumn.name}}\n      </th>\n    </ng-template>\n    <td mat-cell *matCellDef=\"let element\" (click)=\"onRowClick(element)\">\n      {{element[tableColumn.dataKey]}}\n    </td>\n  </ng-container>\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n  <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n</table>\n", styles: ["table{width:100%}table .mat-header-cell{font-weight:700}\n"], components: [{ type: i1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { type: i1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }], directives: [{ type: i2.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i1.MatCellDef, selector: "[matCellDef]" }, { type: i1.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ui-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<table mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"onSort($event)\">\n  <ng-container *ngFor=\"let tableColumn of tableColumns\" [matColumnDef]=\"tableColumn.name\">\n    <ng-container *ngIf=\"tableColumn.isSortable; else notSortable\">\n      <th mat-header-cell *matHeaderCellDef=\"let element\" [mat-sort-header]=\"tableColumn.dataKey\" arrowPosition=\"after\">\n        {{tableColumn.name}}\n      </th>\n    </ng-container>\n    <ng-template #notSortable>\n      <th mat-header-cell *matHeaderCellDef>\n        {{tableColumn.name}}\n      </th>\n    </ng-template>\n    <td mat-cell *matCellDef=\"let element\" (click)=\"onRowClick(element)\">\n      {{element[tableColumn.dataKey]}}\n    </td>\n  </ng-container>\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n  <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n</table>\n", styles: ["table{width:100%}table .mat-header-cell{font-weight:700}\n"] }]
+        }], propDecorators: { sort: [{
+                type: ViewChild,
+                args: [MatSort, { static: true }]
+            }], tableData: [{
+                type: Input
+            }], tableColumns: [{
+                type: Input
+            }], onSortEvent: [{
+                type: Output
+            }], onRowClickEvent: [{
+                type: Output
+            }] } });
+
+class TableComponentModule {
+}
+TableComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+TableComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponentModule, declarations: [TableComponent], imports: [CommonModule, MatTableModule, MatSortModule], exports: [TableComponent] });
+TableComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponentModule, imports: [[CommonModule, MatTableModule, MatSortModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponentModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [TableComponent],
+                    imports: [CommonModule, MatTableModule, MatSortModule],
+                    exports: [TableComponent],
+                }]
+        }] });
+
+// PUBLIC API
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { TableComponent, TableComponentModule };
+//# sourceMappingURL=testgorilla-tgo-ui.mjs.map

package/fesm2015/testgorilla-tgo-ui.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"testgorilla-tgo-ui.mjs","sources":["../../../src/components/table/table.component.ts","../../../src/components/table/table.component.html","../../../src/components/table/table.component.module.ts","../../../src/public-api.ts","../../../src/testgorilla-tgo-ui.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';\nimport { MatSort, Sort } from '@angular/material/sort';\nimport { MatTableDataSource } from '@angular/material/table';\nimport { IDataSource, ITableColumn } from './table.types';\n\n@Component({\n  selector: 'ui-table',\n  templateUrl: './table.component.html',\n  styleUrls: ['./table.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class TableComponent implements OnInit {\n  // TODO: Some properties and methods are ignored on purpose because of a current issue with compodoc and angular 13\n  // https://github.com/storybookjs/storybook/issues/16865\n  // https://github.com/storybookjs/storybook/issues/17004\n\n  /**\n   * @ignore\n   */\n  dataSource = new MatTableDataSource<any>([]);\n\n  /**\n   * @ignore\n   */\n  displayedColumns: string[] = [];\n\n  /**\n   * @ignore\n   */\n  @ViewChild(MatSort, { static: true }) sort!: MatSort;\n\n  /**\n   * Data to be rendered\n   *\n   * @type {IDataSource}\n   * @memberof TableComponent\n   */\n  @Input() set tableData(data: IDataSource[]) {\n    this.setTableDataSource(data);\n  }\n\n  /**\n   * Data structure to select which columns should be rendered and their capabilities\n   *\n   * @type {ITableColumn}\n   * @memberof TableComponent\n   */\n  @Input() tableColumns: ITableColumn[] = [];\n\n  /**\n   * @ignore\n   */\n  @Output() onSortEvent: EventEmitter<Sort> = new EventEmitter<Sort>();\n\n  /**\n   * @ignore\n   */\n  @Output() onRowClickEvent: EventEmitter<any> = new EventEmitter<any>();\n\n  /**\n   * @ignore\n   */\n  ngOnInit(): void {\n    this.displayedColumns = this.tableColumns.map((tableColumn: ITableColumn) => tableColumn.name);\n  }\n\n  onSort(sortParams: Sort) {\n    const column = this.tableColumns.find((column: ITableColumn) => column.name === sortParams.active);\n    if (column?.dataKey) {\n      sortParams.active = column?.dataKey;\n    }\n    this.onSortEvent.emit(sortParams);\n  }\n\n  onRowClick(rowParams: any) {\n    this.onRowClickEvent.emit(rowParams);\n  }\n\n  /**\n   * @ignore\n   */\n  private setTableDataSource(data: IDataSource[]) {\n    this.dataSource = new MatTableDataSource<any>(data);\n    this.dataSource.sort = this.sort;\n  }\n}\n","<table mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"onSort($event)\">\n  <ng-container *ngFor=\"let tableColumn of tableColumns\" [matColumnDef]=\"tableColumn.name\">\n    <ng-container *ngIf=\"tableColumn.isSortable; else notSortable\">\n      <th mat-header-cell *matHeaderCellDef=\"let element\" [mat-sort-header]=\"tableColumn.dataKey\" arrowPosition=\"after\">\n        {{tableColumn.name}}\n      </th>\n    </ng-container>\n    <ng-template #notSortable>\n      <th mat-header-cell *matHeaderCellDef>\n        {{tableColumn.name}}\n      </th>\n    </ng-template>\n    <td mat-cell *matCellDef=\"let element\" (click)=\"onRowClick(element)\">\n      {{element[tableColumn.dataKey]}}\n    </td>\n  </ng-container>\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n  <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n</table>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatSortModule } from '@angular/material/sort';\nimport { MatTableModule } from '@angular/material/table';\nimport { TableComponent } from './table.component';\n\n@NgModule({\n  declarations: [TableComponent],\n  imports: [CommonModule, MatTableModule, MatSortModule],\n  exports: [TableComponent],\n})\nexport class TableComponentModule {}\n","// PUBLIC API\n\n// Table Component\nexport * from './components/table/table.component';\nexport * from './components/table/table.component.module';\nexport * from './components/table/table.types';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2020/testgorilla-tgo-ui.mjs

@@ -0,0 +1,111 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, Component, ChangeDetectionStrategy, ViewChild, Input, Output, NgModule } from '@angular/core';
+import * as i2 from '@angular/material/sort';
+import { MatSort, MatSortModule } from '@angular/material/sort';
+import * as i1 from '@angular/material/table';
+import { MatTableDataSource, MatTableModule } from '@angular/material/table';
+import * as i3 from '@angular/common';
+import { CommonModule } from '@angular/common';
+
+class TableComponent {
+    constructor() {
+        // TODO: Some properties and methods are ignored on purpose because of a current issue with compodoc and angular 13
+        // https://github.com/storybookjs/storybook/issues/16865
+        // https://github.com/storybookjs/storybook/issues/17004
+        /**
+         * @ignore
+         */
+        this.dataSource = new MatTableDataSource([]);
+        /**
+         * @ignore
+         */
+        this.displayedColumns = [];
+        /**
+         * Data structure to select which columns should be rendered and their capabilities
+         *
+         * @type {ITableColumn}
+         * @memberof TableComponent
+         */
+        this.tableColumns = [];
+        /**
+         * @ignore
+         */
+        this.onSortEvent = new EventEmitter();
+        /**
+         * @ignore
+         */
+        this.onRowClickEvent = new EventEmitter();
+    }
+    /**
+     * Data to be rendered
+     *
+     * @type {IDataSource}
+     * @memberof TableComponent
+     */
+    set tableData(data) {
+        this.setTableDataSource(data);
+    }
+    /**
+     * @ignore
+     */
+    ngOnInit() {
+        this.displayedColumns = this.tableColumns.map((tableColumn) => tableColumn.name);
+    }
+    onSort(sortParams) {
+        const column = this.tableColumns.find((column) => column.name === sortParams.active);
+        if (column?.dataKey) {
+            sortParams.active = column?.dataKey;
+        }
+        this.onSortEvent.emit(sortParams);
+    }
+    onRowClick(rowParams) {
+        this.onRowClickEvent.emit(rowParams);
+    }
+    /**
+     * @ignore
+     */
+    setTableDataSource(data) {
+        this.dataSource = new MatTableDataSource(data);
+        this.dataSource.sort = this.sort;
+    }
+}
+TableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+TableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: TableComponent, selector: "ui-table", inputs: { tableData: "tableData", tableColumns: "tableColumns" }, outputs: { onSortEvent: "onSortEvent", onRowClickEvent: "onRowClickEvent" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }], ngImport: i0, template: "<table mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"onSort($event)\">\n  <ng-container *ngFor=\"let tableColumn of tableColumns\" [matColumnDef]=\"tableColumn.name\">\n    <ng-container *ngIf=\"tableColumn.isSortable; else notSortable\">\n      <th mat-header-cell *matHeaderCellDef=\"let element\" [mat-sort-header]=\"tableColumn.dataKey\" arrowPosition=\"after\">\n        {{tableColumn.name}}\n      </th>\n    </ng-container>\n    <ng-template #notSortable>\n      <th mat-header-cell *matHeaderCellDef>\n        {{tableColumn.name}}\n      </th>\n    </ng-template>\n    <td mat-cell *matCellDef=\"let element\" (click)=\"onRowClick(element)\">\n      {{element[tableColumn.dataKey]}}\n    </td>\n  </ng-container>\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n  <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n</table>\n", styles: ["table{width:100%}table .mat-header-cell{font-weight:700}\n"], components: [{ type: i1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { type: i1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }], directives: [{ type: i2.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i1.MatCellDef, selector: "[matCellDef]" }, { type: i1.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ui-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<table mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"onSort($event)\">\n  <ng-container *ngFor=\"let tableColumn of tableColumns\" [matColumnDef]=\"tableColumn.name\">\n    <ng-container *ngIf=\"tableColumn.isSortable; else notSortable\">\n      <th mat-header-cell *matHeaderCellDef=\"let element\" [mat-sort-header]=\"tableColumn.dataKey\" arrowPosition=\"after\">\n        {{tableColumn.name}}\n      </th>\n    </ng-container>\n    <ng-template #notSortable>\n      <th mat-header-cell *matHeaderCellDef>\n        {{tableColumn.name}}\n      </th>\n    </ng-template>\n    <td mat-cell *matCellDef=\"let element\" (click)=\"onRowClick(element)\">\n      {{element[tableColumn.dataKey]}}\n    </td>\n  </ng-container>\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n  <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n</table>\n", styles: ["table{width:100%}table .mat-header-cell{font-weight:700}\n"] }]
+        }], propDecorators: { sort: [{
+                type: ViewChild,
+                args: [MatSort, { static: true }]
+            }], tableData: [{
+                type: Input
+            }], tableColumns: [{
+                type: Input
+            }], onSortEvent: [{
+                type: Output
+            }], onRowClickEvent: [{
+                type: Output
+            }] } });
+
+class TableComponentModule {
+}
+TableComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+TableComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponentModule, declarations: [TableComponent], imports: [CommonModule, MatTableModule, MatSortModule], exports: [TableComponent] });
+TableComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponentModule, imports: [[CommonModule, MatTableModule, MatSortModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TableComponentModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [TableComponent],
+                    imports: [CommonModule, MatTableModule, MatSortModule],
+                    exports: [TableComponent],
+                }]
+        }] });
+
+// PUBLIC API
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { TableComponent, TableComponentModule };
+//# sourceMappingURL=testgorilla-tgo-ui.mjs.map

package/fesm2020/testgorilla-tgo-ui.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"testgorilla-tgo-ui.mjs","sources":["../../../src/components/table/table.component.ts","../../../src/components/table/table.component.html","../../../src/components/table/table.component.module.ts","../../../src/public-api.ts","../../../src/testgorilla-tgo-ui.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';\nimport { MatSort, Sort } from '@angular/material/sort';\nimport { MatTableDataSource } from '@angular/material/table';\nimport { IDataSource, ITableColumn } from './table.types';\n\n@Component({\n  selector: 'ui-table',\n  templateUrl: './table.component.html',\n  styleUrls: ['./table.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class TableComponent implements OnInit {\n  // TODO: Some properties and methods are ignored on purpose because of a current issue with compodoc and angular 13\n  // https://github.com/storybookjs/storybook/issues/16865\n  // https://github.com/storybookjs/storybook/issues/17004\n\n  /**\n   * @ignore\n   */\n  dataSource = new MatTableDataSource<any>([]);\n\n  /**\n   * @ignore\n   */\n  displayedColumns: string[] = [];\n\n  /**\n   * @ignore\n   */\n  @ViewChild(MatSort, { static: true }) sort!: MatSort;\n\n  /**\n   * Data to be rendered\n   *\n   * @type {IDataSource}\n   * @memberof TableComponent\n   */\n  @Input() set tableData(data: IDataSource[]) {\n    this.setTableDataSource(data);\n  }\n\n  /**\n   * Data structure to select which columns should be rendered and their capabilities\n   *\n   * @type {ITableColumn}\n   * @memberof TableComponent\n   */\n  @Input() tableColumns: ITableColumn[] = [];\n\n  /**\n   * @ignore\n   */\n  @Output() onSortEvent: EventEmitter<Sort> = new EventEmitter<Sort>();\n\n  /**\n   * @ignore\n   */\n  @Output() onRowClickEvent: EventEmitter<any> = new EventEmitter<any>();\n\n  /**\n   * @ignore\n   */\n  ngOnInit(): void {\n    this.displayedColumns = this.tableColumns.map((tableColumn: ITableColumn) => tableColumn.name);\n  }\n\n  onSort(sortParams: Sort) {\n    const column = this.tableColumns.find((column: ITableColumn) => column.name === sortParams.active);\n    if (column?.dataKey) {\n      sortParams.active = column?.dataKey;\n    }\n    this.onSortEvent.emit(sortParams);\n  }\n\n  onRowClick(rowParams: any) {\n    this.onRowClickEvent.emit(rowParams);\n  }\n\n  /**\n   * @ignore\n   */\n  private setTableDataSource(data: IDataSource[]) {\n    this.dataSource = new MatTableDataSource<any>(data);\n    this.dataSource.sort = this.sort;\n  }\n}\n","<table mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"onSort($event)\">\n  <ng-container *ngFor=\"let tableColumn of tableColumns\" [matColumnDef]=\"tableColumn.name\">\n    <ng-container *ngIf=\"tableColumn.isSortable; else notSortable\">\n      <th mat-header-cell *matHeaderCellDef=\"let element\" [mat-sort-header]=\"tableColumn.dataKey\" arrowPosition=\"after\">\n        {{tableColumn.name}}\n      </th>\n    </ng-container>\n    <ng-template #notSortable>\n      <th mat-header-cell *matHeaderCellDef>\n        {{tableColumn.name}}\n      </th>\n    </ng-template>\n    <td mat-cell *matCellDef=\"let element\" (click)=\"onRowClick(element)\">\n      {{element[tableColumn.dataKey]}}\n    </td>\n  </ng-container>\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n  <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n</table>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatSortModule } from '@angular/material/sort';\nimport { MatTableModule } from '@angular/material/table';\nimport { TableComponent } from './table.component';\n\n@NgModule({\n  declarations: [TableComponent],\n  imports: [CommonModule, MatTableModule, MatSortModule],\n  exports: [TableComponent],\n})\nexport class TableComponentModule {}\n","// PUBLIC API\n\n// Table Component\nexport * from './components/table/table.component';\nexport * from './components/table/table.component.module';\nexport * from './components/table/table.types';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@testgorilla/tgo-ui" />
+export * from './public-api';

package/package.json

@@ -0,0 +1,52 @@
+{
+  "name": "@testgorilla/tgo-ui",
+  "version": "0.0.1",
+  "lint-staged": {
+    "src/**/*.ts": [
+      "eslint --fix",
+      "prettier --write",
+      "git add"
+    ],
+    "src/**/*.scss": [
+      "stylelint"
+    ]
+  },
+  "private": false,
+  "dependencies": {
+    "tslib": "^2.4.0"
+  },
+  "peerDependencies": {
+    "@angular/animations": "^13.3.4",
+    "@angular/cdk": "^13.3.6",
+    "@angular/common": "^13.3.4",
+    "@angular/compiler": "^13.3.4",
+    "@angular/core": "^13.3.4",
+    "@angular/forms": "^13.3.4",
+    "@angular/material": "^13.3.6",
+    "@angular/platform-browser": "^13.3.4",
+    "@angular/platform-browser-dynamic": "^13.3.4",
+    "@angular/router": "^13.3.4",
+    "rxjs": "^7.5.5",
+    "zone.js": "^0.11.5"
+  },
+  "module": "fesm2015/testgorilla-tgo-ui.mjs",
+  "es2020": "fesm2020/testgorilla-tgo-ui.mjs",
+  "esm2020": "esm2020/testgorilla-tgo-ui.mjs",
+  "fesm2020": "fesm2020/testgorilla-tgo-ui.mjs",
+  "fesm2015": "fesm2015/testgorilla-tgo-ui.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "esm2020": "./esm2020/testgorilla-tgo-ui.mjs",
+      "es2020": "./fesm2020/testgorilla-tgo-ui.mjs",
+      "es2015": "./fesm2015/testgorilla-tgo-ui.mjs",
+      "node": "./fesm2015/testgorilla-tgo-ui.mjs",
+      "default": "./fesm2020/testgorilla-tgo-ui.mjs"
+    }
+  },
+  "sideEffects": false
+}

package/public-api.d.ts

@@ -0,0 +1,3 @@
+export * from './components/table/table.component';
+export * from './components/table/table.component.module';
+export * from './components/table/table.types';

package/src/theme/_palette.scss

@@ -0,0 +1,108 @@
+@use "@angular/material" as mat;
+
+@include mat.core();
+
+$tgo-primary-palette: (
+  50: #e2f2f0,
+  100: #b7e0d9,
+  200: #8acdc1,
+  300: #60b9a9,
+  400: #46a997,
+  500: #389986,
+  600: #338c79,
+  700: #2e7c6a,
+  800: #296c5b,
+  900: #1f5041,
+  contrast: (
+    50: rgba(black, 0.87),
+    100: rgba(black, 0.87),
+    200: rgba(black, 0.87),
+    300: white,
+    400: white,
+    500: white,
+    600: white,
+    700: white,
+    800: white,
+    900: white,
+  ),
+);
+
+$tgo-accent-palette: (
+  50: #d6f1fe,
+  100: #b4d8e3,
+  200: #91bbc9,
+  300: #6d9faf,
+  400: #51899c,
+  500: #337589,
+  600: #276678,
+  700: #185363,
+  800: #09404e,
+  900: #002b38,
+  contrast: (
+    50: rgba(black, 0.87),
+    100: rgba(black, 0.87),
+    200: rgba(black, 0.87),
+    300: rgba(black, 0.87),
+    400: rgba(black, 0.87),
+    500: white,
+    600: white,
+    700: white,
+    800: white,
+    900: white,
+  ),
+);
+
+$tgo-warn-palette: (
+  50: #f9efef,
+  100: #efd7d7,
+  200: #e5bdbd,
+  300: #dba3a2,
+  400: #d38f8e,
+  500: #cb7b7a,
+  600: #c67372,
+  700: #be6867,
+  800: #b85e5d,
+  900: #ac4b4a,
+  A100: #ffffff,
+  A200: #ffd4d4,
+  A400: #ffa2a1,
+  A700: #ff8887,
+  contrast: (
+    50: #000000,
+    100: #000000,
+    200: #000000,
+    300: #000000,
+    400: #000000,
+    500: #000000,
+    600: #000000,
+    700: #000000,
+    800: #ffffff,
+    900: #ffffff,
+    A100: #000000,
+    A200: #000000,
+    A400: #000000,
+    A700: #000000,
+  ),
+);
+
+$tgo-primary: mat.define-palette($tgo-primary-palette, 400);
+$tgo-accent: mat.define-palette($tgo-accent-palette, 600);
+$tgo-warn: mat.define-palette($tgo-warn-palette, 500);
+$tgo-light: mat.define-palette($tgo-primary-palette, 50);
+$tgo-typography: mat.define-typography-config(
+  $font-family: "'Open Sans', sans-serif",
+);
+
+$my-theme: mat.define-light-theme(
+  (
+    color: (
+      primary: $tgo-primary,
+      accent: $tgo-accent,
+      light: $tgo-light,
+      warn: $tgo-warn,
+    ),
+    typography: $tgo-typography,
+  )
+);
+
+@include mat.all-component-themes($my-theme);

package/src/theme/_variables.scss

@@ -0,0 +1,2 @@
+$margin: 16px;
+

package/src/theme/base.scss

@@ -0,0 +1,95 @@
+@use 'palette.scss';
+@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap");
+
+body {
+  margin: 0;
+  background: #f6f6f6;
+  font-size: 14px;
+  color: #888888;
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6,
+  button {
+    margin-top: 16px;
+    margin-bottom: 16px;
+  }
+
+  p {
+    line-height: 24px;
+    margin-top: 16px;
+    margin-bottom: 16px;
+  }
+
+  .mat-form-field-label {
+    font-size: 16px !important;
+    color: #888888;
+  }
+}
+
+.hidden {
+  visibility: hidden;
+}
+
+//TODO: MOVE TO THE CORRESPONDING COMPONENTS
+//custom scss for the angular material components
+.mat-card {
+  border-radius: 8px !important;
+  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.1) !important;
+  padding: 32px 32px 16px 32px !important;
+}
+
+.mat-flat-button {
+  line-height: 0 !important;
+  height: 48px;
+  padding: 16px 32px !important;
+}
+
+.mat-form-field-appearance-outline .mat-form-field-infix {
+  padding: 16px 0 16px 0;
+  margin-left: 8px;
+}
+
+.mat-form-field {
+  margin-top: 16px;
+}
+
+.mat-form-field-subscript-wrapper {
+  mat-error {
+    font-size: 12px;
+    display: flex;
+    place-content: center flex-start;
+    align-items: center;
+
+    mat-icon {
+      margin-right: 8px;
+      font-size: 16px !important;
+    }
+  }
+}
+
+.mat-flat-button.mat-button-disabled.mat-button-disabled {
+  background-color: #b5ddd5 !important;
+  color: white !important;
+}
+
+tgo-button > .mat-progress-spinner circle,
+.mat-spinner circle {
+  stroke: white;
+}
+
+/*
+ Design spec says the input text size is 16px
+ */
+input {
+  font-size: 16px !important;
+}
+
+input::placeholder {
+  font-size: 16px !important;
+}
+
+