🍞 Toast

작업 성공/실패를 방해 없이 알리는 비침습 알림. 화면 오른쪽 하단 스택.

라이브 데모

Setup

// root.tsx (또는 최상위 layout)
import { ToastProvider } from "~/features/common";

export default function Root() {
    return (
        <ToastProvider>
            <Outlet />
        </ToastProvider>
    );
}

// 임의 화면에서
import { useToast } from "~/features/common";
const toast = useToast();
toast.success("저장되었습니다.");