@cassius0924/dsh-usage-dashboard 0.7.0 → 0.8.0

package/lib/client.js

@@ -26,6 +26,7 @@ __export(index_exports, {
   name: () => name
 });
 module.exports = __toCommonJS(index_exports);
+var import_react7 = require("react");
 
 // src/client/boundary.tsx
 var import_react = require("react");
@@ -317,7 +318,7 @@ var zh = {
   "delta.noBaseline": "\u65E0\u5BF9\u6BD4",
   "delta.flat": "\u6301\u5E73",
   "period.volume": "{tokens} tokens \xB7 {calls}",
-  "budget.unset": "\u8FD8\u6CA1\u8BBE\u7F6E\u6708\u5EA6\u9884\u7B97\uFF0C\u65E0\u6CD5\u63D0\u524D\u5224\u65AD\u662F\u5426\u4F1A\u8D85\u652F\u3002",
+  "budget.unset": "\u672A\u8BBE\u7F6E\u6708\u5EA6\u9884\u7B97\u3002",
   "budget.configure": "\u8BBE\u7F6E\u9884\u7B97",
   "budget.over": "\u5DF2\u8D85\u9884\u7B97 \xA5{amount}",
   "budget.forecastOver": "\u7167\u5F53\u524D\u901F\u5EA6\uFF0C\u9884\u8BA1\u8D85\u51FA \xA5{amount}",
@@ -340,7 +341,6 @@ var zh = {
   "pricing.unit": "\u5355\u4F4D\uFF1A{currency} / \u767E\u4E07 tokens\u3002",
   "pricing.splitNote": "\u9AD8\u5CF0\u65F6\u6BB5\u4E3A\u5317\u4EAC\u65F6\u95F4 {windows}\uFF08\u5468\u4E00\u81F3\u5468\u4E94\uFF09\uFF0C\u5176\u4F59\u4E3A\u95F2\u65F6\uFF08\u4EF7\u683C\u51CF\u534A\uFF09\uFF1B\u6BCF\u6761\u7528\u91CF\u6309\u53D1\u751F\u65F6\u523B\u751F\u6548\u7684\u5B98\u65B9\u4EF7\u683C\u4F30\u7B97\u3002",
   "pricing.visionNote": "\u56FE\u7247\u6309\u5C3A\u5BF8\u6298\u7B97 token\uFF0C\u4E0E\u6587\u672C\u4E00\u5E76\u8BA1\u8D39\u3002",
-  "pricing.modelNote": "deepseek-v4-flash\u3001deepseek-v4-flash-vision-exp \u662F\u65E7\u6A21\u578B\u540D\uFF0C\u73B0\u7531 deepseek-flash \u627F\u63A5\u5E76\u6309 Flash \u4EF7\u8BA1\u8D39\uFF1B2026-09-14 12:00 \u8D77 deepseek-v4-pro \u7684\u8BF7\u6C42\u4E5F\u4F1A\u8DEF\u7531\u5230 V4.1-Flash\uFF0C\u6309 Flash \u4EF7\u8BA1\u8D39\u3002",
   "pricing.unknown": "\u672A\u77E5\u6A21\u578B\u6309 deepseek-v4-pro \u8BA1\u4EF7\u3002",
   "coverage.noRange": "\u6682\u65E0\u6709\u6548\u7528\u91CF\u65F6\u95F4",
   "coverage.title": "\u7EDF\u8BA1\u8303\u56F4",
@@ -361,23 +361,19 @@ var zh = {
   "export.modelCsv": "\u9010\u6A21\u578B CSV",
   "export.fullJson": "\u5B8C\u6574 JSON",
   "export.jsonHint": "\u542B\u56FE\u8868\u4E0E\u6392\u884C",
-  "cache.empty": "\u8FD8\u6CA1\u6709 prompt token \u53EF\u7EDF\u8BA1\u7F13\u5B58\u547D\u4E2D\u3002",
+  "cache.empty": "\u6682\u65E0\u7F13\u5B58\u547D\u4E2D\u6570\u636E\u3002",
   "cache.rate": "\u7F13\u5B58\u547D\u4E2D\u7387",
   "cache.saved": "\u5DF2\u8282\u7701\u8D39\u7528\uFF08\u4F30\u7B97\uFF09",
   "cache.allMiss": "\u82E5\u5168\u90E8\u672A\u547D\u4E2D",
   "cache.aria": "\u7F13\u5B58\u547D\u4E2D {hit}%\uFF0C\u672A\u547D\u4E2D {miss}%",
   "cache.hitLegend": "\u7F13\u5B58\u547D\u4E2D {tokens}",
   "cache.missLegend": "\u672A\u547D\u4E2D {tokens}\uFF08\u6309\u672A\u547D\u4E2D\u4EF7\u8BA1\u8D39\uFF09",
-  "cache.lowHint": "\u547D\u4E2D\u7387\u504F\u4F4E\uFF1A\u9891\u7E41\u6539\u52A8 system prompt / \u5DE5\u5177\u5B9A\u4E49\u4F1A\u8BA9\u524D\u7F00\u7F13\u5B58\u5931\u6548\uFF0C\u628A\u7A33\u5B9A\u5185\u5BB9\u653E\u5728\u5BF9\u8BDD\u6700\u524D\u9762\u80FD\u63D0\u9AD8\u547D\u4E2D\u7387\u3002",
-  "cache.goodHint": "\u524D\u7F00\u7F13\u5B58\u628A\u91CD\u590D\u7684 prompt \u524D\u7F00\u6309\u547D\u4E2D\u4EF7\u8BA1\u8D39\uFF0C\u662F\u8FD9\u4EFD\u8D26\u5355\u4E0A\u6700\u5927\u7684\u7701\u94B1\u6760\u6746\u3002",
-  "peak.empty": "\u8FD8\u6CA1\u6709\u53EF\u6309\u65F6\u6BB5\u5F52\u7C7B\u7684\u7528\u91CF\u3002",
+  "peak.empty": "\u6682\u65E0\u7528\u91CF\u3002",
   "peak.aria": "\u9AD8\u5CF0\u65F6\u6BB5 {peak}%\uFF0C\u95F2\u65F6 {offPeak}%",
   "peak.peakLegend": "\u9AD8\u5CF0 {share}% \xB7 {tokens} tokens \xB7 {calls}",
   "peak.offPeakLegend": "\u95F2\u65F6 {share}% \xB7 {tokens} tokens \xB7 {calls}",
   "peak.shift": "\u82E5\u9AD8\u5CF0\u7528\u91CF\u90FD\u632A\u5230\u95F2\u65F6",
   "peak.saving": "\u53EF\u7701 \xA5{amount}",
-  "peak.schedule": "\u9AD8\u5CF0\u65F6\u6BB5\u4E3A\u5317\u4EAC\u65F6\u95F4 {windows}\uFF08\u5468\u4E00\u81F3\u5468\u4E94\uFF09\uFF0C\u95F2\u65F6\u4EF7\u683C\u51CF\u534A\u3002",
-  "peak.activeHint": "\u628A\u6279\u91CF\u3001\u53EF\u5EF6\u540E\u7684\u4EFB\u52A1\u653E\u5230\u95F2\u65F6\u8DD1\uFF0C\u540C\u6837\u7684 token \u53EA\u8981\u4E00\u534A\u7684\u94B1\u3002",
   "vision.empty": "{window}\u6CA1\u6709\u56FE\u7247\u8F93\u5165\u3002",
   "vision.title": "\u56FE\u7247 / \u591A\u6A21\u6001\u7528\u91CF",
   "vision.images": "\u56FE\u7247\u5F20\u6570",
@@ -385,7 +381,7 @@ var zh = {
   "vision.cost": "\u4F30\u7B97\u8D39\u7528",
   "vision.tokensShare": "\u5360\u8F93\u5165 {percent}%",
   "vision.costShare": "\u5360\u8D39\u7528 {percent}%",
-  "vision.note": "\u56FE\u7247\u6309\u5B98\u65B9\u6362\u7B97\u89C4\u5219\u4F30\u7B97\uFF1A\u5148\u6309\u6BD4\u4F8B\u7F29\u653E\uFF08\u4E0A\u9650 ~800\xD7800\u3001\u4E0B\u9650 384\xD7384\uFF09\uFF0Ctoken \u4E0E\u7F29\u653E\u540E\u9762\u79EF\u6210\u6B63\u6BD4\u3001\u6BCF\u5F20\u4E0A\u9650 384\uFF1B\u56FE\u7247\u5F52\u5C5E\u5230\u968F\u540E\u4E00\u6B21\u6A21\u578B\u8C03\u7528\uFF0C\u6309\u8BE5\u8C03\u7528\u7684\u65F6\u6BB5\u4E0E\u6A21\u578B\u5355\u4EF7\u4F30\u7B97\uFF0C\u5B9E\u9645\u4EE5\u63A5\u53E3\u8FD4\u56DE\u7684\u7528\u91CF\u4E3A\u51C6\u3002",
+  "vision.note": "\u6309\u5B98\u65B9\u89C4\u5219\u4F30\u7B97\uFF0C\u5B9E\u9645\u4EE5\u63A5\u53E3\u8FD4\u56DE\u7684\u7528\u91CF\u4E3A\u51C6\u3002",
   "vision.sessionsTitle": "\u56FE\u7247\u6700\u591A\u7684\u4F1A\u8BDD",
   "vision.sessionRow": "{images} \u5F20 \xB7 \xA5{cost}",
   "vision.dailyTitle": "{window} \xB7 \u6BCF\u5929\u56FE\u7247\u6570",
@@ -394,7 +390,7 @@ var zh = {
   "sessions.empty": "\u8FD8\u6CA1\u6709\u4EA7\u751F\u8D39\u7528\u7684\u4F1A\u8BDD\u3002",
   "sessions.detail": "{tokens} tokens \xB7 {calls} \xB7 {ago}",
   "sessions.share": "\u5360 {percent}%",
-  "sessions.more": "\u5171 {count} \u4E2A\u4F1A\u8BDD\u6709\u7528\u91CF\uFF0C\u4E0A\u9762\u662F\u6700\u8D35\u7684 {shown} \u4E2A\u3002",
+  "sessions.more": "\u5171 {count} \u4E2A\u4F1A\u8BDD\uFF0C\u663E\u793A\u6700\u8D35\u7684 {shown} \u4E2A\u3002",
   "sessions.fallbackTitle": "\u4F1A\u8BDD {id}",
   "models.empty": "\u8FD8\u6CA1\u6709\u53EF\u5F52\u7C7B\u7684\u6A21\u578B\u7528\u91CF\u3002",
   "models.shareAria": "{name} \u5360\u603B\u8D39\u7528 {percent}%",
@@ -421,9 +417,9 @@ var zh = {
   "chart.dimensionLabel": "\u5207\u6362\u56FE\u8868\u7EF4\u5EA6",
   "chart.daily": "\u9010\u5929",
   "chart.hourly": "\u9010\u5C0F\u65F6",
-  "chart.noWindowData": "{window}\u6CA1\u6709\u7528\u91CF\u8BB0\u5F55\uFF0C\u6362\u4E2A\u66F4\u957F\u5468\u671F\u770B\u770B\u3002",
+  "chart.noWindowData": "{window}\u6CA1\u6709\u7528\u91CF\u8BB0\u5F55\u3002",
   "chart.heatmapTitle": "\u8FD1\u4E00\u5E74 \xB7 \u6BCF\u65E5",
-  "chart.empty": "\u8FD8\u6CA1\u6709\u7528\u91CF\u8BB0\u5F55\u3002\u5728 DSH \u91CC\u8DD1\u4E00\u8F6E\u5BF9\u8BDD\uFF0C\u8FD9\u91CC\u4F1A\u51FA\u73B0\u9010\u5929 / \u9010\u5C0F\u65F6\u7EDF\u8BA1\u4E0E\u8D39\u7528\u4F30\u7B97\u3002",
+  "chart.empty": "\u8FD8\u6CA1\u6709\u7528\u91CF\u8BB0\u5F55\u3002",
   "chart.hourPoint": "{hour} \u70B9",
   "chart.tooltip": "{head} \xB7 {tokens} tokens \xB7 \xA5{cost} \xB7 {calls}",
   "chart.less": "\u5C11",
@@ -489,7 +485,7 @@ var zh = {
   "balance.overYear": "> 365 \u5929",
   "balance.noRunway": "\u8FD1 {days} \u5929\u6CA1\u6709\u7528\u91CF\uFF0C\u65E0\u6CD5\u4F30\u7B97",
   "balance.runwayTitle": "\u6309\u8FD1 {days} \u5929\u65E5\u5747 \xA5{cost} \u4F30\u7B97\uFF08\u542B\u65E0\u7528\u91CF\u7684\u65E5\u5B50\uFF1B\u4ECA\u5929\u5C1A\u672A\u8FC7\u5B8C\uFF09",
-  "balance.empty": "\u8BFB\u4E0D\u5230\u4F59\u989D\u3002\u8BF7\u786E\u8BA4\u8D26\u53F7\u5DF2\u767B\u5F55\uFF0C\u6216\u5728\u300C\u8BBE\u7F6E \u2192 \u6A21\u578B\u300D\u4E2D\u586B\u5199 DEEPSEEK_API_KEY\uFF0C\u7136\u540E\u70B9\u53F3\u4E0A\u89D2\u5237\u65B0\u3002",
+  "balance.empty": "\u8BFB\u4E0D\u5230\u4F59\u989D\uFF0C\u8BF7\u68C0\u67E5\u8D26\u53F7\u767B\u5F55\u6216 API Key \u540E\u5237\u65B0\u3002",
   "sessionUsage.title": "\u5F53\u524D\u4F1A\u8BDD\u6D88\u8017",
   "common.estimated": "\u8D39\u7528\u4E3A\u4F30\u7B97",
   "sessionUsage.cost": "\u8D39\u7528",
@@ -497,7 +493,7 @@ var zh = {
   "sessionUsage.calls": "\u8C03\u7528\u6B21\u6570",
   "sessionUsage.range": "\u6D3B\u8DC3\u65F6\u95F4 {range}",
   "sessionUsage.single": "{model} \xB7 \u8F93\u5165 {input} / \u8F93\u51FA {output} / \u7F13\u5B58 {cache}",
-  "sessionUsage.empty": "\u8FD9\u4E2A\u4F1A\u8BDD\u8FD8\u6CA1\u6709\u4EA7\u751F\u7528\u91CF\u3002\u53D1\u4E00\u6761\u6D88\u606F\u540E\uFF0C\u8FD9\u91CC\u4F1A\u663E\u793A\u8FD9\u4E2A\u4F1A\u8BDD\u4E13\u5C5E\u7684\u8D39\u7528\u4E0E\u6A21\u578B\u660E\u7EC6\u3002",
+  "sessionUsage.empty": "\u8FD9\u4E2A\u4F1A\u8BDD\u8FD8\u6CA1\u6709\u7528\u91CF\u3002",
   "overview.title": "\u6D88\u8017\u6982\u89C8",
   "overview.today": "\u4ECA\u65E5",
   "overview.month": "\u672C\u6708",
@@ -519,9 +515,9 @@ var zh = {
   "links.status": "\u670D\u52A1\u72B6\u6001",
   "settings.title": "\u8BBE\u7F6E",
   "settings.widget": "\u5728\u5176\u4ED6\u9875\u9762\u663E\u793A\u53F3\u4E0B\u89D2\u60AC\u6D6E\u989D\u5EA6\u7A97\u53E3",
-  "settings.widgetHint": "\u989D\u5EA6\u9875\u4F1A\u81EA\u52A8\u9690\u85CF\u6D6E\u7A97\uFF1B\u5176\u4ED6\u9875\u9762\u662F\u5426\u5C55\u793A\u7531\u4E0B\u65B9\u9009\u62E9\u51B3\u5B9A\u3002",
+  "settings.widgetHint": "\u989D\u5EA6\u9875\u81EA\u52A8\u9690\u85CF\uFF1B\u5176\u4ED6\u9875\u9762\u6309\u4E0B\u65B9\u9009\u62E9\u663E\u793A\u3002",
   "settings.widgetTabs": "\u5C55\u793A\u6D6E\u7A97\u7684\u9875\u9762",
-  "settings.widgetTabsHint": "\u9875\u9762\u5217\u8868\u6765\u81EA DSH \u7684\u5B9E\u65F6 Tab \u6CE8\u518C\u8868\uFF1B\u5176\u4ED6\u63D2\u4EF6\u65B0\u589E\u7684 Tab \u4E5F\u4F1A\u81EA\u52A8\u51FA\u73B0\u5728\u8FD9\u91CC\u3002",
+  "settings.widgetTabsHint": "\u5217\u8868\u4F1A\u968F\u5DF2\u5B89\u88C5\u7684\u9875\u9762\u81EA\u52A8\u66F4\u65B0\u3002",
   "settings.widgetTabsEmpty": "\u5F53\u524D\u6CA1\u6709\u53EF\u914D\u7F6E\u7684\u4F1A\u8BDD\u9875\u9762\u3002",
   "settings.lowBalance": "\u4F59\u989D\u9884\u8B66\u7EBF",
   "settings.lowBalanceOn": "\u4F59\u989D\u4F4E\u4E8E {amount} {currency} \u65F6\uFF0C\u8FD9\u91CC\u548C\u60AC\u6D6E\u7A97\u90FD\u4F1A\u8F6C\u4E3A\u8B66\u793A\u8272\u3002\u586B 0 \u5173\u95ED\u3002",
@@ -529,6 +525,18 @@ var zh = {
   "settings.monthlyBudget": "\u6708\u5EA6\u9884\u7B97",
   "settings.monthlyBudgetOn": "\u6309\u5317\u4EAC\u65F6\u95F4\u81EA\u7136\u6708\u8DDF\u8E2A {amount} CNY \u9884\u7B97\uFF0C\u5E76\u5728\u6D88\u8017\u6982\u89C8\u9884\u6D4B\u6708\u5E95\u82B1\u8D39\u3002\u586B 0 \u5173\u95ED\u3002",
   "settings.monthlyBudgetOff": "\u586B\u4E00\u4E2A\u5927\u4E8E 0 \u7684\u91D1\u989D\uFF0C\u6D88\u8017\u6982\u89C8\u4F1A\u663E\u793A\u8FDB\u5EA6\u4E0E\u6708\u5E95\u9884\u6D4B\u3002",
+  "settings.sidebarEntry": "\u4FA7\u8FB9\u680F\u989D\u5EA6\u5165\u53E3",
+  "settings.sidebarEntryHint": "\u5728\u4FA7\u8FB9\u680F\u9876\u90E8\u6216\u5E95\u90E8\u653E\u4E00\u4E2A\u300C\u989D\u5EA6\u300D\u5165\u53E3\uFF0C\u6253\u5F00\u8D26\u6237\u7EA7\u989D\u5EA6\u9875\u3002",
+  "settings.sidebarEntryOff": "\u5173\u95ED",
+  "settings.sidebarEntryTop": "\u9876\u90E8",
+  "settings.sidebarEntryBottom": "\u5E95\u90E8",
+  "settings.tabPosition": "\u300C\u989D\u5EA6\u300D\u6807\u7B7E\u4F4D\u7F6E",
+  "settings.tabPositionHint": "\u62D6\u52A8\u300C\u989D\u5EA6\u300D\u8C03\u6574\u6807\u7B7E\u4F4D\u7F6E\u3002",
+  "settings.tabDragAria": "\u62D6\u52A8\u300C\u989D\u5EA6\u300D\u8C03\u6574\u6807\u7B7E\u4F4D\u7F6E",
+  "settings.tabMoveEarlier": "\u524D\u79FB",
+  "settings.tabMoveLater": "\u540E\u79FB",
+  "panel.caption": "\u8D26\u6237\u7EA7 \xB7 \u8DE8\u5168\u90E8\u4F1A\u8BDD",
+  "panel.openAria": "\u6253\u5F00\u989D\u5EA6\u9875",
   "widget.updatedNow": "\u521A\u521A\u66F4\u65B0",
   "widget.stale": "{minutes} \u5206\u949F\u524D\u7684\u6570\u636E\uFF0C\u70B9 \u21BB \u66F4\u65B0",
   "widget.loading": "\u67E5\u8BE2\u4E2D\u2026",
@@ -578,7 +586,7 @@ var en = {
   "delta.noBaseline": "No baseline",
   "delta.flat": "No change",
   "period.volume": "{tokens} tokens \xB7 {calls}",
-  "budget.unset": "Set a monthly budget to see whether current spending is on track.",
+  "budget.unset": "No monthly budget set.",
   "budget.configure": "Set budget",
   "budget.over": "Over budget by \xA5{amount}",
   "budget.forecastOver": "At this pace, \xA5{amount} over by month-end",
@@ -601,7 +609,6 @@ var en = {
   "pricing.unit": "Unit: {currency} / million tokens. ",
   "pricing.splitNote": "Peak periods are {windows} Beijing time, Monday to Friday; off-peak rates are half price. Each record is estimated at the official rates in force when it was written. ",
   "pricing.visionNote": "Images are converted to tokens by size and charged together with text. ",
-  "pricing.modelNote": "deepseek-v4-flash and deepseek-v4-flash-vision-exp are legacy names, now served by deepseek-flash at Flash rates; from 2026-09-14 12:00 deepseek-v4-pro requests are routed to V4.1-Flash and billed at Flash rates. ",
   "pricing.unknown": "Unknown models use deepseek-v4-pro rates.",
   "coverage.noRange": "No valid usage timestamps",
   "coverage.title": "Coverage",
@@ -622,23 +629,19 @@ var en = {
   "export.modelCsv": "Model CSV",
   "export.fullJson": "Full JSON",
   "export.jsonHint": "Charts and rankings included",
-  "cache.empty": "No prompt tokens are available for cache analysis yet.",
+  "cache.empty": "No cache data yet.",
   "cache.rate": "Cache hit rate",
   "cache.saved": "Estimated savings",
   "cache.allMiss": "Cost with no hits",
   "cache.aria": "{hit}% cache hits, {miss}% misses",
   "cache.hitLegend": "Cache hits {tokens}",
   "cache.missLegend": "Misses {tokens} (charged at miss rate)",
-  "cache.lowHint": "Low hit rate: frequent changes to the system prompt or tool definitions invalidate prefix caching. Put stable content first to improve reuse.",
-  "cache.goodHint": "Prefix caching charges repeated prompt prefixes at the hit rate, making it the largest saving lever on this bill.",
-  "peak.empty": "No usage can be classified by pricing period yet.",
+  "peak.empty": "No usage yet.",
   "peak.aria": "{peak}% peak, {offPeak}% off-peak",
   "peak.peakLegend": "Peak {share}% \xB7 {tokens} tokens \xB7 {calls}",
   "peak.offPeakLegend": "Off-peak {share}% \xB7 {tokens} tokens \xB7 {calls}",
   "peak.shift": "If all peak usage moved off-peak",
   "peak.saving": "Save \xA5{amount}",
-  "peak.schedule": "Peak periods are {windows} Beijing time, Monday to Friday; off-peak rates are half price. ",
-  "peak.activeHint": "Run batch or delay-tolerant work off-peak to pay half as much for the same tokens.",
   "vision.empty": "No image input in {window}.",
   "vision.title": "Image / multimodal usage",
   "vision.images": "Images",
@@ -646,7 +649,7 @@ var en = {
   "vision.cost": "Estimated cost",
   "vision.tokensShare": "{percent}% of input",
   "vision.costShare": "{percent}% of cost",
-  "vision.note": "Images are estimated with the official rule: resized keeping aspect ratio (cap ~800\xD7800, floor 384\xD7384), tokens proportional to the resized area with a 384-token cap per image. Each image is attributed to the next model call and priced at that call's period and model rate; the provider usage numbers remain the source of truth.",
+  "vision.note": "Estimated with the official rule; provider usage numbers are the source of truth.",
   "vision.sessionsTitle": "Sessions with the most images",
   "vision.sessionRow": "{images} images \xB7 \xA5{cost}",
   "vision.dailyTitle": "{window} \xB7 images per day",
@@ -655,7 +658,7 @@ var en = {
   "sessions.empty": "No sessions have incurred cost yet.",
   "sessions.detail": "{tokens} tokens \xB7 {calls} \xB7 {ago}",
   "sessions.share": "{percent}% of total",
-  "sessions.more": "{count} sessions have usage; the {shown} most expensive are shown above.",
+  "sessions.more": "{count} sessions; showing the {shown} most expensive.",
   "sessions.fallbackTitle": "Session {id}",
   "models.empty": "No model usage can be classified yet.",
   "models.shareAria": "{name} accounts for {percent}% of total cost",
@@ -682,9 +685,9 @@ var en = {
   "chart.dimensionLabel": "Chart interval",
   "chart.daily": "Daily",
   "chart.hourly": "Hourly",
-  "chart.noWindowData": "No usage in {window}. Try a longer range.",
+  "chart.noWindowData": "No usage in {window}.",
   "chart.heatmapTitle": "Last 12 months \xB7 daily",
-  "chart.empty": "No usage yet. Run a conversation in DSH to see daily and hourly totals with cost estimates.",
+  "chart.empty": "No usage yet.",
   "chart.hourPoint": "{hour}:00",
   "chart.tooltip": "{head} \xB7 {tokens} tokens \xB7 \xA5{cost} \xB7 {calls}",
   "chart.less": "Less",
@@ -750,7 +753,7 @@ var en = {
   "balance.overYear": "> 365 days",
   "balance.noRunway": "No usage in the last {days} days, so runway cannot be estimated",
   "balance.runwayTitle": "Based on \xA5{cost} average daily spend over the last {days} days (including idle days; today is incomplete)",
-  "balance.empty": "Balance is unavailable. Sign in to your account or add DEEPSEEK_API_KEY under Settings \u2192 Models, then refresh.",
+  "balance.empty": "Balance is unavailable. Check your sign-in or API key, then refresh.",
   "sessionUsage.title": "Current session spend",
   "common.estimated": "Estimated cost",
   "sessionUsage.cost": "Cost",
@@ -758,7 +761,7 @@ var en = {
   "sessionUsage.calls": "Calls",
   "sessionUsage.range": "Active {range}",
   "sessionUsage.single": "{model} \xB7 input {input} / output {output} / cache {cache}",
-  "sessionUsage.empty": "No usage in this session yet. Send a message and this session\u2019s own cost and model breakdown will show up here.",
+  "sessionUsage.empty": "No usage in this session yet.",
   "overview.title": "Spend overview",
   "overview.today": "Today",
   "overview.month": "This month",
@@ -780,9 +783,9 @@ var en = {
   "links.status": "Service status",
   "settings.title": "Settings",
   "settings.widget": "Show the floating balance widget on other views",
-  "settings.widgetHint": "The widget always hides on Usage; choose its other views below.",
+  "settings.widgetHint": "Hidden on Usage; shown on the views selected below.",
   "settings.widgetTabs": "Show widget on",
-  "settings.widgetTabsHint": "This live list comes from DSH\u2019s tab registry, including tabs added by other plugins.",
+  "settings.widgetTabsHint": "Updates automatically as views are installed.",
   "settings.widgetTabsEmpty": "There are no configurable conversation views right now.",
   "settings.lowBalance": "Balance warning",
   "settings.lowBalanceOn": "This page and the widget turn amber below {amount} {currency}. Enter 0 to disable.",
@@ -790,6 +793,18 @@ var en = {
   "settings.monthlyBudget": "Monthly budget",
   "settings.monthlyBudgetOn": "Track a {amount} CNY budget by Beijing calendar month and forecast month-end spend. Enter 0 to disable.",
   "settings.monthlyBudgetOff": "Enter an amount above 0 to show progress and a month-end forecast.",
+  "settings.sidebarEntry": "Sidebar Usage entry",
+  "settings.sidebarEntryHint": "Add a Usage entry at the top or bottom of the sidebar; it opens the account-wide Usage page.",
+  "settings.sidebarEntryOff": "Off",
+  "settings.sidebarEntryTop": "Top",
+  "settings.sidebarEntryBottom": "Bottom",
+  "settings.tabPosition": "Usage tab position",
+  "settings.tabPositionHint": "Drag Usage to change its tab position.",
+  "settings.tabDragAria": "Drag Usage to change its tab position",
+  "settings.tabMoveEarlier": "Move earlier",
+  "settings.tabMoveLater": "Move later",
+  "panel.caption": "Account-wide \xB7 across all sessions",
+  "panel.openAria": "Open Usage",
   "widget.updatedNow": "Updated just now",
   "widget.stale": "Data from {minutes}m ago; press \u21BB to update",
   "widget.loading": "Loading\u2026",
@@ -1353,6 +1368,27 @@ var quotaViewActiveStore = {
   }
 };
 
+// src/client/layout-prefs.ts
+var QUOTA_PANEL_ID = "quota";
+var isPlacement = (value) => value === "off" || value === "top" || value === "bottom";
+var sidebarEntryStore = createStore("layout.sidebarEntry", isPlacement, "off");
+var isTabIndex = (value) => typeof value === "number" && Number.isInteger(value) && value >= 0 && value <= 50;
+var quotaTabIndexStore = createStore("layout.tabIndex", isTabIndex, 2);
+function clampTabIndex(index, count) {
+  return Math.max(0, Math.min(index, Math.max(count, 0)));
+}
+function viewOrderForIndex(entries, index, selfId = "balance", fallback = 20) {
+  const others = entries.filter((entry) => entry.options.id !== selfId);
+  if (others.length === 0) return fallback;
+  const clamped = clampTabIndex(index, others.length);
+  const orderAt = (position) => others[position]?.options.order ?? 0;
+  if (clamped === 0) return orderAt(0) - 10;
+  if (clamped === others.length) return orderAt(others.length - 1) + 10;
+  const previous = orderAt(clamped - 1);
+  const next = orderAt(clamped);
+  return previous >= next ? previous + 0.5 : (previous + next) / 2;
+}
+
 // src/client/dashboard.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
 var COMPOSER_FALLBACK_PX = 126;
@@ -1518,7 +1554,6 @@ function PricingNote(props) {
         t("pricing.unit", { currency: pricing.currency }),
         t("pricing.splitNote", { windows: pricing.peakWindows.join(t("common.listSeparator")) }),
         t("pricing.visionNote"),
-        t("pricing.modelNote"),
         t("pricing.unknown")
       ] })
     ] })
@@ -1780,8 +1815,7 @@ function CacheCard(props) {
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-legend-swatch dq-legend-swatch--miss" }),
         t("cache.missLegend", { tokens: fmtCompact(totals.input, locale) })
       ] })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "dq-cache-foot", children: low ? t("cache.lowHint") : t("cache.goodHint") })
+    ] })
   ] });
 }
 function VisionCard(props) {
@@ -1863,11 +1897,7 @@ function PeakCard(props) {
         fmt(split.offPeakEraCost),
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-peak-delta dq-peak-delta--save", children: t("peak.saving", { amount: fmt(shiftSaving) }) })
       ] })
-    ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("p", { className: "dq-peak-foot", children: [
-      t("peak.schedule", { windows: pricing.peakWindows.join(t("common.listSeparator")) }),
-      t("peak.activeHint")
-    ] })
+    ] }) })
   ] });
 }
 function agoText(ms, t) {
@@ -2118,6 +2148,11 @@ function BalanceDashboard(props) {
   const [selectedModels, setSelectedModels] = (0, import_react4.useState)([]);
   const [windowDays, setWindowDays] = (0, import_react4.useState)(usageWindowStore.get());
   const [chartMetric, setChartMetric] = (0, import_react4.useState)(chartMetricStore.get());
+  const [sidebarEntry, setSidebarEntry] = (0, import_react4.useState)(sidebarEntryStore.get());
+  (0, import_react4.useEffect)(() => sidebarEntryStore.subscribe(() => setSidebarEntry(sidebarEntryStore.get())), []);
+  const [tabDragging, setTabDragging] = (0, import_react4.useState)(false);
+  const [tabDropTarget, setTabDropTarget] = (0, import_react4.useState)(null);
+  const [retainedVision, setRetainedVision] = (0, import_react4.useState)(null);
   const [runwayHovering, setRunwayHovering] = (0, import_react4.useState)(false);
   const [runwayManuallyOpened, setRunwayManuallyOpened] = (0, import_react4.useState)(false);
   const [remainingHovering, setRemainingHovering] = (0, import_react4.useState)(false);
@@ -2290,6 +2325,71 @@ function BalanceDashboard(props) {
     setChartMetric(value);
     chartMetricStore.set(value);
   };
+  const changeSidebarEntry = (value) => {
+    setSidebarEntry(value);
+    sidebarEntryStore.set(value);
+  };
+  const balanceTabIndex = viewTabs.findIndex((tab) => tab.id === "balance");
+  const finalTabIndex = (target, after) => {
+    const gap = after ? target + 1 : target;
+    const dropped = balanceTabIndex >= 0 && gap > balanceTabIndex ? gap - 1 : gap;
+    return Math.max(0, Math.min(dropped, Math.max(viewTabs.length - 1, 0)));
+  };
+  const endTabDrag = () => {
+    setTabDragging(false);
+    setTabDropTarget(null);
+  };
+  const previewTabDropTarget = (index) => {
+    setTabDropTarget((prev) => prev === index ? prev : index);
+  };
+  const applyQuotaTabIndex = (index) => {
+    const next = Math.max(0, Math.min(index, Math.max(viewTabs.length - 1, 0)));
+    if (next === balanceTabIndex) return;
+    quotaTabIndexStore.set(next);
+    window.setTimeout(() => {
+      const chip = document.querySelector(".dq-tab-chip--current");
+      chip?.focus();
+    }, 80);
+  };
+  const dropQuotaTab = (target, after) => {
+    applyQuotaTabIndex(finalTabIndex(target, after));
+    endTabDrag();
+  };
+  const onQuotaTabDragStart = (event) => {
+    setTabDragging(true);
+    event.dataTransfer.effectAllowed = "move";
+    event.dataTransfer.setData("text/plain", "balance");
+  };
+  const onChipDragOver = (event, index) => {
+    if (!tabDragging) return;
+    event.preventDefault();
+    event.stopPropagation();
+    previewTabDropTarget(index);
+  };
+  const onChipDrop = (event, index) => {
+    if (!tabDragging) return;
+    event.preventDefault();
+    event.stopPropagation();
+    const rect = event.currentTarget.getBoundingClientRect();
+    dropQuotaTab(index, event.clientX > rect.left + rect.width / 2);
+  };
+  const onOrderDragOver = (event) => {
+    if (!tabDragging) return;
+    event.preventDefault();
+    if (event.target === event.currentTarget) previewTabDropTarget(viewTabs.length - 1);
+  };
+  const onOrderDrop = (event) => {
+    if (!tabDragging) return;
+    event.preventDefault();
+    if (event.target !== event.currentTarget) return;
+    applyQuotaTabIndex(viewTabs.length - 1);
+    endTabDrag();
+  };
+  const onQuotaTabKeyDown = (event) => {
+    if (event.key !== "ArrowLeft" && event.key !== "ArrowRight") return;
+    event.preventDefault();
+    applyQuotaTabIndex(balanceTabIndex + (event.key === "ArrowLeft" ? -1 : 1));
+  };
   const primary = balance !== null && balance.balances.length > 0 ? balance.balances[0] : null;
   const recentDays = (usage?.daily ?? []).slice(-7);
   const avgDailyCost = recentDays.length > 0 ? recentDays.reduce((sum, d) => sum + d.cost, 0) / recentDays.length : 0;
@@ -2300,6 +2400,26 @@ function BalanceDashboard(props) {
   const runwayTitle = daysLeft === null ? t("balance.noRunway", { days: recentDays.length || 7 }) : t("balance.runwayTitle", { days: recentDays.length, cost: fmt(avgDailyCost) });
   const activeWindow = usage?.windows.find((window2) => window2.days === windowDays) ?? null;
   const activeWindowName = windowName(windowDays, t);
+  const visionStats = activeWindow?.vision;
+  const visionOpen = usage !== null && activeWindow !== null && visionStats !== void 0 && visionStats.images > 0 && Array.isArray(activeWindow.visionDaily) && Array.isArray(activeWindow.visionSessions);
+  const visionPayload = (window2, stats, label) => ({
+    vision: stats,
+    daily: window2.visionDaily,
+    sessions: window2.visionSessions,
+    windowLabel: label,
+    inputTokens: window2.totals.input,
+    costTotal: window2.totals.cost
+  });
+  const liveVision = visionOpen && activeWindow !== null && visionStats !== void 0 ? visionPayload(activeWindow, visionStats, activeWindowName) : null;
+  (0, import_react4.useEffect)(() => {
+    if (visionOpen && activeWindow !== null && visionStats !== void 0) {
+      setRetainedVision(visionPayload(activeWindow, visionStats, activeWindowName));
+      return;
+    }
+    const timer = window.setTimeout(() => setRetainedVision(null), 320);
+    return () => window.clearTimeout(timer);
+  }, [visionOpen, activeWindow, activeWindowName]);
+  const shownVision = visionOpen ? liveVision : retainedVision;
   const dailyBars = (activeWindow?.daily ?? []).map((d) => ({
     label: windowDays === 365 ? d.date.slice(5).replace("-", "/") : d.date.slice(8, 10),
     value: chartMetricValue(chartMetric, d),
@@ -2524,34 +2644,6 @@ function BalanceDashboard(props) {
       ),
       usage !== null && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(PricingNote, { pricing: usage.pricing })
     ] }),
-    usage !== null && activeWindow !== null && activeWindow.vision !== void 0 && Array.isArray(activeWindow.visionDaily) && Array.isArray(activeWindow.visionSessions) ? (
-      // 窗口内没有图片时整张卡不出现：一行「没有图片输入」不值得一个小节的位置。
-      activeWindow.vision.images === 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { caption: activeWindowName, children: t("vision.title") }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          VisionCard,
-          {
-            vision: activeWindow.vision,
-            daily: activeWindow.visionDaily,
-            sessions: activeWindow.visionSessions,
-            windowLabel: activeWindowName,
-            inputTokens: activeWindow.totals.input,
-            costTotal: activeWindow.totals.cost
-          }
-        )
-      ] })
-    ) : usage === null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { caption: activeWindowName, children: t("vision.title") }),
-      loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-usage-totals", children: [64, 88, 72].map((w, i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w, h: 11 }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 72, h: 20 })
-      ] }, i)) }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("vision.empty", { window: activeWindowName }) })
-    ] }) : (
-      // Host serving a pre-vision payload (e.g. not restarted yet): hide the
-      // whole card instead of leaving a titled shell — it reappears as soon
-      // as the host half serves the new shape.
-      null
-    ),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card dq-card--primary", children: [
       /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card-head", children: [
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { children: t("usage.trendTitle") }),
@@ -2615,31 +2707,31 @@ function BalanceDashboard(props) {
             /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-legend-swatch", style: { background: s.color } }),
             s.name
           ] }, s.key)) })
