Skip to content

Conversation

sigma-andex
Copy link
Member

@sigma-andex sigma-andex commented Jun 24, 2022

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"
      ]

import Unsafe.Coerce (unsafeCoerce)

-- | Create a text node.
text :: String -> JSX
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This already exists, right?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes but I couldn't just import it because this would result in a cyclic dependency. I think I could just move the unsafeCoerce into the typeclass anyway

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done

@sigma-andex
Copy link
Member Author

@mjrussell can you have a look at this?

@mjrussell
Copy link
Member

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
Copy link
Member Author

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

@mjrussell mjrussell merged commit d149306 into purescript-react:main Jul 8, 2022
@sigma-andex sigma-andex deleted the add-simplified-dom branch July 8, 2022 17:30
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants