@yahoo/uds-mobile 2.3.4 → 2.4.1

package/dist/components/BottomSheet/BottomSheet.d.ts

@@ -0,0 +1,33 @@
+
+import { BottomSheetProps } from "./types.js";
+import * as react from "react";
+
+//#region src/components/BottomSheet/BottomSheet.d.ts
+/**
+ * The core bottom sheet component for React Native.
+ *
+ * Renders a draggable, spring-animated sheet that snaps to configurable height
+ * positions. Supports modal (with scrim, blocks background interaction) and
+ * non-modal (no scrim, background remains interactive) modes, scroll coordination,
+ * keyboard avoidance, and optional edge-to-edge expansion at the max snap point.
+ *
+ * Must be wrapped in a {@link BottomSheetProvider} or provided a `controller` prop
+ * created via {@link useBottomSheetStore}.
+ *
+ * @example
+ * ```tsx
+ * const store = useBottomSheetStore();
+ *
+ * <BottomSheetProvider controller={store}>
+ *   <BottomSheetTrigger render={<Button>Open</Button>} />
+ *   <BottomSheet snapPoints={['30%', '80%']}>
+ *     <BottomSheetHeader>Title</BottomSheetHeader>
+ *     <BottomSheetContent>...</BottomSheetContent>
+ *   </BottomSheet>
+ * </BottomSheetProvider>
+ * ```
+ */
+declare const BottomSheet: react.NamedExoticComponent<BottomSheetProps>;
+//#endregion
+export { BottomSheet };
+//# sourceMappingURL=BottomSheet.d.ts.map

package/dist/components/BottomSheet/BottomSheet.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheet.d.ts","names":[],"sources":["../../../src/components/BottomSheet/BottomSheet.tsx"],"mappings":";;;;;;;;AAwBiB;;;;;;;;;;;;;;;;;;;;;cA0DX,WAAA,EAAW,KAAA,CAAA,oBAAA,CAAA,gBAAA"}

package/dist/components/BottomSheet/BottomSheet.js

