@yahoo/uds-mobile 2.18.0 → 2.20.0

package/dist/components/Modal/Modal.js

@@ -0,0 +1,395 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { AndroidBackHandler } from "../AndroidBackHandler.js";
+import { Box } from "../Box.js";
+import { IconSlot } from "../IconSlot.js";
+import { Text as Text$1 } from "../Text.js";
+import { AnimatedPressable } from "../Pressable.js";
+import { Scrim } from "../Scrim.js";
+import { OverlayPortal } from "../internal/Overlay/OverlayPortal.js";
+import { ModalContext } from "./ModalContext.js";
+import { ModalActions } from "./ModalActions.js";
+import { ModalContent } from "./ModalContent.js";
+import { ModalDescription } from "./ModalDescription.js";
+import { ModalTitle } from "./ModalTitle.js";
+import { getEventPagePoint, resolveModalDimension, separateChildren, shouldDismissModalRelease } from "./utils.js";
+import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { AccessibilityInfo, Platform, ScrollView, StyleSheet, View } from "react-native";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { modalStyles } from "../../../generated/styles";
+import Animated, { Easing, interpolate, useAnimatedStyle, useSharedValue, withTiming } from "react-native-reanimated";
+import { GestureHandlerRootView } from "react-native-gesture-handler";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
+//#region src/components/Modal/Modal.tsx
+const ANIMATION_DURATION_IN = 400;
+const ANIMATION_DURATION_OUT = 250;
+const ANIMATION_EASING_IN = Easing.bezier(.3, .4, .2, 1);
+const ANIMATION_EASING_OUT = Easing.bezier(.6, 0, .7, .6);
+const HIDDEN_SCALE = .95;
+const HIDDEN_PROGRESS = 1;
+const VISIBLE_PROGRESS = 0;
+const SCROLL_DISMISS_SUPPRESSION_MS = 150;
+const SCROLL_OFFSET_THRESHOLD = 1;
+function usePrefersReducedMotion() {
+	const [prefersReducedMotion, setPrefersReducedMotion] = useState(false);
+	useEffect(() => {
+		let isMounted = true;
+		AccessibilityInfo.isReduceMotionEnabled().then((isReduceMotionEnabled) => {
+			if (isMounted) setPrefersReducedMotion(isReduceMotionEnabled);
+		});
+		const subscription = AccessibilityInfo.addEventListener("reduceMotionChanged", (isReduceMotionEnabled) => {
+			setPrefersReducedMotion(isReduceMotionEnabled);
+		});
+		return () => {
+			isMounted = false;
+			subscription.remove();
+		};
+	}, []);
+	return prefersReducedMotion;
+}
+const Modal = memo(function Modal({ children, open, onClose, onOpen, portal = true, includeScrim, dismissible = true, hideDismissButton = false, reduceMotion = false, closeIcon = "Cross", closeAriaLabel = "Close", closeAccessibilityLabel, maxWidth = "auto", maxHeight = "auto", fullWidth = false, fullHeight = false, title: titleProp, description: descriptionProp, content: contentProp, actions: actionsProp, scrollBehavior = "outside", useFullWindowOverlay = true, blurTarget, style, ref, onLayout, ...viewProps }) {
+	modalStyles.useVariants({});
+	const surfaceRef = useRef(null);
+	const prevOpen = useRef(open);
+	const progress = useSharedValue(HIDDEN_PROGRESS);
+	const closePressProgress = useSharedValue(0);
+	const presenceState = useRef(open ? "open" : "closed");
+	const didModalScrollDuringGesture = useRef(false);
+	const isModalScrollInteracting = useRef(false);
+	const modalScrollDismissTimeout = useRef(null);
+	const modalScrollStartOffset = useRef(null);
+	const [, forcePresenceRender] = useState(0);
+	const prefersReducedMotion = usePrefersReducedMotion();
+	const reducedMotion = reduceMotion || prefersReducedMotion;
+	const safeAreaInsets = useSafeAreaInsets();
+	if (open) presenceState.current = "open";
+	else if (presenceState.current === "open") presenceState.current = "closing";
+	const isRendered = open || presenceState.current === "closing";
+	const { title: modalTitle, description: modalDescription, content: modalContent, actions: modalActions } = separateChildren(children);
+	const hasTitleOrDescription = !!(modalTitle || titleProp || modalDescription || descriptionProp);
+	const shouldRenderHeader = !hideDismissButton || hasTitleOrDescription;
+	const hasContent = !!(modalContent || contentProp);
+	const shouldRenderScrim = includeScrim ?? true;
+	const closeLabel = closeAccessibilityLabel ?? closeAriaLabel;
+	const durationIn = reducedMotion ? 0 : ANIMATION_DURATION_IN;
+	const durationOut = reducedMotion ? 0 : ANIMATION_DURATION_OUT;
+	useEffect(() => {
+		if (open && !prevOpen.current) onOpen?.();
+		prevOpen.current = open;
+	}, [open, onOpen]);
+	useEffect(() => {
+		if (open) {
+			progress.value = HIDDEN_PROGRESS;
+			return;
+		}
+		if (!isRendered) return;
+		progress.value = withTiming(HIDDEN_PROGRESS, {
+			duration: durationOut,
+			easing: ANIMATION_EASING_OUT
+		});
+		const timeout = setTimeout(() => {
+			if (presenceState.current === "closing") {
+				presenceState.current = "closed";
+				forcePresenceRender((revision) => revision + 1);
+			}
+		}, durationOut);
+		return () => clearTimeout(timeout);
+	}, [
+		durationOut,
+		isRendered,
+		open,
+		progress
+	]);
+	useEffect(() => {
+		if (!open || !isRendered) return;
+		if (durationIn === 0) {
+			progress.value = VISIBLE_PROGRESS;
+			return;
+		}
+		const animationFrame = requestAnimationFrame(() => {
+			progress.value = withTiming(VISIBLE_PROGRESS, {
+				duration: durationIn,
+				easing: ANIMATION_EASING_IN
+			});
+		});
+		return () => cancelAnimationFrame(animationFrame);
+	}, [
+		durationIn,
+		isRendered,
+		open,
+		progress
+	]);
+	const handleDismiss = useCallback(() => {
+		onClose?.();
+	}, [onClose]);
+	const clearModalScrollDismissTimeout = useCallback(() => {
+		if (modalScrollDismissTimeout.current) {
+			clearTimeout(modalScrollDismissTimeout.current);
+			modalScrollDismissTimeout.current = null;
+		}
+	}, []);
+	const handleModalScrollInteractionBegin = useCallback((event) => {
+		clearModalScrollDismissTimeout();
+		isModalScrollInteracting.current = true;
+		didModalScrollDuringGesture.current = false;
+		modalScrollStartOffset.current = event.nativeEvent.contentOffset;
+	}, [clearModalScrollDismissTimeout]);
+	const handleModalScroll = useCallback((event) => {
+		if (!isModalScrollInteracting.current || didModalScrollDuringGesture.current) return;
+		const startOffset = modalScrollStartOffset.current;
+		const currentOffset = event.nativeEvent.contentOffset;
+		if (!startOffset) return;
+		const movedX = Math.abs(currentOffset.x - startOffset.x);
+		const movedY = Math.abs(currentOffset.y - startOffset.y);
+		if (movedX > SCROLL_OFFSET_THRESHOLD || movedY > SCROLL_OFFSET_THRESHOLD) didModalScrollDuringGesture.current = true;
+	}, []);
+	const handleModalScrollInteractionEnd = useCallback(() => {
+		clearModalScrollDismissTimeout();
+		modalScrollDismissTimeout.current = setTimeout(() => {
+			isModalScrollInteracting.current = false;
+			didModalScrollDuringGesture.current = false;
+			modalScrollDismissTimeout.current = null;
+			modalScrollStartOffset.current = null;
+		}, SCROLL_DISMISS_SUPPRESSION_MS);
+	}, [clearModalScrollDismissTimeout]);
+	useEffect(() => clearModalScrollDismissTimeout, [clearModalScrollDismissTimeout]);
+	const handleScrimRelease = useCallback((absoluteX, absoluteY) => {
+		if (!dismissible) return;
+		if (!surfaceRef.current?.measureInWindow) return;
+		surfaceRef.current.measureInWindow((x, y, width, height) => {
+			if (shouldDismissModalRelease({
+				x: absoluteX,
+				y: absoluteY
+			}, {
+				x,
+				y,
+				width,
+				height
+			})) onClose?.();
+		});
+	}, [dismissible, onClose]);
+	const handleOverlayTouchEndCapture = useCallback((event) => {
+		if (isModalScrollInteracting.current && didModalScrollDuringGesture.current) return;
+		const pagePoint = getEventPagePoint(event);
+		if (!pagePoint) return;
+		handleScrimRelease(pagePoint.x, pagePoint.y);
+	}, [handleScrimRelease]);
+	const setSurfaceRef = useCallback((node) => {
+		surfaceRef.current = node;
+		if (typeof ref === "function") ref(node);
+		else if (ref) ref.current = node;
+	}, [ref]);
+	const handleClosePressIn = useCallback(() => {
+		closePressProgress.value = withTiming(1, { duration: reducedMotion ? 0 : 120 });
+	}, [closePressProgress, reducedMotion]);
+	const handleClosePressOut = useCallback(() => {
+		closePressProgress.value = withTiming(0, { duration: reducedMotion ? 0 : 120 });
+	}, [closePressProgress, reducedMotion]);
+	const animatedSurfaceStyle = useAnimatedStyle(() => ({
+		opacity: interpolate(progress.value, [VISIBLE_PROGRESS, HIDDEN_PROGRESS], [1, 0], "clamp"),
+		transform: [{ scale: interpolate(progress.value, [VISIBLE_PROGRESS, HIDDEN_PROGRESS], [1, HIDDEN_SCALE], "clamp") }]
+	}));
+	const animatedCloseIconContainerStyle = useAnimatedStyle(() => ({ backgroundColor: `rgba(29, 34, 40, ${interpolate(closePressProgress.value, [0, 1], [0, .15], "clamp").toFixed(3)})` }));
+	const modalContextValue = useMemo(() => ({
+		scrollBehavior,
+		hasContent,
+		onScroll: handleModalScroll,
+		onScrollInteractionBegin: handleModalScrollInteractionBegin,
+		onScrollInteractionEnd: handleModalScrollInteractionEnd,
+		shouldRenderHeader
+	}), [
+		handleModalScroll,
+		handleModalScrollInteractionBegin,
+		handleModalScrollInteractionEnd,
+		hasContent,
+		scrollBehavior,
+		shouldRenderHeader
+	]);
+	if (!isRendered) return null;
+	const rootTokens = StyleSheet.flatten(modalStyles.root);
+	const gutter = StyleSheet.flatten(modalStyles.scrim).padding ?? 0;
+	const blurIntensity = rootTokens.backgroundBlurRadius ?? 0;
+	const showBlurBox = blurIntensity > 0 && (Platform.OS === "ios" || blurTarget != null);
+	const rootBackgroundColor = showBlurBox ? "transparent" : blurIntensity > 0 ? rootTokens.backgroundBlurColor ?? rootTokens.backgroundColor : rootTokens.backgroundColor;
+	const rootBorderRadius = rootTokens.borderRadius ?? 0;
+	const rootMaxHeight = scrollBehavior === "inside" ? resolveModalDimension(maxHeight) : void 0;
+	const shouldFillHeight = fullHeight && scrollBehavior === "inside" && rootMaxHeight !== void 0;
+	const headerSpacingBottom = hasContent ? modalStyles.root.paddingVertical ?? 0 : 0;
+	const closeIconContainerSize = (modalStyles.closeIcon.fontSize ?? 0) + (modalStyles.closeIconContainer.padding ?? 0) * 2;
+	const closeIconOffset = closeIconContainerSize / 2;
+	const closeIconTop = modalStyles.root.paddingVertical ?? 0;
+	const closeIconRight = modalStyles.spacingHorizontal.paddingHorizontal ?? 0;
+	const surface = /* @__PURE__ */ jsxs(Animated.View, {
+		ref: setSurfaceRef,
+		accessibilityViewIsModal: true,
+		importantForAccessibility: "yes",
+		...viewProps,
+		onLayout,
+		style: [
+			modalStyles.root,
+			internalStyles.surface,
+			{
+				backgroundColor: rootBackgroundColor,
+				maxHeight: rootMaxHeight,
+				maxWidth: resolveModalDimension(maxWidth),
+				height: shouldFillHeight ? rootMaxHeight : void 0,
+				width: fullWidth ? "100%" : void 0,
+				borderRadius: rootBorderRadius,
+				overflow: showBlurBox ? "hidden" : void 0
+			},
+			animatedSurfaceStyle,
+			style
+		],
+		children: [showBlurBox && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Box, {
+			style: StyleSheet.absoluteFill,
+			blur: blurIntensity,
+			blurTarget
+		}), /* @__PURE__ */ jsx(View, {
+			pointerEvents: "none",
+			style: [StyleSheet.absoluteFill, {
+				backgroundColor: rootTokens.backgroundBlurColor,
+				borderRadius: rootBorderRadius
+			}]
+		})] }), /* @__PURE__ */ jsxs(ModalContext.Provider, {
+			value: modalContextValue,
+			children: [
+				!hideDismissButton && closeIcon !== false && /* @__PURE__ */ jsx(AnimatedPressable, {
+					accessibilityLabel: closeLabel,
+					accessibilityRole: "button",
+					hitSlop: 12,
+					onPress: onClose,
+					onPressIn: handleClosePressIn,
+					onPressOut: handleClosePressOut,
+					style: [
+						modalStyles.closeIconContainer,
+						internalStyles.closeIconContainer,
+						{
+							borderRadius: closeIconContainerSize,
+							right: closeIconRight,
+							top: closeIconTop,
+							transform: [{ translateX: closeIconOffset }, { translateY: -closeIconOffset }]
+						},
+						animatedCloseIconContainerStyle
+					],
+					children: /* @__PURE__ */ jsx(IconSlot, {
+						icon: closeIcon,
+						variant: "outline",
+						size: modalStyles.closeIcon.iconSizeToken ?? "md",
+						style: modalStyles.closeIcon,
+						accessibilityElementsHidden: true,
+						importantForAccessibility: "no"
+					})
+				}),
+				shouldRenderHeader && /* @__PURE__ */ jsx(View, {
+					style: [
+						modalStyles.spacingHorizontal,
+						internalStyles.header,
+						{ marginBottom: headerSpacingBottom }
+					],
+					children: hasTitleOrDescription && /* @__PURE__ */ jsxs(View, {
+						style: [internalStyles.titleDescriptionWrapper, { gap: modalStyles.titleDescriptionWrapper.gap }],
+						children: [modalTitle || (titleProp ? /* @__PURE__ */ jsx(ModalTitle, { children: titleProp }) : null), modalDescription || (descriptionProp ? /* @__PURE__ */ jsx(ModalDescription, { children: descriptionProp }) : null)]
+					})
+				}),
+				modalContent || (contentProp ? /* @__PURE__ */ jsx(ModalContent, { children: typeof contentProp === "string" || typeof contentProp === "number" ? /* @__PURE__ */ jsx(Text$1, {
+					color: "secondary",
+					variant: "ui1",
+					children: contentProp
+				}) : contentProp }) : /* @__PURE__ */ jsx(View, { style: internalStyles.grow })),
+				modalActions || (actionsProp ? /* @__PURE__ */ jsx(ModalActions, { children: actionsProp }) : null)
+			]
+		})]
+	});
+	const positionerInsetStyle = {
+		paddingTop: safeAreaInsets.top + gutter,
+		paddingRight: safeAreaInsets.right + gutter,
+		paddingBottom: safeAreaInsets.bottom + gutter,
+		paddingLeft: safeAreaInsets.left + gutter
+	};
+	const positionerStyle = [
+		internalStyles.positioner,
+		shouldFillHeight && internalStyles.fullHeightPositioner,
+		positionerInsetStyle
+	];
+	const outsidePositionerStyle = [internalStyles.outsidePositioner, positionerInsetStyle];
+	const positionedSurface = /* @__PURE__ */ jsx(View, {
+		style: positionerStyle,
+		testID: "uds-modal-positioner",
+		children: surface
+	});
+	const overlay = /* @__PURE__ */ jsx(GestureHandlerRootView, {
+		style: StyleSheet.absoluteFill,
+		children: /* @__PURE__ */ jsxs(View, {
+			onTouchEndCapture: dismissible ? handleOverlayTouchEndCapture : void 0,
+			pointerEvents: "auto",
+			style: StyleSheet.absoluteFill,
+			testID: "uds-modal-overlay",
+			children: [
+				/* @__PURE__ */ jsx(AndroidBackHandler, {
+					isOpen: open,
+					dismissible,
+					onDismiss: handleDismiss
+				}),
+				shouldRenderScrim && /* @__PURE__ */ jsx(Scrim, {
+					translateY: progress,
+					openTranslateY: VISIBLE_PROGRESS,
+					closedTranslateY: HIDDEN_PROGRESS,
+					dismissible: false,
+					onDismiss: handleDismiss,
+					blurTarget
+				}),
+				scrollBehavior === "outside" ? /* @__PURE__ */ jsx(ScrollView, {
+					alwaysBounceVertical: false,
+					bounces: false,
+					keyboardShouldPersistTaps: "handled",
+					onMomentumScrollEnd: handleModalScrollInteractionEnd,
+					onScroll: handleModalScroll,
+					onScrollBeginDrag: handleModalScrollInteractionBegin,
+					onScrollEndDrag: handleModalScrollInteractionEnd,
+					overScrollMode: "never",
+					scrollEventThrottle: 16,
+					contentContainerStyle: outsidePositionerStyle,
+					style: StyleSheet.absoluteFill,
+					children: surface
+				}) : positionedSurface
+			]
+		})
+	});
+	if (!portal) return overlay;
+	return /* @__PURE__ */ jsx(OverlayPortal, {
+		useFullWindowOverlay,
+		children: overlay
+	});
+});
+Modal.displayName = "Modal";
+const internalStyles = StyleSheet.create({
+	positioner: {
+		alignItems: "center",
+		flexGrow: 1,
+		justifyContent: "center"
+	},
+	fullHeightPositioner: { flex: 1 },
+	outsidePositioner: {
+		alignItems: "center",
+		justifyContent: "center",
+		minHeight: "100%",
+		position: "relative"
+	},
+	surface: {
+		alignSelf: "center",
+		position: "relative",
+		zIndex: 1
+	},
+	closeIconContainer: {
+		alignItems: "center",
+		justifyContent: "center",
+		position: "absolute",
+		zIndex: 1
+	},
+	header: { alignItems: "stretch" },
+	titleDescriptionWrapper: { minWidth: 0 },
+	grow: { flexGrow: 1 }
+});
+//#endregion
+export { Modal };
+
+//# sourceMappingURL=Modal.js.map

