@beworke/pixel 0.1.0-rc.1 → 0.1.0-rc.11

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 (191) hide show
  1. package/CHANGELOG.md +311 -4
  2. package/README.md +90 -128
  3. package/RELEASE_CANDIDATE.md +218 -101
  4. package/dist/Pixel-BnN86r4X.d.ts +797 -0
  5. package/dist/Pixel-BoUGqCbP.d.mts +797 -0
  6. package/dist/{StorageFactory-CAkJJqVD.d.ts → StorageFactory-BfCArzMM.d.ts} +2 -2
  7. package/dist/{StorageFactory-BhpbB6Jj.d.mts → StorageFactory-C0prtNR7.d.mts} +2 -2
  8. package/dist/browser/index.cjs.js +3 -0
  9. package/dist/browser/index.cjs.js.map +1 -0
  10. package/dist/browser/index.d.mts +77 -0
  11. package/dist/browser/index.d.ts +77 -0
  12. package/dist/browser/index.esm.js +3 -0
  13. package/dist/browser/index.esm.js.map +1 -0
  14. package/dist/browser/pixel.buygoods-checkout.global.js +4 -0
  15. package/dist/browser/pixel.buygoods-checkout.global.js.map +1 -0
  16. package/dist/browser/pixel.buygoods-landing.global.js +4 -0
  17. package/dist/browser/pixel.buygoods-landing.global.js.map +1 -0
  18. package/dist/browser/pixel.global.js +4 -0
  19. package/dist/browser/pixel.global.js.map +1 -0
  20. package/dist/browser/pixel.internal-checkout.global.js +4 -0
  21. package/dist/browser/pixel.internal-checkout.global.js.map +1 -0
  22. package/dist/config/index.cjs.js +1 -1
  23. package/dist/config/index.cjs.js.map +1 -1
  24. package/dist/config/index.d.mts +16 -5
  25. package/dist/config/index.d.ts +16 -5
  26. package/dist/config/index.esm.js +1 -1
  27. package/dist/config/index.esm.js.map +1 -1
  28. package/dist/events/index.cjs.js +1 -1
  29. package/dist/events/index.cjs.js.map +1 -1
  30. package/dist/events/index.d.mts +2 -1
  31. package/dist/events/index.d.ts +2 -1
  32. package/dist/events/index.esm.js +1 -1
  33. package/dist/events/index.esm.js.map +1 -1
  34. package/dist/examples/html-script/README.md +21 -55
  35. package/dist/examples/html-script/RELEASE_CANDIDATE.md +39 -26
  36. package/dist/examples/html-script/add-payment-info/README.md +3 -3
  37. package/dist/examples/html-script/add-payment-info/example-add-payment-info-card-autocomplete.html +107 -96
  38. package/dist/examples/html-script/add-payment-info/example-add-payment-info-card-disabled.html +107 -96
  39. package/dist/examples/html-script/add-payment-info/example-add-payment-info-card-fields.html +106 -95
  40. package/dist/examples/html-script/add-payment-info/example-add-payment-info-data-track.html +114 -95
  41. package/dist/examples/html-script/add-payment-info/example-add-payment-info-dedupe.html +106 -95
  42. package/dist/examples/html-script/add-payment-info/example-add-payment-info-manual.html +97 -95
  43. package/dist/examples/html-script/add-payment-info/example-add-payment-info-rules-card.html +106 -95
  44. package/dist/examples/html-script/add-payment-info/example-add-payment-info-security.html +106 -95
  45. package/dist/examples/html-script/add-to-cart/README.md +9 -6
  46. package/dist/examples/html-script/add-to-cart/example-add-to-cart-attribute.html +133 -119
  47. package/dist/examples/html-script/add-to-cart/example-add-to-cart-auto.html +146 -130
  48. package/dist/examples/html-script/add-to-cart/example-add-to-cart-click.html +144 -127
  49. package/dist/examples/html-script/add-to-cart/example-add-to-cart-dedupe.html +133 -119
  50. package/dist/examples/html-script/add-to-cart/example-add-to-cart-link.html +590 -0
  51. package/dist/examples/html-script/add-to-cart/example-add-to-cart-manual.html +124 -116
  52. package/dist/examples/html-script/add-to-cart/example-add-to-cart-order-bump.html +133 -119
  53. package/dist/examples/html-script/add-to-cart/example-add-to-cart-text.html +147 -130
  54. package/dist/examples/html-script/behavior/example-behavior-engagement.html +489 -0
  55. package/dist/examples/html-script/behavior/example-behavior-heartbeat.html +350 -0
  56. package/dist/examples/html-script/behavior/example-behavior-runtime-intelligence.html +433 -0
  57. package/dist/examples/html-script/behavior/example-behavior-viewport.html +397 -0
  58. package/dist/examples/html-script/{example-behavior.html → behavior/example-behavior.html} +23 -17
  59. package/dist/examples/html-script/buygoods/example-buygoods-checkout.html +50 -0
  60. package/dist/examples/html-script/buygoods/ladding.html +184 -0
  61. package/dist/examples/html-script/example-basic.html +1 -1
  62. package/dist/examples/html-script/example-checkout-commerce.html +826 -0
  63. package/dist/examples/html-script/example-conversion.html +42 -49
  64. package/dist/examples/html-script/example-global-factory-classic.html +45 -0
  65. package/dist/examples/html-script/example-global-factory.html +40 -0
  66. package/dist/examples/html-script/example-integration.html +45 -51
  67. package/dist/examples/html-script/example-landing-commerce.html +416 -0
  68. package/dist/examples/html-script/example-runtime-diagnostics.html +108 -0
  69. package/dist/examples/html-script/example-transport.html +70 -63
  70. package/dist/examples/html-script/full-funnel/README.md +64 -0
  71. package/dist/examples/html-script/full-funnel/checkout.html +118 -0
  72. package/dist/examples/html-script/full-funnel/downsell.html +60 -0
  73. package/dist/examples/html-script/full-funnel/landing.html +153 -0
  74. package/dist/examples/html-script/full-funnel/thank-you.html +87 -0
  75. package/dist/examples/html-script/full-funnel/upsell.html +66 -0
  76. package/dist/examples/html-script/initiate-checkout/README.md +6 -6
  77. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-attribute.html +135 -122
  78. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-auto.html +143 -128
  79. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-click.html +144 -128
  80. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-manual.html +127 -120
  81. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-snapshot.html +136 -123
  82. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-submit.html +144 -131
  83. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-text.html +146 -130
  84. package/dist/examples/html-script/internal-checkout/example-cardioclear-checkout.html +57 -0
  85. package/dist/examples/html-script/internal-checkout/example-slimsoda-checkout.html +53 -0
  86. package/dist/examples/html-script/lead/README.md +9 -7
  87. package/dist/examples/html-script/lead/example-lead-trigger-attribute.html +107 -94
  88. package/dist/examples/html-script/lead/example-lead-trigger-auto.html +118 -103
  89. package/dist/examples/html-script/lead/example-lead-trigger-click.html +118 -102
  90. package/dist/examples/html-script/release-candidate.html +219 -107
  91. package/dist/examples/html-script/remove-from-cart/README.md +4 -4
  92. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-attribute.html +134 -121
  93. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-css.html +134 -121
  94. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-dedupe.html +141 -128
  95. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-manual.html +125 -118
  96. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-multi.html +135 -122
  97. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-state.html +136 -123
  98. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-text.html +139 -124
  99. package/dist/examples/html-script/search/README.md +1 -1
  100. package/dist/examples/html-script/search/example-search-attribute.html +107 -99
  101. package/dist/examples/html-script/search/example-search-button-sync.html +107 -99
  102. package/dist/examples/html-script/search/example-search-dedupe.html +107 -99
  103. package/dist/examples/html-script/search/example-search-input.html +108 -99
  104. package/dist/examples/html-script/search/example-search-manual.html +98 -96
  105. package/dist/examples/html-script/search/example-search-submit.html +107 -99
  106. package/dist/examples/html-script/search/example-search-text.html +112 -99
  107. package/dist/examples/html-script/url-context/example-url-context-allowed-domains.html +92 -0
  108. package/dist/examples/html-script/url-context/example-url-context-landing.html +110 -0
  109. package/dist/examples/html-script/url-context/example-url-context-upsell.html +105 -0
  110. package/dist/examples/html-script/url-context/example-url-context.html +205 -0
  111. package/dist/examples/html-script/view-content/README.md +1 -1
  112. package/dist/examples/html-script/view-content/example-view-content-attribute.html +126 -118
  113. package/dist/examples/html-script/view-content/example-view-content-css.html +126 -118
  114. package/dist/examples/html-script/view-content/example-view-content-dedupe.html +126 -118
  115. package/dist/examples/html-script/view-content/example-view-content-empty.html +126 -118
  116. package/dist/examples/html-script/view-content/example-view-content-manual.html +117 -115
  117. package/dist/examples/html-script/view-content/example-view-content-product-card.html +126 -118
  118. package/dist/examples/html-script/view-content/example-view-content-text.html +131 -121
  119. package/dist/examples/release-candidate/README.md +2 -1
  120. package/dist/examples/v2/README.md +16 -13
  121. package/dist/index-B8u_3PGG.d.ts +460 -0
  122. package/dist/index-BxT2d-TK.d.mts +460 -0
  123. package/dist/index.cjs.js +1 -1
  124. package/dist/index.cjs.js.map +1 -1
  125. package/dist/index.d.mts +23 -361
  126. package/dist/index.d.ts +23 -361
  127. package/dist/index.esm.js +1 -1
  128. package/dist/index.esm.js.map +1 -1
  129. package/dist/pixel-DNGbAN5C.d.ts +871 -0
  130. package/dist/pixel-_BSDpx4M.d.mts +871 -0
  131. package/dist/pixel-default-config-BMYaqs7i.d.ts +21 -0
  132. package/dist/pixel-default-config-DLRya1tl.d.mts +21 -0
  133. package/dist/pixel-settings-D-t9zQb4.d.ts +40 -0
  134. package/dist/pixel-settings-DGxl0MVm.d.mts +40 -0
  135. package/dist/runtime/index.cjs.js +1 -1
  136. package/dist/runtime/index.cjs.js.map +1 -1
  137. package/dist/runtime/index.d.mts +19 -26
  138. package/dist/runtime/index.d.ts +19 -26
  139. package/dist/runtime/index.esm.js +1 -1
  140. package/dist/runtime/index.esm.js.map +1 -1
  141. package/dist/services/index.cjs.js +1 -1
  142. package/dist/services/index.cjs.js.map +1 -1
  143. package/dist/services/index.d.mts +14 -6
  144. package/dist/services/index.d.ts +14 -6
  145. package/dist/services/index.esm.js +1 -1
  146. package/dist/services/index.esm.js.map +1 -1
  147. package/dist/types-B-Nzagpk.d.mts +19 -0
  148. package/dist/types-D0KVsgzs.d.mts +293 -0
  149. package/dist/types-D3kJ9bfT.d.ts +293 -0
  150. package/dist/types-Dfi9C49l.d.ts +19 -0
  151. package/dist/url-context-Ck2LK18V.d.mts +87 -0
  152. package/dist/url-context-Ck2LK18V.d.ts +87 -0
  153. package/dist/v2/global.global.js +1 -1
  154. package/dist/v2/global.global.js.map +1 -1
  155. package/dist/v2/index.cjs.js +1 -1
  156. package/dist/v2/index.cjs.js.map +1 -1
  157. package/dist/v2/index.d.mts +26 -6
  158. package/dist/v2/index.d.ts +26 -6
  159. package/dist/v2/index.esm.js +1 -1
  160. package/dist/v2/index.esm.js.map +1 -1
  161. package/docs/public/README.md +80 -0
  162. package/docs/public/api/exports.md +56 -0
  163. package/docs/public/api/pixel.md +86 -0
  164. package/docs/public/configuration/commerce.md +44 -0
  165. package/docs/public/configuration/modules.md +63 -0
  166. package/docs/public/configuration/overview.md +85 -0
  167. package/docs/public/configuration/transport.md +127 -0
  168. package/docs/public/events/catalog.md +67 -0
  169. package/docs/public/getting-started/installation.md +88 -0
  170. package/docs/public/getting-started/quick-start.md +142 -0
  171. package/docs/public/getting-started/react-nextjs.md +78 -0
  172. package/docs/public/getting-started/script-tag.md +102 -0
  173. package/docs/public/guides/funnel-checkout.md +52 -0
  174. package/docs/public/guides/funnel-downsell.md +53 -0
  175. package/docs/public/guides/funnel-full.md +64 -0
  176. package/docs/public/guides/funnel-landing.md +70 -0
  177. package/docs/public/guides/funnel-thank-you.md +48 -0
  178. package/docs/public/guides/funnel-upsell.md +72 -0
  179. package/docs/public/limitations.md +33 -0
  180. package/docs/public/privacy/limitations.md +33 -0
  181. package/docs/public/release-candidate/validation.md +42 -0
  182. package/docs/public/troubleshooting.md +56 -0
  183. package/package.json +41 -20
  184. package/dist/index-DUfFzniE.d.mts +0 -274
  185. package/dist/index-DUfFzniE.d.ts +0 -274
  186. package/dist/pixel-CbeF25mD.d.mts +0 -555
  187. package/dist/pixel-CbeF25mD.d.ts +0 -555
  188. package/dist/pixel-default-config-1VgLFOiL.d.mts +0 -5
  189. package/dist/pixel-default-config-Bxb-Vdd8.d.ts +0 -5
  190. package/dist/types-CTpRvFKZ.d.ts +0 -71
  191. package/dist/types-DGlBdsAy.d.mts +0 -71
