@rango-dev/ui 0.28.2-next.0 → 0.28.2-next.2

package/dist/widget/ui/src/containers/SwapInput/SwapInput.styles.d.ts

@@ -553,13 +553,13 @@ export declare const MaxButton: import("@stitches/react/types/styled-component")
     "aria-braillelabel"?: string | undefined;
     "aria-brailleroledescription"?: string | undefined;
     "aria-busy"?: (boolean | "true" | "false") | undefined;
-    "aria-checked"?: boolean | "mixed" | "true" | "false" | undefined;
+    "aria-checked"?: boolean | "true" | "mixed" | "false" | undefined;
     "aria-colcount"?: number | undefined;
     "aria-colindex"?: number | undefined;
     "aria-colindextext"?: string | undefined;
     "aria-colspan"?: number | undefined;
     "aria-controls"?: string | undefined;
-    "aria-current"?: boolean | "time" | "page" | "true" | "false" | "step" | "location" | "date" | undefined;
+    "aria-current"?: boolean | "time" | "true" | "page" | "false" | "step" | "location" | "date" | undefined;
     "aria-describedby"?: string | undefined;
     "aria-description"?: string | undefined;
     "aria-details"?: string | undefined;
@@ -569,7 +569,7 @@ export declare const MaxButton: import("@stitches/react/types/styled-component")
     "aria-expanded"?: (boolean | "true" | "false") | undefined;
     "aria-flowto"?: string | undefined;
     "aria-grabbed"?: (boolean | "true" | "false") | undefined;
-    "aria-haspopup"?: boolean | "dialog" | "menu" | "grid" | "listbox" | "true" | "false" | "tree" | undefined;
+    "aria-haspopup"?: boolean | "dialog" | "menu" | "grid" | "true" | "listbox" | "false" | "tree" | undefined;
     "aria-hidden"?: (boolean | "true" | "false") | undefined;
     "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
     "aria-keyshortcuts"?: string | undefined;
@@ -580,11 +580,11 @@ export declare const MaxButton: import("@stitches/react/types/styled-component")
     "aria-modal"?: (boolean | "true" | "false") | undefined;
     "aria-multiline"?: (boolean | "true" | "false") | undefined;
     "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
-    "aria-orientation"?: "vertical" | "horizontal" | undefined;
+    "aria-orientation"?: "horizontal" | "vertical" | undefined;
     "aria-owns"?: string | undefined;
     "aria-placeholder"?: string | undefined;
     "aria-posinset"?: number | undefined;
-    "aria-pressed"?: boolean | "mixed" | "true" | "false" | undefined;
+    "aria-pressed"?: boolean | "true" | "mixed" | "false" | undefined;
     "aria-readonly"?: (boolean | "true" | "false") | undefined;
     "aria-relevant"?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
     "aria-required"?: (boolean | "true" | "false") | undefined;
