Widget.Layout

Combines multiple concepts from the material design specification, namely:

Top App Bar
Navigation Draw
Side Panel
Dialog
Snackbar

It is responsive and changes view to apply to the material design guidelines.

Basics

type alias Layout msg =

{ snackbar : Snackbar (Message msg)

, active : Maybe Part

}

The model of the layout containing the snackbar and the currently active side sheet (or search bar)

type Part

= LeftSheet

| RightSheet

| Search

The currently visible part: either the left sheet, right sheet or the search bar

init : Layout msg

The initial state of the layout

timePassed : Int -> Layout msg -> Layout msg

Update the model, put this function into your subscription. The first argument is the seconds that have passed sice the function was called last.

view :

LayoutStyle msg

-> { window :

{ height : Int

, width : Int

}

, dialog : Maybe (List (Attribute msg))

, layout : Layout msg

, title : Element msg

, menu : Select msg

, search :

Maybe

{ onChange : String -> msg

, text : String

, label : String

}

, actions : List (Button msg)

, onChangedSidebar : Maybe Part -> msg

}

-> Element msg

-> Html msg

View the layout. Replacement of Element.layout.

Actions

activate : Maybe Part -> Layout msg -> Layout msg

Open either a side sheet or the search bar.

queueMessage : Message msg -> Layout msg -> Layout msg

Queues a message and displayes it as a snackbar once no other snackbar is visible.

Orasund/elm-ui-widgets/2.2.0

Widget.Layout

Basics

Actions

Modules