lucid-alpine-0.1.0.6: Use Alpine.js in your lucid templates
Safe HaskellNone
LanguageHaskell2010

Lucid.Alpine

Synopsis

Documentation

xData_ :: Text -> Attribute Source #

x-data Declare a new Alpine component and its data for a block of HTML

xBind_ Source #

Arguments

:: Text

Attribute name

-> Text 
-> Attribute 

x-bind Dynamically set HTML attributes on an element

xOn_ Source #

Arguments

:: Text

Event name

-> Text 
-> Attribute 

x-on Listen for browser events on an element

xText_ :: Text -> Attribute Source #

x-text Set the text content of an element

xHtml_ :: Text -> Attribute Source #

x-html Set the inner HTML of an element

xModel_ Source #

Arguments

:: [Text]

List of x-model modifiers

-> Text 
-> Attribute 

x-model Synchronize a piece of data with an input element

xShow_ :: Text -> Attribute Source #

x-show Toggle the visibility of an element

xTransition_ Source #

Arguments

:: Maybe Text

Transition directive

-> [Text]

List of x-transition modifiers

-> Text 
-> Attribute 

x-transition Transition an element in and out using CSS transitions

xFor_ :: Text -> Attribute Source #

x-for Repeat a block of HTML based on a data set

xIf_ :: Text -> Attribute Source #

x-if Conditionally add/remove a block of HTML from the page entirely.

xInit_ :: Text -> Attribute Source #

x-init Run code when an element is initialized by Alpine

xEffect_ :: Text -> Attribute Source #

x-effect Execute a script each time one of its dependancies change

xRef_ :: Text -> Attribute Source #

x-ref Reference elements directly by their specified keys using the $refs magic property

xCloak_ :: Attribute Source #

x-cloak Hide a block of HTML until after Alpine is finished initializing its contents

xIgnore_ :: Attribute Source #

x-ignore Prevent a block of HTML from being initialized by Alpine

useAlpine :: Monad m => HtmlT m () Source #

Use this value in your head_ tag to use Alpine.js in your lucid templates

useAlpineVersion :: Monad m => (Int, Int, Int) -> HtmlT m () Source #

Choose the version of Alpine.js to use using a 3-tuple representing semantic versioning

showT :: Show a => a -> Text Source #