Specular.Dom.Element

el' :: forall r a. TagName -> Array Prop -> RWidget r a -> RWidget r (Tuple Node a)

el :: forall r a. TagName -> Array Prop -> RWidget r a -> RWidget r a

el_ :: forall r a. TagName -> RWidget r a -> RWidget r a

newtype Prop

Constructors

• Prop (EffectFn2 Node DelayedEffects Unit)

Instances

• Semigroup Prop
• Monoid Prop

text :: forall r. String -> RWidget r Unit

dynText :: forall r. Dynamic String -> RWidget r Unit

attr :: AttrName -> AttrValue -> Prop

attrD :: AttrName -> Dynamic AttrValue -> Prop

attrWhen :: Boolean -> AttrName -> AttrValue -> Prop

attrUnless :: Boolean -> AttrName -> AttrValue -> Prop

attrWhenD :: Dynamic Boolean -> AttrName -> AttrValue -> Prop

attrUnlessD :: Dynamic Boolean -> AttrName -> AttrValue -> Prop

attrs :: Attrs -> Prop

Attach static attributes to the node.

attrsD :: Dynamic Attrs -> Prop

Attach a dynamically-changing map of attributes to the node.

The set of attributes must be distinct from the attributes set by other uses of attrs or attrsD on the same element.

attrsWhen :: Boolean -> Attrs -> Prop

attrsUnless :: Boolean -> Attrs -> Prop

attrsWhenD :: Dynamic Boolean -> Attrs -> Prop

attrsUnlessD :: Dynamic Boolean -> Attrs -> Prop

on :: EventType -> (Event -> Effect Unit) -> Prop

onClick :: (Event -> Effect Unit) -> Prop

onClick_ :: Effect Unit -> Prop

preventDefault :: Event -> Effect Unit

stopPropagation :: Event -> Effect Unit

valueD :: Dynamic String -> Prop

Attach dynamically-changing value property to an input element. The value can still be changed by user interaction.

Only works on <input> and <select> elements.

bindValueOnChange :: Ref String -> Prop

Set up a two-way binding between the value of an <input> element, and the given Ref.

The Ref will be updated on change event, i.e. at the end of user inteaction, not on every keystroke.

Only works on input elements.

bindValueOnInput :: Ref String -> Prop

Set up a two-way binding between the value of an <input> element, and the given Ref.

The Ref will be updated on input event, i.e. on every keystroke.

Only works on input elements.

checkedD :: Dynamic Boolean -> Prop

Attach dynamically-changing checked property to an input element. The value can still be changed by user interaction.

Only works on input type="checkbox" and type="radio" elements.

bindChecked :: Ref Boolean -> Prop

Set up a two-way binding between the checked of an <input> element, and the given Ref.

Only works on input type="checkbox" and type="radio" elements.

indeterminateD :: Dynamic Boolean -> Prop

Attach dynamically-changing indeterminate property to a checkbox element.

Only works on input type="checkbox" elements.

type ClassName = String

class_ :: ClassName -> Prop

Attach a single CSS class to the element.

Note: if using this property:

• the class attribute must not be used,
• the provided class name must be distinct from class names used in other properties from this module.

classes :: Array ClassName -> Prop

Attach an array of CSS classes to the element.

Note: if using this property:

• the class attribute must not be used,
• the provided class names must be distinct from class names used in other properties from this module.

classesD :: Dynamic (Array ClassName) -> Prop

Attach a dynamically-changing array of CSS classes to the element.

Note: if using this property:

• the class attribute must not be used,
• the provided class names must be distinct from class names used in other properties from this module.

classWhenD :: Dynamic Boolean -> ClassName -> Prop

Conditionally attach a CSS class to the element. The class will be present if the condition is true.

Note: if using this property:

• the class attribute must not be used,
• the provided class name must be distinct from class names used in other properties from this module.

classUnlessD :: Dynamic Boolean -> ClassName -> Prop

classUnlessD cond = classWhenD (not cond)

classWhen :: Boolean -> ClassName -> Prop

classUnless :: Boolean -> ClassName -> Prop

rawHtml :: forall m. MonadDomBuilder m => String -> m Unit