package/dist/components/Modal/Modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.js","names":["Text"],"sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import type { RefObject } from 'react';\nimport { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport type { GestureResponderEvent, NativeScrollEvent, NativeSyntheticEvent } from 'react-native';\nimport { AccessibilityInfo, Platform, ScrollView, StyleSheet, View } from 'react-native';\nimport { GestureHandlerRootView } from 'react-native-gesture-handler';\nimport Animated, {\n  Easing,\n  interpolate,\n  useAnimatedStyle,\n  useSharedValue,\n  withTiming,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport { modalStyles } from '../../../generated/styles';\nimport { AndroidBackHandler } from '../AndroidBackHandler';\nimport { Box } from '../Box';\nimport { IconSlot } from '../IconSlot';\nimport { OverlayPortal } from '../internal/Overlay/OverlayPortal';\nimport { AnimatedPressable } from '../Pressable';\nimport { Scrim } from '../Scrim';\nimport { Text } from '../Text';\nimport { ModalActions } from './ModalActions';\nimport { ModalContent } from './ModalContent';\nimport { ModalContext } from './ModalContext';\nimport { ModalDescription } from './ModalDescription';\nimport { ModalTitle } from './ModalTitle';\nimport type { ModalContextValue, ModalProps, ModalRootTokens } from './types';\nimport {\n  getEventPagePoint,\n  resolveModalDimension,\n  separateChildren,\n  shouldDismissModalRelease,\n} from './utils';\n\nconst ANIMATION_DURATION_IN = 400;\nconst ANIMATION_DURATION_OUT = 250;\nconst ANIMATION_EASING_IN = Easing.bezier(0.3, 0.4, 0.2, 1);\nconst ANIMATION_EASING_OUT = Easing.bezier(0.6, 0, 0.7, 0.6);\nconst HIDDEN_SCALE = 0.95;\nconst HIDDEN_PROGRESS = 1;\nconst VISIBLE_PROGRESS = 0;\nconst SCROLL_DISMISS_SUPPRESSION_MS = 150;\nconst SCROLL_OFFSET_THRESHOLD = 1;\n\ntype ModalPresenceState = 'closed' | 'closing' | 'open';\n\nfunction usePrefersReducedMotion(): boolean {\n  const [prefersReducedMotion, setPrefersReducedMotion] = useState(false);\n\n  useEffect(() => {\n    let isMounted = true;\n\n    void AccessibilityInfo.isReduceMotionEnabled().then((isReduceMotionEnabled) => {\n      if (isMounted) {\n        setPrefersReducedMotion(isReduceMotionEnabled);\n      }\n    });\n\n    const subscription = AccessibilityInfo.addEventListener(\n      'reduceMotionChanged',\n      (isReduceMotionEnabled: boolean) => {\n        setPrefersReducedMotion(isReduceMotionEnabled);\n      },\n    );\n\n    return () => {\n      isMounted = false;\n      subscription.remove();\n    };\n  }, []);\n\n  return prefersReducedMotion;\n}\n\nconst Modal = memo(function Modal({\n  children,\n  open,\n  onClose,\n  onOpen,\n  portal = true,\n  includeScrim,\n  dismissible = true,\n  hideDismissButton = false,\n  reduceMotion = false,\n  closeIcon = 'Cross',\n  closeAriaLabel = 'Close',\n  closeAccessibilityLabel,\n  maxWidth = 'auto',\n  maxHeight = 'auto',\n  fullWidth = false,\n  fullHeight = false,\n  title: titleProp,\n  description: descriptionProp,\n  content: contentProp,\n  actions: actionsProp,\n  scrollBehavior = 'outside',\n  useFullWindowOverlay = true,\n  blurTarget,\n  style,\n  ref,\n  onLayout,\n  ...viewProps\n}: ModalProps) {\n  modalStyles.useVariants({});\n\n  const surfaceRef = useRef<View | null>(null);\n  const prevOpen = useRef(open);\n  const progress = useSharedValue(HIDDEN_PROGRESS);\n  const closePressProgress = useSharedValue(0);\n  const presenceState = useRef<ModalPresenceState>(open ? 'open' : 'closed');\n  const didModalScrollDuringGesture = useRef(false);\n  const isModalScrollInteracting = useRef(false);\n  const modalScrollDismissTimeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const modalScrollStartOffset = useRef<{ x: number; y: number } | null>(null);\n  const [, forcePresenceRender] = useState(0);\n  const prefersReducedMotion = usePrefersReducedMotion();\n  const reducedMotion = reduceMotion || prefersReducedMotion;\n  const safeAreaInsets = useSafeAreaInsets();\n\n  if (open) {\n    presenceState.current = 'open';\n  } else if (presenceState.current === 'open') {\n    presenceState.current = 'closing';\n  }\n\n  const isRendered = open || presenceState.current === 'closing';\n\n  const {\n    title: modalTitle,\n    description: modalDescription,\n    content: modalContent,\n    actions: modalActions,\n  } = separateChildren(children);\n\n  const hasTitleOrDescription = !!(modalTitle || titleProp || modalDescription || descriptionProp);\n  const shouldRenderHeader = !hideDismissButton || hasTitleOrDescription;\n  const hasContent = !!(modalContent || contentProp);\n  const shouldRenderScrim = includeScrim ?? true;\n  const closeLabel = closeAccessibilityLabel ?? closeAriaLabel;\n  const durationIn = reducedMotion ? 0 : ANIMATION_DURATION_IN;\n  const durationOut = reducedMotion ? 0 : ANIMATION_DURATION_OUT;\n\n  useEffect(() => {\n    if (open && !prevOpen.current) {\n      onOpen?.();\n    }\n    prevOpen.current = open;\n  }, [open, onOpen]);\n\n  useEffect(() => {\n    if (open) {\n      progress.value = HIDDEN_PROGRESS;\n      return;\n    }\n\n    if (!isRendered) {\n      return;\n    }\n\n    progress.value = withTiming(HIDDEN_PROGRESS, {\n      duration: durationOut,\n      easing: ANIMATION_EASING_OUT,\n    });\n\n    const timeout = setTimeout(() => {\n      if (presenceState.current === 'closing') {\n        presenceState.current = 'closed';\n        forcePresenceRender((revision) => revision + 1);\n      }\n    }, durationOut);\n\n    return () => clearTimeout(timeout);\n  }, [durationOut, isRendered, open, progress]);\n\n  useEffect(() => {\n    if (!open || !isRendered) {\n      return;\n    }\n\n    if (durationIn === 0) {\n      progress.value = VISIBLE_PROGRESS;\n      return;\n    }\n\n    const animationFrame = requestAnimationFrame(() => {\n      progress.value = withTiming(VISIBLE_PROGRESS, {\n        duration: durationIn,\n        easing: ANIMATION_EASING_IN,\n      });\n    });\n\n    return () => cancelAnimationFrame(animationFrame);\n  }, [durationIn, isRendered, open, progress]);\n\n  const handleDismiss = useCallback(() => {\n    onClose?.();\n  }, [onClose]);\n\n  const clearModalScrollDismissTimeout = useCallback(() => {\n    if (modalScrollDismissTimeout.current) {\n      clearTimeout(modalScrollDismissTimeout.current);\n      modalScrollDismissTimeout.current = null;\n    }\n  }, []);\n\n  const handleModalScrollInteractionBegin = useCallback(\n    (event: NativeSyntheticEvent<NativeScrollEvent>) => {\n      clearModalScrollDismissTimeout();\n      isModalScrollInteracting.current = true;\n      didModalScrollDuringGesture.current = false;\n      modalScrollStartOffset.current = event.nativeEvent.contentOffset;\n    },\n    [clearModalScrollDismissTimeout],\n  );\n\n  const handleModalScroll = useCallback((event: NativeSyntheticEvent<NativeScrollEvent>) => {\n    if (!isModalScrollInteracting.current || didModalScrollDuringGesture.current) {\n      return;\n    }\n\n    const startOffset = modalScrollStartOffset.current;\n    const currentOffset = event.nativeEvent.contentOffset;\n\n    if (!startOffset) {\n      return;\n    }\n\n    const movedX = Math.abs(currentOffset.x - startOffset.x);\n    const movedY = Math.abs(currentOffset.y - startOffset.y);\n\n    if (movedX > SCROLL_OFFSET_THRESHOLD || movedY > SCROLL_OFFSET_THRESHOLD) {\n      didModalScrollDuringGesture.current = true;\n    }\n  }, []);\n\n  const handleModalScrollInteractionEnd = useCallback(() => {\n    clearModalScrollDismissTimeout();\n    modalScrollDismissTimeout.current = setTimeout(() => {\n      isModalScrollInteracting.current = false;\n      didModalScrollDuringGesture.current = false;\n      modalScrollDismissTimeout.current = null;\n      modalScrollStartOffset.current = null;\n    }, SCROLL_DISMISS_SUPPRESSION_MS);\n  }, [clearModalScrollDismissTimeout]);\n\n  useEffect(() => clearModalScrollDismissTimeout, [clearModalScrollDismissTimeout]);\n\n  const handleScrimRelease = useCallback(\n    (absoluteX: number, absoluteY: number) => {\n      if (!dismissible) {\n        return;\n      }\n\n      if (!surfaceRef.current?.measureInWindow) {\n        return;\n      }\n\n      surfaceRef.current.measureInWindow((x, y, width, height) => {\n        if (shouldDismissModalRelease({ x: absoluteX, y: absoluteY }, { x, y, width, height })) {\n          onClose?.();\n        }\n      });\n    },\n    [dismissible, onClose],\n  );\n\n  const handleOverlayTouchEndCapture = useCallback(\n    (event: GestureResponderEvent) => {\n      if (isModalScrollInteracting.current && didModalScrollDuringGesture.current) {\n        return;\n      }\n\n      const pagePoint = getEventPagePoint(event);\n\n      if (!pagePoint) {\n        return;\n      }\n\n      handleScrimRelease(pagePoint.x, pagePoint.y);\n    },\n    [handleScrimRelease],\n  );\n\n  const setSurfaceRef = useCallback(\n    (node: View | null) => {\n      surfaceRef.current = node;\n\n      if (typeof ref === 'function') {\n        ref(node);\n      } else if (ref) {\n        ref.current = node;\n      }\n    },\n    [ref],\n  );\n\n  const handleClosePressIn = useCallback(() => {\n    closePressProgress.value = withTiming(1, {\n      duration: reducedMotion ? 0 : 120,\n    });\n  }, [closePressProgress, reducedMotion]);\n\n  const handleClosePressOut = useCallback(() => {\n    closePressProgress.value = withTiming(0, {\n      duration: reducedMotion ? 0 : 120,\n    });\n  }, [closePressProgress, reducedMotion]);\n\n  const animatedSurfaceStyle = useAnimatedStyle(() => ({\n    opacity: interpolate(progress.value, [VISIBLE_PROGRESS, HIDDEN_PROGRESS], [1, 0], 'clamp'),\n    transform: [\n      {\n        scale: interpolate(\n          progress.value,\n          [VISIBLE_PROGRESS, HIDDEN_PROGRESS],\n          [1, HIDDEN_SCALE],\n          'clamp',\n        ),\n      },\n    ],\n  }));\n\n  const animatedCloseIconContainerStyle = useAnimatedStyle(() => ({\n    backgroundColor: `rgba(29, 34, 40, ${interpolate(\n      closePressProgress.value,\n      [0, 1],\n      [0, 0.15],\n      'clamp',\n    ).toFixed(3)})`,\n  }));\n\n  const modalContextValue = useMemo<ModalContextValue>(\n    () => ({\n      scrollBehavior,\n      hasContent,\n      onScroll: handleModalScroll,\n      onScrollInteractionBegin: handleModalScrollInteractionBegin,\n      onScrollInteractionEnd: handleModalScrollInteractionEnd,\n      shouldRenderHeader,\n    }),\n    [\n      handleModalScroll,\n      handleModalScrollInteractionBegin,\n      handleModalScrollInteractionEnd,\n      hasContent,\n      scrollBehavior,\n      shouldRenderHeader,\n    ],\n  );\n\n  if (!isRendered) {\n    return null;\n  }\n\n  const rootTokens = StyleSheet.flatten(modalStyles.root) as ModalRootTokens;\n  const scrimTokens = StyleSheet.flatten(modalStyles.scrim) as { padding?: number };\n  const gutter = scrimTokens.padding ?? 0;\n  const blurIntensity = rootTokens.backgroundBlurRadius ?? 0;\n  const showBlurBox = blurIntensity > 0 && (Platform.OS === 'ios' || blurTarget != null);\n  const rootBackgroundColor = showBlurBox\n    ? 'transparent'\n    : blurIntensity > 0\n      ? (rootTokens.backgroundBlurColor ?? rootTokens.backgroundColor)\n      : rootTokens.backgroundColor;\n  const rootBorderRadius = rootTokens.borderRadius ?? 0;\n  const rootMaxHeight = scrollBehavior === 'inside' ? resolveModalDimension(maxHeight) : undefined;\n  const shouldFillHeight = fullHeight && scrollBehavior === 'inside' && rootMaxHeight !== undefined;\n  const headerSpacingBottom = hasContent ? (modalStyles.root.paddingVertical ?? 0) : 0;\n  const closeIconSize = modalStyles.closeIcon.fontSize ?? 0;\n  const closeIconPadding = modalStyles.closeIconContainer.padding ?? 0;\n  const closeIconContainerSize = closeIconSize + closeIconPadding * 2;\n  const closeIconOffset = closeIconContainerSize / 2;\n  const closeIconTop = modalStyles.root.paddingVertical ?? 0;\n  const closeIconRight = modalStyles.spacingHorizontal.paddingHorizontal ?? 0;\n\n  const surface = (\n    <Animated.View\n      ref={setSurfaceRef}\n      accessibilityViewIsModal\n      importantForAccessibility=\"yes\"\n      {...viewProps}\n      onLayout={onLayout}\n      style={[\n        modalStyles.root,\n        internalStyles.surface,\n        {\n          backgroundColor: rootBackgroundColor,\n          maxHeight: rootMaxHeight,\n          maxWidth: resolveModalDimension(maxWidth),\n          height: shouldFillHeight ? rootMaxHeight : undefined,\n          width: fullWidth ? '100%' : undefined,\n          borderRadius: rootBorderRadius,\n          overflow: showBlurBox ? 'hidden' : undefined,\n        },\n        animatedSurfaceStyle,\n        style,\n      ]}\n    >\n      {showBlurBox && (\n        <>\n          <Box style={StyleSheet.absoluteFill} blur={blurIntensity} blurTarget={blurTarget} />\n          <View\n            pointerEvents=\"none\"\n            style={[\n              StyleSheet.absoluteFill,\n              {\n                backgroundColor: rootTokens.backgroundBlurColor,\n                borderRadius: rootBorderRadius,\n              },\n            ]}\n          />\n        </>\n      )}\n\n      <ModalContext.Provider value={modalContextValue}>\n        {!hideDismissButton && closeIcon !== false && (\n          <AnimatedPressable\n            accessibilityLabel={closeLabel}\n            accessibilityRole=\"button\"\n            hitSlop={12}\n            onPress={onClose}\n            onPressIn={handleClosePressIn}\n            onPressOut={handleClosePressOut}\n            style={[\n              modalStyles.closeIconContainer,\n              internalStyles.closeIconContainer,\n              {\n                borderRadius: closeIconContainerSize,\n                right: closeIconRight,\n                top: closeIconTop,\n                transform: [{ translateX: closeIconOffset }, { translateY: -closeIconOffset }],\n              },\n              animatedCloseIconContainerStyle,\n            ]}\n          >\n            <IconSlot\n              icon={closeIcon}\n              variant=\"outline\"\n              size={modalStyles.closeIcon.iconSizeToken ?? 'md'}\n              style={modalStyles.closeIcon}\n              accessibilityElementsHidden\n              importantForAccessibility=\"no\"\n            />\n          </AnimatedPressable>\n        )}\n        {shouldRenderHeader && (\n          <View\n            style={[\n              modalStyles.spacingHorizontal,\n              internalStyles.header,\n              { marginBottom: headerSpacingBottom },\n            ]}\n          >\n            {hasTitleOrDescription && (\n              <View\n                style={[\n                  internalStyles.titleDescriptionWrapper,\n                  { gap: modalStyles.titleDescriptionWrapper.gap },\n                ]}\n              >\n                {modalTitle || (titleProp ? <ModalTitle>{titleProp}</ModalTitle> : null)}\n                {modalDescription ||\n                  (descriptionProp ? <ModalDescription>{descriptionProp}</ModalDescription> : null)}\n              </View>\n            )}\n          </View>\n        )}\n\n        {modalContent ||\n          (contentProp ? (\n            <ModalContent>\n              {typeof contentProp === 'string' || typeof contentProp === 'number' ? (\n                <Text color=\"secondary\" variant=\"ui1\">\n                  {contentProp}\n                </Text>\n              ) : (\n                contentProp\n              )}\n            </ModalContent>\n          ) : (\n            <View style={internalStyles.grow} />\n          ))}\n\n        {modalActions || (actionsProp ? <ModalActions>{actionsProp}</ModalActions> : null)}\n      </ModalContext.Provider>\n    </Animated.View>\n  );\n\n  const positionerInsetStyle = {\n    paddingTop: safeAreaInsets.top + gutter,\n    paddingRight: safeAreaInsets.right + gutter,\n    paddingBottom: safeAreaInsets.bottom + gutter,\n    paddingLeft: safeAreaInsets.left + gutter,\n  };\n\n  const positionerStyle = [\n    internalStyles.positioner,\n    shouldFillHeight && internalStyles.fullHeightPositioner,\n    positionerInsetStyle,\n  ];\n\n  const outsidePositionerStyle = [internalStyles.outsidePositioner, positionerInsetStyle];\n\n  const positionedSurface = (\n    <View style={positionerStyle} testID=\"uds-modal-positioner\">\n      {surface}\n    </View>\n  );\n\n  const overlay = (\n    <GestureHandlerRootView style={StyleSheet.absoluteFill}>\n      <View\n        onTouchEndCapture={dismissible ? handleOverlayTouchEndCapture : undefined}\n        pointerEvents=\"auto\"\n        style={StyleSheet.absoluteFill}\n        testID=\"uds-modal-overlay\"\n      >\n        <AndroidBackHandler isOpen={open} dismissible={dismissible} onDismiss={handleDismiss} />\n        {shouldRenderScrim && (\n          <Scrim\n            translateY={progress}\n            openTranslateY={VISIBLE_PROGRESS}\n            closedTranslateY={HIDDEN_PROGRESS}\n            dismissible={false}\n            onDismiss={handleDismiss}\n            blurTarget={blurTarget as RefObject<View | null> | undefined}\n          />\n        )}\n        {scrollBehavior === 'outside' ? (\n          <ScrollView\n            alwaysBounceVertical={false}\n            bounces={false}\n            keyboardShouldPersistTaps=\"handled\"\n            onMomentumScrollEnd={handleModalScrollInteractionEnd}\n            onScroll={handleModalScroll}\n            onScrollBeginDrag={handleModalScrollInteractionBegin}\n            onScrollEndDrag={handleModalScrollInteractionEnd}\n            overScrollMode=\"never\"\n            scrollEventThrottle={16}\n            contentContainerStyle={outsidePositionerStyle}\n            style={StyleSheet.absoluteFill}\n          >\n            {surface}\n          </ScrollView>\n        ) : (\n          positionedSurface\n        )}\n      </View>\n    </GestureHandlerRootView>\n  );\n\n  if (!portal) {\n    return overlay;\n  }\n\n  return <OverlayPortal useFullWindowOverlay={useFullWindowOverlay}>{overlay}</OverlayPortal>;\n});\n\nModal.displayName = 'Modal';\n\nconst internalStyles = StyleSheet.create({\n  positioner: {\n    alignItems: 'center',\n    flexGrow: 1,\n    justifyContent: 'center',\n  },\n  fullHeightPositioner: {\n    flex: 1,\n  },\n  outsidePositioner: {\n    alignItems: 'center',\n    justifyContent: 'center',\n    minHeight: '100%',\n    position: 'relative',\n  },\n  surface: {\n    alignSelf: 'center',\n    position: 'relative',\n    zIndex: 1,\n  },\n  closeIconContainer: {\n    alignItems: 'center',\n    justifyContent: 'center',\n    position: 'absolute',\n    zIndex: 1,\n  },\n  header: {\n    alignItems: 'stretch',\n  },\n  titleDescriptionWrapper: {\n    minWidth: 0,\n  },\n  grow: {\n    flexGrow: 1,\n  },\n});\n\nexport { Modal };\n"],"mappings":"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"}

package/dist/components/Modal/ModalActions.cjs

@@ -0,0 +1,47 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../../_virtual/_rolldown/runtime.cjs");
+const require_components_Modal_ModalContext = require("./ModalContext.cjs");
+let react = require("react");
+let react_native = require("react-native");
+let react_jsx_runtime = require("react/jsx-runtime");
+let generated_styles = require("../../../generated/styles");
+//#region src/components/Modal/ModalActions.tsx
+const ModalActions = (0, react.memo)(function ModalActions({ children, startContent, style, ref, ...viewProps }) {
+	const { hasContent, shouldRenderHeader } = require_components_Modal_ModalContext.useInternalModalContext();
+	generated_styles.modalStyles.useVariants({});
+	const spacingTop = !hasContent && shouldRenderHeader ? 0 : generated_styles.modalStyles.root.paddingVertical ?? 0;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_native.View, {
+		ref,
+		...viewProps,
+		style: [
+			generated_styles.modalStyles.spacingHorizontal,
+			internalStyles.root,
+			{ paddingTop: spacingTop },
+			style
+		],
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.View, {
+			style: [internalStyles.actionsInner, { gap: generated_styles.modalStyles.actions.gap }],
+			children
+		}), startContent && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.View, {
+			style: internalStyles.startContent,
+			children: startContent
+		})]
+	});
+});
+ModalActions.displayName = "ModalActions";
+ModalActions.__modalSlot = "actions";
+const internalStyles = react_native.StyleSheet.create({
+	root: {
+		alignItems: "center",
+		flexDirection: "row-reverse",
+		justifyContent: "space-between"
+	},
+	actionsInner: {
+		alignItems: "center",
+		flexDirection: "row-reverse"
+	},
+	startContent: { alignItems: "center" }
+});
+//#endregion
+exports.ModalActions = ModalActions;

