Copyright	(C) 2016-2025 David M. Johnson (@dmjio)
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

Contents

API
Reactivity
Types
Effect
Event
Property
PubSub
Run
Subscriptions
Storage
Fetch
Util
FFI
State management

Description

Synopsis

miso :: Eq model => (URI -> App model action) -> JSM ()
(🍜) :: Eq model => (URI -> App model action) -> JSM ()
type App model action = Component ROOT model action
startApp :: Eq model => App model action -> JSM ()
renderApp :: Eq model => MisoString -> App model action -> JSM [DOMRef] -> JSM ()
data Component parent model action
startComponent :: Eq model => Component ROOT model action -> JSM ()
withSink :: (Sink action -> JSM ()) -> Effect parent model action
type Sink action = action -> JSM ()
mail :: ToJSON message => ComponentId -> message -> Effect parent model action
checkMail :: FromJSON value => (value -> action) -> (MisoString -> action) -> Value -> Maybe action
parent :: (parent -> action) -> action -> Effect parent model action
mailParent :: ToJSON message => message -> Effect parent model action
broadcast :: ToJSON message => message -> Effect parent model action
startSub :: ToMisoString subKey => subKey -> Sub action -> Effect parent model action
stopSub :: ToMisoString subKey => subKey -> Effect parent model action
type Sub action = Sink action -> JSM ()
issue :: action -> Effect parent model action
batch :: [JSM action] -> Effect parent model action
io :: JSM action -> Effect parent model action
io_ :: JSM () -> Effect parent model action
for :: Foldable f => JSM (f action) -> Effect parent model action
module Miso.Binding
module Miso.Types
module Miso.Effect
module Miso.Event
module Miso.Property
module Miso.PubSub
module Miso.Run
module Miso.Subscription
module Miso.Storage
module Miso.Fetch
module Miso.Util
module Miso.FFI
module Miso.State

API

Miso

miso :: Eq model => (URI -> App model action) -> JSM () Source #

Runs an isomorphic miso application. Assumes the pre-rendered DOM is already present. Always mounts to <body>. Copies page into the virtual DOM.

(🍜) :: Eq model => (URI -> App model action) -> JSM () Source #

Alias for miso.

App

type App model action = Component ROOT model action Source #

For top-level Component, ROOT must always be specified for parent.

startApp :: Eq model => App model action -> JSM () Source #

Synonym startApp to startComponent.

renderApp Source #

Arguments

:: Eq model
=> MisoString	Name of the JS object that contains the drawing context
-> App model action	Component application
-> JSM [DOMRef]	Custom hook to perform any JSM action (e.g. render styles) before initialization.
-> JSM ()

Runs a miso application, but with a custom rendering engine. The MisoString specified here is the variable name of a globally-scoped JS object that implements the context interface per 'tsmisocontext/dom.ts' This is necessary for native support.

Component

data Component parent model action Source #

Application entry point

Instances

Instances details

ToView model (Component parent model action) Source #

Instance details

Defined in Miso.Types

Associated Types

type ToViewAction model (Component parent model action)
Instance details Defined in Miso.Types type ToViewAction model (Component parent model action) = action

Methods

toView :: Component parent model action -> View model (ToViewAction model (Component parent model action)) Source #

ToHtml (Component parent model action) Source #

Render a Component parent model action to a L.ByteString

Instance details

Defined in Miso.Html.Render

Methods

toHtml :: Component parent model action -> ByteString Source #

type ToViewAction model (Component parent model action) Source #

Instance details

Defined in Miso.Types

type ToViewAction model (Component parent model action) = action

startComponent :: Eq model => Component ROOT model action -> JSM () Source #

Runs a miso application

Sink

withSink :: (Sink action -> JSM ()) -> Effect parent model action Source #

withSink allows users to access the sink of the Component or top-level Component in their application. This is useful for introducing IO into the system. A synonym for tell, specialized to Effect.

