@npmtapi/embed 1.2.0 → 1.4.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 +24 -3
- package/dist/{chunk-2WNQZXMS.js → chunk-IZQ3PVG6.js} +1 -1
- package/dist/chunk-IZQ3PVG6.js.map +1 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +4 -2
- package/dist/index.d.ts +4 -2
- package/dist/index.js +1 -1
- package/dist/react.cjs +14 -0
- package/dist/react.cjs.map +1 -1
- package/dist/react.d.cts +12 -2
- package/dist/react.d.ts +12 -2
- package/dist/react.js +15 -1
- package/dist/react.js.map +1 -1
- package/dist/{types-DHQb-NNM.d.cts → types-BPz2Gtxx.d.cts} +28 -3
- package/dist/{types-DHQb-NNM.d.ts → types-BPz2Gtxx.d.ts} +28 -3
- package/package.json +1 -1
- package/dist/chunk-2WNQZXMS.js.map +0 -1
package/README.md
CHANGED
|
@@ -34,13 +34,15 @@ Los tipos están incluidos — no necesitas `@types/tapipay`.
|
|
|
34
34
|
|
|
35
35
|
### Script tag (sin bundler)
|
|
36
36
|
|
|
37
|
+
Se requiere `container` + `identifier` + **uno de** `organization` o `companyCode` (si se pasan ambos, `companyCode` tiene prioridad).
|
|
38
|
+
|
|
37
39
|
```html
|
|
38
40
|
<script src="https://app.tapipay.la/embed.js"></script>
|
|
39
41
|
<div id="widget"></div>
|
|
40
42
|
<script>
|
|
41
43
|
tapipay.initialize({
|
|
42
44
|
container: "#widget",
|
|
43
|
-
organization: "acme",
|
|
45
|
+
organization: "acme", // o companyCode: "acme-mx"
|
|
44
46
|
identifier: "CLI-001"
|
|
45
47
|
});
|
|
46
48
|
|
|
@@ -88,9 +90,12 @@ export function PagoPage({ clienteId }: { clienteId: string }) {
|
|
|
88
90
|
|
|
89
91
|
### Props
|
|
90
92
|
|
|
93
|
+
Se requiere `identifier` + **uno de** `organization` o `companyCode`. Si se pasan ambos, `companyCode` tiene prioridad.
|
|
94
|
+
|
|
91
95
|
| Prop | Tipo | Requerido | Por defecto | Descripción |
|
|
92
96
|
|------|------|-----------|-------------|-------------|
|
|
93
|
-
| `organization` | `string` |
|
|
97
|
+
| `organization` | `string` | Uno de los dos | — | Alias de la organización en TapiPay. Requerido si no se pasa `companyCode` |
|
|
98
|
+
| `companyCode` | `string` | Uno de los dos | — | Código de compañía en TapiPay. Alternativa a `organization`. Si se pasan ambos, `companyCode` tiene prioridad |
|
|
94
99
|
| `identifier` | `string` | Sí | — | Identificador del cliente |
|
|
95
100
|
| `externalRequestId` | `string` | No | — | ID de deuda a preseleccionar. Tiene precedencia sobre `selectionStrategy` |
|
|
96
101
|
| `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 |
|
|
@@ -100,6 +105,7 @@ export function PagoPage({ clienteId }: { clienteId: string }) {
|
|
|
100
105
|
| `onPaymentSubmitted` | `(data) => void` | No | — | Callback cuando el usuario completó el formulario de Yuno y fue redirigido al callback |
|
|
101
106
|
| `onCancelled` | `() => void` | No | — | Callback cuando el usuario cierra el popup sin completar el pago |
|
|
102
107
|
| `onAutopayLoaded` | `(data) => void` | No | — | (Vista autopay) Callback con las adhesiones activas; se reinvoca cuando la lista cambia |
|
|
108
|
+
| `onAutopayActivated` | `(data) => void` | No | — | (Vista autopay) Callback cuando una nueva domiciliación queda activa (una sola vez por adhesión nueva) |
|
|
103
109
|
| `onAutopayRemoved` | `(data) => void` | No | — | (Vista autopay) Callback cuando el usuario desadhiere un medio con éxito |
|
|
104
110
|
| `onAutopayError` | `(data) => void` | No | — | (Vista autopay) Callback ante un error de carga o de desadhesión |
|
|
105
111
|
| `className` | `string` | No | — | Clases CSS del contenedor |
|
|
@@ -203,10 +209,13 @@ export class TapipayWidgetComponent implements OnInit, OnDestroy {
|
|
|
203
209
|
|
|
204
210
|
### `initialize(options)`
|
|
205
211
|
|
|
212
|
+
Se requiere `container` + `identifier` + **uno de** `organization` o `companyCode`. Si se pasan ambos, `companyCode` tiene prioridad.
|
|
213
|
+
|
|
206
214
|
| Parámetro | Tipo | Requerido | Por defecto | Descripción |
|
|
207
215
|
|-----------|------|-----------|-------------|-------------|
|
|
208
216
|
| `container` | `string \| HTMLElement` | Sí | — | Selector CSS o referencia DOM |
|
|
209
|
-
| `organization` | `string` |
|
|
217
|
+
| `organization` | `string` | Uno de los dos | — | Alias de la organización en TapiPay. Requerido si no se pasa `companyCode` |
|
|
218
|
+
| `companyCode` | `string` | Uno de los dos | — | Código de compañía en TapiPay. Alternativa a `organization`. Si se pasan ambos, `companyCode` tiene prioridad |
|
|
210
219
|
| `identifier` | `string` | Sí | — | Identificador del cliente (DNI, número de cuenta, etc.) |
|
|
211
220
|
| `externalRequestId` | `string` | No | — | ID externo de una deuda específica a preseleccionar. Tiene precedencia sobre `selectionStrategy` |
|
|
212
221
|
| `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 |
|
|
@@ -288,6 +297,9 @@ Pasando `view: "autopay"` el widget monta la **gestión de adhesiones**: el usua
|
|
|
288
297
|
tapipay.on("autopayLoaded", function(data) {
|
|
289
298
|
console.log("Adhesiones activas:", data.count);
|
|
290
299
|
});
|
|
300
|
+
tapipay.on("autopayActivated", function(data) {
|
|
301
|
+
console.log("Nueva adhesión activa:", data.mediaType, data.lastFour);
|
|
302
|
+
});
|
|
291
303
|
tapipay.on("autopayRemoved", function(data) {
|
|
292
304
|
console.log("Medio desadherido:", data.mediaType, data.lastFour);
|
|
293
305
|
});
|
|
@@ -309,6 +321,7 @@ export function AdhesionesPage({ clienteId }: { clienteId: string }) {
|
|
|
309
321
|
organization="acme"
|
|
310
322
|
identifier={clienteId}
|
|
311
323
|
onAutopayLoaded={(data) => console.log("Adhesiones activas:", data.count)}
|
|
324
|
+
onAutopayActivated={(data) => console.log("Nueva adhesión activa:", data.mediaType)}
|
|
312
325
|
onAutopayRemoved={(data) => console.log("Desadherido:", data.mediaType)}
|
|
313
326
|
onAutopayError={(data) => console.log("Error:", data.stage)}
|
|
314
327
|
/>
|
|
@@ -329,6 +342,12 @@ interface TapipayAutopayLoadedEvent {
|
|
|
329
342
|
}>;
|
|
330
343
|
}
|
|
331
344
|
|
|
345
|
+
interface TapipayAutopayActivatedEvent {
|
|
346
|
+
id: string; // hash opaco
|
|
347
|
+
mediaType: "card" | "bank_account";
|
|
348
|
+
lastFour: string | null; // últimos 4 dígitos
|
|
349
|
+
}
|
|
350
|
+
|
|
332
351
|
interface TapipayAutopayRemovedEvent {
|
|
333
352
|
id: string;
|
|
334
353
|
mediaType: "card" | "bank_account";
|
|
@@ -343,6 +362,8 @@ interface TapipayAutopayErrorEvent {
|
|
|
343
362
|
|
|
344
363
|
> `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`.
|
|
345
364
|
|
|
365
|
+
> `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.
|
|
366
|
+
|
|
346
367
|
---
|
|
347
368
|
|
|
348
369
|
## Entorno de homologación
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/loader.ts"],"sourcesContent":["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 * // Se requiere UNO de { organization, companyCode } (companyCode tiene prioridad).\n * tapipay.initialize({ container: \"#widget\", organization: \"acme\", identifier: \"CLI-001\" });\n * tapipay.initialize({ container: \"#widget\", companyCode: \"acme-mx\", 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":";AAMA,IAAM,WAA+C;AAAA,EACpD,YAAY;AAAA,EACZ,MAAM;AACP;AAGA,IAAM,eAAe,oBAAI,IAAkD;AAoBpE,SAAS,YACf,SAC2B;AAlC5B;AAmCC,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.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/loader.ts"],"sourcesContent":["export { loadTapipay } from \"./loader\";\nexport type {\n\tLoadTapipayOptions,\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;
|
|
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 * // Se requiere UNO de { organization, companyCode } (companyCode tiene prioridad).\n * tapipay.initialize({ container: \"#widget\", organization: \"acme\", identifier: \"CLI-001\" });\n * tapipay.initialize({ container: \"#widget\", companyCode: \"acme-mx\", 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;AAoBpE,SAAS,YACf,SAC2B;AAlC5B;AAmCC,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-
|
|
2
|
-
export { a as
|
|
1
|
+
import { L as LoadTapipayOptions, T as TapipayInstance } from './types-BPz2Gtxx.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-BPz2Gtxx.cjs';
|
|
3
3
|
|
|
4
4
|
/**
|
|
5
5
|
* Carga el SDK de TapiPay de forma asíncrona inyectando el script en el DOM.
|
|
@@ -15,7 +15,9 @@ export { a as TapipayAutopayAdhesionSummary, b as TapipayAutopayErrorEvent, c as
|
|
|
15
15
|
* // Homologación
|
|
16
16
|
* const tapipay = await loadTapipay({ environment: 'homo' });
|
|
17
17
|
*
|
|
18
|
+
* // Se requiere UNO de { organization, companyCode } (companyCode tiene prioridad).
|
|
18
19
|
* tapipay.initialize({ container: "#widget", organization: "acme", identifier: "CLI-001" });
|
|
20
|
+
* tapipay.initialize({ container: "#widget", companyCode: "acme-mx", identifier: "CLI-001" });
|
|
19
21
|
*/
|
|
20
22
|
declare function loadTapipay(options?: LoadTapipayOptions): Promise<TapipayInstance>;
|
|
21
23
|
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { L as LoadTapipayOptions, T as TapipayInstance } from './types-
|
|
2
|
-
export { a as
|
|
1
|
+
import { L as LoadTapipayOptions, T as TapipayInstance } from './types-BPz2Gtxx.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-BPz2Gtxx.js';
|
|
3
3
|
|
|
4
4
|
/**
|
|
5
5
|
* Carga el SDK de TapiPay de forma asíncrona inyectando el script en el DOM.
|
|
@@ -15,7 +15,9 @@ export { a as TapipayAutopayAdhesionSummary, b as TapipayAutopayErrorEvent, c as
|
|
|
15
15
|
* // Homologación
|
|
16
16
|
* const tapipay = await loadTapipay({ environment: 'homo' });
|
|
17
17
|
*
|
|
18
|
+
* // Se requiere UNO de { organization, companyCode } (companyCode tiene prioridad).
|
|
18
19
|
* tapipay.initialize({ container: "#widget", organization: "acme", identifier: "CLI-001" });
|
|
20
|
+
* tapipay.initialize({ container: "#widget", companyCode: "acme-mx", identifier: "CLI-001" });
|
|
19
21
|
*/
|
|
20
22
|
declare function loadTapipay(options?: LoadTapipayOptions): Promise<TapipayInstance>;
|
|
21
23
|
|
package/dist/index.js
CHANGED
package/dist/react.cjs
CHANGED
|
@@ -104,6 +104,7 @@ function useTapipay(options) {
|
|
|
104
104
|
}
|
|
105
105
|
function TapipayWidget({
|
|
106
106
|
organization,
|
|
107
|
+
companyCode,
|
|
107
108
|
identifier,
|
|
108
109
|
externalRequestId,
|
|
109
110
|
selectionStrategy,
|
|
@@ -113,6 +114,7 @@ function TapipayWidget({
|
|
|
113
114
|
onPaymentSubmitted,
|
|
114
115
|
onCancelled,
|
|
115
116
|
onAutopayLoaded,
|
|
117
|
+
onAutopayActivated,
|
|
116
118
|
onAutopayRemoved,
|
|
117
119
|
onAutopayError,
|
|
118
120
|
className,
|
|
@@ -123,6 +125,7 @@ function TapipayWidget({
|
|
|
123
125
|
const onPaymentSubmittedRef = (0, import_react.useRef)(onPaymentSubmitted);
|
|
124
126
|
const onCancelledRef = (0, import_react.useRef)(onCancelled);
|
|
125
127
|
const onAutopayLoadedRef = (0, import_react.useRef)(onAutopayLoaded);
|
|
128
|
+
const onAutopayActivatedRef = (0, import_react.useRef)(onAutopayActivated);
|
|
126
129
|
const onAutopayRemovedRef = (0, import_react.useRef)(onAutopayRemoved);
|
|
127
130
|
const onAutopayErrorRef = (0, import_react.useRef)(onAutopayError);
|
|
128
131
|
(0, import_react.useEffect)(() => {
|
|
@@ -137,6 +140,9 @@ function TapipayWidget({
|
|
|
137
140
|
(0, import_react.useEffect)(() => {
|
|
138
141
|
onAutopayLoadedRef.current = onAutopayLoaded;
|
|
139
142
|
}, [onAutopayLoaded]);
|
|
143
|
+
(0, import_react.useEffect)(() => {
|
|
144
|
+
onAutopayActivatedRef.current = onAutopayActivated;
|
|
145
|
+
}, [onAutopayActivated]);
|
|
140
146
|
(0, import_react.useEffect)(() => {
|
|
141
147
|
onAutopayRemovedRef.current = onAutopayRemoved;
|
|
142
148
|
}, [onAutopayRemoved]);
|
|
@@ -164,6 +170,10 @@ function TapipayWidget({
|
|
|
164
170
|
var _a;
|
|
165
171
|
(_a = onAutopayLoadedRef.current) == null ? void 0 : _a.call(onAutopayLoadedRef, data);
|
|
166
172
|
};
|
|
173
|
+
const handleAutopayActivated = (data) => {
|
|
174
|
+
var _a;
|
|
175
|
+
(_a = onAutopayActivatedRef.current) == null ? void 0 : _a.call(onAutopayActivatedRef, data);
|
|
176
|
+
};
|
|
167
177
|
const handleAutopayRemoved = (data) => {
|
|
168
178
|
var _a;
|
|
169
179
|
(_a = onAutopayRemovedRef.current) == null ? void 0 : _a.call(onAutopayRemovedRef, data);
|
|
@@ -179,11 +189,13 @@ function TapipayWidget({
|
|
|
179
189
|
instance.on("paymentSubmitted", handlePaymentSubmitted);
|
|
180
190
|
instance.on("paymentCancelled", handleCancelled);
|
|
181
191
|
instance.on("autopayLoaded", handleAutopayLoaded);
|
|
192
|
+
instance.on("autopayActivated", handleAutopayActivated);
|
|
182
193
|
instance.on("autopayRemoved", handleAutopayRemoved);
|
|
183
194
|
instance.on("autopayError", handleAutopayError);
|
|
184
195
|
instance.initialize({
|
|
185
196
|
container,
|
|
186
197
|
organization,
|
|
198
|
+
companyCode,
|
|
187
199
|
identifier,
|
|
188
200
|
externalRequestId,
|
|
189
201
|
selectionStrategy,
|
|
@@ -197,6 +209,7 @@ function TapipayWidget({
|
|
|
197
209
|
tapipayInstance.off("paymentSubmitted", handlePaymentSubmitted);
|
|
198
210
|
tapipayInstance.off("paymentCancelled", handleCancelled);
|
|
199
211
|
tapipayInstance.off("autopayLoaded", handleAutopayLoaded);
|
|
212
|
+
tapipayInstance.off("autopayActivated", handleAutopayActivated);
|
|
200
213
|
tapipayInstance.off("autopayRemoved", handleAutopayRemoved);
|
|
201
214
|
tapipayInstance.off("autopayError", handleAutopayError);
|
|
202
215
|
tapipayInstance.destroy(container);
|
|
@@ -204,6 +217,7 @@ function TapipayWidget({
|
|
|
204
217
|
};
|
|
205
218
|
}, [
|
|
206
219
|
organization,
|
|
220
|
+
companyCode,
|
|
207
221
|
identifier,
|
|
208
222
|
externalRequestId,
|
|
209
223
|
selectionStrategy,
|
package/dist/react.cjs.map
CHANGED
|
@@ -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\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 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 * 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\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 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\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 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(\"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(\"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":[]}
|
|
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 * Se requiere `identifier` + UNO de `{ organization, companyCode }`.\n * Si se pasan ambos, `companyCode` tiene prioridad.\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 * // Usando companyCode en lugar de organization\n * <TapipayWidget companyCode=\"acme-mx\" identifier=\"CLI-001\" />\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\tcompanyCode,\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\tcompanyCode,\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\tcompanyCode,\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 * // Se requiere UNO de { organization, companyCode } (companyCode tiene prioridad).\n * tapipay.initialize({ container: \"#widget\", organization: \"acme\", identifier: \"CLI-001\" });\n * tapipay.initialize({ container: \"#widget\", companyCode: \"acme-mx\", 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 {
|
|
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-BPz2Gtxx.cjs';
|
|
3
3
|
|
|
4
4
|
/**
|
|
5
5
|
* Hook de bajo nivel que carga el SDK y retorna la instancia.
|
|
@@ -24,6 +24,8 @@ interface TapipayWidgetProps extends Omit<TapipayOptions, "container"> {
|
|
|
24
24
|
onCancelled?: (data: TapipayPaymentCancelledEvent) => void;
|
|
25
25
|
/** (Vista autopay) Callback con el conjunto de adhesiones activas; se reinvoca cuando la lista cambia. */
|
|
26
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;
|
|
27
29
|
/** (Vista autopay) Callback cuando el usuario desadhiere un medio con éxito. */
|
|
28
30
|
onAutopayRemoved?: (data: TapipayAutopayRemovedEvent) => void;
|
|
29
31
|
/** (Vista autopay) Callback ante un error de carga de adhesiones o de desadhesión. */
|
|
@@ -39,6 +41,9 @@ interface TapipayWidgetProps extends Omit<TapipayOptions, "container"> {
|
|
|
39
41
|
* Maneja internamente la carga del SDK, el ciclo de vida del widget
|
|
40
42
|
* y el cleanup al desmontar. Compatible con React Strict Mode.
|
|
41
43
|
*
|
|
44
|
+
* Se requiere `identifier` + UNO de `{ organization, companyCode }`.
|
|
45
|
+
* Si se pasan ambos, `companyCode` tiene prioridad.
|
|
46
|
+
*
|
|
42
47
|
* @example
|
|
43
48
|
* // Vista de pagos (default)
|
|
44
49
|
* <TapipayWidget
|
|
@@ -50,15 +55,20 @@ interface TapipayWidgetProps extends Omit<TapipayOptions, "container"> {
|
|
|
50
55
|
* />
|
|
51
56
|
*
|
|
52
57
|
* @example
|
|
58
|
+
* // Usando companyCode en lugar de organization
|
|
59
|
+
* <TapipayWidget companyCode="acme-mx" identifier="CLI-001" />
|
|
60
|
+
*
|
|
61
|
+
* @example
|
|
53
62
|
* // Vista de gestión de adhesiones de autopay
|
|
54
63
|
* <TapipayWidget
|
|
55
64
|
* organization="acme"
|
|
56
65
|
* identifier="CLI-001"
|
|
57
66
|
* view="autopay"
|
|
58
67
|
* onAutopayLoaded={(data) => console.log("Adhesiones", data.count)}
|
|
68
|
+
* onAutopayActivated={(data) => console.log("Adhesión activada", data.id)}
|
|
59
69
|
* onAutopayRemoved={(data) => console.log("Adhesión eliminada", data.id)}
|
|
60
70
|
* />
|
|
61
71
|
*/
|
|
62
|
-
declare function TapipayWidget({ organization, identifier, externalRequestId, selectionStrategy, view, environment, onPaymentWindowOpened, onPaymentSubmitted, onCancelled, onAutopayLoaded, onAutopayRemoved, onAutopayError, className, style, }: TapipayWidgetProps): react_jsx_runtime.JSX.Element;
|
|
72
|
+
declare function TapipayWidget({ organization, companyCode, identifier, externalRequestId, selectionStrategy, view, environment, onPaymentWindowOpened, onPaymentSubmitted, onCancelled, onAutopayLoaded, onAutopayActivated, onAutopayRemoved, onAutopayError, className, style, }: TapipayWidgetProps): react_jsx_runtime.JSX.Element;
|
|
63
73
|
|
|
64
74
|
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 {
|
|
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-BPz2Gtxx.js';
|
|
3
3
|
|
|
4
4
|
/**
|
|
5
5
|
* Hook de bajo nivel que carga el SDK y retorna la instancia.
|
|
@@ -24,6 +24,8 @@ interface TapipayWidgetProps extends Omit<TapipayOptions, "container"> {
|
|
|
24
24
|
onCancelled?: (data: TapipayPaymentCancelledEvent) => void;
|
|
25
25
|
/** (Vista autopay) Callback con el conjunto de adhesiones activas; se reinvoca cuando la lista cambia. */
|
|
26
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;
|
|
27
29
|
/** (Vista autopay) Callback cuando el usuario desadhiere un medio con éxito. */
|
|
28
30
|
onAutopayRemoved?: (data: TapipayAutopayRemovedEvent) => void;
|
|
29
31
|
/** (Vista autopay) Callback ante un error de carga de adhesiones o de desadhesión. */
|
|
@@ -39,6 +41,9 @@ interface TapipayWidgetProps extends Omit<TapipayOptions, "container"> {
|
|
|
39
41
|
* Maneja internamente la carga del SDK, el ciclo de vida del widget
|
|
40
42
|
* y el cleanup al desmontar. Compatible con React Strict Mode.
|
|
41
43
|
*
|
|
44
|
+
* Se requiere `identifier` + UNO de `{ organization, companyCode }`.
|
|
45
|
+
* Si se pasan ambos, `companyCode` tiene prioridad.
|
|
46
|
+
*
|
|
42
47
|
* @example
|
|
43
48
|
* // Vista de pagos (default)
|
|
44
49
|
* <TapipayWidget
|
|
@@ -50,15 +55,20 @@ interface TapipayWidgetProps extends Omit<TapipayOptions, "container"> {
|
|
|
50
55
|
* />
|
|
51
56
|
*
|
|
52
57
|
* @example
|
|
58
|
+
* // Usando companyCode en lugar de organization
|
|
59
|
+
* <TapipayWidget companyCode="acme-mx" identifier="CLI-001" />
|
|
60
|
+
*
|
|
61
|
+
* @example
|
|
53
62
|
* // Vista de gestión de adhesiones de autopay
|
|
54
63
|
* <TapipayWidget
|
|
55
64
|
* organization="acme"
|
|
56
65
|
* identifier="CLI-001"
|
|
57
66
|
* view="autopay"
|
|
58
67
|
* onAutopayLoaded={(data) => console.log("Adhesiones", data.count)}
|
|
68
|
+
* onAutopayActivated={(data) => console.log("Adhesión activada", data.id)}
|
|
59
69
|
* onAutopayRemoved={(data) => console.log("Adhesión eliminada", data.id)}
|
|
60
70
|
* />
|
|
61
71
|
*/
|
|
62
|
-
declare function TapipayWidget({ organization, identifier, externalRequestId, selectionStrategy, view, environment, onPaymentWindowOpened, onPaymentSubmitted, onCancelled, onAutopayLoaded, onAutopayRemoved, onAutopayError, className, style, }: TapipayWidgetProps): react_jsx_runtime.JSX.Element;
|
|
72
|
+
declare function TapipayWidget({ organization, companyCode, identifier, externalRequestId, selectionStrategy, view, environment, onPaymentWindowOpened, onPaymentSubmitted, onCancelled, onAutopayLoaded, onAutopayActivated, onAutopayRemoved, onAutopayError, className, style, }: TapipayWidgetProps): react_jsx_runtime.JSX.Element;
|
|
63
73
|
|
|
64
74
|
export { TapipayWidget, type TapipayWidgetProps, useTapipay };
|
package/dist/react.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
loadTapipay
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-IZQ3PVG6.js";
|
|
4
4
|
|
|
5
5
|
// src/react.tsx
|
|
6
6
|
import { useEffect, useRef, useState } from "react";
|
|
@@ -24,6 +24,7 @@ function useTapipay(options) {
|
|
|
24
24
|
}
|
|
25
25
|
function TapipayWidget({
|
|
26
26
|
organization,
|
|
27
|
+
companyCode,
|
|
27
28
|
identifier,
|
|
28
29
|
externalRequestId,
|
|
29
30
|
selectionStrategy,
|
|
@@ -33,6 +34,7 @@ function TapipayWidget({
|
|
|
33
34
|
onPaymentSubmitted,
|
|
34
35
|
onCancelled,
|
|
35
36
|
onAutopayLoaded,
|
|
37
|
+
onAutopayActivated,
|
|
36
38
|
onAutopayRemoved,
|
|
37
39
|
onAutopayError,
|
|
38
40
|
className,
|
|
@@ -43,6 +45,7 @@ function TapipayWidget({
|
|
|
43
45
|
const onPaymentSubmittedRef = useRef(onPaymentSubmitted);
|
|
44
46
|
const onCancelledRef = useRef(onCancelled);
|
|
45
47
|
const onAutopayLoadedRef = useRef(onAutopayLoaded);
|
|
48
|
+
const onAutopayActivatedRef = useRef(onAutopayActivated);
|
|
46
49
|
const onAutopayRemovedRef = useRef(onAutopayRemoved);
|
|
47
50
|
const onAutopayErrorRef = useRef(onAutopayError);
|
|
48
51
|
useEffect(() => {
|
|
@@ -57,6 +60,9 @@ function TapipayWidget({
|
|
|
57
60
|
useEffect(() => {
|
|
58
61
|
onAutopayLoadedRef.current = onAutopayLoaded;
|
|
59
62
|
}, [onAutopayLoaded]);
|
|
63
|
+
useEffect(() => {
|
|
64
|
+
onAutopayActivatedRef.current = onAutopayActivated;
|
|
65
|
+
}, [onAutopayActivated]);
|
|
60
66
|
useEffect(() => {
|
|
61
67
|
onAutopayRemovedRef.current = onAutopayRemoved;
|
|
62
68
|
}, [onAutopayRemoved]);
|
|
@@ -84,6 +90,10 @@ function TapipayWidget({
|
|
|
84
90
|
var _a;
|
|
85
91
|
(_a = onAutopayLoadedRef.current) == null ? void 0 : _a.call(onAutopayLoadedRef, data);
|
|
86
92
|
};
|
|
93
|
+
const handleAutopayActivated = (data) => {
|
|
94
|
+
var _a;
|
|
95
|
+
(_a = onAutopayActivatedRef.current) == null ? void 0 : _a.call(onAutopayActivatedRef, data);
|
|
96
|
+
};
|
|
87
97
|
const handleAutopayRemoved = (data) => {
|
|
88
98
|
var _a;
|
|
89
99
|
(_a = onAutopayRemovedRef.current) == null ? void 0 : _a.call(onAutopayRemovedRef, data);
|
|
@@ -99,11 +109,13 @@ function TapipayWidget({
|
|
|
99
109
|
instance.on("paymentSubmitted", handlePaymentSubmitted);
|
|
100
110
|
instance.on("paymentCancelled", handleCancelled);
|
|
101
111
|
instance.on("autopayLoaded", handleAutopayLoaded);
|
|
112
|
+
instance.on("autopayActivated", handleAutopayActivated);
|
|
102
113
|
instance.on("autopayRemoved", handleAutopayRemoved);
|
|
103
114
|
instance.on("autopayError", handleAutopayError);
|
|
104
115
|
instance.initialize({
|
|
105
116
|
container,
|
|
106
117
|
organization,
|
|
118
|
+
companyCode,
|
|
107
119
|
identifier,
|
|
108
120
|
externalRequestId,
|
|
109
121
|
selectionStrategy,
|
|
@@ -117,6 +129,7 @@ function TapipayWidget({
|
|
|
117
129
|
tapipayInstance.off("paymentSubmitted", handlePaymentSubmitted);
|
|
118
130
|
tapipayInstance.off("paymentCancelled", handleCancelled);
|
|
119
131
|
tapipayInstance.off("autopayLoaded", handleAutopayLoaded);
|
|
132
|
+
tapipayInstance.off("autopayActivated", handleAutopayActivated);
|
|
120
133
|
tapipayInstance.off("autopayRemoved", handleAutopayRemoved);
|
|
121
134
|
tapipayInstance.off("autopayError", handleAutopayError);
|
|
122
135
|
tapipayInstance.destroy(container);
|
|
@@ -124,6 +137,7 @@ function TapipayWidget({
|
|
|
124
137
|
};
|
|
125
138
|
}, [
|
|
126
139
|
organization,
|
|
140
|
+
companyCode,
|
|
127
141
|
identifier,
|
|
128
142
|
externalRequestId,
|
|
129
143
|
selectionStrategy,
|
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\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 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 * 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\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 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\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 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(\"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(\"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":"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","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 * Se requiere `identifier` + UNO de `{ organization, companyCode }`.\n * Si se pasan ambos, `companyCode` tiene prioridad.\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 * // Usando companyCode en lugar de organization\n * <TapipayWidget companyCode=\"acme-mx\" identifier=\"CLI-001\" />\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\tcompanyCode,\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\tcompanyCode,\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\tcompanyCode,\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":"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","names":[]}
|
|
@@ -22,12 +22,23 @@ interface LoadTapipayOptions {
|
|
|
22
22
|
type TapipayView = "payments" | "autopay";
|
|
23
23
|
/**
|
|
24
24
|
* Opciones requeridas para montar el widget TapiPay.
|
|
25
|
+
*
|
|
26
|
+
* Se requiere `container` + `identifier` + UNO de `{ organization, companyCode }`.
|
|
27
|
+
* Si se pasan ambos, `companyCode` tiene prioridad.
|
|
25
28
|
*/
|
|
26
29
|
interface TapipayOptions {
|
|
27
30
|
/** Selector CSS o elemento DOM donde se montará el widget. */
|
|
28
31
|
container: string | HTMLElement;
|
|
29
|
-
/**
|
|
30
|
-
|
|
32
|
+
/**
|
|
33
|
+
* Alias de la Organización configurado en el dashboard de TapiPay (ej. "acme"). Corresponde al campo "Alias" en Configuración → Organización.
|
|
34
|
+
* Se requiere `organization` O `companyCode`. Si se pasan ambos, `companyCode` tiene prioridad.
|
|
35
|
+
*/
|
|
36
|
+
organization?: string;
|
|
37
|
+
/**
|
|
38
|
+
* Código de compañía de TapiPay (ej. "acme-mx"). Alternativa a `organization`.
|
|
39
|
+
* Se requiere `organization` O `companyCode`. Si se pasan ambos, `companyCode` tiene prioridad.
|
|
40
|
+
*/
|
|
41
|
+
companyCode?: string;
|
|
31
42
|
/** Identificador del cliente en el sistema del cliente (ej. "CLI-001"). */
|
|
32
43
|
identifier: string;
|
|
33
44
|
/** ID externo de la deuda a preseleccionar (ej. número de factura). Aplica a la vista de pagos. */
|
|
@@ -94,6 +105,18 @@ interface TapipayAutopayLoadedEvent {
|
|
|
94
105
|
/** Resumen mínimo por adhesión activa. */
|
|
95
106
|
adhesions: TapipayAutopayAdhesionSummary[];
|
|
96
107
|
}
|
|
108
|
+
/**
|
|
109
|
+
* Payload del evento autopayActivated.
|
|
110
|
+
* Una nueva adhesión quedó activa (se dispara una sola vez por adhesión nueva).
|
|
111
|
+
*/
|
|
112
|
+
interface TapipayAutopayActivatedEvent {
|
|
113
|
+
/** Hash opaco del identificador de la adhesión activada. */
|
|
114
|
+
id: string;
|
|
115
|
+
/** Tipo de medio de la adhesión activada. */
|
|
116
|
+
mediaType: TapipayAutopayMediaType;
|
|
117
|
+
/** Últimos 4 dígitos del medio activado. `null` si no aplica. */
|
|
118
|
+
lastFour: string | null;
|
|
119
|
+
}
|
|
97
120
|
/**
|
|
98
121
|
* Payload del evento autopayRemoved.
|
|
99
122
|
* El usuario desadhirió un medio con éxito.
|
|
@@ -127,12 +150,14 @@ interface TapipayInstance {
|
|
|
127
150
|
on(event: "paymentSubmitted", handler: (data: TapipayPaymentSubmittedEvent) => void): void;
|
|
128
151
|
on(event: "paymentCancelled", handler: (data: TapipayPaymentCancelledEvent) => void): void;
|
|
129
152
|
on(event: "autopayLoaded", handler: (data: TapipayAutopayLoadedEvent) => void): void;
|
|
153
|
+
on(event: "autopayActivated", handler: (data: TapipayAutopayActivatedEvent) => void): void;
|
|
130
154
|
on(event: "autopayRemoved", handler: (data: TapipayAutopayRemovedEvent) => void): void;
|
|
131
155
|
on(event: "autopayError", handler: (data: TapipayAutopayErrorEvent) => void): void;
|
|
132
156
|
off(event: "paymentWindowOpened", handler: (data: TapipayPaymentWindowOpenedEvent) => void): void;
|
|
133
157
|
off(event: "paymentSubmitted", handler: (data: TapipayPaymentSubmittedEvent) => void): void;
|
|
134
158
|
off(event: "paymentCancelled", handler: (data: TapipayPaymentCancelledEvent) => void): void;
|
|
135
159
|
off(event: "autopayLoaded", handler: (data: TapipayAutopayLoadedEvent) => void): void;
|
|
160
|
+
off(event: "autopayActivated", handler: (data: TapipayAutopayActivatedEvent) => void): void;
|
|
136
161
|
off(event: "autopayRemoved", handler: (data: TapipayAutopayRemovedEvent) => void): void;
|
|
137
162
|
off(event: "autopayError", handler: (data: TapipayAutopayErrorEvent) => void): void;
|
|
138
163
|
off(event: string, handler: (...args: unknown[]) => unknown): void;
|
|
@@ -145,4 +170,4 @@ declare global {
|
|
|
145
170
|
}
|
|
146
171
|
}
|
|
147
172
|
|
|
148
|
-
export type { LoadTapipayOptions as L, TapipayInstance as T,
|
|
173
|
+
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 };
|
|
@@ -22,12 +22,23 @@ interface LoadTapipayOptions {
|
|
|
22
22
|
type TapipayView = "payments" | "autopay";
|
|
23
23
|
/**
|
|
24
24
|
* Opciones requeridas para montar el widget TapiPay.
|
|
25
|
+
*
|
|
26
|
+
* Se requiere `container` + `identifier` + UNO de `{ organization, companyCode }`.
|
|
27
|
+
* Si se pasan ambos, `companyCode` tiene prioridad.
|
|
25
28
|
*/
|
|
26
29
|
interface TapipayOptions {
|
|
27
30
|
/** Selector CSS o elemento DOM donde se montará el widget. */
|
|
28
31
|
container: string | HTMLElement;
|
|
29
|
-
/**
|
|
30
|
-
|
|
32
|
+
/**
|
|
33
|
+
* Alias de la Organización configurado en el dashboard de TapiPay (ej. "acme"). Corresponde al campo "Alias" en Configuración → Organización.
|
|
34
|
+
* Se requiere `organization` O `companyCode`. Si se pasan ambos, `companyCode` tiene prioridad.
|
|
35
|
+
*/
|
|
36
|
+
organization?: string;
|
|
37
|
+
/**
|
|
38
|
+
* Código de compañía de TapiPay (ej. "acme-mx"). Alternativa a `organization`.
|
|
39
|
+
* Se requiere `organization` O `companyCode`. Si se pasan ambos, `companyCode` tiene prioridad.
|
|
40
|
+
*/
|
|
41
|
+
companyCode?: string;
|
|
31
42
|
/** Identificador del cliente en el sistema del cliente (ej. "CLI-001"). */
|
|
32
43
|
identifier: string;
|
|
33
44
|
/** ID externo de la deuda a preseleccionar (ej. número de factura). Aplica a la vista de pagos. */
|
|
@@ -94,6 +105,18 @@ interface TapipayAutopayLoadedEvent {
|
|
|
94
105
|
/** Resumen mínimo por adhesión activa. */
|
|
95
106
|
adhesions: TapipayAutopayAdhesionSummary[];
|
|
96
107
|
}
|
|
108
|
+
/**
|
|
109
|
+
* Payload del evento autopayActivated.
|
|
110
|
+
* Una nueva adhesión quedó activa (se dispara una sola vez por adhesión nueva).
|
|
111
|
+
*/
|
|
112
|
+
interface TapipayAutopayActivatedEvent {
|
|
113
|
+
/** Hash opaco del identificador de la adhesión activada. */
|
|
114
|
+
id: string;
|
|
115
|
+
/** Tipo de medio de la adhesión activada. */
|
|
116
|
+
mediaType: TapipayAutopayMediaType;
|
|
117
|
+
/** Últimos 4 dígitos del medio activado. `null` si no aplica. */
|
|
118
|
+
lastFour: string | null;
|
|
119
|
+
}
|
|
97
120
|
/**
|
|
98
121
|
* Payload del evento autopayRemoved.
|
|
99
122
|
* El usuario desadhirió un medio con éxito.
|
|
@@ -127,12 +150,14 @@ interface TapipayInstance {
|
|
|
127
150
|
on(event: "paymentSubmitted", handler: (data: TapipayPaymentSubmittedEvent) => void): void;
|
|
128
151
|
on(event: "paymentCancelled", handler: (data: TapipayPaymentCancelledEvent) => void): void;
|
|
129
152
|
on(event: "autopayLoaded", handler: (data: TapipayAutopayLoadedEvent) => void): void;
|
|
153
|
+
on(event: "autopayActivated", handler: (data: TapipayAutopayActivatedEvent) => void): void;
|
|
130
154
|
on(event: "autopayRemoved", handler: (data: TapipayAutopayRemovedEvent) => void): void;
|
|
131
155
|
on(event: "autopayError", handler: (data: TapipayAutopayErrorEvent) => void): void;
|
|
132
156
|
off(event: "paymentWindowOpened", handler: (data: TapipayPaymentWindowOpenedEvent) => void): void;
|
|
133
157
|
off(event: "paymentSubmitted", handler: (data: TapipayPaymentSubmittedEvent) => void): void;
|
|
134
158
|
off(event: "paymentCancelled", handler: (data: TapipayPaymentCancelledEvent) => void): void;
|
|
135
159
|
off(event: "autopayLoaded", handler: (data: TapipayAutopayLoadedEvent) => void): void;
|
|
160
|
+
off(event: "autopayActivated", handler: (data: TapipayAutopayActivatedEvent) => void): void;
|
|
136
161
|
off(event: "autopayRemoved", handler: (data: TapipayAutopayRemovedEvent) => void): void;
|
|
137
162
|
off(event: "autopayError", handler: (data: TapipayAutopayErrorEvent) => void): void;
|
|
138
163
|
off(event: string, handler: (...args: unknown[]) => unknown): void;
|
|
@@ -145,4 +170,4 @@ declare global {
|
|
|
145
170
|
}
|
|
146
171
|
}
|
|
147
172
|
|
|
148
|
-
export type { LoadTapipayOptions as L, TapipayInstance as T,
|
|
173
|
+
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 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/loader.ts"],"sourcesContent":["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":";AAMA,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":[]}
|