OpenUI

An unofficial Elixir implementation of the OpenUI Lang 1.0 specification: the language a model writes to describe a user interface, streamed and rendered as it arrives.

It passes every case of the 1.0 conformance suite (spec/fixtures/1.0 at commit 9d73d17) and generates system prompts byte-identical to the official @openuidev/lang-core 1.0.1.

What it does

Catalog. Define your components, functions and actions in Elixir; get the LibrarySpec (library.json) other clients, such as a React or React Native app, build their library from.
Prompt. Generate the system prompt that teaches a model your catalog.
Parser and stream. Read a response whole or a chunk at a time. A mistake drops the smallest unit and is reported; nothing a model writes raises.
Runtime. State, forms, validation, actions, Query and Mutation, as a pure value that returns effects for the host to run.
LiveView. An optional renderer that draws programs with your own function components.

It ships no components. Each host draws its own.

Installation

def deps do
  [
    {:openui, "~> 0.1"},
    # only for the LiveView renderer
    {:phoenix_live_view, "~> 1.1"}
  ]
end

A first program

defmodule MyApp.Library do
  use OpenUI.Library, id: "myapp", version: "1.0.0", root: "Stack"

  component "Stack",
    description: "Lays out children in a column",
    props: [children: [type: {:array, :component}, required: true]]

  component "Metric",
    description: "A labeled number",
    props: [label: [type: :string, required: true], value: [type: :number, required: true]]
end

prompt = OpenUI.Prompt.generate(MyApp.Library)

program = OpenUI.Parser.parse(~S"""
root = Stack([open])
open = Metric("Open tickets", 12)
""", MyApp.Library)

In LiveView:

<OpenUI.LiveView.renderer id="answer" response={@answer} components={MyAppWeb.UI} streaming={@streaming?} />

Guides

Examples