package/dist/examples/html-script/example-checkout-commerce.html ADDED
@@ -0,0 +1,826 @@
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 — Checkout Commerce (14B)</title>
7
+ <style>
8
+ :root {
9
+ --bg: #f8fafc;
10
+ --card: #fff;
11
+ --border: #e2e8f0;
12
+ --text: #0f172a;
13
+ --muted: #64748b;
14
+ --accent: #0f766e;
15
+ --accent-soft: #ccfbf1;
16
+ --warn: #9a3412;
17
+ --warn-soft: #ffedd5;
18
+ --ok: #166534;
19
+ --ok-soft: #bbf7d0;
20
+ }
21
+ * { box-sizing: border-box; }
22
+ body {
23
+ margin: 0;
24
+ font-family: "Segoe UI", system-ui, sans-serif;
25
+ background:
26
+ radial-gradient(circle at top left, #ecfeff 0%, transparent 42%),
27
+ linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
28
+ color: var(--text);
29
+ line-height: 1.45;
30
+ }
31
+ .wrap { max-width: 1100px; margin: 0 auto; padding: 1.5rem; }
32
+ h1 { font-size: 1.55rem; margin: 0 0 0.35rem; letter-spacing: -0.02em; }
33
+ h2 { font-size: 1.05rem; margin: 0 0 0.75rem; }
34
+ .sub { color: var(--muted); margin: 0 0 1rem; font-size: 0.92rem; }
35
+ .grid { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 1rem; }
36
+ @media (max-width: 900px) { .grid { grid-template-columns: 1fr; } }
37
+ .card {
38
+ background: var(--card);
39
+ border: 1px solid var(--border);
40
+ border-radius: 12px;
41
+ padding: 1rem;
42
+ margin-bottom: 1rem;
43
+ box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03);
44
+ }
45
+ .hint {
46
+ background: var(--accent-soft);
47
+ border: 1px solid #99f6e4;
48
+ border-radius: 10px;
49
+ padding: 0.85rem 1rem;
50
+ font-size: 0.9rem;
51
+ margin-bottom: 1rem;
52
+ }
53
+ .hint.warn {
54
+ background: var(--warn-soft);
55
+ border-color: #fdba74;
56
+ color: var(--warn);
57
+ }
58
+ .actions { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.75rem; }
59
+ button {
60
+ appearance: none;
61
+ border: 1px solid var(--border);
62
+ background: #fff;
63
+ color: var(--text);
64
+ border-radius: 8px;
65
+ padding: 0.5rem 0.85rem;
66
+ cursor: pointer;
67
+ font: inherit;
68
+ }
69
+ button.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
70
+ button.danger { background: #7f1d1d; border-color: #7f1d1d; color: #fff; }
71
+ button:disabled { opacity: 0.55; cursor: not-allowed; }
72
+ label { display: block; font-size: 0.8rem; color: var(--muted); margin-bottom: 0.25rem; }
73
+ input, select {
74
+ width: 100%;
75
+ border: 1px solid var(--border);
76
+ border-radius: 8px;
77
+ padding: 0.55rem 0.7rem;
78
+ font: inherit;
79
+ background: #fff;
80
+ }
81
+ .row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
82
+ @media (max-width: 560px) { .row { grid-template-columns: 1fr; } }
83
+ .status, pre, .log {
84
+ background: #0f172a;
85
+ color: #e2e8f0;
86
+ border-radius: 8px;
87
+ padding: 0.75rem;
88
+ font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
89
+ font-size: 0.75rem;
90
+ white-space: pre-wrap;
91
+ word-break: break-word;
92
+ max-height: 280px;
93
+ overflow: auto;
94
+ }
95
+ .pill {
96
+ display: inline-block;
97
+ border-radius: 999px;
98
+ padding: 0.15rem 0.55rem;
99
+ font-size: 0.72rem;
100
+ background: #e2e8f0;
101
+ color: #334155;
102
+ margin-left: 0.35rem;
103
+ }
104
+ .pill.ok { background: var(--ok-soft); color: var(--ok); }
105
+ .pill.bad { background: #fecaca; color: #991b1b; }
106
+ .checklist { margin: 0; padding-left: 1.1rem; font-size: 0.86rem; color: var(--muted); }
107
+ .checklist li { margin: 0.3rem 0; }
108
+ .product {
109
+ border: 1px dashed var(--border);
110
+ border-radius: 10px;
111
+ padding: 0.75rem;
112
+ margin: 0.5rem 0;
113
+ }
114
+ fieldset {
115
+ border: 1px solid var(--border);
116
+ border-radius: 10px;
117
+ padding: 0.75rem;
118
+ margin: 0 0 0.75rem;
119
+ }
120
+ legend { padding: 0 0.35rem; font-size: 0.85rem; color: var(--muted); }
121
+ code { font-size: 0.85em; }
122
+ </style>
123
+ </head>
124
+ <body>
125
+ <div class="wrap">
126
+ <h1>
127
+ Pixel v2 — Release Candidate
128
+ <span class="pill" id="pixelv2-pill">PixelV2?</span>
129
+ <span class="pill" id="init-pill">offline</span>
130
+ </h1>
131
+ <p class="sub">
132
+ Etapa 13A — consumidor real via <code>&lt;script&gt;</code> +
133
+ <code>dist/v2/global.global.js</code> (<code>window.PixelV2</code>).
134
+ </p>
135
+
136
+ <div class="hint">
137
+ <strong>Como abrir:</strong> rode <code>npm run build</code> e abra este arquivo
138
+ (ou <code>dist/examples/html-script/release-candidate.html</code>) no navegador.
139
+ Endpoint / Pixel ID podem vir da query
140
+ <code>?endpoint=…&amp;pixelId=…</code> ou dos campos abaixo — não commitam segredos.
141
+ </div>
142
+
143
+ <div class="card">
144
+ <h2>Conexão API</h2>
145
+ <div class="row">
146
+ <div>
147
+ <label for="api-endpoint">PIXEL_API_ENDPOINT</label>
148
+ <input id="api-endpoint" type="url" placeholder="https://sua-api.example.com" />
149
+ </div>
150
+ <div>
151
+ <label for="pixel-id">PIXEL_ID</label>
152
+ <input id="pixel-id" type="text" placeholder="pix_…" />
153
+ </div>
154
+ </div>
155
+ <div class="row" style="margin-top: 0.75rem">
156
+ <div>
157
+ <label for="batch-mode">Modo transport</label>
158
+ <select id="batch-mode">
159
+ <option value="event">Event (batchSize=1)</option>
160
+ <option value="batch">Batch (batchSize=10)</option>
161
+ </select>
162
+ </div>
163
+ <div>
164
+ <label for="sender-mode">Sender</label>
165
+ <select id="sender-mode">
166
+ <option value="internal">Internal (endpoint público)</option>
167
+ <option value="test">Test (sem rede)</option>
168
+ </select>
169
+ </div>
170
+ </div>
171
+ <div class="actions">
172
+ <button id="btn-init" class="primary" type="button">Init</button>
173
+ <button id="btn-reinit" type="button">Reinit</button>
174
+ <button id="btn-destroy" class="danger" type="button">Destroy</button>
175
+ <button id="btn-flush" type="button">Flush transport</button>
176
+ <button id="btn-clear" type="button">Clear logs</button>
177
+ </div>
178
+ <div class="status" id="runtime-status" style="margin-top: 0.75rem">Aguardando…</div>
179
+ </div>
180
+
181
+ <div class="grid">
182
+ <div>
183
+ <div class="card">
184
+ <h2>Manual</h2>
185
+ <div class="actions">
186
+ <button id="btn-lead" class="primary" type="button">LEAD</button>
187
+ <button id="btn-atc" type="button">ADD_TO_CART (parcial)</button>
188
+ <button id="btn-rfc" type="button">REMOVE_FROM_CART</button>
189
+ <button id="btn-ic" type="button">INITIATE_CHECKOUT</button>
190
+ <button id="btn-purchase" type="button">PURCHASE</button>
191
+ </div>
192
+ <p class="sub" style="margin-top: 0.75rem; margin-bottom: 0">
193
+ PAGE_VIEW vem do Core (<code>trackInitialPageView</code>) no init.
194
+ </p>
195
+ </div>
196
+
197
+ <div class="card">
198
+ <h2>Auto — LEAD (source form · trigger auto)</h2>
199
+ <fieldset>
200
+ <legend>Campos (mode: any · fireOnce)</legend>
201
+ <div class="row">
202
+ <div>
203
+ <label for="lead-email">email</label>
204
+ <input id="lead-email" name="email" type="email" autocomplete="email" />
205
+ </div>
206
+ <div>
207
+ <label for="lead-phone">phone</label>
208
+ <input id="lead-phone" name="phone" type="tel" autocomplete="tel" />
209
+ </div>
210
+ </div>
211
+ </fieldset>
212
+ <p class="sub">Preencha email ou phone — detector auto deve disparar LEAD.</p>
213
+ </div>
214
+
215
+ <div class="card">
216
+ <h2>Auto — ADD_TO_CART</h2>
217
+ <div class="product">
218
+ <strong>Oferta Principal RC — R$ 197</strong>
219
+ <div class="actions">
220
+ <button
221
+ type="button"
222
+ class="primary"
223
+ data-track="add_to_cart"
224
+ data-product-id="main_offer"
225
+ >
226
+ data-track add_to_cart
227
+ </button>
228
+ <button type="button">Comprar agora</button>
229
+ </div>
230
+ </div>
231
+ <p class="sub">
232
+ Clique rápido 2× no mesmo botão: esperado 1 evento (&lt;500ms).
233
+ Após 500ms: novo evento permitido.
234
+ </p>
235
+ </div>
236
+
237
+ <div class="card">
238
+ <h2>Auto — Checkout (IC + ATC form + Payment)</h2>
239
+ <p class="sub">
240
+ lifecycle → IC no ready · email+phone → ATC form (1×) ·
241
+ editar address/cartão não re-dispara ATC · bump via data-track ·
242
+ cartão → ADD_PAYMENT_INFO (1×)
243
+ </p>
244
+ <form id="checkout-form">
245
+ <div class="row">
246
+ <div>
247
+ <label for="co-email">email</label>
248
+ <input id="co-email" name="email" type="email" autocomplete="email" />
249
+ </div>
250
+ <div>
251
+ <label for="co-phone">phone</label>
252
+ <input id="co-phone" name="phone" type="tel" autocomplete="tel" />
253
+ </div>
254
+ </div>
255
+ <div class="row">
256
+ <div>
257
+ <label for="co-address">address</label>
258
+ <input id="co-address" name="address" type="text" autocomplete="street-address" />
259
+ </div>
260
+ <div>
261
+ <label for="co-city">city</label>
262
+ <input id="co-city" name="city" type="text" autocomplete="address-level2" />
263
+ </div>
264
+ </div>
265
+ <div class="row">
266
+ <div>
267
+ <label for="co-postal">postal</label>
268
+ <input id="co-postal" name="postal" type="text" autocomplete="postal-code" />
269
+ </div>
270
+ <div>
271
+ <label for="co-card">card (só detecta início — não envia número)</label>
272
+ <input
273
+ id="co-card"
274
+ name="card_number"
275
+ type="text"
276
+ autocomplete="cc-number"
277
+ inputmode="numeric"
278
+ placeholder="4111…"
279
+ />
280
+ </div>
281
+ </div>
282
+ <div class="actions">
283
+ <button type="submit" class="primary" data-track="initiate_checkout">
284
+ Finalizar checkout
285
+ </button>
286
+ <button
287
+ type="button"
288
+ data-track="add_to_cart"
289
+ data-product-id="order_bump_01"
290
+ >
291
+ Order bump (selector ATC)
292
+ </button>
293
+ </div>
294
+ </form>
295
+ </div>
296
+ </div>
297
+
298
+ <div>
299
+ <div class="card">
300
+ <h2>Event counts</h2>
301
+ <pre id="event-counts">—</pre>
302
+ </div>
303
+ <div class="card">
304
+ <h2>Transport debug</h2>
305
+ <pre id="transport-state">—</pre>
306
+ </div>
307
+ <div class="card">
308
+ <h2>Dedupe / detectors</h2>
309
+ <pre id="dedupe-state">—</pre>
310
+ </div>
311
+ <div class="card">
312
+ <h2>Último payload</h2>
313
+ <pre id="last-payload">—</pre>
314
+ </div>
315
+ <div class="card">
316
+ <h2>Logs</h2>
317
+ <div class="log" id="logs"></div>
318
+ </div>
319
+ </div>
320
+ </div>
321
+
322
+ <div class="card">
323
+ <h2>Checklist manual 14C</h2>
324
+ <ul class="checklist">
325
+ <li>[ ] window.PixelV2 existe</li>
326
+ <li>[ ] Pixel inicializa sem erro</li>
327
+ <li>[ ] PAGE_VIEW dispara no init — sem commerce (pageView enrichment off)</li>
328
+ <li>[ ] INITIATE_CHECKOUT dispara por lifecycle no ready</li>
329
+ <li>[ ] email+phone no #checkout-form → ADD_TO_CART form (1×)</li>
330
+ <li>[ ] ADD_TO_CART form contém productId=main_offer</li>
331
+ <li>[ ] ADD_TO_CART form contém price/currency/quantity</li>
332
+ <li>[ ] editar address/city/postal depois não re-dispara ATC form</li>
333
+ <li>[ ] data-track="add_to_cart" / bump → ADD_TO_CART selector</li>
334
+ <li>[ ] ADD_TO_CART selector order bump contém productId=order_bump_01</li>
335
+ <li>[ ] preencher cartão → ADD_PAYMENT_INFO (1×, sem número no payload)</li>
336
+ <li>[ ] LEAD / ATC / IC / PURCHASE manuais funcionam</li>
337
+ <li>[ ] dedupe ATC &lt;500ms</li>
338
+ <li>[ ] Transport ACK / Flush</li>
339
+ <li>[ ] destroy remove listeners / reinit não duplica</li>
340
+ <li>[ ] Transport Event/Batch real recebe ACK (HTTP)</li>
341
+ </ul>
342
+ </div>
343
+ </div>
344
+
345
+ <script src="../../v2/global.global.js"></script>
346
+ <script>
347
+ (function () {
348
+ var params = new URLSearchParams(window.location.search);
349
+ var stored = {};
350
+ try {
351
+ stored = JSON.parse(localStorage.getItem('pixel_rc_conn') || '{}');
352
+ } catch (e) {
353
+ stored = {};
354
+ }
355
+
356
+ var endpointInput = document.getElementById('api-endpoint');
357
+ var pixelIdInput = document.getElementById('pixel-id');
358
+ endpointInput.value =
359
+ params.get('endpoint') ||
360
+ stored.endpoint ||
361
+ '';
362
+ pixelIdInput.value =
363
+ params.get('pixelId') ||
364
+ stored.pixelId ||
365
+ '';
366
+
367
+ var pixelv2Pill = document.getElementById('pixelv2-pill');
368
+ var initPill = document.getElementById('init-pill');
369
+ var runtimeStatus = document.getElementById('runtime-status');
370
+ var logsEl = document.getElementById('logs');
371
+ var countsEl = document.getElementById('event-counts');
372
+ var transportEl = document.getElementById('transport-state');
373
+ var dedupeEl = document.getElementById('dedupe-state');
374
+ var lastPayloadEl = document.getElementById('last-payload');
375
+
376
+ var pixel = null;
377
+ var unsubscribe = null;
378
+ var initCount = 0;
379
+ var destroyCount = 0;
380
+ var counts = {};
381
+ var lastEvent = null;
382
+
383
+ function hasPixelV2() {
384
+ return !!(window.PixelV2 && window.PixelV2.Pixel && window.PixelV2.DEFAULT_PIXEL_CONFIG);
385
+ }
386
+
387
+ function appendLog(msg) {
388
+ var line = '[' + new Date().toISOString() + '] ' + msg;
389
+ logsEl.textContent = line + '\n' + logsEl.textContent;
390
+ }
391
+
392
+ function bump(type) {
393
+ counts[type] = (counts[type] || 0) + 1;
394
+ renderCounts();
395
+ }
396
+
397
+ function renderCounts() {
398
+ var keys = Object.keys(counts).sort();
399
+ countsEl.textContent = keys.length
400
+ ? keys.map(function (k) { return k + ': ' + counts[k]; }).join('\n')
401
+ : 'Nenhum evento ainda';
402
+ }
403
+
404
+ function renderTransport() {
405
+ if (!pixel || !pixel.getDebugTransportState) {
406
+ transportEl.textContent = '—';
407
+ return;
408
+ }
409
+ var s = pixel.getDebugTransportState() || {};
410
+ var sender = s.sender || {};
411
+ transportEl.textContent = JSON.stringify(
412
+ {
413
+ sentCount: s.sentCount,
414
+ queueSize: s.queueSize,
415
+ inFlight: s.delivery && s.delivery.inFlight,
416
+ ackCount: s.delivery && s.delivery.ackCount,
417
+ lastAck: sender.lastAck,
418
+ senderMode: s.advanced && s.advanced.senderMode,
419
+ lastResponses: (sender.responses || []).slice(-3),
420
+ },
421
+ null,
422
+ 2
423
+ );
424
+ }
425
+
426
+ function renderDedupe() {
427
+ if (!pixel) {
428
+ dedupeEl.textContent = '—';
429
+ return;
430
+ }
431
+ var keys = pixel.getDebugDedupeKeys ? pixel.getDebugDedupeKeys() : [];
432
+ var dets = pixel.getDebugActiveDetectors ? pixel.getDebugActiveDetectors() : [];
433
+ dedupeEl.textContent =
434
+ 'detectors (' + dets.length + '):\n' +
435
+ (dets.join('\n') || '(none)') +
436
+ '\n\ndedupe keys (' + keys.length + '):\n' +
437
+ (keys.join('\n') || '(none)');
438
+ }
439
+
440
+ function renderRuntime() {
441
+ var services = pixel && pixel.getDebugServices ? pixel.getDebugServices() : null;
442
+ runtimeStatus.textContent =
443
+ 'PixelV2: ' + hasPixelV2() +
444
+ '\ninitialized: ' + (pixel ? pixel.isInitialized() : false) +
445
+ '\ninitCount: ' + initCount +
446
+ '\ndestroyCount: ' + destroyCount +
447
+ '\ndispatcher listeners: ' +
448
+ (services ? services.dispatcher.getListenerCount() : 0);
449
+ initPill.textContent = pixel && pixel.isInitialized() ? 'online' : 'offline';
450
+ initPill.className = 'pill ' + (pixel && pixel.isInitialized() ? 'ok' : 'bad');
451
+ renderTransport();
452
+ renderDedupe();
453
+ }
454
+
455
+ function saveConn() {
456
+ try {
457
+ localStorage.setItem(
458
+ 'pixel_rc_conn',
459
+ JSON.stringify({
460
+ endpoint: endpointInput.value.trim(),
461
+ pixelId: pixelIdInput.value.trim(),
462
+ })
463
+ );
464
+ } catch (e) {}
465
+ }
466
+
467
+ function buildConfig() {
468
+ var Pixel = window.PixelV2.Pixel;
469
+ var DEFAULT_PIXEL_CONFIG = window.PixelV2.DEFAULT_PIXEL_CONFIG;
470
+ var endpoint = endpointInput.value.trim();
471
+ var pixelId = pixelIdInput.value.trim();
472
+ var batchMode = document.getElementById('batch-mode').value;
473
+ var senderMode = document.getElementById('sender-mode').value;
474
+ var useInternal = senderMode === 'internal';
475
+ var batchSize = batchMode === 'batch' ? 10 : 1;
476
+
477
+ if (useInternal && (!endpoint || !pixelId)) {
478
+ throw new Error('Preencha PIXEL_API_ENDPOINT e PIXEL_ID para sender internal.');
479
+ }
480
+
481
+ return {
482
+ ...DEFAULT_PIXEL_CONFIG,
483
+ app: {
484
+ ...DEFAULT_PIXEL_CONFIG.app,
485
+ source: 'custom',
486
+ environment: 'development',
487
+ debug: true,
488
+ },
489
+ identity: {
490
+ ...DEFAULT_PIXEL_CONFIG.identity,
491
+ pixelId: pixelId || 'pixel-rc-demo',
492
+ },
493
+ transport: {
494
+ ...DEFAULT_PIXEL_CONFIG.transport,
495
+ enabled: true,
496
+ sender: useInternal
497
+ ? { mode: 'internal', baseUrl: endpoint }
498
+ : { mode: 'test', capture: true },
499
+ batch: {
500
+ ...DEFAULT_PIXEL_CONFIG.transport.batch,
501
+ enabled: true,
502
+ batchSize: batchSize,
503
+ maxWaitMs: batchMode === 'batch' ? 8000 : 500,
504
+ },
505
+ flush: {
506
+ ...DEFAULT_PIXEL_CONFIG.transport.flush,
507
+ flushOnDestroy: true,
508
+ },
509
+ timeout: {
510
+ ...DEFAULT_PIXEL_CONFIG.transport.timeout,
511
+ timeoutMs: 15000,
512
+ },
513
+ coordination: { enabled: false },
514
+ },
515
+ commerce: {
516
+ enabled: true,
517
+ currency: 'BRL',
518
+ catalog: {
519
+ products: [
520
+ {
521
+ id: 'main_offer',
522
+ name: 'Oferta Principal RC',
523
+ type: 'main',
524
+ price: 197,
525
+ currency: 'BRL',
526
+ quantity: 1,
527
+ },
528
+ {
529
+ id: 'order_bump_01',
530
+ name: 'Order Bump RC',
531
+ type: 'order_bump',
532
+ price: 47,
533
+ currency: 'BRL',
534
+ quantity: 1,
535
+ },
536
+ ],
537
+ },
538
+ cart: {
539
+ mode: 'single_product',
540
+ initialItems: [{ productId: 'main_offer', quantity: 1 }],
541
+ calculateValueFrom: 'cart',
542
+ allowDynamicItems: true,
543
+ },
544
+ enrichment: {
545
+ pageView: { enabled: false, source: 'cart' },
546
+ viewContent: { enabled: true, source: 'event_or_cart' },
547
+ lead: { enabled: false, source: 'event_or_cart' },
548
+ addToCart: { enabled: true, source: 'event_or_cart' },
549
+ removeFromCart: { enabled: true, source: 'event_or_cart' },
550
+ initiateCheckout: { enabled: true, source: 'cart' },
551
+ addPaymentInfo: { enabled: true, source: 'cart' },
552
+ purchase: { enabled: true, source: 'cart' },
553
+ }
554
+ },
555
+ modules: {
556
+ ...DEFAULT_PIXEL_CONFIG.modules,
557
+ privacy: { ...DEFAULT_PIXEL_CONFIG.modules.privacy, enabled: false },
558
+ behavior: { ...DEFAULT_PIXEL_CONFIG.modules.behavior, enabled: false },
559
+ integrations: {
560
+ ...DEFAULT_PIXEL_CONFIG.modules.integrations,
561
+ enabled: false,
562
+ },
563
+ core: {
564
+ ...DEFAULT_PIXEL_CONFIG.modules.core,
565
+ enabled: true,
566
+ pageView: {
567
+ ...DEFAULT_PIXEL_CONFIG.modules.core.pageView,
568
+ enabled: true,
569
+ trackInitialPageView: true,
570
+ spa: false,
571
+ },
572
+ },
573
+ conversion: {
574
+ ...DEFAULT_PIXEL_CONFIG.modules.conversion,
575
+ enabled: true,
576
+ manual: {
577
+ pageView: { enabled: false },
578
+ purchase: { enabled: true },
579
+ lead: { enabled: true },
580
+ addToCart: { enabled: true },
581
+ removeFromCart: { enabled: true },
582
+ initiateCheckout: { enabled: true },
583
+ addPaymentInfo: { enabled: true },
584
+ search: { enabled: true },
585
+ viewContent: { enabled: true },
586
+ },
587
+ auto: {
588
+ enabled: true,
589
+ detectors: {
590
+ lead: {
591
+ enabled: true,
592
+ sources: [
593
+ {
594
+ name: 'lead-form',
595
+ type: 'form',
596
+ selector: '#lead-email, #lead-phone',
597
+ selectorType: 'css',
598
+ selectorForm: {
599
+ fields: ['email', 'phone'],
600
+ mode: 'any',
601
+ trigger: 'auto',
602
+ fireOnce: true,
603
+ minRequired: 1,
604
+ },
605
+ },
606
+ ],
607
+ },
608
+ addToCart: {
609
+ enabled: true,
610
+ sources: [
611
+ {
612
+ name: 'main-product-after-contact',
613
+ type: 'form',
614
+ selectorForm: {
615
+ fields: ['email', 'phone'],
616
+ mode: 'all',
617
+ formSelector: '#checkout-form',
618
+ trigger: 'input',
619
+ debounceMs: 300,
620
+ fireOnce: true,
621
+ },
622
+ },
623
+ {
624
+ name: 'product-or-bump-click',
625
+ type: 'selector',
626
+ selector: ['[data-track="add_to_cart"]', 'text:Comprar agora'],
627
+ selectorType: 'css',
628
+ trigger: 'click',
629
+ fireOnce: false,
630
+ },
631
+ ],
632
+ },
633
+ initiateCheckout: {
634
+ enabled: true,
635
+ sources: [
636
+ {
637
+ name: 'checkout-loaded',
638
+ type: 'lifecycle',
639
+ trigger: 'ready',
640
+ fireOnce: true,
641
+ },
642
+ {
643
+ name: 'checkout-form-submit',
644
+ type: 'form',
645
+ selector: ['#checkout-form', '[data-track="initiate_checkout"]'],
646
+ selectorType: 'css',
647
+ selectorForm: {
648
+ fields: ['email', 'phone'],
649
+ mode: 'all',
650
+ formSelector: '#checkout-form',
651
+ trigger: 'submit',
652
+ fireOnce: false,
653
+ minRequired: 2,
654
+ },
655
+ },
656
+ ],
657
+ },
658
+ purchase: { enabled: false, sources: [] },
659
+ removeFromCart: { enabled: false, sources: [] },
660
+ addPaymentInfo: {
661
+ enabled: true,
662
+ sources: [
663
+ {
664
+ name: 'credit-card-detection',
665
+ type: 'payment',
666
+ formSelector: '#checkout-form',
667
+ cardDetection: true,
668
+ autoDispatch: true,
669
+ fireOnce: true,
670
+ paymentMethod: 'CREDIT_CARD',
671
+ },
672
+ ],
673
+ },
674
+ search: { enabled: false, sources: [] },
675
+ viewContent: { enabled: false, sources: [] },
676
+ },
677
+ },
678
+ rules: {
679
+ ...DEFAULT_PIXEL_CONFIG.modules.conversion.rules,
680
+ enabled: false,
681
+ },
682
+ },
683
+ },
684
+ };
685
+ }
686
+
687
+ async function destroyPixel() {
688
+ if (unsubscribe) {
689
+ unsubscribe();
690
+ unsubscribe = null;
691
+ }
692
+ if (pixel) {
693
+ await pixel.destroy();
694
+ destroyCount += 1;
695
+ pixel = null;
696
+ }
697
+ renderRuntime();
698
+ appendLog('destroy()');
699
+ }
700
+
701
+ async function initPixel() {
702
+ if (!hasPixelV2()) {
703
+ throw new Error('window.PixelV2 ausente — rode npm run build');
704
+ }
705
+ saveConn();
706
+ await destroyPixel();
707
+
708
+ Object.keys(counts).forEach(function (k) { delete counts[k]; });
709
+ lastEvent = null;
710
+ lastPayloadEl.textContent = '—';
711
+ renderCounts();
712
+
713
+ var Pixel = window.PixelV2.Pixel;
714
+ pixel = new Pixel(buildConfig());
715
+ await pixel.init();
716
+ if (document.getElementById('sender-mode').value === 'test') {
717
+ pixel.configureTransportTestSender({
718
+ capture: true,
719
+ response: 'success',
720
+ delayMs: 0,
721
+ });
722
+ }
723
+ initCount += 1;
724
+
725
+ var services = pixel.getDebugServices();
726
+ if (services) {
727
+ unsubscribe = services.dispatcher.subscribe(function (event) {
728
+ bump(event.type);
729
+ lastEvent = event;
730
+ lastPayloadEl.textContent = JSON.stringify(event, null, 2);
731
+ appendLog('dispatch ' + event.type);
732
+ renderRuntime();
733
+ });
734
+ }
735
+
736
+ // PAGE_VIEW do Core dispara durante init (antes do subscribe do painel).
737
+ // Contabiliza via transport sentCount / log explícito.
738
+ appendLog(
739
+ 'init ok · PAGE_VIEW inicial pode já ter sido enviado (ver Transport)'
740
+ );
741
+
742
+ appendLog(
743
+ 'init ok · sender=' +
744
+ document.getElementById('sender-mode').value +
745
+ ' · batch=' +
746
+ document.getElementById('batch-mode').value
747
+ );
748
+ renderRuntime();
749
+ }
750
+
751
+ // UI bindings
752
+ document.getElementById('btn-init').onclick = function () {
753
+ initPixel().catch(function (err) {
754
+ appendLog('ERR ' + err.message);
755
+ alert(err.message);
756
+ });
757
+ };
758
+ document.getElementById('btn-reinit').onclick = function () {
759
+ initPixel().catch(function (err) {
760
+ appendLog('ERR ' + err.message);
761
+ alert(err.message);
762
+ });
763
+ };
764
+ document.getElementById('btn-destroy').onclick = function () {
765
+ destroyPixel();
766
+ };
767
+ document.getElementById('btn-flush').onclick = function () {
768
+ if (pixel && pixel.flushTransport) {
769
+ pixel.flushTransport();
770
+ appendLog('flushTransport()');
771
+ setTimeout(renderTransport, 300);
772
+ setTimeout(renderTransport, 1200);
773
+ }
774
+ };
775
+ document.getElementById('btn-clear').onclick = function () {
776
+ logsEl.textContent = '';
777
+ };
778
+
779
+ document.getElementById('btn-lead').onclick = function () {
780
+ if (!pixel) return;
781
+ pixel.lead({
782
+ email: 'rc+manual@example.com',
783
+ phone: '+5500000000000',
784
+ });
785
+ };
786
+ document.getElementById('btn-atc').onclick = function () {
787
+ if (!pixel) return;
788
+ pixel.addToCart({ productId: 'main_offer' });
789
+ };
790
+ document.getElementById('btn-rfc').onclick = function () {
791
+ if (!pixel) return;
792
+ pixel.removeFromCart({ productId: 'main_offer', quantity: 1 });
793
+ };
794
+ document.getElementById('btn-ic').onclick = function () {
795
+ if (!pixel) return;
796
+ pixel.initiateCheckout({});
797
+ };
798
+ document.getElementById('btn-purchase').onclick = function () {
799
+ if (!pixel) return;
800
+ pixel.purchase({
801
+ orderId: 'rc_order_' + Date.now(),
802
+ value: 197,
803
+ currency: 'BRL',
804
+ });
805
+ };
806
+
807
+ document.getElementById('checkout-form').addEventListener('submit', function (e) {
808
+ e.preventDefault();
809
+ appendLog('checkout-form submit (preventDefault playground)');
810
+ });
811
+
812
+ // Boot
813
+ if (hasPixelV2()) {
814
+ pixelv2Pill.textContent = 'PixelV2 OK';
815
+ pixelv2Pill.className = 'pill ok';
816
+ appendLog('window.PixelV2 detectado');
817
+ } else {
818
+ pixelv2Pill.textContent = 'PixelV2 MISSING';
819
+ pixelv2Pill.className = 'pill bad';
820
+ appendLog('ERRO: window.PixelV2 ausente — npm run build');
821
+ }
822
+ renderRuntime();
823
+ })();
824
+ </script>
825
+ </body>
826
+ </html>