[PR #712] [CLOSED] fix(markdown): word-wrap table cells instead of truncating content #1507

New issue

Closed

opened 2026-03-14 09:40:36 +03:00 by kerem · 0 comments

kerem commented

2026-03-14 09:40:36 +03:00

Owner

📋 Pull Request Information

Original PR: https://github.com/anomalyco/opentui/pull/712
Author: @mocksoul
Created: 2/19/2026
Status: ❌ Closed

Base: main ← Head: fix/table-word-wrap

📝 Commits (1)

5a98f4f feat(markdown): rewrite table layout to row-major for word-wrap support

📊 Changes

2 files changed (+231 additions, -196 deletions)

View changed files

📝 packages/core/src/renderables/Markdown.ts (+138 -138)
📝 packages/core/src/renderables/__tests__/Markdown.test.ts (+93 -58)

📄 Description

Fixes #711

Summary

Rewrites table layout from column-major to row-major so cells word-wrap instead of silently truncating content
Fixes row separator characters: │───│ → ├───┼───┤ (proper T-junctions)

Problem

Table cells were created with height: 1 and overflow: "hidden", silently cutting off any content that didn't fit in a single line. The column-major layout (each column as a separate flex-column) made it impossible to synchronize row heights across columns.

Solution

Row-major layout: each row is a flex-row container. Yoga's default alignItems: stretch automatically synchronizes cell heights within a row.

No explicit height or overflow on TextRenderable — measureFunc auto-calculates height from wrapped content
flexBasis set to natural column width (max content + padding + borders) for compact tables
flexShrink: 1 enables proportional shrinking with word-wrap when the table exceeds viewport width
customBorderChars per cell position for correct T-junction/cross characters

Testing

All 84 existing tests pass (25 snapshot updates for improved separator chars)
2 new tests for word-wrap behavior

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/anomalyco/opentui/pull/712 **Author:** [@mocksoul](https://github.com/mocksoul) **Created:** 2/19/2026 **Status:** ❌ Closed **Base:** `main` ← **Head:** `fix/table-word-wrap` --- ### 📝 Commits (1) - [`5a98f4f`](https://github.com/anomalyco/opentui/commit/5a98f4f40100cad3a901185f50fb9794bb368021) feat(markdown): rewrite table layout to row-major for word-wrap support ### 📊 Changes **2 files changed** (+231 additions, -196 deletions) <details> <summary>View changed files</summary> 📝 `packages/core/src/renderables/Markdown.ts` (+138 -138) 📝 `packages/core/src/renderables/__tests__/Markdown.test.ts` (+93 -58) </details> ### 📄 Description Fixes #711 ## Summary - Rewrites table layout from column-major to row-major so cells word-wrap instead of silently truncating content - Fixes row separator characters: `│───│` → `├───┼───┤` (proper T-junctions) ## Problem Table cells were created with `height: 1` and `overflow: "hidden"`, silently cutting off any content that didn't fit in a single line. The column-major layout (each column as a separate flex-column) made it impossible to synchronize row heights across columns. ## Solution **Row-major layout:** each row is a flex-row container. Yoga's default `alignItems: stretch` automatically synchronizes cell heights within a row. - No explicit `height` or `overflow` on `TextRenderable` — `measureFunc` auto-calculates height from wrapped content - `flexBasis` set to natural column width (max content + padding + borders) for compact tables - `flexShrink: 1` enables proportional shrinking with word-wrap when the table exceeds viewport width - `customBorderChars` per cell position for correct T-junction/cross characters ## Testing - All 84 existing tests pass (25 snapshot updates for improved separator chars) - 2 new tests for word-wrap behavior --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>