@sky.ui/mcp 0.0.1

package/data/chart-api-sections.json

@@ -0,0 +1,4185 @@
+{
+  "generatedFrom": "components-raw/sky-chart/helper/chart-api-docs.ts",
+  "types": [
+    "bar",
+    "line",
+    "pie",
+    "scatter",
+    "gauge",
+    "funnel",
+    "heatmap",
+    "waterfall",
+    "treemap",
+    "sunburst",
+    "parallel",
+    "graph",
+    "lines",
+    "custom",
+    "candlestick",
+    "boxplot",
+    "map",
+    "radar",
+    "sankey",
+    "brush",
+    "pictorialBar",
+    "themeRiver",
+    "calendar"
+  ],
+  "sectionsByType": {
+    "bar": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title shown at the top.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Main title text."
+          },
+          {
+            "name": "title.left",
+            "type": "string | number",
+            "default": "auto",
+            "description": "Horizontal position: 'left' | 'center' | 'right' or pixel value."
+          },
+          {
+            "name": "title.top",
+            "type": "string | number",
+            "default": "auto",
+            "description": "Vertical position or pixel offset."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Font size, color, etc."
+          }
+        ],
+        "snippet": "\"title\": {\n  \"text\": \"Sales by Product\",\n  \"left\": \"center\"\n}"
+      },
+      {
+        "id": "grid",
+        "title": "grid",
+        "optionPath": "option.grid",
+        "description": "Position and size of the chart area (excluding title, legend, axes labels).",
+        "properties": [
+          {
+            "name": "grid.left",
+            "type": "number",
+            "default": "—",
+            "description": "Left margin in pixels."
+          },
+          {
+            "name": "grid.right",
+            "type": "number",
+            "default": "—",
+            "description": "Right margin."
+          },
+          {
+            "name": "grid.top",
+            "type": "number",
+            "default": "—",
+            "description": "Top margin (leave space for title)."
+          },
+          {
+            "name": "grid.bottom",
+            "type": "number",
+            "default": "—",
+            "description": "Bottom margin (axes labels)."
+          }
+        ],
+        "snippet": "\"grid\": {\n  \"left\": 50,\n  \"right\": 20,\n  \"top\": 50,\n  \"bottom\": 40\n}"
+      },
+      {
+        "id": "xAxis",
+        "title": "xAxis",
+        "optionPath": "option.xAxis",
+        "description": "Category or value axis (usually horizontal for bar charts).",
+        "properties": [
+          {
+            "name": "xAxis.type",
+            "type": "string",
+            "default": "category",
+            "description": "'category' for bars by label; 'value' for numeric x."
+          },
+          {
+            "name": "xAxis.name",
+            "type": "string",
+            "description": "Axis name shown beside the axis."
+          },
+          {
+            "name": "xAxis.nameLocation",
+            "type": "string",
+            "default": "end",
+            "description": "'start' | 'middle' | 'end'."
+          },
+          {
+            "name": "xAxis.data",
+            "type": "array",
+            "description": "Category labels when not using dataset."
+          }
+        ],
+        "snippet": "\"xAxis\": {\n  \"type\": \"category\",\n  \"name\": \"Product\",\n  \"nameLocation\": \"middle\"\n}"
+      },
+      {
+        "id": "yAxis",
+        "title": "yAxis",
+        "optionPath": "option.yAxis",
+        "description": "Value axis (usually vertical for bar charts).",
+        "properties": [
+          {
+            "name": "yAxis.name",
+            "type": "string",
+            "description": "Axis name."
+          },
+          {
+            "name": "yAxis.nameGap",
+            "type": "number",
+            "description": "Gap between axis line and name."
+          },
+          {
+            "name": "yAxis.min",
+            "type": "number",
+            "description": "Minimum value (auto if omitted)."
+          },
+          {
+            "name": "yAxis.max",
+            "type": "number",
+            "description": "Maximum value (auto if omitted)."
+          }
+        ],
+        "snippet": "\"yAxis\": {\n  \"name\": \"Sales\",\n  \"nameGap\": 40\n}"
+      },
+      {
+        "id": "dataset",
+        "title": "dataset",
+        "optionPath": "option.dataset",
+        "description": "Table-style data: first row = dimension names, following rows = values. Series can map columns via encode.",
+        "properties": [
+          {
+            "name": "dataset.source",
+            "type": "array[][]",
+            "description": "2D array: e.g. [[\"product\", \"Sales\"], [\"A\", 28], ...]."
+          }
+        ],
+        "snippet": "\"dataset\": {\n  \"source\": [\n    [\"product\", \"Sales\"],\n    [\"A\", 28], [\"B\", 55], [\"C\", 43]\n  ]\n}"
+      },
+      {
+        "id": "series-bar",
+        "title": "series (bar)",
+        "optionPath": "option.series",
+        "description": "Bar series options. Use type: 'bar' and optionally stack, barWidth, encode.",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'bar' for bar chart."
+          },
+          {
+            "name": "series[].name",
+            "type": "string",
+            "description": "Series name (legend and tooltip)."
+          },
+          {
+            "name": "series[].stack",
+            "type": "string",
+            "description": "Same string on multiple series to stack bars."
+          },
+          {
+            "name": "series[].encode.x",
+            "type": "string | number",
+            "description": "Dataset dimension for categories (e.g. column name or index)."
+          },
+          {
+            "name": "series[].encode.y",
+            "type": "string | number",
+            "description": "Dataset dimension for values."
+          },
+          {
+            "name": "series[].barWidth",
+            "type": "string | number",
+            "description": "Bar width (e.g. '60%' or pixel number)."
+          },
+          {
+            "name": "series[].barGap",
+            "type": "string",
+            "default": "30%",
+            "description": "Gap between bars in same category (e.g. '30%')."
+          },
+          {
+            "name": "series[].barCategoryGap",
+            "type": "string",
+            "description": "Gap between categories."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Fill color, borderColor, borderWidth, borderRadius."
+          }
+        ],
+        "snippet": "\"series\": [\n  {\n    \"type\": \"bar\",\n    \"name\": \"Sales\",\n    \"barGap\": \"30%\"\n  }\n]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Tooltip when hovering over the chart.",
+        "properties": [
+          {
+            "name": "tooltip.show",
+            "type": "boolean",
+            "default": "true",
+            "description": "Whether to show tooltip."
+          },
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "default": "item",
+            "description": "'item' | 'axis'."
+          },
+          {
+            "name": "tooltip.formatter",
+            "type": "string | function",
+            "description": "Template (e.g. '{b}: {c}') or custom function."
+          }
+        ],
+        "snippet": "\"tooltip\": {\n  \"trigger\": \"axis\",\n  \"formatter\": \"{b}: {c}\"\n}"
+      },
+      {
+        "id": "legend",
+        "title": "legend",
+        "optionPath": "option.legend",
+        "description": "Legend for multiple series.",
+        "properties": [
+          {
+            "name": "legend.show",
+            "type": "boolean",
+            "default": "true",
+            "description": "Whether to show legend."
+          },
+          {
+            "name": "legend.orient",
+            "type": "string",
+            "default": "horizontal",
+            "description": "'horizontal' | 'vertical'."
+          },
+          {
+            "name": "legend.left",
+            "type": "string",
+            "description": "Position: 'left' | 'center' | 'right' or number."
+          },
+          {
+            "name": "legend.top",
+            "type": "string",
+            "description": "Position: 'top' | 'middle' | 'bottom' or number."
+          }
+        ],
+        "snippet": "\"legend\": {\n  \"orient\": \"horizontal\",\n  \"top\": \"bottom\"\n}"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "line": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title at the top.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Main title text."
+          },
+          {
+            "name": "title.left",
+            "type": "string | number",
+            "description": "Position."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Revenue Trend\" }"
+      },
+      {
+        "id": "grid",
+        "title": "grid",
+        "optionPath": "option.grid",
+        "description": "Chart area margins.",
+        "properties": [
+          {
+            "name": "grid.left",
+            "type": "number",
+            "description": "Left margin (px)."
+          },
+          {
+            "name": "grid.right",
+            "type": "number",
+            "description": "Right margin."
+          },
+          {
+            "name": "grid.top",
+            "type": "number",
+            "description": "Top margin."
+          },
+          {
+            "name": "grid.bottom",
+            "type": "number",
+            "description": "Bottom margin."
+          }
+        ],
+        "snippet": "\"grid\": { \"left\": 50, \"right\": 20, \"top\": 50, \"bottom\": 40 }"
+      },
+      {
+        "id": "xAxis",
+        "title": "xAxis",
+        "optionPath": "option.xAxis",
+        "description": "Category or time axis.",
+        "properties": [
+          {
+            "name": "xAxis.type",
+            "type": "string",
+            "description": "'category' | 'value' | 'time'."
+          },
+          {
+            "name": "xAxis.name",
+            "type": "string",
+            "description": "Axis name."
+          }
+        ],
+        "snippet": "\"xAxis\": { \"type\": \"category\", \"name\": \"Month\" }"
+      },
+      {
+        "id": "yAxis",
+        "title": "yAxis",
+        "optionPath": "option.yAxis",
+        "description": "Value axis.",
+        "properties": [
+          {
+            "name": "yAxis.name",
+            "type": "string",
+            "description": "Axis name."
+          },
+          {
+            "name": "yAxis.min",
+            "type": "number",
+            "description": "Min value (optional)."
+          },
+          {
+            "name": "yAxis.max",
+            "type": "number",
+            "description": "Max value (optional)."
+          }
+        ],
+        "snippet": "\"yAxis\": { \"name\": \"Revenue\" }"
+      },
+      {
+        "id": "dataset",
+        "title": "dataset",
+        "optionPath": "option.dataset",
+        "description": "Table data; series map via encode.",
+        "properties": [
+          {
+            "name": "dataset.source",
+            "type": "array[][]",
+            "description": "2D array: dimensions + rows."
+          }
+        ],
+        "snippet": "\"dataset\": { \"source\": [[\"month\",\"Revenue\"],[\"Jan\",24],[\"Feb\",31]] }"
+      },
+      {
+        "id": "series-line",
+        "title": "series (line)",
+        "optionPath": "option.series",
+        "description": "Line series options.",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'line'."
+          },
+          {
+            "name": "series[].name",
+            "type": "string",
+            "description": "Series name."
+          },
+          {
+            "name": "series[].smooth",
+            "type": "boolean",
+            "default": "false",
+            "description": "Smooth curve."
+          },
+          {
+            "name": "series[].step",
+            "type": "boolean | string",
+            "description": "Step: true | 'start' | 'end' | 'middle'."
+          },
+          {
+            "name": "series[].stack",
+            "type": "string",
+            "description": "Stack id for stacking."
+          },
+          {
+            "name": "series[].showSymbol",
+            "type": "boolean",
+            "default": "true",
+            "description": "Show points."
+          },
+          {
+            "name": "series[].connectNulls",
+            "type": "boolean",
+            "description": "Connect across nulls."
+          },
+          {
+            "name": "series[].sampling",
+            "type": "string",
+            "description": "'lttb' | 'max' | 'min' | 'average'."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"line\", \"name\": \"Revenue\", \"smooth\": true }]"
+      },
+      {
+        "id": "dataZoom",
+        "title": "dataZoom",
+        "optionPath": "option.dataZoom",
+        "description": "Slider or inside zoom.",
+        "properties": [
+          {
+            "name": "dataZoom[].type",
+            "type": "string",
+            "description": "'slider' | 'inside'."
+          },
+          {
+            "name": "dataZoom[].start",
+            "type": "number",
+            "description": "Start % (0–100)."
+          },
+          {
+            "name": "dataZoom[].end",
+            "type": "number",
+            "description": "End % (0–100)."
+          }
+        ],
+        "snippet": "\"dataZoom\": [{ \"type\": \"slider\", \"start\": 0, \"end\": 50 }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'item' | 'axis'."
+          },
+          {
+            "name": "tooltip.formatter",
+            "type": "string | function",
+            "description": "Template or function."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"axis\" }"
+      },
+      {
+        "id": "legend",
+        "title": "legend",
+        "optionPath": "option.legend",
+        "description": "Legend for series.",
+        "properties": [
+          {
+            "name": "legend.show",
+            "type": "boolean",
+            "description": "Show legend."
+          },
+          {
+            "name": "legend.orient",
+            "type": "string",
+            "description": "'horizontal' | 'vertical'."
+          }
+        ],
+        "snippet": "\"legend\": { \"top\": \"bottom\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "pie": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Market Share\" }"
+      },
+      {
+        "id": "series-pie",
+        "title": "series (pie)",
+        "optionPath": "option.series",
+        "description": "Pie series: data as [{ name, value }, ...] or use dataset + encode.",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'pie'."
+          },
+          {
+            "name": "series[].radius",
+            "type": "string | [string, string]",
+            "description": "'50%' or ['0%','75%'] for donut."
+          },
+          {
+            "name": "series[].center",
+            "type": "[string, string]",
+            "description": "['50%','50%']."
+          },
+          {
+            "name": "series[].roseType",
+            "type": "string",
+            "description": "'radius' | 'area' for Nightingale."
+          },
+          {
+            "name": "series[].label.formatter",
+            "type": "string | function",
+            "description": "Label template e.g. '{b}: {c}'."
+          },
+          {
+            "name": "series[].label.position",
+            "type": "string",
+            "description": "'outside' | 'inside' | 'center'."
+          },
+          {
+            "name": "series[].emphasis.scale",
+            "type": "boolean",
+            "description": "Scale slice on hover."
+          },
+          {
+            "name": "series[].selectedMode",
+            "type": "boolean | string",
+            "description": "Click to select."
+          },
+          {
+            "name": "series[].selectedOffset",
+            "type": "number",
+            "description": "Offset when selected."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"pie\", \"radius\": \"60%\", \"data\": [{\"name\":\"A\",\"value\":35},{\"name\":\"B\",\"value\":65}] }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "default": "item",
+            "description": "Usually 'item' for pie."
+          },
+          {
+            "name": "tooltip.formatter",
+            "type": "string | function",
+            "description": "e.g. '{b}: {c} ({d}%)'."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"item\" }"
+      },
+      {
+        "id": "legend",
+        "title": "legend",
+        "optionPath": "option.legend",
+        "description": "Legend for slices.",
+        "properties": [
+          {
+            "name": "legend.show",
+            "type": "boolean",
+            "description": "Show legend."
+          },
+          {
+            "name": "legend.orient",
+            "type": "string",
+            "description": "'horizontal' | 'vertical'."
+          }
+        ],
+        "snippet": "\"legend\": { \"orient\": \"vertical\", \"left\": \"left\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "scatter": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Scatter\" }"
+      },
+      {
+        "id": "grid",
+        "title": "grid",
+        "optionPath": "option.grid",
+        "description": "Chart area margins.",
+        "properties": [
+          {
+            "name": "grid.left",
+            "type": "number",
+            "description": "Left (px)."
+          },
+          {
+            "name": "grid.right",
+            "type": "number",
+            "description": "Right."
+          },
+          {
+            "name": "grid.top",
+            "type": "number",
+            "description": "Top."
+          },
+          {
+            "name": "grid.bottom",
+            "type": "number",
+            "description": "Bottom."
+          }
+        ],
+        "snippet": "\"grid\": { \"left\": 50, \"right\": 20, \"top\": 50, \"bottom\": 40 }"
+      },
+      {
+        "id": "xAxis",
+        "title": "xAxis",
+        "optionPath": "option.xAxis",
+        "description": "X axis (value or category).",
+        "properties": [
+          {
+            "name": "xAxis.type",
+            "type": "string",
+            "description": "'value' | 'category'."
+          },
+          {
+            "name": "xAxis.name",
+            "type": "string",
+            "description": "Axis name."
+          }
+        ],
+        "snippet": "\"xAxis\": { \"name\": \"X\" }"
+      },
+      {
+        "id": "yAxis",
+        "title": "yAxis",
+        "optionPath": "option.yAxis",
+        "description": "Y axis.",
+        "properties": [
+          {
+            "name": "yAxis.name",
+            "type": "string",
+            "description": "Axis name."
+          }
+        ],
+        "snippet": "\"yAxis\": { \"name\": \"Y\" }"
+      },
+      {
+        "id": "series-scatter",
+        "title": "series (scatter)",
+        "optionPath": "option.series",
+        "description": "Scatter series: data as [x,y] or [{ value: [x,y] }, ...].",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'scatter'."
+          },
+          {
+            "name": "series[].symbol",
+            "type": "string",
+            "description": "'circle' | 'rect' | 'roundRect' | 'triangle' | 'diamond' | 'pin' | 'arrow'."
+          },
+          {
+            "name": "series[].symbolSize",
+            "type": "number | function",
+            "description": "Size in px or (value, params) => number."
+          },
+          {
+            "name": "series[].large",
+            "type": "boolean",
+            "description": "Use sampling for many points."
+          },
+          {
+            "name": "series[].largeThreshold",
+            "type": "number",
+            "description": "Threshold for large mode."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"scatter\", \"symbolSize\": 10, \"data\": [[10,20],[30,40]] }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'item' typically."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"item\" }"
+      },
+      {
+        "id": "legend",
+        "title": "legend",
+        "optionPath": "option.legend",
+        "description": "Legend.",
+        "properties": [
+          {
+            "name": "legend.show",
+            "type": "boolean",
+            "description": "Show legend."
+          }
+        ],
+        "snippet": "\"legend\": { \"top\": \"bottom\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "gauge": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Speed\" }"
+      },
+      {
+        "id": "series-gauge",
+        "title": "series (gauge)",
+        "optionPath": "option.series",
+        "description": "Gauge: data is array of values (one per arc when multiple). Center detail uses first value only.",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'gauge'."
+          },
+          {
+            "name": "series[].min",
+            "type": "number",
+            "description": "Minimum value."
+          },
+          {
+            "name": "series[].max",
+            "type": "number",
+            "description": "Maximum value."
+          },
+          {
+            "name": "series[].splitNumber",
+            "type": "number",
+            "description": "Major segments; major tick count = splitNumber + 1."
+          },
+          {
+            "name": "series[].splitLine",
+            "type": "object",
+            "description": "Major radial ticks: show (default on), length, distance, lineStyle."
+          },
+          {
+            "name": "series[].axisTick",
+            "type": "object",
+            "description": "Minor ticks between majors — set show: true (default off)."
+          },
+          {
+            "name": "series[].axisLine.lineStyle",
+            "type": "object",
+            "description": "Axis line color/width."
+          },
+          {
+            "name": "series[].splitArea",
+            "type": "object",
+            "description": "Alternating segment colors."
+          },
+          {
+            "name": "series[].axisLabel.formatter",
+            "type": "string | function",
+            "description": "Tick label formatter."
+          },
+          {
+            "name": "series[].detail.formatter",
+            "type": "string | function",
+            "description": "Center value formatter."
+          },
+          {
+            "name": "title.offsetCenter",
+            "type": "array",
+            "description": "Chart title position (% strings); not series.title."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"gauge\", \"min\": 0, \"max\": 100, \"data\": [{ \"value\": 65 }] }]"
+      },
+      {
+        "id": "legend-gauge",
+        "title": "legend (gauge)",
+        "optionPath": "option.legend",
+        "description": "Optional color swatch under the chart. Omit legend or leave show unset to hide (the dial already shows the metric). Set legend.show: true to show; label text is option.title.text or series name.",
+        "properties": [
+          {
+            "name": "legend.show",
+            "type": "boolean",
+            "description": "true = show swatch; false = hide; omit = hidden."
+          }
+        ],
+        "snippet": "\"legend\": { \"show\": true }"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip.",
+        "properties": [
+          {
+            "name": "tooltip.show",
+            "type": "boolean",
+            "description": "Show tooltip."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"show\": true }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "funnel": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Funnel\" }"
+      },
+      {
+        "id": "series-funnel",
+        "title": "series (funnel)",
+        "optionPath": "option.series",
+        "description": "Funnel: data as [{ name, value, itemStyle? }, ...], or dataset + encode.itemName / encode.value.",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'funnel'."
+          },
+          {
+            "name": "series[].sort",
+            "type": "string",
+            "description": "'ascending' | 'asc' | 'descending' | 'desc' | 'none' | null."
+          },
+          {
+            "name": "series[].gap",
+            "type": "number",
+            "description": "Gap between segments (px)."
+          },
+          {
+            "name": "series[].orient",
+            "type": "string",
+            "description": "'vertical' (default) | 'horizontal'."
+          },
+          {
+            "name": "series[].funnelAlign",
+            "type": "string",
+            "description": "Vertical: 'left' | 'center' | 'right'. Horizontal: 'top' | 'center' | 'bottom'."
+          },
+          {
+            "name": "series[].minSize",
+            "type": "string | number",
+            "description": "Min neck width as % (e.g. '20%')."
+          },
+          {
+            "name": "series[].maxSize",
+            "type": "string | number",
+            "description": "Max width as % (default '100%')."
+          },
+          {
+            "name": "series[].label.position",
+            "type": "string",
+            "description": "inside | center | insideLeft | insideRight | left | right | outside | top | bottom."
+          },
+          {
+            "name": "series[].label.showValue",
+            "type": "boolean",
+            "description": "Second line with raw value; default true."
+          },
+          {
+            "name": "series[].label.overflow",
+            "type": "string",
+            "description": "Inside labels: truncate | break | breakAll | none (default truncate, ECharts-style)."
+          },
+          {
+            "name": "series[].label.lineHeight",
+            "type": "number",
+            "description": "Line height multiplier for wrapped inside labels."
+          },
+          {
+            "name": "series[].label.formatter",
+            "type": "string | function",
+            "description": "Placeholders {a}{b} name, {c} value, {d} percent."
+          },
+          {
+            "name": "series[].labelLine",
+            "type": "object",
+            "description": "show, length, length2 for outside left/right labels."
+          },
+          {
+            "name": "series[].emphasis.itemStyle",
+            "type": "object",
+            "description": "Hover outline: borderColor, borderWidth."
+          },
+          {
+            "name": "series[].silent",
+            "type": "boolean",
+            "description": "Disable pointer events and tooltip."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"funnel\", \"sort\": \"descending\", \"gap\": 4, \"funnelAlign\": \"center\", \"data\": [{\"name\":\"A\",\"value\":100}] }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'item'."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"item\" }"
+      },
+      {
+        "id": "legend",
+        "title": "legend",
+        "optionPath": "option.legend",
+        "description": "List legend with optional toggle.",
+        "properties": [
+          {
+            "name": "legend.show",
+            "type": "boolean",
+            "description": "Show legend."
+          },
+          {
+            "name": "legend.selected",
+            "type": "object",
+            "description": "Map name → boolean for initial visibility."
+          },
+          {
+            "name": "legend.selectedMode",
+            "type": "boolean | string",
+            "description": "false disables click toggle."
+          }
+        ],
+        "snippet": "\"legend\": { \"show\": true, \"selected\": { \"A\": true } }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "heatmap": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Heatmap\" }"
+      },
+      {
+        "id": "grid",
+        "title": "grid",
+        "optionPath": "option.grid",
+        "description": "Chart area.",
+        "properties": [
+          {
+            "name": "grid.left",
+            "type": "number",
+            "description": "Left (px)."
+          },
+          {
+            "name": "grid.right",
+            "type": "number",
+            "description": "Right."
+          },
+          {
+            "name": "grid.top",
+            "type": "number",
+            "description": "Top."
+          },
+          {
+            "name": "grid.bottom",
+            "type": "number",
+            "description": "Bottom."
+          }
+        ],
+        "snippet": "\"grid\": { \"left\": 60, \"right\": 20, \"top\": 50, \"bottom\": 50 }"
+      },
+      {
+        "id": "xAxis",
+        "title": "xAxis",
+        "optionPath": "option.xAxis",
+        "description": "Categories (e.g. hours).",
+        "properties": [
+          {
+            "name": "xAxis.type",
+            "type": "string",
+            "description": "'category'."
+          },
+          {
+            "name": "xAxis.data",
+            "type": "array",
+            "description": "Category labels."
+          }
+        ],
+        "snippet": "\"xAxis\": { \"type\": \"category\", \"data\": [\"a\",\"b\",\"c\"] }"
+      },
+      {
+        "id": "yAxis",
+        "title": "yAxis",
+        "optionPath": "option.yAxis",
+        "description": "Categories (e.g. days).",
+        "properties": [
+          {
+            "name": "yAxis.type",
+            "type": "string",
+            "description": "'category'."
+          },
+          {
+            "name": "yAxis.data",
+            "type": "array",
+            "description": "Category labels."
+          }
+        ],
+        "snippet": "\"yAxis\": { \"type\": \"category\", \"data\": [\"Mon\",\"Tue\"] }"
+      },
+      {
+        "id": "visualMap",
+        "title": "visualMap",
+        "optionPath": "option.visualMap",
+        "description": "Color mapping for cell values.",
+        "properties": [
+          {
+            "name": "visualMap.type",
+            "type": "string",
+            "description": "'piecewise' | 'continuous'."
+          },
+          {
+            "name": "visualMap.min",
+            "type": "number",
+            "description": "Min value."
+          },
+          {
+            "name": "visualMap.max",
+            "type": "number",
+            "description": "Max value."
+          },
+          {
+            "name": "visualMap.inRange",
+            "type": "object",
+            "description": "Color range."
+          }
+        ],
+        "snippet": "\"visualMap\": { \"type\": \"piecewise\", \"min\": 0, \"max\": 10 }"
+      },
+      {
+        "id": "series-heatmap",
+        "title": "series (heatmap)",
+        "optionPath": "option.series",
+        "description": "Data: [[xIndex, yIndex, value], ...].",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'heatmap'."
+          },
+          {
+            "name": "series[].label.show",
+            "type": "boolean",
+            "description": "Show cell label."
+          },
+          {
+            "name": "series[].label.formatter",
+            "type": "string | function",
+            "description": "'{c}' etc."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"heatmap\", \"data\": [[0,0,5],[1,0,8]], \"label\": { \"show\": true } }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'item'."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"item\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "waterfall": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Waterfall\" }"
+      },
+      {
+        "id": "grid",
+        "title": "grid",
+        "optionPath": "option.grid",
+        "description": "Chart area.",
+        "properties": [
+          {
+            "name": "grid.left",
+            "type": "number",
+            "description": "Left (px)."
+          },
+          {
+            "name": "grid.right",
+            "type": "number",
+            "description": "Right."
+          },
+          {
+            "name": "grid.top",
+            "type": "number",
+            "description": "Top."
+          },
+          {
+            "name": "grid.bottom",
+            "type": "number",
+            "description": "Bottom."
+          }
+        ],
+        "snippet": "\"grid\": { \"left\": 50, \"right\": 20, \"top\": 50, \"bottom\": 40 }"
+      },
+      {
+        "id": "xAxis",
+        "title": "xAxis",
+        "optionPath": "option.xAxis",
+        "description": "Category axis.",
+        "properties": [
+          {
+            "name": "xAxis.type",
+            "type": "string",
+            "description": "'category'."
+          },
+          {
+            "name": "xAxis.data",
+            "type": "array",
+            "description": "Labels."
+          }
+        ],
+        "snippet": "\"xAxis\": { \"type\": \"category\", \"data\": [\"Start\",\"A\",\"B\",\"End\"] }"
+      },
+      {
+        "id": "yAxis",
+        "title": "yAxis",
+        "optionPath": "option.yAxis",
+        "description": "Value axis.",
+        "properties": [
+          {
+            "name": "yAxis.name",
+            "type": "string",
+            "description": "Axis name."
+          }
+        ],
+        "snippet": "\"yAxis\": { \"name\": \"Amount\" }"
+      },
+      {
+        "id": "series-waterfall",
+        "title": "series (waterfall)",
+        "optionPath": "option.series",
+        "description": "Data: [{ name, value }, ...]. Total row: same name as first item or isTotal: true.",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'waterfall'."
+          },
+          {
+            "name": "series[].totalItemStyle",
+            "type": "object",
+            "description": "Style for total bar (color, etc.)."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"waterfall\", \"data\": [{\"name\":\"Start\",\"value\":100},{\"name\":\"A\",\"value\":-20},{\"name\":\"Total\",\"value\":80}], \"totalItemStyle\": { \"color\": \"#6366f1\" } }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'axis'."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"axis\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "treemap": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Treemap\" }"
+      },
+      {
+        "id": "series-treemap",
+        "title": "series (treemap)",
+        "optionPath": "option.series",
+        "description": "Hierarchy: data as { name, value, children?: [] }.",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'treemap'."
+          },
+          {
+            "name": "series[].sort",
+            "type": "string",
+            "description": "'desc' | 'asc' | null (by data order)."
+          },
+          {
+            "name": "series[].label.formatter",
+            "type": "string | function",
+            "description": "'{b}' | '{c}' etc."
+          },
+          {
+            "name": "series[].levels",
+            "type": "array",
+            "description": "Per-level itemStyle/label."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"treemap\", \"data\": [{ \"name\": \"A\", \"value\": 10, \"children\": [] }], \"sort\": \"desc\" }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'item'."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"item\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "sunburst": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Sunburst\" }"
+      },
+      {
+        "id": "series-sunburst",
+        "title": "series (sunburst)",
+        "optionPath": "option.series",
+        "description": "Hierarchy: data as { name, value, children?: [] }.",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'sunburst'."
+          },
+          {
+            "name": "series[].radius",
+            "type": "[string, string]",
+            "description": "Inner/outer radius."
+          },
+          {
+            "name": "series[].sort",
+            "type": "string",
+            "description": "'desc' | 'asc' | null."
+          },
+          {
+            "name": "series[].label.formatter",
+            "type": "string | function",
+            "description": "Label template."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"sunburst\", \"radius\": [\"0%\",\"100%\"], \"data\": [{ \"name\": \"A\", \"value\": 10 }], \"sort\": \"desc\" }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'item'."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"item\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "parallel": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Parallel\" }"
+      },
+      {
+        "id": "parallel-layout",
+        "title": "parallel",
+        "optionPath": "option.parallel",
+        "description": "Chart area like grid: left, right, top, bottom, width, height (px or %).",
+        "properties": [
+          {
+            "name": "parallel.left",
+            "type": "number | string",
+            "description": "Inset from container left."
+          },
+          {
+            "name": "parallel.width",
+            "type": "number | string",
+            "description": "Region width."
+          }
+        ],
+        "snippet": "\"parallel\": { \"left\": 40, \"right\": 40, \"top\": 50, \"bottom\": 40 }"
+      },
+      {
+        "id": "parallelAxis",
+        "title": "parallelAxis",
+        "optionPath": "option.parallelAxis",
+        "description": "Per dimension: match by index or dim. Value (default) or category axis.",
+        "properties": [
+          {
+            "name": "parallelAxis[].dim",
+            "type": "number",
+            "description": "Dimension index (0-based)."
+          },
+          {
+            "name": "parallelAxis[].name",
+            "type": "string",
+            "description": "Axis title."
+          },
+          {
+            "name": "parallelAxis[].type",
+            "type": "string",
+            "description": "'value' | 'category'."
+          },
+          {
+            "name": "parallelAxis[].data",
+            "type": "string[]",
+            "description": "Category names when type is category."
+          },
+          {
+            "name": "parallelAxis[].min / max",
+            "type": "number",
+            "description": "Value domain override."
+          },
+          {
+            "name": "parallelAxis[].inverse",
+            "type": "boolean",
+            "description": "Invert axis direction."
+          },
+          {
+            "name": "parallelAxis[].axisLine / axisTick / axisLabel / splitLine",
+            "type": "object",
+            "description": "Style and formatter (see parallelAxis)."
+          }
+        ],
+        "snippet": "\"parallelAxis\": [{ \"dim\": 0, \"name\": \"A\" }, { \"dim\": 1, \"type\": \"category\", \"data\": [\"x\",\"y\"] }]"
+      },
+      {
+        "id": "series-parallel",
+        "title": "series (parallel)",
+        "optionPath": "option.series",
+        "description": "Inline `data`: number[][] or `{ value, name }[]`. Or omit data and use `dataset` (one consuming series). Multiple parallel series overlay; legend shows each.",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'parallel'."
+          },
+          {
+            "name": "series[].data",
+            "type": "array",
+            "description": "Rows across dimensions."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Stroke width, color, opacity, type."
+          },
+          {
+            "name": "series[].smooth",
+            "type": "boolean | number",
+            "description": "false = straight; true / spline / tension."
+          },
+          {
+            "name": "series[].inactiveOpacity / activeOpacity",
+            "type": "number",
+            "description": "Hover dimming (ECharts-style)."
+          },
+          {
+            "name": "series[].emphasis",
+            "type": "object",
+            "description": "focus, lineStyle on hover."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"parallel\", \"data\": [[1,2,3],[4,5,6]] }]"
+      },
+      {
+        "id": "visualMap-parallel",
+        "title": "visualMap (parallel)",
+        "optionPath": "option.visualMap",
+        "description": "Continuous or piecewise map: set dimension (defaults to last axis) and optional seriesIndex.",
+        "properties": [
+          {
+            "name": "visualMap.dimension",
+            "type": "number",
+            "description": "Which axis value drives color."
+          },
+          {
+            "name": "visualMap.seriesIndex",
+            "type": "number | number[]",
+            "description": "Target series (omit = all)."
+          }
+        ],
+        "snippet": "\"visualMap\": { \"min\": 0, \"max\": 10, \"dimension\": 2, \"inRange\": { \"color\": [\"#313695\",\"#e0ffff\",\"#d73027\"] } }"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'item'."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"item\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "graph": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Graph\" }"
+      },
+      {
+        "id": "series-graph",
+        "title": "series (graph)",
+        "optionPath": "option.series",
+        "description": "ECharts-style graph: `data: { nodes, links }`. First `type: 'graph'` series is rendered. Nodes: `id`, `name`, `symbol` (circle|rect|roundRect|triangle|diamond|pin|arrow; `image://` falls back to circle), `symbolSize` (number diameter or `[w,h]`), optional `x`/`y` (`layout: 'none'`), `value` (optional `visualMap` fill), `category`, `itemStyle`, per-node `label`. Links: `source`/`target`, `lineStyle` (incl. `curveness` for curved edges), per-link `label` (merged with `edgeLabel`).",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'graph'."
+          },
+          {
+            "name": "series[].layout",
+            "type": "string",
+            "description": "'force' | 'circular' | 'none' (fixed positions from node x,y)."
+          },
+          {
+            "name": "series[].roam",
+            "type": "boolean | 'scale' | 'move'",
+            "description": "Pan/zoom the graph layer."
+          },
+          {
+            "name": "series[].force",
+            "type": "object",
+            "description": "repulsion, gravity, edgeLength (number or [min,max]), friction."
+          },
+          {
+            "name": "series[].edgeSymbol",
+            "type": "string | [string, string]",
+            "description": "'arrow' | 'both' | ['none','arrow'] | ['arrow','none'] — arrow markers on edges."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Default edge stroke; merged with link.lineStyle. Includes `curveness` (-1..1) for quadratic bend."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Default node fill/stroke."
+          },
+          {
+            "name": "series[].categories",
+            "type": "array",
+            "description": "{ name, itemStyle } — legend + node.category colors."
+          },
+          {
+            "name": "series[].colorBy",
+            "type": "'series' | 'data'",
+            "description": "Palette per node when no category color."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Default node labels: show, formatter ({b}/{c}), fontSize, color, rich."
+          },
+          {
+            "name": "series[].edgeLabel",
+            "type": "object",
+            "description": "Default edge labels (merged with link.label)."
+          },
+          {
+            "name": "series[].focusNodeAdjacency",
+            "type": "boolean",
+            "description": "On hover, dim nodes and edges not adjacent to the hovered node."
+          },
+          {
+            "name": "series[].emphasis",
+            "type": "object",
+            "description": "`scale` / `scaleSize` enlarge symbol on hover; `disabled` skips emphasis."
+          },
+          {
+            "name": "series[].blur / inactiveOpacity",
+            "type": "object | number",
+            "description": "`blur.itemStyle.opacity` or `inactiveOpacity` sets dimmed opacity when focusNodeAdjacency is on."
+          },
+          {
+            "name": "series[].silent",
+            "type": "boolean",
+            "description": "When true, no tooltips or hover emphasis on nodes/edges."
+          },
+          {
+            "name": "option.visualMap",
+            "type": "object",
+            "description": "Continuous/piecewise map: node `value` can drive fill when no explicit itemStyle color wins."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"graph\", \"layout\": \"force\", \"roam\": true, \"edgeSymbol\": \"arrow\", \"data\": { \"nodes\": [], \"links\": [] } }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'item'."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"item\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "lines": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Lines\" }"
+      },
+      {
+        "id": "series-lines",
+        "title": "series (lines)",
+        "optionPath": "option.series",
+        "description": "One or more `lines` series. **Cartesian:** grid + xAxis/yAxis, shared extent. **Geo:** `coordinateSystem: 'geo'` with `option.geo.geoJson` (Mercator, optional `geo.roam`). Rows: `{ coords: [[x,y],...], value?, lineStyle?, name? }` (≥2 points).",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'lines'."
+          },
+          {
+            "name": "series[].coordinateSystem",
+            "type": "string",
+            "description": "'cartesian2d' (default) or 'geo'."
+          },
+          {
+            "name": "series[].curveness",
+            "type": "number",
+            "description": "0–1 bend between endpoints (quadratic)."
+          },
+          {
+            "name": "series[].data[].coords",
+            "type": "number[][]",
+            "description": "Polyline vertices in data coordinates."
+          },
+          {
+            "name": "series[].data[].lineStyle",
+            "type": "object",
+            "description": "Per-row stroke overrides."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "width, opacity, type solid|dashed|dotted, color."
+          },
+          {
+            "name": "series[].effect",
+            "type": "object",
+            "description": "show, period, delay, trailLength, constantSpeed; symbol: circle|rect|roundRect|triangle|diamond|pin|arrow|image://|path://; symbolSize (diameter-ish)."
+          },
+          {
+            "name": "series[].large / largeThreshold",
+            "type": "boolean | number",
+            "description": "When large and count ≥ threshold, line enter animation skipped."
+          },
+          {
+            "name": "series[].progressive / progressiveThreshold",
+            "type": "number",
+            "description": "Chunk size (>0) and row count threshold (default 3000): append lines over animation frames."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "show, formatter ({a}/{b}/{c}), fontSize, color — at path centroid."
+          },
+          {
+            "name": "series[].blur / emphasis",
+            "type": "object",
+            "description": "blur.lineStyle.opacity; emphasis.focus 'series' dims other series on hover."
+          },
+          {
+            "name": "option.geo",
+            "type": "object",
+            "description": "geoJson, roam, show, itemStyle — used when any lines series uses geo."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"lines\", \"curveness\": 0.2, \"lineStyle\": { \"type\": \"dashed\" }, \"effect\": { \"show\": true, \"period\": 2 }, \"data\": [{ \"coords\": [[10,20],[80,70]] }] }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'item'."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"item\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "custom": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Custom\" }"
+      },
+      {
+        "id": "grid",
+        "title": "grid",
+        "optionPath": "option.grid",
+        "description": "Chart coordinate area.",
+        "properties": [
+          {
+            "name": "grid.left",
+            "type": "number",
+            "description": "Left (px)."
+          },
+          {
+            "name": "grid.right",
+            "type": "number",
+            "description": "Right."
+          },
+          {
+            "name": "grid.top",
+            "type": "number",
+            "description": "Top."
+          },
+          {
+            "name": "grid.bottom",
+            "type": "number",
+            "description": "Bottom."
+          }
+        ],
+        "snippet": "\"grid\": { \"left\": 20, \"right\": 20, \"top\": 50, \"bottom\": 20 }"
+      },
+      {
+        "id": "series-custom",
+        "title": "series (custom)",
+        "optionPath": "option.series",
+        "description": "First series with type 'custom'. Declarative data: leaf shapes in logical coordinates, auto-scaled to the grid. Nested type 'group' is flattened. ECharts-style z, z2, opacity on leaves. renderItem(params, api) runs per data row; api.coordSys and api.size() use the real inner width/height (not a fixed box).",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'custom'."
+          },
+          {
+            "name": "series[].name",
+            "type": "string",
+            "description": "Legend label."
+          },
+          {
+            "name": "series[].data[]",
+            "type": "array | object",
+            "description": "Leaf shapes or { type: 'group', children: [...] }."
+          },
+          {
+            "name": "shape z / z2 / opacity",
+            "type": "number",
+            "description": "Draw order (ascending = lower first; higher z on top). opacity 0-1."
+          },
+          {
+            "name": "rect.rx / ry",
+            "type": "number",
+            "description": "Corner radius in shape units (scaled with width/height)."
+          },
+          {
+            "name": "line.strokeLinecap / strokeLinejoin",
+            "type": "string",
+            "description": "SVG caps; default round."
+          },
+          {
+            "name": "series[].renderItem",
+            "type": "function",
+            "description": "(params, api) => shape | shape[] | null. params: dataIndex, data, seriesIndex. api: size(), coordSys: { width, height, type? }."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"custom\", \"data\": [{ \"type\": \"circle\", \"x\": 20, \"y\": 50, \"r\": 25, \"z\": 0, \"color\": \"#3b82f6\" }, { \"type\": \"rect\", \"x\": 70, \"y\": 30, \"width\": 35, \"height\": 40, \"rx\": 4, \"ry\": 4, \"color\": \"#10b981\" }] }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'item'."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"item\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "candlestick": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Candlestick\" }"
+      },
+      {
+        "id": "grid",
+        "title": "grid",
+        "optionPath": "option.grid",
+        "description": "Chart area.",
+        "properties": [
+          {
+            "name": "grid.left",
+            "type": "number",
+            "description": "Left (px)."
+          },
+          {
+            "name": "grid.right",
+            "type": "number",
+            "description": "Right."
+          },
+          {
+            "name": "grid.top",
+            "type": "number",
+            "description": "Top."
+          },
+          {
+            "name": "grid.bottom",
+            "type": "number",
+            "description": "Bottom."
+          }
+        ],
+        "snippet": "\"grid\": { \"left\": 50, \"right\": 20, \"top\": 50, \"bottom\": 40 }"
+      },
+      {
+        "id": "xAxis",
+        "title": "xAxis",
+        "optionPath": "option.xAxis",
+        "description": "Category (e.g. date).",
+        "properties": [
+          {
+            "name": "xAxis.type",
+            "type": "string",
+            "description": "'category'."
+          },
+          {
+            "name": "xAxis.data",
+            "type": "array",
+            "description": "Labels."
+          }
+        ],
+        "snippet": "\"xAxis\": { \"type\": \"category\", \"data\": [\"Mon\",\"Tue\"] }"
+      },
+      {
+        "id": "yAxis",
+        "title": "yAxis",
+        "optionPath": "option.yAxis",
+        "description": "Value axis.",
+        "properties": [
+          {
+            "name": "yAxis.name",
+            "type": "string",
+            "description": "Axis name."
+          },
+          {
+            "name": "yAxis.scale",
+            "type": "boolean",
+            "description": "Scale to include OHLC."
+          }
+        ],
+        "snippet": "\"yAxis\": { \"name\": \"Price\", \"scale\": true }"
+      },
+      {
+        "id": "series-candlestick",
+        "title": "series (candlestick)",
+        "optionPath": "option.series",
+        "description": "Data: [open, close, low, high] or [[o,c,l,h], ...].",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'candlestick'."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Up/down bar colors."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"candlestick\", \"data\": [[20,35,10,40],[25,30,22,38]] }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'axis'."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"axis\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "boxplot": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Boxplot\" }"
+      },
+      {
+        "id": "grid",
+        "title": "grid",
+        "optionPath": "option.grid",
+        "description": "Chart area.",
+        "properties": [
+          {
+            "name": "grid.left",
+            "type": "number",
+            "description": "Left (px)."
+          },
+          {
+            "name": "grid.right",
+            "type": "number",
+            "description": "Right."
+          },
+          {
+            "name": "grid.top",
+            "type": "number",
+            "description": "Top."
+          },
+          {
+            "name": "grid.bottom",
+            "type": "number",
+            "description": "Bottom."
+          }
+        ],
+        "snippet": "\"grid\": { \"left\": 50, \"right\": 20, \"top\": 50, \"bottom\": 40 }"
+      },
+      {
+        "id": "xAxis",
+        "title": "xAxis",
+        "optionPath": "option.xAxis",
+        "description": "Category.",
+        "properties": [
+          {
+            "name": "xAxis.type",
+            "type": "string",
+            "description": "'category'."
+          },
+          {
+            "name": "xAxis.data",
+            "type": "array",
+            "description": "Labels."
+          }
+        ],
+        "snippet": "\"xAxis\": { \"type\": \"category\", \"data\": [\"A\",\"B\"] }"
+      },
+      {
+        "id": "yAxis",
+        "title": "yAxis",
+        "optionPath": "option.yAxis",
+        "description": "Value axis.",
+        "properties": [
+          {
+            "name": "yAxis.name",
+            "type": "string",
+            "description": "Axis name."
+          }
+        ],
+        "snippet": "\"yAxis\": { \"name\": \"Value\" }"
+      },
+      {
+        "id": "series-boxplot",
+        "title": "series (boxplot)",
+        "optionPath": "option.series",
+        "description": "Data: [min, Q1, median, Q3, max] per category.",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'boxplot'."
+          },
+          {
+            "name": "series[].data",
+            "type": "array",
+            "description": "Array of [min,q1,median,q3,max]."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"boxplot\", \"data\": [[5,10,15,20,25],[8,12,16,22,28]] }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'item'."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"item\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "map": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Map\" }"
+      },
+      {
+        "id": "geo",
+        "title": "geo",
+        "optionPath": "option.geo",
+        "description": "Map base: GeoJSON regions, style, roam (zoom/pan), hover emphasis, and optional LineString/MultiLineString strokes.",
+        "properties": [
+          {
+            "name": "geo.geoJson",
+            "type": "object",
+            "description": "GeoJSON FeatureCollection. Polygon/MultiPolygon → filled regions; LineString/MultiLineString → stroked paths."
+          },
+          {
+            "name": "geo.show",
+            "type": "boolean",
+            "description": "If false, GeoJSON is still used to project lng/lat scatter; polygons are not drawn."
+          },
+          {
+            "name": "geo.roam",
+            "type": "boolean | string",
+            "description": "true | 'scale' (zoom only) | 'move' (pan only)."
+          },
+          {
+            "name": "geo.itemStyle",
+            "type": "object",
+            "description": "Default region fill (color), border (borderColor, borderWidth); also default line stroke for line features."
+          },
+          {
+            "name": "geo.emphasis.itemStyle",
+            "type": "object",
+            "description": "Region style while hovered (color, borderColor, borderWidth)."
+          },
+          {
+            "name": "geo.regions",
+            "type": "array",
+            "description": "Per-region overrides: [{ name, itemStyle? }]."
+          }
+        ],
+        "snippet": "\"geo\": { \"geoJson\": { \"type\": \"FeatureCollection\", \"features\": [] }, \"roam\": true, \"emphasis\": { \"itemStyle\": { \"color\": \"#fbbf24\" } } }"
+      },
+      {
+        "id": "visualMap-map",
+        "title": "visualMap (map)",
+        "optionPath": "option.visualMap",
+        "description": "Continuous or piecewise visualMap tints choropleth regions and scatter fills when no per-point itemStyle.color.",
+        "properties": [
+          {
+            "name": "visualMap.min / max",
+            "type": "number",
+            "description": "Domain for continuous color (inRange.color)."
+          },
+          {
+            "name": "visualMap.seriesIndex",
+            "type": "number | number[]",
+            "description": "Optional: bind this visualMap to a series index."
+          }
+        ],
+        "snippet": "\"visualMap\": { \"min\": 0, \"max\": 100, \"inRange\": { \"color\": [\"#fee5d9\", \"#a50f15\"] } }"
+      },
+      {
+        "id": "series-map",
+        "title": "series (map)",
+        "optionPath": "option.series",
+        "description": "First series with type 'map': rows with coords [lng, lat] or [x, y] are scatter; rows with name + value only fill the region whose feature.properties.name matches (choropleth).",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'map'."
+          },
+          {
+            "name": "series[].data[]",
+            "type": "array",
+            "description": "{ name, value, coords? } - omit coords for choropleth."
+          },
+          {
+            "name": "series[].symbolSize",
+            "type": "number | [min, max]",
+            "description": "Fixed radius (px) or sqrt-scaled range for scatter."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "show, formatter ({ name, value, dataIndex }), color, fontSize."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Per-point color / border for scatter."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"map\", \"data\": [{ \"name\": \"Region A\", \"value\": 40 }, { \"name\": \"City\", \"value\": 10, \"coords\": [-6.2, 53.3] }] }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip for regions and scatter points.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'item'."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"item\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "radar": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Radar\" }"
+      },
+      {
+        "id": "radar",
+        "title": "radar",
+        "optionPath": "option.radar",
+        "description": "Indicator axes: name and max (and optional min) per axis.",
+        "properties": [
+          {
+            "name": "radar.indicator",
+            "type": "array",
+            "description": "Array of { name: string, max?: number, min?: number }."
+          },
+          {
+            "name": "radar.center",
+            "type": "[string, string]",
+            "description": "Center position e.g. ['50%','50%']."
+          },
+          {
+            "name": "radar.radius",
+            "type": "number | string",
+            "description": "Radius in px or percent."
+          }
+        ],
+        "snippet": "\"radar\": { \"indicator\": [{ \"name\": \"A\", \"max\": 100 }, { \"name\": \"B\", \"max\": 100 }] }"
+      },
+      {
+        "id": "series-radar",
+        "title": "series (radar)",
+        "optionPath": "option.series",
+        "description": "Each series has data: number[] (one value per indicator).",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'radar'."
+          },
+          {
+            "name": "series[].name",
+            "type": "string",
+            "description": "Series name (legend/tooltip)."
+          },
+          {
+            "name": "series[].data",
+            "type": "array",
+            "description": "Array of numbers, one per indicator (or [{ value: n }, ...])."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"radar\", \"name\": \"Series 1\", \"data\": [80, 60, 90, 70, 85] }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip (per series polygon).",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'item'."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"item\" }"
+      },
+      {
+        "id": "legend",
+        "title": "legend",
+        "optionPath": "option.legend",
+        "description": "Legend for multiple series.",
+        "properties": [
+          {
+            "name": "legend.show",
+            "type": "boolean",
+            "description": "Show legend."
+          }
+        ],
+        "snippet": "\"legend\": { \"top\": \"bottom\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "sankey": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Sankey\" }"
+      },
+      {
+        "id": "series-sankey",
+        "title": "series (sankey)",
+        "optionPath": "option.series",
+        "description": "Data: nodes (name) and links (source, target, value). source/target can be index or name.",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'sankey'."
+          },
+          {
+            "name": "series[].data.nodes",
+            "type": "array",
+            "description": "Optional: [{ name: string, value?: number }]. If omitted, nodes inferred from links."
+          },
+          {
+            "name": "series[].data.links",
+            "type": "array",
+            "description": "[{ source: number|string, target: number|string, value: number }]."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"sankey\", \"data\": { \"nodes\": [{ \"name\": \"A\" }, { \"name\": \"B\" }], \"links\": [{ \"source\": \"A\", \"target\": \"B\", \"value\": 10 }] } }]"
+      },
+      {
+        "id": "tooltip",
+        "title": "tooltip",
+        "optionPath": "option.tooltip",
+        "description": "Hover tooltip on nodes and links.",
+        "properties": [
+          {
+            "name": "tooltip.trigger",
+            "type": "string",
+            "description": "'item'."
+          }
+        ],
+        "snippet": "\"tooltip\": { \"trigger\": \"item\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "brush": [
+      {
+        "id": "brush",
+        "title": "brush",
+        "optionPath": "option.brush",
+        "description": "Range selector: use start/end (0–100) and @brush-end. option.brush.type: 'lineX' (horizontal) or 'lineY' (vertical).",
+        "properties": [
+          {
+            "name": "brush.type",
+            "type": "string",
+            "description": "'lineX' | 'lineY'."
+          }
+        ],
+        "snippet": "\"brush\": { \"type\": \"lineX\" }"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "pictorialBar": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Pictorial Bar\" }"
+      },
+      {
+        "id": "series-pictorialBar",
+        "title": "series (pictorialBar)",
+        "optionPath": "option.series",
+        "description": "Currently renders as bar chart. Full pictorial symbol support is optional.",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'pictorialBar'."
+          },
+          {
+            "name": "series[].data",
+            "type": "array",
+            "description": "Same as bar: value or [open, close]."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"pictorialBar\", \"data\": [100, 80, 120, 90 ] }]"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "themeRiver": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Theme River\" }"
+      },
+      {
+        "id": "series-themeRiver",
+        "title": "series (themeRiver)",
+        "optionPath": "option.series",
+        "description": "Currently renders as area. Full theme river layout is optional.",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'themeRiver'."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"themeRiver\", \"data\": [] }]"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ],
+    "calendar": [
+      {
+        "id": "title",
+        "title": "title",
+        "optionPath": "option.title",
+        "description": "Chart title.",
+        "properties": [
+          {
+            "name": "title.text",
+            "type": "string",
+            "description": "Title text."
+          }
+        ],
+        "snippet": "\"title\": { \"text\": \"Calendar\" }"
+      },
+      {
+        "id": "series-calendar",
+        "title": "series (calendar)",
+        "optionPath": "option.series",
+        "description": "Stub: use heatmap with date dimensions for similar effect.",
+        "properties": [
+          {
+            "name": "series[].type",
+            "type": "string",
+            "description": "Must be 'calendar'."
+          }
+        ],
+        "snippet": "\"series\": [{ \"type\": \"calendar\", \"data\": [] }]"
+      },
+      {
+        "id": "styling",
+        "title": "styling",
+        "optionPath": "option (styling)",
+        "description": "Global and per-component styling: background, title/legend/tooltip text, and series colors.",
+        "properties": [
+          {
+            "name": "backgroundColor",
+            "type": "string",
+            "description": "Chart background color (e.g. '#fff', 'transparent')."
+          },
+          {
+            "name": "title.textStyle",
+            "type": "object",
+            "description": "Title font: fontSize, color, fontWeight, fontFamily."
+          },
+          {
+            "name": "title.textStyle.fontSize",
+            "type": "number",
+            "default": "18",
+            "description": "Title font size (px)."
+          },
+          {
+            "name": "title.textStyle.color",
+            "type": "string",
+            "description": "Title text color."
+          },
+          {
+            "name": "title.textStyle.fontWeight",
+            "type": "string | number",
+            "description": "e.g. 'bold', 600."
+          },
+          {
+            "name": "legend.textStyle",
+            "type": "object",
+            "description": "Legend label font: fontSize, color."
+          },
+          {
+            "name": "tooltip.backgroundColor",
+            "type": "string",
+            "description": "Tooltip background color."
+          },
+          {
+            "name": "tooltip.borderColor",
+            "type": "string",
+            "description": "Tooltip border color."
+          },
+          {
+            "name": "tooltip.textStyle",
+            "type": "object",
+            "description": "Tooltip font: fontSize, color."
+          },
+          {
+            "name": "series[].itemStyle",
+            "type": "object",
+            "description": "Bars/slices/points: color, borderColor, borderWidth, borderRadius."
+          },
+          {
+            "name": "series[].lineStyle",
+            "type": "object",
+            "description": "Lines: color, width, type ('solid'|'dashed')."
+          },
+          {
+            "name": "series[].areaStyle",
+            "type": "object",
+            "description": "Area fill: color, opacity."
+          },
+          {
+            "name": "series[].label",
+            "type": "object",
+            "description": "Data labels: show, color, fontSize, formatter."
+          }
+        ],
+        "snippet": "\"backgroundColor\": \"#fafafa\",\n\"title\": { \"text\": \"My Chart\", \"textStyle\": { \"fontSize\": 20, \"color\": \"#333\" } },\n\"legend\": { \"textStyle\": { \"fontSize\": 12, \"color\": \"#666\" } },\n\"series\": [{ \"itemStyle\": { \"color\": \"#3b82f6\", \"borderRadius\": 4 } }]"
+      }
+    ]
+  },
+  "notes": {
+    "hostElement": "sky-chart",
+    "import": "@sky.ui.pro/core/sky-chart",
+    "brush": "UI-only range control; use host start/end (0–100). No plot renderer.",
+    "waterfall": "Series type waterfall; host type is often bar."
+  }
+}