@cassius0924/dsh-usage-dashboard 0.8.0 → 0.8.1

package/lib/client.js

@@ -26,7 +26,7 @@ __export(index_exports, {
   name: () => name
 });
 module.exports = __toCommonJS(index_exports);
-var import_react7 = require("react");
+var import_react8 = require("react");
 
 // src/client/boundary.tsx
 var import_react = require("react");
@@ -554,6 +554,9 @@ var zh = {
   "widget.expandAria": "\u5C55\u5F00\u989D\u5EA6\u7A97\u53E3",
   "widget.collapseAria": "\u6536\u8D77\u989D\u5EA6\u7A97\u53E3",
   "messageCost.label": "\u672C\u8F6E\u8D39\u7528",
+  "sessionCost.title": "\u4F1A\u8BDD\u8D39\u7528",
+  "sessionCost.aria": "\u672C\u4F1A\u8BDD\u4F30\u7B97\u8D39\u7528 {amount}",
+  "sessionCost.active": "\u6D3B\u8DC3\u65F6\u95F4",
   "messageCost.tooltip": "\u7531 dsh-usage-dashboard \u63D0\u4F9B \xB7 \u672C\u8F6E\u5BF9\u8BDD\u8D39\u7528\u4E3A\u4F30\u7B97\u503C",
   "messageCost.aria": "{amount}\uFF0C\u672C\u8F6E\u5BF9\u8BDD\u4F30\u7B97\u8D39\u7528\uFF0C\u7531 dsh-usage-dashboard \u63D0\u4F9B",
   "boundary.title": "\u989D\u5EA6\u9762\u677F\u51FA\u9519\u4E86",
@@ -822,6 +825,9 @@ var en = {
   "widget.expandAria": "Expand balance widget",
   "widget.collapseAria": "Collapse balance widget",
   "messageCost.label": "Turn cost",
+  "sessionCost.title": "Session cost",
+  "sessionCost.aria": "Estimated session cost {amount}",
+  "sessionCost.active": "Active time",
   "messageCost.tooltip": "Provided by dsh-usage-dashboard \xB7 estimated cost for this turn",
   "messageCost.aria": "{amount}, estimated cost for this turn, provided by dsh-usage-dashboard",
   "boundary.title": "The usage dashboard crashed",
@@ -2894,7 +2900,7 @@ function BalanceDashboard(props) {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "dq-footer", children: "@cassius0924/dsh-usage-dashboard v0.8.0" })
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "dq-footer", children: "@cassius0924/dsh-usage-dashboard v0.8.1" })
   ] });
 }
 
@@ -2938,6 +2944,254 @@ function MessageCost({ sessionId, messageId }) {
   );
 }
 
