@stealthscale/component-charts 0.2.1 → 0.2.3

package/locales/en/specimen/treemap-chart.json

@@ -0,0 +1,107 @@
+{
+  "about": "A hierarchy of parts as nested tiles whose areas follow their sizes, such as spend by team and then by service. Each top-level part is a family of tiles in one color, largest first from the top left, and the legend lists each family with its total. The arrow keys walk the tiles, a family before its parts. A treemap shows where the mass of many parts is, and a bar chart is the better chart for comparing values.",
+  "credit": {
+    "about": "The bill with a reserved-capacity credit of −€6,200 posted to the platform team. An area cannot be negative, so the chart gives a part below zero no tile, and the platform team's total counts only the parts with a tile. hierarchyLeaves returns every leaf with its value as given, and the caption lists the leaves below zero.",
+    "caption_one": "{{names}} is below zero and has no tile. An area cannot be negative.",
+    "caption_other": "{{names}} are below zero and have no tiles. An area cannot be negative.",
+    "title": "A part below zero"
+  },
+  "folders": "Folders",
+  "hidden": {
+    "about": "defaultHiddenKeys hides the platform team when the chart first renders. The other teams fill the plot, and every share on the tiles and in the tooltip is of the teams shown. A press on the legend shows the team again.",
+    "caption": "With the platform team hidden, the data team is 65% of the rest.",
+    "title": "A hidden team"
+  },
+  "largest": {
+    "about": "defaultIndex opens the tooltip at the seventh tile of the walk, Kubernetes, when the chart first renders. The walk runs depth first and largest first: the data team, its four services, then the platform team and Kubernetes. The tooltip writes the service's spend and its share of the bill to two significant digits.",
+    "caption": "Kubernetes is the largest service at 23% of the bill.",
+    "title": "Tooltip"
+  },
+  "names": {
+    "archive": "Archive",
+    "audio": "Audio",
+    "backups": "Backups",
+    "balancers": "Load balancers",
+    "builds": "Builds",
+    "cdn": "CDN",
+    "credit": "Reserved credit",
+    "cron": "Cron",
+    "data": "Data",
+    "design": "Design",
+    "dns": "DNS",
+    "documents": "Documents",
+    "firewall": "Web firewall",
+    "flags": "Feature flags",
+    "functions": "Functions",
+    "gateway": "API gateway",
+    "kafka": "Kafka",
+    "kubernetes": "Kubernetes",
+    "logs": "Log ingest",
+    "mailer": "Mailer",
+    "metrics": "Metrics",
+    "nat": "NAT gateways",
+    "objects": "Object storage",
+    "photos": "Photos",
+    "platform": "Platform",
+    "postgres": "Postgres",
+    "product": "Product",
+    "proxy": "Auth proxy",
+    "queue": "Queue",
+    "redis": "Redis",
+    "registry": "Registry",
+    "scanner": "Scanner",
+    "search": "Search cluster",
+    "secrets": "Secrets",
+    "snapshots": "Snapshots",
+    "status": "Status page",
+    "tracing": "Tracing",
+    "video": "Video",
+    "webhooks": "Webhooks"
+  },
+  "narrow": {
+    "about": "The bill in a room 20rem wide, the column of a phone. A tile too narrow for its name writes none, and the walk and the tooltip still name it.",
+    "title": "Narrow room"
+  },
+  "palette": {
+    "about": "Each team states its palette: the data team teal, the platform team purple, the product team orange. A team's services mix its palette's chart color over the panel. values false leaves only the names on the tiles and in the legend.",
+    "caption": "The platform team's services cost nearly as much as the data team's.",
+    "title": "Palettes"
+  },
+  "quiet": {
+    "about": "A treemap without nodes renders the empty state in the plot's place, at the plot's ratio, and no legend.",
+    "caption": "Cloud spend this month.",
+    "empty": "No spend in this period.",
+    "title": "Empty"
+  },
+  "replay": {
+    "about": "animate slides each tile in from the left when the chart mounts, and Replay mounts the chart again. Under reduced motion recharts renders the tiles at once.",
+    "caption": "Cloud spend for September.",
+    "replay": "Replay",
+    "title": "Animation"
+  },
+  "share": "Of the bill",
+  "spend": {
+    "about": "September's cloud bill of €95,400 by team and then by service. Each team is a family of tiles in one color, its largest service the strongest. Each tile that fits writes its service's name, spend and share of the bill, and the legend writes each team's total. hierarchyLeaves returns every service with its share, and the caption states the two largest.",
+    "caption": "{{first}} and {{second}} are {{share}}% of the bill.",
+    "label": "Cloud spend for September by team and service",
+    "title": "Spend by team and service"
+  },
+  "storage": {
+    "about": "A file server's folders in one level. Each folder is its own family, so each takes the next series color. valueOptions writes the sizes in gigabytes.",
+    "caption": "Design and video files fill 58% of the file server.",
+    "label": "Storage on the file server by folder",
+    "share": "Of the server",
+    "title": "One level",
+    "value": "Size"
+  },
+  "tail": {
+    "about": "The platform team's spend: Kubernetes and fourteen small services. A tile too small for its name writes none, because a clipped word reads as another word. The tooltip writes each one's name, and the arrow keys walk to each.",
+    "caption": "Kubernetes is 86% of the platform team's spend. Fourteen small services share the rest.",
+    "label": "Platform team spend for September by service",
+    "share": "Of the team",
+    "title": "A long tail"
+  },
+  "teams": "Teams",
+  "title": "Treemap chart",
+  "value": "Spend"
+}

