Analytics

Segment

Segment lets you collect analytics events in one place and forward them to downstream destinations. The segment() helper creates Segment's standard window.analytics queue, optionally queues the initial page() call, and loads Analytics.js when measurement consent is available.

Integrate with c15t

import { type ReactNode } from 'react';
import { ConsentManagerProvider } from '@c15t/react';
import { segment } from '@c15t/scripts/segment';

const scripts = [segment({ writeKey: 'abc123xyz456' })];

export function ConsentProvider({ children }: { children: ReactNode }) {
  return (
    <ConsentManagerProvider
      options={{
        mode: 'hosted',
        backendURL: 'https://your-instance.c15t.dev',
        scripts,
      }}
    >
      {children}
    </ConsentManagerProvider>
  );
}

How c15t loads it

  • Category: measurement (Analytics)
  • Loads when: measurement consent is granted
  • On revocation: unloaded - c15t removes the script from the DOM and clears Segment globals until consent is granted again.

c15t deliberately blocks the load rather than mapping consent into Segment's consent tooling: Segment's consent object and consent wrappers control which downstream destinations receive events, but Analytics.js itself still writes identifiers and delivers events to Segment once loaded. Gating the load is the only default that reliably honors missing or denied measurement consent. See the RudderStack consent notes for the full reasoning behind this model versus vendor consent-API mapping (as used for Google Tag Manager).

Configure the integration

By default the helper queues analytics.page() before the vendor bundle loads. If you want to handle page views yourself, set trackPageView to false.

import { segment } from '@c15t/scripts/segment';

segment({
  writeKey: 'abc123xyz456',
  trackPageView: false,
});

Tracking events in your app

c15t gates the Segment script from loading until measurement consent is granted. Your application code that calls Segment's runtime API (window.analytics.track, identify, etc.) is not automatically gated - window.analytics does not exist until the script is loaded, so unguarded calls before consent throw.

Guard event calls by checking consent state. From React:

import { useCallback } from 'react';
import { useConsentManager } from '@c15t/react';

function SignupExample() {
  const { has } = useConsentManager();

  const trackSignup = useCallback(() => {
    if (has('measurement')) {
      window.analytics?.track('Signup Completed', { plan: 'pro' });
    }
  }, [has]);
}

From plain JavaScript:

import { getOrCreateConsentRuntime } from 'c15t';

const { consentStore } = getOrCreateConsentRuntime();

if (consentStore.getState().has('measurement')) {
  window.analytics?.track('Signup Completed', { plan: 'pro' });
}

Types

SegmentOptions

Warning: ExtractedTypeTable: Could not extract "SegmentOptions" from "./packages/scripts/src/vendors/analytics/segment.ts" using base path "/vercel/path0/apps/c15t-docs/.leadtype/c15t". Verify the path/name and that the file is included by your tsconfig.

Loading…

Script

Warning: ExtractedTypeTable: Could not extract "Script" from "./packages/core/src/libs/script-loader/types.ts" using base path "/vercel/path0/apps/c15t-docs/.leadtype/c15t". Verify the path/name and that the file is included by your tsconfig.

Loading…