v11.0.0

This is a big release for this library. The sheet's gesture engine has been rewritten to run entirely on the UI thread, so a busy JS thread no longer stutters the sheet, and scrolling inside the sheet is a lot more reliable.

• Drag gesture, scroll ↔ drag handoff and open/close/snap animations now run in worklets on the UI thread by default
• Velocity based snapping: a flick now carries the sheet to the next snap point (or dismisses it) based on release velocity, not just drag distance
• Multiple scrollables in one sheet are now handled independently at the same time
• New useSheetScrollable hook to use any custom Animated scrollable inside the sheet

import Animated from 'react-native-reanimated';
import {useSheetScrollable} from 'react-native-actions-sheet';

function MyList() {
  const {ref, onScroll, scrollEventThrottle, simultaneousHandlers} =
    useSheetScrollable();
  return (
    <Animated.FlatList
      ref={ref}
      onScroll={onScroll}
      scrollEventThrottle={scrollEventThrottle}
      simultaneousHandlers={simultaneousHandlers}
    />
  );
}

• New SheetGestureBlocker component (and useSheetGestureRegion hook) to stop the sheet from dragging when interacting with sliders, maps, WebViews, PDFs etc.

import {SheetGestureBlocker} from 'react-native-actions-sheet';

<SheetGestureBlocker>
  <MySlider />
</SheetGestureBlocker>

• New useSheetPosition hook gives you the live position of the sheet as shared values for parallax headers, collapsing titles and more

const {y, height, progress} = useSheetPosition();
const style = useAnimatedStyle(() => ({opacity: progress.value}));

• New onChangeWorklet prop, a worklet version of onChange that runs on the UI thread
• New dimBackdropOnDrag prop, the backdrop now fades out as you drag the sheet down to dismiss (enabled by default)
• Redesigned drawUnderStatusBar, the top corners now flatten and the sheet fills behind the status bar smoothly like native sheets
• Accessibility improvements: the sheet is now modal for screen readers, supports the VoiceOver/TalkBack escape gesture, and the grabber is adjustable when using snap points. New accessibilityLabels prop to set labels for the backdrop & grabber
• On iOS, onClose and SheetManager promises now resolve after the native Modal is dismissed, so you can safely present an alert, share sheet, image picker or navigate to a modal screen from them
• Ship an official Jest mock at react-native-actions-sheet/jest/mock

jest.mock('react-native-actions-sheet', () =>
  require('react-native-actions-sheet/jest/mock'),
);

• CloseRequestType is now exported from the package root
• Fixed random extra space at the bottom of the sheet on Android
• Fixed sheet resizing on every keystroke on iOS
• Fixed SheetManager.hide sometimes not closing all sheets when using nested sheets
• Fixed web warnings for deprecated pointerEvents & shadow* props, and Reanimated 4.6+ warnings about useAnimatedStyle dependencies
• New documentation website
• Many other bug fixes and improvements

Migration from v10.x

v11 requires React Native's New Architecture. If your app is still on the old architecture, stay on v10.

react-native-worklets is now a peer dependency instead of a dependency, so the library uses whichever version your app or Expo SDK provides. Install it along with the other peer dependencies:

npm install react-native-reanimated react-native-worklets react-native-gesture-handler react-native-safe-area-context

The library also no longer depends on react-native-linear-gradient. For most apps nothing else changes. The legacy gesture engine is still available with the legacyGestures prop if you face any issues, please report them. Follow the migration guide in the docs here.

Changelog

• fix: stop reversing in place in SheetManager.get by @luka-archon in #507
• fix(ios): follow keyboardWillChangeFrame to ignore stray frame events by @anastely in #546
• fix: export CloseRequestType from the package root by @maencharacter in #541
• fix reanimated dependencies warning on native by @roidayan1 in #543
• fix: wrap onEnd gesture handler to prevent worklets bundle-mode crash by @nazmiaydogdu in #535
• docs: minor fixes by @jgalat in #390
• fix: pass pointerEvents through style instead of the deprecated prop by @BijuDey in #549
• fix(web): use boxShadow instead of the deprecated shadow* styles by @BijuDey in #550
• feat: UI-thread gesture engine, default on native by @ammarahm-ed in #547

New Contributors

• @luka-archon made their first contribution in #507
• @anastely made their first contribution in #546
• @maencharacter made their first contribution in #541
• @roidayan1 made their first contribution in #543
• @nazmiaydogdu made their first contribution in #535
• @jgalat made their first contribution in #390
• @BijuDey made their first contribution in #549

Full Changelog: v10.1.2...v11.0.0