Add label type panel

app/src/lang/translations/en-US.yaml

@@ -1197,3 +1197,6 @@ panels:
     description: Render a line chart based on values over time
     date_field: Date Field
     value_field: Value Field
+  label:
+    name: Label
+    description: Show some text

app/src/panels/label/index.ts

@@ -0,0 +1,32 @@
+import { definePanel } from '../define';
+import PanelLabel from './label.vue';
+
+export default definePanel({
+	id: 'label',
+	name: '$t:panels.label.name',
+	description: '$t:panels.label.description',
+	icon: 'functions',
+	component: PanelLabel,
+	options: [
+		{
+			field: 'text',
+			name: '$t:label',
+			type: 'string',
+			meta: {
+				interface: 'input',
+				width: 'half',
+			},
+		},
+		{
+			field: 'color',
+			name: '$t:color',
+			type: 'string',
+			meta: {
+				interface: 'select-color',
+				width: 'half',
+			},
+		},
+	],
+	minWidth: 10,
+	minHeight: 6,
+});

app/src/panels/label/label.vue

@@ -0,0 +1,39 @@
+<template>
+	<div class="label type-title" :class="{ 'has-header': show_header }" :style="{ color: options.color }">
+		{{ options.text }}
+	</div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from '@vue/composition-api';
+
+export default defineComponent({
+	props: {
+		options: {
+			type: Object,
+			default: null,
+		},
+		show_header: {
+			type: Boolean,
+			default: false,
+		},
+	},
+});
+</script>
+
+<style scoped>
+.label {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	width: 100%;
+	height: 100%;
+	font-weight: 800;
+	font-size: 42px;
+	line-height: 52px;
+}
+
+.label.has-header {
+	height: calc(100% - 24px);
+}
+</style>