@4site/engrid-scripts 0.19.1

package/dist/app.js

@@ -0,0 +1,340 @@
+import { DonationAmount, DonationFrequency, EnForm, ProcessingFees, Country, } from "./events";
+import { AmountLabel, Loader, ProgressBar, UpsellLightbox, ENGrid, OptionsDefaults, setRecurrFreq, PageBackground, MediaAttribution, ApplePay, A11y, CapitalizeFields, Ecard, ClickToExpand, Advocacy, DataAttributes, LiveVariables, iFrame, InputPlaceholders, InputHasValueAndFocus, ShowHideRadioCheckboxes, AutoCountrySelect, SkipToMainContentLink, SrcDefer, NeverBounce, AutoYear, Autocomplete, RememberMe, TranslateFields, ShowIfAmount, EngridLogger, OtherAmount, MinMaxAmount, Ticker, DataReplace, DataHide, AddNameToMessage, ExpandRegionName, AppVersion, UrlToForm, RequiredIfVisible, TidyContact, DataLayer, LiveCurrency, Autosubmit, EventTickets, SwapAmounts, DebugPanel, DebugHiddenFields, FreshAddress, BrandingHtml, CountryDisable, PremiumGift, DigitalWallets, MobileCTA, LiveFrequency, UniversalOptIn, Plaid, GiveBySelect, UrlParamsToBodyAttrs, ExitIntentLightbox, SupporterHub, FastFormFill, SetAttr, ShowIfPresent, ENValidators, CustomCurrency, VGS, PostalCodeValidator, CountryRedirect, WelcomeBack, EcardToTarget, UsOnlyForm, ThankYouPageConditionalContent, EmbeddedEcard, } from ".";
+export class App extends ENGrid {
+    constructor(options) {
+        super();
+        // Events
+        this._form = EnForm.getInstance();
+        this._fees = ProcessingFees.getInstance();
+        this._amount = DonationAmount.getInstance("transaction.donationAmt", "transaction.donationAmt.other");
+        this._frequency = DonationFrequency.getInstance();
+        this._country = Country.getInstance();
+        this.logger = new EngridLogger("App", "black", "white", "🍏");
+        const loader = new Loader();
+        this.options = Object.assign(Object.assign({}, OptionsDefaults), options);
+        // Add Options to window
+        window.EngridOptions = this.options;
+        this._dataLayer = DataLayer.getInstance();
+        // If there's a ?pbedit query string, redirect to the page builder to edit on EN
+        if (ENGrid.getUrlParameter("pbedit") === true ||
+            ENGrid.getUrlParameter("pbedit") === "true") {
+            window.location.href = `https://${ENGrid.getDataCenter()}.engagingnetworks.app/index.html#pages/${ENGrid.getPageID()}/edit`;
+            return;
+        }
+        if (loader.reload())
+            return;
+        // Turn Debug ON if you use local assets
+        if (ENGrid.getBodyData("assets") === "local" &&
+            ENGrid.getUrlParameter("debug") !== "false" &&
+            ENGrid.getUrlParameter("debug") !== "log") {
+            window.EngridOptions.Debug = true;
+        }
+        // Document Load
+        if (document.readyState !== "loading") {
+            this.run();
+        }
+        else {
+            document.addEventListener("DOMContentLoaded", () => {
+                this.run();
+            });
+        }
+        // Window Resize
+        window.onresize = () => {
+            this.onResize();
+        };
+    }
+    run() {
+        if (!ENGrid.checkNested(window.EngagingNetworks, "require", "_defined", "enjs")) {
+            this.logger.danger("Engaging Networks JS Framework NOT FOUND");
+            setTimeout(() => {
+                this.run();
+            }, 100);
+            return;
+        }
+        // If there's an option object on the page, override the defaults
+        if (window.hasOwnProperty("EngridPageOptions")) {
+            this.options = Object.assign(Object.assign({}, this.options), window.EngridPageOptions);
+            // Add Options to window
+            window.EngridOptions = this.options;
+        }
+        // If there's no pageJson.pageType, add a big red warning to the console
+        if (!ENGrid.checkNested(window, "pageJson", "pageType")) {
+            window.setTimeout(() => {
+                console.log("%c ⛔️ pageJson.pageType NOT FOUND - Go to the Account Settings and Expose the Transaction Details %s", "background-color: red; color: white; font-size: 22px; font-weight: bold;", "https://knowledge.engagingnetworks.net/datareports/expose-transaction-details-pagejson");
+            }, 2000);
+        }
+        if (this.options.Debug || App.getUrlParameter("debug") == "true")
+            // Enable debug if available is the first thing
+            App.setBodyData("debug", "");
+        new Advocacy();
+        new InputPlaceholders();
+        new InputHasValueAndFocus();
+        new ShowHideRadioCheckboxes("transaction.giveBySelect", "giveBySelect-");
+        new ShowHideRadioCheckboxes("transaction.inmem", "inmem-");
+        new ShowHideRadioCheckboxes("transaction.recurrpay", "recurrpay-");
+        // Automatically show/hide all radios
+        let radioFields = [];
+        const allRadios = document.querySelectorAll("input[type=radio]");
+        allRadios.forEach((radio) => {
+            if ("name" in radio && radioFields.includes(radio.name) === false) {
+                radioFields.push(radio.name);
+            }
+        });
+        radioFields.forEach((field) => {
+            new ShowHideRadioCheckboxes(field, "engrid__" + field.replace(/\./g, "") + "-");
+        });
+        // Automatically show/hide all checkboxes
+        const allCheckboxes = document.querySelectorAll("input[type=checkbox]");
+        allCheckboxes.forEach((checkbox) => {
+            if ("name" in checkbox) {
+                new ShowHideRadioCheckboxes(checkbox.name, "engrid__" + checkbox.name.replace(/\./g, "") + "-");
+            }
+        });
+        // Client onSubmit and onError functions
+        this._form.onSubmit.subscribe(() => this.onSubmit());
+        this._form.onError.subscribe(() => this.onError());
+        this._form.onValidate.subscribe(() => this.onValidate());
+        // Event Listener Examples
+        this._amount.onAmountChange.subscribe((s) => this.logger.success(`Live Amount: ${s}`));
+        this._frequency.onFrequencyChange.subscribe((s) => {
+            this.logger.success(`Live Frequency: ${s}`);
+            setTimeout(() => {
+                this._amount.load();
+            }, 150);
+        });
+        this._form.onSubmit.subscribe((s) => this.logger.success("Submit: " + JSON.stringify(s)));
+        this._form.onError.subscribe((s) => this.logger.danger("Error: " + JSON.stringify(s)));
+        this._country.onCountryChange.subscribe((s) => this.logger.success(`Country: ${s}`));
+        window.enOnSubmit = () => {
+            this._form.submit = true;
+            this._form.submitPromise = false;
+            this._form.dispatchSubmit();
+            ENGrid.watchForError(ENGrid.enableSubmit);
+            if (!this._form.submit)
+                return false;
+            if (this._form.submitPromise)
+                return this._form.submitPromise;
+            this.logger.success("enOnSubmit Success");
+            // If all validation passes, we'll watch for Digital Wallets Errors, which
+            // will not reload the page (thanks EN), so we will enable the submit button if
+            // an error is programmatically thrown by the Digital Wallets
+            return true;
+        };
+        window.enOnError = () => {
+            this._form.dispatchError();
+        };
+        window.enOnValidate = () => {
+            this._form.validate = true;
+            this._form.validatePromise = false;
+            this._form.dispatchValidate();
+            if (!this._form.validate)
+                return false;
+            if (this._form.validatePromise)
+                return this._form.validatePromise;
+            this.logger.success("Validation Passed");
+            return true;
+        };
+        new DataAttributes();
+        // Country Redirect
+        new CountryRedirect();
+        // iFrame Logic
+        new iFrame();
+        // Live Variables
+        new LiveVariables(this.options);
+        // Dynamically set Recurrency Frequency
+        new setRecurrFreq();
+        // Upsell Lightbox
+        new UpsellLightbox();
+        // Amount Labels
+        new AmountLabel();
+        // Engrid Data Replacement
+        new DataReplace();
+        // ENgrid Hide Script
+        new DataHide();
+        // Autosubmit script
+        new Autosubmit();
+        // Adjust display of event tickets.
+        new EventTickets();
+        // Swap Amounts
+        new SwapAmounts();
+        // On the end of the script, after all subscribers defined, let's load the current frequency
+        // The amount will be loaded by the frequency change event
+        // This timeout is needed because when you have alternative amounts, EN is slower than Engrid
+        // about 20% of the time and we get a race condition if the client is also using the SwapAmounts feature
+        window.setTimeout(() => {
+            this._frequency.load();
+        }, 1000);
+        // Fast Form Fill
+        new FastFormFill();
+        // Currency Related Components
+        new LiveCurrency();
+        new CustomCurrency();
+        // Auto Country Select
+        new AutoCountrySelect();
+        // Add Image Attribution
+        if (this.options.MediaAttribution)
+            new MediaAttribution();
+        // Apple Pay
+        if (this.options.applePay)
+            new ApplePay();
+        // Capitalize Fields
+        if (this.options.CapitalizeFields)
+            new CapitalizeFields();
+        // Auto Year Class
+        if (this.options.AutoYear)
+            new AutoYear();
+        // Autocomplete Class
+        new Autocomplete();
+        // Ecard Class
+        new Ecard();
+        // Click To Expand
+        if (this.options.ClickToExpand)
+            new ClickToExpand();
+        if (this.options.SkipToMainContentLink)
+            new SkipToMainContentLink();
+        if (this.options.SrcDefer)
+            new SrcDefer();
+        // Progress Bar
+        if (this.options.ProgressBar)
+            new ProgressBar();
+        // RememberMe
+        try {
+            // Accessing window.localStorage will throw an exception if it isn't permitted due to security reasons
+            // For example, this happens in Firefox when cookies are disabled.  If it isn't available, we shouldn't
+            //  bother with enabling RememberMe
+            if (this.options.RememberMe &&
+                typeof this.options.RememberMe === "object" &&
+                window.localStorage) {
+                new RememberMe(this.options.RememberMe);
+            }
+        }
+        catch (e) { }
+        if (this.options.NeverBounceAPI)
+            new NeverBounce(this.options.NeverBounceAPI, this.options.NeverBounceDateField, this.options.NeverBounceStatusField, this.options.NeverBounceDateFormat);
+        // FreshAddress
+        if (this.options.FreshAddress)
+            new FreshAddress();
+        new ShowIfAmount();
+        new OtherAmount();
+        new MinMaxAmount();
+        new Ticker();
+        new A11y();
+        new AddNameToMessage();
+        new ExpandRegionName();
+        // Page Background
+        new PageBackground();
+        // Url Params to Form Fields
+        new UrlToForm();
+        // Required if Visible Fields
+        new RequiredIfVisible();
+        // EN Custom Validators (behind a feature flag, off by default)
+        new ENValidators();
+        //Debug hidden fields
+        if (this.options.Debug)
+            new DebugHiddenFields();
+        // TidyContact
+        if (this.options.TidyContact)
+            new TidyContact();
+        // Translate Fields
+        if (this.options.TranslateFields)
+            new TranslateFields();
+        // Country Disable
+        new CountryDisable();
+        // Premium Gift Features
+        new PremiumGift();
+        // Supporter Hub Features
+        new SupporterHub();
+        // Digital Wallets Features
+        if (ENGrid.getPageType() === "DONATION") {
+            new DigitalWallets();
+        }
+        // Mobile CTA
+        new MobileCTA();
+        // Live Frequency
+        new LiveFrequency();
+        // Universal Opt In
+        new UniversalOptIn();
+        // Plaid
+        if (this.options.Plaid)
+            new Plaid();
+        // Give By Select
+        new GiveBySelect();
+        //Exit Intent Lightbox
+        new ExitIntentLightbox();
+        new UrlParamsToBodyAttrs();
+        new SetAttr();
+        new ShowIfPresent();
+        new PostalCodeValidator();
+        // Very Good Security
+        new VGS();
+        new WelcomeBack();
+        new EcardToTarget();
+        new UsOnlyForm();
+        new ThankYouPageConditionalContent();
+        new EmbeddedEcard();
+        //Debug panel
+        let showDebugPanel = this.options.Debug;
+        try {
+            // accessing storage can throw an exception if it isn't available in Firefox
+            if (!showDebugPanel &&
+                window.sessionStorage.hasOwnProperty(DebugPanel.debugSessionStorageKey)) {
+                showDebugPanel = true;
+            }
+        }
+        catch (e) { }
+        if (showDebugPanel) {
+            new DebugPanel(this.options.PageLayouts);
+        }
+        if (ENGrid.getUrlParameter("development") === "branding") {
+            new BrandingHtml().show();
+        }
+        ENGrid.setBodyData("data-engrid-js-loading", "finished");
+        window.EngridVersion = AppVersion;
+        this.logger.success(`VERSION: ${AppVersion}`);
+        // Window Load
+        let onLoad = typeof window.onload === "function" ? window.onload : null;
+        if (document.readyState !== "loading") {
+            this.onLoad();
+        }
+        else {
+            window.onload = (e) => {
+                this.onLoad();
+                if (onLoad) {
+                    onLoad.bind(window, e);
+                }
+            };
+        }
+    }
+    onLoad() {
+        if (this.options.onLoad) {
+            this.options.onLoad();
+        }
+    }
+    onResize() {
+        if (this.options.onResize) {
+            this.options.onResize();
+        }
+    }
+    onValidate() {
+        if (this.options.onValidate) {
+            this.logger.log("Client onValidate Triggered");
+            this.options.onValidate();
+        }
+    }
+    onSubmit() {
+        if (this.options.onSubmit) {
+            this.logger.log("Client onSubmit Triggered");
+            this.options.onSubmit();
+        }
+    }
+    onError() {
+        if (this.options.onError) {
+            this.logger.danger("Client onError Triggered");
+            this.options.onError();
+        }
+    }
+    static log(message) {
+        const logger = new EngridLogger("Client", "brown", "aliceblue", "🍪");
+        logger.log(message);
+    }
+}

