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-radio-button.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"testgorilla-tgo-ui-components-radio-button.mjs","names":[],"sources":["../../../components/radio-button/radio-button.component.ts","../../../components/radio-button/radio-button.component.html","../../../components/radio-button/radio-button.component.module.ts"],"sourcesContent":["/* eslint-disable no-underscore-dangle /\nimport { FocusMonitor } from '@angular/cdk/a11y';\nimport { NgClass } from '@angular/common';\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n DestroyRef,\n EventEmitter,\n HostBinding,\n HostListener,\n inject,\n Input,\n NgZone,\n OnChanges,\n OnDestroy,\n OnInit,\n Output,\n ProviderToken,\n SimpleChanges,\n ViewChild,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { ControlValueAccessor, NgControl } from '@angular/forms';\nimport { MatRadioButton } from '@angular/material/radio';\nimport { MatTooltip } from '@angular/material/tooltip';\n\nimport { ApplicationTheme, Alignment, EllipseTextDirective } from '@testgorilla/tgo-ui/components/core';\n\nimport { RadioButtonEventType } from './radio-button.model';\n\n@Component({\n selector: 'ui-radio-button',\n templateUrl: './radio-button.component.html',\n styleUrls: ['./radio-button.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n // Needs to be removed since it causes some a11y issues (https://github.com/angular/components/issues/21266).\n '[attr.tabindex]': 'null',\n '[attr.aria-label]': 'null',\n '[attr.aria-labelledby]': 'null',\n '[attr.aria-describedby]': 'null',\n // Note: under normal conditions focus shouldn't land on this element, however it may be\n // programmatically set, for example inside of a focus trap, in this case we want to forward\n // the focus to the mat-radio-button element.\n '(focus)': 'radioElement.focus()',\n },\n imports: [NgClass, MatRadioButton, EllipseTextDirective, MatTooltip],\n})\nexport class RadioButtonComponent implements OnInit, OnChanges, ControlValueAccessor, AfterViewInit, OnDestroy {\n private _isProcessingClick = false;\n\n @HostListener('click', ['$event'])\n onHostClick(event: MouseEvent): void {\n if (this._isProcessingClick) {\n return;\n }\n const target = event.target as HTMLElement \| null;\n const targetClasses: string = target?.classList?.value ?? '';\n const fromMediaArea = this.mediaCard && target?.closest?.('.media-card-wrapper');\n if (targetClasses.includes('mat-mdc-radio-button') \|\| targetClasses.includes('mdc-form-field') \|\| fromMediaArea) {\n this._isProcessingClick = true;\n this.radioElement._inputElement.nativeElement.click();\n this._isProcessingClick = false;\n }\n }\n /\n Determines whether the radio button is disabled.\n * Default: false.\n \n @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Input() disabled = false;\n\n /\n Determines whether the radio button is checked.\n * Default: false.\n \n @type {boolean}\n * @memberof RadioButtonComponent\n /\n //@Input() selected = false;\n\n _selected = false;\n @Input()\n get selected() {\n return this._selected;\n }\n set selected(selected: boolean) {\n this._selected = selected;\n }\n\n /\n Determines whether the radio button can be unchecked.\n * Default: false.\n \n @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Input() allowUnselect = false;\n\n /\n Determines the radio button color.\n * Default: Test Gorilla primary color.\n \n @type {string}\n * @memberof RadioButtonComponent\n /\n @HostBinding('style.--color')\n @Input()\n companyColor: string \| null = null;\n\n /\n Used to group radios for unique selection.\n \n @type {string}\n * @memberof RadioButtonComponent\n /\n @Input() name = '';\n\n /\n Text content will be applied to the input element if present.\n \n @type {string}\n * @memberof RadioButtonComponent\n /\n @Input() label = '';\n\n /\n Determines whether the radio button is a multiple choice cell.\n * Default: false\n \n @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Input() multiple = false;\n\n /\n Renders the radio button as a media card. The image/video/gif passed via\n * the `[radio-media]` content slot fills the card and the radio + label sit\n * on top, in the bottom-left, with a dark scrim for contrast.\n \n @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Input() mediaCard = false;\n\n /\n Determines value of the radio button.\n * Default: false\n \n @type {any}\n * @memberof RadioButtonComponent\n /\n @Input() value: unknown;\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof RadioButtonComponent\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 RadioButtonComponent\n /\n @Input() ariaLabel: string;\n\n @Input() testId: string \| null = null;\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 RadioButtonComponent\n /\n @Input() ariaRequired = false;\n\n /\n Defines if checkbox has error\n \n @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Input() hasError = false;\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 RadioButtonComponent\n /\n @Input() ariaLabelledby = '';\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 RadioButtonComponent\n /\n @Input() ariaDescribedby = '';\n\n /\n Truncate text if it is too long\n * @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Input() truncateText = false;\n\n /\n Text alignment\n * @type {'center' \| 'top'}\n * @memberof RadioButtonComponent\n /\n @Input() alignment: Alignment = 'center';\n\n /\n Sets the tab index for the checkbox component.\n * This determines the order in which elements receive focus when the user navigates through them using the Tab key.\n * Default value is 0.\n \n @type {number}\n * @memberof RadioButtonComponent\n /\n @Input() tabIndex = 0;\n\n /\n Show tooltip when label is truncated\n * @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Input() hideTooltipOnEllipsis = false;\n\n /\n Event emitted when the checked state of the radio button changes.\n \n @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Output() changeRadio = new EventEmitter<RadioButtonEventType>();\n\n classMultiple: string;\n showTooltip = false;\n protected origin: string \| null = null;\n\n @ViewChild('radio') radioElement: MatRadioButton;\n\n private appliedTestId: string \| null = null;\n @ViewChild('tooltip') tooltipElement: MatTooltip;\n\n private readonly defaultAppTheme = inject(\n 'CANOPYUI_DEFAULT_APPLICATION_THEME' as unknown as ProviderToken<ApplicationTheme>,\n {\n optional: true,\n }\n );\n public ngControl = inject(NgControl, { optional: true, self: true });\n public hostNgControl = inject(NgControl, { optional: true, host: true });\n private readonly destroyRef = inject(DestroyRef);\n private readonly focusMonitor = inject(FocusMonitor);\n private readonly ngZone = inject(NgZone);\n private readonly cdr = inject(ChangeDetectorRef);\n\n constructor() {\n if (this.defaultAppTheme) {\n this.applicationTheme = this.defaultAppTheme;\n }\n\n if (this.ngControl !== null) {\n this.ngControl.valueAccessor = this;\n }\n }\n\n ngOnInit() {\n this.checkHost();\n this.classMultiple = this.setClass();\n }\n\n ngOnChanges(changes: SimpleChanges) {\n if (changes['selected']) {\n this.classMultiple = this.setClass();\n }\n this.setCompanyColor();\n this.applyTestId();\n }\n\n // MatRadioButton takes no attribute passthrough, so the id is set on the native input directly.\n private applyTestId(): void {\n if (!this.radioElement \|\| this.testId === this.appliedTestId) {\n return;\n }\n const radioNativeInput = this.radioElement._inputElement.nativeElement;\n if (this.testId) {\n radioNativeInput.setAttribute('data-testid', this.testId);\n } else {\n radioNativeInput.removeAttribute('data-testid');\n }\n this.appliedTestId = this.testId;\n }\n\n ngAfterViewInit() {\n this.radioElement._inputElement.nativeElement.setAttribute('role', 'radio');\n this.applyTestId();\n this.radioElement._inputElement.nativeElement.onclick = () => {\n this.clickRadio();\n };\n\n this.focusMonitor\n .monitor(this.radioElement._inputElement.nativeElement)\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(origin =>\n this.ngZone.run(() => {\n this.origin = origin;\n this.cdr.markForCheck();\n this.onFocus(origin === 'keyboard');\n })\n );\n }\n\n ngOnDestroy(): void {\n this.focusMonitor.stopMonitoring(this.radioElement._inputElement.nativeElement);\n }\n\n //Click method\n clickRadio() {\n if (this.allowUnselect) {\n this.radioElement.checked = !this.radioElement.checked;\n this._selected = this.radioElement.checked;\n this.classMultiple = this.setClass();\n this.selected = this.radioElement.checked;\n this.changeRadio?.emit({\n optionName: this.radioElement.value as string,\n optionChecked: this.radioElement.checked,\n });\n } else {\n if (!this.hostNgControl) {\n this.selected = true;\n }\n this.changeRadio.emit({ optionName: this.radioElement.value as string, optionChecked: true });\n }\n if (this.disabled) {\n this._selected = false;\n this.changeRadio.emit({ optionName: '', optionChecked: false });\n }\n this.onChange(this._selected);\n }\n\n writeValue(value: unknown): void {\n if (typeof value === 'boolean' \|\| value === this.value) {\n this.selected = value as boolean;\n }\n // The forms API calls this from outside the component's own change\n // detection — under OnPush the view must be marked explicitly.\n this.cdr.markForCheck();\n }\n\n registerOnChange(fn: (value: boolean) => void): void {\n this.onChange = fn;\n }\n\n registerOnTouched(fn: () => void): void {\n this.onTouch = fn;\n }\n\n setDisabledState(isDisabled: boolean): void {\n this.disabled = isDisabled;\n this.cdr.markForCheck();\n }\n\n onChange: (value: boolean) => void = () => {};\n\n /\n @ignore\n */\n onTouch = () => {};\n\n //Set class for multiple radio\n setClass(): string {\n if (this.multiple) {\n return this._selected ? 'multiple-checked' : 'multiple-unchecked';\n }\n return '';\n }\n\n onLabelEllipsisChange(isEllipsis: boolean): void {\n this.showTooltip = isEllipsis && !this.hideTooltipOnEllipsis;\n }\n\n private checkHost(): void {\n if (this.hostNgControl) {\n this.selected = this.value === this.hostNgControl.value;\n this.hostNgControl.valueChanges?.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(value => {\n this.selected = value === this.value;\n this.classMultiple = this.setClass();\n });\n }\n }\n\n private setCompanyColor(): void {\n // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing -- empty companyColor falls back to the theme colour\n this.companyColor = this.companyColor\n ? this.companyColor\n : this.applicationTheme === 'classic'\n ? '#46A997'\n : '#D410AA';\n }\n\n onFocus(isFocus: boolean): void {\n setTimeout(() => {\n if (this.tooltipElement) {\n if (this.showTooltip && isFocus) {\n this.tooltipElement.show();\n } else {\n this.tooltipElement.hide();\n }\n }\n }, 0);\n }\n\n focus(): void {\n this.radioElement.focus();\n }\n}\n","<div\n #radioContainer\n tabindex=\"0\"\n [class]=\"multiple ? 'radio-container' : 'radio'\"\n [class.multiple-disabled]=\"disabled && multiple\"\n [class.media-card]=\"mediaCard\"\n [class.media-card-selected]=\"mediaCard && selected\"\n [ngClass]=\"classMultiple\"\n [attr.alignment]=\"alignment\"\n [attr.truncate-text]=\"truncateText\"\n [attr.theme]=\"applicationTheme\"\n [attr.hasError]=\"hasError\"\n (keydown.enter)=\"clickRadio(); radioContainer.focus()\"\n (keydown.space)=\"clickRadio(); radioContainer.focus()\"\n>\n @if (mediaCard) {\n <div class=\"media-card-wrapper\" aria-hidden=\"true\">\n <ng-content select=\"[radio-media]\"></ng-content>\n </div>\n }\n <mat-radio-button\n #radio\n [checked]=\"selected\"\n [disabled]=\"disabled\"\n [name]=\"name\"\n [value]=\"value\"\n class=\"radio-button\"\n [required]=\"ariaRequired\"\n [aria-label]=\"ariaLabel\"\n [aria-labelledby]=\"ariaLabelledby ? ariaLabelledby : label\"\n [aria-describedby]=\"ariaDescribedby\"\n (keydown.enter)=\"$event.preventDefault()\"\n (keydown.space)=\"$event.preventDefault()\"\n [tabIndex]=\"tabIndex\"\n >\n @if (label) {\n <span\n #tooltip=\"matTooltip\"\n class=\"label\"\n uiEllipseText\n (onChangeTextState)=\"onLabelEllipsisChange($event)\"\n [matTooltip]=\"showTooltip ? label : ''\"\n [matTooltipClass]=\"applicationTheme\"\n >{{ label }}</span\n >\n }\n <ng-content select=\"[radio-label]\"></ng-content>\n </mat-radio-button>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\nimport { MatCheckboxModule } from '@angular/material/checkbox';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatRadioModule } from '@angular/material/radio';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\nimport { FocusVisibleDirective } from '@testgorilla/tgo-ui/components/checkbox';\nimport { EllipseTextDirective } from '@testgorilla/tgo-ui/components/core';\n\nimport { RadioButtonComponent } from './radio-button.component';\n\n@NgModule({\n imports: [\n CommonModule,\n MatRadioModule,\n FormsModule,\n ReactiveFormsModule,\n MatInputModule,\n EllipseTextDirective,\n MatTooltipModule,\n MatCheckboxModule,\n FocusVisibleDirective,\n RadioButtonComponent,\n ],\n exports: [RadioButtonComponent],\n})\nexport class RadioButtonComponentModule {}\n"],"mappings":"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"}
1	+ {"version":3,"file":"testgorilla-tgo-ui-components-radio-button.mjs","names":[],"sources":["../../../components/radio-button/radio-button.component.ts","../../../components/radio-button/radio-button.component.html","../../../components/radio-button/radio-button.component.module.ts"],"sourcesContent":["/* eslint-disable no-underscore-dangle /\nimport { FocusMonitor } from '@angular/cdk/a11y';\nimport { NgClass } from '@angular/common';\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n DestroyRef,\n EventEmitter,\n HostBinding,\n HostListener,\n inject,\n Input,\n NgZone,\n OnChanges,\n OnDestroy,\n OnInit,\n Output,\n ProviderToken,\n SimpleChanges,\n ViewChild,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { ControlValueAccessor, NgControl } from '@angular/forms';\nimport { MatRadioButton } from '@angular/material/radio';\nimport { MatTooltip } from '@angular/material/tooltip';\n\nimport { ApplicationTheme, Alignment, EllipseTextDirective } from '@testgorilla/tgo-ui/components/core';\n\nimport { RadioButtonEventType } from './radio-button.model';\n\n@Component({\n selector: 'ui-radio-button',\n templateUrl: './radio-button.component.html',\n styleUrls: ['./radio-button.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n // Needs to be removed since it causes some a11y issues (https://github.com/angular/components/issues/21266).\n '[attr.tabindex]': 'null',\n '[attr.aria-label]': 'null',\n '[attr.aria-labelledby]': 'null',\n '[attr.aria-describedby]': 'null',\n // Note: under normal conditions focus shouldn't land on this element, however it may be\n // programmatically set, for example inside of a focus trap, in this case we want to forward\n // the focus to the mat-radio-button element.\n '(focus)': 'radioElement.focus()',\n },\n imports: [NgClass, MatRadioButton, EllipseTextDirective, MatTooltip],\n})\nexport class RadioButtonComponent implements OnInit, OnChanges, ControlValueAccessor, AfterViewInit, OnDestroy {\n private _isProcessingClick = false;\n\n @HostListener('click', ['$event'])\n onHostClick(event: MouseEvent): void {\n if (this._isProcessingClick) {\n return;\n }\n const target = event.target as HTMLElement \| null;\n const targetClasses: string = target?.classList?.value ?? '';\n const fromMediaArea = this.mediaCard && target?.closest?.('.media-card-wrapper');\n if (targetClasses.includes('mat-mdc-radio-button') \|\| targetClasses.includes('mdc-form-field') \|\| fromMediaArea) {\n this._isProcessingClick = true;\n this.radioElement._inputElement.nativeElement.click();\n this._isProcessingClick = false;\n }\n }\n /\n Determines whether the radio button is disabled.\n * Default: false.\n \n @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Input() disabled = false;\n\n /\n Determines whether the radio button is checked.\n * Default: false.\n \n @type {boolean}\n * @memberof RadioButtonComponent\n /\n //@Input() selected = false;\n\n _selected = false;\n @Input()\n get selected() {\n return this._selected;\n }\n set selected(selected: boolean) {\n this._selected = selected;\n }\n\n /\n Determines whether the radio button can be unchecked.\n * Default: false.\n \n @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Input() allowUnselect = false;\n\n /\n Determines the radio button color.\n * Default: Test Gorilla primary color.\n \n @type {string}\n * @memberof RadioButtonComponent\n /\n @HostBinding('style.--color')\n @Input()\n companyColor: string \| null = null;\n\n /\n Used to group radios for unique selection.\n \n @type {string}\n * @memberof RadioButtonComponent\n /\n @Input() name = '';\n\n /\n Text content will be applied to the input element if present.\n \n @type {string}\n * @memberof RadioButtonComponent\n /\n @Input() label = '';\n\n /\n Determines whether the radio button is a multiple choice cell.\n * Default: false\n \n @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Input() multiple = false;\n\n /\n Renders the radio button as a media card. The image/video/gif passed via\n * the `[radio-media]` content slot fills the card and the radio + label sit\n * on top, in the bottom-left, with a dark scrim for contrast.\n \n @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Input() mediaCard = false;\n\n /\n Determines value of the radio button.\n * Default: false\n \n @type {any}\n * @memberof RadioButtonComponent\n /\n @Input() value: unknown;\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof RadioButtonComponent\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 RadioButtonComponent\n /\n @Input() ariaLabel: string;\n\n @Input() testId: string \| null = null;\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 RadioButtonComponent\n /\n @Input() ariaRequired = false;\n\n /\n Defines if checkbox has error\n \n @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Input() hasError = false;\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 RadioButtonComponent\n /\n @Input() ariaLabelledby = '';\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 RadioButtonComponent\n /\n @Input() ariaDescribedby = '';\n\n /\n Truncate text if it is too long\n * @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Input() truncateText = false;\n\n /\n Text alignment\n * @type {'center' \| 'top'}\n * @memberof RadioButtonComponent\n /\n @Input() alignment: Alignment = 'center';\n\n /\n Sets the tab index for the checkbox component.\n * This determines the order in which elements receive focus when the user navigates through them using the Tab key.\n * Default value is 0.\n \n @type {number}\n * @memberof RadioButtonComponent\n /\n @Input() tabIndex = 0;\n\n /\n Show tooltip when label is truncated\n * @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Input() hideTooltipOnEllipsis = false;\n\n /\n Event emitted when the checked state of the radio button changes.\n \n @type {boolean}\n * @memberof RadioButtonComponent\n /\n @Output() changeRadio = new EventEmitter<RadioButtonEventType>();\n\n classMultiple: string;\n showTooltip = false;\n protected origin: string \| null = null;\n\n @ViewChild('radio') radioElement: MatRadioButton;\n\n private appliedTestId: string \| null = null;\n @ViewChild('tooltip') tooltipElement: MatTooltip;\n\n private readonly defaultAppTheme = inject(\n 'CANOPYUI_DEFAULT_APPLICATION_THEME' as unknown as ProviderToken<ApplicationTheme>,\n {\n optional: true,\n }\n );\n public ngControl = inject(NgControl, { optional: true, self: true });\n public hostNgControl = inject(NgControl, { optional: true, host: true });\n private readonly destroyRef = inject(DestroyRef);\n private readonly focusMonitor = inject(FocusMonitor);\n private readonly ngZone = inject(NgZone);\n private readonly cdr = inject(ChangeDetectorRef);\n\n constructor() {\n if (this.defaultAppTheme) {\n this.applicationTheme = this.defaultAppTheme;\n }\n\n if (this.ngControl !== null) {\n this.ngControl.valueAccessor = this;\n }\n }\n\n ngOnInit() {\n this.checkHost();\n this.classMultiple = this.setClass();\n }\n\n ngOnChanges(changes: SimpleChanges) {\n if (changes['selected']) {\n this.classMultiple = this.setClass();\n }\n this.setCompanyColor();\n this.applyTestId();\n }\n\n // MatRadioButton takes no attribute passthrough, so the id is set on the native input directly.\n private applyTestId(): void {\n if (!this.radioElement \|\| this.testId === this.appliedTestId) {\n return;\n }\n const radioNativeInput = this.radioElement._inputElement.nativeElement;\n if (this.testId) {\n radioNativeInput.setAttribute('data-testid', this.testId);\n } else {\n radioNativeInput.removeAttribute('data-testid');\n }\n this.appliedTestId = this.testId;\n }\n\n ngAfterViewInit() {\n this.radioElement._inputElement.nativeElement.setAttribute('role', 'radio');\n this.applyTestId();\n this.radioElement._inputElement.nativeElement.onclick = () => {\n this.clickRadio();\n };\n\n this.focusMonitor\n .monitor(this.radioElement._inputElement.nativeElement)\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(origin =>\n this.ngZone.run(() => {\n this.origin = origin;\n this.cdr.markForCheck();\n this.onFocus(origin === 'keyboard');\n })\n );\n }\n\n ngOnDestroy(): void {\n this.focusMonitor.stopMonitoring(this.radioElement._inputElement.nativeElement);\n }\n\n //Click method\n clickRadio() {\n if (this.allowUnselect) {\n this.radioElement.checked = !this.radioElement.checked;\n this._selected = this.radioElement.checked;\n this.classMultiple = this.setClass();\n this.selected = this.radioElement.checked;\n this.changeRadio?.emit({\n optionName: this.radioElement.value as string,\n optionChecked: this.radioElement.checked,\n });\n } else {\n if (!this.hostNgControl) {\n this.selected = true;\n }\n this.changeRadio.emit({ optionName: this.radioElement.value as string, optionChecked: true });\n }\n if (this.disabled) {\n this._selected = false;\n this.changeRadio.emit({ optionName: '', optionChecked: false });\n }\n this.onChange(this._selected);\n }\n\n writeValue(value: unknown): void {\n if (typeof value === 'boolean' \|\| value === this.value) {\n this.selected = value as boolean;\n }\n // The forms API calls this from outside the component's own change\n // detection — under OnPush the view must be marked explicitly.\n this.cdr.markForCheck();\n }\n\n registerOnChange(fn: (value: boolean) => void): void {\n this.onChange = fn;\n }\n\n registerOnTouched(fn: () => void): void {\n this.onTouch = fn;\n }\n\n setDisabledState(isDisabled: boolean): void {\n this.disabled = isDisabled;\n this.cdr.markForCheck();\n }\n\n onChange: (value: boolean) => void = () => {};\n\n /\n @ignore\n */\n onTouch = () => {};\n\n //Set class for multiple radio\n setClass(): string {\n if (this.multiple) {\n return this._selected ? 'multiple-checked' : 'multiple-unchecked';\n }\n return '';\n }\n\n onLabelEllipsisChange(isEllipsis: boolean): void {\n this.showTooltip = isEllipsis && !this.hideTooltipOnEllipsis;\n }\n\n // A radio without a `value` matches nothing: an unset model (`undefined` from a template `a?.b`\n // binding since Angular 22, `null` before) must not select it.\n private matchesControlValue(controlValue: unknown): boolean {\n return this.value !== undefined && controlValue === this.value;\n }\n\n private checkHost(): void {\n if (this.hostNgControl) {\n this.selected = this.matchesControlValue(this.hostNgControl.value);\n this.hostNgControl.valueChanges?.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(value => {\n this.selected = this.matchesControlValue(value);\n this.classMultiple = this.setClass();\n });\n }\n }\n\n private setCompanyColor(): void {\n // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing -- empty companyColor falls back to the theme colour\n this.companyColor = this.companyColor\n ? this.companyColor\n : this.applicationTheme === 'classic'\n ? '#46A997'\n : '#D410AA';\n }\n\n onFocus(isFocus: boolean): void {\n setTimeout(() => {\n if (this.tooltipElement) {\n if (this.showTooltip && isFocus) {\n this.tooltipElement.show();\n } else {\n this.tooltipElement.hide();\n }\n }\n }, 0);\n }\n\n focus(): void {\n this.radioElement.focus();\n }\n}\n","<div\n #radioContainer\n tabindex=\"0\"\n [class]=\"multiple ? 'radio-container' : 'radio'\"\n [class.multiple-disabled]=\"disabled && multiple\"\n [class.media-card]=\"mediaCard\"\n [class.media-card-selected]=\"mediaCard && selected\"\n [ngClass]=\"classMultiple\"\n [attr.alignment]=\"alignment\"\n [attr.truncate-text]=\"truncateText\"\n [attr.theme]=\"applicationTheme\"\n [attr.hasError]=\"hasError\"\n (keydown.enter)=\"clickRadio(); radioContainer.focus()\"\n (keydown.space)=\"clickRadio(); radioContainer.focus()\"\n>\n @if (mediaCard) {\n <div class=\"media-card-wrapper\" aria-hidden=\"true\">\n <ng-content select=\"[radio-media]\"></ng-content>\n </div>\n }\n <mat-radio-button\n #radio\n [checked]=\"selected\"\n [disabled]=\"disabled\"\n [name]=\"name\"\n [value]=\"value\"\n class=\"radio-button\"\n [required]=\"ariaRequired\"\n [aria-label]=\"ariaLabel\"\n [aria-labelledby]=\"ariaLabelledby ? ariaLabelledby : label\"\n [aria-describedby]=\"ariaDescribedby\"\n (keydown.enter)=\"$event.preventDefault()\"\n (keydown.space)=\"$event.preventDefault()\"\n [tabIndex]=\"tabIndex\"\n >\n @if (label) {\n <span\n #tooltip=\"matTooltip\"\n class=\"label\"\n uiEllipseText\n (onChangeTextState)=\"onLabelEllipsisChange($event)\"\n [matTooltip]=\"showTooltip ? label : ''\"\n [matTooltipClass]=\"applicationTheme\"\n >{{ label }}</span\n >\n }\n <ng-content select=\"[radio-label]\"></ng-content>\n </mat-radio-button>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\nimport { MatCheckboxModule } from '@angular/material/checkbox';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatRadioModule } from '@angular/material/radio';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\nimport { FocusVisibleDirective } from '@testgorilla/tgo-ui/components/checkbox';\nimport { EllipseTextDirective } from '@testgorilla/tgo-ui/components/core';\n\nimport { RadioButtonComponent } from './radio-button.component';\n\n@NgModule({\n imports: [\n CommonModule,\n MatRadioModule,\n FormsModule,\n ReactiveFormsModule,\n MatInputModule,\n EllipseTextDirective,\n MatTooltipModule,\n MatCheckboxModule,\n FocusVisibleDirective,\n RadioButtonComponent,\n ],\n exports: [RadioButtonComponent],\n})\nexport class RadioButtonComponentModule {}\n"],"mappings":"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"}

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

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

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

	@@ -1 +1 @@
