@synerise/ds-toast 1.2.13 → 1.3.0

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.3.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-toast@1.2.13...@synerise/ds-toast@1.3.0) (2026-01-20)
+
+### Features
+
+- **toast:** new styles of toast ([c3f3316](https://github.com/Synerise/synerise-design/commit/c3f331605f9e03c841ff40af0b7efcdd0251a90f))
+
 ## [1.2.13](https://github.com/Synerise/synerise-design/compare/@synerise/ds-toast@1.2.12...@synerise/ds-toast@1.2.13) (2026-01-15)
 
 **Note:** Version bump only for package @synerise/ds-toast

package/dist/Toast.styles.js

@@ -1,38 +1,26 @@
 import styled, { keyframes } from 'styled-components';
 import { UnorderedList } from '@synerise/ds-unordered-list/dist/Unordered-list.styles';
-import { hexToRgba } from '@synerise/ds-utils';
-var getDescriptionColorForType = function getDescriptionColorForType(_ref) {
+var getIconColorForType = function getIconColorForType(_ref) {
   var toastType = _ref.toastType,
     theme = _ref.theme;
   switch (toastType) {
     case 'informative':
       return theme.palette['grey-600'];
     case 'negative':
-    case 'success':
+      return theme.palette['red-500'];
     case 'warning':
+      return theme.palette['yellow-600'];
+    case 'success':
     default:
-      return theme.palette.white;
+      return theme.palette['green-600'];
   }
 };
-var getIconColorForType = function getIconColorForType(_ref2) {
+var getBackgroundColorForType = function getBackgroundColorForType(_ref2) {
   var toastType = _ref2.toastType,
     theme = _ref2.theme;
   switch (toastType) {
     case 'informative':
       return theme.palette['grey-600'];
-    case 'negative':
-    case 'success':
-    case 'warning':
-    default:
-      return theme.palette.white;
-  }
-};
-var getBackgroundColorForType = function getBackgroundColorForType(_ref3) {
-  var toastType = _ref3.toastType,
-    theme = _ref3.theme;
-  switch (toastType) {
-    case 'informative':
-      return theme.palette['grey-050'];
     case 'negative':
       return theme.palette['red-500'];
     case 'warning':
@@ -119,7 +107,7 @@ export var Wrapper = styled.div.withConfig({
   displayName: "Toaststyles__Wrapper",
   componentId: "sc-wwaizr-11"
 })(["color:", ";"], function (props) {
-  return props.theme.palette['grey-050'];
+  return props.theme.palette['grey-600'];
 });
 export var AnimationContainer = styled.div.withConfig({
   displayName: "Toaststyles__AnimationContainer",
@@ -148,6 +136,14 @@ export var AlertDescription = styled.div.withConfig({
 export var Container = styled.div.withConfig({
   displayName: "Toaststyles__Container",
   componentId: "sc-wwaizr-16"
-})(["display:flex;flex-direction:row;max-width:500px;align-items:flex-start;justify-content:center;background-color:", ";border-radius:4px;box-shadow:", ";", ",", ",", "{svg{fill:", ";}}", ",", ",", ":hover,", "{color:", ";}", ":hover{", "{background-image:linear-gradient( to right,", " 20%,rgba(255,255,255,0) 10% );color:", ";}}", "{svg{color:", ";fill:", ";}}"], getBackgroundColorForType, function (props) {
-  return props.color ? "0px 16px 32px 5px " + hexToRgba(props.theme.palette['grey-900'], 0.2) : 'none';
-}, IconExpanderWrapper, IconOrderWrapper, IconCloseWrapper, getDescriptionColorForType, OrderWrapper, AlertMessage, NumberWrapper, AlertDescription, getDescriptionColorForType, OrderWrapper, NumberWrapper, getDescriptionColorForType, getDescriptionColorForType, IconWrapper, getIconColorForType, getIconColorForType);
+})(["display:flex;flex-direction:row;max-width:500px;align-items:flex-start;justify-content:center;border-top:solid 2px ", ";background-color:", ";border-radius:4px;box-shadow:0 16px 32px 0 rgba(35,41,54,0.12);", ",", ",", "{svg{fill:", ";}}", ",", ",", ",", ":hover,", "{color:", ";}", ":hover{", "{background-image:linear-gradient( to right,", ";20%,rgba(255,255,255,0) 10% );color:", ";}}", "{svg{color:", ";fill:", ";}}"], getBackgroundColorForType, function (props) {
+  return props.theme.palette.white;
+}, IconExpanderWrapper, IconOrderWrapper, IconCloseWrapper, function (props) {
+  return props.theme.palette['grey-600'];
+}, OrderWrapper, AlertMessage, ListWrapper, NumberWrapper, AlertDescription, function (props) {
+  return props.theme.palette['grey-600'];
+}, OrderWrapper, NumberWrapper, function (props) {
+  return props.theme.palette['grey-600'];
+}, function (props) {
+  return props.theme.palette['grey-600'];
+}, IconWrapper, getIconColorForType, getIconColorForType);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-toast",
-  "version": "1.2.13",
+  "version": "1.3.0",
   "description": "Toast UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -44,5 +44,5 @@
     "@synerise/ds-core": "*",
     "react": ">=16.9.0 <= 18.3.1"
   },
-  "gitHead": "4cde643d1f63a4b47e84707a13b1b1d138730d53"
+  "gitHead": "db758824923a2a231a0de460f0d6d10739514cda"
 }