freemium-ui 2.0.30 → 2.0.32

package/lib/index.cjs.js

@@ -16703,7 +16703,7 @@ const UY=_Y,YY=kY,WY=RY,GY=PY,KY=yr(MY)``;yr.div`
   animation-duration: ${({theme:e})=>e.transitions.duration.standard};
   animation-timing-function: ${({theme:e})=>e.transitions.easing.easeIn};
   will-change: transform, opacity;
-  position: absolute;
+  position: relative;
   order: ${({toastIndex:e})=>e+1};
   background: ${({theme:e})=>e.colors.fill.surface};
   border: 1px solid ${({theme:e})=>e.colors.border.light};
@@ -16723,17 +16723,20 @@ const UY=_Y,YY=kY,WY=RY,GY=PY,KY=yr(MY)``;yr.div`
   color: ${({theme:e})=>e.colors.text.primary};
   flex: 1;
 `,XY=yr(GY)``,JY=yr(UY)`
-  position: fixed;
+  position: absolute;
   top: 16px;
   display: flex;
   flex-direction: column;
   align-items: ${({theme:e})=>e.components.toast.position};
+  right: ${({theme:e})=>"end"===e.components.toast.position?"16px":"unset"};
+  left: ${({theme:e})=>"start"===e.components.toast.position?"16px":"center"===e.components.toast.position?"50%":"unset"};
+  transform: ${({theme:e})=>"center"===e.components.toast.position?"translate(-50%, 0)":"unset"};
   margin: 0;
   list-style: none;
   z-index: ${({theme:e})=>e.zIndex.snackbar||xo.snackbar};
   outline: none;
   width: -webkit-fill-available;
-  padding: 0 16px;
+  padding: 0;
   &:hover {
     gap: 8px;
     li[data-state='open']:nth-last-of-type(1) {

package/lib/index.d.ts

@@ -1565,7 +1565,7 @@ interface FreemiumUiTheme {
     zIndex: ZIndex;
     components: {
         toast: {
-            position: CSSProperties['alignItems'];
+            position: Extract<CSSProperties['alignItems'], 'end' | 'start' | 'center'>;
         };
         button: {
             primary: FreemiumUiButtonTheme;

package/lib/index.js

@@ -16955,7 +16955,7 @@ const _W=uW,HW=pW,DW=yW,AW=bW,LW=Or(iW)``;Or.div`
   animation-duration: ${({theme:e})=>e.transitions.duration.standard};
   animation-timing-function: ${({theme:e})=>e.transitions.easing.easeIn};
   will-change: transform, opacity;
-  position: absolute;
+  position: relative;
   order: ${({toastIndex:e})=>e+1};
   background: ${({theme:e})=>e.colors.fill.surface};
   border: 1px solid ${({theme:e})=>e.colors.border.light};
@@ -16975,17 +16975,20 @@ const _W=uW,HW=pW,DW=yW,AW=bW,LW=Or(iW)``;Or.div`
   color: ${({theme:e})=>e.colors.text.primary};
   flex: 1;
 `,TW=Or(AW)``,PW=Or(_W)`
-  position: fixed;
+  position: absolute;
   top: 16px;
   display: flex;
   flex-direction: column;
   align-items: ${({theme:e})=>e.components.toast.position};
+  right: ${({theme:e})=>"end"===e.components.toast.position?"16px":"unset"};
+  left: ${({theme:e})=>"start"===e.components.toast.position?"16px":"center"===e.components.toast.position?"50%":"unset"};
+  transform: ${({theme:e})=>"center"===e.components.toast.position?"translate(-50%, 0)":"unset"};
   margin: 0;
   list-style: none;
   z-index: ${({theme:e})=>e.zIndex.snackbar||Yo.snackbar};
   outline: none;
   width: -webkit-fill-available;
-  padding: 0 16px;
+  padding: 0;
   &:hover {
     gap: 8px;
     li[data-state='open']:nth-last-of-type(1) {

package/lib/package.json

@@ -1,6 +1,6 @@
 {
   "name": "freemium-ui",
-  "version": "2.0.30",
+  "version": "2.0.32",
   "description": "React Ui Components for Freemium Apps",
   "main": "./index.js",
   "module": "./index.js",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "freemium-ui",
-  "version": "2.0.30",
+  "version": "2.0.32",
   "description": "React Ui Components for Freemium Apps",
   "main": "lib/index.cjs.js",
   "module": "lib/index.js",