ChannelMailPopup

이메일 발송을 위한 팝업 모달 컴포넌트

개요

ChannelMailPopup은 발신자, 수신자, 제목, 본문 폼 필드를 제공하는 UI 전용 이메일 발송 모달입니다. 모든 비즈니스 로직(API 호출, 유효성 검증)은 외부에서 처리합니다.

open prop으로 모달을 제어하고, 폼 데이터는 각 필드의 value/onChange 쌍으로 관리합니다.

errors prop으로 필드별 유효성 검증 결과를 표시합니다.

sendLoading=true이면 Send 버튼에 로딩 스피너가 표시되고 클릭이 차단됩니다.

title, label, button 텍스트를 한국어 등으로 커스터마이징할 수 있습니다.

Prop	Type	Default	설명
`open`	`boolean`	`false`	모달 열림 상태
`onClose`	`() => void`	-	닫기 이벤트 콜백
`title`	`string`	`"Send Email"`	팝업 제목
`sender`	`string`	`""`	발신자 이메일
`onSenderChange`	`(value: string) => void`	-	발신자 변경 콜백
`receiver`	`string[]`	`[]`	선택된 수신자 목록
`onReceiverChange`	`(value: string[]) => void`	-	수신자 변경 콜백
`receiverList`	`SelectOption[]`	`[]`	수신자 선택 가능 목록
`subject`	`string`	`""`	메일 제목
`onSubjectChange`	`(value: string) => void`	-	제목 변경 콜백
`contents`	`string`	`""`	메일 본문
`onContentsChange`	`(value: string) => void`	-	본문 변경 콜백
`sendLoading`	`boolean`	`false`	발송 버튼 로딩 상태
`onSend`	`() => void`	-	발송 버튼 클릭 콜백
`visible`	`boolean`	`true`	컴포넌트 표시 여부
`errors`	`ChannelMailPopupErrors`	-	필드별 에러 메시지
`className`	`string`	-	모달 컨텐츠 영역 className
`sendLabel`	`string`	`"Send"`	발송 버튼 텍스트
`closeLabel`	`string`	`"Close"`	닫기 버튼 텍스트
`senderLabel`	`string`	`"Sender"`	발신자 필드 레이블
`receiverLabel`	`string`	`"Receiver"`	수신자 필드 레이블
`subjectLabel`	`string`	`"Subject"`	제목 필드 레이블
`contentsLabel`	`string`	`"Contents"`	본문 필드 레이블
`children`	`ReactNode`	-	Footer 영역 커스텀


interface ChannelMailPopupErrors {
  sender?: string
  receiver?: string
  subject?: string
  contents?: string
}