Improves readme, removes blueprint from bundle package, some minor changes.

README.md

@@ -52,7 +52,7 @@ const visualizations = globalVisualizationFactory.getVisualizations(
 	/* preferred visualization id */ undefined
 );
 // `visualizations.bestVisualization` is the visualization that is best suited to visualize the data.
-// `visualiztaions.allVisualizations` contains all other available visualizations than can visualize the data.
+// `visualiztaions.allVisualizations` contains all suitable visualizations.
 ```
 
 If you use react, you can use the `VisualizationView` component to render a visualization:

playground/webpack.config.ts

@@ -64,7 +64,6 @@ module.exports = {
 
 		plugins.push(
 			new MonacoWebpackPlugin({
-				// Add more languages here once webworker issues are solved.
 				languages: ["typescript", "json"],
 			})
 		);

simple-demo/webpack.config.ts

@@ -64,7 +64,6 @@ module.exports = {
 
 		plugins.push(
 			new MonacoWebpackPlugin({
-				// Add more languages here once webworker issues are solved.
 				languages: ["typescript", "json"],
 			})
 		);

visualization-bundle/README.md

@@ -21,6 +21,31 @@ Don't forget to import the styles in your scss file:
 @import "~@hediet/visualization-bundle/style.scss";
 ```
 
+You will need to configure webpack
+
+-   to compile scss files:
+
+```js
+{ test: /\.scss$/, loader: "style-loader!css-loader!sass-loader" },
+```
+
+-   to compile less files:
+
+```js
+{ test: /\.less$/, loaders: ["style-loader", "css-loader", "less-loader"] }
+```
+
+-   to register monaco workers
+
+```js
+plugins: [
+	// ...
+	new MonacoWebpackPlugin({
+		languages: ["typescript", "json"],
+	}),
+];
+```
+
 See docs of `@hediet/visualization-core` for how to find and render visualizations!
 
 ## Supported Visualizations
@@ -43,3 +68,7 @@ See docs of `@hediet/visualization-core` for how to find and render visualizatio
 -   Graphviz Dot Visualizer
 -   Vis.js Visualizer
 -   Monaco Editor Source Code Visualizer
+
+```
+
+```

visualization-bundle/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@hediet/visualization-bundle",
 	"description": "Bundles several visualizers",
-	"version": "0.1.0",
+	"version": "0.1.2",
 	"license": "MIT",
 	"scripts": {
 		"dev": "tsc --watch",
@@ -14,7 +14,8 @@
 	},
 	"files": [
 		"dist",
-		"src"
+		"src",
+		"style.scss"
 	],
 	"main": "./dist/index.js",
 	"types": "./dist/index.d.ts",

visualization-bundle/src/visualizers/ast-visualizer/index.tsx

@@ -67,6 +67,7 @@ export const sAstTreeNode: Serializer<AstTreeNode> = sLazy(() =>
 
 export const sAstTree = sOpenObject({
 	kind: sOpenObject({
+		ast: sLiteral(true),
 		tree: sLiteral(true),
 		text: sLiteral(true),
 	}),

visualization-bundle/src/visualizers/grid-visualizer/GridVisualizer.tsx

@@ -1,7 +1,6 @@
 import * as React from "react";
 import { observer } from "mobx-react";
 import { computed, action, observable } from "mobx";
-import { Icon } from "@blueprintjs/core";
 import { sGrid } from ".";
 
 export class DecoratedGridComponent extends React.Component<{
@@ -72,15 +71,7 @@ export class DecoratedGridComponent extends React.Component<{
 				r.columns.push({
 					id: m.id,
 					kind: "empty",
-					content: (
-						<Cell>
-							<Icon
-								icon="arrow-up"
-								color="var(--vscode-editor-foreground)"
-							/>
-							{m.label || m.id}
-						</Cell>
-					),
+					content: <Cell>{m.label || m.id}</Cell>,
 				});
 			}
 		}

visualization-core/README.md

@@ -35,7 +35,7 @@ const visualizations = globalVisualizationFactory.getVisualizations(
 	/* preferred visualization id */ undefined
 );
 // `visualizations.bestVisualization` is the visualization that is best suited to visualize the data.
-// `visualiztaions.allVisualizations` contains all other available visualizations than can visualize the data.
+// `visualiztaions.allVisualizations` contains all suitable visualizations.
 ```
 
 If you use react, you can use the `VisualizationView` component to render a visualization: