@walkeros/explorer 3.1.0 → 3.1.1

package/dist/components/demos/DestinationDemo.stories.js

@@ -1,53 +0,0 @@
-import { DestinationDemo } from './DestinationDemo';
-import { captureDestinationPush } from '../../helpers/capture';
-import { getEvent } from '@walkeros/core';
-import destinationGtag from '@walkeros/web-destination-gtag';
-import * as examples from '@walkeros/web-destination-gtag/examples';
-/**
- * DestinationDemo - Interactive destination testing component
- *
- * Tests destination implementations with real walkerOS events.
- * Automatically captures destination.push() calls and displays output.
- * Perfect for testing and debugging destination configurations.
- */
-const meta = {
-    component: DestinationDemo,
-    title: 'Demos/DestinationDemo',
-    tags: ['autodocs'],
-    parameters: {
-        layout: 'fullscreen',
-    },
-};
-export default meta;
-// Create documentation gtag destination with examples
-// Cast to generic Destination.Instance to avoid type conflicts with specific gtag types
-const documentationGtag = {
-    ...destinationGtag,
-    examples,
-};
-/**
- * Default destination demo with gtag GA4 purchase event
- */
-export const Default = {
-    args: {
-        destination: documentationGtag,
-        event: getEvent('order complete', {
-            data: {
-                id: 'T12345',
-                total: 99.99,
-                taxes: 9.0,
-                shipping: 5.99,
-                currency: 'EUR',
-            },
-        }),
-        mapping: examples.step.purchase.mapping,
-        settings: {
-            ga4: {
-                measurementId: 'G-XXXXXXXXXX',
-            },
-        },
-        generic: true,
-        fn: captureDestinationPush(documentationGtag, examples?.env?.push),
-    },
-};
-//# sourceMappingURL=DestinationDemo.stories.js.map

package/dist/components/demos/DestinationDemo.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DestinationDemo.stories.js","sourceRoot":"","sources":["../../../src/components/demos/DestinationDemo.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAkC,MAAM,gBAAgB,CAAC;AAC1E,OAAO,eAAe,MAAM,gCAAgC,CAAC;AAC7D,OAAO,KAAK,QAAQ,MAAM,yCAAyC,CAAC;AAEpE;;;;;;GAMG;AACH,MAAM,IAAI,GAAiC;IACzC,SAAS,EAAE,eAAe;IAC1B,KAAK,EAAE,uBAAuB;IAC9B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;KACrB;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAGpB,sDAAsD;AACtD,wFAAwF;AACxF,MAAM,iBAAiB,GAAG;IACxB,GAAG,eAAe;IAClB,QAAQ;CAC0D,CAAC;AAErE;;GAEG;AACH,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE;QACJ,WAAW,EAAE,iBAAiB;QAC9B,KAAK,EAAE,QAAQ,CAAC,gBAAgB,EAAE;YAChC,IAAI,EAAE;gBACJ,EAAE,EAAE,QAAQ;gBACZ,KAAK,EAAE,KAAK;gBACZ,KAAK,EAAE,GAAG;gBACV,QAAQ,EAAE,IAAI;gBACd,QAAQ,EAAE,KAAK;aAChB;SACF,CAAC;QACF,OAAO,EAAE,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAuB;QACvD,QAAQ,EAAE;YACR,GAAG,EAAE;gBACH,aAAa,EAAE,cAAc;aAC9B;SACF;QACD,OAAO,EAAE,IAAI;QACb,EAAE,EAAE,sBAAsB,CAAC,iBAAiB,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC;KACnE;CACF,CAAC"}

package/dist/components/demos/DestinationInitDemo.d.ts

@@ -1,34 +0,0 @@
-import type { Destination } from '@walkeros/core';
-export interface DestinationInitDemoProps {
-    destination: Destination.Instance;
-    settings?: unknown;
-    labelSettings?: string;
-    labelOutput?: string;
-}
-/**
- * DestinationInitDemo - Interactive destination initialization testing component
- *
- * Automatically captures destination.init() calls and displays the output.
- * The component auto-detects the destination's env from destination.examples.env.init.
- *
- * Props:
- * - destination: Destination instance with examples.env.init export
- * - settings: Initial destination-specific settings
- * - labelSettings: Label for settings panel (default: 'Settings')
- * - labelOutput: Label for output panel (default: 'Result')
- *
- * Example:
- * ```tsx
- * import destinationGtag from '@walkeros/web-destination-gtag';
- * import { examples } from '@walkeros/web-destination-gtag';
- *
- * const destination = { ...destinationGtag, examples };
- *
- * <DestinationInitDemo
- *   destination={destination}
- *   settings={{ ga4: { measurementId: 'G-XXXXXXXXXX' } }}
- * />
- * ```
- */
-export declare function DestinationInitDemo({ destination, settings: initialSettings, labelSettings, labelOutput, }: DestinationInitDemoProps): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=DestinationInitDemo.d.ts.map

