@sberdevices/plasma-temple/dist/hooks/useRemoteHandlers.js

SberDevices CanvasApp Templates.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useRemoteHandlers = useRemoteHandlers;
exports.useRemoteListener = void 0;

var _react = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("react"));

var _deviceFamily = /*#__PURE__*/require("../utils/deviceFamily");

var _useThrottledCallback = /*#__PURE__*/require("./useThrottledCallback");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }

function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }

function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }

function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }

function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }

function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }

var navKeys = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'Enter'];

var useRemoteListener = function useRemoteListener(cb, params) {
  var _ref = params || {},
      _ref$keypressTimeMs = _ref.keypressTimeMs,
      keypressTimeMs = _ref$keypressTimeMs === void 0 ? 150 : _ref$keypressTimeMs,
      _ref$disable = _ref.disable,
      disable = _ref$disable === void 0 ? false : _ref$disable;

  var keydown = _react["default"].useRef(null);

  _react["default"].useEffect(function () {
    var handleKeydown = function handleKeydown(event) {
      if (disable || navKeys.indexOf(event.key) === -1) {
        return;
      }

      var isLong = keydown.current && Date.now() - keydown.current < keypressTimeMs;

      switch (event.key) {
        case 'ArrowUp':
          cb(isLong ? 'LONG_UP' : 'UP', event);
          break;

        case 'ArrowDown':
          cb(isLong ? 'LONG_DOWN' : 'DOWN', event);
          break;

        case 'ArrowLeft':
          cb(isLong ? 'LONG_LEFT' : 'LEFT', event);
          break;

        case 'ArrowRight':
          cb(isLong ? 'LONG_RIGHT' : 'RIGHT', event);
          break;

        case 'Enter':
          cb(isLong ? 'LONG_OK' : 'OK', event);
          break;

        default:
          break;
      }

      keydown.current = Date.now();
    };

    var handleKeyup = function handleKeyup(event) {
      if (navKeys.indexOf(event.key) === -1) {
        return;
      }

      keydown.current = null;
    };

    document.addEventListener('keydown', handleKeydown);
    document.addEventListener('keyup', handleKeyup);
    return function () {
      document.removeEventListener('keydown', handleKeydown);
      document.removeEventListener('keyup', handleKeyup);
    };
  }, [cb, disable, keypressTimeMs]);
};

exports.useRemoteListener = useRemoteListener;
var throttlingParamsDefault = {
  leading: true,
  trailing: false
};

var _ref2 = /*#__PURE__*/(0, _deviceFamily.isSberBoxLike)() ? [300, 1500] : [30, 150],
    _ref3 = /*#__PURE__*/_slicedToArray(_ref2, 2),
    defaultDelay = _ref3[0],
    defaultLongDelay = _ref3[1];

function useRemoteHandlers(_ref4) {
  var _ref4$initialIndex = _ref4.initialIndex,
      initialIndex = _ref4$initialIndex === void 0 ? 0 : _ref4$initialIndex,
      axis = _ref4.axis,
      _ref4$delay = _ref4.delay,
      delay = _ref4$delay === void 0 ? defaultDelay : _ref4$delay,
      _ref4$longDelay = _ref4.longDelay,
      longDelay = _ref4$longDelay === void 0 ? defaultLongDelay : _ref4$longDelay,
      min = _ref4.min,
      max = _ref4.max,
      _ref4$count = _ref4.count,
      count = _ref4$count === void 0 ? 1 : _ref4$count,
      _ref4$longCount = _ref4.longCount,
      longCount = _ref4$longCount === void 0 ? 5 : _ref4$longCount,
      _ref4$throttlingParam = _ref4.throttlingParams,
      throttlingParams = _ref4$throttlingParam === void 0 ? throttlingParamsDefault : _ref4$throttlingParam,
      _ref4$disable = _ref4.disable,
      disable = _ref4$disable === void 0 ? false : _ref4$disable,
      _ref4$repeat = _ref4.repeat,
      repeat = _ref4$repeat === void 0 ? true : _ref4$repeat;

  var indexState = _react["default"].useState(initialIndex);

  var _indexState = _slicedToArray(indexState, 2),
      currentIndex = _indexState[0],
      setIndex = _indexState[1];

  var step = (0, _useThrottledCallback.useThrottledCallback)(function (cmd) {
    return setIndex(function (prevIndex) {
      if (cmd === '+') {
        var _indexAfterLimit = repeat ? min : max;

        return prevIndex + count <= max ? prevIndex + count : _indexAfterLimit;
      }

      var indexAfterLimit = repeat ? max : min;
      return prevIndex - count >= min ? prevIndex - count : indexAfterLimit;
    });
  }, [min, max], delay, throttlingParams);
  var jump = (0, _useThrottledCallback.useThrottledCallback)(function (cmd) {
    return setIndex(function (prevIndex) {
      if (cmd === '+') {
        var _indexAfterLimit2 = repeat ? min : max;

        return prevIndex + longCount <= max ? prevIndex + longCount : _indexAfterLimit2;
      }

      var indexAfterLimit = repeat ? max : min;
      return prevIndex - longCount >= min ? prevIndex - longCount : indexAfterLimit;
    });
  }, [min, max], longDelay, throttlingParams);
  useRemoteListener(function (key, e) {
    if (disable) {
      return;
    }

    var preventDefault = function preventDefault(condition) {
      if (condition) {
        e.preventDefault();
        e.stopPropagation();
      }
    };

    if (axis === 'x') {
      switch (key) {
        case 'LEFT':
          preventDefault(currentIndex > 0);
          step('-');
          break;

        case 'RIGHT':
          preventDefault(currentIndex <= max);
          step('+');
          break;

        case 'LONG_LEFT':
          preventDefault(currentIndex > 0);
          jump('-');
          break;

        case 'LONG_RIGHT':
          preventDefault(currentIndex <= max);
          jump('+');
          break;

        default:
          break;
      }
    } else {
      switch (key) {
        case 'UP':
          preventDefault(currentIndex > 0);
          step('-');
          break;

        case 'DOWN':
          preventDefault(currentIndex <= max);
          step('+');
          break;

        case 'LONG_UP':
          preventDefault(currentIndex > 0);
          jump('-');
          break;

        case 'LONG_DOWN':
          preventDefault(currentIndex <= max);
          jump('+');
          break;

        default:
          break;
      }
    }
  }, {
    disable: disable
  });
  return indexState;
}
//# sourceMappingURL=useRemoteHandlers.js.map