reopt design
DocsExploreTemplatesCanvasToolsPricing
로그인
opt-uiopt-chartsopt-datagridopt-editoropt-calendaropt-filemanageropt-chatopt-shellbrandapp-ui
Overview205Core74Shells99Blocks32
ExportButton
reopt designreopt design

AI 시대를 위한 디자인 시스템

  • 문서
  • 가격
  • 릴리즈 노트
  • 소개
  • 문의
  • 서비스 약관
  • 개인정보처리방침

주식회사 리옵트사업자등록번호 217-88-02453contact@reopt.ai

© 2026 reopt Inc. All rights reserved.

ExportButton

셸

데이터 내보내기 버튼. CSV/JSON 변환 내장, PDF는 콜백 위임. DropdownMenu 기반.

analytics
관련 문서
bun add @reopt-ai/opt-ui
설치 및 가져오기
bash
bun add @reopt-ai/opt-ui
tsx
import { ExportButton } from "@reopt-ai/opt-ui";

라이브 미리보기

화면 너비와 테마를 바꾸고 컴포넌트를 직접 조작해 보세요.

100%

기본 사용

ExportButton

Prop타입기본값설명
data필수Record<string, unknown>[]—내보낼 데이터 배열
columnsExportColumn[]—컬럼 매핑 (key → header)
fileNamestring"export"파일 이름
formatsExportFormat[]["csv", "json"]지원 포맷
onExport(format: ExportFormat) => void—커스텀 내보내기 핸들러

컴포넌트 의존 관계

깊이
▼ USES (2)ExportButtondropdown-menubutton
테스트 결과 자세히 보기

테스트 커버리지

2026년 7월 9일2/2 통과
2성공
0실패
2전체
  • Export 버튼을 렌더링한다
  • 클릭 시 포맷 옵션을 표시한다

관련 컴포넌트

opt-ui

DashboardGrid

Shells

Composite 기반 통계 카드 그리드. 유효한 1–4열 레이아웃과 화살표 키 2D 탐색을 지원합니다.

opt-ui

ReportBuilder

Shells

리포트 빌더. 레이블이 연결된 4단계 위저드 (차트 타입 → 데이터 설정 → 스타일 → 미리보기).

opt-ui

InsightsPanel

Shells

이상 탐지 인사이트 패널. severity별 카드, 통계 필터, dismiss 기능, 검출 설정(유형/Z-score/days).

opt-ui

TimeRangeSelector

Shells

시간 범위 선택기. Popover + DateRangePicker + 프리셋 버튼 조합. 12개 시계열 Surface에서 사용.

opt-ui

SummaryRow

Shells

통계 요약 행. StatCard 그리드 레이아웃을 표준화합니다. loading 시 SkeletonCard 표시.

opt-ui

ScoreBreakdown

Shells

합성 점수를 축별로 분해해 보여준다. 총점과 함께 각 축의 값·가중치·의미를 노출해 '43'을 판정이 아니라 발견으로 만든다.

이전TimeRangeSelector다음SummaryRow