package/dist/apple-pay.d.ts

@@ -0,0 +1,13 @@
+import { EnForm, DonationAmount, ProcessingFees } from ".";
+export declare class ApplePay {
+    applePay: HTMLInputElement;
+    _amount: DonationAmount;
+    _fees: ProcessingFees;
+    _form: EnForm;
+    constructor();
+    private checkApplePay;
+    performValidation(url: string): Promise<unknown>;
+    private log;
+    sendPaymentToken(token: any): Promise<unknown>;
+    private onPayClicked;
+}

package/dist/apple-pay.js

@@ -0,0 +1,169 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { EnForm, DonationAmount, ENGrid, ProcessingFees } from ".";
+/*global window */
+const ApplePaySession = window.ApplePaySession;
+const merchantIdentifier = window.merchantIdentifier;
+const merchantDomainName = window.merchantDomainName;
+const merchantDisplayName = window.merchantDisplayName;
+const merchantSessionIdentifier = window.merchantSessionIdentifier;
+const merchantNonce = window.merchantNonce;
+const merchantEpochTimestamp = window.merchantEpochTimestamp;
+const merchantSignature = window.merchantSignature;
+const merchantCountryCode = window.merchantCountryCode;
+const merchantCurrencyCode = window.merchantCurrencyCode;
+const merchantSupportedNetworks = window.merchantSupportedNetworks;
+const merchantCapabilities = window.merchantCapabilities;
+const merchantTotalLabel = window.merchantTotalLabel;
+export class ApplePay {
+    constructor() {
+        this.applePay = document.querySelector('.en__field__input.en__field__input--radio[value="applepay"]');
+        this._amount = DonationAmount.getInstance();
+        this._fees = ProcessingFees.getInstance();
+        this._form = EnForm.getInstance();
+        this.checkApplePay();
+    }
+    checkApplePay() {
+        return __awaiter(this, void 0, void 0, function* () {
+            const pageform = document.querySelector("form.en__component--page");
+            if (!this.applePay || !window.hasOwnProperty("ApplePaySession")) {
+                const applePayContainer = document.querySelector(".en__field__item.applepay");
+                if (applePayContainer)
+                    applePayContainer.remove();
+                if (ENGrid.debug)
+                    console.log("Apple Pay DISABLED");
+                return false;
+            }
+            const promise = ApplePaySession.canMakePaymentsWithActiveCard(merchantIdentifier);
+            let applePayEnabled = false;
+            yield promise.then((canMakePayments) => {
+                applePayEnabled = canMakePayments;
+                if (canMakePayments) {
+                    let input = document.createElement("input");
+                    input.setAttribute("type", "hidden");
+                    input.setAttribute("name", "PkPaymentToken");
+                    input.setAttribute("id", "applePayToken");
+                    pageform.appendChild(input);
+                    this._form.onSubmit.subscribe(() => this.onPayClicked());
+                }
+            });
+            if (ENGrid.debug)
+                console.log("applePayEnabled", applePayEnabled);
+            let applePayWrapper = this.applePay.closest(".en__field__item");
+            if (applePayEnabled) {
+                // Set Apple Pay Class
+                applePayWrapper === null || applePayWrapper === void 0 ? void 0 : applePayWrapper.classList.add("applePayWrapper");
+            }
+            else {
+                // Hide Apple Pay Wrapper
+                if (applePayWrapper)
+                    applePayWrapper.style.display = "none";
+            }
+            return applePayEnabled;
+        });
+    }
+    performValidation(url) {
+        return new Promise(function (resolve, reject) {
+            var merchantSession = {};
+            merchantSession.merchantIdentifier = merchantIdentifier;
+            merchantSession.merchantSessionIdentifier = merchantSessionIdentifier;
+            merchantSession.nonce = merchantNonce;
+            merchantSession.domainName = merchantDomainName;
+            merchantSession.epochTimestamp = merchantEpochTimestamp;
+            merchantSession.signature = merchantSignature;
+            var validationData = "&merchantIdentifier=" +
+                merchantIdentifier +
+                "&merchantDomain=" +
+                merchantDomainName +
+                "&displayName=" +
+                merchantDisplayName;
+            var validationUrl = "/ea-dataservice/rest/applepay/validateurl?url=" + url + validationData;
+            var xhr = new XMLHttpRequest();
+            xhr.onload = function () {
+                var data = JSON.parse(this.responseText);
+                if (ENGrid.debug)
+                    console.log("Apple Pay Validation", data);
+                resolve(data);
+            };
+            xhr.onerror = reject;
+            xhr.open("GET", validationUrl);
+            xhr.send();
+        });
+    }
+    log(name, msg) {
+        var xhr = new XMLHttpRequest();
+        xhr.open("GET", "/ea-dataservice/rest/applepay/log?name=" + name + "&msg=" + msg);
+        xhr.send();
+    }
+    sendPaymentToken(token) {
+        return new Promise(function (resolve, reject) {
+            resolve(true);
+        });
+    }
+    onPayClicked() {
+        if (!this._form.submit)
+            return;
+        const enFieldPaymentType = document.querySelector("#en__field_transaction_paymenttype");
+        const applePayToken = document.getElementById("applePayToken");
+        const formClass = this._form;
+        // Only work if Payment Type is Apple Pay
+        if (enFieldPaymentType.value == "applepay" && applePayToken.value == "") {
+            try {
+                let donationAmount = this._amount.amount + this._fees.fee;
+                var request = {
+                    supportedNetworks: merchantSupportedNetworks,
+                    merchantCapabilities: merchantCapabilities,
+                    countryCode: merchantCountryCode,
+                    currencyCode: merchantCurrencyCode,
+                    total: {
+                        label: merchantTotalLabel,
+                        amount: donationAmount,
+                    },
+                };
+                var session = new ApplePaySession(1, request);
+                var thisClass = this;
+                session.onvalidatemerchant = function (event) {
+                    thisClass
+                        .performValidation(event.validationURL)
+                        .then(function (merchantSession) {
+                        if (ENGrid.debug)
+                            console.log("Apple Pay merchantSession", merchantSession);
+                        session.completeMerchantValidation(merchantSession);
+                    });
+                };
+                session.onpaymentauthorized = function (event) {
+                    thisClass
+                        .sendPaymentToken(event.payment.token)
+                        .then(function (success) {
+                        if (ENGrid.debug)
+                            console.log("Apple Pay Token", event.payment.token);
+                        document.getElementById("applePayToken").value = JSON.stringify(event.payment.token);
+                        formClass.submitForm();
+                    });
+                };
+                session.oncancel = function (event) {
+                    if (ENGrid.debug)
+                        console.log("Cancelled", event);
+                    alert("You cancelled. Sorry it didn't work out.");
+                    formClass.dispatchError();
+                };
+                session.begin();
+                this._form.submit = false;
+                return false;
+            }
+            catch (e) {
+                alert("Developer mistake: '" + e.message + "'");
+                formClass.dispatchError();
+            }
+        }
+        this._form.submit = true;
+        return true;
+    }
+}