@@ -0,0 +1,334 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { Portal } from "../../portal.js";
+import { AndroidBackHandler } from "../AndroidBackHandler.js";
+import { Box } from "../Box.js";
+import { Scrim } from "../Scrim.js";
+import { loadListeners, loadState, nativeModule } from "../../native/UDSScreenCornerRadiusModule.js";
+import { BottomSheetInternalProvider } from "./BottomSheetInternalProvider.js";
+import { BottomSheetProvider, useBottomSheetContext } from "./BottomSheetProvider.js";
+import { BottomSheetHandle } from "./BottomSheetHandle.js";
+import { resolveHeightToPx } from "./utils.js";
+import { useBottomSheetDrag } from "./useBottomSheetDrag.js";
+import { useBottomSheetSnapModel } from "./useBottomSheetSnapModel.js";
+import { useExpansionMargins } from "./useExpansionMargins.js";
+import { useKeyboardAvoidance } from "./useKeyboardAvoidance.js";
+import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { Dimensions, Platform, StyleSheet, View } from "react-native";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { bottomSheetStyles } from "../../../generated/styles";
+import Animated, { interpolate, useAnimatedStyle, useSharedValue } from "react-native-reanimated";
+import { GestureDetector, GestureHandlerRootView } from "react-native-gesture-handler";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
+import { FullWindowOverlay } from "react-native-screens";
+
+//#region src/components/BottomSheet/BottomSheet.tsx
+function useScreenCornerRadius() {
+	const [, forceUpdate] = useState(0);
+	useEffect(() => {
+		if (loadState === "pending") {
+			const listener = () => forceUpdate((n) => n + 1);
+			loadListeners.push(listener);
+			return () => {
+				const idx = loadListeners.indexOf(listener);
+				if (idx >= 0) loadListeners.splice(idx, 1);
+			};
+		}
+	}, []);
+	return {
+		module: nativeModule,
+		isLoaded: loadState === "loaded",
+		isFailed: loadState === "failed"
+	};
+}
+/**
+* The core bottom sheet component for React Native.
+*
+* Renders a draggable, spring-animated sheet that snaps to configurable height
+* positions. Supports modal (with scrim, blocks background interaction) and
+* non-modal (no scrim, background remains interactive) modes, scroll coordination,
+* keyboard avoidance, and optional edge-to-edge expansion at the max snap point.
+*
+* Must be wrapped in a {@link BottomSheetProvider} or provided a `controller` prop
+* created via {@link useBottomSheetStore}.
+*
+* @example
+* ```tsx
+* const store = useBottomSheetStore();
+*
+* <BottomSheetProvider controller={store}>
+*   <BottomSheetTrigger render={<Button>Open</Button>} />
+*   <BottomSheet snapPoints={['30%', '80%']}>
+*     <BottomSheetHeader>Title</BottomSheetHeader>
+*     <BottomSheetContent>...</BottomSheetContent>
+*   </BottomSheet>
+* </BottomSheetProvider>
+* ```
+*/
+const BottomSheet = memo(function BottomSheet({ children, controller: controllerProp, snapPoints: snapPointsProp, height, defaultSnapPointIndex = 0, snapPointIndex: snapPointIndexProp, onSnapPointChange, onClose, dismissible = true, enableDrag = true, modal = true, showHandleIndicator = true, fullWidthAtMaxSnap = false, enableOverstretch = true, blurTarget, shouldMatchDeviceCornerRadius = true }) {
+	const controller = useBottomSheetContext() ?? controllerProp;
+	const { module: screenCornerRadiusModule, isFailed: cornerRadiusFailed } = useScreenCornerRadius();
+	if (!controller) throw new Error("BottomSheet must be wrapped in BottomSheetProvider or provided a controller prop.");
+	if (cornerRadiusFailed) throw new Error("BottomSheet requires `expo-modules-core` to be installed.\nInstall it with: npx expo install expo-modules-core");
+	const { isOpen } = controller;
+	bottomSheetStyles.useVariants({});
+	const flatRoot = StyleSheet.flatten(bottomSheetStyles.root);
+	const marginHorizontal = flatRoot.marginHorizontal ?? 0;
+	const marginBottom = flatRoot.marginBottom ?? 0;
+	const blurIntensity = flatRoot.backgroundBlurRadius ?? 0;
+	const showBlurBox = blurIntensity > 0 && (Platform.OS === "ios" || blurTarget != null);
+	const opaqueBackground = flatRoot.backgroundColor ?? "#fff";
+	const sheetBackground = showBlurBox ? "transparent" : blurIntensity > 0 ? flatRoot.backgroundBlurColor ?? opaqueBackground : opaqueBackground;
+	const { top: safeTop, bottom: safeBottom } = useSafeAreaInsets();
+	const isDetached = marginBottom > 0 || marginHorizontal > 0;
+	const bottomInsetPx = isDetached ? marginBottom : 0;
+	const expandedBottomInsetPx = fullWidthAtMaxSnap ? 0 : bottomInsetPx;
+	const tokenBorderRadius = flatRoot.borderRadius ?? 16;
+	const screenCornerRadius = shouldMatchDeviceCornerRadius ? screenCornerRadiusModule?.getCornerRadiusSync() ?? 0 : 0;
+	const bottomCornerGap = isDetached ? Math.min(marginHorizontal, marginBottom + safeBottom) : 0;
+	const bottomCornerRadius = screenCornerRadius > 0 ? Math.max(0, screenCornerRadius - bottomCornerGap) : tokenBorderRadius;
+	const containerHeight = useSharedValue(Dimensions.get("window").height);
+	useEffect(() => {
+		const subscription = Dimensions.addEventListener("change", ({ window }) => {
+			containerHeight.value = window.height;
+		});
+		return () => subscription.remove();
+	}, [containerHeight]);
+	const { translateY, activeSnapIndex, isAnimating, resolvedSnapPoints, animateToSnap, animateToClose, animateToSnapWorklet, animateToCloseWorklet, getClosedTranslateY, getTranslateYForSnap } = useBottomSheetSnapModel({
+		snapPointsProp,
+		height,
+		defaultSnapPointIndex,
+		snapPointIndexProp,
+		onSnapPointChange,
+		containerHeight,
+		bottomInsetPx,
+		topInsetPx: safeTop,
+		sideInsetPx: marginHorizontal,
+		fullWidthAtMaxSnap,
+		expandedBottomInsetPx
+	});
+	const scrollOffsetY = useSharedValue(0);
+	const scrollLocked = useSharedValue(true);
+	const handleDismiss = useCallback(() => {
+		controller.close();
+	}, [controller]);
+	const { panGesture, panGestureRef, openTimeSV } = useBottomSheetDrag({
+		enableDrag,
+		dismissible,
+		enableOverstretch,
+		resolvedSnapPoints,
+		containerHeight,
+		bottomInsetPx,
+		translateY,
+		activeSnapIndex,
+		isAnimating,
+		animateToSnapWorklet,
+		animateToCloseWorklet,
+		onDismiss: handleDismiss,
+		scrollLocked,
+		scrollOffsetY,
+		getTranslateYForSnap
+	});
+	useKeyboardAvoidance({
+		isOpen,
+		translateY,
+		isAnimating
+	});
+	const { animatedMarginStyle: expansionMarginStyle, maxSnapTranslateY: expansionMaxSnapTranslateY, thresholdTranslateY: expansionThresholdTranslateY } = useExpansionMargins({
+		enabled: fullWidthAtMaxSnap,
+		baseMarginHorizontal: marginHorizontal,
+		baseMarginBottom: marginBottom,
+		resolvedSnapPoints,
+		containerHeight,
+		bottomInsetPx,
+		expandedBottomInsetPx,
+		translateY
+	});
+	const expansionEdgeStyle = useAnimatedStyle(() => {
+		if (!fullWidthAtMaxSnap) return {};
+		const bottomRadius = interpolate(translateY.value, [expansionMaxSnapTranslateY, expansionThresholdTranslateY], [0, bottomCornerRadius], "clamp");
+		return {
+			borderBottomLeftRadius: bottomRadius,
+			borderBottomRightRadius: bottomRadius,
+			paddingBottom: interpolate(translateY.value, [expansionMaxSnapTranslateY, expansionThresholdTranslateY], [safeBottom, 0], "clamp")
+		};
+	});
+	const internalContextValue = useMemo(() => ({
+		panGestureRef,
+		activeSnapIndex,
+		snapCount: resolvedSnapPoints.length,
+		scrollOffsetY,
+		scrollLocked
+	}), [
+		panGestureRef,
+		activeSnapIndex,
+		resolvedSnapPoints.length,
+		scrollOffsetY,
+		scrollLocked
+	]);
+	const wasOpen = useRef(false);
+	const [isRendered, setIsRendered] = useState(false);
+	useEffect(() => {
+		if (isOpen && !wasOpen.current) {
+			const initialIndex = snapPointIndexProp ?? defaultSnapPointIndex;
+			scrollOffsetY.value = 0;
+			scrollLocked.value = initialIndex !== resolvedSnapPoints.length - 1;
+			setIsRendered(true);
+			translateY.value = getClosedTranslateY();
+			openTimeSV.value = Date.now();
+			const timeout = setTimeout(() => {
+				animateToSnap(initialIndex);
+			}, 50);
+			wasOpen.current = true;
+			return () => clearTimeout(timeout);
+		}
+		if (!isOpen && wasOpen.current) {
+			animateToClose(() => {
+				setIsRendered(false);
+			});
+			onClose?.();
+			wasOpen.current = false;
+		}
+	}, [
+		isOpen,
+		snapPointIndexProp,
+		defaultSnapPointIndex,
+		translateY,
+		getClosedTranslateY,
+		animateToSnap,
+		animateToClose,
+		onClose,
+		openTimeSV,
+		scrollOffsetY,
+		scrollLocked,
+		resolvedSnapPoints.length
+	]);
+	useEffect(() => {
+		if (!isOpen || snapPointIndexProp === void 0) return;
+		animateToSnap(snapPointIndexProp);
+	}, [
+		isOpen,
+		snapPointIndexProp,
+		animateToSnap
+	]);
+	const animatedSheetStyle = useAnimatedStyle(() => {
+		let effectiveBottom = 0;
+		if (isDetached) {
+			effectiveBottom = bottomInsetPx;
+			if (fullWidthAtMaxSnap) effectiveBottom = interpolate(translateY.value, [expansionMaxSnapTranslateY, expansionThresholdTranslateY], [expandedBottomInsetPx, bottomInsetPx], "clamp");
+		}
+		return {
+			transform: [{ translateY: translateY.value }],
+			height: Math.max(100, containerHeight.value - translateY.value - effectiveBottom)
+		};
+	});
+	const initialIndex = snapPointIndexProp ?? defaultSnapPointIndex;
+	const windowH = modal ? Dimensions.get("window").height : 0;
+	const openSnapHeight = resolvedSnapPoints[initialIndex] ? resolveHeightToPx(resolvedSnapPoints[initialIndex], windowH) : 0;
+	const openTranslateY = windowH - Math.min(openSnapHeight, windowH - bottomInsetPx) - bottomInsetPx;
+	const closedTranslateY = windowH + bottomInsetPx;
+	if (!isOpen && !isRendered) return null;
+	const borderWidth = flatRoot.borderWidth ?? 0;
+	const sheetView = /* @__PURE__ */ jsx(GestureDetector, {
+		gesture: panGesture,
+		children: /* @__PURE__ */ jsxs(Animated.View, {
+			style: [
+				internalStyles.sheet,
+				{
+					backgroundColor: sheetBackground,
+					borderTopLeftRadius: tokenBorderRadius,
+					borderTopRightRadius: tokenBorderRadius,
+					borderBottomLeftRadius: bottomCornerRadius,
+					borderBottomRightRadius: bottomCornerRadius,
+					paddingTop: 8,
+					marginHorizontal,
+					overflow: "hidden"
+				},
+				animatedSheetStyle,
+				fullWidthAtMaxSnap ? expansionMarginStyle : void 0,
+				fullWidthAtMaxSnap ? expansionEdgeStyle : void 0
+			],
+			accessibilityRole: "none",
+			children: [
+				showBlurBox && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Box, {
+					style: StyleSheet.absoluteFill,
+					blur: blurIntensity,
+					blurTarget
+				}), /* @__PURE__ */ jsx(View, {
+					style: [StyleSheet.absoluteFill, { backgroundColor: flatRoot.backgroundBlurColor }],
+					pointerEvents: "none"
+				})] }),
+				showHandleIndicator && enableDrag && /* @__PURE__ */ jsx(BottomSheetHandle, {}),
+				/* @__PURE__ */ jsx(View, {
+					style: {
+						paddingHorizontal: flatRoot.paddingHorizontal ?? 16,
+						paddingBottom: flatRoot.paddingVertical ?? 8,
+						flex: 1
+					},
+					children: /* @__PURE__ */ jsx(BottomSheetInternalProvider, {
+						value: internalContextValue,
+						children
+					})
+				}),
+				borderWidth > 0 && /* @__PURE__ */ jsx(Animated.View, {
+					style: [
+						StyleSheet.absoluteFill,
+						{
+							borderColor: flatRoot.borderColor ?? "transparent",
+							borderWidth,
+							borderTopLeftRadius: tokenBorderRadius,
+							borderTopRightRadius: tokenBorderRadius,
+							borderBottomLeftRadius: bottomCornerRadius,
+							borderBottomRightRadius: bottomCornerRadius
+						},
+						fullWidthAtMaxSnap ? expansionEdgeStyle : void 0
+					],
+					pointerEvents: "none"
+				})
+			]
+		})
+	});
+	const modalOverlay = /* @__PURE__ */ jsxs(GestureHandlerRootView, {
+		style: internalStyles.modalRoot,
+		pointerEvents: isOpen ? "auto" : "none",
+		children: [/* @__PURE__ */ jsx(Scrim, {
+			translateY,
+			openTranslateY,
+			closedTranslateY,
+			dismissible,
+			onDismiss: handleDismiss,
+			blurTarget
+		}), sheetView]
+	});
+	const nonModalOverlay = /* @__PURE__ */ jsx(View, {
+		style: StyleSheet.absoluteFill,
+		pointerEvents: isOpen ? "box-none" : "none",
+		children: /* @__PURE__ */ jsx(GestureHandlerRootView, {
+			style: internalStyles.sheet,
+			pointerEvents: "auto",
+			children: sheetView
+		})
+	});
+	if (Platform.OS === "ios") return /* @__PURE__ */ jsx(FullWindowOverlay, { children: modal ? modalOverlay : nonModalOverlay });
+	return /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsxs(BottomSheetProvider, {
+		controller,
+		children: [modal && /* @__PURE__ */ jsx(AndroidBackHandler, {
+			dismissible,
+			onDismiss: handleDismiss,
+			isOpen
+		}), modal ? modalOverlay : nonModalOverlay]
+	}) });
+});
+const internalStyles = StyleSheet.create({
+	modalRoot: { flex: 1 },
+	sheet: {
+		position: "absolute",
+		left: 0,
+		right: 0,
+		top: 0,
+		minHeight: 100
+	}
+});
+
+//#endregion
+export { BottomSheet };
+//# sourceMappingURL=BottomSheet.js.map