package/dist/components/demos/DestinationInitDemo.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DestinationInitDemo.d.ts","sourceRoot":"","sources":["../../../src/components/demos/DestinationInitDemo.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAOlD,MAAM,WAAW,wBAAwB;IACvC,WAAW,EAAE,WAAW,CAAC,QAAQ,CAAC;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,WAAW,EACX,QAAQ,EAAE,eAAoB,EAC9B,aAA0B,EAC1B,WAAsB,GACvB,EAAE,wBAAwB,2CAyE1B"}

package/dist/components/demos/DestinationInitDemo.js

@@ -1,73 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useCallback, useEffect } from 'react';
-import { tryCatchAsync } from '@walkeros/core';
-import { startFlow } from '@walkeros/collector';
-import { CodeBox } from '../molecules/code-box';
-import { Grid } from '../atoms/grid';
-import { captureDestinationInit } from '../../helpers/capture';
-/**
- * DestinationInitDemo - Interactive destination initialization testing component
- *
- * Automatically captures destination.init() calls and displays the output.
- * The component auto-detects the destination's env from destination.examples.env.init.
- *
- * Props:
- * - destination: Destination instance with examples.env.init export
- * - settings: Initial destination-specific settings
- * - labelSettings: Label for settings panel (default: 'Settings')
- * - labelOutput: Label for output panel (default: 'Result')
- *
- * Example:
- * ```tsx
- * import destinationGtag from '@walkeros/web-destination-gtag';
- * import { examples } from '@walkeros/web-destination-gtag';
- *
- * const destination = { ...destinationGtag, examples };
- *
- * <DestinationInitDemo
- *   destination={destination}
- *   settings={{ ga4: { measurementId: 'G-XXXXXXXXXX' } }}
- * />
- * ```
- */
-export function DestinationInitDemo({ destination, settings: initialSettings = {}, labelSettings = 'Settings', labelOutput = 'Result', }) {
-    const [settingsInput, setSettingsInput] = useState(typeof initialSettings === 'string'
-        ? initialSettings
-        : JSON.stringify(initialSettings, null, 2));
-    const [output, setOutput] = useState('');
-    const executeInit = useCallback(async () => {
-        await tryCatchAsync(async () => {
-            const settingsData = JSON.parse(settingsInput);
-            // Build config
-            const config = {
-                settings: settingsData,
-            };
-            // Create minimal collector
-            const { collector } = await startFlow({});
-            // Build context for destination.init()
-            const context = {
-                id: 'demo',
-                collector,
-                config,
-                env: destination.env || {},
-                logger: collector.logger,
-            };
-            if (!destination.init) {
-                setOutput('No init method defined for this destination');
-                return;
-            }
-            // Auto-detect destination.examples.env.init (for init method)
-            const destinationEnv = destination.examples?.env?.init;
-            // Use captureDestinationInit to automatically capture output
-            const captureFn = captureDestinationInit(destination, destinationEnv);
-            const result = await captureFn(context);
-            setOutput(result);
-        }, (error) => setOutput(`Error: ${error}`))();
-    }, [settingsInput, destination]);
-    useEffect(() => {
-        const timeoutId = setTimeout(executeInit, 500);
-        return () => clearTimeout(timeoutId);
-    }, [executeInit]);
-    return (_jsxs(Grid, { columns: 2, rowHeight: "synced", children: [_jsx(CodeBox, { label: labelSettings, code: settingsInput, onChange: setSettingsInput, language: "json", showFormat: true, autoHeight: true }), _jsx(CodeBox, { label: labelOutput, code: output, disabled: true, language: "javascript", autoHeight: true })] }));
-}
-//# sourceMappingURL=DestinationInitDemo.js.map

