vibezcheck 0.5.9 → 0.5.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +579 -174
- package/dist/ai-sdk/index.d.mts +106 -26
- package/dist/ai-sdk/index.d.ts +106 -26
- package/dist/ai-sdk/index.js +500 -189
- package/dist/ai-sdk/index.js.map +1 -1
- package/dist/ai-sdk/index.mjs +497 -179
- package/dist/ai-sdk/index.mjs.map +1 -1
- package/dist/ai-sdk/middleware.d.mts +3 -4
- package/dist/ai-sdk/middleware.d.ts +3 -4
- package/dist/ai-sdk/middleware.js +110 -136
- package/dist/ai-sdk/middleware.js.map +1 -1
- package/dist/ai-sdk/middleware.mjs +110 -126
- package/dist/ai-sdk/middleware.mjs.map +1 -1
- package/dist/billing/index.d.mts +128 -123
- package/dist/billing/index.d.ts +128 -123
- package/dist/billing/index.js +319 -234
- package/dist/billing/index.js.map +1 -1
- package/dist/billing/index.mjs +315 -232
- package/dist/billing/index.mjs.map +1 -1
- package/dist/cli/index.js +24 -10
- package/dist/cli/index.js.map +1 -1
- package/dist/cli/index.mjs +24 -10
- package/dist/cli/index.mjs.map +1 -1
- package/dist/{client-CbO6vLUe.d.ts → client-eXSwD_kI.d.ts} +2 -3
- package/dist/{client-BzwEHQlC.d.mts → client-ttJwYM7x.d.mts} +2 -3
- package/dist/customers/index.d.mts +2 -63
- package/dist/customers/index.d.ts +2 -63
- package/dist/customers/index.js +0 -176
- package/dist/customers/index.js.map +1 -1
- package/dist/customers/index.mjs +0 -163
- package/dist/customers/index.mjs.map +1 -1
- package/dist/database/index.d.mts +79 -0
- package/dist/database/index.d.ts +79 -0
- package/dist/database/index.js +160 -0
- package/dist/database/index.js.map +1 -0
- package/dist/database/index.mjs +128 -0
- package/dist/database/index.mjs.map +1 -0
- package/dist/index.d.mts +38 -35
- package/dist/index.d.ts +38 -35
- package/dist/index.js +1110 -987
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1085 -973
- package/dist/index.mjs.map +1 -1
- package/dist/meter/index.d.mts +11 -11
- package/dist/meter/index.d.ts +11 -11
- package/dist/meter/index.js +93 -94
- package/dist/meter/index.js.map +1 -1
- package/dist/meter/index.mjs +92 -84
- package/dist/meter/index.mjs.map +1 -1
- package/dist/pricing/index.d.mts +116 -3
- package/dist/pricing/index.d.ts +116 -3
- package/dist/pricing/index.js +303 -4
- package/dist/pricing/index.js.map +1 -1
- package/dist/pricing/index.mjs +291 -3
- package/dist/pricing/index.mjs.map +1 -1
- package/dist/react/index.d.mts +133 -217
- package/dist/react/index.d.ts +133 -217
- package/dist/react/index.js +797 -1198
- package/dist/react/index.js.map +1 -1
- package/dist/react/index.mjs +791 -1191
- package/dist/react/index.mjs.map +1 -1
- package/dist/session-CUnv_muf.d.ts +84 -0
- package/dist/session-D9fdP255.d.mts +84 -0
- package/dist/{types-Btf2OhIr.d.mts → types-DHlsaLvI.d.mts} +8 -42
- package/dist/{types-Btf2OhIr.d.ts → types-DHlsaLvI.d.ts} +8 -42
- package/dist/{with-billing-D7QRoNHM.d.ts → with-billing-CVGxl3ot.d.ts} +6 -8
- package/dist/{with-billing-BEqiJtCR.d.mts → with-billing-DhHGWCAp.d.mts} +6 -8
- package/examples/nextjs-app-router-openai/package.json +1 -1
- package/examples/nextjs-saas-starter/app/page.tsx +3 -3
- package/examples/nextjs-saas-starter/package.json +1 -1
- package/manifest/pricing-v1.json +10014 -0
- package/package.json +10 -31
- package/dist/auth/index.d.mts +0 -59
- package/dist/auth/index.d.ts +0 -59
- package/dist/auth/index.js +0 -129
- package/dist/auth/index.js.map +0 -1
- package/dist/auth/index.mjs +0 -90
- package/dist/auth/index.mjs.map +0 -1
- package/dist/compat/stripe-meter.d.mts +0 -21
- package/dist/compat/stripe-meter.d.ts +0 -21
- package/dist/compat/stripe-meter.js +0 -1588
- package/dist/compat/stripe-meter.js.map +0 -1
- package/dist/compat/stripe-meter.mjs +0 -1551
- package/dist/compat/stripe-meter.mjs.map +0 -1
- package/dist/compat/stripe-provider.d.mts +0 -34
- package/dist/compat/stripe-provider.d.ts +0 -34
- package/dist/compat/stripe-provider.js +0 -1898
- package/dist/compat/stripe-provider.js.map +0 -1
- package/dist/compat/stripe-provider.mjs +0 -1865
- package/dist/compat/stripe-provider.mjs.map +0 -1
- package/dist/compat/token-meter.d.mts +0 -28
- package/dist/compat/token-meter.d.ts +0 -28
- package/dist/compat/token-meter.js +0 -1405
- package/dist/compat/token-meter.js.map +0 -1
- package/dist/compat/token-meter.mjs +0 -1368
- package/dist/compat/token-meter.mjs.map +0 -1
package/README.md
CHANGED
|
@@ -1,241 +1,646 @@
|
|
|
1
1
|
# ✦ VibezCheck
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
Know what every AI request costs.
|
|
4
|
+
The cost layer for AI applications.
|
|
5
5
|
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
6
|
+
VibezCheck measures AI usage in real dollars — per request, customer, feature, model, or agent session.
|
|
7
|
+
|
|
8
|
+
```text
|
|
9
|
+
AI request → tokens → provider cost → customer economics
|
|
10
|
+
```
|
|
11
|
+
|
|
12
|
+
```bash
|
|
13
|
+
npm install vibezcheck
|
|
14
|
+
```
|
|
15
|
+
|
|
16
|
+
---
|
|
17
|
+
|
|
18
|
+
## Why VibezCheck?
|
|
19
|
+
|
|
20
|
+
Tokens are useful for engineers.
|
|
21
|
+
Dollars are useful for businesses.
|
|
22
|
+
|
|
23
|
+
AI providers bill you in tokens.
|
|
24
|
+
|
|
25
|
+
Your users buy:
|
|
26
|
+
- messages
|
|
27
|
+
- documents
|
|
28
|
+
- agent runs
|
|
29
|
+
- API calls
|
|
30
|
+
- credits
|
|
31
|
+
- subscriptions
|
|
32
|
+
|
|
33
|
+
VibezCheck connects the two.
|
|
34
|
+
|
|
35
|
+
```text
|
|
36
|
+
What your user does
|
|
37
|
+
↓
|
|
38
|
+
AI usage
|
|
39
|
+
↓
|
|
40
|
+
Provider cost
|
|
41
|
+
↓
|
|
42
|
+
Customer economics
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
Without a metering layer, you know what your users are doing — but not necessarily what each action costs you.
|
|
46
|
+
|
|
47
|
+
---
|
|
48
|
+
|
|
49
|
+
## ⚡ Quick Start
|
|
50
|
+
|
|
51
|
+
### Vercel AI SDK
|
|
52
|
+
|
|
53
|
+
Wrap an existing model:
|
|
54
|
+
|
|
55
|
+
```typescript
|
|
56
|
+
import { streamText } from 'ai';
|
|
57
|
+
import { openai } from '@ai-sdk/openai';
|
|
58
|
+
import { vibezcheck } from 'vibezcheck';
|
|
59
|
+
|
|
60
|
+
const result = streamText({
|
|
61
|
+
model: vibezcheck(openai('gpt-4o-mini'), {
|
|
62
|
+
customer: 'user_123',
|
|
63
|
+
maxCostPerCallUSD: 0.50,
|
|
64
|
+
}),
|
|
65
|
+
prompt: 'Summarize quantum computing in three sentences.',
|
|
66
|
+
});
|
|
67
|
+
```
|
|
68
|
+
|
|
69
|
+
That's it.
|
|
70
|
+
|
|
71
|
+
VibezCheck can now calculate the request's usage and provider cost while the request runs.
|
|
72
|
+
|
|
73
|
+
**Example:**
|
|
74
|
+
> `✦ $0.0028 · 1,420 tok · gpt-4o-mini`
|
|
75
|
+
|
|
76
|
+
- No VibezCheck proxy.
|
|
77
|
+
- No required database.
|
|
78
|
+
- No required cloud account.
|
|
79
|
+
|
|
80
|
+
---
|
|
81
|
+
|
|
82
|
+
## 💰 Measure
|
|
83
|
+
|
|
84
|
+
VibezCheck gives your application an economic view of AI usage.
|
|
85
|
+
|
|
86
|
+
### Request cost
|
|
87
|
+
|
|
88
|
+
```typescript
|
|
89
|
+
const cost = vibezcheck.calculateCost('gpt-4o-mini', {
|
|
90
|
+
promptTokens: 1240,
|
|
91
|
+
completionTokens: 150,
|
|
92
|
+
});
|
|
93
|
+
console.log(cost.totalUSD);
|
|
94
|
+
// 0.000276
|
|
95
|
+
```
|
|
96
|
+
|
|
97
|
+
### Customer attribution
|
|
98
|
+
|
|
99
|
+
```typescript
|
|
100
|
+
const model = vibezcheck(openai('gpt-4o-mini'), {
|
|
101
|
+
customer: 'user_123',
|
|
102
|
+
threadId: 'thread_456',
|
|
103
|
+
metadata: {
|
|
104
|
+
plan: 'pro',
|
|
105
|
+
feature: 'document-analysis',
|
|
106
|
+
},
|
|
107
|
+
});
|
|
108
|
+
```
|
|
109
|
+
|
|
110
|
+
Track usage by:
|
|
111
|
+
- customer
|
|
112
|
+
- organization
|
|
113
|
+
- feature
|
|
114
|
+
- thread
|
|
115
|
+
- model
|
|
116
|
+
- agent session
|
|
117
|
+
|
|
118
|
+
---
|
|
119
|
+
|
|
120
|
+
## 🛡️ Control
|
|
121
|
+
|
|
122
|
+
AI agents can make multiple calls before a workflow finishes.
|
|
123
|
+
Put a ceiling on them.
|
|
124
|
+
|
|
125
|
+
### Per-request limits
|
|
126
|
+
|
|
127
|
+
```typescript
|
|
128
|
+
const model = vibezcheck(openai('gpt-4o-mini'), {
|
|
129
|
+
maxCostPerCallUSD: 0.25,
|
|
130
|
+
maxTokensPerCall: 4000,
|
|
131
|
+
});
|
|
132
|
+
```
|
|
133
|
+
|
|
134
|
+
### Agent session budgets
|
|
135
|
+
|
|
136
|
+
```typescript
|
|
137
|
+
const session = vibezcheck.session({
|
|
138
|
+
customer: 'tenant_123',
|
|
139
|
+
sessionBudgetUSD: 2.00,
|
|
140
|
+
});
|
|
141
|
+
```
|
|
142
|
+
|
|
143
|
+
The entire workflow gets a hard spending ceiling.
|
|
144
|
+
|
|
145
|
+
### Tool costs
|
|
146
|
+
|
|
147
|
+
```typescript
|
|
148
|
+
const tools = session.tools(agentTools, {
|
|
149
|
+
web_search: {
|
|
150
|
+
costUSD: 0.01,
|
|
151
|
+
},
|
|
152
|
+
code_interpreter: {
|
|
153
|
+
costUSD: 0.05,
|
|
154
|
+
},
|
|
155
|
+
});
|
|
156
|
+
```
|
|
157
|
+
|
|
158
|
+
Now you can account for:
|
|
159
|
+
|
|
160
|
+
```text
|
|
161
|
+
LLM usage + Tool usage = Agent cost
|
|
162
|
+
```
|
|
11
163
|
|
|
12
164
|
---
|
|
13
165
|
|
|
14
|
-
|
|
166
|
+
## 💳 Monetize
|
|
167
|
+
|
|
168
|
+
Your provider cost can become part of your application's pricing model.
|
|
15
169
|
|
|
16
|
-
**1. On your server:** wrap your model to track spending and set a profit margin
|
|
17
170
|
```typescript
|
|
18
|
-
const model = vibezcheck(openai('gpt-4o-mini'), {
|
|
171
|
+
const model = vibezcheck(openai('gpt-4o-mini'), {
|
|
172
|
+
customer: 'user_123',
|
|
173
|
+
pricing: {
|
|
174
|
+
markup: 1.3,
|
|
175
|
+
},
|
|
176
|
+
});
|
|
177
|
+
```
|
|
178
|
+
|
|
179
|
+
A 1.3x markup means:
|
|
180
|
+
|
|
181
|
+
```text
|
|
182
|
+
Provider cost $1.00
|
|
183
|
+
Customer price $1.30
|
|
184
|
+
─────────────────────
|
|
185
|
+
Markup 30%
|
|
19
186
|
```
|
|
20
187
|
|
|
21
|
-
|
|
188
|
+
This lets you build products where AI usage can map directly to:
|
|
189
|
+
- credits
|
|
190
|
+
- usage limits
|
|
191
|
+
- customer pricing
|
|
192
|
+
- subscriptions
|
|
193
|
+
- metered billing
|
|
194
|
+
|
|
195
|
+
---
|
|
196
|
+
|
|
197
|
+
## 🧾 AI Cost Receipts
|
|
198
|
+
|
|
199
|
+
Show users the cost of individual AI responses.
|
|
200
|
+
|
|
201
|
+
```tsx
|
|
202
|
+
import { VibezReceipt } from 'vibezcheck/ui';
|
|
203
|
+
|
|
204
|
+
{message.role === 'assistant' && (
|
|
205
|
+
<VibezReceipt message={message} />
|
|
206
|
+
)}
|
|
207
|
+
```
|
|
208
|
+
|
|
209
|
+
**Example:**
|
|
210
|
+
> `✦ $0.0001 · 31 tok · gpt-4o-mini`
|
|
211
|
+
|
|
212
|
+
For complete conversations, use the spending HUD:
|
|
213
|
+
|
|
22
214
|
```tsx
|
|
215
|
+
import { VibezCheck } from 'vibezcheck/ui';
|
|
216
|
+
|
|
23
217
|
<VibezCheck messages={messages} />
|
|
24
218
|
```
|
|
25
219
|
|
|
26
|
-
|
|
220
|
+
The HUD can show:
|
|
221
|
+
|
|
222
|
+
```text
|
|
223
|
+
┌─────────────────────────┐
|
|
224
|
+
│ AI Usage │
|
|
225
|
+
│ │
|
|
226
|
+
│ $0.0248 │
|
|
227
|
+
│ 12,420 tokens │
|
|
228
|
+
│ │
|
|
229
|
+
│ gpt-4o-mini $0.0182 │
|
|
230
|
+
│ gpt-4o $0.0066 │
|
|
231
|
+
└─────────────────────────┘
|
|
232
|
+
```
|
|
27
233
|
|
|
28
234
|
---
|
|
29
235
|
|
|
30
|
-
##
|
|
236
|
+
## 🔌 Native Provider Streams
|
|
31
237
|
|
|
32
|
-
|
|
238
|
+
VibezCheck also works outside the Vercel AI SDK.
|
|
33
239
|
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
240
|
+
```typescript
|
|
241
|
+
import OpenAI from 'openai';
|
|
242
|
+
import { vibezcheck } from 'vibezcheck';
|
|
243
|
+
|
|
244
|
+
const openai = new OpenAI();
|
|
245
|
+
const client = vibezcheck.create();
|
|
246
|
+
|
|
247
|
+
const stream = await openai.chat.completions.create({
|
|
248
|
+
model: 'gpt-4o-mini',
|
|
249
|
+
messages: [
|
|
250
|
+
{
|
|
251
|
+
role: 'user',
|
|
252
|
+
content: 'Hello!',
|
|
253
|
+
},
|
|
254
|
+
],
|
|
255
|
+
stream: true,
|
|
256
|
+
stream_options: {
|
|
257
|
+
include_usage: true,
|
|
258
|
+
},
|
|
259
|
+
});
|
|
260
|
+
|
|
261
|
+
const meteredStream = client.wrapStream(stream, {
|
|
262
|
+
model: 'gpt-4o-mini',
|
|
263
|
+
customer: 'user_123',
|
|
264
|
+
onUsage: (event) => {
|
|
265
|
+
console.log(
|
|
266
|
+
`Cost: $${event.cost.totalUSD} (${event.usage.totalTokens} tokens)`
|
|
267
|
+
);
|
|
268
|
+
},
|
|
269
|
+
});
|
|
270
|
+
```
|
|
271
|
+
|
|
272
|
+
Use VibezCheck with native provider streams without routing requests through a VibezCheck gateway.
|
|
41
273
|
|
|
42
274
|
---
|
|
43
275
|
|
|
44
|
-
##
|
|
276
|
+
## 💵 Offline Pricing Engine
|
|
45
277
|
|
|
46
|
-
|
|
278
|
+
VibezCheck includes a bundled pricing catalog so known model costs can be calculated locally.
|
|
47
279
|
|
|
48
|
-
|
|
280
|
+
```typescript
|
|
281
|
+
const rates = vibezcheck.getModelPricing('gpt-4o-mini');
|
|
282
|
+
console.log(rates);
|
|
283
|
+
// { inputPer1M: 0.15, outputPer1M: 0.60 }
|
|
284
|
+
```
|
|
49
285
|
|
|
50
|
-
|
|
51
|
-
|
|
286
|
+
Calculate costs synchronously:
|
|
287
|
+
|
|
288
|
+
```typescript
|
|
289
|
+
const cost = vibezcheck.calculateCost('gpt-4o-mini', {
|
|
290
|
+
promptTokens: 1000,
|
|
291
|
+
completionTokens: 500,
|
|
292
|
+
});
|
|
293
|
+
console.log(cost.totalUSD);
|
|
294
|
+
// 0.00045
|
|
52
295
|
```
|
|
53
296
|
|
|
54
|
-
|
|
297
|
+
Optional pricing synchronization:
|
|
55
298
|
|
|
56
299
|
```typescript
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
300
|
+
await vibezcheck.syncPricing();
|
|
301
|
+
await vibezcheck.syncVercelGateway();
|
|
302
|
+
```
|
|
60
303
|
|
|
61
|
-
|
|
304
|
+
---
|
|
62
305
|
|
|
63
|
-
|
|
64
|
-
const { messages }: { messages: UIMessage[] } = await req.json();
|
|
306
|
+
## 📊 700+ Model Pricing Catalog
|
|
65
307
|
|
|
66
|
-
|
|
67
|
-
// ✦ 1 Line: track costs, add 30% profit margin, and set $0.50 runaway safety fuse
|
|
68
|
-
model: vibezcheck(openai('gpt-4o-mini'), {
|
|
69
|
-
customer: 'user_alex@example.com', // User email or Stripe customer ID
|
|
70
|
-
pricing: { margin: 1.3 }, // +30% profit margin
|
|
71
|
-
maxCostPerCallUSD: 0.50, // Auto-stops if call exceeds $0.50
|
|
72
|
-
}),
|
|
73
|
-
instructions: 'You are a helpful AI assistant.',
|
|
74
|
-
messages: await convertToModelMessages(messages),
|
|
75
|
-
});
|
|
308
|
+
VibezCheck ships with pricing information for hundreds of models and providers.
|
|
76
309
|
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
310
|
+
| Provider | Examples |
|
|
311
|
+
|---|---|
|
|
312
|
+
| **OpenAI** | GPT-4o, GPT-4o-mini, o1, o3-mini |
|
|
313
|
+
| **Anthropic** | Claude 3.5 Sonnet, Claude 3.5 Haiku, Claude 3 Opus |
|
|
314
|
+
| **Google** | Gemini 2.0 Flash, Gemini 1.5 Pro, Gemini 1.5 Flash |
|
|
315
|
+
| **DeepSeek** | DeepSeek R1, DeepSeek V3 |
|
|
316
|
+
| **Meta / Groq** | Llama 3.3 70B, Llama 3.1 8B |
|
|
317
|
+
| **Mistral** | Mistral Large, Codestral, Pixtral |
|
|
318
|
+
| **Gateways / Cloud** | AWS Bedrock, Azure OpenAI, OpenRouter, Vercel AI Gateway |
|
|
319
|
+
|
|
320
|
+
Pricing is bundled locally for offline calculations and can optionally be refreshed.
|
|
321
|
+
|
|
322
|
+
---
|
|
323
|
+
|
|
324
|
+
## 🗄️ Store Usage Events
|
|
325
|
+
|
|
326
|
+
VibezCheck does not require a database.
|
|
327
|
+
When you want persistence, attach a sink.
|
|
328
|
+
|
|
329
|
+
### Supabase
|
|
330
|
+
|
|
331
|
+
```typescript
|
|
332
|
+
const model = vibezcheck(openai('gpt-4o-mini'), {
|
|
333
|
+
customer: 'user_123',
|
|
334
|
+
database: vibezcheck.supabase(supabase),
|
|
335
|
+
});
|
|
80
336
|
```
|
|
81
337
|
|
|
82
|
-
###
|
|
338
|
+
### Custom database
|
|
83
339
|
|
|
84
|
-
|
|
85
|
-
'use client';
|
|
86
|
-
|
|
87
|
-
import { useChat } from '@ai-sdk/react';
|
|
88
|
-
import { DefaultChatTransport } from 'ai';
|
|
89
|
-
import { useState } from 'react';
|
|
90
|
-
import { VibezReceipt, VibezCheck } from 'vibezcheck/ui';
|
|
91
|
-
|
|
92
|
-
export default function ChatPage() {
|
|
93
|
-
const [input, setInput] = useState('');
|
|
94
|
-
const { messages, sendMessage, status } = useChat({
|
|
95
|
-
transport: new DefaultChatTransport({
|
|
96
|
-
api: '/api/chat',
|
|
97
|
-
}),
|
|
98
|
-
});
|
|
340
|
+
Use your existing infrastructure:
|
|
99
341
|
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
>
|
|
113
|
-
<div className="text-xs font-semibold uppercase tracking-wider text-zinc-400 mb-1.5">
|
|
114
|
-
{message.role === 'user' ? 'You' : 'Assistant'}
|
|
115
|
-
</div>
|
|
116
|
-
|
|
117
|
-
{/* Message Text */}
|
|
118
|
-
<div className="text-sm whitespace-pre-wrap leading-relaxed">
|
|
119
|
-
{message.parts
|
|
120
|
-
? message.parts.map((part, index) => {
|
|
121
|
-
switch (part.type) {
|
|
122
|
-
case 'text':
|
|
123
|
-
return <span key={index}>{part.text}</span>;
|
|
124
|
-
default:
|
|
125
|
-
return null;
|
|
126
|
-
}
|
|
127
|
-
})
|
|
128
|
-
: message.content}
|
|
129
|
-
</div>
|
|
130
|
-
|
|
131
|
-
{/* ✦ 1 Line: Micro-Receipt showing tokens, micro-cost, model, and latency */}
|
|
132
|
-
{message.role === 'assistant' && (
|
|
133
|
-
<div className="mt-3 flex justify-end">
|
|
134
|
-
<VibezReceipt message={message} />
|
|
135
|
-
</div>
|
|
136
|
-
)}
|
|
137
|
-
</div>
|
|
138
|
-
))}
|
|
139
|
-
|
|
140
|
-
{status === 'streaming' && (
|
|
141
|
-
<div className="text-xs text-zinc-400 italic">Assistant is typing...</div>
|
|
142
|
-
)}
|
|
143
|
-
</div>
|
|
144
|
-
|
|
145
|
-
{/* Input Form */}
|
|
146
|
-
<form
|
|
147
|
-
onSubmit={(e) => {
|
|
148
|
-
e.preventDefault();
|
|
149
|
-
if (!input.trim()) return;
|
|
150
|
-
sendMessage({ text: input });
|
|
151
|
-
setInput('');
|
|
152
|
-
}}
|
|
153
|
-
className="fixed bottom-0 left-0 right-0 p-4 bg-white/80 dark:bg-zinc-950/80 backdrop-blur-md border-t border-zinc-200 dark:border-zinc-800"
|
|
154
|
-
>
|
|
155
|
-
<div className="max-w-lg mx-auto flex gap-2">
|
|
156
|
-
<input
|
|
157
|
-
className="flex-1 p-3 text-sm rounded-xl border border-zinc-300 dark:border-zinc-700 bg-white dark:bg-zinc-900 shadow-sm focus:outline-none focus:ring-2 focus:ring-zinc-900 dark:focus:ring-zinc-100"
|
|
158
|
-
value={input}
|
|
159
|
-
placeholder="Type your prompt..."
|
|
160
|
-
onChange={(e) => setInput(e.target.value)}
|
|
161
|
-
/>
|
|
162
|
-
<button
|
|
163
|
-
type="submit"
|
|
164
|
-
disabled={status === 'streaming' || !input.trim()}
|
|
165
|
-
className="px-5 py-3 bg-zinc-900 dark:bg-zinc-100 text-white dark:text-zinc-900 text-sm font-semibold rounded-xl hover:opacity-90 disabled:opacity-50 transition"
|
|
166
|
-
>
|
|
167
|
-
Send
|
|
168
|
-
</button>
|
|
169
|
-
</div>
|
|
170
|
-
</form>
|
|
171
|
-
|
|
172
|
-
{/* ✦ 1 Line: Floating HUD showing real-time spending and tokens */}
|
|
173
|
-
<VibezCheck messages={messages} />
|
|
174
|
-
</div>
|
|
175
|
-
);
|
|
176
|
-
}
|
|
342
|
+
```typescript
|
|
343
|
+
const model = vibezcheck(openai('gpt-4o-mini'), {
|
|
344
|
+
customer: 'user_123',
|
|
345
|
+
database: vibezcheck.database(async (event) => {
|
|
346
|
+
await db.insert(usageEvents).values({
|
|
347
|
+
customerId: event.customerId,
|
|
348
|
+
model: event.model,
|
|
349
|
+
tokens: event.usage.totalTokens,
|
|
350
|
+
costUSD: event.cost.totalUSD,
|
|
351
|
+
});
|
|
352
|
+
}),
|
|
353
|
+
});
|
|
177
354
|
```
|
|
178
355
|
|
|
179
|
-
|
|
356
|
+
Use your own:
|
|
357
|
+
- PostgreSQL
|
|
358
|
+
- Supabase
|
|
359
|
+
- Drizzle
|
|
360
|
+
- Prisma
|
|
361
|
+
- MongoDB
|
|
362
|
+
- ClickHouse
|
|
363
|
+
- webhooks
|
|
364
|
+
- analytics systems
|
|
365
|
+
|
|
366
|
+
---
|
|
180
367
|
|
|
181
|
-
|
|
182
|
-
|
|
368
|
+
## 💳 Billing Integrations
|
|
369
|
+
|
|
370
|
+
Usage events can be connected to billing systems such as Stripe or Metronome.
|
|
371
|
+
|
|
372
|
+
For example:
|
|
373
|
+
|
|
374
|
+
```typescript
|
|
375
|
+
const model = vibezcheck('openai/gpt-4o-mini', {
|
|
376
|
+
customer: 'cus_123',
|
|
377
|
+
database: vibezcheck.database(async (event) => {
|
|
378
|
+
// Send event to your billing system
|
|
379
|
+
await recordBillableUsage({
|
|
380
|
+
customerId: event.customerId,
|
|
381
|
+
costUSD: event.cost.totalUSD,
|
|
382
|
+
});
|
|
383
|
+
}),
|
|
384
|
+
});
|
|
183
385
|
```
|
|
184
386
|
|
|
387
|
+
VibezCheck gives you the usage event.
|
|
388
|
+
You decide how that usage becomes revenue.
|
|
389
|
+
|
|
185
390
|
---
|
|
186
391
|
|
|
187
|
-
##
|
|
392
|
+
## 🧠 AI Agents
|
|
188
393
|
|
|
189
|
-
|
|
394
|
+
Agentic applications need more than token tracking.
|
|
395
|
+
They need economic boundaries.
|
|
190
396
|
|
|
191
|
-
|
|
397
|
+
```typescript
|
|
398
|
+
const session = vibezcheck.session({
|
|
399
|
+
customer: 'enterprise_123',
|
|
400
|
+
sessionBudgetUSD: 5.00,
|
|
401
|
+
});
|
|
402
|
+
|
|
403
|
+
const tools = session.tools(agentTools, {
|
|
404
|
+
web_search: {
|
|
405
|
+
costUSD: 0.01,
|
|
406
|
+
},
|
|
407
|
+
code_interpreter: {
|
|
408
|
+
costUSD: 0.05,
|
|
409
|
+
},
|
|
410
|
+
});
|
|
411
|
+
|
|
412
|
+
const result = await runAutonomousWorkflow({
|
|
413
|
+
model: session.model('gpt-4o'),
|
|
414
|
+
tools,
|
|
415
|
+
});
|
|
416
|
+
```
|
|
192
417
|
|
|
193
|
-
|
|
194
|
-
* **⇅ Unit Swap**: Click the `⇅` icon to switch between **Dollar Cost** (`$0.0028`) and **Tokens** (`1,420 tok`).
|
|
195
|
-
* **Session vs Turn**: Switch between `[Session]` (total conversation spend) and `[Latest Turn]` (last reply).
|
|
196
|
-
* **Multi-Model Breakdown**: If you use multiple models in one chat, it shows the exact split for each model.
|
|
197
|
-
* **Customer Privacy by Default**: End-users only see their billed cost. Your wholesale costs and profit margins are hidden by default.
|
|
418
|
+
VibezCheck can track:
|
|
198
419
|
|
|
199
|
-
```
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
onTopUp={(amount) => console.log('User wants to top up credits:', amount)}
|
|
204
|
-
/>
|
|
420
|
+
```text
|
|
421
|
+
Model calls + Tool calls + Multiple turns
|
|
422
|
+
↓
|
|
423
|
+
Total agent cost
|
|
205
424
|
```
|
|
206
425
|
|
|
207
|
-
|
|
426
|
+
---
|
|
208
427
|
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
428
|
+
## 🏗️ Production Characteristics
|
|
429
|
+
|
|
430
|
+
### Zero runtime dependencies
|
|
431
|
+
`dependencies: {}`
|
|
432
|
+
The core library does not require an external runtime dependency.
|
|
433
|
+
Provider SDKs, React, and database clients are optional integrations.
|
|
434
|
+
|
|
435
|
+
### No network proxy
|
|
436
|
+
Model requests continue directly between your application and the provider.
|
|
437
|
+
VibezCheck runs inside your application.
|
|
438
|
+
|
|
439
|
+
### No prompt storage by default
|
|
440
|
+
VibezCheck does not need to store prompts or model completions to calculate usage and cost.
|
|
441
|
+
Your application controls what gets persisted through optional database adapters.
|
|
442
|
+
|
|
443
|
+
### Failure isolation
|
|
444
|
+
Telemetry and database reporting should not become a dependency of the user-facing AI response.
|
|
445
|
+
VibezCheck supports asynchronous reporting through serverless lifecycle mechanisms such as:
|
|
446
|
+
- Next.js / Vercel `globalThis.after()`
|
|
447
|
+
- Cloudflare Workers `waitUntil()`
|
|
448
|
+
|
|
449
|
+
### Offline capable
|
|
450
|
+
The bundled pricing catalog allows cost calculations without requiring an external network request.
|
|
451
|
+
|
|
452
|
+
---
|
|
453
|
+
|
|
454
|
+
## 🔄 How It Works
|
|
455
|
+
|
|
456
|
+
```text
|
|
457
|
+
Your Application
|
|
458
|
+
│
|
|
459
|
+
▼
|
|
460
|
+
┌──────────────────┐
|
|
461
|
+
│ AI Provider │
|
|
462
|
+
│ OpenAI / Claude │
|
|
463
|
+
│ Gemini / etc. │
|
|
464
|
+
└────────┬─────────┘
|
|
465
|
+
│
|
|
466
|
+
▼
|
|
467
|
+
┌──────────────────┐
|
|
468
|
+
│ VibezCheck │
|
|
469
|
+
│ │
|
|
470
|
+
│ Usage │
|
|
471
|
+
│ Cost │
|
|
472
|
+
│ Attribution │
|
|
473
|
+
│ Limits │
|
|
474
|
+
└────────┬─────────┘
|
|
475
|
+
│
|
|
476
|
+
┌────┴────┐
|
|
477
|
+
▼ ▼
|
|
478
|
+
Application Async sinks
|
|
479
|
+
economics DB / billing / analytics
|
|
213
480
|
```
|
|
214
481
|
|
|
482
|
+
The important part:
|
|
483
|
+
Your model traffic stays in your application path.
|
|
484
|
+
VibezCheck adds the economic layer around it.
|
|
485
|
+
|
|
215
486
|
---
|
|
216
487
|
|
|
217
|
-
##
|
|
488
|
+
## 🧩 Supported Integrations
|
|
489
|
+
|
|
490
|
+
### AI SDKs
|
|
491
|
+
- Vercel AI SDK
|
|
492
|
+
- OpenAI
|
|
493
|
+
- Anthropic
|
|
494
|
+
- Gemini
|
|
495
|
+
- Native streaming APIs
|
|
496
|
+
|
|
497
|
+
### Storage
|
|
498
|
+
- Supabase
|
|
499
|
+
- Custom database adapters
|
|
500
|
+
- PostgreSQL
|
|
501
|
+
- Drizzle
|
|
502
|
+
- Prisma
|
|
503
|
+
- MongoDB
|
|
504
|
+
- ClickHouse
|
|
505
|
+
|
|
506
|
+
### Billing
|
|
507
|
+
- Stripe
|
|
508
|
+
- Metronome
|
|
509
|
+
- Custom billing systems
|
|
510
|
+
|
|
511
|
+
### UI
|
|
512
|
+
- React
|
|
513
|
+
- `<VibezReceipt />`
|
|
514
|
+
- `<VibezCheck />`
|
|
218
515
|
|
|
219
|
-
|
|
516
|
+
---
|
|
517
|
+
|
|
518
|
+
## 🔍 CLI
|
|
220
519
|
|
|
221
|
-
|
|
222
|
-
* `gpt-4o-mini (1 turn)`: 31 tok · $0.0001
|
|
223
|
-
* `claude-3-5-sonnet (1 turn)`: 420 tok · $0.0068
|
|
520
|
+
Audit your project for potentially unmetered AI calls:
|
|
224
521
|
|
|
225
|
-
|
|
522
|
+
```bash
|
|
523
|
+
npx vibezcheck audit
|
|
524
|
+
```
|
|
525
|
+
|
|
526
|
+
Generate starter examples:
|
|
527
|
+
|
|
528
|
+
```bash
|
|
529
|
+
npx vibezcheck examples
|
|
530
|
+
```
|
|
226
531
|
|
|
227
532
|
---
|
|
228
533
|
|
|
229
|
-
##
|
|
534
|
+
## 🚀 Complete Example
|
|
535
|
+
|
|
536
|
+
A typical AI chat application can look like this:
|
|
537
|
+
|
|
538
|
+
```typescript
|
|
539
|
+
import { streamText } from 'ai';
|
|
540
|
+
import { openai } from '@ai-sdk/openai';
|
|
541
|
+
import { vibezcheck } from 'vibezcheck';
|
|
542
|
+
|
|
543
|
+
export async function POST(req: Request) {
|
|
544
|
+
const { messages, userId } = await req.json();
|
|
545
|
+
|
|
546
|
+
const result = streamText({
|
|
547
|
+
model: vibezcheck(openai('gpt-4o-mini'), {
|
|
548
|
+
customer: userId,
|
|
549
|
+
pricing: {
|
|
550
|
+
markup: 1.3,
|
|
551
|
+
},
|
|
552
|
+
maxCostPerCallUSD: 0.50,
|
|
553
|
+
}),
|
|
554
|
+
messages,
|
|
555
|
+
});
|
|
556
|
+
|
|
557
|
+
return vibezcheck.toResponse(result);
|
|
558
|
+
}
|
|
559
|
+
```
|
|
560
|
+
|
|
561
|
+
Your application now has:
|
|
562
|
+
- ✓ Model usage
|
|
563
|
+
- ✓ Dollar cost
|
|
564
|
+
- ✓ Customer attribution
|
|
565
|
+
- ✓ Pricing / markup
|
|
566
|
+
- ✓ Per-request protection
|
|
567
|
+
- ✓ Streaming support
|
|
568
|
+
|
|
569
|
+
---
|
|
570
|
+
|
|
571
|
+
## 🎯 The Economic Layer for AI
|
|
572
|
+
|
|
573
|
+
AI applications are becoming more autonomous.
|
|
574
|
+
More messages.
|
|
575
|
+
More context.
|
|
576
|
+
More tool calls.
|
|
577
|
+
More model calls.
|
|
578
|
+
More cost.
|
|
579
|
+
|
|
580
|
+
VibezCheck gives your application a way to understand that cost at the point where the AI request happens.
|
|
581
|
+
|
|
582
|
+
```text
|
|
583
|
+
MEASURE
|
|
584
|
+
│
|
|
585
|
+
┌─────┴─────┐
|
|
586
|
+
│ │
|
|
587
|
+
tokens dollars
|
|
588
|
+
│ │
|
|
589
|
+
└─────┬─────┘
|
|
590
|
+
│
|
|
591
|
+
CONTROL
|
|
592
|
+
budgets / limits
|
|
593
|
+
│
|
|
594
|
+
MONETIZE
|
|
595
|
+
pricing / billing
|
|
596
|
+
```
|
|
597
|
+
|
|
598
|
+
**Know what every AI request costs.**
|
|
599
|
+
|
|
600
|
+
---
|
|
601
|
+
|
|
602
|
+
## Roadmap
|
|
603
|
+
|
|
604
|
+
### Current
|
|
605
|
+
- Request-level cost metering
|
|
606
|
+
- 700+ model pricing catalog
|
|
607
|
+
- Streaming support
|
|
608
|
+
- Customer attribution
|
|
609
|
+
- Circuit breakers
|
|
610
|
+
- Agent session budgets
|
|
611
|
+
- Tool cost tracking
|
|
612
|
+
- React usage UI
|
|
613
|
+
- Database sinks
|
|
614
|
+
|
|
615
|
+
### Next
|
|
616
|
+
- Persistent cost history
|
|
617
|
+
- Per-customer budgets
|
|
618
|
+
- Spend alerts
|
|
619
|
+
- Cost anomaly detection
|
|
620
|
+
- Native billing integrations
|
|
621
|
+
- Unit economics analytics
|
|
622
|
+
|
|
623
|
+
---
|
|
624
|
+
|
|
625
|
+
## Contributing
|
|
626
|
+
|
|
627
|
+
Contributions are welcome.
|
|
628
|
+
|
|
629
|
+
```bash
|
|
630
|
+
pnpm install
|
|
631
|
+
pnpm test
|
|
632
|
+
pnpm typecheck
|
|
633
|
+
```
|
|
230
634
|
|
|
231
|
-
|
|
635
|
+
To update model pricing:
|
|
636
|
+
`src/pricing/catalog.ts`
|
|
232
637
|
|
|
233
|
-
|
|
234
|
-
* **Customer API Keys**: Issue `vz_live_...` keys saved in Stripe customer metadata (`ApiKeyAuth`).
|
|
235
|
-
* **Agent Session Ceilings**: Limit a multi-step agent to a hard $1.00 budget with `AgentSession`.
|
|
638
|
+
Please ensure tests pass and no unnecessary runtime dependencies are introduced.
|
|
236
639
|
|
|
237
640
|
---
|
|
238
641
|
|
|
239
|
-
##
|
|
642
|
+
## License
|
|
240
643
|
|
|
241
|
-
MIT ©
|
|
644
|
+
MIT © VibezCheck
|
|
645
|
+
[Website](https://vibezcheck.xyz/) · [npm](https://www.npmjs.com/package/vibezcheck)
|
|
646
|
+
Contact: [yt@vibezcheck.app](mailto:yt@vibezcheck.app)
|