@oxy.so/bloom 7.1.1 → 7.1.2

package/src/agent-creator/__tests__/support/character-runtime-fixture.tsx

@@ -0,0 +1,26 @@
+import type { ContextType, ReactNode } from 'react';
+import {
+  CharacterCapabilitiesContext,
+  CharacterRuntimeContext,
+} from '../../../agent-avatar/context';
+
+/** Supply both internal channels without starting the browser engine in UI tests. */
+export function CharacterRuntimeFixture({
+  value,
+  children,
+}: {
+  value: ContextType<typeof CharacterRuntimeContext> &
+    ContextType<typeof CharacterCapabilitiesContext>;
+  children: ReactNode;
+}) {
+  const { runtimeUrl, reportCapabilities, ...catalog } = value;
+  return (
+    <CharacterRuntimeContext.Provider
+      value={{ runtimeUrl, reportCapabilities }}
+    >
+      <CharacterCapabilitiesContext.Provider value={catalog}>
+        {children}
+      </CharacterCapabilitiesContext.Provider>
+    </CharacterRuntimeContext.Provider>
+  );
+}

package/src/bottom-sheet/BottomSheetBase.tsx

@@ -133,14 +133,11 @@ export const BottomSheetBase = forwardRef((props: BottomSheetBaseProps, ref: Rea
     const bodyPanRef = useRef<GestureType | undefined>(undefined);
     const handlePanRef = useRef<GestureType | undefined>(undefined);
 
-    // Dismiss callbacks
+    // Completion is not a user request: once closed, every owner must hear it.
+    // Vetoes are checked before a user-triggered close starts, never after it.
     const safeClose = useCallback(() => {
-        if (onDismissAttempt?.()) {
-            onDismiss?.();
-        } else if (!onDismissAttempt) {
-            onDismiss?.();
-        }
-    }, [onDismissAttempt, onDismiss]);
+        onDismiss?.();
+    }, [onDismiss]);
 
     // Mirror `safeClose` and `rendered` into refs so the unmount cleanup can
     // fire the latest dismiss callback when needed, without re-binding the
@@ -251,6 +248,20 @@ export const BottomSheetBase = forwardRef((props: BottomSheetBaseProps, ref: Rea
         };
     }, [colors.border]);
 