package/dist/components/demos/DestinationInitDemo.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DestinationInitDemo.js","sourceRoot":"","sources":["../../../src/components/demos/DestinationInitDemo.tsx"],"names":[],"mappings":"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"}

package/dist/components/demos/DestinationInitDemo.stories.d.ts

@@ -1,17 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-import { DestinationInitDemo } from './DestinationInitDemo';
-/**
- * DestinationInitDemo - Interactive destination initialization testing
- *
- * Tests destination.init() methods with configuration settings.
- * Automatically captures initialization calls and displays output.
- * Perfect for testing destination setup and configuration.
- */
-declare const meta: Meta<typeof DestinationInitDemo>;
-export default meta;
-type Story = StoryObj<typeof DestinationInitDemo>;
-/**
- * Default destination initialization demo with gtag GA4 settings
- */
-export declare const Default: Story;
-//# sourceMappingURL=DestinationInitDemo.stories.d.ts.map

package/dist/components/demos/DestinationInitDemo.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DestinationInitDemo.stories.d.ts","sourceRoot":"","sources":["../../../src/components/demos/DestinationInitDemo.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAK5D;;;;;;GAMG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,mBAAmB,CAO1C,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,mBAAmB,CAAC,CAAC;AASlD;;GAEG;AACH,eAAO,MAAM,OAAO,EAAE,KASrB,CAAC"}

package/dist/components/demos/DestinationInitDemo.stories.js

@@ -1,39 +0,0 @@
-import { DestinationInitDemo } from './DestinationInitDemo';
-import destinationGtag from '@walkeros/web-destination-gtag';
-import * as examples from '@walkeros/web-destination-gtag/examples';
-/**
- * DestinationInitDemo - Interactive destination initialization testing
- *
- * Tests destination.init() methods with configuration settings.
- * Automatically captures initialization calls and displays output.
- * Perfect for testing destination setup and configuration.
- */
-const meta = {
-    component: DestinationInitDemo,
-    title: 'Demos/DestinationInitDemo',
-    tags: ['autodocs'],
-    parameters: {
-        layout: 'fullscreen',
-    },
-};
-export default meta;
-// Create documentation gtag destination with examples
-// Cast to generic Destination.Instance to avoid type conflicts with specific gtag types
-const documentationGtag = {
-    ...destinationGtag,
-    examples,
-};
-/**
- * Default destination initialization demo with gtag GA4 settings
- */
-export const Default = {
-    args: {
-        destination: documentationGtag,
-        settings: {
-            ga4: {
-                measurementId: 'G-XXXXXXXXXX',
-            },
-        },
-    },
-};
-//# sourceMappingURL=DestinationInitDemo.stories.js.map

package/dist/components/demos/DestinationInitDemo.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DestinationInitDemo.stories.js","sourceRoot":"","sources":["../../../src/components/demos/DestinationInitDemo.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,eAAe,MAAM,gCAAgC,CAAC;AAC7D,OAAO,KAAK,QAAQ,MAAM,yCAAyC,CAAC;AAEpE;;;;;;GAMG;AACH,MAAM,IAAI,GAAqC;IAC7C,SAAS,EAAE,mBAAmB;IAC9B,KAAK,EAAE,2BAA2B;IAClC,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;KACrB;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAGpB,sDAAsD;AACtD,wFAAwF;AACxF,MAAM,iBAAiB,GAAG;IACxB,GAAG,eAAe;IAClB,QAAQ;CAC0D,CAAC;AAErE;;GAEG;AACH,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE;QACJ,WAAW,EAAE,iBAAiB;QAC9B,QAAQ,EAAE;YACR,GAAG,EAAE;gBACH,aAAa,EAAE,cAAc;aAC9B;SACF;KACF;CACF,CAAC"}

package/dist/components/demos/PromotionPlayground.d.ts

