react-mapfilter/esm/internal/FormattedFieldname.js

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

import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
// @flow
import * as React from 'react';
import { useIntl } from 'react-intl';
import { getLocalizedFieldProp, fieldKeyToLabel } from '../utils/strings';
/*:: import type { Field } from '../types'*/

const styles = {
  groupText: {
    color: 'rgba(0, 0, 0, 0.541176)'
  }
};
/*:: type Props = {
  field: Field
}*/

/** Formats a field name nicely */
const FormattedFieldname = ({
  field
}
/*: Props*/
) => {
  const {
    locale
  } = useIntl();
  const label = getLocalizedFieldProp(field, 'label', locale) || fieldKeyToLabel(field.key);

  if (typeof label === 'string') {
    return /*#__PURE__*/React.createElement("span", {
      title: label
    }, label);
  } else {
    const groupText = _sliceInstanceProperty(label).call(label, 0, label.length - 1).join(' / ') + ' / ';
    const fieldText = label[label.length - 1];
    return /*#__PURE__*/React.createElement("span", {
      title: groupText + fieldText
    }, /*#__PURE__*/React.createElement("span", {
      style: styles.groupText
    }, groupText), /*#__PURE__*/React.createElement("span", null, fieldText));
  }
};

export default FormattedFieldname;
//# sourceMappingURL=FormattedFieldname.js.map