package/dist/components/Modal/ModalActions.d.cts

@@ -0,0 +1,9 @@
+
+import { ModalActionsProps } from "./types.cjs";
+import * as _$react from "react";
+
+//#region src/components/Modal/ModalActions.d.ts
+declare const ModalActions: _$react.NamedExoticComponent<ModalActionsProps>;
+//#endregion
+export { ModalActions, type ModalActionsProps };
+//# sourceMappingURL=ModalActions.d.cts.map

package/dist/components/Modal/ModalActions.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalActions.d.cts","names":[],"sources":["../../../src/components/Modal/ModalActions.tsx"],"mappings":";;;;;cAOM,YAAA,EAAY,OAAA,CAAA,oBAAA,CAAA,iBAAA"}

package/dist/components/Modal/ModalActions.d.ts

@@ -0,0 +1,9 @@
+
+import { ModalActionsProps } from "./types.js";
+import * as _$react from "react";
+
+//#region src/components/Modal/ModalActions.d.ts
+declare const ModalActions: _$react.NamedExoticComponent<ModalActionsProps>;
+//#endregion
+export { ModalActions, type ModalActionsProps };
+//# sourceMappingURL=ModalActions.d.ts.map

package/dist/components/Modal/ModalActions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalActions.d.ts","names":[],"sources":["../../../src/components/Modal/ModalActions.tsx"],"mappings":";;;;;cAOM,YAAA,EAAY,OAAA,CAAA,oBAAA,CAAA,iBAAA"}