package/dist/components/BottomSheet/BottomSheet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheet.js","names":["cornerRadiusLoadState","cornerRadiusListeners","cornerRadiusModule"],"sources":["../../../src/components/BottomSheet/BottomSheet.tsx"],"sourcesContent":["import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { Dimensions, Platform, StyleSheet, View } from 'react-native';\nimport { GestureDetector, GestureHandlerRootView } from 'react-native-gesture-handler';\nimport Animated, { interpolate, useAnimatedStyle, useSharedValue } from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { FullWindowOverlay } from 'react-native-screens';\n\nimport { bottomSheetStyles } from '../../../generated/styles';\nimport {\n  loadListeners as cornerRadiusListeners,\n  loadState as cornerRadiusLoadState,\n  nativeModule as cornerRadiusModule,\n} from '../../native/UDSScreenCornerRadiusModule';\nimport { Portal } from '../../portal';\nimport { AndroidBackHandler } from '../AndroidBackHandler';\nimport { Box } from '../Box';\nimport { Scrim } from '../Scrim';\nimport { BottomSheetHandle } from './BottomSheetHandle';\nimport { BottomSheetInternalProvider } from './BottomSheetInternalProvider';\nimport { BottomSheetProvider, useBottomSheetContext } from './BottomSheetProvider';\nimport type {\n  BottomSheetInternalContextValue,\n  BottomSheetProps,\n  BottomSheetRootTokens,\n} from './types';\nimport { useBottomSheetDrag } from './useBottomSheetDrag';\nimport { useBottomSheetSnapModel } from './useBottomSheetSnapModel';\nimport { useExpansionMargins } from './useExpansionMargins';\nimport { useKeyboardAvoidance } from './useKeyboardAvoidance';\nimport { resolveHeightToPx } from './utils';\n\nfunction useScreenCornerRadius(): {\n  module: typeof cornerRadiusModule;\n  isLoaded: boolean;\n  isFailed: boolean;\n} {\n  const [, forceUpdate] = useState(0);\n\n  useEffect(() => {\n    if (cornerRadiusLoadState === 'pending') {\n      const listener = () => forceUpdate((n) => n + 1);\n      cornerRadiusListeners.push(listener);\n      return () => {\n        const idx = cornerRadiusListeners.indexOf(listener);\n        if (idx >= 0) {\n          cornerRadiusListeners.splice(idx, 1);\n        }\n      };\n    }\n  }, []);\n\n  return {\n    module: cornerRadiusModule,\n    isLoaded: cornerRadiusLoadState === 'loaded',\n    isFailed: cornerRadiusLoadState === 'failed',\n  };\n}\n\n/**\n * The core bottom sheet component for React Native.\n *\n * Renders a draggable, spring-animated sheet that snaps to configurable height\n * positions. Supports modal (with scrim, blocks background interaction) and\n * non-modal (no scrim, background remains interactive) modes, scroll coordination,\n * keyboard avoidance, and optional edge-to-edge expansion at the max snap point.\n *\n * Must be wrapped in a {@link BottomSheetProvider} or provided a `controller` prop\n * created via {@link useBottomSheetStore}.\n *\n * @example\n * ```tsx\n * const store = useBottomSheetStore();\n *\n * <BottomSheetProvider controller={store}>\n *   <BottomSheetTrigger render={<Button>Open</Button>} />\n *   <BottomSheet snapPoints={['30%', '80%']}>\n *     <BottomSheetHeader>Title</BottomSheetHeader>\n *     <BottomSheetContent>...</BottomSheetContent>\n *   </BottomSheet>\n * </BottomSheetProvider>\n * ```\n */\nconst BottomSheet = memo(function BottomSheet({\n  children,\n  controller: controllerProp,\n  snapPoints: snapPointsProp,\n  height,\n  defaultSnapPointIndex = 0,\n  snapPointIndex: snapPointIndexProp,\n  onSnapPointChange,\n  onClose,\n  dismissible = true,\n  enableDrag = true,\n  modal = true,\n  showHandleIndicator = true,\n  fullWidthAtMaxSnap = false,\n  enableOverstretch = true,\n  blurTarget,\n  shouldMatchDeviceCornerRadius = true,\n}: BottomSheetProps) {\n  // Resolve controller: context first, fallback to prop.\n  const contextController = useBottomSheetContext();\n  const controller = contextController ?? controllerProp;\n\n  const { module: screenCornerRadiusModule, isFailed: cornerRadiusFailed } =\n    useScreenCornerRadius();\n\n  if (!controller) {\n    throw new Error(\n      'BottomSheet must be wrapped in BottomSheetProvider or provided a controller prop.',\n    );\n  }\n\n  if (cornerRadiusFailed) {\n    throw new Error(\n      'BottomSheet requires `expo-modules-core` to be installed.\\n' +\n        'Install it with: npx expo install expo-modules-core',\n    );\n  }\n\n  const { isOpen } = controller;\n\n  // Activate variant styles — must be called in this component so the\n  // stylesheet is reactive for all reads below.\n  bottomSheetStyles.useVariants({});\n\n  const flatRoot = StyleSheet.flatten(bottomSheetStyles.root) as BottomSheetRootTokens;\n  const marginHorizontal = flatRoot.marginHorizontal ?? 0;\n  const marginBottom = flatRoot.marginBottom ?? 0;\n  const blurIntensity = flatRoot.backgroundBlurRadius ?? 0;\n  // iOS: real blur via Box BlurView (no target needed).\n  // Android: real blur only when a blurTarget is provided.\n  // Android fallback: semi-transparent background from the elevation token.\n  const showBlurBox = blurIntensity > 0 && (Platform.OS === 'ios' || blurTarget != null);\n  const opaqueBackground = flatRoot.backgroundColor ?? '#fff';\n  const sheetBackground = showBlurBox\n    ? 'transparent'\n    : blurIntensity > 0\n      ? (flatRoot.backgroundBlurColor ?? opaqueBackground)\n      : opaqueBackground;\n\n  // When detached (has margins), offset by safe area so the sheet sits above\n  // the home indicator rather than overlapping it.\n  const { top: safeTop, bottom: safeBottom } = useSafeAreaInsets();\n  const isDetached = marginBottom > 0 || marginHorizontal > 0;\n  const bottomInsetPx = isDetached ? marginBottom : 0;\n  // When fullWidthAtMaxSnap, the sheet extends to the physical screen edge (past safe area).\n  const expandedBottomInsetPx = fullWidthAtMaxSnap ? 0 : bottomInsetPx;\n\n  // Concentric bottom corner radius: matches the device's screen corner curve.\n  // inner radius = screen radius - gap (distance from screen edge to sheet edge).\n  const tokenBorderRadius = flatRoot.borderRadius ?? 16;\n  const screenCornerRadius = shouldMatchDeviceCornerRadius\n    ? (screenCornerRadiusModule?.getCornerRadiusSync() ?? 0)\n    : 0;\n  const bottomCornerGap = isDetached ? Math.min(marginHorizontal, marginBottom + safeBottom) : 0;\n  const bottomCornerRadius =\n    screenCornerRadius > 0 ? Math.max(0, screenCornerRadius - bottomCornerGap) : tokenBorderRadius;\n\n  // Container height: always use window dimensions (both modal and non-modal render full-screen).\n  const containerHeight = useSharedValue(Dimensions.get('window').height);\n\n  // Listen for window dimension changes (orientation, resize).\n  useEffect(() => {\n    const subscription = Dimensions.addEventListener('change', ({ window }) => {\n      containerHeight.value = window.height;\n    });\n    return () => subscription.remove();\n  }, [containerHeight]);\n\n  // Snap model.\n  const snapModel = useBottomSheetSnapModel({\n    snapPointsProp,\n    height,\n    defaultSnapPointIndex,\n    snapPointIndexProp,\n    onSnapPointChange,\n    containerHeight,\n    bottomInsetPx,\n    topInsetPx: safeTop,\n    sideInsetPx: marginHorizontal,\n    fullWidthAtMaxSnap,\n    expandedBottomInsetPx,\n  });\n\n  const {\n    translateY,\n    activeSnapIndex,\n    isAnimating,\n    resolvedSnapPoints,\n    animateToSnap,\n    animateToClose,\n    animateToSnapWorklet,\n    animateToCloseWorklet,\n    getClosedTranslateY,\n    getTranslateYForSnap,\n  } = snapModel;\n\n  // Scroll coordination shared values.\n  const scrollOffsetY = useSharedValue(0);\n  const scrollLocked = useSharedValue(true);\n\n  // Dismiss handler: close the controller from the JS thread.\n  // Note: onClose is fired from the close effect to avoid double-calling.\n  const handleDismiss = useCallback(() => {\n    controller.close();\n  }, [controller]);\n\n  // Drag engine.\n  const { panGesture, panGestureRef, openTimeSV } = useBottomSheetDrag({\n    enableDrag,\n    dismissible,\n    enableOverstretch,\n    resolvedSnapPoints,\n    containerHeight,\n    bottomInsetPx,\n    translateY,\n    activeSnapIndex,\n    isAnimating,\n    animateToSnapWorklet,\n    animateToCloseWorklet,\n    onDismiss: handleDismiss,\n    scrollLocked,\n    scrollOffsetY,\n    getTranslateYForSnap,\n  });\n\n  // Keyboard avoidance — offsets sheet when keyboard opens.\n  useKeyboardAvoidance({ isOpen, translateY, isAnimating });\n\n  // Expansion margins — animate margins to 0 at max snap.\n  const {\n    animatedMarginStyle: expansionMarginStyle,\n    maxSnapTranslateY: expansionMaxSnapTranslateY,\n    thresholdTranslateY: expansionThresholdTranslateY,\n  } = useExpansionMargins({\n    enabled: fullWidthAtMaxSnap,\n    baseMarginHorizontal: marginHorizontal,\n    baseMarginBottom: marginBottom,\n    resolvedSnapPoints,\n    containerHeight,\n    bottomInsetPx,\n    expandedBottomInsetPx,\n    translateY,\n  });\n\n  // When the sheet extends to the screen edge at max snap, animate the bottom\n  // border radius to 0 (physical screen corners handle rounding) and add bottom\n  // padding equal to the safe area so content stays above the home indicator.\n  const expansionEdgeStyle = useAnimatedStyle(() => {\n    if (!fullWidthAtMaxSnap) {\n      return {};\n    }\n    const bottomRadius = interpolate(\n      translateY.value,\n      [expansionMaxSnapTranslateY, expansionThresholdTranslateY],\n      [0, bottomCornerRadius],\n      'clamp',\n    );\n    const pb = interpolate(\n      translateY.value,\n      [expansionMaxSnapTranslateY, expansionThresholdTranslateY],\n      [safeBottom, 0],\n      'clamp',\n    );\n    return {\n      borderBottomLeftRadius: bottomRadius,\n      borderBottomRightRadius: bottomRadius,\n      paddingBottom: pb,\n    };\n  });\n\n  // Internal context for BottomSheetContent and useBottomSheetScroll.\n  const internalContextValue: BottomSheetInternalContextValue = useMemo(\n    () => ({\n      panGestureRef,\n      activeSnapIndex,\n      snapCount: resolvedSnapPoints.length,\n      scrollOffsetY,\n      scrollLocked,\n    }),\n    [panGestureRef, activeSnapIndex, resolvedSnapPoints.length, scrollOffsetY, scrollLocked],\n  );\n\n  // Track previous isOpen to detect transitions.\n  const wasOpen = useRef(false);\n  // Whether the sheet tree should remain rendered (stays true during close animation).\n  const [isRendered, setIsRendered] = useState(false);\n\n  useEffect(() => {\n    if (isOpen && !wasOpen.current) {\n      // Reset scroll state before mounting children so animatedProps reads\n      // the correct scrollLocked value on the very first UI frame.\n      const initialIndex = snapPointIndexProp ?? defaultSnapPointIndex;\n      scrollOffsetY.value = 0;\n      scrollLocked.value = initialIndex !== resolvedSnapPoints.length - 1;\n      // Opening: mount the tree, then animate to initial snap.\n      setIsRendered(true);\n      // Start from closed position, then animate in.\n      translateY.value = getClosedTranslateY();\n      // Set open time for fresh-open lock.\n      openTimeSV.value = Date.now();\n      // Small delay to ensure layout is ready (mirrors web's 50ms enter delay).\n      const timeout = setTimeout(() => {\n        animateToSnap(initialIndex);\n      }, 50);\n      wasOpen.current = true;\n      return () => clearTimeout(timeout);\n    }\n\n    if (!isOpen && wasOpen.current) {\n      // Closing: animate to closed, then unmount.\n      // If the drag engine already started the close animation, this restarts\n      // the spring to the same target — Reanimated cancels the old one (finished=false)\n      // and the new one's callback fires when it settles.\n      animateToClose(() => {\n        setIsRendered(false);\n      });\n      onClose?.();\n      wasOpen.current = false;\n    }\n  }, [\n    isOpen,\n    snapPointIndexProp,\n    defaultSnapPointIndex,\n    translateY,\n    getClosedTranslateY,\n    animateToSnap,\n    animateToClose,\n    onClose,\n    openTimeSV,\n    scrollOffsetY,\n    scrollLocked,\n    resolvedSnapPoints.length,\n  ]);\n\n  // Sync controlled snap index changes while open.\n  useEffect(() => {\n    if (!isOpen || snapPointIndexProp === undefined) {\n      return;\n    }\n    animateToSnap(snapPointIndexProp);\n  }, [isOpen, snapPointIndexProp, animateToSnap]);\n\n  // Animated sheet style.\n  // For detached sheets (with margins), constrain height so the bottom margin\n  // is visible. When fullWidthAtMaxSnap, the effective bottom inset interpolates\n  // from bottomInsetPx to expandedBottomInsetPx as the sheet reaches max snap.\n  const animatedSheetStyle = useAnimatedStyle(() => {\n    let effectiveBottom = 0;\n    if (isDetached) {\n      effectiveBottom = bottomInsetPx;\n      if (fullWidthAtMaxSnap) {\n        effectiveBottom = interpolate(\n          translateY.value,\n          [expansionMaxSnapTranslateY, expansionThresholdTranslateY],\n          [expandedBottomInsetPx, bottomInsetPx],\n          'clamp',\n        );\n      }\n    }\n    return {\n      transform: [{ translateY: translateY.value }],\n      height: Math.max(100, containerHeight.value - translateY.value - effectiveBottom),\n    };\n  });\n\n  // Compute scrim interpolation positions (JS thread, for Scrim props).\n  const initialIndex = snapPointIndexProp ?? defaultSnapPointIndex;\n  const windowH = modal ? Dimensions.get('window').height : 0;\n  const openSnapHeight = resolvedSnapPoints[initialIndex]\n    ? resolveHeightToPx(resolvedSnapPoints[initialIndex], windowH)\n    : 0;\n  const openTranslateY =\n    windowH - Math.min(openSnapHeight, windowH - bottomInsetPx) - bottomInsetPx;\n  const closedTranslateY = windowH + bottomInsetPx;\n\n  // Don't render anything if not open and close animation has completed.\n  if (!isOpen && !isRendered) {\n    return null;\n  }\n\n  const borderWidth = flatRoot.borderWidth ?? 0;\n\n  const sheetView = (\n    <GestureDetector gesture={panGesture}>\n      <Animated.View\n        style={[\n          internalStyles.sheet,\n          {\n            backgroundColor: sheetBackground,\n            borderTopLeftRadius: tokenBorderRadius,\n            borderTopRightRadius: tokenBorderRadius,\n            borderBottomLeftRadius: bottomCornerRadius,\n            borderBottomRightRadius: bottomCornerRadius,\n            paddingTop: 8,\n            marginHorizontal,\n            overflow: 'hidden',\n          },\n          animatedSheetStyle,\n          fullWidthAtMaxSnap ? expansionMarginStyle : undefined,\n          fullWidthAtMaxSnap ? expansionEdgeStyle : undefined,\n        ]}\n        accessibilityRole=\"none\"\n      >\n        {showBlurBox && (\n          <>\n            <Box style={StyleSheet.absoluteFill} blur={blurIntensity} blurTarget={blurTarget} />\n            <View\n              style={[StyleSheet.absoluteFill, { backgroundColor: flatRoot.backgroundBlurColor }]}\n              pointerEvents=\"none\"\n            />\n          </>\n        )}\n        {showHandleIndicator && enableDrag && <BottomSheetHandle />}\n        <View\n          style={{\n            paddingHorizontal: flatRoot.paddingHorizontal ?? 16,\n            paddingBottom: flatRoot.paddingVertical ?? 8,\n            flex: 1,\n          }}\n        >\n          <BottomSheetInternalProvider value={internalContextValue}>\n            {children}\n          </BottomSheetInternalProvider>\n        </View>\n        {borderWidth > 0 && (\n          <Animated.View\n            style={[\n              StyleSheet.absoluteFill,\n              {\n                borderColor: flatRoot.borderColor ?? 'transparent',\n                borderWidth,\n                borderTopLeftRadius: tokenBorderRadius,\n                borderTopRightRadius: tokenBorderRadius,\n                borderBottomLeftRadius: bottomCornerRadius,\n                borderBottomRightRadius: bottomCornerRadius,\n              },\n              fullWidthAtMaxSnap ? expansionEdgeStyle : undefined,\n            ]}\n            pointerEvents=\"none\"\n          />\n        )}\n      </Animated.View>\n    </GestureDetector>\n  );\n\n  // Modal: full-screen gesture root with scrim blocks background interaction.\n  const modalOverlay = (\n    <GestureHandlerRootView\n      style={internalStyles.modalRoot}\n      pointerEvents={isOpen ? 'auto' : 'none'}\n    >\n      <Scrim\n        translateY={translateY}\n        openTranslateY={openTranslateY}\n        closedTranslateY={closedTranslateY}\n        dismissible={dismissible}\n        onDismiss={handleDismiss}\n        blurTarget={blurTarget}\n      />\n      {sheetView}\n    </GestureHandlerRootView>\n  );\n\n  // Non-modal: gesture root wraps only the sheet so background stays interactive.\n  const nonModalOverlay = (\n    <View style={StyleSheet.absoluteFill} pointerEvents={isOpen ? 'box-none' : 'none'}>\n      <GestureHandlerRootView style={internalStyles.sheet} pointerEvents=\"auto\">\n        {sheetView}\n      </GestureHandlerRootView>\n    </View>\n  );\n\n  // iOS: FullWindowOverlay renders above all content at the window level.\n  if (Platform.OS === 'ios') {\n    return <FullWindowOverlay>{modal ? modalOverlay : nonModalOverlay}</FullWindowOverlay>;\n  }\n\n  // Android: Portal renders above all content via PortalHost. Re-provides\n  // BottomSheetProvider since Portal re-parents outside the original tree.\n  return (\n    <Portal>\n      <BottomSheetProvider controller={controller}>\n        {modal && (\n          <AndroidBackHandler dismissible={dismissible} onDismiss={handleDismiss} isOpen={isOpen} />\n        )}\n        {modal ? modalOverlay : nonModalOverlay}\n      </BottomSheetProvider>\n    </Portal>\n  );\n});\n\nconst internalStyles = StyleSheet.create({\n  modalRoot: {\n    flex: 1,\n  },\n  sheet: {\n    position: 'absolute',\n    left: 0,\n    right: 0,\n    top: 0,\n    minHeight: 100,\n  },\n});\n\nexport { BottomSheet };\n"],"mappings":"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"}

package/dist/components/BottomSheet/BottomSheetContent.cjs

@@ -0,0 +1,65 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_runtime = require('../../_virtual/_rolldown/runtime.cjs');
+const require_components_BottomSheet_BottomSheetInternalProvider = require('./BottomSheetInternalProvider.cjs');
+let react = require("react");
+let react_native = require("react-native");
+let react_jsx_runtime = require("react/jsx-runtime");
+let react_native_reanimated = require("react-native-reanimated");
+react_native_reanimated = require_runtime.__toESM(react_native_reanimated);
+let react_native_gesture_handler = require("react-native-gesture-handler");
+let react_native_safe_area_context = require("react-native-safe-area-context");
+
+//#region src/components/BottomSheet/BottomSheetContent.tsx
+/**
+* Scrollable content area for the bottom sheet.
+*
+* Renders an `Animated.ScrollView` that coordinates with the sheet's pan gesture:
+*
+* 1. `scrollEnabled` disables touch handling when locked; `decelerationRate`
+*    prevents residual momentum.
+* 2. The scroll handler tracks `contentOffset.y` for the drag gesture.
+* 3. A `Gesture.Native()` links to the sheet's pan gesture via
+*    `simultaneousWithExternalGesture` for gesture handoff.
+*
+* Automatically adds bottom safe-area padding to the content container.
+*/
+const BottomSheetContent = (0, react.memo)(function BottomSheetContent({ children }) {
+	const internalCtx = require_components_BottomSheet_BottomSheetInternalProvider.useBottomSheetInternalContext();
+	const scrollRef = (0, react_native_reanimated.useAnimatedRef)();
+	const { bottom: safeBottom } = (0, react_native_safe_area_context.useSafeAreaInsets)();
+	const contentContainerStyle = (0, react.useMemo)(() => ({ paddingBottom: safeBottom }), [safeBottom]);
+	const animatedScrollProps = (0, react_native_reanimated.useAnimatedProps)(() => ({
+		scrollEnabled: !internalCtx?.scrollLocked.value,
+		decelerationRate: internalCtx?.scrollLocked.value ? 0 : .998
+	}));
+	const scrollHandler = (0, react_native_reanimated.useAnimatedScrollHandler)({ onScroll: (event) => {
+		if (!internalCtx) return;
+		internalCtx.scrollOffsetY.value = event.contentOffset.y;
+	} });
+	if (!internalCtx) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native_reanimated.default.ScrollView, {
+		style: internalStyles.container,
+		contentContainerStyle,
+		children
+	});
+	const { panGestureRef } = internalCtx;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native_gesture_handler.GestureDetector, {
+		gesture: react_native_gesture_handler.Gesture.Native().simultaneousWithExternalGesture(panGestureRef),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native_reanimated.default.ScrollView, {
+			ref: scrollRef,
+			style: internalStyles.container,
+			contentContainerStyle,
+			onScroll: scrollHandler,
+			scrollEventThrottle: 16,
+			animatedProps: animatedScrollProps,
+			bounces: false,
+			overScrollMode: "never",
+			nestedScrollEnabled: react_native.Platform.OS === "android",
+			children
+		})
+	});
+});
+const internalStyles = react_native.StyleSheet.create({ container: { flex: 1 } });
+
+//#endregion
+exports.BottomSheetContent = BottomSheetContent;

