charmbracelet / bubbletea

A powerful little TUI framework 🏗
MIT License
27.78k stars 801 forks source link

FilterInput gets printed twice from time to time #580

Open demostanis opened 2 years ago

demostanis commented 2 years ago

I'm using list from bubbles in https://github.com/demostanis/metatorrent. Its height is set manually with SetSize() to be equal to the height of the terminal minus the height of the other elements surrounding the list. Everything works fine, but when pressing / to filter the elements in the list, the FitlerInput might appear twice, usually after using it a bit (writing something, then pressing backspaces multiple times, or ^U). The elements above the list get affected by this, and get moved up enough that a part of them is hidden. I have no idea what this is caused by. image When pressing escape to remove the filter, it is impossible to remove the duplicated one.

griimick commented 2 years ago

Need a little clarification on setSize(width, height) method of List,


Sharing here for context, the application in the issue description takes the approach of dividing the full terminal height into parts as follows,

title + status + list + search = terminal height
list = terminal height - title - status - search

Out of them, after calculate the remaining height and set it to list. I noticed that the list exceeds its configured height when the filter is toggled or when the filter string is changed causing this glitch to happen.

A workaround was applied to wrap the list in a lipgloss.NewStyle(expectedHeight).MaxHeight().Render(list) to stop the overflowing.

alxndr13 commented 1 year ago

Fixed this by using the follwing snippet in my view update function

func (m model) View() string {
    return lipgloss.NewStyle().Render(m.list.View())
}

alternatively: in the Update func, just substract 1 from the width and height of the frame size:

    case tea.WindowSizeMsg:
        h, v := docStyle.GetFrameSize()
        m.list.SetSize(msg.Width-h-1, msg.Height-v-1)