npm package: @linkrivers/tracker
Description: LinkRivers analytics tracker for React, Next.js, Vue, and vanilla JS
Author: LinkRivers
Latest version: 1.0.0

# @linkrivers/tracker

Official LinkRivers analytics tracker for JavaScript applications.

## Installation

```bash
npm install @linkrivers/tracker
# or
yarn add @linkrivers/tracker
# or
pnpm add @linkrivers/tracker
```

## Usage

### Vanilla JavaScript

```js
import { init, track, identify } from '@linkrivers/tracker';

// Initialize
init({
  id: 'YOUR_SITE_ID',
  // Optional settings
  endpoint: 'https://api.linkrivers.com',
  analytics: true,      // Web vitals, clicks, scroll (default: true)
  security: true,       // Security scanning (default: true)
  technographics: true, // Tech stack detection (default: true)
  funnels: false,       // Goals & funnels (default: false)
  ecommerce: false,     // E-commerce tracking (default: false)
  respectDNT: true      // Respect Do Not Track (default: true)
});

// Track custom events
track('button_click', { button_id: 'signup' });

// Identify users
identify('user@example.com', { plan: 'pro' });
```

### React

```tsx
import { useLinkrivers, track } from '@linkrivers/tracker/react';

function App() {
  useLinkrivers({ id: 'YOUR_SITE_ID' });

  return (
    <button onClick={() => track('signup_click')}>
      Sign Up
    </button>
  );
}
```

### Next.js (App Router)

```tsx
// app/layout.tsx
import { LinkRiversScript } from '@linkrivers/tracker/react';

export default function RootLayout({ children }) {
  return (
    <html>
      <body>
        {children}
        <LinkRiversScript id="YOUR_SITE_ID" />
      </body>
    </html>
  );
}
```

### Next.js (Pages Router)

```tsx
// pages/_app.tsx
import { useLinkrivers } from '@linkrivers/tracker/react';

function MyApp({ Component, pageProps }) {
  useLinkrivers({ id: 'YOUR_SITE_ID' });
  return <Component {...pageProps} />;
}

export default MyApp;
```

### Vue 3

```vue
<script setup>
import { useLinkrivers, track } from '@linkrivers/tracker/vue';

useLinkrivers({ id: 'YOUR_SITE_ID' });

function handleClick() {
  track('button_click', { id: 'signup' });
}
</script>

<template>
  <button @click="handleClick">Sign Up</button>
</template>
```

### Vue Plugin (Global)

```ts
// main.ts
import { createApp } from 'vue';
import { LinkRiversPlugin } from '@linkrivers/tracker/vue';
import App from './App.vue';

const app = createApp(App);
app.use(LinkRiversPlugin, { id: 'YOUR_SITE_ID' });
app.mount('#app');
```

### Nuxt 3

```ts
// plugins/linkrivers.client.ts
import { init } from '@linkrivers/tracker';

export default defineNuxtPlugin(() => {
  init({ id: 'YOUR_SITE_ID' });
});
```

### SvelteKit

```svelte
<!-- src/routes/+layout.svelte -->
<script>
  import { onMount } from 'svelte';
  import { init, track } from '@linkrivers/tracker';

  onMount(() => {
    init({ id: 'YOUR_SITE_ID' });
  });
</script>

<slot />
```

### Astro

```astro
---
// src/layouts/Layout.astro
---
<html>
  <head>
    <script>
      import { init } from '@linkrivers/tracker';
      init({ id: 'YOUR_SITE_ID' });
    </script>
  </head>
  <body>
    <slot />
  </body>
</html>
```

## API Reference

### `init(config)`

Initialize the tracker.

| Option | Type | Default | Description |
|--------|------|---------|-------------|
| `id` | string | required | Your site tracking ID |
| `endpoint` | string | `https://api.linkrivers.com` | API endpoint |
| `analytics` | boolean | `true` | Enable Web Vitals, clicks, scroll tracking |
| `security` | boolean | `true` | Enable security scanning |
| `technographics` | boolean | `true` | Enable tech stack detection |
| `funnels` | boolean | `false` | Enable goals & funnels |
| `ecommerce` | boolean | `false` | Enable e-commerce tracking |
| `respectDNT` | boolean | `true` | Respect Do Not Track header |

### `track(eventName, properties?)`

Track a custom event.

```js
track('purchase', { product_id: '123', price: 99.99 });
```

### `identify(userId, traits?)`

Identify a user for cross-session tracking.

```js
identify('user@example.com', { name: 'John', plan: 'pro' });
```

### `load(module)`

Manually load an optional module.

```js
load('ecommerce'); // Load e-commerce tracking
```

## License

MIT