vc-create-dashboard 3.0.67 → 3.0.69

package/src/lib/ui-kit/smiley-dialog/smiley-dialog.component.less

@@ -1,442 +0,0 @@
-.smiley {
-  &-popup {
-    background: #d93b41;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100vw;
-    height: 100vh;
-    z-index: 9;
-
-    &:before {
-      content: '';
-      position: absolute;
-      z-index: 0;
-      background: #fff;
-      top: 0;
-      right: 0;
-      bottom: 0;
-      left: 0;
-      transition-delay: 1s;
-      border-top-right-radius: 0;
-      transition: all 0.3s ease-in-out;
-    }
-
-    &.active {
-      &:before {
-        border-top-right-radius: 180px;
-      }
-    }
-
-    .close {
-      color: #fff;
-      font-size: 22px;
-      position: absolute;
-      top: 13px;
-      right: 21px;
-      z-index: 10;
-      background: none;
-      border: none;
-      padding: 0;
-      cursor: pointer;
-    }
-  }
-
-  &-container {
-    width: 550px;
-    text-align: center;
-    position: relative;
-    z-index: 10;
-
-    .smiley {
-      background: transparent;
-      border-radius: 0;
-      box-shadow: none;
-      padding: 0;
-      display: block;
-      width: 500px;
-      height: 251px;
-      overflow: hidden;
-      position: relative;
-      -webkit-animation: slide-fwd-center 0.45s cubic-bezier(0.68, -0.55, 0.265, 1.55) both;
-      animation: slide-fwd-center 0.45s cubic-bezier(0.68, -0.55, 0.265, 1.55) both;
-      margin: 0 auto 25px;
-
-      &::before {
-        position: absolute;
-        background: #ffedc5;
-        width: 50px;
-        height: 50px;
-        content: '';
-        border-radius: 50%;
-        top: 101px;
-        right: 93px;
-      }
-
-      &::after {
-        position: absolute;
-        background: #ffbf15;
-        width: 35px;
-        height: 35px;
-        border-radius: 50%;
-        content: '';
-        top: 200px;
-        left: 92px;
-      }
-
-      &-circle {
-        background: #ffd83d;
-        border-radius: 100%;
-        padding: 25px;
-        position: relative;
-        width: 250px;
-        height: 250px;
-        margin: 0 auto;
-        box-shadow: inset -21px -14px 0 #f4c337;
-
-        &::before {
-          width: 23px;
-          height: 5px;
-          background: #ffbf15;
-          position: absolute;
-          content: '';
-          top: 116px;
-          left: -66px;
-        }
-
-        &::after {
-          width: 5px;
-          height: 23px;
-          background: #ffbf15;
-          position: absolute;
-          content: '';
-          top: 107px;
-          left: -57px;
-        }
-
-        &-inner {
-          height: 182px;
-          width: 100%;
-          margin: 0 auto;
-
-          .eyes {
-            width: 164px;
-            margin: 40px auto 0;
-            box-sizing: border-box;
-            padding: 0 5px;
-            transition: all 300ms cubic-bezier(0.645, 0.045, 0.355, 1);
-
-            &::before {
-              width: 5px;
-              height: 20px;
-              background: #ffbf15;
-              position: absolute;
-              content: '';
-              top: 0px;
-              right: -19px;
-            }
-
-            &::after {
-              width: 20px;
-              height: 5px;
-              background: #ffbf15;
-              position: absolute;
-              content: '';
-              top: 7px;
-              right: -27px;
-            }
-
-            .eye {
-              width: 40px;
-              height: 40px;
-              background: #404549;
-              float: left;
-              border-radius: 100%;
-              overflow: hidden;
-              position: relative;
-
-              &::before {
-                position: absolute;
-                width: 10px;
-                height: 10px;
-                content: '';
-                background: #ffe9b0;
-                border-radius: 50%;
-                top: 7px;
-                left: 1px;
-              }
-
-              &::after {
-                display: block;
-                content: '';
-                position: absolute;
-                width: 0;
-                height: 0;
-                background: #fed800;
-                transform: rotate(0deg);
-                top: -15px;
-                left: 5px;
-                transition: all 300ms cubic-bezier(0.645, 0.045, 0.355, 1);
-              }
-
-              &:nth-of-type(2) {
-                float: right;
-              }
-            }
-          }
-
-          .mouth {
-            border-top-left-radius: 100px;
-            border-top-right-radius: 100px;
-            border-bottom-left-radius: 100px;
-            border-bottom-right-radius: 100px;
-            height: 75px;
-            width: 150px;
-            margin: 0 auto;
-            box-sizing: border-box;
-            position: absolute;
-            left: 0;
-            right: 0;
-            background: #404549;
-            transition: all 300ms cubic-bezier(0.645, 0.045, 0.355, 1);
-
-            &::before {
-              width: 95px;
-              height: 95px;
-              position: absolute;
-              opacity: 0;
-              bottom: -507px;
-              left: -6px;
-              background: #ffd83d;
-              content: '';
-              border-radius: 86px;
-              transition: all 300ms cubic-bezier(0.645, 0.045, 0.355, 1);
-            }
-          }
-        }
-
-        &.active {
-          .eyes {
-            .eye {
-              height: 40px;
-              margin-top: 0;
-              animation: wink 3s infinite;
-            }
-          }
-
-          .mouth {
-            animation: move-mouth-down 0.3s;
-            animation-delay: 0.3s;
-            animation-fill-mode: forwards;
-          }
-        }
-
-        &.deactive {
-          .eyes {
-            .eye {
-              animation: wink2 3s infinite;
-            }
-          }
-
-          .smiley-circle-inner {
-            animation: move-angry-head 0.6s;
-            animation-delay: 0.3s;
-            animation-fill-mode: forwards;
-
-            .mouth {
-              width: 95px;
-              height: 51px;
-              border-top-left-radius: 100px;
-              border-top-right-radius: 100px;
-              border-bottom-left-radius: 0;
-              border-bottom-right-radius: 0;
-              top: 60px;
-
-              &::before {
-                background: #ffd83d;
-                content: '';
-                bottom: -55px;
-                left: 0;
-                opacity: 1;
-                transition: all 300ms cubic-bezier(0.645, 0.045, 0.355, 1);
-              }
-            }
-          }
-        }
-      }
-    }
-
-    h3 {
-      font-size: 26px;
-      color: #161b2f;
-      font-weight: 400;
-      margin: 0 0 40px;
-    }
-
-    .successSmilyButton {
-      display: flex;
-      align-items: center;
-
-      button {
-        background: #fff;
-        border: 1px solid #1e5dd3;
-        color: #1e5dd3;
-        font-size: 14px;
-        font-weight: 500;
-        margin: 0 5px;
-        border-radius: 3px;
-        padding: 8px;
-        width: 280px;
-        height: 54px;
-        cursor: pointer;
-        text-transform: uppercase;
-
-        &.blue-btn {
-          background: #1e5dd3;
-          color: #fff;
-        }
-      }
-    }
-  }
-}
-
-@-webkit-keyframes slide-fwd-center {
-  0% {
-    -webkit-transform: scale(0);
-    transform: scale(0);
-  }
-
-  100% {
-    -webkit-transform: scale(1);
-    transform: scale(1);
-  }
-}
-
-@keyframes slide-fwd-center {
-  0% {
-    -webkit-transform: scale(0);
-    transform: scale(0);
-  }
-
-  100% {
-    -webkit-transform: scale(1);
-    transform: scale(1);
-  }
-}
-
-@keyframes move-mouth-down {
-  0% {
-    border-top-left-radius: 100px;
-    border-top-right-radius: 100px;
-    border-bottom-left-radius: 100px;
-    border-bottom-right-radius: 100px;
-    height: 10%;
-    width: 40%;
-    bottom: 25%;
-    margin: 0 auto;
-    box-sizing: border-box;
-    position: absolute;
-    bottom: 18%;
-    left: 0;
-    right: 0;
-    background: #404549;
-    transition: all 300ms cubic-bezier(0.645, 0.045, 0.355, 1);
-  }
-
-  100% {
-    width: 60%;
-    height: 30%;
-    border-top-left-radius: 0;
-    border-top-right-radius: 0;
-    border-bottom-left-radius: 100px;
-    border-bottom-right-radius: 100px;
-    box-sizing: border-box;
-    position: absolute;
-    bottom: 18%;
-    background: #404549;
-    transition: all 300ms cubic-bezier(0.645, 0.045, 0.355, 1);
-  }
-}
-
-@keyframes wink {
-  0% {
-    height: 40px;
-    margin-top: 0;
-  }
-
-  10% {
-    height: 40px;
-    margin-top: 0;
-  }
-
-  15% {
-    height: 4px;
-    margin-top: 18px;
-  }
-
-  20% {
-    height: 40px;
-    margin-top: 0;
-  }
-
-  100% {
-    height: 40px;
-    margin-top: 0;
-  }
-}
-
-@keyframes wink2 {
-  0% {
-    height: 40px;
-    margin-top: 0;
-  }
-
-  10% {
-    height: 40px;
-    margin-top: 0;
-  }
-
-  15% {
-    height: 4px;
-    margin-top: 18px;
-  }
-
-  20% {
-    height: 40px;
-    margin-top: 0;
-  }
-
-  100% {
-    height: 40px;
-    margin-top: 0;
-  }
-}
-
-@keyframes move-angry-head {
-  0% {
-    transform: translateX(0%);
-  }
-
-  20% {
-    transform: translateX(-20%);
-  }
-
-  40% {
-    transform: translateX(15%);
-  }
-
-  60% {
-    transform: translateX(-10%);
-  }
-
-  80% {
-    transform: translateX(5%);
-  }
-
-  100% {
-    transform: translateX(0%);
-  }
-}