package/dist/components/Modal/ModalActions.js

@@ -0,0 +1,47 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { useInternalModalContext } from "./ModalContext.js";
+import { memo } from "react";
+import { StyleSheet, View } from "react-native";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { modalStyles } from "../../../generated/styles";
+//#region src/components/Modal/ModalActions.tsx
+const ModalActions = memo(function ModalActions({ children, startContent, style, ref, ...viewProps }) {
+	const { hasContent, shouldRenderHeader } = useInternalModalContext();
+	modalStyles.useVariants({});
+	const spacingTop = !hasContent && shouldRenderHeader ? 0 : modalStyles.root.paddingVertical ?? 0;
+	return /* @__PURE__ */ jsxs(View, {
+		ref,
+		...viewProps,
+		style: [
+			modalStyles.spacingHorizontal,
+			internalStyles.root,
+			{ paddingTop: spacingTop },
+			style
+		],
+		children: [/* @__PURE__ */ jsx(View, {
+			style: [internalStyles.actionsInner, { gap: modalStyles.actions.gap }],
+			children
+		}), startContent && /* @__PURE__ */ jsx(View, {
+			style: internalStyles.startContent,
+			children: startContent
+		})]
+	});
+});
+ModalActions.displayName = "ModalActions";
+ModalActions.__modalSlot = "actions";
+const internalStyles = StyleSheet.create({
+	root: {
+		alignItems: "center",
+		flexDirection: "row-reverse",
+		justifyContent: "space-between"
+	},
+	actionsInner: {
+		alignItems: "center",
+		flexDirection: "row-reverse"
+	},
+	startContent: { alignItems: "center" }
+});
+//#endregion
+export { ModalActions };
+
+//# sourceMappingURL=ModalActions.js.map

