@butternutbox/pawprint-native 0.10.8 → 0.10.9

package/dist/index.js

@@ -9,7 +9,7 @@ import ibmPlexSansCondensed400 from './ibm-plex-sans-condensed-400-normal.ttf';
 import ibmPlexSansCondensed500 from './ibm-plex-sans-condensed-500-normal.ttf';
 import ibmPlexSansCondensed600 from './ibm-plex-sans-condensed-600-normal.ttf';
 import ibmPlexSansCondensed700 from './ibm-plex-sans-condensed-700-normal.ttf';
-import React66, { createContext, forwardRef, useRef, useEffect, useState, useCallback, useMemo, useContext } from 'react';
+import React65, { createContext, forwardRef, useRef, useEffect, useState, useCallback, useMemo, useContext } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as AvatarPrimitive from '@rn-primitives/avatar';
 import { Text, View, Animated, Pressable, TextInput, Easing, StyleSheet, useWindowDimensions, PanResponder, Image, ScrollView, Keyboard, ActionSheetIOS, TouchableOpacity, Platform, Modal, TouchableWithoutFeedback, FlatList, Linking, Clipboard, Alert } from 'react-native';
@@ -190,7 +190,7 @@ var VARIANT_DEFAULTS = {
   display: { size: "lg" }
 };
 var StyledText = styled50(Text)({});