package/src/lib/ui-kit/smiley-dialog/smiley-dialog.component.ts

@@ -1,40 +0,0 @@
-import { Component, Input, OnInit, EventEmitter, Output, HostListener } from '@angular/core';
-
-@Component({
-  selector: 'app-smiley-dialog',
-  templateUrl: './smiley-dialog.component.html',
-  styleUrls: ['./smiley-dialog.component.less'],
-})
-export class SmileyDialogComponent implements OnInit {
-  @Input() message!: string;
-  @Input() autoClose!: boolean;
-  @Input() actionButtons!: any[];
-  @Output() action: EventEmitter<string> = new EventEmitter();
-  @Output() closeSmiley: EventEmitter<any> = new EventEmitter();
-
-  @HostListener('window:keyup', ['$event']) handleKeyboardEvent(event: KeyboardEvent) {
-    if (event.key === 'Escape') {
-      this.smileyCloseEmitter({});
-    }
-  }
-  constructor() {}
-
-  ngOnInit(): void {
-    if (this.autoClose) {
-      setTimeout(() => {
-        this.close();
-      }, 8000);
-    }
-  }
-  close() {
-    this.closeSmiley.emit();
-  }
-
-  actionEmitter(event: any) {
-    this.action.emit(event?.id);
-  }
-
-  smileyCloseEmitter(event: any) {
-    this.closeSmiley.emit();
-  }
-}

