Struct SkeletonProps

pub struct SkeletonProps {

    pub children: Children,
    pub variant: Variant,
    pub animation: Animation,
    pub direction: Direction,
    pub theme: Theme,
    pub width: &'static str,
    pub height: &'static str,
    pub font_size: Option<&'static str>,
    pub border_radius: &'static str,
    pub display: &'static str,
    pub line_height: &'static str,
    pub position: &'static str,
    pub overflow: &'static str,
    pub margin: &'static str,
    pub custom_style: &'static str,
    pub infer_size: bool,
    pub show: bool,
    pub delay_ms: u32,
    pub responsive: bool,
    pub max_width: Option<&'static str>,
    pub min_width: Option<&'static str>,
    pub max_height: Option<&'static str>,
    pub min_height: Option<&'static str>,
    pub animate_on_hover: bool,
    pub animate_on_focus: bool,
    pub animate_on_active: bool,
    pub animate_on_visible: bool,
}

Available on crate feature yew only.

Properties for the Skeleton component.

Fields

children: Children

Child elements to render inside the skeleton.

If provided, the children will be wrapped with the skeleton styling and animation.

variant: Variant

The visual variant of the skeleton.

Variants control the shape or type of the skeleton placeholder, such as text or circle. Defaults to Variant::Text.

animation: Animation

Animation style applied to the skeleton.

Controls how the skeleton animates, e.g., pulse, wave, etc. Defaults to Animation::Pulse.

direction: Direction

Direction of the animation direction and background color gradient.

theme: Theme

The theme of the skeleton appearance.

Allows switching between light or dark themes. Defaults to Theme::Light.

width: &'static str

The width of the skeleton.

Accepts any valid CSS width value (e.g., 100%, 200px, 10rem). Defaults to "100%".

height: &'static str

The height of the skeleton.

Accepts any valid CSS height value. Defaults to "1em".

font_size: Option<&'static str>

Optional font size for the skeleton text.

Used to size the placeholder in proportion to text elements. If not set, font size is not applied.

border_radius: &'static str

Border radius for the skeleton.

Controls the rounding of the skeleton’s corners. Accepts any valid CSS radius. Defaults to "4px".

display: &'static str

Display property for the skeleton.

Determines the skeleton’s display type (e.g., inline-block, block). Defaults to "inline-block".

line_height: &'static str

Line height of the skeleton content.

This affects vertical spacing in text-like skeletons. Defaults to "1".

position: &'static str

The CSS position property.

Controls how the skeleton is positioned. Defaults to "relative".

overflow: &'static str

Overflow behavior of the skeleton container.

Accepts values like hidden, visible, etc. Defaults to "hidden".

margin: &'static str

Margin applied to the skeleton.

Accepts any valid CSS margin value. Defaults to "".

custom_style: &'static str

Additional inline styles.

Allows you to append arbitrary CSS to the skeleton component. Useful for quick overrides.

infer_size: bool

Whether to automatically infer the size from children.

If true, the skeleton will try to match the dimensions of its content.

show: bool

Whether the skeleton is currently visible.

Controls whether the skeleton should be rendered or hidden.

delay_ms: u32

Delay before the skeleton becomes visible, in milliseconds.

Useful for preventing flicker on fast-loading content. Defaults to 0.

responsive: bool

Whether the skeleton is responsive.

Enables responsive resizing behavior based on the parent container or screen size.

max_width: Option<&'static str>

Optional maximum width of the skeleton.

Accepts any valid CSS width value (e.g., 600px, 100%).

min_width: Option<&'static str>

Optional minimum width of the skeleton.

Accepts any valid CSS width value.

max_height: Option<&'static str>

Optional maximum height of the skeleton.

Accepts any valid CSS height value.

min_height: Option<&'static str>

Optional minimum height of the skeleton.

Accepts any valid CSS height value.

animate_on_hover: bool

Whether the skeleton animates on hover.

When enabled, an animation will be triggered when the user hovers over the skeleton.

animate_on_focus: bool

Whether the skeleton animates on focus.

Useful for accessibility - triggers animation when the component receives focus.

animate_on_active: bool

Whether the skeleton animates on active (click or tap).

Triggers animation when the skeleton is actively clicked or touched.

animate_on_visible: bool

Whether the skeleton animates when it becomes visible in the viewport.

Uses IntersectionObserver to detect visibility and trigger animation.

Trait Implementations

impl Clone for SkeletonProps

fn clone(&self) -> SkeletonProps

Returns a duplicate of the value.

fn clone_from(&mut self, source: &Self)

Performs copy-assignment from source.

impl PartialEq for SkeletonProps

fn eq(&self, other: &SkeletonProps) -> bool

Tests for self and other values to be equal, and is used by ==.

fn ne(&self, other: &Rhs) -> bool

Tests for !=. The default implementation is almost always sufficient, and should not be overridden without very good reason.

impl Properties for SkeletonProps

type Builder = SkeletonPropsBuilder

Builder that will be used to construct properties

fn builder() -> Self::Builder

Entrypoint for building properties

impl StructuralPartialEq for SkeletonProps