diff --git a/cypress/support/component.ts b/cypress/support/component.ts
index 782ebcf1..4bae18ca 100644
--- a/cypress/support/component.ts
+++ b/cypress/support/component.ts
@@ -17,7 +17,6 @@
 // cypress/support/e2e.js
 import '@cypress/code-coverage/support';
 import './commands';
-import '../../scss/main.scss';
 import './style.css';
 
 // Alternatively you can use CommonJS syntax:
diff --git a/package.json b/package.json
index 665f6812..e819a2a6 100644
--- a/package.json
+++ b/package.json
@@ -83,7 +83,12 @@
     "./package.json": "./package.json",
     "./addons/use-notification-center": {
       "types": "./addons/use-notification-center/index.d.ts",
-      "import": "./addons/use-notification-center/index.esm.mjs",
+      "import": "./addons/use-notification-center/index.mjs",
+      "require": "./addons/use-notification-center/index.js"
+    },
+    "./notification-center": {
+      "types": "./addons/use-notification-center/index.d.ts",
+      "import": "./addons/use-notification-center/index.mjs",
       "require": "./addons/use-notification-center/index.js"
     }
   }
diff --git a/scss/_closeButton.scss b/scss/_closeButton.scss
deleted file mode 100644
index ba8d89f5..00000000
--- a/scss/_closeButton.scss
+++ /dev/null
@@ -1,27 +0,0 @@
-.#{$rt-namespace}__close-button {
-  color: #fff;
-  background: transparent;
-  outline: none;
-  border: none;
-  padding: 0;
-  cursor: pointer;
-  opacity: 0.7;
-  transition: 0.3s ease;
-  align-self: flex-start;
-  z-index: 1;
-  &--light {
-    color: #000;
-    opacity: 0.3;
-  }
-
-  & > svg {
-    fill: currentColor;
-    height: 16px;
-    width: 14px;
-  }
-
-  &:hover,
-  &:focus {
-    opacity: 1;
-  }
-}
diff --git a/scss/_icons.scss b/scss/_icons.scss
deleted file mode 100644
index 04890ec0..00000000
--- a/scss/_icons.scss
+++ /dev/null
@@ -1,10 +0,0 @@
-.#{$rt-namespace}__spinner {
-  width: 20px;
-  height: 20px;
-  box-sizing: border-box;
-  border: 2px solid;
-  border-radius: 100%;
-  border-color: var(--toastify-spinner-color-empty-area);
-  border-right-color: var(--toastify-spinner-color);
-  animation: #{$rt-namespace}__spin 0.65s linear infinite;
-}
diff --git a/scss/_progressBar.scss b/scss/_progressBar.scss
deleted file mode 100644
index 2bd2c4dc..00000000
--- a/scss/_progressBar.scss
+++ /dev/null
@@ -1,55 +0,0 @@
-@keyframes #{$rt-namespace}__trackProgress {
-  0% {
-    transform: scaleX(1);
-  }
-  100% {
-    transform: scaleX(0);
-  }
-}
-
-.#{$rt-namespace}__progress-bar {
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  z-index: var(--toastify-z-index);
-  opacity: 0.7;
-  transform-origin: left;
-  border-bottom-left-radius: var(--toastify-toast-bd-radius);
-
-  &--animated {
-    animation: #{$rt-namespace}__trackProgress linear 1 forwards;
-  }
-
-  &--controlled {
-    transition: transform 0.2s;
-  }
-
-  &--rtl {
-    right: 0;
-    left: initial;
-    transform-origin: right;
-    border-bottom-left-radius: initial;
-    border-bottom-right-radius: var(--toastify-toast-bd-radius);
-  }
-
-  &--wrp {
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    height: 5px;
-    border-bottom-left-radius: var(--toastify-toast-bd-radius);
-  }
-
-  &--wrp[data-hidden="true"] {
-    opacity: 0;
-  }
-
-  &--bg {
-    opacity: var(--toastify-color-progress-bgo);
-    width: 100%;
-    height: 100%;
-  }
-}
diff --git a/scss/_theme.scss b/scss/_theme.scss
deleted file mode 100644
index 136e97fc..00000000
--- a/scss/_theme.scss
+++ /dev/null
@@ -1,57 +0,0 @@
-.#{$rt-namespace}__toast {
-  &-theme--dark {
-    background: var(--toastify-color-dark);
-    color: var(--toastify-text-color-dark);
-  }
-  &-theme--light {
-    background: var(--toastify-color-light);
-    color: var(--toastify-text-color-light);
-  }
-  &-theme--colored#{&}--default {
-    background: var(--toastify-color-light);
-    color: var(--toastify-text-color-light);
-  }
-  &-theme--colored#{&}--info {
-    color: var(--toastify-text-color-info);
-    background: var(--toastify-color-info);
-  }
-  &-theme--colored#{&}--success {
-    color: var(--toastify-text-color-success);
-    background: var(--toastify-color-success);
-  }
-  &-theme--colored#{&}--warning {
-    color: var(--toastify-text-color-warning);
-    background: var(--toastify-color-warning);
-  }
-  &-theme--colored#{&}--error {
-    color: var(--toastify-text-color-error);
-    background: var(--toastify-color-error);
-  }
-}
-
-.#{$rt-namespace}__progress-bar {
-  &-theme--light {
-    background: var(--toastify-color-progress-light);
-  }
-  &-theme--dark {
-    background: var(--toastify-color-progress-dark);
-  }
-  &--info {
-    background: var(--toastify-color-progress-info);
-  }
-  &--success {
-    background: var(--toastify-color-progress-success);
-  }
-  &--warning {
-    background: var(--toastify-color-progress-warning);
-  }
-  &--error {
-    background: var(--toastify-color-progress-error);
-  }
-  &-theme--colored#{&}--info,
-  &-theme--colored#{&}--success,
-  &-theme--colored#{&}--warning,
-  &-theme--colored#{&}--error {
-    background: var(--toastify-color-transparent);
-  }
-}
diff --git a/scss/_toast.scss b/scss/_toast.scss
deleted file mode 100644
index 378e55c2..00000000
--- a/scss/_toast.scss
+++ /dev/null
@@ -1,116 +0,0 @@
-.#{$rt-namespace}__toast {
-  --y: 0;
-  position: relative;
-  touch-action: none;
-  min-height: var(--toastify-toast-min-height);
-  box-sizing: border-box;
-  margin-bottom: 1rem;
-  padding: 8px;
-  border-radius: var(--toastify-toast-bd-radius);
-  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
-  display: flex;
-  justify-content: space-between;
-  max-height: var(--toastify-toast-max-height);
-  font-family: var(--toastify-font-family);
-  cursor: default;
-  direction: ltr;
-  /* webkit only issue #791 */
-  z-index: 0;
-  overflow: hidden;
-  
-  &--stacked {
-    position: absolute;
-    width: 100%;
-    transform: translate3d(0, var(--y), 0) scale(var(--s));
-    transition: transform 0.3s;
-
-    &[data-collapsed] .#{$rt-namespace}__toast-body, &[data-collapsed] .#{$rt-namespace}__close-button  {
-      transition: opacity 0.1s;
-    }
-
-    &[data-collapsed="false"]{
-      overflow: visible;
-    }
-
-    &[data-collapsed="true"]:not(:last-child) > * {
-      opacity: 0;
-    }
-
-    &:after {
-      content: '';
-      position: absolute;
-      left: 0;
-      right: 0;
-      height: calc(var(--g) * 1px);
-      bottom: 100%;
-    }
-
-    &[data-pos="top"] {
-      top: 0;
-    }
-
-    &[data-pos="bot"]  {
-      bottom: 0;
-    }
-
-    &[data-pos="bot"]#{&}:before {
-      transform-origin: top;
-    }
-
-    &[data-pos="top"]#{&}:before {
-      transform-origin: bottom;
-    }
-
-    &:before{
-      content: "";
-      position: absolute;
-      left: 0;
-      right: 0;
-      bottom: 0;
-      height: 100%;
-      transform: scaleY(3);
-      z-index: -1;
-    }
-  }
-  
-  &--rtl {
-    direction: rtl;
-  }
-  &--close-on-click {
-    cursor: pointer;
-  }
-  &-body {
-    margin: auto 0;
-    flex: 1 1 auto;
-    padding: 6px;
-    display: flex;
-    align-items: center;
-    & > div:last-child {
-      word-break: break-word;
-      flex: 1;
-    }
-  }
-  &-icon {
-    margin-inline-end: 10px;
-    width: 20px;
-    flex-shrink: 0;
-    display: flex;
-  }
-}
-
-.#{$rt-namespace}--animate {
-  animation-fill-mode: both;
-  animation-duration: 0.5s;
-}
-
-.#{$rt-namespace}--animate-icon {
-  animation-fill-mode: both;
-  animation-duration: 0.3s;
-}
-
-@media #{$rt-mobile} {
-  .#{$rt-namespace}__toast {
-    margin-bottom: 0;
-    border-radius: 0;
-  }
-}
diff --git a/scss/_toastContainer.scss b/scss/_toastContainer.scss
deleted file mode 100644
index 2d4fc79d..00000000
--- a/scss/_toastContainer.scss
+++ /dev/null
@@ -1,60 +0,0 @@
-.#{$rt-namespace}__toast-container {
-  z-index: var(--toastify-z-index);
-  -webkit-transform: translate3d(0, 0, var(--toastify-z-index));
-  position: fixed;
-  padding: 4px;
-  width: var(--toastify-toast-width);
-  box-sizing: border-box;
-  color: #fff;
-  &--top-left {
-    top: var(--toastify-toast-top);
-    left: var(--toastify-toast-left);
-  }
-  &--top-center {
-    top: var(--toastify-toast-top);
-    left: 50%;
-    transform: translateX(-50%);
-  }
-  &--top-right {
-    top: var(--toastify-toast-top);
-    right: var(--toastify-toast-right);
-  }
-  &--bottom-left {
-    bottom: var(--toastify-toast-bottom);
-    left: var(--toastify-toast-left);
-  }
-  &--bottom-center {
-    bottom: var(--toastify-toast-bottom);
-    left: 50%;
-    transform: translateX(-50%);
-  }
-  &--bottom-right {
-    bottom: var(--toastify-toast-bottom);
-    right: var(--toastify-toast-right);
-  }
-}
-
-@media #{$rt-mobile} {
-  .#{$rt-namespace}__toast-container {
-    width: 100vw;
-    padding: 0;
-    left: env(safe-area-inset-left);;
-    margin: 0;
-    &--top-left,
-    &--top-center,
-    &--top-right {
-      top: env(safe-area-inset-top);
-      transform: translateX(0);
-    }
-    &--bottom-left,
-    &--bottom-center,
-    &--bottom-right {
-      bottom: env(safe-area-inset-bottom);
-      transform: translateX(0);
-    }
-    &--rtl {
-      right: env(safe-area-inset-right);
-      left: initial;
-    }
-  }
-}
diff --git a/scss/_variables.scss b/scss/_variables.scss
deleted file mode 100644
index 8a92ca0c..00000000
--- a/scss/_variables.scss
+++ /dev/null
@@ -1,60 +0,0 @@
-$rt-namespace: 'Toastify';
-$rt-mobile: 'only screen and (max-width : 480px)' !default;
-
-:root {
-  --toastify-color-light: #fff;
-  --toastify-color-dark: #121212;
-  --toastify-color-info: #3498db;
-  --toastify-color-success: #07bc0c;
-  --toastify-color-warning: #f1c40f;
-  --toastify-color-error: #e74c3c;
-  --toastify-color-transparent: rgba(255, 255, 255, 0.7);
-
-  --toastify-icon-color-info: var(--toastify-color-info);
-  --toastify-icon-color-success: var(--toastify-color-success);
-  --toastify-icon-color-warning: var(--toastify-color-warning);
-  --toastify-icon-color-error: var(--toastify-color-error);
-
-  --toastify-toast-width: 320px;
-  --toastify-toast-offset: 16px;
-  --toastify-toast-top: max(var(--toastify-toast-offset), env(safe-area-inset-top));
-  --toastify-toast-right: max(var(--toastify-toast-offset), env(safe-area-inset-right));
-  --toastify-toast-left: max(var(--toastify-toast-offset), env(safe-area-inset-left));
-  --toastify-toast-bottom: max(var(--toastify-toast-offset), env(safe-area-inset-bottom));
-  --toastify-toast-background: #fff;
-  --toastify-toast-min-height: 64px;
-  --toastify-toast-max-height: 800px;
-  --toastify-toast-bd-radius: 6px;
-  --toastify-font-family: sans-serif;
-  --toastify-z-index: 9999;
-
-  --toastify-text-color-light: #757575;
-  --toastify-text-color-dark: #fff;
-
-  //Used only for colored theme
-  --toastify-text-color-info: #fff;
-  --toastify-text-color-success: #fff;
-  --toastify-text-color-warning: #fff;
-  --toastify-text-color-error: #fff;
-
-  --toastify-spinner-color: #616161;
-  --toastify-spinner-color-empty-area: #e0e0e0;
-
-  // Used when no type is provided
-  --toastify-color-progress-light: linear-gradient(
-    to right,
-    #4cd964,
-    #5ac8fa,
-    #007aff,
-    #34aadc,
-    #5856d6,
-    #ff2d55
-  );
-  // Used when no type is provided
-  --toastify-color-progress-dark: #bb86fc;
-  --toastify-color-progress-info: var(--toastify-color-info);
-  --toastify-color-progress-success: var(--toastify-color-success);
-  --toastify-color-progress-warning: var(--toastify-color-warning);
-  --toastify-color-progress-error: var(--toastify-color-error);
-  --toastify-color-progress-bgo: 0.2;
-}
diff --git a/scss/animations/_bounce.scss b/scss/animations/_bounce.scss
deleted file mode 100644
index 653ec077..00000000
--- a/scss/animations/_bounce.scss
+++ /dev/null
@@ -1,197 +0,0 @@
-@mixin timing-function {
-  animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-
-@keyframes #{$rt-namespace}__bounceInRight {
-  from,
-  60%,
-  75%,
-  90%,
-  to {
-    @include timing-function;
-  }
-  from {
-    opacity: 0;
-    transform: translate3d(3000px, 0, 0);
-  }
-  60% {
-    opacity: 1;
-    transform: translate3d(-25px, 0, 0);
-  }
-  75% {
-    transform: translate3d(10px, 0, 0);
-  }
-  90% {
-    transform: translate3d(-5px, 0, 0);
-  }
-  to {
-    transform: none;
-  }
-}
-
-@keyframes #{$rt-namespace}__bounceOutRight {
-  20% {
-    opacity: 1;
-    transform: translate3d(-20px, var(--y), 0);
-  }
-  to {
-    opacity: 0;
-    transform: translate3d(2000px, var(--y), 0);
-  }
-}
-
-@keyframes #{$rt-namespace}__bounceInLeft {
-  from,
-  60%,
-  75%,
-  90%,
-  to {
-    @include timing-function;
-  }
-  0% {
-    opacity: 0;
-    transform: translate3d(-3000px, 0, 0);
-  }
-  60% {
-    opacity: 1;
-    transform: translate3d(25px, 0, 0);
-  }
-  75% {
-    transform: translate3d(-10px, 0, 0);
-  }
-  90% {
-    transform: translate3d(5px, 0, 0);
-  }
-  to {
-    transform: none;
-  }
-}
-
-@keyframes #{$rt-namespace}__bounceOutLeft {
-  20% {
-    opacity: 1;
-    transform: translate3d(20px, var(--y), 0);
-  }
-  to {
-    opacity: 0;
-    transform: translate3d(-2000px, var(--y), 0);
-  }
-}
-
-@keyframes #{$rt-namespace}__bounceInUp {
-  from,
-  60%,
-  75%,
-  90%,
-  to {
-    @include timing-function;
-  }
-  from {
-    opacity: 0;
-    transform: translate3d(0, 3000px, 0);
-  }
-  60% {
-    opacity: 1;
-    transform: translate3d(0, -20px, 0);
-  }
-  75% {
-    transform: translate3d(0, 10px, 0);
-  }
-  90% {
-    transform: translate3d(0, -5px, 0);
-  }
-  to {
-    transform: translate3d(0, 0, 0);
-  }
-}
-
-@keyframes #{$rt-namespace}__bounceOutUp {
-  20% {
-    transform: translate3d(0, calc(var(--y) - 10px), 0);
-  }
-  40%,
-  45% {
-    opacity: 1;
-    transform: translate3d(0, calc(var(--y) + 20px), 0);
-  }
-  to {
-    opacity: 0;
-    transform: translate3d(0, -2000px, 0);
-  }
-}
-
-@keyframes #{$rt-namespace}__bounceInDown {
-  from,
-  60%,
-  75%,
-  90%,
-  to {
-    @include timing-function;
-  }
-  0% {
-    opacity: 0;
-    transform: translate3d(0, -3000px, 0);
-  }
-  60% {
-    opacity: 1;
-    transform: translate3d(0, 25px, 0);
-  }
-  75% {
-    transform: translate3d(0, -10px, 0);
-  }
-  90% {
-    transform: translate3d(0, 5px, 0);
-  }
-  to {
-    transform: none;
-  }
-}
-
-@keyframes #{$rt-namespace}__bounceOutDown {
-  20% {
-    transform: translate3d(0, calc(var(--y) - 10px), 0);
-  }
-  40%,
-  45% {
-    opacity: 1;
-    transform: translate3d(0, calc(var(--y) + 20px), 0);
-  }
-  to {
-    opacity: 0;
-    transform: translate3d(0, 2000px, 0);
-  }
-}
-
-.#{$rt-namespace}__bounce-enter {
-  &--top-left,
-  &--bottom-left {
-    animation-name: #{$rt-namespace}__bounceInLeft;
-  }
-  &--top-right,
-  &--bottom-right {
-    animation-name: #{$rt-namespace}__bounceInRight;
-  }
-  &--top-center {
-    animation-name: #{$rt-namespace}__bounceInDown;
-  }
-  &--bottom-center {
-    animation-name: #{$rt-namespace}__bounceInUp;
-  }
-}
-
-.#{$rt-namespace}__bounce-exit {
-  &--top-left,
-  &--bottom-left {
-    animation-name: #{$rt-namespace}__bounceOutLeft;
-  }
-  &--top-right,
-  &--bottom-right {
-    animation-name: #{$rt-namespace}__bounceOutRight;
-  }
-  &--top-center {
-    animation-name: #{$rt-namespace}__bounceOutUp;
-  }
-  &--bottom-center {
-    animation-name: #{$rt-namespace}__bounceOutDown;
-  }
-}
diff --git a/scss/animations/_flip.scss b/scss/animations/_flip.scss
deleted file mode 100644
index 544bb523..00000000
--- a/scss/animations/_flip.scss
+++ /dev/null
@@ -1,43 +0,0 @@
-@keyframes #{$rt-namespace}__flipIn {
-  from {
-    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-    animation-timing-function: ease-in;
-    opacity: 0;
-  }
-  40% {
-    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-    animation-timing-function: ease-in;
-  }
-  60% {
-    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
-    opacity: 1;
-  }
-  80% {
-    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
-  }
-  to {
-    transform: perspective(400px);
-  }
-}
-
-@keyframes #{$rt-namespace}__flipOut {
-  from {
-    transform: translate3d(0,var(--y),0) perspective(400px);
-  }
-  30% {
-    transform: translate3d(0,var(--y),0) perspective(400px) rotate3d(1, 0, 0, -20deg);
-    opacity: 1;
-  }
-  to {
-    transform: translate3d(0,var(--y),0) perspective(400px) rotate3d(1, 0, 0, 90deg);
-    opacity: 0;
-  }
-}
-
-.#{$rt-namespace}__flip-enter {
-  animation-name: #{$rt-namespace}__flipIn;
-}
-
-.#{$rt-namespace}__flip-exit {
-  animation-name: #{$rt-namespace}__flipOut;
-}
diff --git a/scss/animations/_slide.scss b/scss/animations/_slide.scss
deleted file mode 100644
index 656708b2..00000000
--- a/scss/animations/_slide.scss
+++ /dev/null
@@ -1,126 +0,0 @@
-@mixin transform {
-  transform: translate3d(0, var(--y), 0);
-}
-
-@keyframes #{$rt-namespace}__slideInRight {
-  from {
-    transform: translate3d(110%, 0, 0);
-    visibility: visible;
-  }
-  to {
-    @include transform;
-  }
-}
-
-@keyframes #{$rt-namespace}__slideInLeft {
-  from {
-    transform: translate3d(-110%, 0, 0);
-    visibility: visible;
-  }
-  to {
-    @include transform;
-  }
-}
-
-@keyframes #{$rt-namespace}__slideInUp {
-  from {
-    transform: translate3d(0, 110%, 0);
-    visibility: visible;
-  }
-  to {
-    @include transform;
-  }
-}
-
-@keyframes #{$rt-namespace}__slideInDown {
-  from {
-    transform: translate3d(0, -110%, 0);
-    visibility: visible;
-  }
-  to {
-    @include transform;
-  }
-}
-
-@keyframes #{$rt-namespace}__slideOutRight {
-  from {
-    @include transform;
-  }
-  to {
-    visibility: hidden;
-    transform: translate3d(110%, var(--y), 0);
-  }
-}
-
-@keyframes #{$rt-namespace}__slideOutLeft {
-  from {
-    @include transform;
-  }
-  to {
-    visibility: hidden;
-    transform: translate3d(-110%, var(--y), 0);
-  }
-}
-
-@keyframes #{$rt-namespace}__slideOutDown {
-  from {
-    @include transform;
-  }
-  to {
-    visibility: hidden;
-    transform: translate3d(0, 500px, 0);
-  }
-}
-
-@keyframes #{$rt-namespace}__slideOutUp {
-  from {
-    @include transform;
-  }
-  to {
-    visibility: hidden;
-    transform: translate3d(0, -500px, 0);
-  }
-}
-
-@mixin timing {
-  animation-timing-function: ease-in;
-  animation-duration: 0.3s;
-}
-
-.#{$rt-namespace}__slide-enter {
-  &--top-left,
-  &--bottom-left {
-    animation-name: #{$rt-namespace}__slideInLeft;
-  }
-  &--top-right,
-  &--bottom-right {
-    animation-name: #{$rt-namespace}__slideInRight;
-  }
-  &--top-center {
-    animation-name: #{$rt-namespace}__slideInDown;
-  }
-  &--bottom-center {
-    animation-name: #{$rt-namespace}__slideInUp;
-  }
-}
-
-.#{$rt-namespace}__slide-exit {
-  &--top-left,
-  &--bottom-left {
-    animation-name: #{$rt-namespace}__slideOutLeft;
-    @include timing;
-  }
-  &--top-right,
-  &--bottom-right {
-    animation-name: #{$rt-namespace}__slideOutRight;
-    @include timing;
-  }
-  &--top-center {
-    animation-name: #{$rt-namespace}__slideOutUp;
-    @include timing;
-  }
-  &--bottom-center {
-    animation-name: #{$rt-namespace}__slideOutDown;
-    @include timing;
-  }
-}
diff --git a/scss/animations/_spin.scss b/scss/animations/_spin.scss
deleted file mode 100644
index 093daf6a..00000000
--- a/scss/animations/_spin.scss
+++ /dev/null
@@ -1,8 +0,0 @@
-@keyframes #{$rt-namespace}__spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
diff --git a/scss/animations/_zoom.scss b/scss/animations/_zoom.scss
deleted file mode 100644
index d0699890..00000000
--- a/scss/animations/_zoom.scss
+++ /dev/null
@@ -1,30 +0,0 @@
-@keyframes #{$rt-namespace}__zoomIn {
-  from {
-    opacity: 0;
-    transform: scale3d(0.3, 0.3, 0.3);
-  }
-  50% {
-    opacity: 1;
-  }
-}
-
-@keyframes #{$rt-namespace}__zoomOut {
-  from {
-    opacity: 1;
-  }
-  50% {
-    opacity: 0;
-    transform: translate3d(0,var(--y),0) scale3d(0.3, 0.3, 0.3);
-  }
-  to {
-    opacity: 0;
-  }
-}
-
-.#{$rt-namespace}__zoom-enter {
-  animation-name: #{$rt-namespace}__zoomIn;
-}
-
-.#{$rt-namespace}__zoom-exit {
-  animation-name: #{$rt-namespace}__zoomOut;
-}
diff --git a/scss/main.scss b/scss/main.scss
deleted file mode 100644
index dd6ef26d..00000000
--- a/scss/main.scss
+++ /dev/null
@@ -1,16 +0,0 @@
-@charset "UTF-8";
-
-@import 'variables';
-@import 'toastContainer';
-@import 'toast';
-@import 'theme';
-@import 'closeButton';
-@import 'progressBar';
-@import 'icons';
-
-// entrance and exit animations
-@import 'animations/bounce.scss';
-@import 'animations/zoom.scss';
-@import 'animations/flip.scss';
-@import 'animations/slide.scss';
-@import 'animations/spin.scss';
diff --git a/scss/minimal.scss b/scss/minimal.scss
deleted file mode 100644
index 2fe806d1..00000000
--- a/scss/minimal.scss
+++ /dev/null
@@ -1,16 +0,0 @@
-@charset "UTF-8";
-
-@import 'variables';
-
-@keyframes #{$rt-namespace}__trackProgress {
-  0% {
-    transform: scaleX(1);
-  }
-  100% {
-    transform: scaleX(0);
-  }
-}
-
-.#{$rt-namespace}__progress-bar {
-  animation: #{$rt-namespace}__trackProgress linear 1 forwards;
-}
diff --git a/src/addons/use-notification-center/NotificationCenter.cy.tsx b/src/addons/use-notification-center/NotificationCenter.cy.tsx
index 0550af87..e7e48a28 100644
--- a/src/addons/use-notification-center/NotificationCenter.cy.tsx
+++ b/src/addons/use-notification-center/NotificationCenter.cy.tsx
@@ -5,7 +5,7 @@ import {
   NotificationCenterItem,
   UseNotificationCenterParams,
   useNotificationCenter
-} from './useNotificationCenter';
+} from 'react-toastify/notification-center';
 
 function TestComponent(props: UseNotificationCenterParams) {
   const [content, setContent] = React.useState('');
diff --git a/src/components/CloseButton.cy.tsx b/src/components/CloseButton.cy.tsx
index cf4cc18f..f40767bf 100644
--- a/src/components/CloseButton.cy.tsx
+++ b/src/components/CloseButton.cy.tsx
@@ -1,4 +1,5 @@
 import React from 'react';
+import '../style.css';
 import { CloseButton } from './CloseButton';
 
 describe('CloseButton', () => {
diff --git a/src/components/Icons.cy.tsx b/src/components/Icons.cy.tsx
index 2861fc84..12c81382 100644
--- a/src/components/Icons.cy.tsx
+++ b/src/components/Icons.cy.tsx
@@ -1,6 +1,7 @@
 import React from 'react';
-import { IconParams, getIcon } from './Icons';
+import '../style.css';
 import { TypeOptions } from '../types';
+import { IconParams, getIcon } from './Icons';
 
 const props: IconParams = {
   theme: 'light',
diff --git a/src/components/ProgressBar.cy.tsx b/src/components/ProgressBar.cy.tsx
index 51bda50e..f4021aa4 100644
--- a/src/components/ProgressBar.cy.tsx
+++ b/src/components/ProgressBar.cy.tsx
@@ -1,4 +1,5 @@
 import React from 'react';
+import '../style.css';
 import { Theme } from '../types';
 import { ProgressBar } from './ProgressBar';
 
diff --git a/src/components/Toast.cy.tsx b/src/components/Toast.cy.tsx
index be7cfd34..373fc1d0 100644
--- a/src/components/Toast.cy.tsx
+++ b/src/components/Toast.cy.tsx
@@ -1,4 +1,5 @@
 import React from 'react';
+import '../style.css';
 import { DraggableDirection, ToastProps } from '../types';
 import { Default } from '../utils';
 import { Toast } from './Toast';
diff --git a/src/core/toast.cy.tsx b/src/core/toast.cy.tsx
index 45ee1d91..fe4a3957 100644
--- a/src/core/toast.cy.tsx
+++ b/src/core/toast.cy.tsx
@@ -1,6 +1,5 @@
 import React from 'react';
-import { ToastContainer } from '../components';
-import { toast } from './toast';
+import { toast, ToastContainer } from 'react-toastify';
 
 beforeEach(() => {
   cy.viewport('macbook-15');
diff --git a/src/core/toast.ts b/src/core/toast.ts
index 8fa7b61b..d101b616 100644
--- a/src/core/toast.ts
+++ b/src/core/toast.ts
@@ -371,7 +371,7 @@ toast.done = (id: Id) => {
  * })
  * ```
  */
-toast.onChange = onChange as (cb: OnChangeCallback) => void;
+toast.onChange = onChange as (cb: OnChangeCallback) => () => void;
 
 /**
  * Play a toast(s) timer progammatically