package/dist/components/BottomSheet/BottomSheetContent.d.cts

@@ -0,0 +1,22 @@
+
+import { BottomSheetContentProps } from "./types.cjs";
+import * as react from "react";
+
+//#region src/components/BottomSheet/BottomSheetContent.d.ts
+/**
+ * Scrollable content area for the bottom sheet.
+ *
+ * Renders an `Animated.ScrollView` that coordinates with the sheet's pan gesture:
+ *
+ * 1. `scrollEnabled` disables touch handling when locked; `decelerationRate`
+ *    prevents residual momentum.
+ * 2. The scroll handler tracks `contentOffset.y` for the drag gesture.
+ * 3. A `Gesture.Native()` links to the sheet's pan gesture via
+ *    `simultaneousWithExternalGesture` for gesture handoff.
+ *
+ * Automatically adds bottom safe-area padding to the content container.
+ */
+declare const BottomSheetContent: react.NamedExoticComponent<BottomSheetContentProps>;
+//#endregion
+export { BottomSheetContent };
+//# sourceMappingURL=BottomSheetContent.d.cts.map

package/dist/components/BottomSheet/BottomSheetContent.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheetContent.d.cts","names":[],"sources":["../../../src/components/BottomSheet/BottomSheetContent.tsx"],"mappings":";;;;;;;;AAWuD;;;;;;;;;;cAejD,kBAAA,EAAkB,KAAA,CAAA,oBAAA,CAAA,uBAAA"}

