2020-07-30 02:24:09 +03:00
|
|
|
|
Bubbles
|
|
|
|
|
=======
|
2020-01-28 05:29:52 +03:00
|
|
|
|
|
2020-11-20 03:11:24 +03:00
|
|
|
|
<p>
|
|
|
|
|
<img src="https://stuff.charm.sh/bubbles/bubbles-github.png" width="233" alt="The Bubbles Logo">
|
|
|
|
|
</p>
|
|
|
|
|
|
2020-10-24 09:39:00 +03:00
|
|
|
|
[![Latest Release](https://img.shields.io/github/release/charmbracelet/bubbles.svg)](https://github.com/charmbracelet/bubbles/releases)
|
2020-10-24 09:43:30 +03:00
|
|
|
|
[![GoDoc](https://godoc.org/github.com/golang/gddo?status.svg)](https://pkg.go.dev/github.com/charmbracelet/bubbles)
|
2020-10-19 07:08:19 +03:00
|
|
|
|
[![Build Status](https://github.com/charmbracelet/bubbles/workflows/build/badge.svg)](https://github.com/charmbracelet/bubbles/actions)
|
2021-05-18 21:56:22 +03:00
|
|
|
|
[![Go ReportCard](https://goreportcard.com/badge/charmbracelet/bubbles)](https://goreportcard.com/report/charmbracelet/bubbles)
|
2020-01-28 05:29:52 +03:00
|
|
|
|
|
2021-03-02 15:44:53 +03:00
|
|
|
|
Some components for [Bubble Tea](https://github.com/charmbracelet/bubbletea)
|
|
|
|
|
applications. These components are used in production in [Glow][glow],
|
|
|
|
|
[Charm][charm] and [many other applications][otherstuff].
|
2020-07-17 21:01:48 +03:00
|
|
|
|
|
2020-10-06 20:25:46 +03:00
|
|
|
|
[glow]: https://github.com/charmbracelet/glow
|
|
|
|
|
[charm]: https://github.com/charmbracelet/charm
|
2021-03-02 15:44:53 +03:00
|
|
|
|
[otherstuff]: https://github.com/charmbracelet/bubbletea/#bubble-tea-in-the-wild
|
2020-07-29 23:34:01 +03:00
|
|
|
|
|
|
|
|
|
|
2020-07-17 21:01:48 +03:00
|
|
|
|
## Spinner
|
|
|
|
|
|
2020-07-30 02:20:41 +03:00
|
|
|
|
<img src="https://stuff.charm.sh/bubbles-examples/spinner.gif" width="400" alt="Spinner Example">
|
|
|
|
|
|
2020-07-29 23:34:01 +03:00
|
|
|
|
A spinner, useful for indicating that some kind an operation is happening.
|
|
|
|
|
There are a couple default ones, but you can also pass your own ”frames.”
|
|
|
|
|
|
2021-03-02 15:44:53 +03:00
|
|
|
|
* [Example code, basic spinner](https://github.com/charmbracelet/tea/tree/master/examples/spinner/main.go)
|
|
|
|
|
* [Example code, various spinners](https://github.com/charmbracelet/tea/tree/master/examples/spinners/main.go)
|
2020-07-29 23:34:01 +03:00
|
|
|
|
|
2020-07-17 21:01:48 +03:00
|
|
|
|
|
|
|
|
|
## Text Input
|
|
|
|
|
|
2020-07-30 02:20:41 +03:00
|
|
|
|
<img src="https://stuff.charm.sh/bubbles-examples/textinput.gif" width="400" alt="Text Input Example">
|
|
|
|
|
|
2020-07-29 23:34:01 +03:00
|
|
|
|
A text input field, akin to an `<input type="text">` in HTML. Supports unicode,
|
|
|
|
|
pasting, in-place scrolling when the value exceeds the width of the element and
|
|
|
|
|
the common, and many customization options.
|
|
|
|
|
|
2020-07-29 23:38:59 +03:00
|
|
|
|
* [Example code, one field](https://github.com/charmbracelet/tea/tree/master/examples/textinput/main.go)
|
2020-10-24 09:36:29 +03:00
|
|
|
|
* [Example code, many fields](https://github.com/charmbracelet/tea/tree/master/examples/textinputs/main.go)
|
2020-07-29 23:34:01 +03:00
|
|
|
|
|
2020-07-17 21:01:48 +03:00
|
|
|
|
|
2021-01-13 01:27:14 +03:00
|
|
|
|
## Progress
|
|
|
|
|
|
|
|
|
|
<img src="https://stuff.charm.sh/bubbles-examples/progress.gif" width="800" alt="Progressbar Example">
|
|
|
|
|
|
2021-01-13 02:17:42 +03:00
|
|
|
|
A simple, customizable progress meter. Supports solid and gradient fills. The
|
2021-01-13 01:53:56 +03:00
|
|
|
|
empty and filled runes can be set to whatever you'd like. The percentage readout
|
|
|
|
|
is customizable and can also be omitted entirely.
|
2021-01-13 01:27:14 +03:00
|
|
|
|
|
2021-01-13 02:17:42 +03:00
|
|
|
|
* [Example code](https://github.com/charmbracelet/bubbletea/blob/master/examples/progress/main.go)
|
|
|
|
|
|
|
|
|
|
|
2020-07-17 21:01:48 +03:00
|
|
|
|
## Paginator
|
|
|
|
|
|
2020-07-30 02:20:41 +03:00
|
|
|
|
<img src="https://stuff.charm.sh/bubbles-examples/pagination.gif" width="200" alt="Paginator Example">
|
|
|
|
|
|
2020-07-17 21:01:48 +03:00
|
|
|
|
A component for handling pagination logic and optionally drawing pagination UI.
|
2020-07-29 23:38:59 +03:00
|
|
|
|
Supports "dot-style" pagination (similar to what you might see on iOS) and
|
|
|
|
|
numeric page numbering, but you could also just use this component for the
|
|
|
|
|
logic and visualize pagination however you like.
|
2020-07-17 21:01:48 +03:00
|
|
|
|
|
2021-03-02 15:44:53 +03:00
|
|
|
|
* [Example code](https://github.com/charmbracelet/bubbletea/blob/master/examples/pager/main.go)
|
2020-07-29 23:34:01 +03:00
|
|
|
|
|
|
|
|
|
|
2020-07-17 21:01:48 +03:00
|
|
|
|
## Viewport
|
|
|
|
|
|
2020-07-30 02:20:41 +03:00
|
|
|
|
<img src="https://stuff.charm.sh/bubbles-examples/viewport.gif" width="600" alt="Viewport Example">
|
|
|
|
|
|
2020-07-29 23:34:01 +03:00
|
|
|
|
A viewport for vertically scrolling content. Optionally includes standard
|
2020-07-17 21:01:48 +03:00
|
|
|
|
pager keybindings and mouse wheel support. A high performance mode is available
|
2021-01-13 02:19:20 +03:00
|
|
|
|
for applications which make use of the alternate screen buffer.
|
2020-07-29 23:34:01 +03:00
|
|
|
|
|
2020-07-29 23:38:59 +03:00
|
|
|
|
* [Example code](https://github.com/charmbracelet/tea/tree/master/examples/pager/main.go)
|
2020-07-29 23:34:01 +03:00
|
|
|
|
|
2020-10-19 06:56:55 +03:00
|
|
|
|
This component is well complimented with [Reflow][reflow] for ANSI-aware
|
2020-07-29 23:34:01 +03:00
|
|
|
|
indenting and text wrapping.
|
|
|
|
|
|
|
|
|
|
[reflow]: https://github.com/muesli/reflow
|
|
|
|
|
|
2020-01-28 05:29:52 +03:00
|
|
|
|
|
2021-03-02 15:44:53 +03:00
|
|
|
|
## List
|
|
|
|
|
|
|
|
|
|
<img src="https://stuff.charm.sh/bubbles-examples/list.gif" width="600" alt="List Example">
|
|
|
|
|
|
|
|
|
|
A customizable, batteries-included component for browsing a set of items.
|
|
|
|
|
Features pagination, fuzzy filtering, auto-generated help, an activity spinner,
|
2021-08-24 00:30:54 +03:00
|
|
|
|
and status messages, all of which can be enabled and disabled as needed.
|
2021-03-02 15:44:53 +03:00
|
|
|
|
Extrapolated from [Glow][glow].
|
|
|
|
|
|
|
|
|
|
* [Example code, default list](https://github.com/charmbracelet/tea/tree/master/examples/list-default/main.go)
|
|
|
|
|
* [Example code, simple list](https://github.com/charmbracelet/tea/tree/master/examples/list-simple/main.go)
|
|
|
|
|
* [Example code, all features](https://github.com/charmbracelet/tea/tree/master/examples/list-fancy/main.go)
|
|
|
|
|
|
|
|
|
|
|
2021-03-02 20:37:38 +03:00
|
|
|
|
## Help
|
|
|
|
|
|
|
|
|
|
A customizable horizontal mini help view that automatically generates itself
|
|
|
|
|
from your keybindings. It features single and multi-line modes, which the user
|
|
|
|
|
can optionally toggle between. It will truncate gracefully if the terminal is
|
|
|
|
|
too wide for the content.
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
## Key
|
|
|
|
|
|
|
|
|
|
A non-visual component for managing keybindings. It’s useful for allowing users
|
|
|
|
|
to remap keybindings as well as generating help views corresponding to your
|
|
|
|
|
keybindings.
|
|
|
|
|
|
|
|
|
|
```go
|
|
|
|
|
type KeyMap struct {
|
|
|
|
|
Up key.Binding
|
|
|
|
|
Down key.Binding
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
var DefaultKeyMap = KeyMap{
|
|
|
|
|
Up: key.NewBinding(
|
2021-09-01 18:31:14 +03:00
|
|
|
|
key.WithKeys("k", "up"), // actual keybindings
|
|
|
|
|
key.WithHelp("↑/k", "move up"), // corresponding help text
|
2021-03-02 20:37:38 +03:00
|
|
|
|
),
|
2021-09-01 18:31:14 +03:00
|
|
|
|
Down: key.NewBinding(
|
2021-03-02 20:37:38 +03:00
|
|
|
|
WithKeys("j", "down"),
|
|
|
|
|
WithHelp("↓/j", "move down"),
|
2021-09-01 18:31:14 +03:00
|
|
|
|
),
|
2021-03-02 20:37:38 +03:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
func (m Model) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
|
|
|
|
|
switch msg := msg.(type) {
|
|
|
|
|
case tea.KeyMsg:
|
|
|
|
|
switch {
|
|
|
|
|
case key.Matches(msg, DefaultKeyMap.Up):
|
|
|
|
|
// The user pressed up
|
|
|
|
|
case key.Matches(msg, DefaultKeyMap.Down):
|
|
|
|
|
// The user pressed down
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
return m, nil
|
|
|
|
|
}
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
2021-08-02 19:18:10 +03:00
|
|
|
|
## Additional Bubbles
|
|
|
|
|
|
|
|
|
|
* [promptkit](https://github.com/erikgeiser/promptkit): A collection of common
|
|
|
|
|
prompts for cases like selection, text input, and confirmation. Each prompt
|
|
|
|
|
comes with sensible defaults, remappable keybindings, any many customization
|
|
|
|
|
options.
|
2021-09-02 23:29:37 +03:00
|
|
|
|
* [mritd/bubbles](https://github.com/mritd/bubbles): Some general-purpose
|
|
|
|
|
bubbles. Inputs with validation, menu selection, a modified progressbar, and
|
|
|
|
|
so on.
|
2021-08-02 19:18:10 +03:00
|
|
|
|
|
|
|
|
|
If you’ve built a Bubble you think should be listed here,
|
|
|
|
|
[let us know](mailto:vt100@charm.sh).
|
|
|
|
|
|
|
|
|
|
|
2020-01-28 05:29:52 +03:00
|
|
|
|
## License
|
|
|
|
|
|
|
|
|
|
[MIT](https://github.com/charmbracelet/teaparty/raw/master/LICENSE)
|
2020-07-29 23:34:01 +03:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
***
|
|
|
|
|
|
2020-10-20 17:17:26 +03:00
|
|
|
|
Part of [Charm](https://charm.sh).
|
2020-07-29 23:34:01 +03:00
|
|
|
|
|
2021-01-13 01:53:56 +03:00
|
|
|
|
<a href="https://charm.sh/"><img alt="The Charm logo" src="https://stuff.charm.sh/charm-badge-unrounded.jpg" width="400"></a>
|
2020-10-20 17:17:26 +03:00
|
|
|
|
|
2021-05-27 18:48:31 +03:00
|
|
|
|
Charm热爱开源 • Charm loves open source
|