-        ] }) : barMode === "daily" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Bars, { data: dailyBars, height: 160, labelEvery: dailyLabelEvery, minWidth: dailyMinWidth }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Bars, { data: hourlyBars, height: 140, labelEvery: 3 }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CoverageDiagnostics, { coverage: usage.coverage })
-      ] }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(UsageSkeleton, {}) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("chart.empty") })
+        ] }) : barMode === "daily" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Bars, { data: dailyBars, height: 160, labelEvery: dailyLabelEvery, minWidth: dailyMinWidth }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Bars, { data: hourlyBars, height: 140, labelEvery: 3 })
+      ] }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(UsageSkeleton, {}) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("chart.empty") }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-vision-inline", "data-open": visionOpen ? "true" : "false", "aria-hidden": !visionOpen, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-vision-inline-body", children: shownVision !== null && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-chart-title", children: [
+          t("vision.title"),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-chart-peak", children: shownVision.windowLabel })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          VisionCard,
+          {
+            vision: shownVision.vision,
+            daily: shownVision.daily,
+            sessions: shownVision.sessions,
+            windowLabel: shownVision.windowLabel,
+            inputTokens: shownVision.inputTokens,
+            costTotal: shownVision.costTotal
+          }
+        )
+      ] }) }) }),
+      usage !== null && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CoverageDiagnostics, { coverage: usage.coverage })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { caption: t("chart.heatmapTitle"), children: t("heatmap.title") }),
       usage !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Heatmap, { data: usage.heatmap }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(HeatmapSkeleton, {}) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("chart.empty") })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { children: t("peak.title") }),
