@hero-design/rn 8.128.2 → 8.129.0

package/es/index.js

@@ -1,11 +1,11 @@
 import * as reactNative from 'react-native';
-import { StyleSheet as StyleSheet$1, Platform, Dimensions, Keyboard, Animated, View, UIManager, LayoutAnimation, TouchableOpacity, Text as Text$1, Easing, useWindowDimensions, TouchableWithoutFeedback, Modal as Modal$1, Image as Image$1, Pressable, SafeAreaView, KeyboardAvoidingView, TouchableHighlight, ScrollView, FlatList, TextInput as TextInput$1, PanResponder, BackHandler, InteractionManager, SectionList, RefreshControl as RefreshControl$1 } from 'react-native';
+import { StyleSheet as StyleSheet$1, Platform, Dimensions, Keyboard, Animated, View, UIManager, LayoutAnimation, TouchableOpacity, Text as Text$1, Easing, useWindowDimensions, TouchableWithoutFeedback, Modal as Modal$1, Image as Image$1, Pressable, KeyboardAvoidingView, TouchableHighlight, ScrollView, FlatList, TextInput as TextInput$1, PanResponder, BackHandler, InteractionManager, SectionList, RefreshControl as RefreshControl$1 } from 'react-native';
 import * as React from 'react';
 import React__default, { useState, useEffect, useMemo, useCallback, useRef, useLayoutEffect, createContext, forwardRef, useContext, memo, useReducer, isValidElement, useImperativeHandle } from 'react';
 import MaskedView from '@react-native-masked-view/masked-view';
 import { LinearGradient } from 'expo-linear-gradient';
 import { createIconSet } from 'react-native-vector-icons';
-import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { useSafeAreaInsets, SafeAreaView } from 'react-native-safe-area-context';
 import { MonthYearPickerViewIOS, MonthYearPickerDialogueAndroid } from '@hero-design/react-native-month-year-picker';
 import Svg, { G, ForeignObject, Line as Line$1, Path as Path$1, Rect, Mask, Circle as Circle$1, Defs, ClipPath } from 'react-native-svg';
 import DateTimePicker from '@react-native-community/datetimepicker';
@@ -4978,7 +4978,7 @@ var swagLightGlobalPalette = _objectSpread2(_objectSpread2({}, globalPalette$1),
 });
 
 var ehWorkBrandSystemPalette = {
-  primary: '#7622d7',
+  primary: '#460078',
   onPrimary: '#fdfbff',
   secondary: '#b382fd',
   onSecondary: palette$4.white,
@@ -5007,7 +5007,6 @@ var swagSystemPalette = _objectSpread2(_objectSpread2({}, ehWorkSystemPalette),
 
 var ehJobsSystemPalette = _objectSpread2(_objectSpread2({}, swagSystemPalette), {}, {
   name: 'ehJobs',
-  primary: '#7622d7',
   secondary: '#40d1ff',
   onSecondary: '#460078',
   secondaryHighlightedSurface: '#ecfaff',
@@ -8185,7 +8184,7 @@ var StyledText$4 = index$c(Text$1)(function (_ref) {
   });
 });
 
-var _excluded$O = ["children", "fontSize", "fontWeight", "intent", "typeface", "allowFontScaling"];
+var _excluded$P = ["children", "fontSize", "fontWeight", "intent", "typeface", "allowFontScaling"];
 /**
  * @deprecated Typography.Text is deprecated and will be removed in the next major release, please refer to https://design.employmenthero.com/mobile/Components/typography for the appropriate alternatives.
  */
@@ -8201,7 +8200,7 @@ var Text = function Text(_ref) {
     typeface = _ref$typeface === void 0 ? 'neutral' : _ref$typeface,
     _ref$allowFontScaling = _ref.allowFontScaling,
     allowFontScaling = _ref$allowFontScaling === void 0 ? false : _ref$allowFontScaling,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$O);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$P);
   useDeprecation('Typography.Text is deprecated and will be removed in the next major release, please refer to https://design.employmenthero.com/mobile/Components/typography for the appropriate alternatives.');
   return /*#__PURE__*/React__default.createElement(StyledText$4, _extends$1({}, nativeProps, {
     themeFontSize: fontSize,
@@ -8254,10 +8253,10 @@ var pickAccessibilityProps = function pickAccessibilityProps(props) {
   }, {});
 };
 
-var _excluded$N = ["children"];
+var _excluded$O = ["children"];
 var GradientText = function GradientText(_ref) {
   var children = _ref.children,
-    accessibilityProps = _objectWithoutProperties(_ref, _excluded$N);
+    accessibilityProps = _objectWithoutProperties(_ref, _excluded$O);
   var theme = useTheme();
   var gradient = theme.colors.gradients.aiDiagonal;
   var _useState = useState(null),
@@ -8313,7 +8312,7 @@ var GradientText = function GradientText(_ref) {
   }, children));
 };
 
