Copyright | (C) 2016-2017 David M. Johnson |
---|---|
License | BSD3-style (see the file LICENSE) |
Maintainer | David M. Johnson <djohnson.m@gmail.com> |
Stability | experimental |
Portability | non-portable |
Safe Haskell | None |
Language | Haskell2010 |
Example usage:
import Miso data IntAction = Add | Subtract intView :: Int -> View IntAction intView n = div_ [ class_ "main" ] [ btn_ [ onClick Add ] [ text_ "+" ] , text_ $ pack (show n) , btn_ [ onClick Subtract ] [ text_ "-" ] ]
More information on how to use miso
is available on GitHub
- module Miso.Html.Element
- module Miso.Html.Event
- data VTree model where
- newtype View model = View {}
- class ToView v where
- data Attribute model
- = C MisoString MisoString
- | P MisoString Value
- | E ()
- node :: NS -> MisoString -> Maybe Key -> [Attribute model] -> [View model] -> View model
- text :: ToMisoString str => str -> View model
- newtype Key = Key MisoString
- class ToKey key where
- data NS
- prop :: ToJSON a => MisoString -> a -> Attribute model
- style_ :: Map MisoString MisoString -> Attribute action
- on :: MisoString -> Decoder r -> (r -> action) -> Attribute action
- onWithOptions :: Options -> MisoString -> Decoder r -> (r -> action) -> Attribute action
- module Miso.String
- module Miso.Html.Property
Documentation
module Miso.Html.Element
module Miso.Html.Event
Core types and interface
data VTree model where Source #
Virtual DOM implemented as a Rose Vector
.
Used for diffing, patching and event delegation.
Not meant to be constructed directly, see View
instead.
Convenience class for using View
View
Attributes to annotate DOM, converted into Events
, Props
, Attrs
and CSS
Smart View
constructors
node :: NS -> MisoString -> Maybe Key -> [Attribute model] -> [View model] -> View model Source #
VNode
creation
Key patch internals
Key for specific children patch
Namespace
Namespace for element creation
Setting properties on virtual DOM nodes
prop :: ToJSON a => MisoString -> a -> Attribute model Source #
Constructs a property on a VNode
, used to set fields on a DOM Node
Setting CSS
style_ :: Map MisoString MisoString -> Attribute action Source #
Constructs CSS
for a DOM Element
import qualified Data.Map as M div_ [ style_ $ M.singleton "background" "red" ] [ ]
Handling events
on :: MisoString -> Decoder r -> (r -> action) -> Attribute action Source #
For defining delegated events
let clickHandler = on "click" emptyDecoder $ \() -> Action in button_ [ clickHandler, class_ "add" ] [ text_ "+" ]
onWithOptions :: Options -> MisoString -> Decoder r -> (r -> action) -> Attribute action Source #
For defining delegated events with options
let clickHandler = on defaultOptions "click" emptyDecoder $ \() -> Action in button_ [ clickHandler, class_ "add" ] [ text_ "+" ]
String
module Miso.String
module Miso.Html.Property