+// src/client/session-cost-pill.tsx
+var import_react6 = require("react");
+var import_react_dom = require("react-dom");
+
+// src/pricing.ts
+var PEAK_PRICING_FROM_MS = Date.UTC(2026, 7, 16, 16, 0, 0);
+var V41_FLASH_PRICING_FROM_MS = Date.UTC(2026, 8, 10, 4, 0, 0);
+var PRO_ROUTED_TO_FLASH_FROM_MS = Date.UTC(2026, 8, 14, 4, 0, 0);
+var PEAK_WINDOWS = [[9, 12], [14, 18]];
+var BEIJING_OFFSET_MS3 = 8 * 36e5;
+var FLAT_RATES = {
+  pro: { cacheHit: 0.025, input: 3, output: 6 },
+  flash: { cacheHit: 0.02, input: 1, output: 2 },
+  // The vision model billed at flash rates from day one, so its pre-switch
+  // history is costed at the same flat prices as flash.
+  vision: { cacheHit: 0.02, input: 1, output: 2 }
+};
+var PEAK_RATES_08_17 = {
+  pro: { cacheHit: 0.3, input: 9, output: 27 },
+  flash: { cacheHit: 0.1, input: 3, output: 9 },
+  // Official policy: the vision model is priced identically to flash; images
+  // cost tokens, not their own multiplier.
+  vision: { cacheHit: 0.1, input: 3, output: 9 }
+};
+var PEAK_RATES_09_10 = {
+  pro: { cacheHit: 0.3, input: 9, output: 27 },
+  flash: { cacheHit: 0.04, input: 2, output: 8 },
+  vision: { cacheHit: 0.04, input: 2, output: 8 }
+};
+var PRICE_ERAS = [
+  { fromMs: PEAK_PRICING_FROM_MS, peak: PEAK_RATES_08_17, weekdaysOnly: false },
+  { fromMs: V41_FLASH_PRICING_FROM_MS, peak: PEAK_RATES_09_10, weekdaysOnly: true }
+];
+function eraAt(timeMs) {
+  let era = PRICE_ERAS[0];
+  for (const candidate of PRICE_ERAS) if (timeMs >= candidate.fromMs) era = candidate;
+  return era;
+}
+var halved = (rates) => ({
+  cacheHit: rates.cacheHit / 2,
+  input: rates.input / 2,
+  output: rates.output / 2
+});
+function tierOf(model) {
+  const name2 = model.toLowerCase();
+  if (name2.includes("vision")) return "vision";
+  if (name2.includes("flash")) return "flash";
+  return "pro";
+}
+function billedTierOf(timeMs, model) {
+  const tier = tierOf(model);
+  return tier === "pro" && timeMs >= PRO_ROUTED_TO_FLASH_FROM_MS ? "flash" : tier;
+}
+function isBeijingWeekday(timeMs) {
+  const day = new Date(timeMs + BEIJING_OFFSET_MS3).getUTCDay();
+  return day >= 1 && day <= 5;
+}
+function isPeak(timeMs) {
+  if (eraAt(timeMs).weekdaysOnly && !isBeijingWeekday(timeMs)) return false;
+  const hour = Math.floor(((timeMs + BEIJING_OFFSET_MS3) % 864e5 + 864e5) % 864e5 / 36e5);
+  return PEAK_WINDOWS.some(([from, to]) => hour >= from && hour < to);
+}
+function ratesAt(timeMs, model) {
+  if (timeMs < PEAK_PRICING_FROM_MS) return FLAT_RATES[tierOf(model)];
+  const peak = eraAt(timeMs).peak[billedTierOf(timeMs, model)];
+  return isPeak(timeMs) ? peak : halved(peak);
+}
+
+// src/client/session-cost-pill.tsx
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var PANEL_MARGIN = 12;
+var PANEL_GAP = 8;
+var cachedData2 = (sessionId) => {
+  const response = getCachedSessionUsage(sessionId);
+  return response?.ok === true ? response.data ?? null : null;
+};
+function CostIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+    "svg",
+    {
+      width: "14",
+      height: "14",
+      viewBox: "0 0 16 16",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "1",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      focusable: "false",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("circle", { cx: "8", cy: "8", r: "6" }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M5.5 5.3 8 8.4l2.5-3.1" }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M8 8.4v2.9" }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M5.8 9.5h4.4" }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M5.8 10.9h4.4" })
+      ]
+    }
+  );
+}
+function SessionCostPill({ sessionId }) {
+  const { t, locale } = useI18n();
+  const [data, setData] = (0, import_react6.useState)(
+    () => sessionId === void 0 || sessionId === "" ? null : cachedData2(sessionId)
+  );
+  const [open, setOpen] = (0, import_react6.useState)(false);
+  const anchorRef = (0, import_react6.useRef)(null);
+  const panelRef = (0, import_react6.useRef)(null);
+  const [pos, setPos] = (0, import_react6.useState)(null);
+  (0, import_react6.useEffect)(() => {
+    if (sessionId === void 0 || sessionId === "") return;
+    setData(cachedData2(sessionId));
+    const unsubscribe = subscribeSessionUsage(sessionId, () => setData(cachedData2(sessionId)));
+    if (getCachedSessionUsage(sessionId) === null) void fetchSessionUsage(sessionId);
+    return unsubscribe;
+  }, [sessionId]);
+  (0, import_react6.useLayoutEffect)(() => {
+    if (!open) {
+      setPos(null);
+      return;
+    }
+    const anchor = anchorRef.current;
+    const panel = panelRef.current;
+    if (anchor === null || panel === null) return;
+    const pill = anchor.getBoundingClientRect();
+    const width = panel.getBoundingClientRect().width;
+    setPos({
+      left: Math.min(Math.max(pill.left, PANEL_MARGIN), Math.max(PANEL_MARGIN, window.innerWidth - width - PANEL_MARGIN)),
+      bottom: window.innerHeight - pill.top + PANEL_GAP
+    });
+  }, [open, data]);
+  (0, import_react6.useEffect)(() => {
+    if (!open) return;
+    const close = () => setOpen(false);
+    const onPointerDown = (event) => {
+      const target = event.target;
+      if (!(target instanceof Node)) return;
+      if (anchorRef.current?.contains(target) === true || panelRef.current?.contains(target) === true) return;
+      close();
+    };
+    const onKeyDown = (event) => {
+      if (event.key === "Escape") close();
+    };
+    document.addEventListener("pointerdown", onPointerDown, true);
+    document.addEventListener("keydown", onKeyDown);
+    window.addEventListener("resize", close);
+    document.addEventListener("scroll", close, true);
+    return () => {
+      document.removeEventListener("pointerdown", onPointerDown, true);
+      document.removeEventListener("keydown", onKeyDown);
+      window.removeEventListener("resize", close);
+      document.removeEventListener("scroll", close, true);
+    };
+  }, [open]);
+  if (sessionId === void 0 || sessionId === "" || data === null || data.calls === 0) return null;
+  const amount = `\xA5${fmtTurnCost(data.cost)}`;
+  const priceAt = data.lastActive ?? Date.now();
+  const split = data.models.reduce(
+    (sum, model) => {
+      const rates = ratesAt(priceAt, model.model);
+      const weighted = {
+        input: model.input * rates.input,
+        cache: model.cache * rates.cacheHit,
+        output: model.output * rates.output
+      };
+      const weight = weighted.input + weighted.cache + weighted.output;
+      if (weight <= 0) return sum;
+      sum.input += model.cost * (weighted.input / weight);
+      sum.cache += model.cost * (weighted.cache / weight);
+      sum.output += model.cost * (weighted.output / weight);
+      return sum;
+    },
+    { input: 0, cache: 0, output: 0 }
+  );
+  const rangeTime = new Intl.DateTimeFormat(locale === "en" ? "en-US" : "zh-CN", {
+    timeZone: "Asia/Shanghai",
+    month: "numeric",
+    day: "numeric",
+    hour: "2-digit",
+    minute: "2-digit",
+    hour12: false
+  });
+  const range = data.firstActive !== null && data.lastActive !== null ? `${rangeTime.format(data.firstActive)} \u2013 ${rangeTime.format(data.lastActive)}` : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { ref: anchorRef, className: "dq-cost-anchor", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+      "button",
+      {
+        type: "button",
+        className: "dq-cost-pill",
+        "aria-haspopup": "dialog",
+        "aria-expanded": open,
+        "aria-label": t("sessionCost.aria", { amount }),
+        onClick: () => setOpen((value) => !value),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(CostIcon, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dq-cost-pill-label", children: amount })
+        ]
+      }
+    ) }),
+    open && (0, import_react_dom.createPortal)(
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+        "div",
+        {
+          ref: panelRef,
+          className: "dq-cost-panel",
+          role: "dialog",
+          "aria-label": t("sessionCost.title"),
+          style: pos === null ? { visibility: "hidden", left: 0, top: 0 } : { visibility: "visible", left: pos.left, bottom: pos.bottom, top: "auto" },
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dq-cost-panel-title", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "dq-cost-panel-title-label", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(CostIcon, {}),
+                t("sessionCost.title")
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dq-cost-panel-value", children: amount })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "dq-cost-panel-rule", "aria-hidden": true }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("dl", { className: "dq-cost-details", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("dt", { children: t("common.input") }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("dd", { children: [
+                "\xA5",
+                fmtTurnCost(split.input)
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("dt", { children: t("common.cacheHit") }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("dd", { children: [
+                "\xA5",
+                fmtTurnCost(split.cache)
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("dt", { children: t("common.output") }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("dd", { children: [
+                "\xA5",
+                fmtTurnCost(split.output)
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("dt", { children: t("sessionUsage.calls") }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("dd", { children: fmtInt(data.calls) }),
+              range !== null && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("dt", { children: t("sessionCost.active") }),
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("dd", { children: range })
+              ] })
+            ] })
+          ]
+        }
+      ),
+      document.body
+    )
+  ] });
+}
+
 // src/client/styles.ts
 var css = `
 .dsh-quota-root{-webkit-text-size-adjust:100%;text-size-adjust:100%;position:absolute;right:16px;bottom:16px;z-index:2147483000;pointer-events:auto;opacity:1;visibility:visible;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.45;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%);transition:left .28s cubic-bezier(.22,1,.36,1),top .28s cubic-bezier(.22,1,.36,1),opacity .16s ease-out,visibility 0s linear}
@@ -2976,12 +3230,31 @@ var css = `
 .dq-message-cost-amount{text-decoration-line:underline;text-decoration-style:dotted;text-decoration-color:currentColor;text-underline-offset:4px}
 .dq-message-cost:hover{color:var(--dsw-alias-label-secondary,#3f4852)}
 .dq-message-cost:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:2px;border-radius:4px}
-.dq-message-cost::after{content:attr(data-dq-tooltip);position:absolute;left:0;top:calc(100% + 6px);z-index:2147483001;width:max-content;max-width:min(240px,calc(100vw - 24px));padding:6px 9px;border-radius:8px;background:var(--dsw-alias-tooltip-bg,#1f2328);color:var(--dsw-static-neutral-bluish-00,#fff);box-shadow:0 6px 18px rgba(0,0,0,.22);font-size:12px;font-weight:400;line-height:1.5;text-align:left;white-space:normal;pointer-events:none;opacity:0;visibility:hidden;transform:translateY(-3px);transition:opacity .12s ease-out,transform .12s cubic-bezier(.22,1,.36,1),visibility 0s linear .12s}
+.dq-message-cost::after{content:attr(data-dq-tooltip);position:absolute;left:0;bottom:calc(100% + 6px);top:auto;z-index:2147483001;width:max-content;max-width:min(240px,calc(100vw - 24px));padding:6px 9px;border-radius:8px;background:var(--dsw-alias-tooltip-bg,#1f2328);color:var(--dsw-static-neutral-bluish-00,#fff);box-shadow:0 6px 18px rgba(0,0,0,.22);font-size:12px;font-weight:400;line-height:1.5;text-align:left;white-space:normal;pointer-events:none;opacity:0;visibility:hidden;transform:translateY(3px);transition:opacity .12s ease-out,transform .12s cubic-bezier(.22,1,.36,1),visibility 0s linear .12s}
 .dq-message-cost:hover::after,.dq-message-cost:focus-visible::after{opacity:1;visibility:visible;transform:translateY(0);transition:opacity .12s ease-out,transform .12s cubic-bezier(.22,1,.36,1),visibility 0s linear}
 @media (hover:hover){
   [data-time-hover-root] .dq-message-cost{opacity:0;transition:opacity 80ms ease}
   [data-time-hover-root]:hover .dq-message-cost,[data-time-hover-root]:focus-within .dq-message-cost{opacity:1}
 }
+/* Composer-dock session cost pill: one more reading beside the host's own
+   \u300C\u4F1A\u8BDD\u7EDF\u8BA1\u300D/\u300CToken \u7528\u91CF\u300Dpills (same slot, same compact skin). */
+.dq-cost-anchor{display:inline-flex;min-width:0;font-size:calc(var(--dsh-content-font-size-secondary,13px) - 1px);line-height:calc(20px + var(--dsh-content-font-delta-secondary,0px))}
+.dq-cost-pill{display:inline-flex;align-items:center;gap:6px;box-sizing:border-box;max-width:100%;padding:1px 8px;border:0;border-radius:var(--dsw-radius-sm,8px);background:transparent;color:var(--dsw-alias-label-tertiary,#59636e);font:inherit;font-variant-numeric:tabular-nums;line-height:inherit;white-space:nowrap;cursor:pointer}
+.dq-cost-pill:hover,.dq-cost-pill[aria-expanded="true"]{background:var(--dsw-alias-interactive-bg-hover,rgba(120,130,150,.12));color:var(--dsw-alias-label-secondary,#59636e)}
+.dq-cost-pill:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:2px}
+.dq-cost-pill svg{flex:none}
+.dq-cost-pill-label{min-width:0;overflow:hidden;text-overflow:ellipsis}
+/* Click-open breakdown: the host stat-dialog skin (menu surface, prominent
+   elevation, 12/18 rows), portaled to the body and placed above the pill. */
+.dq-cost-panel{position:fixed;z-index:1100;box-sizing:border-box;width:max-content;min-width:min(300px,calc(100vw - 24px));max-width:min(440px,calc(100vw - 24px));padding:16px;border:0;border-radius:var(--dsw-radius-lg,16px);background:var(--dsw-specific-menu,var(--dsw-alias-bg-overlay,#fff));-webkit-backdrop-filter:var(--dsw-menu-backdrop-filter,blur(40px) saturate(150%));backdrop-filter:var(--dsw-menu-backdrop-filter,blur(40px) saturate(150%));box-shadow:var(--dsw-elevation-prominent,0 12px 32px rgba(0,0,0,.24));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:12px;line-height:18px;color:var(--dsw-alias-label-secondary,#59636e);cursor:default}
+.dq-cost-panel-title{display:flex;justify-content:space-between;gap:16px;margin-bottom:8px;color:var(--dsw-alias-label-primary,#1f2328);font-weight:500}
+.dq-cost-panel-title-label{display:inline-flex;align-items:center;gap:6px;min-width:0}
+.dq-cost-panel-title-label svg{flex:none}
+.dq-cost-panel-value{font-variant-numeric:tabular-nums}
+.dq-cost-panel-rule{margin-bottom:10px;border-top:.5px solid var(--dsw-alias-border-l2,rgba(0,0,0,.1))}
+.dq-cost-details{display:grid;grid-template-columns:minmax(76px,auto) minmax(0,1fr);gap:6px 16px;margin:0;color:var(--dsw-alias-label-tertiary,#59636e)}
+.dq-cost-details dt,.dq-cost-details dd{min-width:0;margin:0}
+.dq-cost-details dd{color:var(--dsw-alias-label-secondary,#59636e);font-variant-numeric:tabular-nums;text-align:right}
 /* \u5361\u7247\u95F4\u8DDD\uFF08\u6B64\u5904 gap\uFF09\u523B\u610F\u5927\u4E8E\u5361\u5185\u5C0F\u8282\u95F4\u8DDD\uFF08margin-top:12/14/16px \u90A3\u4E00\u6863\uFF09\uFF0C\u5236\u9020"\u5361\u7247\u5916\u758F\u3001\u5361\u7247\u5185\u5BC6"\u7684
    \u758F\u5BC6\u5BF9\u6BD4\uFF1A24px \u76F8\u5BF9\u5361\u5185\u6700\u5927\u6863 16px \u4ECD\u6709 1.5 \u500D\u7EA7\u5DEE\uFF0C\u76F8\u5BF9\u5E38\u89C1\u6863 12px \u6709 2 \u500D\u7EA7\u5DEE\uFF0C\u4E0D\u4E0E .dq-card \u7684
    padding\uFF0816px/20px\uFF0C\u5361\u7247\u5185\u90E8\u547C\u5438\u611F\uFF0C\u8F6E\u6B21 36 \u5DF2\u5B9A\uFF09\u6DF7\u540C\u3002 */
@@ -3449,7 +3722,7 @@ html[data-dq-quota-view] .dq-balance{padding-bottom:48px}
 `;
 
 // src/client/widget.tsx
-var import_react6 = require("react");
+var import_react7 = require("react");
 
 // src/client/sessions.ts
 function currentSessionIdOf(state) {
@@ -3458,7 +3731,7 @@ function currentSessionIdOf(state) {
 }
 
 // src/client/widget.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 var MARGIN = 16;
 var CORNER_KEY = "widget.corner";
 var COLLAPSED_KEY = "widget.collapsed";
@@ -3509,47 +3782,47 @@ function cornerPos(corner, node, bounds) {
 function QuotaWidget(props) {
   const { t } = useI18n();
   const sessionId = props.useSessions(currentSessionIdOf);
-  const [visible, setVisible] = (0, import_react6.useState)(widgetVisibleStore.get());
-  (0, import_react6.useEffect)(() => widgetVisibleStore.subscribe(() => setVisible(widgetVisibleStore.get())), []);
-  const [quotaViewActive2, setQuotaViewActive] = (0, import_react6.useState)(quotaViewActiveStore.get());
-  (0, import_react6.useEffect)(() => quotaViewActiveStore.subscribe(() => setQuotaViewActive(quotaViewActiveStore.get())), []);
-  const [lowBalance, setLowBalance] = (0, import_react6.useState)(lowBalanceStore.get());
-  (0, import_react6.useEffect)(() => lowBalanceStore.subscribe(() => setLowBalance(lowBalanceStore.get())), []);
-  const [selectedTabIds, setSelectedTabIds] = (0, import_react6.useState)(widgetTabIdsStore.get());
-  (0, import_react6.useEffect)(() => widgetTabIdsStore.subscribe(() => setSelectedTabIds(widgetTabIdsStore.get())), []);
-  const [viewTabs, setViewTabs] = (0, import_react6.useState)(() => props.views.list());
-  (0, import_react6.useEffect)(() => props.views.subscribe(() => setViewTabs(props.views.list())), [props.views]);
-  const [activeViewId, setActiveViewId] = (0, import_react6.useState)(null);
+  const [visible, setVisible] = (0, import_react7.useState)(widgetVisibleStore.get());
+  (0, import_react7.useEffect)(() => widgetVisibleStore.subscribe(() => setVisible(widgetVisibleStore.get())), []);
+  const [quotaViewActive2, setQuotaViewActive] = (0, import_react7.useState)(quotaViewActiveStore.get());
+  (0, import_react7.useEffect)(() => quotaViewActiveStore.subscribe(() => setQuotaViewActive(quotaViewActiveStore.get())), []);
+  const [lowBalance, setLowBalance] = (0, import_react7.useState)(lowBalanceStore.get());
+  (0, import_react7.useEffect)(() => lowBalanceStore.subscribe(() => setLowBalance(lowBalanceStore.get())), []);
+  const [selectedTabIds, setSelectedTabIds] = (0, import_react7.useState)(widgetTabIdsStore.get());
+  (0, import_react7.useEffect)(() => widgetTabIdsStore.subscribe(() => setSelectedTabIds(widgetTabIdsStore.get())), []);
+  const [viewTabs, setViewTabs] = (0, import_react7.useState)(() => props.views.list());
+  (0, import_react7.useEffect)(() => props.views.subscribe(() => setViewTabs(props.views.list())), [props.views]);
+  const [activeViewId, setActiveViewId] = (0, import_react7.useState)(null);
   const cachedBalance = getCachedBalance();
-  const [data, setData] = (0, import_react6.useState)(cachedBalance?.data ?? null);
-  const [error, setError] = (0, import_react6.useState)(null);
-  const [loading, setLoading] = (0, import_react6.useState)(cachedBalance === null);
-  const [collapsed, setCollapsed] = (0, import_react6.useState)(() => loadPref(COLLAPSED_KEY, isBoolean, false));
-  const [pos, setPos] = (0, import_react6.useState)(null);
-  const [corner, setCorner] = (0, import_react6.useState)(() => loadPref(CORNER_KEY, isCorner, "br"));
-  const [dragging, setDragging] = (0, import_react6.useState)(false);
-  const rootRef = (0, import_react6.useRef)(null);
-  const dragRef = (0, import_react6.useRef)(null);
+  const [data, setData] = (0, import_react7.useState)(cachedBalance?.data ?? null);
+  const [error, setError] = (0, import_react7.useState)(null);
+  const [loading, setLoading] = (0, import_react7.useState)(cachedBalance === null);
+  const [collapsed, setCollapsed] = (0, import_react7.useState)(() => loadPref(COLLAPSED_KEY, isBoolean, false));
+  const [pos, setPos] = (0, import_react7.useState)(null);
+  const [corner, setCorner] = (0, import_react7.useState)(() => loadPref(CORNER_KEY, isCorner, "br"));
+  const [dragging, setDragging] = (0, import_react7.useState)(false);
+  const rootRef = (0, import_react7.useRef)(null);
+  const dragRef = (0, import_react7.useRef)(null);
   const readUsage = () => {
     const cached = getCachedUsage();
     return { data: cached?.ok === true ? cached.data ?? null : null, at: getCachedUsageAt() };
   };
-  const [usage, setUsage] = (0, import_react6.useState)(readUsage);
-  (0, import_react6.useEffect)(() => subscribeUsage(() => setUsage(readUsage())), []);
+  const [usage, setUsage] = (0, import_react7.useState)(readUsage);
+  (0, import_react7.useEffect)(() => subscribeUsage(() => setUsage(readUsage())), []);
   const readSessionUsage = (id) => {
     if (id === void 0) return null;
     const response = getCachedSessionUsage(id);
     return response?.ok === true ? response.data ?? null : null;
   };
-  const [sessionUsage, setSessionUsage] = (0, import_react6.useState)(() => readSessionUsage(sessionId));
-  (0, import_react6.useEffect)(() => {
+  const [sessionUsage, setSessionUsage] = (0, import_react7.useState)(() => readSessionUsage(sessionId));
+  (0, import_react7.useEffect)(() => {
     setSessionUsage(readSessionUsage(sessionId));
     if (sessionId === void 0) return;
     const unsubscribe = subscribeSessionUsage(sessionId, () => setSessionUsage(readSessionUsage(sessionId)));
     void fetchSessionUsage(sessionId);
     return unsubscribe;
   }, [sessionId]);
-  (0, import_react6.useLayoutEffect)(() => {
+  (0, import_react7.useLayoutEffect)(() => {
     const viewIds = viewTabs.map((tab) => tab.id);
     const read = () => {
       const next = getActiveConversationViewId(getShellFrame(rootRef.current), viewIds);
@@ -3586,14 +3859,14 @@ function QuotaWidget(props) {
       setLoading(false);
     }
   };
-  (0, import_react6.useEffect)(() => {
+  (0, import_react7.useEffect)(() => {
     void load(true);
     const id = setInterval(() => {
       void load(false);
     }, 6e4);
     return () => clearInterval(id);
   }, []);
-  (0, import_react6.useLayoutEffect)(() => {
+  (0, import_react7.useLayoutEffect)(() => {
     if (!visible || quotaViewActive2) return;
     const node = rootRef.current;
     if (node === null) return;
@@ -3721,9 +3994,9 @@ function QuotaWidget(props) {
   const dotClass = primary === null ? "dsh-quota-dot dsh-quota-dot--idle" : data?.isAvailable === false ? "dsh-quota-dot dsh-quota-dot--error" : low ? "dsh-quota-dot dsh-quota-dot--warn" : "dsh-quota-dot";
   const ageMinutes = usage.at === null ? null : Math.floor((Date.now() - usage.at) / 6e4);
   const usageAgeText = ageMinutes === null || ageMinutes < 1 ? t("widget.updatedNow") : t("widget.stale", { minutes: ageMinutes });
-  const sessionCostRow = sessionUsage === null ? null : /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-row", title: t("widget.sessionCostTitle"), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-label", children: t("widget.sessionCost") }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "dsh-quota-value", children: [
+  const sessionCostRow = sessionUsage === null ? null : /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dsh-quota-row", title: t("widget.sessionCostTitle"), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "dsh-quota-label", children: t("widget.sessionCost") }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { className: "dsh-quota-value", children: [
       "\xA5",
       fmtTurnCost(sessionUsage.cost)
     ] })
@@ -3731,50 +4004,50 @@ function QuotaWidget(props) {
   let body = null;
   if (!collapsed) {
     if (loading && data === null && error === null) {
-      body = /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-body", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { children: t("widget.loading") }),
+      body = /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dsh-quota-body", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { children: t("widget.loading") }),
         sessionCostRow
       ] });
     } else if (error !== null && data === null) {
-      body = /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-body", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "dsh-quota-error", children: localizeApiError(error, t, "error.query") }),
+      body = /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dsh-quota-body", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "dsh-quota-error", children: localizeApiError(error, t, "error.query") }),
         sessionCostRow
       ] });
     } else if (primary !== null) {
-      body = /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-body", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "dsh-quota-remaining-label", children: t("balance.remaining") }),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { title: low ? t("widget.lowTitle", { amount: fmt(lowBalance) }) : void 0, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: `dsh-quota-total${low ? " dsh-quota-total--low" : ""}`, children: fmt(primary.total) }),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-currency", children: primary.currency })
+      body = /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dsh-quota-body", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "dsh-quota-remaining-label", children: t("balance.remaining") }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { title: low ? t("widget.lowTitle", { amount: fmt(lowBalance) }) : void 0, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: `dsh-quota-total${low ? " dsh-quota-total--low" : ""}`, children: fmt(primary.total) }),
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "dsh-quota-currency", children: primary.currency })
         ] }),
-        usage.data !== null && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-row", title: t("widget.todayCostTitle", { age: usageAgeText }), children: [
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-label", children: t("widget.todayCost") }),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "dsh-quota-value", children: [
+        usage.data !== null && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dsh-quota-row", title: t("widget.todayCostTitle", { age: usageAgeText }), children: [
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "dsh-quota-label", children: t("widget.todayCost") }),
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { className: "dsh-quota-value", children: [
             "\xA5",
             fmt(usage.data.summary.today.cost)
           ] })
         ] }),
         sessionCostRow,
-        data?.isAvailable === false && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-row", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-label", children: t("common.status") }),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-value dsh-quota-error", children: t("common.unavailable") })
+        data?.isAvailable === false && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dsh-quota-row", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "dsh-quota-label", children: t("common.status") }),
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "dsh-quota-value dsh-quota-error", children: t("common.unavailable") })
         ] })
       ] });
     } else {
-      body = /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-body", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "dsh-quota-error", children: t("widget.noBalance") }),
+      body = /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dsh-quota-body", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "dsh-quota-error", children: t("widget.noBalance") }),
         sessionCostRow
       ] });
     }
   }
   const style = pos !== null ? { left: `${pos.x}px`, top: `${pos.y}px`, right: "auto", bottom: "auto" } : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
     "div",
     {
       className: `dsh-quota-root${dragging ? " dsh-quota-dragging" : ""}${hidden ? " dsh-quota-root--hidden" : ""}`,
       style,
       "aria-hidden": hidden,
-      children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
         "div",
         {
           ref: rootRef,
@@ -3786,14 +4059,14 @@ function QuotaWidget(props) {
           onPointerCancel: () => endDrag(false),
           onLostPointerCapture: () => endDrag(false),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-header", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-title", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-grip", title: t("widget.dragGrip"), children: "\u2807" }),
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: dotClass }),
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-name", children: t("widget.title") })
+            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dsh-quota-header", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dsh-quota-title", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "dsh-quota-grip", title: t("widget.dragGrip"), children: "\u2807" }),
+                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: dotClass }),
+                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "dsh-quota-name", children: t("widget.title") })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-actions", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dsh-quota-actions", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
                   "button",
                   {
                     className: "dsh-quota-btn",
@@ -3809,7 +4082,7 @@ function QuotaWidget(props) {
                     children: "\u21BB"
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
                   "button",
                   {
                     className: "dsh-quota-btn",
@@ -3827,7 +4100,7 @@ function QuotaWidget(props) {
                 )
               ] })
             ] }),
-            collapsed && primary !== null && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "dsh-quota-collapsed-total-row", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: `dsh-quota-collapsed-total${low ? " dsh-quota-total--low" : ""}`, children: [
+            collapsed && primary !== null && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "dsh-quota-collapsed-total-row", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { className: `dsh-quota-collapsed-total${low ? " dsh-quota-total--low" : ""}`, children: [
               fmt(primary.total),
               " ",
               primary.currency
@@ -3858,7 +4131,7 @@ function conversationViewsSource(slots) {
 }
 
 // src/client/index.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 var name = "dsh-usage-dashboard";
 var inject = ["slots", "locale", "layout"];
 var openQuotaTab = null;
@@ -3879,7 +4152,11 @@ function apply(ctx) {
   });
   ctx.slots.inject("shell.overlay", () => ctx.slots.register(
     { name: "shell.overlay", id: "deepseek-quota", order: 1e3, locale: NS, label: () => t("widget.title") },
-    ({ t: slotT, useSessions }) => /* @__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)(QuotaWidget, { useSessions, views }) }) })
+    ({ t: slotT, useSessions }) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ErrorBoundary, { t: slotT, silent: true, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(QuotaWidget, { useSessions, views }) }) })
+  ));
+  ctx.slots.inject("conversation.composer.dock", () => ctx.slots.register(
+    { name: "conversation.composer.dock", id: "quota-cost", order: 2, locale: NS },
+    ({ t: slotT, sessionId }) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ErrorBoundary, { t: slotT, silent: true, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SessionCostPill, { sessionId }) }) })
   ));
   ctx.slots.inject("conversation.chat.assistant-actions", () => ctx.slots.register(
     {
@@ -3889,13 +4166,13 @@ function apply(ctx) {
       locale: NS,
       label: () => t("messageCost.label")
     },
-    ({ 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 }) }) })
+    ({ t: slotT, sessionId, messageId }) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ErrorBoundary, { t: slotT, silent: true, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(MessageCost, { sessionId, messageId }) }) })
   ));
   const QuotaView = ({ t: slotT, sessionId, openView }) => {
-    (0, import_react7.useEffect)(() => {
+    (0, import_react8.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 }) }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ErrorBoundary, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(BalanceDashboard, { sessionId, views }) }) });
   };
   ctx.effect(() => {
     let disposeView = null;
@@ -3931,14 +4208,14 @@ function apply(ctx) {
       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") })
+  const QuotaPanel = ({ t: slotT }) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "dq-panel", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "dq-panel-head", "data-window-drag": true, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h1", { className: "dq-panel-title", children: slotT("nav.quota") }),
+      /* @__PURE__ */ (0, import_jsx_runtime8.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 }) }) })
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ErrorBoundary, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(BalanceDashboard, { views }) }) })
   ] });
-  const QuotaGlyph = ({ size, active }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+  const QuotaGlyph = ({ size, active }) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
     "svg",
     {
       className: "dq-side-icon",
@@ -3954,23 +4231,23 @@ function apply(ctx) {
       "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" })
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M3.5 3.3 8 8.7l4.5-5.4" }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M8 8.7V13.2" }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M3.5 10.2h9" }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.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 [active, setActive] = (0, import_react8.useState)(() => ctx.layout.panelInfo.getSnapshot().activePanelId === QUOTA_PANEL_ID);
+    (0, import_react8.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)(
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
       "button",
       {
         type: "button",
@@ -3982,8 +4259,8 @@ function apply(ctx) {
           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") })
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "dq-side-entry-icon", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(QuotaGlyph, { size: 16 }) }),
+          wide && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "dq-side-entry-label", children: slotT("nav.quota") })
         ]
       }
     );