import { isBoolean , isNumber , isObject } from 'lodash' ; import React from 'react' ; import { euiStyled } from '../../../../../../../src/plugins/kibana_react/common' ; import { NOT_AVAILABLE_LABEL } from '../../../../common/i18n' ; const EmptyValue = euiStyled . span `
  color: ${ ( { theme } ) => theme . eui . euiColorMediumShade };
  text-align: left;
` ; export function FormattedKey ( { k , value , } ) { if ( value == null ) { return < EmptyValue > { k } < /EmptyValue>; } return < React . Fragment > { k } < /React.Fragment>; } export function FormattedValue ( { value } ) { if ( isObject ( value ) ) { return < pre > { JSON . stringify ( value , null , 4 ) } < /pre>; } else if ( isBoolean ( value ) || isNumber ( value ) ) { return < React . Fragment > { String ( value ) } < /React.Fragment>; } else if ( ! value ) { return < EmptyValue > { NOT_AVAILABLE_LABEL } < /EmptyValue>; } return < React . Fragment > { value } < /React.Fragment>; }