MenuButton¶

MenuButton is one row of a Menu, with an icon or element at each end. It can run an action, or move to another page of the menu.

Usage¶

Call Components.MenuButton with a scope and a table of properties:

C.MenuButton(scope, {
    Text = "Settings",
    LeadingIcon = "settings",
    Page = "settings", -- (1)!
})

Page is the Id of a MenuPage. Pressing the row moves to that page and does not close the menu.

Name	Type	Default	Description
`Theme`	`ThemeRef`	The contextual theme	Theme to use for this component instead of the one from `Theme.Provide`.
`LayoutOrder`	`UsedAs<number>`	`0`	Position in a parent `UIListLayout` or `UIGridLayout`.
`Size`	`UsedAs<UDim2>`	-	Size of the component.
`Visible`	`UsedAs<boolean>`	`true`	Whether the component is shown.
`ZIndex`	`UsedAs<number>`	-	Z index of the component.
`Text`	`UsedAs<string>`	-	Label of the row.
`Disabled`	`UsedAs<boolean>`	`false`	Stops the row reacting to input. Read once, when it is created.
`Leading`	`MenuSlot`	-	A Lucide icon name or an instance shown before the label.
`Trailing`	`MenuSlot`	-	A Lucide icon name or an instance shown after the label.
`LeadingIcon`	`string`	-	Same as `Leading` when it is an icon name.
`TrailingIcon`	`string`	-	Same as `Trailing` when it is an icon name.
`Color`	`UsedAs<ColorInput>`	`Colors.OnSurface`	Tint of the label and the icons, such as `"error"`.
`Page`	`string`	-	Id of a MenuPage to move to when pressed.
`Compact`	`boolean`	`true`	Use the 40 px row. Set `false` for the taller 44 px row of a header menu.
`Children`	`any`	-	Content placed in the row.

Name	Description
`OnClick: () -> ()`	Runs when the row is pressed.
`OnClose: () -> ()`	Called after `OnClick`. A Menu sets it for rows built from `Items` and `Sections`.