package/dist/components/Modal/ModalActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalActions.js","names":[],"sources":["../../../src/components/Modal/ModalActions.tsx"],"sourcesContent":["import { memo } from 'react';\nimport { StyleSheet, View } from 'react-native';\n\nimport { modalStyles } from '../../../generated/styles';\nimport { useInternalModalContext } from './ModalContext';\nimport type { ModalActionsProps, ModalSlotComponent } from './types';\n\nconst ModalActions = memo(function ModalActions({\n  children,\n  startContent,\n  style,\n  ref,\n  ...viewProps\n}: ModalActionsProps) {\n  const { hasContent, shouldRenderHeader } = useInternalModalContext();\n\n  modalStyles.useVariants({});\n  const spacingTop =\n    !hasContent && shouldRenderHeader ? 0 : (modalStyles.root.paddingVertical ?? 0);\n\n  return (\n    <View\n      ref={ref}\n      {...viewProps}\n      style={[\n        modalStyles.spacingHorizontal,\n        internalStyles.root,\n        { paddingTop: spacingTop },\n        style,\n      ]}\n    >\n      <View style={[internalStyles.actionsInner, { gap: modalStyles.actions.gap }]}>\n        {children}\n      </View>\n      {startContent && <View style={internalStyles.startContent}>{startContent}</View>}\n    </View>\n  );\n});\n\nModalActions.displayName = 'ModalActions';\n(ModalActions as ModalSlotComponent).__modalSlot = 'actions';\n\nconst internalStyles = StyleSheet.create({\n  root: {\n    alignItems: 'center',\n    flexDirection: 'row-reverse',\n    justifyContent: 'space-between',\n  },\n  actionsInner: {\n    alignItems: 'center',\n    flexDirection: 'row-reverse',\n  },\n  startContent: {\n    alignItems: 'center',\n  },\n});\n\nexport { ModalActions, type ModalActionsProps };\n"],"mappings":";;;;;;;AAOA,MAAM,eAAe,KAAK,SAAS,aAAa,EAC9C,UACA,cACA,OACA,KACA,GAAG,aACiB;CACpB,MAAM,EAAE,YAAY,uBAAuB,yBAAyB;CAEpE,YAAY,YAAY,EAAE,CAAC;CAC3B,MAAM,aACJ,CAAC,cAAc,qBAAqB,IAAK,YAAY,KAAK,mBAAmB;CAE/E,OACE,qBAAC,MAAD;EACO;EACL,GAAI;EACJ,OAAO;GACL,YAAY;GACZ,eAAe;GACf,EAAE,YAAY,YAAY;GAC1B;GACD;YARH,CAUE,oBAAC,MAAD;GAAM,OAAO,CAAC,eAAe,cAAc,EAAE,KAAK,YAAY,QAAQ,KAAK,CAAC;GACzE;GACI,CAAA,EACN,gBAAgB,oBAAC,MAAD;GAAM,OAAO,eAAe;aAAe;GAAoB,CAAA,CAC3E;;EAET;AAEF,aAAa,cAAc;AAC3B,aAAqC,cAAc;AAEnD,MAAM,iBAAiB,WAAW,OAAO;CACvC,MAAM;EACJ,YAAY;EACZ,eAAe;EACf,gBAAgB;EACjB;CACD,cAAc;EACZ,YAAY;EACZ,eAAe;EAChB;CACD,cAAc,EACZ,YAAY,UACb;CACF,CAAC"}

