import { ComponentClass, ComponentType } from 'react'; import { FieldConfigOptionsRegistry } from '../field/FieldConfigOptionsRegistry'; import { StandardEditorContext } from '../field/standardFieldConfigEditorRegistry'; import { PanelModel } from '../types/dashboard'; import { FieldConfigProperty, FieldConfigSource } from '../types/fieldOverrides'; import { PanelPluginMeta, PanelProps, PanelEditorProps, PanelMigrationHandler, PanelTypeChangedHandler, PanelPluginDataSupport } from '../types/panel'; import { GrafanaPlugin } from '../types/plugin'; import { PanelPluginVisualizationSuggestion, VisualizationSuggestionsSupplierDeprecated, VisualizationSuggestionsSupplier, VisualizationSuggestionsBuilder } from '../types/suggestions'; import { FieldConfigEditorBuilder, PanelOptionsEditorBuilder } from '../utils/OptionsUIBuilders'; import { PanelDataSummary } from './suggestions/getPanelDataSummary'; /** @beta */ export type StandardOptionConfig = { defaultValue?: any; settings?: any; hideFromDefaults?: boolean; }; /** @beta */ export interface SetFieldConfigOptionsArgs { /** * Configuration object of the standard field config properites * * @example * ```typescript * { * standardOptions: { * [FieldConfigProperty.Decimals]: { * defaultValue: 3 * } * } * } * ``` */ standardOptions?: Partial>; /** * Array of standard field config properties that should not be available in the panel * @example * ```typescript * { * disableStandardOptions: [FieldConfigProperty.Min, FieldConfigProperty.Max, FieldConfigProperty.Unit] * } * ``` */ disableStandardOptions?: FieldConfigProperty[]; /** * Function that allows custom field config properties definition. * * @param builder * * @example * ```typescript * useCustomConfig: builder => { * builder * .addNumberInput({ * id: 'shapeBorderWidth', * name: 'Border width', * description: 'Border width of the shape', * settings: { * min: 1, * max: 5, * }, * }) * .addSelect({ * id: 'displayMode', * name: 'Display mode', * description: 'How the shape shout be rendered' * settings: { * options: [{value: 'fill', label: 'Fill' }, {value: 'transparent', label: 'Transparent }] * }, * }) * } * ``` */ useCustomConfig?: (builder: FieldConfigEditorBuilder) => void; } export type PanelOptionsSupplier = (builder: PanelOptionsEditorBuilder, context: StandardEditorContext) => void; export declare class PanelPlugin extends GrafanaPlugin { private _defaults?; private _fieldConfigDefaults; private _fieldConfigRegistry?; private _initConfigRegistry; private optionsSupplier?; private suggestionsSupplier?; panel: ComponentType> | null; editor?: ComponentClass>; onPanelMigration?: PanelMigrationHandler; shouldMigrate?: (panel: PanelModel) => boolean; onPanelTypeChanged?: PanelTypeChangedHandler; noPadding?: boolean; dataSupport: PanelPluginDataSupport; constructor(panel: ComponentType> | null); get defaults(): {}; get fieldConfigDefaults(): FieldConfigSource; /** * @deprecated setDefaults is deprecated in favor of setPanelOptions */ setDefaults(defaults: TOptions): this; get fieldConfigRegistry(): FieldConfigOptionsRegistry; /** * @deprecated setEditor is deprecated in favor of setPanelOptions */ setEditor(editor: ComponentClass>): this; setNoPadding(): this; /** * This function is called before the panel first loads if * the current version is different than the version that was saved. * * If shouldMigrate is provided, it will be called regardless of whether * the version has changed, and can explicitly opt into running the * migration handler * * This is a good place to support any changes to the options model */ setMigrationHandler(handler: PanelMigrationHandler, shouldMigrate?: (panel: PanelModel) => boolean): this; /** * This function is called when the visualization was changed. This * passes in the panel model for previous visualisation options inspection * and panel model updates. * * This is useful for supporting PanelModel API updates when changing * between Angular and React panels. */ setPanelChangeHandler(handler: PanelTypeChangedHandler): this; /** * Enables panel options editor creation * * @example * ```typescript * * import { ShapePanel } from './ShapePanel'; * * interface ShapePanelOptions {} * * export const plugin = new PanelPlugin(ShapePanel) * .setPanelOptions(builder => { * builder * .addSelect({ * id: 'shape', * name: 'Shape', * description: 'Select shape to render' * settings: { * options: [ * {value: 'circle', label: 'Circle' }, * {value: 'square', label: 'Square }, * {value: 'triangle', label: 'Triangle } * ] * }, * }) * }) * ``` * * @public **/ setPanelOptions(builder: PanelOptionsSupplier): this; /** * This is used while building the panel options editor. * * @internal */ getPanelOptionsSupplier(): PanelOptionsSupplier; /** * Tells Grafana if the plugin should subscribe to annotation and alertState results. * * @example * ```typescript * * import { ShapePanel } from './ShapePanel'; * * interface ShapePanelOptions {} * * export const plugin = new PanelPlugin(ShapePanel) * .useFieldConfig({}) * ... * ... * .setDataSupport({ * annotations: true, * alertStates: true, * }); * ``` * * @public **/ setDataSupport(support: Partial): this; /** * Allows specifying which standard field config options panel should use and defining default values * * @example * ```typescript * * import { ShapePanel } from './ShapePanel'; * * interface ShapePanelOptions {} * * // when plugin should use all standard options * export const plugin = new PanelPlugin(ShapePanel) * .useFieldConfig(); * * // when plugin should only display specific standard options * // note, that options will be displayed in the order they are provided * export const plugin = new PanelPlugin(ShapePanel) * .useFieldConfig({ * standardOptions: [FieldConfigProperty.Min, FieldConfigProperty.Max] * }); * * // when standard option's default value needs to be provided * export const plugin = new PanelPlugin(ShapePanel) * .useFieldConfig({ * standardOptions: [FieldConfigProperty.Min, FieldConfigProperty.Max], * standardOptionsDefaults: { * [FieldConfigProperty.Min]: 20, * [FieldConfigProperty.Max]: 100 * } * }); * * // when custom field config options needs to be provided * export const plugin = new PanelPlugin(ShapePanel) * .useFieldConfig({ * useCustomConfig: builder => { * builder * .addNumberInput({ * id: 'shapeBorderWidth', * name: 'Border width', * description: 'Border width of the shape', * settings: { * min: 1, * max: 5, * }, * }) * .addSelect({ * id: 'displayMode', * name: 'Display mode', * description: 'How the shape shout be rendered' * settings: { * options: [{value: 'fill', label: 'Fill' }, {value: 'transparent', label: 'Transparent }] * }, * }) * }, * }); * * ``` * * @public */ useFieldConfig(config?: SetFieldConfigOptionsArgs): this; /** * @deprecated use VisualizationSuggestionsSupplier */ setSuggestionsSupplier(supplier: VisualizationSuggestionsSupplierDeprecated): this; /** * @alpha * sets function that can return visualization examples and suggestions. */ setSuggestionsSupplier(supplier: VisualizationSuggestionsSupplier): this; /** * @alpha * get suggestions based on the PanelDataSummary */ getSuggestions(panelDataSummary: PanelDataSummary): Array> | void; /** * @deprecated use getSuggestions * we have to keep this method intact to support cloud-onboarding plugin. */ getSuggestionsSupplier(): { getSuggestionsForData: (builder: VisualizationSuggestionsBuilder) => void; }; hasPluginId(pluginId: string): boolean; }