-var _excluded$M = ["children", "fontWeight", "intent", "allowFontScaling", "fontStyle", "style", "testID"];
+var _excluded$N = ["children", "fontWeight", "intent", "allowFontScaling", "fontStyle", "style", "testID"];
 var Caption = function Caption(_ref) {
   var children = _ref.children,
     _ref$fontWeight = _ref.fontWeight,
@@ -8326,7 +8325,7 @@ var Caption = function Caption(_ref) {
     fontStyle = _ref$fontStyle === void 0 ? 'normal' : _ref$fontStyle,
     style = _ref.style,
     testID = _ref.testID,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$M);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$N);
   var isAi = intent === 'ai';
   var styledText = /*#__PURE__*/React__default.createElement(StyledCaption, _extends$1({}, nativeProps, {
     themeFontWeight: fontWeight,
@@ -8358,7 +8357,7 @@ var StyledLabel$1 = index$c(Text$1)(function (_ref) {
   };
 });
 
-var _excluded$L = ["children", "intent", "allowFontScaling", "fontStyle", "fontWeight", "style", "testID"];
+var _excluded$M = ["children", "intent", "allowFontScaling", "fontStyle", "fontWeight", "style", "testID"];
 var Label = function Label(_ref) {
   var children = _ref.children,
     _ref$intent = _ref.intent,
@@ -8371,7 +8370,7 @@ var Label = function Label(_ref) {
     fontWeight = _ref$fontWeight === void 0 ? 'regular' : _ref$fontWeight,
     style = _ref.style,
     testID = _ref.testID,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$L);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$M);
   var isAi = intent === 'ai';
   var styledText = /*#__PURE__*/React__default.createElement(StyledLabel$1, _extends$1({}, nativeProps, {
     themeIntent: isAi ? 'body' : intent,
@@ -8402,7 +8401,7 @@ var StyledTitle$1 = index$c(Text$1)(function (_ref) {
   };
 });
 
-var _excluded$K = ["children", "intent", "allowFontScaling", "level", "typeface", "fontStyle", "style", "testID"];
+var _excluded$L = ["children", "intent", "allowFontScaling", "level", "typeface", "fontStyle", "style", "testID"];
 var Title = function Title(_ref) {
   var children = _ref.children,
     _ref$intent = _ref.intent,
@@ -8417,7 +8416,7 @@ var Title = function Title(_ref) {
     fontStyle = _ref$fontStyle === void 0 ? 'normal' : _ref$fontStyle,
     style = _ref.style,
     testID = _ref.testID,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$K);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$L);
   var isAi = intent === 'ai';
   var styledText = /*#__PURE__*/React__default.createElement(StyledTitle$1, _extends$1({}, nativeProps, {
     themeLevel: level,
@@ -8467,7 +8466,7 @@ var StyledBody$2 = index$c(Text$1)(function (_ref) {
   };
 });
 
-var _excluded$J = ["children", "intent", "allowFontScaling", "typeface", "variant", "fontStyle", "style", "testID"];
+var _excluded$K = ["children", "intent", "allowFontScaling", "typeface", "variant", "fontStyle", "style", "testID"];
 var Body = function Body(_ref) {
   var children = _ref.children,
     _ref$intent = _ref.intent,
@@ -8482,7 +8481,7 @@ var Body = function Body(_ref) {
     fontStyle = _ref$fontStyle === void 0 ? 'normal' : _ref$fontStyle,
     style = _ref.style,
     testID = _ref.testID,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$J);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$K);
   var isAi = intent === 'ai';
   var styledText = /*#__PURE__*/React__default.createElement(StyledBody$2, _extends$1({}, nativeProps, {
     themeTypeface: typeface,
@@ -9146,22 +9145,22 @@ var SpinWrapper = function SpinWrapper(_ref) {
   }, children);
 };
 
-var _excluded$I = ["style"];
+var _excluded$J = ["style"];
 var AnimatedIcon = function AnimatedIcon(_ref) {
   var style = _ref.style,
-    otherProps = _objectWithoutProperties(_ref, _excluded$I);
+    otherProps = _objectWithoutProperties(_ref, _excluded$J);
   return /*#__PURE__*/React__default.createElement(SpinWrapper, {
     style: style
   }, /*#__PURE__*/React__default.createElement(StyledHeroIcon, otherProps));
 };
 
-var _excluded$H = ["name", "themeSize", "testID", "style"];
+var _excluded$I = ["name", "themeSize", "testID", "style"];
 var GradientIcon = function GradientIcon(_ref) {
   var name = _ref.name,
     themeSize = _ref.themeSize,
     testID = _ref.testID,
     style = _ref.style,
-    accessibilityProps = _objectWithoutProperties(_ref, _excluded$H);
+    accessibilityProps = _objectWithoutProperties(_ref, _excluded$I);
   var theme = useTheme();
   var gradient = theme.colors.gradients.aiDiagonal;
   var size = theme.__hd__.icon.sizes[themeSize];
@@ -9289,7 +9288,7 @@ var AccordionItem = function AccordionItem(_ref) {
   }, content));
 };
 
-var _excluded$G = ["key"];
+var _excluded$H = ["key"];
 var Accordion = function Accordion(_ref) {
   var items = _ref.items,
     activeItemKey = _ref.activeItemKey,
@@ -9312,7 +9311,7 @@ var Accordion = function Accordion(_ref) {
     accessible: accessible
   }, items.map(function (_ref2, index) {
     var key = _ref2.key,
-      props = _objectWithoutProperties(_ref2, _excluded$G);
+      props = _objectWithoutProperties(_ref2, _excluded$H);
     var open = _activeItemKey === key;
     return /*#__PURE__*/React__default.createElement(React__default.Fragment, {
       key: key
@@ -10148,7 +10147,7 @@ var borderWidths = {
 var config = _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({}, colors), space), radii), borderWidths);
 var flexPropsKey = ['alignContent', 'alignItems', 'alignSelf', 'display', 'flex', 'flexBasis', 'flexDirection', 'flexGrow', 'flexShrink', 'flexWrap', 'justifyContent'];
 
-var _excluded$F = ["theme"];
+var _excluded$G = ["theme"];
 var getThemeValue = function getThemeValue(theme, key, props) {
   var propConfig = config[key];
   var propValue = props[key];
@@ -10175,18 +10174,18 @@ var mapStylePropToThemeValue = function mapStylePropToThemeValue(theme, props) {
 var configKeys = Object.keys(config);
 var StyledBox = index$c(View)(function (_ref5) {
   var theme = _ref5.theme,
-    otherProps = _objectWithoutProperties(_ref5, _excluded$F);
+    otherProps = _objectWithoutProperties(_ref5, _excluded$G);
   var styleProps = pick(configKeys, otherProps);
   var flexProps = pick(_toConsumableArray(flexPropsKey), otherProps);
   return _objectSpread2(_objectSpread2({}, mapStylePropToThemeValue(theme, styleProps)), flexProps);
 });
 
-var _excluded$E = ["children", "style", "testID"];
+var _excluded$F = ["children", "style", "testID"];
 var Box = function Box(_ref) {
   var children = _ref.children,
     style = _ref.style,
     testID = _ref.testID,
-    otherProps = _objectWithoutProperties(_ref, _excluded$E);
+    otherProps = _objectWithoutProperties(_ref, _excluded$F);
   return /*#__PURE__*/React__default.createElement(StyledBox, _extends$1({}, otherProps, {
     style: style,
     testID: testID
@@ -10457,7 +10456,7 @@ var StyledIcon$4 = index$c(Icon)(function (_ref6) {
   };
 });
 
-var _excluded$D = ["children", "visible", "intent", "style", "testID"];
+var _excluded$E = ["children", "visible", "intent", "style", "testID"];
 var Status$1 = function Status(_ref) {
   var children = _ref.children,
     _ref$visible = _ref.visible,
@@ -10466,7 +10465,7 @@ var Status$1 = function Status(_ref) {
     intent = _ref$intent === void 0 ? 'danger' : _ref$intent,
     style = _ref.style,
     testID = _ref.testID,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$D);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$E);
   var _React$useRef = React__default.useRef(new Animated.Value(visible ? 1 : 0)),
     opacity = _React$useRef.current;
   var isFirstRendering = React__default.useRef(true);
@@ -10502,7 +10501,7 @@ var Status$1 = function Status(_ref) {
 
 var DEFAULT_MAX_NUMBER = 99;
 
-var _excluded$C = ["children", "visible", "style", "max", "testID", "content"];
+var _excluded$D = ["children", "visible", "style", "max", "testID", "content"];
 var Status = function Status(_ref) {
   var children = _ref.children,
     _ref$visible = _ref.visible,
@@ -10512,7 +10511,7 @@ var Status = function Status(_ref) {
     max = _ref$max === void 0 ? DEFAULT_MAX_NUMBER : _ref$max,
     testID = _ref.testID,
     originalContent = _ref.content,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$C);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$D);
   var content = useMemo(function () {
     return originalContent > max ? "".concat(max, "+") : String(originalContent);
   }, [originalContent, max]);
@@ -10524,7 +10523,7 @@ var Status = function Status(_ref) {
   }, /*#__PURE__*/React__default.createElement(StyledCountText, null, content)));
 };
 
-var _excluded$B = ["content", "visible", "max", "intent", "style", "testID", "size", "variant", "icon"];
+var _excluded$C = ["content", "visible", "max", "intent", "style", "testID", "size", "variant", "icon"];
 var getPaddingState = function getPaddingState(content) {
   return content.length > 1 ? 'wideContent' : 'narrowContent';
 };
@@ -10543,7 +10542,7 @@ var Badge$1 = function Badge(_ref) {
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'filled' : _ref$variant,
     icon = _ref.icon,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$B);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$C);
   var _React$useRef = React__default.useRef(new Animated.Value(visible ? 1 : 0)),
     opacity = _React$useRef.current;
   var isFirstRendering = React__default.useRef(true);
@@ -10661,7 +10660,7 @@ var StyledBottomBarText = index$c(Typography.Label)(function (_ref4) {
   };
 });
 
-var _excluded$A = ["onTabPress", "renderActiveTabOnly", "selectedTabKey", "tabs"];
+var _excluded$B = ["onTabPress", "renderActiveTabOnly", "selectedTabKey", "tabs"];
 var getInactiveIcon = function getInactiveIcon(icon) {
   var inactiveIcon = "".concat(icon, "-outlined");
   return isHeroIcon(inactiveIcon) ? inactiveIcon : icon;
@@ -10672,7 +10671,7 @@ var BottomNavigation = function BottomNavigation(_ref) {
     renderActiveTabOnly = _ref$renderActiveTabO === void 0 ? false : _ref$renderActiveTabO,
     selectedTabKey = _ref.selectedTabKey,
     tabs = _ref.tabs,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$A);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$B);
   var insets = useSafeAreaInsets();
   /**
    * List of loaded tabs, tabs will be loaded when navigated to.
@@ -10764,13 +10763,13 @@ var StyledDivider = index$c(View)(function (_ref) {
   }, horizontalMargin), verticalMargin);
 });
 
-var _excluded$z = ["marginHorizontal", "marginVertical", "style", "testID"];
+var _excluded$A = ["marginHorizontal", "marginVertical", "style", "testID"];
 var Divider = function Divider(_ref) {
   var marginHorizontal = _ref.marginHorizontal,
     marginVertical = _ref.marginVertical,
     style = _ref.style,
     testID = _ref.testID,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$z);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$A);
   return /*#__PURE__*/React__default.createElement(StyledDivider, _extends$1({}, nativeProps, {
     themeMarginHorizontal: marginHorizontal,
     themeMarginVertical: marginVertical,
@@ -10872,7 +10871,7 @@ var Footer$1 = function Footer(_ref) {
 };
 
 // eslint-disable-next-line @typescript-eslint/no-empty-function
-var noop$2 = function noop() {};
+var noop$3 = function noop() {};
 
 var StyledLoadingIndicatorWrapper = index$c(View)({
   flexDirection: 'row',
@@ -10901,7 +10900,7 @@ var StyledLoadingDot = index$c(View)(function (_ref) {
   }, themeStyling());
 });
 
-var _excluded$y = ["count", "size", "testID", "themeVariant"];
+var _excluded$z = ["count", "size", "testID", "themeVariant"];
 var AnimatedLoadingIndicatorWrapper = Animated.createAnimatedComponent(StyledLoadingIndicatorWrapper);
 var AnimatedLoadingDot = Animated.createAnimatedComponent(StyledLoadingDot);
 var renderDotComponent = function renderDotComponent(_ref) {
@@ -10933,7 +10932,7 @@ var LoadingIndicator = function LoadingIndicator(_ref2) {
     size = _ref2$size === void 0 ? 12 : _ref2$size,
     testID = _ref2.testID,
     themeVariant = _ref2.themeVariant,
-    nativeProps = _objectWithoutProperties(_ref2, _excluded$y);
+    nativeProps = _objectWithoutProperties(_ref2, _excluded$z);
   var progressAnimation = useRef(new Animated.Value(0));
   useEffect(function () {
     var animation = Animated.loop(Animated.timing(progressAnimation.current, {
@@ -11537,7 +11536,7 @@ var Header = function Header(_ref) {
   var content = _ref.content,
     showDivider = _ref.showDivider,
     _ref$onRequestClose = _ref.onRequestClose,
-    onRequestClose = _ref$onRequestClose === void 0 ? noop$2 : _ref$onRequestClose,
+    onRequestClose = _ref$onRequestClose === void 0 ? noop$3 : _ref$onRequestClose,
     showCloseButton = _ref.showCloseButton,
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'fixed' : _ref$variant;
@@ -11565,11 +11564,11 @@ var Header = function Header(_ref) {
   }))) : null), showDivider ? /*#__PURE__*/React__default.createElement(Divider, null) : null);
 };
 
-var _excluded$x = ["scrollEventThrottle"];
+var _excluded$y = ["scrollEventThrottle"];
 var BottomSheetScrollView = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var _ref$scrollEventThrot = _ref.scrollEventThrottle,
     scrollEventThrottle = _ref$scrollEventThrot === void 0 ? 100 : _ref$scrollEventThrot,
-    props = _objectWithoutProperties(_ref, _excluded$x);
+    props = _objectWithoutProperties(_ref, _excluded$y);
   var _useContext = useContext(BottomSheetContext),
     setInternalShowDivider = _useContext.setInternalShowDivider;
   var onScrollBeginDrag = useCallback(function (e) {
@@ -14183,7 +14182,7 @@ var setStartOrEndDate = function setStartOrEndDate(_ref2) {
   };
 };
 var shouldUseMonthPicker = function shouldUseMonthPicker(onMonthChange) {
-  return onMonthChange !== noop$2;
+  return onMonthChange !== noop$3;
 };
 var getCalendarDate = function getCalendarDate(_ref3) {
   var visibleDate = _ref3.visibleDate,
@@ -14319,20 +14318,20 @@ var CalendarRange = function CalendarRange(_ref) {
     visibleDate = _ref.visibleDate,
     onChange = _ref.onChange,
     _ref$onPreviousPress = _ref.onPreviousPress,
-    onPreviousPress = _ref$onPreviousPress === void 0 ? noop$2 : _ref$onPreviousPress,
+    onPreviousPress = _ref$onPreviousPress === void 0 ? noop$3 : _ref$onPreviousPress,
     _ref$onNextPress = _ref.onNextPress,
-    onNextPress = _ref$onNextPress === void 0 ? noop$2 : _ref$onNextPress,
+    onNextPress = _ref$onNextPress === void 0 ? noop$3 : _ref$onNextPress,
     _ref$onTitlePress = _ref.onTitlePress,
-    onTitlePress = _ref$onTitlePress === void 0 ? noop$2 : _ref$onTitlePress,
+    onTitlePress = _ref$onTitlePress === void 0 ? noop$3 : _ref$onTitlePress,
     minDate = _ref.minDate,
     maxDate = _ref.maxDate,
     _ref$markedDates = _ref.markedDates,
     markedDates = _ref$markedDates === void 0 ? [] : _ref$markedDates,
     testID = _ref.testID,
     _ref$onMonthChange = _ref.onMonthChange,
-    onMonthChange = _ref$onMonthChange === void 0 ? noop$2 : _ref$onMonthChange,
+    onMonthChange = _ref$onMonthChange === void 0 ? noop$3 : _ref$onMonthChange,
     _ref$onToggleMonthPic = _ref.onToggleMonthPicker,
-    onToggleMonthPicker = _ref$onToggleMonthPic === void 0 ? noop$2 : _ref$onToggleMonthPic,
+    onToggleMonthPicker = _ref$onToggleMonthPic === void 0 ? noop$3 : _ref$onToggleMonthPic,
     monthPickerConfirmLabel = _ref.monthPickerConfirmLabel,
     monthPickerCancelLabel = _ref.monthPickerCancelLabel;
   var theme = useTheme();
@@ -14500,20 +14499,20 @@ var Calendar$1 = function Calendar(_ref) {
     visibleDate = _ref.visibleDate,
     onChange = _ref.onChange,
     _ref$onPreviousPress = _ref.onPreviousPress,
-    onPreviousPress = _ref$onPreviousPress === void 0 ? noop$2 : _ref$onPreviousPress,
+    onPreviousPress = _ref$onPreviousPress === void 0 ? noop$3 : _ref$onPreviousPress,
     _ref$onNextPress = _ref.onNextPress,
-    onNextPress = _ref$onNextPress === void 0 ? noop$2 : _ref$onNextPress,
+    onNextPress = _ref$onNextPress === void 0 ? noop$3 : _ref$onNextPress,
     _ref$onTitlePress = _ref.onTitlePress,
-    onTitlePress = _ref$onTitlePress === void 0 ? noop$2 : _ref$onTitlePress,
+    onTitlePress = _ref$onTitlePress === void 0 ? noop$3 : _ref$onTitlePress,
     minDate = _ref.minDate,
     maxDate = _ref.maxDate,
     _ref$markedDates = _ref.markedDates,
     markedDates = _ref$markedDates === void 0 ? [] : _ref$markedDates,
     testID = _ref.testID,
     _ref$onMonthChange = _ref.onMonthChange,
-    onMonthChange = _ref$onMonthChange === void 0 ? noop$2 : _ref$onMonthChange,
+    onMonthChange = _ref$onMonthChange === void 0 ? noop$3 : _ref$onMonthChange,
     _ref$onToggleMonthPic = _ref.onToggleMonthPicker,
-    onToggleMonthPicker = _ref$onToggleMonthPic === void 0 ? noop$2 : _ref$onToggleMonthPic,
+    onToggleMonthPicker = _ref$onToggleMonthPic === void 0 ? noop$3 : _ref$onToggleMonthPic,
     monthPickerConfirmLabel = _ref.monthPickerConfirmLabel,
     monthPickerCancelLabel = _ref.monthPickerCancelLabel;
   var theme = useTheme();
@@ -14691,12 +14690,12 @@ var Indicator = index$c(View)(function (_ref3) {
   };
 });
 
-var _excluded$w = ["intent", "children"];
+var _excluded$x = ["intent", "children"];
 var DataCard = function DataCard(_ref) {
   var _ref$intent = _ref.intent,
     intent = _ref$intent === void 0 ? 'info' : _ref$intent,
     children = _ref.children,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$w);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$x);
   return /*#__PURE__*/React__default.createElement(StyledDataCard, nativeProps, /*#__PURE__*/React__default.createElement(Indicator, {
     themeIntent: intent,
     testID: "data-card-indicator"
@@ -14715,13 +14714,13 @@ var StyledCard$1 = index$c(View)(function (_ref) {
   });
 });
 
-var _excluded$v = ["intent", "children", "variant"];
+var _excluded$w = ["intent", "children", "variant"];
 var Card$1 = function Card(_ref) {
   var intent = _ref.intent,
     children = _ref.children,
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'basic' : _ref$variant,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$v);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$w);
   return /*#__PURE__*/React__default.createElement(StyledCard$1, _extends$1({}, nativeProps, {
     themeIntent: intent,
     themeVariant: variant
@@ -14988,7 +14987,7 @@ var CardCarousel = /*#__PURE__*/forwardRef(function (_ref, ref) {
 });
 CardCarousel.displayName = 'CardCarousel';
 
-var _excluded$u = ["rounded", "size", "testID", "style"];
+var _excluded$v = ["rounded", "size", "testID", "style"];
 /**
  * @deprecated Image component will soon be deprecated. Please use `Image` from `react-native` instead.
  */
@@ -14999,7 +14998,7 @@ var Image = function Image(_ref) {
     size = _ref$size === void 0 ? '6xlarge' : _ref$size,
     testID = _ref.testID,
     style = _ref.style,
-    imageNativeProps = _objectWithoutProperties(_ref, _excluded$u);
+    imageNativeProps = _objectWithoutProperties(_ref, _excluded$v);
   useDeprecation('Image component will soon be deprecated. Please use `Image` from `react-native` instead.');
   var theme = useTheme();
   var imageSize = theme.__hd__.image.sizes[size];
@@ -15134,7 +15133,7 @@ var CarouselItem = function CarouselItem(_ref) {
   }, heading), !!body && /*#__PURE__*/React__default.createElement(Typography.Body, null, body)));
 };
 
-var _excluded$t = ["items", "onItemIndexChange", "renderActions", "selectedItemIndex", "style", "shouldShowPagination", "testID", "pageControlPosition"];
+var _excluded$u = ["items", "onItemIndexChange", "renderActions", "selectedItemIndex", "style", "shouldShowPagination", "testID", "pageControlPosition"];
 function useStateFromProp(initialValue) {
   var _useState = useState(initialValue),
     _useState2 = _slicedToArray(_useState, 2),
@@ -15145,7 +15144,7 @@ function useStateFromProp(initialValue) {
   }, [initialValue]);
   return [value, setValue];
 }
-var noop$1 = function noop(_) {
+var noop$2 = function noop(_) {
   return true;
 };
 var Carousel = function Carousel(_ref) {
@@ -15157,12 +15156,12 @@ var Carousel = function Carousel(_ref) {
     selectedItemIndex = _ref$selectedItemInde === void 0 ? 0 : _ref$selectedItemInde,
     style = _ref.style,
     _ref$shouldShowPagina = _ref.shouldShowPagination,
-    shouldShowPagination = _ref$shouldShowPagina === void 0 ? noop$1 : _ref$shouldShowPagina,
+    shouldShowPagination = _ref$shouldShowPagina === void 0 ? noop$2 : _ref$shouldShowPagina,
     testID = _ref.testID,
     _ref$pageControlPosit = _ref.pageControlPosition,
     pageControlPosition = _ref$pageControlPosit === void 0 ? 'top' : _ref$pageControlPosit,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$t);
-  useDeprecation("shouldShowPagination prop has been deprecated", shouldShowPagination !== noop$1);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$u);
+  useDeprecation("shouldShowPagination prop has been deprecated", shouldShowPagination !== noop$2);
   useDeprecation("The use of 'pageControlPosition == bottom' has been deprecated", pageControlPosition === 'bottom');
   var theme = useTheme();
   var carouselRef = useRef(null);
@@ -15883,7 +15882,7 @@ function range(start, stop, step) {
   return range;
 }
 
-var noop = {
+var noop$1 = {
   value: function value() {}
 };
 function dispatch() {
@@ -15957,7 +15956,7 @@ function get$1(type, name) {
 function set$1(type, name, callback) {
   for (var i = 0, n = type.length; i < n; ++i) {
     if (type[i].name === name) {
-      type[i] = noop, type = type.slice(0, i).concat(type.slice(i + 1));
+      type[i] = noop$1, type = type.slice(0, i).concat(type.slice(i + 1));
       break;
     }
   }
@@ -20432,7 +20431,7 @@ var StyledChipIcon = index$c(Icon)(function (_ref2) {
   };
 });
 
-var _excluded$s = ["label", "variant", "selected", "icon", "onPress", "showSelectedIcon", "accessible", "onBlur", "onFocus"];
+var _excluded$t = ["label", "variant", "selected", "icon", "onPress", "showSelectedIcon", "accessible", "onBlur", "onFocus"];
 var getChipLabel = function getChipLabel(label) {
   if (typeof label === 'string') {
     return /*#__PURE__*/React__default.createElement(Typography.Body, {
@@ -20468,7 +20467,7 @@ var Chip = function Chip(_ref) {
     accessible = _ref.accessible,
     onBlur = _ref.onBlur,
     onFocus = _ref.onFocus,
-    otherProps = _objectWithoutProperties(_ref, _excluded$s);
+    otherProps = _objectWithoutProperties(_ref, _excluded$t);
   useDeprecation('Chip variant `outlined` and `filled` are deprecated.', variant === 'outlined' || variant === 'filled');
   var renamedVariant = getChipVariant(variant);
   var shouldShowSelectedIcon = (renamedVariant === 'selection' || renamedVariant === 'compact-outlined') && selected && showSelectedIcon;
@@ -20859,7 +20858,7 @@ var StyledErrorAndMaxLengthContainer = index$c(View)(function (_ref14) {
   };
 });
 
-var _excluded$r = ["label", "prefix", "suffix", "style", "textStyle", "testID", "accessibilityLabelledBy", "error", "required", "editable", "disabled", "loading", "maxLength", "hideCharacterCount", "helpText", "value", "defaultValue", "renderInputValue", "allowFontScaling", "variant"];
+var _excluded$s = ["label", "prefix", "suffix", "style", "textStyle", "testID", "accessibilityLabelledBy", "error", "required", "editable", "disabled", "loading", "maxLength", "hideCharacterCount", "helpText", "value", "defaultValue", "renderInputValue", "allowFontScaling", "variant"];
 var getState$3 = function getState(_ref) {
   var disabled = _ref.disabled,
     error = _ref.error,
@@ -20975,7 +20974,7 @@ var TextInput = /*#__PURE__*/forwardRef(function (_ref8, ref) {
     allowFontScaling = _ref8$allowFontScalin === void 0 ? false : _ref8$allowFontScalin,
     _ref8$variant = _ref8.variant,
     variant = _ref8$variant === void 0 ? 'text' : _ref8$variant,
-    nativeProps = _objectWithoutProperties(_ref8, _excluded$r);
+    nativeProps = _objectWithoutProperties(_ref8, _excluded$s);
   var displayText = getDisplayText(value, defaultValue);
   var isEmptyValue = displayText.length === 0;
   var _React$useState = React__default.useState(0),
@@ -21722,11 +21721,11 @@ var DatePickerIOS = function DatePickerIOS(_ref) {
   }));
 };
 
-var _excluded$q = ["variant"];
+var _excluded$r = ["variant"];
 var DatePicker = function DatePicker(_ref) {
   var _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'default' : _ref$variant,
-    props = _objectWithoutProperties(_ref, _excluded$q);
+    props = _objectWithoutProperties(_ref, _excluded$r);
   if (variant === 'calendar') {
     return /*#__PURE__*/React__default.createElement(DatePickerCalendar, props);
   }
@@ -21807,7 +21806,7 @@ var StyledDragableDrawerContainer = index$c(Animated.View)(function (_ref5) {
     backgroundColor: theme.__hd__.drawer.colors.background,
     elevation: enableShadow ? theme.__hd__.drawer.shadows.elevation : undefined,
     overflow: 'hidden',
-    maxHeight: '100%'
+    height: '100%'
   };
 });
 var StyledHandlerContainer$1 = index$c(View)(function (_ref6) {
@@ -21828,6 +21827,23 @@ var StyledHandler = index$c(View)(function (_ref7) {
   };
 });
 
+var noop = function noop() {
+  return {};
+};
+var DragableDrawerContext = /*#__PURE__*/createContext({
+  isAtMaxHeight: false,
+  scrollYRef: {
+    current: 0
+  },
+  onScrollY: noop,
+  beginPan: noop,
+  movePan: noop,
+  releasePan: noop
+});
+var useDragableDrawerContext = function useDragableDrawerContext() {
+  return useContext(DragableDrawerContext);
+};
+
 var getOffset = function getOffset(height, percentage) {
   if (percentage < 0) return height;
   if (percentage > 100) return 0;
@@ -21856,34 +21872,39 @@ var calculateAnimatedToValue = function calculateAnimatedToValue(position, heigh
   return heightSnapPoints[minIndex];
 };
 
-var DragableDrawer = function DragableDrawer(_ref) {
-  var children = _ref.children,
+var FLICK_VELOCITY_THRESHOLD = 0.3;
+var SHORT_DRAG_THRESHOLD_PX = 20;
+var VELOCITY_PROJECTION_FACTOR = 200;
+var useDragablePan = function useDragablePan(_ref) {
+  var height = _ref.height,
     initialHeightPercentage = _ref.initialHeightPercentage,
-    _ref$minimumHeightPer = _ref.minimumHeightPercentage,
-    minimumHeightPercentage = _ref$minimumHeightPer === void 0 ? 10 : _ref$minimumHeightPer,
-    _ref$snapPoints = _ref.snapPoints,
-    snapPoints = _ref$snapPoints === void 0 ? [] : _ref$snapPoints,
+    minimumHeightPercentage = _ref.minimumHeightPercentage,
+    snapPoints = _ref.snapPoints,
     onExpanded = _ref.onExpanded,
-    onCollapsed = _ref.onCollapsed,
-    testID = _ref.testID;
-  var _useState = useState(0),
-    _useState2 = _slicedToArray(_useState, 2),
-    height = _useState2[0],
-    setHeight = _useState2[1];
+    onCollapsed = _ref.onCollapsed;
   var baseHeightForMeasure = useRef(0);
   var snapPointsData = useRef({
     list: [],
     minHeightOffset: 0,
     maxHeightOffset: 0
   });
-  // Track drag
   var pan = useRef(new Animated.Value(0)).current;
   var offset = useRef(0);
   var offsetBeforePan = useRef(0);
-  var _useState3 = useState(-1),
+  var _useState = useState(-1),
+    _useState2 = _slicedToArray(_useState, 2),
+    animatedToValue = _useState2[0],
+    setAnimatedToValue = _useState2[1];
+  var _useState3 = useState(false),
     _useState4 = _slicedToArray(_useState3, 2),
-    animatedToValue = _useState4[0],
-    setAnimatedToValue = _useState4[1];
+    isAtMaxHeight = _useState4[0],
+    setIsAtMaxHeight = _useState4[1];
+  var scrollYRef = useRef(0);
+  var minimumHeightPercentageRef = useRef(minimumHeightPercentage);
+  minimumHeightPercentageRef.current = minimumHeightPercentage;
+  var onScrollY = useCallback(function (y) {
+    scrollYRef.current = y;
+  }, []);
   useEffect(function () {
     var id = pan.addListener(function (_ref2) {
       var value = _ref2.value;
@@ -21898,13 +21919,12 @@ var DragableDrawer = function DragableDrawer(_ref) {
       var initialOffset = getOffset(height, initialHeightPercentage || minimumHeightPercentage);
       setAnimatedToValue(initialOffset);
     }
-  }, [height]);
+  }, [height, initialHeightPercentage, minimumHeightPercentage]);
   useEffect(function () {
     if (height > 0) {
       pan.setValue(height);
       offset.current = height;
       baseHeightForMeasure.current = height;
-      // Calculate snap points information
       snapPointsData.current = calculateSnapPointsData(minimumHeightPercentage, height, snapPoints);
     }
   }, [height, minimumHeightPercentage]);
@@ -21915,11 +21935,18 @@ var DragableDrawer = function DragableDrawer(_ref) {
         useNativeDriver: Platform.OS !== 'web',
         easing: Easing.inOut(Easing.cubic)
       });
-      animation.start(function () {
-        if (animatedToValue === 0) {
-          onExpanded === null || onExpanded === void 0 || onExpanded();
-        } else if (animatedToValue === getOffset(height, minimumHeightPercentage)) {
-          onCollapsed === null || onCollapsed === void 0 || onCollapsed();
+      animation.start(function (_ref3) {
+        var finished = _ref3.finished;
+        if (finished) {
+          if (animatedToValue === 0) {
+            setIsAtMaxHeight(true);
+            onExpanded === null || onExpanded === void 0 || onExpanded();
+          } else {
+            setIsAtMaxHeight(false);
+            if (animatedToValue === getOffset(height, minimumHeightPercentage)) {
+              onCollapsed === null || onCollapsed === void 0 || onCollapsed();
+            }
+          }
         }
         setAnimatedToValue(-1);
       });
@@ -21927,41 +21954,130 @@ var DragableDrawer = function DragableDrawer(_ref) {
         return animation.stop();
       };
     }
-  }, [animatedToValue]);
+  }, [animatedToValue, onExpanded, onCollapsed, height, minimumHeightPercentage]);
+  var beginPan = useCallback(function () {
+    pan.stopAnimation();
+    setIsAtMaxHeight(false);
+    offsetBeforePan.current = offset.current;
+    pan.setOffset(offset.current);
+    pan.setValue(0);
+  }, []);
+  var movePan = useCallback(function (dy) {
+    var _snapPointsData$curre;
+    // Moving toward top, stop at highest snap point
+    if (offsetBeforePan.current + dy < 0) {
+      pan.setValue(-offsetBeforePan.current);
+      return;
+    }
+    // Moving toward bottom, stop at lowest snap point
+    if (offsetBeforePan.current + dy > ((_snapPointsData$curre = snapPointsData.current) === null || _snapPointsData$curre === void 0 ? void 0 : _snapPointsData$curre.minHeightOffset)) {
+      pan.setValue(baseHeightForMeasure.current - baseHeightForMeasure.current * (minimumHeightPercentageRef.current / 100) - offsetBeforePan.current);
+      return;
+    }
+    pan.setValue(dy);
+  }, []);
+  var releasePan = useCallback(function (dy, vy) {
+    pan.flattenOffset();
+    var offsetAfterPan = offsetBeforePan.current + dy;
+    // Flick or short downward drag: snap to the next lower snap point.
+    if (vy > FLICK_VELOCITY_THRESHOLD || dy > SHORT_DRAG_THRESHOLD_PX) {
+      var lowerPoints = snapPointsData.current.list.filter(function (p) {
+        return p > offsetBeforePan.current;
+      }).sort(function (a, b) {
+        return a - b;
+      });
+      if (lowerPoints.length > 0) {
+        setAnimatedToValue(lowerPoints[0]);
+        return;
+      }
+    }
+    // Upward flick or drag: project the intended landing position using
+    // velocity, then snap to the nearest higher snap point to that projection.
+    // This allows fast flicks to skip intermediate snap points.
+    if (vy < -FLICK_VELOCITY_THRESHOLD || dy < -SHORT_DRAG_THRESHOLD_PX) {
+      var projected = offsetAfterPan + vy * VELOCITY_PROJECTION_FACTOR;
+      var higherPoints = snapPointsData.current.list.filter(function (p) {
+        return p < offsetBeforePan.current;
+      }).sort(function (a, b) {
+        return b - a;
+      });
+      if (higherPoints.length > 0) {
+        setAnimatedToValue(calculateAnimatedToValue(projected, higherPoints));
+        return;
+      }
+    }
+    // Otherwise: snap to nearest.
+    setAnimatedToValue(calculateAnimatedToValue(offsetAfterPan, snapPointsData.current.list));
+  }, []);
   var panResponder = useRef(PanResponder.create({
     onMoveShouldSetPanResponder: function onMoveShouldSetPanResponder() {
       return true;
     },
     onPanResponderGrant: function onPanResponderGrant() {
-      offsetBeforePan.current = offset.current;
-      pan.setOffset(offset.current);
-      pan.setValue(0);
+      return beginPan();
     },
     onPanResponderMove: function onPanResponderMove(_, gesture) {
-      var _snapPointsData$curre;
-      var panDistance = gesture.dy;
-      // Moving toward top, stop at highest snap point
-      if (offsetBeforePan.current + panDistance < 0) {
-        pan.setValue(-offsetBeforePan.current);
-        return;
-      }
-      // Moving toward bottom, stop at lowest snap point
-      if (offsetBeforePan.current + panDistance > ((_snapPointsData$curre = snapPointsData.current) === null || _snapPointsData$curre === void 0 ? void 0 : _snapPointsData$curre.minHeightOffset)) {
-        pan.setValue(baseHeightForMeasure.current - baseHeightForMeasure.current * (minimumHeightPercentage / 100) - offsetBeforePan.current);
-        return;
-      }
-      pan.setValue(panDistance);
+      return movePan(gesture.dy);
     },
     onPanResponderRelease: function onPanResponderRelease(_, gesture) {
-      pan.flattenOffset();
-      // Attach to nearest snappoint
-      var panDistance = gesture.dy;
-      var offsetAfterPan = offsetBeforePan.current + panDistance;
-      var animatedValue = calculateAnimatedToValue(offsetAfterPan, snapPointsData.current.list);
-      setAnimatedToValue(animatedValue);
+      return releasePan(gesture.dy, gesture.vy);
     }
   })).current;
-  return /*#__PURE__*/React__default.createElement(StyledDragableContainer, {
+  return {
+    pan: pan,
+    isAtMaxHeight: isAtMaxHeight,
+    scrollYRef: scrollYRef,
+    onScrollY: onScrollY,
+    beginPan: beginPan,
+    movePan: movePan,
+    releasePan: releasePan,
+    panHandlers: panResponder.panHandlers
+  };
+};
+
+var DragableDrawer = function DragableDrawer(_ref) {
+  var children = _ref.children,
+    initialHeightPercentage = _ref.initialHeightPercentage,
+    _ref$minimumHeightPer = _ref.minimumHeightPercentage,
+    minimumHeightPercentage = _ref$minimumHeightPer === void 0 ? 10 : _ref$minimumHeightPer,
+    _ref$snapPoints = _ref.snapPoints,
+    snapPoints = _ref$snapPoints === void 0 ? [] : _ref$snapPoints,
+    onExpanded = _ref.onExpanded,
+    onCollapsed = _ref.onCollapsed,
+    testID = _ref.testID;
+  var _useState = useState(0),
+    _useState2 = _slicedToArray(_useState, 2),
+    height = _useState2[0],
+    setHeight = _useState2[1];
+  var _useDragablePan = useDragablePan({
+      height: height,
+      initialHeightPercentage: initialHeightPercentage,
+      minimumHeightPercentage: minimumHeightPercentage,
+      snapPoints: snapPoints,
+      onExpanded: onExpanded,
+      onCollapsed: onCollapsed
+    }),
+    pan = _useDragablePan.pan,
+    isAtMaxHeight = _useDragablePan.isAtMaxHeight,
+    scrollYRef = _useDragablePan.scrollYRef,
+    onScrollY = _useDragablePan.onScrollY,
+    beginPan = _useDragablePan.beginPan,
+    movePan = _useDragablePan.movePan,
+    releasePan = _useDragablePan.releasePan,
+    panHandlers = _useDragablePan.panHandlers;
+  var contextValue = useMemo(function () {
+    return {
+      isAtMaxHeight: isAtMaxHeight,
+      scrollYRef: scrollYRef,
+      onScrollY: onScrollY,
+      beginPan: beginPan,
+      movePan: movePan,
+      releasePan: releasePan
+    };
+  }, [isAtMaxHeight, onScrollY, beginPan, movePan, releasePan]);
+  return /*#__PURE__*/React__default.createElement(DragableDrawerContext.Provider, {
+    value: contextValue
+  }, /*#__PURE__*/React__default.createElement(StyledDragableContainer, {
     testID: testID,
     enableShadow: true,
     pointerEvents: "box-none"
@@ -21969,16 +22085,106 @@ var DragableDrawer = function DragableDrawer(_ref) {
     enableShadow: true,
     style: {
       transform: [{
-        scaleY: baseHeightForMeasure.current > 0 ? 1 : 0
+        scaleY: height > 0 ? 1 : 0
       }, {
         translateY: pan
       }]
     },
-    onLayout: function onLayout(_ref3) {
-      var nativeEvent = _ref3.nativeEvent;
+    onLayout: function onLayout(_ref2) {
+      var nativeEvent = _ref2.nativeEvent;
       setHeight(nativeEvent.layout.height);
     }
-  }, /*#__PURE__*/React__default.createElement(StyledHandlerContainer$1, panResponder.panHandlers, /*#__PURE__*/React__default.createElement(StyledHandler, null)), children));
+  }, /*#__PURE__*/React__default.createElement(StyledHandlerContainer$1, panHandlers, /*#__PURE__*/React__default.createElement(StyledHandler, null)), children)));
+};
+
+var _excluded$q = ["onScroll", "onScrollEndDrag", "onMomentumScrollEnd", "scrollEventThrottle", "children"];
+// scrollY tolerance: treat anything within this many pixels of the top as
+// "at scroll top" to handle fractional pixels and throttled scroll events.
+var SCROLL_TOP_THRESHOLD_PX = 5;
+// Minimum downward finger movement before the pull-down collapse is triggered.
+var PULL_DOWN_THRESHOLD_PX = 10;
+var DEFAULT_SCROLL_EVENT_THROTTLE = 16;
+/**
+ * A ScrollView that coordinates with a parent DragableDrawer.
+ *
+ * - Drawer below max height: all gestures move the drawer; scroll is locked.
+ * - Drawer at max height: native scrolling works normally.
+ * - Drawer at max + scrolled to top + pull down: drawer collapses.
+ *
+ * The native ScrollView with bounces={false}/overScrollMode="never" will not
+ * intercept a downward gesture at scrollY=0 (nothing left to scroll), so
+ * onMoveShouldSetPanResponderCapture fires cleanly on both platforms.
+ * onScrollEndDrag + onMomentumScrollEnd ensure scrollYRef is up-to-date
+ * before the next gesture starts.
+ */
+var DragableScrollView = function DragableScrollView(_ref) {
+  var onScroll = _ref.onScroll,
+    onScrollEndDragProp = _ref.onScrollEndDrag,
+    onMomentumScrollEndProp = _ref.onMomentumScrollEnd,
+    _ref$scrollEventThrot = _ref.scrollEventThrottle,
+    scrollEventThrottle = _ref$scrollEventThrot === void 0 ? DEFAULT_SCROLL_EVENT_THROTTLE : _ref$scrollEventThrot,
+    children = _ref.children,
+    props = _objectWithoutProperties(_ref, _excluded$q);
+  var _useDragableDrawerCon = useDragableDrawerContext(),
+    isAtMaxHeight = _useDragableDrawerCon.isAtMaxHeight,
+    scrollYRef = _useDragableDrawerCon.scrollYRef,
+    onScrollY = _useDragableDrawerCon.onScrollY,
+    beginPan = _useDragableDrawerCon.beginPan,
+    movePan = _useDragableDrawerCon.movePan,
+    releasePan = _useDragableDrawerCon.releasePan;
+  // Mirror context value into a ref so PanResponder closures always read
+  // the latest value (PanResponder is created once and closures are frozen).
+  var isAtMaxHeightRef = useRef(isAtMaxHeight);
+  isAtMaxHeightRef.current = isAtMaxHeight;
+  var panResponder = useRef(PanResponder.create({
+    // Drawer below max: capture on start so the native ScrollView never
+    // gets the touch and scroll is completely locked.
+    onStartShouldSetPanResponderCapture: function onStartShouldSetPanResponderCapture() {
+      return !isAtMaxHeightRef.current;
+    },
+    // Drawer at max + scroll at top + pull down: recapture for collapse.
+    // bounces={false} / overScrollMode="never" means the native ScrollView
+    // has nothing to do here, so it will not intercept the gesture and this
+    // capture fires reliably before any scroll activity begins.
+    onMoveShouldSetPanResponderCapture: function onMoveShouldSetPanResponderCapture(_, gesture) {
+      return isAtMaxHeightRef.current && scrollYRef.current <= SCROLL_TOP_THRESHOLD_PX && gesture.dy > PULL_DOWN_THRESHOLD_PX;
+    },
+    onPanResponderGrant: function onPanResponderGrant() {
+      return beginPan();
+    },
+    onPanResponderMove: function onPanResponderMove(_, gesture) {
+      return movePan(gesture.dy);
+    },
+    onPanResponderRelease: function onPanResponderRelease(_, gesture) {
+      return releasePan(gesture.dy, gesture.vy);
+    }
+  })).current;
+  var handleScroll = function handleScroll(e) {
+    onScrollY(e.nativeEvent.contentOffset.y);
+    onScroll === null || onScroll === void 0 || onScroll(e);
+  };
+  // Keep scrollYRef accurate at every scroll boundary so the next gesture
+  // checks the correct position even when onScroll is throttled.
+  var handleScrollEndDrag = function handleScrollEndDrag(e) {
+    onScrollY(e.nativeEvent.contentOffset.y);
+    onScrollEndDragProp === null || onScrollEndDragProp === void 0 || onScrollEndDragProp(e);
+  };
+  var handleMomentumScrollEnd = function handleMomentumScrollEnd(e) {
+    onScrollY(e.nativeEvent.contentOffset.y);
+    onMomentumScrollEndProp === null || onMomentumScrollEndProp === void 0 || onMomentumScrollEndProp(e);
+  };
+  return /*#__PURE__*/React__default.createElement(View, _extends$1({}, panResponder.panHandlers, {
+    style: {
+      flex: 1
+    }
+  }), /*#__PURE__*/React__default.createElement(ScrollView, _extends$1({}, props, {
+    scrollEnabled: isAtMaxHeight,
+    onScroll: handleScroll,
+    onScrollEndDrag: handleScrollEndDrag,
+    onMomentumScrollEnd: handleMomentumScrollEnd,
+    scrollEventThrottle: scrollEventThrottle,
+    overScrollMode: "always"
+  }), children));
 };
 
 var BACKDROP_OPACITY = 0.56;
@@ -22039,7 +22245,8 @@ var Drawer = function Drawer(_ref) {
   }, children));
 };
 var index$7 = Object.assign(Drawer, {
-  Dragable: DragableDrawer
+  Dragable: DragableDrawer,
+  DragableScrollView: DragableScrollView
 });
 
 var DEFAULT_ILLUSTRATION_SIZE = scale(72);
@@ -24164,7 +24371,7 @@ var FABWithTitleStyle = /*#__PURE__*/forwardRef(function (_ref3, ref) {
     return {
       show: function show() {
         var animated = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
-        var callback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : noop$2;
+        var callback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : noop$3;
         setDisplayState({
           hideButton: false,
           hideTitle: false
@@ -24185,7 +24392,7 @@ var FABWithTitleStyle = /*#__PURE__*/forwardRef(function (_ref3, ref) {
       },
       collapse: function collapse() {
         var animated = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
-        var callback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : noop$2;
+        var callback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : noop$3;
         setDisplayState({
           hideButton: false,
           hideTitle: true
@@ -24206,7 +24413,7 @@ var FABWithTitleStyle = /*#__PURE__*/forwardRef(function (_ref3, ref) {
       },
       hide: function hide() {
         var animated = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
-        var callback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : noop$2;
+        var callback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : noop$3;
         if (animated) {
           Animated.stagger(20, [Animated.spring(animatedValues.opacity, {
             toValue: 0,
@@ -27531,7 +27738,7 @@ var SuccessPage = function SuccessPage(_ref2) {
     testID = _ref2.testID,
     ctaText = _ref2.ctaText,
     _ref2$onCtaPress = _ref2.onCtaPress,
-    onCtaPress = _ref2$onCtaPress === void 0 ? noop$2 : _ref2$onCtaPress,
+    onCtaPress = _ref2$onCtaPress === void 0 ? noop$3 : _ref2$onCtaPress,
     secondaryCtaText = _ref2.secondaryCtaText,
     onSecondaryCtaPress = _ref2.onSecondaryCtaPress,
     icon = _ref2.icon,