1	- {"version":3,"file":"testgorilla-tgo-ui-components-scale-table.mjs","names":[],"sources":["../../../components/scale-table/scale-table.component.ts","../../../components/scale-table/scale-table.component.html"],"sourcesContent":["import { AsyncPipe } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, computed, input, model, output } from '@angular/core';\n\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport { ApplicationTheme, UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { ScaleComponentModule } from '@testgorilla/tgo-ui/components/scale';\n\nimport { ScaleItem } from './scale-table.model';\n\n@Component({\n selector: 'ui-scale-table',\n templateUrl: './scale-table.component.html',\n styleUrls: ['./scale-table.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [UiTranslatePipe, ScaleComponentModule, AsyncPipe, IconComponentModule, ButtonComponentModule],\n host: {\n '[style.--scale-count]': 'scaleCount()',\n },\n})\nexport class ScaleTableComponent {\n /*\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof ScaleTableComponent\n /\n public applicationTheme = input<ApplicationTheme>('light');\n\n /\n \n * Defines items with their text and it's values\n \n @type {ScaleTable}\n * @memberof ScaleTableComponent\n /\n public scaleItems = model.required<ScaleItem[]>();\n\n /\n \n * Defines description of scales\n \n @type {string[]}\n * @memberof ScaleTableComponent\n */\n public labels = input.required<string[]>();\n public hideBetterExperience = model(false);\n public scaleItemChange = output<{\n item: ScaleItem;\n label: string;\n }>();\n scaleCount = computed(() => this.labels().length);\n\n protected readonly translationContext = 'SCALE_TABLE.';\n\n public select(scaleItemIndex: number, scaleIndex: number): void {\n this.scaleItems.update(items => {\n items[scaleItemIndex].value = scaleIndex;\n this.scaleItemChange.emit({\n item: items[scaleItemIndex],\n label: this.labels()[scaleIndex],\n });\n return [...items];\n });\n }\n}\n","<div class=\"scale-table\">\n <div class=\"better-experience\" [class.hide]=\"hideBetterExperience()\">\n <ui-icon [size]=\"'24'\" [name]=\"'Device-rotate-in-line'\" class=\"mobile-landscape-icon\" />\n <p>{{ 'SCALE_TABLE.ROTATE_DEVICE' \| uiTranslate \| async }}</p>\n <ui-button\n iconName=\"Close\"\n variant=\"icon-button\"\n size=\"small\"\n [justIcon]=\"true\"\n [tooltip]=\"('COMMON.CLOSE' \| uiTranslate \| async)!\"\n (click)=\"hideBetterExperience.set(true)\"\n />\n </div>\n <!-- Header -->\n <div tabindex=\"0\" [attr.aria-label]=\"'scale header'\" class=\"scale-table-header\">\n @for (label of labels(); track $index) {\n <div\n tabindex=\"0\"\n role=\"heading\"\n [attr.aria-level]=\"3\"\n [attr.aria-label]=\"label + ' as ' + ($index + 1)\"\n class=\"scale-size\"\n >\n {{ label }}\n </div>\n }\n </div>\n <!-- Scale Items -->\n @for (scale of scaleItems(); track scale.text) {\n <div class=\"scale-table-row\" tabindex=\"0\" role=\"radiogroup\" [attr.aria-label]=\"scale.text\">\n <div class=\"scale-text\">{{ scale.text }}</div>\n <ui-scale\n [selectedIndex]=\"scale.value ?? null\"\n [length]=\"scale.length ?? labels().length\"\n [applicationTheme]=\"applicationTheme()\"\n (selectedIndexChange)=\"select($index, $event)\"\n />\n </div>\n }\n</div>\n"],"mappings":"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"}
1	+ {"version":3,"file":"testgorilla-tgo-ui-components-scale-table.mjs","names":[],"sources":["../../../components/scale-table/scale-table.component.ts","../../../components/scale-table/scale-table.component.html"],"sourcesContent":["import { AsyncPipe } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, computed, input, model, output } from '@angular/core';\n\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport { ApplicationTheme, UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { ScaleComponentModule } from '@testgorilla/tgo-ui/components/scale';\n\nimport { ScaleItem } from './scale-table.model';\n\n@Component({\n selector: 'ui-scale-table',\n templateUrl: './scale-table.component.html',\n styleUrls: ['./scale-table.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [UiTranslatePipe, ScaleComponentModule, AsyncPipe, IconComponentModule, ButtonComponentModule],\n host: {\n '[style.--scale-count]': 'scaleCount()',\n },\n})\nexport class ScaleTableComponent {\n /*\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof ScaleTableComponent\n /\n public applicationTheme = input<ApplicationTheme>('light');\n\n /\n \n * Defines items with their text and it's values\n \n @type {ScaleTable}\n * @memberof ScaleTableComponent\n /\n public scaleItems = model.required<ScaleItem[]>();\n\n /\n \n * Defines description of scales\n \n @type {string[]}\n * @memberof ScaleTableComponent\n */\n public labels = input.required<string[]>();\n public hideBetterExperience = model(false);\n public scaleItemChange = output<{\n item: ScaleItem;\n label: string;\n }>();\n scaleCount = computed(() => this.labels().length);\n\n protected readonly translationContext = 'SCALE_TABLE.';\n\n public select(scaleItemIndex: number, scaleIndex: number): void {\n this.scaleItems.update(items => {\n items[scaleItemIndex].value = scaleIndex;\n this.scaleItemChange.emit({\n item: items[scaleItemIndex],\n label: this.labels()[scaleIndex],\n });\n return [...items];\n });\n }\n}\n","<div class=\"scale-table\">\n <div class=\"better-experience\" [class.hide]=\"hideBetterExperience()\">\n <ui-icon [size]=\"'24'\" [name]=\"'Device-rotate-in-line'\" class=\"mobile-landscape-icon\" />\n <p>{{ 'SCALE_TABLE.ROTATE_DEVICE' \| uiTranslate \| async }}</p>\n <ui-button\n iconName=\"Close\"\n variant=\"icon-button\"\n size=\"small\"\n [justIcon]=\"true\"\n [tooltip]=\"('COMMON.CLOSE' \| uiTranslate \| async)!\"\n (click)=\"hideBetterExperience.set(true)\"\n />\n </div>\n <!-- Header -->\n <div tabindex=\"0\" [attr.aria-label]=\"'scale header'\" class=\"scale-table-header\">\n @for (label of labels(); track $index) {\n <div\n tabindex=\"0\"\n role=\"heading\"\n [attr.aria-level]=\"3\"\n [attr.aria-label]=\"label + ' as ' + ($index + 1)\"\n class=\"scale-size\"\n >\n {{ label }}\n </div>\n }\n </div>\n <!-- Scale Items -->\n @for (scale of scaleItems(); track scale.text) {\n <div class=\"scale-table-row\" tabindex=\"0\" role=\"radiogroup\" [attr.aria-label]=\"scale.text\">\n <div class=\"scale-text\">{{ scale.text }}</div>\n <ui-scale\n [selectedIndex]=\"scale.value ?? null\"\n [length]=\"scale.length ?? labels().length\"\n [applicationTheme]=\"applicationTheme()\"\n (selectedIndexChange)=\"select($index, $event)\"\n />\n </div>\n }\n</div>\n"],"mappings":"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"}

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

