npm - @testgorilla/tgo-ui - Versions diffs - 7.11.1 → 7.12.0 - Mend

@testgorilla/tgo-ui 7.11.1 → 7.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (101) hide show

package/fesm2022/testgorilla-tgo-ui-components-side-sheet.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"testgorilla-tgo-ui-components-side-sheet.mjs","sources":["../../../components/side-sheet/side-sheet.service.ts","../../../components/side-sheet/side-sheet.component.ts","../../../components/side-sheet/side-sheet.component.html","../../../components/side-sheet/side-sheet.component.module.ts","../../../components/side-sheet/testgorilla-tgo-ui-components-side-sheet.ts"],"sourcesContent":["import { ApplicationRef, Injectable, ViewContainerRef } from '@angular/core';\nimport { SideSheetConfig } from './side-sheet.model';\nimport { Observable, Subject } from 'rxjs';\n\n@Injectable({\n providedIn: 'root',\n})\nexport class SideSheetService {\n private componentRef$ = new Subject<SideSheetConfig \| null>();\n\n constructor(private applicationRef: ApplicationRef) {}\n\n open<T>(config: SideSheetConfig): T {\n const { componentRef: _componentRef, ...configFields } = config;\n const rootViewContainerRef = this.applicationRef.components[0].injector.get(ViewContainerRef);\n const componentReference = rootViewContainerRef.createComponent(config.componentRef);\n this.componentRef$.next({ ...configFields, componentRef: componentReference });\n return componentReference.instance as T;\n }\n\n close(): void {\n this.componentRef$.next(null);\n }\n\n getComponentRef(): Observable<SideSheetConfig \| null> {\n return this.componentRef$.asObservable();\n }\n}\n","import {\n Component,\n DestroyRef,\n EventEmitter,\n HostListener,\n Inject,\n Input,\n OnInit,\n Optional,\n Output,\n ViewChild,\n ViewContainerRef,\n} from '@angular/core';\nimport { SideSheetService } from './side-sheet.service';\nimport { SideSheetConfig, SideSheetPosition } from './side-sheet.model';\nimport { MatDrawer } from '@angular/material/sidenav';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\n\n@Component({\n selector: 'ui-side-sheet',\n templateUrl: './side-sheet.component.html',\n styleUrls: ['./side-sheet.component.scss'],\n standalone: false,\n})\nexport class SideSheetComponent implements OnInit {\n /*\n Set position. Defaults \"end\"\n \n @type {SideSheetPosition}\n * @memberof SideSheetComponent\n /\n @Input() position: SideSheetPosition = 'end';\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof SideSheetComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n @Output() openChange = new EventEmitter<boolean>();\n\n @ViewChild('drawer') drawer: MatDrawer;\n @ViewChild('container', { read: ViewContainerRef, static: false }) container: ViewContainerRef;\n\n @HostListener('keydown.esc', ['$event'])\n onEscPress(_event: KeyboardEvent): void {\n void this.drawer.close();\n }\n\n protected title = '';\n protected showBackButton = false;\n protected showTitleTooltip = false;\n protected showLogo = false;\n protected componentRef$ = this.sideSheetService.getComponentRef();\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme,\n private sideSheetService: SideSheetService,\n private destroyRef: DestroyRef\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n }\n\n ngOnInit(): void {\n this.setComponentRef();\n }\n\n private setComponentRef(): void {\n this.componentRef$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(config => {\n if (config && config.componentRef && this.container && this.drawer) {\n this.setConfig(config);\n this.drawer.toggle();\n this.container.clear();\n this.container.insert(config.componentRef.hostView);\n } else if (!config) {\n this.drawer.toggle();\n this.container.clear();\n }\n });\n }\n\n private setConfig(config: SideSheetConfig): void {\n this.title = config.title ?? '';\n this.showLogo = config.showLogo ?? false;\n this.showBackButton = config.showBackButton ?? false;\n this.showTitleTooltip = config.showTitleTooltip ?? false;\n\n if (config.closed) {\n config.closed.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => {\n void this.drawer.close();\n });\n }\n }\n\n protected onClose(): void {\n this.drawer.toggle();\n }\n\n onOpenChange(isOpened: boolean): void {\n this.openChange.emit(isOpened);\n }\n}\n","<ng-container>\n <mat-drawer-container class=\"side-sheet-container\" [attr.theme]=\"applicationTheme\" [hasBackdrop]=\"true\">\n <mat-drawer\n (closedStart)=\"onOpenChange(false)\"\n (openedStart)=\"onOpenChange(true)\"\n #drawer\n [mode]=\"'over'\"\n [autoFocus]=\"false\"\n class=\"side-sheet-content\"\n [position]=\"position\"\n >\n <div class=\"header\">\n <div class=\"title\">\n <ui-button\n ngIf=\"showBackButton\"\n [variant]=\"'icon-button'\"\n [iconName]=\"applicationTheme === 'classic' ? 'Arrow_left' : 'Arrow-chevron-left-filled'\"\n [companyColor]=\"applicationTheme === 'classic' ? '#000' : '#242424'\"\n [applicationTheme]=\"applicationTheme\"\n [tooltip]=\"('COMMON.BACK' \| uiTranslate \| async)!\"\n (click)=\"onClose()\"\n ></ui-button>\n <span ngIf=\"title\" [matTooltip]=\"showTitleTooltip ? title : ''\" [matTooltipClass]=\"applicationTheme\">{{\n title\n }}</span>\n <ui-logo ngIf=\"showLogo\"></ui-logo>\n </div>\n <ui-button\n [variant]=\"'icon-button'\"\n [iconName]=\"'Close'\"\n [companyColor]=\"applicationTheme === 'classic' ? '#000' : '#242424'\"\n [applicationTheme]=\"applicationTheme\"\n [tooltip]=\"('COMMON.CLOSE' \| uiTranslate \| async)!\"\n (click)=\"onClose()\"\n ></ui-button>\n </div>\n <ng-container #container></ng-container>\n </mat-drawer>\n <mat-drawer-content>\n <ng-content></ng-content>\n </mat-drawer-content>\n </mat-drawer-container>\n</ng-container>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { SideSheetComponent } from './side-sheet.component';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { MatSidenavModule } from '@angular/material/sidenav';\nimport { UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { LogoComponentModule } from '@testgorilla/tgo-ui/components/logo';\n\n@NgModule({\n declarations: [SideSheetComponent],\n exports: [SideSheetComponent],\n imports: [\n CommonModule,\n IconComponentModule,\n ButtonComponentModule,\n MatTooltipModule,\n MatSidenavModule,\n UiTranslatePipe,\n LogoComponentModule,\n ],\n})\nexport class SideSheetComponentModule {}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":["i1.SideSheetService"],"mappings":"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"}
1	+ {"version":3,"file":"testgorilla-tgo-ui-components-side-sheet.mjs","sources":["../../../components/side-sheet/side-sheet.service.ts","../../../components/side-sheet/side-sheet.component.ts","../../../components/side-sheet/side-sheet.component.html","../../../components/side-sheet/side-sheet.component.module.ts","../../../components/side-sheet/testgorilla-tgo-ui-components-side-sheet.ts"],"sourcesContent":["import { ApplicationRef, Injectable, ViewContainerRef } from '@angular/core';\nimport { SideSheetConfig } from './side-sheet.model';\nimport { Observable, Subject } from 'rxjs';\n\n@Injectable({\n providedIn: 'root',\n})\nexport class SideSheetService {\n private componentRef$ = new Subject<SideSheetConfig \| null>();\n\n constructor(private applicationRef: ApplicationRef) {}\n\n open<T>(config: SideSheetConfig): T {\n const { componentRef: _componentRef, ...configFields } = config;\n const rootViewContainerRef = this.applicationRef.components[0].injector.get(ViewContainerRef);\n const componentReference = rootViewContainerRef.createComponent(config.componentRef);\n this.componentRef$.next({ ...configFields, componentRef: componentReference });\n return componentReference.instance as T;\n }\n\n close(): void {\n this.componentRef$.next(null);\n }\n\n getComponentRef(): Observable<SideSheetConfig \| null> {\n return this.componentRef$.asObservable();\n }\n}\n","import {\n Component,\n DestroyRef,\n EventEmitter,\n HostListener,\n Inject,\n Input,\n OnInit,\n Optional,\n Output,\n ViewChild,\n ViewContainerRef,\n} from '@angular/core';\nimport { SideSheetService } from './side-sheet.service';\nimport { SideSheetConfig, SideSheetPosition } from './side-sheet.model';\nimport { MatDrawer } from '@angular/material/sidenav';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\n\n@Component({\n selector: 'ui-side-sheet',\n templateUrl: './side-sheet.component.html',\n styleUrls: ['./side-sheet.component.scss'],\n standalone: false,\n})\nexport class SideSheetComponent implements OnInit {\n /*\n Set position. Defaults \"end\"\n \n @type {SideSheetPosition}\n * @memberof SideSheetComponent\n /\n @Input() position: SideSheetPosition = 'end';\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof SideSheetComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n @Output() openChange = new EventEmitter<boolean>();\n\n @ViewChild('drawer') drawer: MatDrawer;\n @ViewChild('container', { read: ViewContainerRef, static: false }) container: ViewContainerRef;\n\n @HostListener('keydown.esc', ['$event'])\n onEscPress(_event: KeyboardEvent): void {\n void this.drawer.close();\n }\n\n protected title = '';\n protected showBackButton = false;\n protected showTitleTooltip = false;\n protected showLogo = false;\n protected componentRef$ = this.sideSheetService.getComponentRef();\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme,\n private sideSheetService: SideSheetService,\n private destroyRef: DestroyRef\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n }\n\n ngOnInit(): void {\n this.setComponentRef();\n }\n\n private setComponentRef(): void {\n this.componentRef$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(config => {\n if (config && config.componentRef && this.container && this.drawer) {\n this.setConfig(config);\n this.drawer.toggle();\n this.container.clear();\n this.container.insert(config.componentRef.hostView);\n } else if (!config) {\n this.drawer.toggle();\n this.container.clear();\n }\n });\n }\n\n private setConfig(config: SideSheetConfig): void {\n this.title = config.title ?? '';\n this.showLogo = config.showLogo ?? false;\n this.showBackButton = config.showBackButton ?? false;\n this.showTitleTooltip = config.showTitleTooltip ?? false;\n\n if (config.closed) {\n config.closed.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => {\n void this.drawer.close();\n });\n }\n }\n\n protected onClose(): void {\n this.drawer.toggle();\n }\n\n onOpenChange(isOpened: boolean): void {\n this.openChange.emit(isOpened);\n }\n}\n","<ng-container>\n <mat-drawer-container class=\"side-sheet-container\" [attr.theme]=\"applicationTheme\" [hasBackdrop]=\"true\">\n <mat-drawer\n (closedStart)=\"onOpenChange(false)\"\n (openedStart)=\"onOpenChange(true)\"\n #drawer\n [mode]=\"'over'\"\n [autoFocus]=\"false\"\n class=\"side-sheet-content\"\n [position]=\"position\"\n >\n <div class=\"header\">\n <div class=\"title\">\n <ui-button\n ngIf=\"showBackButton\"\n [variant]=\"'icon-button'\"\n [iconName]=\"applicationTheme === 'classic' ? 'Arrow_left' : 'Arrow-chevron-left-filled'\"\n [companyColor]=\"applicationTheme === 'classic' ? '#000' : '#242424'\"\n [applicationTheme]=\"applicationTheme\"\n [tooltip]=\"('COMMON.BACK' \| uiTranslate \| async)!\"\n (click)=\"onClose()\"\n ></ui-button>\n <span ngIf=\"title\" [matTooltip]=\"showTitleTooltip ? title : ''\" [matTooltipClass]=\"applicationTheme\">{{\n title\n }}</span>\n <ui-logo ngIf=\"showLogo\"></ui-logo>\n </div>\n <ui-button\n [variant]=\"'icon-button'\"\n [iconName]=\"'Close'\"\n [companyColor]=\"applicationTheme === 'classic' ? '#000' : '#242424'\"\n [applicationTheme]=\"applicationTheme\"\n [tooltip]=\"('COMMON.CLOSE' \| uiTranslate \| async)!\"\n (click)=\"onClose()\"\n ></ui-button>\n </div>\n <ng-container #container></ng-container>\n </mat-drawer>\n <mat-drawer-content>\n <ng-content></ng-content>\n </mat-drawer-content>\n </mat-drawer-container>\n</ng-container>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { SideSheetComponent } from './side-sheet.component';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { MatSidenavModule } from '@angular/material/sidenav';\nimport { UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { LogoComponentModule } from '@testgorilla/tgo-ui/components/logo';\n\n@NgModule({\n declarations: [SideSheetComponent],\n exports: [SideSheetComponent],\n imports: [\n CommonModule,\n IconComponentModule,\n ButtonComponentModule,\n MatTooltipModule,\n MatSidenavModule,\n UiTranslatePipe,\n LogoComponentModule,\n ],\n})\nexport class SideSheetComponentModule {}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":["i1.SideSheetService"],"mappings":"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"}

package/fesm2022/testgorilla-tgo-ui-components-snackbar.mjs CHANGED Viewed

@@ -173,7 +173,7 @@ class SnackbarComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SnackbarComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }, { token: MAT_SNACK_BAR_DATA }, { token: i1.MatSnackBarRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: SnackbarComponent, isStandalone: false, selector: "ui-snackbar", inputs: { snackbarType: "snackbarType", message: "message", html: "html", seconds: "seconds", includeDismissButton: "includeDismissButton", fixed: "fixed", linkText: "linkText", linkUrl: "linkUrl", linkTarget: "linkTarget", variant: "variant", applicationTheme: "applicationTheme", closeButtonTooltip: "closeButtonTooltip", ariaDescribedby: "ariaDescribedby" }, ngImport: i0, template: "<ng-container>\n  <div\n    [ngClass]=\"snackbarType + ' ' + position\"\n    [@openClose]\n    *ngIf=\"visible\"\n    class=\"snackbar-container\"\n    [attr.theme]=\"applicationTheme\"\n    [class.mobile]=\"variant === 'mobile'\"\n    [class.desktop]=\"variant === 'desktop'\"\n    (mouseenter)=\"onMouseEnter()\"\n    (mouseleave)=\"onMouseLeave()\"\n    data-testid=\"snackbar-wrapper\"\n    [attr.data-test-snackbar-type]=\"snackbarType\"\n    [attr.aria-describedby]=\"'describedby'\"\n    role=\"alert\"\n    [attr.aria-labelledby]=\"'labelledby'\"\n  >\n    <span style=\"position: absolute; left: -9999px\" id=\"labelledby\">{{\n      'ALERT_BANNER.' + (snackbarType | uppercase) | uiTranslate | async\n    }}</span>\n    <span style=\"position: absolute; left: -9999px\"\n      >{{ message }}\n      <a *ngIf=\"!!linkText\" [target]=\"linkTarget\" [href]=\"linkUrl\" (click)=\"onLinkClick($event)\">{{ linkText }}</a>\n    </span>\n    <span [style.display]=\"'none'\" id=\"describedby\">{{ ariaDescribedby }}</span>\n    <div\n      aria-hidden=\"true\"\n      class=\"snackbar-text\"\n      [matTooltip]=\"message.length > maxCharacters ? message : ''\"\n      data-testid=\"snackbar-content\"\n    >\n      <ui-icon *ngIf=\"applicationTheme === 'classic'\" [name]=\"iconName\" size=\"24\"></ui-icon>\n      {{ message.length > maxCharacters ? (message | slice: 0 : maxCharacters) + '..' : message }}\n      <div *ngIf=\"safeHtml\" [innerHTML]=\"safeHtml\"></div>\n      <a *ngIf=\"!!linkText\" [target]=\"linkTarget\" [href]=\"linkUrl\" (click)=\"onLinkClick($event)\">{{ linkText }}</a>\n    </div>\n    <ui-button\n      *ngIf=\"includeDismissButton && applicationTheme === 'classic'\"\n      variant=\"text\"\n      [label]=\"(translationContext + 'DISMISS' | uiTranslate | async)!\"\n      [applicationTheme]=\"applicationTheme !== 'classic' ? 'light' : 'classic'\"\n      (buttonClickEvent)=\"dismissClick()\"\n      data-testid=\"snackbar-dismiss-button\"\n    ></ui-button>\n    <ui-button\n      *ngIf=\"includeDismissButton && applicationTheme !== 'classic'\"\n      [variant]=\"'icon-button'\"\n      [applicationTheme]=\"'light'\"\n      [iconName]=\"'Close-in-line'\"\n      [size]=\"'small'\"\n      [tooltip]=\"(closeButtonTooltip || ('COMMON.CLOSE' | uiTranslate | async))!\"\n      (click)=\"dismissClick()\"\n      data-testid=\"snackbar-dismiss-button\"\n    ></ui-button>\n  </div>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host{display:flex;width:100%;justify-content:center}:host .snackbar-container{max-width:600px}:host .alert-container,:host .snackbar-container{margin:0 auto;display:flex;padding:0 14px;border-radius:4px;align-items:center;justify-content:space-between;opacity:1;min-height:48px}:host .alert-container.fixed,:host .snackbar-container.fixed{position:fixed}:host .alert-container.static,:host .snackbar-container.static{position:relative}:host .alert-container ui-icon,:host .snackbar-container ui-icon{margin-right:14px}:host .alert-container ui-button,:host .snackbar-container ui-button{margin-left:14px}:host .alert-container ::ng-deep button.mat-mdc-unelevated-button.big,:host .snackbar-container ::ng-deep button.mat-mdc-unelevated-button.big{padding:0;min-width:auto}:host .alert-container .alert-text,:host .alert-container .snackbar-text,:host .snackbar-container .alert-text,:host .snackbar-container .snackbar-text{display:flex;align-items:center;color:#000}:host .alert-container .alert-text a,:host .alert-container .snackbar-text a,:host .snackbar-container .alert-text a,:host .snackbar-container .snackbar-text a{color:#000;text-decoration:underline;font-weight:700}:host .alert-container .alert-text a:hover,:host .alert-container .alert-text a:visited,:host .alert-container .alert-text a:focus,:host .alert-container .snackbar-text a:hover,:host .alert-container .snackbar-text a:visited,:host .alert-container .snackbar-text a:focus,:host .snackbar-container .alert-text a:hover,:host .snackbar-container .alert-text a:visited,:host .snackbar-container .alert-text a:focus,:host .snackbar-container .snackbar-text a:hover,:host .snackbar-container .snackbar-text a:visited,:host .snackbar-container .snackbar-text a:focus{text-decoration:none}:host .alert-container.success,:host .snackbar-container.success{background-color:#cbd6cb}:host .alert-container.info,:host .snackbar-container.info{background-color:#c8d7de}:host .alert-container.warning,:host .snackbar-container.warning{background-color:#f0d6bb}:host .alert-container.error,:host .snackbar-container.error{background-color:#e3c3c6}:host .alert-container[theme=dark].success,:host .alert-container[theme=light].success,:host .snackbar-container[theme=dark].success,:host .snackbar-container[theme=light].success{background-color:#aae47a}:host .alert-container[theme=dark].info,:host .alert-container[theme=light].info,:host .snackbar-container[theme=dark].info,:host .snackbar-container[theme=light].info{background-color:#d9e8ff}:host .alert-container[theme=dark].warning,:host .alert-container[theme=light].warning,:host .snackbar-container[theme=dark].warning,:host .snackbar-container[theme=light].warning{background-color:#ffe1b3}:host .alert-container[theme=dark].error,:host .alert-container[theme=light].error,:host .snackbar-container[theme=dark].error,:host .snackbar-container[theme=light].error{background-color:#ffac9a}:host .alert-container[theme=dark].ai,:host .alert-container[theme=light].ai,:host .snackbar-container[theme=dark].ai,:host .snackbar-container[theme=light].ai{background-color:#fff2fc;border:1px solid #ffe6fa}::ng-deep .display-none{display:none!important}@media (max-width: 600px){:host .alert-container,:host .snackbar-container{padding:8px 14px}}:host .snackbar-container{bottom:0;z-index:98}:host .snackbar-container[theme=dark] ui-icon,:host .snackbar-container[theme=light] ui-icon{margin-right:10px;cursor:pointer}:host .snackbar-container[theme=dark] .snackbar-text,:host .snackbar-container[theme=light] .snackbar-text{padding-left:10px;margin-right:8px}:host .snackbar-container[theme=dark] .snackbar-text a,:host .snackbar-container[theme=light] .snackbar-text a{margin-left:4px}:host .snackbar-container[theme=dark].desktop,:host .snackbar-container[theme=light].desktop{border-radius:24px;box-shadow:0 4px 16px #2424240a;width:fit-content;max-width:600px;min-height:48px;line-height:1.4;font-size:14px;padding:16px 24px}:host .snackbar-container[theme=dark].mobile,:host .snackbar-container[theme=light].mobile{width:100%;min-width:100%;word-break:break-word}:host .mat-mdc-snack-bar-container{margin:16px 8px}::ng-deep .mdc-snackbar__surface{height:0}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "loadingWithLabel", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: i4.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i2.SlicePipe, name: "slice" }, { kind: "pipe", type: i6.UiTranslatePipe, name: "uiTranslate" }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: SnackbarComponent, isStandalone: false, selector: "ui-snackbar", inputs: { snackbarType: "snackbarType", message: "message", html: "html", seconds: "seconds", includeDismissButton: "includeDismissButton", fixed: "fixed", linkText: "linkText", linkUrl: "linkUrl", linkTarget: "linkTarget", variant: "variant", applicationTheme: "applicationTheme", closeButtonTooltip: "closeButtonTooltip", ariaDescribedby: "ariaDescribedby" }, ngImport: i0, template: "<ng-container>\n  <div\n    [ngClass]=\"snackbarType + ' ' + position\"\n    [@openClose]\n    *ngIf=\"visible\"\n    class=\"snackbar-container\"\n    [attr.theme]=\"applicationTheme\"\n    [class.mobile]=\"variant === 'mobile'\"\n    [class.desktop]=\"variant === 'desktop'\"\n    (mouseenter)=\"onMouseEnter()\"\n    (mouseleave)=\"onMouseLeave()\"\n    data-testid=\"snackbar-wrapper\"\n    [attr.data-test-snackbar-type]=\"snackbarType\"\n    [attr.aria-describedby]=\"'describedby'\"\n    role=\"alert\"\n    [attr.aria-labelledby]=\"'labelledby'\"\n  >\n    <span style=\"position: absolute; left: -9999px\" id=\"labelledby\">{{\n      'ALERT_BANNER.' + (snackbarType | uppercase) | uiTranslate | async\n    }}</span>\n    <span style=\"position: absolute; left: -9999px\"\n      >{{ message }}\n      <a *ngIf=\"!!linkText\" [target]=\"linkTarget\" [href]=\"linkUrl\" (click)=\"onLinkClick($event)\">{{ linkText }}</a>\n    </span>\n    <span [style.display]=\"'none'\" id=\"describedby\">{{ ariaDescribedby }}</span>\n    <div\n      aria-hidden=\"true\"\n      class=\"snackbar-text\"\n      [matTooltip]=\"message.length > maxCharacters ? message : ''\"\n      data-testid=\"snackbar-content\"\n    >\n      <ui-icon *ngIf=\"applicationTheme === 'classic'\" [name]=\"iconName\" size=\"24\"></ui-icon>\n      {{ message.length > maxCharacters ? (message | slice: 0 : maxCharacters) + '..' : message }}\n      <div *ngIf=\"safeHtml\" [innerHTML]=\"safeHtml\"></div>\n      <a *ngIf=\"!!linkText\" [target]=\"linkTarget\" [href]=\"linkUrl\" (click)=\"onLinkClick($event)\">{{ linkText }}</a>\n    </div>\n    <ui-button\n      *ngIf=\"includeDismissButton && applicationTheme === 'classic'\"\n      variant=\"text\"\n      [label]=\"(translationContext + 'DISMISS' | uiTranslate | async)!\"\n      [applicationTheme]=\"applicationTheme !== 'classic' ? 'light' : 'classic'\"\n      (buttonClickEvent)=\"dismissClick()\"\n      data-testid=\"snackbar-dismiss-button\"\n    ></ui-button>\n    <ui-button\n      *ngIf=\"includeDismissButton && applicationTheme !== 'classic'\"\n      [variant]=\"'icon-button'\"\n      [applicationTheme]=\"'light'\"\n      [iconName]=\"'Close-in-line'\"\n      [size]=\"'small'\"\n      [tooltip]=\"(closeButtonTooltip || ('COMMON.CLOSE' | uiTranslate | async))!\"\n      (click)=\"dismissClick()\"\n      data-testid=\"snackbar-dismiss-button\"\n    ></ui-button>\n  </div>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host{display:flex;width:100%;justify-content:center}:host .snackbar-container{max-width:600px}:host .alert-container,:host .snackbar-container{margin:0 auto;display:flex;padding:0 14px;border-radius:4px;align-items:center;justify-content:space-between;opacity:1;min-height:48px}:host .alert-container.fixed,:host .snackbar-container.fixed{position:fixed}:host .alert-container.static,:host .snackbar-container.static{position:relative}:host .alert-container ui-icon,:host .snackbar-container ui-icon{margin-right:14px}:host .alert-container ui-button,:host .snackbar-container ui-button{margin-left:14px}:host .alert-container ::ng-deep button.mat-mdc-unelevated-button.big,:host .snackbar-container ::ng-deep button.mat-mdc-unelevated-button.big{padding:0;min-width:auto}:host .alert-container .alert-text,:host .alert-container .snackbar-text,:host .snackbar-container .alert-text,:host .snackbar-container .snackbar-text{display:flex;align-items:center;color:#000}:host .alert-container .alert-text a,:host .alert-container .snackbar-text a,:host .snackbar-container .alert-text a,:host .snackbar-container .snackbar-text a{color:#000;text-decoration:underline;font-weight:700}:host .alert-container .alert-text a:hover,:host .alert-container .alert-text a:visited,:host .alert-container .alert-text a:focus,:host .alert-container .snackbar-text a:hover,:host .alert-container .snackbar-text a:visited,:host .alert-container .snackbar-text a:focus,:host .snackbar-container .alert-text a:hover,:host .snackbar-container .alert-text a:visited,:host .snackbar-container .alert-text a:focus,:host .snackbar-container .snackbar-text a:hover,:host .snackbar-container .snackbar-text a:visited,:host .snackbar-container .snackbar-text a:focus{text-decoration:none}:host .alert-container.success,:host .snackbar-container.success{background-color:#cbd6cb}:host .alert-container.info,:host .snackbar-container.info{background-color:#c8d7de}:host .alert-container.warning,:host .snackbar-container.warning{background-color:#f0d6bb}:host .alert-container.error,:host .snackbar-container.error{background-color:#e3c3c6}:host .alert-container[theme=dark].success,:host .alert-container[theme=light].success,:host .snackbar-container[theme=dark].success,:host .snackbar-container[theme=light].success{background-color:#aae47a}:host .alert-container[theme=dark].info,:host .alert-container[theme=light].info,:host .snackbar-container[theme=dark].info,:host .snackbar-container[theme=light].info{background-color:#d9e8ff}:host .alert-container[theme=dark].warning,:host .alert-container[theme=light].warning,:host .snackbar-container[theme=dark].warning,:host .snackbar-container[theme=light].warning{background-color:#ffe1b3}:host .alert-container[theme=dark].error,:host .alert-container[theme=light].error,:host .snackbar-container[theme=dark].error,:host .snackbar-container[theme=light].error{background-color:#ffac9a}:host .alert-container[theme=dark].ai,:host .alert-container[theme=light].ai,:host .snackbar-container[theme=dark].ai,:host .snackbar-container[theme=light].ai{background-color:#fff2fc;border:1px solid #ffe6fa}::ng-deep .display-none{display:none!important}@media (max-width: 600px){:host .alert-container,:host .snackbar-container{padding:8px 14px}}:host .snackbar-container{bottom:0;z-index:98}:host .snackbar-container[theme=dark] ui-icon,:host .snackbar-container[theme=light] ui-icon{margin-right:10px;cursor:pointer}:host .snackbar-container[theme=dark] .snackbar-text,:host .snackbar-container[theme=light] .snackbar-text{padding-left:10px;margin-right:8px}:host .snackbar-container[theme=dark] .snackbar-text a,:host .snackbar-container[theme=light] .snackbar-text a{margin-left:4px}:host .snackbar-container[theme=dark].desktop,:host .snackbar-container[theme=light].desktop{border-radius:24px;box-shadow:0 4px 16px #2424240a;width:fit-content;max-width:600px;min-height:48px;line-height:1.4;font-size:14px;padding:16px 24px}:host .snackbar-container[theme=dark].mobile,:host .snackbar-container[theme=light].mobile{width:100%;min-width:100%;word-break:break-word}:host .mat-mdc-snack-bar-container{margin:16px 8px}::ng-deep .mdc-snackbar__surface{height:0}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "loadingWithLabel", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaExpanded", "ariaControls", "ariaPressed", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: i4.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i2.SlicePipe, name: "slice" }, { kind: "pipe", type: i6.UiTranslatePipe, name: "uiTranslate" }], animations: [
             trigger('openClose', [
                 transition(':enter', [
                     style({ bottom: '-55px', opacity: 0 }),

package/fesm2022/testgorilla-tgo-ui-components-snackbar.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"testgorilla-tgo-ui-components-snackbar.mjs","sources":["../../../components/snackbar/snackbar.component.ts","../../../components/snackbar/snackbar.component.html","../../../components/snackbar/snackbar.service.ts","../../../components/snackbar/snackbar.component.module.ts","../../../components/snackbar/testgorilla-tgo-ui-components-snackbar.ts"],"sourcesContent":["import { animate, style, transition, trigger } from '@angular/animations';\nimport { Component, Inject, Input, OnInit, Optional } from '@angular/core';\nimport { MAT_SNACK_BAR_DATA, MatSnackBarRef } from '@angular/material/snack-bar';\nimport { IconName } from '@testgorilla/tgo-ui/components/icon';\nimport { SnackbarLink, SnackbarType, SnackbarVariant } from './snackbar.model';\nimport { alertBarsUtil } from '@testgorilla/tgo-ui/components/core';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\nimport { LinkTargetType } from '@testgorilla/tgo-ui/components/alert-banner';\n\n@Component({\n selector: 'ui-snackbar',\n templateUrl: './snackbar.component.html',\n styleUrls: ['./snackbar.component.scss'],\n animations: [\n trigger('openClose', [\n transition(':enter', [\n style({ bottom: '-55px', opacity: 0 }),\n animate('0.2s ease-out', style({ opacity: 1, bottom: '10px' })),\n ]),\n transition(':leave', [\n style({ bottom: '10px', opacity: 1 }),\n animate('0.2s ease-in', style({ bottom: '-55px', opacity: 0 })),\n ]),\n ]),\n ],\n standalone: false,\n})\nexport class SnackbarComponent implements OnInit {\n /*\n Background color of the button while in active state\n \n @type {SnackbarType}\n * @memberof SnackbarComponent\n /\n @Input() snackbarType: SnackbarType = 'success';\n\n /\n Snackbar message\n \n @memberof SnackbarComponent\n /\n @Input() message = '';\n\n /\n Snackbar message from html\n \n @memberof SnackbarComponent\n /\n @Input() set html(value: string) {\n if (value) {\n this.safeHtml = value;\n }\n }\n\n /\n Set the time that the snackbar will be visible\n \n @memberof SnackbarComponent\n /\n @Input() seconds = 5;\n\n /\n Include dismmiss button\n \n @memberof SnackbarComponent\n /\n @Input() includeDismissButton = true;\n\n /\n Static or fixed position\n \n @memberof SnackbarComponent\n /\n @Input() fixed = true;\n\n /\n Link text that will appended at the end of message\n \n @memberof AlertBannerComponent\n /\n @Input() linkText? = '';\n\n /\n Link url\n \n @memberof AlertBannerComponent\n /\n @Input() linkUrl?: string;\n\n /\n Link target\n \n @type {@type {LinkTargetType}}\n * @memberof AlertBannerComponent\n /\n @Input() linkTarget?: LinkTargetType = '_blank';\n\n /\n The variant to be used\n \n @type {SnackbarVariant}\n * @memberof SnackbarComponent\n /\n @Input() variant: SnackbarVariant = 'desktop';\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof SnackbarComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /\n Close button tooltip\n \n @type {string}\n * @memberof SnackbarComponent\n /\n @Input() closeButtonTooltip = '';\n\n /\n A string representing the ARIA requirement for accessibility.\n * This attribute is used to indicate whether an input field is required for form submission.\n * @type {string}\n * @memberof SnackbarComponent\n /\n @Input() ariaDescribedby = '';\n\n iconName: IconName;\n showSnackbar = true;\n milisenconds: number;\n visible = false;\n timer?: number;\n timerStartedAt = 0;\n timerPausedAt = 0;\n position: string;\n safeHtml: string;\n\n translationContext = 'SNACKBAR.';\n protected readonly maxCharacters = 70;\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme,\n @Inject(MAT_SNACK_BAR_DATA)\n private data: {\n snackbarType: SnackbarType;\n message: string;\n link?: SnackbarLink;\n applicationTheme?: ApplicationTheme;\n html?: string;\n seconds?: number;\n },\n private snackbarRef: MatSnackBarRef<SnackbarComponent>\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n\n this.snackbarType = data.snackbarType ?? 'success';\n this.message = data.message ?? '';\n this.safeHtml = data.html ?? '';\n this.linkText = data.link?.text ?? '';\n this.linkUrl = data.link?.url ?? '';\n this.seconds = data.seconds ?? 5;\n }\n\n ngOnInit(): void {\n this.milisenconds = this.seconds 1000;\n this.iconName = alertBarsUtil.setIcon(this.snackbarType) as IconName;\n this.show();\n this.position = alertBarsUtil.setPosition(this.fixed);\n }\n\n //Show snackbar\n show() {\n this.timerStartedAt = Date.now();\n this.visible = true;\n this.timer = window.setTimeout(() => this.hide(), this.milisenconds);\n }\n\n //Hide snackbar\n hide() {\n this.visible = false;\n this.timerPausedAt = 0;\n this.timerStartedAt = 0;\n clearTimeout(this.timer);\n this.timer = undefined;\n this.dismissSnackbar();\n }\n\n //Pause timer when mouse enter\n onMouseEnter() {\n this.visible = true;\n this.timerPausedAt = Date.now();\n clearTimeout(this.timer);\n }\n\n //Continue timer when mouse leave\n onMouseLeave() {\n const diff = this.timerPausedAt - this.timerStartedAt;\n if (diff <= 0) {\n return this.hide();\n }\n this.timer = window.setTimeout(() => this.hide(), this.milisenconds - diff);\n }\n\n //Hide snackbar when dismiss button is clicked\n dismissClick() {\n this.visible = false;\n this.dismissSnackbar();\n }\n\n onLinkClick(event: Event): void {\n event?.preventDefault();\n\n if (this.data.link?.action) {\n this.data.link?.action();\n } else if (this.data.link?.url) {\n window.open(this.data.link?.url, '_blank');\n }\n }\n\n private dismissSnackbar(): void {\n if (Object.keys(this.snackbarRef).length > 0) {\n this.snackbarRef.dismiss();\n }\n }\n}\n","<ng-container>\n <div\n [ngClass]=\"snackbarType + ' ' + position\"\n [@openClose]\n ngIf=\"visible\"\n class=\"snackbar-container\"\n [attr.theme]=\"applicationTheme\"\n [class.mobile]=\"variant === 'mobile'\"\n [class.desktop]=\"variant === 'desktop'\"\n (mouseenter)=\"onMouseEnter()\"\n (mouseleave)=\"onMouseLeave()\"\n data-testid=\"snackbar-wrapper\"\n [attr.data-test-snackbar-type]=\"snackbarType\"\n [attr.aria-describedby]=\"'describedby'\"\n role=\"alert\"\n [attr.aria-labelledby]=\"'labelledby'\"\n >\n <span style=\"position: absolute; left: -9999px\" id=\"labelledby\">{{\n 'ALERT_BANNER.' + (snackbarType \| uppercase) \| uiTranslate \| async\n }}</span>\n <span style=\"position: absolute; left: -9999px\"\n >{{ message }}\n <a ngIf=\"!!linkText\" [target]=\"linkTarget\" [href]=\"linkUrl\" (click)=\"onLinkClick($event)\">{{ linkText }}</a>\n </span>\n <span [style.display]=\"'none'\" id=\"describedby\">{{ ariaDescribedby }}</span>\n <div\n aria-hidden=\"true\"\n class=\"snackbar-text\"\n [matTooltip]=\"message.length > maxCharacters ? message : ''\"\n data-testid=\"snackbar-content\"\n >\n <ui-icon ngIf=\"applicationTheme === 'classic'\" [name]=\"iconName\" size=\"24\"></ui-icon>\n {{ message.length > maxCharacters ? (message \| slice: 0 : maxCharacters) + '..' : message }}\n <div ngIf=\"safeHtml\" [innerHTML]=\"safeHtml\"></div>\n <a ngIf=\"!!linkText\" [target]=\"linkTarget\" [href]=\"linkUrl\" (click)=\"onLinkClick($event)\">{{ linkText }}</a>\n </div>\n <ui-button\n ngIf=\"includeDismissButton && applicationTheme === 'classic'\"\n variant=\"text\"\n [label]=\"(translationContext + 'DISMISS' \| uiTranslate \| async)!\"\n [applicationTheme]=\"applicationTheme !== 'classic' ? 'light' : 'classic'\"\n (buttonClickEvent)=\"dismissClick()\"\n data-testid=\"snackbar-dismiss-button\"\n ></ui-button>\n <ui-button\n ngIf=\"includeDismissButton && applicationTheme !== 'classic'\"\n [variant]=\"'icon-button'\"\n [applicationTheme]=\"'light'\"\n [iconName]=\"'Close-in-line'\"\n [size]=\"'small'\"\n [tooltip]=\"(closeButtonTooltip \|\| ('COMMON.CLOSE' \| uiTranslate \| async))!\"\n (click)=\"dismissClick()\"\n data-testid=\"snackbar-dismiss-button\"\n ></ui-button>\n </div>\n</ng-container>\n","import { Injectable } from '@angular/core';\nimport { MatSnackBar } from '@angular/material/snack-bar';\nimport { SnackbarComponent } from './snackbar.component';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\nimport { SnackbarLink, SnackbarType } from './snackbar.model';\n\n@Injectable()\nexport class SnackbarService {\n constructor(private snackBar: MatSnackBar) {}\n\n error(message: string, applicationTheme?: ApplicationTheme, html?: string, link?: SnackbarLink, seconds?: number) {\n return this.show('error', message, applicationTheme, html, link, seconds);\n }\n\n success(message: string, applicationTheme?: ApplicationTheme, html?: string, link?: SnackbarLink, seconds?: number) {\n return this.show('success', message, applicationTheme, html, link, seconds);\n }\n\n info(message: string, applicationTheme?: ApplicationTheme, html?: string, link?: SnackbarLink, seconds?: number) {\n return this.show('info', message, applicationTheme, html, link, seconds);\n }\n\n warning(message: string, applicationTheme?: ApplicationTheme, html?: string, link?: SnackbarLink, seconds?: number) {\n return this.show('warning', message, applicationTheme, html, link, seconds);\n }\n\n show(\n snackbarType: SnackbarType,\n message: string,\n applicationTheme?: ApplicationTheme,\n html?: string,\n link?: SnackbarLink,\n seconds?: number\n ) {\n const componentRef = this.snackBar.openFromComponent(SnackbarComponent, {\n data: {\n snackbarType,\n message,\n link,\n html,\n seconds,\n },\n });\n if (applicationTheme) {\n componentRef.instance.applicationTheme = applicationTheme;\n }\n return componentRef;\n }\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { SnackbarComponent } from './snackbar.component';\nimport { SnackbarService } from './snackbar.service';\nimport { UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { MatSnackBarModule } from '@angular/material/snack-bar';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\n@NgModule({\n declarations: [SnackbarComponent],\n imports: [\n CommonModule,\n ButtonComponentModule,\n IconComponentModule,\n UiTranslatePipe,\n MatSnackBarModule,\n MatTooltipModule,\n ],\n exports: [SnackbarComponent],\n providers: [SnackbarService],\n})\nexport class SnackbarComponentModule {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"testgorilla-tgo-ui-components-snackbar.mjs","sources":["../../../components/snackbar/snackbar.component.ts","../../../components/snackbar/snackbar.component.html","../../../components/snackbar/snackbar.service.ts","../../../components/snackbar/snackbar.component.module.ts","../../../components/snackbar/testgorilla-tgo-ui-components-snackbar.ts"],"sourcesContent":["import { animate, style, transition, trigger } from '@angular/animations';\nimport { Component, Inject, Input, OnInit, Optional } from '@angular/core';\nimport { MAT_SNACK_BAR_DATA, MatSnackBarRef } from '@angular/material/snack-bar';\nimport { IconName } from '@testgorilla/tgo-ui/components/icon';\nimport { SnackbarLink, SnackbarType, SnackbarVariant } from './snackbar.model';\nimport { alertBarsUtil } from '@testgorilla/tgo-ui/components/core';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\nimport { LinkTargetType } from '@testgorilla/tgo-ui/components/alert-banner';\n\n@Component({\n selector: 'ui-snackbar',\n templateUrl: './snackbar.component.html',\n styleUrls: ['./snackbar.component.scss'],\n animations: [\n trigger('openClose', [\n transition(':enter', [\n style({ bottom: '-55px', opacity: 0 }),\n animate('0.2s ease-out', style({ opacity: 1, bottom: '10px' })),\n ]),\n transition(':leave', [\n style({ bottom: '10px', opacity: 1 }),\n animate('0.2s ease-in', style({ bottom: '-55px', opacity: 0 })),\n ]),\n ]),\n ],\n standalone: false,\n})\nexport class SnackbarComponent implements OnInit {\n /*\n Background color of the button while in active state\n \n @type {SnackbarType}\n * @memberof SnackbarComponent\n /\n @Input() snackbarType: SnackbarType = 'success';\n\n /\n Snackbar message\n \n @memberof SnackbarComponent\n /\n @Input() message = '';\n\n /\n Snackbar message from html\n \n @memberof SnackbarComponent\n /\n @Input() set html(value: string) {\n if (value) {\n this.safeHtml = value;\n }\n }\n\n /\n Set the time that the snackbar will be visible\n \n @memberof SnackbarComponent\n /\n @Input() seconds = 5;\n\n /\n Include dismmiss button\n \n @memberof SnackbarComponent\n /\n @Input() includeDismissButton = true;\n\n /\n Static or fixed position\n \n @memberof SnackbarComponent\n /\n @Input() fixed = true;\n\n /\n Link text that will appended at the end of message\n \n @memberof AlertBannerComponent\n /\n @Input() linkText? = '';\n\n /\n Link url\n \n @memberof AlertBannerComponent\n /\n @Input() linkUrl?: string;\n\n /\n Link target\n \n @type {@type {LinkTargetType}}\n * @memberof AlertBannerComponent\n /\n @Input() linkTarget?: LinkTargetType = '_blank';\n\n /\n The variant to be used\n \n @type {SnackbarVariant}\n * @memberof SnackbarComponent\n /\n @Input() variant: SnackbarVariant = 'desktop';\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof SnackbarComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /\n Close button tooltip\n \n @type {string}\n * @memberof SnackbarComponent\n /\n @Input() closeButtonTooltip = '';\n\n /\n A string representing the ARIA requirement for accessibility.\n * This attribute is used to indicate whether an input field is required for form submission.\n * @type {string}\n * @memberof SnackbarComponent\n /\n @Input() ariaDescribedby = '';\n\n iconName: IconName;\n showSnackbar = true;\n milisenconds: number;\n visible = false;\n timer?: number;\n timerStartedAt = 0;\n timerPausedAt = 0;\n position: string;\n safeHtml: string;\n\n translationContext = 'SNACKBAR.';\n protected readonly maxCharacters = 70;\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme,\n @Inject(MAT_SNACK_BAR_DATA)\n private data: {\n snackbarType: SnackbarType;\n message: string;\n link?: SnackbarLink;\n applicationTheme?: ApplicationTheme;\n html?: string;\n seconds?: number;\n },\n private snackbarRef: MatSnackBarRef<SnackbarComponent>\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n\n this.snackbarType = data.snackbarType ?? 'success';\n this.message = data.message ?? '';\n this.safeHtml = data.html ?? '';\n this.linkText = data.link?.text ?? '';\n this.linkUrl = data.link?.url ?? '';\n this.seconds = data.seconds ?? 5;\n }\n\n ngOnInit(): void {\n this.milisenconds = this.seconds 1000;\n this.iconName = alertBarsUtil.setIcon(this.snackbarType) as IconName;\n this.show();\n this.position = alertBarsUtil.setPosition(this.fixed);\n }\n\n //Show snackbar\n show() {\n this.timerStartedAt = Date.now();\n this.visible = true;\n this.timer = window.setTimeout(() => this.hide(), this.milisenconds);\n }\n\n //Hide snackbar\n hide() {\n this.visible = false;\n this.timerPausedAt = 0;\n this.timerStartedAt = 0;\n clearTimeout(this.timer);\n this.timer = undefined;\n this.dismissSnackbar();\n }\n\n //Pause timer when mouse enter\n onMouseEnter() {\n this.visible = true;\n this.timerPausedAt = Date.now();\n clearTimeout(this.timer);\n }\n\n //Continue timer when mouse leave\n onMouseLeave() {\n const diff = this.timerPausedAt - this.timerStartedAt;\n if (diff <= 0) {\n return this.hide();\n }\n this.timer = window.setTimeout(() => this.hide(), this.milisenconds - diff);\n }\n\n //Hide snackbar when dismiss button is clicked\n dismissClick() {\n this.visible = false;\n this.dismissSnackbar();\n }\n\n onLinkClick(event: Event): void {\n event?.preventDefault();\n\n if (this.data.link?.action) {\n this.data.link?.action();\n } else if (this.data.link?.url) {\n window.open(this.data.link?.url, '_blank');\n }\n }\n\n private dismissSnackbar(): void {\n if (Object.keys(this.snackbarRef).length > 0) {\n this.snackbarRef.dismiss();\n }\n }\n}\n","<ng-container>\n <div\n [ngClass]=\"snackbarType + ' ' + position\"\n [@openClose]\n ngIf=\"visible\"\n class=\"snackbar-container\"\n [attr.theme]=\"applicationTheme\"\n [class.mobile]=\"variant === 'mobile'\"\n [class.desktop]=\"variant === 'desktop'\"\n (mouseenter)=\"onMouseEnter()\"\n (mouseleave)=\"onMouseLeave()\"\n data-testid=\"snackbar-wrapper\"\n [attr.data-test-snackbar-type]=\"snackbarType\"\n [attr.aria-describedby]=\"'describedby'\"\n role=\"alert\"\n [attr.aria-labelledby]=\"'labelledby'\"\n >\n <span style=\"position: absolute; left: -9999px\" id=\"labelledby\">{{\n 'ALERT_BANNER.' + (snackbarType \| uppercase) \| uiTranslate \| async\n }}</span>\n <span style=\"position: absolute; left: -9999px\"\n >{{ message }}\n <a ngIf=\"!!linkText\" [target]=\"linkTarget\" [href]=\"linkUrl\" (click)=\"onLinkClick($event)\">{{ linkText }}</a>\n </span>\n <span [style.display]=\"'none'\" id=\"describedby\">{{ ariaDescribedby }}</span>\n <div\n aria-hidden=\"true\"\n class=\"snackbar-text\"\n [matTooltip]=\"message.length > maxCharacters ? message : ''\"\n data-testid=\"snackbar-content\"\n >\n <ui-icon ngIf=\"applicationTheme === 'classic'\" [name]=\"iconName\" size=\"24\"></ui-icon>\n {{ message.length > maxCharacters ? (message \| slice: 0 : maxCharacters) + '..' : message }}\n <div ngIf=\"safeHtml\" [innerHTML]=\"safeHtml\"></div>\n <a ngIf=\"!!linkText\" [target]=\"linkTarget\" [href]=\"linkUrl\" (click)=\"onLinkClick($event)\">{{ linkText }}</a>\n </div>\n <ui-button\n ngIf=\"includeDismissButton && applicationTheme === 'classic'\"\n variant=\"text\"\n [label]=\"(translationContext + 'DISMISS' \| uiTranslate \| async)!\"\n [applicationTheme]=\"applicationTheme !== 'classic' ? 'light' : 'classic'\"\n (buttonClickEvent)=\"dismissClick()\"\n data-testid=\"snackbar-dismiss-button\"\n ></ui-button>\n <ui-button\n ngIf=\"includeDismissButton && applicationTheme !== 'classic'\"\n [variant]=\"'icon-button'\"\n [applicationTheme]=\"'light'\"\n [iconName]=\"'Close-in-line'\"\n [size]=\"'small'\"\n [tooltip]=\"(closeButtonTooltip \|\| ('COMMON.CLOSE' \| uiTranslate \| async))!\"\n (click)=\"dismissClick()\"\n data-testid=\"snackbar-dismiss-button\"\n ></ui-button>\n </div>\n</ng-container>\n","import { Injectable } from '@angular/core';\nimport { MatSnackBar } from '@angular/material/snack-bar';\nimport { SnackbarComponent } from './snackbar.component';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\nimport { SnackbarLink, SnackbarType } from './snackbar.model';\n\n@Injectable()\nexport class SnackbarService {\n constructor(private snackBar: MatSnackBar) {}\n\n error(message: string, applicationTheme?: ApplicationTheme, html?: string, link?: SnackbarLink, seconds?: number) {\n return this.show('error', message, applicationTheme, html, link, seconds);\n }\n\n success(message: string, applicationTheme?: ApplicationTheme, html?: string, link?: SnackbarLink, seconds?: number) {\n return this.show('success', message, applicationTheme, html, link, seconds);\n }\n\n info(message: string, applicationTheme?: ApplicationTheme, html?: string, link?: SnackbarLink, seconds?: number) {\n return this.show('info', message, applicationTheme, html, link, seconds);\n }\n\n warning(message: string, applicationTheme?: ApplicationTheme, html?: string, link?: SnackbarLink, seconds?: number) {\n return this.show('warning', message, applicationTheme, html, link, seconds);\n }\n\n show(\n snackbarType: SnackbarType,\n message: string,\n applicationTheme?: ApplicationTheme,\n html?: string,\n link?: SnackbarLink,\n seconds?: number\n ) {\n const componentRef = this.snackBar.openFromComponent(SnackbarComponent, {\n data: {\n snackbarType,\n message,\n link,\n html,\n seconds,\n },\n });\n if (applicationTheme) {\n componentRef.instance.applicationTheme = applicationTheme;\n }\n return componentRef;\n }\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { SnackbarComponent } from './snackbar.component';\nimport { SnackbarService } from './snackbar.service';\nimport { UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { MatSnackBarModule } from '@angular/material/snack-bar';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\n@NgModule({\n declarations: [SnackbarComponent],\n imports: [\n CommonModule,\n ButtonComponentModule,\n IconComponentModule,\n UiTranslatePipe,\n MatSnackBarModule,\n MatTooltipModule,\n ],\n exports: [SnackbarComponent],\n providers: [SnackbarService],\n})\nexport class SnackbarComponentModule {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/testgorilla-tgo-ui-components-table.mjs CHANGED Viewed

@@ -283,7 +283,7 @@ class TableComponent {
         this.tableData = data;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TableComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }, { token: i0.DestroyRef }, { token: IS_MOBILE_TOKEN }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: TableComponent, isStandalone: false, selector: "ui-table", inputs: { config: "config", data: "data", loading: "loading", applicationTheme: "applicationTheme", tableDetailColumns: "tableDetailColumns", tableDetails: "tableDetails", disableBorderRadius: "disableBorderRadius", isCondensed: "isCondensed", stickyHeader: "stickyHeader", maxHeight: "maxHeight" }, outputs: { onRowClickEvent: "onRowClickEvent", onDetailRowClickEvent: "onDetailRowClickEvent", paginatorChange: "paginatorChange", sortChange: "sortChange" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n  #tableContainer\n  class=\"table-container\"\n  [ngClass]=\"{ 'without-title': !tableConfig?.title, 'disable-border-radius': disableBorderRadius }\"\n  [attr.theme]=\"applicationTheme\"\n>\n  <div *ngIf=\"tableConfig?.title\" class=\"table-header\">\n    {{ tableConfig.title | sentencecase }}\n    <ng-content select=\"[title-actions]\"></ng-content>\n  </div>\n  <div\n    #table\n    *ngIf=\"scrollSettings$ | async as scrollSettings\"\n    class=\"table-wrapper\"\n    [class.sticky-header]=\"stickyHeader\"\n    [style.--table-max-height]=\"maxHeight\"\n  >\n    <table\n      [tabIndex]=\"0\"\n      class=\"main-table\"\n      [class.condensed]=\"isCondensed\"\n      [class.sort-disabled]=\"loading\"\n      mat-table\n      [dataSource]=\"tableData\"\n      matSort\n      [matSortStart]=\"tableConfig?.sort?.defaultSortStart ?? 'asc'\"\n      [matSortActive]=\"tableConfig?.sort?.active ?? ''\"\n      [matSortDirection]=\"tableConfig?.sort?.direction ?? ''\"\n      (matSortChange)=\"onSortChange($event)\"\n      multiTemplateDataRows\n    >\n      <ng-container\n        *ngFor=\"let column of tableConfig.columns; index as i; last as isLast; trackBy: trackColumnUniqueId\"\n      >\n        <ng-container *ngIf=\"isLast && column.isSticky && column.allowSort\">\n          <ng-container [matColumnDef]=\"column.uniqueId ?? column.key\" [stickyEnd]=\"!scrollSettings?.scrollEnd\">\n            <th\n              mat-header-cell\n              [start]=\"column.sortStart ?? 'asc'\"\n              [mat-sort-header]=\"column.sortHeader ?? column.key\"\n              *matHeaderCellDef\n              [attr.sortable]=\"column.allowSort ?? false\"\n              [ngStyle]=\"{ width: column.styles?.width, minWidth: column.styles?.['min-width'] }\"\n              [ngClass]=\"column.styles?.alignment ? 'th-' + column.styles?.alignment : ''\"\n              [style.font-weight]=\"'bold'\"\n            >\n              <ng-container *ngIf=\"column.headerCellTemplate; else configValue\">\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    column.headerCellTemplate;\n                    context: { $implicit: column.title, column, colIndex: i }\n                  \"\n                ></ng-container>\n              </ng-container>\n              <ng-template #configValue>\n                <ng-container\n                  [ngTemplateOutlet]=\"columnHeader\"\n                  [ngTemplateOutletContext]=\"{ i, column }\"\n                ></ng-container>\n              </ng-template>\n            </th>\n\n            <td\n              mat-cell\n              *matCellDef=\"let element; let rowIndex = dataIndex\"\n              [align]=\"column.styles?.alignment\"\n              [ngClass]=\"[column.styles?.alignment ? 'td-' + column.styles?.alignment : '']\"\n              (click)=\"\n                onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n              \"\n            >\n              <ui-skeleton\n                class=\"table-skeleton-loader\"\n                [count]=\"1\"\n                [theme]=\"skeletonStyleConfig\"\n                [appearance]=\"'line'\"\n                *ngIf=\"loading; else value\"\n              ></ui-skeleton>\n              <ng-template #value>\n                <div class=\"row-value\">\n                  <ng-container\n                    [ngTemplateOutlet]=\"expandButton\"\n                    [ngTemplateOutletContext]=\"{ index: i, element }\"\n                  ></ng-container>\n\n                  @if (column?.type) {\n                    <ng-container\n                      *ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n                    ></ng-container>\n                  } @else {\n                    <ng-container *ngIf=\"column.rowCellTemplate; else configData\">\n                      <ng-container\n                        *ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n                      ></ng-container>\n                    </ng-container>\n                    <ng-template #configData>\n                      <span\n                        [style.font-weight]=\"column.bold ? 'bold' : 'normal'\"\n                        [style.font-size]=\"column.fontSize ?? '14px'\"\n                        >{{ element | dataPropertyGetter: column.key }}</span\n                      >\n                    </ng-template>\n                  }\n                </div>\n              </ng-template>\n            </td>\n          </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"isLast && column.isSticky && !column.allowSort\">\n          <ng-container\n            [matColumnDef]=\"column.uniqueId ?? column.key\"\n            [stickyEnd]=\"scrollSettings.horizontalScroll ? !scrollSettings.scrollEnd : true\"\n          >\n            <th\n              mat-header-cell\n              *matHeaderCellDef\n              [attr.sortable]=\"column.allowSort ?? false\"\n              [ngStyle]=\"{ width: column.styles?.width, minWidth: column.styles?.['min-width'] }\"\n              [ngClass]=\"column.styles?.alignment ? 'th-' + column.styles?.alignment : ''\"\n              [style.font-weight]=\"'bold'\"\n            >\n              <ng-container *ngIf=\"column.headerCellTemplate; else configValue\">\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    column.headerCellTemplate;\n                    context: { $implicit: column.title, column, colIndex: i }\n                  \"\n                ></ng-container>\n              </ng-container>\n              <ng-template #configValue>\n                <ng-container\n                  [ngTemplateOutlet]=\"columnHeader\"\n                  [ngTemplateOutletContext]=\"{ i, column }\"\n                ></ng-container>\n              </ng-template>\n            </th>\n\n            <td\n              mat-cell\n              *matCellDef=\"let element; let rowIndex = dataIndex\"\n              [align]=\"column.styles?.alignment\"\n              [ngClass]=\"[column.styles?.alignment ? 'td-' + column.styles?.alignment : '']\"\n              (click)=\"\n                onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n              \"\n            >\n              <ui-skeleton\n                class=\"table-skeleton-loader\"\n                [count]=\"1\"\n                [theme]=\"skeletonStyleConfig\"\n                [appearance]=\"'line'\"\n                *ngIf=\"loading; else value\"\n              ></ui-skeleton>\n              <ng-template #value>\n                <div class=\"row-value\">\n                  <ng-container\n                    [ngTemplateOutlet]=\"expandButton\"\n                    [ngTemplateOutletContext]=\"{ index: i, element }\"\n                  ></ng-container>\n\n                  @if (column?.type) {\n                    <ng-container\n                      *ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n                    ></ng-container>\n                  } @else {\n                    <ng-container *ngIf=\"column.rowCellTemplate; else configData\">\n                      <ng-container\n                        *ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n                      ></ng-container>\n                    </ng-container>\n                    <ng-template #configData>\n                      <span\n                        [style.font-weight]=\"column.bold ? 'bold' : 'normal'\"\n                        [style.font-size]=\"column.fontSize ?? '14px'\"\n                        >{{ element | dataPropertyGetter: column.key }}</span\n                      >\n                    </ng-template>\n                  }\n                </div>\n              </ng-template>\n            </td>\n          </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"!(isLast && column.isSticky) && column.allowSort\">\n          <ng-container\n            [matColumnDef]=\"column.uniqueId ?? column.key\"\n            [sticky]=\"(isMobile$ | async) ? false : !scrollSettings.scrollStart && !!column.isSticky\"\n          >\n            <th\n              mat-header-cell\n              [start]=\"column.sortStart ?? 'asc'\"\n              [mat-sort-header]=\"column.sortHeader ?? column.key\"\n              [attr.sortable]=\"column.allowSort ?? false\"\n              *matHeaderCellDef\n              [style.font-weight]=\"'bold'\"\n              [ngStyle]=\"{ width: column.styles?.width, minWidth: column.styles?.['min-width'] }\"\n              [ngClass]=\"column.styles?.alignment ? 'th-' + column.styles?.alignment : ''\"\n            >\n              <ng-container *ngIf=\"column.headerCellTemplate; else configValue\">\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    column.headerCellTemplate;\n                    context: { $implicit: column.title, column, colIndex: i }\n                  \"\n                ></ng-container>\n              </ng-container>\n              <ng-template #configValue>\n                <ng-container\n                  [ngTemplateOutlet]=\"columnHeader\"\n                  [ngTemplateOutletContext]=\"{ i, column }\"\n                ></ng-container>\n              </ng-template>\n            </th>\n\n            <td\n              mat-cell\n              *matCellDef=\"let element; let rowIndex = dataIndex\"\n              [align]=\"column.styles?.alignment\"\n              [ngClass]=\"[column.styles?.alignment ? 'td-' + column.styles?.alignment : '']\"\n              (click)=\"\n                onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n              \"\n            >\n              <ui-skeleton\n                class=\"table-skeleton-loader\"\n                [count]=\"1\"\n                [theme]=\"skeletonStyleConfig\"\n                [appearance]=\"'line'\"\n                *ngIf=\"loading; else value\"\n              ></ui-skeleton>\n              <ng-template #value>\n                <div class=\"row-value\">\n                  <ng-container\n                    [ngTemplateOutlet]=\"expandButton\"\n                    [ngTemplateOutletContext]=\"{ index: i, element }\"\n                  ></ng-container>\n\n                  @if (column?.type) {\n                    <ng-container\n                      *ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n                    ></ng-container>\n                  } @else {\n                    <ng-container *ngIf=\"column.rowCellTemplate; else configData\">\n                      <ng-container\n                        *ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n                      ></ng-container>\n                    </ng-container>\n                    <ng-template #configData>\n                      <span\n                        [style.font-weight]=\"column.bold ? 'bold' : 'normal'\"\n                        [style.font-size]=\"column.fontSize ?? '14px'\"\n                        >{{ element | dataPropertyGetter: column.key }}</span\n                      >\n                    </ng-template>\n                  }\n                </div>\n              </ng-template>\n            </td>\n          </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"!(isLast && column.isSticky) && !column.allowSort\">\n          <ng-container\n            [matColumnDef]=\"column.uniqueId ?? column.key\"\n            [sticky]=\"(isMobile$ | async) ? false : !scrollSettings.scrollStart && !!column.isSticky\"\n          >\n            <th\n              mat-header-cell\n              [attr.sortable]=\"column.allowSort ?? false\"\n              *matHeaderCellDef\n              [style.font-weight]=\"'bold'\"\n              [ngStyle]=\"{ width: column.styles?.width, minWidth: column.styles?.['min-width'] }\"\n              [ngClass]=\"column.styles?.alignment ? 'th-' + column.styles?.alignment : ''\"\n            >\n              <ng-container *ngIf=\"column.headerCellTemplate; else configValue\">\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    column.headerCellTemplate;\n                    context: { $implicit: column.title, column, colIndex: i }\n                  \"\n                ></ng-container>\n              </ng-container>\n              <ng-template #configValue>\n                <ng-container\n                  [ngTemplateOutlet]=\"columnHeader\"\n                  [ngTemplateOutletContext]=\"{ i, column }\"\n                ></ng-container>\n              </ng-template>\n            </th>\n\n            <td\n              mat-cell\n              *matCellDef=\"let element; let rowIndex = dataIndex\"\n              [align]=\"column.styles?.alignment\"\n              [ngClass]=\"[column.styles?.alignment ? 'td-' + column.styles?.alignment : '']\"\n              (click)=\"\n                onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n              \"\n            >\n              <ui-skeleton\n                class=\"table-skeleton-loader\"\n                [count]=\"1\"\n                [theme]=\"skeletonStyleConfig\"\n                [appearance]=\"'line'\"\n                *ngIf=\"loading; else value\"\n              ></ui-skeleton>\n              <ng-template #value>\n                <div class=\"row-value\">\n                  <ng-container\n                    [ngTemplateOutlet]=\"expandButton\"\n                    [ngTemplateOutletContext]=\"{ index: i, element }\"\n                  ></ng-container>\n\n                  @if (column?.type) {\n                    <ng-container\n                      *ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n                    ></ng-container>\n                  } @else {\n                    <ng-container *ngIf=\"column.rowCellTemplate; else configData\">\n                      <ng-container\n                        *ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n                      ></ng-container>\n                    </ng-container>\n                    <ng-template #configData>\n                      <span\n                        [style.font-weight]=\"column.bold ? 'bold' : 'normal'\"\n                        [style.font-size]=\"column.fontSize ?? '14px'\"\n                        >{{ element | dataPropertyGetter: column.key }}</span\n                      >\n                    </ng-template>\n                  }\n                </div>\n              </ng-template>\n            </td>\n          </ng-container>\n        </ng-container>\n      </ng-container>\n\n      <ng-container matColumnDef=\"expandedDetail\">\n        <td mat-cell *matCellDef=\"let element\" [attr.colspan]=\"displayedColumns.length\">\n          <div\n            class=\"element-detail\"\n            *ngIf=\"dataSourceDetail.data.length\"\n            [@expandDetail]=\"element === elementDetail ? 'expanded' : 'collapsed'\"\n          >\n            <table\n              mat-table\n              [dataSource]=\"dataSourceDetail\"\n              [ngClass]=\"{ 'hide-borders': element === tableData[tableData.length - 1] }\"\n            >\n              <ng-container\n                *ngFor=\"let tableColumn of tableDetailColumns.columnDefs\"\n                [matColumnDef]=\"tableColumn.title ?? ''\"\n              >\n                <th\n                  mat-header-cell\n                  *matHeaderCellDef=\"let element\"\n                  arrowPosition=\"after\"\n                  [ngStyle]=\"{ width: tableColumn.styles?.width }\"\n                  [ngClass]=\"tableColumn.styles?.alignment ? 'th-' + tableColumn.styles?.alignment : ''\"\n                >\n                  {{ tableColumn.title | uppercase }}\n                </th>\n\n                <td\n                  mat-cell\n                  *matCellDef=\"let element\"\n                  (click)=\"onDetailRowClick(element)\"\n                  [align]=\"tableColumn.styles?.alignment\"\n                  [ngClass]=\"tableColumn.styles?.alignment ? 'td-' + tableColumn.styles?.alignment : ''\"\n                  [ngStyle]=\"{ width: tableColumn.styles?.width }\"\n                >\n                  <ng-container *ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn }\"></ng-container>\n                </td>\n              </ng-container>\n\n              <tr mat-header-row *matHeaderRowDef=\"columnsDetailToDisplay\"></tr>\n              <tr mat-row *matRowDef=\"let rowDetail; columns: columnsDetailToDisplay\"></tr>\n            </table>\n          </div>\n        </td>\n      </ng-container>\n\n      <ng-template #tableDataTpl let-element=\"element\" let-tableColumn=\"tableColumn\">\n        <div class=\"align-wrapper\">\n          <ng-container [ngSwitch]=\"tableColumn.type\">\n            <ng-container *ngSwitchCase=\"DataType.FIELD\">\n              {{ element | dataPropertyGetter: tableColumn.key }}\n            </ng-container>\n            <ng-container *ngSwitchCase=\"DataType.FUNCTION\">\n              {{ tableColumn.function?.(element) }}\n            </ng-container>\n            <ng-container *ngSwitchCase=\"DataType.RENDERER\">\n              <ng-template [dynamicComponent]=\"[tableColumn.renderer, element] | memoizeFunc: callRenderer\">\n              </ng-template>\n            </ng-container>\n            <ng-container *ngSwitchDefault>\n              {{ element | dataPropertyGetter: tableColumn.key }}\n            </ng-container>\n          </ng-container>\n        </div>\n      </ng-template>\n\n      <tr\n        mat-header-row\n        *matHeaderRowDef=\"displayedColumns; sticky: stickyHeader\"\n        [class.is-title-present]=\"tableConfig.title\"\n      ></tr>\n      <tr\n        mat-row\n        *matRowDef=\"let row; columns: displayedColumns\"\n        [ngClass]=\"{\n          'expanded-row': elementDetail === row,\n          'row-clickable': tableDetails,\n          selected: row?.selected,\n          'last-row': row === tableData[tableData.length - 1] && !elementDetail,\n        }\"\n        (click)=\"toggleRow(row)\"\n      ></tr>\n      <ng-container *ngIf=\"tableDetails && tableDetailColumns?.columnDefs?.length\">\n        <tr mat-row *matRowDef=\"let row; columns: ['expandedDetail']\" class=\"detail-row\"></tr>\n      </ng-container>\n\n      <ng-container *ngIf=\"tableConfig.noDataRowTpl\">\n        <tr *matNoDataRow>\n          <ng-container *ngTemplateOutlet=\"tableConfig.noDataRowTpl\"></ng-container>\n        </tr>\n      </ng-container>\n    </table>\n  </div>\n\n  <ui-paginator\n    *ngIf=\"!tableConfig?.hidePagination && tableConfig?.pagination\"\n    [disabled]=\"loading\"\n    [applicationTheme]=\"applicationTheme !== 'classic' ? 'light' : 'classic'\"\n    [pageSize]=\"tableConfig.pagination?.itemsPerPage ?? 25\"\n    [length]=\"tableConfig.pagination?.totalItems ?? 0\"\n    [currentPage]=\"tableConfig.pagination?.currentPage ?? 0\"\n    [pageSizeOptions]=\"tableConfig.pagination?.itemsPerPageOptions ?? [10, 25, 50]\"\n    (paginatorChange)=\"onPaginatorChange($event)\"\n  ></ui-paginator>\n</div>\n\n<ng-template #expandButton let-i=\"index\" let-element=\"element\">\n  <ui-button\n    [applicationTheme]=\"applicationTheme\"\n    *ngIf=\"!i && tableDetails\"\n    variant=\"icon-button\"\n    [ngClass]=\"{ opened: elementDetail && element === elementDetail }\"\n    [iconName]=\"elementDetail && element === elementDetail ? 'Arrow-chevron-up-in-line' : 'Arrow-chevron-down-in-line'\"\n  ></ui-button>\n</ng-template>\n\n<ng-template #columnHeader let-column=\"column\" let-i=\"i\">\n  <div class=\"header-section\">\n    <span uiEllipseText (onChangeTextState)=\"onChangeColumnSize(i, $event)\" class=\"column-title\"\n      >{{ column.title | sentencecase }}\n    </span>\n    <ui-icon\n      *ngIf=\"column?.showTooltip\"\n      [name]=\"'Help-in-line'\"\n      [matTooltipClass]=\"applicationTheme\"\n      [matTooltip]=\"(column?.showTooltip ? (column?.tooltip ? column.tooltip : column.title) : '') || ''\"\n    ></ui-icon>\n  </div>\n</ng-template>\n", styles: ["@import\"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\";.bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host-context(.without-table-border) .table-container{border:none}.flex-left,.table-container .table-header{display:flex;justify-content:flex-start;align-items:center}.table-container{--mat-table-background-color: #ffffff;overflow:hidden;border:1px #e0e0e0 solid;border-radius:8px}.table-container ::ng-deep .mat-sort-header-arrow{color:#000}.table-container .table-header{min-height:56px;padding:8px;background:#fff;line-height:24px;font-size:16px;font-weight:700;text-transform:uppercase;display:flex;justify-content:space-between}.table-container .table-wrapper{max-width:100%;overflow:auto}.table-container .table-wrapper.sticky-header{max-height:var(--table-max-height);overflow-y:auto}.table-container .table-wrapper table.main-table{width:100%;box-shadow:unset}.table-container .table-wrapper table.main-table.sort-disabled ::ng-deep .mat-sort-header{pointer-events:none;cursor:default}.table-container .table-wrapper table.main-table.sort-disabled ::ng-deep .mat-sort-header .mat-sort-header-container{cursor:default}.table-container .table-wrapper table.main-table ::ng-deep .mat-sort-header-arrow{margin-left:8px}.table-container .table-wrapper table.main-table .mdc-data-table__cell,.table-container .table-wrapper table.main-table .mdc-data-table__header-cell{padding:8px 24px}.table-container .table-wrapper table.main-table.condensed .mat-mdc-row .mdc-data-table__cell:not(:first-child):not(:last-child),.table-container .table-wrapper table.main-table.condensed .mat-mdc-row .mdc-data-table__header-cell:not(:first-child):not(:last-child),.table-container .table-wrapper table.main-table.condensed .mat-mdc-header-row .mdc-data-table__cell:not(:first-child):not(:last-child),.table-container .table-wrapper table.main-table.condensed .mat-mdc-header-row .mdc-data-table__header-cell:not(:first-child):not(:last-child){padding:8px 12px}.table-container .table-wrapper table.main-table.condensed .mat-mdc-row .mdc-data-table__cell:first-child,.table-container .table-wrapper table.main-table.condensed .mat-mdc-row .mdc-data-table__header-cell:first-child,.table-container .table-wrapper table.main-table.condensed .mat-mdc-header-row .mdc-data-table__cell:first-child,.table-container .table-wrapper table.main-table.condensed .mat-mdc-header-row .mdc-data-table__header-cell:first-child{padding:8px 12px 8px 24px}.table-container .table-wrapper table.main-table.condensed .mat-mdc-row .mdc-data-table__cell:last-child,.table-container .table-wrapper table.main-table.condensed .mat-mdc-row .mdc-data-table__header-cell:last-child,.table-container .table-wrapper table.main-table.condensed .mat-mdc-header-row .mdc-data-table__cell:last-child,.table-container .table-wrapper table.main-table.condensed .mat-mdc-header-row .mdc-data-table__header-cell:last-child{padding:8px 24px 8px 12px}.table-container .table-wrapper table.main-table th{font-size:14px;line-height:16px;text-transform:uppercase}.table-container .table-wrapper table.main-table tr.is-title-present th.mat-mdc-header-cell.mdc-data-table__header-cell{border-top:1px solid #e0e0e0}.table-container .table-wrapper table.main-table td{font-size:14px;line-height:20px}.table-container .table-wrapper table.main-table td .row-value{display:flex;align-items:center;gap:16px}.table-container .table-wrapper table.main-table td .row-value ui-icon ::ng-deep mat-icon{transition:all .3s!important;font-size:24px}.table-container .table-wrapper table.main-table td .row-value ui-icon.opened ::ng-deep mat-icon{transform:rotate(180deg)}.table-container .table-wrapper table.main-table td ::ng-deep .table-skeleton-loader ngx-skeleton-loader{display:flex;justify-content:center;align-items:center;line-height:unset}.table-container .table-wrapper table.main-table td ::ng-deep .table-skeleton-loader ngx-skeleton-loader .skeleton-loader{margin-bottom:0}.table-container .table-wrapper table.main-table ::ng-deep thead{background:#f6f6f6!important}.table-container .table-wrapper table.main-table .mat-mdc-table-sticky-border-elem-left{box-shadow:24px 8px 24px #00000014}.table-container .table-wrapper table.main-table .mat-mdc-table-sticky-border-elem-right{box-shadow:0 8px 24px 4px #00000014}.table-container .header-section{display:flex;gap:4px;align-items:center}.table-container .header-section .column-title{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%;max-width:fit-content;font-weight:700}.table-container.without-title table{border:unset!important}.table-container.disable-border-radius{border-radius:0!important}.table-container ::ng-deep .mat-mdc-paginator-container{padding:0 24px}.table-container[theme=dark],.table-container[theme=light]{border-radius:10px}.table-container[theme=dark] tr.selected,.table-container[theme=light] tr.selected{background:#f4f4f4!important}.table-container[theme=dark] .table-header,.table-container[theme=light] .table-header{padding:8px 24px;text-transform:none}.table-container[theme=dark] .table-wrapper table th,.table-container[theme=light] .table-wrapper table th{text-transform:none}.table-container[theme=dark] .table-wrapper table td,.table-container[theme=light] .table-wrapper table td{transition:border .3s}.table-container[theme=dark] .table-wrapper table tr.last-row td,.table-container[theme=light] .table-wrapper table tr.last-row td{--mat-table-row-item-outline-color: rgb(0, 0, 0, 0)}.table-container[theme=dark] .table-wrapper table .mat-mdc-table-sticky-border-elem-right,.table-container[theme=light] .table-wrapper table .mat-mdc-table-sticky-border-elem-right{box-shadow:0 8px 24px 4px #24242414!important}.table-container[theme=dark] .table-wrapper table .mat-mdc-table-sticky-border-elem-left,.table-container[theme=light] .table-wrapper table .mat-mdc-table-sticky-border-elem-left{box-shadow:24px 8px 24px #24242414!important}.table-container[theme=dark] .table-wrapper table ::ng-deep thead,.table-container[theme=light] .table-wrapper table ::ng-deep thead{background-color:#fff!important}.table-container[theme=dark] .table-wrapper table ::ng-deep :not(thead) tr:hover,.table-container[theme=light] .table-wrapper table ::ng-deep :not(thead) tr:hover{background-color:#fff2fc}.table-container ::ng-deep tr.detail-row{height:0}.table-container ::ng-deep tr.detail-row td{border:unset!important}.table-container ::ng-deep .mat-column-expandedDetail{padding:0!important}.table-container ::ng-deep .element-detail{overflow:hidden!important;display:flex!important}.table-container ::ng-deep .element-detail table{background-color:#fff;border-bottom:1px solid #d3d3d3;transition:border .3s}.table-container ::ng-deep .element-detail table.hide-borders{border-bottom:unset}.table-container ::ng-deep .element-detail table .mat-mdc-header-row{visibility:collapse}.table-container ::ng-deep .element-detail table .mat-mdc-cell{border-width:0}.table-container ::ng-deep .element-detail table td:first-child{padding-left:64px!important}table th.th-right{text-align:right}table th.th-right ::ng-deep .header-section{justify-content:end}table th.th-left{text-align:left}table th.th-left ::ng-deep .header-section{justify-content:start}table th.th-center{text-align:center}table th.th-center ::ng-deep .header-section{justify-content:center}table td.td-right{text-align:right}table td.td-right div{justify-content:end}table td.td-left{text-align:left}table td.td-left div{justify-content:start}table td.td-center{text-align:center}table td.td-center div{justify-content:center}::ng-deep table:not(.main-table) thead{display:none!important}ui-paginator{width:100%;display:flex;justify-content:flex-end;border-top:1px solid #d3d3d3}ui-paginator ::ng-deep .mat-mdc-paginator{width:100%}::ng-deep .mat-mdc-tooltip{background-color:#a9c2c9;font-family:Open Sans,serif;font-weight:400;font-size:12px;border-radius:4px;overflow:visible;max-width:248px;padding:6px 2px;--mdc-plain-tooltip-container-color: none;--mdc-plain-tooltip-supporting-text-color: $tgo-black}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i2.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i2.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i2.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i2.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i2.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i2.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i2.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i4.SkeletonComponent, selector: "ui-skeleton", inputs: ["count", "theme", "appearance", "isAiTheme", "applicationTheme"] }, { kind: "component", type: i5.PaginatorComponent, selector: "ui-paginator", inputs: ["pageSizeOptions", "length", "pageSize", "disabled", "applicationTheme", "currentPage"], outputs: ["paginatorChange"] }, { kind: "component", type: i6.ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "loadingWithLabel", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "directive", type: i7.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i7.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i8.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "directive", type: i9.EllipseTextDirective, selector: "[uiEllipseText]", inputs: ["isMultiline", "maxDiffPixels", "refresh"], outputs: ["onChangeTextState"] }, { kind: "directive", type: i9.DynamicComponentDirective, selector: "[dynamicComponent]", inputs: ["dynamicComponent"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i9.DataPropertyGetterPipe, name: "dataPropertyGetter" }, { kind: "pipe", type: i9.MemoizeFuncPipe, name: "memoizeFunc" }, { kind: "pipe", type: SentenceCasePipe, name: "sentencecase" }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: TableComponent, isStandalone: false, selector: "ui-table", inputs: { config: "config", data: "data", loading: "loading", applicationTheme: "applicationTheme", tableDetailColumns: "tableDetailColumns", tableDetails: "tableDetails", disableBorderRadius: "disableBorderRadius", isCondensed: "isCondensed", stickyHeader: "stickyHeader", maxHeight: "maxHeight" }, outputs: { onRowClickEvent: "onRowClickEvent", onDetailRowClickEvent: "onDetailRowClickEvent", paginatorChange: "paginatorChange", sortChange: "sortChange" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n  #tableContainer\n  class=\"table-container\"\n  [ngClass]=\"{ 'without-title': !tableConfig?.title, 'disable-border-radius': disableBorderRadius }\"\n  [attr.theme]=\"applicationTheme\"\n>\n  <div *ngIf=\"tableConfig?.title\" class=\"table-header\">\n    {{ tableConfig.title | sentencecase }}\n    <ng-content select=\"[title-actions]\"></ng-content>\n  </div>\n  <div\n    #table\n    *ngIf=\"scrollSettings$ | async as scrollSettings\"\n    class=\"table-wrapper\"\n    [class.sticky-header]=\"stickyHeader\"\n    [style.--table-max-height]=\"maxHeight\"\n  >\n    <table\n      [tabIndex]=\"0\"\n      class=\"main-table\"\n      [class.condensed]=\"isCondensed\"\n      [class.sort-disabled]=\"loading\"\n      mat-table\n      [dataSource]=\"tableData\"\n      matSort\n      [matSortStart]=\"tableConfig?.sort?.defaultSortStart ?? 'asc'\"\n      [matSortActive]=\"tableConfig?.sort?.active ?? ''\"\n      [matSortDirection]=\"tableConfig?.sort?.direction ?? ''\"\n      (matSortChange)=\"onSortChange($event)\"\n      multiTemplateDataRows\n    >\n      <ng-container\n        *ngFor=\"let column of tableConfig.columns; index as i; last as isLast; trackBy: trackColumnUniqueId\"\n      >\n        <ng-container *ngIf=\"isLast && column.isSticky && column.allowSort\">\n          <ng-container [matColumnDef]=\"column.uniqueId ?? column.key\" [stickyEnd]=\"!scrollSettings?.scrollEnd\">\n            <th\n              mat-header-cell\n              [start]=\"column.sortStart ?? 'asc'\"\n              [mat-sort-header]=\"column.sortHeader ?? column.key\"\n              *matHeaderCellDef\n              [attr.sortable]=\"column.allowSort ?? false\"\n              [ngStyle]=\"{ width: column.styles?.width, minWidth: column.styles?.['min-width'] }\"\n              [ngClass]=\"column.styles?.alignment ? 'th-' + column.styles?.alignment : ''\"\n              [style.font-weight]=\"'bold'\"\n            >\n              <ng-container *ngIf=\"column.headerCellTemplate; else configValue\">\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    column.headerCellTemplate;\n                    context: { $implicit: column.title, column, colIndex: i }\n                  \"\n                ></ng-container>\n              </ng-container>\n              <ng-template #configValue>\n                <ng-container\n                  [ngTemplateOutlet]=\"columnHeader\"\n                  [ngTemplateOutletContext]=\"{ i, column }\"\n                ></ng-container>\n              </ng-template>\n            </th>\n\n            <td\n              mat-cell\n              *matCellDef=\"let element; let rowIndex = dataIndex\"\n              [align]=\"column.styles?.alignment\"\n              [ngClass]=\"[column.styles?.alignment ? 'td-' + column.styles?.alignment : '']\"\n              (click)=\"\n                onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n              \"\n            >\n              <ui-skeleton\n                class=\"table-skeleton-loader\"\n                [count]=\"1\"\n                [theme]=\"skeletonStyleConfig\"\n                [appearance]=\"'line'\"\n                *ngIf=\"loading; else value\"\n              ></ui-skeleton>\n              <ng-template #value>\n                <div class=\"row-value\">\n                  <ng-container\n                    [ngTemplateOutlet]=\"expandButton\"\n                    [ngTemplateOutletContext]=\"{ index: i, element }\"\n                  ></ng-container>\n\n                  @if (column?.type) {\n                    <ng-container\n                      *ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n                    ></ng-container>\n                  } @else {\n                    <ng-container *ngIf=\"column.rowCellTemplate; else configData\">\n                      <ng-container\n                        *ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n                      ></ng-container>\n                    </ng-container>\n                    <ng-template #configData>\n                      <span\n                        [style.font-weight]=\"column.bold ? 'bold' : 'normal'\"\n                        [style.font-size]=\"column.fontSize ?? '14px'\"\n                        >{{ element | dataPropertyGetter: column.key }}</span\n                      >\n                    </ng-template>\n                  }\n                </div>\n              </ng-template>\n            </td>\n          </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"isLast && column.isSticky && !column.allowSort\">\n          <ng-container\n            [matColumnDef]=\"column.uniqueId ?? column.key\"\n            [stickyEnd]=\"scrollSettings.horizontalScroll ? !scrollSettings.scrollEnd : true\"\n          >\n            <th\n              mat-header-cell\n              *matHeaderCellDef\n              [attr.sortable]=\"column.allowSort ?? false\"\n              [ngStyle]=\"{ width: column.styles?.width, minWidth: column.styles?.['min-width'] }\"\n              [ngClass]=\"column.styles?.alignment ? 'th-' + column.styles?.alignment : ''\"\n              [style.font-weight]=\"'bold'\"\n            >\n              <ng-container *ngIf=\"column.headerCellTemplate; else configValue\">\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    column.headerCellTemplate;\n                    context: { $implicit: column.title, column, colIndex: i }\n                  \"\n                ></ng-container>\n              </ng-container>\n              <ng-template #configValue>\n                <ng-container\n                  [ngTemplateOutlet]=\"columnHeader\"\n                  [ngTemplateOutletContext]=\"{ i, column }\"\n                ></ng-container>\n              </ng-template>\n            </th>\n\n            <td\n              mat-cell\n              *matCellDef=\"let element; let rowIndex = dataIndex\"\n              [align]=\"column.styles?.alignment\"\n              [ngClass]=\"[column.styles?.alignment ? 'td-' + column.styles?.alignment : '']\"\n              (click)=\"\n                onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n              \"\n            >\n              <ui-skeleton\n                class=\"table-skeleton-loader\"\n                [count]=\"1\"\n                [theme]=\"skeletonStyleConfig\"\n                [appearance]=\"'line'\"\n                *ngIf=\"loading; else value\"\n              ></ui-skeleton>\n              <ng-template #value>\n                <div class=\"row-value\">\n                  <ng-container\n                    [ngTemplateOutlet]=\"expandButton\"\n                    [ngTemplateOutletContext]=\"{ index: i, element }\"\n                  ></ng-container>\n\n                  @if (column?.type) {\n                    <ng-container\n                      *ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n                    ></ng-container>\n                  } @else {\n                    <ng-container *ngIf=\"column.rowCellTemplate; else configData\">\n                      <ng-container\n                        *ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n                      ></ng-container>\n                    </ng-container>\n                    <ng-template #configData>\n                      <span\n                        [style.font-weight]=\"column.bold ? 'bold' : 'normal'\"\n                        [style.font-size]=\"column.fontSize ?? '14px'\"\n                        >{{ element | dataPropertyGetter: column.key }}</span\n                      >\n                    </ng-template>\n                  }\n                </div>\n              </ng-template>\n            </td>\n          </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"!(isLast && column.isSticky) && column.allowSort\">\n          <ng-container\n            [matColumnDef]=\"column.uniqueId ?? column.key\"\n            [sticky]=\"(isMobile$ | async) ? false : !scrollSettings.scrollStart && !!column.isSticky\"\n          >\n            <th\n              mat-header-cell\n              [start]=\"column.sortStart ?? 'asc'\"\n              [mat-sort-header]=\"column.sortHeader ?? column.key\"\n              [attr.sortable]=\"column.allowSort ?? false\"\n              *matHeaderCellDef\n              [style.font-weight]=\"'bold'\"\n              [ngStyle]=\"{ width: column.styles?.width, minWidth: column.styles?.['min-width'] }\"\n              [ngClass]=\"column.styles?.alignment ? 'th-' + column.styles?.alignment : ''\"\n            >\n              <ng-container *ngIf=\"column.headerCellTemplate; else configValue\">\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    column.headerCellTemplate;\n                    context: { $implicit: column.title, column, colIndex: i }\n                  \"\n                ></ng-container>\n              </ng-container>\n              <ng-template #configValue>\n                <ng-container\n                  [ngTemplateOutlet]=\"columnHeader\"\n                  [ngTemplateOutletContext]=\"{ i, column }\"\n                ></ng-container>\n              </ng-template>\n            </th>\n\n            <td\n              mat-cell\n              *matCellDef=\"let element; let rowIndex = dataIndex\"\n              [align]=\"column.styles?.alignment\"\n              [ngClass]=\"[column.styles?.alignment ? 'td-' + column.styles?.alignment : '']\"\n              (click)=\"\n                onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n              \"\n            >\n              <ui-skeleton\n                class=\"table-skeleton-loader\"\n                [count]=\"1\"\n                [theme]=\"skeletonStyleConfig\"\n                [appearance]=\"'line'\"\n                *ngIf=\"loading; else value\"\n              ></ui-skeleton>\n              <ng-template #value>\n                <div class=\"row-value\">\n                  <ng-container\n                    [ngTemplateOutlet]=\"expandButton\"\n                    [ngTemplateOutletContext]=\"{ index: i, element }\"\n                  ></ng-container>\n\n                  @if (column?.type) {\n                    <ng-container\n                      *ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n                    ></ng-container>\n                  } @else {\n                    <ng-container *ngIf=\"column.rowCellTemplate; else configData\">\n                      <ng-container\n                        *ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n                      ></ng-container>\n                    </ng-container>\n                    <ng-template #configData>\n                      <span\n                        [style.font-weight]=\"column.bold ? 'bold' : 'normal'\"\n                        [style.font-size]=\"column.fontSize ?? '14px'\"\n                        >{{ element | dataPropertyGetter: column.key }}</span\n                      >\n                    </ng-template>\n                  }\n                </div>\n              </ng-template>\n            </td>\n          </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"!(isLast && column.isSticky) && !column.allowSort\">\n          <ng-container\n            [matColumnDef]=\"column.uniqueId ?? column.key\"\n            [sticky]=\"(isMobile$ | async) ? false : !scrollSettings.scrollStart && !!column.isSticky\"\n          >\n            <th\n              mat-header-cell\n              [attr.sortable]=\"column.allowSort ?? false\"\n              *matHeaderCellDef\n              [style.font-weight]=\"'bold'\"\n              [ngStyle]=\"{ width: column.styles?.width, minWidth: column.styles?.['min-width'] }\"\n              [ngClass]=\"column.styles?.alignment ? 'th-' + column.styles?.alignment : ''\"\n            >\n              <ng-container *ngIf=\"column.headerCellTemplate; else configValue\">\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    column.headerCellTemplate;\n                    context: { $implicit: column.title, column, colIndex: i }\n                  \"\n                ></ng-container>\n              </ng-container>\n              <ng-template #configValue>\n                <ng-container\n                  [ngTemplateOutlet]=\"columnHeader\"\n                  [ngTemplateOutletContext]=\"{ i, column }\"\n                ></ng-container>\n              </ng-template>\n            </th>\n\n            <td\n              mat-cell\n              *matCellDef=\"let element; let rowIndex = dataIndex\"\n              [align]=\"column.styles?.alignment\"\n              [ngClass]=\"[column.styles?.alignment ? 'td-' + column.styles?.alignment : '']\"\n              (click)=\"\n                onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n              \"\n            >\n              <ui-skeleton\n                class=\"table-skeleton-loader\"\n                [count]=\"1\"\n                [theme]=\"skeletonStyleConfig\"\n                [appearance]=\"'line'\"\n                *ngIf=\"loading; else value\"\n              ></ui-skeleton>\n              <ng-template #value>\n                <div class=\"row-value\">\n                  <ng-container\n                    [ngTemplateOutlet]=\"expandButton\"\n                    [ngTemplateOutletContext]=\"{ index: i, element }\"\n                  ></ng-container>\n\n                  @if (column?.type) {\n                    <ng-container\n                      *ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n                    ></ng-container>\n                  } @else {\n                    <ng-container *ngIf=\"column.rowCellTemplate; else configData\">\n                      <ng-container\n                        *ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n                      ></ng-container>\n                    </ng-container>\n                    <ng-template #configData>\n                      <span\n                        [style.font-weight]=\"column.bold ? 'bold' : 'normal'\"\n                        [style.font-size]=\"column.fontSize ?? '14px'\"\n                        >{{ element | dataPropertyGetter: column.key }}</span\n                      >\n                    </ng-template>\n                  }\n                </div>\n              </ng-template>\n            </td>\n          </ng-container>\n        </ng-container>\n      </ng-container>\n\n      <ng-container matColumnDef=\"expandedDetail\">\n        <td mat-cell *matCellDef=\"let element\" [attr.colspan]=\"displayedColumns.length\">\n          <div\n            class=\"element-detail\"\n            *ngIf=\"dataSourceDetail.data.length\"\n            [@expandDetail]=\"element === elementDetail ? 'expanded' : 'collapsed'\"\n          >\n            <table\n              mat-table\n              [dataSource]=\"dataSourceDetail\"\n              [ngClass]=\"{ 'hide-borders': element === tableData[tableData.length - 1] }\"\n            >\n              <ng-container\n                *ngFor=\"let tableColumn of tableDetailColumns.columnDefs\"\n                [matColumnDef]=\"tableColumn.title ?? ''\"\n              >\n                <th\n                  mat-header-cell\n                  *matHeaderCellDef=\"let element\"\n                  arrowPosition=\"after\"\n                  [ngStyle]=\"{ width: tableColumn.styles?.width }\"\n                  [ngClass]=\"tableColumn.styles?.alignment ? 'th-' + tableColumn.styles?.alignment : ''\"\n                >\n                  {{ tableColumn.title | uppercase }}\n                </th>\n\n                <td\n                  mat-cell\n                  *matCellDef=\"let element\"\n                  (click)=\"onDetailRowClick(element)\"\n                  [align]=\"tableColumn.styles?.alignment\"\n                  [ngClass]=\"tableColumn.styles?.alignment ? 'td-' + tableColumn.styles?.alignment : ''\"\n                  [ngStyle]=\"{ width: tableColumn.styles?.width }\"\n                >\n                  <ng-container *ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn }\"></ng-container>\n                </td>\n              </ng-container>\n\n              <tr mat-header-row *matHeaderRowDef=\"columnsDetailToDisplay\"></tr>\n              <tr mat-row *matRowDef=\"let rowDetail; columns: columnsDetailToDisplay\"></tr>\n            </table>\n          </div>\n        </td>\n      </ng-container>\n\n      <ng-template #tableDataTpl let-element=\"element\" let-tableColumn=\"tableColumn\">\n        <div class=\"align-wrapper\">\n          <ng-container [ngSwitch]=\"tableColumn.type\">\n            <ng-container *ngSwitchCase=\"DataType.FIELD\">\n              {{ element | dataPropertyGetter: tableColumn.key }}\n            </ng-container>\n            <ng-container *ngSwitchCase=\"DataType.FUNCTION\">\n              {{ tableColumn.function?.(element) }}\n            </ng-container>\n            <ng-container *ngSwitchCase=\"DataType.RENDERER\">\n              <ng-template [dynamicComponent]=\"[tableColumn.renderer, element] | memoizeFunc: callRenderer\">\n              </ng-template>\n            </ng-container>\n            <ng-container *ngSwitchDefault>\n              {{ element | dataPropertyGetter: tableColumn.key }}\n            </ng-container>\n          </ng-container>\n        </div>\n      </ng-template>\n\n      <tr\n        mat-header-row\n        *matHeaderRowDef=\"displayedColumns; sticky: stickyHeader\"\n        [class.is-title-present]=\"tableConfig.title\"\n      ></tr>\n      <tr\n        mat-row\n        *matRowDef=\"let row; columns: displayedColumns\"\n        [ngClass]=\"{\n          'expanded-row': elementDetail === row,\n          'row-clickable': tableDetails,\n          selected: row?.selected,\n          'last-row': row === tableData[tableData.length - 1] && !elementDetail,\n        }\"\n        (click)=\"toggleRow(row)\"\n      ></tr>\n      <ng-container *ngIf=\"tableDetails && tableDetailColumns?.columnDefs?.length\">\n        <tr mat-row *matRowDef=\"let row; columns: ['expandedDetail']\" class=\"detail-row\"></tr>\n      </ng-container>\n\n      <ng-container *ngIf=\"tableConfig.noDataRowTpl\">\n        <tr *matNoDataRow>\n          <ng-container *ngTemplateOutlet=\"tableConfig.noDataRowTpl\"></ng-container>\n        </tr>\n      </ng-container>\n    </table>\n  </div>\n\n  <ui-paginator\n    *ngIf=\"!tableConfig?.hidePagination && tableConfig?.pagination\"\n    [disabled]=\"loading\"\n    [applicationTheme]=\"applicationTheme !== 'classic' ? 'light' : 'classic'\"\n    [pageSize]=\"tableConfig.pagination?.itemsPerPage ?? 25\"\n    [length]=\"tableConfig.pagination?.totalItems ?? 0\"\n    [currentPage]=\"tableConfig.pagination?.currentPage ?? 0\"\n    [pageSizeOptions]=\"tableConfig.pagination?.itemsPerPageOptions ?? [10, 25, 50]\"\n    (paginatorChange)=\"onPaginatorChange($event)\"\n  ></ui-paginator>\n</div>\n\n<ng-template #expandButton let-i=\"index\" let-element=\"element\">\n  <ui-button\n    [applicationTheme]=\"applicationTheme\"\n    *ngIf=\"!i && tableDetails\"\n    variant=\"icon-button\"\n    [ngClass]=\"{ opened: elementDetail && element === elementDetail }\"\n    [iconName]=\"elementDetail && element === elementDetail ? 'Arrow-chevron-up-in-line' : 'Arrow-chevron-down-in-line'\"\n  ></ui-button>\n</ng-template>\n\n<ng-template #columnHeader let-column=\"column\" let-i=\"i\">\n  <div class=\"header-section\">\n    <span uiEllipseText (onChangeTextState)=\"onChangeColumnSize(i, $event)\" class=\"column-title\"\n      >{{ column.title | sentencecase }}\n    </span>\n    <ui-icon\n      *ngIf=\"column?.showTooltip\"\n      [name]=\"'Help-in-line'\"\n      [matTooltipClass]=\"applicationTheme\"\n      [matTooltip]=\"(column?.showTooltip ? (column?.tooltip ? column.tooltip : column.title) : '') || ''\"\n    ></ui-icon>\n  </div>\n</ng-template>\n", styles: ["@import\"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\";.bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host-context(.without-table-border) .table-container{border:none}.flex-left,.table-container .table-header{display:flex;justify-content:flex-start;align-items:center}.table-container{--mat-table-background-color: #ffffff;overflow:hidden;border:1px #e0e0e0 solid;border-radius:8px}.table-container ::ng-deep .mat-sort-header-arrow{color:#000}.table-container .table-header{min-height:56px;padding:8px;background:#fff;line-height:24px;font-size:16px;font-weight:700;text-transform:uppercase;display:flex;justify-content:space-between}.table-container .table-wrapper{max-width:100%;overflow:auto}.table-container .table-wrapper.sticky-header{max-height:var(--table-max-height);overflow-y:auto}.table-container .table-wrapper table.main-table{width:100%;box-shadow:unset}.table-container .table-wrapper table.main-table.sort-disabled ::ng-deep .mat-sort-header{pointer-events:none;cursor:default}.table-container .table-wrapper table.main-table.sort-disabled ::ng-deep .mat-sort-header .mat-sort-header-container{cursor:default}.table-container .table-wrapper table.main-table ::ng-deep .mat-sort-header-arrow{margin-left:8px}.table-container .table-wrapper table.main-table .mdc-data-table__cell,.table-container .table-wrapper table.main-table .mdc-data-table__header-cell{padding:8px 24px}.table-container .table-wrapper table.main-table.condensed .mat-mdc-row .mdc-data-table__cell:not(:first-child):not(:last-child),.table-container .table-wrapper table.main-table.condensed .mat-mdc-row .mdc-data-table__header-cell:not(:first-child):not(:last-child),.table-container .table-wrapper table.main-table.condensed .mat-mdc-header-row .mdc-data-table__cell:not(:first-child):not(:last-child),.table-container .table-wrapper table.main-table.condensed .mat-mdc-header-row .mdc-data-table__header-cell:not(:first-child):not(:last-child){padding:8px 12px}.table-container .table-wrapper table.main-table.condensed .mat-mdc-row .mdc-data-table__cell:first-child,.table-container .table-wrapper table.main-table.condensed .mat-mdc-row .mdc-data-table__header-cell:first-child,.table-container .table-wrapper table.main-table.condensed .mat-mdc-header-row .mdc-data-table__cell:first-child,.table-container .table-wrapper table.main-table.condensed .mat-mdc-header-row .mdc-data-table__header-cell:first-child{padding:8px 12px 8px 24px}.table-container .table-wrapper table.main-table.condensed .mat-mdc-row .mdc-data-table__cell:last-child,.table-container .table-wrapper table.main-table.condensed .mat-mdc-row .mdc-data-table__header-cell:last-child,.table-container .table-wrapper table.main-table.condensed .mat-mdc-header-row .mdc-data-table__cell:last-child,.table-container .table-wrapper table.main-table.condensed .mat-mdc-header-row .mdc-data-table__header-cell:last-child{padding:8px 24px 8px 12px}.table-container .table-wrapper table.main-table th{font-size:14px;line-height:16px;text-transform:uppercase}.table-container .table-wrapper table.main-table tr.is-title-present th.mat-mdc-header-cell.mdc-data-table__header-cell{border-top:1px solid #e0e0e0}.table-container .table-wrapper table.main-table td{font-size:14px;line-height:20px}.table-container .table-wrapper table.main-table td .row-value{display:flex;align-items:center;gap:16px}.table-container .table-wrapper table.main-table td .row-value ui-icon ::ng-deep mat-icon{transition:all .3s!important;font-size:24px}.table-container .table-wrapper table.main-table td .row-value ui-icon.opened ::ng-deep mat-icon{transform:rotate(180deg)}.table-container .table-wrapper table.main-table td ::ng-deep .table-skeleton-loader ngx-skeleton-loader{display:flex;justify-content:center;align-items:center;line-height:unset}.table-container .table-wrapper table.main-table td ::ng-deep .table-skeleton-loader ngx-skeleton-loader .skeleton-loader{margin-bottom:0}.table-container .table-wrapper table.main-table ::ng-deep thead{background:#f6f6f6!important}.table-container .table-wrapper table.main-table .mat-mdc-table-sticky-border-elem-left{box-shadow:24px 8px 24px #00000014}.table-container .table-wrapper table.main-table .mat-mdc-table-sticky-border-elem-right{box-shadow:0 8px 24px 4px #00000014}.table-container .header-section{display:flex;gap:4px;align-items:center}.table-container .header-section .column-title{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%;max-width:fit-content;font-weight:700}.table-container.without-title table{border:unset!important}.table-container.disable-border-radius{border-radius:0!important}.table-container ::ng-deep .mat-mdc-paginator-container{padding:0 24px}.table-container[theme=dark],.table-container[theme=light]{border-radius:10px}.table-container[theme=dark] tr.selected,.table-container[theme=light] tr.selected{background:#f4f4f4!important}.table-container[theme=dark] .table-header,.table-container[theme=light] .table-header{padding:8px 24px;text-transform:none}.table-container[theme=dark] .table-wrapper table th,.table-container[theme=light] .table-wrapper table th{text-transform:none}.table-container[theme=dark] .table-wrapper table td,.table-container[theme=light] .table-wrapper table td{transition:border .3s}.table-container[theme=dark] .table-wrapper table tr.last-row td,.table-container[theme=light] .table-wrapper table tr.last-row td{--mat-table-row-item-outline-color: rgb(0, 0, 0, 0)}.table-container[theme=dark] .table-wrapper table .mat-mdc-table-sticky-border-elem-right,.table-container[theme=light] .table-wrapper table .mat-mdc-table-sticky-border-elem-right{box-shadow:0 8px 24px 4px #24242414!important}.table-container[theme=dark] .table-wrapper table .mat-mdc-table-sticky-border-elem-left,.table-container[theme=light] .table-wrapper table .mat-mdc-table-sticky-border-elem-left{box-shadow:24px 8px 24px #24242414!important}.table-container[theme=dark] .table-wrapper table ::ng-deep thead,.table-container[theme=light] .table-wrapper table ::ng-deep thead{background-color:#fff!important}.table-container[theme=dark] .table-wrapper table ::ng-deep :not(thead) tr:hover,.table-container[theme=light] .table-wrapper table ::ng-deep :not(thead) tr:hover{background-color:#fff2fc}.table-container ::ng-deep tr.detail-row{height:0}.table-container ::ng-deep tr.detail-row td{border:unset!important}.table-container ::ng-deep .mat-column-expandedDetail{padding:0!important}.table-container ::ng-deep .element-detail{overflow:hidden!important;display:flex!important}.table-container ::ng-deep .element-detail table{background-color:#fff;border-bottom:1px solid #d3d3d3;transition:border .3s}.table-container ::ng-deep .element-detail table.hide-borders{border-bottom:unset}.table-container ::ng-deep .element-detail table .mat-mdc-header-row{visibility:collapse}.table-container ::ng-deep .element-detail table .mat-mdc-cell{border-width:0}.table-container ::ng-deep .element-detail table td:first-child{padding-left:64px!important}table th.th-right{text-align:right}table th.th-right ::ng-deep .header-section{justify-content:end}table th.th-left{text-align:left}table th.th-left ::ng-deep .header-section{justify-content:start}table th.th-center{text-align:center}table th.th-center ::ng-deep .header-section{justify-content:center}table td.td-right{text-align:right}table td.td-right div{justify-content:end}table td.td-left{text-align:left}table td.td-left div{justify-content:start}table td.td-center{text-align:center}table td.td-center div{justify-content:center}::ng-deep table:not(.main-table) thead{display:none!important}ui-paginator{width:100%;display:flex;justify-content:flex-end;border-top:1px solid #d3d3d3}ui-paginator ::ng-deep .mat-mdc-paginator{width:100%}::ng-deep .mat-mdc-tooltip{background-color:#a9c2c9;font-family:Open Sans,serif;font-weight:400;font-size:12px;border-radius:4px;overflow:visible;max-width:248px;padding:6px 2px;--mdc-plain-tooltip-container-color: none;--mdc-plain-tooltip-supporting-text-color: $tgo-black}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i2.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i2.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i2.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i2.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i2.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i2.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i2.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i4.SkeletonComponent, selector: "ui-skeleton", inputs: ["count", "theme", "appearance", "isAiTheme", "applicationTheme"] }, { kind: "component", type: i5.PaginatorComponent, selector: "ui-paginator", inputs: ["pageSizeOptions", "length", "pageSize", "disabled", "applicationTheme", "currentPage"], outputs: ["paginatorChange"] }, { kind: "component", type: i6.ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "loadingWithLabel", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaExpanded", "ariaControls", "ariaPressed", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "directive", type: i7.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i7.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i8.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "directive", type: i9.EllipseTextDirective, selector: "[uiEllipseText]", inputs: ["isMultiline", "maxDiffPixels", "refresh"], outputs: ["onChangeTextState"] }, { kind: "directive", type: i9.DynamicComponentDirective, selector: "[dynamicComponent]", inputs: ["dynamicComponent"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i9.DataPropertyGetterPipe, name: "dataPropertyGetter" }, { kind: "pipe", type: i9.MemoizeFuncPipe, name: "memoizeFunc" }, { kind: "pipe", type: SentenceCasePipe, name: "sentencecase" }], animations: [
             trigger('expandDetail', [
                 state('collapsed, void', style({ height: '0px' })),
                 state('expanded', style({ height: '*' })),