Components

A component is a class with widget fields. It is the unit of reuse in PrismX — build a NavBar, a MetricCard, or a whole SettingsPage, then use it anywhere.

Defining a component

class MetricCard {
    Card card = {
        padding = 16
        gap = 6
        Column col = {
            Label hintLbl = {
                text = "Requests"
            }
            Label titleLbl = {
                text = "0"
            }
        }
    }
}

A component is a class — its widget fields are the markup. There are no typed property parameters in v0.1.0; the class owns everything it renders.

Using a component

class Dashboard {
    MetricCard requestsCard = {}
    MetricCard memoryCard = {}
}

Instantiate a component as a field of another class.

Composition

Classes compose arbitrarily. A screen is a class that contains other classes:

class Dashboard {
    Column mainCol = {
        gap = 16
        NavBar nav = {}
        Row cardRow = {
            gap = 16
            MetricCard uptimeCard = {}
            MetricCard memoryCard = {}
        }
        ActivityLog log = {}
    }
}

Events

A widget’s onPress declares a signal the app loop receives:

Button saveBtn = {
    text = "Save"
    onPress: {
        Signal saveRequested()
    }
}

Handlers run in the app loop — there is no ? operator in v0.1.0; check failures explicitly.

Lifecycle

Windows-level containers use surface with show/hide hooks:

surface Editor {
    onShow { Signal editorShown() }
    onHide { Signal editorHidden() }
}

These fire once per surface instance, when it appears and disappears.

Tip: keep views small. If a component’s markup exceeds a screen, split it. The language server’s “extract component” refactor does this mechanically.

Next: Styling.