Configurable Welcome Card

Build a welcome card whose name, message, accent, and badge can be changed from the app's settings. The preview below was rendered from the complete source on this page.

Complete app

app.star

load("render.star", "render")
load("schema.star", "schema")

DEFAULT_NAME = "Mia"
DEFAULT_MESSAGE = "Welcome home"
DEFAULT_ACCENT = "#f59e0b"

def main(config):
    name = config.str("name", DEFAULT_NAME)
    message = config.str("message", DEFAULT_MESSAGE)
    accent = config.str("accent", DEFAULT_ACCENT)
    show_badge = config.bool("show_badge", True)

    heading = [
        render.Circle(diameter = 7, color = accent),
        render.Box(width = 3, height = 1),
        render.Text(name, font = "6x10", color = "#ffffff"),
    ] if show_badge else [
        render.Text(name, font = "6x10", color = "#ffffff"),
    ]

    return render.Root(
        child = render.Box(
            width = 64,
            height = 32,
            color = "#3b1d5a",
            child = render.Padding(
                pad = (4, 3, 4, 3),
                child = render.Column(
                    expanded = True,
                    main_align = "space_between",
                    cross_align = "start",
                    children = [
                        render.Row(children = heading, cross_align = "center"),
                        render.WrappedText(
                            message,
                            width = 56,
                            height = 11,
                            font = "CG-pixel-4x5-mono",
                            linespacing = 1,
                            color = "#f5e9ff",
                        ),
                    ],
                ),
            ),
        ),
    )

def get_schema():
    return schema.Schema(
        version = "1",
        fields = [
            schema.Text(
                id = "name",
                name = "Name",
                desc = "Name shown on the card.",
                icon = "text",
                default = DEFAULT_NAME,
            ),
            schema.Text(
                id = "message",
                name = "Message",
                desc = "Message shown below the name.",
                icon = "text",
                default = DEFAULT_MESSAGE,
            ),
            schema.Color(
                id = "accent",
                name = "Accent",
                desc = "Badge color.",
                icon = "brush",
                default = DEFAULT_ACCENT,
            ),
            schema.Toggle(
                id = "show_badge",
                name = "Show badge",
                desc = "Display the circular badge.",
                icon = "eye",
                default = True,
            ),
        ],
    )

Download this app.star.

How it works

1. main(config) reads typed values and supplies safe defaults for previews.
2. Row, Column, Padding, and Box create the 64×32 layout; Circle, Text, and WrappedText draw its content.
3. The conditional heading list removes both the badge and its spacer when the toggle is off.
4. get_schema() exposes text, color, and toggle controls to every installation.