| 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
Description
Synopsis
- miso :: forall model (name :: Symbol) action. Eq model => (URI -> Component name model action) -> JSM ()
- (🍜) :: forall model (name :: Symbol) action. Eq model => (URI -> Component name model action) -> JSM ()
- startComponent :: forall model (name :: Symbol) action. Eq model => Component name model action -> JSM ()
- withSink :: (Sink action -> JSM ()) -> Effect model action
- type Sink action = action -> JSM ()
- sample :: forall (name :: Symbol) model action. KnownSymbol name => Component name model action -> JSM model
- sample' :: MisoString -> JSM model
- notify :: forall (name :: Symbol) model action. KnownSymbol name => Component name model action -> action -> JSM ()
- notify' :: MisoString -> action -> JSM ()
- startSub :: SubName -> Sub action -> Effect action model
- stopSub :: SubName -> Effect action model
- type Sub action = Sink action -> JSM ()
- type SubName = MisoString
- issue :: action -> Effect model action
- batch :: [JSM action] -> Effect model action
- io :: JSM action -> Effect model action
- io_ :: JSM () -> Effect model action
- for :: Foldable f => JSM (f action) -> Effect model action
- component :: forall (name :: Symbol) model action a. (Eq model, KnownSymbol name) => Component name model action -> View a
- componentWith :: forall (name :: Symbol) model action a. (Eq model, KnownSymbol name) => Component name model action -> Maybe Key -> [Attribute a] -> View a
- componentWith_ :: Eq model => Component "" model action -> Maybe Key -> [Attribute a] -> View a
- component_ :: Eq model => Component "" model action -> View a
- defaultComponent :: forall model action (name :: Symbol). model -> (action -> Effect model action) -> (model -> View action) -> Component name model action
- getMountPoint :: Maybe MisoString -> MisoString
- data Attribute action
- = Property MisoString Value
- | Event (Sink action -> Object -> LogLevel -> Events -> JSM ())
- | Styles (Map MisoString MisoString)
- data CSS
- data Component (name :: Symbol) model action = Component {}
- newtype Key = Key MisoString
- data LogLevel
- type MountPoint = MisoString
- data NS
- data SomeComponent = Eq model => SomeComponent (Component name model action)
- class ToKey key where
- class ToView a where
- type ToViewAction a
- toView :: a -> View (ToViewAction a)
- type family ToViewAction a
- data View action
- = VNode NS MisoString (Maybe Key) [Attribute action] [View action]
- | VText MisoString
- | VTextRaw MisoString
- | VComp MisoString [Attribute action] (Maybe Key) SomeComponent
- (#>) :: JSM action -> model -> Effect model action
- (<#) :: model -> JSM action -> Effect model action
- batch :: [JSM action] -> Effect model action
- batchEff :: model -> [JSM action] -> Effect model action
- batch_ :: [JSM ()] -> Effect model action
- effectSub :: model -> (Sink action -> JSM ()) -> Effect model action
- for :: Foldable f => JSM (f action) -> Effect model action
- io :: JSM action -> Effect model action
- io_ :: JSM () -> Effect model action
- issue :: action -> Effect model action
- mapSub :: (a -> b) -> Sub a -> Sub b
- noEff :: model -> Effect model action
- runEffect :: Effect model action -> MisoString -> model -> (model, [Sink action -> JSM ()])
- scheduleIO :: JSM action -> Effect model action
- scheduleIOFor_ :: Foldable f => JSM (f action) -> Effect model action
- scheduleIO_ :: JSM () -> Effect model action
- scheduleSub :: (Sink action -> JSM ()) -> Effect model action
- withSink :: (Sink action -> JSM ()) -> Effect model action
- type Effect model action = EffectCore model action ()
- type Sink action = action -> JSM ()
- type Sub action = Sink action -> JSM ()
- type SubName = MisoString
- at :: [MisoString] -> (Value -> Parser a) -> Decoder a
- checkedDecoder :: Decoder Checked
- emptyDecoder :: Decoder ()
- keyInfoDecoder :: Decoder KeyInfo
- keycodeDecoder :: Decoder KeyCode
- pointerDecoder :: Decoder PointerEvent
- valueDecoder :: Decoder MisoString
- defaultEvents :: Map MisoString Capture
- defaultOptions :: Options
- dragEvents :: Map MisoString Capture
- keyboardEvents :: Map MisoString Capture
- mouseEvents :: Map MisoString Capture
- pointerEvents :: Map MisoString Capture
- data DecodeTarget
- = DecodeTarget [MisoString]
- | DecodeTargets [[MisoString]]
- data Decoder a = Decoder {
- decoder :: Value -> Parser a
- decodeAt :: DecodeTarget
- newtype AllowDrop = AllowDrop Bool
- type Capture = Bool
- newtype Checked = Checked Bool
- type Events = Map MisoString Capture
- newtype KeyCode = KeyCode Int
- data KeyInfo = KeyInfo {}
- data Options = Options {}
- data PointerEvent = PointerEvent {}
- data PointerType
- boolProp :: MisoString -> Bool -> Attribute action
- doubleProp :: MisoString -> Double -> Attribute action
- intProp :: MisoString -> Int -> Attribute action
- integerProp :: MisoString -> Integer -> Attribute action
- prop :: ToJSON a => MisoString -> a -> Attribute action
- stringProp :: MisoString -> String -> Attribute action
- textProp :: MisoString -> MisoString -> Attribute action
- a_ :: [Attribute action] -> [View action] -> View action
- abbr_ :: [Attribute action] -> [View action] -> View action
- address_ :: [Attribute action] -> [View action] -> View action
- area_ :: [Attribute action] -> [View action] -> View action
- article_ :: [Attribute action] -> [View action] -> View action
- aside_ :: [Attribute action] -> [View action] -> View action
- audio_ :: [Attribute action] -> [View action] -> View action
- b_ :: [Attribute action] -> [View action] -> View action
- base_ :: [Attribute action] -> [View action] -> View action
- bdi_ :: [Attribute action] -> [View action] -> View action
- bdo_ :: [Attribute action] -> [View action] -> View action
- blockquote_ :: [Attribute action] -> [View action] -> View action
- body_ :: [Attribute action] -> [View action] -> View action
- br_ :: [Attribute action] -> View action
- button_ :: [Attribute action] -> [View action] -> View action
- canvas_ :: [Attribute action] -> [View action] -> View action
- caption_ :: [Attribute action] -> [View action] -> View action
- cite_ :: [Attribute action] -> [View action] -> View action
- code_ :: [Attribute action] -> [View action] -> View action
- col_ :: [Attribute action] -> View action
- colgroup_ :: [Attribute action] -> [View action] -> View action
- datalist_ :: [Attribute action] -> [View action] -> View action
- dd_ :: [Attribute action] -> [View action] -> View action
- del_ :: [Attribute action] -> [View action] -> View action
- details_ :: [Attribute action] -> [View action] -> View action
- dfn_ :: [Attribute action] -> [View action] -> View action
- dialog_ :: [Attribute action] -> [View action] -> View action
- div_ :: [Attribute action] -> [View action] -> View action
- dl_ :: [Attribute action] -> [View action] -> View action
- doctype_ :: View action
- dt_ :: [Attribute action] -> [View action] -> View action
- em_ :: [Attribute action] -> [View action] -> View action
- embed_ :: [Attribute action] -> View action
- fencedframe_ :: [Attribute action] -> [View action] -> View action
- fieldset_ :: [Attribute action] -> [View action] -> View action
- figcaption_ :: [Attribute action] -> [View action] -> View action
- figure_ :: [Attribute action] -> [View action] -> View action
- footer_ :: [Attribute action] -> [View action] -> View action
- form :: [Attribute action] -> [View action] -> View action
- h1_ :: [Attribute action] -> [View action] -> View action
- h2_ :: [Attribute action] -> [View action] -> View action
- h3_ :: [Attribute action] -> [View action] -> View action
- h4_ :: [Attribute action] -> [View action] -> View action
- h5_ :: [Attribute action] -> [View action] -> View action
- h6_ :: [Attribute action] -> [View action] -> View action
- head_ :: [Attribute action] -> [View action] -> View action
- header_ :: [Attribute action] -> [View action] -> View action
- hgroup_ :: [Attribute action] -> [View action] -> View action
- hr_ :: [Attribute action] -> View action
- html_ :: [Attribute action] -> [View action] -> View action
- i_ :: [Attribute action] -> [View action] -> View action
- iframe_ :: [Attribute action] -> [View action] -> View action
- img_ :: [Attribute action] -> View action
- input_ :: [Attribute action] -> View action
- ins_ :: [Attribute action] -> [View action] -> View action
- kbd_ :: [Attribute action] -> [View action] -> View action
- label_ :: [Attribute action] -> [View action] -> View action
- legend_ :: [Attribute action] -> [View action] -> View action
- liKeyed_ :: Key -> [Attribute action] -> [View action] -> View action
- li_ :: [Attribute action] -> [View action] -> View action
- link_ :: [Attribute action] -> View action
- main_ :: [Attribute action] -> [View action] -> View action
- map_ :: [Attribute action] -> [View action] -> View action
- mark_ :: [Attribute action] -> [View action] -> View action
- menu_ :: [Attribute action] -> [View action] -> View action
- meta_ :: [Attribute action] -> View action
- meter_ :: [Attribute action] -> [View action] -> View action
- nav_ :: [Attribute action] -> [View action] -> View action
- nodeHtml :: MisoString -> [Attribute action] -> [View action] -> View action
- nodeHtmlKeyed :: MisoString -> Key -> [Attribute action] -> [View action] -> View action
- noscript_ :: [Attribute action] -> [View action] -> View action
- object_ :: [Attribute action] -> [View action] -> View action
- ol_ :: [Attribute action] -> [View action] -> View action
- optgroup_ :: [Attribute action] -> [View action] -> View action
- option_ :: [Attribute action] -> [View action] -> View action
- output_ :: [Attribute action] -> [View action] -> View action
- p_ :: [Attribute action] -> [View action] -> View action
- picture_ :: [Attribute action] -> [View action] -> View action
- pre_ :: [Attribute action] -> [View action] -> View action
- progress_ :: [Attribute action] -> [View action] -> View action
- q_ :: [Attribute action] -> [View action] -> View action
- rp_ :: [Attribute action] -> [View action] -> View action
- rt_ :: [Attribute action] -> [View action] -> View action
- ruby_ :: [Attribute action] -> [View action] -> View action
- s_ :: [Attribute action] -> [View action] -> View action
- samp_ :: [Attribute action] -> [View action] -> View action
- script_ :: [Attribute action] -> MisoString -> View action
- search_ :: [Attribute action] -> [View action] -> View action
- section_ :: [Attribute action] -> [View action] -> View action
- select_ :: [Attribute action] -> [View action] -> View action
- slot_ :: [Attribute action] -> [View action] -> View action
- small_ :: [Attribute action] -> [View action] -> View action
- source_ :: [Attribute action] -> View action
- span_ :: [Attribute action] -> [View action] -> View action
- strong_ :: [Attribute action] -> [View action] -> View action
- style_ :: [Attribute action] -> MisoString -> View action
- sub_ :: [Attribute action] -> [View action] -> View action
- summary_ :: [Attribute action] -> [View action] -> View action
- sup_ :: [Attribute action] -> [View action] -> View action
- table_ :: [Attribute action] -> [View action] -> View action
- tbody_ :: [Attribute action] -> [View action] -> View action
- td_ :: [Attribute action] -> [View action] -> View action
- template_ :: [Attribute action] -> [View action] -> View action
- textarea_ :: [Attribute action] -> [View action] -> View action
- tfoot_ :: [Attribute action] -> [View action] -> View action
- th_ :: [Attribute action] -> [View action] -> View action
- thead_ :: [Attribute action] -> [View action] -> View action
- time_ :: [Attribute action] -> [View action] -> View action
- trKeyed_ :: Key -> [Attribute action] -> [View action] -> View action
- tr_ :: [Attribute action] -> [View action] -> View action
- track_ :: [Attribute action] -> View action
- u_ :: [Attribute action] -> [View action] -> View action
- ul_ :: [Attribute action] -> [View action] -> View action
- var_ :: [Attribute action] -> [View action] -> View action
- video_ :: [Attribute action] -> [View action] -> View action
- wbr_ :: [Attribute action] -> View action
- on :: MisoString -> Decoder r -> (r -> action) -> Attribute action
- onBeforeCreated :: action -> Attribute action
- onBeforeDestroyed :: action -> Attribute action
- onBeforeMounted :: action -> Attribute action
- onBeforeUnmounted :: action -> Attribute action
- onBlur :: action -> Attribute action
- onChange :: (MisoString -> action) -> Attribute action
- onChecked :: (Checked -> action) -> Attribute action
- onClick :: action -> Attribute action
- onCreated :: action -> Attribute action
- onDestroyed :: action -> Attribute action
- onDoubleClick :: action -> Attribute action
- onDrag :: action -> Attribute action
- onDragEnd :: action -> Attribute action
- onDragEnter :: action -> Attribute action
- onDragLeave :: action -> Attribute action
- onDragOver :: action -> Attribute action
- onDragStart :: action -> Attribute action
- onDrop :: AllowDrop -> action -> Attribute action
- onFocus :: action -> Attribute action
- onInput :: (MisoString -> action) -> Attribute action
- onKeyDown :: (KeyCode -> action) -> Attribute action
- onKeyDownWithInfo :: (KeyInfo -> action) -> Attribute action
- onKeyPress :: (KeyCode -> action) -> Attribute action
- onKeyUp :: (KeyCode -> action) -> Attribute action
- onMounted :: action -> Attribute action
- onMountedWith :: (MisoString -> action) -> Attribute action
- onMouseDown :: action -> Attribute action
- onMouseEnter :: action -> Attribute action
- onMouseLeave :: action -> Attribute action
- onMouseOut :: action -> Attribute action
- onMouseOver :: action -> Attribute action
- onMouseUp :: action -> Attribute action
- onPointerCancel :: (PointerEvent -> action) -> Attribute action
- onPointerDown :: (PointerEvent -> action) -> Attribute action
- onPointerEnter :: (PointerEvent -> action) -> Attribute action
- onPointerLeave :: (PointerEvent -> action) -> Attribute action
- onPointerMove :: (PointerEvent -> action) -> Attribute action
- onPointerOut :: (PointerEvent -> action) -> Attribute action
- onPointerOver :: (PointerEvent -> action) -> Attribute action
- onPointerUp :: (PointerEvent -> action) -> Attribute action
- onSelect :: (MisoString -> action) -> Attribute action
- onSubmit :: action -> Attribute action
- onUnmounted :: action -> Attribute action
- onUnmountedWith :: (MisoString -> action) -> Attribute action
- onWithOptions :: Options -> MisoString -> Decoder r -> (r -> action) -> Attribute action
- acceptCharset_ :: MisoString -> Attribute action
- accept_ :: MisoString -> Attribute action
- action_ :: MisoString -> Attribute action
- align_ :: MisoString -> Attribute action
- alt_ :: MisoString -> Attribute action
- async_ :: MisoString -> Attribute action
- autocomplete_ :: Bool -> Attribute action
- autofocus_ :: Bool -> Attribute action
- autoplay_ :: Bool -> Attribute action
- autosave_ :: MisoString -> Attribute action
- charset_ :: MisoString -> Attribute action
- checked_ :: Bool -> Attribute action
- classList_ :: [(MisoString, Bool)] -> Attribute action
- class_ :: MisoString -> Attribute action
- cols_ :: MisoString -> Attribute action
- colspan_ :: MisoString -> Attribute action
- content_ :: MisoString -> Attribute action
- controls_ :: Bool -> Attribute action
- coords_ :: MisoString -> Attribute action
- data_ :: MisoString -> MisoString -> Attribute action
- defaultValue_ :: MisoString -> Attribute action
- default_ :: Bool -> Attribute action
- defer_ :: MisoString -> Attribute action
- disabled_ :: Bool -> Attribute action
- downloadAs_ :: MisoString -> Attribute action
- download_ :: MisoString -> Attribute action
- enctype_ :: MisoString -> Attribute action
- for_ :: MisoString -> Attribute action
- form_ :: MisoString -> Attribute action
- formation_ :: MisoString -> Attribute action
- headers_ :: MisoString -> Attribute action
- height_ :: MisoString -> Attribute action
- hidden_ :: Bool -> Attribute action
- href_ :: MisoString -> Attribute action
- hreflang_ :: MisoString -> Attribute action
- httpEquiv_ :: MisoString -> Attribute action
- id_ :: MisoString -> Attribute action
- ismap_ :: MisoString -> Attribute action
- kind_ :: MisoString -> Attribute action
- lang_ :: MisoString -> Attribute action
- language_ :: MisoString -> Attribute action
- list_ :: MisoString -> Attribute action
- loading_ :: MisoString -> Attribute action
- loop_ :: Bool -> Attribute action
- max_ :: MisoString -> Attribute action
- maxlength_ :: MisoString -> Attribute action
- media_ :: MisoString -> Attribute action
- method_ :: MisoString -> Attribute action
- min_ :: MisoString -> Attribute action
- minlength_ :: MisoString -> Attribute action
- multiple_ :: Bool -> Attribute action
- name_ :: MisoString -> Attribute action
- novalidate_ :: Bool -> Attribute action
- pattern_ :: MisoString -> Attribute action
- ping_ :: MisoString -> Attribute action
- placeholder_ :: MisoString -> Attribute action
- poster_ :: MisoString -> Attribute action
- preload_ :: MisoString -> Attribute action
- readonly_ :: Bool -> Attribute action
- ref_ :: MisoString -> Attribute action
- rel_ :: MisoString -> Attribute action
- required_ :: Bool -> Attribute action
- reversed_ :: MisoString -> Attribute action
- rows_ :: MisoString -> Attribute action
- rowspan_ :: MisoString -> Attribute action
- sandbox_ :: MisoString -> Attribute action
- scope_ :: MisoString -> Attribute action
- scoped_ :: MisoString -> Attribute action
- seamless_ :: MisoString -> Attribute action
- selected_ :: Bool -> Attribute action
- shape_ :: MisoString -> Attribute action
- size_ :: MisoString -> Attribute action
- src_ :: MisoString -> Attribute action
- srcdoc_ :: MisoString -> Attribute action
- srclang_ :: MisoString -> Attribute action
- step_ :: MisoString -> Attribute action
- target_ :: MisoString -> Attribute action
- title_ :: MisoString -> Attribute action
- type_ :: MisoString -> Attribute action
- usemap_ :: MisoString -> Attribute action
- value_ :: MisoString -> Attribute action
- width_ :: MisoString -> Attribute action
- wrap_ :: MisoString -> Attribute action
- node :: NS -> MisoString -> Maybe Key -> [Attribute action] -> [View action] -> View action
- rawHtml :: MisoString -> View action
- text :: MisoString -> View action
- textRaw :: MisoString -> View action
- newtype VTree = VTree {}
- data Attribute action
- = Property MisoString Value
- | Event (Sink action -> Object -> LogLevel -> Events -> JSM ())
- | Styles (Map MisoString MisoString)
- newtype Key = Key MisoString
- data NS
- class ToView a where
- type ToViewAction a
- toView :: a -> View (ToViewAction a)
- type family ToViewAction a
- data View action
- = VNode NS MisoString (Maybe Key) [Attribute action] [View action]
- | VText MisoString
- | VTextRaw MisoString
- | VComp MisoString [Attribute action] (Maybe Key) SomeComponent
- data HTML
- class ToHtml a where
- toHtml :: a -> ByteString
- route :: forall {k} (layout :: k) m a. HasRouter layout => Proxy layout -> RouteT layout (m -> a) -> (m -> URI) -> m -> Either RoutingError a
- class HasRouter (layout :: k) where
- type family RouteT (layout :: k) a
- data Router a
- data RoutingError = Fail
- run :: JSM () -> IO ()
- exception :: SomeException -> JSM JSVal
- data MisoException
- back :: JSM ()
- forward :: JSM ()
- getURI :: JSM URI
- go :: Int -> JSM ()
- pushURI :: URI -> JSM ()
- replaceURI :: URI -> JSM ()
- uriSub :: (URI -> action) -> Sub action
- arrowsSub :: (Arrows -> action) -> Sub action
- directionSub :: ([Int], [Int], [Int], [Int]) -> (Arrows -> action) -> Sub action
- keyboardSub :: (Set Int -> action) -> Sub action
- wasdSub :: (Arrows -> action) -> Sub action
- mouseSub :: (PointerEvent -> action) -> Sub action
- sseSub :: FromJSON msg => MisoString -> (SSE msg -> action) -> Sub action
- close :: JSM ()
- connect :: URL -> Protocols -> JSM ()
- getSocketState :: JSM SocketState
- send :: ToJSON a => a -> JSM ()
- websocketSub :: FromJSON m => URL -> Protocols -> (WebSocket m -> action) -> Sub action
- windowCoordsSub :: ((Int, Int) -> action) -> Sub action
- windowPointerMoveSub :: (PointerEvent -> action) -> Sub action
- windowSub :: MisoString -> Decoder r -> (r -> action) -> Sub action
- windowSubWithOptions :: Options -> MisoString -> Decoder r -> (r -> action) -> Sub action
- data Arrows = Arrows {}
- data SSE message
- = SSEMessage message
- | SSEClose
- | SSEError
- data CloseCode
- newtype Protocols = Protocols [MisoString]
- newtype Reason = Reason MisoString
- data SocketState
- = CONNECTING
- | OPEN
- | CLOSING
- | CLOSED
- newtype URL = URL MisoString
- newtype WasClean = WasClean Bool
- data WebSocket action
- data URI = URI {}
- clearLocalStorage :: JSM ()
- clearSessionStorage :: JSM ()
- getLocalStorage :: FromJSON model => MisoString -> JSM (Either String model)
- getSessionStorage :: FromJSON model => MisoString -> JSM (Either String model)
- localStorageLength :: JSM Int
- removeLocalStorage :: MisoString -> JSM ()
- removeSessionStorage :: MisoString -> JSM ()
- sessionStorageLength :: JSM Int
- setLocalStorage :: ToJSON model => MisoString -> model -> JSM ()
- setSessionStorage :: ToJSON model => MisoString -> model -> JSM ()
- fetchJSON :: FromJSON action => MisoString -> MisoString -> Maybe MisoString -> [(MisoString, MisoString)] -> (action -> JSM ()) -> (MisoString -> JSM ()) -> JSM ()
- conditionalViews :: Bool -> [View action] -> [View action]
- withFoldable :: Foldable t => t a -> (a -> b) -> [b]
- addStyle :: MisoString -> JSM ()
- addStyleSheet :: MisoString -> JSM ()
- alert :: MisoString -> JSM ()
- asyncCallback :: JSM () -> JSM Function
- blur :: MisoString -> JSM ()
- consoleError :: MisoString -> JSM ()
- consoleLog :: MisoString -> JSM ()
- consoleLog' :: JSVal -> JSM ()
- consoleWarn :: MisoString -> JSM ()
- focus :: MisoString -> JSM ()
- getElementById :: MisoString -> JSM JSVal
- newImage :: MisoString -> JSM Image
- now :: JSM Double
- reload :: JSM ()
- set :: ToJSVal v => MisoString -> v -> Object -> JSM ()
- syncCallback :: JSM () -> JSM Function
- syncCallback1 :: (JSVal -> JSM ()) -> JSM Function
- newtype Image = Image JSVal
- ask :: MonadReader r m => m r
- modify :: MonadState s m => (s -> s) -> m ()
- modify' :: MonadState s m => (s -> s) -> m ()
- get :: MonadState s m => m s
- gets :: MonadState s m => (s -> a) -> m a
- put :: MonadState s m => s -> m ()
- tell :: MonadWriter w m => w -> m ()
API
Entry
miso :: forall model (name :: Symbol) action. Eq model => (URI -> Component name model action) -> JSM () Source #
Runs an isomorphic miso application.
Assumes the pre-rendered DOM is already present.
Note: Uses mountPoint as the Component name.
Always mounts to <body>. Copies page into the virtual DOM.
(🍜) :: forall model (name :: Symbol) action. Eq model => (URI -> Component name model action) -> JSM () Source #
Alias for miso.
startComponent :: forall model (name :: Symbol) action. Eq model => Component name model action -> JSM () Source #
Runs a miso application
Initializes application at mountPoint (defaults to <body> when Nothing)
Sink
withSink :: (Sink action -> JSM ()) -> Effect 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
update FetchJSON = withSink $ \sink -> getJSON (sink . ReceivedJSON) (sink . HandleError)
type Sink action = action -> JSM () Source #
Function to asynchronously dispatch actions to the update function.
Sampling
sample :: forall (name :: Symbol) model action. KnownSymbol name => Component name model action -> JSM model Source #
Read-only access to another Component's model.
This function is safe to use when a child Component wishes access
a parent Components model state. Under this circumstance the parent
will always be mounted and available.
Otherwise, if a sibling or parent Component's model state is attempted
to be accessed. Then we throw a NotMountedException, in the case the
Component being accessed is not available.
sample' :: MisoString -> JSM model Source #
Like sample except used for dynamic Component where the component-id
has been retrieved via ask.
Message Passing
notify :: forall (name :: Symbol) model action. KnownSymbol name => Component name model action -> action -> JSM () Source #
Used for bidirectional communication between components.
Specify the mounted Component you'd like to target.
This function is used to send messages to Component that are mounted on
other parts of the DOM tree.
notify' :: MisoString -> action -> JSM () Source #
Like notify except used for dynamic Component where the component-id
has been retrieved via ask.
Subscription
type SubName = MisoString Source #
SubName
The name of a Sub (e.g. "websocket")
Effect
issue :: action -> Effect 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 model action Source #
Smart constructor for an Effect with multiple actions.
io_ :: JSM () -> Effect 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.
component :: forall (name :: Symbol) model action a. (Eq model, KnownSymbol name) => Component name model action -> View a Source #
Used in the view function to embed an Component into another Component
Use this function if you'd like send messages to this Component at name via
notify or to read the state of this Component via sample.
componentWith :: forall (name :: Symbol) model action a. (Eq model, KnownSymbol name) => Component name model action -> Maybe Key -> [Attribute a] -> View a Source #
Like component except it allows the specification of Key
and Attribute action.
componentWith_ :: Eq model => Component "" model action -> Maybe Key -> [Attribute a] -> View a Source #
Like component_ except it allows the specification of Key
and Attribute action. Note: the name parameter is () here.
This symbolizes the fact that the Component is dynamically generated
and it's component-id can only be known at runtime.
component_ :: Eq model => Component "" model action -> View a Source #
Like component, but uses a dynamically generated name (enforced via Component).
The component name is dynamically generated at runtime and available via ask.
This is for dynamic Component creation, where a mounted Component isn't necessarily
statically known. Use this during circumstances where a parent would like
to dynamically generate / destroy n-many children in response to user input.
Note: the name parameter is () here.
This symbolizes the fact that the Component is dynamically generated
and it's component-id can only be known at runtime.
defaultComponent :: forall model action (name :: Symbol). model -> (action -> Effect model action) -> (model -> View action) -> Component name model action Source #
Smart constructor for Component with sane defaults.
getMountPoint :: Maybe MisoString -> MisoString Source #
Convenience for extracting mount point
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 -> Object -> 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 |
|
data Component (name :: Symbol) model action Source #
Application entry point
Constructors
| Component | |
Fields
| |
Instances
| ToView (Component name model action) Source # | |||||
Defined in Miso.Types Associated Types
| |||||
| type ToViewAction (Component name model action) 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 |
Optional Logging for debugging miso internals (useful to see if prerendering is successful)
Constructors
| Off | |
| DebugPrerender | 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"
data SomeComponent Source #
Existential wrapper used to allow the nesting of Component in Component
Constructors
| Eq model => SomeComponent (Component name model action) |
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 |
Convenience class for using View
Associated Types
type ToViewAction a Source #
Methods
toView :: a -> View (ToViewAction a) Source #
Instances
| ToView (View action) Source # | |||||
Defined in Miso.Types Associated Types
| |||||
| ToView (Component name model action) Source # | |||||
Defined in Miso.Types Associated Types
| |||||
type family ToViewAction a Source #
Instances
| type ToViewAction (View action) Source # | |
Defined in Miso.Types | |
| type ToViewAction (Component name model action) Source # | |
Defined in Miso.Types | |
Core type for constructing a virtual DOM in Haskell
Constructors
| VNode NS MisoString (Maybe Key) [Attribute action] [View action] | |
| VText MisoString | |
| VTextRaw MisoString | |
| VComp MisoString [Attribute action] (Maybe Key) SomeComponent |
Instances
| Functor View Source # | |||||
| HasRouter (View a :: Type) Source # | View | ||||
| HasLink (View a :: Type) Source # | For constructing type-safe links | ||||
| IsString (View a) Source # |
| ||||
Defined in Miso.Types Methods fromString :: String -> View a # | |||||
| ToHtml (View a) Source # | Render a | ||||
Defined in Miso.Render Methods toHtml :: View a -> ByteString Source # | |||||
| ToHtml [View a] Source # | Render a | ||||
Defined in Miso.Render Methods toHtml :: [View a] -> ByteString Source # | |||||
| ToView (View action) Source # | |||||
Defined in Miso.Types Associated Types
| |||||
| type RouteT (View a :: Type) x Source # | |||||
Defined in Miso.Router | |||||
| type MkLink (View a :: Type) b Source # | |||||
Defined in Miso.Types | |||||
| type ToViewAction (View action) Source # | |||||
Defined in Miso.Types | |||||
Effect
(#>) :: JSM action -> model -> Effect model action infixr 0 Source #
Effect smart constructor, flipped
(<#) :: model -> JSM action -> Effect model action infixl 0 Source #
Smart constructor for an Effect with exactly one action.
batch :: [JSM action] -> Effect model action Source #
Smart constructor for an Effect with multiple actions.
io_ :: JSM () -> Effect 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.
issue :: action -> Effect 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
runEffect :: Effect model action -> MisoString -> model -> (model, [Sink action -> JSM ()]) Source #
Internal function used to unwrap an EffectCore
scheduleIOFor_ :: Foldable f => JSM (f action) -> Effect model action Source #
Deprecated: Please use for instead
scheduleSub :: (Sink action -> JSM ()) -> Effect model action Source #
Deprecated: Please use withSink instead
withSink :: (Sink action -> JSM ()) -> Effect 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
update FetchJSON = withSink $ \sink -> getJSON (sink . ReceivedJSON) (sink . HandleError)
type Effect model action = EffectCore model action () Source #
A monad for succinctly expressing model transitions in the update function.
Effect is a RWS, where the State abstracts over manually passing the model
around. It's also a Writer Monad, where the accumulator is a list of scheduled
IO actions. Multiple actions can be scheduled using tell
from the mtl library and a single action can be scheduled using io_.
An Effect represents the results of an update action.
It consists of the updated model and a list of subscriptions. Each Sub is
run in a new thread so there is no risk of accidentally blocking the
application.
Tip: use the Effect monad in combination with the stateful
lens
operators (all operators ending in "="). The following example assumes
the lenses field1, counter and field2 are in scope and that the
LambdaCase language extension is enabled:
myComponent = Component
{ update = \case
MyAction1 -> do
field1 .= value1
counter += 1
MyAction2 -> do
field2 %= f
io_ $ do
putStrLn "Hello"
putStrLn "World!"
, ...
}
type Sink action = action -> JSM () Source #
Function to asynchronously dispatch actions to the update function.
type SubName = MisoString Source #
SubName
The name of a Sub (e.g. "websocket")
Event
at :: [MisoString] -> (Value -> Parser a) -> Decoder a Source #
Smart constructor for building a Decoder.
checkedDecoder :: Decoder Checked Source #
Retrieves "checked" field in Decoder
emptyDecoder :: Decoder () Source #
Empty decoder for use with events like "click" that do not return any meaningful values
keyInfoDecoder :: Decoder KeyInfo Source #
Retrieves either "keyCode", "which" or "charCode" field in Decoder,
along with shift, ctrl, meta and alt.
keycodeDecoder :: Decoder KeyCode Source #
Retrieves either "keyCode", "which" or "charCode" field in Decoder
pointerDecoder :: Decoder PointerEvent Source #
Pointer decoder for use with events like "onpointerover"
valueDecoder :: Decoder MisoString Source #
Retrieves "value" field in Decoder
defaultEvents :: Map MisoString Capture Source #
Default delegated events
defaultOptions :: Options Source #
Default value for Options.
defaultOptions = Options { preventDefault = False, stopPropagation = False }dragEvents :: Map MisoString Capture Source #
Drag events
keyboardEvents :: Map MisoString Capture Source #
Keyboard events
mouseEvents :: Map MisoString Capture Source #
Mouse events
pointerEvents :: Map MisoString Capture Source #
Pointer events
data DecodeTarget Source #
Data type representing path (consisting of field names) within event object where a decoder should be applied.
Constructors
| DecodeTarget [MisoString] | Specify single path within Event object, where a decoder should be applied. |
| DecodeTargets [[MisoString]] | Specify multiple paths withing Event object, where decoding should be attempted. The first path where decoding suceeds is the one taken. |
Instances
| ToJSVal DecodeTarget Source # | |
Defined in Miso.Event.Decoder Methods toJSVal :: DecodeTarget -> JSM JSVal Source # toJSValListOf :: [DecodeTarget] -> JSM JSVal Source # | |
Decoder data type for parsing events
Related to using drop-related events
Capture
Used to determine if *capture* should be set when using addEventListener
https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#capture
Type used for Checkbox events.
Type used for Keyboard events.
See https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode#Browser_compatibility
Type useful for both KeyCode and additional key press information.
Constructors
| KeyInfo | |
Options for handling event propagation.
Constructors
| Options | |
Fields | |
Instances
| Generic Options Source # | |||||
Defined in Miso.Event.Types Associated Types
| |||||
| Show Options Source # | |||||
| Eq Options Source # | |||||
| ToJSVal Options Source # | |||||
| type Rep Options Source # | |||||
Defined in Miso.Event.Types type Rep Options = D1 ('MetaData "Options" "Miso.Event.Types" "miso-1.9.0.0-inplace" 'False) (C1 ('MetaCons "Options" 'PrefixI 'True) (S1 ('MetaSel ('Just "preventDefault") 'NoSourceUnpackedness 'NoSourceStrictness 'DecidedLazy) (Rec0 Bool) :*: S1 ('MetaSel ('Just "stopPropagation") 'NoSourceUnpackedness 'NoSourceStrictness 'DecidedLazy) (Rec0 Bool))) | |||||
data PointerEvent Source #
Type used for Pointer events. https://w3c.github.io/pointerevents
Constructors
| PointerEvent | |
Instances
| Show PointerEvent Source # | |
Defined in Miso.Event.Types Methods showsPrec :: Int -> PointerEvent -> ShowS # show :: PointerEvent -> String # showList :: [PointerEvent] -> ShowS # | |
| Eq PointerEvent Source # | |
Defined in Miso.Event.Types | |
data PointerType Source #
Instances
| FromJSON PointerType Source # | |
Defined in Miso.Event.Types Methods parseJSON :: Value -> Parser PointerType Source # parseJSONList :: Value -> Parser [PointerType] Source # | |
| Show PointerType Source # | |
Defined in Miso.Event.Types Methods showsPrec :: Int -> PointerType -> ShowS # show :: PointerType -> String # showList :: [PointerType] -> ShowS # | |
| Eq PointerType Source # | |
Defined in Miso.Event.Types | |
Property
doubleProp :: MisoString -> Double -> Attribute action Source #
Set field to Double value
integerProp :: MisoString -> Integer -> Attribute action Source #
Set field to Integer value
prop :: ToJSON a => MisoString -> a -> Attribute action Source #
prop k v is an attribute that will set the attribute k of the DOM
node associated with the vnode to v.
stringProp :: MisoString -> String -> Attribute action Source #
Set field to String value
textProp :: MisoString -> MisoString -> Attribute action Source #
Set field to Text value
Html
form :: [Attribute action] -> [View action] -> View action Source #
For usage in a real-world application with the onSubmit event.
view :: Model -> View action view model = form [ onSubmit NoOp ] [ input [ type_ "submit" ] ]
Note: onSubmit will use preventDefault = True. This will keep
the form from submitting to the server.
nodeHtmlKeyed :: MisoString -> Key -> [Attribute action] -> [View action] -> View action Source #
Construct a node with a Key
script_ :: [Attribute action] -> MisoString -> View action Source #
This takes the raw text to be put in the script tag.
That means that if any part of the text is not trusted there's a potential JavaScript injection. Read more at https://owasp.org/www-community/attacks/xss/
You can also easily shoot yourself in the foot with something like:
script_ [] "</script>"style_ :: [Attribute action] -> MisoString -> View action Source #
This takes the raw text to be put in the style tag.
That means that if any part of the text is not trusted there's a potential CSS injection. Read more at https://owasp.org/www-project-web-security-testing-guide/stable/4-Web_Application_Security_Testing/11-Client-side_Testing/05-Testing_for_CSS_Injection
You can also easily shoot yourself in the foot with something like:
style_ [] "</style>"on :: MisoString -> Decoder r -> (r -> action) -> Attribute action Source #
Convenience wrapper for onWithOptions defaultOptions.
let clickHandler = on "click" emptyDecoder $ \() -> Action in button_ [ clickHandler, class_ "add" ] [ text_ "+" ]
onBeforeCreated :: action -> Attribute action Source #
onBeforeCreated action is an event that gets called before the DOM element
is created on the DOM. The action is given the DOM element that was
removed from the DOM tree.
onBeforeDestroyed :: action -> Attribute action Source #
onBeforeDestroyed action is an event that gets called before the DOM element
is removed from the DOM. The action is given the DOM element that was
removed from the DOM tree.
onBeforeMounted :: action -> Attribute action Source #
onBeforeMounted action is an event that gets called before the actual DOM
element is created.
onBeforeUnmounted :: action -> Attribute action Source #
onBeforeUnmounted action is an event that gets called before the DOM element
is removed from the DOM.
onChange :: (MisoString -> action) -> Attribute action Source #
onCreated :: action -> Attribute action Source #
onCreated action is an event that gets called after the actual DOM
element is created.
onDestroyed :: action -> Attribute action Source #
onDestroyed action is an event that gets called after the DOM element
is removed from the DOM. The action is given the DOM element that was
removed from the DOM tree.
onDoubleClick :: action -> Attribute action Source #
onDragEnter :: action -> Attribute action Source #
onDragLeave :: action -> Attribute action Source #
onDragOver :: action -> Attribute action Source #
onDragStart :: action -> Attribute action Source #
onInput :: (MisoString -> action) -> Attribute action Source #
onKeyDownWithInfo :: (KeyInfo -> action) -> Attribute action Source #
onKeyPress :: (KeyCode -> action) -> Attribute action Source #
onMounted :: action -> Attribute action Source #
onMounted action is an event that gets called after the actual DOM
element is created.
onMountedWith :: (MisoString -> action) -> Attribute action Source #
onMountedWith action is an event that gets called after the actual DOM
element is created. It returns the component-id from the component.
Returning component-id is useful when creating Component dynamically.
This way the parent can maintain a Map of the child Component IDs. When
the parent Component wants to send a child Component a message it can use
notify'.
Use this or onMounted, but not both in the same [Attribute action] list.
onMouseDown :: action -> Attribute action Source #
onMouseEnter :: action -> Attribute action Source #
onMouseLeave :: action -> Attribute action Source #
onMouseOut :: action -> Attribute action Source #
onMouseOver :: action -> Attribute action Source #
onPointerCancel :: (PointerEvent -> action) -> Attribute action Source #
onPointerDown :: (PointerEvent -> action) -> Attribute action Source #
onPointerEnter :: (PointerEvent -> action) -> Attribute action Source #
onPointerLeave :: (PointerEvent -> action) -> Attribute action Source #
onPointerMove :: (PointerEvent -> action) -> Attribute action Source #
onPointerOut :: (PointerEvent -> action) -> Attribute action Source #
onPointerOver :: (PointerEvent -> action) -> Attribute action Source #
onPointerUp :: (PointerEvent -> action) -> Attribute action Source #
onSelect :: (MisoString -> action) -> Attribute action Source #
onUnmounted :: action -> Attribute action Source #
onUnmounted action is an event that gets called after the DOM element
is removed from the DOM.
onUnmountedWith :: (MisoString -> action) -> Attribute action Source #
onUnmounted action is an event that gets called after the DOM element
is removed from the DOM. It returns the component-id after the unmount call.
Returning component-id is useful when dynamically created Component need
to notify their parents about their own destruction.
This way the parent can maintain a Map of the child Component IDs. When
the parent Component wants to send a child Component a message it can use
notify'.
Use this or onUnmounted, but not both in the same [Attribute action] list.
onWithOptions :: Options -> MisoString -> Decoder r -> (r -> action) -> Attribute action Source #
onWithOptions opts eventName decoder toAction is an attribute
that will set the event handler of the associated DOM node to a function that
decodes its argument using decoder, converts it to an action
using toAction and then feeds that action back to the update function.
opts can be used to disable further event propagation.
let clickHandler = onWithOptions defaultOptions "click" emptyDecoder $ \() -> Action in button_ [ clickHandler, class_ "add" ] [ text_ "+" ]
acceptCharset_ :: MisoString -> Attribute action Source #
accept_ :: MisoString -> Attribute action Source #
action_ :: MisoString -> Attribute action Source #
align_ :: MisoString -> Attribute action Source #
alt_ :: MisoString -> Attribute action Source #
async_ :: MisoString -> Attribute action Source #
autocomplete_ :: Bool -> Attribute action Source #
autofocus_ :: Bool -> Attribute action Source #
Set "autofocus" property https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus
autosave_ :: MisoString -> Attribute action Source #
charset_ :: MisoString -> Attribute action Source #
classList_ :: [(MisoString, Bool)] -> Attribute action Source #
class_ :: MisoString -> Attribute action Source #
Set "className" property https://developer.mozilla.org/en-US/docs/Web/API/Element/className
cols_ :: MisoString -> Attribute action Source #
colspan_ :: MisoString -> Attribute action Source #
content_ :: MisoString -> Attribute action Source #
coords_ :: MisoString -> Attribute action Source #
data_ :: MisoString -> MisoString -> Attribute action Source #
Set "data-*" property https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/data-*
defaultValue_ :: MisoString -> Attribute action Source #
defer_ :: MisoString -> Attribute action Source #
downloadAs_ :: MisoString -> Attribute action Source #
download_ :: MisoString -> Attribute action Source #
enctype_ :: MisoString -> Attribute action Source #
for_ :: MisoString -> Attribute action Source #
form_ :: MisoString -> Attribute action Source #
formation_ :: MisoString -> Attribute action Source #
headers_ :: MisoString -> Attribute action Source #
height_ :: MisoString -> Attribute action Source #
href_ :: MisoString -> Attribute action Source #
hreflang_ :: MisoString -> Attribute action Source #
httpEquiv_ :: MisoString -> Attribute action Source #
id_ :: MisoString -> Attribute action Source #
ismap_ :: MisoString -> Attribute action Source #
kind_ :: MisoString -> Attribute action Source #
lang_ :: MisoString -> Attribute action Source #
language_ :: MisoString -> Attribute action Source #
list_ :: MisoString -> Attribute action Source #
loading_ :: MisoString -> Attribute action Source #
max_ :: MisoString -> Attribute action Source #
maxlength_ :: MisoString -> Attribute action Source #
media_ :: MisoString -> Attribute action Source #
method_ :: MisoString -> Attribute action Source #
min_ :: MisoString -> Attribute action Source #
minlength_ :: MisoString -> Attribute action Source #
name_ :: MisoString -> Attribute action Source #
novalidate_ :: Bool -> Attribute action Source #
pattern_ :: MisoString -> Attribute action Source #
ping_ :: MisoString -> Attribute action Source #
placeholder_ :: MisoString -> Attribute action Source #
poster_ :: MisoString -> Attribute action Source #
preload_ :: MisoString -> Attribute action Source #
ref_ :: MisoString -> Attribute action Source #
rel_ :: MisoString -> Attribute action Source #
reversed_ :: MisoString -> Attribute action Source #
rows_ :: MisoString -> Attribute action Source #
rowspan_ :: MisoString -> Attribute action Source #
sandbox_ :: MisoString -> Attribute action Source #
scope_ :: MisoString -> Attribute action Source #
scoped_ :: MisoString -> Attribute action Source #
seamless_ :: MisoString -> Attribute action Source #
shape_ :: MisoString -> Attribute action Source #
size_ :: MisoString -> Attribute action Source #
src_ :: MisoString -> Attribute action Source #
srcdoc_ :: MisoString -> Attribute action Source #
srclang_ :: MisoString -> Attribute action Source #
step_ :: MisoString -> Attribute action Source #
target_ :: MisoString -> Attribute action Source #
title_ :: MisoString -> Attribute action Source #
type_ :: MisoString -> Attribute action Source #
usemap_ :: MisoString -> Attribute action Source #
value_ :: MisoString -> Attribute action Source #
width_ :: MisoString -> Attribute action Source #
wrap_ :: MisoString -> Attribute action Source #
node :: NS -> MisoString -> Maybe Key -> [Attribute action] -> [View action] -> View action Source #
Create a new Miso.Html.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.
rawHtml :: MisoString -> View action Source #
text :: MisoString -> View action Source #
Create a new Text with the given content.
textRaw :: MisoString -> View action Source #
TextRaw creation. Don't use directly
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 -> Object -> LogLevel -> Events -> JSM ()) | |
| Styles (Map MisoString MisoString) |
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 |
Convenience class for using View
Associated Types
type ToViewAction a Source #
Methods
toView :: a -> View (ToViewAction a) Source #
Instances
| ToView (View action) Source # | |||||
Defined in Miso.Types Associated Types
| |||||
| ToView (Component name model action) Source # | |||||
Defined in Miso.Types Associated Types
| |||||
type family ToViewAction a Source #
Instances
| type ToViewAction (View action) Source # | |
Defined in Miso.Types | |
| type ToViewAction (Component name model action) Source # | |
Defined in Miso.Types | |
Core type for constructing a virtual DOM in Haskell
Constructors
| VNode NS MisoString (Maybe Key) [Attribute action] [View action] | |
| VText MisoString | |
| VTextRaw MisoString | |
| VComp MisoString [Attribute action] (Maybe Key) SomeComponent |
Instances
| Functor View Source # | |||||
| HasRouter (View a :: Type) Source # | View | ||||
| HasLink (View a :: Type) Source # | For constructing type-safe links | ||||
| IsString (View a) Source # |
| ||||
Defined in Miso.Types Methods fromString :: String -> View a # | |||||
| ToHtml (View a) Source # | Render a | ||||
Defined in Miso.Render Methods toHtml :: View a -> ByteString Source # | |||||
| ToHtml [View a] Source # | Render a | ||||
Defined in Miso.Render Methods toHtml :: [View a] -> ByteString Source # | |||||
| ToView (View action) Source # | |||||
Defined in Miso.Types Associated Types
| |||||
| type RouteT (View a :: Type) x Source # | |||||
Defined in Miso.Router | |||||
| type MkLink (View a :: Type) b Source # | |||||
Defined in Miso.Types | |||||
| type ToViewAction (View action) Source # | |||||
Defined in Miso.Types | |||||
HTML MimeType used for servant APIs
type Home = "home" :> Get '[HTML] (Component model action)
Instances
| Accept HTML Source # | text/html;charset=utf-8 |
Defined in Miso.Render | |
| ToHtml a => MimeRender HTML a Source # | Render HTML from a servant API |
Defined in Miso.Render Methods mimeRender :: Proxy HTML -> a -> ByteString Source # | |
Class for rendering HTML
Methods
toHtml :: a -> ByteString Source #
Instances
| ToHtml (View a) Source # | Render a |
Defined in Miso.Render Methods toHtml :: View a -> ByteString Source # | |
| ToHtml [View a] Source # | Render a |
Defined in Miso.Render Methods toHtml :: [View a] -> ByteString Source # | |
Router
route :: forall {k} (layout :: k) m a. HasRouter layout => Proxy layout -> RouteT layout (m -> a) -> (m -> URI) -> m -> Either RoutingError a Source #
Executes router This is most likely the function you want to use. See haskell-miso.orgsharedCommon.hs for usage.
class HasRouter (layout :: k) where Source #
This is similar to the HasServer class from servant-server.
It is the class responsible for making API combinators routable.
RouteT is used to build up the handler types. Router is returned.
Methods
mkRouter :: Proxy layout -> Proxy a -> RouteT layout a -> Router a Source #
Transform a mkRouter handler into a Router.
Instances
| HasRouter Raw Source # | Raw |
| HasRouter (View a :: Type) Source # | View |
| (HasRouter x, HasRouter y) => HasRouter (x :<|> y :: Type) Source # | Alternative |
| (HasRouter sublayout, KnownSymbol path) => HasRouter (path :> sublayout :: Type) Source # | Path |
| (HasRouter sublayout, FromHttpApiData x) => HasRouter (Capture sym x :> sublayout :: Type) Source # | Capture |
| HasRouter sublayout => HasRouter (Header sym x :> sublayout :: Type) Source # | Header |
| (HasRouter sublayout, KnownSymbol sym) => HasRouter (QueryFlag sym :> sublayout :: Type) Source # | QueryFlag |
| (HasRouter sublayout, FromHttpApiData x, KnownSymbol sym) => HasRouter (QueryParam sym x :> sublayout :: Type) Source # | QueryParam |
Defined in Miso.Router | |
| (HasRouter sublayout, FromHttpApiData x, KnownSymbol sym) => HasRouter (QueryParams sym x :> sublayout :: Type) Source # | QueryParams |
Defined in Miso.Router | |
| HasRouter (Verb m s c a :: Type) Source # | Verb |
type family RouteT (layout :: k) a Source #
Type family for route dispatch
Instances
| type RouteT Raw x Source # | |
Defined in Miso.Router | |
| type RouteT (View a :: Type) x Source # | |
Defined in Miso.Router | |
| type RouteT (x :<|> y :: Type) a Source # | |
| type RouteT (path :> sublayout :: Type) a Source # | |
Defined in Miso.Router | |
| type RouteT (Capture sym x :> sublayout :: Type) a Source # | |
| type RouteT (Header sym x :> sublayout :: Type) a Source # | |
| type RouteT (QueryFlag sym :> sublayout :: Type) a Source # | |
| type RouteT (QueryParam sym x :> sublayout :: Type) a Source # | |
Defined in Miso.Router | |
| type RouteT (QueryParams sym x :> sublayout :: Type) a Source # | |
Defined in Miso.Router | |
| type RouteT (Verb m s c a :: Type) x Source # | |
Defined in Miso.Router | |
data RoutingError Source #
When routing, the router may fail to match a location.
Constructors
| Fail |
Instances
| Show RoutingError Source # | |
Defined in Miso.Router Methods showsPrec :: Int -> RoutingError -> ShowS # show :: RoutingError -> String # showList :: [RoutingError] -> ShowS # | |
| Eq RoutingError Source # | |
Defined in Miso.Router | |
| Ord RoutingError Source # | |
Defined in Miso.Router Methods compare :: RoutingError -> RoutingError -> Ordering # (<) :: RoutingError -> RoutingError -> Bool # (<=) :: RoutingError -> RoutingError -> Bool # (>) :: RoutingError -> RoutingError -> Bool # (>=) :: RoutingError -> RoutingError -> Bool # max :: RoutingError -> RoutingError -> RoutingError # min :: RoutingError -> RoutingError -> RoutingError # | |
Run
run :: JSM () -> IO () Source #
Entry point for a miso application
When compiling with jsaddle on native platforms
run will start a web server for live reload
of your miso application.
When compiling to WASM use 'jsaddle-wasm'.
When compiling to JS no special package is required (simply the id function).
JSM becomes a type synonym for IO
Exception
exception :: SomeException -> JSM JSVal Source #
Exception handler
Used to catch Component mounting exceptions
action `catch` exception
data MisoException Source #
The MisoException type is used to catch Component-related mounting errors.
The two mounting errors that can occur during the lifetime of a miso application are
- Not Mounted Exception
This occurs if a user tries to call sample myComponent when myComponent is currently
not mounted on the DOM.
- Already Mounted Exception
It is a requirement that all Component be named uniquely
(this is to avoid runaway recursion during mounting).
If we detect a Component is attempting to be mounted twice
this exception will be raised.
Other exceptions can arise, but its up to the user to handle them in
the update function. All unhandled exceptions are caught in the event loop
and logged to the console with console.error()
Constructors
| NotMountedException MisoString | Thrown when a |
| AlreadyMountedException MisoString | Thrown when a |
Instances
| Exception MisoException Source # | |
Defined in Miso.Exception Methods toException :: MisoException -> SomeException # fromException :: SomeException -> Maybe MisoException # displayException :: MisoException -> String # backtraceDesired :: MisoException -> Bool # | |
| Show MisoException Source # | |
Defined in Miso.Exception Methods showsPrec :: Int -> MisoException -> ShowS # show :: MisoException -> String # showList :: [MisoException] -> ShowS # | |
| Eq MisoException Source # | |
Defined in Miso.Exception Methods (==) :: MisoException -> MisoException -> Bool # (/=) :: MisoException -> MisoException -> Bool # | |
Subscriptions
replaceURI :: URI -> JSM () Source #
Replaces current URI on stack
uriSub :: (URI -> action) -> Sub action Source #
Subscription for popstate events, from the History API
directionSub :: ([Int], [Int], [Int], [Int]) -> (Arrows -> action) -> Sub action Source #
Maps a specified list of keys to directions (up, down, left, right)
keyboardSub :: (Set Int -> action) -> Sub action Source #
Returns subscription for Keyboard.
The callback will be called with the Set of currently pressed keyCodes.
wasdSub :: (Arrows -> action) -> Sub action Source #
Maps Arrows onto a Keyboard subscription for directions (W+A+S+D keys)
mouseSub :: (PointerEvent -> action) -> Sub action Source #
Captures mouse coordinates as they occur and writes them to an event sink
Arguments
| :: FromJSON msg | |
| => MisoString | EventSource URL |
| -> (SSE msg -> action) | |
| -> Sub action |
Server-sent events Subscription
getSocketState :: JSM SocketState Source #
Retrieves current status of WebSocket
websocketSub :: FromJSON m => URL -> Protocols -> (WebSocket m -> action) -> Sub action Source #
WebSocket subscription
windowCoordsSub :: ((Int, Int) -> action) -> Sub action Source #
Captures window coordinates changes as they occur and writes them to an event sink
windowPointerMoveSub :: (PointerEvent -> action) -> Sub action Source #
window.addEventListener ("pointermove", (event) => handle(event))
A Sub to handle PointerEvents on window
windowSub :: MisoString -> Decoder r -> (r -> action) -> Sub action Source #
windowSub eventName decoder toAction provides a subscription
to listen to window level events.
windowSubWithOptions :: Options -> MisoString -> Decoder r -> (r -> action) -> Sub action Source #
windowSubWithOptions options eventName decoder toAction provides a
subscription to listen to window level events.
type for arrow keys currently pressed
- 37 left arrow ( x = -1 )
- 38 up arrow ( y = 1 )
- 39 right arrow ( x = 1 )
- 40 down arrow ( y = -1 )
Instances
Server-sent events data
Constructors
| SSEMessage message | |
| SSEClose | |
| SSEError |
Code corresponding to a closed connection https://developer.mozilla.org/en-US/docs/Web/API/CloseEvent
Constructors
| CLOSE_NORMAL | 1000, Normal closure; the connection successfully completed whatever purpose for which it was created. |
| CLOSE_GOING_AWAY | 1001, The endpoint is going away, either because of a server failure or because the browser is navigating away from the page that opened the connection. |
| CLOSE_PROTOCOL_ERROR | 1002, The endpoint is terminating the connection due to a protocol error. |
| CLOSE_UNSUPPORTED | 1003, The connection is being terminated because the endpoint received data of a type it cannot accept (for example, a textonly endpoint received binary data). |
| CLOSE_NO_STATUS | 1005, Reserved. Indicates that no status code was provided even though one was expected. |
| CLOSE_ABNORMAL | 1006, Reserved. Used to indicate that a connection was closed abnormally (that is, with no close frame being sent) when a status code is expected. |
| Unsupported_Data | 1007, The endpoint is terminating the connection because a message was received that contained inconsistent data (e.g., nonUTF8 data within a text message). |
| Policy_Violation | 1008, The endpoint is terminating the connection because it received a message that violates its policy. This is a generic status code, used when codes 1003 and 1009 are not suitable. |
| CLOSE_TOO_LARGE | 1009, The endpoint is terminating the connection because a data frame was received that is too large. |
| Missing_Extension | 1010, The client is terminating the connection because it expected the server to negotiate one or more extension, but the server didn't. |
| Internal_Error | 1011, The server is terminating the connection because it encountered an unexpected condition that prevented it from fulfilling the request. |
| Service_Restart | 1012, The server is terminating the connection because it is restarting. |
| Try_Again_Later | 1013, The server is terminating the connection due to a temporary condition, e.g. it is overloaded and is casting off some of its clients. |
| TLS_Handshake | 1015, Reserved. Indicates that the connection was closed due to a failure to perform a TLS handshake (e.g., the server certificate can't be verified). |
| OtherCode Int | OtherCode that is reserved and not in the range 0999 |
Instances
| Generic CloseCode Source # | |||||
Defined in Miso.WebSocket Associated Types
| |||||
| Show CloseCode Source # | |||||
| Eq CloseCode Source # | |||||
| FromJSVal CloseCode Source # | |||||
| ToJSVal CloseCode Source # | |||||
| type Rep CloseCode Source # | |||||
Defined in Miso.WebSocket type Rep CloseCode = D1 ('MetaData "CloseCode" "Miso.WebSocket" "miso-1.9.0.0-inplace" 'False) (((C1 ('MetaCons "CLOSE_NORMAL" 'PrefixI 'False) (U1 :: Type -> Type) :+: (C1 ('MetaCons "CLOSE_GOING_AWAY" 'PrefixI 'False) (U1 :: Type -> Type) :+: C1 ('MetaCons "CLOSE_PROTOCOL_ERROR" 'PrefixI 'False) (U1 :: Type -> Type))) :+: ((C1 ('MetaCons "CLOSE_UNSUPPORTED" 'PrefixI 'False) (U1 :: Type -> Type) :+: C1 ('MetaCons "CLOSE_NO_STATUS" 'PrefixI 'False) (U1 :: Type -> Type)) :+: (C1 ('MetaCons "CLOSE_ABNORMAL" 'PrefixI 'False) (U1 :: Type -> Type) :+: C1 ('MetaCons "Unsupported_Data" 'PrefixI 'False) (U1 :: Type -> Type)))) :+: (((C1 ('MetaCons "Policy_Violation" 'PrefixI 'False) (U1 :: Type -> Type) :+: C1 ('MetaCons "CLOSE_TOO_LARGE" 'PrefixI 'False) (U1 :: Type -> Type)) :+: (C1 ('MetaCons "Missing_Extension" 'PrefixI 'False) (U1 :: Type -> Type) :+: C1 ('MetaCons "Internal_Error" 'PrefixI 'False) (U1 :: Type -> Type))) :+: ((C1 ('MetaCons "Service_Restart" 'PrefixI 'False) (U1 :: Type -> Type) :+: C1 ('MetaCons "Try_Again_Later" 'PrefixI 'False) (U1 :: Type -> Type)) :+: (C1 ('MetaCons "TLS_Handshake" 'PrefixI 'False) (U1 :: Type -> Type) :+: C1 ('MetaCons "OtherCode" 'PrefixI 'False) (S1 ('MetaSel ('Nothing :: Maybe Symbol) 'NoSourceUnpackedness 'NoSourceStrictness 'DecidedLazy) (Rec0 Int)))))) | |||||
Reason for closed connection
Constructors
| Reason MisoString |
data SocketState Source #
SocketState corresponding to current WebSocket connection
Constructors
| CONNECTING | 0 |
| OPEN | 1 |
| CLOSING | 2 |
| CLOSED | 3 |
Instances
URL of Websocket server
Constructors
| URL MisoString |
Wether or not the connection closed was done so cleanly
data WebSocket action Source #
WebSocket connection messages
Constructors
| WebSocketMessage action | |
| WebSocketClose CloseCode WasClean Reason | |
| WebSocketOpen | |
| WebSocketError MisoString |
Represents a general universal resource identifier using its component parts.
For example, for the URI
foo://anonymous@www.haskell.org:42/ghc?query#frag
the components are:
Constructors
| URI | |
Instances
| FromJSON URI Source # | Since: aeson-2.2.0.0 | ||||
| FromJSONKey URI Source # | Since: aeson-2.2.0.0 | ||||
Defined in Data.Aeson.Types.FromJSON Methods | |||||
| ToJSON URI Source # | Since: aeson-2.2.0.0 | ||||
| ToJSONKey URI Source # | Since: aeson-2.2.0.0 | ||||
Defined in Data.Aeson.Types.ToJSON | |||||
| NFData URI Source # | |||||
Defined in Network.URI | |||||
| Data URI Source # | |||||
Defined in Network.URI Methods gfoldl :: (forall d b. Data d => c (d -> b) -> d -> c b) -> (forall g. g -> c g) -> URI -> c URI # gunfold :: (forall b r. Data b => c (b -> r) -> c r) -> (forall r. r -> c r) -> Constr -> c URI # dataTypeOf :: URI -> DataType # dataCast1 :: Typeable t => (forall d. Data d => c (t d)) -> Maybe (c URI) # dataCast2 :: Typeable t => (forall d e. (Data d, Data e) => c (t d e)) -> Maybe (c URI) # gmapT :: (forall b. Data b => b -> b) -> URI -> URI # gmapQl :: (r -> r' -> r) -> r -> (forall d. Data d => d -> r') -> URI -> r # gmapQr :: forall r r'. (r' -> r -> r) -> r -> (forall d. Data d => d -> r') -> URI -> r # gmapQ :: (forall d. Data d => d -> u) -> URI -> [u] # gmapQi :: Int -> (forall d. Data d => d -> u) -> URI -> u # gmapM :: Monad m => (forall d. Data d => d -> m d) -> URI -> m URI # gmapMp :: MonadPlus m => (forall d. Data d => d -> m d) -> URI -> m URI # gmapMo :: MonadPlus m => (forall d. Data d => d -> m d) -> URI -> m URI # | |||||
| Generic URI Source # | |||||
Defined in Network.URI Associated Types
| |||||
| Show URI Source # | |||||
| Eq URI Source # | |||||
| Ord URI Source # | |||||
| Lift URI Source # | |||||
| type Rep URI Source # | |||||
Defined in Network.URI type Rep URI = D1 ('MetaData "URI" "Network.URI" "network-uri-2.6.4.2-EJ2U5kfgADg5BdbDj7oONH" 'False) (C1 ('MetaCons "URI" 'PrefixI 'True) ((S1 ('MetaSel ('Just "uriScheme") 'NoSourceUnpackedness 'NoSourceStrictness 'DecidedLazy) (Rec0 String) :*: S1 ('MetaSel ('Just "uriAuthority") 'NoSourceUnpackedness 'NoSourceStrictness 'DecidedLazy) (Rec0 (Maybe URIAuth))) :*: (S1 ('MetaSel ('Just "uriPath") 'NoSourceUnpackedness 'NoSourceStrictness 'DecidedLazy) (Rec0 String) :*: (S1 ('MetaSel ('Just "uriQuery") 'NoSourceUnpackedness 'NoSourceStrictness 'DecidedLazy) (Rec0 String) :*: S1 ('MetaSel ('Just "uriFragment") 'NoSourceUnpackedness 'NoSourceStrictness 'DecidedLazy) (Rec0 String))))) | |||||
Storage
clearLocalStorage :: JSM () Source #
Clear local storage
clearLocalStorage removes all values from local storage.
clearSessionStorage :: JSM () Source #
Clear session storage
clearSessionStorage removes all values from session storage.
getLocalStorage :: FromJSON model => MisoString -> JSM (Either String model) Source #
Retrieve a value stored under given key in local storage
getSessionStorage :: FromJSON model => MisoString -> JSM (Either String model) Source #
Retrieve a value stored under given key in session storage
localStorageLength :: JSM Int Source #
Local storage length
localStorageLength returns the count of items in local storage
removeLocalStorage :: MisoString -> JSM () Source #
Removes an item from local storage
removeLocalStorage key removes the value of key.
removeSessionStorage :: MisoString -> JSM () Source #
Removes an item from session storage.
removeSessionStorage key removes the value of key.
sessionStorageLength :: JSM Int Source #
Session storage length
sessionStorageLength returns the count of items in session storage
setLocalStorage :: ToJSON model => MisoString -> model -> JSM () Source #
Set the value of a key in local storage.
setLocalStorage key value sets the value of key to value.
setSessionStorage :: ToJSON model => MisoString -> model -> JSM () Source #
Set the value of a key in session storage.
setSessionStorage key value sets the value of key to value.
Fetch
Arguments
| :: FromJSON action | |
| => MisoString | url |
| -> MisoString | method |
| -> Maybe MisoString | body |
| -> [(MisoString, MisoString)] | headers |
| -> (action -> JSM ()) | successful callback |
| -> (MisoString -> JSM ()) | errorful callback |
| -> JSM () |
Retrieve JSON via Fetch API
Basic GET of JSON using Fetch API, will be expanded upon.
See https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API
Util
conditionalViews :: Bool -> [View action] -> [View action] Source #
Hides the Views if the condition is False. Shows them when the condition
is True.
withFoldable :: Foldable t => t a -> (a -> b) -> [b] Source #
Generic map function, useful for creating Views from the elements of
some Foldable. Particularly handy for Maybe, as shown in the example
below.
view model =
div_ [] $
withFoldable (model ^. mSomeMaybeVal) $ \someVal ->
p_ [] [ text $ "Hey, look at this value: " <> ms (show someVal) ]
FFI
addStyle :: MisoString -> JSM () Source #
Appends a style_ element containing CSS to head_
addStyle "body { background-color: green; }"<head><style>body { background-color: green; }</style></head>addStyleSheet :: MisoString -> JSM () Source #
Appends a StyleSheet link_ element to head_
The link_ tag will contain a URL to a CSS file.
addStyleSheet "https://cdn.jsdelivr.net/npm/todomvc-common@1.0.5/base.min.css"
<head><link href="https://cdn.jsdelivr.net/npm/todomvc-common@1.0.5/base.min.css" ref="stylesheet"></head>
alert :: MisoString -> JSM () Source #
Calls the alert() function.
blur :: MisoString -> JSM () Source #
Fails silently if the element is not found.
Analogous to document.getElementById(id).blur()
consoleError :: MisoString -> JSM () Source #
Outputs an error message to the web console
See https://developer.mozilla.org/en-US/docs/Web/API/Console/error
Console logging of JavaScript strings.
consoleLog :: MisoString -> JSM () Source #
Outputs a message to the web console
See https://developer.mozilla.org/en-US/docs/Web/API/Console/log
Console logging of JavaScript strings.
consoleLog' :: JSVal -> JSM () Source #
Console-logging of JSVal
consoleWarn :: MisoString -> JSM () Source #
Outputs a warning message to the web console
See https://developer.mozilla.org/en-US/docs/Web/API/Console/warn
Console logging of JavaScript strings.
focus :: MisoString -> JSM () Source #
Fails silently if the element is not found.
Analogous to document.getElementById(id).focus().
getElementById :: MisoString -> JSM JSVal Source #
Returns an Element object representing the element whose id property matches the specified string.
See https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById
newImage :: MisoString -> JSM Image Source #
Smart constructor for building a Image w/ src attribute.
Retrieve high resolution time stamp
See https://developer.mozilla.org/en-US/docs/Web/API/Performance/now
syncCallback :: JSM () -> JSM Function Source #
Creates a synchronous callback function (no return value)
State management
ask :: MonadReader r m => m r #
Retrieves the monad environment.
modify :: MonadState s m => (s -> s) -> m () #
Monadic state transformer.
Maps an old state to a new state inside a state monad. The old state is thrown away.
Main> :t modify ((+1) :: Int -> Int)
modify (...) :: (MonadState Int a) => a ()This says that modify (+1) acts over any
Monad that is a member of the MonadState class,
with an Int state.
modify' :: MonadState s m => (s -> s) -> m () #
A variant of modify in which the computation is strict in the
new state.
Since: mtl-2.2
get :: MonadState s m => m s #
Return the state from the internals of the monad.
gets :: MonadState s m => (s -> a) -> m a #
Gets specific component of the state, using a projection function supplied.
put :: MonadState s m => s -> m () #
Replace the state inside the monad.
tell :: MonadWriter w m => w -> m () #
tell ww.