Add session cost widget

src/utils/widgets.ts

@@ -20,6 +20,7 @@ const widgetRegistry = new Map<WidgetItemType, Widget>([
     ['context-percentage', new widgets.ContextPercentageWidget()],
     ['context-percentage-usable', new widgets.ContextPercentageUsableWidget()],
     ['session-clock', new widgets.SessionClockWidget()],
+    ['session-cost', new widgets.SessionCostWidget()],
     ['block-timer', new widgets.BlockTimerWidget()],
     ['terminal-width', new widgets.TerminalWidthWidget()],
     ['version', new widgets.VersionWidget()],

src/widgets/SessionCost.ts

@@ -0,0 +1,35 @@
+import type { RenderContext } from '../types/RenderContext';
+import type { Settings } from '../types/Settings';
+import type {
+    Widget,
+    WidgetEditorDisplay,
+    WidgetItem
+} from '../types/Widget';
+
+export class SessionCostWidget implements Widget {
+    getDefaultColor(): string { return 'green'; }
+    getDescription(): string { return 'Shows the total session cost in USD'; }
+    getDisplayName(): string { return 'Session Cost'; }
+    getEditorDisplay(item: WidgetItem): WidgetEditorDisplay {
+        return { displayText: this.getDisplayName() };
+    }
+
+    render(item: WidgetItem, context: RenderContext, settings: Settings): string | null {
+        if (context.isPreview) {
+            return item.rawValue ? '$2.45' : 'Cost: $2.45';
+        }
+
+        const totalCost = context.data?.cost?.total_cost_usd;
+        if (totalCost === undefined) {
+            return null;
+        }
+
+        // Format the cost to 2 decimal places
+        const formattedCost = `$${totalCost.toFixed(2)}`;
+
+        return item.rawValue ? formattedCost : `Cost: ${formattedCost}`;
+    }
+
+    supportsRawValue(): boolean { return true; }
+    supportsColors(item: WidgetItem): boolean { return true; }
+}

src/widgets/index.ts

@@ -10,6 +10,7 @@ export { ContextLengthWidget } from './ContextLength';
 export { ContextPercentageWidget } from './ContextPercentage';
 export { ContextPercentageUsableWidget } from './ContextPercentageUsable';
 export { SessionClockWidget } from './SessionClock';
+export { SessionCostWidget } from './SessionCost';
 export { TerminalWidthWidget } from './TerminalWidth';
 export { VersionWidget } from './Version';
 export { CustomTextWidget } from './CustomText';