A use-case is scheduling an IO computation which creates a 3rd-party JS widget which has an associated callback. The callback can then call the sink to turn events into actions. To do this without accessing a sink requires going via a Subscription which introduces a leaky-abstraction.

update FetchJSON = withSink $ \sink -> getJSON (sink . ReceivedJSON) (sink . HandleError)

Since: 1.9.0.0

type Sink action = action -> JSM () Source #

Function to asynchronously dispatch actions to the update function.

Component

mail :: ToJSON message => ComponentId -> message -> Effect parent model action Source #

Send any ToJSON message => message to a Component mailbox, by ComponentId

mail componentId ("test message" :: MisoString) :: Effect parent model action

Since: 1.9.0.0

checkMail :: FromJSON value => (value -> action) -> (MisoString -> action) -> Value -> Maybe action Source #

Helper function for processing Mail from mail.

data Action
  = ParsedMail Message
  | ErrorMail MisoString

main = app { mailbox = checkMail ParsedMail ErrorMail }

Since: 1.9.0.0

parent :: (parent -> action) -> action -> Effect parent model action Source #

Fetches the parent model from the child.

Since: 1.9.0.0

mailParent :: ToJSON message => message -> Effect parent model action Source #

Send any ToJSON message => message to the parent's Component mailbox

mailParent ("test message" :: MisoString) :: Effect parent model action

Since: 1.9.0.0

broadcast :: ToJSON message => message -> Effect parent model action Source #

Sends a message to all Component mailbox, excluding oneself.

  broadcast (String "public service announcement")

Since: 1.9.0.0

Subscriptions

startSub :: ToMisoString subKey => subKey -> Sub action -> Effect parent model action Source #

Starts a named Sub dynamically, during the life of a Component. The Sub can be stopped by calling Ord subKey => stop subKey from the update function. All Sub started will be stopped if a Component is unmounted.

data SubType = LoggerSub | TimerSub
  deriving (Eq, Ord)

update Action =
  startSub LoggerSub $ sink -> forever (threadDelay (secs 1) >> consoleLog "test")

Since: 1.9.0.0

stopSub :: ToMisoString subKey => subKey -> Effect parent model action Source #

Stops a named Sub dynamically, during the life of a Component. All Sub started will be stopped automatically if a Component is unmounted.

data SubType = LoggerSub | TimerSub
  deriving (Eq, Ord)

update Action = do
  stopSub LoggerSub

Since: 1.9.0.0

type Sub action = Sink action -> JSM () Source #

Type synonym for constructing event subscriptions.

The Sink callback is used to dispatch actions which are then fed back into the update function.

Effect

issue :: action -> Effect parent model action Source #

Issue a new Action to be processed by update.

update :: Action -> Effect Model Action
update = \case
  Click -> issue HelloWorld

Since: 1.9.0.0

batch :: [JSM action] -> Effect parent model action Source #

Smart constructor for an Effect with multiple actions.

Since: 1.9.0.0

io :: JSM action -> Effect parent model action Source #

Schedule a single IO action for later execution.

Note that multiple IO action can be scheduled using tell from the mtl library.

Since: 1.9.0.0

io_ :: JSM () -> Effect parent model action Source #

Like io_ but doesn't cause an action to be dispatched to the update function.

This is handy for scheduling IO computations where you don't care about their results or when they complete.

Since: 1.9.0.0

for :: Foldable f => JSM (f action) -> Effect parent model action Source #

Like io but generalized to any instance of Foldable

This is handy for scheduling IO computations that return a Maybe value

Since: 1.9.0.0

Reactivity

module Miso.Binding

Types

module Miso.Types

Effect

module Miso.Effect

Event

module Miso.Event

Property

module Miso.Property

PubSub

module Miso.PubSub

Run

module Miso.Run

Subscriptions

module Miso.Subscription

Storage

module Miso.Storage

Fetch

module Miso.Fetch

Util

module Miso.Util

FFI

module Miso.FFI

State management

module Miso.State