[RFC] Support for react native web

[zomars]

Any plans to implement this? As for now I'm getting this error:

./node_modules/react-native-clean-form/src/Select.js
Module parse failed: Unexpected token (102:6)
You may need an appropriate loader to handle this file type.
|       valueKey,
|       theme,
|       ...rest
|     } = this.props
|     const { showSelector, value } = this.state

I think this is a transpilation issue similar to this one.

[zomars]

Trying to dig deeper it seems that webpack is complaining of spread operators:

Full console log:

ActionsContainer.js:15 Uncaught Error: Module parse failed: Unexpected token (50:68)
You may need an appropriate loader to handle this file type.
| 
| const Button = props => {
|   const { children : label, icon, iconPlacement, submitting, theme, ...rest } = props
| 
|   const Touchable = Platform.OS === 'android'
    at Object../node_modules/react-native-clean-form/src/Button.js (ActionsContainer.js:15)
    at __webpack_require__ (bootstrap 78dc8ab288a34ff8d654:678)
    at fn (bootstrap 78dc8ab288a34ff8d654:88)
    at Object../node_modules/react-native-clean-form/index.js (index.js:1)
    at __webpack_require__ (bootstrap 78dc8ab288a34ff8d654:678)
    at fn (bootstrap 78dc8ab288a34ff8d654:88)
    at Object../src/components/ClientForm.js (Button.js:42)
    at __webpack_require__ (bootstrap 78dc8ab288a34ff8d654:678)
    at fn (bootstrap 78dc8ab288a34ff8d654:88)
    at Object../src/containers/CreateClient.js (ClientsTable.js:120)
    at __webpack_require__ (bootstrap 78dc8ab288a34ff8d654:678)
    at fn (bootstrap 78dc8ab288a34ff8d654:88)
    at Object../src/containers/CreateView.js (CreateOrder.js:28)
    at __webpack_require__ (bootstrap 78dc8ab288a34ff8d654:678)
    at fn (bootstrap 78dc8ab288a34ff8d654:88)
    at Object../src/App.js (fetch.js:461)
    at __webpack_require__ (bootstrap 78dc8ab288a34ff8d654:678)
    at fn (bootstrap 78dc8ab288a34ff8d654:88)
    at Object../src/index.js (index.js:1)
    at __webpack_require__ (bootstrap 78dc8ab288a34ff8d654:678)
    at fn (bootstrap 78dc8ab288a34ff8d654:88)
    at Object.0 (configureStore.js:13)
    at __webpack_require__ (bootstrap 78dc8ab288a34ff8d654:678)
    at ./node_modules/ansi-regex/index.js.module.exports (bootstrap 78dc8ab288a34ff8d654:724)
    at bootstrap 78dc8ab288a34ff8d654:724
./node_modules/react-native-clean-form/src/Button.js @ ActionsContainer.js:15
__webpack_require__ @ bootstrap 78dc8ab288a34ff8d654:678
fn @ bootstrap 78dc8ab288a34ff8d654:88
./node_modules/react-native-clean-form/index.js @ index.js:1
__webpack_require__ @ bootstrap 78dc8ab288a34ff8d654:678
fn @ bootstrap 78dc8ab288a34ff8d654:88
./src/components/ClientForm.js @ Button.js:42
__webpack_require__ @ bootstrap 78dc8ab288a34ff8d654:678
fn @ bootstrap 78dc8ab288a34ff8d654:88
./src/containers/CreateClient.js @ ClientsTable.js:120
__webpack_require__ @ bootstrap 78dc8ab288a34ff8d654:678
fn @ bootstrap 78dc8ab288a34ff8d654:88
./src/containers/CreateView.js @ CreateOrder.js:28
__webpack_require__ @ bootstrap 78dc8ab288a34ff8d654:678
fn @ bootstrap 78dc8ab288a34ff8d654:88
./src/App.js @ fetch.js:461
__webpack_require__ @ bootstrap 78dc8ab288a34ff8d654:678
fn @ bootstrap 78dc8ab288a34ff8d654:88
./src/index.js @ index.js:1
__webpack_require__ @ bootstrap 78dc8ab288a34ff8d654:678
fn @ bootstrap 78dc8ab288a34ff8d654:88
0 @ configureStore.js:13
__webpack_require__ @ bootstrap 78dc8ab288a34ff8d654:678
./node_modules/ansi-regex/index.js.module.exports @ bootstrap 78dc8ab288a34ff8d654:724
(anonymous) @ bootstrap 78dc8ab288a34ff8d654:724
index.js:2177 ./node_modules/react-native-clean-form/src/Select.js
Module parse failed: Unexpected token (102:6)
You may need an appropriate loader to handle this file type.
|       valueKey,
|       theme,
|       ...rest
|     } = this.props
|     const { showSelector, value } = this.state
__stack_frame_overlay_proxy_console__ @ index.js:2177
handleErrors @ webpackHotDevClient.js:176
./node_modules/react-dev-utils/webpackHotDevClient.js.connection.onmessage @ webpackHotDevClient.js:209
./node_modules/sockjs-client/lib/event/eventtarget.js.EventTarget.dispatchEvent @ eventtarget.js:51
(anonymous) @ main.js:274
./node_modules/sockjs-client/lib/main.js.SockJS._transportMessage @ main.js:272
./node_modules/sockjs-client/lib/event/emitter.js.EventEmitter.emit @ emitter.js:50
WebSocketTransport.ws.onmessage @ websocket.js:35
index.js:2177 ./node_modules/react-native-clean-form/src/redux-form/createInputs.js
Module parse failed: Unexpected token (13:44)
You may need an appropriate loader to handle this file type.
| 
| const createInputs = inputCreator => {
|   const renderInput = ({ input: { onChange, ...restInput }, placeholder}) => (
|     <InputRenderer onChangeText={onChange} placeholder={placeholder} {...restInput} />
|   )
__stack_frame_overlay_proxy_console__ @ index.js:2177
handleErrors @ webpackHotDevClient.js:176
./node_modules/react-dev-utils/webpackHotDevClient.js.connection.onmessage @ webpackHotDevClient.js:209
./node_modules/sockjs-client/lib/event/eventtarget.js.EventTarget.dispatchEvent @ eventtarget.js:51
(anonymous) @ main.js:274
./node_modules/sockjs-client/lib/main.js.SockJS._transportMessage @ main.js:272
./node_modules/sockjs-client/lib/event/emitter.js.EventEmitter.emit @ emitter.js:50
WebSocketTransport.ws.onmessage @ websocket.js:35
index.js:2177 ./node_modules/react-native-clean-form/src/Fieldset.js
Module parse failed: Unexpected token (18:31)
You may need an appropriate loader to handle this file type.
| }
| 
| const FieldsetLabel = props => <View><FieldsetLabelText>{ props.children }</FieldsetLabelText></View>
| 
| const FieldsetWrapper = styled.View`
__stack_frame_overlay_proxy_console__ @ index.js:2177
handleErrors @ webpackHotDevClient.js:176
./node_modules/react-dev-utils/webpackHotDevClient.js.connection.onmessage @ webpackHotDevClient.js:209
./node_modules/sockjs-client/lib/event/eventtarget.js.EventTarget.dispatchEvent @ eventtarget.js:51
(anonymous) @ main.js:274
./node_modules/sockjs-client/lib/main.js.SockJS._transportMessage @ main.js:272
./node_modules/sockjs-client/lib/event/emitter.js.EventEmitter.emit @ emitter.js:50
WebSocketTransport.ws.onmessage @ websocket.js:35
index.js:2177 ./node_modules/react-native-clean-form/src/redux-form/createInputCreator.js
Module parse failed: Unexpected token (20:38)
You may need an appropriate loader to handle this file type.
| 
| const render = renderComponent => props => {
|   const { border, input : { onChange, ...restInput }, label, inlineLabel, theme, meta: { touched, error } } = props
| 
|   return (
__stack_frame_overlay_proxy_console__ @ index.js:2177
handleErrors @ webpackHotDevClient.js:176
./node_modules/react-dev-utils/webpackHotDevClient.js.connection.onmessage @ webpackHotDevClient.js:209
./node_modules/sockjs-client/lib/event/eventtarget.js.EventTarget.dispatchEvent @ eventtarget.js:51
(anonymous) @ main.js:274
./node_modules/sockjs-client/lib/main.js.SockJS._transportMessage @ main.js:272
./node_modules/sockjs-client/lib/event/emitter.js.EventEmitter.emit @ emitter.js:50
WebSocketTransport.ws.onmessage @ websocket.js:35
index.js:2177 ./node_modules/react-native-clean-form/src/Form.js
Module parse failed: Unexpected token (24:22)
You may need an appropriate loader to handle this file type.
| 
|   render() {
|     const { children, ...rest } = this.props
| 
|     return (
__stack_frame_overlay_proxy_console__ @ index.js:2177
handleErrors @ webpackHotDevClient.js:176
./node_modules/react-dev-utils/webpackHotDevClient.js.connection.onmessage @ webpackHotDevClient.js:209
./node_modules/sockjs-client/lib/event/eventtarget.js.EventTarget.dispatchEvent @ eventtarget.js:51
(anonymous) @ main.js:274
./node_modules/sockjs-client/lib/main.js.SockJS._transportMessage @ main.js:272
./node_modules/sockjs-client/lib/event/emitter.js.EventEmitter.emit @ emitter.js:50
WebSocketTransport.ws.onmessage @ websocket.js:35
index.js:2177 ./node_modules/react-native-clean-form/src/Label.js
Module parse failed: Unexpected token (30:4)
You may need an appropriate loader to handle this file type.
| 
|   return (
|     <LabelWrapper inlineLabel={inlineLabel} theme={theme}>
|       <LabelText inlineLabel={inlineLabel} theme={theme} >{ children }</LabelText>
|     </LabelWrapper>
__stack_frame_overlay_proxy_console__ @ index.js:2177
handleErrors @ webpackHotDevClient.js:176
./node_modules/react-dev-utils/webpackHotDevClient.js.connection.onmessage @ webpackHotDevClient.js:209
./node_modules/sockjs-client/lib/event/eventtarget.js.EventTarget.dispatchEvent @ eventtarget.js:51
(anonymous) @ main.js:274
./node_modules/sockjs-client/lib/main.js.SockJS._transportMessage @ main.js:272
./node_modules/sockjs-client/lib/event/emitter.js.EventEmitter.emit @ emitter.js:50
WebSocketTransport.ws.onmessage @ websocket.js:35
index.js:2177 ./node_modules/react-native-clean-form/src/Button.js
Module parse failed: Unexpected token (50:68)
You may need an appropriate loader to handle this file type.
| 
| const Button = props => {
|   const { children : label, icon, iconPlacement, submitting, theme, ...rest } = props
| 
|   const Touchable = Platform.OS === 'android'
__stack_frame_overlay_proxy_console__ @ index.js:2177
handleErrors @ webpackHotDevClient.js:176
./node_modules/react-dev-utils/webpackHotDevClient.js.connection.onmessage @ webpackHotDevClient.js:209
./node_modules/sockjs-client/lib/event/eventtarget.js.EventTarget.dispatchEvent @ eventtarget.js:51
(anonymous) @ main.js:274
./node_modules/sockjs-client/lib/main.js.SockJS._transportMessage @ main.js:272
./node_modules/sockjs-client/lib/event/emitter.js.EventEmitter.emit @ emitter.js:50
WebSocketTransport.ws.onmessage @ websocket.js:35
index.js:2177 ./node_modules/react-native-clean-form/src/FormGroup.js
Module parse failed: Unexpected token (60:26)
You may need an appropriate loader to handle this file type.
| 
|     return React.cloneElement(child, Object.assign({}, child.props, {
|       inlineLabel, theme, ...subsetOfProps
|     }))
|   })
__stack_frame_overlay_proxy_console__ @ index.js:2177
handleErrors @ webpackHotDevClient.js:176
./node_modules/react-dev-utils/webpackHotDevClient.js.connection.onmessage @ webpackHotDevClient.js:209
./node_modules/sockjs-client/lib/event/eventtarget.js.EventTarget.dispatchEvent @ eventtarget.js:51
(anonymous) @ main.js:274
./node_modules/sockjs-client/lib/main.js.SockJS._transportMessage @ main.js:272
./node_modules/sockjs-client/lib/event/emitter.js.EventEmitter.emit @ emitter.js:50
WebSocketTransport.ws.onmessage @ websocket.js:35
index.js:2177 ./node_modules/react-native-clean-form/src/Input.js
Module parse failed: Unexpected token (71:6)
You may need an appropriate loader to handle this file type.
|   render() {
|     return (
|       <InputWrapper
|         inlineLabel={this.props.inlineLabel}
|         multiline={this.props.multiline}

[markusguenther]

At the moment their is no plan. We are behind many dependencies. So think we should first overhaul this before this could be a topic.