src/material/bottom-sheet/bottom-sheet-config.ts - main - githubmirror/components

src/material/bottom-sheet/bottom-sheet-config.ts
95 строк3 KB
Kristiyan Kostadinov
docs(material/bottom-sheet): update panelClass comment (#33321)
01 июн 2026, 10:17
01 июн 2026, 10:17b83c6c1
/**
 * @license
 * Copyright Google LLC All Rights Reserved.
 *
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file at https://angular.dev/license
 */

import {Binding, InjectionToken, Injector, ViewContainerRef} from '@angular/core';
import {Direction} from '@angular/cdk/bidi';
import {ScrollStrategy} from '@angular/cdk/overlay';
import {RestoreFocusValue} from '@angular/cdk/dialog';

/** Options for where to set focus to automatically on dialog open */
export type AutoFocusTarget = 'dialog' | 'first-tabbable' | 'first-heading';

/** Injection token that can be used to access the data that was passed in to a bottom sheet. */
export const MAT_BOTTOM_SHEET_DATA = new InjectionToken<any>('MatBottomSheetData');

/**
 * Configuration used when opening a bottom sheet.
 */
export class MatBottomSheetConfig<D = any> {
  /** The view container to place the overlay for the bottom sheet into. */
  viewContainerRef?: ViewContainerRef;

  /**
   * Injector used for the instantiation of the component to be attached. If provided,
   * takes precedence over the injector indirectly provided by `ViewContainerRef`.
   */
  injector?: Injector;

  /** Extra CSS classes to be added to the overlay panel containing the bottom sheet. */
  panelClass?: string | string[];

  /** Text layout direction for the bottom sheet. */
  direction?: Direction;

  /** Data being injected into the child component. */
  data?: D | null = null;

  /** Whether the bottom sheet has a backdrop. */
  hasBackdrop?: boolean = true;

  /** Custom class for the backdrop. */
  backdropClass?: string;

  /** Whether the user can use escape or clicking outside to close the bottom sheet. */
  disableClose?: boolean = false;

  /** Aria label to assign to the bottom sheet element. */
  ariaLabel?: string | null = null;

  /**
   * Whether this is a modal dialog. Used to set the `aria-modal` attribute. Off by default,
   * because it can interfere with other overlay-based components (e.g. `mat-select`) and because
   * it is redundant since the dialog marks all outside content as `aria-hidden` anyway.
   */
  ariaModal?: boolean = false;

  /**
   * Whether the bottom sheet should close when the user goes backwards/forwards in history.
   * Note that this usually doesn't include clicking on links (unless the user is using
   * the `HashLocationStrategy`).
   */
  closeOnNavigation?: boolean = true;

  /**
   * Where the bottom sheet should focus on open.
   * @breaking-change 14.0.0 Remove boolean option from autoFocus. Use string or
   * AutoFocusTarget instead.
   */
  autoFocus?: AutoFocusTarget | string | boolean = 'first-tabbable';

  /** Configures the focus restoration behavior. See `RestoreFocusValue` for more information. */
  restoreFocus?: RestoreFocusValue = true;

  /** Scroll strategy to be used for the bottom sheet. */
  scrollStrategy?: ScrollStrategy;

  /** Height for the bottom sheet. */
  height?: string = '';

  /** Minimum height for the bottom sheet. If a number is provided, assumes pixel units. */
  minHeight?: number | string;

  /** Maximum height for the bottom sheet. If a number is provided, assumes pixel units. */
  maxHeight?: number | string;

  /**
   * Bindings to apply to the component rendered inside the dialog.
   * Does nothing for template-based dialogs.
   */
  bindings?: Binding[];
}