Member Junction
    Preparing search index...

    Class MJBottomSheetComponent

    Generic bottom sheet — the canonical mobile overlay surface (scrim + panel sliding up from the bottom edge with a grab handle).

    Pure chrome, no breakpoint logic: the CALLER decides when a sheet is the right presentation (typically below its mobile breakpoint). Content is projected; the sheet owns the scrim, enter/exit transitions, Escape, focus capture/restore, and the open/close lifecycle.

    Modality contract (this is a shared primitive — the a11y baseline is the full one, not the historic house minimum): role="dialog" + aria-modal="true", focus moves INTO the sheet on open and is trapped there (Tab/Shift+Tab cycle within), body scroll is locked while open, and focus returns to the opener on close.

    Mechanics notes (learned from the earlier hand-rolled sheets):

    • Enter AND exit are class-driven transitions (the filter-popover sheet's mount-only animation cannot animate dismissal).
    • The settled open state is transform: none, NOT translateY(0) — any non-none transform makes the sheet a containing block and breaks position: fixed descendants (dropdowns/popovers projected into it).
    • z-index 9998/9999: the established mobile-chrome band (same as the left-nav drawer and filter sheet; below mj-window at 10000, and MJConfirmService dialogs at 20000 still land above).
    <mj-bottom-sheet [(Visible)]="sheetOpen" Title="Open Records">
      <div>...rows...</div>
    </mj-bottom-sheet>

    Implements

    • OnDestroy
    Index

    Constructors

    constructor

    Properties

    AriaLabel Closed IsOpen IsRendered IsSettled Title VisibleChange

    Accessors

    Visible

    Methods

    Close ngOnDestroy OnEscape OnSheetKeydown OnTransitionEnd

    Constructors

    Properties

    AriaLabel: string = ''

    Accessible name override (falls back to Title)

    Closed: EventEmitter<void> = ...

    Emitted after the exit transition completes

    IsOpen: boolean = false

    Drives the enter/exit transition classes

    IsRendered: boolean = false

    gate — outlives Visible through the exit transition

    IsSettled: boolean = false

    Open transition finished — transform settles to none

    Title: string = ''

    Optional header row text; also the default accessible name

    VisibleChange: EventEmitter<boolean> = ...

    Accessors

    Methods

    Settings

    Member Visibility

    On This Page

    Constructors
    Properties
    Accessors
    Methods