How to use the keycode-js.KEY_LEFT function in keycode-js

To help you get started, we’ve selected a few keycode-js examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github cerner / terra-framework / packages / terra-tabs / src / _CollapsibleTabs.jsx View on Github external
handleOnKeyDown(event) {
    // If there are less than 2 children we don't need to worry about keyboard navigation
    if (React.Children.count(this.props.children) < 2) {
      return;
    }

    // We don't want menu keydown events to propagate and conflict when the tabs keydown events
    // Instead of stopping menu key event propagation, we whitelist event.targets so we do tab focus mgmt only on tab based event targets
    const tabList = event.target.getAttribute('role') === 'tablist';
    const tabMoreBtn = event.target.getAttribute('data-terra-tabs-menu') === 'true';

    if (tabList || tabMoreBtn) {
      const isRTL = document.getElementsByTagName('html')[0].getAttribute('dir') === 'rtl';
      const visibleChildren = this.container.children;

      if (event.nativeEvent.keyCode === KeyCode.KEY_LEFT) {
        if (isRTL) {
          this.handleFocusRight(visibleChildren, event);
        } else {
          this.handleFocusLeft(visibleChildren, event);
        }
      } else if (event.nativeEvent.keyCode === KeyCode.KEY_RIGHT) {
        if (isRTL) {
          this.handleFocusLeft(visibleChildren, event);
        } else {
          this.handleFocusRight(visibleChildren, event);
        }
      }
    }
  }
github cerner / terra-framework / packages / terra-menu / src / _MenuContent.jsx View on Github external
return ((event) => {
      const shiftTabClicked = (event.shiftKey && event.nativeEvent.keyCode === KeyCode.KEY_TAB);
      const tabClicked = (event.nativeEvent.keyCode === KeyCode.KEY_TAB);
      if (!(shiftTabClicked || tabClicked)) {
        event.preventDefault();
      }

      if (event.nativeEvent.keyCode === KeyCode.KEY_RETURN || event.nativeEvent.keyCode === KeyCode.KEY_SPACE) {
        if (item.props.subMenuItems && item.props.subMenuItems.length > 0) {
          this.props.onRequestNext(item);
        }
      } else if (event.nativeEvent.keyCode === KeyCode.KEY_RIGHT) {
        if (item.props.subMenuItems && item.props.subMenuItems.length > 0) {
          this.props.onRequestNext(item);
        }
      } else if (event.nativeEvent.keyCode === KeyCode.KEY_LEFT) {
        this.props.onRequestBack();
      } else if (event.nativeEvent.keyCode === KeyCode.KEY_UP) {
        this.setState({ focusIndex: index - 1 });
      } else if (event.nativeEvent.keyCode === KeyCode.KEY_DOWN) {
        this.setState({ focusIndex: index + 1 });
      }

      if (onKeyDown) {
        onKeyDown(event);
      }
    });
  }
github cerner / terra-framework / packages / terra-time-input / src / TimeInput.jsx View on Github external
let stateValue = this.state.second;
    const previousStateValue = stateValue;

    if (event.keyCode === KeyCode.KEY_UP) {
      stateValue = TimeUtil.incrementSecond(stateValue);
    }

    if (event.keyCode === KeyCode.KEY_DOWN) {
      stateValue = TimeUtil.decrementSecond(stateValue);
    }

    if (previousStateValue !== stateValue) {
      this.handleValueChange(event, TimeUtil.inputType.SECOND, stateValue, this.state.meridiem);
    }

    if (event.keyCode === KeyCode.KEY_LEFT
      || event.keyCode === KeyCode.KEY_DELETE
      || event.keyCode === KeyCode.KEY_BACK_SPACE) {
      this.focusMinuteFromSecond(event);
    }
  }