@cat-factory/app 0.286.2 → 0.286.4

package/app/components/observability/StepMetricsBar.vue

@@ -18,7 +18,17 @@ import {
 // on the step surfaces (step detail, pipeline timeline). A no-op when there are no
 // recorded calls. Clicking anywhere emits `inspect` so a parent can open the
 // drill-down panel.
-const props = defineProps<{ metrics: StepMetrics; clickable?: boolean }>()
+const props = defineProps<{
+  metrics: StepMetrics
+  /**
+   * How the step's tokens were billed, off `PipelineStep.usageBilling`. It is what makes the
+   * amount below readable: both billing kinds are priced identically here, so a subscription
+   * step's list price is indistinguishable from money actually spent unless it says so.
+   * Absent for a step that recorded no usage, which is also a step with no amount to qualify.
+   */
+  billing?: 'metered' | 'subscription'
+  clickable?: boolean
+}>()
 defineEmits<{ inspect: [] }>()
 
 const { t } = useI18n()
@@ -38,6 +48,7 @@ const hasCache = computed(() => cacheRead.value > 0 || cacheWrite.value > 0)
 // no rate for the model that ran — the figure is then OMITTED rather than shown as 0.00, which
 // would claim the step was free.
 const cost = computed(() => formatCost(m.value.costEstimate, m.value.costCurrency))
+const onSubscription = computed(() => props.billing === 'subscription')
 const headroom = computed(() => headroomRatio(m.value))
 const transport = computed(() => transportRatio(m.value))
 const headroomTone = computed(() => headroomColor(headroom.value, m.value.truncatedCalls > 0))
@@ -68,8 +79,23 @@ const headroomTone = computed(() => headroomColor(headroom.value, m.value.trunca
       </span>
       <template v-if="cost">
         <span class="text-slate-500">·</span>
-        <span class="tabular-nums text-slate-300" :title="t('observability.metricsBar.costHint')">
-          {{ cost }}
+        <span
+          class="tabular-nums"
+          :class="onSubscription ? 'text-slate-500' : 'text-slate-300'"
+          :title="
+            onSubscription
+              ? t('observability.metricsBar.subscriptionCostHint')
+              : t('observability.metricsBar.costHint')
+          "
+        >
+          {{ onSubscription ? `~${cost}` : cost }}
+        </span>
+        <span
+          v-if="onSubscription"
+          class="text-[10px] uppercase tracking-wide text-slate-500"
+          :title="t('observability.metricsBar.subscriptionCostHint')"
+        >
+          {{ t('observability.metricsBar.subscription') }}
         </span>
       </template>
       <div class="ms-auto flex items-center gap-1">

package/app/components/observability/StepModelActivity.vue

@@ -13,6 +13,8 @@ import StepMetricsBar from '~/components/observability/StepMetricsBar.vue'
 // nothing only when there's neither a run to inspect nor any recorded calls.
 const props = defineProps<{
   metrics?: StepMetrics | null
+  /** How the step's tokens were billed, so the rollup's amount is not read as spend. */
+  billing?: 'metered' | 'subscription'
   /** The run whose per-call panel the header link / bar click opens. */
   instanceId?: string
 }>()
@@ -43,6 +45,7 @@ function openObservability() {
     <StepMetricsBar
       v-if="hasCalls && metrics"
       :metrics="metrics"
+      :billing="billing"
       clickable
       @inspect="openObservability"
     />

package/app/components/panels/StepMetadataCard.vue

@@ -299,7 +299,12 @@ async function copyRunId() {
     <!-- LLM observability rollup (tokens, output-limit headroom,
          transport-vs-execution); click to open the full per-call panel. Self-gates: the
          "View all calls →" link shows for any run, the metrics bar only when calls exist. -->
-    <StepModelActivity class="mt-4" :metrics="step.metrics" :instance-id="instanceId" />
+    <StepModelActivity
+      class="mt-4"
+      :metrics="step.metrics"
+      :billing="step.usageBilling"
+      :instance-id="instanceId"
+    />
 
     <!-- standards (prompt fragments) folded into this step -->
     <div v-if="step.selectedFragmentIds && step.selectedFragmentIds.length" class="mt-4">

package/app/components/panels/StepRunMeta.vue

@@ -145,6 +145,10 @@ async function copyRunId() {
          run's observability panel even when this step recorded no calls (e.g. a gate that
          passed its precheck with no helper spun up), so every window reaches it the same
          way; the metrics bar shows only when the step itself made calls. -->
-    <StepModelActivity :metrics="step.metrics" :instance-id="instanceId" />
+    <StepModelActivity
+      :metrics="step.metrics"
+      :billing="step.usageBilling"
+      :instance-id="instanceId"
+    />
   </div>
 </template>

package/app/components/pipeline/PipelineProgress.vue

@@ -549,6 +549,7 @@ const ITEM_ICON: Record<string, string> = {
           <StepMetricsBar
             v-if="s.metrics && s.metrics.calls > 0"
             :metrics="s.metrics"
+            :billing="s.usageBilling"
             clickable
             class="mt-2"
             @inspect="ui.openObservability(instance.id)"

package/i18n/locales/de.json

@@ -3812,6 +3812,8 @@
       "calls": "{count} Aufruf | {count} Aufrufe",
       "inputCompletionTokens": "Eingabe- / Ausgabe-Tokens insgesamt. Die Eingabe zählt auch gecachte Tokens mit: Sie belegen weiterhin das Kontextfenster, genau wie es die Kontextanzeige von Claude Code zählt.",
       "costHint": "Geschätzte Kosten der Token dieses Schritts zu Listenpreisen, jede Eingabeklasse mit ihrem eigenen Satz. Ein Abonnementlauf zahlt nichts pro Token; dies ist also der Betrag, den dieselben Token nach Verbrauch gekostet hätten.",
+      "subscription": "Abonnement",
+      "subscriptionCostHint": "Dieser Schritt lief über ein Pauschalabonnement und kostete daher kein Geld pro Token. Der Betrag ist das, was dieselben Token über die verbrauchsabhängige API gekostet hätten, und er zählt nicht zum Ausgabenbudget.",
       "fresh": "{tokens} frisch",
       "freshHint": "Eingabe, die von Grund auf verarbeitet wurde, ohne Anteil aus dem Cache",
       "cacheRead": "{tokens} aus dem Cache gelesen",

package/i18n/locales/en.json

@@ -1863,6 +1863,8 @@
       "calls": "{count} call | {count} calls",
       "inputCompletionTokens": "Total input / completion tokens. Input counts cached tokens too: they still occupy the context window, exactly as Claude Code's own context gauge counts them.",
       "costHint": "Estimated cost of this step's tokens at list rates, each input class priced at its own. A subscription run pays nothing per token, so this is what the same tokens would have cost metered.",
+      "subscription": "subscription",
+      "subscriptionCostHint": "This step ran on a flat-rate subscription, so it cost no money per token. The figure is what the same tokens would have cost on the metered API, and it is excluded from the spend budget.",
       "fresh": "{tokens} fresh",
       "freshHint": "Input processed from scratch, with nothing served from the cache",
       "cacheRead": "{tokens} cache read",

package/i18n/locales/es.json

@@ -1759,6 +1759,8 @@
       "calls": "{count} llamada | {count} llamadas",
       "inputCompletionTokens": "Tokens totales de entrada / salida. La entrada tambien cuenta los tokens en caché: siguen ocupando la ventana de contexto, igual que los cuenta el medidor de contexto de Claude Code.",
       "costHint": "Coste estimado de los tokens de este paso a precios de lista, cada clase de entrada con su propia tarifa. Una ejecución por suscripción no paga nada por token, así que esto es lo que habrían costado los mismos tokens con pago por uso.",
+      "subscription": "suscripción",
+      "subscriptionCostHint": "Este paso se ejecutó con una suscripción de tarifa plana, así que no costó dinero por token. La cifra es lo que habrían costado los mismos tokens en la API de pago por uso, y queda excluida del presupuesto de gasto.",
       "fresh": "{tokens} frescos",
       "freshHint": "Entrada procesada desde cero, sin nada servido desde la caché",
       "cacheRead": "{tokens} leídos de caché",

package/i18n/locales/fr.json

@@ -1759,6 +1759,8 @@
       "calls": "{count} appel | {count} appels",
       "inputCompletionTokens": "Total des tokens d'entrée / de sortie. L'entree compte aussi les tokens en cache : ils occupent toujours la fenêtre de contexte, exactement comme les compte la jauge de contexte de Claude Code.",
       "costHint": "Coût estimé des tokens de cette étape aux tarifs publics, chaque classe d'entrée à son propre taux. Une exécution sur abonnement ne paie rien au token ; ceci est donc ce que les mêmes tokens auraient coûté à l'usage.",
+      "subscription": "abonnement",
+      "subscriptionCostHint": "Cette étape s'est exécutée sur un abonnement forfaitaire et n'a donc rien coûté au token. Le montant correspond à ce que les mêmes tokens auraient coûté via l'API facturée à l'usage, et il est exclu du budget de dépenses.",
       "fresh": "{tokens} frais",
       "freshHint": "Entrée traitée de zero, sans rien servi depuis le cache",
       "cacheRead": "{tokens} lus depuis le cache",

package/i18n/locales/he.json

@@ -1759,6 +1759,8 @@
       "calls": "{count} קריאה | שתי קריאות | {count} קריאות",
       "inputCompletionTokens": "סך טוקני הקלט / הפלט. הקלט סופר גם טוקנים מהמטמון: הם עדיין תופסים את חלון ההקשר, בדיוק כפי שמד ההקשר של Claude Code סופר אותם.",
       "costHint": "עלות משוערת של הטוקנים בצעד זה לפי מחירון, כל סוג קלט בתעריף שלו. הרצה במסגרת מנוי אינה משלמת לפי טוקן, ולכן זהו הסכום שאותם טוקנים היו עולים בתשלום לפי שימוש.",
+      "subscription": "מנוי",
+      "subscriptionCostHint": "הצעד הזה רץ במסגרת מנוי בתעריף אחיד, ולכן לא עלה כסף לפי טוקן. הסכום הוא מה שאותם טוקנים היו עולים ב-API בתשלום לפי שימוש, והוא אינו נכלל בתקציב ההוצאות.",
       "fresh": "{tokens} חדשים",
       "freshHint": "קלט שעובד מאפס, ללא שום חלק שהוגש מהמטמון",
       "cacheRead": "{tokens} נקראו מהמטמון",

package/i18n/locales/it.json

@@ -3812,6 +3812,8 @@
       "calls": "{count} chiamata | {count} chiamate",
       "inputCompletionTokens": "Token totali di input / output. L'input conta anche i token in cache: occupano comunque la finestra di contesto, esattamente come li conta l'indicatore di contesto di Claude Code.",
       "costHint": "Costo stimato dei token di questo passo ai prezzi di listino, ogni classe di input alla propria tariffa. Un'esecuzione in abbonamento non paga nulla per token, quindi questo è quanto sarebbero costati gli stessi token a consumo.",
+      "subscription": "abbonamento",
+      "subscriptionCostHint": "Questo passo è stato eseguito con un abbonamento a tariffa fissa, quindi non è costato denaro per token. La cifra è quanto sarebbero costati gli stessi token sull'API a consumo ed è esclusa dal budget di spesa.",
       "fresh": "{tokens} freschi",
       "freshHint": "Input elaborato da zero, senza nulla servito dalla cache",
       "cacheRead": "{tokens} letti dalla cache",

package/i18n/locales/ja.json

@@ -1759,6 +1759,8 @@
       "calls": "{count} 件の呼び出し | {count} 件の呼び出し",
       "inputCompletionTokens": "入力 / 出力トークンの合計。入力にはキャッシュされたトークンも含まれます。それらも依然としてコンテキストウィンドウを占有するため、Claude Code のコンテキスト表示と同じ数え方です。",
       "costHint": "このステップのトークンの定価ベースの推定コストで、入力の種類ごとに個別の単価を適用しています。サブスクリプション実行はトークン単位の課金がないため、これは同じトークンを従量課金で使った場合の金額です。",
+      "subscription": "サブスクリプション",
+      "subscriptionCostHint": "このステップは定額のサブスクリプションで実行されたため、トークン単位の費用は発生していません。表示額は同じトークンを従量課金の API で使った場合の金額であり、支出予算には含まれません。",
       "fresh": "{tokens} 新規",
       "freshHint": "キャッシュから提供された分を含まない、ゼロから処理された入力",
       "cacheRead": "{tokens} キャッシュ読み取り",

package/i18n/locales/pl.json

@@ -1759,6 +1759,8 @@
       "calls": "{count} wywołanie | {count} wywołania | {count} wywołań",
       "inputCompletionTokens": "Łączna liczba tokenów wejścia / wyjscia. Wejście liczy takze tokeny z pamięci podręcznej: nadal zajmują okno kontekstu, dokładnie tak, jak liczy je wskaźnik kontekstu w Claude Code.",
       "costHint": "Szacowany koszt tokenów tego kroku według cennika, każda klasa wejścia po własnej stawce. Uruchomienie w ramach subskrypcji nie płaci za tokeny, więc jest to kwota, jaką te same tokeny kosztowałyby w rozliczeniu za użycie.",
+      "subscription": "subskrypcja",
+      "subscriptionCostHint": "Ten krok wykonał się w ramach subskrypcji o stałej opłacie, więc nie kosztował nic za tokeny. Kwota to tyle, ile te same tokeny kosztowałyby w API rozliczanym za użycie, i nie wlicza się do budżetu wydatków.",
       "fresh": "{tokens} świeżych",
       "freshHint": "Wejście przetworzone od zera, bez żadnej części obsłużonej z pamięci podręcznej",
       "cacheRead": "{tokens} odczytane z pamięci podręcznej",

package/i18n/locales/tr.json

@@ -1759,6 +1759,8 @@
       "calls": "{count} çağrı | {count} çağrı",
       "inputCompletionTokens": "Toplam giriş / çıkış token'i. Giriş, önbelleğe alınmış token'ları da sayar: bunlar hâlâ bağlam penceresini kaplar, tıpkı Claude Code'un kendi bağlam göstergesinin saydığı gibi.",
       "costHint": "Bu adımın tokenlarının liste fiyatlarına göre, her girdi sınıfı kendi tarifesiyle hesaplanan tahmini maliyeti. Abonelikle yapılan bir çalıştırma token başına ücret ödemez; bu, aynı tokenların kullandıkça öde ile kaça mal olacağıdır.",
+      "subscription": "abonelik",
+      "subscriptionCostHint": "Bu adım sabit ücretli bir abonelik üzerinde çalıştı, dolayısıyla token başına para harcamadı. Gösterilen tutar, aynı tokenların kullandıkça öde API üzerinde kaça mal olacağıdır ve harcama bütçesine dahil edilmez.",
       "fresh": "{tokens} yeni",
       "freshHint": "Önbellekten hiçbir şey sunulmadan sıfırdan işlenen giriş",
       "cacheRead": "{tokens} önbellekten okundu",

package/i18n/locales/uk.json

@@ -1759,6 +1759,8 @@
       "calls": "{count} виклик | {count} виклики | {count} викликів",
       "inputCompletionTokens": "Загальна кількість токенів входу / виходу. Вхід враховує й токени з кешу: вони так само займають вікно контексту, точно як їх рахує індикатор контексту в Claude Code.",
       "costHint": "Орієнтовна вартість токенів цього кроку за прейскурантом, кожен клас вхідних токенів за власним тарифом. Запуск за підпискою не оплачується потокенно, тож це сума, яку ті самі токени коштували б за фактичне використання.",
+      "subscription": "підписка",
+      "subscriptionCostHint": "Цей крок виконувався за підпискою з фіксованою оплатою, тож не коштував грошей за токени. Сума показує, скільки ті самі токени коштували б в API з оплатою за використання, і вона не входить до бюджету витрат.",
       "fresh": "{tokens} нових",
       "freshHint": "Вхід, оброблений з нуля, без жодної частини з кешу",
       "cacheRead": "{tokens} прочитано з кешу",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cat-factory/app",
-  "version": "0.286.2",
+  "version": "0.286.4",
   "description": "Reusable Nuxt layer for the Agent Architecture Board SPA (components, stores, composables, pages). Consume it from a thin deployment app via `extends: ['@cat-factory/app']` and point it at your backend with NUXT_PUBLIC_API_BASE. See deploy/frontend for an example.",
   "repository": {
     "type": "git",
@@ -18,7 +18,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@cat-factory/contracts": "0.331.0",
+    "@cat-factory/contracts": "0.333.0",
     "@modular-frontend/core": "0.6.0",
     "@modular-vue/core": "^1.5.0",
     "@modular-vue/journeys": "^1.4.0",