Merge pull request #754 from dxc-technology/jialecl-radioGroup

error="" behaviour + readOnly cursor

Author: mawelCaballero

projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/radio-preview/radio-preview.component.html

@@ -32,7 +32,12 @@
       <dxc-radio-group
         [options]="options"
         label="readOnly radio"
-        error="error message"
+        error=""
+      ></dxc-radio-group>
+      <dxc-radio-group
+        [options]="options"
+        label="readOnly radio"
+        error="Error message"
       ></dxc-radio-group>
     </tbuilder-component-mode>
     <tbuilder-component-mode text="Default">

projects/dxc-ngx-cdk/src/lib/dxc-radio-group/dxc-radio-group.component.html

@@ -17,4 +17,4 @@
   </ng-container>
 </div>
 <input #inputRef class="valueInput" [name]="name" [value]="value" readOnly aria-hidden="true" />
-<span *ngIf="error" class="errorMessage">{{ error }}</span>
+<span *ngIf="error || error===''" class="errorMessage">{{ error }}</span>

projects/dxc-ngx-cdk/src/lib/dxc-radio-group/dxc-radio-group.component.ts

@@ -290,6 +290,7 @@ export class DxcRadioGroupComponent implements OnInit {
         font-weight: var(--radioGroup-errorMessageFontWeight);
         line-height: var(--radioGroup-errorMessageLineHeight);
         font-family: var(--radioGroup-labelFontFamily);
+        height: var(--radioGroup-errorMessageLineHeight);
       }
       .valueInput {
         display: none;

projects/dxc-ngx-cdk/src/lib/dxc-radio-group/dxc-radio/dxc-radio.component.ts

@@ -137,7 +137,7 @@ export class DxcRadioGroupItemComponent implements OnInit {
     return css`
       display: inline-flex;
       align-items: center;
-      ${inputs.disabled ? "pointer-events: none" : "cursor: pointer"};
+      ${inputs.disabled ? "pointer-events: none" : inputs.readOnlyState ? "cursor: default" : "cursor: pointer"};
       width: fit-content;
       .radioInputContainer {
         display: flex;