@wordpress/components/build/navigable-container/menu.js

UI components for WordPress.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

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

var _element = require("@wordpress/element");

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _lodash = require("lodash");

var _keycodes = require("@wordpress/keycodes");

var _container = _interopRequireDefault(require("./container"));

/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */
function NavigableMenu({
  role = 'menu',
  orientation = 'vertical',
  ...rest
}, ref) {
  const eventToOffset = evt => {
    const {
      keyCode
    } = evt;
    let next = [_keycodes.DOWN];
    let previous = [_keycodes.UP];

    if (orientation === 'horizontal') {
      next = [_keycodes.RIGHT];
      previous = [_keycodes.LEFT];
    }

    if (orientation === 'both') {
      next = [_keycodes.RIGHT, _keycodes.DOWN];
      previous = [_keycodes.LEFT, _keycodes.UP];
    }

    if ((0, _lodash.includes)(next, keyCode)) {
      return 1;
    } else if ((0, _lodash.includes)(previous, keyCode)) {
      return -1;
    } else if ((0, _lodash.includes)([_keycodes.DOWN, _keycodes.UP, _keycodes.LEFT, _keycodes.RIGHT], keyCode)) {
      // Key press should be handled, e.g. have event propagation and
      // default behavior handled by NavigableContainer but not result
      // in an offset.
      return 0;
    }
  };

  return (0, _element.createElement)(_container.default, (0, _extends2.default)({
    ref: ref,
    stopNavigationEvents: true,
    onlyBrowserTabstops: false,
    role: role,
    "aria-orientation": role === 'presentation' ? null : orientation,
    eventToOffset: eventToOffset
  }, rest));
}

var _default = (0, _element.forwardRef)(NavigableMenu);

exports.default = _default;
//# sourceMappingURL=menu.js.map