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

handleKeyDown(event) {
    const { keyCode } = event;
    const { active, children } = this.state;
    const {
      intl,
      onSelect,
      onDeselect,
      value,
      visuallyHiddenComponent,
    } = this.props;

    if (keyCode === KeyCode.KEY_UP) {
      this.clearScrollTimeout();
      this.scrollTimeout = setTimeout(this.clearScrollTimeout, 500);
      this.setState({ active: MenuUtil.findPrevious(children, active) }, this.scrollIntoView);
      this.updateCurrentActiveScreenReader();
    } else if (keyCode === KeyCode.KEY_DOWN) {
      this.clearScrollTimeout();
      this.scrollTimeout = setTimeout(this.clearScrollTimeout, 500);
      this.setState({ active: MenuUtil.findNext(children, active) }, this.scrollIntoView);
      this.updateCurrentActiveScreenReader();
    } else if (keyCode === KeyCode.KEY_RETURN && active !== null && !MenuUtil.includes(value, active)) {
      event.preventDefault();

      const option = MenuUtil.findByValue(children, active);
      // Handles communicating the case where a regular option is selected to screen readers.
      if (visuallyHiddenComponent && visuallyHiddenComponent.current) {
        visuallyHiddenComponent.current.innerHTML = intl.formatMessage({ id: 'Terra.form.select.selectedText' }, { text: option.props.display });

handleKeyDown(event) {
    const { keyCode } = event;
    const { active, children } = this.state;
    const { intl, onSelect } = this.props;

    const selectedTxt = intl.formatMessage({ id: 'Terra.form.select.selected' });

    if (keyCode === KeyCode.KEY_UP) {
      this.clearScrollTimeout();
      this.scrollTimeout = setTimeout(this.clearScrollTimeout, 500);
      this.setState({ active: MenuUtil.findPrevious(children, active) }, this.scrollIntoView);
      this.updateCurrentActiveScreenReader();
    } else if (keyCode === KeyCode.KEY_DOWN) {
      this.clearScrollTimeout();
      this.scrollTimeout = setTimeout(this.clearScrollTimeout, 500);
      this.setState({ active: MenuUtil.findNext(children, active) }, this.scrollIntoView);
      this.updateCurrentActiveScreenReader();
    } else if (keyCode === KeyCode.KEY_RETURN && active !== null) {
      event.preventDefault();
      this.setState({ closedViaKeyEvent: true });

      const option = MenuUtil.findByValue(children, active);
      // Handles communicating the case where a clear option is selected to screen readers
      if (this.props.clearOptionDisplay) {

handleKeyDown(event) {
    const { keyCode } = event;
    const { active, children } = this.state;
    const {
      intl,
      onSelect,
      visuallyHiddenComponent,
    } = this.props;

    const selectedTxt = intl.formatMessage({ id: 'Terra.form.select.selected' });

    if (keyCode === KeyCode.KEY_UP) {
      this.clearScrollTimeout();
      this.scrollTimeout = setTimeout(this.clearScrollTimeout, 500);
      this.setState({ active: MenuUtil.findPrevious(children, active) }, this.scrollIntoView);
      this.updateCurrentActiveScreenReader();
    } else if (keyCode === KeyCode.KEY_DOWN) {
      this.clearScrollTimeout();
      this.scrollTimeout = setTimeout(this.clearScrollTimeout, 500);
      this.setState({ active: MenuUtil.findNext(children, active) }, this.scrollIntoView);
      this.updateCurrentActiveScreenReader();
    } else if (keyCode === KeyCode.KEY_RETURN && active !== null) {
      event.preventDefault();
      this.setState({ closedViaKeyEvent: true });

      const option = MenuUtil.findByValue(children, active);
      if (visuallyHiddenComponent && visuallyHiddenComponent.current) {
        // Handles communicating the case where a clear option is selected to screen readers

handleKeyDown(event) {
    const { keyCode } = event;

    if (keyCode === KeyCode.KEY_SPACE) {
      event.preventDefault();
      this.openDropdown(event);
    } else if (keyCode === KeyCode.KEY_UP || keyCode === KeyCode.KEY_DOWN) {
      event.preventDefault();
      this.openDropdown(event);
    } else if (keyCode === KeyCode.KEY_ESCAPE) {
      this.closeDropdown();
    }
  }

Prevent the callback from being called repeatedly if key is held down.
        The close dropdown request had to be moved to handleKeyUp to fix a firefox bug
        where choosing an item with spacebar if the dropdown caret was focused when opening the dropdown
        would cause the dropdown to reopen itself.
      */
      if (!this.pressed) {
        this.pressed = true;
        this.setState({ active: focused });
      }
      event.preventDefault();
    } else if (keyCode === KeyCode.KEY_DOWN) {
      if (!this.pressed) {
        this.changeFocusState(Util.findNext(this, this.state.focused));
      }
      event.preventDefault();
    } else if (keyCode === KeyCode.KEY_UP) {
      if (!this.pressed) {
        this.changeFocusState(Util.findPrevious(this, this.state.focused));
      }
      event.preventDefault();
    } else if (keyCode === KeyCode.KEY_HOME) {
      if (!this.pressed) {
        this.changeFocusState(0);
      }
      event.preventDefault();
    } else if (keyCode === KeyCode.KEY_END) {
      if (!this.pressed) {
        this.changeFocusState(Util.getChildArray(this).length - 1);
      }
      event.preventDefault();
    } else if (keyCode === KeyCode.KEY_TAB) {
      this.props.requestClose();

handleMinuteInputKeyDown(event) {
    let stateValue = this.state.minute;
    const previousStateValue = stateValue;

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

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

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

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

handleKeyDown(event) {
    const {
      children, intl, onDeselect, value,
    } = this.props;

    const { keyCode, target } = event;

    if (keyCode === KeyCode.KEY_SPACE && target !== this.input) {
      event.preventDefault();
      this.openDropdown(event);
    } else if (keyCode === KeyCode.KEY_UP || keyCode === KeyCode.KEY_DOWN) {
      event.preventDefault();
      this.openDropdown(event);
    } else if (keyCode === KeyCode.KEY_BACK_SPACE && !this.state.searchValue && value.length > 0) {
      const lastOptionValue = value[value.length - 1];
      const lastOption = MenuUtil.findByValue(children, lastOptionValue);
      const lastOptionDisplay = lastOption ? lastOption.props.display : lastOptionValue;

      if (this.visuallyHiddenComponent && this.visuallyHiddenComponent.current) {
        this.visuallyHiddenComponent.current.innerText = intl.formatMessage({ id: 'Terra.form.select.unselectedText' }, { text: lastOptionDisplay });
      }

      if (onDeselect) {
        onDeselect(lastOptionValue);
      }
    } else if (keyCode === KeyCode.KEY_ESCAPE) {
      this.closeDropdown();

handleMonthKeyDown(event) {
    const displayFormat = DateInputUtil.computedDisplayFormat(this.props.displayFormat, this.props.intl.locale);

    if (event.keyCode === KeyCode.KEY_BACK_SPACE || event.keyCode === KeyCode.KEY_DELETE) {
      this.handleValueChange(event, DateInputUtil.inputType.MONTH, '');

      if (displayFormat === 'day-month-year' && event.target.value === '') {
        this.focusDay(event);
      }
    }

    if (event.keyCode === KeyCode.KEY_SPACE || event.keyCode === KeyCode.KEY_UP || event.keyCode === KeyCode.KEY_DOWN) {
      this.setState({ isPlaceholderColored: false });
    }
  }

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);
      }
    });
  }

handleKeyDown(event) {
    const {
      children, intl, onDeselect, value,
    } = this.props;

    const { keyCode, target } = event;

    if (keyCode === KeyCode.KEY_SPACE && target !== this.input) {
      event.preventDefault();
      this.openDropdown(event);
    } else if (keyCode === KeyCode.KEY_UP || keyCode === KeyCode.KEY_DOWN) {
      event.preventDefault();
      this.openDropdown(event);
    } else if (keyCode === KeyCode.KEY_BACK_SPACE && !this.state.searchValue && value.length > 0) {
      const lastOptionValue = value[value.length - 1];
      const lastOption = MenuUtil.findByValue(children, lastOptionValue);
      const lastOptionDisplay = lastOption ? lastOption.props.display : lastOptionValue;

      if (this.visuallyHiddenComponent && this.visuallyHiddenComponent.current) {
        this.visuallyHiddenComponent.current.innerText = intl.formatMessage({ id: 'Terra.form.select.unselectedText' }, { text: lastOptionDisplay });
      }

      if (onDeselect) {
        onDeselect(lastOptionValue);
      }
    } else if (keyCode === KeyCode.KEY_ESCAPE) {
      this.closeDropdown();