@@ -1,30 +0,0 @@
-import { type DestinationCode } from '../../helpers/destinations';
-export interface PromotionPlaygroundProps {
-    initialHtml?: string;
-    initialCss?: string;
-    initialJs?: string;
-    initialMapping?: string;
-    labelCode?: string;
-    labelPreview?: string;
-    labelEvents?: string;
-    labelMapping?: string;
-    labelResult?: string;
-    destination?: DestinationCode;
-}
-/**
- * PromotionPlayground - Full walkerOS demonstration with live code editing
- *
- * Shows the complete chain:
- * 1. Code Editor - Edit HTML/CSS/JS with walkerOS data attributes
- * 2. Preview - Live rendered output that captures real events
- * 3. Events - Real events captured from preview interactions
- * 4. Mapping - Apply transformations and see destination output
- * 5. Result - Final destination function calls
- *
- * Uses a single unified collector flow:
- * - PromotionPlayground owns the collector with destinations
- * - Preview initializes browser source using parent's elb
- * - Events flow through one collector to all destinations
- */
-export declare function PromotionPlayground({ initialHtml, initialCss, initialJs, initialMapping, labelCode, labelPreview, labelEvents, labelMapping, labelResult, destination: destinationProp, }: PromotionPlaygroundProps): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=PromotionPlayground.d.ts.map

package/dist/components/demos/PromotionPlayground.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"PromotionPlayground.d.ts","sourceRoot":"","sources":["../../../src/components/demos/PromotionPlayground.tsx"],"names":[],"mappings":"AAaA,OAAO,EAEL,KAAK,eAAe,EACrB,MAAM,4BAA4B,CAAC;AAEpC,MAAM,WAAW,wBAAwB;IACvC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,eAAe,CAAC;CAC/B;AA2PD;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,WAAyB,EACzB,UAAuB,EACvB,SAAc,EACd,cAA+B,EAC/B,SAAkB,EAClB,YAAwB,EACxB,WAAsB,EACtB,YAAwB,EACxB,WAAsB,EACtB,WAAW,EAAE,eAAe,GAC7B,EAAE,wBAAwB,2CAiK1B"}

package/dist/components/demos/PromotionPlayground.js