package/src/lib/ui-kit/smiley-dialog/smiley-dialog.module.ts

@@ -1,11 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { SmileyDialogComponent } from './smiley-dialog.component';
-
-@NgModule({
-  declarations: [SmileyDialogComponent],
-  imports: [CommonModule],
-
-  exports: [SmileyDialogComponent],
-})
-export class SmileyDialogModule {}

package/src/lib/ui-kit/snack-bar/snack-bar/snack-bar.component.html

@@ -1,10 +0,0 @@
-<div class="snackbar" *ngIf="show">
-  <div class="snackbar-inner">
-    <div class="snackbarText">
-      <!-- &#xe914; -->
-      <i class="icons" [class]="type" [innerHTML]="icon"></i> 
-      <span [innerHTML]="message">{{ message }}</span>
-    </div>
-    <button (click)="close()">[ <span>Close</span> ]</button>
-  </div>
-</div>

package/src/lib/ui-kit/snack-bar/snack-bar/snack-bar.component.less

@@ -1,110 +0,0 @@
-@import url('https://cdn.v-comply.com/design-system/css/icons/icons.css');
-.snackbar {
-  position: fixed;
-  top: 20px;
-  left: 0;
-  right: 0;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 20;
-  pointer-events: none;
-  -webkit-animation: slide-top 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
-  animation: slide-top 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
-  &.white {
-    background-color: #ffffff;
-    color: #000000;
-    z-index: 20;
-    button {
-      color: #f6882f;
-      font-size: 11px;
-      font-weight: 400;
-      pointer-events: all;
-    }
-  }
-
-  .snackbar-inner {
-    display: flex;
-    max-width: 500px;
-    min-width: 450px;
-    align-items: center;
-    justify-content: space-between;
-    padding: 10px;
-    background: #ffffff;
-    border-radius: 3px;
-    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
-    min-height: 55px;
-    pointer-events: auto;
-
-    .snackbarText {
-      color: #161b2f;
-      font-size: 13px;
-      display: flex;
-      align-items: center;
-      width: calc(100% - 70px);
-
-      i {
-        background: #f1f1f1;
-        color: #f0b819;
-        border-radius: 50px;
-        font-size: 16px;
-        width: 30px;
-        height: 30px;
-        text-align: center;
-        line-height: 28px;
-        margin-right: 10px;
-        min-width: 30px;
-        &.success {
-          color: #34aa44;
-        }
-        &.warning {
-          color: #f0b819;
-        }
-        &.info {
-          color: #1e5dd3;
-        }
-        &.alert {
-          color: #d93b41;
-        }
-        &.error {
-          color: #d93b41;
-        }
-      }
-    }
-
-    button {
-      background: transparent;
-      border: none;
-      font-size: 11px;
-      padding: 0;
-      position: relative;
-      color: #747576;
-      width: 65px;
-      text-align: right;
-      cursor: pointer;
-      text-transform: uppercase;
-
-      span {
-        color: #1E5DD3;
-        font-weight: 500;
-      }
-
-      &:focus {
-        outline: none;
-      }
-    }
-  }
-}
-@keyframes slide-top {
-  0% {
-    -webkit-transform: translateY(-100%);
-    transform: translateY(-100%);
-    opacity: 0;
-  }
-
-  100% {
-    -webkit-transform: translateY(0);
-    transform: translateY(0);
-    opacity: 1;
-  }
-}