-      usage !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(PeakCard, { split: usage.peakSplit, pricing: usage.pricing }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-peak-track" }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-peak-figures", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 120, h: 11 }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 96, h: 20 })
-        ] })
-      ] }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("peak.empty") })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { children: t("cache.title") }),
-      usage !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CacheCard, { totals: usage.totals }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-cache-figures", children: [60, 96, 72].map((w, i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w, h: 11 }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 72, h: 20 })
-      ] }, i)) }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("cache.empty") })
-    ] }),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { caption: activeWindowName, children: t("models.title") }),
       activeWindow !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ModelRanking, { models: modelList, totalCost: modelCostTotal, colorOf }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-rank", children: [0, 1].map((i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-rank-row", children: [
@@ -2656,6 +2748,25 @@ function BalanceDashboard(props) {
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 250, h: 11 })
       ] }, i)) }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("sessions.empty") })
     ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card-pair", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { children: t("peak.title") }),
+        usage !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(PeakCard, { split: usage.peakSplit, pricing: usage.pricing }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-peak-track" }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-peak-figures", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 120, h: 11 }),
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 96, h: 20 })
+          ] })
+        ] }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("peak.empty") })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { children: t("cache.title") }),
+        usage !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CacheCard, { totals: usage.totals }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-cache-figures", children: [60, 96, 72].map((w, i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w, h: 11 }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 72, h: 20 })
+        ] }, i)) }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("cache.empty") })
+      ] })
+    ] }),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { children: t("settings.title") }),
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-links-title", children: t("links.title") }),
@@ -2723,9 +2834,67 @@ function BalanceDashboard(props) {
           ),
           /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { id: "dq-monthly-budget-hint", className: "dq-setting-hint", children: monthlyBudget > 0 ? t("settings.monthlyBudgetOn", { amount: fmt(monthlyBudget) }) : t("settings.monthlyBudgetOff") })
         ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-setting", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("label", { className: "dq-setting-label", htmlFor: "dq-sidebar-entry", children: t("settings.sidebarEntry") }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-setting-control", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+            "select",
