@beworke/pixel 0.1.0-rc.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (123) hide show
  1. package/CHANGELOG.md +194 -0
  2. package/README.md +163 -0
  3. package/RELEASE_CANDIDATE.md +256 -0
  4. package/dist/PixelLogger-B21lEjep.d.mts +8 -0
  5. package/dist/PixelLogger-B21lEjep.d.ts +8 -0
  6. package/dist/StorageFactory-BhpbB6Jj.d.mts +8 -0
  7. package/dist/StorageFactory-CAkJJqVD.d.ts +8 -0
  8. package/dist/config/index.cjs.js +3 -0
  9. package/dist/config/index.cjs.js.map +1 -0
  10. package/dist/config/index.d.mts +19 -0
  11. package/dist/config/index.d.ts +19 -0
  12. package/dist/config/index.esm.js +3 -0
  13. package/dist/config/index.esm.js.map +1 -0
  14. package/dist/events/index.cjs.js +3 -0
  15. package/dist/events/index.cjs.js.map +1 -0
  16. package/dist/events/index.d.mts +1 -0
  17. package/dist/events/index.d.ts +1 -0
  18. package/dist/events/index.esm.js +3 -0
  19. package/dist/events/index.esm.js.map +1 -0
  20. package/dist/examples/html-script/README.md +71 -0
  21. package/dist/examples/html-script/RELEASE_CANDIDATE.md +121 -0
  22. package/dist/examples/html-script/add-payment-info/README.md +46 -0
  23. package/dist/examples/html-script/add-payment-info/example-add-payment-info-card-autocomplete.html +494 -0
  24. package/dist/examples/html-script/add-payment-info/example-add-payment-info-card-disabled.html +478 -0
  25. package/dist/examples/html-script/add-payment-info/example-add-payment-info-card-fields.html +486 -0
  26. package/dist/examples/html-script/add-payment-info/example-add-payment-info-data-track.html +479 -0
  27. package/dist/examples/html-script/add-payment-info/example-add-payment-info-dedupe.html +492 -0
  28. package/dist/examples/html-script/add-payment-info/example-add-payment-info-manual.html +495 -0
  29. package/dist/examples/html-script/add-payment-info/example-add-payment-info-rules-card.html +469 -0
  30. package/dist/examples/html-script/add-payment-info/example-add-payment-info-security.html +489 -0
  31. package/dist/examples/html-script/add-to-cart/README.md +36 -0
  32. package/dist/examples/html-script/add-to-cart/example-add-to-cart-attribute.html +517 -0
  33. package/dist/examples/html-script/add-to-cart/example-add-to-cart-auto.html +512 -0
  34. package/dist/examples/html-script/add-to-cart/example-add-to-cart-click.html +519 -0
  35. package/dist/examples/html-script/add-to-cart/example-add-to-cart-dedupe.html +514 -0
  36. package/dist/examples/html-script/add-to-cart/example-add-to-cart-manual.html +517 -0
  37. package/dist/examples/html-script/add-to-cart/example-add-to-cart-order-bump.html +527 -0
  38. package/dist/examples/html-script/add-to-cart/example-add-to-cart-text.html +524 -0
  39. package/dist/examples/html-script/example-basic.html +350 -0
  40. package/dist/examples/html-script/example-behavior.html +435 -0
  41. package/dist/examples/html-script/example-conversion.html +479 -0
  42. package/dist/examples/html-script/example-integration.html +709 -0
  43. package/dist/examples/html-script/example-transport.html +748 -0
  44. package/dist/examples/html-script/initiate-checkout/README.md +38 -0
  45. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-attribute.html +485 -0
  46. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-auto.html +491 -0
  47. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-click.html +493 -0
  48. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-manual.html +494 -0
  49. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-snapshot.html +497 -0
  50. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-submit.html +502 -0
  51. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-text.html +496 -0
  52. package/dist/examples/html-script/lead/README.md +25 -0
  53. package/dist/examples/html-script/lead/example-lead-trigger-attribute.html +594 -0
  54. package/dist/examples/html-script/lead/example-lead-trigger-auto.html +431 -0
  55. package/dist/examples/html-script/lead/example-lead-trigger-click.html +587 -0
  56. package/dist/examples/html-script/release-candidate.html +726 -0
  57. package/dist/examples/html-script/remove-from-cart/README.md +36 -0
  58. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-attribute.html +532 -0
  59. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-css.html +524 -0
  60. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-dedupe.html +540 -0
  61. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-manual.html +533 -0
  62. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-multi.html +557 -0
  63. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-state.html +539 -0
  64. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-text.html +524 -0
  65. package/dist/examples/html-script/search/README.md +41 -0
  66. package/dist/examples/html-script/search/example-search-attribute.html +454 -0
  67. package/dist/examples/html-script/search/example-search-button-sync.html +455 -0
  68. package/dist/examples/html-script/search/example-search-dedupe.html +466 -0
  69. package/dist/examples/html-script/search/example-search-input.html +456 -0
  70. package/dist/examples/html-script/search/example-search-manual.html +473 -0
  71. package/dist/examples/html-script/search/example-search-submit.html +450 -0
  72. package/dist/examples/html-script/search/example-search-text.html +441 -0
  73. package/dist/examples/html-script/view-content/README.md +48 -0
  74. package/dist/examples/html-script/view-content/example-view-content-attribute.html +488 -0
  75. package/dist/examples/html-script/view-content/example-view-content-css.html +467 -0
  76. package/dist/examples/html-script/view-content/example-view-content-dedupe.html +485 -0
  77. package/dist/examples/html-script/view-content/example-view-content-empty.html +469 -0
  78. package/dist/examples/html-script/view-content/example-view-content-manual.html +496 -0
  79. package/dist/examples/html-script/view-content/example-view-content-product-card.html +478 -0
  80. package/dist/examples/html-script/view-content/example-view-content-text.html +473 -0
  81. package/dist/examples/release-candidate/README.md +14 -0
  82. package/dist/examples/v2/README.md +33 -0
  83. package/dist/index-DUfFzniE.d.mts +274 -0
  84. package/dist/index-DUfFzniE.d.ts +274 -0
  85. package/dist/index.cjs.js +3 -0
  86. package/dist/index.cjs.js.map +1 -0
  87. package/dist/index.d.mts +364 -0
  88. package/dist/index.d.ts +364 -0
  89. package/dist/index.esm.js +3 -0
  90. package/dist/index.esm.js.map +1 -0
  91. package/dist/logger/index.cjs.js +3 -0
  92. package/dist/logger/index.cjs.js.map +1 -0
  93. package/dist/logger/index.d.mts +12 -0
  94. package/dist/logger/index.d.ts +12 -0
  95. package/dist/logger/index.esm.js +3 -0
  96. package/dist/logger/index.esm.js.map +1 -0
  97. package/dist/pixel-CbeF25mD.d.mts +555 -0
  98. package/dist/pixel-CbeF25mD.d.ts +555 -0
  99. package/dist/pixel-default-config-1VgLFOiL.d.mts +5 -0
  100. package/dist/pixel-default-config-Bxb-Vdd8.d.ts +5 -0
  101. package/dist/runtime/index.cjs.js +3 -0
  102. package/dist/runtime/index.cjs.js.map +1 -0
  103. package/dist/runtime/index.d.mts +48 -0
  104. package/dist/runtime/index.d.ts +48 -0
  105. package/dist/runtime/index.esm.js +3 -0
  106. package/dist/runtime/index.esm.js.map +1 -0
  107. package/dist/services/index.cjs.js +3 -0
  108. package/dist/services/index.cjs.js.map +1 -0
  109. package/dist/services/index.d.mts +169 -0
  110. package/dist/services/index.d.ts +169 -0
  111. package/dist/services/index.esm.js +3 -0
  112. package/dist/services/index.esm.js.map +1 -0
  113. package/dist/types-CTpRvFKZ.d.ts +71 -0
  114. package/dist/types-DGlBdsAy.d.mts +71 -0
  115. package/dist/v2/global.global.js +3 -0
  116. package/dist/v2/global.global.js.map +1 -0
  117. package/dist/v2/index.cjs.js +3 -0
  118. package/dist/v2/index.cjs.js.map +1 -0
  119. package/dist/v2/index.d.mts +7 -0
  120. package/dist/v2/index.d.ts +7 -0
  121. package/dist/v2/index.esm.js +3 -0
  122. package/dist/v2/index.esm.js.map +1 -0
  123. package/package.json +101 -0
