fix(kit): CheckboxLabeled/RadioLabeled fix changing in readonly mode

Co-authored-by: Alexandr Shakirov <al.a.shakirov@tinkoff.ru>
taiga-family · Oct 10, 2024 · bd6d1e2 · bd6d1e2
1 parent f6d49c1
commit bd6d1e2
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 2 deletions.
diff --git a/projects/kit/components/checkbox-labeled/checkbox-labeled.component.ts b/projects/kit/components/checkbox-labeled/checkbox-labeled.component.ts
@@ -78,6 +78,12 @@ export class TuiCheckboxLabeledComponent
         this.updateFocused(focused);
     }
 
+    stopReadonlyChanging(event: Event): void {
+        if (this.readOnly) {
+            event.preventDefault();
+        }
+    }
+
     /** @deprecated use 'value' setter */
     onModelChange(value: boolean): void {
         this.value = value;

diff --git a/projects/kit/components/checkbox-labeled/checkbox-labeled.template.html b/projects/kit/components/checkbox-labeled/checkbox-labeled.template.html
@@ -1,4 +1,7 @@
-<label class="t-wrapper">
+<label
+    class="t-wrapper"
+    (click)="stopReadonlyChanging($event)"
+>
     <tui-checkbox
         [disabled]="computedDisabled"
         [focusable]="focusable"

diff --git a/projects/kit/components/radio-labeled/radio-labeled.component.ts b/projects/kit/components/radio-labeled/radio-labeled.component.ts
@@ -85,6 +85,12 @@ export class TuiRadioLabeledComponent<T>
         return this.disabled || this.pseudoDisabled;
     }
 
+    stopReadonlyChanging(event: Event): void {
+        if (this.readOnly) {
+            event.preventDefault();
+        }
+    }
+
     onFocused(focused: boolean): void {
         this.updateFocused(focused);
     }

diff --git a/projects/kit/components/radio-labeled/radio-labeled.template.html b/projects/kit/components/radio-labeled/radio-labeled.template.html
@@ -1,4 +1,7 @@
-<label class="t-wrapper">
+<label
+    class="t-wrapper"
+    (click)="stopReadonlyChanging($event)"
+>
     <tui-radio
         [focusable]="focusable"
         [identityMatcher]="identityMatcher"