ui/split_panel
Types
Messages for split panel keyboard navigation
pub type Msg {
Decrease
Increase
Reset
SetMin
SetMax
}
Constructors
-
Decrease -
Increase -
Reset -
SetMin -
SetMax
pub type Orientation {
Horizontal
Vertical
}
Constructors
-
Horizontal -
Vertical
Values
pub fn adjustable_divider(
attributes: List(attribute.Attribute(a)),
position: Int,
) -> element.Element(a)
Adjustable divider with click controls Pass on_click handlers for the decrease/increase buttons via attributes
pub fn divider_handle(
attributes: List(attribute.Attribute(a)),
) -> element.Element(a)
Simple divider handle (visual only, for future drag implementation)
pub fn handle_key_position(
key: String,
current_position: Int,
step: Int,
) -> Int
Keyboard handler helper - returns message for key events Use in your app’s keydown handler
pub fn keymap(
key_event: keyboard.KeyEvent,
orientation: Orientation,
) -> option.Option(Msg)
Keymap for split panel keyboard navigation
Keyboard interactions:
- ArrowLeft/ArrowUp: Decrease panel size (horizontal/vertical split)
- ArrowRight/ArrowDown: Increase panel size
- Home: Reset to default size (50%)
- End: Maximize current panel (90% or 10%)
Follows WAI-ARIA Separator pattern.
pub fn on_split_click(
current_position: Int,
step: Int,
) -> fn(String) -> Int
Helper to create click handler for split panel adjustment Use with event delegation on the parent container
pub fn pane_a(
attributes: List(attribute.Attribute(a)),
size_percent: Int,
children: List(element.Element(a)),
) -> element.Element(a)
Left or top pane with percentage-based size
pub fn pane_b(
attributes: List(attribute.Attribute(a)),
children: List(element.Element(a)),
) -> element.Element(a)
Right or bottom pane (fills remaining space)
pub fn size(s: size.Size) -> attribute.Attribute(a)
Size attribute (height for horizontal splits)
pub fn split_panel(
attributes: List(attribute.Attribute(a)),
children: List(element.Element(a)),
) -> element.Element(a)
Split panel container with adjustable divider