IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Canvas: Add ability to customize what standard element editors show up for all element types (#75935)

Browse Source 
Co-authored-by: Adela Almasan <adela.almasan@grafana.com>
This commit is contained in:
Nathan Marrs 2023-10-05 21:58:35 +02:00 committed by GitHub
parent a66760f9f2
commit bd5d67ed28
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 34 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
public/app/features/canvas/element.ts
View File

@ -7,7 +7,7 @@ import { config } from 'app/core/config';
import { DimensionContext } from '../dimensions';
import { BackgroundConfig, Constraint, LineConfig, Placement } from './types';
import { BackgroundConfig, Constraint, LineConfig, Placement, StandardEditorConfig } from './types';
/**
* This gets saved in panel json
@ -84,6 +84,9 @@ export interface CanvasElementItem<TConfig = any, TData = any> extends RegistryI
/** If item has an edit mode */
hasEditMode?: boolean;
/** Optional config to customize what standard element editor options are available for the item */
standardEditorConfig?: StandardEditorConfig;
}
export const defaultBgColor = '#D9D9D9';

4
public/app/features/canvas/elements/button.tsx
View File

@ -73,6 +73,10 @@ export const buttonItem: CanvasElementItem<ButtonConfig, ButtonData> = {
description: 'Button',
state: PluginState.alpha,
standardEditorConfig: {
background: false,
},
display: ButtonDisplay,
defaultSize: {

6
public/app/features/canvas/types.ts
View File

@ -60,6 +60,12 @@ export interface EllipseData extends TextData {
width?: number;
}
export interface StandardEditorConfig {
layout?: boolean;
background?: boolean;
border?: boolean;
}
export {
Placement,
Constraint,

30
public/app/plugins/panel/canvas/editor/element/elementEditor.tsx
View File

@ -96,17 +96,27 @@ export function getElementEditor(opts: CanvasEditorOptions): NestedPanelOptions<
layer.registerOptionsUI(builder, ctx);
}
builder.addCustomEditor({
category: ['Layout'],
id: 'content',
path: '__', // not used
name: 'Quick placement',
editor: PlacementEditor,
settings: opts,
});
const shouldAddLayoutEditor = opts.element.item.standardEditorConfig?.layout ?? true;
if (shouldAddLayoutEditor) {
builder.addCustomEditor({
category: ['Layout'],
id: 'content',
path: '__', // not used
name: 'Quick placement',
editor: PlacementEditor,
settings: opts,
});
}
optionBuilder.addBackground(builder, ctx);
optionBuilder.addBorder(builder, ctx);
const shouldAddBackgroundEditor = opts.element.item.standardEditorConfig?.background ?? true;
if (shouldAddBackgroundEditor) {
optionBuilder.addBackground(builder, ctx);
}
const shouldAddBorderEditor = opts.element.item.standardEditorConfig?.border ?? true;
if (shouldAddBorderEditor) {
optionBuilder.addBorder(builder, ctx);
}
},
};
}