@talend/react-containers/lib/Typeahead/Typeahead.container.js

Provide connected components aka containers for @talend/react-cmf based on @talend/react-components.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.DISPLAY_NAME = exports.DEFAULT_STATE = void 0;
var _react = require("react");
var _immutable = _interopRequireDefault(require("immutable"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _reactCmf = require("@talend/react-cmf");
var _reactComponents = require("@talend/react-components");
var _lodash = require("lodash");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
const DISPLAY_NAME = exports.DISPLAY_NAME = 'Container(Typeahead)';
const DEFAULT_STATE = exports.DEFAULT_STATE = new _immutable.default.Map({
  docked: true,
  searching: false,
  focusedSectionIndex: null,
  focusedItemIndex: null,
  items: null
});

/**
 * The Typeahead React container
 */
class Typeahead extends _react.Component {
  constructor(props) {
    super(props);
    this.onToggle = this.onToggle.bind(this);
    this.onKeyDown = this.onKeyDown.bind(this);
    this.onBlur = this.onBlur.bind(this);
    this.onSelect = this.onSelect.bind(this);
  }
  onToggle() {
    this.props.setState(() => ({
      docked: !this.props.state.get('docked', true),
      focusedSectionIndex: null,
      focusedItemIndex: null,
      items: null
    }));
  }
  onBlur(event) {
    const {
      onBlur
    } = this.props;
    this.onToggle();
    if (onBlur) {
      onBlur(event);
    }
  }
  onSelect(event, value) {
    const {
      onSelect
    } = this.props;
    if (onSelect) {
      onSelect(event, value);
    }
  }
  onKeyDown(event, data) {
    const {
      onKeyDown
    } = this.props;
    const {
      highlightedItemIndex,
      newHighlightedItemIndex,
      highlightedSectionIndex,
      newHighlightedSectionIndex
    } = data;
    if (onKeyDown) {
      onKeyDown(event, data);
    }
    switch (event.key) {
      case 'Down':
      case 'ArrowDown':
      case 'Up':
      case 'ArrowUp':
        event.preventDefault();
        this.props.setState(() => ({
          focusedSectionIndex: newHighlightedSectionIndex,
          focusedItemIndex: newHighlightedItemIndex
        }));
        break;
      case 'Enter':
        event.preventDefault();
        if (highlightedItemIndex !== null && highlightedItemIndex !== null) {
          this.onSelect(event, {
            sectionIndex: highlightedSectionIndex,
            itemIndex: highlightedItemIndex
          });
        }
        break;
      case 'Esc':
      case 'Escape':
        event.preventDefault();
        this.onBlur(event);
        break;
      default:
    }
  }
  render() {
    const {
      items
    } = this.props;
    const props = {
      ...(0, _lodash.omit)(this.props, _reactCmf.cmfConnect.INJECTED_PROPS),
      ...this.props.state.toJS(),
      onToggle: this.onToggle,
      onBlur: this.onBlur,
      onSelect: this.onSelect,
      onKeyDown: this.onKeyDown,
      items: items && items.toJS ? items.toJS() : items
    };
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactComponents.Typeahead, {
      ...props
    });
  }
}
exports.default = Typeahead;
_defineProperty(Typeahead, "displayName", DISPLAY_NAME);
_defineProperty(Typeahead, "propTypes", {
  ..._reactCmf.componentState.propTypes,
  onSelect: _propTypes.default.func,
  onBlur: _propTypes.default.func
});
//# sourceMappingURL=Typeahead.container.js.map