+            {
+              id: "dq-sidebar-entry",
+              className: "dq-select",
+              value: sidebarEntry,
+              onChange: (e) => changeSidebarEntry(e.target.value),
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "off", children: t("settings.sidebarEntryOff") }),
+                /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "top", children: t("settings.sidebarEntryTop") }),
+                /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "bottom", children: t("settings.sidebarEntryBottom") })
+              ]
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-setting-hint", children: t("settings.sidebarEntryHint") })
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-setting", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-setting-label", id: "dq-tab-order-label", children: t("settings.tabPosition") }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-setting-control", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+            "div",
+            {
+              className: "dq-tab-order",
+              role: "group",
+              "aria-labelledby": "dq-tab-order-label",
+              "aria-describedby": "dq-tab-order-hint",
+              onDragOver: onOrderDragOver,
+              onDrop: onOrderDrop,
+              children: viewTabs.map((tab, index) => {
+                const current = tab.id === "balance";
+                const dropTarget = tabDragging && !current && tabDropTarget === index;
+                return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+                  "span",
+                  {
+                    className: `dq-tab-chip${current ? " dq-tab-chip--current" : ""}${current && tabDragging ? " dq-tab-chip--dragging" : ""}${dropTarget ? " dq-tab-chip--drop-target" : ""}`,
+                    draggable: current,
+                    tabIndex: current ? 0 : void 0,
+                    role: current ? "button" : void 0,
+                    "aria-label": current ? t("settings.tabDragAria") : void 0,
+                    onDragStart: current ? onQuotaTabDragStart : void 0,
+                    onDragEnd: current ? endTabDrag : void 0,
+                    onDragOver: (event) => onChipDragOver(event, index),
+                    onDrop: (event) => onChipDrop(event, index),
+                    onKeyDown: current ? onQuotaTabKeyDown : void 0,
+                    children: tab.label
+                  },
+                  tab.id
+                );
+              })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { id: "dq-tab-order-hint", className: "dq-setting-hint", children: t("settings.tabPositionHint") })
+        ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "dq-footer", children: "@cassius0924/dsh-usage-dashboard v0.7.0" })
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "dq-footer", children: "@cassius0924/dsh-usage-dashboard v0.8.0" })
   ] });
 }
 
