1 files changed, 36 insertions, 0 deletions
diff --git a/vid-webpack-master/src/app/shared/components/customModal/components/modalCloseButton/modal-close-button.component.ts b/vid-webpack-master/src/app/shared/components/customModal/components/modalCloseButton/modal-close-button.component.ts
new file mode 100644
index 000000000..a3e741a32
--- /dev/null
+++ b/vid-webpack-master/src/app/shared/components/customModal/components/modalCloseButton/modal-close-button.component.ts
@@ -0,0 +1,36 @@
+import {Component, ComponentRef, Input} from "@angular/core";
+import {ModalComponent} from "../../modal.component";
+import {CustomButtonComponent} from "../../../customButton/custom-button.component";
+import {RippleAnimationAction} from "../../directives/ripple-click.animation.directive";
+
+
+@Component({
+  selector: "sdc-modal-close-button",
+  template: `
+    <div class="sdc-modal__close-button"
+         customRippleClickAnimation
+         [ngClass]="disabled ? 'disabled' : ''"
+         [rippleOnAction]="!disabled && rippleAnimationAction"
+         [attr.data-tests-id]="testId"
+         (click)="!disabled && closeModal('close')"
+    >
+      <svg-icon name="close" [mode]="disabled? 'secondary' : 'info'" size="small"></svg-icon>
+    </div>
+  `
+})
+export class ModalCloseButtonComponent extends CustomButtonComponent {
+
+  @Input() testId: string;
+  @Input() disabled: boolean;
+  @Input() modalInstanceRef: ComponentRef<ModalComponent>;
+
+  public rippleAnimationAction: RippleAnimationAction = RippleAnimationAction.MOUSE_ENTER;
+
+  constructor() {
+    super();
+  }
+
+  public closeModal = (btnName: string): void => {
+    this.modalInstanceRef.instance.closeModal(btnName);
+  }
+}