package/dist/components/BottomSheet/BottomSheetContent.d.ts

@@ -0,0 +1,22 @@
+
+import { BottomSheetContentProps } from "./types.js";
+import * as react from "react";
+
+//#region src/components/BottomSheet/BottomSheetContent.d.ts
+/**
+ * Scrollable content area for the bottom sheet.
+ *
+ * Renders an `Animated.ScrollView` that coordinates with the sheet's pan gesture:
+ *
+ * 1. `scrollEnabled` disables touch handling when locked; `decelerationRate`
+ *    prevents residual momentum.
+ * 2. The scroll handler tracks `contentOffset.y` for the drag gesture.
+ * 3. A `Gesture.Native()` links to the sheet's pan gesture via
+ *    `simultaneousWithExternalGesture` for gesture handoff.
+ *
+ * Automatically adds bottom safe-area padding to the content container.
+ */
+declare const BottomSheetContent: react.NamedExoticComponent<BottomSheetContentProps>;
+//#endregion
+export { BottomSheetContent };
+//# sourceMappingURL=BottomSheetContent.d.ts.map

package/dist/components/BottomSheet/BottomSheetContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheetContent.d.ts","names":[],"sources":["../../../src/components/BottomSheet/BottomSheetContent.tsx"],"mappings":";;;;;;;;AAWuD;;;;;;;;;;cAejD,kBAAA,EAAkB,KAAA,CAAA,oBAAA,CAAA,uBAAA"}

