docs: session replay

apps/public/src/app/(home)/_sections/analytics-insights.tsx

@@ -3,6 +3,7 @@ import {
   ChevronRightIcon,
   DollarSignIcon,
   GlobeIcon,
+  PlayCircleIcon,
 } from 'lucide-react';
 import Link from 'next/link';
 import { FeatureCard } from '@/components/feature-card';
@@ -41,6 +42,16 @@ const features = [
       children: 'All about tracking',
     },
   },
+  {
+    title: 'Session Replay',
+    description:
+      'Watch real user sessions to see exactly what happened. Privacy controls built in, loads async.',
+    icon: PlayCircleIcon,
+    link: {
+      href: '/features/session-replay',
+      children: 'See session replay',
+    },
+  },
 ];
 
 export function AnalyticsInsights() {
@@ -68,7 +79,7 @@ export function AnalyticsInsights() {
           variant="large"
         />
       </div>
-      <div className="grid grid-cols-1 gap-6 md:grid-cols-3">
+      <div className="grid grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-4">
         {features.map((feature) => (
           <FeatureCard
             description={feature.description}

apps/public/src/components/web-sdk-config.mdx

@@ -3,4 +3,15 @@
 - `trackScreenViews` - If true, the library will automatically track screen views (default: false)
 - `trackOutgoingLinks` - If true, the library will automatically track outgoing links (default: false)
 - `trackAttributes` - If true, you can trigger events by using html attributes (`<button type="button" data-track="your_event" />`) (default: false)
+- `sessionReplay` - Session replay configuration object (default: disabled). See [session replay docs](/docs/session-replay) for full options.
+  - `enabled` - Enable session replay recording (default: false)
+  - `maskAllInputs` - Mask all input field values (default: true)
+  - `maskTextSelector` - CSS selector for text elements to mask (default: `[data-openpanel-replay-mask]`)
+  - `blockSelector` - CSS selector for elements to replace with a placeholder (default: `[data-openpanel-replay-block]`)
+  - `blockClass` - Class name that blocks elements from being recorded
+  - `ignoreSelector` - CSS selector for elements excluded from interaction tracking
+  - `flushIntervalMs` - How often (ms) recorded events are sent to the server (default: 10000)
+  - `maxEventsPerChunk` - Maximum events per payload chunk (default: 200)
+  - `maxPayloadBytes` - Maximum payload size in bytes (default: 1048576)
+  - `scriptUrl` - Custom URL for the replay script (script-tag builds only)