From 6999a1957cb3a2bff0243d456258cd7165a114fc Mon Sep 17 00:00:00 2001
From: Ilya Yaroshevich <drogenixx@gmail.com>
Date: Tue, 21 Nov 2023 12:40:18 +0300
Subject: [PATCH] fix(kit): `.t-mark` in `Radio` disappears after toggling
 `Expand` (#6037)

---
 projects/kit/components/radio/radio.component.ts  | 5 +----
 projects/kit/components/radio/radio.style.less    | 6 ++++++
 projects/kit/components/radio/radio.template.html | 3 +--
 3 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/projects/kit/components/radio/radio.component.ts b/projects/kit/components/radio/radio.component.ts
index 27cc2896d8f3..e2a2c6c0f492 100644
--- a/projects/kit/components/radio/radio.component.ts
+++ b/projects/kit/components/radio/radio.component.ts
@@ -1,4 +1,3 @@
-import {AnimationOptions} from '@angular/animations';
 import {
     ChangeDetectionStrategy,
     ChangeDetectorRef,
@@ -22,7 +21,7 @@ import {
     tuiIsNativeFocused,
     TuiNativeFocusableElement,
 } from '@taiga-ui/cdk';
-import {TUI_ANIMATION_OPTIONS, tuiScaleIn, TuiSizeL} from '@taiga-ui/core';
+import {TuiSizeL} from '@taiga-ui/core';
 import {TuiRadioGroupComponent} from '@taiga-ui/kit/components/radio-group';
 
 import {TUI_RADIO_OPTIONS, TuiRadioOptions} from './radio.options';
@@ -36,7 +35,6 @@ import {TUI_RADIO_OPTIONS, TuiRadioOptions} from './radio.options';
         tuiAsFocusableItemAccessor(TuiRadioComponent),
         tuiAsControl(TuiRadioComponent),
     ],
-    animations: [tuiScaleIn],
 })
 export class TuiRadioComponent<T>
     extends AbstractTuiNullableControl<T>
@@ -67,7 +65,6 @@ export class TuiRadioComponent<T>
         @Inject(NgControl)
         control: NgControl | null,
         @Inject(ChangeDetectorRef) cdr: ChangeDetectorRef,
-        @Inject(TUI_ANIMATION_OPTIONS) readonly animation: AnimationOptions,
         @Inject(TUI_RADIO_OPTIONS) private readonly options: TuiRadioOptions,
         @Optional()
         @Inject(TuiRadioGroupComponent)
diff --git a/projects/kit/components/radio/radio.style.less b/projects/kit/components/radio/radio.style.less
index 676bce3915cc..e538eb099a94 100644
--- a/projects/kit/components/radio/radio.style.less
+++ b/projects/kit/components/radio/radio.style.less
@@ -28,9 +28,15 @@
 }
 
 .t-mark {
+    .transition(transform);
     position: absolute;
     background-color: currentColor;
     border-radius: 100%;
+    transform: scale(0);
+
+    &_visible {
+        transform: scale(1);
+    }
 
     :host[data-size='m'] & {
         margin: 0.25rem;
diff --git a/projects/kit/components/radio/radio.template.html b/projects/kit/components/radio/radio.template.html
index 97b6a90c09af..21fff98b3b52 100644
--- a/projects/kit/components/radio/radio.template.html
+++ b/projects/kit/components/radio/radio.template.html
@@ -8,9 +8,8 @@
     [invalid]="computedInvalid"
 >
     <div
-        *ngIf="checked"
         class="t-mark"
-        [@tuiScaleIn]="animation"
+        [class.t-mark_visible]="checked"
     ></div>
     <input
         #focusableElement