Dynamic Element
2020-05-02

"Siteelm.Html.dynamic" is one of the ways to embed dynamic components in the static layout.
For example, when you want to put something interactive, you can use it.

(Currently you cannot use elm-ui for dynamic elements when you use it in static layouts because class names in both elements are duplicated.)

Dynamic/Counter.elm

module Dynamic.Counter exposing (main)

type alias Model =
    { value : Int
    }

main : Program Model Model Msg
main =
    Browser.element
        { init = \flags -> ( flags, Cmd.none )
        , update = update
        , view = view
        , subscriptions = \_ -> Sub.none
        }
...

siteelm.yaml

build:
    dynamic_elm:
        src_dir: ./src/Dynamic

Static/Layout.elm

import Siteelm.Html as Html

counter : Html Never
counter =
    Html.dynamic
        { moduleName = "Dynamic.Counter"
        , flags = "{value: 100}"
        }
powered by
siteelm