init empty panel

.gitignore

@@ -0,0 +1,30 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+node_modules/
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+dist/
+artifacts/
+work/
+ci/
+e2e-results/
+
+# Editors
+.idea

.prettierrc.js

@@ -0,0 +1,3 @@
+module.exports = {
+  ...require('./node_modules/@grafana/toolkit/src/config/prettier.plugin.config.json'),
+};

jest.config.js

@@ -0,0 +1,8 @@
+// This file is needed because it is used by vscode and other tools that
+// call `jest` directly.  However, unless you are doing anything special
+// do not edit this file
+
+const standard = require('@grafana/toolkit/src/config/jest.plugin.config');
+
+// This process will use the same config that `yarn test` is using
+module.exports = standard.jestConfig();

package.json

@@ -0,0 +1,28 @@
+{
+  "name": "grafana-data-exporter-panel",
+  "version": "1.0.0",
+  "description": "Data Exporter Plugin",
+  "scripts": {
+    "build": "grafana-toolkit plugin:build",
+    "test": "grafana-toolkit plugin:test",
+    "dev": "grafana-toolkit plugin:dev",
+    "watch": "grafana-toolkit plugin:dev --watch",
+    "sign": "grafana-toolkit plugin:sign",
+    "start": "yarn watch",
+    "lint": "yarn prettier --write ."
+  },
+  "author": "CorpGlory Inc.",
+  "license": "Apache-2.0",
+  "devDependencies": {
+    "@grafana/data": "latest",
+    "@grafana/toolkit": "latest",
+    "@grafana/ui": "latest",
+    "@types/grafana": "github:CorpGlory/types-grafana#8c55ade5212f089748f6955f73e8f753fff9f278",
+    "emotion": "10.0.27",
+    "lodash": "^4.17.21",
+    "prettier": "^2.6.2"
+  },
+  "engines": {
+    "node": ">=14"
+  }
+}

src/assets/logo.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 416.63 416.63"><defs><style>.cls-1{fill:#3c3c3c;}.cls-2{fill:#5793f2;}</style></defs><g id="Layer_1" data-name="Layer 1"><rect class="cls-1" width="416.63" height="416.63" rx="85.04"/></g><g id="Layer_2" data-name="Layer 2"><circle class="cls-2" cx="209.33" cy="209.78" r="170.03"/></g><g id="Layer_3" data-name="Layer 3"><path class="cls-1" d="M7142.75,7298.16a113.61,113.61,0,0,1-56.3-98.64h-28a141.47,141.47,0,0,1,70.94-122.71l14.18,24.59a114.24,114.24,0,0,1,113.25.13l14.2-24.47a141.46,141.46,0,0,1,70.51,122.46h-27.81a113.58,113.58,0,0,1-56.53,98.77l13.77,23.8a142,142,0,0,1-141.82,0Q7135.95,7310.12,7142.75,7298.16Z" transform="translate(-6990.48 -6990.3)"/><path class="cls-2" d="M7131.48,7199.58a68.13,68.13,0,0,1,34.3-58.89l-8.41-14.54a84.94,84.94,0,0,1,85.06,0l-8.51,14.77a68.56,68.56,0,0,1,34,58.85l17,0a84.87,84.87,0,0,1-42.41,73.44l-8.36-14.44a68.2,68.2,0,0,1-68.3.33l-8.22,14.31a85.2,85.2,0,0,1-42.63-73.67Z" transform="translate(-6990.48 -6990.3)"/><circle class="cls-1" cx="209.33" cy="209.78" r="29.79"/><path class="cls-2" d="M7249.92,7113.2a101.21,101.21,0,0,1,50.54,86.34h-8.61a92.29,92.29,0,0,0-45.76-79.12C7247.37,7118,7248.65,7115.61,7249.92,7113.2Z" transform="translate(-6990.48 -6990.3)"/><path class="cls-2" d="M7250.65,7286.9a101.92,101.92,0,0,1-101.52.44l4.07-6.88a90.67,90.67,0,0,0,93.46-.12Z" transform="translate(-6990.48 -6990.3)"/><path class="cls-2" d="M7099.25,7199.49a103.54,103.54,0,0,1,50.69-87.21l4.25,7.75a90.9,90.9,0,0,0-45.81,79.51Z" transform="translate(-6990.48 -6990.3)"/><path class="cls-2" d="M7100,7155.74l-10.3-20,22.43-1.3-3.79,6.64-4.09-2.33-4.55,8,4.09,2.33Z" transform="translate(-6990.48 -6990.3)"/><path class="cls-2" d="M7211,7309l-11.47,18.77-11.22-18.91,7.08.05,0,4.7,8.51.05,0-4.71Z" transform="translate(-6990.48 -6990.3)"/><path class="cls-2" d="M7287.65,7135.25l22.55,1q-4.89,10.17-9.79,20.33l-4-6.66,4-2.42q-2.39-4-4.78-8l-4,2.41Z" transform="translate(-6990.48 -6990.3)"/></g></svg>

