Menu

Important: This documentation is about an older version. It's relevant only to the release noted, many of the features and functions have been updated or replaced. Please view the current version.

Enterprise Open source

FieldConfigEditorConfig interface

Signature

typescript
export interface FieldConfigEditorConfig<TOptions, TSettings = any, TValue = any> 

Import

typescript
import { FieldConfigEditorConfig } from '@grafana/data';

Properties

PropertyTypeDescription
categorystring[]Array of strings representing category of the field config property. First element in the array will make option render as collapsible section.
defaultValueTValue
descriptionstringDescription of the field config property. Will be displayed in the UI as form element description.
namestringName of the field config property. Will be displayed in the UI as form element label.
path(keyof TOptions & string) | stringPath of the field config property to control.
settingsTSettingsCustom settings of the editor.
shouldApply(field: Field) => booleanFunction that allows specifying whether or not this field config should apply to a given field.
showIf(currentConfig: TOptions) => booleanFunction that enables configuration of when field config property editor should be shown based on current panel field config.

category property

Array of strings representing category of the field config property. First element in the array will make option render as collapsible section.

Signature

typescript
category?: string[];

defaultValue property

Signature

typescript
defaultValue?: TValue;

description property

Description of the field config property. Will be displayed in the UI as form element description.

Signature

typescript
description?: string;

name property

Name of the field config property. Will be displayed in the UI as form element label.

Signature

typescript
name: string;

path property

Path of the field config property to control.

Signature

typescript
path: (keyof TOptions & string) | string;

Example

Given field config object of a type:

ts
interface CustomFieldConfig {
  a: {
    b: string;
  }
}

path can be either ‘a’ or ‘a.b’.

settings property

Custom settings of the editor.

Signature

typescript
settings?: TSettings;

shouldApply property

Function that allows specifying whether or not this field config should apply to a given field.

Signature

typescript
shouldApply?: (field: Field) => boolean;

showIf property

Function that enables configuration of when field config property editor should be shown based on current panel field config.

Signature

typescript
showIf?: (currentConfig: TOptions) => boolean;