1import React from 'react'; 2import { Platform, StyleSheet, Text } from 'react-native'; 3function useChildren(inputChildren) { 4 return React.useMemo(() => { 5 const children = []; 6 React.Children.forEach(inputChildren, (child) => { 7 if (child == null || typeof child === 'boolean') { 8 } 9 else if (typeof child === 'string' || typeof child === 'number') { 10 // Wrap text in a Text component. 11 let message = `Invalid raw text as a child of View: "${child}"${child === '' ? ` [empty string]` : ''}.`; 12 message += ' Wrap the text contents with a Text element or remove it.'; 13 console.warn(message); 14 children.push(React.createElement(Text, { style: [StyleSheet.absoluteFill, styles.error] }, 15 "Unwrapped text: \"", 16 React.createElement(Text, { style: { fontWeight: 'bold' } }, child), 17 "\"")); 18 } 19 else if ('type' in child && typeof child?.type === 'string' && Platform.OS !== 'web') { 20 // Disallow untransformed react-dom elements on native. 21 throw new Error(`Using unsupported React DOM element: <${child.type} />`); 22 } 23 else { 24 children.push(child); 25 } 26 }); 27 return children; 28 }, [inputChildren]); 29} 30/** Extend a view with a `children` filter that asserts more helpful warnings/errors. */ 31export function createDevView(View) { 32 return React.forwardRef(({ children, ...props }, forwardedRef) => { 33 return React.createElement(View, { ref: forwardedRef, ...props, children: useChildren(children) }); 34 }); 35} 36const styles = StyleSheet.create({ 37 error: { 38 backgroundColor: 'firebrick', 39 color: 'white', 40 }, 41}); 42//# sourceMappingURL=createDevView.js.map