src/components/Panel.tsx

@@ -0,0 +1,17 @@
+import { PanelOptions } from '../types';
+
+import { PanelProps } from '@grafana/data';
+
+import React from 'react';
+import * as _ from 'lodash';
+
+interface Props extends PanelProps<PanelOptions> { }
+
+export function Panel({ options, data, width, height, timeRange, onChangeTimeRange }: Props) {
+  console.log('panel',options, data);
+  return (
+    <div>
+      test
+    </div>
+  );
+}

src/module.ts

@@ -0,0 +1,33 @@
+import { PanelOptions } from './types';
+
+import { Panel } from './components/Panel';
+
+import { PanelPlugin } from '@grafana/data';
+
+export const plugin = new PanelPlugin<PanelOptions>(Panel).setPanelOptions((builder) => {
+  return (
+    builder
+      .addRadio({
+        path: 'visualizationType',
+        name: 'Pod',
+        category: ['Visualization'],
+        defaultValue: '1',
+        settings: {
+          options: [
+            {
+              label: 'Gauge',
+              value: '1',
+            },
+            {
+              label: 'Line',
+              value: '2',
+            },
+            {
+              label: 'Bar',
+              value: '3',
+            },
+          ],
+        },
+      })
+  )
+});

src/plugin.json

@@ -0,0 +1,38 @@
+{
+  "$schema": "https://raw.githubusercontent.com/grafana/grafana/master/docs/sources/developers/plugins/plugin.schema.json",
+  "type": "panel",
+  "name": "Data Exporter",
+  "id": "corpglory-dataexporter-panel",
+  "info": {
+    "description": "Panel for exporting metrics from Grafana dashboards.",
+    "author": {
+      "name": "CorpGlory Inc.",
+      "url": "https://corpglory.com"
+    },
+    "keywords": [],
+    "logos": {
+      "small": "assets/logo.svg",
+      "large": "assets/logo.svg"
+    },
+    "links": [
+      {
+        "name": "Website",
+        "url": "https://chartwerk.io/"
+      },
+      {
+        "name": "License",
+        "url": "https://gitlab.com/chartwerk/grafana-chartwerk-panel/blob/main/LICENSE"
+      },
+      {
+        "name": "Gitlab",
+        "url": "https://gitlab.com/chartwerk/grafana-chartwerk-panel/"
+      }
+    ],
+    "version": "%VERSION%",
+    "updated": "%TODAY%"
+  },
+  "dependencies": {
+    "grafanaDependency": ">=9.0.0",
+    "plugins": []
+  }
+}

src/types.ts

@@ -0,0 +1,3 @@
+export interface PanelOptions {
+  visualizationType: string;
+}

tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "extends": "./node_modules/@grafana/toolkit/src/config/tsconfig.plugin.json",
+  "include": [
+    "src",
+    "types"
+  ],
+  "compilerOptions": {
+    "rootDir": "./src",
+    "baseUrl": "./src",
+    "typeRoots": [
+      "./node_modules/@types"
+    ]
+  }
+}