glink
Types
pub type Size {
Size(width: Float, height: Float)
}
Constructors
-
Size(width: Float, height: Float)
Arguments
- width
-
Element width.
- height
-
Element height.
Values
pub fn box(
styles styles: List(Style),
attributes attrs: List(Attribute),
children children: List(Component),
) -> Component
<Box>
is an essential Ink component to build your layout. It’s like <div style="display: flex">
in the browser.
pub fn measure_element(node: a) -> Size
Measure the dimensions of a particular <Box>
element.
pub fn spacer() -> Component
A flexible space that expands along the major axis of its containing layout. It’s useful as a shortcut for filling all the available spaces between elements.
pub fn static() -> Component
<Static>
component permanently renders its output above everything else.
It’s useful for displaying activity like completed tasks or logs - things that
are not changing after they’re rendered (hence the name “Static”).
It’s preferred to use <Static>
for use cases like these, when you can’t know
or control the amount of items that need to be rendered.
For example, Tap uses <Static>
to display
a list of completed tests. Gatsby uses it
to display a list of generated pages, while still displaying a live progress bar.
pub fn text(
props: List(Prop),
children: List(Component),
) -> Component
This component can display text, and change its style to make it colorful, bold, underline, italic or strikethrough.
pub fn transform(
transform: fn(String, Int) -> String,
children: List(Component),
) -> Component
Transform a string representation of React components before they are written to output.
For example, you might want to apply a gradient to text, add a clickable link or create some text effects.
These use cases can’t accept React nodes as input, they are expecting a string.
That’s what
pub fn use_app() -> App
use_app
is a React hook, which exposes a method to manually exit the app (unmount).
pub fn use_focus(props: List(Input)) -> Output
Component that uses use_focus
hook becomes “focusable” to Ink,
so when user presses Tab, Ink will switch focus to this component.
If there are multiple components that execute use_focus
hook, focus will be
given to them in the order that these components are rendered in.
This hook returns an object with is_focused
boolean property, which
determines if this component is focused or not.
pub fn use_focus_manager() -> Output
This hook exposes methods to enable or disable focus management for all components or manually switch focus to next or previous components.
pub fn use_input(
handler: fn(String, Key) -> Nil,
options: List(Option),
) -> Nil
This hook is used for handling user input.
It’s a more convenient alternative to using StdinContext
and listening to data
events.
The callback you pass to use_input
is called for each character when user enters any input.
However, if user pastes text and it’s more than one character, the callback will be called only once and the whole string will be passed as input
.
Example
import glink
import glink/use_input
import redraw
pub fn user_input() {
use <- redraw.component__("UserInput")
glink.use_input(
fn(input, key) {
case input, key {
"q", _ -> todo as "Exit program"
_, use_input.Key(left_arrow: True, ..) ->
todo as "Left arrow key pressed"
_, _ -> Nil
}
},
[],
)
redraw.fragment([])
}
pub fn use_stderr() -> Stderr
use_stderr
is a React hook, which exposes stderr stream.
pub fn use_stdout() -> Stdout
use_stdout
is a React hook, which exposes stdout stream.