@oxyhq/bloom 1.6.0 → 1.8.0

package/src/teleport/PortalView.tsx

@@ -0,0 +1,94 @@
+/**
+ * COPIED FROM react-native-teleport 1.2.0 — `src/views/Portal/index.tsx`
+ * MIT, Copyright (c) 2025 Kiryl Ziusko. Full licence in `NOTICE` at the root.
+ *
+ * Changed: import paths only, for this flat directory.
+ */
+/// <reference lib="dom" />
+
+import { useRef, useLayoutEffect, useCallback } from "react";
+import { createPortal } from "react-dom";
+import { usePortalRegistryContext } from "./portal-registry";
+import type { PortalProps } from "./types";
+
+const supportsMoveBefore =
+  typeof Element !== "undefined" && "moveBefore" in Element.prototype;
+
+function moveElementTo(
+  parent: Element,
+  child: Element,
+  before: Element | null = null,
+) {
+  if (supportsMoveBefore && child.parentNode) {
+    parent.moveBefore(child, before);
+    return;
+  }
+
+  if (child.parentNode) {
+    child.parentNode.removeChild(child);
+  }
+
+  parent.insertBefore(child, before);
+}
+
+export default function Portal({ hostName, children, style }: PortalProps) {
+  const { getHost, registerPendingPortal, unregisterPendingPortal } =
+    usePortalRegistryContext();
+  const elRef = useRef<HTMLDivElement | null>(null);
+  if (!elRef.current) {
+    elRef.current = document.createElement("div");
+  }
+
+  const sentinelRef = useRef<HTMLDivElement>(null);
+
+  useLayoutEffect(() => {
+    if (elRef.current && style) {
+      Object.assign(elRef.current.style, style);
+    }
+  }, [style]);
+
+  const teleportToHost = useCallback(() => {
+    const el = elRef.current;
+    if (!el) return;
+
+    const hostNode = hostName ? getHost(hostName) : null;
+    if (hostNode) {
+      // teleport view to the host
+      moveElementTo(hostNode, el);
+    } else if (sentinelRef.current && sentinelRef.current.parentElement) {
+      // keep view locally
+      const parent = sentinelRef.current.parentElement;
+      moveElementTo(parent, el, sentinelRef.current);
+    }
+  }, [hostName, getHost]);
+
+  useLayoutEffect(() => {
+    teleportToHost();
+
+    if (!hostName) return;
+
+    registerPendingPortal(hostName, teleportToHost);
+    return () => {
+      unregisterPendingPortal(hostName, teleportToHost);
+    };
+  }, [
+    hostName,
+    registerPendingPortal,
+    unregisterPendingPortal,
+    teleportToHost,
+  ]);
+
+  return (
+    <>
+      {createPortal(children, elRef.current)}
+      {/* Invisible sentinel for local position */}
+      <div ref={sentinelRef} style={styles.anchor} />
+    </>
+  );
+}
+
+const styles = {
+  anchor: {
+    display: "contents",
+  },
+};

package/src/teleport/index.ts

@@ -0,0 +1,32 @@
+/**
+ * react-native-teleport, vendored.
+ *
+ * COPIED FROM react-native-teleport 1.2.0 — `src/index.ts`. MIT, Copyright (c)
+ * 2025 Kiryl Ziusko; the full licence is in `NOTICE` at the repository root and
+ * every file in this directory names the file it came from.
+ *
+ * It is here rather than as a dependency because Bloom needs its NATIVE
+ * re-parenting — moving one platform view between hosts instead of mounting a
+ * second one — and that arrives as Fabric components, not as JavaScript.
+ *
+ * WHAT IS DIFFERENT FROM UPSTREAM, and it is not their code: **Bloom mounts
+ * these portals from its ROOT LAYER, never from the origin screen.** Their own
+ * recipe mounts the `<Portal>` inside the screen the media starts on, which is
+ * correct for a navigator that keeps that screen alive — and measured against
+ * expo-router on web, where the origin route unmounts on the URL change, it
+ * takes the media with it (`count 1 -> 0 -> 0`). The portal is not what fails
+ * there; the ownership is. Same piece, mounted where it does not die.
+ *
+ * Changed: import paths only, for this flat directory. Their file layout uses
+ * `index.tsx` per component, which Bloom's family-layout gate reserves for pure
+ * barrels, so each one is named after what it exports.
+ */
+export { default as PortalHost } from './PortalHost';
+export { default as Portal } from './Portal';
+export { default as PortalProvider } from './PortalProvider';
+export { default as usePortal } from './use-portal';
+export type {
+  PortalHostProps,
+  PortalProps,
+  PortalProviderProps,
+} from './types';

