Component Types
Brioche has several types or categories of UI components.
Control components are the elements of a page that allow users to interact with it. This includes buttons, textboxes, toggle switches, checkboxes, and radio buttons.
Functional Layout components utilise control components to provide common use cases that such controls could be used for. This includes checklists (choose 1 or more options), radio lists (choose only 1 option), lists, tab bars, etc.
Page Layout components provide a pre-defined layout for a page. This could involve having a view with a main article (e.g. a blog post) and a sidebar (which could house child components like related posts and tags).
Utility Layout components are handy to define one-off or custom layouts. For example, HStack would provide a container where all its child components will automatically be laid out in a row. VStack would arrange its child components in a column. A Grid component would provide the opportunity to define more complex layouts where you could specify a limit for how many columns it could spread child components across before starting a new row.
Surface components have specific visual designs for common components seen in most websites. This includes navigation bars, cards, page headers, toolbars, and modals.
Common links