diff --git a/docs/React.md b/docs/React.md index 27b9177..6de9af3 100644 --- a/docs/React.md +++ b/docs/React.md @@ -26,18 +26,10 @@ data EventHandler :: * -> * An event handler. The type argument represents the type of the event. -#### `Disallowed` - -``` purescript -data Disallowed -``` - -This phantom type indicates that both read and write access to a resource are disallowed. - #### `Read` ``` purescript -data Read write +data Read :: ! ``` This phantom type indicates that read access to a resource is allowed. @@ -45,23 +37,23 @@ This phantom type indicates that read access to a resource is allowed. #### `Write` ``` purescript -data Write +data Write :: ! ``` This phantom type indicates that write access to a resource is allowed. -#### `Only` +#### `Disallowed` ``` purescript -data Only +type Disallowed = () :: # ! ``` -This phantom type indicates that only read access to a resource is allowed. +An access synonym which indicates that neither read nor write access are allowed. #### `ReadWrite` ``` purescript -type ReadWrite = Read Write +type ReadWrite = (read :: Read, write :: Write) ``` An access synonym which indicates that both read and write access are allowed. @@ -69,7 +61,7 @@ An access synonym which indicates that both read and write access are allowed. #### `ReadOnly` ``` purescript -type ReadOnly = Read Only +type ReadOnly = (read :: Read) ``` An access synonym which indicates that reads are allowed but writes are not. @@ -77,19 +69,17 @@ An access synonym which indicates that reads are allowed but writes are not. #### `ReactState` ``` purescript -data ReactState :: * -> * -> ! +data ReactState :: # ! -> ! ``` This effect indicates that a computation may read or write the component state. -The first type argument is either `ReadWrite`, `ReadOnly` or `Disallowed` dependeding on the context. - -The second type argument is the type of the state of the component. +The first type argument is a row of access types (`Read`, `Write`). #### `ReactProps` ``` purescript -data ReactProps :: * -> ! +data ReactProps :: ! ``` This effect indicates that a computation may read the component props. @@ -97,12 +87,12 @@ This effect indicates that a computation may read the component props. #### `ReactRefs` ``` purescript -data ReactRefs :: * -> ! +data ReactRefs :: # ! -> ! ``` This effect indicates that a computation may read the component refs. -The first type argument is either `ReadOnly` or `Disallowed` dependeding on the context. +The first type argument is a row of access types (`Read`, `Write`). #### `Refs` @@ -139,7 +129,7 @@ The type of keyboard events. #### `EventHandlerContext` ``` purescript -type EventHandlerContext eff props state result = Eff (props :: ReactProps props, refs :: ReactRefs ReadOnly, state :: ReactState ReadWrite state | eff) result +type EventHandlerContext eff props state result = Eff (props :: ReactProps, refs :: ReactRefs ReadOnly, state :: ReactState ReadWrite | eff) result ``` A function which handles events. @@ -147,7 +137,7 @@ A function which handles events. #### `Render` ``` purescript -type Render props state eff = ReactThis props state -> Eff (props :: ReactProps props, refs :: ReactRefs Disallowed, state :: ReactState ReadOnly state | eff) ReactElement +type Render props state eff = ReactThis props state -> Eff (props :: ReactProps, refs :: ReactRefs Disallowed, state :: ReactState ReadOnly | eff) ReactElement ``` A render function. @@ -155,7 +145,7 @@ A render function. #### `GetInitialState` ``` purescript -type GetInitialState props state eff = ReactThis props state -> Eff (props :: ReactProps props, state :: ReactState Disallowed state, refs :: ReactRefs Disallowed | eff) state +type GetInitialState props state eff = ReactThis props state -> Eff (props :: ReactProps, state :: ReactState Disallowed, refs :: ReactRefs Disallowed | eff) state ``` A get initial state function. @@ -163,7 +153,7 @@ A get initial state function. #### `ComponentWillMount` ``` purescript -type ComponentWillMount props state eff = ReactThis props state -> Eff (props :: ReactProps props, state :: ReactState ReadWrite state, refs :: ReactRefs Disallowed | eff) Unit +type ComponentWillMount props state eff = ReactThis props state -> Eff (props :: ReactProps, state :: ReactState ReadWrite, refs :: ReactRefs Disallowed | eff) Unit ``` A component will mount function. @@ -171,7 +161,7 @@ A component will mount function. #### `ComponentDidMount` ``` purescript -type ComponentDidMount props state eff = ReactThis props state -> Eff (props :: ReactProps props, state :: ReactState ReadWrite state, refs :: ReactRefs ReadOnly | eff) Unit +type ComponentDidMount props state eff = ReactThis props state -> Eff (props :: ReactProps, state :: ReactState ReadWrite, refs :: ReactRefs ReadOnly | eff) Unit ``` A component did mount function. @@ -179,7 +169,7 @@ A component did mount function. #### `ComponentWillReceiveProps` ``` purescript -type ComponentWillReceiveProps props state eff = ReactThis props state -> props -> Eff (props :: ReactProps props, state :: ReactState ReadWrite state, refs :: ReactRefs ReadOnly | eff) Unit +type ComponentWillReceiveProps props state eff = ReactThis props state -> props -> Eff (props :: ReactProps, state :: ReactState ReadWrite, refs :: ReactRefs ReadOnly | eff) Unit ``` A component will receive props function. @@ -187,7 +177,7 @@ A component will receive props function. #### `ShouldComponentUpdate` ``` purescript -type ShouldComponentUpdate props state eff = ReactThis props state -> props -> state -> Eff (props :: ReactProps props, state :: ReactState ReadWrite state, refs :: ReactRefs ReadOnly | eff) Boolean +type ShouldComponentUpdate props state eff = ReactThis props state -> props -> state -> Eff (props :: ReactProps, state :: ReactState ReadWrite, refs :: ReactRefs ReadOnly | eff) Boolean ``` A should component update function. @@ -195,7 +185,7 @@ A should component update function. #### `ComponentWillUpdate` ``` purescript -type ComponentWillUpdate props state eff = ReactThis props state -> props -> state -> Eff (props :: ReactProps props, state :: ReactState ReadWrite state, refs :: ReactRefs ReadOnly | eff) Unit +type ComponentWillUpdate props state eff = ReactThis props state -> props -> state -> Eff (props :: ReactProps, state :: ReactState ReadWrite, refs :: ReactRefs ReadOnly | eff) Unit ``` A component will update function. @@ -203,7 +193,7 @@ A component will update function. #### `ComponentDidUpdate` ``` purescript -type ComponentDidUpdate props state eff = ReactThis props state -> props -> state -> Eff (props :: ReactProps props, state :: ReactState ReadOnly state, refs :: ReactRefs ReadOnly | eff) Unit +type ComponentDidUpdate props state eff = ReactThis props state -> props -> state -> Eff (props :: ReactProps, state :: ReactState ReadOnly, refs :: ReactRefs ReadOnly | eff) Unit ``` A component did update function. @@ -211,7 +201,7 @@ A component did update function. #### `ComponentWillUnmount` ``` purescript -type ComponentWillUnmount props state eff = ReactThis props state -> Eff (props :: ReactProps props, state :: ReactState ReadOnly state, refs :: ReactRefs ReadOnly | eff) Unit +type ComponentWillUnmount props state eff = ReactThis props state -> Eff (props :: ReactProps, state :: ReactState ReadOnly, refs :: ReactRefs ReadOnly | eff) Unit ``` A component will unmount function. @@ -251,7 +241,7 @@ React class for components. #### `getProps` ``` purescript -getProps :: forall props state eff. ReactThis props state -> Eff (props :: ReactProps props | eff) props +getProps :: forall props state eff. ReactThis props state -> Eff (props :: ReactProps | eff) props ``` Read the component props. @@ -259,7 +249,7 @@ Read the component props. #### `getRefs` ``` purescript -getRefs :: forall props state write eff. ReactThis props state -> Eff (refs :: ReactRefs (Read write) | eff) Refs +getRefs :: forall props state access eff. ReactThis props state -> Eff (refs :: ReactRefs (read :: Read | access) | eff) Refs ``` Read the component refs. @@ -267,7 +257,7 @@ Read the component refs. #### `getChildren` ``` purescript -getChildren :: forall props state eff. ReactThis props state -> Eff (props :: ReactProps props | eff) (Array ReactElement) +getChildren :: forall props state eff. ReactThis props state -> Eff (props :: ReactProps | eff) (Array ReactElement) ``` Read the component children property. @@ -275,7 +265,7 @@ Read the component children property. #### `writeState` ``` purescript -writeState :: forall props state eff. ReactThis props state -> state -> Eff (state :: ReactState ReadWrite state | eff) state +writeState :: forall props state access eff. ReactThis props state -> state -> Eff (state :: ReactState (write :: Write | access) | eff) state ``` Write the component state. @@ -283,7 +273,7 @@ Write the component state. #### `readState` ``` purescript -readState :: forall props state write eff. ReactThis props state -> Eff (state :: ReactState (Read write) state | eff) state +readState :: forall props state access eff. ReactThis props state -> Eff (state :: ReactState (read :: Read | access) | eff) state ``` Read the component state. @@ -291,7 +281,7 @@ Read the component state. #### `transformState` ``` purescript -transformState :: forall props state eff. ReactThis props state -> (state -> state) -> Eff (state :: ReactState ReadWrite state | eff) state +transformState :: forall props state eff. ReactThis props state -> (state -> state) -> Eff (state :: ReactState ReadWrite | eff) state ``` Transform the component state by applying a function. diff --git a/src/React.purs b/src/React.purs index cfc0dea..980d660 100644 --- a/src/React.purs +++ b/src/React.purs @@ -6,10 +6,9 @@ module React , EventHandler() - , Disallowed() , Read() , Write() - , Only() + , Disallowed() , ReadWrite() , ReadOnly() @@ -74,38 +73,33 @@ foreign import data ReactThis :: * -> * -> * -- | An event handler. The type argument represents the type of the event. foreign import data EventHandler :: * -> * --- | This phantom type indicates that both read and write access to a resource are disallowed. -data Disallowed - -- | This phantom type indicates that read access to a resource is allowed. -data Read write +foreign import data Read :: ! -- | This phantom type indicates that write access to a resource is allowed. -data Write +foreign import data Write :: ! --- | This phantom type indicates that only read access to a resource is allowed. -data Only +-- | An access synonym which indicates that neither read nor write access are allowed. +type Disallowed = () :: # ! -- | An access synonym which indicates that both read and write access are allowed. -type ReadWrite = Read Write +type ReadWrite = (read :: Read, write :: Write) -- | An access synonym which indicates that reads are allowed but writes are not. -type ReadOnly = Read Only +type ReadOnly = (read :: Read) -- | This effect indicates that a computation may read or write the component state. -- | --- | The first type argument is either `ReadWrite`, `ReadOnly` or `Disallowed` dependeding on the context. --- | --- | The second type argument is the type of the state of the component. -foreign import data ReactState :: * -> * -> ! +-- | The first type argument is a row of access types (`Read`, `Write`). +foreign import data ReactState :: # ! -> ! -- | This effect indicates that a computation may read the component props. -foreign import data ReactProps :: * -> ! +foreign import data ReactProps :: ! -- | This effect indicates that a computation may read the component refs. -- | --- | The first type argument is either `ReadOnly` or `Disallowed` dependeding on the context. -foreign import data ReactRefs :: * -> ! +-- | The first type argument is a row of access types (`Read`, `Write`). +foreign import data ReactRefs :: # ! -> ! -- | The type of refs objects. foreign import data Refs :: * @@ -136,26 +130,26 @@ type KeyboardEvent = -- | A function which handles events. type EventHandlerContext eff props state result = - Eff ( props :: ReactProps props + Eff ( props :: ReactProps , refs :: ReactRefs ReadOnly - , state :: ReactState ReadWrite state + , state :: ReactState ReadWrite | eff ) result -- | A render function. type Render props state eff = ReactThis props state -> - Eff ( props :: ReactProps props + Eff ( props :: ReactProps , refs :: ReactRefs Disallowed - , state :: ReactState ReadOnly state + , state :: ReactState ReadOnly | eff ) ReactElement -- | A get initial state function. type GetInitialState props state eff = ReactThis props state -> - Eff ( props :: ReactProps props - , state :: ReactState Disallowed state + Eff ( props :: ReactProps + , state :: ReactState Disallowed , refs :: ReactRefs Disallowed | eff ) state @@ -163,8 +157,8 @@ type GetInitialState props state eff = -- | A component will mount function. type ComponentWillMount props state eff = ReactThis props state -> - Eff ( props :: ReactProps props - , state :: ReactState ReadWrite state + Eff ( props :: ReactProps + , state :: ReactState ReadWrite , refs :: ReactRefs Disallowed | eff ) Unit @@ -172,8 +166,8 @@ type ComponentWillMount props state eff = -- | A component did mount function. type ComponentDidMount props state eff = ReactThis props state -> - Eff ( props :: ReactProps props - , state :: ReactState ReadWrite state + Eff ( props :: ReactProps + , state :: ReactState ReadWrite , refs :: ReactRefs ReadOnly | eff ) Unit @@ -182,8 +176,8 @@ type ComponentDidMount props state eff = type ComponentWillReceiveProps props state eff = ReactThis props state -> props -> - Eff ( props :: ReactProps props - , state :: ReactState ReadWrite state + Eff ( props :: ReactProps + , state :: ReactState ReadWrite , refs :: ReactRefs ReadOnly | eff ) Unit @@ -193,8 +187,8 @@ type ShouldComponentUpdate props state eff = ReactThis props state -> props -> state -> - Eff ( props :: ReactProps props - , state :: ReactState ReadWrite state + Eff ( props :: ReactProps + , state :: ReactState ReadWrite , refs :: ReactRefs ReadOnly | eff ) Boolean @@ -204,8 +198,8 @@ type ComponentWillUpdate props state eff = ReactThis props state -> props -> state -> - Eff ( props :: ReactProps props - , state :: ReactState ReadWrite state + Eff ( props :: ReactProps + , state :: ReactState ReadWrite , refs :: ReactRefs ReadOnly | eff ) Unit @@ -215,8 +209,8 @@ type ComponentDidUpdate props state eff = ReactThis props state -> props -> state -> - Eff ( props :: ReactProps props - , state :: ReactState ReadOnly state + Eff ( props :: ReactProps + , state :: ReactState ReadOnly , refs :: ReactRefs ReadOnly | eff ) Unit @@ -224,8 +218,8 @@ type ComponentDidUpdate props state eff = -- | A component will unmount function. type ComponentWillUnmount props state eff = ReactThis props state -> - Eff ( props :: ReactProps props - , state :: ReactState ReadOnly state + Eff ( props :: ReactProps + , state :: ReactState ReadOnly , refs :: ReactRefs ReadOnly | eff ) Unit @@ -267,22 +261,22 @@ spec' getInitialState renderFn = foreign import data ReactClass :: * -> * -- | Read the component props. -foreign import getProps :: forall props state eff. ReactThis props state -> Eff (props :: ReactProps props | eff) props +foreign import getProps :: forall props state eff. ReactThis props state -> Eff (props :: ReactProps | eff) props -- | Read the component refs. -foreign import getRefs :: forall props state write eff. ReactThis props state -> Eff (refs :: ReactRefs (Read write) | eff) Refs +foreign import getRefs :: forall props state access eff. ReactThis props state -> Eff (refs :: ReactRefs (read :: Read | access) | eff) Refs -- | Read the component children property. -foreign import getChildren :: forall props state eff. ReactThis props state -> Eff (props :: ReactProps props | eff) (Array ReactElement) +foreign import getChildren :: forall props state eff. ReactThis props state -> Eff (props :: ReactProps | eff) (Array ReactElement) -- | Write the component state. -foreign import writeState :: forall props state eff. ReactThis props state -> state -> Eff (state :: ReactState ReadWrite state | eff) state +foreign import writeState :: forall props state access eff. ReactThis props state -> state -> Eff (state :: ReactState (write :: Write | access) | eff) state -- | Read the component state. -foreign import readState :: forall props state write eff. ReactThis props state -> Eff (state :: ReactState (Read write) state | eff) state +foreign import readState :: forall props state access eff. ReactThis props state -> Eff (state :: ReactState (read :: Read | access) | eff) state -- | Transform the component state by applying a function. -transformState :: forall props state eff. ReactThis props state -> (state -> state) -> Eff (state :: ReactState ReadWrite state | eff) state +transformState :: forall props state eff. ReactThis props state -> (state -> state) -> Eff (state :: ReactState ReadWrite | eff) state transformState ctx f = do state <- readState ctx writeState ctx $ f state diff --git a/test/Main.purs b/test/Main.purs index 271eeba..32c266e 100644 --- a/test/Main.purs +++ b/test/Main.purs @@ -5,7 +5,6 @@ import Prelude import Control.Monad.Eff import Control.Monad.Eff.Console -import Data.Maybe (Maybe(..)) import Data.Maybe.Unsafe (fromJust) import Data.Nullable (toMaybe) @@ -29,6 +28,7 @@ foreign import interval :: forall eff a. Eff eff a -> Eff eff Unit +hello :: forall props. ReactClass { name :: String | props } hello = createClass $ spec unit \ctx -> do props <- getProps ctx return $ D.h1 [ P.className "Hello" @@ -38,6 +38,7 @@ hello = createClass $ spec unit \ctx -> do , D.text props.name ] +counter :: forall props. ReactClass props counter = createClass counterSpec where counterSpec = (spec 0 render) @@ -58,7 +59,8 @@ counter = createClass counterSpec , D.text " Click me to increment!" ] -main = body' >>= render ui +main :: forall eff. Eff (dom :: DOM | eff) Unit +main = void (body' >>= render ui) where ui :: ReactElement ui = D.div' [ createFactory hello { name: "World" } @@ -69,7 +71,7 @@ main = body' >>= render ui ] ] - body' :: forall eff. Eff (dom :: DOM | eff) Element + body' :: Eff (dom :: DOM | eff) Element body' = do win <- window doc <- document win