package/locales/en/specimen/violin-plot.json

@@ -0,0 +1,54 @@
+{
+  "about": "The distribution of each group as the density of its values, mirrored about the middle of its band, with its quartiles inside. The tooltip lists the values each density peaks at, which a box plot cannot show.",
+  "endpoints": {
+    "about": "The response times of 50 requests to each of three endpoints. Each violin is as wide as its bar at its own densest value, so its width compares within the group only. Inside it are the whisker line, the middle half as a narrow bar and the median as a hollow point.",
+    "caption": "Search peaks at 22ms and at 167ms, cache hits and index reads, and its middle half spans the gap between them.",
+    "checkout": "Checkout",
+    "label": "Response times of the shop's API by endpoint",
+    "profile": "Profile",
+    "search": "Search",
+    "title": "Response times"
+  },
+  "narrow": {
+    "about": "The three endpoints in a room 20rem wide, the column of a phone. Each violin takes its share of the width, at most 110px.",
+    "title": "Narrow room"
+  },
+  "outline": {
+    "about": "quartiles false leaves out the whisker line, the quartile bar and the median, for a violin read for its outline alone. The key then names the density alone.",
+    "caption": "8 of 50 profile requests take more than 100ms.",
+    "title": "Outline alone"
+  },
+  "peaks": {
+    "about": "defaultIndex opens the tooltip at a group when the chart first renders. The rows are the median, the middle half, the range, the values the density peaks at and the count.",
+    "caption": "Search peaks at 22 and 167ms, while its median of 25ms describes the cache hits alone.",
+    "title": "Tooltip"
+  },
+  "plans": {
+    "about": "Session lengths on three plans, the violins in the teal palette's chart color. valueDomain fixes the axis at 0 to 60 minutes, so every month's chart compares on one scale. This month's longest session took 39 minutes, and the rounded axis would end at 40.",
+    "caption": "Team's median of 23.5 minutes falls between its peaks near 5 and 35 minutes, and 2 of its 40 sessions last 15 to 25 minutes.",
+    "free": "Free",
+    "label": "Session lengths by plan",
+    "pro": "Pro",
+    "sessions": "Sessions",
+    "team": "Team",
+    "title": "Session lengths"
+  },
+  "quiet": {
+    "about": "A violin plot whose groups have no finite value renders the empty state in the plot's place, at the plot's ratio.",
+    "caption": "Response times of the shop's API this hour.",
+    "empty": "No requests this hour.",
+    "title": "Empty"
+  },
+  "replay": {
+    "about": "animate grows each violin from the axis when the chart mounts, and Replay mounts the chart again. Under reduced motion recharts renders the violins at once.",
+    "replay": "Replay",
+    "title": "Animation"
+  },
+  "requests": "Requests",
+  "smooth": {
+    "about": "bandwidth sets one Gaussian kernel for every group in place of Silverman's bandwidth per group. A kernel wider than the gap between two peaks merges them, so the bandwidth decides what a violin shows.",
+    "caption": "At a 60ms kernel, Search's two peaks blur into one at 29ms.",
+    "title": "Wide kernel"
+  },
+  "title": "Violin plot"
+}

package/locales/en/specimen/waterfall-chart.json

@@ -0,0 +1,71 @@
+{
+  "about": "The steps that take a running total from one number to another, each a bar floating on the total before it. Rises take the success palette's chart color, falls the error's, and totals rise from zero in the neutral's.",
+  "bridge": {
+    "about": "A monthly recurring revenue bridge. August's balance is a total with a value, which sets the running total, and September's total shows where the steps left it. The chart writes each bar's signed change above the bar, and a dashed connector runs from each bar to the next at the running total.",
+    "august": "August",
+    "caption": "MRR grew from €120K in August to €135.9K in September. New and expanded accounts added €27.6K, and contraction and churn removed €11.7K.",
+    "churn": "Churn",
+    "contraction": "Contraction",
+    "expansion": "Expansion",
+    "label": "MRR bridge from August to September",
+    "mrr": "MRR",
+    "new": "New",
+    "september": "September",
+    "title": "Revenue bridge"
+  },
+  "cash": {
+    "about": "A month of cash flow that dips below zero. The value axis runs through zero, so a bar below it reads as a balance owed.",
+    "caption": "Cash fell €75K below zero after payroll and suppliers, and closed the month at €30K once customer receipts arrived.",
+    "cash": "Cash",
+    "closing": "Closing",
+    "label": "Cash flow in September",
+    "opening": "Opening",
+    "payroll": "Payroll",
+    "receipts": "Receipts",
+    "suppliers": "Suppliers",
+    "tax": "Tax",
+    "title": "Below zero"
+  },
+  "churn": {
+    "about": "defaultIndex opens the tooltip at a step when the chart first renders. The tooltip writes the step's signed change, and its swatch takes the bar's color.",
+    "caption": "Churn removed €7.6K of MRR, nearly twice the €4.1K lost to contraction.",
+    "title": "Tooltip"
+  },
+  "headcount": {
+    "about": "Fourteen steps would crowd their numbers and lines, so valueLabels={false} and connectors={false} leave the bars alone. The tooltip still writes each month's change.",
+    "caption": "Headcount grew from 48 to 65 people over the year. July added the most, 5 people.",
+    "end": "End",
+    "label": "Headcount changes per month",
+    "people": "People",
+    "start": "Start",
+    "title": "Many steps"
+  },
+  "narrow": {
+    "about": "The revenue bridge in a room 20rem wide, the column of a phone. The values would run into each other at this width, so the chart leaves them out, and the tooltip writes each one. The category axis names the steps it has room for.",
+    "title": "Narrow room"
+  },
+  "profit": {
+    "about": "An income statement from revenue to operating profit. Two totals without values show the running total after each group of steps: gross profit, then operating profit.",
+    "amount": "Amount",
+    "caption": "Of €480K revenue, €65K remained as operating profit after €190K cost of sales and €225K of expenses.",
+    "cost": "Cost of sales",
+    "expenses": "Expenses",
+    "gross": "Gross profit",
+    "label": "Income statement for the third quarter",
+    "operating": "Operating profit",
+    "revenue": "Revenue",
+    "title": "Subtotals"
+  },
+  "quiet": {
+    "about": "A chart without steps renders the empty state in the plot's place, at the plot's ratio.",
+    "caption": "Monthly recurring revenue from August to September.",
+    "empty": "No revenue changes recorded this month.",
+    "title": "Empty"
+  },
+  "replay": {
+    "about": "animate grows each bar from its base when the chart mounts, and Replay mounts the chart again. Under reduced motion recharts renders the bars at once.",
+    "replay": "Replay",
+    "title": "Animation"
+  },
+  "title": "Waterfall chart"
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stealthscale/component-charts",
-  "version": "0.2.1",
+  "version": "0.2.3",
   "description": "Renders data as charts over recharts: a figure with a measured plot, a tooltip, a legend that switches series, and series colors from the theme.",
   "keywords": [
     "charts",
@@ -19,6 +19,7 @@
   "files": [
     "dist",
     "LICENSE",
+    "locales",
     "README.md"
   ],
   "type": "module",
@@ -36,21 +37,21 @@
   },
   "dependencies": {
     "@internationalized/date": "^3.12",
-    "@stealthscale/component-collections": "^0.1.1",
-    "@stealthscale/component-data": "^0.2.1",
+    "@stealthscale/component-collections": "^0.1.3",
+    "@stealthscale/component-data": "^0.2.2",
     "recharts": "^3.10"
   },
   "devDependencies": {
     "@arethetypeswrong/core": "^0.18",
-    "@stealthscale/component-primitives": "^0.3.0",
+    "@stealthscale/component-primitives": "^0.3.1",
     "@stealthscale/hooks": "^0.3.0",
     "@stealthscale/provider-locale": "^0.1.1",
     "@stealthscale/theme": "^0.5.0",
     "@stealthscale/vite-config": "^0.8.0",
-    "@stealthscale/vite-config-i18n": "^0.2.1",
+    "@stealthscale/vite-config-i18n": "^0.2.2",
     "@stealthscale/vite-config-react": "^0.9.1",
-    "@stealthscale/vite-config-specimen": "^0.2.1",
-    "@stealthscale/vite-config-theme": "^0.2.1",
+    "@stealthscale/vite-config-specimen": "^0.3.0",
+    "@stealthscale/vite-config-theme": "^0.3.0",
     "@stealthscale/vite-config-typescript": "^0.3.0",
     "@testing-library/react": "^16.3",
     "@types/react": "^19.3",
@@ -66,7 +67,7 @@
     "vitest": "5.0.3"
   },
   "peerDependencies": {
-    "@stealthscale/component-primitives": "^0.3.0",
+    "@stealthscale/component-primitives": "^0.3.1",
     "@stealthscale/hooks": "^0.3.0",
     "@stealthscale/provider-locale": "^0.1.1",
     "@stealthscale/theme": "^0.5.0",