diff --git a/packages/react-native-web/src/exports/Text/index.js b/packages/react-native-web/src/exports/Text/index.js index 071ae1025..604bea97b 100644 --- a/packages/react-native-web/src/exports/Text/index.js +++ b/packages/react-native-web/src/exports/Text/index.js @@ -121,6 +121,10 @@ const Text: React.AbstractComponent = const componentDirection = props.dir || langDirection; const writingDirection = componentDirection || contextDirection; + const capitalizeText = (text) => { + return text.toLowerCase().replace(/\b\w/g, (char) => char.toUpperCase()); + }; + const supportedProps = pickProps(rest); supportedProps.dir = componentDirection; // 'auto' by default allows browsers to infer writing direction (root elements only) @@ -145,6 +149,15 @@ const Text: React.AbstractComponent = onPress && styles.pressable ]; + if (props.style && props.style.textTransform === 'capitalize') { + supportedProps.children = React.Children.map(props.children, child => { + if (typeof child === 'string') { + return capitalizeText(child); + } + return child; + }); + } + if (props.href != null) { component = 'a'; if (hrefAttrs != null) {