Skip to content

ActionSheet becomes non-draggable after open animation when using id prop #442

@code-504

Description

@code-504

I'm using ActionSheet with an id, and when the sheet opens, there's a short window where I can drag it down to close it. However, after a few seconds, the sheet becomes undraggable, and I can no longer close it by dragging.

I've noticed this issue only occurs when an id is assigned to the ActionSheet. If I remove the id, the problem disappears. However, I need to assign an id because I'm embedding the ActionSheet to create a custom select component that can be reused anywhere.

Because of this setup, I’m only able to drag and close the sheet for a few moments. After that, dragging stops working.

<ActionSheet
  id={props.actionId}
  ref={actionSheetRef}
  isModal
  gestureEnabled={true}
  keyboardHandlerEnabled={false}
  useBottomSafeAreaPadding={true}
  safeAreaInsets={defaultInsets}
  containerStyle={{ height: "100%" }}
>
...
</ActionSheet>

When I remove the id, I can drag to close the ActionSheet without any issues. But doing so causes other ActionSheet components in my app to close unexpectedly.

<ActionSheet
  ref={actionSheetRef}
  isModal
  gestureEnabled={true}
  keyboardHandlerEnabled={false}
  useBottomSafeAreaPadding={true}
  safeAreaInsets={defaultInsets}
  containerStyle={{ height: "100%" }}
>
...
</ActionSheet>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions