Basic

Once upon a time, stories wove connections between people, a symphony of voices crafting shared dreams. Each word carried meaning, each pause brought understanding.

``` ```csharp private bool isBasicPanelOpen; private BitPanel basicPanelRef = default!; ``` \n**Header and footer**: ```razor HeaderText & FooterText Header, Body & Footer You have no new notifications.

Filters

@for (var i = 1; i <= 30; i++) { var index = i; } ``` ```csharp private bool isHeaderTextPanelOpen; private bool isTemplatePanelOpen; ``` \n**Placement and size**: ```razor Open panel Size: @(panelFullSize ? "FullSize" : $"{panelSize}px") ``` ```csharp private BitPlacement panelPosition = BitPlacement.End; private double panelSize = 300; private bool panelFullSize; private bool isPositionPanelOpen; ``` \n**Overlay and dismissal**: ```razor Open panel

Overlay clicks: @overlayClickCount, Escape presses: @escapeKeyCount, dismissals: @dismissCount

Click the page behind this panel or press Escape.

``` ```csharp private bool overlayModeFull; private bool overlayBlocking; private bool overlayNoEscape; private bool overlayModeless; private int overlayClickCount; private int escapeKeyCount; private int dismissCount; private bool isOverlayPanelOpen; private readonly List> dismissalItems = [ new() { Text = "A", Value = "A" }, new() { Text = "B", Value = "B" }, new() { Text = "C", Value = "C" }, ]; ``` \n**Refusing a dismissal**: ```razor Open panel

Last attempt: @(guardedReason?.ToString() ?? "-"), refused: @guardedRefused

``` ```csharp private bool guardPanel = true; private bool guardedRefused; private BitPanelDismissReason? guardedReason; private bool isGuardedPanelOpen; private BitPanel guardedPanelRef = default!; // The gestures that could be a slip are refused; the close button and the panel's own Save go through. private void HandleOnDismissing(BitPanelDismissArgs args) { guardedReason = args.Reason; args.Cancel = guardPanel && args.Reason is BitPanelDismissReason.Overlay or BitPanelDismissReason.Escape or BitPanelDismissReason.Swipe; guardedRefused = args.Cancel; } ``` \n**Accessibility**: ```razor Open panel

``` ```csharp private bool a11yNoAutoFocus; private bool a11yNoFocusTrap; private bool a11yNoRestoreFocus; private bool a11yIsAlert; private bool isA11yPanelOpen; ``` \n**Page scrolling**: ```razor Open panel Try scrolling the page behind this panel. ``` ```csharp private string scrollMode = "Lock"; private bool isScrollPanelOpen; ``` \n**Swipe to dismiss**: ```razor Open panel

Start: @swipeStart

Diff: @swipeDiff

Dragging here does not move the panel (data-no-swipe).

``` ```csharp private double swipeTrigger = 0.25; private bool noSwipe; private decimal swipeStart; private decimal swipeDiff; private bool isSwipePanelOpen; ``` \n**Nested panels**: ```razor Open outer panel Open nested panel Open sibling panel Declared inside the outer panel, so it covers it without a ZIndex. Declared beside the outer panel and lifted over it by ZIndex. ``` ```csharp private bool isOuterPanelOpen; private bool isInnerPanelOpen; private bool isSiblingPanelOpen; ``` \n**Inside a container**: ```razor

The panel opens inside this box.

Open panel Contained by its box.

``` ```csharp private bool isAbsolutePanelOpen; ``` \n**Rendering and events**: ```razor Open panel

Opened @openCount times, last toggled to @lastToggleState, settled at @lastSettledState

``` ```csharp private bool keepMounted; private int openCount; private bool lastToggleState; private bool lastSettledState; private bool isRenderPanelOpen; ``` \n**Cascading parameters**: ```razor Cascaded values Own Placement Start edge, 320px, dimmed page and a close button - none of it set on this panel. Slides in from the end, everything else from the cascade. ``` ```csharp private readonly BitPanelParams[] panelParams = [ new() { Placement = BitPlacement.Start, Size = 320, ModeFull = true, ShowCloseButton = true, } ]; private bool isCascadedPanelOpen; private bool isOverridingPanelOpen; ``` \n**External Icons**: ```razor CloseIcon CloseIconName The close button is drawn by FontAwesome. The close button uses another built-in icon. ``` ```csharp private bool isExternalIconPanelOpen; private bool isIconNamePanelOpen; ``` \n**Style & Class**: ```razor Styles Classes CSS variables A 30vw panel, set through the Container. Every part carries a class of its own. Rounded inner corners, a primary edge, roomier padding and a darker, blurring overlay. ``` ```csharp private bool isStylesPanelOpen; private bool isClassesPanelOpen; private bool isCssVarsPanelOpen; ``` \n**RTL**: ```razor

آغاز پایان

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. ``` ```csharp private bool isRtlPanelOpenStart; private bool isRtlPanelOpenEnd; ```

Basic

Edit profile