konpeito 0.1.0

data/lib/konpeito/ui/widgets/tabs.rb

@@ -0,0 +1,157 @@
+# Tabs widget - tabbed container with header buttons
+# Port of Castella Tabs
+
+class Tabs < Layout
+  def initialize(labels, contents)
+    super()
+    @tab_labels = labels
+    @tab_contents = contents
+    @selected = 0
+    @tab_height = 36.0
+    @font_size_val = 13.0
+    @width_policy = EXPANDING
+    @height_policy = EXPANDING
+    @tab_widths = []
+    # Add initial content
+    if @tab_contents.length > 0
+      add(@tab_contents[0])
+    end
+  end
+
+  def select_tab(index)
+    if index >= 0
+      if index < @tab_contents.length
+        if index != @selected
+          @selected = index
+          clear_children
+          add(@tab_contents[@selected])
+          mark_dirty
+          mark_layout_dirty
+          update
+        end
+      end
+    end
+    self
+  end
+
+  def relocate_children(painter)
+    # Content area starts below tab header
+    content_y = @y + @tab_height
+    content_h = @height - @tab_height
+    if content_h < 0.0
+      content_h = 0.0
+    end
+    if @children.length > 0
+      c = @children[0]
+      c.move_xy(@x, content_y)
+      c.resize_wh(@width, content_h)
+    end
+  end
+
+  def measure(painter)
+    Size.new(@width, @height)
+  end
+
+  def redraw(painter, completely)
+    # 1) Layout + draw children first (redraw_children may clear the entire area)
+    relocate_children(painter)
+    redraw_children(painter, completely)
+
+    # 2) Draw tab bar ON TOP so it is not overwritten by background clear
+    draw_tab_bar(painter)
+  end
+
+  def draw_tab_bar(painter)
+    tab_bg = $theme.bg_canvas
+    tab_active_bg = $theme.bg_primary
+    tab_text_c = $theme.text_secondary
+    tab_active_text = $theme.text_primary
+    tab_border_c = $theme.border
+    tab_indicator_c = $theme.accent
+
+    # Tab bar background
+    painter.fill_rect(0.0, 0.0, @width, @tab_height, tab_bg)
+
+    # Calculate tab widths based on labels
+    @tab_widths = []
+    pad_h = 16.0
+    i = 0
+    while i < @tab_labels.length
+      tw = painter.measure_text_width(@tab_labels[i], $theme.font_family, @font_size_val)
+      @tab_widths.push(tw + pad_h * 2.0)
+      i = i + 1
+    end
+
+    # Draw each tab header
+    ascent = painter.get_text_ascent($theme.font_family, @font_size_val)
+    draw_tab_headers(painter, ascent, tab_active_bg, tab_active_text, tab_text_c, tab_indicator_c)
+
+    # Border line below tabs
+    painter.draw_line(0.0, @tab_height, @width, @tab_height, tab_border_c, 1.0)
+  end
+
+  def draw_tab_headers(painter, ascent, active_bg, active_tc, inactive_tc, indicator_c)
+    tab_x = 0.0
+    i = 0
+    while i < @tab_labels.length
+      tw = @tab_widths[i]
+      draw_one_tab(painter, i, tab_x, tw, ascent, active_bg, active_tc, inactive_tc, indicator_c)
+      tab_x = tab_x + tw
+      i = i + 1
+    end
+  end
+
+  def draw_one_tab(painter, i, tab_x, tw, ascent, active_bg, active_tc, inactive_tc, indicator_c)
+    is_selected = (i == @selected)
+
+    # Tab background
+    if is_selected
+      painter.fill_rect(tab_x, 0.0, tw, @tab_height, active_bg)
+    end
+
+    # Tab label
+    if is_selected
+      tc = active_tc
+    else
+      tc = inactive_tc
+    end
+    label_w = painter.measure_text_width(@tab_labels[i], $theme.font_family, @font_size_val)
+    text_x = tab_x + (tw - label_w) / 2.0
+    text_y = (@tab_height - painter.measure_text_height($theme.font_family, @font_size_val)) / 2.0 + ascent
+    painter.draw_text(@tab_labels[i], text_x, text_y, $theme.font_family, @font_size_val, tc)
+
+    # Active indicator line at bottom
+    if is_selected
+      painter.fill_rect(tab_x, @tab_height - 2.0, tw, 2.0, indicator_c)
+    end
+  end
+
+  def mouse_down(ev)
+    # Check if click is in the tab header area
+    click_y = ev.pos.y
+    if click_y < @tab_height
+      find_clicked_tab(ev.pos.x)
+    end
+  end
+
+  def find_clicked_tab(click_x)
+    tab_x = 0.0
+    i = 0
+    while i < @tab_widths.length
+      tw = @tab_widths[i]
+      if click_x >= tab_x
+        if click_x < tab_x + tw
+          select_tab(i)
+          return
+        end
+      end
+      tab_x = tab_x + tw
+      i = i + 1
+    end
+  end
+end
+
+# Top-level helper
+def Tabs(labels, contents)
+  Tabs.new(labels, contents)
+end

