Example interacting with tabs using lipgloss

[sspaink]

The lipgloss project has a cool example showing tabs but are static, took me a moment to figure out how to make them interactive so thought maybe someone else would benefit from an example as well. Partially addresses the issue asking for more examples with lipgloss integration: #88 also added a gif example similar to: #158

[koddr]

Wow! A great example that gives an excellent idea of how to work with tabs (which the README of the project cannot).
Thank you very much, I hope this gets accepted! ❤️

@sspaink another idea for an example to this project (which is great challenging, I think) is tabs with different list items (from the bubbles library) with different content loaded in each one.

Combining multiple elements (from bubbles and lipgloss) is the part of this great project that is almost always left out of the examples and (some kind of) documentation in README. I think this is why buttletea has such a high entry threshold and such a low number of stars on GitHub (as it could be), compared to other Go TUI frameworks.

[sspaink]

Thanks for the kind words! I spent some time working on this project using bubbletea that does use the tabs with different list items: https://github.com/sspaink/telegraf-companion the code can be found here: https://github.com/sspaink/telegraf-companion/blob/main/ui/sampleconfig_ui/plugin_page.go essentially managing a slice of lists.Model is all you need to do. I could update this example to show different list items as well.

[koddr]

Thanks @sspaink for the answer and the code example.
Although it's hard to understand it apart from the context of your app, but I'll try…

I could update this example to show different list items as well.

That would be just super awesome and kind of magic! 👍
If you have time for this, I would be thrilled with such a basic example with list.

[caarlos0]

cc/ @meowgorithm

[meowgorithm]

Hey, everyone. And, @sspaink, thank you the PR. We’ve been a little backed up this month, but we’ll get to this one.

In terms of the tabs-of-lists example, why don’t we do this:

1. Keep this example as-is so that people can get a quick understanding of how to work with tabs in Bubble Tea.
2. Add a separate example (in a separate PR) illustrating how to work with multiple lists in different tabs as suggested above.

[maaslalani]

Hey! Thank you for this PR, I cleaned up the example a tiny bit and made it the content also surrounded by a border.

tabexample.mov