AssetDashboardTimeline

Adopted在本 repo 設計、production 已採用。站上是設計端的版本，production 實作可能已再調整。

Production：src/components/AssetPrediction/source/AssetDashboardTimeline/AssetDashboardTimeline.tsx

Installation

import { AssetDashboardTimeline } from "@/components/product/asset-dashboard-timeline/asset-dashboard-timeline";

Overview

資產 dashboard hero 圖表切換的另一半：走到今天的價格歷史，接著是各結算日上市場給的價格。跟 K 線圖二選一，由 hero 的圖型切換鈕控制。

它就是 AssetPriceTimeline 的放大版（2026-08-18 user 裁決）：size="hero"，其他什麼都沒有。在那之前這裡是同一張圖的第二份 652 行實作，自己的資料模組、自己的比例（歷史佔 62% 而不是 40%）、自己的軸（右邊標結算日、y 軸在圖外）、自己的記號。同一個資產的兩張圖對「一個記號是什麼意思」各說各話，本來就是要解決的問題； dashboard 要的是更大的同一張圖，不是另一張圖。

放大版比卡片版多的，就是尺寸真的買得起的那幾樣，而且它們現在住在共用組件的 hero size 裡，所以 trending 卡不可能跟它們不一致：

圖例一排：Historical price / Market-implied center
歷史線下的漸層
today 虛線頂端標 Now
plot 高度 300（卡片是 140 / 190）

其餘一律與卡片版逐項相同：today 固定在寬度 40%、y 軸標籤在圖內的 grid line 上、兩半的 x 軸都走月份、未來是虛線接空心圓、最後一點標收盤價。跟著一起消失的是結算日軸標、62% 分割，以及歷史線上的實心已結算圓點—— 那個記號同日從兩張圖一起移除，因為歷史線畫的是資產自己的價格，已結算的 market 不是價格。

歷史那半邊改成連續 hover：滑到哪就讀哪一天的收盤，游標落點畫一顆實心圓，chip 寫「價格 · 日期」。未來那半邊維持入口語法。

未來那半邊的記號是入口：hover 出 chip、點下去開 market preview。 hit area 是時間帶不是點 —— 每檔 market 擁有軸上一段，切在相鄰兩檔的中點，整條 band 全高可點。歷史那半邊同理，整個左半是一塊 hit area：垂直方向任一高度都算數，不需要瞄準線本身。

線、面積、記號一律 brand —— 同一個資產的價格沒有極性。格線 / Now / 軸走中性--color-data-*，這張圖永遠不會有綠紅。

x 軸是分段的：不論選哪個區間，歷史固定佔左 40%、未來分右邊 60%。所以 1M 與 1Y 的未來都讀得到，但跨過 Now 的斜率不是速率，不可以那樣讀。