ContextHtml

Html with context

applyContext : ctx -> ContextHtml ctx msg -> Html msg

Apply context to ContextHtml

view : Html msg
view =
    let
        context = ... -- make Context
    in
    applyContext context viewChild


viewChild : ContextHtml Context msg
viewChild = ...

withContext : (ctx -> Html msg) -> ContextHtml ctx msg

Create ContextHtml

view : ContextHtml ctx msg
view =
    withContext <| \ctx -> Html.div [] []

wrapHtml : Html msg -> ContextHtml ctx msg

Wrap Html to ContextHtml

view : ContextHtml ctx msg
view =
    div [] [ wrapHtml <| viewCommon "Text" ]


viewCommon : String -> Html msg
viewCommon = ...

useContext : (ctx -> a) -> (a -> ContextHtml ctx msg) -> ContextHtml ctx msg

Use a context value

type alias Context =
    { text : String }


view =
    useContext .text <| \text_ -> div [] [ text text_ ]

When Context is Opaque type

-- Context.elm
type Context
    = Context { text : String }


-- Expose Selector accessing context value
textSelector (Context { text }) =
    text


textWithPrefixSelector (Context { text }) =
    "prefix_" ++ text


-- Main.elm
view1 =
    useContext textSelector <| \text_ -> div [] [ text text_ ]


view2 =
    useContext textWithPrefixSelector <| \text_ -> div [] [ text text_ ]

useContext2 :

(ctx -> a)

-> (ctx -> b)

-> (a -> b -> ContextHtml ctx msg)

-> ContextHtml ctx msg

Use context values

type alias Context =
    { text : String
    , color : String
    }


view =
    useContext2 .text .color <| \text_ color -> div [ style "color" color ] [ text text_ ]

useContext3 :

(ctx -> a)

-> (ctx -> b)

-> (ctx -> c)

-> (a -> b -> c -> ContextHtml ctx msg)

-> ContextHtml ctx msg

useContext4 :

(ctx -> a)

-> (ctx -> b)

-> (ctx -> c)

-> (ctx -> d)

-> (a -> b -> c -> d -> ContextHtml ctx msg)

-> ContextHtml ctx msg

useContext5 :

(ctx -> a)

-> (ctx -> b)

-> (ctx -> c)

-> (ctx -> d)

-> (ctx -> e)

-> (a -> b -> c -> d -> e -> ContextHtml ctx msg)

-> ContextHtml ctx msg

useContext6 :

(ctx -> a)

-> (ctx -> b)

-> (ctx -> c)

-> (ctx -> d)

-> (ctx -> e)

-> (ctx -> f)

-> (a -> b -> c -> d -> e -> f -> ContextHtml ctx msg)

-> ContextHtml ctx msg

useContext7 :

(ctx -> a)

-> (ctx -> b)

-> (ctx -> c)

-> (ctx -> d)

-> (ctx -> e)

-> (ctx -> f)

-> (ctx -> g)

-> (a -> b -> c -> d -> e -> f -> g -> ContextHtml ctx msg)

-> ContextHtml ctx msg

useContext8 :

(ctx -> a)

-> (ctx -> b)

-> (ctx -> c)

-> (ctx -> d)

-> (ctx -> e)

-> (ctx -> f)

-> (ctx -> g)

-> (ctx -> h)

-> (a -> b -> c -> d -> e -> f -> g -> h -> ContextHtml ctx msg)

-> ContextHtml ctx msg

text : String -> ContextHtml ctx msg

node :

String

-> List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

map : (a -> msg) -> ContextHtml ctx a -> ContextHtml ctx msg

h1 :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

h2 :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

h3 :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

h4 :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

h5 :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

h6 :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

div :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

p :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

hr :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

pre :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

blockquote :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

span :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

a :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

code :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

em :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

strong :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

i :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

b :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

u :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

sub :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

sup :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

br :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

ol :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

ul :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

li :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

dl :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

dt :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

dd :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

img :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

iframe :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

canvas :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

math :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

form :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

input :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

textarea :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

button :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

select :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

option :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

section :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

nav :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

article :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

aside :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

header :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

footer :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

address :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

main_ :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

figure :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

figcaption :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

table :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

caption :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

colgroup :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

col :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

tbody :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

thead :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

tfoot :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

tr :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

td :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

th :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

fieldset :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

legend :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

label :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

datalist :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

optgroup :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

output :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

progress :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

meter :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

audio :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

video :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

source :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

track :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

embed :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

object :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

param :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

ins :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

del :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

small :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

cite :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

dfn :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

abbr :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

time :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

var :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

samp :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

kbd :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

s :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

q :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

mark :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

ruby :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

rt :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

rp :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

bdi :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

bdo :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

wbr :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

details :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

summary :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

menuitem :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

menu :

List (Attribute msg)

-> List (ContextHtml ctx msg)

-> ContextHtml ctx msg

nabekou29/elm-context-html/2.0.0

ContextHtml

useContext

Primitives

Tags

Headers

Grouping Content

Text

Lists

Embedded Content

Inputs

Sections

Figures

Tables

Less Common Elements

Less Common Inputs

Audio and Video

Embedded Objects

Text Edits

Semantic Text

Less Common Text Tags

Interactive Elements

Modules