Improves serializer documentation.

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

@@ -1,4 +1,4 @@
-import { sOpenObject, sLiteral, sString } from "@hediet/semantic-json";
+import { sOpenObject, sLiteral, sString, sProp } from "@hediet/semantic-json";
 import React from "react";
 import {
 	createVisualizer,
@@ -16,7 +16,7 @@ export const imageVisualizer = createVisualizer({
 		kind: sOpenObject({
 			imagePng: sLiteral(true),
 		}),
-		base64Data: sString(),
+		base64Data: sProp( sString(), { description: "The base 64 encoded PNG representation of the image" }),
 	}),
 	getVisualization: (data, self) =>
 		new ReactVisualization(self, { priority: 1000 }, () => {

visualization-bundle/src/visualizers/monaco-text-visualizer/index.tsx

@@ -3,6 +3,7 @@ import {
 	sLiteral,
 	sString,
 	sOptionalProp,
+	sProp,
 } from "@hediet/semantic-json";
 import React from "react";
 import { getLanguageId, MonacoEditor } from "./MonacoEditor";
@@ -19,7 +20,7 @@ export const monacoTextVisualizer = createVisualizer({
 		kind: sOpenObject({
 			text: sLiteral(true),
 		}),
-		text: sString(),
+		text: sProp( sString(), { description: "The text to show" }),
 		fileName: sOptionalProp(sString(), {
 			description:
 				"An optional filename that might be used for chosing a syntax highlighter",

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

@@ -25,11 +25,11 @@ export const plotlyVisualizer = createVisualizer({
 		kind: sOpenObject({
 			plotly: sLiteral(true),
 		}),
-		data: sProp(sArrayOf(sAny()), {
+		data: sProp(sArrayOf(sOpenObject()), {
 			description:
 				"Expecting Plotly.Data[] (https://github.com/DefinitelyTyped/DefinitelyTyped/blob/795ce172038dbafcb9cba030d637d733a7eea19c/types/plotly.js/index.d.ts#L1036)",
 		}),
-		layout: sOptionalProp(sAny(), {
+		layout: sOptionalProp(sOpenObject(), {
 			description:
 				"Expecting Partial<Plotly.Layout> (https://github.com/DefinitelyTyped/DefinitelyTyped/blob/795ce172038dbafcb9cba030d637d733a7eea19c/types/plotly.js/index.d.ts#L329)",
 		}),

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

@@ -1,11 +1,12 @@
 import React from "react";
-import { sOpenObject, sLiteral, sString } from "@hediet/semantic-json";
+import { sOpenObject, sLiteral, sString, sProp } from "@hediet/semantic-json";
 import { SvgViewer } from "./SvgViewer";
 import {
 	createVisualizer,
 	ReactVisualization,
 	globalVisualizationFactory,
 } from "@hediet/visualization-core";
+import { visualizationNs } from "../../consts";
 
 export const svgVisualizer = createVisualizer({
 	id: "svg",
@@ -14,8 +15,8 @@ export const svgVisualizer = createVisualizer({
 		kind: sOpenObject({
 			svg: sLiteral(true),
 		}),
-		text: sString(),
-	}),
+		text: sProp( sString(), { description: "The svg content" }),
+	}).defineAs(visualizationNs("SvgData")),
 	getVisualization: (data, self) =>
 		new ReactVisualization(self, { priority: 1500 }, () => (
 			<SvgViewer svgContent={data.text} />

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

@@ -15,6 +15,7 @@ import {
 	Serializer,
 	sOptionalProp,
 	sUnion,
+	sProp,
 } from "@hediet/semantic-json";
 import {
 	createVisualizer,
@@ -37,10 +38,10 @@ export interface Item {
 
 const sTreeNode: Serializer<TreeNode> = sLazy(() =>
 	sOpenObject({
-		children: sArrayOf(sTreeNode),
-		items: sArrayOf(
+		children: sProp(sArrayOf(sTreeNode), { description: "The children of this tree-node" }),
+		items: sProp(sArrayOf(
 			sOpenObject({
-				text: sString(),
+				text: sProp(sString(), { description: "The text to show" }),
 				emphasis: sOptionalProp(
 					sUnion(
 						[
@@ -50,12 +51,14 @@ const sTreeNode: Serializer<TreeNode> = sLazy(() =>
 							sString(),
 						],
 						{ inclusive: true }
-					)
+					), {
+					description: "The style of the text"
+				}
 				),
 			}).defineAs(visualizationNs("TreeNodeItem"))
-		),
-		segment: sOptionalProp(sString()),
-		isMarked: sOptionalProp(sBoolean()),
+		), { description: "The parts that make up the text of this item" }),
+		segment: sOptionalProp(sString(), { description: "If a node is selected, the concatenation of all segment values from root to the selected node is shown to the user." }),
+		isMarked: sOptionalProp(sBoolean(), { description: "Marked nodes are highlighted and scrolled into view on every visualization update." }),
 	}).defineAs(visualizationNs("TreeNode"))
 );
 
@@ -64,7 +67,7 @@ const sTree = sOpenObject({
 		tree: sLiteral(true),
 	}),
 	root: sTreeNode,
-});
+}).defineAs(visualizationNs("TreeData"));
 
 export const treeVisualizer = createVisualizer({
 	id: "tree",