@webmcp-auto-ui/agent 2.5.33 → 2.5.35

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webmcp-auto-ui/agent",
-  "version": "2.5.33",
+  "version": "2.5.35",
   "description": "LLM agent loop + remote/WASM/local providers + MCP wrapper",
   "license": "AGPL-3.0-or-later",
   "type": "module",
@@ -17,7 +17,7 @@
   "scripts": {
     "prebuild": "node ../../scripts/recipes-to-ts.js",
     "check": "tsc --noEmit",
-    "build": "node ../../scripts/recipes-to-ts.js && tsc"
+    "build": "tsc"
   },
   "publishConfig": {
     "access": "public"

package/src/index.ts

@@ -79,6 +79,14 @@ export type { RepairResult } from './auto-repair.js';
 // Pipeline trace
 export { PipelineTrace, type TraceEntry } from './pipeline-trace.js';
 
+// onnxruntime-web version pins (centralised — see ort-version.ts)
+export {
+  ORT_VERSION,
+  ORT_CDN_BASE,
+  ORT_TRANSFORMERS_VERSION,
+  ORT_TRANSFORMERS_CDN_BASE,
+} from './ort-version.js';
+
 // Trace observer — live visual trace for runAgentLoop
 export { createTraceObserver, type TraceObserver, type TraceObserverContext, type RoundTripDetail } from './trace-observer.js';
 

package/src/nano-rag/embedder.ts

@@ -9,6 +9,7 @@
  */
 
 import type * as OrtTypes from 'onnxruntime-web';
+import { ORT_CDN_BASE } from '../ort-version.js';
 
 export const EMBEDDING_DIMS = 384;
 
@@ -47,7 +48,7 @@ export class Embedder {
 
     // Use WASM backend, load WASM binaries from CDN (avoids bundling 70MB in builds)
     ort.env.wasm.numThreads = 1;
-    ort.env.wasm.wasmPaths = 'https://cdn.jsdelivr.net/npm/onnxruntime-web@1.21.0/dist/';
+    ort.env.wasm.wasmPaths = `${ORT_CDN_BASE}/dist/`;
 
     const modelUrl =
       'https://huggingface.co/Xenova/all-MiniLM-L6-v2/resolve/main/onnx/model_quantized.onnx';

package/src/ort-version.ts

@@ -0,0 +1,35 @@
+/**
+ * Centralised onnxruntime-web version pins.
+ *
+ * Two distinct usages exist in the codebase, each requiring a different ORT
+ * build, so we expose two constants rather than one:
+ *
+ * 1. STANDALONE (`ORT_VERSION` / `ORT_CDN_BASE`) — used by the nano-RAG
+ *    embedder (packages/agent/src/nano-rag/embedder.ts). The embedder does
+ *    `await import('onnxruntime-web')`, which resolves through the host app's
+ *    importmap (apps/flex, apps/notebook-viewer). The matching .wasm binaries
+ *    must be served from a CDN that mirrors the *exact* same release. We pin
+ *    1.21.0 because it is a stable release present on jsdelivr/esm.sh and
+ *    matches the embedder's tested chain.
+ *
+ * 2. TRANSFORMERS-PINNED (`ORT_TRANSFORMERS_VERSION` /
+ *    `ORT_TRANSFORMERS_CDN_BASE`) — used by transformers.worker.ts when it
+ *    loads transformers.js 4.1.0 from esm.sh. transformers.js 4.1.0 ships
+ *    with ORT 1.26.0-dev.20260410-5e55544225 internally; we override the
+ *    wasm paths to fetch the matching native binaries from jsdelivr (esm.sh
+ *    serves the JS, jsdelivr serves the .wasm). Bumping this requires
+ *    bumping the transformers.js version in lock-step.
+ *
+ * The two pins are intentionally NOT the same: mixing 1.21 wasm with the
+ * 1.26-dev JS bundle (or vice versa) crashes at runtime with cryptic
+ * "wasm backend not initialised" / signature mismatch errors.
+ */
+
+// Standalone embedder usage (nano-RAG). Stable release.
+export const ORT_VERSION = '1.21.0';
+export const ORT_CDN_BASE = `https://cdn.jsdelivr.net/npm/onnxruntime-web@${ORT_VERSION}`;
+
+// transformers.js 4.1.0 internal pin. Must match the version baked into
+// https://esm.sh/@huggingface/transformers@4.1.0.
+export const ORT_TRANSFORMERS_VERSION = '1.26.0-dev.20260410-5e55544225';
+export const ORT_TRANSFORMERS_CDN_BASE = `https://cdn.jsdelivr.net/npm/onnxruntime-web@${ORT_TRANSFORMERS_VERSION}`;

package/src/providers/transformers.worker.ts

@@ -28,6 +28,7 @@
 
 import type { ContentBlock } from '../types.js';
 import type { TransformersModelEntry } from './transformers-models.js';
+import { ORT_TRANSFORMERS_CDN_BASE } from '../ort-version.js';
 
 // --------------------------------------------------------------------------
 // Gemma 4 chat_template override.
@@ -204,7 +205,7 @@ async function loadModel(modelEntry: TransformersModelEntry): Promise<void> {
       // on jsdelivr). For the 3.8.1 path, ORT 1.22.0-dev is a transformers.js-
       // internal build not mirrored on jsdelivr — let transformers.js use its
       // default wasmPaths (which resolve against esm.sh, matching the JS bundle).
-      env.backends.onnx.wasm.wasmPaths = 'https://cdn.jsdelivr.net/npm/onnxruntime-web@1.26.0-dev.20260410-5e55544225/dist/';
+      env.backends.onnx.wasm.wasmPaths = `${ORT_TRANSFORMERS_CDN_BASE}/dist/`;
     }
     if (env) {
       env.allowLocalModels = false;

package/src/recipes/_generated.ts

@@ -1500,6 +1500,354 @@ component("table", {columns: ["Title", "Date", "NOR"], rows: results})
 - **Overly broad queries**: always use LIMIT and precise WHERE filters
 - **Displaying raw full text**: use the \`text\` component with Markdown formatting rather than dumping the JSON
 - **Forgetting to specify the text status**: an article can be repealed, amended or in force — always indicate it
+`,
+  'showcase-carto': `---
+id: showcase-cartography
+name: Showcase cartographic widgets — points, polygons, aggregations, tiles, 3D
+when: the user asks specifically for a map / cartography / geo demo, e.g. "showcase carto", "demo carto", "show me geo widgets", "what kinds of maps can you render?"
+servers: [deckgl, h3, s2, turf, maplibre]
+components_used: [deckgl-scatterplot, deckgl-arc, deckgl-polygon, deckgl-h3-hexagon, deckgl-heatmap, deckgl-tile, deckgl-trips]
+layout:
+  type: grid
+  columns: 2
+  arrangement: 7 deck.gl maps in a 2-column grid
+---
+
+## When to use
+
+The user wants to see the **cartographic capabilities** of the system. Typical phrases:
+- "Montre-moi un showcase carto"
+- "Demo cartographie"
+- "What kinds of maps / geo widgets can you render?"
+- "Showcase deckgl"
+
+This recipe covers the four major deck.gl layer families: **points/lines**, **polygons**, **aggregation** (hexagon/H3/heatmap), **tiles & animation**.
+
+## How to use
+
+Mount **7 deck.gl widgets**, each with realistic Paris-region demo data. **Do NOT** stuff all the widget names into a single \`deckgl-text\` widget — that is not a showcase, that is a label list. Each widget must render its own layer family with real geometric data.
+
+Use exact widget names and exact parameter names below. Schemas come from each widget's recipe.
+
+1. **Scatterplot** — points around Paris (\`deckgl-scatterplot\`, key: \`points\`):
+   \`\`\`
+   widget_display({name: "deckgl-scatterplot", params: {
+     points: [
+       {lng: 2.3522, lat: 48.8566, radius: 200, color: [255, 100, 100]},
+       {lng: 2.2945, lat: 48.8584, radius: 180, color: [100, 200, 255]},
+       {lng: 2.3499, lat: 48.8530, radius: 150, color: [120, 255, 120]},
+       {lng: 2.3376, lat: 48.8606, radius: 220, color: [255, 200, 80]},
+       {lng: 2.3326, lat: 48.8867, radius: 160, color: [200, 100, 255]}
+     ],
+     center: [2.3522, 48.8566], zoom: 12
+   }})
+   \`\`\`
+
+2. **Arc** — flows from Paris to other French cities (\`deckgl-arc\`, key: \`arcs\`):
+   \`\`\`
+   widget_display({name: "deckgl-arc", params: {
+     arcs: [
+       {from: [2.3522, 48.8566], to: [4.8357, 45.7640], width: 3},
+       {from: [2.3522, 48.8566], to: [5.3698, 43.2965], width: 4},
+       {from: [2.3522, 48.8566], to: [-1.5536, 47.2184], width: 2},
+       {from: [2.3522, 48.8566], to: [7.7521, 48.5734], width: 3}
+     ],
+     center: [3.5, 46.5], zoom: 5
+   }})
+   \`\`\`
+
+3. **Polygon** — three quadrilaterals around central Paris (\`deckgl-polygon\`, key: \`polygons\`, color key: \`fillColor\`):
+   \`\`\`
+   widget_display({name: "deckgl-polygon", params: {
+     polygons: [
+       {polygon: [[2.32, 48.86], [2.36, 48.86], [2.36, 48.88], [2.32, 48.88], [2.32, 48.86]], fillColor: [255, 100, 100, 120]},
+       {polygon: [[2.36, 48.86], [2.40, 48.86], [2.40, 48.88], [2.36, 48.88], [2.36, 48.86]], fillColor: [100, 200, 255, 120]},
+       {polygon: [[2.32, 48.84], [2.36, 48.84], [2.36, 48.86], [2.32, 48.86], [2.32, 48.84]], fillColor: [100, 255, 120, 120]}
+     ],
+     center: [2.35, 48.86], zoom: 12
+   }})
+   \`\`\`
+
+4. **H3 hexagon** — Uber H3 cells with values (\`deckgl-h3-hexagon\`, key: \`cells\`). If the \`h3\` server is activated, prefer to call \`latLngToCell({lat, lng, res: 8})\` first to obtain valid indices for Paris. Otherwise use known-valid Paris-area indices below:
+   \`\`\`
+   widget_display({name: "deckgl-h3-hexagon", params: {
+     cells: [
+       {hex: "881fb46625fffff", value: 12},
+       {hex: "881fb46627fffff", value: 8},
+       {hex: "881fb4662dfffff", value: 22},
+       {hex: "881fb46663fffff", value: 6},
+       {hex: "881fb46669fffff", value: 15}
+     ],
+     extruded: true, elevationScale: 30,
+     center: [2.35, 48.86], zoom: 11
+   }})
+   \`\`\`
+
+5. **Heatmap** — weighted point density (\`deckgl-heatmap\`, key: \`points\`):
+   \`\`\`
+   widget_display({name: "deckgl-heatmap", params: {
+     points: [
+       {lng: 2.35, lat: 48.86, weight: 5}, {lng: 2.36, lat: 48.86, weight: 8},
+       {lng: 2.34, lat: 48.87, weight: 3}, {lng: 2.33, lat: 48.85, weight: 12},
+       {lng: 2.37, lat: 48.88, weight: 6}, {lng: 2.32, lat: 48.84, weight: 9}
+     ],
+     center: [2.35, 48.86], zoom: 12
+   }})
+   \`\`\`
+
+6. **Tile** — OSM raster tiles (\`deckgl-tile\`, key: \`tileUrl\`):
+   \`\`\`
+   widget_display({name: "deckgl-tile", params: {
+     tileUrl: "https://tile.openstreetmap.org/{z}/{x}/{y}.png",
+     center: [2.35, 48.86], zoom: 10
+   }})
+   \`\`\`
+
+7. **Trips** — animated trajectory (\`deckgl-trips\`, key: \`trips\`):
+   \`\`\`
+   widget_display({name: "deckgl-trips", params: {
+     trips: [
+       {path: [[2.30, 48.85], [2.33, 48.86], [2.36, 48.87], [2.40, 48.88]], timestamps: [0, 200, 400, 600], color: [253, 128, 93]}
+     ],
+     trailLength: 200, animationSpeed: 1,
+     center: [2.35, 48.86], zoom: 12
+   }})
+   \`\`\`
+
+## Important
+
+- **Never** call \`deckgl-text\` with a list of widget *names* as labels. That is not a showcase.
+- Each widget must contain real geometric data (positions, polygons, H3 cells…), not labels.
+- Use exactly the parameter keys above (\`points\` not \`data\`, \`arcs\` not \`data\`, \`polygons\` not \`data\`, \`cells\` not \`data\`, \`tileUrl\` not \`url\`, \`trips\` not \`data\`).
+- If the user asks for a specific layer family, drill down into the per-widget recipe (\`scatterplot\`, \`arc\`, \`h3-hexagon\`, etc.).
+- Keep the canvas under 8 maps to stay within WebGL context limits.
+
+## Output text
+
+Return a single sentence such as: "Tour cartographique : 7 widgets deck.gl — points, arcs, polygones, H3, heatmap, tiles OSM et trajets animés."
+`,
+  'showcase-dashboard': `---
+id: showcase-dashboard
+name: Showcase analytics dashboard widgets — Tremor, ECharts, Observable Plot, Recharts, Nivo, Perspective
+when: the user asks for a dashboard / analytics / charts demo, e.g. "showcase dashboard", "demo dashboard", "show me charts", "analytics demo"
+servers: [echarts, observable-plot, recharts, nivo, perspective, tremor, chartjs, d3]
+components_used: [tremor-kpi-card, echarts-line, observable-plot-dot, recharts-bar, nivo-pie, perspective-table]
+layout:
+  type: grid
+  columns: 3
+  arrangement: KPI strip on top, then charts in a grid, table at the bottom
+---
+
+## When to use
+
+The user wants to see the **analytics / dashboard** capabilities of the system — non-cartographic visualizations powered by JS chart libraries. Typical phrases:
+- "Montre-moi un showcase dashboard"
+- "Demo analytics / charts"
+- "Show me what charts you can do"
+- "Showcase ECharts / Observable / Recharts"
+
+This recipe covers the four major dashboard widget families: **KPIs**, **time series & comparisons**, **distributions & breakdowns**, **interactive tables**.
+
+## How to use
+
+Mount **6-7 widgets** drawn from different chart libraries to demonstrate variety. Pick one widget per server when possible. **Do not collapse everything into a single chart** — the showcase value is the variety.
+
+Use exact widget names and exact parameter keys below. Schemas come from each widget's recipe.
+
+1. **3 KPI cards** in a row (\`tremor-kpi-card\`, keys: \`title\`, \`metric\`, \`delta\`, \`deltaType\`):
+   \`\`\`
+   widget_display({name: "tremor-kpi-card", params: {title: "MRR", metric: "€ 184 200", delta: "+12.4%", deltaType: "increase"}})
+   widget_display({name: "tremor-kpi-card", params: {title: "Active users", metric: "12 480", delta: "+8.2%", deltaType: "increase"}})
+   widget_display({name: "tremor-kpi-card", params: {title: "Churn", metric: "3.1 %", delta: "-0.4 pts", deltaType: "decrease"}})
+   \`\`\`
+
+2. **Time-series line chart** (\`echarts-line\`, keys: \`categories\`, \`series\`):
+   \`\`\`
+   widget_display({name: "echarts-line", params: {
+     title: "Signups vs activations",
+     categories: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug"],
+     series: [
+       {name: "Signups", data: [120, 145, 162, 198, 240, 285, 312, 358]},
+       {name: "Activations", data: [80, 102, 121, 148, 188, 225, 252, 290]}
+     ],
+     smooth: true
+   }})
+   \`\`\`
+
+3. **Scatter / dot plot** (\`observable-plot-dot\`, keys: \`data\`, \`xKey\`, \`yKey\`, \`fill\`):
+   \`\`\`
+   widget_display({name: "observable-plot-dot", params: {
+     title: "Cohort distribution",
+     data: [
+       {x: 1.2, y: 3.4, group: "A"}, {x: 2.5, y: 5.1, group: "A"}, {x: 3.8, y: 4.2, group: "B"},
+       {x: 4.1, y: 6.8, group: "B"}, {x: 5.4, y: 5.9, group: "C"}, {x: 6.2, y: 7.3, group: "C"},
+       {x: 7.0, y: 6.1, group: "A"}, {x: 8.3, y: 8.4, group: "B"}
+     ],
+     xKey: "x", yKey: "y", fill: "group", tip: true
+   }})
+   \`\`\`
+
+4. **Bar chart** (\`recharts-bar\`, keys: \`rows\`, \`bars\`, \`xKey\`):
+   \`\`\`
+   widget_display({name: "recharts-bar", params: {
+     title: "Users by plan",
+     rows: [
+       {plan: "Free", users: 8420},
+       {plan: "Pro", users: 3120},
+       {plan: "Team", users: 740},
+       {plan: "Enterprise", users: 200}
+     ],
+     xKey: "plan",
+     bars: [{dataKey: "users", color: "#4f8cff"}]
+   }})
+   \`\`\`
+
+5. **Pie / donut** (\`nivo-pie\`, key: \`data\` with \`{id, label, value}\`):
+   \`\`\`
+   widget_display({name: "nivo-pie", params: {
+     data: [
+       {id: "direct",  label: "Direct",  value: 38},
+       {id: "search",  label: "Search",  value: 27},
+       {id: "ref",     label: "Referral", value: 18},
+       {id: "social",  label: "Social",  value: 12},
+       {id: "email",   label: "Email",   value: 5}
+     ],
+     innerRadius: 0.5
+   }})
+   \`\`\`
+
+6. **Interactive datagrid** (\`perspective-table\`, key: \`rows\`):
+   \`\`\`
+   widget_display({name: "perspective-table", params: {
+     title: "Revenue by region & plan",
+     rows: [
+       {date: "2026-01", region: "EU", plan: "Pro",  revenue: 18400},
+       {date: "2026-01", region: "US", plan: "Pro",  revenue: 22100},
+       {date: "2026-02", region: "EU", plan: "Pro",  revenue: 19800},
+       {date: "2026-02", region: "US", plan: "Pro",  revenue: 24200},
+       {date: "2026-03", region: "EU", plan: "Team", revenue: 31200},
+       {date: "2026-03", region: "US", plan: "Team", revenue: 38400}
+     ]
+   }})
+   \`\`\`
+
+7. **Optional 7th widget** for extra variety, if the corresponding server is activated:
+   - \`chartjs-radar\` (multi-axis comparison),
+   - \`nivo-radar\` (alternative radar),
+   - \`d3-force-graph\` (mini network),
+   - \`recharts-area\` (stacked area).
+
+## Important
+
+- **Variety wins**: pick widgets from *different* libraries. Don't stack 5 ECharts widgets — the goal is to demonstrate the breadth of the dashboard ecosystem.
+- Use exactly the parameter keys above (\`metric\` not \`value\`, \`delta\` not \`trend\`, \`deltaType\` not \`trendDir\`, \`categories\` not \`xAxis\`, \`rows\` not \`data\` for recharts-bar / perspective-table, \`fill\` not \`color\` for observable-plot-dot).
+- Use realistic dashboard data (revenue, users, traffic sources, plans, regions). Avoid abstract \`[1, 2, 3]\` series.
+- For a **cartography**-focused showcase, use \`showcase-carto\` instead.
+- For a **mixed** showcase (carto + dashboard + others), use \`showcase\`.
+
+## Output text
+
+Return a single sentence such as: "Showcase dashboard : 6 widgets — KPIs Tremor, série ECharts, scatter Observable Plot, bar Recharts, pie Nivo, table Perspective."
+`,
+  'showcase': `---
+id: showcase-mixed-widgets
+name: Showcase a mix of widgets across categories
+components_used: [stat-card, chart-rich, data-table, deckgl-scatterplot, kv]
+when: the user asks for a generic widget showcase, demo, or sampler — phrases like "show me widgets", "demo", "showcase", "what can you display?"
+servers: [autoui, deckgl]
+layout:
+  type: grid
+  columns: 3
+  arrangement: KPIs row, then a chart and a table side-by-side, then a map and a kv
+---
+
+## When to use
+
+The user wants to see what kinds of widgets the system can render, without specifying a topic. Typical phrases:
+- "Montre-moi des widgets pour tester"
+- "Show me a demo / a showcase"
+- "What can you render?"
+- "I just want to see widgets"
+
+This recipe deliberately covers **multiple widget families** (KPI, chart, table, map, key/value) so the user gets a representative sampler in a single canvas.
+
+## How to use
+
+Mount **6 widgets** in this order, each with realistic demo data. **Do NOT list widget names as text labels on a map** — that defeats the purpose. Each widget must render real data of its own type.
+
+Use exact widget names and exact parameter keys below.
+
+1. **3 stat-cards** in a row (\`stat-card\`, keys: \`label\`, \`value\`, \`delta?\`, \`unit?\`):
+   \`\`\`
+   widget_display({name: "stat-card", params: {label: "Active users", value: 12480, unit: "users", delta: 8.2, variant: "success"}})
+   widget_display({name: "stat-card", params: {label: "Revenue (Q1)", value: 184200, unit: "€", delta: 12.4, variant: "success"}})
+   widget_display({name: "stat-card", params: {label: "Churn", value: 3.1, unit: "%", delta: -0.4, variant: "warning"}})
+   \`\`\`
+
+2. **A chart** (\`chart-rich\`, keys: \`type\`, \`labels\`, \`data\`):
+   \`\`\`
+   widget_display({name: "chart-rich", params: {
+     title: "Signups (last 6 months)",
+     type: "line",
+     labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun"],
+     data: [{label: "Signups", values: [120, 145, 162, 198, 240, 285]}]
+   }})
+   \`\`\`
+
+3. **A table** (\`data-table\`, keys: \`rows\`, \`columns\`):
+   \`\`\`
+   widget_display({name: "data-table", params: {
+     title: "Plans",
+     columns: [
+       {key: "plan", label: "Plan"},
+       {key: "users", label: "Users"},
+       {key: "mrr", label: "MRR"},
+       {key: "delta", label: "Δ 30d"}
+     ],
+     rows: [
+       {plan: "Free", users: 8420, mrr: "€0", delta: "+5%"},
+       {plan: "Pro", users: 3120, mrr: "€62 400", delta: "+11%"},
+       {plan: "Team", users: 740, mrr: "€88 800", delta: "+18%"},
+       {plan: "Enterprise", users: 200, mrr: "€33 000", delta: "+4%"}
+     ]
+   }})
+   \`\`\`
+
+4. **A map** with a few markers (\`deckgl-scatterplot\`, key: \`points\`):
+   \`\`\`
+   widget_display({name: "deckgl-scatterplot", params: {
+     points: [
+       {lng: 2.3522, lat: 48.8566, radius: 600, color: [255, 100, 100]},
+       {lng: 4.8357, lat: 45.7640, radius: 500, color: [100, 200, 255]},
+       {lng: 5.3698, lat: 43.2965, radius: 500, color: [120, 255, 120]}
+     ],
+     center: [3.5, 46.5], zoom: 5
+   }})
+   \`\`\`
+
+5. **A kv** for metadata / sources (\`kv\`, key: \`rows\` with \`[[k, v], ...]\`):
+   \`\`\`
+   widget_display({name: "kv", params: {
+     title: "About this showcase",
+     rows: [
+       ["Source", "Demo dataset"],
+       ["Generated", "live"],
+       ["Refreshed", "just now"]
+     ]
+   }})
+   \`\`\`
+
+## Important
+
+- **Do NOT** call a single text/label widget that only contains widget *names*. Each widget shown must be a different visual type with its own real data.
+- For \`kv\`, the property is \`rows\` (not \`pairs\`), and each item is a \`[key, value]\` array of strings.
+- For \`chart\`, values are \`[label, value]\` tuples; for \`chart-rich\`, values are objects \`{label, values}\` with parallel arrays — pick the matching shape.
+- For a **cartography**-only showcase use \`showcase-carto\`; for a **dashboard / charts** showcase use \`showcase-dashboard\`.
+- Keep total widgets between 5 and 8 — beyond that the canvas becomes unreadable.
+
+## Output text
+
+After the tool calls, return a single sentence such as: "Voici un échantillon de 5 widgets — KPIs, courbe, table, carte et métadonnées."
 `,
   'weather-viz': `---
 id: visualize-weather-forecasts-with-charts-and-kpis

package/src/recipes/showcase-carto.md

@@ -0,0 +1,124 @@
+---
+id: showcase-cartography
+name: Showcase cartographic widgets — points, polygons, aggregations, tiles, 3D
+when: the user asks specifically for a map / cartography / geo demo, e.g. "showcase carto", "demo carto", "show me geo widgets", "what kinds of maps can you render?"
+servers: [deckgl, h3, s2, turf, maplibre]
+components_used: [deckgl-scatterplot, deckgl-arc, deckgl-polygon, deckgl-h3-hexagon, deckgl-heatmap, deckgl-tile, deckgl-trips]
+layout:
+  type: grid
+  columns: 2
+  arrangement: 7 deck.gl maps in a 2-column grid
+---
+
+## When to use
+
+The user wants to see the **cartographic capabilities** of the system. Typical phrases:
+- "Montre-moi un showcase carto"
+- "Demo cartographie"
+- "What kinds of maps / geo widgets can you render?"
+- "Showcase deckgl"
+
+This recipe covers the four major deck.gl layer families: **points/lines**, **polygons**, **aggregation** (hexagon/H3/heatmap), **tiles & animation**.
+
+## How to use
+
+Mount **7 deck.gl widgets**, each with realistic Paris-region demo data. **Do NOT** stuff all the widget names into a single `deckgl-text` widget — that is not a showcase, that is a label list. Each widget must render its own layer family with real geometric data.
+
+Use exact widget names and exact parameter names below. Schemas come from each widget's recipe.
+
+1. **Scatterplot** — points around Paris (`deckgl-scatterplot`, key: `points`):
+   ```
+   widget_display({name: "deckgl-scatterplot", params: {
+     points: [
+       {lng: 2.3522, lat: 48.8566, radius: 200, color: [255, 100, 100]},
+       {lng: 2.2945, lat: 48.8584, radius: 180, color: [100, 200, 255]},
+       {lng: 2.3499, lat: 48.8530, radius: 150, color: [120, 255, 120]},
+       {lng: 2.3376, lat: 48.8606, radius: 220, color: [255, 200, 80]},
+       {lng: 2.3326, lat: 48.8867, radius: 160, color: [200, 100, 255]}
+     ],
+     center: [2.3522, 48.8566], zoom: 12
+   }})
+   ```
+
+2. **Arc** — flows from Paris to other French cities (`deckgl-arc`, key: `arcs`):
+   ```
+   widget_display({name: "deckgl-arc", params: {
+     arcs: [
+       {from: [2.3522, 48.8566], to: [4.8357, 45.7640], width: 3},
+       {from: [2.3522, 48.8566], to: [5.3698, 43.2965], width: 4},
+       {from: [2.3522, 48.8566], to: [-1.5536, 47.2184], width: 2},
+       {from: [2.3522, 48.8566], to: [7.7521, 48.5734], width: 3}
+     ],
+     center: [3.5, 46.5], zoom: 5
+   }})
+   ```
+
+3. **Polygon** — three quadrilaterals around central Paris (`deckgl-polygon`, key: `polygons`, color key: `fillColor`):
+   ```
+   widget_display({name: "deckgl-polygon", params: {
+     polygons: [
+       {polygon: [[2.32, 48.86], [2.36, 48.86], [2.36, 48.88], [2.32, 48.88], [2.32, 48.86]], fillColor: [255, 100, 100, 120]},
+       {polygon: [[2.36, 48.86], [2.40, 48.86], [2.40, 48.88], [2.36, 48.88], [2.36, 48.86]], fillColor: [100, 200, 255, 120]},
+       {polygon: [[2.32, 48.84], [2.36, 48.84], [2.36, 48.86], [2.32, 48.86], [2.32, 48.84]], fillColor: [100, 255, 120, 120]}
+     ],
+     center: [2.35, 48.86], zoom: 12
+   }})
+   ```
+
+4. **H3 hexagon** — Uber H3 cells with values (`deckgl-h3-hexagon`, key: `cells`). If the `h3` server is activated, prefer to call `latLngToCell({lat, lng, res: 8})` first to obtain valid indices for Paris. Otherwise use known-valid Paris-area indices below:
+   ```
+   widget_display({name: "deckgl-h3-hexagon", params: {
+     cells: [
+       {hex: "881fb46625fffff", value: 12},
+       {hex: "881fb46627fffff", value: 8},
+       {hex: "881fb4662dfffff", value: 22},
+       {hex: "881fb46663fffff", value: 6},
+       {hex: "881fb46669fffff", value: 15}
+     ],
+     extruded: true, elevationScale: 30,
+     center: [2.35, 48.86], zoom: 11
+   }})
+   ```
+
+5. **Heatmap** — weighted point density (`deckgl-heatmap`, key: `points`):
+   ```
+   widget_display({name: "deckgl-heatmap", params: {
+     points: [
+       {lng: 2.35, lat: 48.86, weight: 5}, {lng: 2.36, lat: 48.86, weight: 8},
+       {lng: 2.34, lat: 48.87, weight: 3}, {lng: 2.33, lat: 48.85, weight: 12},
+       {lng: 2.37, lat: 48.88, weight: 6}, {lng: 2.32, lat: 48.84, weight: 9}
+     ],
+     center: [2.35, 48.86], zoom: 12
+   }})
+   ```
+
+6. **Tile** — OSM raster tiles (`deckgl-tile`, key: `tileUrl`):
+   ```
+   widget_display({name: "deckgl-tile", params: {
+     tileUrl: "https://tile.openstreetmap.org/{z}/{x}/{y}.png",
+     center: [2.35, 48.86], zoom: 10
+   }})
+   ```
+
+7. **Trips** — animated trajectory (`deckgl-trips`, key: `trips`):
+   ```
+   widget_display({name: "deckgl-trips", params: {
+     trips: [
+       {path: [[2.30, 48.85], [2.33, 48.86], [2.36, 48.87], [2.40, 48.88]], timestamps: [0, 200, 400, 600], color: [253, 128, 93]}
+     ],
+     trailLength: 200, animationSpeed: 1,
+     center: [2.35, 48.86], zoom: 12
+   }})
+   ```
+
+## Important
+
+- **Never** call `deckgl-text` with a list of widget *names* as labels. That is not a showcase.
+- Each widget must contain real geometric data (positions, polygons, H3 cells…), not labels.
+- Use exactly the parameter keys above (`points` not `data`, `arcs` not `data`, `polygons` not `data`, `cells` not `data`, `tileUrl` not `url`, `trips` not `data`).
+- If the user asks for a specific layer family, drill down into the per-widget recipe (`scatterplot`, `arc`, `h3-hexagon`, etc.).
+- Keep the canvas under 8 maps to stay within WebGL context limits.
+
+## Output text
+
+Return a single sentence such as: "Tour cartographique : 7 widgets deck.gl — points, arcs, polygones, H3, heatmap, tiles OSM et trajets animés."

package/src/recipes/showcase-dashboard.md

@@ -0,0 +1,122 @@
+---
+id: showcase-dashboard
+name: Showcase analytics dashboard widgets — Tremor, ECharts, Observable Plot, Recharts, Nivo, Perspective
+when: the user asks for a dashboard / analytics / charts demo, e.g. "showcase dashboard", "demo dashboard", "show me charts", "analytics demo"
+servers: [echarts, observable-plot, recharts, nivo, perspective, tremor, chartjs, d3]
+components_used: [tremor-kpi-card, echarts-line, observable-plot-dot, recharts-bar, nivo-pie, perspective-table]
+layout:
+  type: grid
+  columns: 3
+  arrangement: KPI strip on top, then charts in a grid, table at the bottom
+---
+
+## When to use
+
+The user wants to see the **analytics / dashboard** capabilities of the system — non-cartographic visualizations powered by JS chart libraries. Typical phrases:
+- "Montre-moi un showcase dashboard"
+- "Demo analytics / charts"
+- "Show me what charts you can do"
+- "Showcase ECharts / Observable / Recharts"
+
+This recipe covers the four major dashboard widget families: **KPIs**, **time series & comparisons**, **distributions & breakdowns**, **interactive tables**.
+
+## How to use
+
+Mount **6-7 widgets** drawn from different chart libraries to demonstrate variety. Pick one widget per server when possible. **Do not collapse everything into a single chart** — the showcase value is the variety.
+
+Use exact widget names and exact parameter keys below. Schemas come from each widget's recipe.
+
+1. **3 KPI cards** in a row (`tremor-kpi-card`, keys: `title`, `metric`, `delta`, `deltaType`):
+   ```
+   widget_display({name: "tremor-kpi-card", params: {title: "MRR", metric: "€ 184 200", delta: "+12.4%", deltaType: "increase"}})
+   widget_display({name: "tremor-kpi-card", params: {title: "Active users", metric: "12 480", delta: "+8.2%", deltaType: "increase"}})
+   widget_display({name: "tremor-kpi-card", params: {title: "Churn", metric: "3.1 %", delta: "-0.4 pts", deltaType: "decrease"}})
+   ```
+
+2. **Time-series line chart** (`echarts-line`, keys: `categories`, `series`):
+   ```
+   widget_display({name: "echarts-line", params: {
+     title: "Signups vs activations",
+     categories: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug"],
+     series: [
+       {name: "Signups", data: [120, 145, 162, 198, 240, 285, 312, 358]},
+       {name: "Activations", data: [80, 102, 121, 148, 188, 225, 252, 290]}
+     ],
+     smooth: true
+   }})
+   ```
+
+3. **Scatter / dot plot** (`observable-plot-dot`, keys: `data`, `xKey`, `yKey`, `fill`):
+   ```
+   widget_display({name: "observable-plot-dot", params: {
+     title: "Cohort distribution",
+     data: [
+       {x: 1.2, y: 3.4, group: "A"}, {x: 2.5, y: 5.1, group: "A"}, {x: 3.8, y: 4.2, group: "B"},
+       {x: 4.1, y: 6.8, group: "B"}, {x: 5.4, y: 5.9, group: "C"}, {x: 6.2, y: 7.3, group: "C"},
+       {x: 7.0, y: 6.1, group: "A"}, {x: 8.3, y: 8.4, group: "B"}
+     ],
+     xKey: "x", yKey: "y", fill: "group", tip: true
+   }})
+   ```
+
+4. **Bar chart** (`recharts-bar`, keys: `rows`, `bars`, `xKey`):
+   ```
+   widget_display({name: "recharts-bar", params: {
+     title: "Users by plan",
+     rows: [
+       {plan: "Free", users: 8420},
+       {plan: "Pro", users: 3120},
+       {plan: "Team", users: 740},
+       {plan: "Enterprise", users: 200}
+     ],
+     xKey: "plan",
+     bars: [{dataKey: "users", color: "#4f8cff"}]
+   }})
+   ```
+
+5. **Pie / donut** (`nivo-pie`, key: `data` with `{id, label, value}`):
+   ```
+   widget_display({name: "nivo-pie", params: {
+     data: [
+       {id: "direct",  label: "Direct",  value: 38},
+       {id: "search",  label: "Search",  value: 27},
+       {id: "ref",     label: "Referral", value: 18},
+       {id: "social",  label: "Social",  value: 12},
+       {id: "email",   label: "Email",   value: 5}
+     ],
+     innerRadius: 0.5
+   }})
+   ```
+
+6. **Interactive datagrid** (`perspective-table`, key: `rows`):
+   ```
+   widget_display({name: "perspective-table", params: {
+     title: "Revenue by region & plan",
+     rows: [
+       {date: "2026-01", region: "EU", plan: "Pro",  revenue: 18400},
+       {date: "2026-01", region: "US", plan: "Pro",  revenue: 22100},
+       {date: "2026-02", region: "EU", plan: "Pro",  revenue: 19800},
+       {date: "2026-02", region: "US", plan: "Pro",  revenue: 24200},
+       {date: "2026-03", region: "EU", plan: "Team", revenue: 31200},
+       {date: "2026-03", region: "US", plan: "Team", revenue: 38400}
+     ]
+   }})
+   ```
+
+7. **Optional 7th widget** for extra variety, if the corresponding server is activated:
+   - `chartjs-radar` (multi-axis comparison),
+   - `nivo-radar` (alternative radar),
+   - `d3-force-graph` (mini network),
+   - `recharts-area` (stacked area).
+
+## Important
+
+- **Variety wins**: pick widgets from *different* libraries. Don't stack 5 ECharts widgets — the goal is to demonstrate the breadth of the dashboard ecosystem.
+- Use exactly the parameter keys above (`metric` not `value`, `delta` not `trend`, `deltaType` not `trendDir`, `categories` not `xAxis`, `rows` not `data` for recharts-bar / perspective-table, `fill` not `color` for observable-plot-dot).
+- Use realistic dashboard data (revenue, users, traffic sources, plans, regions). Avoid abstract `[1, 2, 3]` series.
+- For a **cartography**-focused showcase, use `showcase-carto` instead.
+- For a **mixed** showcase (carto + dashboard + others), use `showcase`.
+
+## Output text
+
+Return a single sentence such as: "Showcase dashboard : 6 widgets — KPIs Tremor, série ECharts, scatter Observable Plot, bar Recharts, pie Nivo, table Perspective."

package/src/recipes/showcase.md

@@ -0,0 +1,99 @@
+---
+id: showcase-mixed-widgets
+name: Showcase a mix of widgets across categories
+components_used: [stat-card, chart-rich, data-table, deckgl-scatterplot, kv]
+when: the user asks for a generic widget showcase, demo, or sampler — phrases like "show me widgets", "demo", "showcase", "what can you display?"
+servers: [autoui, deckgl]
+layout:
+  type: grid
+  columns: 3
+  arrangement: KPIs row, then a chart and a table side-by-side, then a map and a kv
+---
+
+## When to use
+
+The user wants to see what kinds of widgets the system can render, without specifying a topic. Typical phrases:
+- "Montre-moi des widgets pour tester"
+- "Show me a demo / a showcase"
+- "What can you render?"
+- "I just want to see widgets"
+
+This recipe deliberately covers **multiple widget families** (KPI, chart, table, map, key/value) so the user gets a representative sampler in a single canvas.
+
+## How to use
+
+Mount **6 widgets** in this order, each with realistic demo data. **Do NOT list widget names as text labels on a map** — that defeats the purpose. Each widget must render real data of its own type.
+
+Use exact widget names and exact parameter keys below.
+
+1. **3 stat-cards** in a row (`stat-card`, keys: `label`, `value`, `delta?`, `unit?`):
+   ```
+   widget_display({name: "stat-card", params: {label: "Active users", value: 12480, unit: "users", delta: 8.2, variant: "success"}})
+   widget_display({name: "stat-card", params: {label: "Revenue (Q1)", value: 184200, unit: "€", delta: 12.4, variant: "success"}})
+   widget_display({name: "stat-card", params: {label: "Churn", value: 3.1, unit: "%", delta: -0.4, variant: "warning"}})
+   ```
+
+2. **A chart** (`chart-rich`, keys: `type`, `labels`, `data`):
+   ```
+   widget_display({name: "chart-rich", params: {
+     title: "Signups (last 6 months)",
+     type: "line",
+     labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun"],
+     data: [{label: "Signups", values: [120, 145, 162, 198, 240, 285]}]
+   }})
+   ```
+
+3. **A table** (`data-table`, keys: `rows`, `columns`):
+   ```
+   widget_display({name: "data-table", params: {
+     title: "Plans",
+     columns: [
+       {key: "plan", label: "Plan"},
+       {key: "users", label: "Users"},
+       {key: "mrr", label: "MRR"},
+       {key: "delta", label: "Δ 30d"}
+     ],
+     rows: [
+       {plan: "Free", users: 8420, mrr: "€0", delta: "+5%"},
+       {plan: "Pro", users: 3120, mrr: "€62 400", delta: "+11%"},
+       {plan: "Team", users: 740, mrr: "€88 800", delta: "+18%"},
+       {plan: "Enterprise", users: 200, mrr: "€33 000", delta: "+4%"}
+     ]
+   }})
+   ```
+
+4. **A map** with a few markers (`deckgl-scatterplot`, key: `points`):
+   ```
+   widget_display({name: "deckgl-scatterplot", params: {
+     points: [
+       {lng: 2.3522, lat: 48.8566, radius: 600, color: [255, 100, 100]},
+       {lng: 4.8357, lat: 45.7640, radius: 500, color: [100, 200, 255]},
+       {lng: 5.3698, lat: 43.2965, radius: 500, color: [120, 255, 120]}
+     ],
+     center: [3.5, 46.5], zoom: 5
+   }})
+   ```
+
+5. **A kv** for metadata / sources (`kv`, key: `rows` with `[[k, v], ...]`):
+   ```
+   widget_display({name: "kv", params: {
+     title: "About this showcase",
+     rows: [
+       ["Source", "Demo dataset"],
+       ["Generated", "live"],
+       ["Refreshed", "just now"]
+     ]
+   }})
+   ```
+
+## Important
+
+- **Do NOT** call a single text/label widget that only contains widget *names*. Each widget shown must be a different visual type with its own real data.
+- For `kv`, the property is `rows` (not `pairs`), and each item is a `[key, value]` array of strings.
+- For `chart`, values are `[label, value]` tuples; for `chart-rich`, values are objects `{label, values}` with parallel arrays — pick the matching shape.
+- For a **cartography**-only showcase use `showcase-carto`; for a **dashboard / charts** showcase use `showcase-dashboard`.
+- Keep total widgets between 5 and 8 — beyond that the canvas becomes unreadable.
+
+## Output text
+
+After the tool calls, return a single sentence such as: "Voici un échantillon de 5 widgets — KPIs, courbe, table, carte et métadonnées."

package/tsconfig.json

@@ -8,7 +8,8 @@
     "skipLibCheck": true,
     "outDir": "./dist",
     "rootDir": "./src",
-    "declaration": true
+    "declaration": true,
+    "incremental": true
   },
   "include": ["src/**/*.ts"],
   "exclude": ["dist", "node_modules", "src/**/*.worker.ts", "src/**/*.worker.legacy.ts"]