wickes-css2 2.106.0-develop.4 → 2.106.0-gift-cards.2

package/src/js/page/utils/create-count-stepper.js

@@ -1,141 +0,0 @@
-import countButton from '../../../elements/count-button.hbs';
-
-// ===== HELPERS =====
-
-function normalizeOptions(options) {
-    return {
-        inputSel: '#quantity-field',
-
-        min: 1,
-
-        enhancedInputClass: 'count-stepper__input',
-        enhancedParentClass: 'count-stepper',
-
-        onChange: null,
-
-        ...options,
-    };
-}
-
-function toInt(value) {
-    const n = parseInt(String(value || '').trim(), 10);
-    return Number.isFinite(n) ? n : NaN;
-}
-
-function clampMin(n, min) {
-    return Math.max(min, n);
-}
-
-function ensureQty(value, fallback) {
-    const n = toInt(value);
-    return Number.isFinite(n) ? n : fallback;
-}
-
-function buildBtn(type, disabled) {
-    return countButton({
-        type,
-        icon: type === 'plus' ? 'fa-plus' : 'fa-minus',
-        ariaLabel: type === 'plus' ? 'Increase quantity' : 'Decrease quantity',
-        disabled: !!disabled,
-    });
-}
-
-function getButtonsWrap($input) {
-    return $input.parent();
-}
-
-function getMinusBtn($wrap) {
-    return $wrap.find('[data-count-btn][data-count-type="minus"]').first();
-}
-
-function getPlusBtn($wrap) {
-    return $wrap.find('[data-count-btn][data-count-type="plus"]').first();
-}
-
-function updateButtons($input, opt) {
-    const $wrap = getButtonsWrap($input);
-    const qty = ensureQty($input.val(), opt.min);
-
-    const $minus = getMinusBtn($wrap);
-
-    if ($minus.length) $minus.prop('disabled', qty <= opt.min);
-}
-
-function setQty($input, opt, qty) {
-    const next = clampMin(qty, opt.min);
-    $input.val(String(next));
-    updateButtons($input, opt);
-
-    if (typeof opt.onChange === 'function') {
-        opt.onChange(next, $input.get(0));
-    }
-}
-
-function ensureButtons($input, opt) {
-    const $parent = getButtonsWrap($input);
-
-    $input.addClass(opt.enhancedInputClass);
-    $parent.addClass(opt.enhancedParentClass);
-
-    const hasMinus = getMinusBtn($parent).length;
-    const hasPlus = getPlusBtn($parent).length;
-
-    if (!hasMinus) {
-        $input.before(buildBtn('minus', true));
-    }
-    if (!hasPlus) {
-        $input.after(buildBtn('plus', false));
-    }
-
-    const initial = ensureQty($input.val(), opt.min);
-    setQty($input, opt, initial);
-}
-
-function getInputs($root, inputSel) {
-    const $scope = $root && $root.length ? $root : $(document);
-    const $self = $scope.is(inputSel) ? $scope : $();
-    const $found = $scope.find(inputSel);
-    return $self.add($found);
-}
-
-// ===== FACTORY =====
-
-export function createCountStepper(options = {}) {
-    const OPT = normalizeOptions(options);
-    if (!OPT.inputSel) throw new Error('[createCountStepper] Missing inputSel');
-
-    const NS = `.cnt_${Math.random().toString(16).slice(2)}`;
-
-    function init($root) {
-        getInputs($root, OPT.inputSel).each(function () {
-            ensureButtons($(this), OPT);
-        });
-    }
-
-    // +/- click
-    $(document)
-        .off(`click${NS}`, '[data-count-btn]')
-        .on(`click${NS}`, '[data-count-btn]', function (e) {
-            const $btn = $(this);
-            const $parent = $btn.parent();
-            const $input = $parent.find(OPT.inputSel).first();
-
-            if (!$input.length) return;
-
-            e.preventDefault();
-
-            const type = ($btn.attr('data-count-type') || '').toLowerCase();
-            const current = ensureQty($input.val(), OPT.min);
-
-            if (type === 'plus') setQty($input, OPT, current + 1);
-            if (type === 'minus') setQty($input, OPT, current - 1);
-        });
-
-    $(document)
-        .off(`input${NS} change${NS}`, OPT.inputSel)
-        .on(`input${NS} change${NS}`, OPT.inputSel, function () {
-            updateButtons($(this), OPT);
-        });
-
-    return { init };
-}

package/src/scss/components/_input-counter.scss

@@ -1,65 +0,0 @@
-.count-stepper {
-  display: inline-flex;
-  align-items: center;
-  gap: 8px;
-  margin-top: 6px;
-
-  .quantity-label {
-    padding-right: 9px;
-    margin: 0 !important;
-  }
-
-  &__input {
-    height: 40px;
-    width: 46px;
-    border: 1px solid $gray;
-    border-radius: 3px;
-    margin-right: 0 !important;
-  }
-}
-
-.count-btn {
-  font-size: 1.3rem;
-  width: 24px;
-  height: 24px;
-  padding: 0;
-  border: 0;
-  background: transparent;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-  color: $blue;
-  outline: none;
-  box-shadow: none;
-  -webkit-tap-highlight-color: transparent;
-
-  i {
-    font-size: 16px;
-    line-height: 1;
-  }
-
-  &[disabled] {
-    cursor: not-allowed;
-    opacity: 0.6;
-  }
-
-  &:focus {
-    outline: none;
-    box-shadow: none;
-  }
-
-  &:focus-visible {
-    border-radius: 4px;
-    box-shadow: 0 0 0 3px rgba($blue, 0.35);
-  }
-
-  &:focus:not(:focus-visible) {
-    box-shadow: none;
-  }
-
-  &::-moz-focus-inner {
-    border: 0;
-    padding: 0;
-  }
-}