Bootstrap

API collapse

CollapseConfig

interface

Configuration options for the collapse transition.

Properties
animationPendingClasses?

optional animationPendingClasses: string[]

the list of classes to add to the collapsable element while transitioning

dimension?

optional dimension: "height" | "width"

the direction in which the collapsing is performed

hideClasses?

optional hideClasses: string[]

the list of classes to add to the collapsable element when collapsed

showClasses?

optional showClasses: string[]

the list of classes to add to the collapsable element when shown

CollapseContext

interface

Represents the context for a collapsible element.

Properties
maxSize?

optional maxSize: string

the maximum size of the collapseable content.

minSize?

optional minSize: string

the minimum size of the collapseable content

collapseHorizontalTransition

function

collapseHorizontalTransition(element, direction, animated, signal, context): void | Promise<void>

A transition function for collapsing elements horizontally.

This function is created using the createCollapseTransition utility and is configured with horizontalConfig.

Parameters
element

SSRHTMLElement

Element on which the transition should be applied.

direction

Whether the element should be shown or hidden.

"show" | "hide"

animated

boolean

Whether the transition should be animated.

signal

AbortSignal

Signal allowing to stop the transition while running.

context

object

Context of the current transition. It is reused between calls if the previous transition was stopped while running on the same element.

Returns

void | Promise<void>

collapseVerticalTransition

function

collapseVerticalTransition(element, direction, animated, signal, context): void | Promise<void>

A transition function that handles vertical collapse animations.

This function is created using the createCollapseTransition utility with a vertical configuration. It is intended to be used for animating the collapsing and expanding of vertical elements.

Parameters
element

SSRHTMLElement

Element on which the transition should be applied.

direction

Whether the element should be shown or hidden.

"show" | "hide"

animated

boolean

Whether the transition should be animated.

signal

AbortSignal

Signal allowing to stop the transition while running.

context

object

Context of the current transition. It is reused between calls if the previous transition was stopped while running on the same element.

Returns

void | Promise<void>

createCollapseTransition

function

createCollapseTransition(config): TransitionFn

Create a collapse transition.

The transition attaches / removes classes during the different states of the collapse transition. It also updates the dimension value when reaching a non-pending state.

Parameters
config

CollapseConfig = {}

the collapse config

Returns

TransitionFn

the collapse transition