Skip to content

Instantly share code, notes, and snippets.

@geraintwhite
Created March 27, 2018 10:05
Show Gist options
  • Save geraintwhite/26d17a508525c248617546d5ca0d0fef to your computer and use it in GitHub Desktop.
Save geraintwhite/26d17a508525c248617546d5ca0d0fef to your computer and use it in GitHub Desktop.
React Native Web Polyfills
// @flow
import EventEmitter from 'events';
export default new EventEmitter();
// @flow
import React, { Component } from 'react';
import { ScrollView, View } from 'react-native-web';
import type { StyleObj } from 'react-native/Libraries/StyleSheet/StyleSheetTypes';
type PropsType = {|
ItemSeparatorComponent?: ?(React$ComponentType<*> | React$Element<*>),
ListFooterComponent?: ?(React$ComponentType<*> | React$Element<*>),
ListHeaderComponent?: ?(React$ComponentType<*> | React$Element<*>),
ListEmptyComponent?: ?(React$ComponentType<*> | React$Element<*>),
contentContainerStyle?: StyleObj,
data?: Array<*>,
horizontal?: boolean,
keyExtractor?: (item: *) => string,
renderItem: (obj: { index: number, item: * }) => ?React$Element<*>,
style?: StyleObj
|};
class FlatList extends Component<PropsType> {
renderComponent = (Component: ?(React$ComponentType<*> | React$Element<*>)) => {
if (!Component) {
return null;
}
if (React.isValidElement(Component)) {
return Component;
}
// $FlowFixMe
return <Component />;
}
render() {
const {
ItemSeparatorComponent,
ListFooterComponent,
ListHeaderComponent,
ListEmptyComponent,
contentContainerStyle,
data = [],
horizontal = false,
keyExtractor,
renderItem,
style
} = this.props;
return (
<ScrollView
contentContainerStyle={contentContainerStyle}
horizontal={horizontal}
style={style}
>
{ this.renderComponent(ListHeaderComponent) }
{ data.length === 0 ?
this.renderComponent(ListEmptyComponent) :
data.map((item: *, index: number): React$Node => (
<View key={keyExtractor ? keyExtractor(item) : index}>
{ renderItem({ index, item }) }
{ index < data.length - 1 && this.renderComponent(ItemSeparatorComponent) }
</View>
))
}
{ this.renderComponent(ListFooterComponent) }
</ScrollView>
);
}
}
export default FlatList;
// @flow
import * as ReactNativeWeb from 'react-native-web';
import Modal from 'react-native-web-modal';
import FlatList from './FlatList';
import DeviceEventEmitter from './DeviceEventEmitter';
import NativeModules from './NativeModules';
module.exports = {
...ReactNativeWeb,
Modal,
FlatList,
DeviceEventEmitter,
NativeModules
};
// @flow
class Contacts {
static getAll(cb: (err: string) => void) {
cb('Contacts not supported on web');
}
}
class RNLiblinphone {
static init(): Promise<void> {
return Promise.resolve();
}
static register(): Promise<void> {
return Promise.resolve();
}
static unregister(): Promise<void> {
return Promise.resolve();
}
static call(): Promise<void> {
return Promise.resolve();
}
static answer(): Promise<void> {
return Promise.resolve();
}
static hangup(): Promise<void> {
return Promise.resolve();
}
}
export default {
Contacts,
RNLiblinphone
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment