semiotic 3.8.1 → 3.8.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CLAUDE.md +3 -1
- package/README.md +53 -52
- package/ai/behaviorContracts.cjs +9 -0
- package/ai/dist/mcp-server.js +142 -13
- package/ai/schema.json +616 -42
- package/ai/surface-manifest.json +1 -1
- package/ai/system-prompt.md +5 -2
- package/dist/chunk-OrdinalBrushOverlay-PXHQYDB2.module.min.js +2 -0
- package/dist/chunk-XYBrushOverlay-ECZJJLAJ.module.min.js +1 -0
- package/dist/chunk-XYBrushOverlay-EP2SV3UI.module.min.js +2 -0
- package/dist/chunk-chunk-255KDHW5.module.min.js +1 -0
- package/dist/chunk-chunk-27HVVXS6.module.min.js +1 -0
- package/dist/chunk-chunk-2CXCXRB4.module.min.js +1 -0
- package/dist/chunk-chunk-2JGJ5GUG.module.min.js +2 -0
- package/dist/chunk-chunk-2UN3ANRN.module.min.js +2 -0
- package/dist/chunk-chunk-2VUEY5TH.module.min.js +1 -0
- package/dist/chunk-chunk-2WVCH4PL.module.min.js +1 -0
- package/dist/chunk-chunk-5UKL5W76.module.min.js +2 -0
- package/dist/chunk-chunk-5WEFWNUW.module.min.js +2 -0
- package/dist/chunk-chunk-6F6GEAQU.module.min.js +1 -0
- package/dist/chunk-chunk-7LHMKRKE.module.min.js +2 -0
- package/dist/chunk-chunk-BHYTYMY2.module.min.js +2 -0
- package/dist/chunk-chunk-C6EJ4IOD.module.min.js +2 -0
- package/dist/chunk-chunk-CA3YDW6F.module.min.js +1 -0
- package/dist/chunk-chunk-CP3EN6KZ.module.min.js +1 -0
- package/dist/chunk-chunk-CYIML3AV.module.min.js +2 -0
- package/dist/chunk-chunk-DNY43POY.module.min.js +1 -0
- package/dist/chunk-chunk-DSNGDNJY.module.min.js +1 -0
- package/dist/chunk-chunk-E7MIQX7D.module.min.js +2 -0
- package/dist/chunk-chunk-EMO5NUGE.module.min.js +1 -0
- package/dist/chunk-chunk-ES4DCG3L.module.min.js +1 -0
- package/dist/chunk-chunk-FAKO3RGQ.module.min.js +2 -0
- package/dist/chunk-chunk-FYY2ACNJ.module.min.js +2 -0
- package/dist/chunk-chunk-G7WFWHAD.module.min.js +2 -0
- package/dist/chunk-chunk-GMQ5AYTD.module.min.js +1 -0
- package/dist/chunk-chunk-H4PPRW6N.module.min.js +1 -0
- package/dist/chunk-chunk-IFYPMWKY.module.min.js +1 -0
- package/dist/chunk-chunk-J3ELI22J.module.min.js +1 -0
- package/dist/chunk-chunk-J3QOW4OE.module.min.js +0 -0
- package/dist/chunk-chunk-J3XWETBJ.module.min.js +2 -0
- package/dist/chunk-chunk-JCG72SGW.module.min.js +2 -0
- package/dist/{semiotic-ai-chunk-OG7BQUUW.module.min.js → chunk-chunk-JJ2OOIET.module.min.js} +0 -1
- package/dist/chunk-chunk-KTWEBFMX.module.min.js +2 -0
- package/dist/chunk-chunk-L6D3I3V7.module.min.js +2 -0
- package/dist/chunk-chunk-M337NY6L.module.min.js +1 -0
- package/dist/chunk-chunk-NO4MCQVD.module.min.js +1 -0
- package/dist/chunk-chunk-ODUZEEBH.module.min.js +2 -0
- package/dist/chunk-chunk-P6UBCMSQ.module.min.js +2 -0
- package/dist/chunk-chunk-Q2YADC2V.module.min.js +2 -0
- package/dist/chunk-chunk-QRIBHZYW.module.min.js +1 -0
- package/dist/chunk-chunk-QSQVBIJA.module.min.js +1 -0
- package/dist/chunk-chunk-RCF52Z42.module.min.js +2 -0
- package/dist/chunk-chunk-RH5TSQPH.module.min.js +1 -0
- package/dist/chunk-chunk-ROP4HI7H.module.min.js +2 -0
- package/dist/chunk-chunk-RZH7VZYS.module.min.js +2 -0
- package/dist/chunk-chunk-SIRIJ3DY.module.min.js +1 -0
- package/dist/chunk-chunk-STZFFTAN.module.min.js +2 -0
- package/dist/chunk-chunk-SV4XAZ3Q.module.min.js +1 -0
- package/dist/chunk-chunk-T27ZEV6A.module.min.js +1 -0
- package/dist/chunk-chunk-U3AGQ5EF.module.min.js +2 -0
- package/dist/chunk-chunk-U66USBWU.module.min.js +1 -0
- package/dist/chunk-chunk-VVCA3DB7.module.min.js +1 -0
- package/dist/chunk-chunk-W3DB2MN4.module.min.js +2 -0
- package/dist/chunk-chunk-WCX6U47H.module.min.js +2 -0
- package/dist/chunk-chunk-WDIN4LRC.module.min.js +1 -0
- package/dist/chunk-chunk-XEVJDUTH.module.min.js +1 -0
- package/dist/chunk-chunk-XOYX77KF.module.min.js +2 -0
- package/dist/chunk-chunk-YCQYG6J5.module.min.js +2 -0
- package/dist/chunk-chunk-YHNZCPOZ.module.min.js +2 -0
- package/dist/chunk-chunk-YWZB3KPI.module.min.js +2 -0
- package/dist/chunk-chunk-Z5KXAVQD.module.min.js +2 -0
- package/dist/chunk-chunk-ZCNBUZPL.module.min.js +2 -0
- package/dist/chunk-chunk-ZLKRTF5N.module.min.js +2 -0
- package/dist/chunk-chunk-ZTNVDWAK.module.min.js +2 -0
- package/dist/chunk-statisticalOverlays-6MVAK5RW.module.min.js +2 -0
- package/dist/components/charts/physics/PhysicalFlowChart.d.ts +7 -0
- package/dist/components/charts/shared/auditAccessibilityText.d.ts +13 -0
- package/dist/components/server/staticSVGChrome.d.ts +3 -2
- package/dist/components/stream/OrdinalBrushOverlay.d.ts +1 -2
- package/dist/components/stream/OrdinalBrushOverlayLazy.d.ts +9 -0
- package/dist/components/stream/XYBrushOverlayLazy.d.ts +17 -0
- package/dist/controls.min.js +1 -1
- package/dist/controls.module.min.js +1 -1
- package/dist/geo.min.js +1 -1
- package/dist/geo.module.min.js +1 -1
- package/dist/network.min.js +1 -1
- package/dist/network.module.min.js +1 -1
- package/dist/ordinal.min.js +1 -1
- package/dist/ordinal.module.min.js +1 -1
- package/dist/physics-matter.min.js +1 -1
- package/dist/physics-matter.module.min.js +1 -1
- package/dist/physics-rapier.min.js +1 -1
- package/dist/physics-rapier.module.min.js +1 -1
- package/dist/physics.min.js +1 -1
- package/dist/physics.module.min.js +1 -1
- package/dist/realtime.min.js +1 -1
- package/dist/realtime.module.min.js +1 -1
- package/dist/rough.min.js +1 -1
- package/dist/rough.module.min.js +1 -1
- package/dist/semiotic-ai-core.min.js +1 -1
- package/dist/semiotic-ai-core.module.min.js +1 -1
- package/dist/semiotic-ai.min.js +1 -1
- package/dist/semiotic-ai.module.min.js +1 -1
- package/dist/semiotic-data.min.js +1 -1
- package/dist/semiotic-data.module.min.js +1 -1
- package/dist/semiotic-experimental.min.js +1 -1
- package/dist/semiotic-experimental.module.min.js +1 -1
- package/dist/semiotic-realtime-core.min.js +1 -1
- package/dist/semiotic-realtime-core.module.min.js +1 -1
- package/dist/semiotic-realtime-react.min.js +1 -1
- package/dist/semiotic-realtime-react.module.min.js +1 -1
- package/dist/semiotic-recipes-core.min.js +1 -1
- package/dist/semiotic-recipes-core.module.min.js +1 -1
- package/dist/semiotic-recipes-react.min.js +1 -1
- package/dist/semiotic-recipes-react.module.min.js +1 -1
- package/dist/semiotic-recipes.min.js +1 -1
- package/dist/semiotic-recipes.module.min.js +1 -1
- package/dist/semiotic-server-edge.min.js +1 -1
- package/dist/semiotic-server-edge.module.min.js +1 -1
- package/dist/semiotic-server-node.min.js +1 -1
- package/dist/semiotic-server-node.module.min.js +1 -1
- package/dist/semiotic-themes-core.min.js +1 -1
- package/dist/semiotic-themes-core.module.min.js +1 -1
- package/dist/semiotic-themes-react.min.js +1 -1
- package/dist/semiotic-themes-react.module.min.js +1 -1
- package/dist/semiotic-themes.min.js +1 -1
- package/dist/semiotic-themes.module.min.js +1 -1
- package/dist/semiotic-utils-core.min.js +1 -1
- package/dist/semiotic-utils-core.module.min.js +1 -1
- package/dist/semiotic-utils-react.min.js +1 -1
- package/dist/semiotic-utils-react.module.min.js +1 -1
- package/dist/semiotic-utils.min.js +1 -1
- package/dist/semiotic-utils.module.min.js +1 -1
- package/dist/semiotic-value.min.js +1 -1
- package/dist/semiotic-value.module.min.js +1 -1
- package/dist/semiotic.min.js +1 -1
- package/dist/semiotic.module.min.js +1 -1
- package/dist/server.min.js +1 -1
- package/dist/server.module.min.js +1 -1
- package/dist/xy.min.js +1 -1
- package/dist/xy.module.min.js +1 -1
- package/package.json +4 -4
- package/dist/semiotic-ai-statisticalOverlays-CY4WKR4A.module.min.js +0 -2
- package/dist/semiotic-chunk-3FSVZ46U.module.min.js +0 -2
- package/dist/semiotic-statisticalOverlays-UOMSFKVJ.module.min.js +0 -2
- package/dist/xy-chunk-IWD6IB6V.module.min.js +0 -2
- package/dist/xy-statisticalOverlays-7RWG6LJT.module.min.js +0 -2
package/CLAUDE.md
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
- Install: `npm install semiotic`
|
|
5
5
|
<!-- semiotic-bundle-sizes:start -->
|
|
6
6
|
<!-- Auto-generated by scripts/sync-bundle-sizes.mjs — do not edit by hand. -->
|
|
7
|
-
- **Use sub-path imports** — `semiotic/xy` (
|
|
7
|
+
- **Use sub-path imports** — `semiotic/xy` (134KB gz), `semiotic/ordinal` (115KB gz), `semiotic/network` (121KB gz), `semiotic/geo` (94KB gz), `semiotic/realtime` (147KB gz), `semiotic/realtime/core` (140KB gz), `semiotic/realtime/react` (1KB gz), `semiotic/server` (125KB gz), `semiotic/server/node` (125KB gz), `semiotic/server/edge` (143KB gz), `semiotic/utils` (75KB gz), `semiotic/utils/core` (73KB gz), `semiotic/utils/react` (6KB gz), `semiotic/recipes` (74KB gz), `semiotic/recipes/core` (74KB gz), `semiotic/recipes/react` (2KB gz), `semiotic/themes` (7KB gz), `semiotic/themes/core` (7KB gz), `semiotic/themes/react` (6KB gz), `semiotic/data` (4KB gz), `semiotic/value` (8KB gz), `semiotic/physics` (132KB gz), `semiotic/physics/matter` (1KB gz), `semiotic/physics/rapier` (1KB gz), `semiotic/ai` (429KB gz), `semiotic/ai/core` (68KB gz), `semiotic/controls` (12KB gz), `semiotic/rough` (3KB gz). Full `semiotic` is 346KB gz.
|
|
8
8
|
<!-- semiotic-bundle-sizes:end -->
|
|
9
9
|
- CLI: `npx semiotic-ai [--schema|--compact|--examples|--doctor|--audit-a11y]` · MCP: `npx semiotic-mcp`
|
|
10
10
|
|
|
@@ -339,6 +339,8 @@ Interface for proposing/scoring variants beyond `capability.variants`. The built
|
|
|
339
339
|
|
|
340
340
|
These rules are generated from `ai/behaviorContracts.cjs` and are consumed by `semiotic-ai --doctor`, MCP resources, and docs checks.
|
|
341
341
|
|
|
342
|
+
- **Accessible chart text uses direct chart props** (`accessibility.description-props`): High-level charts expose title for the visible name, description for a concise accessible description, summary for a screen-reader-only takeaway and interaction guidance, and accessibleTable for the data-table fallback.
|
|
343
|
+
Agent action: Put title, description, summary, and accessibleTable directly on the chart component when they appear in its schema. For generated L1–L3 description or a navigable chart tree, use ChartContainer with chartConfig plus describe and/or navigable; do not invent frameProps fields.
|
|
342
344
|
- **Data required by usage mode** (`props.data-required-by-usage-mode`): Static usage (`renderChart`, MCP previews, SSR snapshots, and copy/paste examples with immediate data) requires data in props. React push mode selects live ingestion by omitting data and mutating through a ref.
|
|
343
345
|
Agent action: Pass usageMode="push" to `semiotic-ai --doctor` when validating ref-based JSX with no data prop. Keep usageMode="static" or omit it for renderChart/MCP/static configs where data must be present.
|
|
344
346
|
- **Categorical color precedence** (`color.category-precedence`): When colorBy is set, CategoryColorProvider/LinkedCharts category maps win for mapped categories. Unmapped categories fall back to explicit colorScheme, then ThemeProvider colors.categorical, then the built-in categorical fallback.
|
package/README.md
CHANGED
|
@@ -16,14 +16,15 @@ AI coding assistants generate correct chart code on the first try.
|
|
|
16
16
|
<img src="./docs/public/assets/img/semiotic-release-dashboard.svg" alt="Semiotic release dashboard showing chart count, bundle sizes, capability coverage, chart families, and documentation growth" width="100%">
|
|
17
17
|
<!-- semiotic-readme-dashboard:end -->
|
|
18
18
|
|
|
19
|
-
## What's New in 3.8.
|
|
19
|
+
## What's New in 3.8.2
|
|
20
20
|
|
|
21
|
-
3.8.
|
|
21
|
+
3.8.2 makes the hosted MCP accessibility contract internally consistent:
|
|
22
22
|
|
|
23
|
-
-
|
|
24
|
-
|
|
25
|
-
-
|
|
26
|
-
|
|
23
|
+
- Chart schemas, validation, repair guidance, and audits consistently expose `title`,
|
|
24
|
+
`description`, `summary`, and `accessibleTable`.
|
|
25
|
+
- Hosted `getChartSchema` returns structured output for component lists, schemas, and errors,
|
|
26
|
+
including direct and `ChartContainer` accessibility guidance.
|
|
27
|
+
- The public MCP profile remains a focused five-tool surface with render-proven `createChart` output.
|
|
27
28
|
|
|
28
29
|
```jsx
|
|
29
30
|
import { LineChart } from "semiotic/xy"
|
|
@@ -370,35 +371,35 @@ The numbers below are **first-party artifact cost**: the gzip size of Semiotic's
|
|
|
370
371
|
|
|
371
372
|
| Entry Point | gzip | What's inside |
|
|
372
373
|
|---|---|---|
|
|
373
|
-
| `semiotic/xy` | **
|
|
374
|
-
| `semiotic/ordinal` | **
|
|
375
|
-
| `semiotic/network` | **
|
|
376
|
-
| `semiotic/geo` | **
|
|
377
|
-
| `semiotic/realtime` | **
|
|
378
|
-
| `semiotic/realtime/core` | **
|
|
374
|
+
| `semiotic/xy` | **134 KB** | LineChart, AreaChart, Scatterplot, Heatmap, + 8 more XY charts |
|
|
375
|
+
| `semiotic/ordinal` | **115 KB** | BarChart, PieChart, BoxPlot, Histogram, + 11 more categorical charts |
|
|
376
|
+
| `semiotic/network` | **121 KB** | ForceDirectedGraph, SankeyDiagram, ProcessSankey, Treemap, + 4 more |
|
|
377
|
+
| `semiotic/geo` | **94 KB** | ChoroplethMap, FlowMap, DistanceCartogram, ProportionalSymbolMap |
|
|
378
|
+
| `semiotic/realtime` | **147 KB** | RealtimeLineChart, RealtimeHistogram, + 4 streaming charts |
|
|
379
|
+
| `semiotic/realtime/core` | **140 KB** | Streaming chart types, HOCs, and buffer helpers |
|
|
379
380
|
| `semiotic/realtime/react` | **1 KB** | Stream status and synced push hooks |
|
|
380
|
-
| `semiotic/server` | **
|
|
381
|
-
| `semiotic/server/node` | **
|
|
382
|
-
| `semiotic/server/edge` | **
|
|
383
|
-
| `semiotic/utils` | **
|
|
384
|
-
| `semiotic/utils/core` | **
|
|
385
|
-
| `semiotic/utils/react` | **
|
|
386
|
-
| `semiotic/recipes` | **
|
|
387
|
-
| `semiotic/recipes/core` | **
|
|
388
|
-
| `semiotic/recipes/react` | **
|
|
389
|
-
| `semiotic/themes` | **
|
|
390
|
-
| `semiotic/themes/core` | **
|
|
391
|
-
| `semiotic/themes/react` | **
|
|
392
|
-
| `semiotic/data` | **
|
|
393
|
-
| `semiotic/value` | **
|
|
394
|
-
| `semiotic/physics` | **
|
|
381
|
+
| `semiotic/server` | **125 KB** | renderChart, renderDashboard, renderToImage, renderToAnimatedGif |
|
|
382
|
+
| `semiotic/server/node` | **125 KB** | renderChart, renderDashboard, renderToImage, renderToAnimatedGif |
|
|
383
|
+
| `semiotic/server/edge` | **143 KB** | renderChart, renderChartWithEvidence, renderToStaticSVG, renderDashboard |
|
|
384
|
+
| `semiotic/utils` | **75 KB** | ThemeProvider, validators, serialization — no chart components |
|
|
385
|
+
| `semiotic/utils/core` | **73 KB** | Theme helpers and serialization utilities |
|
|
386
|
+
| `semiotic/utils/react` | **6 KB** | ThemeProvider, useTheme, useReducedMotion, useHighContrast, useStreamStatus |
|
|
387
|
+
| `semiotic/recipes` | **74 KB** | Pure layout functions (waffle, marimekko, flextree, dagre, …) |
|
|
388
|
+
| `semiotic/recipes/core` | **74 KB** | Pure layout functions (waffle, marimekko, flextree, dagre, …) |
|
|
389
|
+
| `semiotic/recipes/react` | **2 KB** | Glyph and React layout-selection helpers |
|
|
390
|
+
| `semiotic/themes` | **7 KB** | Theme presets only (tufte, carbon, etc.) |
|
|
391
|
+
| `semiotic/themes/core` | **7 KB** | Theme presets and token helpers |
|
|
392
|
+
| `semiotic/themes/react` | **6 KB** | ThemeProvider/useTheme and hooks |
|
|
393
|
+
| `semiotic/data` | **4 KB** | bin, rollup, groupBy, pivot, fromVegaLite |
|
|
394
|
+
| `semiotic/value` | **8 KB** | BigNumber — focal-value KPI / scorecard (SingleValueFrame POC) |
|
|
395
|
+
| `semiotic/physics` | **132 KB** | GaltonBoardChart, EventDropChart, PhysicsPileChart, CollisionSwarmChart, PhysicalFlowChart, PhysicsCustomChart |
|
|
395
396
|
| `semiotic/physics/matter` | **1 KB** | Matter.js migration helpers + optional peer guard (no chart components) |
|
|
396
397
|
| `semiotic/physics/rapier` | **1 KB** | Rapier peer guard + adapter decision metadata (no chart components) |
|
|
397
|
-
| `semiotic/ai` | **
|
|
398
|
-
| `semiotic/ai/core` | **
|
|
399
|
-
| `semiotic/controls` | **
|
|
398
|
+
| `semiotic/ai` | **429 KB** | All schema-backed charts + validation — optimized for LLM code generation |
|
|
399
|
+
| `semiotic/ai/core` | **68 KB** | suggestCharts, validateProps, describeChart, repairChartConfig, tool adapters — no chart components |
|
|
400
|
+
| `semiotic/controls` | **12 KB** | DirectManipulationControl, CircularBrush, MobileStandardControls, auditVisualizationControls — no frame renderer |
|
|
400
401
|
| `semiotic/rough` | **3 KB** | Optional deterministic Rough.js paint backend — exact Semiotic geometry remains authoritative |
|
|
401
|
-
| `semiotic` | **
|
|
402
|
+
| `semiotic` | **346 KB** | Everything below (full bundle) |
|
|
402
403
|
|
|
403
404
|
<!-- semiotic-bundle-sizes:end -->
|
|
404
405
|
|
|
@@ -419,33 +420,33 @@ Method: fresh `npm pack --ignore-scripts` tarball → temporary consumer → min
|
|
|
419
420
|
|
|
420
421
|
| Public named import | Runtime | gzip cold-consumer bundle |
|
|
421
422
|
|---|---:|---:|
|
|
422
|
-
| `import { LineChart } from "semiotic"` | browser | **
|
|
423
|
-
| `import { LineChart } from "semiotic/xy"` | browser | **
|
|
424
|
-
| `import { BarChart } from "semiotic/ordinal"` | browser | **
|
|
425
|
-
| `import { SankeyDiagram } from "semiotic/network"` | browser | **
|
|
426
|
-
| `import { RealtimeLineChart } from "semiotic/realtime"` | browser | **
|
|
427
|
-
| `import { RingBuffer } from "semiotic/realtime/core"` | browser | **
|
|
423
|
+
| `import { LineChart } from "semiotic"` | browser | **145.9 KiB** |
|
|
424
|
+
| `import { LineChart } from "semiotic/xy"` | browser | **145.9 KiB** |
|
|
425
|
+
| `import { BarChart } from "semiotic/ordinal"` | browser | **120.6 KiB** |
|
|
426
|
+
| `import { SankeyDiagram } from "semiotic/network"` | browser | **125.7 KiB** |
|
|
427
|
+
| `import { RealtimeLineChart } from "semiotic/realtime"` | browser | **118.3 KiB** |
|
|
428
|
+
| `import { RingBuffer } from "semiotic/realtime/core"` | browser | **166.2 KiB** |
|
|
428
429
|
| `import { useStreamStatus } from "semiotic/realtime/react"` | browser | **0.6 KiB** |
|
|
429
|
-
| `import { GaltonBoardChart } from "semiotic/physics"` | browser | **
|
|
430
|
+
| `import { GaltonBoardChart } from "semiotic/physics"` | browser | **114.7 KiB** |
|
|
430
431
|
| `import { MATTER_PHYSICS_CAPABILITIES } from "semiotic/physics/matter"` | browser | **0.2 KiB** |
|
|
431
432
|
| `import { RAPIER_PHYSICS_CAPABILITIES } from "semiotic/physics/rapier"` | browser | **0.2 KiB** |
|
|
432
|
-
| `import { renderChart } from "semiotic/server"` | node | **
|
|
433
|
-
| `import { generateFrameSVGs } from "semiotic/server/edge"` | node | **
|
|
434
|
-
| `import { renderToImage } from "semiotic/server/node"` | node | **165.
|
|
435
|
-
| `import { suggestCharts } from "semiotic/ai"` | browser | **
|
|
436
|
-
| `import { suggestCharts } from "semiotic/ai/core"` | browser | **
|
|
433
|
+
| `import { renderChart } from "semiotic/server"` | node | **165.0 KiB** |
|
|
434
|
+
| `import { generateFrameSVGs } from "semiotic/server/edge"` | node | **80.9 KiB** |
|
|
435
|
+
| `import { renderToImage } from "semiotic/server/node"` | node | **165.4 KiB** |
|
|
436
|
+
| `import { suggestCharts } from "semiotic/ai"` | browser | **204.9 KiB** |
|
|
437
|
+
| `import { suggestCharts } from "semiotic/ai/core"` | browser | **31.1 KiB** |
|
|
437
438
|
| `import { bin } from "semiotic/data"` | browser | **0.4 KiB** |
|
|
438
|
-
| `import { ChoroplethMap } from "semiotic/geo"` | browser | **
|
|
439
|
+
| `import { ChoroplethMap } from "semiotic/geo"` | browser | **105.2 KiB** |
|
|
439
440
|
| `import { createRoughRenderMode } from "semiotic/rough"` | browser | **3.3 KiB** |
|
|
440
441
|
| `import { resolveThemePreset } from "semiotic/themes"` | browser | **3.4 KiB** |
|
|
441
442
|
| `import { resolveThemePreset } from "semiotic/themes/core"` | browser | **3.4 KiB** |
|
|
442
443
|
| `import { ThemeProvider } from "semiotic/themes/react"` | browser | **4.4 KiB** |
|
|
443
|
-
| `import { validateProps } from "semiotic/utils"` | browser | **
|
|
444
|
-
| `import { smartTickFormat } from "semiotic/utils/core"` | browser | **2
|
|
445
|
-
| `import { useReducedMotion } from "semiotic/utils/react"` | browser | **
|
|
446
|
-
| `import { waffleLayout } from "semiotic/recipes"` | browser | **
|
|
447
|
-
| `import { waffleLayout } from "semiotic/recipes/core"` | browser | **
|
|
448
|
-
| `import { Glyph } from "semiotic/recipes/react"` | browser | **0.
|
|
444
|
+
| `import { validateProps } from "semiotic/utils"` | browser | **6.4 KiB** |
|
|
445
|
+
| `import { smartTickFormat } from "semiotic/utils/core"` | browser | **0.2 KiB** |
|
|
446
|
+
| `import { useReducedMotion } from "semiotic/utils/react"` | browser | **0.3 KiB** |
|
|
447
|
+
| `import { waffleLayout } from "semiotic/recipes"` | browser | **2.5 KiB** |
|
|
448
|
+
| `import { waffleLayout } from "semiotic/recipes/core"` | browser | **2.5 KiB** |
|
|
449
|
+
| `import { Glyph } from "semiotic/recipes/react"` | browser | **0.8 KiB** |
|
|
449
450
|
| `import { BigNumber } from "semiotic/value"` | browser | **5.9 KiB** |
|
|
450
451
|
| `import { DirectManipulationControl } from "semiotic/controls"` | browser | **1.3 KiB** |
|
|
451
452
|
|
|
@@ -459,9 +460,9 @@ import { SankeyDiagram } from "semiotic/network"
|
|
|
459
460
|
import { ChoroplethMap } from "semiotic/geo"
|
|
460
461
|
```
|
|
461
462
|
|
|
462
|
-
**Tree-shaking
|
|
463
|
+
**Tree-shaking & multi-subpath imports**: Family entries (`semiotic/xy`, `semiotic/network`, `semiotic/ai`, …) are built as one ESM graph with **shared chunks**. Stream frames, renderers, and other common code ship once and are imported by every entry that needs them — so combining `semiotic/ai` + `semiotic/xy` + `semiotic/network` does **not** mean paying for three full copies of the runtime. The package is marked `"sideEffects": false`, so modern bundlers keep only the named exports you retain (e.g. `LineChart` + `suggestCharts`). Prefer family subpaths for clarity; import AI helpers from `semiotic/ai` or the lighter `semiotic/ai/core` when you do not need the chart catalog.
|
|
463
464
|
|
|
464
|
-
**When to use `"semiotic"`**:
|
|
465
|
+
**When to use `"semiotic"`**: Fine when you want one import for mixed families. With shared chunks it is no longer “sum every subpath” — the cold-consumer table above is the better guide for a single named import, and multi-family apps should not see the old double-pay tax.
|
|
465
466
|
|
|
466
467
|
## TypeScript
|
|
467
468
|
|
package/ai/behaviorContracts.cjs
CHANGED
|
@@ -147,6 +147,15 @@ const PUSH_MODE_COMPONENTS = [
|
|
|
147
147
|
const STATIC_DATA_COMPONENTS = loadStaticDataComponentsFromSchema()
|
|
148
148
|
|
|
149
149
|
const BEHAVIOR_CONTRACTS = [
|
|
150
|
+
{
|
|
151
|
+
id: "accessibility.description-props",
|
|
152
|
+
category: "accessibility",
|
|
153
|
+
title: "Accessible chart text uses direct chart props",
|
|
154
|
+
severity: "warning",
|
|
155
|
+
appliesTo: {},
|
|
156
|
+
summary: "High-level charts expose title for the visible name, description for a concise accessible description, summary for a screen-reader-only takeaway and interaction guidance, and accessibleTable for the data-table fallback.",
|
|
157
|
+
agentAction: "Put title, description, summary, and accessibleTable directly on the chart component when they appear in its schema. For generated L1–L3 description or a navigable chart tree, use ChartContainer with chartConfig plus describe and/or navigable; do not invent frameProps fields.",
|
|
158
|
+
},
|
|
150
159
|
{
|
|
151
160
|
id: "props.data-required-by-usage-mode",
|
|
152
161
|
category: "required-props",
|
package/ai/dist/mcp-server.js
CHANGED
|
@@ -7559,6 +7559,15 @@ var require_behaviorContracts = __commonJS({
|
|
|
7559
7559
|
];
|
|
7560
7560
|
var STATIC_DATA_COMPONENTS = loadStaticDataComponentsFromSchema();
|
|
7561
7561
|
var BEHAVIOR_CONTRACTS2 = [
|
|
7562
|
+
{
|
|
7563
|
+
id: "accessibility.description-props",
|
|
7564
|
+
category: "accessibility",
|
|
7565
|
+
title: "Accessible chart text uses direct chart props",
|
|
7566
|
+
severity: "warning",
|
|
7567
|
+
appliesTo: {},
|
|
7568
|
+
summary: "High-level charts expose title for the visible name, description for a concise accessible description, summary for a screen-reader-only takeaway and interaction guidance, and accessibleTable for the data-table fallback.",
|
|
7569
|
+
agentAction: "Put title, description, summary, and accessibleTable directly on the chart component when they appear in its schema. For generated L1\u2013L3 description or a navigable chart tree, use ChartContainer with chartConfig plus describe and/or navigable; do not invent frameProps fields."
|
|
7570
|
+
},
|
|
7562
7571
|
{
|
|
7563
7572
|
id: "props.data-required-by-usage-mode",
|
|
7564
7573
|
category: "required-props",
|
|
@@ -33769,12 +33778,60 @@ function buildInfoForProfile(profile) {
|
|
|
33769
33778
|
function profileResult(result) {
|
|
33770
33779
|
return { ...result, surfaceVersion: SURFACE_VERSION };
|
|
33771
33780
|
}
|
|
33781
|
+
function schemaAccessibilityGuidance(entry) {
|
|
33782
|
+
const properties = entry?.parameters?.properties ?? {};
|
|
33783
|
+
const directProps = Object.fromEntries(
|
|
33784
|
+
["title", "description", "summary", "accessibleTable"].filter((name) => properties[name]).map((name) => [name, properties[name]])
|
|
33785
|
+
);
|
|
33786
|
+
return {
|
|
33787
|
+
directProps,
|
|
33788
|
+
chartContainer: {
|
|
33789
|
+
component: "ChartContainer",
|
|
33790
|
+
requires: ["chartConfig"],
|
|
33791
|
+
titleProp: "title",
|
|
33792
|
+
subtitleProp: "subtitle",
|
|
33793
|
+
describeProp: "describe",
|
|
33794
|
+
navigableProp: "navigable",
|
|
33795
|
+
description: "Use ChartContainer with chartConfig plus describe for a generated L1\u2013L3 description and navigable for a screen-reader navigation tree."
|
|
33796
|
+
}
|
|
33797
|
+
};
|
|
33798
|
+
}
|
|
33799
|
+
function accessibilityRecommendation(component, props, data) {
|
|
33800
|
+
const directProps = schemaAccessibilityGuidance(schemaByComponent[component]).directProps;
|
|
33801
|
+
const recommendation = {};
|
|
33802
|
+
const categoryAccessor = typeof props.categoryAccessor === "string" ? props.categoryAccessor : void 0;
|
|
33803
|
+
const valueAccessor = typeof props.valueAccessor === "string" ? props.valueAccessor : void 0;
|
|
33804
|
+
if (directProps.description && typeof props.description !== "string") {
|
|
33805
|
+
recommendation.description = categoryAccessor && valueAccessor ? `${component} comparing ${valueAccessor} by ${categoryAccessor}.` : `${component} chart.`;
|
|
33806
|
+
}
|
|
33807
|
+
if (directProps.summary && typeof props.summary !== "string") {
|
|
33808
|
+
const numericRows = categoryAccessor && valueAccessor ? data.map((row) => ({ category: row[categoryAccessor], value: row[valueAccessor] })).filter((row) => typeof row.value === "number" && Number.isFinite(row.value)) : [];
|
|
33809
|
+
const highest = numericRows.reduce(
|
|
33810
|
+
(current, row) => !current || row.value > current.value ? row : current,
|
|
33811
|
+
void 0
|
|
33812
|
+
);
|
|
33813
|
+
recommendation.summary = highest ? `${String(highest.category)} is highest at ${highest.value}. Use arrow keys to move between chart marks.` : "Use arrow keys to move between chart marks.";
|
|
33814
|
+
}
|
|
33815
|
+
return Object.keys(recommendation).length > 0 ? {
|
|
33816
|
+
location: "direct-component-props",
|
|
33817
|
+
props: recommendation,
|
|
33818
|
+
chartContainer: schemaAccessibilityGuidance(schemaByComponent[component]).chartContainer
|
|
33819
|
+
} : void 0;
|
|
33820
|
+
}
|
|
33772
33821
|
async function getSchemaHandler(args) {
|
|
33773
33822
|
const component = args.component;
|
|
33823
|
+
const availableComponents = allComponentNames.map((name) => ({
|
|
33824
|
+
name,
|
|
33825
|
+
renderable: metadataForComponent(name).renderable
|
|
33826
|
+
}));
|
|
33774
33827
|
if (!component) {
|
|
33775
|
-
const list =
|
|
33828
|
+
const list = availableComponents.map(
|
|
33829
|
+
({ name, renderable: renderable2 }) => renderable2 ? `${name} [renderable]` : name
|
|
33830
|
+
);
|
|
33776
33831
|
return {
|
|
33777
|
-
content: [{
|
|
33832
|
+
content: [{
|
|
33833
|
+
type: "text",
|
|
33834
|
+
text: `Available components (${allComponentNames.length}):
|
|
33778
33835
|
${list.join(", ")}
|
|
33779
33836
|
|
|
33780
33837
|
Components marked [renderable] can be rendered to SVG via renderChart (pass theme parameter for styled output). Others (Realtime*) require a browser environment.
|
|
@@ -33783,27 +33840,55 @@ For full agent context, read MCP resources: semiotic://schema, semiotic://compon
|
|
|
33783
33840
|
|
|
33784
33841
|
All charts support CSS custom properties for theming (--semiotic-bg, --semiotic-text, --semiotic-grid, etc.) and <ThemeProvider>. Use COLOR_BLIND_SAFE_CATEGORICAL (import from semiotic/themes) for accessible color palettes.
|
|
33785
33842
|
|
|
33786
|
-
Pass { component: '<name>' } to get the prop schema for a specific component.`
|
|
33843
|
+
Pass { component: '<name>' } to get the prop schema for a specific component.`
|
|
33844
|
+
}],
|
|
33845
|
+
structuredContent: profileResult({
|
|
33846
|
+
status: "component-list",
|
|
33847
|
+
availableComponents
|
|
33848
|
+
})
|
|
33787
33849
|
};
|
|
33788
33850
|
}
|
|
33789
33851
|
const entry = schemaByComponent[component];
|
|
33790
33852
|
if (!entry) {
|
|
33791
33853
|
const available = Object.keys(schemaByComponent).sort();
|
|
33792
33854
|
return {
|
|
33793
|
-
content: [{
|
|
33855
|
+
content: [{
|
|
33856
|
+
type: "text",
|
|
33857
|
+
text: `Unknown component "${component}". Available: ${available.join(", ")}`
|
|
33858
|
+
}],
|
|
33859
|
+
structuredContent: profileResult({
|
|
33860
|
+
status: "unknown-component",
|
|
33861
|
+
component,
|
|
33862
|
+
availableComponents
|
|
33863
|
+
}),
|
|
33794
33864
|
isError: true
|
|
33795
33865
|
};
|
|
33796
33866
|
}
|
|
33797
|
-
const
|
|
33798
|
-
const
|
|
33867
|
+
const renderable = metadataForComponent(component).renderable;
|
|
33868
|
+
const renderableNote = renderable ? "This component can be rendered to SVG via renderChart." : "This component requires a browser environment and cannot be rendered via renderChart.";
|
|
33869
|
+
const contracts = behaviorContractsFor({
|
|
33870
|
+
component,
|
|
33871
|
+
props: {}
|
|
33872
|
+
});
|
|
33799
33873
|
const contractText = contracts.length > 0 ? `
|
|
33800
33874
|
|
|
33801
33875
|
Behavior contracts:
|
|
33802
33876
|
${JSON.stringify(contracts, null, 2)}` : "";
|
|
33803
33877
|
return {
|
|
33804
|
-
content: [{
|
|
33878
|
+
content: [{
|
|
33879
|
+
type: "text",
|
|
33880
|
+
text: `${renderableNote}
|
|
33805
33881
|
|
|
33806
|
-
${JSON.stringify(entry, null, 2)}${contractText}`
|
|
33882
|
+
${JSON.stringify(entry, null, 2)}${contractText}`
|
|
33883
|
+
}],
|
|
33884
|
+
structuredContent: profileResult({
|
|
33885
|
+
status: "component-schema",
|
|
33886
|
+
component,
|
|
33887
|
+
renderable,
|
|
33888
|
+
schema: entry,
|
|
33889
|
+
accessibility: schemaAccessibilityGuidance(entry),
|
|
33890
|
+
behaviorContracts: contracts
|
|
33891
|
+
})
|
|
33807
33892
|
};
|
|
33808
33893
|
}
|
|
33809
33894
|
var SUGGEST_INTENT_ALIASES = {
|
|
@@ -34645,9 +34730,17 @@ async function improveChartHandler(args) {
|
|
|
34645
34730
|
const repair = (0, import_ai3.repairChartConfig)(args.component, data, { intent });
|
|
34646
34731
|
const capability = (0, import_ai3.getCapability)(args.component);
|
|
34647
34732
|
const variants = capability ? (0, import_ai3.proposeVariant)(args.component, capability, { profile: (0, import_ai3.profileData)(data), intent }) : [];
|
|
34733
|
+
const accessibility = accessibilityRecommendation(args.component, args.props, data);
|
|
34648
34734
|
return {
|
|
34649
34735
|
content: [{ type: "text", text: `Improvement analysis for ${args.component}: ${diagnosis.diagnoses.length} diagnosis item(s), repair status ${repair.status}, ${variants.length} variant proposal(s).` }],
|
|
34650
|
-
structuredContent: profileResult({
|
|
34736
|
+
structuredContent: profileResult({
|
|
34737
|
+
status: repair.status === "ok" ? "reviewed" : "repair-needed",
|
|
34738
|
+
component: args.component,
|
|
34739
|
+
diagnostics: diagnosis.diagnoses,
|
|
34740
|
+
repair,
|
|
34741
|
+
variants,
|
|
34742
|
+
...accessibility ? { accessibilityRecommendation: accessibility } : {}
|
|
34743
|
+
})
|
|
34651
34744
|
};
|
|
34652
34745
|
}
|
|
34653
34746
|
async function explainChartHandler(args) {
|
|
@@ -34659,8 +34752,8 @@ async function explainChartHandler(args) {
|
|
|
34659
34752
|
}
|
|
34660
34753
|
async function auditChartHandler(args) {
|
|
34661
34754
|
const diagnosis = (0, import_ai3.diagnoseConfig)(args.component, args.props);
|
|
34662
|
-
const accessibility = (0, import_ai3.auditAccessibility)(args.component, args.props
|
|
34663
|
-
const mobile = (0, import_ai3.auditMobileVisualization)(args.component, args.props, { viewportWidth: args.viewportWidth
|
|
34755
|
+
const accessibility = (0, import_ai3.auditAccessibility)(args.component, args.props);
|
|
34756
|
+
const mobile = (0, import_ai3.auditMobileVisualization)(args.component, args.props, { viewportWidth: args.viewportWidth });
|
|
34664
34757
|
const blocking = diagnosis.diagnoses.some((item) => item.severity === "error") || !accessibility.ok || !mobile.ok;
|
|
34665
34758
|
return {
|
|
34666
34759
|
content: [{ type: "text", text: `Audit for ${args.component}: ${blocking ? "blocking findings need attention" : "no blocking findings"}.` }],
|
|
@@ -34859,7 +34952,19 @@ function createServer2(profile = "developer", options = {}) {
|
|
|
34859
34952
|
title: "Improve an existing chart",
|
|
34860
34953
|
description: "Diagnose a chart configuration, assess data fit, and propose repairs or variants.",
|
|
34861
34954
|
inputSchema: { component: external_exports3.string(), props: external_exports3.record(external_exports3.string(), external_exports3.unknown()), data: external_exports3.array(external_exports3.record(external_exports3.string(), external_exports3.unknown())).optional(), intent: external_exports3.union([external_exports3.string(), external_exports3.array(external_exports3.string())]).optional() },
|
|
34862
|
-
outputSchema: {
|
|
34955
|
+
outputSchema: {
|
|
34956
|
+
status: external_exports3.enum(["reviewed", "repair-needed"]),
|
|
34957
|
+
component: external_exports3.string(),
|
|
34958
|
+
diagnostics: external_exports3.array(external_exports3.unknown()),
|
|
34959
|
+
repair: external_exports3.record(external_exports3.string(), external_exports3.unknown()),
|
|
34960
|
+
variants: external_exports3.array(external_exports3.unknown()),
|
|
34961
|
+
accessibilityRecommendation: external_exports3.object({
|
|
34962
|
+
location: external_exports3.literal("direct-component-props"),
|
|
34963
|
+
props: external_exports3.record(external_exports3.string(), external_exports3.string()),
|
|
34964
|
+
chartContainer: external_exports3.record(external_exports3.string(), external_exports3.unknown())
|
|
34965
|
+
}).optional(),
|
|
34966
|
+
surfaceVersion: external_exports3.string()
|
|
34967
|
+
},
|
|
34863
34968
|
annotations: READ_ONLY_TOOL_ANNOTATIONS
|
|
34864
34969
|
}, improveChartHandler);
|
|
34865
34970
|
srv.registerTool("explainChart", {
|
|
@@ -34879,7 +34984,31 @@ function createServer2(profile = "developer", options = {}) {
|
|
|
34879
34984
|
srv.registerTool("getChartSchema", {
|
|
34880
34985
|
title: "Get a chart schema",
|
|
34881
34986
|
description: "Return canonical Semiotic prop-schema guidance for code editing and advanced configuration.",
|
|
34882
|
-
inputSchema: {
|
|
34987
|
+
inputSchema: {
|
|
34988
|
+
component: external_exports3.string().optional()
|
|
34989
|
+
},
|
|
34990
|
+
outputSchema: {
|
|
34991
|
+
status: external_exports3.enum([
|
|
34992
|
+
"component-list",
|
|
34993
|
+
"component-schema",
|
|
34994
|
+
"unknown-component"
|
|
34995
|
+
]),
|
|
34996
|
+
component: external_exports3.string().optional(),
|
|
34997
|
+
renderable: external_exports3.boolean().optional(),
|
|
34998
|
+
availableComponents: external_exports3.array(
|
|
34999
|
+
external_exports3.object({
|
|
35000
|
+
name: external_exports3.string(),
|
|
35001
|
+
renderable: external_exports3.boolean()
|
|
35002
|
+
})
|
|
35003
|
+
).optional(),
|
|
35004
|
+
schema: external_exports3.record(external_exports3.string(), external_exports3.unknown()).optional(),
|
|
35005
|
+
accessibility: external_exports3.object({
|
|
35006
|
+
directProps: external_exports3.record(external_exports3.string(), external_exports3.unknown()),
|
|
35007
|
+
chartContainer: external_exports3.record(external_exports3.string(), external_exports3.unknown())
|
|
35008
|
+
}).optional(),
|
|
35009
|
+
behaviorContracts: external_exports3.array(external_exports3.unknown()).optional(),
|
|
35010
|
+
surfaceVersion: external_exports3.string()
|
|
35011
|
+
},
|
|
34883
35012
|
annotations: READ_ONLY_TOOL_ANNOTATIONS
|
|
34884
35013
|
}, getSchemaHandler);
|
|
34885
35014
|
return srv;
|