@oxyhq/bloom 0.46.0 → 0.48.0

package/src/surfaces/SurfaceHost.tsx

@@ -38,6 +38,8 @@ function placementFor(p: SurfacePresentation): Partial<DialogProps> {
     showHandle: p.showHandle,
     dismissOnBackdrop: p.dismissOnBackdrop,
     contentPadding: p.contentPadding,
+    header: p.header,
+    scrollable: p.scrollable,
     style: p.style,
     panelStyle: p.panelStyle,
     panelClassName: p.panelClassName,
@@ -112,7 +114,20 @@ export function createSurfaceHost(Dialog: DialogComponent) {
     );
 
     return (
-      <Dialog control={control} onClose={handleClose} layer={index} {...placement}>
+      // `startOpen` is the surface's open-INTENT (true while not closing). It
+      // ONLY seeds a freshly-mounted Dialog branch's visible state — the
+      // imperative `control` still owns open/close — so when a responsive Dialog
+      // swaps its inner component on resize (centered card ↔ bottom sheet) the
+      // new branch mounts STILL OPEN instead of dismissing the surface. A real
+      // dismiss (backdrop/Escape/back/programmatic) still resolves + splices
+      // exactly once via `control.close()` → `handleClose`, post-exit.
+      <Dialog
+        control={control}
+        onClose={handleClose}
+        layer={index}
+        startOpen={status !== 'closing'}
+        {...placement}
+      >
         <SurfaceContext.Provider value={controls}>
           {entry.render(controls)}
         </SurfaceContext.Provider>

package/src/surfaces/types.ts

@@ -1,7 +1,7 @@
 import type { ReactNode } from 'react';
 import type { StyleProp, ViewStyle } from 'react-native';
 
-import type { DialogInset, ResponsiveDialogPlacement } from '../dialog/types';
+import type { DialogHeaderConfig, DialogInset, ResponsiveDialogPlacement } from '../dialog/types';
 
 /**
  * How a surface renders — the placement + the `Dialog` sizing/chrome options a
@@ -39,6 +39,22 @@ export interface SurfacePresentation {
   dismissOnBackdrop?: boolean;
   /** Inner padding (px) of the surface content container. Forwarded to `Dialog`. */
   contentPadding?: number;
+  /**
+   * Turns on the Dialog's OWN navigation header for this surface (sticky gradient
+   * nav bar + large collapsing title over the surface's scroll content). Seeds
+   * the header content; a mounted screen refines it at runtime via
+   * `useDialogHeader`. Omit for a plain surface (a confirm/alert dialog). Forwarded
+   * to `Dialog`.
+   */
+  header?: DialogHeaderConfig;
+  /**
+   * Whether the surface wraps its content in an internal scroll container.
+   * Defaults to `true`. Set `false` when the surface's content owns its own
+   * scrolling primitive (a `FlatList` / `SectionList` / VirtualizedList, or its
+   * own `ScrollView`) so the host does not nest it in a ScrollView. Forwarded
+   * to `Dialog`.
+   */
+  scrollable?: boolean;
   /** Style overrides applied to the inner content container. */
   style?: StyleProp<ViewStyle>;
   /** Style overrides for the side/bottom placement panel surface. */

package/src/text-field/index.tsx

@@ -30,6 +30,8 @@ import { Text } from '../typography';
 const Context = createContext<{
   inputRef: React.RefObject<TextInput | null> | null;
   isInvalid: boolean;
+  /** Corner radius of the input chrome. A large value (e.g. 999) reads as a pill. */
+  radius: number;
   hovered: boolean;
   onHoverIn: () => void;
   onHoverOut: () => void;
@@ -39,6 +41,7 @@ const Context = createContext<{
 }>({
   inputRef: null,
   isInvalid: false,
+  radius: 10,
   hovered: false,
   onHoverIn: () => {},
   onHoverOut: () => {},
@@ -48,11 +51,24 @@ const Context = createContext<{
 });
 Context.displayName = 'TextFieldContext';
 
+/**
+ * RN Web paints the browser's default focus outline on the underlying `<input>`.
+ * That rectangle follows the input's own box — NOT the TextField chrome — so on a
+ * pill (large radius) it pokes out of the corners and reads as a stray border on
+ * focus. Strip it so ONLY the TextField's own focus chrome (the animated border)
+ * signals focus. `outlineStyle`/`outlineWidth` are RN-Web style properties absent
+ * from RN's core types; `web()` guarantees this object is never applied on native.
+ */
+const WEB_INPUT_OUTLINE_RESET: TextStyle | undefined =
+  Platform.OS === 'web'
+    ? ({ outlineWidth: 0, outlineStyle: 'none' } as unknown as TextStyle)
+    : undefined;
+
 export type TextFieldProps = React.PropsWithChildren<
-  { isInvalid?: boolean } & ViewStyleProp
+  { isInvalid?: boolean; radius?: number } & ViewStyleProp
 >;
 
-export function TextField({ children, isInvalid = false, style }: TextFieldProps) {
+export function TextField({ children, isInvalid = false, radius = 10, style }: TextFieldProps) {
   const inputRef = useRef<TextInput>(null);
   const {
     state: hovered,
@@ -75,8 +91,9 @@ export function TextField({ children, isInvalid = false, style }: TextFieldProps
       onFocus,
       onBlur,
       isInvalid,
+      radius,
     }),
-    [inputRef, hovered, onHoverIn, onHoverOut, focused, onFocus, onBlur, isInvalid],
+    [inputRef, hovered, onHoverIn, onHoverOut, focused, onFocus, onBlur, isInvalid, radius],
   );
 
   return (
@@ -240,6 +257,7 @@ export function TextFieldInput({
       marginTop: 2,
       marginBottom: 2,
     }),
+    WEB_INPUT_OUTLINE_RESET,
     style,
   ]) as TextStyle;
 
@@ -272,7 +290,7 @@ export function TextFieldInput({
           a.z_10,
           a.absolute,
           a.inset_0,
-          { borderRadius: 10 },
+          { borderRadius: ctx.radius },
           { backgroundColor: theme.colors.contrast50 },
           { borderColor: 'transparent', borderWidth: 2 },
           ctx.hovered ? chromeHover : {},
@@ -393,6 +411,7 @@ function FloatingLabelInput({
     },
     android({ paddingTop: 24, paddingBottom: 6 }),
     web({ paddingTop: 25, paddingBottom: 7 }),
+    WEB_INPUT_OUTLINE_RESET,
     style,
   ]) as TextStyle;
 
@@ -444,7 +463,7 @@ function FloatingLabelInput({
           a.z_10,
           a.absolute,
           a.inset_0,
-          { borderRadius: 10 },
+          { borderRadius: ctx.radius },
           { backgroundColor: theme.colors.contrast50 },
           { borderColor: 'transparent', borderWidth: 2 },
           ctx.hovered ? chromeHover : {},

package/lib/commonjs/search-input/index.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_react","require","_reactNative","_useTheme","_index","_button","_index2","_MagnifyingGlass","_Times","_jsxRuntime","SearchInput","exports","forwardRef","value","label","onClearText","rest","ref","theme","useTheme","showClear","length","jsxs","View","style","a","w_full","relative","children","TextField","jsx","TextFieldIcon","icon","MagnifyingGlassIcon","TextFieldInput","inputRef","placeholder","returnKeyType","keyboardAppearance","mode","selectTextOnFocus","Platform","OS","autoFocus","accessibilityRole","autoCorrect","autoComplete","autoCapitalize","paddingRight","undefined","absolute","z_20","my_auto","inset_0","justify_center","pr_sm","left","Button","testID","onPress","accessibilityLabel","hitSlop","top","bottom","right","variant","size","TimesLarge_Stroke2_Corner0_Rounded","fill","colors","textSecondary","padding","minHeight","displayName"],"sourceRoot":"../../../src","sources":["search-input/index.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAEA,IAAAE,SAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AACA,IAAAK,OAAA,GAAAL,OAAA;AACA,IAAAM,gBAAA,GAAAN,OAAA;AACA,IAAAO,MAAA,GAAAP,OAAA;AAAyE,IAAAQ,WAAA,GAAAR,OAAA;AAUlE,MAAMS,WAAW,GAAAC,OAAA,CAAAD,WAAA,gBAAG,IAAAE,iBAAU,EACnC,SAASF,WAAWA,CAAC;EAAEG,KAAK;EAAEC,KAAK,GAAG,QAAQ;EAAEC,WAAW;EAAE,GAAGC;AAAK,CAAC,EAAEC,GAAG,EAAE;EAC3E,MAAMC,KAAK,GAAG,IAAAC,kBAAQ,EAAC,CAAC;EACxB,MAAMC,SAAS,GAAGP,KAAK,IAAI,IAAI,IAAIA,KAAK,CAACQ,MAAM,GAAG,CAAC;EAEnD,oBACE,IAAAZ,WAAA,CAAAa,IAAA,EAACpB,YAAA,CAAAqB,IAAI;IAACC,KAAK,EAAE,CAACC,YAAC,CAACC,MAAM,EAAED,YAAC,CAACE,QAAQ,CAAE;IAAAC,QAAA,gBAClC,IAAAnB,WAAA,CAAAa,IAAA,EAAChB,OAAA,CAAAuB,SAAS;MAAAD,QAAA,gBACR,IAAAnB,WAAA,CAAAqB,GAAA,EAACxB,OAAA,CAAAyB,aAAa;QAACC,IAAI,EAAEC;MAAoB,CAAE,CAAC,eAC5C,IAAAxB,WAAA,CAAAqB,GAAA,EAACxB,OAAA,CAAA4B,cAAc;QACbC,QAAQ,EAAElB,GAAI;QACdH,KAAK,EAAEA,KAAM;QACbD,KAAK,EAAEA,KAAM;QACbuB,WAAW,EAAEtB,KAAM;QACnBuB,aAAa,EAAC,QAAQ;QACtBC,kBAAkB,EAAEpB,KAAK,CAACqB,IAAI,KAAK,OAAO,GAAG,OAAO,GAAG,MAAO;QAC9DC,iBAAiB,EAAEC,qBAAQ,CAACC,EAAE,KAAK,KAAM;QACzCC,SAAS,EAAE,KAAM;QACjBC,iBAAiB,EAAC,QAAQ;QAC1BC,WAAW,EAAE,KAAM;QACnBC,YAAY,EAAC,KAAK;QAClBC,cAAc,EAAC,MAAM;QACrBvB,KAAK,EAAEJ,SAAS,GAAG;UAAE4B,YAAY,EAAE;QAAG,CAAC,GAAGC,SAAU;QAAA,GAChDjC;MAAI,CACT,CAAC;IAAA,CACO,CAAC,EAEXI,SAAS,iBACR,IAAAX,WAAA,CAAAqB,GAAA,EAAC5B,YAAA,CAAAqB,IAAI;MACHC,KAAK,EAAE,CACLC,YAAC,CAACyB,QAAQ,EACVzB,YAAC,CAAC0B,IAAI,EACN1B,YAAC,CAAC2B,OAAO,EACT3B,YAAC,CAAC4B,OAAO,EACT5B,YAAC,CAAC6B,cAAc,EAChB7B,YAAC,CAAC8B,KAAK,EACP;QAAEC,IAAI,EAAE;MAAO,CAAC,CAChB;MAAA5B,QAAA,eACF,IAAAnB,WAAA,CAAAqB,GAAA,EAACzB,OAAA,CAAAoD,MAAM;QACLC,MAAM,EAAC,yBAAyB;QAChCC,OAAO,EAAE5C,WAAY;QACrB6C,kBAAkB,EAAC,oBAAoB;QACvCC,OAAO,EAAE;UAAEC,GAAG,EAAE,EAAE;UAAEC,MAAM,EAAE,EAAE;UAAEP,IAAI,EAAE,EAAE;UAAEQ,KAAK,EAAE;QAAG,CAAE;QACtDC,OAAO,EAAC,OAAO;QACfC,IAAI,EAAC,OAAO;QACZlC,IAAI,eAAE,IAAAvB,WAAA,CAAAqB,GAAA,EAACtB,MAAA,CAAA2D,kCAAC;UAACC,IAAI,EAAElD,KAAK,CAACmD,MAAM,CAACC,aAAc;UAACJ,IAAI,EAAC;QAAI,CAAE,CAAE;QACxD1C,KAAK,EAAE;UAAE+C,OAAO,EAAE,CAAC;UAAEC,SAAS,EAAE;QAAE;MAAE,CACrC;IAAC,CACE,CACP;EAAA,CACG,CAAC;AAEX,CACF,CAAC;AACD9D,WAAW,CAAC+D,WAAW,GAAG,aAAa","ignoreList":[]}

package/lib/module/search-input/index.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["forwardRef","Platform","View","useTheme","atoms","a","Button","TextField","TextFieldIcon","TextFieldInput","MagnifyingGlass_Stroke2_Corner0_Rounded","MagnifyingGlassIcon","TimesLarge_Stroke2_Corner0_Rounded","X","jsx","_jsx","jsxs","_jsxs","SearchInput","value","label","onClearText","rest","ref","theme","showClear","length","style","w_full","relative","children","icon","inputRef","placeholder","returnKeyType","keyboardAppearance","mode","selectTextOnFocus","OS","autoFocus","accessibilityRole","autoCorrect","autoComplete","autoCapitalize","paddingRight","undefined","absolute","z_20","my_auto","inset_0","justify_center","pr_sm","left","testID","onPress","accessibilityLabel","hitSlop","top","bottom","right","variant","size","fill","colors","textSecondary","padding","minHeight","displayName"],"sourceRoot":"../../../src","sources":["search-input/index.tsx"],"mappings":"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","ignoreList":[]}

package/lib/typescript/commonjs/search-input/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/search-input/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAY,KAAK,SAAS,EAAQ,MAAM,cAAc,CAAC;AAK9D,OAAO,EAA4C,KAAK,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAYnG,eAAO,MAAM,WAAW;YAPd,mBAAmB,CAAC,OAAO,CAAC;IACpC;;OAEG;kBACW,MAAM,IAAI;6CAwDzB,CAAC"}

package/lib/typescript/module/search-input/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/search-input/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAY,KAAK,SAAS,EAAQ,MAAM,cAAc,CAAC;AAK9D,OAAO,EAA4C,KAAK,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAYnG,eAAO,MAAM,WAAW;YAPd,mBAAmB,CAAC,OAAO,CAAC;IACpC;;OAEG;kBACW,MAAM,IAAI;6CAwDzB,CAAC"}