Class ActionSheet

core/src/components/action-sheet/action-sheet.tsx:42–671

  scoped: true,
})
export class ActionSheet implements ComponentInterface, OverlayInterface {
  private readonly delegateController = createDelegateController(this);
  private readonly lockController = createLockController();
  private readonly triggerController = createTriggerController();
  private wrapperEl?: HTMLElement;
  private groupEl?: HTMLElement;
  private gesture?: Gesture;
  private hasRadioButtons = false;

  presented = false;
  lastFocus?: HTMLElement;
  animation?: any;

  /**
   * The ID of the currently active/selected radio button.
   * Used for keyboard navigation and ARIA attributes.
   */
  @State() activeRadioId?: string;

  @Element() el!: HTMLIonActionSheetElement;

  /** @internal */
  @Prop() overlayIndex!: number;

  /** @internal */
  @Prop() delegate?: FrameworkDelegate;

  /** @internal */
  @Prop() hasController = false;

  /**
   * If `true`, the keyboard will be automatically dismissed when the overlay is presented.
   */
  @Prop() keyboardClose = true;

  /**
   * Animation to use when the action sheet is presented.
   */
  @Prop() enterAnimation?: AnimationBuilder;

  /**
   * Animation to use when the action sheet is dismissed.
   */
  @Prop() leaveAnimation?: AnimationBuilder;

  /**
   * An array of buttons for the action sheet.
   */
  @Prop() buttons: (ActionSheetButton | string)[] = [];
  @Watch('buttons')
  buttonsChanged() {
    const radioButtons = this.getRadioButtons();
    this.hasRadioButtons = radioButtons.length > 0;

    // Initialize activeRadioId when buttons change
    if (this.hasRadioButtons) {
      const checkedButton = radioButtons.find((b) => b.htmlAttributes?.['aria-checked'] === 'true');