Text
This component renders text. Remember, you can also add your own styling.
Anchor to textpropsTextProps
Anchor to accessibilityRole
accessibilityRole
Provide semantic meaning to content and improve support for assistive technologies.
Anchor to fontStyle
fontStyle
Use to emphasize a word or a group of words.
Anchor to fontVariant
fontVariant
| []
Set all the variants for a font with a shorthand property.
Anchor to fontWeight
fontWeight
Sets the weight (or boldness) of the font.
string
A unique identifier for the field.
Anchor to textOverflow
textOverflow
Set how hidden overflow content is signaled to users.
Was this section helpful?
Simple Text example
import {render, Text, BlockStack} from '@shopify/ui-extensions-react/admin';
render('Playground', () => <App />);
function App() {
return (
<BlockStack inlineAlignment="center" gap>
<Text fontWeight="bold">Name:</Text>
<Text>Jane Doe</Text>
</BlockStack>
);
}
Preview