package/dist/components/BottomSheet/BottomSheetContent.js

@@ -0,0 +1,63 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { useBottomSheetInternalContext } from "./BottomSheetInternalProvider.js";
+import { memo, useMemo } from "react";
+import { Platform, StyleSheet } from "react-native";
+import { jsx } from "react/jsx-runtime";
+import Animated, { useAnimatedProps, useAnimatedRef, useAnimatedScrollHandler } from "react-native-reanimated";
+import { Gesture, GestureDetector } from "react-native-gesture-handler";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
+
+//#region src/components/BottomSheet/BottomSheetContent.tsx
+/**
+* Scrollable content area for the bottom sheet.
+*
+* Renders an `Animated.ScrollView` that coordinates with the sheet's pan gesture:
+*
+* 1. `scrollEnabled` disables touch handling when locked; `decelerationRate`
+*    prevents residual momentum.
+* 2. The scroll handler tracks `contentOffset.y` for the drag gesture.
+* 3. A `Gesture.Native()` links to the sheet's pan gesture via
+*    `simultaneousWithExternalGesture` for gesture handoff.
+*
+* Automatically adds bottom safe-area padding to the content container.
+*/
+const BottomSheetContent = memo(function BottomSheetContent({ children }) {
+	const internalCtx = useBottomSheetInternalContext();
+	const scrollRef = useAnimatedRef();
+	const { bottom: safeBottom } = useSafeAreaInsets();
+	const contentContainerStyle = useMemo(() => ({ paddingBottom: safeBottom }), [safeBottom]);
+	const animatedScrollProps = useAnimatedProps(() => ({
+		scrollEnabled: !internalCtx?.scrollLocked.value,
+		decelerationRate: internalCtx?.scrollLocked.value ? 0 : .998
+	}));
+	const scrollHandler = useAnimatedScrollHandler({ onScroll: (event) => {
+		if (!internalCtx) return;
+		internalCtx.scrollOffsetY.value = event.contentOffset.y;
+	} });
+	if (!internalCtx) return /* @__PURE__ */ jsx(Animated.ScrollView, {
+		style: internalStyles.container,
+		contentContainerStyle,
+		children
+	});
+	const { panGestureRef } = internalCtx;
+	return /* @__PURE__ */ jsx(GestureDetector, {
+		gesture: Gesture.Native().simultaneousWithExternalGesture(panGestureRef),
+		children: /* @__PURE__ */ jsx(Animated.ScrollView, {
+			ref: scrollRef,
+			style: internalStyles.container,
+			contentContainerStyle,
+			onScroll: scrollHandler,
+			scrollEventThrottle: 16,
+			animatedProps: animatedScrollProps,
+			bounces: false,
+			overScrollMode: "never",
+			nestedScrollEnabled: Platform.OS === "android",
+			children
+		})
+	});
+});
+const internalStyles = StyleSheet.create({ container: { flex: 1 } });
+
+//#endregion
+export { BottomSheetContent };
+//# sourceMappingURL=BottomSheetContent.js.map

