UNPKG

3.27 kBJavaScriptView Raw
1import omit from 'lodash/omit';
2import pick from 'lodash/pick';
3import React from 'react';
4import { NativeModules, UIManager, ViewPropTypes, requireNativeComponent } from 'react-native';
5// To make the transition from React Native's `requireNativeComponent` to Expo's
6// `requireNativeViewManager` as easy as possible, `requireNativeViewManager` is a drop-in
7// replacement for `requireNativeComponent`.
8//
9// For each view manager, we create a wrapper component that accepts all of the props available to
10// the author of the universal module. This wrapper component splits the props into two sets: props
11// passed to React Native's View (ex: style, testID) and custom view props, which are passed to the
12// adapter view component in a prop called `proxiedProperties`.
13// NOTE: React Native is moving away from runtime PropTypes and may remove ViewPropTypes, in which
14// case we will need another way to separate standard React Native view props from other props,
15// which we proxy through the adapter
16const ViewPropTypesKeys = Object.keys(ViewPropTypes);
17/**
18 * A drop-in replacement for `requireNativeComponent`.
19 */
20export function requireNativeViewManager(viewName) {
21 if (__DEV__) {
22 const { NativeUnimoduleProxy } = NativeModules;
23 if (!NativeUnimoduleProxy.viewManagersNames.includes(viewName)) {
24 const exportedViewManagerNames = NativeUnimoduleProxy.viewManagersNames.join(', ');
25 console.warn(`The native view manager required by name (${viewName}) from NativeViewManagerAdapter isn't exported by @unimodules/react-native-adapter. Views of this type may not render correctly. Exported view managers: [${exportedViewManagerNames}].`);
26 }
27 }
28 // Set up the React Native native component, which is an adapter to the universal module's view
29 // manager
30 const reactNativeViewName = `ViewManagerAdapter_${viewName}`;
31 const ReactNativeComponent = requireNativeComponent(reactNativeViewName);
32 // @ts-ignore: UIManager.getViewManagerConfig is not declared
33 const reactNativeUIConfiguration = (UIManager.getViewManagerConfig
34 ? UIManager.getViewManagerConfig(reactNativeViewName)
35 : UIManager[reactNativeViewName]) || {
36 NativeProps: {},
37 directEventTypes: {},
38 };
39 const reactNativeComponentPropNames = [
40 'children',
41 ...ViewPropTypesKeys,
42 ...Object.keys(reactNativeUIConfiguration.NativeProps),
43 ...Object.keys(reactNativeUIConfiguration.directEventTypes),
44 ];
45 // Define a component for universal-module authors to access their native view manager
46 function NativeComponentAdapter(props, ref) {
47 // TODO: `omit` may incur a meaningful performance cost across many native components rendered
48 // in the same update. Profile this and write out a partition function if this is a bottleneck.
49 const nativeProps = pick(props, reactNativeComponentPropNames);
50 const proxiedProps = omit(props, reactNativeComponentPropNames);
51 return <ReactNativeComponent {...nativeProps} proxiedProperties={proxiedProps} ref={ref}/>;
52 }
53 NativeComponentAdapter.displayName = `Adapter<${viewName}>`;
54 return React.forwardRef(NativeComponentAdapter);
55}
56//# sourceMappingURL=NativeViewManagerAdapter.js.map
\No newline at end of file