@messaia/cdk 0.0.0-CDK

package/lib/table/table.module.d.ts

@@ -0,0 +1,46 @@
+import { VdDynamicTableComponent } from './components/dynamic-table/dynamic-table.component';
+import { FilterClearComponent } from './components/filter-clear.component';
+import { FilterDateComponent } from './components/filter-date.component';
+import { FilterInputComponent } from './components/filter-input.component';
+import { DataSourceFilterDirective } from './directives/data-source-filter.directive';
+import * as i0 from "@angular/core";
+import * as i1 from "./components/filter-input.component";
+import * as i2 from "./components/filter-select.component";
+import * as i3 from "./components/filter-clear.component";
+import * as i4 from "./components/filter-date.component";
+import * as i5 from "./directives/data-source-filter.directive";
+import * as i6 from "./components/dynamic-table/dynamic-table.component";
+import * as i7 from "@angular/common";
+import * as i8 from "../common/common.module";
+import * as i9 from "@angular/forms";
+import * as i10 from "@angular/material/button";
+import * as i11 from "@angular/material/form-field";
+import * as i12 from "@angular/material/select";
+import * as i13 from "@angular/material/icon";
+import * as i14 from "@angular/material/input";
+import * as i15 from "@angular/material/datepicker";
+import * as i16 from "@angular/material/table";
+import * as i17 from "@angular/material/sort";
+import * as i18 from "@angular/cdk/table";
+import * as i19 from "@angular/material/progress-bar";
+import * as i20 from "@angular/material/checkbox";
+import * as i21 from "@angular/material/menu";
+import * as i22 from "@angular/material/slide-toggle";
+import * as i23 from "@angular/material/paginator";
+import * as i24 from "@angular/material/tooltip";
+import * as i25 from "@angular/material/toolbar";
+export { TableColumnType } from './enums/table-column-type';
+export { Column, Table } from './functions/decorators';
+export { getTableDefinition } from './functions/functions';
+export { Pagination } from './models/pagination';
+export { TableColumn } from './models/table-column';
+export { TableDefinition } from './models/table-definition';
+export { TableMenuItem } from './models/table-menu-item';
+export { TableDataSource } from './table.data-source';
+export { TableStaticDataSource } from './table.static-data-source';
+export { VdDynamicTableComponent, FilterClearComponent, FilterDateComponent, FilterInputComponent, DataSourceFilterDirective };
+export declare class VdTableModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<VdTableModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<VdTableModule, [typeof i1.FilterInputComponent, typeof i2.FilterSelectComponent, typeof i3.FilterClearComponent, typeof i4.FilterDateComponent, typeof i5.DataSourceFilterDirective, typeof i2.VdFilterOptionDirective, typeof i6.VdDynamicTableComponent], [typeof i7.CommonModule, typeof i8.VdCommonModule, typeof i9.FormsModule, typeof i10.MatButtonModule, typeof i11.MatFormFieldModule, typeof i12.MatSelectModule, typeof i13.MatIconModule, typeof i14.MatInputModule, typeof i15.MatDatepickerModule, typeof i16.MatTableModule, typeof i17.MatSortModule, typeof i18.CdkTableModule, typeof i19.MatProgressBarModule, typeof i20.MatCheckboxModule, typeof i10.MatButtonModule, typeof i21.MatMenuModule, typeof i22.MatSlideToggleModule, typeof i23.MatPaginatorModule, typeof i24.MatTooltipModule, typeof i25.MatToolbarModule], [typeof i1.FilterInputComponent, typeof i2.FilterSelectComponent, typeof i3.FilterClearComponent, typeof i4.FilterDateComponent, typeof i5.DataSourceFilterDirective, typeof i2.VdFilterOptionDirective, typeof i6.VdDynamicTableComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<VdTableModule>;
+}

package/lib/table/table.static-data-source.d.ts