data/lib/konpeito/ui/widgets/text.rb

@@ -0,0 +1,110 @@
+# Text widget - displays text
+# Port of Castella Text
+
+# Text alignment constants
+TEXT_ALIGN_LEFT = 0
+TEXT_ALIGN_CENTER = 1
+TEXT_ALIGN_RIGHT = 2
+
+class Text < Widget
+  def initialize(text)
+    super()
+    @text = text
+    @font_family_val = nil
+    @font_size_val = 14.0
+    @color_val = 0xFFC0CAF5
+    @custom_color = false
+    @kind_val = 0
+    @text_align = TEXT_ALIGN_LEFT
+    @font_weight = 0
+    @font_slant = 0
+    @width_policy = CONTENT
+    @height_policy = CONTENT
+  end
+
+  def font_size(s)
+    @font_size_val = s
+    self
+  end
+
+  def font_family(f)
+    @font_family_val = f
+    self
+  end
+
+  def resolved_font_family
+    if @font_family_val != nil
+      @font_family_val
+    else
+      $theme.font_family
+    end
+  end
+
+  def bold
+    @font_weight = 1
+    self
+  end
+
+  def italic
+    @font_slant = 1
+    self
+  end
+
+  def color(c)
+    @color_val = c
+    @custom_color = true
+    self
+  end
+
+  def kind(k)
+    @kind_val = k
+    self
+  end
+
+  def align(a)
+    @text_align = a
+    self
+  end
+
+  def set_text(t)
+    @text = t
+    mark_dirty
+  end
+
+  def get_text
+    @text
+  end
+
+  def measure(painter)
+    ff = resolved_font_family
+    w = painter.measure_text_width(@text, ff, @font_size_val)
+    h = painter.measure_text_height(ff, @font_size_val)
+    Size.new(w, h)
+  end
+
+  def redraw(painter, completely)
+    ff = resolved_font_family
+    ascent = painter.get_text_ascent(ff, @font_size_val)
+    x_offset = 0.0
+    if @text_align == TEXT_ALIGN_CENTER
+      text_w = painter.measure_text_width(@text, ff, @font_size_val)
+      x_offset = (@width - text_w) / 2.0
+      if x_offset < 0.0
+        x_offset = 0.0
+      end
+    elsif @text_align == TEXT_ALIGN_RIGHT
+      text_w = painter.measure_text_width(@text, ff, @font_size_val)
+      x_offset = @width - text_w
+      if x_offset < 0.0
+        x_offset = 0.0
+      end
+    end
+    c = @custom_color ? @color_val : $theme.text_color_for_kind(@kind_val)
+    painter.draw_text(@text, x_offset, ascent, ff, @font_size_val, c, @font_weight, @font_slant)
+  end
+end
+
+# Top-level helper
+def Text(text)
+  Text.new(text)
+end

