chore(deps): bump react-toastify from 9.1.3 to 11.0.5 (#540)

* chore(deps): bump react-toastify from 9.1.3 to 11.0.5

Bumps [react-toastify](https://github.com/fkhadra/react-toastify) from 9.1.3 to 11.0.5.
- [Release notes](https://github.com/fkhadra/react-toastify/releases)
- [Commits](fkhadra/react-toastify@v9.1.3...v11.0.5)

---
updated-dependencies:
- dependency-name: react-toastify
  dependency-version: 11.0.5
  dependency-type: direct:production
  update-type: version-update:semver-major
...

Signed-off-by: dependabot[bot] <support@github.com>

* fix(toast): override width and progress bar as in design #000

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Airike Jaska <95303654+airikej@users.noreply.github.com>

Author: dependabot[bot]

package-lock.json

@@ -53,7 +53,7 @@
     "react-dropzone": "^14.3.5",
     "react-select": "^5.10.1",
     "react-sticky-box": "2.0.5",
-    "react-toastify": "^9.1.3",
+    "react-toastify": "^11.0.5",
     "what-input": "^5.2.12",
     "yup": "^1.4.0"
   },

package.json

@@ -1,19 +1,29 @@
-.tedi-toast__progress {
-  background: var(--toast-progress-color) !important;
+:root,
+.Toastify__toast-theme--light {
+  --toastify-color-progress-light: transparent !important;
 }
 
-.tedi-toast__progress--success {
-  --toast-progress-color: var(--alert-default-border-success);
-}
+.tedi-toast {
+  display: block;
+  width: 100%;
 
-.tedi-toast__progress--info {
-  --toast-progress-color: var(--alert-default-border-info);
-}
+  &__progress {
+    background: var(--toast-progress-color) !important;
 
-.tedi-toast__progress--danger {
-  --toast-progress-color: var(--alert-default-border-danger);
-}
+    &--success {
+      --toast-progress-color: var(--alert-default-border-success);
+    }
+
+    &--info {
+      --toast-progress-color: var(--alert-default-border-info);
+    }
+
+    &--danger {
+      --toast-progress-color: var(--alert-default-border-danger);
+    }
 
-.tedi-toast__progress--warning {
-  --toast-progress-color: var(--alert-default-border-warning);
+    &--warning {
+      --toast-progress-color: var(--alert-default-border-warning);
+    }
+  }
 }

src/tedi/components/notifications/toast/toast.module.scss

@@ -34,6 +34,7 @@ export const sendNotification = (props: AlertProps, toastOptions?: ToastOptions)
           props.onClose?.();
           toast.dismiss(id);
         }}
+        className={styles['tedi-toast']}
       >
         {props.children}
       </Alert>