HistogramPanel: Generate .cue model (#53826)

* Generate .cue model for histogram panel

* Docs

* Refactor PR

pkg/codegen/pluggen.go

@@ -38,7 +38,6 @@ var importMap = map[string]string{
 // to rely on the TypeScript auto-generated by cuetsy for that particular file.
 var skipPaths = []string{
 	"public/app/plugins/panel/canvas/models.cue",
-	"public/app/plugins/panel/histogram/models.cue",
 	"public/app/plugins/panel/heatmap/models.cue",
 	"public/app/plugins/panel/heatmap-old/models.cue",
 	"public/app/plugins/panel/candlestick/models.cue",

public/app/plugins/panel/histogram/models.cue

@@ -1,4 +1,4 @@
-// Copyright 2021 Grafana Labs
+// Copyright 2022 Grafana Labs
 //
 // Licensed under the Apache License, Version 2.0 (the "License");
 // you may not use this file except in compliance with the License.
@@ -28,12 +28,24 @@ Panel: thema.#Lineage & {
 					PanelOptions: {
 						ui.OptionsWithLegend
 						ui.OptionsWithTooltip
-						bucketSize?:  int
+						//Size of each bucket
-						bucketOffset: int | *0
+						bucketSize?:  int32
+						//Offset buckets by this amount 
+						bucketOffset?: int32 | *0
+						//Combines multiple series into a single histogram
 						combine?:     bool
 					} @cuetsy(kind="interface")
 
-					PanelFieldConfig: ui.GraphFieldConfig & {} @cuetsy(kind="interface")
+					PanelFieldConfig: {
+						ui.HideableFieldConfig
+						// Controls line width of the bars.
+						lineWidth?:    uint32 & <= 10 | *1
+						// Controls the fill opacity of the bars.
+						fillOpacity?:  uint32 & <= 100 | *80
+						// Set the mode of the gradient fill. Fill gradient is based on the line color. To change the color, use the standard color scheme field option.
+            // Gradient appearance is influenced by the Fill opacity setting.
+						gradientMode?: ui.GraphGradientMode | *"none"
+					} @cuetsy(kind="interface")
 				},
 			]
 		},

public/app/plugins/panel/histogram/models.gen.ts

@@ -1,54 +1,32 @@
 //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-// NOTE: This file will be auto generated from models.cue
+// This file is autogenerated. DO NOT EDIT.
-// It is currenty hand written but will serve as the target for cuetsy
+//
+// To regenerate, run "make gen-cue" from the repository root.
 //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 
-import {
+import * as ui from '@grafana/schema';
-  LegendDisplayMode,
-  OptionsWithLegend,
-  OptionsWithTooltip,
-  TooltipDisplayMode,
-  GraphGradientMode,
-  HideableFieldConfig,
-  SortOrder,
-} from '@grafana/schema';
 
-export const modelVersion = Object.freeze([1, 0]);
+export const modelVersion = Object.freeze([0, 0]);
 
-export interface PanelOptions extends OptionsWithLegend, OptionsWithTooltip {
+
-  bucketSize?: number;
+export interface PanelOptions extends ui.OptionsWithLegend, ui.OptionsWithTooltip {
   bucketOffset?: number;
+  bucketSize?: number;
   combine?: boolean;
 }
 
-export const defaultPanelOptions: PanelOptions = {
+export const defaultPanelOptions: Partial<PanelOptions> = {
   bucketOffset: 0,
-  legend: {
-    displayMode: LegendDisplayMode.List,
-    showLegend: true,
-    placement: 'bottom',
-    calcs: [],
-  },
-  tooltip: {
-    mode: TooltipDisplayMode.Multi,
-    sort: SortOrder.None,
-  },
 };
 
-/**
+export interface PanelFieldConfig extends ui.HideableFieldConfig {
- * @alpha
+  fillOpacity?: number;
- */
+  gradientMode?: ui.GraphGradientMode;
-export interface PanelFieldConfig extends HideableFieldConfig {
+  lineWidth?: number;
-  lineWidth?: number; // 0
-  fillOpacity?: number; // 100
-  gradientMode?: GraphGradientMode;
 }
 
-/**
+export const defaultPanelFieldConfig: Partial<PanelFieldConfig> = {
- * @alpha
- */
-export const defaultPanelFieldConfig: PanelFieldConfig = {
-  lineWidth: 1,
   fillOpacity: 80,
-  //gradientMode: GraphGradientMode.None,
+  gradientMode: ui.GraphGradientMode.None,
+  lineWidth: 1,
 };