Tesserae

SectionStack

Description

SectionStack is a container component used to organize content into distinct sections presented in a vertical layout. It handles sections with animated transitions for adding titles and content cards. Use SectionStack when you need to display grouped, expandable content blocks with a clear separation between titles and content.

Usage

You can instantiate a SectionStack using the static helper method from the Tesserae.UI class. Sections can be added, cleared, or animated individually.

API reference

class

SectionStack

public class SectionStack : Stack

A stack component that supports animated sections.

Constructors

Constructor
SectionStack
public SectionStack() : base(Stack.Orientation.Vertical)

Initializes a new instance of the class.

Methods

Method
SectionStack.AddAnimated
public void AddAnimated(IComponent component, bool grow = false, bool shrink = false, string customPadding = "", bool cardStyle = true)

Adds a component as an animated section.

Parameters

component
The component.
grow
Whether the section should grow.
shrink
Whether the section should shrink.
customPadding
Custom padding for the section.
Method
SectionStack.AddAnimatedTitle
public void AddAnimatedTitle(IComponent component)

Adds a component as an animated title.

Parameters

component
The component.
Method
SectionStack.Clear
public override void Clear()

Clears all sections from the stack.

Method
SectionStack.Secondary
public SectionStack Secondary()

Styles the component using the secondary tone.

Method
SectionStack.Render
public override HTMLElement Render()

Renders the component.

Returns

The rendered HTML element.

Sample

See also

Referenced by

© 2026 Tesserae. All rights reserved.