package/src/teleport/portal-manager.tsx

@@ -0,0 +1,48 @@
+/**
+ * COPIED FROM react-native-teleport 1.2.0 — `src/contexts/PortalManager.tsx`
+ * MIT, Copyright (c) 2025 Kiryl Ziusko. Full licence in `NOTICE` at the root.
+ *
+ * Changed: import paths only, for this flat directory.
+ */
+import {
+  createContext,
+  useContext,
+  useReducer,
+  useMemo,
+  type ReactNode,
+} from "react";
+import {
+  initialState,
+  reducer,
+  type Action,
+  type PortalState,
+} from "./reducer";
+
+const PortalManagerContext = createContext<
+  { state: PortalState; dispatch: React.Dispatch<Action> } | undefined
+>(undefined);
+
+export const PortalManagerProvider = ({
+  children,
+}: {
+  children: ReactNode;
+}) => {
+  const [state, dispatch] = useReducer(reducer, initialState);
+  const context = useMemo(() => ({ state, dispatch }), [state, dispatch]);
+
+  return (
+    <PortalManagerContext.Provider value={context}>
+      {children}
+    </PortalManagerContext.Provider>
+  );
+};
+
+export const usePortalManagerContext = () => {
+  const context = useContext(PortalManagerContext);
+
+  if (!context) {
+    throw new Error("usePortalContext must be used within PortalProvider");
+  }
+
+  return context;
+};

package/src/teleport/portal-registry.ts

@@ -0,0 +1,27 @@
+/**
+ * COPIED FROM react-native-teleport 1.2.0 — `src/contexts/PortalRegistry.ts`
+ * MIT, Copyright (c) 2025 Kiryl Ziusko. Full licence in `NOTICE` at the root.
+ *
+ * Changed: nothing — byte-for-byte, only its path.
+ */
+import { createContext, useContext } from "react";
+
+type PortalRegistryContextType = {
+  registerHost: (name: string, node: HTMLElement | null) => void;
+  getHost: (name: string) => HTMLElement | null;
+  registerPendingPortal: (name: string, callback: () => void) => void;
+  unregisterPendingPortal: (name: string, callback: () => void) => void;
+};
+
+export const PortalRegistryContext =
+  createContext<PortalRegistryContextType | null>(null);
+
+export function usePortalRegistryContext() {
+  const context = useContext(PortalRegistryContext);
+  if (!context) {
+    throw new Error(
+      "usePortalRegistryContext must be used within a PortalRegistryContext",
+    );
+  }
+  return context;
+}

package/src/teleport/reducer.ts

@@ -0,0 +1,94 @@
+/**
+ * COPIED FROM react-native-teleport 1.2.0 — `src/state/reducer.ts`
+ * MIT, Copyright (c) 2025 Kiryl Ziusko. Full licence in `NOTICE` at the root.
+ *
+ * Changed: nothing — byte-for-byte, only its path.
+ */
+import type { ScrollViewContextValue } from "./scroll-view-context/types";
+
+export type PortalState = {
+  removed: Record<string, Record<string, Record<string, boolean>>>;
+  hosts: Record<string, number>;
+  hostScrollViewContexts: Record<string, ScrollViewContextValue | undefined>;
+};
+
+export type Action =
+  | { type: "REMOVE_PORTAL"; hostName: string; name: string }
+  | {
+      type: "CLEAR_REMOVED_ON_UNMOUNT";
+      hostName: string;
+      name: string;
+      instanceId: string;
+    }
+  | {
+      type: "REGISTER_PORTAL";
+      hostName: string;
+      name: string;
+      instanceId: string;
+    }
+  | { type: "REGISTER_HOST"; hostName: string }
+  | { type: "UNREGISTER_HOST"; hostName: string }
+  | {
+      type: "SET_HOST_SCROLL_VIEW_CONTEXT";
+      hostName: string;
+      value: ScrollViewContextValue;
+    };
+
+export const initialState: PortalState = {
+  removed: {},
+  hosts: {},
+  hostScrollViewContexts: {},
+};
+
+export const reducer = (state: PortalState, action: Action): PortalState => {
+  const cloned = {
+    ...state,
+    removed: { ...state.removed },
+    hostScrollViewContexts: { ...state.hostScrollViewContexts },
+  };
+  const hostRemoved =
+    "name" in action ? cloned.removed[action.hostName] || {} : {};
+  cloned.removed[action.hostName] = hostRemoved;
+  const nameRemoved = "name" in action ? hostRemoved[action.name] || {} : {};
+  if ("name" in action) {
+    hostRemoved[action.name] = nameRemoved;
+  }
+
+  switch (action.type) {
+    case "REGISTER_HOST": {
+      const hosts = { ...cloned.hosts };
+      hosts[action.hostName] = (hosts[action.hostName] || 0) + 1;
+      return { ...cloned, hosts };
+    }
+    case "UNREGISTER_HOST": {
+      const hosts = { ...cloned.hosts };
+      const count = (hosts[action.hostName] || 0) - 1;
+      if (count <= 0) {
+        delete hosts[action.hostName];
+        delete cloned.hostScrollViewContexts[action.hostName];
+      } else {
+        hosts[action.hostName] = count;
+      }
+      return { ...cloned, hosts };
+    }
+    case "SET_HOST_SCROLL_VIEW_CONTEXT":
+      cloned.hostScrollViewContexts[action.hostName] = action.value;
+      return cloned;
+    case "REGISTER_PORTAL":
+      if (!nameRemoved[action.instanceId]) {
+        nameRemoved[action.instanceId] = false;
+      }
+      return cloned;
+    case "REMOVE_PORTAL":
+      Object.keys(nameRemoved).forEach((id) => (nameRemoved[id] = true));
+      return cloned;
+    case "CLEAR_REMOVED_ON_UNMOUNT":
+      delete nameRemoved[action.instanceId];
+      if (Object.keys(nameRemoved).length === 0) {
+        delete hostRemoved[action.name];
+      }
+      return cloned;
+    default:
+      return state;
+  }
+};