data/lib/konpeito/ui/widgets/tree.rb

@@ -0,0 +1,426 @@
+# Tree - expandable tree view widget with virtual scroll
+# Features: expand/collapse, selection, hover highlight, icons,
+#           virtual scroll (only visible rows rendered)
+
+TREE_ROW_HEIGHT = 26.0
+TREE_INDENT = 20.0
+TREE_ICON_SIZE = 16.0
+TREE_TOGGLE_SIZE = 16.0
+TREE_SCROLLBAR_WIDTH = 8.0
+
+# TreeNode - data model for tree items
+class TreeNode
+  def initialize(id, label)
+    @id = id
+    @label = label
+    @children = []
+    @icon = nil
+    @data = nil
+  end
+
+  def id
+    @id
+  end
+
+  def label
+    @label
+  end
+
+  def children
+    @children
+  end
+
+  def icon
+    @icon
+  end
+
+  def data
+    @data
+  end
+
+  def set_icon(i)
+    @icon = i
+    self
+  end
+
+  def set_data(d)
+    @data = d
+    self
+  end
+
+  def add_child(child)
+    @children << child
+    self
+  end
+
+  def has_children
+    @children.length > 0
+  end
+end
+
+# TreeState - reactive state for tree
+class TreeState < ObservableBase
+  def initialize(nodes)
+    super()
+    @nodes = nodes               # Array of TreeNode (root nodes)
+    @expanded_ids = []            # Array of expanded node IDs
+    @selected_id = "none"
+  end
+
+  def nodes
+    @nodes
+  end
+
+  def selected_id
+    @selected_id
+  end
+
+  def is_expanded(id)
+    i = 0
+    while i < @expanded_ids.length
+      if @expanded_ids[i] == id
+        return true
+      end
+      i = i + 1
+    end
+    false
+  end
+
+  def toggle_expanded(id)
+    if is_expanded(id)
+      collapse(id)
+    else
+      expand(id)
+    end
+  end
+
+  def expand(id)
+    if is_expanded(id)
+      return
+    end
+    @expanded_ids << id
+    notify_observers
+  end
+
+  def collapse(id)
+    new_ids = []
+    i = 0
+    while i < @expanded_ids.length
+      if @expanded_ids[i] != id
+        new_ids << @expanded_ids[i]
+      end
+      i = i + 1
+    end
+    @expanded_ids = new_ids
+    notify_observers
+  end
+
+  def expand_all
+    collect_all_ids(@nodes)
+    notify_observers
+  end
+
+  def collapse_all
+    @expanded_ids = []
+    notify_observers
+  end
+
+  def select(id)
+    @selected_id = id
+    notify_observers
+  end
+
+  def set_nodes(n)
+    @nodes = n
+    @expanded_ids = []
+    @selected_id = "none"
+    notify_observers
+  end
+
+  private
+
+  def collect_all_ids(nodes)
+    i = 0
+    while i < nodes.length
+      node = nodes[i]
+      if node.has_children
+        @expanded_ids << node.id
+        collect_all_ids(node.children)
+      end
+      i = i + 1
+    end
+  end
+end
+
+# Tree widget - custom drawing with virtual scroll
+class Tree < Widget
+  def initialize(state)
+    super()
+    @state = state
+    @scroll_y = 0.0
+    @max_scroll = 0.0
+    @scrollable_flag = true
+    @hover_row = -1
+    @visible_nodes = []     # Flat list of [node, depth] pairs for rendering
+    @width_policy = EXPANDING
+    @height_policy = EXPANDING
+    @state.attach(self)
+  end
+
+  def on_attach(observable)
+  end
+
+  def on_detach(observable)
+  end
+
+  def on_notify
+    rebuild_visible
+    mark_dirty
+    update
+  end
+
+  def get_scrollable
+    @scrollable_flag
+  end
+
+  def rebuild_visible
+    @visible_nodes = []
+    collect_visible(@state.nodes, 0)
+  end
+
+  def collect_visible(nodes, depth)
+    i = 0
+    while i < nodes.length
+      node = nodes[i]
+      @visible_nodes << [node, depth]
+      if node.has_children
+        if @state.is_expanded(node.id)
+          collect_visible(node.children, depth + 1)
+        end
+      end
+      i = i + 1
+    end
+  end
+
+  def redraw(painter, completely)
+    rebuild_visible
+    visible_h = @height
+    compute_tree_scroll(visible_h)
+
+    # Background
+    painter.fill_rect(0.0, 0.0, @width, @height, $theme.bg_primary)
+
+    # Clip and draw visible rows
+    painter.save
+    painter.clip_rect(0.0, 0.0, @width, @height)
+
+    first_row = tree_float_to_row(@scroll_y / TREE_ROW_HEIGHT)
+    if first_row < 0
+      first_row = 0
+    end
+    last_row = tree_float_to_row((@scroll_y + visible_h) / TREE_ROW_HEIGHT) + 1
+    if last_row > @visible_nodes.length
+      last_row = @visible_nodes.length
+    end
+
+    ri = first_row
+    while ri < last_row
+      draw_tree_row(painter, ri)
+      ri = ri + 1
+    end
+
+    painter.restore
+
+    # Scrollbar
+    draw_tree_scrollbar(painter, visible_h)
+  end
+
+  def draw_tree_row(painter, ri)
+    entry = @visible_nodes[ri]
+    node = entry[0]
+    depth = entry[1]
+    ri_f = ri * 1.0
+    row_y = ri_f * TREE_ROW_HEIGHT - @scroll_y
+
+    # Background: selection > hover > alternating
+    bg = compute_tree_row_bg(painter, ri, node)
+    painter.fill_rect(0.0, row_y, @width, TREE_ROW_HEIGHT, bg)
+
+    # Indent
+    indent = depth * 1.0 * TREE_INDENT + 8.0
+
+    # Toggle icon (expand/collapse arrow)
+    if node.has_children
+      draw_toggle(painter, indent, row_y, node)
+    end
+
+    # Label
+    label_x = indent + TREE_TOGGLE_SIZE + 4.0
+    ascent = painter.get_text_ascent($theme.font_family, 13.0)
+    mh = painter.measure_text_height($theme.font_family, 13.0)
+    label_y = row_y + (TREE_ROW_HEIGHT - mh) / 2.0 + ascent
+    tc = $theme.text_primary
+    painter.draw_text(node.label, label_x, label_y, $theme.font_family, 13.0, tc)
+
+    # Bottom border
+    bc = painter.with_alpha($theme.border, 30)
+    painter.draw_line(0.0, row_y + TREE_ROW_HEIGHT, @width, row_y + TREE_ROW_HEIGHT, bc, 1.0)
+  end
+
+  def draw_toggle(painter, indent, row_y, node)
+    # Draw a small triangle: > for collapsed, v for expanded
+    tx = indent + TREE_TOGGLE_SIZE / 2.0
+    ty = row_y + TREE_ROW_HEIGHT / 2.0
+    tc = $theme.text_secondary
+    s = 5.0
+    if @state.is_expanded(node.id)
+      # Down arrow (v)
+      painter.fill_triangle(tx - s, ty - s / 2.0,
+                            tx + s, ty - s / 2.0,
+                            tx, ty + s / 2.0, tc)
+    else
+      # Right arrow (>)
+      painter.fill_triangle(tx - s / 2.0, ty - s,
+                            tx + s / 2.0, ty,
+                            tx - s / 2.0, ty + s, tc)
+    end
+  end
+
+  def compute_tree_row_bg(painter, ri, node)
+    bg = $theme.bg_primary
+    if node.id == @state.selected_id
+      ac = $theme.accent
+      bg = painter.with_alpha(ac, 50)
+    elsif ri == @hover_row
+      bg = painter.lighten_color(bg, 0.08)
+    end
+    bg
+  end
+
+  def draw_tree_scrollbar(painter, visible_h)
+    if @max_scroll <= 0.0
+      return
+    end
+    vn_len = @visible_nodes.length * 1.0
+    content_h = vn_len * TREE_ROW_HEIGHT
+    sb_x = @width - TREE_SCROLLBAR_WIDTH
+    sb_ratio = visible_h / content_h
+    sb_h = visible_h * sb_ratio
+    if sb_h < 20.0
+      sb_h = 20.0
+    end
+    sb_travel = visible_h - sb_h
+    sb_pos = 0.0
+    if @max_scroll > 0.0
+      sb_pos = (@scroll_y / @max_scroll) * sb_travel
+    end
+    painter.fill_rect(sb_x, 0.0, TREE_SCROLLBAR_WIDTH, visible_h, $theme.scrollbar_bg)
+    painter.fill_round_rect(sb_x + 1.0, sb_pos, TREE_SCROLLBAR_WIDTH - 2.0, sb_h, 3.0, $theme.scrollbar_fg)
+  end
+
+  # --- Event Handlers ---
+
+  def mouse_up(ev)
+    mx = ev.pos.x
+    my = ev.pos.y
+    row_idx = tree_row_at_y(my)
+    if row_idx < 0
+      return
+    end
+    if row_idx >= @visible_nodes.length
+      return
+    end
+    entry = @visible_nodes[row_idx]
+    node = entry[0]
+    depth = entry[1]
+    indent = depth * 1.0 * TREE_INDENT + 8.0
+    toggle_end = indent + TREE_TOGGLE_SIZE
+    if mx < toggle_end
+      if node.has_children
+        @state.toggle_expanded(node.id)
+        return
+      end
+    end
+    @state.select(node.id)
+  end
+
+  def cursor_pos(ev)
+    my = ev.pos.y
+    old_hr = @hover_row
+    @hover_row = tree_row_at_y(my)
+    if @hover_row != old_hr
+      mark_dirty
+      update
+    end
+  end
+
+  def mouse_out
+    if @hover_row != -1
+      @hover_row = -1
+      mark_dirty
+      update
+    end
+  end
+
+  def dispatch_to_scrollable(p, is_direction_x)
+    if contain(p)
+      [self, p]
+    else
+      [nil, nil]
+    end
+  end
+
+  def mouse_wheel(ev)
+    @scroll_y = @scroll_y - ev.delta_y * 30.0
+    if @scroll_y < 0.0
+      @scroll_y = 0.0
+    end
+    if @scroll_y > @max_scroll
+      @scroll_y = @max_scroll
+    end
+    mark_dirty
+    update
+  end
+
+  private
+
+  def compute_tree_scroll(visible_h)
+    vn_len = @visible_nodes.length * 1.0
+    content_h = vn_len * TREE_ROW_HEIGHT
+    @max_scroll = content_h - visible_h
+    if @max_scroll < 0.0
+      @max_scroll = 0.0
+    end
+    if @scroll_y > @max_scroll
+      @scroll_y = @max_scroll
+    end
+    if @scroll_y < 0.0
+      @scroll_y = 0.0
+    end
+  end
+
+  def tree_row_at_y(y)
+    row = tree_float_to_row((y + @scroll_y) / TREE_ROW_HEIGHT)
+    if row < 0
+      row = -1
+    end
+    if row >= @visible_nodes.length
+      row = -1
+    end
+    row
+  end
+
+  def tree_float_to_row(f)
+    # Convert float to integer row index without .to_i (JVM limitation)
+    r = 0
+    while r * 1.0 + 1.0 <= f
+      r = r + 1
+    end
+    r
+  end
+end
+
+# Top-level helper
+def Tree(state)
+  Tree.new(state)
+end

data/lib/konpeito/version.rb

@@ -0,0 +1,5 @@
+# frozen_string_literal: true
+
+module Konpeito
+  VERSION = "0.1.0"
+end