Page.Transition

Page lifecycle hooks for enter/exit transitions and loading states.

These are composable modifiers applied via pipeline to any page:

blogPage =
    Page.element { ... }
        |> Transition.onEnter (\shared -> loadPosts shared.apiUrl)
        |> Transition.onLeave (\shared model -> saveDraft model.draft)
        |> Transition.withLoading loadingView
        |> Transition.keepAlive

Types

type PageState model

= Loading

| Loaded model

| Failed String

The loading state of a page.

type Lifecycle shared model msg

Lifecycle metadata for a page. Stored alongside the page, not inside it, because the App module needs access to manage page transitions.

Lifecycle Constructors and Modifiers

lifecycle : Lifecycle shared model msg

Create a default lifecycle with no hooks.

onEnter :

(shared -> Cmd msg)

-> Lifecycle shared model msg

Add an onEnter hook. The command is fired when the page becomes active.

myLifecycle =
    Transition.lifecycle
        |> Transition.onEnter (\shared -> loadData shared.apiUrl)

onLeave :

(shared -> model -> Cmd msg)

-> Lifecycle shared model msg

Add an onLeave hook. The command is fired when navigating away from the page.

myLifecycle =
    Transition.lifecycle
        |> Transition.onLeave (\shared model -> saveDraft model.draft)

withLoading :

(shared -> Html msg)

-> Lifecycle shared model msg

Set a loading view shown while onEnter commands are in-flight.

myLifecycle =
    Transition.lifecycle
        |> Transition.withLoading (\shared -> Html.text "Loading...")

keepAlive : Lifecycle shared model msg -> Lifecycle shared model msg

Mark the page as keep-alive. When navigating away, the model is preserved instead of being destroyed. When returning to this page, the preserved model is reused instead of running init again.

myLifecycle =
    Transition.lifecycle
        |> Transition.keepAlive

Lifecycle Accessors

getOnEnter : Lifecycle shared model msg -> Maybe (shared -> Cmd msg)

Get the onEnter command producer, if any.

getOnLeave : Lifecycle shared model msg -> Maybe (shared -> model -> Cmd msg)

Get the onLeave command producer, if any.

isKeepAlive : Lifecycle shared model msg -> Bool

Check if the page is marked as keep-alive.

joshburgess/elm-route-craft/1.0.0

Page.Transition

Types

Lifecycle Constructors and Modifiers

Lifecycle Accessors

Modules