search

mikesol / purescript-deku

A PureScript web UI framework
https://purescript-deku.surge.sh/
Apache License 2.0
123 stars 12 forks source link

How to set a custom attribute #113

Closed jerbaroo closed 5 months ago

jerbaroo commented 5 months ago

For example <div data-foo="bar">

jerbaroo commented 5 months ago

One answer is to define this function (which I think should exist in the Deku library):

attr
  :: forall r. String -> FRP.Poll.Poll String -> FRP.Poll.Poll (Deku.Attribute.Attribute a)
attr key= Functor.map
  (Deku.Attribute.unsafeAttribute <<< { key: key, value: _ } <<< Deku.Attribute.prop')

attr_ :: forall r. String -> String -> FRP.Poll.Poll (Deku.Attribute.Attribute a)
attr_ key = attr key <<< Applicative.pure

Then you can write:

    D.div
      [ attr_ "data-foo" "bar" ]
      [ text_ "hello" ]