microui

microui immediate-mode GUI library bindings for Kit

Files

Dependencies

No Kit package dependencies.

No external native libraries are required. The microui C source is bundled in this package and is compiled into libkit_microui.dylib or libkit_microui.so during kit install and kit dev.

Renderer examples use optional development dependencies from GitLab:

• kit-raylib for Raylib window renderers
• kit-sdl for SDL window renderers
• kit-svg for a static SVG renderer

The Raylib and SDL examples also require the native system libraries required by those packages, such as raylib and SDL2. The canonical Raylib demo also uses Raylib.load-texture-from-rgba to upload the bundled microui atlas for native-size icons.

Installation

kit add gitlab.com/kit-lang/packages/kit-microui.git

Usage

import Kit.Microui as Mu

main = fn(-env: Env) =>
  match Mu.init
    | Err message ->
      println "microui init failed: ${message}"
    | Ok ctx ->
      defer Mu.free ctx

      Mu.begin ctx
      if Mu.is-window-open? ctx "Demo" 20 20 220 100 Mu.opt-no-resize then
        Mu.layout-row1 ctx -1 0
        Mu.label ctx "Hello from Kit microui"

        button-result = Mu.button-result ctx "Example Button"
        if Mu.has-submit? button-result then
          println "button submitted"
        else
          println "button idle"

        Mu.end-window ctx
      else
        println "window is closed"
      Mu.end ctx

      command = Mu.command-begin ctx
      if Mu.is-null? command then
        println "commands: none"
      else
        println "first command type: ${show (Mu.command-type command)}"

main

kit-microui exposes microui's renderer-agnostic command stream. It does not create windows or draw pixels by itself. Applications feed input events, build UI each frame, iterate generated commands, and render those commands with SDL, Raylib, Sokol, WGPU, or another backend.

API Notes

• init returns Result Ptr String; call free when done.
• begin and end wrap a microui frame.
• input-* functions feed mouse, keyboard, scroll, and text input.
• layout-row*, is-window-open?, label, is-button-pressed?, checkbox, textbox, slider, and number build UI.
• command-begin, command-next, command-type, and command field accessors expose the generated draw command stream.
• Stateful controls return records instead of requiring Kit code to pass mutable C pointers.
• atlas-width, atlas-height, atlas-pitch, atlas-texture-rgba, atlas-rect, atlas-white, and atlas-font expose the bundled upstream demo atlas so renderer examples can draw microui icons and glyphs with the same source rectangles as the C demo.
• set-atlas-text-metrics, draw-control-text, current-container-*, current-container-set-min-size, last-panel-scroll-to-content, and set-focus-last are exposed for higher-fidelity ports of the canonical demo.

Renderer Examples

• examples/demo/sdl-atlas-demo.kit is the highest-fidelity canonical port. It uses the upstream atlas for text, rectangles, and icons through Kit.Sdl.
• examples/demo/raylib-demo.kit uses Fira Sans for text and the bundled microui atlas for icons through Kit.Raylib.
• examples/raylib-renderer.kit, examples/sdl-renderer.kit, and examples/svg-renderer.kit are smaller backend examples focused on command iteration and renderer integration.
• Windowed examples are marked @check(interactive), so kit dev skips them during default example type checking. Run or build them directly when testing renderer behavior.

Example Screenshots

Canonical Demo

!Canonical demo

Raylib Renderer

!Raylib renderer

SDL Renderer

!SDL renderer

SVG Renderer

!SVG renderer

Development

Running Examples

Run examples with the interpreter:

kit run examples/command-dump.kit --allow=ffi,file
kit run examples/svg-renderer.kit --allow=ffi,file
kit run examples/raylib-renderer.kit --allow=ffi,file
kit run examples/sdl-renderer.kit --allow=ffi,file
kit run examples/demo/raylib-demo.kit --allow=ffi,file
kit run examples/demo/sdl-atlas-demo.kit --allow=ffi,file

Compile examples to a native binary:

kit build examples/command-dump.kit --allow=ffi,file && ./command-dump

kit build examples/demo/sdl-atlas-demo.kit --allow=ffi,file && ./sdl-atlas-demo

kit build examples/demo/raylib-demo.kit --allow=ffi,file && ./raylib-demo

