OUI.Navigation

type Navigation btnC key msg

A Navigation component

new : (key -> msg) -> Navigation btnC key msg

create a new empty Navigation drawer

withSelected : key -> Navigation btnC key msg -> Navigation btnC key msg

Set the currently selected entry

rail : Navigation btnC key msg -> Navigation btnC key msg

Change the drawer into a rail

modal : msg -> Navigation btnC key msg -> Navigation btnC key msg

Change to modal

A modal is a drawer that emit a 'onDismiss' message if the user clicks outside of it

withFAB :

Button { btnC | hasAction : (), hasIcon : () } msg

-> Navigation btnC key msg

Add a FAB button before the entries

withHeader : String -> Navigation btnC key msg -> Navigation btnC key msg

Add a text header on top of the trail/drawer

withImageHeader : Image -> Navigation btnC key msg -> Navigation btnC key msg

Add a image header on top of the trail/drawer

addEntry :

key

-> String

-> Icon

-> Navigation btnC key msg

Add a regular entry

addEntryWithBadge :

key

-> String

-> Icon

-> Badge

-> Navigation btnC key msg

Add an entry with a badge

addSectionHeader : String -> Navigation btnC key msg -> Navigation btnC key msg

Add a section header

addDivider : Navigation btnC key msg -> Navigation btnC key msg

Add a divider

type Mode

= Rail

| Drawer

| ModalDrawer

Mode of the Navigation component

type Entry key

= Entry key EntryProperties

| SectionHeader String

| Divider

Type of Entry inside the Navigation component. Settings -> this is a SectionHeader Video -> this is an Entry Audio ----- -> this is a Divider Gameplay Misc

type alias EntryProperties =

{ label : String

, icon : Icon

, badge : Maybe Badge

}

Properties of the Entry type

getFAB :

Navigation btnC key msg

-> Maybe (Button { btnC | hasAction : (), hasIcon : () } msg)

get the FAB button

getHeader : Navigation btnC key msg -> Maybe String

get the text header

getImageHeader : Navigation btnC key msg -> Maybe Image

get the image header

getSelected : Navigation btnC key msg -> Maybe key

get the selected key

getEntries : Navigation btnC key msg -> List (Entry key)

get the entries

getMode : Navigation btnC key msg -> Mode

get the mode

getOnSelect : Navigation btnC key msg -> key -> msg

get the select message

getOnDismiss : Navigation btnC key msg -> Maybe msg

get the dismiss message

getActiveColor : Navigation btnC key msg -> Color

get the active color

orus-io/elm-orus-ui/1.0.0

Adding content

Internals

Modules