npm - @testgorilla/tgo-ui - Versions diffs - 12.2.0 → 12.3.2 - Mend

@testgorilla/tgo-ui 12.2.0 → 12.3.2

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 (85) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"testgorilla-tgo-ui-components-snackbar.mjs","names":[],"sources":["../../../components/snackbar/snackbar.component.ts","../../../components/snackbar/snackbar.component.html","../../../components/snackbar/snackbar.service.ts","../../../components/snackbar/snackbar.component.module.ts"],"sourcesContent":["import { animate, style, transition, trigger } from '@angular/animations';\nimport { NgClass, AsyncPipe, UpperCasePipe, SlicePipe } from '@angular/common';\nimport { ChangeDetectionStrategy, ChangeDetectorRef, Component, Inject, Input, OnInit, Optional } from '@angular/core';\nimport { MAT_SNACK_BAR_DATA, MatSnackBarRef } from '@angular/material/snack-bar';\nimport { MatTooltip } from '@angular/material/tooltip';\n\nimport { LinkTargetType } from '@testgorilla/tgo-ui/components/alert-banner';\nimport { ButtonComponent } from '@testgorilla/tgo-ui/components/button';\nimport { alertBarsUtil, ApplicationTheme, UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconName, IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\n\nimport { SnackbarLink, SnackbarType, SnackbarVariant } from './snackbar.model';\n\n@Component({\n selector: 'ui-snackbar',\n changeDetection: ChangeDetectionStrategy.OnPush,\n templateUrl: './snackbar.component.html',\n styleUrls: ['./snackbar.component.scss'],\n /* eslint-disable @typescript-eslint/no-deprecated -- the @angular/animations trigger/state/style/animate/transition DSL is deprecated in 20.2 in favor of template-level animate.enter/animate.leave; migrating every Material/component animation is out of scope for this lint pass /\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 imports: [\n NgClass,\n MatTooltip,\n IconComponentModule,\n ButtonComponent,\n AsyncPipe,\n UpperCasePipe,\n SlicePipe,\n UiTranslatePipe,\n ],\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 @Input() testId: string \| null = null;\n\n get dismissButtonTestId(): string \| null {\n return this.testId ? `${this.testId}-dismiss` : null;\n }\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 readonly data: {\n snackbarType: SnackbarType;\n message: string;\n link?: SnackbarLink;\n applicationTheme?: ApplicationTheme;\n html?: string;\n seconds?: number;\n },\n private readonly snackbarRef: MatSnackBarRef<SnackbarComponent>,\n private readonly cdr: ChangeDetectorRef\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 // `visible` gates the template and this runs from setTimeout.\n this.cdr.markForCheck();\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 @if (visible) {\n <!-- Kept as role=\"alert\": the E2E suite reads the message through getByRole('alert'). -->\n <div\n [ngClass]=\"snackbarType + ' ' + position\"\n [@openClose]\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 [attr.data-testid]=\"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 @if (!!linkText) {\n <a [target]=\"linkTarget\" [href]=\"linkUrl\" (click)=\"onLinkClick($event)\">{{ linkText }}</a>\n }\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 @if (applicationTheme === 'classic') {\n <ui-icon [name]=\"iconName\" size=\"24\"></ui-icon>\n }\n {{ message.length > maxCharacters ? (message \| slice: 0 : maxCharacters) + '..' : message }}\n @if (safeHtml) {\n <div [innerHTML]=\"safeHtml\"></div>\n }\n @if (!!linkText) {\n <a [target]=\"linkTarget\" [href]=\"linkUrl\" (click)=\"onLinkClick($event)\">{{ linkText }}</a>\n }\n </div>\n @if (includeDismissButton && applicationTheme === 'classic') {\n <ui-button\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 [testId]=\"dismissButtonTestId\"\n ></ui-button>\n }\n @if (includeDismissButton && applicationTheme !== 'classic') {\n <ui-button\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 [ariaLabel]=\"(closeButtonTooltip \|\| ('COMMON.CLOSE' \| uiTranslate \| async))!\"\n data-testid=\"snackbar-dismiss-button\"\n [testId]=\"dismissButtonTestId\"\n ></ui-button>\n }\n </div>\n }\n</ng-container>\n","import { Injectable } from '@angular/core';\nimport { MatSnackBar } from '@angular/material/snack-bar';\n\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\n\nimport { SnackbarComponent } from './snackbar.component';\nimport { SnackbarLink, SnackbarType } from './snackbar.model';\n\n@Injectable()\nexport class SnackbarService {\n constructor(private readonly 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 // eslint-disable-next-line max-params -- public method signature; options-object refactor is breaking, deferred to the breaking-change MAJOR (see plan)\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 { MatSnackBarModule } from '@angular/material/snack-bar';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport { UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\n\nimport { SnackbarComponent } from './snackbar.component';\nimport { SnackbarService } from './snackbar.service';\n\n@NgModule({\n imports: [\n CommonModule,\n ButtonComponentModule,\n IconComponentModule,\n UiTranslatePipe,\n MatSnackBarModule,\n MatTooltipModule,\n SnackbarComponent,\n ],\n exports: [SnackbarComponent],\n providers: [SnackbarService],\n})\nexport class SnackbarComponentModule {}\n"],"mappings":"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"}
1	+ {"version":3,"file":"testgorilla-tgo-ui-components-snackbar.mjs","names":[],"sources":["../../../components/snackbar/snackbar.component.ts","../../../components/snackbar/snackbar.component.html","../../../components/snackbar/snackbar.service.ts","../../../components/snackbar/snackbar.component.module.ts"],"sourcesContent":["import { animate, style, transition, trigger } from '@angular/animations';\nimport { NgClass, AsyncPipe, UpperCasePipe, SlicePipe } from '@angular/common';\nimport { ChangeDetectionStrategy, ChangeDetectorRef, Component, Inject, Input, OnInit, Optional } from '@angular/core';\nimport { MAT_SNACK_BAR_DATA, MatSnackBarRef } from '@angular/material/snack-bar';\nimport { MatTooltip } from '@angular/material/tooltip';\n\nimport { LinkTargetType } from '@testgorilla/tgo-ui/components/alert-banner';\nimport { ButtonComponent } from '@testgorilla/tgo-ui/components/button';\nimport { alertBarsUtil, ApplicationTheme, UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconName, IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\n\nimport { SnackbarLink, SnackbarType, SnackbarVariant } from './snackbar.model';\n\n@Component({\n selector: 'ui-snackbar',\n changeDetection: ChangeDetectionStrategy.OnPush,\n templateUrl: './snackbar.component.html',\n styleUrls: ['./snackbar.component.scss'],\n /* eslint-disable @typescript-eslint/no-deprecated -- the @angular/animations trigger/state/style/animate/transition DSL is deprecated in 20.2 in favor of template-level animate.enter/animate.leave; migrating every Material/component animation is out of scope for this lint pass /\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 imports: [\n NgClass,\n MatTooltip,\n IconComponentModule,\n ButtonComponent,\n AsyncPipe,\n UpperCasePipe,\n SlicePipe,\n UiTranslatePipe,\n ],\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 @Input() testId: string \| null = null;\n\n get dismissButtonTestId(): string \| null {\n return this.testId ? `${this.testId}-dismiss` : null;\n }\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 readonly data: {\n snackbarType: SnackbarType;\n message: string;\n link?: SnackbarLink;\n applicationTheme?: ApplicationTheme;\n html?: string;\n seconds?: number;\n },\n private readonly snackbarRef: MatSnackBarRef<SnackbarComponent>,\n private readonly cdr: ChangeDetectorRef\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 // `visible` gates the template and this runs from setTimeout.\n this.cdr.markForCheck();\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 @if (visible) {\n <!-- Kept as role=\"alert\": the E2E suite reads the message through getByRole('alert'). -->\n <div\n [ngClass]=\"snackbarType + ' ' + position\"\n [@openClose]\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 [attr.data-testid]=\"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 @if (!!linkText) {\n <a [target]=\"linkTarget\" [href]=\"linkUrl\" (click)=\"onLinkClick($event)\">{{ linkText }}</a>\n }\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 @if (applicationTheme === 'classic') {\n <ui-icon [name]=\"iconName\" size=\"24\"></ui-icon>\n }\n {{ message.length > maxCharacters ? (message \| slice: 0 : maxCharacters) + '..' : message }}\n @if (safeHtml) {\n <div [innerHTML]=\"safeHtml\"></div>\n }\n @if (!!linkText) {\n <a [target]=\"linkTarget\" [href]=\"linkUrl\" (click)=\"onLinkClick($event)\">{{ linkText }}</a>\n }\n </div>\n @if (includeDismissButton && applicationTheme === 'classic') {\n <ui-button\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 [testId]=\"dismissButtonTestId\"\n ></ui-button>\n }\n @if (includeDismissButton && applicationTheme !== 'classic') {\n <ui-button\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 [ariaLabel]=\"(closeButtonTooltip \|\| ('COMMON.CLOSE' \| uiTranslate \| async))!\"\n data-testid=\"snackbar-dismiss-button\"\n [testId]=\"dismissButtonTestId\"\n ></ui-button>\n }\n </div>\n }\n</ng-container>\n","import { Injectable } from '@angular/core';\nimport { MatSnackBar } from '@angular/material/snack-bar';\n\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\n\nimport { SnackbarComponent } from './snackbar.component';\nimport { SnackbarLink, SnackbarType } from './snackbar.model';\n\n@Injectable()\nexport class SnackbarService {\n constructor(private readonly 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 // eslint-disable-next-line max-params -- public method signature; options-object refactor is breaking, deferred to the breaking-change MAJOR (see plan)\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 { MatSnackBarModule } from '@angular/material/snack-bar';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport { UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\n\nimport { SnackbarComponent } from './snackbar.component';\nimport { SnackbarService } from './snackbar.service';\n\n@NgModule({\n imports: [\n CommonModule,\n ButtonComponentModule,\n IconComponentModule,\n UiTranslatePipe,\n MatSnackBarModule,\n MatTooltipModule,\n SnackbarComponent,\n ],\n exports: [SnackbarComponent],\n providers: [SnackbarService],\n})\nexport class SnackbarComponentModule {}\n"],"mappings":"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"}

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