Running Tests

Run the test suite:

kit test

Run the standard development workflow:

kit dev

This will:

1. Build the bundled native library
2. Format and check source files in src/
3. Check examples in examples/
4. Run tests in tests/ with coverage

Generating Documentation

Generate API documentation from doc comments:

kit doc

Note: Kit sources with doc comments (##) will generate HTML documents in docs/*.html.

Cleaning Build Artifacts

Remove generated files, caches, and build artifacts:

kit task clean

Note: Defined in kit.toml.

Local Installation

To install this package locally for development:

kit install /path/to/kit-microui

This installs the package to ~/.kit/packages/@kit/microui/, making it available for import as Kit.Microui in other projects.

License

This package is released under the MIT License - see LICENSE for details.

microui is also released under the MIT License and is bundled in c/microui.c and c/microui.h.

Exported Functions & Types

version

Return the bundled microui version string.

String

mouse-left

Return the microui mouse left constant.

Int

mouse-right

Return the microui mouse right constant.

Int

mouse-middle

Return the microui mouse middle constant.

Int

key-shift

Return the microui key shift constant.

Int

key-ctrl

Return the microui key ctrl constant.

Int

key-alt

Return the microui key alt constant.

Int

key-backspace

Return the microui key backspace constant.

Int

key-return

Return the microui key return constant.

Int

res-active

Return the microui res active constant.

Int

res-submit

Return the microui res submit constant.

Int

res-change

Return the microui res change constant.

Int

opt-align-center

Return the microui opt align center constant.

Int

opt-align-right

Return the microui opt align right constant.

Int

opt-no-interact

Return the microui opt no interact constant.

Int

opt-no-frame

Return the microui opt no frame constant.

Int

opt-no-resize

Return the microui opt no resize constant.

Int

opt-no-scroll

Return the microui opt no scroll constant.

Int

opt-no-close

Return the microui opt no close constant.

Int

opt-no-title

Return the microui opt no title constant.

Int

opt-hold-focus

Return the microui opt hold focus constant.

Int

opt-auto-size

Return the microui opt auto size constant.

Int

opt-popup

Return the microui opt popup constant.

Int

opt-closed

Return the microui opt closed constant.

Int

opt-expanded

Return the microui opt expanded constant.

Int

command-clip

Return the microui command clip constant.

Int

command-rect

Return the microui command rect constant.

Int

command-text

Return the microui command text constant.

Int

command-icon

Return the microui command icon constant.

Int

color-text

Return the microui color text constant.

Int

color-border

Return the microui color border constant.

Int

color-window-bg

Return the microui color window bg constant.

Int

color-title-bg

Return the microui color title bg constant.

Int

color-title-text

Return the microui color title text constant.

Int

color-panel-bg

Return the microui color panel bg constant.

Int

color-button

Return the microui color button constant.

Int

color-button-hover

Return the microui color button hover constant.

Int

color-button-focus

Return the microui color button focus constant.

Int

color-base

Return the microui color base constant.

Int

color-base-hover

Return the microui color base hover constant.

Int

color-base-focus

Return the microui color base focus constant.

Int

color-scroll-base

Return the microui color scroll base constant.

Int

color-scroll-thumb

Return the microui color scroll thumb constant.

Int

icon-close

Return the microui icon close constant.

Int

icon-check

Return the microui icon check constant.

Int

icon-collapsed

Return the microui icon collapsed constant.

Int

icon-expanded

Return the microui icon expanded constant.

Int

init

Create and initialize a microui context.

Result Ptr String

free

Release a microui context created by init.

Ptr -> Unit

is-null?

Return whether a native pointer is null.

Ptr -> Bool

set-text-metrics

Set fixed-width text metrics used by microui layout.

Ptr -> Int -> Int -> Unit

set-atlas-text-metrics

Use the bundled atlas font metrics for microui layout.

Ptr -> Unit

atlas-width

Return the bundled atlas texture width.

Int

atlas-height

Return the bundled atlas texture height.

Int

atlas-pitch

Return the bundled atlas RGBA texture pitch.

Int

atlas-texture-rgba

Return a pointer to the bundled atlas as RGBA pixels.

Ptr

atlas-white

Return the atlas rectangle id for the white patch.

Int

atlas-font

Return the first atlas rectangle id for font glyphs.

Int

atlas-rect

Return an atlas source rectangle by id.

Int -> {x: Int, y: Int, w: Int, h: Int}

begin

Begin a microui frame.

Ptr -> Unit

end

End a microui frame and finalize its command list.

Ptr -> Unit

input-mousemove

Feed a mouse-move event into the context.

Ptr -> Int -> Int -> Unit

input-mousedown

Feed a mouse-button press event into the context.

Ptr -> Int -> Int -> Int -> Unit

input-mouseup

Feed a mouse-button release event into the context.

Ptr -> Int -> Int -> Int -> Unit

input-scroll

Feed a scroll event into the context.

Ptr -> Int -> Int -> Unit

input-keydown

Feed a key press event into the context.

Ptr -> Int -> Unit

input-keyup

Feed a key release event into the context.

Ptr -> Int -> Unit

input-text

Feed text input into the context.

Ptr -> String -> Unit

has-result?

Return whether a result bitmask contains a flag.

Int -> Int -> Bool

has-active?

Return whether a widget result contains the active flag.

Int -> Bool

has-submit?

Return whether a widget result contains the submit flag.

Int -> Bool

has-change?

Return whether a widget result contains the change flag.

Int -> Bool

color-pack

Pack RGBA channels into an integer color value.

Int -> Int -> Int -> Int -> Int

color-r

Read the red channel from a packed color.

Int -> Int

color-g

Read the green channel from a packed color.

Int -> Int

color-b

Read the blue channel from a packed color.

Int -> Int

color-a

Read the alpha channel from a packed color.

Int -> Int

layout-row

Set a layout row from a comma-separated width list.

Ptr -> Int -> String -> Int -> Unit

layout-row1

Set a one-column layout row.

Ptr -> Int -> Int -> Unit

layout-row2

Set a two-column layout row.

Ptr -> Int -> Int -> Int -> Unit

layout-row3

Set a three-column layout row.

Ptr -> Int -> Int -> Int -> Int -> Unit

layout-row4

Set a four-column layout row.

Ptr -> Int -> Int -> Int -> Int -> Int -> Unit

layout-width

Set the next layout item width.

Ptr -> Int -> Unit

layout-height

Set the next layout item height.

Ptr -> Int -> Unit

layout-begin-column

Begin a nested layout column.

Ptr -> Unit

layout-end-column

End the current nested layout column.

Ptr -> Unit

layout-set-next

Set the rectangle for the next layout item.

Ptr -> Int -> Int -> Int -> Int -> Bool -> Unit

layout-next

Advance layout and return the allocated rectangle.

Ptr -> {x: Int, y: Int, w: Int, h: Int}

last-rect

Return the most recently allocated layout rectangle.

Ptr -> {x: Int, y: Int, w: Int, h: Int}

is-window-open?

Begin a window and return whether its body is open.

Ptr -> String -> Int -> Int -> Int -> Int -> Int -> Bool

end-window

End the current window.

Ptr -> Unit

open-popup

Open a named popup.

Ptr -> String -> Unit

is-popup-open?

Begin a popup and return whether it is open.

Ptr -> String -> Bool

end-popup

End the current popup.

Ptr -> Unit

begin-panel

Begin a named panel.

Ptr -> String -> Int -> Unit

end-panel

End the current panel.

Ptr -> Unit

current-container-rect

Return the current container rectangle.

Ptr -> {x: Int, y: Int, w: Int, h: Int}

current-container-body-rect

Return the current container body rectangle.

Ptr -> {x: Int, y: Int, w: Int, h: Int}

current-container-content-size

Return the current container content size.

Ptr -> {w: Int, h: Int}

current-container-scroll

Return the current container scroll offset.

Ptr -> {x: Int, y: Int}

current-container-set-scroll

Set the current container scroll offset.

Ptr -> Int -> Int -> Unit

current-container-set-min-size

Clamp the current container to a minimum size.

Ptr -> Int -> Int -> Unit

last-panel-scroll-to-content

Scroll the last opened panel to its content height.

Ptr -> Unit

text

Add wrapped text to the current container.

Ptr -> String -> Unit

label

Add a label to the current container.

Ptr -> String -> Unit

set-focus-last

Restore focus to the last control id.

Ptr -> Unit

button-result

Add a button and return the raw result flags.

Ptr -> String -> Int

button-ex-result

Add a button with an icon and return raw result flags.

Ptr -> String -> Int -> Int -> Int

is-button-pressed?

Return whether a button was submitted this frame.

Ptr -> String -> Bool

is-icon-button-pressed?

Return whether an icon button was submitted this frame.

Ptr -> Int -> Int -> Bool

checkbox

Add a checkbox and return its updated state.

Ptr -> String -> Bool -> {result: Int, is-checked?: Bool, has-changed?: Bool}

textbox

Add a textbox and return its updated state.

Ptr -> String -> String -> Int -> Int -> {result: Int, text: String, has-changed?: Bool, has-submitted?: Bool}

slider

Add a slider and return its updated value.

Ptr -> String -> Float -> Float -> Float -> Float -> String -> Int -> {result: Int, value: Float, has-changed?: Bool}

number

Add a numeric editor and return its updated value.

Ptr -> String -> Float -> Float -> String -> Int -> {result: Int, value: Float, has-changed?: Bool}

header-result

Add a header and return the raw result flags.

Ptr -> String -> Int -> Int

is-header-open?

Return whether a header is open.

Ptr -> String -> Int -> Bool

is-treenode-open?

Begin a tree node and return whether it is open.

Ptr -> String -> Int -> Bool

end-treenode

End the current tree node.

Ptr -> Unit

draw-rect

Append a rectangle draw command.

Ptr -> Int -> Int -> Int -> Int -> Int -> Int -> Int -> Int -> Unit

draw-text

Append a text draw command.

Ptr -> String -> Int -> Int -> Int -> Int -> Int -> Int -> Unit

draw-control-text

Append aligned control text using microui's control text layout.

Ptr -> String -> Int -> Int -> Int -> Int -> Int -> Int -> Unit

draw-icon

Append an icon draw command.

Ptr -> Int -> Int -> Int -> Int -> Int -> Int -> Int -> Int -> Int -> Unit

set-style-color

Set a style color by color id.

Ptr -> Int -> Int -> Int -> Int -> Int -> Unit

get-style-color

Read a packed style color by color id.

Ptr -> Int -> Int

set-style-size

Set the default item size style value.

Ptr -> Int -> Int -> Unit

set-style-spacing

Set the style spacing value.

Ptr -> Int -> Unit

set-style-padding

Set the style padding value.

Ptr -> Int -> Unit

command-begin

Return the first draw command for the frame.

Ptr -> Ptr

command-next

Return the command after the supplied draw command.

Ptr -> Ptr -> Ptr

command-type

Return the command type id for a draw command.

Ptr -> Int

command-rect-x

Return the x coordinate from a rectangle command.

Ptr -> Int

command-rect-y

Return the y coordinate from a rectangle command.

Ptr -> Int

command-rect-w

Return the width from a rectangle command.

Ptr -> Int

command-rect-h

Return the height from a rectangle command.

Ptr -> Int

command-rect-color

Return the packed color from a rectangle command.

Ptr -> Int

command-clip-x

Return the x coordinate from a clip command.

Ptr -> Int

command-clip-y

Return the y coordinate from a clip command.

Ptr -> Int

command-clip-w

Return the width from a clip command.

Ptr -> Int

command-clip-h

Return the height from a clip command.

Ptr -> Int

command-text-x

Return the x coordinate from a text command.

Ptr -> Int

command-text-y

Return the y coordinate from a text command.

Ptr -> Int

command-text-color

Return the packed color from a text command.

Ptr -> Int

command-text-string

Return the string from a text command.

Ptr -> String

command-icon-id

Return the icon id from an icon command.

Ptr -> Int

command-icon-x

Return the x coordinate from an icon command.

Ptr -> Int

command-icon-y

Return the y coordinate from an icon command.

Ptr -> Int

command-icon-w

Return the width from an icon command.

Ptr -> Int

command-icon-h

Return the height from an icon command.

Ptr -> Int

command-icon-color

Return the packed color from an icon command.

Ptr -> Int