package/dist/components/Modal/ModalContent.cjs

@@ -0,0 +1,41 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../../_virtual/_rolldown/runtime.cjs");
+const require_components_Modal_ModalContext = require("./ModalContext.cjs");
+let react = require("react");
+let react_native = require("react-native");
+let react_jsx_runtime = require("react/jsx-runtime");
+let generated_styles = require("../../../generated/styles");
+//#region src/components/Modal/ModalContent.tsx
+const ModalContent = (0, react.memo)(function ModalContent({ children, contentContainerStyle, style, ref, ...viewProps }) {
+	const { onScroll, onScrollInteractionBegin, onScrollInteractionEnd, scrollBehavior } = require_components_Modal_ModalContext.useInternalModalContext();
+	generated_styles.modalStyles.useVariants({});
+	if (scrollBehavior === "inside") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.ScrollView, {
+		ref,
+		disableScrollViewPanResponder: true,
+		keyboardShouldPersistTaps: "handled",
+		...viewProps,
+		contentContainerStyle: [generated_styles.modalStyles.spacingHorizontal, contentContainerStyle],
+		onMomentumScrollEnd: onScrollInteractionEnd,
+		onScroll,
+		onScrollBeginDrag: onScrollInteractionBegin,
+		onScrollEndDrag: onScrollInteractionEnd,
+		scrollEventThrottle: 16,
+		style: [styles.insideContent, style],
+		children
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.View, {
+		ref,
+		...viewProps,
+		style: [generated_styles.modalStyles.spacingHorizontal, style],
+		children
+	});
+});
+ModalContent.displayName = "ModalContent";
+ModalContent.__modalSlot = "content";
+const styles = react_native.StyleSheet.create({ insideContent: {
+	flexGrow: 1,
+	flexShrink: 1
+} });
+//#endregion
+exports.ModalContent = ModalContent;

