Comments (4)
meowgorithm
commented on June 10, 2024
1
For now, I'd probably workaround this by simply placing the short column (or all columns) over the appropriate background color with lipgloss.Place (see example and docs).
Here’s how I'd fix my above example (in a real scenario I'd abstract the Place stuff and generalize it to work for all columns):
package main
import (
"fmt"
"github.com/charmbracelet/lipgloss"
)
func main() {
const blue = lipgloss.Color("#0000FF")
redStyle := lipgloss.NewStyle().
Background(lipgloss.Color("#FF0000")).
Width(10)
greenStyle := lipgloss.NewStyle().
Background(lipgloss.Color("#00FF00")).
Width(10)
outerStyle := lipgloss.NewStyle().
Width(40).
Background(blue)
leftContent := greenStyle.Render("left text")
middleContent := redStyle.Render("multi\nline\ncenter\ntext\nwow")
rightContent := greenStyle.Render("right text")
fmt.Println(outerStyle.Render(
lipgloss.JoinHorizontal(
lipgloss.Center,
leftContent,
middleContent,
lipgloss.Place(
lipgloss.Width(rightContent), // width
lipgloss.Height(middleContent), // height
lipgloss.Left, // x
lipgloss.Center, // y
rightContent, // content
lipgloss.WithWhitespaceBackground(blue), // background
),
)))
}Output:
from lipgloss.
drakenstar
commented on June 10, 2024
Ok I dug into this and I think found the reason for this output. wordwrap.String called by Style.Render will not output spaces at the end of a line unless it finds a \n character before the limit. For example:
s := wordwrap.String("test test ", 6)
fmt.Print(s)
// "test\ntest"
s := wordwrap.String("test \ntest ", 6)
fmt.Print(s)
// "test \ntest"This is arguably surprising from their end, however lipgloss could workaround this by trimming whitespace this output if it is not styled by seeking backwards per line for \x1b[0m and trimming spaces after it.
I'm happy to PR this if there's agreement it should be fixed.
from lipgloss.
meowgorithm
commented on June 10, 2024
Okay yep, this is indeed a bug. I suspect the solution may be may complex than this, though we'll need to look into it further before we can have an opinion on the fix.
Here's a centered use case to further illustrate the issue.
package main
import (
"fmt"
"github.com/charmbracelet/lipgloss"
)
func main() {
redStyle := lipgloss.NewStyle().
Background(lipgloss.Color("#FF0000")).
Width(10)
greenStyle := lipgloss.NewStyle().
Background(lipgloss.Color("#00FF00")).
Width(10)
outerStyle := lipgloss.NewStyle().
Width(40).
Background(lipgloss.Color("#0000FF"))
fmt.Println(outerStyle.Render(lipgloss.JoinHorizontal(lipgloss.Center,
greenStyle.Render("left text"),
redStyle.Render("multi\nline\ncenter\ntext\nwow"),
greenStyle.Render("right text"),
)))
}from lipgloss.
drakenstar
commented on June 10, 2024
I've worked around this locally doing as I described above and trimming space characters from the end of a line if they are immediately preceded by a reset sequence.
However there's another harder case that workaround still doesn't solve:
redStyle := lipgloss.NewStyle().
Background(lipgloss.Color("#FF0000")).
Width(10)
greenStyle := lipgloss.NewStyle().
Background(lipgloss.Color("#00FF00")).
Width(10)
outerStyle := lipgloss.NewStyle().
Width(40).
Background(lipgloss.Color("#0000FF"))
fmt.Println(outerStyle.Render(lipgloss.JoinHorizontal(0,
redStyle.Render("multi\nline"),
greenStyle.Render("left text"),
redStyle.Render("multi\nline"),
)))Resulting in:
A more complete solve for this is probably inspecting each line for segments that have no styling any applying the current style to them.
from lipgloss.
Related Issues (20)
- TopRight and BottomRight border not showing when rendering an empty string and no left border HOT 1
- OSC 8 (hyperlink) supports. HOT 12
- String transform method
- style.go::Render at 'Render core text' is not ansi aware when using a spaced styler HOT 1
- Text alignment logic is backwards for non-special-cases
- Overlap views HOT 2
- Unable to add right margin to an empty string HOT 3
- "nonspacing mark" unicode causes container's width to shift HOT 2
- Table without border and header truncates last line
- checksum mismatch HOT 3
- Table: truncation breaks ANSI styling HOT 3
- WithProfile not respected in custom rendered
- `Style.GetFrameSize()` does not account for border when using only `BorderStyle()` HOT 2
- Last line is misaligned if element aligned horizontally with set width
- Weird behaviour when using lipgloss in a test HOT 2
- Proposal: pure NewStyle, Lip Gloss v2
- `Style.Width()` and `Style.GetHorizontalFrameSize()` both include padding
- Rendering Issues on Windows PowerShell
- Use Tree API
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from lipgloss.