28 lines
806 B
TypeScript
28 lines
806 B
TypeScript
|
|
'use client';
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 완료 토스트/뱃지 컴포넌트
|
||
|
|
*
|
||
|
|
* 검은색 라운드 배지, 상단 중앙 표시
|
||
|
|
* 3초 후 자동 fade out
|
||
|
|
*/
|
||
|
|
|
||
|
|
import { CheckCircle2 } from 'lucide-react';
|
||
|
|
import type { CompletionToastInfo } from './types';
|
||
|
|
|
||
|
|
interface CompletionToastProps {
|
||
|
|
info: CompletionToastInfo;
|
||
|
|
}
|
||
|
|
|
||
|
|
export function CompletionToast({ info }: CompletionToastProps) {
|
||
|
|
return (
|
||
|
|
<div className="fixed top-4 left-1/2 -translate-x-1/2 z-50 animate-in fade-in slide-in-from-top-2 duration-300">
|
||
|
|
<div className="bg-gray-900 text-white px-6 py-3 rounded-full shadow-lg flex items-center gap-2">
|
||
|
|
<CheckCircle2 className="h-5 w-5 text-green-400" />
|
||
|
|
<span className="font-medium">
|
||
|
|
{info.orderNo} 완료! ({info.quantity}EA)
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|