TrendChart
visualCard + AreaChart 조합. 제목과 설명이 있는 카드 내에 추세 차트를 표시합니다.
컴포넌트 의존 관계
깊이
100%
Basic Usage
Revenue Trend
Monthly revenue and profit
Single Series
Weekly Visitors
Number of unique visitors per day
With Header Actions
Sales Overview
Last 6 months
Custom Height
height=200
Compact Chart
테스트 커버리지
2026년 2월 4일생성된 테스트 결과를 찾지 못했습니다.
TrendChart 항목이 문서 메타에 연결되어 있지만 현재 생성 파일에는 없습니다.
테스트를 추가한 뒤 `bun run generate:test-results`를 실행하거나 `testDescribe` 매핑을 다시 확인하세요.
TrendChart Props
| Prop | 타입 | 기본값 | 설명 |
|---|---|---|---|
title* | string | — | 차트 제목 |
description | string | — | 차트 설명 |
data* | ChartDataPoint[] | — | 차트 데이터 배열 |
series* | ChartSeriesDef[] | — | 시리즈 정의 |
height | number | 250 | 차트 높이 |
chartProps | Omit<AreaChartProps, 'data' | 'series' | 'height'> | — | AreaChart 추가 props |
headerRight | ReactNode | — | 헤더 우측 커스텀 콘텐츠 |
Import
tsx
import { TrendChart } from "@reopt-ai/opt-ui";