package/dist/components/Modal/ModalContent.d.cts

@@ -0,0 +1,9 @@
+
+import { ModalContentProps } from "./types.cjs";
+import * as _$react from "react";
+
+//#region src/components/Modal/ModalContent.d.ts
+declare const ModalContent: _$react.NamedExoticComponent<ModalContentProps>;
+//#endregion
+export { ModalContent, type ModalContentProps };
+//# sourceMappingURL=ModalContent.d.cts.map

package/dist/components/Modal/ModalContent.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalContent.d.cts","names":[],"sources":["../../../src/components/Modal/ModalContent.tsx"],"mappings":";;;;;cASM,YAAA,EAAY,OAAA,CAAA,oBAAA,CAAA,iBAAA"}

package/dist/components/Modal/ModalContent.d.ts

@@ -0,0 +1,9 @@
+
+import { ModalContentProps } from "./types.js";
+import * as _$react from "react";
+
+//#region src/components/Modal/ModalContent.d.ts
+declare const ModalContent: _$react.NamedExoticComponent<ModalContentProps>;
+//#endregion
+export { ModalContent, type ModalContentProps };
+//# sourceMappingURL=ModalContent.d.ts.map

package/dist/components/Modal/ModalContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalContent.d.ts","names":[],"sources":["../../../src/components/Modal/ModalContent.tsx"],"mappings":";;;;;cASM,YAAA,EAAY,OAAA,CAAA,oBAAA,CAAA,iBAAA"}