zaniah 0.6.3 → 0.6.4

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: d5d0895db7cb838e553fc0e7de6c20df016c9c56d3938cfaa94dc99cc47f2ab2
-  data.tar.gz: ef786f1e8ee6e87da921f317bd7901d97553e1fbe9e3e6969bb5df588a300754
+  metadata.gz: 985d3d62a8ffa112effba1aed1976c2b7403a7e6ef2a49dca9b817c80d49b3da
+  data.tar.gz: 8e641aad423d506fcbf18fe5c6c22afa8beff2ae5b321ae73559cbec8ed26181
 SHA512:
-  metadata.gz: e784d7df56037b50a88e4e8e4fdccbba5f9544b5e7d56b88480f78468627210919f8a87093ea6d461ba56355bb179c7fbe96d8d52d7990a6107d96ce73fc9872
-  data.tar.gz: e9e9726a52da9e277d6ebc56f6587a08ca0550e4fbfd83fbb25ef8fe75b58cb8badc976af92b179e530342d9da96aeda8f91332d395f12c77963bfee1c808f19
+  metadata.gz: e71ed6d538a8ba9f48d3521def68d05957c637d631116dbf5676a47672d750b1128d361b7b8af48cd5231c01742db7ca88b6846961fc30c58339d4bf696e05a0
+  data.tar.gz: d6d48b77d5a4793d0e4aa2c4a5e23ccd34f4d5d690c858ecba51ad3585571275a12fa3b5ec882c1a03abdc2db174f757e6002d642d9b13b42aafe46b53f1ca23

data/CHANGELOG.md

@@ -1,5 +1,9 @@
 # Changelog
 
+## 0.6.4 — 2026-09-24
+
+- Share Cartesian chart scales, axes, grid lines, ticks, and color-keyed legends across chart types.
+
 ## 0.6.3 — 2026-09-23
 
 - Render supplied text grid cells directly as cell surfaces, avoiding an extra wrapper per visible cell.

data/docs/components.md

