preludes / ui.lisp
ui
Interface components. Typed projections for layouts, cards, tables, inputs, and charts, plus constant renderer configuration.
From the source
Purpose: Domain-neutral UI forms and constant hosted renderer configuration. Requires: compiler.lisp and core builtins; no ontology vocabulary. Used by: ViewSpec layouts, descriptor-tree tooling, and downstream host renderers. SECTION 1 — COMPONENT PROJECTION
Forms 62
Keywords this prelude adds. Each is a form descriptor: its slots, their types, and the IR it produces.
(text content {:keys [visible bind]})ui.lisp:25
Builds a text configuration node from content or a binding expression; it accepts no children.
| Slot | Type |
|---|---|
| content | (Option (Expr a)) |
| visible | (Option (Expr Bool)) |
| bind | (Option (Expr a)) |
Produces ComponentIR
Example
(view Example :layout (text "Hello"))(rows {:keys [gap visible]} child ...)ui.lisp:46
Builds a rows container with optional gap and visibility. Its host metadata requests children.
| Slot | Type |
|---|---|
| gap | (Option Float) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example :layout (rows :gap 8 (text "First") (text "Second")))(columns {:keys [gap visible]} child ...)ui.lisp:63
Builds a columns container with optional gap and visibility. Its host metadata requests children.
| Slot | Type |
|---|---|
| gap | (Option Float) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example :layout (columns :gap 12 (text "Left") (text "Right")))(card {:keys [title description subject-mode action footer visible]} child ...)ui.lisp:80
Builds a card container with title and description expressions and optional action and footer nodes.
| Slot | Type |
|---|---|
| title | (Option (Expr a)) |
| description | (Option (Expr a)) |
| subject-mode | (Option (Expr a)) |
| action | (Option Syntax) |
| footer | (Option Syntax) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example :layout (card :title "Profile" (text "Ada")))(item-group {:keys [visible bind]} child ...)ui.lisp:114
Groups item nodes, optionally binding the group to an expression.
| Slot | Type |
|---|---|
| visible | (Option (Expr Bool)) |
| bind | (Option (Expr a)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example :layout (item-group (item :title "Compiler")))(item { :keys [variant size icon title description value badge badge-variant visible]} child ...)ui.lisp:133
Builds an item node with optional icon, text, value, badge, and nested content.
| Slot | Type |
|---|---|
| variant | (Option (Union "default" "outline" "muted")) |
| size | (Option (Union "default" "sm" "xs")) |
| icon | (Option String) |
| title | (Option (Expr a)) |
| description | (Option (Expr a)) |
| value | (Option (Expr a)) |
| badge | (Option (Expr a)) |
| badge-variant | (Option (Union "default" "secondary" "outline" "destructive")) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example :layout (item :title "Compiler" :description "Ready"))(button label {:keys [variant size disabled button-type visible]} child ...)ui.lisp:171
Builds a button node with a label expression, variant, size, disabled expression, and optional children.
| Slot | Type |
|---|---|
| label | (Option (Expr a)) |
| variant | (Option (Union "default" "destructive" "outline" "secondary" "ghost" "link")) |
| size | (Option (Union "default" "sm" "lg" "icon")) |
| disabled | (Option (Expr a)) |
| button-type | (Option (Union "button" "submit" "reset")) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example :layout (button "Save" :variant "default"))(progress {:keys [value label hint visible bind]})ui.lisp:202
Builds a progress node with value, label, and hint expressions or a binding.
| Slot | Type |
|---|---|
| value | (Option (Expr a)) |
| label | (Option (Expr a)) |
| hint | (Option (Expr a)) |
| visible | (Option (Expr Bool)) |
| bind | (Option (Expr a)) |
Produces ComponentIR
Example
(view Example :layout (progress :value 50 :label "Halfway"))(workflow-strip {:keys [title description visible]} child ...)ui.lisp:224
Groups workflow-step nodes under optional title and description expressions.
| Slot | Type |
|---|---|
| title | (Option (Expr a)) |
| description | (Option (Expr a)) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example :layout (workflow-strip (workflow-step :label "Review")))(workflow-step {:keys [label description status icon visible]})ui.lisp:245
Builds one workflow step with a required label expression and optional description, status, and icon.
| Slot | Type |
|---|---|
| label | (Expr a) |
| description | (Option (Expr a)) |
| status | (Option (Expr a)) |
| icon | (Option String) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example
:layout
(workflow-strip (workflow-step :label "Review" :status "pending")))(empty-state {:keys [icon title description visible]} child ...)ui.lisp:268
Builds an empty-state container with optional icon, title, description, and child nodes.
| Slot | Type |
|---|---|
| icon | (Option String) |
| title | (Option (Expr a)) |
| description | (Option (Expr a)) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:layout (empty-state :title "No records" (button "Create")))(badge content {:keys [variant dot dot-color visible]})ui.lisp:288
Builds a badge node from a content expression and optional variant and dot configuration.
| Slot | Type |
|---|---|
| content | (Option (Expr a)) |
| variant | (Option (Union "default" "secondary" "outline" "destructive")) |
| dot | (Option Json) |
| dot-color | (Option String) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (badge "Ready" :variant "secondary"))(avatar {:keys [src alt fallback size visible]})ui.lisp:311
Builds an avatar node with source, alternative text, fallback expressions, and optional size.
| Slot | Type |
|---|---|
| src | (Option (Expr a)) |
| alt | (Option (Expr a)) |
| fallback | (Option (Expr a)) |
| size | (Option (Union "default" "sm" "lg")) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (avatar :fallback "AJ" :alt "Ada"))(kbd content {:keys [visible]})ui.lisp:330
Builds a keyboard-hint node from a content expression.
| Slot | Type |
|---|---|
| content | (Option (Expr a)) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (kbd "Enter"))(spinner {:keys [label size visible]})ui.lisp:346
Builds a spinner node with an optional label expression and size.
| Slot | Type |
|---|---|
| label | (Option (Expr a)) |
| size | (Option (Union "sm" "default" "lg")) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (spinner :label "Loading"))(separator {:keys [orientation visible]})ui.lisp:362
Builds a separator node with optional horizontal or vertical orientation.
| Slot | Type |
|---|---|
| orientation | (Option (Union "horizontal" "vertical")) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (separator :orientation "vertical"))(tabs {:keys [visible]} child ...)ui.lisp:381
Builds a container whose children must be tab-panel nodes.
| Slot | Type |
|---|---|
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:layout (tabs (tab-panel :label "Overview" (text "Hello"))))(tab-panel {:keys [label visible]} child ...)ui.lisp:397
Builds a labeled panel that belongs inside tabs and contains child nodes.
| Slot | Type |
|---|---|
| label | (Option (Expr a)) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:layout (tabs (tab-panel :label "Overview" (text "Hello"))))(accordion {:keys [mode visible]} child ...)ui.lisp:430
Builds an accordion of accordion-item children, with single or multiple expansion mode.
| Slot | Type |
|---|---|
| mode | (Option (Union "single" "multiple")) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:layout
(accordion
:mode "single"
(accordion-item :title "Details" (text "Hello"))))(accordion-item {:keys [title default-open visible]} child ...)ui.lisp:454
Builds an accordion section with optional title and default-open configuration and nested content.
| Slot | Type |
|---|---|
| title | (Option (Expr a)) |
| default-open | (Option Json) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:layout (accordion (accordion-item :title "Details" (text "Hello"))))(grid {:keys [columns visible]} child ...)ui.lisp:477
Builds a grid container with an optional column count and child nodes.
| Slot | Type |
|---|---|
| columns | (Option Float) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example :layout (grid :columns 2 (text "First") (text "Second")))(aspect-ratio {:keys [ratio visible]} child ...)ui.lisp:496
Builds a container with an optional numeric aspect ratio and child nodes.
| Slot | Type |
|---|---|
| ratio | (Option Float) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example :layout (aspect-ratio :ratio 1.5 (text "Preview")))(spacer {:keys [height visible]})ui.lisp:515
Builds a spacer node with optional numeric height.
| Slot | Type |
|---|---|
| height | (Option Float) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (spacer :height 16))(split-pane {:keys [direction sizes visible]} child ...)ui.lisp:527
Builds a split-pane container with optional direction and JSON sizes configuration.
| Slot | Type |
|---|---|
| direction | (Option (Union "horizontal" "vertical")) |
| sizes | (Option Json) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:layout
(split-pane :direction "horizontal" (text "Left") (text "Right")))(for-each {:keys [empty-text visible bind]} child ...)ui.lisp:555
Builds a repeating container with optional empty text. Its host metadata requests a binding and children.
| Slot | Type |
|---|---|
| empty-text | (Option String) |
| visible | (Option (Expr Bool)) |
| bind | (Option (Expr a)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:state {:items []}
:layout (for-each :bind $state.items (text "Item")))(condition {:keys [visible]} child ...)ui.lisp:582
Builds a conditional container restricted to case and else children.
| Slot | Type |
|---|---|
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:layout
(condition (case :when true (text "Ready")) (else (text "Waiting"))))(case {:keys [when visible]} child ...)ui.lisp:599
Builds a conditional branch with a required when expression and child nodes, inside condition.
| Slot | Type |
|---|---|
| when | (Expr a) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example :layout (condition (case :when true (text "Ready"))))(else {:keys [visible]} child ...)ui.lisp:620
Builds the fallback branch of a condition container.
| Slot | Type |
|---|---|
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:layout
(condition
(case :when false (text "Ready"))
(else (text "Waiting"))))(slot name {:keys [visible bind]} child ...)ui.lisp:640
Builds a named or unnamed layout slot with optional binding and fallback child nodes.
| Slot | Type |
|---|---|
| name | (Option String) |
| visible | (Option (Expr Bool)) |
| bind | (Option (Expr a)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example :layout (slot "body" (text "Fallback")))(use name {:keys [overrides visible]} child ...)ui.lisp:662
Refers to a reusable layout definition by string name, with optional JSON overrides and child nodes.
| Slot | Type |
|---|---|
| name | String |
| overrides | (Option Json) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example :defs {:greeting (text "Hello")} :layout (use "greeting"))(tooltip {:keys [content side visible]} child ...)ui.lisp:688
Builds a tooltip wrapper with a required content expression, optional side, and child nodes.
| Slot | Type |
|---|---|
| content | (Expr a) |
| side | (Option (Union "top" "right" "bottom" "left")) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example :layout (tooltip :content "Save changes" (button "Save")))(popover {:keys [trigger title description side align visible]} child ...)ui.lisp:709
Builds a popover with a required trigger node, optional heading and placement, and child nodes.
| Slot | Type |
|---|---|
| trigger | Syntax |
| title | (Option (Expr a)) |
| description | (Option (Expr a)) |
| side | (Option (Union "top" "right" "bottom" "left")) |
| align | (Option (Union "start" "center" "end")) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:layout (popover :trigger (button "Open") (text "Details")))(hover-card {:keys [trigger side align visible]} child ...)ui.lisp:740
Builds a hover-card with a required trigger node, optional placement, and child nodes.
| Slot | Type |
|---|---|
| trigger | Syntax |
| side | (Option (Union "top" "right" "bottom" "left")) |
| align | (Option (Union "start" "center" "end")) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:layout (hover-card :trigger (text "More") (text "Details")))(dialog {:keys [dialog-id title description visible]} child ...)ui.lisp:767
Builds a dialog identified by a string, with optional title and description expressions and child nodes.
| Slot | Type |
|---|---|
| dialog-id | String |
| title | (Option (Expr a)) |
| description | (Option (Expr a)) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:layout (dialog :dialog-id "confirm" :title "Confirm" (button "OK")))(table {:keys [columns filters page-size default-sort empty-state visible bind]})ui.lisp:795
Builds a table configuration node with optional columns, filters, paging, sorting, empty state, and binding.
| Slot | Type |
|---|---|
| columns | (Option Json) |
| filters | (Option Json) |
| page-size | (Option Float) |
| default-sort | (Option Json) |
| empty-state | (Option String) |
| visible | (Option (Expr Bool)) |
| bind | (Option (Expr a)) |
Produces ComponentIR
Example
(view Example
:state {:items []}
:layout (table :bind $state.items :columns ["name"]))(tree {:keys [id-key parent-id-key label-key default-expanded visible bind]} child ...)ui.lisp:839
Builds a tree configuration with optional identifier, parent, and label keys, expansion data, binding, and child nodes.
| Slot | Type |
|---|---|
| id-key | (Option String) |
| parent-id-key | (Option String) |
| label-key | (Option String) |
| default-expanded | (Option Json) |
| visible | (Option (Expr Bool)) |
| bind | (Option (Expr a)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:state {:items []}
:layout (tree :bind $state.items :id-key "id" :label-key "name"))(metric {:keys [label value value-key visible bind]})ui.lisp:876
Builds a metric node with optional label, value expression, value key, and binding.
| Slot | Type |
|---|---|
| label | (Option (Expr a)) |
| value | (Option (Expr a)) |
| value-key | (Option String) |
| visible | (Option (Expr Bool)) |
| bind | (Option (Expr a)) |
Produces ComponentIR
Example
(view Example
:state {:value 7}
:layout (metric :bind $state.value :label "Count"))(chart {:keys [title chart-type category-key series visible bind]})ui.lisp:904
Builds a chart configuration with optional chart type, category key, series data, title, and binding.
| Slot | Type |
|---|---|
| title | (Option (Expr a)) |
| chart-type | (Option (Union "bar" "line" "area" "pie" "radar" "radial" "scatter")) |
| category-key | (Option String) |
| series | (Option Json) |
| visible | (Option (Expr Bool)) |
| bind | (Option (Expr a)) |
Produces ComponentIR
Example
(view Example
:state {:items []}
:layout
(chart :chart-type "bar" :bind $state.items :category-key "name"))(markdown content {:keys [visible bind]})ui.lisp:941
Builds a Markdown configuration node from content or a binding expression; it accepts no children.
| Slot | Type |
|---|---|
| content | (Option (Expr a)) |
| visible | (Option (Expr Bool)) |
| bind | (Option (Expr a)) |
Produces ComponentIR
Example
(view Example :layout (markdown "# Hello"))(stat-group {:keys [gap visible]} child ...)ui.lisp:962
Groups statistic nodes with optional gap and visibility configuration.
| Slot | Type |
|---|---|
| gap | (Option Float) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:state {:value 7}
:layout (stat-group (metric :bind $state.value :label "Count")))(heading text {:keys [level visible]})ui.lisp:980
Builds a heading node from a text expression and optional numeric level.
| Slot | Type |
|---|---|
| text | (Option (Expr a)) |
| level | (Option Float) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (heading "Overview" :level 2))(divider {:keys [visible]})ui.lisp:1000
Builds a divider node with optional visibility.
| Slot | Type |
|---|---|
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (divider))(alert message {:keys [variant visible]})ui.lisp:1012
Builds an alert configuration node with a required message expression and optional variant and visibility.
| Slot | Type |
|---|---|
| message | (Expr a) |
| variant | (Option (Union "default" "warning" "error" "info")) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (alert "Check your details" :variant "warning"))(form {:keys [title description visible]} child ...)ui.lisp:1038
Builds a UI form container with optional title and description expressions and child nodes.
| Slot | Type |
|---|---|
| title | (Option (Expr a)) |
| description | (Option (Expr a)) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example :layout (form :title "Profile" (input :name "name")))(button-group {:keys [orientation visible]} child ...)ui.lisp:1060
Groups button nodes with optional orientation.
| Slot | Type |
|---|---|
| orientation | (Option (Union "horizontal" "vertical")) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example :layout (button-group (button "Save") (button "Cancel")))(breadcrumb {:keys [visible]} child ...)ui.lisp:1079
Builds a breadcrumb container restricted to breadcrumb-item children.
| Slot | Type |
|---|---|
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:layout (breadcrumb (breadcrumb-item :label "Home" :href "/")))(breadcrumb-item {:keys [label href current visible]})ui.lisp:1095
Builds a breadcrumb entry with a required label expression and optional link and current-item marker.
| Slot | Type |
|---|---|
| label | (Expr a) |
| href | (Option (Expr a)) |
| current | (Option Json) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example
:layout (breadcrumb (breadcrumb-item :label "Home" :href "/")))(input { :keys [ name default-value label description placeholder input-type prefix suffix visible]})ui.lisp:1123
Builds a named input configuration with optional default value, label, description, placeholder, input type, prefix, and suffix.
| Slot | Type |
|---|---|
| name | String |
| default-value | (Option (Expr a)) |
| label | (Option (Expr a)) |
| description | (Option (Expr a)) |
| placeholder | (Option String) |
| input-type | (Option (Union "text" "email" "password" "number" "url" "date")) |
| prefix | (Option String) |
| suffix | (Option String) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example
:layout (input :name "email" :label "Email" :input-type "email"))(textarea {:keys [name default-value label description placeholder visible]})ui.lisp:1168
Builds a named multiline input configuration with optional default value, label, description, and placeholder.
| Slot | Type |
|---|---|
| name | String |
| default-value | (Option (Expr a)) |
| label | (Option (Expr a)) |
| description | (Option (Expr a)) |
| placeholder | (Option String) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (textarea :name "notes" :label "Notes"))(checkbox {:keys [name default-value label description visible]})ui.lisp:1195
Builds a named checkbox configuration with optional default value, label, and description expressions.
| Slot | Type |
|---|---|
| name | String |
| default-value | (Option (Expr a)) |
| label | (Option (Expr a)) |
| description | (Option (Expr a)) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example
:layout (checkbox :name "active" :label "Active" :default-value true))(switch {:keys [name default-value label description visible]})ui.lisp:1221
Builds a named switch configuration with optional default value, label, and description expressions.
| Slot | Type |
|---|---|
| name | String |
| default-value | (Option (Expr a)) |
| label | (Option (Expr a)) |
| description | (Option (Expr a)) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (switch :name "enabled" :label "Enabled"))(select {:keys [name default-value label description placeholder options visible]} child ...)ui.lisp:1246
Builds a named select configuration with optional JSON options or select-option children.
| Slot | Type |
|---|---|
| name | String |
| default-value | (Option (Expr a)) |
| label | (Option (Expr a)) |
| description | (Option (Expr a)) |
| placeholder | (Option String) |
| options | (Option Json) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:layout
(select :name "color" (select-option :value "blue" :label "Blue")))(select-option {:keys [value label visible]})ui.lisp:1287
Builds a string-valued option with an optional label expression, inside select.
| Slot | Type |
|---|---|
| value | String |
| label | (Option (Expr a)) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example
:layout
(select :name "color" (select-option :value "blue" :label "Blue")))(radio-group {:keys [name default-value label description options visible]} child ...)ui.lisp:1310
Builds a named radio-group configuration with optional JSON options or radio-option children.
| Slot | Type |
|---|---|
| name | String |
| default-value | (Option (Expr a)) |
| label | (Option (Expr a)) |
| description | (Option (Expr a)) |
| options | (Option Json) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:layout
(radio-group
:name "color"
(radio-option :value "blue" :label "Blue")))(radio-option {:keys [value label visible]})ui.lisp:1352
Builds a string-valued option with an optional label expression, inside radio-group.
| Slot | Type |
|---|---|
| value | String |
| label | (Option (Expr a)) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example
:layout
(radio-group
:name "color"
(radio-option :value "blue" :label "Blue")))(slider {:keys [name default-value label description min max step visible]})ui.lisp:1377
Builds a named slider configuration with optional default value, numeric minimum, maximum, and step.
| Slot | Type |
|---|---|
| name | String |
| default-value | (Option (Expr a)) |
| label | (Option (Expr a)) |
| description | (Option (Expr a)) |
| min | (Option Float) |
| max | (Option Float) |
| step | (Option Float) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (slider :name "volume" :min 0 :max 100 :step 1))(toggle-group {:keys [name default-value mode variant options visible]})ui.lisp:1409
Builds a named toggle-group configuration with optional default value, mode, variant, and JSON options.
| Slot | Type |
|---|---|
| name | String |
| default-value | (Option (Expr a)) |
| mode | (Option (Union "single" "multiple")) |
| variant | (Option (Union "default" "outline")) |
| options | (Option Json) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example
:layout
(toggle-group
:name "mode"
:mode "single"
:options ["compact" "full"]))(skeleton {:keys [lines visible]})ui.lisp:1450
Builds a skeleton configuration node with an optional line count.
| Slot | Type |
|---|---|
| lines | (Option Float) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (skeleton :lines 3))(raw-html content {:keys [visible]})ui.lisp:1462
Captures a required content expression in a raw-html configuration node; interpretation belongs to the host.
| Slot | Type |
|---|---|
| content | (Expr a) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (raw-html "<strong>Hello</strong>"))(raw-css content {:keys [visible]})ui.lisp:1479
Captures a required content expression in a raw-css configuration node; interpretation belongs to the host.
| Slot | Type |
|---|---|
| content | (Expr a) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (raw-css "body { color: navy; }"))(raw-js code {:keys [visible]})ui.lisp:1496
Captures a required code expression in a raw-js configuration node; execution belongs to the host.
| Slot | Type |
|---|---|
| code | (Expr a) |
| visible | (Option (Expr Bool)) |
Produces ComponentIR
Example
(view Example :layout (raw-js "console.log('hello')"))(custom {:keys [component-name props visible]} child ...)ui.lisp:1513
Builds a host component configuration by string name, with optional JSON properties and child nodes.
| Slot | Type |
|---|---|
| component-name | String |
| props | (Option Json) |
| visible | (Option (Expr Bool)) |
| child | (List component) |
Produces ComponentIR
Example
(view Example
:layout
(custom
:component-name "host/greeting"
:props {:message "Hello"}
(text "Fallback")))Functions 3
Ordinary typed definitions that programs and elaboration hooks can call.
componentui.lisp:18
Constructs configuration without interpreting renderer behavior.
(define component [name props children] …)
component-refui.lisp:1549
SECTION 10 — LAYOUT ALIASES Layout alias for use; this is constant host metadata rather than a callable form.
(define component-ref …)
Types 2
Payload contracts and IR shapes, shown as authored.
ComponentIRui.lisp:12
Portable component configuration, not a renderer: string name, JSON properties, and projected children.
(type ComponentIR {:component String :props Json :children (List Json)})componentui.lisp:15
Child-form category shared by all UI and ViewSpec component forms.
(type component ComponentIR)