Expand Collapse Toggle

Starts open through DefaultExpanded; nothing on the page holds its state.

@changeLog

``` ```csharp private bool boundExpanded = true; private string changeLog = string.Empty; private BitCollapse? collapseRef; private bool collapseDisabled; private void HandleChange(bool value) => changeLog = $"OnChange({value.ToString().ToLower()})"; ``` \n**Padding & background**: ```razor Default: padding and the primary background. Secondary background. Transparent, no padding: the content carries its own surface and insets. ``` ```csharp private bool surfaceExpanded = true; ``` \n**Horizontal**: ```razor

This panel opens sideways.

``` ```csharp private bool horizontalExpanded = true; ``` \n**Collapsed size**: ```razor In the beginning, there is silence a blank canvas yearning to be filled, a quiet space where creativity waits to awaken. These words are temporary, standing in place of ideas yet to come, a glimpse into the infinite possibilities that lie ahead. Think of this text as a bridge, connecting the empty spaces of now with the vibrant narratives of tomorrow. It whispers of the stories waiting to be told, of the thoughts yet to be shaped into meaning, and the emotions ready to resonate with every reader.
In this space, potential reigns supreme. It is a moment suspended in time, where imagination dances freely and each word has the power to transform into something extraordinary. Here lies the start of something new-an opportunity to craft, inspire, and create. @(peekExpanded ? "Show less" : "Show more") ``` ```csharp private bool peekExpanded; ``` \n**Transition**: ```razor

Duration="1000" Delay="200" and an overshooting Easing

A thousand milliseconds after a two hundred millisecond wait.

ExpandDuration="900" CollapseDuration="200"

Opens slowly, closes quickly.

NoFade

The content never changes its opacity.

NoAnimation

Appears and disappears at once. ``` ```csharp private bool transitionExpanded = true; ``` \n**Transition events**: ```razor @(eventsExpanded ? "Collapse" : "Expand") The -ing callback lands at once; the -ed one six hundred milliseconds later. @foreach (var entry in eventsLog) {

@entry

} ``` ```csharp private bool eventsExpanded = true; private BitCollapse? eventsCollapseRef; private readonly List eventsLog = []; private void HandleEventsChange(bool value) => LogCollapseEvent($"OnChange({value.ToString().ToLower()})"); private void HandleEventsExpanding() => LogCollapseEvent("OnExpanding"); private void HandleEventsCollapsing() => LogCollapseEvent("OnCollapsing"); private void HandleEventsExpanded() => LogCollapseEvent("OnExpanded"); private void HandleEventsCollapsed() => LogCollapseEvent("OnCollapsed"); private void LogCollapseEvent(string name) { eventsLog.Insert(0, name); if (eventsLog.Count > 8) { eventsLog.RemoveAt(eventsLog.Count - 1); } } ``` \n**Overflow**: ```razor

Default: the glow is cut off at the edge.

NoClip: the glow is drawn in full once the section is open.

``` ```csharp private bool clipExpanded = true; ``` \n**Rendering & printing**: ```razor

LazyRender

Built on the first open, kept since. Opened @lazyOpenCount time(s).

UnmountOnCollapse

ExpandOnPrint

On paper this section is always open. ``` ```csharp private bool renderingExpanded; private int lazyOpenCount; ``` \n**Find in page**: ```razor The passphrase kept in this section is marmalade skies. Close the section, press Ctrl+F and search for it. ``` ```csharp private bool findExpanded = true; ``` \n**Accessibility**: ```razor