Copyright | (C) 2016-2025 David M. Johnson |
---|---|
License | BSD3-style (see the file LICENSE) |
Maintainer | David M. Johnson <code@dmj.io> |
Stability | experimental |
Portability | non-portable |
Safe Haskell | None |
Language | Haskell2010 |
Miso.Types
Description
Synopsis
- type App model action = Component ROOT model action
- data Component parent model action = Component {
- model :: model
- update :: action -> Effect parent model action
- view :: model -> View model action
- subs :: [Sub action]
- events :: Events
- styles :: [CSS]
- scripts :: [JS]
- initialAction :: Maybe action
- mountPoint :: Maybe MountPoint
- logLevel :: LogLevel
- mailbox :: Mail -> Maybe action
- bindings :: [Binding parent model]
- data Binding parent model = Binding Direction (Lens parent a) (Lens model a)
- type ComponentId = Int
- data SomeComponent parent = Eq model => SomeComponent (Component parent model action)
- data View model action
- = VNode NS MisoString [Attribute action] [View model action]
- | VText MisoString
- | VTextRaw MisoString
- | VComp NS MisoString [Attribute action] (SomeComponent model)
- newtype Key = Key MisoString
- data Attribute action
- = Property MisoString Value
- | Event (Sink action -> VTree -> LogLevel -> Events -> JSM ())
- | Styles (Map MisoString MisoString)
- data NS
- data CSS
- data JS
- = Src MisoString
- | Script MisoString
- | ImportMap [(MisoString, MisoString)]
- data LogLevel
- newtype VTree = VTree {}
- type MountPoint = MisoString
- type DOMRef = JSVal
- data ROOT
- type Transition model action = Effect ROOT model action
- class ToView m a where
- type ToViewAction m a
- toView :: a -> View m (ToViewAction m a)
- class ToKey key where
- component :: model -> (action -> Effect parent model action) -> (model -> View model action) -> Component parent model action
- (-->) :: Lens parent a -> Lens model a -> Binding parent model
- (<--) :: Lens parent a -> Lens model a -> Binding parent model
- (<-->) :: Lens parent a -> Lens model a -> Binding parent model
- getDirection :: Binding parent model -> Direction
- data Direction
- mount :: forall parent model action a. Eq model => ([View parent a] -> View parent a) -> Component parent model action -> View parent a
- (+>) :: forall parent model action a. Eq model => ([View parent a] -> View parent a) -> Component parent model action -> View parent a
- getMountPoint :: Maybe MisoString -> MisoString
- node :: NS -> MisoString -> [Attribute action] -> [View parent action] -> View parent action
- text :: MisoString -> View parent action
- text_ :: [MisoString] -> View parent action
- textRaw :: MisoString -> View parent action
- rawHtml :: MisoString -> View parent action
- type MisoString = Text
- toMisoString :: ToMisoString str => str -> MisoString
- fromMisoString :: FromMisoString a => MisoString -> a
- ms :: ToMisoString str => str -> MisoString
Types
data Component parent model action Source #
Application entry point
Constructors
Component | |
Fields
|
Instances
ToView model (Component parent model action) Source # | |||||
Defined in Miso.Types Associated Types
| |||||
type ToViewAction model (Component parent model action) Source # | |||||
Defined in Miso.Types |
data Binding parent model Source #
Type used for React-like "props" functionality. This is used to to bind parent model changes to the child model, or vice versa.
The difference between miso and React here is that miso is synchronizing model states of Components declaratively (outside of the view). In React "props" are used in the view code.
https://react.dev/learn/passing-props-to-a-component
This can be thought of as establishing an "edge" in the Component
graph,
whereby events cause model change synchronization to "ripple" or "pulsate"
through the views. The "reactivity" of the graph is constructed manually
by the end-user, using the edge primitives -->
, <--
, <-->
(reactive combinators).
This can also be thought of as a Wire (from netwire
) for reactive
variable synchronization, except done at the granularity specified by the Lens
.
main :: IO () main = run app { bindings = [ parentLens --> childLens ] }
Since: 1.9.0.0
type ComponentId = Int Source #
ID for Component
data SomeComponent parent Source #
Existential wrapper used to allow the nesting of Component
in Component
Constructors
Eq model => SomeComponent (Component parent model action) |
data View model action Source #
Core type for constructing a virtual DOM in Haskell
Constructors
VNode NS MisoString [Attribute action] [View model action] | |
VText MisoString | |
VTextRaw MisoString | |
VComp NS MisoString [Attribute action] (SomeComponent model) |
Instances
HasRouter (View m a :: Type) Source # | View | ||||
ToView model (View model action) Source # | |||||
Defined in Miso.Types Associated Types
| |||||
HasLink (View m a :: Type) Source # | For constructing type-safe links | ||||
Functor (View model) Source # | |||||
ToHtml [View m a] Source # | Render a | ||||
Defined in Miso.Render Methods toHtml :: [View m a] -> ByteString Source # | |||||
IsString (View model action) Source # |
| ||||
Defined in Miso.Types Methods fromString :: String -> View model action # | |||||
ToHtml (View m a) Source # | Render a | ||||
Defined in Miso.Render Methods toHtml :: View m a -> ByteString Source # | |||||
type ToViewAction model (View model action) Source # | |||||
Defined in Miso.Types | |||||
type RouteT (View m a :: Type) x Source # | |||||
Defined in Miso.Router | |||||
type MkLink (View m a :: Type) b Source # | |||||
Defined in Miso.Types |
A unique key for a DOM node.
This key is only used to speed up diffing the children of a DOM node, the actual content is not important. The keys of the children of a given DOM node must be unique. Failure to satisfy this invariant gives undefined behavior at runtime.
Constructors
Key MisoString |
data Attribute action Source #
Attribute of a vnode in a View
.
The Sink
callback can be used to dispatch actions which are fed back to
the update
function. This is especially useful for event handlers
like the onclick
attribute. The second argument represents the
vnode the attribute is attached to.
Constructors
Property MisoString Value | |
Event (Sink action -> VTree -> LogLevel -> Events -> JSM ()) | |
Styles (Map MisoString MisoString) |
Allow users to express CSS and append it to head before the first draw
Href "http://domain.com/style.css
Constructors
Href MisoString |
|
Style MisoString |
|
Sheet StyleSheet |
Allow users to express JS and append it to head before the first draw
This is meant to be useful in development only.
Src "http://example.com/script.js" Script "http://example.com/script.js" ImportMap [ "key" =: "value" ]
Constructors
Src MisoString |
|
Script MisoString |
|
ImportMap [(MisoString, MisoString)] |
|
Optional logging for debugging miso internals (useful to see if prerendering is successful)
Constructors
Off | No debug logging, the default value used in |
DebugHydrate | Will warn if the structure or properties of the DOM vs. Virtual DOM differ during prerendering. |
DebugEvents | Will warn if an event cannot be routed to the Haskell event handler that raised it. Also will warn if an event handler is being used, yet it's not being listened for by the event delegator mount point. |
DebugAll | Logs on all of the above |
type MountPoint = MisoString Source #
mountPoint
for Component
, e.g "body"
type Transition model action = Effect ROOT model action Source #
When Component
are not in use, also for pre-1.9 miso
applications.
Classes
class ToView m a where Source #
Convenience class for using View
Associated Types
type ToViewAction m a Source #
Methods
toView :: a -> View m (ToViewAction m a) Source #
Instances
ToView model (View model action) Source # | |||||
Defined in Miso.Types Associated Types
| |||||
ToView model (Component parent model action) Source # | |||||
Defined in Miso.Types Associated Types
|
class ToKey key where Source #
Convert custom key types to Key
.
Instances of this class do not have to guarantee uniqueness of the
generated keys, it is up to the user to do so. toKey
must be an
injective function.
Instances
ToKey JSString Source # | Convert |
ToKey Key Source # | Identity instance |
ToKey Text Source # | Convert |
ToKey String Source # | Convert |
ToKey Double Source # | Convert |
ToKey Float Source # | Convert |
ToKey Int Source # | Convert |
ToKey Word Source # | Convert |
Smart Constructors
component :: model -> (action -> Effect parent model action) -> (model -> View model action) -> Component parent model action Source #
Smart constructor for Component
with sane defaults.
Data binding
(-->) :: Lens parent a -> Lens model a -> Binding parent model Source #
Smart constructor for a Binding
, unidirectionally binds parent to child
Since: 1.9.0.0
(<--) :: Lens parent a -> Lens model a -> Binding parent model Source #
Smart constructor for a Binding
, unidirectionally binds child to parent
Since: 1.9.0.0
(<-->) :: Lens parent a -> Lens model a -> Binding parent model Source #
Smart constructor for a Binding
, bidirectionlly binds child to parent
Since: 1.9.0.0
Constructors
ParentToChild | |
ChildToParent | |
Bidirectional |
Component
mount :: forall parent model action a. Eq model => ([View parent a] -> View parent a) -> Component parent model action -> View parent a Source #
Used in the view
function to mount a Component
on any VNode
mount (p_ [ key_ "component-1" ]) $ component $ \m -> div_ [ id_ "foo" ] [ text (ms m) ]
Warning this *is* a partial function. Do not attempt to mount on a
Text node. This function will ignore the children given and mount the
new Component
on top of them. Attempts to mount a Component
ontop of an
existing Component
always prioritize the component specified in the lowest
level.
See usage above. In general, it's wise to only mount on VNode
.
Since: 1.9.0.0
(+>) :: forall parent model action a. Eq model => ([View parent a] -> View parent a) -> Component parent model action -> View parent a infixr 0 Source #
Utils
getMountPoint :: Maybe MisoString -> MisoString Source #
Convenience for extracting mount point
Combinators
node :: NS -> MisoString -> [Attribute action] -> [View parent action] -> View parent action Source #
Create a new Miso.Types.VNode
.
node ns tag key attrs children
creates a new node with tag tag
and Key
key
in the namespace ns
. All attrs
are called when
the node is created and its children are initialized to children
.
text :: MisoString -> View parent action Source #
Create a new Text
with the given content.
text_ :: [MisoString] -> View parent action Source #
Create a new Text
with the given content.
textRaw :: MisoString -> View parent action Source #
TextRaw
creation. Don't use directly
rawHtml :: MisoString -> View parent action Source #
MisoString
type MisoString = Text Source #
String type swappable based on compiler
toMisoString :: ToMisoString str => str -> MisoString Source #
fromMisoString :: FromMisoString a => MisoString -> a Source #
Parses a MisoString
, throws an error when decoding
fails. Use fromMisoStringEither
for as a safe alternative.
ms :: ToMisoString str => str -> MisoString Source #
Convenience function, shorthand for toMisoString