package/dist/components/BottomSheet/BottomSheetContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheetContent.js","names":[],"sources":["../../../src/components/BottomSheet/BottomSheetContent.tsx"],"sourcesContent":["import { memo, useMemo } from 'react';\nimport { Platform, StyleSheet } from 'react-native';\nimport { Gesture, GestureDetector } from 'react-native-gesture-handler';\nimport Animated, {\n  useAnimatedProps,\n  useAnimatedRef,\n  useAnimatedScrollHandler,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport { useBottomSheetInternalContext } from './BottomSheetInternalProvider';\nimport type { BottomSheetContentProps } from './types';\n\n/**\n * Scrollable content area for the bottom sheet.\n *\n * Renders an `Animated.ScrollView` that coordinates with the sheet's pan gesture:\n *\n * 1. `scrollEnabled` disables touch handling when locked; `decelerationRate`\n *    prevents residual momentum.\n * 2. The scroll handler tracks `contentOffset.y` for the drag gesture.\n * 3. A `Gesture.Native()` links to the sheet's pan gesture via\n *    `simultaneousWithExternalGesture` for gesture handoff.\n *\n * Automatically adds bottom safe-area padding to the content container.\n */\nconst BottomSheetContent = memo(function BottomSheetContent({ children }: BottomSheetContentProps) {\n  const internalCtx = useBottomSheetInternalContext();\n  const scrollRef = useAnimatedRef<Animated.ScrollView>();\n  const { bottom: safeBottom } = useSafeAreaInsets();\n\n  const contentContainerStyle = useMemo(() => ({ paddingBottom: safeBottom }), [safeBottom]);\n\n  const animatedScrollProps = useAnimatedProps(() => ({\n    scrollEnabled: !internalCtx?.scrollLocked.value,\n    decelerationRate: internalCtx?.scrollLocked.value ? 0 : 0.998,\n  }));\n\n  // Track scroll offset so the drag gesture knows the scroll position.\n  const scrollHandler = useAnimatedScrollHandler({\n    onScroll: (event) => {\n      if (!internalCtx) {\n        return;\n      }\n      internalCtx.scrollOffsetY.value = event.contentOffset.y;\n    },\n  });\n\n  if (!internalCtx) {\n    return (\n      <Animated.ScrollView\n        style={internalStyles.container}\n        contentContainerStyle={contentContainerStyle}\n      >\n        {children}\n      </Animated.ScrollView>\n    );\n  }\n\n  const { panGestureRef } = internalCtx;\n\n  const nativeGesture = Gesture.Native().simultaneousWithExternalGesture(panGestureRef);\n\n  return (\n    <GestureDetector gesture={nativeGesture}>\n      <Animated.ScrollView\n        ref={scrollRef}\n        style={internalStyles.container}\n        contentContainerStyle={contentContainerStyle}\n        onScroll={scrollHandler}\n        scrollEventThrottle={16}\n        animatedProps={animatedScrollProps}\n        bounces={false}\n        overScrollMode=\"never\"\n        nestedScrollEnabled={Platform.OS === 'android'}\n      >\n        {children}\n      </Animated.ScrollView>\n    </GestureDetector>\n  );\n});\n\nconst internalStyles = StyleSheet.create({\n  container: {\n    flex: 1,\n  },\n});\n\nexport { BottomSheetContent };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AA0BA,MAAM,qBAAqB,KAAK,SAAS,mBAAmB,EAAE,YAAqC;CACjG,MAAM,cAAc,+BAA+B;CACnD,MAAM,YAAY,gBAAqC;CACvD,MAAM,EAAE,QAAQ,eAAe,mBAAmB;CAElD,MAAM,wBAAwB,eAAe,EAAE,eAAe,YAAY,GAAG,CAAC,WAAW,CAAC;CAE1F,MAAM,sBAAsB,wBAAwB;EAClD,eAAe,CAAC,aAAa,aAAa;EAC1C,kBAAkB,aAAa,aAAa,QAAQ,IAAI;EACzD,EAAE;CAGH,MAAM,gBAAgB,yBAAyB,EAC7C,WAAW,UAAU;AACnB,MAAI,CAAC,YACH;AAEF,cAAY,cAAc,QAAQ,MAAM,cAAc;IAEzD,CAAC;AAEF,KAAI,CAAC,YACH,QACE,oBAAC,SAAS;EACR,OAAO,eAAe;EACC;EAEtB;GACmB;CAI1B,MAAM,EAAE,kBAAkB;AAI1B,QACE,oBAAC;EAAgB,SAHG,QAAQ,QAAQ,CAAC,gCAAgC,cAAc;YAIjF,oBAAC,SAAS;GACR,KAAK;GACL,OAAO,eAAe;GACC;GACvB,UAAU;GACV,qBAAqB;GACrB,eAAe;GACf,SAAS;GACT,gBAAe;GACf,qBAAqB,SAAS,OAAO;GAEpC;IACmB;GACN;EAEpB;AAEF,MAAM,iBAAiB,WAAW,OAAO,EACvC,WAAW,EACT,MAAM,GACP,EACF,CAAC"}

package/dist/components/BottomSheet/BottomSheetDismiss.cjs

@@ -0,0 +1,28 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_runtime = require('../../_virtual/_rolldown/runtime.cjs');
+const require_components_BottomSheet_BottomSheetProvider = require('./BottomSheetProvider.cjs');
+let react = require("react");
+
+//#region src/components/BottomSheet/BottomSheetDismiss.tsx
+/**
+* Clones the `render` element and injects an `onPress` handler that closes
+* the nearest bottom sheet.
+*
+* Uses the `render` prop pattern to avoid nested pressable wrappers.
+*
+* @example
+* ```tsx
+* <BottomSheetDismiss render={<Button>Close</Button>} />
+* ```
+*/
+const BottomSheetDismiss = (0, react.memo)(function BottomSheetDismiss({ render }) {
+	const controller = require_components_BottomSheet_BottomSheetProvider.useBottomSheetContext();
+	if (!controller) throw new Error("BottomSheetDismiss must be used inside a BottomSheetProvider.");
+	return (0, react.cloneElement)(render, { onPress: (0, react.useCallback)(() => {
+		controller.close();
+	}, [controller]) });
+});
+
+//#endregion
+exports.BottomSheetDismiss = BottomSheetDismiss;