wickes-css2 2.107.0-test.1 → 2.108.0

package/build/js/page/checkout-payment-details.js

@@ -1,6 +1,4 @@
 var Wick = Wick || {};
-window.INIT_KLARNA_PAYMENT = window.INIT_KLARNA_PAYMENT || 'INIT_KLARNA_PAYMENT';
-window.INIT_BILLIE_PAYMENT = window.INIT_BILLIE_PAYMENT || 'INIT_BILLIE_PAYMENT';
 Wick.CheckoutPaymentDetails = (function () {
     const $modal = $('#modal-terms-and-conditions');
 
@@ -12,156 +10,22 @@ Wick.CheckoutPaymentDetails = (function () {
         buttonName: 'btn-enter-details',
     };
 
-  const elements = {
-    $billieRepaymentTerms: $('.js-billie-repayment-terms'),
-    $billieWidget: $('.checkout-payment-details__billie[data-billie]'),
-    $wrapperPaymentInput: $('.checkout-payment-details__row'),
-    paymentInputName: '[name=payment-method]',
-    $cardDetails: $('.checkout-payment-details__card-details'),
-    $placeOrder: $('.checkout-payment-details__place-order'),
-    $billingAddress: $('.billing-address'),
-    hiddenCardDetailsClass: 'checkout-payment-details__card-details_hidden',
-    $billieBusiness: $('[data-billie-business]'),
-    businessTypeName: '[name="businessType"]',
-    $unregisteredFields: $('#unregistered-fields'),
-    $registeredFields: $('#registered-fields'),
-    hiddenClass: 'd-none',
-    $giftcardToggle: $('#giftcard-toggle'),
-    $giftcardPanel: $('#giftcard-inline'),
-    giftcardDisabledClass: 'giftcard-toggle--disabled',
-    giftcardRoot: '.giftcard',
-    giftcardHint: '.giftcard-hint',
-    giftcardNumber: 'input[name="giftcard-number"]',
-    giftcardPin: 'input[name="giftcard-pin"]',
-  }
-
-  function setGiftcardToggleEnabled(isEnabled) {
-    const $toggle = elements.$giftcardToggle;
-    const $panel = elements.$giftcardPanel;
-    const $giftcard = $toggle.closest('.giftcard');
-
-    if (!$toggle.length) {
-      return;
-    }
-
-    $giftcard.toggleClass('giftcard--disabled', !isEnabled);
-
-    if (isEnabled) {
-      $toggle
-          .attr('aria-disabled', 'false')
-          .attr('tabindex', '0')
-          .css('pointer-events', '');
-    } else {
-      if ($panel && $panel.length) $panel.prop('hidden', true);
-
-      $toggle
-          .attr('aria-disabled', 'true')
-          .attr('tabindex', '-1')
-          .css('pointer-events', 'none')
-          .attr('aria-expanded', 'false')
-          .show();
-
-      $giftcard.find('.giftcard-hint').show();
-    }
-  }
-
-
-  function resetGiftcardToDefault() {
-    const {
-      $giftcardToggle: $toggle,
-      $giftcardPanel: $panel,
-      giftcardRoot,
-      giftcardHint,
-      giftcardNumber,
-      giftcardPin,
-    } = elements;
-
-    if (!$toggle.length) {
-      return;
-    }
-
-    const $giftcard = $toggle.closest(giftcardRoot);
-
-    const $hint = $giftcard.find(giftcardHint);
-    const $number = $giftcard.find(giftcardNumber);
-    const $pin = $giftcard.find(giftcardPin);
-
-    if ($panel.length) $panel.prop('hidden', true);
-
-    $toggle.attr('aria-expanded', 'false').show();
-    $hint.show();
-
-    if (window.Wick?.GiftCard?.resetForm) {
-      Wick.GiftCard.resetForm($giftcard);
-      return;
-    }
-
-    $number.val('');
-    $pin.val('');
-  }
-
-  function syncGiftcardAvailability(checkedMethod) {
-    const enable = checkedMethod === 'card';
-
-    if (!enable) {
-      const $giftcard = elements.$giftcardToggle.closest(elements.giftcardRoot);
-      if (window.Wick?.GiftCard?.collapsePreserveState) {
-        Wick.GiftCard.collapsePreserveState($giftcard);
-      } else {
-        if (elements.$giftcardPanel.length) elements.$giftcardPanel.prop('hidden', true);
-        elements.$giftcardToggle.attr('aria-expanded', 'false').show();
-        $giftcard.find(elements.giftcardHint).show();
-      }
-    }
-
-    setGiftcardToggleEnabled(enable);
-  }
-
-    let klarnaInited = false;
-    let billieInited = false;
-
-    function initKlarnaPayment() {
-        if (klarnaInited) return Promise.resolve({ ok: true, cached: true });
-
-        return new Promise((resolve, reject) => {
-            const payload = {};
-            const detail = {
-                resolve: (data) => {
-                    klarnaInited = true;
-                    resolve(data);
-                },
-                reject,
-            };
-
-            const evt = createEvent(window.INIT_KLARNA_PAYMENT, payload, detail);
-            window.dispatchEvent(evt);
-        });
-    }
-
-    function initBilliePayment() {
-        if (billieInited) return Promise.resolve({ ok: true, cached: true });
-
-        return new Promise((resolve, reject) => {
-            const payload = {};
-            const detail = {
-                resolve: (data) => {
-                    billieInited = true;
-                    resolve(data);
-                },
-                reject,
-            };
-
-            const evt = createEvent(window.INIT_BILLIE_PAYMENT, payload, detail);
-            window.dispatchEvent(evt);
-        });
-    }
-
-    function getBillieRepaymentTermsLength() {
-        const billieRepaymentTerms =
-            (window.Wick && window.Wick?.BillieData?.billiePaymentTerms) || [];
-
-        return Array.isArray(billieRepaymentTerms) ? billieRepaymentTerms.length : 0;
-    }
+    const elements = {
+        $billieRepaymentTerms: $('.js-billie-repayment-terms'),
+        $billieInfoBlock: $('.checkout-payment-details__billie'),
+        $billieInfo: $('.checkout-payment-details__billie .billie-info'),
+        $wrapperPaymentInput: $('.checkout-payment-details__row'),
+        paymentInputName: '[name=payment-method]',
+        $cardDetails: $('.checkout-payment-details__card-details'),
+        $placeOrder: $('.checkout-payment-details__place-order'),
+        $billingAddress: $('.billing-address'),
+        hiddenCardDetailsClass: 'checkout-payment-details__card-details_hidden',
+        $billieBusiness: $('[data-billie-business]'),
+        businessTypeName: '[name="businessType"]',
+        $unregisteredFields: $('#unregistered-fields'),
+        $registeredFields: $('#registered-fields'),
+        hiddenClass: 'd-none',
+    };
 
     function preparePage() {
         var modalOpened = $('.modal.show').length;
@@ -191,38 +55,31 @@ Wick.CheckoutPaymentDetails = (function () {
 
     function togglePaymentBlocks(paymentMethods, checkedMethod) {
         paymentMethods.forEach((method) => {
-            $(`[data-${method}]`).hide();
+            $(`[data-${method}]`).toggle(checkedMethod === method);
         });
-        const $selected = $(`[data-${checkedMethod}]`);
-        if ($selected.length) {
-            $selected.show();
-        }
     }
 
-  function resetAllCheckoutForms(keepPaymentMethod) {
-    const $container = elements.$wrapperPaymentInput.closest('.checkout-payment-details');
-    if (!$container.length) return;
-    const $giftcardScope = $container.find(elements.giftcardRoot);
-    const $exclude = $giftcardScope.find(':input');
+    function resetAllCheckoutForms(keepPaymentMethod) {
+        const $container = elements.$wrapperPaymentInput.closest('.checkout-payment-details');
+        if (!$container.length) return;
 
-    $container.find('form').each(function() {
-      if ($(this).closest(elements.giftcardRoot).length) return;
-
-      if (Wick.Forms && typeof Wick.Forms.clearValidationErrors === 'function') {
-        Wick.Forms.clearValidationErrors(this);
-      }
-    });
+        $container.find('form').each(function () {
+            if (Wick.Forms && typeof Wick.Forms.clearValidationErrors === 'function') {
+                Wick.Forms.clearValidationErrors(this);
+            }
+        });
 
-    $container
-        .find('input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="password"], textarea')
-        .not($exclude)
-        .val('');
+        $container
+            .find(
+                'input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="password"], textarea'
+            )
+            .val('');
 
-    $container.find('select').not($exclude).each(function() {
-      this.selectedIndex = 0;
-    });
+        $container.find('select').each(function () {
+            this.selectedIndex = 0;
+        });
 
-    $container.find('input[type="checkbox"]').not($exclude).prop('checked', false);
+        $container.find('input[type="checkbox"]').prop('checked', false);
 
         $container.find('input[type="radio"]').each(function () {
             const $radio = $(this);
@@ -247,7 +104,7 @@ Wick.CheckoutPaymentDetails = (function () {
 
     function setBillieStepVisibility(isReady) {
         setBillingDetailsRowVisibility(isReady);
-        elements.$billieWidget.toggle(isReady);
+        elements.$billieInfo.toggleClass(elements.hiddenClass, !isReady);
     }
 
     function resetBillieRepaymentSelection() {
@@ -273,26 +130,13 @@ Wick.CheckoutPaymentDetails = (function () {
         const isUnregistered = type === 'unregistered';
         const isRegistered = type === 'registered';
 
-        elements.$unregisteredFields
-            .toggleClass(elements.hiddenClass, !isUnregistered)
-            .removeAttr('style');
-        elements.$registeredFields
-            .toggleClass(elements.hiddenClass, !isRegistered)
-            .removeAttr('style');
+        elements.$unregisteredFields.toggleClass(elements.hiddenClass, !isUnregistered);
+        elements.$registeredFields.toggleClass(elements.hiddenClass, !isRegistered);
     }
 
     function changeDetailsBlock(checkedMethod) {
         if (checkedMethod !== 'billie') {
             setBillingDetailsRowVisibility(true);
-            hideBillieBusiness();
-        }
-
-        if (checkedMethod === 'klarna') {
-            initKlarnaPayment().catch(() => {});
-        }
-
-        if (checkedMethod === 'billie' && getBillieRepaymentTermsLength() === 1) {
-            initBilliePayment().catch(() => {});
         }
 
         switch (checkedMethod) {
@@ -314,7 +158,7 @@ Wick.CheckoutPaymentDetails = (function () {
                 };
                 changeLabelText(detailsLabel);
 
-                setBillieStepVisibility(getBillieRepaymentTermsLength() === 1);
+                setBillieStepVisibility(false);
                 resetBillieRepaymentSelection();
                 showBillieBusiness();
                 break;
@@ -330,13 +174,13 @@ Wick.CheckoutPaymentDetails = (function () {
                 prevClearableMethod = checkedMethod;
                 break;
 
-            case 'apple-pay':
+            case 'apple':
                 hideCardDetails();
                 hidePlaceOrder();
                 hideBillingAddres();
                 break;
 
-            case 'google-pay':
+            case 'google':
                 hideCardDetails();
                 hidePlaceOrder();
                 hideBillingAddres();
@@ -378,43 +222,41 @@ Wick.CheckoutPaymentDetails = (function () {
         buttonElement && buttonElement.text(buttonText);
     }
 
-  function clearInputFields() {
-    elements.$billingAddress.find('input.tbx').val('');
-  }
-
-  function showPlaceOrder() {
-    elements.$placeOrder.removeClass(elements.hiddenClass);
-  }
-
-  function hidePlaceOrder() {
-    elements.$placeOrder.addClass(elements.hiddenClass);
-  }
-
-  function initBillieBusinessTypeToggle() {
-    $(document).on('change', elements.businessTypeName, function () {
-      toggleBusinessTypeFields($(this).val());
-    });
-  }
-
-	function forceReflow($element) {
-		if (!$element.length) return;
-		void $element[0].offsetHeight;
-		$(window).trigger('resize');
-	}
-
-  function init() {
-    const paymentMethods = getPaymentMethods();
-    const initialMethod = $(elements.paymentInputName + ':checked').val() || 'card';
-    syncGiftcardAvailability(initialMethod);
-    initBillieBusinessTypeToggle();
-    hideBillieBusiness();
+    function clearInputFields() {
+        elements.$billingAddress.find('input.tbx').val('');
+    }
+
+    function showPlaceOrder() {
+        elements.$placeOrder.removeClass(elements.hiddenClass);
+    }
+
+    function hidePlaceOrder() {
+        elements.$placeOrder.addClass(elements.hiddenClass);
+    }
+
+    function initBillieBusinessTypeToggle() {
+        $(document).on('change', elements.businessTypeName, function () {
+            toggleBusinessTypeFields($(this).val());
+        });
+    }
+
+    function forceReflow($element) {
+        if (!$element.length) return;
+        void $element[0].offsetHeight;
+        $(window).trigger('resize');
+    }
+
+    function init() {
+        const paymentMethods = getPaymentMethods();
+        initBillieBusinessTypeToggle();
+        hideBillieBusiness();
 
         $(document).on('change', 'input[name="repaymentTerms"]', function () {
             const currentMethod = $(elements.paymentInputName + ':checked').val();
             if (currentMethod !== 'billie') return;
 
             requestAnimationFrame(() => {
-                forceReflow(elements.$billieWidget);
+                forceReflow(elements.$billieInfoBlock);
             });
 
             const hasSelection = $('input[name="repaymentTerms"]:checked').length > 0;
@@ -427,27 +269,27 @@ Wick.CheckoutPaymentDetails = (function () {
         elements.$wrapperPaymentInput.on('change', elements.paymentInputName, function () {
             const checkedMethod = $(this).val();
 
-      togglePaymentBlocks(paymentMethods, checkedMethod)
-      changeDetailsBlock(checkedMethod)
-      syncGiftcardAvailability(checkedMethod);
-
-      if (prevPaymentMethod && prevPaymentMethod !== checkedMethod) {
-        resetAllCheckoutForms(checkedMethod);
-      } else {
-        const form = $(this).closest('form')[0];
-        form && Wick.Forms && Wick.Forms.clearValidationErrors && Wick.Forms.clearValidationErrors(form);
-      }
+            if (prevPaymentMethod && prevPaymentMethod !== checkedMethod) {
+                resetAllCheckoutForms(checkedMethod);
+            } else {
+                const form = $(this).closest('form')[0];
+                form &&
+                    Wick.Forms &&
+                    Wick.Forms.clearValidationErrors &&
+                    Wick.Forms.clearValidationErrors(form);
+            }
 
-      prevPaymentMethod = checkedMethod;
-    });
+            togglePaymentBlocks(paymentMethods, checkedMethod);
+            changeDetailsBlock(checkedMethod);
 
-    $('.btn-new-card').on('click', function() {
-      elements.$cardDetails.removeClass(elements.hiddenCardDetailsClass);
+            prevPaymentMethod = checkedMethod;
+        });
 
-      $('[data-new-card]').show();
-      $('[data-existing-card]').hide();
-      return false;
-    });
+        $('.btn-new-card').on('click', function () {
+            $('[data-new-card]').show();
+            $('[data-existing-card]').hide();
+            return false;
+        });
 
         $('.btn-back-to-existing-card').on('click', function () {
             $('[data-new-card]').hide();

package/build/js/page/checkout.js

@@ -1,4 +1,4 @@
-import {checkVoucherCode, voucherRemove} from './components/voucher';
+import { checkVoucherCode, voucherRemove } from './components/voucher';
 
 var Wick = window.Wick || {};
 Wick.Checkout = {