cancelButtonIndex not shown on iOS 26

[bjornevik]

The cancelButtonIndex doesn't seem to be compatible with iOS 26.

using the onPress from the getting started in the read me

const onPress = () => {
  const options = ['Delete', 'Save', 'Cancel'];
  const destructiveButtonIndex = 0;
  const cancelButtonIndex = 2;

  showActionSheetWithOptions({
    options,
    cancelButtonIndex,
    destructiveButtonIndex
  }, (selectedIndex: number) => {
    switch (selectedIndex) {
      case 1:
        // Save
        break;

      case destructiveButtonIndex:
        // Delete
        break;

      case cancelButtonIndex:
        // Canceled
    }});
}

results in

[comertcimen]

The problem is with the ActionSheetIOS (which this library uses for ios).
I just tried the same code and it does not show up. Not sure if there is already an issue created on react-native repo.

import { ActionSheetIOS } from "react-native"


const onPress = () => {
ActionSheetIOS.showActionSheetWithOptions(
      {
        options: ["Delete", "Save", "Cancel"],
        cancelButtonIndex: 2,
        destructiveButtonIndex: 0,
      },
      (buttonIndex) => {
        switch (buttonIndex) {
          case 0:
            console.log("Delete")
            break
          case 1:
            console.log("Save")
            break
          case 2:
            console.log("Cancel")
            break
          default:
            console.log("Unknown")
            break
        }
      },
    )
}

[EthanDM]

Commenting out line 147 in node_modules/react-native/React/CoreModules/RCTActionSheetManager.mm will make it show but without the cancel styling.

// style = UIAlertActionStyleCancel;

Seems something is causing it to not show when the style is applied, even though it matches the Apple docs: https://developer.apple.com/documentation/uikit/uialertaction/style-swift.enum/cancel?language=objc

Unsure what the solution is but our team is running with no cancel button index prop and leaving it a normal button for now.

It's possible Apple got rid of the cancel style entirely in the new action sheets (which oddly enough feel more like popovers/context menu's than an action sheet anyway).

[oskarnellfors]

Weirdly, it's like that index is not 0-indexed. I got my cancel-button back if I changed the index. In your first example that would be index 3. It makes 0 sense and I guess wont work in android and other iOS-versions?

[oskarnellfors]

cancelButtonIndex: (Platform.OS === "ios" && parseInt(Platform.Version, 10) >= 18) ? options.length : options.length - 1,

This is how I solved it

I still get options.length - 1 out in the button-callback clicked-index. Even though it's visible if I set it for one more.

[comertcimen]

Weird that destructiveButtonIndex uses zero-based indexing and cancelButtonIndex uses one-based indexing