import React__default, { useMemo } from 'react';

function LabelValue({
  label,
  value,
  emptyValue,
  labelColor,
  valueColor,
  className,
  fontSize,
  noWrap,
  valueFontWeight,
  valueFontSize,
  noColon
}) {
  const defaultValueColor = useMemo(() => !!value ? valueColor : 'var(--text-light)', [value, valueColor]);
  return /*#__PURE__*/React__default.createElement("div", {
    className: `lm-c-label-value-layout ${className}`,
    style: {
      fontSize
    }
  }, /*#__PURE__*/React__default.createElement("span", {
    style: {
      color: labelColor
    }
  }, label, noColon ? '' : '：'), /*#__PURE__*/React__default.createElement("span", {
    title: typeof value === 'string' || typeof value === 'number' ? value : null,
    className: `${noWrap ? 'no-wrap' : ''}`,
    style: {
      color: defaultValueColor,
      fontWeight: valueFontWeight,
      fontSize: valueFontSize
    }
  }, value || emptyValue || '-'));
}
LabelValue.defaultProps = {
  value: '',
  labelColor: 'var(--color)',
  emptyValue: '-',
  valueColor: 'var(--color-dark)',
  fontSize: 'var(--fs-small)',
  valueFontSize: 'var(--fs-small)',
  noWrap: false,
  className: '',
  valueFontWeight: 'normal'
};
var LabelValue$1 = /*#__PURE__*/React__default.memo(LabelValue);

export { LabelValue$1 as default };
//# sourceMappingURL=index.js.map