@@ -344,7 +344,7 @@ var StepperComponent = class StepperComponent {
 		}
 	}
 	set setSelectedIndex(value) {
-		this.selectedIndex = value;
+		this.selectedIndex = value ?? null;
 		if (!this.firstStepAutoSelect) this.itemSteps = this.itemSteps.map((step, i) => ({
 			...step,
 			isVisited: i === 0 && this.selectedIndex === -1 ? false : step.isVisited

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

	@@ -1 +1 @@
1	- {"version":3,"file":"testgorilla-tgo-ui-components-stepper.mjs","names":["i2"],"sources":["../../../components/stepper/step-line-element.directive.ts","../../../components/stepper/step.component.ts","../../../components/stepper/step.component.html","../../../components/stepper/stepper.component.ts","../../../components/stepper/stepper.component.html","../../../components/stepper/step.component.module.ts","../../../components/stepper/stepper.component.module.ts"],"sourcesContent":["import { Directive, ElementRef, HostListener, Input, OnChanges } from '@angular/core';\n\nimport { StepperPosition } from './stepper.model';\n\nconst MARGINS = 36;\nconst PADDING = 16;\n\n/*\n Directive is used to draw lines between steps\n /\n@Directive({\n // eslint-disable-next-line @angular-eslint/directive-selector -- public directive selector; ui-prefix rename is breaking, deferred to the breaking-change MAJOR (see plan)\n selector: '[stepLineElement]',\n})\nexport class StepLineElementDirective implements OnChanges {\n @Input() stepLineElement: HTMLElement;\n @Input() position: StepperPosition = 'horizontal';\n\n @HostListener('window:resize.out-zone')\n resize(): void {\n this.setSize();\n }\n\n constructor(private readonly el: ElementRef<HTMLElement>) {}\n\n setSize(): void {\n if (this.position === 'horizontal') {\n this.el.nativeElement.style.width = `calc(100% + ${this.stepLineElement.getBoundingClientRect().width / 2 - PADDING}px)`;\n this.el.nativeElement.style.height = `0`;\n this.el.nativeElement.style.top = '45px';\n this.el.nativeElement.style.left = `-${this.stepLineElement.getBoundingClientRect().width / 2 - MARGINS}px`;\n } else {\n this.el.nativeElement.style.height = `calc(100% + ${this.stepLineElement.getBoundingClientRect().height / 2 - PADDING}px)`;\n this.el.nativeElement.style.width = '0';\n this.el.nativeElement.style.top = `-${this.stepLineElement.getBoundingClientRect().height / 2 - 30}px`;\n this.el.nativeElement.style.left = '34px';\n }\n }\n\n ngOnChanges(): void {\n queueMicrotask(() => {\n this.setSize();\n });\n }\n}\n","import { FocusMonitor } from '@angular/cdk/a11y';\nimport { NgClass, NgTemplateOutlet } from '@angular/common';\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n DestroyRef,\n ElementRef,\n EventEmitter,\n Inject,\n Input,\n Optional,\n Output,\n signal,\n TemplateRef,\n ViewChild,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { MatTooltip } from '@angular/material/tooltip';\n\nimport { ApplicationTheme, IKeyboardEvent } from '@testgorilla/tgo-ui/components/core';\nimport { IconName, IconComponent } from '@testgorilla/tgo-ui/components/icon';\nimport { TooltipPositionType, TooltipComponentModule } from '@testgorilla/tgo-ui/components/tooltip';\n\nimport { HtmlDescription, StepperPosition, StepperVariation } from './stepper.model';\n\n@Component({\n selector: 'ui-step',\n templateUrl: './step.component.html',\n styleUrls: ['./step.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [TooltipComponentModule, NgClass, IconComponent, MatTooltip, NgTemplateOutlet],\n})\nexport class StepComponent implements AfterViewInit {\n /\n Input property for the label of the step.\n \n @memberof StepComponent\n /\n @Input() label: string;\n\n /\n Input property indicating whether the step has been visited.\n \n @memberof StepComponent\n /\n @Input() isVisited: boolean;\n\n /\n Input property indicating whether the form has been submitted.\n \n @memberof StepComponent\n /\n @Input() submitted: boolean;\n\n /\n Input property for the icon associated with the step.\n \n @memberof StepComponent\n /\n @Input() icon: IconName \| undefined = '';\n\n /\n Input property for the index of the step.\n \n @memberof StepComponent\n /\n @Input() index: number;\n\n /\n Input property indicating whether the step is currently selected.\n \n @memberof StepComponent\n /\n @Input() selected: boolean;\n\n /\n Input property indicating whether the step is the last step in the stepper.\n \n @memberof StepComponent\n /\n @Input() isLast: boolean;\n\n /\n Input property indicating the selected index in the stepper.\n \n @memberof StepComponent\n /\n @Input() selectedIndex: number;\n\n /\n Input property indicating whether the step is disabled.\n \n @memberof StepComponent\n /\n @Input() disabled = false;\n\n /\n Input property indicating whether the previous step has been visited.\n \n @memberof StepComponent\n /\n @Input() prevStepIsVisited: boolean \| undefined = false;\n\n /\n Input property indicating whether the component is in mobile mode.\n \n @memberof StepComponent\n /\n @Input() mobileMode = false;\n\n /\n Input property indicating whether the component is in large tablet mode.\n \n @memberof StepComponent\n /\n @Input() largeTabletMode: boolean \| null = false;\n\n /\n Input property indicating whether the final icon should be displayed.\n \n @memberof StepComponent\n /\n @Input() finalIcon = false;\n\n /\n Input property indicating to display icon when step is selected.\n \n @memberof StepComponent\n /\n @Input() showIconWhenSelected = false;\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof StepComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /\n \n * Defines the stepper position\n \n @type {StepperPosition}\n * @memberof StepComponent\n /\n @Input() position: StepperPosition;\n\n /\n \n * Step description\n \n @type {HtmlDescription[]}\n * @memberof StepComponent\n /\n @Input() htmlDescription: HtmlDescription[] = [];\n\n /\n \n * Sets bold font weight for label\n \n @type {boolean}\n * @memberof StepComponent\n /\n @Input() boldLabel = false;\n\n /\n \n * Template for the step description\n \n @type {TemplateRef}\n * @memberof StepComponent\n /\n @Input() descriptionTpl?: TemplateRef<unknown>;\n\n /\n \n * Tooltip for the step label\n \n @type {string}\n * @memberof StepComponent\n /\n @Input() labelTooltip?: string;\n\n /\n \n * Always show step icon instead of number\n \n @type {boolean}\n * @memberof StepComponent\n /\n @Input() alwaysShowIcon = false;\n\n /\n \n * Context for the step template\n \n @type {any}\n * @memberof StepComponent\n /\n @Input() context: unknown;\n\n /\n A string representing the step variant.\n * This attribute is used to indicate the variant that should be used.\n * @type {string}\n * @memberof StepComponent\n /\n @Input() stepVariant: StepperVariation = 'primary';\n\n /\n Event emitted when the step was clicked.\n * @type {number}\n * @memberof StepComponent\n /\n @Output() stepSelected = new EventEmitter<number>();\n\n @ViewChild('step') stepElement: ElementRef<HTMLElement>;\n\n protected readonly TooltipPositionType = TooltipPositionType;\n\n protected keyboardFocused = signal(false);\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme,\n private readonly focusMonitor: FocusMonitor,\n private readonly destroyRef: DestroyRef\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n }\n\n ngAfterViewInit() {\n this.subscriberFocus();\n }\n\n protected get hasLastStepDefaultIcon(): boolean {\n return !this.showIconWhenSelected \|\| (this.showIconWhenSelected && !this.selected);\n }\n\n protected onStepSelected(index: number): void {\n if (!this.disabled) {\n this.stepSelected.emit(index);\n }\n }\n\n protected subscriberFocus(): void {\n this.focusMonitor\n .monitor(this.stepElement.nativeElement)\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(origin => this.keyboardFocused.set(origin === 'keyboard'));\n }\n\n onKeydown($event: KeyboardEvent): void {\n if ($event.key === (IKeyboardEvent.ENTER as string) \|\| $event.key === (IKeyboardEvent.SPACE as string)) {\n this.onStepSelected(this.index);\n } else if ($event.key === (IKeyboardEvent.ARROW_UP as string)) {\n const prevIndex = this.index - 1;\n const prevElement = document.getElementById(`step-${prevIndex}`);\n\n if (!prevElement) {\n return;\n }\n this.focusMonitor.focusVia(prevElement, 'keyboard');\n } else if ($event.key === (IKeyboardEvent.ARROW_DOWN as string)) {\n const nextIndex = this.index + 1;\n const nextElement = document.getElementById(`step-${nextIndex}`);\n\n if (!nextElement) {\n return;\n }\n this.focusMonitor.focusVia(nextElement, 'keyboard');\n }\n }\n}\n","@if (!mobileMode) {\n <ui-tooltip\n [message]=\"stepVariant === 'secondary' && largeTabletMode ? label : ''\"\n [position]=\"TooltipPositionType.BOTTOM\"\n >\n <div\n class=\"step-container\"\n #step\n tabindex=\"0\"\n [attr.tabindex]=\"disabled ? -1 : 0\"\n role=\"button\"\n [ngClass]=\"{\n 'secondary-step-variant': stepVariant === 'secondary',\n 'visited-next': isVisited && index > selectedIndex,\n 'visited-prev': isVisited && index < selectedIndex,\n active: selected,\n 'last-step': finalIcon && hasLastStepDefaultIcon && !alwaysShowIcon,\n disabled: disabled,\n vertical: position === 'vertical',\n 'keyboard-focused': keyboardFocused(),\n }\"\n [attr.theme]=\"applicationTheme\"\n (keydown.enter)=\"onStepSelected(index)\"\n (keydown.space)=\"$event.preventDefault(); onStepSelected(index)\"\n (click)=\"onStepSelected(index)\"\n >\n <div class=\"step-icon\">\n @if (index && stepVariant === 'primary') {\n <div class=\"line\" [ngClass]=\"{ visited: prevStepIsVisited }\"></div>\n }\n\n @if (!finalIcon) {\n <div class=\"icon-wrapper\">\n @switch (true) {\n @case (isVisited && !selected && !alwaysShowIcon) {\n <ui-icon\n size=\"24\"\n [name]=\"stepVariant === 'secondary' ? 'Check-small-filled' : 'Check'\"\n [color]=\"\n (isVisited && index < selectedIndex) \|\| stepVariant === 'secondary'\n ? 'white'\n : applicationTheme === 'classic'\n ? 'petrol'\n : 'rebrand-black'\n \"\n ></ui-icon>\n }\n @case ((selected && !!icon) \|\| alwaysShowIcon) {\n <ui-icon\n [size]=\"'24'\"\n [name]=\"icon!\"\n [color]=\"isLast && !selected ? 'rebrand-black' : 'white'\"\n ></ui-icon>\n }\n @default {\n {{ index + 1 }}\n }\n }\n </div>\n } @else {\n @if (hasLastStepDefaultIcon && !alwaysShowIcon) {\n <img\n [alt]=\"'step-finish-image'\"\n [attr.src]=\"\n applicationTheme === 'classic'\n ? '/images/step-finish.svg'\n : isVisited\n ? '/images/rebrand-last-step-icon-light.svg'\n : '/images/rebrand-last-step-icon-black.svg'\n \"\n />\n } @else {\n <div class=\"icon-wrapper\">\n @if (icon \|\| (icon && alwaysShowIcon)) {\n <ui-icon [size]=\"'24'\" [name]=\"icon\" [color]=\"'white'\"></ui-icon>\n } @else {\n {{ index + 1 }}\n }\n </div>\n }\n }\n </div>\n\n <div class=\"steps-label\">\n @if (label) {\n <div class=\"step-label\" [ngClass]=\"{ 'step-bold-label': boldLabel }\" [matTooltip]=\"labelTooltip ?? ''\">\n {{ label }}\n </div>\n }\n\n <div class=\"step-description-container\">\n @for (description of htmlDescription; track description) {\n <div class=\"step-description\">\n <div>{{ description.text }}</div>\n @if (description.iconName) {\n <ui-icon\n [name]=\"description.iconName\"\n [size]=\"'24'\"\n [matTooltip]=\"description.iconTooltip ?? ''\"\n ></ui-icon>\n }\n </div>\n }\n </div>\n\n @if (descriptionTpl) {\n <ng-container\n [ngTemplateOutlet]=\"descriptionTpl\"\n [ngTemplateOutletContext]=\"{\n $implicit: context,\n label,\n isVisited,\n submitted,\n index,\n selected,\n isLast,\n selectedIndex,\n disabled,\n prevStepIsVisited,\n mobileMode,\n finalIcon,\n showIconWhenSelected,\n position,\n }\"\n ></ng-container>\n }\n </div>\n </div>\n </ui-tooltip>\n} @else {\n <div\n class=\"mobile-step-container\"\n #step\n tabindex=\"0\"\n [attr.tabindex]=\"disabled ? -1 : 0\"\n [ngClass]=\"{\n 'secondary-step-variant': stepVariant === 'secondary',\n active: selected,\n disabled: disabled,\n visited: isVisited,\n 'keyboard-focused': keyboardFocused(),\n }\"\n (keydown)=\"onKeydown($event)\"\n (keydown.enter)=\"onStepSelected(index)\"\n (click)=\"onStepSelected(index)\"\n [attr.theme]=\"applicationTheme\"\n role=\"tab\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-disabled]=\"disabled\"\n [attr.aria-label]=\"label\"\n [attr.aria-controls]=\"index\"\n [id]=\"'step-' + index\"\n >\n <div class=\"step\">\n @if (!finalIcon) {\n <div class=\"icon\">\n @switch (true) {\n @case (isVisited && !selected) {\n <ui-icon [size]=\"'16'\" [name]=\"'Check'\" [color]=\"'white'\"></ui-icon>\n }\n @case (selected && !!icon) {\n <ui-icon [size]=\"'16'\" [name]=\"icon!\" [color]=\"'white'\"></ui-icon>\n }\n @default {\n {{ index + 1 }}\n }\n }\n </div>\n } @else {\n @if (hasLastStepDefaultIcon) {\n <img\n [alt]=\"'step-finish-image'\"\n [width]=\"24\"\n [height]=\"24\"\n [attr.src]=\"\n applicationTheme === 'classic'\n ? '/images/step-finish.svg'\n : isVisited\n ? '/images/rebrand-last-step-icon-light.svg'\n : '/images/rebrand-last-step-icon-black.svg'\n \"\n />\n } @else {\n <div class=\"icon\">\n @if (icon) {\n <ui-icon [size]=\"'24'\" [name]=\"icon\" [color]=\"'white'\"></ui-icon>\n } @else {\n {{ index + 1 }}\n }\n </div>\n }\n }\n\n <span class=\"label\">{{ label }}</span>\n </div>\n </div>\n}\n","import { FocusMonitor } from '@angular/cdk/a11y';\nimport { NgClass, AsyncPipe } from '@angular/common';\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n DestroyRef,\n ElementRef,\n EventEmitter,\n Inject,\n Input,\n Optional,\n Output,\n signal,\n ViewChild,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { Observable } from 'rxjs';\n\nimport {\n ApplicationTheme,\n IS_MOBILE_TOKEN,\n IS_LARGE_TABLET_TOKEN,\n UiTranslatePipe,\n} from '@testgorilla/tgo-ui/components/core';\nimport { IconComponent } from '@testgorilla/tgo-ui/components/icon';\nimport { RadialProgressComponent } from '@testgorilla/tgo-ui/components/radial-progress';\n\nimport { StepLineElementDirective } from './step-line-element.directive';\nimport { StepComponent } from './step.component';\nimport { Step, StepperPosition, StepperVariation } from './stepper.model';\n\n@Component({\n selector: 'ui-stepper',\n templateUrl: './stepper.component.html',\n styleUrls: ['./stepper.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [\n NgClass,\n StepComponent,\n StepLineElementDirective,\n IconComponent,\n RadialProgressComponent,\n AsyncPipe,\n UiTranslatePipe,\n ],\n})\nexport class StepperComponent implements AfterViewInit {\n /\n \n * Auto selects first step as visited\n * Defaults to true\n \n @memberof StepperComponent\n /\n // eslint-disable-next-line @angular-eslint/no-input-rename\n @Input('firstStepAutoSelect') set setFirstStepAutoSelect(value: boolean) {\n this.firstStepAutoSelect = value;\n if (!this.firstStepAutoSelect) {\n this.itemSteps = this.itemSteps.map((step, i) => ({\n ...step,\n isVisited: i === 0 && this.selectedIndex === -1 ? false : step.isVisited,\n }));\n }\n }\n\n /\n Input property to set the steps for the stepper.\n * The first step will be marked as visited automatically.\n \n @memberof StepperComponent\n /\n @Input() set steps(itemSteps: Step[]) {\n this.itemSteps = itemSteps;\n if (itemSteps.length && this.firstStepAutoSelect) {\n const [first, ...other] = itemSteps;\n first.isVisited = true;\n this.itemSteps = [first, ...other];\n }\n }\n\n /\n Input property to set the selected index of the stepper.\n * Default value is 0.\n \n @memberof StepperComponent\n /\n // eslint-disable-next-line @angular-eslint/no-input-rename\n @Input('selectedIndex') set setSelectedIndex(value: number) {\n this.selectedIndex = value;\n if (!this.firstStepAutoSelect) {\n this.itemSteps = this.itemSteps.map((step, i) => ({\n ...step,\n isVisited: i === 0 && this.selectedIndex === -1 ? false : step.isVisited,\n }));\n }\n }\n\n /\n Input property indicating whether the final icon should be displayed.\n * Default value is false.\n \n @memberof StepperComponent\n /\n @Input() lastStepFinalIcon = false;\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof StepperComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /\n A string representing the ARIA label for accessibility.\n * This label is used to provide an accessible name for the input element.\n * @type {string}\n * @memberof StepperComponent\n /\n @Input() ariaLabel: string;\n\n /\n Defines the stepper position\n \n @type {StepperPosition}\n * @memberof StepperComponent\n /\n @Input() position: StepperPosition = 'horizontal';\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 {boolean}\n * @memberof StepperComponent\n /\n @Input() ariaRequired = false;\n\n /\n Selects the visual variant. 'primary' (the default) is the candidate\n * test-taking-flow style; 'secondary' is the newer company-side style\n * used in assessment/job creation wizards. Don't use the default in\n * company-side wizards.\n * @type {string}\n * @memberof StepperComponent\n */\n @Input() stepperVariant: StepperVariation = 'primary';\n\n @Input() testId: string \| null = null;\n\n stepTestId(step: Step, index: number): string \| null {\n if (step.testId) {\n return step.testId;\n }\n return this.testId ? `${this.testId}-${index + 1}` : null;\n }\n\n @Output() selectionChange = new EventEmitter<{ selectedIndex: number; previousIndex: number; step: Step }>();\n\n private isOpened = false;\n private firstStepAutoSelect = true;\n protected itemSteps: Step[] = [];\n protected progressValue = 0;\n protected translationContext = 'STEPPER.';\n protected selectedIndex = 0;\n\n get isOpen(): boolean {\n return this.isOpened;\n }\n\n set isOpen(value: boolean) {\n this.isOpened = value;\n }\n\n protected keyboardFocused = signal(false);\n\n @ViewChild('stepper') stepperElement: ElementRef<HTMLElement>;\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme,\n @Inject(IS_MOBILE_TOKEN) protected readonly isMobile$: Observable<boolean>,\n @Inject(IS_LARGE_TABLET_TOKEN) protected readonly isLargeTablet$: Observable<boolean>,\n protected focusMonitor: FocusMonitor,\n protected destroyRef: DestroyRef\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n }\n\n ngAfterViewInit(): void {\n this.subscriberFocus();\n }\n\n protected onSelect(changedIndex: number, step: Step): void {\n if (!step.isVisited && this.selectedIndex !== changedIndex) {\n step.isVisited = true;\n }\n this.selectionChange.emit({ selectedIndex: changedIndex, previousIndex: this.selectedIndex, step });\n\n this.selectedIndex = changedIndex;\n this.onCloseStepList();\n }\n\n protected showStepsToggle(): void {\n this.isOpen = !this.isOpen;\n\n setTimeout(() => {\n this.selectedStepFocus();\n });\n }\n\n protected onCloseStepList(): void {\n this.isOpen = false;\n }\n\n protected subscriberFocus(): void {\n if (!this.stepperElement) {\n return;\n }\n\n this.focusMonitor\n .monitor(this.stepperElement.nativeElement)\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(origin => this.keyboardFocused.set(origin === 'keyboard'));\n }\n\n private selectedStepFocus(): void {\n const selectedElement = document.getElementById(`step-${this.selectedIndex}`);\n\n if (this.keyboardFocused() && this.isOpen && selectedElement) {\n this.focusMonitor.focusVia(selectedElement, 'keyboard');\n }\n }\n}\n","<ng-container>\n <div style=\"position: absolute; left: -99999px\" [attr.aria-live]=\"'polite'\">\n <span>\n {{ itemSteps[selectedIndex]?.label ?? '' }}\n {{\n translationContext + 'SELECTED_OF'\n \| uiTranslate: { selected: (selectedIndex ?? 0) + 1, total: itemSteps?.length ?? 0 }\n \| async\n }}\n {{\n itemSteps[selectedIndex]?.isVisited &&\n itemSteps.length <= (selectedIndex ?? 0) + 1 &&\n itemSteps[selectedIndex + 1]?.isVisited\n ? (translationContext + 'COMPLETED' \| uiTranslate \| async)\n : (translationContext + 'INCOMPLETE' \| uiTranslate \| async)\n }}\n </span>\n </div>\n\n @if ((position === 'horizontal' && (isMobile$ \| async) === false) \|\| position === 'vertical') {\n <div\n class=\"stepper-wrapper\"\n role=\"tablist\"\n [ngClass]=\"[position, stepperVariant === 'secondary' ? 'secondary-variant' : '']\"\n [attr.theme]=\"applicationTheme\"\n >\n @for (step of itemSteps; track step; let i = $index; let isLast = $last) {\n <div class=\"step\" #stepElement>\n <ui-step\n [label]=\"step.label\"\n [isVisited]=\"step.isVisited!\"\n [icon]=\"step.iconName\"\n [index]=\"i\"\n [selected]=\"i === selectedIndex\"\n [selectedIndex]=\"selectedIndex\"\n [isLast]=\"isLast\"\n [disabled]=\"step.disabled ?? (i > selectedIndex + 1 && !step.isVisited)\"\n [prevStepIsVisited]=\"itemSteps[i - 1]?.isVisited && step.isVisited\"\n [finalIcon]=\"isLast ? lastStepFinalIcon : false\"\n [showIconWhenSelected]=\"!!step.showIconWhenSelected\"\n (stepSelected)=\"onSelect($event, step)\"\n [applicationTheme]=\"applicationTheme\"\n role=\"tab\"\n [attr.aria-controls]=\"'step-panel-' + i\"\n [attr.aria-selected]=\"i === selectedIndex\"\n [attr.aria-label]=\"step.label\"\n [attr.data-testid]=\"stepTestId(step, i)\"\n [attr.tabindex]=\"(step.disabled ?? (i > selectedIndex + 1 && !step.isVisited)) ? -1 : 0\"\n [htmlDescription]=\"step.htmlDescription ?? []\"\n [boldLabel]=\"!!step.boldLabel\"\n [position]=\"position\"\n [descriptionTpl]=\"step.descriptionTpl\"\n [labelTooltip]=\"step.labelTooltip\"\n [alwaysShowIcon]=\"!!step.alwaysShowIcon\"\n [context]=\"step.context\"\n [stepVariant]=\"stepperVariant\"\n [largeTabletMode]=\"isLargeTablet$ \| async\"\n ></ui-step>\n </div>\n @if (!isLast && stepperVariant === 'primary') {\n <div class=\"separator-line\" [ngClass]=\"{ visited: step.isVisited && !!itemSteps[i + 1]?.isVisited }\">\n <div [stepLineElement]=\"stepElement\" [position]=\"position\" class=\"line\"></div>\n </div>\n }\n @if (!isLast && stepperVariant === 'secondary') {\n <div class=\"separator-arrow\">\n <ui-icon class=\"separator-icon\" name=\"Arrow-chevron-right-in-line\" size=\"24\" color=\"gray\"></ui-icon>\n </div>\n }\n }\n </div>\n } @else {\n <div class=\"mobile-stepper-wrapper\">\n <div\n class=\"stepper\"\n tabindex=\"0\"\n #stepper\n role=\"button\"\n [ngClass]=\"{ 'keyboard-focused': keyboardFocused() }\"\n (keydown.enter)=\"showStepsToggle()\"\n (keydown.space)=\"showStepsToggle()\"\n [attr.aria-expanded]=\"isOpen\"\n >\n <div class=\"progress-step\" [tabindex]=\"-1\" [attr.aria-hidden]=\"true\">\n <ui-radial-progress\n [applicationTheme]=\"applicationTheme\"\n [value]=\"selectedIndex + 1\"\n [total]=\"itemSteps.length\"\n ></ui-radial-progress>\n </div>\n <div class=\"step-info\">\n <div class=\"current-step\">\n <span>{{ selectedIndex + 1 }}/{{ itemSteps.length }} </span>\n <span>{{ itemSteps[selectedIndex].label }}</span>\n </div>\n <div class=\"next-step\">\n @if (itemSteps.length !== selectedIndex + 1) {\n <span>{{ ('COMMON.NEXT' \| uiTranslate \| async) + ':' }} {{ itemSteps[selectedIndex + 1].label }}</span>\n } @else {\n <span>{{ translationContext + 'FINAL_STEP' \| uiTranslate \| async }}</span>\n }\n </div>\n </div>\n <div\n class=\"open-steps\"\n tabindex=\"0\"\n role=\"button\"\n (keydown.enter)=\"showStepsToggle()\"\n (click)=\"showStepsToggle()\"\n [ngClass]=\"{ opened: isOpen }\"\n [attr.data-testid]=\"testId ? testId + '-toggle' : null\"\n [attr.aria-expanded]=\"isOpen\"\n [attr.aria-label]=\"ariaLabel\"\n >\n <ui-icon\n data-testid=\"ui-stepper-icon\"\n [applicationTheme]=\"applicationTheme\"\n [size]=\"'24'\"\n [name]=\"applicationTheme === 'classic' ? 'Arrow_down' : 'Arrow-chevron-down-in-line'\"\n ></ui-icon>\n </div>\n </div>\n @if (isOpen) {\n <div>\n <div class=\"step-list\">\n @for (step of itemSteps; track step; let i = $index; let isLast = $last) {\n <div class=\"step\">\n <ui-step\n [label]=\"step.label\"\n [isVisited]=\"step.isVisited!\"\n [icon]=\"step.iconName\"\n [index]=\"i\"\n [selected]=\"i === selectedIndex\"\n [selectedIndex]=\"selectedIndex\"\n [isLast]=\"isLast\"\n [disabled]=\"step.disabled ?? (i > selectedIndex + 1 && !step.isVisited)\"\n [mobileMode]=\"true\"\n [finalIcon]=\"isLast ? lastStepFinalIcon : false\"\n [showIconWhenSelected]=\"!!step.showIconWhenSelected\"\n (stepSelected)=\"onSelect($event, step)\"\n [applicationTheme]=\"applicationTheme\"\n [attr.aria-label]=\"ariaLabel + '--' + step.label\"\n [attr.data-testid]=\"stepTestId(step, i)\"\n [stepVariant]=\"stepperVariant\"\n ></ui-step>\n </div>\n }\n </div>\n <div\n class=\"overlay\"\n tabindex=\"0\"\n role=\"button\"\n (keydown.enter)=\"onCloseStepList()\"\n (click)=\"onCloseStepList()\"\n ></div>\n </div>\n }\n </div>\n }\n</ng-container>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { TooltipComponentModule } from '@testgorilla/tgo-ui/components/tooltip';\n\nimport { StepComponent } from './step.component';\n\n@NgModule({\n imports: [CommonModule, IconComponentModule, MatTooltipModule, TooltipComponentModule, StepComponent],\n exports: [StepComponent],\n})\nexport class StepComponentModule {}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatProgressSpinnerModule } from '@angular/material/progress-spinner';\n\nimport { UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { RadialProgressComponentModule } from '@testgorilla/tgo-ui/components/radial-progress';\n\nimport { StepLineElementDirective } from './step-line-element.directive';\nimport { StepComponentModule } from './step.component.module';\nimport { StepperComponent } from './stepper.component';\n\n@NgModule({\n imports: [\n CommonModule,\n IconComponentModule,\n StepComponentModule,\n MatProgressSpinnerModule,\n RadialProgressComponentModule,\n UiTranslatePipe,\n MatInputModule,\n StepperComponent,\n StepLineElementDirective,\n ],\n exports: [StepperComponent],\n})\nexport class StepperComponentModule {}\n"],"mappings":"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"}
1	+ {"version":3,"file":"testgorilla-tgo-ui-components-stepper.mjs","names":["i2"],"sources":["../../../components/stepper/step-line-element.directive.ts","../../../components/stepper/step.component.ts","../../../components/stepper/step.component.html","../../../components/stepper/stepper.component.ts","../../../components/stepper/stepper.component.html","../../../components/stepper/step.component.module.ts","../../../components/stepper/stepper.component.module.ts"],"sourcesContent":["import { Directive, ElementRef, HostListener, Input, OnChanges } from '@angular/core';\n\nimport { StepperPosition } from './stepper.model';\n\nconst MARGINS = 36;\nconst PADDING = 16;\n\n/*\n Directive is used to draw lines between steps\n /\n@Directive({\n // eslint-disable-next-line @angular-eslint/directive-selector -- public directive selector; ui-prefix rename is breaking, deferred to the breaking-change MAJOR (see plan)\n selector: '[stepLineElement]',\n})\nexport class StepLineElementDirective implements OnChanges {\n @Input() stepLineElement: HTMLElement;\n @Input() position: StepperPosition = 'horizontal';\n\n @HostListener('window:resize.out-zone')\n resize(): void {\n this.setSize();\n }\n\n constructor(private readonly el: ElementRef<HTMLElement>) {}\n\n setSize(): void {\n if (this.position === 'horizontal') {\n this.el.nativeElement.style.width = `calc(100% + ${this.stepLineElement.getBoundingClientRect().width / 2 - PADDING}px)`;\n this.el.nativeElement.style.height = `0`;\n this.el.nativeElement.style.top = '45px';\n this.el.nativeElement.style.left = `-${this.stepLineElement.getBoundingClientRect().width / 2 - MARGINS}px`;\n } else {\n this.el.nativeElement.style.height = `calc(100% + ${this.stepLineElement.getBoundingClientRect().height / 2 - PADDING}px)`;\n this.el.nativeElement.style.width = '0';\n this.el.nativeElement.style.top = `-${this.stepLineElement.getBoundingClientRect().height / 2 - 30}px`;\n this.el.nativeElement.style.left = '34px';\n }\n }\n\n ngOnChanges(): void {\n queueMicrotask(() => {\n this.setSize();\n });\n }\n}\n","import { FocusMonitor } from '@angular/cdk/a11y';\nimport { NgClass, NgTemplateOutlet } from '@angular/common';\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n DestroyRef,\n ElementRef,\n EventEmitter,\n Inject,\n Input,\n Optional,\n Output,\n signal,\n TemplateRef,\n ViewChild,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { MatTooltip } from '@angular/material/tooltip';\n\nimport { ApplicationTheme, IKeyboardEvent } from '@testgorilla/tgo-ui/components/core';\nimport { IconName, IconComponent } from '@testgorilla/tgo-ui/components/icon';\nimport { TooltipPositionType, TooltipComponentModule } from '@testgorilla/tgo-ui/components/tooltip';\n\nimport { HtmlDescription, StepperPosition, StepperVariation } from './stepper.model';\n\n@Component({\n selector: 'ui-step',\n templateUrl: './step.component.html',\n styleUrls: ['./step.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [TooltipComponentModule, NgClass, IconComponent, MatTooltip, NgTemplateOutlet],\n})\nexport class StepComponent implements AfterViewInit {\n /\n Input property for the label of the step.\n \n @memberof StepComponent\n /\n @Input() label: string;\n\n /\n Input property indicating whether the step has been visited.\n \n @memberof StepComponent\n /\n @Input() isVisited: boolean;\n\n /\n Input property indicating whether the form has been submitted.\n \n @memberof StepComponent\n /\n @Input() submitted: boolean;\n\n /\n Input property for the icon associated with the step.\n \n @memberof StepComponent\n /\n @Input() icon: IconName \| undefined = '';\n\n /\n Input property for the index of the step.\n \n @memberof StepComponent\n /\n @Input() index: number;\n\n /\n Input property indicating whether the step is currently selected.\n \n @memberof StepComponent\n /\n @Input() selected: boolean;\n\n /\n Input property indicating whether the step is the last step in the stepper.\n \n @memberof StepComponent\n /\n @Input() isLast: boolean;\n\n /\n Input property indicating the selected index in the stepper.\n \n @memberof StepComponent\n /\n @Input() selectedIndex: number;\n\n /\n Input property indicating whether the step is disabled.\n \n @memberof StepComponent\n /\n @Input() disabled = false;\n\n /\n Input property indicating whether the previous step has been visited.\n \n @memberof StepComponent\n /\n @Input() prevStepIsVisited: boolean \| undefined = false;\n\n /\n Input property indicating whether the component is in mobile mode.\n \n @memberof StepComponent\n /\n @Input() mobileMode = false;\n\n /\n Input property indicating whether the component is in large tablet mode.\n \n @memberof StepComponent\n /\n @Input() largeTabletMode: boolean \| null = false;\n\n /\n Input property indicating whether the final icon should be displayed.\n \n @memberof StepComponent\n /\n @Input() finalIcon = false;\n\n /\n Input property indicating to display icon when step is selected.\n \n @memberof StepComponent\n /\n @Input() showIconWhenSelected = false;\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof StepComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /\n \n * Defines the stepper position\n \n @type {StepperPosition}\n * @memberof StepComponent\n /\n @Input() position: StepperPosition;\n\n /\n \n * Step description\n \n @type {HtmlDescription[]}\n * @memberof StepComponent\n /\n @Input() htmlDescription: HtmlDescription[] = [];\n\n /\n \n * Sets bold font weight for label\n \n @type {boolean}\n * @memberof StepComponent\n /\n @Input() boldLabel = false;\n\n /\n \n * Template for the step description\n \n @type {TemplateRef}\n * @memberof StepComponent\n /\n @Input() descriptionTpl?: TemplateRef<unknown>;\n\n /\n \n * Tooltip for the step label\n \n @type {string}\n * @memberof StepComponent\n /\n @Input() labelTooltip?: string;\n\n /\n \n * Always show step icon instead of number\n \n @type {boolean}\n * @memberof StepComponent\n /\n @Input() alwaysShowIcon = false;\n\n /\n \n * Context for the step template\n \n @type {any}\n * @memberof StepComponent\n /\n @Input() context: unknown;\n\n /\n A string representing the step variant.\n * This attribute is used to indicate the variant that should be used.\n * @type {string}\n * @memberof StepComponent\n /\n @Input() stepVariant: StepperVariation = 'primary';\n\n /\n Event emitted when the step was clicked.\n * @type {number}\n * @memberof StepComponent\n /\n @Output() stepSelected = new EventEmitter<number>();\n\n @ViewChild('step') stepElement: ElementRef<HTMLElement>;\n\n protected readonly TooltipPositionType = TooltipPositionType;\n\n protected keyboardFocused = signal(false);\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme,\n private readonly focusMonitor: FocusMonitor,\n private readonly destroyRef: DestroyRef\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n }\n\n ngAfterViewInit() {\n this.subscriberFocus();\n }\n\n protected get hasLastStepDefaultIcon(): boolean {\n return !this.showIconWhenSelected \|\| (this.showIconWhenSelected && !this.selected);\n }\n\n protected onStepSelected(index: number): void {\n if (!this.disabled) {\n this.stepSelected.emit(index);\n }\n }\n\n protected subscriberFocus(): void {\n this.focusMonitor\n .monitor(this.stepElement.nativeElement)\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(origin => this.keyboardFocused.set(origin === 'keyboard'));\n }\n\n onKeydown($event: KeyboardEvent): void {\n if ($event.key === (IKeyboardEvent.ENTER as string) \|\| $event.key === (IKeyboardEvent.SPACE as string)) {\n this.onStepSelected(this.index);\n } else if ($event.key === (IKeyboardEvent.ARROW_UP as string)) {\n const prevIndex = this.index - 1;\n const prevElement = document.getElementById(`step-${prevIndex}`);\n\n if (!prevElement) {\n return;\n }\n this.focusMonitor.focusVia(prevElement, 'keyboard');\n } else if ($event.key === (IKeyboardEvent.ARROW_DOWN as string)) {\n const nextIndex = this.index + 1;\n const nextElement = document.getElementById(`step-${nextIndex}`);\n\n if (!nextElement) {\n return;\n }\n this.focusMonitor.focusVia(nextElement, 'keyboard');\n }\n }\n}\n","@if (!mobileMode) {\n <ui-tooltip\n [message]=\"stepVariant === 'secondary' && largeTabletMode ? label : ''\"\n [position]=\"TooltipPositionType.BOTTOM\"\n >\n <div\n class=\"step-container\"\n #step\n tabindex=\"0\"\n [attr.tabindex]=\"disabled ? -1 : 0\"\n role=\"button\"\n [ngClass]=\"{\n 'secondary-step-variant': stepVariant === 'secondary',\n 'visited-next': isVisited && index > selectedIndex,\n 'visited-prev': isVisited && index < selectedIndex,\n active: selected,\n 'last-step': finalIcon && hasLastStepDefaultIcon && !alwaysShowIcon,\n disabled: disabled,\n vertical: position === 'vertical',\n 'keyboard-focused': keyboardFocused(),\n }\"\n [attr.theme]=\"applicationTheme\"\n (keydown.enter)=\"onStepSelected(index)\"\n (keydown.space)=\"$event.preventDefault(); onStepSelected(index)\"\n (click)=\"onStepSelected(index)\"\n >\n <div class=\"step-icon\">\n @if (index && stepVariant === 'primary') {\n <div class=\"line\" [ngClass]=\"{ visited: prevStepIsVisited }\"></div>\n }\n\n @if (!finalIcon) {\n <div class=\"icon-wrapper\">\n @switch (true) {\n @case (isVisited && !selected && !alwaysShowIcon) {\n <ui-icon\n size=\"24\"\n [name]=\"stepVariant === 'secondary' ? 'Check-small-filled' : 'Check'\"\n [color]=\"\n (isVisited && index < selectedIndex) \|\| stepVariant === 'secondary'\n ? 'white'\n : applicationTheme === 'classic'\n ? 'petrol'\n : 'rebrand-black'\n \"\n ></ui-icon>\n }\n @case ((selected && !!icon) \|\| alwaysShowIcon) {\n <ui-icon\n [size]=\"'24'\"\n [name]=\"icon!\"\n [color]=\"isLast && !selected ? 'rebrand-black' : 'white'\"\n ></ui-icon>\n }\n @default {\n {{ index + 1 }}\n }\n }\n </div>\n } @else {\n @if (hasLastStepDefaultIcon && !alwaysShowIcon) {\n <img\n [alt]=\"'step-finish-image'\"\n [attr.src]=\"\n applicationTheme === 'classic'\n ? '/images/step-finish.svg'\n : isVisited\n ? '/images/rebrand-last-step-icon-light.svg'\n : '/images/rebrand-last-step-icon-black.svg'\n \"\n />\n } @else {\n <div class=\"icon-wrapper\">\n @if (icon \|\| (icon && alwaysShowIcon)) {\n <ui-icon [size]=\"'24'\" [name]=\"icon\" [color]=\"'white'\"></ui-icon>\n } @else {\n {{ index + 1 }}\n }\n </div>\n }\n }\n </div>\n\n <div class=\"steps-label\">\n @if (label) {\n <div class=\"step-label\" [ngClass]=\"{ 'step-bold-label': boldLabel }\" [matTooltip]=\"labelTooltip ?? ''\">\n {{ label }}\n </div>\n }\n\n <div class=\"step-description-container\">\n @for (description of htmlDescription; track description) {\n <div class=\"step-description\">\n <div>{{ description.text }}</div>\n @if (description.iconName) {\n <ui-icon\n [name]=\"description.iconName\"\n [size]=\"'24'\"\n [matTooltip]=\"description.iconTooltip ?? ''\"\n ></ui-icon>\n }\n </div>\n }\n </div>\n\n @if (descriptionTpl) {\n <ng-container\n [ngTemplateOutlet]=\"descriptionTpl\"\n [ngTemplateOutletContext]=\"{\n $implicit: context,\n label,\n isVisited,\n submitted,\n index,\n selected,\n isLast,\n selectedIndex,\n disabled,\n prevStepIsVisited,\n mobileMode,\n finalIcon,\n showIconWhenSelected,\n position,\n }\"\n ></ng-container>\n }\n </div>\n </div>\n </ui-tooltip>\n} @else {\n <div\n class=\"mobile-step-container\"\n #step\n tabindex=\"0\"\n [attr.tabindex]=\"disabled ? -1 : 0\"\n [ngClass]=\"{\n 'secondary-step-variant': stepVariant === 'secondary',\n active: selected,\n disabled: disabled,\n visited: isVisited,\n 'keyboard-focused': keyboardFocused(),\n }\"\n (keydown)=\"onKeydown($event)\"\n (keydown.enter)=\"onStepSelected(index)\"\n (click)=\"onStepSelected(index)\"\n [attr.theme]=\"applicationTheme\"\n role=\"tab\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-disabled]=\"disabled\"\n [attr.aria-label]=\"label\"\n [attr.aria-controls]=\"index\"\n [id]=\"'step-' + index\"\n >\n <div class=\"step\">\n @if (!finalIcon) {\n <div class=\"icon\">\n @switch (true) {\n @case (isVisited && !selected) {\n <ui-icon [size]=\"'16'\" [name]=\"'Check'\" [color]=\"'white'\"></ui-icon>\n }\n @case (selected && !!icon) {\n <ui-icon [size]=\"'16'\" [name]=\"icon!\" [color]=\"'white'\"></ui-icon>\n }\n @default {\n {{ index + 1 }}\n }\n }\n </div>\n } @else {\n @if (hasLastStepDefaultIcon) {\n <img\n [alt]=\"'step-finish-image'\"\n [width]=\"24\"\n [height]=\"24\"\n [attr.src]=\"\n applicationTheme === 'classic'\n ? '/images/step-finish.svg'\n : isVisited\n ? '/images/rebrand-last-step-icon-light.svg'\n : '/images/rebrand-last-step-icon-black.svg'\n \"\n />\n } @else {\n <div class=\"icon\">\n @if (icon) {\n <ui-icon [size]=\"'24'\" [name]=\"icon\" [color]=\"'white'\"></ui-icon>\n } @else {\n {{ index + 1 }}\n }\n </div>\n }\n }\n\n <span class=\"label\">{{ label }}</span>\n </div>\n </div>\n}\n","import { FocusMonitor } from '@angular/cdk/a11y';\nimport { NgClass, AsyncPipe } from '@angular/common';\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n DestroyRef,\n ElementRef,\n EventEmitter,\n Inject,\n Input,\n Optional,\n Output,\n signal,\n ViewChild,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { Observable } from 'rxjs';\n\nimport {\n ApplicationTheme,\n IS_MOBILE_TOKEN,\n IS_LARGE_TABLET_TOKEN,\n UiTranslatePipe,\n} from '@testgorilla/tgo-ui/components/core';\nimport { IconComponent } from '@testgorilla/tgo-ui/components/icon';\nimport { RadialProgressComponent } from '@testgorilla/tgo-ui/components/radial-progress';\n\nimport { StepLineElementDirective } from './step-line-element.directive';\nimport { StepComponent } from './step.component';\nimport { Step, StepperPosition, StepperVariation } from './stepper.model';\n\n@Component({\n selector: 'ui-stepper',\n templateUrl: './stepper.component.html',\n styleUrls: ['./stepper.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [\n NgClass,\n StepComponent,\n StepLineElementDirective,\n IconComponent,\n RadialProgressComponent,\n AsyncPipe,\n UiTranslatePipe,\n ],\n})\nexport class StepperComponent implements AfterViewInit {\n /\n \n * Auto selects first step as visited\n * Defaults to true\n \n @memberof StepperComponent\n /\n // eslint-disable-next-line @angular-eslint/no-input-rename\n @Input('firstStepAutoSelect') set setFirstStepAutoSelect(value: boolean) {\n this.firstStepAutoSelect = value;\n if (!this.firstStepAutoSelect) {\n this.itemSteps = this.itemSteps.map((step, i) => ({\n ...step,\n isVisited: i === 0 && this.selectedIndex === -1 ? false : step.isVisited,\n }));\n }\n }\n\n /\n Input property to set the steps for the stepper.\n * The first step will be marked as visited automatically.\n \n @memberof StepperComponent\n /\n @Input() set steps(itemSteps: Step[]) {\n this.itemSteps = itemSteps;\n if (itemSteps.length && this.firstStepAutoSelect) {\n const [first, ...other] = itemSteps;\n first.isVisited = true;\n this.itemSteps = [first, ...other];\n }\n }\n\n /\n Input property to set the selected index of the stepper.\n * Default value is 0.\n \n @memberof StepperComponent\n /\n // eslint-disable-next-line @angular-eslint/no-input-rename\n @Input('selectedIndex') set setSelectedIndex(value: number) {\n // A template `a?.b` binding yields `undefined` since Angular 22 (it was `null`). `null + 1` is 1 and\n // keeps the later steps locked; `undefined + 1` is NaN and unlocks them all.\n this.selectedIndex = value ?? (null as unknown as number);\n if (!this.firstStepAutoSelect) {\n this.itemSteps = this.itemSteps.map((step, i) => ({\n ...step,\n isVisited: i === 0 && this.selectedIndex === -1 ? false : step.isVisited,\n }));\n }\n }\n\n /\n Input property indicating whether the final icon should be displayed.\n * Default value is false.\n \n @memberof StepperComponent\n /\n @Input() lastStepFinalIcon = false;\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof StepperComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /\n A string representing the ARIA label for accessibility.\n * This label is used to provide an accessible name for the input element.\n * @type {string}\n * @memberof StepperComponent\n /\n @Input() ariaLabel: string;\n\n /\n Defines the stepper position\n \n @type {StepperPosition}\n * @memberof StepperComponent\n /\n @Input() position: StepperPosition = 'horizontal';\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 {boolean}\n * @memberof StepperComponent\n /\n @Input() ariaRequired = false;\n\n /\n Selects the visual variant. 'primary' (the default) is the candidate\n * test-taking-flow style; 'secondary' is the newer company-side style\n * used in assessment/job creation wizards. Don't use the default in\n * company-side wizards.\n * @type {string}\n * @memberof StepperComponent\n */\n @Input() stepperVariant: StepperVariation = 'primary';\n\n @Input() testId: string \| null = null;\n\n stepTestId(step: Step, index: number): string \| null {\n if (step.testId) {\n return step.testId;\n }\n return this.testId ? `${this.testId}-${index + 1}` : null;\n }\n\n @Output() selectionChange = new EventEmitter<{ selectedIndex: number; previousIndex: number; step: Step }>();\n\n private isOpened = false;\n private firstStepAutoSelect = true;\n protected itemSteps: Step[] = [];\n protected progressValue = 0;\n protected translationContext = 'STEPPER.';\n protected selectedIndex = 0;\n\n get isOpen(): boolean {\n return this.isOpened;\n }\n\n set isOpen(value: boolean) {\n this.isOpened = value;\n }\n\n protected keyboardFocused = signal(false);\n\n @ViewChild('stepper') stepperElement: ElementRef<HTMLElement>;\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme,\n @Inject(IS_MOBILE_TOKEN) protected readonly isMobile$: Observable<boolean>,\n @Inject(IS_LARGE_TABLET_TOKEN) protected readonly isLargeTablet$: Observable<boolean>,\n protected focusMonitor: FocusMonitor,\n protected destroyRef: DestroyRef\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n }\n\n ngAfterViewInit(): void {\n this.subscriberFocus();\n }\n\n protected onSelect(changedIndex: number, step: Step): void {\n if (!step.isVisited && this.selectedIndex !== changedIndex) {\n step.isVisited = true;\n }\n this.selectionChange.emit({ selectedIndex: changedIndex, previousIndex: this.selectedIndex, step });\n\n this.selectedIndex = changedIndex;\n this.onCloseStepList();\n }\n\n protected showStepsToggle(): void {\n this.isOpen = !this.isOpen;\n\n setTimeout(() => {\n this.selectedStepFocus();\n });\n }\n\n protected onCloseStepList(): void {\n this.isOpen = false;\n }\n\n protected subscriberFocus(): void {\n if (!this.stepperElement) {\n return;\n }\n\n this.focusMonitor\n .monitor(this.stepperElement.nativeElement)\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(origin => this.keyboardFocused.set(origin === 'keyboard'));\n }\n\n private selectedStepFocus(): void {\n const selectedElement = document.getElementById(`step-${this.selectedIndex}`);\n\n if (this.keyboardFocused() && this.isOpen && selectedElement) {\n this.focusMonitor.focusVia(selectedElement, 'keyboard');\n }\n }\n}\n","<ng-container>\n <div style=\"position: absolute; left: -99999px\" [attr.aria-live]=\"'polite'\">\n <span>\n {{ itemSteps[selectedIndex]?.label ?? '' }}\n {{\n translationContext + 'SELECTED_OF'\n \| uiTranslate: { selected: (selectedIndex ?? 0) + 1, total: itemSteps?.length ?? 0 }\n \| async\n }}\n {{\n itemSteps[selectedIndex]?.isVisited &&\n itemSteps.length <= (selectedIndex ?? 0) + 1 &&\n itemSteps[selectedIndex + 1]?.isVisited\n ? (translationContext + 'COMPLETED' \| uiTranslate \| async)\n : (translationContext + 'INCOMPLETE' \| uiTranslate \| async)\n }}\n </span>\n </div>\n\n @if ((position === 'horizontal' && (isMobile$ \| async) === false) \|\| position === 'vertical') {\n <div\n class=\"stepper-wrapper\"\n role=\"tablist\"\n [ngClass]=\"[position, stepperVariant === 'secondary' ? 'secondary-variant' : '']\"\n [attr.theme]=\"applicationTheme\"\n >\n @for (step of itemSteps; track step; let i = $index; let isLast = $last) {\n <div class=\"step\" #stepElement>\n <ui-step\n [label]=\"step.label\"\n [isVisited]=\"step.isVisited!\"\n [icon]=\"step.iconName\"\n [index]=\"i\"\n [selected]=\"i === selectedIndex\"\n [selectedIndex]=\"selectedIndex\"\n [isLast]=\"isLast\"\n [disabled]=\"step.disabled ?? (i > selectedIndex + 1 && !step.isVisited)\"\n [prevStepIsVisited]=\"itemSteps[i - 1]?.isVisited && step.isVisited\"\n [finalIcon]=\"isLast ? lastStepFinalIcon : false\"\n [showIconWhenSelected]=\"!!step.showIconWhenSelected\"\n (stepSelected)=\"onSelect($event, step)\"\n [applicationTheme]=\"applicationTheme\"\n role=\"tab\"\n [attr.aria-controls]=\"'step-panel-' + i\"\n [attr.aria-selected]=\"i === selectedIndex\"\n [attr.aria-label]=\"step.label\"\n [attr.data-testid]=\"stepTestId(step, i)\"\n [attr.tabindex]=\"(step.disabled ?? (i > selectedIndex + 1 && !step.isVisited)) ? -1 : 0\"\n [htmlDescription]=\"step.htmlDescription ?? []\"\n [boldLabel]=\"!!step.boldLabel\"\n [position]=\"position\"\n [descriptionTpl]=\"step.descriptionTpl\"\n [labelTooltip]=\"step.labelTooltip\"\n [alwaysShowIcon]=\"!!step.alwaysShowIcon\"\n [context]=\"step.context\"\n [stepVariant]=\"stepperVariant\"\n [largeTabletMode]=\"isLargeTablet$ \| async\"\n ></ui-step>\n </div>\n @if (!isLast && stepperVariant === 'primary') {\n <div class=\"separator-line\" [ngClass]=\"{ visited: step.isVisited && !!itemSteps[i + 1]?.isVisited }\">\n <div [stepLineElement]=\"stepElement\" [position]=\"position\" class=\"line\"></div>\n </div>\n }\n @if (!isLast && stepperVariant === 'secondary') {\n <div class=\"separator-arrow\">\n <ui-icon class=\"separator-icon\" name=\"Arrow-chevron-right-in-line\" size=\"24\" color=\"gray\"></ui-icon>\n </div>\n }\n }\n </div>\n } @else {\n <div class=\"mobile-stepper-wrapper\">\n <div\n class=\"stepper\"\n tabindex=\"0\"\n #stepper\n role=\"button\"\n [ngClass]=\"{ 'keyboard-focused': keyboardFocused() }\"\n (keydown.enter)=\"showStepsToggle()\"\n (keydown.space)=\"showStepsToggle()\"\n [attr.aria-expanded]=\"isOpen\"\n >\n <div class=\"progress-step\" [tabindex]=\"-1\" [attr.aria-hidden]=\"true\">\n <ui-radial-progress\n [applicationTheme]=\"applicationTheme\"\n [value]=\"selectedIndex + 1\"\n [total]=\"itemSteps.length\"\n ></ui-radial-progress>\n </div>\n <div class=\"step-info\">\n <div class=\"current-step\">\n <span>{{ selectedIndex + 1 }}/{{ itemSteps.length }} </span>\n <span>{{ itemSteps[selectedIndex].label }}</span>\n </div>\n <div class=\"next-step\">\n @if (itemSteps.length !== selectedIndex + 1) {\n <span>{{ ('COMMON.NEXT' \| uiTranslate \| async) + ':' }} {{ itemSteps[selectedIndex + 1].label }}</span>\n } @else {\n <span>{{ translationContext + 'FINAL_STEP' \| uiTranslate \| async }}</span>\n }\n </div>\n </div>\n <div\n class=\"open-steps\"\n tabindex=\"0\"\n role=\"button\"\n (keydown.enter)=\"showStepsToggle()\"\n (click)=\"showStepsToggle()\"\n [ngClass]=\"{ opened: isOpen }\"\n [attr.data-testid]=\"testId ? testId + '-toggle' : null\"\n [attr.aria-expanded]=\"isOpen\"\n [attr.aria-label]=\"ariaLabel\"\n >\n <ui-icon\n data-testid=\"ui-stepper-icon\"\n [applicationTheme]=\"applicationTheme\"\n [size]=\"'24'\"\n [name]=\"applicationTheme === 'classic' ? 'Arrow_down' : 'Arrow-chevron-down-in-line'\"\n ></ui-icon>\n </div>\n </div>\n @if (isOpen) {\n <div>\n <div class=\"step-list\">\n @for (step of itemSteps; track step; let i = $index; let isLast = $last) {\n <div class=\"step\">\n <ui-step\n [label]=\"step.label\"\n [isVisited]=\"step.isVisited!\"\n [icon]=\"step.iconName\"\n [index]=\"i\"\n [selected]=\"i === selectedIndex\"\n [selectedIndex]=\"selectedIndex\"\n [isLast]=\"isLast\"\n [disabled]=\"step.disabled ?? (i > selectedIndex + 1 && !step.isVisited)\"\n [mobileMode]=\"true\"\n [finalIcon]=\"isLast ? lastStepFinalIcon : false\"\n [showIconWhenSelected]=\"!!step.showIconWhenSelected\"\n (stepSelected)=\"onSelect($event, step)\"\n [applicationTheme]=\"applicationTheme\"\n [attr.aria-label]=\"ariaLabel + '--' + step.label\"\n [attr.data-testid]=\"stepTestId(step, i)\"\n [stepVariant]=\"stepperVariant\"\n ></ui-step>\n </div>\n }\n </div>\n <div\n class=\"overlay\"\n tabindex=\"0\"\n role=\"button\"\n (keydown.enter)=\"onCloseStepList()\"\n (click)=\"onCloseStepList()\"\n ></div>\n </div>\n }\n </div>\n }\n</ng-container>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { TooltipComponentModule } from '@testgorilla/tgo-ui/components/tooltip';\n\nimport { StepComponent } from './step.component';\n\n@NgModule({\n imports: [CommonModule, IconComponentModule, MatTooltipModule, TooltipComponentModule, StepComponent],\n exports: [StepComponent],\n})\nexport class StepComponentModule {}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatProgressSpinnerModule } from '@angular/material/progress-spinner';\n\nimport { UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { RadialProgressComponentModule } from '@testgorilla/tgo-ui/components/radial-progress';\n\nimport { StepLineElementDirective } from './step-line-element.directive';\nimport { StepComponentModule } from './step.component.module';\nimport { StepperComponent } from './stepper.component';\n\n@NgModule({\n imports: [\n CommonModule,\n IconComponentModule,\n StepComponentModule,\n MatProgressSpinnerModule,\n RadialProgressComponentModule,\n UiTranslatePipe,\n MatInputModule,\n StepperComponent,\n StepLineElementDirective,\n ],\n exports: [StepperComponent],\n})\nexport class StepperComponentModule {}\n"],"mappings":"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"}

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

@@ -453,12 +453,15 @@ var TableComponent = class TableComponent {
 						"ariaExpanded",
 						"ariaControls",
 						"ariaPressed",
+						"ariaHasPopup",
 						"ariaRequired",
 						"ariaLabelledby",
 						"ariaDescribedby",
 						"preventDefault",
 						"hasBackground",
 						"circular",
+						"isSingleLineLabel",
+						"iconButtonShape",
 						"tooltipPosition",
 						"role",
 						"iconFilled",

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

	@@ -1 +1 @@
1	- {"version":3,"file":"testgorilla-tgo-ui-components-table.mjs","names":[],"sources":["../../../components/table/sentence-case.pipe.ts","../../../components/table/table.model.ts","../../../components/table/table.utils.ts","../../../components/table/table.component.ts","../../../components/table/table.component.html","../../../components/table/table.component.module.ts"],"sourcesContent":["import { Pipe, PipeTransform } from '@angular/core';\n\n@Pipe({ name: 'sentencecase' })\nexport class SentenceCasePipe implements PipeTransform {\n transform(value: string \| undefined): string {\n if (!value) {\n return '';\n }\n return value.charAt(0).toUpperCase() + value.slice(1).toLowerCase();\n }\n}\n","import { TemplateRef, Type } from '@angular/core';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any -- consumer-ergonomic default row type; consumers narrow via TableConfig<MyRow>\nexport interface TableConfig<T = any> {\n columns: TableColumn<T>[];\n pagination?: Pagination;\n title?: string;\n width?: number;\n sort?: Sort;\n hidePagination?: boolean;\n noDataRowTpl?: TemplateRef<unknown>;\n sortable?: boolean;\n}\n\nexport interface TableConfigWithPagination<T> extends TableConfig<T> {\n pagination?: Pagination;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any -- consumer-ergonomic default row type; consumers narrow via TableColumn<MyRow>\nexport interface TableColumn<T = any> {\n title?: string;\n key: string;\n allowMultiline?: boolean;\n bold?: boolean;\n showTooltip?: boolean;\n tooltip?: string;\n allowSort?: boolean;\n isSticky?: boolean;\n headerCellTemplate?: TemplateRef<unknown>;\n rowCellTemplate?: TemplateRef<unknown>;\n rowCellTemplateClick?: () => void;\n sortHeader?: string;\n hidden?: boolean;\n order?: number;\n fontSize?: '12px' \| '14px';\n field?: string;\n type?: ColumnType;\n function?: (v: T) => string;\n renderer?: (v: T) => ComponentRenderer \| string;\n styles?: ColumnStyles;\n sortStart?: SortDirection;\n uniqueId?: string;\n}\n\nexport interface Pagination {\n itemsPerPageOptions: number[];\n itemsPerPage: number;\n currentPage: number;\n totalItems: number;\n}\n\nexport type TableData = Record<string, unknown>[];\n\nexport interface ColumnEllipse {\n index: number;\n showTooltip: boolean;\n}\n\nexport interface Sort {\n active: string;\n direction: SortDirection;\n defaultSortStart?: SortDirection;\n}\n\nexport type SortDirection = 'asc' \| 'desc' \| '';\n\nexport interface TableDetailColumn<T, TDetail> {\n columnDefs: TableColumn<TDetail>[];\n setDetailRowData: (params: DetailRowDataParams<T, TDetail>) => void;\n}\n\nexport interface DetailRowDataParams<T, TDetail> {\n data: T;\n\n setDetailDataSource(rowData: TDetail[]): void;\n}\n\nexport enum ColumnType {\n FIELD = 'field',\n FUNCTION = 'function',\n RENDERER = 'renderer',\n}\n\nexport interface ComponentRenderer {\n component: Type<unknown>;\n inputs?: Record<string, unknown>;\n outputs?: { [key: string]: (event: unknown) => void };\n}\n\nexport interface ColumnStyles {\n alignment?: ColumnAlignment;\n width?: string;\n 'min-width'?: string;\n padding?: string;\n}\n\nexport enum ColumnAlignment {\n LEFT = 'left',\n RIGHT = 'right',\n CENTER = 'center',\n}\n\nexport enum ColumnTypeEnum {\n FIELD = 'field',\n FUNCTION = 'function',\n RENDERER = 'renderer',\n}\n\nexport enum ColumnAlignmentEnum {\n LEFT = 'left',\n RIGHT = 'right',\n CENTER = 'center',\n}\n\nexport type DataSource = {\n [key: string]: unknown;\n};\n\nexport type ScrollSettings = { scrollEnd: boolean; horizontalScroll: boolean; scrollStart: boolean };\n","import { TableColumn } from './table.model';\n\n/*\n Sorting table columns by order value if set.\n * The rest columns keep the same ordering and displayed after the sorted ones.\n /\nexport const sortByOrder = <T>(columns: TableColumn<T>[]): TableColumn<T>[] => {\n const withOrderColumns = columns.filter(v => v.order);\n const withoutOrderColumns = columns.filter(v => !v.order);\n\n if (!withOrderColumns.length) {\n return columns;\n }\n\n if (withoutOrderColumns.length) {\n const sortedColumns = new Array<TableColumn<T>>(columns.length);\n withOrderColumns.forEach(column => (sortedColumns[(column.order ?? 1) - 1] = column));\n withoutOrderColumns.forEach(column => {\n const emptyIndex = sortedColumns.findIndex(v => !v);\n sortedColumns[emptyIndex] = column;\n });\n return sortedColumns;\n } else {\n const sortedOrderedColumns = withOrderColumns.sort((a, b) => (a.order ?? 0) - (b.order ?? 0));\n\n return [...sortedOrderedColumns, ...withoutOrderColumns];\n }\n};\n","import { animate, state, style, transition, trigger } from '@angular/animations';\nimport { NgClass, NgStyle, NgTemplateOutlet, AsyncPipe, UpperCasePipe } from '@angular/common';\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n DestroyRef,\n ElementRef,\n EventEmitter,\n Inject,\n Input,\n OnChanges,\n Optional,\n Output,\n SimpleChanges,\n ViewChild,\n OnInit,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { PageEvent } from '@angular/material/paginator';\nimport { Sort, MatSort, MatSortHeader } from '@angular/material/sort';\nimport {\n MatTableDataSource,\n MatTable,\n MatColumnDef,\n MatHeaderCellDef,\n MatHeaderCell,\n MatCellDef,\n MatCell,\n MatHeaderRowDef,\n MatHeaderRow,\n MatRowDef,\n MatRow,\n MatNoDataRow,\n} from '@angular/material/table';\nimport { MatTooltip } from '@angular/material/tooltip';\nimport { BehaviorSubject, fromEvent, Observable } from 'rxjs';\n\nimport { ButtonComponent } from '@testgorilla/tgo-ui/components/button';\nimport {\n DynamicComponentDirective,\n ApplicationTheme,\n IS_MOBILE_TOKEN,\n EllipseTextDirective,\n DataPropertyGetterPipe,\n MemoizeFuncPipe,\n} from '@testgorilla/tgo-ui/components/core';\nimport { IconComponent } from '@testgorilla/tgo-ui/components/icon';\nimport { PaginatorComponent } from '@testgorilla/tgo-ui/components/paginator';\nimport { SkeletonComponent } from '@testgorilla/tgo-ui/components/skeleton';\n\nimport { SentenceCasePipe } from './sentence-case.pipe';\nimport {\n ColumnEllipse,\n ColumnType,\n ComponentRenderer,\n DataSource,\n Pagination,\n ScrollSettings,\n TableColumn,\n TableConfig,\n TableConfigWithPagination,\n TableData,\n TableDetailColumn,\n} from './table.model';\nimport { sortByOrder } from './table.utils';\n\n@Component({\n selector: 'ui-table',\n templateUrl: './table.component.html',\n styleUrls: ['./table.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n / eslint-disable @typescript-eslint/no-deprecated -- the @angular/animations trigger/state/style/animate/transition DSL is deprecated in 20.2 in favor of template-level animate.enter/animate.leave; migrating every Material/component animation is out of scope for this lint pass /\n animations: [\n trigger('expandDetail', [\n state('collapsed, void', style({ height: '0px' })),\n state('expanded', style({ height: '' })),\n transition('expanded <=> collapsed', animate('225ms cubic-bezier(0.4, 0.0, 0.2, 1)')),\n transition('expanded <=> void', animate('225ms cubic-bezier(0.4, 0.0, 0.2, 1)')),\n ]),\n ],\n imports: [\n NgClass,\n MatTable,\n MatSort,\n MatColumnDef,\n MatHeaderCellDef,\n MatHeaderCell,\n MatSortHeader,\n NgStyle,\n NgTemplateOutlet,\n MatCellDef,\n MatCell,\n SkeletonComponent,\n MatHeaderRowDef,\n MatHeaderRow,\n MatRowDef,\n MatRow,\n DynamicComponentDirective,\n MatNoDataRow,\n PaginatorComponent,\n ButtonComponent,\n EllipseTextDirective,\n IconComponent,\n MatTooltip,\n AsyncPipe,\n UpperCasePipe,\n DataPropertyGetterPipe,\n MemoizeFuncPipe,\n SentenceCasePipe,\n ],\n})\nexport class TableComponent<T extends DataSource, TDetail extends DataSource>\n implements OnChanges, AfterViewInit, OnInit\n{\n /*\n Table configuration\n \n @type {TableConfig}\n * @memberof TableComponent\n /\n @Input({ required: true }) config: TableConfigWithPagination<T>;\n\n /\n Input property for providing the table data.\n \n @type {TableData}\n * @memberof TableComponent\n /\n @Input() data: TableData;\n\n /\n Input property indicating whether the table is in a loading state.\n \n @type {boolean}\n * @memberof TableComponent\n * @default false\n /\n @Input() loading = false;\n\n /\n \n * Defines the application theme\n * @type {ApplicationTheme}\n * @memberof TableComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /\n Data structure to select which columns should be rendered and their capabilities\n \n @type {TableDetailColumn}\n * @memberof TableComponent\n /\n @Input() tableDetailColumns: TableDetailColumn<T, TDetail>;\n @Input() tableDetails = false;\n\n /\n Disable border radius for table\n \n @type {boolean}\n * @memberof TableComponent\n /\n @Input() disableBorderRadius = false;\n\n /\n Condensed table\n \n @type {boolean}\n * @memberof TableComponent\n /\n @Input() isCondensed = false;\n\n /\n Sticky header\n \n @type {boolean}\n * @memberof TableComponent\n /\n @Input() stickyHeader = false;\n\n /\n Max height\n \n @type {string}\n * @memberof TableComponent\n /\n @Input() maxHeight = '576px';\n\n @Input() testId: string \| null = null;\n\n @Input() ariaLabel = '';\n\n // eslint-disable-next-line @angular-eslint/no-output-on-prefix -- public output; dropping on- prefix is breaking, deferred to the breaking-change MAJOR (see plan)\n @Output() onRowClickEvent = new EventEmitter<T & { index: number }>();\n // eslint-disable-next-line @angular-eslint/no-output-on-prefix -- public output; dropping on- prefix is breaking, deferred to the breaking-change MAJOR (see plan)\n @Output() onDetailRowClickEvent = new EventEmitter<TDetail>();\n @Output() paginatorChange = new EventEmitter<PageEvent>();\n @Output() sortChange = new EventEmitter<Sort>();\n\n @ViewChild('table') table: ElementRef<HTMLElement>;\n\n protected tableData: TableData;\n protected sourceData: TableData;\n protected columnsTooltipState: ColumnEllipse[] = [];\n protected tableConfig: TableConfigWithPagination<T>;\n protected displayedColumns: string[] = [];\n protected columnsDetailToDisplay: string[] = [];\n protected skeletonStyleConfig = {\n background: '#F6F6F6',\n 'border-radius': '4px',\n height: '24px',\n };\n protected dataSourceDetail = new MatTableDataSource<TDetail>([]);\n protected elementDetail: T \| null;\n protected readonly DataType = ColumnType;\n protected scrollSettings$ = new BehaviorSubject<ScrollSettings>({\n scrollEnd: false,\n horizontalScroll: false,\n scrollStart: false,\n });\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme,\n private readonly destroyRef: DestroyRef,\n @Inject(IS_MOBILE_TOKEN) protected readonly isMobile$: Observable<boolean>\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n }\n\n ngOnInit() {\n this.setTableConfig(this.config);\n this.setTableData(this.data);\n\n if (this.applicationTheme !== 'classic') {\n this.skeletonStyleConfig.background = '#F4F4F4';\n }\n document.body.setAttribute('theme', this.applicationTheme);\n\n if (this.tableDetailColumns) {\n const filteredColumns = this.tableDetailColumns.columnDefs.filter(column => !column.hidden);\n this.columnsDetailToDisplay = filteredColumns.length\n ? filteredColumns.map((tableColumn: TableColumn<TDetail>) => tableColumn.title ?? '')\n : [];\n }\n\n if (this.tableConfig?.sortable && this.tableConfig?.sort) {\n this.onSortChange(this.tableConfig.sort, false);\n }\n }\n\n ngAfterViewInit() {\n this.hasTableScroll();\n fromEvent(this.table.nativeElement, 'scroll')\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(() => this.hasTableScroll());\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n if (changes['config']?.currentValue) {\n const config = changes['config'].currentValue as TableConfig<T>;\n this.setTableConfig(config);\n }\n if (changes['data']?.currentValue) {\n this.setTableData(changes['data'].currentValue as TableData);\n }\n }\n\n hasTableScroll(): void {\n const table = this.table.nativeElement;\n const horizontalScroll = table.scrollWidth > table.clientWidth;\n const scrollEnd = table.scrollLeft + table.clientWidth >= table.scrollWidth;\n this.scrollSettings$.next({\n scrollStart: !table.scrollLeft,\n scrollEnd,\n horizontalScroll,\n });\n }\n\n callRenderer([rendererFn, element]: [(v: T) => ComponentRenderer \| string, T]):\n \| ComponentRenderer\n \| string\n \| undefined {\n return rendererFn ? rendererFn(element) : undefined;\n }\n\n protected onPaginatorChange(event: PageEvent): void {\n this.paginatorChange.emit(event);\n }\n\n protected onChangeColumnSize(columnIndex: number, showTooltip: boolean): void {\n this.columnsTooltipState = this.columnsTooltipState.map(column => {\n if (column.index === columnIndex) {\n column.showTooltip = showTooltip;\n }\n return column;\n });\n }\n\n protected onSortChange(sortState: Sort, emitEvent = true): void {\n if (this.loading) {\n return;\n }\n\n if (emitEvent) {\n this.sortChange.emit(sortState);\n }\n\n if (this.tableConfig?.sortable) {\n this.tableData = [\n ...this.tableData.sort((a, b) => {\n const isAsc = sortState.direction === 'asc';\n // Cell values are dynamically keyed (TableData is Record<string, any>); assert a\n // comparable type — the cast is erased at runtime so JS relational compare is unchanged.\n const aVal = a[sortState.active] as number;\n const bVal = b[sortState.active] as number;\n return (aVal < bVal ? -1 : 1) (isAsc ? 1 : -1);\n }),\n ];\n\n if (!sortState.direction) {\n this.tableData = [...this.sourceData];\n }\n }\n }\n\n protected onRowClick(rowParams: T, rowIndex: number): void {\n this.onRowClickEvent.emit({ ...rowParams, index: rowIndex });\n }\n\n protected onDetailRowClick(rowParams: TDetail): void {\n this.onDetailRowClickEvent.emit(rowParams);\n }\n\n protected toggleRow(element: T): void {\n if (this.tableDetails) {\n this.elementDetail = this.elementDetail === element ? null : element;\n if (this.elementDetail) {\n this.tableDetailColumns.setDetailRowData({\n data: element,\n setDetailDataSource: this.setTableDetailDataSource.bind(this),\n });\n }\n }\n }\n\n private setTableDetailDataSource(rowData: TDetail[]): void {\n this.dataSourceDetail = new MatTableDataSource<TDetail>(rowData);\n }\n\n private setTableConfig(config: TableConfig<T>): void {\n config.pagination = config?.pagination ?? this.defaultPaginationConfig;\n\n this.tableConfig = config;\n\n this.columnsTooltipState = config.columns.map((column, index) => ({\n index,\n showTooltip: column.showTooltip ?? false,\n }));\n this.displayedColumns = sortByOrder<T>(config.columns.filter(column => !column.hidden)).map(\n column => column.uniqueId ?? column.key\n );\n }\n\n private setTableData(data: TableData): void {\n this.sourceData = data;\n this.tableData = data;\n }\n\n private readonly defaultPaginationConfig: Pagination = {\n currentPage: 0,\n itemsPerPage: 10,\n itemsPerPageOptions: [10, 25, 50],\n totalItems: 20,\n };\n\n trackColumnUniqueId = (index: number, column: TableColumn<T>): string => column.uniqueId ?? column.key;\n}\n","<div\n #tableContainer\n class=\"table-container\"\n [ngClass]=\"{ 'without-title': !tableConfig?.title, 'disable-border-radius': disableBorderRadius }\"\n [attr.theme]=\"applicationTheme\"\n>\n @if (tableConfig?.title) {\n <div class=\"table-header\">\n {{ tableConfig.title \| sentencecase }}\n <ng-content select=\"[title-actions]\"></ng-content>\n </div>\n }\n @if (scrollSettings$ \| async; as scrollSettings) {\n <div #table class=\"table-wrapper\" [class.sticky-header]=\"stickyHeader\" [style.--table-max-height]=\"maxHeight\">\n <table\n [attr.data-testid]=\"testId ?? 'table-main'\"\n [attr.aria-label]=\"ariaLabel \|\| null\"\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 @for (column of tableConfig.columns; track trackColumnUniqueId(i, column); let i = $index; let isLast = $last) {\n @if (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]=\"{\n width: $safeNavigationMigration(column.styles?.width),\n minWidth: $safeNavigationMigration(column.styles?.['min-width']),\n }\"\n [ngClass]=\"column.styles?.alignment ? 'th-' + $safeNavigationMigration(column.styles?.alignment) : ''\"\n [style.font-weight]=\"'bold'\"\n >\n @if (column.headerCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"\n column.headerCellTemplate;\n context: { $implicit: column.title, column, colIndex: i }\n \"\n ></ng-container>\n } @else {\n <ng-container\n [ngTemplateOutlet]=\"columnHeader\"\n [ngTemplateOutletContext]=\"{ i, column }\"\n ></ng-container>\n }\n </th>\n <td\n mat-cell\n matCellDef=\"let element; let rowIndex = dataIndex\"\n [align]=\"$safeNavigationMigration(column.styles?.alignment)\"\n [ngClass]=\"[column.styles?.alignment ? 'td-' + $safeNavigationMigration(column.styles?.alignment) : '']\"\n (click)=\"\n onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n \"\n >\n @if (loading) {\n <ui-skeleton\n class=\"table-skeleton-loader\"\n [count]=\"1\"\n [theme]=\"skeletonStyleConfig\"\n [appearance]=\"'line'\"\n ></ui-skeleton>\n } @else {\n <div class=\"row-value\">\n <ng-container\n [ngTemplateOutlet]=\"expandButton\"\n [ngTemplateOutletContext]=\"{ index: i, element }\"\n ></ng-container>\n @if (column?.type) {\n <ng-container\n ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n ></ng-container>\n } @else {\n @if (column.rowCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n ></ng-container>\n } @else {\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 }\n }\n </div>\n }\n </td>\n </ng-container>\n }\n @if (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]=\"{\n width: $safeNavigationMigration(column.styles?.width),\n minWidth: $safeNavigationMigration(column.styles?.['min-width']),\n }\"\n [ngClass]=\"column.styles?.alignment ? 'th-' + $safeNavigationMigration(column.styles?.alignment) : ''\"\n [style.font-weight]=\"'bold'\"\n >\n @if (column.headerCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"\n column.headerCellTemplate;\n context: { $implicit: column.title, column, colIndex: i }\n \"\n ></ng-container>\n } @else {\n <ng-container\n [ngTemplateOutlet]=\"columnHeader\"\n [ngTemplateOutletContext]=\"{ i, column }\"\n ></ng-container>\n }\n </th>\n <td\n mat-cell\n matCellDef=\"let element; let rowIndex = dataIndex\"\n [align]=\"$safeNavigationMigration(column.styles?.alignment)\"\n [ngClass]=\"[column.styles?.alignment ? 'td-' + $safeNavigationMigration(column.styles?.alignment) : '']\"\n (click)=\"\n onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n \"\n >\n @if (loading) {\n <ui-skeleton\n class=\"table-skeleton-loader\"\n [count]=\"1\"\n [theme]=\"skeletonStyleConfig\"\n [appearance]=\"'line'\"\n ></ui-skeleton>\n } @else {\n <div class=\"row-value\">\n <ng-container\n [ngTemplateOutlet]=\"expandButton\"\n [ngTemplateOutletContext]=\"{ index: i, element }\"\n ></ng-container>\n @if (column?.type) {\n <ng-container\n ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n ></ng-container>\n } @else {\n @if (column.rowCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n ></ng-container>\n } @else {\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 }\n }\n </div>\n }\n </td>\n </ng-container>\n }\n @if (!(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]=\"{\n width: $safeNavigationMigration(column.styles?.width),\n minWidth: $safeNavigationMigration(column.styles?.['min-width']),\n }\"\n [ngClass]=\"column.styles?.alignment ? 'th-' + $safeNavigationMigration(column.styles?.alignment) : ''\"\n >\n @if (column.headerCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"\n column.headerCellTemplate;\n context: { $implicit: column.title, column, colIndex: i }\n \"\n ></ng-container>\n } @else {\n <ng-container\n [ngTemplateOutlet]=\"columnHeader\"\n [ngTemplateOutletContext]=\"{ i, column }\"\n ></ng-container>\n }\n </th>\n <td\n mat-cell\n matCellDef=\"let element; let rowIndex = dataIndex\"\n [align]=\"$safeNavigationMigration(column.styles?.alignment)\"\n [ngClass]=\"[column.styles?.alignment ? 'td-' + $safeNavigationMigration(column.styles?.alignment) : '']\"\n (click)=\"\n onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n \"\n >\n @if (loading) {\n <ui-skeleton\n class=\"table-skeleton-loader\"\n [count]=\"1\"\n [theme]=\"skeletonStyleConfig\"\n [appearance]=\"'line'\"\n ></ui-skeleton>\n } @else {\n <div class=\"row-value\">\n <ng-container\n [ngTemplateOutlet]=\"expandButton\"\n [ngTemplateOutletContext]=\"{ index: i, element }\"\n ></ng-container>\n @if (column?.type) {\n <ng-container\n ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n ></ng-container>\n } @else {\n @if (column.rowCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n ></ng-container>\n } @else {\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 }\n }\n </div>\n }\n </td>\n </ng-container>\n }\n @if (!(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]=\"{\n width: $safeNavigationMigration(column.styles?.width),\n minWidth: $safeNavigationMigration(column.styles?.['min-width']),\n }\"\n [ngClass]=\"column.styles?.alignment ? 'th-' + $safeNavigationMigration(column.styles?.alignment) : ''\"\n >\n @if (column.headerCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"\n column.headerCellTemplate;\n context: { $implicit: column.title, column, colIndex: i }\n \"\n ></ng-container>\n } @else {\n <ng-container\n [ngTemplateOutlet]=\"columnHeader\"\n [ngTemplateOutletContext]=\"{ i, column }\"\n ></ng-container>\n }\n </th>\n <td\n mat-cell\n matCellDef=\"let element; let rowIndex = dataIndex\"\n [align]=\"$safeNavigationMigration(column.styles?.alignment)\"\n [ngClass]=\"[column.styles?.alignment ? 'td-' + $safeNavigationMigration(column.styles?.alignment) : '']\"\n (click)=\"\n onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n \"\n >\n @if (loading) {\n <ui-skeleton\n class=\"table-skeleton-loader\"\n [count]=\"1\"\n [theme]=\"skeletonStyleConfig\"\n [appearance]=\"'line'\"\n ></ui-skeleton>\n } @else {\n <div class=\"row-value\">\n <ng-container\n [ngTemplateOutlet]=\"expandButton\"\n [ngTemplateOutletContext]=\"{ index: i, element }\"\n ></ng-container>\n @if (column?.type) {\n <ng-container\n ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n ></ng-container>\n } @else {\n @if (column.rowCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n ></ng-container>\n } @else {\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 }\n }\n </div>\n }\n </td>\n </ng-container>\n }\n }\n <ng-container matColumnDef=\"expandedDetail\">\n <td mat-cell matCellDef=\"let element\" [attr.colspan]=\"displayedColumns.length\">\n @if (dataSourceDetail.data.length) {\n <div class=\"element-detail\" [@expandDetail]=\"element === elementDetail ? 'expanded' : 'collapsed'\">\n <table\n data-testid=\"table-detail\"\n mat-table\n [dataSource]=\"dataSourceDetail\"\n [ngClass]=\"{ 'hide-borders': element === tableData[tableData.length - 1] }\"\n >\n @for (tableColumn of tableDetailColumns.columnDefs; track tableColumn) {\n <ng-container [matColumnDef]=\"tableColumn.title ?? ''\">\n <th\n mat-header-cell\n matHeaderCellDef=\"let element\"\n arrowPosition=\"after\"\n [ngStyle]=\"{ width: $safeNavigationMigration(tableColumn.styles?.width) }\"\n [ngClass]=\"\n tableColumn.styles?.alignment\n ? 'th-' + $safeNavigationMigration(tableColumn.styles?.alignment)\n : ''\n \"\n >\n {{ tableColumn.title \| uppercase }}\n </th>\n <td\n mat-cell\n matCellDef=\"let element\"\n (click)=\"onDetailRowClick(element)\"\n [align]=\"$safeNavigationMigration(tableColumn.styles?.alignment)\"\n [ngClass]=\"\n tableColumn.styles?.alignment\n ? 'td-' + $safeNavigationMigration(tableColumn.styles?.alignment)\n : ''\n \"\n [ngStyle]=\"{ width: $safeNavigationMigration(tableColumn.styles?.width) }\"\n >\n <ng-container\n ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn }\"\n ></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 }\n </td>\n </ng-container>\n <ng-template #tableDataTpl let-element=\"element\" let-tableColumn=\"tableColumn\">\n <div class=\"align-wrapper\">\n @switch (tableColumn.type) {\n @case (DataType.FIELD) {\n {{ element \| dataPropertyGetter: tableColumn.key }}\n }\n @case (DataType.FUNCTION) {\n {{ tableColumn.function?.(element) }}\n }\n @case (DataType.RENDERER) {\n <ng-template [dynamicComponent]=\"$any([tableColumn.renderer, element] \| memoizeFunc: callRenderer)\">\n </ng-template>\n }\n @default {\n {{ element \| dataPropertyGetter: tableColumn.key }}\n }\n }\n </div>\n </ng-template>\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: $safeNavigationMigration(row?.selected),\n 'last-row': row === tableData[tableData.length - 1] && !elementDetail,\n }\"\n (click)=\"toggleRow(row)\"\n ></tr>\n @if (tableDetails && tableDetailColumns?.columnDefs?.length) {\n <tr mat-row matRowDef=\"let row; columns: ['expandedDetail']\" class=\"detail-row\"></tr>\n }\n @if (tableConfig.noDataRowTpl) {\n <tr matNoDataRow>\n <ng-container *ngTemplateOutlet=\"tableConfig.noDataRowTpl\"></ng-container>\n </tr>\n }\n </table>\n </div>\n }\n\n @if (!tableConfig?.hidePagination && tableConfig?.pagination) {\n <ui-paginator\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 }\n</div>\n\n<ng-template #expandButton let-i=\"index\" let-element=\"element\">\n @if (!i && tableDetails) {\n <ui-button\n [applicationTheme]=\"applicationTheme\"\n variant=\"icon-button\"\n [ngClass]=\"{ opened: elementDetail && element === elementDetail }\"\n [iconName]=\"\n elementDetail && element === elementDetail ? 'Arrow-chevron-up-in-line' : 'Arrow-chevron-down-in-line'\n \"\n ></ui-button>\n }\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 @if (column?.showTooltip) {\n <ui-icon\n [name]=\"'Help-in-line'\"\n [matTooltipClass]=\"applicationTheme\"\n [matTooltip]=\"(column?.showTooltip ? (column?.tooltip ? column.tooltip : column.title) : '') \|\| ''\"\n ></ui-icon>\n }\n </div>\n</ng-template>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatSortModule } from '@angular/material/sort';\nimport { MatTableModule } from '@angular/material/table';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport {\n EllipseTextDirective,\n MemoizeFuncPipe,\n DataPropertyGetterPipe,\n DynamicComponentDirective,\n} from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { PaginatorComponentModule } from '@testgorilla/tgo-ui/components/paginator';\nimport { SkeletonComponent } from '@testgorilla/tgo-ui/components/skeleton';\n\nimport { SentenceCasePipe } from './sentence-case.pipe';\nimport { TableComponent } from './table.component';\n\n@NgModule({\n imports: [\n CommonModule,\n MatTableModule,\n MatTooltipModule,\n SkeletonComponent,\n PaginatorComponentModule,\n ButtonComponentModule,\n MatSortModule,\n IconComponentModule,\n EllipseTextDirective,\n DynamicComponentDirective,\n DataPropertyGetterPipe,\n MemoizeFuncPipe,\n TableComponent,\n SentenceCasePipe,\n ],\n exports: [TableComponent],\n})\nexport class TableComponentModule {}\n"],"mappings":"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"}
1	+ {"version":3,"file":"testgorilla-tgo-ui-components-table.mjs","names":[],"sources":["../../../components/table/sentence-case.pipe.ts","../../../components/table/table.model.ts","../../../components/table/table.utils.ts","../../../components/table/table.component.ts","../../../components/table/table.component.html","../../../components/table/table.component.module.ts"],"sourcesContent":["import { Pipe, PipeTransform } from '@angular/core';\n\n@Pipe({ name: 'sentencecase' })\nexport class SentenceCasePipe implements PipeTransform {\n transform(value: string \| undefined): string {\n if (!value) {\n return '';\n }\n return value.charAt(0).toUpperCase() + value.slice(1).toLowerCase();\n }\n}\n","import { TemplateRef, Type } from '@angular/core';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any -- consumer-ergonomic default row type; consumers narrow via TableConfig<MyRow>\nexport interface TableConfig<T = any> {\n columns: TableColumn<T>[];\n pagination?: Pagination;\n title?: string;\n width?: number;\n sort?: Sort;\n hidePagination?: boolean;\n noDataRowTpl?: TemplateRef<unknown>;\n sortable?: boolean;\n}\n\nexport interface TableConfigWithPagination<T> extends TableConfig<T> {\n pagination?: Pagination;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any -- consumer-ergonomic default row type; consumers narrow via TableColumn<MyRow>\nexport interface TableColumn<T = any> {\n title?: string;\n key: string;\n allowMultiline?: boolean;\n bold?: boolean;\n showTooltip?: boolean;\n tooltip?: string;\n allowSort?: boolean;\n isSticky?: boolean;\n headerCellTemplate?: TemplateRef<unknown>;\n rowCellTemplate?: TemplateRef<unknown>;\n rowCellTemplateClick?: () => void;\n sortHeader?: string;\n hidden?: boolean;\n order?: number;\n fontSize?: '12px' \| '14px';\n field?: string;\n type?: ColumnType;\n function?: (v: T) => string;\n renderer?: (v: T) => ComponentRenderer \| string;\n styles?: ColumnStyles;\n sortStart?: SortDirection;\n uniqueId?: string;\n}\n\nexport interface Pagination {\n itemsPerPageOptions: number[];\n itemsPerPage: number;\n currentPage: number;\n totalItems: number;\n}\n\nexport type TableData = Record<string, unknown>[];\n\nexport interface ColumnEllipse {\n index: number;\n showTooltip: boolean;\n}\n\nexport interface Sort {\n active: string;\n direction: SortDirection;\n defaultSortStart?: SortDirection;\n}\n\nexport type SortDirection = 'asc' \| 'desc' \| '';\n\nexport interface TableDetailColumn<T, TDetail> {\n columnDefs: TableColumn<TDetail>[];\n setDetailRowData: (params: DetailRowDataParams<T, TDetail>) => void;\n}\n\nexport interface DetailRowDataParams<T, TDetail> {\n data: T;\n\n setDetailDataSource(rowData: TDetail[]): void;\n}\n\nexport enum ColumnType {\n FIELD = 'field',\n FUNCTION = 'function',\n RENDERER = 'renderer',\n}\n\nexport interface ComponentRenderer {\n component: Type<unknown>;\n inputs?: Record<string, unknown>;\n outputs?: { [key: string]: (event: unknown) => void };\n}\n\nexport interface ColumnStyles {\n alignment?: ColumnAlignment;\n width?: string;\n 'min-width'?: string;\n padding?: string;\n}\n\nexport enum ColumnAlignment {\n LEFT = 'left',\n RIGHT = 'right',\n CENTER = 'center',\n}\n\nexport enum ColumnTypeEnum {\n FIELD = 'field',\n FUNCTION = 'function',\n RENDERER = 'renderer',\n}\n\nexport enum ColumnAlignmentEnum {\n LEFT = 'left',\n RIGHT = 'right',\n CENTER = 'center',\n}\n\nexport type DataSource = {\n [key: string]: unknown;\n};\n\nexport type ScrollSettings = { scrollEnd: boolean; horizontalScroll: boolean; scrollStart: boolean };\n","import { TableColumn } from './table.model';\n\n/*\n Sorting table columns by order value if set.\n * The rest columns keep the same ordering and displayed after the sorted ones.\n /\nexport const sortByOrder = <T>(columns: TableColumn<T>[]): TableColumn<T>[] => {\n const withOrderColumns = columns.filter(v => v.order);\n const withoutOrderColumns = columns.filter(v => !v.order);\n\n if (!withOrderColumns.length) {\n return columns;\n }\n\n if (withoutOrderColumns.length) {\n const sortedColumns = new Array<TableColumn<T>>(columns.length);\n withOrderColumns.forEach(column => (sortedColumns[(column.order ?? 1) - 1] = column));\n withoutOrderColumns.forEach(column => {\n const emptyIndex = sortedColumns.findIndex(v => !v);\n sortedColumns[emptyIndex] = column;\n });\n return sortedColumns;\n } else {\n const sortedOrderedColumns = withOrderColumns.sort((a, b) => (a.order ?? 0) - (b.order ?? 0));\n\n return [...sortedOrderedColumns, ...withoutOrderColumns];\n }\n};\n","import { animate, state, style, transition, trigger } from '@angular/animations';\nimport { NgClass, NgStyle, NgTemplateOutlet, AsyncPipe, UpperCasePipe } from '@angular/common';\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n DestroyRef,\n ElementRef,\n EventEmitter,\n Inject,\n Input,\n OnChanges,\n Optional,\n Output,\n SimpleChanges,\n ViewChild,\n OnInit,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { PageEvent } from '@angular/material/paginator';\nimport { Sort, MatSort, MatSortHeader } from '@angular/material/sort';\nimport {\n MatTableDataSource,\n MatTable,\n MatColumnDef,\n MatHeaderCellDef,\n MatHeaderCell,\n MatCellDef,\n MatCell,\n MatHeaderRowDef,\n MatHeaderRow,\n MatRowDef,\n MatRow,\n MatNoDataRow,\n} from '@angular/material/table';\nimport { MatTooltip } from '@angular/material/tooltip';\nimport { BehaviorSubject, fromEvent, Observable } from 'rxjs';\n\nimport { ButtonComponent } from '@testgorilla/tgo-ui/components/button';\nimport {\n DynamicComponentDirective,\n ApplicationTheme,\n IS_MOBILE_TOKEN,\n EllipseTextDirective,\n DataPropertyGetterPipe,\n MemoizeFuncPipe,\n} from '@testgorilla/tgo-ui/components/core';\nimport { IconComponent } from '@testgorilla/tgo-ui/components/icon';\nimport { PaginatorComponent } from '@testgorilla/tgo-ui/components/paginator';\nimport { SkeletonComponent } from '@testgorilla/tgo-ui/components/skeleton';\n\nimport { SentenceCasePipe } from './sentence-case.pipe';\nimport {\n ColumnEllipse,\n ColumnType,\n ComponentRenderer,\n DataSource,\n Pagination,\n ScrollSettings,\n TableColumn,\n TableConfig,\n TableConfigWithPagination,\n TableData,\n TableDetailColumn,\n} from './table.model';\nimport { sortByOrder } from './table.utils';\n\n@Component({\n selector: 'ui-table',\n templateUrl: './table.component.html',\n styleUrls: ['./table.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n / eslint-disable @typescript-eslint/no-deprecated -- the @angular/animations trigger/state/style/animate/transition DSL is deprecated in 20.2 in favor of template-level animate.enter/animate.leave; migrating every Material/component animation is out of scope for this lint pass /\n animations: [\n trigger('expandDetail', [\n state('collapsed, void', style({ height: '0px' })),\n state('expanded', style({ height: '' })),\n transition('expanded <=> collapsed', animate('225ms cubic-bezier(0.4, 0.0, 0.2, 1)')),\n transition('expanded <=> void', animate('225ms cubic-bezier(0.4, 0.0, 0.2, 1)')),\n ]),\n ],\n imports: [\n NgClass,\n MatTable,\n MatSort,\n MatColumnDef,\n MatHeaderCellDef,\n MatHeaderCell,\n MatSortHeader,\n NgStyle,\n NgTemplateOutlet,\n MatCellDef,\n MatCell,\n SkeletonComponent,\n MatHeaderRowDef,\n MatHeaderRow,\n MatRowDef,\n MatRow,\n DynamicComponentDirective,\n MatNoDataRow,\n PaginatorComponent,\n ButtonComponent,\n EllipseTextDirective,\n IconComponent,\n MatTooltip,\n AsyncPipe,\n UpperCasePipe,\n DataPropertyGetterPipe,\n MemoizeFuncPipe,\n SentenceCasePipe,\n ],\n})\nexport class TableComponent<T extends DataSource, TDetail extends DataSource>\n implements OnChanges, AfterViewInit, OnInit\n{\n /*\n Table configuration\n \n @type {TableConfig}\n * @memberof TableComponent\n /\n @Input({ required: true }) config: TableConfigWithPagination<T>;\n\n /\n Input property for providing the table data.\n \n @type {TableData}\n * @memberof TableComponent\n /\n @Input() data: TableData;\n\n /\n Input property indicating whether the table is in a loading state.\n \n @type {boolean}\n * @memberof TableComponent\n * @default false\n /\n @Input() loading = false;\n\n /\n \n * Defines the application theme\n * @type {ApplicationTheme}\n * @memberof TableComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /\n Data structure to select which columns should be rendered and their capabilities\n \n @type {TableDetailColumn}\n * @memberof TableComponent\n /\n @Input() tableDetailColumns: TableDetailColumn<T, TDetail>;\n @Input() tableDetails = false;\n\n /\n Disable border radius for table\n \n @type {boolean}\n * @memberof TableComponent\n /\n @Input() disableBorderRadius = false;\n\n /\n Condensed table\n \n @type {boolean}\n * @memberof TableComponent\n /\n @Input() isCondensed = false;\n\n /\n Sticky header\n \n @type {boolean}\n * @memberof TableComponent\n /\n @Input() stickyHeader = false;\n\n /\n Max height\n \n @type {string}\n * @memberof TableComponent\n /\n @Input() maxHeight = '576px';\n\n @Input() testId: string \| null = null;\n\n @Input() ariaLabel = '';\n\n // eslint-disable-next-line @angular-eslint/no-output-on-prefix -- public output; dropping on- prefix is breaking, deferred to the breaking-change MAJOR (see plan)\n @Output() onRowClickEvent = new EventEmitter<T & { index: number }>();\n // eslint-disable-next-line @angular-eslint/no-output-on-prefix -- public output; dropping on- prefix is breaking, deferred to the breaking-change MAJOR (see plan)\n @Output() onDetailRowClickEvent = new EventEmitter<TDetail>();\n @Output() paginatorChange = new EventEmitter<PageEvent>();\n @Output() sortChange = new EventEmitter<Sort>();\n\n @ViewChild('table') table: ElementRef<HTMLElement>;\n\n protected tableData: TableData;\n protected sourceData: TableData;\n protected columnsTooltipState: ColumnEllipse[] = [];\n protected tableConfig: TableConfigWithPagination<T>;\n protected displayedColumns: string[] = [];\n protected columnsDetailToDisplay: string[] = [];\n protected skeletonStyleConfig = {\n background: '#F6F6F6',\n 'border-radius': '4px',\n height: '24px',\n };\n protected dataSourceDetail = new MatTableDataSource<TDetail>([]);\n protected elementDetail: T \| null;\n protected readonly DataType = ColumnType;\n protected scrollSettings$ = new BehaviorSubject<ScrollSettings>({\n scrollEnd: false,\n horizontalScroll: false,\n scrollStart: false,\n });\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme,\n private readonly destroyRef: DestroyRef,\n @Inject(IS_MOBILE_TOKEN) protected readonly isMobile$: Observable<boolean>\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n }\n\n ngOnInit() {\n this.setTableConfig(this.config);\n this.setTableData(this.data);\n\n if (this.applicationTheme !== 'classic') {\n this.skeletonStyleConfig.background = '#F4F4F4';\n }\n document.body.setAttribute('theme', this.applicationTheme);\n\n if (this.tableDetailColumns) {\n const filteredColumns = this.tableDetailColumns.columnDefs.filter(column => !column.hidden);\n this.columnsDetailToDisplay = filteredColumns.length\n ? filteredColumns.map((tableColumn: TableColumn<TDetail>) => tableColumn.title ?? '')\n : [];\n }\n\n if (this.tableConfig?.sortable && this.tableConfig?.sort) {\n this.onSortChange(this.tableConfig.sort, false);\n }\n }\n\n ngAfterViewInit() {\n this.hasTableScroll();\n fromEvent(this.table.nativeElement, 'scroll')\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(() => this.hasTableScroll());\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n if (changes['config']?.currentValue) {\n const config = changes['config'].currentValue as TableConfig<T>;\n this.setTableConfig(config);\n }\n if (changes['data']?.currentValue) {\n this.setTableData(changes['data'].currentValue as TableData);\n }\n }\n\n hasTableScroll(): void {\n const table = this.table.nativeElement;\n const horizontalScroll = table.scrollWidth > table.clientWidth;\n const scrollEnd = table.scrollLeft + table.clientWidth >= table.scrollWidth;\n this.scrollSettings$.next({\n scrollStart: !table.scrollLeft,\n scrollEnd,\n horizontalScroll,\n });\n }\n\n callRenderer([rendererFn, element]: [(v: T) => ComponentRenderer \| string, T]):\n \| ComponentRenderer\n \| string\n \| undefined {\n return rendererFn ? rendererFn(element) : undefined;\n }\n\n protected onPaginatorChange(event: PageEvent): void {\n this.paginatorChange.emit(event);\n }\n\n protected onChangeColumnSize(columnIndex: number, showTooltip: boolean): void {\n this.columnsTooltipState = this.columnsTooltipState.map(column => {\n if (column.index === columnIndex) {\n column.showTooltip = showTooltip;\n }\n return column;\n });\n }\n\n protected onSortChange(sortState: Sort, emitEvent = true): void {\n if (this.loading) {\n return;\n }\n\n if (emitEvent) {\n this.sortChange.emit(sortState);\n }\n\n if (this.tableConfig?.sortable) {\n this.tableData = [\n ...this.tableData.sort((a, b) => {\n const isAsc = sortState.direction === 'asc';\n // Cell values are dynamically keyed (TableData is Record<string, any>); assert a\n // comparable type — the cast is erased at runtime so JS relational compare is unchanged.\n const aVal = a[sortState.active] as number;\n const bVal = b[sortState.active] as number;\n return (aVal < bVal ? -1 : 1) (isAsc ? 1 : -1);\n }),\n ];\n\n if (!sortState.direction) {\n this.tableData = [...this.sourceData];\n }\n }\n }\n\n protected onRowClick(rowParams: T, rowIndex: number): void {\n this.onRowClickEvent.emit({ ...rowParams, index: rowIndex });\n }\n\n protected onDetailRowClick(rowParams: TDetail): void {\n this.onDetailRowClickEvent.emit(rowParams);\n }\n\n protected toggleRow(element: T): void {\n if (this.tableDetails) {\n this.elementDetail = this.elementDetail === element ? null : element;\n if (this.elementDetail) {\n this.tableDetailColumns.setDetailRowData({\n data: element,\n setDetailDataSource: this.setTableDetailDataSource.bind(this),\n });\n }\n }\n }\n\n private setTableDetailDataSource(rowData: TDetail[]): void {\n this.dataSourceDetail = new MatTableDataSource<TDetail>(rowData);\n }\n\n private setTableConfig(config: TableConfig<T>): void {\n config.pagination = config?.pagination ?? this.defaultPaginationConfig;\n\n this.tableConfig = config;\n\n this.columnsTooltipState = config.columns.map((column, index) => ({\n index,\n showTooltip: column.showTooltip ?? false,\n }));\n this.displayedColumns = sortByOrder<T>(config.columns.filter(column => !column.hidden)).map(\n column => column.uniqueId ?? column.key\n );\n }\n\n private setTableData(data: TableData): void {\n this.sourceData = data;\n this.tableData = data;\n }\n\n private readonly defaultPaginationConfig: Pagination = {\n currentPage: 0,\n itemsPerPage: 10,\n itemsPerPageOptions: [10, 25, 50],\n totalItems: 20,\n };\n\n trackColumnUniqueId = (index: number, column: TableColumn<T>): string => column.uniqueId ?? column.key;\n}\n","<div\n #tableContainer\n class=\"table-container\"\n [ngClass]=\"{ 'without-title': !tableConfig?.title, 'disable-border-radius': disableBorderRadius }\"\n [attr.theme]=\"applicationTheme\"\n>\n @if (tableConfig?.title) {\n <div class=\"table-header\">\n {{ tableConfig.title \| sentencecase }}\n <ng-content select=\"[title-actions]\"></ng-content>\n </div>\n }\n @if (scrollSettings$ \| async; as scrollSettings) {\n <div #table class=\"table-wrapper\" [class.sticky-header]=\"stickyHeader\" [style.--table-max-height]=\"maxHeight\">\n <table\n [attr.data-testid]=\"testId ?? 'table-main'\"\n [attr.aria-label]=\"ariaLabel \|\| null\"\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 @for (column of tableConfig.columns; track trackColumnUniqueId(i, column); let i = $index; let isLast = $last) {\n @if (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]=\"{\n width: $safeNavigationMigration(column.styles?.width),\n minWidth: $safeNavigationMigration(column.styles?.['min-width']),\n }\"\n [ngClass]=\"column.styles?.alignment ? 'th-' + $safeNavigationMigration(column.styles?.alignment) : ''\"\n [style.font-weight]=\"'bold'\"\n >\n @if (column.headerCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"\n column.headerCellTemplate;\n context: { $implicit: column.title, column, colIndex: i }\n \"\n ></ng-container>\n } @else {\n <ng-container\n [ngTemplateOutlet]=\"columnHeader\"\n [ngTemplateOutletContext]=\"{ i, column }\"\n ></ng-container>\n }\n </th>\n <td\n mat-cell\n matCellDef=\"let element; let rowIndex = dataIndex\"\n [align]=\"$safeNavigationMigration(column.styles?.alignment)\"\n [ngClass]=\"[column.styles?.alignment ? 'td-' + $safeNavigationMigration(column.styles?.alignment) : '']\"\n (click)=\"\n onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n \"\n >\n @if (loading) {\n <ui-skeleton\n class=\"table-skeleton-loader\"\n [count]=\"1\"\n [theme]=\"skeletonStyleConfig\"\n [appearance]=\"'line'\"\n ></ui-skeleton>\n } @else {\n <div class=\"row-value\">\n <ng-container\n [ngTemplateOutlet]=\"expandButton\"\n [ngTemplateOutletContext]=\"{ index: i, element }\"\n ></ng-container>\n @if (column?.type) {\n <ng-container\n ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n ></ng-container>\n } @else {\n @if (column.rowCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n ></ng-container>\n } @else {\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 }\n }\n </div>\n }\n </td>\n </ng-container>\n }\n @if (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]=\"{\n width: $safeNavigationMigration(column.styles?.width),\n minWidth: $safeNavigationMigration(column.styles?.['min-width']),\n }\"\n [ngClass]=\"column.styles?.alignment ? 'th-' + $safeNavigationMigration(column.styles?.alignment) : ''\"\n [style.font-weight]=\"'bold'\"\n >\n @if (column.headerCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"\n column.headerCellTemplate;\n context: { $implicit: column.title, column, colIndex: i }\n \"\n ></ng-container>\n } @else {\n <ng-container\n [ngTemplateOutlet]=\"columnHeader\"\n [ngTemplateOutletContext]=\"{ i, column }\"\n ></ng-container>\n }\n </th>\n <td\n mat-cell\n matCellDef=\"let element; let rowIndex = dataIndex\"\n [align]=\"$safeNavigationMigration(column.styles?.alignment)\"\n [ngClass]=\"[column.styles?.alignment ? 'td-' + $safeNavigationMigration(column.styles?.alignment) : '']\"\n (click)=\"\n onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n \"\n >\n @if (loading) {\n <ui-skeleton\n class=\"table-skeleton-loader\"\n [count]=\"1\"\n [theme]=\"skeletonStyleConfig\"\n [appearance]=\"'line'\"\n ></ui-skeleton>\n } @else {\n <div class=\"row-value\">\n <ng-container\n [ngTemplateOutlet]=\"expandButton\"\n [ngTemplateOutletContext]=\"{ index: i, element }\"\n ></ng-container>\n @if (column?.type) {\n <ng-container\n ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n ></ng-container>\n } @else {\n @if (column.rowCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n ></ng-container>\n } @else {\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 }\n }\n </div>\n }\n </td>\n </ng-container>\n }\n @if (!(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]=\"{\n width: $safeNavigationMigration(column.styles?.width),\n minWidth: $safeNavigationMigration(column.styles?.['min-width']),\n }\"\n [ngClass]=\"column.styles?.alignment ? 'th-' + $safeNavigationMigration(column.styles?.alignment) : ''\"\n >\n @if (column.headerCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"\n column.headerCellTemplate;\n context: { $implicit: column.title, column, colIndex: i }\n \"\n ></ng-container>\n } @else {\n <ng-container\n [ngTemplateOutlet]=\"columnHeader\"\n [ngTemplateOutletContext]=\"{ i, column }\"\n ></ng-container>\n }\n </th>\n <td\n mat-cell\n matCellDef=\"let element; let rowIndex = dataIndex\"\n [align]=\"$safeNavigationMigration(column.styles?.alignment)\"\n [ngClass]=\"[column.styles?.alignment ? 'td-' + $safeNavigationMigration(column.styles?.alignment) : '']\"\n (click)=\"\n onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n \"\n >\n @if (loading) {\n <ui-skeleton\n class=\"table-skeleton-loader\"\n [count]=\"1\"\n [theme]=\"skeletonStyleConfig\"\n [appearance]=\"'line'\"\n ></ui-skeleton>\n } @else {\n <div class=\"row-value\">\n <ng-container\n [ngTemplateOutlet]=\"expandButton\"\n [ngTemplateOutletContext]=\"{ index: i, element }\"\n ></ng-container>\n @if (column?.type) {\n <ng-container\n ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n ></ng-container>\n } @else {\n @if (column.rowCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n ></ng-container>\n } @else {\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 }\n }\n </div>\n }\n </td>\n </ng-container>\n }\n @if (!(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]=\"{\n width: $safeNavigationMigration(column.styles?.width),\n minWidth: $safeNavigationMigration(column.styles?.['min-width']),\n }\"\n [ngClass]=\"column.styles?.alignment ? 'th-' + $safeNavigationMigration(column.styles?.alignment) : ''\"\n >\n @if (column.headerCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"\n column.headerCellTemplate;\n context: { $implicit: column.title, column, colIndex: i }\n \"\n ></ng-container>\n } @else {\n <ng-container\n [ngTemplateOutlet]=\"columnHeader\"\n [ngTemplateOutletContext]=\"{ i, column }\"\n ></ng-container>\n }\n </th>\n <td\n mat-cell\n matCellDef=\"let element; let rowIndex = dataIndex\"\n [align]=\"$safeNavigationMigration(column.styles?.alignment)\"\n [ngClass]=\"[column.styles?.alignment ? 'td-' + $safeNavigationMigration(column.styles?.alignment) : '']\"\n (click)=\"\n onRowClick(element, rowIndex); column?.rowCellTemplateClick ? column!.rowCellTemplateClick?.() : ''\n \"\n >\n @if (loading) {\n <ui-skeleton\n class=\"table-skeleton-loader\"\n [count]=\"1\"\n [theme]=\"skeletonStyleConfig\"\n [appearance]=\"'line'\"\n ></ui-skeleton>\n } @else {\n <div class=\"row-value\">\n <ng-container\n [ngTemplateOutlet]=\"expandButton\"\n [ngTemplateOutletContext]=\"{ index: i, element }\"\n ></ng-container>\n @if (column?.type) {\n <ng-container\n ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn: column }\"\n ></ng-container>\n } @else {\n @if (column.rowCellTemplate) {\n <ng-container\n ngTemplateOutlet=\"column.rowCellTemplate; context: { $implicit: element, rowIndex }\"\n ></ng-container>\n } @else {\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 }\n }\n </div>\n }\n </td>\n </ng-container>\n }\n }\n <ng-container matColumnDef=\"expandedDetail\">\n <td mat-cell matCellDef=\"let element\" [attr.colspan]=\"displayedColumns.length\">\n @if (dataSourceDetail.data.length) {\n <div class=\"element-detail\" [@expandDetail]=\"element === elementDetail ? 'expanded' : 'collapsed'\">\n <table\n data-testid=\"table-detail\"\n mat-table\n [dataSource]=\"dataSourceDetail\"\n [ngClass]=\"{ 'hide-borders': element === tableData[tableData.length - 1] }\"\n >\n @for (tableColumn of tableDetailColumns.columnDefs; track tableColumn) {\n <ng-container [matColumnDef]=\"tableColumn.title ?? ''\">\n <th\n mat-header-cell\n matHeaderCellDef=\"let element\"\n arrowPosition=\"after\"\n [ngStyle]=\"{ width: $safeNavigationMigration(tableColumn.styles?.width) }\"\n [ngClass]=\"\n tableColumn.styles?.alignment\n ? 'th-' + $safeNavigationMigration(tableColumn.styles?.alignment)\n : ''\n \"\n >\n {{ tableColumn.title \| uppercase }}\n </th>\n <td\n mat-cell\n matCellDef=\"let element\"\n (click)=\"onDetailRowClick(element)\"\n [align]=\"$safeNavigationMigration(tableColumn.styles?.alignment)\"\n [ngClass]=\"\n tableColumn.styles?.alignment\n ? 'td-' + $safeNavigationMigration(tableColumn.styles?.alignment)\n : ''\n \"\n [ngStyle]=\"{ width: $safeNavigationMigration(tableColumn.styles?.width) }\"\n >\n <ng-container\n ngTemplateOutlet=\"tableDataTpl; context: { element, tableColumn }\"\n ></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 }\n </td>\n </ng-container>\n <ng-template #tableDataTpl let-element=\"element\" let-tableColumn=\"tableColumn\">\n <div class=\"align-wrapper\">\n @switch (tableColumn.type) {\n @case (DataType.FIELD) {\n {{ element \| dataPropertyGetter: tableColumn.key }}\n }\n @case (DataType.FUNCTION) {\n {{ tableColumn.function?.(element) }}\n }\n @case (DataType.RENDERER) {\n <ng-template [dynamicComponent]=\"$any([tableColumn.renderer, element] \| memoizeFunc: callRenderer)\">\n </ng-template>\n }\n @default {\n {{ element \| dataPropertyGetter: tableColumn.key }}\n }\n }\n </div>\n </ng-template>\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: $safeNavigationMigration(row?.selected),\n 'last-row': row === tableData[tableData.length - 1] && !elementDetail,\n }\"\n (click)=\"toggleRow(row)\"\n ></tr>\n @if (tableDetails && tableDetailColumns?.columnDefs?.length) {\n <tr mat-row matRowDef=\"let row; columns: ['expandedDetail']\" class=\"detail-row\"></tr>\n }\n @if (tableConfig.noDataRowTpl) {\n <tr matNoDataRow>\n <ng-container *ngTemplateOutlet=\"tableConfig.noDataRowTpl\"></ng-container>\n </tr>\n }\n </table>\n </div>\n }\n\n @if (!tableConfig?.hidePagination && tableConfig?.pagination) {\n <ui-paginator\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 }\n</div>\n\n<ng-template #expandButton let-i=\"index\" let-element=\"element\">\n @if (!i && tableDetails) {\n <ui-button\n [applicationTheme]=\"applicationTheme\"\n variant=\"icon-button\"\n [ngClass]=\"{ opened: elementDetail && element === elementDetail }\"\n [iconName]=\"\n elementDetail && element === elementDetail ? 'Arrow-chevron-up-in-line' : 'Arrow-chevron-down-in-line'\n \"\n ></ui-button>\n }\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 @if (column?.showTooltip) {\n <ui-icon\n [name]=\"'Help-in-line'\"\n [matTooltipClass]=\"applicationTheme\"\n [matTooltip]=\"(column?.showTooltip ? (column?.tooltip ? column.tooltip : column.title) : '') \|\| ''\"\n ></ui-icon>\n }\n </div>\n</ng-template>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatSortModule } from '@angular/material/sort';\nimport { MatTableModule } from '@angular/material/table';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport {\n EllipseTextDirective,\n MemoizeFuncPipe,\n DataPropertyGetterPipe,\n DynamicComponentDirective,\n} from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { PaginatorComponentModule } from '@testgorilla/tgo-ui/components/paginator';\nimport { SkeletonComponent } from '@testgorilla/tgo-ui/components/skeleton';\n\nimport { SentenceCasePipe } from './sentence-case.pipe';\nimport { TableComponent } from './table.component';\n\n@NgModule({\n imports: [\n CommonModule,\n MatTableModule,\n MatTooltipModule,\n SkeletonComponent,\n PaginatorComponentModule,\n ButtonComponentModule,\n MatSortModule,\n IconComponentModule,\n EllipseTextDirective,\n DynamicComponentDirective,\n DataPropertyGetterPipe,\n MemoizeFuncPipe,\n TableComponent,\n SentenceCasePipe,\n ],\n exports: [TableComponent],\n})\nexport class TableComponentModule {}\n"],"mappings":"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"}