@theseam/ui-common 0.2.9

package/fesm2015/theseam-ui-common-table-cell-type.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theseam-ui-common-table-cell-type.js","sources":["../../../projects/ui-common/table-cell-type/table-cell-type-tokens.ts","../../../projects/ui-common/table-cell-type/table-cell-type-selector.component.ts","../../../projects/ui-common/table-cell-type/services/table-cell-types-helpers.service.ts","../../../projects/ui-common/table-cell-type/table-cell-type.module.ts","../../../projects/ui-common/table-cell-type/theseam-ui-common-table-cell-type.ts"],"sourcesContent":["import { InjectionToken } from '@angular/core'\n\nimport { ITableCellTypeManifest, TableCellData } from './table-cell-type-models'\n\nexport const TABLE_CELL_TYPE_MANIFEST = new InjectionToken<ITableCellTypeManifest>('TABLE_CELL_TYPE_MANIFEST')\n\nexport const TABLE_CELL_DATA = new InjectionToken<TableCellData<any, any>>('TABLE_CELL_DATA')\n","import { ComponentPortal, PortalInjector } from '@angular/cdk/portal'\nimport { ComponentType } from '@angular/cdk/portal'\nimport {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  Inject,\n  Injector,\n  Input,\n  isDevMode,\n  OnChanges,\n  OnInit,\n  Optional,\n  SimpleChanges\n} from '@angular/core'\nimport { Subject } from 'rxjs'\n\nimport { TableCellTypeConfig } from './table-cell-type-config'\nimport type { TheSeamTableColumn } from './table-cell-type-models'\nimport { ITableCellTypeManifest, TableCellData, TableCellDataChange } from './table-cell-type-models'\nimport { TABLE_CELL_DATA, TABLE_CELL_TYPE_MANIFEST } from './table-cell-type-tokens'\n\n@Component({\n  selector: 'seam-table-cell-type-selector',\n  template: `\n    <ng-template *ngIf=\"componentPortal; else noPortal\" [cdkPortalOutlet]=\"componentPortal\"></ng-template>\n    <ng-template #noPortal>{{ value }}</ng-template>\n  `,\n  styles: [],\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class TableCellTypeSelectorComponent<T extends string = any, D = any, V = any> implements OnInit, AfterViewInit, OnChanges {\n\n  @Input() type: T | undefined | null\n  @Input() value: V | undefined | null\n  @Input() rowIndex: number | undefined | null\n  @Input() row: D | undefined | null\n  @Input() colData: TheSeamTableColumn<T, TableCellTypeConfig<T>> | undefined | null\n\n  public componentPortal?: ComponentPortal<{}>\n\n  private _data: TableCellData<T, TableCellTypeConfig<T>> | undefined\n  private _dataChangeSubject?: Subject<TableCellDataChange<T, TableCellTypeConfig<T>>>\n  private _manifests: ITableCellTypeManifest[]\n\n  constructor(\n    private _injector: Injector,\n    private _ref: ChangeDetectorRef,\n    @Optional() @Inject(TABLE_CELL_TYPE_MANIFEST) manifests?: ITableCellTypeManifest[]\n  ) { this._manifests = manifests || [] }\n\n  ngOnInit() { }\n\n  ngAfterViewInit() {\n    if (!this.type) {\n      return\n    }\n\n    const comp = this._getComponent(this.type)\n    if (comp) {\n      this._dataChangeSubject = new Subject<TableCellDataChange<T, TableCellTypeConfig<T>>>()\n\n      this._data = {\n        row: this.row,\n        rowIndex: this.rowIndex ?? -1,\n        colData: this.colData ?? {},\n        value: this.value,\n        changed: this._dataChangeSubject.asObservable()\n      }\n\n      this.componentPortal = new ComponentPortal(comp, null, this._createInjector(this._data))\n      this._ref.detectChanges()\n    } else {\n      if (isDevMode()) {\n        throw new Error(`CellType '${this.type}' not found.`)\n      } else {\n        // TODO: Implement fallback\n      }\n    }\n  }\n\n  private _getComponent(name: string): ComponentType<{}> | undefined {\n    const manifest = this._manifests.find(m => m.name === name)\n    return manifest ? manifest.component : undefined\n  }\n\n  private _createInjector(cellData: TableCellData<T, TableCellTypeConfig<T>>): PortalInjector {\n    const injectorTokens = new WeakMap()\n    injectorTokens.set(TABLE_CELL_DATA, cellData)\n    return new PortalInjector(this._injector, injectorTokens)\n  }\n\n  ngOnChanges(changes: SimpleChanges) {\n    if (this._data) {\n      const dataChanged = [\n        this._tryUpdateDataProp(changes, 'row'),\n        this._tryUpdateDataProp(changes, 'rowIndex'),\n        this._tryUpdateDataProp(changes, 'colData'),\n        this._tryUpdateDataProp(changes, 'value')\n      ].findIndex(b => b === true) !== -1\n\n      if (dataChanged && this._dataChangeSubject) {\n        this._dataChangeSubject.next({\n          data: this._data,\n          changes\n        })\n      }\n    }\n  }\n\n  private _tryUpdateDataProp(changes: SimpleChanges, prop: keyof Omit<TableCellData<T, TableCellTypeConfig<T>>, 'changed'>): boolean {\n    if (this._data && changes.hasOwnProperty(prop)) {\n      this._data[prop] = changes[prop].currentValue\n      return true\n    }\n    return false\n  }\n\n}\n","import { Injectable } from '@angular/core'\nimport { from, Observable, Subject, Subscriber } from 'rxjs'\nimport { takeUntil } from 'rxjs/operators'\n\nimport { DynamicActionHelperService, DynamicActionModalDef, DynamicValueHelperService } from '@theseam/ui-common/dynamic'\n\nimport { TableCellTypeConfig } from '../table-cell-type-config'\nimport { CaluclatedValueContextType, ICalucatedValueContext, TableCellData } from '../table-cell-type-models'\nimport { TableCellTypeName } from '../table-cell-type-name'\n\n@Injectable({\n  providedIn: 'root'\n})\nexport class TableCellTypesHelpersService {\n\n  constructor(\n    private _dynamicActionHelper: DynamicActionHelperService,\n    private _valueHelper: DynamicValueHelperService\n  ) { }\n\n  public parseValueProp(value: any, contextOrContextFn: CaluclatedValueContextType) {\n    const context = this._resolveValueContext(contextOrContextFn)\n    return this._valueHelper.evalSync(value, context)\n  }\n\n  public getValueContext<T extends TableCellTypeName>(value: any, data?: TableCellData<T, TableCellTypeConfig<T>>): ICalucatedValueContext {\n    return {\n      row: data && data.row,\n      rowIndex: data && data.rowIndex,\n      colData: data && data.colData,\n      value: value\n    }\n  }\n\n  private _resolveValueContext(contextOrContextFn: CaluclatedValueContextType) {\n    let context = contextOrContextFn\n    if (typeof context === 'function') {\n      context = context()\n    }\n    return context\n  }\n\n  public handleModalAction<R = any>(\n    action: DynamicActionModalDef,\n    contextOrContextFn: CaluclatedValueContextType\n  ) {\n    // TODO: Try to simplify this observable. It seems fairly easy to read like\n    // this, but seems like it is doing more than it needs to with the multiple\n    // subjects.\n    return new Observable((subscriber: Subscriber<R>) => {\n      // Passed to helper function to emit results to subscriber.\n      const resultSubject = new Subject<any>()\n      // Used to stop observing.\n      const stopSubject = new Subject<any>()\n\n      // Observe results to emit to subscriber.\n      resultSubject\n        .pipe(takeUntil(stopSubject))\n        .subscribe(\n          result => subscriber.next(result),\n          err => subscriber.error(err),\n          () => stopSubject.complete()\n        )\n\n      // Handle the potentially deep chain of actions.\n      this._handleModalAction(action, contextOrContextFn, resultSubject)\n        .pipe(takeUntil(stopSubject))\n        .subscribe(\n          () => {},\n          err => subscriber.error(err),\n          () => subscriber.complete()\n        )\n\n      // Clean up on unsubscribe.\n      return () => {\n        stopSubject.next(undefined)\n        stopSubject.complete()\n      }\n    })\n  }\n\n  private _handleModalAction(\n    action: DynamicActionModalDef,\n    contextOrContextFn: CaluclatedValueContextType,\n    resultSubject: Subject<any>\n  ) {\n    const context = this._resolveValueContext(contextOrContextFn)\n    return from(this._dynamicActionHelper.exec(action, context))\n  }\n}\n","import { PortalModule } from '@angular/cdk/portal'\nimport { CommonModule } from '@angular/common'\nimport { NgModule } from '@angular/core'\n\nimport { TableCellTypeSelectorComponent } from './table-cell-type-selector.component'\n\n@NgModule({\n  declarations: [\n    TableCellTypeSelectorComponent\n  ],\n  imports: [\n    CommonModule,\n    PortalModule\n  ],\n  providers: [ ],\n  exports: [\n    TableCellTypeSelectorComponent\n  ],\n  entryComponents: [ ]\n})\nexport class TheSeamTableCellTypeModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;MAIa,wBAAwB,GAAG,IAAI,cAAc,CAAyB,0BAA0B,EAAC;MAEjG,eAAe,GAAG,IAAI,cAAc,CAA0B,iBAAiB;;MC0B/E,8BAA8B;IAczC,YACU,SAAmB,EACnB,IAAuB,EACe,SAAoC;QAF1E,cAAS,GAAT,SAAS,CAAU;QACnB,SAAI,GAAJ,IAAI,CAAmB;QAE7B,IAAI,CAAC,UAAU,GAAG,SAAS,IAAI,EAAE,CAAA;KAAE;IAEvC,QAAQ,MAAM;IAEd,eAAe;;QACb,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACd,OAAM;SACP;QAED,MAAM,IAAI,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;QAC1C,IAAI,IAAI,EAAE;YACR,IAAI,CAAC,kBAAkB,GAAG,IAAI,OAAO,EAAkD,CAAA;YAEvF,IAAI,CAAC,KAAK,GAAG;gBACX,GAAG,EAAE,IAAI,CAAC,GAAG;gBACb,QAAQ,EAAE,MAAA,IAAI,CAAC,QAAQ,mCAAI,CAAC,CAAC;gBAC7B,OAAO,EAAE,MAAA,IAAI,CAAC,OAAO,mCAAI,EAAE;gBAC3B,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,YAAY,EAAE;aAChD,CAAA;YAED,IAAI,CAAC,eAAe,GAAG,IAAI,eAAe,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAA;YACxF,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAA;SAC1B;aAAM;YACL,IAAI,SAAS,EAAE,EAAE;gBACf,MAAM,IAAI,KAAK,CAAC,aAAa,IAAI,CAAC,IAAI,cAAc,CAAC,CAAA;aACtD;iBAAM;;aAEN;SACF;KACF;IAEO,aAAa,CAAC,IAAY;QAChC,MAAM,QAAQ,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,CAAA;QAC3D,OAAO,QAAQ,GAAG,QAAQ,CAAC,SAAS,GAAG,SAAS,CAAA;KACjD;IAEO,eAAe,CAAC,QAAkD;QACxE,MAAM,cAAc,GAAG,IAAI,OAAO,EAAE,CAAA;QACpC,cAAc,CAAC,GAAG,CAAC,eAAe,EAAE,QAAQ,CAAC,CAAA;QAC7C,OAAO,IAAI,cAAc,CAAC,IAAI,CAAC,SAAS,EAAE,cAAc,CAAC,CAAA;KAC1D;IAED,WAAW,CAAC,OAAsB;QAChC,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,MAAM,WAAW,GAAG;gBAClB,IAAI,CAAC,kBAAkB,CAAC,OAAO,EAAE,KAAK,CAAC;gBACvC,IAAI,CAAC,kBAAkB,CAAC,OAAO,EAAE,UAAU,CAAC;gBAC5C,IAAI,CAAC,kBAAkB,CAAC,OAAO,EAAE,SAAS,CAAC;gBAC3C,IAAI,CAAC,kBAAkB,CAAC,OAAO,EAAE,OAAO,CAAC;aAC1C,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,CAAC,CAAA;YAEnC,IAAI,WAAW,IAAI,IAAI,CAAC,kBAAkB,EAAE;gBAC1C,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC;oBAC3B,IAAI,EAAE,IAAI,CAAC,KAAK;oBAChB,OAAO;iBACR,CAAC,CAAA;aACH;SACF;KACF;IAEO,kBAAkB,CAAC,OAAsB,EAAE,IAAqE;QACtH,IAAI,IAAI,CAAC,KAAK,IAAI,OAAO,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE;YAC9C,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,YAAY,CAAA;YAC7C,OAAO,IAAI,CAAA;SACZ;QACD,OAAO,KAAK,CAAA;KACb;;;YA9FF,SAAS,SAAC;gBACT,QAAQ,EAAE,+BAA+B;gBACzC,QAAQ,EAAE;;;GAGT;gBAED,eAAe,EAAE,uBAAuB,CAAC,MAAM;aAChD;;;YAvBC,QAAQ;YAHR,iBAAiB;wCA4Cd,QAAQ,YAAI,MAAM,SAAC,wBAAwB;;;mBAf7C,KAAK;oBACL,KAAK;uBACL,KAAK;kBACL,KAAK;sBACL,KAAK;;;MCzBK,4BAA4B;IAEvC,YACU,oBAAgD,EAChD,YAAuC;QADvC,yBAAoB,GAApB,oBAAoB,CAA4B;QAChD,iBAAY,GAAZ,YAAY,CAA2B;KAC5C;IAEE,cAAc,CAAC,KAAU,EAAE,kBAA8C;QAC9E,MAAM,OAAO,GAAG,IAAI,CAAC,oBAAoB,CAAC,kBAAkB,CAAC,CAAA;QAC7D,OAAO,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC,CAAA;KAClD;IAEM,eAAe,CAA8B,KAAU,EAAE,IAA+C;QAC7G,OAAO;YACL,GAAG,EAAE,IAAI,IAAI,IAAI,CAAC,GAAG;YACrB,QAAQ,EAAE,IAAI,IAAI,IAAI,CAAC,QAAQ;YAC/B,OAAO,EAAE,IAAI,IAAI,IAAI,CAAC,OAAO;YAC7B,KAAK,EAAE,KAAK;SACb,CAAA;KACF;IAEO,oBAAoB,CAAC,kBAA8C;QACzE,IAAI,OAAO,GAAG,kBAAkB,CAAA;QAChC,IAAI,OAAO,OAAO,KAAK,UAAU,EAAE;YACjC,OAAO,GAAG,OAAO,EAAE,CAAA;SACpB;QACD,OAAO,OAAO,CAAA;KACf;IAEM,iBAAiB,CACtB,MAA6B,EAC7B,kBAA8C;;;;QAK9C,OAAO,IAAI,UAAU,CAAC,CAAC,UAAyB;;YAE9C,MAAM,aAAa,GAAG,IAAI,OAAO,EAAO,CAAA;;YAExC,MAAM,WAAW,GAAG,IAAI,OAAO,EAAO,CAAA;;YAGtC,aAAa;iBACV,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;iBAC5B,SAAS,CACR,MAAM,IAAI,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,EACjC,GAAG,IAAI,UAAU,CAAC,KAAK,CAAC,GAAG,CAAC,EAC5B,MAAM,WAAW,CAAC,QAAQ,EAAE,CAC7B,CAAA;;YAGH,IAAI,CAAC,kBAAkB,CAAC,MAAM,EAAE,kBAAkB,EAAE,aAAa,CAAC;iBAC/D,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;iBAC5B,SAAS,CACR,SAAQ,EACR,GAAG,IAAI,UAAU,CAAC,KAAK,CAAC,GAAG,CAAC,EAC5B,MAAM,UAAU,CAAC,QAAQ,EAAE,CAC5B,CAAA;;YAGH,OAAO;gBACL,WAAW,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;gBAC3B,WAAW,CAAC,QAAQ,EAAE,CAAA;aACvB,CAAA;SACF,CAAC,CAAA;KACH;IAEO,kBAAkB,CACxB,MAA6B,EAC7B,kBAA8C,EAC9C,aAA2B;QAE3B,MAAM,OAAO,GAAG,IAAI,CAAC,oBAAoB,CAAC,kBAAkB,CAAC,CAAA;QAC7D,OAAO,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAA;KAC7D;;;;YA9EF,UAAU,SAAC;gBACV,UAAU,EAAE,MAAM;aACnB;;;YARQ,0BAA0B;YAAyB,yBAAyB;;;MCgBxE,0BAA0B;;;YAdtC,QAAQ,SAAC;gBACR,YAAY,EAAE;oBACZ,8BAA8B;iBAC/B;gBACD,OAAO,EAAE;oBACP,YAAY;oBACZ,YAAY;iBACb;gBACD,SAAS,EAAE,EAAG;gBACd,OAAO,EAAE;oBACP,8BAA8B;iBAC/B;gBACD,eAAe,EAAE,EAAG;aACrB;;;ACnBD;;;;;;"}

package/fesm2015/theseam-ui-common-table-cell-types.js

@@ -0,0 +1,799 @@
+import { TABLE_CELL_DATA, TableCellTypesHelpersService, TABLE_CELL_TYPE_MANIFEST, TheSeamTableCellTypeModule } from '@theseam/ui-common/table-cell-type';
+import { Component, ChangeDetectionStrategy, ChangeDetectorRef, Optional, Inject, Input, HostBinding, NgModule } from '@angular/core';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import { DatatableComponent } from '@theseam/ui-common/datatable';
+import { getKnownIcon, TheSeamIconModule } from '@theseam/ui-common/icon';
+import { TableComponent } from '@theseam/ui-common/table';
+import { THESEAM_DEFAULT_PHONE_NUMBER_FORMAT, coercePhoneNumberFormat, TheSeamTelInputModule } from '@theseam/ui-common/tel-input';
+import { hasProperty } from '@theseam/ui-common/utils';
+import { coerceNumberProperty, coerceBooleanProperty } from '@angular/cdk/coercion';
+import { PortalModule } from '@angular/cdk/portal';
+import { CommonModule } from '@angular/common';
+import { RouterModule } from '@angular/router';
+import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';
+import { TheSeamAssetReaderModule } from '@theseam/ui-common/asset-reader';
+import { TheSeamPopoverModule } from '@theseam/ui-common/popover';
+import { TheSeamProgressModule } from '@theseam/ui-common/progress';
+import { TheSeamSharedModule } from '@theseam/ui-common/shared';
+
+class TableCellTypeDateComponent {
+    constructor(_cdf, _tableData) {
+        this._cdf = _cdf;
+        this._ngUnsubscribe = new Subject();
+        const _data = _tableData;
+        this.value = _data && _data.value;
+        this.format = _data && _data.colData && _data.colData.cellTypeConfig && _data.colData.cellTypeConfig.format;
+        if (_data) {
+            _data.changed
+                .pipe(takeUntil(this._ngUnsubscribe))
+                .subscribe(v => {
+                if (v.changes.hasOwnProperty('value')) {
+                    this.value = v.changes.value.currentValue;
+                    this._cdf.markForCheck();
+                }
+                if (v.changes.hasOwnProperty('colData')) {
+                    const colData = v.changes.colData.currentValue;
+                    if (colData && colData.format !== this.format) {
+                        this.format = colData.format;
+                    }
+                    else {
+                        this.format = undefined;
+                    }
+                    this._cdf.markForCheck();
+                }
+            });
+        }
+    }
+    ngOnInit() { }
+    ngOnDestroy() {
+        this._ngUnsubscribe.next();
+        this._ngUnsubscribe.complete();
+    }
+}
+TableCellTypeDateComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'seam-table-cell-type-date',
+                template: "<div class=\"td-text-truncate\" [title]=\"value | date: format || 'yyyy-MM-dd h:mm aaa'\">\n  {{ value | date: format || 'yyyy-MM-dd h:mm aaa' }}\n</div>\n",
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                styles: [""]
+            },] }
+];
+TableCellTypeDateComponent.ctorParameters = () => [
+    { type: ChangeDetectorRef },
+    { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [TABLE_CELL_DATA,] }] }
+];
+TableCellTypeDateComponent.propDecorators = {
+    value: [{ type: Input }],
+    format: [{ type: Input }]
+};
+
+class TableCellTypeIconComponent {
+    constructor(_cdf, _tableCellTypeHelpers, _datatable, _table, _tableData) {
+        this._cdf = _cdf;
+        this._tableCellTypeHelpers = _tableCellTypeHelpers;
+        this._datatable = _datatable;
+        this._table = _table;
+        this._ngUnsubscribe = new Subject();
+        this._tplType = 'default';
+        this._tooltipDisabled = true;
+        this._isDatatable = false;
+        if (_datatable) {
+            this._isDatatable = true;
+            // console.log('isDataTable')
+        }
+        // if (_table) {
+        //   console.log('isTable')
+        // }
+        const _data = _tableData;
+        this._tableCellData = _tableData;
+        this._row = _data && _data.row;
+        this._rowIndex = _data && _data.rowIndex;
+        this.value = _data && _data.value;
+        this._colData = _data && _data.colData;
+        if (_data && _data.colData && _data.colData.cellTypeConfig) {
+            this.config = _data.colData.cellTypeConfig;
+        }
+        if (_data) {
+            _data.changed
+                .pipe(takeUntil(this._ngUnsubscribe))
+                .subscribe(v => {
+                if (v.changes.hasOwnProperty('value')) {
+                    this.value = v.changes.value.currentValue;
+                    this.config = this._config;
+                    this._cdf.markForCheck();
+                }
+                if (v.changes.hasOwnProperty('colData')) {
+                    const colData = v.changes.colData.currentValue;
+                    if (colData && colData.cellTypeConfig !== this.config) {
+                        this.config = colData.cellTypeConfig;
+                    }
+                    else {
+                        this.config = undefined;
+                    }
+                    this._cdf.markForCheck();
+                }
+                else {
+                    if (v.changes.hasOwnProperty('row')) {
+                        this.config = this.config;
+                        this._cdf.markForCheck();
+                    }
+                }
+            });
+        }
+    }
+    get value() { return this._value; }
+    set value(value) {
+        this._value = value;
+        this._icon = value ? getKnownIcon(value) || value : value;
+    }
+    get config() { return this._config; }
+    set config(value) {
+        this._config = value;
+        if (value) {
+            this.setAction(value.action);
+            this._linkClass = this._parseConfigValue(value.linkClass);
+            this._iconClass = this._parseConfigValue(value.iconClass);
+            this._iconType = value.iconType;
+            this._title = this._parseConfigValue(value.titleAttr);
+            this._srOnly = this._parseConfigValue(value.srOnly);
+            this._tooltip = this._parseConfigValue(value.tooltip);
+            if (this._tooltip) {
+                this._tooltipClass = this._parseConfigValue(value.tooltipClass);
+                this._tooltipPlacement = this._parseConfigValue(value.tooltipPlacement) || 'auto';
+                this._tooltipContainer = this._parseConfigValue(value.tooltipContainer);
+                this._tooltipDisabled = false;
+            }
+            else {
+                this._tooltipDisabled = true;
+            }
+        }
+    }
+    ngOnInit() { }
+    ngOnDestroy() {
+        this._ngUnsubscribe.next();
+        this._ngUnsubscribe.complete();
+    }
+    setAction(configAction) {
+        let newTplType = 'default';
+        let link;
+        let download = false;
+        let detectMimeContent = false;
+        let target;
+        let queryParams;
+        if (configAction) {
+            if (configAction.type === 'link') {
+                link = this._parseConfigValue(configAction.link);
+                if (link !== undefined && link !== null) {
+                    newTplType = this._parseConfigValue(configAction.asset)
+                        ? 'link-encrypted'
+                        : this._parseConfigValue(configAction.external) ? 'link-external' : 'link';
+                    download = !!this._parseConfigValue(configAction.download);
+                    detectMimeContent = !!this._parseConfigValue(configAction.detectMimeContent);
+                    target = this._parseConfigValue(configAction.target);
+                    queryParams = this._parseConfigValue(configAction.queryParams);
+                }
+            }
+            else if (configAction.type === 'modal') {
+                newTplType = 'button';
+                this._buttonAction = configAction;
+            }
+        }
+        this._tplType = newTplType;
+        this._link = link;
+        this._download = download;
+        this._detectMimeContent = detectMimeContent;
+        this._target = target;
+        this._queryParams = queryParams;
+    }
+    _parseConfigValue(val) {
+        const contextFn = () => this._tableCellTypeHelpers.getValueContext(val, this._tableCellData);
+        return this._tableCellTypeHelpers.parseValueProp(val, contextFn);
+    }
+    _doButtonAction() {
+        if (this._buttonAction && this._buttonAction.type === 'modal') {
+            const contextFn = () => this._tableCellTypeHelpers.getValueContext(this.value, this._tableCellData);
+            this._tableCellTypeHelpers.handleModalAction(this._buttonAction, contextFn)
+                .subscribe(r => { }, err => console.error(err), () => this._actionRefreshRequest());
+        }
+    }
+    _actionRefreshRequest() {
+        if (this._datatable) {
+            this._datatable.triggerActionRefreshRequest();
+        }
+        else if (this._table) {
+            this._table.triggerActionRefreshRequest();
+        }
+    }
+}
+TableCellTypeIconComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'seam-table-cell-type-icon',
+                template: "<ng-container *ngIf=\"_icon\">\n  <div *ngIf=\"!_tplType || _tplType === 'default'\"\n    class=\"d-flex align-items-center justify-center\"\n    [class.datatable-icon-fix]=\"_isDatatable\">\n    <a class=\"d-block m-auto{{ _linkClass ? ' ' + _linkClass : '' }}\"\n      [attr.title]=\"_tooltipDisabled ? _title : undefined\"\n      [attr.target]=\"_target\"\n      [ngbTooltip]=\"_tooltip\"\n      [tooltipClass]=\"$any(_tooltipClass)\"\n      [placement]=\"$any(_tooltipPlacement)\"\n      [container]=\"$any(_tooltipContainer)\"\n      [disableTooltip]=\"_tooltipDisabled\">\n      <seam-icon [icon]=\"_icon\" size=\"lg\" [iconType]=\"_iconType\" [iconClass]=\"_iconClass || ''\"></seam-icon>\n      <span *ngIf=\"_srOnly\" class=\"sr-only\">{{ _srOnly }}</span>\n    </a>\n  </div>\n\n  <div *ngIf=\"_tplType === 'link'\"\n    class=\"d-flex align-items-center justify-center\"\n    [class.datatable-icon-fix]=\"_isDatatable\">\n    <a class=\"d-block m-auto{{ _linkClass ? ' ' + _linkClass : '' }}\"\n      [routerLink]=\"_link\"\n      [queryParams]=\"_queryParams\"\n      [attr.title]=\"_tooltipDisabled ? _title : undefined\"\n      [attr.target]=\"_target\"\n      [ngbTooltip]=\"_tooltip\"\n      [tooltipClass]=\"$any(_tooltipClass)\"\n      [placement]=\"$any(_tooltipPlacement)\"\n      [container]=\"$any(_tooltipContainer)\"\n      [disableTooltip]=\"_tooltipDisabled\">\n      <seam-icon *ngIf=\"_icon\" [icon]=\"_icon\" size=\"lg\" [iconType]=\"_iconType\" [iconClass]=\"_iconClass\"></seam-icon>\n      <span *ngIf=\"_srOnly\" class=\"sr-only\">{{ _srOnly }}</span>\n    </a>\n  </div>\n\n  <div *ngIf=\"_tplType === 'link-external'\"\n    class=\"d-flex align-items-center justify-center\"\n    [class.datatable-icon-fix]=\"_isDatatable\">\n    <a class=\"d-block m-auto{{ _linkClass ? ' ' + _linkClass : '' }}\"\n      [attr.href]=\"_link\"\n      [attr.title]=\"_tooltipDisabled ? _title : undefined\"\n      [attr.target]=\"_target\"\n      [ngbTooltip]=\"_tooltip\"\n      [tooltipClass]=\"$any(_tooltipClass)\"\n      [placement]=\"$any(_tooltipPlacement)\"\n      [container]=\"$any(_tooltipContainer)\"\n      [disableTooltip]=\"_tooltipDisabled\">\n      <seam-icon *ngIf=\"_icon\" [icon]=\"_icon\" size=\"lg\" [iconType]=\"_iconType\" [iconClass]=\"_iconClass\"></seam-icon>\n      <span *ngIf=\"_srOnly\" class=\"sr-only\">{{ _srOnly }}</span>\n    </a>\n  </div>\n\n  <div *ngIf=\"_tplType === 'link-encrypted'\"\n    class=\"d-flex align-items-center justify-center\"\n    [class.datatable-icon-fix]=\"_isDatatable\">\n    <button\n      class=\"btn btn-link p-0 m-auto{{ _linkClass ? ' ' + _linkClass : '' }}\"\n      type=\"button\"\n      [seamEncryptedAssetLink]=\"_link\"\n      [seamDetectMimeFromContent]=\"_detectMimeContent\"\n      [seamDownloadAsset]=\"_download\"\n      [attr.title]=\"_tooltipDisabled ? _title : undefined\"\n      [ngbTooltip]=\"_tooltip\"\n      [tooltipClass]=\"$any(_tooltipClass)\"\n      [placement]=\"$any(_tooltipPlacement)\"\n      [container]=\"$any(_tooltipContainer)\"\n      [disableTooltip]=\"_tooltipDisabled\">\n      <seam-icon *ngIf=\"_icon\" iconType=\"styled-square\" [icon]=\"_icon\" size=\"lg\" [iconType]=\"_iconType\" [iconClass]=\"_iconClass\"></seam-icon>\n      <span *ngIf=\"_srOnly\" class=\"sr-only\">{{ _srOnly }}</span>\n    </button>\n  </div>\n\n  <div *ngIf=\"_tplType === 'button'\"\n    class=\"d-flex align-items-center justify-center\"\n    [class.datatable-icon-fix]=\"_isDatatable\"\n    (click)=\"_doButtonAction()\">\n    <button\n      class=\"btn btn-link p-0 m-auto{{ _linkClass ? ' ' + _linkClass : '' }}\"\n      type=\"button\"\n      [attr.title]=\"_tooltipDisabled ? _title : undefined\"\n      [ngbTooltip]=\"_tooltip\"\n      [tooltipClass]=\"$any(_tooltipClass)\"\n      [placement]=\"$any(_tooltipPlacement)\"\n      [container]=\"$any(_tooltipContainer)\"\n      [disableTooltip]=\"_tooltipDisabled\">\n      <seam-icon *ngIf=\"_icon\" iconType=\"styled-square\" [icon]=\"_icon\" size=\"lg\" [iconType]=\"_iconType\" [iconClass]=\"_iconClass\"></seam-icon>\n      <span *ngIf=\"_srOnly\" class=\"sr-only\">{{ _srOnly }}</span>\n    </button>\n  </div>\n</ng-container>\n",
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                styles: [":host.datatable-cell-type ::ng-deep .seam-icon--img{max-height:40px}:host.datatable-cell-type a{max-height:40px}:host.datatable-cell-type button{max-height:40px}:host:not(.datatable-cell-type) ::ng-deep .seam-icon--img{max-height:20px}:host:not(.datatable-cell-type) a{max-height:20px}:host:not(.datatable-cell-type) button{max-height:20px}.datatable-icon-fix{margin-top:calc(-1px - .75rem);height:calc(50px)}"]
+            },] }
+];
+TableCellTypeIconComponent.ctorParameters = () => [
+    { type: ChangeDetectorRef },
+    { type: TableCellTypesHelpersService },
+    { type: DatatableComponent, decorators: [{ type: Optional }] },
+    { type: TableComponent, decorators: [{ type: Optional }] },
+    { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [TABLE_CELL_DATA,] }] }
+];
+TableCellTypeIconComponent.propDecorators = {
+    value: [{ type: Input }],
+    config: [{ type: Input }],
+    _isDatatable: [{ type: HostBinding, args: ['class.datatable-cell-type',] }]
+};
+
+class TableCellTypePhoneComponent {
+    constructor(_cdf, _tableData) {
+        this._cdf = _cdf;
+        /** @ignore */
+        this._ngUnsubscribe = new Subject();
+        /** @ignore */
+        this._format = THESEAM_DEFAULT_PHONE_NUMBER_FORMAT;
+        const _data = _tableData;
+        this.value = _data && _data.value;
+        if (_data && _data.colData && _data.colData.cellTypeConfig && hasProperty(_data.colData.cellTypeConfig, 'format')) {
+            this.format = _data.colData.cellTypeConfig.format;
+        }
+        if (_data) {
+            _data.changed
+                .pipe(takeUntil(this._ngUnsubscribe))
+                .subscribe(v => {
+                if (v.changes.hasOwnProperty('value')) {
+                    this.value = v.changes.value.currentValue;
+                    this._cdf.markForCheck();
+                }
+                if (v.changes.hasOwnProperty('colData')) {
+                    const colData = v.changes.colData.currentValue;
+                    if (colData && hasProperty(colData, 'cellTypeConfig') &&
+                        hasProperty(colData.cellTypeConfig, 'format') &&
+                        colData.cellTypeConfig.format !== this.format) {
+                        this.format = colData.cellTypeConfig.format;
+                    }
+                    else {
+                        this.format = THESEAM_DEFAULT_PHONE_NUMBER_FORMAT;
+                    }
+                    this._cdf.markForCheck();
+                }
+            });
+        }
+    }
+    set format(value) { this._format = coercePhoneNumberFormat(value); }
+    get format() { return this._format; }
+    ngOnInit() { }
+    ngOnDestroy() {
+        this._ngUnsubscribe.next();
+        this._ngUnsubscribe.complete();
+    }
+}
+TableCellTypePhoneComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'seam-table-cell-type-phone',
+                template: "<ng-container *ngIf=\"((value || '') | phoneNumber: _format) as num\">\n  <div class=\"td-text-truncate\" [title]=\"num\">\n    {{ num }}\n  </div>\n</ng-container>\n<!-- <div class=\"td-text-truncate\" [title]=\"value | phoneNumber: _format\">\n  {{ value | date: format || 'yyyy-MM-dd h:mm aaa' }}\n</div> -->\n",
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                styles: [""]
+            },] }
+];
+TableCellTypePhoneComponent.ctorParameters = () => [
+    { type: ChangeDetectorRef },
+    { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [TABLE_CELL_DATA,] }] }
+];
+TableCellTypePhoneComponent.propDecorators = {
+    value: [{ type: Input }],
+    format: [{ type: Input }]
+};
+
+class TableCellTypeProgressCircleIconComponent {
+    constructor(_cdf, _tableCellTypeHelpers, _tableData) {
+        this._cdf = _cdf;
+        this._tableCellTypeHelpers = _tableCellTypeHelpers;
+        this._ngUnsubscribe = new Subject();
+        this.displayIcon = false;
+        const tableData = _tableData;
+        this.value = tableData && tableData.value;
+        this.row = tableData && tableData.row;
+        this.rowIndex = tableData && tableData.rowIndex;
+        this.colData = tableData && tableData.colData;
+        this._setIcon(tableData);
+        if (tableData) {
+            tableData.changed
+                .pipe(takeUntil(this._ngUnsubscribe))
+                .subscribe(v => {
+                if (v.changes.hasOwnProperty('value')) {
+                    this.value = v.changes.value.currentValue;
+                    this._setIcon(tableData);
+                    this._cdf.markForCheck();
+                }
+                if (v.changes.hasOwnProperty('colData')) {
+                    this.colData = v.changes.colData.currentValue;
+                    this._setIcon(tableData);
+                    this._cdf.markForCheck();
+                }
+                else {
+                    if (v.changes.hasOwnProperty('row')) {
+                        this._setIcon(tableData);
+                        this._cdf.markForCheck();
+                    }
+                }
+            });
+        }
+    }
+    _setIcon(tableData) {
+        if (tableData &&
+            tableData.colData &&
+            tableData.colData.cellTypeConfig &&
+            tableData.colData.cellTypeConfig.displayIcon &&
+            tableData.colData.cellTypeConfig.icon &&
+            this._parseConfigValue(tableData.colData.cellTypeConfig.displayIcon, tableData) &&
+            this._parseConfigValue(tableData.colData.cellTypeConfig.icon, tableData)) {
+            this.icon = this._parseConfigValue(tableData.colData.cellTypeConfig.icon, tableData);
+            this.displayIcon = this._parseConfigValue(tableData.colData.cellTypeConfig.displayIcon, tableData);
+        }
+    }
+    _parseConfigValue(val, tableData) {
+        const contextFn = () => this._tableCellTypeHelpers.getValueContext(val, tableData);
+        return this._tableCellTypeHelpers.parseValueProp(val, contextFn);
+    }
+    ngOnInit() { }
+    ngOnDestroy() {
+        this._ngUnsubscribe.next();
+        this._ngUnsubscribe.complete();
+    }
+}
+TableCellTypeProgressCircleIconComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'seam-table-cell-type-progress-circle-icon',
+                template: "<seam-table-cell-type-selector\n  *ngIf=\"displayIcon; else progressCircle\"\n  type=\"icon\"\n  [value]=\"icon\"\n  [rowIndex]=\"rowIndex\"\n  [row]=\"row\"\n  [colData]=\"colData\"></seam-table-cell-type-selector>\n<ng-template #progressCircle>\n  <seam-table-cell-type-selector\n    type=\"progress-circle\"\n    [value]=\"value\"\n    [rowIndex]=\"rowIndex\"\n    [row]=\"row\"\n    [colData]=\"colData\"></seam-table-cell-type-selector>\n</ng-template>\n",
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                styles: [""]
+            },] }
+];
+TableCellTypeProgressCircleIconComponent.ctorParameters = () => [
+    { type: ChangeDetectorRef },
+    { type: TableCellTypesHelpersService },
+    { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [TABLE_CELL_DATA,] }] }
+];
+TableCellTypeProgressCircleIconComponent.propDecorators = {
+    value: [{ type: Input }]
+};
+
+class TableCellTypeProgressCircleComponent {
+    constructor(_cdf, _tableCellTypeHelpers, _datatable, _table, _tableData) {
+        this._cdf = _cdf;
+        this._tableCellTypeHelpers = _tableCellTypeHelpers;
+        this._datatable = _datatable;
+        this._table = _table;
+        this._ngUnsubscribe = new Subject();
+        this.fillBackground = false;
+        this.showText = false;
+        this.hiddenOnEmpty = true;
+        this.pending = false;
+        this._tooltipDisabled = false;
+        this._linkClass = ''; // TODO: Decide if this makes sense
+        this._tplType = 'default';
+        this._isDatatable = false;
+        if (_datatable) {
+            this._isDatatable = true;
+        }
+        const tableData = _tableData;
+        this._tableCellData = _tableData;
+        this.value = tableData && coerceNumberProperty(tableData.value);
+        this.colData = tableData && tableData.colData;
+        if (this.colData && this.colData.cellTypeConfig) {
+            this._setCellTypeConfigProps(this.colData.cellTypeConfig);
+        }
+        if (tableData) {
+            tableData.changed
+                .pipe(takeUntil(this._ngUnsubscribe))
+                .subscribe(v => {
+                var _a;
+                if (v.changes.hasOwnProperty('value')) {
+                    this.value = coerceNumberProperty(v.changes.value.currentValue);
+                    if (this._config) {
+                        this._setCellTypeConfigProps(this._config);
+                    }
+                    this._cdf.markForCheck();
+                }
+                if (v.changes.hasOwnProperty('colData')) {
+                    this.colData = v.changes.colData.currentValue;
+                    if (this.colData && this.colData.cellTypeConfig) {
+                        this._setCellTypeConfigProps(this.colData.cellTypeConfig);
+                    }
+                    this._cdf.markForCheck();
+                }
+                else {
+                    if (v.changes.hasOwnProperty('row')) {
+                        if ((_a = this.colData) === null || _a === void 0 ? void 0 : _a.cellTypeConfig) {
+                            this._setCellTypeConfigProps(this.colData.cellTypeConfig);
+                            this._cdf.markForCheck();
+                        }
+                    }
+                }
+            });
+        }
+    }
+    ngOnInit() { }
+    ngOnDestroy() {
+        this._ngUnsubscribe.next();
+        this._ngUnsubscribe.complete();
+    }
+    _parseConfigValue(val) {
+        const contextFn = () => this._tableCellTypeHelpers.getValueContext(val, this._tableCellData);
+        return this._tableCellTypeHelpers.parseValueProp(val, contextFn);
+    }
+    setAction(configAction) {
+        let newTplType = 'default';
+        let link;
+        let download = false;
+        let detectMimeContent = false;
+        let target;
+        let queryParams;
+        if (configAction) {
+            if (configAction.type === 'link') {
+                link = this._parseConfigValue(configAction.link);
+                if (link !== undefined && link !== null) {
+                    newTplType = this._parseConfigValue(configAction.asset)
+                        ? 'link-encrypted'
+                        : this._parseConfigValue(configAction.external) ? 'link-external' : 'link';
+                    download = !!this._parseConfigValue(configAction.download);
+                    detectMimeContent = !!this._parseConfigValue(configAction.detectMimeContent);
+                    target = this._parseConfigValue(configAction.target);
+                    queryParams = this._parseConfigValue(configAction.queryParams);
+                }
+            }
+            else if (configAction.type === 'modal') {
+                newTplType = 'button';
+                this._buttonAction = configAction;
+            }
+        }
+        this._tplType = newTplType;
+        this._link = link;
+        this._download = download;
+        this._detectMimeContent = detectMimeContent;
+        this._target = target;
+        this._queryParams = queryParams;
+    }
+    _setCellTypeConfigProps(config) {
+        this._config = config;
+        this.setAction(config.action);
+        this.fillBackground = coerceBooleanProperty(this._parseConfigValue(config.fillBackground));
+        this.showText = coerceBooleanProperty(this._parseConfigValue(config.showText));
+        this.hiddenOnEmpty = coerceBooleanProperty(this._parseConfigValue(config.hiddenOnEmpty));
+        this.pending = coerceBooleanProperty(this._parseConfigValue(config.pending));
+        this.tooltip = this._parseConfigValue(config.tooltip);
+        this.tooltip = this._parseConfigValue(config.tooltip);
+        if (this.tooltip) {
+            this.tooltipClass = this._parseConfigValue(config.tooltipClass);
+            this.tooltipPlacement = this._parseConfigValue(config.tooltipPlacement) || 'auto';
+            this.tooltipContainer = this._parseConfigValue(config.tooltipContainer);
+            this._tooltipDisabled = false;
+        }
+        else {
+            this._tooltipDisabled = true;
+        }
+        this._title = this._parseConfigValue(config.titleAttr);
+        this._srOnly = this._parseConfigValue(config.srOnly);
+    }
+    _doButtonAction() {
+        if (this._buttonAction && this._buttonAction.type === 'modal') {
+            const contextFn = () => this._tableCellTypeHelpers.getValueContext(this.value, this._tableCellData);
+            this._tableCellTypeHelpers.handleModalAction(this._buttonAction, contextFn)
+                .subscribe(r => { }, err => console.error(err), () => this._actionRefreshRequest());
+        }
+    }
+    _actionRefreshRequest() {
+        if (this._datatable) {
+            this._datatable.triggerActionRefreshRequest();
+        }
+        else if (this._table) {
+            this._table.triggerActionRefreshRequest();
+        }
+    }
+}
+TableCellTypeProgressCircleComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'seam-table-cell-type-progress-circle',
+                template: "<ng-container *ngIf=\"!_tplType || _tplType === 'default'\">\n  <ng-template [ngTemplateOutlet]=\"progressCircleTpl\"></ng-template>\n</ng-container>\n\n<ng-container *ngIf=\"_tplType === 'link'\">\n  <a class=\"d-block m-auto{{ _linkClass ? ' ' + _linkClass : '' }}\"\n    [routerLink]=\"_link\"\n    [queryParams]=\"_queryParams\"\n    [attr.title]=\"_tooltipDisabled ? _title : undefined\"\n    [attr.target]=\"_target\">\n    <ng-template [ngTemplateOutlet]=\"progressCircleTpl\"></ng-template>\n\n  </a>\n</ng-container>\n\n<ng-container *ngIf=\"_tplType === 'link-external'\"\n  class=\"d-flex align-items-center justify-center\"\n  [class.datatable-icon-fix]=\"_isDatatable\">\n  <a class=\"d-block m-auto{{ _linkClass ? ' ' + _linkClass : '' }}\"\n    [attr.href]=\"_link\"\n    [attr.title]=\"_tooltipDisabled ? _title : undefined\"\n    [attr.target]=\"_target\">\n    <ng-template [ngTemplateOutlet]=\"progressCircleTpl\"></ng-template>\n  </a>\n</ng-container>\n\n<ng-container *ngIf=\"_tplType === 'link-encrypted'\"\n  class=\"d-flex align-items-center justify-center\"\n  [class.datatable-icon-fix]=\"_isDatatable\">\n  <button\n    class=\"btn btn-link p-0 m-auto{{ _linkClass ? ' ' + _linkClass : '' }}\"\n    type=\"button\"\n    [seamEncryptedAssetLink]=\"_link\"\n    [seamDetectMimeFromContent]=\"_detectMimeContent\"\n    [seamDownloadAsset]=\"_download\"\n    [attr.title]=\"_tooltipDisabled ? _title : undefined\">\n    <ng-template [ngTemplateOutlet]=\"progressCircleTpl\"></ng-template>\n  </button>\n</ng-container>\n\n<ng-container *ngIf=\"_tplType === 'button'\"\n  class=\"d-flex align-items-center justify-center\"\n  [class.datatable-icon-fix]=\"_isDatatable\"\n  (click)=\"_doButtonAction()\">\n  <button\n    class=\"btn btn-link p-0 m-auto{{ _linkClass ? ' ' + _linkClass : '' }}\"\n    type=\"button\"\n    [attr.title]=\"_tooltipDisabled ? _title : undefined\">\n    <ng-template [ngTemplateOutlet]=\"progressCircleTpl\"></ng-template>\n  </button>\n</ng-container>\n\n<ng-template #progressCircleTpl>\n  <div class=\"progress-circle-wrapper\">\n    <seam-progress-circle\n      class=\"progress-circle\"\n      [fillBackground]=\"fillBackground\"\n      [showText]=\"showText\"\n      [hiddenOnEmpty]=\"hiddenOnEmpty\"\n      [percentage]=\"$any(value)\"\n      [pending]=\"pending\"\n      [ngbTooltip]=\"tooltip\"\n      [tooltipClass]=\"$any(tooltipClass)\"\n      [placement]=\"$any(tooltipPlacement)\"\n      [container]=\"$any(tooltipContainer)\">\n    </seam-progress-circle>\n    <span *ngIf=\"_srOnly\" class=\"sr-only\">{{ _srOnly }}</span>\n  </div>\n</ng-template>\n",
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                styles: [":host.datatable-cell-type .progress-circle-wrapper{max-height:25px}:host.datatable-cell-type .progress-circle{position:relative;width:25px;height:25px;margin:0 auto}:host.datatable-cell-type .progress-circle ::ng-deep .seam-progress-circle{padding:0}:host:not(.datatable-cell-type) .progress-circle-wrapper{height:22px;max-height:22px}:host:not(.datatable-cell-type) .progress-circle{position:relative;width:25px;height:25px;margin:calc(-.03rem) auto 0}:host:not(.datatable-cell-type) .progress-circle ::ng-deep .seam-progress-circle{padding:0}"]
+            },] }
+];
+TableCellTypeProgressCircleComponent.ctorParameters = () => [
+    { type: ChangeDetectorRef },
+    { type: TableCellTypesHelpersService },
+    { type: DatatableComponent, decorators: [{ type: Optional }] },
+    { type: TableComponent, decorators: [{ type: Optional }] },
+    { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [TABLE_CELL_DATA,] }] }
+];
+TableCellTypeProgressCircleComponent.propDecorators = {
+    value: [{ type: Input }],
+    _isDatatable: [{ type: HostBinding, args: ['class.datatable-cell-type',] }]
+};
+
+class TableCellTypeStringComponent {
+    constructor(_cdf, _tableCellTypeHelpers, _datatable, _table, _tableData) {
+        this._cdf = _cdf;
+        this._tableCellTypeHelpers = _tableCellTypeHelpers;
+        this._datatable = _datatable;
+        this._table = _table;
+        this._tableData = _tableData;
+        this._ngUnsubscribe = new Subject();
+        this._tplType = 'default';
+        this.canPopover = false;
+        const _data = _tableData;
+        this._tableCellData = _tableData;
+        this._row = _data && _data.row;
+        this._rowIndex = _data && _data.rowIndex;
+        this.value = _data && _data.value;
+        this._colData = _data && _data.colData;
+        if (_data && _data.colData && _data.colData.cellTypeConfig) {
+            this.config = _data.colData.cellTypeConfig;
+        }
+    }
+    get value() { return this._value; }
+    set value(val) {
+        this._value = val;
+        // TODO: This is temporary to test the feature and will be fixed when the
+        // dynamic column data is fixed. The plan is to add a config toggle to
+        // always enable and depending on performance it could try to decide on its
+        // own based on content size.
+        if (this.value && this.value.length > 30) {
+            this.canPopover = true;
+        }
+    }
+    get config() { return this._config; }
+    set config(value) {
+        this._config = value;
+        if (value) {
+            this.setAction(value.action);
+        }
+    }
+    set title(value) { this.title = value; }
+    get title() { return this._title; }
+    get _titleAttr() { return this.title || this.value; }
+    ngOnInit() {
+        const _data = this._tableData;
+        if (_data) {
+            _data.changed
+                .pipe(takeUntil(this._ngUnsubscribe))
+                .subscribe(v => {
+                if (v.changes.hasOwnProperty('value')) {
+                    this.value = v.changes.value.currentValue;
+                    this._cdf.markForCheck();
+                }
+                if (v.changes.hasOwnProperty('colData')) {
+                    const colData = v.changes.colData.currentValue;
+                    if (colData && colData.cellTypeConfig !== this.config) {
+                        this.config = colData.cellTypeConfig;
+                    }
+                    else {
+                        this.config = undefined;
+                    }
+                    this._cdf.markForCheck();
+                }
+                else {
+                    if (v.changes.hasOwnProperty('row')) {
+                        this.config = this.config;
+                        this._cdf.markForCheck();
+                    }
+                }
+            });
+        }
+    }
+    ngOnDestroy() {
+        this._ngUnsubscribe.next();
+        this._ngUnsubscribe.complete();
+    }
+    setAction(configAction) {
+        let newTplType = 'default';
+        let link;
+        let download = false;
+        let detectMimeContent = false;
+        let queryParams;
+        if (configAction) {
+            if (configAction.type === 'link') {
+                link = this._parseConfigValue(configAction.link);
+                if (link !== undefined && link !== null) {
+                    newTplType = this._parseConfigValue(configAction.asset) ? 'link-encrypted' : 'link';
+                    download = !!this._parseConfigValue(configAction.download);
+                    detectMimeContent = !!this._parseConfigValue(configAction.detectMimeContent);
+                    queryParams = this._parseConfigValue(configAction.queryParams);
+                }
+            }
+            else if (configAction.type === 'modal') {
+                newTplType = 'button';
+                this._buttonAction = configAction;
+            }
+        }
+        this._tplType = newTplType;
+        this._link = link;
+        this._download = download;
+        this._detectMimeContent = detectMimeContent;
+        this._queryParams = queryParams;
+    }
+    _parseConfigValue(val) {
+        const contextFn = () => this._tableCellTypeHelpers.getValueContext(val, this._tableCellData);
+        return this._tableCellTypeHelpers.parseValueProp(val, contextFn);
+    }
+    _doButtonAction() {
+        if (this._buttonAction && this._buttonAction.type === 'modal') {
+            const contextFn = () => this._tableCellTypeHelpers.getValueContext(this.value, this._tableCellData);
+            this._tableCellTypeHelpers.handleModalAction(this._buttonAction, contextFn)
+                .subscribe(r => { }, err => console.error(err), () => this._actionRefreshRequest());
+        }
+    }
+    _actionRefreshRequest() {
+        if (this._datatable) {
+            this._datatable.triggerActionRefreshRequest();
+        }
+        else if (this._table) {
+            this._table.triggerActionRefreshRequest();
+        }
+    }
+}
+TableCellTypeStringComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'seam-table-cell-type-string',
+                template: "<ng-template #popoverTpl>\n  {{ value }}\n</ng-template>\n\n<ng-template #noPopover>\n  <div class=\"text-truncate\">\n    {{ value }}\n  </div>\n</ng-template>\n\n<ng-container *ngIf=\"!_tplType || _tplType === 'default'\">\n  <div *ngIf=\"canPopover; else noPopover\" [seamPopover]=\"popoverTpl\">\n    <ng-template [ngTemplateOutlet]=\"noPopover\"></ng-template>\n  </div>\n</ng-container>\n\n\n\n<ng-container *ngIf=\"_tplType === 'link'\">\n  <a class=\"d-block text-body text-decoration-none\"\n    [routerLink]=\"_link\"\n    [queryParams]=\"_queryParams\"\n    [attr.title]=\"_title\">\n    <ng-template [ngTemplateOutlet]=\"noPopover\"></ng-template>\n  </a>\n</ng-container>\n\n<ng-container *ngIf=\"_tplType === 'link-external'\">\n  <a class=\"d-block text-body text-decoration-none\"\n    [attr.href]=\"_link\"\n    [attr.title]=\"_title\">\n    <ng-template [ngTemplateOutlet]=\"noPopover\"></ng-template>\n  </a>\n</ng-container>\n\n<ng-container *ngIf=\"_tplType === 'link-encrypted'\">\n  <button\n    class=\"btn btn-link p-0 d-block text-body text-decoration-none\"\n    type=\"button\"\n    [seamEncryptedAssetLink]=\"_link\"\n    [seamDetectMimeFromContent]=\"_detectMimeContent\"\n    [seamDownloadAsset]=\"_download\"\n    [attr.title]=\"_title\">\n    <ng-template [ngTemplateOutlet]=\"noPopover\"></ng-template>\n  </button>\n</ng-container>\n\n<ng-container *ngIf=\"_tplType === 'button'\">\n  <button\n    class=\"btn btn-link p-0 d-block text-body text-decoration-none\"\n    type=\"button\"\n    [attr.title]=\"_title\"\n    (click)=\"_doButtonAction()\">\n    <ng-template [ngTemplateOutlet]=\"noPopover\"></ng-template>\n  </button>\n</ng-container>\n\n",
+                host: {},
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                styles: [""]
+            },] }
+];
+TableCellTypeStringComponent.ctorParameters = () => [
+    { type: ChangeDetectorRef },
+    { type: TableCellTypesHelpersService },
+    { type: DatatableComponent, decorators: [{ type: Optional }] },
+    { type: TableComponent, decorators: [{ type: Optional }] },
+    { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [TABLE_CELL_DATA,] }] }
+];
+TableCellTypeStringComponent.propDecorators = {
+    value: [{ type: Input }],
+    config: [{ type: Input }],
+    title: [{ type: Input }],
+    _titleAttr: [{ type: HostBinding, args: ['attr.title',] }]
+};
+
+const ɵ0 = {
+    name: 'string',
+    component: TableCellTypeStringComponent
+};
+const TABLE_CELL_TYPE_MANIFEST_STRING = {
+    provide: TABLE_CELL_TYPE_MANIFEST,
+    useValue: ɵ0,
+    multi: true
+};
+const ɵ1 = {
+    name: 'integer',
+    component: TableCellTypeStringComponent
+};
+const TABLE_CELL_TYPE_MANIFEST_INTEGER = {
+    provide: TABLE_CELL_TYPE_MANIFEST,
+    useValue: ɵ1,
+    multi: true
+};
+const ɵ2 = {
+    name: 'decimal',
+    component: TableCellTypeStringComponent
+};
+const TABLE_CELL_TYPE_MANIFEST_DECIMAL = {
+    provide: TABLE_CELL_TYPE_MANIFEST,
+    useValue: ɵ2,
+    multi: true
+};
+const ɵ3 = {
+    name: 'date',
+    component: TableCellTypeDateComponent
+};
+const TABLE_CELL_TYPE_MANIFEST_DATE = {
+    provide: TABLE_CELL_TYPE_MANIFEST,
+    useValue: ɵ3,
+    multi: true
+};
+const ɵ4 = {
+    name: 'icon',
+    component: TableCellTypeIconComponent
+};
+const TABLE_CELL_TYPE_MANIFEST_ICON = {
+    provide: TABLE_CELL_TYPE_MANIFEST,
+    useValue: ɵ4,
+    multi: true
+};
+const ɵ5 = {
+    name: 'image',
+    component: TableCellTypeIconComponent
+};
+const TABLE_CELL_TYPE_MANIFEST_IMAGE = {
+    provide: TABLE_CELL_TYPE_MANIFEST,
+    useValue: ɵ5,
+    multi: true
+};
+const ɵ6 = {
+    name: 'progress-circle',
+    component: TableCellTypeProgressCircleComponent
+};
+const TABLE_CELL_TYPE_MANIFEST_PROGRESS_CIRCLE = {
+    provide: TABLE_CELL_TYPE_MANIFEST,
+    useValue: ɵ6,
+    multi: true
+};
+const ɵ7 = {
+    name: 'progress-circle-icon',
+    component: TableCellTypeProgressCircleIconComponent
+};
+const TABLE_CELL_TYPE_MANIFEST_PROGRESS_CIRCLE_ICON = {
+    provide: TABLE_CELL_TYPE_MANIFEST,
+    useValue: ɵ7,
+    multi: true
+};
+const ɵ8 = {
+    name: 'phone',
+    component: TableCellTypePhoneComponent
+};
+const TABLE_CELL_TYPE_MANIFEST_PHONE = {
+    provide: TABLE_CELL_TYPE_MANIFEST,
+    useValue: ɵ8,
+    multi: true
+};
+
+const cellTypeComponents = [
+    TableCellTypeStringComponent,
+    TableCellTypeDateComponent,
+    TableCellTypeIconComponent,
+    TableCellTypeProgressCircleComponent,
+    TableCellTypeProgressCircleIconComponent,
+    TableCellTypePhoneComponent
+];
+const cellTypeProviders = [
+    TABLE_CELL_TYPE_MANIFEST_STRING,
+    TABLE_CELL_TYPE_MANIFEST_INTEGER,
+    TABLE_CELL_TYPE_MANIFEST_DECIMAL,
+    TABLE_CELL_TYPE_MANIFEST_DATE,
+    TABLE_CELL_TYPE_MANIFEST_ICON,
+    TABLE_CELL_TYPE_MANIFEST_IMAGE,
+    TABLE_CELL_TYPE_MANIFEST_PROGRESS_CIRCLE,
+    TABLE_CELL_TYPE_MANIFEST_PROGRESS_CIRCLE_ICON,
+    TABLE_CELL_TYPE_MANIFEST_PHONE
+];
+class TheSeamTableCellTypesModule {
+}
+TheSeamTableCellTypesModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [
+                    ...cellTypeComponents
+                ],
+                imports: [
+                    CommonModule,
+                    NgbTooltipModule,
+                    RouterModule,
+                    TheSeamSharedModule,
+                    TheSeamIconModule,
+                    PortalModule,
+                    TheSeamPopoverModule,
+                    TheSeamProgressModule,
+                    TheSeamTelInputModule,
+                    TheSeamAssetReaderModule,
+                    TheSeamTableCellTypeModule
+                ],
+                providers: [
+                    ...cellTypeProviders
+                ],
+                exports: [
+                    ...cellTypeComponents
+                ],
+                entryComponents: [
+                    ...cellTypeComponents
+                ]
+            },] }
+];
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { TABLE_CELL_TYPE_MANIFEST_DATE, TABLE_CELL_TYPE_MANIFEST_DECIMAL, TABLE_CELL_TYPE_MANIFEST_ICON, TABLE_CELL_TYPE_MANIFEST_IMAGE, TABLE_CELL_TYPE_MANIFEST_INTEGER, TABLE_CELL_TYPE_MANIFEST_PHONE, TABLE_CELL_TYPE_MANIFEST_PROGRESS_CIRCLE, TABLE_CELL_TYPE_MANIFEST_PROGRESS_CIRCLE_ICON, TABLE_CELL_TYPE_MANIFEST_STRING, TableCellTypeDateComponent, TableCellTypeIconComponent, TableCellTypePhoneComponent, TableCellTypeProgressCircleComponent, TableCellTypeProgressCircleIconComponent, TableCellTypeStringComponent, TheSeamTableCellTypesModule, ɵ0, ɵ1, ɵ2, ɵ3, ɵ4, ɵ5, ɵ6, ɵ7, ɵ8 };
+//# sourceMappingURL=theseam-ui-common-table-cell-types.js.map