Filtered item shows escaped style color

[jeffdupont]

Describe the bug I have a list item with a colored style applied in the title. When I filter the list, it shows the colors escaped in the terminal

Setup Build any list and add a lipgloss color style to the Title

Expected behavior Color is still properly displayed for filtered items

Screenshots Unfiltered:

Filtered:

[meowgorithm]

Good catch. Do you have any code we can use to reproduce?

[pjg11]

I came across a similar issue - charmbracelet/bubbletea#523 The sample program mentioned there produces a similar output.

[jeffdupont]

Their response was to move it to a discussion but not address it. I think this is a bug as the rendering of the list item works, my filter shouldn't change how the list-item is rendered. It should just remove the items not part of the filter.

[jeffdupont]

Good catch. Do you have any code we can use to reproduce?

Sorry, yes. The link from @pjg11 also has a good example of the same issue. But create any list and then in the Title() func just apply a lipgloss.Style to the title value. In my case it was

func (m model) Title() string {
    color := lipgloss.NewStyle().Background(lipgloss.Color("#fff000")).MarginRight(1).Render("X")
    return lipgloss.JoinHorizontal(lipgloss.Left, color, m.Title)
}

[jeffdupont]

I pulled down the PR code to check it in my code and was able to confirm that PR would fix this issue.

[blvrd]

Looks like @muesli recommended defining your own itemDelegate in https://github.com/charmbracelet/bubbletea/issues/523. Is that still the recommended way to work around this? Or should I try picking up where #452 left off?

[jeffdupont]

Latest version seemed to correct it for me.

On March 21, 2024, Github Notification @.***> wrote:

Looks like @muesli https://github.com/muesli recommended defining your own itemDelegate <https://github.com/charmbracelet/bubbletea/blob/master/examples/list- simple/main.go#L29-L50> in charmbracelet/bubbletea#523 https://github.com/charmbracelet/bubbletea/issues/523. Is that still the recommended way to work around this? Or should I try picking up where #452 https://github.com/charmbracelet/bubbles/pull/452 left off?

— Reply to this email directly, view it on GitHub <https://github.com/charmbracelet/bubbles/issues/430#issuecomment- 2013759579>, or unsubscribe <https://github.com/notifications/unsubscribe- auth/AABUP6C4VF4D6I5TTURUGMTYZNFEZAVCNFSM6AAAAAA7B3B2OOVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDAMJTG42TSNJXHE>. You are receiving this because you authored the thread.Message ID: @.***>

[blvrd]

For anyone coming across this thread, I've fixed my issue by defining a custom item delegate.