cerc-io/snowballtools-base-old
16
0
Fork 0
mirror of https://github.com/snowball-tools/snowballtools-base synced 2024-11-17 23:49:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

🔧 chore: use framer-motion

Browse Source
This commit is contained in:
Andre H 2024-02-22 14:22:29 +07:00
parent c8a153ad27
commit 1cd60d84dd
1 changed files with 11 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
packages/frontend/src/components/shared/Toast/SimpleToast.tsx
View File

@ -1,6 +1,7 @@
import React, { useMemo } from 'react';
import * as ToastPrimitive from '@radix-ui/react-toast';
import { ToastProps } from '@radix-ui/react-toast';
import { motion } from 'framer-motion';
import { simpleToastTheme, type SimpleToastTheme } from './SimpleToast.theme';
import {
LoadingIcon,
@ -11,7 +12,6 @@ import {
} from 'components/shared/CustomIcon';
import { Button, ButtonBaseProps, ButtonTheme } from 'components/shared/Button';
import { cloneIcon } from 'utils/cloneIcon';
import { cn } from 'utils/classnames';
interface CtaProps extends ButtonBaseProps, ButtonTheme {
buttonLabel: string;
@ -72,14 +72,22 @@ export const SimpleToast = ({
return (
<ToastPrimitive.Root {...props} asChild>
<div className={wrapperCls({ class: cn(className) })}>
<motion.li
animate={{
y: 'var(--radix-toast-swipe-move-y, 0)',
opacity: 1,
}}
className={wrapperCls({ class: className })}
exit={{ y: '100%', opacity: 0 }}
initial={{ y: '100%', opacity: 0 }}
>
{cloneIcon(Icon, { className: iconCls() })}
<ToastPrimitive.Title asChild>
<p className={titleCls()}>{title}</p>
</ToastPrimitive.Title>
{renderCta}
{renderCloseButton}
</div>
</motion.li>
</ToastPrimitive.Root>
);
};