tonder-web-sdk 1.8.1 → 1.9.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/README.md +1 -1
  2. package/package.json +1 -1
  3. package/src/classes/inlineCheckout.js +1 -1
  4. package/v1/bundle.min.js +3 -3
  5. package/.htaccess +0 -1
  6. package/index.html +0 -178
  7. package/success.html +0 -22
package/.htaccess DELETED
@@ -1 +0,0 @@
1
- DirectoryIndex index.html
package/index.html DELETED
@@ -1,178 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
6
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
- <style>
8
- #checkout-container {
9
- display: flex;
10
- justify-content: center;
11
- }
12
- #pay-button {
13
- padding: 10px 20px;
14
- margin-top: 30px;
15
- background-color: #4a90e2;
16
- color: white;
17
- border: none;
18
- border-radius: 5px;
19
- font-size: 16px;
20
- cursor: pointer;
21
- transition: background-color 0.3s;
22
- }
23
- #payButton:hover {
24
- background-color: #357abd;
25
- }
26
- .cart-details {
27
- font-size: 3rem;
28
- font-weight: bold;
29
- padding: 2rem;
30
- display: flex;
31
- justify-content: center;
32
- }
33
- .button-container {
34
- width: 100%;
35
- display: flex;
36
- justify-content: center;
37
- }
38
- </style>
39
- </head>
40
-
41
- <body>
42
- <div class="checkout-container">
43
- <div class="cart-details">
44
- <span>Total&nbsp</span>
45
- <div id="cart-total">$100</div>
46
- </div>
47
- <form id="payment-form">
48
- <div id="tonder-checkout"></div>
49
- </form>
50
- <div class="button-container">
51
- <button id="pay-button">Pagar</button>
52
- </div>
53
- </div>
54
- </body>
55
- <script src="https://js.skyflow.com/v1/index.js"></script>
56
- <script src="https://openpay.s3.amazonaws.com/openpay.v1.min.js"></script>
57
- <script src="https://openpay.s3.amazonaws.com/openpay-data.v1.min.js"></script>
58
- <script src="./v1/bundle.min.js"></script>
59
- <script>
60
- const customStyles = {
61
- inputStyles: {
62
- base: {
63
- border: "2px dashed #4a90e2",
64
- padding: "12px 8px",
65
- borderRadius: "8px",
66
- color: "#333333",
67
- backgroundColor: "#f0f0f0",
68
- fontFamily: '"Arial", sans-serif',
69
- fontSize: '14px',
70
- '&::placeholder': {
71
- color: "#888888",
72
- },
73
- },
74
- cardIcon: {
75
- position: 'absolute',
76
- left: '6px',
77
- bottom: 'calc(50% - 12px)',
78
- },
79
- complete: {
80
- color: "#4caf50",
81
- },
82
- empty: {},
83
- focus: {},
84
- invalid: {
85
- border: "1px solid #f44336",
86
- },
87
- global: {
88
- '@import': 'url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap")',
89
- }
90
- },
91
- labelStyles: {
92
- base: {
93
- fontSize: '14px',
94
- fontWeight: 'bold',
95
- fontFamily: '"Inter", sans-serif',
96
- color: "#4a90e2",
97
- },
98
- },
99
- errorTextStyles: {
100
- base: {
101
- fontSize: '12px',
102
- fontWeight: '500',
103
- color: "#e74c3c",
104
- fontFamily: '"Inter", sans-serif',
105
- },
106
- },
107
- labels: {
108
- nameLabel: 'Nombre de la tarjeta',
109
- cardLabel: 'Número de Tarjeta Personalizado',
110
- cvvLabel: 'Código de Seguridad',
111
- expiryMonthLabel: 'Mes de Expiración',
112
- expiryYearLabel: 'Año de Expiración'
113
- },
114
- placeholders: {
115
- cardPlaceholder: '0000 0000 0000 0000',
116
- cvvPlaceholder: '123',
117
- expiryMonthPlaceholder: 'MM',
118
- expiryYearPlaceholder: 'AA'
119
- }
120
- }
121
-
122
- const checkoutData = {
123
- customer: {
124
- firstName: "Adrian",
125
- lastName: "Martinez",
126
- country: "Mexico",
127
- address: "Pinos 507, Col El Tecuan",
128
- city: "Durango",
129
- state: "Durango",
130
- postCode: "34105",
131
- email: "adrian@email.com",
132
- phone: "8161234567",
133
- },
134
- currency: 'mxn',
135
- cart: {
136
- total: 399,
137
- items: [
138
- {
139
- description: "Black T-Shirt",
140
- quantity: 1,
141
- price_unit: 1,
142
- discount: 0,
143
- taxes: 0,
144
- product_reference: 1,
145
- name: "T-Shirt",
146
- amount_total: 399,
147
- },
148
- ]
149
- }
150
- };
151
-
152
- const apiKey = "00d17d61e9240c6e0611fbdb1558e636ed6389db";
153
- const returnUrl = "http://web-sdk.tonderdemo.website/"
154
- const inlineCheckout = new TonderSdk.InlineCheckout({
155
- apiKey,
156
- returnUrl,
157
- styles: customStyles
158
- });
159
-
160
- inlineCheckout.injectCheckout();
161
-
162
- document.addEventListener('DOMContentLoaded', function() {
163
- const payButton = document.getElementById('pay-button');
164
- payButton.addEventListener('click', async function() {
165
- try {
166
- payButton.textContent = 'Procesando...';
167
- const response = await inlineCheckout.payment(checkoutData);
168
- console.log(response)
169
- alert('Pago realizado con éxito');
170
- } catch (error) {
171
- alert('Error al realizar el pago')
172
- } finally {
173
- payButton.textContent = 'Pagar';
174
- }
175
- });
176
- });
177
- </script>
178
- </html>
package/success.html DELETED
@@ -1,22 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="es">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Pago Completado</title>
7
- <style>
8
- body {
9
- font-family: Arial, sans-serif;
10
- display: flex;
11
- justify-content: center;
12
- align-items: center;
13
- height: 100vh;
14
- margin: 0;
15
- color: #333;
16
- }
17
- </style>
18
- </head>
19
- <body>
20
- <h1>Pago completado con éxito</h1>
21
- </body>
22
- </html>