React Native Mantine › Typography
Code
Inline code with monospace styling
Import: import { Code } from 'react-native-mantine';
Usage
import { Code, Text } from 'react-native-mantine';
// Inline code
<Text>
Use <Code>import</Code> statement
</Text>
// With color
<Text>
Error: <Code color="red">error.message</Code>
</Text>
// Block code
<Code block>
const value = 42;
</Code>Props
| Prop | Type | Default | Description |
|---|---|---|---|
children | React.ReactNode | Code content to display | |
color | string | Code text color - theme color name (e.g., "blue") or any valid color string | |
block | boolean | false | Display as code block instead of inline code (adds more padding and renders in BoxView) |
withTextWrapper | boolean | true | If false, returns children without wrapping in Text component |
style | TextStyle | ViewStyle | Additional styles to apply (TextStyle for inline, ViewStyle for block) | |
size | string | Text size from theme (inherited from Text) | |
white | boolean | false | Sets text color to white |
bold | boolean | false | Applies bold font weight |
semiBold | boolean | false | Applies semi-bold font weight |
weight | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900' | Font weight - numeric values from 100 (thin) to 900 (black) | |
align | 'left' | 'center' | 'right' | 'justify' | Text alignment |