Public API Overview
This page documents the public API surface of the Trackkit JavaScript SDK.
Looking for full SDK signatures? See the SDK (TypeDoc) reference.
Summary
Core functions are imported from trackkit, the main entrypoint:
| Function | Instance? | Singleton? | Description |
|---|---|---|---|
createAnalytics(opts) | ✔️ | — | Creates an isolated facade instance. Preferred for modern apps. |
init(opts) | — | ✔️ | Initializes the global singleton façade. |
destroy() | ✔️ | ✔️ | Tears down listeners, clears queues. |
track(name, props?, url?) | ✔️ | ✔️ | Sends a custom analytics event. |
pageview(url?) | ✔️ | ✔️ | Sends a pageview (or inferred URL). |
identify(userId?) | ✔️ | ✔️ | Identifies a user; provider-specific behaviour applies. |
grantConsent() | ✔️ | ✔️ | Set consent → granted, flush queue. |
denyConsent() | ✔️ | ✔️ | Set consent → denied, drop analytics items. |
resetConsent() | ✔️ | ✔️ | Return consent to pending. |
setConsent(status) | ✔️ | ✔️ | Directly set status. |
getConsent() | ✔️ | ✔️ | Return current consent snapshot. |
waitForReady() | ✔️ | ✔️ | Promise that resolves when provider is ready. |
flushIfReady() | ✔️ | ✔️ | Flush queue if provider + consent allow. |
hasQueuedEvents() | ✔️ | ✔️ | Indicates buffer state. |
getDiagnostics() | ✔️ | ✔️ | Internal state snapshot (provider, queue, consent, URLs). |
For server-side rendering (SSR), import from trackkit/ssr:
| Function | Purpose |
|---|---|
serializeSSRQueue() | Emit <script> hydration payload. |
getSSRQueue() | Retrieve queue array (server only). |
enqueueSSREvent() | Low-level queue write. |
getSSRQueueLength() | Convenience helper |
ssrTrack() / ssrPageview() / ssrIdentify() | Server-side variants that queues instead of dispatching. |
TypeScript types are also exported from the main module:
import type {
InitOptions,
ProviderType,
AnalyticsInstance,
EventMap,
ConsentStatus,
ConsentStoredState,
DiagnosticsSnapshot,
} from 'trackkit';Main module: trackkit
Initialization
createAnalytics<E extends EventMap = EventMap>(opts?: InitOptions): AnalyticsInstance<E>
Factory API. Creates a new analytics instance.
Use this as the preferred integration style:
import { createAnalytics } from 'trackkit';
type AnalyticsEvents = {
signup_completed: { plan: 'free' | 'pro' };
};
const analytics = createAnalytics<AnalyticsEvents>({
provider: 'umami',
site: 'my-site',
autoTrack: true,
});
// Use instance methods:
analytics.pageview();
analytics.track('signup_completed', { plan: 'pro' });Eis an optional event map type for typedtrack()calls.InitOptionsconfigures provider, queue, consent, resilience, etc. See the Configuration guide for full fields.
init(opts: InitOptions): void
Singleton API. Initialises the global analytics facade.
import { init, pageview } from 'trackkit';
init({ provider: 'umami', site: 'my-site' });
pageview();Use this when you prefer a global singleton (e.g. simple sites, legacy code). For new projects, prefer createAnalytics.
destroy(): void
Tears down the singleton instance:
- stops auto-tracking,
- clears queues,
- detaches listeners where possible.
Safe to call multiple times.
Event methods
These exist on both:
- the singleton (imported directly), and
- instances returned from
createAnalytics.
track(eventName: string, props?: Record<string, unknown>): void
Record a custom event.
track('signup_completed', { plan: 'pro', source: 'landing' });When using typed events via createAnalytics<MyEvents>, eventName and props are type-checked.
pageview(path?: string | { path?: string; title?: string; referrer?: string }): void
Record a pageview.
pathomitted → currentwindow.location.pathprovided → explicit path.- The options object variant lets you attach metadata (title, referrer, etc., depending on provider).
Examples:
pageview(); // current URL
pageview('/pricing'); // explicit path
pageview({ path: '/x' }); // structuredidentify(userId: string, traits?: Record<string, unknown>): void
Associate traits with a user identifier.
identify('user_123', { plan: 'pro', email: 'user@example.com' });Provider support for identify varies; check provider docs.
Consent API
These functions operate on the singleton or an instance:
singleton:
tsimport { grantConsent, denyConsent } from 'trackkit';instance:
tsconst analytics = createAnalytics(); analytics.grantConsent();
getConsent(): ConsentStoredState | undefined
Returns the current consent state and metadata, if available. The shape matches the consent storage schema.
Typical fields:
status:'pending' | 'granted' | 'denied'version?: consent policy versionmethod?: how consent was obtained (e.g.'banner')
grantConsent(): void
Mark consent as granted. This:
- updates stored state,
- unblocks queued analytics events (if your config allows queueing while pending),
- allows future analytics events to be enqueued/sent.
denyConsent(): void
Mark consent as denied. This:
- updates stored state,
- prevents future non-essential events from being queued,
- may still allow “essential” events depending on config (
allowEssentialOnDenied).
resetConsent(): void
Reset consent back to its initial status (usually 'pending'), clearing stored decisions.
Useful for debugging or for exposing a “change my consent” option in UI.
setConsent(status: ConsentStatus, meta?: { version?: string; method?: string }): void
Low-level setter to directly set the internal consent status and optional metadata.
Prefer grantConsent / denyConsent / resetConsent where possible. setConsent is exposed for advanced cases or when bridging an external CMP.
onConsentChange(handler: (state: ConsentStoredState) => void): () => void
Subscribe to consent changes. Returns an unsubscribe function.
const unsubscribe = onConsentChange(state => {
console.log('Consent changed:', state.status);
});
// Later:
unsubscribe();Utilities
waitForReady(timeoutMs?: number): Promise<void>
Resolves when:
- the provider has initialised and
- the initial flush of any queued events has completed
…or rejects after timeoutMs (defaulting to a sensible value).
Use this before relying on analytics for critical flows (e.g. blocking funnels in E2E tests).
getFacade(): unknown
Returns the underlying facade instance used by the singleton.
This is primarily for introspection and advanced integrations. The type is intentionally loose; prefer getDiagnostics() for read-only state.
flushIfReady(): Promise<void>
If the provider is initialised, flush any queued events immediately.
No-op if not ready.
hasQueuedEvents(): boolean
True if there are events currently buffered in:
- the facade runtime queue, and/or
- the SSR queue (once hydrated).
getDiagnostics(): DiagnosticsSnapshot
Return a structured snapshot of internal state, including:
- config flags (debug, queue size, autoTrack, DNT, etc.)
- consent status and metadata
- provider key, state, and state history (where supported)
- queue sizes (SSR + runtime)
- last planned and last sent URLs
Used for debugging, visualisation, and tools. See the Debugging guide for field-level details.
Types
A non-exhaustive list of important exported types:
InitOptions
Configuration object passed to createAnalytics / init.
Includes:
- provider selection (
provider,site,host,measurementId, etc.) - queue settings (
queueSize,batchSize,batchTimeout, etc.) - consent options (
initialStatus,requireExplicit,allowEssentialOnDenied, etc.) - resilience and transports (
detectBlockers,fallbackStrategy,proxyconfig) - behaviour flags (
autoTrack,includeHash,trackLocalhost,doNotTrack) - error handling (
onError)
See the Configuration guide for a field-by-field breakdown.
ProviderType
String union of supported provider keys, e.g.:
'umami''plausible''ga4''noop'
EventMap / AnyEventMap
See Typed Events above.
EventMap:Record<string, Record<string, unknown>>AnyEventMap: alias used as the default map.
AnalyticsInstance<E extends EventMap = EventMap>
The shape of an analytics instance returned by createAnalytics<E>(). Primarily used by TypeScript consumers for typed track().
ConsentStatus
String union of consent statuses: 'pending' | 'granted' | 'denied'.
ConsentStoredState
Persisted consent state structure, used by getConsent and onConsentChange.
DiagnosticsSnapshot
Return type of getDiagnostics(). Includes:
timestamp,instanceIdconfig(high-level flags)consent(status, version, method)provider(key, state, state history)queue(buffer sizes, capacity)urls(last planned/sent URLs)
Refer to facade/diagnostics.ts for the exact shape.
SSR module: trackkit/ssr
The SSR subpath is used when you need to:
- record events during server-side rendering, and
- hydrate those events into the client’s runtime queue.
It never initialises providers on the server.
Server-side event functions
These mirror the main event methods but target the SSR queue instead.
track(eventName: string, props?: Record<string, unknown>): void
Record a custom event into the SSR queue.
Call this in getServerSideProps, getInitialProps, or your framework’s SSR hooks:
import { ssrTrack } from 'trackkit/ssr';
export async function getServerSideProps(ctx) {
ssrTrack('landing_viewed', { path: ctx.resolvedUrl });
return { props: {} };
}pageview(path?: string | { path?: string; title?: string; referrer?: string }): void
Record a SSR pageview event.
import { pageview as ssrPageview } from 'trackkit/ssr';
export async function getServerSideProps(ctx) {
ssrPageview(ctx.resolvedUrl || '/');
return { props: {} };
}identify(userId: string, traits?: Record<string, unknown>): void
Record a SSR identify event, if you wish to associate the pageview with a user ID at render time.
SSR queue utilities
These are advanced and typically only used in framework integrations or custom SSR setups.
serializeSSRQueue(): string
Serialize the current SSR queue as a JSON string suitable for embedding into HTML.
Typical usage in a custom _document or equivalent:
import { serializeSSRQueue } from 'trackkit/ssr';
const queueJson = serializeSSRQueue();
<script
dangerouslySetInnerHTML={{
__html: `window.__TRACKKIT_SSR_QUEUE__ = ${queueJson};`,
}}
/>The client-side facade will hydrate from window.__TRACKKIT_SSR_QUEUE__ once, then treat the queue as drained.
getSSRQueue(): QueuedEvent[]
Return the current contents of the SSR queue as an array. Mostly useful in tests.
getSSRQueueLength(): number
Return the number of events currently buffered in the SSR queue.
Used by diagnostics and advanced monitoring.
enqueueSSREvent(event: QueuedEvent): void
Low-level API: push a raw queued event into the SSR queue.
Most users should prefer the higher-level track, pageview, and identify SSR helpers. enqueueSSREvent exists for custom integrations, migrations, or when bridging from a legacy analytics system.
Error handling
Although not a separate module, it’s worth highlighting how errors are surfaced.
onError option (InitOptions)
You can provide a global error handler:
createAnalytics({
provider: 'umami',
site: 'my-site',
onError: (error) => {
console.error('[trackkit]', error.code, error.message);
// send to Sentry/Datadog if desired
},
});Errors are instances of AnalyticsError with:
code: anErrorCode(e.g.'INIT_FAILED','POLICY_BLOCKED','QUEUE_OVERFLOW')message: human-readable descriptionprovider?: provider key if relevanttimestamp: when it occurredstack?: stack trace where available
Refer to docs/reference/error-codes.md for the full list.
This page is intentionally focused on the public surface. For deeper implementation details, see: