leadfnf-tracker
v1.0.1
Published
Privacy-first web analytics and session recording — pairs with leadfnf.com
Downloads
296
Maintainers
faai5200Readme
leadfnf-tracker
Privacy-first analytics and session recording. Pairs with LeadFnF.
Why use the NPM package instead of the script tag?
- rrweb bundled — no CDN round trip, loads synchronously
- Runs before hydration — calling
init()before React/Vue mounts captures styles before any framework reconciliation strips injected elements - Full bundler support — works with Vite, webpack, Rollup, esbuild, Turbopack
- TypeScript-friendly — ESM module with proper exports
Installation
npm install leadfnf-tracker rrweb
# or
yarn add leadfnf-tracker rrweb
# or
pnpm add leadfnf-tracker rrwebUsage
React / Next.js (App Router)
// app/layout.tsx
import { init } from 'leadfnf-tracker'
if (typeof window !== 'undefined') {
init({ siteId: 'YOUR_SITE_UUID', record: true })
}
export default function RootLayout({ children }: { children: React.ReactNode }) {
return <html><body>{children}</body></html>
}React / Next.js (Pages Router)
// pages/_app.tsx
import { init } from 'leadfnf-tracker'
if (typeof window !== 'undefined') {
init({ siteId: 'YOUR_SITE_UUID', record: true })
}
export default function App({ Component, pageProps }) {
return <Component {...pageProps} />
}Vue 3 / Nuxt 3
// plugins/leadfnf.client.ts
import { init } from 'leadfnf-tracker'
export default defineNuxtPlugin(() => {
init({ siteId: 'YOUR_SITE_UUID', record: true })
})SvelteKit
// src/hooks.client.ts
import { init } from 'leadfnf-tracker'
init({ siteId: 'YOUR_SITE_UUID', record: true })Vanilla JS / Vite
// main.js (before anything else)
import { init } from 'leadfnf-tracker'
init({ siteId: 'YOUR_SITE_UUID', record: true })Options
init({
siteId: string, // Required. Your Site UUID from the LeadFnF dashboard.
record: boolean, // Optional. Enable session recording. Default: false.
endpoint: string, // Optional. Override API base URL. Default: current origin.
})Custom Events
window.lf.track('signup', { plan: 'pro' })
window.lf.identify('user_123', { email: '[email protected]' })HTML Attribute Tracking
<button data-lf-track="upgrade-clicked">Upgrade</button>
<form data-lf-block><!-- sensitive form, hidden in replays --></form>
<input data-lf-mask type="text" placeholder="Masked in replays">Finding Your Site UUID
After creating a site in the LeadFnF dashboard, your Site UUID is shown on the Install Snippet page.
Privacy
- No cookies used
navigator.doNotTrackrespected- Sensitive inputs (password, email, tel, number) masked at capture time
- Pages at
/checkout,/payment,/account,/settingshave all inputs masked