@@ -1,366 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useEffect, useRef, useCallback, useMemo, } from 'react';
-import { startFlow } from '@walkeros/collector';
-import { Grid } from '../atoms/grid';
-import { Preview } from '../molecules/preview';
-import { BrowserBox } from '../organisms/browser-box';
-import { CodeBox } from '../molecules/code-box';
-import { createGtagDestination, } from '../../helpers/destinations';
-const defaultHtml = `<div
-  data-elb="product"
-  data-elbaction="load:view"
-  data-elbcontext="stage:inspire"
-  class="product-card"
->
-  <figure class="product-figure">
-    <div class="product-badge-container">
-      <div data-elb-product="badge:delicious" class="product-badge">delicious</div>
-    </div>
-  </figure>
-  <div class="product-body">
-    <h3 data-elb-product="name:#innerText" class="product-title">
-      Everyday Ruck Snack
-    </h3>
-    <div class="form-control">
-      <label class="form-label">Taste</label>
-      <select
-        data-elb-product="taste:#value"
-        class="form-select"
-      >
-        <option value="sweet">Sweet</option>
-        <option value="spicy">Spicy</option>
-      </select>
-    </div>
-    <p data-elb-product="price:2.50" class="product-price">
-      € 2.50 <span data-elb-product="old_price:3.14" class="product-old-price">€ 3.14</span>
-    </p>
-    <div data-elbcontext="stage:hooked" class="product-actions">
-      <button
-        data-elbaction="click:save"
-        class="btn btn-secondary"
-      >
-        Maybe later
-      </button>
-      <button
-        data-elbaction="click:add"
-        class="btn btn-primary"
-      >
-        Add to Cart
-      </button>
-    </div>
-  </div>
-</div>`;
-const defaultCss = `* {
-  box-sizing: border-box;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-}
-
-.product-card {
-  width: 100%;
-  max-width: 400px;
-  margin: 0 auto;
-  background: #ffffff;
-  border-radius: 16px;
-  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
-  overflow: hidden;
-}
-
-.product-figure {
-  position: relative;
-  margin: 0;
-  padding: 0;
-  width: 100%;
-  height: 160px;
-  background:
-    linear-gradient(135deg, rgba(243, 244, 246, 0.9) 0%, rgba(229, 231, 235, 0.9) 100%),
-    repeating-linear-gradient(
-      45deg,
-      #f9fafb,
-      #f9fafb 10px,
-      #f3f4f6 10px,
-      #f3f4f6 20px
-    );
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.product-figure::before {
-  content: '🍟';
-  font-size: 8rem;
-  opacity: 0.8;
-}
-
-.product-badge-container {
-  position: absolute;
-  top: 0.5rem;
-  right: 0.5rem;
-}
-
-.product-badge {
-  background: #01b5e2;
-  color: white;
-  padding: 0.25rem 0.75rem;
-  border-radius: 9999px;
-  font-size: 0.75rem;
-  font-weight: 600;
-  text-transform: uppercase;
-  letter-spacing: 0.025em;
-}
-
-.product-body {
-  padding: 1.5rem;
-}
-
-.product-title {
-  font-size: 1.125rem;
-  font-weight: 700;
-  margin: 0 0 1rem 0;
-  color: #111827;
-}
-
-.form-control {
-  margin-bottom: 1rem;
-}
-
-.form-label {
-  display: block;
-  font-size: 0.875rem;
-  font-weight: 500;
-  color: #6b7280;
-  margin-bottom: 0.5rem;
-}
-
-.form-select {
-  width: 100%;
-  padding: 0.5rem 0.75rem;
-  border: 1px solid #d1d5db;
-  border-radius: 8px;
-  font-size: 0.875rem;
-  color: #111827;
-  background: white;
-  cursor: pointer;
-  transition: border-color 0.2s;
-}
-
-.form-select:hover {
-  border-color: #9ca3af;
-}
-
-.form-select:focus {
-  outline: none;
-  border-color: #01b5e2;
-  box-shadow: 0 0 0 3px rgba(1, 181, 226, 0.1);
-}
-
-.product-price {
-  font-size: 1.25rem;
-  font-weight: 700;
-  color: #111827;
-  margin: 0 0 1rem 0;
-}
-
-.product-old-price {
-  font-size: 1rem;
-  font-weight: 400;
-  color: #9ca3af;
-  text-decoration: line-through;
-  margin-left: 0.5rem;
-}
-
-.product-actions {
-  display: flex;
-  justify-content: space-between;
-  gap: 0.5rem;
-}
-
-.btn {
-  flex: 1;
-  padding: 0.75rem 1rem;
-  border: none;
-  border-radius: 8px;
-  font-size: 0.875rem;
-  font-weight: 600;
-  cursor: pointer;
-  transition: all 0.2s;
-  text-align: center;
-}
-
-.btn:hover {
-  transform: translateY(-1px);
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
-}
-
-.btn:active {
-  transform: translateY(0);
-}
-
-.btn-primary {
-  background: #01b5e2;
-  color: white;
-}
-
-.btn-primary:hover {
-  background: #0195b8;
-}
-
-.btn-secondary {
-  background: #ffffff;
-  color: #01b5e2;
-  border: 1px solid #01b5e2;
-}
-
-.btn-secondary:hover {
-  background: #01b5e2;
-  color: #ffffff;
-}`;
-const defaultMapping = `{
-  "product": {
-    "view": {
-      "name": "view_item",
-      "data": {
-        "map": {
-          "event": "name",
-          "price": "data.price",
-          "stage": "context.stage.0"
-        }
-      }
-    },
-    "add": {
-      "name": "add_to_cart",
-      "data": {
-        "map": {
-          "event": "event",
-          "price": "data.price",
-          "user": {
-            "consent": { "marketing": true },
-            "key": "user.session"
-          },
-          "isSale": {
-            "fn": "(e) => !!e.data.old_price"
-          }
-        }
-      }
-    },
-    "save": {
-      "data": {
-        "map": {
-          "event": "event",
-          "data": "data"
-        }
-      }
-    }
-  }
-}`;
-/**
- * PromotionPlayground - Full walkerOS demonstration with live code editing
- *
- * Shows the complete chain:
- * 1. Code Editor - Edit HTML/CSS/JS with walkerOS data attributes
- * 2. Preview - Live rendered output that captures real events
- * 3. Events - Real events captured from preview interactions
- * 4. Mapping - Apply transformations and see destination output
- * 5. Result - Final destination function calls
- *
- * Uses a single unified collector flow:
- * - PromotionPlayground owns the collector with destinations
- * - Preview initializes browser source using parent's elb
- * - Events flow through one collector to all destinations
- */
-export function PromotionPlayground({ initialHtml = defaultHtml, initialCss = defaultCss, initialJs = '', initialMapping = defaultMapping, labelCode = 'Code', labelPreview = 'Preview', labelEvents = 'Events', labelMapping = 'Mapping', labelResult = 'Result', destination: destinationProp, }) {
-    // Memoize destination to prevent useEffect re-runs on every render
-    // Default prop values create new objects each render, breaking effect dependencies
-    const destination = useMemo(() => destinationProp ?? createGtagDestination(), [destinationProp]);
-    const [html, setHtml] = useState(initialHtml);
-    const [css, setCss] = useState(initialCss);
-    const [js, setJs] = useState(initialJs);
-    const [mappingInput, setMappingInput] = useState(initialMapping);
-    const [eventJson, setEventJson] = useState('// Click elements in the preview to see events');
-    const [outputString, setOutputString] = useState('// Click elements in the preview to see function call');
-    const collectorRef = useRef(null);
-    const elbRef = useRef(null);
-    const lastEventRef = useRef(null);
-    const [isReady, setIsReady] = useState(false);
-    // Initialize collector once on mount
-    useEffect(() => {
-        let mounted = true;
-        const init = async () => {
-            try {
-                const parsedMapping = JSON.parse(initialMapping);
-                const { collector, elb } = await startFlow({
-                    destinations: {
-                        // Capture raw events for display in Events column
-                        rawCapture: {
-                            code: {
-                                type: 'rawCapture',
-                                config: {},
-                                push: async (event) => {
-                                    if (!mounted)
-                                        return;
-                                    lastEventRef.current = event;
-                                    setEventJson(JSON.stringify(event, null, 2));
-                                },
-                            },
-                        },
-                        // Transform and display formatted output in Result column
-                        gtag: {
-                            code: destination,
-                            config: {
-                                mapping: parsedMapping,
-                            },
-                            env: {
-                                elb: (output) => {
-                                    if (!mounted)
-                                        return;
-                                    setOutputString(output);
-                                },
-                            },
-                        },
-                    },
-                    consent: { functional: true, marketing: true },
-                    user: { session: 'playground' },
-                });
-                if (!mounted)
-                    return;
-                collectorRef.current = collector;
-                elbRef.current = elb;
-                setIsReady(true);
-            }
-            catch {
-                // Initialization failed - component will show placeholder
-            }
-        };
-        init();
-        return () => {
-            mounted = false;
-            // Cleanup collector
-            if (collectorRef.current) {
-                // Sources cleanup would happen here if needed
-            }
-        };
-    }, [initialMapping, destination]);
-    // Handle mapping changes - update collector destination config
-    const handleMappingChange = useCallback((newMapping) => {
-        setMappingInput(newMapping);
-        // Debounced update to collector
-        const timeoutId = setTimeout(() => {
-            try {
-                const parsed = JSON.parse(newMapping);
-                // Update destination config directly
-                if (collectorRef.current?.destinations?.gtag?.config) {
-                    collectorRef.current.destinations.gtag.config.mapping = parsed;
-                }
-                // Re-process last event to update Result column
-                if (lastEventRef.current && collectorRef.current) {
-                    collectorRef.current.push(lastEventRef.current);
-                }
-            }
-            catch {
-                // Invalid JSON - don't update
-            }
-        }, 500);
-        return () => clearTimeout(timeoutId);
-    }, []);
-    return (_jsxs(Grid, { columns: 5, rowHeight: 600, children: [_jsx(BrowserBox, { label: labelCode, html: html, css: css, js: js, onHtmlChange: setHtml, onCssChange: setCss, onJsChange: setJs, showPreview: false, initialTab: "html", lineNumbers: false, wordWrap: true }), _jsx(Preview, { label: labelPreview, html: html, css: css, elb: isReady ? (elbRef.current ?? undefined) : undefined }), _jsx(CodeBox, { label: labelEvents, code: eventJson, onChange: setEventJson, language: "json", wordWrap: true }), _jsx(CodeBox, { label: labelMapping, code: mappingInput, onChange: handleMappingChange, language: "json", wordWrap: true }), _jsx(CodeBox, { label: labelResult, code: outputString, language: "javascript", disabled: true, wordWrap: true })] }));
-}
-//# sourceMappingURL=PromotionPlayground.js.map

package/dist/components/demos/PromotionPlayground.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PromotionPlayground.js","sourceRoot":"","sources":["../../../src/components/demos/PromotionPlayground.tsx"],"names":[],"mappings":"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"}