@testgorilla/tgo-ui 6.2.3 → 6.2.8

package/fesm2022/testgorilla-tgo-ui-components-radio-button.mjs

@@ -19,7 +19,8 @@ import { FocusVisibleDirective } from '@testgorilla/tgo-ui/components/checkbox';
 /* eslint-disable no-underscore-dangle */
 class RadioButtonComponent {
     onHostClick(event) {
-        if (event.target?.classList?.value?.includes?.('mat-mdc-radio-button') || event.target?.classList?.value?.includes?.('mdc-form-field')) {
+        if (event.target?.classList?.value?.includes?.('mat-mdc-radio-button') ||
+            event.target?.classList?.value?.includes?.('mdc-form-field')) {
             this.radioElement._inputElement.nativeElement.click();
         }
     }
@@ -164,7 +165,7 @@ class RadioButtonComponent {
         this.changeRadio = new EventEmitter();
         this.showTooltip = false;
         this.origin = null;
-        this.onChange = (_) => { };
+        this.onChange = (_value) => { };
         /**
          * @ignore
          */
@@ -191,7 +192,10 @@ class RadioButtonComponent {
         this.radioElement._inputElement.nativeElement.onclick = () => {
             this.clickRadio();
         };
-        this.focusMonitor.monitor(this.radioElement._inputElement.nativeElement).pipe(takeUntilDestroyed(this.destroyRef)).subscribe(origin => this.ngZone.run(() => {
+        this.focusMonitor
+            .monitor(this.radioElement._inputElement.nativeElement)
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe(origin => this.ngZone.run(() => {
             this.origin = origin;
             this.cdr.markForCheck();
             this.onFocus(origin === 'keyboard');
@@ -246,14 +250,18 @@ class RadioButtonComponent {
     checkHost() {
         if (this.hostNgControl) {
             this.selected = this.value === this.hostNgControl.value;
-            this.hostNgControl.valueChanges?.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((value) => {
+            this.hostNgControl.valueChanges?.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(value => {
                 this.selected = value === this.value;
                 this.classMultiple = this.setClass();
             });
         }
     }
     setCompanyColor() {
-        this.companyColor = this.companyColor ? this.companyColor : this.applicationTheme === 'classic' ? '#46A997' : '#D410AA';
+        this.companyColor = this.companyColor
+            ? this.companyColor
+            : this.applicationTheme === 'classic'
+                ? '#46A997'
+                : '#D410AA';
     }
     onFocus(isFocus) {
         setTimeout(() => {
@@ -271,7 +279,7 @@ class RadioButtonComponent {
         this.radioElement.focus();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: RadioButtonComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }, { token: i1.NgControl, optional: true, self: true }, { token: i1.NgControl, host: true, optional: true }, { token: i0.DestroyRef }, { token: i2.FocusMonitor }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: RadioButtonComponent, isStandalone: false, selector: "ui-radio-button", inputs: { disabled: "disabled", selected: "selected", allowUnselect: "allowUnselect", companyColor: "companyColor", name: "name", label: "label", multiple: "multiple", value: "value", applicationTheme: "applicationTheme", ariaLabel: "ariaLabel", ariaRequired: "ariaRequired", hasError: "hasError", ariaLabelledby: "ariaLabelledby", ariaDescribedby: "ariaDescribedby", truncateText: "truncateText", alignment: "alignment", tabIndex: "tabIndex", hideTooltipOnEllipsis: "hideTooltipOnEllipsis" }, outputs: { changeRadio: "changeRadio" }, host: { listeners: { "focus": "radioElement.focus()", "click": "onHostClick($event)" }, properties: { "attr.tabindex": "null", "attr.aria-label": "null", "attr.aria-labelledby": "null", "attr.aria-describedby": "null", "style.--color": "this.companyColor" } }, viewQueries: [{ propertyName: "radioElement", first: true, predicate: ["radio"], descendants: true }, { propertyName: "tooltipElement", first: true, predicate: ["tooltip"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n  #radioContainer\n  [class]=\"multiple ? 'radio-container' : 'radio'\"\n  [class.multiple-disabled]=\"disabled && multiple\"\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  <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    <ng-content select=\"[radio-label]\"></ng-content>\n  </mat-radio-button>\n</div>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.mat-mdc-radio-button.mat-accent{--mat-radio-checked-ripple-color: var(--color)!important;--mdc-radio-selected-focus-icon-color: var(--color)!important;--mdc-radio-selected-pressed-icon-color: var(--color)!important}::ng-deep .mat-mdc-radio-checked .mdc-radio__outer-circle{border-color:var(--color)!important}::ng-deep .mat-mdc-radio-checked .mdc-radio__inner-circle{background-color:var(--color)!important;border-color:var(--color)!important}::ng-deep .mat-mdc-radio-button .mat-ripple-element{background-color:var(--color)!important}::ng-deep .mat-mdc-radio-button.mat-radio-disabled.mat-radio-checked .mdc-radio__outer-circle,.mat-radio-button.mat-radio-disabled .mdc-radio__outer-circle{border-color:#888!important}::ng-deep .mat-mdc-radio-button.mat-radio-disabled .mdc-radio__inner-circle{background-color:#888!important}[theme=dark] .mat-mdc-radio-button,[theme=light] .mat-mdc-radio-button{width:100%!important}[theme=dark] ::ng-deep .mdc-form-field,[theme=light] ::ng-deep .mdc-form-field{width:100%}[theme=dark] .mat-mdc-radio-button.mat-accent,[theme=light] .mat-mdc-radio-button.mat-accent{--mdc-radio-unselected-icon-color: #242424 !important}[theme=dark] ::ng-deep .mdc-radio.mdc-radio--disabled,[theme=light] ::ng-deep .mdc-radio.mdc-radio--disabled{--mdc-radio-disabled-unselected-icon-color: #919191;--mdc-radio-disabled-selected-icon-opacity: 1;--mdc-radio-disabled-unselected-icon-opacity: 1;--color: #919191}[theme=dark] ::ng-deep .mdc-radio.mdc-radio--disabled .mdc-radio__background,[theme=light] ::ng-deep .mdc-radio.mdc-radio--disabled .mdc-radio__background{background:#e9e9e9;border-radius:100%}[theme=dark] ::ng-deep .mdc-radio__background,[theme=light] ::ng-deep .mdc-radio__background{background:#fff!important;border-radius:100%;scale:.8}[theme=dark] ::ng-deep .mdc-radio__background .mdc-radio__outer-circle,[theme=light] ::ng-deep .mdc-radio__background .mdc-radio__outer-circle{border-width:1px}[theme=dark] ::ng-deep .mat-ripple,[theme=light] ::ng-deep .mat-ripple{display:none}[haserror=true] ::ng-deep .mdc-radio__background .mdc-radio__outer-circle{border-width:2px}.multiple-checked{border:1px solid var(--color);display:flex;flex-direction:row;align-items:center;gap:16px;background:var(--color);border-radius:8px}.multiple-checked ::ng-deep .mat-mdc-radio-button{width:100%;height:100%;padding:8px}.multiple-checked ::ng-deep .mat-mdc-radio-checked .mdc-radio__outer-circle{border:1px solid #ffffff;border-radius:64px;background:#fff}.multiple-checked ::ng-deep label{color:#fff;height:100%}.multiple-checked[theme=dark][hasError=false],.multiple-checked[theme=light][hasError=false]{background:#f4f4f4;border-color:#242424;outline:1px solid #242424}.multiple-checked[theme=dark][hasError=false] ::ng-deep label,.multiple-checked[theme=light][hasError=false] ::ng-deep label{color:#242424}.multiple-checked[theme=dark][hasError=true],.multiple-checked[theme=light][hasError=true]{border:1px solid #E02800;outline:1px solid #E02800;background:#fff;border-radius:10px}.multiple-checked[theme=dark][hasError=true] ::ng-deep label,.multiple-checked[theme=light][hasError=true] ::ng-deep label{color:#242424}.multiple-checked[theme=classic][hasError=true]{border:1px solid #E02800;outline:1px solid #E02800}.multiple-unchecked{border:1px solid #E0E0E0;display:flex;flex-direction:row;align-items:center;gap:16px;background:#fff;border-radius:8px}.multiple-unchecked ::ng-deep .mat-mdc-radio-button{width:100%;height:100%;padding:8px}.multiple-unchecked:hover{background:#f6f6f6;border:1px solid #E0E0E0}.multiple-unchecked ::ng-deep label{height:100%}.multiple-unchecked ::ng-deep .mat-mdc-radio-button .mdc-radio .mdc-radio__background:before{opacity:0!important}.multiple-unchecked[theme=dark][hasError=false],.multiple-unchecked[theme=light][hasError=false]{border:1px solid #919191;background:#fff}.multiple-unchecked[theme=dark][hasError=false]:not(.multiple-disabled):hover,.multiple-unchecked[theme=light][hasError=false]:not(.multiple-disabled):hover{outline:1px solid #242424;background:#fff;border-color:#242424!important}.multiple-unchecked[hasError=true]{border:1px solid #E02800;outline:1px solid #E02800;background:#fff}.multiple-unchecked[hasError=true]:not([theme=classic]){border-radius:10px}.multiple-unchecked ::ng-deep label,.multiple-checked ::ng-deep label{padding-left:0;width:fit-content;cursor:pointer}.radio-container{cursor:pointer}.radio-container .label{cursor:pointer;-webkit-user-select:none;user-select:none}.radio-button .label{cursor:pointer;-webkit-user-select:none;user-select:none;padding-left:4px}:host *[hasError=true] .mat-mdc-radio-button.mat-accent{--mdc-radio-unselected-icon-color: #E02800 !important;--mdc-radio-unselected-hover-icon-color: #E02800 !important;--mdc-radio-unselected-focus-icon-color: #E02800 !important}:host ::ng-deep .mat-mdc-radio-touch-target{height:40px;width:40px}.radio,.radio-container{--border-width-default-state: 4px;--border-width-animation-state: 6px;width:100%}.radio[alignment=top] ::ng-deep .mdc-form-field,.radio-container[alignment=top] ::ng-deep .mdc-form-field{align-items:start}.radio[alignment=top] .label,.radio-container[alignment=top] .label{margin-top:10px}.radio[truncate-text=true] .label,.radio[truncate-text=true] ::ng-deep label,.radio-container[truncate-text=true] .label,.radio-container[truncate-text=true] ::ng-deep label{-webkit-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@keyframes focus-ring-animation{0%{outline-width:var(--border-width-animation-state)}to{outline-width:var(--border-width-default-state)}}.radio-container[hasError=true]{outline:1px solid #E02800}.radio .label{display:block;width:100%;cursor:pointer}::ng-deep .mat-mdc-radio-button.mat-accent.cdk-keyboard-focused{outline:none;--mat-radio-checked-ripple-color: transparent!important;--mat-radio-ripple-color: transparent!important}::ng-deep .mat-mdc-radio-button.mat-accent.cdk-keyboard-focused ::ng-deep .mdc-radio__background{outline:3px solid #242424;animation:focus-ring-animation .4s forwards}::ng-deep .mat-mdc-radio-button.mat-accent.cdk-keyboard-focused ::ng-deep .mdc-radio__background:after{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;outline:2px solid #ffffff;border-radius:100px}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i4.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "directive", type: i5.EllipseTextDirective, selector: "[uiEllipseText]", inputs: ["isMultiline", "maxDiffPixels", "refresh"], outputs: ["onChangeTextState"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: RadioButtonComponent, isStandalone: false, selector: "ui-radio-button", inputs: { disabled: "disabled", selected: "selected", allowUnselect: "allowUnselect", companyColor: "companyColor", name: "name", label: "label", multiple: "multiple", value: "value", applicationTheme: "applicationTheme", ariaLabel: "ariaLabel", ariaRequired: "ariaRequired", hasError: "hasError", ariaLabelledby: "ariaLabelledby", ariaDescribedby: "ariaDescribedby", truncateText: "truncateText", alignment: "alignment", tabIndex: "tabIndex", hideTooltipOnEllipsis: "hideTooltipOnEllipsis" }, outputs: { changeRadio: "changeRadio" }, host: { listeners: { "focus": "radioElement.focus()", "click": "onHostClick($event)" }, properties: { "attr.tabindex": "null", "attr.aria-label": "null", "attr.aria-labelledby": "null", "attr.aria-describedby": "null", "style.--color": "this.companyColor" } }, viewQueries: [{ propertyName: "radioElement", first: true, predicate: ["radio"], descendants: true }, { propertyName: "tooltipElement", first: true, predicate: ["tooltip"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n  #radioContainer\n  tabindex=\"0\"\n  [class]=\"multiple ? 'radio-container' : 'radio'\"\n  [class.multiple-disabled]=\"disabled && multiple\"\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  <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", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.mat-mdc-radio-button.mat-accent{--mat-radio-checked-ripple-color: var(--color) !important;--mdc-radio-selected-focus-icon-color: var(--color) !important;--mdc-radio-selected-pressed-icon-color: var(--color) !important}::ng-deep .mat-mdc-radio-checked .mdc-radio__outer-circle{border-color:var(--color)!important}::ng-deep .mat-mdc-radio-checked .mdc-radio__inner-circle{background-color:var(--color)!important;border-color:var(--color)!important}::ng-deep .mat-mdc-radio-button .mat-ripple-element{background-color:var(--color)!important}::ng-deep .mat-mdc-radio-button.mat-radio-disabled.mat-radio-checked .mdc-radio__outer-circle,.mat-radio-button.mat-radio-disabled .mdc-radio__outer-circle{border-color:#888!important}::ng-deep .mat-mdc-radio-button.mat-radio-disabled .mdc-radio__inner-circle{background-color:#888!important}[theme=dark] .mat-mdc-radio-button,[theme=light] .mat-mdc-radio-button{width:100%!important}[theme=dark] ::ng-deep .mdc-form-field,[theme=light] ::ng-deep .mdc-form-field{width:100%}[theme=dark] .mat-mdc-radio-button.mat-accent,[theme=light] .mat-mdc-radio-button.mat-accent{--mdc-radio-unselected-icon-color: #242424 !important}[theme=dark] ::ng-deep .mdc-radio.mdc-radio--disabled,[theme=light] ::ng-deep .mdc-radio.mdc-radio--disabled{--mdc-radio-disabled-unselected-icon-color: #919191;--mdc-radio-disabled-selected-icon-opacity: 1;--mdc-radio-disabled-unselected-icon-opacity: 1;--color: #919191}[theme=dark] ::ng-deep .mdc-radio.mdc-radio--disabled .mdc-radio__background,[theme=light] ::ng-deep .mdc-radio.mdc-radio--disabled .mdc-radio__background{background:#e9e9e9;border-radius:100%}[theme=dark] ::ng-deep .mdc-radio__background,[theme=light] ::ng-deep .mdc-radio__background{background:#fff!important;border-radius:100%;scale:.8}[theme=dark] ::ng-deep .mdc-radio__background .mdc-radio__outer-circle,[theme=light] ::ng-deep .mdc-radio__background .mdc-radio__outer-circle{border-width:1px}[theme=dark] ::ng-deep .mat-ripple,[theme=light] ::ng-deep .mat-ripple{display:none}[haserror=true] ::ng-deep .mdc-radio__background .mdc-radio__outer-circle{border-width:2px}.multiple-checked{border:1px solid var(--color);display:flex;flex-direction:row;align-items:center;gap:16px;background:var(--color);border-radius:8px}.multiple-checked ::ng-deep .mat-mdc-radio-button{width:100%;height:100%;padding:8px}.multiple-checked ::ng-deep .mat-mdc-radio-checked .mdc-radio__outer-circle{border:1px solid #ffffff;border-radius:64px;background:#fff}.multiple-checked ::ng-deep label{color:#fff;height:100%}.multiple-checked[theme=dark][hasError=false],.multiple-checked[theme=light][hasError=false]{background:#f4f4f4;border-color:#242424;outline:1px solid #242424}.multiple-checked[theme=dark][hasError=false] ::ng-deep label,.multiple-checked[theme=light][hasError=false] ::ng-deep label{color:#242424}.multiple-checked[theme=dark][hasError=true],.multiple-checked[theme=light][hasError=true]{border:1px solid #e02800;outline:1px solid #e02800;background:#fff;border-radius:10px}.multiple-checked[theme=dark][hasError=true] ::ng-deep label,.multiple-checked[theme=light][hasError=true] ::ng-deep label{color:#242424}.multiple-checked[theme=classic][hasError=true]{border:1px solid #e02800;outline:1px solid #e02800}.multiple-unchecked{border:1px solid #e0e0e0;display:flex;flex-direction:row;align-items:center;gap:16px;background:#fff;border-radius:8px}.multiple-unchecked ::ng-deep .mat-mdc-radio-button{width:100%;height:100%;padding:8px}.multiple-unchecked:hover{background:#f6f6f6;border:1px solid #e0e0e0}.multiple-unchecked ::ng-deep label{height:100%}.multiple-unchecked ::ng-deep .mat-mdc-radio-button .mdc-radio .mdc-radio__background:before{opacity:0!important}.multiple-unchecked[theme=dark][hasError=false],.multiple-unchecked[theme=light][hasError=false]{border:1px solid #919191;background:#fff}.multiple-unchecked[theme=dark][hasError=false]:not(.multiple-disabled):hover,.multiple-unchecked[theme=light][hasError=false]:not(.multiple-disabled):hover{outline:1px solid #242424;background:#fff;border-color:#242424!important}.multiple-unchecked[hasError=true]{border:1px solid #e02800;outline:1px solid #e02800;background:#fff}.multiple-unchecked[hasError=true]:not([theme=classic]){border-radius:10px}.multiple-unchecked ::ng-deep label,.multiple-checked ::ng-deep label{padding-left:0;width:fit-content;cursor:pointer}.radio-container{cursor:pointer}.radio-container .label{cursor:pointer;-webkit-user-select:none;user-select:none}.radio-button .label{cursor:pointer;-webkit-user-select:none;user-select:none;padding-left:4px}:host *[hasError=true] .mat-mdc-radio-button.mat-accent{--mdc-radio-unselected-icon-color: #e02800 !important;--mdc-radio-unselected-hover-icon-color: #e02800 !important;--mdc-radio-unselected-focus-icon-color: #e02800 !important}:host ::ng-deep .mat-mdc-radio-touch-target{height:40px;width:40px}.radio,.radio-container{--border-width-default-state: 4px;--border-width-animation-state: 6px;width:100%}.radio[alignment=top] ::ng-deep .mdc-form-field,.radio-container[alignment=top] ::ng-deep .mdc-form-field{align-items:start}.radio[alignment=top] .label,.radio-container[alignment=top] .label{margin-top:10px}.radio[truncate-text=true] .label,.radio[truncate-text=true] ::ng-deep label,.radio-container[truncate-text=true] .label,.radio-container[truncate-text=true] ::ng-deep label{-webkit-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@keyframes focus-ring-animation{0%{outline-width:var(--border-width-animation-state)}to{outline-width:var(--border-width-default-state)}}.radio-container[hasError=true]{outline:1px solid #e02800}.radio .label{display:block;width:100%;cursor:pointer}::ng-deep .mat-mdc-radio-button.mat-accent.cdk-keyboard-focused{outline:none;--mat-radio-checked-ripple-color: transparent !important;--mat-radio-ripple-color: transparent !important}::ng-deep .mat-mdc-radio-button.mat-accent.cdk-keyboard-focused ::ng-deep .mdc-radio__background{outline:3px solid #242424;animation:focus-ring-animation .4s forwards}::ng-deep .mat-mdc-radio-button.mat-accent.cdk-keyboard-focused ::ng-deep .mdc-radio__background:after{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;outline:2px solid #ffffff;border-radius:100px}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i4.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "directive", type: i5.EllipseTextDirective, selector: "[uiEllipseText]", inputs: ["isMultiline", "maxDiffPixels", "refresh"], outputs: ["onChangeTextState"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: RadioButtonComponent, decorators: [{
             type: Component,
@@ -285,7 +293,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
                         // programmatically set, for example inside of a focus trap, in this case we want to forward
                         // the focus to the mat-radio-button element.
                         '(focus)': 'radioElement.focus()',
-                    }, standalone: false, template: "<div\n  #radioContainer\n  [class]=\"multiple ? 'radio-container' : 'radio'\"\n  [class.multiple-disabled]=\"disabled && multiple\"\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  <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    <ng-content select=\"[radio-label]\"></ng-content>\n  </mat-radio-button>\n</div>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.mat-mdc-radio-button.mat-accent{--mat-radio-checked-ripple-color: var(--color)!important;--mdc-radio-selected-focus-icon-color: var(--color)!important;--mdc-radio-selected-pressed-icon-color: var(--color)!important}::ng-deep .mat-mdc-radio-checked .mdc-radio__outer-circle{border-color:var(--color)!important}::ng-deep .mat-mdc-radio-checked .mdc-radio__inner-circle{background-color:var(--color)!important;border-color:var(--color)!important}::ng-deep .mat-mdc-radio-button .mat-ripple-element{background-color:var(--color)!important}::ng-deep .mat-mdc-radio-button.mat-radio-disabled.mat-radio-checked .mdc-radio__outer-circle,.mat-radio-button.mat-radio-disabled .mdc-radio__outer-circle{border-color:#888!important}::ng-deep .mat-mdc-radio-button.mat-radio-disabled .mdc-radio__inner-circle{background-color:#888!important}[theme=dark] .mat-mdc-radio-button,[theme=light] .mat-mdc-radio-button{width:100%!important}[theme=dark] ::ng-deep .mdc-form-field,[theme=light] ::ng-deep .mdc-form-field{width:100%}[theme=dark] .mat-mdc-radio-button.mat-accent,[theme=light] .mat-mdc-radio-button.mat-accent{--mdc-radio-unselected-icon-color: #242424 !important}[theme=dark] ::ng-deep .mdc-radio.mdc-radio--disabled,[theme=light] ::ng-deep .mdc-radio.mdc-radio--disabled{--mdc-radio-disabled-unselected-icon-color: #919191;--mdc-radio-disabled-selected-icon-opacity: 1;--mdc-radio-disabled-unselected-icon-opacity: 1;--color: #919191}[theme=dark] ::ng-deep .mdc-radio.mdc-radio--disabled .mdc-radio__background,[theme=light] ::ng-deep .mdc-radio.mdc-radio--disabled .mdc-radio__background{background:#e9e9e9;border-radius:100%}[theme=dark] ::ng-deep .mdc-radio__background,[theme=light] ::ng-deep .mdc-radio__background{background:#fff!important;border-radius:100%;scale:.8}[theme=dark] ::ng-deep .mdc-radio__background .mdc-radio__outer-circle,[theme=light] ::ng-deep .mdc-radio__background .mdc-radio__outer-circle{border-width:1px}[theme=dark] ::ng-deep .mat-ripple,[theme=light] ::ng-deep .mat-ripple{display:none}[haserror=true] ::ng-deep .mdc-radio__background .mdc-radio__outer-circle{border-width:2px}.multiple-checked{border:1px solid var(--color);display:flex;flex-direction:row;align-items:center;gap:16px;background:var(--color);border-radius:8px}.multiple-checked ::ng-deep .mat-mdc-radio-button{width:100%;height:100%;padding:8px}.multiple-checked ::ng-deep .mat-mdc-radio-checked .mdc-radio__outer-circle{border:1px solid #ffffff;border-radius:64px;background:#fff}.multiple-checked ::ng-deep label{color:#fff;height:100%}.multiple-checked[theme=dark][hasError=false],.multiple-checked[theme=light][hasError=false]{background:#f4f4f4;border-color:#242424;outline:1px solid #242424}.multiple-checked[theme=dark][hasError=false] ::ng-deep label,.multiple-checked[theme=light][hasError=false] ::ng-deep label{color:#242424}.multiple-checked[theme=dark][hasError=true],.multiple-checked[theme=light][hasError=true]{border:1px solid #E02800;outline:1px solid #E02800;background:#fff;border-radius:10px}.multiple-checked[theme=dark][hasError=true] ::ng-deep label,.multiple-checked[theme=light][hasError=true] ::ng-deep label{color:#242424}.multiple-checked[theme=classic][hasError=true]{border:1px solid #E02800;outline:1px solid #E02800}.multiple-unchecked{border:1px solid #E0E0E0;display:flex;flex-direction:row;align-items:center;gap:16px;background:#fff;border-radius:8px}.multiple-unchecked ::ng-deep .mat-mdc-radio-button{width:100%;height:100%;padding:8px}.multiple-unchecked:hover{background:#f6f6f6;border:1px solid #E0E0E0}.multiple-unchecked ::ng-deep label{height:100%}.multiple-unchecked ::ng-deep .mat-mdc-radio-button .mdc-radio .mdc-radio__background:before{opacity:0!important}.multiple-unchecked[theme=dark][hasError=false],.multiple-unchecked[theme=light][hasError=false]{border:1px solid #919191;background:#fff}.multiple-unchecked[theme=dark][hasError=false]:not(.multiple-disabled):hover,.multiple-unchecked[theme=light][hasError=false]:not(.multiple-disabled):hover{outline:1px solid #242424;background:#fff;border-color:#242424!important}.multiple-unchecked[hasError=true]{border:1px solid #E02800;outline:1px solid #E02800;background:#fff}.multiple-unchecked[hasError=true]:not([theme=classic]){border-radius:10px}.multiple-unchecked ::ng-deep label,.multiple-checked ::ng-deep label{padding-left:0;width:fit-content;cursor:pointer}.radio-container{cursor:pointer}.radio-container .label{cursor:pointer;-webkit-user-select:none;user-select:none}.radio-button .label{cursor:pointer;-webkit-user-select:none;user-select:none;padding-left:4px}:host *[hasError=true] .mat-mdc-radio-button.mat-accent{--mdc-radio-unselected-icon-color: #E02800 !important;--mdc-radio-unselected-hover-icon-color: #E02800 !important;--mdc-radio-unselected-focus-icon-color: #E02800 !important}:host ::ng-deep .mat-mdc-radio-touch-target{height:40px;width:40px}.radio,.radio-container{--border-width-default-state: 4px;--border-width-animation-state: 6px;width:100%}.radio[alignment=top] ::ng-deep .mdc-form-field,.radio-container[alignment=top] ::ng-deep .mdc-form-field{align-items:start}.radio[alignment=top] .label,.radio-container[alignment=top] .label{margin-top:10px}.radio[truncate-text=true] .label,.radio[truncate-text=true] ::ng-deep label,.radio-container[truncate-text=true] .label,.radio-container[truncate-text=true] ::ng-deep label{-webkit-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@keyframes focus-ring-animation{0%{outline-width:var(--border-width-animation-state)}to{outline-width:var(--border-width-default-state)}}.radio-container[hasError=true]{outline:1px solid #E02800}.radio .label{display:block;width:100%;cursor:pointer}::ng-deep .mat-mdc-radio-button.mat-accent.cdk-keyboard-focused{outline:none;--mat-radio-checked-ripple-color: transparent!important;--mat-radio-ripple-color: transparent!important}::ng-deep .mat-mdc-radio-button.mat-accent.cdk-keyboard-focused ::ng-deep .mdc-radio__background{outline:3px solid #242424;animation:focus-ring-animation .4s forwards}::ng-deep .mat-mdc-radio-button.mat-accent.cdk-keyboard-focused ::ng-deep .mdc-radio__background:after{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;outline:2px solid #ffffff;border-radius:100px}\n"] }]
+                    }, standalone: false, template: "<div\n  #radioContainer\n  tabindex=\"0\"\n  [class]=\"multiple ? 'radio-container' : 'radio'\"\n  [class.multiple-disabled]=\"disabled && multiple\"\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  <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", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.mat-mdc-radio-button.mat-accent{--mat-radio-checked-ripple-color: var(--color) !important;--mdc-radio-selected-focus-icon-color: var(--color) !important;--mdc-radio-selected-pressed-icon-color: var(--color) !important}::ng-deep .mat-mdc-radio-checked .mdc-radio__outer-circle{border-color:var(--color)!important}::ng-deep .mat-mdc-radio-checked .mdc-radio__inner-circle{background-color:var(--color)!important;border-color:var(--color)!important}::ng-deep .mat-mdc-radio-button .mat-ripple-element{background-color:var(--color)!important}::ng-deep .mat-mdc-radio-button.mat-radio-disabled.mat-radio-checked .mdc-radio__outer-circle,.mat-radio-button.mat-radio-disabled .mdc-radio__outer-circle{border-color:#888!important}::ng-deep .mat-mdc-radio-button.mat-radio-disabled .mdc-radio__inner-circle{background-color:#888!important}[theme=dark] .mat-mdc-radio-button,[theme=light] .mat-mdc-radio-button{width:100%!important}[theme=dark] ::ng-deep .mdc-form-field,[theme=light] ::ng-deep .mdc-form-field{width:100%}[theme=dark] .mat-mdc-radio-button.mat-accent,[theme=light] .mat-mdc-radio-button.mat-accent{--mdc-radio-unselected-icon-color: #242424 !important}[theme=dark] ::ng-deep .mdc-radio.mdc-radio--disabled,[theme=light] ::ng-deep .mdc-radio.mdc-radio--disabled{--mdc-radio-disabled-unselected-icon-color: #919191;--mdc-radio-disabled-selected-icon-opacity: 1;--mdc-radio-disabled-unselected-icon-opacity: 1;--color: #919191}[theme=dark] ::ng-deep .mdc-radio.mdc-radio--disabled .mdc-radio__background,[theme=light] ::ng-deep .mdc-radio.mdc-radio--disabled .mdc-radio__background{background:#e9e9e9;border-radius:100%}[theme=dark] ::ng-deep .mdc-radio__background,[theme=light] ::ng-deep .mdc-radio__background{background:#fff!important;border-radius:100%;scale:.8}[theme=dark] ::ng-deep .mdc-radio__background .mdc-radio__outer-circle,[theme=light] ::ng-deep .mdc-radio__background .mdc-radio__outer-circle{border-width:1px}[theme=dark] ::ng-deep .mat-ripple,[theme=light] ::ng-deep .mat-ripple{display:none}[haserror=true] ::ng-deep .mdc-radio__background .mdc-radio__outer-circle{border-width:2px}.multiple-checked{border:1px solid var(--color);display:flex;flex-direction:row;align-items:center;gap:16px;background:var(--color);border-radius:8px}.multiple-checked ::ng-deep .mat-mdc-radio-button{width:100%;height:100%;padding:8px}.multiple-checked ::ng-deep .mat-mdc-radio-checked .mdc-radio__outer-circle{border:1px solid #ffffff;border-radius:64px;background:#fff}.multiple-checked ::ng-deep label{color:#fff;height:100%}.multiple-checked[theme=dark][hasError=false],.multiple-checked[theme=light][hasError=false]{background:#f4f4f4;border-color:#242424;outline:1px solid #242424}.multiple-checked[theme=dark][hasError=false] ::ng-deep label,.multiple-checked[theme=light][hasError=false] ::ng-deep label{color:#242424}.multiple-checked[theme=dark][hasError=true],.multiple-checked[theme=light][hasError=true]{border:1px solid #e02800;outline:1px solid #e02800;background:#fff;border-radius:10px}.multiple-checked[theme=dark][hasError=true] ::ng-deep label,.multiple-checked[theme=light][hasError=true] ::ng-deep label{color:#242424}.multiple-checked[theme=classic][hasError=true]{border:1px solid #e02800;outline:1px solid #e02800}.multiple-unchecked{border:1px solid #e0e0e0;display:flex;flex-direction:row;align-items:center;gap:16px;background:#fff;border-radius:8px}.multiple-unchecked ::ng-deep .mat-mdc-radio-button{width:100%;height:100%;padding:8px}.multiple-unchecked:hover{background:#f6f6f6;border:1px solid #e0e0e0}.multiple-unchecked ::ng-deep label{height:100%}.multiple-unchecked ::ng-deep .mat-mdc-radio-button .mdc-radio .mdc-radio__background:before{opacity:0!important}.multiple-unchecked[theme=dark][hasError=false],.multiple-unchecked[theme=light][hasError=false]{border:1px solid #919191;background:#fff}.multiple-unchecked[theme=dark][hasError=false]:not(.multiple-disabled):hover,.multiple-unchecked[theme=light][hasError=false]:not(.multiple-disabled):hover{outline:1px solid #242424;background:#fff;border-color:#242424!important}.multiple-unchecked[hasError=true]{border:1px solid #e02800;outline:1px solid #e02800;background:#fff}.multiple-unchecked[hasError=true]:not([theme=classic]){border-radius:10px}.multiple-unchecked ::ng-deep label,.multiple-checked ::ng-deep label{padding-left:0;width:fit-content;cursor:pointer}.radio-container{cursor:pointer}.radio-container .label{cursor:pointer;-webkit-user-select:none;user-select:none}.radio-button .label{cursor:pointer;-webkit-user-select:none;user-select:none;padding-left:4px}:host *[hasError=true] .mat-mdc-radio-button.mat-accent{--mdc-radio-unselected-icon-color: #e02800 !important;--mdc-radio-unselected-hover-icon-color: #e02800 !important;--mdc-radio-unselected-focus-icon-color: #e02800 !important}:host ::ng-deep .mat-mdc-radio-touch-target{height:40px;width:40px}.radio,.radio-container{--border-width-default-state: 4px;--border-width-animation-state: 6px;width:100%}.radio[alignment=top] ::ng-deep .mdc-form-field,.radio-container[alignment=top] ::ng-deep .mdc-form-field{align-items:start}.radio[alignment=top] .label,.radio-container[alignment=top] .label{margin-top:10px}.radio[truncate-text=true] .label,.radio[truncate-text=true] ::ng-deep label,.radio-container[truncate-text=true] .label,.radio-container[truncate-text=true] ::ng-deep label{-webkit-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@keyframes focus-ring-animation{0%{outline-width:var(--border-width-animation-state)}to{outline-width:var(--border-width-default-state)}}.radio-container[hasError=true]{outline:1px solid #e02800}.radio .label{display:block;width:100%;cursor:pointer}::ng-deep .mat-mdc-radio-button.mat-accent.cdk-keyboard-focused{outline:none;--mat-radio-checked-ripple-color: transparent !important;--mat-radio-ripple-color: transparent !important}::ng-deep .mat-mdc-radio-button.mat-accent.cdk-keyboard-focused ::ng-deep .mdc-radio__background{outline:3px solid #242424;animation:focus-ring-animation .4s forwards}::ng-deep .mat-mdc-radio-button.mat-accent.cdk-keyboard-focused ::ng-deep .mdc-radio__background:after{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;outline:2px solid #ffffff;border-radius:100px}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Optional
                 }, {
@@ -353,14 +361,38 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
 
 class RadioButtonComponentModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: RadioButtonComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.19", ngImport: i0, type: RadioButtonComponentModule, declarations: [RadioButtonComponent], imports: [CommonModule, MatRadioModule, FormsModule, ReactiveFormsModule, MatInputModule, EllipseTextDirective, MatTooltipModule, MatCheckboxModule, FocusVisibleDirective], exports: [RadioButtonComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: RadioButtonComponentModule, imports: [CommonModule, MatRadioModule, FormsModule, ReactiveFormsModule, MatInputModule, MatTooltipModule, MatCheckboxModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.19", ngImport: i0, type: RadioButtonComponentModule, declarations: [RadioButtonComponent], imports: [CommonModule,
+            MatRadioModule,
+            FormsModule,
+            ReactiveFormsModule,
+            MatInputModule,
+            EllipseTextDirective,
+            MatTooltipModule,
+            MatCheckboxModule,
+            FocusVisibleDirective], exports: [RadioButtonComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: RadioButtonComponentModule, imports: [CommonModule,
+            MatRadioModule,
+            FormsModule,
+            ReactiveFormsModule,
+            MatInputModule,
+            MatTooltipModule,
+            MatCheckboxModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: RadioButtonComponentModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [RadioButtonComponent],
-                    imports: [CommonModule, MatRadioModule, FormsModule, ReactiveFormsModule, MatInputModule, EllipseTextDirective, MatTooltipModule, MatCheckboxModule, FocusVisibleDirective],
+                    imports: [
+                        CommonModule,
+                        MatRadioModule,
+                        FormsModule,
+                        ReactiveFormsModule,
+                        MatInputModule,
+                        EllipseTextDirective,
+                        MatTooltipModule,
+                        MatCheckboxModule,
+                        FocusVisibleDirective,
+                    ],
                     exports: [RadioButtonComponent],
                 }]
         }] });

package/fesm2022/testgorilla-tgo-ui-components-radio-button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"testgorilla-tgo-ui-components-radio-button.mjs","sources":["../../../components/radio-button/radio-button.component.ts","../../../components/radio-button/radio-button.component.html","../../../components/radio-button/radio-button.component.module.ts","../../../components/radio-button/testgorilla-tgo-ui-components-radio-button.ts"],"sourcesContent":["/* eslint-disable no-underscore-dangle */\nimport {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  DestroyRef,\n  EventEmitter,\n  Host,\n  HostBinding,\n  HostListener,\n  Inject,\n  Input,\n  NgZone,\n  OnChanges,\n  OnDestroy,\n  OnInit,\n  Optional,\n  Output,\n  Self,\n  SimpleChanges,\n  ViewChild,\n} from '@angular/core';\nimport { MatRadioButton } from '@angular/material/radio';\nimport { RadioButtonEventType } from './radio-button.model';\nimport { ApplicationTheme } from \"@testgorilla/tgo-ui/components/core\";\nimport { ControlValueAccessor, NgControl } from \"@angular/forms\";\nimport { takeUntilDestroyed } from \"@angular/core/rxjs-interop\";\nimport { MatTooltip } from '@angular/material/tooltip';\nimport { Alignment } from '@testgorilla/tgo-ui/components/core';\nimport { FocusMonitor } from '@angular/cdk/a11y';\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    standalone: false\n})\nexport class RadioButtonComponent implements OnInit, OnChanges, ControlValueAccessor, AfterViewInit, OnDestroy {\n  @HostListener('click', ['$event'])\n  onHostClick(event: any): void {\n    if (event.target?.classList?.value?.includes?.('mat-mdc-radio-button') || event.target?.classList?.value?.includes?.('mdc-form-field')) {\n      this.radioElement._inputElement.nativeElement.click();\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   * Determines value of the radio button.\n   * Default: false\n   *\n   * @type {any}\n   * @memberof RadioButtonComponent\n   */\n  @Input() value: any;\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  /**\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  @ViewChild('tooltip') tooltipElement: MatTooltip;\n\n  constructor(\n    @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme,\n    @Optional() @Self() public ngControl: NgControl,\n    @Optional() @Host() public hostNgControl: NgControl,\n    private destroyRef: DestroyRef,\n    private focusMonitor: FocusMonitor,\n    private ngZone: NgZone,\n    private cdr: ChangeDetectorRef,\n  ) {\n    if (defaultAppTheme) {\n      this.applicationTheme = 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  }\n\n  ngAfterViewInit() {\n    this.radioElement._inputElement.nativeElement.setAttribute('role', 'radio');\n    this.radioElement._inputElement.nativeElement.onclick = () => {\n      this.clickRadio();\n    };\n\n    this.focusMonitor.monitor(this.radioElement._inputElement.nativeElement).pipe(\n      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({ optionName: this.radioElement.value, optionChecked: this.radioElement.checked });\n    } else {\n      this.selected = this.radioElement.checked;\n      this.changeRadio.emit({ optionName: this.radioElement.value, 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: any): void {\n    if (typeof value === 'boolean' || value === this.value) {\n      this.selected = value;\n    }\n  }\n\n  registerOnChange(fn: any): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: any): void {\n    this.onTouch = fn;\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.disabled = isDisabled;\n  }\n\n  onChange = (_: any) => {};\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(\n        takeUntilDestroyed(this.destroyRef)\n      ).subscribe((value) => {\n        this.selected = value === this.value;\n        this.classMultiple = this.setClass();\n      });\n    }\n  }\n\n  private setCompanyColor(): void {\n    this.companyColor = this.companyColor ? this.companyColor : this.applicationTheme === 'classic' ? '#46A997' : '#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  [class]=\"multiple ? 'radio-container' : 'radio'\"\n  [class.multiple-disabled]=\"disabled && multiple\"\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  <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    <ng-content select=\"[radio-label]\"></ng-content>\n  </mat-radio-button>\n</div>\n","import { FormsModule, ReactiveFormsModule } from '@angular/forms';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatRadioModule } from '@angular/material/radio';\nimport { RadioButtonComponent } from './radio-button.component';\nimport { MatInputModule } from '@angular/material/input';\nimport { EllipseTextDirective } from '@testgorilla/tgo-ui/components/core';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { MatCheckboxModule } from '@angular/material/checkbox';\nimport { FocusVisibleDirective } from '@testgorilla/tgo-ui/components/checkbox';\n\n@NgModule({\n  declarations: [RadioButtonComponent],\n  imports: [CommonModule, MatRadioModule, FormsModule, ReactiveFormsModule, MatInputModule, EllipseTextDirective, MatTooltipModule, MatCheckboxModule, FocusVisibleDirective],\n  exports: [RadioButtonComponent],\n})\nexport class RadioButtonComponentModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"testgorilla-tgo-ui-components-radio-button.mjs","sources":["../../../components/radio-button/radio-button.component.ts","../../../components/radio-button/radio-button.component.html","../../../components/radio-button/radio-button.component.module.ts","../../../components/radio-button/testgorilla-tgo-ui-components-radio-button.ts"],"sourcesContent":["/* eslint-disable no-underscore-dangle */\nimport {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  DestroyRef,\n  EventEmitter,\n  Host,\n  HostBinding,\n  HostListener,\n  Inject,\n  Input,\n  NgZone,\n  OnChanges,\n  OnDestroy,\n  OnInit,\n  Optional,\n  Output,\n  Self,\n  SimpleChanges,\n  ViewChild,\n} from '@angular/core';\nimport { MatRadioButton } from '@angular/material/radio';\nimport { RadioButtonEventType } from './radio-button.model';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\nimport { ControlValueAccessor, NgControl } from '@angular/forms';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { MatTooltip } from '@angular/material/tooltip';\nimport { Alignment } from '@testgorilla/tgo-ui/components/core';\nimport { FocusMonitor } from '@angular/cdk/a11y';\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  standalone: false,\n})\nexport class RadioButtonComponent implements OnInit, OnChanges, ControlValueAccessor, AfterViewInit, OnDestroy {\n  @HostListener('click', ['$event'])\n  onHostClick(event: any): void {\n    if (\n      event.target?.classList?.value?.includes?.('mat-mdc-radio-button') ||\n      event.target?.classList?.value?.includes?.('mdc-form-field')\n    ) {\n      this.radioElement._inputElement.nativeElement.click();\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   * Determines value of the radio button.\n   * Default: false\n   *\n   * @type {any}\n   * @memberof RadioButtonComponent\n   */\n  @Input() value: any;\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  /**\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  @ViewChild('tooltip') tooltipElement: MatTooltip;\n\n  constructor(\n    @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme,\n    @Optional() @Self() public ngControl: NgControl,\n    @Optional() @Host() public hostNgControl: NgControl,\n    private destroyRef: DestroyRef,\n    private focusMonitor: FocusMonitor,\n    private ngZone: NgZone,\n    private cdr: ChangeDetectorRef\n  ) {\n    if (defaultAppTheme) {\n      this.applicationTheme = 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  }\n\n  ngAfterViewInit() {\n    this.radioElement._inputElement.nativeElement.setAttribute('role', 'radio');\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({ optionName: this.radioElement.value, optionChecked: this.radioElement.checked });\n    } else {\n      this.selected = this.radioElement.checked;\n      this.changeRadio.emit({ optionName: this.radioElement.value, 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: any): void {\n    if (typeof value === 'boolean' || value === this.value) {\n      this.selected = value;\n    }\n  }\n\n  registerOnChange(fn: any): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: any): void {\n    this.onTouch = fn;\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.disabled = isDisabled;\n  }\n\n  onChange = (_value: any) => {};\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    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  [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  <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 { FormsModule, ReactiveFormsModule } from '@angular/forms';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatRadioModule } from '@angular/material/radio';\nimport { RadioButtonComponent } from './radio-button.component';\nimport { MatInputModule } from '@angular/material/input';\nimport { EllipseTextDirective } from '@testgorilla/tgo-ui/components/core';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { MatCheckboxModule } from '@angular/material/checkbox';\nimport { FocusVisibleDirective } from '@testgorilla/tgo-ui/components/checkbox';\n\n@NgModule({\n  declarations: [RadioButtonComponent],\n  imports: [\n    CommonModule,\n    MatRadioModule,\n    FormsModule,\n    ReactiveFormsModule,\n    MatInputModule,\n    EllipseTextDirective,\n    MatTooltipModule,\n    MatCheckboxModule,\n    FocusVisibleDirective,\n  ],\n  exports: [RadioButtonComponent],\n})\nexport class RadioButtonComponentModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/testgorilla-tgo-ui-components-rating.mjs

@@ -22,7 +22,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
             type: Pipe,
             args: [{
                     name: 'halfStar',
-                    standalone: false
+                    standalone: false,
                 }]
         }] });
 
@@ -96,11 +96,11 @@ class RatingComponent {
         this.hoverIndex = index + 1;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: RatingComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: RatingComponent, isStandalone: false, selector: "ui-rating", inputs: { applicationTheme: "applicationTheme", value: "value", theme: "theme", disabled: "disabled", ariaLabel: "ariaLabel", ariaRequired: "ariaRequired", barWidth: "barWidth", canUnselect: "canUnselect", length: "length" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"rating\"\n     (mouseleave)=\"onHover(-1)\"\n     [attr.aria-label]=\"ariaLabel\"\n     [attr.aria-required]=\"ariaRequired\"\n>\n  <ng-container *ngIf=\"theme === 'block';else stars\">\n    <div class=\"rating-item\" [attr.theme]=\"applicationTheme\" *ngFor=\"let item of items\" (click)=\"select(item)\" (mouseenter)=\"onHover(item)\"\n         [ngClass]=\"{ 'rating-item-selected': item < value, 'rating-item-hover': item < hoverIndex }\"\n         [ngStyle]=\"{'width.px': barWidth}\">\n    </div>\n  </ng-container>\n\n  <ng-template #stars>\n    <div class=\"star-container\" [attr.theme]=\"applicationTheme\">\n      <div\n        #star\n        class=\"star\"\n        [tabIndex]=\"0\"\n        (mouseenter)=\"onHover(item)\"\n        (mouseleave)=\"onHover(-1)\"\n        [ngClass]=\"{\n          filled: value > i,\n          hover: item < hoverIndex && (value ? item >= value : true),\n          disabled,\n          'filled-half': i + 1 | halfStar : value\n        }\"\n        *ngFor=\"let item of items; index as i\"\n        (click)=\"select(item); star.blur()\"\n      ></div>\n    </div>\n  </ng-template>\n</div>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.rating{display:flex;align-content:center;justify-content:flex-start;align-items:center}.rating-item{width:35px;height:16px;border:1px solid #E0E0E0;border-left:0;cursor:pointer}.rating-item-hover{border:0;background-color:#b5ddd5}.rating-item-hover[theme=dark],.rating-item-hover[theme=light]{background-color:#ffb3ee}.rating-item-hover:not(:first-child){border-left:1px solid #ffffff}.rating-item:first-child{border-radius:4px 0 0 4px}.rating-item:first-child:not(.rating-item-selected):not(.rating-item-hover){border-left:1px solid #E0E0E0}.rating-item:last-child{border-radius:0 4px 4px 0}.rating-item:first-child:last-child{border-radius:4px}.rating-item-selected{border:0;background-color:#46a997}.rating-item-selected[theme=dark],.rating-item-selected[theme=light]{background-color:#d410aa}.rating-item-selected:not(:first-child){border-left:1px solid #ffffff}.rating .star-container{display:flex;flex-direction:row;min-height:24px}.rating .star-container .star{width:24px;height:24px;background:url(/icons/rating-icons/Star-outline.svg) no-repeat center;background-size:100%;margin-right:4px}.rating .star-container .star:last-child{margin-right:0}.rating .star-container .star:focus{outline:1px dashed #888888}.rating .star-container .star:hover,.rating .star-container .star.hover,.rating .star-container .star:focus{opacity:.5}.rating .star-container .star.filled-half{background-image:url(/icons/rating-icons/Star-half.svg)!important}.rating .star-container .star.disabled{pointer-events:none;background-image:url(/icons/rating-icons/Star-filled-disabled.svg)}.rating .star-container .star:active{opacity:1}.rating .star-container .star-filled,.rating .star-container[theme=dark] .star.filled,.rating .star-container[theme=light] .star.filled,.rating .star-container[theme=dark] .star:hover,.rating .star-container[theme=dark] .star.hover,.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=light] .star:hover,.rating .star-container[theme=light] .star.hover,.rating .star-container[theme=light] .star:focus,.rating .star-container .star:hover,.rating .star-container .star.hover,.rating .star-container .star:focus,.rating .star-container .star.filled,.rating .star-container .star:active{background-image:url(/icons/rating-icons/Star-filled.svg)}.rating .star-container[theme=dark] .star,.rating .star-container[theme=light] .star{cursor:pointer;background:url(/icons/rebrand/Review-star-in-line.svg) no-repeat center}.rating .star-container[theme=dark] .star:hover,.rating .star-container[theme=dark] .star.hover,.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=light] .star:hover,.rating .star-container[theme=light] .star.hover,.rating .star-container[theme=light] .star:focus{opacity:.5}.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=light] .star:focus{outline-offset:4px}.rating .star-container[theme=dark] .star.filled-half,.rating .star-container[theme=light] .star.filled-half{background-image:url(/icons/rebrand/Review-half-star-filled.svg)!important}.rating .star-container[theme=dark] .star.disabled,.rating .star-container[theme=light] .star.disabled{background-image:url(/icons/rebrand/Review-star-filled-disabled.svg)}.rating .star-container[theme=dark] .star-filled,.rating .star-container[theme=dark] .star:hover,.rating .star-container[theme=dark] .star.hover,.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=dark] .star.filled,.rating .star-container[theme=dark] .star:active,.rating .star-container[theme=light] .star-filled,.rating .star-container[theme=light] .star:hover,.rating .star-container[theme=light] .star.hover,.rating .star-container[theme=light] .star:focus,.rating .star-container[theme=light] .star.filled,.rating .star-container[theme=light] .star:active{background-image:url(/icons/rebrand/Review-star-filled.svg)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: HalfStarPipe, name: "halfStar" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: RatingComponent, isStandalone: false, selector: "ui-rating", inputs: { applicationTheme: "applicationTheme", value: "value", theme: "theme", disabled: "disabled", ariaLabel: "ariaLabel", ariaRequired: "ariaRequired", barWidth: "barWidth", canUnselect: "canUnselect", length: "length" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"rating\" (mouseleave)=\"onHover(-1)\" [attr.aria-label]=\"ariaLabel\" [attr.aria-required]=\"ariaRequired\">\n  <ng-container *ngIf=\"theme === 'block'; else stars\">\n    <div\n      class=\"rating-item\"\n      [attr.theme]=\"applicationTheme\"\n      *ngFor=\"let item of items\"\n      tabindex=\"0\"\n      (click)=\"select(item)\"\n      (keydown.enter)=\"select(item)\"\n      (mouseenter)=\"onHover(item)\"\n      [ngClass]=\"{ 'rating-item-selected': item < value, 'rating-item-hover': item < hoverIndex }\"\n      [ngStyle]=\"{ 'width.px': barWidth }\"\n    ></div>\n  </ng-container>\n\n  <ng-template #stars>\n    <div class=\"star-container\" [attr.theme]=\"applicationTheme\">\n      <div\n        #star\n        class=\"star\"\n        tabindex=\"0\"\n        [tabIndex]=\"0\"\n        (mouseenter)=\"onHover(item)\"\n        (mouseleave)=\"onHover(-1)\"\n        [ngClass]=\"{\n          filled: value > i,\n          hover: item < hoverIndex && (value ? item >= value : true),\n          disabled,\n          'filled-half': i + 1 | halfStar: value,\n        }\"\n        *ngFor=\"let item of items; index as i\"\n        (click)=\"select(item); star.blur()\"\n        (keydown.enter)=\"select(item); star.blur()\"\n      ></div>\n    </div>\n  </ng-template>\n</div>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.rating{display:flex;align-content:center;justify-content:flex-start;align-items:center}.rating-item{width:35px;height:16px;border:1px solid #e0e0e0;border-left:0;cursor:pointer}.rating-item-hover{border:0;background-color:#b5ddd5}.rating-item-hover[theme=dark],.rating-item-hover[theme=light]{background-color:#ffb3ee}.rating-item-hover:not(:first-child){border-left:1px solid #ffffff}.rating-item:first-child{border-radius:4px 0 0 4px}.rating-item:first-child:not(.rating-item-selected):not(.rating-item-hover){border-left:1px solid #e0e0e0}.rating-item:last-child{border-radius:0 4px 4px 0}.rating-item:first-child:last-child{border-radius:4px}.rating-item-selected{border:0;background-color:#46a997}.rating-item-selected[theme=dark],.rating-item-selected[theme=light]{background-color:#d410aa}.rating-item-selected:not(:first-child){border-left:1px solid #ffffff}.rating .star-container{display:flex;flex-direction:row;min-height:24px}.rating .star-container .star{width:24px;height:24px;background:url(/icons/rating-icons/Star-outline.svg) no-repeat center;background-size:100%;margin-right:4px}.rating .star-container .star:last-child{margin-right:0}.rating .star-container .star:focus{outline:1px dashed #888888}.rating .star-container .star:hover,.rating .star-container .star.hover,.rating .star-container .star:focus{opacity:.5}.rating .star-container .star.filled-half{background-image:url(/icons/rating-icons/Star-half.svg)!important}.rating .star-container .star.disabled{pointer-events:none;background-image:url(/icons/rating-icons/Star-filled-disabled.svg)}.rating .star-container .star:active{opacity:1}.rating .star-container .star-filled,.rating .star-container[theme=dark] .star.filled,.rating .star-container[theme=light] .star.filled,.rating .star-container[theme=dark] .star:hover,.rating .star-container[theme=dark] .star.hover,.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=light] .star:hover,.rating .star-container[theme=light] .star.hover,.rating .star-container[theme=light] .star:focus,.rating .star-container .star:hover,.rating .star-container .star.hover,.rating .star-container .star:focus,.rating .star-container .star.filled,.rating .star-container .star:active{background-image:url(/icons/rating-icons/Star-filled.svg)}.rating .star-container[theme=dark] .star,.rating .star-container[theme=light] .star{cursor:pointer;background:url(/icons/rebrand/Review-star-in-line.svg) no-repeat center}.rating .star-container[theme=dark] .star:hover,.rating .star-container[theme=dark] .star.hover,.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=light] .star:hover,.rating .star-container[theme=light] .star.hover,.rating .star-container[theme=light] .star:focus{opacity:.5}.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=light] .star:focus{outline-offset:4px}.rating .star-container[theme=dark] .star.filled-half,.rating .star-container[theme=light] .star.filled-half{background-image:url(/icons/rebrand/Review-half-star-filled.svg)!important}.rating .star-container[theme=dark] .star.disabled,.rating .star-container[theme=light] .star.disabled{background-image:url(/icons/rebrand/Review-star-filled-disabled.svg)}.rating .star-container[theme=dark] .star-filled,.rating .star-container[theme=dark] .star:hover,.rating .star-container[theme=dark] .star.hover,.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=dark] .star.filled,.rating .star-container[theme=dark] .star:active,.rating .star-container[theme=light] .star-filled,.rating .star-container[theme=light] .star:hover,.rating .star-container[theme=light] .star.hover,.rating .star-container[theme=light] .star:focus,.rating .star-container[theme=light] .star.filled,.rating .star-container[theme=light] .star:active{background-image:url(/icons/rebrand/Review-star-filled.svg)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: HalfStarPipe, name: "halfStar" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: RatingComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ui-rating', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div class=\"rating\"\n     (mouseleave)=\"onHover(-1)\"\n     [attr.aria-label]=\"ariaLabel\"\n     [attr.aria-required]=\"ariaRequired\"\n>\n  <ng-container *ngIf=\"theme === 'block';else stars\">\n    <div class=\"rating-item\" [attr.theme]=\"applicationTheme\" *ngFor=\"let item of items\" (click)=\"select(item)\" (mouseenter)=\"onHover(item)\"\n         [ngClass]=\"{ 'rating-item-selected': item < value, 'rating-item-hover': item < hoverIndex }\"\n         [ngStyle]=\"{'width.px': barWidth}\">\n    </div>\n  </ng-container>\n\n  <ng-template #stars>\n    <div class=\"star-container\" [attr.theme]=\"applicationTheme\">\n      <div\n        #star\n        class=\"star\"\n        [tabIndex]=\"0\"\n        (mouseenter)=\"onHover(item)\"\n        (mouseleave)=\"onHover(-1)\"\n        [ngClass]=\"{\n          filled: value > i,\n          hover: item < hoverIndex && (value ? item >= value : true),\n          disabled,\n          'filled-half': i + 1 | halfStar : value\n        }\"\n        *ngFor=\"let item of items; index as i\"\n        (click)=\"select(item); star.blur()\"\n      ></div>\n    </div>\n  </ng-template>\n</div>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.rating{display:flex;align-content:center;justify-content:flex-start;align-items:center}.rating-item{width:35px;height:16px;border:1px solid #E0E0E0;border-left:0;cursor:pointer}.rating-item-hover{border:0;background-color:#b5ddd5}.rating-item-hover[theme=dark],.rating-item-hover[theme=light]{background-color:#ffb3ee}.rating-item-hover:not(:first-child){border-left:1px solid #ffffff}.rating-item:first-child{border-radius:4px 0 0 4px}.rating-item:first-child:not(.rating-item-selected):not(.rating-item-hover){border-left:1px solid #E0E0E0}.rating-item:last-child{border-radius:0 4px 4px 0}.rating-item:first-child:last-child{border-radius:4px}.rating-item-selected{border:0;background-color:#46a997}.rating-item-selected[theme=dark],.rating-item-selected[theme=light]{background-color:#d410aa}.rating-item-selected:not(:first-child){border-left:1px solid #ffffff}.rating .star-container{display:flex;flex-direction:row;min-height:24px}.rating .star-container .star{width:24px;height:24px;background:url(/icons/rating-icons/Star-outline.svg) no-repeat center;background-size:100%;margin-right:4px}.rating .star-container .star:last-child{margin-right:0}.rating .star-container .star:focus{outline:1px dashed #888888}.rating .star-container .star:hover,.rating .star-container .star.hover,.rating .star-container .star:focus{opacity:.5}.rating .star-container .star.filled-half{background-image:url(/icons/rating-icons/Star-half.svg)!important}.rating .star-container .star.disabled{pointer-events:none;background-image:url(/icons/rating-icons/Star-filled-disabled.svg)}.rating .star-container .star:active{opacity:1}.rating .star-container .star-filled,.rating .star-container[theme=dark] .star.filled,.rating .star-container[theme=light] .star.filled,.rating .star-container[theme=dark] .star:hover,.rating .star-container[theme=dark] .star.hover,.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=light] .star:hover,.rating .star-container[theme=light] .star.hover,.rating .star-container[theme=light] .star:focus,.rating .star-container .star:hover,.rating .star-container .star.hover,.rating .star-container .star:focus,.rating .star-container .star.filled,.rating .star-container .star:active{background-image:url(/icons/rating-icons/Star-filled.svg)}.rating .star-container[theme=dark] .star,.rating .star-container[theme=light] .star{cursor:pointer;background:url(/icons/rebrand/Review-star-in-line.svg) no-repeat center}.rating .star-container[theme=dark] .star:hover,.rating .star-container[theme=dark] .star.hover,.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=light] .star:hover,.rating .star-container[theme=light] .star.hover,.rating .star-container[theme=light] .star:focus{opacity:.5}.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=light] .star:focus{outline-offset:4px}.rating .star-container[theme=dark] .star.filled-half,.rating .star-container[theme=light] .star.filled-half{background-image:url(/icons/rebrand/Review-half-star-filled.svg)!important}.rating .star-container[theme=dark] .star.disabled,.rating .star-container[theme=light] .star.disabled{background-image:url(/icons/rebrand/Review-star-filled-disabled.svg)}.rating .star-container[theme=dark] .star-filled,.rating .star-container[theme=dark] .star:hover,.rating .star-container[theme=dark] .star.hover,.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=dark] .star.filled,.rating .star-container[theme=dark] .star:active,.rating .star-container[theme=light] .star-filled,.rating .star-container[theme=light] .star:hover,.rating .star-container[theme=light] .star.hover,.rating .star-container[theme=light] .star:focus,.rating .star-container[theme=light] .star.filled,.rating .star-container[theme=light] .star:active{background-image:url(/icons/rebrand/Review-star-filled.svg)}\n"] }]
+            args: [{ selector: 'ui-rating', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div class=\"rating\" (mouseleave)=\"onHover(-1)\" [attr.aria-label]=\"ariaLabel\" [attr.aria-required]=\"ariaRequired\">\n  <ng-container *ngIf=\"theme === 'block'; else stars\">\n    <div\n      class=\"rating-item\"\n      [attr.theme]=\"applicationTheme\"\n      *ngFor=\"let item of items\"\n      tabindex=\"0\"\n      (click)=\"select(item)\"\n      (keydown.enter)=\"select(item)\"\n      (mouseenter)=\"onHover(item)\"\n      [ngClass]=\"{ 'rating-item-selected': item < value, 'rating-item-hover': item < hoverIndex }\"\n      [ngStyle]=\"{ 'width.px': barWidth }\"\n    ></div>\n  </ng-container>\n\n  <ng-template #stars>\n    <div class=\"star-container\" [attr.theme]=\"applicationTheme\">\n      <div\n        #star\n        class=\"star\"\n        tabindex=\"0\"\n        [tabIndex]=\"0\"\n        (mouseenter)=\"onHover(item)\"\n        (mouseleave)=\"onHover(-1)\"\n        [ngClass]=\"{\n          filled: value > i,\n          hover: item < hoverIndex && (value ? item >= value : true),\n          disabled,\n          'filled-half': i + 1 | halfStar: value,\n        }\"\n        *ngFor=\"let item of items; index as i\"\n        (click)=\"select(item); star.blur()\"\n        (keydown.enter)=\"select(item); star.blur()\"\n      ></div>\n    </div>\n  </ng-template>\n</div>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.rating{display:flex;align-content:center;justify-content:flex-start;align-items:center}.rating-item{width:35px;height:16px;border:1px solid #e0e0e0;border-left:0;cursor:pointer}.rating-item-hover{border:0;background-color:#b5ddd5}.rating-item-hover[theme=dark],.rating-item-hover[theme=light]{background-color:#ffb3ee}.rating-item-hover:not(:first-child){border-left:1px solid #ffffff}.rating-item:first-child{border-radius:4px 0 0 4px}.rating-item:first-child:not(.rating-item-selected):not(.rating-item-hover){border-left:1px solid #e0e0e0}.rating-item:last-child{border-radius:0 4px 4px 0}.rating-item:first-child:last-child{border-radius:4px}.rating-item-selected{border:0;background-color:#46a997}.rating-item-selected[theme=dark],.rating-item-selected[theme=light]{background-color:#d410aa}.rating-item-selected:not(:first-child){border-left:1px solid #ffffff}.rating .star-container{display:flex;flex-direction:row;min-height:24px}.rating .star-container .star{width:24px;height:24px;background:url(/icons/rating-icons/Star-outline.svg) no-repeat center;background-size:100%;margin-right:4px}.rating .star-container .star:last-child{margin-right:0}.rating .star-container .star:focus{outline:1px dashed #888888}.rating .star-container .star:hover,.rating .star-container .star.hover,.rating .star-container .star:focus{opacity:.5}.rating .star-container .star.filled-half{background-image:url(/icons/rating-icons/Star-half.svg)!important}.rating .star-container .star.disabled{pointer-events:none;background-image:url(/icons/rating-icons/Star-filled-disabled.svg)}.rating .star-container .star:active{opacity:1}.rating .star-container .star-filled,.rating .star-container[theme=dark] .star.filled,.rating .star-container[theme=light] .star.filled,.rating .star-container[theme=dark] .star:hover,.rating .star-container[theme=dark] .star.hover,.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=light] .star:hover,.rating .star-container[theme=light] .star.hover,.rating .star-container[theme=light] .star:focus,.rating .star-container .star:hover,.rating .star-container .star.hover,.rating .star-container .star:focus,.rating .star-container .star.filled,.rating .star-container .star:active{background-image:url(/icons/rating-icons/Star-filled.svg)}.rating .star-container[theme=dark] .star,.rating .star-container[theme=light] .star{cursor:pointer;background:url(/icons/rebrand/Review-star-in-line.svg) no-repeat center}.rating .star-container[theme=dark] .star:hover,.rating .star-container[theme=dark] .star.hover,.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=light] .star:hover,.rating .star-container[theme=light] .star.hover,.rating .star-container[theme=light] .star:focus{opacity:.5}.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=light] .star:focus{outline-offset:4px}.rating .star-container[theme=dark] .star.filled-half,.rating .star-container[theme=light] .star.filled-half{background-image:url(/icons/rebrand/Review-half-star-filled.svg)!important}.rating .star-container[theme=dark] .star.disabled,.rating .star-container[theme=light] .star.disabled{background-image:url(/icons/rebrand/Review-star-filled-disabled.svg)}.rating .star-container[theme=dark] .star-filled,.rating .star-container[theme=dark] .star:hover,.rating .star-container[theme=dark] .star.hover,.rating .star-container[theme=dark] .star:focus,.rating .star-container[theme=dark] .star.filled,.rating .star-container[theme=dark] .star:active,.rating .star-container[theme=light] .star-filled,.rating .star-container[theme=light] .star:hover,.rating .star-container[theme=light] .star.hover,.rating .star-container[theme=light] .star:focus,.rating .star-container[theme=light] .star.filled,.rating .star-container[theme=light] .star:active{background-image:url(/icons/rebrand/Review-star-filled.svg)}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Optional
                 }, {

package/fesm2022/testgorilla-tgo-ui-components-rating.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"testgorilla-tgo-ui-components-rating.mjs","sources":["../../../components/rating/half-star.pipe.ts","../../../components/rating/rating.component.ts","../../../components/rating/rating.component.html","../../../components/rating/rating.component.module.ts","../../../components/rating/testgorilla-tgo-ui-components-rating.ts"],"sourcesContent":["import { Pipe, PipeTransform } from '@angular/core';\n\n@Pipe({\n    name: 'halfStar',\n    standalone: false\n})\nexport class HalfStarPipe implements PipeTransform {\n  /**\n   * @description Used to indicate whether display half-star icon.\n   * Returns true if the rounded value of the current element\n   * is equal to it's index, and value is not integer (e.g. index = 4, value = 3.5),\n   * @param index the index of the current element\n   * @param value the value of the current element\n   */\n  transform(index: number, value: number): boolean {\n    return Math.ceil(value) === index && !Number.isInteger(value);\n  }\n}\n","import { ChangeDetectionStrategy, Component, EventEmitter, Inject, Input, Optional, Output } from '@angular/core';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\n\nexport type RatingComponentTheme = 'stars' | 'block';\n\n@Component({\n    selector: 'ui-rating',\n    templateUrl: './rating.component.html',\n    styleUrls: ['./rating.component.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    standalone: false\n})\nexport class RatingComponent {\n  private readonly MIN_LENGTH = 0;\n  private readonly DEFAULT_LENGTH = 5;\n  protected items: number[] = [];\n  protected hoverIndex: number;\n\n  /**\n   *\n   * Defines the application theme where accordion is used\n   *\n   * @type {ApplicationTheme}\n   * @memberof AccordionComponent\n   */\n  @Input() applicationTheme: ApplicationTheme = 'light';\n\n  /**\n   * The value representing the rating.\n   * @type {number}\n   * @memberof RatingComponent\n   */\n  @Input() value: number;\n\n  /**\n   * The theme of the rating component. Defaults \"block\".\n   * @type {RatingComponentTheme}\n   * @memberof RatingComponent\n   */\n  @Input() theme: RatingComponentTheme = 'block';\n\n  /**\n   * A flag indicating whether the rating component is disabled.\n   * @type {boolean}\n   * @memberof RatingComponent\n   */\n  @Input() disabled = false;\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 RatingComponent\n   */\n  @Input() ariaLabel: string;\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 RatingComponent\n   */\n  @Input() ariaRequired = false;\n\n  /**\n   * The width of the rating bar.\n   * @type {number}\n   * @memberof RatingComponent\n   */\n  @Input() barWidth = 35;\n\n  /**\n   * A flag indicating whether the rating can be unselected by clicking on the same value.\n   * When false, clicking on the same value will not change the rating.\n   * @type {boolean}\n   * @memberof RatingComponent\n   */\n  @Input() canUnselect = true;\n\n  @Input() set length(length: number) {\n    this.items = Array(Math.max(length, this.MIN_LENGTH))\n      .fill(0)\n      .map((x, i) => i);\n  }\n\n  @Output() valueChange = new EventEmitter<number>();\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\n  protected select(index: number): void {\n    const newValue = index + 1;\n    \n    // If canUnselect is false and we're clicking on the same value, don't change anything\n    if (!this.canUnselect && this.value === newValue) {\n      return;\n    }\n    \n    this.value = this.value === newValue ? 0 : newValue;\n    this.valueChange.emit(this.value);\n  }\n\n  protected onHover(index: number): void {\n    this.hoverIndex = index + 1;\n  }\n}\n","<div class=\"rating\"\n     (mouseleave)=\"onHover(-1)\"\n     [attr.aria-label]=\"ariaLabel\"\n     [attr.aria-required]=\"ariaRequired\"\n>\n  <ng-container *ngIf=\"theme === 'block';else stars\">\n    <div class=\"rating-item\" [attr.theme]=\"applicationTheme\" *ngFor=\"let item of items\" (click)=\"select(item)\" (mouseenter)=\"onHover(item)\"\n         [ngClass]=\"{ 'rating-item-selected': item < value, 'rating-item-hover': item < hoverIndex }\"\n         [ngStyle]=\"{'width.px': barWidth}\">\n    </div>\n  </ng-container>\n\n  <ng-template #stars>\n    <div class=\"star-container\" [attr.theme]=\"applicationTheme\">\n      <div\n        #star\n        class=\"star\"\n        [tabIndex]=\"0\"\n        (mouseenter)=\"onHover(item)\"\n        (mouseleave)=\"onHover(-1)\"\n        [ngClass]=\"{\n          filled: value > i,\n          hover: item < hoverIndex && (value ? item >= value : true),\n          disabled,\n          'filled-half': i + 1 | halfStar : value\n        }\"\n        *ngFor=\"let item of items; index as i\"\n        (click)=\"select(item); star.blur()\"\n      ></div>\n    </div>\n  </ng-template>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { RatingComponent } from './rating.component';\nimport { HalfStarPipe } from './half-star.pipe';\nimport { MatInputModule } from '@angular/material/input';\n\n@NgModule({\n  declarations: [RatingComponent, HalfStarPipe],\n  imports: [CommonModule, MatInputModule],\n  exports: [RatingComponent],\n})\nexport class RatingComponentModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i2.HalfStarPipe"],"mappings":"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"}
+{"version":3,"file":"testgorilla-tgo-ui-components-rating.mjs","sources":["../../../components/rating/half-star.pipe.ts","../../../components/rating/rating.component.ts","../../../components/rating/rating.component.html","../../../components/rating/rating.component.module.ts","../../../components/rating/testgorilla-tgo-ui-components-rating.ts"],"sourcesContent":["import { Pipe, PipeTransform } from '@angular/core';\n\n@Pipe({\n  name: 'halfStar',\n  standalone: false,\n})\nexport class HalfStarPipe implements PipeTransform {\n  /**\n   * @description Used to indicate whether display half-star icon.\n   * Returns true if the rounded value of the current element\n   * is equal to it's index, and value is not integer (e.g. index = 4, value = 3.5),\n   * @param index the index of the current element\n   * @param value the value of the current element\n   */\n  transform(index: number, value: number): boolean {\n    return Math.ceil(value) === index && !Number.isInteger(value);\n  }\n}\n","import { ChangeDetectionStrategy, Component, EventEmitter, Inject, Input, Optional, Output } from '@angular/core';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\n\nexport type RatingComponentTheme = 'stars' | 'block';\n\n@Component({\n  selector: 'ui-rating',\n  templateUrl: './rating.component.html',\n  styleUrls: ['./rating.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  standalone: false,\n})\nexport class RatingComponent {\n  private readonly MIN_LENGTH = 0;\n  private readonly DEFAULT_LENGTH = 5;\n  protected items: number[] = [];\n  protected hoverIndex: number;\n\n  /**\n   *\n   * Defines the application theme where accordion is used\n   *\n   * @type {ApplicationTheme}\n   * @memberof AccordionComponent\n   */\n  @Input() applicationTheme: ApplicationTheme = 'light';\n\n  /**\n   * The value representing the rating.\n   * @type {number}\n   * @memberof RatingComponent\n   */\n  @Input() value: number;\n\n  /**\n   * The theme of the rating component. Defaults \"block\".\n   * @type {RatingComponentTheme}\n   * @memberof RatingComponent\n   */\n  @Input() theme: RatingComponentTheme = 'block';\n\n  /**\n   * A flag indicating whether the rating component is disabled.\n   * @type {boolean}\n   * @memberof RatingComponent\n   */\n  @Input() disabled = false;\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 RatingComponent\n   */\n  @Input() ariaLabel: string;\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 RatingComponent\n   */\n  @Input() ariaRequired = false;\n\n  /**\n   * The width of the rating bar.\n   * @type {number}\n   * @memberof RatingComponent\n   */\n  @Input() barWidth = 35;\n\n  /**\n   * A flag indicating whether the rating can be unselected by clicking on the same value.\n   * When false, clicking on the same value will not change the rating.\n   * @type {boolean}\n   * @memberof RatingComponent\n   */\n  @Input() canUnselect = true;\n\n  @Input() set length(length: number) {\n    this.items = Array(Math.max(length, this.MIN_LENGTH))\n      .fill(0)\n      .map((x, i) => i);\n  }\n\n  @Output() valueChange = new EventEmitter<number>();\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  protected select(index: number): void {\n    const newValue = index + 1;\n\n    // If canUnselect is false and we're clicking on the same value, don't change anything\n    if (!this.canUnselect && this.value === newValue) {\n      return;\n    }\n\n    this.value = this.value === newValue ? 0 : newValue;\n    this.valueChange.emit(this.value);\n  }\n\n  protected onHover(index: number): void {\n    this.hoverIndex = index + 1;\n  }\n}\n","<div class=\"rating\" (mouseleave)=\"onHover(-1)\" [attr.aria-label]=\"ariaLabel\" [attr.aria-required]=\"ariaRequired\">\n  <ng-container *ngIf=\"theme === 'block'; else stars\">\n    <div\n      class=\"rating-item\"\n      [attr.theme]=\"applicationTheme\"\n      *ngFor=\"let item of items\"\n      tabindex=\"0\"\n      (click)=\"select(item)\"\n      (keydown.enter)=\"select(item)\"\n      (mouseenter)=\"onHover(item)\"\n      [ngClass]=\"{ 'rating-item-selected': item < value, 'rating-item-hover': item < hoverIndex }\"\n      [ngStyle]=\"{ 'width.px': barWidth }\"\n    ></div>\n  </ng-container>\n\n  <ng-template #stars>\n    <div class=\"star-container\" [attr.theme]=\"applicationTheme\">\n      <div\n        #star\n        class=\"star\"\n        tabindex=\"0\"\n        [tabIndex]=\"0\"\n        (mouseenter)=\"onHover(item)\"\n        (mouseleave)=\"onHover(-1)\"\n        [ngClass]=\"{\n          filled: value > i,\n          hover: item < hoverIndex && (value ? item >= value : true),\n          disabled,\n          'filled-half': i + 1 | halfStar: value,\n        }\"\n        *ngFor=\"let item of items; index as i\"\n        (click)=\"select(item); star.blur()\"\n        (keydown.enter)=\"select(item); star.blur()\"\n      ></div>\n    </div>\n  </ng-template>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { RatingComponent } from './rating.component';\nimport { HalfStarPipe } from './half-star.pipe';\nimport { MatInputModule } from '@angular/material/input';\n\n@NgModule({\n  declarations: [RatingComponent, HalfStarPipe],\n  imports: [CommonModule, MatInputModule],\n  exports: [RatingComponent],\n})\nexport class RatingComponentModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i2.HalfStarPipe"],"mappings":";;;;;;MAMa,YAAY,CAAA;AACvB;;;;;;AAMG;IACH,SAAS,CAAC,KAAa,EAAE,KAAa,EAAA;AACpC,QAAA,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,KAAK,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC;IAC/D;+GAVW,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA,CAAA;6GAAZ,YAAY,EAAA,YAAA,EAAA,KAAA,EAAA,IAAA,EAAA,UAAA,EAAA,CAAA,CAAA;;4FAAZ,YAAY,EAAA,UAAA,EAAA,CAAA;kBAJxB,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,UAAU;AAChB,oBAAA,UAAU,EAAE,KAAK;AAClB,iBAAA;;;MCOY,eAAe,CAAA;IAmE1B,IAAa,MAAM,CAAC,MAAc,EAAA;AAChC,QAAA,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,MAAM,EAAE,IAAI,CAAC,UAAU,CAAC;aACjD,IAAI,CAAC,CAAC;aACN,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;IACrB;AAIA,IAAA,WAAA,CAC6E,eAAiC,EAAA;QAAjC,IAAA,CAAA,eAAe,GAAf,eAAe;QA3E3E,IAAA,CAAA,UAAU,GAAG,CAAC;QACd,IAAA,CAAA,cAAc,GAAG,CAAC;QACzB,IAAA,CAAA,KAAK,GAAa,EAAE;AAG9B;;;;;;AAMG;QACM,IAAA,CAAA,gBAAgB,GAAqB,OAAO;AASrD;;;;AAIG;QACM,IAAA,CAAA,KAAK,GAAyB,OAAO;AAE9C;;;;AAIG;QACM,IAAA,CAAA,QAAQ,GAAG,KAAK;AAUzB;;;;;AAKG;QACM,IAAA,CAAA,YAAY,GAAG,KAAK;AAE7B;;;;AAIG;QACM,IAAA,CAAA,QAAQ,GAAG,EAAE;AAEtB;;;;;AAKG;QACM,IAAA,CAAA,WAAW,GAAG,IAAI;AAQjB,QAAA,IAAA,CAAA,WAAW,GAAG,IAAI,YAAY,EAAU;QAKhD,IAAI,eAAe,EAAE;AACnB,YAAA,IAAI,CAAC,gBAAgB,GAAG,eAAe;QACzC;AACA,QAAA,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,cAAc;IACnC;AAEU,IAAA,MAAM,CAAC,KAAa,EAAA;AAC5B,QAAA,MAAM,QAAQ,GAAG,KAAK,GAAG,CAAC;;QAG1B,IAAI,CAAC,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,KAAK,KAAK,QAAQ,EAAE;YAChD;QACF;AAEA,QAAA,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,KAAK,QAAQ,GAAG,CAAC,GAAG,QAAQ;QACnD,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;IACnC;AAEU,IAAA,OAAO,CAAC,KAAa,EAAA;AAC7B,QAAA,IAAI,CAAC,UAAU,GAAG,KAAK,GAAG,CAAC;IAC7B;AAlGW,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,eAAe,kBA4EJ,oCAAoC,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AA5E/C,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,eAAe,iVCZ5B,oxCAqCA,EAAA,MAAA,EAAA,CAAA,+5LAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,cAAA,EAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAAA,YAAA,EAAA,IAAA,EAAA,UAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FDzBa,eAAe,EAAA,UAAA,EAAA,CAAA;kBAP3B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,WAAW,EAAA,eAAA,EAGJ,uBAAuB,CAAC,MAAM,cACnC,KAAK,EAAA,QAAA,EAAA,oxCAAA,EAAA,MAAA,EAAA,CAAA,+5LAAA,CAAA,EAAA;;0BA8Ed;;0BAAY,MAAM;2BAAC,oCAAoC;yCA/DjD,gBAAgB,EAAA,CAAA;sBAAxB;gBAOQ,KAAK,EAAA,CAAA;sBAAb;gBAOQ,KAAK,EAAA,CAAA;sBAAb;gBAOQ,QAAQ,EAAA,CAAA;sBAAhB;gBAQQ,SAAS,EAAA,CAAA;sBAAjB;gBAQQ,YAAY,EAAA,CAAA;sBAApB;gBAOQ,QAAQ,EAAA,CAAA;sBAAhB;gBAQQ,WAAW,EAAA,CAAA;sBAAnB;gBAEY,MAAM,EAAA,CAAA;sBAAlB;gBAMS,WAAW,EAAA,CAAA;sBAApB;;;ME1EU,qBAAqB,CAAA;+GAArB,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;gHAArB,qBAAqB,EAAA,YAAA,EAAA,CAJjB,eAAe,EAAE,YAAY,aAClC,YAAY,EAAE,cAAc,CAAA,EAAA,OAAA,EAAA,CAC5B,eAAe,CAAA,EAAA,CAAA,CAAA;gHAEd,qBAAqB,EAAA,OAAA,EAAA,CAHtB,YAAY,EAAE,cAAc,CAAA,EAAA,CAAA,CAAA;;4FAG3B,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBALjC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,YAAY,EAAE,CAAC,eAAe,EAAE,YAAY,CAAC;AAC7C,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,cAAc,CAAC;oBACvC,OAAO,EAAE,CAAC,eAAe,CAAC;AAC3B,iBAAA;;;ACVD;;AAEG;;;;"}

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

@@ -51,13 +51,13 @@ class ScaleTableComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: ScaleTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: ScaleTableComponent, isStandalone: true, selector: "ui-scale-table", inputs: { applicationTheme: { classPropertyName: "applicationTheme", publicName: "applicationTheme", isSignal: true, isRequired: false, transformFunction: null }, scaleItems: { classPropertyName: "scaleItems", publicName: "scaleItems", isSignal: true, isRequired: true, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: true, transformFunction: null }, hideBetterExperience: { classPropertyName: "hideBetterExperience", publicName: "hideBetterExperience", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { scaleItems: "scaleItemsChange", hideBetterExperience: "hideBetterExperienceChange", scaleItemChange: "scaleItemChange" }, host: { properties: { "style.--scale-count": "scaleCount()" } }, ngImport: i0, template: "<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 tabindex=\"0\" role=\"heading\" [attr.aria-label]=\"label + ' as ' + ($index + 1)\" class=\"scale-size\">\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", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host{font:\"ModernGothic\",serif;position:relative;display:flex;overflow:auto;align-items:start}.scale-table{display:flex;flex-direction:column;width:100%}.scale-table-header{display:flex;flex-direction:row;align-items:center;justify-content:end;min-width:fit-content;position:sticky;top:0;border-bottom:1px solid #D3D3D3;background-color:#fff;align-items:baseline;box-shadow:0 4px 16px #24242414;padding-inline-start:16px;padding-inline-end:8px;padding-top:4px}.scale-table-row{display:flex;justify-content:space-between;gap:8px;align-items:center;padding-top:8px;padding-bottom:8px;padding-inline-start:16px;padding-inline-end:8px;min-width:fit-content;border-bottom:1px solid #D3D3D3}.scale-size{width:80px;text-align:center;flex-shrink:0;color:#242424;font-size:12px;font-family:ModernGothic;align-self:stretch;padding:4px}ui-scale{width:calc(var(--scale-count, 5) * 80px);flex-shrink:0}.scale-text{font-weight:400;font-size:16px;line-height:24px;letter-spacing:0%;vertical-align:middle;text-align:justify;font-family:ModernGothic;max-width:800px}.border-bottom{border-bottom:1px solid #D3D3D3}.better-experience{display:none;flex-direction:row;align-items:center;gap:8px;border-radius:10px;padding:12px 16px;background:#d9e8ff;justify-content:center}.better-experience p{flex:1 1 0%;font-size:14px;line-height:22px;font-weight:400;font-size:16px;line-height:24px;letter-spacing:0%;vertical-align:middle;margin:0}.background-white{background-color:#fff}@media (max-width: 960px){.scale-table-header{padding-left:0;padding-right:0;justify-content:start}.scale-table-row{padding-left:0;padding-right:0;flex-direction:column;align-items:start}.scale-size{width:calc(100% / var(--scale-count));min-width:40px;padding:0}ui-scale{width:100%;min-width:calc(var(--scale-count) * 40px);align-self:center}}@media screen and (min-width: 1280px){.scale-size{width:104px;min-width:104px}ui-scale{min-width:calc(var(--scale-count) * 104px);align-self:center}}@media screen and (orientation: portrait) and (max-width: 560px){.better-experience{display:flex}}.hide{display:none}\n"], dependencies: [{ kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }, { kind: "ngmodule", type: ScaleComponentModule }, { kind: "component", type: i1.ScaleComponent, selector: "ui-scale", inputs: ["selectedIndex", "length", "applicationTheme", "companyColor"], outputs: ["selectedIndexChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: IconComponentModule }, { kind: "component", type: i2.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "ngmodule", type: ButtonComponentModule }, { kind: "component", type: i3.ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: ScaleTableComponent, isStandalone: true, selector: "ui-scale-table", inputs: { applicationTheme: { classPropertyName: "applicationTheme", publicName: "applicationTheme", isSignal: true, isRequired: false, transformFunction: null }, scaleItems: { classPropertyName: "scaleItems", publicName: "scaleItems", isSignal: true, isRequired: true, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: true, transformFunction: null }, hideBetterExperience: { classPropertyName: "hideBetterExperience", publicName: "hideBetterExperience", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { scaleItems: "scaleItemsChange", hideBetterExperience: "hideBetterExperienceChange", scaleItemChange: "scaleItemChange" }, host: { properties: { "style.--scale-count": "scaleCount()" } }, ngImport: i0, template: "<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", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host{font:\"ModernGothic\",serif;position:relative;display:flex;overflow:auto;align-items:start}.scale-table{display:flex;flex-direction:column;width:100%}.scale-table-header{display:flex;flex-direction:row;align-items:center;justify-content:end;min-width:fit-content;position:sticky;top:0;border-bottom:1px solid #d3d3d3;background-color:#fff;align-items:baseline;box-shadow:0 4px 16px #24242414;padding-inline-start:16px;padding-inline-end:8px;padding-top:4px}.scale-table-row{display:flex;justify-content:space-between;gap:8px;align-items:center;padding-top:8px;padding-bottom:8px;padding-inline-start:16px;padding-inline-end:8px;min-width:fit-content;border-bottom:1px solid #d3d3d3}.scale-size{width:80px;text-align:center;flex-shrink:0;color:#242424;font-size:12px;font-family:ModernGothic;align-self:stretch;padding:4px}ui-scale{width:calc(var(--scale-count, 5) * 80px);flex-shrink:0}.scale-text{font-weight:400;font-size:16px;line-height:24px;letter-spacing:0%;vertical-align:middle;text-align:justify;font-family:ModernGothic;max-width:800px}.border-bottom{border-bottom:1px solid #d3d3d3}.better-experience{display:none;flex-direction:row;align-items:center;gap:8px;border-radius:10px;padding:12px 16px;background:#d9e8ff;justify-content:center}.better-experience p{flex:1 1 0%;font-size:14px;line-height:22px;font-weight:400;font-size:16px;line-height:24px;letter-spacing:0%;vertical-align:middle;margin:0}.background-white{background-color:#fff}@media (max-width: 960px){.scale-table-header{padding-left:0;padding-right:0;justify-content:start}.scale-table-row{padding-left:0;padding-right:0;flex-direction:column;align-items:start}.scale-size{width:calc(100% / var(--scale-count));min-width:40px;padding:0}ui-scale{width:100%;min-width:calc(var(--scale-count) * 40px);align-self:center}}@media screen and (min-width: 1280px){.scale-size{width:104px;min-width:104px}ui-scale{min-width:calc(var(--scale-count) * 104px);align-self:center}}@media screen and (orientation: portrait) and (max-width: 560px){.better-experience{display:flex}}.hide{display:none}\n"], dependencies: [{ kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }, { kind: "ngmodule", type: ScaleComponentModule }, { kind: "component", type: i1.ScaleComponent, selector: "ui-scale", inputs: ["selectedIndex", "length", "applicationTheme", "companyColor"], outputs: ["selectedIndexChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: IconComponentModule }, { kind: "component", type: i2.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "ngmodule", type: ButtonComponentModule }, { kind: "component", type: i3.ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: ScaleTableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ui-scale-table', changeDetection: ChangeDetectionStrategy.OnPush, imports: [UiTranslatePipe, ScaleComponentModule, AsyncPipe, IconComponentModule, ButtonComponentModule], host: {
                         '[style.--scale-count]': 'scaleCount()',
-                    }, template: "<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 tabindex=\"0\" role=\"heading\" [attr.aria-label]=\"label + ' as ' + ($index + 1)\" class=\"scale-size\">\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", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host{font:\"ModernGothic\",serif;position:relative;display:flex;overflow:auto;align-items:start}.scale-table{display:flex;flex-direction:column;width:100%}.scale-table-header{display:flex;flex-direction:row;align-items:center;justify-content:end;min-width:fit-content;position:sticky;top:0;border-bottom:1px solid #D3D3D3;background-color:#fff;align-items:baseline;box-shadow:0 4px 16px #24242414;padding-inline-start:16px;padding-inline-end:8px;padding-top:4px}.scale-table-row{display:flex;justify-content:space-between;gap:8px;align-items:center;padding-top:8px;padding-bottom:8px;padding-inline-start:16px;padding-inline-end:8px;min-width:fit-content;border-bottom:1px solid #D3D3D3}.scale-size{width:80px;text-align:center;flex-shrink:0;color:#242424;font-size:12px;font-family:ModernGothic;align-self:stretch;padding:4px}ui-scale{width:calc(var(--scale-count, 5) * 80px);flex-shrink:0}.scale-text{font-weight:400;font-size:16px;line-height:24px;letter-spacing:0%;vertical-align:middle;text-align:justify;font-family:ModernGothic;max-width:800px}.border-bottom{border-bottom:1px solid #D3D3D3}.better-experience{display:none;flex-direction:row;align-items:center;gap:8px;border-radius:10px;padding:12px 16px;background:#d9e8ff;justify-content:center}.better-experience p{flex:1 1 0%;font-size:14px;line-height:22px;font-weight:400;font-size:16px;line-height:24px;letter-spacing:0%;vertical-align:middle;margin:0}.background-white{background-color:#fff}@media (max-width: 960px){.scale-table-header{padding-left:0;padding-right:0;justify-content:start}.scale-table-row{padding-left:0;padding-right:0;flex-direction:column;align-items:start}.scale-size{width:calc(100% / var(--scale-count));min-width:40px;padding:0}ui-scale{width:100%;min-width:calc(var(--scale-count) * 40px);align-self:center}}@media screen and (min-width: 1280px){.scale-size{width:104px;min-width:104px}ui-scale{min-width:calc(var(--scale-count) * 104px);align-self:center}}@media screen and (orientation: portrait) and (max-width: 560px){.better-experience{display:flex}}.hide{display:none}\n"] }]
+                    }, template: "<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", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host{font:\"ModernGothic\",serif;position:relative;display:flex;overflow:auto;align-items:start}.scale-table{display:flex;flex-direction:column;width:100%}.scale-table-header{display:flex;flex-direction:row;align-items:center;justify-content:end;min-width:fit-content;position:sticky;top:0;border-bottom:1px solid #d3d3d3;background-color:#fff;align-items:baseline;box-shadow:0 4px 16px #24242414;padding-inline-start:16px;padding-inline-end:8px;padding-top:4px}.scale-table-row{display:flex;justify-content:space-between;gap:8px;align-items:center;padding-top:8px;padding-bottom:8px;padding-inline-start:16px;padding-inline-end:8px;min-width:fit-content;border-bottom:1px solid #d3d3d3}.scale-size{width:80px;text-align:center;flex-shrink:0;color:#242424;font-size:12px;font-family:ModernGothic;align-self:stretch;padding:4px}ui-scale{width:calc(var(--scale-count, 5) * 80px);flex-shrink:0}.scale-text{font-weight:400;font-size:16px;line-height:24px;letter-spacing:0%;vertical-align:middle;text-align:justify;font-family:ModernGothic;max-width:800px}.border-bottom{border-bottom:1px solid #d3d3d3}.better-experience{display:none;flex-direction:row;align-items:center;gap:8px;border-radius:10px;padding:12px 16px;background:#d9e8ff;justify-content:center}.better-experience p{flex:1 1 0%;font-size:14px;line-height:22px;font-weight:400;font-size:16px;line-height:24px;letter-spacing:0%;vertical-align:middle;margin:0}.background-white{background-color:#fff}@media (max-width: 960px){.scale-table-header{padding-left:0;padding-right:0;justify-content:start}.scale-table-row{padding-left:0;padding-right:0;flex-direction:column;align-items:start}.scale-size{width:calc(100% / var(--scale-count));min-width:40px;padding:0}ui-scale{width:100%;min-width:calc(var(--scale-count) * 40px);align-self:center}}@media screen and (min-width: 1280px){.scale-size{width:104px;min-width:104px}ui-scale{min-width:calc(var(--scale-count) * 104px);align-self:center}}@media screen and (orientation: portrait) and (max-width: 560px){.better-experience{display:flex}}.hide{display:none}\n"] }]
         }] });
 
 /**