purescript-react / purescript-react-basic-dom

https://pursuit.purescript.org/packages/purescript-react-basic-dom
Apache License 2.0
11 stars 18 forks source link

Add a simplified version of the dom elements #41

Closed sigma-andex closed 2 years ago

sigma-andex commented 2 years ago

This adds a simplified version of the dom elements (insipired by how elmish-html does it) to make it less boilerplatey to work with simple html elements. I added them in a separate module to avoid backwards-compatibility issues. Basically, this change allows you to write elements like this:

import React.Basic.DOM.Simplified.Generated as R

-- chaining multiple elements
myDiv = 
  R.div { style: style1 }
     $ R.div { style: style2 }
     $ R.div { style: style3 }
     $ R.text "Bla"

--  A string is automatically converted to an jsx 
myDiv2 = 
  R.div { style: style1 } "text"

--- And one can still use arrays in case of multiple html elements:
myDiv3 = 
  R.div { style: style1 }
     $ R.div { style: style2 }
     $ R.div { style: style3 } [
           R.div {} "a"
        ,  R.div {} "b"
        ,  R.div {} "c"
      ]
sigma-andex commented 2 years ago

@mjrussell can you have a look at this?

mjrussell commented 2 years ago

Thanks for the ping, sorry this has lagged a bit. I think the overall proposal is good and it looks like a nice improvement. Definitely 👍 on a different module.

Does this have any changes when moving to React 18? I was hoping to try to get #44 in first and then merge this

sigma-andex commented 2 years ago

Does this have any changes when moving to React 18? I was hoping to try to get #44 in first and then merge this

As far as I can tell this PR is pretty much independent from #44