@anguless/angulux/skeleton

skeleton

1 declarations3 demos

import

import { SkeletonModule } from '@anguless/angulux/skeleton';

Basic

A skeleton stands in for content that has not arrived yet.

<div style="width: 100%; display: grid; gap: 0.5rem">    <agl-skeleton />    <agl-skeleton width="10rem" />    <agl-skeleton width="5rem" borderRadius="16px" />    <agl-skeleton height="2rem" /></div>

Shapes and sizes

Shape, size, width, height and borderRadius describe the space being held.

<agl-skeleton shape="circle" size="4rem" /><agl-skeleton width="10rem" height="4rem" /><agl-skeleton width="10rem" height="4rem" borderRadius="16px" />

Animation

Setting animation to none holds the space without moving.

<agl-skeleton width="12rem" /><agl-skeleton width="12rem" animation="none" />

API

Generated from the committed corpus, which check:corpus holds to the built library.

Skeleton

componentagl-skeleton

Skeleton is a placeholder to display instead of the actual content.

Input	Type	Default	Description
styleClass deprecated — since v20.0.0, use `class` instead.	string \| undefined	not documented	Class of the element.
shape	string	not documented	Shape of the element.
animation	string	not documented	Type of the animation.
borderRadius	string \| undefined	not documented	Border radius of the element, defaults to value from theme.
size	string \| undefined	not documented	Size of the skeleton.
width	string	not documented	Width of the element.
height	string	not documented	Height of the element.

Inherited from BaseComponent

inherited

Input	Type	Default	Description
dt	Object \| undefined	undefined	Defines scoped design tokens of the component.
unstyled	boolean \| undefined	undefined	Indicates whether the component should be rendered without styles.
pt	PT \| undefined	undefined	Used to pass attributes to DOM elements inside the component. TRUSTED INPUT ONLY. Whatever you put here is applied to the DOM as given: keys become attributes, and a key that names a DOM property is assigned to that property directly, with no sanitizer in between. That is what makes the API useful, and it means a value reaching it from a user, a database or a CMS can execute script. Treat it like markup you wrote yourself, not like data you received.
ptOptions	PassThroughOptions \| undefined	undefined	Used to configure passthrough(pt) options of the component.