@@ -2822,10 +2991,10 @@ var css = `
    the input box \u2014 measured in dashboard.tsx as --dq-composer-w, capped at
    the reading-column width so wide viewports are unchanged. */
 .dq-balance{-webkit-text-size-adjust:100%;text-size-adjust:100%;box-sizing:border-box;width:100%;min-width:0;display:flex;flex-direction:column;gap:32px;padding:20px 24px 48px;max-width:min(860px,var(--dq-composer-w,860px));margin:0 auto;font-family:var(--dsw-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Helvetica,Arial,sans-serif);font-size:13px;line-height:1.5;font-variant-numeric:tabular-nums;color:var(--dsw-alias-label-primary,#1f2328);--dq-text-success:#1a7f37;--dq-text-success:color-mix(in oklab,var(--dsw-alias-state-success-primary,#2da44e) 52%,var(--dsw-alias-label-primary,#1f2328) 48%);--dq-text-warn:#9a6700;--dq-text-warn:color-mix(in oklab,var(--dsw-alias-state-warn-primary,#bf8700) 52%,var(--dsw-alias-label-primary,#1f2328) 48%);}
-@media (max-width:620px){.dq-balance{max-width:100%;gap:24px;padding:16px 12px calc(var(--dq-composer-h,126px) + 16px)}.dq-card,.dq-card--hero,.dq-status-row{padding:0 16px}.dq-card--primary{padding:16px}}
+@media (max-width:620px){.dq-balance{max-width:100%;gap:24px;padding:16px 12px calc(var(--dq-composer-h,126px) + 16px)}.dq-card{padding:16px}.dq-card--hero{padding:0 16px}.dq-status-row{padding:0 16px}}
 /* \u8F6E\u6B21 55\uFF1A\u53EA\u6709\u4E3B\u5361\u7247\u5E26\u6846\u3002\u6B21\u7EA7\u5206\u6790\u4E0E\u8BBE\u7F6E\u662F\u65E0\u6846\u5C0F\u8282\uFF0C\u9760 32px \u6BB5\u8DDD\u548C 13px \u4E3B\u8272\u6807\u9898\u5206\u7EC4\uFF1B
    \u5DE6\u53F3 20px \u5185\u8FB9\u8DDD\u8BA9\u5B83\u4EEC\u7684\u6587\u5B57\u8FB9\u4E0E\u4E3B\u5361\u7247\u5185\u6587\u5BF9\u9F50\uFF0C\u6574\u9875\u53EA\u6709\u4E00\u6761\u6587\u5B57\u5DE6\u8FB9\u7EBF\u3002 */
-.dq-card{box-sizing:border-box;min-width:0;max-width:100%;padding:0 20px}
+.dq-card{box-sizing:border-box;min-width:0;max-width:100%;padding:20px;background:var(--dsw-alias-bg-layer-1,#ffffff);border:1px solid var(--dsw-alias-border-l2,rgba(0,0,0,.10));border-radius:12px}
 .dq-card-title{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;font-size:15px;font-weight:600;line-height:1.4;color:var(--dsw-alias-label-primary,#1f2328);margin:0 0 16px;letter-spacing:0;text-wrap:balance}
 .dq-card-caption{font-size:12px;font-weight:400;color:var(--dsw-alias-label-secondary,#59636e)}
 .dq-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
@@ -2839,9 +3008,10 @@ var css = `
    \u6253\u5F00\u8FD9\u4E2A\u300C\u989D\u5EA6\u300Dtab \u65F6\u4E0A\u4E0B\u6587\u6700\u76F4\u63A5\u76F8\u5173\u7684\u6570\u5B57\uFF08\u8FD9\u4E2A tab \u6302\u5728\u5177\u4F53\u4F1A\u8BDD\u5185\u90E8\uFF0C\u89C1 DESIGN_NOTES\u300C\u4FE1\u606F\u5C42\u7EA7\u300D\uFF09\uFF0C
    \u4E0D\u5C5E\u4E8E\u539F\u6709\u8D26\u6237\u5168\u5C40\u5C42\u7EA7 1-3 \u7684\u4EFB\u4F55\u4E00\u7EA7\uFF0C\u800C\u662F\u4E0E\u4E4B\u6B63\u4EA4\u7684\u53E6\u4E00\u4E2A\u7EF4\u5EA6\uFF0C\u4F46\u540C\u6837\u662F\u9996\u5C4F\u5FC5\u8BFB\uFF0C\u56E0\u6B64\u540C\u6837\u7ED9
    primary \u6743\u91CD\uFF0C\u4E0D\u65B0\u5F00\u7B2C\u4E09\u6863\u3002 */