package/src/teleport/scroll-view-context/context.native.ts

@@ -0,0 +1,19 @@
+/**
+ * COPIED FROM react-native-teleport 1.2.0 — `src/contexts/ScrollViewContext/index.native.ts`
+ * MIT, Copyright (c) 2025 Kiryl Ziusko. Full licence in `NOTICE` at the root.
+ *
+ * Changed: import paths, and `ScrollView.Context` is reached through a cast
+ * because Bloom does not compile with their `react-native-strict-api` condition,
+ * which is the only place that property is declared.
+ */
+import type { Context } from "react";
+import { ScrollView } from "react-native";
+import type { ScrollViewContextValue } from "./types";
+
+// Bloom does not compile with their `react-native-strict-api` condition, and
+// `ScrollView.Context` is only declared there. Reached through the shape it has
+// at runtime instead; the value and the behaviour are theirs, unchanged.
+const ScrollViewContext = (ScrollView as unknown as { Context: Context<ScrollViewContextValue> })
+  .Context;
+
+export default ScrollViewContext;

package/src/teleport/scroll-view-context/context.ts

@@ -0,0 +1,12 @@
+/**
+ * COPIED FROM react-native-teleport 1.2.0 — `src/contexts/ScrollViewContext/index.ts`
+ * MIT, Copyright (c) 2025 Kiryl Ziusko. Full licence in `NOTICE` at the root.
+ *
+ * Changed: import paths only, for this flat directory.
+ */
+import { createContext } from "react";
+import type { ScrollViewContextValue } from "./types";
+
+const ScrollViewContext = createContext<ScrollViewContextValue>(null);
+
+export default ScrollViewContext;

package/src/teleport/scroll-view-context/types.ts

@@ -0,0 +1,7 @@
+/**
+ * COPIED FROM react-native-teleport 1.2.0 — `src/contexts/ScrollViewContext/types.ts`
+ * MIT, Copyright (c) 2025 Kiryl Ziusko. Full licence in `NOTICE` at the root.
+ *
+ * Changed: nothing — byte-for-byte, only its path.
+ */
+export type ScrollViewContextValue = { horizontal: boolean } | null;

package/src/teleport/specs/PortalHostViewNativeComponent.ts

@@ -0,0 +1,15 @@
+/**
+ * COPIED FROM react-native-teleport 1.2.0 — `src/specs/PortalHostViewNativeComponent.ts`
+ * MIT, Copyright (c) 2025 Kiryl Ziusko. Full licence in `NOTICE` at the root.
+ *
+ * Changed: nothing — byte-for-byte, only its path.
+ */
+import { codegenNativeComponent, type ViewProps } from "react-native";
+
+interface NativeProps extends ViewProps {
+  name?: string;
+}
+
+export default codegenNativeComponent<NativeProps>("PortalHostView", {
+  interfaceOnly: true,
+});

package/src/teleport/specs/PortalViewNativeComponent.ts

