@npmtapi/embed 1.1.0 → 1.3.0

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.
package/README.md CHANGED
@@ -94,10 +94,15 @@ export function PagoPage({ clienteId }: { clienteId: string }) {
94
94
  | `identifier` | `string` | Sí | — | Identificador del cliente |
95
95
  | `externalRequestId` | `string` | No | — | ID de deuda a preseleccionar. Tiene precedencia sobre `selectionStrategy` |
96
96
  | `selectionStrategy` | `"oldestCreated"` | No | más reciente | Estrategia de selección automática de deuda pendiente. `"oldestCreated"`: la más antigua. Por defecto (omitido): la más reciente |
97
+ | `view` | `'payments' \| 'autopay'` | No | `'payments'` | Vista a montar. `'autopay'` muestra la gestión de adhesiones (ver domiciliación + desadherirse) |
97
98
  | `environment` | `'production' \| 'homo'` | No | `'production'` | Entorno del SDK |
98
99
  | `onPaymentWindowOpened` | `() => void` | No | — | Callback cuando el popup de Yuno se abre exitosamente |
99
100
  | `onPaymentSubmitted` | `(data) => void` | No | — | Callback cuando el usuario completó el formulario de Yuno y fue redirigido al callback |
100
101
  | `onCancelled` | `() => void` | No | — | Callback cuando el usuario cierra el popup sin completar el pago |
102
+ | `onAutopayLoaded` | `(data) => void` | No | — | (Vista autopay) Callback con las adhesiones activas; se reinvoca cuando la lista cambia |
103
+ | `onAutopayActivated` | `(data) => void` | No | — | (Vista autopay) Callback cuando una nueva domiciliación queda activa (una sola vez por adhesión nueva) |
104
+ | `onAutopayRemoved` | `(data) => void` | No | — | (Vista autopay) Callback cuando el usuario desadhiere un medio con éxito |
105
+ | `onAutopayError` | `(data) => void` | No | — | (Vista autopay) Callback ante un error de carga o de desadhesión |
101
106
  | `className` | `string` | No | — | Clases CSS del contenedor |
102
107
  | `style` | `CSSProperties` | No | — | Estilos inline del contenedor |
103
108
 
@@ -206,6 +211,7 @@ export class TapipayWidgetComponent implements OnInit, OnDestroy {
206
211
  | `identifier` | `string` | Sí | — | Identificador del cliente (DNI, número de cuenta, etc.) |
207
212
  | `externalRequestId` | `string` | No | — | ID externo de una deuda específica a preseleccionar. Tiene precedencia sobre `selectionStrategy` |
208
213
  | `selectionStrategy` | `"oldestCreated"` | No | más reciente | Estrategia de selección automática de deuda pendiente. `"oldestCreated"`: la más antigua. Por defecto (omitido): la más reciente |
214
+ | `view` | `'payments' \| 'autopay'` | No | `'payments'` | Vista a montar. `'autopay'` muestra la gestión de adhesiones |
209
215
 
210
216
  ---
211
217
 
@@ -261,6 +267,97 @@ interface TapipayPaymentCancelledEvent {
261
267
 
262
268
  ---
263
269
 
270
+ ## Vista de gestión de adhesiones (autopay)
271
+
272
+ Pasando `view: "autopay"` el widget monta la **gestión de adhesiones**: el usuario final ve su domiciliación (tarjeta o cuenta CLABE/bancaria) y puede desadherirse, sin entrar al portal completo.
273
+
274
+ > **Privacidad.** Los eventos de autopay exponen **solo lo mínimo**: el tipo de medio (`mediaType`) y los últimos 4 dígitos (`lastFour`). El `id` es un hash opaco del identificador interno. **Nunca** se exponen titular, número/CLABE completos, marca, banco ni tokens.
275
+
276
+ ### Script tag
277
+
278
+ ```html
279
+ <script src="https://app.tapipay.la/embed.js"></script>
280
+ <div id="autopay"></div>
281
+ <script>
282
+ tapipay.initialize({
283
+ container: "#autopay",
284
+ organization: "acme",
285
+ identifier: "CLI-001",
286
+ view: "autopay"
287
+ });
288
+
289
+ tapipay.on("autopayLoaded", function(data) {
290
+ console.log("Adhesiones activas:", data.count);
291
+ });
292
+ tapipay.on("autopayActivated", function(data) {
293
+ console.log("Nueva adhesión activa:", data.mediaType, data.lastFour);
294
+ });
295
+ tapipay.on("autopayRemoved", function(data) {
296
+ console.log("Medio desadherido:", data.mediaType, data.lastFour);
297
+ });
298
+ tapipay.on("autopayError", function(data) {
299
+ console.log("Error de autopay:", data.stage, data.message);
300
+ });
301
+ </script>
302
+ ```
303
+
304
+ ### React
305
+
306
+ ```tsx
307
+ import { TapipayWidget } from "@npmtapi/embed/react";
308
+
309
+ export function AdhesionesPage({ clienteId }: { clienteId: string }) {
310
+ return (
311
+ <TapipayWidget
312
+ view="autopay"
313
+ organization="acme"
314
+ identifier={clienteId}
315
+ onAutopayLoaded={(data) => console.log("Adhesiones activas:", data.count)}
316
+ onAutopayActivated={(data) => console.log("Nueva adhesión activa:", data.mediaType)}
317
+ onAutopayRemoved={(data) => console.log("Desadherido:", data.mediaType)}
318
+ onAutopayError={(data) => console.log("Error:", data.stage)}
319
+ />
320
+ );
321
+ }
322
+ ```
323
+
324
+ ### Eventos de autopay
325
+
326
+ ```ts
327
+ interface TapipayAutopayLoadedEvent {
328
+ count: number; // adhesiones activas
329
+ mediaTypes: Array<"card" | "bank_account">; // tipos presentes (sin duplicados)
330
+ adhesions: Array<{
331
+ id: string; // hash opaco
332
+ mediaType: "card" | "bank_account";
333
+ lastFour: string | null; // últimos 4 dígitos
334
+ }>;
335
+ }
336
+
337
+ interface TapipayAutopayActivatedEvent {
338
+ id: string; // hash opaco
339
+ mediaType: "card" | "bank_account";
340
+ lastFour: string | null; // últimos 4 dígitos
341
+ }
342
+
343
+ interface TapipayAutopayRemovedEvent {
344
+ id: string;
345
+ mediaType: "card" | "bank_account";
346
+ lastFour: string | null;
347
+ }
348
+
349
+ interface TapipayAutopayErrorEvent {
350
+ stage: "load" | "remove";
351
+ message: string; // neutral, sin PII
352
+ }
353
+ ```
354
+
355
+ > `autopayLoaded` se dispara al cargar y **cada vez que la lista de adhesiones cambia** (tras una desadhesión, refetch o polling), así que el host puede mantener su conteo consumiendo siempre el último `payload`.
356
+
357
+ > `autopayActivated` se dispara **una sola vez por adhesión nueva**, cuando una nueva domiciliación queda activa. A diferencia de `autopayLoaded`, no se repite en refetch ni polling.
358
+
359
+ ---
360
+
264
361
  ## Entorno de homologación
265
362
 
266
363
  Para apuntar al entorno de homologación en lugar de producción:
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/loader.ts"],"sourcesContent":["export { loadTapipay } from \"./loader\";\nexport type {\n\tLoadTapipayOptions,\n\tTapipayEnvironment,\n\tTapipayInstance,\n\tTapipayOptions,\n\tTapipayPaymentCancelledEvent,\n\tTapipayPaymentSubmittedEvent,\n\tTapipayPaymentWindowOpenedEvent,\n} from \"./types\";\n","import type {\n\tLoadTapipayOptions,\n\tTapipayEnvironment,\n\tTapipayInstance,\n} from \"./types\";\n\nconst SDK_URLS: Record<TapipayEnvironment, string> = {\n\tproduction: \"https://app.tapipay.la/embed.js\",\n\thomo: \"https://homo.tapipay.la/embed.js\",\n};\n\n// Idempotencia por entorno\nconst loadPromises = new Map<TapipayEnvironment, Promise<TapipayInstance>>();\n\n/**\n * Carga el SDK de TapiPay de forma asíncrona inyectando el script en el DOM.\n *\n * - Idempotente por entorno: múltiples llamadas con el mismo `environment` retornan la misma Promise.\n * - Si window.tapipay ya existe (script cargado sync), resuelve inmediatamente.\n * - Compatible con React Strict Mode (doble mount/unmount).\n *\n * @example\n * // Producción (default)\n * const tapipay = await loadTapipay();\n *\n * // Homologación\n * const tapipay = await loadTapipay({ environment: 'homo' });\n *\n * tapipay.initialize({ container: \"#widget\", organization: \"acme\", identifier: \"CLI-001\" });\n */\nexport function loadTapipay(\n\toptions?: LoadTapipayOptions,\n): Promise<TapipayInstance> {\n\tconst env: TapipayEnvironment = options?.environment ?? \"production\";\n\tconst SDK_URL = SDK_URLS[env];\n\tconst SCRIPT_ID = `tapipay-embed-sdk-${env}`;\n\n\t// SSR guard\n\tif (typeof window === \"undefined\") {\n\t\treturn Promise.reject(\n\t\t\tnew Error(\"[TapiPay] loadTapipay() requires a browser environment.\"),\n\t\t);\n\t}\n\n\t// Ya cargado de forma síncrona (script tag directo)\n\tif (window.tapipay && !window.tapipay._q) {\n\t\treturn Promise.resolve(window.tapipay);\n\t}\n\n\t// Reutilizar promise existente (idempotencia por entorno)\n\tconst existing = loadPromises.get(env);\n\tif (existing) return existing;\n\n\tconst promise = new Promise<TapipayInstance>((resolve, reject) => {\n\t\t// Si ya hay un script inyectado, esperar a que cargue\n\t\tconst existingScript = document.getElementById(\n\t\t\tSCRIPT_ID,\n\t\t) as HTMLScriptElement | null;\n\n\t\tconst onLoad = () => {\n\t\t\tif (window.tapipay) {\n\t\t\t\tresolve(window.tapipay);\n\t\t\t} else {\n\t\t\t\treject(\n\t\t\t\t\tnew Error(\n\t\t\t\t\t\t\"[TapiPay] El script cargó pero window.tapipay no está definido.\",\n\t\t\t\t\t),\n\t\t\t\t);\n\t\t\t}\n\t\t};\n\n\t\tconst onError = () => {\n\t\t\tloadPromises.delete(env);\n\t\t\treject(new Error(`[TapiPay] Error al cargar el SDK desde ${SDK_URL}`));\n\t\t};\n\n\t\tif (existingScript) {\n\t\t\texistingScript.addEventListener(\"load\", onLoad);\n\t\t\texistingScript.addEventListener(\"error\", onError);\n\t\t\treturn;\n\t\t}\n\n\t\tconst script = document.createElement(\"script\");\n\t\tscript.id = SCRIPT_ID;\n\t\tscript.src = SDK_URL;\n\t\tscript.async = true;\n\t\tscript.addEventListener(\"load\", onLoad);\n\t\tscript.addEventListener(\"error\", onError);\n\t\tdocument.head.appendChild(script);\n\t});\n\n\tloadPromises.set(env, promise);\n\treturn promise;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACMA,IAAM,WAA+C;AAAA,EACpD,YAAY;AAAA,EACZ,MAAM;AACP;AAGA,IAAM,eAAe,oBAAI,IAAkD;AAkBpE,SAAS,YACf,SAC2B;AAhC5B;AAiCC,QAAM,OAA0B,wCAAS,gBAAT,YAAwB;AACxD,QAAM,UAAU,SAAS,GAAG;AAC5B,QAAM,YAAY,qBAAqB,GAAG;AAG1C,MAAI,OAAO,WAAW,aAAa;AAClC,WAAO,QAAQ;AAAA,MACd,IAAI,MAAM,yDAAyD;AAAA,IACpE;AAAA,EACD;AAGA,MAAI,OAAO,WAAW,CAAC,OAAO,QAAQ,IAAI;AACzC,WAAO,QAAQ,QAAQ,OAAO,OAAO;AAAA,EACtC;AAGA,QAAM,WAAW,aAAa,IAAI,GAAG;AACrC,MAAI,SAAU,QAAO;AAErB,QAAM,UAAU,IAAI,QAAyB,CAAC,SAAS,WAAW;AAEjE,UAAM,iBAAiB,SAAS;AAAA,MAC/B;AAAA,IACD;AAEA,UAAM,SAAS,MAAM;AACpB,UAAI,OAAO,SAAS;AACnB,gBAAQ,OAAO,OAAO;AAAA,MACvB,OAAO;AACN;AAAA,UACC,IAAI;AAAA,YACH;AAAA,UACD;AAAA,QACD;AAAA,MACD;AAAA,IACD;AAEA,UAAM,UAAU,MAAM;AACrB,mBAAa,OAAO,GAAG;AACvB,aAAO,IAAI,MAAM,0CAA0C,OAAO,EAAE,CAAC;AAAA,IACtE;AAEA,QAAI,gBAAgB;AACnB,qBAAe,iBAAiB,QAAQ,MAAM;AAC9C,qBAAe,iBAAiB,SAAS,OAAO;AAChD;AAAA,IACD;AAEA,UAAM,SAAS,SAAS,cAAc,QAAQ;AAC9C,WAAO,KAAK;AACZ,WAAO,MAAM;AACb,WAAO,QAAQ;AACf,WAAO,iBAAiB,QAAQ,MAAM;AACtC,WAAO,iBAAiB,SAAS,OAAO;AACxC,aAAS,KAAK,YAAY,MAAM;AAAA,EACjC,CAAC;AAED,eAAa,IAAI,KAAK,OAAO;AAC7B,SAAO;AACR;","names":[]}
1
+ {"version":3,"sources":["../src/index.ts","../src/loader.ts"],"sourcesContent":["export { loadTapipay } from \"./loader\";\nexport type {\n\tLoadTapipayOptions,\n\tTapipayAutopayActivatedEvent,\n\tTapipayAutopayAdhesionSummary,\n\tTapipayAutopayErrorEvent,\n\tTapipayAutopayLoadedEvent,\n\tTapipayAutopayMediaType,\n\tTapipayAutopayRemovedEvent,\n\tTapipayEnvironment,\n\tTapipayInstance,\n\tTapipayOptions,\n\tTapipayPaymentCancelledEvent,\n\tTapipayPaymentSubmittedEvent,\n\tTapipayPaymentWindowOpenedEvent,\n\tTapipayView,\n} from \"./types\";\n","import type {\n\tLoadTapipayOptions,\n\tTapipayEnvironment,\n\tTapipayInstance,\n} from \"./types\";\n\nconst SDK_URLS: Record<TapipayEnvironment, string> = {\n\tproduction: \"https://app.tapipay.la/embed.js\",\n\thomo: \"https://homo.tapipay.la/embed.js\",\n};\n\n// Idempotencia por entorno\nconst loadPromises = new Map<TapipayEnvironment, Promise<TapipayInstance>>();\n\n/**\n * Carga el SDK de TapiPay de forma asíncrona inyectando el script en el DOM.\n *\n * - Idempotente por entorno: múltiples llamadas con el mismo `environment` retornan la misma Promise.\n * - Si window.tapipay ya existe (script cargado sync), resuelve inmediatamente.\n * - Compatible con React Strict Mode (doble mount/unmount).\n *\n * @example\n * // Producción (default)\n * const tapipay = await loadTapipay();\n *\n * // Homologación\n * const tapipay = await loadTapipay({ environment: 'homo' });\n *\n * tapipay.initialize({ container: \"#widget\", organization: \"acme\", identifier: \"CLI-001\" });\n */\nexport function loadTapipay(\n\toptions?: LoadTapipayOptions,\n): Promise<TapipayInstance> {\n\tconst env: TapipayEnvironment = options?.environment ?? \"production\";\n\tconst SDK_URL = SDK_URLS[env];\n\tconst SCRIPT_ID = `tapipay-embed-sdk-${env}`;\n\n\t// SSR guard\n\tif (typeof window === \"undefined\") {\n\t\treturn Promise.reject(\n\t\t\tnew Error(\"[TapiPay] loadTapipay() requires a browser environment.\"),\n\t\t);\n\t}\n\n\t// Ya cargado de forma síncrona (script tag directo)\n\tif (window.tapipay && !window.tapipay._q) {\n\t\treturn Promise.resolve(window.tapipay);\n\t}\n\n\t// Reutilizar promise existente (idempotencia por entorno)\n\tconst existing = loadPromises.get(env);\n\tif (existing) return existing;\n\n\tconst promise = new Promise<TapipayInstance>((resolve, reject) => {\n\t\t// Si ya hay un script inyectado, esperar a que cargue\n\t\tconst existingScript = document.getElementById(\n\t\t\tSCRIPT_ID,\n\t\t) as HTMLScriptElement | null;\n\n\t\tconst onLoad = () => {\n\t\t\tif (window.tapipay) {\n\t\t\t\tresolve(window.tapipay);\n\t\t\t} else {\n\t\t\t\treject(\n\t\t\t\t\tnew Error(\n\t\t\t\t\t\t\"[TapiPay] El script cargó pero window.tapipay no está definido.\",\n\t\t\t\t\t),\n\t\t\t\t);\n\t\t\t}\n\t\t};\n\n\t\tconst onError = () => {\n\t\t\tloadPromises.delete(env);\n\t\t\treject(new Error(`[TapiPay] Error al cargar el SDK desde ${SDK_URL}`));\n\t\t};\n\n\t\tif (existingScript) {\n\t\t\texistingScript.addEventListener(\"load\", onLoad);\n\t\t\texistingScript.addEventListener(\"error\", onError);\n\t\t\treturn;\n\t\t}\n\n\t\tconst script = document.createElement(\"script\");\n\t\tscript.id = SCRIPT_ID;\n\t\tscript.src = SDK_URL;\n\t\tscript.async = true;\n\t\tscript.addEventListener(\"load\", onLoad);\n\t\tscript.addEventListener(\"error\", onError);\n\t\tdocument.head.appendChild(script);\n\t});\n\n\tloadPromises.set(env, promise);\n\treturn promise;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACMA,IAAM,WAA+C;AAAA,EACpD,YAAY;AAAA,EACZ,MAAM;AACP;AAGA,IAAM,eAAe,oBAAI,IAAkD;AAkBpE,SAAS,YACf,SAC2B;AAhC5B;AAiCC,QAAM,OAA0B,wCAAS,gBAAT,YAAwB;AACxD,QAAM,UAAU,SAAS,GAAG;AAC5B,QAAM,YAAY,qBAAqB,GAAG;AAG1C,MAAI,OAAO,WAAW,aAAa;AAClC,WAAO,QAAQ;AAAA,MACd,IAAI,MAAM,yDAAyD;AAAA,IACpE;AAAA,EACD;AAGA,MAAI,OAAO,WAAW,CAAC,OAAO,QAAQ,IAAI;AACzC,WAAO,QAAQ,QAAQ,OAAO,OAAO;AAAA,EACtC;AAGA,QAAM,WAAW,aAAa,IAAI,GAAG;AACrC,MAAI,SAAU,QAAO;AAErB,QAAM,UAAU,IAAI,QAAyB,CAAC,SAAS,WAAW;AAEjE,UAAM,iBAAiB,SAAS;AAAA,MAC/B;AAAA,IACD;AAEA,UAAM,SAAS,MAAM;AACpB,UAAI,OAAO,SAAS;AACnB,gBAAQ,OAAO,OAAO;AAAA,MACvB,OAAO;AACN;AAAA,UACC,IAAI;AAAA,YACH;AAAA,UACD;AAAA,QACD;AAAA,MACD;AAAA,IACD;AAEA,UAAM,UAAU,MAAM;AACrB,mBAAa,OAAO,GAAG;AACvB,aAAO,IAAI,MAAM,0CAA0C,OAAO,EAAE,CAAC;AAAA,IACtE;AAEA,QAAI,gBAAgB;AACnB,qBAAe,iBAAiB,QAAQ,MAAM;AAC9C,qBAAe,iBAAiB,SAAS,OAAO;AAChD;AAAA,IACD;AAEA,UAAM,SAAS,SAAS,cAAc,QAAQ;AAC9C,WAAO,KAAK;AACZ,WAAO,MAAM;AACb,WAAO,QAAQ;AACf,WAAO,iBAAiB,QAAQ,MAAM;AACtC,WAAO,iBAAiB,SAAS,OAAO;AACxC,aAAS,KAAK,YAAY,MAAM;AAAA,EACjC,CAAC;AAED,eAAa,IAAI,KAAK,OAAO;AAC7B,SAAO;AACR;","names":[]}
package/dist/index.d.cts CHANGED
@@ -1,5 +1,5 @@
1
- import { L as LoadTapipayOptions, T as TapipayInstance } from './types-DYcwsDwH.cjs';
2
- export { a as TapipayEnvironment, b as TapipayOptions, c as TapipayPaymentCancelledEvent, d as TapipayPaymentSubmittedEvent, e as TapipayPaymentWindowOpenedEvent } from './types-DYcwsDwH.cjs';
1
+ import { L as LoadTapipayOptions, T as TapipayInstance } from './types-BIb8B1hp.cjs';
2
+ export { a as TapipayAutopayActivatedEvent, b as TapipayAutopayAdhesionSummary, c as TapipayAutopayErrorEvent, d as TapipayAutopayLoadedEvent, e as TapipayAutopayMediaType, f as TapipayAutopayRemovedEvent, g as TapipayEnvironment, h as TapipayOptions, i as TapipayPaymentCancelledEvent, j as TapipayPaymentSubmittedEvent, k as TapipayPaymentWindowOpenedEvent, l as TapipayView } from './types-BIb8B1hp.cjs';
3
3
 
4
4
  /**
5
5
  * Carga el SDK de TapiPay de forma asíncrona inyectando el script en el DOM.
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import { L as LoadTapipayOptions, T as TapipayInstance } from './types-DYcwsDwH.js';
2
- export { a as TapipayEnvironment, b as TapipayOptions, c as TapipayPaymentCancelledEvent, d as TapipayPaymentSubmittedEvent, e as TapipayPaymentWindowOpenedEvent } from './types-DYcwsDwH.js';
1
+ import { L as LoadTapipayOptions, T as TapipayInstance } from './types-BIb8B1hp.js';
2
+ export { a as TapipayAutopayActivatedEvent, b as TapipayAutopayAdhesionSummary, c as TapipayAutopayErrorEvent, d as TapipayAutopayLoadedEvent, e as TapipayAutopayMediaType, f as TapipayAutopayRemovedEvent, g as TapipayEnvironment, h as TapipayOptions, i as TapipayPaymentCancelledEvent, j as TapipayPaymentSubmittedEvent, k as TapipayPaymentWindowOpenedEvent, l as TapipayView } from './types-BIb8B1hp.js';
3
3
 
4
4
  /**
5
5
  * Carga el SDK de TapiPay de forma asíncrona inyectando el script en el DOM.
package/dist/react.cjs CHANGED
@@ -107,10 +107,15 @@ function TapipayWidget({
107
107
  identifier,
108
108
  externalRequestId,
109
109
  selectionStrategy,
110
+ view,
110
111
  environment,
111
112
  onPaymentWindowOpened,
112
113
  onPaymentSubmitted,
113
114
  onCancelled,
115
+ onAutopayLoaded,
116
+ onAutopayActivated,
117
+ onAutopayRemoved,
118
+ onAutopayError,
114
119
  className,
115
120
  style
116
121
  }) {
@@ -118,6 +123,10 @@ function TapipayWidget({
118
123
  const onPaymentWindowOpenedRef = (0, import_react.useRef)(onPaymentWindowOpened);
119
124
  const onPaymentSubmittedRef = (0, import_react.useRef)(onPaymentSubmitted);
120
125
  const onCancelledRef = (0, import_react.useRef)(onCancelled);
126
+ const onAutopayLoadedRef = (0, import_react.useRef)(onAutopayLoaded);
127
+ const onAutopayActivatedRef = (0, import_react.useRef)(onAutopayActivated);
128
+ const onAutopayRemovedRef = (0, import_react.useRef)(onAutopayRemoved);
129
+ const onAutopayErrorRef = (0, import_react.useRef)(onAutopayError);
121
130
  (0, import_react.useEffect)(() => {
122
131
  onPaymentWindowOpenedRef.current = onPaymentWindowOpened;
123
132
  }, [onPaymentWindowOpened]);
@@ -127,6 +136,18 @@ function TapipayWidget({
127
136
  (0, import_react.useEffect)(() => {
128
137
  onCancelledRef.current = onCancelled;
129
138
  }, [onCancelled]);
139
+ (0, import_react.useEffect)(() => {
140
+ onAutopayLoadedRef.current = onAutopayLoaded;
141
+ }, [onAutopayLoaded]);
142
+ (0, import_react.useEffect)(() => {
143
+ onAutopayActivatedRef.current = onAutopayActivated;
144
+ }, [onAutopayActivated]);
145
+ (0, import_react.useEffect)(() => {
146
+ onAutopayRemovedRef.current = onAutopayRemoved;
147
+ }, [onAutopayRemoved]);
148
+ (0, import_react.useEffect)(() => {
149
+ onAutopayErrorRef.current = onAutopayError;
150
+ }, [onAutopayError]);
130
151
  (0, import_react.useEffect)(() => {
131
152
  if (!containerRef.current) return;
132
153
  const container = containerRef.current;
@@ -144,18 +165,39 @@ function TapipayWidget({
144
165
  var _a;
145
166
  (_a = onCancelledRef.current) == null ? void 0 : _a.call(onCancelledRef, data);
146
167
  };
168
+ const handleAutopayLoaded = (data) => {
169
+ var _a;
170
+ (_a = onAutopayLoadedRef.current) == null ? void 0 : _a.call(onAutopayLoadedRef, data);
171
+ };
172
+ const handleAutopayActivated = (data) => {
173
+ var _a;
174
+ (_a = onAutopayActivatedRef.current) == null ? void 0 : _a.call(onAutopayActivatedRef, data);
175
+ };
176
+ const handleAutopayRemoved = (data) => {
177
+ var _a;
178
+ (_a = onAutopayRemovedRef.current) == null ? void 0 : _a.call(onAutopayRemovedRef, data);
179
+ };
180
+ const handleAutopayError = (data) => {
181
+ var _a;
182
+ (_a = onAutopayErrorRef.current) == null ? void 0 : _a.call(onAutopayErrorRef, data);
183
+ };
147
184
  loadTapipay({ environment }).then((instance) => {
148
185
  if (cancelled) return;
149
186
  tapipayInstance = instance;
150
187
  instance.on("paymentWindowOpened", handlePaymentWindowOpened);
151
188
  instance.on("paymentSubmitted", handlePaymentSubmitted);
152
189
  instance.on("paymentCancelled", handleCancelled);
190
+ instance.on("autopayLoaded", handleAutopayLoaded);
191
+ instance.on("autopayActivated", handleAutopayActivated);
192
+ instance.on("autopayRemoved", handleAutopayRemoved);
193
+ instance.on("autopayError", handleAutopayError);
153
194
  instance.initialize({
154
195
  container,
155
196
  organization,
156
197
  identifier,
157
198
  externalRequestId,
158
- selectionStrategy
199
+ selectionStrategy,
200
+ view
159
201
  });
160
202
  });
161
203
  return () => {
@@ -164,6 +206,10 @@ function TapipayWidget({
164
206
  tapipayInstance.off("paymentWindowOpened", handlePaymentWindowOpened);
165
207
  tapipayInstance.off("paymentSubmitted", handlePaymentSubmitted);
166
208
  tapipayInstance.off("paymentCancelled", handleCancelled);
209
+ tapipayInstance.off("autopayLoaded", handleAutopayLoaded);
210
+ tapipayInstance.off("autopayActivated", handleAutopayActivated);
211
+ tapipayInstance.off("autopayRemoved", handleAutopayRemoved);
212
+ tapipayInstance.off("autopayError", handleAutopayError);
167
213
  tapipayInstance.destroy(container);
168
214
  }
169
215
  };
@@ -172,6 +218,7 @@ function TapipayWidget({
172
218
  identifier,
173
219
  externalRequestId,
174
220
  selectionStrategy,
221
+ view,
175
222
  environment
176
223
  ]);
177
224
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref: containerRef, className, style });
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/react.tsx","../src/loader.ts"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { loadTapipay } from \"./loader\";\nimport type {\n\tLoadTapipayOptions,\n\tTapipayEnvironment,\n\tTapipayInstance,\n\tTapipayOptions,\n\tTapipayPaymentCancelledEvent,\n\tTapipayPaymentSubmittedEvent,\n\tTapipayPaymentWindowOpenedEvent,\n} from \"./types\";\n\n// ─── useTapipay hook ──────────────────────────────────────────────────────────\n\n/**\n * Hook de bajo nivel que carga el SDK y retorna la instancia.\n * Útil cuando necesitas control manual sobre initialize/destroy.\n *\n * @example\n * const { tapipay, error } = useTapipay();\n * const { tapipay, error } = useTapipay({ environment: 'homo' });\n */\nexport function useTapipay(options?: LoadTapipayOptions): {\n\ttapipay: TapipayInstance | null;\n\terror: Error | null;\n} {\n\tconst [tapipay, setTapipay] = useState<TapipayInstance | null>(null);\n\tconst [error, setError] = useState<Error | null>(null);\n\tconst environment = options?.environment;\n\n\tuseEffect(() => {\n\t\tlet cancelled = false;\n\t\tloadTapipay({ environment })\n\t\t\t.then((instance) => {\n\t\t\t\tif (!cancelled) setTapipay(instance);\n\t\t\t})\n\t\t\t.catch((err: Error) => {\n\t\t\t\tif (!cancelled) setError(err);\n\t\t\t});\n\t\treturn () => {\n\t\t\tcancelled = true;\n\t\t};\n\t}, [environment]);\n\n\treturn { tapipay, error };\n}\n\n// ─── TapipayWidget component ──────────────────────────────────────────────────\n\nexport interface TapipayWidgetProps extends Omit<TapipayOptions, \"container\"> {\n\t/** Entorno del SDK a cargar. Por defecto `'production'`. Usar `'homo'` para homologación. */\n\tenvironment?: TapipayEnvironment;\n\t/** Callback invocado cuando el popup de Yuno se abre exitosamente. */\n\tonPaymentWindowOpened?: (data: TapipayPaymentWindowOpenedEvent) => void;\n\t/** Callback invocado cuando el usuario completó el formulario de Yuno y fue redirigido al callback. */\n\tonPaymentSubmitted?: (data: TapipayPaymentSubmittedEvent) => void;\n\t/** Callback invocado cuando el usuario cierra el popup sin completar el pago. */\n\tonCancelled?: (data: TapipayPaymentCancelledEvent) => void;\n\t/** Clases CSS adicionales para el contenedor del widget. */\n\tclassName?: string;\n\t/** Estilos inline adicionales para el contenedor del widget. */\n\tstyle?: React.CSSProperties;\n}\n\n/**\n * Componente React que encapsula el widget de pago TapiPay.\n *\n * Maneja internamente la carga del SDK, el ciclo de vida del widget\n * y el cleanup al desmontar. Compatible con React Strict Mode.\n *\n * @example\n * <TapipayWidget\n * organization=\"acme\"\n * identifier=\"CLI-001\"\n * externalRequestId=\"FAC-2024-001\"\n * onPending={(data) => console.log(\"Pago en proceso\", data)}\n * onCancelled={() => console.log(\"Pago cancelado por el usuario\")}\n * />\n */\nexport function TapipayWidget({\n\torganization,\n\tidentifier,\n\texternalRequestId,\n\tselectionStrategy,\n\tenvironment,\n\tonPaymentWindowOpened,\n\tonPaymentSubmitted,\n\tonCancelled,\n\tclassName,\n\tstyle,\n}: TapipayWidgetProps) {\n\tconst containerRef = useRef<HTMLDivElement>(null);\n\t// Refs para evitar re-renders innecesarios y closures estáticos en useEffect\n\tconst onPaymentWindowOpenedRef = useRef(onPaymentWindowOpened);\n\tconst onPaymentSubmittedRef = useRef(onPaymentSubmitted);\n\tconst onCancelledRef = useRef(onCancelled);\n\n\tuseEffect(() => {\n\t\tonPaymentWindowOpenedRef.current = onPaymentWindowOpened;\n\t}, [onPaymentWindowOpened]);\n\n\tuseEffect(() => {\n\t\tonPaymentSubmittedRef.current = onPaymentSubmitted;\n\t}, [onPaymentSubmitted]);\n\n\tuseEffect(() => {\n\t\tonCancelledRef.current = onCancelled;\n\t}, [onCancelled]);\n\n\tuseEffect(() => {\n\t\tif (!containerRef.current) return;\n\t\tconst container = containerRef.current;\n\n\t\tlet tapipayInstance: TapipayInstance | null = null;\n\t\tlet cancelled = false;\n\n\t\tconst handlePaymentWindowOpened = (\n\t\t\tdata: TapipayPaymentWindowOpenedEvent,\n\t\t) => {\n\t\t\tonPaymentWindowOpenedRef.current?.(data);\n\t\t};\n\t\tconst handlePaymentSubmitted = (data: TapipayPaymentSubmittedEvent) => {\n\t\t\tonPaymentSubmittedRef.current?.(data);\n\t\t};\n\t\tconst handleCancelled = (data: TapipayPaymentCancelledEvent) => {\n\t\t\tonCancelledRef.current?.(data);\n\t\t};\n\n\t\tloadTapipay({ environment }).then((instance) => {\n\t\t\tif (cancelled) return;\n\t\t\ttapipayInstance = instance;\n\n\t\t\tinstance.on(\"paymentWindowOpened\", handlePaymentWindowOpened);\n\t\t\tinstance.on(\"paymentSubmitted\", handlePaymentSubmitted);\n\t\t\tinstance.on(\"paymentCancelled\", handleCancelled);\n\n\t\t\tinstance.initialize({\n\t\t\t\tcontainer,\n\t\t\t\torganization,\n\t\t\t\tidentifier,\n\t\t\t\texternalRequestId,\n\t\t\t\tselectionStrategy,\n\t\t\t});\n\t\t});\n\n\t\treturn () => {\n\t\t\tcancelled = true;\n\t\t\tif (tapipayInstance) {\n\t\t\t\ttapipayInstance.off(\"paymentWindowOpened\", handlePaymentWindowOpened);\n\t\t\t\ttapipayInstance.off(\"paymentSubmitted\", handlePaymentSubmitted);\n\t\t\t\ttapipayInstance.off(\"paymentCancelled\", handleCancelled);\n\t\t\t\ttapipayInstance.destroy(container);\n\t\t\t}\n\t\t};\n\t\t// El widget se re-monta si cambian los parámetros de identificación o entorno\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [\n\t\torganization,\n\t\tidentifier,\n\t\texternalRequestId,\n\t\tselectionStrategy,\n\t\tenvironment,\n\t]);\n\n\treturn <div ref={containerRef} className={className} style={style} />;\n}\n","import type {\n\tLoadTapipayOptions,\n\tTapipayEnvironment,\n\tTapipayInstance,\n} from \"./types\";\n\nconst SDK_URLS: Record<TapipayEnvironment, string> = {\n\tproduction: \"https://app.tapipay.la/embed.js\",\n\thomo: \"https://homo.tapipay.la/embed.js\",\n};\n\n// Idempotencia por entorno\nconst loadPromises = new Map<TapipayEnvironment, Promise<TapipayInstance>>();\n\n/**\n * Carga el SDK de TapiPay de forma asíncrona inyectando el script en el DOM.\n *\n * - Idempotente por entorno: múltiples llamadas con el mismo `environment` retornan la misma Promise.\n * - Si window.tapipay ya existe (script cargado sync), resuelve inmediatamente.\n * - Compatible con React Strict Mode (doble mount/unmount).\n *\n * @example\n * // Producción (default)\n * const tapipay = await loadTapipay();\n *\n * // Homologación\n * const tapipay = await loadTapipay({ environment: 'homo' });\n *\n * tapipay.initialize({ container: \"#widget\", organization: \"acme\", identifier: \"CLI-001\" });\n */\nexport function loadTapipay(\n\toptions?: LoadTapipayOptions,\n): Promise<TapipayInstance> {\n\tconst env: TapipayEnvironment = options?.environment ?? \"production\";\n\tconst SDK_URL = SDK_URLS[env];\n\tconst SCRIPT_ID = `tapipay-embed-sdk-${env}`;\n\n\t// SSR guard\n\tif (typeof window === \"undefined\") {\n\t\treturn Promise.reject(\n\t\t\tnew Error(\"[TapiPay] loadTapipay() requires a browser environment.\"),\n\t\t);\n\t}\n\n\t// Ya cargado de forma síncrona (script tag directo)\n\tif (window.tapipay && !window.tapipay._q) {\n\t\treturn Promise.resolve(window.tapipay);\n\t}\n\n\t// Reutilizar promise existente (idempotencia por entorno)\n\tconst existing = loadPromises.get(env);\n\tif (existing) return existing;\n\n\tconst promise = new Promise<TapipayInstance>((resolve, reject) => {\n\t\t// Si ya hay un script inyectado, esperar a que cargue\n\t\tconst existingScript = document.getElementById(\n\t\t\tSCRIPT_ID,\n\t\t) as HTMLScriptElement | null;\n\n\t\tconst onLoad = () => {\n\t\t\tif (window.tapipay) {\n\t\t\t\tresolve(window.tapipay);\n\t\t\t} else {\n\t\t\t\treject(\n\t\t\t\t\tnew Error(\n\t\t\t\t\t\t\"[TapiPay] El script cargó pero window.tapipay no está definido.\",\n\t\t\t\t\t),\n\t\t\t\t);\n\t\t\t}\n\t\t};\n\n\t\tconst onError = () => {\n\t\t\tloadPromises.delete(env);\n\t\t\treject(new Error(`[TapiPay] Error al cargar el SDK desde ${SDK_URL}`));\n\t\t};\n\n\t\tif (existingScript) {\n\t\t\texistingScript.addEventListener(\"load\", onLoad);\n\t\t\texistingScript.addEventListener(\"error\", onError);\n\t\t\treturn;\n\t\t}\n\n\t\tconst script = document.createElement(\"script\");\n\t\tscript.id = SCRIPT_ID;\n\t\tscript.src = SDK_URL;\n\t\tscript.async = true;\n\t\tscript.addEventListener(\"load\", onLoad);\n\t\tscript.addEventListener(\"error\", onError);\n\t\tdocument.head.appendChild(script);\n\t});\n\n\tloadPromises.set(env, promise);\n\treturn promise;\n}\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../src/react.tsx","../src/loader.ts"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { loadTapipay } from \"./loader\";\nimport type {\n\tLoadTapipayOptions,\n\tTapipayAutopayActivatedEvent,\n\tTapipayAutopayErrorEvent,\n\tTapipayAutopayLoadedEvent,\n\tTapipayAutopayRemovedEvent,\n\tTapipayEnvironment,\n\tTapipayInstance,\n\tTapipayOptions,\n\tTapipayPaymentCancelledEvent,\n\tTapipayPaymentSubmittedEvent,\n\tTapipayPaymentWindowOpenedEvent,\n} from \"./types\";\n\n// ─── useTapipay hook ──────────────────────────────────────────────────────────\n\n/**\n * Hook de bajo nivel que carga el SDK y retorna la instancia.\n * Útil cuando necesitas control manual sobre initialize/destroy.\n *\n * @example\n * const { tapipay, error } = useTapipay();\n * const { tapipay, error } = useTapipay({ environment: 'homo' });\n */\nexport function useTapipay(options?: LoadTapipayOptions): {\n\ttapipay: TapipayInstance | null;\n\terror: Error | null;\n} {\n\tconst [tapipay, setTapipay] = useState<TapipayInstance | null>(null);\n\tconst [error, setError] = useState<Error | null>(null);\n\tconst environment = options?.environment;\n\n\tuseEffect(() => {\n\t\tlet cancelled = false;\n\t\tloadTapipay({ environment })\n\t\t\t.then((instance) => {\n\t\t\t\tif (!cancelled) setTapipay(instance);\n\t\t\t})\n\t\t\t.catch((err: Error) => {\n\t\t\t\tif (!cancelled) setError(err);\n\t\t\t});\n\t\treturn () => {\n\t\t\tcancelled = true;\n\t\t};\n\t}, [environment]);\n\n\treturn { tapipay, error };\n}\n\n// ─── TapipayWidget component ──────────────────────────────────────────────────\n\nexport interface TapipayWidgetProps extends Omit<TapipayOptions, \"container\"> {\n\t/** Entorno del SDK a cargar. Por defecto `'production'`. Usar `'homo'` para homologación. */\n\tenvironment?: TapipayEnvironment;\n\t/** Callback invocado cuando el popup de Yuno se abre exitosamente. */\n\tonPaymentWindowOpened?: (data: TapipayPaymentWindowOpenedEvent) => void;\n\t/** Callback invocado cuando el usuario completó el formulario de Yuno y fue redirigido al callback. */\n\tonPaymentSubmitted?: (data: TapipayPaymentSubmittedEvent) => void;\n\t/** Callback invocado cuando el usuario cierra el popup sin completar el pago. */\n\tonCancelled?: (data: TapipayPaymentCancelledEvent) => void;\n\t/** (Vista autopay) Callback con el conjunto de adhesiones activas; se reinvoca cuando la lista cambia. */\n\tonAutopayLoaded?: (data: TapipayAutopayLoadedEvent) => void;\n\t/** (Vista autopay) Callback cuando una nueva adhesión queda activa (una sola vez por adhesión nueva). */\n\tonAutopayActivated?: (data: TapipayAutopayActivatedEvent) => void;\n\t/** (Vista autopay) Callback cuando el usuario desadhiere un medio con éxito. */\n\tonAutopayRemoved?: (data: TapipayAutopayRemovedEvent) => void;\n\t/** (Vista autopay) Callback ante un error de carga de adhesiones o de desadhesión. */\n\tonAutopayError?: (data: TapipayAutopayErrorEvent) => void;\n\t/** Clases CSS adicionales para el contenedor del widget. */\n\tclassName?: string;\n\t/** Estilos inline adicionales para el contenedor del widget. */\n\tstyle?: React.CSSProperties;\n}\n\n/**\n * Componente React que encapsula el widget de pago TapiPay.\n *\n * Maneja internamente la carga del SDK, el ciclo de vida del widget\n * y el cleanup al desmontar. Compatible con React Strict Mode.\n *\n * @example\n * // Vista de pagos (default)\n * <TapipayWidget\n * organization=\"acme\"\n * identifier=\"CLI-001\"\n * externalRequestId=\"FAC-2024-001\"\n * onPaymentSubmitted={(data) => console.log(\"Pago enviado\", data)}\n * onCancelled={() => console.log(\"Pago cancelado por el usuario\")}\n * />\n *\n * @example\n * // Vista de gestión de adhesiones de autopay\n * <TapipayWidget\n * organization=\"acme\"\n * identifier=\"CLI-001\"\n * view=\"autopay\"\n * onAutopayLoaded={(data) => console.log(\"Adhesiones\", data.count)}\n * onAutopayActivated={(data) => console.log(\"Adhesión activada\", data.id)}\n * onAutopayRemoved={(data) => console.log(\"Adhesión eliminada\", data.id)}\n * />\n */\nexport function TapipayWidget({\n\torganization,\n\tidentifier,\n\texternalRequestId,\n\tselectionStrategy,\n\tview,\n\tenvironment,\n\tonPaymentWindowOpened,\n\tonPaymentSubmitted,\n\tonCancelled,\n\tonAutopayLoaded,\n\tonAutopayActivated,\n\tonAutopayRemoved,\n\tonAutopayError,\n\tclassName,\n\tstyle,\n}: TapipayWidgetProps) {\n\tconst containerRef = useRef<HTMLDivElement>(null);\n\t// Refs para evitar re-renders innecesarios y closures estáticos en useEffect\n\tconst onPaymentWindowOpenedRef = useRef(onPaymentWindowOpened);\n\tconst onPaymentSubmittedRef = useRef(onPaymentSubmitted);\n\tconst onCancelledRef = useRef(onCancelled);\n\tconst onAutopayLoadedRef = useRef(onAutopayLoaded);\n\tconst onAutopayActivatedRef = useRef(onAutopayActivated);\n\tconst onAutopayRemovedRef = useRef(onAutopayRemoved);\n\tconst onAutopayErrorRef = useRef(onAutopayError);\n\n\tuseEffect(() => {\n\t\tonPaymentWindowOpenedRef.current = onPaymentWindowOpened;\n\t}, [onPaymentWindowOpened]);\n\n\tuseEffect(() => {\n\t\tonPaymentSubmittedRef.current = onPaymentSubmitted;\n\t}, [onPaymentSubmitted]);\n\n\tuseEffect(() => {\n\t\tonCancelledRef.current = onCancelled;\n\t}, [onCancelled]);\n\n\tuseEffect(() => {\n\t\tonAutopayLoadedRef.current = onAutopayLoaded;\n\t}, [onAutopayLoaded]);\n\n\tuseEffect(() => {\n\t\tonAutopayActivatedRef.current = onAutopayActivated;\n\t}, [onAutopayActivated]);\n\n\tuseEffect(() => {\n\t\tonAutopayRemovedRef.current = onAutopayRemoved;\n\t}, [onAutopayRemoved]);\n\n\tuseEffect(() => {\n\t\tonAutopayErrorRef.current = onAutopayError;\n\t}, [onAutopayError]);\n\n\tuseEffect(() => {\n\t\tif (!containerRef.current) return;\n\t\tconst container = containerRef.current;\n\n\t\tlet tapipayInstance: TapipayInstance | null = null;\n\t\tlet cancelled = false;\n\n\t\tconst handlePaymentWindowOpened = (\n\t\t\tdata: TapipayPaymentWindowOpenedEvent,\n\t\t) => {\n\t\t\tonPaymentWindowOpenedRef.current?.(data);\n\t\t};\n\t\tconst handlePaymentSubmitted = (data: TapipayPaymentSubmittedEvent) => {\n\t\t\tonPaymentSubmittedRef.current?.(data);\n\t\t};\n\t\tconst handleCancelled = (data: TapipayPaymentCancelledEvent) => {\n\t\t\tonCancelledRef.current?.(data);\n\t\t};\n\t\tconst handleAutopayLoaded = (data: TapipayAutopayLoadedEvent) => {\n\t\t\tonAutopayLoadedRef.current?.(data);\n\t\t};\n\t\tconst handleAutopayActivated = (data: TapipayAutopayActivatedEvent) => {\n\t\t\tonAutopayActivatedRef.current?.(data);\n\t\t};\n\t\tconst handleAutopayRemoved = (data: TapipayAutopayRemovedEvent) => {\n\t\t\tonAutopayRemovedRef.current?.(data);\n\t\t};\n\t\tconst handleAutopayError = (data: TapipayAutopayErrorEvent) => {\n\t\t\tonAutopayErrorRef.current?.(data);\n\t\t};\n\n\t\tloadTapipay({ environment }).then((instance) => {\n\t\t\tif (cancelled) return;\n\t\t\ttapipayInstance = instance;\n\n\t\t\tinstance.on(\"paymentWindowOpened\", handlePaymentWindowOpened);\n\t\t\tinstance.on(\"paymentSubmitted\", handlePaymentSubmitted);\n\t\t\tinstance.on(\"paymentCancelled\", handleCancelled);\n\t\t\tinstance.on(\"autopayLoaded\", handleAutopayLoaded);\n\t\t\tinstance.on(\"autopayActivated\", handleAutopayActivated);\n\t\t\tinstance.on(\"autopayRemoved\", handleAutopayRemoved);\n\t\t\tinstance.on(\"autopayError\", handleAutopayError);\n\n\t\t\tinstance.initialize({\n\t\t\t\tcontainer,\n\t\t\t\torganization,\n\t\t\t\tidentifier,\n\t\t\t\texternalRequestId,\n\t\t\t\tselectionStrategy,\n\t\t\t\tview,\n\t\t\t});\n\t\t});\n\n\t\treturn () => {\n\t\t\tcancelled = true;\n\t\t\tif (tapipayInstance) {\n\t\t\t\ttapipayInstance.off(\"paymentWindowOpened\", handlePaymentWindowOpened);\n\t\t\t\ttapipayInstance.off(\"paymentSubmitted\", handlePaymentSubmitted);\n\t\t\t\ttapipayInstance.off(\"paymentCancelled\", handleCancelled);\n\t\t\t\ttapipayInstance.off(\"autopayLoaded\", handleAutopayLoaded);\n\t\t\t\ttapipayInstance.off(\"autopayActivated\", handleAutopayActivated);\n\t\t\t\ttapipayInstance.off(\"autopayRemoved\", handleAutopayRemoved);\n\t\t\t\ttapipayInstance.off(\"autopayError\", handleAutopayError);\n\t\t\t\ttapipayInstance.destroy(container);\n\t\t\t}\n\t\t};\n\t\t// El widget se re-monta si cambian los parámetros de identificación o entorno\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [\n\t\torganization,\n\t\tidentifier,\n\t\texternalRequestId,\n\t\tselectionStrategy,\n\t\tview,\n\t\tenvironment,\n\t]);\n\n\treturn <div ref={containerRef} className={className} style={style} />;\n}\n","import type {\n\tLoadTapipayOptions,\n\tTapipayEnvironment,\n\tTapipayInstance,\n} from \"./types\";\n\nconst SDK_URLS: Record<TapipayEnvironment, string> = {\n\tproduction: \"https://app.tapipay.la/embed.js\",\n\thomo: \"https://homo.tapipay.la/embed.js\",\n};\n\n// Idempotencia por entorno\nconst loadPromises = new Map<TapipayEnvironment, Promise<TapipayInstance>>();\n\n/**\n * Carga el SDK de TapiPay de forma asíncrona inyectando el script en el DOM.\n *\n * - Idempotente por entorno: múltiples llamadas con el mismo `environment` retornan la misma Promise.\n * - Si window.tapipay ya existe (script cargado sync), resuelve inmediatamente.\n * - Compatible con React Strict Mode (doble mount/unmount).\n *\n * @example\n * // Producción (default)\n * const tapipay = await loadTapipay();\n *\n * // Homologación\n * const tapipay = await loadTapipay({ environment: 'homo' });\n *\n * tapipay.initialize({ container: \"#widget\", organization: \"acme\", identifier: \"CLI-001\" });\n */\nexport function loadTapipay(\n\toptions?: LoadTapipayOptions,\n): Promise<TapipayInstance> {\n\tconst env: TapipayEnvironment = options?.environment ?? \"production\";\n\tconst SDK_URL = SDK_URLS[env];\n\tconst SCRIPT_ID = `tapipay-embed-sdk-${env}`;\n\n\t// SSR guard\n\tif (typeof window === \"undefined\") {\n\t\treturn Promise.reject(\n\t\t\tnew Error(\"[TapiPay] loadTapipay() requires a browser environment.\"),\n\t\t);\n\t}\n\n\t// Ya cargado de forma síncrona (script tag directo)\n\tif (window.tapipay && !window.tapipay._q) {\n\t\treturn Promise.resolve(window.tapipay);\n\t}\n\n\t// Reutilizar promise existente (idempotencia por entorno)\n\tconst existing = loadPromises.get(env);\n\tif (existing) return existing;\n\n\tconst promise = new Promise<TapipayInstance>((resolve, reject) => {\n\t\t// Si ya hay un script inyectado, esperar a que cargue\n\t\tconst existingScript = document.getElementById(\n\t\t\tSCRIPT_ID,\n\t\t) as HTMLScriptElement | null;\n\n\t\tconst onLoad = () => {\n\t\t\tif (window.tapipay) {\n\t\t\t\tresolve(window.tapipay);\n\t\t\t} else {\n\t\t\t\treject(\n\t\t\t\t\tnew Error(\n\t\t\t\t\t\t\"[TapiPay] El script cargó pero window.tapipay no está definido.\",\n\t\t\t\t\t),\n\t\t\t\t);\n\t\t\t}\n\t\t};\n\n\t\tconst onError = () => {\n\t\t\tloadPromises.delete(env);\n\t\t\treject(new Error(`[TapiPay] Error al cargar el SDK desde ${SDK_URL}`));\n\t\t};\n\n\t\tif (existingScript) {\n\t\t\texistingScript.addEventListener(\"load\", onLoad);\n\t\t\texistingScript.addEventListener(\"error\", onError);\n\t\t\treturn;\n\t\t}\n\n\t\tconst script = document.createElement(\"script\");\n\t\tscript.id = SCRIPT_ID;\n\t\tscript.src = SDK_URL;\n\t\tscript.async = true;\n\t\tscript.addEventListener(\"load\", onLoad);\n\t\tscript.addEventListener(\"error\", onError);\n\t\tdocument.head.appendChild(script);\n\t});\n\n\tloadPromises.set(env, promise);\n\treturn promise;\n}\n"],"mappings":"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","names":[]}
package/dist/react.d.cts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { b as TapipayOptions, a as TapipayEnvironment, e as TapipayPaymentWindowOpenedEvent, d as TapipayPaymentSubmittedEvent, c as TapipayPaymentCancelledEvent, L as LoadTapipayOptions, T as TapipayInstance } from './types-DYcwsDwH.cjs';
2
+ import { h as TapipayOptions, g as TapipayEnvironment, k as TapipayPaymentWindowOpenedEvent, j as TapipayPaymentSubmittedEvent, i as TapipayPaymentCancelledEvent, d as TapipayAutopayLoadedEvent, a as TapipayAutopayActivatedEvent, f as TapipayAutopayRemovedEvent, c as TapipayAutopayErrorEvent, L as LoadTapipayOptions, T as TapipayInstance } from './types-BIb8B1hp.cjs';
3
3
 
4
4
  /**
5
5
  * Hook de bajo nivel que carga el SDK y retorna la instancia.
@@ -22,6 +22,14 @@ interface TapipayWidgetProps extends Omit<TapipayOptions, "container"> {
22
22
  onPaymentSubmitted?: (data: TapipayPaymentSubmittedEvent) => void;
23
23
  /** Callback invocado cuando el usuario cierra el popup sin completar el pago. */
24
24
  onCancelled?: (data: TapipayPaymentCancelledEvent) => void;
25
+ /** (Vista autopay) Callback con el conjunto de adhesiones activas; se reinvoca cuando la lista cambia. */
26
+ onAutopayLoaded?: (data: TapipayAutopayLoadedEvent) => void;
27
+ /** (Vista autopay) Callback cuando una nueva adhesión queda activa (una sola vez por adhesión nueva). */
28
+ onAutopayActivated?: (data: TapipayAutopayActivatedEvent) => void;
29
+ /** (Vista autopay) Callback cuando el usuario desadhiere un medio con éxito. */
30
+ onAutopayRemoved?: (data: TapipayAutopayRemovedEvent) => void;
31
+ /** (Vista autopay) Callback ante un error de carga de adhesiones o de desadhesión. */
32
+ onAutopayError?: (data: TapipayAutopayErrorEvent) => void;
25
33
  /** Clases CSS adicionales para el contenedor del widget. */
26
34
  className?: string;
27
35
  /** Estilos inline adicionales para el contenedor del widget. */
@@ -34,14 +42,26 @@ interface TapipayWidgetProps extends Omit<TapipayOptions, "container"> {
34
42
  * y el cleanup al desmontar. Compatible con React Strict Mode.
35
43
  *
36
44
  * @example
45
+ * // Vista de pagos (default)
37
46
  * <TapipayWidget
38
47
  * organization="acme"
39
48
  * identifier="CLI-001"
40
49
  * externalRequestId="FAC-2024-001"
41
- * onPending={(data) => console.log("Pago en proceso", data)}
50
+ * onPaymentSubmitted={(data) => console.log("Pago enviado", data)}
42
51
  * onCancelled={() => console.log("Pago cancelado por el usuario")}
43
52
  * />
53
+ *
54
+ * @example
55
+ * // Vista de gestión de adhesiones de autopay
56
+ * <TapipayWidget
57
+ * organization="acme"
58
+ * identifier="CLI-001"
59
+ * view="autopay"
60
+ * onAutopayLoaded={(data) => console.log("Adhesiones", data.count)}
61
+ * onAutopayActivated={(data) => console.log("Adhesión activada", data.id)}
62
+ * onAutopayRemoved={(data) => console.log("Adhesión eliminada", data.id)}
63
+ * />
44
64
  */
45
- declare function TapipayWidget({ organization, identifier, externalRequestId, selectionStrategy, environment, onPaymentWindowOpened, onPaymentSubmitted, onCancelled, className, style, }: TapipayWidgetProps): react_jsx_runtime.JSX.Element;
65
+ declare function TapipayWidget({ organization, identifier, externalRequestId, selectionStrategy, view, environment, onPaymentWindowOpened, onPaymentSubmitted, onCancelled, onAutopayLoaded, onAutopayActivated, onAutopayRemoved, onAutopayError, className, style, }: TapipayWidgetProps): react_jsx_runtime.JSX.Element;
46
66
 
47
67
  export { TapipayWidget, type TapipayWidgetProps, useTapipay };
package/dist/react.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { b as TapipayOptions, a as TapipayEnvironment, e as TapipayPaymentWindowOpenedEvent, d as TapipayPaymentSubmittedEvent, c as TapipayPaymentCancelledEvent, L as LoadTapipayOptions, T as TapipayInstance } from './types-DYcwsDwH.js';
2
+ import { h as TapipayOptions, g as TapipayEnvironment, k as TapipayPaymentWindowOpenedEvent, j as TapipayPaymentSubmittedEvent, i as TapipayPaymentCancelledEvent, d as TapipayAutopayLoadedEvent, a as TapipayAutopayActivatedEvent, f as TapipayAutopayRemovedEvent, c as TapipayAutopayErrorEvent, L as LoadTapipayOptions, T as TapipayInstance } from './types-BIb8B1hp.js';
3
3
 
4
4
  /**
5
5
  * Hook de bajo nivel que carga el SDK y retorna la instancia.
@@ -22,6 +22,14 @@ interface TapipayWidgetProps extends Omit<TapipayOptions, "container"> {
22
22
  onPaymentSubmitted?: (data: TapipayPaymentSubmittedEvent) => void;
23
23
  /** Callback invocado cuando el usuario cierra el popup sin completar el pago. */
24
24
  onCancelled?: (data: TapipayPaymentCancelledEvent) => void;
25
+ /** (Vista autopay) Callback con el conjunto de adhesiones activas; se reinvoca cuando la lista cambia. */
26
+ onAutopayLoaded?: (data: TapipayAutopayLoadedEvent) => void;
27
+ /** (Vista autopay) Callback cuando una nueva adhesión queda activa (una sola vez por adhesión nueva). */
28
+ onAutopayActivated?: (data: TapipayAutopayActivatedEvent) => void;
29
+ /** (Vista autopay) Callback cuando el usuario desadhiere un medio con éxito. */
30
+ onAutopayRemoved?: (data: TapipayAutopayRemovedEvent) => void;
31
+ /** (Vista autopay) Callback ante un error de carga de adhesiones o de desadhesión. */
32
+ onAutopayError?: (data: TapipayAutopayErrorEvent) => void;
25
33
  /** Clases CSS adicionales para el contenedor del widget. */
26
34
  className?: string;
27
35
  /** Estilos inline adicionales para el contenedor del widget. */
@@ -34,14 +42,26 @@ interface TapipayWidgetProps extends Omit<TapipayOptions, "container"> {
34
42
  * y el cleanup al desmontar. Compatible con React Strict Mode.
35
43
  *
36
44
  * @example
45
+ * // Vista de pagos (default)
37
46
  * <TapipayWidget
38
47
  * organization="acme"
39
48
  * identifier="CLI-001"
40
49
  * externalRequestId="FAC-2024-001"
41
- * onPending={(data) => console.log("Pago en proceso", data)}
50
+ * onPaymentSubmitted={(data) => console.log("Pago enviado", data)}
42
51
  * onCancelled={() => console.log("Pago cancelado por el usuario")}
43
52
  * />
53
+ *
54
+ * @example
55
+ * // Vista de gestión de adhesiones de autopay
56
+ * <TapipayWidget
57
+ * organization="acme"
58
+ * identifier="CLI-001"
59
+ * view="autopay"
60
+ * onAutopayLoaded={(data) => console.log("Adhesiones", data.count)}
61
+ * onAutopayActivated={(data) => console.log("Adhesión activada", data.id)}
62
+ * onAutopayRemoved={(data) => console.log("Adhesión eliminada", data.id)}
63
+ * />
44
64
  */
45
- declare function TapipayWidget({ organization, identifier, externalRequestId, selectionStrategy, environment, onPaymentWindowOpened, onPaymentSubmitted, onCancelled, className, style, }: TapipayWidgetProps): react_jsx_runtime.JSX.Element;
65
+ declare function TapipayWidget({ organization, identifier, externalRequestId, selectionStrategy, view, environment, onPaymentWindowOpened, onPaymentSubmitted, onCancelled, onAutopayLoaded, onAutopayActivated, onAutopayRemoved, onAutopayError, className, style, }: TapipayWidgetProps): react_jsx_runtime.JSX.Element;
46
66
 
47
67
  export { TapipayWidget, type TapipayWidgetProps, useTapipay };
package/dist/react.js CHANGED
@@ -27,10 +27,15 @@ function TapipayWidget({
27
27
  identifier,
28
28
  externalRequestId,
29
29
  selectionStrategy,
30
+ view,
30
31
  environment,
31
32
  onPaymentWindowOpened,
32
33
  onPaymentSubmitted,
33
34
  onCancelled,
35
+ onAutopayLoaded,
36
+ onAutopayActivated,
37
+ onAutopayRemoved,
38
+ onAutopayError,
34
39
  className,
35
40
  style
36
41
  }) {
@@ -38,6 +43,10 @@ function TapipayWidget({
38
43
  const onPaymentWindowOpenedRef = useRef(onPaymentWindowOpened);
39
44
  const onPaymentSubmittedRef = useRef(onPaymentSubmitted);
40
45
  const onCancelledRef = useRef(onCancelled);
46
+ const onAutopayLoadedRef = useRef(onAutopayLoaded);
47
+ const onAutopayActivatedRef = useRef(onAutopayActivated);
48
+ const onAutopayRemovedRef = useRef(onAutopayRemoved);
49
+ const onAutopayErrorRef = useRef(onAutopayError);
41
50
  useEffect(() => {
42
51
  onPaymentWindowOpenedRef.current = onPaymentWindowOpened;
43
52
  }, [onPaymentWindowOpened]);
@@ -47,6 +56,18 @@ function TapipayWidget({
47
56
  useEffect(() => {
48
57
  onCancelledRef.current = onCancelled;
49
58
  }, [onCancelled]);
59
+ useEffect(() => {
60
+ onAutopayLoadedRef.current = onAutopayLoaded;
61
+ }, [onAutopayLoaded]);
62
+ useEffect(() => {
63
+ onAutopayActivatedRef.current = onAutopayActivated;
64
+ }, [onAutopayActivated]);
65
+ useEffect(() => {
66
+ onAutopayRemovedRef.current = onAutopayRemoved;
67
+ }, [onAutopayRemoved]);
68
+ useEffect(() => {
69
+ onAutopayErrorRef.current = onAutopayError;
70
+ }, [onAutopayError]);
50
71
  useEffect(() => {
51
72
  if (!containerRef.current) return;
52
73
  const container = containerRef.current;
@@ -64,18 +85,39 @@ function TapipayWidget({
64
85
  var _a;
65
86
  (_a = onCancelledRef.current) == null ? void 0 : _a.call(onCancelledRef, data);
66
87
  };
88
+ const handleAutopayLoaded = (data) => {
89
+ var _a;
90
+ (_a = onAutopayLoadedRef.current) == null ? void 0 : _a.call(onAutopayLoadedRef, data);
91
+ };
92
+ const handleAutopayActivated = (data) => {
93
+ var _a;
94
+ (_a = onAutopayActivatedRef.current) == null ? void 0 : _a.call(onAutopayActivatedRef, data);
95
+ };
96
+ const handleAutopayRemoved = (data) => {
97
+ var _a;
98
+ (_a = onAutopayRemovedRef.current) == null ? void 0 : _a.call(onAutopayRemovedRef, data);
99
+ };
100
+ const handleAutopayError = (data) => {
101
+ var _a;
102
+ (_a = onAutopayErrorRef.current) == null ? void 0 : _a.call(onAutopayErrorRef, data);
103
+ };
67
104
  loadTapipay({ environment }).then((instance) => {
68
105
  if (cancelled) return;
69
106
  tapipayInstance = instance;
70
107
  instance.on("paymentWindowOpened", handlePaymentWindowOpened);
71
108
  instance.on("paymentSubmitted", handlePaymentSubmitted);
72
109
  instance.on("paymentCancelled", handleCancelled);
110
+ instance.on("autopayLoaded", handleAutopayLoaded);
111
+ instance.on("autopayActivated", handleAutopayActivated);
112
+ instance.on("autopayRemoved", handleAutopayRemoved);
113
+ instance.on("autopayError", handleAutopayError);
73
114
  instance.initialize({
74
115
  container,
75
116
  organization,
76
117
  identifier,
77
118
  externalRequestId,
78
- selectionStrategy
119
+ selectionStrategy,
120
+ view
79
121
  });
80
122
  });
81
123
  return () => {
@@ -84,6 +126,10 @@ function TapipayWidget({
84
126
  tapipayInstance.off("paymentWindowOpened", handlePaymentWindowOpened);
85
127
  tapipayInstance.off("paymentSubmitted", handlePaymentSubmitted);
86
128
  tapipayInstance.off("paymentCancelled", handleCancelled);
129
+ tapipayInstance.off("autopayLoaded", handleAutopayLoaded);
130
+ tapipayInstance.off("autopayActivated", handleAutopayActivated);
131
+ tapipayInstance.off("autopayRemoved", handleAutopayRemoved);
132
+ tapipayInstance.off("autopayError", handleAutopayError);
87
133
  tapipayInstance.destroy(container);
88
134
  }
89
135
  };
@@ -92,6 +138,7 @@ function TapipayWidget({
92
138
  identifier,
93
139
  externalRequestId,
94
140
  selectionStrategy,
141
+ view,
95
142
  environment
96
143
  ]);
97
144
  return /* @__PURE__ */ jsx("div", { ref: containerRef, className, style });
package/dist/react.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/react.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { loadTapipay } from \"./loader\";\nimport type {\n\tLoadTapipayOptions,\n\tTapipayEnvironment,\n\tTapipayInstance,\n\tTapipayOptions,\n\tTapipayPaymentCancelledEvent,\n\tTapipayPaymentSubmittedEvent,\n\tTapipayPaymentWindowOpenedEvent,\n} from \"./types\";\n\n// ─── useTapipay hook ──────────────────────────────────────────────────────────\n\n/**\n * Hook de bajo nivel que carga el SDK y retorna la instancia.\n * Útil cuando necesitas control manual sobre initialize/destroy.\n *\n * @example\n * const { tapipay, error } = useTapipay();\n * const { tapipay, error } = useTapipay({ environment: 'homo' });\n */\nexport function useTapipay(options?: LoadTapipayOptions): {\n\ttapipay: TapipayInstance | null;\n\terror: Error | null;\n} {\n\tconst [tapipay, setTapipay] = useState<TapipayInstance | null>(null);\n\tconst [error, setError] = useState<Error | null>(null);\n\tconst environment = options?.environment;\n\n\tuseEffect(() => {\n\t\tlet cancelled = false;\n\t\tloadTapipay({ environment })\n\t\t\t.then((instance) => {\n\t\t\t\tif (!cancelled) setTapipay(instance);\n\t\t\t})\n\t\t\t.catch((err: Error) => {\n\t\t\t\tif (!cancelled) setError(err);\n\t\t\t});\n\t\treturn () => {\n\t\t\tcancelled = true;\n\t\t};\n\t}, [environment]);\n\n\treturn { tapipay, error };\n}\n\n// ─── TapipayWidget component ──────────────────────────────────────────────────\n\nexport interface TapipayWidgetProps extends Omit<TapipayOptions, \"container\"> {\n\t/** Entorno del SDK a cargar. Por defecto `'production'`. Usar `'homo'` para homologación. */\n\tenvironment?: TapipayEnvironment;\n\t/** Callback invocado cuando el popup de Yuno se abre exitosamente. */\n\tonPaymentWindowOpened?: (data: TapipayPaymentWindowOpenedEvent) => void;\n\t/** Callback invocado cuando el usuario completó el formulario de Yuno y fue redirigido al callback. */\n\tonPaymentSubmitted?: (data: TapipayPaymentSubmittedEvent) => void;\n\t/** Callback invocado cuando el usuario cierra el popup sin completar el pago. */\n\tonCancelled?: (data: TapipayPaymentCancelledEvent) => void;\n\t/** Clases CSS adicionales para el contenedor del widget. */\n\tclassName?: string;\n\t/** Estilos inline adicionales para el contenedor del widget. */\n\tstyle?: React.CSSProperties;\n}\n\n/**\n * Componente React que encapsula el widget de pago TapiPay.\n *\n * Maneja internamente la carga del SDK, el ciclo de vida del widget\n * y el cleanup al desmontar. Compatible con React Strict Mode.\n *\n * @example\n * <TapipayWidget\n * organization=\"acme\"\n * identifier=\"CLI-001\"\n * externalRequestId=\"FAC-2024-001\"\n * onPending={(data) => console.log(\"Pago en proceso\", data)}\n * onCancelled={() => console.log(\"Pago cancelado por el usuario\")}\n * />\n */\nexport function TapipayWidget({\n\torganization,\n\tidentifier,\n\texternalRequestId,\n\tselectionStrategy,\n\tenvironment,\n\tonPaymentWindowOpened,\n\tonPaymentSubmitted,\n\tonCancelled,\n\tclassName,\n\tstyle,\n}: TapipayWidgetProps) {\n\tconst containerRef = useRef<HTMLDivElement>(null);\n\t// Refs para evitar re-renders innecesarios y closures estáticos en useEffect\n\tconst onPaymentWindowOpenedRef = useRef(onPaymentWindowOpened);\n\tconst onPaymentSubmittedRef = useRef(onPaymentSubmitted);\n\tconst onCancelledRef = useRef(onCancelled);\n\n\tuseEffect(() => {\n\t\tonPaymentWindowOpenedRef.current = onPaymentWindowOpened;\n\t}, [onPaymentWindowOpened]);\n\n\tuseEffect(() => {\n\t\tonPaymentSubmittedRef.current = onPaymentSubmitted;\n\t}, [onPaymentSubmitted]);\n\n\tuseEffect(() => {\n\t\tonCancelledRef.current = onCancelled;\n\t}, [onCancelled]);\n\n\tuseEffect(() => {\n\t\tif (!containerRef.current) return;\n\t\tconst container = containerRef.current;\n\n\t\tlet tapipayInstance: TapipayInstance | null = null;\n\t\tlet cancelled = false;\n\n\t\tconst handlePaymentWindowOpened = (\n\t\t\tdata: TapipayPaymentWindowOpenedEvent,\n\t\t) => {\n\t\t\tonPaymentWindowOpenedRef.current?.(data);\n\t\t};\n\t\tconst handlePaymentSubmitted = (data: TapipayPaymentSubmittedEvent) => {\n\t\t\tonPaymentSubmittedRef.current?.(data);\n\t\t};\n\t\tconst handleCancelled = (data: TapipayPaymentCancelledEvent) => {\n\t\t\tonCancelledRef.current?.(data);\n\t\t};\n\n\t\tloadTapipay({ environment }).then((instance) => {\n\t\t\tif (cancelled) return;\n\t\t\ttapipayInstance = instance;\n\n\t\t\tinstance.on(\"paymentWindowOpened\", handlePaymentWindowOpened);\n\t\t\tinstance.on(\"paymentSubmitted\", handlePaymentSubmitted);\n\t\t\tinstance.on(\"paymentCancelled\", handleCancelled);\n\n\t\t\tinstance.initialize({\n\t\t\t\tcontainer,\n\t\t\t\torganization,\n\t\t\t\tidentifier,\n\t\t\t\texternalRequestId,\n\t\t\t\tselectionStrategy,\n\t\t\t});\n\t\t});\n\n\t\treturn () => {\n\t\t\tcancelled = true;\n\t\t\tif (tapipayInstance) {\n\t\t\t\ttapipayInstance.off(\"paymentWindowOpened\", handlePaymentWindowOpened);\n\t\t\t\ttapipayInstance.off(\"paymentSubmitted\", handlePaymentSubmitted);\n\t\t\t\ttapipayInstance.off(\"paymentCancelled\", handleCancelled);\n\t\t\t\ttapipayInstance.destroy(container);\n\t\t\t}\n\t\t};\n\t\t// El widget se re-monta si cambian los parámetros de identificación o entorno\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [\n\t\torganization,\n\t\tidentifier,\n\t\texternalRequestId,\n\t\tselectionStrategy,\n\t\tenvironment,\n\t]);\n\n\treturn <div ref={containerRef} className={className} style={style} />;\n}\n"],"mappings":";;;;;AAAA,SAAS,WAAW,QAAQ,gBAAgB;AAoKpC;AA9ID,SAAS,WAAW,SAGzB;AACD,QAAM,CAAC,SAAS,UAAU,IAAI,SAAiC,IAAI;AACnE,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAuB,IAAI;AACrD,QAAM,cAAc,mCAAS;AAE7B,YAAU,MAAM;AACf,QAAI,YAAY;AAChB,gBAAY,EAAE,YAAY,CAAC,EACzB,KAAK,CAAC,aAAa;AACnB,UAAI,CAAC,UAAW,YAAW,QAAQ;AAAA,IACpC,CAAC,EACA,MAAM,CAAC,QAAe;AACtB,UAAI,CAAC,UAAW,UAAS,GAAG;AAAA,IAC7B,CAAC;AACF,WAAO,MAAM;AACZ,kBAAY;AAAA,IACb;AAAA,EACD,GAAG,CAAC,WAAW,CAAC;AAEhB,SAAO,EAAE,SAAS,MAAM;AACzB;AAkCO,SAAS,cAAc;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAuB;AACtB,QAAM,eAAe,OAAuB,IAAI;AAEhD,QAAM,2BAA2B,OAAO,qBAAqB;AAC7D,QAAM,wBAAwB,OAAO,kBAAkB;AACvD,QAAM,iBAAiB,OAAO,WAAW;AAEzC,YAAU,MAAM;AACf,6BAAyB,UAAU;AAAA,EACpC,GAAG,CAAC,qBAAqB,CAAC;AAE1B,YAAU,MAAM;AACf,0BAAsB,UAAU;AAAA,EACjC,GAAG,CAAC,kBAAkB,CAAC;AAEvB,YAAU,MAAM;AACf,mBAAe,UAAU;AAAA,EAC1B,GAAG,CAAC,WAAW,CAAC;AAEhB,YAAU,MAAM;AACf,QAAI,CAAC,aAAa,QAAS;AAC3B,UAAM,YAAY,aAAa;AAE/B,QAAI,kBAA0C;AAC9C,QAAI,YAAY;AAEhB,UAAM,4BAA4B,CACjC,SACI;AAtHP;AAuHG,qCAAyB,YAAzB,kDAAmC;AAAA,IACpC;AACA,UAAM,yBAAyB,CAAC,SAAuC;AAzHzE;AA0HG,kCAAsB,YAAtB,+CAAgC;AAAA,IACjC;AACA,UAAM,kBAAkB,CAAC,SAAuC;AA5HlE;AA6HG,2BAAe,YAAf,wCAAyB;AAAA,IAC1B;AAEA,gBAAY,EAAE,YAAY,CAAC,EAAE,KAAK,CAAC,aAAa;AAC/C,UAAI,UAAW;AACf,wBAAkB;AAElB,eAAS,GAAG,uBAAuB,yBAAyB;AAC5D,eAAS,GAAG,oBAAoB,sBAAsB;AACtD,eAAS,GAAG,oBAAoB,eAAe;AAE/C,eAAS,WAAW;AAAA,QACnB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACD,CAAC;AAAA,IACF,CAAC;AAED,WAAO,MAAM;AACZ,kBAAY;AACZ,UAAI,iBAAiB;AACpB,wBAAgB,IAAI,uBAAuB,yBAAyB;AACpE,wBAAgB,IAAI,oBAAoB,sBAAsB;AAC9D,wBAAgB,IAAI,oBAAoB,eAAe;AACvD,wBAAgB,QAAQ,SAAS;AAAA,MAClC;AAAA,IACD;AAAA,EAGD,GAAG;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAC;AAED,SAAO,oBAAC,SAAI,KAAK,cAAc,WAAsB,OAAc;AACpE;","names":[]}
1
+ {"version":3,"sources":["../src/react.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { loadTapipay } from \"./loader\";\nimport type {\n\tLoadTapipayOptions,\n\tTapipayAutopayActivatedEvent,\n\tTapipayAutopayErrorEvent,\n\tTapipayAutopayLoadedEvent,\n\tTapipayAutopayRemovedEvent,\n\tTapipayEnvironment,\n\tTapipayInstance,\n\tTapipayOptions,\n\tTapipayPaymentCancelledEvent,\n\tTapipayPaymentSubmittedEvent,\n\tTapipayPaymentWindowOpenedEvent,\n} from \"./types\";\n\n// ─── useTapipay hook ──────────────────────────────────────────────────────────\n\n/**\n * Hook de bajo nivel que carga el SDK y retorna la instancia.\n * Útil cuando necesitas control manual sobre initialize/destroy.\n *\n * @example\n * const { tapipay, error } = useTapipay();\n * const { tapipay, error } = useTapipay({ environment: 'homo' });\n */\nexport function useTapipay(options?: LoadTapipayOptions): {\n\ttapipay: TapipayInstance | null;\n\terror: Error | null;\n} {\n\tconst [tapipay, setTapipay] = useState<TapipayInstance | null>(null);\n\tconst [error, setError] = useState<Error | null>(null);\n\tconst environment = options?.environment;\n\n\tuseEffect(() => {\n\t\tlet cancelled = false;\n\t\tloadTapipay({ environment })\n\t\t\t.then((instance) => {\n\t\t\t\tif (!cancelled) setTapipay(instance);\n\t\t\t})\n\t\t\t.catch((err: Error) => {\n\t\t\t\tif (!cancelled) setError(err);\n\t\t\t});\n\t\treturn () => {\n\t\t\tcancelled = true;\n\t\t};\n\t}, [environment]);\n\n\treturn { tapipay, error };\n}\n\n// ─── TapipayWidget component ──────────────────────────────────────────────────\n\nexport interface TapipayWidgetProps extends Omit<TapipayOptions, \"container\"> {\n\t/** Entorno del SDK a cargar. Por defecto `'production'`. Usar `'homo'` para homologación. */\n\tenvironment?: TapipayEnvironment;\n\t/** Callback invocado cuando el popup de Yuno se abre exitosamente. */\n\tonPaymentWindowOpened?: (data: TapipayPaymentWindowOpenedEvent) => void;\n\t/** Callback invocado cuando el usuario completó el formulario de Yuno y fue redirigido al callback. */\n\tonPaymentSubmitted?: (data: TapipayPaymentSubmittedEvent) => void;\n\t/** Callback invocado cuando el usuario cierra el popup sin completar el pago. */\n\tonCancelled?: (data: TapipayPaymentCancelledEvent) => void;\n\t/** (Vista autopay) Callback con el conjunto de adhesiones activas; se reinvoca cuando la lista cambia. */\n\tonAutopayLoaded?: (data: TapipayAutopayLoadedEvent) => void;\n\t/** (Vista autopay) Callback cuando una nueva adhesión queda activa (una sola vez por adhesión nueva). */\n\tonAutopayActivated?: (data: TapipayAutopayActivatedEvent) => void;\n\t/** (Vista autopay) Callback cuando el usuario desadhiere un medio con éxito. */\n\tonAutopayRemoved?: (data: TapipayAutopayRemovedEvent) => void;\n\t/** (Vista autopay) Callback ante un error de carga de adhesiones o de desadhesión. */\n\tonAutopayError?: (data: TapipayAutopayErrorEvent) => void;\n\t/** Clases CSS adicionales para el contenedor del widget. */\n\tclassName?: string;\n\t/** Estilos inline adicionales para el contenedor del widget. */\n\tstyle?: React.CSSProperties;\n}\n\n/**\n * Componente React que encapsula el widget de pago TapiPay.\n *\n * Maneja internamente la carga del SDK, el ciclo de vida del widget\n * y el cleanup al desmontar. Compatible con React Strict Mode.\n *\n * @example\n * // Vista de pagos (default)\n * <TapipayWidget\n * organization=\"acme\"\n * identifier=\"CLI-001\"\n * externalRequestId=\"FAC-2024-001\"\n * onPaymentSubmitted={(data) => console.log(\"Pago enviado\", data)}\n * onCancelled={() => console.log(\"Pago cancelado por el usuario\")}\n * />\n *\n * @example\n * // Vista de gestión de adhesiones de autopay\n * <TapipayWidget\n * organization=\"acme\"\n * identifier=\"CLI-001\"\n * view=\"autopay\"\n * onAutopayLoaded={(data) => console.log(\"Adhesiones\", data.count)}\n * onAutopayActivated={(data) => console.log(\"Adhesión activada\", data.id)}\n * onAutopayRemoved={(data) => console.log(\"Adhesión eliminada\", data.id)}\n * />\n */\nexport function TapipayWidget({\n\torganization,\n\tidentifier,\n\texternalRequestId,\n\tselectionStrategy,\n\tview,\n\tenvironment,\n\tonPaymentWindowOpened,\n\tonPaymentSubmitted,\n\tonCancelled,\n\tonAutopayLoaded,\n\tonAutopayActivated,\n\tonAutopayRemoved,\n\tonAutopayError,\n\tclassName,\n\tstyle,\n}: TapipayWidgetProps) {\n\tconst containerRef = useRef<HTMLDivElement>(null);\n\t// Refs para evitar re-renders innecesarios y closures estáticos en useEffect\n\tconst onPaymentWindowOpenedRef = useRef(onPaymentWindowOpened);\n\tconst onPaymentSubmittedRef = useRef(onPaymentSubmitted);\n\tconst onCancelledRef = useRef(onCancelled);\n\tconst onAutopayLoadedRef = useRef(onAutopayLoaded);\n\tconst onAutopayActivatedRef = useRef(onAutopayActivated);\n\tconst onAutopayRemovedRef = useRef(onAutopayRemoved);\n\tconst onAutopayErrorRef = useRef(onAutopayError);\n\n\tuseEffect(() => {\n\t\tonPaymentWindowOpenedRef.current = onPaymentWindowOpened;\n\t}, [onPaymentWindowOpened]);\n\n\tuseEffect(() => {\n\t\tonPaymentSubmittedRef.current = onPaymentSubmitted;\n\t}, [onPaymentSubmitted]);\n\n\tuseEffect(() => {\n\t\tonCancelledRef.current = onCancelled;\n\t}, [onCancelled]);\n\n\tuseEffect(() => {\n\t\tonAutopayLoadedRef.current = onAutopayLoaded;\n\t}, [onAutopayLoaded]);\n\n\tuseEffect(() => {\n\t\tonAutopayActivatedRef.current = onAutopayActivated;\n\t}, [onAutopayActivated]);\n\n\tuseEffect(() => {\n\t\tonAutopayRemovedRef.current = onAutopayRemoved;\n\t}, [onAutopayRemoved]);\n\n\tuseEffect(() => {\n\t\tonAutopayErrorRef.current = onAutopayError;\n\t}, [onAutopayError]);\n\n\tuseEffect(() => {\n\t\tif (!containerRef.current) return;\n\t\tconst container = containerRef.current;\n\n\t\tlet tapipayInstance: TapipayInstance | null = null;\n\t\tlet cancelled = false;\n\n\t\tconst handlePaymentWindowOpened = (\n\t\t\tdata: TapipayPaymentWindowOpenedEvent,\n\t\t) => {\n\t\t\tonPaymentWindowOpenedRef.current?.(data);\n\t\t};\n\t\tconst handlePaymentSubmitted = (data: TapipayPaymentSubmittedEvent) => {\n\t\t\tonPaymentSubmittedRef.current?.(data);\n\t\t};\n\t\tconst handleCancelled = (data: TapipayPaymentCancelledEvent) => {\n\t\t\tonCancelledRef.current?.(data);\n\t\t};\n\t\tconst handleAutopayLoaded = (data: TapipayAutopayLoadedEvent) => {\n\t\t\tonAutopayLoadedRef.current?.(data);\n\t\t};\n\t\tconst handleAutopayActivated = (data: TapipayAutopayActivatedEvent) => {\n\t\t\tonAutopayActivatedRef.current?.(data);\n\t\t};\n\t\tconst handleAutopayRemoved = (data: TapipayAutopayRemovedEvent) => {\n\t\t\tonAutopayRemovedRef.current?.(data);\n\t\t};\n\t\tconst handleAutopayError = (data: TapipayAutopayErrorEvent) => {\n\t\t\tonAutopayErrorRef.current?.(data);\n\t\t};\n\n\t\tloadTapipay({ environment }).then((instance) => {\n\t\t\tif (cancelled) return;\n\t\t\ttapipayInstance = instance;\n\n\t\t\tinstance.on(\"paymentWindowOpened\", handlePaymentWindowOpened);\n\t\t\tinstance.on(\"paymentSubmitted\", handlePaymentSubmitted);\n\t\t\tinstance.on(\"paymentCancelled\", handleCancelled);\n\t\t\tinstance.on(\"autopayLoaded\", handleAutopayLoaded);\n\t\t\tinstance.on(\"autopayActivated\", handleAutopayActivated);\n\t\t\tinstance.on(\"autopayRemoved\", handleAutopayRemoved);\n\t\t\tinstance.on(\"autopayError\", handleAutopayError);\n\n\t\t\tinstance.initialize({\n\t\t\t\tcontainer,\n\t\t\t\torganization,\n\t\t\t\tidentifier,\n\t\t\t\texternalRequestId,\n\t\t\t\tselectionStrategy,\n\t\t\t\tview,\n\t\t\t});\n\t\t});\n\n\t\treturn () => {\n\t\t\tcancelled = true;\n\t\t\tif (tapipayInstance) {\n\t\t\t\ttapipayInstance.off(\"paymentWindowOpened\", handlePaymentWindowOpened);\n\t\t\t\ttapipayInstance.off(\"paymentSubmitted\", handlePaymentSubmitted);\n\t\t\t\ttapipayInstance.off(\"paymentCancelled\", handleCancelled);\n\t\t\t\ttapipayInstance.off(\"autopayLoaded\", handleAutopayLoaded);\n\t\t\t\ttapipayInstance.off(\"autopayActivated\", handleAutopayActivated);\n\t\t\t\ttapipayInstance.off(\"autopayRemoved\", handleAutopayRemoved);\n\t\t\t\ttapipayInstance.off(\"autopayError\", handleAutopayError);\n\t\t\t\ttapipayInstance.destroy(container);\n\t\t\t}\n\t\t};\n\t\t// El widget se re-monta si cambian los parámetros de identificación o entorno\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [\n\t\torganization,\n\t\tidentifier,\n\t\texternalRequestId,\n\t\tselectionStrategy,\n\t\tview,\n\t\tenvironment,\n\t]);\n\n\treturn <div ref={containerRef} className={className} style={style} />;\n}\n"],"mappings":";;;;;AAAA,SAAS,WAAW,QAAQ,gBAAgB;AA2OpC;AAjND,SAAS,WAAW,SAGzB;AACD,QAAM,CAAC,SAAS,UAAU,IAAI,SAAiC,IAAI;AACnE,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAuB,IAAI;AACrD,QAAM,cAAc,mCAAS;AAE7B,YAAU,MAAM;AACf,QAAI,YAAY;AAChB,gBAAY,EAAE,YAAY,CAAC,EACzB,KAAK,CAAC,aAAa;AACnB,UAAI,CAAC,UAAW,YAAW,QAAQ;AAAA,IACpC,CAAC,EACA,MAAM,CAAC,QAAe;AACtB,UAAI,CAAC,UAAW,UAAS,GAAG;AAAA,IAC7B,CAAC;AACF,WAAO,MAAM;AACZ,kBAAY;AAAA,IACb;AAAA,EACD,GAAG,CAAC,WAAW,CAAC;AAEhB,SAAO,EAAE,SAAS,MAAM;AACzB;AAsDO,SAAS,cAAc;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAuB;AACtB,QAAM,eAAe,OAAuB,IAAI;AAEhD,QAAM,2BAA2B,OAAO,qBAAqB;AAC7D,QAAM,wBAAwB,OAAO,kBAAkB;AACvD,QAAM,iBAAiB,OAAO,WAAW;AACzC,QAAM,qBAAqB,OAAO,eAAe;AACjD,QAAM,wBAAwB,OAAO,kBAAkB;AACvD,QAAM,sBAAsB,OAAO,gBAAgB;AACnD,QAAM,oBAAoB,OAAO,cAAc;AAE/C,YAAU,MAAM;AACf,6BAAyB,UAAU;AAAA,EACpC,GAAG,CAAC,qBAAqB,CAAC;AAE1B,YAAU,MAAM;AACf,0BAAsB,UAAU;AAAA,EACjC,GAAG,CAAC,kBAAkB,CAAC;AAEvB,YAAU,MAAM;AACf,mBAAe,UAAU;AAAA,EAC1B,GAAG,CAAC,WAAW,CAAC;AAEhB,YAAU,MAAM;AACf,uBAAmB,UAAU;AAAA,EAC9B,GAAG,CAAC,eAAe,CAAC;AAEpB,YAAU,MAAM;AACf,0BAAsB,UAAU;AAAA,EACjC,GAAG,CAAC,kBAAkB,CAAC;AAEvB,YAAU,MAAM;AACf,wBAAoB,UAAU;AAAA,EAC/B,GAAG,CAAC,gBAAgB,CAAC;AAErB,YAAU,MAAM;AACf,sBAAkB,UAAU;AAAA,EAC7B,GAAG,CAAC,cAAc,CAAC;AAEnB,YAAU,MAAM;AACf,QAAI,CAAC,aAAa,QAAS;AAC3B,UAAM,YAAY,aAAa;AAE/B,QAAI,kBAA0C;AAC9C,QAAI,YAAY;AAEhB,UAAM,4BAA4B,CACjC,SACI;AAvKP;AAwKG,qCAAyB,YAAzB,kDAAmC;AAAA,IACpC;AACA,UAAM,yBAAyB,CAAC,SAAuC;AA1KzE;AA2KG,kCAAsB,YAAtB,+CAAgC;AAAA,IACjC;AACA,UAAM,kBAAkB,CAAC,SAAuC;AA7KlE;AA8KG,2BAAe,YAAf,wCAAyB;AAAA,IAC1B;AACA,UAAM,sBAAsB,CAAC,SAAoC;AAhLnE;AAiLG,+BAAmB,YAAnB,4CAA6B;AAAA,IAC9B;AACA,UAAM,yBAAyB,CAAC,SAAuC;AAnLzE;AAoLG,kCAAsB,YAAtB,+CAAgC;AAAA,IACjC;AACA,UAAM,uBAAuB,CAAC,SAAqC;AAtLrE;AAuLG,gCAAoB,YAApB,6CAA8B;AAAA,IAC/B;AACA,UAAM,qBAAqB,CAAC,SAAmC;AAzLjE;AA0LG,8BAAkB,YAAlB,2CAA4B;AAAA,IAC7B;AAEA,gBAAY,EAAE,YAAY,CAAC,EAAE,KAAK,CAAC,aAAa;AAC/C,UAAI,UAAW;AACf,wBAAkB;AAElB,eAAS,GAAG,uBAAuB,yBAAyB;AAC5D,eAAS,GAAG,oBAAoB,sBAAsB;AACtD,eAAS,GAAG,oBAAoB,eAAe;AAC/C,eAAS,GAAG,iBAAiB,mBAAmB;AAChD,eAAS,GAAG,oBAAoB,sBAAsB;AACtD,eAAS,GAAG,kBAAkB,oBAAoB;AAClD,eAAS,GAAG,gBAAgB,kBAAkB;AAE9C,eAAS,WAAW;AAAA,QACnB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACD,CAAC;AAAA,IACF,CAAC;AAED,WAAO,MAAM;AACZ,kBAAY;AACZ,UAAI,iBAAiB;AACpB,wBAAgB,IAAI,uBAAuB,yBAAyB;AACpE,wBAAgB,IAAI,oBAAoB,sBAAsB;AAC9D,wBAAgB,IAAI,oBAAoB,eAAe;AACvD,wBAAgB,IAAI,iBAAiB,mBAAmB;AACxD,wBAAgB,IAAI,oBAAoB,sBAAsB;AAC9D,wBAAgB,IAAI,kBAAkB,oBAAoB;AAC1D,wBAAgB,IAAI,gBAAgB,kBAAkB;AACtD,wBAAgB,QAAQ,SAAS;AAAA,MAClC;AAAA,IACD;AAAA,EAGD,GAAG;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAC;AAED,SAAO,oBAAC,SAAI,KAAK,cAAc,WAAsB,OAAc;AACpE;","names":[]}
@@ -0,0 +1,162 @@
1
+ /**
2
+ * Entorno de ejecución del SDK.
3
+ * - `'production'`: carga desde https://app.tapipay.la/embed.js (default)
4
+ * - `'homo'`: carga desde https://homo.tapipay.la/embed.js
5
+ */
6
+ type TapipayEnvironment = "production" | "homo";
7
+ /**
8
+ * Opciones para `loadTapipay()`.
9
+ */
10
+ interface LoadTapipayOptions {
11
+ /**
12
+ * Entorno a usar. Por defecto `'production'`.
13
+ * Para homologación usar `'homo'`.
14
+ */
15
+ environment?: TapipayEnvironment;
16
+ }
17
+ /**
18
+ * Vista a montar en el widget.
19
+ * - `'payments'` (default si se omite): medios de pago / pago de deuda.
20
+ * - `'autopay'`: gestión de adhesiones (ver domiciliación y desadherirse).
21
+ */
22
+ type TapipayView = "payments" | "autopay";
23
+ /**
24
+ * Opciones requeridas para montar el widget TapiPay.
25
+ */
26
+ interface TapipayOptions {
27
+ /** Selector CSS o elemento DOM donde se montará el widget. */
28
+ container: string | HTMLElement;
29
+ /** Alias de la Organización configurado en el dashboard de TapiPay (ej. "acme"). Corresponde al campo "Alias" en Configuración → Organización. */
30
+ organization: string;
31
+ /** Identificador del cliente en el sistema del cliente (ej. "CLI-001"). */
32
+ identifier: string;
33
+ /** ID externo de la deuda a preseleccionar (ej. número de factura). Aplica a la vista de pagos. */
34
+ externalRequestId?: string;
35
+ /** Estrategia de selección automática de deuda. Aplica a la vista de pagos. */
36
+ selectionStrategy?: "oldestCreated";
37
+ /** Vista a montar. Por defecto la vista de pagos. Usar `'autopay'` para la gestión de adhesiones. */
38
+ view?: TapipayView;
39
+ }
40
+ /**
41
+ * Payload del evento paymentWindowOpened.
42
+ * El popup de Yuno fue abierto exitosamente.
43
+ */
44
+ interface TapipayPaymentWindowOpenedEvent {
45
+ type: "paymentWindowOpened";
46
+ }
47
+ /**
48
+ * Payload del evento paymentSubmitted.
49
+ * El usuario completó el formulario de Yuno y fue redirigido al callback.
50
+ * El estado real del pago se confirma vía webhooks en el backend.
51
+ */
52
+ interface TapipayPaymentSubmittedEvent {
53
+ /** Siempre "TAPIPAY_CALLBACK" */
54
+ type: string;
55
+ /** Estado del pago: siempre "pending" */
56
+ status: "pending";
57
+ /** Parámetros que Yuno haya enviado al callback (pueden estar vacíos) */
58
+ data: Record<string, string>;
59
+ }
60
+ /**
61
+ * Payload del evento paymentCancelled.
62
+ * El usuario cerró el popup sin completar el flujo de pago. Sin campos adicionales.
63
+ */
64
+ type TapipayPaymentCancelledEvent = Record<string, never>;
65
+ /**
66
+ * Tipo de medio adherido expuesto al sitio cliente.
67
+ * Solo se expone el tipo lógico, nunca la marca ni el banco.
68
+ */
69
+ type TapipayAutopayMediaType = "card" | "bank_account";
70
+ /**
71
+ * Resumen mínimo y seguro de una adhesión activa.
72
+ * Privacidad: solo tipo de medio + últimos 4 dígitos. El `id` es un hash opaco
73
+ * del identificador interno de la adhesión (nunca el id crudo).
74
+ */
75
+ interface TapipayAutopayAdhesionSummary {
76
+ /** Hash opaco del identificador de la adhesión. */
77
+ id: string;
78
+ /** Tipo de medio adherido. */
79
+ mediaType: TapipayAutopayMediaType;
80
+ /** Últimos 4 dígitos de la tarjeta o CLABE. `null` si no aplica/disponible. */
81
+ lastFour: string | null;
82
+ }
83
+ /**
84
+ * Payload del evento autopayLoaded.
85
+ * Se dispara al cargar las adhesiones activas y cada vez que el conjunto cambia
86
+ * (refetch, polling o tras una desadhesión), para que el host mantenga su conteo
87
+ * sincronizado. No se dispara durante la carga ni ante un error de carga.
88
+ */
89
+ interface TapipayAutopayLoadedEvent {
90
+ /** Cantidad de adhesiones activas. */
91
+ count: number;
92
+ /** Tipos de medio presentes entre las adhesiones activas (sin duplicados). */
93
+ mediaTypes: TapipayAutopayMediaType[];
94
+ /** Resumen mínimo por adhesión activa. */
95
+ adhesions: TapipayAutopayAdhesionSummary[];
96
+ }
97
+ /**
98
+ * Payload del evento autopayActivated.
99
+ * Una nueva adhesión quedó activa (se dispara una sola vez por adhesión nueva).
100
+ */
101
+ interface TapipayAutopayActivatedEvent {
102
+ /** Hash opaco del identificador de la adhesión activada. */
103
+ id: string;
104
+ /** Tipo de medio de la adhesión activada. */
105
+ mediaType: TapipayAutopayMediaType;
106
+ /** Últimos 4 dígitos del medio activado. `null` si no aplica. */
107
+ lastFour: string | null;
108
+ }
109
+ /**
110
+ * Payload del evento autopayRemoved.
111
+ * El usuario desadhirió un medio con éxito.
112
+ */
113
+ interface TapipayAutopayRemovedEvent {
114
+ /** Hash opaco del identificador de la adhesión desadherida. */
115
+ id: string;
116
+ /** Tipo de medio de la adhesión desadherida. */
117
+ mediaType: TapipayAutopayMediaType;
118
+ /** Últimos 4 dígitos del medio desadherido. `null` si no aplica. */
119
+ lastFour: string | null;
120
+ }
121
+ /**
122
+ * Payload del evento autopayError.
123
+ * Fallo de carga de adhesiones o de desadhesión. El mensaje es neutral: nunca
124
+ * incluye PII ni detalle de credenciales.
125
+ */
126
+ interface TapipayAutopayErrorEvent {
127
+ /** En qué fase ocurrió el fallo. */
128
+ stage: "load" | "remove";
129
+ /** Mensaje neutral para el host. */
130
+ message: string;
131
+ }
132
+ /**
133
+ * Instancia del SDK TapiPay expuesta en window.tapipay y retornada por loadTapipay().
134
+ */
135
+ interface TapipayInstance {
136
+ initialize(options: TapipayOptions): void;
137
+ destroy(container: string | HTMLElement): void;
138
+ on(event: "paymentWindowOpened", handler: (data: TapipayPaymentWindowOpenedEvent) => void): void;
139
+ on(event: "paymentSubmitted", handler: (data: TapipayPaymentSubmittedEvent) => void): void;
140
+ on(event: "paymentCancelled", handler: (data: TapipayPaymentCancelledEvent) => void): void;
141
+ on(event: "autopayLoaded", handler: (data: TapipayAutopayLoadedEvent) => void): void;
142
+ on(event: "autopayActivated", handler: (data: TapipayAutopayActivatedEvent) => void): void;
143
+ on(event: "autopayRemoved", handler: (data: TapipayAutopayRemovedEvent) => void): void;
144
+ on(event: "autopayError", handler: (data: TapipayAutopayErrorEvent) => void): void;
145
+ off(event: "paymentWindowOpened", handler: (data: TapipayPaymentWindowOpenedEvent) => void): void;
146
+ off(event: "paymentSubmitted", handler: (data: TapipayPaymentSubmittedEvent) => void): void;
147
+ off(event: "paymentCancelled", handler: (data: TapipayPaymentCancelledEvent) => void): void;
148
+ off(event: "autopayLoaded", handler: (data: TapipayAutopayLoadedEvent) => void): void;
149
+ off(event: "autopayActivated", handler: (data: TapipayAutopayActivatedEvent) => void): void;
150
+ off(event: "autopayRemoved", handler: (data: TapipayAutopayRemovedEvent) => void): void;
151
+ off(event: "autopayError", handler: (data: TapipayAutopayErrorEvent) => void): void;
152
+ off(event: string, handler: (...args: unknown[]) => unknown): void;
153
+ /** Cola interna usada por el stub antes de que cargue el SDK real. */
154
+ _q?: [string, unknown[]][];
155
+ }
156
+ declare global {
157
+ interface Window {
158
+ tapipay?: TapipayInstance;
159
+ }
160
+ }
161
+
162
+ export type { LoadTapipayOptions as L, TapipayInstance as T, TapipayAutopayActivatedEvent as a, TapipayAutopayAdhesionSummary as b, TapipayAutopayErrorEvent as c, TapipayAutopayLoadedEvent as d, TapipayAutopayMediaType as e, TapipayAutopayRemovedEvent as f, TapipayEnvironment as g, TapipayOptions as h, TapipayPaymentCancelledEvent as i, TapipayPaymentSubmittedEvent as j, TapipayPaymentWindowOpenedEvent as k, TapipayView as l };
@@ -0,0 +1,162 @@
1
+ /**
2
+ * Entorno de ejecución del SDK.
3
+ * - `'production'`: carga desde https://app.tapipay.la/embed.js (default)
4
+ * - `'homo'`: carga desde https://homo.tapipay.la/embed.js
5
+ */
6
+ type TapipayEnvironment = "production" | "homo";
7
+ /**
8
+ * Opciones para `loadTapipay()`.
9
+ */
10
+ interface LoadTapipayOptions {
11
+ /**
12
+ * Entorno a usar. Por defecto `'production'`.
13
+ * Para homologación usar `'homo'`.
14
+ */
15
+ environment?: TapipayEnvironment;
16
+ }
17
+ /**
18
+ * Vista a montar en el widget.
19
+ * - `'payments'` (default si se omite): medios de pago / pago de deuda.
20
+ * - `'autopay'`: gestión de adhesiones (ver domiciliación y desadherirse).
21
+ */
22
+ type TapipayView = "payments" | "autopay";
23
+ /**
24
+ * Opciones requeridas para montar el widget TapiPay.
25
+ */
26
+ interface TapipayOptions {
27
+ /** Selector CSS o elemento DOM donde se montará el widget. */
28
+ container: string | HTMLElement;
29
+ /** Alias de la Organización configurado en el dashboard de TapiPay (ej. "acme"). Corresponde al campo "Alias" en Configuración → Organización. */
30
+ organization: string;
31
+ /** Identificador del cliente en el sistema del cliente (ej. "CLI-001"). */
32
+ identifier: string;
33
+ /** ID externo de la deuda a preseleccionar (ej. número de factura). Aplica a la vista de pagos. */
34
+ externalRequestId?: string;
35
+ /** Estrategia de selección automática de deuda. Aplica a la vista de pagos. */
36
+ selectionStrategy?: "oldestCreated";
37
+ /** Vista a montar. Por defecto la vista de pagos. Usar `'autopay'` para la gestión de adhesiones. */
38
+ view?: TapipayView;
39
+ }
40
+ /**
41
+ * Payload del evento paymentWindowOpened.
42
+ * El popup de Yuno fue abierto exitosamente.
43
+ */
44
+ interface TapipayPaymentWindowOpenedEvent {
45
+ type: "paymentWindowOpened";
46
+ }
47
+ /**
48
+ * Payload del evento paymentSubmitted.
49
+ * El usuario completó el formulario de Yuno y fue redirigido al callback.
50
+ * El estado real del pago se confirma vía webhooks en el backend.
51
+ */
52
+ interface TapipayPaymentSubmittedEvent {
53
+ /** Siempre "TAPIPAY_CALLBACK" */
54
+ type: string;
55
+ /** Estado del pago: siempre "pending" */
56
+ status: "pending";
57
+ /** Parámetros que Yuno haya enviado al callback (pueden estar vacíos) */
58
+ data: Record<string, string>;
59
+ }
60
+ /**
61
+ * Payload del evento paymentCancelled.
62
+ * El usuario cerró el popup sin completar el flujo de pago. Sin campos adicionales.
63
+ */
64
+ type TapipayPaymentCancelledEvent = Record<string, never>;
65
+ /**
66
+ * Tipo de medio adherido expuesto al sitio cliente.
67
+ * Solo se expone el tipo lógico, nunca la marca ni el banco.
68
+ */
69
+ type TapipayAutopayMediaType = "card" | "bank_account";
70
+ /**
71
+ * Resumen mínimo y seguro de una adhesión activa.
72
+ * Privacidad: solo tipo de medio + últimos 4 dígitos. El `id` es un hash opaco
73
+ * del identificador interno de la adhesión (nunca el id crudo).
74
+ */
75
+ interface TapipayAutopayAdhesionSummary {
76
+ /** Hash opaco del identificador de la adhesión. */
77
+ id: string;
78
+ /** Tipo de medio adherido. */
79
+ mediaType: TapipayAutopayMediaType;
80
+ /** Últimos 4 dígitos de la tarjeta o CLABE. `null` si no aplica/disponible. */
81
+ lastFour: string | null;
82
+ }
83
+ /**
84
+ * Payload del evento autopayLoaded.
85
+ * Se dispara al cargar las adhesiones activas y cada vez que el conjunto cambia
86
+ * (refetch, polling o tras una desadhesión), para que el host mantenga su conteo
87
+ * sincronizado. No se dispara durante la carga ni ante un error de carga.
88
+ */
89
+ interface TapipayAutopayLoadedEvent {
90
+ /** Cantidad de adhesiones activas. */
91
+ count: number;
92
+ /** Tipos de medio presentes entre las adhesiones activas (sin duplicados). */
93
+ mediaTypes: TapipayAutopayMediaType[];
94
+ /** Resumen mínimo por adhesión activa. */
95
+ adhesions: TapipayAutopayAdhesionSummary[];
96
+ }
97
+ /**
98
+ * Payload del evento autopayActivated.
99
+ * Una nueva adhesión quedó activa (se dispara una sola vez por adhesión nueva).
100
+ */
101
+ interface TapipayAutopayActivatedEvent {
102
+ /** Hash opaco del identificador de la adhesión activada. */
103
+ id: string;
104
+ /** Tipo de medio de la adhesión activada. */
105
+ mediaType: TapipayAutopayMediaType;
106
+ /** Últimos 4 dígitos del medio activado. `null` si no aplica. */
107
+ lastFour: string | null;
108
+ }
109
+ /**
110
+ * Payload del evento autopayRemoved.
111
+ * El usuario desadhirió un medio con éxito.
112
+ */
113
+ interface TapipayAutopayRemovedEvent {
114
+ /** Hash opaco del identificador de la adhesión desadherida. */
115
+ id: string;
116
+ /** Tipo de medio de la adhesión desadherida. */
117
+ mediaType: TapipayAutopayMediaType;
118
+ /** Últimos 4 dígitos del medio desadherido. `null` si no aplica. */
119
+ lastFour: string | null;
120
+ }
121
+ /**
122
+ * Payload del evento autopayError.
123
+ * Fallo de carga de adhesiones o de desadhesión. El mensaje es neutral: nunca
124
+ * incluye PII ni detalle de credenciales.
125
+ */
126
+ interface TapipayAutopayErrorEvent {
127
+ /** En qué fase ocurrió el fallo. */
128
+ stage: "load" | "remove";
129
+ /** Mensaje neutral para el host. */
130
+ message: string;
131
+ }
132
+ /**
133
+ * Instancia del SDK TapiPay expuesta en window.tapipay y retornada por loadTapipay().
134
+ */
135
+ interface TapipayInstance {
136
+ initialize(options: TapipayOptions): void;
137
+ destroy(container: string | HTMLElement): void;
138
+ on(event: "paymentWindowOpened", handler: (data: TapipayPaymentWindowOpenedEvent) => void): void;
139
+ on(event: "paymentSubmitted", handler: (data: TapipayPaymentSubmittedEvent) => void): void;
140
+ on(event: "paymentCancelled", handler: (data: TapipayPaymentCancelledEvent) => void): void;
141
+ on(event: "autopayLoaded", handler: (data: TapipayAutopayLoadedEvent) => void): void;
142
+ on(event: "autopayActivated", handler: (data: TapipayAutopayActivatedEvent) => void): void;
143
+ on(event: "autopayRemoved", handler: (data: TapipayAutopayRemovedEvent) => void): void;
144
+ on(event: "autopayError", handler: (data: TapipayAutopayErrorEvent) => void): void;
145
+ off(event: "paymentWindowOpened", handler: (data: TapipayPaymentWindowOpenedEvent) => void): void;
146
+ off(event: "paymentSubmitted", handler: (data: TapipayPaymentSubmittedEvent) => void): void;
147
+ off(event: "paymentCancelled", handler: (data: TapipayPaymentCancelledEvent) => void): void;
148
+ off(event: "autopayLoaded", handler: (data: TapipayAutopayLoadedEvent) => void): void;
149
+ off(event: "autopayActivated", handler: (data: TapipayAutopayActivatedEvent) => void): void;
150
+ off(event: "autopayRemoved", handler: (data: TapipayAutopayRemovedEvent) => void): void;
151
+ off(event: "autopayError", handler: (data: TapipayAutopayErrorEvent) => void): void;
152
+ off(event: string, handler: (...args: unknown[]) => unknown): void;
153
+ /** Cola interna usada por el stub antes de que cargue el SDK real. */
154
+ _q?: [string, unknown[]][];
155
+ }
156
+ declare global {
157
+ interface Window {
158
+ tapipay?: TapipayInstance;
159
+ }
160
+ }
161
+
162
+ export type { LoadTapipayOptions as L, TapipayInstance as T, TapipayAutopayActivatedEvent as a, TapipayAutopayAdhesionSummary as b, TapipayAutopayErrorEvent as c, TapipayAutopayLoadedEvent as d, TapipayAutopayMediaType as e, TapipayAutopayRemovedEvent as f, TapipayEnvironment as g, TapipayOptions as h, TapipayPaymentCancelledEvent as i, TapipayPaymentSubmittedEvent as j, TapipayPaymentWindowOpenedEvent as k, TapipayView as l };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@npmtapi/embed",
3
- "version": "1.1.0",
3
+ "version": "1.3.0",
4
4
  "description": "TapiPay Embed SDK — carga y controla el widget de pago embebido",
5
5
  "type": "module",
6
6
  "exports": {
@@ -1,79 +0,0 @@
1
- /**
2
- * Entorno de ejecución del SDK.
3
- * - `'production'`: carga desde https://app.tapipay.la/embed.js (default)
4
- * - `'homo'`: carga desde https://homo.tapipay.la/embed.js
5
- */
6
- type TapipayEnvironment = "production" | "homo";
7
- /**
8
- * Opciones para `loadTapipay()`.
9
- */
10
- interface LoadTapipayOptions {
11
- /**
12
- * Entorno a usar. Por defecto `'production'`.
13
- * Para homologación usar `'homo'`.
14
- */
15
- environment?: TapipayEnvironment;
16
- }
17
- /**
18
- * Opciones requeridas para montar el widget TapiPay.
19
- */
20
- interface TapipayOptions {
21
- /** Selector CSS o elemento DOM donde se montará el widget. */
22
- container: string | HTMLElement;
23
- /** Alias de la Organización configurado en el dashboard de TapiPay (ej. "acme"). Corresponde al campo "Alias" en Configuración → Organización. */
24
- organization: string;
25
- /** Identificador del cliente en el sistema del cliente (ej. "CLI-001"). */
26
- identifier: string;
27
- /** ID externo de la deuda a preseleccionar (ej. número de factura). */
28
- externalRequestId?: string;
29
- /** Estrategia de selección automática de deuda. */
30
- selectionStrategy?: "oldestCreated";
31
- }
32
- /**
33
- * Payload del evento paymentWindowOpened.
34
- * El popup de Yuno fue abierto exitosamente.
35
- */
36
- interface TapipayPaymentWindowOpenedEvent {
37
- type: "paymentWindowOpened";
38
- }
39
- /**
40
- * Payload del evento paymentSubmitted.
41
- * El usuario completó el formulario de Yuno y fue redirigido al callback.
42
- * El estado real del pago se confirma vía webhooks en el backend.
43
- */
44
- interface TapipayPaymentSubmittedEvent {
45
- /** Siempre "TAPIPAY_CALLBACK" */
46
- type: string;
47
- /** Estado del pago: siempre "pending" */
48
- status: "pending";
49
- /** Parámetros que Yuno haya enviado al callback (pueden estar vacíos) */
50
- data: Record<string, string>;
51
- }
52
- /**
53
- * Payload del evento paymentCancelled.
54
- * El usuario cerró el popup sin completar el flujo de pago.
55
- */
56
- type TapipayPaymentCancelledEvent = {};
57
- /**
58
- * Instancia del SDK TapiPay expuesta en window.tapipay y retornada por loadTapipay().
59
- */
60
- interface TapipayInstance {
61
- initialize(options: TapipayOptions): void;
62
- destroy(container: string | HTMLElement): void;
63
- on(event: "paymentWindowOpened", handler: (data: TapipayPaymentWindowOpenedEvent) => void): void;
64
- on(event: "paymentSubmitted", handler: (data: TapipayPaymentSubmittedEvent) => void): void;
65
- on(event: "paymentCancelled", handler: (data: TapipayPaymentCancelledEvent) => void): void;
66
- off(event: "paymentWindowOpened", handler: (data: TapipayPaymentWindowOpenedEvent) => void): void;
67
- off(event: "paymentSubmitted", handler: (data: TapipayPaymentSubmittedEvent) => void): void;
68
- off(event: "paymentCancelled", handler: (data: TapipayPaymentCancelledEvent) => void): void;
69
- off(event: string, handler: (...args: unknown[]) => unknown): void;
70
- /** Cola interna usada por el stub antes de que cargue el SDK real. */
71
- _q?: [string, unknown[]][];
72
- }
73
- declare global {
74
- interface Window {
75
- tapipay?: TapipayInstance;
76
- }
77
- }
78
-
79
- export type { LoadTapipayOptions as L, TapipayInstance as T, TapipayEnvironment as a, TapipayOptions as b, TapipayPaymentCancelledEvent as c, TapipayPaymentSubmittedEvent as d, TapipayPaymentWindowOpenedEvent as e };
@@ -1,79 +0,0 @@
1
- /**
2
- * Entorno de ejecución del SDK.
3
- * - `'production'`: carga desde https://app.tapipay.la/embed.js (default)
4
- * - `'homo'`: carga desde https://homo.tapipay.la/embed.js
5
- */
6
- type TapipayEnvironment = "production" | "homo";
7
- /**
8
- * Opciones para `loadTapipay()`.
9
- */
10
- interface LoadTapipayOptions {
11
- /**
12
- * Entorno a usar. Por defecto `'production'`.
13
- * Para homologación usar `'homo'`.
14
- */
15
- environment?: TapipayEnvironment;
16
- }
17
- /**
18
- * Opciones requeridas para montar el widget TapiPay.
19
- */
20
- interface TapipayOptions {
21
- /** Selector CSS o elemento DOM donde se montará el widget. */
22
- container: string | HTMLElement;
23
- /** Alias de la Organización configurado en el dashboard de TapiPay (ej. "acme"). Corresponde al campo "Alias" en Configuración → Organización. */
24
- organization: string;
25
- /** Identificador del cliente en el sistema del cliente (ej. "CLI-001"). */
26
- identifier: string;
27
- /** ID externo de la deuda a preseleccionar (ej. número de factura). */
28
- externalRequestId?: string;
29
- /** Estrategia de selección automática de deuda. */
30
- selectionStrategy?: "oldestCreated";
31
- }
32
- /**
33
- * Payload del evento paymentWindowOpened.
34
- * El popup de Yuno fue abierto exitosamente.
35
- */
36
- interface TapipayPaymentWindowOpenedEvent {
37
- type: "paymentWindowOpened";
38
- }
39
- /**
40
- * Payload del evento paymentSubmitted.
41
- * El usuario completó el formulario de Yuno y fue redirigido al callback.
42
- * El estado real del pago se confirma vía webhooks en el backend.
43
- */
44
- interface TapipayPaymentSubmittedEvent {
45
- /** Siempre "TAPIPAY_CALLBACK" */
46
- type: string;
47
- /** Estado del pago: siempre "pending" */
48
- status: "pending";
49
- /** Parámetros que Yuno haya enviado al callback (pueden estar vacíos) */
50
- data: Record<string, string>;
51
- }
52
- /**
53
- * Payload del evento paymentCancelled.
54
- * El usuario cerró el popup sin completar el flujo de pago.
55
- */
56
- type TapipayPaymentCancelledEvent = {};
57
- /**
58
- * Instancia del SDK TapiPay expuesta en window.tapipay y retornada por loadTapipay().
59
- */
60
- interface TapipayInstance {
61
- initialize(options: TapipayOptions): void;
62
- destroy(container: string | HTMLElement): void;
63
- on(event: "paymentWindowOpened", handler: (data: TapipayPaymentWindowOpenedEvent) => void): void;
64
- on(event: "paymentSubmitted", handler: (data: TapipayPaymentSubmittedEvent) => void): void;
65
- on(event: "paymentCancelled", handler: (data: TapipayPaymentCancelledEvent) => void): void;
66
- off(event: "paymentWindowOpened", handler: (data: TapipayPaymentWindowOpenedEvent) => void): void;
67
- off(event: "paymentSubmitted", handler: (data: TapipayPaymentSubmittedEvent) => void): void;
68
- off(event: "paymentCancelled", handler: (data: TapipayPaymentCancelledEvent) => void): void;
69
- off(event: string, handler: (...args: unknown[]) => unknown): void;
70
- /** Cola interna usada por el stub antes de que cargue el SDK real. */
71
- _q?: [string, unknown[]][];
72
- }
73
- declare global {
74
- interface Window {
75
- tapipay?: TapipayInstance;
76
- }
77
- }
78
-
79
- export type { LoadTapipayOptions as L, TapipayInstance as T, TapipayEnvironment as a, TapipayOptions as b, TapipayPaymentCancelledEvent as c, TapipayPaymentSubmittedEvent as d, TapipayPaymentWindowOpenedEvent as e };