@@ -0,0 +1,38 @@
1
+ # Pixel v2 — INITIATE_CHECKOUT (cenários isolados)
2
+
3
+ Cada HTML valida **um** comportamento. Abra um de cada vez.
4
+
5
+ `initiateCheckout` **tem** `selectorForm` (como LEAD / ADD_TO_CART).
6
+ O resolver monta snapshot (`items` / `value`) a partir de selectedItems + catálogo.
7
+ **Não** escreve CommerceState.
8
+
9
+ | # | Arquivo | Como dispara | O que valida |
10
+ |---|---------|--------------|--------------|
11
+ | 1 | [`example-initiate-checkout-attribute.html`](./example-initiate-checkout-attribute.html) | `[data-track="initiate_checkout"]` | SelectorDetector + snapshot |
12
+ | 2 | [`example-initiate-checkout-click.html`](./example-initiate-checkout-click.html) | `selectorForm` + `trigger: click` | Gate email+phone |
13
+ | 3 | [`example-initiate-checkout-submit.html`](./example-initiate-checkout-submit.html) | `selectorForm` + `trigger: submit` | Submit clássico + fireOnce |
14
+ | 4 | [`example-initiate-checkout-auto.html`](./example-initiate-checkout-auto.html) | `selectorForm` + `trigger: auto` | Disparo ao completar contato |
15
+ | 5 | [`example-initiate-checkout-text.html`](./example-initiate-checkout-text.html) | `text:Finalizar compra` | Match por texto + form |
16
+ | 6 | [`example-initiate-checkout-manual.html`](./example-initiate-checkout-manual.html) | `pixel.initiateCheckout()` | API + override de value |
17
+ | 7 | [`example-initiate-checkout-snapshot.html`](./example-initiate-checkout-snapshot.html) | atributo / manual | value = main+bump (≈244) |
18
+
19
+ ## Fontes do snapshot
20
+
21
+ ```txt
22
+ 1. Payload manual (value/items preservados)
23
+ 2. checkout.selectedItems
24
+ 3. catálogo commerce
25
+ 4. defaults (currency)
26
+ ```
27
+
28
+ ## Como abrir
29
+
30
+ 1. Na raiz: `npm run build`
31
+ 2. Abra o HTML (live server recomendado)
32
+ 3. Script: `../../../dist/v2/global.global.js`
33
+
34
+ ## Ordem sugerida
35
+
36
+ `atributo → click+form → submit → auto → text → manual → snapshot`
37
+
38
+ Referências: [`../lead/`](../lead/) · [`../add-to-cart/`](../add-to-cart/) · [`../remove-from-cart/`](../remove-from-cart/)
@@ -0,0 +1,485 @@
1
+ <!doctype html>
2
+ <html lang="pt-BR">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>Pixel v2 — INITIATE_CHECKOUT atributo data-track</title>
7
+ <style>
8
+ :root {
9
+ --bg: #f8fafc; --card: #fff; --border: #e2e8f0; --text: #0f172a;
10
+ --muted: #64748b; --accent: #0f766e; --accent-soft: #ccfbf1;
11
+ --warn: #9a3412; --warn-soft: #ffedd5;
12
+ }
13
+ * { box-sizing: border-box; }
14
+ body {
15
+ margin: 0;
16
+ font-family: "Segoe UI", system-ui, sans-serif;
17
+ background:
18
+ radial-gradient(circle at top left, #ecfeff 0%, transparent 40%),
19
+ linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
20
+ color: var(--text); line-height: 1.45;
21
+ }
22
+ .wrap { max-width: 980px; margin: 0 auto; padding: 1.5rem; }
23
+ h1 { font-size: 1.5rem; margin: 0 0 0.35rem; letter-spacing: -0.02em; }
24
+ h2 { font-size: 1.05rem; margin: 0 0 0.75rem; }
25
+ .sub { color: var(--muted); margin: 0 0 1rem; font-size: 0.92rem; }
26
+ .nav { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 1rem; }
27
+ .nav a {
28
+ text-decoration: none; border: 1px solid var(--border); background: #fff;
29
+ color: var(--text); border-radius: 999px; padding: 0.3rem 0.7rem; font-size: 0.78rem;
30
+ }
31
+ .nav a.active { background: var(--accent); border-color: var(--accent); color: #fff; }
32
+ .grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 1rem; }
33
+ @media (max-width: 860px) { .grid { grid-template-columns: 1fr; } }
34
+ .card {
35
+ background: var(--card); border: 1px solid var(--border); border-radius: 12px;
36
+ padding: 1rem; margin-bottom: 1rem; box-shadow: 0 1px 0 rgba(15,23,42,.03);
37
+ }
38
+ .hint {
39
+ background: var(--accent-soft); border: 1px solid #99f6e4; border-radius: 10px;
40
+ padding: 0.85rem 1rem; font-size: 0.9rem; margin-bottom: 1rem;
41
+ }
42
+ .hint.warn { background: var(--warn-soft); border-color: #fdba74; color: var(--warn); }
43
+ .actions { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.75rem; }
44
+ button {
45
+ appearance: none; border: 1px solid var(--border); background: #fff; color: var(--text);
46
+ border-radius: 8px; padding: 0.5rem 0.85rem; cursor: pointer; font: inherit;
47
+ }
48
+ button.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
49
+ button.danger { background: #7f1d1d; border-color: #7f1d1d; color: #fff; }
50
+ button:disabled { opacity: 0.55; cursor: not-allowed; }
51
+ label { display: block; font-size: 0.8rem; color: var(--muted); margin-bottom: 0.25rem; }
52
+ input {
53
+ width: 100%; border: 1px solid var(--border); border-radius: 8px;
54
+ padding: 0.55rem 0.7rem; font: inherit; background: #fff;
55
+ }
56
+ .row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
57
+ @media (max-width: 560px) { .row { grid-template-columns: 1fr; } }
58
+ .status, pre {
59
+ background: #0f172a; color: #e2e8f0; border-radius: 8px; padding: 0.75rem;
60
+ font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
61
+ font-size: 0.78rem; white-space: pre-wrap; word-break: break-word;
62
+ max-height: 260px; overflow: auto;
63
+ }
64
+ .pill {
65
+ display: inline-block; border-radius: 999px; padding: 0.15rem 0.55rem;
66
+ font-size: 0.72rem; background: #e2e8f0; color: #334155; margin-left: 0.35rem;
67
+ }
68
+ .pill.ok { background: #bbf7d0; color: #166534; }
69
+ .checklist { margin: 0; padding-left: 1.1rem; font-size: 0.88rem; color: var(--muted); }
70
+ .checklist li { margin: 0.35rem 0; }
71
+ .ctx {
72
+ border-left: 3px solid var(--accent); padding-left: 0.75rem; margin-bottom: 0.85rem;
73
+ color: var(--muted); font-size: 0.88rem;
74
+ }
75
+ .product {
76
+ border: 1px dashed var(--border); border-radius: 10px; padding: 0.75rem; margin: 0.5rem 0;
77
+ }
78
+ .product strong { display: block; margin-bottom: 0.2rem; }
79
+ code { font-size: 0.85em; }
80
+ </style>
81
+ </head>
82
+ <body>
83
+ <div class="wrap">
84
+ <h1>INITIATE_CHECKOUT — atributo · data-track</h1>
85
+ <p class="sub">
86
+ Cenário isolado para validação do Pixel v2.
87
+ <span class="pill" id="init-pill">offline</span>
88
+ </p>
89
+ <div class="nav"><a href="example-initiate-checkout-attribute.html" class="active">1. Atributo</a>
90
+ <a href="example-initiate-checkout-click.html" class="">2. Click+Form</a>
91
+ <a href="example-initiate-checkout-submit.html" class="">3. Submit</a>
92
+ <a href="example-initiate-checkout-auto.html" class="">4. Auto+Form</a>
93
+ <a href="example-initiate-checkout-text.html" class="">5. Text</a>
94
+ <a href="example-initiate-checkout-manual.html" class="">6. Manual API</a>
95
+ <a href="example-initiate-checkout-snapshot.html" class="">7. Snapshot/value</a></div>
96
+ <div class="hint"><strong>Contexto:</strong> CTA de checkout com
97
+ <code>data-track="initiate_checkout"</code>. Sem <code>selectorForm</code> —
98
+ clique dispara; <code>CommerceResolver</code> monta snapshot a partir de
99
+ <code>selectedItems</code> + catálogo.</div>
100
+
101
+ <div class="card">
102
+ <h2>Lifecycle</h2>
103
+ <div class="actions">
104
+ <button id="btn-reinit" class="primary" type="button">Reinitialize</button>
105
+ <button id="btn-destroy" class="danger" type="button">Destroy</button>
106
+ <button id="btn-clear" type="button">Clear logs</button>
107
+ </div>
108
+ <div class="status" id="runtime-status">Aguardando init...</div>
109
+ </div>
110
+
111
+ <div class="grid">
112
+ <div>
113
+ <div class="card">
114
+ <h2>Checkout por atributo <span class="pill">ConfiguredSelector</span></h2>
115
+ <div class="ctx">selectedItems: main_offer (R$ 197).</div>
116
+ <div class="product">
117
+ <strong>Oferta Principal — R$ 197</strong>
118
+ <div class="actions">
119
+ <button type="button" class="primary" data-track="initiate_checkout">
120
+ Ir para checkout
121
+ </button>
122
+ <button type="button" id="btn-no-track">Clique sem data-track</button>
123
+ </div>
124
+ </div>
125
+ <p class="sub">
126
+ Snapshot esperado: value ≈ 197, items com main_offer.
127
+ INITIATE_CHECKOUT <strong>não</strong> escreve CommerceState.
128
+ </p>
129
+ </div>
130
+ <div class="card">
131
+ <h2>Checklist</h2>
132
+ <ul class="checklist">
133
+ <li>[ ] Sem data-track → não dispara</li>
134
+ <li>[ ] Com data-track → <code>INITIATE_CHECKOUT</code></li>
135
+ <li>[ ] Snapshot com value/items do selectedItems</li>
136
+ <li>[ ] Detector: <code>ConfiguredSelector(INITIATE_CHECKOUT)</code></li>
137
+ </ul>
138
+ </div>
139
+ </div>
140
+ <div>
141
+ <div class="card">
142
+ <h2>Event counts</h2>
143
+ <div class="status" id="event-counts">Nenhum evento ainda</div>
144
+ </div>
145
+ <div class="card">
146
+ <h2>Checkout snapshot (último evento)</h2>
147
+ <div class="status" id="checkout-snapshot">null</div>
148
+ </div>
149
+ <div class="card">
150
+ <h2>Active detectors</h2>
151
+ <div class="status" id="detectors">—</div>
152
+ </div>
153
+
154
+ <div class="card">
155
+ <h2>Last event JSON</h2>
156
+ <pre id="last-event">null</pre>
157
+ </div>
158
+ <div class="card">
159
+ <h2>Event log</h2>
160
+ <pre id="logs">Aguardando eventos...</pre>
161
+ </div>
162
+ </div>
163
+ </div>
164
+ </div>
165
+
166
+ <script src="../../../dist/v2/global.global.js"></script>
167
+ <script>
168
+ const { Pixel, DEFAULT_PIXEL_CONFIG } = window.PixelV2;
169
+ const API_ENDPOINT =
170
+ 'https://micro-service-pixel-production-4826.up.railway.app';
171
+ const PIXEL_ID = 'pix_7315610';
172
+
173
+ const els = {
174
+ logs: document.getElementById('logs'),
175
+ last: document.getElementById('last-event'),
176
+ counts: document.getElementById('event-counts'),
177
+ snapshot: document.getElementById('checkout-snapshot'),
178
+ detectors: document.getElementById('detectors'),
179
+ dedupe: document.getElementById('dedupe-keys'),
180
+ runtime: document.getElementById('runtime-status'),
181
+ pill: document.getElementById('init-pill'),
182
+ };
183
+
184
+ let pixel = null;
185
+ let unsubscribe = null;
186
+ let initCount = 0;
187
+ let destroyCount = 0;
188
+ const counts = {};
189
+
190
+ function initiateCheckoutDetectorConfig() {
191
+ return {
192
+ enabled: true,
193
+ selector: ['[data-track="initiate_checkout"]'],
194
+ selectorType: 'css',
195
+ };
196
+ }
197
+
198
+ function buildConfig() {
199
+ const base = DEFAULT_PIXEL_CONFIG;
200
+ return {
201
+ ...base,
202
+ app: {
203
+ ...base.app,
204
+ source: 'custom',
205
+ environment: 'development',
206
+ debug: true,
207
+ },
208
+ transport: {
209
+ ...DEFAULT_PIXEL_CONFIG.transport,
210
+ apiEndpoint: API_ENDPOINT,
211
+ timeoutMs: 10000,
212
+ },
213
+ identity: { ...base.identity, pixelId: PIXEL_ID },
214
+ modules: {
215
+ ...base.modules,
216
+ core: {
217
+ ...base.modules.core,
218
+ enabled: false,
219
+ pageView: {
220
+ ...base.modules.core.pageView,
221
+ enabled: false,
222
+ trackInitialPageView: false,
223
+ spa: false,
224
+ },
225
+ },
226
+ behavior: { ...base.modules.behavior, enabled: false },
227
+ privacy: { ...base.modules.privacy, enabled: false },
228
+ transport: {
229
+ enabled: true,
230
+ mockSender: { enabled: false },
231
+ sender: { mode: 'http' },
232
+ persistence: { enabled: true },
233
+ replay: { enabled: true },
234
+ ordering: { enabled: true },
235
+ coordination: { enabled: true },
236
+ circuitBreaker: {
237
+ enabled: true,
238
+ failureThreshold: 5,
239
+ resetTimeoutMs: 30000,
240
+ halfOpenMaxAttempts: 2,
241
+ },
242
+ backpressure: {
243
+ enabled: true,
244
+ maxQueueSize: 500,
245
+ policy: 'drop_oldest',
246
+ sampleRate: 0.5,
247
+ },
248
+ deadLetter: { enabled: true, maxEntries: 200 },
249
+ compression: { enabled: true, strategy: 'identity' },
250
+ retry: {
251
+ enabled: true,
252
+ maxAttempts: 4,
253
+ baseDelayMs: 500,
254
+ maxDelayMs: 4000,
255
+ multiplier: 2,
256
+ },
257
+ batch: {
258
+ enabled: true,
259
+ batchSize: 10,
260
+ flushIntervalMs: 2000,
261
+ maxWaitMs: 5000,
262
+ },
263
+ timeout: { enabled: true, timeoutMs: 10000 },
264
+ offline: { enabled: true },
265
+ flush: {
266
+ enabled: true,
267
+ flushIntervalMs: 2000,
268
+ flushOnDestroy: true,
269
+ prepareUnloadHooks: true,
270
+ },
271
+ },
272
+ integrations: { ...base.modules.integrations, enabled: false },
273
+ conversion: {
274
+ enabled: true,
275
+ commerce: {
276
+ currency: 'BRL',
277
+ catalog: { products: [
278
+ {
279
+ id: 'main_offer',
280
+ name: 'Oferta Principal',
281
+ type: 'main',
282
+ price: 197,
283
+ currency: 'BRL',
284
+ quantity: 1,
285
+ },
286
+ {
287
+ id: 'order_bump_01',
288
+ name: 'Order Bump Especial',
289
+ type: 'order_bump',
290
+ price: 47,
291
+ currency: 'BRL',
292
+ quantity: 1,
293
+ },
294
+ {
295
+ id: 'upsell_01',
296
+ name: 'Upsell 01',
297
+ type: 'upsell',
298
+ price: 97,
299
+ currency: 'BRL',
300
+ quantity: 1,
301
+ },
302
+ ] },
303
+ checkout: {
304
+ mode: 'single_product',
305
+ selectedItems: [{ productId: "main_offer", quantity: 1 }],
306
+ calculateValueFrom: 'selected_items',
307
+ allowDynamicItems: true,
308
+ },
309
+ mappings: {
310
+ attributes: {
311
+ productId: ['data-product-id', 'data-sku', 'data-offer-id'],
312
+ productName: ['data-product-name', 'data-name'],
313
+ price: ['data-product-price', 'data-price'],
314
+ quantity: ['data-quantity', 'data-qty'],
315
+ currency: ['data-currency'],
316
+ },
317
+ fields: {
318
+ productId: ['productId', 'product_id', 'offerId', 'sku'],
319
+ productName: ['productName', 'product_name'],
320
+ price: ['price', 'amount'],
321
+ quantity: ['quantity', 'qty'],
322
+ currency: ['currency'],
323
+ email: ['email', 'customerEmail'],
324
+ phone: ['phone', 'telefone', 'customerPhone'],
325
+ },
326
+ },
327
+ },
328
+ manual: {
329
+ pageView: { enabled: false },
330
+ purchase: { enabled: false },
331
+ lead: { enabled: false },
332
+ addToCart: { enabled: false },
333
+ removeFromCart: { enabled: false },
334
+ initiateCheckout: { enabled: true },
335
+ addPaymentInfo: { enabled: false },
336
+ search: { enabled: false },
337
+ viewContent: { enabled: false },
338
+ },
339
+ auto: {
340
+ enabled: true,
341
+ detectors: {
342
+ lead: { enabled: false },
343
+ purchase: { enabled: false },
344
+ addToCart: { enabled: false },
345
+ removeFromCart: { enabled: false },
346
+ initiateCheckout: initiateCheckoutDetectorConfig(),
347
+ addPaymentInfo: { enabled: false },
348
+ search: { enabled: false },
349
+ viewContent: { enabled: false },
350
+ },
351
+ },
352
+ rules: {
353
+ enabled: false,
354
+ selectors: [],
355
+ texts: [],
356
+ urlPatterns: [],
357
+ checkout: { enabled: false },
358
+ card: { enabled: false },
359
+ },
360
+ },
361
+ },
362
+ };
363
+ }
364
+
365
+ function appendLog(message) {
366
+ const line = '[' + new Date().toISOString() + '] ' + message;
367
+ const prev = els.logs.textContent;
368
+ els.logs.textContent =
369
+ prev === 'Aguardando eventos...' ? line : line + '\n' + prev;
370
+ }
371
+
372
+ function renderCounts() {
373
+ const lines = Object.keys(counts)
374
+ .sort()
375
+ .map(function (type) { return type + ': ' + counts[type]; });
376
+ els.counts.textContent =
377
+ lines.length > 0 ? lines.join('\n') : 'Nenhum evento ainda';
378
+ }
379
+
380
+ function renderSnapshot(event) {
381
+ if (!els.snapshot) return;
382
+ if (!event || event.type !== 'INITIATE_CHECKOUT') {
383
+ els.snapshot.textContent = 'null';
384
+ return;
385
+ }
386
+ var d = event.data || {};
387
+ els.snapshot.textContent = JSON.stringify(
388
+ {
389
+ value: d.value,
390
+ currency: d.currency,
391
+ numItems: d.numItems,
392
+ items: d.items,
393
+ },
394
+ null,
395
+ 2
396
+ );
397
+ }
398
+
399
+ function renderDebug() {
400
+ const detectors =
401
+ pixel && pixel.getDebugActiveDetectors
402
+ ? pixel.getDebugActiveDetectors()
403
+ : [];
404
+ els.detectors.textContent =
405
+ detectors.length > 0 ? detectors.join('\n') : 'Nenhum detector ativo';
406
+ if (els.dedupe) {
407
+ const keys =
408
+ pixel && pixel.getDebugDedupeKeys ? pixel.getDebugDedupeKeys() : [];
409
+ els.dedupe.textContent =
410
+ keys.length > 0 ? keys.join('\n') : 'Nenhuma chave';
411
+ }
412
+ els.runtime.textContent =
413
+ 'initialized: ' +
414
+ (pixel ? pixel.isInitialized() : false) +
415
+ '\ninit count: ' +
416
+ initCount +
417
+ '\ndestroy count: ' +
418
+ destroyCount +
419
+ '\npixelId: ' +
420
+ PIXEL_ID +
421
+ '\nscenario: atributo · data-track';
422
+ els.pill.textContent =
423
+ pixel && pixel.isInitialized() ? 'ready' : 'offline';
424
+ els.pill.className =
425
+ 'pill' + (pixel && pixel.isInitialized() ? ' ok' : '');
426
+ }
427
+
428
+ function onEvent(event) {
429
+ counts[event.type] = (counts[event.type] || 0) + 1;
430
+ renderCounts();
431
+ renderSnapshot(event);
432
+ els.last.textContent = JSON.stringify(event, null, 2);
433
+ appendLog(event.type + ' ' + JSON.stringify(event.data || {}));
434
+ renderDebug();
435
+ }
436
+
437
+ async function boot() {
438
+ if (unsubscribe) { unsubscribe(); unsubscribe = null; }
439
+ if (pixel) {
440
+ await pixel.destroy();
441
+ destroyCount += 1;
442
+ pixel = null;
443
+ }
444
+ pixel = new Pixel(buildConfig());
445
+ await pixel.init();
446
+ initCount += 1;
447
+ const services = pixel.getDebugServices();
448
+ if (services && services.dispatcher) {
449
+ unsubscribe = services.dispatcher.subscribe(onEvent);
450
+ }
451
+ appendLog('Pixel initialized — atributo · data-track');
452
+ renderDebug();
453
+ }
454
+
455
+ async function destroyPixel() {
456
+ if (unsubscribe) { unsubscribe(); unsubscribe = null; }
457
+ if (pixel) {
458
+ await pixel.destroy();
459
+ destroyCount += 1;
460
+ pixel = null;
461
+ }
462
+ appendLog('Pixel destroyed');
463
+ renderDebug();
464
+ }
465
+
466
+ document.getElementById('btn-reinit').onclick = function () { boot(); };
467
+ document.getElementById('btn-destroy').onclick = function () { destroyPixel(); };
468
+ document.getElementById('btn-clear').onclick = function () {
469
+ els.logs.textContent = 'Aguardando eventos...';
470
+ els.last.textContent = 'null';
471
+ if (els.snapshot) els.snapshot.textContent = 'null';
472
+ Object.keys(counts).forEach(function (k) { delete counts[k]; });
473
+ renderCounts();
474
+ };
475
+
476
+
477
+ document.getElementById('btn-no-track').onclick = function () {
478
+ appendLog('(playground) clique sem data-track — esperado: nenhum evento');
479
+ };
480
+
481
+
482
+ boot();
483
+ </script>
484
+ </body>
485
+ </html>