@@ -0,0 +1,88 @@
+import { SelectionModel } from '@angular/cdk/collections';
+import { MatCheckboxChange } from '@angular/material/checkbox';
+import { MatTableDataSource } from '@angular/material/table';
+import { BehaviorSubject } from 'rxjs';
+import { Pagination } from './models/pagination';
+/**
+ * A generic datasource for data-table
+ */
+export declare class TableStaticDataSource<TEntity> extends MatTableDataSource<TEntity> {
+    /**
+     * onDataLoaded: function($event)
+     * Event emitted after the data is loaded
+     */
+    _reloadChange: BehaviorSubject<number>;
+    /**
+     * onDataLoaded: function($event)
+     * Event emitted after the data is loaded
+     */
+    onDataLoaded: BehaviorSubject<Pagination<TEntity>>;
+    /**
+     * Used to power selecting one or more options from a list.
+     */
+    selectionModel: SelectionModel<TEntity>;
+    /**
+     * Gets reload token
+     */
+    get reloadToken(): number;
+    /**
+     * Used to add some field filters
+     */
+    fieldFilters: any;
+    /**
+     * Used to add some field operators
+     */
+    fieldOperators: any;
+    /**
+     * Used to add some static field filters
+     */
+    staticFieldFilters: any;
+    /**
+     * The current page index.
+     */
+    pageIndex: number;
+    /**
+     * The current total number of items being paged
+     */
+    total: number;
+    /**
+     * The current page size
+     */
+    pageSize: number;
+    /**
+     * Number of pages
+     */
+    pageCount: number;
+    /**
+     * A flag to show loading process
+     */
+    isLoading: boolean;
+    /**
+     * Reloads items
+     * @param clearSelection
+     */
+    reload(clearSelection?: boolean): void;
+    /**
+     * Used by the MatTable. Called when it connects to the data source.
+     * @docs-private
+     */
+    connect(): BehaviorSubject<TEntity[]>;
+    /**
+     * Clears field filters
+     */
+    clearFilters(newFilters?: any): void;
+    /**
+     * Checks, whether all items are selected
+     */
+    isAllSelected(): boolean;
+    /**
+     * Toggles selected items
+     * @param checkbox
+     * @param predicate
+     */
+    toggleSelect(checkbox: MatCheckboxChange, predicate?: (value: TEntity, index: number, array: TEntity[]) => unknown): void;
+    /**
+     * Get selected Items
+     */
+    getSelected: <TType>(key?: string) => TType[];
+}

package/messaia-cdk.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@messaia/cdk" />
+export * from './public_api';

package/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@messaia/cdk",
+  "version": "0.0.0-CDK",
+  "peerDependencies": {},
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org"
+  },
+  "module": "fesm2015/messaia-cdk.mjs",
+  "es2020": "fesm2020/messaia-cdk.mjs",
+  "esm2020": "esm2020/messaia-cdk.mjs",
+  "fesm2020": "fesm2020/messaia-cdk.mjs",
+  "fesm2015": "fesm2015/messaia-cdk.mjs",
+  "typings": "messaia-cdk.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./messaia-cdk.d.ts",
+      "esm2020": "./esm2020/messaia-cdk.mjs",
+      "es2020": "./fesm2020/messaia-cdk.mjs",
+      "es2015": "./fesm2015/messaia-cdk.mjs",
+      "node": "./fesm2015/messaia-cdk.mjs",
+      "default": "./fesm2020/messaia-cdk.mjs"
+    }
+  },
+  "sideEffects": false,
+  "dependencies": {
+    "tslib": "^2.3.0"
+  }
+}

package/public_api.d.ts

@@ -0,0 +1,14 @@
+export * from './lib/base/public_api';
+export * from './lib/chips/public_api';
+export * from './lib/common/public_api';
+export * from './lib/dialogs/public_api';
+export * from './lib/file/public_api';
+export * from './lib/form-validators/public_api';
+export * from './lib/forms/public_api';
+export * from './lib/http/public_api';
+export * from './lib/layout/public_api';
+export * from './lib/media/public_api';
+export * from './lib/menu/public_api';
+export * from './lib/search/public_api';
+export * from './lib/select/public_api';
+export * from './lib/table/public_api';

package/src/lib/layout/README.md

