semiotic 3.5.3 → 3.5.4

package/CLAUDE.md

@@ -4,7 +4,7 @@
 - Install: `npm install semiotic`
 <!-- semiotic-bundle-sizes:start -->
 <!-- Auto-generated by scripts/sync-bundle-sizes.mjs — do not edit by hand. -->
-- **Use sub-path imports** — `semiotic/xy` (85KB gz), `semiotic/ordinal` (68KB gz), `semiotic/network` (63KB gz), `semiotic/geo` (51KB gz), `semiotic/realtime` (90KB gz), `semiotic/server` (117KB gz), `semiotic/utils` (22KB gz), `semiotic/recipes` (5KB gz), `semiotic/themes` (4KB gz), `semiotic/data` (3KB gz), `semiotic/ai` (188KB gz). Full `semiotic` is 186KB gz.
+- **Use sub-path imports** — `semiotic/xy` (85KB gz), `semiotic/ordinal` (69KB gz), `semiotic/network` (63KB gz), `semiotic/geo` (52KB gz), `semiotic/realtime` (90KB gz), `semiotic/server` (122KB gz), `semiotic/utils` (22KB gz), `semiotic/recipes` (5KB gz), `semiotic/themes` (4KB gz), `semiotic/data` (3KB gz), `semiotic/ai` (189KB gz). Full `semiotic` is 188KB gz.
 <!-- semiotic-bundle-sizes:end -->
 - CLI: `npx semiotic-ai [--schema|--compact|--examples|--doctor]`
 - MCP: `npx semiotic-mcp`