-var Typography = React66.forwardRef(
+var Typography = React65.forwardRef(
   (props, ref) => {
     const theme2 = useTheme();
     const { typography, colour } = theme2.tokens.semantics;
@@ -280,7 +280,7 @@ var StyledIconRoot = styled50(View)(({ iconDimension }) => ({
   width: iconDimension,
   height: iconDimension
 }));
-var Icon = React66.forwardRef(
+var Icon = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       icon: IconComponent,
@@ -3880,7 +3880,7 @@ var AVATAR_SIZE_TO_ICON_SIZE = {
   md: "md",
   lg: "xl"
 };
-var AvatarRoot = React66.forwardRef(
+var AvatarRoot = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       src,
@@ -3939,7 +3939,7 @@ function getVisibleDots(count, activeIndex) {
   const windowStart = Math.min(Math.max(activeIndex - 2, 0), count - 5);
   return Array.from({ length: 5 }, (_, i) => windowStart + i);
 }
-var CarouselControls = React66.forwardRef(
+var CarouselControls = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { count, activeIndex, showBackground = true } = _b, props = __objRest(_b, ["count", "activeIndex", "showBackground"]);
     const theme2 = useTheme();
@@ -4026,7 +4026,7 @@ var StyledBadge = styled50(View)(({ theme: theme2, badgeVariant, badgeSize, pinn
     backgroundColor: backgroundColorMap[badgeVariant]
   }, borderRadiusStyles), positionStyles);
 });
-var Badge = React66.forwardRef(
+var Badge = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       variant = "primary",
@@ -4101,7 +4101,7 @@ var Badge = React66.forwardRef(
 Badge.displayName = "Badge";
 var parseTokenValue6 = (value) => parseFloat(value);
 var StyledSpinner = styled50(View)({});
-var Spinner = React66.forwardRef(
+var Spinner = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { size = "md", variant = "dark", style } = _b, rest = __objRest(_b, ["size", "variant", "style"]);
     const theme2 = useTheme();
@@ -4208,7 +4208,7 @@ var StyledSpinnerWrapper = styled50(View)({
   alignItems: "center",
   justifyContent: "center"
 });
-var Button = React66.forwardRef(
+var Button = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       variant = "filled",
@@ -4240,7 +4240,7 @@ var Button = React66.forwardRef(
     const typographyKey = sizeToTypographyKey[size];
     const typography = buttons.text[typographyKey];
     resolveFont(typography.fontFamily, typography.fontWeight);
-    const [pressed, setPressed] = React66.useState(false);
+    const [pressed, setPressed] = React65.useState(false);
     const getVariantStyles = (isPressed) => {
       if (variant === "filled") {
         const bgTokens = buttons.filledButton.colour.background[colour];
@@ -4351,7 +4351,7 @@ var StyledHint = styled50(View)(({
     backgroundColor: hintVariantMap[hintVariant]
   };
 });
-var Hint = React66.forwardRef(
+var Hint = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { variant = "default" } = _b, rest = __objRest(_b, ["variant"]);
     return /* @__PURE__ */ jsx(StyledHint, __spreadValues({ ref, hintVariant: variant }, rest));
@@ -4393,7 +4393,7 @@ var StyledSpinnerWrapper2 = styled50(View)({
   alignItems: "center",
   justifyContent: "center"
 });
-var IconButton = React66.forwardRef(
+var IconButton = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       icon: IconComponent,
@@ -4419,7 +4419,7 @@ var IconButton = React66.forwardRef(
     const dimension = parseTokenValue9(sizeTokens.height);
     const iconSizing = theme2.tokens.components.icons.sizing.icons.core;
     const iconDimension = parseTokenValue9(iconSizing[sizeToIconSizeToken[size]]);
-    const [pressed, setPressed] = React66.useState(false);
+    const [pressed, setPressed] = React65.useState(false);
     const getVariantStyles = (isPressed) => {
       if (variant === "filled") {
         const filled = buttons.iconButton.filledButton;
@@ -4502,7 +4502,7 @@ var StyledRoot2 = styled50(View)(({ illustrationHeight }) => ({
   flexShrink: 0,
   height: illustrationHeight
 }));
-var Illustration = React66.forwardRef(
+var Illustration = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       illustration: IllustrationComponent,
@@ -4538,7 +4538,7 @@ var StyledLabelRow = styled50(View)(({ labelGap }) => ({
   alignItems: "center",
   gap: labelGap
 }));
-var InputLabel = React66.forwardRef(
+var InputLabel = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { optionalText, state = "default", children } = _b, rest = __objRest(_b, ["optionalText", "state", "children"]);
     const theme2 = useTheme();
@@ -4838,7 +4838,7 @@ var StyledIconSlot = styled50(View)({
   justifyContent: "center",
   flexShrink: 0
 });
-var InputField = React66.forwardRef(
+var InputField = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       leadingIcon,
@@ -4997,7 +4997,7 @@ var InputField = React66.forwardRef(
   }
 );
 InputField.displayName = "Input.Field";
-var InputText = React66.forwardRef(
+var InputText = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { placeholderTextColor } = _b, rest = __objRest(_b, ["placeholderTextColor"]);
     const theme2 = useTheme();
@@ -5016,7 +5016,7 @@ var StyledDescriptionRow = styled50(View)({
   flexDirection: "row",
   alignItems: "center"
 });
-var InputDescription = React66.forwardRef(
+var InputDescription = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { state = "default", children } = _b, rest = __objRest(_b, ["state", "children"]);
     const theme2 = useTheme();
@@ -5036,7 +5036,7 @@ var StyledErrorRow = styled50(View)({
   flexDirection: "row",
   alignItems: "center"
 });
-var InputError = React66.forwardRef(
+var InputError = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
     const theme2 = useTheme();
@@ -5059,7 +5059,7 @@ var StyledRoot3 = styled50(View)(({ theme: theme2 }) => {
     gap: parseTokenValue13(spacing.gap)
   };
 });
-var InputRoot = React66.forwardRef(
+var InputRoot = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       label,
@@ -5103,7 +5103,7 @@ var Input = Object.assign(InputRoot, {
   Description: InputDescription,
   Error: InputError
 });
-var Link = React66.forwardRef(
+var Link = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       size = "md",
@@ -7701,7 +7701,7 @@ var StyledRoot4 = styled50(View)({
   justifyContent: "center",
   flexShrink: 0
 });
-var Logo = React66.forwardRef(
+var Logo = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { brand, variant = "primary", "aria-label": ariaLabel } = _b, rest = __objRest(_b, ["brand", "variant", "aria-label"]);
     const effectiveVariant = brand === "bcorp" ? "primary" : variant;
@@ -7740,7 +7740,7 @@ var StyledInputContainer = styled50(View)(({ hasInlineHelp }) => ({
   flexDirection: "column",
   gap: hasInlineHelp ? 2 : 0
 }));
-var NumberInputField = React66.forwardRef((_a, ref) => {
+var NumberInputField = React65.forwardRef((_a, ref) => {
   var _b = _a, { fieldText, inlineHelpText } = _b, props = __objRest(_b, ["fieldText", "inlineHelpText"]);
   const theme2 = useTheme();
   const { colour, description } = theme2.tokens.components.inputs;
@@ -7837,7 +7837,7 @@ var StyledRoot5 = styled50(View)(({ theme: theme2 }) => {
     gap: parseTokenValue15(spacing.gap)
   };
 });
-var NumberInputRoot = React66.forwardRef(
+var NumberInputRoot = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       label,
@@ -7932,7 +7932,7 @@ var StyledContent = styled50(View)(({ contentGap }) => ({
   flex: 1,
   minWidth: 0
 }));
-var Switch = React66.forwardRef(
+var Switch = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       label,
@@ -7952,7 +7952,7 @@ var Switch = React66.forwardRef(
     const theme2 = useTheme();
     const { size, colour, opacity, borderWidth, spacing, typography } = theme2.tokens.components.switch;
     const isControlled = controlledChecked !== void 0;
-    const [internalChecked, setInternalChecked] = React66.useState(defaultChecked);
+    const [internalChecked, setInternalChecked] = React65.useState(defaultChecked);
     const isChecked = isControlled ? controlledChecked : internalChecked;
     const controlWidth = parseTokenValue16(size.control.width);
     const controlHeight = parseTokenValue16(size.control.height);
@@ -8058,7 +8058,7 @@ var StyledTag = styled50(View)(({ theme: theme2, tagVariant, tagSize }) => {
     backgroundColor: backgroundColorMap[tagVariant]
   };
 });
-var Tag = React66.forwardRef(
+var Tag = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { variant = "primary", size = "medium", icon, children } = _b, rest = __objRest(_b, ["variant", "size", "icon", "children"]);
     const theme2 = useTheme();
@@ -8158,7 +8158,7 @@ var IconWrapper2 = styled50(View)(({ side }) => {
     zIndex: 1
   };
 });
-var TextAreaField = React66.forwardRef(
+var TextAreaField = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       leadingIcon,
@@ -8351,7 +8351,7 @@ var StyledCharCountWrapper = styled50(View)(({ charCountGap, charCountPadding })
   gap: charCountGap,
   paddingLeft: charCountPadding
 }));
-var TextAreaLabel = React66.forwardRef(
+var TextAreaLabel = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       optionalText,
@@ -8415,7 +8415,7 @@ var StyledRoot6 = styled50(View)(({ theme: theme2 }) => {
     gap: parseTokenValue20(spacing.gap)
   };
 });
-var TextAreaRoot = React66.forwardRef(
+var TextAreaRoot = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       label,
@@ -8442,8 +8442,8 @@ var TextAreaRoot = React66.forwardRef(
       "defaultValue",
       "onChangeText"
     ]);
-    const [charCount, setCharCount] = React66.useState(0);
-    React66.useEffect(() => {
+    const [charCount, setCharCount] = React65.useState(0);
+    React65.useEffect(() => {
       if (value !== void 0) {
         setCharCount(String(value).length);
       } else if (defaultValue !== void 0) {
@@ -8496,7 +8496,7 @@ var TextArea = Object.assign(TextAreaRoot, {
   Description: InputDescription,
   Error: InputError
 });
-var AccordionContext = React66.createContext({
+var AccordionContext = React65.createContext({
   openValues: [],
   toggle: () => {
   },
@@ -8527,7 +8527,7 @@ var StyledDivider = styled50(View)(({ dividerColor, dividerMarginTop }) => ({
   backgroundColor: dividerColor,
   marginTop: dividerMarginTop
 }));
-var AccordionItem = React66.forwardRef(
+var AccordionItem = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { title, children, value, disabled: itemDisabled } = _b, rest = __objRest(_b, ["title", "children", "value", "disabled"]);
     const theme2 = useTheme();
@@ -8537,7 +8537,7 @@ var AccordionItem = React66.forwardRef(
       toggle,
       disabled: rootDisabled,
       size
-    } = React66.useContext(AccordionContext);
+    } = React65.useContext(AccordionContext);
     const itemValue = value != null ? value : title;
     const isOpen = openValues.includes(itemValue);
     const isDisabled = itemDisabled || rootDisabled;
@@ -8598,7 +8598,7 @@ var AccordionItem = React66.forwardRef(
   }
 );
 AccordionItem.displayName = "Accordion.Item";
-var AccordionRoot = React66.forwardRef(
+var AccordionRoot = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       children,
@@ -8620,11 +8620,11 @@ var AccordionRoot = React66.forwardRef(
     const theme2 = useTheme();
     const { accordion } = theme2.tokens.components;
     const isControlled = controlledValue !== void 0;
-    const [internalValue, setInternalValue] = React66.useState(
+    const [internalValue, setInternalValue] = React65.useState(
       defaultValue != null ? defaultValue : []
     );
     const openValues = isControlled ? controlledValue : internalValue;
-    const toggle = React66.useCallback(
+    const toggle = React65.useCallback(
       (itemValue) => {
         const isOpen = openValues.includes(itemValue);
         let next;
@@ -8642,7 +8642,7 @@ var AccordionRoot = React66.forwardRef(
       },
       [openValues, multiple, isControlled, onValueChange]
     );
-    const ctx = React66.useMemo(
+    const ctx = React65.useMemo(
       () => ({ openValues, toggle, disabled, size }),
       [openValues, toggle, disabled, size]
     );
@@ -8772,7 +8772,7 @@ function buildDelayedEntering(variant, delayMs) {
   b.delay(delayMs);
   return b;
 }
-var Animated5 = React66.forwardRef(
+var Animated5 = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { variant = "fade", delay, exit = true, children } = _b, props = __objRest(_b, ["variant", "delay", "exit", "children"]);
     const delayMs = delay !== void 0 && delay > 0 ? Math.round(delay * 1e3) : 0;
@@ -8790,7 +8790,7 @@ var Animated5 = React66.forwardRef(
   }
 );
 Animated5.displayName = "Animated";
-var DrawerContext = React66.createContext({
+var DrawerContext = React65.createContext({
   isOpen: false,
   modalVisible: false,
   openDrawer: () => {
@@ -8800,9 +8800,9 @@ var DrawerContext = React66.createContext({
   onExitComplete: () => {
   }
 });
-var useDrawerContext = () => React66.useContext(DrawerContext);
+var useDrawerContext = () => React65.useContext(DrawerContext);
 var FADE_DURATION = 220;
-var DrawerOverlay = React66.forwardRef(({ accessible = false }, _ref) => {
+var DrawerOverlay = React65.forwardRef(({ accessible = false }, _ref) => {
   const theme2 = useTheme();
   const { isOpen, closeDrawer } = useDrawerContext();
   const opacity = useRef(new Animated.Value(0)).current;
@@ -8836,14 +8836,12 @@ var DrawerOverlay = React66.forwardRef(({ accessible = false }, _ref) => {
   );
 });
 DrawerOverlay.displayName = "Drawer.Overlay";
-var DrawerDragContext = React66.createContext(null);
-var useDrawerDragContext = () => React66.useContext(DrawerDragContext);
-var DrawerMeasureContext = React66.createContext(null);
-var useDrawerMeasureContext = () => React66.useContext(DrawerMeasureContext);
-var DrawerFooterContext = React66.createContext(false);
-var useDrawerFooterContext = () => React66.useContext(DrawerFooterContext);
-var DrawerHeaderContext = React66.createContext(null);
-var useDrawerHeaderContext = () => React66.useContext(DrawerHeaderContext);
+var DrawerDragContext = React65.createContext(null);
+var useDrawerDragContext = () => React65.useContext(DrawerDragContext);
+var DrawerFooterContext = React65.createContext(false);
+var useDrawerFooterContext = () => React65.useContext(DrawerFooterContext);
+var DrawerHeaderContext = React65.createContext(null);
+var useDrawerHeaderContext = () => React65.useContext(DrawerHeaderContext);
 var OPEN_DURATION = 320;
 var CLOSE_DURATION = 220;
 var DISMISS_THRESHOLD = 80;
@@ -8858,12 +8856,17 @@ var StyledPanel2 = styled50(View)(
     panelShadowColor,
     panelShadowOffsetY,
     panelShadowBlur,
-    panelFlex
-  }) => __spreadProps(__spreadValues({
+    panelMaxHeight
+  }) => ({
     width: "100%",
     maxWidth: panelMaxWidth,
-    alignSelf: "center"
-  }, panelFlex != null ? { flex: panelFlex } : void 0), {
+    // The panel wraps its content and caps at maxHeight. It is intentionally
+    // NOT given a fixed height: letting it size to content means it re-fits
+    // automatically whenever the body grows or shrinks (async load, expanding
+    // sections). The body's own maxHeight (see DrawerBody) bounds scrolling and
+    // keeps the ScrollView from collapsing, so no fixed panel height is needed.
+    maxHeight: panelMaxHeight,
+    alignSelf: "center",
     borderTopLeftRadius: panelBorderRadius,
     borderTopRightRadius: panelBorderRadius,
     borderTopWidth: panelBorderWidth,
@@ -8879,7 +8882,7 @@ var StyledPanel2 = styled50(View)(
     overflow: "hidden"
   })
 );
-var DrawerContent = React66.forwardRef(
+var DrawerContent = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
     var _a2;
@@ -8889,7 +8892,6 @@ var DrawerContent = React66.forwardRef(
     const { isOpen, closeDrawer, onExitComplete } = useDrawerContext();
     const { height: windowHeight } = useWindowDimensions();
     const maxHeight = windowHeight * 0.9;
-    const bodyMaxHeight = windowHeight - 300;
     const closeDrawerRef = useRef(closeDrawer);
     useEffect(() => {
       closeDrawerRef.current = closeDrawer;
@@ -8900,19 +8902,12 @@ var DrawerContent = React66.forwardRef(
     const entryRanRef = useRef(false);
     const isOpenRef = useRef(isOpen);
     const activeAnim = useRef(null);
-    const [panelHeight, setPanelHeight] = useState(0);
     useEffect(() => {
       const id = translateY.addListener(({ value }) => {
         translateYValue.current = value;
       });
       return () => translateY.removeListener(id);
     }, [translateY]);
-    useEffect(() => {
-      if (panelHeightRef.current > 0 && panelHeightRef.current > maxHeight) {
-        setPanelHeight(maxHeight);
-        panelHeightRef.current = maxHeight;
-      }
-    }, [maxHeight]);
     const runEntry = useCallback(() => {
       var _a3;
       if (panelHeightRef.current === 0) return;
@@ -8961,60 +8956,16 @@ var DrawerContent = React66.forwardRef(
     }, [isOpen, runEntry, runExit]);
     const onLayout = useCallback(
       ({ nativeEvent }) => {
-        if (entryRanRef.current) return;
         const h = nativeEvent.layout.height;
         const capped = Math.min(h, maxHeight);
         if (capped <= 0) return;
-        if (capped !== panelHeightRef.current) {
-          setPanelHeight(capped);
-          panelHeightRef.current = capped;
-        }
-        if (isOpenRef.current) {
+        panelHeightRef.current = capped;
+        if (isOpenRef.current && !entryRanRef.current) {
           runEntry();
         }
       },
       [runEntry, maxHeight]
     );
-    const chromeRef = useRef(0);
-    const bodyContentRef = useRef(0);
-    const applyDesiredHeight = useCallback(() => {
-      const chrome = chromeRef.current;
-      const content = bodyContentRef.current;
-      const current = panelHeightRef.current;
-      if (chrome <= 0 || content <= 0 || current <= 0) return;
-      const desired = Math.min(
-        chrome + Math.min(content, bodyMaxHeight),
-        maxHeight
-      );
-      if (Math.abs(desired - current) > 1) {
-        panelHeightRef.current = desired;
-        setPanelHeight(desired);
-      }
-    }, [maxHeight, bodyMaxHeight]);
-    const setBodyFrameHeight = useCallback(
-      (frameHeight) => {
-        if (chromeRef.current <= 0) {
-          const current = panelHeightRef.current;
-          if (frameHeight > 0 && current > frameHeight) {
-            chromeRef.current = current - frameHeight;
-          }
-        }
-        applyDesiredHeight();
-      },
-      [applyDesiredHeight]
-    );
-    const setBodyContentHeight = useCallback(
-      (contentHeight) => {
-        if (contentHeight <= 0) return;
-        bodyContentRef.current = contentHeight;
-        applyDesiredHeight();
-      },
-      [applyDesiredHeight]
-    );
-    const measureContextValue = useMemo(
-      () => ({ setBodyFrameHeight, setBodyContentHeight }),
-      [setBodyFrameHeight, setBodyContentHeight]
-    );
     const panResponder = useRef(
       PanResponder.create({
         // Claim the responder as soon as a touch starts on the grabber so the
@@ -9073,23 +9024,19 @@ var DrawerContent = React66.forwardRef(
       () => ({ panHandlers: panResponder.panHandlers }),
       [panResponder.panHandlers]
     );
-    const hasFooter = React66.Children.toArray(children).some(
-      (child) => React66.isValidElement(child) && child.type.displayName === "Drawer.Footer"
+    const hasFooter = React65.Children.toArray(children).some(
+      (child) => React65.isValidElement(child) && child.type.displayName === "Drawer.Footer"
     );
-    const headerChild = React66.Children.toArray(children).find(
-      (child) => React66.isValidElement(child) && child.type.displayName === "Drawer.Header"
+    const headerChild = React65.Children.toArray(children).find(
+      (child) => React65.isValidElement(child) && child.type.displayName === "Drawer.Header"
     );
     const headerContextValue = headerChild != null ? {
       variant: (_a2 = headerChild.props.variant) != null ? _a2 : "titleAndText"
     } : null;
-    return /* @__PURE__ */ jsx(DrawerHeaderContext.Provider, { value: headerContextValue, children: /* @__PURE__ */ jsx(DrawerFooterContext.Provider, { value: hasFooter, children: /* @__PURE__ */ jsx(DrawerMeasureContext.Provider, { value: measureContextValue, children: /* @__PURE__ */ jsx(DrawerDragContext.Provider, { value: dragContextValue, children: /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx(DrawerHeaderContext.Provider, { value: headerContextValue, children: /* @__PURE__ */ jsx(DrawerFooterContext.Provider, { value: hasFooter, children: /* @__PURE__ */ jsx(DrawerDragContext.Provider, { value: dragContextValue, children: /* @__PURE__ */ jsx(
       Animated.View,
       {
-        style: [
-          styles.animatedWrapper,
-          panelHeight > 0 ? { height: panelHeight } : void 0,
-          { transform: [{ translateY }] }
-        ],
+        style: [styles.animatedWrapper, { transform: [{ translateY }] }],
         children: /* @__PURE__ */ jsx(
           StyledPanel2,
           __spreadProps(__spreadValues({
@@ -9098,7 +9045,7 @@ var DrawerContent = React66.forwardRef(
             panelBorderRadius: parseTokenValue22(drawer.borderRadius.top),
             panelBgColor: colour.background.container.default,
             panelMaxWidth: parseTokenValue22(drawer.size.maxWidth),
-            panelFlex: panelHeight > 0 ? 1 : void 0,
+            panelMaxHeight: maxHeight,
             panelBorderWidth: parseTokenValue22(dimensions3.borderWidth.sm),
             panelBorderColor: colour.border.default,
             panelShadowColor: modal.shadow.color,
@@ -9112,7 +9059,7 @@ var DrawerContent = React66.forwardRef(
           })
         )
       }
-    ) }) }) }) });
+    ) }) }) });
   }
 );
 DrawerContent.displayName = "Drawer.Content";
@@ -9140,7 +9087,7 @@ var StyledBar = styled50(View)(({ barWidth, barHeight, barBorderRadius, barColor
   borderRadius: barBorderRadius,
   backgroundColor: barColor
 }));
-var DrawerGrabber = React66.forwardRef(
+var DrawerGrabber = React65.forwardRef(
   (props, ref) => {
     var _a;
     const theme2 = useTheme();
@@ -9168,7 +9115,7 @@ var DrawerGrabber = React66.forwardRef(
 );
 DrawerGrabber.displayName = "Drawer.Grabber";
 var parseTokenValue24 = (value) => parseFloat(value);
-var DrawerClose = React66.forwardRef(
+var DrawerClose = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { "aria-label": ariaLabel = "Close" } = _b, props = __objRest(_b, ["aria-label"]);
     const theme2 = useTheme();
@@ -9281,8 +9228,8 @@ var StyledTitleContent = styled50(View)(
 function splitChildren(children) {
   let closeChild = null;
   const otherChildren = [];
-  React66.Children.forEach(children, (child) => {
-    if (React66.isValidElement(child) && child.type === DrawerClose) {
+  React65.Children.forEach(children, (child) => {
+    if (React65.isValidElement(child) && child.type === DrawerClose) {
       closeChild = child;
     } else {
       otherChildren.push(child);
@@ -9290,7 +9237,7 @@ function splitChildren(children) {
   });
   return { closeChild, otherChildren };
 }
-var DrawerHeader = React66.forwardRef(
+var DrawerHeader = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { variant = "titleAndText", imageSource, children } = _b, props = __objRest(_b, ["variant", "imageSource", "children"]);
     var _a2, _b2, _c, _d, _e, _f;
@@ -9377,7 +9324,7 @@ var DrawerHeader = React66.forwardRef(
   }
 );
 DrawerHeader.displayName = "Drawer.Header";
-var DrawerTitle = React66.forwardRef(
+var DrawerTitle = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
     const theme2 = useTheme();
@@ -9393,7 +9340,7 @@ var DrawerTitle = React66.forwardRef(
   }
 );
 DrawerTitle.displayName = "Drawer.Title";
-var DrawerDescription = React66.forwardRef(
+var DrawerDescription = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
     const theme2 = useTheme();
@@ -9415,56 +9362,31 @@ var StyledScrollView = styled50(ScrollView)(
     bodyPaddingHorizontal,
     bodyPaddingRight,
     bodyGap,
+    bodyMaxHeight,
     bodyPaddingBottom
   }) => ({
-    // flex: 1 fills the bounded panel so the ScrollView can scroll. The panel
-    // (DrawerContent) is the single height authority — the body must NOT set
-    // its own maxHeight, or it would cap independently of the panel and corrupt
-    // the panel's chrome measurement.
     flex: 1,
     paddingLeft: bodyPaddingHorizontal,
     paddingRight: bodyPaddingRight,
     gap: bodyGap,
+    maxHeight: bodyMaxHeight,
     paddingBottom: bodyPaddingBottom
   })
 );
-var DrawerBody = React66.forwardRef(
+var DrawerBody = React65.forwardRef(
   (_a, ref) => {
-    var _b = _a, {
-      children,
-      contentContainerStyle,
-      onLayout,
-      onContentSizeChange
-    } = _b, props = __objRest(_b, [
-      "children",
-      "contentContainerStyle",
-      "onLayout",
-      "onContentSizeChange"
-    ]);
+    var _b = _a, { children, contentContainerStyle } = _b, props = __objRest(_b, ["children", "contentContainerStyle"]);
     const theme2 = useTheme();
     const { spacing } = theme2.tokens.components.drawer;
     const { buttons } = theme2.tokens.components;
     const { content } = spacing;
     const headerContext = useDrawerHeaderContext();
     const footerContext = useDrawerFooterContext();
-    const measureContext = useDrawerMeasureContext();
+    const { height: windowHeight } = useWindowDimensions();
     const gap = parseTokenValue26(content.slot.gap);
     const horizontalPadding = parseTokenValue26(content.slot.horizontalPadding);
     const topPadding = parseTokenValue26(content.slot.verticalPadding);
-    const handleLayout = useCallback(
-      (event) => {
-        measureContext == null ? void 0 : measureContext.setBodyFrameHeight(event.nativeEvent.layout.height);
-        onLayout == null ? void 0 : onLayout(event);
-      },
-      [measureContext, onLayout]
-    );
-    const handleContentSizeChange = useCallback(
-      (width, height) => {
-        measureContext == null ? void 0 : measureContext.setBodyContentHeight(height);
-        onContentSizeChange == null ? void 0 : onContentSizeChange(width, height);
-      },
-      [measureContext, onContentSizeChange]
-    );
+    const bodyMaxHeight = windowHeight - 300;
     const paddingRight = headerContext === null ? parseTokenValue26(spacing.close.right.md) + parseTokenValue26(buttons.size.sm.height) : horizontalPadding;
     const bodyPaddingBottom = !footerContext ? parseTokenValue26(theme2.tokens.semantics.dimensions.spacing["2xl"]) : 0;
     return /* @__PURE__ */ jsx(
@@ -9474,9 +9396,8 @@ var DrawerBody = React66.forwardRef(
         bodyPaddingHorizontal: horizontalPadding,
         bodyPaddingRight: paddingRight,
         bodyGap: gap,
+        bodyMaxHeight,
         bodyPaddingBottom,
-        onLayout: handleLayout,
-        onContentSizeChange: handleContentSizeChange,
         contentContainerStyle: [
           {
             gap,
@@ -9499,7 +9420,7 @@ var StyledFooter = styled50(View)(({ footerPaddingTop, footerPaddingHorizontal,
   paddingHorizontal: footerPaddingHorizontal,
   paddingBottom: footerPaddingBottom
 }));
-var DrawerFooter = React66.forwardRef(
+var DrawerFooter = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
     const theme2 = useTheme();
@@ -9521,7 +9442,7 @@ var DrawerFooter = React66.forwardRef(
   }
 );
 DrawerFooter.displayName = "Drawer.Footer";
-var DrawerRoot = React66.forwardRef(
+var DrawerRoot = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       open: controlledOpen,
@@ -9562,15 +9483,15 @@ var DrawerRoot = React66.forwardRef(
   }
 );
 DrawerRoot.displayName = "Drawer";
-var DrawerTrigger = React66.forwardRef(
+var DrawerTrigger = React65.forwardRef(
   ({ children }, ref) => {
-    const { openDrawer } = React66.useContext(DrawerContext);
+    const { openDrawer } = React65.useContext(DrawerContext);
     return /* @__PURE__ */ jsx(Slot, { ref, onPress: openDrawer, children });
   }
 );
 DrawerTrigger.displayName = "Drawer.Trigger";
 var DrawerPortal = ({ children, topContent }) => {
-  const { modalVisible, closeDrawer } = React66.useContext(DrawerContext);
+  const { modalVisible, closeDrawer } = React65.useContext(DrawerContext);
   if (!modalVisible) return null;
   return /* @__PURE__ */ jsx(
     Modal,
@@ -9641,7 +9562,7 @@ var StyledButtonGroup = styled50(View)(({ groupDirection, groupAlign, groupJusti
   gap: groupGap,
   width: "100%"
 }, groupDirection === "column" ? { maxWidth: 520 } : {}));
-var ButtonDock = React66.forwardRef(
+var ButtonDock = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { variant = "stacked", leadingContent, description, children } = _b, rest = __objRest(_b, ["variant", "leadingContent", "description", "children"]);
     const theme2 = useTheme();
@@ -9721,7 +9642,7 @@ var StyledButtonRow = styled50(View)(({ rowDirection, rowAlign, rowGap }) => __s
 var StyledChildSlot = styled50(View)(
   ({ slotInline }) => __spreadValues({}, slotInline ? { flex: 1, minWidth: 0 } : { width: "100%", alignSelf: "stretch" })
 );
-var ButtonGroup = React66.forwardRef(
+var ButtonGroup = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { layout = "stacked", description, children } = _b, rest = __objRest(_b, ["layout", "description", "children"]);
     const theme2 = useTheme();
@@ -9743,9 +9664,9 @@ var ButtonGroup = React66.forwardRef(
               rowGap: parseTokenValue29(
                 isInline ? buttonGroup.spacing.sideBySide.gap : buttonGroup.spacing.stacked.gap
               ),
-              children: React66.Children.map(children, (child, index) => {
-                if (!React66.isValidElement(child)) return child;
-                return /* @__PURE__ */ jsx(StyledChildSlot, { slotInline: isInline, children: React66.cloneElement(
+              children: React65.Children.map(children, (child, index) => {
+                if (!React65.isValidElement(child)) return child;
+                return /* @__PURE__ */ jsx(StyledChildSlot, { slotInline: isInline, children: React65.cloneElement(
                   child,
                   {
                     fullWidth: true
@@ -9820,7 +9741,7 @@ var StyledIllustration = styled50(View)(({ illustrationSize }) => ({
   height: illustrationSize,
   overflow: "hidden"
 }));
-var Checkbox = React66.forwardRef(
+var Checkbox = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       variant = "standalone",
@@ -9847,7 +9768,7 @@ var Checkbox = React66.forwardRef(
     const { checkbox } = theme2.tokens.components;
     const { dimensions: dimensions3 } = theme2.tokens.semantics;
     const isControlled = controlledChecked !== void 0;
-    const [internalChecked, setInternalChecked] = React66.useState(defaultChecked);
+    const [internalChecked, setInternalChecked] = React65.useState(defaultChecked);
     const isChecked = isControlled ? controlledChecked : internalChecked;
     const handleCheckedChange = (checked) => {
       if (!isControlled) {
@@ -9942,7 +9863,7 @@ var StyledGroup = styled50(View)(({ groupDirection, groupGap }) => ({
   flexDirection: groupDirection,
   gap: groupGap
 }));
-var CheckboxGroup = React66.forwardRef(
+var CheckboxGroup = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { orientation = "vertical", children } = _b, rest = __objRest(_b, ["orientation", "children"]);
     const theme2 = useTheme();
@@ -9960,7 +9881,7 @@ var CheckboxGroup = React66.forwardRef(
   }
 );
 CheckboxGroup.displayName = "CheckboxGroup";
-var CopyFieldInput = React66.forwardRef(
+var CopyFieldInput = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       onCopy,
@@ -9979,19 +9900,19 @@ var CopyFieldInput = React66.forwardRef(
       "editable",
       "defaultValue"
     ]);
-    const [internalValue, setInternalValue] = React66.useState(
+    const [internalValue, setInternalValue] = React65.useState(
       typeof defaultValue === "string" ? defaultValue : ""
     );
-    const [copied, setCopied] = React66.useState(false);
-    const timeoutRef = React66.useRef(
+    const [copied, setCopied] = React65.useState(false);
+    const timeoutRef = React65.useRef(
       void 0
     );
-    React66.useEffect(() => {
+    React65.useEffect(() => {
       if (defaultValue !== void 0 && value === void 0) {
         setInternalValue(typeof defaultValue === "string" ? defaultValue : "");
       }
     }, [defaultValue, value]);
-    React66.useEffect(() => {
+    React65.useEffect(() => {
       return () => {
         if (timeoutRef.current) {
           clearTimeout(timeoutRef.current);
@@ -10058,7 +9979,7 @@ var StyledRoot8 = styled50(View)(({ theme: theme2 }) => {
     gap: parseTokenValue32(spacing.gap)
   };
 });
-var CopyFieldRoot = React66.forwardRef(
+var CopyFieldRoot = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       label,
@@ -10126,7 +10047,7 @@ var useCopyField = (options = {}) => {
     onCopy: handleCopy
   };
 };
-var FilterTabContext = React66.createContext({
+var FilterTabContext = React65.createContext({
   size: "sm",
   selectedValues: [],
   toggle: () => {
@@ -10165,7 +10086,7 @@ var StyledItem2 = styled50(Pressable)(
     flexShrink: 0
   })
 );
-var FilterTabItem = React66.forwardRef(
+var FilterTabItem = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       value,
@@ -10185,7 +10106,7 @@ var FilterTabItem = React66.forwardRef(
       "accessibilityLabel"
     ]);
     const theme2 = useTheme();
-    const { size, selectedValues, toggle } = React66.useContext(FilterTabContext);
+    const { size, selectedValues, toggle } = React65.useContext(FilterTabContext);
     const isSelected = selectedValues.includes(value);
     const isIconOnly = !!IconOnlyIcon && !label;
     const isActive = isSelected && !disabled;
@@ -10259,7 +10180,7 @@ var FilterTabItem = React66.forwardRef(
   }
 );
 FilterTabItem.displayName = "FilterTab.Item";
-var FilterTabRoot = React66.forwardRef(
+var FilterTabRoot = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       size = "sm",
@@ -10279,9 +10200,9 @@ var FilterTabRoot = React66.forwardRef(
     const theme2 = useTheme();
     const { filterTabs } = theme2.tokens.components;
     const isControlled = controlledValue !== void 0;
-    const [internalValue, setInternalValue] = React66.useState(defaultValue);
+    const [internalValue, setInternalValue] = React65.useState(defaultValue);
     const selectedValues = isControlled ? controlledValue : internalValue;
-    const toggle = React66.useCallback(
+    const toggle = React65.useCallback(
       (itemValue) => {
         let next;
         if (multiple) {
@@ -10294,7 +10215,7 @@ var FilterTabRoot = React66.forwardRef(
       },
       [selectedValues, isControlled, onValueChange, multiple]
     );
-    const contextValue = React66.useMemo(
+    const contextValue = React65.useMemo(
       () => ({ size, selectedValues, toggle }),
       [size, selectedValues, toggle]
     );
@@ -10364,7 +10285,7 @@ var StyledRow = styled50(View)(({ rowGap }) => ({
   alignItems: "center",
   gap: rowGap
 }));
-var NumberFieldInput = React66.forwardRef(
+var NumberFieldInput = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       fieldSize = "lg",
@@ -10411,9 +10332,9 @@ var NumberFieldInput = React66.forwardRef(
     const theme2 = useTheme();
     const tokens3 = theme2.tokens.components.numberField;
     const inputTokens3 = theme2.tokens.components.inputs;
-    const [isFocused, setIsFocused] = React66.useState(false);
-    const [isEdited, setIsEdited] = React66.useState(false);
-    const initialValueRef = React66.useRef((_a2 = value != null ? value : defaultValue) != null ? _a2 : "");
+    const [isFocused, setIsFocused] = React65.useState(false);
+    const [isEdited, setIsEdited] = React65.useState(false);
+    const initialValueRef = React65.useRef((_a2 = value != null ? value : defaultValue) != null ? _a2 : "");
     const isLarge = fieldSize === "lg";
     const sizeTokens = isLarge ? tokens3.spacing.large : tokens3.spacing.small;
     const buttonSize = isLarge ? "lg" : "sm";
@@ -10430,14 +10351,14 @@ var NumberFieldInput = React66.forwardRef(
       if (isEdited) return tokens3.colour.field.border.edited;
       return tokens3.colour.field.border.default;
     };
-    const handleFocus = React66.useCallback(
+    const handleFocus = React65.useCallback(
       (e) => {
         setIsFocused(true);
         onFocus == null ? void 0 : onFocus(e);
       },
       [onFocus]
     );
-    const handleBlur = React66.useCallback(
+    const handleBlur = React65.useCallback(
       (e) => {
         setIsFocused(false);
         if (value != null && onChangeText) {
@@ -10456,7 +10377,7 @@ var NumberFieldInput = React66.forwardRef(
     const numericValue = value != null ? Number(value) : Number(defaultValue != null ? defaultValue : 0);
     const isAtMin = min != null && numericValue <= min;
     const isAtMax = max != null && numericValue >= max;
-    const handleChangeText = React66.useCallback(
+    const handleChangeText = React65.useCallback(
       (text) => {
         setIsEdited(text !== initialValueRef.current);
         onChangeText == null ? void 0 : onChangeText(text);
@@ -10555,7 +10476,7 @@ var StyledRoot10 = styled50(View)(({ rootGap, fullWidth }) => __spreadValues({
 var StyledLabelGroup = styled50(View)(({ labelGap }) => ({
   gap: labelGap
 }));
-var NumberField = React66.forwardRef(
+var NumberField = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       label,
@@ -10670,9 +10591,9 @@ var NumberField = React66.forwardRef(
 );
 NumberField.displayName = "NumberField";
 var HIT_SLOP = 12;
-var PasswordFieldInput = React66.forwardRef((_a, ref) => {
+var PasswordFieldInput = React65.forwardRef((_a, ref) => {
   var _b = _a, { onValueChange, value, state, editable } = _b, inputFieldProps = __objRest(_b, ["onValueChange", "value", "state", "editable"]);
-  const [showPassword, setShowPassword] = React66.useState(false);
+  const [showPassword, setShowPassword] = React65.useState(false);
   const handleValueChange = (newValue) => {
     onValueChange == null ? void 0 : onValueChange(newValue);
   };
@@ -10717,7 +10638,7 @@ var StyledErrorRow2 = styled50(View)(({ gap }) => ({
   alignItems: "center",
   gap
 }));
-var PasswordFieldError = React66.forwardRef((_a, ref) => {
+var PasswordFieldError = React65.forwardRef((_a, ref) => {
   var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
   const theme2 = useTheme();
   const { listItem } = theme2.tokens.components.validationList;
@@ -10756,7 +10677,7 @@ var StyledRequirementItem = styled50(View)(
     gap: itemGap
   })
 );
-var PasswordFieldRequirements = React66.forwardRef((_a, ref) => {
+var PasswordFieldRequirements = React65.forwardRef((_a, ref) => {
   var _b = _a, { requirements } = _b, rest = __objRest(_b, ["requirements"]);
   const theme2 = useTheme();
   const { listItem, list } = theme2.tokens.components.validationList;
@@ -10812,7 +10733,7 @@ var StyledRoot11 = styled50(View)(({ theme: theme2 }) => {
     gap: parseTokenValue38(spacing.gap)
   };
 });
-var PasswordFieldRoot = React66.forwardRef(
+var PasswordFieldRoot = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       label,
@@ -10947,7 +10868,7 @@ var StyledIndicator = styled50(View)(({ indicatorBorderRadius, indicatorBgColor
   backgroundColor: indicatorBgColor
 }));
 var clamp = (value, min, max) => Math.max(min, Math.min(max, value));
-var Progress = React66.forwardRef(
+var Progress = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       value = 0,
@@ -11090,7 +11011,7 @@ var StyledTagWrapper = styled50(View)(
     paddingTop: tagTopPadding
   })
 );
-var Radio = React66.forwardRef(
+var Radio = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       variant = "standalone",
@@ -11194,7 +11115,7 @@ var Radio = React66.forwardRef(
   }
 );
 Radio.displayName = "Radio";
-var RadioTile = React66.forwardRef(
+var RadioTile = React65.forwardRef(
   (props, ref) => /* @__PURE__ */ jsx(Radio, __spreadProps(__spreadValues({ ref }, props), { variant: "tile" }))
 );
 RadioTile.displayName = "RadioTile";
@@ -11203,7 +11124,7 @@ var StyledRadioGroup = styled50(View)(({ groupDirection, groupGap }) => ({
   flexDirection: groupDirection,
   gap: groupGap
 }));
-var RadioGroupRoot = React66.forwardRef(
+var RadioGroupRoot = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       name: _name,
@@ -11230,11 +11151,11 @@ var RadioGroupRoot = React66.forwardRef(
     const optionsFirstValue = (_a2 = options == null ? void 0 : options[0]) == null ? void 0 : _a2.value;
     const derivedDefaultValue = defaultValue != null ? defaultValue : optionsFirstValue;
     const isControlled = value !== void 0;
-    const [internalValue, setInternalValue] = React66.useState(
+    const [internalValue, setInternalValue] = React65.useState(
       derivedDefaultValue != null ? derivedDefaultValue : ""
     );
     const currentValue = isControlled ? value : internalValue;
-    const handleSelect = React66.useCallback(
+    const handleSelect = React65.useCallback(
       (newValue) => {
         if (!isControlled) {
           setInternalValue(newValue);
@@ -11255,9 +11176,9 @@ var RadioGroupRoot = React66.forwardRef(
           option.value
         ));
       }
-      return React66.Children.map(children, (child) => {
-        if (!React66.isValidElement(child)) return child;
-        return React66.cloneElement(child, {
+      return React65.Children.map(children, (child) => {
+        if (!React65.isValidElement(child)) return child;
+        return React65.cloneElement(child, {
           selected: currentValue === child.props.value,
           onSelect: handleSelect,
           disabled: disabled || child.props.disabled
@@ -11282,11 +11203,11 @@ var RadioGroup = Object.assign(RadioGroupRoot, {
   Radio,
   Tile: RadioTile
 });
-var SearchFieldInput = React66.forwardRef((_a, ref) => {
+var SearchFieldInput = React65.forwardRef((_a, ref) => {
   var _b = _a, { onClear, onValueChange, value, state } = _b, inputFieldProps = __objRest(_b, ["onClear", "onValueChange", "value", "state"]);
-  const [internalValue, setInternalValue] = React66.useState("");
-  const inputRef = React66.useRef(null);
-  React66.useImperativeHandle(ref, () => inputRef.current);
+  const [internalValue, setInternalValue] = React65.useState("");
+  const inputRef = React65.useRef(null);
+  React65.useImperativeHandle(ref, () => inputRef.current);
   const handleValueChange = (newValue) => {
     setInternalValue(newValue);
     onValueChange == null ? void 0 : onValueChange(newValue);
@@ -11332,7 +11253,7 @@ var StyledRoot13 = styled50(View)(({ theme: theme2 }) => {
     gap: parseTokenValue42(spacing.gap)
   };
 });
-var SearchFieldRoot = React66.forwardRef(
+var SearchFieldRoot = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       label,
@@ -11462,7 +11383,7 @@ var ScrollIndicatorGradient = ({
   side,
   color
 }) => {
-  const uid = React66.useId();
+  const uid = React65.useId();
   const gradientId = `sc-scroll-indicator-${side}-${uid}`;
   const isTrailing = side === "trailing";
   return /* @__PURE__ */ jsx(View, { style: StyleSheet.absoluteFill, pointerEvents: "none", children: /* @__PURE__ */ jsxs(Svg, { width: "100%", height: "100%", preserveAspectRatio: "none", children: [
@@ -11545,7 +11466,7 @@ var SegmentedControlItemBase = ({
     }
   );
 };
-var SegmentedControlItem = React66.forwardRef(
+var SegmentedControlItem = React65.forwardRef(
   (_props, _ref) => {
     return null;
   }
@@ -11561,10 +11482,10 @@ var IntrinsicTrack = (_a) => {
     "renderItems",
     "forwardedRef"
   ]);
-  const scrollRef = React66.useRef(null);
-  const [containerWidth, setContainerWidth] = React66.useState(0);
-  const [contentWidth, setContentWidth] = React66.useState(0);
-  const [scrollX, setScrollX] = React66.useState(0);
+  const scrollRef = React65.useRef(null);
+  const [containerWidth, setContainerWidth] = React65.useState(0);
+  const [contentWidth, setContentWidth] = React65.useState(0);
+  const [scrollX, setScrollX] = React65.useState(0);
   const epsilon = 2;
   const maxScroll = Math.max(0, contentWidth - containerWidth);
   const canScrollLeft = scrollX > epsilon;
@@ -11660,7 +11581,7 @@ var IntrinsicTrack = (_a) => {
     })
   );
 };
-var SegmentedControlRoot = React66.forwardRef(
+var SegmentedControlRoot = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       options,
@@ -11684,18 +11605,18 @@ var SegmentedControlRoot = React66.forwardRef(
     const { spacing, borderRadius, colour } = theme2.tokens.components.segmentedControl;
     const { dimensions: dimensions3 } = theme2.tokens.semantics;
     const optionsFirstValue = (_a2 = options == null ? void 0 : options[0]) == null ? void 0 : _a2.value;
-    const childrenArray = React66.Children.toArray(children);
+    const childrenArray = React65.Children.toArray(children);
     const firstChildValue = childrenArray.map((child) => {
-      if (!React66.isValidElement(child)) return void 0;
+      if (!React65.isValidElement(child)) return void 0;
       return child.props.value;
     }).find((v) => typeof v === "string");
     const derivedDefaultValue = (_b2 = defaultValue != null ? defaultValue : optionsFirstValue) != null ? _b2 : firstChildValue;
     const isControlled = typeof value === "string";
-    const [uncontrolledValue, setUncontrolledValue] = React66.useState(
+    const [uncontrolledValue, setUncontrolledValue] = React65.useState(
       () => derivedDefaultValue != null ? derivedDefaultValue : ""
     );
     const currentValue = isControlled ? value : uncontrolledValue;
-    const handleSelect = React66.useCallback(
+    const handleSelect = React65.useCallback(
       (newValue) => {
         if (!isControlled) {
           setUncontrolledValue(newValue);
@@ -11721,7 +11642,7 @@ var SegmentedControlRoot = React66.forwardRef(
         ));
       }
       return childrenArray.map((child) => {
-        if (!React66.isValidElement(child)) return child;
+        if (!React65.isValidElement(child)) return child;
         const childProps = child.props;
         return /* @__PURE__ */ jsx(
           SegmentedControlItemBase,
@@ -11792,7 +11713,7 @@ var StyledArrowIcon = styled50(Animated.View)({
   alignItems: "center",
   justifyContent: "center"
 });
-var SelectFieldTrigger = React66.forwardRef(
+var SelectFieldTrigger = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       state = "default",
@@ -11891,7 +11812,7 @@ var SelectFieldTrigger = React66.forwardRef(
   }
 );
 SelectFieldTrigger.displayName = "SelectField.Trigger";
-var SelectFieldValue = React66.forwardRef(
+var SelectFieldValue = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { placeholder } = _b, rest = __objRest(_b, ["placeholder"]);
     const theme2 = useTheme();
@@ -11935,7 +11856,7 @@ var StyledContentInner = styled50(View)(({ theme: theme2 }) => {
     overflow: "hidden"
   };
 });
-var SelectFieldContent = React66.forwardRef((_a, ref) => {
+var SelectFieldContent = React65.forwardRef((_a, ref) => {
   var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
   const theme2 = useTheme();
   const { spacing } = theme2.tokens.components.inputs;
@@ -12010,7 +11931,7 @@ var StyledHintText = styled50(Text)(({ theme: theme2 }) => {
     flexShrink: 0
   };
 });
-var SelectFieldItem = React66.forwardRef(
+var SelectFieldItem = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { value, leadingIcon, hintText, children, disabled, isSelected } = _b, rest = __objRest(_b, ["value", "leadingIcon", "hintText", "children", "disabled", "isSelected"]);
     const theme2 = useTheme();
@@ -12062,7 +11983,7 @@ var StyledRoot14 = styled50(View)(({ theme: theme2 }) => {
     gap: parseTokenValue47(spacing.gap)
   };
 });
-var SelectFieldRoot = React66.forwardRef(
+var SelectFieldRoot = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       label,
@@ -12097,15 +12018,15 @@ var SelectFieldRoot = React66.forwardRef(
       "searchPlaceholder",
       "noResultsText"
     ]);
-    const [isOpen, setIsOpen] = React66.useState(false);
-    const [showContent, setShowContent] = React66.useState(false);
-    const [internalValue, setInternalValue] = React66.useState(
+    const [isOpen, setIsOpen] = React65.useState(false);
+    const [showContent, setShowContent] = React65.useState(false);
+    const [internalValue, setInternalValue] = React65.useState(
       defaultValue != null ? defaultValue : null
     );
-    const [searchQuery, setSearchQuery] = React66.useState("");
-    const [clearKey, setClearKey] = React66.useState(0);
-    const searchInputRef = React66.useRef(null);
-    React66.useEffect(() => {
+    const [searchQuery, setSearchQuery] = React65.useState("");
+    const [clearKey, setClearKey] = React65.useState(0);
+    const searchInputRef = React65.useRef(null);
+    React65.useEffect(() => {
       if (!isOpen) {
         setShowContent(false);
         return;
@@ -12138,8 +12059,8 @@ var SelectFieldRoot = React66.forwardRef(
         keyboardSub.remove();
       };
     }, [isOpen, searchable]);
-    const isCompound = React66.Children.toArray(children).some(
-      (child) => React66.isValidElement(child) && child.type === SelectFieldContent
+    const isCompound = React65.Children.toArray(children).some(
+      (child) => React65.isValidElement(child) && child.type === SelectFieldContent
     );
     if (isCompound) {
       return /* @__PURE__ */ jsx(StyledRoot14, __spreadProps(__spreadValues({ ref }, rest), { children }));
@@ -12154,11 +12075,11 @@ var SelectFieldRoot = React66.forwardRef(
       if (!open) setSearchQuery("");
     };
     const currentValue = value !== void 0 ? value : internalValue;
-    const allItems = React66.Children.toArray(children);
+    const allItems = React65.Children.toArray(children);
     const filteredItems = searchable ? allItems.filter((child) => {
       var _a2;
       if (!searchQuery) return true;
-      if (React66.isValidElement(child) && child.type === SelectFieldItem) {
+      if (React65.isValidElement(child) && child.type === SelectFieldItem) {
         const label2 = String(
           (_a2 = child.props.children) != null ? _a2 : ""
         );
@@ -12227,10 +12148,10 @@ var SelectFieldRoot = React66.forwardRef(
           ] })),
           showContent && /* @__PURE__ */ jsxs(SelectFieldContent, { children: [
             filteredItems.map((child) => {
-              if (React66.isValidElement(child) && child.type === SelectFieldItem) {
+              if (React65.isValidElement(child) && child.type === SelectFieldItem) {
                 const selectedValue = currentValue && typeof currentValue === "object" && "value" in currentValue ? currentValue.value : currentValue;
                 const childProps = child.props;
-                return React66.cloneElement(
+                return React65.cloneElement(
                   child,
                   {
                     isSelected: childProps.value === selectedValue
@@ -12397,7 +12318,7 @@ var useIconAnimation = () => {
     iconAnimationStyles
   };
 };
-var NativeSelectPicker = React66.forwardRef(
+var NativeSelectPicker = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       items,
@@ -12556,7 +12477,7 @@ var StyledLabelSlot = styled50(View)(({ labelSlotGap }) => ({
   gap: labelSlotGap,
   flexShrink: 0
 }));
-var Slider = React66.forwardRef(
+var Slider = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       value: controlledValue,
@@ -12591,7 +12512,7 @@ var Slider = React66.forwardRef(
     const { slider, buttons } = theme2.tokens.components;
     const { dimensions: dimensions3 } = theme2.tokens.semantics;
     const isControlled = controlledValue !== void 0;
-    const [internalValue, setInternalValue] = React66.useState(defaultValue);
+    const [internalValue, setInternalValue] = React65.useState(defaultValue);
     const currentValue = isControlled ? controlledValue : internalValue;
     const thumbSize = parseTokenValue48(buttons.size.md.height);
     const trackHeight = parseTokenValue48(slider.sizing.track.height);
@@ -12974,7 +12895,7 @@ var StyledCloseButton = styled50(Pressable)({
   flexShrink: 0,
   padding: 0
 });
-var Notification = React66.forwardRef(
+var Notification = React65.forwardRef(
   (props, ref) => {
     const _a = props, {
       variant = "inline",
@@ -13318,7 +13239,7 @@ function NibTriangle({
     }
   );
 }
-var Tooltip = React66.forwardRef(
+var Tooltip = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { text, alignment = "middle", position = "bottom", children } = _b, props = __objRest(_b, ["text", "alignment", "position", "children"]);
     const theme2 = useTheme();
@@ -13406,8 +13327,8 @@ var Tooltip = React66.forwardRef(
       return bubble;
     }
     if (Platform.OS === "web") {
-      const child = React66.isValidElement(children) ? children : null;
-      const trigger = child ? React66.cloneElement(child, {
+      const child = React65.isValidElement(children) ? children : null;
+      const trigger = child ? React65.cloneElement(child, {
         onPress: () => {
           var _a2, _b2;
           (_b2 = (_a2 = child.props).onPress) == null ? void 0 : _b2.call(_a2);
@@ -13484,7 +13405,7 @@ var StyledInsightContent = styled50(View)(
     gap: contentGap
   })
 );
-var MessageCardInsight = React66.forwardRef(
+var MessageCardInsight = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { variant = "standalone", icon, illustration, title, children } = _b, rest = __objRest(_b, ["variant", "icon", "illustration", "title", "children"]);
     const theme2 = useTheme();
@@ -13595,7 +13516,7 @@ var StyledBannerCopy = styled50(View)(({ copyGap }) => ({
   gap: copyGap,
   width: "100%"
 }));
-var MessageCardBanner = React66.forwardRef(
+var MessageCardBanner = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       colourScheme = "primary",
@@ -13629,7 +13550,7 @@ var MessageCardBanner = React66.forwardRef(
         accessibilityRole: "summary"
       }, rest), {
         children: [
-          (media == null ? void 0 : media.type) === "illustration" ? /* @__PURE__ */ jsx(StyledBannerIllustrationSlot, { children: React66.createElement(media.illustration, {
+          (media == null ? void 0 : media.type) === "illustration" ? /* @__PURE__ */ jsx(StyledBannerIllustrationSlot, { children: React65.createElement(media.illustration, {
             width: 108,
             height: 108
           }) }) : (media == null ? void 0 : media.type) === "image" ? /* @__PURE__ */ jsx(
@@ -13789,7 +13710,7 @@ var StyledIndicator3 = styled50(View)(
     justifyContent: "center"
   })
 );
-var DatePicker = React66.forwardRef(
+var DatePicker = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       year,
@@ -14189,7 +14110,7 @@ var StyledPointer = styled50(Svg)(
     opacity: pointerVisible ? 1 : 0
   })
 );
-var PictureSelector = React66.forwardRef(
+var PictureSelector = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       label,
@@ -14216,7 +14137,7 @@ var PictureSelector = React66.forwardRef(
     const { pictureSelector } = theme2.tokens.components;
     const { pictureButton } = pictureSelector;
     const isControlled = value !== void 0;
-    const [internalValue, setInternalValue] = React66.useState(defaultValue);
+    const [internalValue, setInternalValue] = React65.useState(defaultValue);
     const selectedValue = isControlled ? value : internalValue;
     const selectedItem = items.find((item) => item.value === selectedValue);
     const hasInsight = Boolean(
@@ -14400,7 +14321,7 @@ var InlineCount = styled50(View)(({ countGap }) => ({
   alignItems: "center",
   gap: countGap
 }));
-var Countdown = React66.forwardRef(
+var Countdown = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       layout = "stacked",
@@ -14479,7 +14400,7 @@ var Countdown = React66.forwardRef(
               InlineGroup,
               {
                 groupGap: parseTokenValue54(countdown.countdownGroup.spacing.gap),
-                children: units.map((unit, index) => /* @__PURE__ */ jsxs(React66.Fragment, { children: [
+                children: units.map((unit, index) => /* @__PURE__ */ jsxs(React65.Fragment, { children: [
                   index > 0 && colon(`colon-${unit.key}`),
                   /* @__PURE__ */ jsxs(
                     InlineCount,
@@ -14522,7 +14443,7 @@ var Countdown = React66.forwardRef(
         ref,
         rootGap: parseTokenValue54(countdown.spacing.gap)
       }, rest), {
-        children: units.map((unit, index) => /* @__PURE__ */ jsxs(React66.Fragment, { children: [
+        children: units.map((unit, index) => /* @__PURE__ */ jsxs(React65.Fragment, { children: [
           index > 0 && colon(`colon-${unit.key}`),
           /* @__PURE__ */ jsxs(
             StackedItem,
@@ -14610,7 +14531,7 @@ var BadgeIcon = styled50(View)(({ theme: theme2 }) => {
     flexShrink: 0
   };
 });
-var Badge2 = React66.forwardRef(
+var Badge2 = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { icon, text } = _b, rest = __objRest(_b, ["icon", "text"]);
     return /* @__PURE__ */ jsxs(BadgeContainer, __spreadProps(__spreadValues({ ref }, rest), { children: [
@@ -14628,7 +14549,7 @@ var StyledGrid = styled50(View)(({ theme: theme2 }) => {
     "grid-row-gap": spacing.xl
   };
 });
-var Grid = React66.forwardRef(
+var Grid = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { children, xs = 1, md = 2, lg = 3 } = _b, rest = __objRest(_b, ["children", "xs", "md", "lg"]);
     const { width } = useWindowDimensions();
@@ -14727,7 +14648,7 @@ var PricingContainer = styled50(View)(({ theme: theme2 }) => {
     width: "100%"
   };
 });
-var _ProductListingCard = React66.forwardRef(
+var _ProductListingCard = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       image,
@@ -14769,7 +14690,7 @@ var _ProductListingCard = React66.forwardRef(
             accessibilityLabel: imageAlt,
             accessible: true
           }
-        ) : React66.isValidElement(image) ? image : /* @__PURE__ */ jsx(
+        ) : React65.isValidElement(image) ? image : /* @__PURE__ */ jsx(
           StyledImage2,
           {
             source: image,
@@ -14915,7 +14836,7 @@ var StyledNoneBanner = styled50(View)(({ theme: theme2 }) => {
     borderBottomRightRadius: radiusMd
   };
 });
-var ProductDisplayCard = React66.forwardRef(
+var ProductDisplayCard = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       title,
@@ -15045,9 +14966,9 @@ var ProductDisplayCard = React66.forwardRef(
   }
 );
 ProductDisplayCard.displayName = "ProductDisplayCard";
-var TabNavigationContext = React66.createContext(void 0);
+var TabNavigationContext = React65.createContext(void 0);
 var useTabNavigationContext = () => {
-  const context = React66.useContext(TabNavigationContext);
+  const context = React65.useContext(TabNavigationContext);
   if (!context) {
     throw new Error(
       "TabNavigation.List, TabNavigation.Tab and TabNavigation.Panel must be used within a TabNavigation component."
@@ -15086,7 +15007,7 @@ var StyledTab = styled50(Pressable)(
     borderBottomColor: tabBorderColor
   }, tabFlex !== void 0 ? { flex: tabFlex } : { flexShrink: 0 })
 );
-var TabNavigationList = React66.forwardRef(
+var TabNavigationList = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
     const { layout } = useTabNavigationContext();
@@ -15105,7 +15026,7 @@ var TabNavigationList = React66.forwardRef(
   }
 );
 TabNavigationList.displayName = "TabNavigation.List";
-var TabNavigationTab = React66.forwardRef(
+var TabNavigationTab = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { value, disabled = false, icon, avatar, children } = _b, rest = __objRest(_b, ["value", "disabled", "icon", "avatar", "children"]);
     const { layout } = useTabNavigationContext();
@@ -15141,7 +15062,7 @@ var TabNavigationTab = React66.forwardRef(
   }
 );
 TabNavigationTab.displayName = "TabNavigation.Tab";
-var TabNavigationPanel = React66.forwardRef(
+var TabNavigationPanel = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, { value, children } = _b, rest = __objRest(_b, ["value", "children"]);
     const { animation } = useTabNavigationContext();
@@ -15149,7 +15070,7 @@ var TabNavigationPanel = React66.forwardRef(
   }
 );
 TabNavigationPanel.displayName = "TabNavigation.Panel";
-var TabNavigationRoot = React66.forwardRef(
+var TabNavigationRoot = React65.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       value,
@@ -15167,11 +15088,11 @@ var TabNavigationRoot = React66.forwardRef(
       "children"
     ]);
     const isControlled = typeof value === "string";
-    const [uncontrolledValue, setUncontrolledValue] = React66.useState(
+    const [uncontrolledValue, setUncontrolledValue] = React65.useState(
       () => defaultValue != null ? defaultValue : ""
     );
     const currentValue = isControlled ? value : uncontrolledValue;
-    const handleValueChange = React66.useCallback(
+    const handleValueChange = React65.useCallback(
       (newValue) => {
         if (!isControlled) {
           setUncontrolledValue(newValue);
@@ -15180,7 +15101,7 @@ var TabNavigationRoot = React66.forwardRef(
       },
       [isControlled, onValueChange]
     );
-    const contextValue = React66.useMemo(
+    const contextValue = React65.useMemo(
       () => ({ layout, animation }),
       [layout, animation]
     );