What for?
유저의 의사를 재확인하고 싶을 때 띄우는 컴포넌트입니다.
기존에는 취소, 확인 버튼에 특정 핸들러를 달아주고 싶을 때 그러지 못하는 문제가 있었으나, 지금은 두 버튼을 활용처에서 임의로 커스텀한 뒤 보내줄 수 있습니다.
Prop Info
emoji: string; // 이모지 content: string; // 의사 확인 문구 contentFontSize: number; // 의사 확인 문구의 폰트 크기 nextPageLink: string; // '확인' 버튼 클릭시 이동할 페이지 링크 CancelButton: React.ReactNode; // 취소 버튼 ConfirmButton: React.ReactNode; // 확인 버튼
Usage Example
<Confirm emoji={'🧘🏻'} content={'정말 명상을 끝내시겠어요?'} contentFontSize={18} nextPageLink={'/'} CancelButton={ <Button label={'취소'} width={120} height={50} dark={false} bold={true} handleClick={() => console.log('cancel')} /> } ConfirmButton={ <Button label={'끝내기'} width={120} height={50} dark={true} bold={true} /> } />
결과
결과 (취소 버튼 클릭 시)
