@oxy.so/bloom 4.8.0 → 4.10.0

package/src/ai-chat/context.ts

@@ -79,3 +79,42 @@ export const AiChatShellContext = createContext<AiChatShellState | null>(null);
 export function useAiChatShell(): AiChatShellState | null {
   return useContext(AiChatShellContext);
 }
+
+/**
+ * The heights an `AiChatContainer floatingChrome` measures for the chrome it
+ * floats over its `children`: the header block at the top and the footer
+ * (`AgentThinking` + composer, with its fade strip) at the bottom, px.
+ */
+export interface AiChatChromeInsets {
+  top: number;
+  bottom: number;
+}
+
+/** Where the thread is, reported to the container so each edge knows when to fade. */
+export interface AiChatScrollMetrics {
+  offset: number;
+  viewport: number;
+  content: number;
+}
+
+/**
+ * What a floating-chrome container hands its `children`. Internal: the thread
+ * reads `insets` and reports its scroll; hosts read only the insets, through
+ * `useAiChatChromeInsets()`.
+ */
+export interface AiChatFloatingChrome {
+  insets: AiChatChromeInsets;
+  reportScroll: (metrics: AiChatScrollMetrics) => void;
+}
+
+export const AiChatFloatingChromeContext = createContext<AiChatFloatingChrome | null>(null);
+
+/**
+ * Inside `AiChatContainer floatingChrome`: how much of the top and bottom of the
+ * card the floating header and composer cover, so a custom child (an empty
+ * state, a scroller of its own) can keep its resting content clear of them.
+ * `null` anywhere else — outside a container, or in one that stacks its chrome.
+ */
+export function useAiChatChromeInsets(): AiChatChromeInsets | null {
+  return useContext(AiChatFloatingChromeContext)?.insets ?? null;
+}

package/src/ai-chat/index.ts

@@ -15,8 +15,8 @@ export {
   AiChatUserMessage,
 } from './AiChatMessages';
 export { AiChatMobileHeader, AiChatResizeHandle, AiChatShell } from './AiChatShell';
-export { useAiChatShell } from './context';
-export type { AiChatShellState } from './context';
+export { useAiChatChromeInsets, useAiChatShell } from './context';
+export type { AiChatChromeInsets, AiChatShellState } from './context';
 export type {
   AiChatAssistantMessageProps,
   AiChatBulletListProps,

package/src/ai-chat/index.web.ts

@@ -20,8 +20,8 @@ export {
   AiChatUserMessage,
 } from './AiChatMessages';
 export { AiChatMobileHeader, AiChatResizeHandle, AiChatShell } from './AiChatShell';
-export { useAiChatShell } from './context';
-export type { AiChatShellState } from './context';
+export { useAiChatChromeInsets, useAiChatShell } from './context';
+export type { AiChatChromeInsets, AiChatShellState } from './context';
 export type {
   AiChatAssistantMessageProps,
   AiChatBulletListProps,

package/src/ai-chat/types.ts

@@ -317,6 +317,23 @@ export interface AiChatContainerProps {
    * `false` leaves the root transparent.
    */
   surface?: boolean;
+  /**
+   * Float the header and the composer OVER the transcript instead of stacking
+   * them around it. Default `false`: header row, thread, footer, as siblings.
+   *
+   * With it, `children` fill the whole card and scroll BEHIND both: the header
+   * slot and breadcrumb row are pinned to the top with no band of their own,
+   * the footer (`AgentThinking` + `composer`) to the bottom. Each edge paints a
+   * fade of the card's surface only while the transcript actually runs under
+   * it, ramping in over the first px of overlap. An `AiChatThread` inside pads
+   * its content by the measured heights of both, so the first and last turns
+   * rest clear of them; a custom child reads the same numbers from
+   * `useAiChatChromeInsets()`.
+   *
+   * The fades are background-secondary; with `surface={false}` there is no
+   * known colour to fade to, so the chrome floats without them.
+   */
+  floatingChrome?: boolean;
   labels?: AiChatContainerLabels;
   style?: StyleProp<ViewStyle>;
   testID?: string;

package/src/composer-panel/ComposerPanelBase.tsx

@@ -145,6 +145,7 @@ export function ComposerPanelBase({
   onRemoveAttachment,
   status,
   emptyAction,
+  onKeyPress: onKeyPressProp,
   inputRef,
   labels: labelOverrides,
   style,
@@ -200,12 +201,15 @@ export function ComposerPanelBase({
 
   const onKeyPress = useCallback(
     (event: NativeSyntheticEvent<TextInputKeyPressEventData>) => {
+      // The host sees the key first and may take it (a suggestion list).
+      onKeyPressProp?.(event);
+      if (event.defaultPrevented) return;
       const native: TextInputKeyPressEventData & { shiftKey?: boolean; isComposing?: boolean } = event.nativeEvent;
       if (!IS_WEB || native.key !== 'Enter' || native.shiftKey || native.isComposing) return;
       event.preventDefault();
       submit();
     },
-    [submit],
+    [submit, onKeyPressProp],
   );
 
   const hasAttachments = !!attachments && attachments.length > 0;

package/src/composer-panel/types.ts

@@ -271,6 +271,14 @@ export interface ComposerPanelProps {
    */
   emptyAction?: ReactNode;
 
+  /**
+   * The field's key events, BEFORE the panel's own Enter rule, so a host can
+   * take a key from it — the pill's contract. Calling `preventDefault()` stops
+   * the panel acting on that key: a suggestion list over the composer drives
+   * the arrows, Enter and Escape this way.
+   */
+  onKeyPress?: (event: NativeSyntheticEvent<TextInputKeyPressEventData>) => void;
+
   /** The prompt field itself, for focus or a scripted demo. */
   inputRef?: RefObject<TextInput | null>;
   labels?: ComposerPanelLabels;