+    // Gesture callbacks cross to JS before consulting the consumer's veto.
+    // A refused drag springs back; it never hides the Modal or strands its owner.
+    const requestPanDismiss = useCallback((generation: number, velocity: number) => {
+        if (closeGenerationRef.current !== generation || hasClosedRef.current) return;
+        if (onDismissAttempt && !onDismissAttempt()) {
+            translateY.value = withSpring(0, { ...SPRING_CONFIG, velocity });
+            return;
+        }
+        translateY.value = withSpring(screenHeightSV.value, { ...SPRING_CONFIG, velocity });
+        opacity.value = withTiming(0, { ...MOTION_RECIPES.dismiss, duration: 250 }, (finished) => {
+            if (finished) runOnJS(finishClose)(generation);
+        });
+    }, [onDismissAttempt, translateY, screenHeightSV, opacity, finishClose]);
+
     const present = useCallback(() => {
         setRendered(true);
         setVisible(true);
@@ -336,15 +347,7 @@ export const BottomSheetBase = forwardRef((props: BottomSheetBaseProps, ref: Rea
                         (distance > closeThreshold && velocity > -300);
 
                     if (shouldClose) {
-                        // Snapshot the generation on the UI thread at the
-                        // moment the close gesture commits. The completion
-                        // callback only fires `finishClose` if no reopen
-                        // bumped the generation in between.
-                        const generation = closeGeneration.value;
-                        translateY.value = withSpring(screenHeightSV.value, { ...SPRING_CONFIG, velocity });
-                        opacity.value = withTiming(0, { ...MOTION_RECIPES.dismiss, duration: 250 }, (finished) => {
-                            if (finished) runOnJS(finishClose)(generation);
-                        });
+                        runOnJS(requestPanDismiss)(closeGeneration.value, velocity);
                     } else {
                         translateY.value = withSpring(0, { ...SPRING_CONFIG, velocity });
                     }
@@ -396,16 +399,7 @@ export const BottomSheetBase = forwardRef((props: BottomSheetBaseProps, ref: Rea
                     (distance > closeThreshold && velocity > -300);
 
                 if (shouldClose) {
-                    const generation = closeGeneration.value;
-                    translateY.value = withSpring(screenHeightSV.value, {
-                        ...SPRING_CONFIG,
-                        velocity: velocity,
-                    });
-                    opacity.value = withTiming(0, { ...MOTION_RECIPES.dismiss, duration: 250 }, (finished) => {
-                        if (finished) {
-                            runOnJS(finishClose)(generation);
-                        }
-                    });
+                    runOnJS(requestPanDismiss)(closeGeneration.value, velocity);
                 } else {
                     translateY.value = withSpring(0, {
                         ...SPRING_CONFIG,
@@ -417,7 +411,7 @@ export const BottomSheetBase = forwardRef((props: BottomSheetBaseProps, ref: Rea
         // values that change the gesture's behavior. `finishClose` is stable
         // (useCallback with stable deps).
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [enablePanDownToClose, detached, manualActivation, nativeGesture, finishClose]);
+    }, [enablePanDownToClose, detached, manualActivation, nativeGesture, requestPanDismiss]);
 
     // Dedicated handle pan — only built in `manualActivation` mode. Always
     // active so users can drag the handle even while content is mid-scroll.
@@ -456,17 +450,13 @@ export const BottomSheetBase = forwardRef((props: BottomSheetBaseProps, ref: Rea
                     (distance > closeThreshold && velocity > -300);
 
                 if (shouldClose) {
-                    const generation = closeGeneration.value;
-                    translateY.value = withSpring(screenHeightSV.value, { ...SPRING_CONFIG, velocity });
-                    opacity.value = withTiming(0, { ...MOTION_RECIPES.dismiss, duration: 250 }, (finished) => {
-                        if (finished) runOnJS(finishClose)(generation);
-                    });
+                    runOnJS(requestPanDismiss)(closeGeneration.value, velocity);
                 } else {
                     translateY.value = withSpring(0, { ...SPRING_CONFIG, velocity });
                 }
             });
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [manualActivation, enablePanDownToClose, enableHandlePanningGesture, detached, finishClose]);
+    }, [manualActivation, enablePanDownToClose, enableHandlePanningGesture, detached, requestPanDismiss]);
 
     // CRITICAL — the shared values each `useAnimatedStyle` READS (translateY,
     // opacity, screenHeightSV, keyboardHeight) MUST be listed in its dependency
@@ -698,7 +688,7 @@ export const BottomSheetBase = forwardRef((props: BottomSheetBaseProps, ref: Rea
         : <View style={[styles.nonScrollableContent, surfaceCorners, { overflow: 'hidden' }]}>{surfaceChildren}</View>;
 
     return (
-        <Shell visible={rendered} onRequestClose={dismiss} keyboardHeight={keyboardHeight}>
+        <Shell visible={rendered} onRequestClose={handleBackdropPress} keyboardHeight={keyboardHeight}>
             {/* Web keyboard and focus: in on open, back on close, Tab kept in
                 the sheet, Escape a USER dismissal — through `onDismissAttempt`,
                 exactly like the backdrop. The sheet had no keyboard path at

package/src/bottom-sheet/types.ts

@@ -38,6 +38,7 @@ export interface BottomSheetProps {
      */
     style?: StyleProp<AnimatedStyle<ViewStyle>>;
     enableHandlePanningGesture?: boolean;
+    /** Veto user Back/backdrop/Escape/pan requests before closing; imperative dismiss bypasses it. */
     onDismissAttempt?: () => boolean;
     detached?: boolean; // If true, shows with margins and rounded corners. If false, full width with rounded top only.
     /**

package/src/dialog/DialogBottomSheet.tsx

@@ -197,7 +197,7 @@ export function DialogBottomSheet({
     const maxHeightPercent: `${number}%` = `${Math.round(maxHeightRatio * 100)}%`;
     return [
       {
-        backgroundColor: 'transparent',
+        backgroundColor: theme.colors.background,
         ...surfaceStyle(SURFACE_SHAPES.sheet),
         maxHeight: maxHeightPercent,
       },

package/src/surface/SurfacePaint.tsx

@@ -1,7 +1,7 @@
 import { surfaceStyle } from '../shapes/surface-style';
 import type { SurfaceShape } from '../shapes/corner-types';
-import React, { memo, useEffect } from 'react';
-import { Platform, StyleSheet, View, type ViewStyle } from 'react-native';
+import React, { memo, useCallback, useEffect, useState } from 'react';
+import { Platform, StyleSheet, View, type LayoutChangeEvent, type ViewStyle } from 'react-native';
 import Svg, { Defs, LinearGradient, Rect, Stop } from 'react-native-svg';
 import { useSvgIdPrefix } from '../styles/svg-id';
 import { StyledView } from '../styles/styled-primitives';
@@ -47,6 +47,13 @@ export const SurfacePaint = memo(function SurfacePaint({
   const resolvedFill = resolveSurfaceTint(fill ?? 'transparent');
   const id = useSvgIdPrefix('bloom-surface');
   const isWeb = Platform.OS === 'web';
+  const [nativeSize, setNativeSize] = useState<{ width: number; height: number } | null>(null);
+  const onNativeLayout = useCallback((event: LayoutChangeEvent) => {
+    const { width, height } = event.nativeEvent.layout;
+    if (!Number.isFinite(width) || !Number.isFinite(height) || width <= 0 || height <= 0) return;
+    setNativeSize(previous => previous?.width === width && previous.height === height
+      ? previous : { width, height });
+  }, []);
   useSurfaceRefraction(isWeb);
   useEffect(() => {
     if (isWeb) adoptStyleSheet('bloom-surface-paint-web-css', WEB_PAINT_CSS);
@@ -67,17 +74,20 @@ export const SurfacePaint = memo(function SurfacePaint({
   return (
     <View
       testID={testID}
+      onLayout={onNativeLayout}
       pointerEvents="none"
       style={[StyleSheet.absoluteFill, geometry, { overflow: 'hidden' }]}
     >
+      {/* Android SVG percentage paths cache canvas dimensions after first paint.
+          Update the actual Rect geometry when this backing View changes size. */}
       <Svg width="100%" height="100%" style={StyleSheet.absoluteFill}>
         <Defs>
           {sheen ? <LinearGradient id={`${id}-sheen`} x1="0" y1="0" x2="0" y2="1">
             {optics.sheen.map(stop => <Stop key={stop.offset} offset={String(stop.offset)} stopColor={stop.color} stopOpacity={stop.opacity} />)}
           </LinearGradient> : null}
         </Defs>
-        {fill !== undefined ? <Rect x="0" y="0" width="100%" height="100%" fill={base.color} fillOpacity={base.opacity} /> : null}
-        {sheen ? <Rect x="0" y="0" width="100%" height="100%" fill={`url(#${id}-sheen)`} /> : null}
+        {fill !== undefined ? <Rect x="0" y="0" width={nativeSize?.width ?? '100%'} height={nativeSize?.height ?? '100%'} fill={base.color} fillOpacity={base.opacity} /> : null}
+        {sheen ? <Rect x="0" y="0" width={nativeSize?.width ?? '100%'} height={nativeSize?.height ?? '100%'} fill={`url(#${id}-sheen)`} /> : null}
       </Svg>
       <View pointerEvents="none" style={[StyleSheet.absoluteFill, geometry, { boxShadow: optics.rim }]} />
     </View>