breaking up grafana into multiple packages poc

packages/grafana-ui/package.json

 {
-  "name": "grafana-ui",
+  "name": "@grafana/ui",
   "version": "1.0.0",
   "description": "",
-  "main": "index.ts",
+  "main": "dist/index.js",
+  "types": "dist/types",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "tsc --noEmit"
   },
   "author": "",
-  "license": "ISC"
+  "license": "ISC",
+  "devDependencies": {
+    "typescript": "^3.2.2"
+  }
 }

packages/grafana-ui/index.ts → packages/grafana-ui/src/index.ts

+export { Other } from './other';
+import { TimeSeries } from '../types';
+
 export class Google {
+  data: TimeSeries;
+
   hello() {
     return 'hello';
   }
 }
 
 class Singleton {
-  constructor(private state) {}
+  constructor(private state: string) {}
 
   hello() {
     return this.state;

packages/grafana-ui/src/other.ts

+export class Other {
+  static hello() {
+    return "hello from other";
+  }
+}

packages/grafana-ui/tsconfig.json

+{
+  "include": [
+    "src/**/*.ts",
+    "src/**/*.tsx"
+  ],
+  "exclude": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "tsc"
+  },
+  "compilerOptions": {
+    "moduleResolution": "node",
+    "target": "es5",
+    "lib": ["es6", "dom"],
+    "jsx": "react",
+    "module": "esnext",
+    "outDir": "dist",
+    "declaration": false,
+    "allowSyntheticDefaultImports": true,
+    "esModuleInterop": true,
+    "forceConsistentCasingInFileNames": true,
+    "importHelpers": true,
+    "noEmitHelpers": true,
+    "removeComments": false,
+    "inlineSourceMap": false,
+    "sourceMap": true,
+    "noEmitOnError": false,
+    "emitDecoratorMetadata": false,
+    "experimentalDecorators": true,
+    "declaration": true,
+    "declarationDir": "./dist/types",
+    "noImplicitAny": true,
+    "strictNullChecks": true
+  }
+}

packages/grafana-ui/types/index.ts

+
+export interface TimeSeries {
+  name: string;
+}

public/app/features/dashboard/dashgrid/VisualizationTab.tsx

@@ -15,6 +15,7 @@ import { PanelOptionSection } from './PanelOptionSection';
 import { PanelModel } from '../panel_model';
 import { DashboardModel } from '../dashboard_model';
 import { PanelPlugin } from 'app/types/plugins';
+import { TimeSeries } from '@grafana/ui/types';
 
 interface Props {
   panel: PanelModel;

public/app/features/plugins/plugin_loader.ts

@@ -26,7 +26,7 @@ import * as ticks from 'app/core/utils/ticks';
 import impressionSrv from 'app/core/services/impression_srv';
 import builtInPlugins from './built_in_plugins';
 import * as d3 from 'd3';
-import * as grafanaUI from 'grafana-ui';
+import * as grafanaUI from '@grafana/ui';
 
 // rxjs
 import { Observable } from 'rxjs/Observable';

yarn.lock

@@ -14544,6 +14544,11 @@ typescript@^3.0.3:
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.1.1.tgz#3362ba9dd1e482ebb2355b02dfe8bcd19a2c7c96"
   integrity sha512-Veu0w4dTc/9wlWNf2jeRInNodKlcdLgemvPsrNpfu5Pq39sgfFjvIIgTsvUHCoLBnMhPoUA+tFxsXjU6VexVRQ==
 
+typescript@^3.2.2:
+  version "3.2.2"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.2.2.tgz#fe8101c46aa123f8353523ebdcf5730c2ae493e5"
+  integrity sha512-VCj5UiSyHBjwfYacmDuc/NOk4QQixbE+Wn7MFJuS0nRuPQbof132Pw4u53dm264O8LPc2MVsc7RJNml5szurkg==
+
 ua-parser-js@^0.7.18:
   version "0.7.19"
   resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.19.tgz#94151be4c0a7fb1d001af7022fdaca4642659e4b"