purescript-react / purescript-react-basic-hooks

An implementation of React hooks on top of purescript-react-basic
https://pursuit.purescript.org/packages/purescript-react-basic-hooks/
Apache License 2.0
198 stars 31 forks source link

Array of JSX is not allowed #74

Open avi892nash opened 3 months ago

avi892nash commented 3 months ago

The type of component function does not allow to create react component with Array JSX return.

This should get compile, because react library allowes this syntax.

mkCounter :: Component Int
mkCounter = do
  component "Counter" \initialValue -> React.do
    counter /\ setCounter <- useState initialValue

    pure
      $ [ R.button
          { onClick: handler_ do
              setCounter (_ + 1)
          , children:
              [ R.text $ "Increment: " <> show counter ]
          }
          ]
pete-murphy commented 3 months ago

Yeah Component is just a type alias

type Component props = Effect (props -> JSX)

so if you have an Array JSX that you want to return, the recommendation is to use fragment :: Array JSX -> JSX https://pursuit.purescript.org/packages/purescript-react-basic/17.0.0/docs/React.Basic#v:fragment