@@ -87,7 +87,9 @@ Zaniah::UI::Button.variants[:variant][:brand] = ->(theme) {
 | L4 | `Grid` | `(rows:, columns:, row_height:, column_width:, frozen_rows:, frozen_columns:)`; `scroll_to`, range `selection`, `on_select`, `on_edit`, `on_fill`, `on_resize` | two-axis virtualization, frozen panes, visible-cell resize/fill callbacks | table |
 | L4 | `TreeView` | `(items, height:, selected:)`; `expand`, `collapse`, `replace`, `replace_children`, `invalidate`, lazy `children` proc | arrows/Home/End | tree/treeitem |
 | L5 | `Sparkline` | `(values, width:, height:, color:, label:)` | line + tooltip | image |
-| L5 | `LineChart`, `BarChart` | `(series, width:, height:, colors:, label:)` | axes, legend, tooltip | image |
+| L5 | `LineChart`, `BarChart`, `StackedBarChart`, `AreaChart` | `(series, width:, height:, colors:, label:)`; `AreaChart(stacked:)` | shared axes, ticks, grid lines, color-keyed legend, tooltip | image |
+| L5 | `PieChart`, `DonutChart` | `(data, width:, height:, colors:, label:)` | slices, shared color-keyed legend, tooltip | image |
+| L5 | `ScatterChart` | `(series, width:, height:, colors:, label:)` | shared axes, ticks, grid lines, color-keyed legend, nearest-point tooltip | image |
 | L5 | `Validation` | `required`, `format`, `length`, `number`, `rule` | composable rules | n/a |
 | L5 | `FormField` | `(name, value:, label:, control:, validation:, hint:)` | errors + describedby | group/control/alert |
 | L5 | `Form` | `field`, `on_change`, `on_submit`, `values`, `valid?` | validates before submit | form |

data/docs/tui.md

@@ -26,7 +26,7 @@ tests and non-window integrations.
 | Toast | live status text |
 | Table, DataGrid | header and visible rows separated with `|` |
 | TreeView | indentation with `▸`/`▾` expansion markers |
-| Sparkline, LineChart, BarChart | eight-level Unicode sparkline summary |
+| Sparkline and all chart types | eight-level Unicode sparkline summary |
 | Form, FormField | labeled values, `!` errors, and a submit button |
 | CodeEditor, RichText | numbered plain-text lines or concatenated text runs |
 

data/lib/zaniah/ui/charts.rb

@@ -32,14 +32,14 @@ module Zaniah
         result.freeze
       end
 
-      def paint_line(scene, bounds, values, color)
-        points = chart_points(bounds, values)
+      def paint_line(scene, bounds, values, color, range: nil)
+        points = chart_points(bounds, values, range: range)
         path = points.map.with_index { |(x, y), index| "#{index.zero? ? "M" : "L"}#{x},#{y}" }.join
         scene.path(path, stroke: color, width: 2)
       end
 
-      def chart_points(bounds, values)
-        minimum, maximum = values.minmax
+      def chart_points(bounds, values, range: nil)
+        minimum, maximum = range || values.minmax
         span = maximum == minimum ? 1.0 : maximum - minimum
         step = values.length == 1 ? 0 : bounds.width / (values.length - 1)
         values.map.with_index { |value, index| [bounds.x + index * step, bounds.bottom - (value - minimum) / span * bounds.height] }
@@ -83,6 +83,40 @@ module Zaniah
         span = maximum == minimum ? 1.0 : maximum - minimum
         values.map { |value| levels[((value - minimum) / span * (levels.length - 1)).round] }.join
       end
+
+      def chart_palette(cx)
+        palette = Array(@colors || [cx.theme.colors.accent, cx.theme.colors.info, cx.theme.colors.success, cx.theme.colors.warning])
+        raise ArgumentError, "chart colors must not be empty" if palette.empty?
+        palette
+      end
+
+      def chart_legend(entries, palette)
+        Div.new.flex_row.gap(10).children(entries.each_with_index.map do |entry, index|
+          label = block_given? ? yield(entry) : entry.to_s
+          Div.new.flex_row.items_center.gap(4)
+            .child(Div.new.w(8).h(8).bg(palette[index % palette.length]))
+            .child(Label.new(label, size: :xs))
+        end)
+      end
+
+      def cartesian_axes(scene, bounds, color)
+        divisions = 4
+        grid = (1...divisions).flat_map do |index|
+          fraction = index.to_f / divisions
+          x = bounds.x + bounds.width * fraction
+          y = bounds.y + bounds.height * fraction
+          ["M#{x},#{bounds.y}V#{bounds.bottom}", "M#{bounds.x},#{y}H#{bounds.right}"]
+        end.join
+        ticks = (1...divisions).flat_map do |index|
+          fraction = index.to_f / divisions
+          x = bounds.x + bounds.width * fraction
+          y = bounds.y + bounds.height * fraction
+          ["M#{x},#{bounds.bottom}V#{bounds.bottom - 3}", "M#{bounds.x},#{y}H#{bounds.x + 3}"]
+        end.join
+        scene.path(grid, stroke: color, width: 0.5)
+        scene.path("M#{bounds.x},#{bounds.y}V#{bounds.bottom}H#{bounds.right}", stroke: color, width: 1)
+        scene.path(ticks, stroke: color, width: 1)
+      end
     end
 
     class LineChart < Sparkline
@@ -96,25 +130,21 @@ module Zaniah
       end
 
       def build(cx)
-        palette = Array(@colors || [cx.theme.colors.accent, cx.theme.colors.info, cx.theme.colors.success, cx.theme.colors.warning])
+        palette = chart_palette(cx)
+        range = @series.values.flatten.minmax
         canvas = @canvas = Canvas.new do |bounds, context|
           @plot_bounds = bounds.inset(Edges.new(12, 8, 20, 28))
-          axes(context.scene, @plot_bounds, cx.theme.colors.border)
-          @series.each_with_index { |(_name, values), index| paint_line(context.scene, @plot_bounds, values, palette[index % palette.length]) }
+          cartesian_axes(context.scene, @plot_bounds, cx.theme.colors.border)
+          @series.each_with_index do |(_name, values), index|
+            paint_line(context.scene, @plot_bounds, values, palette[index % palette.length], range: range)
+          end
         end.w(@width).h(@height).on_hover { |event, context| show_line_tooltip(event, context) }
           .focusable(context: {in_chart: true}) { |action| chart_action(action, cx) }
-        legend = Div.new.flex_row.gap(10).children(@series.keys.each_with_index.map do |name, index|
-          Div.new.flex_row.items_center.gap(4).child(Div.new.w(8).h(8).bg(palette[index % palette.length])).child(Label.new(name, size: :xs))
-        end)
-        Div.new.gap(4).child(canvas).child(legend)
+        Div.new.gap(4).child(canvas).child(chart_legend(@series.keys, palette))
       end
 
       private
 
-      def axes(scene, bounds, color)
-        scene.path("M#{bounds.x},#{bounds.y}V#{bounds.bottom}H#{bounds.right}", stroke: color, width: 1)
-      end
-
       def show_line_tooltip(event, cx)
         return unless @plot_bounds
         text = @series.map do |name, values|
@@ -131,14 +161,15 @@ module Zaniah
       end
 
       def build(cx)
-        palette = Array(@colors || [cx.theme.colors.accent, cx.theme.colors.info, cx.theme.colors.success, cx.theme.colors.warning])
+        palette = chart_palette(cx)
+        @axis_color = cx.theme.colors.border
         canvas = @canvas = Canvas.new do |bounds, context|
           @plot_bounds = bounds.inset(Edges.new(12, 8, 20, 28))
-          axes(context.scene, @plot_bounds, cx.theme.colors.border)
+          cartesian_axes(context.scene, @plot_bounds, @axis_color)
           paint_bars(context.scene, @plot_bounds, palette)
         end.w(@width).h(@height).on_hover { |event, context| show_line_tooltip(event, context) }
           .focusable(context: {in_chart: true}) { |action| chart_action(action, cx) }
-        Div.new.gap(4).child(canvas).child(Label.new(@series.keys.join(" · "), size: :xs))
+        Div.new.gap(4).child(canvas).child(chart_legend(@series.keys, palette))
       end
 
       private
@@ -185,20 +216,16 @@ module Zaniah
       end
 
       def build(cx)
-        palette = Array(@colors || [cx.theme.colors.accent, cx.theme.colors.info, cx.theme.colors.success, cx.theme.colors.warning])
-        raise ArgumentError, "chart colors must not be empty" if palette.empty?
+        palette = chart_palette(cx)
 
         @canvas = Canvas.new do |bounds, context|
           @plot_bounds = bounds
           paint_slices(context.scene, bounds, palette)
         end.w(@width).h(@height).on_hover { |event, context| show_slice_tooltip(event, context) }
           .focusable(context: {in_chart: true}) { |action| chart_action(action, cx) }
-        legend = Div.new.flex_row.gap(10).children(@slices.each_with_index.map do |(name, value), index|
-          percent = value / @total * 100
-          Div.new.flex_row.items_center.gap(4)
-            .child(Div.new.w(8).h(8).bg(palette[index % palette.length]))
-            .child(Label.new("#{name}: #{format("%.1f", percent)}%", size: :xs))
-        end)
+        legend = chart_legend(@slices, palette) do |name, value|
+          "#{name}: #{format("%.1f", value / @total * 100)}%"
+        end
         Div.new.gap(4).child(@canvas).child(legend)
       end
 
@@ -308,20 +335,15 @@ module Zaniah
       end
 
       def build(cx)
-        palette = Array(@colors || [cx.theme.colors.accent, cx.theme.colors.info, cx.theme.colors.success, cx.theme.colors.warning])
-        raise ArgumentError, "chart colors must not be empty" if palette.empty?
+        palette = chart_palette(cx)
 
         canvas = @canvas = Canvas.new do |bounds, context|
           @plot_bounds = bounds.inset(Edges.new(12, 8, 20, 28))
-          paint_axes(context.scene, @plot_bounds, cx.theme.colors.border)
+          cartesian_axes(context.scene, @plot_bounds, cx.theme.colors.border)
           paint_points(context.scene, @plot_bounds, palette)
         end.w(@width).h(@height).on_hover { |event, context| show_scatter_tooltip(event, context) }
           .focusable(context: {in_chart: true}) { |action| chart_action(action, cx) }
-        legend = Div.new.flex_row.gap(10).children(@points.keys.each_with_index.map do |name, index|
-          Div.new.flex_row.items_center.gap(4).child(Div.new.w(8).h(8).bg(palette[index % palette.length]))
-            .child(Label.new(name, size: :xs))
-        end)
-        Div.new.gap(4).child(canvas).child(legend)
+        Div.new.gap(4).child(canvas).child(chart_legend(@points.keys, palette))
       end
 
       def tui_cells(*) = spark(@series.values.first)
@@ -341,10 +363,6 @@ module Zaniah
 
       private
 
-      def paint_axes(scene, bounds, color)
-        scene.path("M#{bounds.x},#{bounds.y}V#{bounds.bottom}H#{bounds.right}", stroke: color, width: 1)
-      end
-
       def paint_points(scene, bounds, palette)
         all = @points.values.flatten(1)
         min_x, max_x = all.map(&:first).minmax
@@ -381,20 +399,15 @@ module Zaniah
       end
 
       def build(cx)
-        palette = Array(@colors || [cx.theme.colors.accent, cx.theme.colors.info, cx.theme.colors.success, cx.theme.colors.warning])
-        raise ArgumentError, "chart colors must not be empty" if palette.empty?
+        palette = chart_palette(cx)
 
         canvas = @canvas = Canvas.new do |bounds, context|
           @plot_bounds = bounds.inset(Edges.new(12, 8, 20, 28))
-          axes(context.scene, @plot_bounds, cx.theme.colors.border)
+          cartesian_axes(context.scene, @plot_bounds, cx.theme.colors.border)
           paint_areas(context.scene, @plot_bounds, palette)
         end.w(@width).h(@height).on_hover { |event, context| show_line_tooltip(event, context) }
           .focusable(context: {in_chart: true}) { |action| chart_action(action, cx) }
-        legend = Div.new.flex_row.gap(10).children(@series.keys.each_with_index.map do |name, index|
-          Div.new.flex_row.items_center.gap(4).child(Div.new.w(8).h(8).bg(palette[index % palette.length]))
-            .child(Label.new(name, size: :xs))
-        end)
-        Div.new.gap(4).child(canvas).child(legend)
+        Div.new.gap(4).child(canvas).child(chart_legend(@series.keys, palette))
       end
 
       private
@@ -457,7 +470,7 @@ module Zaniah
             value.negative? ? negative[index] = finish : positive[index] = finish
           end
         end
-        scene.path("M#{bounds.x},#{zero}H#{bounds.right}", stroke: "#777", width: 1)
+        scene.path("M#{bounds.x},#{zero}H#{bounds.right}", stroke: @axis_color || "#777", width: 1)
       end
     end
   end

data/lib/zaniah/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module Zaniah
-  VERSION = "0.6.3"
+  VERSION = "0.6.4"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: zaniah
 version: !ruby/object:Gem::Version
-  version: 0.6.3
+  version: 0.6.4
 platform: ruby
 authors:
 - Yudai Takada