-.dq-card--primary{padding:20px;background:var(--dsw-alias-bg-layer-1,#ffffff);border:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.1));border-radius:12px}
+.dq-card--primary{padding:20px;border-color:var(--dsw-alias-border-l3,rgba(0,0,0,.12))}
 /* \u4F59\u989D\u662F\u6574\u9875\u552F\u4E00\u7684 hero\uFF1A\u4E0D\u5957\u6846\uFF0C32px \u6570\u5B57\u72EC\u5360\u4E00\u6863\uFF0C\u8BA9\u5B83\u5728\u906E\u4F4F\u6587\u5B57\u65F6\u4ECD\u662F\u7B2C\u4E00\u773C\u3002 */
-.dq-card--hero{padding:0 20px}
+.dq-card--hero{padding:0 20px;background:transparent;border:0;border-radius:0}
+.dq-card-pair{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr));gap:24px;min-width:0}
 .dq-card--hero .dq-stat-label{font-size:13px;margin-bottom:2px}
 .dq-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
 .dq-card--hero .dq-balance-grid{align-items:stretch;gap:12px 48px}
@@ -2849,6 +3019,7 @@ var css = `
 /* hero \u6570\u5B57\u4E0D\u753B\u70B9\u72B6\u4E0B\u5212\u7EBF\uFF0840px \u4E0B\u592A\u91CD\uFF09\uFF1B\u53EF\u70B9\u6027\u9760\u60AC\u505C\u5E95\u8272\u548C title \u63D0\u793A\u3002 */
 .dq-card--hero details>summary{text-decoration:none;margin:-2px -6px;padding:2px 6px;border-radius:8px;transition:background .15s ease}
 .dq-card--hero details>summary:hover,.dq-card--hero details[open]>summary{background:var(--dsw-alias-bg-layer-2,rgba(0,0,0,.05))}
+@media (max-width:620px){.dq-card{padding:16px}.dq-card--hero{padding:0 16px}}
 .dq-window-switch{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:8px;background:var(--dsw-alias-bg-layer-2,rgba(120,130,150,.08))}
 .dq-window-btn{border:0;border-radius:6px;padding:4px 8px;background:transparent;color:var(--dsw-alias-label-secondary,#59636e);font-size:12px;white-space:nowrap;cursor:pointer;transition:background .15s ease,color .15s ease,box-shadow .15s ease}
 .dq-window-btn:hover{color:var(--dsw-alias-label-primary,#1f2328)}
@@ -2993,7 +3164,6 @@ var css = `
 .dq-peak-figures{display:flex;flex-wrap:wrap;gap:12px 32px;margin-top:16px}
 .dq-peak-delta{font-size:12px;font-weight:500;margin-left:8px;color:var(--dq-text-warn)}
 .dq-peak-delta--save{color:var(--dq-text-success)}
