Loading avatar row card

A skeleton row of an avatar plus loading text

Skeleton for a card whose loaded shape is an avatar on the left with one or more lines of text on the right (e.g. user/bid/profile cards). Renders inside an `fl-card` by default; set `card="false"` when the parent surface already provides its own card/background. Configure `avatarSize` and `bodyRows` to match the loaded content. When the loaded card stacks vertically on mobile, set `stackOnMobile="true"` so below the desktop breakpoint the skeleton renders the avatar + `headerRows` beside it, then `bodyRows` full-width rows below (and collapses back to the avatar-beside-body row on desktop) to fill the taller mobile card. For the inline list-row variant (avatar spanning two text lines), use `fl-loading-thread-item` instead.

Contents

Inputs
avatarSize ?: AvatarSize = AvatarSize.MAX
avatarSizeDesktop ?: AvatarSize

Optional avatar size applied from the desktop breakpoint up. Leave unset to keep `avatarSize` at all breakpoints.

bodyRows ?: number = 2

Rows of loading text rendered alongside the avatar.

card ?: boolean = true

Wrap the avatar row in an `fl-card`. Set `false` when the parent surface already provides its own card/background.

headerRows ?: number = 2

Rows of loading text rendered beside the avatar in the stacked (mobile) layout, mirroring the user's name/details. Only used when `stackOnMobile`.

stackOnMobile ?: boolean = false

On mobile, show the header text beside the avatar and wrap the body text full-width underneath. On desktop it stays a single row (avatar + body).