react-mapfilter/commonjs/ObservationDialog/Field.js

These components are designed for viewing data in Mapeo. They share a common interface:

"use strict";

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

var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");

_Object$defineProperty(exports, "__esModule", {
  value: true
});

exports.default = void 0;

var _react = _interopRequireDefault(require("react"));

var _reactIntl = require("react-intl");

var _Select = require("./Select");

var _TextField = _interopRequireDefault(require("./TextField"));

var _NumberField = _interopRequireDefault(require("./NumberField"));

var _DateField = _interopRequireDefault(require("./DateField"));

var _DateTimeField = _interopRequireDefault(require("./DateTimeField"));

var _strings = require("../utils/strings");

var _FormattedFieldname = _interopRequireDefault(require("../internal/FormattedFieldname"));

// @flow
var Field = function Field(_ref) {
  var field = _ref.field,
      value = _ref.value,
      onChange = _ref.onChange;

  var _useIntl = (0, _reactIntl.useIntl)(),
      locale = _useIntl.locale;

  var label = /*#__PURE__*/_react.default.createElement(_FormattedFieldname.default, {
    field: field
  });

  var placeholder
  /*: string*/
  = (0, _strings.getLocalizedFieldProp)(field, 'placeholder', locale);

  var handleChange = function handleChange(newValue) {
    onChange(field.key, newValue);
  };

  switch (field.type) {
    // `textarea` is for legacy support of presets that use the iD presets
    // schema. mapeo-schema uses type `text` with `appearance=multiline` for
    // text areas (the default) and `appearance=singleline` for forcing fields
    // to a single line. eslint-disable-next-line no-fallthrough
    case 'textarea': // `localized` fields are used in iD to add additional tags that append
    // `:LANG_CODE` to the property key for language translations, e.g.
    // `name:es` for a spanish translation of `name`. For now we will just show
    // the non-translated name as an editable text field (translated names will
    // appear as additional fields without the correct labels)
    // eslint-disable-next-line no-fallthrough

    case 'localized':
    case 'text':
      // In mapeo-schema, text fields default to multiline appearance.
      var isMultiline = field.appearance !== 'singleline';
      return /*#__PURE__*/_react.default.createElement(_TextField.default, {
        value: value,
        multiline: isMultiline,
        onChange: handleChange,
        label: label,
        placeholder: placeholder
      });

    case 'select_one':
      return /*#__PURE__*/_react.default.createElement(_Select.SelectOne, {
        value: value,
        options: field.options,
        onChange: handleChange,
        label: label,
        placeholder: placeholder
      });

    case 'select_multiple':
      return /*#__PURE__*/_react.default.createElement(_Select.SelectMultiple, {
        value: value,
        label: label,
        options: field.options,
        placeholder: placeholder,
        onChange: handleChange
      });

    case 'number':
      return /*#__PURE__*/_react.default.createElement(_NumberField.default, {
        value: value,
        onChange: handleChange,
        label: label,
        placeholder: placeholder
      });

    case 'date':
      return /*#__PURE__*/_react.default.createElement(_DateField.default, {
        value: value,
        onChange: handleChange,
        label: label,
        placeholder: placeholder
      });

    case 'datetime':
      return /*#__PURE__*/_react.default.createElement(_DateTimeField.default, {
        value: value,
        onChange: handleChange,
        label: label,
        placeholder: placeholder
      });

    default:
      return /*#__PURE__*/_react.default.createElement(_TextField.default, {
        value: value,
        disabled: true,
        multiline: true,
        label: label,
        placeholder: placeholder,
        handleChange: handleChange
      });
  }
};

var _default = Field;
exports.default = _default;
//# sourceMappingURL=Field.js.map