@gr4vy/secure-fields 2.5.0 → 2.6.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/CHANGELOG.md CHANGED
@@ -1,3 +1,22 @@
1
+ # v2.6.0 (Wed May 13 2026)
2
+
3
+ #### 🚀 Enhancement
4
+
5
+ - chore(docs): Add UX enhancements documentation to READMEs [#1183](https://github.com/gr4vy/secure-fields/pull/1183) ([@cbetta](https://github.com/cbetta) [@luca-gr4vy](https://github.com/luca-gr4vy))
6
+ - task: add card scheme icon [#1209](https://github.com/gr4vy/secure-fields/pull/1209) ([@luca-gr4vy](https://github.com/luca-gr4vy) [@GiordanoArman](https://github.com/GiordanoArman))
7
+
8
+ #### 🐛 Bug Fix
9
+
10
+ - fix: README badges causing Avast alerts [#1215](https://github.com/gr4vy/secure-fields/pull/1215) ([@luca-gr4vy](https://github.com/luca-gr4vy))
11
+
12
+ #### Authors: 3
13
+
14
+ - Cristiano Betta ([@cbetta](https://github.com/cbetta))
15
+ - GiordanoArman ([@GiordanoArman](https://github.com/GiordanoArman))
16
+ - Luca Allievi ([@luca-gr4vy](https://github.com/luca-gr4vy))
17
+
18
+ ---
19
+
1
20
  # v2.5.0 (Thu May 07 2026)
2
21
 
3
22
  #### 🚀 Enhancement
package/README.md CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  ![NPM Version](https://img.shields.io/npm/v/@gr4vy/secure-fields?color=green)
4
4
  [![GitHub license](https://img.shields.io/github/license/Naereen/StrapDown.js.svg)](https://github.com/gr4vy/secure-fields/blob/main/LICENSE)
5
- [![Changelog](https://img.shields.io/badge/changelog-dimgrey?logo=npm&logoColor=white)](https://www.runpkg.com/?@gr4vy/secure-fields/CHANGELOG.md)
5
+ [![Changelog](https://img.shields.io/badge/changelog-dimgrey?logo=npm&logoColor=white)](https://github.com/gr4vy/secure-fields/blob/main/CHANGELOG.md)
6
6
 
7
7
  Add Secure Fields to your Node app.
8
8
 
@@ -119,11 +119,72 @@ postalCode.addEventListener('input', (data) => {
119
119
  })
120
120
  ```
121
121
 
122
+ ### Reset
123
+
122
124
  Each field instance exposes a `clear()` method to reset the value programmatically.
123
125
 
124
126
  ```js
125
127
  const number = secureFields.addCardNumberField('#cc-number', { styles })
126
- number.clear()
128
+
129
+ const clearButton = document.querySelector('#clear-button')
130
+ clearButton.addEventListener('click', () => number.clear())
131
+ ```
132
+
133
+ ### Auto focus
134
+
135
+ Automatically focus a field once its iframe is loaded by passing `autoFocus: true`.
136
+
137
+ ```js
138
+ const number = secureFields.addCardNumberField('#cc-number', {
139
+ autoFocus: true,
140
+ styles,
141
+ })
142
+ ```
143
+
144
+ ### Input masking
145
+
146
+ Mask the value of card number and security code fields to hide sensitive data.
147
+
148
+ ```js
149
+ const number = secureFields.addCardNumberField('#cc-number', {
150
+ maskInput: {
151
+ character: '•', // masking character (default: •)
152
+ showLastFour: true, // keep last 4 digits visible when valid (card number only)
153
+ maskOnInput: true, // mask in real-time as the user types (default: on blur only)
154
+ },
155
+ styles,
156
+ })
157
+ ```
158
+
159
+ You can also mask and unmask a field programmatically:
160
+
161
+ ```js
162
+ number.redactValue() // mask the value
163
+ number.unredactValue() // unmask the value
164
+ ```
165
+
166
+ ### Auto advance
167
+
168
+ Automatically move focus to the next field when the current field is complete and valid.
169
+
170
+ ```js
171
+ secureFields.setAutoAdvance({
172
+ enabled: true,
173
+ fieldOrder: ['number', 'expiryDate', 'securityCode'], // optional, defines the order of fields
174
+ })
175
+ ```
176
+
177
+ > **Note**: Auto advance can negatively affect the user experience. Test thoroughly before enabling in production.
178
+
179
+ ### Scheme icons
180
+
181
+ Display the detected card scheme icon (e.g. Visa, Mastercard) inside the card number field. The icon updates in real-time as the user types and is refined when the API confirms the scheme.
182
+
183
+ ```js
184
+ const number = secureFields.addCardNumberField('#cc-number', {
185
+ showSchemeIcons: true,
186
+ styles,
187
+ })
127
188
  ```
128
189
 
129
190
  For more information please
@@ -247,6 +308,9 @@ Some of these provide additional useful data like the card BIN, validation statu
247
308
  | `blur` | Triggered when the field loses focus. | `cardNumberField.addEventListener('blur', (data) => { console.log(data) /* { id: 'number' } */ })` |
248
309
  | `focus` | Triggered when the field gains focus. | `cardNumberField.addEventListener('focus', (data) => { console.log(data) /* { id: 'number' } */ })` |
249
310
  | `input` | Triggered when the field value has been changed. | `cardNumberField.addEventListener('input', (data) => { console.log(data) /* { id: 'number', schema: 'visa', codeLabel: 'CVV', valid: true, empty: true, autofilled: false, bin: '411111' } */` |
311
+ | `redacted` | Triggered when the field value has been masked (either automatically via `maskInput` or programmatically via `redactValue()`). | `cardNumberField.addEventListener('redacted', () => { console.log('Field redacted') })` |
312
+ | `unredacted` | Triggered when the field value has been unmasked (either automatically or programmatically via `unredactValue()`). | `cardNumberField.addEventListener('unredacted', () => { console.log('Field unredacted') })` |
313
+ | `card-details-changed` | Triggered when the API confirms card details for the entered BIN. Includes the confirmed `scheme` and other card metadata. Only fires on the card number field. | `cardNumberField.addEventListener('card-details-changed', (data) => { console.log(data) /* { id: 'number', scheme: 'visa', ... } */ })` |
250
314
 
251
315
  ## Click to Pay
252
316
 
@@ -377,3 +441,25 @@ The following Click to Pay events can be listened to by attaching an event handl
377
441
  | `submit` | Calls the Vault API to tokenize and store the card data. <br /><br />`secureFields.submit()` |
378
442
  | `setDebug` | Enable / disable debug mode. When the debug mode is enabled, SecureFields logs information to the console. <br /><br />`secureFields.setDebug(true)` |
379
443
  | `addFont` | Load a custom font from [Google Fonts](https://fonts.google.com/) to be used inside inputs. You can define the font family as well as styles or weights as a string (e.g. "Lato:400,600"). To use the loaded font, add the correct `fontFamily` property to the styles object when creating fields. <br /><br />`secureFields.addFont('Lato')` |
444
+ | `setAutoAdvance` | Enable auto-advance to automatically move focus to the next field when the current field's value is complete and valid. Accepts `{ enabled: boolean, fieldOrder?: Array<FieldType> }`. <br /><br />`secureFields.setAutoAdvance({ enabled: true })` |
445
+
446
+ ### Field methods
447
+
448
+ | Name | Description |
449
+ | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ |
450
+ | `clear` | Resets the value of a field. <br /><br />`cardNumberField.clear()` |
451
+ | `redactValue` | Masks the field value programmatically. To apply masking behavior, configure `maskInput` for the field. <br /><br />`cardNumberField.redactValue()` |
452
+ | `unredactValue` | Unmasks the field value programmatically. To apply masking behavior, configure `maskInput` for the field. <br /><br />`cardNumberField.unredactValue()` |
453
+
454
+ ### Field options
455
+
456
+ The following options can be passed when adding a field (e.g. `addCardNumberField('#el', options)`).
457
+
458
+ | Name | Type | Description |
459
+ | ------------- | --------- | -------------------------------------------------------------------------------------------------------------------------------- |
460
+ | `placeholder` | `string` | Input placeholder text. |
461
+ | `styles` | `object` | CSS styles for the input inside the iframe. |
462
+ | `label` | `string` | Accessible label for the input. |
463
+ | `autoFocus` | `boolean` | Automatically focus the field when loaded. |
464
+ | `maskInput` | `boolean \| object` | Enable input masking. Use `true` for default masking, or pass an options object: `character` (masking character), `showLastFour` (card number only), `maskOnInput` (real-time mask). |
465
+ | `showSchemeIcons` | `boolean` | Display the detected card scheme icon inside the card number field. Only available on `addCardNumberField`. |
package/lib/index.d.ts CHANGED
@@ -12,6 +12,7 @@ declare class SecureFields {
12
12
  controller: HTMLIFrameElement;
13
13
  frameUrl: string;
14
14
  apiUrl: string;
15
+ cdnBaseUrl: string;
15
16
  parentOrigin: string;
16
17
  font: string;
17
18
  cardNumber: SecureInput;
@@ -25,6 +26,8 @@ declare class SecureFields {
25
26
  environmentPath: string;
26
27
  private paymentMethodId?;
27
28
  private autoAdvance;
29
+ private schemeIcons;
30
+ private cardDetailsScheme;
28
31
  private controllerReady;
29
32
  private _resolveControllerReady;
30
33
  /**
package/lib/index.js CHANGED
@@ -1 +1 @@
1
- !function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t();else if("function"==typeof define&&define.amd)define([],t);else{var r=t();for(var n in r)("object"==typeof exports?exports:e)[n]=r[n]}}(this,(()=>(()=>{"use strict";var e={d:(t,r)=>{for(var n in r)e.o(r,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:r[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{Events:()=>i,SecureFields:()=>$,SecureInput:()=>B});var r=(e,t)=>"".concat(e,"?").concat(new URLSearchParams(t).toString()),n="@gr4vy-secure-fields-debug",i=function(e){return e.CARD_VAULT_SUCCESS="card-vault-success",e.CARD_VAULT_FAILURE="card-vault-failure",e.FORM_CHANGE="form-change",e.METHOD_CHANGE="method-change",e.READY="ready",e.RESIZE="resize",e.CLICK_TO_PAY_INITIALIZED="click-to-pay-initialized",e.CLICK_TO_PAY_READY="click-to-pay-ready",e.CLICK_TO_PAY_SIGN_OUT="click-to-pay-sign-out",e.CLICK_TO_PAY_ERROR="click-to-pay-error",e.CLICK_TO_PAY_CANCEL="click-to-pay-cancel",e.CLICK_TO_PAY_CHECKOUT_WITH_NEW_CARD="click-to-pay-checkout-with-new-card",e.CLICK_TO_PAY_UNABLE_TO_LOAD_DPA="click-to-pay-unable-to-load-dpa",e.CLICK_TO_PAY_VISIBILITY_CHANGE="click-to-pay:visibility-change",e.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE="click-to-pay-card-form:visibility-change",e.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE="click-to-pay-sign-in:visibility-change",e.CLICK_TO_PAY_PROCESSING="click-to-pay-processing",e.CLICK_TO_PAY_AUTHENTICATE="click-to-pay-authenticate",e.CLICK_TO_PAY_AUTHENTICATE_FAILURE="click-to-pay-authenticate-failure",e.THREE_DS_START="three-ds-start",e.THREE_DS_FINISH="three-ds-finish",e}({}),o=function(e){return e.REQUEST_PORT="request-port",e.TRANSFER_PORT="transfer-port",e.REQUEST_RECOGNITION_TOKEN="request-recognition-token",e.REQUEST_RECOGNITION_TOKEN_FAILED="request-recognition-token-failed",e.RECOGNITION_TOKEN="recognition-token",e}({}),a=function(e){return e.FOCUSED="data-secure-fields-focused",e.INVALID="data-secure-fields-invalid",e.AUTOFILLED="data-secure-fields-autofilled",e}({}),s=function(e){return e.PAYMENT_METHOD_ID_IN_USE="You're passing a paymentMethodId to use a stored payment method, which means Secure Fields methods `addCardNumber`, `addExpiryDate` and `addClickToPay` are automatically disabled and won't render the related fields",e.PAYMENT_METHOD_ID_DEPRECATED="The 'paymentMethodId' prop is deprecated and will be removed in a future version. Please use the 'paymentMethod' prop instead: { paymentMethod: { id: 'your-id', scheme: 'visa' } }",e.FIELD_PATTERN_IN_USE="The `pattern` option can't be used on card fields, so it won't be applied here.",e.AUTO_ADVANCE_ENABLED="autoAdvance is enabled. Auto-advancing focus on field completion can degrade checkout UX (see WCAG 3.2.2). Use with caution.",e.NO_RECOGNITION_TOKEN="The recognition token couldn't be obtained or the request took too much time. It is possible that a Click to Pay user was therefore not recognised.",e}({}),c="secure-fields",l={number:"addCardNumberField",expiryDate:"addExpiryDateField",securityCode:"addSecurityCodeField"},d=["01","02","03","04","05"];function u(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function h(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,i,o=[],a=!0,s=!1;try{for(r=r.call(e);!(a=(n=r.next()).done)&&(o.push(n.value),!t||o.length!==t);a=!0);}catch(e){s=!0,i=e}finally{try{a||null==r.return||r.return()}finally{if(s)throw i}}return o}}(e,t)||function(e,t){if(e){if("string"==typeof e)return u(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(r):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?u(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}var p=new class{subscribe(e,t){this.subscribers.push([e,t])}unsubscribe(e,t){this.subscribers=this.subscribers.filter((r=>{var n=h(r,2),i=n[0],o=n[1];return i!==e||o.toString()!==t.toString()}))}unsubscribeAll(){this.subscribers=[]}publish(e,t){this.subscribers.forEach((r=>{var n=h(r,2),i=n[0],o=n[1];return setTimeout((()=>i===e?o(t):null),0)}))}constructor(){var e,t;t=void 0,(e="subscribers")in this?Object.defineProperty(this,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):this[e]=t,this.subscribers=[]}};function y(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function f(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,i,o=[],a=!0,s=!1;try{for(r=r.call(e);!(a=(n=r.next()).done)&&(o.push(n.value),!t||o.length!==t);a=!0);}catch(e){s=!0,i=e}finally{try{a||null==r.return||r.return()}finally{if(s)throw i}}return o}}(e,t)||function(e,t){if(e){if("string"==typeof e)return y(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(r):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?y(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}var m=new class{add(e,t,r){window.addEventListener(e,t),this.listeners.push([e,t,r])}remove(e,t,r){var n=this.listeners.findIndex((n=>{var i=f(n,3),o=i[0],a=i[1],s=i[2];return o===e&&a.toString()===t.toString()&&s===r}));if(-1!==n){var i=f(this.listeners.splice(n,1),1),o=f(i[0],2),a=o[0],s=o[1];window.removeEventListener(a,s)}}removeAll(){this.listeners.forEach((e=>{var t=f(e,2),r=t[0],n=t[1];window.removeEventListener(r,n)})),this.listeners=[]}constructor(){var e,t;t=[],(e="listeners")in this?Object.defineProperty(this,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):this[e]=t}},v=["number","expiryDate","securityCode","postalCode"],b=e=>{var t,r;if(null===(t=document)||void 0===t?void 0:t.cookie)return null===(r="; ".concat(document.cookie).match(";\\s*".concat(e,"=([^;]+)")))||void 0===r?void 0:r[1]},_=["accesskey","autocapitalize","autocomplete","autofocus","aria-.","class","contenteditable","data-.","dir","draggable","enterkeyhint","hidden","id","inert","inputmode","is","itemid","itemprop","itemref","itemscope","itemtype","lang","nonce","onabort","onautocomplete","onautocompleteerror","onblur","oncancel","oncanplay","oncanplaythrough","onchange","onclick","onclose","oncontextmenu","oncuechange","ondblclick","ondrag","ondragend","ondragenter","ondragleave","ondragover","ondragstart","ondrop","ondurationchange","onemptied","onended","onerror","onfocus","oninput","oninvalid","onkeydown","onkeypress","onkeyup","onload","onloadeddata","onloadedmetadata","onloadstart","onmousedown","onmouseenter","onmouseleave","onmousemove","onmouseout","onmouseover","onmouseup","onmousewheel","onpause","onplay","onplaying","onprogress","onratechange","onreset","onresize","onscroll","onseeked","onseeking","onselect","onshow","onsort","onstalled","onsubmit","onsuspend","ontimeupdate","ontoggle","onvolumechange","onwaiting","popover","role","slot","spellcheck","style","tabindex","title","translate"],I=(e,t)=>e&&(e.style.display=t?"block":"none");function g(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function O(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){g(e,t,r[t])}))}return e}var C={debug:!1,level:"log"},E=(e,t,r)=>{var i=O({},C,r),o=i.debug,a=i.level;(o||"true"===localStorage.getItem(n))&&console[a]("Gr4vy - Secure Fields - ".concat(e),t||{})},T=(e,t,r)=>{var n,i;E(e,t,(n=O({},r),i=null!=(i={level:"warn"})?i:{},Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(i)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(i)).forEach((function(e){Object.defineProperty(n,e,Object.getOwnPropertyDescriptor(i,e))})),n))},A=e=>(e!=e.toLowerCase()&&(e=e.replace(/[A-Z]/g,(e=>"-"+e.toLowerCase()))),e);function P(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}var w=function(){var e=function(t){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"";return Object.entries(t).reduce(((n,i)=>{var o,a,s=(a=2,function(e){if(Array.isArray(e))return e}(o=i)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,i,o=[],a=!0,s=!1;try{for(r=r.call(e);!(a=(n=r.next()).done)&&(o.push(n.value),!t||o.length!==t);a=!0);}catch(e){s=!0,i=e}finally{try{a||null==r.return||r.return()}finally{if(s)throw i}}return o}}(o,a)||function(e,t){if(e){if("string"==typeof e)return P(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(r):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?P(e,t):void 0}}(o,a)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),c=s[0],l=s[1];return(e=>"[object Object]"===Object.prototype.toString.call(e))(l)?n.push(...e(t[c],"".concat((r+c).match(/[a-zA-Z0-9]+/g).join("-"),"-"))):(c=A(c).replace(/^-/,""),n.push(["--".concat(r).concat(c),l])),n}),[])};return e(arguments.length>0&&void 0!==arguments[0]?arguments[0]:{})};function S(e,t,r,n,i,o,a){try{var s=e[o](a),c=s.value}catch(e){return void r(e)}s.done?t(c):Promise.resolve(c).then(n,i)}function N(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function k(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){N(e,t,r[t])}))}return e}function L(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}class D{init(e,t){var n;this.challengeWindowSize=d.includes(null==t?void 0:t.challengeWindowSize)?t.challengeWindowSize:"05",this.element="string"==typeof e?document.querySelector(e):e;var i="gr4vy-threeds-flow-controller";null===(n=document.body.querySelector("iframe#".concat(i)))||void 0===n||n.remove();var o=document.createElement("iframe");o.id=i,o.title="ThreeDSecure",o.style.display="block",o.style.border="0px",o.style.padding="0px",o.style.margin="0px",o.style.width="100%",o.style.height="100%",o.src=r(this.secureFields.frameUrl+"/threeds.html",{sessionId:this.secureFields.config.sessionId,parentOrigin:this.secureFields.parentOrigin,gr4vyId:this.secureFields.config.gr4vyId,environment:this.secureFields.config.environment}),this.element.appendChild(o),this.controller=o;var a={type:"three-ds-init",channel:c,data:{challengeWindowSize:this.challengeWindowSize}};return o.addEventListener("load",(()=>{var e;null===(e=o.contentWindow)||void 0===e||e.postMessage(a,this.secureFields.frameUrl)}),{once:!0}),this.secureFields.controller.addEventListener("load",(()=>{this.secureFields.controller.contentWindow.postMessage(a,this.secureFields.frameUrl)}),{once:!0}),m.remove("message",this.listener.bind(this),"three-ds"),m.add("message",this.listener.bind(this),"three-ds"),this}listener(e){return(t=function*(){if(e.origin===this.secureFields.frameUrl){var t=e.data,r=t.type,n=t.data;switch(r){case i.THREE_DS_START:p.publish(i.THREE_DS_START,L(k({},n),{element:this.element})),E("3DS start",e.data.data);break;case i.THREE_DS_FINISH:p.publish(i.THREE_DS_FINISH,L(k({},n),{element:this.element})),E("3DS finish",e.data.data)}}},function(){var e=this,r=arguments;return new Promise((function(n,i){var o=t.apply(e,r);function a(e){S(o,n,i,a,s,"next",e)}function s(e){S(o,n,i,a,s,"throw",e)}a(void 0)}))}).call(this);var t}constructor(e){N(this,"secureFields",void 0),N(this,"controller",void 0),N(this,"challengeWindowSize",void 0),N(this,"element",void 0),this.secureFields=e}}function R(e,t,r,n,i,o,a){try{var s=e[o](a),c=s.value}catch(e){return void r(e)}s.done?t(c):Promise.resolve(c).then(n,i)}class U extends Error{constructor(e){super(e),this.name="UnableToLoadDpaError"}}function j(e,t,r,n,i,o,a){try{var s=e[o](a),c=s.value}catch(e){return void r(e)}s.done?t(c):Promise.resolve(c).then(n,i)}function F(e){return function(){var t=this,r=arguments;return new Promise((function(n,i){var o=e.apply(t,r);function a(e){j(o,n,i,a,s,"next",e)}function s(e){j(o,n,i,a,s,"throw",e)}a(void 0)}))}}function M(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function x(){return x=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},x.apply(this,arguments)}function Y(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){M(e,t,r[t])}))}return e}class K{_addIframe(e,t,n,i){var o=document.createElement("iframe");return o.id=e,o.title=t,o.setAttribute("width","100%"),o.setAttribute("frameborder","0"),o.setAttribute("style","height:0px"),o.src=r(n,i),o}_attachListeners(){var e=new MessageChannel,t=!0,r=r=>{var n=r.origin,a=r.data,l=a.type,d=a.data;switch(n){case this.origin:switch(l){case i.RESIZE:this.controller.style.height="".concat(d.height>0?d.height+48:0,"px");break;case i.METHOD_CHANGE:var u=d.method||"card";(this.secureFields.method!==u||t)&&(t=!1,this.secureFields.updateMethod(u,{data:d}),I(this.cardForm,"card"===u),p.publish(i.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE,"card"===u));break;case i.CLICK_TO_PAY_INITIALIZED:p.publish(i.CLICK_TO_PAY_INITIALIZED,this.clickToPay),E("Click to Pay initialized",this.clickToPay),I(this.signIn,!1),p.publish(i.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!1),I(this.clickToPay.element,!0),p.publish(i.CLICK_TO_PAY_VISIBILITY_CHANGE,!0);break;case i.CLICK_TO_PAY_READY:this._buyerExists=d.buyerExists,p.publish(i.CLICK_TO_PAY_READY,d),E("Click to Pay ready"),I(this.signIn,!d.buyerExists),p.publish(i.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!d.buyerExists),I(this.clickToPay.element,!0),p.publish(i.CLICK_TO_PAY_VISIBILITY_CHANGE,!0);break;case i.CLICK_TO_PAY_SIGN_OUT:this.clickToPay.signOut();break;case i.CLICK_TO_PAY_ERROR:p.publish(i.CLICK_TO_PAY_ERROR,d),E("Click to Pay error:",d),I(this.signIn,!["UNKNOWN","INVALID_CARD","CODE_INVALID"].includes(d.error)),p.publish(i.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!["UNKNOWN","INVALID_CARD","CODE_INVALID"].includes(d.error)),I(this.clickToPay.element,"UNKNOWN"!==d.error),p.publish(i.CLICK_TO_PAY_VISIBILITY_CHANGE,"UNKNOWN"!==d.error);break;case i.CLICK_TO_PAY_CANCEL:p.publish(i.CLICK_TO_PAY_CANCEL,d),E("Click to Pay cancelled"),this._buyerExists||(I(this.signIn,!0),p.publish(i.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!0));break;case i.CLICK_TO_PAY_CHECKOUT_WITH_NEW_CARD:p.publish(i.CLICK_TO_PAY_CHECKOUT_WITH_NEW_CARD,d),I(this.signIn,!1),p.publish(i.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!1),E("Click to Pay checkout with new card initiated");break;case i.CLICK_TO_PAY_PROCESSING:I(this.cardForm,!d),p.publish(i.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE,d),E("Click to Pay processing",d);break;case i.CLICK_TO_PAY_AUTHENTICATE:!function(e,t){for(var r=arguments.length,n=new Array(r>2?r-2:0),i=2;i<r;i++)n[i-2]=arguments[i];document.cookie="".concat(e,"=").concat(t,"; path=/; ").concat(n.join("; "))}("recognitionToken",d.recognitionToken,"Secure","SameSite=Strict","MaxAge=15552000");break;case i.CLICK_TO_PAY_AUTHENTICATE_FAILURE:p.publish(i.CLICK_TO_PAY_AUTHENTICATE_FAILURE,d),E("Click to Pay authenticate failure:",d);break;case o.REQUEST_RECOGNITION_TOKEN:this.controller.contentWindow.postMessage({channel:c,type:o.RECOGNITION_TOKEN,data:{recognitionToken:b("recognitionToken")}},this.origin);break;case o.REQUEST_RECOGNITION_TOKEN_FAILED:T(s.NO_RECOGNITION_TOKEN);break;case o.REQUEST_PORT:this.controller.contentWindow.postMessage({channel:c,type:o.TRANSFER_PORT},this.origin,[e.port1])}break;case this.secureFields.frameUrl:l===o.REQUEST_PORT&&this.encrypt.contentWindow.postMessage({channel:c,type:o.TRANSFER_PORT},this.secureFields.frameUrl,[e.port2])}};m.remove("message",r,"click-to-pay"),m.add("message",r,"click-to-pay")}_fetchDPA(e,t){return F((function*(e,t){var r=t.gr4vyId,n=t.environment,o=t.sessionId;try{var a=e||function(e){return"https://api.".concat("sandbox"===(arguments.length>1&&void 0!==arguments[1]?arguments[1]:"production")?"sandbox.":"").concat(e,".gr4vy.app")}(r,n);return yield function(e){return(t=function*(e){var t=e.apiBaseUrl,r=e.checkoutSessionId;try{var n="".concat(t,"/digital-wallets/click-to-pay/session"),i=yield fetch(n,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({checkout_session_id:r})});if(i.ok){var o=yield i.json();return{srcDpaId:o.digital_payment_application_id,dpaName:o.digital_payment_application_name}}throw new U("Unable to load DPA")}catch(e){throw new U("Unable to load DPA")}},function(){var e=this,r=arguments;return new Promise((function(n,i){var o=t.apply(e,r);function a(e){R(o,n,i,a,s,"next",e)}function s(e){R(o,n,i,a,s,"throw",e)}a(void 0)}))}).apply(this,arguments);var t}({apiBaseUrl:a,checkoutSessionId:o})}catch(e){return E(e.message),p.publish(i.CLICK_TO_PAY_UNABLE_TO_LOAD_DPA),I(this.cardForm,!0),p.publish(i.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE,!0),I(this.clickToPay.element,!1),void p.publish(i.CLICK_TO_PAY_VISIBILITY_CHANGE,!1)}})).apply(this,arguments)}_initConsentCheckbox(e){var t=e.checked?"click-to-pay":"card";this.secureFields.updateMethod(t,{data:{method:t}}),e.addEventListener("change",(e=>{var t=e.target;this.consent=t.checked})),m.add("message",(t=>{switch(t.data.type){case i.CLICK_TO_PAY_ERROR:"UNKNOWN"===t.data.data.error&&(this.consent=!1,e.checked=!1);break;case i.METHOD_CHANGE:var r=this._buyerExists&&"card"===t.data.data.method;this.consent=r,e.checked=r}}),"click-to-pay-consent-checkbox")}_setNewCardRememberMe(e){this.controller.contentWindow.postMessage({type:"remember-me-new-card-changed",channel:c,data:{value:e}},this.origin)}_initNewCardRememberMeCheckbox(e){e.addEventListener("change",(e=>{var t=e.target;this._setNewCardRememberMe(t.checked)})),m.add("message",(t=>{switch(t.data.type){case i.CLICK_TO_PAY_INITIALIZED:this._setNewCardRememberMe(e.checked);break;case i.CLICK_TO_PAY_ERROR:"UNKNOWN"===t.data.data.error&&(this._setNewCardRememberMe(!1),e.checked=!1)}}),"click-to-pay-new-card-remember-me-checkbox")}_initLearnMore(e){e.style.visibility="hidden",m.add("message",(t=>{t.data.type===i.CLICK_TO_PAY_INITIALIZED&&(e.style.visibility="visible",e.addEventListener("click",(()=>{this.controller.contentWindow.postMessage({type:"show-learn-more",channel:c},this.origin)})))}),"click-to-pay-learn-more")}init(e,t){return F((function*(){this.cardForm="string"==typeof(null==t?void 0:t.cardForm)?document.querySelector(null==t?void 0:t.cardForm):null==t?void 0:t.cardForm,this.signIn="string"==typeof(null==t?void 0:t.signIn)?document.querySelector(null==t?void 0:t.signIn):null==t?void 0:t.signIn,I(this.signIn,!1);var r=this.secureFields,n=r.apiUrl,o=r.config,a=o.gr4vyId,s=o.environment,c=o.sessionId,l=r.environmentPath;if(this.clickToPay={element:null,options:t,signIn:e=>{var t=e.email,r=e.mobileNumber;return F((function*(){var e=this.clickToPay,n=e.element,o=e.options;delete o.email,delete o.mobileNumber,n.innerHTML="",I(this.signIn,!1),p.publish(i.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!1),I(this.cardForm,!1),p.publish(i.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE,!1),this.secureFields.update("clickToPay",yield this.init(n,Y({},o,t?{email:t}:{},r?{mobileNumber:r}:{})))})).call(this)},signOut:()=>(this._buyerExists=!1,p.publish(i.CLICK_TO_PAY_SIGN_OUT),E("Click to pay signed out"),I(this.signIn,!0),p.publish(i.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!0),document.cookie="".concat("recognitionToken","=; path=/; expires=Thu, 01 Jan 1970 00:00:00 UTC;"),this.clickToPay.signIn({email:null,mobileNumber:null}))},!(null==t?void 0:t.srcDpaId)||!(null==t?void 0:t.dpaName)){var d=yield this._fetchDPA(n,{gr4vyId:a,environment:s,sessionId:c});if(!(null==d?void 0:d.srcDpaId)&&!(null==d?void 0:d.dpaName))return;t.srcDpaId=d.srcDpaId,t.dpaName=d.dpaName}this.url=window.CLICK_TO_PAY_FRAME_URL||"https://click-to-pay.".concat(l).concat(a,".gr4vy.app"),this.origin=new URL(this.url).origin;var u=window.location.origin,h=(function(e){if(null==e)throw new TypeError("Cannot destructure "+e)}(t),Y({gr4vyId:a,environment:s,sessionId:c},x({},t)));if(this.controller=this._addIframe("click-to-pay-controller","Click To Pay","".concat(this.url,"/click-to-pay.html"),{parentOrigin:u,environment:s,config:encodeURIComponent(JSON.stringify(h))}),this.encrypt=this._addIframe("click-to-pay-encrypt","Click To Pay Encrypt","".concat(this.secureFields.frameUrl,"/click-to-pay-encrypt.html"),{parentOrigin:u,environment:s,config:encodeURIComponent(JSON.stringify(h))}),this._attachListeners(),null==t?void 0:t.consentCheckbox){var y="string"==typeof(null==t?void 0:t.consentCheckbox)?document.querySelector(null==t?void 0:t.consentCheckbox):null==t?void 0:t.consentCheckbox;y&&this._initConsentCheckbox(y)}if(null==t?void 0:t.rememberMeCheckbox){var f="string"==typeof(null==t?void 0:t.rememberMeCheckbox)?document.querySelector(t.rememberMeCheckbox):null==t?void 0:t.rememberMeCheckbox;f&&this._initNewCardRememberMeCheckbox(f)}if(null==t?void 0:t.learnMoreLink){var m="string"==typeof(null==t?void 0:t.learnMoreLink)?document.querySelector(null==t?void 0:t.learnMoreLink):null==t?void 0:t.learnMoreLink;m&&this._initLearnMore(m)}return(e="string"==typeof e?document.querySelector(e):e).appendChild(this.controller),e.appendChild(this.encrypt),this.clickToPay.element=e,this.clickToPay})).call(this)}constructor(e){M(this,"secureFields",void 0),M(this,"_buyerExists",void 0),M(this,"consent",void 0),M(this,"controller",void 0),M(this,"encrypt",void 0),M(this,"origin",void 0),M(this,"url",void 0),M(this,"cardForm",void 0),M(this,"signIn",void 0),M(this,"clickToPay",void 0),this.secureFields=e,this._buyerExists=!1,this.consent=!1}}function H(e,t,r,n,i,o,a){try{var s=e[o](a),c=s.value}catch(e){return void r(e)}s.done?t(c):Promise.resolve(c).then(n,i)}function G(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function V(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){G(e,t,r[t])}))}return e}function W(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}class B{_postMessage(e){return(t=function*(){yield this.ready,this.frame.contentWindow.postMessage(V({channel:c},e),this.frameUrl)},function(){var e=this,r=arguments;return new Promise((function(n,i){var o=t.apply(e,r);function a(e){H(o,n,i,a,s,"next",e)}function s(e){H(o,n,i,a,s,"throw",e)}a(void 0)}))}).call(this);var t}update(e){if(this.frameUrl){this.options=V({},this.options,e);var t=w(V({},this.options.styles,e.styles)),r=W(V({},this.options,e),{styles:t});this._postMessage({type:"update",data:W(V({},r),{styles:t})}),E("Updated field",this.options)}}setPlaceholder(e){this.update({placeholder:e})}setStyles(e){this.update({styles:e})}clear(){if(this.frameUrl){var e=this.type;this._postMessage({type:"reset",data:{type:e}}),E("Cleared field",{type:e})}}focus(){if(this.frameUrl){var e=this.type;this._postMessage({type:"focus",data:{type:e}}),E("Focus field",{type:e})}}redactValue(){if(this.frameUrl){var e=this.type;this._postMessage({type:"redact-value",data:{type:e}}),E("Redact field",{type:e})}}unredactValue(){if(this.frameUrl){var e=this.type;this._postMessage({type:"unredact-value",data:{type:e}}),E("Unredact field",{type:e})}}setEnterKeyHint(e){if(this.frameUrl){var t=this.type;this._postMessage({type:"set-enter-key-hint",data:{type:t,value:e}}),E("Updated enter key hint",{type:t,value:e})}}constructor(e){if(G(this,"frameUrl",void 0),G(this,"parentOrigin",void 0),G(this,"frame",void 0),G(this,"type",void 0),G(this,"options",void 0),G(this,"addEventListener",void 0),G(this,"removeEventListener",void 0),G(this,"ready",void 0),G(this,"_resolveReady",void 0),G(this,"complete",void 0),e){this.ready=new Promise((e=>{this._resolveReady=e}));var t=e.frameUrl,n=e.parentOrigin,i=e.font,o=e.sessionId,a=e.gr4vyId,s=e.environment,c=e.options,l=c.type,d=c.autoFocus,u=function(e,t){if(null==e)return{};var r,n,i,o={};if("undefined"!=typeof Reflect&&Reflect.ownKeys){for(r=Reflect.ownKeys(Object(e)),i=0;i<r.length;i++)n=r[i],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n]);return o}if(o=function(e,t){if(null==e)return{};var r,n,i={},o=Object.getOwnPropertyNames(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(i[r]=e[r]);return i}(e,t),Object.getOwnPropertySymbols)for(r=Object.getOwnPropertySymbols(e),i=0;i<r.length;i++)n=r[i],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n]);return o}(c,["type","autoFocus"]),h=e.paymentMethodScheme;this.frameUrl=t,this.parentOrigin=n,this.type=l,this.options=u;var p=w(u.styles),y={parentOrigin:n,type:l,sessionId:o,gr4vyId:a,environment:s};this.frame=document.createElement("iframe"),this.frame.id=l,this.frame.src=r("".concat(t,"/input.html"),y),this.frame.title="Secure Input",this.frame.style.display="block",this.frame.style.height="100%",this.frame.style.border="none",this.frame.style.width="100%",i&&(this.frame.src+="&font=".concat(i)),h&&(this.frame.src+="&paymentMethodScheme=".concat(h)),this.frame.onload=()=>{this._postMessage({type:"update",data:W(V({},this.options),{styles:p,type:l})}),E("Added field",this.options),d&&this.focus()}}}}function q(e,t,r,n,i,o,a){try{var s=e[o](a),c=s.value}catch(e){return void r(e)}s.done?t(c):Promise.resolve(c).then(n,i)}function z(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function Z(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){z(e,t,r[t])}))}return e}function Q(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}function J(e,t){if(null==e)return{};var r,n,i,o={};if("undefined"!=typeof Reflect&&Reflect.ownKeys){for(r=Reflect.ownKeys(Object(e)),i=0;i<r.length;i++)n=r[i],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n]);return o}if(o=function(e,t){if(null==e)return{};var r,n,i={},o=Object.getOwnPropertyNames(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(i[r]=e[r]);return i}(e,t),Object.getOwnPropertySymbols)for(r=Object.getOwnPropertySymbols(e),i=0;i<r.length;i++)n=r[i],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n]);return o}class ${static get Events(){return i}static get version(){return"#98b8221a9bbaca78d42aba26e7801b5b24958275"}update(e,t){this[e]=t}updateMethod(e,t){var r=t.data;this.update("method",e),p.publish(i.METHOD_CHANGE,r),E("Method changed",{method:e}),this.controller.contentWindow.postMessage({type:"method-change",channel:c},this.frameUrl)}setAutoAdvance(e){e.enabled&&(T(s.AUTO_ADVANCE_ENABLED),this.autoAdvance=(e=>{var t=e.enabled,r=e.secureFields,n=(e=>{if(!(null==e?void 0:e.length))return v;var t=e.filter(((t,r)=>v.includes(t)&&e.indexOf(t)===r)),r=v.filter((e=>!t.includes(e)));return[...t,...r]})(e.fieldOrder),i=e=>e?"number"===e?r.cardNumber:"expiryDate"===e?r.expiryDate:"securityCode"===e?r.securityCode:r.otherFields[e]:null,o=e=>{var t=e.type,r=e.nextIndex,a=null!=r?r:n.indexOf(t);if(!(a<0||a>=n.length-1)){var s=i(n[a+1]);!(null==s?void 0:s.complete)&&(null==s?void 0:s.frame)?s.focus():o({nextIndex:a+1})}};return{get enabled(){return t},get fieldOrder(){return n},updateEnterKeyHint:e=>{var r;if(null==e?void 0:e.frame){var o=n.indexOf(e.type),a=n[o+1],s=a&&(null===(r=i(a))||void 0===r?void 0:r.frame);e.setEnterKeyHint(t&&s?"next":"done")}},trigger:o}})(Q(Z({},e),{secureFields:this})))}_addField(e,t){if(!(e="string"==typeof e?document.querySelector(e):e)||!t.frame)return t.addEventListener=()=>{},t.removeEventListener=()=>{},t;var r=e.closest("[data-secure-fields-input-group]"),n=null!=r?r:document.createElement("div"),i=e=>{var r;if(e.origin===this.frameUrl&&(null===(r=e.data.data)||void 0===r?void 0:r.id)===t.type)switch(e.data.type){case"blur":p.publish("".concat(t.type,":blur"),e.data.data),n.removeAttribute(a.FOCUSED),E("Field blurred",e.data.data);break;case"focus":p.publish("".concat(t.type,":focus"),e.data.data),n.setAttribute(a.FOCUSED,""),E("Field focused",e.data.data);break;case"input":var i,o=e.data.data,s=o.complete,c=o.fromBlur,l=o.isDeleteInputType,d=J(o,["complete","fromBlur","isDeleteInputType"]);p.publish("".concat(t.type,":input"),d),t.complete=s,e.data.data.valid?n.removeAttribute(a.INVALID):n.setAttribute(a.INVALID,""),e.data.data.autofilled?n.setAttribute(a.AUTOFILLED,""):n.removeAttribute(a.AUTOFILLED),(null===(i=this.autoAdvance)||void 0===i?void 0:i.enabled)&&s&&!d.autofilled&&!1===c&&!l&&this.autoAdvance.trigger({type:t.type}),E("Field input changed",d);break;case"redacted":p.publish("".concat(t.type,":redacted"),e.data.data),E("Field redacted",e.data.data);break;case"unredacted":p.publish("".concat(t.type,":unredacted"),e.data.data),E("Field unredacted",e.data.data);break;case"card-details-changed":p.publish("".concat(t.type,":card-details-changed"),e.data.data),E("Card details changed",e.data.data)}};return m.remove("message",i,t.type),m.add("message",i,t.type),t.addEventListener=this.addEventListener,t.removeEventListener=this.removeEventListener,this.controllerReady.then((()=>{var i,o,a,s;i=e,o=n,Array.from(i.attributes).forEach((e=>{var t=e.name,r=e.value;_.some((e=>new RegExp(e).test(t)))&&o.setAttribute(t,r)})),(n=o).classList.add("secure-fields__input","secure-fields__input--".concat(A(t.type))),r?(null===(a=e.parentNode)||void 0===a||a.replaceChild(t.frame,e),r.style.display="inline-flex",r.style.alignItems="center",t.frame.style.minWidth="0"):(null===(s=e.parentNode)||void 0===s||s.replaceChild(n,e),n.appendChild(t.frame)),t._resolveReady(),t.frame.addEventListener("load",(()=>{var e;return null===(e=this.autoAdvance)||void 0===e?void 0:e.updateEnterKeyHint(t)}))})),t}addCardNumberField(e,t){return this.paymentMethodId&&T(s.PAYMENT_METHOD_ID_IN_USE,{method:"addCardNumberField"}),this.cardNumber||(this.cardNumber=new B(Q(Z({frameUrl:this.frameUrl,parentOrigin:this.parentOrigin,font:this.font,sessionId:this.config.sessionId,gr4vyId:this.config.gr4vyId,environment:this.config.environment},this.paymentMethodId?{paymentMethodId:this.paymentMethodId}:{}),{options:Q(Z({label:"Card number"},t),{type:"number"})}))),this._addField(e,this.cardNumber)}addSecurityCodeField(e,t){var r,n;return this.securityCode||(this.securityCode=new B({frameUrl:this.frameUrl,parentOrigin:this.parentOrigin,font:this.font,options:Q(Z({label:"Security code"},this.paymentMethodId&&!(null===(r=this.config.paymentMethod)||void 0===r?void 0:r.scheme)?{lengths:[3,4]}:{},t),{type:"securityCode"}),paymentMethodScheme:null===(n=this.config.paymentMethod)||void 0===n?void 0:n.scheme})),this._addField(e,this.securityCode)}addExpiryDateField(e,t){return this.paymentMethodId&&T(s.PAYMENT_METHOD_ID_IN_USE,{method:"addExpiryDateField"}),this.expiryDate||(this.expiryDate=new B({frameUrl:this.frameUrl,parentOrigin:this.parentOrigin,font:this.font,options:Q(Z({label:"Expiry date"},t),{type:"expiryDate"})})),this._addField(e,this.expiryDate)}addField(e,t){if(["number","expiryDate","securityCode"].includes(t.type)){t.pattern&&T(s.FIELD_PATTERN_IN_USE,Z({method:"addField"},t)),t.pattern,t.type;var r=J(t,["pattern","type"]);return this[l[t.type]](e,r)}return this.otherFields[t.type]||(this.otherFields=Q(Z({},this.otherFields),{[t.type]:new B({frameUrl:this.frameUrl,parentOrigin:this.parentOrigin,font:this.font,options:t})})),this._addField(e,this.otherFields[t.type])}addThreeDSecure(e,t){this.threeDS||(this.threeDS=new D(this),this.threeDS.init(e,t))}addClickToPay(e,t){return(r=function*(){if(!this.paymentMethodId)return this.clickToPayInstance=yield new K(this),this.clickToPay=yield this.clickToPayInstance.init(e,t),this.clickToPay;T(s.PAYMENT_METHOD_ID_IN_USE,{method:"addClickToPay"})},function(){var e=this,t=arguments;return new Promise((function(n,i){var o=r.apply(e,t);function a(e){q(o,n,i,a,s,"next",e)}function s(e){q(o,n,i,a,s,"throw",e)}a(void 0)}))}).call(this);var r}addEventListener(e,t){var r=this.type,n="".concat(this.constructor===B?"".concat(r,":"):"").concat(e);p.subscribe(n,t)}removeEventListener(e,t){var r=this.type,n="".concat(this.constructor===B?"".concat(r,":"):"").concat(e);p.unsubscribe(n,t)}submit(){var e,t,r=e=>{var t,n=[this.frameUrl,null===(t=this.clickToPayInstance)||void 0===t?void 0:t.origin].includes(e.origin),o=e.data.channel===c,a=["success","error"].includes(e.data.type);if(n&&o&&a){switch(e.data.type){case"success":var s;p.publish(i.CARD_VAULT_SUCCESS,e.data.data),(null===(s=e.data.data)||void 0===s?void 0:s.warn)&&(T(e.data.data.warn),delete e.data.data.warn),E("Payment method tokenized successfully",e.data.data);break;case"error":p.publish(i.CARD_VAULT_FAILURE,e.data),E("Failed to update checkout session",e.data.data)}window.removeEventListener("message",r)}};window.addEventListener("message",r),"click-to-pay"===this.method||"card"===this.method&&(null===(e=this.clickToPayInstance)||void 0===e?void 0:e.controller)&&!0===(null===(t=this.clickToPayInstance)||void 0===t?void 0:t.consent)?this.clickToPayInstance.controller.contentWindow.postMessage({type:"submit",channel:c},this.clickToPayInstance.url):this.controller.contentWindow.postMessage({type:"submit",channel:c,data:{method:this.paymentMethodId?"id":"card"}},this.frameUrl)}setDebug(e){localStorage.setItem(n,String(e))}addFont(e){this.font=e.replace(/\s/g,"+")}constructor(e){var t,n;z(this,"config",void 0),z(this,"controller",void 0),z(this,"frameUrl",void 0),z(this,"apiUrl",void 0),z(this,"parentOrigin",void 0),z(this,"font",void 0),z(this,"cardNumber",void 0),z(this,"securityCode",void 0),z(this,"expiryDate",void 0),z(this,"otherFields",{}),z(this,"method","card"),z(this,"clickToPayInstance",void 0),z(this,"clickToPay",void 0),z(this,"threeDS",void 0),z(this,"environmentPath",void 0),z(this,"paymentMethodId",void 0),z(this,"autoAdvance",null),z(this,"controllerReady",void 0),z(this,"_resolveControllerReady",void 0),p.unsubscribeAll(),this.config=Z({environment:"production"},e),this.controllerReady=new Promise((e=>{var t=Date.now();this._resolveControllerReady=()=>e(Date.now()-t)})),this.config.paymentMethodId&&!this.config.paymentMethod&&T(s.PAYMENT_METHOD_ID_DEPRECATED),this.environmentPath="sandbox"===this.config.environment?"sandbox.":"",this.frameUrl=window.SECURE_FIELDS_FRAME_URL||"https://secure-fields.".concat(this.environmentPath).concat(this.config.gr4vyId,".gr4vy.app"),this.parentOrigin=window.location.origin,this.paymentMethodId=(null===(t=this.config.paymentMethod)||void 0===t?void 0:t.id)||this.config.paymentMethodId;var o=Z({parentOrigin:this.parentOrigin,sessionId:this.config.sessionId,gr4vyId:this.config.gr4vyId,environment:this.config.environment},this.paymentMethodId?{paymentMethodId:this.paymentMethodId}:{});null===(n=document.body.querySelector("iframe#controller[src*=secure-fields]"))||void 0===n||n.remove(),this.controller=document.createElement("iframe"),this.controller.id="controller",this.controller.src=r("".concat(this.frameUrl,"/controller.html"),o),this.controller.title="Secure Controller",this.controller.style.position="absolute",this.controller.style.left="-9999999px",document.body.appendChild(this.controller),this.paymentMethodId&&(this.cardNumber=new B,this.expiryDate=new B),E("Initialized",Q(Z({},this.config),{version:$.version,frameUrl:this.frameUrl,parentOrigin:this.parentOrigin}));var a=e=>{if(e.origin===this.frameUrl)switch(e.data.type){case"ready":var t=Z({version:$.version},this.config);p.publish(i.READY,t),this._resolveControllerReady(),E("Ready",t);break;case"form-change":p.publish(i.FORM_CHANGE,e.data.data),E("Form change",e.data.data)}};m.remove("message",a,"init"),m.add("message",a,"init"),this.controllerReady.then((e=>E("Loaded controller after ".concat(e," milliseconds"))))}}return t})()));
1
+ !function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t();else if("function"==typeof define&&define.amd)define([],t);else{var r=t();for(var n in r)("object"==typeof exports?exports:e)[n]=r[n]}}(this,(()=>(()=>{"use strict";var e={d:(t,r)=>{for(var n in r)e.o(r,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:r[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{Events:()=>o,SecureFields:()=>X,SecureInput:()=>q});var r=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"production";return"https://".concat(arguments.length>2?arguments[2]:void 0,".").concat("sandbox"===t?"sandbox.":"").concat(e,".gr4vy.app")},n=(e,t)=>"".concat(e,"?").concat(new URLSearchParams(t).toString()),i="@gr4vy-secure-fields-debug",o=function(e){return e.CARD_VAULT_SUCCESS="card-vault-success",e.CARD_VAULT_FAILURE="card-vault-failure",e.FORM_CHANGE="form-change",e.METHOD_CHANGE="method-change",e.READY="ready",e.RESIZE="resize",e.CLICK_TO_PAY_INITIALIZED="click-to-pay-initialized",e.CLICK_TO_PAY_READY="click-to-pay-ready",e.CLICK_TO_PAY_SIGN_OUT="click-to-pay-sign-out",e.CLICK_TO_PAY_ERROR="click-to-pay-error",e.CLICK_TO_PAY_CANCEL="click-to-pay-cancel",e.CLICK_TO_PAY_CHECKOUT_WITH_NEW_CARD="click-to-pay-checkout-with-new-card",e.CLICK_TO_PAY_UNABLE_TO_LOAD_DPA="click-to-pay-unable-to-load-dpa",e.CLICK_TO_PAY_VISIBILITY_CHANGE="click-to-pay:visibility-change",e.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE="click-to-pay-card-form:visibility-change",e.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE="click-to-pay-sign-in:visibility-change",e.CLICK_TO_PAY_PROCESSING="click-to-pay-processing",e.CLICK_TO_PAY_AUTHENTICATE="click-to-pay-authenticate",e.CLICK_TO_PAY_AUTHENTICATE_FAILURE="click-to-pay-authenticate-failure",e.THREE_DS_START="three-ds-start",e.THREE_DS_FINISH="three-ds-finish",e}({}),a=function(e){return e.REQUEST_PORT="request-port",e.TRANSFER_PORT="transfer-port",e.REQUEST_RECOGNITION_TOKEN="request-recognition-token",e.REQUEST_RECOGNITION_TOKEN_FAILED="request-recognition-token-failed",e.RECOGNITION_TOKEN="recognition-token",e}({}),s=function(e){return e.FOCUSED="data-secure-fields-focused",e.INVALID="data-secure-fields-invalid",e.AUTOFILLED="data-secure-fields-autofilled",e}({}),c=function(e){return e.PAYMENT_METHOD_ID_IN_USE="You're passing a paymentMethodId to use a stored payment method, which means Secure Fields methods `addCardNumber`, `addExpiryDate` and `addClickToPay` are automatically disabled and won't render the related fields",e.PAYMENT_METHOD_ID_DEPRECATED="The 'paymentMethodId' prop is deprecated and will be removed in a future version. Please use the 'paymentMethod' prop instead: { paymentMethod: { id: 'your-id', scheme: 'visa' } }",e.FIELD_PATTERN_IN_USE="The `pattern` option can't be used on card fields, so it won't be applied here.",e.AUTO_ADVANCE_ENABLED="autoAdvance is enabled. Auto-advancing focus on field completion can degrade checkout UX (see WCAG 3.2.2). Use with caution.",e.NO_RECOGNITION_TOKEN="The recognition token couldn't be obtained or the request took too much time. It is possible that a Click to Pay user was therefore not recognised.",e}({}),l="secure-fields",d={number:"addCardNumberField",expiryDate:"addExpiryDateField",securityCode:"addSecurityCodeField"},u=["01","02","03","04","05"];function h(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function p(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,i,o=[],a=!0,s=!1;try{for(r=r.call(e);!(a=(n=r.next()).done)&&(o.push(n.value),!t||o.length!==t);a=!0);}catch(e){s=!0,i=e}finally{try{a||null==r.return||r.return()}finally{if(s)throw i}}return o}}(e,t)||function(e,t){if(e){if("string"==typeof e)return h(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(r):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?h(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}var y=new class{subscribe(e,t){this.subscribers.push([e,t])}unsubscribe(e,t){this.subscribers=this.subscribers.filter((r=>{var n=p(r,2),i=n[0],o=n[1];return i!==e||o.toString()!==t.toString()}))}unsubscribeAll(){this.subscribers=[]}publish(e,t){this.subscribers.forEach((r=>{var n=p(r,2),i=n[0],o=n[1];return setTimeout((()=>i===e?o(t):null),0)}))}constructor(){var e,t;t=void 0,(e="subscribers")in this?Object.defineProperty(this,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):this[e]=t,this.subscribers=[]}};function m(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function f(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,i,o=[],a=!0,s=!1;try{for(r=r.call(e);!(a=(n=r.next()).done)&&(o.push(n.value),!t||o.length!==t);a=!0);}catch(e){s=!0,i=e}finally{try{a||null==r.return||r.return()}finally{if(s)throw i}}return o}}(e,t)||function(e,t){if(e){if("string"==typeof e)return m(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(r):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?m(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}var v=new class{add(e,t,r){window.addEventListener(e,t),this.listeners.push([e,t,r])}remove(e,t,r){var n=this.listeners.findIndex((n=>{var i=f(n,3),o=i[0],a=i[1],s=i[2];return o===e&&a.toString()===t.toString()&&s===r}));if(-1!==n){var i=f(this.listeners.splice(n,1),1),o=f(i[0],2),a=o[0],s=o[1];window.removeEventListener(a,s)}}removeAll(){this.listeners.forEach((e=>{var t=f(e,2),r=t[0],n=t[1];window.removeEventListener(r,n)})),this.listeners=[]}constructor(){var e,t;t=[],(e="listeners")in this?Object.defineProperty(this,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):this[e]=t}},b=["number","expiryDate","securityCode","postalCode"],_=e=>{var t,r;if(null===(t=document)||void 0===t?void 0:t.cookie)return null===(r="; ".concat(document.cookie).match(";\\s*".concat(e,"=([^;]+)")))||void 0===r?void 0:r[1]},g=["accesskey","autocapitalize","autocomplete","autofocus","aria-.","class","contenteditable","data-.","dir","draggable","enterkeyhint","hidden","id","inert","inputmode","is","itemid","itemprop","itemref","itemscope","itemtype","lang","nonce","onabort","onautocomplete","onautocompleteerror","onblur","oncancel","oncanplay","oncanplaythrough","onchange","onclick","onclose","oncontextmenu","oncuechange","ondblclick","ondrag","ondragend","ondragenter","ondragleave","ondragover","ondragstart","ondrop","ondurationchange","onemptied","onended","onerror","onfocus","oninput","oninvalid","onkeydown","onkeypress","onkeyup","onload","onloadeddata","onloadedmetadata","onloadstart","onmousedown","onmouseenter","onmouseleave","onmousemove","onmouseout","onmouseover","onmouseup","onmousewheel","onpause","onplay","onplaying","onprogress","onratechange","onreset","onresize","onscroll","onseeked","onseeking","onselect","onshow","onsort","onstalled","onsubmit","onsuspend","ontimeupdate","ontoggle","onvolumechange","onwaiting","popover","role","slot","spellcheck","style","tabindex","title","translate"],I=(e,t)=>e&&(e.style.display=t?"block":"none");function O(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function C(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){O(e,t,r[t])}))}return e}var E={debug:!1,level:"log"},T=(e,t,r)=>{var n=C({},E,r),o=n.debug,a=n.level;(o||"true"===localStorage.getItem(i))&&console[a]("Gr4vy - Secure Fields - ".concat(e),t||{})},A=(e,t,r)=>{var n,i;T(e,t,(n=C({},r),i=null!=(i={level:"warn"})?i:{},Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(i)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(i)).forEach((function(e){Object.defineProperty(n,e,Object.getOwnPropertyDescriptor(i,e))})),n))},P=e=>(e!=e.toLowerCase()&&(e=e.replace(/[A-Z]/g,(e=>"-"+e.toLowerCase()))),e);function w(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}var S=function(){var e=function(t){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"";return Object.entries(t).reduce(((n,i)=>{var o,a,s=(a=2,function(e){if(Array.isArray(e))return e}(o=i)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,i,o=[],a=!0,s=!1;try{for(r=r.call(e);!(a=(n=r.next()).done)&&(o.push(n.value),!t||o.length!==t);a=!0);}catch(e){s=!0,i=e}finally{try{a||null==r.return||r.return()}finally{if(s)throw i}}return o}}(o,a)||function(e,t){if(e){if("string"==typeof e)return w(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(r):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?w(e,t):void 0}}(o,a)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),c=s[0],l=s[1];return(e=>"[object Object]"===Object.prototype.toString.call(e))(l)?n.push(...e(t[c],"".concat((r+c).match(/[a-zA-Z0-9]+/g).join("-"),"-"))):(c=P(c).replace(/^-/,""),n.push(["--".concat(r).concat(c),l])),n}),[])};return e(arguments.length>0&&void 0!==arguments[0]?arguments[0]:{})};function N(e,t,r,n,i,o,a){try{var s=e[o](a),c=s.value}catch(e){return void r(e)}s.done?t(c):Promise.resolve(c).then(n,i)}function k(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function L(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){k(e,t,r[t])}))}return e}function D(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}class R{init(e,t){var r;this.challengeWindowSize=u.includes(null==t?void 0:t.challengeWindowSize)?t.challengeWindowSize:"05",this.element="string"==typeof e?document.querySelector(e):e;var i="gr4vy-threeds-flow-controller";null===(r=document.body.querySelector("iframe#".concat(i)))||void 0===r||r.remove();var o=document.createElement("iframe");o.id=i,o.title="ThreeDSecure",o.style.display="block",o.style.border="0px",o.style.padding="0px",o.style.margin="0px",o.style.width="100%",o.style.height="100%",o.src=n(this.secureFields.frameUrl+"/threeds.html",{sessionId:this.secureFields.config.sessionId,parentOrigin:this.secureFields.parentOrigin,gr4vyId:this.secureFields.config.gr4vyId,environment:this.secureFields.config.environment}),this.element.appendChild(o),this.controller=o;var a={type:"three-ds-init",channel:l,data:{challengeWindowSize:this.challengeWindowSize}};return o.addEventListener("load",(()=>{var e;null===(e=o.contentWindow)||void 0===e||e.postMessage(a,this.secureFields.frameUrl)}),{once:!0}),this.secureFields.controller.addEventListener("load",(()=>{this.secureFields.controller.contentWindow.postMessage(a,this.secureFields.frameUrl)}),{once:!0}),v.remove("message",this.listener.bind(this),"three-ds"),v.add("message",this.listener.bind(this),"three-ds"),this}listener(e){return(t=function*(){if(e.origin===this.secureFields.frameUrl){var t=e.data,r=t.type,n=t.data;switch(r){case o.THREE_DS_START:y.publish(o.THREE_DS_START,D(L({},n),{element:this.element})),T("3DS start",e.data.data);break;case o.THREE_DS_FINISH:y.publish(o.THREE_DS_FINISH,D(L({},n),{element:this.element})),T("3DS finish",e.data.data)}}},function(){var e=this,r=arguments;return new Promise((function(n,i){var o=t.apply(e,r);function a(e){N(o,n,i,a,s,"next",e)}function s(e){N(o,n,i,a,s,"throw",e)}a(void 0)}))}).call(this);var t}constructor(e){k(this,"secureFields",void 0),k(this,"controller",void 0),k(this,"challengeWindowSize",void 0),k(this,"element",void 0),this.secureFields=e}}function U(e,t,r,n,i,o,a){try{var s=e[o](a),c=s.value}catch(e){return void r(e)}s.done?t(c):Promise.resolve(c).then(n,i)}class j extends Error{constructor(e){super(e),this.name="UnableToLoadDpaError"}}function F(e,t,r,n,i,o,a){try{var s=e[o](a),c=s.value}catch(e){return void r(e)}s.done?t(c):Promise.resolve(c).then(n,i)}function M(e){return function(){var t=this,r=arguments;return new Promise((function(n,i){var o=e.apply(t,r);function a(e){F(o,n,i,a,s,"next",e)}function s(e){F(o,n,i,a,s,"throw",e)}a(void 0)}))}}function x(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function Y(){return Y=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},Y.apply(this,arguments)}function K(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){x(e,t,r[t])}))}return e}class H{_addIframe(e,t,r,i){var o=document.createElement("iframe");return o.id=e,o.title=t,o.setAttribute("width","100%"),o.setAttribute("frameborder","0"),o.setAttribute("style","height:0px"),o.src=n(r,i),o}_attachListeners(){var e=new MessageChannel,t=!0,r=r=>{var n=r.origin,i=r.data,s=i.type,d=i.data;switch(n){case this.origin:switch(s){case o.RESIZE:this.controller.style.height="".concat(d.height>0?d.height+48:0,"px");break;case o.METHOD_CHANGE:var u=d.method||"card";(this.secureFields.method!==u||t)&&(t=!1,this.secureFields.updateMethod(u,{data:d}),I(this.cardForm,"card"===u),y.publish(o.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE,"card"===u));break;case o.CLICK_TO_PAY_INITIALIZED:y.publish(o.CLICK_TO_PAY_INITIALIZED,this.clickToPay),T("Click to Pay initialized",this.clickToPay),I(this.signIn,!1),y.publish(o.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!1),I(this.clickToPay.element,!0),y.publish(o.CLICK_TO_PAY_VISIBILITY_CHANGE,!0);break;case o.CLICK_TO_PAY_READY:this._buyerExists=d.buyerExists,y.publish(o.CLICK_TO_PAY_READY,d),T("Click to Pay ready"),I(this.signIn,!d.buyerExists),y.publish(o.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!d.buyerExists),I(this.clickToPay.element,!0),y.publish(o.CLICK_TO_PAY_VISIBILITY_CHANGE,!0);break;case o.CLICK_TO_PAY_SIGN_OUT:this.clickToPay.signOut();break;case o.CLICK_TO_PAY_ERROR:y.publish(o.CLICK_TO_PAY_ERROR,d),T("Click to Pay error:",d),I(this.signIn,!["UNKNOWN","INVALID_CARD","CODE_INVALID"].includes(d.error)),y.publish(o.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!["UNKNOWN","INVALID_CARD","CODE_INVALID"].includes(d.error)),I(this.clickToPay.element,"UNKNOWN"!==d.error),y.publish(o.CLICK_TO_PAY_VISIBILITY_CHANGE,"UNKNOWN"!==d.error);break;case o.CLICK_TO_PAY_CANCEL:y.publish(o.CLICK_TO_PAY_CANCEL,d),T("Click to Pay cancelled"),this._buyerExists||(I(this.signIn,!0),y.publish(o.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!0));break;case o.CLICK_TO_PAY_CHECKOUT_WITH_NEW_CARD:y.publish(o.CLICK_TO_PAY_CHECKOUT_WITH_NEW_CARD,d),I(this.signIn,!1),y.publish(o.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!1),T("Click to Pay checkout with new card initiated");break;case o.CLICK_TO_PAY_PROCESSING:I(this.cardForm,!d),y.publish(o.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE,d),T("Click to Pay processing",d);break;case o.CLICK_TO_PAY_AUTHENTICATE:!function(e,t){for(var r=arguments.length,n=new Array(r>2?r-2:0),i=2;i<r;i++)n[i-2]=arguments[i];document.cookie="".concat(e,"=").concat(t,"; path=/; ").concat(n.join("; "))}("recognitionToken",d.recognitionToken,"Secure","SameSite=Strict","MaxAge=15552000");break;case o.CLICK_TO_PAY_AUTHENTICATE_FAILURE:y.publish(o.CLICK_TO_PAY_AUTHENTICATE_FAILURE,d),T("Click to Pay authenticate failure:",d);break;case a.REQUEST_RECOGNITION_TOKEN:this.controller.contentWindow.postMessage({channel:l,type:a.RECOGNITION_TOKEN,data:{recognitionToken:_("recognitionToken")}},this.origin);break;case a.REQUEST_RECOGNITION_TOKEN_FAILED:A(c.NO_RECOGNITION_TOKEN);break;case a.REQUEST_PORT:this.controller.contentWindow.postMessage({channel:l,type:a.TRANSFER_PORT},this.origin,[e.port1])}break;case this.secureFields.frameUrl:s===a.REQUEST_PORT&&this.encrypt.contentWindow.postMessage({channel:l,type:a.TRANSFER_PORT},this.secureFields.frameUrl,[e.port2])}};v.remove("message",r,"click-to-pay"),v.add("message",r,"click-to-pay")}_fetchDPA(e,t){return M((function*(e,t){var n=t.gr4vyId,i=t.environment,a=t.sessionId;try{var s=e||function(e){return r(e,arguments.length>1&&void 0!==arguments[1]?arguments[1]:"production","api")}(n,i);return yield function(e){return(t=function*(e){var t=e.apiBaseUrl,r=e.checkoutSessionId;try{var n="".concat(t,"/digital-wallets/click-to-pay/session"),i=yield fetch(n,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({checkout_session_id:r})});if(i.ok){var o=yield i.json();return{srcDpaId:o.digital_payment_application_id,dpaName:o.digital_payment_application_name}}throw new j("Unable to load DPA")}catch(e){throw new j("Unable to load DPA")}},function(){var e=this,r=arguments;return new Promise((function(n,i){var o=t.apply(e,r);function a(e){U(o,n,i,a,s,"next",e)}function s(e){U(o,n,i,a,s,"throw",e)}a(void 0)}))}).apply(this,arguments);var t}({apiBaseUrl:s,checkoutSessionId:a})}catch(e){return T(e.message),y.publish(o.CLICK_TO_PAY_UNABLE_TO_LOAD_DPA),I(this.cardForm,!0),y.publish(o.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE,!0),I(this.clickToPay.element,!1),void y.publish(o.CLICK_TO_PAY_VISIBILITY_CHANGE,!1)}})).apply(this,arguments)}_initConsentCheckbox(e){var t=e.checked?"click-to-pay":"card";this.secureFields.updateMethod(t,{data:{method:t}}),e.addEventListener("change",(e=>{var t=e.target;this.consent=t.checked})),v.add("message",(t=>{switch(t.data.type){case o.CLICK_TO_PAY_ERROR:"UNKNOWN"===t.data.data.error&&(this.consent=!1,e.checked=!1);break;case o.METHOD_CHANGE:var r=this._buyerExists&&"card"===t.data.data.method;this.consent=r,e.checked=r}}),"click-to-pay-consent-checkbox")}_setNewCardRememberMe(e){this.controller.contentWindow.postMessage({type:"remember-me-new-card-changed",channel:l,data:{value:e}},this.origin)}_initNewCardRememberMeCheckbox(e){e.addEventListener("change",(e=>{var t=e.target;this._setNewCardRememberMe(t.checked)})),v.add("message",(t=>{switch(t.data.type){case o.CLICK_TO_PAY_INITIALIZED:this._setNewCardRememberMe(e.checked);break;case o.CLICK_TO_PAY_ERROR:"UNKNOWN"===t.data.data.error&&(this._setNewCardRememberMe(!1),e.checked=!1)}}),"click-to-pay-new-card-remember-me-checkbox")}_initLearnMore(e){e.style.visibility="hidden",v.add("message",(t=>{t.data.type===o.CLICK_TO_PAY_INITIALIZED&&(e.style.visibility="visible",e.addEventListener("click",(()=>{this.controller.contentWindow.postMessage({type:"show-learn-more",channel:l},this.origin)})))}),"click-to-pay-learn-more")}init(e,t){return M((function*(){this.cardForm="string"==typeof(null==t?void 0:t.cardForm)?document.querySelector(null==t?void 0:t.cardForm):null==t?void 0:t.cardForm,this.signIn="string"==typeof(null==t?void 0:t.signIn)?document.querySelector(null==t?void 0:t.signIn):null==t?void 0:t.signIn,I(this.signIn,!1);var r=this.secureFields,n=r.apiUrl,i=r.config,a=i.gr4vyId,s=i.environment,c=i.sessionId,l=r.environmentPath;if(this.clickToPay={element:null,options:t,signIn:e=>{var t=e.email,r=e.mobileNumber;return M((function*(){var e=this.clickToPay,n=e.element,i=e.options;delete i.email,delete i.mobileNumber,n.innerHTML="",I(this.signIn,!1),y.publish(o.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!1),I(this.cardForm,!1),y.publish(o.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE,!1),this.secureFields.update("clickToPay",yield this.init(n,K({},i,t?{email:t}:{},r?{mobileNumber:r}:{})))})).call(this)},signOut:()=>(this._buyerExists=!1,y.publish(o.CLICK_TO_PAY_SIGN_OUT),T("Click to pay signed out"),I(this.signIn,!0),y.publish(o.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!0),document.cookie="".concat("recognitionToken","=; path=/; expires=Thu, 01 Jan 1970 00:00:00 UTC;"),this.clickToPay.signIn({email:null,mobileNumber:null}))},!(null==t?void 0:t.srcDpaId)||!(null==t?void 0:t.dpaName)){var d=yield this._fetchDPA(n,{gr4vyId:a,environment:s,sessionId:c});if(!(null==d?void 0:d.srcDpaId)&&!(null==d?void 0:d.dpaName))return;t.srcDpaId=d.srcDpaId,t.dpaName=d.dpaName}this.url=window.CLICK_TO_PAY_FRAME_URL||"https://click-to-pay.".concat(l).concat(a,".gr4vy.app"),this.origin=new URL(this.url).origin;var u=window.location.origin,h=(function(e){if(null==e)throw new TypeError("Cannot destructure "+e)}(t),K({gr4vyId:a,environment:s,sessionId:c},Y({},t)));if(this.controller=this._addIframe("click-to-pay-controller","Click To Pay","".concat(this.url,"/click-to-pay.html"),{parentOrigin:u,environment:s,config:encodeURIComponent(JSON.stringify(h))}),this.encrypt=this._addIframe("click-to-pay-encrypt","Click To Pay Encrypt","".concat(this.secureFields.frameUrl,"/click-to-pay-encrypt.html"),{parentOrigin:u,environment:s,config:encodeURIComponent(JSON.stringify(h))}),this._attachListeners(),null==t?void 0:t.consentCheckbox){var p="string"==typeof(null==t?void 0:t.consentCheckbox)?document.querySelector(null==t?void 0:t.consentCheckbox):null==t?void 0:t.consentCheckbox;p&&this._initConsentCheckbox(p)}if(null==t?void 0:t.rememberMeCheckbox){var m="string"==typeof(null==t?void 0:t.rememberMeCheckbox)?document.querySelector(t.rememberMeCheckbox):null==t?void 0:t.rememberMeCheckbox;m&&this._initNewCardRememberMeCheckbox(m)}if(null==t?void 0:t.learnMoreLink){var f="string"==typeof(null==t?void 0:t.learnMoreLink)?document.querySelector(null==t?void 0:t.learnMoreLink):null==t?void 0:t.learnMoreLink;f&&this._initLearnMore(f)}return(e="string"==typeof e?document.querySelector(e):e).appendChild(this.controller),e.appendChild(this.encrypt),this.clickToPay.element=e,this.clickToPay})).call(this)}constructor(e){x(this,"secureFields",void 0),x(this,"_buyerExists",void 0),x(this,"consent",void 0),x(this,"controller",void 0),x(this,"encrypt",void 0),x(this,"origin",void 0),x(this,"url",void 0),x(this,"cardForm",void 0),x(this,"signIn",void 0),x(this,"clickToPay",void 0),this.secureFields=e,this._buyerExists=!1,this.consent=!1}}function G(e,t,r,n,i,o,a){try{var s=e[o](a),c=s.value}catch(e){return void r(e)}s.done?t(c):Promise.resolve(c).then(n,i)}function V(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function W(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){V(e,t,r[t])}))}return e}function B(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}class q{_postMessage(e){return(t=function*(){yield this.ready,this.frame.contentWindow.postMessage(W({channel:l},e),this.frameUrl)},function(){var e=this,r=arguments;return new Promise((function(n,i){var o=t.apply(e,r);function a(e){G(o,n,i,a,s,"next",e)}function s(e){G(o,n,i,a,s,"throw",e)}a(void 0)}))}).call(this);var t}update(e){if(this.frameUrl){this.options=W({},this.options,e);var t=S(W({},this.options.styles,e.styles)),r=B(W({},this.options,e),{styles:t});this._postMessage({type:"update",data:B(W({},r),{styles:t})}),T("Updated field",this.options)}}setPlaceholder(e){this.update({placeholder:e})}setStyles(e){this.update({styles:e})}clear(){if(this.frameUrl){var e=this.type;this._postMessage({type:"reset",data:{type:e}}),T("Cleared field",{type:e})}}focus(){if(this.frameUrl){var e=this.type;this._postMessage({type:"focus",data:{type:e}}),T("Focus field",{type:e})}}redactValue(){if(this.frameUrl){var e=this.type;this._postMessage({type:"redact-value",data:{type:e}}),T("Redact field",{type:e})}}unredactValue(){if(this.frameUrl){var e=this.type;this._postMessage({type:"unredact-value",data:{type:e}}),T("Unredact field",{type:e})}}setEnterKeyHint(e){if(this.frameUrl){var t=this.type;this._postMessage({type:"set-enter-key-hint",data:{type:t,value:e}}),T("Updated enter key hint",{type:t,value:e})}}constructor(e){if(V(this,"frameUrl",void 0),V(this,"parentOrigin",void 0),V(this,"frame",void 0),V(this,"type",void 0),V(this,"options",void 0),V(this,"addEventListener",void 0),V(this,"removeEventListener",void 0),V(this,"ready",void 0),V(this,"_resolveReady",void 0),V(this,"complete",void 0),e){this.ready=new Promise((e=>{this._resolveReady=e}));var t=e.frameUrl,r=e.parentOrigin,i=e.font,o=e.sessionId,a=e.gr4vyId,s=e.environment,c=e.options,l=c.type,d=c.autoFocus,u=function(e,t){if(null==e)return{};var r,n,i,o={};if("undefined"!=typeof Reflect&&Reflect.ownKeys){for(r=Reflect.ownKeys(Object(e)),i=0;i<r.length;i++)n=r[i],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n]);return o}if(o=function(e,t){if(null==e)return{};var r,n,i={},o=Object.getOwnPropertyNames(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(i[r]=e[r]);return i}(e,t),Object.getOwnPropertySymbols)for(r=Object.getOwnPropertySymbols(e),i=0;i<r.length;i++)n=r[i],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n]);return o}(c,["type","autoFocus"]),h=e.paymentMethodScheme;this.frameUrl=t,this.parentOrigin=r,this.type=l,this.options=u;var p=S(u.styles),y={parentOrigin:r,type:l,sessionId:o,gr4vyId:a,environment:s};this.frame=document.createElement("iframe"),this.frame.id=l,this.frame.src=n("".concat(t,"/input.html"),y),this.frame.title="Secure Input",this.frame.style.display="block",this.frame.style.height="100%",this.frame.style.border="none",this.frame.style.width="100%",i&&(this.frame.src+="&font=".concat(i)),h&&(this.frame.src+="&paymentMethodScheme=".concat(h)),this.frame.onload=()=>{this._postMessage({type:"update",data:B(W({},this.options),{styles:p,type:l})}),T("Added field",this.options),d&&this.focus()}}}}function z(e,t,r,n,i,o,a){try{var s=e[o](a),c=s.value}catch(e){return void r(e)}s.done?t(c):Promise.resolve(c).then(n,i)}function Z(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function Q(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){Z(e,t,r[t])}))}return e}function J(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}function $(e,t){if(null==e)return{};var r,n,i,o={};if("undefined"!=typeof Reflect&&Reflect.ownKeys){for(r=Reflect.ownKeys(Object(e)),i=0;i<r.length;i++)n=r[i],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n]);return o}if(o=function(e,t){if(null==e)return{};var r,n,i={},o=Object.getOwnPropertyNames(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(i[r]=e[r]);return i}(e,t),Object.getOwnPropertySymbols)for(r=Object.getOwnPropertySymbols(e),i=0;i<r.length;i++)n=r[i],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n]);return o}class X{static get Events(){return o}static get version(){return"#680b6d541e78acf43fc5b6703d7aad37e9881684"}update(e,t){this[e]=t}updateMethod(e,t){var r=t.data;this.update("method",e),y.publish(o.METHOD_CHANGE,r),T("Method changed",{method:e}),this.controller.contentWindow.postMessage({type:"method-change",channel:l},this.frameUrl)}setAutoAdvance(e){e.enabled&&(A(c.AUTO_ADVANCE_ENABLED),this.autoAdvance=(e=>{var t=e.enabled,r=e.secureFields,n=(e=>{if(!(null==e?void 0:e.length))return b;var t=e.filter(((t,r)=>b.includes(t)&&e.indexOf(t)===r)),r=b.filter((e=>!t.includes(e)));return[...t,...r]})(e.fieldOrder),i=e=>e?"number"===e?r.cardNumber:"expiryDate"===e?r.expiryDate:"securityCode"===e?r.securityCode:r.otherFields[e]:null,o=e=>{var t=e.type,r=e.nextIndex,a=null!=r?r:n.indexOf(t);if(!(a<0||a>=n.length-1)){var s=i(n[a+1]);!(null==s?void 0:s.complete)&&(null==s?void 0:s.frame)?s.focus():o({nextIndex:a+1})}};return{get enabled(){return t},get fieldOrder(){return n},updateEnterKeyHint:e=>{var r;if(null==e?void 0:e.frame){var o=n.indexOf(e.type),a=n[o+1],s=a&&(null===(r=i(a))||void 0===r?void 0:r.frame);e.setEnterKeyHint(t&&s?"next":"done")}},trigger:o}})(J(Q({},e),{secureFields:this})))}_addField(e,t,r){if(!(e="string"==typeof e?document.querySelector(e):e)||!t.frame)return t.addEventListener=()=>{},t.removeEventListener=()=>{},t;var n=e.closest("[data-secure-fields-input-group]"),i=null!=n?n:document.createElement("div"),o=e=>{var r;if(e.origin===this.frameUrl&&(null===(r=e.data.data)||void 0===r?void 0:r.id)===t.type)switch(e.data.type){case"blur":y.publish("".concat(t.type,":blur"),e.data.data),i.removeAttribute(s.FOCUSED),T("Field blurred",e.data.data);break;case"focus":y.publish("".concat(t.type,":focus"),e.data.data),i.setAttribute(s.FOCUSED,""),T("Field focused",e.data.data);break;case"input":var n,o,a=e.data.data,c=a.complete,l=a.fromBlur,d=a.isDeleteInputType,u=$(a,["complete","fromBlur","isDeleteInputType"]);y.publish("".concat(t.type,":input"),u),t.complete=c,e.data.data.valid?i.removeAttribute(s.INVALID):i.setAttribute(s.INVALID,""),e.data.data.autofilled?i.setAttribute(s.AUTOFILLED,""):i.removeAttribute(s.AUTOFILLED),(null===(n=this.autoAdvance)||void 0===n?void 0:n.enabled)&&c&&!u.autofilled&&!1===l&&!d&&this.autoAdvance.trigger({type:t.type}),this.schemeIcons&&"number"===t.type&&(u.bin||(this.cardDetailsScheme=null),this.schemeIcons.toggleScheme(null!==(o=this.cardDetailsScheme)&&void 0!==o?o:u.schema)),T("Field input changed",u);break;case"redacted":y.publish("".concat(t.type,":redacted"),e.data.data),T("Field redacted",e.data.data);break;case"unredacted":y.publish("".concat(t.type,":unredacted"),e.data.data),T("Field unredacted",e.data.data);break;case"card-details-changed":this.cardDetailsScheme=e.data.data.scheme,y.publish("".concat(t.type,":card-details-changed"),e.data.data),this.schemeIcons&&this.schemeIcons.showScheme(e.data.data.scheme),T("Card details changed",e.data.data)}};return v.remove("message",o,t.type),v.add("message",o,t.type),t.addEventListener=this.addEventListener,t.removeEventListener=this.removeEventListener,this.controllerReady.then((()=>{var o,a,s,c;o=e,a=i,Array.from(o.attributes).forEach((e=>{var t=e.name,r=e.value;g.some((e=>new RegExp(e).test(t)))&&a.setAttribute(t,r)})),(i=a).classList.add("secure-fields__input","secure-fields__input--".concat(P(t.type))),n?(null===(s=e.parentNode)||void 0===s||s.replaceChild(t.frame,e),n.style.display="inline-flex",n.style.alignItems="center",t.frame.style.minWidth="0"):(null===(c=e.parentNode)||void 0===c||c.replaceChild(i,e),i.appendChild(t.frame)),"number"===t.type&&(null==r?void 0:r.showSchemeIcons)&&(i.style.display="inline-flex",i.style.alignItems="center",this.schemeIcons=(()=>{var e={baseUrl:"".concat(this.cdnBaseUrl,"/assets/icons/card-schemes")}.baseUrl,t=!1,r=document.createElement("div");r.classList.add("scheme-icons"),r.style.display="flex",r.style.marginRight="4px";var n=document.createElement("img");n.setAttribute("alt",""),n.setAttribute("aria-hidden","true"),n.style.display="none",n.onerror=()=>{t=!0,n.style.display="none"},r.appendChild(n);var i=r=>{if(r){var i="".concat(e,"/").concat(r,".svg");n.getAttribute("src")!==i?(t=!1,n.style.display="block",n.setAttribute("src",i),n.width=48):t||(n.style.display="block")}},o=()=>{n.style.display="none"};return{container:r,scheme:n,showScheme:i,hideScheme:o,toggleScheme:e=>{e?i(e):o()}}})(),t.frame.after(this.schemeIcons.container)),t._resolveReady(),t.frame.addEventListener("load",(()=>{var e;return null===(e=this.autoAdvance)||void 0===e?void 0:e.updateEnterKeyHint(t)}))})),t}addCardNumberField(e,t){return this.paymentMethodId&&A(c.PAYMENT_METHOD_ID_IN_USE,{method:"addCardNumberField"}),this.cardNumber||(this.cardNumber=new q(J(Q({frameUrl:this.frameUrl,parentOrigin:this.parentOrigin,font:this.font,sessionId:this.config.sessionId,gr4vyId:this.config.gr4vyId,environment:this.config.environment},this.paymentMethodId?{paymentMethodId:this.paymentMethodId}:{}),{options:J(Q({label:"Card number"},t),{type:"number"})}))),this._addField(e,this.cardNumber,t)}addSecurityCodeField(e,t){var r,n;return this.securityCode||(this.securityCode=new q({frameUrl:this.frameUrl,parentOrigin:this.parentOrigin,font:this.font,options:J(Q({label:"Security code"},this.paymentMethodId&&!(null===(r=this.config.paymentMethod)||void 0===r?void 0:r.scheme)?{lengths:[3,4]}:{},t),{type:"securityCode"}),paymentMethodScheme:null===(n=this.config.paymentMethod)||void 0===n?void 0:n.scheme})),this._addField(e,this.securityCode)}addExpiryDateField(e,t){return this.paymentMethodId&&A(c.PAYMENT_METHOD_ID_IN_USE,{method:"addExpiryDateField"}),this.expiryDate||(this.expiryDate=new q({frameUrl:this.frameUrl,parentOrigin:this.parentOrigin,font:this.font,options:J(Q({label:"Expiry date"},t),{type:"expiryDate"})})),this._addField(e,this.expiryDate)}addField(e,t){if(["number","expiryDate","securityCode"].includes(t.type)){t.pattern&&A(c.FIELD_PATTERN_IN_USE,Q({method:"addField"},t)),t.pattern,t.type;var r=$(t,["pattern","type"]);return this[d[t.type]](e,r)}return this.otherFields[t.type]||(this.otherFields=J(Q({},this.otherFields),{[t.type]:new q({frameUrl:this.frameUrl,parentOrigin:this.parentOrigin,font:this.font,options:t})})),this._addField(e,this.otherFields[t.type])}addThreeDSecure(e,t){this.threeDS||(this.threeDS=new R(this),this.threeDS.init(e,t))}addClickToPay(e,t){return(r=function*(){if(!this.paymentMethodId)return this.clickToPayInstance=yield new H(this),this.clickToPay=yield this.clickToPayInstance.init(e,t),this.clickToPay;A(c.PAYMENT_METHOD_ID_IN_USE,{method:"addClickToPay"})},function(){var e=this,t=arguments;return new Promise((function(n,i){var o=r.apply(e,t);function a(e){z(o,n,i,a,s,"next",e)}function s(e){z(o,n,i,a,s,"throw",e)}a(void 0)}))}).call(this);var r}addEventListener(e,t){var r=this.type,n="".concat(this.constructor===q?"".concat(r,":"):"").concat(e);y.subscribe(n,t)}removeEventListener(e,t){var r=this.type,n="".concat(this.constructor===q?"".concat(r,":"):"").concat(e);y.unsubscribe(n,t)}submit(){var e,t,r=e=>{var t,n=[this.frameUrl,null===(t=this.clickToPayInstance)||void 0===t?void 0:t.origin].includes(e.origin),i=e.data.channel===l,a=["success","error"].includes(e.data.type);if(n&&i&&a){switch(e.data.type){case"success":var s;y.publish(o.CARD_VAULT_SUCCESS,e.data.data),(null===(s=e.data.data)||void 0===s?void 0:s.warn)&&(A(e.data.data.warn),delete e.data.data.warn),T("Payment method tokenized successfully",e.data.data);break;case"error":y.publish(o.CARD_VAULT_FAILURE,e.data),T("Failed to update checkout session",e.data.data)}window.removeEventListener("message",r)}};window.addEventListener("message",r),"click-to-pay"===this.method||"card"===this.method&&(null===(e=this.clickToPayInstance)||void 0===e?void 0:e.controller)&&!0===(null===(t=this.clickToPayInstance)||void 0===t?void 0:t.consent)?this.clickToPayInstance.controller.contentWindow.postMessage({type:"submit",channel:l},this.clickToPayInstance.url):this.controller.contentWindow.postMessage({type:"submit",channel:l,data:{method:this.paymentMethodId?"id":"card"}},this.frameUrl)}setDebug(e){localStorage.setItem(i,String(e))}addFont(e){this.font=e.replace(/\s/g,"+")}constructor(e){var t,i;Z(this,"config",void 0),Z(this,"controller",void 0),Z(this,"frameUrl",void 0),Z(this,"apiUrl",void 0),Z(this,"cdnBaseUrl",void 0),Z(this,"parentOrigin",void 0),Z(this,"font",void 0),Z(this,"cardNumber",void 0),Z(this,"securityCode",void 0),Z(this,"expiryDate",void 0),Z(this,"otherFields",{}),Z(this,"method","card"),Z(this,"clickToPayInstance",void 0),Z(this,"clickToPay",void 0),Z(this,"threeDS",void 0),Z(this,"environmentPath",void 0),Z(this,"paymentMethodId",void 0),Z(this,"autoAdvance",null),Z(this,"schemeIcons",null),Z(this,"cardDetailsScheme",null),Z(this,"controllerReady",void 0),Z(this,"_resolveControllerReady",void 0),y.unsubscribeAll(),this.config=Q({environment:"production"},e),this.controllerReady=new Promise((e=>{var t=Date.now();this._resolveControllerReady=()=>e(Date.now()-t)})),this.config.paymentMethodId&&!this.config.paymentMethod&&A(c.PAYMENT_METHOD_ID_DEPRECATED),this.environmentPath="sandbox"===this.config.environment?"sandbox.":"",this.frameUrl=window.SECURE_FIELDS_FRAME_URL||"https://secure-fields.".concat(this.environmentPath).concat(this.config.gr4vyId,".gr4vy.app"),this.parentOrigin=window.location.origin,this.paymentMethodId=(null===(t=this.config.paymentMethod)||void 0===t?void 0:t.id)||this.config.paymentMethodId,this.cdnBaseUrl=function(e){return r(e,arguments.length>1&&void 0!==arguments[1]?arguments[1]:"production","cdn")}(this.config.gr4vyId,this.config.environment);var a=Q({parentOrigin:this.parentOrigin,sessionId:this.config.sessionId,gr4vyId:this.config.gr4vyId,environment:this.config.environment},this.paymentMethodId?{paymentMethodId:this.paymentMethodId}:{});null===(i=document.body.querySelector("iframe#controller[src*=secure-fields]"))||void 0===i||i.remove(),this.controller=document.createElement("iframe"),this.controller.id="controller",this.controller.src=n("".concat(this.frameUrl,"/controller.html"),a),this.controller.title="Secure Controller",this.controller.style.position="absolute",this.controller.style.left="-9999999px",document.body.appendChild(this.controller),this.paymentMethodId&&(this.cardNumber=new q,this.expiryDate=new q),T("Initialized",J(Q({},this.config),{version:X.version,frameUrl:this.frameUrl,parentOrigin:this.parentOrigin}));var s=e=>{if(e.origin===this.frameUrl)switch(e.data.type){case"ready":var t=Q({version:X.version},this.config);y.publish(o.READY,t),this._resolveControllerReady(),T("Ready",t);break;case"form-change":y.publish(o.FORM_CHANGE,e.data.data),T("Form change",e.data.data)}};v.remove("message",s,"init"),v.add("message",s,"init"),this.controllerReady.then((e=>T("Loaded controller after ".concat(e," milliseconds"))))}}return t})()));
package/lib/types.d.ts CHANGED
@@ -43,6 +43,7 @@ export type Field = {
43
43
  size?: number;
44
44
  autoFocus?: boolean;
45
45
  maskInput?: boolean | FieldMaskConfig;
46
+ showSchemeIcons?: boolean;
46
47
  };
47
48
  export type FieldEventType = keyof HTMLElementEventMap | 'redacted' | 'unredacted' | 'card-details-changed';
48
49
  export type FieldEvent = {
@@ -52,6 +53,9 @@ export type FieldEvent = {
52
53
  valid: boolean;
53
54
  autofilled: boolean;
54
55
  empty: boolean;
56
+ schema?: string;
57
+ scheme?: string;
58
+ bin?: string;
55
59
  complete?: boolean;
56
60
  fromBlur?: boolean;
57
61
  isDeleteInputType?: boolean;
@@ -4,6 +4,7 @@ export * from './copy-element-attributes';
4
4
  export * from './dom';
5
5
  export * from './is';
6
6
  export * from './logger';
7
+ export * from './scheme-icons';
7
8
  export * from './strings';
8
9
  export * from './styles';
9
10
  export * from './url';
@@ -0,0 +1,9 @@
1
+ export declare const createSchemeIcons: ({ baseUrl }: {
2
+ baseUrl: string;
3
+ }) => {
4
+ container: HTMLDivElement;
5
+ scheme: HTMLImageElement;
6
+ showScheme: (_scheme: string) => void;
7
+ hideScheme: () => void;
8
+ toggleScheme: (_scheme?: string) => void;
9
+ };
@@ -4,5 +4,6 @@ declare const parseUrl: (url?: string) => {
4
4
  font: string;
5
5
  };
6
6
  declare const buildApiBaseUrl: (gr4vyId: string, environment?: string) => string;
7
+ declare const buildCdnBaseUrl: (gr4vyId: string, environment?: string) => string;
7
8
  declare const buildQueryUrl: (url: string, params: Record<string, string>) => string;
8
- export { buildApiBaseUrl, buildQueryUrl, parseUrl };
9
+ export { buildApiBaseUrl, buildCdnBaseUrl, buildQueryUrl, parseUrl };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gr4vy/secure-fields",
3
- "version": "2.5.0",
3
+ "version": "2.6.0",
4
4
  "description": "Gr4vy-hosted secure fields offering advanced theming, PCI compliance, event handling, and more.",
5
5
  "main": "lib/index",
6
6
  "types": "lib/index",
@@ -56,5 +56,5 @@
56
56
  "access": "public",
57
57
  "registry": "https://registry.npmjs.org"
58
58
  },
59
- "gitHead": "98b8221a9bbaca78d42aba26e7801b5b24958275"
59
+ "gitHead": "680b6d541e78acf43fc5b6703d7aad37e9881684"
60
60
  }