package/dist/auto-country-select.d.ts

@@ -0,0 +1,10 @@
+import { Country } from ".";
+export declare class AutoCountrySelect {
+    _countryEvent: Country;
+    countryWrapper: HTMLDivElement;
+    countrySelect: HTMLSelectElement;
+    private country;
+    constructor();
+    private init;
+    private setCountryByName;
+}

package/dist/auto-country-select.js

@@ -0,0 +1,63 @@
+// This class works when the user has added ".simple_country_select" as a class in page builder for the Country select
+import * as cookie from "./cookie";
+import { ENGrid, Country } from ".";
+export class AutoCountrySelect {
+    constructor() {
+        this._countryEvent = Country.getInstance();
+        this.countryWrapper = document.querySelector(".simple_country_select");
+        this.countrySelect = this._countryEvent
+            .countryField;
+        this.country = null;
+        const engridAutofill = cookie.get("engrid-autofill");
+        const submissionFailed = !!(ENGrid.checkNested(window.EngagingNetworks, "require", "_defined", "enjs", "checkSubmissionFailed") && window.EngagingNetworks.require._defined.enjs.checkSubmissionFailed());
+        const hasIntlSupport = !!ENGrid.checkNested(window.Intl, "DisplayNames");
+        // Only run if there's no engrid-autofill cookie && if it has Intl support && no country data in url
+        const locationDataInUrl = ENGrid.getUrlParameter("supporter.country") ||
+            ENGrid.getUrlParameter("supporter.region") ||
+            (ENGrid.getUrlParameter("ea.url.id") &&
+                !ENGrid.getUrlParameter("forwarded"));
+        if (!engridAutofill &&
+            !submissionFailed &&
+            hasIntlSupport &&
+            !locationDataInUrl) {
+            fetch(`https://${window.location.hostname}/cdn-cgi/trace`)
+                .then((res) => res.text())
+                .then((t) => {
+                let data = t.replace(/[\r\n]+/g, '","').replace(/\=+/g, '":"');
+                data = '{"' + data.slice(0, data.lastIndexOf('","')) + '"}';
+                const jsondata = JSON.parse(data);
+                this.country = jsondata.loc;
+                this.init();
+                // console.log("Country:", this.country);
+            });
+        }
+        else {
+            this.init();
+        }
+    }
+    init() {
+        if (this.countrySelect) {
+            if (this.country) {
+                const countriesNames = new Intl.DisplayNames(["en"], {
+                    type: "region",
+                });
+                // We are setting the country by Name because the ISO code is not always the same. They have 2 and 3 letter codes.
+                this.setCountryByName(countriesNames.of(this.country));
+            }
+        }
+    }
+    setCountryByName(countryName) {
+        if (this.countrySelect) {
+            let countrySelectOptions = this.countrySelect.options;
+            for (let i = 0; i < countrySelectOptions.length; i++) {
+                if (countrySelectOptions[i].innerHTML.toLowerCase() ==
+                    countryName.toLowerCase()) {
+                    this.countrySelect.selectedIndex = i;
+                    break;
+                }
+            }
+            const event = new Event("change", { bubbles: true });
+            this.countrySelect.dispatchEvent(event);
+        }
+    }
+}

