@entro314labs/entro-svelte

SvelteKit integration for Entrolytics - First-party growth analytics for the edge.

Installation

npm install @entro314labs/entro-svelte
# or
pnpm add @entro314labs/entro-svelte

Quick Start

<!-- +layout.svelte -->
<script>
  import { initEntrolytics } from '@entro314labs/entro-svelte';

  // Zero-config: automatically reads from .env
  initEntrolytics();
</script>

<slot />

Add to your .env file:

VITE_ENTROLYTICS_WEBSITE_ID=your-website-id
VITE_ENTROLYTICS_HOST=https://entrolytics.click

# Or for SvelteKit static
PUBLIC_ENTROLYTICS_WEBSITE_ID=your-website-id
PUBLIC_ENTROLYTICS_HOST=https://entrolytics.click

Configuration Options

Zero-Config (Recommended)

<script>
  initEntrolytics(); // Reads from env
</script>

Explicit Configuration

initEntrolytics({
  // Required: Your Entrolytics website ID
  websiteId: 'your-website-id',

  // Optional: Custom host (for self-hosted)
  host: 'https://entrolytics.click',

  // Optional: Auto-track page views (default: true)
  autoTrack: true,

  // Optional: Respect Do Not Track (default: false)
  respectDnt: false,

  // Optional: Cross-domain tracking
  domains: ['example.com', 'blog.example.com'],
});

Tracking Events

trackEvent

<script>
  import { trackEvent } from '@entro314labs/entro-svelte';

  function handlePurchase() {
    trackEvent('purchase', {
      revenue: 99.99,
      currency: 'USD'
    });
  }
</script>

<button on:click={handlePurchase}>Buy Now</button>

trackClick Action

Use the Svelte action for declarative click tracking:

<script>
  import { trackClick } from '@entro314labs/entro-svelte';
</script>

<button use:trackClick={{ event: 'cta_click', data: { variant: 'hero' } }}>
  Get Started
</button>

Page View Tracking

Automatic (with SvelteKit)

<!-- +layout.svelte -->
<script>
  import { page } from '$app/stores';
  import { initEntrolytics, usePageView } from '@entro314labs/entro-svelte';

  initEntrolytics({ websiteId: 'your-website-id' });
  usePageView(page);
</script>

<slot />

Manual

<script>
  import { trackPageView } from '@entro314labs/entro-svelte';

  // Track current page
  trackPageView();

  // Track specific URL
  trackPageView('/custom-path', 'https://referrer.com');
</script>

User Identification

<script>
  import { identify } from '@entro314labs/entro-svelte';

  // When user logs in
  function handleLogin(user) {
    identify(user.id, {
      email: user.email,
      plan: user.subscription
    });
  }
</script>

Stores

isLoaded

Check if the tracking script is loaded:

<script>
  import { isLoaded } from '@entro314labs/entro-svelte';
</script>

{#if $isLoaded}
  <p>Analytics loaded!</p>
{/if}

TypeScript

Full TypeScript support with exported types:

import type { EntrolyticsOptions } from '@entro314labs/entro-svelte';

License

MIT License - see LICENSE file for details.