@@ -84,7 +84,7 @@ Helpers: `resolveReferenceGeography("world-110m"|"world-50m")`, `mergeData(featu
 
 Push API: `ref.current.push({ time, value })`. All pushed data **must** include a time field.
 
-**RealtimeLineChart**, **RealtimeHistogram** (+ `brush`, `onBrush`, `linkedBrush`), **RealtimeSwarmChart**, **RealtimeWaterfallChart**, **RealtimeHeatmap**, **Streaming Sankey** (StreamNetworkFrame + `showParticles`)
+**RealtimeLineChart**, **RealtimeHistogram** (+ `brush`, `onBrush`, `linkedBrush`, `direction`), **TemporalHistogram** (static-data sibling of RealtimeHistogram — same props minus `windowSize`/`windowMode`; takes a bounded `data` array), **RealtimeSwarmChart**, **RealtimeWaterfallChart**, **RealtimeHeatmap**, **Streaming Sankey** (StreamNetworkFrame + `showParticles`)
 
 Encoding: `decay`, `pulse`, `transition`, `staleness` — compose freely.
 

package/README.md

@@ -288,17 +288,17 @@ Semiotic ships 12 entry points. **Don't import from `"semiotic"` unless you need
 | Entry Point | gzip | What's inside |
 |---|---|---|
 | `semiotic/xy` | **85 KB** | LineChart, AreaChart, Scatterplot, Heatmap, + 8 more XY charts |
-| `semiotic/ordinal` | **68 KB** | BarChart, PieChart, BoxPlot, Histogram, + 11 more categorical charts |
+| `semiotic/ordinal` | **69 KB** | BarChart, PieChart, BoxPlot, Histogram, + 11 more categorical charts |
 | `semiotic/network` | **63 KB** | ForceDirectedGraph, SankeyDiagram, ProcessSankey, Treemap, + 4 more |
-| `semiotic/geo` | **51 KB** | ChoroplethMap, FlowMap, DistanceCartogram, ProportionalSymbolMap |
+| `semiotic/geo` | **52 KB** | ChoroplethMap, FlowMap, DistanceCartogram, ProportionalSymbolMap |
 | `semiotic/realtime` | **90 KB** | RealtimeLineChart, RealtimeHistogram, + 3 streaming charts |
-| `semiotic/server` | **117 KB** | renderChart, renderDashboard, renderToImage, renderToAnimatedGif |
+| `semiotic/server` | **122 KB** | renderChart, renderDashboard, renderToImage, renderToAnimatedGif |
 | `semiotic/utils` | **22 KB** | ThemeProvider, validators, serialization — no chart components |
 | `semiotic/recipes` | **5 KB** | Pure layout functions (waffle, marimekko, flextree, dagre, …) |
 | `semiotic/themes` | **4 KB** | Theme presets only (tufte, carbon, etc.) |
 | `semiotic/data` | **3 KB** | bin, rollup, groupBy, pivot, fromVegaLite |
-| `semiotic/ai` | **188 KB** | All 41 HOCs + validation — optimized for LLM code generation |
-| `semiotic` | **186 KB** | Everything below (full bundle) |
+| `semiotic/ai` | **189 KB** | All 41 HOCs + validation — optimized for LLM code generation |
+| `semiotic` | **188 KB** | Everything below (full bundle) |
 
 <!-- semiotic-bundle-sizes:end -->
 

package/ai/componentMetadata.cjs

@@ -21,7 +21,7 @@ const COMPONENTS_BY_CATEGORY = {
     "ChoroplethMap", "ProportionalSymbolMap", "FlowMap", "DistanceCartogram",
   ],
   realtime: [
-    "RealtimeLineChart", "RealtimeHistogram", "RealtimeSwarmChart",
+    "RealtimeLineChart", "RealtimeHistogram", "TemporalHistogram", "RealtimeSwarmChart",
     "RealtimeWaterfallChart", "RealtimeHeatmap",
   ],
 }
@@ -52,11 +52,18 @@ function importPathForCategory(category) {
 function metadataForComponent(entryOrName) {
   const name = typeof entryOrName === "string" ? entryOrName : entryOrName.name
   const category = categoryForComponent(name)
+  // Realtime push-streaming charts are browser-only by design.
+  // TemporalHistogram is the static-data sibling living in the
+  // "realtime" category for documentation grouping — it accepts a
+  // bounded data array and is renderable through the SSR path like
+  // any other static HOC. Matches the name-prefix exclusion the
+  // check-surface-parity script applies.
+  const isPushOnly = category === "realtime" && name.startsWith("Realtime")
   return {
     name,
     category,
     importPath: importPathForCategory(category),
-    renderable: category !== "realtime",
+    renderable: !isPushOnly,
     description: typeof entryOrName === "string" ? undefined : entryOrName.description,
   }
 }

package/ai/dist/mcp-server.js

@@ -6943,6 +6943,7 @@ var require_componentMetadata = __commonJS({
       realtime: [
         "RealtimeLineChart",
         "RealtimeHistogram",
+        "TemporalHistogram",
         "RealtimeSwarmChart",
         "RealtimeWaterfallChart",
         "RealtimeHeatmap"
@@ -6970,11 +6971,12 @@ var require_componentMetadata = __commonJS({
     function metadataForComponent2(entryOrName) {
       const name = typeof entryOrName === "string" ? entryOrName : entryOrName.name;
       const category = categoryForComponent(name);
+      const isPushOnly = category === "realtime" && name.startsWith("Realtime");
       return {
         name,
         category,
         importPath: importPathForCategory(category),
-        renderable: category !== "realtime",
+        renderable: !isPushOnly,
         description: typeof entryOrName === "string" ? void 0 : entryOrName.description
       };
     }
@@ -32363,6 +32365,7 @@ var COMPONENT_REGISTRY = {
   QuadrantChart: { component: import_ai.QuadrantChart, category: "xy" },
   MultiAxisLineChart: { component: import_ai.MultiAxisLineChart, category: "xy" },
   CandlestickChart: { component: import_ai.CandlestickChart, category: "xy" },
+  TemporalHistogram: { component: import_ai.TemporalHistogram, category: "xy" },
   BarChart: { component: import_ai.BarChart, category: "ordinal" },
   StackedBarChart: { component: import_ai.StackedBarChart, category: "ordinal" },
   GroupedBarChart: { component: import_ai.GroupedBarChart, category: "ordinal" },

package/ai/examples.md

@@ -292,6 +292,33 @@ const data = [
 
 Key props: `orderAccessor` sequences points along the path, Viridis gradient from start→end
 
+### TemporalHistogram
+
+```jsx
+import { TemporalHistogram } from "semiotic/ai"
+
+// One row per event; the chart bins events into `binSize` time buckets.
+const events = [
+  { time: 1700000000000, value: 1, category: "errors" },
+  { time: 1700000005000, value: 1, category: "warnings" },
+  { time: 1700000007000, value: 1, category: "errors" },
+  { time: 1700000020000, value: 1, category: "info" },
+  { time: 1700000022000, value: 1, category: "info" },
+  { time: 1700000040000, value: 1, category: "errors" },
+  { time: 1700000045000, value: 1, category: "warnings" }
+]
+
+<TemporalHistogram
+  data={events}
+  binSize={15000}
+  categoryAccessor="category"
+  colors={{ errors: "#dc3545", warnings: "#fd7e14", info: "#007bff" }}
+  enableHover
+/>
+```
+
+Static-data sibling of `RealtimeHistogram` — accepts a bounded `data` array instead of a push-mode ref. Same props minus `windowSize` / `windowMode`. Use for backfilled or historical temporal histograms where the time range is fixed; reach for `RealtimeHistogram` when events arrive over time and you want a sliding window.
+
 ---
 
 ## Flat Array — Ordinal Charts