Skip to main content

SkeletonTextBlock

SkeletonTextBlock is used to provide a low fidelity representation of a block of text before it appears on the page.

Optionally you can use any text content inside SkeletonTextBlock to be used as a base for the rendered skeleton

Anchor to skeletontextblockpropsSkeletonTextBlockProps

Anchor to id
id
string

A unique identifier for the component.

Anchor to lines
lines
number
Default: 1

Number of lines to display when no children are passed.

Anchor to size
size

Size of the text the skeleton replaces.

Was this section helpful?

Basic SkeletonTextBlock

import {
reactExtension,
SkeletonTextBlock,
} from '@shopify/ui-extensions-react/checkout';

export default reactExtension(
'purchase.checkout.block.render',
() => <Extension />,
);

function Extension() {
return <SkeletonTextBlock />;
}

Preview