package/dist/auto-year.d.ts

@@ -0,0 +1,7 @@
+export declare class AutoYear {
+    private yearField;
+    private years;
+    private yearLength;
+    constructor();
+    clearFieldOptions(): void;
+}

package/dist/auto-year.js

@@ -0,0 +1,35 @@
+// This class changes the Credit Card Expiration Year Field Options to
+// include the current year and the next 19 years.
+export class AutoYear {
+    constructor() {
+        this.yearField = document.querySelector("select[name='transaction.ccexpire']:not(#en__field_transaction_ccexpire)");
+        this.years = 20;
+        this.yearLength = 2;
+        if (this.yearField) {
+            this.clearFieldOptions();
+            for (let i = 0; i < this.years; i++) {
+                const year = new Date().getFullYear() + i;
+                const newOption = document.createElement("option");
+                const optionText = document.createTextNode(year.toString());
+                newOption.appendChild(optionText);
+                newOption.value =
+                    this.yearLength == 2 ? year.toString().substr(-2) : year.toString();
+                this.yearField.appendChild(newOption);
+            }
+        }
+    }
+    clearFieldOptions() {
+        if (this.yearField) {
+            this.yearLength =
+                this.yearField.options[this.yearField.options.length - 1].value.length;
+            [...this.yearField.options].forEach((option) => {
+                var _a;
+                if (option.value !== "" && !isNaN(Number(option.value))) {
+                    // @ts-ignore
+                    const index = [...this.yearField.options].findIndex((i) => i.value === option.value);
+                    (_a = this.yearField) === null || _a === void 0 ? void 0 : _a.remove(index);
+                }
+            });
+        }
+    }
+}

package/dist/autocomplete.d.ts

@@ -0,0 +1,5 @@
+export declare class Autocomplete {
+    private logger;
+    constructor();
+    private autoCompleteField;
+}