package/src/lib/ui-kit/snack-bar/snack-bar/snack-bar.component.ts

@@ -1,42 +0,0 @@
-import { Component, OnDestroy, OnInit } from '@angular/core';
-import { Subscription } from 'rxjs/internal/Subscription';
-import { SnackBarService } from '../snack-bar.service';
-
-@Component({
-  selector: 'app-snack-bar',
-  templateUrl: './snack-bar.component.html',
-  styleUrls: ['./snack-bar.component.less'],
-})
-export class SnackBarComponent implements OnInit {
-  show = false;
-  message: string = '--';
-  icon: string = '';
-  type='alert'
-  icons:any = {
-    success:'',
-    warning:'',
-    info:'',
-    alert:'',
-    error:''
-  }
-  constructor(private snackbarService: SnackBarService) {}
-
-  ngOnInit(): void {
-    this.snackbarService.snackbarSubject.subscribe((state) => {
-      if(state.icon && Object.keys(this.icons).includes(state?.icon)){
-        this.icon = this.icons[state.icon];
-        this.type = state?.icon;
-      }
-      this.message = state.message;
-      this.show = state.show;
-      setTimeout(() => {
-        this.show = false;
-      }, 3000);
-    });
-  }
-  close() {
-    this.show = false;
-  }
-  ngOnDestroy() {
-  }
-}

package/src/lib/ui-kit/snack-bar/snack-bar.module.ts

@@ -1,10 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { SnackBarComponent } from './snack-bar/snack-bar.component';
-
-@NgModule({
-  declarations: [SnackBarComponent],
-  imports: [CommonModule],
-  exports: [SnackBarComponent],
-})
-export class SnackBarModule {}

package/src/lib/ui-kit/snack-bar/snack-bar.service.ts

@@ -1,18 +0,0 @@
-import { Injectable } from '@angular/core';
-import { Subject } from 'rxjs';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class SnackBarService {
-  snackbarSubject = new Subject<any>();
-  constructor() {}
-
-  show(message: string, icon?: string) {
-    this.snackbarSubject.next({
-      show: true,
-      message,
-      icon,
-    });
-  }
-}