@@ -0,0 +1,119 @@
+## VdLayoutComponent - vd-layout
+
+`<vd-layout>` is a blank main sidenav component that gets hooked as parent of all the other layouts. (triggered by their menu buttons)
+
+
+## API Summary
+
+| Name | Type | Description |
+| --- | --- | 650--- |
+| mode | 'over', 'side' or 'push' | The mode or styling of the sidenav. Defaults to 'over'.
+| opened | boolean | Whether or not the sidenav is opened. Use this binding to open/close the sidenav. Defaults to 'false'.
+| sidenavWidth | string | Sets the 'width' of the sidenav in either 'px' or '%'. Defaults to '320px'.
+
+
+## Usage
+
+`[vd-sidenav-content]` is used to include content in the main sidenav.
+
+Example for Main Layout:
+
+```html
+<vd-layout [mode]="side" [opened]="true" [sidenavWidth]="257px">
+  <div vd-sidenav-content>
+   .. more sidenav content
+  </div>
+  .. main content
+</vd-layout>
+```
+
+To toggle/close/open the main sidenav from child layouts/components, you can use the `[vdLayoutToggle]`, `[vdLayoutClose]` or `[tdLayoutOpen]` directives on any element and its click event will trigger the sidenav action.
+
+Example:
+
+```html
+<button mat-icon-button [vdLayoutToggle]="true"> // or vdLayoutOpen / tdLayoutClose
+  <mat-icon>menu</mat-icon>
+</button>
+```
+
+To disable the sidenav action, just set the input to false.
+
+```html
+<button mat-icon-button [vdLayoutToggle]="false">
+  <mat-icon>menu</mat-icon>
+</button>
+```
+
+## Installation
+
+This component can be installed as npm package.
+
+```bash
+npm i -save @covalent/core
+```
+
+
+## Setup
+
+Import the **[CovalentLayoutModule]** in your NgModule:
+
+```typescript
+import { CovalentLayoutModule } from '@covalent/core';
+@NgModule({
+  imports: [
+    CovalentLayoutModule,
+    ...
+  ],
+  ...
+})
+export class MyModule {}
+```
+
+
+### Theming
+
+See [theming](https://teradata.github.io/covalent/#/docs/theme) in the covalent docs for more info.
+
+
+## VdNavigationDrawerComponent - vd-navigation-drawer
+
+`<vd-navigation-drawer>` is a component that follows the [material design spec](https://material.io/guidelines/patterns/navigation-drawer.html#navigation-drawer-specs) is used as an addon component for `vd-layout`.
+
+
+## API Summary
+
+| Name | Type | Description |
+| --- | --- | 650--- |
+| sidenavTitle | string | Title set in toolbar.
+| icon | string | icon name to be displayed before the title
+| logo | string | logo icon name to be displayed before the title. If [icon] is set, then this will not be shown.
+| color | string | optional sidenav toolbar color.
+| navigationRoute | string | option to set the combined route for the icon, logo, and sidenavTitle.
+| backgroundUrl | SafeResourceUrl | image to be displayed as the background of the toolbar. URL used will be sanitized, but it should be always from a trusted source to avoid XSS.
+| name | string | string to be displayed as part of the navigation drawer sublabel. if [email] is not set, then [name] will be the toggle menu text.
+| email | string | string to be displayed as part of the navigation drawer sublabel in the [toggle] menu text. if [email] and [name] are not set, then the toggle menu is not rendered.
+
+
+## Usage
+
+`[vd-sidenav-content]` is used to include content in the main sidenav.
+
+`[vd-navigation-drawer-menu]` is used to include content to the `toggle` user menu. if no tag is used, then the toggle button dissapears.
+
+Example for Main Layout / Navigation Drawer Combo:
+
+```html
+<vd-layout>
+  <vd-navigation-drawer sidenavTitle="title" logo="logo" icon="icon" name="name" password="password" color="color" navigationRoute="/">
+    .. main drawer content
+    <div vd-navigation-drawer-menu>
+      .. menu drawer content
+    </div>
+  </vd-navigation-drawer>
+  <div vd-sidenav-content>
+   .. more sidenav content
+  </div>
+  .. main content
+</vd-layout>
+```

package/src/lib/layout/layout-card-over/README.md

@@ -0,0 +1,36 @@
+## VdLayoutCardOverComponent: vd-layout-card-over
+
+`<vd-layout-card-over>` is a layout component which lets you customize a `card over` view.
+
+
+## API Summary
+
+| Name | Type | Description |
+| --- | --- | 650--- |
+| cardTitle | string | Title set in card.
+| cardSubtitle | string | subtitle set in card.
+| cardWidth | string | Card flex width in %. Defaults to 70.
+| color | string | optional toolbar color. Defaults to primary.
+
+
+## Usage
+
+`[vd-after-card]` is used to include content after the main card over content.
+
+`vd-layout-footer` is used to include items in the footer.
+
+Example for Card Over Layout / Nav Layout combo:
+
+```html
+<vd-layout-nav toolbarTitle="title" logo="logo" icon="icon" color="primary">
+  <vd-layout-card-over cardTitle="title" cardSubtitle="subtitle" cardWidth="widthIn%" color="primary">
+    .. main content
+    <div vd-after-card>
+      .. content after card
+    </div>
+  </vd-layout-card-over>
+  <vd-layout-footer color="primary"> // color is optional
+    ... main footer content
+  </vd-layout-footer>
+</vd-layout-nav>
+```

package/src/lib/layout/layout-manage-list/README.md

@@ -0,0 +1,76 @@
+## VdLayoutManageListComponent: vd-layout-manage-list
+
+`<vd-layout-manage-list>` is a layout component which lets you customize a `management` view with toolbar items, item selections and footers.
+
+
+## API Summary
+
+| Name | Type | Description |
+| --- | --- | 650--- |
+| mode | 'over', 'side' or 'push' | The mode or styling of the sidenav. Defaults to 'side'.
+| opened | boolean | Whether or not the sidenav is opened. Use this binding to open/close the sidenav. Defaults to 'true'.
+| sidenavWidth | string | Sets the 'width' of the sidenav in either 'px' or '%'. Defaults to '257px'.
+
+
+## Usage
+
+To toggle/close/open the manage list sidenav from child layouts/components, you can use the `[vdLayoutManageListToggle]`, `[vdLayoutManageListClose]` or `[tdLayoutManageListOpen]` directives on any element and its click event will trigger the sidenav action.
+
+Example:
+
+```html
+<button mat-icon-button [vdLayoutManageListToggle]="true" [hideWhenOpened]="true"> // or vdLayoutManageListOpen / tdLayoutManageListClose
+  <mat-icon>menu</mat-icon>
+</button>
+```
+
+To disable the sidenav action, just set the input to false.
+
+```html
+<button mat-icon-button [vdLayoutManageListToggle]="false">
+  <mat-icon>menu</mat-icon>
+</button>
+```
+
+`[vd-sidenav-content]` is used to include items in the left side list.
+
+`[vd-toolbar-content]` is used to include items in the toolbar.
+
+`vd-layout-footer-inner` is used to include items in the inner footer.
+
+`[vdLayoutManageListToggle]` is used to add the sidenav toggle behavior to any clickable element.
+
+`[vdLayoutManageListClose]` is used to add the sidenav close behavior to any clickable element.
+
+`[vdLayoutManageListOpen]` is used to add the sidenav open behavior to any clickable element.
+
+Example for Manage List Layout / Nav Layout combo:
+
+```html
+<vd-layout-nav sidenavTitle="title" logo="logo" icon="icon" color="primary">
+  <div vd-toolbar-content>
+    .. main toolbar content
+  </div>
+  <vd-layout-manage-list opened="true" mode="side" sidenavWidth="257px">
+    <mat-toolbar vd-sidenav-content>
+      ... toolbar in sidenav
+    </mat-toolbar>
+    <mat-nav-list vd-sidenav-content>
+      ... sidenav content
+    </mat-nav-list>
+    <mat-toolbar>
+      <button mat-icon-button vdLayoutManageListOpen [hideWhenOpened]="true">
+        <mat-icon>arrow_back</mat-icon>
+      </button>
+      ... sub toolbar content
+    </mat-toolbar>
+    ... main content
+    <vd-layout-footer-inner>
+      ... sub footer content
+    </vd-layout-footer-inner>
+  </vd-layout-manage-list>
+  <vd-layout-footer color="primary"> // color is optional
+    ... main footer content
+  </vd-layout-footer>
+</vd-layout-nav>
+```

package/src/lib/layout/layout-nav/README.md

@@ -0,0 +1,40 @@
+## VdLayoutNavComponent: vd-layout-nav
+
+`<vd-layout-nav>` is a layout component which lets you customize a `navigation` view with toolbar items and footers.
+
+
+## API Summary
+
+| Name | Type | Description |
+| --- | --- | 650--- |
+| toolbarTitle | string | Title set in toolbar.
+| icon | string | icon name to be displayed before the title
+| logo | string | logo icon name to be displayed before the title. If [icon] is set, then this will not be shown.
+| color | string | optional toolbar color. Defaults to primary.
+| navigationRoute | string | option to set the combined route for the icon, logo, and toolbarTitle.
+
+
+## Usage
+
+`[vd-menu-button]` is used to include a menu button before the logo and title.
+
+`[vd-toolbar-content]` is used to include items in the toolbar.
+
+`vd-layout-footer` is used to include items in the footer.
+
+Example for Nav Layout:
+
+```html
+<vd-layout-nav toolbarTitle="title" logo="logo" icon="icon" color="primary" navigationRoute="/">
+  <button mat-icon-button vd-menu-button> // can use `[vdLayoutToggle]` to toggle main sidenav
+    <mat-icon>menu</mat-icon>
+  </button>
+  <div vd-toolbar-content>
+    .. main toolbar content
+  </div>
+  ... main content
+  <vd-layout-footer color="primary"> // color is optional
+    ... main footer content
+  </vd-layout-footer>
+</vd-layout-nav>
+```

package/src/lib/layout/layout-nav-list/README.md

@@ -0,0 +1,85 @@
+## VdLayoutNavListComponent: vd-layout-nav-list
+
+`<vd-layout-nav-list>` is a layout component which lets you customize a `navigation` list view with toolbar items, item selections and footers.
+
+
+## API Summary
+
+| Name | Type | Description |
+| --- | --- | 650--- |
+| toolbarTitle | string | Title set in toolbar.
+| icon | string | icon name to be displayed before the title
+| logo | string | logo icon name to be displayed before the title. If [icon] is set, then this will not be shown.
+| color | string | optional toolbar color. Defaults to primary.
+| navigationRoute | string | option to set the combined route for the icon, logo, and toolbarTitle.
+| mode | 'over', 'side' or 'push' | The mode or styling of the sidenav. Defaults to 'side'.
+| opened | boolean | Whether or not the sidenav is opened. Use this binding to open/close the sidenav. Defaults to 'true'.
+| sidenavWidth | string | Sets the 'width' of the sidenav in either 'px' or '%'. Defaults to '257px'.
+
+
+## Usage
+
+To toggle/close/open the nav list sidenav from child layouts/components, you can use the `[vdLayoutNavListToggle]`, `[vdLayoutNavListClose]` or `[tdLayoutNavListOpen]` directives on any element and its click event will trigger the sidenav action.
+
+Example:
+
+```html
+<button mat-icon-button [vdLayoutNavListToggle]="true" [hideWhenOpened]="true"> // or vdLayoutNavListOpen / tdLayoutNavListClose
+  <mat-icon>menu</mat-icon>
+</button>
+```
+
+To disable the sidenav action, just set the input to false.
+
+```html
+<button mat-icon-button [vdLayoutNavListToggle]="false">
+  <mat-icon>menu</mat-icon>
+</button>
+```
+
+`[vd-menu-button]` is used to include a menu button before the logo and title.
+
+`[vd-sidenav-content]` is used to include items in the left side list.
+
+`[vd-sidenav-toolbar-content]` is used to include items in the left toolbar.
+
+`[vd-toolbar-content]` is used to include items in the right toolbar.
+
+`vd-layout-footer-inner` is used to include items in the inner footer.
+
+`vd-layout-footer` is used to include items in the main footer.
+
+`[vdLayoutNavListToggle]` is used to add the sidenav toggle behavior to any clickable element.
+
+`[vdLayoutNavListClose]` is used to add the sidenav close behavior to any clickable element.
+
+`[vdLayoutNavListOpen]` is used to add the sidenav open behavior to any clickable element.
+
+Example for Nav List Layout:
+
+```html
+<vd-layout-nav-list sidenavTitle="title" logo="logo" icon="icon" opened="true" mode="side" sidenavWidth="350px" color="primary" navigationRoute="/">
+  <button mat-icon-button vd-menu-button> // can use `[vdLayoutToggle]` to toggle main sidenav
+    <mat-icon>menu</mat-icon>
+  </button>
+  <div vd-sidenav-toolbar-content>
+    ... left toolbar content
+  </div>
+  <mat-nav-list vd-sidenav-content>
+    <button mat-icon-button vdLayoutNavListOpen [hideWhenOpened]="true">
+      <mat-icon>arrow_back</mat-icon>
+    </button>
+    ... sidenav content
+  </mat-nav-list>
+  <div vd-toolbar-content>
+    ... right toolbar content
+  </div>
+  ... main content
+  <vd-layout-footer-inner>
+    ... sub footer content
+  </vd-layout-footer-inner>
+  <vd-layout-footer color="primary"> // color is optional
+    ... main footer content
+  </vd-layout-footer>
+</vd-layout-nav-list>
+```