Skip to content

Per-cell CellStyle rendering: bgColor, textColor, font, alignment, borders #3

@witqq

Description

@witqq

Summary

All 15 CellStyle properties are defined in the type system and StylePool is fully implemented, but no render layer reads cellData.style — zero per-cell styling is rendered.

Current State

  • BackgroundLayer fills entire canvas with single theme.colors.background
  • CellTextLayer uses global theme.colors.cellText and theme.fonts.cell for all cells
  • GridLinesLayer draws uniform grid lines from theme
  • CellStyle.textAlign is ignored — alignment comes from CellTypeRenderer.align (per column type)
  • CellStyle.textWrap is ignored — wrapping comes from ColumnDef.wrapText (per column)
  • CellStyle.verticalAlign is ignored — always middle
  • CellStyle.indent is not read anywhere

Required Changes

Phase 1: Core styling (bgColor, textColor, font)

  • New CellBackgroundLayer (or extend existing) — iterate visible cells, fill per-cell bgColor
  • CellTextLayer — read cellData.style for textColor, fontFamily, fontSize, fontWeight, fontStyle
  • Font string construction: per-cell override > theme default

Phase 2: Alignment & layout

  • textAlign — per-cell override of CellTypeRenderer.align
  • verticalAlign — support top/middle/bottom
  • textWrap — per-cell override of ColumnDef.wrapText
  • indent — add left padding

Phase 3: Per-cell borders

  • GridLinesLayer — per-cell border color, width, style (solid/dashed/dotted)
  • Requires careful handling of shared borders between adjacent cells

Motivation

Real consumers (e.g., planeta-worktree2) are forced to create custom RenderLayer overlays that paint white over engine output and re-render because the engine ignores per-cell styles. This is the correct extension point but should be unnecessary for basic styling.

Files to modify

  • packages/core/src/renderer/layers/cell-text-layer.ts
  • packages/core/src/renderer/layers/background-layer.ts (or new CellBackgroundLayer)
  • packages/core/src/renderer/layers/grid-lines-layer.ts (Phase 3)
  • packages/core/src/renderer/render-context.ts (may need StylePool in context)

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions