# **glink**
[](https://hex.pm/packages/glink)
[](https://hexdocs.pm/glink/)
🌈 [Ink](https://github.com/vadimdemedes/ink) bindings for [Gleam](https://gleam.run/)! ✨
## Installation
Use **glink** with the awesome [redraw](https://hexdocs.pm/redraw/) package for your React bindings.
```sh
gleam add glink redraw redraw_dom
```
With your favorite package manager or runtime, install the following JavaScript peer dependencies.
```sh
npm install ink react@^18 react-dom@^18
```
## Usage
Documentation can be found at <https://hexdocs.pm/glink>.
### Example
```gleam
import gleam/int
import glink
import glink/style
import glink/style/flex_direction
import redraw
fn robot() {
use <- redraw.component__("Robot")
let app = glink.use_app()
let #(x, set_x) = redraw.use_state(1)
let #(y, set_y) = redraw.use_state(1)
glink.use_input_(fn(input, key) {
case input, key {
"q", _ -> app.exit(Nil)
_, k if k.left_arrow -> set_x(int.max(1, x - 1))
_, k if k.right_arrow -> set_x(int.min(20, x + 1))
_, k if k.up_arrow -> set_y(int.max(1, y - 1))
_, k if k.down_arrow -> set_y(int.min(10, y + 1))
_, _ -> Nil
}
})
glink.box_([style.flex_direction(flex_direction.Column)], [
glink.text__("Use arrow keys to move the face. Press \"q\" to exit."),
glink.box_(
[
style.height("12"),
style.padding_left(int.to_float(x)),
style.padding_top(int.to_float(y)),
],
[glink.text__("^_^")],
),
])
}
pub fn main() {
let robot = robot()
glink.render(robot())
}
```
_Translated from <https://github.com/vadimdemedes/ink/blob/master/examples/use-input/use-input.tsx>._
## Contributing
### Prerequisites
You can install the following tools using [mise](https://mise.jdx.dev/getting-started.html).
- [Bun](https://bun.sh/docs/installation)
- [Dprint](https://dprint.dev/install/)
- [Gleam](https://gleam.run/getting-started/installing/)
- [Just](https://just.systems/man/en/prerequisites.html)
### Initial Setup
```sh
just
```
### Development
```sh
just fmt clean build
```