In other component libraries navigation is rendered directly with elements, in Mint UI it is rendered from data which enables adapting the view to the screen size.
For example the navigation in Ui.Header component on desktop is displayed as a navigation list, but on mobile since there is no screen estate it's displaid as an Ui.ActionSheet.
Ui.NavItem
enum is used to describe navigation items, currently it consists of:Ui.NavItem.Link
- a link to an other page.Ui.NavItem.Item
- a link like item which can be clicked.Ui.NavItem.Group
- a group of other navigation items.Ui.NavItem.Divider
- a divider between navigation items.[ Ui.NavItem.Link( iconBefore: Ui.Icons.HOME, iconAfter: <></>, label: "Home", target: "", href: "/"), Ui.NavItem.Item( action: (event : Html.Event) { Ui.Notifications.notifyDefault(<>"Item clicked!"</>) }, iconBefore: Ui.Icons.PUZZLE, iconAfter: <></>, label: "Components"), Ui.NavItem.Divider, Ui.NavItem.Group( iconBefore: Ui.Icons.BRIEFCASE, iconAfter: <></>, label: "Group", items: [ Ui.NavItem.Link( iconBefore: Ui.Icons.HOME, iconAfter: <></>, label: "Sub Item", target: "", href: "/") ])]
Mint UI is a design system and component library for building websites, web and desktop applications.