@drivemetadata-ai/sdk 0.1.1-beta.2 → 0.1.1
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 +152 -21
- package/dist/angular/index.cjs +946 -95
- package/dist/angular/index.cjs.map +1 -1
- package/dist/angular/index.d.cts +2 -2
- package/dist/angular/index.d.ts +2 -2
- package/dist/angular/index.js +946 -95
- package/dist/angular/index.js.map +1 -1
- package/dist/browser/index.cjs +947 -96
- package/dist/browser/index.cjs.map +1 -1
- package/dist/browser/index.d.cts +2 -2
- package/dist/browser/index.d.ts +2 -2
- package/dist/browser/index.js +947 -96
- package/dist/browser/index.js.map +1 -1
- package/dist/next/index.cjs +946 -95
- package/dist/next/index.cjs.map +1 -1
- package/dist/next/index.d.cts +1 -1
- package/dist/next/index.d.ts +1 -1
- package/dist/next/index.js +946 -95
- package/dist/next/index.js.map +1 -1
- package/dist/node/index.cjs +81 -9
- package/dist/node/index.cjs.map +1 -1
- package/dist/node/index.js +81 -9
- package/dist/node/index.js.map +1 -1
- package/dist/react/index.cjs +946 -95
- package/dist/react/index.cjs.map +1 -1
- package/dist/react/index.d.cts +2 -2
- package/dist/react/index.d.ts +2 -2
- package/dist/react/index.js +946 -95
- package/dist/react/index.js.map +1 -1
- package/dist/{types--V8TVIqT.d.cts → types-mgbdL1V7.d.cts} +17 -4
- package/dist/{types--V8TVIqT.d.ts → types-mgbdL1V7.d.ts} +17 -4
- package/docs/architecture.md +109 -0
- package/docs/index.md +1 -0
- package/docs/integration.md +203 -5
- package/docs/npm-browser-sdk.md +4 -0
- package/package.json +4 -2
package/README.md
CHANGED
|
@@ -8,16 +8,50 @@ Enterprise-grade analytics, behavior intelligence, and customer data collection
|
|
|
8
8
|
npm install @drivemetadata-ai/sdk
|
|
9
9
|
```
|
|
10
10
|
|
|
11
|
-
|
|
11
|
+
For private beta installs, pin the beta tag:
|
|
12
|
+
|
|
13
|
+
```bash
|
|
14
|
+
npm install @drivemetadata-ai/sdk@beta
|
|
15
|
+
```
|
|
16
|
+
|
|
17
|
+
## Runtime Entries
|
|
18
|
+
|
|
19
|
+
| Runtime | Import path | Use for |
|
|
20
|
+
|---|---|---|
|
|
21
|
+
| Browser | `@drivemetadata-ai/sdk/browser` | Plain JavaScript and browser applications |
|
|
22
|
+
| React | `@drivemetadata-ai/sdk/react` | React provider and hooks |
|
|
23
|
+
| Next.js | `@drivemetadata-ai/sdk/next` | App Router and Pages Router client helpers |
|
|
24
|
+
| Angular | `@drivemetadata-ai/sdk/angular` | Angular provider and injectable service |
|
|
25
|
+
| Node.js | `@drivemetadata-ai/sdk/node` | Backend/server events only |
|
|
26
|
+
|
|
27
|
+
Do not import `@drivemetadata-ai/sdk/node` from frontend bundles. Browser, React, Next.js, and Angular integrations use public browser tokens. Node integrations use server tokens from backend-only environment variables.
|
|
28
|
+
|
|
29
|
+
## Required Browser Config
|
|
30
|
+
|
|
31
|
+
Use camelCase config keys in npm integrations:
|
|
12
32
|
|
|
13
33
|
```ts
|
|
14
|
-
|
|
34
|
+
const config = {
|
|
35
|
+
clientId: 'client_xxx',
|
|
36
|
+
workspaceId: 'workspace_xxx',
|
|
37
|
+
appId: 'app_xxx',
|
|
38
|
+
token: 'public_browser_token',
|
|
39
|
+
consent: { analytics: 'pending', advertising: 'denied' }
|
|
40
|
+
};
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
`token` is the public browser write key. It is sent to the backend as `metaData.token`.
|
|
44
|
+
|
|
45
|
+
## Browser Quick Start
|
|
15
46
|
|
|
16
|
-
|
|
47
|
+
```ts
|
|
48
|
+
import { consent, flush, getDmdHealth, identify, initDmdSDK, page, track } from '@drivemetadata-ai/sdk/browser';
|
|
49
|
+
|
|
50
|
+
initDmdSDK({
|
|
17
51
|
clientId: 'client_xxx',
|
|
18
52
|
workspaceId: 'workspace_xxx',
|
|
19
53
|
appId: 'app_xxx',
|
|
20
|
-
token: '
|
|
54
|
+
token: 'public_browser_token',
|
|
21
55
|
consent: {
|
|
22
56
|
analytics: 'pending',
|
|
23
57
|
advertising: 'denied',
|
|
@@ -27,26 +61,50 @@ const dmd = initDmdSDK({
|
|
|
27
61
|
}
|
|
28
62
|
});
|
|
29
63
|
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
64
|
+
consent.update({ analytics: 'granted' });
|
|
65
|
+
|
|
66
|
+
identify('user_123', { plan: 'enterprise' });
|
|
67
|
+
page('Product Page');
|
|
68
|
+
track('Product Viewed', { productId: 'sku_123' });
|
|
69
|
+
|
|
70
|
+
await flush();
|
|
71
|
+
console.log(getDmdHealth());
|
|
35
72
|
```
|
|
36
73
|
|
|
74
|
+
Browser events automatically include backend `metaData` fields such as `requestId`, `anonymousId`, `sessionId`, timestamps, attribution/UTM enrichment, and page context.
|
|
75
|
+
|
|
37
76
|
## React
|
|
38
77
|
|
|
39
78
|
```tsx
|
|
40
|
-
import { DmdProvider, useTrackEvent } from '@drivemetadata-ai/sdk/react';
|
|
79
|
+
import { DmdProvider, useDmdConsent, useDmdFlush, useIdentify, useTrackEvent } from '@drivemetadata-ai/sdk/react';
|
|
41
80
|
|
|
42
81
|
function ProductButton() {
|
|
43
82
|
const track = useTrackEvent();
|
|
44
|
-
|
|
83
|
+
const identify = useIdentify();
|
|
84
|
+
const flush = useDmdFlush();
|
|
85
|
+
const consent = useDmdConsent();
|
|
86
|
+
|
|
87
|
+
async function onClick() {
|
|
88
|
+
consent({ analytics: 'granted' });
|
|
89
|
+
identify('user_123', { plan: 'enterprise' });
|
|
90
|
+
track('Product Clicked', { productId: 'sku_123' });
|
|
91
|
+
await flush();
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
return <button onClick={onClick}>Track</button>;
|
|
45
95
|
}
|
|
46
96
|
|
|
47
97
|
export function App() {
|
|
48
98
|
return (
|
|
49
|
-
<DmdProvider
|
|
99
|
+
<DmdProvider
|
|
100
|
+
config={{
|
|
101
|
+
clientId: 'client_xxx',
|
|
102
|
+
workspaceId: 'workspace_xxx',
|
|
103
|
+
appId: 'app_xxx',
|
|
104
|
+
token: 'public_browser_token',
|
|
105
|
+
consent: { analytics: 'pending', advertising: 'denied' }
|
|
106
|
+
}}
|
|
107
|
+
>
|
|
50
108
|
<ProductButton />
|
|
51
109
|
</DmdProvider>
|
|
52
110
|
);
|
|
@@ -60,15 +118,55 @@ Use `@drivemetadata-ai/sdk/next` from a client component.
|
|
|
60
118
|
```tsx
|
|
61
119
|
'use client';
|
|
62
120
|
|
|
63
|
-
import { DmdProvider } from '@drivemetadata-ai/sdk/next';
|
|
121
|
+
import { DmdProvider, useDmdAppRouterPageTracking } from '@drivemetadata-ai/sdk/next';
|
|
122
|
+
import { usePathname, useSearchParams } from 'next/navigation';
|
|
123
|
+
import type { ReactNode } from 'react';
|
|
124
|
+
|
|
125
|
+
function RouteTracking() {
|
|
126
|
+
const pathname = usePathname();
|
|
127
|
+
const searchParams = useSearchParams();
|
|
128
|
+
useDmdAppRouterPageTracking(pathname, searchParams.toString());
|
|
129
|
+
return null;
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
export function AnalyticsProvider({ children }: { children: ReactNode }) {
|
|
133
|
+
return (
|
|
134
|
+
<DmdProvider
|
|
135
|
+
config={{
|
|
136
|
+
clientId: process.env.NEXT_PUBLIC_DMD_CLIENT_ID!,
|
|
137
|
+
workspaceId: process.env.NEXT_PUBLIC_DMD_WORKSPACE_ID!,
|
|
138
|
+
appId: process.env.NEXT_PUBLIC_DMD_APP_ID!,
|
|
139
|
+
token: process.env.NEXT_PUBLIC_DMD_TOKEN!,
|
|
140
|
+
consent: { analytics: 'pending', advertising: 'denied' }
|
|
141
|
+
}}
|
|
142
|
+
>
|
|
143
|
+
<RouteTracking />
|
|
144
|
+
{children}
|
|
145
|
+
</DmdProvider>
|
|
146
|
+
);
|
|
147
|
+
}
|
|
64
148
|
```
|
|
65
149
|
|
|
66
150
|
## Angular
|
|
67
151
|
|
|
68
152
|
```ts
|
|
69
153
|
import { DmdAnalyticsService, provideDmdAnalytics } from '@drivemetadata-ai/sdk/angular';
|
|
154
|
+
|
|
155
|
+
export const appConfig = {
|
|
156
|
+
providers: [
|
|
157
|
+
provideDmdAnalytics({
|
|
158
|
+
clientId: 'client_xxx',
|
|
159
|
+
workspaceId: 'workspace_xxx',
|
|
160
|
+
appId: 'app_xxx',
|
|
161
|
+
token: 'public_browser_token',
|
|
162
|
+
consent: { analytics: 'pending', advertising: 'denied' }
|
|
163
|
+
})
|
|
164
|
+
]
|
|
165
|
+
};
|
|
70
166
|
```
|
|
71
167
|
|
|
168
|
+
Call `DmdAnalyticsService.init()` only in the browser when using Angular Universal/SSR.
|
|
169
|
+
|
|
72
170
|
## Node.js
|
|
73
171
|
|
|
74
172
|
```ts
|
|
@@ -78,23 +176,56 @@ const dmd = createDmdServerClient({
|
|
|
78
176
|
clientId: 'client_xxx',
|
|
79
177
|
workspaceId: 'workspace_xxx',
|
|
80
178
|
appId: 'app_xxx',
|
|
81
|
-
token: process.env.DMD_SERVER_TOKEN
|
|
179
|
+
token: process.env.DMD_SERVER_TOKEN!,
|
|
180
|
+
timeoutMs: 5000,
|
|
181
|
+
retry: {
|
|
182
|
+
attempts: 3,
|
|
183
|
+
minDelayMs: 250,
|
|
184
|
+
maxDelayMs: 2000
|
|
185
|
+
}
|
|
82
186
|
});
|
|
83
187
|
|
|
84
188
|
await dmd.track({
|
|
85
189
|
userId: 'user_123',
|
|
86
190
|
event: 'Order Completed',
|
|
87
|
-
idempotencyKey: 'order_123'
|
|
191
|
+
idempotencyKey: 'order_123',
|
|
192
|
+
properties: {
|
|
193
|
+
amount: 500,
|
|
194
|
+
currency: 'USD'
|
|
195
|
+
}
|
|
88
196
|
});
|
|
89
197
|
```
|
|
90
198
|
|
|
91
|
-
##
|
|
199
|
+
## Default Page Context
|
|
200
|
+
|
|
201
|
+
Browser, React, Next.js, and Angular integrations automatically add page context to each collector payload:
|
|
202
|
+
|
|
203
|
+
```json
|
|
204
|
+
{
|
|
205
|
+
"metaData": {
|
|
206
|
+
"page": {
|
|
207
|
+
"url": "https://example.com/products/sku-123?utm_source=paid",
|
|
208
|
+
"path": "/products/sku-123",
|
|
209
|
+
"search": "?utm_source=paid",
|
|
210
|
+
"title": "Product Detail",
|
|
211
|
+
"referrer": "https://google.com/search?q=%5BREDACTED%5D"
|
|
212
|
+
}
|
|
213
|
+
}
|
|
214
|
+
}
|
|
215
|
+
```
|
|
216
|
+
|
|
217
|
+
Query strings in `search` and `referrer` are redacted by default except common attribution parameters.
|
|
218
|
+
|
|
219
|
+
## Diagnostics
|
|
220
|
+
|
|
221
|
+
```ts
|
|
222
|
+
import { flush, getDmdHealth } from '@drivemetadata-ai/sdk/browser';
|
|
223
|
+
|
|
224
|
+
console.log(getDmdHealth());
|
|
225
|
+
await flush();
|
|
226
|
+
```
|
|
92
227
|
|
|
93
|
-
|
|
94
|
-
- `@drivemetadata-ai/sdk/react`
|
|
95
|
-
- `@drivemetadata-ai/sdk/next`
|
|
96
|
-
- `@drivemetadata-ai/sdk/angular`
|
|
97
|
-
- `@drivemetadata-ai/sdk/node`
|
|
228
|
+
Useful drop reasons include `consent_denied`, `payload_too_large`, `queue_limit_exceeded`, and `queue_ttl_expired`.
|
|
98
229
|
|
|
99
230
|
## Documentation
|
|
100
231
|
|