This package allow you to place one or multiple shimmers into a page.

The shimmers inherit by default the following configuraiton:

• Theme primary color for background and text rendering.
• Outsystems UI typography sizing for ShimmerText and Lines.
• Outsystems UI button size,color and shape for ShimmerButton. 

But you can override the colors and the sizing.

Check out the demo!!!

The package contains the following widgets:

1. [UI Flow] ShimmerZone
   1. ShimmerContainer
   2. ShimmerRepeater
2. [UI Flow] Shimmers
   1. ShimmerBlock
   2. ShimmerLine
   3. ShimmerText
   4. ShimmerImage
   5. ShimmerButton

The most important widget is the ShimmerContainer, it has a placeholder where its possibile to put the shimmers controls.

The ShimmerRepeater clone the content of the shimmer container, its usefull when you need to use shimmers for table loading or in pages with lists.

Accessibility

The Shimmer Container Control is rendered with [aria-hidden="true"] attribute, this setting removes the element and all of its children from the "accessibility" tree.

If you need to respect the WAI-Aria specification handle the attribute [aria-busy="true/false"] on the real data component ( ex the grid/table that show the real data)