SkeletonText

The SkeletonText component renders a specified number of placeholder boxes for lines of text with an animated background.

Import

import { SkeletonText } from '@dynatrace/strato-components-preview/layouts-core';

Use cases

Basic

You can use the SkeletonText without specifying any props. It will render a pre-set number of lines and use up the available width in the parent container.

CodeSandbox

Setting the width

The width prop can be used to specify the width of the SkeletonText.

CodeSandbox

Setting the number of lines

To render a given amount of lines, you can utilize the lines prop.

CodeSandbox

Props

SkeletonTextProps

extends,

Name	Type	Default	Description
width?	[]	100%	Width of the SkeletonText placeholder.
lines?		3	Number of Lines of the SkeletonText placeholder.