1import { FieldColorModeId, FieldConfigProperty, PanelPlugin } from '@grafana/data'; 2import { StateTimelinePanel } from './StateTimelinePanel'; 3import { TimelineOptions, TimelineFieldConfig, defaultPanelOptions, defaultTimelineFieldConfig } from './types'; 4import { VisibilityMode } from '@grafana/schema'; 5import { commonOptionsBuilder } from '@grafana/ui'; 6import { timelinePanelChangedHandler } from './migrations'; 7import { StatTimelineSuggestionsSupplier } from './suggestions'; 8 9export const plugin = new PanelPlugin<TimelineOptions, TimelineFieldConfig>(StateTimelinePanel) 10 .setPanelChangeHandler(timelinePanelChangedHandler) 11 .useFieldConfig({ 12 standardOptions: { 13 [FieldConfigProperty.Color]: { 14 settings: { 15 byValueSupport: true, 16 }, 17 defaultValue: { 18 mode: FieldColorModeId.ContinuousGrYlRd, 19 }, 20 }, 21 }, 22 useCustomConfig: (builder) => { 23 builder 24 .addSliderInput({ 25 path: 'lineWidth', 26 name: 'Line width', 27 defaultValue: defaultTimelineFieldConfig.lineWidth, 28 settings: { 29 min: 0, 30 max: 10, 31 step: 1, 32 }, 33 }) 34 .addSliderInput({ 35 path: 'fillOpacity', 36 name: 'Fill opacity', 37 defaultValue: defaultTimelineFieldConfig.fillOpacity, 38 settings: { 39 min: 0, 40 max: 100, 41 step: 1, 42 }, 43 }); 44 }, 45 }) 46 .setPanelOptions((builder) => { 47 builder 48 .addBooleanSwitch({ 49 path: 'mergeValues', 50 name: 'Merge equal consecutive values', 51 defaultValue: defaultPanelOptions.mergeValues, 52 }) 53 .addRadio({ 54 path: 'showValue', 55 name: 'Show values', 56 settings: { 57 options: [ 58 { value: VisibilityMode.Auto, label: 'Auto' }, 59 { value: VisibilityMode.Always, label: 'Always' }, 60 { value: VisibilityMode.Never, label: 'Never' }, 61 ], 62 }, 63 defaultValue: defaultPanelOptions.showValue, 64 }) 65 .addRadio({ 66 path: 'alignValue', 67 name: 'Align values', 68 settings: { 69 options: [ 70 { value: 'left', label: 'Left' }, 71 { value: 'center', label: 'Center' }, 72 { value: 'right', label: 'Right' }, 73 ], 74 }, 75 defaultValue: defaultPanelOptions.alignValue, 76 }) 77 .addSliderInput({ 78 path: 'rowHeight', 79 name: 'Row height', 80 settings: { 81 min: 0, 82 max: 1, 83 step: 0.01, 84 }, 85 defaultValue: defaultPanelOptions.rowHeight, 86 }); 87 88 commonOptionsBuilder.addLegendOptions(builder, false); 89 commonOptionsBuilder.addTooltipOptions(builder, true); 90 }) 91 .setSuggestionsSupplier(new StatTimelineSuggestionsSupplier()); 92