import { i18n } from '@osd/i18n' ; import { findLast , cloneDeep , template , escape } from 'lodash' ; import { OSD_FIELD_TYPES } from '../../osd_field_types/types' ; import { FieldFormat } from '../field_format' ; import { HtmlContextTypeConvert , FIELD_FORMAT_IDS } from '../types' ; import { asPrettyString } from '../utils' ; import { DEFAULT_CONVERTER_COLOR } from '../constants/color_default' ; const convertTemplate = template ( '<span style="<%- style %>"><%- val %></span>' ) ; export class ColorFormat extends FieldFormat { static id = FIELD_FORMAT_IDS . COLOR ; static title = i18n . translate ( 'data.fieldFormats.color.title' , { defaultMessage : 'Color' , } ) ; static fieldType = [ OSD_FIELD_TYPES . NUMBER , OSD_FIELD_TYPES . STRING ] ; getParamDefaults ( ) { return { fieldType : null , colors : [ cloneDeep ( DEFAULT_CONVERTER_COLOR ) ] , } ; } findColorRuleForVal ( val ) { switch ( this . param ( 'fieldType' ) ) { case 'string' : return findLast ( this . param ( 'colors' ) , ( colorParam ) => { return new RegExp ( colorParam . regex ) . test ( val ) ; } ) ; case 'number' : return findLast ( this . param ( 'colors' ) , ( { range } ) => { if ( ! range ) return ; const [ start , end ] = range . split ( ':' ) ; return val >= Number ( start ) && val <= Number ( end ) ; } ) ; default : return null ; } } htmlConvert : HtmlContextTypeConvert = ( val ) => { const color = this . findColorRuleForVal ( val ) as typeof DEFAULT_CONVERTER_COLOR ; if ( ! color ) return escape ( asPrettyString ( val ) ) ; let style = '' ; if ( color . text ) style += `color: ${ color . text };` ; if ( color . background ) style += `background-color: ${ color . background };` ; return convertTemplate ( { val , style } ) ; } ; }