@@ -768,7 +768,7 @@ export declare const MaxButton: import("@stitches/react/types/styled-component")
 } & {
     size?: "small" | "medium" | "large" | "xsmall" | "xxsmall" | undefined;
     variant?: "default" | "contained" | "outlined" | "ghost" | undefined;
-    type?: "success" | "warning" | "error" | "primary" | "secondary" | undefined;
+    type?: "primary" | "secondary" | "success" | "warning" | "error" | undefined;
     loading?: boolean | undefined;
     disabled?: boolean | undefined;
     prefix?: import("react").ReactNode;

package/dist/widget/ui/src/containers/SwapInput/TokenSection.styles.d.ts

@@ -57,13 +57,13 @@ export declare const Container: import("@stitches/react/types/styled-component")
     "aria-braillelabel"?: string | undefined;
     "aria-brailleroledescription"?: string | undefined;
     "aria-busy"?: (boolean | "true" | "false") | undefined;
-    "aria-checked"?: boolean | "mixed" | "true" | "false" | undefined;
+    "aria-checked"?: boolean | "true" | "mixed" | "false" | undefined;
     "aria-colcount"?: number | undefined;
     "aria-colindex"?: number | undefined;
     "aria-colindextext"?: string | undefined;
     "aria-colspan"?: number | undefined;
     "aria-controls"?: string | undefined;
-    "aria-current"?: boolean | "time" | "page" | "true" | "false" | "step" | "location" | "date" | undefined;
+    "aria-current"?: boolean | "time" | "true" | "page" | "false" | "step" | "location" | "date" | undefined;
     "aria-describedby"?: string | undefined;
     "aria-description"?: string | undefined;
     "aria-details"?: string | undefined;
@@ -73,7 +73,7 @@ export declare const Container: import("@stitches/react/types/styled-component")
     "aria-expanded"?: (boolean | "true" | "false") | undefined;
     "aria-flowto"?: string | undefined;
     "aria-grabbed"?: (boolean | "true" | "false") | undefined;
-    "aria-haspopup"?: boolean | "dialog" | "menu" | "grid" | "listbox" | "true" | "false" | "tree" | undefined;
+    "aria-haspopup"?: boolean | "dialog" | "menu" | "grid" | "true" | "listbox" | "false" | "tree" | undefined;
     "aria-hidden"?: (boolean | "true" | "false") | undefined;
     "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
     "aria-keyshortcuts"?: string | undefined;
@@ -84,11 +84,11 @@ export declare const Container: import("@stitches/react/types/styled-component")
     "aria-modal"?: (boolean | "true" | "false") | undefined;
     "aria-multiline"?: (boolean | "true" | "false") | undefined;
     "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
-    "aria-orientation"?: "vertical" | "horizontal" | undefined;
+    "aria-orientation"?: "horizontal" | "vertical" | undefined;
     "aria-owns"?: string | undefined;
     "aria-placeholder"?: string | undefined;
     "aria-posinset"?: number | undefined;
-    "aria-pressed"?: boolean | "mixed" | "true" | "false" | undefined;
+    "aria-pressed"?: boolean | "true" | "mixed" | "false" | undefined;
     "aria-readonly"?: (boolean | "true" | "false") | undefined;
     "aria-relevant"?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
     "aria-required"?: (boolean | "true" | "false") | undefined;
@@ -272,7 +272,7 @@ export declare const Container: import("@stitches/react/types/styled-component")
 } & {
     size?: "small" | "medium" | "large" | "xsmall" | "xxsmall" | undefined;
     variant?: "default" | "contained" | "outlined" | "ghost" | undefined;
-    type?: "success" | "warning" | "error" | "primary" | "secondary" | undefined;
+    type?: "primary" | "secondary" | "success" | "warning" | "error" | undefined;
     loading?: boolean | undefined;
     disabled?: boolean | undefined;
     prefix?: import("react").ReactNode;

package/dist/widget/ui/src/icons/Autorenew.d.ts

@@ -0,0 +1,5 @@
+import type { SvgIconPropsWithChildren } from '../components/SvgIcon';
+import React from 'react';
+declare function SvgAutorenew(props: SvgIconPropsWithChildren): React.FunctionComponentElement<SvgIconPropsWithChildren>;
+export default SvgAutorenew;
+//# sourceMappingURL=Autorenew.d.ts.map

package/dist/widget/ui/src/icons/Autorenew.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Autorenew.d.ts","sourceRoot":"","sources":["../../../../../src/icons/Autorenew.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAC;AAEtE,OAAO,KAAwB,MAAM,OAAO,CAAC;AAI7C,iBAAS,YAAY,CAAC,KAAK,EAAE,wBAAwB,4DAYpD;AACD,eAAe,YAAY,CAAC"}

package/dist/widget/ui/src/icons/Exit.d.ts

@@ -0,0 +1,5 @@
+import type { SvgIconPropsWithChildren } from '../components/SvgIcon';
+import React from 'react';
+declare function SvgExit(props: SvgIconPropsWithChildren): React.FunctionComponentElement<SvgIconPropsWithChildren>;
+export default SvgExit;
+//# sourceMappingURL=Exit.d.ts.map

package/dist/widget/ui/src/icons/Exit.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Exit.d.ts","sourceRoot":"","sources":["../../../../../src/icons/Exit.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAC;AAEtE,OAAO,KAAwB,MAAM,OAAO,CAAC;AAI7C,iBAAS,OAAO,CAAC,KAAK,EAAE,wBAAwB,4DAY/C;AACD,eAAe,OAAO,CAAC"}

package/dist/widget/ui/src/icons/Swap.d.ts

@@ -0,0 +1,5 @@
+import type { SvgIconPropsWithChildren } from '../components/SvgIcon';
+import React from 'react';
+declare function SvgSwap(props: SvgIconPropsWithChildren): React.FunctionComponentElement<SvgIconPropsWithChildren>;
+export default SvgSwap;
+//# sourceMappingURL=Swap.d.ts.map

package/dist/widget/ui/src/icons/Swap.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Swap.d.ts","sourceRoot":"","sources":["../../../../../src/icons/Swap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAC;AAEtE,OAAO,KAAwB,MAAM,OAAO,CAAC;AAI7C,iBAAS,OAAO,CAAC,KAAK,EAAE,wBAAwB,4DAY/C;AACD,eAAe,OAAO,CAAC"}

package/dist/widget/ui/src/icons/index.d.ts

@@ -1,5 +1,6 @@
 export { default as AddIcon } from './Add';
 export { default as AutoThemeIcon } from './AutoTheme';
+export { default as AutorenewIcon } from './Autorenew';
 export { default as BorderRadiusIcon } from './BorderRadius';
 export { default as ChevronDownIcon } from './ChevronDown';
 export { default as ChevronLeftIcon } from './ChevronLeft';
@@ -16,6 +17,7 @@ export { default as DesktopIcon } from './Desktop';
 export { default as DoneIcon } from './Done';
 export { default as EvmCategoryIcon } from './EvmCategory';
 export { default as ErrorIcon } from './Error';
+export { default as ExitIcon } from './Exit';
 export { default as ExternalLinkIcon } from './ExternalLink';
 export { default as FontIcon } from './Font';
 export { default as GasIcon } from './Gas';
@@ -41,6 +43,7 @@ export { default as RefreshIcon } from './Refresh';
 export { default as ReverseIcon } from './Reverse';
 export { default as RouteIcon } from './Route';
 export { default as SearchIcon } from './Search';
+export { default as SwapIcon } from './Swap';
 export { default as TimeIcon } from './Time';
 export { default as TransactionIcon } from './Transaction';
 export { default as UtxoCategoryIcon } from './UtxoCategory';

package/dist/widget/ui/src/icons/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/icons/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/icons/index.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rango-dev/ui",
-  "version": "0.28.2-next.0",
+  "version": "0.28.2-next.2",
   "license": "MIT",
   "type": "module",
   "source": "./src/index.ts",

package/src/components/Alert/Alert.tsx

@@ -18,6 +18,7 @@ export function Alert(props: PropsWithChildren<PropTypes>) {
     action,
     containerStyles,
     variant = 'regular',
+    titleAlign,
   } = props;
   const isFooterString = typeof footer === 'string';
 
@@ -36,6 +37,7 @@ export function Alert(props: PropsWithChildren<PropTypes>) {
           {title && (
             <Typography
               color={getColor(type, variant)}
+              align={titleAlign}
               variant="body"
               className="title_typography"
               size={variant === 'regular' ? 'xsmall' : 'small'}>

package/src/components/Alert/Alert.types.ts

@@ -1,3 +1,4 @@
+import type { BaseAlign } from '../Typography/Typography.types';
 import type { CSSProperties, ReactNode } from 'react';
 
 export type Type = 'success' | 'warning' | 'error' | 'info' | 'loading';
@@ -9,4 +10,5 @@ export interface PropTypes {
   action?: ReactNode;
   variant?: 'alarm' | 'regular';
   containerStyles?: CSSProperties;
+  titleAlign?: BaseAlign;
 }

package/src/components/Divider/Divider.tsx

@@ -9,6 +9,7 @@ const DEFAULT_SIZE = 12;
 export function Divider({
   size = DEFAULT_SIZE,
   direction = 'vertical',
+  ...props
 }: PropTypes) {
-  return <DividerContainer size={size} direction={direction} />;
+  return <DividerContainer size={size} direction={direction} {...props} />;
 }

package/src/components/Modal/Modal.tsx

@@ -27,7 +27,7 @@ export function Modal(props: PropsWithChildren<PropTypes>) {
     title,
     open,
     onClose,
-    containerStyle,
+    styles,
     anchor = 'bottom',
     container = document.body,
     prefix,
@@ -84,10 +84,11 @@ export function Modal(props: PropsWithChildren<PropTypes>) {
           <BackDrop
             active={active}
             onClick={handleBackDropClick}
-            anchor={anchor}>
+            anchor={anchor}
+            css={styles?.root}>
             <ModalContainer
               active={active}
-              css={containerStyle}
+              css={styles?.container}
               anchor={anchor}>
               {header ?? (
                 <ModalHeader noTitle={!title && dismissible && !prefix}>
@@ -107,9 +108,9 @@ export function Modal(props: PropsWithChildren<PropTypes>) {
                   </Flex>
                 </ModalHeader>
               )}
-              <Content>{children}</Content>
+              <Content css={styles?.content}>{children}</Content>
 
-              <Footer>
+              <Footer css={styles?.footer}>
                 {footer && <div className="footer__content">{footer}</div>}
 
                 <div

package/src/components/Modal/Modal.types.ts

@@ -15,7 +15,12 @@ export interface PropTypes {
   prefix?: React.ReactNode;
   suffix?: React.ReactNode;
   container?: HTMLElement;
-  containerStyle?: Stitches.CSS<typeof config>;
+  styles?: {
+    root?: Stitches.CSS<typeof config>;
+    container?: Stitches.CSS<typeof config>;
+    content?: Stitches.CSS<typeof config>;
+    footer?: Stitches.CSS<typeof config>;
+  };
   footer?: React.ReactNode;
   hasWatermark?: boolean;
   hasCloseIcon?: boolean;

package/src/components/Toast/Toast.Provider.tsx

@@ -1,6 +1,7 @@
 import type {
   ProviderContext,
   ProviderPropTypes,
+  ToastPosition,
   ToastProps,
   ToastType,
 } from './Toast.types';
@@ -15,61 +16,98 @@ import { ToastContainer } from './Toast.styles';
 
 const ToastContext = createContext<ProviderContext | undefined>(undefined);
 
+const renderToastContainer = (
+  toasts: ToastProps[],
+  position: ToastPosition
+) => (
+  <>
+    {toasts.length > 0 && (
+      <ToastContainer style={toasts[0].containerStyle} position={position}>
+        {toasts.map((toast) => (
+          <Toast {...toast} key={toast.id} />
+        ))}
+      </ToastContainer>
+    )}
+  </>
+);
+
 export const ToastProvider = (props: PropsWithChildren<ProviderPropTypes>) => {
   const generateId = useMemo(() => idGenerator(), []);
 
-  const {
-    children,
-    anchorOrigin = {
-      horizontal: 'right',
-      vertical: 'bottom',
-    },
-    container,
-    containerStyle = {},
-  } = props;
-  const [toasts, setToasts] = useState<ToastProps[]>([]);
+  const { children, container } = props;
+  const [leftTopToasts, setLeftTopToasts] = useState<ToastProps[]>([]);
+  const [leftBottomToasts, setLeftBottomToasts] = useState<ToastProps[]>([]);
+  const [rightTopToasts, setRightTopToasts] = useState<ToastProps[]>([]);
+  const [rightBottomToasts, setRightBottomToasts] = useState<ToastProps[]>([]);
+  const [centerTopToasts, setCenterTopToasts] = useState<ToastProps[]>([]);
+  const [centerBottomToasts, setCenterBottomToasts] = useState<ToastProps[]>(
+    []
+  );
 
-  // eslint-disable-next-line react/jsx-no-constructed-context-values
-  const api: ProviderContext = {
-    addToast(content: ToastType) {
-      setToasts((toasts) => {
-        const isToastExistById = toasts.find(
-          (toast) => toast.id === content.id
+  const getToastSetter = (position: ToastPosition) => {
+    switch (position) {
+      case 'right-top':
+        return setRightTopToasts;
+      case 'right-bottom':
+        return setRightBottomToasts;
+      case 'left-top':
+        return setLeftTopToasts;
+      case 'left-bottom':
+        return setLeftBottomToasts;
+      case 'center-top':
+        return setCenterTopToasts;
+      default:
+        return setCenterBottomToasts;
+    }
+  };
+
+  const handleAddToast = (content: ToastType) => {
+    const addToasts = () => getToastSetter(content.position);
+
+    addToasts()((toasts) => {
+      const isToastExistById = toasts.find((toast) => toast.id === content.id);
+      if (isToastExistById) {
+        console.warn(
+          'Trying to send a toast with an existing ID. Please update the toast ID or use it after the toast is hidden'
         );
-        if (isToastExistById) {
-          console.warn(
-            'Trying to send a toast with an existing ID. Please update the toast ID or use it after the toast is hidden'
-          );
-          return toasts;
-        }
-        return [
-          ...toasts,
-          {
-            ...content,
-            id: content.id || generateId(),
-            horizontal: anchorOrigin.horizontal,
-          },
-        ];
-      });
-    },
-    removeToast(id: number | string) {
-      setToasts((toasts) => toasts.filter((t) => t.id !== id));
-    },
+        return toasts;
+      }
+      return [
+        ...toasts,
+        {
+          ...content,
+          id: content.id || generateId(),
+        },
+      ];
+    });
+  };
+
+  const handleRemoveToast = (id: number | string, position: ToastPosition) => {
+    const removeFromToasts = () => getToastSetter(position);
+
+    removeFromToasts()((toasts) => toasts.filter((t) => t.id !== id));
+  };
+
+  // eslint-disable-next-line react/jsx-no-constructed-context-values
+  const toastApis = {
+    addToast: (content: ToastType) => handleAddToast(content),
+    removeToast: (id: number | string, position: ToastPosition) =>
+      handleRemoveToast(id, position),
   };
 
   return (
-    <ToastContext.Provider value={api}>
+    <ToastContext.Provider value={toastApis}>
       {children}
       {container &&
         createPortal(
-          <ToastContainer
-            style={containerStyle}
-            horizontal={anchorOrigin.horizontal}
-            vertical={anchorOrigin.vertical}>
-            {toasts.map((toast) => (
-              <Toast {...toast} key={toast.id} />
-            ))}
-          </ToastContainer>,
+          <>
+            {renderToastContainer(rightTopToasts, 'right-top')}
+            {renderToastContainer(leftTopToasts, 'left-top')}
+            {renderToastContainer(centerTopToasts, 'center-top')}
+            {renderToastContainer(rightBottomToasts, 'right-bottom')}
+            {renderToastContainer(leftBottomToasts, 'left-bottom')}
+            {renderToastContainer(centerBottomToasts, 'center-bottom')}
+          </>,
           container
         )}
     </ToastContext.Provider>

package/src/components/Toast/Toast.stories.tsx

@@ -16,7 +16,8 @@ export default {
     type: 'success',
     title: 'Please change your wallet network to Polygon',
     autoHideDuration: 5_000,
-    horizontal: 'right',
+    position: 'right-top',
+    variant: 'standard',
   },
   argTypes: {
     type: {
@@ -26,30 +27,26 @@ export default {
         options: ['success', 'warning', 'error', 'info', 'loading'],
       },
     },
+    position: {
+      name: 'position',
+      control: {
+        type: 'select',
+        options: [
+          'right-top',
+          'left-top',
+          'center-top',
+          'right-bottom',
+          'left-bottom',
+          'center-bottom',
+        ],
+      },
+    },
   },
 } as Meta<typeof Toast>;
 
-export const TopToasts = (props: ToastProps) => {
-  return (
-    <ToastProvider
-      container={document.body}
-      anchorOrigin={{
-        horizontal: props.horizontal,
-        vertical: 'top',
-      }}>
-      <ToastComponent {...props} />
-    </ToastProvider>
-  );
-};
-
-export const BottomToasts = (props: ToastProps) => {
+export const Main = (props: ToastProps) => {
   return (
-    <ToastProvider
-      container={document.body}
-      anchorOrigin={{
-        horizontal: props.horizontal,
-        vertical: 'bottom',
-      }}>
+    <ToastProvider container={document.body}>
       <ToastComponent {...props} />
     </ToastProvider>
   );

package/src/components/Toast/Toast.styles.ts

@@ -7,18 +7,7 @@ const toastOpacity = keyframes({
 });
 
 export const ToastContentContainer = styled('div', {
-  variants: {
-    horizontal: {
-      right: {
-        right: 12,
-        animation: `${toastOpacity} .7s`,
-      },
-      left: {
-        left: 12,
-        animation: `${toastOpacity} .7s`,
-      },
-    },
-  },
+  animation: `${toastOpacity} .7s`,
 });
 
 export const ToastContainer = styled('div', {
@@ -28,20 +17,31 @@ export const ToastContainer = styled('div', {
   gap: '$4',
   flexDirection: 'column',
   variants: {
-    horizontal: {
-      right: {
+    position: {
+      'right-top': {
         right: 12,
+        top: 2,
       },
-      left: {
+      'right-bottom': {
+        right: 12,
+        bottom: 2,
+      },
+      'left-top': {
         left: 12,
+        top: 2,
       },
-    },
-
-    vertical: {
-      top: {
+      'left-bottom': {
+        left: 12,
+        bottom: 2,
+      },
+      'center-top': {
+        left: '50%',
+        transform: 'translateX(-50%)',
         top: 2,
       },
-      bottom: {
+      'center-bottom': {
+        left: '50%',
+        transform: 'translateX(-50%)',
         bottom: 2,
       },
     },
@@ -53,36 +53,73 @@ export const AlertBox = styled('div', {
   borderRadius: '$sm',
   width: '292px',
   minHeight: '52px',
-  backgroundColor: '$background',
-  borderRight: '1px solid',
-  [`.${darkTheme} &`]: {
-    backgroundColor: '#070917',
-  },
-  '&:hover': {
-    backgroundColor: '$info100',
-    [`.${darkTheme} &`]: {
-      backgroundColor: '#111733',
-    },
-  },
   variants: {
+    variant: {
+      custom: {
+        backgroundColor: '$background',
+        borderRight: '1px solid',
+        '&:hover': {
+          backgroundColor: '$info100',
+          [`.${darkTheme} &`]: {
+            backgroundColor: '$neutral300',
+          },
+        },
+      },
+      standard: {
+        '& ._alert': {
+          padding: '$10',
+          width: '100%',
+          justifyContent: 'center',
+          alignItems: 'center',
+        },
+      },
+    },
     type: {
-      error: {
+      error: {},
+      success: {},
+      warning: {},
+      info: {},
+      loading: {},
+    },
+  },
+  compoundVariants: [
+    {
+      variant: 'custom',
+      type: 'error',
+
+      css: {
         borderRightColor: '$error500',
       },
-      success: {
+    },
+    {
+      variant: 'custom',
+      type: 'success',
+      css: {
         borderRightColor: '$success500',
       },
-      warning: {
+    },
+    {
+      variant: 'custom',
+      type: 'warning',
+      css: {
         borderRightColor: '$warning500',
       },
-      info: {
+    },
+    {
+      variant: 'custom',
+      type: 'info',
+      css: {
         borderRightColor: '$info500',
       },
-      loading: {
+    },
+    {
+      variant: 'custom',
+      type: 'loading',
+      css: {
         borderRightColor: '$info500',
       },
     },
-  },
+  ],
 });
 
 export const AlertFlexContainer = styled('div', {
@@ -108,6 +145,5 @@ export const StyledTypography = styled(Typography, {
 
 export const ToastStoryContainer = styled('div', {
   display: 'flex',
-  justifyContent: 'center',
   alignItems: 'center',
 });