@@ -0,0 +1,16 @@
+/**
+ * COPIED FROM react-native-teleport 1.2.0 — `src/specs/PortalViewNativeComponent.ts`
+ * MIT, Copyright (c) 2025 Kiryl Ziusko. Full licence in `NOTICE` at the root.
+ *
+ * Changed: nothing — byte-for-byte, only its path.
+ */
+import { codegenNativeComponent, type ViewProps } from "react-native";
+
+interface NativeProps extends ViewProps {
+  name?: string;
+  hostName?: string;
+}
+
+export default codegenNativeComponent<NativeProps>("PortalView", {
+  interfaceOnly: true,
+});

package/src/teleport/teleport-global.d.ts

@@ -0,0 +1,11 @@
+/**
+ * COPIED FROM react-native-teleport 1.2.0 — `src/global.d.ts`
+ * MIT, Copyright (c) 2025 Kiryl Ziusko. Full licence in `NOTICE` at the root.
+ *
+ * Changed: nothing — byte-for-byte, only its path. `moveBefore` is newer than
+ * TypeScript's DOM library, and this is how they declare it.
+ */
+// https://developer.mozilla.org/en-US/docs/Web/API/Element/moveBefore
+interface Node {
+  moveBefore(node: Node, child: Node | null): void;
+}

package/src/teleport/types.ts

@@ -0,0 +1,22 @@
+/**
+ * COPIED FROM react-native-teleport 1.2.0 — `src/types/index.ts`
+ * MIT, Copyright (c) 2025 Kiryl Ziusko. Full licence in `NOTICE` at the root.
+ *
+ * Changed: nothing — byte-for-byte, only its path.
+ */
+import type { StyleProp, ViewStyle } from "react-native";
+
+export type PortalProviderProps = {
+  children: React.ReactNode;
+};
+export type PortalHostProps = {
+  name: string;
+  style?: StyleProp<ViewStyle>;
+  children?: React.ReactNode;
+};
+export type PortalProps = {
+  name?: string;
+  hostName?: string;
+  style?: StyleProp<ViewStyle>;
+  children?: React.ReactNode;
+};

package/src/teleport/use-id.ts

@@ -0,0 +1,18 @@
+/**
+ * COPIED FROM react-native-teleport 1.2.0 — `src/hooks/useId.ts`
+ * MIT, Copyright (c) 2025 Kiryl Ziusko. Full licence in `NOTICE` at the root.
+ *
+ * Changed: nothing — byte-for-byte, only its path.
+ */
+import { useRef } from "react";
+
+let __idCounter = 0;
+
+export default function useId(prefix = "uid"): string {
+  const idRef = useRef<string>("");
+  if (!idRef.current) {
+    const n = ++__idCounter;
+    idRef.current = `${prefix}-${n}`;
+  }
+  return idRef.current;
+}

package/src/teleport/use-portal.ts

@@ -0,0 +1,47 @@
+/**
+ * COPIED FROM react-native-teleport 1.2.0 — `src/hooks/usePortal.ts`
+ * MIT, Copyright (c) 2025 Kiryl Ziusko. Full licence in `NOTICE` at the root.
+ *
+ * Changed: import paths only, for this flat directory.
+ */
+import { usePortalManagerContext } from "./portal-manager";
+
+/**
+ * The `usePortal` hook allows you to manage portals in imperative way.
+ *
+ * @category hooks
+ * @param `hostName` - `name` of the `<PortalHost />` component
+ * @returns an object that helps to manipulate portals
+ * @example
+ * ```tsx
+ * import { usePortal } from "react-native-teleport";
+ * export default function App() {
+ *   const { removePortal, isHostAvailable } = usePortal("root");
+ *   return (
+ *     <View style={{ flex: 1 }}>
+ *       <Text>{isHostAvailable ? "Host is available" : "Host is not available"}</Text>
+ *       <Button title="Remove" onPress={() => removePortal("portal")} />
+ *     </View>
+ *   );
+ * }
+ * ```
+ */
+export default function usePortal(hostName: string = "root") {
+  const { state, dispatch } = usePortalManagerContext();
+
+  return {
+    /**
+     * Whether a `<PortalHost />` with the given `hostName` is currently mounted.
+     */
+    isHostAvailable: (state.hosts[hostName] ?? 0) > 0,
+    /**
+     * Remove portal from host container. Subsequent re-renders will not restore portal,
+     * but if you mount a new portal with the same name it will be shown (i. e. hook doesn't
+     * prevent new portal from being added).
+     *
+     * @param name - `name` of `<Portal />` component.
+     */
+    removePortal: (name: string) =>
+      dispatch({ type: "REMOVE_PORTAL", hostName, name }),
+  };
+}