Box Layout

A container for a group of components with an optional border.

box {
    width = Size.MD
    control = Control.Layout.Box.BORDERED
    components {
        paragraph {
            text = "Sending money shouldn't cost the earth. That's why we charge you as little as possible when you transfer and exchange money internationally."
        }
    }
}

Properties

Property	Type	Required	Description
`analyticsId`	String	No	An optional identifier to be used in analytics tracking.
`border`	Boolean	No	If true, a border is displayed around the box. Defaults to false. ⚠️ Deprecated - Please use `bordered` or 'bordered-web' in `control` instead.
`components`	Array<Layout>	Yes	The contained components.
`control`	String	No	Specify a particular control to use to represent the layout. If the control is unknown, it will be ignored.
`margin`	Size	No	The vertical margin to apply after this component. Defaults to `md`.
`tags`	Array<String>	No	An optional list of identifiers used to configure renderers.
`type`	String	Yes	It must be `box`.
`width`	Size	No	The width of the box. Defaults to `xl`.

Controls

`bordered`

Displays a border around the Boxed content.

box {
    width = Size.MD
    control = Control.Layout.Box.BORDERED
    components {
        paragraph {
            text = "Sending money shouldn't cost the earth. That's why we charge you as little as possible when you transfer and exchange money internationally."
        }
    }
}

`bordered-web`

Displays a border around the Boxed content only in web.