@kineticdata/react/lib/components/common/StaticSelect.js

A React library for the Kinetic Platform

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.StaticSelect = void 0;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
var _objectSpread3 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
var _react = _interopRequireDefault(require("react"));
var _Typeahead = require("./Typeahead");
var _immutable = require("immutable");
var _react2 = require("@kineticdata/react");
var fields = [{
  name: 'label'
}, {
  name: 'value'
}];
var OPERATORS = (0, _immutable.Map)({
  equals: 'equals',
  matches: 'matches',
  startsWith: 'startsWith'
});

// Dynamically build filter function with correct operators
var buildFilter = function buildFilter(searchFields) {
  var filter = searchFields.reduce(function (filter, _ref) {
    var name = _ref.name,
      operator = _ref.operator;
    return filter[OPERATORS.get(operator, 'startsWith')](name, name);
  }, (0, _react2.defineFilter)(true, 'or')).end();
  // Build values object to pass into above filter option
  return function (options, value) {
    var values = searchFields.reduce(function (values, _ref2) {
      var name = _ref2.name;
      return (0, _objectSpread3["default"])((0, _objectSpread3["default"])({}, values), {}, (0, _defineProperty2["default"])({}, name, value));
    }, {});
    return options.filter(function (option) {
      return filter(option, values);
    });
  };
};
var searchOptions = function searchOptions(_ref3) {
  var allowNew = _ref3.allowNew,
    options = _ref3.options,
    _ref3$search = _ref3.search,
    search = _ref3$search === void 0 ? (0, _immutable.Map)() : _ref3$search,
    messages = _ref3.messages;
  return function (field, value, callback) {
    // Determine the fields config
    var searchFields = _immutable.Map.isMap(search) && search.has('fields') && !search.get('fields').isEmpty() ? search.get('fields').toJS() : fields;
    if (_immutable.List.isList(options) && (allowNew || !options.isEmpty())) {
      // Get or build the filter function
      var filter = typeof search.get('fn') === 'function' ? search.get('fn') : buildFilter(searchFields);

      // Filter the options
      var suggestions = filter(options.toJS(), value);
      var limit = search.get('limit') || 25;

      // Return the matching suggestions
      return callback({
        suggestions: suggestions.slice(0, limit),
        nextPageToken: suggestions.length > limit
      });
    } else {
      // If no options provided, return empty message
      return callback({
        error: messages.empty || 'No options found.',
        suggestions: []
      });
    }
  };
};

// Converts an option object to a single unique value. Used for comparing values
// and filtering out already selected values for multi selects.
var optionToValue = function optionToValue(_ref4) {
  var _ref4$valueProp = _ref4.valueProp,
    valueProp = _ref4$valueProp === void 0 ? 'value' : _ref4$valueProp;
  return function (option) {
    return option && option.get(valueProp) || '';
  };
};

// Converts a typed in value to an option object. Used when adding custom values
// when allowNew is true.
var valueToCustomOption = function valueToCustomOption(_ref5) {
  var _ref5$valueProp = _ref5.valueProp,
    valueProp = _ref5$valueProp === void 0 ? 'value' : _ref5$valueProp,
    allowNew = _ref5.allowNew;
  return function (value) {
    return value.length > 0 ? typeof allowNew !== 'function' || allowNew(value) ? (0, _defineProperty2["default"])({}, valueProp, value) : null : null;
  };
};
var getStatusProps = function getStatusProps(_ref7) {
  var _ref7$search = _ref7.search,
    search = _ref7$search === void 0 ? (0, _immutable.Map)() : _ref7$search,
    _ref7$messages = _ref7.messages,
    _ref7$messages2 = _ref7$messages === void 0 ? {} : _ref7$messages,
    _ref7$messages2$short = _ref7$messages2["short"],
    _short = _ref7$messages2$short === void 0 ? 'Type to find an option.' : _ref7$messages2$short,
    _ref7$messages2$empty = _ref7$messages2.empty,
    empty = _ref7$messages2$empty === void 0 ? 'No options found.' : _ref7$messages2$empty,
    _ref7$messages2$custo = _ref7$messages2.custom,
    custom = _ref7$messages2$custo === void 0 ? 'No options found. Type to enter a custom option.' : _ref7$messages2$custo,
    _ref7$messages2$pendi = _ref7$messages2.pending,
    pending = _ref7$messages2$pendi === void 0 ? 'Searching...' : _ref7$messages2$pendi,
    _ref7$messages2$more = _ref7$messages2.more,
    more = _ref7$messages2$more === void 0 ? "Too many results, first ".concat(search.get('limit') || 25, " shown. Please refine your search.") : _ref7$messages2$more;
  return function (props) {
    return {
      info: props["short"] ? _short : props.pending ? pending : null,
      warning: props.error || props.empty || props.more ? props.error ? props.error : props.more ? more : props.empty ? props.custom ? custom : empty : null : null
    };
  };
};
var actionOptions = function actionOptions(props) {
  return props.onNew ? {
    label: props.onNewLabel || 'Add New Option',
    fn: props.onNew
  } : undefined;
};
var StaticSelect = exports.StaticSelect = function StaticSelect(props) {
  return /*#__PURE__*/_react["default"].createElement(_Typeahead.Typeahead, {
    components: props.components || {},
    disabled: props.disabled,
    multiple: props.multiple,
    custom: props.allowNew && valueToCustomOption(props),
    search: searchOptions(props),
    minSearchLength: props.minSearchLength,
    getSuggestionValue: optionToValue(props),
    getStatusProps: getStatusProps(props),
    value: props.value,
    onChange: props.onChange,
    onFocus: props.onFocus,
    onBlur: props.onBlur,
    placeholder: props.placeholder,
    id: props.id,
    form: props.form,
    invalid: props.invalid,
    action: actionOptions(props)
  });
};