@gr4vy/secure-fields 1.17.0 → 1.19.0

package/CHANGELOG.md

@@ -1,3 +1,44 @@
+# v1.19.0 (Wed Feb 07 2024)
+
+#### 🚀 Enhancement
+
+- task: Click to Pay internal docs [#573](https://github.com/gr4vy/secure-fields/pull/573) ([@luca-gr4vy](https://github.com/luca-gr4vy))
+- task: click to pay cleanup [#585](https://github.com/gr4vy/secure-fields/pull/585) ([@luca-gr4vy](https://github.com/luca-gr4vy))
+- task: consent checkbox [#575](https://github.com/gr4vy/secure-fields/pull/575) ([@luca-gr4vy](https://github.com/luca-gr4vy))
+
+#### 🐛 Bug Fix
+
+- fix: sign-in displays on cancel [#586](https://github.com/gr4vy/secure-fields/pull/586) ([@luca-gr4vy](https://github.com/luca-gr4vy))
+- fix: field listeners removed on re init TA-6291 [#576](https://github.com/gr4vy/secure-fields/pull/576) ([@luca-gr4vy](https://github.com/luca-gr4vy))
+
+#### 🏠 Internal
+
+- chore(dev-deps): update dependency css-loader to ^6.10.0 [#581](https://github.com/gr4vy/secure-fields/pull/581) ([@renovate[bot]](https://github.com/renovate[bot]))
+- chore(dev-deps): update dependency dotenv to ^16.4.1 [#582](https://github.com/gr4vy/secure-fields/pull/582) ([@renovate[bot]](https://github.com/renovate[bot]))
+
+#### Authors: 2
+
+- [@renovate[bot]](https://github.com/renovate[bot])
+- Luca Allievi ([@luca-gr4vy](https://github.com/luca-gr4vy))
+
+---
+
+# v1.18.0 (Tue Jan 30 2024)
+
+#### 🚀 Enhancement
+
+- task: add click to pay react component [#558](https://github.com/gr4vy/secure-fields/pull/558) ([@luca-gr4vy](https://github.com/luca-gr4vy))
+
+#### 🐛 Bug Fix
+
+- fix: duplicate events [#566](https://github.com/gr4vy/secure-fields/pull/566) ([@luca-gr4vy](https://github.com/luca-gr4vy))
+
+#### Authors: 1
+
+- Luca Allievi ([@luca-gr4vy](https://github.com/luca-gr4vy))
+
+---
+
 # v1.17.0 (Wed Jan 24 2024)
 
 #### 🚀 Enhancement

package/README.md

@@ -208,16 +208,120 @@ Some of these provide additional useful data like the card BIN, validation statu
 | `focus` | Triggered when the field gains focus.            | `cardNumberField.addEventListener('focus', (data) => { console.log(data) /* { type: 'number' } */ })`                                                                             |
 | `input` | Triggered when the field value has been changed. | `cardNumberField.addEventListener('input', (data) => { console.log(data) /* { type: 'number', schema: 'visa', codeLabel: 'CVV', valid: true, empty: true, autofilled: false } */` |
 
-### API reference
+## Click to Pay
 
-#### Getters
+Click to Pay is the better way to pay online – featuring advanced payment technology built on secure remote commerce industry standards.
+
+### Prerequisites
+
+Follow the instructions for [Click to Pay Merchant Setup](https://docs.gr4vy.com/guides/payments/secure-fields/click-to-pay#merchant-setup).
+
+### Adding Click to Pay
+
+Once Secure Fields is configured, you can start adding Click to Pay to your checkout.
+
+Firstly, add a placeholder component to your form so Secure Fields knows where to render the Click to Pay component.
+
+Then, add a simple sign-in form to let users access their Click to Pay stored cards.
+
+Additionally, add a checkbox to allow a customer not already enrolled to determine if they want to share the card data with Click to Pay or not.
+
+Finally, ensure card inputs are wrapped with a container element (e.g. `<form />`) with a specific id.
+
+```html
+<div id="click-to-pay"></div>
+
+<div id="click-to-pay-sign-in" style="display: none;">
+  <label>Access your Click to Pay stored cards</label>
+  <input type="text" id="phoneOrEmail" />
+  <button id="signInButton">Continue</button>
+</div>
+
+<form id="card-form" style="display: none;">
+  <label htmlFor="cc-number">Card number</label>
+  <input type="text" id="cc-number" />
+
+  <label htmlFor="cc-expiry-date">Expiry date</label>
+  <input type="text" id="cc-expiry-date" />
+
+  <label htmlFor="cc-security-code">Security code</label>
+  <input type="text" id="cc-security-code" />
+</form>
+
+<input type="checkbox" id="click-to-pay-consent-checkbox" />
+<label for="click-to-pay-consent-checkbox"
+  >Store my card with Click to Pay</label
+>
+
+<script>
+  var phoneOrEmail = document.querySelector('#phoneOrEmail')
+  var signInButton = document.querySelector('#signInButton')
+  signInButton.addEventListener('click', function () {
+    clickToPay.signIn({ email: phoneOrEmail.value })
+  })
+</script>
+```
+
+Next, attach the secure field for Click to Pay to this element. This will require the email and/or phone number of the user you want to create a transaction for. It also requires an HTML query for the consent checkbox that controls if the card data for a new card is shared with Click to Pay or not.
+
+```js
+const clickToPay = secureFields.addClickToPay('#click-to-pay', {
+  dpaLocale: 'en_AU',
+  cardBrands: ['mastercard', 'visa', 'american-express'],
+  email: 'john@example.com',
+  mobileNumber: {
+    countryCode: '61',
+    phoneNumber: '491570159',
+  },
+  consentCheckbox: '#click-to-pay-consent-checkbox',
+  signIn: '#click-to-pay-sign-in',
+  cardForm: '#card-form',
+})
+// clickToPay = { element: <div id="click-to-pay" />, signIn: ..., options: { dpaName: ... } }
+```
+
+The available Click to Pay options are the following:
+
+| Option Name       | Description                                                                                                                   |
+| ----------------- | ----------------------------------------------------------------------------------------------------------------------------- |
+| `srcDpaId`        | DPA Identifier. This is a unique identifier for you Digital Payment Application (DPA), which was generated during onboarding. |
+| `dpaName`         | Legal name of registered DPA.                                                                                                 |
+| `cardBrands`      | List of card schemes the merchant accepts. We currently support `mastercard`, `maestro`, `visa`, `amex`, `discover`           |
+| `cardForm`        | A reference to the card form wrapper.                                                                                         |
+| `signIn`          | A reference to the sign-in elements wrapper.                                                                                  |
+| `consentCheckbox` | A reference to the opt-in consent checkbox element.                                                                           |
+| `learnMoreLink`   | A reference to the learn more link element.                                                                                   |
+| `email`           | The user email used to access Click to Pay.                                                                                   |
+| `mobileNumber`    | The user phone number used to access Click to Pay. Required format is `{ countryCode: string, phoneNumber: string }`          |
+
+### Additional Global events
+
+The following Click to Pay events can be listened to by attaching an event handler to the `SecureFields` instance using the `addEventListener` method.
+
+| Name                                       | Description                                                                                     | Example                                                                                                                                                                                                                                                                         |
+| ------------------------------------------ | ----------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `CLICK_TO_PAY_INITIALIZED`                 | Triggered when Click to Pay has been initialized.                                               | `secureFields.addEventListener(SecureFields.Events.CLICK_TO_PAY_INITIALIZED, (clickToPay) => { console.log('Click to Pay initialized', clickToPay) })`                                                                                                                          |
+| `CLICK_TO_PAY_READY`                       | Triggered when Click to Pay is ready.                                                           | `secureFields.addEventListener(SecureFields.Events.CLICK_TO_PAY_READY, ({ buyerExists }) => { console.log('Click to Pay ready', { buyerExists }) })`                                                                                                                            |
+| `CLICK_TO_PAY_SIGN_OUT`                    | Triggered when a user signs out of Click to Pay.                                                | `secureFields.addEventListener(SecureFields.Events.CLICK_TO_PAY_SIGN_OUT, ({ buyerExists }) => { console.log('User signed out') })`                                                                                                                                             |
+| `CLICK_TO_PAY_ERROR`                       | Triggered when Click to Pay throws an error.                                                    | `secureFields.addEventListener(SecureFields.Events.CLICK_TO_PAY_ERROR, (error) => { console.log('Click to Pay error', error) }) // "RETRIES_EXCEEDED" \| "CODE_INVALID" \| "INVALID_CARD" \| "SIGN_OUT_FAILED" \| "ACCT_INACCESSIBLE" \| "UNKNOWN" \| "USER_NOT_RECOGNIZED" \|` |
+| `CLICK_TO_PAY_CANCEL`                      | Triggered when a user closes / cancels Click to Pay.                                            | `secureFields.addEventListener(SecureFields.Events.CLICK_TO_PAY_CANCEL, () => { console.log('User cancelled Click to Pay') })`                                                                                                                                                  |
+| `CLICK_TO_PAY_CHECKOUT_WITH_NEW_CARD`      | Triggered when a user performs the checkout with a new card (not yet enrolled in Click to Pay). | `secureFields.addEventListener(SecureFields.Events.CLICK_TO_PAY_CHECKOUT_WITH_NEW_CARD, () => { console.log('User is using a new card') })`                                                                                                                                     |
+| `CLICK_TO_PAY_UNABLE_TO_LOAD_DPA`          | Triggered when the provided Click to Pay DPA cannot be loaded.                                  | `secureFields.addEventListener(SecureFields.Events.CLICK_TO_PAY_UNABLE_TO_LOAD_DPA, () => { console.log('Unable to load Click to Pay DPA') })`                                                                                                                                  |
+| `CLICK_TO_PAY_VISIBILITY_CHANGE`           | Triggered when the Click to Pay element is shown or hidden.                                     | `secureFields.addEventListener(SecureFields.Events.CLICK_TO_PAY_VISIBILITY_CHANGE, (visible) => { console.log('Click to Pay element is ' + visible ? "visible" : "not visible") })`                                                                                             |
+| `CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE` | Triggered when the card form container is shown or hidden.                                      | `secureFields.addEventListener(SecureFields.Events.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE, (visible) => { console.log('Card form is ' + visible ? "visible" : "not visible") })`                                                                                              |
+| `CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE`   | Triggered when the sign in container is shown or hidden.                                        | `secureFields.addEventListener(SecureFields.Events.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE, (visible) => { console.log('Sign in is ' + visible ? "visible" : "not visible") })`                                                                                                  |
+| `METHOD_CHANGE`                            | Triggered when the user selects a different method (either `card` or `click-to-pay`)            | `secureFields.addEventListener(SecureFields.Events.METHOD_CHANGE, (method) => { console.log('Selected method changed', method) })`                                                                                                                                              |
+
+## API reference
+
+### Getters
 
 | Name      | Description                                                                     |
 | --------- | ------------------------------------------------------------------------------- |
 | `Events`  | Gives access to the supported events. <br /><br />`SecureFields.Events.READY`   |
 | `version` | Returns the current version of the instance. <br /><br />`SecureFields.version` |
 
-#### Methods
+### Methods
 
 | Name                   | Description                                                                                                                                                                                                                                                                                                                                    |
 | ---------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
@@ -225,6 +329,7 @@ Some of these provide additional useful data like the card BIN, validation statu
 | `addCardNumberField`   | Injects a secure field of type `number`. <br /><br />`secureFields.addCardNumberField('#cc-number', { placeholder: 'Enter card number', ... })`                                                                                                                                                                                                |
 | `addSecurityCodeField` | Injects a secure field of type `securityCode`. <br /><br />`secureFields.addSecurityCodeField('#cc-security-code', { placeholder: 'Enter security code', ... })`                                                                                                                                                                               |
 | `addExpiryDateField`   | Injects a secure field of type `expiryDate`. <br /><br />`secureFields.addExpiryDateField('#cc-expiry-date', { placeholder: 'Enter expiry date', ... })`                                                                                                                                                                                       |
+| `addClickToPay`        | Injects a field that initializes Click to Pay. <br /><br />`secureFields.addClickToPay('#click-to-pay', { dpaLocale: 'en_AU', cardBrands: ['mastercard', 'visa'], ... })`                                                                                                                                                                      |
 | `addEventListener`     | Attaches an event handler to the SecureFields instance or to a secure field in order to listen to specific events. Requires one of the events supported and a callback. <br /><br />`secureFields.addEventListener(SecureFields.Events.READY, (data) => { ... })` <br /><br />`cardNumberField.addEventListener('input', (data) => { ... })`   |
 | `removeEventListener`  | Removes a previously attached event handler.                                                                                                                                                                                                                                                                                                   |
 | `submit`               | Calls the Vault API to tokenize and store the card data. <br /><br />`secureFields.submit()`                                                                                                                                                                                                                                                   |

package/lib/click-to-pay.d.ts

@@ -0,0 +1,22 @@
+import { ClickToPayInstance, ClickToPayOptions } from "./types";
+import { SecureFields } from './index';
+declare class ClickToPay {
+    private secureFields;
+    private _buyerExists;
+    consent: boolean;
+    controller: HTMLIFrameElement;
+    encrypt: HTMLIFrameElement;
+    origin?: string;
+    url?: string;
+    cardForm: HTMLElement;
+    signIn: HTMLElement;
+    clickToPay: ClickToPayInstance;
+    constructor(secureFields: SecureFields);
+    private _addIframe;
+    private _attachListeners;
+    private _fetchDPA;
+    private _initConsentCheckbox;
+    private _initLearnMore;
+    init(element: string | HTMLElement, options?: ClickToPayOptions): Promise<ClickToPayInstance>;
+}
+export { ClickToPay };

package/lib/index.d.ts

@@ -18,12 +18,9 @@ declare class SecureFields {
     securityCode: SecureInput;
     expiryDate: SecureInput;
     method: 'card' | 'click-to-pay';
+    private clickToPayInstance?;
     clickToPay?: ClickToPayInstance;
-    clickToPayController?: HTMLIFrameElement;
-    clickToPayUrl?: string;
-    clickToPayOrigin?: string;
     environmentPath: string;
-    clickToPayConsent: boolean;
     /**
      * CARD_VAULT_SUCCESS: Triggered when the card is successfully vaulted.
      *
@@ -36,6 +33,10 @@ declare class SecureFields {
     static get Events(): typeof Events;
     static get version(): string;
     constructor(config: Config);
+    update(property: string, value: unknown): void;
+    updateMethod(value: string, { data }: {
+        data: any;
+    }): void;
     private _addField;
     addCardNumberField(element: string | HTMLElement, options?: Omit<Field, 'element' | 'type'>): SecureInput;
     addSecurityCodeField(element: string | HTMLElement, options?: Omit<Field, 'element' | 'type'>): SecureInput;
@@ -48,4 +49,4 @@ declare class SecureFields {
     addFont(font: string): void;
 }
 export { SecureFields, SecureInput };
-export type { Config, CombinedEvents, Field, FieldType, FieldEvent, Styles, StylesTuple, FormChangeEventData, } from './types';
+export type { ClickToPayInstance, ClickToPayOptions, Config, CombinedEvents, Field, FieldType, FieldEvent, Styles, StylesTuple, FormChangeEventData, } from './types';

package/lib/index.js

@@ -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,(function(){return function(){"use strict";var e={d:function(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:function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r:function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};function r(e,t,r,n,o,i,a){try{var c=e[i](a),s=c.value}catch(e){return void r(e)}c.done?t(s):Promise.resolve(s).then(n,o)}e.r(t),e.d(t,{SecureFields:function(){return Y},SecureInput:function(){return E}});class n extends Error{constructor(e){super(e),this.name="UnableToLoadDpaError"}}function o(){var e;return e=function*(e){var t=e.apiBaseUrl,r=e.checkoutSessionId;try{var o="".concat(t,"/digital-wallets/click-to-pay/session"),i=yield fetch(o,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({checkout_session_id:r})});if(i.ok){var a=yield i.json();return{srcDpaId:a.digital_payment_application_id,dpaName:a.digital_payment_application_name}}throw new n("Unable to load DPA")}catch(e){throw new n("Unable to load DPA")}},o=function(){var t=this,n=arguments;return new Promise((function(o,i){var a=e.apply(t,n);function c(e){r(a,o,i,c,s,"next",e)}function s(e){r(a,o,i,c,s,"throw",e)}c(void 0)}))},o.apply(this,arguments)}var i,a,c,s,l="@gr4vy-secure-fields-debug";!function(e){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"}(i||(i={})),function(e){e.REQUEST_PORT="request-port",e.TRANSFER_PORT="transfer-port"}(a||(a={})),function(e){e.FOCUSED="data-secure-fields-focused",e.INVALID="data-secure-fields-invalid",e.AUTOFILLED="data-secure-fields-autofilled"}(c||(c={})),function(e){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"}(s||(s={}));var d="secure-fields";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 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,o,i=[],a=!0,c=!1;try{for(r=r.call(e);!(a=(n=r.next()).done)&&(i.push(n.value),!t||i.length!==t);a=!0);}catch(e){c=!0,o=e}finally{try{a||null==r.return||r.return()}finally{if(c)throw o}}return i}}(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 h=new class{subscribe(e,t){this.subscribers.push([e,t])}unsubscribe(e,t){this.subscribers=this.subscribers.filter((r=>{var n=p(r,2),o=n[0],i=n[1];return o!==e||i.toString()!==t.toString()}))}publish(e,t){this.subscribers.forEach((r=>{var n=p(r,2),o=n[0],i=n[1];return setTimeout((()=>o===e?i(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=[]}},y=["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"],f=(e,t)=>e&&(e.style.display=t?"block":"none");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 b(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}var _={debug:!1,level:"log"},v=(e,t,r)=>{var n=b({},_,r),o=n.debug,i=n.level;(o||"true"===localStorage.getItem(l))&&console[i]("Gr4vy - Secure Fields - ".concat(e),t||{})},g=(e,t,r)=>{var n,o;v(e,t,(n=b({},r),o=null!=(o={level:"warn"})?o:{},Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(o)):function(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r.push.apply(r,n)}return r}(Object(o)).forEach((function(e){Object.defineProperty(n,e,Object.getOwnPropertyDescriptor(o,e))})),n))},I=e=>(e!=e.toLowerCase()&&(e=e.replace(/[A-Z]/g,(e=>"-"+e.toLowerCase()))),e);function O(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 C=function(){var e=function(t){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"";return Object.entries(t).reduce(((n,o)=>{var i,a,c=(a=2,function(e){if(Array.isArray(e))return e}(i=o)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,i=[],a=!0,c=!1;try{for(r=r.call(e);!(a=(n=r.next()).done)&&(i.push(n.value),!t||i.length!==t);a=!0);}catch(e){c=!0,o=e}finally{try{a||null==r.return||r.return()}finally{if(c)throw o}}return i}}(i,a)||function(e,t){if(e){if("string"==typeof e)return O(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)?O(e,t):void 0}}(i,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.")}()),s=c[0],l=c[1];return(e=>"[object Object]"===Object.prototype.toString.call(e))(l)?n.push(...e(t[s],"".concat((r+s).match(/[a-zA-Z0-9]+/g).join("-"),"-"))):(s=I(s).replace(/^-/,""),n.push(["--".concat(r).concat(s),l])),n}),[])};return e(arguments.length>0&&void 0!==arguments[0]?arguments[0]:{})};function A(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function P(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){A(e,t,r[t])}))}return e}function T(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r.push.apply(r,n)}return r}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}class E{_postMessage(e){this.frame.contentWindow.postMessage(P({channel:d},e),this.frameUrl)}update(e){if(this.frameUrl){this.options=P({},this.options,e);var t=C(P({},this.options.styles,e.styles)),r=T(P({},this.options,e),{styles:t});this._postMessage({type:"update",data:T(P({},r),{styles:t})}),v("Updated field",this.options)}}setPlaceholder(e){this.update({placeholder:e})}setStyles(e){this.update({styles:e})}constructor(e){if(A(this,"frameUrl",void 0),A(this,"parentOrigin",void 0),A(this,"frame",void 0),A(this,"type",void 0),A(this,"options",void 0),A(this,"addEventListener",void 0),A(this,"removeEventListener",void 0),e){var t=e.frameUrl,r=e.parentOrigin,n=e.font,o=e.options.type,i=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}(e.options,["type"]);this.frameUrl=t,this.parentOrigin=r,this.type=o,this.options=i;var a=C(i.styles);this.frame=document.createElement("iframe"),this.frame.id=o,this.frame.src="".concat(t,"/input.html?parentOrigin=").concat(r,"&type=").concat(this.type),this.frame.style.display="block",this.frame.style.height="100%",this.frame.style.border="none",this.frame.style.width="100%",n&&(this.frame.src+="&font=".concat(n)),this.frame.onload=()=>{this._postMessage({type:"update",data:T(P({},this.options),{styles:a})}),v("Added field",this.options)}}}}function L(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=new class{add(e,t){window.addEventListener(e,t),this.listeners.push([e,t])}removeAll(){this.listeners.forEach((e=>{var t,r,n=(r=2,function(e){if(Array.isArray(e))return e}(t=e)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,i=[],a=!0,c=!1;try{for(r=r.call(e);!(a=(n=r.next()).done)&&(i.push(n.value),!t||i.length!==t);a=!0);}catch(e){c=!0,o=e}finally{try{a||null==r.return||r.return()}finally{if(c)throw o}}return i}}(t,r)||function(e,t){if(e){if("string"==typeof e)return L(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)?L(e,t):void 0}}(t,r)||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.")}()),o=n[0],i=n[1];window.removeEventListener(o,i)})),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}};function S(e,t,r,n,o,i,a){try{var c=e[i](a),s=c.value}catch(e){return void r(e)}c.done?t(s):Promise.resolve(s).then(n,o)}function k(e){return function(){var t=this,r=arguments;return new Promise((function(n,o){var i=e.apply(t,r);function a(e){S(i,n,o,a,c,"next",e)}function c(e){S(i,n,o,a,c,"throw",e)}a(void 0)}))}}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 D(){return D=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},D.apply(this,arguments)}function U(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 j(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r.push.apply(r,n)}return r}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}class Y{static get Events(){return i}static get version(){return"#866fb2e4de535d1b8ec7640c797fff5b487d1b8f"}_addField(e,t){if(!(e="string"==typeof e?document.querySelector(e):e)||!t.frame)return t.addEventListener=()=>{},t.removeEventListener=()=>{},t;var r,n,o=document.createElement("div");return r=e,n=o,Array.from(r.attributes).forEach((e=>{var t=e.name,r=e.value;y.some((e=>new RegExp(e).test(t)))&&n.setAttribute(t,r)})),(o=n).classList.add("secure-fields__input","secure-fields__input--".concat(I(t.type))),o.appendChild(t.frame),e.parentNode.replaceChild(o,e),window.addEventListener("message",(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":h.publish("".concat(t.type,":blur"),e.data.data),o.removeAttribute(c.FOCUSED),v("Field blurred",e.data.data);break;case"focus":h.publish("".concat(t.type,":focus"),e.data.data),o.setAttribute(c.FOCUSED,""),v("Field focused",e.data.data);break;case"input":h.publish("".concat(t.type,":input"),e.data.data),e.data.data.valid?o.removeAttribute(c.INVALID):o.setAttribute(c.INVALID,""),e.data.data.autofilled?o.setAttribute(c.AUTOFILLED,""):o.removeAttribute(c.AUTOFILLED),v("Field input changed",e.data.data)}})),t.addEventListener=this.addEventListener,t.removeEventListener=this.removeEventListener,t}addCardNumberField(e,t){return this.config.paymentMethodId&&g(s.PAYMENT_METHOD_ID_IN_USE,{method:"addCardNumberField"}),this.cardNumber||(this.cardNumber=new E({frameUrl:this.frameUrl,parentOrigin:this.parentOrigin,font:this.font,options:j(U({label:"Card number"},t),{type:"number"})})),this._addField(e,this.cardNumber)}addSecurityCodeField(e,t){return this.securityCode||(this.securityCode=new E({frameUrl:this.frameUrl,parentOrigin:this.parentOrigin,font:this.font,options:j(U({label:"Security code"},this.config.paymentMethodId?{lengths:[3,4]}:{},t),{type:"securityCode"})})),this._addField(e,this.securityCode)}addExpiryDateField(e,t){return this.config.paymentMethodId&&g(s.PAYMENT_METHOD_ID_IN_USE,{method:"addExpiryDateField"}),this.expiryDate||(this.expiryDate=new E({frameUrl:this.frameUrl,parentOrigin:this.parentOrigin,font:this.font,options:j(U({label:"Expiry date"},t),{type:"expiryDate"})})),this._addField(e,this.expiryDate)}addClickToPay(e,t){var r=this;return k((function*(){if(!r.config.paymentMethodId){var n="string"==typeof(null==t?void 0:t.cardForm)?document.querySelector(null==t?void 0:t.cardForm):null==t?void 0:t.cardForm,c="string"==typeof(null==t?void 0:t.signIn)?document.querySelector(null==t?void 0:t.signIn):null==t?void 0:t.signIn;if(f(c,!1),r.clickToPay={element:null,options:t,signIn:function(){var e=k((function*(e){var t=e.email,o=e.mobileNumber,a=r.clickToPay,s=a.element,l=a.options;delete l.email,delete l.mobileNumber,s.innerHTML="",f(c,!1),h.publish(i.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!1),f(n,!1),h.publish(i.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE,!1),yield r.addClickToPay(s,U({},l,t?{email:t}:{},o?{mobileNumber:o}:{}))}));return function(t){return e.apply(this,arguments)}}()},!(null==t?void 0:t.srcDpaId)||!(null==t?void 0:t.dpaName))try{var l=r.apiUrl||function(e){return"https://api.".concat("sandbox"===(arguments.length>1&&void 0!==arguments[1]?arguments[1]:"production")?"sandbox.":"").concat(e,".gr4vy.app")}(r.config.gr4vyId,r.config.environment),u=yield function(e){return o.apply(this,arguments)}({apiBaseUrl:l,checkoutSessionId:r.config.sessionId}),p=u.srcDpaId,y=u.dpaName;t.srcDpaId=p,t.dpaName=y}catch(e){return v(e.message),h.publish(i.CLICK_TO_PAY_UNABLE_TO_LOAD_DPA),f(n,!0),h.publish(i.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE,!0),f(r.clickToPay.element,!1),void h.publish(i.CLICK_TO_PAY_VISIBILITY_CHANGE,!1)}r.clickToPayUrl=window.CLICK_TO_PAY_FRAME_URL||"https://click-to-pay.".concat(r.environmentPath).concat(r.config.gr4vyId,".gr4vy.app"),r.parentOrigin=window.location.origin,r.clickToPayOrigin=new URL(r.clickToPayUrl).origin;var m=D({},function(e){if(null==e)throw new TypeError("Cannot destructure "+e);return e}(t)),b=U({gr4vyId:r.config.gr4vyId,environment:r.config.environment,sessionId:r.config.sessionId},m),_=document.createElement("iframe");_.id="click-to-pay-controller",_.setAttribute("width","100%"),_.setAttribute("frameborder","0"),_.setAttribute("style","height:0px"),_.src="".concat(r.clickToPayUrl,"/click-to-pay.html?parentOrigin=").concat(r.parentOrigin,"&environment=").concat(r.config.environment,"&config=").concat(encodeURIComponent(JSON.stringify(b)));var I=document.createElement("iframe");I.setAttribute("width","0"),I.setAttribute("frameborder","0"),I.setAttribute("style","height:0px"),I.src="".concat(r.frameUrl,"/click-to-pay-encrypt.html?parentOrigin=").concat(r.parentOrigin,"&environment=").concat(r.config.environment,"&config=").concat(encodeURIComponent(JSON.stringify(b)));var O=new MessageChannel,C=!0;if(w.removeAll(),w.add("message",(e=>{switch(e.origin){case r.clickToPayOrigin:switch(e.data.type){case i.RESIZE:_.style.height=e.data.data.height>0?"".concat(e.data.data.height+48,"px"):"0px";break;case i.METHOD_CHANGE:var t=e.data.data.method||"card";(r.method!==t||C)&&(C=!1,r.method=t,h.publish(i.METHOD_CHANGE,e.data.data),v("Method changed",{method:r.method}),r.controller.contentWindow.postMessage({type:"method-change",channel:d},r.frameUrl),f(n,"card"===r.method),h.publish(i.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE,"card"===r.method));break;case i.CLICK_TO_PAY_INITIALIZED:h.publish(i.CLICK_TO_PAY_INITIALIZED,r.clickToPay),v("Click to Pay initialized",r.clickToPay),f(c,!1),h.publish(i.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!1),f(r.clickToPay.element,!0),h.publish(i.CLICK_TO_PAY_VISIBILITY_CHANGE,!0);break;case i.CLICK_TO_PAY_READY:h.publish(i.CLICK_TO_PAY_READY,e.data.data),v("Click to Pay ready"),f(c,!e.data.data.buyerExists),h.publish(i.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!e.data.data.buyerExists),f(r.clickToPay.element,!0),h.publish(i.CLICK_TO_PAY_VISIBILITY_CHANGE,!0);break;case i.CLICK_TO_PAY_SIGN_OUT:h.publish(i.CLICK_TO_PAY_SIGN_OUT),v("Click to pay signed out"),f(c,!0),h.publish(i.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!0);break;case i.CLICK_TO_PAY_ERROR:h.publish(i.CLICK_TO_PAY_ERROR,e.data.data),v("Click to Pay error:",e.data.data),f(c,!["UNKNOWN","INVALID_CARD","CODE_INVALID"].includes(e.data.data.error)),h.publish(i.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!["UNKNOWN","INVALID_CARD","CODE_INVALID"].includes(e.data.data.error)),f(r.clickToPay.element,"UNKNOWN"!==e.data.data.error),h.publish(i.CLICK_TO_PAY_VISIBILITY_CHANGE,"UNKNOWN"!==e.data.data.error);break;case i.CLICK_TO_PAY_CANCEL:h.publish(i.CLICK_TO_PAY_CANCEL,e.data.data),v("Click to Pay cancelled"),f(c,!0),h.publish(i.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!0);break;case i.CLICK_TO_PAY_CHECKOUT_WITH_NEW_CARD:h.publish(i.CLICK_TO_PAY_CHECKOUT_WITH_NEW_CARD,e.data.data),f(c,!1),h.publish(i.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!1),v("Click to Pay checkout with new card initiated");break;case a.REQUEST_PORT:_.contentWindow.postMessage({channel:d,type:a.TRANSFER_PORT},r.clickToPayOrigin,[O.port1])}break;case r.frameUrl:e.data.type===a.REQUEST_PORT&&I.contentWindow.postMessage({channel:d,type:a.TRANSFER_PORT},r.frameUrl,[O.port2])}})),null==t?void 0:t.consentCheckbox){var A="string"==typeof(null==t?void 0:t.consentCheckbox)?document.querySelector(null==t?void 0:t.consentCheckbox):null==t?void 0:t.consentCheckbox;r.method=A.checked?"click-to-pay":"card",v("Method changed",{method:r.method}),A.addEventListener("change",(e=>{var t=e.target;r.clickToPayConsent=t.checked})),w.add("message",(e=>{e.data.type===i.CLICK_TO_PAY_ERROR&&"UNKNOWN"===e.data.data.error&&(r.clickToPayConsent=!1,A.checked=!1)}))}if(null==t?void 0:t.learnMoreLink){var P="string"==typeof(null==t?void 0:t.learnMoreLink)?document.querySelector(null==t?void 0:t.learnMoreLink):null==t?void 0:t.learnMoreLink;P.style.visibility="hidden",w.add("message",(e=>{e.data.type===i.CLICK_TO_PAY_INITIALIZED&&(P.style.visibility="visible",P.addEventListener("click",(()=>{_.contentWindow.postMessage({type:"show-learn-more",channel:d},r.clickToPayOrigin)})))}))}return(e="string"==typeof e?document.querySelector(e):e).appendChild(_),e.appendChild(I),r.clickToPay.element=e,r.clickToPayController=_,r.clickToPay}g(s.PAYMENT_METHOD_ID_IN_USE,{method:"addClickToPay"})}))()}addEventListener(e,t){var r=this.type,n="".concat(this.constructor===E?"".concat(r,":"):"").concat(e);h.subscribe(n,t)}removeEventListener(e,t){var r=this.type,n="".concat(this.constructor===E?"".concat(r,":"):"").concat(e);h.unsubscribe(n,t)}submit(){var e=t=>{var r=[this.frameUrl,this.clickToPayOrigin].includes(t.origin),n=t.data.channel===d,o=["success","error"].includes(t.data.type);if(r&&n&&o){switch(t.data.type){case"success":h.publish(i.CARD_VAULT_SUCCESS),v("Payment method tokenized successfully");break;case"error":h.publish(i.CARD_VAULT_FAILURE,t.data),v("Failed to update checkout session",t.data.data)}window.removeEventListener("message",e)}};window.addEventListener("message",e),"click-to-pay"===this.method||"card"===this.method&&this.clickToPayController&&!0===this.clickToPayConsent?this.clickToPayController.contentWindow.postMessage({type:"submit",channel:d},this.clickToPayUrl):this.controller.contentWindow.postMessage({type:"submit",channel:d,data:{method:this.config.paymentMethodId?"id":"card"}},this.frameUrl)}setDebug(e){localStorage.setItem(l,String(e))}addFont(e){this.font=e.replace(/\s/g,"+")}constructor(e){N(this,"config",void 0),N(this,"controller",void 0),N(this,"frameUrl",void 0),N(this,"apiUrl",void 0),N(this,"parentOrigin",void 0),N(this,"font",void 0),N(this,"cardNumber",void 0),N(this,"securityCode",void 0),N(this,"expiryDate",void 0),N(this,"method","card"),N(this,"clickToPay",void 0),N(this,"clickToPayController",void 0),N(this,"clickToPayUrl",void 0),N(this,"clickToPayOrigin",void 0),N(this,"environmentPath",void 0),N(this,"clickToPayConsent",!1),this.config=U({environment:"production"},e),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;var t=U({parentOrigin:this.parentOrigin,sessionId:this.config.sessionId,gr4vyId:this.config.gr4vyId,environment:this.config.environment},this.config.paymentMethodId?{paymentMethodId:this.config.paymentMethodId}:{});this.controller=document.createElement("iframe"),this.controller.id="controller",this.controller.src=((e,t)=>"".concat(e,"?").concat(new URLSearchParams(t).toString()))("".concat(this.frameUrl,"/controller.html"),t),this.controller.style.position="absolute",this.controller.style.left="-9999999px",document.body.appendChild(this.controller),this.config.paymentMethodId&&(this.cardNumber=new E,this.expiryDate=new E),v("Initialized",j(U({},this.config),{version:Y.version,frameUrl:this.frameUrl,parentOrigin:this.parentOrigin})),window.addEventListener("message",(e=>{if(e.origin===this.frameUrl)switch(e.data.type){case"ready":var t=U({version:Y.version},this.config);h.publish(i.READY,t),v("Ready",t);break;case"form-change":h.publish(i.FORM_CHANGE,e.data.data),v("Form change",e.data.data)}}))}}return t}()}));
+!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={};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)}e.r(t),e.d(t,{SecureFields:()=>H,SecureInput:()=>R});class n extends Error{constructor(e){super(e),this.name="UnableToLoadDpaError"}}function i(){var e;return e=function*(e){var t=e.apiBaseUrl,r=e.checkoutSessionId;try{var i="".concat(t,"/digital-wallets/click-to-pay/session"),o=yield fetch(i,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({checkout_session_id:r})});if(o.ok){var a=yield o.json();return{srcDpaId:a.digital_payment_application_id,dpaName:a.digital_payment_application_name}}throw new n("Unable to load DPA")}catch(e){throw new n("Unable to load DPA")}},i=function(){var t=this,n=arguments;return new Promise((function(i,o){var a=e.apply(t,n);function s(e){r(a,i,o,s,c,"next",e)}function c(e){r(a,i,o,s,c,"throw",e)}s(void 0)}))},i.apply(this,arguments)}var o,a,s,c,l="@gr4vy-secure-fields-debug";!function(e){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"}(o||(o={})),function(e){e.REQUEST_PORT="request-port",e.TRANSFER_PORT="transfer-port"}(a||(a={})),function(e){e.FOCUSED="data-secure-fields-focused",e.INVALID="data-secure-fields-invalid",e.AUTOFILLED="data-secure-fields-autofilled"}(s||(s={})),function(e){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"}(c||(c={}));var d="secure-fields";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()}))}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){window.addEventListener(e,t),this.listeners.push([e,t])}remove(e,t){var r=this.listeners.findIndex((r=>{var n=f(r,2),i=n[0],o=n[1];return i===e&&o.toString()===t.toString()}));if(-1!==r){var n=f(this.listeners.splice(r,1),1),i=f(n[0],2),o=i[0],a=i[1];window.removeEventListener(o,a)}}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=["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"],v=(e,t)=>e&&(e.style.display=t?"block":"none");function _(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function I(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){_(e,t,r[t])}))}return e}var g={debug:!1,level:"log"},O=(e,t,r)=>{var n=I({},g,r),i=n.debug,o=n.level;(i||"true"===localStorage.getItem(l))&&console[o]("Gr4vy - Secure Fields - ".concat(e),t||{})},C=(e,t,r)=>{var n,i;O(e,t,(n=I({},r),i=null!=(i={level:"warn"})?i:{},Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(i)):function(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r.push.apply(r,n)}return r}(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 E=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]:{})},T=(e,t)=>"".concat(e,"?").concat(new URLSearchParams(t).toString());function w(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 L(e){return function(){var t=this,r=arguments;return new Promise((function(n,i){var o=e.apply(t,r);function a(e){w(o,n,i,a,s,"next",e)}function s(e){w(o,n,i,a,s,"throw",e)}a(void 0)}))}}function S(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(){return k=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},k.apply(this,arguments)}function N(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){S(e,t,r[t])}))}return e}class D{_addIframe(e,t,r){var n=document.createElement("iframe");return n.id=e,n.setAttribute("width","100%"),n.setAttribute("frameborder","0"),n.setAttribute("style","height:0px"),n.src=T(t,r),n}_attachListeners(){var e=new MessageChannel,t=!0,r=r=>{var n=r.origin,i=r.data,s=i.type,c=i.data;switch(n){case this.origin:switch(s){case o.RESIZE:this.controller.style.height="".concat(c.height>0?c.height+48:0,"px");break;case o.METHOD_CHANGE:var l=c.method||"card";(this.secureFields.method!==l||t)&&(t=!1,this.secureFields.updateMethod(l,{data:c}),v(this.cardForm,"card"===l),p.publish(o.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE,"card"===l));break;case o.CLICK_TO_PAY_INITIALIZED:p.publish(o.CLICK_TO_PAY_INITIALIZED,this.clickToPay),O("Click to Pay initialized",this.clickToPay),v(this.signIn,!1),p.publish(o.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!1),v(this.clickToPay.element,!0),p.publish(o.CLICK_TO_PAY_VISIBILITY_CHANGE,!0);break;case o.CLICK_TO_PAY_READY:this._buyerExists=c.buyerExists,p.publish(o.CLICK_TO_PAY_READY,c),O("Click to Pay ready"),v(this.signIn,!c.buyerExists),p.publish(o.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!c.buyerExists),v(this.clickToPay.element,!0),p.publish(o.CLICK_TO_PAY_VISIBILITY_CHANGE,!0);break;case o.CLICK_TO_PAY_SIGN_OUT:this._buyerExists=!1,p.publish(o.CLICK_TO_PAY_SIGN_OUT),O("Click to pay signed out"),v(this.signIn,!0),p.publish(o.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!0);break;case o.CLICK_TO_PAY_ERROR:p.publish(o.CLICK_TO_PAY_ERROR,c),O("Click to Pay error:",c),v(this.signIn,!["UNKNOWN","INVALID_CARD","CODE_INVALID"].includes(c.error)),p.publish(o.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!["UNKNOWN","INVALID_CARD","CODE_INVALID"].includes(c.error)),v(this.clickToPay.element,"UNKNOWN"!==c.error),p.publish(o.CLICK_TO_PAY_VISIBILITY_CHANGE,"UNKNOWN"!==c.error);break;case o.CLICK_TO_PAY_CANCEL:p.publish(o.CLICK_TO_PAY_CANCEL,c),O("Click to Pay cancelled"),this._buyerExists||(v(this.signIn,!0),p.publish(o.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!0));break;case o.CLICK_TO_PAY_CHECKOUT_WITH_NEW_CARD:p.publish(o.CLICK_TO_PAY_CHECKOUT_WITH_NEW_CARD,c),v(this.signIn,!1),p.publish(o.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!1),O("Click to Pay checkout with new card initiated");break;case a.REQUEST_PORT:this.controller.contentWindow.postMessage({channel:d,type:a.TRANSFER_PORT},this.origin,[e.port1])}break;case this.secureFields.frameUrl:s===a.REQUEST_PORT&&this.encrypt.contentWindow.postMessage({channel:d,type:a.TRANSFER_PORT},this.secureFields.frameUrl,[e.port2])}};m.remove("message",r),m.add("message",r)}_fetchDPA(e,t){var r=t.gr4vyId,n=t.environment,a=t.sessionId,s=this;return L((function*(){try{var t=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 i.apply(this,arguments)}({apiBaseUrl:t,checkoutSessionId:a})}catch(e){return O(e.message),p.publish(o.CLICK_TO_PAY_UNABLE_TO_LOAD_DPA),v(s.cardForm,!0),p.publish(o.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE,!0),v(s.clickToPay.element,!1),void p.publish(o.CLICK_TO_PAY_VISIBILITY_CHANGE,!1)}}))()}_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 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}}))}_initLearnMore(e){e.style.visibility="hidden",m.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:d},this.origin)})))}))}init(e,t){var r=this;return L((function*(){r.cardForm="string"==typeof(null==t?void 0:t.cardForm)?document.querySelector(null==t?void 0:t.cardForm):null==t?void 0:t.cardForm,r.signIn="string"==typeof(null==t?void 0:t.signIn)?document.querySelector(null==t?void 0:t.signIn):null==t?void 0:t.signIn,v(r.signIn,!1);var n,i=r.secureFields,a=i.apiUrl,s=i.config,c=s.gr4vyId,l=s.environment,d=s.sessionId,u=i.environmentPath;if(r.clickToPay={element:null,options:t,signIn:(n=L((function*(e){var t=e.email,n=e.mobileNumber,i=r.clickToPay,a=i.element,s=i.options;delete s.email,delete s.mobileNumber,a.innerHTML="",v(r.signIn,!1),p.publish(o.CLICK_TO_PAY_SIGN_IN_VISIBILITY_CHANGE,!1),v(r.cardForm,!1),p.publish(o.CLICK_TO_PAY_CARD_FORM_VISIBILITY_CHANGE,!1),r.secureFields.update("clickToPay",yield r.init(a,N({},s,t?{email:t}:{},n?{mobileNumber:n}:{})))})),function(e){return n.apply(this,arguments)})},!(null==t?void 0:t.srcDpaId)||!(null==t?void 0:t.dpaName)){var h=yield r._fetchDPA(a,{gr4vyId:c,environment:l,sessionId:d});if(!(null==h?void 0:h.srcDpaId)&&!(null==h?void 0:h.dpaName))return;t.srcDpaId=h.srcDpaId,t.dpaName=h.dpaName}r.url=window.CLICK_TO_PAY_FRAME_URL||"https://click-to-pay.".concat(u).concat(c,".gr4vy.app"),r.origin=new URL(r.url).origin;var y=window.location.origin,f=N({gr4vyId:c,environment:l,sessionId:d},k({},function(e){if(null==e)throw new TypeError("Cannot destructure "+e);return e}(t)));if(r.controller=r._addIframe("click-to-pay-controller","".concat(r.url,"/click-to-pay.html"),{parentOrigin:y,environment:l,config:encodeURIComponent(JSON.stringify(f))}),r.encrypt=r._addIframe("click-to-pay-encrypt","".concat(r.secureFields.frameUrl,"/click-to-pay-encrypt.html"),{parentOrigin:y,environment:l,config:encodeURIComponent(JSON.stringify(f))}),r._attachListeners(),null==t?void 0:t.consentCheckbox){var m="string"==typeof(null==t?void 0:t.consentCheckbox)?document.querySelector(null==t?void 0:t.consentCheckbox):null==t?void 0:t.consentCheckbox;m&&r._initConsentCheckbox(m)}if(null==t?void 0:t.learnMoreLink){var b="string"==typeof(null==t?void 0:t.learnMoreLink)?document.querySelector(null==t?void 0:t.learnMoreLink):null==t?void 0:t.learnMoreLink;b&&r._initLearnMore(b)}return(e="string"==typeof e?document.querySelector(e):e).appendChild(r.controller),e.appendChild(r.encrypt),r.clickToPay.element=e,r.clickToPay}))()}constructor(e){S(this,"secureFields",void 0),S(this,"_buyerExists",void 0),S(this,"consent",void 0),S(this,"controller",void 0),S(this,"encrypt",void 0),S(this,"origin",void 0),S(this,"url",void 0),S(this,"cardForm",void 0),S(this,"signIn",void 0),S(this,"clickToPay",void 0),this.secureFields=e,this._buyerExists=!1,this.consent=!1}}function j(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function U(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){j(e,t,r[t])}))}return e}function Y(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r.push.apply(r,n)}return r}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}class R{_postMessage(e){this.frame.contentWindow.postMessage(U({channel:d},e),this.frameUrl)}update(e){if(this.frameUrl){this.options=U({},this.options,e);var t=E(U({},this.options.styles,e.styles)),r=Y(U({},this.options,e),{styles:t});this._postMessage({type:"update",data:Y(U({},r),{styles:t})}),O("Updated field",this.options)}}setPlaceholder(e){this.update({placeholder:e})}setStyles(e){this.update({styles:e})}constructor(e){if(j(this,"frameUrl",void 0),j(this,"parentOrigin",void 0),j(this,"frame",void 0),j(this,"type",void 0),j(this,"options",void 0),j(this,"addEventListener",void 0),j(this,"removeEventListener",void 0),e){var t=e.frameUrl,r=e.parentOrigin,n=e.font,i=e.options.type,o=function(e,t){if(null==e)return{};var r,n,i=function(e,t){if(null==e)return{};var r,n,i={},o=Object.keys(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||(i[r]=e[r]);return i}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(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.options,["type"]);this.frameUrl=t,this.parentOrigin=r,this.type=i,this.options=o;var a=E(o.styles);this.frame=document.createElement("iframe"),this.frame.id=i,this.frame.src="".concat(t,"/input.html?parentOrigin=").concat(r,"&type=").concat(this.type),this.frame.style.display="block",this.frame.style.height="100%",this.frame.style.border="none",this.frame.style.width="100%",n&&(this.frame.src+="&font=".concat(n)),this.frame.onload=()=>{this._postMessage({type:"update",data:Y(U({},this.options),{styles:a})}),O("Added field",this.options)}}}}function M(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,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function x(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){F(e,t,r[t])}))}return e}function K(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r.push.apply(r,n)}return r}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}class H{static get Events(){return o}static get version(){return"#cdf0c7f0387ac429092af04f584b97800db3d92f"}update(e,t){this[e]=t}updateMethod(e,t){var r=t.data;this.update("method",e),p.publish(o.METHOD_CHANGE,r),O("Method changed",{method:e}),this.controller.contentWindow.postMessage({type:"method-change",channel:d},this.frameUrl)}_addField(e,t){var r;if(!(e="string"==typeof e?document.querySelector(e):e)||!t.frame)return t.addEventListener=()=>{},t.removeEventListener=()=>{},t;var n,i,o=document.createElement("div");return n=e,i=o,Array.from(n.attributes).forEach((e=>{var t=e.name,r=e.value;b.some((e=>new RegExp(e).test(t)))&&i.setAttribute(t,r)})),(o=i).classList.add("secure-fields__input","secure-fields__input--".concat(A(t.type))),o.appendChild(t.frame),null===(r=e.parentNode)||void 0===r||r.replaceChild(o,e),m.add("message",(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),o.removeAttribute(s.FOCUSED),O("Field blurred",e.data.data);break;case"focus":p.publish("".concat(t.type,":focus"),e.data.data),o.setAttribute(s.FOCUSED,""),O("Field focused",e.data.data);break;case"input":p.publish("".concat(t.type,":input"),e.data.data),e.data.data.valid?o.removeAttribute(s.INVALID):o.setAttribute(s.INVALID,""),e.data.data.autofilled?o.setAttribute(s.AUTOFILLED,""):o.removeAttribute(s.AUTOFILLED),O("Field input changed",e.data.data)}})),t.addEventListener=this.addEventListener,t.removeEventListener=this.removeEventListener,t}addCardNumberField(e,t){return this.config.paymentMethodId&&C(c.PAYMENT_METHOD_ID_IN_USE,{method:"addCardNumberField"}),this.cardNumber||(this.cardNumber=new R({frameUrl:this.frameUrl,parentOrigin:this.parentOrigin,font:this.font,options:K(x({label:"Card number"},t),{type:"number"})})),this._addField(e,this.cardNumber)}addSecurityCodeField(e,t){return this.securityCode||(this.securityCode=new R({frameUrl:this.frameUrl,parentOrigin:this.parentOrigin,font:this.font,options:K(x({label:"Security code"},this.config.paymentMethodId?{lengths:[3,4]}:{},t),{type:"securityCode"})})),this._addField(e,this.securityCode)}addExpiryDateField(e,t){return this.config.paymentMethodId&&C(c.PAYMENT_METHOD_ID_IN_USE,{method:"addExpiryDateField"}),this.expiryDate||(this.expiryDate=new R({frameUrl:this.frameUrl,parentOrigin:this.parentOrigin,font:this.font,options:K(x({label:"Expiry date"},t),{type:"expiryDate"})})),this._addField(e,this.expiryDate)}addClickToPay(e,t){var r,n=this;return(r=function*(){if(!n.config.paymentMethodId)return n.clickToPayInstance=yield new D(n),n.clickToPay=yield n.clickToPayInstance.init(e,t),n.clickToPay;C(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){M(o,n,i,a,s,"next",e)}function s(e){M(o,n,i,a,s,"throw",e)}a(void 0)}))})()}addEventListener(e,t){var r=this.type,n="".concat(this.constructor===R?"".concat(r,":"):"").concat(e);p.subscribe(n,t)}removeEventListener(e,t){var r=this.type,n="".concat(this.constructor===R?"".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),i=e.data.channel===d,a=["success","error"].includes(e.data.type);if(n&&i&&a){switch(e.data.type){case"success":p.publish(o.CARD_VAULT_SUCCESS),O("Payment method tokenized successfully");break;case"error":p.publish(o.CARD_VAULT_FAILURE,e.data),O("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:d},this.clickToPayInstance.url):this.controller.contentWindow.postMessage({type:"submit",channel:d,data:{method:this.config.paymentMethodId?"id":"card"}},this.frameUrl)}setDebug(e){localStorage.setItem(l,String(e))}addFont(e){this.font=e.replace(/\s/g,"+")}constructor(e){var t;F(this,"config",void 0),F(this,"controller",void 0),F(this,"frameUrl",void 0),F(this,"apiUrl",void 0),F(this,"parentOrigin",void 0),F(this,"font",void 0),F(this,"cardNumber",void 0),F(this,"securityCode",void 0),F(this,"expiryDate",void 0),F(this,"method","card"),F(this,"clickToPayInstance",void 0),F(this,"clickToPay",void 0),F(this,"environmentPath",void 0),this.config=x({environment:"production"},e),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;var r=x({parentOrigin:this.parentOrigin,sessionId:this.config.sessionId,gr4vyId:this.config.gr4vyId,environment:this.config.environment},this.config.paymentMethodId?{paymentMethodId:this.config.paymentMethodId}:{});null===(t=document.body.querySelector("iframe#controller[src*=secure-fields]"))||void 0===t||t.remove(),this.controller=document.createElement("iframe"),this.controller.id="controller",this.controller.src=T("".concat(this.frameUrl,"/controller.html"),r),this.controller.style.position="absolute",this.controller.style.left="-9999999px",document.body.appendChild(this.controller),this.config.paymentMethodId&&(this.cardNumber=new R,this.expiryDate=new R),O("Initialized",K(x({},this.config),{version:H.version,frameUrl:this.frameUrl,parentOrigin:this.parentOrigin}));var n=e=>{if(e.origin===this.frameUrl)switch(e.data.type){case"ready":var t=x({version:H.version},this.config);p.publish(o.READY,t),O("Ready",t);break;case"form-change":p.publish(o.FORM_CHANGE,e.data.data),O("Form change",e.data.data)}};m.remove("message",n),m.add("message",n)}}return t})()));

package/lib/listeners-manager.d.ts

@@ -2,6 +2,7 @@ type Callback = (message: MessageEvent) => void;
 export declare class ListenersManager {
     listeners: Array<[string, Callback]>;
     add(event: string, callback: Callback): void;
+    remove(event: string, callback: Callback): void;
     removeAll(): void;
 }
 export declare const global: ListenersManager;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gr4vy/secure-fields",
-  "version": "1.17.0",
+  "version": "1.19.0",
   "description": "Gr4vy-hosted secure fields offering advanced theming, PCI compliance, event handling, and more.",
   "main": "lib/index",
   "types": "lib/index",
@@ -42,9 +42,9 @@
     "watch": "webpack watch --config webpack.prod.js"
   },
   "devDependencies": {
-    "css-loader": "^6.9.1",
+    "css-loader": "^6.10.0",
     "csstype": "^3.1.3",
-    "dotenv": "^16.3.2",
+    "dotenv": "^16.4.1",
     "msw": "^1.3.2",
     "node-fetch": "^2.7.0",
     "style-loader": "^3.3.4",
@@ -56,5 +56,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "866fb2e4de535d1b8ec7640c797fff5b487d1b8f"
+  "gitHead": "cdf0c7f0387ac429092af04f584b97800db3d92f"
 }