@@ -89,7 +89,11 @@ var ScaleComponent = class ScaleComponent {
 			isStandalone: true,
 			selector: "ui-scale",
 			inputs: {
-				selectedIndex: "selectedIndex",
+				selectedIndex: [
+					"selectedIndex",
+					"selectedIndex",
+					(value) => value ?? null
+				],
 				length: "length",
 				applicationTheme: "applicationTheme",
 				companyColor: "companyColor",
@@ -148,7 +152,10 @@ i0.ɵɵngDeclareClassMetadata({
 			type: ViewChildren,
 			args: ["scaleItem"]
 		}],
-		selectedIndex: [{ type: Input }],
+		selectedIndex: [{
+			type: Input,
+			args: [{ transform: (value) => value ?? null }]
+		}],
 		length: [{ type: Input }],
 		applicationTheme: [{ type: Input }],
 		companyColor: [{ type: Input }],

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

	@@ -1 +1 @@
1	- {"version":3,"file":"testgorilla-tgo-ui-components-scale.mjs","names":[],"sources":["../../../components/scale/scale.component.ts","../../../components/scale/scale.component.html","../../../components/scale/scale.component.module.ts"],"sourcesContent":["import { NgStyle, NgClass } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n EventEmitter,\n Inject,\n Input,\n OnChanges,\n OnInit,\n Optional,\n Output,\n QueryList,\n signal,\n SimpleChanges,\n ViewChildren,\n} from '@angular/core';\n\nimport { ApplicationTheme, hexToRgbWithAlpha } from '@testgorilla/tgo-ui/components/core';\n\n@Component({\n selector: 'ui-scale',\n templateUrl: './scale.component.html',\n styleUrls: ['./scale.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [NgStyle, NgClass],\n})\nexport class ScaleComponent implements OnInit, OnChanges {\n private readonly MIN_LENGTH = 1;\n private readonly DEFAULT_LENGTH = 5;\n protected items: number[] = [];\n\n @ViewChildren('scaleItem') scaleItems!: QueryList<ElementRef<HTMLElement>>;\n\n /*\n The value representing the selected item of the scale.\n * @type {number}\n * @memberof ScaleComponent\n /\n @Input() selectedIndex: number \| null = null;\n\n /\n The max number of items in the scale.\n * @type {number}\n * @memberof ScaleComponent\n /\n @Input() set length(length: number) {\n this.items = Array(Math.max(length, this.MIN_LENGTH))\n .fill(0)\n .map((_, i) => i);\n }\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof ScaleComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /\n Color of the option hover.\n * Defaults to Test Gorilla primary color.\n \n @type {string}\n * @memberof ScaleComponent\n */\n @Input() companyColor = '';\n\n @Input() testId: string \| null = null;\n\n @Input() ariaLabel = '';\n\n itemTestId(item: number): string \| null {\n return this.testId ? `${this.testId}-${item + 1}` : null;\n }\n\n @Output() selectedIndexChange = new EventEmitter<number>();\n\n styles = signal({ '--hover-color': '#FFB3EE', '--selected-color': '#D410AA' });\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n this.length = this.DEFAULT_LENGTH;\n }\n\n ngOnInit() {\n if (this.companyColor) {\n this.setCompanyColor();\n }\n }\n\n ngOnChanges(changes: SimpleChanges) {\n if (changes['companyColor']) {\n this.setCompanyColor();\n }\n }\n\n protected select(index: number): void {\n this.selectedIndex = index;\n this.selectedIndexChange.emit(this.selectedIndex);\n }\n\n onKeyDown(event: KeyboardEvent, index: number) {\n this.selectedIndex ??= 0;\n if (event.key === 'ArrowRight' \|\| event.key === 'ArrowDown') {\n // Move to the next item (wrap around)\n this.select((index + 1) % this.items.length);\n this.focusItem(this.selectedIndex);\n } else if (event.key === 'ArrowLeft' \|\| event.key === 'ArrowUp') {\n // Move to the previous item (wrap around)\n this.select((index - 1 + this.items.length) % this.items.length);\n this.focusItem(this.selectedIndex);\n } else if (event.key === ' ' \|\| event.key === 'Enter') {\n // Select the current item\n this.select(index);\n this.focusItem(this.selectedIndex);\n }\n }\n\n focusItem(index: number) {\n const element = this.scaleItems?.toArray()[index]?.nativeElement;\n if (element) {\n element.focus();\n }\n }\n\n getAriaLabel(index: number): string {\n if (index === 0) {\n return '1 - Not at all important';\n } else if (index === 4) {\n return '5 - Very important';\n }\n return '';\n }\n\n private setCompanyColor(): void {\n const styles = this.styles();\n styles['--hover-color'] = hexToRgbWithAlpha(this.companyColor);\n styles['--selected-color'] = this.companyColor;\n this.styles.set(styles);\n }\n\n onFocus(item: number): void {\n // If no item is selected when the component receives focus, select the first item\n if (this.selectedIndex === null && item === 0) {\n this.select(0);\n }\n }\n}\n","<div\n [style.--scale-count]=\"items.length\"\n class=\"scale\"\n [ngStyle]=\"styles()\"\n [ngClass]=\"{ 'scale-classic': applicationTheme === 'classic' }\"\n [attr.data-testid]=\"testId\"\n [attr.aria-label]=\"ariaLabel \|\| null\"\n role=\"radiogroup\"\n>\n @for (item of items; track item) {\n <div\n class=\"scale-item\"\n (click)=\"select(item)\"\n #scaleItem\n role=\"radio\"\n (keydown)=\"onKeyDown($event, item)\"\n (focus)=\"onFocus(item)\"\n [class.scale-item-focus-prev]=\"selectedIndex && selectedIndex > 0 ? item === selectedIndex - 1 : false\"\n [attr.tabindex]=\"selectedIndex === null ? (item === 0 ? '0' : '-1') : item === selectedIndex ? '0' : '-1'\"\n [attr.aria-checked]=\"\n selectedIndex === null ? (item === 0 ? 'true' : 'false') : item === selectedIndex ? 'true' : 'false'\n \"\n [attr.aria-label]=\"getAriaLabel(item)\"\n [ngClass]=\"{ 'scale-item-selected': item === selectedIndex }\"\n [attr.data-testid]=\"itemTestId(item)\"\n >\n {{ item + 1 }}\n </div>\n }\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { ScaleComponent } from './scale.component';\n\n@NgModule({\n imports: [CommonModule, ScaleComponent],\n exports: [ScaleComponent],\n})\nexport class ScaleComponentModule {}\n"],"mappings":";;;;AA2BA,IAAa,iBAAb,MAAa,eAAc;~~CAmBzB~~,IAAa,OAAO,QAAc;EAChC,KAAK,QAAQ,MAAM,KAAK,IAAI,QAAQ,KAAK,UAAU,CAAC,CAAC,CAClD,KAAK,CAAC,CAAC,CACP,KAAK,GAAG,MAAM,CAAC;CACpB;CAwBA,WAAW,MAAY;EACrB,OAAO,KAAK,SAAS,GAAG,KAAK,OAAM,GAAI,OAAO,MAAM;CACtD;CAMA,YAC6E,iBAAiC;EAAjC,KAAA,kBAAA;~~EAvD5D~~,KAAA,aAAa;EACb,KAAA,iBAAiB;EACxB,KAAA,QAAkB,CAAA;~~EASnB~~,KAAA,gBAA+B;~~EAoB/B~~,KAAA,mBAAqC;EASrC,KAAA,eAAe;EAEf,KAAA,SAAwB;EAExB,KAAA,YAAY;EAMX,KAAA,sBAAsB,IAAI,aAAY;EAEhD,KAAA,SAAS,OAAO;GAAE,iBAAiB;GAAW,oBAAoB;EAAS,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;EAK5E,IAAI,iBACF,KAAK,mBAAmB;EAE1B,KAAK,SAAS,KAAK;CACrB;CAEA,WAAQ;EACN,IAAI,KAAK,cACP,KAAK,gBAAe;CAExB;CAEA,YAAY,SAAsB;EAChC,IAAI,QAAQ,iBACV,KAAK,gBAAe;CAExB;CAEU,OAAO,OAAa;EAC5B,KAAK,gBAAgB;EACrB,KAAK,oBAAoB,KAAK,KAAK,aAAa;CAClD;CAEA,UAAU,OAAsB,OAAa;EAC3C,KAAK,kBAAkB;EACvB,IAAI,MAAM,QAAQ,gBAAgB,MAAM,QAAQ,aAAa;GAE3D,KAAK,QAAQ,QAAQ,KAAK,KAAK,MAAM,MAAM;GAC3C,KAAK,UAAU,KAAK,aAAa;EACnC,OAAO,IAAI,MAAM,QAAQ,eAAe,MAAM,QAAQ,WAAW;GAE/D,KAAK,QAAQ,QAAQ,IAAI,KAAK,MAAM,UAAU,KAAK,MAAM,MAAM;GAC/D,KAAK,UAAU,KAAK,aAAa;EACnC,OAAO,IAAI,MAAM,QAAQ,OAAO,MAAM,QAAQ,SAAS;GAErD,KAAK,OAAO,KAAK;GACjB,KAAK,UAAU,KAAK,aAAa;EACnC;CACF;CAEA,UAAU,OAAa;EACrB,MAAM,UAAU,KAAK,YAAY,QAAO,CAAE,CAAC,MAAM,EAAE;EACnD,IAAI,SACF,QAAQ,MAAK;CAEjB;CAEA,aAAa,OAAa;EACxB,IAAI,UAAU,GACZ,OAAO;OACF,IAAI,UAAU,GACnB,OAAO;EAET,OAAO;CACT;CAEQ,kBAAe;EACrB,MAAM,SAAS,KAAK,OAAM;EAC1B,OAAO,mBAAmB,kBAAkB,KAAK,YAAY;EAC7D,OAAO,sBAAsB,KAAK;EAClC,KAAK,OAAO,IAAI,MAAM;CACxB;CAEA,QAAQ,MAAY;EAElB,IAAI,KAAK,kBAAkB,QAAQ,SAAS,GAC1C,KAAK,OAAO,CAAC;CAEjB;~~CA9HW~~;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAc,MAAA,CAAA;IAAA,~~OAwDH~~;IAAoC,UAAA;GAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;~~CAxD~~/C;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAAc,cAAA;GAAA,UAAA;GAAA,QAAA;IAAA,eAAA;IAAA,QAAA;IAAA,kBAAA;IAAA,cAAA;IAAA,QAAA;IAAA,WAAA;GAAA;GAAA,SAAA,EAAA,qBAAA,sBAAA;GAAA,aAAA,CAAA;IAAA,cAAA;IAAA,WAAA,CAAA,WAAA;IAAA,aAAA;GAAA,CAAA;GAAA,eAAA;GAAA,UAAA;GAAA,~~UC3B3B~~;GA8BA,QAAA,CAAA,sjHAAA;GAAA,cAAA,CAAA;IAAA,MAAA;IAAA,MDLY;IAAO,UAAA;IAAA,QAAA,CAAA,SAAA;GAAA,GAAA;IAAA,MAAA;IAAA,MAAE;IAAO,UAAA;IAAA,QAAA,CAAA,SAAA,SAAA;GAAA,CAAA;GAAA,iBAAA,GAAA,wBAAA;EAAA,CAAA;CAAA;;AAEf,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAc,YAAA,CAAA;EAP1B,MAAA;EACW,MAAA,CAAA;GAAA,UAAA;GAAU,iBAGH,wBAAwB;GAAM,SACtC,CAAC,SAAS,OAAO;GAAC,UAAA;GAAA,QAAA,CAAA,sjHAAA;EAAA,CAAA;;;;E,~~eA0DxB~~,MAAA,S;GAAY,MAAA;GAAO,MAAA,CAAA,oCAAoC;;;;;~~GAnDzD~~,MAAA;GAAa,MAAA,CAAA,WAAW~~;;E~~,~~kBAOxB~~,MAAA,M;E,~~WAOA~~,MAAA,M;E,qBAaA,MAAA,M;E,iBASA,MAAA,M;E,WAEA,MAAA,M;E,cAEA,MAAA,M;E,wBAMA,MAAA,O;;;~~AErEH~~,IAAa,uBAAb,MAAa,qBAAoB;CAApB;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAoB,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAApB;EAAA,KAAA,OAAA,GAAA,oBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAoB,SAAA,CAHrB,cAAc,cAAc;GAAA,SAAA,CAC5B,cAAc;EAAA,CAAA;CAAA;CAEb;EAAA,KAAA,OAAA,GAAA,oBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAoB,SAAA,CAHrB,YAAY;EAAA,CAAA;CAAA;;AAGX,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAoB,YAAA,CAAA;EAJhC,MAAA;EAAS,MAAA,CAAA;GACR,SAAS,CAAC,cAAc,cAAc;GACtC,SAAS,CAAC,cAAc;EACzB,CAAA"}
1	+ {"version":3,"file":"testgorilla-tgo-ui-components-scale.mjs","names":[],"sources":["../../../components/scale/scale.component.ts","../../../components/scale/scale.component.html","../../../components/scale/scale.component.module.ts"],"sourcesContent":["import { NgStyle, NgClass } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n EventEmitter,\n Inject,\n Input,\n OnChanges,\n OnInit,\n Optional,\n Output,\n QueryList,\n signal,\n SimpleChanges,\n ViewChildren,\n} from '@angular/core';\n\nimport { ApplicationTheme, hexToRgbWithAlpha } from '@testgorilla/tgo-ui/components/core';\n\n@Component({\n selector: 'ui-scale',\n templateUrl: './scale.component.html',\n styleUrls: ['./scale.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [NgStyle, NgClass],\n})\nexport class ScaleComponent implements OnInit, OnChanges {\n private readonly MIN_LENGTH = 1;\n private readonly DEFAULT_LENGTH = 5;\n protected items: number[] = [];\n\n @ViewChildren('scaleItem') scaleItems!: QueryList<ElementRef<HTMLElement>>;\n\n /*\n The value representing the selected item of the scale.\n * @type {number}\n * @memberof ScaleComponent\n /\n // A template `a?.b` binding yields `undefined` since Angular 22 (it was `null`). Both mean \"nothing selected\".\n @Input({ transform: (value: number \| null \| undefined): number \| null => value ?? null })\n selectedIndex: number \| null = null;\n\n /\n The max number of items in the scale.\n * @type {number}\n * @memberof ScaleComponent\n /\n @Input() set length(length: number) {\n this.items = Array(Math.max(length, this.MIN_LENGTH))\n .fill(0)\n .map((_, i) => i);\n }\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof ScaleComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /\n Color of the option hover.\n * Defaults to Test Gorilla primary color.\n \n @type {string}\n * @memberof ScaleComponent\n */\n @Input() companyColor = '';\n\n @Input() testId: string \| null = null;\n\n @Input() ariaLabel = '';\n\n itemTestId(item: number): string \| null {\n return this.testId ? `${this.testId}-${item + 1}` : null;\n }\n\n @Output() selectedIndexChange = new EventEmitter<number>();\n\n styles = signal({ '--hover-color': '#FFB3EE', '--selected-color': '#D410AA' });\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n this.length = this.DEFAULT_LENGTH;\n }\n\n ngOnInit() {\n if (this.companyColor) {\n this.setCompanyColor();\n }\n }\n\n ngOnChanges(changes: SimpleChanges) {\n if (changes['companyColor']) {\n this.setCompanyColor();\n }\n }\n\n protected select(index: number): void {\n this.selectedIndex = index;\n this.selectedIndexChange.emit(this.selectedIndex);\n }\n\n onKeyDown(event: KeyboardEvent, index: number) {\n this.selectedIndex ??= 0;\n if (event.key === 'ArrowRight' \|\| event.key === 'ArrowDown') {\n // Move to the next item (wrap around)\n this.select((index + 1) % this.items.length);\n this.focusItem(this.selectedIndex);\n } else if (event.key === 'ArrowLeft' \|\| event.key === 'ArrowUp') {\n // Move to the previous item (wrap around)\n this.select((index - 1 + this.items.length) % this.items.length);\n this.focusItem(this.selectedIndex);\n } else if (event.key === ' ' \|\| event.key === 'Enter') {\n // Select the current item\n this.select(index);\n this.focusItem(this.selectedIndex);\n }\n }\n\n focusItem(index: number) {\n const element = this.scaleItems?.toArray()[index]?.nativeElement;\n if (element) {\n element.focus();\n }\n }\n\n getAriaLabel(index: number): string {\n if (index === 0) {\n return '1 - Not at all important';\n } else if (index === 4) {\n return '5 - Very important';\n }\n return '';\n }\n\n private setCompanyColor(): void {\n const styles = this.styles();\n styles['--hover-color'] = hexToRgbWithAlpha(this.companyColor);\n styles['--selected-color'] = this.companyColor;\n this.styles.set(styles);\n }\n\n onFocus(item: number): void {\n // If no item is selected when the component receives focus, select the first item\n if (this.selectedIndex === null && item === 0) {\n this.select(0);\n }\n }\n}\n","<div\n [style.--scale-count]=\"items.length\"\n class=\"scale\"\n [ngStyle]=\"styles()\"\n [ngClass]=\"{ 'scale-classic': applicationTheme === 'classic' }\"\n [attr.data-testid]=\"testId\"\n [attr.aria-label]=\"ariaLabel \|\| null\"\n role=\"radiogroup\"\n>\n @for (item of items; track item) {\n <div\n class=\"scale-item\"\n (click)=\"select(item)\"\n #scaleItem\n role=\"radio\"\n (keydown)=\"onKeyDown($event, item)\"\n (focus)=\"onFocus(item)\"\n [class.scale-item-focus-prev]=\"selectedIndex && selectedIndex > 0 ? item === selectedIndex - 1 : false\"\n [attr.tabindex]=\"selectedIndex === null ? (item === 0 ? '0' : '-1') : item === selectedIndex ? '0' : '-1'\"\n [attr.aria-checked]=\"\n selectedIndex === null ? (item === 0 ? 'true' : 'false') : item === selectedIndex ? 'true' : 'false'\n \"\n [attr.aria-label]=\"getAriaLabel(item)\"\n [ngClass]=\"{ 'scale-item-selected': item === selectedIndex }\"\n [attr.data-testid]=\"itemTestId(item)\"\n >\n {{ item + 1 }}\n </div>\n }\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { ScaleComponent } from './scale.component';\n\n@NgModule({\n imports: [CommonModule, ScaleComponent],\n exports: [ScaleComponent],\n})\nexport class ScaleComponentModule {}\n"],"mappings":";;;;AA2BA,IAAa,iBAAb,MAAa,eAAc;CAqBzB,IAAa,OAAO,QAAc;EAChC,KAAK,QAAQ,MAAM,KAAK,IAAI,QAAQ,KAAK,UAAU,CAAC,CAAC,CAClD,KAAK,CAAC,CAAC,CACP,KAAK,GAAG,MAAM,CAAC;CACpB;CAwBA,WAAW,MAAY;EACrB,OAAO,KAAK,SAAS,GAAG,KAAK,OAAM,GAAI,OAAO,MAAM;CACtD;CAMA,YAC6E,iBAAiC;EAAjC,KAAA,kBAAA;EAzD5D,KAAA,aAAa;EACb,KAAA,iBAAiB;EACxB,KAAA,QAAkB,CAAA;EAW5B,KAAA,gBAA+B;EAoBtB,KAAA,mBAAqC;EASrC,KAAA,eAAe;EAEf,KAAA,SAAwB;EAExB,KAAA,YAAY;EAMX,KAAA,sBAAsB,IAAI,aAAY;EAEhD,KAAA,SAAS,OAAO;GAAE,iBAAiB;GAAW,oBAAoB;EAAS,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;EAK5E,IAAI,iBACF,KAAK,mBAAmB;EAE1B,KAAK,SAAS,KAAK;CACrB;CAEA,WAAQ;EACN,IAAI,KAAK,cACP,KAAK,gBAAe;CAExB;CAEA,YAAY,SAAsB;EAChC,IAAI,QAAQ,iBACV,KAAK,gBAAe;CAExB;CAEU,OAAO,OAAa;EAC5B,KAAK,gBAAgB;EACrB,KAAK,oBAAoB,KAAK,KAAK,aAAa;CAClD;CAEA,UAAU,OAAsB,OAAa;EAC3C,KAAK,kBAAkB;EACvB,IAAI,MAAM,QAAQ,gBAAgB,MAAM,QAAQ,aAAa;GAE3D,KAAK,QAAQ,QAAQ,KAAK,KAAK,MAAM,MAAM;GAC3C,KAAK,UAAU,KAAK,aAAa;EACnC,OAAO,IAAI,MAAM,QAAQ,eAAe,MAAM,QAAQ,WAAW;GAE/D,KAAK,QAAQ,QAAQ,IAAI,KAAK,MAAM,UAAU,KAAK,MAAM,MAAM;GAC/D,KAAK,UAAU,KAAK,aAAa;EACnC,OAAO,IAAI,MAAM,QAAQ,OAAO,MAAM,QAAQ,SAAS;GAErD,KAAK,OAAO,KAAK;GACjB,KAAK,UAAU,KAAK,aAAa;EACnC;CACF;CAEA,UAAU,OAAa;EACrB,MAAM,UAAU,KAAK,YAAY,QAAO,CAAE,CAAC,MAAM,EAAE;EACnD,IAAI,SACF,QAAQ,MAAK;CAEjB;CAEA,aAAa,OAAa;EACxB,IAAI,UAAU,GACZ,OAAO;OACF,IAAI,UAAU,GACnB,OAAO;EAET,OAAO;CACT;CAEQ,kBAAe;EACrB,MAAM,SAAS,KAAK,OAAM;EAC1B,OAAO,mBAAmB,kBAAkB,KAAK,YAAY;EAC7D,OAAO,sBAAsB,KAAK;EAClC,KAAK,OAAO,IAAI,MAAM;CACxB;CAEA,QAAQ,MAAY;EAElB,IAAI,KAAK,kBAAkB,QAAQ,SAAS,GAC1C,KAAK,OAAO,CAAC;CAEjB;CAhIW;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAc,MAAA,CAAA;IAAA,OA0DH;IAAoC,UAAA;GAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CA1D/C;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAAc,cAAA;GAAA,UAAA;GAAA,QAAA;IAAA,eAAA;KAAA;KAAA;MAaJ,UAAoD,SAAS;IAAI;IAAA,QAAA;IAAA,kBAAA;IAAA,cAAA;IAAA,QAAA;IAAA,WAAA;GAAA;GAAA,SAAA,EAAA,qBAAA,sBAAA;GAAA,aAAA,CAAA;IAAA,cAAA;IAAA,WAAA,CAAA,WAAA;IAAA,aAAA;GAAA,CAAA;GAAA,eAAA;GAAA,UAAA;GAAA,UCxCxF;GA8BA,QAAA,CAAA,sjHAAA;GAAA,cAAA,CAAA;IAAA,MAAA;IAAA,MDLY;IAAO,UAAA;IAAA,QAAA,CAAA,SAAA;GAAA,GAAA;IAAA,MAAA;IAAA,MAAE;IAAO,UAAA;IAAA,QAAA,CAAA,SAAA,SAAA;GAAA,CAAA;GAAA,iBAAA,GAAA,wBAAA;EAAA,CAAA;CAAA;;AAEf,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAc,YAAA,CAAA;EAP1B,MAAA;EACW,MAAA,CAAA;GAAA,UAAA;GAAU,iBAGH,wBAAwB;GAAM,SACtC,CAAC,SAAS,OAAO;GAAC,UAAA;GAAA,QAAA,CAAA,sjHAAA;EAAA,CAAA;;;;E,eA4DxB,MAAA,S;GAAY,MAAA;GAAO,MAAA,CAAA,oCAAoC;;;;;GArDzD,MAAA;GAAa,MAAA,CAAA,WAAW;;;GAQxB,MAAA;GAAM,MAAA,CAAA,EAAE,YAAY,UAAoD,SAAS,KAAI,CAAE;;E,WAQvF,MAAA,M;E,qBAaA,MAAA,M;E,iBASA,MAAA,M;E,WAEA,MAAA,M;E,cAEA,MAAA,M;E,wBAMA,MAAA,O;;;AEvEH,IAAa,uBAAb,MAAa,qBAAoB;CAApB;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAoB,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAApB;EAAA,KAAA,OAAA,GAAA,oBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAoB,SAAA,CAHrB,cAAc,cAAc;GAAA,SAAA,CAC5B,cAAc;EAAA,CAAA;CAAA;CAEb;EAAA,KAAA,OAAA,GAAA,oBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAoB,SAAA,CAHrB,YAAY;EAAA,CAAA;CAAA;;AAGX,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAoB,YAAA,CAAA;EAJhC,MAAA;EAAS,MAAA,CAAA;GACR,SAAS,CAAC,cAAc,cAAc;GACtC,SAAS,CAAC,cAAc;EACzB,CAAA"}