-.dq-peak-foot{margin:12px 0 0;font-size:12px;line-height:1.6;color:var(--dsw-alias-label-secondary,#59636e);text-wrap:pretty}
 .dq-cache-figures{display:flex;flex-wrap:wrap;gap:12px 32px;margin-bottom:12px}
 @media (max-width:620px){.dq-cache-figures{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 16px}.dq-cache-figures .dq-stat{min-width:0}}
 .dq-muted-value{color:var(--dsw-alias-label-secondary,#59636e)!important;font-weight:500}
@@ -3198,6 +3368,77 @@ var css = `
 .dq-refresh-icon{display:inline-block;line-height:1}
 .dq-refresh-icon--spin{animation:dq-spin .9s linear infinite}
 @keyframes dq-spin{to{transform:rotate(360deg)}}
+/* ============================================================================
+   Host chrome: the \u300C\u989D\u5EA6\u300Dconversation view does not use the chat composer.
+   The attribute is set by index.tsx only when the dashboard is mounted inside
+   the conversation scrollport, so the account-wide panel never hides it.
+   '!important' because the composer's slot anchor is a "display:contents"
+   wrapper whose display we must beat regardless of host rule order.
+   ============================================================================ */
+html[data-dq-quota-view] [data-slot="conversation.composer"]{display:none!important}
+/* The narrow-viewport rule pads for the fixed composer; with it hidden there
+   is nothing to clear, so fall back to the page's own bottom breathing room. */
+html[data-dq-quota-view] .dq-balance{padding-bottom:48px}
+/* ============================================================================
+   Account-wide \u300C\u989D\u5EA6\u300Dpanel (the optional sidebar entry opens this main
+   keyed panel). The dashboard keeps its own width/padding; the panel only
+   supplies the page title row and the scrolling box the main column lacks.
+   ============================================================================ */
+/* Account-wide page frame: mirrors DSH's first-level pages (Plugins /
+   Scheduled tasks) \u2014 full-height scroll box, 28px top inset on the heading,
+   a 960px centred column, clamp(24px,4vw,48px) inline + 48px bottom insets and
+   a 20px/28px/500 page title, so the three sibling entries line up. */
+.dq-panel{box-sizing:border-box;height:100%;min-height:0;overflow-y:auto;overflow-x:hidden;padding:0 clamp(24px,4vw,48px) 48px;background:var(--dsw-alias-bg-base,#fff);color:var(--dsw-alias-label-primary,#1f2328);font-family:var(--dsw-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Helvetica,Arial,sans-serif);font-size:13px;line-height:1.5}
+.dq-panel-head{box-sizing:border-box;display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%;max-width:960px;margin:0 auto 32px;padding-top:28px}
+.dq-panel-title{margin:0;font-size:20px;font-weight:500;line-height:28px;color:var(--dsw-alias-label-primary,#1f2328)}
+.dq-panel-caption{font-size:13px;line-height:20px;color:var(--dsw-alias-label-secondary,#59636e)}
+.dq-panel .dq-balance{box-sizing:border-box;width:100%;max-width:960px;padding:0}
+/* macOS hiddenInset titlebar: the frame's top clearance keeps the heading
+   below the window's top strip, matching the host's sibling pages. */
+[data-platform="darwin"] .dq-panel-head{padding-top:calc(28px + var(--dsh-frame-top-clearance,0px))}
+@media (max-width:620px){
+  .dq-panel-head{padding-top:24px;margin-bottom:24px}
+  .dq-panel .dq-balance{max-width:100%;padding:0}
+}
+/* Optional sidebar entry. Top placement joins the host's global-panel icon
+   row (only the glyph is ours); bottom placement renders a row beside
+   Settings, collapsing to a square rail button with the sidebar. */
+/* The glyph is an SVG matching the host's 16px stroke icons; color inherits
+   from the sidebar row so selected/hover states stay the host's business. */
+.dq-side-icon{flex:none;display:block}
+.dq-side-entry{display:flex;align-items:center;gap:8px;box-sizing:border-box;width:100%;border:0;border-radius:8px;padding:7px 8px;background:transparent;color:var(--dsw-alias-label-secondary,#59636e);font:inherit;font-size:13px;line-height:1.3;text-align:left;cursor:pointer}
+.dq-side-entry:hover{background:var(--dsw-alias-bg-layer-2,rgba(120,130,150,.10));color:var(--dsw-alias-label-primary,#1f2328)}
+.dq-side-entry:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:1px}
+.dq-side-entry[aria-pressed="true"]{color:var(--dsw-alias-label-primary,#1f2328)}
+.dq-side-entry--rail{justify-content:center;width:32px;height:32px;margin:0 auto;padding:0}
+.dq-side-entry-icon{flex:none;display:inline-flex;align-items:center;justify-content:center}
+.dq-side-entry-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+/* ============================================================================
+   Settings controls for the two layout preferences: a compact select and the
+   draggable tab-order strip.
+   ============================================================================ */
+.dq-select{font:inherit;font-size:13px;line-height:1.3;color:var(--dsw-alias-label-primary,#1f2328);background:var(--dsw-alias-bg-layer-1,#fff);border:1px solid var(--dsw-alias-border-l2,rgba(0,0,0,.16));border-radius:8px;padding:5px 8px;min-width:96px;cursor:pointer}
+.dq-select:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:1px}
+.dq-tab-order{display:flex;flex-wrap:wrap;align-items:center;gap:6px;box-sizing:border-box;max-width:100%;min-height:32px;padding:4px;border:1px dashed var(--dsw-alias-border-l2,rgba(0,0,0,.16));border-radius:8px;background:var(--dsw-alias-bg-layer-2,rgba(120,130,150,.06))}
+.dq-tab-chip{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.08));border-radius:999px;background:var(--dsw-alias-bg-overlay,#fff);color:var(--dsw-alias-label-secondary,#59636e);font-size:12px;line-height:1.4;white-space:nowrap}
+.dq-tab-chip--current{cursor:grab;color:var(--dsw-alias-label-primary,#1f2328);border-color:var(--dsw-alias-state-business-primary,#0969da);font-weight:600;user-select:none;-webkit-user-select:none;touch-action:none}
+.dq-tab-chip--current:active{cursor:grabbing}
+.dq-tab-chip--current:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:1px}
+.dq-tab-chip--dragging{opacity:.55}
+.dq-tab-chip--drop-target{border-style:dashed;border-color:var(--dsw-alias-state-business-primary,#0969da)}
+/* ============================================================================
+   \u300C\u56FE\u7247 / \u591A\u6A21\u6001\u7528\u91CF\u300Dlives inside the usage-trend card. The grid-rows 0fr\u21921fr
+   trick animates the section's real height as a window range makes it appear
+   or disappear; opacity/translate make the change read as a reveal rather
+   than a reflow. The body keeps 14px of top room in both states (clipped by
+   the 0fr row when closed) so opening never jumps.
+   ============================================================================ */
+.dq-vision-inline{display:grid;grid-template-rows:0fr;margin-top:0;opacity:0;transform:translateY(-3px);overflow:hidden;transition:grid-template-rows .32s cubic-bezier(.22,1,.36,1),margin-top .32s cubic-bezier(.22,1,.36,1),opacity .2s ease,transform .32s cubic-bezier(.22,1,.36,1)}
+.dq-vision-inline[data-open="true"]{grid-template-rows:1fr;margin-top:24px;opacity:1;transform:none}
+.dq-vision-inline-body{min-height:0;overflow:hidden}
+.dq-vision-inline-body>.dq-chart-title{margin-top:0}
+.dq-vision-inline-body>.dq-chart-title{margin-top:0}
+
 @media (prefers-reduced-motion:reduce){
   .dsh-quota-root,.dsh-quota-root *,
   .dsh-quota-root *::before,.dsh-quota-root *::after,
@@ -3619,7 +3860,8 @@ function conversationViewsSource(slots) {
 // src/client/index.tsx
 var import_jsx_runtime7 = require("react/jsx-runtime");
 var name = "dsh-usage-dashboard";
-var inject = ["slots", "locale"];
+var inject = ["slots", "locale", "layout"];
+var openQuotaTab = null;
 function apply(ctx) {
   ctx.effect(() => ctx.locale.register(NS, { zh, en }), "dsh-usage-dashboard: browser dictionaries");
   const t = ctx.locale.bind(NS);
@@ -3649,17 +3891,153 @@ function apply(ctx) {
     },
     ({ t: slotT, sessionId, messageId }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorBoundary, { t: slotT, silent: true, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(MessageCost, { sessionId, messageId }) }) })
   ));
-  ctx.slots.inject("conversation.view", () => ctx.slots.register(
-    { name: "conversation.view", id: "balance", order: 20, locale: NS, label: () => t("nav.quota") },
-    // `conversation.view` is a session-scoped slot, so the host injects its
-    // standard session props (including `sessionId`) alongside `t` — this
-    // plugin only destructures the two fields it needs, per the existing
-    // "hand-write the minimal structural type" convention (see context.ts).
-    // `sessionId` is typed optional defensively even though the host is
-    // expected to always supply it: BalanceDashboard renders the current-
-    // session card only when it actually has one, never throws either way.
-    ({ t: slotT, sessionId }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorBoundary, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BalanceDashboard, { sessionId, views }) }) })
-  ));
+  const QuotaView = ({ t: slotT, sessionId, openView }) => {
+    (0, import_react7.useEffect)(() => {
+      if (openView !== void 0) openQuotaTab = openView;
+    }, [openView]);
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorBoundary, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BalanceDashboard, { sessionId, views }) }) });
+  };
+  ctx.effect(() => {
+    let disposeView = null;
+    const mount = () => {
+      disposeView?.();
+      disposeView = ctx.slots.inject("conversation.view", () => ctx.slots.register(
+        {
+          name: "conversation.view",
+          id: "balance",
+          order: viewOrderForIndex(ctx.slots.entries("conversation.view"), quotaTabIndexStore.get()),
+          locale: NS,
+          label: () => t("nav.quota")
+        },
+        // `conversation.view` is a session-scoped slot, so the host injects its
+        // standard session props (including `sessionId`) alongside `t`; only the
+        // fields this plugin needs are destructured, per the existing
+        // "hand-write the minimal structural type" convention (see context.ts).
+        // `sessionId` stays optional: BalanceDashboard renders the current-
+        // session card only when it actually has one, never throws either way.
+        QuotaView
+      ));
+    };
+    mount();
+    const unsubscribe = quotaTabIndexStore.subscribe(() => {
+      const restore = document !== void 0 && document.documentElement.hasAttribute("data-dq-quota-view");
+      disposeView?.();
+      disposeView = null;
+      mount();
+      if (restore) queueMicrotask(() => openQuotaTab?.("balance", "dsh-usage-dashboard:tab-order"));
+    });
+    return () => {
+      unsubscribe();
+      disposeView?.();
+    };
+  }, "dsh-usage-dashboard: quota tab registration");
+  const QuotaPanel = ({ t: slotT }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dq-panel", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dq-panel-head", "data-window-drag": true, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h1", { className: "dq-panel-title", children: slotT("nav.quota") }),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "dq-panel-caption", children: slotT("panel.caption") })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorBoundary, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BalanceDashboard, { views }) }) })
+  ] });
+  const QuotaGlyph = ({ size, active }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+    "svg",
+    {
+      className: "dq-side-icon",
+      "data-active": active === true ? "true" : "false",
+      width: size,
+      height: size,
+      viewBox: "0 0 16 16",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 1.1,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      focusable: "false",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M3.5 3.3 8 8.7l4.5-5.4" }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M8 8.7V13.2" }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M3.5 10.2h9" }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M3.5 12.1h9" })
+      ]
+    }
+  );
+  const QuotaFooterButton = ({ wide, t: slotT }) => {
+    const [active, setActive] = (0, import_react7.useState)(() => ctx.layout.panelInfo.getSnapshot().activePanelId === QUOTA_PANEL_ID);
+    (0, import_react7.useEffect)(() => {
+      const sync = () => {
+        setActive(ctx.layout.panelInfo.getSnapshot().activePanelId === QUOTA_PANEL_ID);
+      };
+      sync();
+      return ctx.layout.panelInfo.subscribe(sync);
+    }, []);
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+      "button",
+      {
+        type: "button",
+        className: `dq-side-entry${wide ? "" : " dq-side-entry--rail"}`,
+        title: slotT("panel.openAria"),
+        "aria-label": slotT("nav.quota"),
+        "aria-pressed": active,
+        onClick: () => {
+          ctx.layout.selectPanel(active ? null : QUOTA_PANEL_ID);
+        },
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "dq-side-entry-icon", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(QuotaGlyph, { size: 16 }) }),
+          wide && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "dq-side-entry-label", children: slotT("nav.quota") })
+        ]
+      }
+    );
+  };
+  ctx.effect(() => ctx.slots.inject("main", () => ctx.slots.register(
+    { name: "main", key: QUOTA_PANEL_ID, locale: NS },
+    QuotaPanel
+  )), "dsh-usage-dashboard: quota panel");
+  ctx.effect(() => {
+    let disposeEntry = null;
+    const sync = () => {
+      disposeEntry?.();
+      disposeEntry = null;
+      const placement = sidebarEntryStore.get();
+      if (placement === "top") {
+        disposeEntry = ctx.slots.inject("sidebar.panellist", () => ctx.slots.register(
+          { name: "sidebar.panellist", id: QUOTA_PANEL_ID, order: 1e3, label: () => t("nav.quota"), locale: NS },
+          QuotaGlyph
+        ));
+        return;
+      }
+      if (placement === "bottom") {
+        disposeEntry = ctx.slots.inject("sidebar.footer.action", () => ctx.slots.register(
+          { name: "sidebar.footer.action", id: "quota", order: 10, locale: NS },
+          QuotaFooterButton
+        ));
+        return;
+      }
+      if (ctx.layout.panelInfo.getSnapshot().activePanelId === QUOTA_PANEL_ID) ctx.layout.selectPanel(null);
+    };
+    sync();
+    const unsubscribe = sidebarEntryStore.subscribe(sync);
+    return () => {
+      unsubscribe();
+      disposeEntry?.();
+    };
+  }, "dsh-usage-dashboard: sidebar entry");
+  ctx.effect(() => {
+    let applied = false;
+    const sync = () => {
+      const root = document.querySelector(".dq-balance");
+      const should = quotaViewActiveStore.get() && root !== null && root.closest("[data-conversation-scroll]") !== null;
+      if (should === applied) return;
+      applied = should;
+      if (should) document.documentElement.setAttribute("data-dq-quota-view", "");
+      else document.documentElement.removeAttribute("data-dq-quota-view");
+    };
+    sync();
+    const unsubscribe = quotaViewActiveStore.subscribe(sync);
+    return () => {
+      unsubscribe();
+      if (applied) document.documentElement.removeAttribute("data-dq-quota-view");
+    };
+  }, "dsh-usage-dashboard: composer visibility");
 }
 return module.exports; } });
 //# sourceMappingURL=client.js.map